/* 
  VENDO_SRI Landing Page Global Styles
  Optimized for performance and premium aesthetics
*/

section, .hero, .features, .pricing {
  content-visibility: auto;
  contain-intrinsic-size: 1px 500px;
}

:root{
  --bg:#07111f;
  --bg-alt:#0d1728;
  --panel:#101c30;
  --panel-soft:rgba(16,28,48,.72);
  --panel-strong:#13233b;
  --line:rgba(159,189,231,.14);
  --line-strong:rgba(159,189,231,.24);
  --text:#f5f9ff;
  --text-mid:#bfd0ea;
  --text-soft:#8ea4c4;
  --brand-name:#82a7ff;
  --cyan:#3fbaff;
  --cyan-strong:#1973ff;
  --violet:#7a7cff;
  --teal:#39d6c1;
  --green:#5be38f;
  --warning:#ffcc66;
  --shadow:0 28px 70px rgba(0,0,0,.35);
  --radius-xl:28px;
  --radius-lg:22px;
  --radius-md:16px;
}

body[data-theme="light"]{
  --bg:#f4f8ff;
  --bg-alt:#eef4ff;
  --panel:#ffffff;
  --panel-soft:rgba(255,255,255,.88);
  --panel-strong:#f6f9ff;
  --line:rgba(68,102,153,.12);
  --line-strong:rgba(68,102,153,.22);
  --text:#0e1b2d;
  --text-mid:#44556f;
  --text-soft:#60738f;
  --brand-name:#82a7ff;
  --particle:#15263d;
  --particle-shadow:rgba(21,38,61,.18);
  --shadow:0 22px 48px rgba(38,60,98,.12);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}

body{
  margin:0;
  font-family:'Manrope',sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(63,186,255,.18), transparent 28%),
    radial-gradient(circle at 85% 10%, rgba(122,124,255,.14), transparent 24%),
    radial-gradient(circle at 50% 100%, rgba(57,214,193,.08), transparent 32%),
    linear-gradient(180deg, #06101c 0%, #091425 32%, #07111f 100%);
  overflow-x:hidden;
  transition:background .35s ease,color .25s ease;
}

