/* Approved emblem with lettering traced into vector paths from the supplied artwork. */
.header-about[aria-current="page"]{color:var(--ice);text-decoration:underline;text-decoration-color:var(--cyan);text-underline-offset:8px;text-decoration-thickness:1px}
.chapter-utilities .menu-about{display:inline-flex;align-items:center;min-height:44px;margin-right:28px;color:var(--ice);font-size:14px}
/* Draw directional icons as paths so device emoji fonts cannot replace them. */
.ui-arrow {
  display: inline-block; width: 1em; height: 1em; flex: none;
  vertical-align: -.125em; fill: none; stroke: currentColor;
  stroke-width: 1.25; stroke-linecap: round; stroke-linejoin: round;
  pointer-events: none;
}
.header-cta .ui-arrow { width: 18px; height: 18px; }
.brand-lockup {
  display: inline-flex; flex: none; align-items: center; justify-content: flex-start;
  min-height: 48px; width: 194px; gap: 0; letter-spacing: normal;
}
.brand-lockup .brand-artwork {
  display: block; width: 100%; height: auto; aspect-ratio: 408 / 116;
  flex: none; mix-blend-mode: normal;
}
.footer-brand.brand-lockup { width: 156px; min-height: 48px; }
.chapter-dialog-top .brand-lockup { width: 194px; }
/* Keep the opening heading focused for announcement, without a control outline. */
.chapter-dialog #chapterDialogTitle:focus { outline: none; }
.plan-symbol img, .film-loading img {
  mix-blend-mode: normal; object-fit: contain;
}
.plan-symbol img { width: 52px; height: 52px; }
.film-loading img { width: 48px; height: 48px; }
@media (max-width: 700px) {
  .brand-lockup { width: 148px; min-height: 44px; }
  .chapter-dialog-top .brand-lockup { width: 164px; }
  .footer-brand.brand-lockup { width: 138px; }
  .site-header { column-gap: 14px; }
  .site-header nav { flex: none; }
  .hero-identity { top: 96px; }
  .hero-identity > p { display: block; color: #aacadb; font-size: 11px; }
  .plan-symbol img { width: 44px; height: 44px; }
}
@media (max-width: 380px) {
  .site-header .brand-lockup { width: 148px; }
  .contact-header .brand-lockup { width: 128px; }
  .site-header { column-gap: 10px; }
}
@media (min-width: 381px) and (max-width: 420px) {
  .site-header { padding-inline: 20px; }
  .site-header .brand-lockup { width: 132px; }
}

/* A consistent gesture cue stays legible over the hero, tunnel and film. */
.scroll-prompt,.journey-instruction {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 9px 15px; border: 1px solid #74cde459; border-radius: 28px;
  background: #061421ed; color: #dff3ff; font: 500 14px/1.3 var(--body);
  white-space: nowrap;
}
.scroll-symbol { display: inline-flex; flex: none; color: #75ddff; }
.scroll-symbol svg { width: 17px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.scroll-symbol .scroll-swipe { display: none; }
.scroll-wheel { animation: scroll-wheel-cue 2s ease-in-out infinite; }
@keyframes scroll-wheel-cue { 0%,100% { transform: translateY(0); opacity: .6; } 50% { transform: translateY(5px); opacity: 1; } }
@keyframes scroll-swipe-cue { 0%,100% { transform: translateY(2px); opacity: .65; } 50% { transform: translateY(-3px); opacity: 1; } }
.hero-edge { gap: 24px; }
.hero-edge:hover .scroll-prompt { border-color: #75ddff; background: #102839; }
.journey-instruction { margin-left: 8px; padding: 7px 12px; }
.journey-instruction .scroll-symbol svg { width: 14px; height: 20px; }
.tunnel-scroll-cue { display: none; position: fixed; bottom: max(24px,env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); z-index: 5; pointer-events: none; }
.hero-transition:is([data-handoff=aligning],[data-handoff=bridge]) .tunnel-scroll-cue { display: inline-flex; }
html.mobile-loading .tunnel-scroll-cue { visibility: hidden; }
@media (max-width: 700px) {
  .scroll-symbol .scroll-mouse { display: none; }
  .scroll-symbol .scroll-swipe { display: block; }
  .scroll-swipe-motion { animation: scroll-swipe-cue 2s ease-in-out infinite; }
  .hero-edge { bottom: 17px; gap: 18px; }
  .hero-edge .scroll-prompt { padding: 8px 14px; }
  .stage-topline { align-items: flex-start; pointer-events: none; }
  .stage-topline .film-tools { pointer-events: auto; }
  .journey-id { display: flex; min-height: 44px; gap: 8px; }
  /* Centre the reminder in the picture's lower fade, clear of both controls. */
  .journey-instruction {
    position: absolute; top: calc(clamp(220px,42svh,420px) - 57px);
    left: 50%; transform: translateX(-50%); margin: 0;
    padding: 6px 12px; font-size: 12px; font-weight: 400; gap: 6px;
    border-color: #9cd5e52e; background: #061421b8; color: #d2eaf5;
    text-shadow: none;
  }
  .cinema-mode .journey-instruction { top: calc(100svh - 184px); }
  .journey-instruction .scroll-symbol svg { width: 13px; height: 19px; }
}
@media (max-width: 700px) and (max-height: 740px) {
  /* Keep the first invitation on screen even when the hero is taller than it. */
  .hero-edge { top: 124px; bottom: auto; justify-content: center; }
  .hero-edge .edge-line { display: none; }
  .cinema-mode .journey-instruction { top: calc(100svh - 129px); }
}
@media (prefers-reduced-motion: reduce) {
  .scroll-wheel,.scroll-swipe-motion { animation: none; }
}

/* Shared footer credits and compact, accessible profile links. */
.branded-footer { justify-content: space-between; gap: 24px 40px; flex-wrap: wrap; }
.branded-footer .footer-identity { display: grid; gap: 7px; }
.branded-footer .footer-tagline { margin: 0; }
.branded-footer .footer-copyright { font-size: 12px; line-height: 1.6; }
.branded-footer .footer-links { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 28px; }
.branded-footer .footer-credit,.branded-footer .footer-return,.branded-footer .footer-privacy {
  display: inline-flex; align-items: center; gap: 12px; min-height: 44px;
  font-size: 12px; line-height: 1.5; color: #aac5d5;
}
.branded-footer .footer-socials { display: flex; gap: 8px; }
.branded-footer .footer-social { display: inline-flex; align-items: center; gap: 7px; min-width: 44px; min-height: 44px; padding: 0 6px; font-size: 12px; line-height: 1.5; white-space: nowrap; color: #aac5d5; border-radius: 6px; }
.branded-footer .footer-social svg { display: block; flex: none; width: 19px; height: 19px; fill: currentColor; }
.branded-footer a:hover { color: var(--cyan); }
.branded-footer a:focus-visible { outline: 2px solid var(--cyan); outline-offset: 4px; }
.branded-footer .footer-company { flex-basis:100%; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px 32px; padding-top:20px; border-top:1px solid var(--line); color:#aac5d5; font-size:13px; line-height:1.7; }
.branded-footer .footer-company address { font-style:normal; }
.branded-footer .footer-company a { text-decoration:underline; text-underline-offset:3px; }
.branded-footer .footer-company-details { display:inline-flex; align-items:center; min-height:44px; margin-left:12px; }
@media (max-width: 700px) {
  .branded-footer { gap: 12px; }
  .branded-footer .footer-identity,.branded-footer .footer-links { width: 100%; }
  .branded-footer .footer-tagline { display: none; }
  .branded-footer .footer-links { justify-content: space-between; gap: 0 12px; }
  .branded-footer .footer-return { flex-basis: 100%; justify-content: space-between; }
  .branded-footer .footer-company { display:block; font-size:13px; padding-top:16px; }
  .branded-footer .footer-company address { margin-bottom:12px; }
  .branded-footer .footer-company-details { display:flex; width:fit-content; margin-left:0; }
}

/* Keep About directly available alongside Explore and Contact on narrow screens. */
@media(max-width:700px){
  .site-header.has-about-nav{column-gap:12px}
  .site-header.has-about-nav .brand-lockup{width:120px}
  .site-header.has-about-nav nav{gap:12px}
  .site-header.has-about-nav .header-link{font-size:12px;gap:5px}
  .site-header.has-about-nav .header-cta{display:flex;min-height:44px;padding:8px 12px;gap:9px}
  .site-header.has-about-nav .header-cta .ui-arrow{width:15px;height:15px}
}
@media(max-width:380px){
  .site-header.has-about-nav{padding-inline:16px;column-gap:8px}
  .site-header.has-about-nav .brand-lockup{width:104px}
  .site-header.has-about-nav nav{gap:10px}
  .site-header.has-about-nav .header-link{font-size:11px;gap:4px}
  .site-header.has-about-nav .header-cta{font-size:11px;padding-inline:10px;gap:6px}
  .site-header.has-about-nav .header-cta .ui-arrow{display:none}
}