/* Imersão Médico Escolhido · CSS das dobras 2 a 14 (fora da primeira dobra).
   Carregado sem bloquear a renderização; o CSS da barra, da hero (com a foto do celular) e do aviso de cookies fica inline no index.html.
   Nome versionado pelo conteúdo: mudou o arquivo, muda o nome (cache longo em _headers). */

/* ===== Comum das dobras ===== */
.b-intro{max-width:32em;margin:var(--space-16) auto 0;font-size:var(--fs-body);line-height:1.5;color:var(--text-muted);text-wrap:pretty}
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.b-cta{margin-top:var(--space-48);display:grid;justify-items:center}
.b-cta .ime-btn{width:100%;max-width:460px}
@media (min-width:768px){.b-cta .ime-btn{width:auto;max-width:none}}
@media (min-width:1024px){.b-intro{font-size:var(--fs-lead)}}

/* ===== 2 · O paciente decide antes da consulta ===== */
/* Abertura curta e centrada; as 4 perguntas em voz alta; o comparativo é o protagonista:
   dois blocos grandes (cinza e creme) ligados pelo fio dourado que nasce do ponto. */
.b2__abre{max-width:64rem}
.b2__abre .ime-headline{max-width:20em;margin-inline:auto}
/* a definição de paciente certo fica discreta, aberta pelo fio dourado */
.b2__def{max-width:34em;margin:var(--space-24) auto 0;padding-top:var(--space-16);background:linear-gradient(var(--gold),var(--gold)) 50% 0/var(--space-32) 1px no-repeat;font-size:var(--fs-small);line-height:1.5;color:var(--text-muted);text-wrap:pretty}
.b2__grid{display:grid;gap:var(--space-64);margin-top:var(--space-48)}
.b2__perg-h{font-size:var(--fs-body);line-height:1.5;color:var(--text-muted)}
.b2__perg{margin-top:var(--space-12);border-bottom:1px solid var(--line)}
.b2__perg li{padding:var(--space-12) 0;border-top:1px solid var(--line);font-family:var(--font-display);font-weight:600;font-size:20px;line-height:1.2;letter-spacing:-.015em;color:var(--heading);text-wrap:balance}
.b2__perg .q{color:var(--gold)}
.b2__cmp-h{margin-bottom:var(--space-24);font-family:var(--font-display);font-weight:700;font-size:var(--fs-sm);line-height:1.1;letter-spacing:-.02em;color:var(--heading);text-align:center;text-wrap:balance}
.cmp{display:grid;gap:var(--space-48)}
.cmp__lado{position:relative;padding:var(--space-24);border-radius:var(--radius-lg)}
.cmp__lado--a{background:var(--bg-inset);box-shadow:inset 0 0 0 1px var(--line);color:var(--text-muted)}
.cmp__lado--b{background:var(--invert);color:var(--on-invert)}
.cmp__t{font-family:var(--font-mono);font-size:var(--fs-label);font-weight:500;line-height:1.35;letter-spacing:.14em;text-transform:uppercase}
.cmp__lado--b .cmp__t{color:var(--on-invert-gold)}
.cmp__q{margin-top:var(--space-12);font-family:var(--font-display);font-weight:700;font-size:28px;line-height:1.05;letter-spacing:-.025em;text-wrap:balance}
.cmp__lado--a .cmp__q{color:var(--text-muted)}
.cmp__lado--b .cmp__q{color:var(--on-invert)}
.cmp__l{margin-top:var(--space-16)}
.cmp__l li{padding:var(--space-8) 0;border-top:1px solid var(--line);font-size:var(--fs-body);line-height:1.4}
.cmp__lado--b .cmp__l li{border-top-color:color-mix(in srgb,var(--on-invert) 16%,transparent);font-weight:600}
.cmp__lado--b::before,.cmp__lado--b::after{content:"";position:absolute;background:var(--gold)}
.cmp__lado--b::before{left:50%;top:calc(-1 * var(--space-48));width:2px;height:var(--space-48);margin-left:-1px;transform-origin:50% 0}
.cmp__lado--b::after{left:50%;top:calc(-1 * var(--space-48) - 4px);width:8px;height:8px;margin-left:-4px;border-radius:var(--radius-pill)}
.js .b2__cmp.rv .cmp__lado--b::before{transform:scaleY(0);transition:transform .9s var(--ease) .45s}
.js .b2__cmp.rv.in .cmp__lado--b::before{transform:none}
@media (min-width:1024px){
.b2__grid{grid-template-columns:minmax(0,3fr) minmax(0,10fr);column-gap:var(--space-48);align-items:end;margin-top:var(--space-64)}
.b2__perg-h{font-size:var(--fs-data)}
.b2__perg li{font-size:20px}
.b2__cmp-h{text-align:left;font-size:var(--fs-sm)}
.cmp{grid-template-columns:1fr 1fr;gap:var(--space-64);align-items:start}
.cmp__lado{display:flex;flex-direction:column;padding:var(--space-48) var(--space-32) var(--space-32)}
.cmp__q{margin-top:var(--space-16);font-size:40px;line-height:1.04}
.cmp__l{margin-top:0;padding-top:var(--space-32)}
.cmp__l li{font-size:var(--fs-lead)}
/* o fio sai do card A e chega na 1ª linha da pergunta do card B: 48 de respiro + rótulo 16 + 16 + meia linha de 42 */
.cmp__lado--b::before{left:auto;right:100%;top:101px;width:var(--space-64);height:2px;margin:0;transform-origin:0 50%}
.cmp__lado--b::after{left:calc(-1 * var(--space-64) - 4px);top:98px;margin:0}
.js .b2__cmp.rv .cmp__lado--b::before{transform:scaleX(0)}
}