body[data-theme="light"]{
  background:
    radial-gradient(circle at top left, rgba(63,186,255,.14), transparent 28%),
    radial-gradient(circle at 85% 10%, rgba(122,124,255,.08), transparent 24%),
    radial-gradient(circle at 50% 100%, rgba(57,214,193,.05), transparent 32%),
    linear-gradient(180deg, #f7fbff 0%, #eef5ff 34%, #f5f8ff 100%);
}

a, a *, a:hover, a:focus, a:active, a:active *{
  text-decoration:none !important;
}
.btn, .plan-btn, .nav-link, .nav-cta, .whatsapp-float, .auth-forgot, .contact-card a, .footer-column a, .brand, .brand *{
  text-decoration:none !important;
}
img{max-width:100%;display:block}

.site-shell{position:relative}

.particle-field{
  position:fixed;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  z-index:-2;
}

.particle{
  position:absolute;
  border-radius:50%;
  background:var(--particle, #fff);
  opacity:.1;
  animation:floatParticle linear infinite;
  will-change: transform;
}

.particle:nth-child(1){width:8px;height:8px;left:8%;top:18%;animation-duration:22s;animation-delay:-2s}
.particle:nth-child(2){width:4px;height:4px;left:22%;top:72%;animation-duration:28s;animation-delay:-8s}
.particle:nth-child(3){width:10px;height:10px;left:34%;top:42%;animation-duration:24s;animation-delay:-5s}
.particle:nth-child(4){width:6px;height:6px;left:49%;top:80%;animation-duration:32s;animation-delay:-12s}
.particle:nth-child(5){width:12px;height:12px;left:61%;top:24%;animation-duration:26s;animation-delay:-7s}
.particle:nth-child(6){width:5px;height:5px;left:73%;top:62%;animation-duration:30s;animation-delay:-11s}
.particle:nth-child(7){width:16px;height:16px;left:82%;top:30%;animation-duration:35s;animation-delay:-9s}
.particle:nth-child(8){width:7px;height:7px;left:90%;top:78%;animation-duration:25s;animation-delay:-4s}
.particle:nth-child(9){width:9px;height:9px;left:15%;top:85%;animation-duration:29s;animation-delay:-10s}
.particle:nth-child(10){width:14px;height:14px;left:85%;top:15%;animation-duration:33s;animation-delay:-6s}
.particle:nth-child(11){width:6px;height:6px;left:45%;top:15%;animation-duration:27s;animation-delay:-3s}
.particle:nth-child(12){width:11px;height:11px;left:55%;top:95%;animation-duration:31s;animation-delay:-14s}

@keyframes floatParticle{
  0%{transform:translate3d(0,0,0) scale(.8);opacity:.0}
  15%{opacity:.3}
  50%{transform:translate3d(-40px,-140px,0) scale(1.1);opacity:.6}
  85%{opacity:.3}
  100%{transform:translate3d(20px,-320px,0) scale(.8);opacity:.0}
}

.site-shell::before,
.site-shell::after{
  content:'';
  position:fixed;
  inset:auto;
  pointer-events:none;
  z-index:-1;
  filter:blur(40px);
}

.site-shell::before{
  top:96px;
  left:-80px;
  width:260px;
  height:260px;
  background:rgba(25,115,255,.18);
  border-radius:50%;
}

.site-shell::after{
  right:-70px;
  bottom:140px;
  width:300px;
  height:300px;
  background:rgba(122,124,255,.15);
  border-radius:50%;
}

.container-shell{
  width:min(90vw, 1800px);
  margin:0 auto;
}

.section-inner{
  width:min(90vw, 1800px);
  margin:0 auto;
}

.reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .5s ease, transform .5s ease;
  will-change:opacity, transform;
  contain:paint;
}

.reveal.is-visible{
  opacity:1;
  transform:translateY(0);
}

.site-header{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(6,16,28,.7);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid transparent;
  transition:background .25s ease,border-color .25s ease,box-shadow .25s ease;
  transform:translateZ(0);
}

.site-header.scrolled{
  background:rgba(6,16,28,.88);
  border-color:var(--line);
  box-shadow:0 14px 34px rgba(0,0,0,.28);
}

body[data-theme="light"] .site-header{
  background:rgba(245,250,255,.82);
}

body[data-theme="light"] .site-header.scrolled{
  background:rgba(245,250,255,.95);
  box-shadow:0 16px 32px rgba(38,60,98,.1);
}

.header-row{
  position: relative;
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.brand, .brand-copy strong, .brand-copy span{
  text-decoration:none !important;
}
.brand:hover{
  text-decoration:none !important;
}
.brand{
  display:flex;
  align-items:center;
  gap:14px;
  color:var(--text);
  text-decoration:none !important;
}

.brand-mark{
  width:156px;
  height:54px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  flex-shrink:0;
}

.brand-mark img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:left center;
}

.brand-copy strong{
  display:block;
  font-family:'Space Grotesk',sans-serif;
  font-size:.98rem;
  letter-spacing:-.03em;
  color:var(--brand-name);
}

.brand-copy span{
  display:block;
  color:var(--text-soft);
  font-size:.72rem;
  margin-top:2px;
}

.site-nav{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.mobile-toggle{
  display: none;
  background: transparent;
  border: none;
  color: var(--text);
  font-size: 1.4rem;
  cursor: pointer;
  padding: 8px;
  margin-left: auto;
}

.nav-link{
  color:var(--text-soft);
  padding:10px 14px;
  border-radius:999px;
  font-size:.92rem;
  font-weight:600;
  transition:color .2s ease, background .2s ease;
}

.nav-link:hover,
.nav-link.active{
  color:var(--text);
  background:rgba(255,255,255,.06);
}

.nav-cta{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 18px;
  border-radius:999px;
  color:#03101c;
  background:linear-gradient(135deg, #79d9ff, #74a5ff);
  font-weight:800;
  box-shadow:0 16px 28px rgba(25,115,255,.24);
}

.nav-cta:hover{color:#03101c}

.theme-toggle{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-height:48px;
  padding:0 16px;
  border:none;
  border-radius:999px;
  color:var(--text);
  background:rgba(255,255,255,.05);
  border:1px solid var(--line-strong);
  font-weight:800;
  cursor:pointer;
  transition:transform .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
}

.theme-toggle:hover{
  transform:translateY(-2px);
  background:rgba(255,255,255,.09);
}

.theme-toggle i{
  font-size:.95rem;
}

body[data-theme="light"] .theme-toggle{
  background:rgba(14,27,45,.04);
}

.login-modal .modal-dialog{
  max-width:460px;
}

.login-modal{
  z-index:2000;
}

.modal-backdrop{
  z-index:1990;
}

.login-modal .modal-content{
  background:var(--panel-soft);
  backdrop-filter:blur(20px);
  border:1px solid var(--line);
  border-radius:28px;
  box-shadow:var(--shadow);
  color:var(--text);
}

.login-modal .modal-header{
  padding:26px 28px 12px;
  border-bottom:none;
}

.login-modal .modal-title{
  font-family:'Space Grotesk',sans-serif;
  font-size:1.8rem;
  letter-spacing:-.04em;
}

.login-modal .btn-close{
  filter:invert(1) grayscale(1);
  opacity:.78;
}

body[data-theme="light"] .login-modal .btn-close{
  filter:none;
}

.login-modal .modal-body{
  padding:8px 28px 28px;
}

.auth-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:18px;
  padding:7px 12px;
  border-radius:999px;
  color:#daf7ff;
  font-size:.76rem;
  font-weight:800;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(159,189,231,.14);
}

body[data-theme="light"] .auth-badge{
  color:#1c3555;
  background:rgba(14,27,45,.04);
  border-color:rgba(68,102,153,.16);
}

.auth-alert{
  display:none;
  align-items:center;
  gap:10px;
  margin-bottom:16px;
  padding:14px 16px;
  border-radius:14px;
  font-size:.9rem;
  font-weight:700;
}

.auth-alert.is-visible{
  display:flex;
}

.auth-alert.error{
  background:rgba(239,68,68,.12);
  color:#ff9b9b;
  border:1px solid rgba(239,68,68,.24);
}

body[data-theme="light"] .auth-alert.error{
  color:#c92b2b;
}

.auth-form-group{
  display:grid;
  gap:8px;
  margin-bottom:18px;
}

.auth-form-group label{
  color:var(--text-mid);
  font-size:.86rem;
  font-weight:700;
}

.auth-input{
  width:100%;
  min-height:52px;
  padding:0 16px;
  background:rgba(255,255,255,.03);
  border:1px solid var(--line-strong);
  border-radius:14px;
  color:var(--text);
  outline:none;
  transition:border-color .2s ease, background .2s ease;
}

body[data-theme="light"] .auth-input{
  background:var(--bg-alt);
}

.auth-input:focus{
  border-color:var(--cyan);
  background:rgba(255,255,255,.06);
}

.auth-input::placeholder{
  color:var(--text-soft);
  opacity:.72;
}

.auth-password{
  position:relative;
}

.auth-password .auth-input{
  padding-right:48px;
}

.auth-password-toggle{
  position:absolute;
  top:50%;
  right:14px;
  transform:translateY(-50%);
  border:none;
  background:transparent;
  color:var(--text-soft);
  padding:0;
  cursor:pointer;
}

.auth-options{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  margin-bottom:22px;
  font-size:.84rem;
}

.auth-remember{
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--text-mid);
}

.auth-remember input{
  accent-color:var(--cyan-strong);
}

.auth-forgot{
  color:var(--cyan);
  font-weight:700;
}

body[data-theme="light"] .auth-forgot{
  color:var(--cyan-strong);
}

.auth-divider{
  display:flex;
  align-items:center;
  gap:14px;
  margin:18px 0;
  color:var(--text-soft);
  font-size:.82rem;
  font-weight:700;
}

.auth-divider::before,
.auth-divider::after{
  content:'';
  flex:1;
  height:1px;
  background:var(--line-strong);
}

.auth-google{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:52px;
  border-radius:16px;
  color:var(--text);
  background:rgba(255,255,255,.05);
  border:1px solid var(--line-strong);
  font-weight:800;
}

body[data-theme="light"] .auth-google{
  background:var(--bg-alt);
}

.auth-google:hover{
  color:var(--text);
  background:rgba(255,255,255,.08);
}

body[data-theme="light"] .auth-google:hover{
  background:rgba(14,27,45,.05);
}

.hero{
  padding:54px 0 18px;
}

.hero-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:28px;
  align-items:start;
}

.hero-copy,
.hero-panel,
.section-card,
.plan-card,
.cta-card,
.feature-card,
.proof-strip,
.contact-card{
  border:1px solid var(--line);
  background:var(--panel-soft);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  box-shadow:var(--shadow);
  transform:translateZ(0);
  contain:content;
}

.hero-copy{
  position:relative;
  overflow:hidden;
  padding:52px;
  border-radius:var(--radius-xl);
  border:none;
  background:transparent;
  backdrop-filter:none;
  box-shadow:none;
}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 14px;
  border-radius:999px;
  color:#d9f2ff;
  font-size:.79rem;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  background:rgba(63,186,255,.12);
  border:1px solid rgba(63,186,255,.22);
}

