/* ==========================================================================
   ATENDROS DESIGN SYSTEM  ·  v9.0  ·  "Instrument"
   Lane: editorial atelier × operational instrument.
   Serif display + Inter interface + mono data. Paper and navy. One accent.
   ========================================================================== */

/* ---------- 1. TOKENS ---------------------------------------------------- */
:root {
  /* Surfaces — warm paper. Cards rise toward white, never grey. */
  --paper:            #F4EFE6;
  --paper-raised:     #FBF8F2;
  --paper-recessed:   #ECE5D6;
  --paper-deep:       #E4DACA;

  /* Navy — structural only: hero band, footer, punctuation sections. */
  --navy:             #0E2A45;
  --navy-raised:      #16354F;
  --navy-deep:        #0A1E33;
  --navy-abyss:       #071624;

  /* Accent — the wax seal. Rare by design. */
  --sello:            #C75A3C;
  --sello-deep:       #9D4630;
  --sello-text:       #9D4630;   /* accent used AS TEXT on paper — 5.47:1 */
  --sello-lift:       #E08A6B;   /* accent on navy (contrast-safe) */

  /* Ink */
  --ink:              #161616;
  --ink-muted:        #55504A;
  --ink-faint:        #6E675E;
  --on-navy:          #F5EFE6;
  --on-navy-muted:    #AFC0D0;
  --on-navy-faint:    #7E93A8;

  /* Rules & borders */
  --rule:             #DCD2C0;
  --rule-strong:      #C9BCA4;
  --rule-navy:        rgba(245,239,230,.14);
  --rule-navy-strong: rgba(245,239,230,.26);

  /* Signal (console + status only, never decoration) */
  --signal-review:    #B07A2E;
  --signal-review-bg: rgba(176,122,46,.10);
  --signal-hold:      #9D4630;
  --signal-ok:        #2F6B52;
  --signal-ok-bg:     rgba(47,107,82,.10);

  /* Type families */
  --serif: 'Source Serif 4', Charter, 'Iowan Old Style', Georgia, serif;
  --sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --mono:  'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* Radius — near-square. Architectural, not app-store. */
  --r-xs: 1px;  --r-sm: 2px;  --r-md: 4px;  --r-lg: 8px;  --r-pill: 999px;

  /* Space */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 40px; --s-8: 56px; --s-9: 72px; --s-10: 96px;
  --s-11: 128px; --s-12: 160px;

  /* Layout */
  --container: 1240px;
  --container-tight: 940px;
  --measure: 68ch;
  --gutter: 24px;

  /* Motion */
  --ease: cubic-bezier(.16,1,.3,1);
  --ease-out: cubic-bezier(.22,.61,.36,1);
  --t-fast: 140ms;
  --t-mid: 240ms;
  --t-slow: 520ms;

  /* Elevation — used exactly twice on the whole site. */
  --lift: 0 1px 2px rgba(22,22,22,.04), 0 8px 24px -16px rgba(22,22,22,.18);
}

@media (min-width: 900px) { :root { --gutter: 40px; } }

/* ---------- 2. RESET ----------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--serif);
  font-optical-sizing: auto;
  font-size: 18px;
  line-height: 1.62;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "kern","liga";
  overflow-x: hidden;
}
img, svg, video { max-width: 100%; height: auto; display: block; }
button { font: inherit; color: inherit; }
::selection { background: var(--sello); color: var(--paper); }

/* ---------- 3. TYPE RAMP -------------------------------------------------
   Four ramps, tightening at small sizes. Negative tracking at display.
   ------------------------------------------------------------------------- */
.display, h1.display {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(2.35rem, 1.35rem + 3.6vw, 4.35rem);
  line-height: 1.02; letter-spacing: -.028em; margin: 0;
  text-wrap: balance;
}
h1, .h1 {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(2rem, 1.3rem + 2.6vw, 3.25rem);
  line-height: 1.08; letter-spacing: -.022em; margin: 0 0 .5em;
  text-wrap: balance;
}
h2, .h2 {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(1.6rem, 1.15rem + 1.7vw, 2.5rem);
  line-height: 1.14; letter-spacing: -.018em; margin: 0 0 .55em;
  text-wrap: balance;
}
h3, .h3 {
  font-family: var(--serif); font-weight: 600;
  font-size: clamp(1.2rem, 1.06rem + .45vw, 1.45rem);
  line-height: 1.26; letter-spacing: -.008em; margin: 0 0 .5em;
}
h4, .h4 {
  font-family: var(--sans); font-weight: 600;
  font-size: 1rem; line-height: 1.4; letter-spacing: -.002em; margin: 0 0 .5em;
}
p { margin: 0 0 1.05em; }
.lead {
  font-family: var(--serif); font-size: clamp(1.12rem, 1.02rem + .38vw, 1.32rem);
  line-height: 1.5; color: var(--ink-muted); max-width: 52ch;
}
.prose { max-width: var(--measure); }
.prose p, .prose li { font-size: 1.06rem; line-height: 1.62; }
.prose h2 { margin-top: 2.2em; }
.prose h3 { margin-top: 1.8em; }
.prose ul, .prose ol { padding-left: 1.25em; }
.prose li { margin-bottom: .5em; }

.ui   { font-family: var(--sans); }
.mono { font-family: var(--mono); font-variant-ligatures: none; }

.eyebrow {
  font-family: var(--sans); font-size: .7rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: .16em; color: var(--sello-text);
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px;
  margin: 0 0 var(--s-5); line-height: 1.5;
}
.eyebrow::after { content:""; width: 28px; height: 1px; background: currentColor; opacity: .55; flex-shrink: 0; }
.eyebrow--plain::after { display: none; }
.on-navy .eyebrow, .eyebrow--navy { color: var(--sello-lift); }

.label {
  font-family: var(--sans); font-size: .73rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: .13em; color: var(--ink-faint);
}
.small { font-family: var(--sans); font-size: .875rem; line-height: 1.55; color: var(--ink-muted); }
.fine  { font-family: var(--sans); font-size: .78rem; line-height: 1.55; color: var(--ink-faint); }
.num   { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; }

a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px;
    text-underline-offset: 3px; text-decoration-color: var(--rule-strong);
    transition: text-decoration-color var(--t-fast), color var(--t-fast); }
a:hover { text-decoration-color: var(--sello); color: var(--sello-deep); }
.on-navy a:hover { color: var(--sello-lift); text-decoration-color: var(--sello-lift); }

:focus-visible {
  outline: 2px solid var(--sello);
  outline-offset: 3px;
  border-radius: var(--r-sm);
}
.on-navy :focus-visible { outline-color: var(--sello-lift); }

