/* Estilos do site Ambientei Studio — Design System V1.1 (26/09/2026).
   Valores em tokens.css, gerado de ../ambientei-studio/marca/design-system-v01.json. Aqui só entram
   tokens: sete tamanhos (mega, display, título, subtítulo, destaque, texto, detalhe), dois pesos de
   Manrope (texto e forte) e o itálico da Newsreader para a voz. A geometria do logo fica fora da escala. */
@import url('tokens.css');

@font-face{font-family:Manrope;src:url('assets/fonts/manrope-Manrope%5Bwght%5D.ttf') format('truetype');font-style:normal;font-weight:200 800;font-display:swap}
@font-face{font-family:Newsreader;src:url('assets/fonts/newsreader-Newsreader%5Bopsz,wght%5D.ttf') format('truetype');font-style:normal;font-weight:200 800;font-display:swap}
@font-face{font-family:Newsreader;src:url('assets/fonts/newsreader-Newsreader-Italic%5Bopsz,wght%5D.ttf') format('truetype');font-style:italic;font-weight:200 800;font-display:swap}

/* ---------- Base ---------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:var(--weight-texto) var(--type-texto)/var(--leading-texto) var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
a,button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
a:focus-visible,button:focus-visible{outline:2px solid currentColor;outline-offset:6px}
h1,h2,h3,p,figure{margin:0}
p{max-width:60ch}
img{max-width:100%}
@media(max-width:760px){
  html{scroll-padding-top:95px}
  body:not(.js) .header{margin-bottom:140px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation:none!important;transition-property:opacity,color,background-color,border-color!important}
}

/* ---------- Escala tipográfica ---------- */
h1,h2,h3,.mega,.display,.titulo{font-family:var(--font-heading);font-weight:var(--weight-forte);text-wrap:balance}
h1,.display{font-size:var(--type-display);line-height:var(--leading-display);letter-spacing:var(--tracking-display)}
h2,.titulo{font-size:var(--type-titulo);line-height:var(--leading-titulo);letter-spacing:var(--tracking-heading)}
h3,.sub{font-size:var(--type-sub);line-height:var(--leading-sub);letter-spacing:var(--tracking-subheading)}
.mega{font-size:var(--type-mega);line-height:var(--leading-mega);letter-spacing:var(--tracking-mega)}
/* Voz: acento dos títulos e falas do cliente. Terracota no claro; areia nos campos fortes. */
h1 em,h2 em,h3 em,.mega em,.display em,.titulo em,.sub em,.voz{font-family:var(--font-editorial);font-style:italic;font-weight:400;letter-spacing:var(--tracking-voz);color:var(--accent);font-optical-sizing:auto}
.on-dark em,.on-terracota em{color:var(--color-areia)}
.destaque{font-size:var(--type-destaque);line-height:var(--leading-destaque);color:var(--text-muted);max-width:46ch}
.detalhe,.hint{font-size:var(--type-detalhe);line-height:1.45;color:var(--text-muted)}
.on-dark .destaque,.on-dark .detalhe,.on-dark .hint{color:var(--on-dark-muted)}
.on-terracota .destaque,.on-terracota .detalhe{color:var(--on-dark)}
.hint-touch{display:none}

/* Rótulo: único uso de caixa alta, com marcador quadrado. Números de lista e de passo também são rótulo. */
.eyebrow,.step-number,.why-number,.contact-points span,.post-meta{display:inline-flex;align-items:center;gap:10px;margin:0 0 20px;font:var(--weight-forte) var(--type-detalhe)/1.4 var(--font-interface);letter-spacing:var(--tracking-rotulo);text-transform:uppercase;color:var(--text)}
.eyebrow:before,.step-number:before,.why-number:before,.contact-points span:before,.post-meta:before{content:'';flex:none;width:7px;height:7px;background:var(--accent)}
.on-dark .eyebrow,.on-dark .step-number,.on-dark .why-number,.on-terracota .eyebrow,.on-terracota .contact-points span{color:var(--on-dark)}
.on-dark .eyebrow:before,.on-dark .step-number:before{background:var(--color-areia)}
.on-terracota .eyebrow:before,.on-terracota .contact-points span:before{background:var(--on-dark)}
.eyebrow-link{display:inline-flex}
@media(hover:hover) and (pointer:fine){
  .eyebrow-link:hover{text-decoration:underline;text-underline-offset:4px}
}

/* ---------- Composição ---------- */
.wrap{width:calc(100% - 2 * var(--gutter));max-width:var(--content-width);margin-inline:auto}
.skip{position:absolute;left:20px;top:-100px;z-index:10;padding:12px;background:var(--surface)}
.skip:focus{top:12px}
.section{padding-block:var(--space-section);border-top:1px solid var(--border)}
.section-more{margin-top:40px}
/* Cabeçalho de seção: rótulo e título; à direita, um item só, alinhado pela base. */
.cab{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;margin-bottom:clamp(40px,4.5vw,64px)}
.cab-main{display:grid;gap:20px;justify-items:start}
.cab-main .eyebrow{margin:0}
.cab-side{display:grid;gap:24px;justify-items:start}
.cab-side p{margin:0}
@media(min-width:1001px){
  .cab{grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:48px;align-items:end}
}
[data-carousel]:focus-visible{outline:2px solid var(--accent);outline-offset:4px}

/* ---------- Ações: botão, link e controle ---------- */
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:0 26px;border-radius:var(--radius);background:var(--action);color:var(--on-action);font:var(--weight-forte) var(--type-texto)/1.2 var(--font-interface);white-space:nowrap;transition:transform var(--motion-fast) var(--ease-out),background-color var(--motion-fast) ease,color var(--motion-fast) ease}
.button:active{transform:scale(.97)}
@media(max-width:400px){
  .button{white-space:normal;text-align:left}
}
.button span{display:inline-block;transition:transform 190ms var(--ease-out)}
.on-dark .button,.on-terracota .button{background:var(--surface);color:var(--text)}
.text-link{display:inline-flex;align-items:center;gap:12px;padding:10px 0 6px;border-bottom:1px solid currentColor;font:var(--weight-forte) var(--type-texto)/1.3 var(--font-interface);transition:color 200ms ease}
.text-link span[aria-hidden]{display:inline-block;transition:transform 200ms var(--ease-out)}
@media(hover:hover) and (pointer:fine){
  .button:hover{background:var(--action-hover)}
  .on-dark .button:hover,.on-terracota .button:hover{background:var(--color-areia);color:var(--text)}
  .button:hover span{transform:translate(3px,-3px)}
  a.text-link:hover,.post-card a:hover .text-link,.post-feature a:hover .text-link,.silo-card a:hover .text-link{color:var(--accent)}
  .on-dark a.text-link:hover,.on-terracota a.text-link:hover{color:var(--color-areia)}
  a.text-link:hover span[aria-hidden],.post-card a:hover .text-link span[aria-hidden],.post-feature a:hover .text-link span[aria-hidden]{transform:translate(3px,-3px)}
}
/* Controle: círculo com borda para setas de carrossel e galeria. */
.gallery-controls button,.carousel-actions button{display:inline-grid;place-items:center;width:48px;height:48px;padding:0;border:1px solid var(--border-strong);border-radius:50%;background:transparent;font:var(--weight-forte) 18px/1 var(--font-interface);cursor:pointer;transition:transform var(--motion-fast) var(--ease-out),background-color var(--motion-fast) ease,color var(--motion-fast) ease}
.gallery-controls button:active,.carousel-actions button:active{transform:scale(.94)}
.gallery-controls button:disabled,.carousel-actions button:disabled{opacity:.3;cursor:default;transform:none}
@media(hover:hover) and (pointer:fine){
  .gallery-controls button:not(:disabled):hover,.carousel-actions button:not(:disabled):hover{background:var(--text);border-color:var(--text);color:var(--bg)}
}
.carousel-hint{display:none}
.carousel-hint[hidden]{display:none}
.carousel-position{font-variant-numeric:tabular-nums;white-space:nowrap}

