/* Lantern — balanced Coastal Blue and Forest / contrast and consistency pass, October 2026.
   Site-wide only; the existing page layout, copy, animations and curve engine are untouched.
   --sage-light / --sage / --sage-deep / --sage-bg are live options from theme-switcher.js.
   Availability status tokens are intentionally excluded. */
:root {
  --palette-soft: #E8EBEA;
  --palette-mist: #F0E8DB;
  --palette-card: #EFE3CC;
  --accent-ink: var(--sage-deep);
}
/* Context-aware surfaces:
   Dark blue or green sections use neutral body text / kickers and light accent for highlights;
   light sections use ink and deep accent for small emphasis.
   Never restyle clinical availability status colours. */
:root {
  --on-forest-muted: #D8E2E8;
  --on-forest-heading: #F4F2E9;
  /* Slightly lift the preview accent when used as small text on Forest.
     Clay otherwise slips under 4.5:1 against the typical deep green. */
  --on-forest-accent: color-mix(in srgb, var(--sage-light) 80%, white);
  --on-light-body: #47545F;
  --card-light: #FFFFFF;
  --card-line: color-mix(in srgb, var(--border) 78%, #fff);
}
/* Clear hierarchy: dark Coastal Blue or Forest foundation, warm/cool accent as a consistent second voice. */
.brand-accent-dark { color: var(--sage-deep); }
.brand-accent-light { color: var(--sage-light); }
.eyebrow, .section-head .eyebrow { color: var(--sage-deep); }
.btn-blue, a.btn-blue, button.btn-blue { background: var(--sage-light); color: var(--ink); border-color: transparent; }
.btn-blue:hover { background: var(--sage-light); filter: brightness(1.05); }
/* An accent light enough for dark Forest cannot double as a readable light-surface link. */
.btn-outline-dark:hover { color: var(--sage-light); border-color: var(--sage-light); }
.text-link:hover, .card-link:hover { color: var(--sage-deep); border-color: var(--sage); }
/* Shared accent language for cards, links and secondary sections. */
.about .eyebrow, .rooms .section-head .eyebrow { color: var(--sage-deep); }
.about .fact-card { background: var(--sage-bg); background: linear-gradient(135deg, var(--sage-bg), var(--palette-soft)); }
.about .fact-card::before { background: var(--sage); }
.about .fact-card span { color: var(--sage-deep); }
.about-links .text-link, .room-card .card-link, .address-card .card-link {
  border-bottom-color: var(--sage); color: var(--ink);
}
.about-links .text-link:hover, .room-card .card-link:hover, .address-card .card-link:hover { color: var(--sage-deep); }
.how-it-works .eyebrow { color: var(--sage-deep); }
.how-it-works .hiw-line { background: linear-gradient(90deg, var(--blue), var(--sage) 68%, var(--sage)); opacity: .42; }
.how-it-works .hiw-step:nth-child(3) .hiw-dot,
.how-it-works .hiw-step:nth-child(4) .hiw-dot {
  background: var(--sage-bg); color: var(--sage-deep); border-color: var(--sage);
}
/* On all dark panels, use pale neutral kickers; the accent stays on borders/headline emphasis. */
.where-to-start .eyebrow, .closing .eyebrow, .footer-brand .eyebrow,
.trr-beyond .eyebrow, .trr-hero .eyebrow, .page-top .eyebrow,
.dt-top .eyebrow, .gs-hero .eyebrow, .profile-top .eyebrow,
.admin-top .eyebrow, .top .eyebrow, .hero .eyebrow,
:where(.where-to-start, .closing, .trr-beyond, .trr-hero, .page-top, .dt-top, .gs-hero, .profile-top, .admin-top) .section-head .eyebrow {
  color: var(--on-forest-muted);
}
/* Tiny accent rule gives the kicker a secondary colour role without undermining readability. */
.where-to-start .eyebrow::after, .trr-beyond .eyebrow::after {
  content:""; display:inline-block; vertical-align:middle; width:28px; height:2px;
  margin-left:13px; background:var(--sage-light); border-radius:2px;
}
.where-to-start .wts-num { color: var(--on-forest-accent); }
.where-to-start .wts-link { color: var(--cream); border-color: var(--sage-light); }
.where-to-start .wts-link svg { color: var(--on-forest-accent); }
.where-to-start .wts-card:hover .wts-link { border-color: var(--sage-light); }
.where-to-start .wts-card:hover .wts-link svg { transform:translateX(2px); }
/* Where to Start: restored original smooth hover interaction from the
   earlier deployment. A single translucent background transitions between
   two alpha values (no gradient/solid snap), the card gently lifts by 3px,
   and the border lightens in sync. Brand accents elsewhere remain unchanged. */
.where-to-start .wts-card,
.where-to-start .wts-card:nth-child(2) {
  background: rgba(255,255,255,.06);
  border-color: rgba(237,238,231,.22);
  transform: translateY(0);
  box-shadow: none;
  transition: background .4s ease,
              border-color .4s ease,
              transform .4s cubic-bezier(.2,.7,.3,1);
}
.where-to-start .wts-card h3,
.where-to-start .wts-link { color: var(--on-forest-heading); }
.where-to-start .wts-card p { color: var(--on-forest-muted); }
@media (hover: hover) {
  .where-to-start .wts-card:hover,
  .where-to-start .wts-card:nth-child(2):hover {
    background: rgba(255,255,255,.10);
    border-color: rgba(237,238,231,.42);
    transform: translateY(-3px);
  }
  .where-to-start .wts-card:hover .wts-link svg {
    transform: translateX(5px);
  }
}
.where-to-start .wts-card:focus-within {
  background: rgba(255,255,255,.10);
  border-color: rgba(237,238,231,.42);
  transform: translateY(-3px);
}
.rooms .room-card { border: 1px solid var(--border); }
.rooms .room-card:nth-child(even) .room-card-body { background: var(--palette-mist); }
.room-card-body .kicker { color: var(--sage-deep); }
.closing h2 em, .closing .footer-bottom a:hover { color: var(--sage-light); }
.footer-social a:hover { border-color: var(--sage-light); }
.footer-col a:hover { color: var(--sage-light); }
.footer-credit, .footer-brand .eyebrow { color: var(--sage-light); }
/* Secondary editorial marks, not full-width bands. */
.page-top .eyebrow, .dt-top .eyebrow, .gs-hero .eyebrow, .trr-hero .eyebrow { color: var(--on-forest-muted); }
.page-top h1::after, .dt-top h1::after, .gs-hero h1::after {
  content:""; display:block; width:46px; height:3px; border-radius:3px; margin-top:18px;
  background:var(--sage-light);
}
.page-top .glow-orb, .trr-bloom { opacity:.45; }
/* Equal informational cards must not look arbitrarily selected/featured. */
.section-alt .info-card, .section-alt .info-card:nth-child(3n+2),
.card-grid .info-card, .card-grid .info-card:nth-child(3n+2) {
  background:var(--card-light); border:1px solid var(--card-line);
}
.info-card h3, .info-card p { color:var(--ink); }
.info-card .dot { box-shadow:0 0 0 5px var(--sage-bg); }
.address-card, .address-card:nth-child(even) { background:var(--card-light); border:1px solid var(--card-line); }
.link-row:hover { background:var(--sage-bg); color:var(--ink); }
.link-row:hover svg, .prose h3, details.faq summary::after { color:var(--sage-deep); }
/* Search / clinician list: reserve semantic colours for actual availability states. */
.tab-item.active { border-left-color:var(--sage); }
.tab-count, .pill-any.is-selected { background:var(--sage-bg); color:var(--sage-deep); }
.pill.is-selected:not(.status-pill), .gs-option.is-selected, .rf-radios .rf-radio.is-selected,
.gi-jump a:hover { border-color:var(--sage); background:var(--sage-bg); color:var(--ink); }
.link-btn:hover, #resultCount { color:var(--sage-deep); }
.results-list .person-card:hover, .person-card:hover { border-color:var(--sage); }
.person-name a:hover, .person-body .card-link:hover { color:var(--sage-deep); }
/* Practitioner detail: accents on headings, contact actions and stable informational tags. */
.profile-top .eyebrow, .profile-loc { color:var(--on-forest-muted); }
.profile-body .tag-block h3::after, .profile-grid .tag-block h3::after {
  content:""; display:block; width:34px; height:2px; margin-top:8px; background:var(--sage); border-radius:3px;
}
.profile-body .tag-chip, .profile-body .contact-card, .profile-grid .contact-card { border-color:var(--sage-bg); }
.profile-body .contact-card a:hover, .contact-card a:hover { color:var(--sage-deep); }
/* Fees, practice information, rentals. Keep featured status meaningful, while accenting more than two tiles. */
.gi-icon.sage, .gi-icon.blue, .gi-icon.amber { background: var(--sage-bg); color:var(--sage-deep); }
.gi-icon svg { color:var(--sage-deep); }
.gi-stat, .gi-card { border-color:var(--border); }
/* Rates: consistent white card surfaces; data from the sheet has equal visual priority. */
.gi-sheet-rates .gi-stat, .gi-sheet-rates .gi-stat:nth-child(3n+2),
.gi-sheet-rates .gi-stat:nth-child(3n+3) {
  background:var(--card-light); border:1px solid var(--card-line);
}
.gi-sheet-rates .gi-stat.featured { border-top:3px solid var(--sage); }
.gi-sheet-rates .gi-stat .amount { color:var(--ink); }
.gi-sheet-rates .gi-stat.featured .amount { color:var(--sage-deep); }
.gi-sheet-rates .gi-stat .label, .gi-sheet-rates .gi-stat .detail { color:var(--on-light-body); }
/* GP healthcare plan info cards: consistent white, with a restrained structural mark. */
.gi-cards .gi-card { background:var(--card-light); border:1px solid var(--card-line); border-top:2px solid var(--sage); }
.gi-cards .gi-card h3 { color:var(--ink); }
.gi-cards .gi-card p { color:var(--on-light-body); }
.gi-icon { background:var(--sage-bg); }
.gi-icon svg { color:var(--sage-deep); }
.gi-jump a { background:var(--sage-bg); color:var(--sage-deep); }
.trr-hero h1 em { color:var(--sage-light); }
.trr-availability-jump { border-color:var(--sage-light); color:var(--sage-light); }
.trr-hero-meta .n { color:var(--sage-light); }
.trr-pull { border-left-color:var(--sage); }
.trr-tab.is-active { background:var(--sage-bg); color:var(--sage-deep); border-color:var(--sage); }
.trr-incl-item svg { color:var(--sage-deep); }
/* Beyond the Room cards share a dark-surface variant. No pale card with pale text. */
.trr-beyond .trr-bcard,
.trr-beyond .trr-bcard:nth-child(even) {
  background:rgba(255,255,255,.075);
  border:1px solid rgba(244,242,233,.26);
}
.trr-beyond .trr-bcard:hover,
.trr-beyond .trr-bcard:nth-child(even):hover {
  background:rgba(255,255,255,.12); border-color:var(--sage-light);
}
.trr-beyond .trr-bcard h3 { color:var(--on-forest-heading); }
.trr-beyond .trr-bcard p:not(.n) { color:var(--on-forest-muted); }
.trr-beyond .trr-bcard .n { color:var(--on-forest-accent); }
.trr-who .eyebrow { color:var(--sage-deep); }
.trr-cta .btn { background:var(--sage-light); color:var(--ink); }
/* Form and back-office UI: same accent system, not the former all-green palette. */
.gs-card { border:1px solid var(--border); }
.gs-input:focus, .rf-year:focus { outline-color:var(--sage); border-color:var(--sage); }
.gs-btn-primary, button.gs-btn-primary { background:var(--sage-light); color:var(--ink); }
.gs-btn-primary:hover { filter:brightness(1.04); }
.gs-btn-primary:disabled { opacity:.55; cursor:not-allowed; }
.gs-option.is-selected, .rf-radio.is-selected { background:var(--sage-bg); border-color:var(--sage); }
.gs-progress { color:var(--sage-deep); }
.pp-tab.is-on { background:var(--sage-bg); border-color:var(--sage); color:var(--sage-deep); }
.pp h3, .pp-note strong { color:var(--sage-deep); }
.ct-note { border-left-color:var(--sage); }
.admin-top .eyebrow, .top .eyebrow { color:var(--on-forest-muted); }
.admin-list .admin-links a:hover, .admin-list .admin-links button:hover { background:var(--sage-bg); color:var(--sage-deep); border-color:var(--sage); }
.admin-search input:focus, .field input:focus, .field textarea:focus, .field select:focus { border-color:var(--sage); outline-color:var(--sage); }
.field-card h2::before { content:""; display:inline-block; width:5px; height:20px; background:var(--sage); border-radius:3px; vertical-align:-3px; margin-right:12px; }
.field .pill.is-selected { border-color:var(--sage); background:var(--sage-bg); color:var(--sage-deep); }
/* Accessibility and stable interaction targets. */
:where(a,button,input,select,textarea):focus-visible { outline:2px solid var(--sage-deep); outline-offset:3px; }
@media (prefers-reduced-motion:reduce){ .where-to-start .wts-card { transition:none; } }
@media (max-width:700px){
  .where-to-start .wts-card { padding:28px 24px; }
  .about .fact-card { margin-top:20px; }
}

/* === V6 hardening: component contexts in responsive/dynamically loaded pages === */
/* Standardized equal-weight contact location cards, without modifying map layout. */
.ct-locations .address-card, .ct-locations .address-card:nth-child(even) {
  background:var(--card-light);
  color:var(--ink);
  border:1px solid var(--card-line);
  box-shadow:0 6px 28px rgba(28,51,42,.035);
}
.ct-locations .address-card .kicker { color:var(--sage-deep); }
.ct-locations .address-card address { color:var(--on-light-body); }
.ct-locations .address-card .ct-dir,
.ct-locations .address-card .text-link { color:var(--ink); border-bottom-color:var(--sage); }
.ct-locations .address-card .ct-dir:hover { color:var(--sage-deep); }
/* Light informational panels get dark text; avoid inherited cream on a tinted card. */
:where(.section-alt,.gi-section,.ct-section,.trr-prac) :where(.info-card,.gi-card,.gi-stat,.address-card,.ct-note) {
  color:var(--ink);
}
/* Link semantics are different on dark vs light sections. */
:where(.trr-beyond,.where-to-start,.closing,.page-top,.trr-hero,.admin-top) a.text-link:hover {
  color:var(--sage-light); border-bottom-color:var(--sage-light);
}
/* Kicker spacing and hierarchy remains consistent across narrower screens. */
@media(max-width:700px){
  .trr-beyond .trr-bcard { padding:28px 24px; }
  .ct-locations .address-card { padding:24px 22px; }
  .where-to-start .eyebrow::after, .trr-beyond .eyebrow::after { width:20px; margin-left:9px; }
}