/*
 * Athena Care shared global CSS — ONE file for public site + backoffice.
 * Canonical path: www/athena-www/styles.css
 * Also served as /styles.css (public) and /design/athena-app.css (backoffice alias).
 * Do not maintain a second copy. Edit this file only.
 */

:root {
  /* Royal (primary)*/
  --ac-royal-10: #1a0e28;
  --ac-royal-20: #2c1640;
  --ac-royal-30: #4f256a;
  --ac-royal-40: #713495;
  --ac-royal-50: #9443bf;
  --ac-royal-60: #a866cb;
  --ac-royal-70: #bc89d7;
  --ac-royal-80: #cface3;
  --ac-royal-90: #e3cfef;
  --ac-royal-95: #f7f2fb;

  /* Adobe (secondary) */
  --ac-adobe-10: #180b07;
  --ac-adobe-20: #352926;
  --ac-adobe-30: #401e13;
  --ac-adobe-40: #713922;
  --ac-adobe-50: #a35432;
  --ac-adobe-60: #c07852;
  --ac-adobe-70: #d39874;
  --ac-adobe-80: #e5ba9c;
  --ac-adobe-90: #f3dcc8;
  --ac-adobe-95: #faf1ea;

  /* Cumberland (secondary) — 30 & 50 anchored; 10–20 toward ink; 40 midpoint; 60–80 linear Δ(15,19,9); 80→90→95 use same +Δ as Royal light end (+20,+35,+12 per step, incl. 90→95) */
  --ac-cumberland-10: #040805;
  --ac-cumberland-20: #081009;
  --ac-cumberland-30: #0d1a0e;
  --ac-cumberland-40: #1c2d17;
  --ac-cumberland-50: #2b4020;
  --ac-cumberland-60: #3a5329;
  --ac-cumberland-70: #496632;
  --ac-cumberland-80: #58793b;
  --ac-cumberland-90: #6c9c47;
  --ac-cumberland-95: #80bf53;
  
  /* Sage (secondary accent) */
  --ac-sage-10: #374b3f;
  --ac-sage-20: #4e6152;
  --ac-sage-30: #657765;
  --ac-sage-40: #7c8d78;
  --ac-sage-50: #93a38b;
  --ac-sage-60: #b0bda8;
  --ac-sage-70: #ccd8c6;
  --ac-sage-80: #e9f2e3;
  --ac-sage-90: #f2f7ee;
  --ac-sage-95: #f8fbf5;
  --ac-sage-wash: var(--ac-sage-80);

  /* Summit (secondary) */
  --ac-summit-10: #050a0c;
  --ac-summit-20: #1b2326;
  --ac-summit-30: #313c40;
  --ac-summit-40: #475459;
  --ac-summit-50: #5d6d73;
  --ac-summit-60: #76868d;
  --ac-summit-70: #899fa7;
  --ac-summit-80: #9fb8c1;
  --ac-summit-90: #b5d1db;
  --ac-summit-95: #e3ebef;

  /* Warm neutrals (Ivory / Slate family) */
  --ac-slate-dark:   #191919;
  --ac-slate:        #262625;
  --ac-slate-light:  #40403E;
  --ac-cloud-dark:   #666663;
  --ac-cloud:        #91918D;
  --ac-cloud-light:  #BFBFBA;
  --ac-ivory-dark:   #E5E4DF;
  --ac-ivory:        #F0F0EB;
  --ac-ivory-light:  #FAFAF7;

  /*
   * Web Awesome gray scale → Athena warm neutrals.
   * --wa-color-neutral-* aliases this ramp (see WA color/variants/neutral.css), so
   * variant="neutral" buttons, borders, and fills pick up ivory/slate/cloud instead of cool gray.
   */
  --wa-color-gray-05: var(--ac-slate-dark);
  --wa-color-gray-10: var(--ac-slate-dark);
  --wa-color-gray-20: var(--ac-slate);
  --wa-color-gray-30: var(--ac-slate-light);
  --wa-color-gray-40: var(--ac-cloud-dark);
  --wa-color-gray-50: color-mix(in srgb, var(--ac-cloud-dark) 38%, var(--ac-cloud) 62%);
  --wa-color-gray-60: var(--ac-cloud);
  --wa-color-gray-70: var(--ac-cloud-light);
  --wa-color-gray-80: var(--ac-ivory-dark);
  --wa-color-gray-90: var(--ac-ivory);
  --wa-color-gray-95: var(--ac-ivory-light);
  --wa-color-gray: var(--wa-color-gray-40);
  --wa-color-gray-key: 40;

  /* Brand.css semantic */
  --ac-success: #256a2e;
  --ac-warning: #bd9520;
  --ac-danger: #9e2424;

  /* App font stacks */
  --ac-font-body: 'Inter', system-ui, sans-serif;
  --ac-font-sans: 'Work Sans', system-ui, sans-serif;
  --ac-font-serif: 'Newsreader', Georgia, serif;
  --ac-font-mono: 'IBM Plex Mono', ui-monospace, monospace;
  --ac-font-condensed: 'Work Sans', var(--ac-font-sans);

  /* Success scale anchored to brand guide */
  --wa-color-success-10: #0f2914;
  --wa-color-success-20: #1a4520;
  --wa-color-success-30: #1d5526;
  --wa-color-success-40: var(--ac-success);
  --wa-color-success-50: #3d8a49;
  --wa-color-success-60: #56a562;
  --wa-color-success-70: #7bc085;
  --wa-color-success-80: #a8d6ae;
  --wa-color-success-90: #d8eedb;
  --wa-color-success-95: #eef7ef;

  --wa-color-warning-40: var(--ac-warning);
  --wa-color-danger-40: var(--ac-danger);
}

/*
 * Active highlight ramp → Web Awesome --wa-color-brand-*.
 * Switch with html[data-ac-brand="royal"|"adobe"|"cumberland"] (localStorage + app menu).
 */
html {
  color-scheme: light dark;

  --ac-brand-05: #100818;
  --ac-brand-10: var(--ac-royal-10);
  --ac-brand-20: var(--ac-royal-20);
  --ac-brand-30: var(--ac-royal-30);
  --ac-brand-40: var(--ac-royal-40);
  --ac-brand-50: var(--ac-royal-40);
  --ac-brand-60: var(--ac-royal-50);
  --ac-brand-70: var(--ac-royal-70);
  --ac-brand-80: var(--ac-royal-80);
  --ac-brand-90: var(--ac-royal-90);
  --ac-brand-95: var(--ac-royal-95);

  --wa-color-brand-05: var(--ac-brand-05);
  --wa-color-brand-10: var(--ac-brand-10);
  --wa-color-brand-20: var(--ac-brand-20);
  --wa-color-brand-30: var(--ac-brand-30);
  --wa-color-brand-40: var(--ac-brand-40);
  --wa-color-brand-50: var(--ac-brand-50);
  --wa-color-brand-60: var(--ac-brand-60);
  --wa-color-brand-70: var(--ac-brand-70);
  --wa-color-brand-80: var(--ac-brand-80);
  --wa-color-brand-90: var(--ac-brand-90);
  --wa-color-brand-95: var(--ac-brand-95);
  /* Core brand alias — WA defaults this to blue; keep it on the Athena ramp. */
  --wa-color-brand: var(--wa-color-brand-50);
  --wa-color-brand-on: white;

  /*
   * Root font-size drives rem everywhere (body via --wa-font-size-m, shell headings, spacing).
   * Keep scale at 1 so we don’t double-apply vs html font-size (data-ui-size).
   */
  font-size: 100%;
  --wa-font-size-scale: 1;
}

html[data-ac-brand="adobe"] {
  --ac-brand-05: #0c0604;
  --ac-brand-10: var(--ac-adobe-10);
  --ac-brand-20: var(--ac-adobe-20);
  --ac-brand-30: var(--ac-adobe-30);
  --ac-brand-40: var(--ac-adobe-40);
  --ac-brand-50: var(--ac-adobe-50);
  --ac-brand-60: var(--ac-adobe-60);
  --ac-brand-70: var(--ac-adobe-70);
  --ac-brand-80: var(--ac-adobe-80);
  --ac-brand-90: var(--ac-adobe-90);
  --ac-brand-95: var(--ac-adobe-95);
}

html[data-ac-brand="cumberland"] {
  --ac-brand-05: #020403;
  --ac-brand-10: var(--ac-cumberland-10);
  --ac-brand-20: var(--ac-cumberland-20);
  --ac-brand-30: var(--ac-cumberland-30);
  --ac-brand-40: var(--ac-cumberland-40);
  --ac-brand-50: var(--ac-cumberland-50);
  --ac-brand-60: var(--ac-cumberland-60);
  --ac-brand-70: var(--ac-cumberland-70);
  --ac-brand-80: var(--ac-cumberland-80);
  --ac-brand-90: var(--ac-cumberland-90);
  --ac-brand-95: var(--ac-cumberland-95);
}

html[data-ui-size="small"] {
  font-size: 87.5%;
}

html[data-ui-size="large"] {
  font-size: 112.5%;
}

/* Light UI (no wa-dark on <html>) */
html:not(.wa-dark) {
  --wa-color-surface-default: var(--ac-ivory);
  --wa-color-surface-lowered: var(--ac-ivory-dark);
  --wa-color-surface-raised: var(--ac-ivory-light);
  /* One step darker than neutral-border-normal (80) → 70 */
  --wa-color-surface-border: var(--wa-color-neutral-70);
  --wa-color-text-normal: var(--ac-slate-dark);
  --wa-color-text-quiet: var(--ac-cloud-dark);
  --wa-color-text-link: var(--ac-brand-30);
  --wa-color-focus: var(--ac-brand-40);
  --headline-color: var(--ac-brand-40);
}

/* Dark UI — surfaces & type only; highlight ramp follows data-ac-brand */
html.wa-dark {
  --wa-color-surface-lowered: var(--ac-slate-dark);
  /* Halfway in brightness between prior default (slate) and lowered. */
  --wa-color-surface-default: color-mix(
    in oklab,
    var(--ac-slate-dark),
    var(--ac-slate) 50%
  );
  /* Between default and surface-border (slate-light) — oklab ~⅓ toward border. */
  --wa-color-surface-raised: color-mix(
    in oklab,
    var(--wa-color-surface-default),
    var(--ac-slate-light) 32%
  );
  /* Concrete step (not neutral-border-*) so border aliases can point here. */
  --wa-color-surface-border: var(--wa-color-neutral-30);
  --wa-color-text-normal: var(--ac-ivory-light);
  --wa-color-text-quiet: var(--ac-cloud-dark);
  --wa-color-text-link: var(--ac-brand-60);
  --wa-color-focus: var(--ac-brand-50);
  --headline-color: var(--ac-brand-50);
}

/* Layout aliases — map to Web Awesome themed tokens */
html {
  --bg: var(--wa-color-surface-default);
  --text: var(--wa-color-text-normal);
  --text-muted: var(--wa-color-text-quiet);
  --surface: var(--wa-color-surface-raised);
  --well: var(--wa-color-surface-lowered);
  /* One shared chrome border — form controls + outlined neutrals follow surface-border. */
  --border: var(--wa-color-surface-border);
  --border-mid: var(--wa-color-surface-border);
  --wa-color-neutral-border-loud: var(--wa-color-surface-border);
  --wa-color-neutral-border-normal: var(--wa-color-surface-border);
  --accent: var(--wa-color-brand-50);
  --warn: var(--wa-color-warning-50);
  --radius: var(--wa-border-radius-m);
  --font: var(--ac-font-body);
  --font-heading: var(--ac-font-sans);
  --font-mono: var(--ac-font-mono);
  --font-display: var(--ac-font-serif);

  --wa-font-family-body: var(--ac-font-body);
  --wa-font-family-heading: var(--ac-font-sans);
  --wa-font-weight-normal: 400;
  --wa-font-weight-body: 400;

  /* Form fields sit on surface-raised so they lift off the page (surface-default). */
  --wa-form-control-background-color: var(--wa-color-surface-raised);
  --wa-form-control-border-color: var(--wa-color-surface-border);
  --wa-form-control-activated-color: var(--accent);
  --wa-form-control-value-color: var(--text);
  --wa-form-control-placeholder-color: var(--text-muted);
}

html,
body {
  min-height: 100%;
  background-color: var(--wa-color-surface-default);
  color: var(--text);
  font-family: var(--font);
  font-weight: 400;
}

body.site-nav-open,
body.site-screener-open,
body.site-coordinator-open,
body.site-locations-open {
  overflow: hidden;
}

wa-button {
  --wa-font-family-body: var(--ac-font-sans);
}

wa-button::part(base) {
  font-family: var(--ac-font-sans);
}

/*
 * Web Awesome — compact control sizing (public site).
 * Geometry only; palette comes from Athena tokens above.
 */
wa-button[size='s'] {
  --height: 1.625rem;
  --padding-inline: 0.35rem;
}
wa-button[size='m'] {
  --height: 2.125rem;
  --padding-inline: 0.625rem;
}
wa-button[size='l'] {
  --height: 2.75rem;
  --padding-inline: 0.75rem;
}

wa-button[size='s']::part(base) {
  height: 1.625rem;
  min-height: 0;
  padding-inline: 0.35rem;
}
wa-button[size='m']::part(base) {
  height: 2.125rem;
  min-height: 0;
  padding-inline: 0.625rem;
}
wa-button[size='l']::part(base) {
  height: 2.75rem;
  min-height: 0;
  padding-inline: 0.75rem;
}

.page-main a.ac-trigger-btn,
.page-main button.ac-trigger-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  margin: 0;
  border: 0;
  border-radius: var(--wa-border-radius-m, 0.375rem);
  background-color: var(--ac-brand-40, #8b2942);
  color: #fff;
  font-family: var(--ac-font-sans, inherit);
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
}

.page-main a.ac-trigger-btn:hover,
.page-main button.ac-trigger-btn:hover {
  filter: brightness(1.08);
  color: #fff;
  text-decoration: none;
}

.page-main .ac-trigger-btn--s {
  min-height: 1.625rem;
  padding: 0.15rem 0.55rem;
  font-size: 0.8125rem;
}

.page-main .ac-trigger-btn--m {
  min-height: 2.125rem;
  padding: 0.35rem 0.85rem;
  font-size: 0.9375rem;
}

.page-main .ac-trigger-btn--l {
  min-height: 2.75rem;
  padding: 0.5rem 1.1rem;
  font-size: 1.0625rem;
}

.page-main .ac-trigger-btn--royal {
  background-color: #9443bf;
}

.page-main .ac-trigger-btn--adobe {
  background-color: #a35432;
}

.page-main .ac-trigger-btn--cumberland {
  background-color: #2b4020;
}

.page-main .ac-trigger-btn--summit {
  background-color: #5d6d73;
}

wa-input[size='s'] {
  --height: 1.625rem;
  --padding-inline: 0.5rem;
}
wa-input[size='s']::part(base) {
  min-height: 0;
  padding-inline: 0.5rem;
}

wa-select[size='s'] {
  --height: 2.125rem;
  --padding-inline: 0.5rem;
  --wa-form-control-height: 2.125rem;
  --wa-form-control-padding-inline: 0.5rem;
}
wa-select[size='s']::part(combobox) {
  padding-inline: 0.5rem;
}

wa-combobox[size='s'] {
  --height: 2.125rem;
  --padding-inline: 0.5rem;
  --wa-form-control-height: 2.125rem;
  --wa-form-control-padding-inline: 0.5rem;
}
wa-combobox[size='s']::part(combobox) {
  padding-inline: 0.5rem;
}

wa-textarea[size='s'] {
  --height: auto;
  --padding-inline: 0.5rem;
}
wa-textarea[size='s']::part(base) {
  min-height: 0;
  padding-inline: 0.5rem;
}

