/* ============================================================
   AL-AFNA Learn — index.css  v3
   Charte : teal #007B7F · deep #003F5C · pale #E8F7F7
   Light par défaut — dark complet via body:not(.light)
   ============================================================ */

/* ── VARIABLES (LIGHT) ───────────────────────────────── */
:root{
  --teal:#007B7F; --teal-hi:#00A8AD; --teal-dim:rgba(0,123,127,.12);
  --deep:#003F5C;
  --ok:#16a34a;  --ok-dim:rgba(22,163,74,.1);
  --err:#dc2626; --err-dim:rgba(220,38,38,.1);

  /* Surfaces */
  --bg:#FFFFFF;
  --bg-2:#F4FBFB;
  --bg-3:#E8F7F7;
  --surface:#FFFFFF;
  --surface-2:#F4FBFB;
  --surface-3:#E8F7F7;

  /* Texte */
  --ink:#1A1A1A;
  --ink-2:#3D5A5A;
  --ink-3:#6B8F8F;

  /* Bordures */
  --bd:rgba(0,123,127,.16);
  --bd-2:rgba(0,123,127,.32);

  /* Navbar */
  --nav-bg:rgba(255,255,255,.82);

  /* Shadows */
  --sh-s:0 4px 20px rgba(0,63,92,.1);
  --sh-m:0 12px 40px rgba(0,63,92,.16);
  --sh-l:0 24px 64px rgba(0,63,92,.22);

  /* Misc */
  --r:12px; --r-l:20px; --r-xl:28px;
  --nav-h:72px;
  --ease:cubic-bezier(.16,1,.3,1);
  --ease-b:cubic-bezier(.34,1.56,.64,1);
}

/* ── VARIABLES (DARK) ────────────────────────────────── */
body:not(.light){
  --bg:#040D0C;
  --bg-2:#061210;
  --bg-3:#0A1E1C;
  --surface:#0D2220;
  --surface-2:#112B28;
  --surface-3:#163530;

  --ink:#EDF5F5;
  --ink-2:#9FC4C4;
  --ink-3:#5F9090;

  --bd:rgba(0,168,173,.2);
  --bd-2:rgba(0,168,173,.42);

  --nav-bg:rgba(4,13,12,.88);

  --sh-s:0 4px 20px rgba(0,0,0,.45);
  --sh-m:0 12px 40px rgba(0,0,0,.55);
  --sh-l:0 24px 64px rgba(0,0,0,.65);

  --teal-dim:rgba(0,168,173,.14);
}

/* ── RESET ───────────────────────────────────────────── */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;font-size:16px;}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important;}
  html{scroll-behavior:auto;}
}
body{
  font-family:'Plus Jakarta Sans',sans-serif;
  background:var(--bg);color:var(--ink);
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
  transition:background .35s,color .35s;
}
a{text-decoration:none;color:inherit;}
ul{list-style:none;}
img{max-width:100%;display:block;}
button{font-family:inherit;cursor:pointer;border:none;}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:4px;}

/* ── LAYOUT ──────────────────────────────────────────── */
.si{max-width:1160px;margin:0 auto;padding:0 1.6rem;}
.section{padding:6rem 0;background:var(--bg);}
.section-alt{padding:6rem 0;background:var(--bg-2);}

/* ── TYPO ────────────────────────────────────────────── */
h1,h2,h3{font-family:'Sora',sans-serif;line-height:1.1;letter-spacing:-.02em;color:var(--ink);}
em{font-style:italic;color:var(--teal);}
.stitle{font-size:clamp(1.7rem,3.5vw,2.4rem);font-weight:800;margin-bottom:.9rem;}
.ssub{color:var(--ink-2);line-height:1.75;font-size:.95rem;}
.stag{
  display:inline-flex;align-items:center;gap:.45rem;
  background:var(--teal-dim);border:1px solid var(--bd);color:var(--teal);
  padding:.32rem .9rem;border-radius:999px;
  font-size:.71rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  margin-bottom:1rem;
}