/* ---------- Cabeçalho e marca ---------- */
.header{display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:8;min-height:128px;background:var(--header-surface);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:transform 240ms var(--ease-out),box-shadow 240ms ease;view-transition-name:header}
.header.wrap{width:100%;max-width:none;margin-inline:0;padding-inline:var(--gutter)}
.header.scrolled{box-shadow:0 1px 0 var(--shadow-soft)}
.scroll-progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left center;pointer-events:none}
.nav{display:flex;align-items:center;gap:22px;font:var(--weight-forte) var(--type-detalhe)/1.3 var(--font-interface)}
.nav a{position:relative;padding-block:14px;white-space:nowrap}
.nav a:not(.nav-contact):after{content:'';position:absolute;left:0;right:0;bottom:6px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform 190ms var(--ease-out)}
.nav a:not(.nav-contact):focus-visible:after{transform:scaleX(1)}
.nav .nav-contact{border-bottom:1px solid var(--text);padding-bottom:7px}
@media(hover:hover) and (pointer:fine){
  .nav a:not(.nav-contact):hover:after{transform:scaleX(1)}
}
.menu-button{display:none;min-height:44px;padding:0 16px;border:1px solid var(--border-strong);border-radius:var(--radius);background:transparent;font:var(--weight-forte) var(--type-detalhe)/1 var(--font-interface);cursor:pointer;transition:transform var(--motion-fast) var(--ease-out)}
.menu-button:active{transform:scale(.97)}
/* Assinatura do cabeçalho: abre em linha editorial e fica lado a lado na rolagem (--logo-progress em site.js). */
.header.header-flow{--logo-progress:0;min-height:128px;gap:24px;transform:translateY(calc(-40px * var(--logo-progress)));transition:box-shadow 320ms ease}
.header-flow .header-identity{display:flex;align-items:center;flex-shrink:0;transform:translateY(calc(20px * var(--logo-progress)))}
.header-flow .flow-logo{position:relative;display:block;min-width:286px;width:286px;height:84px;color:var(--text)}
.header-flow .flow-name{position:absolute;left:0;top:7px;font-family:var(--font-editorial);font-size:64px;font-weight:520;line-height:.85;letter-spacing:-.077em;transform-origin:left top;transform:translateY(calc(14px * var(--logo-progress))) scale(calc(1 - .22 * var(--logo-progress)))}
.header-flow .flow-studio{position:absolute;left:188px;top:65px;font-size:16px;font-weight:750;letter-spacing:.13em;line-height:1;transform:translate(calc(44px * var(--logo-progress)),calc(-36px * var(--logo-progress)))}
.header-flow .flow-rule{position:absolute;left:104px;top:73px;width:68px;height:1px;background:var(--accent);opacity:calc(1 - var(--logo-progress));transform-origin:right;transform:scaleX(calc(1 - var(--logo-progress)))}
.header-flow .flow-divider{position:absolute;left:211px;top:19px;width:3px;height:36px;background:var(--accent);opacity:var(--logo-progress);transform-origin:center;transform:scaleY(var(--logo-progress))}
.header-flow .nav{margin-left:auto;transform:translateY(calc(20px * var(--logo-progress)))}
.header-flow .menu-button{transform:translateY(calc(20px * var(--logo-progress)));transition:background-color 180ms ease}
@media(min-width:761px) and (max-width:1000px){
  .header-flow .menu-button{display:block;margin-left:auto}
  .header-flow .nav{position:absolute;top:100%;left:0;right:0;flex-wrap:wrap;padding:24px var(--gutter);background:var(--surface);border-bottom:1px solid var(--border);transform:none}
  .header-flow .nav[hidden]{display:none}
}
@media(max-width:760px){
  .js .nav[hidden]{display:none}
  .menu-button{display:block}
  .nav{position:absolute;top:100%;left:0;right:0;z-index:5;flex-wrap:wrap;gap:8px 22px;padding:26px;background:var(--surface);border:1px solid var(--border);box-shadow:0 20px 30px var(--shadow-soft);font-size:var(--type-texto);transform-origin:top center;transition:opacity 180ms var(--ease-out),transform 180ms var(--ease-out)}
  .header.header-flow{min-height:96px;transform:none;gap:10px}
  .header-flow .header-identity{display:block;position:relative;flex:1;min-width:0;height:72px;transform:none}
  .header-flow .flow-logo{transform:scale(.8);transform-origin:left top}
  .header-flow .menu-button{align-self:flex-start;margin-top:18px;transform:none}
  .header-flow .nav{transform:none}
}
@media(max-width:760px){@starting-style{
  .nav{opacity:0;transform:translateY(-6px)}
}}
@media(max-width:360px){
  .header-flow .flow-logo{transform:scale(.68)}
  .header-flow .menu-button{padding-inline:8px}
}
@media(prefers-reduced-motion:reduce){
  .header,.header.header-flow,.nav a:after,.text-link,.button span{transition:none!important}
}
/* Marca por extenso (rodapé): Newsreader 520 com STUDIO e fio. */
.brand{display:inline-flex;flex-direction:column;line-height:1;min-width:max-content}
.brand-name{font-family:var(--font-editorial);font-weight:520;letter-spacing:-.077em;line-height:.78;font-optical-sizing:auto}
.brand-sub{display:flex;align-items:center;justify-content:flex-end;gap:13px;margin-top:12px;font:750 11px/1 var(--font-interface);letter-spacing:.22em}
.brand-sub:before{content:'';width:82px;height:1px;background:var(--accent)}
.brand-symbol{display:inline-block;flex:none;width:clamp(48px,5.5vw,76px);aspect-ratio:1;border-radius:20%;overflow:hidden}
.brand-symbol img{display:block;width:100%;height:100%}

/* ---------- Hero com variações de cor ---------- */
.hero{position:relative;width:100vw;max-width:none;margin-left:calc(50% - 50vw);aspect-ratio:16/9;overflow:hidden;background:var(--surface-muted)}
.hero-layers{position:absolute;inset:0;isolation:isolate;z-index:0}
.hero-media .hero-layer{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:60% 50%;opacity:0;transition:opacity 1400ms cubic-bezier(.65,0,.35,1)}
.hero-media .hero-layer.is-active{opacity:1}
@media(prefers-reduced-motion:no-preference){
  .hero{animation:hero-expand 850ms var(--ease-out) both}
  .hero-layers{animation:hero-settle 1400ms var(--ease-out) both}
}
/* Seletor sobre a foto: vidro escuro. É o único lugar da página com cores fora da paleta, porque mostra o produto. */
.hero-controls{position:absolute;z-index:5;top:clamp(14px,2vw,28px);right:clamp(14px,2vw,32px);display:flex;align-items:center;gap:14px;padding:7px 16px 7px 7px;border:1px solid var(--border-inverse);border-radius:var(--radius-pill);background:var(--glass-dark);color:var(--on-dark);box-shadow:inset 0 1px 0 var(--glass-highlight),0 12px 32px var(--shadow-deep);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .hero-controls{background:var(--glass-dark-fallback)}
}
.hero-toggle{display:grid;place-items:center;width:38px;height:38px;padding:0;border:0;border-radius:50%;background:var(--glass-highlight);color:var(--on-dark);cursor:pointer;transition:background-color 160ms ease,transform 160ms var(--ease-out)}
.hero-toggle:active{transform:scale(.94)}
.hero-toggle-icon{width:10px;height:12px;border-inline:3px solid currentColor}
.hero-toggle[aria-pressed=true] .hero-toggle-icon{width:0;height:0;margin-left:3px;border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent currentColor}
.hero-swatches{display:flex;gap:10px}
.hero-swatch{position:relative;width:28px;height:28px;padding:0;border:2px solid var(--on-dark);border-radius:50%;background:linear-gradient(135deg,var(--c1) 50%,var(--c2) 50%);cursor:pointer;transition:transform 160ms var(--ease-out)}
.hero-swatch:before{content:'';position:absolute;inset:-11px}
.hero-swatch:active{transform:scale(.9)}
.hero-swatch[aria-pressed=true]{transform:scale(1.06)}
.hero-ring{position:absolute;inset:-7px;width:38px;height:38px;transform:rotate(-90deg);opacity:0;pointer-events:none;transition:opacity 160ms ease}
.hero-ring circle{fill:none;stroke:var(--on-dark);stroke-width:1.6;stroke-linecap:round;stroke-dasharray:103.7;stroke-dashoffset:0}
.hero-swatch[aria-pressed=true] .hero-ring{opacity:1}
.hero-swatch.is-timing .hero-ring circle{animation:hero-ring var(--hold,3400ms) linear forwards}
@media(hover:hover) and (pointer:fine){
  .hero-toggle:hover{background:var(--glass-hover)}
  .hero-swatch:hover{transform:scale(1.14)}
}
.hero-caption{display:flex;justify-content:flex-end;padding-top:14px}
.hero-variant-label{font-size:var(--type-detalhe);color:var(--text-muted)}
@media(max-width:760px){
  .hero{aspect-ratio:4/5}
  .hero-controls{top:auto;right:auto;left:12px;bottom:12px;gap:12px;padding:6px 12px 6px 6px}
  .hero-swatches{gap:8px}
  .hero-swatch{width:24px;height:24px}
  .hero-ring{width:34px;height:34px}
  .hero-caption{padding-top:12px}
}

/* ---------- Abertura ---------- */
/* Home: campo claro para a marca e navegação, independente das áreas de luz da fotografia. */
.home-immersive .header.header-flow{margin-bottom:-128px;background:var(--header-surface);color:var(--text);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--shadow-soft);transition:background-color 200ms ease}
.home-immersive .header-flow .flow-logo{color:inherit}
.home-immersive .header-flow .flow-rule,.home-immersive .header-flow .flow-divider{background:var(--accent)}
.home-immersive .header .nav-contact,.home-immersive .header .menu-button{border-color:currentColor}
.home-immersive .hero{height:100svh;min-height:620px;aspect-ratio:auto;animation:none}
.home-immersive .hero.hero-static::after{content:none}
.home-immersive .hero-static .hero-layer{object-position:50% 50%;transition:none}
.home-immersive .hero-controls{top:auto;bottom:28px}
@media(max-width:1000px){.home-immersive .header-flow .nav{background:var(--surface);color:var(--text);border-color:var(--border)}}
@media(max-width:760px){
  .home-immersive .header.header-flow{margin-bottom:-96px}
  .home-immersive .hero{min-height:560px}
  .home-immersive .hero-static .hero-layer{object-position:34% 50%}
  .home-immersive .hero-controls{bottom:16px}
  .home-immersive:not(.js) .header{margin-bottom:-96px}
}

