*{box-sizing:border-box;margin:0;padding:0;}

:root{
  --navy:#0a0f1e;
  --navy2:#0f1629;
  --navy3:#162040;
  --blue:#3b82f6;
  --blue2:#60a5fa;
  --blue-soft:rgba(59,130,246,0.1);
  --blue-glow:rgba(59,130,246,0.2);
  --white:#ffffff;
  --white2:rgba(255,255,255,0.7);
  --white3:rgba(255,255,255,0.35);
  --white4:rgba(255,255,255,0.08);
  --border:rgba(255,255,255,0.08);
  --border2:rgba(255,255,255,0.14);
  --display:'Syne',sans-serif;
  --sans:'DM Sans',sans-serif;
  --mono:'DM Mono',monospace;
  --max:1200px;
}

html{scroll-behavior:smooth;}

body{
  background:var(--navy);
  color:var(--white);
  font-family:var(--sans);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  line-height:1.55;
  letter-spacing:-0.01em;
}

a{color:inherit;text-decoration:none;}

/* ─── NAV ──────────────────────────────────────────────────────── */
.nav{
  position:fixed;top:0;left:0;right:0;
  background:rgba(10,15,30,0.78);
  backdrop-filter:blur(20px) saturate(120%);
  -webkit-backdrop-filter:blur(20px) saturate(120%);
  border-bottom:1px solid var(--border);
  box-shadow:0 1px 0 rgba(59,130,246,0.15);
  z-index:100;
  transition:padding 0.2s ease, background 0.2s ease;
}

.nav.scrolled{
  background:rgba(10,15,30,0.92);
}

.nav-inner{
  max-width:var(--max);
  margin:0 auto;
  padding:18px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  transition:padding 0.2s ease;
}

.nav.scrolled .nav-inner{padding:12px 24px;}

.nav-logo{
  font-family:var(--display);
  font-size:20px;
  font-weight:700;
  letter-spacing:-0.02em;
  color:var(--white);
}

.nav-links{
  display:flex;
  align-items:center;
  gap:28px;
  flex:1;
  justify-content:center;
}

.nav-link{
  font-family:var(--sans);
  font-size:14px;
  font-weight:500;
  color:var(--white3);
  cursor:pointer;
  transition:color 0.18s ease;
}

.nav-link:hover{color:var(--white);}

.nav-cta{
  font-family:var(--sans);
  font-size:13.5px;
  font-weight:600;
  color:var(--white);
  background:var(--blue);
  border:none;
  padding:9px 18px;
  border-radius:8px;
  cursor:pointer;
  transition:transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
  box-shadow:0 4px 16px var(--blue-glow);
}

.nav-cta:hover{
  transform:translateY(-1px);
  background:var(--blue2);
  box-shadow:0 6px 22px var(--blue-glow);
}

.nav-hamburger{
  display:none;
  background:transparent;
  border:none;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
  padding:4px;
}

.nav-hamburger span{
  display:block;
  width:22px;
  height:2px;
  background:var(--white);
  border-radius:2px;
  transition:transform 0.2s ease;
}

/* ─── HERO ─────────────────────────────────────────────────────── */
.hero{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:110px 24px 80px;
  overflow:hidden;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size:48px 48px;
  background-position:center;
}

.hero-glow{
  position:absolute;
  top:-10%;left:50%;
  transform:translateX(-50%);
  width:1200px;height:800px;
  background:radial-gradient(closest-side, rgba(59,130,246,0.22), rgba(59,130,246,0.08) 50%, transparent 80%);
  pointer-events:none;
  z-index:0;
}

.hero-inner{
  position:relative;
  z-index:1;
  text-align:center;
  max-width:780px;
  padding-top:80px;
}

.hero-inner::after{
  content:'';
  position:absolute;
  top:40%;left:50%;
  transform:translate(-50%,-50%);
  width:520px;height:240px;
  background:radial-gradient(closest-side, rgba(59,130,246,0.2), rgba(59,130,246,0.06) 60%, transparent 80%);
  pointer-events:none;
  z-index:-1;
  filter:blur(12px);
}