.b2__fig{display:none}
@media (min-width:1024px){
/* O par em desenho, alinhado às duas colunas: à esquerda o paciente vaga entre vários nomes; à direita o fio dourado vai direto a um ponto só */
.b2__fig{display:block;margin-bottom:var(--space-24)}
.b2__fig svg{display:block;width:100%;height:auto;overflow:visible}
.b2f__vaga{fill:none;stroke:var(--line-strong);stroke-width:1.5;stroke-dasharray:4 6;stroke-linecap:round}
.b2f__nomes circle{fill:var(--bg-raised);stroke:var(--line-strong);stroke-width:1.5}
.b2f__pac{fill:var(--line-strong)}
.b2f__fio{fill:none;stroke:var(--gold);stroke-width:2.5;stroke-linecap:round}
.b2f__ponto,.b2f__voce{fill:var(--gold)}
.b2f__anel{fill:none;stroke:var(--gold);stroke-width:1.5}
.js .b2__cmp.rv .b2f__fio{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.2s var(--ease) .3s}
.js .b2__cmp.rv.in .b2f__fio{stroke-dashoffset:0}
}

/* ===== 3 · Por que isso importa agora ===== */
/* Dobra de número: 635.706 e 1,15 milhão em peso 800, contador que sobe na entrada (script local) e as barras em escala real. */
.b3__head{max-width:28em}
.b3__data{display:grid;gap:var(--space-32);margin-top:var(--space-48)}
.n__v{font-family:var(--font-display);font-weight:800;font-size:clamp(48px,13vw,56px);line-height:.95;letter-spacing:-.04em;color:var(--heading);font-variant-numeric:tabular-nums;white-space:nowrap}
.n--b .n__v{color:var(--gold)}
.n__r{margin-top:var(--space-8);font-size:var(--fs-body);line-height:1.4;color:var(--text-muted)}
.bars{display:grid;gap:var(--space-8)}
.bars span{display:block;height:var(--space-12);border-radius:var(--radius-pill);transform-origin:0 50%}
.bars__a{width:55.3%;background:var(--line-strong)}
.bars__b{width:100%;background:var(--gold)}
.js .b3__data.rv .bars span{transform:scaleX(0);transition:transform 1.4s var(--ease) .3s}
.js .b3__data.rv.in .bars span{transform:none}
.b3__src{font-family:var(--font-mono);font-size:var(--fs-label);font-weight:500;line-height:1.35;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted)}
.b3__txt{display:grid;gap:var(--space-24);max-width:34em;margin:var(--space-64) auto 0;text-align:center}
.b3__lead{font-family:var(--font-display);font-weight:700;font-size:var(--fs-sm);line-height:1.12;letter-spacing:-.02em;color:var(--heading);text-wrap:balance}
.b3__cmp{color:var(--text-muted);text-wrap:pretty}
.b3__vir{margin-top:var(--space-16);padding-top:var(--space-32);background:linear-gradient(var(--gold),var(--gold)) 50% 0/var(--space-64) 2px no-repeat;color:var(--text-muted)}
.b3__dec{display:block;margin-top:var(--space-8);font-family:var(--font-display);font-weight:700;font-size:clamp(27px,7.4vw,30px);line-height:1.05;letter-spacing:-.02em;color:var(--heading);text-wrap:balance}
.b3__dec .hl{color:var(--gold)}
@media (min-width:1024px){
.b3__data{grid-template-columns:4fr 8fr;column-gap:var(--space-48);align-items:end;margin-top:var(--space-64)}
.n--a .n__v{font-size:var(--fs-xl)}
.n--b .n__v{font-size:var(--fs-numeral)}
.bars,.b3__src{grid-column:1/-1}
.b3__txt{max-width:40em;margin-top:var(--space-96)}
.b3__lead{font-size:30px}
.b3__dec{font-size:var(--fs-h2)}
}

