:root{
  --bg0:#050505;
  --text:#ffffff;
  --muted: rgba(255,255,255,.72);

  --green:#0B4D1A;
  --greenLine: rgba(11,77,26,.35);

  --radius:18px;
  --shadowSoft: 0 10px 26px rgba(0,0,0,.35);
  --container:1120px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background: var(--bg0);
  color: var(--text);
}
a{color:inherit;text-decoration:none;}
.container{width:min(var(--container), calc(100% - 32px)); margin:0 auto;}

/* ✅ FIX OVERFLOW HORIZONTAL (barra branca / scroll lateral) */
html, body{
  width: 100%;
  overflow-x: hidden;
}
.hero, .heroWarpSection, .section, .screen{ overflow-x: clip; }
@supports not (overflow: clip){
  .hero, .heroWarpSection, .section, .screen{ overflow-x: hidden; }
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{transition:none !important; animation:none !important;}
}

/* Typography */
.eyebrow{
  margin:0 0 10px;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color: var(--muted);
  font-weight:900;
}
.h2{
  margin:0;
  font-size:clamp(22px, 3vw, 34px);
  letter-spacing:.02em;
  text-transform:uppercase;
  font-weight:950;
}
.h3{
  margin:0 0 8px;
  font-size:18px;
  font-weight:950;
  letter-spacing:.01em;
  text-transform:uppercase;
}
.p{margin:10px 0 0; color:var(--muted); line-height:1.65;}
.p-sm{margin:0; color:var(--muted); line-height:1.6; font-size:14px;}
.microcopy{margin:12px 0 0; color:rgba(255,255,255,.6); font-size:13px;}
.u-green{color:#7CFF9F;}

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:10px;
  padding:12px 16px;
  border-radius:999px;
  font-weight:950;
  letter-spacing:.01em;
  border:1px solid transparent;
  cursor:pointer;
  transition:transform .08s ease, filter .15s ease, background .15s ease, border-color .15s ease;
}
.btn:active{transform:translateY(1px);}
.btn--primary{
  background: linear-gradient(180deg, rgba(11,77,26,1), rgba(7,55,18,1));
  color:#fff;
  box-shadow: var(--shadowSoft);
  border-color: rgba(255,255,255,.08);
}
.btn--primary:hover{filter:brightness(1.06);}
.btn--ghost{
  background: rgba(255,255,255,.03);
  border-color: var(--greenLine);
  color:#fff;
}
.btn--ghost:hover{ background: rgba(11,77,26,.14); }
.w-full{width:100%;}

/* Base card */
.card{
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  border-radius: var(--radius);
  padding:18px;
}

/* Lifted cards */
.card--lift{
  background: linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.05));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 18px 46px rgba(0,0,0,.55);
  position:relative;
  border-radius: var(--radius);
  overflow:hidden;
  isolation:isolate;
}
.card--lift::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius: inherit;
  pointer-events:none;
  background:
    radial-gradient(circle at 20% 0%, rgba(255,255,255,.11), transparent 45%),
    radial-gradient(circle at 90% 30%, rgba(11,77,26,.10), transparent 50%);
  opacity:.85;
  z-index:0;
}
.card--lift > *{ position:relative; z-index:1; }

