/* ==========================================================================
   GUTHO · folha de estilo do site · v5 (multi-página) · 09/2026
   Sistema fechado em 09/09/2026: verde #45543E, off-white #F2F0E6,
   Poppins (display) + Inter (texto) + JetBrains Mono (dados).
   Um arquivo só, compartilhado por todas as páginas.
   ========================================================================== */

:root{
  --green:#45543E;
  --green-deep:#36412F;
  --off-white:#F2F0E6;
  --graphite:#1A1A17;
  --lab:#F4F4F4;
  --paper:#E9E7DC;

  --daily:#9BC97F;
  --race:#D9902E;
  --hydrate:#9CC4D6;
  --recover:#BCBCBE;
  --fortify:#D9B2B1;

  --display:'Poppins','Helvetica Neue',Arial,sans-serif;
  --body:'Inter','Helvetica Neue',Arial,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--off-white);color:var(--graphite);
  font-family:var(--body);font-size:16px;line-height:1.65;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
:focus-visible{outline:2px solid var(--green);outline-offset:3px;}

/* ── utilitários ── */
.wrap{max-width:1120px;margin:0 auto;}
.tag{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--green);}
h1,h2,h3,h4{font-family:var(--display);font-weight:700;letter-spacing:-.01em;text-wrap:balance;}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums;}

.btn{
  display:inline-block;font-family:var(--display);font-weight:600;font-size:13px;
  letter-spacing:.1em;text-transform:uppercase;background:var(--green);color:var(--off-white);
  padding:15px 34px;border:none;cursor:pointer;transition:background .2s;
}
.btn:hover{background:var(--graphite);}
.btn-ghost{
  font-family:var(--display);font-weight:600;font-size:13px;letter-spacing:.08em;
  text-transform:uppercase;border-bottom:1px solid currentColor;padding-bottom:3px;
}

/* ── nav ── */
nav{
  position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;
  padding:16px 48px;background:var(--off-white);border-bottom:1px solid rgba(26,26,23,.1);
}
.nav-links{display:flex;gap:32px;list-style:none;}
.nav-links a{
  font-family:var(--display);font-weight:500;font-size:13px;letter-spacing:.06em;
  color:rgba(26,26,23,.75);transition:color .2s;padding-bottom:2px;
}
.nav-links a:hover{color:var(--graphite);}
.nav-links a[aria-current="page"]{color:var(--graphite);border-bottom:2px solid var(--green);}

/* ── hero da home ── */
#hero{padding-top:0;display:grid;grid-template-columns:1.05fr 1fr;align-items:center;min-height:calc(100vh - 70px);}
.hero-content{padding:80px 56px 80px 80px;}
.hero-content .tag{display:block;margin-bottom:28px;}
.hero-title{font-size:clamp(38px,4.6vw,66px);line-height:1.03;letter-spacing:-.02em;margin-bottom:26px;}
.hero-title span{color:var(--green);}
.hero-sub{font-size:17px;line-height:1.6;color:rgba(26,26,23,.78);max-width:460px;margin-bottom:40px;}
.hero-cta{display:flex;align-items:center;gap:28px;flex-wrap:wrap;}
.hero-note{margin-top:44px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(26,26,23,.5);}
.hero-image{height:100%;min-height:420px;background:var(--paper);display:flex;align-items:center;justify-content:center;padding:48px;}
.hero-image img{max-height:520px;width:auto;object-fit:contain;}

/* ── cabeçalho de página interna ── */
.page-hero{background:var(--green-deep);color:var(--off-white);padding:72px 80px 64px;}
.page-hero .tag{color:rgba(242,240,230,.7);display:block;margin-bottom:16px;}
.page-hero h1{font-size:clamp(32px,4.4vw,56px);line-height:1.05;letter-spacing:-.02em;max-width:16ch;}
.page-hero p{margin-top:20px;font-size:17px;line-height:1.6;color:rgba(242,240,230,.85);max-width:56ch;}