wa-rating {
  --symbol-color-active: var(--accent);
  --symbol-color: var(--text-muted);
}

wa-radio[size='s'],
wa-radio-group[size='s'] wa-radio {
  --height: 1.625rem;
  --wa-form-control-height: 1.625rem;
  --padding-inline: 0.25rem;
  --wa-form-control-padding-inline: 0.25rem;
}
wa-radio[size='m'],
wa-radio-group[size='m'] wa-radio {
  --height: 2.125rem;
  --wa-form-control-height: 2.125rem;
  --padding-inline: 0.35rem;
  --wa-form-control-padding-inline: 0.35rem;
}
wa-radio[size='l'],
wa-radio-group[size='l'] wa-radio {
  --height: 2.75rem;
  --wa-form-control-height: 2.75rem;
  --padding-inline: 0.5rem;
  --wa-form-control-padding-inline: 0.5rem;
}

wa-radio[appearance='button'][size='s'],
wa-radio-group[size='s'] wa-radio[appearance='button'],
wa-radio[appearance='button'][size='m'],
wa-radio-group[size='m'] wa-radio[appearance='button'],
wa-radio[appearance='button'][size='l'],
wa-radio-group[size='l'] wa-radio[appearance='button'] {
  min-height: 0 !important;
  height: var(--wa-form-control-height) !important;
  padding-inline: var(--wa-form-control-padding-inline) !important;
}

wa-radio-group[size='s']::part(form-control-input),
wa-radio-group[size='m']::part(form-control-input),
wa-radio-group[size='l']::part(form-control-input) {
  min-height: 0;
}

wa-radio-group,
wa-tab-group,
wa-details,
wa-breadcrumb,
wa-tree {
  font-family: var(--ac-font-condensed);
}

wa-dropdown,
wa-dropdown::part(menu),
wa-select,
wa-combobox {
  --wa-color-brand-fill-quiet: color-mix(in srgb, var(--accent) 22%, var(--bg));
  --wa-color-neutral-fill-normal: color-mix(in srgb, var(--accent) 22%, var(--bg));
}

wa-select,
wa-combobox {
  --wa-color-surface-raised: var(--bg) !important;
  --wa-color-surface-default: var(--bg) !important;
  --wa-color-surface-lowered: var(--bg) !important;
  --wa-color-surface-border: var(--border) !important;
}

wa-dropdown::part(menu) {
  background: var(--bg);
  background-color: var(--bg);
  color: var(--text);
  border-color: var(--border);
}

wa-select::part(listbox),
wa-combobox::part(listbox) {
  background: var(--bg) !important;
  background-color: var(--bg) !important;
  color: var(--text);
  border-color: var(--border);
}

html.wa-dark wa-dropdown,
html.wa-dark wa-dropdown-item,
html.wa-dark wa-select,
html.wa-dark wa-combobox,
html.wa-dark wa-option {
  --wa-color-brand-fill-quiet: color-mix(in srgb, var(--accent) 22%, var(--bg));
  --wa-color-neutral-fill-normal: color-mix(in srgb, var(--accent) 22%, var(--bg));
  --wa-color-neutral-fill-quiet: color-mix(in srgb, var(--accent) 22%, var(--bg));
}

h1,
h2,
h3,
.site-overlay-menu__title,
.site-screeners__title,
.home-testimonials__title,
.home-articles__title,
.home-articles__card-title,
.home-newsletter__title,
.home-crisis__title,
.site-footer__heading {
  font-family: var(--font-heading);
}

/* Public page body — live site and CMS WYSIWYG.
 * Set type tokens on .page-main so CMS chrome (athena-app.css, wa-page.shell)
 * cannot inherit Work Sans / IBM Plex onto paragraphs and h4. */
.page-main {
  --ac-font-body: 'Inter', system-ui, sans-serif;
  --ac-font-sans: 'Work Sans', system-ui, sans-serif;
  --font: var(--ac-font-body);
  --font-heading: var(--ac-font-sans);
  font-family: var(--font);
  color: var(--text);
}

.page-main :is(h1, h2, h3, h5, h6) {
  font-family: var(--font-heading);
  font-weight: var(--wa-font-weight-heading);
  line-height: var(--wa-line-height-condensed);
  text-wrap: balance;
  color: var(--text);
}

.page-main h1 {
  font-size: clamp(2rem, 1.5rem + 2vw, 2.75rem);
  color: var(--headline-color);
  letter-spacing: -0.02em;
}

.page-main h2 {
  font-size: var(--wa-font-size-2xl);
  letter-spacing: -0.01em;
}

.page-main h3 {
  font-size: var(--wa-font-size-xl);
}

.page-main h4 {
  font-family: var(--font);
  font-weight: var(--wa-font-weight-heading);
  line-height: var(--wa-line-height-condensed);
  text-wrap: balance;
  color: var(--wa-color-text-quiet);
  font-size: var(--wa-font-size-m);
  text-transform: uppercase;
}

.page-main h5 {
  font-size: var(--wa-font-size-m);
}

.page-main h6 {
  font-size: var(--wa-font-size-xs);
}

/* Tighter paragraph rhythm (WA native sets 24px between paragraphs) */
.page-main p {
  margin-block-end: var(--wa-space-s);
}

.page-main p:last-child {
  margin-block-end: 0;
}

/* Apple HIG minimum touch target (44×44pt) */
:root {
  --site-touch-target: 2.75rem;
  --site-desktop-min: 48rem;
  --site-nav-inline-min: 64rem;
  --site-content-max: 72rem;
  --page-sidebar-max: 18rem;
  --site-header-padding-top: 0px;
  /* Shared by header nav + screener overlay (must live on :root — not only .site-header) */
  --site-header-bar-height: calc(var(--site-touch-target) + env(safe-area-inset-top, 0px) + 1px);
}

/* Visibility utilities — mobile default */
.site-header__desktop-only {
  display: none !important;
}

.site-header__nav-inline-only {
  display: none !important;
}

.site-header__lockup {
  display: none;
}

/* —— Site header —— */
.site-include-header {
  display: block;
  position: sticky;
  top: 0;
  z-index: 100;
}

.site-header {
  background-color: transparent;
}

.site-header__bar {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  flex-shrink: 0;
  min-height: var(--site-touch-target);
  padding-top: env(safe-area-inset-top, 0px);
  padding-inline: max(1rem, env(safe-area-inset-left, 0px)) max(1rem, env(safe-area-inset-right, 0px));
  padding-bottom: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--wa-color-surface-lowered) 50%, transparent);
  background-color: color-mix(in srgb, var(--wa-color-surface-default) 70%, transparent);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  overflow: visible;
}

.site-header__bar::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  height: 1px;
  background-color: color-mix(in srgb, var(--wa-color-neutral-60) 55%, transparent);
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}

.site-header__bar.is-hero-under::after {
  opacity: var(--site-header-border-opacity, 1);
}

@media (prefers-reduced-motion: reduce) {
  .site-header__bar::after {
    transition: none;
  }
}

.site-header__brand {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  flex-shrink: 0;
  min-width: min-content;
  min-height: var(--site-touch-target);
  margin-inline: 0;
  padding: 0;
  justify-self: start;
  overflow: visible;
  border-radius: 0;
  text-decoration: none;
}

.site-header__mark {
  display: block;
  flex-shrink: 0;
  width: 2.25rem;
  height: 2.25rem;
  overflow: visible;
}

.site-header__cta-wrap {
  justify-self: center;
}

.site-header__cta {
  --wa-form-control-height: var(--site-touch-target);
}

.site-header__menu-toggle {
  --wa-form-control-height: 3rem;
  --wa-form-control-min-width: 3rem;
  justify-self: end;
}

.site-header__menu-toggle wa-icon {
  font-size: 1.375rem;
}

.site-header__icon--close {
  display: none;
}

.site-header[data-menu-open="true"] .site-header__icon--open {
  display: none;
}

.site-header[data-menu-open="true"] .site-header__icon--close {
  display: inline-flex;
}

.site-header__nav,
.site-overlay-menu {
  display: none;
  flex-direction: column;
  min-height: 0;
  padding-inline: max(1rem, env(safe-area-inset-left, 0px)) max(1rem, env(safe-area-inset-right, 0px));
  background-color: var(--wa-color-surface-default);
}

.site-header__nav.is-visible,
.site-overlay-menu.is-visible {
  display: flex !important;
  position: fixed;
  inset: var(--site-header-bar-height, calc(3rem + env(safe-area-inset-top, 0px) + 1px)) 0 0 0;
  z-index: 150;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s ease;
}

.site-header__nav.is-visible.is-open,
.site-overlay-menu.is-visible.is-open {
  opacity: 1;
  pointer-events: auto;
}

@media (prefers-reduced-motion: reduce) {
  .site-header__nav.is-visible,
  .site-overlay-menu.is-visible {
    transition: none;
  }
}

.site-header__nav[hidden],
.site-overlay-menu[hidden] {
  display: none !important;
}

.site-header__nav-body,
.site-overlay-menu__body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-top: var(--wa-space-m);
}

.site-overlay-menu__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
  gap: var(--wa-space-s);
  min-height: var(--site-touch-target);
  padding-block: var(--wa-space-s);
  border-bottom: 1px solid var(--wa-color-surface-lowered);
}

.site-overlay-menu__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--wa-font-size-l);
  font-weight: var(--wa-font-weight-semibold);
  line-height: 1.2;
  color: var(--text);
}

.site-overlay-menu__close {
  flex-shrink: 0;
}

.site-overlay-menu .site-overlay-menu__body {
  padding-top: 0;
}

.site-header__nav-actions {
  display: flex;
  flex-direction: column;
  gap: var(--wa-space-s);
  padding-top: var(--wa-space-m);
}

.site-header__nav-btn {
  width: 100%;
  --wa-form-control-height: 3.5rem;
}

.site-header__nav-btn::part(base) {
  justify-content: flex-start;
}

.site-header__nav-actions .site-header__nav-btn[variant="neutral"]::part(base) {
  background-color: var(--wa-color-surface-raised);
}

.site-header__nav-action-expandable {
  margin: 0;
}

.site-header__nav-expand-wrap {
  position: relative;
  width: 100%;
}

.site-header__nav-expand-wrap .site-header__nav-btn::part(base) {
  padding-inline-end: calc(var(--wa-space-m) + 1.25rem);
}

.site-header__nav-expand-chevron {
  position: absolute;
  top: 50%;
  right: var(--wa-space-m);
  font-size: 0.875rem;
  color: var(--text-muted);
  pointer-events: none;
  transform: translateY(-50%);
  transition: transform 0.18s ease;
}

.site-header__nav-action-expandable.is-open .site-header__nav-expand-chevron {
  transform: translateY(-50%) rotate(180deg);
}

.site-header__nav-sublist--action {
  padding-top: var(--wa-space-2xs);
}

.site-overlay-menu.site-coordinator-menu.is-visible {
  padding-inline: max(1rem, env(safe-area-inset-left, 0px)) max(1rem, env(safe-area-inset-right, 0px));
}

.site-coordinator-menu__dialog {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}

.site-coordinator-menu__bar {
  justify-content: flex-end;
}

.site-coordinator-menu__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: center;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-top: var(--wa-space-m);
  padding-bottom: max(var(--wa-space-xl), env(safe-area-inset-bottom, 0px));
}

.site-coordinator-menu__intro {
  --coordinator-title-size: clamp(1.75rem, 1.5rem + 2vw, 2.25rem);
  align-self: stretch;
  display: flex;
  align-items: center;
  gap: var(--wa-space-m);
  width: 100%;
  margin-bottom: var(--wa-space-l);
}

.site-coordinator-menu__image {
  flex: 0 0 auto;
  width: auto;
  height: 5rem;
  object-fit: contain;
}

.site-coordinator-menu__title {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  font-family: var(--ac-font-serif);
  font-size: var(--coordinator-title-size);
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--headline-color);
  text-align: left;
}

.site-coordinator-menu__schedule {
  width: auto;
  max-width: 100%;
  align-self: center;
  margin-bottom: var(--wa-space-l);
  --wa-form-control-height: 3.5rem;
}

.site-coordinator-menu__schedule::part(base) {
  justify-content: flex-start;
}

.site-coordinator-menu__schedule wa-icon {
  font-size: 1.25rem;
}

.site-coordinator-menu__contacts {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--wa-space-s);
  width: 100%;
}

.site-coordinator-menu__contact {
  display: inline-flex;
  align-items: center;
  gap: var(--wa-space-s);
  min-height: var(--site-touch-target);
  font-size: var(--wa-font-size-m);
  font-weight: var(--wa-font-weight-semibold);
  line-height: var(--wa-line-height-normal);
  color: var(--text);
  text-decoration: none;
}

.site-coordinator-menu__contact:hover {
  color: var(--accent);
}

.site-coordinator-menu__contact-icon {
  flex-shrink: 0;
  font-size: 1rem;
  color: var(--ac-brand-40);
}

.site-coordinator-menu__bottom {
  flex-shrink: 0;
  align-self: stretch;
  width: 100%;
  margin-top: auto;
  padding-top: var(--wa-space-xl);
  text-align: center;
}

.site-coordinator-menu__insurance {
  margin-bottom: var(--wa-space-m);
  text-align: center;
}

.site-coordinator-menu__insurance-lede,
.site-coordinator-menu__insurance-list,
.site-coordinator-menu__insurance-note {
  margin: 0;
  font-size: var(--wa-font-size-s);
  line-height: var(--wa-line-height-normal);
  color: var(--text);
}

.site-coordinator-menu__insurance-list {
  margin-top: var(--wa-space-s);
  font-weight: var(--wa-font-weight-medium);
}

.site-coordinator-menu__insurance-note {
  margin-top: var(--wa-space-s);
  color: var(--text-muted);
}

.site-coordinator-menu__footer {
  flex-shrink: 0;
  margin: 0;
  padding-top: var(--wa-space-m);
  text-align: center;
}

.site-coordinator-menu__refer {
  width: auto;
}

.site-coordinator-menu__refer::part(base) {
  justify-content: flex-start;
  background-color: var(--wa-color-surface-raised);
}

