/* SourcingAI — AIGoGo house palette for the public website and the nine-page overview (body.theme-house).
   A family-office register: a bright near-white ground, near-black ink for maximum contrast, an editorial
   serif for display type over a grotesk for everything else, and citrus used sparingly — a flash, never a
   wash. Citrus is only ever a fill behind near-black text or a mark on the dark ground, because acid lime
   on white is unreadable. The demo does not load this file, so its operational status colours are untouched.
   Fonts: Plus Jakarta Sans and Instrument Serif, both SIL Open Font License 1.1 (see shared/fonts/). */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('../fonts/plus-jakarta-sans-latin-wght-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'Instrument Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/instrument-serif-latin-400-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Instrument Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/instrument-serif-latin-ext-400-normal.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Instrument Serif';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/instrument-serif-latin-400-italic.woff2') format('woff2');
}

.theme-house {
  /* Ground and ink */
  --bright: #FBFBF9;          /* page ground — bright, with the faintest warmth */
  --paper: #FFFFFF;           /* panels and fields */
  --lilac: #F1F0EA;           /* the quiet bone band between chapters */
  --cream: var(--bright);
  --sand: var(--lilac);
  --linen: #E4E3DB;           /* hairlines */
  --taupe: #C6C4B9;           /* stronger lines */
  --ink: #0B0B0C;             /* 19.4:1 on the bright ground */
  --black: var(--ink);
  --ink-2: #4A4A46;           /* secondary text, 8.9:1 */

  /* Near-black chapters. The scale keeps its old names so every component follows along. */
  --deep-950: #050506;
  --deep-900: #0E0E10;        /* dark chapters and footer */
  --deep-800: #121214;        /* primary actions, 17.8:1 on bright */
  --deep-700: #4A5800;        /* citrus pressed into ink: wordmark, links, 7.2:1 on bright */
  --deep-600: #7A9400;        /* citrus marks that are not text */
  --deep-300: #D9FF3D;        /* THE citrus */
  --deep-100: #F0FFC2;
  --citrus: #D9FF3D;
  --citrus-soft: #EEFFA8;
  --signal: var(--deep-700);
  --signal-ink: var(--ink);

  /* On the dark ground, where citrus belongs */
  --on-deep: #F7F7F2;
  --on-deep-2: #A9A9A0;

  --g-900: #FFFFFF; --g-850: var(--bright); --g-800: var(--paper); --g-750: var(--lilac); --g-700: #E9E8E1;
  --g-600: var(--linen); --g-500: var(--taupe); --g-400: #5E5E58; --g-300: #4A4A46; --g-200: #24241F; --g-100: var(--ink);
  --rule: rgb(11 11 12 / .14);
  --rule-strong: rgb(11 11 12 / .7);

  /* Shared component surfaces */
  --bg: var(--bright); --surface: var(--paper); --surface-2: var(--lilac); --line: var(--linen); --line-2: var(--taupe);
  --text: var(--ink); --text-2: var(--ink-2);
  --focus-ring: 0 0 0 2px var(--bright), 0 0 0 4px var(--deep-800);

  /* Type: an editorial serif for display, a grotesk for the rest */
  --font: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --font-display: "Instrument Serif", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --font-mono: var(--font);

  /* Enterprise map on the bright ground */
  --map-signal: #4A5800; --map-warm: #7A9400; --map-ink: #0B0B0C;
  --map-floor-1: #EDECE5; --map-floor-2: #F4F3ED; --map-floor-3: #FBFBF9;
  --map-tile-1: #FFFFFF; --map-tile-2: #EFEEE7; --map-lattice: #C9C7BB;

  background: var(--bright); color: var(--ink); font-family: var(--font);
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}