/* Topbar */
.topbar{
  position:sticky; top:0; z-index:50;
  background: rgba(5,5,5,.75);
  backdrop-filter: blur(10px);
  border-bottom:1px solid rgba(255,255,255,.10);
}
.topbar__inner{
  height:72px;
  display:flex; align-items:center; justify-content:space-between;
  gap:16px;
}
.brand{display:flex; align-items:center; gap:12px;}
.brand__mark{
  width:36px; height:36px;
  border-radius:10px;
  background: #ffffff; /* ✅ branco para a logo aparecer */
  box-shadow: var(--shadowSoft);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.brand__logo{
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 5px; /* respiro dentro do quadrado */
}
.brand__text{display:flex; flex-direction:column; line-height:1.1;}
.brand__name{ font-weight:950; letter-spacing:.02em; text-transform:uppercase; font-size:13px; }
.brand__tag{ font-weight:600; color:rgba(255,255,255,.65); font-size:12px; }

.nav{display:flex; align-items:center; gap:16px;}
.nav__link{
  font-weight:900; font-size:13px;
  color:rgba(255,255,255,.72);
  letter-spacing:.02em;
  text-transform:uppercase;
}
.nav__link:hover{color:#fff;}
.topbar__cta{display:flex; gap:10px; align-items:center;}

.hamburger{
  display:none;
  width:44px; height:44px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  cursor:pointer;
}
.hamburger span{
  display:block;
  width:18px; height:2px;
  background: #fff;
  margin:5px auto;
  border-radius:2px;
}
.mobileMenu{
  border-top:1px solid rgba(255,255,255,.10);
  background: rgba(5,5,5,.92);
}
.mobileMenu__inner{
  padding:12px 0 18px;
  display:flex; flex-direction:column; gap:10px;
}
.mobileMenu__link{
  padding:12px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  font-weight:950;
  letter-spacing:.02em;
  text-transform:uppercase;
  font-size:13px;
}

/* Sections */
.screen{
  min-height: 100vh;
  padding: 96px 0;
  position: relative;
}
.section{ padding:52px 0; position:relative; }
.section__header{ margin-bottom:16px; max-width:900px; }
.section__header--tight{ margin-bottom:10px; }
.mt-56{ margin-top:56px; }
.mt-44{ margin-top:44px; }

.after-hero-gap{ padding-top: 110px; }
.anchor{ position:relative; top:-90px; height:1px; }

/* Backgrounds */
.bg-a{
  background: linear-gradient(180deg, #040404 0%, #070707 100%) !important;
}

/* Smooth dividers */
.divider-bottom::after,
.divider-top::before,
.divider-both::before,
.divider-both::after{
  content:"";
  position:absolute;
  left:0; right:0;
  height: 90px;
  pointer-events:none;
  z-index:1;
}
.divider-bottom::after,
.divider-both::after{
  bottom:-1px;
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.35) 55%, rgba(0,0,0,.75) 100%) !important;
}
.divider-top::before,
.divider-both::before{
  top:-1px;
  background: linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,.35) 55%, rgba(0,0,0,.75) 100%) !important;
}

/* HERO */
.hero.bg-a{
  background:
    radial-gradient(900px 640px at 18% 25%, rgba(11,77,26,.45) 0%, transparent 60%),
    radial-gradient(820px 620px at 78% 30%, rgba(255,255,255,.22) 0%, transparent 64%),
    radial-gradient(980px 720px at 55% 85%, rgba(11,77,26,.32) 0%, transparent 62%),
    linear-gradient(180deg, #020202 0%, #0a0a0a 100%) !important;
}
.hero::before{
  content:"";
  position:absolute;
  inset:-30%;
  pointer-events:none;
  background:
    radial-gradient(720px 520px at 22% 30%, rgba(124,255,159,.30) 0%, transparent 66%),
    radial-gradient(620px 500px at 72% 38%, rgba(255,255,255,.24) 0%, transparent 68%),
    radial-gradient(980px 760px at 55% 90%, rgba(11,77,26,.38) 0%, transparent 66%),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.10) 0%, transparent 55%);
  filter: blur(20px);
  opacity: 1;
  z-index:0;
}
.hero::after{
  content:"";
  position:absolute;
  inset:-25%; /* ✅ menor para reduzir risco de overflow */
  pointer-events:none;
  background:
    repeating-linear-gradient(
      115deg,
      rgba(255,255,255,0) 0px,
      rgba(255,255,255,0) 3px,
      rgba(255,255,255,.42) 3px,
      rgba(255,255,255,.42) 4px,
      rgba(255,255,255,0) 4px,
      rgba(255,255,255,0) 7px,
      rgba(124,255,159,.34) 7px,
      rgba(124,255,159,.34) 8px,
      rgba(255,255,255,0) 8px,
      rgba(255,255,255,0) 12px
    ),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.14) 0%, rgba(0,0,0,0) 58%);
  opacity: .95;
  mix-blend-mode: screen;
  filter: blur(.12px);
  transform: translate3d(0,0,0) rotate(-6deg);
  z-index:1;
}
.hero__grid{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:16px;
  align-items:start;
  position:relative;
  z-index:3;
}
.hero__title{
  margin:0;
  font-size:clamp(30px, 4vw, 52px);
  letter-spacing:.01em;
  text-transform:uppercase;
  font-weight:950;
  line-height:1.05;
}
.hero__subtitle{
  margin:14px 0 0;
  color:var(--muted);
  line-height:1.65;
  font-size:16px;
}
.hero__actions{display:flex; gap:12px; margin-top:18px; flex-wrap:wrap;}
.hero__trust{display:flex; gap:10px; margin-top:16px; flex-wrap:wrap;}