.intro{padding-block:var(--space-section)}
.intro-kicker{display:flex;width:max-content}
.intro-line{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.intro-line>span{display:block}
.intro-line-serif{padding-left:clamp(0px,9vw,124px);font-family:var(--font-editorial);font-style:italic;font-weight:400;letter-spacing:var(--tracking-voz);color:var(--accent);font-optical-sizing:auto}
.intro-foot{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:end;margin-top:clamp(48px,6vw,88px);padding-top:32px;border-top:1px solid var(--border)}
.intro-publicos{display:grid;gap:12px;justify-items:start}
.intro-publicos .eyebrow{margin:0}
.intro-tags{display:flex;flex-wrap:wrap;gap:4px 28px;margin:0;padding:0;list-style:none}
.intro-copy{display:grid;gap:28px;justify-items:start}
.motion-ready .intro-line>span{transform:translateY(106%);transition:transform 720ms var(--ease-out)}
.motion-ready .intro-line-serif>span{transition-delay:140ms}
.motion-ready .intro.is-visible .intro-line>span{transform:none}
@media(max-width:1000px){
  .intro-foot{grid-template-columns:1fr;gap:32px}
  .intro-copy{order:-1}
}
@media(max-width:760px){
  .intro-line-serif{padding-left:0}
}

/* ---------- Faixa “Da peça à cena” (campo carvão) ---------- */
.impact-bridge{position:relative;width:100vw;height:170svh;margin-left:calc(50% - 50vw);overflow:clip;background:var(--color-carvao);color:var(--on-dark)}
.bridge-stage{position:sticky;top:82px;display:flex;flex-direction:column;justify-content:space-between;height:calc(100svh - 82px);min-height:560px;padding:clamp(24px,3.3vw,48px) var(--gutter);isolation:isolate}
.bridge-media{position:absolute;inset:0;z-index:-1;overflow:hidden;will-change:clip-path}
.bridge-media img{display:block;width:100%;height:100%;object-fit:cover;transform-origin:center;will-change:transform}
.bridge-media:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,var(--image-scrim-top),var(--image-scrim-center) 45%,var(--image-scrim-bottom))}
.bridge-top,.bridge-bottom{display:flex;justify-content:space-between;align-items:center;gap:24px}
.bridge-top{padding-top:18px;border-top:1px solid var(--border-inverse)}
.bridge-top .eyebrow{margin:0}
.bridge-bottom{align-items:flex-end;padding-bottom:20px;border-bottom:1px solid var(--border-inverse)}
.bridge-bottom .destaque{color:var(--on-dark)}
.bridge-bottom .text-link{flex-shrink:0}
.bridge-title{display:flex;flex-direction:column;align-items:flex-start;width:100%;margin-block:auto;font-weight:var(--weight-forte);line-height:1}
.bridge-pre{margin-left:clamp(0px,6vw,120px);font-size:var(--type-display);letter-spacing:var(--tracking-display)}
.bridge-main{display:block;margin:-.06em 0 0 clamp(24px,18vw,340px);font-size:var(--type-mega);line-height:var(--leading-mega);white-space:nowrap;will-change:transform}
.bridge-main em{color:var(--color-areia)}
.bridge-dot{display:inline-block;width:.1em;height:.1em;margin-left:.05em;overflow:hidden;background:var(--accent);color:transparent;line-height:0}
@media(max-width:760px){
  .bridge-stage{top:68px;height:calc(100svh - 68px);min-height:0;padding:24px 20px}
  .bridge-top .detalhe{display:none}
  .bridge-bottom{flex-direction:column;align-items:flex-start;gap:12px}
  .bridge-pre{margin-left:0}
  .bridge-main{margin-left:12vw}
}
@media(prefers-reduced-motion:reduce){
  .impact-bridge{height:auto}
  .bridge-stage{position:relative;top:auto;height:auto;min-height:520px;gap:48px}
  .bridge-main{transform:none!important;will-change:auto}
  .bridge-media{clip-path:none!important}
  .bridge-media img{transform:none!important}
}

