

:root {
   --ground: #FFFFFF;
   --surface: #F5F5F5;
   --surface-subtle: #EEEEEE;

   --surface-card: #FFFFFF;
   --border: #E0E0E0;
   --border-strong: #121212;
   --border-dark: #2A2A2A;
   --border-hairline: #ECECEC;
   --ink-mid: #595959;
   --ink-light: #707070;
   --ink: #121212;
   --ink-heavy: #050505;
   --accent: #B2340B;
   --accent-hover: #8F2704;
   --accent-soft: rgba(178, 52, 11, 0.08);
   --accent-glow: rgba(216, 67, 21, 0.22);
   --dark-ground: #0D0D0D;
   --dark-surface: #171717;
   --dark-surface-elevated: #222222;
   --dark-ink: #FFFFFF;
   --dark-ink-mid: #9E9E9E;
   --dark-border: #2E2E2E;


   --neha-95c: "Barlow Condensed", "Arial Narrow", -apple-system, BlinkMacSystemFont, sans-serif;
   --neha-b77: "Crimson Pro", Georgia, Cambria, "Times New Roman", serif;
   --neha-b31: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;


   --fs-hero: clamp(2.75rem, 8vw + 1rem, 6.75rem);
   --fs-poster: clamp(2.25rem, 5.5vw + 0.5rem, 4.5rem);
   --fs-title: clamp(1.85rem, 3.5vw + 0.5rem, 2.85rem);
   --fs-subtitle: clamp(1.35rem, 2vw + 0.35rem, 1.85rem);
   --fs-lead: clamp(1.2rem, 1.25vw + 0.5rem, 1.45rem);
   --fs-body: clamp(1.0625rem, 0.4vw + 0.95rem, 1.1875rem);
   --fs-meta: clamp(0.8125rem, 0.25vw + 0.75rem, 0.9375rem);
   --fs-micro: 0.75rem;


   --lh-tight: 0.92;
   --lh-title: 1.05;
   --lh-body: 1.62;
   --lh-prose: 1.68;


   --space-3xs: 0.125rem;
   --space-2xs: 0.25rem;
   --space-xs: 0.5rem;
   --space-sm: 0.75rem;
   --space-md: 1rem;
   --space-lg: 1.5rem;
   --space-xl: 2rem;
   --space-2xl: 3rem;
   --space-3xl: 4.5rem;
   --space-4xl: 6.5rem;
   --space-5xl: 9rem;


   --measure-narrow: 46ch;
   --measure-prose: 68ch;
   --measure-wide: 88ch;
   --measure-full: 1280px;


   --dur-fast: 140ms;
   --dur-base: 220ms;
   --dur-slow: 380ms;
   --dur-motion: 600ms;
   --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
   --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
   --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
   --ease-mechanical: cubic-bezier(0.2, 0, 0, 1);


   --radius-none: 0px;
   --radius-chip: 2px;
   --header-height: 4.5rem;
   --header-condensed-height: 3.5rem;
}


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


html {
   background-color: var(--ground);
   color: var(--ink);
   font-family: var(--neha-b77);
   font-size: 100%;
   line-height: var(--lh-body);
   -webkit-text-size-adjust: 100%;
   -moz-text-size-adjust: 100%;
   text-size-adjust: 100%;
   scroll-behavior: smooth;
   scroll-padding-top: calc(var(--header-height) + 1.5rem);
}


body {
   min-height: 100vh;
   background-color: var(--ground);
   color: var(--ink);
   font-family: var(--neha-b77);
   font-size: var(--fs-body);
   line-height: var(--lh-body);
   text-rendering: optimizeLegibility;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;

   overflow-x: hidden;
   position: relative;
}


img,
picture,
svg {
   display: block;
   max-width: 100%;
   height: auto;
}


button,
input,
select,
textarea {
   font: inherit;
   color: inherit;
}


button {
   background: none;
   border: none;
   cursor: pointer;
}


a {
   color: inherit;
   text-decoration-skip-ink: auto;
}


table {
   border-collapse: collapse;
   width: 100%;
}


ul,
ol { list-style-position: outside; }


h1,
h2,
h3,
h4,
h5,
h6 {
   font-family: var(--neha-95c);
   font-weight: 800;
   line-height: var(--lh-title);
   text-transform: uppercase;
   letter-spacing: -0.01em;
   color: var(--ink);
   text-wrap: balance;
   overflow-wrap: break-word;
}


