@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Space+Grotesk:wght@400;500;600;700&display=swap');

/* ═══════════════════════════════════
   TOKENS
═══════════════════════════════════ */
:root {
  --navy:  #001F3F;
  --navy2: #001229;
  --gold:  #D4AF37;
  --goldb: #F5CF5A;
  --red:   #E63946;
  --green: #06D6A0;
  --white: #FFFFFF;
  --off:   #F0F2F6;
  --muted: #8896A4;
  --line:  #1E3350;
  --card:  #0A1E33;
  --h:     'Archivo Black', sans-serif;
  --b:     'Space Grotesk', sans-serif;
  --r:     16px;
}

/* ═══════════════════════════════════
   RESET
═══════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:hidden}
body{font-family:var(--b);background:var(--white);color:var(--navy);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
button{font-family:var(--b);cursor:pointer}
p{line-height:1.7}

/* ═══════════════════════════════════
   LOGO MARK
═══════════════════════════════════ */
.sc-logo {
  display:flex;align-items:center;gap:10px;
  font-family:var(--h);font-size:20px;
  color:#fff;letter-spacing:.02em;text-decoration:none;
}
.sc-logo-mark {
  width:34px;height:34px;border-radius:10px;flex-shrink:0;
  background:linear-gradient(135deg,var(--gold) 0%,#F5A623 100%);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 16px rgba(212,175,55,.4);
}
.sc-logo-mark svg { width:20px;height:20px; }
.sc-logo-text { color:#fff; }

/* ═══════════════════════════════════
   NAV
═══════════════════════════════════ */
.sc-nav {
  position:sticky;top:0;z-index:200;
  background:rgba(0,18,41,.95);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  height:60px;display:flex;align-items:center;
  justify-content:space-between;padding:0 20px;
  border-bottom:1px solid rgba(212,175,55,.12);
}
.sc-nav-right{display:flex;align-items:center;gap:8px}
.sc-nav-partner {
  padding:8px 16px;border-radius:99px;
  background:var(--gold);color:#000;
  font:700 12px var(--b);white-space:nowrap;
}
.sc-nav-hamburger {
  width:38px;height:38px;border-radius:10px;
  border:1.5px solid rgba(255,255,255,.15);
  background:transparent;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:4px;
}
.sc-nav-hamburger span {
  display:block;width:16px;height:1.5px;
  background:rgba(255,255,255,.7);border-radius:99px;
  transition:all .25s;
}
.sc-nav-hamburger.open span:nth-child(1){transform:rotate(45deg) translate(4px,4px)}
.sc-nav-hamburger.open span:nth-child(2){opacity:0;transform:translateX(-8px)}
.sc-nav-hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(4px,-4px)}

/* ═══════════════════════════════════
   DRAWER
═══════════════════════════════════ */
.sc-drawer{position:fixed;inset:0;z-index:300;pointer-events:none}
.sc-drawer-bg{position:absolute;inset:0;background:rgba(0,10,25,.7);opacity:0;transition:opacity .3s;backdrop-filter:blur(4px)}
.sc-drawer-panel{
  position:absolute;top:0;right:0;
  width:min(300px,85vw);height:100%;
  background:var(--navy2);
  padding:24px 20px;
  transform:translateX(100%);
  transition:transform .35s cubic-bezier(.16,1,.3,1);
  overflow-y:auto;
  border-left:1px solid var(--line);
}
.sc-drawer.open{pointer-events:all}
.sc-drawer.open .sc-drawer-bg{opacity:1}
.sc-drawer.open .sc-drawer-panel{transform:translateX(0)}
.sc-drawer-close{
  position:absolute;top:18px;right:18px;
  width:36px;height:36px;border-radius:50%;
  border:1.5px solid rgba(255,255,255,.12);
  background:transparent;color:rgba(255,255,255,.5);
  font-size:18px;display:flex;align-items:center;justify-content:center;
}
.sc-drawer-nav{margin-top:56px;display:flex;flex-direction:column;gap:2px}
.sc-drawer-nav a {
  padding:13px 14px;font-size:15px;font-weight:600;
  color:rgba(255,255,255,.6);border-radius:12px;
  display:flex;align-items:center;gap:10px;transition:all .15s;
}
.sc-drawer-nav a:hover,.sc-drawer-nav a.active{
  background:rgba(212,175,55,.08);color:#fff;
}
.sc-drawer-nav a .di{font-size:18px}
.sc-drawer-div{height:1px;background:var(--line);margin:14px 0}
.sc-drawer-ctas{display:flex;flex-direction:column;gap:8px}
.sc-btn-gold{
  padding:14px;border-radius:14px;
  background:var(--gold);color:#000;
  font:700 14px var(--b);text-align:center;
  display:block;border:none;cursor:pointer;
  transition:all .15s;
}
.sc-btn-gold:hover{background:var(--goldb)}
.sc-btn-outline-white{
  padding:13px;border-radius:14px;
  border:1.5px solid rgba(255,255,255,.15);
  color:rgba(255,255,255,.7);
  font:700 14px var(--b);text-align:center;
  display:block;background:transparent;cursor:pointer;
  transition:all .15s;
}
.sc-btn-outline-white:hover{border-color:rgba(255,255,255,.4);color:#fff}

/* ═══════════════════════════════════
   TICKER
═══════════════════════════════════ */
.sc-ticker{
  background:var(--navy2);padding:9px 0;
  overflow:hidden;border-bottom:1px solid var(--line);
}
.sc-ticker-inner{
  display:flex;gap:0;white-space:nowrap;
  animation:ticker 30s linear infinite;
}
.sc-ticker-inner:hover{animation-play-state:paused}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.sc-ti{
  display:inline-flex;align-items:center;gap:8px;
  padding:0 22px;font-size:11px;font-weight:700;
  color:rgba(255,255,255,.3);flex-shrink:0;letter-spacing:.04em;
}
.sc-ti-val{color:rgba(255,255,255,.7);font-family:monospace}
.sc-ti-up{color:var(--green);font-size:10px}
.sc-ti-dn{color:var(--red);font-size:10px}
.sc-ti-sep{color:rgba(255,255,255,.08);font-size:16px}

/* ═══════════════════════════════════
   HERO — KINETIC
═══════════════════════════════════ */
.sc-hero{
  position:relative;
  min-height:calc(100svh - 60px);
  overflow:hidden;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:0 24px 80px;
}

/* Animated gradient background */
.sc-hero-bg{
  position:absolute;inset:0;z-index:0;
  background:linear-gradient(160deg,#001229 0%,#00324F 50%,#001F3F 100%);
  animation:heroBg 12s ease-in-out infinite alternate;
}
@keyframes heroBg{
  0%{background:linear-gradient(160deg,#001229 0%,#003850 50%,#001F3F 100%)}
  33%{background:linear-gradient(160deg,#1a0a00 0%,#3D2000 50%,#001F3F 100%)}
  66%{background:linear-gradient(160deg,#080020 0%,#1A0A40 50%,#001F3F 100%)}
  100%{background:linear-gradient(160deg,#001520 0%,#003333 50%,#001F3F 100%)}
}

/* Grid overlay */
.sc-hero-grid{
  position:absolute;inset:0;z-index:1;
  background-image:
    linear-gradient(rgba(212,175,55,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(212,175,55,.05) 1px,transparent 1px);
  background-size:48px 48px;
}

/* Floating orbs */
.sc-hero-orbs{position:absolute;inset:0;z-index:1;overflow:hidden}
.sc-orb{
  position:absolute;border-radius:50%;filter:blur(60px);
  animation:orbFloat 8s ease-in-out infinite;
}
.sc-orb-1{width:300px;height:300px;background:rgba(212,175,55,.12);top:-80px;right:-60px;animation-duration:9s}
.sc-orb-2{width:200px;height:200px;background:rgba(230,57,70,.08);bottom:20%;left:-40px;animation-duration:7s;animation-delay:-3s}
.sc-orb-3{width:180px;height:180px;background:rgba(6,214,160,.06);top:30%;right:10%;animation-duration:11s;animation-delay:-5s}
@keyframes orbFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-20px) scale(1.05)}}

/* Floating product emojis */
.sc-hero-floats{position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none}
.sc-float{
  position:absolute;font-size:28px;opacity:.12;
  animation:floatDrift 15s ease-in-out infinite;
  filter:blur(.5px);
}
.sc-float:nth-child(1){top:10%;right:12%;animation-delay:0s;animation-duration:13s}
.sc-float:nth-child(2){top:25%;right:5%;animation-delay:-4s;animation-duration:17s;font-size:22px}
.sc-float:nth-child(3){top:45%;right:18%;animation-delay:-8s;animation-duration:11s;font-size:20px}
.sc-float:nth-child(4){top:60%;right:8%;animation-delay:-2s;animation-duration:14s;font-size:24px}
.sc-float:nth-child(5){top:15%;right:28%;animation-delay:-6s;animation-duration:16s;font-size:18px}
@keyframes floatDrift{
  0%,100%{transform:translateY(0) rotate(0deg)}
  33%{transform:translateY(-18px) rotate(5deg)}
  66%{transform:translateY(8px) rotate(-3deg)}
}

/* Vertical accent line */
.sc-hero-line{
  position:absolute;left:24px;top:0;bottom:0;width:2px;z-index:3;
  background:linear-gradient(to bottom,transparent 0%,var(--gold) 25%,var(--gold) 75%,transparent 100%);
  opacity:.4;
}

/* Bottom gradient fade */
.sc-hero-fade{
  position:absolute;left:0;right:0;bottom:0;z-index:3;height:200px;
  background:linear-gradient(to top,rgba(0,18,41,1) 0%,transparent 100%);
}

/* Content */
.sc-hero-content{position:relative;z-index:5}

.sc-scene-badge{
  display:inline-flex;align-items:center;gap:7px;
  background:rgba(212,175,55,.12);
  border:1px solid rgba(212,175,55,.3);
  border-radius:99px;padding:6px 14px;
  margin-bottom:24px;
  font-size:10px;font-weight:700;color:var(--gold);
  letter-spacing:.1em;text-transform:uppercase;
  transition:all .5s;
}
.sc-badge-dot{
  width:5px;height:5px;border-radius:50%;
  background:var(--gold);animation:blink 1.4s ease-in-out infinite;
}
@keyframes blink{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.2;transform:scale(.7)}}

/* THE BIG HEADLINE */
.sc-hero-h1{
  font-family:var(--h);
  font-size:clamp(42px,11vw,64px);
  line-height:.96;letter-spacing:-.01em;
  color:#fff;margin-bottom:20px;
}
.sc-hero-h1 .gold{
  color:var(--gold);
  text-shadow:0 0 40px rgba(212,175,55,.35);
  display:inline-block;
  transition:all .5s cubic-bezier(.16,1,.3,1);
}
.sc-hero-h1 .block{display:block}

.sc-hero-body{
  font-size:15px;color:rgba(255,255,255,.5);
  line-height:1.65;margin-bottom:28px;max-width:340px;
}

/* CTAs */
.sc-hero-ctas{display:flex;flex-direction:column;gap:10px;margin-bottom:0}
.sc-cta-red{
  padding:15px 28px;border-radius:14px;
  background:var(--red);color:#fff;
  font:700 15px var(--b);border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px;
  transition:all .18s;
  box-shadow:0 4px 20px rgba(230,57,70,.3);
}
.sc-cta-red:hover{background:#CC2030;box-shadow:0 6px 28px rgba(230,57,70,.4);transform:translateY(-1px)}
.sc-cta-ghost{
  padding:14px 28px;border-radius:14px;
  border:1.5px solid rgba(255,255,255,.18);
  color:rgba(255,255,255,.75);background:transparent;
  font:700 15px var(--b);cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px;
  transition:all .18s;
}
.sc-cta-ghost:hover{border-color:rgba(255,255,255,.45);color:#fff}

/* Scene dots */
.sc-dots{
  position:absolute;bottom:32px;left:50%;
  transform:translateX(-50%);z-index:10;
  display:flex;gap:6px;
}
.sc-dot{
  width:6px;height:6px;border-radius:99px;
  background:rgba(255,255,255,.2);
  transition:all .4s;cursor:pointer;border:none;
}
.sc-dot.on{width:24px;background:var(--gold)}

/* Progress bar */
.sc-progress{position:absolute;bottom:0;left:0;right:0;height:2px;z-index:10;background:rgba(255,255,255,.06)}
.sc-progress-bar{height:100%;background:var(--gold);width:0;transition:none}

/* ═══════════════════════════════════
   STATS
═══════════════════════════════════ */
.sc-stats{
  background:var(--navy);
  display:grid;grid-template-columns:1fr 1fr;gap:1px;
  background-color:rgba(255,255,255,.05);
}
.sc-stat{
  background:var(--navy);padding:28px 20px;
  position:relative;overflow:hidden;transition:all .2s;
}
.sc-stat::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(212,175,55,.04),transparent);
  opacity:0;transition:opacity .3s;
}
.sc-stat:hover::before{opacity:1}
.sc-stat-num{
  font-family:var(--h);font-size:36px;
  color:#fff;line-height:1;margin-bottom:5px;
}
.sc-stat-num .acc{color:var(--gold)}
.sc-stat-label{font-size:11px;color:rgba(255,255,255,.3);font-weight:600;letter-spacing:.04em;text-transform:uppercase}

/* ═══════════════════════════════════
   SECTIONS
═══════════════════════════════════ */
.sc-section{padding:60px 20px}
.sc-section-white{background:#fff}
.sc-section-off{background:var(--off)}
.sc-section-navy{background:var(--navy)}
.sc-section-dark{background:var(--navy2)}

.sc-eyebrow{
  font-size:10px;font-weight:700;text-transform:uppercase;
  letter-spacing:.14em;color:var(--gold);margin-bottom:10px;display:block;
}
.sc-h2{
  font-family:var(--h);
  font-size:clamp(26px,7vw,36px);
  color:var(--navy);line-height:1.08;
  margin-bottom:14px;letter-spacing:-.01em;
}
.sc-h2-white{color:#fff}
.sc-sub{font-size:14px;color:var(--muted);line-height:1.7}

/* ═══════════════════════════════════
   HUB LIST
═══════════════════════════════════ */
.sc-hubs{
  display:flex;flex-direction:column;gap:1px;
  background:var(--off);border-radius:20px;
  overflow:hidden;margin-top:28px;
  border:1px solid #E2E8F0;
}
.sc-hub{
  background:#fff;padding:15px 18px;
  display:flex;align-items:center;gap:13px;
  transition:all .18s;position:relative;overflow:hidden;
}
.sc-hub::before{
  content:'';position:absolute;left:0;top:0;bottom:0;
  width:3px;background:var(--gold);
  transform:scaleY(0);transition:transform .2s;
}
.sc-hub:hover::before{transform:scaleY(1)}
.sc-hub:hover{background:#FAFBFE}
.sc-hub-fl{font-size:24px;flex-shrink:0}
.sc-hub-bd{flex:1;min-width:0}
.sc-hub-n{font-weight:700;font-size:14px;color:var(--navy)}
.sc-hub-c{font-size:11px;color:var(--muted);margin-top:1px}
.sc-hub-tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:5px}
.sc-hub-tag{
  font-size:9px;font-weight:700;padding:2px 7px;
  border-radius:99px;background:var(--off);
  color:var(--muted);border:1px solid #E2E8F0;
}
.sc-live{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:700;color:var(--green);flex-shrink:0}
.sc-live-dot{width:7px;height:7px;border-radius:50%;background:var(--green);animation:blink 2s ease-in-out infinite}

/* ═══════════════════════════════════
   HORIZONTAL SCROLL
═══════════════════════════════════ */
.sc-hscroll-wrap{overflow:hidden;padding:56px 0 56px 20px}
.sc-hscroll-head{padding-right:20px;margin-bottom:22px}
.sc-hscroll{
  display:flex;gap:14px;overflow-x:auto;
  padding-right:20px;padding-bottom:8px;
  scrollbar-width:none;-ms-overflow-style:none;
}
.sc-hscroll::-webkit-scrollbar{display:none}

/* Product cards */
.sc-prod{
  background:#fff;border-radius:20px;overflow:hidden;
  border:1.5px solid #E2E8F0;flex-shrink:0;width:210px;
  transition:all .22s;cursor:pointer;
  box-shadow:0 2px 12px rgba(0,31,63,.05);
}
.sc-prod:hover{
  border-color:var(--gold);
  box-shadow:0 10px 36px rgba(0,31,63,.12);
  transform:translateY(-4px);
}
.sc-prod-img{
  height:144px;
  background:linear-gradient(135deg,var(--off),#E8EDF5);
  display:flex;align-items:center;justify-content:center;
  font-size:50px;position:relative;
}
.sc-prod-hub{
  position:absolute;top:10px;left:10px;
  background:var(--navy);color:#fff;
  font-size:9px;font-weight:700;
  padding:3px 9px;border-radius:99px;
}
.sc-prod-bd{padding:14px}
.sc-prod-cat{font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:700;margin-bottom:4px}
.sc-prod-n{font-family:var(--h);font-size:13px;color:var(--navy);margin-bottom:9px;line-height:1.3}
.sc-prod-from{font-size:10px;color:var(--muted)}
.sc-prod-price{font-family:var(--h);font-size:20px;color:var(--navy)}
.sc-prod-moq{font-size:10px;color:var(--muted);margin:3px 0 11px}
.sc-prod-btn{
  width:100%;padding:9px;border-radius:10px;
  background:var(--navy);color:#fff;
  font:700 11px var(--b);border:none;cursor:pointer;
  transition:background .15s;
}
.sc-prod-btn:hover{background:#0B2C55}

/* Agent cards */
.sc-agent{
  background:#fff;border-radius:20px;padding:20px;
  border:1.5px solid #E2E8F0;flex-shrink:0;width:230px;
  transition:all .22s;cursor:pointer;position:relative;overflow:hidden;
}
.sc-agent::after{
  content:'';position:absolute;bottom:0;left:0;right:0;
  height:3px;background:var(--gold);
  transform:scaleX(0);transform-origin:left;transition:transform .22s;
}
.sc-agent:hover::after{transform:scaleX(1)}
.sc-agent:hover{border-color:rgba(212,175,55,.4);box-shadow:0 8px 32px rgba(0,31,63,.1)}
.sc-agent-av{
  width:50px;height:50px;border-radius:14px;
  margin-bottom:13px;display:flex;align-items:center;
  justify-content:center;font-family:var(--h);
  font-size:20px;color:#fff;
}
.sc-agent-n{font-family:var(--h);font-size:15px;color:var(--navy);margin-bottom:2px}
.sc-agent-t{font-size:11px;color:var(--muted);margin-bottom:9px}
.sc-agent-loc{font-size:12px;color:var(--muted);margin-bottom:9px}
.sc-agent-tags{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:10px}
.sc-atag{font-size:10px;font-weight:600;padding:3px 8px;border-radius:99px;background:var(--off);color:var(--muted);border:1px solid #E2E8F0}
.sc-cert{display:inline-flex;align-items:center;gap:4px;background:rgba(212,175,55,.1);border:1px solid rgba(212,175,55,.2);border-radius:99px;padding:3px 10px;font-size:10px;font-weight:700;color:#A07900;margin-bottom:10px}
.sc-wa-btn{
  width:100%;padding:10px;border-radius:11px;
  background:#25D366;color:#fff;
  font:700 12px var(--b);border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:5px;
  transition:background .15s;
}
.sc-wa-btn:hover{background:#1FA855}

/* ═══════════════════════════════════
   TIMELINE
═══════════════════════════════════ */
.sc-timeline{margin-top:28px;position:relative}
.sc-timeline::before{
  content:'';position:absolute;left:22px;top:0;bottom:0;
  width:2px;background:linear-gradient(to bottom,var(--gold),#E2E8F0);
}
.sc-tl{display:flex;gap:16px;padding-bottom:32px}
.sc-tl:last-child{padding-bottom:0}
.sc-tl-dot{
  width:44px;height:44px;border-radius:13px;
  background:var(--navy);display:flex;align-items:center;
  justify-content:center;font-size:20px;flex-shrink:0;
  position:relative;z-index:1;
  box-shadow:0 0 0 4px #fff,0 0 0 5px rgba(0,31,63,.1);
  transition:all .2s;
}
.sc-tl:hover .sc-tl-dot{background:var(--gold);transform:scale(1.06)}
.sc-tl-body{padding-top:7px}
.sc-tl-num{font-size:10px;font-weight:700;color:var(--gold);letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px}
.sc-tl-title{font-family:var(--h);font-size:16px;color:var(--navy);margin-bottom:5px}
.sc-tl-desc{font-size:13px;color:var(--muted);line-height:1.65}

/* ═══════════════════════════════════
   MFR SECTION
═══════════════════════════════════ */
.sc-mfr-h{font-family:var(--h);font-size:clamp(28px,8vw,40px);color:#fff;line-height:1.05;margin-bottom:14px}
.sc-mfr-em{font-style:normal;color:var(--gold)}
.sc-mfr-sub{font-size:14px;color:rgba(255,255,255,.4);line-height:1.7;margin-bottom:24px}
.sc-mfr-checks{display:flex;flex-direction:column;gap:11px;margin-bottom:28px}
.sc-mfr-check{display:flex;align-items:flex-start;gap:11px;font-size:13px;color:rgba(255,255,255,.62)}
.sc-mfr-icon{
  width:22px;height:22px;border-radius:50%;
  background:rgba(212,175,55,.14);border:1px solid rgba(212,175,55,.25);
  display:flex;align-items:center;justify-content:center;
  font-size:11px;flex-shrink:0;margin-top:1px;
}
.sc-mfr-form{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  border-radius:20px;padding:22px;
}
.sc-mfr-form-title{font-family:var(--h);font-size:16px;color:#fff;margin-bottom:16px}
.sc-mf{margin-bottom:10px}
.sc-mf label{display:block;font-size:10px;font-weight:700;color:rgba(255,255,255,.28);letter-spacing:.08em;text-transform:uppercase;margin-bottom:5px}
.sc-mf input,.sc-mf select{
  width:100%;padding:11px 13px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.1);
  border-radius:10px;color:#fff;
  font:14px var(--b);outline:none;
  transition:border-color .15s;
}
.sc-mf input:focus,.sc-mf select:focus{border-color:rgba(212,175,55,.5)}
.sc-mf input::placeholder{color:rgba(255,255,255,.18)}
.sc-mf select option{background:var(--navy2)}

/* ═══════════════════════════════════
   SHOP PAGE
═══════════════════════════════════ */
.sc-shop-header{background:var(--navy);padding:28px 20px 0}
.sc-shop-header h1{font-family:var(--h);font-size:28px;color:#fff;margin-bottom:6px}
.sc-shop-header p{font-size:13px;color:rgba(255,255,255,.38);margin-bottom:18px}
.sc-filters{display:flex;gap:7px;overflow-x:auto;padding-bottom:16px;scrollbar-width:none}
.sc-filters::-webkit-scrollbar{display:none}
.sc-pill{
  padding:8px 16px;border-radius:99px;
  border:1.5px solid rgba(255,255,255,.12);
  background:transparent;color:rgba(255,255,255,.45);
  font:600 12px var(--b);cursor:pointer;white-space:nowrap;
  flex-shrink:0;transition:all .15s;
}
.sc-pill:hover{border-color:rgba(255,255,255,.3);color:#fff}
.sc-pill.on{background:var(--gold);border-color:var(--gold);color:#000}
.sc-shop-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:24px 20px 60px}
.sc-shop-card{
  background:#fff;border-radius:16px;overflow:hidden;
  border:1.5px solid #E2E8F0;transition:all .2s;cursor:pointer;
}
.sc-shop-card:hover{border-color:var(--gold);box-shadow:0 6px 24px rgba(0,31,63,.1);transform:translateY(-2px)}
.sc-simg{height:108px;background:linear-gradient(135deg,var(--off),#E4EAF5);display:flex;align-items:center;justify-content:center;font-size:36px}
.sc-sbody{padding:11px}
.sc-scat{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700;margin-bottom:4px}
.sc-sname{font-family:var(--h);font-size:12px;color:var(--navy);margin-bottom:6px;line-height:1.3}
.sc-sprice{font-family:var(--h);font-size:16px;color:var(--navy)}
.sc-smoq{font-size:10px;color:var(--muted);margin:3px 0 9px}
.sc-sbtn{width:100%;padding:9px;background:var(--navy);color:#fff;border-radius:9px;font:700 11px var(--b);border:none;cursor:pointer}

/* ═══════════════════════════════════
   REF BAR (shop)
═══════════════════════════════════ */
.sc-ref-bar{
  background:linear-gradient(90deg,var(--navy),#0B2C55);
  padding:11px 20px;
  display:flex;align-items:center;gap:12px;
  border-bottom:1px solid rgba(212,175,55,.14);
}
.sc-ref-av{
  width:34px;height:34px;border-radius:50%;
  background:rgba(212,175,55,.18);border:2px solid rgba(212,175,55,.28);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--h);font-size:14px;color:var(--gold);flex-shrink:0;
}
.sc-ref-info{flex:1;min-width:0}
.sc-ref-label{font-size:9px;color:rgba(255,255,255,.3);font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.sc-ref-name{font-size:13px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ═══════════════════════════════════
   CARGO
═══════════════════════════════════ */
.sc-cargo-header{
  background:linear-gradient(160deg,#0a0020 0%,#1a0040 50%,#001030 100%);
  padding:40px 20px 32px;position:relative;overflow:hidden;
}
.sc-cargo-header::after{content:'🚢';position:absolute;right:-15px;top:20px;font-size:110px;opacity:.07;pointer-events:none}
.sc-cargo-h1{font-family:var(--h);font-size:clamp(28px,8vw,36px);color:#fff;line-height:1.1;margin-bottom:12px}
.sc-cargo-sub{font-size:13px;color:rgba(255,255,255,.42);line-height:1.65;margin-bottom:20px}
.sc-cargo-modes{display:flex;gap:7px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none;margin-bottom:20px}
.sc-cargo-modes::-webkit-scrollbar{display:none}
.sc-cmode{
  padding:8px 14px;border-radius:99px;
  border:1.5px solid rgba(255,255,255,.12);
  background:transparent;color:rgba(255,255,255,.42);
  font:600 12px var(--b);cursor:pointer;white-space:nowrap;
  flex-shrink:0;transition:all .15s;display:flex;align-items:center;gap:5px;
}
.sc-cmode.on{background:rgba(212,175,55,.14);border-color:rgba(212,175,55,.38);color:var(--gold)}
.sc-cargo-form{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:18px;padding:20px}
.sc-cargo-route{display:grid;grid-template-columns:1fr 24px 1fr;gap:8px;align-items:end;margin-bottom:11px}
.sc-cargo-arr{display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--gold);padding-bottom:10px}
.sc-cf{margin-bottom:10px}
.sc-cf label{display:block;font-size:10px;font-weight:700;color:rgba(255,255,255,.28);letter-spacing:.08em;text-transform:uppercase;margin-bottom:5px}
.sc-cf input,.sc-cf select{width:100%;padding:10px 12px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:9px;color:#fff;font:13px var(--b);outline:none}
.sc-cf input::placeholder{color:rgba(255,255,255,.18)}
.sc-cargo-submit{width:100%;margin-top:8px;padding:14px;border-radius:12px;background:var(--gold);color:#000;font:700 14px var(--b);border:none;cursor:pointer;transition:all .15s}
.sc-cargo-submit:hover{background:var(--goldb)}

/* ═══════════════════════════════════
   TRACKING
═══════════════════════════════════ */
.sc-track-bar{display:flex;gap:8px;margin:14px 0 22px}
.sc-track-in{flex:1;padding:12px 15px;border:1.5px solid #E2E8F0;border-radius:12px;font:14px var(--b);outline:none;background:#fff;color:var(--navy)}
.sc-track-btn{padding:12px 20px;background:var(--navy);color:#fff;border-radius:12px;font:700 13px var(--b);border:none;cursor:pointer;white-space:nowrap}
.sc-track-result{background:#fff;border-radius:20px;padding:22px;border:1.5px solid #E2E8F0;box-shadow:0 2px 16px rgba(0,31,63,.06)}
.sc-tr-ref{font-family:var(--h);font-size:18px;color:var(--navy)}
.sc-tr-mode{font-size:11px;color:var(--muted);margin-top:2px;margin-bottom:16px}
.sc-tr-status{display:inline-flex;padding:5px 12px;background:rgba(6,214,160,.1);color:var(--green);border-radius:99px;font-size:11px;font-weight:700;margin-bottom:18px}
.sc-stepper{display:flex;align-items:center;margin-bottom:8px}
.sc-step{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;flex-shrink:0}
.sc-step.done{background:var(--green);color:#fff}
.sc-step.now{background:var(--navy);color:#fff;box-shadow:0 0 0 3px rgba(0,31,63,.12)}
.sc-step.next{background:#E2E8F0;color:var(--muted)}
.sc-step-line{flex:1;height:2px;margin:0 3px}
.sc-step-done{background:var(--green)}.sc-step-next{background:#E2E8F0}
.sc-step-labels{display:flex;justify-content:space-between;margin-bottom:18px}
.sc-slabel{font-size:9px;color:var(--muted);text-align:center;max-width:46px;line-height:1.3}
.sc-slabel.on{color:var(--navy);font-weight:700}

/* ═══════════════════════════════════
   APPLY
═══════════════════════════════════ */
.sc-apply-hero{
  background:linear-gradient(160deg,var(--navy2) 0%,#002D4A 100%);
  padding:48px 20px 36px;position:relative;overflow:hidden;
}
.sc-apply-hero::after{content:'🏭';position:absolute;right:-20px;top:28px;font-size:120px;opacity:.06;pointer-events:none}
.sc-apply-card{
  background:#fff;border-radius:20px;
  box-shadow:0 8px 40px rgba(0,31,63,.1);
  overflow:hidden;margin:24px 20px 60px;
}
.sc-apply-card-header{
  background:linear-gradient(90deg,var(--navy),var(--navy2));
  padding:16px 20px;display:flex;align-items:center;justify-content:space-between;
}
.sc-apply-steps{display:flex;gap:5px}
.sc-as{width:22px;height:4px;border-radius:99px;background:rgba(255,255,255,.14)}
.sc-as.done{background:var(--gold)}.sc-as.cur{background:var(--gold);width:38px}
.sc-apply-step-label{font-size:11px;color:rgba(255,255,255,.3)}
.sc-apply-step-label strong{color:#fff}
.sc-apply-body{padding:22px 20px}
.sc-af{margin-bottom:13px}
.sc-af label{display:block;font-size:11px;font-weight:600;color:#5B6575;margin-bottom:5px}
.sc-af input,.sc-af select,.sc-af textarea{width:100%;padding:12px 13px;border:1.5px solid #E2E8F0;border-radius:10px;font:14px var(--b);color:var(--navy);outline:none;background:#fff;transition:border-color .15s}
.sc-af input:focus,.sc-af select:focus{border-color:var(--navy)}
.sc-cats{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.sc-cat{display:flex;flex-direction:column;align-items:center;gap:4px;padding:11px 7px;border:1.5px solid #E2E8F0;border-radius:11px;cursor:pointer;transition:all .15s;text-align:center}
.sc-cat .ci{font-size:20px}.sc-cat .ct{font-size:10px;font-weight:700;color:var(--muted)}
.sc-cat.on{border-color:var(--navy);background:var(--navy)}.sc-cat.on .ct{color:#fff}
.sc-apply-foot{padding:15px 20px;border-top:1px solid #F0F2F6;display:flex;gap:10px;align-items:center;background:#FAFBFD}
.sc-back-btn{font:600 13px var(--b);color:var(--muted);background:none;border:none;cursor:pointer}
.sc-next-btn{flex:1;padding:12px;background:var(--navy);color:#fff;border-radius:12px;font:700 14px var(--b);border:none;cursor:pointer}

/* ═══════════════════════════════════
   FORMS (generic)
═══════════════════════════════════ */
.sc-field{margin-bottom:13px}
.sc-field label{display:block;font-size:11px;font-weight:600;color:#374151;margin-bottom:5px}
.sc-field input,.sc-field select,.sc-field textarea{width:100%;padding:12px 13px;border:1.5px solid #E2E8F0;border-radius:10px;font:14px var(--b);color:var(--navy);outline:none;background:#fff;transition:border-color .15s}
.sc-field input:focus,.sc-field select:focus,.sc-field textarea:focus{border-color:var(--navy)}
.req{color:var(--red)}
.sc-notice-warn{background:#FEF3C7;border:1px solid #FDE68A;border-radius:10px;padding:12px 16px;font-size:13px;color:#92400E;margin:16px 0}
.sc-notice-success{background:#ECFDF5;border:1px solid #A7F3D0;border-radius:10px;padding:12px 16px;font-size:13px;color:#065F46}

/* ═══════════════════════════════════
   FOOTER
═══════════════════════════════════ */
.sc-footer{background:var(--navy2);padding:48px 20px 32px}
.sc-footer-logo{font-family:var(--h);font-size:22px;color:#fff;margin-bottom:6px}
.sc-footer-tagline{font-size:13px;color:rgba(255,255,255,.25);line-height:1.6;margin-bottom:28px}
.sc-footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-bottom:28px}
.sc-footer-col h4{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:rgba(255,255,255,.2);margin-bottom:10px}
.sc-footer-col a{display:block;font-size:13px;color:rgba(255,255,255,.38);margin-bottom:8px;transition:color .15s}
.sc-footer-col a:hover{color:#fff}
.sc-footer-bottom{border-top:1px solid var(--line);padding-top:20px}
.sc-footer-copy{font-size:11px;color:rgba(255,255,255,.16);margin-bottom:12px;line-height:1.5}
.sc-footer-langs{display:flex;gap:12px}
.sc-lang{font-size:12px;color:rgba(255,255,255,.25);transition:color .15s}
.sc-lang:hover,.sc-lang.on{color:var(--gold)}

/* ═══════════════════════════════════
   SCROLL REVEAL
═══════════════════════════════════ */
.sc-reveal{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s cubic-bezier(.16,1,.3,1)}
.sc-reveal.in{opacity:1;transform:translateY(0)}
.sc-d1{transition-delay:.1s}.sc-d2{transition-delay:.2s}.sc-d3{transition-delay:.3s}

/* ═══════════════════════════════════
   RESPONSIVE
═══════════════════════════════════ */
@media(min-width:640px){
  .sc-stats{grid-template-columns:repeat(4,1fr)}
  .sc-shop-grid{grid-template-columns:repeat(3,1fr)}
  .sc-cats{grid-template-columns:repeat(4,1fr)}
  .sc-hero-h1{font-size:64px}
}
@media(min-width:960px){
  .sc-section{padding:80px 40px}
  .sc-hscroll-wrap{padding:72px 0 72px 40px}
  .sc-hero{padding:0 40px 100px}
  .sc-hero-line{left:40px}
  .sc-shop-header{padding:32px 40px 0}
  .sc-shop-grid{padding:32px 40px 80px;grid-template-columns:repeat(4,1fr)}
  .sc-footer{padding:56px 40px 36px}
  .sc-footer-grid{grid-template-columns:repeat(4,1fr)}
}