@media (min-width: 48rem) {
  .site-overlay-menu.site-coordinator-menu.is-visible {
    inset: 0;
    align-items: center;
    justify-content: center;
    padding: var(--wa-space-l);
    background-color: color-mix(in srgb, var(--wa-color-neutral-30) 45%, transparent);
    overflow: hidden;
  }

  .site-coordinator-menu__dialog {
    position: relative;
    flex: 0 1 auto;
    width: min(28rem, calc(100vw - 2rem));
    max-height: calc(100dvh - 2rem);
    background-color: var(--ac-brand-40);
    border-radius: var(--wa-border-radius-l);
    box-shadow: 0 1rem 3rem color-mix(in srgb, #000 28%, transparent);
    overflow: hidden;
  }

  .site-coordinator-menu__bar {
    display: flex;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 2;
    justify-content: flex-end;
    min-height: 0;
    padding: var(--wa-space-2xs) var(--wa-space-2xs) 0;
    border-bottom: 0;
    background: transparent;
  }

  .site-coordinator-menu__bar .site-overlay-menu__title {
    display: none;
  }

  .site-coordinator-menu__close {
    display: inline-flex;
    flex-shrink: 0;
  }

  .site-coordinator-menu__close::part(base) {
    color: #fff;
    background-color: transparent;
    border-color: transparent;
  }

  .site-coordinator-menu__close:hover::part(base) {
    color: var(--ac-brand-40);
    background-color: #fff;
    border-color: #fff;
  }

  .site-coordinator-menu__close wa-icon {
    font-size: 1.375rem;
    color: inherit;
  }

  .site-coordinator-menu__body {
    align-items: center;
    width: auto;
    max-width: none;
    max-height: none;
    margin: 0;
    padding:
      var(--wa-space-l)
      var(--wa-space-l)
      var(--wa-space-l);
    background-color: transparent;
    border-radius: 0;
    box-shadow: none;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
  }

  .site-coordinator-menu__intro {
    align-self: center;
    flex-direction: column;
    align-items: center;
    text-align: center;
    --coordinator-title-size: clamp(1.5rem, 1.25rem + 0.75vw, 1.875rem);
    margin-bottom: var(--wa-space-m);
  }

  .site-coordinator-menu__image {
    height: 6.5rem;
  }

  .site-coordinator-menu__title {
    color: #fff;
    text-align: center;
  }

  .site-coordinator-menu__schedule {
    width: auto;
    align-self: center;
    margin-bottom: var(--wa-space-m);
    --wa-form-control-height: 3rem;
  }

  .site-coordinator-menu__schedule::part(base) {
    background-color: #fff;
    border-color: #fff;
    color: var(--ac-brand-40);
  }

  .site-coordinator-menu__schedule:hover::part(base) {
    background-color: var(--ac-brand-95);
    border-color: var(--ac-brand-95);
    color: var(--ac-brand-30);
  }

  .site-coordinator-menu__contacts {
    align-items: center;
    gap: var(--wa-space-s);
  }

  .site-coordinator-menu__contact {
    min-height: 0;
    font-size: var(--wa-font-size-m);
    color: #fff;
  }

  .site-coordinator-menu__contact:hover {
    color: var(--ac-brand-90);
  }

  .site-coordinator-menu__contact-icon {
    color: inherit;
  }

  .site-coordinator-menu__bottom {
    margin-top: var(--wa-space-m);
    padding-top: var(--wa-space-s);
    padding-bottom: 0;
  }

  .site-coordinator-menu__insurance {
    margin-bottom: var(--wa-space-s);
    text-align: center;
  }

  .site-coordinator-menu__insurance-lede,
  .site-coordinator-menu__insurance-list,
  .site-coordinator-menu__insurance-note {
    font-size: var(--wa-font-size-xs);
    line-height: 1.35;
    color: color-mix(in srgb, #fff 85%, transparent);
  }

  .site-coordinator-menu__insurance-note {
    color: color-mix(in srgb, #fff 72%, transparent);
  }

  .site-coordinator-menu__footer {
    padding-bottom: 0;
    text-align: center;
  }

  .site-coordinator-menu__refer::part(base) {
    color: color-mix(in srgb, #fff 85%, transparent);
    border-color: color-mix(in srgb, #fff 72%, transparent);
    background-color: transparent;
  }

  .site-coordinator-menu__refer:hover::part(base) {
    color: var(--ac-brand-40);
    background-color: #fff;
    border-color: #fff;
  }
}

.site-header__nav-btn wa-icon {
  font-size: 1.25rem;
}

.site-header__nav-list,
.site-overlay-menu__list {
  list-style: none;
  margin: 0;
  padding: var(--wa-space-l) 0 0;
}

.site-header__nav-item {
  margin: 0;
  padding: 0;
}

.site-overlay-menu__list {
  padding-top: 0;
}

.site-header__nav-item > a,
.site-header__nav-toggle,
.site-overlay-menu__list a {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: var(--site-touch-target);
  padding: 0;
  font-size: var(--wa-font-size-l);
  font-weight: var(--wa-font-weight-medium);
  color: var(--text);
  text-decoration: none;
}

.site-header__nav-toggle {
  justify-content: space-between;
  gap: var(--wa-space-s);
  border: 0;
  background: none;
  cursor: pointer;
  text-align: start;
  -webkit-appearance: none;
  appearance: none;
}

.site-header__nav-link-text {
  flex: 1 1 auto;
  min-width: 0;
  text-align: start;
}

.site-header__nav-chevron {
  flex: 0 0 auto;
  font-size: 0.875rem;
  color: var(--text-muted);
  transition: transform 0.18s ease;
}

.site-header__nav-item.is-open .site-header__nav-chevron {
  transform: rotate(180deg);
}

.site-header__nav-sublist {
  list-style: none;
  margin: 0;
  padding: 0 0 var(--wa-space-xs);
}

.site-header__nav-sublist a {
  display: flex;
  align-items: center;
  min-height: 2.75rem;
  padding: 0 0 0 var(--wa-space-l);
  font-size: var(--wa-font-size-m);
  font-weight: var(--wa-font-weight-normal);
  color: var(--text-muted);
  text-decoration: none;
}

.site-header__nav-sublist a:hover {
  color: var(--wa-color-text-link);
}

.site-header__nav-sublist-eyebrow {
  margin: 0;
  padding: var(--wa-space-s) 0 0 var(--wa-space-l);
}

.site-header__nav-sublist-eyebrow:first-child {
  padding-top: 0;
}

.site-locations-menu__groups {
  display: flex;
  flex-direction: column;
  gap: var(--wa-space-l);
}

.site-locations-menu__group .site-overlay-menu__list {
  padding-top: var(--wa-space-xs);
}

.site-header__nav-link-label {
  display: inline-flex;
  align-items: center;
  gap: var(--wa-space-2xs);
}

.site-header__nav-link-icon {
  flex-shrink: 0;
  font-size: 0.875rem;
  color: var(--text-muted);
  transition: transform 0.18s ease;
}

.site-header__nav-list a:hover .site-header__nav-link-icon {
  color: var(--wa-color-text-link);
}

.site-header__nav-item > a:hover,
.site-header__nav-toggle:hover {
  color: var(--wa-color-text-link);
}

.site-header__nav-toggle:hover .site-header__nav-chevron {
  color: var(--wa-color-text-link);
}

.site-header__nav-footer {
  flex-shrink: 0;
  margin: 0;
  padding-block: var(--wa-space-m);
  padding-bottom: max(var(--wa-space-m), env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--wa-color-surface-lowered);
  text-align: center;
}

.site-header__phone {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--wa-space-s);
  min-height: var(--site-touch-target);
  padding-inline: var(--wa-space-s);
  font-size: var(--wa-font-size-xl);
  font-weight: var(--wa-font-weight-semibold);
  color: var(--wa-color-text-link);
  text-decoration: none;
}

.site-header__phone-icon {
  font-size: 1.25rem;
}

.site-header__phone:hover {
  color: var(--accent);
}

.page-main {
  padding-inline: 0;
}

/* —— Page layout + sidebars —— */

/* Mobile gutter for structured templates (markdown bodies get it via
   .page-body--offset; custom HTML bodies manage their own padding). */
@media (max-width: 47.99rem) {
  .page-layout:not(.page-layout--custom-body),
  .person-profile,
  .condition-profile,
  .service-profile {
    padding-inline: max(1rem, env(safe-area-inset-left, 0px)) max(1rem, env(safe-area-inset-right, 0px));
  }

  /* Article content outside .page-body--offset */
  .article-header,
  .article-share--main,
  .article-author {
    padding-inline: max(1rem, env(safe-area-inset-left, 0px)) max(1rem, env(safe-area-inset-right, 0px));
  }

  /* Clinician directory lives inside page-main, outside the offset wrapper */
  .clinician-directory {
    padding-inline: max(1rem, env(safe-area-inset-left, 0px)) max(1rem, env(safe-area-inset-right, 0px));
  }
}

.page-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--wa-space-l);
  width: 100%;
  max-width: var(--site-content-max);
  margin-inline: auto;
}

.page-layout__main {
  min-width: 0;
}

.page-body--offset {
  margin-block-start: 1rem;
  padding-inline:
    max(1rem, env(safe-area-inset-left, 0px))
    max(1rem, env(safe-area-inset-right, 0px));
}

/* —— In-content images —— */
.page-main .ac-img-figure {
  display: block;
  max-width: 100%;
  margin: 0.75rem 0;
}

.page-main .ac-img-figure:not(
    .ac-img-figure--full,
    .ac-img-figure--half,
    .ac-img-figure--quarter
  ) {
  width: max-content;
}

.page-main .ac-img-figure--full {
  width: 100%;
}

.page-main .ac-img-figure--half {
  width: 50%;
}

.page-main .ac-img-figure--quarter {
  width: 25%;
}

.page-main .ac-img-figure--align-left:not(.ac-img-figure--full) {
  margin-inline: 0 auto;
}

.page-main .ac-img-figure--align-center:not(.ac-img-figure--full) {
  margin-inline: auto;
}

.page-main .ac-img-figure--align-right:not(.ac-img-figure--full) {
  margin-inline: auto 0;
}

.page-main .ac-img-figure--crop-1-1,
.page-main .ac-img-figure--crop-3-4,
.page-main .ac-img-figure--crop-16-9,
.page-main .ac-img-figure--crop-21-9 {
  width: 100%;
}

.page-main .ac-img-figure--half.ac-img-figure--crop-1-1,
.page-main .ac-img-figure--half.ac-img-figure--crop-3-4,
.page-main .ac-img-figure--half.ac-img-figure--crop-16-9,
.page-main .ac-img-figure--half.ac-img-figure--crop-21-9 {
  width: 50%;
}

.page-main .ac-img-figure--quarter.ac-img-figure--crop-1-1,
.page-main .ac-img-figure--quarter.ac-img-figure--crop-3-4,
.page-main .ac-img-figure--quarter.ac-img-figure--crop-16-9,
.page-main .ac-img-figure--quarter.ac-img-figure--crop-21-9 {
  width: 25%;
}

.page-main .ac-img-media {
  position: relative;
  display: block;
  max-width: 100%;
}

.page-main .ac-img-figure--crop-1-1 .ac-img-media {
  width: 100%;
  overflow: hidden;
  aspect-ratio: 1 / 1;
}

.page-main .ac-img-figure--crop-3-4 .ac-img-media {
  width: 100%;
  overflow: hidden;
  aspect-ratio: 3 / 4;
}

.page-main .ac-img-figure--crop-16-9 .ac-img-media {
  width: 100%;
  overflow: hidden;
  aspect-ratio: 16 / 9;
}

.page-main .ac-img-figure--crop-21-9 .ac-img-media {
  width: 100%;
  overflow: hidden;
  aspect-ratio: 21 / 9;
}

.page-main
  .ac-img-figure[class*="ac-img-figure--crop-"]
  .ac-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.page-main
  .ac-img-figure:not(
    .ac-img-figure--full,
    .ac-img-figure--half,
    .ac-img-figure--quarter
  )
  .ac-img-media {
  width: max-content;
}

.page-main .ac-img-wrap {
  position: relative;
  display: block;
  max-width: 100%;
}

.page-main .ac-img-wrap:has(> .ac-img--full) {
  width: 100%;
}

.page-main .ac-img-wrap:has(> .ac-img--half) {
  width: 50%;
}

.page-main .ac-img-wrap:has(> .ac-img--quarter) {
  width: 25%;
}

.page-main .ac-img-figure--full .ac-img-wrap,
.page-main .ac-img-figure--half .ac-img-wrap,
.page-main .ac-img-figure--quarter .ac-img-wrap {
  width: 100%;
}

.page-main .ac-img {
  display: block;
  max-width: 100%;
  height: auto;
}

.page-main .ac-img-figure--full .ac-img,
.page-main .ac-img-figure--half .ac-img,
.page-main .ac-img-figure--quarter .ac-img,
.page-main .ac-img--full,
.page-main .ac-img--half,
.page-main .ac-img--quarter {
  width: 100%;
}

.page-main
  .ac-img-figure:not(
    .ac-img-figure--full,
    .ac-img-figure--half,
    .ac-img-figure--quarter
  )
  .ac-img:not(.ac-img--full, .ac-img--half, .ac-img--quarter) {
  width: auto;
}

.page-main .ac-iframe-figure {
  display: block;
  max-width: 100%;
  margin: 0.75rem 0;
}

.page-main .ac-iframe-figure--full {
  width: 100%;
}

.page-main .ac-iframe-figure--half {
  width: 50%;
}

.page-main .ac-iframe-figure--quarter {
  width: 25%;
}

.page-main .ac-iframe-media {
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden;
  background: transparent;
}

.page-main .ac-iframe-media--ar-1-1 {
  aspect-ratio: 1 / 1;
}

.page-main .ac-iframe-media--ar-4-3 {
  aspect-ratio: 4 / 3;
}

.page-main .ac-iframe-media--ar-16-9 {
  aspect-ratio: 16 / 9;
}

.page-main .ac-iframe-media--embed-sized {
  aspect-ratio: unset;
  overflow: visible;
  background: transparent;
  height: auto;
  line-height: 0;
}

.page-main .ac-iframe-figure--embed-sized {
  background: transparent;
}

.page-main .ac-iframe-media iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.page-main .ac-iframe-media--embed-sized iframe {
  display: block;
  width: unset;
  height: unset;
  max-width: 100%;
  border: 0;
}

.page-main .ac-columns {
  display: grid;
  gap: 1.5rem;
  margin-block: 1.5rem;
}

.page-main .ac-columns--max-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.page-main .ac-columns--max-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.page-main .ac-columns--max-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.page-main .ac-columns__col {
  min-width: 0;
}

.page-main .ac-columns__col > :first-child {
  margin-top: 0;
}

.page-main .ac-columns__col > :last-child {
  margin-bottom: 0;
}

@media (max-width: 64rem) {
  .page-main .ac-columns--max-3,
  .page-main .ac-columns--max-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 40rem) {
  .page-main .ac-columns {
    grid-template-columns: 1fr;
  }
}

.page-main .ac-ribbon {
  display: block;
  width: 100%;
  box-sizing: border-box;
  margin-block: 1.5rem;
}

.page-main .ac-ribbon--page {
  background-color: var(--wa-color-surface-default);
}

.page-main .ac-ribbon--raise {
  background-color: var(--wa-color-surface-raised);
}

.page-main .ac-ribbon--lower {
  background-color: var(--wa-color-surface-lowered);
}

.page-main .ac-ribbon--brand {
  background-color: var(--wa-color-brand-40, var(--ac-brand-40, #8b2942));
  color: var(--ac-ivory-light, #f4efe6);
  --text: var(--ac-ivory-light, #f4efe6);
  --headline-color: var(--ac-ivory-light, #f4efe6);
  --wa-color-text-normal: var(--ac-ivory-light, #f4efe6);
  --wa-color-text-quiet: var(--ac-cloud, #cfc8bc);
  --wa-color-text-link: var(--ac-ivory, #faf6ee);
}

.page-main .ac-ribbon--brand a:not(.ac-trigger-btn) {
  color: var(--ac-ivory, #faf6ee);
}

.page-main .ac-ribbon--brand .ac-trigger-btn:not(
    .ac-trigger-btn--royal,
    .ac-trigger-btn--adobe,
    .ac-trigger-btn--cumberland,
    .ac-trigger-btn--summit
  ) {
  background-color: var(--ac-ivory-light, #f4efe6);
  color: var(--wa-color-brand-40, var(--ac-brand-40, #8b2942));
}

.page-main .ac-ribbon--pad-s {
  padding: 0.75rem;
}

.page-main .ac-ribbon--pad-m {
  padding: 1.5rem;
}

.page-main .ac-ribbon--pad-l {
  padding: 2.5rem;
}

.page-main .ac-ribbon > :first-child {
  margin-top: 0;
}

.page-main .ac-ribbon > :last-child {
  margin-bottom: 0;
}

.page-main .ac-birdeye {
  min-height: 12rem;
  margin-block: 1.5rem;
}

.location-profile .ac-birdeye {
  margin-block: var(--wa-space-m);
}

.location-profile .ac-birdeye iframe {
  max-width: 100% !important;
  border-radius: var(--wa-border-radius-m);
}

.page-main .ac-img-zoom {
  position: absolute;
  right: 0.5rem;
  bottom: 0.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: none;
  border-radius: var(--wa-border-radius-s);
  background: color-mix(in srgb, var(--bg, #fff) 90%, transparent);
  color: var(--wa-color-text-default, #1a1a1a);
  cursor: pointer;
  box-shadow: 0 1px 4px rgb(0 0 0 / 18%);
}

.page-main .ac-img-zoom wa-icon {
  font-size: 1rem;
}

.page-main .ac-img-zoom:hover {
  background: var(--bg, #fff);
}

.ac-img-lightbox {
  position: relative;
  padding: 0;
  border: none;
  max-width: min(96vw, 72rem);
  max-height: 96vh;
  background: transparent;
}

.ac-img-lightbox::backdrop {
  background: rgb(0 0 0 / 72%);
}

.ac-img-lightbox__image {
  display: block;
  max-width: min(96vw, 72rem);
  max-height: 92vh;
  width: auto;
  height: auto;
  margin: 0 auto;
}

.ac-img-lightbox__close {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  border: none;
  border-radius: var(--wa-border-radius-s);
  background: rgb(0 0 0 / 55%);
  color: #fff;
  cursor: pointer;
}

.ac-img-lightbox__close:hover {
  background: rgb(0 0 0 / 72%);
}

.person-profile {
  width: 100%;
  max-width: var(--site-content-max);
  margin-inline: auto;
  padding-block: var(--wa-space-xl);
}

.person-profile__header {
  display: grid;
  gap: var(--wa-space-l);
  grid-template-columns: minmax(0, 1fr);
  margin-bottom: 0;
}

.person-profile__bio {
  margin-block-start: 1rem;
}

.person-profile__photo {
  width: min(16rem, 100%);
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: var(--wa-border-radius-l);
}

.person-profile__name {
  margin: 0;
  font-size: var(--wa-font-size-2xl);
}

.person-profile__credentials,
.person-profile__title {
  margin: 0.25rem 0 0;
}

.location-profile {
  width: 100%;
  max-width: var(--site-content-max);
  margin-inline: auto;
  padding-block: var(--wa-space-xl);
}

.location-profile__header {
  display: grid;
  gap: var(--wa-space-s);
  margin-block-end: var(--wa-space-xl);
}

.location-profile__headline {
  margin: 0 0 var(--wa-space-s);
  font-size: var(--wa-font-size-2xl);
}

.location-profile__intro {
  max-width: 48rem;
}

.location-profile__address {
  font-style: normal;
  line-height: var(--wa-line-height-normal);
  margin: 0;
}

.location-profile__phone,
.location-profile__fax,
.location-profile__hours,
.location-profile__languages {
  display: flex;
  align-items: center;
  gap: var(--wa-space-xs);
  margin: 0;
}

.location-profile__anchors {
  position: sticky;
  top: var(--site-header-bar-height);
  z-index: 20;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--wa-space-s);
  margin-block-end: var(--wa-space-l);
  padding-block: var(--wa-space-xs);
  border-block: 1px solid var(--wa-color-border-normal);
  background-color: color-mix(in srgb, var(--bg) 88%, transparent);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  font-size: var(--wa-font-size-s);
  font-weight: var(--wa-font-weight-semibold);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.location-profile__anchors a {
  color: var(--wa-color-text-link);
  text-decoration: none;
  padding-block: var(--wa-space-2xs);
}

.location-profile__anchors a:hover {
  text-decoration: underline;
}

@media (max-width: 47.99rem) {
  .location-profile__anchors {
    display: none;
  }
}

.location-profile__grid {
  display: grid;
  gap: var(--wa-space-l);
  margin-block-end: var(--wa-space-2xl);
}

.location-profile__info {
  display: grid;
  gap: var(--wa-space-s);
  align-content: start;
}

.location-profile__map-link {
  margin: var(--wa-space-2xs) 0 0;
}

.location-profile__map {
  min-width: 0;
}

.location-profile__map-canvas {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 16rem;
  border: 0;
  border-radius: var(--wa-border-radius-m);
}

.location-profile__section {
  margin-block-end: var(--wa-space-l);
  scroll-margin-top: calc(
    var(--site-header-bar-height) + var(--wa-space-xl) + var(--wa-space-m)
  );
}

.location-profile__section-title {
  margin: 0 0 var(--wa-space-m);
  font-size: var(--wa-font-size-xl);
}

.location-profile__section-intro {
  margin-block-end: var(--wa-space-m);
  max-width: 48rem;
}

.location-profile__link-list {
  display: grid;
  gap: var(--wa-space-xs);
  margin: var(--wa-space-s) 0 0;
  padding: 0;
  list-style: none;
}

.location-profile__details {
  margin-block-start: var(--wa-space-2xs);
}

.location-profile__details--heading {
  margin-block-start: 0;
}

.location-profile__details--heading::part(summary) {
  font-size: var(--wa-font-size-xl);
  font-weight: var(--wa-font-weight-semibold);
  color: var(--wa-color-text);
}

@media (max-width: 47.99rem) {
  .location-profile__details--heading::part(summary) {
    font-size: var(--wa-font-size-l);
  }
}

.location-profile__link-list a {
  color: var(--wa-color-text-link);
}

.location-profile__all-locations {
  display: grid;
  gap: var(--wa-space-l);
  max-width: 48rem;
}

.location-profile__location-group .location-profile__group-title {
  margin: 0 0 var(--wa-space-xs);
  font-size: var(--wa-font-size-m);
}

@media (min-width: 48rem) {
  .location-profile__all-locations {
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  }
}

@media (min-width: 48rem) {
  .location-profile__grid {
    grid-template-columns: minmax(16rem, 5fr) minmax(24rem, 7fr);
    align-items: stretch;
  }

  .location-profile__map-canvas {
    min-height: 100%;
  }

  .location-profile__link-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--wa-space-2xs) var(--wa-space-l);
  }
}

.location-profile__insurance-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--wa-space-2xs);
  margin: 0;
  padding: 0;
  list-style: none;
}

.location-profile__insurance-item {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2.5rem;
}

.location-profile__insurance-logo {
  max-width: 7rem;
  max-height: 1.75rem;
  object-fit: contain;
}

@media (min-width: 40rem) {
  .location-profile__insurance-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--wa-space-s);
  }
}

.location-profile__insurance-note {
  margin: var(--wa-space-m) 0 0;
  font-size: var(--wa-font-size-s);
  color: var(--wa-color-text-quiet);
}

.location-profile__filters {
  margin-block: var(--wa-space-m);
}

.location-profile__filters-summary {
  display: inline-flex;
  align-items: center;
  gap: var(--wa-space-2xs);
}

.location-profile__filters-count::part(badge) {
  font-size: var(--wa-font-size-2xs);
}

.location-profile__filters-count[hidden] {
  display: none;
}

.location-profile__filters::part(summary) {
  font-size: var(--wa-font-size-m);
  font-weight: var(--wa-font-weight-semibold);
}

.location-profile__filters-grid {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wa-space-xs);
  padding-block: var(--wa-space-2xs) var(--wa-space-s);
}

.location-profile__filter-select {
  min-width: 11rem;
}

.location-profile__filter-check {
  align-self: center;
  min-width: 11rem;
}

.location-profile__filters-footer {
  display: flex;
  justify-content: flex-end;
}

.location-profile__clinician-filter {
  max-width: 20rem;
  margin-block: var(--wa-space-m) var(--wa-space-m);
}

.location-profile__articles-more {
  display: flex;
  justify-content: center;
  margin-block-start: var(--wa-space-l);
}

.location-profile__clinicians {
  display: grid;
  gap: var(--wa-space-m);
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  list-style: none;
  margin: 0;
  padding: 0;
}

.location-profile__clinicians-sentinel {
  flex: 0 0 1px;
  width: 1px;
  height: 1px;
  scroll-snap-align: end;
  pointer-events: none;
}

.location-profile__clinician-card {
  display: flex;
  flex-direction: column;
  gap: var(--wa-space-s);
}

.location-profile__clinician-card[hidden] {
  display: none;
}

.location-profile__clinician-link {
  display: flex;
  flex-direction: column;
  gap: var(--wa-space-s);
  height: 100%;
  color: inherit;
  text-decoration: none;
}

.location-profile__clinician-photo {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: var(--wa-border-radius-m);
}

.location-profile__clinician-meta {
  display: flex;
  flex-direction: column;
  gap: var(--wa-space-2xs);
}

.location-profile__clinician-name {
  font-weight: var(--wa-font-weight-semibold);
  color: var(--wa-color-text-link);
  text-decoration: none;
}

.location-profile__clinician-link:hover .location-profile__clinician-name,
.location-profile__clinician-link:focus-visible .location-profile__clinician-name {
  text-decoration: underline;
}

.location-profile__clinician-credentials,
.location-profile__clinician-title {
  font-size: var(--wa-font-size-s);
  color: var(--wa-color-text-quiet);
}

.location-profile__articles {
  display: grid;
  gap: var(--wa-space-m);
  margin: 0;
  padding: 0;
  list-style: none;
}

.location-profile__articles-sentinel {
  flex: 0 0 1px;
  width: 1px;
  height: 1px;
  scroll-snap-align: end;
  pointer-events: none;
}

.location-profile__article-card {
  min-width: 0;
}

.location-profile__article-link {
  display: grid;
  grid-template-columns: minmax(7rem, 10rem) minmax(0, 1fr);
  gap: var(--wa-space-m);
  align-items: stretch;
  height: 100%;
  border: 1px solid var(--wa-color-border-normal);
  border-radius: var(--wa-border-radius-m);
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.location-profile__article-link--no-image {
  grid-template-columns: minmax(0, 1fr);
}

.location-profile__article-link--no-image .location-profile__article-copy {
  padding: var(--wa-space-m);
}

.location-profile__article-link:hover,
.location-profile__article-link:focus-visible {
  border-color: var(--wa-color-border-strong);
  box-shadow: var(--wa-shadow-l);
  outline: none;
}

.location-profile__article-media {
  display: block;
  min-width: 0;
}

.location-profile__article-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.location-profile__article-copy {
  display: flex;
  flex-direction: column;
  gap: var(--wa-space-2xs);
  justify-content: center;
  padding: var(--wa-space-s) var(--wa-space-s) var(--wa-space-s) 0;
}

.location-profile__article-title {
  font-weight: var(--wa-font-weight-semibold);
  color: var(--wa-color-text);
  line-height: var(--wa-line-height-snug);
}

.location-profile__article-link:hover .location-profile__article-title,
.location-profile__article-link:focus-visible .location-profile__article-title {
  color: var(--wa-color-text-link);
}

.location-profile__article-excerpt {
  font-size: var(--wa-font-size-s);
  color: var(--wa-color-text-quiet);
  line-height: var(--wa-line-height-normal);
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

@media (min-width: 48rem) {
  .location-profile__articles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .location-profile__article-link {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  }

  .location-profile__article-link--no-image {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Mobile carousels — after grid rules so they win the cascade */
@media (max-width: 47.99rem) {
  .location-profile__clinicians,
  .location-profile__articles {
    --loc-carousel-gutter: max(1rem, env(safe-area-inset-left, 0px));
    display: flex;
    gap: var(--wa-space-m);
    overflow-x: auto;
    margin-inline: calc(-1 * var(--loc-carousel-gutter)) calc(-1 * max(1rem, env(safe-area-inset-right, 0px)));
    padding-inline: var(--loc-carousel-gutter) max(1rem, env(safe-area-inset-right, 0px));
    scroll-padding-inline-start: var(--loc-carousel-gutter);
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .location-profile__clinicians::-webkit-scrollbar,
  .location-profile__articles::-webkit-scrollbar {
    display: none;
  }

  .location-profile__clinician-card {
    flex: 0 0 62%;
    scroll-snap-align: start;
  }

  .location-profile__article-card {
    flex: 0 0 82%;
    scroll-snap-align: start;
  }

  /* Smaller insurance logos on mobile */
  .location-profile__insurance-logo {
    max-width: 5rem;
    max-height: 1.35rem;
  }
}

.clinician-directory {
  display: grid;
  gap: var(--wa-space-m);
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  list-style: none;
  padding: 0;
  margin-block-start: var(--wa-space-xl);
}

.clinician-directory__card {
  display: flex;
  flex-direction: column;
  gap: var(--wa-space-2xs);
}

.clinician-directory__card img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
}

.article-byline {
  display: flex;
  align-items: center;
  gap: var(--wa-space-s);
  margin: 0;
}

.article-header {
  display: grid;
  gap: var(--wa-space-s);
  margin-block-end: var(--wa-space-l);
  padding-block-start: 2.5rem;
}

@media (min-width: 48rem) {
  .article-header {
    padding-block-start: 5.5rem;
  }
}

.article-meta {
  margin: 0;
  font-size: var(--wa-font-size-s);
  color: var(--wa-color-neutral-60, #666);
  text-transform: none;
  letter-spacing: normal;
}

.article-meta a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.article-title {
  margin: 0;
}

.article-byline__photo {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  object-fit: cover;
  flex-shrink: 0;
}

.article-byline__name {
  font-size: var(--wa-font-size-s);
  color: var(--wa-color-neutral-70, #555);
}

.article-byline__link,
.article-author__name a {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, currentColor 40%, transparent);
  text-underline-offset: 0.15em;
}

.article-byline__link:hover,
.article-author__name a:hover {
  text-decoration-color: currentColor;
}

.article-byline__creds {
  color: inherit;
}

.article-share {
  margin-block-start: var(--wa-space-2xl);
  padding-block-start: var(--wa-space-l);
  border-block-start: 1px solid var(--wa-color-neutral-90, #e5e5e5);
}

.page-layout--article {
  padding-block-end: clamp(3rem, 8vw, 5rem);
}

.article-sidebar {
  display: none;
  flex-direction: column;
  gap: var(--wa-space-xl);
}

.article-share--sidebar {
  margin-block-start: 0;
  padding-block-start: 0;
  border-block-start: 0;
  display: none;
  container-type: inline-size;
  container-name: article-share-sidebar;
}

.article-share--main {
  display: block;
  margin-block-end: var(--wa-space-2xl);
}

.article-share__label {
  margin: 0 0 var(--wa-space-m);
  font-size: var(--wa-font-size-xs);
  font-weight: var(--wa-font-weight-semibold);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wa-color-neutral-60, #666);
}

.article-share__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--wa-space-s);
}

.article-share__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  color: var(--wa-color-neutral-50, #888);
  text-decoration: none;
  transition: color 0.15s ease;
}

.article-share__link:hover {
  color: var(--text);
}

.article-share__link .fa-brands,
.article-share__link .fa-solid {
  font-size: 1.25rem;
  line-height: 1;
}

.article-share__link img {
  width: 1.25rem;
  height: 1.25rem;
  object-fit: contain;
}

.article-share__fallback {
  font-size: var(--wa-font-size-xs);
}

/* 5×1.5rem icons + 4× --wa-space-s: stack before the row wraps. */
@container article-share-sidebar (max-width: 10rem) {
  .article-share__label {
    display: none;
  }

  .article-share__actions {
    flex-flow: column nowrap;
    align-items: flex-start;
    flex-wrap: nowrap;
  }
}

.article-author {
  margin-block-start: var(--wa-space-2xl);
  padding-block-start: var(--wa-space-xl);
  border-block-start: 1px solid var(--wa-color-neutral-90, #e5e5e5);
}

.article-author__header {
  display: grid;
  gap: var(--wa-space-l);
  grid-template-columns: minmax(0, 1fr);
}

.article-author__photo {
  width: min(10rem, 100%);
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: var(--wa-border-radius-l);
}

.article-author__name {
  margin: 0;
  font-size: var(--wa-font-size-xl);
}

.article-author__credentials,
.article-author__title {
  margin: 0.25rem 0 0;
}

.article-author__bio {
  margin-block-start: var(--wa-space-m);
}

.article-author__bio > :first-child {
  margin-block-start: 0;
}

.article-author__bio > :last-child {
  margin-block-end: 0;
}

@media (min-width: 48rem) {
  .article-author__header {
    grid-template-columns: 10rem minmax(0, 1fr);
    align-items: start;
  }
}

@media (min-width: 48rem) {
  .person-profile__header {
    grid-template-columns: 16rem minmax(0, 1fr);
    align-items: start;
  }
}

.page-sidebar {
  display: none;
  position: sticky;
  top: var(--site-header-bar-height);
  align-self: start;
  width: 100%;
  max-width: var(--page-sidebar-max);
}

.page-sidebar__back {
  display: inline-flex;
  align-items: center;
  font-size: var(--wa-font-size-s);
  font-weight: var(--wa-font-weight-medium);
  line-height: var(--wa-line-height-normal);
  color: var(--wa-color-text-quiet);
  text-decoration: none;
}

.page-sidebar__back:hover {
  color: var(--wa-color-text-link);
}

/* —— Hero —— */
.home-hero {
  padding:
    var(--wa-space-l)
    max(1rem, env(safe-area-inset-right, 0px))
    var(--wa-space-m)
    max(1rem, env(safe-area-inset-left, 0px));
}

.home-hero__image {
  display: block;
  height: 20vh;
  width: auto;
  max-width: 100%;
  margin-inline: auto;
  margin-bottom: var(--wa-space-l);
}

.home-hero__inner {
  max-width: 40rem;
}

.home-hero__title {
  margin: 0;
  font-family: var(--ac-font-serif);
  font-size: clamp(2rem, 2rem + 2vw, 3rem);
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--headline-color);
}

.home-hero__lede {
  margin: var(--wa-space-m) 0 0;
  font-family: var(--font-heading);
  font-size: var(--wa-font-size-l);
  line-height: var(--wa-line-height-normal);
  color: var(--text);
}

.home-hero__actions {
  display: flex;
  flex-direction: column;
  gap: var(--wa-space-s);
  margin-top: var(--wa-space-l);
}

.home-hero__btn {
  width: 100%;
  --wa-form-control-height: 3.5rem;
}

.home-hero__btn::part(base) {
  justify-content: flex-start;
}

.home-hero__btn wa-icon {
  font-size: 1.25rem;
}

.home-hero__links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--wa-space-s) var(--wa-space-l);
}

.home-hero__link {
  display: inline-flex;
  align-items: center;
  gap: var(--wa-space-2xs);
  min-height: var(--site-touch-target);
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: var(--wa-font-size-m);
  font-weight: var(--wa-font-weight-medium);
  color: var(--wa-color-text-link);
  text-decoration: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

.home-hero__link-icon {
  font-size: 1.125rem;
}

.home-hero__link:hover {
  color: var(--accent);
}

/* —— Insurance logos —— */
.home-insurance {
  padding:
    var(--wa-space-xl)
    max(1rem, env(safe-area-inset-right, 0px))
    var(--wa-space-l)
    max(1rem, env(safe-area-inset-left, 0px));
}

.home-insurance__viewport {
  overflow: hidden;
}

.home-insurance__track {
  display: flex;
  width: max-content;
  animation: home-insurance-scroll 36s linear infinite;
}

.home-insurance__group {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: var(--wa-space-s);
  padding-right: var(--wa-space-s);
}

.home-insurance__row {
  display: contents;
}

.home-insurance__logo {
  flex: 0 0 auto;
  height: 1.75rem;
  width: auto;
  max-width: 4.5rem;
  object-fit: contain;
}

.home-insurance__note {
  flex: 0 0 auto;
  margin: 0;
  font-size: var(--wa-font-size-s);
  font-weight: var(--wa-font-weight-medium);
  line-height: var(--wa-line-height-normal);
  white-space: nowrap;
  color: var(--wa-color-text-quiet);
}

@keyframes home-insurance-scroll {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-insurance__viewport {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .home-insurance__viewport::-webkit-scrollbar {
    display: none;
  }

  .home-insurance__track {
    width: auto;
    animation: none;
  }

  .home-insurance__group[aria-hidden="true"] {
    display: none;
  }
}

/* —— Screeners —— */
.site-screeners {
  padding-bottom: var(--wa-space-l);
  background-color: var(--wa-color-surface-lowered);
}

.site-screeners__banner {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

.site-screeners__inner {
  max-width: 40rem;
  padding:
    var(--wa-space-m)
    max(1rem, env(safe-area-inset-right, 0px))
    0
    max(1rem, env(safe-area-inset-left, 0px));
}

.site-screeners__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--wa-font-size-xl);
  font-weight: var(--wa-font-weight-semibold);
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--ac-brand-40);
}

.site-screeners__lede {
  margin: var(--wa-space-m) 0 0;
  font-size: var(--wa-font-size-l);
  line-height: var(--wa-line-height-normal);
  color: var(--text);
}

.site-screeners__text {
  margin: 0;
  font-size: var(--wa-font-size-l);
  line-height: var(--wa-line-height-normal);
  color: var(--text);
}

.site-screeners__toggle {
  width: auto;
  margin-top: var(--wa-space-l);
  --wa-form-control-height: 3.5rem;
}

.site-screeners__dropdown {
  display: contents;
}

.site-screeners__toggle::part(base) {
  justify-content: flex-start;
  background-color: var(--wa-color-surface-raised);
}

/* —— Testimonials —— */
.home-testimonials {
  --home-testimonials-gutter: max(1rem, env(safe-area-inset-left, 0px));
  padding-block: var(--wa-space-l) var(--wa-space-2xl);
  padding-inline: var(--home-testimonials-gutter) max(1rem, env(safe-area-inset-right, 0px));
  background-color: var(--wa-color-surface-raised);
}

.home-testimonials__header {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--wa-space-s) var(--wa-space-m);
  margin-bottom: var(--wa-space-l);
}

.home-testimonials__title {
  margin: 0;
  padding-inline: 0;
  font-family: var(--font-heading);
  font-size: var(--wa-font-size-xl);
  font-weight: var(--wa-font-weight-semibold);
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--ac-brand-40);
}

.home-testimonials__rating {
  flex-shrink: 0;
  --symbol-color-active: var(--ac-brand-40);
  --symbol-color: var(--wa-color-neutral-80);
}

.home-testimonials__reviews-count {
  margin: 0;
  font-size: var(--wa-font-size-s);
  font-weight: var(--wa-font-weight-medium);
  line-height: var(--wa-line-height-normal);
  color: var(--text);
}

.home-testimonials__track {
  display: flex;
  gap: var(--wa-space-m);
  overflow-x: auto;
  margin-inline: calc(-1 * var(--home-testimonials-gutter)) calc(-1 * max(1rem, env(safe-area-inset-right, 0px)));
  padding-inline: var(--home-testimonials-gutter) max(1rem, env(safe-area-inset-right, 0px));
  scroll-padding-inline-start: var(--home-testimonials-gutter);
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.home-testimonials__track::-webkit-scrollbar {
  display: none;
}

.home-testimonials__sentinel {
  flex: 0 0 1px;
  width: 1px;
  height: 1px;
  scroll-snap-align: end;
  pointer-events: none;
}

.home-testimonials__card {
  position: relative;
  isolation: isolate;
  flex: 0 0 75%;
  scroll-snap-align: start;
  margin: 0;
  padding: var(--wa-space-l);
  border-radius: var(--wa-border-radius-m);
  min-height: 12rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--wa-space-l);
  overflow: hidden;
  color: var(--ac-ivory-light);
}

.home-testimonials__card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('images/testimonial.webp') center / cover no-repeat;
  opacity: 0.25;
  mix-blend-mode: multiply;
  pointer-events: none;
  z-index: 0;
}

.home-testimonials__card--adobe {
  background-color: var(--ac-adobe-40);
}

.home-testimonials__card--cumberland {
  background-color: var(--ac-cumberland-40);
}

.home-testimonials__card--royal {
  background-color: var(--ac-royal-40);
}

.home-testimonials__card--summit {
  background-color: var(--ac-summit-40);
}

.home-testimonials__quote {
  position: relative;
  z-index: 1;
  margin: auto 0 0;
  padding: 0;
  border: 0;
  border-inline-start: 0;
  font-family: var(--ac-font-serif);
  font-size: var(--wa-font-size-l);
  line-height: var(--wa-line-height-normal);
  font-weight: var(--wa-font-weight-normal);
  text-align: left;
  color: var(--ac-ivory-light);
}

.home-testimonials__author {
  position: relative;
  z-index: 1;
  margin: 0;
  font-size: var(--wa-font-size-m);
  font-weight: var(--wa-font-weight-semibold);
  line-height: var(--wa-line-height-normal);
  color: var(--ac-ivory-light);
}

/* —— Helpful Articles —— */
.home-articles {
  --home-articles-gutter: max(1rem, env(safe-area-inset-left, 0px));
  padding-block: var(--wa-space-l) var(--wa-space-2xl);
  padding-inline: var(--home-articles-gutter) max(1rem, env(safe-area-inset-right, 0px));
  background-color: var(--wa-color-surface-lowered);
}

.home-articles__header {
  margin-bottom: var(--wa-space-l);
  padding-inline: 0;
}

.home-articles__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--wa-font-size-xl);
  font-weight: var(--wa-font-weight-semibold);
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--ac-brand-40);
}

.home-articles__title-icon {
  flex-shrink: 0;
  font-size: 1.25rem;
  color: var(--ac-brand-40);
}

.home-articles__track {
  display: flex;
  gap: var(--wa-space-m);
  overflow-x: auto;
  margin-inline: calc(-1 * var(--home-articles-gutter)) calc(-1 * max(1rem, env(safe-area-inset-right, 0px)));
  padding-inline: var(--home-articles-gutter) max(1rem, env(safe-area-inset-right, 0px));
  scroll-padding-inline-start: var(--home-articles-gutter);
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.home-articles__track::-webkit-scrollbar {
  display: none;
}

.home-articles__sentinel {
  flex: 0 0 1px;
  width: 1px;
  height: 1px;
  scroll-snap-align: end;
  pointer-events: none;
}

.home-articles__card {
  flex: 0 0 75%;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  min-height: 22rem;
  overflow: hidden;
  border-radius: var(--wa-border-radius-m);
  background-color: var(--wa-color-surface-raised);
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background-color 0.15s ease;
}

.home-articles__card:hover,
.home-articles__card:focus-visible {
  background-color: color-mix(in srgb, var(--wa-color-surface-raised) 88%, var(--ac-brand-40));
  outline: none;
}

.home-articles__card:focus-visible {
  box-shadow: 0 0 0 2px var(--wa-color-focus);
}

.home-articles__card * {
  pointer-events: none;
}

.home-articles__card-top {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--wa-space-m);
  padding: var(--wa-space-l);
}

.home-articles__card-copy {
  min-width: 0;
}

.home-articles__eyebrow {
  margin: 0;
  font-size: var(--wa-font-size-s);
  font-weight: var(--wa-font-weight-medium);
  line-height: var(--wa-line-height-normal);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.home-articles__card-title {
  margin: var(--wa-space-2xs) 0 0;
  font-family: var(--font-heading);
  font-size: var(--wa-font-size-l);
  font-weight: var(--wa-font-weight-bold);
  line-height: 1.25;
  color: var(--text);
}

.home-articles__card-action {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: var(--site-touch-target);
  height: var(--site-touch-target);
  margin: calc(-1 * var(--wa-space-xs)) calc(-1 * var(--wa-space-xs)) 0 0;
  color: var(--ac-brand-40);
  font-size: 1.5rem;
}

.home-articles__card-image {
  flex: 0 0 auto;
  margin-top: auto;
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* —— Newsletter —— */
.home-newsletter {
  padding:
    var(--wa-space-2xl)
    max(1rem, env(safe-area-inset-right, 0px))
    var(--wa-space-2xl)
    max(1rem, env(safe-area-inset-left, 0px));
  background-color: var(--wa-color-surface-default);
}

.home-newsletter__inner {
  max-width: 40rem;
}

.home-newsletter__header {
  display: flex;
  align-items: center;
  gap: var(--wa-space-m);
  margin-bottom: var(--wa-space-l);
}

.home-newsletter__icon {
  flex-shrink: 0;
  font-size: 1.5rem;
  color: var(--ac-brand-40);
}

.home-newsletter__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--wa-font-size-xl);
  font-weight: var(--wa-font-weight-semibold);
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--ac-brand-40);
}

.home-newsletter__form {
  display: flex;
  flex-direction: column;
  gap: var(--wa-space-m);
}

.home-newsletter__input {
  width: 100%;
}

.home-newsletter__submit {
  align-self: flex-start;
  width: auto;
  --wa-form-control-height: 3.5rem;
}

.home-newsletter__submit::part(base) {
  justify-content: flex-start;
  width: auto;
}

.home-newsletter__submit wa-icon {
  font-size: 1.25rem;
}

.home-newsletter__status {
  margin: 0;
  font-size: var(--wa-font-size-s);
  line-height: var(--wa-line-height-normal);
  color: var(--wa-color-text-quiet);
}

.home-newsletter__status[data-state="success"] {
  color: var(--ac-success);
}

.home-newsletter__status[data-state="error"] {
  color: var(--ac-danger);
}

/* —— Crisis —— */
.home-crisis {
  padding:
    var(--wa-space-2xl)
    max(1rem, env(safe-area-inset-right, 0px))
    var(--wa-space-2xl)
    max(1rem, env(safe-area-inset-left, 0px));
  background-color: var(--wa-color-surface-lowered);
}

.home-crisis__inner {
  max-width: 40rem;
}

.home-crisis__header {
  display: flex;
  align-items: center;
  gap: var(--wa-space-m);
}

.home-crisis__icon {
  flex-shrink: 0;
  font-size: 1.5rem;
  color: var(--ac-brand-40);
}

.home-crisis__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--wa-font-size-xl);
  font-weight: var(--wa-font-weight-semibold);
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--ac-brand-40);
}

.home-crisis__text,
.home-crisis__note,
.home-crisis__lifeline {
  margin: var(--wa-space-m) 0 0;
  font-size: var(--wa-font-size-l);
  line-height: var(--wa-line-height-normal);
  color: var(--text);
}

.home-crisis__lifeline {
  padding: var(--wa-space-l);
  border-radius: var(--wa-border-radius-m);
  background-color: var(--wa-color-surface-raised);
  font-weight: var(--wa-font-weight-normal);
}

.home-crisis__phone {
  display: inline-flex;
  align-items: center;
  gap: var(--wa-space-3xs);
  color: var(--ac-brand-40);
  font-weight: var(--wa-font-weight-bold);
  text-decoration: none;
}

.home-crisis__phone-icon {
  font-size: 0.875em;
}

.home-crisis__phone:hover {
  color: var(--accent);
}

.site-footer {
  margin-top: 0;
  padding:
    var(--wa-space-xl)
    max(1rem, env(safe-area-inset-right, 0px))
    max(var(--wa-space-xl), env(safe-area-inset-bottom, 0px))
    max(1rem, env(safe-area-inset-left, 0px));
  border-top: 1px solid var(--wa-color-surface-lowered);
}

.site-footer__intro {
  margin-bottom: var(--wa-space-xl);
}

.site-footer__brand {
  display: block;
  margin-bottom: var(--wa-space-s);
  overflow: visible;
  text-decoration: none;
}

.site-footer__lockup {
  display: block;
  width: auto;
  max-width: min(16rem, 70%);
  height: auto;
  overflow: visible;
}

.site-footer__phone,
.site-footer__email {
  margin: 0;
}

.site-footer__email {
  margin-top: var(--wa-space-2xs);
}

.site-footer__phone a,
.site-footer__email a {
  display: inline-flex;
  align-items: center;
  gap: var(--wa-space-s);
  font-size: var(--wa-font-size-l);
  font-weight: var(--wa-font-weight-semibold);
  color: var(--wa-color-text-link);
  text-decoration: none;
}

.site-footer__phone-icon {
  font-size: 1.25rem;
}

.site-footer__phone a:hover,
.site-footer__email a:hover {
  color: var(--accent);
}

.site-footer__hours {
  margin: var(--wa-space-2xs) 0 0;
  font-size: var(--wa-font-size-m);
  line-height: var(--wa-line-height-normal);
  color: var(--text-muted);
}

.site-footer__columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--wa-space-xl) var(--wa-space-l);
  margin-bottom: var(--wa-space-xl);
}

.site-footer__group {
  min-width: 0;
}

.site-footer__heading {
  margin: 0 0 var(--wa-space-s);
  font-family: var(--font-heading);
  font-size: var(--wa-font-size-m);
  font-weight: var(--wa-font-weight-bold);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ac-brand-50);
}

