/* ======================================================================
 * DUKES ASSISTANT — shared across every page. 19 August 2026.
 *
 * Aarav: "make it a round thing and in the middle have the crown, not
 * square", "the text ... make it come but fade in with animation",
 * "make it stay", "add this to all the other pages because it needs to
 * remain consistent".
 *
 * Deliberately UNSCOPED so one component serves the whole site. Loaded
 * after dukes.css, so these rules win on order without needing !important
 * or a specificity fight. The page-scoped copies in home-2026.css carry
 * identical values, so the two agree wherever both apply.
 * ====================================================================== */

:root {
  --da-oxblood: #7b2430;
  --da-oxblood-lift: #94303c;
  --da-navy: #0d1d31;
  --da-cream: #fbf8f2;
  --da-paper: #f2ede4;
  --da-ink: #171a20;
  --da-ink-soft: #4f555b;
  --da-tap: 48px;
}

/* ---------------------------------------------------------------- *
 * 1 — THE LAUNCHER IS A CIRCLE WITH THE CROWN IN IT
 * It was a wide rectangular card carrying a label and a sub-label. It is
 * now a single round button, crown centred, the way every chat widget
 * people already recognise behaves. The words move to the greeting
 * bubble, which is where they belong.
 * ---------------------------------------------------------------- */
.launcher {
  position: fixed;
  right: clamp(14px, 2vw, 28px);
  bottom: clamp(14px, 2vw, 28px);
  z-index: 60;
  display: grid;
  place-items: center;
  /* 19 Aug 2026, Aarav: the receptionist reads too big on laptop
     screens — one notch down across launcher, bubble and panel. */
  width: 56px;
  height: 56px;
  padding: 0;
  border-radius: 50%;
  background: var(--da-oxblood);
  border: 1px solid rgba(251, 248, 242, 0.24);
  box-shadow: 0 20px 42px -16px rgba(13, 29, 49, 0.6);
  text-decoration: none;
  overflow: hidden;
  transition: transform 0.22s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.2s ease, box-shadow 0.22s ease;
}
/* The label and sub-label are not deleted — a screen reader still reads
   them — they are simply taken out of the visual button. */
.launcher__label {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.launcher__glyph {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  background: none;
}
.launcher__crown {
  width: 28px;
  height: auto;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.35));
}
/* The glint stays — Aarav asked for the light to remain — but it now
   sweeps a circle rather than a card. */