.hero-copy h1{
  margin:18px 0 8px;
  font-family:'Space Grotesk',sans-serif;
  font-size:clamp(3.2rem, 8vw, 6.8rem);
  line-height:.96;
  letter-spacing:-.06em;
  max-width:920px;
}

.hero-subtitle{
  margin:0 0 20px;
  max-width:780px;
  font-family:'Space Grotesk',sans-serif;
  font-size:clamp(1.15rem, 2.8vw, 2rem);
  line-height:1.2;
  letter-spacing:-.03em;
  color:var(--text);
}

.hero-copy h1 .grad{
  color:var(--brand-name);
}

.hero-copy p{
  margin:0 0 28px;
  max-width:720px;
  color:var(--text-mid);
  font-size:1rem;
  line-height:1.9;
}

.hero-actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}

.btn-primary-dark,
.btn-secondary-dark{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:52px;
  padding:0 22px;
  border-radius:16px;
  font-weight:800;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}

.btn-primary-dark{
  color:#06101c;
  background:linear-gradient(135deg, #79d9ff, #7d9cff);
  box-shadow:0 20px 40px rgba(25,115,255,.26);
}

.btn-primary-dark:hover{
  color:#06101c;
  transform:translateY(-2px);
}

.btn-secondary-dark{
  color:var(--text);
  border:1px solid var(--line-strong);
  background:rgba(255,255,255,.04);
}

.btn-secondary-dark:hover{
  color:var(--text);
  background:rgba(255,255,255,.08);
  transform:translateY(-2px);
}

.hero-summary{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:16px;
  margin-top:32px;
  max-width:980px;
}

.summary-item{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px;
  align-items:start;
  padding:14px 16px;
  border-radius:18px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
}

.summary-item i{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:rgba(99,175,255,.16);
  color:#b8e7ff;
}

.summary-item strong{
  display:block;
  margin-bottom:4px;
  font-size:.94rem;
}

.summary-item span{
  color:var(--text-soft);
  font-size:.84rem;
  line-height:1.6;
}

.hero-panel{
  position:relative;
  overflow:hidden;
  border-radius:var(--radius-xl);
  padding:38px;
  display:flex;
  flex-direction:column;
  gap:22px;
  width:100%;
}

.hero-panel::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(135deg, rgba(63,186,255,.08), transparent 38%),
    linear-gradient(180deg, transparent 12%, rgba(255,255,255,.02) 100%);
  pointer-events:none;
}