.site-footer__links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--wa-space-xs);
}

.site-footer__links a {
  display: block;
  padding-block: var(--wa-space-2xs);
  font-size: var(--wa-font-size-m);
  font-weight: var(--wa-font-weight-medium);
  line-height: var(--wa-line-height-normal);
  color: var(--text);
  text-decoration: none;
}

.site-footer__links a:hover {
  color: var(--wa-color-text-link);
}

.site-footer__referrals {
  width: auto;
  margin-top: var(--wa-space-s);
}

.site-footer__social {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--wa-space-s);
  margin-bottom: var(--wa-space-xl);
}

.site-footer__social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--site-touch-target);
  height: var(--site-touch-target);
  border-radius: var(--wa-border-radius-s);
  background-color: var(--wa-color-surface-raised);
  color: var(--ac-brand-50);
  font-size: 1.125rem;
  text-decoration: none;
}

.site-footer__social-link:hover {
  color: var(--wa-color-text-link);
}

.site-footer__social-link img {
  width: 1.125rem;
  height: 1.125rem;
  object-fit: contain;
}

.site-footer__legal {
  margin: 0;
  font-size: var(--wa-font-size-xs);
  font-weight: 400;
  line-height: var(--wa-line-height-normal);
  letter-spacing: 0.06em;
  text-align: center;
  text-transform: uppercase;
  color: var(--text-muted);
}