/* ===== 4 · Eu também comecei pelo lugar errado ===== */
/* O R$17 mil do título vira o número da dobra; a história em 3 passos num fio; a frase central em display grande. */
.b4{padding:0;overflow:clip}
.b4__grid{display:grid}
.b4__fig{aspect-ratio:4/3;overflow:hidden}
.b4__fig img{width:100%;height:100%;object-fit:cover;object-position:62% 22%}
.b4__body{padding-block:var(--space-48) var(--space-64)}
.b4__h{margin-bottom:var(--space-32)}
.b4__num{display:block;margin-block:var(--space-4) var(--space-8);font-weight:800;font-size:clamp(48px,14vw,56px);line-height:.9;letter-spacing:-.045em;font-variant-numeric:tabular-nums}
.b4__hist{position:relative;display:grid;gap:var(--space-16);padding-left:var(--space-24)}
.b4__hist::before{content:"";position:absolute;left:3.5px;top:.7em;bottom:.7em;width:1px;background:var(--line-strong)}
.b4__hist li{position:relative;line-height:1.5;color:var(--text-muted)}
.b4__hist li::before{content:"";position:absolute;left:calc(-1 * var(--space-24));top:.62em;width:var(--space-8);height:var(--space-8);border-radius:var(--radius-pill);background:var(--line-strong)}
.b4__hist li:last-child::before{background:var(--gold)}
.b4__frase{margin-top:var(--space-48);padding-top:var(--space-24);background:linear-gradient(var(--gold),var(--gold)) 0 0/var(--space-64) 2px no-repeat;font-family:var(--font-display);font-weight:700;font-size:clamp(27px,7.4vw,30px);line-height:1.08;letter-spacing:-.025em;color:var(--heading);text-wrap:balance}
.b4__ruido{margin-top:var(--space-16);font-family:var(--font-display);font-weight:600;font-size:21px;line-height:1.2;letter-spacing:-.015em;color:var(--gold)}
.b4__cta{margin-top:var(--space-48)}
.b4__cta .ime-btn{width:100%}
@media (min-width:1024px){
.b4__grid{grid-template-columns:4fr 8fr;align-items:stretch}
.b4__fig{aspect-ratio:auto;min-height:100%;border-radius:0 var(--radius-lg) var(--radius-lg) 0}
.b4__body{max-width:none;margin:0;padding:var(--space-96) var(--space-64)}
.b4__body .ime-headline{text-wrap:pretty}
.b4__hist{max-width:40em}
.b4__num{font-size:var(--fs-numeral)}
.b4__frase{font-size:var(--fs-h2)}
.b4__ruido{font-size:var(--fs-sm)}
.b4__cta .ime-btn{width:auto}
}

/* ===== 5 · Para quem é ===== */
/* Lista curta à esquerda; à direita (ou embaixo, com muito ar) o campo de pontos com poucos dourados e a frase da dobra. */
.b5__head{max-width:22em;margin-inline:auto}
.b5__grid{display:grid;gap:var(--space-96);margin-top:var(--space-48)}
.lst{margin-top:var(--space-16);border-bottom:1px solid var(--line)}
.lst li{position:relative;padding:var(--space-12) 0 var(--space-12) var(--space-32);border-top:1px solid var(--line);line-height:1.45}
.lst li::before{content:"";position:absolute;left:0;top:calc(var(--space-12) + .6em);width:var(--space-8);height:var(--space-8);border-radius:var(--radius-pill);background:var(--gold)}
.b5__not{margin-top:var(--space-24);font-size:var(--fs-small);font-style:italic;line-height:1.5;color:var(--text-muted)}
.b5__fim{text-align:center}
.poucos svg{display:block;width:min(100%,300px);height:auto;margin:0 auto}
.poucos svg pattern circle{fill:var(--line-strong)}
.poucos__o{fill:var(--gold);transform-box:fill-box;transform-origin:center}
.js .b5__fim.rv .poucos__o{transform:scale(0);transition:transform .6s var(--ease) calc(.4s + var(--i,0) * 160ms)}
.js .b5__fim.rv.in .poucos__o{transform:none}
.maioria{margin-top:var(--space-32);font-family:var(--font-display);font-weight:700;font-size:clamp(27px,7.4vw,30px);line-height:1.05;letter-spacing:-.03em;color:var(--heading);text-wrap:balance}
.maioria strong{font-weight:inherit}
@media (min-width:1024px){
.b5__grid{grid-template-columns:7fr 5fr;column-gap:var(--space-96);align-items:center;margin-top:var(--space-64)}
.poucos svg{width:100%;max-width:380px}
.maioria{font-size:var(--fs-h2)}
}