/* ── BUTTONS ─────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;gap:.55rem;
  padding:.75rem 1.5rem;border-radius:999px;
  font-weight:600;font-size:.88rem;cursor:pointer;
  transition:transform .28s var(--ease-b),box-shadow .28s,background .2s,color .2s,border-color .2s;
  white-space:nowrap;border:none;
}
.btn:hover{transform:translateY(-2px);}
.btn-teal{background:var(--teal);color:#fff;box-shadow:0 6px 24px rgba(0,123,127,.4);}
.btn-teal:hover{background:var(--teal-hi);box-shadow:0 10px 32px rgba(0,123,127,.5);}
.btn-ghost-dark{background:transparent;border:1.5px solid var(--bd-2);color:var(--ink);}
.btn-ghost-dark:hover{border-color:var(--teal);color:var(--teal);background:var(--teal-dim);}
.btn-outline-nav{background:transparent;border:1.5px solid var(--bd);color:var(--ink-2);padding:.6rem 1.2rem;font-size:.82rem;}
.btn-outline-nav:hover{border-color:var(--teal);color:var(--teal);}
.btn-white{background:#fff;color:var(--deep);}
.btn-white:hover{background:var(--bg-3);}
.btn-outline-white{background:transparent;border:1.5px solid rgba(255,255,255,.35);color:#fff;}
.btn-outline-white:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.7);}
.btn-lg{padding:1rem 2rem;font-size:.95rem;}
.btn-full{width:100%;justify-content:center;padding:1rem;}

/* ── NAVBAR ──────────────────────────────────────────── */
#navbar{
  position:fixed;top:0;left:0;right:0;z-index:200;
  height:var(--nav-h);
  background:var(--nav-bg);
  backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  border-bottom:1px solid transparent;
  transition:border-color .3s,box-shadow .3s,background .35s;
}
#navbar.scrolled{border-color:var(--bd);box-shadow:var(--sh-s);}
.nav-wrap{
  max-width:1160px;margin:0 auto;padding:0 1.6rem;
  height:100%;display:flex;align-items:center;justify-content:space-between;
}
.logo-w{display:flex;align-items:center;gap:.7rem;cursor:pointer;}
.logo-ico{
  width:38px;height:38px;border-radius:10px;
  background:linear-gradient(135deg,var(--teal),var(--deep));
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:1rem;flex-shrink:0;
}
.ln1{font-family:'Sora',sans-serif;font-size:1rem;font-weight:800;color:var(--ink);}
.ln1 b{color:var(--teal);}
.ln2{font-size:.58rem;font-weight:600;color:var(--ink-3);letter-spacing:.1em;text-transform:uppercase;}
.nav-links{display:flex;align-items:center;gap:1.2rem;}
.nav-links a{
  font-size:.84rem;font-weight:500;color:var(--ink-2);
  transition:color .2s;padding:.4rem 0;position:relative;
}
.nav-links a::after{
  content:'';position:absolute;bottom:-2px;left:0;right:100%;
  height:2px;background:var(--teal);transition:right .3s var(--ease);
}
.nav-links a:hover{color:var(--teal);}
.nav-links a:hover::after{right:0;}

