@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root{
  --bg:#060b18;
  --panel:#0d1428;
  --panel-2:#101b33;
  --stroke:#243454;
  --text:#f8fbff;
  --muted:#94a5c5;
  --green:#31ed77;
  --green-2:#5bff98;
  --cyan:#65e5ff;
  --shadow:0 30px 80px rgba(0,0,0,.38);
}

*{box-sizing:border-box}
html{background:var(--bg)}
body{
  margin:0;
  min-height:100vh;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 50% -20%,rgba(56,78,150,.22),transparent 38%),
    linear-gradient(180deg,#080d1d 0%,#050913 100%);
}

a{-webkit-tap-highlight-color:transparent}

.site-shell{
  min-height:100vh;
  display:flex;
  justify-content:center;
  padding:22px 16px 40px;
}

.conversion-card{
  position:relative;
  width:min(100%,430px);
  min-height:calc(100vh - 44px);
  overflow:hidden;
  padding:28px 22px 26px;
  border:1px solid rgba(106,132,190,.13);
  border-radius:36px;
  text-align:center;
  background:
    radial-gradient(circle at 50% 0%,rgba(32,52,112,.15),transparent 28%),
    linear-gradient(180deg,#0d1429 0%,#071324 100%);
  box-shadow:var(--shadow);
}

.conversion-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(120deg,rgba(255,255,255,.035),transparent 25%,transparent 75%,rgba(64,230,255,.025));
}

.status-pill{
  position:relative;
  z-index:1;
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:0 auto;
  padding:9px 15px;
  border:1px solid rgba(49,237,119,.27);
  border-radius:999px;
  background:rgba(49,237,119,.09);
  color:#71f8a7;
  font-size:10px;
  line-height:1;
  font-weight:800;
  letter-spacing:1.7px;
  text-transform:uppercase;
  box-shadow:0 0 0 1px rgba(49,237,119,.03) inset,0 0 28px rgba(49,237,119,.06);
}

.status-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--green);
  box-shadow:0 0 0 5px rgba(49,237,119,.09),0 0 16px var(--green);
  animation:pulseStatus 1.8s ease-in-out infinite;
}

@keyframes pulseStatus{
  0%,100%{transform:scale(.86);opacity:.75}
  50%{transform:scale(1.16);opacity:1}
}

.brand-wrap{
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:128px;
  margin:18px auto 8px;
}

.brand-logo{
  display:block;
  width:min(210px,72%);
  max-height:150px;
  object-fit:contain;
  filter:drop-shadow(0 16px 26px rgba(0,0,0,.28));
}

h1{
  margin:12px 0 14px;
  font-size:clamp(29px,7.4vw,36px);
  line-height:1.06;
  letter-spacing:-1.35px;
  font-weight:900;
  text-wrap:balance;
}

.lead{
  margin:0 auto;
  max-width:365px;
  color:#b0bdd4;
  font-size:14px;
  line-height:1.55;
  text-wrap:balance;
}

.primary-cta{
  position:relative;
  isolation:isolate;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  width:100%;
  min-height:58px;
  margin:26px 0 14px;
  padding:16px 18px;
  overflow:hidden;
  border-radius:17px;
  color:#06100a;
  text-decoration:none;
  font-size:15px;
  font-weight:900;
  background:linear-gradient(135deg,var(--green-2),var(--green));
  box-shadow:0 12px 32px rgba(49,237,119,.24),0 0 30px rgba(49,237,119,.12);
  transition:transform .22s ease,box-shadow .22s ease,filter .22s ease;
}

.primary-cta::after{
  content:"";
  position:absolute;
  top:-35%;
  left:-28%;
  width:25%;
  height:170%;
  z-index:-1;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
  transform:rotate(15deg);
  transition:left .5s ease;
}

.primary-cta:hover{
  transform:translateY(-3px) scale(1.01);
  filter:saturate(1.08);
  box-shadow:0 18px 42px rgba(49,237,119,.35),0 0 40px rgba(49,237,119,.16);
}

.primary-cta:hover::after{left:112%}
.primary-cta:active{transform:translateY(-1px) scale(.995)}

.wa-icon{display:grid;place-items:center}
.response-note{
  color:#8294b6;
  font-size:11px;
  line-height:1.4;
}

