/* ============================================================
   Lexora — reset, typography, layout primitives
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

body {
  margin: 0;
  font-family: var(--font-text);
  font-size: var(--t-md);
  line-height: 1.5;
  color: var(--body);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "cv02","cv03","cv04","cv11";
}

body.is-locked { overflow: hidden; }

h1, h2, h3, h4, h5, p, figure, blockquote, ul, ol, dl { margin: 0; }
ul, ol { padding: 0; list-style: none; }
img, svg, video { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }
button { background: none; border: 0; padding: 0; cursor: pointer; }
a { color: inherit; text-decoration: none; }
hr { border: 0; border-top: 1px solid var(--border-2); margin: 0; }

:focus-visible {
  outline: 3px solid var(--blue-500);
  outline-offset: 2px;
  border-radius: 4px;
}

/* skip link ------------------------------------------------ */
.skip-link {
  position: absolute; left: 16px; top: -60px; z-index: 200;
  background: var(--blue-600); color: #fff;
  padding: 12px 18px; border-radius: var(--r-10); font-weight: 700;
  transition: top var(--dur-2) var(--ease);
}
.skip-link:focus { top: 16px; }

/* ---- layout ---------------------------------------------- */
.container {
  width: 100%;
  max-width: calc(var(--content) + var(--gutter) * 2);
  margin: 0 auto;
  padding-inline: var(--gutter);
}
.section { padding-block: var(--s9); }
.section--tight { padding-block: 72px; }
.section--soft { background: var(--surface-soft); }
.section--alt  { background: var(--surface-alt); }
.section--dark { background: var(--navy-hero); color: var(--on-dark); position: relative; overflow: hidden; }
.section--ink  { background: var(--navy-950); color: var(--on-dark); }

.stack   { display: flex; flex-direction: column; }
.row     { display: flex; flex-direction: row; }
.center  { align-items: center; }
.between { justify-content: space-between; }
.end     { align-items: flex-end; }
.wrap    { flex-wrap: wrap; }
.grow    { flex: 1 1 auto; min-width: 0; }
.spacer  { flex: 1 1 auto; }

.g1 { gap: 4px; }  .g2 { gap: 8px; }   .g3 { gap: 12px; } .g4 { gap: 16px; }
.g5 { gap: 20px; } .g6 { gap: 24px; }  .g7 { gap: 32px; } .g8 { gap: 40px; }
.g9 { gap: 56px; }

.grid { display: grid; gap: 20px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }

/* ---- typography ------------------------------------------ */
.display,
.h1, .h2, .h3, .h4, .h5 {
  font-family: var(--font-display);
  color: var(--heading-2);
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.18;
}
.display { font-size: var(--t-d1); }
.h1 { font-size: var(--t-d2); }
.h2 { font-size: var(--t-d3); }
.h3 { font-size: var(--t-h1); }
.h4 { font-size: var(--t-h3); font-weight: 700; letter-spacing: -.01em; line-height: 1.3; }
.h5 { font-size: var(--t-h5); font-weight: 700; letter-spacing: -.01em; line-height: 1.32; }

.lead  { font-size: var(--t-lg); line-height: 1.7; color: var(--body); }
.body  { font-size: var(--t-md); line-height: 1.65; color: var(--body); }
.small { font-size: var(--t-sm); line-height: 1.6; color: var(--body); }
.tiny  { font-size: var(--t-xs); line-height: 1.55; color: var(--muted); }
.micro { font-size: var(--t-3xs); line-height: 1.4; }

.eyebrow {
  font-size: var(--t-2xs); font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--muted);
}
.label {
  font-size: var(--t-3xs); font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: var(--faint);
}

.t-blue   { color: var(--blue-600); }
.t-orange { color: var(--orange-500); }
.t-teal   { color: var(--teal-500); }
.t-ink    { color: var(--heading-2); }
.t-body   { color: var(--body); }
.t-muted  { color: var(--muted); }
.t-faint  { color: var(--faint); }
.t-white  { color: #fff; }
.t-ondark { color: var(--on-dark-muted); }
.t-dim    { color: var(--on-dark-dim); }
.t-grad   { background: var(--grad-saarthi); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nowrap   { white-space: nowrap; }
.measure  { max-width: 68ch; }

/* dark-band typography overrides */
.section--dark .h1, .section--dark .h2, .section--dark .h3,
.section--dark .h4, .section--dark .h5, .section--dark .display { color: #fff; }

/* ---- max-width helpers ----------------------------------- */
.mw-560 { max-width: 560px; }
.mw-600 { max-width: 600px; }
.mw-640 { max-width: 640px; }
.mw-700 { max-width: 700px; }
.mw-720 { max-width: 720px; }
.mw-760 { max-width: 760px; }
.mw-800 { max-width: 800px; }
.mw-820 { max-width: 820px; }
.mw-840 { max-width: 840px; }
.mw-920 { max-width: 920px; }

/* ---- responsive ------------------------------------------ */
@media (max-width: 1280px) {
  :root { --gutter: 64px; }
}
@media (max-width: 1024px) {
  :root { --gutter: 40px; --t-d1: 46px; --t-d2: 38px; --t-d3: 34px; --t-h1: 28px; }
  .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  :root { --gutter: 20px; --t-d1: 34px; --t-d2: 30px; --t-d3: 27px; --t-h1: 24px; --t-h3: 20px; }
  .section { padding-block: 56px; }
  .grid, .grid-2, .grid-3, .grid-4, .grid-6 { grid-template-columns: minmax(0, 1fr); }
  .row-collapse { flex-direction: column; align-items: stretch; }
}

/* ---- print ----------------------------------------------- */
@media print {
  .utility-bar, .navbar, .float-stack, .cookie-bar, .modal-root, .drawer { display: none !important; }
  body { color: #000; }
}
