@import './fonts.css';
@import './tokens.css';
@import './components.css';

*{ box-sizing:border-box; margin:0; padding:0; }
html{ height:100%; }
body{
  min-height:100vh;
  font-family:var(--font-sans);
  color:var(--fg-1);
  -webkit-font-smoothing:antialiased;
}

/* Kitchen Sink layout helpers (ported from the prototype's inline <style>) */
.wrap{ max-width:1100px; margin:0 auto; padding:64px 40px 120px; position:relative; z-index:1; }

.word{ font-family:var(--font-display); font-size:30px; letter-spacing:.01em; text-transform:uppercase; }
.word b{ color:var(--lime); font-weight:400; }
.sub{ color:var(--fg-2); font-size:15px; margin-top:8px; max-width:560px; line-height:1.5; }
.topbar{ display:flex; align-items:flex-start; justify-content:space-between; gap:24px; }

section{ margin-top:52px; }
.sec-label{ font-size:11px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; color:var(--fg-3); margin-bottom:20px; display:flex; align-items:center; gap:12px; }
.sec-label::after{ content:""; flex:1; height:1px; background:var(--hair); }

.grid{ display:grid; gap:18px; }
.cluster{ display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
.stack{ display:flex; flex-direction:column; gap:14px; }
.cap{ font-size:11px; font-weight:600; color:var(--fg-3); text-transform:uppercase; letter-spacing:.14em; margin-bottom:10px; }
.lab{ font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.18em; color:var(--fg-3); margin-bottom:5px; }
.two{ display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.three{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:start; }
.panel{ padding:20px; }