/* ===== 6 · O que você leva das 4 horas ===== */
/* Elemento dominante: as duas decisões com o numeral dourado. Depois o PEL compacto (P, E e L no mesmo peso), os 3 pares em painel discreto e a lista curta da manhã. */
.b6__head{max-width:30em}
.dec{display:grid;gap:var(--space-32);max-width:40em;margin:var(--space-48) auto 0}
.dec li{display:grid;grid-template-columns:auto 1fr;column-gap:var(--space-16);align-items:start}
.dec__n{font-family:var(--font-display);font-weight:800;font-size:48px;line-height:.78;letter-spacing:-.04em;color:var(--gold);font-variant-numeric:tabular-nums}
.dec p{font-family:var(--font-display);font-weight:700;font-size:var(--fs-sm);line-height:1.12;letter-spacing:-.02em;color:var(--heading);text-wrap:balance}
.b6__grid{display:grid;gap:var(--space-48);margin-top:var(--space-64)}
.pel__h{font-family:var(--font-display);font-weight:700;font-size:var(--fs-sm);line-height:1.1;letter-spacing:-.02em;color:var(--heading)}
.pel__sub{margin-top:var(--space-8);font-size:var(--fs-body);line-height:1.5;color:var(--text-muted);text-wrap:pretty}
.pel__lista{margin-top:var(--space-16);border-bottom:1px solid var(--line)}
.pel__lista li{display:grid;grid-template-columns:44px 1fr;align-items:start;column-gap:var(--space-16);padding-block:var(--space-12);border-top:1px solid var(--line)}
/* as três letras no mesmo peso e na mesma cor: o método inteiro aparece */
.pel__l{font-family:var(--font-display);font-weight:800;font-size:var(--fs-md);line-height:.9;letter-spacing:-.04em;text-align:center;color:var(--gold)}
.pel__t{display:grid;gap:2px;font-size:var(--fs-body);line-height:1.4;color:var(--text-muted)}
.pel__t strong{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-4) var(--space-12);font-family:var(--font-display);font-weight:600;font-size:20px;line-height:1.25;letter-spacing:-.015em;color:var(--heading)}
.pel__fecho{margin-top:var(--space-16);padding-left:var(--space-16);box-shadow:inset 2px 0 0 var(--gold);font-size:var(--fs-body);line-height:1.45;color:var(--text-muted)}
.pel__fecho p+p{margin-top:var(--space-8)}
.pel__fecho strong{color:var(--heading)}
.pares{padding:var(--space-4) var(--space-24) var(--space-8);border-radius:var(--radius-lg);background:var(--bg-inset);box-shadow:inset 0 0 0 1px var(--line)}
.pares__cab{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-8) var(--space-12);padding-block:var(--space-16) var(--space-12);font-family:var(--font-mono);font-size:var(--fs-label);font-weight:500;line-height:1.35;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.par{display:grid;gap:var(--space-4);padding-block:var(--space-12);border-top:1px solid var(--line)}
.par__de{font-size:var(--fs-data);line-height:1.45;color:var(--text-muted)}
.par__para{font-family:var(--font-display);font-weight:600;font-size:var(--fs-body);line-height:1.25;letter-spacing:-.01em;color:var(--heading);text-wrap:balance}
.seta{display:block;flex:none;width:var(--space-32);height:var(--space-16);color:var(--gold)}
.par .seta{transform:rotate(90deg);margin:2px 0 2px -8px}
.seta path{fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:60;stroke-dashoffset:0}
.js .pares.rv .par .seta path{stroke-dashoffset:60;transition:stroke-dashoffset 1s var(--ease) .3s}
.js .pares.rv.in .par .seta path{stroke-dashoffset:0}
.b6__comp{max-width:24em;margin:var(--space-64) auto 0;font-family:var(--font-display);font-weight:600;font-size:var(--fs-sm);line-height:1.15;letter-spacing:-.015em;color:var(--heading);text-align:center;text-wrap:balance}
.b6__comp .hl{color:var(--gold)}
.prog{max-width:46em;margin:var(--space-48) auto 0}
.prog__h{font-family:var(--font-display);font-weight:600;font-size:20px;line-height:1.2;letter-spacing:-.015em;color:var(--heading)}
@media (min-width:768px){
.pares__cab,.par{display:grid;grid-template-columns:1fr 40px 1.15fr;column-gap:var(--space-16);align-items:start}
.pares__cab .seta{width:40px;height:20px}
.par .seta{transform:none;margin:.3em 0 0;width:40px;height:20px}
.prog .lst{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--space-48)}
}
@media (min-width:1024px){
.dec{grid-template-columns:1fr 1fr;column-gap:var(--space-64);max-width:none;margin-top:var(--space-64)}
.dec__n{font-size:var(--fs-xl)}
.dec p{font-size:30px;line-height:1.1}
.b6__grid{grid-template-columns:5fr 7fr;column-gap:var(--space-64);align-items:start;margin-top:var(--space-96)}
.pel__lista li{grid-template-columns:48px 1fr;padding-block:var(--space-16)}
.pares{padding:var(--space-4) var(--space-32) var(--space-8)}
.par__para{font-size:var(--fs-lead)}
.b6__comp{margin-top:var(--space-96);font-weight:700;font-size:30px;line-height:1.12}
.prog__h{font-size:var(--fs-sm)}
}

/* ===== 7 · Como funciona (tema Papel) ===== */
/* Uma tela: "7 NOV" como número da dobra, a linha 8h → ~10h30 → 12h que se desenha com a rolagem e o Zoom.
   Celular: linha vertical com os três marcos empilhados. A partir de 768px: linha horizontal com os marcos nas pontas e no meio. */
