/* ============================================================
   The Tea Planet — Shared base layer
   Canonical design tokens + reset + base typography/buttons.
   Loaded FIRST on pages that don't inline these (e.g. /launch/*).
   tp-landing.css and page styles are layered AFTER this.
   Token values mirror the homepage (index.html) :root.
   ============================================================ */

:root{
  --ink:#0E2620;
  --leaf-900:#082F23;
  --leaf-700:#0F4C3A;
  --leaf-500:#2A6F50;
  --sage-200:#B6CABE;
  --sage-50:#E8EFEA;
  --gold-700:#A8853F;
  --gold-500:#C8A862;
  --gold-200:#ECDDB6;
  --gold-50:#F8F1DD;
  --paper:#FFFFFF;
  --cream:#FAF8F3;
  --mist:#F1EFE8;
  --line:#E3E1D8;
  --muted:#6E7268;
  --body:#2B312D;
  --r-md:16px;
  --r-lg:24px;
  --r-xl:32px;
  --r-pill:999px;
  --shadow-md:0 4px 16px rgba(14,38,32,.08),0 12px 40px rgba(14,38,32,.06);
}

/* ---- reset ---- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"DM Sans",system-ui,sans-serif;font-size:16px;line-height:1.5;color:var(--body);background:var(--cream);-webkit-font-smoothing:antialiased;padding-top:60px}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}

/* ---- layout helpers ---- */
.wrap{max-width:1280px;margin:0 auto;padding:0 24px}
.eyebrow{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--leaf-700)}

/* ---- buttons ---- */
.btn{display:inline-flex;align-items:center;gap:8px;padding:11px 24px;border-radius:var(--r-pill);font-weight:600;font-size:14px;border:1.5px solid transparent;transition:transform .12s,background .15s;white-space:nowrap;cursor:pointer;font-family:inherit;line-height:1;text-decoration:none}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--leaf-700);color:#fff;border-color:var(--leaf-700)}
.btn-primary:hover{background:var(--leaf-900)}
.btn-gold{background:var(--gold-500);color:var(--leaf-900);border-color:var(--gold-500)}
.btn-gold:hover{background:var(--gold-200)}
.btn-outline{background:transparent;color:var(--leaf-700);border-color:var(--leaf-700)}
.btn-outline:hover{background:var(--leaf-700);color:#fff}
.btn-outline-light{background:transparent;color:rgba(255,255,255,.85);border-color:rgba(255,255,255,.35)}
.btn-outline-light:hover{background:rgba(255,255,255,.1)}
