:root{
  --c1:#06B6D4; /* cyan */
  --c2:#8B5CF6; /* violet */
  --c3:#F472B6; /* pink */
  --c4:#10B981; /* green */

  --bg0:#050713;
  --bg1:#060A16;
  --bg2:#0A0D14;

  --text:#F8FAFC;
  --muted:#94A3B8;
}

/* Prevent FOUC (flash of unstyled content) and color shift on load */
html{
  background-color:var(--bg0);
}

/* Clip all overflow at the root level */
html, body{
  overflow-x:hidden !important;
  max-width:100vw;
  position:relative;
}

*{margin:0;padding:0;box-sizing:border-box}
html{
  scroll-behavior:smooth;
  overflow-x:hidden;
}
body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  color:var(--text);
  min-height:100vh;
  min-height:100dvh; /* Dynamic viewport height for mobile */
  overflow-x:hidden;
  overflow-y:auto;
  position:relative;

  /* More vibrant base like the mock */
  background:
    radial-gradient(1100px at 18% 28%, rgba(6,182,212,0.26), transparent 60%),
    radial-gradient(900px at 82% 18%, rgba(139,92,246,0.30), transparent 55%),
    radial-gradient(900px at 56% 86%, rgba(244,114,182,0.22), transparent 58%),
    radial-gradient(900px at 12% 88%, rgba(16,185,129,0.18), transparent 58%),
    linear-gradient(180deg, var(--bg0) 0%, var(--bg1) 46%, var(--bg2) 100%);
}

/* Animated nebula flow */
body::before{
  content:"";
  position:fixed;
  inset:-35%;
  z-index:-4;
  background:
    conic-gradient(from 220deg at 55% 45%,
      rgba(244,114,182,0.18),
      rgba(6,182,212,0.20),
      rgba(139,92,246,0.22),
      rgba(16,185,129,0.16),
      rgba(244,114,182,0.18)
    );
  filter:blur(170px);
  opacity:0.98;
  animation: nebulaSpin 46s linear infinite;
}
@keyframes nebulaSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* Star haze */
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 20% 30%, rgba(255,255,255,0.08), transparent 35%),
    radial-gradient(circle at 70% 25%, rgba(255,255,255,0.07), transparent 42%),
    radial-gradient(circle at 40% 80%, rgba(255,255,255,0.07), transparent 38%),
    radial-gradient(circle at 85% 70%, rgba(255,255,255,0.06), transparent 45%);
  mix-blend-mode:screen;
  opacity:0.44;
}