.pill{
  padding:8px 12px;
  border-radius:999px;
  background: rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.12);
  font-weight:950;
  letter-spacing:.02em;
  text-transform:uppercase;
  font-size:12px;
  color:rgba(255,255,255,.72);
}
.card__kicker{
  margin:0;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-weight:950;
  color:#7CFF9F;
}
.card__header{margin-bottom:12px;}
.card__title{
  margin:8px 0 0;
  font-size:16px;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.02em;
}
.card__subtitle{
  margin:6px 0 0;
  color:rgba(255,255,255,.68);
  font-size:13px;
  line-height:1.55;
}
.checklist{margin:12px 0 0; padding-left:18px; color:rgba(255,255,255,.72);}
.checklist li{margin:10px 0;}
.highlight{
  margin-top:14px;
  padding:12px 14px;
  border-radius:14px;
  background: rgba(11,77,26,.18);
  border:1px solid rgba(11,77,26,.35);
}
.highlight p{margin:0; line-height:1.55; color:rgba(255,255,255,.9);}

/* Tabs e listas */
.strip__tabs{ display:flex; gap:10px; flex-wrap:wrap; margin:12px 0 12px; }
.stripTab{
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  font-weight:950;
  letter-spacing:.02em;
  text-transform:uppercase;
  font-size:12px;
  cursor:pointer;
  color: rgba(255,255,255,.82);
}
.stripTab.is-active{
  background: linear-gradient(180deg, rgba(11,77,26,1), rgba(7,55,18,1));
  color:#fff;
  border-color: rgba(255,255,255,.10);
}
.panel{display:none;}
.panel.is-active{display:block;}
.panelGrid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }

.list{margin:10px 0 0; padding-left:18px;}
.list li{margin:8px 0;}
.chips{display:flex; gap:8px; flex-wrap:wrap; margin-top:12px;}
.chip{
  font-size:12px;
  font-weight:950;
  letter-spacing:.02em;
  text-transform:uppercase;
  padding:7px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
}
.badge{
  display:inline-block;
  margin:0 0 6px;
  font-size:12px;
  font-weight:950;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#7CFF9F;
}
.calloutWide__title{ margin:0; font-weight:950; letter-spacing:.02em; text-transform:uppercase; }
.calloutWide__text{ margin:6px 0 0; line-height:1.55; }
.wideCta{ margin-top:14px; padding:16px; display:flex; flex-direction:column; gap:8px; }
.wideCta--safe{ transform: translateZ(0); }

/* Time / grids */
.roles{ display:grid; grid-template-columns: repeat(3, 1fr); gap:12px; }
.roles--compact{ margin-top:12px; }
.role{
  display:flex; gap:12px; padding:14px;
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
}
.role__icon{
  width:42px; height:42px; border-radius:999px;
  background: linear-gradient(180deg, rgba(11,77,26,1), rgba(7,55,18,1));
  display:flex; align-items:center; justify-content:center;
  font-weight:950; font-size:12px;
  color:#fff;
}
.role__title{ margin:0; font-weight:950; text-transform:uppercase; font-size:13px; }
.role__text{ margin:6px 0 0; font-size:13px; line-height:1.5; }

/* Stats */
.stats__grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:12px; margin-top:16px; }
.stats__grid--compact{ margin-top:14px; }
.stat{ border-radius:var(--radius); padding:14px; }
.stat__num{ margin:0; font-size:26px; font-weight:950; text-transform:uppercase; }
.stat__label{ margin:8px 0 0; font-size:13px; font-weight:800; }

