/* ==========================================================================
   THE AGRICULTURAL HORIZON — global tokens, fonts, base typography
   bhagirathchoudhary.in
   ========================================================================== */

@font-face { font-family: "Instrument Serif"; src: url("../fonts/instrument-serif-regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Serif"; src: url("../fonts/instrument-serif-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Source Sans 3"; src: url("../fonts/source-sans-3-var.woff2") format("woff2"); font-weight: 300 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Source Sans 3"; src: url("../fonts/source-sans-3-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }

:root {
  /* Palette — supplied */
  --indigo: #18243A;        /* Midnight Indigo — dominant dark */
  --green: #3F6848;         /* Agricultural Green */
  --wheat: #C9A65A;         /* Wheat Gold — on dark grounds only for text */
  --soil: #A95C43;          /* Terracotta Soil — accent */
  --sand: #E8DDC8;
  --parchment: #F4EFE5;
  --sage: #DCE5D8;
  --charcoal: #202522;
  --white: #FCFBF8;
  --slate: #5F6864;         /* Muted Slate (#68716D) darkened for 4.5:1 text contrast on parchment */

  /* Derived, contrast-safe inks for small text on light grounds */
  --wheat-ink: #7A5D22;     /* 5.6:1 on parchment */
  --soil-ink: #8A4631;      /* 6.0:1 on parchment */
  --indigo-2: #22324E;      /* raised indigo surface */
  --indigo-3: #2E4064;
  --line: rgba(24, 36, 58, .16);
  --line-strong: rgba(24, 36, 58, .32);
  --line-on-dark: rgba(232, 221, 200, .22);

  /* Type */
  --serif: "Instrument Serif", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --sans: "Source Sans 3", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;

  --fs-xs: .78rem;
  --fs-sm: .9rem;
  --fs-base: 1.0625rem;
  --fs-md: 1.2rem;
  --fs-lg: clamp(1.35rem, 1.1rem + .9vw, 1.7rem);
  --fs-xl: clamp(1.8rem, 1.3rem + 2vw, 2.7rem);
  --fs-2xl: clamp(2.3rem, 1.4rem + 3.6vw, 4.1rem);
  --fs-3xl: clamp(2.8rem, 1.4rem + 6vw, 6.4rem);

  /* Space & layout */
  --gutter: clamp(1rem, .6rem + 2.2vw, 2.5rem);
  --wrap: 1320px;
  --wrap-narrow: 860px;
  --section: clamp(4rem, 2.8rem + 5vw, 8rem);
  --radius: 2px;
  --header-h: 76px;

  --ease: cubic-bezier(.2, .7, .2, 1);
}

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

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 1.5rem);
}

body {
  margin: 0;
  background: var(--parchment);
  color: var(--charcoal);
  font-family: var(--sans);
  font-size: var(--fs-base);
  line-height: 1.65;
  font-feature-settings: "kern", "liga";
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

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

h1, h2, h3, h4 { margin: 0 0 .5em; font-weight: 400; line-height: 1.08; color: var(--indigo); }
h1, h2 { font-family: var(--serif); letter-spacing: -.01em; }
h1 { font-size: var(--fs-3xl); }
h2 { font-size: var(--fs-2xl); }
h3 { font-family: var(--serif); font-size: var(--fs-lg); line-height: 1.2; }
h4 { font-family: var(--sans); font-size: var(--fs-sm); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }

p { margin: 0 0 1.1em; }
p:last-child { margin-bottom: 0; }
em, i { font-style: italic; }
strong, b { font-weight: 650; }

a { color: var(--green); text-decoration-thickness: 1px; text-underline-offset: .2em; transition: color .2s var(--ease); }
a:hover { color: var(--soil-ink); }

ul, ol { margin: 0 0 1.1em; padding-left: 1.2em; }
li + li { margin-top: .35em; }

abbr[title] { text-decoration: none; border-bottom: 1px dotted var(--line-strong); cursor: help; }

hr { border: 0; border-top: 1px solid var(--line); margin: 2.5rem 0; }

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

::selection { background: var(--wheat); color: var(--indigo); }

:focus { outline: none; }
:focus-visible {
  outline: 2px solid var(--soil);
  outline-offset: 3px;
  border-radius: 1px;
}
.on-dark :focus-visible, .site-footer :focus-visible, .nav-panel :focus-visible { outline-color: var(--wheat); }

.skip-link {
  position: absolute; left: 1rem; top: -100px; z-index: 1000;
  background: var(--indigo); color: var(--white); padding: .75rem 1.1rem;
  font-weight: 600; text-decoration: none;
}
.skip-link:focus { top: 1rem; color: var(--white); }

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

/* ---------- Editorial type helpers ---------- */
.eyebrow {
  display: inline-flex; align-items: center; gap: .7rem;
  font-family: var(--sans); font-size: var(--fs-xs); font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase; color: var(--soil-ink);
  margin: 0 0 1.1rem;
}
.eyebrow .num { color: var(--slate); font-weight: 600; letter-spacing: .08em; }
.eyebrow::before {
  content: ""; width: 2.2rem; height: 1px; background: currentColor; opacity: .8;
}
.eyebrow--plain::before { display: none; }
.on-dark .eyebrow { color: var(--wheat); }
.on-dark .eyebrow .num { color: var(--sand); opacity: .75; }

.lede {
  font-family: var(--serif); font-size: var(--fs-lg); line-height: 1.4;
  color: var(--indigo); max-width: 44ch;
}
.lede em { color: var(--green); }
.on-dark .lede { color: var(--parchment); }
.on-dark .lede em { color: var(--wheat); }

.serif { font-family: var(--serif); }
.italic { font-style: italic; }
.meta {
  font-size: var(--fs-xs); font-weight: 600; letter-spacing: .12em;
  text-transform: uppercase; color: var(--slate);
}
.on-dark .meta { color: var(--sand); }
.muted { color: var(--slate); }
.small { font-size: var(--fs-sm); }

.prose { max-width: 68ch; }
.prose p, .prose li { font-size: 1.075rem; }
.prose h3 { margin-top: 2.2rem; }
.prose > h2 { margin-top: 3rem; font-size: var(--fs-xl); }

.dropcap::first-letter {
  float: left; font-family: var(--serif); font-size: 4.6em; line-height: .82;
  padding: .06em .12em 0 0; color: var(--soil);
}

.on-dark { color: var(--sand); }
.on-dark h1, .on-dark h2, .on-dark h3 { color: var(--white); }
.on-dark a { color: var(--wheat); }
.on-dark a:hover { color: var(--white); }

/* Source notes */
.source {
  display: block; margin-top: .8rem; font-size: var(--fs-xs); letter-spacing: .04em;
  color: var(--slate); line-height: 1.5;
}
.source::before { content: "Source — "; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; font-size: .7rem; }
.source a { color: inherit; }
.on-dark .source { color: rgba(232, 221, 200, .8); }

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

/* On tinted grounds (sand, sage, the hero ground) the muted slate darkens so small
   text keeps at least 4.5:1 contrast. */
.bg-sand, .bg-sage, .dos-head, .hz__ground, .soil-head, .lib-head, .cover, .rep, .hzn--b, .hzn--c { --slate: #515A56; }
.nowrap { white-space: nowrap; }