/* Planets - contained within viewport to prevent mobile scroll */
.planet{
  position:fixed;
  border-radius:999px;
  pointer-events:none;
  z-index:-2;
  opacity:0.95;
  box-shadow: 0 34px 140px rgba(0,0,0,0.52), inset 0 0 48px rgba(255,255,255,0.10);
  transform: translateZ(0);
  will-change: transform;
}
.planet::before{
  content:"";
  position:absolute;
  inset:-34%;
  border-radius:999px;
  filter: blur(74px);
  opacity:0.60;
  mix-blend-mode:screen;
}
.planet::after{
  content:"";
  position:absolute;
  inset:-28px -52px;
  border-radius:999px;
  border: 1px solid rgba(255,255,255,0.14);
  transform: rotate(-18deg);
  opacity:0.20;
}
.planet-1{
  width: 430px; height: 430px;
  left: -140px; top: 120px;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,0.24), transparent 35%),
    radial-gradient(circle at 65% 70%, rgba(6,182,212,0.46), rgba(139,92,246,0.14) 60%, rgba(0,0,0,0) 72%),
    radial-gradient(circle at 40% 55%, rgba(16,185,129,0.24), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(0,0,0,0.22), rgba(0,0,0,0.70));
  animation: planetDrift1 18s ease-in-out infinite;
}
.planet-1::before{ background: radial-gradient(circle, rgba(6,182,212,0.36), transparent 62%); }
.planet-2{
  width: 540px; height: 540px;
  right: -190px; top: -150px;
  background:
    radial-gradient(circle at 30% 25%, rgba(255,255,255,0.22), transparent 35%),
    radial-gradient(circle at 68% 72%, rgba(244,114,182,0.38), rgba(99,102,241,0.20) 55%, transparent 70%),
    radial-gradient(circle at 45% 55%, rgba(6,182,212,0.20), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(0,0,0,0.24), rgba(0,0,0,0.74));
  animation: planetDrift2 22s ease-in-out infinite;
}
.planet-2::before{ background: radial-gradient(circle, rgba(244,114,182,0.32), transparent 62%); }
.planet-3{
  width: 660px; height: 660px;
  right: -250px; bottom: -270px;
  background:
    radial-gradient(circle at 30% 25%, rgba(255,255,255,0.20), transparent 35%),
    radial-gradient(circle at 62% 68%, rgba(16,185,129,0.30), rgba(6,182,212,0.18) 55%, transparent 72%),
    radial-gradient(circle at 45% 55%, rgba(139,92,246,0.22), transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(0,0,0,0.26), rgba(0,0,0,0.76));
  animation: planetDrift3 26s ease-in-out infinite;
}
.planet-3::before{ background: radial-gradient(circle, rgba(16,185,129,0.28), transparent 62%); }
@keyframes planetDrift1{0%,100%{transform:translate(0,0)}50%{transform:translate(14px,-10px)}}
@keyframes planetDrift2{0%,100%{transform:translate(0,0)}50%{transform:translate(-16px,12px)}}
@keyframes planetDrift3{0%,100%{transform:translate(0,0)}50%{transform:translate(-12px,-14px)}}

/* Orbs */
.orb{
  position:fixed;width:560px;height:560px;border-radius:999px;
  filter:blur(90px);opacity:.22;z-index:-3;
  pointer-events:none;mix-blend-mode:screen;
  animation: orbFloat 14s ease-in-out infinite;
  will-change: transform;
}
.orb-1{top:-170px;left:-170px;background:radial-gradient(circle at 30% 30%, rgba(139,92,246,0.95), transparent 60%)}
.orb-2{bottom:-220px;right:-220px;background:radial-gradient(circle at 30% 30%, rgba(6,182,212,0.90), transparent 60%);animation-delay:-2.5s}
@keyframes orbFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(18px,-22px,0)}}

/* Background mesh container to clip overflow */
.bg-mesh{
  position:fixed;
  inset:0;
  z-index:-10;
  overflow:hidden;
  pointer-events:none;
}

/* Stars */
.particles{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.star{position:absolute;width:2px;height:2px;border-radius:999px;background:rgba(255,255,255,0.96);box-shadow:0 0 12px rgba(255,255,255,0.20);opacity:0.55;animation:twinkle 3.2s ease-in-out infinite}
.star.big{width:3px;height:3px;opacity:0.78;box-shadow:0 0 16px rgba(255,255,255,0.24)}
@keyframes twinkle{0%,100%{opacity:.35}50%{opacity:.95}}
.spark{position:absolute;top:-20px;border-radius:999px;width:3px;height:3px;background:rgba(255,255,255,0.30);animation-name:floatDown;animation-timing-function:linear;animation-iteration-count:infinite;opacity:.45}
@keyframes floatDown{from{transform:translateY(-60px)}to{transform:translateY(calc(100vh + 140px))}}

/* Layout */
.hero{padding:78px 20px 34px;display:flex;flex-direction:column;align-items:center;text-align:center}
.logo-container{width:min(260px,70vw);margin-bottom:18px}
.logo-container img{width:100%;height:auto;filter:drop-shadow(0 22px 80px rgba(0,0,0,0.72))}

.launch-status{display:flex;align-items:center;gap:14px;margin:6px 0 18px;opacity:.95}
.status-line{width:96px;height:1px;background:linear-gradient(90deg, transparent, rgba(255,255,255,0.78), transparent);filter:drop-shadow(0 0 14px rgba(255,255,255,0.24))}
.status-text{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,0.86)}