.dashboard-window{
  position:relative;
  z-index:1;
  border-radius:22px;
  padding:28px;
  background:linear-gradient(180deg, rgba(4,10,20,.9), rgba(12,22,38,.92));
  border:1px solid rgba(159,189,231,.12);
  transform:translateZ(0);
}

.window-bar{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:12px;
  margin-bottom:22px;
}

.window-chip{
  padding:7px 12px;
  border-radius:999px;
  color:#d7f6ff;
  font-size:.74rem;
  font-weight:700;
  background:rgba(57,214,193,.12);
  border:1px solid rgba(57,214,193,.24);
}

body[data-theme="light"] .dashboard-window{
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(243,247,255,.96));
}

body[data-theme="light"] .chart-card,
body[data-theme="light"] .chart-meta-item,
body[data-theme="light"] .summary-item,
body[data-theme="light"] .band-card,
body[data-theme="light"] .pipeline-step{
  background:rgba(14,27,45,.03);
}

body[data-theme="light"] .hero-panel,
body[data-theme="light"] .section-card,
body[data-theme="light"] .plan-card,
body[data-theme="light"] .cta-card,
body[data-theme="light"] .feature-card,
body[data-theme="light"] .contact-card{
  background:rgba(255,255,255,.84);
  border-color:rgba(68,102,153,.14);
  box-shadow:0 18px 42px rgba(38,60,98,.09);
}