.b7{text-align:center}
.b7__in{max-width:52rem}
.b7__sab{font-family:var(--font-mono);font-size:var(--fs-data);font-weight:500;line-height:1;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.b7__h{position:relative;display:inline-block;margin-top:var(--space-12);font-family:var(--font-display);font-weight:800;font-size:56px;line-height:.9;letter-spacing:-.04em;color:var(--heading);white-space:nowrap}
.tl{--tl-zero:scaleY(0);position:relative;display:grid;gap:var(--space-24);width:fit-content;max-width:100%;margin:var(--space-48) auto 0;padding-left:var(--space-32);text-align:left}
.tl::before,.tl::after{content:"";position:absolute;left:7px;top:.55em;bottom:.55em;width:2px;border-radius:var(--radius-pill)}
.tl::before{background:var(--line)}
.tl::after{background:var(--gold);transform-origin:50% 0}
.js .tl.rv::after{transform:var(--tl-zero);transition:transform 1.4s var(--ease) .35s}
.js .tl.rv.in::after{transform:none}
.tl li{position:relative;font-family:var(--font-display);font-size:20px;line-height:1.2;letter-spacing:-.015em;color:var(--heading);text-wrap:balance}
.tl li strong{font-weight:700}
.tl li::before{content:"";position:absolute;z-index:1;top:.15em;left:calc(-1 * var(--space-32));width:var(--space-16);height:var(--space-16);border-radius:var(--radius-pill);background:var(--gold);box-shadow:0 0 0 4px var(--bg)}
.tl li:nth-child(2)::before{background:var(--bg);box-shadow:inset 0 0 0 2px var(--gold),0 0 0 4px var(--bg)}
.b7__zoom{display:inline-flex;align-items:center;gap:var(--space-12);margin-top:var(--space-48);font-size:var(--fs-body);line-height:1.4;color:var(--text)}
.b7__zoom::before{content:"";flex:none;width:var(--space-24);height:2px;background:var(--gold)}
.b7__zoom strong{font-weight:600}
@media (min-width:768px){
/* os três marcos em uma linha cada; o do meio no centro exato da linha (laterais 1fr, nunca menores que o próprio rótulo) */
.tl{--tl-zero:scaleX(0);grid-template-columns:minmax(max-content,1fr) max-content minmax(max-content,1fr);gap:var(--space-16);width:auto;max-width:46rem;padding:var(--space-32) 0 0}
.tl li{white-space:nowrap}
.tl::before,.tl::after{top:7px;bottom:auto;left:var(--space-8);right:var(--space-8);width:auto;height:2px}
.tl::after{transform-origin:0 50%}
.tl li::before{top:calc(-1 * var(--space-32));left:0}
.tl li:nth-child(2){text-align:center}
.tl li:nth-child(2)::before{left:50%;margin-left:calc(-1 * var(--space-8))}
.tl li:last-child{text-align:right}
.tl li:last-child::before{left:auto;right:0}
}
@media (min-width:1024px){
.b7__h{font-size:var(--fs-numeral)}
.tl{gap:var(--space-24);max-width:50rem;margin-top:var(--space-64)}
.tl li{font-size:22px}
.b7__zoom{margin-top:var(--space-64)}
}

/* ===== 8 · Provas ===== */
/* Primeira visualização: 3 prints (no celular, faixa com rolagem lateral e o próximo aparecendo) e 2 vídeos lado a lado.
   O resto abre no "VER MAIS RELATOS" (script local), sem recarregar. */
.b8__head{max-width:30em}
@media (min-width:1024px){.b8__head{max-width:min(30em,86vw)}}
.relatos{display:grid;gap:var(--space-32);margin-top:var(--space-48)}
.gal{display:flex;align-items:flex-start;gap:var(--space-16);margin-inline:calc(-1 * var(--wrap-pad));padding:var(--space-8) var(--wrap-pad) var(--space-16);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--wrap-pad);scrollbar-width:none}
.gal::-webkit-scrollbar{display:none}
.print{position:relative;display:block;flex:0 0 78%;max-width:320px;margin:0;padding:var(--space-8);border:0;border-radius:var(--radius-md);background:var(--bg-raised);box-shadow:inset 0 0 0 1px var(--line);cursor:zoom-in;scroll-snap-align:start;break-inside:avoid;transition:transform var(--dur-micro) var(--ease),box-shadow var(--dur-micro) var(--ease)}
.print img{width:100%;border-radius:var(--radius-sm)}
.print--tilt{transform:rotate(-1.2deg)}
.print__zoom{position:absolute;right:var(--space-16);bottom:var(--space-16);display:grid;place-items:center;width:var(--space-32);height:var(--space-32);border-radius:var(--radius-pill);background:var(--bg);color:var(--gold);box-shadow:inset 0 0 0 1px var(--line-strong)}
.print__zoom svg{width:var(--space-16);height:var(--space-16);fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
@media (hover:hover){
.print:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px var(--gold)}
.print--tilt:hover{transform:rotate(-1.2deg) translateY(-2px)}
}
.vids{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-16)}
.vbox{position:relative;aspect-ratio:9/16;border-radius:var(--radius-lg);overflow:hidden;background:var(--bg-raised);box-shadow:inset 0 0 0 1px var(--line)}
.vids--duo .vbox{aspect-ratio:2/3}
.vids--duo .vid img{object-position:50% 36%}
.vids--duo .vbox--paisagem.is-playing{grid-column:1/-1;order:-1;aspect-ratio:16/9}
.vids--duo:has(> .vbox--paisagem.is-playing) > .vbox:not(.vbox--paisagem){grid-column:1/-1;justify-self:center;width:calc(50% - var(--space-8))}
/* Expandido: os dois horizontais empilhados e o vertical (último da lista) na altura dos dois */
.vids--h{grid-template-columns:minmax(0,1.48fr) minmax(0,1fr)}
.vids--h .vbox{grid-column:1;aspect-ratio:16/9}
.vids--h .vbox--retrato{grid-column:2;grid-row:1/span 2;aspect-ratio:auto}
.vid{position:relative;display:block;width:100%;height:100%;padding:0;border:0;background:none;cursor:pointer}
.vid img{width:100%;height:100%;object-fit:cover}
.vid__play{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:var(--radius-pill);background:var(--invert);color:var(--on-invert);box-shadow:var(--shadow-lift);transition:transform var(--dur-micro) var(--ease)}
.vid__play svg{width:var(--space-24);height:var(--space-24);margin-left:var(--space-4);fill:currentColor}
@media (hover:hover){.vid:hover .vid__play{transform:scale(1.08)}}
.vid__frame{position:absolute;inset:0;width:100%;height:100%;border:0}
.mais{display:grid;gap:var(--space-32);margin-top:var(--space-32)}
.js .mais{display:none}
.js .mais.is-open{display:grid;animation:ime-up var(--dur-reveal) var(--ease) both}
.b8__mais{display:grid;justify-items:center;margin-top:var(--space-32)}
html:not(.js) .b8__mais{display:none}
.b8__toggle{width:100%;max-width:460px;min-height:var(--tap)}
.b8__aviso{max-width:36em;margin:var(--space-32) auto 0;font-size:var(--fs-small);line-height:1.5;text-align:center;color:var(--text-muted)}
.lb{max-width:94vw;max-height:94svh;padding:0;border:0;background:transparent;overflow:visible}
.lb::backdrop{background:color-mix(in srgb,var(--bg) 90%,transparent)}
.lb img{width:min(90vw,640px);max-height:86svh;object-fit:contain;border-radius:var(--radius-md);background:var(--bg-raised)}
.lb__x{position:absolute;top:calc(-1 * var(--space-16));right:calc(-1 * var(--space-8));display:grid;place-items:center;width:var(--tap);height:var(--tap);border:0;border-radius:var(--radius-pill);background:var(--invert);color:var(--on-invert);cursor:pointer;box-shadow:var(--shadow-lift)}
.lb__x svg{width:var(--space-16);height:var(--space-16);stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
@media (min-width:768px){
.gal{display:block;columns:3;column-gap:var(--space-24);margin-inline:0;padding:0;overflow:visible}
.gal .print{width:100%;max-width:none;margin:0 0 var(--space-24)}
.vids{max-width:560px;margin-inline:auto;width:100%}
.vids--h{max-width:none}
.b8__toggle{width:auto}
}
@media (min-width:1024px){
.relatos{grid-template-columns:7fr 5fr;column-gap:var(--space-48);align-items:start;margin-top:var(--space-64)}
.relatos .gal{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-24);align-items:start;columns:auto}
.relatos .gal .print{margin:0}
.relatos .gal .print:nth-child(2){grid-row:span 2}
.relatos .vids{max-width:none;align-self:center}
/* computador: os três na mesma altura, lado a lado (16:9, 16:9 e 9:16) */
.vids--h{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,.3164fr)}
.vids--h .vbox,.vids--h .vbox--retrato{grid-column:auto;grid-row:auto}
}

