/* Home header slider. The track is a native scroll-snap row, so it swipes and shows its first slide with no script at all;
   slider.js only adds dots, arrow keys, mouse drag and a gentle auto-advance. The box has a fixed ratio: nothing jumps. */
.hs{padding:12px 0 4px}
.hs-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:var(--r-lg);background:var(--navy-900);outline-offset:3px}
.hs-track::-webkit-scrollbar{display:none}
.hs-track.dragging{scroll-snap-type:none;cursor:grabbing}
.hs-track.jumping{scroll-snap-type:none}
.hs-slide{position:relative;flex:0 0 100%;scroll-snap-align:start;height:300px;overflow:hidden;color:#fff;display:block;-webkit-user-drag:none}
.hs-media{position:absolute;inset:0;display:grid;place-items:center;background:radial-gradient(120% 100% at 50% 100%,#1B3562,var(--navy-900) 70%)}
.hs-media img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
/* The banner: the device large at the bottom corner, at most five pieces of text, one button, on one of three brand grounds
   (or a scene picture). Phone: 300px high, the device 230px. Wide screen: 16:7, the device beside the words. */
.hs-light{color:var(--navy);background:radial-gradient(rgba(31,42,75,.1) 1.1px,transparent 1.5px) 0 0/18px 18px,linear-gradient(135deg,#eef9f5,#f7fbfa 50%,#e3f6f0)}
.hs-navy{background:linear-gradient(135deg,#1F2A4B,#1d3a66)}
.hs-green{background:linear-gradient(135deg,#0f3d33,#176b5a)}
.hs-photo .hs-media::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(31,42,75,.9),rgba(31,42,75,.15) 70%)}
.hs-art{position:absolute;inset-inline-end:0;bottom:0;width:230px;height:230px;display:grid;place-items:end center;padding:0 12px 14px;pointer-events:none}
.hs-art img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 14px 18px rgba(31,42,75,.2))}
.hs-art .hs-ico{width:150px;height:150px;filter:none;opacity:.95}
.hs-light .hs-art .hs-ico{opacity:1}
.hs-badge{position:absolute;top:14px;inset-inline-end:14px;font-size:var(--fs-small);font-weight:600;padding:3px 10px;border-radius:999px;background:rgba(255,255,255,.16);color:#fff}
.hs-light .hs-badge{background:var(--navy);color:#fff}
.hs-text{position:absolute;inset-inline:0;top:0;bottom:0;display:grid;gap:4px;justify-items:start;align-content:end;padding:44px 16px 16px;max-width:100%}
.hs-text>*{max-width:min(62%,560px)}
.hs-full .hs-text>*{max-width:100%}
.hs-photo .hs-art img{filter:drop-shadow(0 14px 18px rgba(0,0,0,.35))}
@media (max-width:859px){.hs-photo:not(.hs-full) .hs-art{width:180px;height:190px}}
.hs-text small{font-size:var(--fs-small);font-weight:600;letter-spacing:.3px;opacity:.85}
.hs-light .hs-text small{color:var(--teal-700);opacity:1}
.hs-text b{font-size:var(--fs-h1);line-height:1.3;font-weight:700}
.hs-text b i{display:block;font-style:normal;color:var(--teal)}
.hs-light .hs-text b i{color:var(--teal-700)}
.hs-green .hs-text b i{color:#BFF0E3}
.hs-desc{font-size:var(--fs-small);line-height:1.5;opacity:.9}
.hs-price{display:flex;align-items:baseline;gap:5px;line-height:1}
.hs-price bdi{font-size:var(--fs-price-hero);font-weight:700}
.hs-price span{font-size:var(--fs-small);font-weight:600;opacity:.8}
.hs-text em{display:inline-flex;align-items:center;gap:6px;font-style:normal;font-size:var(--fs-small);font-weight:600;min-height:40px;padding:0 16px;border-radius:13px;margin-top:6px;background:var(--teal);color:var(--navy)}
.hs-light .hs-text em{background:var(--navy);color:#fff}
.hs-green .hs-text em{background:#fff;color:var(--teal-700)}
.hs-text em .ico{width:16px;height:16px}
.hs-dots{display:flex;justify-content:center;gap:4px;padding-top:6px}
.hs-dots button{width:28px;height:28px;border:0;background:none;padding:0;display:grid;place-items:center;cursor:pointer}
.hs-dots button::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--line-strong);transition:width .2s,background .2s}
.hs-dots button[aria-current="true"]::before{width:20px;border-radius:6px;background:var(--navy)}
@media (max-width:340px){.hs-art{width:170px;height:170px}.hs-text b{font-size:var(--fs-h2)}.hs-price bdi{font-size:var(--fs-price-card)}}
@media (min-width:860px){.hs-slide{height:auto;aspect-ratio:16/7;max-height:460px}.hs-text{padding:56px 44px 36px;align-content:center;gap:8px}.hs-text b{font-size:var(--fs-h1)}.hs-desc{font-size:var(--fs-body)}.hs-price bdi{font-size:var(--fs-price-hero)}
  .hs-art{width:44%;height:100%;padding:28px 40px}.hs-art{place-items:center}.hs-art .hs-ico{width:220px;height:220px}.hs-badge{top:24px;inset-inline-end:28px;font-size:var(--fs-small)}}
@media (prefers-reduced-motion:reduce){.hs-dots button::before{transition:none}}
