/* ===================================================================
   llamacoids-type.css — the reading layer
   2026-10-07. Additive: it sets type only, never layout, colour of
   surfaces, or structure. Remove the <link> and the site is exactly
   as it was.

   The rule it enforces, everywhere:

     JetBrains Mono  is for DATA and IDENTITY — part numbers, sizes,
                     prices, step chips, the engraved headline, badges.
                     Things you scan, not things you read.
     Inter           is for ANYTHING YOU READ — nav, headings, body
                     copy, field labels, button text, help text.

   Before this file, every field label on the site was 10px uppercase
   monospace at 0.24em tracking in pure white, which is why nothing
   had a hierarchy and the small text was hard to read. The site
   already declared --sans:"Inter" in the builder stylesheet but never
   loaded the font, so it silently fell back to system-ui.
   =================================================================== */

:root {
  --llm-ui:   "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --llm-data: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* one text ramp, so something can be quiet again */
  --llm-t1: #ffffff;   /* headings, the selected thing         */
  --llm-t2: #c8c8c8;   /* body copy                            */
  --llm-t3: #a2a2a2;   /* field labels, secondary              */
  --llm-t4: #8a8a8a;   /* hints, meta, the genuinely minor     */
}

/* Inter needs a touch more optical size at UI sizes; these two features
   stop the 1/l/I collapse that makes small sans text hard to scan. */
.llm-ui-font,
body { font-feature-settings: "cv05" 1, "cv11" 1, "ss01" 1; }

/* ---------------------------------------------------------------
   1. BASE — reading text becomes Inter
   --------------------------------------------------------------- */
body {
  font-family: var(--llm-ui);
  letter-spacing: 0;
}

/* ---------------------------------------------------------------
   2. TOP BAR — the site nav
   Was: 12px uppercase mono, 1px tracking, #888 on #0a0a0a.
   Now: 13px Inter 600, looser word shapes, brighter.
   --------------------------------------------------------------- */
.llm-desktop-nav a,
.llm-mobile-panel a {
  font-family: var(--llm-ui);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .08em;
  color: var(--llm-t3);
}
header#top .llm-desktop-nav a,
header#top .llm-mobile-panel a { color: var(--llm-t3) !important; }
header#top .llm-desktop-nav a:hover,
header#top .llm-desktop-nav a:focus-visible,
header#top .llm-desktop-nav a.active,
header#top .llm-mobile-panel a:hover,
header#top .llm-mobile-panel a.active { color: #fff !important; }

/* the account strip that sits beside the nav when signed in */
header#top .llm-acct, header#top .llm-acct a, header#top .o_portal_my_details,
header#top .llm-portal-links a {
  font-family: var(--llm-ui); font-size: 12px; font-weight: 600; letter-spacing: .06em;
}

/* ---------------------------------------------------------------
   3. HOMEPAGE
   --------------------------------------------------------------- */

/* Headings read as headings, not as wide-tracked machine output. */
.llm-about-head h2,
.parade-head h2,
.cta-band h3,
.llm-feature h3,
.maker h2, .llm-site h2, .llm-site h3 {
  font-family: var(--llm-ui);
  letter-spacing: -.02em;
  text-wrap: balance;
}
.llm-feature h3 { font-size: 1.2rem; letter-spacing: -.01em; }

/* Body copy: Inter, bigger, looser leading, calmer colour. */
.hero-sub,
.llm-feature p,
.llm-about-body p,
.cta-band p,
.cta-band .llm-also,
.maker p,
.llm-site p {
  font-family: var(--llm-ui);
  letter-spacing: 0;
  color: var(--llm-t2);
}
.hero-sub       { font-size: 1.0625rem; line-height: 1.65; max-width: 54ch; }
.llm-feature p  { font-size: .9375rem;  line-height: 1.6; }
.llm-about-body p { font-size: .9375rem; line-height: 1.7; }

/* Buttons: readable words, not tracked-out capitals. */
.llm-btn {
  font-family: var(--llm-ui);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .08em;
}
.llm-feature .link {
  font-family: var(--llm-ui);
  font-size: 12px; font-weight: 600; letter-spacing: .07em;
}

/* Footer */
.llm-footer-title { font-family: var(--llm-ui); font-size: 11px; font-weight: 700; letter-spacing: .14em; color: var(--llm-t4); }
.llm-footer-copy, .llm-footer-link, .llm-footer-meta,
.llm-footer-bottom-left, .llm-footer-bottom-right {
  font-family: var(--llm-ui); letter-spacing: 0; color: var(--llm-t3);
}
.llm-footer-copy, .llm-footer-link, .llm-footer-meta { font-size: 14px; line-height: 1.7; }

