/* ==========================================================================
   rx15 PALETTE — "ink, stone and red", 20 August 2026.

   Aarav: "the blue, the light, the white, the golden... I don't like those
   colours, they look super AI, they don't look real."

   Every one of those four is gone from this page:
     - navy #0d1d31        -> warm near-black ink #24211e
     - cool light ground   -> warm stone #e9e5dc / #e3ded4
     - bright cream #fbf8f2-> warm paper #f5f2eb
     - gold #c5a66a        -> bone #d9d2c4 (NO gold token survives)
   Fields are stone #e7e2d8, oat #eae4d8 and sand #ded5c5. The single chroma
   on the page is the Assistant's OWN red #8e2938 (the launcher value), with
   #6f1f2b beneath it. Focus rings are terracotta #c2543c, mid-luminance so
   they read on both the ink surfaces and the stone ones.

   Warm neutrals plus one real red is a printed-matter palette, not a
   template one: that is the whole point of the change.
   ========================================================================== */

/* ==========================================================================
   Dukes Assistant — /receptionist/, 20 August 2026 (rx7 full redesign).

   Aarav's brief: not good enough against /, /sales/, /sales/sellers-guide/,
   /sales/selling-process/, /epc/, /properties/tenant-guide/ and
   /properties/tenant-fees/ — remove the current images and completely
   redesign it. So rx7 is the PHOTOGRAPHY-FREE build: the page must look
   FINISHED with zero images, the way /properties/tenant-fees/ does — worked
   documents, huge proof type, tinted trios and ledgers, never an empty
   parchment box waiting for art.

   Island grammar of the 20 Aug family: rounded islands floating on the cool
   gradient ground, cream plates on tinted fields, one radius regime
   (island 30 / plate 22 / small 14), navy-tinted shadows, Gloock statements,
   Manrope everything else.

   THIS PAGE'S PAIRING (Design Authority §3 — own palette, one family):
   midnight & brass, "the writing desk". Colour jobs:
     - midnight #24211e  = decisive bands: the hero and the honesty island;
     - warm paper        = the how-it-works island;
     - fog #e7e2d8       = the routes island field (this page's own tint);
     - linen #ded5c5     = the direct-contact island field;
     - cream #f5f2eb     = plates only, the one white token;
     - oxblood #8e2938   = actions and kickers on light grounds, nothing else;
     - gold #d9d2c4      = identity accent on midnight only, never on light.

   Devices this page owns (novelty mandate, rx7):
     1. the EXCHANGE SPECIMEN — a worked line of the conversation resolving
        into the sealed summary docket (the page's ONE seal moment);
     2. the SWITCHBOARD — the six routes as registry rows, each printing the
        real questions it asks as chips (truthful, from the builder itself);
     3. the ZERO RAIL — three Gloock zeros under the honesty ledger
        (0 marketing lists · 0 guessed answers · 0 automatic sends).

   Hooks that must not change (JS contracts):
     [data-hxnav] + [data-hxnav-link] + [data-hxo]   → home-section-nav.mjs
     [data-rx-section] + ids                          → anchor scroll offsets
     data-journey links                               → dukes-chat interceptor
     .rxm-armed/.is-in + --wx/--wy                    → receptionist-motion.mjs
   (The rx4 rotator is RETIRED with the photography — receptionist-rotator.mjs
   no longer loads on this page.)
   ========================================================================== */