/* Embossed glass headline */
h1{position:relative;line-height:1.02;margin:0 0 14px}
h1::after{
  content:"";
  position:absolute;left:50%;top:50%;
  width:min(860px,92vw);height:250px;
  transform:translate(-50%,-56%);
  background:radial-gradient(circle at 50% 50%, rgba(6,182,212,0.22), rgba(139,92,246,0.26), rgba(244,114,182,0.18), transparent 68%);
  filter:blur(56px);
  z-index:-1;
}

h1 .line-1, h1 .line-2{
  display:block;
  font-size:clamp(46px,6.3vw,74px);
  letter-spacing:-.04em;
  font-weight:950;
  position:relative;
}

/* Duplicated layers for emboss depth */
h1 .line-1::before, h1 .line-2::before{
  content: attr(data-text);
  position:absolute;left:0;top:0;
  z-index:-1;
  color:transparent;
  -webkit-text-stroke: 1px rgba(255,255,255,0.12);
  text-shadow:
    0 2px 0 rgba(255,255,255,0.08),
    0 4px 15px rgba(0,0,0,0.4),
    0 10px 30px rgba(0,0,0,0.5),
    0 26px 90px rgba(0,0,0,0.6);
  filter: blur(0.0px);
  opacity:0.95;
}

/* Base (glassy) */
h1 .line-1{
  background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(226,232,240,0.86), rgba(148,163,184,0.86));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,0.3)) drop-shadow(0 8px 25px rgba(0,0,0,0.4));
}

/* Vibrant animated gradient like the mock */
h1 .line-2{
  background: linear-gradient(90deg, var(--c1), var(--c2), var(--c3), var(--c4), var(--c1));
  background-size: 260% 260%;
  animation: gradientShift 6.8s ease-in-out infinite;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter: drop-shadow(0 0 25px rgba(6,182,212,0.25)) drop-shadow(0 0 50px rgba(139,92,246,0.2)) drop-shadow(0 4px 8px rgba(0,0,0,0.3));
}
@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}

/* Specular shine sweep */
h1 .line-1::after, h1 .line-2::after{
  content:"";
  position:absolute;inset:-10px -22px;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.34) 18%, rgba(255,255,255,0.14) 28%, transparent 48%, transparent 100%);
  filter: blur(14px);
  opacity:0.22;
  mix-blend-mode: screen;
  transform: translateX(-24%);
  animation: shineSweep 6.2s ease-in-out infinite;
  pointer-events:none;
}
@keyframes shineSweep{0%,100%{transform:translateX(-28%)}50%{transform:translateX(24%)}}

.subtitle{width:min(860px,92vw);color:rgba(255,255,255,0.82);font-size:15px;line-height:1.7;margin-bottom:18px}
.subtitle strong{color:rgba(255,255,255,0.94);font-weight:700;text-shadow:0 2px 8px rgba(0,0,0,0.5)}

/* Pills pop */
.pill-row{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:0 auto 30px;width:min(940px,92vw)}
.pill{
  font-size:12px;letter-spacing:.06em;
  padding:10px 12px;border-radius:999px;
  background:rgba(0,0,0,0.28);
  border:1px solid rgba(255,255,255,0.16);
  color:rgba(226,232,240,0.84);
  backdrop-filter:blur(18px);
  box-shadow:0 18px 60px rgba(0,0,0,0.36);
  position:relative;
}
.pill::before{
  content:"";
  position:absolute;inset:-1px;border-radius:999px;
  background:linear-gradient(90deg, rgba(6,182,212,0.30), rgba(139,92,246,0.24), rgba(244,114,182,0.18), rgba(16,185,129,0.22));
  filter:blur(14px);
  opacity:0.22;
  z-index:-1;
}
.pill:hover{transform:translateY(-1px)}
.pill:hover::before{opacity:0.34}

/* Alerts */
#alertContainer{width:min(760px,92vw);margin:0 auto 14px}
.alert{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;margin-bottom:10px;border:1px solid rgba(255,255,255,0.16);background:rgba(0,0,0,0.30);backdrop-filter:blur(18px)}
.alert-error{border-color:rgba(239,68,68,0.40)}
.alert-success{border-color:rgba(16,185,129,0.40)}

