/* ═══════════════════════════════════════
   BASE — Labrix-Inspired Science System
   ═══════════════════════════════════════ */


:root{
  /* Surfaces */
  --white:#FFFFFF;--bg:#F8FAFB;--gray:#F0F4F6;--gray-2:#E4EAEE;
  /* Hero / dark areas */
  --hero-1:#172030;--hero-2:#1C2840;--hero-3:#213050;
  /* Accent */
  --accent:#00D4AA;--accent-hover:#00BD98;--accent-soft:rgba(0,212,170,.08);--accent-mid:rgba(0,212,170,.15);--accent-glow:rgba(0,212,170,.2);
  /* Text */
  --t1:#111D2E;--t2:#3E4F65;--t3:#6C7F94;--t4:#9AAEBF;
  /* Text on dark */
  --tw:#FFFFFF;--tw-2:#B0BFD0;--tw-3:#637890;
  /* Borders */
  --b1:rgba(17,29,46,.08);--b2:rgba(17,29,46,.04);
  /* Shadows */
  --sh-sm:0 1px 3px rgba(17,29,46,.04),0 1px 2px rgba(17,29,46,.03);
  --sh-md:0 4px 16px rgba(17,29,46,.06),0 1px 3px rgba(17,29,46,.04);
  --sh-lg:0 12px 40px rgba(17,29,46,.08),0 2px 8px rgba(17,29,46,.04);
  --sh-xl:0 20px 60px rgba(17,29,46,.1),0 4px 12px rgba(17,29,46,.05);
  /* Font */
  --font:'Inter Tight',system-ui,-apple-system,sans-serif;
  /* Layout */
  --max:1280px;--gutter:clamp(20px,5vw,52px);
  --sec:clamp(80px,12vw,160px);
  --radius:14px;--radius-sm:10px;--radius-xs:6px;
  --ease:cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--font);color:var(--t1);background:var(--white);-webkit-font-smoothing:antialiased;overflow-x:hidden;line-height:1.7;font-weight:400}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
::selection{background:var(--accent);color:var(--hero-1)}

@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}[class*="rv"]{opacity:1!important;transform:none!important}}

.w{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}

/* ═══ Typography ═══ */
.tag{font-size:.76rem;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:var(--accent);display:inline-flex;align-items:center;gap:8px}
.tag::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--accent);flex-shrink:0}
.sec-h{font-weight:700;font-size:clamp(1.85rem,3.2vw,2.7rem);line-height:1.12;letter-spacing:-.03em;color:var(--t1);margin-top:16px}
.sec-p{font-size:1.02rem;font-weight:400;line-height:1.85;color:var(--t2);margin-top:16px;max-width:520px}
.sub-h{font-weight:600;font-size:clamp(1.02rem,1.4vw,1.15rem);line-height:1.35;color:var(--t1)}
/* On-dark */
.sec-h-w{color:#fff}.sec-p-w{color:var(--tw-2)}.tag-w{color:var(--accent)}
.tag-w::before{background:var(--accent)}

/* ═══ Buttons ═══ */
.btn{font-family:var(--font);font-weight:600;font-size:.88rem;padding:14px 32px;border-radius:var(--radius-xs);border:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;transition:all .35s var(--ease);letter-spacing:.01em}
.btn-accent{background:var(--accent);color:var(--hero-1)}
.btn-accent:hover{background:var(--accent-hover);transform:translateY(-2px);box-shadow:0 8px 28px var(--accent-glow)}
.btn-outline{background:transparent;color:var(--t1);border:1.5px solid var(--b1)}
.btn-outline:hover{border-color:var(--accent);color:var(--accent)}
.btn-outline-w{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.18)}
.btn-outline-w:hover{border-color:var(--accent);color:var(--accent);background:rgba(0,212,170,.05)}
.btn-dark{background:var(--hero-1);color:#fff}
.btn-dark:hover{background:var(--hero-2);transform:translateY(-2px);box-shadow:var(--sh-lg)}
.btn-ghost{background:var(--accent-soft);color:var(--accent);border:none}
.btn-ghost:hover{background:var(--accent-mid)}
.link{display:inline-flex;align-items:center;gap:6px;font-size:.9rem;font-weight:600;color:var(--accent);min-height:44px;transition:gap .3s,opacity .3s}
.link:hover{gap:12px;opacity:.75}

/* ═══ Card ═══ */
.card{background:var(--white);border-radius:var(--radius);border:1px solid var(--b2);box-shadow:var(--sh-sm);transition:all .4s var(--ease)}
.card:hover{box-shadow:var(--sh-lg);transform:translateY(-4px)}

/* ═══ Glass ═══ */
.glass{background:rgba(255,255,255,.05);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius)}

/* ═══ Reveal ═══ */
.rv{opacity:0;transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rv-up{transform:translateY(44px)}.rv-down{transform:translateY(-30px)}
.rv-left{transform:translateX(-44px)}.rv-right{transform:translateX(44px)}
.rv-scale{transform:scale(.93)}.rv-fade{transform:none}
.rv.vis{opacity:1;transform:translate(0) scale(1)!important}
.rv-d1{transition-delay:.1s}.rv-d2{transition-delay:.2s}.rv-d3{transition-delay:.3s}.rv-d4{transition-delay:.4s}.rv-d5{transition-delay:.5s}