/* ============================================================
   THINK NEAR|FAR — integration repair layer
   Loaded AFTER iteration.css / site-pages.css.
   Purpose: undo the React/Tailwind global reset (Preflight) that
   strips heading weight and paragraph margins the approved package
   relies on, plus minimal breakpoint safety. No design changes.
   :where() is used to keep specificity at zero so every explicit
   rule in the approved stylesheets still wins.
   ============================================================ */

/* ---- 0. Palette guard ----------------------------------------
   The app's design system re-declares --ink / --paper as HSL
   triplets on the .dark class, which broke `background:var(--ink)`
   on the approved dark panels (white text on a cream panel).
   Re-assert the approved literal values inside handoff scopes. */
body, main, main *, .brand-rail, .brand-rail *,
.page-rail, .page-rail *, .page-shell, .page-shell * {
  --blue: #101cff;
  --ink: #080808;
  --paper: #f3f0e8;
  --white: #fff;
  --line: rgba(8, 8, 8, .25);
}

/* ---- 1. Reset compensation: typography defaults ---- */
main h1, main h2, main h3, main h4, main h5, main h6,
main summary, main b, main strong,
.page-shell h1, .page-shell h2, .page-shell h3,
.page-shell h4, .page-shell summary, .page-shell b, .page-shell strong { font-weight: 700; }
main em, main i, main cite, .page-shell em, .page-shell i { font-style: italic; }

/* ---- 2. Body-copy rhythm (internal pages) ---- */
.page-shell p, .page-shell ul, .page-shell ol, .page-shell dl { margin: 0 0 1.1em; }
.page-shell p:last-child, .page-shell ul:last-child, .page-shell ol:last-child { margin-bottom: 0; }
.page-shell li { margin: 0 0 .5em; }
.page-shell .page-hero p:last-child { margin: 0; }

/* Extra vertical spacing for the homepage root-cause lead paragraph. */
.story-lead { margin-top: 1.5em; margin-bottom: 1.5em; }
/* inline elements must not swallow their surrounding spaces */
.page-shell a, .page-shell b, .page-shell strong,
.page-shell em, .page-shell i, .page-shell small, .page-shell span { white-space: normal; }

/* ---- 3. No automatic hyphenation / word fragmenting anywhere ---- */
html, body, main, .page-shell, main *, .page-shell * {
  -webkit-hyphens: none;
  hyphens: none;
  word-break: normal;
  overflow-wrap: break-word;
  text-wrap: pretty;
}

/* ---- 4. Rail: logo + label legibility ---- */
.monogram { width: 72px; height: 72px; }
.monogram img { width: 72px; height: auto; max-height: 72px; object-fit: contain; }
.page-rail > a { width: 72px; height: 72px; display: grid; place-items: center; }
.page-rail img { width: 72px; height: auto; max-height: 72px; object-fit: contain; }
.footer-brand img { width: auto; height: 64px; object-fit: contain; }