.hero-badge{
  display:inline-flex;
  align-items:center;
  font-family:var(--mono);
  font-size:11px;
  font-weight:500;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--blue);
  background:var(--blue-soft);
  border:1px solid rgba(59,130,246,0.3);
  padding:6px 14px;
  border-radius:100px;
  margin-bottom:28px;
}

.hero-headline{
  font-family:var(--display);
  font-size:clamp(42px, 6.5vw, 76px);
  font-weight:800;
  letter-spacing:-0.04em;
  line-height:1.04;
  margin-bottom:24px;
  background:linear-gradient(180deg, #ffffff 60%, rgba(255,255,255,0.85));
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

.hero-subheadline{
  font-family:var(--sans);
  font-size:clamp(16px, 1.6vw, 20px);
  font-weight:400;
  color:var(--white2);
  max-width:560px;
  margin:0 auto;
  line-height:1.6;
}

.hero-ctas{
  display:flex;
  gap:12px;
  justify-content:center;
  flex-wrap:wrap;
  margin-top:40px;
}

.btn{
  font-family:var(--sans);
  font-size:14px;
  font-weight:600;
  letter-spacing:-0.01em;
  border-radius:10px;
  padding:14px 28px;
  cursor:pointer;
  transition:transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, border-color 0.18s ease;
  border:1px solid transparent;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.btn-primary{
  background:linear-gradient(135deg, var(--blue), var(--blue2));
  color:var(--white);
  box-shadow:0 6px 20px var(--blue-glow);
}

.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 28px var(--blue-glow);}

.btn-secondary{
  background:transparent;
  color:var(--white);
  border-color:rgba(255,255,255,0.18);
}

.btn-secondary:hover{
  background:var(--white4);
  border-color:rgba(255,255,255,0.28);
  transform:translateY(-2px);
}

/* ─── TRUST BAR ────────────────────────────────────────────────── */
.trust-bar{
  background:var(--navy3);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  padding:0 24px;
}

.trust-bar-inner{
  max-width:var(--max);
  margin:0 auto;
  min-height:60px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:32px;
  flex-wrap:wrap;
  padding:14px 0;
}

.trust-item{
  display:flex;
  align-items:center;
  gap:8px;
  font-family:var(--mono);
  font-size:11px;
  font-weight:500;
  letter-spacing:0.08em;
  color:var(--white3);
  text-transform:uppercase;
}

.trust-item svg{
  width:14px;height:14px;
  color:var(--blue);
  flex-shrink:0;
}

.trust-divider{
  width:1px;height:14px;
  background:var(--border);
}

@media (max-width:640px){
  .trust-bar-inner{gap:18px;}
  .trust-divider{display:none;}
}

/* ─── SECTIONS ─────────────────────────────────────────────────── */
.section{padding:100px 24px;}
.section-inner{max-width:var(--max);margin:0 auto;text-align:center;}

.problem-section,.how-section,.industries-section{background:var(--navy2);}
.demo-section,.pricing-section{background:var(--navy);}

.section-label{
  font-family:var(--mono);
  font-size:11px;
  font-weight:500;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--blue);
  margin-bottom:16px;
}

.section-headline{
  font-family:var(--display);
  font-size:clamp(32px, 4vw, 48px);
  font-weight:700;
  letter-spacing:-0.03em;
  line-height:1.1;
  margin-bottom:18px;
  background:linear-gradient(180deg, #ffffff 60%, rgba(255,255,255,0.85));
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

.section-subheadline{
  font-family:var(--sans);
  font-size:clamp(15px, 1.4vw, 18px);
  color:var(--white2);
  max-width:600px;
  margin:0 auto 56px;
  line-height:1.6;
}

/* ─── STATS ────────────────────────────────────────────────────── */
.stats-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-bottom:48px;
}

.stat-card{
  background:linear-gradient(135deg, rgba(59,130,246,0.12) 0%, rgba(59,130,246,0.06) 100%);
  border:1px solid rgba(59,130,246,0.25);
  border-radius:18px;
  padding:36px 28px;
  box-shadow:0 8px 32px rgba(0,0,0,0.3);
  transition:transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.stat-card:hover{
  transform:translateY(-2px);
  border-color:rgba(59,130,246,0.5);
  box-shadow:0 12px 40px rgba(0,0,0,0.4), 0 0 0 1px rgba(59,130,246,0.25);
}

.stat-number{
  font-family:var(--display);
  font-size:clamp(40px, 5vw, 56px);
  font-weight:800;
  letter-spacing:-0.03em;
  color:var(--blue);
  line-height:1;
  margin-bottom:14px;
}

.stat-desc{
  font-family:var(--sans);
  font-size:14px;
  color:var(--white2);
  line-height:1.5;
}

.problem-closing{
  font-family:var(--sans);
  font-size:clamp(16px, 1.6vw, 19px);
  color:var(--white);
  font-style:italic;
  max-width:680px;
  margin:0 auto;
  line-height:1.5;
}

/* ─── DEMO CHAT ────────────────────────────────────────────────── */
.demo-container{
  max-width:560px;
  margin:32px auto 32px;
  position:relative;
}

.demo-chat{
  background:linear-gradient(180deg, var(--navy2) 0%, var(--navy3) 100%);
  border:1px solid var(--border2);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 24px 64px rgba(0,0,0,0.5), 0 0 0 1px rgba(59,130,246,0.12);
  display:flex;
  flex-direction:column;
  min-height:420px;
  max-height:560px;
  text-align:left;
}

.demo-chat-header{
  padding:14px 18px;
  border-bottom:1px solid var(--border);
  background:rgba(10,15,30,0.4);
}

.demo-chat-brand{display:flex;align-items:center;gap:12px;}

.demo-chat-mark{
  width:32px;height:32px;
  border-radius:9px;
  background:linear-gradient(135deg, var(--blue), var(--blue2));
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 16px var(--blue-glow);
}

.demo-chat-mark svg{width:16px;height:16px;}

.demo-chat-name{
  font-family:var(--display);
  font-size:14px;
  font-weight:700;
  letter-spacing:-0.01em;
}

.demo-chat-status{
  font-family:var(--mono);
  font-size:10px;
  color:var(--white3);
  letter-spacing:0.06em;
  display:flex;align-items:center;gap:6px;
  margin-top:2px;
}

.demo-chat-dot{
  width:6px;height:6px;
  border-radius:50%;
  background:#34d399;
  box-shadow:0 0 6px #34d399;
  animation:dchatpulse 2s ease-in-out infinite;
}

@keyframes dchatpulse{0%,100%{opacity:1;}50%{opacity:0.4;}}

.demo-chat-messages{
  flex:1;
  overflow-y:auto;
  padding:18px 16px 12px;
  display:flex;
  flex-direction:column;
  gap:10px;
  scrollbar-width:thin;
  scrollbar-color:var(--border2) transparent;
}

.demo-chat-messages::-webkit-scrollbar{width:6px;}
.demo-chat-messages::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px;}

.dmsg{
  max-width:78%;
  padding:10px 14px;
  border-radius:14px;
  font-family:var(--sans);
  font-size:14px;
  line-height:1.5;
  animation:dmsgIn 0.28s ease both;
}

@keyframes dmsgIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:translateY(0);}}