.page--receptionist {
  /* ink */
  --rx-ink: #24211e;
  --rx-ink-soft: #57514a;
  /* island-tinted plates — the one white (cream) is reserved for the two
     premium moments: the sealed docket and the IS card. Everything else
     pulls toward ITS island's colour (the buyers-guide verdict: never the
     same white boxes all the way down). */
  --rx-plate-paper: #f2ece0;
  --rx-plate-fog: #ebe6dc;
  --rx-plate-linen: #f1e9db;
  /* midnight — dark anchor: hero + honesty islands */
  --rx-night: #24211e;
  --rx-night-lift: #35302b;
  /* the one premium white — plates only */
  --rx-cream: #f5f2eb;
  /* warm paper — the how-it-works island */
  --rx-paper: #eae4d8;
  /* supporting fields, cool then warm */
  --rx-field-fog: #e7e2d8;
  --rx-field-linen: #ded5c5;
  /* oxblood — actions and kickers on light. Nothing else. */
  --rx-oxblood: #8e2938;
  --rx-oxblood-dark: #6f1f2b;
  /* gold — identity accent on midnight only */
  --rx-gold: #d9d2c4;
  /* rules */
  --rx-rule: rgb(36 33 30 / 18%);
  --rx-rule-dark: rgb(245 242 235 / 22%);
  /* geometry */
  --rx-shell: min(94vw, 1640px);
  --rx-radius-island: 30px;
  --rx-radius-plate: 22px;
  --rx-radius-small: 14px;
  --rx-tap: 48px;
  --rx-ease: cubic-bezier(0.22, 1, 0.36, 1);
  /* the site island ground */
  background: linear-gradient(180deg, #e9e5dc 0%, #e3ded4 30%, #e3ded4 100%);
  color: var(--rx-ink);
}

.page--receptionist ::selection {
  background: var(--rx-gold);
  color: var(--rx-night);
}

/* One focus ring for the whole page. */
.page--receptionist :where(a, button, input, select, summary):focus-visible {
  outline: 3px solid #c2543c;
  outline-offset: 4px;
}

.page--receptionist .main {
  background: transparent;
  padding-top: 0;
  padding-bottom: clamp(1.5rem, 3vw, 2.5rem);
  overflow: clip;
}

.page--receptionist .main h1,
.page--receptionist .main h2,
.page--receptionist .main h3 {
  text-wrap: balance;
}

/* Location lives in the navigator label, never a stranded breadcrumb. */
.page--receptionist .crumbs { display: none; }

/* --------------------------------------------------------------------------
   The floating section banner (homepage hxnav) — kept from rx5.
   Midnight glass, exists only below the hero, cursor glides to the live
   section, follows the pointer on hover, docks when the masthead hides.
   ----------------------------------------------------------------------- */

.page--receptionist .hxnav {
  position: fixed;
  top: calc(var(--hxnav-seam, 65px) + 10px);
  left: 50%;
  z-index: 900;
  transform: translate(-50%, -14px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 280ms ease, transform 320ms cubic-bezier(0.22, 1, 0.36, 1), top 240ms ease;
}

.page--receptionist .hxnav.is-in { transform: translate(-50%, 0); opacity: 1; pointer-events: auto; }
.page--receptionist .hxnav.is-docked { top: 10px; }

.page--receptionist .hxnav__list {
  position: relative;
  display: flex;
  margin: 0;
  padding: 4px;
  list-style: none;
  border-radius: 999px;
  background: rgba(36, 33, 30, 0.62);
  border: 1px solid rgba(255, 255, 255, 0.16);
  -webkit-backdrop-filter: blur(18px) saturate(1.15);
  backdrop-filter: blur(18px) saturate(1.15);
  box-shadow: 0 18px 44px -20px rgba(36, 33, 30, 0.7);
}

.page--receptionist .hxnav [data-hxnav-link] {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 40px;
  padding: 0.5rem 0.95rem;
  border-radius: 999px;
  color: rgba(245, 242, 235, 0.88);
  font-size: 0.875rem;
  font-weight: 750;
  text-decoration: none;
  transition: color 200ms ease;
}

.page--receptionist .hxnav [data-hxnav-link] i {
  font-style: normal;
  font-size: 0.875rem;
  font-weight: 800;
  color: rgba(217, 210, 196, 0.9);
  transition: color 200ms ease;
}

.page--receptionist .hxnav [data-hxnav-link].is-on { color: #24211e; }
.page--receptionist .hxnav [data-hxnav-link].is-on i { color: #8e2938; }
.page--receptionist .hxnav [data-hxnav-link]:focus-visible { outline: 3px solid #d9d2c4; outline-offset: 2px; }

.page--receptionist .hxnav__curli { margin: 0; padding: 0; list-style: none; }

.page--receptionist .hxnav__cursor {
  position: absolute;
  z-index: 0;
  top: 4px;
  left: 0;
  height: calc(100% - 8px);
  width: 0;
  border-radius: 999px;
  background: #f5f2eb;
  opacity: 0;
  transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1), width 420ms cubic-bezier(0.22, 1, 0.36, 1), opacity 200ms ease;
  pointer-events: none;
}

@media (max-width: 47.99em) {
  .page--receptionist .hxnav [data-hxnav-link] { padding: 0.5rem 0.7rem; min-height: 40px; }
  .page--receptionist .hxnav [data-hxnav-link] span { display: none; }
}

.page--receptionist [data-rx-section] {
  scroll-margin-top: calc(var(--hxnav-seam, var(--head-h, 65px)) + 4.5rem);
}

/* --------------------------------------------------------------------------
   Shared devices: kicker, heading, lockup, buttons
   ----------------------------------------------------------------------- */

.page--receptionist .rx-kicker {
  margin: 0 0 0.7rem;
  max-width: none;
  color: var(--rx-oxblood);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  line-height: 1.2;
  text-transform: uppercase;
}

.page--receptionist .rx-kicker--gold { color: var(--rx-gold); }

.page--receptionist .rx-h2 {
  margin: 0;
  color: var(--rx-ink);
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(1.8rem, 1.3rem + 1.7vw, 2.8rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.08;
}

.page--receptionist .rx-h2--light { color: #f7f4ed; }

/* Centred lockup head shared by the supporting islands. */
.page--receptionist .rx-head {
  max-width: 62ch;
  margin: 0 auto clamp(1.7rem, 3vw, 2.7rem);
  text-align: center;
}

.page--receptionist .rx-head__intro {
  margin: 0.75rem auto 0;
  max-width: 46ch;
  color: var(--rx-ink-soft);
  font-size: 0.98rem;
  line-height: 1.6;
}

.page--receptionist .rx-head--dark .rx-head__intro { color: #c0b9ad; }

/* Actions. Oxblood on light; gold lives on midnight only. The hover colour
   arrives as a directional wipe (receptionist-motion.mjs sets --wx/--wy). */
.page--receptionist .rx-button {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  min-height: var(--rx-tap);
  padding: 0.8rem 1.6rem;
  border: 0;
  border-radius: 10px;
  font: inherit;
  font-size: 0.95rem;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 180ms var(--rx-ease), border-color 180ms var(--rx-ease),
    box-shadow 180ms var(--rx-ease);
}

.page--receptionist .rx-button::before {
  content: "";
  position: absolute;
  inset: -2px;
  z-index: -1;
  border-radius: inherit;
  background: var(--rx-wipe, var(--rx-oxblood-dark));
  clip-path: circle(0% at var(--wx, 50%) var(--wy, 50%));
  transition: clip-path 420ms var(--rx-ease);
}

.page--receptionist .rx-button--gold {
  background: var(--rx-gold);
  color: #24211e;
  --rx-wipe: #e6e0d4;
}

.page--receptionist .rx-button--oxblood {
  background: var(--rx-oxblood);
  color: #f7f4ed;
  --rx-wipe: var(--rx-oxblood-dark);
}

.page--receptionist .rx-button--quiet {
  background: rgba(245, 242, 235, 0.05);
  border: 1px solid rgba(245, 242, 235, 0.58);
  color: #f5f2eb;
  font-weight: 700;
  --rx-wipe: rgba(245, 242, 235, 0.12);
}

@media (hover: hover) and (pointer: fine) {
  .page--receptionist .rx-button:hover::before {
    clip-path: circle(150% at var(--wx, 50%) var(--wy, 50%));
  }
}

.page--receptionist .rx-button b {
  display: grid;
  place-items: center;
  width: 1.75rem;
  height: 1.75rem;
  flex: 0 0 auto;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: 0.875rem;
  font-weight: 400;
}

/* --------------------------------------------------------------------------
   Islands — every chapter floats on the ground.
   ----------------------------------------------------------------------- */

.page--receptionist .rx-hero,
.page--receptionist .rx-how,
.page--receptionist .rx-honest,
.page--receptionist .rx-routes,
.page--receptionist .rx-direct {
  position: relative;
  width: var(--rx-shell);
  max-width: none;
  margin: clamp(1.4rem, 2.6vw, 2.4rem) auto 0;
  padding: clamp(2rem, 3.2vw, 3.2rem) clamp(1.25rem, 3vw, 3rem);
  border-radius: var(--rx-radius-island);
  box-shadow: 0 30px 70px -50px rgb(36 33 30 / 40%);
}

.page--receptionist .rx-hero { margin-top: clamp(1.1rem, 2.2vw, 1.9rem); }

/* Grounds cycle: midnight, paper, midnight, fog, linen — two darks never
   adjacent. */
.page--receptionist .rx-hero,
.page--receptionist .rx-honest {
  background:
    radial-gradient(120% 90% at 85% 0%, rgb(217 210 196 / 9%) 0%, transparent 55%),
    var(--rx-night);
  color: #f5f2eb;
}

.page--receptionist .rx-how { background: var(--rx-paper); }
.page--receptionist .rx-routes { background: var(--rx-field-fog); }
.page--receptionist .rx-direct { background: var(--rx-field-linen); }

/* The container layer — Design Authority §4.2 three-layer nest. */
.page--receptionist .rx-frame {
  padding: clamp(1.1rem, 2.2vw, 2rem);
  border-radius: var(--rx-radius-plate);
  background: rgb(245 242 235 / 26%);
  border: 1px solid rgb(245 242 235 / 55%);
  box-shadow: 0 30px 70px -50px rgb(36 33 30 / 40%);
}

/* --------------------------------------------------------------------------
   HERO — Dukes Assistant IN THE MIDDLE (rx8): a centred lockup on the axis,
   and beneath it the EXCHANGE SPECIMEN — the conversation on the left
   resolving into the sealed summary on the right, one composed unit.
   No assurance strip: the hero shows the product, it does not argue.
   ----------------------------------------------------------------------- */

.page--receptionist .rx-hero__lockup {
  max-width: 64ch;
  margin: 0 auto clamp(1.8rem, 3.2vw, 3rem);
  text-align: center;
}

.page--receptionist .rx-hero__title {
  margin: 0 0 0.6rem;
  color: #f7f4ed;
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(2.6rem, 1.8rem + 3vw, 4.6rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.04;
}

.page--receptionist .rx-hero__statement {
  margin: 0 auto 0.9rem;
  max-width: none;
  color: var(--rx-gold);
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(1.15rem, 1.05rem + 0.7vw, 1.6rem);
  line-height: 1.3;
}

.page--receptionist .rx-hero__lede {
  margin: 0 auto 1.6rem;
  max-width: 52ch;
  color: #d8d2c6;
  font-size: clamp(1rem, 0.95rem + 0.3vw, 1.15rem);
  line-height: 1.65;
}

.page--receptionist .rx-hero__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  margin: 0;
  max-width: none;
}

.page--receptionist .rx-hero__plain {
  margin: 1.1rem auto 0;
  max-width: 52ch;
  color: #ada69a;
  font-size: 0.9rem;
  line-height: 1.55;
}

.page--receptionist .rx-hero__plain a {
  color: #e0dacd;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* the exchange specimen — conversation left, summary right, one unit
   centred under the name; static, never a working chat */
.page--receptionist .rx-exchange {
  display: grid;
  grid-template-columns: minmax(260px, 0.42fr) minmax(0, 0.58fr);
  gap: clamp(1.4rem, 3vw, 3rem);
  align-items: center;
  max-width: 72rem;
  margin: 0 auto;
}

.page--receptionist .rx-exchange__lines {
  display: grid;
  gap: 0.6rem;
  justify-self: end;
  width: min(100%, 26rem);
  margin: 0;
  padding: 0;
  list-style: none;
}

.page--receptionist .rx-exchange__ask,
.page--receptionist .rx-exchange__reply {
  max-width: 34ch;
  padding: 0.55rem 0.95rem;
  font-size: 0.9rem;
  line-height: 1.45;
}

.page--receptionist .rx-exchange__ask {
  justify-self: start;
  border-radius: 4px 16px 16px 16px;
  background: var(--rx-night-lift);
  border: 1px solid rgb(245 242 235 / 14%);
  color: #e3ded3;
}

.page--receptionist .rx-exchange__reply {
  justify-self: end;
  border-radius: 16px 4px 16px 16px;
  background: var(--rx-gold);
  color: #24211e;
  font-weight: 700;
}

.page--receptionist .rx-exchange__cap {
  grid-column: 1 / -1;
  margin: 0.9rem auto 0;
  max-width: none;
  color: #ada69a;
  font-size: 0.875rem;
  line-height: 1.5;
  text-align: center;
}

/* the specimen docket the exchange writes */
.page--receptionist .rx-spec__sheet {
  position: relative;
  padding: 1.7rem 1.7rem 1.5rem;
  border-radius: var(--rx-radius-plate);
  background: var(--rx-cream);
  box-shadow: 0 22px 50px -24px rgb(18 16 14 / 55%);
}

/* The ONE seal moment on the page: the genuine crown on a brass wax disc. */
.page--receptionist .rx-spec__seal {
  position: absolute;
  top: -1.35rem;
  right: 1.4rem;
  display: grid;
  place-items: center;
  width: 3.4rem;
  height: 3.4rem;
  border-radius: 50%;
  background: var(--rx-night);
  border: 2px solid var(--rx-gold);
  box-shadow: 0 10px 22px -8px rgb(18 16 14 / 60%);
}

.page--receptionist .rx-spec__seal svg { width: 1.9rem; height: 1.9rem; }

.page--receptionist .rx-spec__tag {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.8rem;
  margin: 0 0 0.85rem;
  max-width: none;
  padding-right: 3.6rem;
}

.page--receptionist .rx-spec__tag span {
  color: var(--rx-oxblood);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.page--receptionist .rx-spec__tag em {
  color: var(--rx-ink-soft);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}

.page--receptionist .rx-spec__list { margin: 0; }

.page--receptionist .rx-spec__row {
  display: grid;
  grid-template-columns: minmax(8.5rem, 0.44fr) 1fr;
  gap: 0.35rem 1.1rem;
  padding: 0.62rem 0;
  border-bottom: 1px solid rgb(36 33 30 / 12%);
}

.page--receptionist .rx-spec__row:last-child { border-bottom: 0; }

.page--receptionist .rx-spec__row dt {
  color: var(--rx-ink-soft);
  font-size: 0.875rem;
  font-weight: 600;
}

.page--receptionist .rx-spec__row dd {
  margin: 0;
  color: var(--rx-ink);
  font-size: 0.95rem;
  font-weight: 800;
}

.page--receptionist .rx-spec__foot {
  margin: 0.9rem 0 0;
  max-width: none;
  padding-top: 0.85rem;
  border-top: 1px solid rgb(36 33 30 / 12%);
  color: var(--rx-ink-soft);
  font-size: 0.875rem;
  line-height: 1.5;
}

/* --------------------------------------------------------------------------
   HOW IT WORKS — paper island: the three moments as one full-width trio,
   huge Gloock numerals (the tenant-fees proof-type treatment). The third
   plate is the one the visitor HOLDS and says so.
   ----------------------------------------------------------------------- */

.page--receptionist .rx-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(0.9rem, 1.6vw, 1.4rem);
  margin: 0;
  padding: 0;
  list-style: none;
}

.page--receptionist .rx-step {
  position: relative;
  display: grid;
  gap: 0.4rem;
  align-content: start;
  padding: clamp(1.3rem, 2.2vw, 1.8rem);
  border-radius: var(--rx-radius-plate);
  border: 1px solid rgb(36 33 30 / 10%);
  background: var(--rx-plate-paper);
  box-shadow: 0 12px 28px rgba(36, 33, 30, 0.07);
}

.page--receptionist .rx-step__numeral {
  margin: 0 0 0.2rem;
  color: var(--rx-oxblood);
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(2.4rem, 2rem + 1.6vw, 3.6rem);
  line-height: 0.95;
}

.page--receptionist .rx-step__actor {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 0.3rem 0.7rem;
  border-radius: 999px;
  background: rgb(36 33 30 / 8%);
  color: #4c463f;
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.page--receptionist .rx-step h3 {
  margin: 0.3rem 0 0.1rem;
  color: var(--rx-ink);
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(1.2rem, 1.1rem + 0.5vw, 1.5rem);
  font-weight: 400;
}

.page--receptionist .rx-step__text {
  margin: 0;
  max-width: 40ch;
  color: var(--rx-ink-soft);
  font-size: 0.92rem;
  line-height: 1.58;
}

/* the held step — the only stressed plate: it alone earns the premium white */
.page--receptionist .rx-step--held {
  background: var(--rx-cream);
  border: 1px solid rgb(142 41 56 / 45%);
  box-shadow: 0 18px 42px rgba(36, 33, 30, 0.12);
}

.page--receptionist .rx-step__hold {
  position: absolute;
  top: 1.1rem;
  right: 1.1rem;
  padding: 0.3rem 0.7rem;
  border-radius: 999px;
  background: var(--rx-oxblood);
  color: #f7f4ed;
  font-size: 0.72rem;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* the assurance chip and the action, one centred close */
.page--receptionist .rx-how__close {
  display: grid;
  justify-items: center;
  gap: 1rem;
  margin-top: clamp(1.4rem, 2.6vw, 2.2rem);
}

.page--receptionist .rx-how__status {
  display: inline-block;
  margin: 0;
  max-width: 60ch;
  padding: 0.6rem 0.95rem;
  border-radius: var(--rx-radius-small);
  background: rgb(36 33 30 / 7%);
  color: #4c463f;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.5;
  text-align: center;
}

/* --------------------------------------------------------------------------
   PLAINLY — midnight island: the honesty ledger asymmetry, closed by the
   ZERO RAIL (device #3): three Gloock zeros, each a standing refusal.
   ----------------------------------------------------------------------- */

/* the honesty island runs tighter internal gaps than the light islands —
   its dark ground makes every empty run read twice as large */
.page--receptionist .rx-honest .rx-head { margin-bottom: clamp(1.2rem, 2vw, 1.6rem); }

/* both cards run the same height — the shorter IS-NOT column centres its
   ledger instead of ending early and leaving dead midnight below it */
.page--receptionist .rx-honest__cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.1rem, 2.2vw, 2rem);
  max-width: 74rem;
  margin: 0 auto;
  align-items: stretch;
}

.page--receptionist .rx-honest__col--not {
  display: grid;
  align-content: center;
}

.page--receptionist .rx-honest__col {
  padding: 1.5rem 1.6rem 1.1rem;
  border-radius: var(--rx-radius-plate);
}

.page--receptionist .rx-honest__col--is {
  background: var(--rx-cream);
  color: var(--rx-ink);
  box-shadow: 0 22px 50px -28px rgb(18 16 14 / 55%);
}

.page--receptionist .rx-honest__col--not {
  background: rgb(245 242 235 / 7%);
  border: 1px solid var(--rx-rule-dark);
  color: #e0dacd;
}

.page--receptionist .rx-honest__label {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0 0 0.6rem;
  max-width: none;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.page--receptionist .rx-honest__col--is .rx-honest__label { color: var(--rx-oxblood); }
.page--receptionist .rx-honest__col--not .rx-honest__label { color: var(--rx-gold); }

.page--receptionist .rx-honest__label span {
  display: grid;
  place-items: center;
  width: 1.7rem;
  height: 1.7rem;
  border-radius: 50%;
  font-size: 0.9rem;
  font-weight: 800;
}

.page--receptionist .rx-honest__col--is .rx-honest__label span {
  background: var(--rx-oxblood);
  color: #f7f4ed;
}

.page--receptionist .rx-honest__col--not .rx-honest__label span {
  background: var(--rx-gold);
  color: var(--rx-night);
}

.page--receptionist .rx-honest__col ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.page--receptionist .rx-honest__col li {
  padding: 0.72rem 0;
  border-bottom: 1px solid rgb(36 33 30 / 12%);
  font-size: 0.95rem;
  line-height: 1.55;
}

.page--receptionist .rx-honest__col--not li { border-bottom-color: rgb(245 242 235 / 14%); }
.page--receptionist .rx-honest__col li:last-child { border-bottom: 0; }

/* the zero rail */
.page--receptionist .rx-zero {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1.1rem, 2.4vw, 2.6rem);
  max-width: 74rem;
  margin: clamp(1.2rem, 2.2vw, 1.8rem) auto 0;
  padding: clamp(1rem, 1.8vw, 1.4rem) 0 0;
  border-top: 1px solid var(--rx-rule-dark);
}

.page--receptionist .rx-zero > div {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: baseline;
  gap: 0.85rem;
}

.page--receptionist .rx-zero dt {
  color: var(--rx-gold);
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(2.4rem, 2rem + 1.6vw, 3.4rem);
  line-height: 0.95;
}

.page--receptionist .rx-zero dd {
  margin: 0;
  color: #c0b9ad;
  font-size: 0.92rem;
  line-height: 1.55;
  max-width: 30ch;
}

.page--receptionist .rx-zero dd strong {
  display: block;
  color: #f5f2eb;
  font-size: 0.95rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}

/* --------------------------------------------------------------------------
   FIVE ROUTES — fog island: the SWITCHBOARD (device #2). Six registry rows;
   each prints the real questions it asks as chips. The open-ended row is
   midnight — the deliberate odd one.
   ----------------------------------------------------------------------- */

.page--receptionist .rx-switch {
  display: grid;
  gap: clamp(0.7rem, 1.2vw, 1rem);
  margin: 0;
  padding: 0;
  list-style: none;
}

.page--receptionist .rx-route {
  display: grid;
  grid-template-columns: auto minmax(0, 1.05fr) minmax(0, 0.95fr) auto;
  align-items: center;
  gap: clamp(0.9rem, 2vw, 1.8rem);
  min-height: var(--rx-tap);
  padding: clamp(1rem, 1.8vw, 1.35rem) clamp(1.1rem, 2vw, 1.6rem);
  border-radius: var(--rx-radius-plate);
  border: 1px solid rgb(36 33 30 / 8%);
  background: var(--rx-plate-fog);
  box-shadow: 0 12px 28px rgba(36, 33, 30, 0.07);
  color: var(--rx-ink);
  text-decoration: none;
  transition: box-shadow 180ms var(--rx-ease), border-color 180ms var(--rx-ease),
    transform 180ms var(--rx-ease);
}

@media (hover: hover) and (pointer: fine) {
  .page--receptionist .rx-route:hover {
    border-color: rgb(142 41 56 / 35%);
    box-shadow: 0 22px 48px rgba(36, 33, 30, 0.14);
    transform: translateY(-2px);
  }
  .page--receptionist .rx-route:hover .rx-route__go { color: var(--rx-oxblood-dark); }
  .page--receptionist .rx-route:hover .rx-route__go::after {
    background: var(--rx-oxblood);
    color: #f7f4ed;
  }
}

.page--receptionist .rx-route__number {
  display: grid;
  justify-items: center;
  gap: 0.35rem;
  margin: 0;
  max-width: none;
  color: var(--rx-ink-soft);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: center;
}

.page--receptionist .rx-route__number span {
  display: grid;
  place-items: center;
  min-width: 2.4rem;
  height: 2.4rem;
  border-radius: 999px;
  background: var(--rx-oxblood);
  color: #f7f4ed;
  font-family: "Gloock", Georgia, serif;
  font-size: 1.02rem;
  letter-spacing: 0;
}

.page--receptionist .rx-route__body { display: grid; gap: 0.25rem; }

.page--receptionist .rx-route__label {
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(1.12rem, 1rem + 0.5vw, 1.35rem);
  font-weight: 400;
  line-height: 1.22;
}

.page--receptionist .rx-route__outcome {
  color: var(--rx-ink-soft);
  font-size: 0.9rem;
  line-height: 1.5;
  max-width: 44ch;
}

/* the question chips — what this route actually asks, from the builder */
.page--receptionist .rx-route__asks {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-content: center;
}

.page--receptionist .rx-route__asks i {
  padding: 0.32rem 0.7rem;
  border-radius: 999px;
  background: rgb(36 33 30 / 7%);
  border: 1px solid rgb(36 33 30 / 10%);
  color: #4c463f;
  font-size: 0.82rem;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}

.page--receptionist .rx-route__asks i:last-child {
  background: transparent;
  border-style: dashed;
  color: var(--rx-ink-soft);
}

.page--receptionist .rx-route__foot {
  display: grid;
  justify-items: end;
  gap: 0.45rem;
}

.page--receptionist .rx-route__count {
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  background: rgb(36 33 30 / 8%);
  color: #4c463f;
  font-size: 0.82rem;
  font-weight: 700;
  white-space: nowrap;
}

.page--receptionist .rx-route__go {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: var(--rx-oxblood);
  font-size: 0.9rem;
  font-style: normal;
  font-weight: 800;
}

.page--receptionist .rx-route__go::after {
  content: "→";
  display: grid;
  place-items: center;
  width: 1.7rem;
  height: 1.7rem;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: 0.85rem;
  font-weight: 400;
  transition: background-color 180ms var(--rx-ease), color 180ms var(--rx-ease);
}

/* the open-ended row: midnight, gold action, the deliberate odd one */
.page--receptionist .rx-route--open {
  background: var(--rx-night);
  border-color: rgb(245 242 235 / 16%);
  color: var(--rx-cream);
}

.page--receptionist .rx-route--open .rx-route__number { color: rgb(245 242 235 / 72%); }

.page--receptionist .rx-route--open .rx-route__number span {
  background: var(--rx-gold);
  color: #24211e;
}

.page--receptionist .rx-route--open .rx-route__label { color: var(--rx-cream); }
.page--receptionist .rx-route--open .rx-route__outcome { color: rgb(245 242 235 / 76%); }

.page--receptionist .rx-route--open .rx-route__asks i {
  background: rgb(245 242 235 / 8%);
  border-color: rgb(245 242 235 / 18%);
  color: rgb(245 242 235 / 80%);
}

.page--receptionist .rx-route--open .rx-route__count {
  background: rgb(245 242 235 / 10%);
  color: rgb(245 242 235 / 82%);
}

.page--receptionist .rx-route--open .rx-route__go { color: var(--rx-gold); }

@media (hover: hover) and (pointer: fine) {
  .page--receptionist .rx-route--open:hover { border-color: rgb(217 210 196 / 55%); }
  .page--receptionist .rx-route--open:hover .rx-route__go { color: var(--rx-gold); }
  .page--receptionist .rx-route--open:hover .rx-route__go::after {
    background: var(--rx-gold);
    color: #24211e;
  }
}

/* --------------------------------------------------------------------------
   DIRECT CONTACT — linen island: ledger + office left, testimony right.
   ----------------------------------------------------------------------- */

.page--receptionist .rx-direct__body {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.9fr);
  gap: clamp(1.6rem, 3vw, 3rem);
  align-items: center;
}

.page--receptionist .rx-direct__ledger {
  display: grid;
  gap: 0.7rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page--receptionist .rx-direct__ledger a {
  display: grid;
  grid-template-columns: 2.75rem 1fr auto;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 1rem;
  row-gap: 0.1rem;
  min-height: 64px;
  padding: 0.85rem 1.1rem;
  border-radius: var(--rx-radius-small);
  border: 1px solid rgb(36 33 30 / 8%);
  background: var(--rx-plate-linen);
  box-shadow: 0 10px 26px rgba(36, 33, 30, 0.06);
  color: var(--rx-ink);
  text-decoration: none;
  transition: box-shadow 180ms var(--rx-ease), border-color 180ms var(--rx-ease);
}

@media (hover: hover) and (pointer: fine) {
  .page--receptionist .rx-direct__ledger a:hover {
    border-color: rgb(142 41 56 / 35%);
    box-shadow: 0 18px 40px rgba(36, 33, 30, 0.12);
  }
  .page--receptionist .rx-direct__ledger a:hover em {
    background: var(--rx-oxblood);
    color: #f7f4ed;
  }
}

.page--receptionist .rx-direct__mark {
  grid-row: 1 / span 2;
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 12px;
  background: rgb(36 33 30 / 8%);
  color: var(--rx-night);
}

.page--receptionist .rx-direct__icon {
  width: 1.35rem;
  height: 1.35rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page--receptionist .rx-direct__icon--brand {
  fill: currentColor;
  stroke: none;
}

.page--receptionist .rx-direct__channel {
  grid-column: 2;
  color: var(--rx-ink-soft);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.page--receptionist .rx-direct__ledger strong {
  grid-column: 2;
  font-size: 1.02rem;
  font-weight: 800;
}

.page--receptionist .rx-direct__ledger em {
  grid-row: 1 / span 2;
  grid-column: 3;
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--rx-oxblood);
  border-radius: 50%;
  color: var(--rx-oxblood);
  font-size: 0.9rem;
  font-style: normal;
  transition: background-color 180ms var(--rx-ease), color 180ms var(--rx-ease);
}

.page--receptionist .rx-direct__office {
  margin-top: 0.9rem;
  padding: 1.05rem 1.2rem;
  border-radius: var(--rx-radius-small);
  border: 1px solid rgb(36 33 30 / 8%);
  background: var(--rx-plate-linen);
  box-shadow: 0 10px 26px rgba(36, 33, 30, 0.06);
}

.page--receptionist .rx-direct__office-label {
  margin: 0 0 0.25rem;
  max-width: none;
  color: var(--rx-ink-soft);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.page--receptionist .rx-direct__office-value {
  margin: 0 0 0.3rem;
  max-width: none;
  color: var(--rx-ink);
  font-size: 0.98rem;
  font-weight: 700;
}

.page--receptionist .rx-direct__office-note {
  margin: 0;
  max-width: 60ch;
  color: var(--rx-ink-soft);
  font-size: 0.875rem;
  line-height: 1.5;
}

/* A small follow link, separate from the contact routes. */
.page--receptionist .rx-direct__social {
  margin: 0.9rem 0 0;
  max-width: 60ch;
  color: var(--rx-ink-soft);
  font-size: 0.9rem;
  line-height: 1.55;
}

.page--receptionist .rx-direct__social a {
  display: inline-block;
  padding: 0.15rem 0;
  color: var(--rx-oxblood);
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* testimony — a real review as evidence, not assertion */
.page--receptionist .rx-testimony {
  margin: 0;
  padding: clamp(1.2rem, 2.2vw, 1.7rem);
  border-radius: var(--rx-radius-plate);
  border: 1px solid var(--rx-rule);
  background: var(--rx-cream);
  box-shadow: 0 12px 28px rgba(36, 33, 30, 0.07);
}

.page--receptionist .rx-testimony blockquote { margin: 0 0 0.9rem; }

.page--receptionist .rx-testimony blockquote::before {
  content: "\201C";
  display: block;
  font-family: "Gloock", Georgia, serif;
  font-size: 2.6rem;
  line-height: 0.7;
  color: var(--rx-oxblood);
  margin-bottom: 0.35rem;
}

.page--receptionist .rx-testimony blockquote p {
  margin: 0;
  font-size: 0.98rem;
  line-height: 1.65;
  color: var(--rx-ink);
  max-width: 60ch;
}

.page--receptionist .rx-testimony figcaption {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.8rem;
}

.page--receptionist .rx-testimony__monogram {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--rx-night);
  color: var(--rx-gold);
  font-family: "Gloock", Georgia, serif;
  font-size: 1.05rem;
}

.page--receptionist .rx-testimony figcaption strong {
  display: block;
  font-size: 0.95rem;
  color: var(--rx-ink);
}

.page--receptionist .rx-testimony figcaption small {
  display: block;
  font-size: 0.82rem;
  color: var(--rx-ink-soft);
}

.page--receptionist .rx-testimony figcaption a {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: var(--rx-tap);
  padding: 0 1rem;
  border-radius: 999px;
  border: 1px solid var(--rx-rule);
  color: var(--rx-ink);
  font-size: 0.85rem;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

.page--receptionist .rx-testimony figcaption a::after { content: "\2192"; color: var(--rx-oxblood); }

@media (hover: hover) {
  .page--receptionist .rx-testimony figcaption a:hover { background: rgb(36 33 30 / 6%); }
}

/* --------------------------------------------------------------------------
   Scroll reveals — armed only by receptionist-motion.mjs, landed by the
   observer. With the module absent nothing is ever hidden. rx7.1: one
   vocabulary per device, not one fade for everything — the module also
   staggers siblings via --rxm-delay.
   ----------------------------------------------------------------------- */

.page--receptionist .rxm-armed {
  transition: opacity 460ms ease var(--rxm-delay, 0ms), transform 460ms var(--rx-ease) var(--rxm-delay, 0ms);
}

/* default: plates settle upward */
.page--receptionist .rxm-armed:not(.is-in) {
  opacity: 0;
  transform: translateY(16px);
}

/* registry rows arrive from the left, like entries being written in */
.page--receptionist .rx-route.rxm-armed:not(.is-in),
.page--receptionist .rx-direct__ledger li.rxm-armed:not(.is-in) {
  transform: translateX(-24px);
}

/* the testimony breathes in */
.page--receptionist .rx-testimony.rxm-armed:not(.is-in) {
  transform: translateY(10px) scale(0.975);
}

/* the zeros land with a slight rise and their numerals swell */
.page--receptionist .rx-zero > div.rxm-armed .rx-zero__num,
.page--receptionist .rx-zero > div.rxm-armed dt {
  display: inline-block;
  transition: transform 520ms var(--rx-ease) var(--rxm-delay, 0ms);
}

.page--receptionist .rx-zero > div.rxm-armed:not(.is-in) dt {
  transform: scale(0.8);
}

/* the hero exchange plays itself on arrival: bubbles pop in sequence */
.page--receptionist .rx-exchange__lines li.rxm-armed:not(.is-in) {
  opacity: 0;
  transform: translateY(10px) scale(0.94);
}

.page--receptionist .rx-exchange__lines li.rxm-armed {
  transition: opacity 380ms ease var(--rxm-delay, 0ms), transform 380ms var(--rx-ease) var(--rxm-delay, 0ms);
}

/* the switchboard arrow nudges toward the door on hover */
.page--receptionist .rx-route__go::after {
  transition: background-color 180ms var(--rx-ease), color 180ms var(--rx-ease),
    transform 180ms var(--rx-ease);
}

@media (hover: hover) and (pointer: fine) {
  .page--receptionist .rx-route:hover .rx-route__go::after { transform: translateX(3px); }
}

/* --------------------------------------------------------------------------
   Responsive
   ----------------------------------------------------------------------- */

@media (max-width: 68em) {
  /* the switchboard folds its chips under the body */
  .page--receptionist .rx-route {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }
  .page--receptionist .rx-route__asks {
    grid-column: 2;
    grid-row: 2;
  }
  .page--receptionist .rx-route__number { align-self: start; }
}

@media (max-width: 62em) {
  .page--receptionist .rx-exchange,
  .page--receptionist .rx-honest__cols,
  .page--receptionist .rx-direct__body,
  .page--receptionist .rx-steps {
    grid-template-columns: 1fr;
  }
  .page--receptionist .rx-zero { grid-template-columns: 1fr; gap: 0.9rem; }
  .page--receptionist .rx-exchange { max-width: 34rem; }
  .page--receptionist .rx-exchange__lines { justify-self: start; }
}

@media (max-width: 48em) {
  .page--receptionist .rx-hero,
  .page--receptionist .rx-how,
  .page--receptionist .rx-honest,
  .page--receptionist .rx-routes,
  .page--receptionist .rx-direct,
  .page--receptionist .reception {
    width: auto;
    margin-inline: 0.625rem;
    border-radius: 20px;
  }
  .page--receptionist .rx-hero__actions { flex-direction: column; align-items: stretch; }
  .page--receptionist .rx-spec__row { grid-template-columns: 1fr; gap: 0.1rem; }
  .page--receptionist .rx-route {
    grid-template-columns: minmax(0, 1fr);
  }
  .page--receptionist .rx-route__number {
    grid-row: 1;
    justify-items: start;
    grid-template-columns: auto auto;
    align-items: center;
    gap: 0.55rem;
  }
  .page--receptionist .rx-route__asks { grid-column: 1; grid-row: 3; }
  .page--receptionist .rx-route__foot {
    grid-column: 1;
    grid-row: 4;
    grid-template-columns: auto auto;
    justify-content: space-between;
    justify-items: stretch;
    width: 100%;
    margin-top: 0.4rem;
    padding-top: 0.75rem;
    border-top: 1px solid rgb(36 33 30 / 10%);
  }
  .page--receptionist .rx-route--open .rx-route__foot { border-top-color: rgb(245 242 235 / 22%); }
  .page--receptionist .rx-testimony figcaption { grid-template-columns: auto minmax(0, 1fr); }
  .page--receptionist .rx-testimony figcaption a { grid-column: 1 / -1; justify-self: start; }
}

@media (max-width: 30em) {
  .page--receptionist .rx-spec__sheet { padding: 1.3rem 1.15rem 1.2rem; }
  .page--receptionist .rx-spec__seal { right: 1rem; }
}

/* --------------------------------------------------------------------------
   Motion discipline
   ----------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  .page--receptionist .rx-button,
  .page--receptionist .rx-button::before,
  .page--receptionist .rx-route,
  .page--receptionist .rx-route__go::after,
  .page--receptionist .rx-direct__ledger a,
  .page--receptionist .rx-direct__ledger em,
  .page--receptionist .rxm-armed,
  .page--receptionist .hxnav,
  .page--receptionist .hxnav__cursor,
  .page--receptionist .hxnav [data-hxnav-link] {
    transition: none !important;
  }

  .page--receptionist .rx-route:hover { transform: none; }

  .page--receptionist .rxm-armed:not(.is-in) {
    opacity: 1;
    transform: none;
  }
}

@media print {
  .page--receptionist .hxnav { display: none !important; }
  .page--receptionist .rxm-armed:not(.is-in) {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ==========================================================================
   rx9 — 20 August 2026: THE CLOSING BAND, redesigned.

   Aarav: "get rid of the ugly green colourway, use a different animation and
   colourway altogether and a new design layout."

   The green was a REGRESSION, not a choice: the rx7 rewrite dropped this
   page's reception overrides, so the band fell back to the legacy
   --surface-olive-charcoal (#24211e) in dukes-claude.css. It is skinned by
   this page again, and rebuilt:

     COLOURWAY — "the brass desk at night": an ink gradient (night-lift →
     midnight) blooming from the LOWER LEFT (the hero blooms upper right, so
     the two darks never read as the same surface), a gold hairline frame,
     and warm GOLD-TINTED GLASS plates instead of cream. Gold labels, gold
     carets, no cream slab anywhere on this band.

     LAYOUT — the rx8 centre-axis thesis applied here too: a centred lockup
     on the axis, then the five routes as a two-column plate grid beneath it
     (not a stack beside a half-empty intro column), then the four contact
     routes as a plate rail across the base.

     ANIMATION — its own vocabulary, used nowhere else on the page: plates
     FOCUS IN (blur + scale, staggered), the caret turns a half circle on
     open, and the open body draws a gold rule down its left edge.
   ========================================================================== */

.page--receptionist #dukes-receptionist.reception {
  width: var(--rx-shell);
  margin: clamp(1.4rem, 2.6vw, 2.4rem) auto clamp(1.4rem, 2.6vw, 2.4rem);
  padding: clamp(2rem, 3.2vw, 3.2rem) clamp(1.25rem, 3vw, 3rem);
  border-radius: var(--rx-radius-island);
  border: 1px solid rgb(217 210 196 / 30%);
  /* the solid base is declared SEPARATELY from the gradient layers: a
     gradient-only `background` shorthand leaves background-color transparent,
     and a dark band whose fill fails would drop cream text onto the light
     page ground (trap §6.6, in reverse). */
  background-color: #24211e;
  background-image:
    radial-gradient(120% 110% at 6% 104%, rgb(217 210 196 / 16%) 0%, rgb(217 210 196 / 0%) 58%),
    linear-gradient(160deg, #35302b 0%, rgb(36 33 30 / 0%) 62%);
  color: #f5f2eb;
  box-shadow: 0 30px 70px -50px rgb(36 33 30 / 60%);
}

.page--receptionist #dukes-receptionist .reception__inner {
  display: block;
  max-width: none;
  padding: 0;
  gap: 0;
}

/* -- the centred lockup, on the page's axis -------------------------------- */

.page--receptionist #dukes-receptionist .reception__intro {
  max-width: 62ch;
  margin: 0 auto clamp(1.6rem, 2.8vw, 2.4rem);
  text-align: center;
}

.page--receptionist #dukes-receptionist .reception__eyebrow {
  margin: 0 0 0.7rem;
  max-width: none;
  color: var(--rx-gold);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.page--receptionist #dukes-receptionist .h-section {
  margin: 0 0 0.7rem;
  color: #f7f4ed;
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(1.9rem, 1.4rem + 1.8vw, 3rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.06;
}

.page--receptionist #dukes-receptionist .reception__notice {
  margin: 0 auto 0.5rem;
  max-width: 52ch;
  color: rgb(245 242 235 / 78%);
  font-size: 0.98rem;
  line-height: 1.6;
}

.page--receptionist #dukes-receptionist .reception__notice:last-of-type {
  color: rgb(245 242 235 / 64%);
  font-size: 0.92rem;
}

/* -- the five routes as a two-column plate grid ---------------------------- */

.page--receptionist #dukes-receptionist ol.reception__routes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(0.7rem, 1.2vw, 1rem);
  align-items: start;
  margin: 0;
  padding: 0;
  border-top: 0;
  list-style: none;
}

/* the fifth plate takes the full closing row rather than leaving a hole */
.page--receptionist #dukes-receptionist ol.reception__routes > li:nth-child(5) {
  grid-column: 1 / -1;
}

.page--receptionist #dukes-receptionist .reception__route {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
}

/* warm glass, never a cream slab */
.page--receptionist #dukes-receptionist .reception__disclosure {
  position: relative;
  overflow: hidden;
  border: 1px solid rgb(217 210 196 / 26%);
  border-radius: var(--rx-radius-plate);
  background: rgb(217 210 196 / 7%);
  transition: border-color 200ms var(--rx-ease), background-color 200ms var(--rx-ease),
    transform 200ms var(--rx-ease);
}

.page--receptionist #dukes-receptionist .reception__disclosure[open] {
  border-color: rgb(217 210 196 / 52%);
  background: rgb(217 210 196 / 11%);
}

@media (hover: hover) and (pointer: fine) {
  .page--receptionist #dukes-receptionist .reception__disclosure:hover {
    border-color: rgb(217 210 196 / 46%);
    transform: translateY(-2px);
  }
}

.page--receptionist #dukes-receptionist .reception__summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  min-height: var(--rx-tap);
  padding: clamp(0.95rem, 1.6vw, 1.25rem) clamp(1.05rem, 1.8vw, 1.4rem);
  cursor: pointer;
  list-style: none;
  color: #f7f4ed;
}