/* ── bloco de problema ── */
#dor{background:var(--graphite);color:var(--off-white);padding:110px 80px;}
.dor-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start;}
.dor-grid .tag{color:var(--daily);display:block;margin-bottom:26px;}
.dor-title{font-size:clamp(30px,3.4vw,48px);line-height:1.1;}
.dor-body{margin-top:32px;font-size:16px;line-height:1.75;color:rgba(242,240,230,.82);}
.stats{display:flex;flex-direction:column;gap:36px;}
.stat-num{font-family:var(--display);font-weight:700;font-size:52px;line-height:1;color:var(--daily);letter-spacing:-.03em;}
.stat-label{font-size:14px;line-height:1.6;color:rgba(242,240,230,.8);margin-top:8px;max-width:420px;}
.stat-cite{font-family:var(--mono);font-size:11px;color:rgba(242,240,230,.55);margin-top:8px;}
.dor-foot{margin-top:40px;font-size:12px;line-height:1.7;color:rgba(242,240,230,.55);border-top:1px solid rgba(242,240,230,.15);padding-top:20px;}

/* ── faixa de citação ── */
#atleta{position:relative;min-height:440px;display:flex;align-items:flex-end;background:var(--graphite);overflow:hidden;}
.atleta-bg{position:absolute;inset:0;}
.atleta-bg img{width:100%;height:100%;object-fit:cover;object-position:center top;opacity:.42;filter:grayscale(1) contrast(1.25);}
.atleta-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(26,26,23,.88) 0%,rgba(26,26,23,.6) 46%,rgba(26,26,23,.18) 100%);}
.atleta-in{position:relative;z-index:2;padding:64px 80px;max-width:720px;}
.atleta-q{font-family:var(--display);font-weight:600;font-size:clamp(24px,3vw,40px);line-height:1.22;color:var(--off-white);}
.atleta-src{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(242,240,230,.6);margin-top:20px;}

/* ── cabeçalho de seção ── */
.sec{padding:100px 80px;}
.sec-head{margin-bottom:56px;max-width:640px;}
.sec-head .tag{display:block;margin-bottom:18px;}
.sec-head h2{font-size:clamp(28px,3.2vw,44px);line-height:1.12;}
.sec-head p{margin-top:18px;font-size:16px;color:rgba(26,26,23,.75);}

/* ── três momentos ── */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;}
.step{background:var(--graphite);color:var(--off-white);padding:44px 34px;}
.step:first-child{background:var(--green);}
.step-n{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:rgba(242,240,230,.62);margin-bottom:24px;}
.step h3{font-size:19px;line-height:1.25;margin-bottom:12px;}
.step p{font-size:14px;line-height:1.7;color:rgba(242,240,230,.82);}

/* ── produtos ── */
.prod{padding:100px 80px;}
.prod-in{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center;}
.prod-in.rev .prod-vis{order:2;}
.prod-vis{display:flex;align-items:center;justify-content:center;min-height:380px;padding:36px;background:var(--paper);}
.prod-vis img{max-height:420px;width:auto;object-fit:contain;}
.prod-rank{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;opacity:.7;margin-bottom:14px;}
.prod-name{font-size:clamp(34px,4vw,54px);line-height:1;letter-spacing:-.03em;margin-bottom:6px;}
.prod-name .n{font-family:var(--mono);font-weight:400;font-size:.5em;letter-spacing:0;opacity:.6;margin-left:10px;vertical-align:super;}
.prod-desc-line{
  font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;
  padding:10px 0;border-top:2px solid;border-bottom:1px solid rgba(26,26,23,.15);margin:22px 0 26px;
}
.prod-body{font-size:16px;line-height:1.7;color:rgba(26,26,23,.8);margin-bottom:28px;max-width:440px;}
.prod-spec{list-style:none;border-top:1px solid rgba(26,26,23,.15);}
.prod-spec li{display:flex;gap:16px;padding:11px 0;border-bottom:1px solid rgba(26,26,23,.1);font-size:14px;}
.prod-spec .k{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;opacity:.62;min-width:108px;padding-top:2px;}
.prod-spec .v{color:rgba(26,26,23,.85);}

#race{background:var(--green);color:var(--off-white);}
#race .prod-vis{background:rgba(0,0,0,.14);}
#race .prod-desc-line{border-top-color:var(--race);border-bottom-color:rgba(242,240,230,.2);}
#race .prod-body{color:rgba(242,240,230,.85);}
#race .prod-spec{border-top-color:rgba(242,240,230,.2);}
#race .prod-spec li{border-bottom-color:rgba(242,240,230,.14);}
#race .prod-spec .v{color:rgba(242,240,230,.9);}
.hero-badge{display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;background:var(--race);color:var(--graphite);padding:6px 12px;margin-bottom:18px;}
#daily{background:var(--off-white);}
#daily .prod-desc-line{border-top-color:var(--daily);}
#hydrate{background:var(--lab);}
#hydrate .prod-vis{background:#E4E4E4;}
#hydrate .prod-desc-line{border-top-color:var(--hydrate);}