.dmsg.bot{
  align-self:flex-start;
  background:var(--white4);
  border:1px solid var(--border);
  color:var(--white);
  border-bottom-left-radius:5px;
}

.dmsg.user{
  align-self:flex-end;
  background:linear-gradient(135deg, var(--blue), var(--blue2));
  color:#fff;
  border-bottom-right-radius:5px;
  box-shadow:0 4px 12px var(--blue-glow);
}

.dchips{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:4px 0 2px;
  animation:dmsgIn 0.32s ease both;
}

.dchip{
  font-family:var(--sans);
  font-size:13px;
  font-weight:500;
  color:var(--blue);
  background:var(--blue-soft);
  border:1px solid rgba(59,130,246,0.25);
  padding:7px 13px;
  border-radius:100px;
  cursor:pointer;
  transition:transform 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}

.dchip:hover{
  background:rgba(59,130,246,0.18);
  border-color:rgba(59,130,246,0.5);
  transform:translateY(-1px);
}

.dchip:disabled{opacity:0.5;cursor:default;transform:none;}

.dtyping{
  align-self:flex-start;
  background:var(--white4);
  border:1px solid var(--border);
  border-radius:14px;
  border-bottom-left-radius:5px;
  padding:12px 16px;
  display:flex;
  gap:4px;
  animation:dmsgIn 0.2s ease both;
}

