/* ============================================================
   Dr. César Torre, LP2 "Prótese"
   Identidade DRCT-PROTESE (registo em _contexto/identidades-visuais.json):
   clássica e clara, verde profundo sobre creme quente, terracota
   como acento, Source Serif 4, texto grande. Público 65+.

   Para este público: nada aparece só depois de uma animação.
   O texto está sempre visível; só os desenhos é que mexem, devagar.
   Corpo nunca abaixo de 19px, botões nunca abaixo de 60px de altura.

   ESQUELETO SÓ DESTA PÁGINA (13/10/2026, segunda volta). Letra
   muito grande e desenhos grandes, como a LP1, mas com formas só
   dela: a moldura de quadro (vídeo e fotografias), o selo que roda, a palavra riscada no título, o 6 gigante, a régua
   15 / 10 / Hoje e o telefone a toda a largura. Não é o esqueleto
   das landings da clínica, nem o do Dr. David, nem o da LP1.
   A primeira volta (caderno de coluna única) foi recusada pelo
   Nicolas e está em historico/2026-10-13-caderno/.
   ============================================================ */

:root{
  --creme:#F7F2E8;
  --creme-2:#EFE8D9;
  --branco:#FFFCF7;
  --verde:#25382E;
  --verde-2:#2F4739;
  --tinta:#1E2A22;
  --suave:#5A6A5F;
  --terra:#A8503C;
  --terra-clara:#C7715C;
  --linha:rgba(30,42,34,.16);
  --linha-forte:rgba(30,42,34,.34);
  --linha-clara:rgba(247,242,232,.2);
  --r:6px;
  --max:1140px;
  --serif:'Source Serif 4',Georgia,serif;
  /* Uma família só, como está no registo. O corpo também é Source Serif 4,
     no corte ótico de texto, um ponto acima para compensar a serifa. */
  --body:'Source Serif 4',Georgia,serif;
  --saida:cubic-bezier(.2,.8,.2,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:20px}
body{
  background:var(--creme);color:var(--tinta);
  font-family:var(--body);font-size:20px;line-height:1.62;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img,svg,video{display:block;max-width:100%}
a{color:inherit}
ul,ol{list-style:none}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
:focus-visible{outline:3px solid var(--terra);outline-offset:3px}


.dentro{width:100%;max-width:1200px;margin:0 auto;padding:0 22px}
h1,h2,h3{font-family:var(--serif);font-weight:600;letter-spacing:-.022em;line-height:1.04;text-wrap:balance}
h1{font-size:clamp(50px,14.4vw,176px);letter-spacing:-.035em;line-height:.94}
h2{font-size:clamp(38px,9.4vw,96px);letter-spacing:-.03em;line-height:1;max-width:14ch}
h3{font-size:24px;line-height:1.2;letter-spacing:-.01em}
h1 em,h2 em{font-style:italic;font-weight:400;color:var(--terra)}
.escura h2 em{color:var(--terra-clara)}
p{text-wrap:pretty}
.entrada{font-size:22px;line-height:1.5;color:var(--suave);max-width:40ch;margin-top:22px}
.escura{background:var(--verde);color:var(--creme)}
.escura .entrada,.escura p{color:rgba(247,242,232,.84)}

/* ---------- Botões: rectos e altos ---------- */
.botao{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  font-family:var(--body);font-weight:600;font-size:19px;
  min-height:64px;padding:18px 30px;border-radius:4px;text-decoration:none;text-align:center;
  transition:background .2s,color .2s,border-color .2s,transform .2s var(--saida);
}
.botao svg{width:24px;height:24px;flex:none}
.botao--verde{background:var(--verde);color:#fff}
.botao--verde:hover{background:var(--terra)}
.botao--terra{background:var(--terra);color:#fff}
.botao--terra:hover{background:var(--terra-clara)}
.botao--fio{border:2px solid var(--tinta);color:var(--tinta)}
.botao--fio:hover{background:var(--tinta);color:var(--creme)}
.botao--fio-claro{border:2px solid var(--linha-clara);color:var(--creme)}
.botao--fio-claro:hover{background:var(--creme);color:var(--verde)}
.botao:active{transform:scale(.985)}
.accoes{display:grid;gap:12px;margin-top:28px}
.seta{width:20px;height:20px}


.botao--creme{background:var(--creme);color:var(--verde)}
.botao--creme:hover{background:var(--terra-clara);color:#fff}

/* ---------- Abertura ---------- */
.abre{padding:18px 22px 70px;text-align:center;overflow:hidden}
.abre__casa{display:flex;justify-content:space-between;align-items:baseline;gap:14px;max-width:1200px;margin:0 auto;font-size:17px;color:var(--suave);text-align:left}
.abre__casa a{font-weight:600;color:var(--tinta);text-decoration:none;border-bottom:2px solid var(--terra);white-space:nowrap}
.abre__tema{margin-top:46px;font-style:italic;font-size:22px;color:var(--terra)}
.abre h1{margin-top:14px}
.abre h1 .quebra{display:block}
/* a palavra que deixa de ser sentença: um risco que se desenha por cima */
.risca{position:relative;white-space:nowrap}
.risca::after{
  content:"";position:absolute;left:-3%;right:-3%;top:56%;height:.075em;border-radius:1em;background:var(--terra);
  transform:scaleX(0) rotate(-2.5deg);transform-origin:0 50%;
}
.vivo .risca::after,.tudo .risca::after,html:not(.js) .risca::after{animation:risca 1.1s .5s var(--saida) forwards}
@keyframes risca{to{transform:scaleX(1) rotate(-2.5deg)}}

.palco{position:relative;display:grid;gap:22px;justify-items:center;margin-top:40px}
.margem{font-family:var(--serif);font-style:italic;font-size:23px;line-height:1.36;max-width:26ch;color:var(--suave)}
.margem b{font-style:normal;font-weight:600;color:var(--tinta)}
.margem--e{order:2}
.margem--d{order:3}

/* o vídeo numa moldura de quadro. Arcos NÃO: o Nicolas recusou-os a 13/10/2026 */
.filme{position:relative;width:100%;max-width:340px}
.filme__ecra{
  position:relative;aspect-ratio:9/16;border-radius:3px;overflow:hidden;background:var(--verde);
  box-shadow:0 0 0 1px var(--linha-forte),0 0 0 10px var(--branco),0 0 0 11px var(--linha-forte);
}
.filme video,.filme__capa{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.filme__capa{object-position:50% 20%;transition:opacity .35s}
.filme__sombra{position:absolute;inset:0;background:linear-gradient(180deg,rgba(37,56,46,.05) 35%,rgba(30,42,34,.82));transition:opacity .35s;pointer-events:none}
.filme__play{
  position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);width:86%;
  display:flex;flex-direction:column;align-items:center;gap:16px;color:#fff;
  font-family:var(--body);font-weight:600;font-size:21px;text-align:center;
}
.filme__disco{position:relative;width:100px;height:100px;border-radius:50%;background:var(--creme);color:var(--verde);display:flex;align-items:center;justify-content:center;transition:transform .25s var(--saida)}
.filme__disco svg{width:38px;height:38px;margin-left:5px}
.filme__disco::before{content:"";position:absolute;inset:-9px;border-radius:50%;border:2px solid rgba(247,242,232,.7);animation:respira 2.8s ease-in-out infinite}
@keyframes respira{0%,100%{transform:scale(1);opacity:.9}50%{transform:scale(1.1);opacity:.35}}
.filme__play:hover .filme__disco{transform:scale(1.05)}
.filme__play small{display:block;font-weight:500;font-size:16px;opacity:.86;margin-top:2px}
.filme__rotulo{position:absolute;left:18px;right:18px;bottom:18px;color:#fff;pointer-events:none;font-family:var(--serif);font-weight:600;font-size:25px;line-height:1.14;transition:opacity .35s}
.filme__rotulo span{display:block;font-family:var(--body);font-weight:500;font-size:15px;opacity:.82;margin-bottom:6px}
.filme--toca .filme__capa,.filme--toca .filme__sombra,.filme--toca .filme__play,.filme--toca .filme__rotulo{opacity:0;pointer-events:none}
.filme__aviso{display:none;position:absolute;top:14px;left:14px;font-size:14px;font-weight:600;background:var(--creme);color:var(--verde);padding:6px 12px;border-radius:3px}
.filme--espera .filme__aviso{display:block}
.filme--espera .filme__play{opacity:.5;pointer-events:none}
.filme--espera .filme__disco::before{animation:none;opacity:0}

.filme__play{top:50%}
.selo{position:absolute;right:-26px;bottom:-30px;width:124px;height:124px;pointer-events:none}
.selo circle{fill:var(--terra)}
.selo text{font-family:var(--serif);font-weight:600;font-size:17px;fill:var(--creme);letter-spacing:.04em}
.selo__gira{transform-origin:100px 100px;animation:gira 26s linear infinite}
.selo__seta{fill:none;stroke:var(--creme);stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
@keyframes gira{to{transform:rotate(360deg)}}

.abre__accoes{display:grid;gap:12px;max-width:440px;margin:54px auto 0}
.abre__locais{margin:18px auto 0;font-size:17px;color:var(--suave);max-width:44ch}

/* ---------- Desenhos (medalhão de traço fino) ---------- */
.il{flex:none;width:76px;height:76px;border-radius:50%;background:var(--branco);border:1.5px solid var(--linha-forte);display:flex;align-items:center;justify-content:center;color:var(--verde)}
.il svg{width:52px;height:52px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.il svg *{transform-box:fill-box;transform-origin:center;animation-delay:var(--d,0s)}
.il .terra{stroke:var(--terra)}
.il .terra-cheio{fill:var(--terra);stroke:none}
.il .suave{fill:rgba(168,80,60,.16);stroke:var(--terra)}
.il .cheio{fill:currentColor;stroke:none}
.il .fino{stroke-width:1.3;opacity:.55}
.escura .il{background:transparent;border-color:var(--linha-clara);color:var(--creme);width:52px;height:52px}
.escura .il svg{width:30px;height:30px}
.escura .il .terra{stroke:var(--terra-clara)}

.vivo .visto{stroke-dasharray:1;animation:il-visto 6s ease-out infinite}
.vivo .eco{animation:il-eco 3.4s ease-out infinite}
.vivo .bate{animation:il-bate 2.6s ease-in-out infinite}
.vivo .pisca{animation:il-pisca 3s ease-in-out infinite}
.vivo .sobe{animation:il-sobe 3s ease-in-out infinite}
.vivo .nasce{animation:il-nasce 5s ease-in-out infinite}
.vivo .balanca-se{transform-origin:50% 0;animation:il-balanca 3.2s ease-in-out infinite}
.vivo .anda{animation:il-anda 2.6s ease-in-out infinite}
.vivo .pegada{animation:il-pegada 3.6s ease-in-out infinite}
.vivo .deriva{animation:il-deriva 5s ease-in-out infinite}
.vivo .empurra{animation:il-empurra 3.4s ease-in-out infinite}
.vivo .flecte{transform-origin:0 0;animation:il-flecte 3.4s ease-in-out infinite}
.vivo .risca{stroke-dasharray:1;animation:il-visto 5s ease-out infinite}

@keyframes il-visto{0%{stroke-dashoffset:1}16%,90%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes il-eco{0%,10%{transform:scale(.5);opacity:0}25%{opacity:.8}90%,100%{transform:scale(1.8);opacity:0}}
@keyframes il-bate{0%,100%{transform:scale(1)}30%{transform:scale(1.1)}60%{transform:scale(1)}}
@keyframes il-pisca{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes il-sobe{0%,100%{transform:translateY(2px)}50%{transform:translateY(-3px)}}
@keyframes il-nasce{0%,100%{transform:translateY(7px);opacity:.3}40%,70%{transform:translateY(0);opacity:1}}
@keyframes il-balanca{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}
@keyframes il-anda{0%,100%{transform:translateX(-2.5px)}50%{transform:translateX(2.5px)}}
@keyframes il-pegada{0%,12%{opacity:.22;transform:scale(.8)}25%,75%{opacity:1;transform:scale(1)}90%,100%{opacity:.22}}
@keyframes il-deriva{0%,100%{transform:translate(0,0)}35%{transform:translate(3px,-2px)}70%{transform:translate(-2px,2px)}}
@keyframes il-empurra{0%,20%,100%{transform:translate(0,0)}50%,70%{transform:translate(4px,4px)}}
@keyframes il-flecte{0%,100%{transform:rotate(0)}50%{transform:rotate(-24deg)}}


/* ---------- Quando: quatro momentos do dia, fotografia e desenho ---------- */
.quando{padding:80px 0 90px;background:var(--creme-2);border-block:1px solid var(--linha)}
.momentos{display:grid;grid-template-columns:1fr 1fr;gap:34px 14px;max-width:1200px;margin:44px auto 0;padding:0 22px}
.momentos li{position:relative;display:flex;flex-direction:column}
.momentos__foto{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;background:var(--creme);border:6px solid var(--branco);outline:1px solid var(--linha-forte);border-radius:3px}
/* o desenho animado pousa no canto da fotografia */
.momentos .il{width:72px;height:72px;margin:-40px 0 10px 12px;position:relative;background:var(--branco);border:1.5px solid var(--linha-forte)}
.momentos .il svg{width:48px;height:48px}
.momentos h3{font-size:23px}
.momentos p{font-size:17px;line-height:1.4;color:var(--suave);margin-top:4px}
.estampa{display:grid;grid-template-columns:104px 1fr;gap:22px;align-items:center;margin-top:54px}
.estampa img{aspect-ratio:2/3;object-fit:cover;width:100%;height:auto;background:#000;border-radius:3px;border:6px solid var(--branco);outline:1px solid var(--linha-forte)}
.estampa figcaption{font-family:var(--serif);font-size:clamp(25px,6vw,54px);line-height:1.1;letter-spacing:-.02em;max-width:18ch}
.estampa figcaption em{font-style:italic;color:var(--terra)}

/* ---------- Seis perguntas ---------- */
.seis{position:relative;padding:90px 0 96px;overflow:hidden}
.seis__num{
  position:absolute;right:-.04em;top:-.2em;font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:min(92vw,720px);line-height:1;color:var(--verde-2);pointer-events:none;user-select:none;
}
.escura p.seis__num{color:var(--verde-2)}
.seis .dentro{position:relative;isolation:isolate}
.seis__num{z-index:-1}
.antes{margin-top:44px;border-top:1px solid var(--linha-clara);counter-reset:a}
.antes li{display:grid;grid-template-columns:auto 1fr 40px;gap:4px 16px;align-items:center;padding:22px 0;border-bottom:1px solid var(--linha-clara);counter-increment:a}
.antes .il{display:none}
.antes li::before{
  content:counter(a);grid-row:1 / span 2;font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:64px;line-height:.9;color:var(--terra-clara);min-width:.9em;
}
.antes h3{grid-column:2;align-self:end;font-size:clamp(24px,5.6vw,34px);line-height:1.1;letter-spacing:-.018em}
.antes p{grid-column:2;font-size:18px;align-self:start}
.antes .caixa{grid-row:1 / span 2;grid-column:3;width:40px;height:40px}
.antes .caixa rect{fill:none;stroke:var(--creme);stroke-width:1.8}
.antes .caixa path{fill:none;stroke:var(--terra-clara);stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.antes.vivo .caixa path{animation:marca 9s ease-out infinite;animation-delay:var(--d,0s)}
@keyframes marca{0%{stroke-dashoffset:1}7%,86%{stroke-dashoffset:0;opacity:1}94%,100%{stroke-dashoffset:0;opacity:0}}
.seis__fim{display:grid;gap:26px;margin-top:44px}
.remate{font-family:var(--serif);font-size:clamp(30px,7vw,60px);line-height:1.04;letter-spacing:-.025em;max-width:16ch;text-wrap:balance}
.escura p.remate{color:var(--creme)}
.remate em{font-style:italic;color:var(--terra-clara)}

/* ---------- Há 15 anos e hoje: a régua ---------- */
.epocas{padding:90px 0}
.regua{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:10px;max-width:1200px;margin:50px auto 0;padding:0 22px 22px}
.regua span{font-family:var(--serif);font-weight:400;font-size:clamp(64px,19vw,250px);line-height:.8;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.5px var(--linha-forte)}
.regua .regua__hoje{font-style:italic;color:var(--terra);-webkit-text-stroke:0;letter-spacing:-.04em}
.regua i{position:absolute;left:22px;right:22px;bottom:0;height:4px;border-radius:2px;background:var(--terra);transform:scaleX(0);transform-origin:0 50%;transition:transform 3s var(--saida)}
.regua.vivo i,.tudo .regua i{transform:scaleX(1)}
.regua::after{content:"";position:absolute;right:22px;bottom:-8px;width:20px;height:20px;border-radius:50%;background:var(--terra)}
.epocas__par{display:grid;gap:16px;margin-top:44px}
.epoca h3{font-style:italic;font-weight:400;font-size:34px}
.epoca--antes{padding:26px 22px;border:1.5px dashed var(--linha-forte);border-radius:8px;color:var(--suave)}
.epoca--antes p{margin-top:10px}
.epoca--hoje{background:var(--verde);color:var(--creme);padding:28px 22px;border-radius:8px}
.epoca--hoje h3{color:var(--terra-clara)}
.hoje{margin-top:10px}
.hoje li{display:grid;grid-template-columns:76px 1fr;gap:18px;align-items:center;padding:16px 0;border-top:1px solid var(--linha-clara);font-family:var(--serif);font-weight:600;font-size:clamp(23px,5.4vw,30px);line-height:1.14;letter-spacing:-.015em}
.hoje li:first-child{border-top:0}
.hoje .il{background:var(--creme)}

/* ---------- O médico ---------- */
.voz{padding:90px 22px;background:var(--creme-2);border-block:1px solid var(--linha);text-align:center}
.voz blockquote{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(46px,12.4vw,150px);line-height:.96;letter-spacing:-.035em;text-wrap:balance;max-width:11ch;margin:0 auto}
.voz__quem{display:grid;gap:22px;justify-items:center;max-width:980px;margin:50px auto 0}
.voz__quem img{width:min(100%,330px);height:auto;aspect-ratio:3/4;object-fit:cover;object-position:50% 12%;border-radius:3px;border:8px solid var(--branco);outline:1px solid var(--linha-forte)}
.voz__nome{font-family:var(--serif);font-weight:600;font-size:30px;line-height:1.1}
.voz__papel{font-style:italic;color:var(--terra);font-size:20px;margin-top:4px}
.voz__texto{margin-top:16px;color:var(--suave)}

/* ---------- O que perguntam ---------- */
.receios{padding:90px 0}
.respostas{margin-top:44px;border-top:2px solid var(--tinta)}
.respostas>div{display:grid;grid-template-columns:96px 1fr;gap:6px 18px;align-items:start;padding:26px 0;border-bottom:1px solid var(--linha-forte)}
.respostas img{grid-row:span 2;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border:5px solid var(--branco);outline:1px solid var(--linha-forte);border-radius:3px}
.respostas dt{font-family:var(--serif);font-weight:600;font-size:clamp(25px,5.8vw,32px);line-height:1.14;letter-spacing:-.018em}
.respostas dd{grid-column:2;margin-top:6px;color:var(--suave)}

/* ---------- Marcar: o telefone a toda a largura ---------- */
.marcar{padding:84px 0 90px;text-align:center}
.marcar__pre{font-style:italic;font-size:24px}
.escura p.marcar__pre{color:var(--terra-clara)}
.marcar__n{
  display:inline-grid;grid-template-columns:auto auto;align-items:center;gap:0 .16em;margin-top:18px;
  font-family:var(--serif);font-weight:400;font-size:clamp(40px,12vw,170px);line-height:1;letter-spacing:-.045em;white-space:nowrap;
  color:var(--creme);text-decoration:none;border:2px solid var(--creme);border-radius:10px;padding:.14em .22em .16em;
  transition:background .2s,color .2s,transform .2s var(--saida);
}
.marcar__n svg{width:.52em;height:.52em;fill:var(--terra-clara);stroke:none;animation:toca 3.4s ease-in-out infinite;transform-origin:50% 50%}
.marcar__n span{text-decoration:underline;text-decoration-thickness:.045em;text-underline-offset:.1em;text-decoration-color:var(--terra-clara)}
.marcar__n small{grid-column:1 / -1;font-size:19px;letter-spacing:0;font-weight:600;margin-top:10px;color:var(--terra-clara)}
.marcar__n:hover{background:var(--creme);color:var(--verde);transform:translateY(-3px)}
.marcar__n:active{transform:scale(.985)}
@keyframes toca{0%,70%,100%{transform:rotate(0)}76%{transform:rotate(-14deg)}82%{transform:rotate(12deg)}88%{transform:rotate(-8deg)}94%{transform:rotate(5deg)}}
.marcar__accoes{display:grid;max-width:440px;margin:30px auto 0}
.marcar__sub{margin:90px auto 0;max-width:none;font-size:clamp(34px,7.4vw,64px)}
.passos{margin-top:34px;text-align:left;counter-reset:p;border-top:1px solid var(--linha-clara)}
.passos>li{display:grid;grid-template-columns:auto 1fr;gap:4px 18px;padding:22px 0;border-bottom:1px solid var(--linha-clara);counter-increment:p}
.passos .il{display:none}
.passos>li::before{content:counter(p);grid-row:span 2;font-family:var(--serif);font-style:italic;font-size:64px;line-height:.9;color:var(--terra-clara);min-width:.8em}
.passos h3{font-size:27px;align-self:end}
.passos p{font-size:19px}
.liguem{margin:54px auto 0;max-width:640px;background:var(--creme);color:var(--tinta);padding:28px 20px;border-radius:8px;text-align:left}
.liguem h3{font-size:30px}
.liguem>p,.escura .liguem p{color:var(--suave);font-size:19px;margin-top:8px}
.liguem .botao--verde:hover{background:var(--terra)}
.campo{margin-top:20px}
.campo label{display:block;font-weight:600;font-size:18px;margin-bottom:8px}
.campo label span{font-weight:400;color:var(--suave)}
.campo input,.campo textarea{width:100%;font:inherit;font-size:19px;color:var(--tinta);background:var(--branco);border:1.5px solid var(--linha-forte);border-radius:4px;padding:16px;min-height:60px;transition:border-color .2s}
.campo textarea{min-height:110px;resize:vertical}
.campo input:focus,.campo textarea:focus{outline:3px solid var(--terra);outline-offset:1px;border-color:var(--verde)}
.aceito{display:flex;gap:14px;align-items:flex-start;margin-top:20px;font-size:17px;color:var(--suave);line-height:1.5}
.aceito input{flex:none;width:26px;height:26px;margin-top:1px;accent-color:var(--verde)}
.formulario .botao{width:100%;margin-top:22px}
.formulario__estado{margin-top:16px;font-size:18px;border-radius:4px;padding:14px 16px;background:var(--branco);border:1.5px solid var(--verde)}
.formulario__estado[hidden]{display:none}


/* ---------- Rodapé ---------- */
.fim{padding:34px 22px 150px;text-align:center;font-size:17px;color:var(--suave)}
.fim nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 26px;margin-bottom:18px;color:var(--tinta);font-weight:600}
.fim nav a{text-underline-offset:4px}
.fim p+p{margin-top:8px}

/* ---------- Aviso de cookies: o Google Analytics só arranca depois de "Aceitar" (/js/analytics.js) ---------- */
.cookies{position:fixed;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:60;max-width:520px;margin:0 auto;background:var(--branco);border:1px solid var(--linha-forte);border-radius:6px;padding:18px 20px;box-shadow:8px 8px 0 var(--creme-2);opacity:0;transform:translateY(16px);transition:opacity .3s ease,transform .3s ease}
.cookies.open{opacity:1;transform:none}
.cookies p{margin:0 0 14px;font-size:16px;line-height:1.5;color:var(--suave)}
.cookies a{color:var(--tinta);text-decoration:underline;text-underline-offset:3px}
.cookies__botoes{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.cookies__botoes button{min-height:48px;border-radius:4px;padding:10px 22px;font-family:var(--body);font-size:17px;font-weight:600;cursor:pointer;line-height:1.2}
.cookies__nao{background:transparent;color:var(--tinta);border:1.5px solid var(--linha-forte)}
.cookies__sim{background:var(--verde);color:#fff;border:1.5px solid var(--verde)}
.tudo .cookies{display:none}

/* ---------- Barra de baixo: ligar e agendar, sempre à mão ---------- */
.fixa{
  position:fixed;left:0;right:0;bottom:0;z-index:55;display:grid;grid-template-columns:auto 1fr;gap:10px;
  padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:var(--creme);border-top:1px solid var(--linha-forte);
  transform:translateY(110%);transition:transform .4s var(--saida);
}
.fixa.visivel{transform:none}
.fixa__nome{display:none}
.fixa .botao{min-height:60px;padding:12px 20px}
.tudo .fixa{display:none}
.tudo .antes .caixa path{stroke-dashoffset:0;animation:none}

@media (min-width:860px){
  body{font-size:21px}
  .dentro,.abre__casa{padding-left:44px;padding-right:44px}
  .abre{padding:26px 0 110px}
  .abre__tema{margin-top:70px;font-size:26px}
  .abre h1{padding:0 30px}
  /* as duas notas de margem, uma de cada lado do arco */
  .palco{grid-template-columns:1fr 380px 1fr;gap:54px;align-items:center;max-width:1200px;margin:64px auto 0;padding:0 44px}
  .filme{max-width:380px}
  .margem{font-size:29px;line-height:1.26}
  .margem--e{order:0;justify-self:end;text-align:right}
  .margem--d{order:0;justify-self:start;text-align:left}
  .selo{width:168px;height:168px;right:-70px;bottom:-40px}
  .abre__accoes{grid-template-columns:1fr 1fr;max-width:600px;margin-top:84px}

  .quando,.epocas,.receios{padding:150px 0}
  .entrada{font-size:25px}
  .momentos{grid-template-columns:repeat(4,1fr);gap:26px;margin-top:70px;padding:0 44px}
  .momentos li:nth-child(even){transform:translateY(54px)}
  .momentos .il{width:92px;height:92px;margin:-52px 0 14px 18px}
  .momentos .il svg{width:62px;height:62px}
  .momentos h3{font-size:27px}
  .momentos p{font-size:19px}
  .marcar__n small{font-size:22px}
  .estampa{grid-template-columns:170px 1fr;gap:54px;margin-top:140px}

  .seis{padding:150px 0}
  .antes{display:grid;grid-template-columns:1fr 1fr;gap:0 70px;margin-top:70px}
  .antes li{padding:30px 0}
  .antes li::before{font-size:92px}
  .seis__fim{grid-template-columns:1fr auto;align-items:end;margin-top:70px}

  .regua{padding:0 44px 30px;margin-top:80px}
  .regua i{left:44px;right:44px}
  .regua::after{right:44px}
  .epocas__par{grid-template-columns:.7fr 1.3fr;gap:22px;margin-top:70px;align-items:stretch}
  .epoca--antes,.epoca--hoje{padding:40px}
  .epoca h3{font-size:44px}

  .voz{padding:150px 44px}
  .voz__quem img{width:420px}
  .voz__nome{font-size:44px}
  .voz__papel{font-size:24px}
  .voz__texto{font-size:23px;max-width:28ch}
  .voz__quem{grid-template-columns:auto 1fr;gap:60px;text-align:left;align-items:center;margin-top:80px}
  .respostas{display:grid;grid-template-columns:1fr 1fr;gap:0 70px;margin-top:70px}
  .respostas>div{grid-template-columns:150px 1fr;gap:6px 26px;padding:34px 0}
  .marcar{padding:140px 0 150px}
  .passos{display:grid;grid-template-columns:repeat(3,1fr);gap:0 44px;border-top:0}
  .passos>li{display:block;border-top:1px solid var(--linha-clara);border-bottom:0}
  .passos>li::before{display:block;font-size:92px;margin-bottom:14px}
  .liguem{padding:44px;margin-top:90px}
  .fim{padding-bottom:130px}
  .fixa{grid-template-columns:1fr auto auto;align-items:center;padding:10px 44px}
  .fixa__nome{display:block;font-family:var(--serif);font-weight:600;font-size:19px}
  .fixa .botao{min-height:52px;font-size:18px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .risca::after{transform:scaleX(1) rotate(-2.5deg)}
  .regua i{transform:scaleX(1)}
  .antes .caixa path{stroke-dashoffset:0}
}
