.fokus21-nime {
--nime-yellow: #ffdf00;
--nime-red: #a2260b;
--nime-cream: #fbf3dd;
--nime-ink: #3b2525;
--nime-border: #e8d7b9;
--nime-radius: 24px;
--nime-padding: clamp(20px, 4vw, 58px);
--nime-gap: clamp(12px, 2vw, 24px);
color: var(--nime-ink);
}
#content .fokus21-nime #primary {
float: none;
min-width: 0;
width: 100%;
padding: 0;
}
#content .fokus21-nime .site-main {
padding: 0;
min-width: 0;
background: transparent;
}
.fokus21-nime .fokus21-nime-article {
margin: 0;
padding: 0;
background: transparent;
box-shadow: none;
overflow-wrap: anywhere;
}
.fokus21-nime .fokus21-nime-hero {
display: grid;
grid-template-columns: minmax(0, 1.4fr) minmax(0, .85fr);
align-items: center;
gap: clamp(20px, 5vw, 76px);
padding: var(--nime-padding);
border-radius: var(--nime-radius);
background: var(--nime-yellow);
color: var(--nime-ink);
}
.fokus21-nime .fokus21-nime-eyebrow {
margin: 0 0 16px;
color: var(--nime-red);
font-size: clamp(.82rem, 1.6vw, .95rem);
font-weight: 700;
letter-spacing: .03em;
}
.fokus21-nime .fokus21-nime-title {
margin: 0;
padding: 0;
color: var(--nime-red);
font: 700 clamp(2.2rem, 5.65vw, 5.35rem)/1.04 Georgia, 'Times New Roman', serif; font-size: clamp(2.2rem, 5.65vw, 5.35rem) !important;
letter-spacing: -.025em;
}
.fokus21-nime .fokus21-nime-lead {
max-width: 40em;
margin: 18px 0 0;
color: var(--nime-ink);
font-size: clamp(1.05rem, 2.1vw, 1.35rem);
line-height: 1.5;
}
.fokus21-nime .fokus21-nime-actions {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 24px;
}
.fokus21-nime .fokus21-nime-cta,
.fokus21-nime .fokus21-nime-cta:visited {
display: inline-flex;
align-items: center;
gap: .6em;
min-height: 46px;
padding: 10px 19px;
border: 1px solid transparent;
border-radius: 12px;
background: var(--nime-red);
color: #fff;
font-size: 1rem;
font-weight: 700;
line-height: 1.35;
text-decoration: none;
}
.fokus21-nime .fokus21-nime-cta-secondary,
.fokus21-nime .fokus21-nime-cta-secondary:visited {
border-color: var(--nime-red);
background: #fff4b7;
color: var(--nime-red);
}
.fokus21-nime .fokus21-nime-cta:hover,
.fokus21-nime .fokus21-nime-cta:focus-visible {
background: var(--nime-ink);
color: #fff;
}
.fokus21-nime a:focus-visible,
.fokus21-nime button:focus-visible,
.fokus21-nime summary:focus-visible {
outline: 3px solid var(--nime-red);
outline-offset: 3px;
}
.fokus21-nime .fokus21-nime-hero-art {
display: grid;
place-items: center;
min-width: 0;
min-height: clamp(220px, 28vw, 340px);
padding: clamp(18px, 4vw, 56px);
border-radius: calc(var(--nime-radius) - 4px);
background: #fff195;
}
.fokus21-nime .fokus21-nime-hero-art img {
display: block;
width: min(100%, 260px);
height: auto;
}
.fokus21-nime .fokus21-nime-entry {
min-width: 0;
margin: var(--nime-gap) 0 0;
padding: var(--nime-padding);
border: 1px solid var(--nime-border);
border-radius: var(--nime-radius);
background: #fffdf9;
color: var(--nime-ink);
}
.fokus21-nime .fokus21-nime-entry .entry-content {
margin: 0;
padding: 0;
color: var(--nime-ink);
font-size: clamp(1rem, 1.3vw, 1.125rem) !important;
line-height: 1.65;
}
body .fokus21-nime .entry-content :is(p, li):not(.has-text-align-center, .has-text-align-right, .has-text-align-justify) {
text-align: start;
}
.fokus21-nime .entry-content :is(p, li):not(.has-custom-font-size, [class*="-font-size"], [style*="font-size"]) {
font-size: inherit !important;
}
.fokus21-nime .entry-content > :where(p, ul, ol, blockquote, h2, h3, h4, h5, h6, details) {
max-width: 74ch;
}
.fokus21-nime .entry-content :is(h2, h3):not(.has-text-color) {
color: var(--nime-red);
font-family: Georgia, 'Times New Roman', serif;
font-weight: 700;
line-height: 1.18;
}
.fokus21-nime .entry-content :is(h2, h3) { text-transform: none; }
.fokus21-nime .entry-content .wp-block-group .wp-block-heading {
display: block;
padding: 0;
text-transform: none;
}
.fokus21-nime .entry-content h2:not(.has-custom-font-size, [class*="-font-size"], [style*="font-size"]) {
font-size: clamp(1.65rem, 3vw, 2.35rem) !important;
}
.fokus21-nime .entry-content h3:not(.has-custom-font-size, [class*="-font-size"], [style*="font-size"]) {
font-size: clamp(1.25rem, 2.1vw, 1.55rem) !important;
}
.fokus21-nime .entry-content :where(h2, h3) {
margin-block: 1.25em .5em;
}
.fokus21-nime .entry-content :where(p, ul, ol) {
margin-block: 0 1em;
}
.fokus21-nime .entry-content :where(ul, ol):not(.wp-block-post-template) {
padding-inline-start: 1.25em;
list-style-position: outside;
}
.fokus21-nime .entry-content :where(h2, h3, p, ul, ol):first-child { margin-top: 0; }
.fokus21-nime .entry-content :where(p, ul, ol):last-child { margin-bottom: 0; }
.fokus21-nime .fokus21-nime-entry,
.fokus21-nime .entry-content [id] { scroll-margin-top: 110px; }
body #content .fokus21-nime .entry-content a:where(:not(.wp-element-button, .wp-block-button__link, .wp-block-file__button, .has-text-color)) {
border-bottom: 0;
color: var(--nime-red);
text-decoration: underline;
text-underline-offset: .18em;
}
.fokus21-nime .entry-content .wp-block-columns,
.fokus21-nime .entry-content .wp-block-column { min-width: 0; }
body .fokus21-nime .entry-content :is(.alignwide, .alignfull) {
width: 100%;
max-width: 100%;
margin-inline: 0;
}
.fokus21-nime .entry-content .wp-block-table {
max-width: 100%;
overflow-x: auto;
}
.fokus21-nime .entry-content .wp-block-table td,
.fokus21-nime .entry-content .wp-block-table th {
min-width: 7.25rem;
color: var(--nime-ink);
overflow-wrap: normal;
}
.fokus21-nime .entry-content .wp-block-table table {
display: table;
width: max-content;
min-width: 100%;
max-width: none;
margin: 0;
overflow: visible;
table-layout: auto;
}
.fokus21-nime .entry-content .wp-block-table th {
background: var(--nime-cream);
color: var(--nime-ink);
}
.fokus21-nime .entry-content :where(.wp-block-file, .wp-block-details) {
max-width: 100%;
padding: 14px 18px;
border: 1px solid var(--nime-border);
border-radius: 14px;
background: #fff;
}
.fokus21-nime .entry-content .wp-block-file {
font-size: inherit;
overflow-wrap: anywhere;
}
.fokus21-nime .entry-content .wp-block-details summary {
color: var(--nime-red);
cursor: pointer;
font-weight: 700;
}
.fokus21-nime .entry-content .wp-block-details[open] summary { margin-bottom: .75em; }
.fokus21-nime .entry-content .wp-block-file .wp-block-file__button,
.fokus21-nime .entry-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background) {
display: inline-block;
padding: .62em .95em;
border-radius: 10px;
background: var(--nime-red);
color: #fff;
font-weight: 700;
text-decoration: none;
}
.fokus21-nime .entry-content .wp-block-file .wp-block-file__button { margin-block: .35em; }
.fokus21-nime .entry-content .wp-block-buttons { flex-wrap: wrap; }
.fokus21-nime .entry-content :where(img, video, iframe, embed, object, input) { max-width: 100%; }
.fokus21-nime .entry-content .fokus21-nime-intro,
.fokus21-nime .entry-content .fokus21-nime-grid {
display: grid;
gap: var(--nime-gap);
}
.fokus21-nime .entry-content .fokus21-nime-intro { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
.fokus21-nime .entry-content .fokus21-nime-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fokus21-nime .entry-content .fokus21-nime-card,
.fokus21-nime .entry-content .fokus21-nime-note {
min-width: 0;
margin: 0;
padding: clamp(18px, 3vw, 32px);
border: 1px solid var(--nime-border);
border-radius: calc(var(--nime-radius) - 6px);
background: #fff;
}
.fokus21-nime .entry-content .fokus21-nime-audience { background: var(--nime-cream); }
.fokus21-nime .entry-content .fokus21-nime-audience li + li { margin-top: .4em; }
.fokus21-nime .entry-content .fokus21-nime-directions,
.fokus21-nime .entry-content .fokus21-nime-note {
margin-top: clamp(20px, 4vw, 40px);
}
.fokus21-nime .entry-content .fokus21-nime-note {
background: var(--nime-red);
color: #fff;
}
.fokus21-nime .entry-content .fokus21-nime-note h2:not(.has-text-color),
body #content .fokus21-nime .entry-content .fokus21-nime-note a:not(.has-text-color) { color: #fff; }
.fokus21-nime .entry-content .fokus21-nime-note a:focus-visible { outline-color: #fff; }
.fokus21-nime .entry-content .fokus21-nime-materials-placeholder {
margin-top: clamp(20px, 4vw, 40px);
padding: clamp(18px, 3vw, 32px);
border: 1px solid var(--nime-border);
border-radius: calc(var(--nime-radius) - 6px);
background: var(--nime-cream);
}
.fokus21-nime .fokus21-nime-editor { padding: 14px 0; }
@media (max-width: 760px) {
.fokus21-nime { --nime-radius: 18px; }
.fokus21-nime .fokus21-nime-hero,
.fokus21-nime .entry-content .fokus21-nime-intro,
.fokus21-nime .entry-content .fokus21-nime-grid { grid-template-columns: minmax(0, 1fr); }
.fokus21-nime .fokus21-nime-hero-art {
min-height: 0;
padding: 22px;
}
.fokus21-nime .fokus21-nime-hero-art img { width: min(66%, 160px); }
.fokus21-nime .entry-content .wp-block-file .wp-block-file__button { margin-inline-start: 0; }
}