.launcher__glint {
  position: absolute;
  inset: -40%;
  background: linear-gradient(115deg, transparent 42%, rgba(255, 255, 255, 0.34) 50%, transparent 58%);
  transform: translateX(-60%);
  animation: da-glint 5.5s ease-in-out infinite;
  pointer-events: none;
}
@keyframes da-glint {
  0%, 62%   { transform: translateX(-60%); }
  78%, 100% { transform: translateX(60%); }
}
@media (hover: hover) and (pointer: fine) {
  .launcher:hover { background: var(--da-oxblood-lift); transform: translateY(-3px) scale(1.04); box-shadow: 0 26px 54px -18px rgba(13, 29, 49, 0.68); }
}
.launcher:active { transform: translateY(0) scale(0.98); }
.launcher:focus-visible { outline: 3px solid #d8b56d; outline-offset: 4px; }

/* ---------------------------------------------------------------- *
 * 2 — THE GREETING BUBBLE. Fades in, and stays.
 * ---------------------------------------------------------------- */
.dbubble {
  position: fixed;
  right: clamp(14px, 2vw, 28px);
  bottom: calc(clamp(14px, 2vw, 28px) + 70px);
  z-index: 61;
  width: min(19rem, calc(100vw - 2.5rem));
  padding: 0.9rem 1rem 0.85rem;
  border-radius: 20px 20px 6px 20px;
  background: var(--da-cream);
  border: 1px solid rgba(123, 36, 48, 0.2);
  box-shadow: 0 30px 60px -26px rgba(13, 29, 49, 0.55);
  /* 19 Aug fix — the visible state must never depend on an animation
     completing. Base state is VISIBLE; the keyframe only fades it in from
     transparent. If the animation never runs, the greeting still shows. */
  opacity: 1;
  transform: none;
  animation: da-fade-in 520ms cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes da-fade-in {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
.dbubble.is-leaving {
  animation: da-fade-out 220ms ease forwards;
}
@keyframes da-fade-out {
  to { opacity: 0; transform: translateY(6px); }
}
.dbubble p {
  margin: 0 1.2rem 0.7rem 0;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--da-ink);
}
.dbubble__x {
  position: absolute;
  top: -9px; right: -9px;
  width: 26px; height: 26px;
  border: 0;
  border-radius: 50%;
  background: var(--da-oxblood);
  color: var(--da-cream);
  font-size: 1.05rem;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 8px 18px -8px rgba(13, 29, 49, 0.6);
}
.dbubble__x:hover { background: var(--da-oxblood-lift); }
.dbubble__go {
  min-height: 40px;
  padding: 0.45rem 0.9rem;
  border: 0;
  border-radius: 8px;
  background: var(--da-oxblood);
  color: var(--da-cream);
  font: inherit;
  font-size: 0.84rem;
  font-weight: 750;
  cursor: pointer;
}
.dbubble__go:hover { background: var(--da-oxblood-lift); }

/* ---------------------------------------------------------------- *
 * 3 — THE PANEL, one colour family end to end
 * ---------------------------------------------------------------- */
.dchat {
  position: fixed;
  right: clamp(14px, 2vw, 28px);
  bottom: clamp(14px, 2vw, 28px);
  z-index: 80;
  display: flex;
  flex-direction: column;
  width: min(25.5rem, calc(100vw - 2rem));
  height: min(36rem, calc(100vh - 4rem));
  border-radius: 22px;
  overflow: hidden;
  background: var(--da-cream);
  border: 1px solid rgba(13, 29, 49, 0.16);
  box-shadow: 0 40px 90px -40px rgba(13, 29, 49, 0.7);
  transform-origin: 100% 100%;
  animation: da-pop 300ms cubic-bezier(0.22, 1.28, 0.5, 1) both;
}
.dchat[hidden] { display: none; }
@keyframes da-pop {
  from { opacity: 0; transform: translateY(18px) scale(0.94); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

.dchat__head { display: flex; align-items: center; gap: 0.65rem; padding: 0.8rem 0.9rem; background: var(--da-oxblood); color: var(--da-cream); }
.dchat__mark { display: grid; place-items: center; width: 36px; height: 36px; flex: none; border-radius: 50%; background: rgba(251, 248, 242, 0.16); }
.dchat__mark img { width: 21px; height: auto; }
.dchat__title { display: grid; gap: 0.1rem; min-width: 0; }
.dchat__title strong { font-size: 0.98rem; font-weight: 750; }
.dchat__title span { font-size: 0.76rem; color: rgba(251, 248, 242, 0.78); line-height: 1.35; }
.dchat__close { margin-left: auto; flex: none; width: 44px; height: 44px; border: 0; border-radius: 50%; background: transparent; color: var(--da-cream); font-size: 1.6rem; line-height: 1; cursor: pointer; }
.dchat__close:hover { background: rgba(251, 248, 242, 0.16); }

.dchat__log { flex: 1 1 auto; overflow-y: auto; padding: 0.9rem; display: flex; flex-direction: column; gap: 0.55rem; background: var(--da-paper); }
.dchat__msg { display: flex; }
.dchat__msg p { margin: 0; max-width: 88%; padding: 0.6rem 0.85rem; font-size: 0.9rem; line-height: 1.5; }
.dchat__msg--bot p, .dchat__msg--bot .dchat__typing { border-radius: 14px 14px 14px 4px; background: #fffdf8; border: 1px solid rgba(23, 26, 32, 0.12); color: var(--da-ink); }
.dchat__msg--me { justify-content: flex-end; }
.dchat__msg--me p { border-radius: 14px 14px 4px 14px; background: var(--da-oxblood); border: 1px solid var(--da-oxblood); color: var(--da-cream); }

.dchat__typing { display: inline-flex; align-items: center; gap: 0.28rem; padding: 0.85rem 1rem; }
.dchat__typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--da-ink-soft); animation: da-blink 1.25s infinite ease-in-out both; }
.dchat__typing span:nth-child(2) { animation-delay: 0.18s; }
.dchat__typing span:nth-child(3) { animation-delay: 0.36s; }
@keyframes da-blink { 0%, 80%, 100% { opacity: 0.28; } 40% { opacity: 1; } }

.dchat__summary { margin-top: 0.2rem; padding: 0.85rem 0.95rem; border-radius: 14px; background: #fffdf8; border: 1px solid rgba(23, 26, 32, 0.14); }
.dchat__summary-kind { margin: 0 0 0.5rem; color: var(--da-oxblood); font-size: 0.7rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.dchat__summary dl { margin: 0; }
.dchat__summary dl > div { display: grid; grid-template-columns: 8.2rem minmax(0, 1fr); gap: 0.6rem; padding: 0.34rem 0; border-top: 1px solid rgba(23, 26, 32, 0.09); }
.dchat__summary dt { margin: 0; font-size: 0.78rem; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; color: var(--da-ink-soft); }
.dchat__summary dd { margin: 0; font-size: 0.94rem; color: var(--da-ink); }

.dchat__reply { flex: none; padding: 0.75rem; background: var(--da-cream); border-top: 1px solid rgba(23, 26, 32, 0.1); }
.dchat__chips { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.dchat__chip { min-height: 40px; padding: 0.45rem 0.85rem; border: 1px solid rgba(23, 26, 32, 0.22); border-radius: 999px; background: #fff; color: var(--da-ink); font: inherit; font-size: 0.86rem; font-weight: 650; cursor: pointer; transition: background-color 0.16s ease, border-color 0.16s ease, transform 0.14s ease; }
.dchat__chip:hover { background: #f6e3e6; border-color: rgba(123, 36, 48, 0.5); transform: translateY(-1px); }
.dchat__form { display: flex; gap: 0.4rem; }
.dchat__input { flex: 1 1 auto; min-width: 0; min-height: 44px; padding: 0.5rem 0.75rem; border: 1px solid rgba(23, 26, 32, 0.22); border-radius: 10px; font: inherit; font-size: 0.95rem; background: #fff; color: var(--da-ink); }
.dchat__input:focus-visible { outline: 3px solid #d8b56d; outline-offset: 1px; }
.dchat__send { flex: none; min-height: 44px; padding: 0 1rem; border: 0; border-radius: 10px; background: var(--da-oxblood); color: var(--da-cream); font: inherit; font-size: 0.88rem; font-weight: 750; cursor: pointer; }
.dchat__send:hover { background: var(--da-oxblood-lift); }

.dchat__routes { display: grid; gap: 0.4rem; }
.dchat__route { display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 0.45rem 0.85rem; border: 1px solid rgba(23, 26, 32, 0.2); border-radius: 10px; background: #fff; color: var(--da-ink); font-size: 0.88rem; font-weight: 750; text-decoration: none; }
.dchat__route--primary { background: var(--da-oxblood); border-color: var(--da-oxblood); color: var(--da-cream); }
.dchat__route--primary:hover { background: var(--da-oxblood-lift); }
.dchat__restart { min-height: 40px; border: 0; background: none; color: var(--da-ink-soft); font: inherit; font-size: 0.8rem; text-decoration: underline; text-underline-offset: 0.28em; cursor: pointer; }

.dchat__foot { flex: none; margin: 0; padding: 0.6rem 1rem; background: var(--da-cream); border-top: 1px solid rgba(23, 26, 32, 0.09); color: var(--da-ink-soft); font-size: 0.76rem; }
.dchat__foot a { color: var(--da-oxblood); }

body.has-dchat-open .launcher { display: none; }

@media (max-width: 32em) {
  .dchat { right: 0; left: 0; bottom: 0; width: 100%; height: 90vh; border-radius: 20px 20px 0 0; transform-origin: 50% 100%; }
  .dbubble { bottom: calc(clamp(14px, 2vw, 28px) + 66px); }
}
@media (prefers-reduced-motion: reduce) {
  .launcher, .dbubble, .dchat { animation: none !important; transition: none !important; }
  .launcher__glint { animation: none; opacity: 0; }
  .dchat__typing span { animation: none; opacity: 0.5; }
}

/* ---- 19 Aug, round five ------------------------------------------------
   "there is a square around the crown, get rid of that."
   dukes.css paints a plate behind .launcher__glyph and the crown PNG sits
   on its own matte. Both are cleared here, and the artwork is masked to a
   circle so no corner of the source image can show against the button. */
.launcher__glyph,
.launcher .launcher__glyph {
  background: none !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
}
.launcher__crown,
.launcher .launcher__crown {
  background: none !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  mix-blend-mode: normal;
  /* the source PNG carries a solid matte; clipping to a circle inside the
     button removes the visible square without touching the artwork file */
  clip-path: circle(48% at 50% 50%);
}
/* Belt and braces: nothing in this component may be left invisible by a
   motion preference. Reduced motion removes the movement, never the text. */
@media (prefers-reduced-motion: reduce) {
  .dbubble { opacity: 1 !important; transform: none !important; }
  .dchat   { opacity: 1 !important; transform: none !important; }
}
/* ======================================================================
 * THE REASON IT WAS NOT SHOWING — and the override. 19 August.
 *
 * dukes.css carries explicit kill rules for the launcher on at least a
 * dozen routes, e.g.
 *     .page--sellers-guide .launcher { display: none !important; }
 *     .page--tenant-fees   .launcher { display: none !important; }
 *     .page--about         .launcher { display: none !important; }
 *     [data-page="managed-portfolio"] .launcher { display: none !important; }
 * Those are 0,2,0 WITH !important. The base rule in this file is 0,1,0
 * with none, so it lost on every one of those pages: the module built the
 * launcher and the greeting appeared, while CSS deleted the button.
 *
 * `html body .launcher[data-launcher]` is 0,2,2 with !important, which
 * outranks every one of them. Scoped to [data-launcher] so it can only
 * ever affect the real assistant button.
 * ==================================================================== */
html body .launcher[data-launcher] {
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
  place-items: center !important;
  width: 68px !important;
  height: 68px !important;
  border-radius: 50% !important;
  background: var(--da-oxblood) !important;
}
/* the one case that must still win: the panel is open */
html body.has-dchat-open .launcher[data-launcher] { display: none !important; }

/* those same page rules also hid the crown itself */
html body .launcher[data-launcher] .launcher__glyph {
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  background: none !important;
}
html body .launcher[data-launcher] .launcher__crown { display: block !important; width: 34px !important; }
/* ---- CROWN SIZING, corrected 19 Aug -------------------------------
   Verified the artwork: dukes-crown.png is RGBA, 252x182, corners fully
   transparent, 45.6% of pixels transparent. So the square never came from
   the image — it was the .launcher__glyph plate in dukes.css, which is
   already overridden. The circular clip I added was therefore doing no
   useful work AND cropping the crown's wide edges, which is why it looked
   small. Clip removed, artwork enlarged, button opened up to hold it. */
html body .launcher[data-launcher] {
  width: 74px !important;
  height: 74px !important;
}
html body .launcher[data-launcher] .launcher__crown,
.launcher__crown {
  clip-path: none !important;
  width: 46px !important;
  max-width: none !important;
  height: auto !important;
  filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.4));
}
/* the greeting bubble sits clear of the taller button */
.dbubble { bottom: calc(clamp(14px, 2vw, 28px) + 90px); }
/* ======================================================================
 * ROOT CAUSE of "too small" and "off to the right". 19 August.
 *
 * dukes.css holds the launcher in a pre-entrance state:
 *     [data-enhanced] .launcher {
 *       pointer-events: none;
 *       transform: translate3d(0, 10px, 0) scale(0.72);
 *     }
 * and only releases it when its own script sets [data-launcher-in="on"].
 * A launcher this module injects never receives that attribute, so it was
 * stuck at 72% scale, pushed 10px down, and NOT CLICKABLE. That is why the
 * crown looked small and sat low and right of where it belonged — the
 * whole button was scaled and translated, not just the artwork.
 *
 * Everything that positions or sizes the button is pinned here, so no
 * pre-entrance state, padding or grid template from dukes.css can move it.
 * ==================================================================== */
html body .launcher[data-launcher] {
  transform: none !important;
  pointer-events: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
  padding: 0 !important;
  margin: 0 !important;
  gap: 0 !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: 1fr !important;
  place-content: center !important;
  place-items: center !important;
  text-align: center !important;
  line-height: 0 !important;
  will-change: auto !important;
}
/* the crown occupies the single cell and centres in it, whatever dukes.css
   thinks the button's internal layout should be */
html body .launcher[data-launcher] .launcher__glyph {
  grid-area: 1 / 1 !important;
  place-self: center !important;
  justify-content: center !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  line-height: 0 !important;
}
html body .launcher[data-launcher] .launcher__crown {
  display: block !important;
  margin: 0 auto !important;
  transform: none !important;
}
/* hover keeps its lift without reintroducing the pre-entrance transform */
@media (hover: hover) and (pointer: fine) {
  html body .launcher[data-launcher]:hover { transform: translateY(-3px) scale(1.04) !important; }
}
html body .launcher[data-launcher]:active { transform: scale(0.97) !important; }
/* ======================================================================
 * THE CROWN DISAPPEARING — diagnosed in the browser, 19 August.
 * Computed styles on the live page:
 *     .launcher        opacity 1  visible   74x74   OK
 *     .launcher__glyph opacity 0  <-- THE BUG
 *     .launcher__crown opacity 1  46x33  image loaded (natural 252px)
 * dukes.css L10935 [data-enhanced] .launcher .launcher__glyph starts at
 * opacity 0 and is only revealed when its own script sets
 * [data-launcher-in="on"], which an injected launcher never receives.
 * The previous pass neutralised the pre-entrance state on the BUTTON but
 * not on the glyph inside it, so the button showed and the crown did not.
 *
 * Every descendant of the assistant launcher is now pinned visible, so no
 * pre-entrance state anywhere in that subtree can hide the mark again.
 * ==================================================================== */
html body .launcher[data-launcher],
html body .launcher[data-launcher] * {
  opacity: 1 !important;
  visibility: visible !important;
}
html body .launcher[data-launcher] .launcher__glyph,
html body .launcher[data-launcher] .launcher__crown {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  animation: none !important;
  filter: none !important;
  clip-path: none !important;
  display: block !important;
}
html body .launcher[data-launcher] .launcher__glyph {
  display: grid !important;
  place-items: center !important;
}
html body .launcher[data-launcher] .launcher__crown {
  width: 46px !important;
  height: auto !important;
  margin: 0 auto !important;
}
/* the glint is decorative and must stay behind the crown, not over it */
html body .launcher[data-launcher] .launcher__glint {
  opacity: 0.5 !important;
  z-index: 0 !important;
}
html body .launcher[data-launcher] .launcher__glyph { position: relative; z-index: 1 !important; }
/* ======================================================================
 * THE GLINT — bigger, and genuinely continuous. 19 August.
 * Aarav: "the animation needs to be a bit bigger, like a glow line that
 * moves, and it needs to remain constant, it disappears for a split second".
 *
 * The old one was a diagonal band translating across the button: it swept,
 * then SNAPPED back to its start position off-screen, which is the split
 * second where nothing was there. A translation can never loop seamlessly
 * because its start and end positions are different.
 *
 * A rotating conic gradient has no start or end — 360deg is identical to
 * 0deg — so the glow travels round the rim forever with no reset frame.
 * Masked to a ring so it reads as a moving line of light on the edge
 * rather than a wash over the crown.
 * ==================================================================== */
html body .launcher[data-launcher] { overflow: hidden !important; }

html body .launcher[data-launcher] .launcher__glint {
  position: absolute !important;
  inset: -25% !important;
  width: auto !important;
  height: auto !important;
  border-radius: 50% !important;
  opacity: 1 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  transform: none !important;
  /* the moving light: one bright arc, plus a fainter trailing arc so the
     rim never reads as empty on the opposite side */
  background: conic-gradient(
    from 0deg,
    rgba(255, 255, 255, 0)    0deg,
    rgba(255, 236, 190, 0.10) 26deg,
    rgba(255, 244, 214, 0.62) 48deg,
    rgba(255, 255, 255, 0.85) 60deg,
    rgba(255, 244, 214, 0.55) 72deg,
    rgba(255, 236, 190, 0.08) 96deg,
    rgba(255, 255, 255, 0)    150deg,
    rgba(255, 236, 190, 0.16) 210deg,
    rgba(255, 255, 255, 0)    260deg,
    rgba(255, 255, 255, 0)    360deg
  ) !important;
  /* keep it on the rim: a ring, not a filled disc */
  -webkit-mask-image: radial-gradient(circle at 50% 50%, transparent 56%, #000 68%, #000 100%) !important;
          mask-image: radial-gradient(circle at 50% 50%, transparent 56%, #000 68%, #000 100%) !important;
  animation: da-rim-sweep 4.2s linear infinite !important;
}
@keyframes da-rim-sweep {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* a soft steady halo underneath, so the button always has some light on it
   even at the point in the cycle where the bright arc is furthest away */
html body .launcher[data-launcher]::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: 50% !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background: radial-gradient(circle at 32% 26%, rgba(255, 255, 255, 0.20) 0%, rgba(255, 255, 255, 0) 58%) !important;
  animation: none !important;
  opacity: 1 !important;
}

/* the crown stays above all of it */
html body .launcher[data-launcher] .launcher__glyph { position: relative !important; z-index: 2 !important; }

@media (prefers-reduced-motion: reduce) {
  html body .launcher[data-launcher] .launcher__glint { animation: none !important; opacity: 0.45 !important; }
}
/* The glint was measuring 0x0 with no animation running, because dukes.css
   L9376 carries `.launcher__glint { display: none !important; }` (and L6801
   a non-important twin). Opacity and inset were being overridden; display
   was not, so the element was never laid out at all. */
html body .launcher[data-launcher] .launcher__glint {
  display: block !important;
  inset: -25% !important;
  width: auto !important;
  height: auto !important;
}
/* The rim glow was laid out and its animation was RUNNING, but the computed
   transform stayed `none`: an earlier `transform: none !important` on the
   launcher subtree (added to kill dukes.css's pre-entrance scale) also beat
   the animation, because !important declarations outrank animations.
   Animating the independent `rotate` property instead sidesteps that
   entirely, and still leaves the pre-entrance transform neutralised. */
@keyframes da-rim-spin {
  from { rotate: 0deg; }
  to   { rotate: 360deg; }
}
html body .launcher[data-launcher] .launcher__glint {
  transform: none !important;          /* pre-entrance scale stays dead */
  rotate: 0deg;                         /* animated below, not !important */
  animation: da-rim-spin 4.2s linear infinite !important;
  will-change: rotate;
}
@media (prefers-reduced-motion: reduce) {
  html body .launcher[data-launcher] .launcher__glint { animation: none !important; rotate: 20deg; opacity: 0.5 !important; }
}
/* ======================================================================
 * FINAL: the glow moves to a PSEUDO-ELEMENT. 19 August.
 * The .launcher__glint span had accumulated competing !important rules
 * (display:none from dukes.css, transform:none from my own pre-entrance
 * fix, plus a blanket `* { opacity }` rule). !important beats animations,
 * so the keyframes ran while the value stayed pinned. Rather than pile on
 * another override, the glow moves to .launcher::after — a pseudo-element
 * nothing else in the codebase targets, so it animates cleanly.
 * ==================================================================== */
html body .launcher[data-launcher] .launcher__glint { display: none !important; }

html body .launcher[data-launcher]::after {
  content: "";
  position: absolute;
  inset: -26%;
  border-radius: 50%;
  z-index: 1;
  pointer-events: none;
  background: conic-gradient(
    from 0deg,
    rgba(255,255,255,0)     0deg,
    rgba(255,238,196,0.12)  24deg,
    rgba(255,246,220,0.68)  46deg,
    rgba(255,255,255,0.92)  58deg,
    rgba(255,246,220,0.60)  70deg,
    rgba(255,238,196,0.10)  94deg,
    rgba(255,255,255,0)    146deg,
    rgba(255,238,196,0.18) 208deg,
    rgba(255,255,255,0)    258deg,
    rgba(255,255,255,0)    360deg
  );
  -webkit-mask-image: radial-gradient(circle at 50% 50%, transparent 54%, #000 67%, #000 100%);
          mask-image: radial-gradient(circle at 50% 50%, transparent 54%, #000 67%, #000 100%);
  animation: da-rim 4.2s linear infinite;
}
@keyframes da-rim { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

/* the crown must sit above the glow */
html body .launcher[data-launcher] .launcher__glyph { position: relative !important; z-index: 3 !important; }

@media (prefers-reduced-motion: reduce) {
  html body .launcher[data-launcher]::after { animation: none; transform: rotate(28deg); }
}
/* ======================================================================
 * THE ORIGINAL GOLDEN GLOW, RESTORED AND MADE CONTINUOUS. 19 August.
 *
 * Aarav: "we had that golden glow like before, find the original glow we
 * had at the very beginning and add that" — plus the shimmer reference he
 * sent: golden, premium, with a bit of red.
 *
 * The original lives in dukes.css: a registered @property --launcher-angle
 * driving a conic-gradient of saturated brass, masked to the BORDER with
 * mask-composite, a crisp line on ::before and a blurred halo on ::after.
 * It is real and it is good. Two things stopped it:
 *   1. it is gated behind [data-launcher-in="on"] — now set in the JS
 *   2. its keyframes go quiet: opacity drops to 0 from 57% to 100% of a
 *      14s cycle, which is exactly the "disappears for a split second"
 *
 * So: keep the original artwork, replace only the TIMING so the segment
 * travels the rim forever, and warm the palette slightly towards red.
 * My own ::after conic experiment is removed so nothing competes.
 * ==================================================================== */

/* stand my experiment down — the original does this properly */
html body .launcher[data-launcher]::after { background: none; animation: none; }
html body .launcher[data-launcher] .launcher__glint { display: none !important; }

/* the halo must be allowed outside the disc, as the original intends */
html body .launcher[data-launcher] { overflow: visible !important; isolation: isolate; }

/* one continuous circuit: no quiet phase, no reset frame */
@keyframes da-launcher-travel {
  from { --launcher-angle: 0deg; }
  to   { --launcher-angle: 360deg; }
}

html body .launcher[data-launcher]::before,
html body .launcher[data-launcher]::after {
  content: "" !important;
  position: absolute !important;
  inset: -1px !important;
  border-radius: 50% !important;
  pointer-events: none !important;
  opacity: 1 !important;
  /* the original brass segment, with more red carried through the tail */
  background: conic-gradient(
    from var(--launcher-angle),
    transparent 0%,
    rgba(197, 166, 106, 0.35) 2.5%,
    rgba(245, 226, 190, 1)    4%,
    rgba(212, 175, 108, 1)    5.2%,
    rgba(150, 58, 46, 1)      6.4%,
    rgba(176, 106, 60, 0.92)  7.6%,
    rgba(197, 166, 106, 0.30) 8.6%,
    transparent 11.5%
  ) !important;
  /* masked to the rim only, exactly as the original does it */
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important;
  -webkit-mask-composite: xor !important;
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important;
          mask-composite: exclude !important;
  padding: 2px !important;
  z-index: 3 !important;
  animation: da-launcher-travel 6s linear infinite !important;
}
/* the blurred halo behind the crisp line, the original's second layer */
html body .launcher[data-launcher]::after {
  inset: -3px !important;
  padding: 4px !important;
  filter: blur(5px) !important;
  opacity: 0.75 !important;
  z-index: 1 !important;
}
/* crown above both */
html body .launcher[data-launcher] .launcher__glyph { position: relative !important; z-index: 4 !important; }

@media (prefers-reduced-motion: reduce) {
  html body .launcher[data-launcher]::before,
  html body .launcher[data-launcher]::after { animation: none !important; --launcher-angle: 40deg; }
}
/* ======================================================================
 * AMRIT'S LIST — smaller footer, shorter pages. 19 August.
 * Deliberately UNSCOPED so it applies on every page, not just home:
 * Aarav asked for these "on the side too", i.e. site-wide.
 * ==================================================================== */

/* ---- 1 · A SMALLER FOOTER ----
   It was running to ~110px of padding a side with generous link spacing.
   Everything is one step tighter: the column gap, the link rhythm, the
   type sizes and the block padding. No links are removed. */
.site-foot {
  padding-block: clamp(26px, 3vw, 42px) !important;
}
.site-foot__inner { gap: clamp(20px, 2.4vw, 36px) !important; }
.site-foot__nav { gap: clamp(16px, 2vw, 32px) !important; }
.site-foot__heading {
  margin-bottom: 0.5rem !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.12em !important;
}
.site-foot__list { gap: 0.1rem !important; }
.site-foot__list li { margin: 0 !important; }
.site-foot__link {
  display: inline-flex;
  align-items: center;
  min-height: 34px !important;      /* still comfortably tappable in a list */
  padding-block: 0.1rem !important;
  font-size: 0.86rem !important;
  line-height: 1.35 !important;
}
.site-foot__mark { width: clamp(120px, 12vw, 168px) !important; height: auto !important; }
.site-foot__position { font-size: 0.82rem !important; line-height: 1.5 !important; max-width: 42ch; }
.site-foot__office,
.site-foot__office-label { font-size: 0.78rem !important; line-height: 1.45 !important; }
.site-foot__reach { margin-top: 0.75rem !important; }
.site-foot .crail { margin-block: 0.6rem !important; }

/* the strip beneath stays minimal */
.legalstrip { padding-block: 0.5rem !important; font-size: 0.7rem !important; line-height: 1.4 !important; }
.legalstrip__note { max-width: 96ch; margin-inline: auto; opacity: 0.7; }

/* ---- 2 · SHORTER PAGES, EVERYWHERE ----
   One step off the vertical rhythm of every band on every page. This is
   the single biggest lever on length and costs no content. */
.band,
.hx-band,
.spj,
.sgx-hero,
section[class*="__band"] {
  padding-block: clamp(30px, 3.4vw, 52px) !important;
}
/* heading blocks stop reserving so much air beneath them */
.band__head,
.hx-head,
.sgx-phase-heading { margin-bottom: clamp(16px, 1.9vw, 24px) !important; }

/* nothing above may reintroduce a half-viewport plate */
.band > *:last-child,
.hx-band > *:last-child { margin-bottom: 0 !important; }

/* ======================================================================
 * FIX - 19 August 2026: the launcher label comes off every page.
 *
 * The "Speak to Dukes / Five ways to get started" text measured 123px wide
 * at zero height, anchored outside the 58px launcher, so it printed across
 * the crown. It was first clipped on the homepage only; Aarav then found it
 * on /sales/, so it belongs here - this stylesheet is the one every page
 * loads, which makes it the right single place for a launcher fix.
 *
 * CLIPPED, NOT REMOVED. The launcher is an <a> with no aria-label, no
 * aria-labelledby and no title - checked in the browser - so this text is
 * its entire accessible name. display:none would leave a link with no name,
 * which is a worse defect than the one being fixed. The standard clip keeps
 * it for assistive technology and takes it off the screen.
 *
 * Appended rather than edited in place: this file has more than one writer.
 * ==================================================================== */
html body .launcher[data-launcher] .launcher__label,
html body .launcher[data-launcher] .launcher__text,
html body .launcher[data-launcher] .launcher__sub {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}


/* ======================================================================
 * 19 August, Aarav homepage review - the greeting and the crown button.
 *   "make the red a bit more like you could see it"
 *   "move the text a bit more to the left so it looks aligned"
 *   "make the x smaller and put the x in the middle - right now it is
 *    hard to tell it is even there"
 *   "make the text bold or something easier to see, more fashion"
 * ==================================================================== */
html body .launcher[data-launcher] {
  background: #8e2938 !important;                 /* a step brighter, reads as red */
  border: 1px solid rgba(251, 248, 242, 0.42) !important;
  box-shadow: 0 0 0 4px rgba(142, 41, 56, 0.18), 0 20px 42px -16px rgba(13, 29, 49, 0.6) !important;
}
html body .launcher[data-launcher]:hover { background: #a23346 !important; }

.dbubble { padding: 1.15rem 1.15rem 1.05rem; }
.dbubble p {
  margin: 0 2.1rem 0.9rem 0;                     /* clears the smaller x, text sits flush left */
  font-size: 1.02rem;
  font-weight: 650;
  line-height: 1.55;
  color: #1d2024;
  text-align: left;
}
.dbubble__x {
  top: 0.6rem !important;
  right: 0.6rem !important;
  width: 26px !important;
  height: 26px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  font-size: 0.85rem !important;
  line-height: 1 !important;
}
.dbubble__go { font-weight: 800; }

/* ======================================================================
 * 19 August, evening - the chat sized for real laptops. 480x656 was a
 * third of a MacBook screen. The panel now stays a compact card on any
 * display, and the greeting bubble slims with it.
 * ==================================================================== */
.dchat {
  width: min(23.5rem, calc(100vw - 2rem));
  height: min(33rem, calc(100vh - 5.5rem));
}
@media (max-height: 900px) {
  .dchat { height: min(29.5rem, calc(100vh - 4.5rem)); }
}
.dbubble { width: min(20.5rem, calc(100vw - 2.5rem)); }

/* ======================================================================
 * 19 August, late night - Aarav on the Mac: "the receptionist - reduce
 * the size of it, and the text boxes - reduce the size of it". Final
 * sizing layer: everything one real notch down. His earlier verdicts are
 * kept - the brighter red stays, the bubble text stays bold (650), the
 * centred small x stays - only the SCALE comes down. Interactive targets
 * hold at 40px or better.
 * ==================================================================== */
html body .launcher[data-launcher] {
  width: 56px !important;
  height: 56px !important;
}
html body .launcher[data-launcher] .launcher__crown,
.launcher__crown {
  width: 34px !important;
}
.dbubble {
  width: min(17.5rem, calc(100vw - 2.5rem));
  padding: 0.85rem 0.9rem 0.8rem;
  bottom: calc(clamp(14px, 2vw, 28px) + 70px);
}
.dbubble p {
  margin: 0 1.9rem 0.7rem 0;
  font-size: 0.9rem;
  line-height: 1.5;
}
.dbubble__go { min-height: 40px; font-size: 0.84rem; }
.dchat {
  width: min(22rem, calc(100vw - 2rem));
  height: min(30rem, calc(100vh - 5rem));
}
@media (max-height: 900px) {
  .dchat { height: min(26.5rem, calc(100vh - 4.5rem)); }
}

/* ======================================================================
 * 19 August, late - THE COMPACT PREMIUM SKIN, SITE-WIDE. Aarav: the
 * assistant pop-up was oversized on every page but home. `html body`
 * outranks any page-scoped [data-page] rule, so one spec now governs
 * the panel everywhere: a compact card, quieter header, measured type,
 * chips that read as controls rather than balloons.
 * ==================================================================== */
html body .dchat {
  width: min(23.5rem, calc(100vw - 2rem)) !important;
  height: min(33rem, calc(100vh - 5.5rem)) !important;
  border-radius: 18px !important;
}
@media (max-height: 900px) {
  html body .dchat { height: min(29.5rem, calc(100vh - 4.5rem)) !important; }
}
@media (max-width: 47.99em) {
  html body .dchat {
    width: 100% !important;
    height: min(78vh, 34rem) !important;
    right: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    border-radius: 18px 18px 0 0 !important;
  }
}
html body .dchat__head { padding: 0.8rem 0.9rem !important; gap: 0.6rem !important; }
html body .dchat__mark { width: 30px !important; height: 30px !important; }
html body .dchat__mark img { width: 17px !important; }
html body .dchat__title strong { font-size: 0.92rem !important; }
html body .dchat__title span { font-size: 0.72rem !important; line-height: 1.3 !important; }
html body .dchat__close { width: 38px !important; height: 38px !important; font-size: 1.3rem !important; }
html body .dchat__log { padding: 0.9rem !important; gap: 0.55rem !important; }
html body .dchat__msg p { font-size: 0.92rem !important; line-height: 1.5 !important; padding: 0.55rem 0.8rem !important; }
html body .dchat__chips { gap: 0.45rem !important; }
html body .dchat__chip {
  min-height: 40px !important;
  padding: 0.5rem 0.9rem !important;
  font-size: 0.875rem !important;
  font-weight: 700 !important;
  border: 1px solid rgba(23, 26, 32, 0.2) !important;
  border-radius: 999px !important;
  background: #fffdf8 !important;
  color: #171a20 !important;
  transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease;
}
@media (hover: hover) and (pointer: fine) {
  html body .dchat__chip:hover { background: #17483c !important; border-color: #17483c !important; color: #fffdf8 !important; }
}
html body .dchat__chip:focus-visible { outline: 2px solid #c5a66a !important; outline-offset: 2px !important; }
html body .dchat__input { min-height: 44px !important; font-size: 0.92rem !important; }
html body .dchat__send { min-height: 44px !important; font-size: 0.875rem !important; }
html body .dchat__summary { font-size: 0.875rem !important; }
html body .dchat__route { min-height: 46px !important; font-size: 0.9rem !important; }
html body .dchat__foot { font-size: 0.78rem !important; padding: 0.6rem 0.9rem !important; line-height: 1.45 !important; }
html body .dbubble { width: min(20.5rem, calc(100vw - 2.5rem)) !important; }

/* ======================================================================
 * 19 August, night - THE REPLY AREA STOPS EATING THE CONVERSATION.
 * Five stacked option pills were taller than the log above them, so the
 * chat you were having disappeared behind the choices. The contract now:
 * the LOG owns the panel's height; the reply zone is a compact, capped
 * strip - slim left-aligned option rows with tight gaps, scrolling
 * within itself on the rare step that needs more room.
 * ==================================================================== */
html body .dchat__log {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
}
html body .dchat__reply {
  flex: 0 0 auto !important;
  max-height: 45% !important;
  overflow-y: auto !important;
  padding: 0.55rem 0.9rem 0.7rem !important;
  border-top: 1px solid rgba(23, 26, 32, 0.08);
  background: rgba(23, 26, 32, 0.025);
}
html body .dchat__chips {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}
html body .dchat__chip {
  flex: 0 1 auto !important;
  max-width: 100% !important;
  min-height: 38px !important;
  padding: 0.42rem 0.8rem !important;
  font-size: 0.85rem !important;
  line-height: 1.3 !important;
  text-align: left !important;
  border-radius: 10px !important;
}
/* the long journey labels take their own slim row; short answers such as
   bedroom counts sit inline side by side automatically */
html body .dchat__msg p { padding: 0.5rem 0.75rem !important; }
html body .dchat__form { gap: 6px !important; }
html body .dchat__routes { gap: 6px !important; }
html body .dchat__route { min-height: 44px !important; }

/* rev 27.1 - the balance: slightly taller card, tighter option rows,
   reply capped at 40%, so the conversation always holds the majority. */
html body .dchat {
  height: min(35rem, calc(100vh - 5rem)) !important;
}
@media (max-height: 900px) {
  html body .dchat { height: min(31.5rem, calc(100vh - 4.5rem)) !important; }
}
html body .dchat__reply { max-height: 40% !important; }
html body .dchat__chip { min-height: 36px !important; padding: 0.38rem 0.75rem !important; font-size: 0.84rem !important; }
html body .dchat__chips { gap: 5px !important; }

/* ======================================================================
 * 20 August - THE FIN-GRADE POLISH (Aarav's reference: Claude's own
 * support widget). Sender + time captions, user replies as brand chips,
 * a real composer, and the jump-to-latest button.
 * ==================================================================== */
html body .dchat__stamp {
  display: block;
  margin-top: 0.3rem;
  font-size: 0.72rem;
  letter-spacing: 0.02em;
  color: rgba(23, 26, 32, 0.55);
}
html body .dchat__msg--me { align-self: flex-end; text-align: right; }
html body .dchat__msg--me .dchat__stamp { text-align: right; }
html body .dchat__msg--me p {
  background: #7b2430 !important;
  border-color: #7b2430 !important;
  color: #fff7ed !important;
  border-radius: 14px 14px 4px 14px !important;
}
html body .dchat__msg--bot p {
  border-radius: 14px 14px 14px 4px !important;
}
/* the composer */
html body .dchat__form { display: flex; align-items: center; gap: 8px !important; }
html body .dchat__input {
  flex: 1;
  min-height: 44px !important;
  padding: 0.55rem 1rem !important;
  border: 1px solid rgba(23, 26, 32, 0.22) !important;
  border-radius: 999px !important;
  background: #fffdf8 !important;
  font-size: 0.92rem !important;
}
html body .dchat__input:focus-visible { outline: 2px solid #17483c !important; outline-offset: 1px; }
html body .dchat__send {
  flex: 0 0 auto;
  width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  background: #7b2430 !important;
  border: 0 !important;
  color: #fff7ed !important;
  transition: background-color 160ms ease, transform 160ms ease;
}
html body .dchat__send svg { width: 18px; height: 18px; }
@media (hover: hover) and (pointer: fine) {
  html body .dchat__send:hover { background: #5e1924 !important; transform: translateY(-1px); }
}
/* the jump-to-latest button */
html body .dchat__fab {
  position: absolute;
  right: 12px;
  bottom: 132px;
  z-index: 3;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(23, 26, 32, 0.14);
  border-radius: 50%;
  background: #fffdf8;
  color: #171a20;
  box-shadow: 0 10px 24px -12px rgba(13, 29, 49, 0.5);
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transform: translateY(6px);
  transition: opacity 180ms ease, transform 200ms cubic-bezier(0.22, 1, 0.36, 1);
}
html body .dchat__fab.is-on { opacity: 1; pointer-events: auto; transform: none; }
html body .dchat__fab svg { width: 17px; height: 17px; }
html body .dchat { position: fixed; }   /* the fab anchors to the panel */
@media (prefers-reduced-motion: reduce) {
  html body .dchat__fab, html body .dchat__send { transition: none; }
}

/* 20 August - the caption sits UNDER the bubble, not beside it: message
   rows stack as columns, so the stamp is a small line beneath, left for
   the assistant and right for the visitor - the reference layout. */
html body .dchat__msg {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 3px;
}
html body .dchat__msg--me { align-items: flex-end !important; }
html body .dchat__msg p { max-width: 88%; }
/* the me-row is shrink-to-fit (align-self: flex-end), so a percentage
   max-width on ITS bubble measures against the shrunken row and wraps
   short names - cap the row instead, let the bubble take natural width */
html body .dchat__msg--me { max-width: 88%; }
html body .dchat__msg--me p { max-width: none !important; }
html body .dchat__stamp { margin-top: 0 !important; white-space: nowrap; }

/* 20 August - the unread count on the crown launcher. Cream coin with an
   oxblood figure, ringed so it reads on the oxblood crown circle. */
.launcher__badge {
  /* pinned to the launcher's own fixed recipe: right/bottom clamp, 56px
     circle - the coin overlaps its top-right edge */
  position: fixed;
  right: calc(clamp(14px, 2vw, 28px) - 5px);
  bottom: calc(clamp(14px, 2vw, 28px) + 42px);
  min-width: 23px;
  height: 23px;
  padding: 0 6px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: #fffdf8;
  color: #7b2430;
  border: 2px solid #7b2430;
  font-size: 0.76rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0;
  z-index: 62; /* above the launcher (60) and greeting bubble (61) */
  box-shadow: 0 2px 10px rgba(23, 26, 32, 0.3);
  pointer-events: none;
}
.launcher__badge[hidden] { display: none !important; }


/* ====================================================================
   MOBILE STRESS PASS - 20 Aug 2026, from Aarav's phone screenshots.
   ==================================================================== */

/* the greeting, launcher and badge never sit on top of the open menu */
body:has([data-menu][open]) .dbubble,
body:has([data-menu][open]) .launcher,
body:has([data-menu][open]) .launcher__badge,
body:has(.nav [aria-expanded="true"]) .dbubble {
  visibility: hidden !important;
}

/* phones: the chat is a full-screen sheet, like every real chat widget */
@media (max-width: 43.99em) {
  html body .dchat {
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: none !important;
    border-radius: 0 !important;
    border: 0 !important;
  }
  html body .dchat__fab { bottom: 120px; }
}

/* short landscape phones: the greeting stays out of the reading line */
@media (max-height: 480px) {
  .dbubble { max-width: 15rem; }
}

/* short landscape phones: the menu's sticky action bar pinned mid-panel
   and covered the list rows (Aarav's screenshot, 20 Aug). In a viewport
   under 480px tall it flows after the list instead - scroll reaches it,
   nothing overlaps. Behaviour fix only; the shell's design is untouched. */
@media (max-height: 480px) {
  [data-menu] .menu__actions { position: static !important; }
}

/* the /sales/ header carries backdrop-filter, which makes it the
   containing block for the fixed menu panel: "bottom: 0" then means the
   HEADER's bottom, and the whole menu renders as a 50px sliver (Aarav's
   "the dropdown doesn't come", 20 Aug). An explicit height needs no
   bottom edge, so the panel fills the viewport inside or outside the
   trap. Identical geometry on unaffected pages. */
@media (max-width: 63.99em) {
  .menu[open] .menu__panel {
    inset: var(--head-h, 61px) 0 auto;
    height: calc(100svh - var(--head-h, 61px));
  }
}

/* ====================================================================
   20 Aug - Aarav: the legal strip at the very end "looks off". It
   stays (the company line is the legal identity; the film note is the
   provenance guard while the hero footage is uncleared) but it now
   reads like a designed close: centred, one quiet hierarchy, a gold
   hairline above, the note on a readable measure at whisper contrast.
   Sitewide file so every page's strip matches.
   ==================================================================== */
.legalstrip {
  padding: 1.6rem max(1.25rem, 3vw) 1.8rem !important;
  text-align: center;
  border-top: 1px solid rgba(197, 166, 106, 0.32);
}
.legalstrip__line {
  margin: 0 !important;
  font-size: 0.8rem !important;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(244, 238, 227, 0.85) !important;
}
.legalstrip__note {
  order: 2;
  max-width: 72ch;
  margin: 0.6rem auto 0 !important;
  font-size: 0.72rem !important;
  line-height: 1.6 !important;
  color: rgba(244, 238, 227, 0.45) !important;
  text-align: center !important;
}
.legalstrip { display: flex; flex-direction: column; }
.legalstrip__line { order: 1; }