.dtyping span{
  width:6px;height:6px;
  border-radius:50%;
  background:var(--white3);
  animation:dtype 1.2s ease-in-out infinite;
}

.dtyping span:nth-child(2){animation-delay:0.15s;}
.dtyping span:nth-child(3){animation-delay:0.3s;}

@keyframes dtype{
  0%,80%,100%{transform:scale(0.7);opacity:0.4;}
  40%{transform:scale(1);opacity:1;}
}

.dwidget-preview{
  align-self:stretch;
  background:linear-gradient(180deg, rgba(10,15,30,0.6), rgba(15,22,41,0.6));
  border:1px solid var(--border2);
  border-radius:14px;
  padding:14px;
  margin:4px 0;
  animation:dmsgIn 0.4s ease both;
}

.dwp-head{
  display:flex;
  align-items:center;
  gap:10px;
  padding-bottom:10px;
  border-bottom:1px solid var(--border);
  margin-bottom:10px;
}

.dwp-icon{
  width:26px;height:26px;
  border-radius:7px;
  background:linear-gradient(135deg, var(--blue), var(--blue2));
  display:flex;align-items:center;justify-content:center;
  font-size:13px;
}

.dwp-name{
  font-family:var(--display);
  font-size:12px;
  font-weight:600;
}

.dwp-sub{
  font-family:var(--mono);
  font-size:9.5px;
  color:var(--white3);
  letter-spacing:0.08em;
  text-transform:uppercase;
  margin-top:1px;
}

.dwp-body{display:flex;flex-direction:column;gap:6px;}

.dwp-chip{
  padding:8px 12px;
  background:var(--white4);
  border:1px solid var(--border);
  border-radius:10px;
  font-family:var(--sans);
  font-size:12px;
  color:var(--white2);
  display:flex;
  align-items:center;
  gap:8px;
}

.dwp-chip::before{
  content:'';
  width:5px;height:5px;
  border-radius:50%;
  background:var(--blue);
}

.dcta{
  align-self:stretch;
  font-family:var(--sans);
  font-size:14px;
  font-weight:600;
  background:linear-gradient(135deg, var(--blue), var(--blue2));
  color:#fff;
  border:none;
  padding:12px 16px;
  border-radius:11px;
  cursor:pointer;
  margin:4px 0 2px;
  box-shadow:0 6px 20px var(--blue-glow);
  transition:transform 0.15s ease, box-shadow 0.15s ease;
  animation:dmsgIn 0.4s ease both;
}

.dcta:hover{transform:translateY(-1px);box-shadow:0 10px 28px var(--blue-glow);}

.demo-chat-input{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-top:1px solid var(--border);
  background:rgba(10,15,30,0.55);
}

.demo-chat-input input{
  flex:1;
  background:var(--navy);
  border:1px solid var(--border);
  border-radius:10px;
  padding:9px 12px;
  font-family:var(--sans);
  font-size:13px;
  color:var(--white);
  outline:none;
}

.demo-chat-input input::placeholder{color:var(--white3);font-style:italic;}

.demo-chat-send{
  width:34px;height:34px;
  border-radius:50%;
  background:var(--white4);
  border:1px solid var(--border);
  color:var(--white3);
  cursor:default;
  display:flex;
  align-items:center;
  justify-content:center;
}

.demo-note{
  font-family:var(--sans);
  font-size:14px;
  color:var(--white3);
  font-style:italic;
  margin-top:8px;
}

/* ─── STEPS ────────────────────────────────────────────────────── */
.steps-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:32px;
  position:relative;
  margin-top:8px;
}