.page--receptionist #dukes-receptionist .reception__summary::-webkit-details-marker { display: none; }

.page--receptionist #dukes-receptionist .reception__label {
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(1.05rem, 0.98rem + 0.35vw, 1.28rem);
  font-weight: 400;
  line-height: 1.25;
  color: #f7f4ed;
}

/* the caret: a gold ring that turns a half circle on open (this band's cue) */
.page--receptionist #dukes-receptionist .reception__caret {
  position: relative;
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border: 1px solid rgb(217 210 196 / 55%);
  border-radius: 50%;
  transform: rotate(0deg);
  transition: transform 320ms var(--rx-ease), background-color 200ms var(--rx-ease);
}

.page--receptionist #dukes-receptionist .reception__caret::before {
  content: "";
  width: 0.44rem;
  height: 0.44rem;
  margin-top: -0.16rem;
  border-right: 1.5px solid var(--rx-gold);
  border-bottom: 1.5px solid var(--rx-gold);
  transform: rotate(45deg);
}

.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__caret {
  transform: rotate(180deg);
  background: rgb(217 210 196 / 16%);
}

/* the open body: a gold rule draws down its left edge */
.page--receptionist #dukes-receptionist .reception__body {
  position: relative;
  padding: 0 clamp(1.05rem, 1.8vw, 1.4rem) clamp(1.05rem, 1.8vw, 1.35rem) clamp(1.5rem, 2.4vw, 1.9rem);
  border-top: 1px solid rgb(217 210 196 / 20%);
}