h1 {
   font-size: var(--fs-poster);
   line-height: var(--lh-tight);
   font-weight: 900;
   letter-spacing: -0.02em;
}


h2 {
   font-size: var(--fs-title);
   font-weight: 800;
}


h3 {
   font-size: var(--fs-subtitle);
   font-weight: 800;
}


h4 {
   font-size: 1.25rem;
   font-weight: 700;
   letter-spacing: 0.02em;
}


h5 {
   font-size: 1.05rem;
   font-weight: 700;
   letter-spacing: 0.04em;
}


h6 {
   font-size: 0.925rem;
   font-weight: 700;
   letter-spacing: 0.06em;
}


p {
   max-width: var(--measure-prose);
   margin-bottom: var(--space-md);
   color: var(--ink);
   font-size: var(--fs-body);
   line-height: var(--lh-prose);
}


p:last-child { margin-bottom: 0; }


.lead-p {
   font-size: var(--fs-lead);
   line-height: 1.5;
   font-weight: 500;
   color: var(--ink);
   max-width: var(--measure-prose);
}


code,
pre,
kbd,
samp,
.mono {
   font-family: var(--neha-b31);
   font-size: 0.9em;
   letter-spacing: -0.02em;
}


blockquote {
   border-left: 3px solid var(--accent);
   padding-left: var(--space-lg);
   margin: var(--space-xl) 0;
   font-style: italic;
   font-size: var(--fs-lead);
   color: var(--ink);
}


cite {
   display: block;
   margin-top: var(--space-xs);
   font-family: var(--neha-b31);
   font-size: var(--fs-meta);
   font-style: normal;
   color: var(--ink-mid);
   text-transform: uppercase;
   letter-spacing: 0.05em;
}


hr {
   border: 0;
   border-top: 1px solid var(--border);
   margin: var(--space-3xl) 0;
}


.shell-container {
   width: 100%;
   max-width: var(--measure-full);
   margin-left: auto;
   margin-right: auto;
   padding-left: clamp(0.75rem, 4vw, 3rem);

   padding-right: clamp(0.75rem, 4vw, 3rem);
}


.shell-prose {
   width: 100%;
   max-width: var(--measure-prose);
   margin-left: auto;
   margin-right: auto;
}


.shell-wide {
   width: 100%;
   max-width: var(--measure-wide);
   margin-left: auto;
   margin-right: auto;
}


.shell-narrow {
   width: 100%;
   max-width: var(--measure-narrow);
   margin-left: auto;
   margin-right: auto;
}


.icon {
   display: inline-block;
   width: 1.15em;
   height: 1.15em;
   stroke-width: 0;
   stroke: currentColor;
   fill: currentColor;
   vertical-align: -0.15em;
   flex-shrink: 0;
}


.sr-only {
   position: absolute !important;
   width: 1px !important;
   height: 1px !important;
   padding: 0 !important;
   margin: -1px !important;
   overflow: hidden !important;
   clip: rect(0, 0, 0, 0) !important;
   white-space: nowrap !important;
   border: 0 !important;
}


:focus-visible {
   outline: 2px solid var(--accent);
   outline-offset: 3px;
}


.flow > * + * { margin-top: var(--space-md); }


.flow-lg > * + * { margin-top: var(--space-xl); }


.flow-xl > * + * { margin-top: var(--space-2xl); }


.cluster {
   display: flex;
   flex-wrap: wrap;
   gap: var(--space-md);
   align-items: center;
}


.cluster-tight {
   display: flex;
   flex-wrap: wrap;
   gap: var(--space-xs);
   align-items: center;
}


.grid-cols-2 {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: var(--space-xl);
}


.grid-cols-3 {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: var(--space-lg);
}


@media (max-width: 840px) {
   .grid-cols-2,
   .grid-cols-3 {
      grid-template-columns: 1fr;
      gap: var(--space-lg);
   }
}


.text-accent { color: var(--accent); }


.text-mid { color: var(--ink-mid); }


.text-dark { color: var(--ink); }


.bg-ground { background-color: var(--ground); }


.bg-surface { background-color: var(--surface); }


.bg-dark {
   background-color: var(--dark-ground);
   color: var(--dark-ink);
}


.border-top { border-top: 1px solid var(--border); }


.border-bottom { border-bottom: 1px solid var(--border); }


.border-box { border: 1px solid var(--border); }


@media (prefers-reduced-motion: reduce) {
   *,
   *::before,
   *::after {
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0.01ms !important;
      scroll-behavior: auto !important;
   }
}
