/* ==========================================================================
   London Escorts Hub: base
   Tokens, typography, layout, header, drawer, search, footer, buttons, forms.
   Noir and champagne: near-black canvas, ivory ink, one muted gold.
   ========================================================================== */

:root {
  --leh-bg: #0e0d0b;
  --leh-bg-deep: #080706;
  --leh-raised: #13110e;
  --leh-surface: #191613;
  --leh-surface-2: #211d19;
  --leh-line: rgba(244, 239, 230, 0.08);
  --leh-line-strong: rgba(244, 239, 230, 0.16);

  --leh-ink: #f4efe6;
  --leh-ink-2: #ddd5c8;
  --leh-muted: #aaa194;
  --leh-soft: #8c8478;

  --leh-gold: #c9a86a;
  --leh-gold-bright: #e3c893;
  --leh-gold-deep: #9d7f48;
  --leh-gold-veil: rgba(201, 168, 106, 0.1);
  --leh-gold-line: rgba(201, 168, 106, 0.34);
  --leh-gold-grad: linear-gradient(135deg, #e6cd9b 0%, #c9a86a 45%, #a8864d 100%);

  --leh-live: #8ed3a5;
  --leh-live-veil: rgba(142, 211, 165, 0.14);
  --leh-alert: #e8958a;

  --leh-font-display: "Cormorant Garamond", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --leh-font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --leh-fs-hero: clamp(2.7rem, 5.2vw + 1rem, 5.4rem);
  --leh-fs-h1: clamp(2.2rem, 3.2vw + 1rem, 3.9rem);
  --leh-fs-h2: clamp(1.75rem, 1.9vw + 1rem, 2.7rem);
  --leh-fs-h3: clamp(1.3rem, 0.6vw + 1rem, 1.6rem);
  --leh-fs-lede: clamp(1.05rem, 0.3vw + 1rem, 1.2rem);
  --leh-fs-small: 0.875rem;
  --leh-fs-xs: 0.75rem;

  --leh-radius: 4px;
  --leh-radius-md: 8px;
  --leh-radius-lg: 14px;
  --leh-pill: 999px;

  --leh-wrap: 1320px;
  --leh-wrap-text: 70ch;
  --leh-gutter: clamp(16px, 4vw, 40px);
  --leh-header-h: 68px;

  /* One vertical rhythm for the whole site, so every gap reads the same. */
  --leh-gap-section: clamp(28px, 3.2vw, 44px);  /* half the space between stacked sections */
  --leh-gap-block: clamp(36px, 4vw, 56px);      /* between blocks on a page, and above the footer */
  --leh-gap-head: clamp(18px, 2.2vw, 28px);     /* under a section heading */

  --leh-glass: rgba(14, 13, 11, 0.72);
  --leh-glass-strong: rgba(9, 8, 7, 0.86);
  --leh-blur: blur(16px) saturate(140%);

  --leh-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
  --leh-shadow-soft: 0 10px 30px rgba(0, 0, 0, 0.35);

  --leh-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --leh-fast: 160ms;
  --leh-mid: 320ms;
  --leh-slow: 700ms;

  color-scheme: dark;
}

@media (prefers-reduced-motion: reduce) {
  :root { --leh-fast: 0ms; --leh-mid: 0ms; --leh-slow: 0ms; }
  *, *::before, *::after { scroll-behavior: auto !important; }
}

/* ---- Reset ---------------------------------------------------------------- */

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

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--leh-header-h) + 16px);
  /* The page canvas matches the bottom of the footer. iPhone Safari shows it under its toolbar at the
     end of the page and when the page is pulled past either end; the body paints its own background. */
  background: var(--leh-bg-deep);
}