.sr-only {
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.skip-link {
  position:absolute; left:var(--s-4); top:-100px; z-index:200;
  background: var(--ink); color: var(--paper); padding: 10px 16px;
  font-family: var(--sans); font-size:.875rem; text-decoration:none; border-radius: var(--r-sm);
}
.skip-link:focus { top: var(--s-4); color: var(--paper); }

/* ---------- 4. LAYOUT ---------------------------------------------------- */
.wrap { width:100%; max-width: var(--container); margin:0 auto; padding-inline: var(--gutter); }
.wrap--tight { max-width: var(--container-tight); }
.section { padding-block: clamp(56px, 3rem + 5vw, 128px); position: relative; }
.section--tight { padding-block: clamp(44px, 2.5rem + 3.5vw, 88px); }
.section--flush-top { padding-top: 0; }
.section + .section { border-top: 1px solid var(--rule); }
.section.on-navy + .section.on-navy { border-top-color: var(--rule-navy); }

.on-navy { background: var(--navy); color: var(--on-navy); }
.on-navy h1,.on-navy h2,.on-navy h3,.on-navy h4 { color: var(--on-navy); }
.on-navy .lead, .on-navy .small { color: var(--on-navy-muted); }
.on-navy .fine, .on-navy .label { color: var(--on-navy-faint); }
.on-navy--deep { background: var(--navy-deep); }
.on-recessed { background: var(--paper-recessed); }

.stack > * + * { margin-top: var(--s-4); }
.stack-lg > * + * { margin-top: var(--s-6); }
.grid { display: grid; gap: var(--s-5); }
@media (min-width: 720px)  { .grid--2 { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 900px)  { .grid--3 { grid-template-columns: repeat(3,1fr); }
                             .grid--4 { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1100px) { .grid--4 { grid-template-columns: repeat(4,1fr); } }

.section-head { max-width: 34ch; }
.split .section-head { max-width: 28ch; }
.section-head .lead { margin-top: var(--s-4); max-width: 46ch; }
.split { display: grid; gap: var(--s-7); align-items: start; }
@media (min-width: 980px) {
  .split { grid-template-columns: minmax(0,5fr) minmax(0,7fr); gap: var(--s-9); }
  .split--even { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .split--sticky > :first-child { position: sticky; top: 108px; }
}

hr.rule { border:0; height:1px; background: var(--rule); margin: var(--s-8) 0; }
.rule-short { width: 44px; height: 1px; background: var(--sello); border: 0; margin: 0 0 var(--s-5); }

/* ---------- 5. BUTTONS --------------------------------------------------- */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family: var(--sans); font-size: .9375rem; font-weight: 500; letter-spacing: .005em;
  padding: 13px 22px; min-height: 46px; border-radius: var(--r-sm);
  border: 1px solid transparent; text-decoration: none; cursor: pointer;
  transition: background var(--t-fast), border-color var(--t-fast), color var(--t-fast), transform var(--t-fast);
  white-space: nowrap;
}
.btn:hover { text-decoration: none; }
.btn:active { transform: translateY(1px); }
.btn__arrow { transition: transform var(--t-mid) var(--ease); }
.btn:hover .btn__arrow { transform: translateX(3px); }

.btn--primary   { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.btn--primary:hover { background: var(--sello-deep); border-color: var(--sello-deep); color: var(--paper); }
.btn--secondary { background: transparent; border-color: #877A66; color: var(--ink); }
.btn--secondary:hover { border-color: var(--ink); background: var(--paper-raised); color: var(--ink); }
.on-navy .btn--primary   { background: var(--paper); border-color: var(--paper); color: var(--navy); }
.on-navy .btn--primary:hover { background: var(--sello-deep); border-color: var(--sello-deep); color: #fff; }
.on-navy .btn--secondary { border-color: var(--rule-navy-strong); color: var(--on-navy); }
.on-navy .btn--secondary:hover { border-color: var(--on-navy); background: rgba(245,239,230,.06); color: var(--on-navy); }
.btn--sm { padding: 9px 15px; min-height: 38px; font-size: .875rem; }

.link-arrow {
  font-family: var(--sans); font-size: .9rem; font-weight: 500;
  text-decoration: none; display:inline-flex; align-items:center; gap: 7px;
  border-bottom: 1px solid var(--rule-strong); padding-bottom: 2px;
  transition: border-color var(--t-fast), color var(--t-fast);
}
.link-arrow:hover { color: var(--sello-deep); border-color: var(--sello); text-decoration: none; }
.link-arrow svg { transition: transform var(--t-mid) var(--ease); }
.link-arrow:hover svg { transform: translateX(3px); }
.on-navy .link-arrow { border-color: var(--rule-navy-strong); }
.on-navy .link-arrow:hover { color: var(--sello-lift); border-color: var(--sello-lift); }

/* ---------- 6. HEADER / NAV ---------------------------------------------- */
.masthead {
  position: sticky; top: 0; z-index: 90;
  background: rgba(244,239,230,.72);
  -webkit-backdrop-filter: saturate(160%) blur(14px);
  backdrop-filter: saturate(160%) blur(14px);
  border-bottom: 1px solid transparent;
  transition: background var(--t-mid), border-color var(--t-mid), box-shadow var(--t-mid);
}
.masthead[data-scrolled="true"] {
  background: rgba(244,239,230,.94);
  border-bottom-color: var(--rule);
}
.masthead__inner {
  display:flex; align-items:center; justify-content:space-between; gap: var(--s-5);
  height: 68px; max-width: var(--container); margin:0 auto; padding-inline: var(--gutter);
}
.brand { display:inline-flex; align-items:center; gap:9px; text-decoration:none; flex-shrink:0; }
.brand:hover { text-decoration:none; color: inherit; }
.brand img { height: 22px; width: 22px; }
.brand__word {
  font-family: var(--serif); font-weight: 600; font-size: 1.32rem;
  letter-spacing: -.02em; color: var(--ink); line-height: 1;
}
.brand__dot { color: var(--sello); }
.on-navy .brand__word, .site-foot .brand__word { color: var(--on-navy); }

.nav { display:none; }
@media (min-width: 1000px) { .nav { display:flex; align-items:center; gap: var(--s-6); } }
.nav__item { position: relative; }
.nav__link {
  font-family: var(--sans); font-size: .89rem; font-weight: 500; color: var(--ink-muted);
  text-decoration: none; padding: 8px 0; display:inline-flex; align-items:center; gap:5px;
  background: none; border: 0; cursor: pointer; transition: color var(--t-fast);
}
.nav__link:hover, .nav__link[aria-expanded="true"] { color: var(--ink); text-decoration:none; }
.nav__link[aria-current="page"] { color: var(--ink); }
.nav__link[aria-current="page"]::after {
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background: var(--sello);
}
.nav__caret { transition: transform var(--t-fast); }
.nav__link[aria-expanded="true"] .nav__caret { transform: rotate(180deg); }

.nav__panel {
  position:absolute; top: calc(100% + 14px); left: -20px; z-index: 95;
  min-width: 460px; padding: var(--s-5);
  background: var(--paper-raised); border: 1px solid var(--rule);
  border-radius: var(--r-md); box-shadow: var(--lift);
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-5);
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity var(--t-mid) var(--ease), transform var(--t-mid) var(--ease), visibility var(--t-mid);
}
.nav__item[data-open="true"] .nav__panel { opacity:1; visibility:visible; transform:none; }
.nav__panel-link { display:block; text-decoration:none; padding: 10px; margin: -10px; border-radius: var(--r-sm); transition: background var(--t-fast); }
.nav__panel-link:hover { background: var(--paper-recessed); text-decoration:none; color: inherit; }
.nav__panel-link + .nav__panel-link { margin-top: var(--s-3); }
.nav__panel-title { font-family: var(--sans); font-size: .9rem; font-weight: 600; color: var(--ink); display:block; margin-bottom: 3px; }
.nav__panel-desc  { font-family: var(--sans); font-size: .8rem; color: var(--ink-faint); line-height:1.45; display:block; }
.nav__card {
  background: var(--navy); color: var(--on-navy); border-radius: var(--r-md);
  padding: var(--s-5); text-decoration:none; display:flex; flex-direction:column; justify-content:space-between;
}
.nav__card:hover { text-decoration:none; color: var(--on-navy); }
.nav__card .label { color: var(--sello-lift); }

.masthead__actions { display:flex; align-items:center; gap: var(--s-4); flex-shrink:0; }
.lang-toggle {
  font-family: var(--sans); font-size: .8rem; font-weight: 500; letter-spacing:.04em;
  color: var(--ink-muted); text-decoration:none; border: 1px solid #877A66;
  padding: 6px 11px; border-radius: var(--r-sm); transition: border-color var(--t-fast), color var(--t-fast);
  display: inline-flex; align-items: center; min-height: 34px;
}
.lang-toggle:hover { color: var(--ink); border-color: var(--rule-strong); text-decoration:none; }
@media (max-width: 560px) { .lang-toggle { display:none; } }

.burger {
  display:inline-flex; flex-direction:column; justify-content:center; gap:5px;
  width:44px; height:44px; align-items:center;
  background:none; border:1px solid #877A66; border-radius: var(--r-sm); cursor:pointer;
}
@media (min-width: 1000px) { .burger { display:none; } }
.burger span { display:block; width:17px; height:1.5px; background: var(--ink); transition: transform var(--t-mid) var(--ease), opacity var(--t-fast); }
.burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

.mobile-nav {
  position: fixed; inset: 68px 0 0; z-index: 89; background: var(--paper);
  padding: var(--s-5) var(--gutter) var(--s-9); overflow-y: auto;
  transform: translateY(-8px); opacity: 0; visibility: hidden;
  transition: opacity var(--t-mid) var(--ease), transform var(--t-mid) var(--ease), visibility var(--t-mid);
}
.mobile-nav[data-open="true"] { opacity:1; visibility:visible; transform:none; }
@media (min-width: 1000px) { .mobile-nav { display:none; } }
.mobile-nav__link {
  display:flex; align-items:center; justify-content:space-between; gap:var(--s-4);
  font-family: var(--serif); font-size: 1.42rem; font-weight: 500; letter-spacing:-.015em;
  padding: 16px 0; border-bottom: 1px solid var(--rule); text-decoration:none; color: var(--ink);
  min-height: 56px;
}
.mobile-nav__link:hover { text-decoration:none; }
.mobile-nav__group { padding: 16px 0 4px; border-bottom: 1px solid var(--rule); }
.mobile-nav__sub { display:block; font-family: var(--sans); font-size: .95rem; color: var(--ink-muted);
  padding: 11px 0 11px 18px; text-decoration:none; border-left: 1px solid var(--rule); margin-left:2px; min-height:44px; }
.mobile-nav__foot { margin-top: var(--s-7); display:grid; gap: var(--s-3); }

/* ---------- 7. HERO ------------------------------------------------------ */
.hero { background: var(--paper); padding-top: clamp(48px, 3rem + 3vw, 88px); padding-bottom: clamp(48px, 3rem + 3vw, 96px); overflow: hidden; }
.hero__grid { display: grid; gap: var(--s-8); align-items: center; }
@media (min-width: 1080px) { .hero__grid { grid-template-columns: minmax(0,43fr) minmax(0,57fr); gap: var(--s-8); align-items: center; } }
.hero__display { margin-bottom: var(--s-6); max-width: 15ch; }
.hero__deck { max-width: 44ch; margin-bottom: var(--s-7); }
.hero__actions { display:flex; flex-wrap:wrap; gap: var(--s-3); align-items:center; }
.hero__note { margin-top: var(--s-7); padding-top: var(--s-5); border-top: 1px solid var(--rule); max-width: 46ch; }

/* ---------- 8. THE CONSOLE ----------------------------------------------
   Original product instrument. Synthetic demo data only.
   ------------------------------------------------------------------------- */
.console {
  background: var(--navy); color: var(--on-navy);
  border: 1px solid var(--navy-raised); border-radius: var(--r-lg);
  box-shadow: var(--lift); overflow: hidden;
  font-family: var(--sans);
  container-type: inline-size;
}
.console__bar {
  display:flex; align-items:center; justify-content:space-between; gap: var(--s-4);
  padding: 12px 16px; background: var(--navy-deep); border-bottom: 1px solid var(--rule-navy);
  min-height: 46px;
}
.console__id { display:flex; align-items:center; gap:9px; font-family: var(--mono); font-size:.68rem;
  letter-spacing:.09em; text-transform:uppercase; color: var(--on-navy-faint); }
.console__pip { width:6px; height:6px; border-radius:50%; background: var(--sello); flex-shrink:0; }
.console[data-live="true"] .console__pip { animation: pip 2.4s var(--ease) infinite; }
@keyframes pip { 0%,100%{opacity:1} 50%{opacity:.25} }
.console__lang { display:flex; gap:2px; background: rgba(245,239,230,.07); border-radius: var(--r-sm); padding:2px; }
.console__lang b {
  font-family: var(--mono); font-size:.66rem; font-weight:500; letter-spacing:.08em;
  padding: 4px 9px; border-radius: var(--r-xs); color: var(--on-navy-faint); transition: all var(--t-mid) var(--ease);
}
.console__lang b[data-on="true"] { background: var(--sello-deep); color:#fff; }

.console__body { display:grid; }
@container (min-width: 560px) { .console__body { grid-template-columns: minmax(0,1fr) minmax(0,1fr); } }
.console__pane { padding: var(--s-5); min-height: 260px; }
.console__pane + .console__pane { border-top: 1px solid var(--rule-navy); }
@container (min-width: 560px) { .console__pane + .console__pane { border-top: 0; border-left: 1px solid var(--rule-navy); } }

.console__caller { display:flex; align-items:center; gap: var(--s-3); margin-bottom: var(--s-5); }
.console__avatar {
  width:38px; height:38px; border-radius:50%; flex-shrink:0;
  background: var(--navy-raised); border:1px solid var(--rule-navy);
  display:grid; place-items:center; font-family: var(--mono); font-size:.72rem; color: var(--on-navy-muted);
}
.console__caller-name { font-size:.9rem; font-weight:600; color: var(--on-navy); line-height:1.3; }
.console__caller-meta { font-family: var(--mono); font-size:.7rem; color: var(--on-navy-faint); letter-spacing:.03em; }

.wave { display:flex; align-items:center; gap:2.5px; height: 34px; margin-bottom: var(--s-5); }
.wave i {
  display:block; width:2.5px; border-radius: var(--r-pill); background: var(--sello-lift);
  height: 15%; opacity:.5; transition: height 180ms var(--ease-out), opacity 180ms;
}
/* Resting silhouette, used before the sequence starts and whenever motion is off. */
.wave i:nth-child(6n+1){height:26%} .wave i:nth-child(6n+2){height:58%}
.wave i:nth-child(6n+3){height:88%} .wave i:nth-child(6n+4){height:41%}
.wave i:nth-child(6n+5){height:70%} .wave i:nth-child(6n+6){height:33%}
.wave i:nth-child(5n){height:52%} .wave i:nth-child(7n){height:78%}
.console[data-live="true"] .wave i { animation: wv 1100ms var(--ease-out) infinite alternate; }
@keyframes wv { from { height: 12%; opacity:.35 } to { height: var(--h,60%); opacity:.95 } }

.tape { display:grid; gap: var(--s-3); }
.tape__line { display:grid; grid-template-columns: 66px 1fr; gap: var(--s-3); align-items:start;
  opacity:0; transform: translateY(6px); transition: opacity 380ms var(--ease), transform 380ms var(--ease); }
.tape__line[data-shown="true"] { opacity:1; transform:none; }
.tape__who { font-family: var(--mono); font-size:.62rem; letter-spacing:.1em; text-transform:uppercase;
  color: var(--on-navy-faint); padding-top:3px; }
.tape__line[data-who="ai"] .tape__who { color: var(--sello-lift); }
.tape__what { font-size:.86rem; line-height:1.5; color: var(--on-navy-muted); }
.tape__line[data-who="ai"] .tape__what { color: var(--on-navy); }

.record { display:grid; gap: 0; }
.record__title { font-family:var(--mono); font-size:.66rem; letter-spacing:.11em; text-transform:uppercase;
  color: var(--on-navy-faint); padding-bottom: var(--s-3); border-bottom:1px solid var(--rule-navy); margin-bottom: var(--s-3); }
.field { display:grid; grid-template-columns: 104px 1fr; gap: var(--s-3); padding: 7px 0; align-items:baseline; }
.field__k { font-family: var(--mono); font-size:.66rem; letter-spacing:.06em; text-transform:uppercase; color: var(--on-navy-faint); }
.field__v { font-family: var(--mono); font-size:.78rem; color: var(--on-navy); line-height:1.45; min-height: 1.1em;
  opacity:0; transition: opacity 300ms var(--ease); word-break: break-word; }
.field__v[data-shown="true"] { opacity:1; }
.field__v em { font-style: normal; color: var(--on-navy-muted); }

.chip {
  display:inline-flex; align-items:center; gap:7px; font-family: var(--sans);
  font-size:.72rem; font-weight:600; letter-spacing:.02em;
  padding: 5px 10px; border-radius: var(--r-sm); border:1px solid transparent;
  opacity:0; transform: translateY(4px); transition: opacity 340ms var(--ease), transform 340ms var(--ease);
}
.chip[data-shown="true"] { opacity:1; transform:none; }
.chip::before { content:""; width:5px; height:5px; border-radius:50%; background: currentColor; flex-shrink:0; }
.chip--review { color:#E8B15E; background: rgba(232,177,94,.11); border-color: rgba(232,177,94,.3); }
.chip--hold   { color: var(--sello-lift); background: rgba(224,138,107,.12); border-color: rgba(224,138,107,.32); }
.chip--ok     { color:#7FC5A3; background: rgba(127,197,163,.11); border-color: rgba(127,197,163,.3); }
.chip-row { display:flex; flex-wrap:wrap; gap: var(--s-2); margin-top: var(--s-4); }

.console__foot {
  display:flex; align-items:center; justify-content:space-between; gap: var(--s-4); flex-wrap: wrap;
  padding: 10px 16px; background: var(--navy-deep); border-top: 1px solid var(--rule-navy);
}
.steps { display:flex; align-items:center; gap: 3px; flex-wrap: wrap; }
.steps__i {
  font-family: var(--mono); font-size:.6rem; letter-spacing:.08em; text-transform:uppercase;
  color: var(--on-navy-faint); padding: 5px 8px; border-radius: var(--r-xs);
  transition: color var(--t-mid), background var(--t-mid); white-space: nowrap;
}
.steps__i[data-state="done"]   { color: var(--on-navy-muted); }
.steps__i[data-state="active"] { color:#fff; background: var(--sello-deep); }
.console__replay {
  font-family: var(--sans); font-size:.74rem; font-weight:500; color: var(--on-navy-muted);
  background: none; border:1px solid var(--rule-navy); border-radius: var(--r-sm);
  padding: 7px 13px; min-height: 34px; cursor:pointer; display:inline-flex; align-items:center; gap:7px;
  transition: border-color var(--t-fast), color var(--t-fast);
}
.console__replay:hover { color: var(--on-navy); border-color: var(--rule-navy-strong); }

/* ---------- 9. CARDS ----------------------------------------------------- */
.card {
  background: var(--paper-raised); border: 1px solid var(--rule); border-radius: var(--r-md);
  padding: var(--s-5); transition: border-color var(--t-mid), background var(--t-mid), transform var(--t-mid) var(--ease);
  display:flex; flex-direction:column;
}
@media (min-width: 720px) { .card { padding: var(--s-6); } }
.card--link:hover { border-color: var(--rule-strong); transform: translateY(-2px); }
.card__eyebrow { font-family: var(--sans); font-size:.68rem; font-weight:600; text-transform:uppercase;
  letter-spacing:.14em; color: var(--ink-faint); margin-bottom: var(--s-4); display:block; }
.card__title { font-family: var(--serif); font-size: 1.24rem; font-weight:600; letter-spacing:-.01em;
  line-height:1.28; margin: 0 0 var(--s-3); }
.card__body { font-family: var(--sans); font-size:.925rem; line-height:1.58; color: var(--ink-muted); margin:0; }
.card__foot { margin-top: var(--s-5); padding-top: var(--s-4); border-top: 1px solid var(--rule); }
.on-navy .card { background: var(--navy-raised); border-color: var(--rule-navy); }
.on-navy .card__body { color: var(--on-navy-muted); }
.on-navy .card__eyebrow { color: var(--on-navy-faint); }
.on-navy .card__foot { border-color: var(--rule-navy); }

.numbered { counter-reset: n; display:grid; gap: 0; }
.numbered__item {
  counter-increment: n; display:grid; grid-template-columns: 46px 1fr; gap: var(--s-4);
  padding: var(--s-5) 0; border-top: 1px solid var(--rule); align-items:start;
}
@media (min-width: 800px) { .numbered__item { grid-template-columns: 64px 1fr 1fr; gap: var(--s-6); align-items: baseline; } }
.numbered__item:last-child { border-bottom: 1px solid var(--rule); }
.numbered__n { font-family: var(--mono); font-size:.72rem; color: var(--sello-text); letter-spacing:.06em; padding-top: 4px; }
.numbered__n::before { content: counter(n, decimal-leading-zero); }
.numbered__t { font-family: var(--serif); font-size: 1.16rem; font-weight:600; line-height:1.3; letter-spacing:-.008em; }
.numbered__d { font-family: var(--sans); font-size:.92rem; line-height:1.58; color: var(--ink-muted); margin: var(--s-2) 0 0; }
@media (min-width: 800px) { .numbered__d { margin: 0; } }
.on-navy .numbered__item { border-color: var(--rule-navy); }
.on-navy .numbered__d { color: var(--on-navy-muted); }
.on-navy .numbered__n { color: var(--sello-lift); }

/* ---------- 10. METRIC STRIP --------------------------------------------- */
.metrics { display:grid; gap: 0; border-top: 1px solid var(--rule); }
@media (min-width: 760px) { .metrics { grid-template-columns: repeat(4, 1fr); } }
.metric { padding: var(--s-5) 0; border-bottom: 1px solid var(--rule); }
@media (min-width: 760px) {
  .metric { padding: var(--s-5) var(--s-5) var(--s-5) 0; border-bottom: 0; border-right: 1px solid var(--rule); }
  .metric:last-child { border-right: 0; }
  .metric + .metric { padding-left: var(--s-5); }
}
.metric__v { font-family: var(--serif); font-weight:500; font-size: clamp(2.2rem,1.7rem+1.7vw,3rem);
  line-height:1; letter-spacing:-.028em; color: var(--ink); margin-bottom: var(--s-3);
  font-variant-numeric: tabular-nums; }
.metric__k { font-family: var(--sans); font-size:.82rem; font-weight:500; color: var(--ink-muted); line-height:1.4; }
.metric__k sup { color: var(--sello-text); font-size: .8em; }
.on-navy .metrics, .on-navy .metric { border-color: var(--rule-navy); }
.on-navy .metric__v { color: var(--on-navy); }
.on-navy .metric__k { color: var(--on-navy-muted); }
.on-navy .metric__k sup { color: var(--sello-lift); }

/* ---------- 11. COVERAGE GRID (168 hours) -------------------------------- */
.coverage { border: 1px solid var(--rule); border-radius: var(--r-md); background: var(--paper-raised); padding: var(--s-5); }
@media (min-width: 720px) { .coverage { padding: var(--s-6); } }
.coverage__grid { display:grid; grid-template-columns: 30px repeat(24, minmax(0,1fr)); gap: 2px; align-items:center; }
.coverage__hour { font-family: var(--mono); font-size:.54rem; letter-spacing:.02em;
  color: var(--ink-faint); text-align:left; padding-bottom: 7px; }
.coverage__day { font-family: var(--mono); font-size:.56rem; letter-spacing:.06em; text-transform:uppercase;
  color: var(--ink-faint); text-align:left; line-height:1; }
.coverage__cell { height: 17px; border-radius: var(--r-xs); background: rgba(199,90,60,.20); }
.coverage__cell[data-covered="firm"] { background: var(--navy); }
@media (max-width: 620px) { .coverage__cell { height: 12px; } .coverage__grid { gap: 1.5px; } }
.coverage__legend { display:flex; flex-wrap:wrap; gap: var(--s-5); margin-top: var(--s-5);
  padding-top: var(--s-4); border-top:1px solid var(--rule); }
.coverage__key { display:inline-flex; align-items:center; gap:8px; font-family: var(--sans); font-size:.8rem; color: var(--ink-muted); }
.coverage__swatch { width:11px; height:11px; border-radius: var(--r-xs); flex-shrink:0; }
.coverage__key strong { font-variant-numeric: tabular-nums; color: var(--ink); }

/* ---------- 12. LANGUAGE SWITCH DEMO ------------------------------------- */
.tabs { display:inline-flex; padding:3px; background: var(--paper-recessed); border-radius: var(--r-md);
  border:1px solid #877A66; gap:2px; }
.tabs__btn {
  font-family: var(--sans); font-size:.86rem; font-weight:500; color: var(--ink-muted);
  padding: 9px 18px; min-height: 40px; border-radius: var(--r-sm); border:0; background: none; cursor:pointer;
  transition: background var(--t-mid) var(--ease), color var(--t-mid);
}
.tabs__btn[aria-selected="true"] { background: var(--paper-raised); color: var(--ink); box-shadow: 0 1px 2px rgba(22,22,22,.05); }
.on-navy .tabs { background: rgba(245,239,230,.06); border-color: var(--rule-navy); }
.on-navy .tabs__btn { color: var(--on-navy-faint); }
.on-navy .tabs__btn[aria-selected="true"] { background: var(--navy-raised); color: var(--on-navy); box-shadow:none; }
.tabpanel[hidden] { display:none; }

.dialogue { display:grid; gap: var(--s-4); }
.turn { display:grid; grid-template-columns: 58px 1fr; gap: var(--s-4); align-items:start; }
.turn__who { font-family: var(--mono); font-size:.63rem; letter-spacing:.1em; text-transform:uppercase;
  color: var(--ink-faint); padding-top: 4px; }
.turn[data-who="ai"] .turn__who { color: var(--sello-text); }
.turn__text { font-family: var(--serif); font-size: 1.02rem; line-height:1.5; }
.turn[data-who="caller"] .turn__text { color: var(--ink-muted); }
.on-navy .turn__who { color: var(--on-navy-faint); }
.on-navy .turn[data-who="ai"] .turn__who { color: var(--sello-lift); }
.on-navy .turn[data-who="caller"] .turn__text { color: var(--on-navy-muted); }

/* ---------- 13. REFUSAL BOARD -------------------------------------------- */
.refusals { display:grid; gap: var(--s-4); }
@media (min-width: 860px) { .refusals { grid-template-columns: repeat(2,1fr); } }
.refusal {
  border: 1px solid var(--rule-navy); border-radius: var(--r-md); overflow:hidden;
  background: var(--navy-raised); display:flex; flex-direction:column;
}
.refusal__q {
  font-family: var(--serif); font-size: 1.08rem; line-height:1.4; color: var(--on-navy);
  padding: var(--s-5); border-bottom: 1px solid var(--rule-navy);
}
.refusal__q::before { content:"“"; color: var(--sello-lift); }
.refusal__q::after  { content:"”"; color: var(--sello-lift); }
.refusal__a { padding: var(--s-5); display:flex; flex-direction:column; gap: var(--s-3); flex:1; }
.refusal__verdict {
  font-family: var(--sans); font-size:.7rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color: var(--sello-lift); display:inline-flex; align-items:center; gap:8px;
}
.refusal__verdict::before { content:""; width: 16px; height:1px; background: currentColor; }
.refusal__body { font-family: var(--sans); font-size:.9rem; line-height:1.55; color: var(--on-navy-muted); margin:0; }

/* ---------- 14. ESCALATION RAIL ------------------------------------------ */
.rail { display:grid; gap: var(--s-3); }
@media (min-width: 720px) { .rail { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1060px) { .rail { grid-template-columns: repeat(3,1fr); } }
.rail__item {
  display:flex; align-items:flex-start; gap: var(--s-3); min-width: 0;
  padding: var(--s-4) var(--s-5); border:1px solid var(--rule); border-radius: var(--r-md);
  background: var(--paper-raised); transition: border-color var(--t-mid);
}
.rail__item:hover { border-color: var(--rule-strong); }
.rail__dot { width:7px; height:7px; border-radius:50%; background: var(--sello); margin-top:7px; flex-shrink:0; }
.rail__t { display:block; font-family: var(--sans); font-size:.94rem; font-weight:600; color: var(--ink); line-height:1.35; }
.rail__d { display:block; font-family: var(--sans); font-size:.83rem; color: var(--ink-faint); line-height:1.5; margin-top:3px; }

/* ---------- 15. DISCLOSURE / ACCORDION ----------------------------------- */
.disclosure { border-top: 1px solid var(--rule); }
.disclosure:last-of-type { border-bottom: 1px solid var(--rule); }
.disclosure__btn {
  width:100%; display:flex; align-items:flex-start; justify-content:space-between; gap: var(--s-4);
  padding: var(--s-5) 0; background:none; border:0; cursor:pointer; text-align:left; min-height: 60px;
}
.disclosure__t { font-family: var(--serif); font-size: 1.12rem; font-weight:600; line-height:1.35; letter-spacing:-.008em; color: var(--ink); }
.disclosure__icon { position:relative; width:14px; height:14px; flex-shrink:0; margin-top:6px; }
.disclosure__icon::before, .disclosure__icon::after {
  content:""; position:absolute; background: var(--sello); transition: transform var(--t-mid) var(--ease);
}
.disclosure__icon::before { left:0; top:6.5px; width:14px; height:1.5px; }
.disclosure__icon::after  { top:0; left:6.25px; width:1.5px; height:14px; }
.disclosure__btn[aria-expanded="true"] .disclosure__icon::after { transform: rotate(90deg); }
.disclosure__panel { overflow:hidden; height:0; transition: height var(--t-mid) var(--ease); }
.disclosure__inner { padding: 0 0 var(--s-5); max-width: 66ch; }
.disclosure__inner p { font-family: var(--sans); font-size:.925rem; line-height:1.62; color: var(--ink-muted); }
.disclosure__inner p:last-child { margin-bottom:0; }
.on-navy .disclosure, .on-navy .disclosure:last-of-type { border-color: var(--rule-navy); }
.on-navy .disclosure__t { color: var(--on-navy); }
.on-navy .disclosure__icon::before, .on-navy .disclosure__icon::after { background: var(--sello-lift); }
.on-navy .disclosure__inner p { color: var(--on-navy-muted); }

/* ---------- 16. PRICING -------------------------------------------------- */
.tiers { display:grid; gap: var(--s-4); }
@media (min-width: 940px) { .tiers { grid-template-columns: repeat(3,1fr); gap: var(--s-4); } }
.tier {
  display:flex; flex-direction:column; padding: var(--s-6) var(--s-5);
  border: 1px solid var(--rule); border-radius: var(--r-md); background: var(--paper-raised);
}
@media (min-width: 720px) { .tier { padding: var(--s-7) var(--s-6); } }
.tier--feature { background: var(--navy); border-color: var(--navy); color: var(--on-navy); }
.tier--feature .tier__name { color: var(--sello-lift); }
.tier--feature .tier__price, .tier--feature .tier__label { color: var(--on-navy); }
.tier--feature .tier__meta, .tier--feature .tier__li { color: var(--on-navy-muted); }
.tier--feature .tier__list { border-color: var(--rule-navy); }
.tier--feature .tier__li::before { background: var(--sello-lift); }
.tier__name { font-family: var(--sans); font-size:.7rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.16em; color: var(--sello-text); margin-bottom: var(--s-4); }
.tier__label { font-family: var(--serif); font-size:1.5rem; font-weight:500; letter-spacing:-.018em; margin-bottom: var(--s-4); }
.tier__price { font-family: var(--serif); font-size: 2.35rem; font-weight:500; letter-spacing:-.03em;
  line-height:1; font-variant-numeric: tabular-nums; }
.tier__price span { font-family: var(--sans); font-size:.9rem; font-weight:400; color: var(--ink-muted); letter-spacing:0; }
.tier--feature .tier__price span { color: var(--on-navy-muted); }
.tier__meta { font-family: var(--sans); font-size:.82rem; line-height:1.55; color: var(--ink-muted); margin: var(--s-3) 0 var(--s-5); }
.tier__list { list-style:none; padding: var(--s-5) 0 0; margin: 0 0 var(--s-6); border-top: 1px solid var(--rule); flex:1; }
.tier__li { position:relative; padding-left: 20px; margin-bottom: 12px; font-family: var(--sans);
  font-size:.9rem; line-height:1.5; color: var(--ink); }
.tier__li::before { content:""; position:absolute; left:0; top:9px; width:11px; height:1px; background: var(--sello); }
.tier--feature .tier__li { color: var(--on-navy); }

/* ---------- 17. SCORECARD ------------------------------------------------ */
.scorecard { border:1px solid var(--rule); border-radius: var(--r-md); background: var(--paper-raised); overflow:hidden; }
.scorecard__head { display:flex; align-items:center; justify-content:space-between; gap: var(--s-4);
  padding: var(--s-4) var(--s-5); border-bottom:1px solid var(--rule); background: var(--paper-recessed); flex-wrap: wrap; }
.scorecard__title { font-family: var(--mono); font-size:.68rem; letter-spacing:.11em; text-transform:uppercase; color: var(--ink-faint); }
.scorecard__rows { display:grid; }
.scorecard__row { display:grid; grid-template-columns: 1fr auto; gap: var(--s-4); align-items:center;
  padding: 14px var(--s-5); border-bottom:1px solid var(--rule); }
.scorecard__row:last-child { border-bottom:0; }
.scorecard__k { font-family: var(--sans); font-size:.88rem; color: var(--ink-muted); }
.scorecard__v { font-family: var(--mono); font-size:.86rem; color: var(--ink); font-variant-numeric: tabular-nums; }

/* ---------- 18. DEMO LINE ------------------------------------------------ */
.demo-line {
  display:grid; gap: var(--s-5); align-items:center;
  border:1px solid var(--rule-navy); border-radius: var(--r-md); padding: var(--s-6);
  background: var(--navy-raised);
}
@media (min-width: 820px) { .demo-line { grid-template-columns: 1fr auto; gap: var(--s-8); padding: var(--s-7); } }
.demo-line__num {
  font-family: var(--mono); font-size: clamp(1.25rem,1rem+1.1vw,1.75rem); font-weight:500;
  letter-spacing:-.01em; color: var(--on-navy); text-decoration:none; display:inline-block;
  border-bottom:1px solid var(--sello-lift); padding-bottom: 4px;
}
.demo-line__num:hover { color: var(--sello-lift); text-decoration:none; }

/* ---------- 19. FOOTER --------------------------------------------------- */
.site-foot { background: var(--navy-deep); color: var(--on-navy); padding-block: var(--s-9) var(--s-6); }
.site-foot__top { display:grid; gap: var(--s-7); padding-bottom: var(--s-8); border-bottom: 1px solid var(--rule-navy); }
@media (min-width: 760px)  { .site-foot__top { grid-template-columns: 1.4fr 1fr 1fr; } }
@media (min-width: 1060px) { .site-foot__top { grid-template-columns: 1.6fr repeat(4, 1fr); gap: var(--s-6); } }
.site-foot h2 { font-family: var(--sans); font-size:.7rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.15em; color: var(--sello-lift); margin: 0 0 var(--s-4); }
.site-foot ul { list-style:none; margin:0; padding:0; }
.site-foot li { margin-bottom: 11px; }
.site-foot li a { font-family: var(--sans); font-size:.875rem; color: var(--on-navy-muted); text-decoration:none;
  transition: color var(--t-fast); display:inline-block; min-height: 22px; }
.site-foot li a:hover { color: var(--on-navy); text-decoration:none; }
.site-foot__about { font-family: var(--sans); font-size:.86rem; line-height:1.6; color: var(--on-navy-muted);
  max-width: 40ch; margin: var(--s-4) 0 0; }
.site-foot__addr { font-family: var(--sans); font-size:.82rem; line-height:1.65; color: var(--on-navy-faint);
  font-style: normal; margin-top: var(--s-4); }
.site-foot__legal { padding-top: var(--s-6); display:flex; flex-wrap:wrap; gap: var(--s-3) var(--s-6); justify-content:space-between; }
.site-foot__legal p { font-family: var(--sans); font-size:.78rem; line-height:1.6; color: var(--on-navy-faint); margin:0; max-width: 78ch; }

/* ---------- 20. MISC ----------------------------------------------------- */
.crumbs { font-family: var(--sans); font-size:.76rem; letter-spacing:.02em; color: var(--ink-faint); padding-top: var(--s-6); }
.crumbs a { color: var(--ink-faint); text-decoration:none; }
.crumbs a:hover { color: var(--sello-deep); }
.crumbs span { margin-inline: 8px; opacity:.5; }

.note {
  border-left: 2px solid var(--sello); padding: var(--s-3) 0 var(--s-3) var(--s-5);
  font-family: var(--sans); font-size:.86rem; line-height:1.6; color: var(--ink-muted);
}
.on-navy .note { border-color: var(--sello-lift); color: var(--on-navy-muted); }
.es-note { border-left: 3px solid var(--sello); padding-left: .6rem; color: var(--ink-muted); }

.foot-notes { margin-top: var(--s-6); padding-top: var(--s-5); border-top: 1px solid var(--rule); display:grid; gap: var(--s-3); }
.foot-notes p { font-family: var(--sans); font-size:.78rem; line-height:1.6; color: var(--ink-faint); margin:0; max-width: 84ch; }
.on-navy .foot-notes { border-color: var(--rule-navy); }
.on-navy .foot-notes p { color: var(--on-navy-faint); }

.pull {
  font-family: var(--serif); font-style: italic; font-weight:400;
  font-size: clamp(1.32rem,1.1rem+1.1vw,1.85rem); line-height:1.36; letter-spacing:-.012em;
  margin: 0; max-width: 30ch; border:0; padding:0;
}
.pull::before { content:""; display:block; width:36px; height:1px; background: var(--sello); margin-bottom: var(--s-5); }
.pull cite { display:block; margin-top: var(--s-5); font-style:normal; font-family: var(--sans);
  font-size:.72rem; letter-spacing:.15em; text-transform:uppercase; color: var(--ink-faint); }
.on-navy .pull cite { color: var(--on-navy-faint); }

.cta-band { text-align: left; }
.cta-band__display { max-width: 18ch; margin-bottom: var(--s-5); }
.cta-band__actions { display:flex; flex-wrap:wrap; gap: var(--s-3); margin-top: var(--s-7); }

.booking-frame { border:1px solid var(--rule); border-radius: var(--r-md); overflow:hidden; background: var(--paper-raised); min-height: 660px; }
@media (max-width: 720px) { .booking-frame { min-height: 900px; } }

.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table-scroll table { border-collapse: collapse; width:100%; min-width: 560px; font-family: var(--sans); font-size:.9rem; }
.table-scroll th, .table-scroll td { text-align:left; padding: 13px var(--s-4); border-bottom:1px solid var(--rule); vertical-align: top; }
.table-scroll th { font-size:.72rem; text-transform:uppercase; letter-spacing:.12em; color: var(--ink-faint); font-weight:600; }

/* ---------- 21. MOTION --------------------------------------------------- */
[data-reveal] { opacity: 0; transform: translateY(12px); }
[data-reveal][data-revealed="true"] {
  opacity: 1; transform: none;
  transition: opacity var(--t-slow) var(--ease), transform var(--t-slow) var(--ease);
  transition-delay: var(--reveal-delay, 0ms);
}
.no-js [data-reveal] { opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important; scroll-behavior: auto !important;
  }
  [data-reveal] { opacity:1 !important; transform:none !important; }
  .wave i { opacity: .62 !important; }
}

/* ---------- 22. LEGAL DOCUMENT PAGES -------------------------------------
   Counsel-approved bodies are preserved byte-for-byte; only the shell is
   re-skinned. These rules re-typeset the legacy markup in the new system.
   ------------------------------------------------------------------------- */
.legaldoc { padding: var(--s-6) 0 var(--s-10); }
.legaldoc .column { max-width: 780px; margin: 0 auto; padding-inline: var(--gutter); }
.legaldoc .column-wide { max-width: 980px; margin: 0 auto; padding-inline: var(--gutter); }
.legaldoc h1 { font-family: var(--serif); font-weight: 500;
  font-size: clamp(2rem,1.3rem+2.4vw,3rem); line-height:1.08; letter-spacing:-.022em;
  margin: 0 0 var(--s-5); }
.legaldoc h2 { font-family: var(--serif); font-weight:500;
  font-size: clamp(1.4rem,1.1rem+1.1vw,1.9rem); line-height:1.18; letter-spacing:-.014em;
  margin: 2.4em 0 .6em; padding-top: var(--s-5); border-top: 1px solid var(--rule); }
.legaldoc h3 { font-family: var(--serif); font-weight:600; font-size:1.16rem; line-height:1.3; margin: 1.8em 0 .5em; }
.legaldoc h4 { font-family: var(--sans); font-weight:600; font-size:.98rem; margin: 1.4em 0 .4em; }
.legaldoc p  { font-family: var(--serif); font-size:1.02rem; line-height:1.62; margin: 0 0 1.05em; }
.legaldoc p.lead { font-family: var(--serif); font-size: clamp(1.1rem,1rem+.4vw,1.28rem);
  line-height:1.5; color: var(--ink-muted); margin-bottom: var(--s-6); }
.legaldoc ul, .legaldoc ol { padding-left: 1.3em; margin: 0 0 1.2em; }
.legaldoc li { font-family: var(--serif); font-size:1.02rem; line-height:1.6; margin-bottom: .55em; }
.legaldoc li::marker { color: var(--sello-text); }
.legaldoc .breadcrumbs { font-family: var(--sans); font-size:.76rem; letter-spacing:.02em;
  color: var(--ink-faint); text-transform:none; padding: 0 0 var(--s-6); }
.legaldoc .breadcrumbs a { color: var(--ink-faint); text-decoration:none; }
.legaldoc .breadcrumbs a:hover { color: var(--sello-deep); }
.legaldoc .breadcrumbs span.sep { margin: 0 8px; opacity:.5; }
.legaldoc .callout { background: var(--paper-raised); border: 1px solid var(--rule);
  border-left: 2px solid var(--sello); border-radius: var(--r-md);
  padding: var(--s-5); margin: var(--s-6) 0; font-family: var(--sans);
  font-size:.92rem; line-height:1.6; color: var(--ink-muted); }
.legaldoc .callout p:last-child { margin-bottom:0; }
.legaldoc hr.rule { margin: var(--s-8) 0; }
.legaldoc table { border-collapse: collapse; width:100%; font-family: var(--sans); font-size:.9rem; margin: var(--s-5) 0; }
.legaldoc th, .legaldoc td { text-align:left; padding: 12px var(--s-4); border-bottom: 1px solid var(--rule); vertical-align: top; }
.legaldoc th { font-size:.74rem; text-transform:uppercase; letter-spacing:.1em; color: var(--ink-faint); font-weight:600; }
.legaldoc section { padding: 0; }
.legaldoc .kicker { font-family: var(--sans); font-size:.7rem; font-weight:600; text-transform:uppercase;
  letter-spacing:.18em; color: var(--sello-text); display:inline-block; margin: 0 0 var(--s-5); }
.legaldoc .kicker::after { content:""; display:inline-block; width:28px; height:1px;
  background: currentColor; vertical-align:middle; margin-left:12px; opacity:.55; }
.legaldoc .btn { border-radius: var(--r-sm); }
.legaldoc .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.legaldoc > .column > *:first-child { margin-top: 0; }
.legaldoc h2:first-of-type { border-top: 0; padding-top: 0; }

/* Legacy legal-document classes carried over from the counsel-approved pages */
.legaldoc .doc { padding: 0; }
.legaldoc .meta { font-family: var(--sans); font-size:.84rem; color: var(--ink-faint); margin-bottom: var(--s-4); }
.legaldoc .lang-switch { font-family: var(--sans); font-size:.84rem; color: var(--ink-muted); margin-bottom: var(--s-6); }
.legaldoc .preamble { background: var(--paper-raised); border: 1px solid var(--rule); border-radius: var(--r-md);
  padding: var(--s-5); margin: var(--s-6) 0 var(--s-7); }
.legaldoc .preamble p:last-child { margin-bottom: 0; }
.legaldoc .preamble p { font-size: .98rem; }
.legaldoc .endnote { font-family: var(--sans); font-size:.84rem; line-height:1.6; color: var(--ink-faint);
  border-top: 1px solid var(--rule); padding-top: var(--s-5); margin-top: var(--s-7); }
.legaldoc .toc { font-family: var(--sans); font-size:.9rem; }
.legaldoc a { text-decoration-color: var(--sello); }

/* ---------- 23. TARGET SIZE (WCAG 2.2 AA · 2.5.8) ------------------------ */
.brand { padding-block: 7px; }
.site-foot li a { padding-block: 4px; display: inline-block; }
.site-foot__addr a { padding-block: 4px; display: inline-block; }
.crumbs a, .legaldoc .breadcrumbs a { padding-block: 5px; display: inline-block; }
.link-arrow { min-height: 28px; }
.tabs__btn { min-height: 44px; }

/* Eyebrow rule would orphan onto its own line on narrow columns. */
@media (max-width: 760px) { .eyebrow::after { display: none; } }
/* Section heads inside a two-column split keep the narrow editorial measure. */
/* Links used as list rows must meet the 24px minimum target size. */
.rail__item a, .rail__t a { display: inline-block; padding-block: 5px; }
.table-scroll td a { display: inline-block; padding-block: 4px; }

/* Nav demonstration card: container, with only the number as a tel: link. */
.nav__card-title { font-family: var(--serif); font-size: 1.1rem; font-weight: 600;
  margin: 12px 0 6px; display: block; color: var(--on-navy); }
.nav__card-num { font-size: .9rem; color: var(--sello-lift); text-decoration: none;
  display: inline-block; padding-block: 4px; border-bottom: 1px solid transparent;
  transition: border-color var(--t-fast); }
.nav__card-num:hover { color: var(--sello-lift); border-bottom-color: var(--sello-lift); text-decoration: none; }
.nav__card-note { font-family: var(--sans); font-size: .72rem; color: var(--on-navy-faint);
  margin-top: 10px; display: block; line-height: 1.45; }