.steps-grid::before{
  content:'';
  position:absolute;
  top:24px;
  left:14%;right:14%;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(59,130,246,0.4) 25%, rgba(59,130,246,0.4) 75%, transparent);
  z-index:0;
}

.step{
  position:relative;
  z-index:1;
  text-align:center;
  padding:0 8px;
}

.step-number{
  width:48px;height:48px;
  border-radius:50%;
  background:var(--navy3);
  border:1px solid rgba(59,130,246,0.4);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--display);
  font-size:16px;
  font-weight:700;
  color:var(--blue);
  margin:0 auto 22px;
  box-shadow:0 0 0 6px var(--navy2), 0 0 0 10px rgba(59,130,246,0.12), 0 0 20px rgba(59,130,246,0.15);
}

.step-title{
  font-family:var(--display);
  font-size:22px;
  font-weight:600;
  letter-spacing:-0.02em;
  margin-bottom:12px;
}

.step-desc{
  font-family:var(--sans);
  font-size:15px;
  color:var(--white2);
  line-height:1.6;
  max-width:320px;
  margin:0 auto;
}

/* ─── PRICING ──────────────────────────────────────────────────── */
.pricing-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:22px;
  align-items:stretch;
  max-width:820px;
  margin:0 auto;
}

.plan-card{
  position:relative;
  border-radius:22px;
  padding:40px 36px;
  text-align:left;
  display:flex;
  flex-direction:column;
  transition:transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.plan-card.available{
  background:var(--navy3);
  border:1px solid rgba(59,130,246,0.5);
  box-shadow:0 6px 28px rgba(59,130,246,0.12), inset 0 0 0 1px rgba(59,130,246,0.3);
}

.plan-card.coming-soon{
  background:var(--navy2);
  border:1px solid var(--border);
  opacity:0.78;
}

.plan-card:hover{
  transform:translateY(-3px);
}

.plan-card.available:hover{box-shadow:0 12px 36px rgba(59,130,246,0.22);}

.plan-badge{
  position:absolute;
  top:18px;right:18px;
  font-family:var(--mono);
  font-size:10px;
  font-weight:500;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--blue);
  background:var(--blue-soft);
  border:1px solid rgba(59,130,246,0.3);
  padding:4px 10px;
  border-radius:100px;
}

.plan-name{
  font-family:var(--display);
  font-size:20px;
  font-weight:700;
  letter-spacing:-0.02em;
  margin-bottom:14px;
}

.plan-price{
  font-family:var(--display);
  font-size:42px;
  font-weight:800;
  letter-spacing:-0.03em;
  color:var(--blue);
  line-height:1;
  margin-bottom:6px;
}

.plan-card.coming-soon .plan-price{
  color:var(--white3);
  font-size:24px;
}

.plan-period{
  font-family:var(--sans);
  font-size:14px;
  color:var(--white3);
  margin-bottom:16px;
}

.plan-desc{
  font-family:var(--sans);
  font-size:14.5px;
  color:var(--white2);
  margin-bottom:22px;
  line-height:1.55;
  min-height:42px;
}

.plan-features{
  list-style:none;
  margin:0 0 28px;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:10px;
  flex:1;
}

.plan-feature{
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-family:var(--sans);
  font-size:14px;
  color:var(--white2);
  line-height:1.5;
}

.plan-feature::before{
  content:'';
  width:16px;height:16px;
  border-radius:50%;
  background:var(--blue-soft);
  background-image:radial-gradient(closest-side, var(--blue) 28%, transparent 32%);
  flex-shrink:0;
  margin-top:2px;
}

.plan-cta{
  font-family:var(--sans);
  font-size:14px;
  font-weight:600;
  padding:12px 18px;
  border-radius:10px;
  border:1px solid transparent;
  cursor:pointer;
  transition:transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
  width:100%;
  text-align:center;
}

.plan-card.available .plan-cta{
  background:var(--blue);
  color:var(--white);
}

.plan-card.available .plan-cta:hover{
  background:var(--blue2);
  transform:translateY(-1px);
}