body.leh {
  margin: 0;
  min-height: 100vh;
  font: 400 1rem/1.65 var(--leh-font-body);
  color: var(--leh-ink-2);
  /* The base colour is an image layer, so the body's background colour stays transparent. WebKit paints
     the area past the ends of the page, and under iPhone Safari's toolbar, with the html and body
     background colours blended (images don't count). A solid body colour made that band #0e0d0b against
     the footer's #080706; now the html canvas colour decides it. */
  background:
    radial-gradient(1100px 520px at 85% -8%, rgba(201, 168, 106, 0.075), transparent 62%),
    radial-gradient(900px 480px at -10% 30%, rgba(201, 168, 106, 0.035), transparent 60%),
    linear-gradient(var(--leh-bg), var(--leh-bg));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

body.leh.is-locked { overflow: hidden; }

/* Astra's scroll-to-top button is switched off in setup.php; this also hides it on any page cached before. */
#ast-scroll-top { display: none !important; }

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

button, input, select, textarea { font: inherit; color: inherit; }

button { cursor: pointer; }

[hidden] { display: none !important; }

::selection { background: var(--leh-gold); color: #120f0a; }
/* A long press on a photo in iPhone Safari selected it, and the gold selection colour washed over
   the picture. Photos, and the badges and hearts sitting on card photos, are never selected; the
   press still opens Safari's link and image menu. */
img, .leh-card__media { -webkit-user-select: none; user-select: none; }
img::selection { background: transparent; }

:focus-visible {
  outline: 2px solid var(--leh-gold-bright);
  outline-offset: 3px;
  border-radius: 2px;
}

/* ---- Typography ----------------------------------------------------------- */

.leh h1, .leh h2, .leh h3, .leh h4 {
  margin: 0 0 0.5em;
  font-family: var(--leh-font-display);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -0.01em;
  color: var(--leh-ink);
}

.leh h1 { font-size: var(--leh-fs-h1); }
.leh h2 { font-size: var(--leh-fs-h2); }
.leh h3 { font-size: var(--leh-fs-h3); }
.leh h4 { font-size: 1.2rem; }

.leh p { margin: 0 0 1.1em; }

.leh a {
  color: var(--leh-gold-bright);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.22em;
  transition: color var(--leh-fast) var(--leh-ease);
}

.leh a:hover { color: var(--leh-ink); }

.leh strong { color: var(--leh-ink); font-weight: 600; }

.leh-eyebrow {
  margin: 0 0 14px;
  font: 600 0.7rem/1.2 var(--leh-font-body);
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--leh-gold);
}

/* Text fills whatever holds it. Narrow reading columns come from the layout
   (text pages, the profile column, cards), never from the text itself. */
/* No text-wrap: pretty or balance anywhere on the site. Safari rebalances every line with them and
   leaves text short of the edge on iPhone; the owner wants text to fill its column. */
.leh-lede {
  font-size: var(--leh-fs-lede);
  line-height: 1.6;
  color: var(--leh-muted);
}

.leh-italic { font-family: var(--leh-font-display); font-style: italic; }

.leh-muted { color: var(--leh-muted); }
.leh-soft { color: var(--leh-soft); }

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

.leh-skip {
  position: absolute; left: 12px; top: -60px; z-index: 1000;
  padding: 10px 16px; border-radius: var(--leh-radius);
  background: var(--leh-gold); color: #120f0a !important; font-weight: 600;
}
.leh-skip:focus { top: 12px; }

/* ---- Layout --------------------------------------------------------------- */

.leh-main { display: block; outline: none; }

.leh-wrap {
  width: 100%;
  max-width: var(--leh-wrap);
  margin-inline: auto;
  padding-inline: var(--leh-gutter);
}

.leh-wrap--text { max-width: calc(var(--leh-wrap-text) + var(--leh-gutter) * 2); }

.leh-section { padding-block: var(--leh-gap-section); }
.leh-main > .leh-section:last-child:not(.leh-section--band) { padding-bottom: 0; }
.leh-section--tight { padding-block: clamp(20px, 2.4vw, 32px); }
.leh-section--flush-top { padding-top: 0; }
.leh-section--band {
  background: linear-gradient(180deg, var(--leh-raised), var(--leh-bg));
  border-block: 1px solid var(--leh-line);
}

/* A gap, not child margins: components like chips reset their own margin. */
.leh-stack { display: grid; align-content: start; gap: var(--leh-stack, 16px); }
.leh .leh-stack__label { margin: 8px 0 -6px; font: 600 0.64rem/1.2 var(--leh-font-body); letter-spacing: 0.2em; text-transform: uppercase; color: var(--leh-soft); }
.leh .leh-stack__label:first-child { margin-top: 0; }

.leh-rule {
  display: flex; align-items: center; gap: 14px;
  margin: 0; border: 0; color: var(--leh-gold-deep);
}
.leh-rule::before, .leh-rule::after {
  content: ""; flex: 1; height: 1px;
  background: linear-gradient(90deg, transparent, var(--leh-gold-line), transparent);
}

.leh-icon { width: 20px; height: 20px; flex: none; }

/* ---- Buttons -------------------------------------------------------------- */

.leh-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 0 24px;
  border: 1px solid var(--leh-line-strong);
  border-radius: var(--leh-pill);
  background: transparent;
  color: var(--leh-ink) !important;
  font: 600 0.76rem/1 var(--leh-font-body);
  letter-spacing: 0.16em; text-transform: uppercase;
  text-decoration: none !important;
  white-space: nowrap;
  transition: background var(--leh-mid) var(--leh-ease), border-color var(--leh-mid) var(--leh-ease),
    color var(--leh-mid) var(--leh-ease), transform var(--leh-fast) var(--leh-ease);
}
.leh-btn:hover { border-color: var(--leh-gold-line); background: var(--leh-gold-veil); }
.leh-btn:active { transform: translateY(1px); }
.leh-btn .leh-icon { width: 18px; height: 18px; }