/* Método e grids */
.methodGrid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:14px; margin-top:16px; }
.methodCard{ border-radius:var(--radius); padding:18px; }
.methodCard__top{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.methodCard__step{
  width:34px; height:34px; border-radius:999px;
  background: linear-gradient(180deg, rgba(11,77,26,1), rgba(7,55,18,1));
  display:flex; align-items:center; justify-content:center;
  font-weight:950;
  color:#fff;
}
.grid3{ display:grid; grid-template-columns: repeat(3,1fr); gap:14px; margin-top:16px; }

/* Final CTA */
.finalCta{
  margin-top:18px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:16px;
  border-radius:var(--radius);
}

/* ✅ Light section (layout claro) */
.lightSection{
  background: #f2f2f2 !important;
  color: #0b0b0b;
  position: relative;
  isolation: isolate;
}
.lightSection::before{
  content:"";
  position:absolute;
  left:0; right:0;
  top:0;
  height:70px;
  pointer-events:none;
  z-index:0;
  background: linear-gradient(to bottom, rgba(0,0,0,.55) 0%, rgba(242,242,242,1) 100%);
  opacity: .65;
}
.lightSection > .container{ position:relative; z-index:2; }
.lightSection .eyebrow{ color: rgba(0,0,0,.65) !important; }
.lightSection .h2,
.lightSection .h3,
.lightSection .calloutWide__title,
.lightSection .role__title,
.lightSection .stat__num{ color:#0b0b0b !important; }
.lightSection .p,
.lightSection .p-sm,
.lightSection .calloutWide__text,
.lightSection .role__text,
.lightSection .stat__label{ color: rgba(0,0,0,.72) !important; }

.lightSection .stripTab{
  background: #e9e9e9 !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  color: rgba(0,0,0,.78) !important;
}
.lightSection .stripTab:hover{ background:#e2e2e2 !important; }
.lightSection .stripTab.is-active{
  background: linear-gradient(180deg, rgba(11,77,26,1), rgba(7,55,18,1)) !important;
  color:#fff !important;
  border-color: rgba(0,0,0,.08) !important;
}
.lightSection .card,
.lightSection .card--lift,
.lightSection .role.card--lift,
.lightSection .stat.card--lift,
.lightSection .wideCta.card--lift{
  background: #ffffff !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.08) !important;
  color:#0b0b0b;
}
.lightSection .card--lift::before{
  background:
    radial-gradient(circle at 20% 0%, rgba(0,0,0,.06), transparent 45%),
    radial-gradient(circle at 90% 30%, rgba(11,77,26,.10), transparent 55%) !important;
  opacity: .55 !important;
}
.lightSection .wideCta{
  background: #ededed !important;
}
.lightSection .wideCta .badge{ color: #0B4D1A !important; }
.lightSection .wideCta .btn{
  width: 100%;
  border-radius: 14px;
  padding: 14px 16px;
}
.lightSection .chip{
  background:#ececec !important;
  border:1px solid rgba(0,0,0,.12) !important;
  color: rgba(0,0,0,.72) !important;
}

/* ✅ Hero warp section (mesmo visual do hero + nebulosa verde) */
.heroWarpSection{
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(1400px 980px at 10% 38%, rgba(11,77,26,.82) 0%, transparent 62%),
    radial-gradient(820px 620px at 18% 40%, rgba(124,255,159,.22) 0%, transparent 66%),
    radial-gradient(1250px 900px at 86% 40%, rgba(255,255,255,.18) 0%, transparent 72%),
    radial-gradient(1100px 820px at 55% 92%, rgba(11,77,26,.38) 0%, transparent 66%),
    linear-gradient(180deg, #020202 0%, #0a0a0a 100%) !important;
}
.heroWarpSection::before{
  content:"";
  position:absolute;
  inset:-30%;
  pointer-events:none;
  background:
    radial-gradient(820px 620px at 18% 36%, rgba(124,255,159,.40) 0%, transparent 66%),
    radial-gradient(720px 560px at 30% 42%, rgba(11,77,26,.46) 0%, transparent 70%),
    radial-gradient(640px 520px at 74% 36%, rgba(255,255,255,.20) 0%, transparent 68%),
    radial-gradient(980px 760px at 55% 90%, rgba(11,77,26,.44) 0%, transparent 66%),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.10) 0%, transparent 55%);
  filter: blur(22px);
  opacity: 1;
  z-index:0;
}
.heroWarpSection::after{
  content:"";
  position:absolute;
  inset:-25%; /* ✅ menor para não estourar largura */
  pointer-events:none;
  background:
    repeating-linear-gradient(
      115deg,
      rgba(255,255,255,0) 0px,
      rgba(255,255,255,0) 3px,
      rgba(255,255,255,.42) 3px,
      rgba(255,255,255,.42) 4px,
      rgba(255,255,255,0) 4px,
      rgba(255,255,255,0) 7px,
      rgba(124,255,159,.34) 7px,
      rgba(124,255,159,.34) 8px,
      rgba(255,255,255,0) 8px,
      rgba(255,255,255,0) 12px
    ),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.14) 0%, rgba(0,0,0,0) 58%);
  opacity: .85;
  mix-blend-mode: screen;
  filter: blur(.12px);
  transform: translate3d(0,0,0) rotate(-6deg);
  z-index:1;
}
.heroWarpSection > .container{ position:relative; z-index:3; }

.spotlightHeader{
  padding:18px 18px 16px;
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.04));
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 18px 50px rgba(0,0,0,.55);
  max-width: 100%;
}