/* Section themes; the page tweens between them as chapters arrive (see landing.js) */
.theme-house [data-theme="deep"] {
  --black: var(--on-deep); --ink: var(--on-deep); --ink-2: var(--on-deep-2);
  --text: var(--on-deep); --text-2: var(--on-deep-2);
  --rule: rgb(247 247 242 / .2); --rule-strong: rgb(247 247 242 / .5);
  --signal: var(--citrus); --signal-ink: var(--citrus);
  --map-signal: #D9FF3D; --map-warm: #B6E200; --map-ink: #F7F7F2;
  --map-floor-1: #17171A; --map-floor-2: #121215; --map-floor-3: #0E0E10;
  --map-tile-1: #1C1C20; --map-tile-2: #141417; --map-lattice: #3A3A33;
  color: var(--on-deep); background: var(--deep-900);
}

.theme-house ::selection { background: var(--citrus); color: var(--deep-950); }
.theme-house :focus-visible { outline: 2px solid var(--deep-800); outline-offset: 3px; }
.theme-house [data-theme="deep"] :focus-visible { outline-color: var(--citrus); }

/* Type roles. The serif carries the big voice — page titles, chapter openers, the one big number.
   Everything smaller stays in the grotesk, where a 21px serif would read thin. */
.theme-house h1, .theme-house .display, .theme-house .s-display, .theme-house .s-big, .theme-house .s-h2,
.theme-house .ct-display, .theme-house .ct-h2, .theme-house .pf-card-h, .theme-house .pf-auth-h,
.theme-house .metric-value, .theme-house .hero-number, .theme-house .s-preview-v {
  font-family: var(--font-display); font-weight: 400 !important; letter-spacing: -.012em; color: inherit;
}
.theme-house h2, .theme-house h3, .theme-house h4, .theme-house .rollup-title, .theme-house .queue-rank,
.theme-house .summary-count, .theme-house .sm-num, .theme-house .ct-num b, .theme-house .ct-n {
  font-family: var(--font); font-weight: 600; letter-spacing: -.012em; color: inherit;
}
.theme-house h2.s-h2, .theme-house h2.s-big, .theme-house h2.display { font-family: var(--font-display); font-weight: 400; }
.theme-house .s-display { font-size: clamp(3rem, 6.9vw, 6.9rem); line-height: 1.02; max-width: 17ch; }
.theme-house .s-big { font-size: clamp(2.3rem, 4.4vw, 4.7rem); line-height: 1.06; max-width: 19ch; }
.theme-house .s-h2 { font-size: clamp(2.2rem, 3.8vw, 3.9rem); line-height: 1.06; max-width: 18ch; }
@media (max-width: 760px) { .theme-house .s-display { font-size: clamp(2.9rem, 12vw, 3.8rem); } }

/* The flash: the hero's second line sits on a citrus swash. Drawn on the line itself, not on the words,
   so it is there whether or not the word-by-word entrance is running. */
.theme-house .s-display .accent {
  color: var(--ink); width: fit-content; max-width: 100%;
  background-image: linear-gradient(to top, var(--citrus) 0 .13em, transparent .13em);
  background-repeat: no-repeat;
}
.theme-house [data-theme="deep"] .s-display .accent { background-image: none; color: var(--citrus); }

/* The wordmark */
.theme-house .lockup-master { font-family: var(--font); font-weight: 700; letter-spacing: -.035em; }
.theme-house .lockup-ai { color: var(--deep-700); }
.theme-house [data-theme="deep"] .lockup-ai, .theme-house .s-foot .lockup-ai { color: var(--citrus); }
.theme-house .lockup-prop, .theme-house .lockup-prop b { font-family: var(--font); font-weight: 600; }
.theme-house .lockup-div { background: currentColor; opacity: .3; }