/* ===== 9 · Ingresso (tema Papel) ===== */
/* A parte mais simples da página: título direto, um tíquete com o R$97 dominante, 3 itens, o botão e a frase do lote. */
.b9__abre{max-width:64rem}
.b9__ticket{width:100%;max-width:440px;margin:var(--space-48) auto 0}
.ime-ticket{display:flex;flex-direction:column;align-items:center;gap:var(--space-24);padding:var(--space-32) var(--space-24);border-radius:var(--radius-lg);font-family:var(--font-text);text-align:center}
.ime-ticket.ime-invert{box-shadow:var(--shadow-lift)}
.ime-ticket__with{font-family:var(--font-mono);font-size:13px;font-weight:500;line-height:1.3;letter-spacing:.02em;color:color-mix(in srgb,var(--on-invert) 72%,var(--invert))}
.ime-ticket__with s{text-decoration-thickness:1.5px}
.ime-ticket__price{margin-top:calc(-1 * var(--space-8));font-family:var(--font-display);font-size:56px;font-weight:800;line-height:.9;letter-spacing:-.05em;color:var(--on-invert);font-variant-numeric:tabular-nums}
.ime-ticket__price sup{position:relative;top:.22em;margin-right:.06em;font-size:.34em;font-weight:700;letter-spacing:0;vertical-align:top}
.ime-ticket__list{display:grid;gap:var(--space-8);padding-block:var(--space-16);border-block:1px solid color-mix(in srgb,var(--on-invert-gold) 60%,transparent);font-size:var(--fs-body);line-height:1.4;text-align:left}
.ime-ticket__list li{display:grid;grid-template-columns:var(--space-24) 1fr}
.ime-ticket__list li::before{content:"";width:var(--space-8);height:var(--space-8);margin-top:.55em;border-radius:var(--radius-pill);background:var(--on-invert-gold)}
.ime-ticket .ime-btn{width:100%}
.ime-ticket__lote{font-size:var(--fs-body);line-height:1.4}
.ime-ticket__note{margin-top:calc(-1 * var(--space-12));font-size:var(--fs-small)}
.ime-ticket__note .pend{color:var(--on-invert-gold)}
@media (min-width:1024px){
.b9__ticket{max-width:480px;margin-top:var(--space-64);padding:var(--space-48) var(--space-48) var(--space-32)}
.ime-ticket__price{font-size:var(--fs-numeral)}
}

