/* The brand guide (Brand Guidelines 1.0, May 2024), which Jess asked us to follow (Wesly, 11 Nov 2026). Loaded after
   site.css on every page rendered with the guide look (marketing/mode.ts, marketing/document.tsx): every page since
   11 Nov; each page's previous design is kept at its own /style and never loads it.
   What it changes, and why:
   - Type: Inter only, at the guide's sizes (H1 Bold 56/64, H2 SemiBold 32/40, H3 SemiBold 24/32, body 16/24). The
     monospaced labels become Inter too; JetBrains Mono stays only inside the ASCII art, which needs a monospaced
     font (Wesly, 11 Nov: yes).
   - Colour: the guide's ten colours. Primary #0D3B66 #146C94 #1E90FF #33CCFF #B3E5FC; neutrals #0A0F16 #111827
     #1F2937 #E5E7EB #FFFFFF; muted text is a tint of two of them. The gold and the wood in the ASCII art stay
     (Wesly, 11 Nov: the exception). The guide's own button, white on #1E90FF, measures 3.24:1 and fails the 4.5:1
     rule (and the guide's own "strong contrast"), so buttons are #0A0F16 on #1E90FF (5.94:1) in the dark theme.
     Every text pair here measures 4.5:1 or better.
   - Shapes: pill buttons and rounded corners; the guide's two gradients on a few accents; light shadows only.
   - The light theme keeps the Mist palette of the live site (Wesly, 11 Nov: the strict flip of the guide's palette
     "looks terrible and much worse than the Mist colour palette"); only the type and the shapes follow the guide
     there. The tokens are written out again below because this file's dark ones would otherwise win. */