.plan-card.coming-soon .plan-cta{
  background:transparent;
  color:var(--white);
  border-color:rgba(255,255,255,0.2);
}

.plan-card.coming-soon .plan-cta:hover{
  background:var(--white4);
  border-color:rgba(255,255,255,0.35);
}

/* ─── INDUSTRIES ───────────────────────────────────────────────── */
.industries-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}

.industry-card{
  position:relative;
  padding:28px 24px;
  border-radius:14px;
  text-align:left;
  transition:transform 0.2s ease, border-color 0.2s ease;
}

.industry-card.available{
  background:var(--navy3);
  border:1px solid rgba(59,130,246,0.4);
  box-shadow:0 4px 24px rgba(59,130,246,0.1);
}

.industry-card.coming-soon{
  background:var(--navy);
  border:1px solid var(--border);
  opacity:0.7;
}

.industry-card:hover{
  transform:translateY(-2px);
}

.industry-card.available:hover{border-color:rgba(59,130,246,0.65);}

.industry-icon{
  font-size:32px;
  margin-bottom:14px;
  line-height:1;
}

.industry-name{
  font-family:var(--display);
  font-size:18px;
  font-weight:600;
  letter-spacing:-0.02em;
  margin-bottom:8px;
}

.industry-desc{
  font-family:var(--sans);
  font-size:13.5px;
  color:var(--white2);
  line-height:1.55;
}

.industry-status{
  position:absolute;
  top:18px;right:18px;
  font-family:var(--mono);
  font-size:9.5px;
  font-weight:500;
  letter-spacing:0.1em;
  text-transform:uppercase;
  padding:4px 9px;
  border-radius:100px;
}

.industry-card.available .industry-status{
  color:var(--blue);
  background:var(--blue-soft);
  border:1px solid rgba(59,130,246,0.3);
}

.industry-card.coming-soon .industry-status{
  color:var(--white3);
  background:var(--white4);
  border:1px solid var(--border);
}

/* ─── FOOTER ───────────────────────────────────────────────────── */
.footer{
  background:var(--navy3);
  border-top:1px solid var(--border);
  padding:60px 24px 32px;
}

.footer-inner{max-width:var(--max);margin:0 auto;}

.footer-top{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:32px;
  padding-bottom:36px;
  border-bottom:1px solid var(--border);
}

.footer-logo{
  font-family:var(--display);
  font-size:22px;
  font-weight:700;
  letter-spacing:-0.02em;
  color:var(--white);
  margin-bottom:8px;
}

.footer-tagline{
  font-family:var(--sans);
  font-size:14px;
  color:var(--white2);
}

.footer-cols{
  display:contents;
}

.footer-col-label{
  font-family:var(--mono);
  font-size:11px;
  font-weight:500;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--white3);
  margin-bottom:14px;
}

.footer-col-links{
  list-style:none;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:9px;
}

.footer-col-links li{
  font-family:var(--sans);
  font-size:14px;
  color:var(--white2);
  cursor:pointer;
  transition:color 0.15s ease;
}

.footer-col-links li:hover{color:var(--white);}

.footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-top:24px;
  gap:24px;
  flex-wrap:wrap;
}

.footer-legal,.footer-copyright,.footer-powered{
  font-family:var(--mono);
  font-size:11px;
  color:var(--white3);
  letter-spacing:0.04em;
}

.footer-legal{display:flex;gap:18px;flex-wrap:wrap;}
.footer-legal span{cursor:pointer;transition:color 0.15s ease;}
.footer-legal span:hover{color:var(--white2);}

.footer-powered{
  font-family:var(--mono);
  font-style:italic;
  color:var(--white3);
}

/* ─── MODAL ────────────────────────────────────────────────────── */
.modal-backdrop{
  position:fixed;inset:0;
  background:rgba(5,8,16,0.78);
  backdrop-filter:blur(10px);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:200;
  padding:24px;
}

.modal-backdrop.open{display:flex;}

.modal{
  background:var(--navy2);
  border:1px solid var(--border2);
  border-radius:18px;
  max-width:440px;
  width:100%;
  padding:32px;
  position:relative;
  box-shadow:0 20px 60px rgba(0,0,0,0.6);
  animation:modalIn 0.22s cubic-bezier(0.34,1.56,0.64,1) both;
}