.page--receptionist #dukes-receptionist .reception__body::before {
  content: "";
  position: absolute;
  left: clamp(1.05rem, 1.8vw, 1.4rem);
  top: 0.9rem;
  width: 2px;
  height: 0;
  border-radius: 2px;
  background: linear-gradient(180deg, var(--rx-gold), rgb(217 210 196 / 0%));
  transition: height 460ms var(--rx-ease) 60ms;
}

.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__body::before {
  height: calc(100% - 1.8rem);
}

.page--receptionist #dukes-receptionist .reception__outcome {
  margin: 0.9rem 0 0.7rem;
  max-width: 52ch;
  color: rgb(245 242 235 / 86%);
  font-size: 0.95rem;
  line-height: 1.6;
}

.page--receptionist #dukes-receptionist .reception__asks {
  margin: 0 0 0.5rem;
  max-width: none;
  color: var(--rx-gold);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.page--receptionist #dukes-receptionist .reception__questions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page--receptionist #dukes-receptionist .reception__questions li {
  padding: 0.32rem 0.7rem;
  border: 1px solid rgb(245 242 235 / 22%);
  border-radius: 999px;
  background: rgb(245 242 235 / 8%);
  color: rgb(245 242 235 / 88%);
  font-size: 0.82rem;
  font-weight: 700;
  white-space: nowrap;
}

