:root{
  --color-primary:#34d399;
  --color-primary-glow:rgba(52,211,153,0.4);
  --color-secondary:#10b981;
  --color-accent:#a3e635;
  --color-accent-glow:rgba(163,230,53,0.3);
  --bg-start:#052e16;
  --bg-mid:#14532d;
  --bg-end:#022c22;
  --card-bg:rgba(20,83,45,0.6);
  --card-border:rgba(52,211,153,0.2);
  --radius-lg:24px;
  --radius-md:18px;
  --radius-sm:16px;
  --shadow-soft:0 10px 30px rgba(0,0,0,0.35);
  --speed:0.2s;
  --ease:ease-in-out;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:'Source Sans Pro',system-ui,sans-serif;
  font-weight:400;
  color:#e8fdf5;
  background:linear-gradient(120deg,var(--bg-start),var(--bg-mid),var(--bg-end)) fixed;
  background-size:200% 200%;
  animation:shiftBg 18s ease-in-out infinite alternate;
}
@keyframes shiftBg{to{background-position:100% 50%}}

h1,h2,h3,h4{font-family:'Playfair Display',Georgia,serif;font-weight:600;letter-spacing:.2px;margin:0 0 14px}
.display{font-size:clamp(32px,6vw,56px)}
.lead{color:#d1fae5;max-width:62ch}

.container{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}
.grid{display:grid;gap:24px}
.two-col{grid-template-columns:1fr;}
@media(min-width:768px){.two-col{grid-template-columns:1fr 1fr}}

.btn{display:inline-flex;align-items:center;justify-content:center;border:none;cursor:pointer;border-radius:999px;padding:12px 18px;gap:10px;color:#052e16;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));transition:transform var(--speed) var(--ease),box-shadow var(--speed) var(--ease),opacity var(--speed) var(--ease)}
.btn:hover{transform:scale(1.01);box-shadow:0 0 0 0 var(--color-primary-glow),0 10px 24px rgba(0,0,0,0.3)}
.btn.ghost{background:transparent;color:var(--color-primary);border:1px solid var(--card-border)}
.btn.small{padding:8px 14px}
.btn.xl{padding:14px 22px;font-weight:600}

.badge{display:inline-flex;align-items:center;justify-content:center;background:rgba(163,230,53,0.15);color:var(--color-accent);border:1px solid var(--color-accent-glow);border-radius:999px;padding:6px 10px;font-weight:600;letter-spacing:.4px}
.badge-lg{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:999px;background:rgba(163,230,53,0.15);border:1px solid var(--color-accent);color:var(--color-accent);font-weight:700}
.badge-xl{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:999px;background:rgba(163,230,53,0.15);border:1px solid var(--color-accent);color:var(--color-accent);font-size:22px;font-weight:800}
.pill{display:inline-flex;align-items:center;gap:8px;background:rgba(52,211,153,0.15);border:1px solid var(--card-border);color:var(--color-primary);padding:6px 12px;border-radius:999px;font-weight:600}

.muted{color:#a7f3d0}

.site-header{position:sticky;top:0;z-index:50;backdrop-filter:saturate(160%) blur(10px);background:linear-gradient(180deg,rgba(3, 30, 18, 0.75),rgba(3, 30, 18, 0.3));border-bottom:1px solid var(--card-border)}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0}
.brand{display:flex;align-items:center;gap:12px;color:#e8fdf5;text-decoration:none}
.logo-mark{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));color:#052e16;font-weight:800}
.brand-text{font-weight:600}

.nav ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:14px}
.nav a{color:#c7f9e9;text-decoration:none;padding:8px 12px;border-radius:12px;transition:background var(--speed) var(--ease),transform var(--speed) var(--ease)}
.nav a:hover{background:rgba(52,211,153,0.1);transform:scale(1.01)}
.nav a.active{color:var(--color-accent)}

.hamburger{display:inline-flex;flex-direction:column;gap:4px;background:transparent;border:0}
.hamburger span{width:22px;height:2px;background:#bbf7d0;border-radius:3px;transition:transform var(--speed) var(--ease),opacity var(--speed) var(--ease)}
#nav-list{position:fixed;inset:56px 0 auto 0;background:linear-gradient(180deg,rgba(5,46,22,0.96),rgba(2,44,34,0.96));backdrop-filter:blur(8px);padding:16px 20px;border-bottom:1px solid var(--card-border);transform:translateY(-120%);transition:transform var(--speed) var(--ease)}
#nav-list.open{transform:translateY(0)}
#nav-list li{padding:6px 0}
@media(min-width:1024px){
  .hamburger{display:none}
  #nav-list{position:static;transform:none;background:transparent;backdrop-filter:none;display:flex;padding:0;border:0}
  #nav-list li{padding:0}
}

.header-aside{display:flex;align-items:center;gap:10px}

.hero{position:relative;min-height:92vh;display:flex;align-items:center;padding:40px 0 20px;background:radial-gradient(60% 80% at 0% 0%,rgba(163,230,53,0.07),transparent 70%),radial-gradient(80% 60% at 100% 100%,rgba(52,211,153,0.07),transparent 60%)}
.hero::before{content:"";position:absolute;inset:0;background-image:var(--hero-img);background-size:cover;background-position:center;opacity:0.13;filter:grayscale(30%) contrast(110%)}
.hero .suits{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle at 10% 20%,rgba(163,230,53,0.06) 2px,transparent 2px),radial-gradient(circle at 80% 70%,rgba(52,211,153,0.06) 2px,transparent 2px)}

.split-grid{display:grid;grid-template-columns:1fr;gap:28px}
@media(min-width:1024px){.split-grid{grid-template-columns:1.05fr .95fr;align-items:center}}
.hero-copy .trust-inline{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px;color:#a7f3d0}
.hero-copy .dot{display:inline-block;width:8px;height:8px;border-radius:999px}
.hero-ctas{display:flex;gap:12px;margin-top:18px}

.glass{background:var(--card-bg);border:1px solid var(--card-border);backdrop-filter:blur(12px);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft)}

.phone-mock{width:min(360px,90vw);margin:0 auto;position:relative}
.phone-top{height:20px}
.notch{width:120px;height:16px;background:rgba(0,0,0,0.35);border-radius:0 0 12px 12px;margin:0 auto}
.phone-screen{padding:16px}
.screen-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.roster{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.roster li{display:grid;grid-template-columns:48px 1fr auto;gap:8px;align-items:center;padding:10px;border-radius:16px;background:rgba(3, 30, 18, 0.35);border:1px solid rgba(52,211,153,0.12)}
.pos{font-family:'Fira Code',monospace;color:var(--color-accent)}
.name{color:#ecfdf5}
.pts{color:var(--color-primary)}
.screen-foot{margin-top:12px}
.meter{height:8px;background:rgba(3, 30, 18, 0.5);border:1px solid rgba(52,211,153,0.12);border-radius:999px;overflow:hidden}
.meter>span{display:block;height:100%;background:linear-gradient(90deg,var(--color-primary),var(--color-accent))}
.scoreline{margin-top:8px;display:flex;justify-content:space-between;color:#d1fae5}
.float-card{position:absolute;right:6%;bottom:8%;display:flex;gap:12px;align-items:center;padding:14px;max-width:320px}
.float-icon{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:14px;background:rgba(163,230,53,0.1);border:1px solid var(--color-accent-glow)}

.section-head{text-align:center;margin-bottom:24px}

section{padding:90px 0}
.download .form-row{display:flex;gap:10px;padding:12px}
.download input[type=email]{flex:1;min-width:0;background:rgba(3, 30, 18, 0.5);color:#e8fdf5;border:1px solid var(--card-border);border-radius:16px;padding:12px 14px;outline:none;transition:border var(--speed) var(--ease)}
.download input[type=email]:focus{border-color:var(--color-primary)}
.success-msg .success-card{padding:18px;text-align:center}

.features .features-grid{grid-template-columns:1fr;}
.feature-card{padding:18px;display:flex;flex-direction:column;gap:10px;transition:transform var(--speed) var(--ease)}
.feature-card:hover{transform:scale(1.01)}
.feature-card .icon{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:rgba(52,211,153,0.12);border:1px solid var(--card-border)}
@media(min-width:768px){.features .features-grid{grid-template-columns:repeat(3,1fr)}}

.about-grid{grid-template-columns:1fr;}
.about-card{padding:22px}
.about-card .badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.checks{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.checks li{position:relative;padding-left:26px}
.checks li::before{content:"";position:absolute;left:0;top:7px;width:14px;height:14px;border-radius:50%;background:rgba(163,230,53,0.2);border:1px solid var(--color-accent);box-shadow:inset 0 0 0 2px rgba(163,230,53,0.2)}

.accordion details{border:1px solid var(--card-border);border-radius:16px;background:rgba(3, 30, 18, 0.4);padding:12px}
.accordion details+details{margin-top:10px}
.accordion summary{cursor:pointer;list-style:none}
.accordion summary::-webkit-details-marker{display:none}
.accordion .content{color:#d1fae5;margin-top:8px}

.page-hero{position:relative;padding:80px 0}
.page-hero::before{content:"";position:absolute;inset:0;background-image:var(--hero-img);background-size:cover;background-position:center;opacity:.15}

.glass-section .section-block{padding:22px}
.table-wrap{overflow:auto}
.table{width:100%;border-collapse:separate;border-spacing:0}
.table th,.table td{padding:12px 12px;border-bottom:1px solid rgba(52,211,153,0.12)}
.table thead th{color:var(--color-accent)}
.code{background:rgba(3,30,18,0.55);border:1px solid var(--card-border);padding:14px;border-radius:16px;font-family:'Fira Code',monospace;color:#e7fee9;white-space:pre-wrap}

.steps-grid{grid-template-columns:1fr;}
.step-card{padding:20px}
.step-icon{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:16px;background:rgba(52,211,153,0.12);border:1px solid var(--card-border);margin-bottom:8px}
@media(min-width:768px){.steps-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.steps-grid{grid-template-columns:repeat(4,1fr)}}

.disclaimer18 .disclaimer-wrap{display:flex;align-items:center;gap:16px}
.disclaimer18 .glass{padding:18px}

.site-footer{border-top:1px solid var(--card-border);background:rgba(3, 30, 18, 0.5)}
.foot-top{display:grid;gap:20px;grid-template-columns:1fr;align-items:center;padding:22px 0}
.foot-links{display:flex;flex-wrap:wrap;gap:12px}
.foot-links a{color:#c7f9e9;text-decoration:none;padding:6px 10px;border-radius:12px;transition:background var(--speed) var(--ease)}
.foot-links a:hover{background:rgba(52,211,153,0.08)}
.foot-badge{text-align:left}
.foot-bottom{border-top:1px solid var(--card-border);padding:14px 0;color:#b7f7df}
@media(min-width:768px){.foot-top{grid-template-columns:auto 1fr auto}}

.age-modal{position:fixed;z-index: 111;inset:0;display:grid;place-items:center;background:rgba(0,0,0,0.5);backdrop-filter:blur(4px)}
.age-card{width:min(520px,92vw);padding:22px;border-radius:24px;background:var(--card-bg);border:1px solid var(--card-border);box-shadow:var(--shadow-soft);text-align:center}
.age-actions{display:flex;gap:10px;justify-content:center;margin:12px 0}
[hidden]{
  display:none;
}
/* Particles */
#particles{position:fixed;inset:0;z-index:-1}

/* Utilities */
.section{padding:90px 0}
.glass a{color:var(--color-accent)}

/* Accessibility focus */
:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}