/* Light mode: clear paper surfaces, legible controls and restrained blue/gold depth. */
html:root:not([data-theme="dark"]) {
  --muted: #4b5f76;
  --line: #cbd7e3;
  --depth-seam: #8ca2ba36;
  --depth-shadow: #142d4814;
  --depth-shadow-near: #142d4809;
}
html:root:not([data-theme="dark"]) body :is(.card,.info-card,.faq,.review,.at-glance,.form-panel,.calculator,.resource-card,.service-disclosure) {
  border-color: #cbd7e3;
  box-shadow: 0 2px 4px #18365405, 0 12px 32px #1836540c, inset 0 1px #fff;
}
html:root:not([data-theme="dark"]) body :is(.card,.resource-card,.service-disclosure):hover {
  border-color: #8ba8c6;
}
html:root:not([data-theme="dark"]) body .faq[open] {
  border-color: #8ba8c6;
  background: #fff;
}
html:root:not([data-theme="dark"]) body .field :is(input,select,textarea):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([aria-invalid="true"]) {
  background-color: #fff;
  color: #112340;
  border-color: #8497ac;
}
html:root:not([data-theme="dark"]) body .field :is(input,textarea)::placeholder { color: #586b80; opacity: 1; }
html:root:not([data-theme="dark"]) body :is(input,select,textarea,button,a,summary):focus-visible {
  outline: 3px solid #125bc9;
  outline-offset: 4px;
}
/* Numbered markers must retain a complete foreground/background pair. */
html:root:not([data-theme="dark"]) body .scene-hotspot {
  color: #fff;
  background: #125bc9;
}
html:root:not([data-theme="dark"]) body .scene-hotspot:is(:hover,:focus-visible,[aria-current="step"]) {
  color: #13253e;
  background: #f0c879;
}
html:root:not([data-theme="dark"]) body .location-map-refined .map-place-code { color: inherit; }
html:root:not([data-theme="dark"]) body [data-path-step][aria-pressed="true"] > span {
  color: #fff;
  background: #17334c;
}
html:root[data-theme="dark"] body [data-path-step][aria-pressed="true"] > span {
  color: #142d48;
  background: #adcfff;
}
html:root[data-theme="dark"] body .mobile-contact .btn.btn-primary {
  color: #112340;
  background: #accfff;
  border-color: #accfff;
}
html:root:not([data-theme="dark"]) body .stars { color: #805b16; }
html:root:not([data-theme="dark"]) body .game-promotion { --gp-gold: #805b16; }
html:root:not([data-theme="dark"]) body :is(.gp-demo-state,.gp-track-labels span:nth-child(2)) { color: #805b16; }
/* A solid label stays readable above the game's changing artwork. */
.rr .rr-pill { background: #142d48; color: #eef4ff; border-color: #6e8cac; }
.travel-film-frame video,.pc-video { color: #fff; }

/* An understated qualification, without an invented institutional badge or logo. */
.green-qualification-link {
  display: inline-flex; align-items: center; gap: 12px; max-width: 100%;
  margin-top: 18px; padding: 12px 15px; border: 1px solid var(--line); border-radius: 10px;
  color: var(--ink); background: var(--soft); text-decoration: none;
  font-size: .82rem; line-height: 1.5;
}
.green-qualification-link > svg { flex: 0 0 26px; width: 26px; height: 26px; color: var(--blue); }
.green-qualification-link > span:first-of-type { min-width: 0; }
.green-qualification-link strong,.green-qualification-link > span > span { display: block; }
.green-qualification-link > span > span { color: var(--muted); }
.green-qualification-link > span:last-child { margin-left: 8px; color: var(--blue); }
.green-qualification-link:hover { border-color: var(--blue); }
.green-qualification-card,.green-home-panel {
  --green-wash: #e9f1f5;
  position: relative; display: grid; grid-template-columns: 42px minmax(0,1fr); gap: 20px;
  padding: clamp(22px,3vw,36px); border: 1px solid var(--line); border-radius: 16px;
  background: linear-gradient(125deg,var(--green-wash),var(--card) 62%);
  box-shadow: 0 12px 32px var(--depth-shadow);
  scroll-margin-top: calc(var(--header-height,100px) + 24px);
}
[data-theme="dark"] :is(.green-qualification-card,.green-home-panel) { --green-wash: #183348; }
.green-qualification-card { margin-block: 26px; }
.green-qualification-icon {
  display: grid; place-items: center; width: 42px; height: 48px;
  color: var(--blue); border-bottom: 2px solid var(--gold);
}
.green-qualification-card .kicker,.green-home-panel .kicker { margin-bottom: 10px; font-size: .75rem; }
.article .green-qualification-card h3 { margin: 0 0 14px; font-size: 1.3rem; }
.green-qualification-card p { margin: 0; }
.green-qualification-card p + p { margin-top: 12px; }
.green-home-panel { grid-template-columns: 42px minmax(0,1fr) auto; align-items: center; gap: 26px; }
.green-home-copy { max-width: 67ch; }
.green-home-panel h2 { font-size: clamp(1.5rem,2.3vw,2rem); margin: 0 0 14px; line-height: 1.25; }
.green-home-panel p { margin: 0; }
:root body .green-home-panel .green-home-credential { font-size: .875rem; color: var(--muted); margin-top: 16px; }
.green-home-panel .btn { white-space: normal; text-align: center; }
@media(max-width:900px) {
  .green-home-panel { grid-template-columns: 42px minmax(0,1fr); gap: 20px; }
  .green-home-panel > .btn { grid-column: 2; justify-self: start; }
}
@media(max-width:520px) {
  .green-qualification-card,.green-home-panel { grid-template-columns: minmax(0,1fr); padding: 23px; gap: 17px; }
  .green-home-panel > .btn { grid-column: 1; width: 100%; }
  .green-qualification-link { width: 100%; }
}
@media print {
  .green-qualification-card,.green-home-panel { background: #fff; box-shadow: none; border-color: #888; }
}

/* These illustrated interfaces also follow the page's theme selection. */
html:root:not([data-theme="dark"]) body .rr .rr-hero-shade {
  background: linear-gradient(90deg, #f4f7fc 0%, #f4f7fc 56%, #f4f7fcf5 70%, #f4f7fc20 100%),
    linear-gradient(0deg, #fff, #ffffff00 40%);
}
html:root:not([data-theme="dark"]) body .rr :is(.rr-hero-copy,.rr-hero-title) {
  color: #142d48;
  text-shadow: none;
}
html:root:not([data-theme="dark"]) body .rr .rr-hero-title span {
  color: #805b16;
  background: none;
  animation: none;
}
html:root:not([data-theme="dark"]) body .rr .rr-hero-sub {
  color: #4b5f76 !important;
}
html:root:not([data-theme="dark"]) body .rr .rr-pill {
  background: #fff;
  color: #142d48;
  border-color: #71869e;
}
html:root:not([data-theme="dark"]) body .rr .rr-pill i { background: #187446; }

/* Theme the film's frame and controls without tinting the video itself. */
html:root:not([data-theme="dark"]) body main > .section.home-feature,
html:root:not([data-theme="dark"]) body .home-feature .travel-film {
  background: #eaf1f8;
  border-color: #cbd7e3;
}
html:root:not([data-theme="dark"]) body .home-feature .travel-film button {
  background: #fff;
  color: #142d48;
  border-color: #71869e;
  box-shadow: 0 3px 16px #142d4826;
}
html:root:not([data-theme="dark"]) body .home-feature .travel-film button:hover {
  background: #e0ebf8;
}
html:root:not([data-theme="dark"]) body .home-feature .travel-film button:focus-visible {
  outline: 3px solid #125bc9;
  outline-offset: 4px;
}

html:root:not([data-theme="dark"]) body :is(.chat-header,.chat-launcher) {
  color: #142d48;
  background: linear-gradient(125deg, #fff, #e8f0fa);
  border-color: #71869e;
}
html:root:not([data-theme="dark"]) body .chat-header .chat-agent > div > span,
html:root:not([data-theme="dark"]) body .chat-launcher-copy small {
  color: #4b5f76;
}
html:root:not([data-theme="dark"]) body .chat-header button {
  color: #142d48;
  background: #fff;
  border-color: #71869e;
}
html:root:not([data-theme="dark"]) body .chat-header button:hover {
  background: #e0ebf8;
}
html:root:not([data-theme="dark"]) body :is(.chat-header button,.chat-launcher):focus-visible {
  outline: 3px solid #125bc9;
  outline-offset: 4px;
}
@media(min-width:601px) {
  html:root:not([data-theme="dark"]) body .rate-lock-promo-art > span {
    background: #fff;
    color: #142d48;
    box-shadow: 0 2px 8px #142d4826;
  }
}