.page--receptionist #dukes-receptionist .reception__safety,
.page--receptionist #dukes-receptionist .reception__end {
  margin: 0.8rem 0 0;
  max-width: 58ch;
  color: rgb(245 242 235 / 70%);
  font-size: 0.9rem;
  line-height: 1.55;
}

/* -- the contact routes as a plate rail across the base -------------------- */

.page--receptionist #dukes-receptionist .reception__routes--safe {
  display: block;
  margin: clamp(1.4rem, 2.4vw, 2rem) 0 0;
  padding: clamp(1.3rem, 2.2vw, 1.8rem) 0 0;
  border-top: 1px solid rgb(217 210 196 / 26%);
}

.page--receptionist #dukes-receptionist .crail__intro {
  margin: 0 auto 0.9rem;
  max-width: none;
  color: rgb(245 242 235 / 70%);
  font-size: 0.875rem;
  text-align: center;
}

.page--receptionist #dukes-receptionist .crail__list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(0.6rem, 1.1vw, 0.9rem);
  margin: 0;
  padding: 0;
  list-style: none;
}

/* The shared crail ships its label+value as a HOVER TOOLTIP (.crail__tip)
   sitting beside an icon-only link. On this band the rail is the page's
   last contact moment, so the tooltip is promoted to permanent inline
   content: the ITEM becomes the plate, the link becomes the icon cell,
   and the link's ::after overlay makes the whole plate pressable. */