@keyframes modalIn{
  from{opacity:0;transform:translateY(12px) scale(0.97);}
  to{opacity:1;transform:translateY(0) scale(1);}
}

.modal-close{
  position:absolute;top:14px;right:14px;
  background:transparent;
  border:none;
  color:var(--white3);
  font-size:24px;
  cursor:pointer;
  width:32px;height:32px;
  border-radius:8px;
  transition:background 0.15s ease, color 0.15s ease;
  line-height:1;
}

.modal-close:hover{background:var(--white4);color:var(--white);}

.modal-title{
  font-family:var(--display);
  font-size:24px;
  font-weight:700;
  letter-spacing:-0.02em;
  margin-bottom:8px;
}

.modal-sub{
  font-family:var(--sans);
  font-size:14px;
  color:var(--white2);
  margin-bottom:22px;
}

.modal-label{
  font-family:var(--mono);
  font-size:10.5px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--white3);
  margin-bottom:6px;
  display:block;
}

.modal-input{
  width:100%;
  background:var(--navy3);
  border:1px solid var(--border2);
  border-radius:10px;
  padding:11px 14px;
  font-family:var(--sans);
  font-size:14px;
  color:var(--white);
  outline:none;
  margin-bottom:14px;
  transition:border-color 0.15s ease;
}

.modal-input:focus{border-color:var(--blue);}
.modal-input::placeholder{color:var(--white3);}

.modal-submit{width:100%;margin-top:6px;}

.modal-success{
  text-align:center;
  padding:20px 0;
}

.modal-success-icon{
  width:54px;height:54px;
  border-radius:50%;
  background:var(--blue-soft);
  border:1px solid var(--blue);
  color:var(--blue);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:28px;
  margin:0 auto 16px;
}

.modal-success-text{
  font-family:var(--sans);
  font-size:15px;
  color:var(--white2);
  line-height:1.5;
}

/* ─── ANIMATIONS / OBSERVER ───────────────────────────────────── */
.reveal{
  opacity:0;
  transform:translateY(20px);
  transition:opacity 0.55s ease, transform 0.55s ease;
}

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

.hero-badge,.hero-headline,.hero-subheadline,.hero-ctas{
  opacity:0;
  transform:translateY(14px);
  animation:heroIn 0.65s ease forwards;
}

.hero-badge{animation-delay:0.05s;}
.hero-headline{animation-delay:0.15s;}
.hero-subheadline{animation-delay:0.28s;}
.hero-ctas{animation-delay:0.4s;}

@keyframes heroIn{to{opacity:1;transform:translateY(0);}}

/* ─── RESPONSIVE ───────────────────────────────────────────────── */
@media (max-width:900px){
  .stats-grid{grid-template-columns:1fr;}
  .steps-grid{grid-template-columns:1fr;gap:36px;}
  .steps-grid::before{display:none;}
  .pricing-grid{grid-template-columns:1fr;}
  .industries-grid{grid-template-columns:repeat(2,1fr);}
  .footer-top{grid-template-columns:1fr;}
  .footer-cols{display:flex;gap:36px;}
}

@media (max-width:640px){
  .section{padding:72px 20px;}
  .hero{padding:120px 20px 72px;}
  .nav-links{
    display:none;
    position:absolute;
    top:100%;left:0;right:0;
    background:rgba(10,15,30,0.96);
    backdrop-filter:blur(20px);
    flex-direction:column;
    gap:0;
    padding:8px 16px 16px;
    border-bottom:1px solid var(--border);
  }
  .nav-links.open{display:flex;}
  .nav-link{padding:12px 8px;width:100%;border-bottom:1px solid var(--border);}
  .nav-link:last-child{border-bottom:none;}
  .nav-hamburger{display:flex;}
  .nav-cta{padding:8px 14px;font-size:12.5px;}
  .industries-grid{grid-template-columns:1fr;}
  .footer-cols{flex-direction:column;gap:24px;}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:10px;}
}