/* Padrão visual compartilhado dos sub-sites Cosmo Tecnologia. */
:root{
  --cosmo-ink:#06131a;
  --cosmo-ink-soft:#0b202b;
  --cosmo-lime:#d8f744;
  --cosmo-white:#fff;
  --cosmo-muted:#b9c4c9;
  --cosmo-line:rgba(255,255,255,.14);
  --cosmo-shadow:0 18px 46px rgba(2,12,18,.18);
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:hidden}
body{overflow-x:hidden;background:var(--cosmo-white);color:var(--cosmo-ink)}
img,svg,video{max-width:100%;height:auto}
a,button{touch-action:manipulation}
:focus-visible{outline:3px solid var(--cosmo-lime)!important;outline-offset:4px}

/* Cabeçalho consistente com a linguagem da home. */
.nav{
  min-height:86px!important;
  padding:14px clamp(20px,4vw,64px)!important;
  background:rgba(6,19,26,.94)!important;
  border-bottom:1px solid var(--cosmo-line)!important;
  box-shadow:0 10px 30px rgba(2,12,18,.16)!important;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  z-index:1000!important;
}
.nav .brand,.brand{display:flex!important;align-items:center!important;min-height:48px}
.nav .brand img,.brand img{display:block!important;width:clamp(170px,16vw,220px)!important;max-width:100%!important;height:auto!important;object-fit:contain}
.navlinks{align-items:center!important;gap:clamp(16px,2vw,30px)!important}
.navlinks a{color:#fff!important;font-weight:700!important;text-decoration:none!important}
.navlinks a:hover{color:var(--cosmo-lime)!important}
.navcta,.navbutton,.primary,.button,.theme-btn{
  min-height:50px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
  padding:13px 22px!important;
  border:1px solid var(--cosmo-lime)!important;
  border-radius:7px!important;
  background:var(--cosmo-lime)!important;
  color:var(--cosmo-ink)!important;
  font-weight:800!important;
  text-decoration:none!important;
  box-shadow:0 10px 24px rgba(216,247,68,.14)!important;
}
.nav .navcta,.nav .navbutton{background:var(--cosmo-lime)!important;border-color:var(--cosmo-lime)!important;color:var(--cosmo-ink)!important}
.navcta:hover,.navbutton:hover,.primary:hover,.button:hover,.theme-btn:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(216,247,68,.22)!important}
.menu{border-color:rgba(255,255,255,.22)!important;background:rgba(255,255,255,.06)!important}
.menu span{background:#fff!important;border-color:#fff!important}

/* Ritmo, tipografia e componentes comuns. */
.hero,.standard-hero{
  background-color:var(--cosmo-ink)!important;
  background-image:linear-gradient(100deg,rgba(5,6,5,.97) 0%,rgba(5,6,5,.90) 30%,rgba(5,6,5,.58) 58%,rgba(5,6,5,.24) 100%),var(--hero-bg,none)!important;
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  color:#fff!important;
}
.hero-copy,.standard-hero-copy{min-width:0}
.hero h1,.standard-hero h1{color:#fff!important;letter-spacing:-.025em}
.hero h1 em,.standard-hero h1 em{color:var(--cosmo-lime)!important}
.kicker{font-weight:800!important;letter-spacing:.08em!important;text-transform:uppercase}
.section,.benefits,.outcomes,.services,.plans,.proof,.change,.process,.pilot{
  padding-top:clamp(72px,8vw,120px)!important;
  padding-bottom:clamp(72px,8vw,120px)!important;
}
.section-head{max-width:980px;margin-bottom:clamp(34px,5vw,64px)!important}
.section-head h2{letter-spacing:-.025em}
.card,.benefit-grid>article,.outcome-grid>article,.plan,.journey-card,.module,.step{
  border-radius:10px!important;
  border:1px solid rgba(6,19,26,.12)!important;
  box-shadow:var(--cosmo-shadow)!important;
  overflow:hidden;
}
.benefit-grid>article,.outcome-grid>article{padding:28px 24px!important}
.benefit-grid>article img{margin-left:-24px!important;margin-right:-24px!important;margin-top:-28px!important;width:calc(100% + 48px)!important;max-width:calc(100% + 48px)!important}
.dark,.change,.process{background:var(--cosmo-ink)!important;color:#fff!important}
.dark .section-head h2,.change .section-head h2,.process .section-head h2{color:#fff!important}
.service,.compare,.pricing-panel,.proof-grid,.cta{
  border-radius:12px!important;
  overflow:hidden;
}
.ai-tag,.vision-status,.recommended{background:var(--cosmo-lime)!important;color:var(--cosmo-ink)!important}
.vision-status,.ai-tag,.proof-live{white-space:normal!important;line-height:1.4!important;flex-wrap:wrap!important;row-gap:4px}
.vision-status span,.ai-tag span{white-space:nowrap}
footer{background:var(--cosmo-ink)!important;color:var(--cosmo-muted)!important;border-top:1px solid var(--cosmo-line)!important}
footer a{color:#fff!important}footer a:hover{color:var(--cosmo-lime)!important}
footer img{width:min(210px,52vw)!important;height:auto!important;object-fit:contain}

/* Contraste previsível: tinta escura no claro e branco no escuro. */
:where(.section,.benefits,.outcomes,.services,.plans,.pricing,.pilot):not(.dark) :where(h1,h2,h3,h4,h5,h6){color:var(--cosmo-ink)!important}
:where(.section,.benefits,.outcomes,.services,.plans,.pricing,.pilot):not(.dark) :where(p,li,dd,span){color:#42545d}
:where(.section,.benefits,.outcomes,.services,.plans,.pricing,.pilot):not(.dark) :where(.kicker,em){color:#3f4d00!important}
:where(.hero,.standard-hero,.dark,.change,.process,.proof) :where(h1,h2,h3,h4,h5,h6){color:#fff!important}
:where(.hero,.standard-hero,.dark,.change,.process,.proof) :where(p,li,dd){color:#d6e0e4}
:where(.hero,.standard-hero,.dark,.change,.process,.proof) :where(.kicker,em){color:var(--cosmo-lime)!important}
.nav :where(a,span){color:#fff}.nav :where(.navcta,.navbutton),.nav :where(.navcta,.navbutton) span{color:var(--cosmo-ink)!important}
/* Cards claros aninhados em seções escuras (ex.: card "antes" do comparativo) mantêm tinta escura própria. */
:where(.hero,.standard-hero,.dark,.change,.process,.proof) .compare article:not(.after) :where(h1,h2,h3,h4,h5,h6,p,li,dd){color:#3e4742!important}
/* Cards escuros aninhados em seções claras (ex.: plano em destaque) mantêm tinta clara própria. */
.plan.featured :where(h1,h2,h3,h4,h5,h6){color:#fff!important}
.plan.featured :where(p,li,dd){color:#d6e0e4!important}

@media(max-width:760px){
  .nav{min-height:72px!important;padding:10px 16px!important}
  .nav .brand img,.brand img{width:172px!important}
  .navlinks{top:72px!important;max-height:calc(100svh - 72px)!important;overflow-y:auto!important;background:var(--cosmo-ink)!important;padding:18px!important;box-shadow:0 22px 40px rgba(2,12,18,.3)!important}
  .navlinks a{min-height:46px;display:flex!important;align-items:center!important}
  .navcta,.navbutton,.primary,.button,.theme-btn{width:100%!important;text-align:center}
  .hero-copy,.standard-hero-copy{padding-left:22px!important;padding-right:22px!important}
  .section,.benefits,.outcomes,.services,.plans,.proof,.change,.process,.pilot{padding-left:22px!important;padding-right:22px!important}
  .card,.benefit-grid>article,.outcome-grid>article,.plan,.journey-card,.module,.step{border-radius:8px!important}
  .compare{gap:16px!important}
  .compare article{padding:28px 24px!important}
  .compare>b,.compare-arrow{width:52px!important;height:52px!important;min-height:0!important;justify-self:center!important;margin:0 auto!important}
  .process-line>i{width:38px!important;height:38px!important;min-height:0!important;justify-self:center!important;margin:0 auto!important}
  .proof-grid article{padding-left:20px!important}
  .proof-grid article:before{top:14px!important;bottom:14px!important;height:auto!important;transform:none!important}
  .hero-image,.hero-media,.standard-hero-image{background:var(--cosmo-ink)!important;overflow:hidden!important}
  .hero-image img,.hero-media img,.standard-hero-image img{display:block!important;width:100%!important;height:auto!important;max-height:none!important;aspect-ratio:auto!important;object-fit:contain!important;object-position:center center!important}
  .hero-copy,.standard-hero-copy{background:var(--cosmo-ink)!important;color:#fff!important}
  .hero-copy :where(h1,h2,h3),.standard-hero-copy :where(h1,h2,h3){color:#fff!important}
  .hero-copy :where(p,span),.standard-hero-copy :where(p,span){color:#d6e0e4!important}
  .hero-copy .kicker,.standard-hero-copy .kicker{color:var(--cosmo-lime)!important}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