.page--receptionist #dukes-receptionist .crail__item {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0.85rem;
  min-height: 64px;
  margin: 0;
  padding: 0.75rem 1rem;
  border: 1px solid rgb(245 242 235 / 20%);
  border-radius: var(--rx-radius-small);
  background: rgb(245 242 235 / 7%);
  transition: border-color 200ms var(--rx-ease), background-color 200ms var(--rx-ease);
}

@media (hover: hover) and (pointer: fine) {
  .page--receptionist #dukes-receptionist .crail__item:hover {
    border-color: rgb(217 210 196 / 55%);
    background: rgb(217 210 196 / 12%);
  }
}

.page--receptionist #dukes-receptionist .crail__link {
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 10px;
  background: rgb(217 210 196 / 15%);
  color: var(--rx-gold);
  text-decoration: none;
  box-shadow: none;
}

/* the overlay: the whole plate is the tap target, not just the icon */
.page--receptionist #dukes-receptionist .crail__link::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: var(--rx-radius-small);
}

.page--receptionist #dukes-receptionist .crail__fill { display: none; }

.page--receptionist #dukes-receptionist .crail__glyph {
  display: grid;
  place-items: center;
  width: auto;
  height: auto;
  background: none;
  border: 0;
}

.page--receptionist #dukes-receptionist .crail__icon {
  width: 1.15rem;
  height: 1.15rem;
  color: var(--rx-gold);
}

/* the tooltip, de-tooltipped */
.page--receptionist #dukes-receptionist .crail__tip {
  position: static;
  display: grid;
  gap: 0.1rem;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  opacity: 1;
  visibility: visible;
  transform: none;
  pointer-events: none;
  white-space: normal;
}

.page--receptionist #dukes-receptionist .crail__tip::before,
.page--receptionist #dukes-receptionist .crail__tip::after { content: none; }

.page--receptionist #dukes-receptionist .crail__tip-label,
.page--receptionist #dukes-receptionist .crail__label {
  display: block;
  margin: 0;
  color: var(--rx-gold);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1.3;
  text-transform: uppercase;
}

.page--receptionist #dukes-receptionist .crail__tip-value,
.page--receptionist #dukes-receptionist .crail__value {
  display: block;
  margin: 0;
  color: #f5f2eb;
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

/* -- this band's own reveal: plates FOCUS IN ------------------------------- */

.page--receptionist #dukes-receptionist .rxm-armed:not(.is-in) {
  opacity: 0;
  transform: scale(0.985);
  filter: blur(7px);
}

.page--receptionist #dukes-receptionist .rxm-armed {
  transition: opacity 520ms ease var(--rxm-delay, 0ms),
    transform 520ms var(--rx-ease) var(--rxm-delay, 0ms),
    filter 520ms ease var(--rxm-delay, 0ms);
}

/* -- rx9 responsive -------------------------------------------------------- */

@media (max-width: 62em) {
  .page--receptionist #dukes-receptionist .crail__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 48em) {
  .page--receptionist #dukes-receptionist.reception {
    width: auto;
    margin-inline: 0.625rem;
    border-radius: 20px;
  }
  .page--receptionist #dukes-receptionist ol.reception__routes { grid-template-columns: 1fr; }
  .page--receptionist #dukes-receptionist .crail__list { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .page--receptionist #dukes-receptionist .reception__caret,
  .page--receptionist #dukes-receptionist .reception__body::before,
  .page--receptionist #dukes-receptionist .reception__disclosure,
  .page--receptionist #dukes-receptionist .crail__link,
  .page--receptionist #dukes-receptionist .rxm-armed {
    transition: none !important;
  }
  .page--receptionist #dukes-receptionist .rxm-armed:not(.is-in) {
    opacity: 1;
    transform: none;
    filter: none;
  }
  .page--receptionist #dukes-receptionist .reception__disclosure:hover { transform: none; }
}

/* ==========================================================================
   rx10 — 20 August 2026: the hero, on Aarav's verdict.

   "I don't like the way the text and image and text is displayed, it looks
   like AI generated, and the colours don't match — the red, that is Dukes
   Assistant, get that fixed. There should not be that much empty space, and
   it should be more like a video of people picking up the phone playing in
   the background."

   Three fixes:

   1. THE RED IS THE ASSISTANT'S OWN RED. The launcher, the chat send button
      and the chat's primary route all run --da-oxblood (#8e2938) from
      dukes-assistant.css. The hero was gold-led, so the page and the widget
      it belongs to did not match. The primary action and the visitor's reply
      bubble now carry that exact oxblood; gold stays as the identity accent
      (kicker, statement, seal) and nothing else.

   2. ONE CARD, NO VOID. The floating bubbles beside an empty half-island were
      the "AI generated" read: three disconnected shapes and a hole. The
      conversation and the summary are one object now — the exchange runs at
      the top of the same sheet the summary is written on.

   3. FILM-READY. A crossfading film layer sits behind the content with a
      legibility veil over it. With no files listed in data-films nothing
      loads and the ink ground shows, so the hero is finished either way.
   ========================================================================== */

/* -- the film layer -------------------------------------------------------- */

.page--receptionist .rx-hero { position: relative; overflow: hidden; }

.page--receptionist .rx-hero__film {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.page--receptionist .rx-hero__frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 42%;
  opacity: 0;
  transition: opacity 900ms ease;
}

.page--receptionist .rx-hero__frame.is-front { opacity: 1; }

/* the veil: legibility first, and it never crushes footage that is already
   dark — measured against the frame, not assumed (Design Authority §5). */
.page--receptionist .rx-hero__veil {
  position: absolute;
  inset: 0;
  display: block;
  background:
    linear-gradient(180deg, rgb(36 33 30 / 72%) 0%, rgb(36 33 30 / 58%) 45%, rgb(36 33 30 / 86%) 100%),
    radial-gradient(120% 90% at 85% 0%, rgb(217 210 196 / 10%) 0%, transparent 55%);
}

.page--receptionist .rx-hero__content { position: relative; z-index: 1; }

/* -- the lockup, tightened -------------------------------------------------- */

.page--receptionist .rx-hero__lockup {
  max-width: 60ch;
  margin: 0 auto clamp(1.4rem, 2.4vw, 2rem);
  text-align: center;
}

.page--receptionist .rx-hero__statement { margin-bottom: 0.7rem; }

.page--receptionist .rx-hero__lede {
  margin-bottom: 1.3rem;
  max-width: 50ch;
}

.page--receptionist .rx-hero__plain {
  margin-top: 0.9rem;
  font-size: 0.875rem;
}

/* -- ONE card: the exchange and the summary it writes ----------------------- */

.page--receptionist .rx-exchange {
  display: block;
  max-width: 42rem;
  margin: 0 auto;
}

.page--receptionist .rx-exchange .rx-spec__sheet {
  padding: clamp(1.3rem, 2.2vw, 1.9rem) clamp(1.3rem, 2.2vw, 1.9rem) clamp(1.2rem, 2vw, 1.6rem);
}

/* the conversation, at the top of the sheet */
.page--receptionist .rx-exchange__lines {
  display: grid;
  gap: 0.45rem;
  justify-self: auto;
  width: auto;
  margin: 0 0 1.1rem;
  padding: 0 0 1.1rem;
  border-bottom: 1px solid rgb(36 33 30 / 12%);
  list-style: none;
}

.page--receptionist .rx-exchange__ask,
.page--receptionist .rx-exchange__reply {
  max-width: 30ch;
  padding: 0.5rem 0.85rem;
  font-size: 0.9rem;
  line-height: 1.45;
}

/* on the cream sheet the asks are ink glass, not midnight blocks */
.page--receptionist .rx-exchange__ask {
  justify-self: start;
  border-radius: 4px 14px 14px 14px;
  border: 1px solid rgb(36 33 30 / 12%);
  background: rgb(36 33 30 / 5%);
  color: var(--rx-ink);
}

/* the visitor's reply is the Assistant's own oxblood */
.page--receptionist .rx-exchange__reply {
  justify-self: end;
  border-radius: 14px 4px 14px 14px;
  border: 0;
  background: var(--rx-oxblood);
  color: #f7f4ed;
  font-weight: 700;
}

.page--receptionist .rx-exchange__cap {
  display: block;
  grid-column: auto;
  margin: 0.8rem auto 0;
  color: #ada69a;
  font-size: 0.875rem;
  text-align: center;
}

/* the seal keeps clear of the first bubble */
.page--receptionist .rx-exchange .rx-spec__seal { top: -1.2rem; right: 1.2rem; }

.page--receptionist .rx-exchange .rx-spec__tag { padding-right: 0; }

/* -- rx10 responsive -------------------------------------------------------- */

@media (max-width: 62em) {
  .page--receptionist .rx-exchange { max-width: 34rem; }
  .page--receptionist .rx-exchange__lines { justify-self: auto; }
}

