/* =========================================================
   Imersão AYA — Mayara Sansana (v2)
   Cores, fontes e espaçamentos centralizados aqui.
   ========================================================= */
:root{
  --greige:#F2EEEB;      /* fundo base */
  --linho:#E4DAD0;       /* seções alternadas */
  --linho-claro:#EAE2DA;
  --caramelo:#8E6D43;    /* bronze: destaques dos títulos, ícones e filetes */
  --caramelo-escuro:#715532;
  --cafe:#2B211A;        /* bloco escuro e rodapé */
  --ouro:#C1A274;        /* dourado: botões e detalhes sobre o café */
  --texto:#2B211A;
  --texto-2:#5E5048;
  --filete:rgba(43,33,26,.14);
  --botao:var(--ouro);                /* fundo dos botões */
  --botao-hover:#D2B587;
  --botao-texto:var(--cafe);
  --faixa:var(--cafe);                /* faixa abaixo do hero */

  --serif:"Cormorant Garamond", "Times New Roman", serif;
  --sans:"Jost", "Helvetica Neue", Arial, sans-serif;

  --largura:1140px;
  --lateral:24px;
  --secao:clamp(88px, 11vw, 140px);
  --raio:4px;          /* cantos retos e clássicos */
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;background:var(--greige);color:var(--texto);font:400 17px/1.65 var(--sans);overflow-x:hidden}
/* Números alinhados e proporcionais em toda a página (a Cormorant usa números de estilo antigo por padrão) */
*,*::before,*::after{font-variant-numeric:lining-nums proportional-nums !important} /* !important porque o atalho font: zera essa propriedade */
img{display:block;max-width:100%;height:auto}
figure{margin:0}
h1,h2,h3,p,ul,ol,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--caramelo);outline-offset:4px}

.container{width:100%;max-width:calc(var(--largura) + var(--lateral) * 2);margin:0 auto;padding:0 var(--lateral)}
.secao{padding:var(--secao) 0}

h2{font:400 clamp(34px, 3.6vw, 52px)/1.1 var(--serif);letter-spacing:-.005em;text-wrap:balance}
/* Trecho de destaque nos títulos, no padrão do hero */
h2 em{font-style:italic;color:var(--caramelo)}
.conduz h2 em,.ambiente h2 em{color:var(--ouro)}
h3{font:500 18px/1.35 var(--sans)}
.texto{color:var(--texto-2);max-width:60ch}
p,li,dd{text-wrap:pretty}
h1,h2,strong,.cabeca-sub,.paraquem-lead,.selo,.vaga-titulo,
h3{text-wrap:pretty}
.sem-quebra{white-space:nowrap}

/* Cabeçalho de seção centralizado */
.cabeca{text-align:center;max-width:820px;margin:0 auto 56px}
.cabeca .texto{margin:20px auto 0}
.titulo-longo{font-size:clamp(30px, 3vw, 44px);line-height:1.15}
.cabeca-sub{font:italic 400 clamp(22px, 2vw, 28px)/1.3 var(--serif);color:var(--caramelo);margin-top:14px}

