/* ============================================================
   Nest — core tokens, type, base components (shared everywhere)
   ============================================================ */
:root{
  /* color */
  --cream-100:#FAF7F0; --cream-200:#F2EDE0; --cream-300:#E5DCC5;
  --ink-900:#1F1F1F; --ink-700:#4A4A4A; --ink-500:#7A7A7A;
  --sage-500:#6B9B7A; --sage-700:#4A7559;
  --honey-500:#E8B547; --coral-500:#E8745C; --sky-500:#8DB8D8;
  /* tints for treasury / pastels */
  --tint-spy:#D9C9A6; --tint-qqq:#BFD2C3; --tint-aapl:#E7CE92;
  --tint-nvda:#C9DDE9; --tint-msft:#D8C4B6; --tint-usdc:#E9E1CE; --tint-other:#CFC6B2;
  /* type */
  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  --sans:'Hanken Grotesk',system-ui,-apple-system,sans-serif;
  --mono:'JetBrains Mono','Menlo',monospace;
  --maxw:1140px;
}

*{ box-sizing:border-box; }
html{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
body{
  margin:0; background:var(--cream-100); color:var(--ink-900);
  font-family:var(--sans); font-size:17px; line-height:1.65; font-weight:400;
}
::selection{ background:rgba(107,155,122,.22); }

/* ---- type ---- */
.serif{ font-family:var(--serif); font-weight:500; letter-spacing:-0.01em; line-height:1.08; }
.mono{ font-family:var(--mono); font-feature-settings:"tnum" 1,"lnum" 1; }
.eyebrow{
  font-family:var(--mono); font-size:12.5px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-500); font-feature-settings:"tnum" 1;
}
h1,h2,h3{ font-family:var(--serif); font-weight:500; letter-spacing:-0.015em; line-height:1.08; margin:0; }
.d64{ font-size:64px; letter-spacing:-0.02em; }
.d48{ font-size:48px; letter-spacing:-0.015em; }
.d36{ font-size:36px; }
.d28{ font-size:28px; }
.d24{ font-size:24px; }
.d22{ font-size:22px; }
p{ margin:0; }
.lead{ font-size:17px; color:var(--ink-700); line-height:1.65; }
.muted{ color:var(--ink-500); }
a{ color:inherit; }

/* num: every dollar/percent inline uses mono */
.num{ font-family:var(--mono); font-feature-settings:"tnum" 1,"lnum" 1; letter-spacing:-0.01em; }

/* ---- layout ---- */
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 32px; }
.section{ padding:96px 0; }
.hr{ height:1px; background:var(--cream-300); border:0; margin:0; }

/* ---- buttons ---- */
.btn{
  display:inline-flex; align-items:center; gap:9px; font-family:var(--sans); font-weight:500;
  font-size:17px; line-height:1; border:0; border-radius:9px; cursor:pointer; white-space:nowrap;
  padding:14px 24px; text-decoration:none; transition:background .12s ease, color .12s ease, border-color .12s ease;
}
.btn-primary{ background:var(--sage-500); color:var(--cream-100); }
.btn-primary:hover{ background:var(--sage-700); }
.btn-ghost{ background:transparent; color:var(--ink-700); padding:14px 0; }
.btn-ghost:hover{ color:var(--sage-700); }
.btn-outline{ background:transparent; color:var(--ink-900); border:1px solid var(--cream-300); }
.btn-outline:hover{ border-color:var(--sage-500); color:var(--sage-700); }
.btn-sm{ padding:11px 18px; font-size:15px; border-radius:8px; }
.btn-pill{ border-radius:999px; }
.btn .arrow{ transition:transform .15s ease; }
.btn:hover .arrow{ transform:translateX(2px); }

.tlink{ color:var(--ink-700); text-decoration:none; display:inline-flex; align-items:center; gap:6px; font-weight:500; white-space:nowrap; transition:color .12s ease; }
.tlink:hover{ color:var(--sage-700); }
.tlink.mono{ font-size:13px; }

/* ---- pills ---- */
.pill{
  display:inline-flex; align-items:center; gap:8px; padding:7px 14px; border-radius:999px;
  font-family:var(--mono); font-size:13px; background:var(--cream-200); color:var(--ink-700);
  border:1px solid var(--cream-300);
}
.dot{ width:7px; height:7px; border-radius:999px; background:var(--sage-500); display:inline-block; }

/* ---- cards / panels ---- */
.card{ background:var(--cream-100); border:1px solid var(--cream-300); border-radius:16px; padding:32px; }
.panel{ background:var(--cream-200); border:1px solid var(--cream-300); border-radius:16px; padding:24px; }

/* ---- logo lockup (mark svg + webfont word) ---- */
.lockup{ display:inline-flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink-900); }
.lockup .word{ font-family:var(--serif); font-weight:600; font-size:25px; letter-spacing:0; line-height:1; }
.lockup .mark{ display:block; }
.lockup .mark svg, .lockup .mark img{ display:block; }
.lockup .mark img{ border-radius:50%; }
/* signature: the coin flips on hover */
.lockup .mark{ perspective:300px; }
.lockup .mark svg, .lockup .mark img{ transition:transform .55s cubic-bezier(.4,0,.2,1); transform-style:preserve-3d; }
@media (prefers-reduced-motion:no-preference){
  .lockup:hover .mark svg, .lockup:hover .mark img{ transform:rotateY(360deg); }
}

/* ---- illustrations ---- */
.illo{ color:var(--sage-500); display:block; }
.illo svg{ width:100%; height:auto; display:block; }

/* ---- hero egg wobble ---- */
.nest-wobble{ transform-box:fill-box; transform-origin:50% 92%; }
@media (prefers-reduced-motion:no-preference){
  .nest-wobble{ animation:nestRock 4s ease-in-out infinite; }
}
@keyframes nestRock{ 0%,100%{transform:rotate(-3deg)} 50%{transform:rotate(3deg)} }

/* ---- scroll reveal: content always visible; a gentle one-time fade-up that
   can never fully hide content (opacity floor) so it is robust to throttling ---- */
.reveal{ opacity:1; }
@media (prefers-reduced-motion:no-preference){
  .reveal.armed{ animation:revealUp .55s ease-out both; }
}
@keyframes revealUp{ from{ opacity:.55; transform:translateY(14px); } to{ opacity:1; transform:none; } }

/* odometer digits */
.odo{ font-variant-numeric:tabular-nums; }

/* ---- phone: tighten the shared container gutters ---- */
@media (max-width:600px){
  .wrap{ padding:0 20px; }
}