/* ===== Design Refinement v1 ===== */
:root {
/* Largura de PAGINA (layout). Nao confundir com a medida de LEITURA abaixo. */
--dfb-page-width: 1280px;
--dfb-measure: 68ch;
--dfb-measure-tight: 58ch;
--dfb-gap-compact: clamp(14px, 2vw, 24px);
--dfb-section-padding: clamp(18px, 3vw, 40px);
--dfb-page-edge-padding: var(--dfb-gap-compact);
--dfb-post-card-padding: clamp(18px, 2.5vw, 26px);
--dfb-post-card-margin: clamp(16px, 2.4vw, 24px);
--dfb-rhythm: 1.35;
--dfb-rhythm-tight: 1.62;
--dfb-rhythm-blockquote: 1.7;
--dfb-headline-soft: color-mix(in srgb, var(--dfb-text) 82%, #fff);
--dfb-rhythm-scale: clamp(0.92, calc((100vw - 320px) / 1600 + 0.86), 1.25);
--dfb-rhythm-space-xxs: calc(0.5rem * var(--dfb-rhythm-scale));
--dfb-rhythm-space-xs: calc(0.72rem * var(--dfb-rhythm-scale));
--dfb-rhythm-space-sm: calc(0.94rem * var(--dfb-rhythm-scale));
--dfb-rhythm-space-md: calc(1.18rem * var(--dfb-rhythm-scale));
--dfb-rhythm-space-lg: calc(1.48rem * var(--dfb-rhythm-scale));
--dfb-rhythm-space-xl: calc(1.9rem * var(--dfb-rhythm-scale));
--dfb-rhythm-space-xxl: calc(2.45rem * var(--dfb-rhythm-scale));
--dfb-rhythm-space-xxxl: calc(3rem * var(--dfb-rhythm-scale));
--dfb-rhythm-space-sections: clamp(2.2rem, 4.6vw, 3.5rem);
--dfb-rhythm-space-decor: clamp(2.2rem, 2.9vw, 3.4rem);
--dfb-rhythm-space-group-v: calc(2.05rem * var(--dfb-rhythm-scale));
--dfb-rhythm-space-hero-top: clamp(2.6rem, 4vw, 4.6rem);
--dfb-rhythm-space-hero-inner: clamp(1.15rem, 2.4vw, 1.9rem);
--dfb-rhythm-space-gutter-md: calc(0.875rem * var(--dfb-rhythm-scale));
--dfb-rhythm-space-gutter-lg: calc(1rem * var(--dfb-rhythm-scale));
--dfb-rhythm-space-gutter-sm: calc(0.75rem * var(--dfb-rhythm-scale));
--dfb-font-size-nav: calc(0.75rem * var(--dfb-rhythm-scale));
--dfb-font-size-fine: calc(0.68rem * var(--dfb-rhythm-scale));
--dfb-font-size-hero-kicker: clamp(0.73rem, 1.1vw, 0.86rem);
--dfb-font-size-hero-title: clamp(1.62rem, 3.8vw, 2.65rem);
--dfb-font-size-hero-excerpt: clamp(1.02rem, 1.58vw, 1.18rem);
--dfb-anchor-offset: clamp(72px, 9vw, 96px);
--dfb-motion-soft: cubic-bezier(0.22, 1, 0.36, 1);
}
body.dfb-design ::selection {
background: color-mix(in srgb, var(--dfb-accent) 26%, transparent);
color: var(--dfb-text);
}
body.dfb-design {
--focus-ring: 0 0 0 3px color-mix(in srgb, var(--dfb-accent) 28%, transparent);
scroll-padding-top: var(--dfb-anchor-offset);
text-rendering: geometricPrecision;
font-synthesis: none;
}
body.dfb-design.dfb-editorial-mode {
--dfb-accent: #7ad2ff;
--dfb-accent-glow: transparent;
--dfb-accent-dim: rgba(122, 210, 255, 0.12);
--dfb-accent-soft: rgba(122, 210, 255, 0.42);
--dfb-surface: #12121c;
--dfb-surface-2: #171726;
--dfb-surface-3: #1c1c2f;
--dfb-border: rgba(255, 255, 255, 0.09);
}
body.dfb-design .site-header {
background: linear-gradient(180deg, color-mix(in srgb, var(--dfb-surface) 88%, transparent), var(--dfb-surface));
backdrop-filter: saturate(125%) blur(8px);
border-bottom: 1px solid color-mix(in srgb, var(--dfb-border) 78%, transparent);
position: relative;
z-index: 80;
transition: border-color 0.22s var(--dfb-motion-soft);
}
body.dfb-design.dfb-scrolled .site-header {
border-bottom-color: color-mix(in srgb, var(--dfb-accent) 24%, var(--dfb-border));
}
body.dfb-design .site-header::after {
content: '';
position: absolute;
inset: 0;
z-index: -1;
opacity: 0;
pointer-events: none;
box-shadow: 0 18px 36px -24px color-mix(in srgb, var(--dfb-accent) 90%, transparent);
transition: opacity 0.22s var(--dfb-motion-soft);
}
body.dfb-design.dfb-scrolled .site-header::after {
opacity: 0.65;
}
body.dfb-design .inside-header {
max-width: min(100%, var(--dfb-page-width));
margin-left: auto;
margin-right: auto;
padding-left: var(--dfb-page-edge-padding);
padding-right: var(--dfb-page-edge-padding);
}
body.dfb-design .site-header .main-title a,
body.dfb-design .site-header .main-title a:hover,
body.dfb-design .site-header .main-title a:focus {
font-family: var(--dfb-font-display);
font-size: 1.1rem;
letter-spacing: 0.015em;
text-transform: none;
}
body.dfb-design .main-navigation {
margin-top: 0.15em;
}
body.dfb-design .main-navigation .inside-navigation {
gap: var(--dfb-rhythm-space-sm);
}
body.dfb-design .main-navigation .menu-toggle {
border: 1px solid color-mix(in srgb, var(--dfb-accent) 26%, var(--dfb-border));
border-radius: 999px;
padding-top: 0.34rem;
padding-bottom: 0.34rem;
min-height: 38px;
background: color-mix(in srgb, var(--dfb-surface-3) 84%, transparent);
color: var(--dfb-text-2);
transition: border-color 0.2s ease, color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}
body.dfb-design .main-navigation .menu-toggle .mobile-menu {
margin-left: 0.4rem;
font-size: 0.67rem;
letter-spacing: 0.11em;
}
body.dfb-design .main-navigation .menu-toggle svg {
width: 16px;
height: 16px;
transition: transform 0.2s ease, opacity 0.2s ease;
}
body.dfb-design .main-navigation .menu-toggle:hover,
body.dfb-design .main-navigation .menu-toggle:focus-visible {
color: var(--dfb-accent);
border-color: color-mix(in srgb, var(--dfb-accent) 58%, transparent);
background: color-mix(in srgb, var(--dfb-accent) 15%, transparent);
transform: translateY(-1px);
}
body.dfb-design .main-navigation .menu-toggle:focus-visible {
outline: none;
}
body.dfb-design .main-navigation .menu-toggle[aria-expanded="true"] {
color: #fff;
border-color: color-mix(in srgb, var(--dfb-accent) 78%, transparent);
background: color-mix(in srgb, var(--dfb-accent) 26%, transparent);
}
body.dfb-design .main-navigation .menu-toggle[aria-expanded="true"] svg {
transform: rotate(90deg);
opacity: 0.9;
}
body.dfb-design .main-navigation.toggled {
border-bottom: 1px solid color-mix(in srgb, var(--dfb-accent) 24%, transparent);
}
body.dfb-design.dfb-nav-open .site-header .inside-header {
max-width: min(100%, var(--dfb-page-width));
}
body.dfb-design.dfb-nav-open .site-header::after {
opacity: 0.82;
}
body.dfb-design .main-navigation .main-nav ul li a,
body.dfb-design .main-navigation .menu-toggle,
body.dfb-design .menu-bar-item > a {
font-family: var(--dfb-font-display);
font-weight: 550;
letter-spacing: 0.01em;
text-transform: none;
font-size: var(--dfb-font-size-nav);
transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, transform 0.22s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.2s ease;
}
body.dfb-design .main-navigation .main-nav ul li a {
color: var(--dfb-text-2);
border-bottom: 1px solid transparent;
position: relative;
display: inline-flex;
align-items: center;
gap: 0.16rem;
padding: 0.28rem 0.08rem 0.34rem;
isolation: isolate;
}
body.dfb-design .main-navigation .main-nav ul li a::after {
content: '';
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 1px;
border-radius: 999px;
background: var(--dfb-accent);
opacity: 0;
transform-origin: center;
transform: scaleX(0);
transition: transform 0.2s ease, opacity 0.2s ease, color 0.2s ease;
}
body.dfb-design .main-navigation .main-nav ul li a:hover,
body.dfb-design .main-navigation .main-nav ul li a:focus-visible {
color: var(--dfb-accent);
border-bottom-color: color-mix(in srgb, var(--dfb-accent) 52%, transparent);
}
body.dfb-design .main-navigation .main-nav ul li a:hover::after,
body.dfb-design .main-navigation .main-nav ul li a:focus-visible::after {
opacity: 0.95;
transform: scaleX(1);
}
body.dfb-design .main-navigation .main-nav ul li a:active {
opacity: 0.95;
transform: translateY(1px);
}
body.dfb-design .main-navigation .main-nav ul li.current-menu-item > a,
body.dfb-design .main-navigation .main-nav ul li.current-menu-ancestor > a {
color: var(--dfb-text);
font-weight: 640;
border-bottom-color: color-mix(in srgb, var(--dfb-text) 45%, transparent);
}
body.dfb-design .main-navigation .main-nav ul li.current-menu-item > a::after,
body.dfb-design .main-navigation .main-nav ul li.current-menu-ancestor > a::after {
opacity: 0.88;
transform: scaleX(1);
}
/* Conteúdo principal: evitar linhas demasiado longas */
body.dfb-design .inside-article,
body.dfb-design .inside-article .entry-content {
max-width: var(--dfb-measure);
margin-left: auto;
margin-right: auto;
}
body.dfb-design .inside-article {
padding-left: var(--dfb-gap-compact);
padding-right: var(--dfb-gap-compact);
box-sizing: border-box;
}
body.dfb-design article .entry-header .entry-title,
body.dfb-design article .entry-header .entry-title a {
font-size: clamp(1.95rem, 5vw, 2.5rem);
line-height: 1.11;
letter-spacing: -0.015em;
margin-bottom: 0.2em;
}
body.dfb-design article .entry-header .entry-meta,
body.dfb-design article .entry-header .entry-meta a,
body.dfb-design article .entry-meta,
body.dfb-design article .entry-footer {
font-size: 0.88rem;
color: var(--dfb-text-2);
letter-spacing: 0.02em;
text-transform: none;
font-family: var(--dfb-font-display);
}
body.dfb-design .entry-content {
font-size: clamp(1rem, 1.4vw, 1.07rem);
line-height: var(--dfb-rhythm);
text-wrap: pretty;
overflow-wrap: anywhere;
hyphens: auto;
text-rendering: optimizeLegibility;
font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
scroll-margin-top: var(--dfb-anchor-offset);
}
body.dfb-design .entry-content > *:first-child {
margin-top: 0;
}
body.dfb-design .entry-content > * {
margin-top: 0;
margin-bottom: var(--dfb-rhythm-space-md);
}
body.dfb-design .entry-content > * + * {
margin-top: var(--dfb-rhythm-space-sm);
}
body.dfb-design.dfb-editorial-mode .entry-content {
font-weight: 400;
line-height: var(--dfb-rhythm-tight);
max-width: min(var(--dfb-measure-tight), 100%);
}
body.dfb-design.dfb-editorial-mode .entry-content p {
line-height: 1.95;
}
body.dfb-design.dfb-editorial-mode .entry-content p.dfb-dropcap {
position: relative;
}
body.dfb-design.dfb-editorial-mode .entry-content p.dfb-dropcap::first-letter {
float: left;
font-size: 3.4rem;
font-weight: 700;
line-height: 0.88;
margin: 0.06em 0.14em 0 0;
padding-right: 0.08em;
color: var(--dfb-accent);
font-family: var(--dfb-font-display);
}
body.dfb-design .entry-content p,
body.dfb-design .entry-content ul,
body.dfb-design .entry-content ol {
margin-top: 0;
margin-bottom: var(--dfb-rhythm-space-md);
}
body.dfb-design .entry-content p + p {
margin-top: calc(var(--dfb-rhythm-space-xxs) * 0.35);
}
body.dfb-design .entry-content h2 + *,
body.dfb-design .entry-content h3 + *,
body.dfb-design .entry-content h4 + * {
margin-top: var(--dfb-rhythm-space-sm);
}
body.dfb-design .entry-content > .wp-block-group,
body.dfb-design .entry-content > .wp-block-columns,
body.dfb-design .entry-content > .wp-block-gallery {
margin-top: var(--dfb-rhythm-space-group-v);
margin-bottom: var(--dfb-rhythm-space-lg);
}
body.dfb-design .entry-content p + h2,
body.dfb-design .entry-content p + h3,
body.dfb-design .entry-content p + h4 {
margin-top: var(--dfb-rhythm-space-xl);
}
body.dfb-design .entry-content p.dfb-lead {
font-size: clamp(1.03rem, 2vw, 1.12rem);
line-height: 1.78;
color: var(--dfb-headline-soft);
font-weight: 400;
letter-spacing: 0.005em;
max-width: 60ch;
}
body.dfb-design .entry-content h2,
body.dfb-design .entry-content h3,
body.dfb-design .entry-content h4 {
line-height: 1.3;
scroll-margin-top: 90px;
}
body.dfb-design .entry-content h1 {
font-size: clamp(2rem, 4.2vw, 2.6rem);
line-height: 1.12;
letter-spacing: -0.018em;
margin-bottom: var(--dfb-rhythm-space-xs);
}
body.dfb-design .entry-content h3 {
font-size: clamp(1.2rem, 2.5vw, 1.5rem);
margin-top: var(--dfb-rhythm-space-lg);
margin-bottom: var(--dfb-rhythm-space-xs);
font-weight: 650;
}
body.dfb-design .entry-content h4 {
letter-spacing: 0.02em;
font-size: 1.01rem;
font-weight: 650;
}
body.dfb-design.dfb-editorial-mode .entry-content h2,
body.dfb-design.dfb-editorial-mode .entry-content h3,
body.dfb-design.dfb-editorial-mode .entry-content h4 {
letter-spacing: 0.01em;
}
body.dfb-design .entry-content h2 {
display: flow-root;
font-size: clamp(1.45rem, 3.1vw, 2rem);
margin-top: var(--dfb-rhythm-space-xxl);
padding-top: var(--dfb-rhythm-space-sm);
margin-bottom: var(--dfb-rhythm-space-md);
border-top: 1px solid var(--dfb-border);
}
body.dfb-design .entry-content h2::after {
content: '';
display: block;
width: min(var(--dfb-rhythm-space-decor), 68px);
height: 1px;
margin-top: var(--dfb-rhythm-space-xs);
background: linear-gradient(90deg, color-mix(in srgb, var(--dfb-accent) 65%, transparent), transparent);
opacity: 0.78;
}
body.dfb-design.dfb-editorial-mode .entry-content h2 {
margin-top: calc(var(--dfb-rhythm-space-xl) * 1.16);
padding-top: var(--dfb-rhythm-space-xs);
border-top: 1px solid color-mix(in srgb, var(--dfb-border) 60%, transparent);
}
/* Blocos de destaque */
body.dfb-design .entry-content blockquote {
padding: var(--dfb-rhythm-space-md) var(--dfb-rhythm-space-lg);
margin-left: 0;
margin-right: 0;
margin-top: var(--dfb-rhythm-space-lg);
margin-bottom: var(--dfb-rhythm-space-lg);
border-radius: var(--dfb-radius);
background: linear-gradient(to right, rgba(255, 255, 255, 0.008), transparent);
border-left: 3px solid var(--dfb-accent);
}
body.dfb-design .entry-content blockquote > p {
margin-bottom: var(--dfb-rhythm-space-xxs);
}
body.dfb-design .entry-content blockquote::before {
content: '“';
display: block;
margin-bottom: var(--dfb-rhythm-space-xxs);
font-size: clamp(1.9rem, 5vw, 2.4rem);
line-height: 1;
height: 0.32em;
transform: translateY(-0.1em);
color: color-mix(in srgb, var(--dfb-accent) 45%, transparent);
opacity: 0.85;
}
body.dfb-design .entry-content blockquote p:last-child {
margin-bottom: 0;
}
body.dfb-design.dfb-editorial-mode .entry-content blockquote {
padding: var(--dfb-rhythm-space-md) var(--dfb-rhythm-space-lg);
background: var(--dfb-surface);
border-left-width: 2px;
border-radius: 0;
box-shadow: none;
line-height: var(--dfb-rhythm-blockquote);
}
body.dfb-design.dfb-editorial-mode .entry-content blockquote::before {
color: color-mix(in srgb, var(--dfb-accent-soft) 85%, var(--dfb-accent));
}
body.dfb-design [data-animate] {
opacity: 1;
transform: none;
filter: none;
}
body.dfb-design [data-animate].is-visible,
body.dfb-design [data-animate].dfb-visible {
opacity: 1;
transform: translateY(0);
filter: saturate(1);
}
body.dfb-design .entry-content ul,
body.dfb-design .entry-content ol {
padding-left: 1.15em;
}
body.dfb-design .entry-content ul {
list-style: none;
padding-left: 0.9em;
}
body.dfb-design .entry-content ul li {
position: relative;
padding-left: 1.05em;
margin-bottom: var(--dfb-rhythm-space-xs);
line-height: 1.55;
}
body.dfb-design .entry-content ul li::before {
content: '';
position: absolute;
left: -0.8em;
top: 0.67em;
width: 5px;
height: 5px;
border-radius: 50%;
background: var(--dfb-accent);
}
body.dfb-design .entry-content ol li {
margin-bottom: var(--dfb-rhythm-space-xs);
line-height: 1.55;
}
body.dfb-design .entry-content ol > li::marker {
color: var(--dfb-accent);
}
body.dfb-design .entry-content table {
width: 100%;
border-collapse: collapse;
margin-top: var(--dfb-rhythm-space-lg);
margin-bottom: var(--dfb-rhythm-space-lg);
border: 1px solid var(--dfb-border);
border-radius: var(--dfb-radius);
overflow: hidden;
font-variant-numeric: tabular-nums;
}
body.dfb-design .entry-content table th,
body.dfb-design .entry-content table td {
padding: var(--dfb-rhythm-space-xs) var(--dfb-rhythm-space-sm);
border-bottom: 1px solid var(--dfb-border);
border-right: 1px solid var(--dfb-border);
text-align: left;
}
body.dfb-design .entry-content table th {
background: color-mix(in srgb, var(--dfb-surface-3) 86%, transparent);
font-weight: 650;
letter-spacing: 0.02em;
}
body.dfb-design .entry-content table th:last-child,
body.dfb-design .entry-content table td:last-child {
border-right: 0;
}
body.dfb-design .entry-content pre {
max-width: 100%;
width: 100%;
overflow-x: auto;
overflow-wrap: normal;
border-radius: 12px;
box-shadow: inset 0 0 0 1px var(--dfb-border);
padding: var(--dfb-rhythm-space-md);
background: color-mix(in srgb, var(--dfb-surface-3) 90%, #000 10%);
line-height: 1.45;
font-size: 0.96rem;
}
body.dfb-design .entry-content pre::-webkit-scrollbar {
height: 8px;
}
body.dfb-design .entry-content pre::-webkit-scrollbar-thumb {
background: color-mix(in srgb, var(--dfb-accent) 80%, transparent);
border-radius: 999px;
}
body.dfb-design .entry-content pre code {
background: transparent;
border: none;
padding: 0;
}
body.dfb-design.dfb-editorial-mode .entry-content pre {
background: var(--dfb-surface-2);
border-radius: 10px;
box-shadow: none;
}
body.dfb-design .inside-article .entry-content table tbody tr:last-child td {
border-bottom: 0;
}
body.dfb-design .entry-content code {
font-family: var(--dfb-font-mono, Menlo, Monaco, "Cascadia Code", "Segoe UI Mono", "Roboto Mono", monospace);
padding: 0.08rem var(--dfb-rhythm-space-xs);
border-radius: 0.35em;
background: color-mix(in srgb, var(--dfb-surface-2) 72%, transparent);
font-size: 0.95em;
letter-spacing: 0.01em;
}
body.dfb-design.dfb-editorial-mode .entry-content code {
background: transparent;
color: color-mix(in srgb, var(--dfb-text) 82%, #fff);
padding: 0.08rem var(--dfb-rhythm-space-xxs);
}
body.dfb-design .entry-content img {
max-width: 100%;
height: auto;
border-radius: calc(var(--dfb-radius-sm) + 1px);
display: block;
object-fit: cover;
margin-inline: auto;
}
body.dfb-design .entry-content iframe,
body.dfb-design .entry-content embed,
body.dfb-design .entry-content video {
max-width: 100%;
height: auto;
}
body.dfb-design .entry-content figure,
body.dfb-design .entry-content .wp-caption,
body.dfb-design .entry-content .wp-block-image {
margin-top: 0;
margin-bottom: var(--dfb-rhythm-space-lg);
}
body.dfb-design .entry-content figcaption,
body.dfb-design .entry-content .wp-caption-text {
font-size: 0.95rem;
color: var(--dfb-text-2);
margin-top: var(--dfb-rhythm-space-xxs);
line-height: 1.35;
}
body.dfb-design .entry-content .wp-block-button__link {
border-radius: 999px;
padding: var(--dfb-rhythm-space-sm) calc(var(--dfb-rhythm-space-lg) * 0.98);
letter-spacing: 0.012em;
font-size: 0.94rem;
text-transform: none;
font-weight: 650;
font-family: var(--dfb-font-display);
transition: transform 0.2s ease, box-shadow 0.2s ease, color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}
body.dfb-design .entry-content .wp-block-button__link:hover {
transform: translateY(-1px);
box-shadow: 0 3px 14px -10px var(--dfb-accent);
}
body.dfb-design .entry-content a {
text-decoration: none;
position: relative;
transition: color .2s ease, text-decoration-color .2s ease;
text-underline-offset: 0.28em;
text-decoration-thickness: 1.55px;
border-bottom: 1px solid color-mix(in srgb, var(--dfb-accent) 36%, transparent);
}
body.dfb-design.dfb-editorial-mode .entry-content a {
transition: none;
}
body.dfb-design .entry-content a:hover {
color: var(--dfb-accent);
border-bottom-color: color-mix(in srgb, var(--dfb-accent) 72%, transparent);
text-decoration-color: color-mix(in srgb, var(--dfb-accent) 72%, transparent);
text-underline-offset: 0.18em;
}
body.dfb-design .entry-content a:focus-visible {
outline: none;
box-shadow: var(--focus-ring);
border-radius: 2px;
}
body.dfb-design .entry-content strong {
font-weight: 650;
letter-spacing: 0.01em;
}
body.dfb-design .entry-content hr {
height: 0;
border: 0;
border-top: 1px solid color-mix(in srgb, var(--dfb-border) 76%, transparent);
margin: var(--dfb-rhythm-space-lg) 0;
position: relative;
}
body.dfb-design .entry-content hr::after {
content: '';
position: absolute;
left: 35%;
top: -1px;
width: 1px;
height: 1px;
padding: 4px;
background: var(--dfb-accent);
border-radius: 999px;
filter: blur(0.2px);
}
body.dfb-design .wp-block-separator,
body.dfb-design .wp-block-separator.is-style-dots {
border: 0;
opacity: 1;
height: 1px;
background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--dfb-border) 85%, transparent), transparent);
margin: var(--dfb-rhythm-space-xl) auto;
max-width: 58%;
}
body.dfb-design .site-footer,
body.dfb-design .site-info,
body.dfb-design .footer-widgets {
border-top: 1px solid color-mix(in srgb, var(--dfb-border) 78%, transparent);
}
body.dfb-design .site-footer a,
body.dfb-design .site-info a {
text-decoration: none;
border-bottom: 1px solid transparent;
transition: border-color .2s ease, color .2s ease;
}
body.dfb-design .site-footer a:hover,
body.dfb-design .site-info a:hover {
border-bottom-color: color-mix(in srgb, var(--dfb-accent) 46%, transparent);
}
/* Hero/featured section: contraste e borda de presença */
body.dfb-design .dfb-hero {
width: min(100%, calc(var(--dfb-measure) + 12rem));
margin-inline: auto;
isolation: isolate;
margin-top: clamp(0.2rem, 0.9vw, 0.85rem);
padding-inline: clamp(0.15rem, 1vw, 0.65rem);
}
body.dfb-design .dfb-hero + .gb-grid-wrapper {
margin-top: var(--dfb-rhythm-space-sections);
}
body.dfb-design .dfb-hero-content {
display: grid;
gap: var(--dfb-rhythm-space-lg);
}
body.dfb-design.dfb-editorial-mode .dfb-hero-inner {
background: var(--dfb-surface);
border-color: var(--dfb-border);
box-shadow: none;
}
body.dfb-design.dfb-editorial-mode .dfb-hero-inner::before,
body.dfb-design.dfb-editorial-mode .dfb-hero-image-overlay,
body.dfb-design.dfb-editorial-mode .dfb-hero-image::after {
display: none !important;
}
body.dfb-design.dfb-editorial-mode .dfb-hero {
margin-bottom: var(--dfb-rhythm-space-xxxl);
padding-top: var(--dfb-rhythm-space-hero-top);
}
body.dfb-design .dfb-hero + .gb-grid-wrapper::before {
content: 'Últimos artigos';
text-transform: none;
font-size: var(--dfb-rhythm-space-xs);
font-weight: 600;
letter-spacing: 0.11em;
padding-bottom: var(--dfb-rhythm-space-xxs);
display: inline-flex;
align-items: center;
gap: 0.42rem;
}
html[lang^="en"] body.dfb-design .dfb-hero + .gb-grid-wrapper::before {
content: 'Latest articles';
}
body.dfb-design .dfb-hero + .gb-grid-wrapper::after {
content: '';
display: block;
max-width: var(--dfb-measure);
margin: 0 auto var(--dfb-rhythm-space-md);
height: 1px;
background: color-mix(in srgb, var(--dfb-border) 75%, transparent);
}
body.dfb-design.dfb-editorial-mode .dfb-hero-meta-top,
body.dfb-design.dfb-editorial-mode .dfb-footer-bottom {
letter-spacing: 0.02em;
}
body.dfb-design .dfb-hero-meta-top,
body.dfb-design .dfb-footer-bottom {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--dfb-rhythm-space-sm);
font-size: var(--dfb-font-size-hero-kicker);
line-height: 1.25;
letter-spacing: 0.038em;
text-transform: none;
}
body.dfb-design .dfb-tag {
display: inline-flex;
align-items: center;
padding: 0.2rem 0.72rem;
border-radius: 999px;
font-size: 0.7rem;
font-weight: 600;
letter-spacing: 0.08em;
text-transform: none;
background: color-mix(in srgb, var(--dfb-accent) 14%, transparent);
border: 1px solid color-mix(in srgb, var(--dfb-accent) 38%, transparent);
color: color-mix(in srgb, var(--dfb-accent) 94%, white 6%);
}
body.dfb-design .dfb-tag:hover {
background: color-mix(in srgb, var(--dfb-accent) 22%, transparent);
}
body.dfb-design .dfb-hero-title {
font-size: var(--dfb-font-size-hero-title);
line-height: 1.15;
letter-spacing: -0.025em;
font-weight: 700;
margin-top: 0;
max-width: 22ch;
text-wrap: balance;
}
body.dfb-design .dfb-hero-title a {
text-decoration: none;
}
body.dfb-design .dfb-hero-excerpt {
font-size: var(--dfb-font-size-hero-excerpt);
color: var(--dfb-text-2);
line-height: 1.65;
margin-top: -0.2rem;
}
body.dfb-design .dfb-hero-bottom {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: var(--dfb-rhythm-space-sm);
padding-top: var(--dfb-rhythm-space-md);
border-top: 1px solid var(--dfb-border);
}
body.dfb-design .dfb-hero-cta {
display: inline-flex;
align-items: center;
gap: 0.48rem;
min-height: 40px;
padding: 0.58rem 1.08rem;
border-radius: 999px;
font-size: calc(var(--dfb-font-size-hero-kicker) + 0.02rem);
font-family: var(--dfb-font-display);
font-weight: 600;
letter-spacing: 0.045em;
text-transform: none;
background: color-mix(in srgb, var(--dfb-accent) 13%, transparent);
border: 1px solid color-mix(in srgb, var(--dfb-accent) 44%, transparent);
color: color-mix(in srgb, var(--dfb-accent) 95%, #fff 5%) !important;
transition: transform 0.2s ease, box-shadow 0.2s ease, color 0.2s ease, background 0.2s ease;
}
body.dfb-design .dfb-hero-cta:hover,
body.dfb-design .dfb-hero-cta:focus-visible {
color: #fff !important;
background: color-mix(in srgb, var(--dfb-accent) 24%, var(--dfb-surface));
box-shadow: 0 12px 24px -18px color-mix(in srgb, var(--dfb-accent) 80%, transparent);
transform: translateY(-1px);
}
body.dfb-design .dfb-hero-cta svg {
transition: transform 0.22s ease;
width: 14px;
height: 14px;
}
body.dfb-design .dfb-hero-cta:hover svg {
transform: translateX(2px);
}
body.dfb-design .dfb-newsletter-cta {
background: color-mix(in srgb, var(--dfb-surface) 78%, var(--dfb-bg));
border: 1px solid color-mix(in srgb, var(--dfb-accent) 12%, var(--dfb-border));
border-radius: calc(var(--dfb-radius) + 2px);
padding: clamp(1.55rem, 3.45vw, 2.28rem) clamp(1.15rem, 2.5vw, 1.9rem);
position: relative;
isolation: isolate;
overflow: hidden;
transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
body.dfb-design .dfb-newsletter-cta::before {
content: '';
position: absolute;
inset: 1px;
z-index: -1;
border-radius: calc(var(--dfb-radius) + 1px);
background: radial-gradient(120% 120% at 80% 0%, color-mix(in srgb, var(--dfb-accent) 10%, transparent), transparent 65%);
opacity: 0.42;
pointer-events: none;
}
body.dfb-design .dfb-newsletter-cta:hover {
border-color: color-mix(in srgb, var(--dfb-accent) 34%, transparent);
transform: translateY(-2px);
box-shadow: 0 18px 35px -28px color-mix(in srgb, var(--dfb-accent) 84%, transparent);
}
body.dfb-design .dfb-newsletter-cta:focus-within {
border-color: color-mix(in srgb, var(--dfb-accent) 52%, transparent);
box-shadow: 0 0 0 1px color-mix(in srgb, var(--dfb-accent) 22%, transparent);
}
body.dfb-design .dfb-newsletter-inner {
position: relative;
z-index: 1;
}
body.dfb-design .dfb-newsletter-cta h3 {
font-size: clamp(1.4rem, 2.2vw, 1.82rem);
line-height: 1.16;
font-weight: 730;
margin-bottom: 0.55rem;
}
body.dfb-design .dfb-newsletter-cta p {
color: var(--dfb-text-2);
max-width: 48ch;
margin: 0 auto;
line-height: 1.58;
font-size: clamp(0.98rem, 1.4vw, 1.08rem);
}
body.dfb-design .dfb-newsletter-cta .ff-el-group,
body.dfb-design .dfb-newsletter-cta .ff-el-form {
max-width: 440px;
margin-left: auto;
margin-right: auto;
}
body.dfb-design .dfb-newsletter-form-wrap {
margin-top: var(--dfb-rhythm-space-lg);
position: relative;
z-index: 1;
}
body.dfb-design .dfb-newsletter-cta .ff-el-form {
display: grid;
gap: var(--dfb-rhythm-space-sm);
grid-template-columns: 1fr;
}
body.dfb-design .dfb-newsletter-cta .ff-el-input--content input {
background: color-mix(in srgb, var(--dfb-surface-3) 84%, var(--dfb-bg));
border-color: color-mix(in srgb, var(--dfb-accent) 30%, transparent);
min-height: 46px;
border-radius: 10px;
color: var(--dfb-text);
font-size: 0.98rem;
padding-inline: 1rem;
}
body.dfb-design .dfb-newsletter-cta .ff-el-input--content input::placeholder {
color: color-mix(in srgb, var(--dfb-text-2) 80%, transparent);
}
body.dfb-design .dfb-newsletter-cta .ff-el-input--content input:focus,
body.dfb-design .dfb-newsletter-cta .ff-el-input--content input:focus-visible {
border-color: color-mix(in srgb, var(--dfb-accent) 72%, transparent) !important;
box-shadow: 0 0 0 3px color-mix(in srgb, var(--dfb-accent) 28%, transparent);
color: var(--dfb-text);
background: color-mix(in srgb, var(--dfb-surface-2) 78%, var(--dfb-bg) 22%);
}
body.dfb-design .dfb-newsletter-cta .ff-el-input--content input:hover {
border-color: color-mix(in srgb, var(--dfb-accent) 48%, var(--dfb-border));
}
body.dfb-design .dfb-newsletter-cta .ff-btn-submit {
border-radius: 999px;
padding-top: 0.72rem !important;
padding-bottom: 0.72rem !important;
min-height: 44px;
font-size: 0.92rem;
letter-spacing: 0.05em;
text-transform: none;
background: color-mix(in srgb, var(--dfb-accent) 90%, #fff 10%) !important;
color: var(--dfb-bg) !important;
border-color: color-mix(in srgb, var(--dfb-accent) 74%, transparent) !important;
border-width: 1px;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
body.dfb-design .dfb-newsletter-cta .ff-btn-submit:hover {
transform: translateY(-1px);
box-shadow: 0 10px 22px -16px color-mix(in srgb, var(--dfb-accent) 90%, transparent);
}
body.dfb-design .dfb-newsletter-cta .ff-btn-submit:focus-visible {
outline: none;
box-shadow: 0 0 0 3px color-mix(in srgb, var(--dfb-accent) 20%, transparent), 0 8px 20px -16px color-mix(in srgb, var(--dfb-accent) 90%, transparent);
transform: translateY(-1px);
}
body.dfb-design .dfb-newsletter-cta .ff-btn-submit:active {
transform: translateY(0);
box-shadow: 0 3px 12px -10px color-mix(in srgb, var(--dfb-accent) 90%, transparent);
}
@media (min-width: 1024px) {
body.dfb-design .dfb-newsletter-cta .ff-el-form {
grid-template-columns: minmax(0, 1fr) 142px;
align-items: end;
}
body.dfb-design .dfb-newsletter-cta .ff-btn-submit {
margin-top: 0;
min-height: 46px;
}
}
@media (max-width: 1023px) {
body.dfb-single .site-content {
flex-direction: column;
}
body.dfb-single .content-area,
body.dfb-single #right-sidebar {
width: 100% !important;
}
body.dfb-design .dfb-rail-sticky {
position: static !important;
max-height: none;
overflow: visible;
}
}
@media (min-width: 1024px) {
body.dfb-design .dfb-newsletter-cta {
padding-inline: clamp(1.45rem, 3.4vw, 2.35rem);
}
}
@media (min-width: 1280px) {
body.dfb-design {
--dfb-rhythm-space-sections: clamp(3rem, 4.3vw, 3.9rem);
--dfb-rhythm-space-hero-inner: clamp(1.5rem, 2.7vw, 2.35rem);
}
body.dfb-design .dfb-hero {
width: min(100%, calc(var(--dfb-measure) + 18rem));
padding-inline: clamp(0.5rem, 2vw, 1.3rem);
}
body.dfb-design .dfb-hero + .gb-grid-wrapper {
margin-top: var(--dfb-rhythm-space-sections);
}
body.dfb-design .dfb-hero-title {
font-size: clamp(2.6rem, 3.8vw, 3.3rem);
max-width: 18ch;
letter-spacing: -0.042em;
}
body.dfb-design .dfb-hero-excerpt {
font-size: clamp(1.12rem, 1.45vw, 1.26rem);
max-width: 60ch;
line-height: 1.68;
}
body.dfb-design .dfb-hero-cta {
min-height: 44px;
padding: 0.72rem 1.22rem;
font-size: 0.93rem;
}
body.dfb-design .dfb-newsletter-cta {
max-width: min(100%, calc(var(--dfb-measure) + 16rem));
padding: clamp(1.9rem, 3.6vw, 2.55rem) clamp(2rem, 3.6vw, 3.6rem);
border-color: color-mix(in srgb, var(--dfb-accent) 10%, var(--dfb-border));
}
body.dfb-design .dfb-newsletter-cta::before {
inset: 2px;
background: radial-gradient(130% 130% at 80% 0%, color-mix(in srgb, var(--dfb-accent) 12%, transparent), transparent 64%);
}
body.dfb-design .dfb-newsletter-cta h3 {
font-size: clamp(1.68rem, 2.1vw, 2.05rem);
}
body.dfb-design .dfb-newsletter-cta p {
font-size: clamp(1.06rem, 1.38vw, 1.16rem);
}
body.dfb-design .dfb-newsletter-cta .ff-el-form {
grid-template-columns: minmax(0, 1.16fr) 168px;
gap: var(--dfb-rhythm-space-md);
max-width: min(100%, 940px);
}
body.dfb-design .dfb-newsletter-cta .ff-el-input--content input,
body.dfb-design .dfb-newsletter-cta .ff-btn-submit {
min-height: 50px;
}
body.dfb-design .dfb-newsletter-cta .ff-btn-submit {
font-size: 0.96rem;
}
}
@media (prefers-reduced-motion: reduce) {
body.dfb-design .main-navigation .main-nav ul li a,
body.dfb-design .dfb-newsletter-cta,
body.dfb-design .dfb-hero-cta,
body.dfb-design .dfb-newsletter-cta .ff-btn-submit {
transition-duration: 0.01ms;
}
}
/* Visual editorial: menos ruído */
body.dfb-design.dfb-editorial-mode .dfb-newsletter-glow {
display: none !important;
}
body.dfb-design.dfb-editorial-mode .dfb-newsletter-cta {
border-left: 2px solid var(--dfb-accent);
border-radius: 0;
}
body.dfb-design.dfb-editorial-mode .dfb-footer-logo,
body.dfb-design.dfb-editorial-mode .dfb-footer-dot {
display: none;
}
body.dfb-design.dfb-editorial-mode .dfb-footer-grid {
gap: var(--dfb-rhythm-space-xxxl);
}
body.dfb-design.dfb-editorial-mode .dfb-hero + .gb-grid-wrapper::before {
content: 'Últimos artigos';
text-transform: none;
font-size: var(--dfb-rhythm-space-xs);
font-weight: 600;
letter-spacing: 0.11em;
padding-bottom: var(--dfb-rhythm-space-xxs);
}
body.dfb-design.dfb-editorial-mode .dfb-hero-inner {
background: var(--dfb-surface);
border-radius: clamp(8px, 0.9vw, 14px);
border-color: var(--dfb-border);
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--dfb-border) 45%, transparent);
}
body.dfb-design.dfb-editorial-mode .dfb-hero-image {
box-shadow: 0 30px 60px -38px color-mix(in srgb, var(--dfb-accent) 42%, transparent);
}
body.dfb-design.dfb-editorial-mode .dfb-hero-content {
gap: var(--dfb-rhythm-space-lg);
}
body.dfb-design .dfb-hero-inner {
position: relative;
padding: var(--dfb-rhythm-space-hero-inner);
border: 1px solid var(--dfb-border);
border-radius: var(--dfb-radius);
background: var(--dfb-surface);
overflow: hidden;
}
body.dfb-design .dfb-hero-content {
gap: var(--dfb-rhythm-space-lg);
}
body.dfb-design .dfb-hero-image {
border-radius: calc(var(--dfb-radius) - 2px);
}
/* Espaço respirado para secções de cartões */
body.dfb-design .gb-grid-wrapper > .gb-grid-column > .gb-inside-container {
display: flex;
flex-direction: column;
min-height: 100%;
gap: var(--dfb-gap-compact);
justify-content: space-between;
position: relative;
z-index: 1;
}
body.dfb-design .gb-grid-wrapper > .gb-grid-column {
min-height: 100%;
position: relative;
overflow: hidden;
isolation: isolate;
opacity: 1;
transform: none;
will-change: transform, opacity, border-color, box-shadow;
transition: transform 0.36s var(--dfb-motion-soft), border-color 0.25s ease, box-shadow 0.25s ease, opacity 0.36s ease;
border: 1px solid var(--dfb-border);
background: color-mix(in srgb, var(--dfb-surface) 90%, transparent);
scroll-margin-top: var(--dfb-anchor-offset);
}
body.dfb-design .gb-grid-wrapper > .gb-grid-column.is-visible,
body.dfb-design .gb-grid-wrapper > .gb-grid-column.dfb-visible {
opacity: 1;
transform: translateY(0);
}
body.dfb-design .gb-grid-wrapper > .gb-grid-column::after {
content: '';
position: absolute;
inset: 0;
background: radial-gradient(120% 120% at 80% -15%, color-mix(in srgb, var(--dfb-accent) 18%, transparent), transparent 55%);
z-index: 0;
opacity: 0;
transition: opacity 0.25s ease;
}
/* 🔴 O cartao inteiro tem de ser clicavel, e sem depender de JS.
Antes: o `cursor: pointer` (abaixo, dentro de @media (hover:hover))
prometia um clique que o handler JS recusava exactamente na mesma
condicao -- `if (matchMedia('(hover: hover)').matches) return;`.
No desktop so o titulo (65px) e a ancora da imagem (21px de altura numa
foto de 208px) navegavam; o resto do cartao era morto e "nada acontecia".
O ::after do titulo estica-se sobre o cartao (que ja e position:relative),
por isso o clique cai no real -- funciona com JS desligado, com o
Rocket Loader do Cloudflare a mexer nos scripts, e no teclado. */
body.dfb-design .gb-grid-wrapper > .gb-grid-column h3.gb-headline > a::after,
body.dfb-design .gb-grid-wrapper > .gb-grid-column h2.gb-headline > a::after,
body.dfb-design .gb-grid-wrapper > .gb-grid-column h3 > a::after,
body.dfb-design .gb-grid-wrapper > .gb-grid-column h2 > a::after {
content: '';
position: absolute;
inset: 0;
z-index: 2;
}
/* Os links proprios do cartao (categoria) ficam por cima da camada
esticada, senao deixavam de ser clicaveis. */
/* 🔴 NAO incluir aqui o link do titulo: torna-lo `position: relative` faz o
`inset: 0` do ::after resolver contra o proprio em vez do cartao, e a
camada esticada encolhe ao tamanho do texto. Foi assim que esta correccao se
sabotou a si propria na primeira tentativa. */
/* A ancora da imagem do cartao era `display: inline` a envolver um bloco:
media 21px de altura numa foto de 208px. Nao afecta o clique (o link do
titulo esta esticado por cima), mas e uma area de toque falsa. */
body.dfb-design .gb-grid-wrapper > .gb-grid-column .gb-block-image > a {
display: block;
}
body.dfb-design .gb-grid-wrapper > .gb-grid-column .post-term-item a,
body.dfb-design .gb-grid-wrapper > .gb-grid-column a.gb-button,
body.dfb-design .gb-grid-wrapper > .gb-grid-column .dfb-tag {
position: relative;
z-index: 3;
}
@media (hover: hover) {
body.dfb-design .gb-grid-wrapper > .gb-grid-column:hover {
transform: translateY(-2px);
cursor: pointer;
border-color: color-mix(in srgb, var(--dfb-accent) 44%, var(--dfb-border));
}
body.dfb-design .gb-grid-wrapper > .gb-grid-column:hover::after {
opacity: 0.28;
}
}
body.dfb-design .gb-grid-wrapper > .gb-grid-column:active,
body.dfb-design .gb-grid-wrapper > .gb-grid-column.dfb-card-pressing {
transform: translateY(1px) scale(0.996);
border-color: color-mix(in srgb, var(--dfb-accent) 36%, var(--dfb-border));
}
body.dfb-design .gb-grid-wrapper > .gb-grid-column:focus-visible {
outline: none;
border-color: var(--dfb-accent);
box-shadow: var(--focus-ring);
transform: translateY(-1px);
}
body.dfb-design .one-container.archive .post,
body.dfb-design .one-container.blog .post {
padding: var(--dfb-post-card-padding);
border: 1px solid var(--dfb-border);
background: color-mix(in srgb, var(--dfb-surface) 92%, transparent);
border-radius: var(--dfb-radius);
margin-bottom: var(--dfb-post-card-margin);
opacity: 1;
transform: none;
transition: border-color 0.25s ease, transform 0.25s ease;
}
body.dfb-design .one-container.archive .post:hover,
body.dfb-design .one-container.blog .post:hover {
border-color: color-mix(in srgb, var(--dfb-accent) 30%, var(--dfb-border));
transform: translateY(-2px);
}
body.dfb-design .one-container.archive .post.is-visible,
body.dfb-design .one-container.blog .post.is-visible,
body.dfb-design .one-container.archive .post.dfb-visible,
body.dfb-design .one-container.blog .post.dfb-visible {
opacity: 1;
transform: translateY(0);
}
body.dfb-design .one-container.archive .post:active,
body.dfb-design .one-container.blog .post:active {
transform: translateY(1px);
}
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column {
box-shadow: none !important;
transition: border-color 0.25s ease, transform 0.36s var(--dfb-motion-soft), opacity 0.36s ease;
border-radius: 0 !important;
background: var(--dfb-surface);
}
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column:hover,
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column.is-visible {
transform: none !important;
border-color: var(--dfb-accent-dim);
}
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column:hover {
border-color: var(--dfb-accent-dim);
}
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column:focus-visible {
transform: none;
}
body.dfb-design .gb-grid-wrapper > .gb-grid-column .gb-headline-251bd4df {
margin-bottom: auto;
}
body.dfb-design .gb-grid-wrapper > .gb-grid-column .gb-headline-251bd4df a {
line-height: 1.42;
letter-spacing: -0.01em;
}
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column .gb-headline-c66a2b1e a,
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column .gb-headline-897f85e5,
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column .gb-headline-682093c1,
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column .gb-headline-251bd4df {
margin-bottom: 0;
}
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column .gb-headline-251bd4df,
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column .gb-headline-897f85e5 {
color: var(--dfb-text) !important;
}
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column .gb-headline-040f2ffe a,
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column .gb-headline-14dcdb64 {
color: var(--dfb-text-2) !important;
}
/* Modo editorial: reduzir distracção em metadados de cards */
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column .gb-headline-897f85e5,
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column .gb-headline-682093c1 {
font-size: var(--dfb-font-size-fine);
opacity: 0.82;
}
/* ===== Leva 2: header, eixos, categorias, cards e rail ===== */
body.dfb-design .site-header .inside-header {
display: flex !important;
flex-flow: row nowrap !important;
align-items: center;
gap: clamp(0.75rem, 2vw, 1.5rem);
padding-top: 0.75rem;
padding-bottom: 0.75rem;
}
body.dfb-design .site-branding-container {
display: flex;
align-items: center;
min-width: 0;
margin-right: auto;
}
body.dfb-design .site-branding {
min-width: 0;
}
body.dfb-design .site-header .main-title,
body.dfb-design .site-header .site-description {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
body.dfb-design .site-header #site-navigation,
body.dfb-design .site-header .mobile-menu-control-wrapper {
flex: 0 0 auto;
margin: 0;
}
body.dfb-design .site-header .inside-navigation {
padding: 0;
}
body.dfb-single .gb-container-70385d72 {
min-height: auto !important;
}
@media (min-width: 769px) {
body.dfb-single .gb-container-70385d72:has(.gb-container-4e92c4e8 img) {
min-height: 380px !important;
display: grid;
grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
gap: clamp(1.5rem, 3vw, 3rem);
align-items: center;
}
/* Keep long titles clear of the image instead of overlapping it with a negative margin. */
body.dfb-single .gb-container-70385d72 > .gb-container-579e5b87,
body.dfb-single .gb-container-70385d72 > .gb-container-4e92c4e8 {
min-width: 0;
width: 100%;
margin-left: 0;
}
body.dfb-single .gb-container-70385d72 > .gb-container-4e92c4e8 {
order: 0;
}
body.dfb-single .gb-container-4e92c4e8 img {
width: 100%;
height: auto;
aspect-ratio: 16 / 10;
object-fit: cover;
}
body.dfb-single .gb-container-70385d72 {
padding-left: max(40px, calc((100vw - var(--dfb-page-width)) / 2 + 113px));
}
body.dfb-design .dfb-rail-sticky {
position: sticky;
top: 112px;
max-height: calc(100vh - 128px);
overflow-y: auto;
overscroll-behavior: contain;
}
body.dfb-single #right-sidebar {
position: relative;
align-self: stretch;
}
body.dfb-single #right-sidebar > .inside-right-sidebar {
height: 100%;
}
}
/* O do indice do blog: presente para SEO e leitores de ecra, mas sem o
corpo gigante do "Blog" que estava aqui antes (ocupava uma vista inteira). */
body.dfb-design .dfb-blog-h1 {
margin: 0 0 clamp(1.2rem, 2.4vw, 1.8rem);
font-family: var(--dfb-font-display);
font-size: clamp(1.35rem, 2.6vw, 1.85rem);
line-height: 1.25;
font-weight: 700;
color: var(--dfb-text);
}
body.dfb-design .dfb-category-nav {
margin: 0 0 clamp(2rem, 4vw, 3rem);
padding: 0 0 1.2rem;
border-bottom: 1px solid var(--dfb-border);
}
body.dfb-design .dfb-category-nav__heading,
body.dfb-design .dfb-article-toc__title {
margin: 0 0 0.8rem;
font-family: var(--dfb-font-display);
font-size: 0.82rem;
font-weight: 650;
letter-spacing: 0.06em;
color: var(--dfb-text-2);
}
body.dfb-design .dfb-category-pills {
display: flex;
flex-wrap: wrap;
gap: 0.55rem;
}
body.dfb-design .dfb-category-pill {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 44px;
max-width: 100%;
padding: 0.55rem 0.9rem;
border: 1px solid color-mix(in srgb, var(--dfb-accent) 24%, var(--dfb-border));
border-radius: 999px;
font-family: var(--dfb-font-display);
font-size: 0.76rem;
font-weight: 600;
line-height: 1.25;
text-align: center;
color: var(--dfb-text-2);
background: color-mix(in srgb, var(--dfb-surface) 88%, transparent);
box-sizing: border-box;
}
body.dfb-design .dfb-category-pill:hover,
body.dfb-design .dfb-category-pill:focus-visible,
body.dfb-design .dfb-category-pill.is-active {
border-color: color-mix(in srgb, var(--dfb-accent) 66%, var(--dfb-border));
color: var(--dfb-accent);
background: color-mix(in srgb, var(--dfb-accent) 13%, var(--dfb-surface));
}
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column:hover,
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column:focus-within {
border-color: color-mix(in srgb, var(--dfb-accent) 48%, var(--dfb-border));
box-shadow: 0 18px 34px -28px rgba(0, 0, 0, 0.82) !important;
}
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column h3,
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column h3 a {
font-weight: 750;
color: var(--dfb-text) !important;
}
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column .gb-headline-897f85e5,
body.dfb-design.dfb-editorial-mode .gb-grid-wrapper > .gb-grid-column .gb-headline-682093c1 {
font-weight: 400;
color: var(--dfb-text-2) !important;
opacity: 0.76;
}
body.dfb-design .dfb-article-toc {
margin-bottom: 1.25rem;
padding: 1rem 1rem 0.9rem;
border: 1px solid color-mix(in srgb, var(--dfb-accent) 22%, var(--dfb-border));
background: color-mix(in srgb, var(--dfb-surface) 92%, transparent);
}
/* The reading index is available before the article on small screens, without JavaScript. */
body.dfb-design .dfb-mobile-toc {
display: none;
margin: 0 0 1.5rem;
border: 1px solid var(--dfb-border);
border-radius: var(--dfb-radius-sm);
background: var(--dfb-surface);
}
body.dfb-design.no-sidebar .dfb-mobile-toc {
display: block;
}
body.dfb-design .dfb-mobile-toc summary {
padding: 0.75rem 1rem;
min-height: 48px;
box-sizing: border-box;
color: var(--dfb-text);
font-family: var(--dfb-font-display);
font-size: 1rem;
font-weight: 600;
cursor: pointer;
}
body.dfb-design .dfb-mobile-toc summary::marker {
color: var(--dfb-accent);
}
body.dfb-design .dfb-mobile-toc summary:focus-visible {
outline: 2px solid var(--dfb-accent);
outline-offset: 3px;
}
body.dfb-design .dfb-mobile-toc[open] summary {
border-bottom: 1px solid var(--dfb-border);
}
body.dfb-design .dfb-mobile-toc nav {
padding: 0.25rem 1rem;
}
body.dfb-design .dfb-article-toc ol,
body.dfb-design .dfb-mobile-toc ol {
margin: 0;
padding: 0;
list-style: none;
}
body.dfb-design .dfb-mobile-toc li {
margin: 0;
padding: 0;
}
body.dfb-design .dfb-article-toc li + li,
body.dfb-design .dfb-mobile-toc li + li {
border-top: 1px solid color-mix(in srgb, var(--dfb-border) 68%, transparent);
}
body.dfb-design .dfb-article-toc a,
body.dfb-design .dfb-mobile-toc a {
display: flex;
align-items: center;
min-height: 44px;
box-sizing: border-box;
padding: 0.45rem 0;
font-size: 0.76rem;
line-height: 1.35;
color: var(--dfb-text-2);
}
body.dfb-design .dfb-mobile-toc a {
font-size: 0.95rem;
text-decoration: none;
overflow-wrap: anywhere;
}
body.dfb-design .dfb-article-toc a:hover,
body.dfb-design .dfb-article-toc a:focus-visible,
body.dfb-design .dfb-mobile-toc a:hover,
body.dfb-design .dfb-mobile-toc a:focus-visible {
color: var(--dfb-accent);
}
body.dfb-design .dfb-rail-ad-slot {
margin-top: 1.25rem;
}
body.dfb-design .entry-content h2[id] {
scroll-margin-top: calc(var(--dfb-anchor-offset) + 16px);
}
/* Formulários: contraste e área de clique melhorada */
body.dfb-design input,
body.dfb-design select,
body.dfb-design textarea,
body.dfb-design button {
min-height: 44px;
font-size: 1rem;
}
body.dfb-design input[type="search"],
body.dfb-design input[type="text"],
body.dfb-design input[type="email"],
body.dfb-design textarea {
box-shadow: none;
}
/* Estados de foco visíveis em navegação por teclado */
body.dfb-design a:focus-visible,
body.dfb-design button:focus-visible,
body.dfb-design input:focus-visible,
body.dfb-design textarea:focus-visible,
body.dfb-design select:focus-visible {
outline: none;
box-shadow: var(--focus-ring);
}
/* Espaçamento de secções e grade para melhor ritmo visual */
body.dfb-design .site-main,
body.dfb-design .content-area,
body.dfb-design .inside-article {
padding-bottom: var(--dfb-section-padding);
position: relative;
}
body.dfb-design .site-main > .wp-block-group,
body.dfb-design .site-main > .wp-block-group__inner-container,
body.dfb-design .site-main .wp-block-group__inner-container {
max-width: var(--dfb-measure);
margin-left: auto;
margin-right: auto;
}
/* Give the full navigation its own row when the branding and links cannot fit together. */
@media (min-width: 769px) and (max-width: 1200px) {
body.dfb-design .site-header .inside-header {
flex-wrap: wrap !important;
gap: 0.5rem;
}
body.dfb-design .site-header #site-navigation {
flex: 1 1 100%;
max-width: 100%;
}
body.dfb-design #primary-menu {
min-width: 0;
}
body.dfb-design #primary-menu > ul {
flex-wrap: wrap;
row-gap: 0.25rem;
}
}
/* Mobile: prioridade ao ritmo de leitura */
@media (max-width: 768px) {
body.dfb-design {
--dfb-rhythm-scale: clamp(0.86, calc((100vw - 320px) / 1750 + 0.82), 1.07);
--dfb-rhythm-space-group-v: calc(1.72rem * var(--dfb-rhythm-scale));
--dfb-anchor-offset: clamp(64px, 11vw, 84px);
}
body.dfb-design .site-header .inside-header {
gap: 0.55rem;
padding: 0.6rem var(--dfb-rhythm-space-md);
}
body.dfb-design .site-branding-container {
width: auto !important;
flex: 1 1 0;
}
body.dfb-design .site-header .site-logo img {
width: 72px !important;
height: 30.96px;
object-fit: contain;
}
body.dfb-design .site-header .site-description {
font-size: 0.68rem;
}
body.dfb-design .site-header .mobile-menu-control-wrapper {
display: flex;
flex-wrap: nowrap;
align-items: center;
flex: 0 0 88px;
max-width: 88px;
}
/* Branding and controls share a row; injected slots receive a full row. */
body.dfb-design .site-header .inside-header {
display: grid !important;
grid-template-columns: minmax(0, 1fr) 88px;
align-items: center;
}
body.dfb-design .site-header .inside-header > .site-branding-container {
grid-column: 1;
grid-row: 1;
min-width: 0;
margin: 0;
}
body.dfb-design .site-header .inside-header > .mobile-menu-control-wrapper {
grid-column: 2;
grid-row: 1;
margin: 0;
justify-content: flex-end;
}
body.dfb-design .site-header .inside-header > :not(.site-branding-container):not(.mobile-menu-control-wrapper) {
grid-column: 1 / -1;
min-width: 0;
}
body.dfb-design .main-navigation .menu-toggle,
body.dfb-design .menu-bar-item > a {
width: 44px;
min-width: 44px;
min-height: 44px !important;
padding-left: 0;
padding-right: 0;
}
body.dfb-design .gb-block-image > a,
body.dfb-design .dfb-hero-image > a,
body.dfb-design .site-logo > a {
display: block;
min-height: 44px;
}
body.dfb-design .dfb-article-toc {
display: none;
}
body.dfb-design .dfb-mobile-toc {
display: block;
}
body.dfb-design .dfb-rail-sticky {
position: static;
}
/* Alvos de toque: SO nos sitios que sao navegacao. A regra anterior era
`a:not(...)` sobre todos os links, e inline-flex nao quebra linha --
partia qualquer frase com links a meio (o aviso do reCAPTCHA ficou com
os dois links empilhados em blocos de 44px). */
body.dfb-design .dfb-mobile-nav .menu a,
body.dfb-design .main-navigation a,
body.dfb-design .dfb-category-pill,
body.dfb-design .dfb-footer-wrap a,
body.dfb-design .gb-button,
body.dfb-design .nav-links a {
display: inline-flex;
align-items: center;
min-height: 44px;
}
body.dfb-design .dfb-recaptcha-notice a {
display: inline;
min-height: 0;
}
body.dfb-design .dfb-category-nav {
max-width: 100%;
overflow: hidden;
}
body.dfb-design .dfb-category-pill {
flex: 1 1 auto;
white-space: normal;
}
body.dfb-design .main-navigation.toggled {
padding-bottom: 0.22rem;
border-bottom-color: color-mix(in srgb, var(--dfb-accent) 34%, transparent);
}
body.dfb-design .main-navigation .menu-toggle {
height: 36px;
padding-top: 0;
padding-bottom: 0;
}
body.dfb-design .main-navigation .menu-toggle .mobile-menu {
font-size: 0.65rem;
margin-left: 0.32rem;
letter-spacing: 0.09em;
}
body.dfb-design .main-navigation .main-nav ul li a {
padding-top: 0.72rem;
padding-bottom: 0.76rem;
border-bottom-color: color-mix(in srgb, var(--dfb-border) 68%, transparent);
}
body.dfb-design .main-navigation .main-nav ul li a::after {
display: none;
}
body.dfb-design.dfb-editorial-mode .dfb-hero {
padding-top: var(--dfb-rhythm-space-lg);
}
body.dfb-design .dfb-hero {
width: 100%;
}
body.dfb-design .dfb-hero-title {
font-size: clamp(1.85rem, 8vw, 2.16rem);
letter-spacing: -0.028em;
}
body.dfb-design .dfb-hero-excerpt {
font-size: 1.02rem;
}
body.dfb-design .dfb-hero-inner {
padding: var(--dfb-rhythm-space-gutter-md);
}
body.dfb-design.dfb-editorial-mode .inside-article {
padding-left: var(--dfb-rhythm-space-md);
padding-right: var(--dfb-rhythm-space-md);
}
body.dfb-design .inside-header {
padding-left: var(--dfb-rhythm-space-md);
padding-right: var(--dfb-rhythm-space-md);
}
body.dfb-design.dfb-editorial-mode .entry-content {
line-height: 1.78;
}
body.dfb-design .dfb-newsletter-cta {
margin-top: var(--dfb-rhythm-space-lg);
}
body.dfb-design .entry-content h2 {
margin-top: var(--dfb-rhythm-space-xl);
padding-top: var(--dfb-rhythm-space-xxs);
}
body.dfb-design .inside-article .entry-content img {
height: auto;
}
/* Em mobile, remover sombra extra e focar no fluxo de leitura */
body.dfb-design .dfb-newsletter-glow {
display: none;
}
body.dfb-design .dfb-newsletter-cta {
padding-left: var(--dfb-rhythm-space-gutter-lg);
padding-right: var(--dfb-rhythm-space-gutter-lg);
}
body.dfb-design .dfb-newsletter-cta .ff-el-form {
gap: var(--dfb-rhythm-space-xs);
grid-template-columns: 1fr;
}
body.dfb-design .dfb-newsletter-cta .ff-btn-submit {
width: 100%;
}
body.dfb-design .dfb-footer-grid {
padding-top: var(--dfb-rhythm-space-xl);
padding-bottom: var(--dfb-rhythm-space-lg);
}
body.dfb-design .dfb-hero-image img {
aspect-ratio: 16 / 9;
}
body.dfb-design .inside-article,
body.dfb-design .inside-article .entry-content {
max-width: 100%;
padding-left: 0;
padding-right: 0;
}
body.dfb-design .entry-content {
font-size: 1rem;
}
body.dfb-design .entry-content p.dfb-lead {
font-size: 1.06rem;
line-height: 1.66;
}
body.dfb-design .entry-content p,
body.dfb-design .entry-content ul,
body.dfb-design .entry-content ol {
margin-bottom: var(--dfb-rhythm-space-md);
}
body.dfb-design .entry-content p.dfb-dropcap {
font-feature-settings: normal;
}
body.dfb-design .entry-content p.dfb-dropcap::first-letter {
float: none;
display: block;
font-size: 1em;
margin: 0;
padding: 0;
color: inherit;
line-height: inherit;
}
body.dfb-design .site-main,
body.dfb-design .content-area {
padding-bottom: var(--dfb-rhythm-space-lg);
}
body.dfb-design .gb-grid-wrapper > .gb-grid-column {
padding-left: 0;
padding-right: 0;
border-color: color-mix(in srgb, var(--dfb-border), transparent 60%);
}
body.dfb-design .gb-grid-wrapper > .gb-grid-column .gb-headline-251bd4df,
body.dfb-design .gb-grid-wrapper > .gb-grid-column .gb-headline-14dcdb64,
body.dfb-design .gb-grid-wrapper > .gb-grid-column .gb-headline-040f2ffe {
margin-bottom: var(--dfb-rhythm-space-sm);
}
body.dfb-design .dfb-newsletter-cta {
padding-top: var(--dfb-rhythm-space-md);
padding-bottom: var(--dfb-rhythm-space-md);
}
body.dfb-design .inside-article .entry-content table {
display: block;
width: 100%;
overflow-x: auto;
}
body.dfb-design .inside-article .entry-content pre {
max-width: 100%;
overflow-x: auto;
}
body.dfb-design .entry-content > .wp-block-group,
body.dfb-design .entry-content > .wp-block-columns,
body.dfb-design .entry-content > .wp-block-gallery {
margin-top: var(--dfb-rhythm-space-lg);
margin-bottom: var(--dfb-rhythm-space-md);
}
}
@media (max-width: 480px) {
body.dfb-design {
--dfb-rhythm-space-group-v: calc(1.45rem * var(--dfb-rhythm-scale));
--dfb-anchor-offset: clamp(60px, 12vw, 74px);
}
body.dfb-design .inside-article,
body.dfb-design .inside-article .entry-content {
padding-left: var(--dfb-rhythm-space-gutter-md);
padding-right: var(--dfb-rhythm-space-gutter-md);
}
body.dfb-design.dfb-editorial-mode .dfb-hero {
padding-top: var(--dfb-rhythm-space-md);
}
body.dfb-design .dfb-hero-inner {
border-radius: 0;
}
body.dfb-design .entry-content h2 {
font-size: clamp(1.48rem, 7vw, 1.72rem);
letter-spacing: 0;
}
body.dfb-design .entry-content h2::after {
width: calc(var(--dfb-rhythm-space-xl) * 0.95);
}
body.dfb-design .entry-content h3 {
font-size: clamp(1.18rem, 5.7vw, 1.36rem);
}
body.dfb-design article .entry-header .entry-title,
body.dfb-design article .entry-header .entry-title a {
font-size: clamp(1.8rem, 9vw, 2.18rem);
}
body.dfb-design .entry-content {
line-height: 1.75;
}
body.dfb-design .entry-content blockquote {
padding: var(--dfb-rhythm-space-md) var(--dfb-rhythm-space-lg);
margin-top: var(--dfb-rhythm-space-md);
margin-bottom: var(--dfb-rhythm-space-md);
}
body.dfb-design .entry-content blockquote::before {
font-size: 2rem;
}
body.dfb-design .entry-content code,
body.dfb-design .entry-content pre {
font-size: 0.95rem;
}
body.dfb-design .gb-grid-wrapper > .gb-grid-column {
padding: var(--dfb-rhythm-space-sm);
gap: var(--dfb-rhythm-space-xs);
border-radius: 0;
}
body.dfb-design .gb-grid-wrapper > .gb-grid-column .gb-headline-251bd4df {
min-height: auto;
}
body.dfb-design .gb-grid-wrapper > .gb-grid-column .gb-headline-251bd4df a {
display: inline-block;
min-height: 44px;
padding-top: 0.05em;
}
body.dfb-design .dfb-newsletter-cta {
border-left-width: 2px;
border-radius: 0;
}
body.dfb-design .dfb-newsletter-cta h3 {
font-size: clamp(1.25rem, 5.4vw, 1.44rem);
}
body.dfb-design .dfb-newsletter-cta p {
font-size: 0.98rem;
line-height: 1.52;
}
body.dfb-design .gb-grid-wrapper > .gb-grid-column .gb-headline-251bd4df {
margin-bottom: var(--dfb-rhythm-space-xs);
}
body.dfb-design a {
text-underline-offset: 0.22em;
text-decoration-thickness: 2px;
}
body.dfb-design .wp-block-image,
body.dfb-design .wp-block-gallery,
body.dfb-design .wp-caption {
margin-bottom: var(--dfb-rhythm-space-md);
}
}
@media (prefers-contrast: more) {
body.dfb-design {
--dfb-accent: #35d2ff;
--dfb-bg: #05050a;
--dfb-surface: #0f0f1f;
--dfb-text: #eef1ff;
--dfb-text-2: #c4c6d8;
}
body.dfb-design .dfb-hero-inner,
body.dfb-design .dfb-newsletter-cta,
body.dfb-design .dfb-footer-wrap {
border-color: rgba(255, 255, 255, 0.2) !important;
}
}
@media (prefers-reduced-motion: no-preference) {
body.dfb-design:not(.dfb-editorial-mode) .dfb-hero-inner {
animation: dfb-subtle-float 12s ease-in-out infinite;
}
body.dfb-design:not(.dfb-editorial-mode) .dfb-hero-image img {
animation: dfb-parallax-shift 12s ease-in-out infinite;
}
@keyframes dfb-subtle-float {
0%,
100% { transform: translateY(0); }
50% { transform: translateY(-4px); }
}
@keyframes dfb-parallax-shift {
0%,
100% { transform: scale(1.04) rotate(0.01deg); }
50% { transform: scale(1.01) rotate(0.01deg); }
}
}
/* Skip link para navegação por teclado */
#dfb-skip-link,
.dfb-skip-link {
position: fixed;
top: var(--dfb-rhythm-space-gutter-sm);
left: var(--dfb-rhythm-space-gutter-sm);
z-index: 1002;
transform: translateY(-140%);
background: var(--dfb-surface-2);
color: var(--dfb-text);
border: 1px solid var(--dfb-border);
padding: var(--dfb-rhythm-space-gutter-sm) var(--dfb-rhythm-space-gutter-lg);
border-radius: var(--dfb-radius-sm);
text-decoration: none;
font-size: var(--dfb-font-size-nav);
font-weight: 600;
font-family: var(--dfb-font-display);
transition: transform .2s ease;
}
#dfb-skip-link:focus,
.dfb-skip-link:focus {
transform: translateY(0);
outline: none;
box-shadow: var(--focus-ring);
}
#dfb-reading-progress {
position: fixed;
top: 0;
left: 0;
height: 3px;
width: 0%;
background: linear-gradient(90deg, var(--dfb-accent), color-mix(in srgb, var(--dfb-accent) 20%, transparent));
z-index: 1003;
pointer-events: none;
opacity: 0.95;
}
/* Acessibilidade: respeitar preferência por menos movimento */
@media (prefers-reduced-motion: reduce) {
*,
*::before,
*::after {
animation-duration: .01ms !important;
animation-iteration-count: 1 !important;
transition-duration: .01ms !important;
scroll-behavior: auto !important;
}
[data-animate],
body.dfb-archive .gb-grid-wrapper > .gb-grid-column {
opacity: 1 !important;
transform: none !important;
}
}
/* Publicidade: reforçar slots limpos para aumentar fill-rate e evitar deslocamento visual */
body.dfb-design .dfb-ad {
box-sizing: border-box;
width: 100%;
margin: clamp(2rem, 4vw, 3rem) auto;
padding-top: 0.75rem;
border-top: 1px solid color-mix(in srgb, var(--dfb-border) 76%, transparent);
text-align: center;
}
body.dfb-design .dfb-ad--in-article,
body.dfb-design .dfb-ad--fim-artigo {
min-height: 320px;
}
body.dfb-design .dfb-ad--rail {
min-height: 640px;
margin-top: 0;
margin-bottom: 0;
}
body.dfb-design .dfb-ad__label {
margin: 0 0 0.65rem;
font-family: var(--dfb-font-mono), 'JetBrains Mono', monospace;
font-size: 0.7rem;
font-weight: 500;
line-height: 1.4;
letter-spacing: 0.04em;
color: #b8b8c8;
}
body.dfb-design .dfb-ad--rail ins.adsbygoogle {
width: 300px !important;
height: 600px;
max-width: 100% !important;
}
/* Um estado explicitamente unfilled pode colapsar; um anuncio servido nunca e escondido. */
body.dfb-design .dfb-ad:has(> ins.adsbygoogle[data-ad-status="unfilled"]),
body.dfb-design .dfb-ad:has(> ins.adsbygoogle[data-ad-status="unfill-optimized"]) {
display: none;
min-height: 0;
margin: 0;
padding: 0;
border: 0;
}
/* Navigation repair: readable dropdowns and independent touch disclosures. */
@media (min-width: 769px) {
body.dfb-design #primary-menu > ul { flex-wrap: wrap; }
body.dfb-design .site-header .inside-header { flex-wrap: wrap !important; }
body.dfb-design .site-header #site-navigation { min-width: 0; max-width: 100%; }
body.dfb-design .main-navigation .main-nav ul ul { width: min(300px, calc(100vw - 32px)); }
body.dfb-design .main-navigation .main-nav ul ul li a {
display: flex;
width: 100%;
box-sizing: border-box;
min-height: 44px;
padding: 12px 16px;
line-height: 1.4;
white-space: normal;
}
body.dfb-design .main-navigation .main-nav > ul > li > a {
min-height: 44px;
line-height: 1.4;
}
}
body.dfb-design .dfb-mobile-nav .menu li { position: relative; }
body.dfb-design .dfb-mobile-nav .menu li.menu-item-has-children > a { padding-right: 52px; }
body.dfb-design .dfb-mobile-nav .dfb-submenu-toggle {
position: absolute;
top: 8px;
right: 0;
width: 44px;
height: 44px;
padding: 0;
color: var(--dfb-text);
background: var(--dfb-surface-2);
border: 1px solid var(--dfb-border);
border-radius: 8px;
font-size: 22px;
cursor: pointer;
}
body.dfb-design .dfb-mobile-nav .dfb-submenu-toggle[aria-expanded="true"] { transform: rotate(180deg); }
body.dfb-design .dfb-mobile-nav .menu ul[hidden] { display: none !important; }
body.dfb-design .dfb-mobile-nav .menu a { box-sizing: border-box; line-height: 1.45; }
body.dfb-design .dfb-mobile-nav :is(a, button):focus-visible {
outline: 2px solid var(--dfb-accent);
outline-offset: 3px;
}
@media (max-width: 380px) {
body.dfb-design .site-header .site-logo { margin-right: 8px; }
body.dfb-design .site-header .site-logo img { width: 48px !important; height: auto; }
body.dfb-design .site-header .main-title { font-size: 14px; }
body.dfb-design .site-header .site-description { white-space: normal; line-height: 1.4; }
}
/* Shared archive cards and readable headings across all published languages. */
body.dfb-design :is(h1, h2, h3, .entry-title) { overflow-wrap: anywhere; }
body.dfb-design .gb-container-04da9225 { min-width: 0; flex-wrap: wrap; gap: 16px; }
body.dfb-design .gb-container-04da9225 h1 {
min-width: 0;
max-width: 100%;
flex: 1 1 320px;
font-size: clamp(1.6rem, 4vw, 2.8rem);
line-height: 1.2;
}
body.dfb-design .gb-container-04da9225 .wp-block-categories { max-width: 100%; }
body.dfb-design .gb-container-04da9225 select { max-width: 100%; }
body.dfb-design .widget-area .gb-headline-040f2ffe,
body.dfb-design .widget-area .gb-headline-040f2ffe a {
font-family: var(--dfb-font-body) !important;
font-size: 16px !important;
font-weight: 600 !important;
line-height: 1.5 !important;
letter-spacing: 0 !important;
color: var(--dfb-text) !important;
hyphens: none;
}
body.dfb-design .widget-area .gb-headline-14dcdb64 { font-size: 12px; line-height: 1.5; }
body.dfb-design .dfb-archive-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 24px;
margin-bottom: 32px;
}
body.dfb-design .dfb-archive-card {
padding: 0 !important;
min-width: 0;
margin: 0 !important;
background: var(--dfb-surface-2);
border: 1px solid var(--dfb-border);
border-radius: 14px;
overflow: hidden;
}
body.dfb-design .dfb-archive-card__image { display: block; }
body.dfb-design .dfb-archive-card__image img {
display: block;
width: 100%;
height: auto;
aspect-ratio: 16 / 9;
object-fit: cover;
}
body.dfb-design .dfb-archive-card__content { padding: 20px; }
body.dfb-design .dfb-archive-card h2,
body.dfb-design .dfb-archive-card h2 a {
font-family: var(--dfb-font-body) !important;
font-size: clamp(20px, 2vw, 24px) !important;
line-height: 1.35 !important;
letter-spacing: -0.015em !important;
color: var(--dfb-text) !important;
hyphens: none;
margin: 12px 0;
}
body.dfb-design .dfb-archive-card p { font-size: 16px; line-height: 1.65; margin: 0 0 16px; }
body.dfb-design .dfb-archive-card time { font-size: 13px; color: var(--dfb-text-2); }
body.dfb-design .dfb-archive-card__category { font-size: 13px; color: var(--dfb-accent); }
body.dfb-design .dfb-archive-card a:focus-visible { outline: 2px solid var(--dfb-accent); outline-offset: 3px; }
body.dfb-design .dfb-archive-card h2 a:hover { text-decoration: underline; }
body.dfb-design .main-navigation .dfb-language-menu .sub-menu { width: 200px; }
@media (max-width: 768px) {
body.dfb-design .dfb-archive-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
body.dfb-design .gb-container-04da9225 { flex-direction: column; align-items: stretch; }
body.dfb-design .gb-container-04da9225 h1 { flex: none; }
}