body[data-theme="light"] .window-chip{
  color:#0b6d57;
  background:rgba(57,214,193,.14);
}

body[data-theme="light"] .chart-badge{
  color:#1c3555;
  background:rgba(14,27,45,.04);
  border-color:rgba(68,102,153,.16);
}

.chart-panel{
  display:grid;
  gap:18px;
}

.chart-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  flex-wrap:wrap;
}

.chart-head strong{
  display:block;
  margin-bottom:6px;
  font-size:1.05rem;
}

.chart-head p{
  margin:0;
  color:var(--text-soft);
  font-size:.88rem;
  line-height:1.7;
  max-width:560px;
}

.chart-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  color:#dbf8ff;
  font-size:.76rem;
  font-weight:800;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(159,189,231,.14);
}

.chart-card{
  position:relative;
  border-radius:22px;
  padding:20px 20px 14px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(159,189,231,.1);
}

.chart-canvas-wrap{
  position:relative;
  min-height:clamp(380px, 62vh, 720px);
}

.chart-meta{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:12px;
}

.chart-meta-item{
  padding:14px 16px;
  border-radius:18px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(159,189,231,.1);
}

.chart-meta-item span{
  display:block;
  color:var(--text-soft);
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.chart-meta-item strong{
  display:block;
  margin-top:8px;
  font-size:1.2rem;
}

.chart-meta-item small{
  display:block;
  margin-top:6px;
  color:#8dd4ff;
}

.proof-strip{
  padding:10px 0;
  border:none;
}

.proof-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:24px;
}

.proof-item{
  display:flex;
  gap:16px;
  padding:20px;
  border-radius:18px;
  background:rgba(255,255,255,.04);
  border:1px solid var(--line);
}

.proof-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:rgba(132,220,255,.14);
  color:#84dcff;
}

.proof-item strong{
  display:block;
  margin-bottom:4px;
  font-size:1.05rem;
}

.proof-item span{
  color:var(--text-soft);
  font-size:.88rem;
  line-height:1.6;
}

.section-band{
  padding:20px 0;
}

.band-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:22px;
}