/* ===== 10 · Quem conduz ===== */
/* Autoridade em dados: retrato P&B, "4 meses" como o número da dobra e as credenciais numa tabela de fios. */
.b10__abre{max-width:64rem}
.b10__h{max-width:20em;margin-inline:auto}
.b10__grid{display:grid;gap:var(--space-48);margin-top:var(--space-48)}
.b10__media{position:relative;margin-inline:calc(-1 * var(--wrap-pad))}
.b10__main{aspect-ratio:4/3;overflow:hidden;background:var(--bg-raised)}
.b10__main img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.b10__tv{display:none}
.b10__big{display:grid;gap:var(--space-8)}
.b10__big strong{font-family:var(--font-display);font-weight:800;font-size:clamp(48px,14.4vw,56px);line-height:.85;letter-spacing:-.05em;color:var(--gold);font-variant-numeric:tabular-nums}
.b10__big span{font-size:var(--fs-lead);line-height:1.3;color:var(--text-muted)}
.stats{margin-top:var(--space-32);border-bottom:1px solid var(--line)}
.stats li{padding-block:var(--space-12);border-top:1px solid var(--line);font-size:var(--fs-body);line-height:1.4;color:var(--text-muted)}
.stats__2l span{display:block}.stats strong{font-family:var(--font-display);font-weight:700;font-size:22px;line-height:1.1;letter-spacing:-.02em;color:var(--heading)}
@media (min-width:1024px){
.b10__grid{grid-template-columns:5fr 7fr;column-gap:var(--space-96);align-items:center;margin-top:var(--space-64)}
.b10__media{margin:0}
.b10__main{aspect-ratio:3/4;border-radius:var(--radius-lg)}
.b10__tv{display:block;position:absolute;right:calc(-1 * var(--space-48));bottom:calc(-1 * var(--space-48));width:44%;border-radius:var(--radius-md);overflow:hidden;transform:rotate(2deg);box-shadow:0 0 0 6px var(--bg),var(--shadow-lift)}
.stats{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--space-48)}
.stats li{padding-block:var(--space-16)}
.stats strong{font-size:var(--fs-sm)}
.b10__big strong{font-size:var(--fs-numeral)}
}

/* ===== 11 · Garantia ===== */
/* Selo 100% desenhado rompendo o topo da laje creme; uma frase e só. */
.b11__h{max-width:none;margin-bottom:var(--space-96)}
.slab{position:relative;display:grid;gap:var(--space-24);padding:0 var(--space-24) var(--space-32);border-radius:var(--radius-lg);box-shadow:var(--shadow-lift);text-align:center}
.slab__fig{justify-self:center;width:min(60%,220px);margin-top:calc(-1 * var(--space-64));transform:rotate(-2deg)}
.selo svg{display:block;width:100%;height:auto;filter:drop-shadow(0 12px 24px rgba(4,12,26,.28))}
.selo__disco{fill:var(--bg)}
.selo__fio{fill:none;stroke:var(--gold);stroke-width:1.5}
.selo__anel{font-family:var(--font-mono);font-size:19px;font-weight:500;letter-spacing:.08em;fill:var(--gold)}
.selo__ponto{fill:var(--gold)}
.selo__n{font-family:var(--font-display);font-weight:800;font-size:84px;letter-spacing:-.04em;fill:var(--invert)}
.selo__rot{font-family:var(--font-mono);font-size:14px;font-weight:500;letter-spacing:.16em;fill:var(--gold)}
.slab__body .stmt{margin-top:0;color:var(--on-invert);text-wrap:balance}
.slab__hl{color:var(--on-invert-gold)}
@media (min-width:1024px){
.b11__h{margin-bottom:calc(var(--space-128) + var(--space-32));text-wrap:pretty}
.slab{grid-template-columns:5fr 7fr;column-gap:var(--space-64);align-items:end;padding:0 var(--space-64) 0 var(--space-32);text-align:left}
.slab__fig{align-self:start;width:100%;max-width:340px;margin-top:calc(-1 * var(--space-128));margin-bottom:var(--space-48)}
.slab__body{padding-block:var(--space-64)}
.slab__body .stmt{font-weight:700;font-size:var(--fs-md);line-height:1.08;letter-spacing:-.02em}
}

/* ===== 12 · Perguntas frequentes ===== */
.b12__grid {
  display: grid;
  gap: var(--space-48);
}
.b12__fig {
  display: none;
}
.faq {
  border-bottom: 1px solid var(--line);
}
.faq details {
  border-top: 1px solid var(--line);
}
.faq summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-16);
  min-height: var(--tap);
  padding-block: var(--space-24);
  cursor: pointer;
  list-style: none;
}
.faq summary::-webkit-details-marker {
  display: none;
}
.faq summary h2 {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: var(--fs-sm);
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: var(--heading);
}
.faq__ico {
  position: relative;
  flex: none;
  width: var(--space-32);
  height: var(--space-32);
  border-radius: var(--radius-pill);
  box-shadow: inset 0 0 0 1px var(--line-strong);
  transition:
    transform var(--dur-micro) var(--ease),
    box-shadow var(--dur-micro) ease;
}
.faq__ico::before,
.faq__ico::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: var(--space-12);
  height: 2px;
  margin: -1px 0 0 calc(-1 * var(--space-12) / 2);
  background: var(--gold);
}
.faq__ico::after {
  transform: rotate(90deg);
}
.faq details[open] .faq__ico {
  transform: rotate(45deg);
  box-shadow: inset 0 0 0 1px var(--gold);
}
@media (hover: hover) {
  .faq summary:hover .faq__ico {
    box-shadow: inset 0 0 0 1px var(--gold);
  }
}
.faq__a {
  padding-bottom: var(--space-24);
  color: var(--text-muted);
}
.faq__a p {
  max-width: var(--measure);
}
.faq__a p + p {
  margin-top: var(--space-12);
}
.faq__a a {
  color: var(--heading);
  text-underline-offset: 0.2em;
  text-decoration-color: var(--gold);
}
@media (min-width: 1024px) {
  .b12__grid {
    grid-template-columns: 4fr 8fr;
    column-gap: var(--space-64);
    align-items: start;
  }
  .b12__fig {
    display: block;
    position: sticky;
    top: calc(var(--bar-h) + var(--space-32));
    width: 100%;
    max-width: 240px;
    justify-self: center;
  }
  /* Interrogação desenhada pelo fio dourado, com o ponto como base: fica parada ao lado das perguntas */
  .interrog svg {
    display: block;
    width: 100%;
    height: auto;
  }
  .interrog__fio {
    fill: none;
    stroke: var(--gold);
    stroke-width: 3;
    stroke-linecap: round;
  }
  .js .interrog.rv .interrog__fio {
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    transition: stroke-dashoffset 1.6s var(--ease) 0.2s;
  }
  .js .interrog.rv.in .interrog__fio {
    stroke-dashoffset: 0;
  }
  .interrog__ponto {
    fill: var(--gold);
  }
}

