/* A calm three-scene hero, sharing the portal's existing card layout. */
.hero-card.hero-carousel { height: 390px; touch-action: pan-y pinch-zoom; transition: background-color .35s ease; }
.hero-carousel[data-slide="1"] { background: #f0f1df; }
.hero-carousel[data-slide="2"] { background: #f6ece3; }
.hero-carousel .hero-copy { padding-top: 30px; padding-bottom: 65px; }
.hero-carousel .hero-copy h2 { margin-top: 14px; font-size: clamp(30px, 3.1vw, 40px); line-height: 1.13; }
.hero-carousel .hero-copy > p { min-height: 41px; margin-top: 12px; font-size: 12px; line-height: 1.75; }
.hero-carousel .hero-copy > .button { margin-top: 18px; }
.hero-carousel .hero-note { margin-top: 8px; }
.hero-carousel .hero-art > img { bottom: 56px; right: -17px; width: 110%; }
.hero-carousel .hero-stamp { bottom: 64px; }
.hero-carousel[data-slide="1"] .hero-art::before { background: #e5e7cc; }
.hero-carousel[data-slide="2"] .hero-art::before { background: #efdecf; }
.hero-carousel[data-slide="1"] .hero-art > img,
.hero-carousel[data-slide="2"] .hero-art > img { width: 111%; right: -11px; bottom: 62px; }
.hero-carousel .hero-copy, .hero-carousel .hero-art { transition: opacity .14s ease, transform .14s ease; }
.hero-carousel.is-changing .hero-copy, .hero-carousel.is-changing .hero-art { opacity: 0; transform: translateY(4px); }
.hero-carousel-controls { position: absolute; z-index: 6; bottom: 13px; left: 30px; display: flex; align-items: center; }
.hero-carousel-dots { display: flex; align-items: center; gap: 4px; }
.hero-carousel-dot { display: flex; align-items: center; justify-content: center; width: 28px; height: 40px; padding: 0; border-radius: 10px; background: transparent; }
.hero-carousel-dot::before { content: ""; display: block; width: 6px; height: 6px; border-radius: 8px; background: #a8b9d3; transition: width .2s ease, background-color .2s ease; }
.hero-carousel-dot[aria-pressed="true"] { width: 35px; }
.hero-carousel-dot[aria-pressed="true"]::before { width: 24px; background: var(--blue); }
.hero-carousel-dot:hover::before { background: var(--blue); }
.hero-carousel-controls button:focus-visible { outline-offset: 2px; }
@media (max-width: 1180px) and (min-width: 761px) {
  .hero-card.hero-carousel { height: 380px; }
  .hero-carousel .hero-copy { width: 62%; padding-top: 28px; }
  .hero-carousel .hero-copy h2 { font-size: clamp(28px, 3.2vw, 37px); }
  .hero-carousel .hero-art { width: 46%; }
  .hero-carousel .hero-art > img { width: 124%; right: -31px; bottom: 60px; }
  .hero-carousel[data-slide="1"] .hero-art > img,
  .hero-carousel[data-slide="2"] .hero-art > img { width: 119%; right: -24px; bottom: 72px; }
  .hero-carousel .hero-stamp { right: 12px; bottom: 65px; font-size: 8px; }
  .hero-carousel-controls { left: 23px; }
}
@media (max-width: 760px) {
  .hero-card.hero-carousel { height: 370px; }
  .hero-carousel .hero-copy { padding-top: 26px; }
  .hero-carousel .hero-copy h2 { font-size: 36px; }
  .hero-carousel .hero-art { width: 44%; }
  .hero-carousel .hero-art > img { right: -26px; bottom: 62px; width: 125%; }
  .hero-carousel[data-slide="1"] .hero-art > img,
  .hero-carousel[data-slide="2"] .hero-art > img { right: -18px; bottom: 67px; width: 121%; }
  .hero-carousel .hero-stamp { bottom: 64px; }
}
@media (max-width: 540px) {
  .hero-card.hero-carousel { height: 430px; }
  .hero-carousel .hero-copy { width: 91%; padding: 24px 0 65px 21px; }
  .hero-carousel .hero-copy h2 { font-size: 32px; line-height: 1.14; letter-spacing: -1.2px; }
  .hero-carousel .hero-copy > p { max-width: 265px; min-height: 42px; font-size: 12px; line-height: 1.75; }
  .hero-carousel .hero-copy > .button { max-width: 215px; margin-top: 19px; }
  .hero-carousel .hero-note { max-width: 170px; font-size: 9px; line-height: 1.75; }
  .hero-carousel .hero-art { top: 178px; width: 53%; right: -6px; }
  .hero-carousel .hero-art > img { width: 145%; bottom: 62px; right: -37px; }
  .hero-carousel[data-slide="1"] .hero-art > img,
  .hero-carousel[data-slide="2"] .hero-art > img { width: 139%; right: -29px; bottom: 78px; }
  .hero-carousel .hero-art::before { top: 0; }
  .hero-carousel .hero-stamp { right: 12px; bottom: 66px; max-width: 187px; gap: 4px; padding: 7px; font-size: 9px; }
  .hero-carousel .hero-stamp strong { font-size: 8px; }
  .hero-carousel-controls { bottom: 10px; left: 17px; }
}
@media (max-width: 360px) {
  .hero-carousel .hero-copy { padding-left: 18px; }
  .hero-carousel .hero-copy h2 { font-size: 29px; }
  .hero-carousel .hero-copy > p { max-width: 238px; font-size: 11px; }
  .hero-carousel .hero-note { max-width: 145px; }
  .hero-carousel .hero-label { font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-carousel, .hero-carousel .hero-copy, .hero-carousel .hero-art,
  .hero-carousel-dot::before { transition: none; }
}