.trust-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:17px;
  margin:18px auto 2px;
  padding:11px 14px;
  width:max-content;
  max-width:100%;
  border:1px solid rgba(116,145,202,.16);
  border-radius:14px;
  background:rgba(16,27,51,.62);
}
.trust-item{
  display:flex;
  align-items:flex-start;
  flex-direction:column;
  gap:2px;
  text-align:left;
}
.trust-item strong{
  color:#fff;
  font-size:12px;
  line-height:1.1;
  font-weight:800;
}
.trust-item span{
  color:#8294b6;
  font-size:9px;
  white-space:nowrap;
}
.trust-item .star{
  color:#ffc94c;
  font-size:12px;
}
.trust-divider{
  width:1px;
  height:25px;
  background:rgba(123,148,194,.2);
}

.section-label{
  margin:27px 0 15px;
  color:#7f91b2;
  font-size:10px;
  font-weight:800;
  letter-spacing:3px;
  text-transform:uppercase;
}

.service-list{
  display:flex;
  flex-direction:column;
  gap:13px;
}

.service-card{
  display:grid;
  grid-template-columns:52px 1fr 20px;
  align-items:center;
  gap:13px;
  min-height:84px;
  padding:13px 14px;
  border:1px solid var(--stroke);
  border-radius:18px;
  color:var(--text);
  text-align:left;
  text-decoration:none;
  background:linear-gradient(135deg,rgba(20,31,58,.96),rgba(13,25,47,.96));
  box-shadow:0 10px 28px rgba(0,0,0,.10);
  transition:transform .23s cubic-bezier(.2,.8,.2,1),border-color .23s ease,box-shadow .23s ease,background .23s ease;
}

.service-card:hover{
  transform:translateY(-4px) translateX(2px);
  border-color:#3a5683;
  background:linear-gradient(135deg,#172647,#10203b);
  box-shadow:0 16px 34px rgba(0,0,0,.22),0 0 26px rgba(62,107,255,.06);
}

.service-icon{
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  border-radius:14px;
  font-size:27px;
  background:linear-gradient(145deg,#34458c,#26346f);
  box-shadow:0 8px 20px rgba(0,0,0,.18);
  transition:transform .24s ease,filter .24s ease;
}

.service-card:hover .service-icon{
  transform:rotate(-4deg) scale(1.08);
  filter:brightness(1.13);
}

.service-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.service-copy strong{
  font-size:14px;
  line-height:1.25;
  font-weight:800;
}

.service-copy span{
  color:#8fa1c3;
  font-size:11px;
  line-height:1.35;
}

.service-arrow{
  color:#adc0e2;
  font-size:18px;
  transition:transform .22s ease,color .22s ease;
}

.service-card:hover .service-arrow{
  transform:translateX(5px);
  color:#fff;
}

footer{
  margin-top:28px;
  color:#647695;
  font-size:11px;
}

.social-proof-slot{
  display:flex;
  justify-content:center;
  margin:16px 0 10px;
  min-height:72px;
}

.social-proof{
  width:min(100%, 330px);
  padding:14px 16px;
  border:1px solid rgba(49,237,119,.28);
  border-radius:18px;
  color:#f3fff8;
  background:linear-gradient(135deg, rgba(17,74,42,.95), rgba(11,49,30,.95));
  box-shadow:0 18px 40px rgba(12, 59, 33, .28), 0 0 28px rgba(49,237,119,.10);
  opacity:0;
  transform:translateY(10px) scale(.98);
  pointer-events:none;
  transition:opacity .35s ease,transform .35s cubic-bezier(.2,.8,.2,1);
}

.social-proof.is-visible{
  opacity:1;
  transform:translateY(0) scale(1);
}

.proof-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
  text-align:left;
}

.proof-copy strong{
  overflow:hidden;
  color:#fff;
  font-size:12px;
  white-space:nowrap;
  text-overflow:ellipsis;
  font-weight:800;
}

.proof-copy span{
  color:#d7f6e2;
  font-size:10px;
  line-height:1.35;
}

@media (max-width:520px){
  .site-shell{padding:0}
  .conversion-card{
    width:100%;
    min-height:100vh;
    border-width:0;
    border-radius:0;
    padding:25px 18px 34px;
  }

}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto!important;
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
}