/* Form */
.form-container{width:min(820px,92vw);margin:0 auto}
.form-wrapper{
  display:flex;gap:12px;padding:12px;border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.03));
  border:1px solid rgba(255,255,255,0.18);
  backdrop-filter:blur(22px);
  box-shadow:0 52px 160px rgba(0,0,0,0.62);
  position:relative;
}
.form-wrapper::before{
  content:"";
  position:absolute;inset:-1px;border-radius:18px;
  background:linear-gradient(90deg, rgba(6,182,212,0.42), rgba(139,92,246,0.34), rgba(244,114,182,0.26), rgba(16,185,129,0.34));
  opacity:0.42;filter:blur(22px);z-index:-1;
}
.form-wrapper input{
  flex:1;border:none;outline:none;padding:14px 16px;border-radius:14px;
  background:rgba(0,0,0,0.34);color:var(--text);font-size:15px
}
.form-wrapper input::placeholder{color:rgba(148,163,184,0.92)}
.btn-submit{
  border:none;outline:none;cursor:pointer;padding:14px 18px;border-radius:14px;
  font-weight:980;letter-spacing:.01em;color:#061016;
  background:linear-gradient(90deg, rgba(16,185,129,1), rgba(6,182,212,1));
  box-shadow:0 18px 56px rgba(16,185,129,0.18), 0 18px 56px rgba(6,182,212,0.18);
  min-width:210px;
}
.btn-submit:hover{transform:translateY(-1px)}
.btn-submit:disabled{opacity:.6;cursor:not-allowed}

/* Beta toggle */
.beta-toggle{margin-top:14px;user-select:none}
.beta-toggle input{display:none}
.beta-toggle label{
  display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:16px;
  background:rgba(0,0,0,0.24);border:1px solid rgba(255,255,255,0.16);
  backdrop-filter:blur(20px);box-shadow:0 28px 92px rgba(0,0,0,0.40);cursor:pointer;
}
.beta-check{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;border:1px solid rgba(255,255,255,0.24);background:rgba(0,0,0,0.22)}
.beta-check svg{width:16px;height:16px;opacity:0;transform:scale(.9);transition:180ms ease}
.beta-text{text-align:left;display:flex;flex-direction:column;gap:2px}
.beta-text strong{color:rgba(255,255,255,0.92);font-weight:700;text-shadow:0 2px 8px rgba(0,0,0,0.5)}
.beta-text span{color:rgba(148,163,184,0.98);font-size:13px}
.beta-badge{margin-left:auto;font-size:12px;padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,0.18);background:rgba(0,0,0,0.22);color:rgba(255,255,255,0.84)}
.beta-toggle input:checked + label .beta-check{background:rgba(16,185,129,0.20);border-color:rgba(16,185,129,0.60)}
.beta-toggle input:checked + label .beta-check svg{opacity:1;transform:scale(1)}

/* Dev hint */
.dev-hint{display:flex;gap:10px;align-items:center;justify-content:center;margin-top:12px;color:rgba(148,163,184,0.94);font-size:12px}
.dev-hint code{background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.14);padding:2px 6px;border-radius:8px;color:rgba(255,255,255,0.90)}
.dev-pill{font-weight:980;letter-spacing:.08em;text-transform:uppercase;font-size:10px;padding:6px 8px;border-radius:999px;background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.16)}

/* Features */
.features-section{padding:26px 0 78px}
.section-head{width:min(1100px,calc(100% - 40px));margin:0 auto 18px;text-align:center}
.section-head h2{font-size:22px;font-weight:700;letter-spacing:-.02em;margin-bottom:6px;text-shadow:0 2px 10px rgba(0,0,0,0.5),0 22px 80px rgba(0,0,0,0.6)}
.section-head p{color:rgba(148,163,184,0.98);font-size:14px}