.leh-btn--gold {
  border-color: transparent;
  background: var(--leh-gold-grad);
  color: #15110a !important;
  box-shadow: 0 8px 26px rgba(201, 168, 106, 0.18);
}
.leh-btn--gold:hover { background: var(--leh-gold-grad); filter: brightness(1.06); border-color: transparent; }

.leh-btn--ghost { background: rgba(244, 239, 230, 0.02); }
.leh-btn--small { min-height: 38px; padding: 0 16px; font-size: 0.7rem; }
.leh-btn--block { width: 100%; }

.leh-iconbtn {
  position: relative;
  display: inline-grid; place-items: center;
  width: 42px; height: 42px; padding: 0;
  border: 1px solid transparent; border-radius: var(--leh-pill);
  background: transparent; color: var(--leh-ink) !important;
  transition: background var(--leh-fast) var(--leh-ease), border-color var(--leh-fast) var(--leh-ease);
}
.leh-iconbtn:hover { background: rgba(244, 239, 230, 0.06); border-color: var(--leh-line); }

.leh-count {
  position: absolute; top: 3px; right: 2px;
  min-width: 17px; height: 17px; padding: 0 4px;
  border-radius: var(--leh-pill);
  background: var(--leh-gold); color: #15110a;
  font: 700 0.62rem/17px var(--leh-font-body); text-align: center;
}

/* ---- Forms ---------------------------------------------------------------- */

.leh-field { display: grid; gap: 8px; }

.leh-label {
  font: 600 0.7rem/1.2 var(--leh-font-body);
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--leh-soft);
}

.leh-input, .leh-select, .leh-textarea {
  width: 100%; min-height: 50px; padding: 12px 16px;
  border: 1px solid var(--leh-line-strong); border-radius: var(--leh-radius-md);
  background-color: rgba(244, 239, 230, 0.03); color: var(--leh-ink);
  transition: border-color var(--leh-fast) var(--leh-ease), background-color var(--leh-fast) var(--leh-ease);
}
.leh-input::placeholder, .leh-textarea::placeholder { color: var(--leh-soft); }
/* Colour only: the background shorthand would also reset a select's arrow, which then slid back in on blur. */
.leh-input:focus, .leh-select:focus, .leh-textarea:focus {
  outline: none; border-color: var(--leh-gold-line); background-color: rgba(244, 239, 230, 0.05);
}
.leh-select {
  appearance: none; -webkit-appearance: none; padding-right: 44px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c9a86a' stroke-width='1.6'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center; background-size: 18px;
}
.leh-select option { background: var(--leh-surface); color: var(--leh-ink); }
.leh-textarea { min-height: 140px; resize: vertical; }

/* ---- Header --------------------------------------------------------------- */

.leh-header {
  position: sticky; top: 0; z-index: 60;
  /* Near solid rather than a live blur: a blur behind a sticky bar is redrawn
     on every scroll frame, which made scrolling stutter on desktops and jitter
     on iPhones. On this dark page the two look the same. */
  background: rgba(12, 11, 9, 0.95);
  border-bottom: 1px solid var(--leh-line);
}

