/* nineteen93 landing page — utility classes + responsive rules
   (everything that cannot live inline). Tokens come from the design system. */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--font-body); font-weight: 300; background: var(--ghost); color: var(--black); line-height: 1.65; }
a { color: var(--teal-500); }
a:hover { color: var(--teal-700); }
.btn { font-family: var(--font-body); font-size: 11px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; padding: 12px 24px; border-radius: 2px; cursor: pointer; border: none; display: inline-flex; align-items: center; gap: 6px; text-decoration: none; transition: opacity 0.15s; }
.btn:hover { opacity: 0.88; }
.btn-primary { background: var(--cranberry-700); color: var(--white); }
.btn-white { background: var(--white); color: var(--cranberry-700); }
.btn-white-outline { background: transparent; color: var(--white); border: 1px solid rgba(255,255,255,0.5); }
.btn-sm { padding: 8px 16px; font-size: 10px; }
.eyebrow { font-size: 10px; font-weight: 500; letter-spacing: 0.28em; text-transform: uppercase; color: var(--silver); }
.serif { font-family: var(--font-display); font-weight: 300; }
nav { background: var(--ghost); border-bottom: 1px solid var(--fog); padding: 0 48px; display: flex; align-items: center; height: 60px; position: sticky; top: 0; z-index: 100; }
.wordmark { font-family: var(--font-display); font-weight: 300; font-size: 24px; color: var(--cranberry-700); }
.wordmark span { color: #DCAFC4; font-style: italic; }
.navlinks { display: flex; align-items: center; gap: 28px; margin-left: auto; }
.navlink { font-size: 13px; color: var(--slate); cursor: pointer; text-decoration: none; }
@media (max-width: 900px) {
  nav { padding: 0 24px; }
  .navlinks { gap: 16px; }
  .navlink { display: none; }
  .grid-3 { grid-template-columns: 1fr !important; }
  .split-2 { grid-template-columns: 1fr !important; }
  .founder-grid { grid-template-columns: 1fr !important; }
  .section-pad { padding-left: 24px !important; padding-right: 24px !important; }
  .hero-title { font-size: 38px !important; }
  .closing-quote { white-space: normal !important; font-size: 26px !important; }
  .operator-heading { white-space: normal !important; font-size: 26px !important; }
  footer { flex-direction: column !important; text-align: center !important; gap: 12px !important; }
  footer > div { justify-content: center !important; flex-wrap: wrap !important; }
}