/* ---------- Antes e depois ---------- */
.ba-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,28px)}
.ba-study-note{max-width:70ch;margin:0 0 24px}
.ba-card{margin:0;transition:opacity 260ms var(--ease-out),transform 260ms var(--ease-out)}
@starting-style{
  .ba-card{opacity:0;transform:translateY(10px)}
}
.ba-frame{position:relative}
.ba-stage{--x:50%;--y:50%;position:relative;display:block;width:100%;aspect-ratio:1;padding:0;border:0;overflow:hidden;background:var(--surface-muted);cursor:pointer}
.ba-layer{position:absolute;inset:0;display:block}
.ba-layer img,.ba-layer .placeholder{width:100%;height:100%;object-fit:cover}
.ba-before img,.ba-before .placeholder{transition:transform 900ms var(--ease-out)}
.ba-after img,.ba-after .placeholder{transform:scale(1.08);transition:transform 900ms var(--ease-out)}
.ba-ph-before{background:var(--surface)!important}
.ba-ph-after{background:var(--action)!important;color:var(--on-dark)!important}
.ba-after{clip-path:circle(0% at var(--x) var(--y));transition:clip-path 420ms var(--ease-editorial)}
.ba-card[data-state=after] .ba-after{clip-path:circle(150% at var(--x) var(--y));transition-duration:700ms}
.ba-card[data-state=after] .ba-after img,.ba-card[data-state=after] .ba-after .placeholder{transform:none}
.ba-card[data-state=after] .ba-before img,.ba-card[data-state=after] .ba-before .placeholder{transform:scale(1.04)}
/* Etiquetas sobre a foto: vidro fosco, a outra pílula permitida pelo sistema. */
.ba-tag{position:absolute;left:14px;top:14px;z-index:2;display:grid}
.ba-tag span{grid-area:1/1;padding:6px 12px;border-radius:var(--radius-pill);color:var(--text);font:var(--weight-forte) var(--type-detalhe)/1.2 var(--font-interface);letter-spacing:var(--tracking-rotulo);text-transform:uppercase;transition:opacity 200ms ease,filter 200ms ease,transform 200ms var(--ease-out)}
.ba-tag-after{opacity:0;filter:blur(3px);transform:translateY(4px)}
.ba-card[data-state=after] .ba-tag-before{opacity:0;filter:blur(3px);transform:translateY(-4px)}
.ba-card[data-state=after] .ba-tag-after{opacity:1;filter:none;transform:none}
.ba-cue{position:absolute;bottom:14px;left:50%;z-index:2;display:flex;align-items:center;gap:7px;width:max-content;max-width:calc(100% - 24px);padding:9px 12px;border-radius:var(--radius-pill);background:var(--glass-light);color:var(--text);font-size:var(--type-detalhe);font-weight:var(--weight-forte);line-height:1.3;pointer-events:none;transform:translateX(-50%);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.ba-cue svg{flex-shrink:0}
.ba-cue-icon{position:relative;display:grid;place-items:center;flex:0 0 24px}
.ba-cue-icon::after{content:'';position:absolute;top:-3px;left:6px;width:15px;height:15px;border:1.5px solid currentColor;border-radius:50%;opacity:0;pointer-events:none}
.ba-cue-touch,.ba-cue-after{display:none}
.ba-card[data-state=after] .ba-cue-before{display:none}
.ba-card[data-state=after] .ba-cue-after{display:inline}
@media(hover:none),(pointer:coarse){.ba-cue-mouse{display:none}.ba-cue-touch{display:inline}}
.ba-reveal.is-preview .ba-cue-icon{animation:ba-guide-tap 530ms var(--ease-out) 2}
.ba-reveal.is-preview .ba-cue-icon::after{animation:ba-guide-ring 530ms var(--ease-out) 2}
.ba-reveal.is-preview .ba-after{transition-duration:220ms}
.ba-reveal.is-preview .ba-before img,.ba-reveal.is-preview .ba-after img{transform:none!important}
@keyframes ba-guide-tap{0%,100%{transform:none}25%{transform:translateY(-4px) rotate(-7deg)}50%{transform:translateY(2px) scale(.9)}75%{transform:translateY(-1px)}}
@keyframes ba-guide-ring{0%,35%,100%{opacity:0;transform:scale(.45)}50%{opacity:.75;transform:scale(.65)}90%{opacity:0;transform:scale(1.8)}}
.ba-card.is-instant .ba-after,.ba-card.is-instant .ba-layer img,.ba-card.is-instant .ba-tag span{transition:none!important}
/* Home: imagem final como base; comparação fluida, sem zoom ou salto de composição. */
.ba-interactive .ba-stage{--peek-x:50%;--peek-y:50%;--peek-radius:0px;isolation:isolate}
.ba-interactive .ba-after,.ba-interactive[data-state] .ba-after{z-index:0;clip-path:none!important;opacity:1!important;transition:none}
.ba-interactive .ba-before{z-index:1;clip-path:circle(var(--peek-radius) at var(--peek-x) var(--peek-y));transition:clip-path 240ms var(--ease-out)}
.ba-interactive[data-peeking=true] .ba-before{transition:none}
.ba-interactive[data-state=before] .ba-before{clip-path:circle(150% at var(--peek-x) var(--peek-y))}
.ba-interactive .ba-layer img{transform:none!important;transition:none!important}
.ba-interactive .ba-lens{position:absolute;z-index:2;left:var(--peek-x);top:var(--peek-y);width:calc(var(--peek-radius) * 2);height:calc(var(--peek-radius) * 2);border:1.5px solid rgba(255,252,245,.8);border-radius:50%;transform:translate(-50%,-50%);opacity:0;pointer-events:none;box-shadow:0 0 0 1px rgba(37,42,38,.16)}
.ba-interactive[data-peeking=true] .ba-lens{opacity:1}
.ba-lens::after{content:'';position:absolute;inset:-1px;border:1.5px solid var(--on-dark);border-radius:inherit;opacity:0;pointer-events:none}
.ba-interactive[data-peeking=true]:not(.is-preview) .ba-lens::after{animation:ba-lens-pulse 1600ms ease-in-out infinite}
@keyframes ba-lens-pulse{0%,100%{opacity:.55;transform:scale(1)}55%{opacity:.05;transform:scale(1.14)}}
.ba-lens>span{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);padding:5px 10px;border-radius:var(--radius-pill);background:var(--glass-light);color:var(--text);font:var(--weight-forte) 12px/1.2 var(--font-interface)}
.ba-demo-pointer{position:absolute;z-index:3;left:50%;top:50%;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--glass-light);color:var(--text);pointer-events:none;opacity:0;transform:translate(-50%,-50%)}
.ba-demo-pointer::after{content:'';position:absolute;inset:0;border:1.5px solid var(--on-dark);border-radius:50%;opacity:0}
.ba-interactive.is-preview .ba-demo-pointer{animation:ba-simulated-click 1400ms var(--ease-out) both}
.ba-interactive.is-preview .ba-demo-pointer::after{animation:ba-simulated-ring 840ms var(--ease-out) 2}
@keyframes ba-simulated-click{0%{opacity:0;transform:translate(-50%,-35%)}12%,50%{opacity:1;transform:translate(-50%,-50%)}18%,66%{opacity:1;transform:translate(-50%,-50%) scale(.9)}30%,78%{opacity:1;transform:translate(-50%,-50%)}100%{opacity:0;transform:translate(-50%,-50%)}}
@keyframes ba-simulated-ring{0%,12%{opacity:0;transform:scale(.9)}25%{opacity:.8;transform:scale(1)}85%,100%{opacity:0;transform:scale(1.5)}}
.ba-interactive.is-instant .ba-before{transition:none!important}
@media(prefers-reduced-motion:reduce){.ba-interactive .ba-before{transition:none!important}.ba-demo-pointer{display:none}.ba-interactive .ba-lens::after{animation:none!important}}
.ba-card figcaption,.gallery-card figcaption{display:flex;justify-content:space-between;gap:12px;padding-top:14px;font-weight:var(--weight-forte)}
.ba-card small,.gallery-card small{display:block;margin-top:2px;font-size:var(--type-detalhe);font-weight:var(--weight-texto);color:var(--text-muted)}
.gallery-index{flex-shrink:0;font:var(--weight-forte) var(--type-detalhe)/1.6 var(--font-interface);letter-spacing:var(--tracking-rotulo);color:var(--accent);font-variant-numeric:tabular-nums}
/* Régua (pares com as duas imagens, só com mouse). No toque, o card mantém a revelação em círculo. */
.ba-rule,.ba-range{display:none}
@media(hover:hover) and (pointer:fine){
  .ba-compare .ba-frame{--position:50%}
  .ba-compare .ba-stage{pointer-events:none}
  .ba-compare .ba-after,.ba-compare[data-state] .ba-after{clip-path:inset(0 0 0 var(--position));transition:none}
  .ba-compare .ba-before img,.ba-compare .ba-after img{transform:none!important}
  .ba-compare .ba-tag{display:none}
  .ba-compare .ba-rule{display:block;position:absolute;inset:0 auto 0 var(--position);z-index:2;width:0;pointer-events:none}
  .ba-compare .ba-rule:before{content:'';position:absolute;top:0;bottom:0;left:-1px;width:2px;background:var(--surface);box-shadow:0 0 12px var(--shadow-soft)}
  .ba-rule-handle{position:absolute;top:50%;left:0;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;color:var(--text);transform:translate(-50%,-50%);transition:transform 200ms var(--ease-out)}
  .ba-compare .ba-range{display:block;position:absolute;inset:0;z-index:3;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}
  .ba-compare:hover .ba-rule-handle,.ba-compare .ba-range:active~.ba-rule .ba-rule-handle{transform:translate(-50%,-50%) scale(1.08)}
  .ba-compare .ba-frame:has(.ba-range:focus-visible){outline:2px solid var(--focus);outline-offset:4px}
  .ba-compare .ba-frame:before,.ba-compare .ba-frame:after{position:absolute;top:14px;z-index:2;padding:6px 12px;border-radius:var(--radius-pill);background:var(--glass-light);color:var(--text);font:var(--weight-forte) var(--type-detalhe)/1.2 var(--font-interface);letter-spacing:var(--tracking-rotulo);text-transform:uppercase;pointer-events:none;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
  .ba-compare .ba-frame:before{content:'Antes';left:14px}
  .ba-compare .ba-frame:after{content:'Depois';right:14px}
  .ba-compare.is-settling .ba-after{transition:clip-path 700ms var(--ease-out)}
  .ba-compare.is-settling .ba-rule{transition:left 700ms var(--ease-out)}
}
.glass,.ba-tag span,.ba-rule-handle,.lightbox-nav button{background:var(--glass-light);border:1px solid var(--border-inverse-strong);box-shadow:inset 0 1px 0 var(--glass-highlight),0 8px 24px var(--shadow-soft);-webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .glass,.ba-tag span,.ba-rule-handle,.lightbox-nav button{background:var(--glass-light-fallback)}
}
.ba-section .hint-touch{display:none}
@media(hover:none),(pointer:coarse){
  .ba-section .hint-desktop{display:none}
  .ba-section .hint-touch{display:inline}
}
@media(max-width:1000px){
  .ba-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(prefers-reduced-motion:reduce){
  .ba-cue-icon,.ba-cue-icon::after{animation:none!important}
  .ba-after{clip-path:none!important;opacity:0}
  .ba-card[data-state=after] .ba-after{opacity:1}
  .ba-layer img,.ba-layer .placeholder{transform:none!important}
}
@media(prefers-reduced-motion:reduce) and (hover:hover) and (pointer:fine){
  .ba-compare .ba-after{clip-path:inset(0 0 0 var(--position))!important;opacity:1}
}

/* ---------- Criações em cena ---------- */
.gallery-section{width:100vw;margin-left:calc(50% - 50vw);overflow:hidden}
.gallery-head{width:calc(100% - 2 * var(--gutter));max-width:var(--content-width);margin-inline:auto}
.gallery-bar{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:-16px 0 24px}
.gallery-bar .carousel-hint:not([hidden]){display:flex;align-items:center;gap:16px;margin:0;font-size:var(--type-detalhe);color:var(--text-muted)}
.gallery-meta{display:flex;align-items:center;gap:clamp(20px,3vw,40px);margin-left:auto}
.gallery-dots{display:flex;gap:6px;align-items:center}
.gallery-dots i{display:block;width:8px;height:8px;background:var(--border);transition:background-color 180ms ease,transform 180ms var(--ease-out)}
.gallery-dots i.active{background:var(--text)}
.gallery-controls{display:flex;gap:8px}
.gallery-track{--track-pad:max(var(--gutter),calc((100% - var(--content-width)) / 2));display:flex;gap:16px;padding:0 var(--track-pad) 8px;scroll-padding-inline:var(--track-pad);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.gallery-track::-webkit-scrollbar{display:none}
.gallery-track.is-dragging{scroll-snap-type:none;user-select:none}
.gallery-track.is-dragging,.gallery-track.is-dragging *{cursor:grabbing!important}
.gallery-card{flex:0 0 calc((min(100vw - 2 * var(--gutter),var(--content-width)) - 48px) / 3.6);min-width:250px;margin:0;scroll-snap-align:start}
.gallery-image{position:relative;display:block;width:100%;aspect-ratio:1/1.38;padding:0;border:0;overflow:hidden;background:var(--soft);cursor:zoom-in;transition:transform 160ms var(--ease-out)}
.gallery-image:active{transform:scale(.985)}
.gallery-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 500ms var(--ease-out)}
.gallery-image:focus-visible img{transform:none}
.gallery-plus{position:absolute;z-index:1;right:14px;bottom:14px;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--surface);color:var(--text);font-size:18px;transition:transform 180ms var(--ease-out)}
.gallery-image:focus-visible .gallery-plus{transform:rotate(45deg)}
@media(hover:hover) and (pointer:fine){
  .gallery-image{cursor:grab}
  .gallery-image:hover img{transform:scale(1.04)}
  .gallery-image:hover .gallery-plus{transform:rotate(45deg)}
}
@media(max-width:760px){
  .gallery-bar{margin-top:-24px}
  .gallery-card{flex-basis:84%;min-width:0}
  .gallery-track{gap:12px}
  .gallery-image{aspect-ratio:4/5}
  .gallery-dots{display:none}
}
@media(prefers-reduced-motion:reduce){
  .gallery-dots i,.gallery-controls button,.gallery-image img,.gallery-plus{transition:none}
  .gallery-track{scroll-behavior:auto}
}
/* Imagem ampliada — fundo da página, imagem inteira, controles discretos. */
.lightbox{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:clamp(14px,2vw,28px) clamp(16px,2.4vw,36px);border:0;background:transparent;color:var(--text);overflow:hidden}
.lightbox[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:clamp(10px,1.4vw,18px)}
.lightbox::backdrop{background:transparent}
.lightbox-bg{position:fixed;inset:0;z-index:-1;background:var(--bg)}
.lightbox-top{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:24px;font:var(--weight-forte) var(--type-detalhe)/1.4 var(--font-interface)}
.lightbox-count{color:var(--accent);font-variant-numeric:tabular-nums;letter-spacing:var(--tracking-rotulo)}
.lightbox-caption{max-width:none;margin:0}
.lightbox-caption small{margin-left:10px;color:var(--text-muted);font-weight:var(--weight-texto)}
.lightbox-close{justify-self:end;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 4px;border:0;background:transparent;font:inherit;letter-spacing:var(--tracking-rotulo);text-transform:uppercase;cursor:pointer;transition:transform 160ms var(--ease-out),color 160ms ease}
.lightbox-close:active{transform:scale(.97)}
.lightbox-stage{display:grid;place-items:center;min-height:0;touch-action:pan-y pinch-zoom}
.lightbox-img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;border-radius:var(--radius);user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.lightbox-nav{display:flex;justify-content:center;gap:8px}
.lightbox-nav button{min-width:44px;min-height:44px;font-size:20px;cursor:pointer;transition:transform 160ms var(--ease-out),color 160ms ease}
.lightbox-nav button:active{transform:scale(.9)}
@media(hover:hover) and (pointer:fine){
  .lightbox-close:hover,.lightbox-nav button:hover{color:var(--accent)}
  .lightbox-next:hover{transform:translateX(3px)}
  .lightbox-prev:hover{transform:translateX(-3px)}
}
@media(min-width:761px){
  .lightbox-nav{position:fixed;left:0;right:0;top:50%;z-index:2;justify-content:space-between;padding-inline:clamp(20px,3vw,52px);transform:translateY(-50%);pointer-events:none}
  .lightbox-nav button{width:54px;height:54px;border-radius:50%;pointer-events:auto}
}
@media(max-width:760px){
  .lightbox-top{grid-template-columns:auto 1fr;row-gap:4px}
  .lightbox-caption{grid-column:1/-1;grid-row:2}
  .lightbox-caption small{display:block;margin:2px 0 0}
  .lightbox-nav button{border-radius:50%}
}

/* ---------- Por que ambientar ---------- */
.why-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;margin:0;padding:32px 0 0;border-top:1px solid var(--border);list-style:none}
.why-list li{display:grid;gap:14px;align-content:start}
.why-list .why-number{margin:0}
.why-list h3{font-family:var(--font-editorial);font-style:italic;font-weight:400;letter-spacing:var(--tracking-voz);color:var(--accent);font-optical-sizing:auto}
.why-list p{margin:0;color:var(--text-muted)}
.why-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;margin-top:clamp(40px,5vw,64px);padding-top:32px;border-top:1px solid var(--border)}
.why-foot p{margin:0}
@media(max-width:1000px){
  .why-list{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:36px}
}
@media(max-width:760px){
  .why-list{grid-template-columns:1fr;row-gap:28px}
}