.brand-rail nav a { min-height: 52px; color: #fff; font-size: 13px; font-weight: 700; letter-spacing: .08em; }
.page-rail nav a { min-height: 52px; color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .12em; }

/* ---- 5. Services ticker stays visible and moving on tablet + phone ---- */
@media (max-width: 980px) {
  .site-header { height: auto; min-height: 86px; overflow: visible; row-gap: 10px; }
  .header-ticker { display: block; grid-column: 1 / -1; }
}
@media (max-width: 680px) {
  .site-header { height: auto; min-height: 72px; padding: 12px 16px 10px; row-gap: 8px; }
  .header-ticker { display: block; grid-column: 1 / -1; padding: 6px 0; }
  .ticker-track { gap: 22px; padding: 0 14px; font-size: 9px; }
  .hero-copy { padding-top: 128px; }
}
@media (prefers-reduced-motion: reduce) {
  .ticker-track { animation: none; transform: none; }
}

/* ---- 6. Contrast guard: cream panels always carry dark ink ---- */
.page-section:not(.dark), .pull-quote:not(.dark), .cta-band:not(.dark) { color: var(--ink); }
.page-section:not(.dark) :where(h1, h2, h3, h4, p, li, summary, span, small, a, strong, em) { color: inherit; }
.page-section:not(.dark) .manifesto p { color: #3c3c3c; }
.page-section:not(.dark) .content-card .index,
.page-section:not(.dark) .legal .legal-index { color: var(--blue); }

/* ---- 7. Headings stay inside their containers ---- */
.page-hero h1, .page-section h2, .page-section h3 { max-width: 100%; }

@media (max-width: 900px) {
  .page-shell { max-width: 100%; overflow-x: clip; }
  :where(.page-shell) :where(*) { min-width: 0; }
  :where(.page-shell) :where(img, video, iframe, table) { max-width: 100%; height: auto; }
}

@media (max-width: 680px) {
  .page-hero h1 { font-size: clamp(40px, 12.5vw, 88px); }
  .page-section h2 { font-size: clamp(34px, 10.5vw, 76px); }
  .page-section h3, .index-item h3 { font-size: clamp(21px, 5.6vw, 40px); }
  .page-hero p:last-child { font-size: clamp(18px, 4.8vw, 30px); }
  .page-copy .lead, .signal-grid p { font-size: clamp(26px, 7.4vw, 42px); }
  .pull-quote p { font-size: clamp(34px, 10vw, 90px); }
  .cta-band p { font-size: clamp(28px, 8.4vw, 62px); }
  .site-map strong { font-size: clamp(24px, 7vw, 48px); }
  .article .article-deck { font-size: clamp(26px, 7.4vw, 58px); }
  .article h2 { font-size: clamp(28px, 8.4vw, 66px); }
  .article .signpost { padding: 20px; font-size: 24px; }
  .faq-list summary { padding-right: 34px; font-size: clamp(19px, 5.4vw, 30px); }
  .legal h2 { font-size: clamp(26px, 8vw, 56px); }
  .cta-band .cta, .page-shell .cta { display: inline-block; max-width: 100%; }
}

@media (max-width: 400px) {
  .page-hero { padding: 96px 16px 52px; }
  .page-section { padding: 52px 16px 64px; }
  .page-hero h1 { font-size: clamp(32px, 11vw, 88px); }
  .page-section h2 { font-size: clamp(28px, 9vw, 76px); }
  .pull-quote, .cta-band { padding: 52px 16px; }
  .page-footer { padding: 34px 16px 72px; }
  .index-item, .manifesto article { grid-template-columns: 34px 1fr; gap: 14px; }
}

/* ---- 8. No horizontal drift at any width ---- */
html, body { max-width: 100%; overflow-x: clip; }
main, .site-footer, .footer-main, .footer-main > *,
.footer-group, .footer-group nav, .footer-group nav a,
.hero-copy, .hero-message, .story-grid, .role-grid, .clarity-grid,
.start > div, .start-grid, .start-cell { min-width: 0; }
.footer-group nav a, .start-cell a { overflow-wrap: break-word; }

/* ---- 9. 320px header safety ---- */
@media (max-width: 400px) {
  .header-anchor { white-space: normal; line-height: 1.3; }
}

/* ---- 10. Header grid: keep anchor + menu on one row, ticker below ---- */
@media (max-width: 980px) {
  .site-header { grid-template-columns: minmax(0, 1fr) auto; }
  .header-anchor { grid-column: 1; grid-row: 1; }
  .site-header .menu { grid-column: 2; grid-row: 1; }
  .header-ticker { grid-column: 1 / -1; grid-row: 2; }
}
/* Hero line "FRACTURE," must not orphan its comma on narrow phones */
@media (max-width: 430px) {
  .hero h1 { font-size: clamp(46px, 14.6vw, 92px); }
  .hero h1 em { font-size: clamp(40px, 12.4vw, 72px); }
}

/* ---- 11. Headings never break a word mid-word ---- */
main h1, main h2, main h3, main h4, .page-shell h1, .page-shell h2,
.page-shell h3, .page-shell h4, .page-shell summary,
.pull-quote p, .cta-band p, blockquote {
  overflow-wrap: normal;
  word-break: keep-all;
}

/* ---- 12. Internal hero: one column before columns collide ---- */
@media (max-width: 1120px) {
  .page-hero { grid-template-columns: 1fr; gap: 30px; }
  .page-hero p:last-child { margin: 0; }
}

/* Compact footer: reduce height so it reads as a footer, not a page section */
.site-footer { padding: 32px 42px 36px; }
.footer-main { gap: 4vw; padding-bottom: 28px; }
.footer-brand img { width: 84px; height: 84px; }
.footer-brand p { margin-top: 16px; }
.footer-group nav { gap: 10px; }
.footer-bottom { padding-top: 18px; }

@media (max-width: 760px) {
  .site-footer { padding: 28px 18px 40px; }
  .footer-main { gap: 24px; padding-bottom: 24px; }
  .footer-brand img { width: 72px; height: 72px; }
  .footer-brand p { margin-top: 12px; }
}

/* Compact footer on phones: two-column groups so it does not read as a full section */
@media (max-width: 760px) {
  .footer-main { grid-template-columns: 1fr 1fr; gap: 20px 24px; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-brand img { width: 64px; height: 64px; }
  .footer-bottom { gap: 8px; }
}

/* Start section: architectural grid split — bridge row + three-cell action grid */
.start-bridge { margin-top: clamp(26px, 3vw, 36px); }
.start-grid { margin-top: clamp(36px, 4vw, 56px); }
@media (max-width: 1010px) {
  .start-grid { grid-template-columns: 1fr; }
  .start-cell { min-height: 0; gap: 20px; }
  .start-context { flex-direction: row; align-items: baseline; justify-content: flex-start; gap: 18px; flex-wrap: wrap; }
  .start-context-note { max-width: none; }
}
@media (max-width: 430px) {
  .start-cell { padding: 24px 20px; }
  .start-bridge { flex-direction: column; align-items: flex-start; gap: 16px; }
  .start-rule { margin-bottom: 0; }
}

/* Executive advisory card: radar rings graphic (replaces wire sphere) */
.radar-rings {
  width: 88%;
  max-width: 410px;
  overflow: visible;
  fill: none;
  stroke: var(--blue);
  stroke-width: 1.7;
  opacity: .96;
  filter: drop-shadow(0 0 12px rgba(27,39,255,.5));
  transform-origin: center;
  animation: radar-drift 7s ease-in-out infinite alternate;
}
.radar-rings .radar-radial {
  stroke-width: 2.2;
  stroke-dasharray: 6 10;
  transform-origin: 200px 200px;
  animation: radar-sweep 14s linear infinite;
}
.radar-rings .radar-marker {
  fill: var(--blue);
  stroke: none;
  transform-origin: 200px 200px;
  filter: drop-shadow(0 0 15px rgba(27,39,255,.9));
  animation: radar-sweep 14s linear infinite;
}
.radar-rings .radar-core {
  fill: var(--blue);
  stroke: none;
  filter: drop-shadow(0 0 12px rgba(27,39,255,.9));
}
@keyframes radar-sweep { to { transform: rotate(360deg); } }
@keyframes radar-drift {
  from { transform: translate3d(-5px, -7px, 0) rotate(-1.5deg); }
  to { transform: translate3d(5px, 3px, 0) rotate(1.5deg); }
}
@media (prefers-reduced-motion: reduce) {
  .radar-rings, .radar-rings .radar-radial, .radar-rings .radar-marker { animation: none; }
}

/* Engagement graphics: raise them above the bottom text block */
.engagement-art {
  inset: 0 0 auto 0;
  height: min(58%, calc(100% - 270px));
  place-items: start center;
  box-sizing: border-box;
  padding-top: clamp(18px, 2.4vw, 34px);
}

.engagement-art .folded-sheets,
.engagement-art .radar-rings,
.engagement-art .rhythmic-wave {
  position: relative;
  top: -24px;
  margin-top: 0;
}

/* The perspective transform extends beyond the folded-sheets element's
   measured box. Give Evidence its own safe top position so the complete
   stack remains visible while staying well clear of the copy panel. */
.engagement-art.sheets-art {
  padding-top: clamp(96px, 9vw, 118px);
}
.engagement-art .folded-sheets {
  top: 0;
  width: 60%;
  height: 38%;
  transform-origin: 50% 50%;
}

@media (max-width: 680px) {
  .engagement-art .radar-rings { width: 76%; }
}

/* Hero supporting lead uses the same blue as the quote mark */
.hero-lead { color: var(--blue); }

/* ============================================================
   13. INTERNAL PAGES — coordinated layout / contrast repair
   /perspective /work /method /practice
   Root cause of the contrast failures: the app design system
   declares `.dark { --ink: 0 0% 97% }` (an HSL triplet) in
   src/index.css. The approved markup uses `class="page-section dark"`,
   so that rule hijacked --ink on exactly those panels:
   `background:var(--ink)` became invalid (transparent cream) while
   `color:var(--white)` stayed white -> white-on-cream. Vite injects
   index.css as an inline <style> AFTER repair.css, so load order
   cannot be relied on. Doubled class selectors (0,2,0) win on
   specificity instead of order.
   ============================================================ */

.page-shell.page-shell, .page-shell.page-shell *,
.brand-rail.brand-rail, .brand-rail.brand-rail *,
.page-rail.page-rail, .page-rail.page-rail *,
.page-section.page-section, .pull-quote.pull-quote,
.cta-band.cta-band, .page-footer.page-footer, .page-hero.page-hero {
  --blue: #101cff;
  --ink: #080808;
  --paper: #f3f0e8;
  --white: #fff;
  --line: rgba(8, 8, 8, .25);
}

/* Literal fallbacks so the panels are correct even if a future
   global redefines the tokens again. */
.page-section.dark { background: #080808; color: #fff; }
.pull-quote.pull-quote { background: #101cff; color: #fff; }
.cta-band.cta-band { background: #101cff; color: #fff; }
.page-hero.page-hero { background: #080808; color: #fff; }
.page-footer.page-footer { background: #f3f0e8; color: #080808; }
.page-rail.page-rail { background: #101cff; color: #fff; }

/* Every descendant follows its panel's ink, no exceptions. */
.page-section.dark :where(h1,h2,h3,h4,p,li,span,small,a,strong,em,summary,b,i,dt,dd),
.pull-quote.pull-quote :where(p,h2,h3,span,small,a,strong,em),
.cta-band.cta-band :where(p,h2,h3,span,small,strong,em) { color: #fff; }
.page-section.dark .manifesto p { color: #d8d8d8; }
.page-section.dark :where(.index, .roman, .section-label + h2 span, span.index),
.page-section.dark .manifesto .roman { color: #101cff; }
.page-section:not(.dark).page-section :where(h1,h2,h3,h4,p,li,span,small,a,strong,em,summary,b,i) { color: #080808; }
.page-section:not(.dark).page-section :where(.index, .legal-index, .signal-grid span, .function-grid article > span, .step .index, .site-map small, .index-item > span) { color: #101cff; }
.page-section:not(.dark).page-section .manifesto p { color: #3c3c3c; }
.cta-band .cta { background: #fff; color: #080808; }
/* Buttons inside dark panels must keep dark ink on their white plate. */
.page-section.dark .cta, .page-section.dark a.cta { background: #fff; color: #080808; }
.page-section.dark .cta:hover { background: #101cff; color: #fff; }

/* Opaque header tiers so page copy never ghosts through while scrolling. */
.page-utility { background: #080808; }
.page-header.page-header { background: #f3f0e8; backdrop-filter: none; }

/* ---- 13a. Internal hero: contained, balanced, never overlapping ---- */
.page-hero.page-hero {
  min-height: 0;
  align-items: end;
  gap: 6vw;
  padding: clamp(96px, 8vw, 150px) 5vw clamp(64px, 6vw, 104px);
}
.page-hero.page-hero h1 {
  max-width: 16ch;
  font-size: clamp(46px, 5.6vw, 104px);
  line-height: .92;
  letter-spacing: -.04em;
  overflow-wrap: normal;
  word-break: keep-all;
  text-wrap: balance;
}
.page-hero.page-hero > p:last-child {
  max-width: 46ch;
  padding-bottom: .35em;
  font-size: clamp(18px, 1.5vw, 25px);
  line-height: 1.5;
}

@media (max-width: 1120px) {
  .page-hero.page-hero {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 30px;
  }
  .page-hero.page-hero h1 { max-width: 20ch; font-size: clamp(44px, 6.6vw, 78px); }
  .page-hero.page-hero > p:last-child { max-width: 60ch; padding-bottom: 0; margin: 0; }
}
@media (max-width: 680px) {
  .page-hero.page-hero { padding: 96px 18px 52px; }
  .page-hero.page-hero h1 { max-width: none; font-size: clamp(34px, 9.2vw, 58px); }
  .page-hero.page-hero > p:last-child { font-size: clamp(17px, 4.4vw, 21px); }
}
@media (max-width: 400px) {
  .page-hero.page-hero { padding: 88px 16px 46px; }
  .page-hero.page-hero h1 { font-size: clamp(29px, 8.8vw, 40px); }
}

/* ---- 13b. Editorial sections: aligned columns, readable measure ---- */
.page-section.page-section { padding: clamp(56px, 5.4vw, 88px) 5vw clamp(64px, 6vw, 96px); }
.section-grid {
  align-items: start;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(32px, 5vw, 80px);
}
.page-section.page-section h2 {
  max-width: 22ch;
  font-size: clamp(34px, 4.1vw, 74px);
  line-height: .95;
  letter-spacing: -.035em;
  text-wrap: balance;
}
.page-section.page-section h3 { font-size: clamp(21px, 1.9vw, 31px); line-height: 1.12; }
.page-copy { max-width: 66ch; }
.page-copy p, .page-section > p { font-size: clamp(17px, 1.15vw, 20px); line-height: 1.6; }
.page-copy p + p { margin-top: 1.15em; }
.page-copy .lead { max-width: none; font-size: clamp(26px, 2.4vw, 40px); line-height: 1.14; }
.page-section > p { max-width: 62ch; }

@media (max-width: 1120px) {
  .section-grid { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .page-section.page-section h2 { max-width: 24ch; }
  .page-copy, .page-section > p { max-width: 62ch; }
}
@media (max-width: 680px) {
  .page-section.page-section { padding: 52px 18px 60px; }
  .page-section.page-section h2 { max-width: none; font-size: clamp(30px, 8.4vw, 50px); }
  .page-section.page-section h3 { font-size: clamp(19px, 5vw, 26px); }
  .page-copy .lead { font-size: clamp(23px, 6.2vw, 32px); }
}
@media (max-width: 400px) {
  .page-section.page-section { padding: 46px 16px 54px; }
  .page-section.page-section h2 { font-size: clamp(26px, 8vw, 36px); }
}

/* ---- 13c. Grids, steps, cards, credential + sector rows ---- */
.card-grid, .steps, .function-grid, .signal-grid { margin-top: clamp(34px, 4vw, 56px); }
.content-card, .step, .function-grid article, .signal-grid article { padding: clamp(20px, 1.9vw, 30px); }
.content-card { min-height: 0; }
.function-grid article, .signal-grid article { min-height: 0; }
.content-card .index { margin-bottom: clamp(20px, 2.4vw, 40px); }
.step h3 { margin: clamp(20px, 2.6vw, 44px) 0 16px; }
.function-grid h3 { margin: clamp(20px, 2.4vw, 40px) 0 14px; }
.signal-grid h3 { margin: clamp(18px, 2.2vw, 36px) 0 16px; }
.signal-grid p { font-size: clamp(21px, 1.9vw, 30px); line-height: 1.15; }
.content-card p, .function-grid p, .index-item p { font-size: 16px; line-height: 1.5; }
.step p { font-size: 17px; line-height: 1.55; }
.credential-list span, .sector-list span { font-size: clamp(13px, 1vw, 16px); line-height: 1.35; }
.index-item { align-items: start; gap: clamp(16px, 2vw, 28px); }
.index-item h3 { font-size: clamp(20px, 1.8vw, 28px); }

@media (max-width: 1120px) {
  .card-grid { grid-template-columns: repeat(2, 1fr); }
  .function-grid { grid-template-columns: repeat(2, 1fr); }
  /* three-item rows collapse straight to one column: a 2-up grid leaves an
     orphaned third card with an unresolved border. */
  .steps { grid-template-columns: minmax(0, 1fr); }
  .step { border-right: 1px solid currentColor; border-bottom: 0; }
  .step:last-child { border-bottom: 1px solid currentColor; }
}
@media (max-width: 760px) {
  .card-grid, .steps, .function-grid, .signal-grid,
  .credential-list, .sector-list { grid-template-columns: minmax(0, 1fr); }
  .step { border-right: 1px solid currentColor; border-bottom: 0; }
  .step:last-child { border-bottom: 1px solid currentColor; }
  .sector-list span:nth-child(odd) { border-right: 0; padding-right: 0; }
  .sector-list span:nth-child(even) { padding-left: 0; }
}

/* ---- 13d. Pull quotes: readable measure, contained height ---- */
.pull-quote.pull-quote { padding: clamp(52px, 5vw, 78px) 5vw; }
.pull-quote.pull-quote p {
  max-width: 24ch;
  font-size: clamp(30px, 4.4vw, 72px);
  line-height: 1.02;
  text-wrap: balance;
}
@media (max-width: 680px) {
  .pull-quote.pull-quote { padding: 48px 18px; }
  .pull-quote.pull-quote p { max-width: none; font-size: clamp(26px, 7.2vw, 44px); }
}
@media (max-width: 400px) {
  .pull-quote.pull-quote { padding: 42px 16px; }
  .pull-quote.pull-quote p { font-size: clamp(23px, 7vw, 32px); }
}

/* ---- 13e. Founder / portrait block ---- */
.founder { align-items: start; gap: clamp(28px, 5vw, 76px); }
.founder figure { margin: 0; }
.founder img { display: block; width: 100%; height: auto; max-height: 620px; object-fit: cover; }
.founder .page-copy { max-width: 66ch; }
@media (max-width: 1120px) {
  .founder { grid-template-columns: minmax(0, 1fr); }
  .founder img { max-height: 520px; object-position: center 20%; }
}
@media (max-width: 680px) {
  .founder img { max-height: 420px; }
}

/* ---- 13f. Closing CTA band ---- */
.cta-band.cta-band {
  align-items: center;
  gap: clamp(24px, 3vw, 48px);
  padding: clamp(40px, 4vw, 60px) 5vw;
}
.cta-band.cta-band p {
  max-width: 24ch;
  font-size: clamp(26px, 3.2vw, 52px);
  line-height: 1.04;
  text-wrap: balance;
}
.cta-band .cta { flex: 0 0 auto; white-space: nowrap; }
@media (max-width: 900px) {
  .cta-band.cta-band { grid-template-columns: minmax(0, 1fr); justify-items: start; }
}
@media (max-width: 680px) {
  .cta-band.cta-band { padding: 44px 18px; }
  .cta-band.cta-band p { max-width: none; font-size: clamp(24px, 6.6vw, 38px); }
  .cta-band .cta { white-space: normal; min-height: 52px; padding: 12px 18px; gap: 18px; }
}
@media (max-width: 400px) {
  .cta-band.cta-band { padding: 38px 16px; }
  .cta-band.cta-band p { font-size: clamp(21px, 6.4vw, 30px); }
}

/* ---- 13g. Header + rail: one row, legible, no clipping ---- */
.page-header.page-header {
  min-height: 72px;
  flex-wrap: nowrap;
  gap: clamp(14px, 2vw, 28px);
  padding: 12px clamp(18px, 2.6vw, 34px);
  overflow: visible;
  justify-content: flex-end;
}
.page-header.page-header > a { flex: 0 0 auto; white-space: nowrap; }
.page-header.page-header nav { flex: 0 1 auto; gap: clamp(12px, 1.4vw, 22px); }
.page-header.page-header nav a { white-space: nowrap; }
.page-rail.page-rail > a { padding: 8px 0; }
.page-rail.page-rail img { width: 66px; height: 66px; object-fit: contain; }
.page-rail.page-rail nav { margin-top: auto; }
.page-rail.page-rail nav a {
  min-height: 54px; color: #fff; font-size: 12px; font-weight: 700;
  letter-spacing: .12em; text-align: center;
}
.page-rail.page-rail nav a[aria-current="page"] {
  background: var(--ink, #080808);
}
@media (max-width: 1120px) {
  .page-header.page-header nav { gap: 12px; font-size: 9px; }
}
@media (max-width: 900px) {
  .page-header.page-header > a { font-size: 10px; letter-spacing: .12em; }
}

/* ---- 13h. Footer of internal pages ---- */
.page-footer.page-footer { align-items: center; gap: 18px 30px; padding: 30px 5vw 40px; }
.page-footer.page-footer nav { gap: 14px 20px; }
@media (max-width: 680px) {
  .page-footer.page-footer { padding: 28px 18px 44px; }
}

/* ---- 13i. Overflow safety for the internal shell at every width ---- */
.page-shell.page-shell { max-width: 100%; overflow-x: clip; }
.page-shell.page-shell :where(*) { min-width: 0; }
.page-shell.page-shell :where(img, video, iframe, svg) { max-width: 100%; }

/* Heading -> supporting paragraph never sits flush against the baseline */
.page-section > h2 + p, .page-section > h3 + p { margin-top: clamp(16px, 1.6vw, 26px); }
.page-copy > h2 + p, .page-copy > h2 + .lead { margin-top: clamp(14px, 1.4vw, 22px); }
.founder .page-copy > h2 { margin-bottom: 0; }

/* ============================================================
   14. /thinking — ported from the V3 Working Model Thinking page.
   Same structure, order, hierarchy and responsive behaviour;
   typography moved onto the approved font system:
   Glacial (body/UI/labels) + Cormorant (editorial serif).
   ============================================================ */

.tk { --tk-muted: #4a4a4a; background: var(--paper); color: var(--ink); }
.tk-wrap { max-width: 1400px; margin: 0 auto; padding: clamp(40px, 4vw, 72px) 5vw clamp(70px, 7vw, 120px); }
.tk :where(h1, h2, h3, p, li, blockquote) { overflow-wrap: break-word; word-break: normal; hyphens: none; -webkit-hyphens: none; }

.tk-label {
  margin: 0; font-family: var(--core); font-size: 11px; font-weight: 700;
  letter-spacing: .2em; text-transform: uppercase; line-height: 1.5; color: var(--ink);
}
.tk-label-blue { color: var(--blue); }
.tk-label-muted { color: var(--tk-muted); }

.tk-masthead {
  display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); gap: 5vw;
  align-items: end; padding-bottom: clamp(24px, 3vw, 40px); margin-bottom: clamp(30px, 4vw, 56px);
  border-bottom: 2px solid var(--blue);
}
.tk-masthead h1 {
  margin: 0; max-width: 12ch; font-family: var(--core); font-weight: 700; font-style: normal;
  font-size: clamp(64px, 9.2vw, 156px); line-height: .85; letter-spacing: -.055em; text-transform: uppercase;
}
.tk-masthead-right { display: flex; flex-direction: column; gap: 24px; }
.tk-intro {
  max-width: 42ch; margin: 0;
  font-family: var(--editorial); font-weight: 300; font-size: clamp(20px, 1.6vw, 28px);
  line-height: 1.3; color: var(--tk-muted);
}
.tk-index-marker { display: flex; align-items: center; gap: 16px; }
.tk-index-marker .tk-rule { width: 48px; height: 2px; background: var(--blue); margin-bottom: 0; }
.tk-rule { width: 64px; height: 2px; background: var(--blue); margin-bottom: 22px; }

/* Index grid */
.tk-index {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 2px solid var(--blue); border-bottom: 1px solid rgba(8, 8, 8, .2);
  margin-bottom: clamp(48px, 5vw, 80px);
}
.tk-card {
  display: flex; flex-direction: column; padding: clamp(24px, 2.6vw, 48px); color: var(--ink); min-height: 100%;
}
.tk-card:first-child { border-right: 1px solid rgba(8, 8, 8, .2); }
.tk-card-top { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; margin-bottom: clamp(20px, 2.5vw, 36px); }
.tk-card h2 {
  margin: 0 0 clamp(18px, 2vw, 28px); font-family: var(--core); font-weight: 700; font-style: normal;
  font-size: clamp(26px, 2.6vw, 42px); line-height: 1.05; letter-spacing: -.02em; text-transform: uppercase;
}
.tk-card h2 em { font-family: var(--editorial); font-style: italic; font-weight: 400; text-transform: none; }
.tk-figure { position: relative; margin: 0 0 22px; aspect-ratio: 16 / 9; overflow: hidden; background: var(--ink); order: -1; }
.tk-figure img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .7s ease; }
.tk-card:hover .tk-figure img, .tk-card:focus-visible .tk-figure img { transform: scale(1.05); }
.tk-dek {
  flex: 1 0 auto; margin: 0 0 clamp(18px, 2vw, 28px); max-width: 62ch;
  font-family: var(--editorial); font-style: italic; font-weight: 300; font-size: clamp(17px, 1.35vw, 22px);
  line-height: 1.45; color: var(--tk-muted);
}
.tk-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: auto; }
.tk-card-arrow { flex: 0 0 auto; color: var(--blue); transition: transform .25s ease; }
.tk-card:hover .tk-card-arrow, .tk-card:focus-visible .tk-card-arrow, .tk-guide:hover .tk-card-arrow, .tk-guide:focus-visible .tk-card-arrow { transform: translateX(7px); }
.tk-card:hover h2, .tk-card:focus-visible h2, .tk-guide:hover h2, .tk-guide:focus-visible h2 { color: var(--blue); }
.tk-card:focus-visible, .tk-guide:focus-visible, .tk-outline:focus-visible,
.tk-next a:focus-visible, .tk-footnav a:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }

/* Guide card */
.tk-guide {
  display: grid; grid-template-columns: minmax(150px, 2fr) minmax(0, 7fr) minmax(0, 3fr);
  gap: clamp(20px, 2.4vw, 34px); align-items: center; color: var(--ink);
  padding: clamp(24px, 2.6vw, 48px);
  border-top: 2px solid var(--blue); border-bottom: 1px solid rgba(8, 8, 8, .2);
  margin-bottom: clamp(48px, 5vw, 80px);
}
.tk-guide h2 {
  margin: 0 0 14px; font-family: var(--core); font-weight: 700; font-style: normal;
  font-size: clamp(28px, 3.1vw, 50px); line-height: 1.05; letter-spacing: -.02em; text-transform: uppercase;
}
.tk-guide h2 em { font-family: var(--editorial); font-style: italic; font-weight: 400; text-transform: none; }
.tk-guide-tag { display: flex; align-items: center; justify-content: flex-end; gap: 18px; }
.tk-divider { height: 1px; background: var(--blue); margin-bottom: clamp(56px, 6vw, 96px); }

/* Long-form articles */
.tk-article {
  display: grid; grid-template-columns: minmax(160px, 2fr) minmax(0, 9fr);
  gap: clamp(28px, 3vw, 56px); scroll-margin-top: 120px;
  margin-bottom: clamp(90px, 12vw, 190px);
}
.tk-margin-inner { position: sticky; top: 128px; display: grid; gap: 34px; }
.tk-margin-inner > div { display: grid; gap: 6px; }
.tk-margin-value { margin: 0; font-family: var(--editorial); font-weight: 400; font-size: 19px; line-height: 1.3; }
.tk-body { max-width: 74ch; }
.tk-head { position: relative; margin-bottom: clamp(34px, 4vw, 62px); }
.tk-ghost {
  position: absolute; left: -.14em; top: -.32em; z-index: 0;
  font-family: var(--editorial); font-weight: 300; font-size: clamp(140px, 16vw, 220px);
  line-height: 1; color: rgba(16, 28, 255, .07); pointer-events: none; user-select: none;
}
.tk-head p, .tk-head h2 { position: relative; z-index: 1; }
.tk-head p { margin: 0 0 20px; }
.tk-body h2 {
  margin: 0; font-family: var(--core); font-weight: 700; font-style: normal;
  font-size: clamp(22px, 2.4vw, 34px); line-height: 1.12; letter-spacing: -.015em; text-transform: uppercase;
}
.tk-body h2 em.tk-underline { font-family: var(--editorial); font-style: italic; font-weight: 400; text-transform: none; border-bottom: 1px solid var(--blue); padding-bottom: .08em; }
.tk-body h3 {
  margin: clamp(46px, 4.6vw, 72px) 0 18px; font-family: var(--core); font-weight: 700; font-style: normal;
  font-size: clamp(22px, 2.2vw, 36px); line-height: 1.1; letter-spacing: -.01em; text-transform: uppercase;
}
.tk-lede {
  margin: 0 0 34px; padding-left: 24px; border-left: 2px solid var(--blue);
  font-family: var(--editorial); font-weight: 300; font-style: italic;
  font-size: clamp(24px, 2.6vw, 38px); line-height: 1.25;
}
.tk-body > p {
  margin: 0 0 1.5em; font-family: var(--core); font-size: 18px; line-height: 1.75; color: var(--ink);
}
.tk-body > p:last-of-type { margin-bottom: 0; }
.tk-first::first-letter {
  float: left; margin: .06em .12em 0 0; font-family: var(--editorial); font-weight: 300;
  font-size: 5.6em; line-height: .78; color: var(--blue);
}

/* Editorial figure rows */
.tk-stats, .tk-aside-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(26px, 3vw, 44px); align-items: start;
}
.tk-stats { margin: clamp(44px, 4.5vw, 68px) 0; padding: clamp(28px, 3vw, 42px) 0; border-top: 1px solid rgba(8, 8, 8, .14); border-bottom: 1px solid rgba(8, 8, 8, .14); }
.tk-aside-grid { margin: clamp(40px, 4vw, 60px) 0; }
.tk-stat { margin: 0 0 12px; font-family: var(--editorial); font-weight: 300; font-size: clamp(44px, 4.6vw, 68px); line-height: 1; }
.tk-stat span { color: var(--blue); }
.tk-hair { height: 1px; background: rgba(8, 8, 8, .18); margin-bottom: 12px; }
.tk-stat-note, .tk-aside-note {
  margin: 8px 0 0; font-family: var(--core); font-size: 17px; line-height: 1.6; color: var(--tk-muted);
}
.tk-quote {
  margin: 12px 0 0; padding-left: 20px; border-left: 2px solid var(--blue);
  font-family: var(--editorial); font-weight: 300; font-style: italic;
  font-size: clamp(24px, 2.5vw, 36px); line-height: 1.25;
}

.tk-byline {
  margin: clamp(48px, 5vw, 70px) 0 0; padding-top: 20px; border-top: 1px solid rgba(8, 8, 8, .16);
  font-family: var(--core); font-size: 12px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--tk-muted);
}
.tk-references { margin-top: 34px; padding-top: 22px; border-top: 1px solid rgba(8, 8, 8, .16); max-width: 62ch; }
.tk-references ul { margin: 14px 0 0; padding-left: 20px; }
.tk-references li { margin: 0 0 8px; font-family: var(--core); font-size: 14px; line-height: 1.6; color: var(--tk-muted); }
.tk-next {
  display: flex; align-items: baseline; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  margin-top: clamp(56px, 7vw, 110px); padding-top: 22px; border-top: 1px solid var(--ink);
}
.tk-next a { font-family: var(--editorial); font-weight: 400; font-size: clamp(22px, 2.2vw, 32px); line-height: 1.2; }
.tk-next a:hover { color: var(--blue); }
.tk-outline {
  display: inline-flex; align-items: center; margin-top: 30px; padding: 16px 24px;
  border: 1px solid var(--blue); color: var(--blue);
  font-family: var(--core); font-size: 11px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase;
}
.tk-outline:hover { background: var(--blue); color: var(--white); }
.tk-footnav {
  display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap;
  padding-top: 24px; border-top: 1px solid rgba(8, 8, 8, .16);
  font-family: var(--core); font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
}
.tk-footnav a { color: var(--tk-muted); }
.tk-footnav a:hover { color: var(--blue); }
.tk-footnav .tk-footnav-blue { color: var(--blue); }

@media (max-width: 1120px) {
  .tk-index { grid-template-columns: minmax(0, 1fr); }
  .tk-card:first-child { border-right: 0; border-bottom: 1px solid rgba(8, 8, 8, .2); }
  .tk-guide { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .tk-guide-tag { justify-content: flex-start; }
  .tk-article { grid-template-columns: minmax(0, 1fr); }
  .tk-margin-inner { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 30px; }
  .tk-body { max-width: 72ch; }
}
@media (max-width: 780px) {
  .tk-masthead { grid-template-columns: 1fr; align-items: flex-start; gap: 22px; }
  .tk-stats, .tk-aside-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 680px) {
  .tk-wrap { padding: 34px 18px 76px; }
  .tk-masthead h1 { font-size: clamp(36px, 11vw, 60px); max-width: none; }
  .tk-intro { font-size: clamp(20px, 5.6vw, 26px); max-width: none; }
  .tk-margin-inner { grid-template-columns: minmax(0, 1fr); }
  .tk-body h2 { font-size: clamp(19px, 5vw, 26px); }
  .tk-ghost { display: none; }
  .tk-lede, .tk-quote { padding-left: 16px; font-size: clamp(21px, 6vw, 28px); }
  .tk-first::first-letter { font-size: 4.2em; }
}
@media (max-width: 400px) {
  .tk-wrap { padding: 30px 16px 66px; }
  .tk-masthead h1 { font-size: clamp(30px, 10vw, 40px); }
  .tk-card, .tk-guide { padding: 20px 16px; }
  .tk-guide-tag { justify-content: flex-start; }
  .tk-body > p, .tk-dek { font-size: 17px; }
  .tk-body h2 { font-size: clamp(18px, 4.6vw, 24px); }
  .tk-next a { font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .tk-figure img { transition: none; }
}

/* ============================================================
   15. /sitemap — grouped, legible destination cards
   ============================================================ */

.site-map { border-color: currentColor; }
.site-map a {
  min-height: 0; display: flex; flex-direction: column;
  padding: clamp(20px, 2.2vw, 32px); border-color: currentColor;
  transition: background .25s ease, color .25s ease;
}
.site-map strong {
  margin: clamp(16px, 1.8vw, 26px) 0 10px;
  font-size: clamp(24px, 2.4vw, 38px); line-height: 1.05; letter-spacing: -.02em;
  overflow-wrap: break-word; hyphens: none;
}
.site-map span { margin-top: auto; font-size: 16px; line-height: 1.55; }
.site-map a:hover { background: var(--blue); color: var(--white); }
.site-map a:hover small { color: var(--white); }
.site-map a:focus-visible { outline: 3px solid var(--blue); outline-offset: -3px; }
@media (max-width: 1024px) {
  .site-map { grid-template-columns: minmax(0, 1fr); }
}
/* an odd trailing destination card fills the row instead of leaving a bordered gap */
.site-map a:last-child:nth-child(odd) { grid-column: 1 / -1; }

/* ---- Two-tier supporting-page header: slim black utility bar above the cream header ---- */
.page-utility {
  position: sticky;
  top: 0;
  z-index: 30;
  background: #000;
  border-bottom: 1px solid #000;
}
.page-utility nav {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: clamp(14px, 2.2vw, 34px);
  padding: 0 34px;
  min-height: 34px;
}
.page-utility nav a {
  flex: 0 0 auto;
  font-family: var(--core, "Glacial Indifference", system-ui, sans-serif);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
  padding: 10px 0;
  white-space: nowrap;
  transition: color .18s ease;
}
.page-utility nav a:hover,
.page-utility nav a[aria-current="page"] { color: var(--blue, #101cff); }
.page-utility nav a[aria-current="page"] { text-decoration: underline; text-underline-offset: 5px; }
.page-utility nav a:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}
/* main header now docks beneath the utility tier */
.page-header.page-header { top: 34px; }
.page-header .page-menu {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.page-menu-bars {
  display: inline-grid;
  gap: 3px;
}
.page-menu-bars b {
  display: block;
  width: 16px;
  height: 1px;
  background: currentColor;
}

@media (max-width: 900px) {
  .page-utility nav { gap: 16px; padding: 0 18px; }
}
@media (max-width: 720px) {
  .page-utility nav {
    justify-content: flex-start;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 20px;
    min-height: 38px;
  }
  .page-utility nav::-webkit-scrollbar { display: none; }
  .page-utility nav a { font-size: 9px; letter-spacing: .18em; padding: 12px 0; }
  .page-header.page-header { top: 38px; }
}

/* ---- Contact page: V3 discovery structure in the approved THINK NEAR|FAR system ---- */
.ct-open .page-copy p + p { margin-top: 1.15em; }
.ct-open .page-copy .lead { font-family: var(--core); font-style: normal; font-weight: 400; letter-spacing: -.02em; }
.ct-open .page-copy .lead em { font-style: normal; }
.ct-note { font-family: var(--core); font-style: normal; }
.ct-note a { color: var(--blue); text-decoration: underline; text-underline-offset: 4px; }
.ct-split { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr); gap: 7vw; }
.ct-booking p, .ct-details p { font-size: clamp(17px, 1.35vw, 21px); line-height: 1.55; }
.ct-meta {
  font-size: 11px !important;
  font-weight: 700;
  letter-spacing: .16em;
  line-height: 1.9;
  text-transform: uppercase;
  color: var(--ink);
}
.ct-meta a { color: var(--blue); text-decoration: underline; text-underline-offset: 4px; }
.ct-mail {
  display: block;
  margin-bottom: 8px;
  color: var(--blue);
  font-size: clamp(16px, 1.4vw, 21px);
  letter-spacing: .01em;
}
.ct-mail:hover, .ct-mail:focus-visible { text-decoration: underline; text-underline-offset: 5px; }
.ct-button {
  display: inline-flex;
  align-items: center;
  min-height: 52px;
  margin-top: 30px;
  padding: 14px 26px;
  border: 1px solid var(--ink);
  background: var(--ink);
  color: #fff;
  font-family: var(--core);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .18s ease, color .18s ease;
}
.ct-button:hover { background: var(--blue); border-color: var(--blue); color: #fff; }
.ct-button:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.ct-button[disabled] { opacity: .55; cursor: progress; }

.ct-form { max-width: 720px; }
.ct-field { display: grid; gap: 10px; margin-bottom: 30px; }
.ct-field label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--ink);
}
.ct-field input, .ct-field select, .ct-field textarea {
  width: 100%;
  min-height: 52px;
  padding: 14px 16px;
  border: 1px solid var(--ink);
  border-radius: 0;
  background: #fff;
  color: var(--ink);
  font-family: var(--core);
  font-size: 17px;
  line-height: 1.5;
}
.ct-field textarea { min-height: 168px; resize: vertical; }
.ct-field ::placeholder { color: #4a4a4a; opacity: 1; }
.ct-field input:hover, .ct-field select:hover, .ct-field textarea:hover { border-color: var(--blue); }
.ct-field input:focus-visible, .ct-field select:focus-visible, .ct-field textarea:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 2px;
  border-color: var(--blue);
}
.ct-field [aria-invalid="true"] { border-color: #a1000f; box-shadow: inset 0 0 0 1px #a1000f; }
.ct-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; margin-top: 6px; }
.ct-actions .ct-button { margin-top: 0; }
.ct-status:empty { display: none; }
.ct-status { margin: 22px 0 0; }
.ct-success, .ct-error {
  display: block;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.ct-success { color: var(--blue); }
.ct-error { color: #a1000f; margin: 0; }

@media (max-width: 1024px) {
  .ct-split { grid-template-columns: 1fr; gap: 48px; }
}
@media (max-width: 720px) {
  .ct-form { max-width: none; }
  .ct-field { margin-bottom: 26px; }
  .ct-actions { gap: 16px; }
  .ct-button { width: 100%; justify-content: center; }
}
/* keep contact links legible against the shared internal-page link colour */
.page-section:not(.dark).page-section a.ct-button { color: #fff; }
.page-section:not(.dark).page-section a.ct-mail,
.page-section:not(.dark).page-section .ct-meta a,
.page-section:not(.dark).page-section .ct-note a { color: var(--blue); }

/* ================= Shared site footer (all pages) ================= */
/* ================= Shared site footer — architectural modular grid ================= */
.nf-foot {
  background: var(--paper, #f3f0e8);
  color: #080808;
  font-family: var(--core, "Glacial Indifference", Arial, sans-serif);
}
.nf-foot * { box-sizing: border-box; }
.nf-foot-inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: clamp(18px, 2.2vw, 32px) clamp(16px, 2.4vw, 36px);
}
.nf-foot-frame {
  display: flex;
  flex-direction: column;
  border: 1px solid #101cff;
  background: var(--paper, #f3f0e8);
  overflow: hidden;
}
.nf-foot-row {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
  border-bottom: 1px solid #101cff;
}
.nf-foot-row:last-of-type { border-bottom: 0; }
.nf-foot-row-full { grid-template-columns: minmax(0, 1fr); }
.nf-foot-cell {
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 1.1vw, 18px);
  min-width: 0;
  padding: clamp(18px, 1.8vw, 26px);
}
.nf-foot-cell + .nf-foot-cell { border-left: 1px solid #101cff; }
.nf-foot-label {
  margin: 0 0 2px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .25em;
  line-height: 1.2;
  text-transform: uppercase;
}
.nf-foot-label.blue { color: #101cff; }
.nf-foot-label.white { color: #fff; }


/* ---- Contact (cream) ---- */
.nf-foot-contact .nf-foot-mail {
  display: block;
  width: fit-content;
  min-height: 30px;
  font-size: clamp(15px, 1.1vw, 18px);
  font-weight: 700;
  letter-spacing: .04em;
  text-decoration: none;
  color: #080808;
}
.nf-foot-mail + .nf-foot-mail { margin-top: 4px; }
.nf-foot-mail:hover,
.nf-foot-mail:focus-visible { color: #101cff; text-decoration: underline; text-underline-offset: 4px; }
.nf-foot-place {
  margin: 0;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  line-height: 1.5;
  text-transform: uppercase;
  color: rgba(8, 8, 8, .55);
}

/* ---- Dispatch (blue) ---- */
.nf-foot-dispatch {
  background: #101cff;
  color: #fff;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: clamp(24px, 3vw, 48px);
  align-items: start;
}
.nf-dispatch-lead {
  margin: 0;
  font-family: var(--core, "Glacial Indifference", Arial, sans-serif);
  font-size: clamp(18px, 1.4vw, 24px);
  font-style: normal;
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.2;
  color: #fff;
}
.nf-dispatch-freq {
  margin: 10px 0 0;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .7);
}
.nf-dispatch-form label {
  display: block;
  margin-bottom: 8px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .85);
}
.nf-dispatch-field {
  display: flex;
  gap: 0;
}
.nf-dispatch-field input {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, .55);
  border-right: 0;
  border-radius: 0;
  background: transparent;
  color: #fff;
  font-family: inherit;
  font-size: 15px;
}
.nf-dispatch-field input::placeholder { color: rgba(255, 255, 255, .55); }
.nf-dispatch-field input:hover { border-color: #fff; }
.nf-dispatch-field input:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.nf-dispatch-field input[aria-invalid="true"] { border-color: #ff9a9a; }
.nf-dispatch-field button {
  flex: 0 0 auto;
  min-width: 104px;
  min-height: 48px;
  border: 1px solid #080808;
  background: #080808;
  color: #f3f0e8;
  font-family: inherit;
  font-size: 17px;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.nf-dispatch-field button:hover { background: #f3f0e8; color: #080808; border-color: #f3f0e8; }
.nf-dispatch-field button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.nf-dispatch-field button[disabled] { opacity: .6; cursor: progress; }
.nf-dispatch-status {
  margin: 10px 0 0;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  line-height: 1.45;
  text-transform: uppercase;
}
.nf-dispatch-status:empty { display: none; }
.nf-dispatch-status[data-state="done"] { color: #f3f0e8; }
.nf-dispatch-status[data-state="error"] { color: #fff; }
.nf-dispatch-consent {
  margin: 10px 0 0;
  font-size: 10px;
  line-height: 1.6;
  color: rgba(255, 255, 255, .7);
}

/* ---- Connect (cream) ---- */
.nf-foot-connect .nf-foot-social {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 44px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(8, 8, 8, .12);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  text-decoration: none;
  color: #080808;
}
.nf-foot-social:hover,
.nf-foot-social:focus-visible { color: #101cff; border-bottom-color: #101cff; }
.nf-foot-social .nf-external-icon {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: square;
  stroke-linejoin: miter;
}

/* ---- Navigation strip ---- */
.nf-foot-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 14px;
  padding: clamp(8px, 1vw, 12px) clamp(14px, 1.4vw, 20px);
}
.nf-foot-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none;
  color: #4a4a4a;
}
.nf-foot-nav a:hover,
.nf-foot-nav a:focus-visible { color: #101cff; text-decoration: underline; text-underline-offset: 3px; }

/* ---- Legal row ---- */
.nf-foot-legal {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 8px 18px;
  padding: clamp(8px, 1vw, 12px) clamp(14px, 1.4vw, 20px);
  border-top: 1px solid #101cff;
  background: var(--paper, #f3f0e8);
}
.nf-foot-legal p {
  margin: 0;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #080808;
}
.nf-foot-legal a {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
  text-decoration: none;
  color: #101cff;
}
.nf-foot-legal a:hover,
.nf-foot-legal a:focus-visible { text-decoration: underline; text-underline-offset: 4px; }
.nf-foot :focus-visible { outline-offset: 3px; }

/* ---- Responsive: stack modular rows ---- */
@media (max-width: 980px) {
  .nf-foot-row { grid-template-columns: minmax(0, 1fr); }
  .nf-foot-cell + .nf-foot-cell { border-left: 0; border-top: 1px solid #101cff; }
  .nf-foot-dispatch { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 680px) {
  .nf-foot-inner { padding: 12px 10px; }
  .nf-foot-cell { padding: 18px 16px; gap: 14px; }
  .nf-foot-nav { gap: 0 10px; padding: 10px 14px; }
  .nf-foot-legal { padding: 10px 14px; gap: 6px 12px; }
  .nf-dispatch-lead { font-size: clamp(17px, 4.6vw, 21px); }
}

/* ---- Founder section on /practice: contained editorial two columns ---- */
.founder-section .founder {
  display: grid;
  grid-template-columns: minmax(260px, .78fr) minmax(0, 1.22fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: start;
}
.founder-section .founder img {
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  filter: grayscale(1) contrast(1.04);
}
.founder-section .founder figcaption {
  margin-top: 12px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: #080808;
}
.founder-section .page-copy { max-width: 62ch; }
.founder-section .page-copy h2 { margin: 0 0 10px; }
.founder-section .page-copy p { margin: 0 0 1.1em; }
.founder-section .founder-quote {
  margin: 26px 0 0;
  padding-left: 20px;
  border-left: 3px solid #101cff;
  font-family: var(--editorial, "Cormorant Garamond", serif);
  font-size: clamp(1.15rem, 1.8vw, 1.6rem);
  font-style: italic;
  line-height: 1.35;
  color: #080808;
}
@media (max-width: 1024px) {
  .founder-section .founder { grid-template-columns: 1fr; gap: 36px; }
  .founder-section .founder figure { max-width: 460px; }
}
/* footer mount: aligns the shared footer with the page shell beside the rail */
.nf-foot-inset { margin-left: 72px; }
@media (max-width: 900px) { .nf-foot-inset { margin-left: 0; } }
/* founder: balance the portrait against the biography column */
.founder-section .founder { grid-template-columns: minmax(240px, .58fr) minmax(0, 1.42fr); }
.founder-section .founder figure { max-width: 420px; }
.founder-section .founder-quote p {
  margin: 0;
  font-family: var(--editorial, "Cormorant Garamond", serif);
  font-size: clamp(1.2rem, 1.7vw, 1.55rem);
  font-style: italic;
  line-height: 1.35;
}
@media (max-width: 1024px) {
  .founder-section .founder { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .founder-section .founder figure { max-width: min(460px, 100%); }
}
/* ── Our why — the origin · principal's note (supporting page) ───────────── */
.origin-hero { grid-template-columns: minmax(0, 1fr); }
.origin-hero h1 { max-width: 20ch; }
.origin-hero h1 em { font-style: normal; color: #101cff; }
.origin-section { padding-top: 8px; }
.origin-read { max-width: 68ch; }
.origin-read > p {
  margin: 0 0 1.35em;
  font-size: clamp(1rem, 1.05vw, 1.12rem);
  line-height: 1.6;
  color: #080808;
  hyphens: none;
}
.origin-read > p:last-of-type { margin-bottom: 0; }
.origin-read .origin-lead {
  font-family: var(--editorial, "Cormorant Garamond", serif);
  font-style: italic;
  font-size: clamp(1.3rem, 2vw, 1.75rem);
  line-height: 1.35;
  margin-bottom: 1.1em;
}
.origin-read .origin-open::first-letter {
  float: left;
  margin: 0.06em 0.14em 0 0;
  font-family: var(--editorial, "Cormorant Garamond", serif);
  font-size: 3.4em;
  line-height: 0.78;
  font-weight: 500;
  color: #101cff;
}
.origin-quote {
  margin: 2.1em 0;
  padding: 0.2em 0 0.2em 26px;
  border-left: 1px solid #101cff;
}
.origin-quote p {
  margin: 0;
  font-family: var(--editorial, "Cormorant Garamond", serif);
  font-style: italic;
  font-size: clamp(1.2rem, 1.7vw, 1.5rem);
  line-height: 1.4;
  color: #080808;
}
.origin-sign { margin-top: 3rem; }
.origin-rule { display: block; width: 96px; height: 1px; background: rgba(8, 8, 8, 0.22); margin-bottom: 14px; }
.origin-back { margin: 18px 0 0; }
.origin-back a,
.founder-more a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: #101cff;
  text-decoration: none;
  border-bottom: 1px solid rgba(16, 28, 255, 0.4);
}
.origin-back a:hover,
.origin-back a:focus-visible,
.founder-more a:hover,
.founder-more a:focus-visible { border-bottom-color: #101cff; }
.founder-more {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 18px;
  margin: 1.6em 0 0;
}
.founder-more a {
  font-family: var(--core, "Glacial Indifference", sans-serif);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 0.78rem;
}
.founder-more span {
  font-family: var(--core, "Glacial Indifference", sans-serif);
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 0.68rem;
  color: rgba(8, 8, 8, 0.6);
}
@media (max-width: 640px) {
  .origin-read { max-width: 100%; }
  .origin-read .origin-open::first-letter { font-size: 2.8em; }
  .origin-quote { padding-left: 18px; }
}

/* ============================================================
   14. HOMEPAGE REFINEMENTS — rail width, hero colours, menu icon,
   evidence graphic motion, section 05 alignment, footer space.
   ============================================================ */

/* --- 14.1 Wider always-visible left rail (72px -> 108px) --- */
.brand-rail { width: 108px; }
.monogram { width: 108px; height: 108px; }
.monogram img { width: 84px; height: auto; max-height: 84px; object-fit: contain; }
.brand-rail nav a { min-height: 56px; font-size: 14px; letter-spacing: .1em; }
main { margin-left: 108px; }
.site-header { left: 108px; }
.nf-foot-mount:not(.nf-foot-inset) { margin-left: 108px; }
@media (max-width: 680px) {
  main { margin-left: 0; }
  .site-header { left: 0; }
  .nf-foot-mount:not(.nf-foot-inset) { margin-left: 0; }
}

/* --- 14.2 Hero colours: italic line blue, supporting line white --- */
.hero h1 em { color: var(--blue, #101cff); transform: scale(1.04); transform-origin: left center; }

/* Hero headline: uppercase lines in brand black (approved direction) */
.hero h1 { color: var(--ink, #1E201E); }
.hero h1 em { color: var(--blue, #101cff); }
.hero-lead.hero-lead { color: var(--white, #fff); }

/* --- Hero frosted-glass: slightly more opaque so the blue italic line reads cleanly --- */
.hero-message::before {
  background: radial-gradient(ellipse at 45% 50%, rgba(225,225,225,.18) 0%, rgba(225,225,225,.09) 48%, rgba(225,225,225,0) 80%);
  backdrop-filter: blur(5px) brightness(.96);
  -webkit-backdrop-filter: blur(5px) brightness(.96);
}

/* --- 14.3 Menu button: three-line icon instead of "+" --- */
.menu .menu-bars {
  display: inline-grid;
  gap: 4px;
  margin-left: 12px;
}
.menu .menu-bars i {
  display: block;
  width: 20px;
  height: 2px;
  background: currentColor;
}

/* --- 14.4 Evidence graphic: continuous drift, matching the other two --- */
.folded-sheets {
  animation: sheet-drift 11s ease-in-out infinite alternate;
  transition: none;
}
@keyframes sheet-drift {
  from { transform: perspective(900px) rotateX(58deg) rotateZ(-18deg) translate3d(-5px, -7px, 0); }
  to   { transform: perspective(900px) rotateX(52deg) rotateZ(-11deg) translate3d(5px, 3px, 0) scale(1.03); }
}
@media (prefers-reduced-motion: reduce) {
  .folded-sheets { animation: none; }
  .folded-sheets i { animation: none; }
  .rhythmic-wave, .rhythmic-wave .wave-line { animation: none; }
}

/* --- 14.5 Section 05: architectural grid split --- */
.start { padding: 56px 42px 64px; }
.start-bridge p { max-width: 44ch; }
@media (max-width: 980px) {
  .start-bridge p { max-width: none; }
}

/* --- 14.6 (removed — footer rebuilt as modular grid above) --- */

/* Internal pages keep their own 72px rail offset via .page-shell */
.page-shell main { margin-left: 0; }

/* --- 14.7 (removed — footer rebuilt as modular grid above) --- */

/* --- 14.8 Final homepage layout lock ---------------------------------
   These rules close the remaining responsive gaps shown in review:
   artwork/text separation, a genuinely stacked Start panel, and a
   compact footer that always begins after the desktop rail. */
.skip:not(:focus):not(:focus-visible) {
  top: -120px;
  opacity: 0;
  pointer-events: none;
}
.skip:focus, .skip:focus-visible {
  top: 12px;
  opacity: 1;
  pointer-events: auto;
}

.engagement-art {
  height: min(54%, calc(100% - 300px));
}

/* Section 03: one shared, centred upper artwork stage for all three cards. */
.engagement-art,
.engagement-art.sheets-art {
  display: grid;
  place-items: center;
  padding: 0;
  overflow: hidden;
}
.engagement-art .folded-sheets,
.engagement-art .radar-rings,
.engagement-art .rhythmic-wave {
  position: relative;
  top: 0;
  margin: 0;
}
.engagement-art .folded-sheets {
  top: 50px;
  width: min(54%, 220px);
  height: 34%;
  margin-left: -24px;
}
.engagement-art .radar-rings {
  width: min(74%, 290px);
  height: auto;
}
.engagement-art .rhythmic-wave {
  width: 92%;
  height: 54%;
  top: -1px;
}

@media (max-width: 980px) {
  .engagement-art .folded-sheets {
    width: 46%;
    height: 30%;
    margin-left: -18px;
  }
}

@media (max-width: 680px) {
  .engagement-art .folded-sheets {
    width: min(52%, 210px);
    height: 32%;
  }
  .engagement-art .radar-rings { width: min(68%, 270px); }
}

@media (max-width: 1120px) {
  .start-bridge p { max-width: 38ch; }
}

@media (max-width: 680px) {
  .start { padding: 40px 18px 52px; }
  .start h2 {
    font-size: clamp(38px, 11.5vw, 56px);
    line-height: .94;
  }
  .start-bridge p {
    max-width: none;
    font-size: clamp(18px, 5.2vw, 22px);
  }
  .start-cell-title { font-size: 20px; }
}

/* --- 14.9 Header ticker attached to strategic advisory pill ----------
   The scrolling service banner sits directly beside the black anchor pill
   and never stretches to meet the Menu button. Scoped to desktop only so
   smaller breakpoints keep their original grid behaviour. */
@media (min-width: 981px) {
  .site-header {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0;
  }
  .header-anchor { flex: 0 0 auto; }
  .header-ticker {
    flex: 0 0 auto;
    width: clamp(260px, 26vw, 420px);
    border-left: 1px solid rgba(8, 8, 8, .12);
  }
  .menu { margin-left: auto; }
}

@media (max-width: 980px) {
  .header-anchor { max-width: max-content; white-space: nowrap; line-height: 1.25; }
  .header-ticker { display: none; }
}

/* --- 14.10 Supporting-page header + rail corrections -------------------
   The cream header now carries only core sections (the black utility tier
   holds Thinking/Media/FAQ/Contact), so no label is repeated. The rail mark
   also needs breathing room so the wordmark is never clipped. */
.page-rail.page-rail > a { padding: 18px 0 16px; }

/* --- 14.11 Hero CTA buttons align flush with headline text ------------
   Remove the button's left padding so the CTA text starts on the same
   vertical line as the h1 and lead paragraph above it. */
.hero-actions .button { padding-left: 0; }
.page-rail.page-rail > a img { width: 56px; height: 56px; object-fit: contain; }
.page-header nav { display: flex; align-items: center; gap: clamp(14px, 2vw, 30px); flex-wrap: nowrap; }
.page-header nav a[aria-current="page"] { color: #101cff; }
@media (max-width: 900px) {
  .page-header nav { gap: 12px; overflow-x: auto; scrollbar-width: none; }
  .page-header nav::-webkit-scrollbar { display: none; }
  .page-header nav a { white-space: nowrap; }
}

/* --- 15.0 Homepage quote panel: reduce excess height -------------------
   The panel was far taller than its content needed. Trims the block height,
   the oversized quote mark, inner padding and the caption strip while the
   video plate, colours and copy stay exactly as approved. */
.perspective-quote { min-height: 0; }
.perspective-quote .quote-mark { font-size: clamp(200px, 20vw, 300px); }
.perspective-quote .quote-content { padding: clamp(30px, 3.4vw, 46px) 4vw; }
.perspective-quote blockquote { font-family: var(--editorial, "Cormorant Garamond", Georgia, serif); font-style: italic; font-size: clamp(34px, 3.5vw, 56px); line-height: 1.02; }
.perspective-quote .quote-signature { margin-top: clamp(16px, 1.6vw, 22px); }
.perspective-quote figcaption { min-height: 44px; }
@media (max-width: 900px) {
  .perspective-quote .quote-mark { min-height: 0; font-size: 150px; padding: 10px 22px 0; }
  .perspective-quote .quote-content { padding: 22px 22px 26px; }
  .perspective-quote figcaption { min-height: 40px; }
}

/* ============================================================
   16. NAVIGATION SYSTEM — full All Pages layer, directory and
   corrected section numbering.
   ============================================================ */

/* 16.1 Homepage rail: 01–05 stay connected to their own sections. */
#root, #role, #begin, #clarity, #start { scroll-margin-top: 24px; }
.brand-rail nav a.is-active,
.brand-rail nav a[aria-current="location"] {
  background: var(--ink, #080808);
  color: #fff;
  box-shadow: inset 3px 0 0 #fff;
}
.brand-rail nav a:focus-visible,
.page-rail nav a:focus-visible {
  outline: 3px solid #fff;
  outline-offset: -3px;
}

/* 16.2 Full-screen All Pages navigation. */
.nf-menu {
  position: fixed;
  inset: 0;
  z-index: 10000;
  overflow-y: auto;
  background: #080808;
  color: #f3f0e8;
  font-family: var(--core, "Glacial Indifference", Arial, sans-serif);
}
.nf-menu-panel {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  padding: clamp(18px, 3vw, 42px) clamp(18px, 4vw, 64px) clamp(28px, 4vw, 56px);
}
.nf-menu-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: clamp(24px, 3vw, 42px);
  border-bottom: 1px solid rgba(243, 240, 232, .24);
}
.nf-menu-brand {
  display: inline-flex;
  min-width: 64px;
  min-height: 64px;
  align-items: center;
  justify-content: center;
}
.nf-menu-brand img { width: 72px; height: 72px; object-fit: contain; }
.nf-menu-close {
  min-height: 44px;
  padding: 10px 0 10px 22px;
  border: 0;
  background: transparent;
  color: #f3f0e8;
  font-family: var(--core, "Glacial Indifference", Arial, sans-serif);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  cursor: pointer;
}
.nf-menu-close span { margin-left: 10px; font-size: 22px; line-height: 0; }
.nf-menu-close:hover,
.nf-menu-close:focus-visible { color: #101cff; }
.nf-menu-grid {
  flex: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(240px, .8fr) minmax(220px, .55fr);
  gap: clamp(36px, 6vw, 96px);
  align-items: center;
  padding-top: clamp(32px, 5vw, 72px);
}
.nf-menu-label {
  margin: 0 0 clamp(22px, 3vw, 38px);
  color: #101cff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
}
.nf-menu nav { display: grid; gap: 0; }
.nf-menu-journey a {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: baseline;
  column-gap: clamp(12px, 1.5vw, 20px);
  min-height: 52px;
  padding: 4px 0;
  color: #f3f0e8;
  font-family: var(--core, "Glacial Indifference", Arial, sans-serif);
  font-size: clamp(28px, 3.7vw, 58px);
  font-weight: 700;
  line-height: .92;
  letter-spacing: -.055em;
  text-transform: uppercase;
  text-decoration: none;
  transition: color .18s ease, transform .18s ease;
}
.nf-menu-journey a:hover,
.nf-menu-journey a:focus-visible,
.nf-menu-journey a[aria-current="location"] { color: #101cff; transform: translateX(8px); }
.nf-menu-journey a span,
.nf-menu-practice a span {
  flex: 0 0 auto;
  color: #101cff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .18em;
}
.nf-menu-journey a span {
  width: 28px;
  text-align: left;
}
.nf-menu-practice a {
  display: flex;
  align-items: baseline;
  gap: 12px;
  min-height: 44px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(243, 240, 232, .16);
  color: #f3f0e8;
  font-family: var(--core, "Glacial Indifference", Arial, sans-serif);
  font-size: clamp(20px, 2.2vw, 34px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -.025em;
  text-transform: uppercase;
  text-decoration: none;
  transition: color .18s ease, padding-left .18s ease;
}
.nf-menu-practice a:hover,
.nf-menu-practice a:focus-visible,
.nf-menu-practice a[aria-current="page"] { color: #101cff; padding-left: 10px; }
.nf-menu-resources a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 6px 0;
  color: rgba(243, 240, 232, .78);
  font-family: var(--core, "Glacial Indifference", Arial, sans-serif);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-decoration: none;
}
.nf-menu-resources a:hover,
.nf-menu-resources a:focus-visible,
.nf-menu-resources a[aria-current="page"] { color: #101cff; }
.nf-menu a:focus-visible,
.nf-menu button:focus-visible { outline: 2px solid #101cff; outline-offset: 4px; }
@media (max-width: 980px) {
  .nf-menu-grid { grid-template-columns: 1fr 1fr; align-items: start; }
  .nf-menu-journey { grid-column: 1 / -1; }
}
@media (max-width: 680px) {
  .nf-menu-panel { padding: 16px 18px 32px; }
  .nf-menu-grid { display: block; padding-top: 30px; }
  .nf-menu section + section { margin-top: 34px; }
  .nf-menu-journey a { min-height: 48px; font-size: clamp(30px, 11vw, 48px); }
  .nf-menu-practice a { font-size: clamp(19px, 6vw, 27px); }
}
@media (prefers-reduced-motion: no-preference) {
  .nf-menu { animation: nf-menu-in .22s ease-out; }
  .nf-menu-grid > * { animation: nf-menu-rise .45s cubic-bezier(.16, 1, .3, 1) both; }
  .nf-menu-grid > *:nth-child(2) { animation-delay: .04s; }
  .nf-menu-grid > *:nth-child(3) { animation-delay: .08s; }
}
@keyframes nf-menu-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes nf-menu-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

/* 16.3 Dedicated directory treatment. */
.sm-directory {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(32px, 5vw, 72px);
}
.sm-group .section-label {
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(8, 8, 8, .18);
  color: #101cff;
}
.sm-links { display: grid; gap: 24px; }
.sm-links a {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 14px;
  min-height: 44px;
  padding: 2px 0 14px;
  border-bottom: 1px solid rgba(8, 8, 8, .1);
  color: #080808;
  transition: color .18s ease, padding-left .18s ease;
}
.sm-links a:hover,
.sm-links a:focus-visible { color: #101cff; padding-left: 8px; }
.sm-links span {
  grid-row: 1 / 3;
  color: #101cff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
}
.sm-links strong {
  font-family: var(--core, "Glacial Indifference", Arial, sans-serif);
  font-size: clamp(22px, 2.3vw, 36px);
  line-height: 1;
  letter-spacing: -.035em;
  text-transform: uppercase;
}
.sm-links small { font-size: 14px; line-height: 1.45; }
@media (max-width: 1024px) { .sm-directory { grid-template-columns: 1fr 1fr; } }
@media (max-width: 720px) { .sm-directory { grid-template-columns: 1fr; } }

/* 16.4 Contact: one primary route, one secondary route. */
.ct-booking-section { padding-top: 48px; }
.ct-booking-primary {
  display: grid;
  grid-template-columns: minmax(220px, .75fr) minmax(0, 1fr) auto;
  gap: clamp(24px, 4vw, 64px);
  align-items: center;
  padding: clamp(28px, 4vw, 48px);
  border: 1px solid #080808;
  background: #fff;
}
.ct-booking-primary p { margin: 0; }
.ct-booking-primary .ct-button { margin-top: 0; white-space: nowrap; }
.ct-form-section { border-bottom: 0; }
@media (max-width: 1100px) {
  .ct-booking-primary { grid-template-columns: 1fr; align-items: start; }
}

/* 16.5 Approved supporting-page type fallbacks. */
.founder-section .founder-quote,
.founder-section .founder-quote p,
.origin-read .origin-lead,
.origin-quote p { font-family: var(--editorial, "Cormorant Garamond", serif); }
.origin-read .origin-open::first-letter { font-family: var(--editorial, "Cormorant Garamond", serif); }
.founder-more a,
.founder-more span { font-family: var(--core, "Glacial Indifference", Arial, sans-serif); }

/* ---- 11. Role section: tighter image, shorter section ---- */
.role-grid { grid-template-columns: minmax(280px,.7fr) minmax(420px,1.3fr); gap: 5vw; padding-top: 48px; align-items: center; }
.role .founder-frame { max-width: 440px; justify-self: start; }
.role .founder-frame img { max-height: 540px; aspect-ratio: .78; }
@media (max-width: 980px) {
  .role .founder-frame { max-width: 480px; margin-inline: auto; }
  .role .founder-frame img { max-height: 460px; }
}
@media (max-width: 680px) {
  .role-grid { padding-top: 34px; gap: 30px; }
  .role .founder-frame img { max-height: 400px; }
}

/* 16.3 Floating Menu trigger — stays reachable on every page. */
.menu, .page-menu {
  position: fixed;
  z-index: 60;
  top: 21px;
  right: 34px;
  box-shadow: 0 2px 10px rgba(8,8,8,.28);
}
.page-menu { top: 52px; }

@media (max-width: 900px) {
  .menu { top: 16px; right: 16px; }
  .page-menu { top: 50px; right: 18px; }
}

@media (max-width: 480px) {
  .menu { top: 14px; right: 14px; }
  .page-menu { top: 46px; right: 12px; }
}

/* 16.4 Comfortable touch targets on phones — footer navigation, article
   footer links and inline body links inside the Contact note copy. */
@media (max-width: 767px) {
  .nf-foot-nav a,
  .tk-footnav a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
  .tk-footnav {
    row-gap: 4px;
  }
}

@media (max-width: 767px) {
  .nf-foot-legal a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
}