/* Homepage hero only: never change global card, container, or typography tokens. */
body.page-home-body .page-home {padding-top:var(--header-h)}
body.page-home-body .page-home > #banner.banner {
  width:100%;max-width:none;margin:0 0 18px;border-radius:0;
  height:clamp(320px,26.3vw,520px);isolation:isolate;
}
body.page-home-body #banner .banner__item {position:absolute;inset:0}
body.page-home-body #banner .banner__bg {width:100%;height:100%;object-fit:cover;object-position:center}
body.page-home-body #banner .banner__mask {
  background:linear-gradient(90deg,rgba(4,12,24,.86),rgba(4,12,24,.65) 28%,rgba(4,12,24,.12) 65%,rgba(4,12,24,.02)),linear-gradient(0deg,rgba(4,12,24,.38),transparent 55%);
}
body.page-home-body #banner .banner__content {
  left:max(64px,calc((100% - 1680px)/2));width:min(560px,calc(100% - 128px));color:#fff;
}
body.page-home-body #banner .banner__title {color:#fff;font-size:clamp(30px,2.65vw,50px);line-height:1.18;text-shadow:0 2px 14px rgba(0,0,0,.35)}
body.page-home-body #banner .banner__meta {color:#e0e7f0}
body.page-home-body #banner .banner__desc {color:#d9e2ed;max-width:560px;-webkit-line-clamp:2}
body.page-home-body #banner .banner__actions .btn--ghost {color:#fff;background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.25)}
body.page-home-body #banner .banner__arrow {visibility:visible;opacity:1;pointer-events:auto;width:48px;height:48px;color:#fff;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(8px)}
body.page-home-body #banner .banner__arrow--prev {left:24px}
body.page-home-body #banner .banner__arrow--next {right:24px}
body.page-home-body #banner .banner__dots {left:auto;right:max(64px,calc((100% - 1680px)/2));bottom:18px;transform:none}
@media(max-width:1100px){
 body.page-home-body .page-home > #banner.banner{height:clamp(300px,37vw,430px)}
 body.page-home-body #banner .banner__content{left:64px;width:min(520px,calc(100% - 128px))}
}
@media(max-width:600px){
 body.page-home-body .page-home > #banner.banner{height:360px}
 body.page-home-body #banner .banner__content{left:24px;width:calc(100% - 48px)}
 body.page-home-body #banner .banner__arrow{width:32px;height:32px;top:auto;bottom:12px;transform:none}
 body.page-home-body #banner .banner__arrow--prev{left:24px}
 body.page-home-body #banner .banner__arrow--next{right:24px}
 body.page-home-body #banner .banner__dots{right:50%;transform:translateX(50%);bottom:22px}
}