@media (max-width: 48em) {
  .page--receptionist .rx-exchange__ask,
  .page--receptionist .rx-exchange__reply { max-width: 24ch; }
}

@media (prefers-reduced-motion: reduce) {
  .page--receptionist .rx-hero__frame { transition: none !important; }
}

/* ==========================================================================
   rx11 — 20 August 2026: the review rotator, replacing the single testimony.

   The 21st.dev "animated-testimonials" method, rebuilt framework-free (this
   site is static HTML: no React, no Tailwind, no shadcn — see the vanilla
   component conversion rule). Same behaviour: cards crossfade and slide, a
   dot rail selects, it auto-rotates and pauses on hover and focus.

   EVIDENCE RULE. Every card is a REAL Google review: real name, real date,
   real wording, and its own source link. No photograph of any of these
   people exists in this build, and inventing one (stock or generated) would
   put a stranger's face against a real person's name. So each card carries a
   seeded initial avatar instead (Design Authority 10.3) — stable between
   loads, never a missing-image hole.
   ========================================================================== */

.page--receptionist .rx-voices {
  display: grid;
  gap: 1rem;
  align-content: center;
}

/* the Google lockup, as one aligned plate rather than logo + number adrift */
.page--receptionist .rx-voices__mark {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem;
  margin: 0;
  max-width: none;
  padding: 0.6rem 0.95rem;
  border: 1px solid var(--rx-rule);
  border-radius: 999px;
  background: var(--rx-cream);
  box-shadow: 0 10px 26px rgba(36, 33, 30, 0.06);
  width: fit-content;
}

.page--receptionist .rx-voices__g { width: 20px; height: 20px; flex: none; }
.page--receptionist .rx-voices__mark strong { font-size: 1rem; font-weight: 800; }
.page--receptionist .rx-voices__mark span { color: var(--rx-ink-soft); font-size: 0.875rem; }

.page--receptionist .rx-voices__mark a {
  margin-left: auto;
  padding-left: 0.6rem;
  color: var(--rx-oxblood);
  font-size: 0.875rem;
  font-weight: 800;
  text-decoration: none;
}

@media (hover: hover) {
  .page--receptionist .rx-voices__mark a:hover { text-decoration: underline; text-underline-offset: 0.24em; }
}

/* the stack: every card occupies the same cell, one is on */
.page--receptionist .rx-voices__stack {
  display: grid;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page--receptionist .rx-voice {
  grid-area: 1 / 1;
  padding: clamp(1.2rem, 2.2vw, 1.7rem);
  border-radius: var(--rx-radius-plate);
  border: 1px solid var(--rx-rule);
  background: var(--rx-cream);
  box-shadow: 0 12px 28px rgba(36, 33, 30, 0.07);
  opacity: 0;
  transform: translateX(28px) scale(0.97);
  pointer-events: none;
  transition: opacity 520ms ease, transform 520ms var(--rx-ease);
}

.page--receptionist .rx-voice.is-on {
  opacity: 1;
  transform: none;
  pointer-events: auto;
  position: relative;
  z-index: 2;
}

.page--receptionist .rx-voice figure { margin: 0; display: grid; gap: 0.7rem; }

.page--receptionist .rx-voice__stars {
  /* the star row is decorative (the rating is stated in words beneath it), so
     3:1 would suffice, but it is taken past 4.5:1 to match every other mark */
  color: #8e2938;
  font-size: 0.95rem;
  letter-spacing: 0.1em;
  line-height: 1;
}

.page--receptionist .rx-voice blockquote { margin: 0; }

.page--receptionist .rx-voice blockquote::before {
  content: "\201C";
  display: block;
  margin-bottom: 0.2rem;
  font-family: "Gloock", Georgia, serif;
  font-size: 2.4rem;
  line-height: 0.7;
  color: var(--rx-oxblood);
}

.page--receptionist .rx-voice blockquote p {
  margin: 0;
  max-width: 46ch;
  color: var(--rx-ink);
  font-size: 1rem;
  line-height: 1.65;
}

.page--receptionist .rx-voice figcaption {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.8rem;
  padding-top: 0.8rem;
  border-top: 1px solid var(--rx-rule);
}

/* seeded initial avatar — no photograph is invented for a real person */
.page--receptionist .rx-voice__avatar {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  color: #f7f4ed;
  font-family: "Gloock", Georgia, serif;
  font-size: 1.02rem;
  letter-spacing: 0.02em;
}

.page--receptionist .rx-voice__avatar--a { background: var(--rx-night); color: var(--rx-gold); }
.page--receptionist .rx-voice__avatar--b { background: var(--rx-oxblood); }
.page--receptionist .rx-voice__avatar--c { background: var(--rx-night-lift); color: var(--rx-gold); }
.page--receptionist .rx-voice__avatar--d { background: #4c463f; }

.page--receptionist .rx-voice__who strong {
  display: block;
  color: var(--rx-ink);
  font-size: 0.95rem;
  font-weight: 800;
}

.page--receptionist .rx-voice__who small {
  display: block;
  color: var(--rx-ink-soft);
  font-size: 0.82rem;
  line-height: 1.4;
}

.page--receptionist .rx-voice__source {
  display: inline-flex;
  align-items: center;
  min-height: var(--rx-tap);
  padding: 0 1rem;
  border: 1px solid var(--rx-rule);
  border-radius: 999px;
  color: var(--rx-ink);
  font-size: 0.85rem;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

.page--receptionist .rx-voice__source::after { content: "\2192"; margin-left: 0.4rem; color: var(--rx-oxblood); }

@media (hover: hover) {
  .page--receptionist .rx-voice__source:hover { background: rgb(36 33 30 / 6%); }
}

/* the dot rail: the live one stretches, exactly like the reference */
.page--receptionist .rx-voices__dots {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-height: var(--rx-tap);
}

.page--receptionist .rx-voices__dot {
  width: 10px;
  height: 10px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgb(36 33 30 / 24%);
  cursor: pointer;
  transition: width 320ms var(--rx-ease), background-color 320ms var(--rx-ease);
}

.page--receptionist .rx-voices__dot.is-on {
  width: 34px;
  background: var(--rx-oxblood);
}

/* the dot itself is small, so its HIT AREA is padded to 48px instead */
.page--receptionist .rx-voices__dot::before {
  content: "";
  position: absolute;
  width: 48px;
  height: 48px;
  transform: translate(-50%, -50%);
  margin-left: 5px;
  margin-top: 5px;
}

.page--receptionist .rx-voices__dot { position: relative; }

@media (prefers-reduced-motion: reduce) {
  .page--receptionist .rx-voice,
  .page--receptionist .rx-voices__dot { transition: none !important; }
  .page--receptionist .rx-voice { transform: none; }
}

@media print {
  /* print every review, not just the live one */
  .page--receptionist .rx-voice { opacity: 1 !important; transform: none !important; position: static; }
  .page--receptionist .rx-voices__stack { display: grid; gap: 0.8rem; }
  .page--receptionist .rx-voices__dots { display: none; }
}

/* ==========================================================================
   rx12 — 20 August 2026: width, and the typesetting.

   Aarav: "the width, there is too much space on the right and left, reduce
   the width" and "the fonts make it look like they are AI, and the features,
   can you fix that."

   MEASURED FIRST, both times:

   1. WIDTH. At 1920 the hero island ran 1640px but its card was 672px, so it
      filled 44 percent of its own island and left 436px of dead navy on EACH
      side. The islands were not too wide for the page, they were too wide for
      their content. Shell comes in to 1280 and the hero card goes out to
      52rem, so content fills the canvas instead of floating in it.

   2. THE "AI" READ IS THE TYPESETTING, NOT THE TYPEFACES. Gloock and Manrope
      are the site's brand faces (the Seller's Guide sets them) and are not
      changed here. What read as generated was the recipe around them:
        - 26 uppercase letter-spaced micro-labels across one page, running at
          EIGHT different tracking values (1.15px to 1.89px). Wide-tracked
          small caps on every single element is the SaaS-template tell, and
          eight values means it was never one considered decision. Now one
          token, --rx-track, at a much quieter 0.085em.
        - A weak display jump: h1 73.6px against h2 44.8px is only 1.64x, so
          nothing dominated. The hero now leads properly and the section heads
          step down beneath it.
        - Every paragraph centred at a narrow measure forms a tidy symmetrical
          pyramid. text-wrap: pretty breaks that; headings keep balance.
   ========================================================================== */

.page--receptionist {
  /* the shell comes in so content fills its island */
  --rx-shell: min(92vw, 1280px);
  /* ONE tracking value for every uppercase label on the page */
  --rx-track: 0.085em;
}

/* -- the display hierarchy earns its jump ---------------------------------- */

.page--receptionist .rx-hero__title {
  font-size: clamp(2.9rem, 2rem + 3.6vw, 5.4rem);
  letter-spacing: -0.035em;
  line-height: 1;
}

.page--receptionist .rx-h2 {
  font-size: clamp(1.85rem, 1.35rem + 1.45vw, 2.5rem);
  letter-spacing: -0.03em;
  line-height: 1.05;
}

/* the honesty island is the page's plain-speaking moment, so it takes a
   larger head than the light islands rather than matching them */
.page--receptionist .rx-honest .rx-h2 {
  font-size: clamp(2.1rem, 1.5rem + 1.9vw, 3.05rem);
}

.page--receptionist .rx-hero__statement {
  letter-spacing: -0.015em;
}

/* -- one tracking token, quietly set --------------------------------------- */

.page--receptionist .rx-kicker,
.page--receptionist .rx-step__actor,
.page--receptionist .rx-step__hold,
.page--receptionist .rx-route__number,
.page--receptionist .rx-honest__label,
.page--receptionist .rx-direct__channel,
.page--receptionist .rx-direct__office-label,
.page--receptionist .rx-spec__tag span,
.page--receptionist #dukes-receptionist .reception__eyebrow,
.page--receptionist #dukes-receptionist .reception__asks,
.page--receptionist #dukes-receptionist .crail__tip-label,
.page--receptionist #dukes-receptionist .crail__label {
  letter-spacing: var(--rx-track);
}

/* the kicker sits quieter above its heading than it did */
.page--receptionist .rx-kicker {
  margin-bottom: 0.55rem;
  font-size: 0.71rem;
  font-weight: 800;
}

/* -- paragraphs stop forming pyramids -------------------------------------- */

.page--receptionist .main p,
.page--receptionist #dukes-receptionist p {
  text-wrap: pretty;
}

.page--receptionist .rx-head__intro {
  max-width: 54ch;
  font-size: 1rem;
  line-height: 1.62;
}

.page--receptionist .rx-hero__lede { max-width: 54ch; }

/* -- the hero fills its island --------------------------------------------- */

.page--receptionist .rx-hero__lockup { max-width: 66ch; }

.page--receptionist .rx-exchange { max-width: min(100%, 52rem); }

/* the sheet grows with the card, so the summary rows breathe */
.page--receptionist .rx-exchange .rx-spec__row {
  grid-template-columns: minmax(10rem, 0.42fr) 1fr;
}

.page--receptionist .rx-exchange__ask,
.page--receptionist .rx-exchange__reply { max-width: 34ch; }

/* -- rx12 responsive -------------------------------------------------------- */

@media (max-width: 62em) {
  .page--receptionist .rx-exchange { max-width: 34rem; }
}

@media (max-width: 48em) {
  .page--receptionist .rx-exchange__ask,
  .page--receptionist .rx-exchange__reply { max-width: 24ch; }
  .page--receptionist .rx-exchange .rx-spec__row { grid-template-columns: 1fr; }
}

/* ==========================================================================
   rx13 — 20 August 2026: the closing band, recoloured and re-animated.

   Aarav: "the Dukes Assistant box is ugly, the gold and the blue do not look
   good at all, the animations are not cutting it, get rid of the text Every
   route below works without JavaScript, use a different colourway."

   COLOURWAY — the Assistant OWN RED. Gold on ink was the problem: two accents
   fighting on a dark ground, on the same navy as two islands above it. This
   band now takes the oxblood the widget itself runs (--da-oxblood #8e2938 to
   #6f1f2b), so the page closing moment is the same colour as the launcher
   that opens it. NO GOLD anywhere on this band, and no navy.

   SURFACE — two states, not five identical boxes: a closed route is warm
   glass with cream type; the OPEN one turns to a cream sheet with ink type.
   The plate changing material IS the reveal.

   LAYOUT — single column. In two columns an opened row left a hole beside it
   (grid rows are as tall as their tallest cell), which is what made the box
   look broken.

   ANIMATION — driven by CSS animation, not transition: a details body is
   display:none while closed, so a transition from the closed state never
   runs. The body unfolds with a clip-path wipe and the question chips pop in
   sequence behind it.
   ========================================================================== */

/* the shared component no-JS note, retired on this page */
.page--receptionist #dukes-receptionist .crail__intro { display: none; }

.page--receptionist #dukes-receptionist.reception {
  border-color: rgb(245 242 235 / 24%);
  background-color: #6f1f2b;
  background-image:
    radial-gradient(125% 115% at 10% 106%, rgb(142 41 56 / 92%) 0%, rgb(142 41 56 / 0%) 62%),
    linear-gradient(162deg, #8e2938 0%, rgb(111 31 43 / 0%) 60%);
  color: #f7f4ed;
}

/* -- the lockup, no gold ---------------------------------------------------- */

.page--receptionist #dukes-receptionist .reception__eyebrow { color: rgb(247 244 237 / 78%); }
.page--receptionist #dukes-receptionist .h-section { color: #f7f4ed; }
.page--receptionist #dukes-receptionist .reception__notice { color: rgb(247 244 237 / 86%); }
.page--receptionist #dukes-receptionist .reception__notice:last-of-type { color: rgb(247 244 237 / 72%); }

/* -- single column: an open row can never leave a hole ---------------------- */

.page--receptionist #dukes-receptionist ol.reception__routes {
  grid-template-columns: 1fr;
}