.site-footer__privacy {
  margin: var(--wa-space-s) 0 0;
  font-size: var(--wa-font-size-xs);
  line-height: var(--wa-line-height-normal);
  text-align: center;
}

.site-footer__privacy a {
  color: var(--text-muted);
  text-decoration: none;
}

.site-footer__privacy a:hover {
  color: var(--wa-color-text-link);
}

/* —— Desktop layout (48rem+) —— */
@media (min-width: 48rem) {
  :root {
    --site-header-padding-top: var(--wa-space-m);
    --site-header-bar-height: calc(var(--site-touch-target) + var(--site-header-padding-top) + env(safe-area-inset-top, 0px) + 1px);
  }

  .site-header__mobile-only {
    display: none !important;
  }

  .site-header__desktop-only {
    display: block !important;
  }

  .site-header__lockup {
    display: block !important;
  }

  .site-header__bar {
    grid-template-columns: 1fr auto auto;
    gap: var(--wa-space-m);
    width: 100%;
    padding-top: calc(env(safe-area-inset-top, 0px) + var(--site-header-padding-top));
    padding-bottom: var(--wa-space-xs);
    min-height: calc(var(--site-touch-target) + var(--site-header-padding-top) + var(--wa-space-xs));
    border-bottom: none;
    box-shadow: 0 1px 0 color-mix(
      in srgb,
      var(--wa-color-neutral-60) calc(var(--site-header-border-opacity, 0) * 55%),
      transparent
    );
    overflow: visible;
  }

  .site-header__bar::after {
    content: none;
  }

  .site-header__brand {
    justify-self: start;
    margin-inline: 0;
    min-width: min-content;
    flex-shrink: 0;
    min-height: 0;
    padding: var(--wa-space-2xs) 0;
    overflow: visible;
    border-radius: 0;
  }

  .site-header__lockup {
    display: block;
    width: auto;
    height: 2rem;
    max-width: none;
    overflow: visible;
  }

  .site-header__cta-wrap {
    justify-self: end;
  }

  .site-header__desktop-nav {
    display: none !important;
  }

  .site-header__desktop-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: var(--wa-space-2xs) var(--wa-space-s);
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .site-header__desktop-item {
    position: relative;
  }

  .site-header__desktop-toggle,
  .site-header__desktop-link {
    display: inline-flex;
    align-items: center;
    gap: var(--wa-space-3xs);
    min-height: var(--site-touch-target);
    padding: var(--wa-space-2xs) var(--wa-space-xs);
    border: 0;
    background: none;
    font: inherit;
    font-size: var(--wa-font-size-m);
    font-weight: var(--wa-font-weight-medium);
    color: var(--text);
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
    -webkit-appearance: none;
    appearance: none;
  }

  .site-header__desktop-toggle:hover,
  .site-header__desktop-link:hover,
  .site-header__desktop-item--expandable.is-open .site-header__desktop-toggle {
    color: var(--accent);
  }

  .site-header__desktop-chevron {
    font-size: 0.75rem;
    transition: transform 0.15s ease;
  }

  .site-header__desktop-item--expandable.is-open .site-header__desktop-chevron {
    transform: rotate(180deg);
  }

  .site-header__desktop-sublist {
    position: absolute;
    top: 100%;
    left: 50%;
    z-index: 200;
    width: max-content;
    min-width: 14rem;
    max-height: min(70vh, 24rem);
    margin: 0;
    padding: var(--wa-space-2xs) 0 var(--wa-space-xs);
    list-style: none;
    overflow-y: auto;
    border-radius: var(--wa-border-radius-m);
    border: 1px solid var(--wa-color-surface-lowered);
    background-color: var(--wa-color-surface-default);
    box-shadow: 0 8px 24px color-mix(in srgb, var(--wa-color-neutral-20) 12%, transparent);
    transform: translateX(-50%);
  }

  .site-header__desktop-sublist::before {
    content: "";
    position: absolute;
    top: calc(-1 * var(--wa-space-2xs));
    right: 0;
    left: 0;
    height: var(--wa-space-2xs);
  }

  .site-header__desktop-sublist[hidden] {
    display: none;
  }

  .site-header__desktop-sublist li {
    margin: 0;
    padding: 0;
  }

  .site-header__desktop-sublist a {
    display: block;
    padding: var(--wa-space-2xs) var(--wa-space-s);
    font-size: var(--wa-font-size-s);
    color: var(--text);
    text-decoration: none;
    white-space: nowrap;
  }

  .site-header__desktop-sublist a:hover {
    color: var(--accent);
    background-color: var(--wa-color-surface-lowered);
  }

  .site-header__desktop-sublist .site-header__nav-sublist-eyebrow {
    padding-inline: var(--wa-space-s);
  }

  .page-main {
    max-width: none;
    margin-inline: 0;
  }

  .page-layout {
    padding-inline:
      max(1rem, env(safe-area-inset-left, 0px))
      max(1rem, env(safe-area-inset-right, 0px));
  }

  .page-body--offset {
    padding-inline: 0;
  }

  .page-layout--has-left {
    position: relative;
  }

  .page-layout--has-left .page-sidebar--left {
    display: block;
    position: absolute;
    top: 0;
    right: calc(100% + var(--wa-space-l));
    width: var(--page-sidebar-max);
    max-width: max(
      0px,
      calc(
        50vw - min(var(--site-content-max), 100vw - 2rem) / 2 - var(--wa-space-l) -
          max(1rem, env(safe-area-inset-left, 0px))
      )
    );
    overflow: hidden;
  }

  .page-layout--article .page-sidebar--left {
    box-sizing: border-box;
    padding-inline-start: max(1rem, env(safe-area-inset-left, 0px));
  }

  .page-layout--article .article-sidebar {
    display: flex;
  }

  .page-layout--article .article-share--sidebar {
    display: block;
    margin-block-start: clamp(4rem, 10vw, 7rem);
  }

  .home-hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .home-hero__image {
    height: min(40vh, 28rem);
    width: auto;
    margin-bottom: var(--wa-space-xl);
  }

  .home-hero__inner {
    max-width: 42rem;
    margin-inline: auto;
    text-align: center;
  }

  .home-hero__actions {
    align-items: center;
  }

  .home-hero__btn {
    width: auto;
  }

  .home-hero__links {
    justify-content: center;
  }

  .home-insurance__viewport {
    overflow: visible;
    max-width: 28rem;
    margin-inline: auto;
  }

  .home-insurance__track {
    --home-insurance-col-gap: var(--wa-space-m);
    --home-insurance-logo-slot: 4.25rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--wa-space-s);
    width: 100%;
    animation: none;
    transform: none;
  }

  .home-insurance__group {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--wa-space-s);
    width: 100%;
    padding-right: 0;
  }

  .home-insurance__group[aria-hidden="true"] {
    display: none;
  }

  .home-insurance__row {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--home-insurance-col-gap);
    width: 100%;
  }

  .home-insurance__logo {
    flex: 0 0 var(--home-insurance-logo-slot);
    width: auto;
    height: 1.5rem;
    max-width: var(--home-insurance-logo-slot);
    object-fit: contain;
  }

  .home-insurance__note {
    margin-top: var(--wa-space-2xs);
    text-align: center;
    white-space: normal;
  }

  .site-screeners {
    position: relative;
    border-radius: var(--wa-border-radius-m);
  }

  .site-screeners[data-menu-open="true"] {
    z-index: 2;
  }

  .site-screeners__banner {
    border-radius: var(--wa-border-radius-m) var(--wa-border-radius-m) 0 0;
  }

  .site-screeners__inner,
  .home-newsletter__inner,
  .home-crisis__inner {
    max-width: 100%;
  }

  .site-screeners__dropdown {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    align-self: flex-start;
    margin-top: var(--wa-space-l);
  }

  .site-screeners__toggle {
    margin-top: 0;
  }

  .site-screeners__menu.site-overlay-menu {
    display: block;
    position: absolute;
    top: calc(100% + var(--wa-space-2xs));
    left: 0;
    right: auto;
    bottom: auto;
    z-index: 200;
    min-width: 100%;
    max-height: min(70vh, 24rem);
    margin: 0;
    padding: var(--wa-space-xs) 0;
    overflow-y: auto;
    border-radius: var(--wa-border-radius-m);
    border: 1px solid var(--wa-color-surface-lowered);
    background-color: var(--wa-color-surface-default);
    box-shadow: 0 8px 24px color-mix(in srgb, var(--wa-color-neutral-20) 12%, transparent);
    opacity: 1;
    pointer-events: auto;
    flex-direction: column;
    min-height: 0;
    padding-inline: 0;
  }

  .site-screeners__menu.site-overlay-menu[hidden] {
    display: none !important;
  }

  .site-screeners__menu-bar {
    display: none;
  }

  .site-screeners__menu .site-overlay-menu__body {
    flex: none;
    min-height: 0;
    overflow: visible;
    padding-top: 0;
  }

  .site-screeners__menu .site-overlay-menu__list {
    padding: 0;
  }

  .site-screeners__menu .site-overlay-menu__list a {
    display: block;
    width: auto;
    min-height: 0;
    padding: var(--wa-space-2xs) var(--wa-space-m);
    font-size: var(--wa-font-size-s);
    font-weight: var(--wa-font-weight-normal);
    color: var(--text);
    white-space: nowrap;
  }

  .site-screeners__menu .site-overlay-menu__list a:hover {
    color: var(--accent);
    background-color: var(--wa-color-surface-lowered);
  }

  .home-testimonials,
  .home-articles,
  .home-crisis {
    background-color: transparent;
  }

  .home-newsletter {
    border-radius: var(--wa-border-radius-m);
    background-color: var(--wa-color-surface-lowered);
  }

  .home-testimonials__track,
  .home-articles__track {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--wa-space-m);
    overflow: visible;
    margin-inline: 0;
    padding-inline: 0;
    scroll-snap-type: none;
  }

  .home-testimonials__card,
  .home-articles__card {
    flex: none;
    scroll-snap-align: unset;
    width: auto;
  }

  .home-testimonials__sentinel,
  .home-articles__sentinel {
    display: none;
  }

  .home-articles__footer {
    display: flex !important;
    justify-content: center;
    margin-top: var(--wa-space-l);
  }

  .site-footer {
    max-width: var(--site-content-max);
    margin-inline: auto;
  }

  .site-footer__columns {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .site-footer__lockup {
    width: auto;
    max-width: 16rem;
    height: auto;
  }
}