.admin-bar .leh-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .leh-header { top: 0; } }

.leh-header__inner {
  display: flex; align-items: center; gap: 24px;
  height: var(--leh-header-h);
}

.leh-brand {
  display: inline-flex; align-items: center; gap: 12px;
  color: var(--leh-ink) !important; text-decoration: none !important;
  flex: none;
}
.leh-brand__mark { width: 46px; height: 46px; color: var(--leh-gold); }
.leh-brand__mark svg { width: 100%; height: 100%; }
.leh-brand__text { display: grid; line-height: 1; }
.leh-brand__top {
  font: 600 0.66rem/1 var(--leh-font-body);
  letter-spacing: 0.42em; text-transform: uppercase; color: var(--leh-gold);
  margin-bottom: 6px;
}
.leh-brand__name {
  font: 500 1.74rem/1 var(--leh-font-display);
  letter-spacing: 0.01em; color: var(--leh-ink);
}

.leh-nav { margin-left: auto; display: none; }
.leh-nav__list { display: flex; gap: 6px; margin: 0; padding: 0; list-style: none; }
/* Links and the menu buttons (Locations, Services) look the same. */
.leh-nav__link {
  position: relative; display: block; margin: 0; padding: 10px 14px;
  border: 0; background: none; -webkit-appearance: none; appearance: none; cursor: pointer;
  color: var(--leh-ink-2) !important; text-decoration: none !important;
  font: 500 1rem/1 var(--leh-font-body); letter-spacing: 0.01em;
}
.leh-nav__link::after {
  content: ""; position: absolute; left: 14px; right: 14px; bottom: 4px; height: 1px;
  background: var(--leh-gold); transform: scaleX(0); transform-origin: left;
  transition: transform var(--leh-mid) var(--leh-ease);
}
.leh-nav__link:hover, .leh-nav__link.is-current { color: var(--leh-ink) !important; }
.leh-nav__link:hover::after, .leh-nav__link.is-current::after { transform: scaleX(1); }

/* Dropdowns on desktop: a short list under Locations and Services, opened by hover or keyboard focus. */
.leh-nav__item { position: relative; }
.leh-nav__caret { display: inline-block; width: 12px; height: 12px; margin-left: 5px; vertical-align: 1px; color: var(--leh-soft); transform: rotate(90deg); transition: transform var(--leh-fast) var(--leh-ease), color var(--leh-fast) var(--leh-ease); }
.leh-dropdown {
  position: absolute; top: calc(100% + 8px); left: 0; z-index: 70;
  width: 272px; padding: 8px;
  border: 1px solid var(--leh-line-strong); border-radius: 18px;
  background: var(--leh-surface); box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25), 0 24px 48px rgba(0, 0, 0, 0.5);
  opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity var(--leh-mid) var(--leh-ease), transform var(--leh-mid) var(--leh-ease), visibility 0s linear var(--leh-mid);
}
/* A bridge over the gap, so the pointer can travel from the link to the list. */
.leh-dropdown::before { content: ""; position: absolute; top: -12px; right: 0; left: 0; height: 12px; }
.leh-nav__item.has-menu:not(.is-closed):hover .leh-dropdown,
.leh-nav__item.has-menu:not(.is-closed):focus-within .leh-dropdown { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.leh-nav__item.has-menu:not(.is-closed):hover .leh-nav__caret,
.leh-nav__item.has-menu:not(.is-closed):focus-within .leh-nav__caret { color: var(--leh-gold); transform: rotate(-90deg); }
.leh-dropdown__list { margin: 0; padding: 0; list-style: none; }
.leh-dropdown__list a {
  display: block; padding: 10px 14px; border-radius: 10px;
  color: var(--leh-ink-2) !important; font: 500 0.86rem/1.4 var(--leh-font-body); text-decoration: none !important;
  transition: background-color var(--leh-fast) var(--leh-ease), color var(--leh-fast) var(--leh-ease);
}
.leh-dropdown__list a:hover, .leh-dropdown__list a:focus-visible { background-color: rgba(244, 239, 230, 0.05); color: var(--leh-ink) !important; }
.leh-dropdown__all { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--leh-line); }
.leh-dropdown__all a { color: var(--leh-gold-bright) !important; font-weight: 600; }