/* ---------- Botões ---------- */
.botao{
  display:inline-block;background:var(--botao);color:var(--botao-texto);
  font:500 17px/1 var(--sans);letter-spacing:.02em;text-decoration:none;text-align:center;
  padding:21px 34px;border-radius:var(--raio);
  box-shadow:0 10px 24px -12px color-mix(in srgb, var(--botao) 60%, transparent);
  transition:background-color .3s ease, transform .3s ease;
}
.botao:hover{background:var(--botao-hover);transform:translateY(-2px)}
.botao-claro{background:#F4EBE0;color:var(--cafe);box-shadow:none}
.botao-claro:hover{background:#fff}
.botao-largo{display:block;width:100%}

/* ---------- Imagem a fornecer ---------- */
.espaco-img{
  width:100%;height:100%;min-height:200px;display:flex;align-items:center;justify-content:center;
  background:repeating-linear-gradient(135deg, color-mix(in srgb, var(--caramelo) 7%, transparent) 0 12px, transparent 12px 24px), var(--linho-claro);
  border:1.5px dashed color-mix(in srgb, var(--caramelo) 45%, transparent);
  color:var(--caramelo);font:400 13px/1.5 var(--sans);text-align:center;padding:16px;
}

/* ---------- Faixa corrida ---------- */
.faixa{overflow:hidden;white-space:nowrap}
.faixa-trilho{display:inline-flex;animation:correr 60s linear infinite}
.faixa span{display:inline-flex;align-items:center}
.faixa span::after{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.5;margin:0 28px}
.faixa-caramelo{background:var(--faixa);color:#FFF8F1;font:italic 400 24px/1 var(--serif);padding:20px 0}
.faixa-caramelo .faixa-trilho{animation-duration:48s}
.faixa-caramelo span::after{width:1px;height:18px;border-radius:0;opacity:.45;margin:0 30px}
@keyframes correr{to{transform:translateX(-50%)}}

/* ---------- Barra fixa ---------- */
.barra{position:sticky;top:0;z-index:50;background:rgba(242,238,235,.88);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--filete);transition:box-shadow .3s ease}
.barra.rolou{box-shadow:0 10px 30px -18px rgba(43,33,26,.35)}
.barra-grade{display:flex;align-items:center;gap:28px;height:68px}
.barra-nome{font:400 25px/1 var(--serif);text-decoration:none;letter-spacing:.01em}
.barra-info{display:flex;gap:18px;font-size:14px;color:var(--texto-2);margin-right:auto}
.barra-info span + span{padding-left:18px;border-left:1px solid var(--filete)}
.botao-barra{padding:14px 24px;font-size:16px;box-shadow:none}

/* ---------- Logo provisório ---------- */
.logo{display:inline-flex;align-items:center;gap:14px}
.logo-aya{font:400 40px/1 var(--serif);letter-spacing:.22em;padding-left:.22em}
.logo-sub{font:400 11px/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--texto-2);border-left:1px solid var(--filete);padding-left:14px}

/* ---------- 1. Hero ---------- */
.hero{position:relative;padding:56px 0 0;overflow:hidden;background:#EDE4DA}
.hero-grade{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:end;min-height:702px}
.hero-texto{position:relative;z-index:2;padding-bottom:88px}

/* Cena (Figma, desktop): medidas relativas ao container de 1188px, como no layout */
.hero-cena{position:absolute;inset:0;z-index:0;pointer-events:none}
.cena-img{position:absolute;left:-533.7px;top:-114.5px;width:2241px;height:1153.6px}
.cena-img img{display:block;width:100%;height:100%;max-width:none}
.cena-veu{position:absolute;left:-144px;top:-99px;width:1538px;height:836px;
  background:radial-gradient(740px 1200px at 353px 292px, rgba(242,238,235,.6) 0%, rgba(242,238,235,0) 70%)}
.hero-info{display:flex;flex-wrap:wrap;gap:10px 26px;margin:36px 0 30px;font-size:14px;color:var(--texto-2)}
.hero-info li{display:flex;align-items:center;gap:8px}
.hero-info svg{width:18px;height:18px;fill:none;stroke:var(--caramelo);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.hero h1{font:400 clamp(40px, 4.1vw, 60px)/1.05 var(--serif);letter-spacing:-.015em}
@media (min-width:641px){.hero h1 .h1-linha{white-space:nowrap}}
.hero h1 em{display:block;font-style:italic;color:var(--caramelo)}
.hero-lead{font-size:18px;color:var(--texto);max-width:46ch;margin:28px 0 14px}
.hero-apoio{color:var(--texto-2);max-width:50ch;margin-bottom:36px}

/* ---------- 3. Abertura ---------- */
.duas-colunas{display:grid;grid-template-columns:1.25fr 1fr;gap:56px;align-items:end;margin-bottom:64px}
.duas-colunas .texto{margin-bottom:28px}
.duas-colunas h2 em{display:block;text-wrap:balance}
.fileira-fotos{display:grid;grid-template-columns:repeat(4, 1fr);gap:16px}
.fileira-fotos figure{aspect-ratio:3/4;overflow:hidden;border-radius:var(--raio)}
.fileira-fotos img{width:100%;height:100%;object-fit:cover}

/* ---------- 4. Quem conduz ---------- */
.conduz{background:var(--cafe);color:#F1E8DD}
.conduz .texto{color:#C4B4A2}
.conduz .cabeca-sub{color:var(--ouro)}
.trio{display:grid;grid-template-columns:repeat(3, 1fr);gap:24px}
.pessoa{position:relative;aspect-ratio:3/4;border-radius:var(--raio);overflow:hidden;border:1px solid rgba(241,232,221,.12);background:#362A21;transition:transform .45s cubic-bezier(.22,1,.36,1), border-color .35s ease, box-shadow .4s ease}
.pessoa-foto{position:absolute;inset:0;transition:transform .6s cubic-bezier(.22,1,.36,1)}
.pessoa-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 18%}
.pessoa-foto img.foto-topo{object-position:50% 4%}
.pessoa::after{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(to top, rgba(32,24,18,.96) 12%, rgba(32,24,18,.45) 46%, rgba(32,24,18,0) 72%)}
.pessoa-info{position:absolute;inset:auto 0 0;z-index:3;padding:28px}
.pessoa h3{font:400 32px/1.1 var(--serif);color:#F6EEE4}
.cargo{font-size:14px;color:var(--ouro);margin-top:6px}
@media (hover:hover) and (min-width:981px){ .pessoa .cargo{min-height:2lh;line-height:1.5} }
.pessoa-bio{color:#D7C9B8;font-size:15px;line-height:1.6;max-height:0;opacity:0;overflow:hidden;transition:max-height .5s cubic-bezier(.22,1,.36,1), opacity .4s ease, margin-top .5s cubic-bezier(.22,1,.36,1)}
.pessoa:hover,.pessoa:focus-within{transform:translateY(-6px);border-color:rgba(190,154,99,.55);box-shadow:0 30px 60px -30px rgba(190,154,99,.45)}
.pessoa:hover .pessoa-foto,.pessoa:focus-within .pessoa-foto{transform:scale(1.05)}
.pessoa:hover .pessoa-bio,.pessoa:focus-within .pessoa-bio{max-height:240px;opacity:1;margin-top:14px}
.pessoa:hover::after,.pessoa:focus-within::after{background:linear-gradient(to top, rgba(32,24,18,.97) 30%, rgba(32,24,18,.7) 62%, rgba(32,24,18,.15))}
.conduz .espaco-img{background:repeating-linear-gradient(135deg, rgba(190,154,99,.08) 0 12px, transparent 12px 24px), #3A2E25;border-color:rgba(190,154,99,.45);color:var(--ouro);align-items:flex-start;padding-top:38%}
/* Sem hover (celular e tablet): bio sempre visível abaixo da foto */
@media (hover:none), (max-width:980px){
  .pessoa{aspect-ratio:auto}
  .pessoa::after{display:none}
  .pessoa-foto{position:relative;aspect-ratio:4/5}
  .pessoa-info{position:relative;inset:auto;padding:24px 24px 28px}
  .pessoa-bio{max-height:none;opacity:1;margin-top:14px}
  .pessoa:hover,.pessoa:focus-within{transform:none}
  .conduz .espaco-img{align-items:center;padding-top:16px}
}

/* ---------- 5. O problema ---------- */
.palco{position:relative;display:flex;flex-direction:column;justify-content:center;gap:36px;min-height:100vh;padding:104px 0 40px;overflow:hidden}
.palco-topo{display:flex;align-items:flex-end;justify-content:space-between;gap:32px}
.palco-topo h2{max-width:22ch}
.palco-dica{font-size:14px;color:var(--texto-2);padding-bottom:8px}
.trilho-janela{overflow:hidden}
.trilho{display:flex;gap:24px;width:max-content;padding:0 max(var(--lateral), calc((100vw - var(--largura)) / 2))}
.cenario{flex:0 0 auto;width:min(420px, 80vw);height:min(58vh, 540px);display:flex;flex-direction:column;border-radius:var(--raio);overflow:hidden;color:#F4EBE0}
.cenario-img{flex:1 1 auto;min-height:0;width:100%;object-fit:cover;object-position:50% 50%}
.cenario-corpo{padding:26px 28px 30px}
.cenario h3{font:400 29px/1.1 var(--serif);margin-bottom:10px}
.cenario p{font-size:15.5px;line-height:1.55;opacity:.85}
.cor-1{background:var(--cafe)}
.cor-2{background:var(--caramelo)}
.cor-3{background:#D9C8B4;color:var(--cafe)}
.cor-4{background:#5B4434}
.cor-5{background:#8C6E57}

/* ---------- 6. A experiência ---------- */
.experiencia{background:var(--linho);overflow:hidden;padding-bottom:calc(var(--secao) * .6)}
.experiencia .cabeca{margin-bottom:40px}
.pilar{border-top:1px solid var(--filete);padding:24px 0 44px}
.pilar-palavra{white-space:nowrap;font:300 clamp(64px, 12vw, 200px)/.95 var(--serif);letter-spacing:-.03em;padding-left:4vw}
.pilar-2 .pilar-palavra{padding-left:22vw;font-style:italic;color:var(--caramelo)}
.pilar-3 .pilar-palavra{padding-left:40vw}
.pilar-texto{display:grid;grid-template-columns:1fr 1fr;column-gap:24px;row-gap:8px}
.pilar-texto h3,.pilar-texto p{grid-column:2}
.pilar-2 .pilar-texto h3,.pilar-2 .pilar-texto p{grid-column:1}
.pilar-texto h3{margin-top:16px}
.pilar-texto p{color:var(--texto-2);max-width:48ch}

/* ---------- 7. Para quem é ---------- */
.paraquem{position:relative;overflow:hidden;min-height:min(1000px, 61.1vw)}
.paraquem-grade{position:relative;z-index:2;display:flex;justify-content:flex-start;padding-top:140px;padding-bottom:120px}
.paraquem-texto{margin-left:clamp(0px, 3.6vw, 51px)}
.paraquem-texto{max-width:560px;width:100%}
.paraquem hr{border:0;border-top:1px solid var(--cafe);margin:26px 0}
.paraquem-lead{font:400 clamp(24px, 2.2vw, 30px)/1.25 var(--serif);color:var(--texto);margin-bottom:18px}
.lista{margin-bottom:22px}
.lista li{position:relative;padding:10px 0 10px 22px;border-bottom:1px solid var(--cafe)}
.lista li::before{content:"";position:absolute;left:2px;top:21px;width:7px;height:7px;border-radius:50%;background:var(--caramelo)}
.selo{font:italic 500 22px/1.3 var(--serif);margin:26px 0 32px}
/* Desktop: foto ocupa a seção inteira (palco + Mayara à direita), texto à esquerda */
.paraquem-foto{position:absolute;inset:0;z-index:1}
.paraquem-foto img{display:block;width:100%;height:100%;object-fit:cover;object-position:70% 0%}
.paraquem-recorte{display:none}
/* Telas médias: texto mais estreito para não encostar na Mayara */
@media (max-width:1300px) and (min-width:981px){ .paraquem-texto{max-width:46vw} }
/* Tablet: foto centralizada com laterais dissolvendo no fundo */
@media (max-width:980px) and (min-width:561px){
  .paraquem-foto picture,.paraquem-foto .paraquem-recorte{-webkit-mask-image:linear-gradient(to right, transparent 0, #000 12%, #000 88%, transparent 100%);mask-image:linear-gradient(to right, transparent 0, #000 12%, #000 88%, transparent 100%)}
  .paraquem-foto picture{display:block;height:100%}
}

/* ---------- 8. Ambiente ---------- */
.ambiente{position:relative;min-height:84vh;display:flex;align-items:center;overflow:hidden;color:#FBF6F0}
.ambiente-foto{position:absolute;inset:-8% 0;z-index:0}
.ambiente-foto img{width:100%;height:100%;object-fit:cover}
.ambiente-foto::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg, rgba(43,33,26,.86) 0%, rgba(43,33,26,.6) 45%, rgba(43,33,26,.25) 100%)}
.ambiente-texto{position:relative;z-index:1;padding-top:96px;padding-bottom:96px}
.ambiente h2{max-width:20ch;font-size:clamp(34px, 3.8vw, 54px)}
.ambiente p{max-width:48ch;margin:24px 0 36px;color:#E9DED2}

/* ---------- 9. Incluso ---------- */
.incluso-grade{display:grid;grid-template-columns:5fr 6fr;gap:72px;align-items:center}
.incluso-foto{aspect-ratio:4/5;border-radius:var(--raio);overflow:hidden}
.incluso-foto img{width:100%;height:100%;object-fit:cover}
.incluso-texto h2{margin-bottom:32px}
.incluso .incluso-lista li{font-size:18px;padding:16px 0 16px 34px}
.incluso .incluso-lista li::before{top:23px}

/* ---------- 10. Como funciona ---------- */
.funciona{background:var(--linho)}
.funciona-grade{display:grid;grid-template-columns:4fr 7fr;gap:56px}
.funciona h2{position:sticky;top:48px;align-self:start}
.passos{position:relative;padding-left:72px}
.costura{position:absolute;left:18px;top:8px;bottom:8px;width:2px}
.costura-linha{position:absolute;inset:0;background:repeating-linear-gradient(to bottom, var(--caramelo) 0 10px, transparent 10px 18px);transform-origin:50% 0}
.costura-agulha{position:absolute;left:50%;top:0;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:var(--caramelo);box-shadow:0 0 0 6px color-mix(in srgb, var(--caramelo) 16%, transparent)}
.passo{position:relative;padding-bottom:64px}
.passo:last-child{padding-bottom:0}
.passo-n{position:absolute;left:-72px;top:-12px;width:40px;text-align:center;font:italic 300 44px/1 var(--serif);color:var(--caramelo);background:var(--linho)}
.passo h3{font:400 clamp(26px, 2.2vw, 32px)/1.15 var(--serif);margin-bottom:10px}
.passo p{color:var(--texto-2);max-width:54ch}
.dia-card{display:grid;grid-template-columns:200px 1fr;gap:24px;align-items:start;background:#FBF8F5;border:1px solid var(--filete);border-radius:var(--raio);padding:16px 24px 20px 16px}
.dia-card img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:2px}
.dia-rotulo{font:italic 400 22px/1 var(--serif);color:var(--caramelo);margin:10px 0 6px}

/* ---------- 11. Sua vaga ---------- */
.vaga{position:relative;overflow:hidden}
.vaga .container{position:relative;z-index:1}
.vaga-card{display:grid;grid-template-columns:1fr 1fr;max-width:940px;margin:0 auto;background:#FBF8F5;border:1px solid var(--filete);border-radius:var(--raio);overflow:hidden;box-shadow:0 30px 60px -40px rgba(43,33,26,.45)}
.vaga-lado{padding:44px}
.vaga-lado h3{font:400 30px/1.15 var(--serif);margin-bottom:22px}
.checks li{position:relative;padding:11px 0 11px 30px;border-bottom:1px solid var(--filete)}
.checks li:last-child{border-bottom:0}
.checks li::before{content:"";position:absolute;left:2px;top:17px;width:12px;height:7px;border-left:1.6px solid var(--caramelo);border-bottom:1.6px solid var(--caramelo);transform:rotate(-45deg)}
.vaga-acao{background:var(--cafe);color:#F1E8DD;display:flex;flex-direction:column}
.vaga-titulo{font:italic 400 30px/1.15 var(--serif);color:var(--ouro);margin-bottom:22px}
.vaga-info{display:grid;gap:14px;margin-bottom:32px}
.vaga-info dt{font-size:13px;color:#B5A796}
.vaga-info dd{font:400 22px/1.25 var(--serif)}
.pendente{font:italic 14px var(--sans);color:var(--ouro)}
.vaga-acao .botao{margin-top:auto}

/* ---------- Rodapé ---------- */
.rodape{background:var(--cafe);color:#C4B4A2;font-size:13px;padding:36px 0}
.rodape-grade{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.logo-claro .logo-aya{color:#F1E8DD;font-size:30px}
.logo-claro .logo-sub{color:#B5A796;border-color:rgba(241,232,221,.2)}


/* ---------- Surgimento suave ---------- */
.js [data-anima]{opacity:0;transform:translateY(24px);transition:opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i, 0) * 110ms)}
.js [data-anima].visivel{opacity:1;transform:none}
.js .hero-texto > *{opacity:0;transform:translateY(18px);animation:entrar .9s cubic-bezier(.2,.7,.2,1) forwards}
.js .hero-texto > :nth-child(2){animation-delay:.1s}
.js .hero-texto > :nth-child(3){animation-delay:.2s}
.js .hero-texto > :nth-child(4){animation-delay:.3s}
.js .hero-texto > :nth-child(5){animation-delay:.4s}
.js .hero-texto > :nth-child(6){animation-delay:.5s}
.js .hero-cena{opacity:0;animation:entrar 1.4s .1s ease forwards}
@keyframes entrar{to{opacity:1;transform:none}}

/* ---------- Responsivo ---------- */
@media (max-width:980px){
  .hero{--u:min(1vw, 4.4px);padding-top:36px}
  .hero-grade{position:static;grid-template-columns:1fr;gap:0;min-height:0}
  .hero-grade::after{content:"";display:block;height:calc(102.3 * var(--u))}
  .hero-texto{padding-bottom:40px}
  .cena-img{left:calc(50% - 95.9 * var(--u));top:auto;bottom:calc(-117.9 * var(--u));width:calc(145.9 * var(--u));height:calc(411.4 * var(--u))}
  .cena-veu{inset:0;width:auto;height:auto;background:linear-gradient(175.65deg, rgba(242,238,235,.85) 28.5%, rgba(242,238,235,0) 68.5%)}
  .duas-colunas{grid-template-columns:1fr;gap:24px}
  .fileira-fotos{grid-template-columns:repeat(2, 1fr)}
  .trio{grid-template-columns:1fr;max-width:460px;margin:0 auto;gap:32px}
  .incluso-grade{grid-template-columns:1fr;gap:40px}
  .incluso-foto{max-width:460px;width:100%;margin:0 auto}
  .funciona-grade{grid-template-columns:1fr;gap:40px}
  .funciona h2{position:static}
  .paraquem{min-height:0;overflow:visible;z-index:2}
  /* Ambiente no celular: foto em cima, enquadrada na Mayara, texto abaixo sobre o café */
  .ambiente{display:block;min-height:0;background:var(--cafe)}
  .ambiente-foto{position:relative;inset:auto;aspect-ratio:16/10}
  .ambiente-foto img{object-position:70% 30%}
  .ambiente-foto::after{background:linear-gradient(to bottom, rgba(43,33,26,0) 50%, rgba(43,33,26,.6) 78%, var(--cafe) 100%)}
  .ambiente-texto{padding-top:0;margin-top:-40px;padding-bottom:calc(var(--secao) * .8)}
  .paraquem h2 em{display:block}
  .paraquem-foto{position:relative;inset:auto;width:100%;max-width:560px;margin:0 auto;aspect-ratio:390/552}
  .paraquem-foto .paraquem-recorte{display:block;position:absolute;left:0;top:-15.45%;width:100%;height:105.43%;object-fit:fill}
  .paraquem-grade{display:block;padding-top:0;margin-top:calc(-0.1513 * min(100vw, 560px));padding-bottom:var(--secao)}
  .paraquem-texto{margin-left:0}
}
@media (max-width:640px){
  .ambiente-foto{aspect-ratio:1/1}
  body{font-size:16px}
  .logo-aya{font-size:32px}
  .barra-grade{height:60px;display:grid;grid-template-columns:1fr auto;column-gap:12px;row-gap:0;align-content:center}
  .barra-nome{font-size:21px;grid-column:1}
  .barra-info{grid-column:1;font-size:12px;margin-top:3px}
  .barra-info span + span{display:none}
  .botao-barra{grid-column:2;grid-row:1 / span 2;padding:13px 18px;font-size:15px;white-space:nowrap}
  /* Celular: cards um embaixo do outro, empilhando no topo ao rolar */
  .palco{min-height:0;padding:var(--secao) 0 0;gap:28px;overflow:visible}
  .palco-topo{flex-direction:column;align-items:flex-start;gap:12px}
  .palco-dica{display:none}
  .trilho-janela{overflow:visible}
  .trilho{flex-direction:column;gap:20px;width:auto;padding:0 var(--lateral)}
  .cenario{width:100%;height:auto;position:sticky;top:calc(76px + var(--n) * 12px);box-shadow:0 -14px 30px -18px rgba(43,33,26,.45)}
  .cenario-img{flex:none;aspect-ratio:16/9;height:auto}
  .incluso .incluso-lista li{font-size:16px}
  .pilar-palavra{font-size:13vw}
  .pilar-2 .pilar-palavra{padding-left:12vw}
  .pilar-3 .pilar-palavra{padding-left:24vw}
  .pilar-texto{grid-template-columns:1fr}
  .pilar-texto h3,.pilar-texto p,.pilar-2 .pilar-texto h3,.pilar-2 .pilar-texto p{grid-column:1}
  .passos{padding-left:52px}
  .costura{left:10px}
  .passo-n{left:-56px;font-size:36px}
  .dia-card{grid-template-columns:1fr;padding:12px 18px 20px 12px}
  .dia-card img{aspect-ratio:4/3}
  .passo p{text-wrap:wrap}
  .vaga-card{grid-template-columns:1fr}
  .vaga-lado{padding:32px 20px}
  .vaga-acao .botao{padding:20px 18px;font-size:16px}
}

/* Celulares estreitos: botão continua em uma linha */
@media (max-width:380px){ .botao{font-size:16px;padding:20px 20px} }

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .faixa-trilho{animation:none}
  .trilho-janela{overflow-x:auto}
  .js [data-anima],.js .hero-texto > *,.js .hero-cena{opacity:1;transform:none;animation:none;transition:none}
}