/* The copy grid reserves space for all four slides so rotation never moves the page. */
.hero-copy { min-width: 0; }
.hero-copy-stack { display: grid; min-width: 0; }
.hero-copy-slide { grid-area: 1 / 1; min-width: 0; opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity .65s ease, transform .65s ease, visibility .65s; }
.hero-copy-slide.is-active { opacity: 1; visibility: visible; transform: none; }
.hero-copy .hero-title > span { overflow-wrap: anywhere; }
.hero-slider .hero-visual { overflow: hidden; }
.hero-slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity .75s ease, visibility .75s; }
.hero-slide.is-active { opacity: 1; visibility: visible; }
.hero-slide > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-slider .hero-caption { right: 24px; bottom: 94px; min-width: 0; max-width: calc(100% - 48px); border-radius: 2px; }
.hero-controls { position: absolute; bottom: 22px; left: 24px; right: 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 7px 12px; background: rgba(12, 25, 43, .84); border: 1px solid rgba(255,255,255,.16); border-radius: 40px; color: #fff; backdrop-filter: blur(12px); }
.hero-controls[hidden] { display: none; }
.hero-dots, .hero-navigation { display: flex; align-items: center; gap: 4px; }
.hero-controls button { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; background: transparent; border: 0; border-radius: 50%; color: inherit; cursor: pointer; flex-shrink: 0; }
.hero-controls button:hover { background: rgba(255,255,255,.12); }
.hero-controls button:focus-visible { outline: 2px solid var(--yellow); outline-offset: 2px; }
.hero-dots button { width: 28px; }
.hero-dots span { width: 6px; height: 6px; background: rgba(255,255,255,.55); border-radius: 8px; transition: width .3s, background .3s; }
.hero-dots [aria-pressed="true"] span { width: 24px; background: var(--yellow); }
.hero-navigation .icon { width: 20px; height: 20px; }
[data-hero-prev] .icon { transform: rotate(180deg); }
.hero-counter { min-width: 55px; text-align: center; font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: .05em; }
[data-hero-toggle] { margin-left: 4px; border-left: 1px solid rgba(255,255,255,.2) !important; border-radius: 0 !important; font-size: 13px; }
.home-values { position: relative; background: var(--yellow); padding-bottom: 14px; }
.home-values .value-strip > div { font-size: 18px; font-weight: 650; line-height: 1.3; border-right-color: rgba(18,30,52,.17); }
@media(max-width:1100px) {
    .home-values .value-strip > div { font-size: 16px; }
}
@media(max-width:760px) {
    .home-hero.hero-slider .hero-visual { order: -1; }
    .hero-slider .hero-caption { right: 18px; bottom: 87px; max-width: calc(100% - 36px); }
    .hero-controls { left: 18px; right: 18px; bottom: 18px; padding: 5px 8px; gap: 8px; }
    .hero-controls button { width: 36px; height: 40px; }
    .hero-dots { gap: 0; }
    .hero-dots button { width: 26px; }
    .hero-navigation { gap: 0; }
    .hero-counter { min-width: 48px; font-size: 11px; }
    .home-values .value-strip > div { font-size: 14px; }
    .home-values .value-strip { padding-block: 24px; }
}
@media(max-width:360px) {
    .hero-controls { left: 12px; right: 12px; padding-inline: 6px; gap: 4px; }
    .hero-controls button { width: 32px; }
    .hero-dots button { width: 24px; }
}
@media(prefers-reduced-motion:reduce) {
    .hero-copy-slide, .hero-slide, .hero-dots span { transition: none; transform: none; }
}