/* ---------- Para quem e cartões de serviço ---------- */
.svc-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.svc-card{display:flex;flex-direction:column;gap:12px;padding:28px 24px;border-top:2px solid var(--accent);border-radius:0 0 var(--radius) var(--radius);background:var(--surface)}
.svc-card h3{margin-bottom:4px}
.svc-card p{margin:0;max-width:none;color:var(--text-muted)}
.svc-card p strong{color:var(--text);font-weight:var(--weight-forte)}
.svc-card .text-link{align-self:flex-start;margin-top:auto}

/* ---------- Como funciona (campo musgo na home) ---------- */
.process{padding-block:var(--space-section);background:var(--action);color:var(--on-dark)}
.process .cab{margin-bottom:0}
.steps-rail{position:relative;height:1px;margin-top:clamp(48px,5vw,80px);background:var(--border-inverse)}
.steps-rail span{position:absolute;inset:0;background:var(--color-areia);transform-origin:left center}
.motion-ready .steps-rail span{transform:scaleX(0);transition:transform 720ms var(--ease-out)}
.motion-ready .process.is-visible .steps-rail span{transform:scaleX(1)}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,64px);margin:0;padding:0;list-style:none}
.steps li{display:grid;gap:16px;align-content:start;padding-top:24px;border-top:1px solid var(--border)}
.steps .step-number{margin:0}
.steps p{margin:0;color:var(--text-muted)}
.process .steps{padding-top:32px}
.process .steps li{padding-top:0;border-top:0}
.on-dark .steps p{color:var(--on-dark-muted)}
@media(max-width:760px){
  .steps{grid-template-columns:1fr;gap:32px}
  .steps-rail{display:none}
  .process .steps li{padding-top:24px;border-top:1px solid var(--border-inverse)}
}

/* ---------- Quem faz e mídia de seção ---------- */
.studio{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,8vw,120px);align-items:center;padding-block:var(--space-section)}
.studio h2{margin-bottom:24px}
.studio p{margin-bottom:16px;font-size:var(--type-destaque);line-height:var(--leading-destaque);color:var(--text-muted)}
.studio .text-link{margin-top:12px}
.studio .media-frame,.studio .placeholder{aspect-ratio:1}
.media-frame{overflow:hidden;background:var(--soft)}
.media-frame img{display:block;width:100%;height:100%;object-fit:cover}
/* Recorte ligado à rolagem nas imagens de seção (site.js). */
.scene-reveal{will-change:clip-path}
.scene-reveal img{transform-origin:center;will-change:transform}
@media(max-width:760px){
  .studio{grid-template-columns:1fr;gap:40px}
}
@media(prefers-reduced-motion:reduce){
  .scene-reveal{clip-path:none!important}
  .scene-reveal img{transform:none!important}
}

/* ---------- Perguntas frequentes ---------- */
.faq{margin-top:48px;border-top:1px solid var(--border)}
.faq>h2{margin:40px 0 8px}
.faq.faq-home{margin:0;padding-block:var(--space-section)}
.faq-home .cab{margin-bottom:8px}
.faq-item{padding:24px 0;border-bottom:1px solid var(--border)}
.faq-item h3{margin-bottom:10px}
.faq-item p{margin:0;max-width:70ch;color:var(--text-muted)}
.faq-wide{padding-bottom:48px}

/* Públicos da home: painéis fotográficos, com leitura completa sem JavaScript. */
.audience-panels{display:grid;gap:32px}
.audience-panel{position:relative;min-width:0;overflow:hidden}
.audience-image{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}
.audience-label,.audience-open{display:none}
.audience-body{display:grid;gap:16px;justify-items:start;padding:24px 0 0}
.audience-body .eyebrow{margin:0}
.audience-body dl{display:grid;gap:12px;margin:0;width:100%}
.audience-body dl div{display:grid;grid-template-columns:64px minmax(0,1fr);gap:12px;padding-top:12px;border-top:1px solid var(--border)}
.audience-body dt{font-size:var(--type-detalhe);color:var(--text-muted)}
.audience-body dd{margin:0}
.audience-body .button{max-width:100%;white-space:normal}
@media(min-width:901px){
  .audience-panels.is-ready{display:flex;gap:8px;height:clamp(560px,72vh,740px)}
  .is-ready .audience-panel{flex:1 1 0;background:var(--text);color:var(--on-dark);transition:flex-grow 720ms cubic-bezier(.22,1,.36,1)}
  .is-ready .audience-panel.is-open{flex-grow:4.2}
  .is-ready .audience-image{position:absolute;inset:0;height:100%;aspect-ratio:auto;opacity:.5;object-position:50% 42%;transition:opacity 600ms cubic-bezier(.22,1,.36,1)}
  .is-ready .audience-panel.is-open .audience-image{opacity:1}
  .is-ready .audience-label{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:20px 16px;pointer-events:none}
  .audience-label>span:first-child{font-size:var(--type-detalhe)}
  .audience-label>span:last-child{writing-mode:vertical-rl;transform:rotate(180deg);font-size:var(--type-sub);font-weight:var(--weight-forte);white-space:nowrap}
  .is-ready .audience-panel.is-open .audience-label{visibility:hidden}
  .is-ready .audience-body{position:absolute;bottom:16px;left:16px;z-index:2;width:min(440px,calc(100% - 32px));padding:24px;background:var(--bg);color:var(--text);visibility:hidden;opacity:0;transform:translateY(8px);transition:opacity 240ms ease,transform 440ms cubic-bezier(.22,1,.36,1),visibility 0s 240ms}
  .is-ready .audience-panel.is-open .audience-body{visibility:visible;opacity:1;transform:none;transition-delay:90ms,90ms,0s}
  .is-ready .audience-open{display:block;position:absolute;inset:0;z-index:1;width:100%;border:0;background:none;cursor:pointer}
  .is-ready .audience-open:focus-visible{outline:3px solid var(--on-dark);outline-offset:-6px}
}
@media(min-width:601px) and (max-width:900px){.audience-panels{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* FAQ da home: título lateral e perguntas numeradas expansíveis. */
.home-faq-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(32px,5vw,80px)}
.home-faq-heading{align-self:start;position:sticky;top:120px}
.home-faq-list{border-top:1px solid var(--border)}
.home-faq-list details{border-bottom:1px solid var(--border)}
.home-faq-list summary{display:grid;grid-template-columns:32px minmax(0,1fr) 16px;gap:16px;align-items:center;padding:24px 0;cursor:pointer;list-style:none;font-size:var(--type-destaque);font-weight:var(--weight-forte)}
.home-faq-list summary::-webkit-details-marker{display:none}
.home-faq-list summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.home-faq-number{font-size:var(--type-detalhe);color:var(--accent);font-weight:var(--weight-texto)}
.home-faq-icon{position:relative;width:14px;height:14px}
.home-faq-icon::before,.home-faq-icon::after{content:'';position:absolute;top:50%;left:0;width:100%;height:2px;background:currentColor}
.home-faq-icon::after{transform:rotate(90deg)}
.home-faq-list details[open] .home-faq-icon::after{transform:none}
.home-faq-answer{padding:0 0 26px 48px;color:var(--text-muted)}
@media(hover:hover) and (pointer:fine){.home-faq-list summary:hover{color:var(--accent)}}
@media(max-width:900px){.home-faq-grid{grid-template-columns:1fr}.home-faq-heading{position:static}}
@media(max-width:600px){.home-faq-list summary{grid-template-columns:24px minmax(0,1fr) 14px;gap:12px}.home-faq-answer{padding-left:0}}
@media(prefers-reduced-motion:reduce){.audience-panels.is-ready .audience-panel,.audience-panels.is-ready .audience-image,.audience-panels.is-ready .audience-body{transition:none}}

/* ---------- Blog: cards, destaque e temas ---------- */
.home-blog{padding-block:var(--space-section);border-top:1px solid var(--border)}
.post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 28px;padding-block:56px 88px;border-top:1px solid var(--border)}
.home-blog .post-grid{padding:0;border:0}
.post-grid>.eyebrow,.post-grid-title{grid-column:1/-1;margin:0}
.post-card a{display:block}
.post-cover{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;background:var(--soft)}
.post-card .post-cover,.post-card .placeholder{aspect-ratio:4/3;margin-bottom:20px}
.post-meta{margin-bottom:12px}
/* Títulos de artigo são longos: nos cards usam Destaque forte; no destaque da página, Subtítulo. */
.post-card h3{margin-bottom:10px;font-size:var(--type-destaque);line-height:1.3;letter-spacing:0}
.post-card p{color:var(--text-muted)}
.post-card .text-link{margin-top:16px}
.post-card a:focus-visible h3,.post-feature a:focus-visible h2{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
@media(hover:hover) and (pointer:fine){
  .post-card a:hover h3,.post-feature a:hover h2{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
}
.post-feature{padding-block:clamp(48px,5vw,72px);border-top:1px solid var(--border)}
.post-feature a{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:6%;align-items:center}
.post-feature .post-cover,.post-feature .placeholder{aspect-ratio:3/2}
.post-feature h2{margin-bottom:20px;font-size:var(--type-sub);line-height:var(--leading-sub);letter-spacing:var(--tracking-subheading)}
.post-feature p{color:var(--text-muted)}
.cluster-start{border-top:0;padding-top:40px}
.blog-block{padding-top:56px;border-top:1px solid var(--border)}
.blog-block-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:32px}
.blog-block-head p{color:var(--text-muted)}
.blog-block .post-grid{padding-top:0;border-top:0}
.silo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding-bottom:72px}
.silo-card a{display:flex;flex-direction:column;height:100%;padding:28px 24px;border-top:2px solid var(--accent);border-radius:0 0 var(--radius) var(--radius);background:var(--surface);transition:transform 180ms var(--ease-out)}
.silo-card h3{margin:0 0 12px}
.silo-card p{flex:1;color:var(--text-muted)}
.silo-card .text-link{align-self:flex-start;margin-top:20px}
@media(hover:hover) and (pointer:fine){
  .silo-card a:hover{transform:translateY(-3px)}
}
/* Navegação por tema: links, não pílulas. */
.silo-nav{display:flex;flex-wrap:wrap;gap:4px 28px;margin-top:32px}
.silo-nav a{padding:10px 0 6px;border-bottom:1px solid currentColor;font-weight:var(--weight-forte);transition:color 160ms ease}
@media(hover:hover) and (pointer:fine){
  .silo-nav a:hover{color:var(--accent)}
}
.silo-nav-block{padding-block:40px;border-top:1px solid var(--border)}
.silo-nav-block .silo-nav{margin-top:8px}
.silo-section{padding-top:56px;border-top:1px solid var(--border)}
.silo-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px}
.silo-section-head p{color:var(--text-muted)}
.guide-link{margin-top:20px;color:var(--text-muted)}
.guide-link a{color:var(--text);text-decoration:underline;text-underline-offset:4px}
@media(max-width:1000px){
  .post-grid,.silo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .post-feature a{grid-template-columns:1fr;gap:28px}
  .post-grid{grid-template-columns:1fr;padding-block:48px 64px}
  .silo-grid{grid-template-columns:1fr}
  .blog-block-head,.silo-section-head{display:block}
  .blog-block-head p{margin-top:12px}
}