.leh-header__actions { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.leh-header__cta { display: none; margin-left: 8px; }
/* The menu and close icons, a touch larger than the other header icons. */
.leh-header__menu .leh-icon, .leh-drawer__top .leh-iconbtn .leh-icon { width: 24px; height: 24px; }

@media (min-width: 1024px) {
  .leh-nav { display: block; }
  .leh-header__actions { margin-left: 12px; }
  .leh-header__cta { display: inline-flex; }
  .leh-header__menu { display: none; }
}

/* ---- Drawer --------------------------------------------------------------- */

.leh-drawer {
  position: fixed; inset: 0; z-index: 90;
  background: rgba(5, 4, 3, 0.6);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  animation: leh-fade var(--leh-mid) var(--leh-ease);
}
.leh-drawer__panel {
  position: absolute; inset: 0 0 0 auto;
  width: min(420px, 100%);
  display: flex; flex-direction: column; gap: 28px;
  padding: 18px var(--leh-gutter) calc(28px + env(safe-area-inset-bottom));
  background: linear-gradient(180deg, var(--leh-raised), var(--leh-bg-deep));
  overflow-y: auto;
  animation: leh-drawer-in var(--leh-mid) var(--leh-ease);
}
/* On phones the panel fills the screen, so an edge line would only read as a gap. */
@media (min-width: 421px) { .leh-drawer__panel { border-left: 1px solid var(--leh-line); } }
/* Closing: the panel slides back out to the right while the dimmed page clears (core.js adds the class). */
.leh-drawer.is-closing {
  background-color: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; pointer-events: none;
  transition: background-color var(--leh-mid) var(--leh-ease);
}
.leh-drawer.is-closing .leh-drawer__panel { animation: leh-drawer-out var(--leh-mid) var(--leh-ease) forwards; }
@keyframes leh-drawer-in { from { transform: translateX(100%); } to { transform: none; } }
@keyframes leh-drawer-out { from { transform: none; } to { transform: translateX(100%); } }
.leh-drawer__top { display: flex; align-items: center; justify-content: space-between; }
.leh-drawer__top .leh-eyebrow { margin: 0; }
.leh-drawer__nav { display: grid; }
.leh-drawer__nav > a, .leh-drawer__group > summary {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 0; border-bottom: 1px solid var(--leh-line);
  font: 500 1.9rem/1.1 var(--leh-font-display);
  color: var(--leh-ink) !important; text-decoration: none !important;
}
.leh-drawer__nav > a .leh-icon, .leh-drawer__group > summary .leh-icon { color: var(--leh-gold); width: 18px; }
.leh-drawer__quick { display: flex; flex-wrap: wrap; gap: 8px; }
.leh-drawer__foot { margin-top: auto; display: grid; gap: 14px; }
.leh-drawer__note { margin: 0; font-size: var(--leh-fs-small); color: var(--leh-soft); }

/* Submenus in the drawer open in place. */
.leh-drawer__panel { overflow-y: auto; overscroll-behavior: contain; }
.leh-drawer__group > summary { list-style: none; cursor: pointer; }
.leh-drawer__group > summary::-webkit-details-marker { display: none; }
.leh-drawer__group > summary .leh-icon { transform: rotate(90deg); transition: transform var(--leh-fast) var(--leh-ease); }
.leh-drawer__group[open] > summary { border-bottom-color: transparent; }
.leh-drawer__group[open] > summary .leh-icon { transform: rotate(-90deg); }
.leh-drawer__sub { padding: 4px 0 18px; border-bottom: 1px solid var(--leh-line); }
.leh-drawer__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; margin: 0; padding: 0; list-style: none; }
.leh-drawer__links a { display: block; padding: 8px 0; color: var(--leh-ink-2) !important; font-size: 1rem; text-decoration: none !important; }
.leh-drawer__all {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 14px;
  color: var(--leh-gold-bright) !important; font: 600 0.7rem/1 var(--leh-font-body); letter-spacing: 0.16em; text-transform: uppercase; text-decoration: none !important;
}
.leh-drawer__all .leh-icon { width: 14px; height: 14px; }