.feature-grid{width:min(1100px,calc(100% - 40px));margin:0 auto;display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.feature-card{
  border-radius:20px;
  background:linear-gradient(180deg, rgba(255,255,255,0.08), rgba(0,0,0,0.20));
  border:1px solid rgba(255,255,255,0.16);
  backdrop-filter:blur(22px);
  box-shadow:0 52px 170px rgba(0,0,0,0.66);
  overflow:hidden;position:relative;transform:translateZ(0);
  transition:transform 220ms ease, border-color 220ms ease;
}
.feature-card::before{
  content:"";
  position:absolute;inset:-1px;border-radius:20px;
  background:linear-gradient(90deg, rgba(6,182,212,0.34), rgba(139,92,246,0.26), rgba(244,114,182,0.20), rgba(16,185,129,0.26));
  opacity:0;filter:blur(22px);transition:opacity 220ms ease;z-index:0;
}
.feature-card:hover{transform:translateY(-7px);border-color:rgba(255,255,255,0.22)}
.feature-card:hover::before{opacity:1}

/* Card media band */
.card-media{
  height:98px;position:relative;display:flex;align-items:center;justify-content:center;
  background:
    radial-gradient(150px at 30% 20%, rgba(6,182,212,0.30), transparent 60%),
    radial-gradient(170px at 70% 30%, rgba(139,92,246,0.30), transparent 60%),
    radial-gradient(190px at 50% 85%, rgba(244,114,182,0.20), transparent 62%),
    radial-gradient(190px at 45% 70%, rgba(16,185,129,0.20), transparent 65%),
    rgba(0,0,0,0.26);
  border-bottom:1px solid rgba(255,255,255,0.14);
  z-index:1;
}
.media-glow{position:absolute;inset:-56px;background:radial-gradient(circle at 50% 50%, rgba(255,255,255,0.14), transparent 62%);filter:blur(26px);opacity:.76}

/* Gradient animated icons via mask */
.card-icon{
  width:38px;height:38px;display:block;
  background: linear-gradient(90deg, var(--c1), var(--c2), var(--c3), var(--c4), var(--c1));
  background-size: 260% 260%;
  animation: iconShift 5.8s ease-in-out infinite;
  opacity:0.95;
  filter: drop-shadow(0 10px 28px rgba(0,0,0,0.55));
}
@keyframes iconShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}

.card-icon.icon-branding{ -webkit-mask: url("../icons/icon-branding.svg") center/contain no-repeat; mask: url("../icons/icon-branding.svg") center/contain no-repeat; }
.card-icon.icon-support{ -webkit-mask: url("../icons/icon-support.svg") center/contain no-repeat; mask: url("../icons/icon-support.svg") center/contain no-repeat; }
.card-icon.icon-hosting{ -webkit-mask: url("../icons/icon-hosting.svg") center/contain no-repeat; mask: url("../icons/icon-hosting.svg") center/contain no-repeat; }
.card-icon.icon-wordpress{ -webkit-mask: url("../icons/icon-wordpress.svg") center/contain no-repeat; mask: url("../icons/icon-wordpress.svg") center/contain no-repeat; }
.card-icon.icon-collaboration{ -webkit-mask: url("../icons/icon-collaboration.svg") center/contain no-repeat; mask: url("../icons/icon-collaboration.svg") center/contain no-repeat; }

.feature-card h3,.feature-card p{position:relative;z-index:1;padding:0 16px}
.feature-card h3{font-size:15px;font-weight:700;margin:12px 0 6px;text-shadow:0 2px 8px rgba(0,0,0,0.5)}
.feature-card p{padding-bottom:16px;color:rgba(148,163,184,0.99);font-size:13px;line-height:1.55}

/* Success */
.success-box{width:min(820px,92vw);margin:0 auto;padding:18px 18px 20px;border-radius:18px;background:rgba(0,0,0,0.24);border:1px solid rgba(16,185,129,0.34);backdrop-filter:blur(20px);box-shadow:0 46px 150px rgba(0,0,0,0.62)}
.success-icon{width:52px;height:52px;border-radius:18px;display:grid;place-items:center;background:rgba(16,185,129,0.16);border:1px solid rgba(16,185,129,0.44);margin:0 auto 10px}
.success-icon svg{width:26px;height:26px}
.success-title{font-size:20px;font-weight:990;margin-bottom:4px}
.success-sub{color:rgba(148,163,184,0.98);font-size:14px}