.page--receptionist #dukes-receptionist ol.reception__routes > li:nth-child(5) {
  grid-column: auto;
}

/* -- closed: warm glass. open: a cream sheet -------------------------------- */

.page--receptionist #dukes-receptionist .reception__disclosure {
  border-color: rgb(247 244 237 / 26%);
  background: rgb(247 244 237 / 10%);
  transition: background-color 320ms var(--rx-ease), border-color 320ms var(--rx-ease),
    transform 220ms var(--rx-ease);
}

.page--receptionist #dukes-receptionist .reception__disclosure[open] {
  background: var(--rx-cream);
  border-color: var(--rx-cream);
}

@media (hover: hover) and (pointer: fine) {
  .page--receptionist #dukes-receptionist .reception__disclosure:hover {
    background: rgb(247 244 237 / 16%);
    border-color: rgb(247 244 237 / 44%);
    transform: translateY(-2px);
  }
  .page--receptionist #dukes-receptionist .reception__disclosure[open]:hover {
    background: var(--rx-cream);
    border-color: var(--rx-cream);
    transform: none;
  }
}

.page--receptionist #dukes-receptionist .reception__summary { color: #f7f4ed; }
.page--receptionist #dukes-receptionist .reception__label { color: #f7f4ed; }

.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__summary,
.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__label {
  color: var(--rx-ink);
}

/* the caret: cream ring on glass, oxblood ring on the opened sheet */
.page--receptionist #dukes-receptionist .reception__caret {
  border-color: rgb(247 244 237 / 55%);
  background: transparent;
}

.page--receptionist #dukes-receptionist .reception__caret::before {
  border-right-color: #f7f4ed;
  border-bottom-color: #f7f4ed;
}

.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__caret {
  border-color: rgb(142 41 56 / 45%);
  background: rgb(142 41 56 / 10%);
}

.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__caret::before {
  border-right-color: var(--rx-oxblood);
  border-bottom-color: var(--rx-oxblood);
}

/* -- the opened body, on paper ---------------------------------------------- */

.page--receptionist #dukes-receptionist .reception__body {
  border-top-color: rgb(36 33 30 / 14%);
  padding-left: clamp(1.05rem, 1.8vw, 1.4rem);
}

/* the gold rule device retires with the gold */
.page--receptionist #dukes-receptionist .reception__body::before { content: none; }

.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__outcome { color: var(--rx-ink); }
.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__asks { color: var(--rx-oxblood); }

.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__questions li {
  border-color: rgb(36 33 30 / 14%);
  background: rgb(36 33 30 / 5%);
  color: #4c463f;
}

.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__safety,
.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__end {
  color: var(--rx-ink-soft);
}

/* -- the animation: a wipe, then the chips land ----------------------------- */

@keyframes rx-unfold {
  from { opacity: 0; clip-path: inset(0 0 100% 0); transform: translateY(-4px); }
  to   { opacity: 1; clip-path: inset(0 0 0 0); transform: none; }
}

@keyframes rx-chip {
  from { opacity: 0; transform: translateY(6px) scale(0.96); }
  to   { opacity: 1; transform: none; }
}

.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__body {
  animation: rx-unfold 400ms var(--rx-ease) both;
}

.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__questions li {
  animation: rx-chip 300ms var(--rx-ease) both;
}

.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__questions li:nth-child(1) { animation-delay: 170ms; }
.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__questions li:nth-child(2) { animation-delay: 215ms; }
.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__questions li:nth-child(3) { animation-delay: 260ms; }
.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__questions li:nth-child(4) { animation-delay: 305ms; }
.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__questions li:nth-child(5) { animation-delay: 350ms; }
.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__questions li:nth-child(6) { animation-delay: 395ms; }
.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__questions li:nth-child(7) { animation-delay: 440ms; }
.page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__questions li:nth-child(8) { animation-delay: 485ms; }

/* -- the contact rail on red ------------------------------------------------ */

.page--receptionist #dukes-receptionist .reception__routes--safe {
  border-top-color: rgb(247 244 237 / 26%);
}

.page--receptionist #dukes-receptionist .crail__item {
  border-color: rgb(247 244 237 / 24%);
  background: rgb(247 244 237 / 9%);
}

@media (hover: hover) and (pointer: fine) {
  .page--receptionist #dukes-receptionist .crail__item:hover {
    border-color: rgb(247 244 237 / 52%);
    background: rgb(247 244 237 / 16%);
  }
}

.page--receptionist #dukes-receptionist .crail__link {
  background: rgb(247 244 237 / 14%);
  color: #f7f4ed;
}

.page--receptionist #dukes-receptionist .crail__icon { color: #f7f4ed; }

.page--receptionist #dukes-receptionist .crail__tip-label,
.page--receptionist #dukes-receptionist .crail__label { color: rgb(247 244 237 / 78%); }

.page--receptionist #dukes-receptionist .crail__tip-value,
.page--receptionist #dukes-receptionist .crail__value { color: #f7f4ed; }

/* -- rx13 motion discipline -------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  .page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__body,
  .page--receptionist #dukes-receptionist .reception__disclosure[open] .reception__questions li {
    animation: none !important;
  }
  .page--receptionist #dukes-receptionist .reception__disclosure:hover { transform: none; }
}

/* the asks label lives only on an opened cream sheet, so it is oxblood in
   every state: no gold token survives anywhere on this band. */
.page--receptionist #dukes-receptionist .reception__asks { color: var(--rx-oxblood); }

/* rx14 — the crown seal matches the launcher (Aarav: the logo needs to be
   red). The launcher runs --da-oxblood with a 1px cream-24% ring; the seal
   now carries the same fill and ring, so the seal on the specimen and the
   button that opens the Assistant read as the same mark. */
.page--receptionist .rx-spec__seal {
  /* the launcher is NOT --da-oxblood: dukes-assistant.css line 760 bumps it
     to #8e2938 !important, a step brighter so it reads as red. The seal takes
     that same value, so the mark on the specimen and the button that opens
     the Assistant are identical reds side by side. */
  background: #8e2938;
  border: 1px solid rgb(245 242 235 / 24%);
  box-shadow: 0 0 0 4px rgb(142 41 56 / 18%), 0 20px 42px -16px rgb(36 33 30 / 60%);
}