:root[data-look="guide"] {
  --bg: #0A0F16; --panel: #111827; --raised: #1F2937; --ink: #E5E7EB; --muted: #989BA0; --line: rgba(229,231,235,.10);
  --brand: #1E90FF; --primary: #1E90FF; --primary-ink: #0A0F16; --link: #33CCFF; --sand: #33CCFF;
  --hero-ink: #FFFFFF; --hero-sub: rgba(255,255,255,.86);
  --hero-wash: linear-gradient(180deg, rgba(10,15,22,.55) 0%, rgba(10,15,22,.12) 30%, rgba(10,15,22,.2) 60%, rgba(10,15,22,.74) 84%, var(--bg) 100%);
  --art-wash: linear-gradient(180deg, rgba(10,15,22,.15), rgba(10,15,22,.55));
  --art-deep: #146C94; --art-top: #B3E5FC; --art-sand: #D9B98C;
  --g1: linear-gradient(90deg, #0D3B66, #33CCFF); --g2: linear-gradient(90deg, #146C94, #B3E5FC);
  --display: var(--sans); --mono: var(--sans);
  color-scheme: dark;
}
@media (prefers-color-scheme: light) { :root[data-look="guide"]:not([data-theme="dark"]) {
  --bg: #F2F6F9; --panel: #FFFFFF; --raised: #DDE8F0; --ink: #0F2131; --muted: #4A5C6B; --line: rgba(15,33,49,.12);
  --brand: #2C9BF5; --primary: #1B6FB8; --primary-ink: #FFFFFF; --link: #1B6FB8; --sand: #8E6A3E;
  --hero-ink: #0C2236; --hero-sub: rgba(12,34,54,.82);
  --hero-wash: linear-gradient(180deg, rgba(242,246,249,.55) 0%, rgba(242,246,249,.08) 45%, rgba(242,246,249,.12) 75%, var(--bg) 100%);
  --art-wash: linear-gradient(180deg, rgba(242,246,249,.1), rgba(242,246,249,.5));
  --art-deep: #0C57C2; --art-top: #1B8FE0; --art-sand: #8E6A3E;
  --map-road: #A9C9E6; --tint: 34%;   /* light: the map's streets and the blue washes show their blue */
  color-scheme: light; } }
:root[data-look="guide"][data-theme="light"] {
  --bg: #F2F6F9; --panel: #FFFFFF; --raised: #DDE8F0; --ink: #0F2131; --muted: #4A5C6B; --line: rgba(15,33,49,.12);
  --brand: #2C9BF5; --primary: #1B6FB8; --primary-ink: #FFFFFF; --link: #1B6FB8; --sand: #8E6A3E;
  --hero-ink: #0C2236; --hero-sub: rgba(12,34,54,.82);
  --hero-wash: linear-gradient(180deg, rgba(242,246,249,.55) 0%, rgba(242,246,249,.08) 45%, rgba(242,246,249,.12) 75%, var(--bg) 100%);
  --art-wash: linear-gradient(180deg, rgba(242,246,249,.1), rgba(242,246,249,.5));
  --art-deep: #0C57C2; --art-top: #1B8FE0; --art-sand: #8E6A3E;
  --map-road: #A9C9E6; --tint: 34%;   /* light: the map's streets and the blue washes show their blue */
  color-scheme: light; }

/* type: Inter only, at the guide's sizes */
[data-look="guide"] body { line-height: 1.5; }
[data-look="guide"] .nm-hero h1 { font: 700 clamp(38px, 4.6vw, 56px)/1.14 var(--sans); letter-spacing: -.02em; }
[data-look="guide"] .h2 { font: 600 clamp(26px, 2.8vw, 32px)/1.25 var(--sans); letter-spacing: -.01em; }
[data-look="guide"] .h2--sm { font-size: clamp(24px, 2.4vw, 30px); }
[data-look="guide"] :is(.nm-journey__h, .nm-role h3, .nm-journey__notes b, .nm-mock__h, .nm-week__card b, .nm-acc__btn) { font-family: var(--sans); font-weight: 600; letter-spacing: -.005em; }
[data-look="guide"] .nm-journey__h { font-size: clamp(19px, 1.8vw, 24px); line-height: 1.33; }
[data-look="guide"] .nm-role h3 { font-size: clamp(19px, 1.8vw, 24px); line-height: 1.33; }
[data-look="guide"] .nm-role__n { font: 600 26px/1 var(--sans); color: var(--link); }
[data-look="guide"] .nm-pcard blockquote p { font: 500 18.5px/1.5 var(--sans); }
[data-look="guide"] .nm-receipt__amt { font: 700 54px/1 var(--sans); letter-spacing: -.02em; }
[data-look="guide"] .nm-receipt__total b { font: 700 22px/1.2 var(--sans); }
[data-look="guide"] .nm-done__h { font: 600 26px/1.2 var(--sans); }
[data-look="guide"] .nm-journey__notes b { font-size: 20px; }
[data-look="guide"] .nm-steps3__n { font: 600 30px/1 var(--sans); }
[data-look="guide"] .nm-phone__stat b { font: 700 34px/1 var(--sans); }
[data-look="guide"] .nm-two__txt h2, [data-look="guide"] .nm-card h3 { font-family: var(--sans); }
[data-look="guide"] .lead { line-height: 1.5; }

/* spacing: the same space above and below every section, so a section with its own background (the price dots) or its
   own lines (the closing section) sits centred between its neighbours (Wesly, 11 Nov). It was 96px above, 32px below. */
[data-look="guide"] .nm-band { padding-block: 76px; }
[data-look="guide"] .nm-contact { padding-top: 76px; }
[data-look="guide"] .nm-closer { padding-block: 84px; }
@media (max-width: 760px) { [data-look="guide"] .nm-band, [data-look="guide"] .nm-contact { padding-block: 56px; } }

/* shapes: pill buttons, light shadows, no glows */
[data-look="guide"] .btn, [data-look="guide"] .btn--sm { border-radius: 999px; }
[data-look="guide"] .btn:hover { box-shadow: none; }
[data-look="guide"] .nm-handset .os-phone { filter: drop-shadow(0 16px 32px rgba(0,0,0,.28)); }
[data-look="guide"] :is(.nm-receipt, .nm-contact__card, .nm-mock, .nm-fcard__app, .nm-phone, .nm-pcard:hover) { box-shadow: 0 10px 28px rgba(0,0,0,.16); }
[data-look="guide"] :is(.nm-callout::before, .nm-lab i) { box-shadow: none; }

/* the guide's two gradients, on a few accents */
[data-look="guide"] .nm-receipt { overflow: hidden; }
[data-look="guide"] .nm-receipt::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--g1); }
[data-look="guide"] .nm-team__row { border-top: 0; background: var(--g1) top / 100% 2px no-repeat; }
[data-look="guide"] .nm-role::before { background: var(--g2); }
[data-look="guide"] .nm-journey__bar::after { background: var(--g1); }
[data-look="guide"] .nm-team { background: linear-gradient(180deg, color-mix(in srgb, var(--brand) 6%, transparent), transparent 70%); }

/* the brand line under the footer logo (Wesly, 11 Nov: "yes, maybe word it a bit better") */
.nm-foot__tag { font: 600 15px/1.35 var(--sans); color: var(--ink); margin-top: 14px; }