@keyframes leh-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes leh-slide-in { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes leh-rise { from { transform: translateY(14px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ---- Search overlay ------------------------------------------------------- */

.leh-search {
  position: fixed; inset: 0; z-index: 95;
  background: var(--leh-glass-strong);
  -webkit-backdrop-filter: var(--leh-blur); backdrop-filter: var(--leh-blur);
  overflow-y: auto;
  animation: leh-fade var(--leh-mid) var(--leh-ease);
}
.leh-search__panel { padding-top: clamp(20px, 8vh, 90px); padding-bottom: 60px; max-width: 860px; }
.leh-search__form {
  display: flex; align-items: center; gap: 14px;
  padding: 6px 6px 6px 22px;
  border: 1px solid var(--leh-gold-line); border-radius: var(--leh-pill);
  background: rgba(244, 239, 230, 0.04);
}
.leh-search__form > .leh-icon { color: var(--leh-gold); width: 22px; height: 22px; }
.leh-search__input {
  flex: 1; min-width: 0; height: 58px;
  border: 0; background: transparent; color: var(--leh-ink);
  font: 400 clamp(1.2rem, 2.4vw, 1.6rem)/1 var(--leh-font-display);
}
.leh-search__input:focus { outline: none; }
.leh-search__input::-webkit-search-cancel-button { display: none; }
.leh-search__results { margin-top: 26px; display: grid; gap: 4px; }
.leh-search__group { margin: 18px 0 6px; }
.leh-search__result {
  display: flex; align-items: center; gap: 14px;
  padding: 10px 12px; border-radius: var(--leh-radius-md);
  color: var(--leh-ink) !important; text-decoration: none !important;
  animation: leh-rise var(--leh-mid) var(--leh-ease) both;
}
.leh-search__result:hover, .leh-search__result.is-active { background: rgba(244, 239, 230, 0.06); }
.leh-search__thumb {
  width: 40px; height: 56px; flex: none; border-radius: 3px; object-fit: cover;
  background: var(--leh-surface-2);
}
.leh-search__text { display: grid; gap: 3px; min-width: 0; }
.leh-search__name { font: 500 1.25rem/1.1 var(--leh-font-display); }
.leh-search__meta { font-size: 0.78rem; color: var(--leh-muted); }
.leh-search__kind { margin-left: auto; font-size: var(--leh-fs-xs); color: var(--leh-soft); letter-spacing: 0.08em; }
.leh-search__empty { margin-top: 26px; color: var(--leh-muted); }
.leh-search__hints { margin-top: 30px; }
.leh-search__hints .leh-chips { margin-top: 10px; }

/* ---- Breadcrumbs ---------------------------------------------------------- */

.leh-crumbs { margin: 0 0 18px; overflow-x: auto; scrollbar-width: none; }
.leh-crumbs::-webkit-scrollbar { display: none; }
.leh-crumbs__list {
  display: flex; align-items: center; margin: 0; padding: 0; list-style: none;
  font-size: var(--leh-fs-xs); letter-spacing: 0.06em; white-space: nowrap;
}
.leh-crumbs__item { display: inline-flex; align-items: center; color: var(--leh-soft); }
.leh-crumbs__item + .leh-crumbs__item::before { content: "/"; margin: 0 10px; color: var(--leh-gold-deep); }
.leh-crumbs a { color: var(--leh-muted) !important; text-decoration: none; }
.leh-crumbs a:hover { color: var(--leh-gold-bright) !important; }
.leh-crumbs [aria-current] { color: var(--leh-ink-2); }

/* ---- Section heads -------------------------------------------------------- */

.leh-section-head {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 20px;
  margin-bottom: var(--leh-gap-head);
}
.leh-section-head__text { flex: 1 1 auto; min-width: 0; }
.leh-section-head__title { margin: 0 !important; }
.leh-section-head__intro { margin: 12px 0 0; color: var(--leh-muted); }
.leh-section-head__link {
  display: inline-flex; align-items: center; gap: 8px; flex: none;
  font: 600 0.72rem/1 var(--leh-font-body); letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--leh-gold) !important; text-decoration: none !important;
  padding-bottom: 6px;
}
.leh-section-head__link .leh-icon { width: 16px; height: 16px; transition: transform var(--leh-mid) var(--leh-ease); }
.leh-section-head__link:hover .leh-icon { transform: translateX(4px); }

@media (max-width: 599px) {
  .leh-section-head { align-items: flex-start; flex-direction: column; gap: 12px; }
}

/* ---- Prose ---------------------------------------------------------------- */

.leh-prose { color: var(--leh-ink-2); font-size: 1.04rem; line-height: 1.8; }
.leh-prose > * + * { margin-top: 1.1em; }
.leh-prose h2 { margin-top: 1.8em; font-size: clamp(1.6rem, 1.4vw + 1rem, 2.2rem); }
.leh-prose h3 { margin-top: 1.5em; }
.leh-prose ul, .leh-prose ol { padding-left: 1.2em; }
.leh-prose li + li { margin-top: 0.4em; }
.leh-prose li::marker { color: var(--leh-gold); }
.leh-prose blockquote {
  margin: 1.6em 0; padding: 4px 0 4px 22px; border-left: 1px solid var(--leh-gold);
  font: italic 500 1.45rem/1.45 var(--leh-font-display); color: var(--leh-ink);
}
.leh-prose img { border-radius: var(--leh-radius-md); }
.leh-prose table { width: 100%; border-collapse: collapse; }
.leh-prose th, .leh-prose td { padding: 10px 12px; border-bottom: 1px solid var(--leh-line); text-align: left; }

/* ---- Footer --------------------------------------------------------------- */

.leh-footer {
  margin-top: var(--leh-gap-block);
  padding: var(--leh-gap-block) 0 calc(28px + env(safe-area-inset-bottom));
  background: linear-gradient(180deg, var(--leh-bg), var(--leh-bg-deep));
  border-top: 1px solid var(--leh-line);
  position: relative;
}
.leh-footer::before {
  content: ""; position: absolute; left: 50%; top: -1px; width: min(560px, 80%); height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, var(--leh-gold), transparent);
}
.leh-footer__top { display: grid; gap: 40px; }
/* No ch cap: the blurb fills its column like every other text on the site (88% fill on iPhone with one). */
.leh-footer__about { color: var(--leh-muted); font-size: var(--leh-fs-small); }
.leh-footer__about p { margin-top: 18px; }
.leh-footer__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 24px; }
.leh-footer__title {
  margin: 0 0 14px !important;
  font: 600 0.84rem/1.2 var(--leh-font-body) !important;
  letter-spacing: 0.22em; text-transform: uppercase; color: var(--leh-gold) !important;
}
.leh-footer__list { margin: 0; padding: 0; list-style: none; display: grid; gap: 9px; }
.leh-footer__list a { color: var(--leh-ink-2) !important; text-decoration: none; font-size: 0.92rem; }
.leh-footer__list a:hover { color: var(--leh-gold-bright) !important; }
.leh-footer__legal {
  margin-top: 44px; padding-top: 24px; border-top: 1px solid var(--leh-line);
  display: grid; gap: 8px; font-size: var(--leh-fs-xs); color: var(--leh-soft); line-height: 1.6;
}
.leh-footer__legal p { margin: 0; }
.leh-footer__legal a { color: var(--leh-muted) !important; }

@media (min-width: 900px) {
  .leh-footer__top { grid-template-columns: minmax(260px, 1fr) 2.4fr; gap: 64px; }
  .leh-footer__cols { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ---- Page head ------------------------------------------------------------ */

.leh-pagehead { padding: clamp(22px, 3.2vw, 40px) 0 clamp(20px, 2.4vw, 32px); }
.leh-pagehead__title { margin: 0 0 14px !important; }
.leh-pagehead__lede { margin: 0; }
.leh-pagehead__facts {
  display: flex; flex-wrap: wrap; gap: 10px 22px; margin: 22px 0 0; padding: 0; list-style: none;
  font-size: var(--leh-fs-small); color: var(--leh-muted);
}
.leh-pagehead__facts li { display: inline-flex; align-items: center; gap: 8px; }
.leh-pagehead__facts .leh-icon { width: 17px; height: 17px; color: var(--leh-gold); }
.leh-pagehead__facts strong { color: var(--leh-ink); font-weight: 600; }