/* Bord public site — layered on top of tokens.css + tokens-extended.css */

@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,300;0,6..72,400;0,6..72,500;0,6..72,600;0,6..72,700;1,6..72,300;1,6..72,400;1,6..72,500&family=Manrope:wght@300;400;500;600;700;800&family=Inter:wght@400;500;600;700&display=swap');

:root {
  --font-display: 'Newsreader', 'Times New Roman', Georgia, serif;
  --site-max: 1240px;
  --col-gutter: 32px;
  --site-bg: #0e1013;
  --site-bg-tint: #141719;
  --site-ink: #EFEFEA;
  --site-ink-mute: #8a8f9b;
  --site-ink-dim: #5a5f6b;
  --site-hair: #23262d;
  --site-hair-strong: #31343d;
  --site-gold: #e9c349;
  --site-gold-ink: #b99028;
}

.theme-light-page {
  --site-bg: #F6F2EA;
  --site-bg-tint: #ECE6D8;
  --site-ink: #1A1814;
  --site-ink-mute: #5b554c;
  --site-ink-dim: #8e887d;
  --site-hair: #D9D1BF;
  --site-hair-strong: #B9B1A0;
  --site-gold: #8a6708;
  --site-gold-ink: #7a5a00;
}

body { background: var(--site-bg); color: var(--site-ink); font-family: var(--font-ui); font-feature-settings:"ss01","cv11"; letter-spacing:-0.005em; }
.site { background: var(--site-bg); color: var(--site-ink); }
.site a { color: inherit; text-decoration: none; }

/* Wrap */
.wrap { width:100%; max-width:var(--site-max); margin:0 auto; padding:0 var(--col-gutter); }
.wrap-wide   { max-width:1360px; }
.wrap-narrow { max-width:900px; }
.wrap-prose  { max-width:680px; }

.rule          { display:block; height:1px; background:var(--site-hair); border:0; margin:0; }
.rule-gold     { background:var(--site-gold); opacity:0.5; height:1px; }
.rule-dotted   { height:1px; background-image:radial-gradient(circle, var(--site-hair-strong) 1px, transparent 1px); background-size:6px 1px; background-position:center; background-repeat:repeat-x; }

.eyebrow { font-family:var(--font-ui); font-size:10.5px; font-weight:600; letter-spacing:0.22em; text-transform:uppercase; color:var(--site-gold); display:inline-flex; align-items:center; gap:10px; }
.eyebrow::before, .eyebrow::after { content:''; display:inline-block; width:18px; height:1px; background:currentColor; opacity:0.55; }
.eyebrow.eyebrow-plain::before, .eyebrow.eyebrow-plain::after { display:none; }
.eyebrow.eyebrow-mute { color:var(--site-ink-dim); }

h1.display, h2.display, h3.display, .display {
  font-family: var(--font-display); font-weight:400; letter-spacing:-0.02em; line-height:1.02;
  color: var(--site-ink); margin:0; font-feature-settings: "ss02","liga","dlig";
}
.display-xl { font-size: clamp(52px, 7.2vw, 104px); line-height:0.96; }
.display-lg { font-size: clamp(40px, 4.6vw, 64px);  line-height:1.02; }
.display-md { font-size: clamp(28px, 2.8vw, 40px);  line-height:1.1;  }
.display-sm { font-size: clamp(20px, 1.6vw, 24px);  line-height:1.25; }
.display-italic { font-style:italic; font-weight:400; }

.lede { font-family:var(--font-display); font-weight:300; font-style:italic; font-size:clamp(19px, 1.6vw, 23px); line-height:1.45; color:var(--site-ink-mute); letter-spacing:-0.005em; }
.copy { font-size:15px; line-height:1.65; color:var(--site-ink-mute); max-width:62ch; }
.copy p { margin:0 0 14px 0; }
.copy p:last-child { margin:0; }

.ink       { color:var(--site-ink); }
.ink-mute  { color:var(--site-ink-mute); }
.ink-dim   { color:var(--site-ink-dim); }
.ink-gold  { color:var(--site-gold); }