/* ---------- Artigo: a escala desce um degrau ---------- */
.article-heading h1{font-size:var(--type-titulo);line-height:var(--leading-titulo);letter-spacing:var(--tracking-heading)}
.article-meta{margin-top:28px;font-size:var(--type-detalhe);color:var(--text-muted)}
.post-layout{display:grid;grid-template-columns:minmax(0,740px);justify-content:center}
.article{max-width:740px;margin:0 auto;padding-block:32px 96px}
.post-layout .article{margin:0}
.article p,.article li{max-width:none;line-height:1.7}
.article p{margin-bottom:22px}
.article p a,.article li a,.article-meta a,.author-box a{text-decoration:underline;text-underline-offset:4px}
.article p a,.article li a{color:var(--accent)}
.article h2{margin-block:48px 16px;font-size:var(--type-sub);line-height:var(--leading-sub);letter-spacing:var(--tracking-subheading);scroll-margin-top:100px}
.article h3{margin-block:32px 12px;font-size:var(--type-destaque);line-height:1.3;letter-spacing:0}
.article ul{margin:0 0 24px;padding-left:20px}
.article li{margin-bottom:8px}
.article>.post-cover{aspect-ratio:16/10;margin-block:0 40px}
.article .placeholder{aspect-ratio:16/10;margin-block:40px}
.article-figure{margin:40px 0}
.article-figure img{display:block;width:100%;height:auto}
.article-figure figcaption{padding-top:10px;font-size:var(--type-detalhe);color:var(--text-muted)}
.article .table-wrap{margin:8px 0 32px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.article .table-wrap:focus-visible{outline:2px solid var(--text);outline-offset:4px}
.article table{width:100%;min-width:520px;margin:0;border-collapse:collapse;line-height:1.5}
.article caption{padding-bottom:10px;text-align:left;font-size:var(--type-detalhe);font-weight:var(--weight-forte);color:var(--text-muted)}
.article th,.article td{padding:12px 14px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}
.article thead th{border-bottom:1px solid var(--text);font-size:var(--type-detalhe)}
.article th{font-weight:var(--weight-forte)}
.article .faq-item h3{margin:0 0 8px;font-size:var(--type-destaque)}
.article .post-sources{margin-top:36px;padding-top:18px;border-top:1px solid var(--border);font-size:var(--type-detalhe);color:var(--text-muted)}
.answer-box{margin:32px 0;padding:24px 28px;border-left:3px solid var(--accent);background:var(--surface)}
.answer-box .eyebrow{margin-bottom:12px}
.answer-box p{max-width:none;margin:0;font-size:var(--type-destaque);line-height:var(--leading-destaque)}
.answer-box-wide{margin:0 0 8px}
.toc{margin:0 0 20px;padding:24px 0;border-block:1px solid var(--border)}
.toc .eyebrow{margin-bottom:12px}
.toc ol{display:grid;gap:8px;margin:0;padding-left:20px;font-size:var(--type-detalhe);line-height:1.5}
.toc a{text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--border)}
.toc a[aria-current=true]{color:var(--accent);text-decoration-color:currentColor}
.post-layout .toc{margin:20px 0 0}
.pillar-box,.author-box,.service-box{margin-top:32px;padding:24px 28px;background:var(--surface)}
.service-box{border-top:2px solid var(--accent)}
.pillar-box p,.author-box p,.service-box p{max-width:none;margin:0;color:var(--text-muted)}
.article .pillar-box-title,.service-box .service-box-title{margin:4px 0 10px;font-size:var(--type-destaque);font-weight:var(--weight-forte);line-height:1.3;color:var(--text)}
.service-box .text-link{margin-top:14px}
.wrap>.service-box{margin:8px 0 40px}
.template-note{padding:12px 20px;border-left:2px solid var(--accent);background:var(--surface)}
@media(min-width:1180px){
  .post-layout{grid-template-columns:230px minmax(0,740px);gap:60px}
  .post-layout .toc{position:sticky;top:110px;align-self:start;max-height:calc(100vh - 140px);overflow:auto;margin-top:32px;padding:0 0 0 16px;border:0;border-left:1px solid var(--border)}
}
@media(min-width:761px){
  .article table{min-width:0}
}
@media(max-width:760px){
  .article{padding-block:24px 64px}
  .article th,.article td{padding:10px 8px}
}

/* ---------- Páginas internas ---------- */
.category-heading{width:100%}
.category-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:center;width:100%}
.category-copy{min-width:0}
.category-copy h1{font-size:var(--type-titulo);max-width:20ch}
.category-copy h1 .eyebrow{display:flex}
.category-copy>.destaque{max-width:50ch;color:var(--text-muted)}
.category-visual{min-width:0;margin:0}
.category-visual img{display:block;width:100%;height:auto}
.category-visual figcaption{font-size:var(--type-detalhe);padding-top:12px;color:var(--text-muted)}
.delivery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:24px;margin-top:40px}
.delivery-grid figure{min-width:0;margin:0}
.delivery-grid img{display:block;width:100%;aspect-ratio:1;object-fit:cover}
.delivery-grid figcaption{display:grid;gap:6px;padding-top:16px}
.delivery-grid figcaption span{font-size:var(--type-detalhe);color:var(--text-muted)}
.product-focus .ba-card{width:min(100%,780px);margin:32px auto 0}
.audience-open{text-decoration:none}
.audience-image--sheet{object-fit:contain;background:var(--bg)}
@media(min-width:901px){.is-ready .audience-image--sheet{height:calc(100% - 280px);object-fit:contain;object-position:center}}
@media(max-width:900px){.category-hero{grid-template-columns:1fr}.category-visual{max-width:600px;width:100%}}
.page-heading{display:grid;justify-items:start;padding-block:clamp(56px,6vw,88px);border-top:1px solid var(--border)}
.page-heading h1{max-width:18ch;margin-bottom:28px}
.article-heading h1{max-width:24ch}
.page-heading>p{font-size:var(--type-destaque);line-height:var(--leading-destaque);color:var(--text-muted)}
.page-heading .button{margin-top:36px}
.breadcrumbs{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:36px;font-size:var(--type-detalhe);color:var(--text-muted)}
.breadcrumbs a{text-decoration:underline;text-underline-offset:4px}
.svc-section{padding-block:var(--space-section);border-top:1px solid var(--border)}
.svc-section>h2{margin-bottom:40px}
.svc-resposta{max-width:62ch;margin:-16px 0 40px}
.svc-credito{max-width:62ch;margin:40px 0 0;color:var(--text-muted)}
.svc-credito a{color:var(--text);text-decoration:underline;text-underline-offset:.2em}
.svc-section .post-grid{padding-top:0;border-top:0}
.svc-section .blog-block-head .silo-nav{margin-top:0}
.empty-editorial{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:40px;margin-bottom:96px;padding-block:64px;border-block:1px solid var(--border)}
.empty-editorial p{color:var(--text-muted)}
.empty-editorial .text-link{margin-top:12px}
.empty-editorial h2:not(:first-child){margin-top:40px}
.empty-editorial .editorial-note{margin-top:32px;padding-top:24px;border-top:1px solid var(--border);font-size:var(--type-detalhe)}
@media(max-width:760px){
  .empty-editorial{grid-template-columns:1fr;gap:24px}
}

