:root{
  --ink:#141414; --ink-2:#4b4b4d; --ink-3:#6f6f71; --ink-4:#a3a3a5;
  --line:#e6e6e7; --line-strong:#d2d2d4;
  --bg:#ffffff; --gray-50:#fafafa; --gray-100:#f2f2f3; --gray-150:#eceded; --gray-800:#161617;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;-webkit-font-smoothing:antialiased;overflow-x:hidden;background:var(--bg);color:var(--ink);font-family:'Figtree',sans-serif;}
html[lang="ar"] body{font-family:'IBM Plex Sans Arabic','Figtree',sans-serif;}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3{font-family:'IBM Plex Sans Arabic','Sora',sans-serif;}
h1,h2,h3{font-family:'Sora',sans-serif;margin:0;}
a{color:var(--ink);text-decoration:none;}
a:hover{color:var(--ink-2);}
*:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}
img{max-width:100%;display:block;}

[data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.22,1,.36,1),transform 1s cubic-bezier(.22,1,.36,1);}
[data-reveal].in{opacity:1;transform:none;}

.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;font-weight:600;cursor:pointer;transition:transform .2s cubic-bezier(.22,1,.36,1),background .2s ease,border-color .2s ease;border:none;}
.btn:active{transform:scale(.96);}
.btn-dark{background:var(--ink);color:#fff;}
.btn-dark:hover{background:#2c2c2d;}
.btn-outline{background:#fff;border:1px solid var(--line-strong);color:var(--ink);}
.btn-outline:hover{background:var(--gray-50);}
.wa-green{border:none;color:#fff;background:#25D366;padding:13px 28px;font-size:15px;}

nav{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:16px 40px;background:rgba(255,255,255,.86);backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid var(--line);}
.logo{flex-shrink:0;display:flex;align-items:center;}
.logo img{height:48px;width:48px;object-fit:contain;}
.nav-right{display:flex;align-items:center;gap:20px;}
.nav-links{display:flex;align-items:center;gap:24px;font-size:14px;color:var(--ink-2);}
#langToggle{padding:8px 16px;font-size:13px;}
#navWa{padding:10px 20px;font-size:14px;}
.progress{position:absolute;left:0;bottom:-1px;height:2px;background:var(--ink);width:0;}

.brand-statement{padding:150px 6vw 10px;text-align:center;}
.value-prop{margin:14px auto 0;font-size:clamp(22px,2.6vw,32px);font-weight:600;color:var(--ink);max-width:640px;line-height:1.4;}

.showcase{position:relative;padding:36px 6vw 60px;background:#fff;}
.showcase-inner{position:relative;max-width:1300px;margin:0 auto;}
.showcase-track{position:relative;height:min(70vh,600px);overflow:hidden;border-radius:24px;background:var(--gray-50);touch-action:pan-y;cursor:grab;user-select:none;}
.showcase-track.dragging{cursor:grabbing;}
.stage-decor{position:absolute;border-radius:50%;z-index:0;}
.decor-1{top:8%;left:-6%;width:26vw;height:26vw;max-width:340px;max-height:340px;background:radial-gradient(circle,var(--gray-150),transparent 72%);filter:blur(6px);}
.decor-2{bottom:6%;right:-6%;width:22vw;height:22vw;max-width:300px;max-height:300px;background:radial-gradient(circle,#ffffff,transparent 70%);filter:blur(4px);}
.counter{position:absolute;top:24px;right:28px;font-size:12px;letter-spacing:.08em;color:var(--ink-3);z-index:41;direction:ltr;unicode-bidi:isolate;}
html[dir="rtl"] .counter{right:auto;left:28px;}

.showcase-slide{position:absolute;top:50%;left:50%;width:min(58vw,600px);}
.img-track{position:relative;width:100%;height:48vh;max-height:420px;overflow:hidden;border-radius:16px;touch-action:pan-y;cursor:grab;}
.img-shadow{position:absolute;bottom:2%;left:0;width:100%;height:26px;background:radial-gradient(ellipse at center,rgba(20,20,20,.15),transparent 72%);filter:blur(10px);pointer-events:none;z-index:2;}
.img-layer{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;}
.img-layer img{width:100%;height:100%;object-fit:contain;}
.img-toggle{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:3;background:rgba(20,20,20,.55);backdrop-filter:blur(8px);color:#fff;border:none;border-radius:999px;padding:5px 14px;font-size:12px;font-weight:600;cursor:pointer;font-family:'Figtree',sans-serif;letter-spacing:.02em;direction:ltr;unicode-bidi:isolate;}

.mystery-mini{position:relative;width:200px;height:200px;margin:0 auto;display:flex;align-items:center;justify-content:center;}
.mystery-mini-veil{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,#ffffff,transparent 72%);}
.mystery-mini-ring{position:absolute;width:100%;height:100%;border-radius:50%;border:1px solid var(--line-strong);}

.arrow{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid var(--line);cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:42;box-shadow:0 8px 20px rgba(20,20,20,.08);}
.arrow-prev{left:18px;}
.arrow-next{right:18px;}
.arrow[hidden]{display:none;}

.dots{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);display:flex;gap:10px;z-index:41;}
.dot{width:8px;height:8px;border-radius:50%;background:var(--line-strong);border:none;cursor:pointer;padding:0;transition:transform .3s,background .3s;}
.dot.active{background:var(--ink);transform:scale(1.6);}

.showcase-bar{position:relative;margin:-40px auto 0;max-width:920px;background:#fff;border-radius:22px;box-shadow:0 20px 50px rgba(20,20,20,.12);padding:22px 32px;display:flex;flex-direction:column;gap:16px;z-index:40;}
.bar-product{display:flex;flex-direction:column;gap:16px;}
.bar-contact{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;}
.bar-product[hidden],.bar-contact[hidden]{display:none;}
.bar-row{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;}
.bar-left{display:flex;align-items:center;gap:16px;flex-shrink:0;flex-wrap:wrap;}
.bar-name{font-size:15px;font-weight:700;white-space:nowrap;}
.bar-variants{display:flex;gap:6px;flex-shrink:0;}
.variant-btn{padding:6px 14px;border-radius:999px;font-size:12px;font-weight:600;cursor:pointer;border:1px solid var(--line-strong);white-space:nowrap;background:#fff;color:var(--ink);}
.variant-btn.active{background:var(--ink);color:#fff;}
.bar-right{display:flex;align-items:center;gap:20px;flex-wrap:wrap;}
.bar-price{display:flex;align-items:baseline;gap:10px;}
.price-local{font-size:13px;color:var(--ink-4);text-decoration:line-through;white-space:nowrap;}
.price-our{font-family:'Sora',sans-serif;font-size:28px;font-weight:800;letter-spacing:-.02em;white-space:nowrap;}
.bar-cta{padding:14px 36px;font-size:15px;font-weight:700;white-space:nowrap;flex-shrink:0;letter-spacing:.01em;}
.dock-specs{font-size:13px;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

.mystery{position:relative;background:var(--gray-800);color:#fff;padding:130px 6vw;display:flex;align-items:center;justify-content:center;gap:70px;flex-wrap:wrap;overflow:hidden;}
.mystery-orb-wrap{perspective:1200px;}
.mystery-orb{position:relative;width:min(360px,80vw);height:380px;display:flex;align-items:center;justify-content:center;transform-style:preserve-3d;}
.mystery-veil{position:absolute;width:82%;height:70%;border-radius:50%;background:rgba(255,255,255,.07);filter:blur(2px);}
.mystery-ring{position:absolute;width:82%;height:70%;border-radius:50%;border:1px solid rgba(255,255,255,.16);}
.mystery-q{position:relative;font-family:'Sora',sans-serif;font-weight:700;font-size:136px;color:rgba(255,255,255,.8);line-height:1;}
.mystery-text{max-width:340px;text-align:start;}
.unlisted-tag{display:inline-block;font-size:12px;letter-spacing:.1em;padding:5px 12px;border-radius:999px;background:rgba(255,255,255,.1);color:#fff;}
.mystery-text h3{font-size:clamp(26px,2.8vw,36px);margin:16px 0 14px;color:#fff;}
.mystery-text p{font-size:17px;color:rgba(255,255,255,.72);line-height:1.6;margin:0 0 28px;}

footer{padding:56px 6vw 60px;background:#fff;border-top:1px solid var(--line);}
.footer-inner{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:24px;}
.footer-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;align-items:center;}
.footer-logo{height:69px;width:91px;object-fit:contain;}
.footer-links{display:flex;gap:22px;font-size:13px;color:var(--ink-2);flex-wrap:wrap;}
.footer-disclaimer{font-size:12px;color:var(--ink-3);line-height:1.65;text-align:start;}

@media (max-width:980px){
  .nav-links{display:none!important;}
  nav{padding:12px 20px!important;}
  .dock-specs{display:none!important;}
  .showcase-slide{width:min(74vw,380px)!important;}
  .showcase-bar{margin:-28px 12px 0!important;padding:14px 18px!important;}
}
@media (max-width:700px){ .stage-decor{display:none!important;} .showcase-slide{width:min(82vw,300px)!important;} }
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,[data-reveal]{transition:none!important;animation:none!important;}
  [data-reveal]{opacity:1!important;transform:none!important;}
}