/* Controls: the quiet rounded rectangle of a private-capital site, in sentence case */
.theme-house .btn { border-radius: 9px; font-family: var(--font); font-size: .93rem; font-weight: 600; letter-spacing: 0; word-spacing: normal; text-transform: none; }
.theme-house .btn-lg { font-size: 1rem; }
.theme-house .btn-sm { border-radius: 8px; }
.theme-house .btn-primary { background: var(--deep-800); color: #FFFFFF; border-color: var(--deep-800); }
.theme-house .btn-primary:hover { background: var(--deep-950); border-color: var(--deep-950); }
.theme-house .btn-ghost { background: var(--paper); color: var(--ink); border-color: var(--taupe); }
.theme-house .btn-ghost:hover { border-color: var(--ink); background: var(--paper); }
/* On the dark chapters the primary action is the citrus itself. */
.theme-house [data-theme="deep"] .btn-primary { background: var(--citrus); color: var(--deep-950); border-color: var(--citrus); }
.theme-house [data-theme="deep"] .btn-primary:hover { background: var(--citrus-soft); border-color: var(--citrus-soft); }
.theme-house [data-theme="deep"] .btn-ghost { background: transparent; color: var(--on-deep); border-color: rgb(247 247 242 / .38); }
.theme-house [data-theme="deep"] .btn-ghost:hover { border-color: var(--citrus); color: var(--citrus); }

/* Softer corners on the surfaces that carry content */
.theme-house .s-preview, .theme-house .card, .theme-house .rollup, .theme-house .s-done { border-radius: 12px; }
.theme-house .field input, .theme-house .field select, .theme-house .field textarea { border-radius: 0; }

/* Enterprise map in the marketing palette (the demo keeps its own status colours) */
.theme-house .emap { font-family: var(--font); }
.theme-house .emap .m-side-l { fill: #E8E7DF; }
.theme-house .emap .m-side-r { fill: #D6D4C9; }
.theme-house .emap .m-top { stroke: #CFCDC2; }
.theme-house .emap .m-edge { stroke: var(--deep-700); stroke-opacity: .2; }
.theme-house .emap .m-icon { color: var(--ink); }
.theme-house .emap .m-core-dot { fill: var(--deep-900); }
.theme-house .emap .m-core-ring { stroke: var(--deep-600); stroke-opacity: .5; }
.theme-house .emap .m-scan { stroke: var(--deep-600); }
.theme-house .emap .m-core-sat, .theme-house .emap .m-signal { fill: var(--deep-600); }
.theme-house .emap .m-signal.is-held { fill: var(--deep-700); }
.theme-house .emap .m-gate rect { stroke: var(--deep-700); fill: var(--paper); }
.theme-house .emap .tone-mint .m-hot { fill: var(--citrus); stroke: var(--deep-700); }
.theme-house .emap .tone-blue .m-hot { fill: var(--citrus-soft); stroke: var(--deep-600); }
.theme-house .emap .tone-amber .m-hot { fill: var(--deep-600); stroke: var(--deep-700); }
.theme-house .emap .m-note rect { fill: var(--paper); stroke: var(--deep-700); }
.theme-house .emap .m-note circle { fill: var(--deep-600); }
.theme-house .emap .m-note .m-note-line { stroke: var(--deep-700); }
.theme-house .emap .m-note text { fill: var(--ink); }
.theme-house .emap .m-label { fill: var(--ink); }
.theme-house .emap .m-sub { fill: var(--ink-2); }
.theme-house [data-theme="deep"] .emap .m-side-l { fill: #1B1B1F; }
.theme-house [data-theme="deep"] .emap .m-side-r { fill: #131317; }
.theme-house [data-theme="deep"] .emap .m-top { stroke: #2A2A2E; }
.theme-house [data-theme="deep"] .emap .m-gate rect { fill: var(--deep-900); stroke: var(--citrus); }
.theme-house [data-theme="deep"] .emap .m-note rect { fill: var(--deep-900); stroke: var(--citrus); }

/* On the dark chapters the small marks carry the citrus, so every dark band has one flash in it. */
.theme-house [data-theme="deep"] .eyebrow { color: var(--citrus); }
.theme-house [data-theme="deep"] .s-n { color: var(--citrus); }
.theme-house [data-theme="deep"] .s-phases [data-phase].is-on { color: var(--citrus); }

/* The signed-in platform: the one-time-code button is the citrus flash, and the code itself is set in it. */
.theme-house .pill-go { background: var(--citrus); color: var(--deep-950); }
.theme-house .pill-go:hover { background: var(--citrus-soft); }
.theme-house .pill-mark { color: var(--ink-2); font-family: var(--font); }
.theme-house .pill-input-code { font-family: var(--font); font-weight: 700; }
.theme-house .pf-top { border-bottom-color: var(--linen); }