/* —— Inline header nav (64rem+) —— */
@media (min-width: 64rem) {
  .site-header__bar > .site-header__menu-toggle {
    display: none !important;
  }

  .site-header__bar {
    grid-template-columns: 1fr minmax(0, var(--site-content-max)) 1fr;
    gap: clamp(var(--wa-space-2xs), 0.25rem + 0.5vw, var(--wa-space-m));
  }

  .site-header__brand {
    grid-column: 1;
    justify-self: start;
  }

  .site-header__desktop-nav {
    display: flex !important;
    justify-self: center;
    align-items: center;
    grid-column: 2;
    width: 100%;
    max-width: var(--site-content-max);
    min-width: 0;
  }

  .site-header__desktop-list {
    flex-wrap: nowrap;
    gap: var(--wa-space-2xs) clamp(0.125rem, 0.1rem + 0.45vw, var(--wa-space-s));
    width: 100%;
  }

  .site-header__desktop-toggle,
  .site-header__desktop-link {
    padding-inline: clamp(0.125rem, 0.05rem + 0.25vw, var(--wa-space-xs));
  }

  .site-header__cta-wrap {
    grid-column: 3;
    justify-self: end;
  }
}

@media (min-width: 60rem) {
  .home-testimonials__track,
  .home-articles__track {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 72rem) {
  .site-header__bar {
    gap: var(--wa-space-m);
  }

  .site-header__desktop-list {
    gap: var(--wa-space-2xs) var(--wa-space-s);
  }

  .site-header__desktop-toggle,
  .site-header__desktop-link {
    padding-inline: var(--wa-space-xs);
  }

  .site-footer__columns {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .home-testimonials__track,
  .home-articles__track {
    grid-template-columns: repeat(4, 1fr);
  }
}

.site-overlay-menu.site-form-menu.is-visible {
  padding-inline: max(1rem, env(safe-area-inset-left, 0px)) max(1rem, env(safe-area-inset-right, 0px));
}

.site-form-menu__dialog {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}

.site-form-menu__bar {
  justify-content: flex-end;
}

.site-form-menu__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: var(--wa-space-m);
  overflow: auto;
}

.site-form-menu__title {
  margin: 0;
  font-size: 1.5rem;
}

.ac-form {
  display: grid;
  gap: var(--wa-space-m);
}

.ac-form__copy,
.ac-form__heading {
  margin: 0;
}

.ac-form__image {
  margin: 0;
}

.ac-form__image img {
  display: block;
  max-width: 100%;
  height: auto;
}

.ac-form__field {
  display: grid;
  gap: var(--wa-space-2xs);
}

.ac-form__error {
  color: var(--wa-color-danger-50, #b42318);
}

.ac-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wa-space-s);
  align-items: center;
}