.band-card{
  padding:32px;
  border-radius:24px;
  background:rgba(255,255,255,.03);
  border:1px solid var(--line);
}

.band-kicker{
  display:block;
  margin-bottom:14px;
  color:var(--cyan);
  font-size:.78rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.band-card strong{
  display:block;
  margin-bottom:12px;
  font-family:'Space Grotesk',sans-serif;
  font-size:1.35rem;
  line-height:1.3;
}

.band-card p{
  margin:0;
  color:var(--text-soft);
  font-size:.92rem;
  line-height:1.75;
}

.section{
  padding:54px 0;
}

.section-head{
  margin-bottom:48px;
  max-width:820px;
}

.section-head h2{
  margin:18px 0 16px;
  font-family:'Space Grotesk',sans-serif;
  font-size:clamp(2rem, 5vw, 3.4rem);
  line-height:1.1;
  letter-spacing:-.04em;
}

.section-head p{
  margin:0;
  color:var(--text-mid);
  font-size:1.1rem;
  line-height:1.8;
}

.section-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:24px;
}

.section-card{
  padding:42px;
  border-radius:var(--radius-xl);
}

.feature-list{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:20px;
}

.feature-card{
  padding:28px;
  border-radius:22px;
  background:rgba(255,255,255,.03);
}

.feature-icon{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:rgba(122,218,255,.14);
  color:#82dfff;
  margin-bottom:18px;
}

.feature-card h3{
  margin:0 0 10px;
  font-size:1.05rem;
}

.feature-card p{
  margin:0;
  color:var(--text-soft);
  font-size:.86rem;
  line-height:1.7;
}

.ops-panel{
  display:flex;
  flex-direction:column;
  gap:32px;
}

.ops-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
}

.ops-top strong{
  display:block;
  font-size:1.1rem;
  margin-bottom:4px;
}

.ops-top span{
  color:var(--text-soft);
  font-size:.88rem;
}

.status-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 12px;
  border-radius:999px;
  color:#86f1b3;
  font-size:.76rem;
  font-weight:800;
  background:rgba(91,227,143,.14);
}

.status-pill::before{
  content:'';
  width:8px;
  height:8px;
  border-radius:50%;
  background:#5be38f;
  box-shadow:0 0 10px #5be38f;
}

.pipeline{
  display:grid;
  gap:14px;
}

.pipeline-step{
  display:flex;
  align-items:center;
  gap:18px;
  padding:18px 22px;
  border-radius:18px;
  background:rgba(255,255,255,.03);
  border:1px solid var(--line);
}

.pipeline-step b{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(121,217,255,.14);
  color:#79d9ff;
  font-size:.9rem;
  flex-shrink:0;
}

.pipeline-step div{
  flex:1;
}

.pipeline-step strong{
  display:block;
  font-size:.9rem;
  margin-bottom:2px;
}

.pipeline-step span{
  color:var(--text-soft);
  font-size:.78rem;
}

.pipeline-step em{
  font-style:normal;
  font-size:.74rem;
  font-weight:800;
  color:var(--cyan);
  text-transform:uppercase;
  letter-spacing:.04em;
  opacity:.7;
}

.plans-wrap{
  padding-bottom:120px;
}

.plans-rail{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:22px;
  margin-bottom:48px;
}

.plan-card{
  position:relative;
  overflow:hidden;
  padding:32px;
  border-radius:24px;
}

.plan-card.featured{
  border-color:rgba(121,217,255,.38);
  transform:translateY(-6px);
}