/* ---------- Fechamento (campo terracota) e rodapé (carvão) ---------- */
.contact{background:var(--color-carvao);color:var(--on-dark)}
.contact-cta{padding-block:var(--space-section) clamp(56px,6vw,88px);background:var(--color-terracota)}
.contact-cta .cab{margin-bottom:0}
.contact-cta h2{max-width:12ch}
.contact-cta .cab-side{gap:28px}
.contact-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin:clamp(48px,5vw,72px) 0 0;padding:24px 0 0;border-top:1px solid var(--border-inverse);list-style:none}
.contact-points li{display:grid;gap:12px;align-content:start;max-width:34ch;font-weight:var(--weight-forte)}
.contact-points span{margin:0}
.contact-base{padding-top:clamp(56px,6vw,88px)}
.footer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:40px clamp(28px,5vw,80px);align-items:start}
.footer-signature{margin:0;max-width:30ch;font-size:var(--type-destaque);line-height:var(--leading-texto)}
.signature-lead,.signature-fields{display:block}
.signature-lead{font-size:inherit;color:var(--on-dark-muted)}
.signature-fields{margin-top:4px;font-size:inherit;font-weight:var(--weight-forte);line-height:inherit}
.footer-label{display:block;margin-bottom:12px;font-size:var(--type-detalhe);color:var(--on-dark-muted)}
.footer-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.footer-cols ul{margin:0;padding:0;list-style:none}
.footer-cols a{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size 240ms var(--ease-out)}
.footer-cols a{display:inline-block;padding:5px 0}
@media(hover:hover) and (pointer:fine){
  .footer-cols a:hover{background-size:100% 1px}
}
.footer-mark{position:relative;display:flex;flex-direction:column;align-items:flex-end;width:100%;max-width:none;margin:clamp(56px,7vw,110px) 0 28px}
.footer-mark .brand-name{font-size:clamp(60px,20vw,320px);letter-spacing:-.045em}
.footer-mark .brand-sub{margin-top:clamp(14px,1.6vw,26px)}
.footer-mark .brand-sub:before{background:var(--color-areia)}
.footer-mark .brand-symbol{position:absolute;left:0;top:-78px}
.bottom-note{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;padding-block:18px 26px;border-top:1px solid var(--border-inverse);font-size:var(--type-detalhe);color:var(--on-dark-muted)}
.bottom-note a{text-decoration:underline;text-underline-offset:3px}
.bottom-note .back-top{text-decoration:none}
@media(max-width:1000px){
  .footer{grid-template-columns:1fr}
}
@media(max-width:760px){
  .contact-points{grid-template-columns:1fr;gap:20px}
  .footer-cols{grid-template-columns:1fr 1fr}
  .footer-cols>div:nth-child(2){grid-column:1/-1;order:3}
  .footer-mark .brand-name{font-size:20vw}
  .footer-mark .brand-symbol{width:40px;top:-48px}
  .bottom-note{flex-direction:column;gap:6px}
}

/* ---------- Placeholders ---------- */
.placeholder{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:30px;overflow:hidden;background:var(--surface-muted);color:var(--text-muted);text-align:center}
.placeholder:before,.placeholder:after{content:'';position:absolute;width:20px;height:20px;border-color:var(--border-strong);border-style:solid;opacity:.55}
.placeholder:before{left:20px;top:20px;border-width:1px 0 0 1px}
.placeholder:after{right:20px;bottom:20px;border-width:0 1px 1px 0}
.placeholder-code,.placeholder-note{font:var(--weight-forte) var(--type-detalhe)/1.4 var(--font-interface);letter-spacing:.04em}
.placeholder-title{font:italic 400 var(--type-sub)/1.2 var(--font-editorial);letter-spacing:var(--tracking-voz)}

/* ---------- Carrosséis no celular ---------- */
@media(min-width:761px){
  .gallery-section .carousel-hint:not([hidden]){display:flex}
}
@media(max-width:760px){
  .carousel-hint{display:flex;align-items:center;gap:12px;margin:0 0 16px;font-size:var(--type-detalhe);font-weight:var(--weight-forte);color:var(--text-muted)}
  .carousel-hint>span:first-child{margin-right:auto}
  .carousel-hint span[aria-hidden]{display:inline-block;margin-left:5px;color:var(--accent)}
  .carousel-actions{display:flex;gap:6px}
  [data-carousel]{scroll-padding-inline:var(--gutter)}
  .ba-grid,.home-blog .post-grid{display:flex;gap:14px;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
  .ba-grid::-webkit-scrollbar,.home-blog .post-grid::-webkit-scrollbar{display:none}
  .ba-card,.home-blog .post-card{flex:0 0 82%;scroll-snap-align:start}
  .ba-card[hidden]{display:none}
}

/* ---------- Movimento de entrada (site.js) ---------- */
.motion-ready .reveal-item{opacity:1;transform:none;transition:opacity 560ms var(--ease-out),transform 640ms var(--ease-out);transition-delay:var(--reveal-delay,0ms)}
.motion-ready .reveal-item:not(.is-visible){opacity:0;transform:translate3d(var(--reveal-x,0px),var(--reveal-y,20px),0)}
.reveal-item[data-reveal-direction=left]{--reveal-x:-24px;--reveal-y:0px}
.reveal-item[data-reveal-direction=right]{--reveal-x:24px;--reveal-y:0px}
/* Scale separado de transform preserva zoom, comparação e feedback dos controles. */
.motion-ready .motion-media{opacity:1;scale:1;transform-origin:center;transition:scale 900ms var(--ease-out),opacity 600ms var(--ease-out),transform 160ms var(--ease-out)}
/* A navegação pelo teclado apresenta o painel imediatamente. */
.audience-panels.is-instant .audience-panel,.audience-panels.is-instant .audience-image,.audience-panels.is-instant .audience-body{transition:none}
.motion-ready .motion-media:not(.is-visible){opacity:0;scale:.96}
@media(min-width:761px) and (prefers-reduced-motion:no-preference){
  .motion-ready .motion-media:not(.is-visible){scale:.86}
}
.motion-ready .reveal-item:focus-within,.motion-ready .motion-media:focus-within{opacity:1;transform:none;scale:1;transition:none}
@media(max-width:760px){
  .reveal-item{--reveal-y:14px}
  .reveal-item[data-reveal-direction=left]{--reveal-x:-14px;--reveal-y:0px}
  .reveal-item[data-reveal-direction=right]{--reveal-x:14px;--reveal-y:0px}
}
.motion-keyboard .reveal-item,.motion-keyboard .motion-media,.motion-keyboard .intro-line>span,.motion-keyboard .steps-rail span{transition:none!important}
@media(prefers-reduced-motion:reduce){
  .motion-ready .reveal-item,.motion-ready .motion-media{opacity:1!important;transform:none!important;scale:1!important;transition:none!important}
  .motion-ready .intro-line>span,.motion-ready .steps-rail span{transform:none!important;transition:none!important}
}
@media(prefers-reduced-motion:reduce) and (min-width:761px){
  .media-motion-ready .motion-media{scale:1;transform-origin:center;transition:scale 650ms var(--ease-out)}
  .media-motion-ready .motion-media:not(.is-visible){scale:.92}
  .media-motion-ready .motion-media:focus-within{scale:1;transition:none}
}
@keyframes hero-expand{from{clip-path:inset(0 3.5vw)}to{clip-path:inset(0)}}
@keyframes hero-settle{from{transform:scale(1.05)}to{transform:none}}
@keyframes hero-ring{from{stroke-dashoffset:103.7}to{stroke-dashoffset:0}}

/* Transições entre páginas (transitions.js define a direção: forward, back ou lateral). */
@view-transition{navigation:auto}
.page-heading h1{view-transition-name:page-title}
::view-transition-group(root){animation-duration:280ms;animation-timing-function:var(--ease-out)}
::view-transition-old(root){animation:vt-out 180ms var(--ease-out) both}
::view-transition-new(root){animation:vt-in 280ms var(--ease-out) 60ms both}
::view-transition-group(header){animation:none}
::view-transition-old(header){display:none}
::view-transition-new(header){animation:none}
::view-transition-group(page-title){animation-duration:420ms;animation-timing-function:var(--ease-out)}
::view-transition-old(page-title),::view-transition-new(page-title){height:100%;animation-duration:420ms;animation-timing-function:var(--ease-out)}
:root{--vt-shift:10px}
:active-view-transition-type(forward){--vt-shift:14px}
:active-view-transition-type(back){--vt-shift:-14px}
@keyframes vt-out{to{opacity:0;transform:translateY(calc(var(--vt-shift) * -.6))}}
@keyframes vt-in{from{opacity:0;transform:translateY(var(--vt-shift))}}
@keyframes vt-fade-out{to{opacity:0}}
@keyframes vt-fade-in{from{opacity:0}}
@media(prefers-reduced-motion:reduce){
  ::view-transition-group(*){animation-duration:0s!important}
  ::view-transition-old(root),::view-transition-old(page-title){animation:vt-fade-out 160ms ease both!important}
  ::view-transition-new(root),::view-transition-new(page-title){animation:vt-fade-in 160ms ease both!important}
}

/* Categorias: comparadores contínuos e conteúdo orientado por serviço. */
.category-proof{margin:0;min-width:0}.category-compare{position:relative;aspect-ratio:1;background:var(--surface-muted);isolation:isolate;overflow:hidden}
.category-origin,.category-result{position:absolute;inset:0}.category-origin{clip-path:inset(0 calc(100% - var(--split)) 0 0)}
.category-compare img{display:block;width:100%;height:100%;object-fit:cover;transform:none;transition:none}
.category-photo-label{position:absolute;top:16px;z-index:2;padding:6px 12px;background:var(--surface);font-size:var(--type-detalhe);font-weight:var(--weight-forte);pointer-events:none}.before-label{left:16px}.after-label{right:16px}
.category-divider{position:absolute;inset:0 auto 0 var(--split);width:2px;background:var(--surface);transform:translateX(-50%);z-index:3;pointer-events:none}
.category-divider>span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--surface);color:var(--text);box-shadow:0 2px 12px var(--shadow-soft);font-size:var(--type-destaque)}
.category-compare input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;z-index:4;cursor:ew-resize;touch-action:pan-y}.category-compare:focus-within{outline:3px solid var(--accent);outline-offset:4px}
.category-proof figcaption{display:flex;flex-wrap:wrap;gap:4px 12px;justify-content:space-between;font-size:var(--type-detalhe);padding-top:12px}.category-proof figcaption span{color:var(--text-muted);max-width:38ch;font-size:var(--type-detalhe)}
.category-compare-hint{font-size:var(--type-detalhe);color:var(--text-muted);margin-top:16px}.category-keyboard-hint{display:block;margin-top:4px}
.category-hero-more{display:table;margin-top:18px}.category-section-nav{display:flex;gap:24px;padding-block:20px;border-top:1px solid var(--border);overflow-x:auto;max-width:100%;font-size:var(--type-detalhe)}.category-section-nav a{white-space:nowrap;min-height:44px;display:flex;align-items:center;text-decoration:underline;text-underline-offset:6px}
.category-section-head{margin-bottom:32px}.category-section-head h2{margin-top:14px;max-width:24ch}.category-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}.category-intro .category-section-head{margin:0}.category-intro>.destaque{max-width:none}
.category-example-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px 40px;margin-top:32px}.category-example{min-width:0}.category-example-copy{padding-top:24px}.category-example-copy h3{margin-block:12px}.category-example-copy p{color:var(--text-muted);max-width:52ch}
.category-uses{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.category-uses article{padding:28px;background:var(--surface);border-top:2px solid var(--action)}.category-uses .eyebrow{font-size:var(--type-detalhe)}.category-uses h3{margin-block:16px;line-height:1.3}.category-uses p{color:var(--text-muted)}.category-channel-note{font-size:var(--type-detalhe);color:var(--text-muted);margin-top:24px}
.category-difference-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 64px}.category-difference-grid article{border-top:1px solid var(--border);padding-top:24px}.category-number{font-family:var(--font-editorial);font-size:var(--type-titulo);color:var(--accent)}.category-difference-grid h3{margin-block:16px}.category-difference-grid p{color:var(--text-muted)}.category-author{font-size:var(--type-detalhe);margin-top:40px;max-width:75ch}.category-author a{text-decoration:underline;text-underline-offset:4px}
.category-preparation{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:64px}.category-preparation ul{padding-left:20px;margin:24px 0 32px}.category-preparation li{padding-left:8px;margin-block:14px;color:var(--text-muted)}.category-preparation aside{align-self:start;padding:32px;background:var(--soft)}.category-preparation aside h3{margin-block:18px}.category-preparation aside p{color:var(--text-muted)}.category-process-title{margin-top:64px;margin-bottom:32px}.category-related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}.category-related-grid>a{border-top:1px solid var(--border);padding-top:24px;display:grid;gap:18px;align-content:start}.category-related-grid p{color:var(--text-muted)}.category-related-grid .text-link{justify-self:start}
@media(max-width:1050px){.category-uses{grid-template-columns:1fr}.category-uses article{padding:24px}.category-related-grid{grid-template-columns:1fr}.category-related-grid>a{grid-template-columns:1fr 1fr;gap:16px 32px}.category-related-grid h3{grid-row:span 2}.category-preparation{gap:32px}}
@media(max-width:760px){.category-intro{grid-template-columns:1fr;gap:24px}.category-example-grid{grid-template-columns:1fr;gap:48px}.category-section-nav{gap:20px;padding-block:12px}.category-photo-label{top:12px;padding:5px 9px}.before-label{left:12px}.after-label{right:12px}.category-difference-grid,.category-preparation{grid-template-columns:1fr;gap:32px}.category-preparation aside{padding:24px}.category-related-grid>a{grid-template-columns:1fr}.category-section-head{margin-bottom:24px}.category-example-copy{padding-top:18px}.category-preparation .button{white-space:normal;text-align:center}.category-keyboard-hint{display:none}}