.ac-form__choice {
  display: inline-flex;
  align-items: center;
  gap: var(--wa-space-2xs);
  margin-inline-end: var(--wa-space-s);
}

.ac-form__other-input {
  display: block;
  margin-block-start: var(--wa-space-2xs);
  max-width: 24rem;
}

.ac-form__other-input--hidden {
  display: none;
}

.ac-announcement-dialog {
  width: min(36rem, calc(100vw - 2rem));
  max-height: min(85vh, 40rem);
  padding: 0;
  border: none;
  border-radius: var(--wa-border-radius-l, 0.75rem);
  background: var(--wa-color-surface-raised, #fff);
  color: inherit;
  box-shadow: var(--wa-shadow-l, 0 16px 48px rgba(0, 0, 0, 0.2));
}

.ac-announcement-dialog::backdrop {
  background: rgba(15, 23, 42, 0.55);
  backdrop-filter: blur(4px);
}

.ac-announcement-dialog__panel {
  display: flex;
  flex-direction: column;
  gap: var(--wa-space-m, 1rem);
  padding: var(--wa-space-l, 1.5rem);
  max-height: min(85vh, 40rem);
  overflow: auto;
}

.ac-announcement-dialog__title {
  margin: 0;
  font-size: var(--wa-font-size-l, 1.25rem);
  line-height: 1.3;
}

.ac-announcement-dialog__body {
  flex: 1;
}

.ac-announcement-dialog__body > :first-child {
  margin-block-start: 0;
}

.ac-announcement-dialog__body > :last-child {
  margin-block-end: 0;
}

.ac-announcement-dialog__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--wa-space-s, 0.75rem);
  padding-block-start: var(--wa-space-s, 0.75rem);
  border-block-start: 1px solid var(--wa-color-surface-border, rgba(0, 0, 0, 0.12));
}

.ac-announcement-dialog__pref {
  display: inline-flex;
  align-items: center;
  gap: var(--wa-space-2xs, 0.35rem);
  font-size: var(--wa-font-size-s, 0.875rem);
}

.ac-announcement-dialog__close {
  appearance: none;
  border: none;
  border-radius: var(--wa-border-radius-m, 0.5rem);
  padding: 0.55rem 1rem;
  background: var(--wa-color-brand-fill-loud, #1a365d);
  color: #fff;
  font: inherit;
  cursor: pointer;
}

.ac-announcement-dialog__close:hover {
  filter: brightness(1.05);
}

/* === Shared backoffice shell utilities (same global file) === */
/* --- wa-page.shell: type scale (h1 headline … h4 label) --- */
wa-page.shell {
  --shell-font-sans: var(--ac-font-body);
  --shell-font-heading: 'Work Sans', system-ui, sans-serif;
  --shell-font-serif: 'IBM Plex Serif', Georgia, 'Times New Roman', serif;
  --shell-font-condensed: var(--ac-font-condensed);
  font-family: var(--shell-font-sans);
}

/* Shell chrome headlines — not public page body (.page-main in CMS editor). */
wa-page.shell .shell-page-hero h1 {
  font-family: "Playfair Display", var(--shell-font-serif), serif;
  font-size: clamp(2rem, 2rem + 0.75vw, 4rem);
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.15;
  margin: 0;
  color: var(--headline-color);
}

wa-page.shell .shell-page-hero h2 {
  font-family: var(--shell-font-heading);
  font-size: 1.25rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.2;
  margin: 0;
  margin-bottom: 0.5rem;
  color: var(--text);
}

wa-page.shell .shell-page-hero h3 {
  font-family: var(--shell-font-heading);
  font-size: 1.0625rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.28;
  margin: 0;
  color: var(--text);
}

wa-page.shell .shell-page-hero h4 {
  font-family: var(--shell-font-condensed);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0;
  color: var(--text-muted);
}

.shell-header-bar {
  align-items: center;
  width: 100%;
  flex-wrap: wrap;
}

.shell-brand-link {
  align-items: center;
  text-decoration: none;
  color: inherit;
}

.shell-header-spacer {
  flex: 1;
  min-width: 0.5rem;
}

.shell-product {
  font-family: var(--shell-font-heading);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ac-sage-40, #728774);
}

wa-page.shell [slot='navigation'] {
  padding-top: var(--wa-space-s);
}

wa-page[view='desktop'] .shell-nav-heading {
  font-family: var(--shell-font-heading);
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  opacity: 0.72;
  margin: 0 0 var(--wa-space-2xs);
}

.shell-nav-heading--group {
  margin-top: var(--wa-space-m);
}

.shell-logo-light,
.shell-logo-dark {
  display: block;
  height: 1.75rem;
  width: auto;
}

html:not(.wa-dark) .shell-logo-dark {
  display: none;
}

html.wa-dark .shell-logo-light {
  display: none;
}

.shell-page-hero {
  margin-bottom: 1.25rem;
}

.shell-subtle {
  font-family: var(--shell-font-serif);
  font-style: italic;
  font-size: 0.95rem;
  color: var(--ac-brand-20, #2c1640);
}

html.wa-dark .shell-subtle {
  color: var(--ac-brand-70, #d6afea);
}

/* Shell drawer sidebar links: globals use neutral-90 hover — on dark UI that reads as a near-white slab */
html.wa-dark wa-page.shell .shell-sidebar-link:hover,
html.wa-dark .shell-sidebar-link:hover {
  background: var(--wa-color-surface-lowered);
}

html.wa-dark wa-page.shell .shell-sidebar-link[aria-current="page"],
html.wa-dark .shell-sidebar-link[aria-current="page"] {
  background: color-mix(
    in srgb,
    var(--wa-color-brand-50) 28%,
    var(--wa-color-surface-default)
  );
}

.shell-hero-tagline {
  margin: 0.35rem 0 0;
}

.shell-nav-action {
  justify-content: flex-start;
}

.shell-app-menu-panel {
  padding: var(--wa-space-s);
  min-width: 11.25rem;
}

.shell-app-menu wa-select {
  min-width: 9rem;
  width: 100%;
}

.shell-app-menu-events {
  width: 100%;
}

/* Primary content — default slot of wa-page.shell (semantic main + inset) */
wa-page.shell > main.shell-main {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: var(--wa-space-m) var(--wa-space-l);
  padding-block-end: var(--wa-space-xl);
}

@media (max-width: 47.99rem) {
  wa-page.shell > main.shell-main {
    padding-inline: var(--wa-space-m);
  }
}

/*
 * Reference / template utilities (athena-app-shell & internal tools)
 * — ac-section, ac-row, ac-grid-2: page structure
 * — ac-doc-*: documentation prose (notes, captions, type specimens, code sample)
 * — ac-field-label, ac-icon-*: small patterns
 * — ac-demo-*: gallery-only sizing/wrappers
 * — ac-events-*: event log drawer
 */
wa-page.shell .catalog-tab-group {
  width: 100%;
}

.ac-section {
  margin-bottom: 2rem;
}

.ac-section > h2 {
  margin: 0 0 0.75rem;
  padding-bottom: 0.35rem;
  border-bottom: 0.0625rem solid var(--border-mid);
}

.catalog .ac-section h3 {
  margin: 1.25rem 0 0.5rem;
}

.catalog .ac-section h3:first-of-type {
  margin-top: 1rem;
}

.catalog .ac-section h4 {
  margin: 1rem 0 0.35rem;
}

.catalog .ac-section:last-child {
  margin-bottom: 0;
}

.ac-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-bottom: 0.75rem;
}

.ac-row--align-start {
  align-items: flex-start;
}

.ac-row--align-end {
  align-items: flex-end;
}

.ac-row--center-gap {
  align-items: center;
  gap: 1rem;
}

.ac-row--baseline-wrap {
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  align-items: baseline;
}

.ac-row--copy-qr {
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
}

.ac-row--icons {
  gap: 0.75rem;
  font-size: 1.25rem;
  color: var(--text-muted);
}

.ac-icon-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr));
  gap: 0.75rem;
  max-width: 44rem;
}

.ac-icon-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.375rem;
  padding: 0.75rem 0.5rem;
  border: 0.0625rem solid var(--border-mid);
  border-radius: var(--radius);
  text-align: center;
  background: var(--well);
}

.ac-icon-tile code {
  font-size: 0.6875rem;
  line-height: 1.3;
  word-break: break-word;
}

.ac-icon-tile__hint {
  font-size: 0.6875rem;
  line-height: 1.3;
  color: var(--text-muted);
}

.ac-icon-semantic {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.875rem;
  color: var(--text);
}

.ac-icon-scale {
  align-items: flex-end;
  flex-wrap: wrap;
}

.ac-icon-scale-label {
  font-size: 0.6875rem;
  color: var(--text-muted);
}

.ac-row--tight {
  gap: 0.5rem;
  align-items: center;
}

.ac-row--breadcrumb-gap {
  margin-top: 0.75rem;
}

.ac-doc-note {
  font-size: 0.75rem;
  color: var(--text-muted);
  margin: 0 0 1rem;
  max-width: 52rem;
}

.ac-doc-note--tight-top {
  margin-top: 0;
}

.ac-doc-note--tight-bottom {
  margin-bottom: 0.5rem;
}

.ac-grid-2 {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(12.5rem, 1fr));
  gap: 0.75rem;
  align-items: start;
}

wa-tab-panel[active] .ac-tabbed {
  padding-top: 0.75rem;
}

.ac-demo-carousel wa-carousel-item.ac-demo-carousel-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--well);
  color: var(--text-muted);
  font-weight: 600;
}

.ac-demo-carousel {
  max-width: min(20rem, 100%);
  --aspect-ratio: 4 / 3;
}

.ac-demo-chart-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(17.5rem, 1fr));
  gap: 1.25rem;
  align-items: start;
}

.ac-demo-chart {
  display: block;
  width: 100%;
  height: 16.25rem;
}

.ac-demo-spark-row {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: flex-end;
}

.ac-demo-spark-row wa-sparkline {
  flex: 1 1 12.5rem;
  max-width: 17.5rem;
}

.ac-demo-sparkline {
  height: 2rem;
  color: var(--accent);
}

.ac-data-grid {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  max-width: 100%;
}

.ac-data-grid__toolbar {
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
}

.ac-data-grid__meta {
  margin: 0;
  font-size: 0.875rem;
  color: var(--text-muted);
}

.ac-data-grid__page-size {
  min-width: 10rem;
}

.ac-data-grid__scroll {
  overflow-x: auto;
  border: 0.0625rem solid var(--border-mid);
  border-radius: var(--radius);
  background: var(--wa-color-surface-raised);
}

.ac-data-grid__table {
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 0.875rem;
}

.ac-data-grid__table tbody {
  font-family: var(--font-mono), ui-monospace, monospace;
}

.ac-data-grid__table thead {
  background: var(--well);
}

.ac-data-grid__th {
  position: relative;
}

.ac-data-grid__table th,
.ac-data-grid__table td {
  text-align: left;
  border-bottom: 0.0625rem solid var(--border-mid);
  color: var(--text);
  vertical-align: middle;
}

.ac-data-grid__table td {
  padding: 0.5rem 0.75rem;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ac-data-grid__table th {
  padding: 0.3125rem 0.625rem 0.3125rem 0.5rem;
  font-weight: 600;
  white-space: nowrap;
}

.ac-data-grid__resize {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  box-sizing: content-box;
  width: 0.5rem;
  height: 100%;
  padding: 0;
  margin: 0;
  border: none;
  border-radius: 0;
  border-left: 0.0625rem solid var(--border-mid);
  background: transparent;
  cursor: col-resize;
  touch-action: none;
}

.ac-data-grid__resize:hover {
  background: color-mix(in srgb, var(--wa-color-brand-50) 28%, transparent);
}

.ac-data-grid__resize:focus-visible {
  outline: 0.125rem solid var(--wa-color-brand-50);
  outline-offset: -0.0625rem;
}

.ac-data-grid__table tbody tr:last-child td {
  border-bottom: none;
}

.ac-data-grid__sort {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  width: 100%;
  padding: 0;
  margin: 0;
  border: none;
  background: none;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
  border-radius: var(--wa-border-radius-s);
}

.ac-data-grid__sort:hover {
  color: var(--wa-color-brand-50);
}

.ac-data-grid__sort wa-icon {
  flex-shrink: 0;
  opacity: 0.65;
}

.ac-data-grid__sort:hover wa-icon {
  opacity: 1;
}

.ac-data-grid__pager {
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

.ac-data-grid__page-indicator {
  font-size: 0.875rem;
  color: var(--text-muted);
  min-width: 4rem;
  text-align: center;
}

.ac-demo-anim {
  display: inline-block;
  width: 4.5rem;
  height: 4.5rem;
  background: var(--wa-color-brand-50);
  border-radius: var(--wa-border-radius-m);
  margin: 0.5rem 1rem 0.5rem 0;
}

#ux-intersection-demo {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  height: 13.75rem;
  border: solid 0.125rem var(--wa-color-surface-border);
  padding: 0.75rem;
  overflow-y: auto;
  border-radius: var(--radius);
}

#ux-intersection-demo::before,
#ux-intersection-demo::after {
  content: '';
  height: 7.5rem;
  flex-shrink: 0;
}

.ac-demo-intersection-target {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  background: var(--well);
  border-radius: var(--radius);
}

.ac-demo-intersection-target.visible {
  outline: 0.125rem solid var(--accent);
}

.ac-demo-resize-target {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 2rem 1.5rem;
  border: solid 0.125rem var(--wa-color-surface-border);
  border-radius: var(--radius);
  resize: both;
  overflow: auto;
  min-width: 7.5rem;
  min-height: 5rem;
  max-width: 100%;
}

.ac-demo-page-frame {
  height: 26.25rem;
  border: 0.0625rem solid var(--border-mid);
  border-radius: var(--radius);
  overflow: auto;
}

.ac-demo-page-frame wa-page {
  min-height: 23.75rem;
}

.ac-demo-nested-header {
  align-items: center;
}

.ac-demo-nested-title {
  font-size: 0.9rem;
}

.ac-demo-nested-main {
  margin: 0;
}

/* Event drawer */
.ac-events-drawer {
  --size: min(100vw - 2rem, 22rem);
}

.ac-events-drawer .ac-event-panel {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-height: 0;
  height: 100%;
  font-size: 0.875rem;
}

.ac-events-drawer .ac-event-meta {
  margin: 0;
  font-size: 0.6875rem;
  color: var(--text-muted);
}

.ac-events-drawer .ac-event-panel ol {
  flex: 1 1 auto;
  overflow: auto;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--font-mono), ui-monospace, monospace;
  font-size: 0.6875rem;
  line-height: 1.45;
  min-height: 0;
  scrollbar-width: thin;
  scrollbar-color: var(--border-mid) transparent;
}

.ac-events-drawer .ac-event-panel ol::-webkit-scrollbar {
  width: 0.375rem;
  height: 0.375rem;
}

.ac-events-drawer .ac-event-panel ol::-webkit-scrollbar-track {
  background: transparent;
}

.ac-events-drawer .ac-event-panel ol::-webkit-scrollbar-thumb {
  background-color: var(--border-mid);
  border-radius: 0.1875rem;
}

.ac-events-drawer .ac-event-panel ol::-webkit-scrollbar-thumb:hover {
  background-color: var(--text-muted);
}

.ac-events-drawer .ac-event-panel li {
  padding: 0.25rem 0;
  border-bottom: 0.0625rem solid var(--border);
  word-break: break-word;
}