/* Bouton thème nav */
.theme-btn-idx{
  width:34px;height:34px;border-radius:50%;
  background:var(--surface-2);border:1px solid var(--bd);color:var(--ink-2);
  display:flex;align-items:center;justify-content:center;
  font-size:.85rem;cursor:pointer;
  transition:background .25s,color .25s,border-color .25s;flex-shrink:0;
}
.theme-btn-idx:hover{background:var(--teal);color:#fff;border-color:var(--teal);}

/* Hamburger */
.ham{display:none;flex-direction:column;gap:5px;width:26px;background:transparent;border:none;cursor:pointer;padding:4px;}
.ham span{height:2px;background:var(--ink);border-radius:2px;transition:transform .3s var(--ease),opacity .3s;}
.ham.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.ham.open span:nth-child(2){opacity:0;}
.ham.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* Menu mobile */
.mob-menu{
  position:fixed;inset:0;top:var(--nav-h);
  background:var(--bg);z-index:199;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:1.4rem;transform:translateX(100%);transition:transform .4s var(--ease);
}
.mob-menu.open{transform:translateX(0);}
.mob-menu a{font-size:1.1rem;font-weight:600;color:var(--ink);display:flex;align-items:center;gap:.6rem;}
.mob-menu a:hover{color:var(--teal);}
.mob-menu button{font-size:1.1rem;font-weight:600;}

/* ── HERO ────────────────────────────────────────────── */
.hero-section{
  padding:calc(var(--nav-h) + 1.5rem) 0 5rem;
  background:linear-gradient(180deg,var(--bg-2) 0%,var(--bg) 100%);
  position:relative;overflow:hidden;
}
.hero-section::before{
  content:'';position:absolute;top:-200px;right:-150px;
  width:600px;height:600px;border-radius:50%;
  background:radial-gradient(circle,rgba(0,123,127,.1) 0%,transparent 65%);
  pointer-events:none;
}
.hero-wrap{
  max-width:1160px;margin:0 auto;padding:0 1.6rem;
  display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;
}
.hero-badge{
  display:inline-flex;align-items:center;gap:.55rem;
  background:var(--teal-dim);border:1px solid var(--bd);color:var(--teal);
  padding:.42rem 1.1rem;border-radius:999px;
  font-size:.73rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  margin-bottom:1.8rem;
}
.hero-left h1{font-size:clamp(2.1rem,4.5vw,3.4rem);font-weight:800;margin-bottom:1.2rem;}
.hero-p{color:var(--ink-2);line-height:1.8;font-size:1rem;max-width:520px;margin-bottom:2rem;}
.hero-cta{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:2rem;}
.hero-trust{display:flex;flex-wrap:wrap;gap:1rem;}
.ti{display:flex;align-items:center;gap:.45rem;font-size:.78rem;color:var(--ink-3);font-weight:500;}
.ti i{color:var(--teal);font-size:.82rem;}

/* Hero visuel */
.hero-visual{position:relative;}
.hero-img-wrap{
  border-radius:var(--r-xl);overflow:hidden;aspect-ratio:4/3;
  background:var(--bg-3);border:1px solid var(--bd);position:relative;
  transform:translateY(-30px);
}
.hero-img{width:100%;height:100%;object-fit:cover;}
.hero-img-fallback{
  display:none;flex-direction:column;align-items:center;justify-content:center;
  gap:.6rem;position:absolute;inset:0;color:var(--ink-3);
}

/* Cartes flottantes hero */
.hero-float-card{
  position:absolute;bottom:-1rem;left:-1rem;
  background:var(--surface);border:1px solid var(--bd);
  border-radius:var(--r-l);padding:.8rem 1rem;
  box-shadow:var(--sh-m);min-width:200px;max-width:220px;
  animation:floatCard 5s ease-in-out infinite;
  z-index:2;
}
@keyframes floatCard{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.hfc-top{font-size:.62rem;font-weight:700;color:var(--teal);letter-spacing:.08em;text-transform:uppercase;margin-bottom:.5rem;display:flex;align-items:center;gap:.4rem;}
.hfc-q{font-size:.78rem;font-weight:600;color:var(--ink);margin-bottom:.55rem;line-height:1.4;}
.hfc-opts{display:flex;flex-direction:column;gap:.3rem;}
.hfc-opt{font-size:.72rem;padding:.32rem .6rem;border-radius:8px;font-weight:500;}
.hfc-opt.wrong{background:var(--err-dim);color:var(--err);text-decoration:line-through;}
.hfc-opt.right{background:var(--ok-dim);color:var(--ok);display:flex;align-items:center;justify-content:space-between;}

.hero-float-stat{
  position:absolute;top:-1rem;right:-1rem;
  background:linear-gradient(135deg,var(--teal),var(--deep));
  color:#fff;border-radius:var(--r-l);padding:.8rem 1rem;text-align:center;
  box-shadow:0 8px 28px rgba(0,123,127,.45);
  animation:floatStat 6s ease-in-out infinite;
  z-index:3;
}
@keyframes floatStat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.hfs-num{font-family:'Sora',sans-serif;font-size:1.1rem;font-weight:800;}
.hfs-label{font-size:.6rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;opacity:.8;}

/* ── TICKER ──────────────────────────────────────────── */
.ticker-wrap{
  overflow:hidden;
  background:var(--bg-2);
  border-top:1px solid var(--bd);
  border-bottom:1px solid var(--bd);
  padding:.75rem 0;
}
.ticker-track{display:flex;gap:1.5rem;width:max-content;animation:ticker 55s linear infinite;}
.ticker-wrap:hover .ticker-track{animation-play-state:paused;}
.tick-item{
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:.8rem;font-weight:600;color:var(--ink-2);
  white-space:nowrap;padding:.25rem .9rem;
  background:var(--surface);border:1px solid var(--bd);
  border-radius:999px;cursor:default;
  transition:border-color .2s,color .2s;
}
.tick-item:hover{border-color:var(--teal);color:var(--teal);}
.tick-item i{color:var(--teal);font-size:.75rem;}
@keyframes ticker{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.ticker-track{animation:none;}.ticker-wrap{overflow-x:auto;}}

/* ── STATS ───────────────────────────────────────────── */
.stats-section{
  padding:3.5rem 0;background:var(--bg);
  border-top:1px solid var(--bd);border-bottom:1px solid var(--bd);
}
.stats-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:1px;background:var(--bd);
  border:1px solid var(--bd);border-radius:var(--r-l);overflow:hidden;
}
.stat-box{background:var(--surface);padding:2rem 1.5rem;text-align:center;transition:background .3s;}
.stat-box:hover{background:var(--surface-2);}
.stat-ico{
  width:44px;height:44px;border-radius:12px;
  background:var(--teal-dim);color:var(--teal);
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;margin:0 auto 1rem;
}
.stat-n{font-family:'Sora',sans-serif;font-size:2rem;font-weight:800;color:var(--teal);line-height:1;margin-bottom:.35rem;}
.stat-l{font-size:.77rem;color:var(--ink-3);font-weight:500;}

/* ── WHAT IS IT ──────────────────────────────────────── */
.wi-grid{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:start;}
.wi-items{display:flex;flex-direction:column;gap:1.1rem;margin-top:1.8rem;}
.wi-item{
  display:flex;align-items:flex-start;gap:.95rem;padding:1.2rem;
  background:var(--surface);border:1px solid var(--bd);border-radius:var(--r);
  transition:border-color .3s,transform .3s var(--ease);
}
.wi-item:hover{border-color:var(--teal);transform:translateX(4px);}
.wi-ico{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.wi-item h4{font-size:.92rem;font-weight:700;margin-bottom:.3rem;color:var(--ink);}
.wi-item p{font-size:.8rem;color:var(--ink-2);line-height:1.6;}
.wi-panel{display:flex;flex-direction:column;gap:1rem;}
.panel-card{background:var(--surface);border:1px solid var(--bd);border-radius:var(--r-l);padding:1.5rem;}
.panel-head{font-size:.72rem;font-weight:700;color:var(--teal);text-transform:uppercase;letter-spacing:.08em;margin-bottom:1rem;display:flex;align-items:center;gap:.4rem;}
.tags-wrap{display:flex;flex-wrap:wrap;gap:.5rem;}
.tag{background:var(--bg-3);border:1px solid var(--bd);padding:.28rem .8rem;border-radius:999px;font-size:.72rem;color:var(--ink-2);font-weight:500;}
.concours-list{display:flex;flex-direction:column;gap:.55rem;}
.concours-item{display:flex;align-items:center;gap:.7rem;font-size:.83rem;color:var(--ink-2);}
.concours-item i{color:var(--teal);font-size:.65rem;}

/* ── CATEGORIES ──────────────────────────────────────── */
.cath{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem;margin-bottom:2.5rem;flex-wrap:wrap;}
.cat-grid-land{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;}
.cat-card-land{
  background:var(--surface);border:1px solid var(--bd);border-radius:var(--r-l);
  padding:1.6rem;cursor:pointer;position:relative;overflow:hidden;
  transition:transform .35s var(--ease),box-shadow .35s,border-color .3s;
}
.cat-card-land:hover{transform:translateY(-7px);box-shadow:var(--sh-m);border-color:var(--teal);}
.cat-card-land.cat-pro{opacity:.85;}
.cat-card-land.cat-pro:hover{opacity:1;}
.cstrip{position:absolute;top:0;left:0;right:0;height:3px;}
.cat-ico{width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:1rem;margin-bottom:1rem;}
.cat-card-land h3{font-size:.98rem;font-weight:700;margin-bottom:.45rem;color:var(--ink);}
.cat-card-land p{font-size:.8rem;color:var(--ink-2);line-height:1.6;margin-bottom:1rem;}
.cat-foot{display:flex;align-items:center;justify-content:space-between;font-size:.73rem;color:var(--ink-3);padding-top:.75rem;border-top:1px solid var(--bd);}
.cbadge{display:inline-flex;align-items:center;gap:.3rem;padding:.22rem .7rem;border-radius:999px;font-size:.64rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;}
.cfree{background:var(--ok-dim);color:var(--ok);border:1px solid rgba(22,163,74,.2);}
.cpro{background:var(--teal-dim);color:var(--teal);border:1px solid var(--bd);}

/* ── HOW IT WORKS ────────────────────────────────────── */
.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;}
.step{position:relative;padding-top:1rem;}
.step-num{font-family:'Sora',sans-serif;font-size:4rem;font-weight:800;color:rgba(0,123,127,.08);line-height:1;margin-bottom:.6rem;}
.step-ico{
  width:48px;height:48px;border-radius:13px;
  background:var(--teal-dim);border:1px solid var(--bd);
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;color:var(--teal);margin-bottom:1rem;
}
.step h3{font-size:1rem;font-weight:700;margin-bottom:.5rem;color:var(--ink);}
.step p{font-size:.83rem;color:var(--ink-2);line-height:1.7;}

/* ── METHOD DEMO ─────────────────────────────────────── */
.method-grid{
  display:grid;grid-template-columns:1fr;
  max-width:720px;margin:0 auto;gap:2rem;
}
.tips{display:flex;flex-direction:column;gap:.85rem;}
.tip{display:flex;align-items:flex-start;gap:.8rem;font-size:.85rem;color:var(--ink-2);line-height:1.6;}
.tip i{color:var(--teal);font-size:.9rem;margin-top:.15rem;flex-shrink:0;}
.demo-card{
  background:var(--surface);border:1px solid var(--bd);
  border-radius:var(--r-l);padding:1.5rem;box-shadow:var(--sh-s);
}
.demo-head{font-size:.7rem;font-weight:700;color:var(--teal);letter-spacing:.1em;text-transform:uppercase;margin-bottom:1rem;display:flex;align-items:center;gap:.45rem;}
.demo-q{font-size:.92rem;color:var(--ink);font-weight:600;margin-bottom:1rem;}
.demo-opts{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem;}
.demo-opt{
  display:flex;align-items:center;gap:.7rem;
  padding:.65rem .9rem;border-radius:9px;font-size:.82rem;font-weight:500;
  background:var(--surface-2);
}
.demo-opt span{
  width:24px;height:24px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:.7rem;font-weight:700;flex-shrink:0;
  background:var(--bg-3);color:var(--ink-2);
}
.demo-opt.ng{color:var(--ink-2);}
.demo-opt.ng span{background:var(--err-dim);color:var(--err);}
.demo-opt.ok{background:var(--ok-dim);color:var(--ok);font-weight:600;}
.demo-opt.ok span{background:rgba(22,163,74,.25);color:var(--ok);}
.demo-expl{
  background:var(--surface-2);border:1px solid var(--bd);
  border-radius:9px;padding:.75rem 1rem;
  font-size:.8rem;color:var(--ink-2);line-height:1.6;
}
.demo-expl i{color:var(--teal);margin-right:.4rem;}

/* ── TESTIMONIALS ────────────────────────────────────── */
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem;}
.tcard{
  background:var(--surface);border:1px solid var(--bd);
  border-radius:var(--r-l);padding:1.8rem;
  transition:transform .35s var(--ease),box-shadow .35s;
}
.tcard:hover{transform:translateY(-6px);box-shadow:var(--sh-m);}
.tstars{color:var(--teal);font-size:.82rem;margin-bottom:1rem;display:flex;gap:.2rem;}
.tcard blockquote{font-size:.87rem;color:var(--ink-2);line-height:1.75;margin-bottom:1.2rem;font-style:italic;}
.tauth{display:flex;align-items:center;gap:.8rem;}
.tav{
  width:38px;height:38px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:'Sora',sans-serif;font-weight:700;font-size:.88rem;flex-shrink:0;
}
.tname{font-size:.86rem;font-weight:700;color:var(--ink);}
.trole{font-size:.74rem;color:var(--ink-3);}
.tcard-placeholder{cursor:pointer;border-style:dashed;display:flex;align-items:center;justify-content:center;}
.tcp-inner{text-align:center;color:var(--ink-3);}
.tcp-inner i{font-size:2rem;color:var(--teal);opacity:.35;margin-bottom:.8rem;display:block;}
.tcp-inner p{font-size:.84rem;}