/* --- what stays monospace: the data and the identity --------------- */
.hero-kicker,                                   /* the eyebrow over the headline */
.llm-about-head .k, .parade-head .n,            /* § 01 — About                  */
.llm-feature .num,                              /* 01 / 02 / 03                  */
.llm-about-stats .stat .v,
.llm-about-stats .stat .l,
.llm-about-img .tag,
.engrave-text, .engrave-fill {                  /* the engraved headline itself  */
  font-family: var(--llm-data) !important;
}
/* …but the micro-labels were 9–10px at 0.3em. Give them room to breathe. */
.hero-kicker            { font-size: 11px;  letter-spacing: .22em; color: var(--llm-t4); }
.llm-about-head .k,
.parade-head .n         { font-size: 10.5px; letter-spacing: .22em; color: var(--llm-t4); }
.llm-feature .num       { font-size: 11px;  letter-spacing: .22em; color: var(--llm-t4); }
.llm-about-stats .stat .l { font-size: 10px; letter-spacing: .18em; color: var(--llm-t4); }
.llm-about-img .tag     { font-size: 10.5px; letter-spacing: .18em; }

@media (max-width: 760px) {
  .hero-sub { font-size: 1rem; }
  .llm-desktop-nav a, .llm-mobile-panel a { font-size: 14px; letter-spacing: .06em; }
}

/* ===================================================================
   SPECIFICITY NOTES — why the rules below are heavier than they look

   Two things fight this file:

   (a) ORDER. The homepage's own CSS lives in a <style> block inside the
       body, so it is parsed after this stylesheet and wins every tie on
       equal specificity. Prefixing with .llm-site (the homepage content
       wrapper) raises these above it.

   (b) !IMPORTANT. View 2527 carries six rules that pin the header nav
       and the whole footer to the mono face:
         .llm-desktop-nav a, .llm-header-row a   { font-family: ... !important }
         #footer.llm-footer, .llm-footer         { ... !important }
         .llm-footer-copy / -title / -link / -bottom-left / -bottom-right
       Those can only be answered in kind. Each !important below exists
       to cancel a specific !important above, and nothing more.
   =================================================================== */

/* (b) the top bar — the one Jake called out as hard to read */
header#top .llm-desktop-nav a,
header#top .llm-header-row a,
header#top .llm-mobile-panel a {
  font-family: var(--llm-ui) !important;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .08em;
}

/* (b) the footer */
#footer.llm-footer, .llm-site ~ #footer.llm-footer,
#footer.llm-footer .llm-footer-copy,
#footer.llm-footer .llm-footer-link,
#footer.llm-footer .llm-footer-meta,
#footer.llm-footer .llm-footer-bottom-left,
#footer.llm-footer .llm-footer-bottom-right {
  font-family: var(--llm-ui) !important;
}
#footer.llm-footer .llm-footer-copy { font-size: 14px !important; line-height: 1.7 !important; }
#footer.llm-footer .llm-footer-link { font-size: 14px !important; letter-spacing: 0 !important; }
#footer.llm-footer .llm-footer-bottom-left,
#footer.llm-footer .llm-footer-bottom-right {
  font-size: 12px !important; letter-spacing: .02em !important; text-transform: none !important;
}
/* the footer column headings keep their machined look, just legibly */
#footer.llm-footer .llm-footer-title {
  font-family: var(--llm-ui) !important;
  font-size: 11px !important; font-weight: 700 !important;
  letter-spacing: .14em !important;
}

/* (a) headings and body copy, lifted above the body <style> block */
.llm-site .llm-about-head h2,
.llm-site .parade-head h2,
.llm-site .cta-band h3,
.llm-site .llm-feature h3,
.llm-site .maker h2 {
  font-family: var(--llm-ui);
  letter-spacing: -.02em;
}
.llm-site .llm-feature h3 { font-size: 1.2rem; letter-spacing: -.01em; }

.llm-site .hero-sub,
.llm-site .llm-feature p,
.llm-site .llm-about-body p,
.llm-site .cta-band p,
.llm-site .cta-band .llm-also,
.llm-site .maker p {
  font-family: var(--llm-ui);
  letter-spacing: 0;
  color: var(--llm-t2);
}
.llm-site .hero-sub        { font-size: 1.0625rem; line-height: 1.65; max-width: 54ch; }
.llm-site .llm-feature p   { font-size: .9375rem;  line-height: 1.6; }
.llm-site .llm-about-body p{ font-size: .9375rem;  line-height: 1.7; }

.llm-site .llm-btn,
.llm-site .llm-feature .link {
  font-family: var(--llm-ui);
  font-weight: 600;
}
.llm-site .llm-btn          { font-size: 12.5px; letter-spacing: .08em; }
.llm-site .llm-feature .link{ font-size: 12px;   letter-spacing: .07em; }

/* (a) and the data that must stay monospace, re-asserted at the same weight */
.llm-site .hero-kicker,
.llm-site .llm-about-head .k,
.llm-site .parade-head .n,
.llm-site .llm-feature .num,
.llm-site .llm-about-stats .stat .v,
.llm-site .llm-about-stats .stat .l,
.llm-site .llm-about-img .tag {
  font-family: var(--llm-data) !important;
}