/* SitePorte v10 — conteúdo, capítulos e regulagem. O palco do relógio fica em scene.css. */

/* ---------- Ajustes da coroa ---------- */
:root { --accent: #b9c2cc; --luz: 218, 226, 236; --bg: #17191b; --bg-2: #1d1f22; --ink: #ecebe7; --ink-2: rgba(236,235,231,.68); --rule: rgba(236,235,231,.16); --titulo: Inter, Arial, sans-serif; }
[data-metal="latao"] { --accent: #c8a46b; --luz: 232, 214, 180; }
[data-metal="azul"] { --accent: #7398c8; --luz: 196, 212, 238; }
[data-metal="ouro"] { --accent: #d8b25a; --luz: 240, 218, 160; }
[data-metal="rose"] { --accent: #d39a86; --luz: 240, 206, 192; }
[data-metal="ourobranco"] { --accent: #ddd8cc; --luz: 236, 232, 222; }
[data-metal="platina"] { --accent: #c9ccd1; --luz: 228, 230, 234; }
[data-metal="titanio"] { --accent: #9aa3ab; --luz: 206, 212, 218; }
[data-metal="bronze"] { --accent: #b8865a; --luz: 226, 196, 164; }
[data-metal="cobre"] { --accent: #c97a52; --luz: 236, 190, 164; }
[data-metal="rutenio"] { --accent: #8d9196; --luz: 200, 204, 208; }
/* No mostrador claro, metais muito claros escurecem um pouco para manter o contraste do texto. */
[data-tom="claro"][data-metal="ourobranco"], [data-tom="claro"][data-metal="platina"], [data-tom="claro"][data-metal="aco"] { --accent: #6f7781; }
[data-tom="claro"][data-metal="latao"], [data-tom="claro"][data-metal="ouro"] { --accent: #9a7432; }
[data-tom="claro"][data-metal="rose"] { --accent: #a8604c; }
[data-tom="claro"][data-metal="titanio"], [data-tom="claro"][data-metal="rutenio"] { --accent: #5c6269; }
[data-tom="claro"][data-metal="bronze"], [data-tom="claro"][data-metal="cobre"] { --accent: #9a5530; }
[data-tom="claro"][data-metal="azul"] { --accent: #3f6597; }
[data-tom="claro"] { --bg: #ecebe7; --bg-2: #e2e0da; --ink: #17191b; --ink-2: rgba(23,25,27,.7); --rule: rgba(23,25,27,.16); }
[data-tipo="classica"] { --titulo: Georgia, 'Times New Roman', serif; }
[data-tipo="didone"] { --titulo: 'Playfair Display', Didot, 'Bodoni MT', serif; }
[data-tipo="garamond"] { --titulo: 'Cormorant Garamond', Garamond, serif; }
[data-tipo="editorial"] { --titulo: Fraunces, Georgia, serif; }
[data-tipo="grotesca"] { --titulo: 'Space Grotesk', Arial, sans-serif; }
[data-tipo="geometrica"] { --titulo: Outfit, 'Century Gothic', sans-serif; }
[data-tipo="condensada"] { --titulo: 'Barlow Condensed', 'Arial Narrow', sans-serif; }
[data-tipo="mono"] { --titulo: 'IBM Plex Mono', Consolas, monospace; }
[data-tipo="gravada"] { --titulo: Cinzel, 'Trajan Pro', serif; }
/* Serifadas pedem peso regular; as demais mantêm o peso forte. */
:is([data-tipo="classica"], [data-tipo="didone"], [data-tipo="garamond"], [data-tipo="editorial"], [data-tipo="gravada"]) :is(.headline h1, .chapter h2, .secao h2, .contact h2, .secao h3) { font-weight: 500; letter-spacing: -.02em; }
[data-tipo="condensada"] :is(.headline h1, .chapter h2, .secao h2, .contact h2) { letter-spacing: -.01em; text-transform: uppercase; }
[data-tipo="mono"] :is(.headline h1, .chapter h2, .secao h2, .contact h2) { letter-spacing: -.05em; font-weight: 600; }
[data-tipo="gravada"] :is(.headline h1, .chapter h2, .secao h2, .contact h2) { letter-spacing: .01em; }

/* Densidade */
:is([data-densidade="essencial"], [data-densidade="minima"]) .detalhe { display: none !important; }
[data-densidade="minima"] :is(.chapter p, .calibre > p, .etapas p, .lede, .peca dd, .ficha) { display: none !important; }
[data-densidade="arejada"] main > .secao { padding-block: clamp(130px, 16vw, 240px); }
[data-densidade="arejada"] .secao-cabeca { margin-bottom: clamp(70px, 8vw, 120px); }
[data-densidade="compacta"] main > .secao { padding-block: clamp(56px, 7vw, 100px); }
[data-densidade="compacta"] .secao-cabeca { margin-bottom: 36px; }
[data-densidade="ampliada"] { font-size: 112.5%; }
[data-densidade="ampliada"] :is(.secao p, .secao li, .secao dd, .chapter p) { font-size: 18.5px; }

/* Vitrine */
[data-vitrine="suave"] { --vf: .5; --va: .26; }
[data-vitrine="intensa"] { --vf: 1.9; --va: .5; }
[data-vitrine="holofote"] { --vf: 2.6; --vs: .62; --va: .62; --vv: 38%; }
[data-vitrine="semgrao"] .grao { display: none; }
[data-vitrine="apagada"] :is(.vitrine, .vinheta, .grao) { display: none; }

/* ---------- Modo claro: o site inteiro, com as mesmas camadas de luz e qualidade ---------- */
[data-tom="claro"] { color-scheme: light; --paper: #17191b; --line: rgba(23,25,27,.28); }
/* Camadas do palco seguem os quadros realmente carregados. */
[data-palco="claro"] { --vf: 1.7; --vg: 92, 88, 80; --va: .2; --vv: 52%; --sombra: 1; --grao-modo: multiply; --grao-forca: .05; }
[data-palco="escuro"] :is(.stage, .chapters) { color: #ecebe7; --paper: #ecebe7; --line: rgba(236,235,231,.3); }
[data-palco="claro"] :is(.stage, .chapters) { color: #0b0d10; --paper: #0b0d10; --line: rgba(11,13,16,.32); }
[data-palco="claro"][data-vitrine="suave"] { --vf: .9; --va: .12; --sombra: .6; }
[data-palco="claro"][data-vitrine="intensa"] { --vf: 3; --va: .28; }
[data-palco="claro"][data-vitrine="holofote"] { --vf: 4; --vs: .62; --va: .38; --vv: 36%; }
[data-tom="claro"] :is(html, body), html[data-tom="claro"], [data-tom="claro"] body { background: #ecebe7; color: #17191b; }
[data-palco="claro"] :is(.experience, .stage) { background: #ecebe7; }
[data-tom="claro"] .site-header { background: rgba(236,235,231,.9); border-bottom-color: rgba(23,25,27,.12); backdrop-filter: blur(10px); }
[data-tom="claro"] .site-header nav a:hover { color: #000; }
[data-tom="claro"] .nav-progress { background: rgba(23,25,27,.12); }
[data-tom="claro"] :is(.brand img, .rodape-logo) { filter: brightness(.1); }
/* Modo claro, textos sobre o relógio: quase-preto sólido (sem cinza nem transparência) e um halo da cor do fundo,
   que some sobre o fundo claro e só aparece onde a letra cruza a pulseira preta. */
[data-palco="claro"] :is(.headline .lede, .scroll-cue, .chapter p, .chapter p.detalhe, .headline .eyebrow, .chapter .eyebrow, .contact .eyebrow) { color: #0b0d10; }
[data-palco="claro"] .contact .contact-links a, [data-palco="claro"] .contact .contact-links a:first-child { color: #0b0d10; }
[data-palco="claro"] :is(.headline, .scroll-cue, .chapter, .contact) { text-shadow: 0 0 1px #ecebe7, 0 0 4px rgba(236,235,231,.95), 0 0 10px rgba(236,235,231,.8); }
[data-tom="claro"] .regulagem, [data-tom="claro"] .coroa { background: rgba(244,243,239,.92); color: #17191b; border-color: rgba(23,25,27,.16); }
[data-tom="claro"] .regulagem { box-shadow: 0 30px 80px rgba(40,36,30,.18); }
[data-tom="claro"] :is(.regulagem-fechar, .opcoes button) { color: #17191b; }
[data-tom="claro"] .opcoes button { border-color: rgba(23,25,27,.16); }
[data-tom="claro"] .regulagem fieldset { border-top-color: rgba(23,25,27,.1); }
[data-tom="claro"] .regulagem legend { color: rgba(23,25,27,.55); }
[data-tom="claro"] .paleta { border-top-color: rgba(23,25,27,.12); }
[data-tom="claro"] .rodape { background: #e4e2dc; color: #17191b; border-top-color: rgba(23,25,27,.12); }
[data-tom="claro"] .rodape-linha { border-bottom-color: rgba(23,25,27,.12); }
[data-tom="claro"] .rodape-linha p, [data-tom="claro"] .attribution { color: rgba(23,25,27,.62); }
[data-tom="claro"] .peca-imagens figure { box-shadow: 0 30px 70px rgba(40,36,30,.22); }
[data-tom="claro"] .botao-cheio { color: #fff; }
[data-tom="claro"] .chips input:checked + span { color: #fff; }
/* Fundo do chip marcado 6% mais escuro no modo claro: branco sobre latão/ouro dava 4,3:1; agora todos os metais ≥ 4,7:1. */
[data-tom="claro"] .chips input:checked + span { background: color-mix(in srgb, var(--accent) 94%, #000); border-color: color-mix(in srgb, var(--accent) 94%, #000); }
.amostra.m-escuro { background: linear-gradient(135deg, #3a3d41, #0e0f10); }
.amostra.m-claro { background: linear-gradient(135deg, #ffffff, #d9d6cf); }
.regulagem-padrao { display: block; width: 100%; margin: 6px 0 14px; padding: 12px; border: 1px dashed currentColor; border-radius: 4px; background: none; color: inherit; opacity: .7; font: 500 12px/1 Inter, Arial, sans-serif; letter-spacing: .06em; cursor: pointer; }
.regulagem-padrao:hover { opacity: 1; }
.nav-progress i { background: var(--accent); }
/* Cabeçalho: sublinhado que cresce no hover e marca a seção atual. */
.site-header nav a { color: rgba(var(--nav-ink, 236, 235, 231), .62); transition: color .3s ease; }
.site-header nav a:hover, .site-header nav a.ativo { color: rgb(var(--nav-ink, 236, 235, 231)); }
.site-header nav a:not(.nav-process)::after { content: ''; position: absolute; left: 0; right: 0; bottom: 18px; height: 1px; background: var(--accent); transform: scaleX(0); transform-origin: right; transition: transform .45s cubic-bezier(.2,.8,.2,1); }
.site-header nav a:not(.nav-process):hover::after, .site-header nav a.ativo::after { transform: scaleX(1); transform-origin: left; }
.site-header nav a span[aria-hidden] { transition: transform .3s ease; }
.site-header nav a:hover span[aria-hidden] { transform: translate(2px, -2px); }
[data-tom="claro"] { --nav-ink: 23, 25, 27; }
@media (max-width: 700px), (orientation: portrait) { .site-header nav a:not(.nav-process)::after { bottom: 12px; } }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible + span, textarea:focus-visible, input[type="text"]:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }

.eyebrow { margin: 0 0 14px; font-size: 11px; font-weight: 650; letter-spacing: .16em; text-transform: uppercase; color: var(--accent); }
.eyebrow b { font-family: Georgia, serif; font-weight: 400; font-size: 1.25em; letter-spacing: .04em; }

/* ---------- Abertura ---------- */
.headline .eyebrow { margin-bottom: 18px; }
.headline .lede { max-width: 26ch; margin: 22px 0 0; font-size: clamp(15px, 1.15vw, 19px); line-height: 1.45; color: rgba(236,235,231,.78); }
.headline h1 { font-family: var(--titulo); }
[data-tipo="classica"] .headline h1 { font-weight: 400; letter-spacing: -.03em; }
.scroll-cue { position: absolute; z-index: 2; left: 50%; bottom: 28px; margin: 0; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 10px; font-size: 10px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: rgba(236,235,231,.6); opacity: var(--cue-opacity, 1); pointer-events: none; }
.scroll-cue span { width: 1px; height: 34px; background: linear-gradient(var(--accent), transparent); animation: cue 2.2s ease-in-out infinite; transform-origin: top; }
@keyframes cue { 0%, 100% { transform: scaleY(.35); opacity: .4; } 50% { transform: scaleY(1); opacity: 1; } }
body:not(.is-enhanced) .scroll-cue { display: none; }

/* ---------- Capítulos sobre o palco ---------- */
.chapters { position: relative; z-index: 3; }
.is-enhanced .chapters { position: sticky; top: 0; height: 100svh; margin-top: -100svh; pointer-events: none; }
.chapter { padding: 40px 6.5vw; max-width: 520px; }
.is-enhanced .chapter { position: absolute; top: 50%; width: min(400px, 27vw); padding: 0; opacity: 0; transform: translate3d(0, calc(-50% + var(--y, 24px)), 0); will-change: opacity, transform; visibility: hidden; }
.is-enhanced .chapter.lado-esq { left: 5.4vw; }
.is-enhanced .chapter.lado-dir { right: 5.4vw; text-align: left; }
.chapter h2 { margin: 0 0 16px; font-family: var(--titulo); font-size: clamp(28px, 2.6vw, 46px); font-weight: 720; line-height: 1.02; letter-spacing: -.035em; }
[data-tipo="classica"] .chapter h2, [data-tipo="classica"] .secao h2, [data-tipo="classica"] .contact h2 { font-weight: 400; letter-spacing: -.02em; }
.chapter p { margin: 0 0 12px; font-size: clamp(15px, 1.05vw, 18px); line-height: 1.5; color: rgba(236,235,231,.82); }
.chapter p.detalhe { font-size: clamp(13px, .9vw, 15px); color: rgba(236,235,231,.58); }
.chapter::before { content: ''; display: block; width: 44px; height: 1px; margin-bottom: 22px; background: var(--accent); }

/* Contato final no palco */
.contact h2 { font-family: var(--titulo); font-size: clamp(40px, 4.4vw, 80px); }
.contact .contact-links a:first-child { color: var(--accent); }

/* ---------- Seções ---------- */
main > .secao { position: relative; z-index: 1; padding: clamp(90px, 12vw, 180px) 5.4vw; background: var(--bg); color: var(--ink); border-top: 1px solid var(--rule); transition: background-color .4s ease, color .4s ease; }
main > .secao:nth-of-type(odd) { background: var(--bg-2); }
.secao-cabeca { max-width: 760px; margin-bottom: clamp(44px, 6vw, 84px); }
.secao h2 { margin: 0 0 18px; font-family: var(--titulo); font-size: clamp(36px, 4.6vw, 78px); font-weight: 740; line-height: .98; letter-spacing: -.045em; }
.secao h3 { margin: 0 0 12px; font-family: var(--titulo); font-size: clamp(22px, 1.8vw, 30px); font-weight: 680; letter-spacing: -.025em; }
.secao p, .secao li, .secao dd { color: var(--ink-2); font-size: 16px; line-height: 1.6; }
.secao-cabeca p { font-size: clamp(16px, 1.25vw, 20px); margin: 0; }
.nota { font-size: 12px !important; opacity: .75; }

.botao-linha { display: inline-flex; align-items: center; gap: .7em; min-height: 46px; padding: 0 0 2px; border: 0; border-bottom: 1px solid var(--accent); background: none; color: var(--ink); font: 600 14px/1 Inter, Arial, sans-serif; letter-spacing: .02em; cursor: pointer; }
.botao-linha span { color: var(--accent); transition: transform .2s ease; }
.botao-linha:hover span { transform: translate(3px, -2px); }
.botao-cheio { display: inline-flex; align-items: center; justify-content: center; gap: .7em; min-height: 54px; padding: 0 28px; border-radius: 999px; background: var(--accent); color: #17191b; font: 700 15px/1 Inter, Arial, sans-serif; letter-spacing: .01em; transition: transform .2s ease, filter .2s ease; }
.botao-cheio:hover { transform: translateY(-1px); filter: brightness(1.06); }

/* Acervo */
.peca { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, 1fr); gap: clamp(36px, 5vw, 90px); align-items: center; }
.peca-imagens { position: relative; padding-bottom: 8%; }
.peca-imagens figure { margin: 0; overflow: hidden; background: #000; box-shadow: 0 30px 80px rgba(0,0,0,.45); }
.tela-desktop { border-radius: 10px; border: 1px solid var(--rule); }
.tela-desktop img, .tela-mobile img { display: block; width: 100%; height: auto; }
.tela-mobile { position: absolute; right: -2%; bottom: 0; width: 23%; border-radius: 18px; border: 4px solid #0c0d0e; }
.peca-numero { margin: 0 0 8px; font-family: Georgia, serif; font-size: 15px !important; color: var(--accent) !important; letter-spacing: .04em; }
.peca-tipo { margin: 0 0 26px; font-size: 14px !important; }
.peca dl { margin: 0 0 30px; }
.peca dt { margin: 22px 0 6px; font-size: 11px; font-weight: 650; letter-spacing: .14em; text-transform: uppercase; color: var(--ink); }
.peca dd { margin: 0; }
.peca ul, .calibre ul { margin: 0; padding: 0; list-style: none; }
.peca li, .calibre li { position: relative; padding: 7px 0 7px 22px; border-bottom: 1px solid var(--rule); }
.peca li::before, .calibre li::before { content: ''; position: absolute; left: 0; top: 50%; width: 9px; height: 1px; background: var(--accent); }
.proxima-peca { margin: clamp(48px, 6vw, 80px) 0 0; padding-top: 24px; border-top: 1px dashed var(--rule); font-size: 14px !important; }
.proxima-peca span { color: var(--accent); margin-right: 8px; }

/* Calibres */
.calibres { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: clamp(20px, 2.5vw, 40px); }
.calibre { display: flex; flex-direction: column; padding: clamp(28px, 3vw, 48px); border: 1px solid var(--rule); border-radius: 4px; background: linear-gradient(160deg, rgba(var(--luz), .045), transparent 60%); }
.calibre-ref { margin: 0 0 18px; font: 600 11px/1 Inter, Arial, sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--accent) !important; }
.selo { margin-left: 8px; padding: 3px 7px; border: 1px solid var(--accent); border-radius: 99px; font-size: 9px; letter-spacing: .12em; }
.calibre > p { margin: 0 0 22px; }
.calibre ul { margin-bottom: 26px; }
.ficha { margin: 0 0 30px; }
.ficha dt { font-size: 11px; font-weight: 650; letter-spacing: .14em; text-transform: uppercase; color: var(--ink); margin-bottom: 6px; }
.ficha dd { margin: 0; font-size: 14px !important; }
.calibre .botao-linha { margin-top: auto; align-self: flex-start; }

/* Montagem */
.etapas { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--rule); }
.etapas li { padding: 30px 28px 34px 0; border-bottom: 1px solid var(--rule); }
.etapas b { display: block; margin-bottom: 26px; font-family: Georgia, serif; font-weight: 400; font-size: 15px; color: var(--accent); }
.etapas p { margin: 0; max-width: 30ch; }

/* Bancada */
.bancada { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, 1fr); gap: clamp(20px, 2.5vw, 40px); }
.demo { padding: clamp(28px, 3vw, 48px); border: 1px solid var(--rule); border-radius: 4px; }
.demo h3 { max-width: 22ch; }
.demo-fluxo { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1.3fr); gap: 16px; align-items: start; margin: 26px 0 24px; min-height: 150px; }
.demo-chat { display: flex; flex-direction: column; gap: 8px; }
.demo-vazio { margin: 0; font-size: 13px !important; opacity: .6; }
.demo-bolha { align-self: flex-start; max-width: 100%; padding: 10px 13px; border-radius: 14px 14px 14px 4px; background: #23452f; color: #e9f5ec; font-size: 13px; line-height: 1.4; animation: chega .35s ease both; }
[data-tom="claro"] .demo-bolha { background: #d4ecd9; color: #11301b; }
.demo-seta { padding-top: 10px; color: var(--accent); font-size: 20px; }
.demo-planilha { width: 100%; border-collapse: collapse; font-size: 12.5px; color: var(--ink); }
.demo-planilha th { padding: 7px 8px; text-align: left; font-size: 10px; font-weight: 650; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); border-bottom: 1px solid var(--rule); }
.demo-planilha td { padding: 8px; border-bottom: 1px solid var(--rule); animation: chega .4s ease both; }
.demo-planilha td:last-child { color: var(--accent); }
@keyframes chega { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* Perguntas */
.perguntas { max-width: 900px; border-top: 1px solid var(--rule); }
.perguntas details { border-bottom: 1px solid var(--rule); }
.perguntas summary { display: flex; justify-content: space-between; gap: 20px; padding: 24px 0; cursor: pointer; list-style: none; font-family: var(--titulo); font-size: clamp(18px, 1.5vw, 24px); font-weight: 600; letter-spacing: -.02em; color: var(--ink); }
.perguntas summary::-webkit-details-marker { display: none; }
.perguntas summary::after { content: '+'; color: var(--accent); font-weight: 300; font-size: 1.3em; line-height: .8; transition: transform .25s ease; }
.perguntas details[open] summary::after { transform: rotate(45deg); }
.perguntas details p { margin: 0 0 26px; max-width: 64ch; }

/* Briefing */
.briefing { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(300px, 1fr); gap: 20px clamp(36px, 5vw, 90px); align-items: start; }
.briefing fieldset { grid-column: 1; margin: 0; padding: 0 0 30px; border: 0; border-bottom: 1px solid var(--rule); }
.briefing legend { padding: 0 0 16px; font-size: 13px; font-weight: 650; letter-spacing: .06em; color: var(--ink); }
.briefing legend b { margin-right: 10px; font-family: Georgia, serif; font-weight: 400; color: var(--accent); }
.briefing legend small { font-weight: 400; color: var(--ink-2); }
.chips { display: flex; flex-wrap: wrap; gap: 10px; }
.chips label { position: relative; cursor: pointer; }
.chips input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.chips span { display: inline-flex; align-items: center; min-height: 42px; padding: 0 18px; border: 1px solid var(--rule); border-radius: 999px; font-size: 14px; color: var(--ink); transition: background-color .2s, border-color .2s, color .2s; }
@media (hover: hover) { .chips label:hover span { border-color: var(--accent); } } /* no toque, o hover gruda: o chip desmarcado parecia continuar marcado */
.chips input:checked + span { background: var(--accent); border-color: var(--accent); color: #17191b; font-weight: 600; }
.campos { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px; }
.campos legend { grid-column: 1 / -1; }
.campos label { display: flex; flex-direction: column; gap: 8px; font-size: 12px; color: var(--ink-2); }
.campos .largo { grid-column: 1 / -1; }
.campos input, .campos textarea { width: 100%; padding: 12px 14px; border: 1px solid var(--rule); border-radius: 4px; background: transparent; color: var(--ink); font: 15px/1.4 Inter, Arial, sans-serif; resize: vertical; }
.briefing-saida { grid-column: 2; grid-row: 1 / span 5; position: sticky; top: 110px; padding: clamp(24px, 2.6vw, 40px); border: 1px solid var(--rule); border-radius: 4px; background: rgba(var(--luz), .04); }
.briefing-previa { min-height: 120px; margin: 0 0 24px; white-space: pre-line; font-size: 15px !important; color: var(--ink) !important; }

/* Rodapé */
.rodape { padding: 60px 5.4vw 30px; background: #0f1012; color: #ecebe7; border-top: 1px solid rgba(236,235,231,.12); }
.rodape-linha { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 20px 40px; padding-bottom: 30px; border-bottom: 1px solid rgba(236,235,231,.12); }
.rodape-logo { width: 140px; height: auto; }
.rodape-linha p { margin: 0; font-family: Georgia, serif; font-style: italic; color: rgba(236,235,231,.7); }
.rodape nav { display: flex; gap: 28px; font-size: 14px; font-weight: 600; }
.rodape nav a:hover { color: var(--accent); }
.rodape .attribution { padding: 20px 0 0; background: none; pointer-events: auto !important; }

/* ---------- Preenchimento: leitura técnica, desenhos e régua de bisel ---------- */
main > .secao { padding-block: clamp(72px, 8vw, 132px); }
main > .secao::before { content: ''; position: absolute; top: 0; left: 5.4vw; right: 5.4vw; height: 9px; pointer-events: none;
  background: repeating-linear-gradient(90deg, var(--rule) 0 1px, transparent 1px 14px) top / 100% 5px no-repeat,
              repeating-linear-gradient(90deg, color-mix(in srgb, var(--accent) 55%, transparent) 0 1px, transparent 1px 70px) top / 100% 9px no-repeat; }
/* Texto agrupado na base à esquerda; desenho + leitura à direita ocupando a altura toda. */
.secao-cabeca { max-width: none; display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 320px); grid-template-rows: 1fr repeat(3, auto); column-gap: clamp(32px, 6vw, 110px); margin-bottom: clamp(40px, 4.5vw, 64px); }
.secao-cabeca > :not(.leitura) { grid-column: 1; max-width: 760px; }
.secao-cabeca > .eyebrow { grid-row: 2; }
.secao-cabeca > h2 { grid-row: 3; }
.secao-cabeca > p:not(.eyebrow) { grid-row: 4; }
.leitura { grid-column: 2; grid-row: 1 / -1; display: flex; flex-direction: column; justify-content: flex-end; gap: 20px; }
.desenho { display: block; width: min(100%, 210px); aspect-ratio: 1; margin-left: auto; color: var(--accent); opacity: .62; }
.desenho svg { width: 100%; height: 100%; overflow: visible; }
.desenho svg * { fill: none; stroke: currentColor; stroke-width: 1; vector-effect: non-scaling-stroke; }
.desenho .gira { transform-box: fill-box; transform-origin: center; animation: gira 80s linear infinite; }
.desenho .gira-rev { transform-box: fill-box; transform-origin: center; animation: gira 50s linear infinite reverse; }
.desenho .oscila { transform-box: fill-box; transform-origin: center; animation: oscila 2.4s ease-in-out infinite alternate; }
.desenho .minuto { transform-box: view-box; transform-origin: 100px 100px; animation: gira 120s linear infinite; }
.desenho .hora { transform-box: view-box; transform-origin: 100px 100px; animation: gira 1440s linear infinite; }
@keyframes gira { to { transform: rotate(360deg); } }
@keyframes oscila { from { transform: rotate(-14deg); } to { transform: rotate(14deg); } }
.leitura dl { display: grid; grid-template-columns: 1fr 1fr; margin: 0; border-top: 1px solid var(--rule); }
.leitura dl > div { padding: 14px 0 0; }
.leitura dl > div + div { padding-left: 16px; border-left: 1px solid var(--rule); }
.leitura dd { order: -1; margin: 0 0 6px; font: 300 clamp(34px, 3vw, 48px)/1 var(--titulo); letter-spacing: -.03em; color: var(--ink); font-variant-numeric: tabular-nums; }
.leitura dd.texto { font-size: clamp(17px, 1.3vw, 21px); font-weight: 600; letter-spacing: -.01em; padding-top: clamp(10px, 1vw, 16px); }
.leitura dl > div { display: flex; flex-direction: column; }
.leitura dt { font-size: 10.5px; font-weight: 650; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); }

.calibre { position: relative; overflow: hidden; }
.calibre::after { position: absolute; right: -6px; bottom: -58px; font: 400 230px/1 Georgia, serif; color: rgba(var(--luz), .055); pointer-events: none; }
.calibre[data-servico="site"]::after { content: 'S'; }
.calibre[data-servico="automacao"]::after { content: 'A'; }
.etapas li { position: relative; }
.etapas li::before { content: ''; position: absolute; top: -4px; left: 0; width: 7px; height: 7px; border: 1px solid var(--accent); border-radius: 50%; background: var(--bg); transition: background-color .4s ease; }
.etapas li:hover::before { background: var(--accent); }
main > .secao:nth-of-type(odd) .etapas li::before { background: var(--bg-2); }

.perguntas-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 340px); gap: clamp(32px, 6vw, 110px); align-items: start; }
.perguntas-grade .perguntas { max-width: none; }
.perguntas-aside { position: sticky; top: 110px; padding: clamp(24px, 2.4vw, 36px); border: 1px solid var(--rule); border-radius: 4px; background: linear-gradient(160deg, rgba(var(--luz), .05), transparent 70%); }
.perguntas-aside h3 { font-size: clamp(20px, 1.6vw, 26px); }
.perguntas-aside p:not(.eyebrow) { margin: 0 0 22px; }

.metais-rapidos { display: flex; flex-wrap: wrap; gap: 10px; margin: 4px 0 26px; }
.metais-rapidos button { display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid var(--rule); border-radius: 50%; background: none; cursor: pointer; transition: transform .35s var(--ease-out, ease), border-color .25s ease; }
.metais-rapidos button:hover { transform: translateY(-2px); }
.metais-rapidos button[aria-pressed="true"] { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(var(--luz), .14); }
.metais-rapidos .amostra { width: 20px; height: 20px; }

@media (max-width: 860px) {
  .secao-cabeca, .perguntas-grade { grid-template-columns: 1fr; }
  .secao-cabeca { grid-template-rows: none; }
  .secao-cabeca > .eyebrow, .secao-cabeca > h2, .secao-cabeca > p:not(.eyebrow) { grid-row: auto; }
  .leitura { grid-column: 1; grid-row: auto; margin-top: 28px; flex-direction: row; align-items: flex-end; }
  .leitura dl { flex: 1; }
  .desenho { width: 96px; flex: none; margin: 0; order: 2; }
  .perguntas-aside { position: static; }
}

/* ---------- Movimento em todo o site (só transform/opacity) ---------- */
:root { --ease-out: cubic-bezier(.16, 1, .3, 1); --ease-io: cubic-bezier(.65, 0, .35, 1); }
.js-revela .revela { opacity: 0; transform: translate3d(0, 32px, 0); transition: opacity 1s var(--ease-out), transform 1.2s var(--ease-out); transition-delay: calc(var(--i, 0) * 75ms); will-change: opacity, transform; }
.js-revela .revela.visivel { opacity: 1; transform: none; will-change: auto; }
.js-revela .peca-imagens.revela { transform: translate3d(0, 48px, 0) scale(.97); }
.js-revela .peca-imagens.revela.visivel { transform: none; }
.tela-mobile { transform: translate3d(0, var(--paralaxe, 0px), 0); }
.calibre, .demo { transition: transform .6s var(--ease-out), border-color .4s ease, box-shadow .6s var(--ease-out); }
.calibre:hover, .demo:hover { transform: translateY(-5px); border-color: color-mix(in srgb, var(--accent) 45%, var(--rule)); box-shadow: 0 24px 60px rgba(0,0,0,.22); }
.peca-imagens figure { transition: transform .8s var(--ease-out); }
.peca-imagens:hover .tela-desktop { transform: scale(1.012); }
.etapas li { transition: background-color .4s ease; }
.etapas li:hover { background: linear-gradient(90deg, rgba(var(--luz), .05), transparent 70%); }
.etapas li b { display: inline-block; transition: transform .5s var(--ease-out); }
.etapas li:hover b { transform: translateX(6px); }
.chips span { transition: background-color .25s ease, border-color .25s ease, color .25s ease, transform .2s var(--ease-out); }
.chips label:active span { transform: scale(.96); }
.chips input:checked + span { animation: marca .45s var(--ease-out); }
@keyframes marca { 0% { transform: scale(.94); } 60% { transform: scale(1.04); } 100% { transform: none; } }
.botao-linha, .botao-cheio, .opcoes button { transition: transform .35s var(--ease-out), border-color .25s ease, background-color .25s ease, filter .25s ease; }
.botao-linha:active, .botao-cheio:active, .opcoes button:active { transform: scale(.97); }
.perguntas details > p { overflow: hidden; }
.perguntas summary { transition: color .25s ease; }
@media (hover: hover) { .perguntas summary:hover { color: var(--accent); } }
.perguntas summary::after { transition: transform .45s var(--ease-out); }
.regulagem.fechando { animation: fecha .28s var(--ease-io) forwards; }
@keyframes fecha { to { opacity: 0; transform: translateY(10px) scale(.98); } }
.regulagem { transform-origin: bottom right; animation-timing-function: var(--ease-out); animation-duration: .45s; }
.coroa { transition: border-color .3s ease, transform .5s var(--ease-out), background-color .4s ease; }
.coroa:hover { transform: translateY(-2px); }
.coroa-dica { transition: max-width .6s var(--ease-out); }
.briefing-previa { transition: color .3s ease; }
.briefing-previa.pulsa { animation: atualiza .5s var(--ease-out); }
@keyframes atualiza { from { opacity: .45; transform: translateY(3px); } to { opacity: 1; transform: none; } }
.demo-bolha { animation: chega .55s var(--ease-out) both; }
.demo-planilha td { animation: chega .6s var(--ease-out) both; }
main > .secao { transition: background-color .6s ease, color .6s ease; }
@media (hover: none) { .calibre:hover, .demo:hover, .coroa:hover { transform: none; box-shadow: none; } }
@media (prefers-reduced-motion: reduce) {
  .js-revela .revela { opacity: 1; transform: none; transition: none; }
  .tela-mobile { transform: none; }
  .calibre, .demo, .peca-imagens figure, .etapas li b, .chips span, .coroa { transition: none; }
  .chips input:checked + span, .briefing-previa.pulsa, .regulagem.fechando { animation: none; }
}

/* ---------- Selos de segurança: discretos, no finalzinho ---------- */
/* Discretos pela cor (não por transparência), mantendo contraste mínimo de 4,5:1 nos dois modos. */
.selos { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 0; padding: 18px 0 0; list-style: none; color: rgba(236,235,231,.6); transition: color .4s ease; }
.selos:hover, .selos:focus-within { color: rgba(236,235,231,.9); }
[data-tom="claro"] .selos { color: rgba(23,25,27,.66); }
[data-tom="claro"] .selos:hover, [data-tom="claro"] .selos:focus-within { color: #17191b; }
.selos li, .selos a { display: inline-flex; align-items: center; gap: 7px; font-size: 10.5px; letter-spacing: .04em; color: inherit; }
.selos a:hover { color: var(--accent); }
.selos svg { width: 14px; height: 14px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }

/* Página de texto (privacidade) */
.pagina-texto main { padding-top: 80px; }
.texto-legal { max-width: 720px; }
.texto-legal h3 { margin: 38px 0 10px; }
.texto-legal a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Troca de modo: cores se espalhando a partir do clique ---------- */
@property --vt-r { syntax: '<length>'; inherits: false; initial-value: 0px; }
.vt-onda::view-transition-old(root), .vt-onda::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
.vt-onda::view-transition-old(root) { z-index: 1; }
.vt-onda::view-transition-new(root) {
  z-index: 2;
  -webkit-mask-image: radial-gradient(circle at var(--vt-x) var(--vt-y), #000 calc(var(--vt-r) - 150px), rgba(0,0,0,.55) calc(var(--vt-r) - 60px), transparent var(--vt-r));
  mask-image: radial-gradient(circle at var(--vt-x) var(--vt-y), #000 calc(var(--vt-r) - 150px), rgba(0,0,0,.55) calc(var(--vt-r) - 60px), transparent var(--vt-r));
  animation: vt-espalha 1.15s cubic-bezier(.62, .02, .28, 1) both, vt-floresce 1.6s ease-out both;
}
@keyframes vt-espalha { from { --vt-r: 0px; } to { --vt-r: var(--vt-max); } }
@keyframes vt-floresce { from { filter: saturate(1.7) brightness(1.08); } to { filter: none; } }

/* ---------- Coroa e regulagem ---------- */
.coroa { position: fixed; z-index: 30; right: clamp(16px, 2.4vw, 36px); bottom: clamp(16px, 2.4vw, 36px); display: flex; align-items: center; gap: 10px; height: 52px; padding: 0 16px 0 12px; border: 1px solid rgba(236,235,231,.22); border-radius: 999px; background: rgba(12,13,14,.82); color: #ecebe7; backdrop-filter: blur(10px); cursor: pointer; transition: border-color .2s, transform .25s; }
.coroa svg { width: 28px; height: 28px; fill: none; stroke: var(--accent); stroke-width: 1.6; transition: transform .35s cubic-bezier(.2,.8,.2,1); }
.coroa:hover, .coroa[aria-expanded="true"] { border-color: var(--accent); }
.coroa[aria-expanded="true"] svg { transform: translateX(5px); }
.coroa-dica { font-size: 11px; font-weight: 650; letter-spacing: .12em; text-transform: uppercase; max-width: 0; overflow: hidden; white-space: nowrap; transition: max-width .45s ease; }
.coroa:hover .coroa-dica, .coroa.convite .coroa-dica, .coroa[aria-expanded="true"] .coroa-dica { max-width: 140px; }
.coroa.convite { animation: pulso 1.6s ease 2; }
@keyframes pulso { 0%, 100% { box-shadow: 0 0 0 0 rgba(var(--luz), 0); } 50% { box-shadow: 0 0 0 10px rgba(var(--luz), .16); } }

.regulagem { position: fixed; z-index: 29; right: clamp(16px, 2.4vw, 36px); bottom: calc(clamp(16px, 2.4vw, 36px) + 64px); width: min(380px, calc(100vw - 32px)); max-height: calc(100svh - 120px); overflow: auto; padding: 26px 24px 10px; border: 1px solid rgba(236,235,231,.18); border-radius: 6px; background: rgba(14,15,17,.94); color: #ecebe7; backdrop-filter: blur(14px); box-shadow: 0 30px 80px rgba(0,0,0,.5); animation: abre .3s cubic-bezier(.2,.8,.2,1); }
@keyframes abre { from { opacity: 0; transform: translateY(10px) scale(.98); } }
.regulagem header { position: relative; padding-right: 30px; margin-bottom: 8px; }
.regulagem h2 { margin: 0; font-family: var(--titulo); font-size: 19px; font-weight: 600; line-height: 1.3; letter-spacing: -.015em; }
.regulagem-fechar { position: absolute; top: -8px; right: -6px; width: 40px; height: 40px; border: 0; background: none; color: #ecebe7; font-size: 24px; cursor: pointer; }
.regulagem fieldset { margin: 0; padding: 16px 0; border: 0; border-top: 1px solid rgba(236,235,231,.1); }
.regulagem legend { padding: 0 0 10px; font-size: 10px; font-weight: 650; letter-spacing: .16em; text-transform: uppercase; color: rgba(236,235,231,.6); }
.opcoes { display: flex; flex-wrap: wrap; gap: 8px; }
.opcoes button { display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 0 14px; border: 1px solid rgba(236,235,231,.18); border-radius: 999px; background: none; color: #ecebe7; font: 500 13px/1 Inter, Arial, sans-serif; cursor: pointer; }
.opcoes button.serifa { font-family: Georgia, serif; font-size: 14px; }
/* Cada botão de tipografia na própria letra (aqui, e não em style="", para a CSP dispensar 'unsafe-inline'). */
[data-ajuste="tipo"] button[data-valor="tecnica"] { font-family: Inter, Arial, sans-serif; }
[data-ajuste="tipo"] button[data-valor="classica"] { font-family: Georgia, serif; }
[data-ajuste="tipo"] button[data-valor="didone"] { font-family: 'Playfair Display', Didot, 'Bodoni MT', serif; }
[data-ajuste="tipo"] button[data-valor="garamond"] { font-family: 'Cormorant Garamond', Garamond, serif; }
[data-ajuste="tipo"] button[data-valor="editorial"] { font-family: Fraunces, Georgia, serif; }
[data-ajuste="tipo"] button[data-valor="grotesca"] { font-family: 'Space Grotesk', Arial, sans-serif; }
[data-ajuste="tipo"] button[data-valor="geometrica"] { font-family: Outfit, 'Century Gothic', sans-serif; }
[data-ajuste="tipo"] button[data-valor="condensada"] { font-family: 'Barlow Condensed', 'Arial Narrow', sans-serif; }
[data-ajuste="tipo"] button[data-valor="mono"] { font-family: 'IBM Plex Mono', Consolas, monospace; }
[data-ajuste="tipo"] button[data-valor="gravada"] { font-family: 'Cinzel', 'Trajan Pro', serif; }
.opcoes button[aria-pressed="true"] { border-color: var(--accent); background: rgba(var(--luz), .12); }
.amostra { width: 12px; height: 12px; border-radius: 50%; }
.amostra.latao { background: linear-gradient(135deg, #e6c88f, #9c7438); }
.amostra.aco { background: linear-gradient(135deg, #e8edf2, #7f8a96); }
.amostra.azul { background: linear-gradient(135deg, #9dbbe4, #2f4f7d); }
.amostra.ouro { background: linear-gradient(135deg, #f5dc95, #a87b26); }
.amostra.rose { background: linear-gradient(135deg, #f1c3b1, #a2614e); }
.amostra.ourobranco { background: linear-gradient(135deg, #f7f4ec, #a9a397); }
.amostra.platina { background: linear-gradient(135deg, #f2f3f5, #8d929a); }
.amostra.titanio { background: linear-gradient(135deg, #c9d0d6, #5b636b); }
.amostra.bronze { background: linear-gradient(135deg, #dcae7e, #7a512c); }
.amostra.cobre { background: linear-gradient(135deg, #e9a37c, #8a4526); }
.amostra.rutenio { background: linear-gradient(135deg, #a7abb0, #3b3e42); }
.amostra { box-shadow: inset 0 0 0 1px rgba(255,255,255,.18), 0 1px 2px rgba(0,0,0,.4); }
.mais-metais { justify-content: center; width: 38px; padding: 0 !important; font-size: 18px !important; font-weight: 300 !important; transition: transform .25s ease, border-color .2s; }
.mais-metais[aria-expanded="true"] { transform: rotate(45deg); border-color: var(--accent) !important; }
.paleta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; width: 100%; margin-top: 4px; padding-top: 12px; border-top: 1px dashed rgba(236,235,231,.12); animation: abre .25s ease; }
.paleta[hidden] { display: none; }
.paleta button { justify-content: flex-start; }

/* Celular baixo (iPhone SE, Android pequeno): só selo e título nos capítulos, para não cobrir o corpo do relógio. */
@media (orientation: portrait) and (max-height: 660px) {
  .is-enhanced .chapter p { display: none; }
}

@keyframes traca { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes revela { from { clip-path: inset(0 0 100% 0); transform: translateY(.45em); } to { clip-path: inset(0 0 -.2em 0); transform: none; } }

/* ---------- Celular ---------- */
@media (max-width: 700px), (orientation: portrait) {
  .site-header .nav-extra { display: none; }
  .headline .lede { font-size: 15px; }
  /* Palco do celular: o relógio (80%) fica centrado na área visível abaixo do cabeçalho (--cab).
     --svh: área visível com a barra do navegador aberta; --lvh: com ela recolhida (o palco cobre essa altura,
     sem faixa do fundo embaixo). O player mede o palco; scale/translate não brigam com o transform do JS.
     No final, enquanto "Vamos montar o seu." entra no alto, o relógio encolhe e desce um pouco (--contact-opacity). */
  .is-enhanced { --palco-k: .8; --cab: 65px; --svh: 100svh; --lvh: 100svh;
    --palco-dy: calc((var(--svh) + var(--cab) - var(--lvh)) / 2); }
  @supports (height: 100lvh) { .is-enhanced { --lvh: 100lvh; } }
  .is-enhanced .stage { height: var(--lvh); }
  .is-enhanced .chapters { height: var(--svh); margin-top: calc(-1 * var(--lvh)); }
  .is-enhanced :is(#watch-sequence, .poster, .espelho, .vitrine) { --fim: min(1, 4 * var(--contact-opacity, 0));
    --k: calc(var(--palco-k) - .16 * var(--fim)); --dy: calc(var(--palco-dy) + 40px * var(--fim)); }
  .is-enhanced :is(#watch-sequence, .poster, .espelho) { scale: var(--k); translate: 0 var(--dy); } /* .espelho: cópia do quadro durante a troca de modo */
  .is-enhanced .vitrine { scale: var(--k); translate: calc(50vw * (1 - var(--k))) calc(var(--lvh) / 2 * (1 - var(--k)) + var(--dy)); }
  .is-enhanced .chapter, .is-enhanced .chapter.lado-esq, .is-enhanced .chapter.lado-dir { left: 0; right: 0; top: auto; bottom: 0; width: auto; padding: 0 6.5vw calc(26px + env(safe-area-inset-bottom)); transform: translate3d(0, var(--y, 24px), 0); }
  .chapter::before { margin-bottom: 14px; }
  .chapter .eyebrow { margin-bottom: 10px; }
  .chapter h2 { font-size: clamp(24px, 6.6vw, 30px); margin-bottom: 8px; }
  .chapter p { font-size: 14px; line-height: 1.45; margin-bottom: 0; padding-right: 56px; } /* a coroa fica no canto de baixo */
  .contact { top: calc(var(--cab, 65px) + 12px); bottom: auto; }
  .contact h2 { font-size: clamp(28px, 8vw, 52px); }
  /* Entrada do capítulo: o traço se desenha, o título sobe por trás de uma máscara e a frase vem depois. */
  .is-enhanced .chapter::before { width: 56px; height: 2px; transform-origin: left; }
  .is-enhanced .chapter h2 { font-size: clamp(27px, 7.6vw, 34px); }
  .is-enhanced .chapter.entra::before { animation: traca .7s var(--ease-out) both; }
  .is-enhanced .chapter.entra .eyebrow { animation: chega .5s .08s var(--ease-out) both; }
  .is-enhanced .chapter.entra h2 { animation: revela .9s .14s var(--ease-out) both; }
  .is-enhanced .chapter.entra p { animation: chega .7s .42s var(--ease-out) both; }
  /* Abertura: só o título no alto; a frase de apoio e a linha viva cruzavam o relógio. */
  .headline .lede, .living-line { display: none; }
  .headline h1 { font-size: clamp(34px, 9.2vw, 52px); }
  .scroll-cue { bottom: 20px; }
  .is-enhanced .scroll-cue { bottom: calc(20px + var(--lvh) - var(--svh)); }
  .coroa { width: 48px; padding: 0; gap: 0; justify-content: center; }
  .coroa .coroa-dica { display: none; }
  .chapter p.detalhe { display: none; }
  .peca, .bancada, .briefing { grid-template-columns: 1fr; }
  .briefing-saida { grid-column: 1; grid-row: auto; position: static; }
  .campos { grid-template-columns: 1fr; }
  .demo-fluxo { grid-template-columns: 1fr; }
  .demo-seta { transform: rotate(90deg); justify-self: center; padding: 0; }
  .tela-mobile { width: 30%; right: 0; }
  .coroa { height: 48px; }
  .regulagem { bottom: calc(clamp(16px, 2.4vw, 36px) + 58px); }
}

@media (prefers-reduced-motion: reduce) {
  .scroll-cue span, .coroa.convite, .regulagem, .demo-bolha, .demo-planilha td { animation: none; }
  .is-enhanced .chapters { position: relative; height: auto; margin-top: 0; }
  .is-enhanced .chapter { position: static; opacity: 1; visibility: visible; transform: none; width: auto; padding: 40px 6.5vw; background: none; }
  .is-enhanced :is(#watch-sequence, .poster, .espelho, .vitrine) { scale: none; translate: none; }
  .is-enhanced .chapter p:not(.detalhe) { display: block; } /* parado, o texto não cruza o relógio */
  .is-enhanced .chapter.entra :is(.eyebrow, h2, p), .is-enhanced .chapter.entra::before { animation: none; }
}

/* Durante a troca de modo, as cores mudam de uma vez (a onda faz a transição). */
.troca-modo *, .troca-modo *::before, .troca-modo *::after { transition: none !important; }

/* Link "pular" visível e legível nos dois modos. */
.skip-link { background: var(--ink); color: var(--bg); font-weight: 600; outline: 2px solid var(--accent); }

/* ---------- Composição estática (sem JS, "reduzir movimento" ou falha de rede) ---------- */
/* Abertura no topo, contato ancorado na base: nunca se sobrepõem. */
body:not(.is-enhanced) .living-line, body:not(.is-enhanced) .contact .eyebrow { display: none; }
body:not(.is-enhanced) .headline { top: clamp(100px, 13svh, 150px); }
body:not(.is-enhanced) .contact { top: auto; bottom: clamp(32px, 7svh, 80px); width: min(560px, 40vw); }
body:not(.is-enhanced) .contact h2 { font-size: clamp(34px, 3.4vw, 60px); margin-bottom: 16px; }
@media (max-width: 700px), (orientation: portrait) {
  body:not(.is-enhanced) .headline { top: 82px; }
  body:not(.is-enhanced) .contact { left: 0; right: 0; bottom: 0; width: auto; padding: 60px 6.5vw calc(24px + env(safe-area-inset-bottom)); background: linear-gradient(to top, rgba(14,15,17,.95) 60%, rgba(14,15,17,0)); }
  [data-palco="claro"] body:not(.is-enhanced) .contact { background: linear-gradient(to top, rgba(236,235,231,.95) 60%, rgba(236,235,231,0)); }
  body:not(.is-enhanced) .contact h2 { font-size: 30px; }
}

/* Alvos de toque com 44 px no mínimo (recomendação de acessibilidade para dedos). */
@media (pointer: coarse) {
  .metais-rapidos button { width: 44px; height: 44px; }
  .rodape nav a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 4px; }
  .selos a { min-height: 32px; }
}

/* ---------- Telas grandes (2K/4K): tipografia acompanha a tela e o conteúdo não se espalha demais ---------- */
@media (min-width: 1921px) {
  .headline h1 { font-size: clamp(70px, 3.4vw, 120px); }
  .headline .lede { font-size: clamp(19px, .95vw, 26px); }
  .headline .eyebrow, .chapter .eyebrow { font-size: clamp(11px, .55vw, 15px); }
  .is-enhanced .chapter { width: min(620px, 25vw); }
  .chapter h2 { font-size: clamp(46px, 2.4vw, 76px); }
  .chapter p { font-size: clamp(18px, .95vw, 25px); }
  .chapter p.detalhe { font-size: clamp(15px, .78vw, 20px); }
  .contact { width: min(600px, 24vw); }
  .contact h2 { font-size: clamp(80px, 4vw, 140px); }
  .contact-links a { font-size: clamp(26px, 1.3vw, 34px); min-height: 60px; }
  .site-header { height: clamp(80px, 4vw, 104px); }
  .site-header nav a { font-size: clamp(11px, .55vw, 14px); }
  .brand { width: clamp(180px, 8vw, 230px); }
  main > .secao > * { max-width: 1760px; margin-inline: auto; }
  .secao h2 { font-size: clamp(78px, 3.6vw, 120px); }
  .secao h3 { font-size: clamp(30px, 1.3vw, 40px); }
  .secao p, .secao li, .secao dd { font-size: clamp(17px, .85vw, 21px); }
  .leitura dd { font-size: clamp(48px, 2.2vw, 68px); }
  .desenho { width: min(100%, 260px); }
  .rodape-linha, .selos, .rodape .attribution { max-width: 1760px; margin-inline: auto; }
}

/* ---------- Abertura orquestrada ---------- */
html { scrollbar-gutter: stable; }
html.travado { overflow: hidden; } /* só a raiz: overflow no <body> quebra o sticky do palco */
.regulagem { overscroll-behavior: contain; }
.abertura { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; align-content: center; gap: 26px; background: var(--bg);
  opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .8s cubic-bezier(.65, 0, .35, 1), visibility 0s linear .8s; }
.abrindo:not(.revelado) .abertura, .voltando .abertura { opacity: 1; visibility: visible; pointer-events: auto; transition: opacity .3s ease, visibility 0s; }
.voltando .abertura-barra { visibility: hidden; }
.abertura-marca { width: 44px; height: 44px; opacity: .9; animation: respira 2.4s ease-in-out infinite; }
[data-tom="claro"] .abertura-marca { filter: brightness(.1); }
.abertura-barra { width: 140px; height: 1px; background: var(--rule); overflow: hidden; }
.abertura-barra i { display: block; height: 100%; background: var(--accent); transform-origin: left; transform: scaleX(var(--carga, 0)); transition: transform .35s ease; }
@keyframes respira { 0%, 100% { transform: scale(1); opacity: .7; } 50% { transform: scale(1.06); opacity: 1; } }
/* Entrada em sequência: cabeçalho, título linha por linha, aviso de rolar, coroa. */
.abrindo .site-header, .abrindo .headline .eyebrow, .abrindo .headline h1 span, .abrindo .headline .lede, .abrindo .scroll-cue, .abrindo .coroa, .abrindo .living-line {
  opacity: 0; transform: translate3d(0, 18px, 0); }
.abrindo .site-header { transform: translate3d(0, -100%, 0); }
.abrindo.revelado :is(.site-header, .headline .eyebrow, .headline h1 span, .headline .lede, .scroll-cue, .coroa, .living-line) {
  opacity: 1; transform: none; transition: opacity .9s var(--ease-out, ease), transform 1.1s var(--ease-out, ease); }
.abrindo.revelado .site-header { transition-delay: .25s; }
.abrindo.revelado .headline .eyebrow { transition-delay: .35s; }
.abrindo.revelado .headline h1 span:nth-child(1) { transition-delay: .45s; }
.abrindo.revelado .headline h1 span:nth-child(2) { transition-delay: .55s; }
.abrindo.revelado .headline h1 span:nth-child(3) { transition-delay: .65s; }
.abrindo.revelado .headline .lede, .abrindo.revelado .living-line { transition-delay: .8s; }
.abrindo.revelado .scroll-cue { transition-delay: 1s; }
.abrindo.revelado .coroa { transition-delay: 1.15s; }
@media (prefers-reduced-motion: reduce) {
  .abrindo .abertura, .abertura-marca { transition: none; animation: none; }
  .abrindo :is(.site-header, .headline .eyebrow, .headline h1 span, .headline .lede, .scroll-cue, .coroa, .living-line) { opacity: 1 !important; transform: none !important; transition: none !important; }
}