/* ── complementos ── */
.comp-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px;}
.comp{background:var(--paper);padding:40px 36px;display:grid;grid-template-columns:120px 1fr;gap:26px;align-items:center;}
.comp img{max-height:170px;width:auto;margin:0 auto;}
.comp h3{font-size:26px;letter-spacing:-.02em;}
.comp .line{height:3px;width:44px;margin:12px 0 14px;}
.comp p{font-family:var(--mono);font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:rgba(26,26,23,.75);line-height:1.6;}
.comp small{display:block;margin-top:12px;font-family:var(--body);font-size:13px;text-transform:none;letter-spacing:0;color:rgba(26,26,23,.62);}

/* ── protocolos ── */
.proto-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px;}
.proto{background:rgba(242,240,230,.06);padding:44px 38px;border-top:3px solid var(--daily);}
.proto:last-child{border-top-color:var(--recover);}
.proto h3{font-size:26px;letter-spacing:-.02em;}
.proto .sub{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:rgba(242,240,230,.68);margin:10px 0 22px;}
.proto ul{list-style:none;margin-bottom:22px;}
.proto li{font-size:15px;padding:8px 0;border-bottom:1px solid rgba(242,240,230,.12);color:rgba(242,240,230,.9);}
.proto p{font-size:14px;line-height:1.7;color:rgba(242,240,230,.74);}
.on-dark{background:var(--graphite);color:var(--off-white);}
.on-dark .sec-head .tag{color:var(--daily);}
.on-dark .sec-head p{color:rgba(242,240,230,.8);}

/* ── rótulo aberto ── */
.rot-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:rgba(26,26,23,.12);}
.rot-item{background:var(--off-white);padding:36px 30px;}
.rot-item svg{width:30px;height:30px;margin-bottom:16px;}
.rot-item h4{font-family:var(--display);font-weight:600;font-size:15px;margin-bottom:10px;}
.rot-item p{font-size:14px;line-height:1.65;color:rgba(26,26,23,.76);}
.rot-decl{margin-top:36px;font-size:13px;color:rgba(26,26,23,.68);}
.rot-decl strong{font-family:var(--mono);font-size:11px;letter-spacing:.15em;text-transform:uppercase;display:block;margin-bottom:10px;opacity:.72;}

/* ── texto corrido (marca, contato) ── */
.prose{max-width:64ch;}
.prose h2{font-size:24px;margin:44px 0 12px;}
.prose h2:first-child{margin-top:0;}
.prose p{margin-bottom:14px;color:rgba(26,26,23,.85);}
.prose ul{margin:0 0 16px 20px;color:rgba(26,26,23,.85);}
.prose li{margin-bottom:7px;}