/* Footer */
footer{padding:18px 0 34px;text-align:center;color:rgba(148,163,184,0.92);font-size:13px}
footer .footer-links{margin-top:10px;font-size:12px}
footer .footer-links a{color:rgba(148,163,184,0.92);text-decoration:none;transition:color 0.2s ease}
footer .footer-links a:hover{color:var(--c1)}
footer .footer-divider{margin:0 10px;opacity:0.5}

/* A11y */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* Responsive */
@media (max-width:1100px){
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .planet-2{right:-260px;top:-220px}
}
@media (max-width:640px){
  html, body{
    overflow-x:hidden !important;
    max-width:100vw;
  }
  .form-wrapper{flex-direction:column}
  .btn-submit{min-width:unset;width:100%}
  .feature-grid{grid-template-columns:1fr}
  .status-line{width:58px}
  /* Hide planets on mobile to prevent scroll issues */
  .planet-1{display:none}
  .planet-2{display:none}
  .planet-3{display:none}
  .orb-1{left:-280px;top:-280px}
  .orb-2{right:-280px;bottom:-280px}
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important;scroll-behavior:auto !important}
  body::before{display:none}
}



/* ===== CLEAN FIX: Heading + Icons ===== */

/* Keep h1 positioned for the ::after cloud effect */
h1{
  position: relative !important;
  margin: 0 0 14px;
}

/* Restore the cloud glow behind heading */
h1::after{
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: min(860px, 92vw) !important;
  height: 280px !important;
  transform: translate(-50%, -56%) !important;
  background: radial-gradient(circle at 50% 50%,
    rgba(6,182,212,0.28),
    rgba(139,92,246,0.32),
    rgba(244,114,182,0.22),
    transparent 68%) !important;
  filter: blur(60px) !important;
  z-index: -1 !important;
  pointer-events: none !important;
}

/* Reset the line pseudo-elements that were creating issues */
h1 .line-1::before,
h1 .line-1::after,
h1 .line-2::before,
h1 .line-2::after{
  content: none !important;
  display: none !important;
}

h1 .line-1, h1 .line-2{
  display: block;
  font-size: clamp(46px, 6.3vw, 76px);
  font-weight: 950;
  letter-spacing: -0.04em;
  line-height: 1.02;
  position: relative;
}

/* The .t span carries the gradient */
h1 .line-1 .t, h1 .line-2 .t{
  display: inline-block;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

/* "Client Ops" - clean silver gradient */
h1 .line-1 .t{
  background: linear-gradient(180deg,
    #ffffff 0%,
    #c8d4e6 50%,
    #94a3b8 100%
  );
  -webkit-background-clip: text;
  background-clip: text;
  filter: drop-shadow(0 4px 20px rgba(0,0,0,0.4));
}

/* "Evolved" - vibrant animated gradient */
h1 .line-2 .t{
  background: linear-gradient(90deg,
    #00F5FF,
    #8B5CF6,
    #FF5AC8,
    #10FFB0,
    #00F5FF
  );
  background-size: 300% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  animation: headlineGradient 5s ease-in-out infinite;
  filter: drop-shadow(0 0 30px rgba(0,245,255,0.25)) drop-shadow(0 4px 20px rgba(0,0,0,0.4));
}

@keyframes headlineGradient{
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}

/* ICONS: Large, clean, white - NO animation */
.card-icon{
  width: 72px !important;
  height: 72px !important;
  background: none !important;
  -webkit-mask: none !important;
  mask: none !important;
  object-fit: contain;
  filter: brightness(0) invert(1) drop-shadow(0 4px 16px rgba(0,0,0,0.4));
  opacity: 0.92;
  animation: none !important;
}

/* Taller card media to fit larger icons */
.feature-card .card-media{
  height: 130px !important;
}