.btn { display:inline-flex; align-items:center; gap:8px; padding:12px 18px; font-size:13.5px; font-weight:600; border-radius:999px; border:1px solid transparent; line-height:1; cursor:pointer; font-family:var(--font-ui); transition:background 160ms, border-color 160ms, color 160ms; white-space:nowrap; }
.btn-primary { background:var(--site-gold); color:#1a1606; border-color:var(--site-gold); }
.btn-primary:hover { background:#f1cf6b; border-color:#f1cf6b; }
.btn-ghost { color:var(--site-ink); border-color:var(--site-hair-strong); background:transparent; }
.btn-ghost:hover { border-color:var(--site-ink); }
.btn-link { padding:0; background:transparent; border:0; color:var(--site-gold); font-weight:600; font-size:13.5px; }
.btn-link::after { content:' →'; transition:margin-left 180ms; }
.btn-link:hover::after { margin-left:4px; }

.nav { position:sticky; top:0; z-index:40; backdrop-filter: saturate(140%) blur(12px); background: color-mix(in oklab, var(--site-bg) 82%, transparent); border-bottom:1px solid var(--site-hair); }
.nav-inner { display:flex; align-items:center; justify-content:space-between; height:64px; gap:24px; }
.nav-brand { display:flex; align-items:center; gap:10px; font-family:var(--font-display); font-size:22px; font-weight:500; letter-spacing:-0.01em; color:var(--site-ink); }
.nav-brand .dot { width:8px; height:8px; border-radius:2px; background:var(--site-gold); transform:rotate(45deg); }
.nav-links { display:flex; gap:28px; align-items:center; }
.nav-link { font-size:13.5px; font-weight:500; color:var(--site-ink-mute); transition:color 140ms; cursor:pointer; }
.nav-link:hover, .nav-link.active { color:var(--site-ink); }

.footer { border-top:1px solid var(--site-hair); padding:64px 0 40px; margin-top:96px; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr 1fr; gap:40px; }
.footer-col-title { font-size:11px; letter-spacing:0.2em; text-transform:uppercase; color:var(--site-ink-dim); font-weight:700; margin-bottom:16px; }
.footer-col a { display:block; font-size:13.5px; color:var(--site-ink-mute); padding:5px 0; transition:color 120ms; }
.footer-col a:hover { color:var(--site-ink); }
.footer-bottom { margin-top:56px; padding-top:24px; border-top:1px solid var(--site-hair); display:flex; justify-content:space-between; align-items:center; font-size:12px; color:var(--site-ink-dim); flex-wrap:wrap; gap:12px; }

.section    { padding:96px 0; }
.section-sm { padding:56px 0; }
.section-lg { padding:140px 0; }
.section-head { display:grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap:80px; align-items:start; margin-bottom:64px; }

.panel       { border:1px solid var(--site-hair); border-radius:4px; background:var(--site-bg-tint); }
.panel-flush { border:1px solid var(--site-hair); border-radius:0; background:transparent; }

.grid-12 { display:grid; gap:24px; grid-template-columns: repeat(12, 1fr); }

.vrail { writing-mode:vertical-rl; transform:rotate(180deg); font-size:10px; letter-spacing:0.3em; text-transform:uppercase; color:var(--site-ink-dim); font-weight:600; }

.numlist { list-style:none; padding:0; margin:0; counter-reset:n; }
.numlist > li { counter-increment:n; display:grid; grid-template-columns:48px 1fr; gap:24px; padding:24px 0; border-top:1px solid var(--site-hair); }
.numlist > li:last-child { border-bottom:1px solid var(--site-hair); }
.numlist > li::before { content:counter(n, decimal-leading-zero); font-family:var(--font-display); font-size:22px; color:var(--site-gold); line-height:1; }

.tag { display:inline-flex; align-items:center; gap:6px; padding:5px 10px; border-radius:999px; border:1px solid var(--site-hair-strong); font-size:11px; font-weight:600; letter-spacing:0.05em; color:var(--site-ink-mute); text-transform:uppercase; }
.tag-gold { border-color:var(--site-gold); color:var(--site-gold); }

.stat-big { font-family:var(--font-display); font-size:clamp(56px, 6vw, 84px); line-height:1; letter-spacing:-0.03em; color:var(--site-ink); font-weight:400; }
.stat-big em { font-style:italic; font-weight:400; color:var(--site-gold); }

@keyframes ticker { from {transform:translateX(0);} to {transform:translateX(-50%);} }
.ticker { display:flex; gap:64px; animation:ticker 48s linear infinite; white-space:nowrap; font-family:var(--font-display); font-size:22px; font-style:italic; color:var(--site-ink-dim); }

.shot { position:relative; border-radius:8px; overflow:hidden; background:var(--bg-primary); border:1px solid var(--site-hair); box-shadow:0 30px 60px -20px rgba(0,0,0,0.5), 0 0 0 1px rgba(233,195,73,0.06); }
.shot-chrome { display:flex; align-items:center; gap:8px; padding:9px 14px; border-bottom:1px solid var(--border-subtle); background:var(--bg-secondary); }
.shot-chrome .dots { display:flex; gap:6px; }
.shot-chrome .dots span { width:10px; height:10px; border-radius:999px; background:var(--border-default); }
.shot-path { font-size:11px; color:var(--text-tertiary); font-family:var(--font-num); letter-spacing:0.02em; }

.hero-grad { position:absolute; inset:0; background: radial-gradient(ellipse 80% 60% at 20% 0%, rgba(233,195,73,0.08), transparent 60%), radial-gradient(ellipse 60% 40% at 100% 100%, rgba(233,195,73,0.04), transparent 70%); pointer-events:none; }

.diamond { display:inline-block; width:6px; height:6px; background:var(--site-gold); transform:rotate(45deg); margin:0 6px; }

.feature { padding:32px 0; border-top:1px solid var(--site-hair); display:grid; grid-template-columns:40px 1fr; gap:20px; }
.feature:last-child { border-bottom:1px solid var(--site-hair); }
.feature-ix { font-family:var(--font-display); font-size:14px; color:var(--site-gold); letter-spacing:0.05em; }

.pullquote { font-family:var(--font-display); font-size:clamp(26px, 3vw, 38px); font-weight:400; font-style:italic; line-height:1.28; letter-spacing:-0.015em; color:var(--site-ink); margin:0; }
.pullquote::before { content:'\201C'; color:var(--site-gold); margin-right:4px; }
.pullquote::after  { content:'\201D'; color:var(--site-gold); margin-left:2px; }

@media (max-width:900px) {
  .section-head { grid-template-columns:1fr; gap:24px; margin-bottom:40px; }
  .footer-grid  { grid-template-columns:1fr 1fr; }
  .nav-links    { display:none; }
}

[id] { scroll-margin-top:88px; }

.paper-rule { display:grid; grid-template-columns:1fr auto 1fr; gap:16px; align-items:center; color:var(--site-ink-dim); font-family:var(--font-display); font-style:italic; font-size:14px; }
.paper-rule::before, .paper-rule::after { content:''; height:1px; background:var(--site-hair); }

@keyframes fadeInUp { from {opacity:0; transform:translateY(8px);} to {opacity:1; transform:translateY(0);} }
.fade-in   { animation: fadeInUp 500ms ease-out both; }
.fade-in-1 { animation-delay: 80ms; }
.fade-in-2 { animation-delay: 160ms; }
.fade-in-3 { animation-delay: 240ms; }

.reveal { opacity:0; transform:translateY(12px); transition:opacity 600ms ease, transform 600ms ease; }
.reveal.in { opacity:1; transform:translateY(0); }

.keyline { border:1px solid var(--site-hair); padding:22px 24px; position:relative; background:var(--site-bg); }
.keyline-label { position:absolute; top:-8px; left:18px; padding:0 8px; background:var(--site-bg); font-size:10px; letter-spacing:0.22em; color:var(--site-ink-dim); font-weight:600; text-transform:uppercase; }

.spec-table { width:100%; border-collapse:collapse; font-size:13.5px; }
.spec-table th, .spec-table td { padding:14px 16px; text-align:left; border-bottom:1px solid var(--site-hair); color:var(--site-ink-mute); }
.spec-table th { font-weight:600; color:var(--site-ink); font-size:11px; letter-spacing:0.12em; text-transform:uppercase; }
.spec-table td.check { color:var(--site-gold); font-weight:600; }

.kbd { font-family:var(--font-num); font-size:11px; padding:2px 6px; border:1px solid var(--site-hair-strong); border-radius:3px; color:var(--site-ink-mute); background:var(--site-bg-tint); }
