/* Homepage campaign and continuous card rails. */
.campaign-hero{background:#041321;height:clamp(680px,56.25vw,960px);min-height:680px;max-height:none}
.hero-slides{position:absolute;inset:0;overflow:hidden;touch-action:pan-y}
.hero-slide{position:absolute;inset:0;transform:translateX(100%);visibility:hidden;transition:transform .85s cubic-bezier(.22,.7,.2,1);background:#041321}
.hero-slide.is-active{transform:translateX(0);visibility:visible;z-index:1}
.hero-slide.is-leaving{transform:translateX(-100%);visibility:visible}
.campaign-hero .hero-content{padding-top:clamp(200px,18vw,330px)}
.campaign-hero :is(h1,h2){font-size:clamp(44px,4.35vw,72px);font-weight:400;line-height:1.04;letter-spacing:-.045em;max-width:770px}
.campaign-hero .hero-content p{font-size:19px;line-height:1.5;max-width:490px;margin:28px 0 32px}
.hero-slide--cny .hero-shade{background:linear-gradient(90deg,rgba(13,16,17,.78),rgba(13,16,17,.48) 37%,transparent 70%),linear-gradient(180deg,#0008,transparent 28%,transparent 78%,#000b)}
.hero-slide--cny .hero-content{padding-top:clamp(180px,15vw,280px)}
.campaign-eyebrow{display:block;color:#f4d6a6;font-size:15px;letter-spacing:.025em;margin-bottom:24px}
.hero-slide--cny .hero-content h2{max-width:640px}
.hero-slide--cny .hero-content p{color:#f5eee5;max-width:430px}
.campaign-cta{display:inline-flex;align-items:center;gap:24px;background:#f7e6c9;color:#251b12}
.campaign-cta:hover{background:#fff2df}
.hero-slider-controls{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;padding:5px 10px;border:1px solid #ffffff33;border-radius:99px;background:#07131abf;backdrop-filter:blur(16px);z-index:3}
.hero-slider-controls button,.rail-controls>button{background:transparent;color:#fff;min-width:40px;min-height:40px;border-radius:50%;display:grid;place-items:center}
.hero-slider-controls button:hover,.rail-controls>button:hover{background:#ffffff18}
.hero-slider-controls .slider-arrow{font-size:28px}
.hero-slider-controls .slider-pause{font-size:16px}
.hero-slider-dots{display:flex;align-items:center;gap:2px}
.hero-slider-dots button{position:relative;min-width:30px}
.hero-slider-dots button::after{content:'';width:7px;height:7px;border-radius:20px;background:#ffffff60;transition:width .3s,background .3s}
.hero-slider-dots button[aria-current=true]::after{width:24px;background:#fff}
.slider-divider{height:18px;width:1px;background:#ffffff30;margin-inline:3px}
.rail-controls{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:20px}
.rail-controls .dots{margin:0;gap:2px}
.rail-controls .dots button{width:24px;height:40px;background:transparent;position:relative}
.rail-controls .dots button::after{content:'';position:absolute;left:9px;top:17px;width:6px;height:6px;border-radius:50%;background:#686b72}
.rail-controls .dots button[aria-current=true]::after{background:#fff;transform:scale(1.35)}
.product-carousel,.feature-window{overflow:hidden!important;scroll-snap-type:none;touch-action:pan-y}
.product-track,.feature-track{transition:none;will-change:transform;justify-content:flex-start}
.product-track{width:max-content;min-width:100%;padding-inline:32px}
.product-card.featured{margin-inline:0;transform:none}
.product-card{transition:transform .4s;flex-shrink:0}
.feature-track{width:max-content}
.feature-controls.rail-controls{max-width:none}
.rail-controls button:focus-visible,.hero-slider-controls button:focus-visible{outline:2px solid #6ad7ff;outline-offset:3px}
@media(min-width:1051px){.product-track{padding-inline:max(32px,calc((100vw - 1760px)/2))}.product-card{flex-basis:min(calc((100vw - 152px)/5),328px);width:min(calc((100vw - 152px)/5),328px)}}
@media(max-width:950px){
 .campaign-hero{height:clamp(820px,145vw,1200px);min-height:820px;max-height:1200px}
 .campaign-hero .hero-content,.hero-slide--cny .hero-content{padding-top:135px;text-align:center}
 .campaign-hero :is(h1,h2){font-size:clamp(40px,6.3vw,62px);max-width:650px;margin-inline:auto}
 .campaign-hero .hero-content p{font-size:17px;max-width:440px;margin:24px auto 28px}
 .campaign-eyebrow{margin-bottom:18px;font-size:14px}
 .hero-slide--cny .hero-shade{background:linear-gradient(180deg,#050d16e6,#050d1680 33%,transparent 54%,transparent 82%,#000b)}
 .campaign-hero .hero-video{object-position:center}
}
@media(max-width:600px){
 .campaign-hero{height:max(840px,100svh);min-height:840px;max-height:none}
 .campaign-hero .hero-content,.hero-slide--cny .hero-content{padding-top:126px}
 .campaign-hero :is(h1,h2){font-size:42px;line-height:1.06}
 .campaign-hero .hero-content p{font-size:16px;max-width:335px;margin:20px auto 24px}
 .hero-slide--cny .hero-content p{max-width:320px}
 .hero-slider-controls{bottom:24px}
 .product-track{padding-inline:20px}
 .feature-track{transform:none}
 .feature-card{flex:0 0 min(82vw,350px)}
}
@media(prefers-reduced-motion:reduce){.hero-slide,.hero-slider-dots button::after{transition:none}}

@media(max-width:360px){.campaign-hero :is(h1,h2){font-size:35px}.campaign-hero .hero-content,.hero-slide--cny .hero-content{padding-top:116px}}

/* Christmas campaign and quieter hero navigation. */
.hero-slide--christmas .hero-content{padding-top:clamp(180px,15vw,280px)}
.hero-slide--christmas .hero-shade{background:linear-gradient(90deg,#081b38bf,#102e5266 42%,transparent 72%),linear-gradient(180deg,#06142788,transparent 30%,transparent 78%,#04132499)}
.hero-slide--christmas .campaign-eyebrow{color:#e5e5e5}
.hero-slide--christmas h2{max-width:650px}
.hero-slide--christmas .hero-content p{max-width:430px;color:#f4f4f4}
.hero-slide--christmas .campaign-cta{background:#edf5ff;color:#292929}
.hero-slide--christmas .campaign-cta:hover{background:#fff}
.hero-slider-controls{bottom:26px;gap:4px;padding:2px 7px;border-color:#ffffff24;background:#07131a88}
.hero-slider-controls button{min-height:30px;min-width:30px}
.hero-slider-controls .slider-pause{font-size:12px}
.hero-slider-dots{gap:0}
.hero-slider-dots button{min-width:24px}
.hero-slider-dots button::after{width:5px;height:5px}
.hero-slider-dots button[aria-current=true]::after{width:18px}
.hero-slider-controls .slider-divider{height:12px;margin-inline:3px}
.hero-side-arrow{position:absolute;z-index:3;top:50%;transform:translateY(-50%);width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:#06132420;color:#ffffffb3;transition:background .2s,color .2s}
.hero-side-arrow--prev{left:12px}.hero-side-arrow--next{right:12px}
.hero-side-arrow svg{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 3px #0009)}
.hero-side-arrow:hover{background:#06132477;color:#fff}
.hero-side-arrow:focus-visible{outline:2px solid #b7e3ff;outline-offset:2px;background:#061324aa;color:#fff}
@media(max-width:950px){
 .hero-slide--christmas .hero-content{padding-top:135px}
 .hero-slide--christmas .hero-shade{background:linear-gradient(180deg,#081a36c9,#102c5077 35%,transparent 58%,transparent 84%,#06142788)}
 .hero-side-arrow{top:57%;background:#06132418}
 .hero-side-arrow--prev{left:4px}.hero-side-arrow--next{right:4px}
}
@media(max-width:600px){.hero-slide--christmas .hero-content{padding-top:126px}.hero-slide--christmas .hero-content p{max-width:320px}.hero-slider-controls{bottom:22px}.hero-side-arrow svg{width:16px;height:16px}}
@media(max-width:360px){.hero-slide--christmas .hero-content{padding-top:116px}}

/* The tile-chain render reserves its left side / portrait top for copy. */
.hero-slide--markets .hero-shade{background:linear-gradient(180deg,#02091466,transparent 25%,transparent 80%,#0008)}
.hero-slide--markets .hero-content p{color:#e3e3e3}
@media(max-width:950px){.hero-slide--markets .hero-shade{background:linear-gradient(180deg,#02091433,transparent 35%,transparent 86%,#0008)}}

/* One explicit control pauses both banner rotation and decorative video. */
.hero-motion-control{position:absolute;z-index:4;top:calc(50% + 34px);right:12px;width:44px;height:44px;display:grid;place-items:center;border:1px solid #c4c4c466;border-radius:50%;background:#07131acc;color:#f7f7f8;font-size:18px;line-height:1}
.hero-motion-control[hidden]{display:none}
.hero-motion-control:hover{background:#18374a}
.hero-motion-control:focus-visible{outline:3px solid #b7e3ff;outline-offset:4px}
@media(max-width:950px){.hero-motion-control{top:calc(57% + 34px);right:4px}}
/* Empty video must not cover the responsive poster when scripts/motion are off. */
.hero-opening-poster+video:not([src]){visibility:hidden}

/* Author display rules must respect inactive single-banner navigation. */
.hero-side-arrow[hidden]{display:none}

/* A quiet path to the published offer, alongside the primary account action. */
.campaign-hero .hero-offer{max-width:420px;margin-top:16px}
.campaign-hero .hero-offer a{display:inline-flex;align-items:center;gap:12px;min-height:44px;color:#e3e3e3;font-size:15px;line-height:1.4;text-decoration:underline;text-underline-offset:5px}
.campaign-hero .hero-offer a:hover{color:#fff}
.campaign-hero .hero-offer a:focus-visible{outline:2px solid #81d6ff;outline-offset:5px;border-radius:3px}
.campaign-hero .hero-offer p{margin:2px 0 0;font-size:12px;line-height:1.5;color:#c6c6c6;max-width:390px}
@media(max-width:950px){.campaign-hero .hero-offer{margin:12px auto 0;max-width:350px}.campaign-hero .hero-offer p{margin:2px auto 0}}