/* FAQ */
.faq{ display:flex; flex-direction:column; gap:10px; }
.faqItem{ padding:14px 16px; }
.faqItem summary{
  cursor:pointer;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.02em;
  color:#fff;
  list-style:none;
}
.faqItem summary::-webkit-details-marker{ display:none; }
.faqBody{ margin-top:10px; line-height:1.6; font-size:14px; color:rgba(255,255,255,.72); }

.faqCta{
  margin-top: 8px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.faqCta .h3{ margin:0 0 6px; }
.faqCta .p-sm{ margin:0; }

/* Contato */
.contact{ display:grid; grid-template-columns: 1fr 1fr; gap:16px; align-items:start; }
.contact__mini{ display:flex; gap:10px; flex-wrap:wrap; margin-top:16px; }

.formTitle{ margin-bottom: 8px; }
.form--contact .card__title{ font-size: 14px; line-height: 1.3; }

.field{ display:flex; flex-direction:column; gap:8px; margin-top:12px; }
.field span{
  font-size:12px;
  font-weight:950;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:rgba(255,255,255,.78);
}

input, textarea, select{
  border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  padding:12px;
  font-family:inherit;
  font-size:14px;
  outline:none;
  color:#fff;
}
input::placeholder, textarea::placeholder{ color: rgba(255,255,255,.45); }
input:focus, textarea:focus, select:focus{
  border-color: rgba(11,77,26,.65);
  box-shadow: 0 0 0 4px rgba(11,77,26,.18);
}

/* Footer */
.footer{
  border-top:1px solid rgba(255,255,255,.10);
  padding:18px 0 90px;
  background: rgba(0,0,0,.15);
}
.footer__inner{ display:flex; justify-content:space-between; align-items:center; gap:12px; }

/* ✅ Mobile bottom CTA (FIX Android) */
.mobileCta{
  position: fixed;
  left: 0; right: 0;
  bottom: 0;
  padding: 12px 16px;
  padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  background: rgba(5,5,5,.86);
  border-top:1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(10px);
  z-index: 999;
  display:none;

  transform: translateZ(0);
  will-change: transform;
  backface-visibility: hidden;
}
.mobileCta__inner{ display:flex; gap:10px; }

/* Responsive */
@media (max-width: 980px){
  .hero__grid{grid-template-columns:1fr;}
  .panelGrid{grid-template-columns:1fr;}
  .roles{grid-template-columns: repeat(2,1fr);}
  .stats__grid{grid-template-columns: repeat(2,1fr);}
  .methodGrid{grid-template-columns:1fr;}
  .grid3{grid-template-columns:1fr;}
  .contact{grid-template-columns:1fr;}
  .faqCta{ flex-direction: column; align-items:flex-start; }
}
@media (max-width: 820px){
  .nav, .topbar__cta{display:none;}
  .hamburger{display:block;}
  .mobileCta{display:block;}
  .finalCta{flex-direction:column; align-items:flex-start;}
}
@media (max-width: 520px){
  .roles{grid-template-columns:1fr;}
}