.plan-accent{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:4px;
  background:linear-gradient(90deg, #82e0ff, #8a86ff);
  opacity:.55;
}

.plan-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  color:#04111f;
  font-size:.75rem;
  font-weight:800;
  background:linear-gradient(135deg, #86e1ff, #89a2ff);
  margin-bottom:18px;
}

.plan-name{
  display:block;
  margin-bottom:8px;
  font-size:1.18em;
}

.plan-desc{
  margin-bottom:16px;
  color:var(--text-soft);
  font-size:.88rem;
  line-height:1.65;
  min-height:52px;
}

.plan-price{
  display:flex;
  align-items:flex-end;
  gap:10px;
  margin-bottom:8px;
}

.plan-price strong{
  font-family:'Space Grotesk',sans-serif;
  font-size:2.7rem;
  line-height:1;
  letter-spacing:-.05em;
}

.plan-price span{
  color:var(--text-soft);
  padding-bottom:8px;
}

.plan-meta{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-bottom:18px;
  color:var(--text-mid);
  font-size:.84rem;
}

.plan-list{
  display:grid;
  gap:10px;
  margin-bottom:22px;
  padding:0;
}

.plan-list li{
  display:flex;
  align-items:flex-start;
  gap:10px;
  color:var(--text-mid);
  font-size:.88rem;
}

.plan-list i{
  color:#7fdcff;
  margin-top:4px;
}

.plan-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:50px;
  border-radius:16px;
  font-weight:800;
  color:var(--text);
  background:rgba(255,255,255,.05);
  border:1px solid rgba(159,189,231,.14);
}

.plan-card.featured .plan-btn{
  color:#04111f;
  background:linear-gradient(135deg, #83e0ff, #7f9dff);
  border:none;
}

.cta-card{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:42px;
  padding:52px;
  border-radius:var(--radius-xl);
}

.cta-card h3{
  margin:18px 0 12px;
  font-family:'Space Grotesk',sans-serif;
  font-size:2.2rem;
  line-height:1.1;
  letter-spacing:-.04em;
}

.cta-card p{
  margin:0;
  max-width:620px;
  color:var(--text-mid);
  line-height:1.75;
}

.cta-actions{
  display:flex;
  gap:14px;
}

.contact-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:22px;
}

.contact-card{
  padding:38px;
  border-radius:24px;
}

.contact-card i{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:rgba(122,218,255,.12);
  color:#7fdcff;
  font-size:1.1rem;
  margin-bottom:22px;
}

.contact-card strong{
  display:block;
  margin-bottom:8px;
  font-size:.95rem;
}

.contact-card a,
.contact-card p{
  color:var(--text-mid);
  font-size:.92rem;
  line-height:1.7;
}

