/* Map containers */
.map-container {
    height: 200px;
}

.map-container-sm {
    height: 180px;
}

/* Embed / iframe */
.embed-map {
    border: 0;
}

/* Fasting warning (hidden by default, shown by JS) */
.fasting-warning {
    display: none;
}


/* ── Accessibility ─────────────────────────────────────────── */
.skip-link {
  position: absolute; left: 0.5rem; top: -4rem; z-index: 300;
  background: #fff; color: #045283; padding: 0.6rem 1rem; border-radius: 0.5rem;
  font-weight: 600; box-shadow: 0 4px 12px rgba(0,0,0,.2); transition: top .15s;
}
.skip-link:focus { top: 0.5rem; }
:focus-visible { outline: 2px solid #045283; outline-offset: 2px; }
main:focus { outline: none; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}


/* ── Motion (GSAP) ─────────────────────────────────────────────
   Elements start hidden only while JS is booting; `motion-on` is set by
   motion.js (or by a 2.5s fallback) so content never stays invisible. */
.js:not(.motion-on) [data-hero-line] { transform: translateY(112%); }
.js:not(.motion-on) [data-hero-fade] { opacity: 0; }
.js:not(.motion-on) [data-vial-wrap] { opacity: 0; }
[data-hero-line] { will-change: transform; }
.hero-line-mask { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }

.vial-glass { fill: rgba(255,255,255,.07); stroke: rgba(255,255,255,.38); stroke-width: 2; }

/* journey */
.journey-node circle.ring { fill: #fff; stroke: #cbd5e1; stroke-width: 3; transition: stroke .3s, fill .3s; }
.journey-node.is-on circle.ring { fill: #045283; stroke: #045283; }
.journey-node .glyph { stroke: #64748b; transition: stroke .3s; }
.journey-node.is-on .glyph { stroke: #fff; }
[data-step] { transition: opacity .4s, transform .4s; }
.js [data-step]:not(.is-on) { opacity: .45; }
[data-step].is-on h3 { color: #045283; }

/* hover polish used site-wide */
.lift { transition: transform .25s ease, box-shadow .25s ease; }
.lift:hover { transform: translateY(-4px); box-shadow: 0 14px 30px -12px rgba(10,37,64,.25); }
.link-grow { background: linear-gradient(currentColor,currentColor) 0 100%/0 2px no-repeat; transition: background-size .25s; }
.link-grow:hover, .link-grow:focus-visible { background-size: 100% 2px; }
.press:active { transform: scale(.97); }
[data-tilt] { transform-style: preserve-3d; will-change: transform; }
details.faq > summary::-webkit-details-marker { display: none; }
@media (prefers-reduced-motion: reduce) {
  .js:not(.motion-on) [data-hero-line], .js:not(.motion-on) [data-hero-fade], .js:not(.motion-on) [data-vial-wrap] { transform: none; opacity: 1; }
  .js [data-step]:not(.is-on) { opacity: 1; }
}

/* mobile journey list */
[data-step="m"] > span:first-child { transition: background .3s, border-color .3s; }
[data-step="m"].is-on > span:first-child { background: #045283; border-color: #045283; }
[data-step="m"].is-on > span:first-child svg { color: #fff; }