/* A calm photographic card stack. All dimensions are reserved before scripts load. */
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.hero-carousel { display: flex; flex-direction: column; padding: 22px 12px 0 12px; isolation: isolate; }
.hero-stage { order: 1; position: relative; height: 450px; perspective: 1200px; touch-action: pan-y; }
.hero-backplate { position: absolute; inset: 0; border: 1px solid #b8d5ea; border-radius: 16px 60px 16px 16px; background: #e7f2fa; transform: translate(8px, -10px) rotate(2deg) scale(.985); }
.hero-backplate-far { background: #f5f9fd; transform: translate(-5px, -18px) rotate(-2deg) scale(.98); border-color: #d4e4f1; }
.hero-slide { position: absolute; inset: 0; height: 100%; width: 100%; margin: 0; border-radius: 14px 60px 14px 14px; opacity: 0; visibility: hidden; transform: translate3d(14px, -13px, 0) rotate(3deg) scale(.97); transform-origin: 55% 70%; pointer-events: none; transition: transform .85s cubic-bezier(.22,.75,.2,1), opacity .65s ease, visibility .85s; z-index: 0; }
.hero-slide.is-third { opacity: 1; visibility: visible; transform: translate3d(-5px, -17px, 0) rotate(-2deg) scale(.98); z-index: 1; }
.hero-slide.is-next { opacity: 1; visibility: visible; transform: translate3d(9px, -10px, 0) rotate(2.1deg) scale(.985); z-index: 2; }
.hero-slide.is-active { opacity: 1; visibility: visible; transform: translate3d(0, 0, 0) rotate(0) scale(1); z-index: 3; box-shadow: 0 16px 35px -22px #143e6a65; }
.hero-slide img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(1.035); }
.hero-slide img:not([src]) { visibility: hidden; }
.hero-slide:first-of-type img { object-position: 42% center; }
.hero-slide figcaption { bottom: 30px; left: 30px; right: 25px; }
.hero-slide figcaption > span:last-child { font-size: clamp(23px, 2vw, 29px); line-height: 1.2; max-width: 18ch; }
.hero-slide .photo-label { font-size: 11px; line-height: 1.6; }
.hero-carousel .trade-stamp { z-index: 4; top: 48px; left: -8px; padding: 16px 21px; }
.hero-carousel .trade-stamp strong { font-size: 13px; }
.hero-carousel .trade-stamp span { font-size: 11px; }
.hero-controls { order: 2; display: flex; visibility: hidden; align-items: center; gap: 13px; min-height: 70px; border-bottom: 1px solid #dce5ef; }
.hero-carousel[data-ready="true"] .hero-controls { visibility: visible; }
.hero-controls button { border: 0; background: transparent; color: var(--ink); font: inherit; cursor: pointer; min-height: 44px; transition: background .2s, color .2s, transform .2s; }
.hero-playback { display: inline-flex; align-items: center; gap: 7px; padding: 0 7px 0 0; font-size: 11px !important; min-width: 65px; }
.hero-playback svg { width: 15px; height: 15px; }
.hero-playback .play-symbol { display: none; }
[data-user-paused="true"] .hero-playback .play-symbol { display: block; }
[data-user-paused="true"] .hero-playback .pause-symbol { display: none; }
.hero-dots { display: flex; align-items: center; gap: 0; }
.hero-dot { width: 27px; display: grid; place-items: center; padding: 0; }
.hero-dot > span { display: block; width: 6px; height: 6px; background: #8fa9c0; border-radius: 20px; transition: width .35s ease, background .35s ease; }
.hero-dot[aria-pressed="true"] > span { width: 21px; background: var(--blue); }
.hero-counter { margin-left: auto; font-size: 11px; letter-spacing: .08em; color: #60788f; white-space: nowrap; }
.hero-counter > span { color: var(--ink); font-weight: 650; }
.hero-arrows { display: flex; gap: 5px; }
.hero-arrows > button { display: grid; place-items: center; width: 42px; border: 1px solid #dce5ef; border-radius: 50%; }
.hero-arrows .icon { width: 18px; height: 18px; }
[data-hero-previous] .icon { transform: rotate(180deg); }
.hero-controls button:hover { color: var(--blue); }
.hero-arrows > button:hover { background: #edf5fc; border-color: #a8cae5; }
.hero-controls button:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; border-radius: 5px; }
.hero-carousel .hero-facts { order: 3; padding-top: 20px; }
.hero-facts strong { font-size: 35px; }
.hero-facts p { font-size: 12px; }
.hero-facts > a { font-size: 12px; }
.hero-slide.is-active > img { animation: card-image-drift 4s ease-out both; }
.hero-carousel:not([data-playing="true"]) .hero-slide.is-active > img { animation-play-state: paused; }
@keyframes card-image-drift { from { transform: scale(1); } to { transform: scale(1.035); } }

/* Native page navigation keeps history, anchor links and form behavior intact. */
@view-transition { navigation: auto; }
.site-header { view-transition-name: site-header; }
.utility { view-transition-name: utility-bar; }
::view-transition-group(root) { animation: none; }
::view-transition-old(root) { animation: page-leave .18s ease-in both; }
::view-transition-new(root) { animation: page-arrive .32s cubic-bezier(.2,.7,.3,1) both; }
::view-transition-group(site-header), ::view-transition-group(utility-bar) { animation: none; }
::view-transition-old(site-header), ::view-transition-new(site-header),
::view-transition-old(utility-bar), ::view-transition-new(utility-bar) { animation: none; mix-blend-mode: normal; }
@keyframes page-leave { to { opacity: 0; transform: translateY(-6px); } }
@keyframes page-arrive { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.page-intro > .eyebrow, .page-intro > h1, .page-intro > p:last-child { animation: section-arrive .5s cubic-bezier(.2,.7,.3,1) both; }
.page-intro > p:last-child { animation-delay: 65ms; }
@keyframes section-arrive { from { opacity: .4; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.reveal-ready { transform: translateY(18px); transition-duration: .6s; transition-timing-function: cubic-bezier(.2,.7,.3,1); }
.reveal-ready.is-visible, .reveal-ready:focus-within { transform: none; }
html { scroll-padding-top: 28px; }

@media (max-width: 1150px) {
  .hero-stage { height: 405px; }
  .hero-controls { gap: 7px; }
  .hero-dot { width: 24px; }
  .hero-arrows { gap: 4px; }
  .hero-arrows > button { width: 38px; min-height: 40px; }
  .hero-playback { min-width: 57px; font-size: 10px !important; }
  .hero-facts { gap: 13px; }
  .hero-facts p, .hero-facts > a { font-size: 10px; }
  .hero-slide figcaption { left: 24px; }
  .hero-slide figcaption > span:last-child { font-size: 26px; }
}
@media (max-width: 950px) and (min-width: 761px) {
  .hero-carousel { padding-inline: 4px; }
  .hero-stage { height: 360px; }
  .hero-carousel .trade-stamp { left: -8px; padding: 13px; }
  .hero-carousel .trade-stamp strong { font-size: 11px; }
  .hero-carousel .trade-stamp span { font-size: 10px; }
  .hero-slide figcaption > span:last-child { font-size: 23px; }
  .hero-slide .photo-label { font-size: 9px; }
  .hero-counter { display: none; }
  .hero-arrows { margin-left: auto; }
  .hero-controls { gap: 4px; }
  .hero-facts { gap: 11px; }
  .hero-facts p, .hero-facts > a { font-size: 9px; }
}
@media (max-width: 760px) {
  .hero-carousel { padding: 22px 10px 0 8px; margin-top: 5px; }
  .hero-stage { height: auto; aspect-ratio: 1.12; }
  .hero-slide { aspect-ratio: auto; border-top-right-radius: 48px; }
  .hero-slide figcaption { left: 22px; bottom: 25px; }
  .hero-slide figcaption > span:last-child { font-size: clamp(24px, 5vw, 31px); max-width: 18ch; }
  .hero-slide .photo-label { font-size: 10px; }
  .hero-carousel .trade-stamp { left: -6px; top: 44px; padding: 14px 17px; }
  .hero-carousel .trade-stamp strong { font-size: 12px; }
  .hero-carousel .trade-stamp span { font-size: 10px; }
  .hero-controls { gap: 7px; min-height: 68px; }
  .hero-playback { min-width: 61px; font-size: 11px !important; }
  .hero-dot { width: 25px; }
  .hero-counter { font-size: 10px; }
  .hero-arrows > button { width: 40px; min-height: 44px; }
  .hero-facts strong { font-size: 33px; }
  .hero-facts p, .hero-facts > a { font-size: 10px; }
  .hero-facts { gap: 12px; }
}
@media (max-width: 400px) {
  .hero-counter { display: none; }
  .hero-arrows { margin-left: auto; }
  .hero-controls { gap: 4px; }
  .hero-dot { width: 24px; }
  .hero-slide figcaption > span:last-child { font-size: 25px; }
  .hero-facts p, .hero-facts > a { font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  ::view-transition-old(*), ::view-transition-new(*), ::view-transition-group(*) { animation: none !important; }
  .hero-playback { display: none; }
  .hero-slide, .hero-slide > img, .hero-dot > span, .page-intro > *, .reveal-ready { animation: none !important; transition: none !important; }
  .hero-slide > img { transform: none; }
}
@media print {
  .hero-controls, .hero-backplate, .hero-slide:not(.is-active) { display: none !important; }
  .hero-slide.is-active { position: relative; transform: none; }
  .hero-slide > img { animation: none !important; transform: none !important; }
}
