/* Amatas · v2 — estilos das páginas v2 (home, Como trabalhamos, Conheça o time, Privacidade).
   O contato.html tem o próprio CSS. Ao mudar este arquivo, suba o ?v= nos <link> das páginas. */
/* ============ Tokens (briefing, seção 5) ============ */
:root{
  --dark:#141414;--dark-2:#1B1B1B;--dark-line:#2C2C2C;
  --paper:#F4F4F2;--white:#FFFFFF;--line:#E2E2DE;
  --ink:#1A1A1A;--mute:#4A4A4A;--mute-2:#6A6A6A;
  --green:#0D5C45;--green-hover:#0F6B51;--green-d:#0B3D2E;--green-l:#E8F1EC;
  --green-glow:#4CBB91; /* o mesmo verde, clareado, só para traço e texto sobre o grafite (contraste) */
  --on-dark:#F2F2F2;--on-dark-2:#CFCFCF;--on-dark-3:#9A9A9A;
  --f-head:'Inter Tight',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-body:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-mono:'IBM Plex Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;
  --pad:24px;--sec:112px;--r-card:14px;--r-btn:6px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit}
p,h1,h2,h3,ol,ul,figure{margin:0}
ol,ul{padding:0;list-style:none}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--green);outline-offset:3px;border-radius:4px}
.hero :focus-visible,.talk :focus-visible,.foot :focus-visible{outline-color:var(--green-glow)}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-80px;z-index:60;background:var(--white);color:var(--ink);padding:12px 16px;border-radius:6px;text-decoration:none;font-weight:500}
.skip:focus{top:12px}
.wrap{width:100%;max-width:1248px;margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.mono{font-family:var(--f-mono)}
.eyebrow{margin:0 0 16px;font-family:var(--f-mono);font-size:13px;font-weight:400;letter-spacing:.08em;text-transform:uppercase;color:var(--mute-2)}
.h2{font-family:var(--f-head);font-weight:700;font-size:clamp(30px,4vw,52px);line-height:1.04;letter-spacing:-.03em;text-wrap:balance}
.lead{margin-top:20px;font-size:18px;color:var(--mute)}
.sec{padding:var(--sec) 0}
.sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 32px}
.link-soon{font-weight:600;color:var(--mute-2);white-space:nowrap} /* página ainda não existe: texto sem link */
.link-more{display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:var(--ink);text-decoration:none;white-space:nowrap;border-bottom:1px solid transparent;transition:color .2s}
.link-more:hover{color:var(--green)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 22px;border-radius:var(--r-btn);font:500 16px/1.2 var(--f-body);text-decoration:none;text-align:center;transition:background-color .2s,border-color .2s,color .2s}
.btn-primary{background:var(--green);color:#fff}
.btn-primary:hover{background:var(--green-hover)}
.btn-ghost{border:1px solid #5A5A5A;color:var(--on-dark)}
.btn-ghost:hover{border-color:#A8A8A8}
.btn-lg{min-height:54px;padding:15px 24px}

/* ============ 3.1 Topo ============ */
.hero{position:relative;background:var(--dark);color:var(--on-dark)}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:64px 64px;background-position:center top}
.hero-pin{position:relative;display:flex;flex-direction:column}
.nav{position:relative;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:18px;padding-bottom:18px}
.brand{font:700 24px/1 var(--f-head);letter-spacing:-.03em;color:var(--on-dark);text-decoration:none;padding:10px 0}
.menu{display:flex;align-items:center;gap:28px;font-size:15px}
.menu a:not(.btn){color:var(--on-dark-2);text-decoration:none;padding:12px 0}
.menu a:not(.btn):hover{color:#fff}
.menu .btn{min-height:44px;padding:10px 18px;font-size:15px}
.menu-btn{display:none}

.hero-body{flex:1 1 auto;display:grid;grid-template-columns:minmax(0,700px);grid-template-areas:"copy" "cta";align-content:center;padding-top:48px;padding-bottom:132px}
.hero-copy{grid-area:copy;position:relative;z-index:2}
.hero .eyebrow{margin-bottom:20px;color:var(--on-dark-3)}
.hero-title{font:700 clamp(42px,6vw,84px)/.98 var(--f-head);letter-spacing:-.035em}
.hero-title .w{display:inline-block;vertical-align:top}
.hero-sub{margin-top:28px;max-width:540px;font-size:20px;line-height:1.5;color:var(--on-dark-2)}
.hero-cta{grid-area:cta;position:relative;z-index:2;margin-top:36px;display:flex;flex-wrap:wrap;gap:12px}
/* A animação é o fundo do topo inteiro (desktop): sem caixa, mesma cor, de borda a borda */
.flow{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.flow canvas{position:absolute;inset:0;width:100%;height:100%;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 140px,#000 calc(100% - 120px),transparent);
  mask-image:linear-gradient(180deg,transparent 0,#000 140px,#000 calc(100% - 120px),transparent)}
.flow svg.flow-static{position:absolute;top:0;right:0;bottom:0;left:auto;width:56%;height:100%}
.flow-tag{position:absolute;bottom:40px;font:12px/1 var(--f-mono);letter-spacing:.04em;color:var(--on-dark-3)}
.flow-tag-a{left:max(24px,calc(50% - 600px))}.flow-tag-b{right:max(24px,calc(50% - 600px))}
.flow.has-canvas .flow-static{display:none}
.flow-bar{position:absolute;left:calc(max(24px,calc(50% - 600px)) + 78px);right:calc(max(24px,calc(50% - 600px)) + 74px);bottom:45px;height:1px;background:#383838}
.flow-bar i{position:absolute;inset:0;background:var(--green-glow);transform-origin:left center}
.hero-title .w-end{color:var(--green-glow)}

/* ============ 3.2 Prova ============ */
.proof{background:var(--white);border-bottom:1px solid var(--line);padding:48px 0 54px}
.proof .eyebrow{text-align:center;font-size:12px;margin-bottom:30px}
.logos{--lh:28px;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:30px 52px}
.logos li{flex:0 0 auto}
.logos[hidden]{display:none}
.logos img{height:calc(var(--lh) * var(--k,1));width:auto;max-width:none;filter:grayscale(1);opacity:.62;transition:filter .3s,opacity .3s}
.logos img:hover{filter:none;opacity:1}

/* ============ 3.3 Para quem ============ */
.who{position:relative;background-image:linear-gradient(rgba(20,20,20,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(20,20,20,.045) 1px,transparent 1px);background-size:64px 64px;background-position:center top}
.who-grid{display:grid;grid-template-columns:minmax(0,4.6fr) minmax(0,7.4fr);gap:64px;align-items:center}
.who-side .h2{font-size:clamp(32px,3.6vw,50px)}
.who-meter{margin-top:40px;display:flex;align-items:center;gap:14px;max-width:320px}
.wm-n{min-width:32px;font:500 13px/1 var(--f-mono);color:var(--green)}
.wm-bar{position:relative;flex:1;height:2px;background:var(--line)}
.wm-bar i{position:absolute;inset:0;background:var(--green);transform-origin:left center}
.pains{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
/* --p (0 a 1) é o avanço da varredura no cartão; sem movimento, fica em 1 (estado final) */
.pain{--p:1;--s:0;position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;gap:14px;min-height:252px;padding:20px 22px 22px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-card);box-shadow:0 1px 0 rgba(20,20,20,.03)}
.pain::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--green-l);opacity:calc(var(--p) * var(--p))}
.pain::after{content:"";position:absolute;inset:-1px;border:1px solid var(--green);border-radius:inherit;pointer-events:none;transition:opacity .4s}
.pain-top{display:flex;align-items:center;justify-content:space-between}
.pain-n{font:500 12px/1 var(--f-mono);letter-spacing:.06em;color:var(--mute-2)}
.pain-ico{width:24px;height:24px;color:var(--green)}
.pain-before{font-size:16px;line-height:1.45;color:var(--mute-2)}
.pain-before s{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 58%/calc(var(--p) * 100%) 1.5px no-repeat;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.pain-spark{position:relative;height:52px;margin-top:auto}
.pain-spark svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ps-a{clip-path:inset(-6px -6px -6px calc(var(--p) * 100%))}
.ps-b{clip-path:inset(-6px calc((1 - var(--p)) * 100%) -6px -6px)}
.ps-jag{fill:none;stroke:#A8A8A2;stroke-width:1.5;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.ps-line{fill:none;stroke:var(--green);stroke-width:2;vector-effect:non-scaling-stroke}
.ps-area{fill:rgba(13,92,69,.1)}
.pain-after{font:600 20px/1.25 var(--f-head);letter-spacing:-.01em;color:var(--green-d);clip-path:inset(-6px calc((1 - var(--p)) * 100%) -6px -2px)}
/* linha de varredura */
.pain-scan{position:absolute;inset:0;pointer-events:none;transform:translateX(calc(var(--p) * 100%));opacity:var(--s)}
.pain-scan::before{content:"";position:absolute;top:0;bottom:0;right:100%;width:96px;background:linear-gradient(90deg,transparent,rgba(76,187,145,.16))}
.pain-scan i{position:absolute;top:0;bottom:0;left:-1px;width:2px;background:var(--green);box-shadow:0 0 16px 3px rgba(76,187,145,.5)}

/* ============ 3.4 Onde você ganha ============ */
.gain-grid{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:72px;align-items:start}
.gain-side{position:sticky;top:96px}
.gain-side .h2{font-size:clamp(30px,3.4vw,44px)}
.gain-list{position:relative;margin-top:36px;font-size:16px}
.gain-list li{border-top:1px solid var(--line)}
.gain-list li:last-child{border-bottom:1px solid var(--line)}
.gain-list a{display:flex;align-items:center;gap:14px;min-height:48px;text-decoration:none;color:var(--mute-2);transition:color .25s}
.gain-list a:hover{color:var(--ink)}
.gain-list a[aria-current="true"]{color:var(--ink);font-weight:600}
.gl-dot{flex:0 0 10px;height:10px;border-radius:50%;background:#C9C9C4;transition:background-color .25s}
.gain-list a[aria-current="true"] .gl-dot{background:var(--green)}
.gain-tabs{display:none}
.gain-cards{display:flex;flex-direction:column;gap:24px}
.gain-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:32px;align-items:center;min-height:340px;padding:36px;background:var(--white);border:1px solid var(--line);border-radius:16px;scroll-margin-top:22vh}
.gc-n{font:500 13px/1 var(--f-mono);color:var(--mute-2)}
.gain-card h3{margin-top:12px;font:700 clamp(32px,3.2vw,44px)/1 var(--f-head);letter-spacing:-.03em}
.gain-card p{margin-top:14px;font-size:18px;line-height:1.45;color:var(--mute)}
.gc-art{position:relative;aspect-ratio:7/5;border-radius:12px;background-color:var(--paper);background-image:radial-gradient(#D6D6D0 1px,transparent 1.2px);background-size:14px 14px;overflow:hidden}
.gc-art svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.art-ink{stroke:var(--ink)}.art-g{stroke:var(--green)}
.br-val{transform:scaleX(var(--g1));transform-origin:40px 0}
.rl-hour{transform:rotate(-60deg);transform-origin:104px 100px}
.cy-orbit{transform:rotate(40deg);transform-origin:140px 100px}

/* ============ 3.5 Como começar ============ */
.steps-wrap{position:relative;margin-top:48px}
.rail{position:absolute;top:-1px;left:33px;height:2px;width:calc((100% - 32px) / 3 * 2 + 32px)}
.rail-base{position:absolute;inset:0;background:repeating-linear-gradient(90deg,#C9C9C4 0 6px,transparent 6px 12px)}
.rail-fill{position:absolute;inset:0;background:var(--green);transform-origin:left center}
.step-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding-top:36px}
.step{position:relative;isolation:isolate;display:flex;flex-direction:column;gap:12px;padding:24px;background:var(--white);border:1px solid var(--line);border-radius:12px}
.step::before{content:"";position:absolute;inset:-1px;z-index:-1;border:2px solid var(--green);border-radius:inherit;opacity:0}
.step-1::before{opacity:1}
.step-node{position:absolute;top:-45px;left:24px;width:18px;height:18px;border-radius:50%;background:var(--green);border:2px solid var(--green)}
.rail-run{display:none}
.step-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.step-name{font:13px/1.3 var(--f-mono);color:var(--mute-2)}
.badge{font:500 11.5px/1 var(--f-mono);color:#fff;background:var(--green);border-radius:999px;padding:5px 10px}
.step-time{font:700 clamp(32px,3.2vw,42px)/1.05 var(--f-head);letter-spacing:-.03em;transform-origin:left bottom}
.step-promise{font-weight:600;font-size:18px;line-height:1.4}
.steps-note{margin-top:22px;font-size:15px;color:var(--mute-2)}

/* ============ 3.6 Sócios ============ */
.team{padding-top:24px}
.team .h2{font-size:clamp(28px,3vw,38px)}
.partners{margin-top:36px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.partner{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"pic" "num" "cap" "role" "quote" "name";align-content:start}
.portrait{grid-area:pic;position:relative;aspect-ratio:1/1;border-radius:12px;overflow:hidden;background:#E3DED4}
.portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.portrait canvas{position:absolute;inset:0;width:100%;height:100%}
.portrait.has-dots{background-color:var(--dark);background-image:radial-gradient(#262626 1px,transparent 1.3px);background-size:6.5px 6.5px}
.portrait.has-dots img{opacity:0;transition:opacity .5s}
.portrait.has-dots canvas{transition:opacity .5s}
@media (hover:hover){.portrait.has-dots:hover img{opacity:1}.portrait.has-dots:hover canvas{opacity:0}}
.p-num{grid-area:num;margin-top:22px;font:700 clamp(64px,7vw,104px)/.9 var(--f-head);letter-spacing:-.05em}
.p-cap{grid-area:cap;margin-top:8px;font:12px/1.4 var(--f-mono);color:var(--mute-2)}
.p-role{grid-area:role;margin-top:16px;font:500 13px/1.3 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--green)}
.p-quote{grid-area:quote;margin-top:10px;font:600 22px/1.2 var(--f-head);letter-spacing:-.01em}
.p-name{grid-area:name;margin-top:14px;font-size:14px;font-weight:600}

/* ============ 3.7 Conversa e rodapé ============ */
.talk{background:var(--dark);color:var(--on-dark)}
.talk-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:32px;padding-top:104px;padding-bottom:104px}
.talk-in > div{flex:999 1 520px}
.talk p{margin-top:16px;color:var(--on-dark-2);font-size:18px}
.talk .btn{min-height:58px;padding:18px 28px;font-size:17px}
.foot{background:var(--dark);color:var(--on-dark-3);border-top:1px solid var(--dark-line);font:12px/1.5 var(--f-mono)}
.foot-in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 16px;padding-top:20px;padding-bottom:20px}
.foot a{color:var(--on-dark-2);text-decoration:none;display:inline-block;padding:6px 0}
.foot a:hover{color:#fff;text-decoration:underline}

/* ============ Telas médias ============ */
@media (max-width:1180px){
  .gain-card{grid-template-columns:minmax(0,1fr)}
  .gc-art{max-width:420px}
}

/* ============ Celular (abaixo de 900 px) ============ */
@media (max-width:899px){
  :root{--pad:20px;--sec:56px}
  body{font-size:16px;line-height:1.5}
  .eyebrow{font-size:11px;margin-bottom:10px}
  .h2{font-size:28px;line-height:1.1}
  .lead{margin-top:14px;font-size:16px}

  .nav{padding-top:12px;padding-bottom:12px}
  .brand{font-size:21px}
  .menu-btn{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:1px solid #3A3A3A;border-radius:8px;background:#1F1F1F;cursor:pointer}
  .menu{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:4px var(--pad) 20px;background:var(--dark-2);border-top:1px solid var(--dark-line);border-bottom:1px solid var(--dark-line);font-size:17px}
  .menu.open{display:flex}
  html:not(.js) .menu{display:flex;position:static;padding:0;border:0;background:none}
  html:not(.js) .menu-btn{display:none}
  .menu a:not(.btn){padding:14px 0;border-bottom:1px solid var(--dark-line)}
  .menu .btn{margin-top:16px;min-height:52px;font-size:16px;border-radius:8px}

  .hero-body{grid-template-columns:minmax(0,1fr);grid-template-areas:"copy" "fig" "cta";padding-top:24px;padding-bottom:40px}
  /* celular: faixa de borda a borda entre o texto e os botões, sem moldura */
  .flow{position:relative;inset:auto;grid-area:fig;margin:20px calc(var(--pad) * -1) 0;aspect-ratio:39/24}
  .flow canvas{-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 84%,transparent);mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 84%,transparent)}
  .flow svg.flow-static{left:0;width:100%}
  .hero .eyebrow{margin-bottom:12px}
  .hero-sub{margin-top:16px;font-size:17px}
  .flow-tag{bottom:4px;font-size:10.5px}.flow-tag-a{left:var(--pad)}.flow-tag-b{right:var(--pad)}
  .flow-bar{left:calc(var(--pad) + 62px);right:calc(var(--pad) + 58px);bottom:9px}
  .portrait.has-dots{background-size:3px 3px}
  .hero-cta{margin-top:24px;flex-direction:column;gap:10px}
  .hero-cta .btn{width:100%;border-radius:8px;min-height:52px}

  .proof{padding:32px 0 34px}
  .proof .eyebrow{font-size:11px;margin-bottom:20px}
  .logos{--lh:22px;gap:22px 32px}

  .who-grid{grid-template-columns:minmax(0,1fr);gap:20px}
  .who-meter{display:none}
  .pains{grid-template-columns:minmax(0,1fr);gap:10px}
  .pain{min-height:0;padding:16px 16px 18px;gap:10px}
  .pain-before{font-size:15px}
  .pain-spark{height:40px;margin-top:2px}
  .pain-after{font-size:18px}

  .gain{padding-top:8px}
  .gain-grid{grid-template-columns:minmax(0,1fr);gap:0}
  .gain-side{position:static}
  .gain-list{display:none}
  .gain-tabs{margin-top:20px;display:flex;gap:2px;padding:4px;background:var(--white);border:1px solid var(--line);border-radius:999px;overflow-x:auto;scrollbar-width:none}
  .gain-tabs::-webkit-scrollbar{display:none}
  .gain-tabs button{flex:1 0 auto;min-height:44px;padding:8px 9px;border:0;border-radius:999px;background:none;color:var(--mute-2);font-size:13px;white-space:nowrap;cursor:pointer;transition:background-color .25s,color .25s}
  .gain-tabs button[aria-selected="true"]{background:var(--green);color:#fff;font-weight:600}
  .gain-cards{flex-direction:row;gap:12px;margin:12px calc(var(--pad) * -1) 0;padding:0 var(--pad);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--pad);scrollbar-width:none;overscroll-behavior-x:contain}
  .gain-cards::-webkit-scrollbar{display:none}
  .gain-card{flex:0 0 100%;scroll-snap-align:start;grid-template-columns:minmax(0,1fr);gap:16px;min-height:0;padding:20px;align-content:start}
  .gc-art{order:-1;max-width:none;aspect-ratio:auto;height:150px}
  .gain-card h3{margin-top:8px;font-size:28px}
  .gain-card p{margin-top:6px;font-size:16px}

  .steps-wrap{margin-top:24px}
  .rail{top:9px;left:8px;width:2px;height:calc(100% - 9px - var(--last,120px))}
  .rail-base{background:#C9C9C4}
  .rail-fill{transform-origin:center top}
  .step-list{grid-template-columns:minmax(0,1fr);gap:0;padding:0 0 0 36px}
  .step{padding:0 0 28px;background:none;border:0;border-radius:0;gap:4px}
  .step:last-child{padding-bottom:0}
  .step::before{display:none}
  .step-node{top:1px;left:-36px}
  .step-top{justify-content:flex-start}
  .step-name{font-size:12px}
  .badge{font-size:10.5px;padding:4px 8px}
  .step-time{font-size:26px}
  .step-promise{font-size:15px;font-weight:400}
  .steps-note{margin-top:20px;font-size:14px}

  .team{padding-top:8px}
  .team .h2{font-size:24px}
  .partners{margin-top:16px;grid-template-columns:minmax(0,1fr);gap:16px}
  .partner{grid-template-columns:96px auto minmax(0,1fr);grid-template-areas:"pic num num" "pic role role" "pic quote quote" "pic name cap";column-gap:0;padding-top:16px;border-top:1px solid var(--line)}
  .p-num,.p-role,.p-quote,.p-name{padding-left:14px}
  .portrait{aspect-ratio:auto;height:120px;align-self:start}
  .p-num{margin-top:0;font-size:48px;line-height:.95;letter-spacing:-.04em}
  .p-role{margin-top:6px;font-size:11px}
  .p-quote{margin-top:8px;font-size:18px}
  .p-name{margin-top:4px;font-size:13px}
  .p-cap{margin-top:4px;padding-left:5px;font-size:13px;font-family:var(--f-body);line-height:1.5}
  .p-cap::before{content:"· "}

  .talk-in{padding-top:48px;padding-bottom:40px;gap:20px}
  .talk-in > div{flex-basis:100%}
  .talk p{margin-top:12px;font-size:16px}
  .talk .btn{width:100%;min-height:54px;border-radius:8px;font-size:16px}
  .foot-in{flex-direction:column;padding-top:16px;padding-bottom:24px}
}
@media (max-width:370px){
  .gain-tabs button{font-size:12px;padding:8px 7px}
}

/* =====================================================================
   Movimento. Tudo abaixo só vale com html.m (sem prefers-reduced-motion).
   Sem html.m, valem os estados finais definidos acima.
   ===================================================================== */

/* 3.1 Título revelado palavra por palavra */
.m .hero-title .w{animation:word-in .9s var(--ease) both}
.m .hero-title .w:nth-child(2){animation-delay:.09s}
.m .hero-title .w:nth-child(3){animation-delay:.18s}
.m .hero-title .w:nth-child(4){animation-delay:.27s}
@keyframes word-in{from{opacity:0;transform:translateY(.32em)}to{opacity:1;transform:none}}
.m .hero-title .w-end{color:var(--on-dark);transition:color .7s}
.m .hero-title .w-end.on{color:var(--green-glow)}

/* 3.1 Topo fixo (~1,5 tela) enquanto a margem se forma. Só desktop; rolagem nativa (sticky). */
@media (min-width:900px){
  .m #topo{height:250vh}
  .m #topo .hero-pin{position:sticky;top:min(0px,calc(100vh - 680px));height:100vh;min-height:680px}
  .m .flow-bar i{transform:scaleX(0)}
}

/* 3.2 Faixa de logos (montada pelo home.js) */
.marquee{margin:0 calc(var(--pad) * -1);overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.lane{display:flex;width:max-content;animation:marquee var(--dur,50s) linear infinite}
.lane + .lane{margin-top:18px}
.lane.rev{animation-direction:reverse}
.lane-set{display:flex;align-items:center;gap:56px;padding-right:56px;--lh:28px}
.lane-set li{flex:0 0 auto}
.lane-set img{height:calc(var(--lh) * var(--k,1));width:auto;max-width:none;filter:grayscale(1);opacity:.62;transition:filter .3s,opacity .3s}
.lane-set img:hover{filter:none;opacity:1}
.marquee:hover .lane,.marquee.off .lane{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}
@media (max-width:899px){.lane-set{gap:36px;padding-right:36px;--lh:22px}.lane + .lane{margin-top:14px}}

/* 3.3 Para quem: varredura guiada pela rolagem (o JS escreve --p e --s em cada cartão) */
.m .pain{--p:0}
.m .pain:not(.ok)::after{opacity:0}
.m .pain:not(.ok) .pain-ico{color:#B9B9B4}
.m .pain:not(.ok) .pi-check{opacity:0}
.m .pain-ico,.m .pi-check{transition:color .3s,opacity .3s}
.m .pain:not(.ok) .pain-before{color:var(--ink)}
.m .pain-before{transition:color .4s}
@media (min-width:900px){
  .m #para-quem{height:300vh;padding:0}
  .m .who-pin{position:sticky;top:min(0px,calc(100vh - 680px));height:100vh;min-height:680px;display:flex;align-items:center}
  .m .who-pin > .wrap{width:100%}
}

/* 3.4 Onde você ganha: cartão da vez + microanimações (só transform e opacity) */
.gl-cursor{position:absolute;left:0;top:0;width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(13,92,69,.14);transition:transform .45s var(--ease);pointer-events:none}
@media (min-width:900px){
  .m .gain-cards{gap:16vh;padding:6vh 0 10vh}
  /* fora da vez: a ilustração esmaece; o texto continua com contraste AA */
  .m .gain-card{min-height:400px;transform:scale(.965);transition:transform .6s var(--ease),border-color .5s,box-shadow .5s}
  .m .gain-card h3{color:var(--mute-2);transition:color .5s}
  .m .gain-card .gc-art{opacity:.3;transition:opacity .5s}
  .m .gain-card.act{transform:none;border-color:#CBD9D2;box-shadow:0 18px 40px -24px rgba(13,92,69,.35)}
  .m .gain-card.act h3{color:var(--ink)}
  .m .gain-card.act .gc-art{opacity:1}
  .m .gain-list .gl-dot{background:#C9C9C4}
}
.m .fn-l{transform:rotate(26deg);transform-origin:124px 116px;transition:transform 1.1s var(--ease)}
.m .fn-r{transform:rotate(-26deg);transform-origin:156px 116px;transition:transform 1.1s var(--ease)}
.m .play .fn-l,.m .play .fn-r{transform:none}
.m .fn-out circle{opacity:0;transform:scale(.3);transform-box:fill-box;transform-origin:center;transition:opacity .35s,transform .45s var(--ease)}
.m .play .fn-out circle{opacity:1;transform:none}
.m .play .fn-out circle:nth-child(1){transition-delay:.7s}.m .play .fn-out circle:nth-child(2){transition-delay:.85s}
.m .play .fn-out circle:nth-child(3){transition-delay:1s}.m .play .fn-out circle:nth-child(4){transition-delay:1.15s}
.m .play .fn-out circle:nth-child(5){transition-delay:1.3s}.m .play .fn-out circle:nth-child(6){transition-delay:1.45s}
.m .play .fn-out circle:nth-child(7){transition-delay:1.6s}.m .play .fn-out circle:nth-child(8){transition-delay:1.75s}
.m .fn-drop circle{opacity:0}
.m .act .fn-drop circle{animation:fn-drop 1.5s cubic-bezier(.5,0,.8,.6) infinite}
.m .act .fn-drop circle:nth-child(2){animation-delay:.5s}.m .act .fn-drop circle:nth-child(3){animation-delay:1s}
@keyframes fn-drop{0%{opacity:0;transform:translateY(-8px)}15%{opacity:1}80%{opacity:1}100%{opacity:0;transform:translateY(40px)}}
.m .act .fn-in circle{animation:fn-in 2.4s ease-in-out infinite alternate}
.m .act .fn-in circle:nth-child(2n){animation-delay:-1.2s}.m .act .fn-in circle:nth-child(3n){animation-delay:-.6s}
@keyframes fn-in{to{transform:translateY(5px)}}

.m .cy-ring{opacity:0;transform:scale(.55) rotate(-120deg);transform-origin:140px 100px;transition:opacity .5s,transform 1.1s var(--ease)}
.m .play .cy-ring{opacity:1;transform:none}
.m .play .cy-2{transition-delay:.3s}.m .play .cy-3{transition-delay:.6s}
.m .cy-spin{transform-origin:140px 100px}
.m .act .cy-1 .cy-spin{animation:spin 7s linear infinite}
.m .act .cy-2 .cy-spin{animation:spin 10s linear infinite}
.m .act .cy-3 .cy-spin{animation:spin 13s linear infinite}
.m .cy-orbit{opacity:0;transition:opacity .4s 1.2s}
.m .play .cy-orbit{opacity:1}
.m .act .cy-orbit{animation:spin-from 4.5s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes spin-from{from{transform:rotate(40deg)}to{transform:rotate(400deg)}}

.m .br-val{transform:scaleX(var(--g0));transition:transform 1.3s var(--ease)}
.m .play .br-val{transform:scaleX(var(--g1))}
.m .play .br-row:nth-child(3) .br-val{transition-delay:.12s}
.m .play .br-row:nth-child(4) .br-val{transition-delay:.24s}
.m .play .br-row:nth-child(5) .br-val{transition-delay:.36s}

.m .rl-min{transform-origin:104px 100px;transition:transform 2.2s cubic-bezier(.3,.1,.2,1)}
.m .rl-hour{transform:none;transition:transform 2.2s cubic-bezier(.3,.1,.2,1)}
.m .play .rl-min{transform:rotate(-720deg)}
.m .play .rl-hour{transform:rotate(-60deg)}
.m .rl-sweep{opacity:0;transition:opacity .6s 1.6s}
.m .play .rl-sweep{opacity:1}
.m .rl-b{opacity:0;transform:translate(-114px,var(--dy)) scale(.2);transform-box:fill-box;transform-origin:center;transition:opacity .4s,transform .8s var(--ease)}
.m .play .rl-b{opacity:1;transform:none;transition-delay:calc(.5s + var(--i) * .32s)}

/* 3.5 Como começar: linha que se completa com a rolagem + ponto em loop de 6 s */
.m .step-node{background:var(--white);border-color:#C9C9C4;transition:background-color .3s,border-color .3s}
.m .step.lit .step-node{background:var(--green);border-color:var(--green)}
.m .rail-fill{transform:scaleX(0)}
@media (min-width:900px){
  .rail-run{position:absolute;left:0;top:-5px;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px rgba(13,92,69,.16);opacity:0}
  .m .run .rail-run{display:block;animation:rail-run 6s linear infinite}
  .m .run .step::before{opacity:0;animation:step-lit 6s linear infinite}
  .m .run .step-time{animation:step-time 6s linear infinite}
  .m .run .step-2::before,.m .run .step-2 .step-time{animation-delay:-4s}
  .m .run .step-3::before,.m .run .step-3 .step-time{animation-delay:-2s}
  .m .steps-wrap.off .rail-run,.m .steps-wrap.off .step::before,.m .steps-wrap.off .step-time{animation-play-state:paused}
}
@keyframes rail-run{
  0%{transform:translateX(0);opacity:0}4%{opacity:1}
  18%{transform:translateX(0);animation-timing-function:cubic-bezier(.6,0,.4,1)}
  33.33%{transform:translateX(calc(var(--rw,600px) * .5))}
  51.33%{transform:translateX(calc(var(--rw,600px) * .5));animation-timing-function:cubic-bezier(.6,0,.4,1)}
  66.67%{transform:translateX(var(--rw,600px))}
  90%{transform:translateX(var(--rw,600px));opacity:1}
  97%,100%{transform:translateX(var(--rw,600px));opacity:0}
}
@keyframes step-lit{0%,24%{opacity:1}30%,94%{opacity:0}100%{opacity:1}}
@keyframes step-time{0%,24%{transform:scale(1.06);color:var(--green)}30%,94%{transform:none;color:var(--ink)}100%{transform:scale(1.06);color:var(--green)}}
@media (max-width:899px){
  .m .rail-fill{transform:scaleY(0)}
  .gl-cursor{display:none}
}

/* 3.6 Placar de aeroporto */
.flap{display:inline-flex}
.fc{position:relative;display:inline-block}
.fc-w{visibility:hidden}
.fc-v{position:absolute;inset:0;text-align:center;backface-visibility:hidden}
.fc-v.tick{animation:flip .12s ease-out}
@keyframes flip{from{transform:perspective(300px) rotateX(-80deg);opacity:.3}to{transform:none;opacity:1}}
.p-num{position:relative}
.p-num.flipping::after{content:"";position:absolute;left:0;right:0;top:46%;height:2px;background:var(--paper);pointer-events:none}

/* =====================================================================
   Páginas internas v2 (Como trabalhamos, Conheça o time, Privacidade)
   ===================================================================== */
.menu a[aria-current="page"]{color:#fff}
.page-hero{padding-top:56px;padding-bottom:88px}
.page-hero h1{max-width:980px;font:700 clamp(38px,5vw,68px)/1.02 var(--f-head);letter-spacing:-.035em;text-wrap:balance}
.page-hero .hero-sub{max-width:640px}
.principles{margin-top:56px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.principles li{padding:22px;border:1px solid var(--dark-line);border-radius:12px;background:rgba(255,255,255,.02);color:var(--on-dark-2);font-size:15.5px;line-height:1.5}
.principles b{display:block;margin-bottom:6px;color:var(--on-dark);font:600 18px/1.25 var(--f-head);letter-spacing:-.01em}
.principles .pi-n{display:block;margin-bottom:18px;font:12px/1 var(--f-mono);color:var(--green-glow)}

.sec-white{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:72px;align-items:start}
.split > :first-child{position:sticky;top:96px}
.split .h2{font-size:clamp(30px,3.6vw,48px)}
.nw{white-space:nowrap}

/* Uma terça-feira comum */
.day{border-left:2px solid var(--line);margin-left:6px}
.day li{position:relative;display:grid;grid-template-columns:72px minmax(0,1fr);gap:20px;padding:0 0 30px 28px}
.day li:last-child{padding-bottom:0}
.day li::before{content:"";position:absolute;left:-7px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--paper);border:2px solid #A8A8A2}
.day li:last-child::before{background:var(--ink);border-color:var(--ink)}
.day time{font:500 14px/1.6 var(--f-mono);color:var(--mute-2)}
.day p{font-size:18px;line-height:1.5}

/* O método: 6 passos em dois grupos */
.method{margin-top:48px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:12px;row-gap:14px}
.method-g{font:12px/1.2 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute-2);padding-bottom:10px;border-bottom:2px solid #C9C9C4}
.method li.method-g{display:block;padding:0 0 10px;background:none;border:0;border-bottom:2px solid #C9C9C4;border-radius:0}
.method li.method-g.auto{border-color:var(--green)}
.method-g.base{grid-column:1 / span 5}
.method-g.auto{grid-column:6 / span 1;color:var(--green);border-color:var(--green)}
.method li{padding:20px 18px 22px;background:var(--white);border:1px solid var(--line);border-radius:12px}
.method li.is-auto{background:var(--green);border-color:var(--green);color:#fff}
.method .m-n{font:12px/1 var(--f-mono);color:var(--mute-2)}
.method li.is-auto .m-n{color:#CFE6DC}
.method b{display:block;margin-top:18px;font:700 22px/1.1 var(--f-head);letter-spacing:-.02em}
.method span.m-t{display:block;margin-top:8px;font-size:15px;line-height:1.4;color:var(--mute)}
.method li.is-auto span.m-t{color:#E3F0EA}
.method-note{margin-top:28px;max-width:720px;font-size:17px;color:var(--mute)}

/* Como um projeto anda */
.journey{position:relative;margin-top:48px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.journey::before{content:"";position:absolute;left:0;right:0;top:57px;height:2px;background:var(--green)}
.m .journey::before{background:var(--line)}
.journey .j-fill{position:absolute;left:0;right:0;top:57px;height:2px;background:var(--green);transform-origin:left center}
.journey li{position:relative}
.j-phase{min-height:44px;font:12px/1.35 var(--f-mono);color:var(--mute-2)}
.j-phase b{display:block;font:600 13px/1.3 var(--f-body);color:var(--green)}
.j-dot{display:block;width:16px;height:16px;margin:6px 0 22px;border-radius:50%;background:var(--green);border:3px solid var(--paper);box-shadow:0 0 0 2px var(--green);position:relative}
.j-when{font:500 13px/1.3 var(--f-mono);color:var(--mute-2)}
.journey h3{margin-top:6px;font:700 20px/1.15 var(--f-head);letter-spacing:-.015em}
.journey p{margin-top:8px;font-size:15px;line-height:1.45;color:var(--mute)}

/* O que pedimos do seu time */
.asks{margin-top:48px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.asks li{padding:24px;border:1px solid var(--dark-line);border-radius:12px;background:rgba(255,255,255,.02)}
.asks .a-big{display:block;font:700 clamp(40px,4.4vw,60px)/.95 var(--f-head);letter-spacing:-.04em;color:var(--on-dark)}
.asks .a-unit{display:block;margin-top:6px;font:600 17px/1.3 var(--f-head);color:var(--green-glow)}
.asks p{margin-top:14px;font-size:15.5px;line-height:1.5;color:var(--on-dark-2)}
.asks-note{margin-top:28px;font-size:15px;color:var(--on-dark-3)}
.talk .eyebrow{color:var(--on-dark-3)}

/* Conheça o time */
.team-page .partners{margin-top:0}
.p-area{grid-area:area;margin-top:6px;font-size:15px;line-height:1.45;color:var(--mute)}
.team-page .partner{grid-template-areas:"pic" "num" "cap" "role" "quote" "name" "area"}

/* Por que Amatas: dois círculos (ciência e arte) que se encontram; a interseção é a Amatas */
.venn-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-areas:"top fig" "list fig";column-gap:56px;align-items:center}
.venn-top{grid-area:top;align-self:end}
.ethos-list{grid-area:list;align-self:start;margin-top:28px;display:grid;gap:10px}
.venn{grid-area:fig;margin:0}
.venn svg{display:block;width:100%;height:auto;overflow:visible}
.ethos-list li{display:grid;grid-template-columns:118px minmax(0,1fr);column-gap:14px;padding:14px 16px;background:var(--white);border:1px solid var(--line);border-radius:12px;transition:background-color .45s,border-color .45s,color .45s}
.ethos-list .e-k{grid-row:1 / span 2;padding-top:5px;font:12px/1.2 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute-2);transition:color .45s}
.ethos-list b{font:700 19px/1.2 var(--f-head);letter-spacing:-.01em}
.ethos-list p{margin-top:2px;font-size:15px;line-height:1.45;color:var(--mute);transition:color .45s}
.ethos-list li.e-mid{background:var(--green);border-color:var(--green);color:#fff}
.ethos-list li.e-mid .e-k{color:#CFE6DC}
.ethos-list li.e-mid p{color:#E3F0EA}
.v-axis line{stroke:#C9C9C4;stroke-width:1}
.v-c{stroke:var(--ink);stroke-width:1.5}
#v-lens{fill:var(--green)}
.v-lbl text,.v-mid text{text-anchor:middle}
.v-k{font:500 13px var(--f-mono);letter-spacing:.12em;fill:var(--mute)}
.v-w{font:700 24px var(--f-head);letter-spacing:-.01em;fill:var(--ink)}
.v-x path{stroke:var(--ink);stroke-width:1.2;opacity:.5}
.v-brand{font:700 32px var(--f-head);letter-spacing:-.03em;fill:#fff}
.v-sub{font:500 12px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;fill:#CFE6DC}
.m .ethos-list li.e-mid:not(.on){background:var(--white);border-color:var(--line);color:var(--ink)}
.m .ethos-list li.e-mid:not(.on) .e-k{color:var(--mute-2)}
.m .ethos-list li.e-mid:not(.on) p{color:var(--mute)}
@media (min-width:900px){
  .m #porque{height:240vh;padding:0}
  .m .venn-pin{position:sticky;top:min(0px,calc(100vh - 680px));height:100vh;min-height:680px;display:flex;align-items:center}
  .m .venn-pin > .wrap{width:100%}
}
@media (max-width:899px){
  .venn-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"top" "fig" "list";row-gap:8px}
  .venn{margin:12px -8px 0}
  .ethos-list{margin-top:8px}
  .ethos-list li{grid-template-columns:minmax(0,1fr);padding:14px}
  .ethos-list .e-k{grid-row:auto;padding-top:0}
}

/* Privacidade (texto corrido) */
.legal{max-width:760px}
.legal h2{margin:48px 0 12px;font:700 24px/1.2 var(--f-head);letter-spacing:-.015em}
.legal p,.legal li{font-size:17px;line-height:1.65;color:#2E2E2E}
.legal p + p,.legal ul + p{margin-top:12px}
.legal ul{margin-top:10px;padding-left:20px;list-style:disc}
.legal li + li{margin-top:6px}
.legal a{color:var(--green);text-underline-offset:3px}
.legal .updated{font:13px/1.4 var(--f-mono);color:var(--mute-2)}

.foot nav{display:flex;flex-wrap:wrap;gap:4px 16px}

@media (max-width:1180px){
  .principles,.asks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .method{grid-template-columns:repeat(3,minmax(0,1fr))}
  .method-g.base{grid-column:1 / -1}.method-g.auto{grid-column:1 / -1;order:6}
  .method li.is-auto{order:7}
}
@media (max-width:899px){
  .page-hero{padding-top:24px;padding-bottom:48px}
  .page-hero h1{font-size:36px;line-height:1.05}
  .principles{margin-top:32px;grid-template-columns:minmax(0,1fr);gap:10px}
  .principles li{padding:18px}
  .principles .pi-n{margin-bottom:10px}
  .split{grid-template-columns:minmax(0,1fr);gap:28px}
  .split > :first-child{position:static}
  .day li{grid-template-columns:minmax(0,1fr);gap:2px;padding-left:22px}
  .day p{font-size:16px}
  .method{margin-top:28px;grid-template-columns:minmax(0,1fr);row-gap:8px}
  .method li{padding:16px;display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:8px}
  .method .m-n{grid-row:1 / span 2;padding-top:5px}
  .method b{margin-top:0;font-size:19px}
  .method span.m-t{margin-top:2px}
  .method-g{padding-bottom:6px}
  .method-g.auto{margin-top:10px}
  .journey{margin-top:28px;grid-template-columns:minmax(0,1fr);gap:0;padding-left:28px}
  .journey::before,.journey .j-fill{left:7px;right:auto;top:8px;bottom:8px;width:2px;height:auto}
  .journey .j-fill{transform-origin:center top}
  .journey li{padding-bottom:26px}
  .journey li:last-child{padding-bottom:0}
  .j-phase{min-height:0;margin-bottom:2px}
  .j-dot{position:absolute;left:-28px;top:2px;margin:0}
  .asks{margin-top:28px;grid-template-columns:minmax(0,1fr);gap:10px}
  .asks li{padding:18px}
  /* Conheça o time: no celular, retratos grandes, um sócio por vez */
  .team-page .partners{gap:40px}
  .team-page .partner{grid-template-columns:minmax(0,1fr);grid-template-areas:"pic" "num" "cap" "role" "quote" "name" "area";padding-top:0;border-top:0}
  .team-page .portrait{aspect-ratio:1/1;height:auto}
  .team-page .portrait.has-dots{background-size:6.5px 6.5px}
  .team-page .p-num,.team-page .p-role,.team-page .p-quote,.team-page .p-name{padding-left:0}
  .team-page .p-num{margin-top:18px;font-size:64px}
  .team-page .p-cap{padding-left:0;font:12px/1.4 var(--f-mono);color:var(--mute-2)}
  .team-page .p-cap::before{content:none}
  .team-page .p-role{margin-top:12px}
  .team-page .p-quote{font-size:20px}
  .legal h2{margin-top:36px;font-size:21px}
  .legal p,.legal li{font-size:16px}
}

/* Movimento das páginas internas */
.m [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .6s var(--ease),transform .7s var(--ease)}
.m [data-reveal].in{opacity:1;transform:none}
.m .journey .j-fill{transform:scaleX(0)}
@media (max-width:899px){.m .journey .j-fill{transform:scaleY(0)}}