.ac-events-drawer .ac-event-panel .ev-type {
  color: var(--accent);
  font-weight: 600;
}

.ac-events-drawer .ac-event-panel .ev-tag {
  color: var(--text-muted);
}

.ac-events-drawer .ac-events-footer.wa-cluster {
  width: 100%;
  justify-content: flex-end;
  flex-wrap: wrap;
}

/* Documentation typography — reuse on any internal doc page */
.ac-doc-kicker {
  font-family: var(--shell-font-heading);
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin: 0 0 0.35rem;
}

.ac-doc-kicker:not(:first-child) {
  margin-top: 1.25rem;
}

.ac-doc-p {
  font-family: var(--shell-font-sans);
  font-size: 1rem;
  line-height: 1.55;
  margin: 0;
  max-width: 40rem;
  color: var(--text);
}

.ac-doc-aside {
  font-size: 0.8125rem;
  max-width: 52rem;
  color: var(--text-muted);
  margin: 0 0 0.35rem;
}

.ac-doc-aside--lead {
  margin-bottom: 0;
}

.ac-doc-aside--follow {
  margin: 0.35rem 0 0.35rem;
}

.ac-doc-display {
  font-family: var(--shell-font-serif);
  font-size: 1.125rem;
  font-style: italic;
  font-weight: 400;
  margin: 0;
  color: var(--ac-brand-20, #2c1640);
}

html.wa-dark .ac-doc-display {
  color: var(--ac-brand-70, #d6afea);
}

.ac-doc-sample {
  font-family: var(--font-mono);
  font-size: 0.8125rem;
  margin: 0;
  padding: 0.5rem 0.65rem;
  background: var(--well);
  border-radius: var(--radius);
  border: 0.0625rem solid var(--border-mid);
  color: var(--text);
}

.ac-token-name {
  color: var(--accent);
}

/* Captions (demo subheads) & form helpers */
.ac-doc-caption {
  margin: 0 0 0.5rem;
  font-size: 0.75rem;
  color: var(--text-muted);
}

.ac-doc-caption--after {
  margin: 0.75rem 0 0.35rem;
}

.ac-doc-caption--section {
  margin: 1rem 0 0.35rem;
}

.ac-doc-caption--tight-top {
  margin-top: 0;
}

.ac-doc-caption--file {
  margin: 0.85rem 0 0.35rem;
}

.ac-field-label {
  display: block;
  font-size: 0.75rem;
  margin-bottom: 0.25rem;
  color: var(--text-muted);
}

.ac-doc-block {
  margin: 0 0 1rem;
}

.ac-demo-popover-body {
  margin: 0;
  padding: 0.25rem;
}

.ac-details-spaced {
  margin-top: 0.75rem;
}

.ac-demo-progress {
  width: min(15rem, 100%);
}

.ac-demo-slider {
  max-width: 17.5rem;
}

.ac-demo-narrow-stack {
  max-width: 17.5rem;
}

.ac-demo-skel-line {
  width: 100%;
  height: 0.75rem;
  display: block;
}

.ac-demo-skel-line--92 {
  width: 92%;
  height: 0.75rem;
  display: block;
}

.ac-demo-skel-line--64 {
  width: 64%;
  height: 0.75rem;
  display: block;
}

.ac-demo-skel-avatar {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  display: block;
}

.ac-demo-skel-block {
  width: 5rem;
  height: 2.5rem;
  display: block;
}

.ac-demo-scroller {
  height: 5.5rem;
  max-width: 17.5rem;
  border: 0.0625rem solid var(--border-mid);
  border-radius: var(--radius);
  padding: 0.5rem 0.75rem;
}

.ac-demo-scroller p {
  margin: 0 0 0.5rem;
}

.ac-demo-scroller p:last-child {
  margin-bottom: 0;
}

.ac-icon-accent {
  color: var(--accent);
}

.ac-icon-warn {
  color: var(--warn);
}

.ac-icon-danger {
  color: var(--ac-danger);
}

.ac-demo-tree {
  --indent-guide-width: 0.0625rem;
  max-width: 20rem;
}

.ac-demo-animated-image {
  width: 7.5rem;
  height: auto;
}

.ac-demo-comparison {
  max-width: min(22.5rem, 100%);
}

.ac-demo-compare-before,
.ac-demo-compare-after {
  height: 8.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
}

.ac-demo-compare-before {
  background: var(--wa-color-neutral-80);
}

.ac-demo-compare-after {
  background: var(--wa-color-brand-80);
}

.ac-demo-split {
  max-width: 26.25rem;
}

.ac-demo-split-pane {
  min-height: 7.5rem;
  background: var(--well);
  display: flex;
  align-items: center;
  justify-content: center;
}

.ac-demo-zoom-frame {
  max-width: 22.5rem;
  aspect-ratio: 16 / 9;
}

/*
 * Web Awesome — compact control sizing & menus (adapted from examples/respite/styles.css).
 * Only geometry / typography / non-palette behavior; Royal & surfaces stay on Athena tokens above.
 */

/* Buttons — tighter heights & inline padding than WA kit defaults */
wa-button[size='s'] {
  --height: 1.625rem;
  --padding-inline: 0.35rem;
}
wa-button[size='m'] {
  --height: 2.125rem;
  --padding-inline: 0.625rem;
}
wa-button[size='l'] {
  --height: 2.75rem;
  --padding-inline: 0.75rem;
}

wa-button[size='s']::part(base) {
  height: 1.625rem;
  min-height: 0;
  padding-inline: 0.35rem;
}
wa-button[size='m']::part(base) {
  height: 2.125rem;
  min-height: 0;
  padding-inline: 0.625rem;
}
wa-button[size='l']::part(base) {
  height: 2.75rem;
  min-height: 0;
  padding-inline: 0.75rem;
}

/* Inputs — small chrome */
wa-input[size='s'] {
  --height: 1.625rem;
  --padding-inline: 0.5rem;
}
wa-input[size='s']::part(base) {
  min-height: 0;
  padding-inline: 0.5rem;
}

/* Select — taller combobox than wa-input small so label/value/caret keep vertical padding */
wa-select[size='s'] {
  --height: 2.125rem;
  --padding-inline: 0.5rem;
  --wa-form-control-height: 2.125rem;
  --wa-form-control-padding-inline: 0.5rem;
}
wa-select[size='s']::part(combobox) {
  padding-inline: 0.5rem;
}

/* Combobox — match small select */
wa-combobox[size='s'] {
  --height: 2.125rem;
  --padding-inline: 0.5rem;
  --wa-form-control-height: 2.125rem;
  --wa-form-control-padding-inline: 0.5rem;
}
wa-combobox[size='s']::part(combobox) {
  padding-inline: 0.5rem;
}

/* Textarea */
wa-textarea[size='s'] {
  --height: auto;
  --padding-inline: 0.5rem;
}
wa-textarea[size='s']::part(base) {
  min-height: 0;
  padding-inline: 0.5rem;
}

/* Rating — active star follows accent */
wa-rating {
  --symbol-color-active: var(--accent);
  --symbol-color: var(--text-muted);
}

/* Radio (incl. appearance="button") */
wa-radio[size='s'],
wa-radio-group[size='s'] wa-radio {
  --height: 1.625rem;
  --wa-form-control-height: 1.625rem;
  --padding-inline: 0.25rem;
  --wa-form-control-padding-inline: 0.25rem;
}
wa-radio[size='m'],
wa-radio-group[size='m'] wa-radio {
  --height: 2.125rem;
  --wa-form-control-height: 2.125rem;
  --padding-inline: 0.35rem;
  --wa-form-control-padding-inline: 0.35rem;
}
wa-radio[size='l'],
wa-radio-group[size='l'] wa-radio {
  --height: 2.75rem;
  --wa-form-control-height: 2.75rem;
  --padding-inline: 0.5rem;
  --wa-form-control-padding-inline: 0.5rem;
}

wa-radio[appearance='button'][size='s'],
wa-radio-group[size='s'] wa-radio[appearance='button'],
wa-radio[appearance='button'][size='m'],
wa-radio-group[size='m'] wa-radio[appearance='button'],
wa-radio[appearance='button'][size='l'],
wa-radio-group[size='l'] wa-radio[appearance='button'] {
  min-height: 0 !important;
  height: var(--wa-form-control-height) !important;
  padding-inline: var(--wa-form-control-padding-inline) !important;
}

wa-radio-group[size='s']::part(form-control-input),
wa-radio-group[size='m']::part(form-control-input),
wa-radio-group[size='l']::part(form-control-input) {
  min-height: 0;
}

/* Plex Sans Condensed — structural / nav-style controls */
wa-radio-group,
wa-tab-group,
wa-details,
wa-breadcrumb,
wa-tree {
  font-family: var(--ac-font-condensed);
}

/* Cards — between page and raised (WA default is flat surface-default). */
wa-card:not([appearance]),
wa-card[appearance='outlined'] {
  background-color: color-mix(
    in oklab,
    var(--wa-color-surface-default) 50%,
    var(--wa-color-surface-raised) 50%
  );
}

/* Slider/progress tracks use neutral-fill-normal (= ivory / page in Athena) — lift to lowered. */
wa-slider {
  --track-size: 0.25em;
}

wa-slider::part(track) {
  background: var(--wa-color-surface-lowered);
}

wa-progress-bar {
  --track-color: var(--wa-color-surface-lowered);
}

/* Popover — WA uses surface-default; raise above the page. */
wa-popover::part(body) {
  background-color: var(--wa-color-surface-raised);
}

wa-popover::part(popup__arrow) {
  background-color: var(--wa-color-surface-raised);
}

/*
 * Details / accordion — chevrons on the left by default.
 * WA defaults to icon-placement="end" (right). Opt out with data-ac-icon-placement="end".
 * Body content indents to align with summary text (after chevron + gap).
 */
wa-details:not([data-ac-icon-placement="end"])::part(header) {
  flex-direction: row-reverse;
  justify-content: start;
}

wa-accordion-item:not([data-ac-icon-placement="end"])::part(button) {
  flex-direction: row-reverse;
  justify-content: flex-end;
}

wa-details:not([data-ac-icon-placement="end"])::part(content),
wa-accordion-item:not([data-ac-icon-placement="end"])::part(content) {
  /* existing --spacing pad + icon (~1em) + header gap (--spacing) */
  padding-inline-start: calc(var(--spacing, 1rem) + 1em + var(--spacing, 1rem));
}

/* Scroller sits on the page surface (not a raised well). */
wa-scroller {
  --shadow-color: var(--wa-color-surface-default);
  background: var(--wa-color-surface-default);
}

wa-scroller::part(content) {
  background: var(--wa-color-surface-default);
}

/* Dropdowns, selects, comboboxes — keep WA surface-raised for menus/listboxes
 * (do not flatten overlays onto page --bg / surface-default). */
wa-dropdown,
wa-dropdown::part(menu),
wa-select,
wa-combobox {
  --wa-color-brand-fill-quiet: color-mix(
    in srgb,
    var(--accent) 22%,
    var(--wa-color-surface-raised)
  );
  --wa-color-neutral-fill-normal: color-mix(
    in srgb,
    var(--accent) 22%,
    var(--wa-color-surface-raised)
  );
}

html.wa-dark wa-dropdown,
html.wa-dark wa-dropdown-item,
html.wa-dark wa-select,
html.wa-dark wa-combobox,
html.wa-dark wa-option {
  --wa-color-brand-fill-quiet: color-mix(
    in srgb,
    var(--accent) 22%,
    var(--wa-color-surface-raised)
  );
  --wa-color-neutral-fill-normal: color-mix(
    in srgb,
    var(--accent) 22%,
    var(--wa-color-surface-raised)
  );
  --wa-color-neutral-fill-quiet: color-mix(
    in srgb,
    var(--accent) 22%,
    var(--wa-color-surface-raised)
  );
}

/* --- Data patterns ---------------------------------------------------
 * Live demos in athena-app-shell.html sec-table-patterns / sec-form-patterns /
 * sec-empty-states. Full conventions: skills/data-patterns/references/
 */

.ac-empty-state {
  display: grid;
  gap: var(--wa-space-m);
  justify-items: center;
  text-align: center;
  padding: var(--wa-space-2xl) var(--wa-space-l);
  color: var(--wa-color-text-quiet);
}
.ac-empty-state__icon {
  font-size: 2.5rem;
  color: var(--wa-color-text-quiet);
}
.ac-empty-state h3 { margin: 0; }
.ac-empty-state p  { margin: 0; max-width: 44ch; }

.ac-state-grid {
  display: grid;
  gap: var(--wa-space-m);
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.ac-empty-state--card {
  background: var(--wa-color-surface-raised, var(--wa-color-surface-default));
  border: 1px solid var(--wa-color-surface-border, var(--wa-color-neutral-80));
  border-radius: var(--wa-border-radius-m, 6px);
  padding: var(--wa-space-l);
}
.ac-state-error { margin-bottom: var(--wa-space-m); }

/* Bulk-action strip */
.ac-data-grid__bulk {
  display: flex;
  align-items: center;
  gap: var(--wa-space-s);
  padding: var(--wa-space-s) var(--wa-space-m);
  margin-bottom: var(--wa-space-s);
  background: var(--wa-color-brand-fill-quiet);
  border: 1px solid var(--wa-color-brand-border-quiet, var(--wa-color-brand-fill-normal));
  border-radius: var(--wa-border-radius-s, 4px);
}
.ac-data-grid__bulk-count { font-weight: 600; margin-right: auto; }

/* Selected row + select cells */
.ac-data-grid tr.is-selected > td {
  background: var(--wa-color-brand-fill-quiet);
}
.ac-data-grid__th--select,
.ac-data-grid__td--select {
  width: 2.25rem;
  padding-inline: var(--wa-space-s);
  text-align: center;
}

/* Column picker panel inside wa-dropdown */
.ac-data-grid__columns-panel {
  padding: var(--wa-space-s) var(--wa-space-m);
  min-width: 12rem;
}

/* Inline-edit cell */
.ac-data-grid__edit-cell { display: block; }
.ac-data-grid__edit-trigger {
  display: inline-flex;
  align-items: center;
  gap: var(--wa-space-2xs);
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: left;
}
.ac-data-grid__edit-trigger:hover .ac-data-grid__edit-icon,
.ac-data-grid__edit-trigger:focus-visible .ac-data-grid__edit-icon {
  opacity: 1;
}
.ac-data-grid__edit-icon {
  opacity: 0;
  font-size: 0.75em;
  color: var(--wa-color-text-quiet);
  transition: opacity 120ms ease;
}
.ac-data-grid__edit-trigger:focus-visible {
  outline: 2px solid var(--wa-color-brand-border-loud, var(--wa-color-brand-fill-loud));
  outline-offset: 2px;
  border-radius: 2px;
}

/* Search input in toolbar grows to fill */
.ac-data-grid__search { flex: 1 1 16rem; min-width: 10rem; }

/* Form pattern demo */
.ac-pattern-form {
  max-width: 44rem;
}
.ac-form-header {
  align-items: baseline;
}
.ac-form-header h3 { margin: 0; }
.ac-field-error {
  margin: calc(var(--wa-space-2xs) * -1) 0 0;
  color: var(--wa-color-danger-text-loud, var(--wa-color-danger-fill-loud));
  font-size: var(--wa-font-size-s);
}
.ac-form-error-summary {
  margin: var(--wa-space-2xs) 0 0;
  padding-left: var(--wa-space-m);
}
.ac-form-error-summary a { color: inherit; }
.ac-form-actions {
  align-items: center;
  padding-top: var(--wa-space-s);
  border-top: 1px solid var(--wa-color-surface-border, var(--wa-color-neutral-80));
}
.ac-form-actions__spacer { flex: 1 1 auto; }