/* Serviços da home: um campo editorial em destaque, com prova visual da entrega. */
.home-services{width:100vw;max-width:none;margin-left:calc(50% - 50vw);padding-block:var(--space-section);background:var(--color-carvao);color:var(--on-dark)}
.home-services-heading{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,6vw,88px);align-items:end;margin-bottom:clamp(40px,5vw,72px)}
.home-services-heading h2{max-width:16ch}.home-services-intro{display:grid;gap:28px}.home-services-intro>.destaque{color:var(--on-dark-muted);max-width:40ch}
.home-service-audiences{display:flex;flex-wrap:wrap;gap:8px 24px;padding-top:24px;border-top:1px solid var(--border-inverse)}.home-service-audiences a{display:inline-flex;align-items:center;min-height:44px;font-size:var(--type-detalhe);text-decoration:underline;text-underline-offset:5px}
.home-service-showcase{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,5vw,72px);align-items:center}.home-service-image{margin:0;min-width:0}.home-service-image img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;background:var(--surface)}.home-service-image figcaption{font-size:var(--type-detalhe);color:var(--on-dark-muted);padding-top:16px}
.home-service-deliveries{display:grid;gap:32px}.home-service-deliveries article{display:grid;grid-template-columns:32px minmax(0,1fr);gap:20px;padding-top:24px;border-top:1px solid var(--border-inverse)}.home-service-number{font-size:var(--type-detalhe);color:var(--color-areia);padding-top:2px;font-variant-numeric:tabular-nums}.home-service-purpose{font-size:var(--type-detalhe);color:var(--on-dark-muted);margin-bottom:10px}.home-service-deliveries h3{font-size:var(--type-sub);margin-bottom:16px}.home-service-deliveries h3+p{color:var(--on-dark-muted);max-width:40ch}.home-service-deliveries .text-link{display:inline-flex;align-items:center;min-height:44px;margin-top:12px;color:var(--on-dark);border-color:var(--border-inverse)}
.home-channels{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);padding-top:40px;margin-top:clamp(48px,6vw,88px);border-top:1px solid var(--border-inverse)}.home-channels h3{font-size:var(--type-sub);line-height:var(--leading-sub);max-width:27ch}.home-channels p{color:var(--on-dark-muted);max-width:52ch}.home-channels .button{margin-top:24px;background:var(--surface);color:var(--text)}.home-channels .button:hover{background:var(--color-areia)}
@media(max-width:1100px){.home-service-showcase{grid-template-columns:1fr}.home-service-image{max-width:760px;margin-inline:auto;width:100%}.home-service-deliveries{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.home-service-deliveries article{grid-template-columns:1fr;gap:14px}.home-services-heading{gap:32px}.home-channels .button{white-space:normal}}
@media(max-width:760px){.home-services-heading,.home-channels{grid-template-columns:1fr;gap:28px}.home-services-heading h2{font-size:var(--type-titulo);max-width:17ch}.home-services-intro{gap:20px}.home-service-audiences{gap:4px 22px;padding-top:18px}.home-service-showcase{gap:32px}.home-service-deliveries{grid-template-columns:1fr;gap:28px}.home-service-deliveries article{grid-template-columns:28px minmax(0,1fr);gap:12px}.home-service-deliveries h3{margin-bottom:12px}.home-channels{padding-top:32px;margin-top:40px}.home-channels .button{width:100%;text-align:center}.home-service-image figcaption{padding-top:12px}}

/* ---------- Aviso de cookies ---------- */
.consent{position:fixed;z-index:20;left:16px;right:16px;bottom:16px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;max-width:720px;margin:0 auto;padding:16px 18px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);box-shadow:0 12px 32px var(--shadow-soft);font:var(--type-detalhe)/1.45 var(--font-interface)}
.consent[hidden]{display:none}
.consent p{flex:1 1 300px;margin:0}
.consent a{text-decoration:underline;text-underline-offset:2px}
.consent-actions{display:flex;gap:10px}
.consent-button{min-height:44px;padding:0 20px;border:1px solid var(--text);border-radius:var(--radius);background:transparent;color:var(--text);font:var(--weight-forte) var(--type-detalhe)/1 var(--font-interface);cursor:pointer;transition:transform var(--motion-fast) var(--ease-out)}
.consent-button:active{transform:scale(.97)}
.consent-button--accept{background:var(--text);color:var(--surface)}
.footer-consent{padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.footer-consent:hover,.footer-consent:focus-visible{text-decoration:underline;text-underline-offset:3px}
@media(max-width:520px){.consent-actions{width:100%}.consent-button{flex:1}}