/* ── quiz e lista ── */
.lista-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;}
.lista-grid h2{font-size:clamp(28px,3.2vw,42px);line-height:1.1;margin-bottom:18px;}
.lista-grid .lead{font-size:16px;line-height:1.7;color:rgba(26,26,23,.8);margin-bottom:16px;}
.lista-note{font-size:13px;color:rgba(26,26,23,.68);}
.card{background:var(--off-white);padding:44px 40px;border:1px solid rgba(26,26,23,.12);}
.q-step{display:none;}
.q-step.active{display:block;}
.q-count{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--green);margin-bottom:14px;}
.q-title{font-family:var(--display);font-weight:600;font-size:20px;line-height:1.3;margin-bottom:22px;}
.q-opts{display:flex;flex-direction:column;gap:10px;}
.q-opt{
  text-align:left;background:transparent;border:1px solid rgba(26,26,23,.22);padding:15px 18px;
  font-family:var(--body);font-size:15px;color:var(--graphite);cursor:pointer;transition:border-color .18s,background .18s;
}
.q-opt:hover{border-color:var(--green);background:rgba(69,84,62,.06);}
.q-back{margin-top:18px;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(26,26,23,.6);background:none;border:none;cursor:pointer;}
.q-result{display:none;}
.q-result.active{display:block;}
.q-result .rlabel{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--green);margin-bottom:10px;}
.q-result h3{font-size:26px;letter-spacing:-.02em;margin-bottom:6px;}
.q-result .rsub{font-size:15px;color:rgba(26,26,23,.78);margin-bottom:24px;}
.field{margin-bottom:18px;}
.flabel{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(26,26,23,.68);margin-bottom:8px;}
.finput{
  width:100%;background:var(--lab);border:1px solid rgba(26,26,23,.2);padding:14px 15px;
  font-family:var(--body);font-size:15px;color:var(--graphite);outline:none;transition:border-color .2s;
}
.finput:focus{border-color:var(--green);}
.finput::placeholder{color:rgba(26,26,23,.42);}
.consent{display:flex;gap:11px;align-items:flex-start;margin:18px 0 20px;}
.consent input{margin-top:4px;width:16px;height:16px;accent-color:var(--green);flex:none;}
.consent label{font-size:13px;line-height:1.55;color:rgba(26,26,23,.78);}
.consent a{text-decoration:underline;}
.fsubmit{width:100%;padding:16px;}
.fnote{font-size:12px;color:rgba(26,26,23,.62);margin-top:14px;text-align:center;}
.done{display:none;text-align:center;padding:40px 20px;}
.done.active{display:block;}
.done svg{width:46px;height:46px;margin:0 auto 20px;}
.done h3{font-size:24px;margin-bottom:10px;}
.done p{font-size:15px;color:rgba(26,26,23,.78);line-height:1.6;}

/* ── faixa de CTA entre páginas ── */
.cta-band{background:var(--paper);padding:64px 80px;display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;}
.cta-band h2{font-size:clamp(22px,2.6vw,32px);line-height:1.2;max-width:22ch;}
.cta-band p{margin-top:8px;color:rgba(26,26,23,.75);max-width:46ch;}

/* ── footer ── */
footer{background:var(--graphite);color:var(--off-white);padding:60px 80px 34px;}
.f-top{display:flex;justify-content:space-between;gap:48px;padding-bottom:48px;margin-bottom:30px;border-bottom:1px solid rgba(242,240,230,.14);flex-wrap:wrap;}
.f-tagline{font-family:var(--display);font-weight:600;font-size:15px;color:rgba(242,240,230,.78);margin-top:18px;max-width:230px;line-height:1.45;}
.f-nav{display:flex;gap:60px;flex-wrap:wrap;}
.f-nav h5{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(242,240,230,.58);margin-bottom:16px;font-weight:400;}
.f-nav ul{list-style:none;display:flex;flex-direction:column;gap:10px;}
.f-nav a{font-size:14px;color:rgba(242,240,230,.8);transition:color .2s;}
.f-nav a:hover{color:var(--off-white);}
.f-bottom{display:flex;justify-content:space-between;gap:28px;flex-wrap:wrap;align-items:flex-end;}
.f-legal{font-size:12px;line-height:1.75;color:rgba(242,240,230,.58);max-width:640px;}
.f-social{display:flex;gap:20px;}
.f-social a{font-family:var(--mono);font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:rgba(242,240,230,.62);}
.f-social a:hover{color:var(--off-white);}

/* ── reveal ── */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .7s ease;}
.reveal.visible{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .reveal{opacity:1;transform:none;transition:none;}
}

/* ── responsivo ── */
@media (max-width:980px){
  nav{padding:14px 20px;}
  .nav-links{gap:18px;}
  .nav-links a{font-size:12px;}
  #hero{grid-template-columns:1fr;min-height:auto;}
  .hero-content{padding:52px 20px 36px;}
  .hero-image{min-height:300px;padding:26px;}
  .page-hero{padding:52px 20px 44px;}
  #dor,.sec,.prod,.cta-band{padding:64px 20px;}
  .dor-grid,.prod-in,.lista-grid{grid-template-columns:1fr;gap:38px;}
  .prod-in.rev .prod-vis{order:0;}
  .steps,.proto-grid,.comp-grid,.rot-grid{grid-template-columns:1fr;}
  .comp{grid-template-columns:90px 1fr;gap:18px;padding:28px 22px;}
  .atleta-in{padding:40px 20px;}
  footer{padding:44px 20px 26px;}
  .card{padding:30px 22px;}
}
@media (max-width:640px){
  .nav-links{display:none;}
}