/* ── CTA ─────────────────────────────────────────────── */
.cta-section{padding:5rem 0;background:var(--bg);}
.cta-box{
  background:linear-gradient(130deg,var(--deep) 0%,var(--teal) 100%);
  border-radius:var(--r-xl);padding:3.5rem;
  display:grid;grid-template-columns:1fr auto;gap:3rem;align-items:center;
  position:relative;overflow:hidden;
}
.cta-box::after{
  content:'';position:absolute;right:-80px;top:-80px;
  width:320px;height:320px;border-radius:50%;
  background:rgba(255,255,255,.05);
}
.cta-btns{display:flex;gap:1rem;flex-wrap:wrap;margin-top:2rem;}
.cta-img{width:260px;height:200px;object-fit:cover;border-radius:var(--r-l);border:3px solid rgba(255,255,255,.2);}

/* ── FOOTER ──────────────────────────────────────────── */
footer{background:#06100F;color:rgba(255,255,255,.7);padding:2.5rem 0;}
.footer-wrap{
  max-width:1160px;margin:0 auto;padding:0 1.6rem;
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1.5rem;
}
.footer-brand{display:flex;align-items:center;gap:.9rem;}
.fn{font-family:'Sora',sans-serif;font-weight:800;color:#fff;font-size:1rem;}
.fn b{color:var(--teal-hi);}
.fc{font-size:.72rem;color:rgba(255,255,255,.5);margin-top:.2rem;}
.footer-links{display:flex;gap:1.5rem;flex-wrap:wrap;}
.footer-links a{font-size:.82rem;color:rgba(255,255,255,.6);transition:color .2s;}
.footer-links a:hover{color:#fff;}
.footer-note{font-size:.72rem;font-style:italic;color:rgba(255,255,255,.35);}

/* ── MODAL AUTH ──────────────────────────────────────── */
.overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.65);
  backdrop-filter:blur(6px);z-index:500;
  display:flex;align-items:center;justify-content:center;
  padding:1.5rem;opacity:0;pointer-events:none;transition:opacity .3s;
}
.overlay.open{opacity:1;pointer-events:all;}
.modal{
  background:var(--surface);border:1px solid var(--bd);
  border-radius:var(--r-xl);padding:2.5rem;
  width:100%;max-width:420px;position:relative;
  transform:translateY(24px) scale(.97);
  transition:transform .4s var(--ease);
  box-shadow:var(--sh-l);
}
.overlay.open .modal{transform:translateY(0) scale(1);}
.mcls{
  position:absolute;top:1rem;right:1rem;
  width:32px;height:32px;border-radius:50%;
  background:var(--surface-2);color:var(--ink-2);
  border:1px solid var(--bd);
  display:flex;align-items:center;justify-content:center;
  font-size:.85rem;cursor:pointer;transition:background .2s,color .2s;
}
.mcls:hover{background:var(--teal);color:#fff;}
.modal-logo{
  display:flex;align-items:center;gap:.6rem;
  margin-bottom:1.5rem;font-family:'Sora',sans-serif;font-weight:700;font-size:.95rem;
  color:var(--ink);
}
.modal-logo b{color:var(--teal);}
.modal h2{font-size:1.4rem;margin-bottom:.3rem;color:var(--ink);}
.msub{font-size:.84rem;color:var(--ink-3);margin-bottom:1.5rem;}
.fg{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1rem;}
.fg label{
  font-size:.74rem;font-weight:700;color:var(--ink-3);
  letter-spacing:.03em;display:flex;align-items:center;gap:.4rem;
}
.fg input{
  background:var(--surface-2);border:1.5px solid var(--bd);
  border-radius:var(--r);padding:.85rem 1rem;
  color:var(--ink);font-size:.9rem;font-family:inherit;
  transition:border-color .2s,box-shadow .2s;
}
.fg input::placeholder{color:var(--ink-3);}
.fg input:focus{border-color:var(--teal);outline:none;box-shadow:0 0 0 3px var(--teal-dim);}
.malert{display:none;font-size:.82rem;padding:.7rem 1rem;border-radius:var(--r);margin-bottom:1rem;}
.malert.show{display:flex;align-items:center;gap:.5rem;}
.malert.err{background:var(--err-dim);color:var(--err);border:1px solid rgba(220,38,38,.2);}
.malert.ok{background:var(--ok-dim);color:var(--ok);border:1px solid rgba(22,163,74,.2);}
.afooter{text-align:center;font-size:.8rem;color:var(--ink-3);margin-top:1rem;}
.afooter a{color:var(--teal);font-weight:600;cursor:pointer;}
.spn{
  width:16px;height:16px;border-radius:50%;
  border:2px solid rgba(255,255,255,.3);border-top-color:#fff;
  display:inline-block;animation:spin .7s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── REVEAL ──────────────────────────────────────────── */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .65s var(--ease),transform .65s var(--ease);}
.reveal.visible{opacity:1;transform:translateY(0);}

/* ══════════════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════════════ */
@media(max-width:1024px){
  .hero-wrap{grid-template-columns:1fr;gap:3rem;}
  .hero-right{order:-1;}
  .hero-visual{max-width:500px;margin:0 auto;}
  .wi-grid{grid-template-columns:1fr;}
  .cta-box{grid-template-columns:1fr;}
  .cta-img{display:none;}
}
@media(max-width:900px){
  .hero-img-wrap{transform:translateY(0);}
  .hero-visual{padding-bottom:3.5rem;}
  .hero-float-card{left:.8rem;bottom:.8rem;min-width:180px;max-width:calc(100% - 1.6rem);padding:.7rem .9rem;}
  .hero-float-stat{top:.8rem;right:.8rem;padding:.7rem .9rem;}
}
@media(max-width:820px){
  .cat-grid-land{grid-template-columns:repeat(2,1fr);}
  .steps-grid{grid-template-columns:1fr 1fr;}
  .tgrid{grid-template-columns:1fr;}
  .stats-grid{grid-template-columns:repeat(2,1fr);}
  .footer-wrap{flex-direction:column;text-align:center;}
  .footer-links{justify-content:center;}
}
@media(max-width:680px){
  .nav-links{display:none;}
  .ham{display:flex;}
  .section,.section-alt{padding:4rem 0;}
  .hero-section{padding:calc(var(--nav-h) + 2.5rem) 0 4rem;}
  .hero-cta{flex-direction:column;}
  .hero-cta .btn{width:100%;justify-content:center;}
  .hero-visual{padding-bottom:2.8rem;}
  .hero-img-wrap{transform:translateY(0);}
  .hero-float-card{left:.5rem;bottom:.5rem;min-width:150px;max-width:calc(100% - 1rem);padding:.6rem .75rem;}
  .hero-float-stat{top:.5rem;right:.5rem;padding:.6rem .75rem;}
  .cat-grid-land{grid-template-columns:1fr;}
  .steps-grid{grid-template-columns:1fr;}
  .cta-box{padding:2rem;}
  .cta-btns{flex-direction:column;}
  .cta-btns .btn{width:100%;justify-content:center;}
  .stats-grid{grid-template-columns:1fr 1fr;}
  .tgrid{grid-template-columns:1fr;}
  .method-grid{gap:1.5rem;}
}