/* ===== 13 · CTA final ===== */
.b13{padding:0;overflow:clip;background:radial-gradient(90% 60% at 100% 100%,var(--bg-raised) 0%,transparent 60%),var(--bg-inset)}
.b13__grid{display:grid}
.b13__fig{height:280px;overflow:hidden}
.b13__fig img{width:100%;height:100%;object-fit:cover;object-position:46% 8%}
.b13__body{padding-block:var(--space-48) var(--space-64)}
.b13__body .ime-headline{margin-bottom:var(--space-24)}
@media (min-width:520px){.b13__h .hl{display:block}}
.b13__cena,.b13__ate{max-width:34em;color:var(--text-muted)}
.b13__ate{margin-top:var(--space-16)}
/* eco da promessa: duas linhas em display, a segunda em dourado, abertas pelo fio */
.b13__eco{margin-top:var(--space-32);padding-top:var(--space-24);background:linear-gradient(var(--gold),var(--gold)) 0 0/var(--space-64) 2px no-repeat;font-family:var(--font-display);font-weight:700;font-size:var(--fs-sm);line-height:1.12;letter-spacing:-.02em;color:var(--heading);text-wrap:balance}
.b13__eco span{display:block;color:var(--gold)}
.b13__cta{display:grid;justify-items:start;gap:var(--space-12);margin-top:var(--space-32)}
.b13__cta .ime-btn{width:100%;margin-top:var(--space-4)}
.b13__gar{display:flex;align-items:baseline;gap:var(--space-12);font-size:var(--fs-small);font-weight:500;line-height:1.45;color:var(--heading)}
.b13__gar::before{content:"";flex:none;width:var(--space-24);height:1px;transform:translateY(-.3em);background:var(--gold)}
.b13__fim{margin-top:var(--space-32);font-family:var(--font-display);font-size:var(--fs-sm);line-height:1.15;color:var(--text-muted)}
@media (min-width:1024px){
.b13__grid{grid-template-columns:8fr 4fr;align-items:stretch}
.b13__fig{order:2;height:auto;min-height:100%;border-radius:var(--radius-lg) 0 0 var(--radius-lg)}
.b13__body{padding:var(--space-128) var(--space-64) var(--space-128) max(var(--space-32),calc((100vw - var(--col)) / 2))}
.b13__eco{font-size:30px;line-height:1.1}
.b13__cta .ime-btn{width:auto}
}

/* ===== 14 · Rodapé ===== */
/* Só o que a especificação lista, em texto atenuado (5,55:1 sobre o navy) */
.foot{--foot-ink:color-mix(in srgb,var(--text-muted) 70%,var(--bg));padding:var(--space-48) 0 calc(var(--space-48) + env(safe-area-inset-bottom));background:var(--bg);text-align:center;box-shadow:inset 0 1px 0 var(--line)}
.foot p{font-size:13px;line-height:1.6;color:var(--foot-ink)}
.foot p+p{margin-top:var(--space-8)}
.foot strong{font-weight:500;color:inherit}
.foot a{color:inherit;text-underline-offset:.2em;text-decoration-color:var(--line-strong);transition:color var(--dur-micro) var(--ease)}
.foot__prefs{display:inline-block;min-height:24px;padding:0;border:0;background:none;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:.2em;text-decoration-color:var(--line-strong);cursor:pointer;transition:color var(--dur-micro) var(--ease)}
@media (hover:hover){.foot a:hover,.foot__prefs:hover{color:var(--text-muted)}}
/* Assinatura de rolagem: a linha 8h→12h se desenha com a rolagem e a foto da TV sobe sobre o retrato */
@keyframes ime-draw{from{transform:var(--tl-zero)}to{transform:none}}
@keyframes ime-float{from{transform:translateY(var(--space-48)) rotate(2deg)}to{transform:translateY(calc(-1 * var(--space-24))) rotate(2deg)}}
@supports (animation-timeline: view()){
@media (prefers-reduced-motion:no-preference){
.js .tl.rv::after{transition:none;transform:none;animation:ime-draw linear both;animation-timeline:view();animation-range:entry 30% cover 50%}
.b10__tv{animation:ime-float linear both;animation-timeline:view();animation-range:entry 0% exit 40%}
}
}
@media (prefers-reduced-motion:reduce){
*,*::before,*::after{animation:none !important;transition:none !important}
.js .rv{opacity:1;transform:none}
.js .tl.rv::after,.js .b3__data.rv .bars span,.js .b5__fim.rv .poucos__o,.js .b2__cmp.rv .cmp__lado--b::before{transform:none}
.js .pares.rv .par .seta path,.js .interrog.rv .interrog__fio,.js .b2__cmp.rv .b2f__fio{stroke-dashoffset:0}
}