.footer-newsletter { display:flex; justify-content:space-between; align-items:center; gap:24px; padding-bottom:32px; flex-wrap:wrap; }
.newsletter-text h3 { margin:0 0 8px; font-family:'Space Grotesk',sans-serif; font-size:1.6rem; letter-spacing:-.04em; }
.newsletter-text p { margin:0; color:var(--text-soft); font-size:.95rem; }
.newsletter-form { display:flex; gap:10px; width:100%; max-width:420px; }
.newsletter-form input { flex:1; background:rgba(255,255,255,.04); border:1px solid rgba(159,189,231,.16); padding:0 20px; border-radius:14px; color:var(--text); font-size:.95rem; outline:none; transition:border-color .2s ease; }
.newsletter-form input:focus { border-color:var(--cyan); }
.footer-divider { height:1px; background:linear-gradient(90deg, transparent, rgba(159,189,231,.18), transparent); margin-bottom:36px; }
.footer-top { border-bottom:none; padding-bottom:12px; }
.footer-shell { border-top:4px solid rgba(121,217,255,.3); }
.footer-socials { display:flex; gap:14px; margin-top:16px; }
.footer-socials a { width:38px; height:38px; display:grid; place-items:center; border-radius:12px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08); color:var(--text-mid); transition:all .2s ease; }
.footer-socials a:hover { background:var(--cyan-strong); color:#fff; transform:translateY(-2px); border-color:transparent; }
.premium-badge { display:inline-flex; align-items:center; gap:6px; color:#ffcc66; font-size:.8rem; font-weight:700; background:rgba(255,204,102,.12); padding:6px 12px; border-radius:999px; margin-bottom:16px; border:1px solid rgba(255,204,102,.24); }

.site-footer{
  padding:80px 0 40px;
  background:var(--bg-alt);
  border-top: 1px solid var(--line-strong);
  transition: background .3s ease;
}

body[data-theme="dark"] .site-footer {
  background: rgba(4, 10, 20, 0.98);
}

.footer-shell{
  padding:40px 0 20px;
}

.footer-top{
  display:grid;
  grid-template-columns:1.5fr repeat(3, 1fr);
  gap:52px;
  margin-bottom:40px;
  padding-bottom:40px;
  border-bottom:1px solid var(--line);
}

.footer-brand strong{
  display:block;
  margin-bottom:18px;
  font-family:'Space Grotesk',sans-serif;
  font-size:1.4rem;
  letter-spacing:-.04em;
  color: var(--text);
}

.footer-brand p{
  max-width:320px;
  color:var(--text-soft);
  font-size:.92rem;
  line-height:1.75;
}

.footer-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:18px;
  padding:6px 14px;
  border-radius:999px;
  background:rgba(25,115,255,.08);
  color:var(--cyan);
  font-size:.76rem;
  font-weight:700;
}

.footer-column h4{
  margin:0 0 24px;
  font-size:.95rem;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.footer-column a{
  display:block;
  margin-bottom:12px;
  color:var(--text-soft);
  font-size:.92rem;
  transition:color .2s ease;
}

.footer-column a:hover{
  color:var(--text);
}

.footer-contact a{
  display:flex;
  align-items:center;
  gap:12px;
}

.footer-contact i{
  color:var(--cyan);
}

.footer-inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  color:var(--text-soft);
  font-size:.86rem;
}

.footer-links{
  display:flex;
  gap:22px;
}

.footer-links a{
  color:inherit;
}

.whatsapp-float {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 1000;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 20px;
  background: #25d366;
  color: #fff;
  border-radius: 999px;
  font-weight: 800;
  text-decoration: none;
  box-shadow: 0 16px 32px rgba(37, 211, 102, 0.28);
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.whatsapp-float:hover {
  color: #fff;
  transform: translateY(-5px) scale(1.02);
  box-shadow: 0 20px 40px rgba(37, 211, 102, 0.35);
}

@media(max-width:1200px){
  .hero-grid{grid-template-columns:1fr}
  .section-grid{grid-template-columns:1fr}
  .footer-top{grid-template-columns:1fr 1fr;gap:42px}
}

@media(max-width:768px){
  .container-shell, .section-inner{width:92vw}
  
  .mobile-toggle { display: block; }
  .site-nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 4vw;
    right: 4vw;
    background: var(--panel-strong);
    padding: 20px;
    border-radius: 16px;
    flex-direction: column;
    align-items: center;
    border: 1px solid var(--line);
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
  }
  .site-nav.is-open { display: flex; }

  .hero-summary{grid-template-columns:1fr}
  .band-grid{grid-template-columns:1fr}
  .plans-rail{grid-template-columns:1fr}
  .chart-meta{grid-template-columns:1fr}
  .proof-grid{grid-template-columns:1fr}
  .feature-list{grid-template-columns:1fr}
  .cta-card{grid-template-columns:1fr;text-align:center;padding:32px}
  .cta-actions{justify-content:center}
  .contact-grid{grid-template-columns:1fr}
  .footer-top{grid-template-columns:1fr}
  .footer-inner{flex-direction:column;text-align:center}
}

@media (max-width:1440px) {
  .hero-panel { max-width:820px; margin:0 auto; }
  .chart-canvas-wrap { min-height:480px; }
}

@media (max-width:576px) {
  .chart-canvas-wrap { min-height:300px; }
  .whatsapp-float {
    right: 14px;
    bottom: 14px;
    width: 58px;
    min-width: 58px;
    padding: 0;
  }
  .whatsapp-float span { display: none; }
}