/* base.css — design tokens, reset, base typography.
   Part of Gator Pools LLC website. Visual design preserved verbatim. */

:root{
  --deep:#06222B; --mid:#0A3540; --text:#EAF7F5; --muted:#9CC4C6;
  --accent:#3EE6C1; --gator:#43A55C; --sun:#FFD34D;
  --display:'Sora',sans-serif; --body:'Inter Tight',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:var(--body); color:var(--text); background:var(--deep);
  overflow-x:hidden; -webkit-font-smoothing:antialiased;
}

/* WebGL canvas layer (behind all content) */
#gl{position:fixed;inset:0;z-index:0;pointer-events:none}

/* ---------- content shell ---------- */
main{position:relative;z-index:2}
section{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  padding:18vh 6vw;position:relative;
}
.plane{max-width:940px;width:100%}

/* ---------- base typography ---------- */
.kicker{
  font-family:var(--display);color:var(--accent);font-size:12px;font-weight:700;
  letter-spacing:.26em;text-transform:uppercase;margin-bottom:18px;display:flex;align-items:center;gap:12px;
}
.kicker::before{content:'';width:26px;height:2px;background:var(--accent);border-radius:2px}
h2{font-family:var(--display);font-weight:800;font-size:clamp(30px,5.6vw,56px);letter-spacing:-.02em;line-height:1.05;margin-bottom:18px}
.lead{color:var(--muted);font-size:clamp(15px,2.2vw,19px);line-height:1.65;max-width:640px}

@media (max-width:640px){ section{padding:14vh 7vw} }