/* Satopia homepage hero slider — Apple-TV-style full-bleed video carousel.
   First pass built by Code (Emma, 2026-08-31); Design iterates on the overlay
   content and icons. Markup ships via vc_raw_html on the homepage only. */

.sat-hs{position:relative;height:100vh;min-height:560px;background:#101513;color:#F6F4EF}
.sat-hs__track{display:flex;height:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.sat-hs__track::-webkit-scrollbar{display:none}
.sat-hs__slide{position:relative;flex:0 0 100%;height:100%;scroll-snap-align:start;scroll-snap-stop:always;overflow:hidden}
.sat-hs__slide video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* legibility scrim — bottom-left weighted, like the reference */
.sat-hs__slide::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to top, rgba(10,14,12,.62) 0%, rgba(10,14,12,.25) 30%, rgba(10,14,12,0) 58%),
             linear-gradient(100deg, rgba(10,14,12,.38) 0%, rgba(10,14,12,0) 45%)}

.sat-hs__info{position:absolute;left:6%;bottom:10%;z-index:2;max-width:600px;opacity:0;transform:translateY(26px);transition:opacity .25s ease,transform .25s ease}
.sat-hs__slide.is-active .sat-hs__info{opacity:1;transform:none;transition:opacity .55s ease .15s,transform .55s ease .15s}
.sat-hs .sat-hs__lockup{display:block;width:auto;max-width:min(430px,60vw);max-height:180px;margin:0 0 64px !important}
.sat-hs .sat-hs__lockup--text{font-size:clamp(34px,4.6vw,58px);font-weight:300;letter-spacing:.14em;text-transform:uppercase;line-height:1.1;margin:0 0 56px !important;color:#F6F4EF}
.sat-hs__meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;font-size:12px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;opacity:.92}
.sat-hs__meta .mdot{opacity:.55}
.sat-hs__intro{margin:12px 0 0;font-size:18px;line-height:1.55;max-width:46ch;color:rgba(246,244,239,.94)}
.sat-hs__actions{display:flex;align-items:center;gap:12px;margin-top:24px}
.sat-hs__cta{display:inline-block;background:#F6F4EF;color:#1A2C24 !important;border-radius:999px;padding:15px 28px;font-size:11.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;line-height:1;transition:background .2s ease,transform .2s ease}
.sat-hs__cta:hover{background:#fff;transform:translateY(-1px)}
.sat-hs__adv{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;border:1px solid rgba(246,244,239,.55);background:rgba(16,21,19,.25);color:#F6F4EF;cursor:pointer;transition:background .2s ease,border-color .2s ease;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.sat-hs__adv:hover{background:rgba(246,244,239,.16);border-color:#F6F4EF}
.sat-hs__adv svg{display:block}

.sat-hs__dots{position:absolute;left:50%;bottom:46px;transform:translateX(-50%);z-index:3;display:flex;gap:9px}
.sat-hs__dot{width:7px;height:7px;border-radius:50%;background:rgba(246,244,239,.38);border:0;padding:0;cursor:pointer;transition:background .25s ease,transform .25s ease}
.sat-hs__dot.on{background:#F6F4EF;transform:scale(1.25)}

@media (max-width:690px){
  .sat-hs{min-height:520px}
  .sat-hs__info{left:7%;right:7%;bottom:13%;max-width:none}
  .sat-hs .sat-hs__lockup{max-width:72vw;max-height:132px;margin-bottom:40px !important}
  .sat-hs__meta{font-size:8.5px;letter-spacing:.05em;gap:4px 8px;flex-wrap:nowrap;white-space:nowrap}
  .sat-hs__intro{font-size:15.5px}
  .sat-hs__cta{padding:13px 22px;font-size:10.5px}
  .sat-hs__adv{width:40px;height:40px}
  .sat-hs__dots{bottom:32px}
}
@media (prefers-reduced-motion: reduce){
  .sat-hs__track{scroll-behavior:auto}
}

@media (prefers-reduced-motion: reduce){
  .sat-hs__info{opacity:1 !important;transform:none !important;transition:none !important}
}

/* ---- merged story strip: Privé destinations + hosted experiences, one row,
        drifting across the page (pause on touch/hover), manual scroll welcome ---- */
.sat-st{padding:40px 0 90px}
.sat-st__track{display:flex;gap:26px;overflow-x:auto;padding:0 18px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.sat-st__track::-webkit-scrollbar{display:none}
.sat-st__card{flex:0 0 calc(100vw/4.5 - 26px);text-decoration:none}
.sat-st__label{position:relative;display:inline-block;font-size:12px;letter-spacing:.16em;font-weight:600;color:#2C3A39;text-transform:uppercase;padding-bottom:2px;margin:0 0 12px}
.sat-st__label::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(44,58,57,.4);transform-origin:left}
.sat-st__card:hover .sat-st__label::after{animation:st-redraw .55s cubic-bezier(.22,1,.36,1)}
@keyframes st-redraw{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion: reduce){.sat-st__card:hover .sat-st__label::after{animation:none}}
.sat-st__card video{width:100%;aspect-ratio:9/16;object-fit:cover;display:block;border-radius:12px;background:#101513}
@media (max-width:690px){
  .sat-st{padding:54px 0 64px}
  .sat-st__card{flex:0 0 86vw;scroll-snap-align:center}
  .sat-st__track{gap:14px;padding:0 7vw;scroll-snap-type:x mandatory}
}

/* strip arrows — the visible "you can slide this" mechanism */
.sat-st__nav{display:flex;justify-content:flex-end;gap:10px;padding:0 18px 24px}
.sat-st__btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:1.5px solid #2C3A39;background:transparent;color:#2C3A39;cursor:pointer;transition:background .2s ease,color .2s ease}
.sat-st__btn:hover{background:#2C3A39;color:#F6F4EF}
.sat-st__btn svg{display:block}
@media (max-width:690px){ .sat-st__nav{padding:0 6% 18px} .sat-st__btn{width:38px;height:38px} }

/* Elkemist wordmark is a wide single line — give it more width so its presence
   matches the stacked lockups */
.sat-hs .sat-hs__lockup[src*="lockup-elkemist"]{max-width:min(430px,60vw);max-height:160px}
.sat-hs .sat-hs__lockup[src*="lockup-prive"]{max-height:280px;max-width:min(430px,60vw)}
.sat-hs .sat-hs__lockup[src*="lockup-fm"]{max-width:min(480px,64vw)}