:root{
  --red:#E50914;
  --red-hot:#FF2A36;
  --red-deep:#8B000C;
  --red-rgb:229,9,20;
  --ink:#f5f5f7;
  --muted:#b8b8c2;
  --bg:#050505;
  --card:#0d0d10;
  --line:rgba(var(--red-rgb),.45);
  --glow:0 0 28px rgba(var(--red-rgb),.55);
  --font:"Plus Jakarta Sans",system-ui,sans-serif;
  --display:"Outfit",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;font-family:var(--font);color:var(--ink);background:var(--bg);min-height:100%}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{width:min(1180px,calc(100% - 36px));margin:0 auto}

.bg-glow{
  position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(900px 420px at 12% -10%,rgba(var(--red-rgb),.38),transparent 58%),
    radial-gradient(700px 380px at 92% 8%,rgba(var(--red-rgb),.22),transparent 60%),
    radial-gradient(800px 500px at 50% 110%,rgba(var(--red-rgb),.18),transparent 55%);
}
.bg-dots{
  position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.35;
  background-image:radial-gradient(rgba(var(--red-rgb),.55) 1px,transparent 1.4px);
  background-size:28px 28px;
  animation:dotShift 18s linear infinite;
}
@keyframes dotShift{to{background-position:28px 28px}}

.nav{
  position:fixed;inset:0 0 auto;z-index:50;padding:14px 0;
  transition:background .3s,box-shadow .3s,border-color .3s;
  border-bottom:1px solid transparent;
}
.nav.on{
  background:rgba(5,5,5,.88);
  backdrop-filter:blur(16px);
  border-bottom-color:rgba(var(--red-rgb),.35);
  box-shadow:0 10px 40px rgba(0,0,0,.45);
}
.nav-in{display:flex;align-items:center;gap:18px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:800;letter-spacing:.04em}
.brand img{width:42px;height:42px;object-fit:contain;filter:drop-shadow(0 0 12px rgba(var(--red-rgb),.7))}
.nav-links{display:flex;gap:18px;margin-left:auto}
.nav-links a{font-size:.78rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#ddd;position:relative}
.nav-links a:after{
  content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:var(--red);
  box-shadow:var(--glow);transition:width .25s;
}
.nav-links a:hover,.nav-links a.on{color:#fff}
.nav-links a:hover:after,.nav-links a.on:after{width:100%}
.nav-toggle{display:none;background:0;border:0;color:#fff;font-size:1.4rem}
.btn-nav{padding:10px 16px!important;font-size:.72rem!important}

.btn,.btn-glow{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  background:linear-gradient(180deg,var(--red-hot),var(--red) 55%,var(--red-deep));
  color:#fff;border:0;border-radius:16px;cursor:pointer;
  padding:16px 28px;font-weight:800;letter-spacing:.06em;
  box-shadow:0 0 0 1px rgba(255,255,255,.12),0 12px 40px rgba(var(--red-rgb),.55);
  animation:pulseGlow 2.4s ease-in-out infinite;
  transition:transform .25s,box-shadow .25s,filter .25s;
}
.btn-copy{display:flex;flex-direction:column;align-items:flex-start;line-height:1.1}
.btn-copy strong{font-size:1.05rem}
.btn-copy small{font-weight:600;opacity:.9;letter-spacing:.04em;margin-top:4px;text-transform:none}
.btn-ico{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:rgba(255,255,255,.14)}
.btn:hover,.btn-glow:hover{
  transform:translateY(-4px) scale(1.03);
  filter:brightness(1.12);
  box-shadow:0 0 0 1px #fff,0 18px 50px rgba(255,42,54,.7);
  animation:none;
}
@keyframes pulseGlow{
  0%,100%{box-shadow:0 0 0 1px rgba(255,255,255,.12),0 10px 30px rgba(var(--red-rgb),.45)}
  50%{box-shadow:0 0 0 1px rgba(255,255,255,.22),0 16px 48px rgba(255,42,54,.75)}
}

.hero{
  position:relative;z-index:1;padding:130px 0 70px;overflow:hidden;
}
.hero:before{
  content:"";position:absolute;inset:-20% -10% auto auto;width:55%;height:70%;
  background:conic-gradient(from 200deg,transparent,rgba(var(--red-rgb),.35),transparent 40%);
  filter:blur(40px);animation:spinSlow 18s linear infinite;
}
@keyframes spinSlow{to{transform:rotate(360deg)}}
.hero-grid{position:relative;display:grid;grid-template-columns:1fr 1.05fr 1fr;gap:18px;align-items:center}
.hero-two .hero-shot{min-height:420px;max-height:520px}
.hero-center{text-align:center}
.hero-logo{width:86px;height:86px;margin:0 auto 14px;filter:drop-shadow(0 0 22px rgba(var(--red-rgb),.9));animation:float 4.5s ease-in-out infinite}
.kicker{display:inline-block;color:#fff;font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;opacity:.8;animation:fadeUp .7s both}
.hero h1{
  font-family:var(--display);font-size:clamp(2.2rem,5.4vw,4.4rem);margin:8px 0 6px;line-height:1.05;
  background:linear-gradient(90deg,#fff 20%,#ff6b73 50%,#fff 80%);
  background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:shine 4s linear infinite,fadeUp .8s .05s both;
}
.hero .lead{
  color:#fff;font-size:1.15rem;margin:0 0 8px;animation:fadeUp .9s .12s both;
}
.hero .lead b,.accent{color:var(--red-hot);text-shadow:0 0 18px rgba(var(--red-rgb),.7)}
.hero .sub{color:var(--muted);margin:0 0 22px;animation:fadeUp 1s .18s both}
.gold-badge{
  display:inline-block;margin:0 0 16px;padding:6px 16px;border-radius:6px;
  background:linear-gradient(180deg,#ffe08a,#d4a017);color:#111;font-weight:800;letter-spacing:.12em;font-size:.72rem;
  animation:fadeUp .8s .1s both,float 5s ease-in-out infinite;
}

.feat-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:22px 0 26px}
.feat{
  background:rgba(13,13,16,.72);border:1px solid var(--line);border-radius:16px;padding:16px 14px;text-align:left;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.03),0 0 18px rgba(var(--red-rgb),.12);
  transition:transform .28s,box-shadow .28s,border-color .28s,background .28s;
  animation:fadeUp .9s both;
}
.feat:nth-child(2){animation-delay:.08s}
.feat:nth-child(3){animation-delay:.16s}
.feat:nth-child(4){animation-delay:.24s}
.feat:hover{
  transform:translateY(-6px) scale(1.03);
  border-color:#ff4d57;
  background:rgba(var(--red-rgb),.16);
  box-shadow:0 0 28px rgba(var(--red-rgb),.45);
}
.feat .ico{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;margin-bottom:8px;color:#fff;background:rgba(var(--red-rgb),.2);box-shadow:0 0 12px rgba(var(--red-rgb),.35)}
.feat h3{margin:0 0 4px;font-size:.95rem}
.feat p{margin:0;color:var(--muted);font-size:.82rem}

.hero-cta{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:8px;animation:fadeUp 1.1s .25s both}

.url-pill{
  display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;
  border:1px solid var(--red);color:#fff;font-weight:600;font-size:.92rem;
  box-shadow:0 0 18px rgba(var(--red-rgb),.35);background:rgba(0,0,0,.45);
  transition:transform .25s,box-shadow .25s,background .25s;
}
.url-pill:hover{transform:scale(1.04);background:rgba(var(--red-rgb),.18);box-shadow:0 0 28px rgba(var(--red-rgb),.6)}

.shot-frame{
  position:relative;border-radius:28px;overflow:hidden;
  border:1px solid rgba(var(--red-rgb),.5);
  box-shadow:0 20px 50px rgba(0,0,0,.55),0 0 30px rgba(var(--red-rgb),.28);
  animation:float 6s ease-in-out infinite;
}
.shot-frame img{width:100%;height:100%;object-fit:cover;object-position:center}
.shot-frame.tall{min-height:420px;max-height:560px}
.shot-frame:hover{transform:scale(1.03);box-shadow:0 24px 60px rgba(0,0,0,.6),0 0 40px rgba(var(--red-rgb),.5)}
.shot-frame.delay{animation-delay:1.2s}

.sec{position:relative;z-index:1;padding:70px 0}
.sec-title{
  font-family:var(--display);font-size:clamp(1.6rem,3.4vw,2.5rem);text-align:center;margin:0 0 28px;
  background:linear-gradient(90deg,#fff,#ff8a90,#fff);background-size:200% auto;
  -webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 5s linear infinite;
}
.gallery{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}
.gallery .shot-frame{min-height:280px}
.gallery-wide{grid-column:1/-1;min-height:340px!important}

.platforms{display:flex;flex-wrap:wrap;justify-content:center;gap:22px;margin-top:28px}
.plat{display:flex;flex-direction:column;align-items:center;gap:8px;color:#eee;font-size:.78rem;font-weight:600;opacity:.9;transition:transform .25s,color .25s}
.plat svg{width:28px;height:28px}
.plat:hover{transform:translateY(-4px);color:var(--red-hot)}

.article-shell{
  position:relative;z-index:1;padding:20px 0 80px;
}
.ims-article,.legal{
  background:linear-gradient(180deg,rgba(20,8,10,.92),rgba(8,8,10,.96));
  border:1px solid var(--line);border-radius:24px;padding:36px 32px 48px;
  box-shadow:0 0 40px rgba(var(--red-rgb),.18),inset 0 1px 0 rgba(255,255,255,.04);
}
.ims-article h1,.legal h1{
  font-family:var(--display);font-size:clamp(1.7rem,3vw,2.4rem);margin:0 0 18px;
  color:#fff;text-shadow:0 0 22px rgba(var(--red-rgb),.45);
}
.ims-article h2,.legal h2{
  font-family:var(--display);font-size:1.35rem;margin:32px 0 12px;color:#fff;
  padding-left:12px;border-left:3px solid var(--red);
}
.ims-article h3{color:#ff8a90;margin:22px 0 8px;font-size:1.05rem}
.ims-article p,.legal p{
  color:#d7d7de;line-height:1.95;margin:0 0 22px;letter-spacing:.03em;
  animation:fadeUp .8s both;
}
.art-duo{
  display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:22px 0 28px;
}
.art-media{
  position:relative;margin:22px auto;border-radius:22px;overflow:hidden;
  border:1px solid rgba(var(--red-rgb),.5);
  box-shadow:0 16px 40px rgba(0,0,0,.45),0 0 28px rgba(var(--red-rgb),.28);
  background:#08080a;max-width:100%;
  transition:transform .28s,box-shadow .28s;
}
.art-media img{width:100%;height:auto;max-height:420px;object-fit:cover;object-position:center;display:block}
.art-media-wide img{max-height:480px}
.art-media:hover{transform:translateY(-6px) scale(1.015);box-shadow:0 22px 50px rgba(0,0,0,.5),0 0 40px rgba(var(--red-rgb),.5)}
.art-card{
  margin:16px 0 20px;padding:18px 18px 8px;border-radius:18px;
  border:1px solid rgba(var(--red-rgb),.4);
  background:linear-gradient(180deg,rgba(var(--red-rgb),.12),rgba(8,8,10,.9));
  box-shadow:0 0 22px rgba(var(--red-rgb),.12);
  transition:transform .25s,border-color .25s,box-shadow .25s;
}
.art-card:hover{transform:translateY(-4px);border-color:#ff4d57;box-shadow:0 12px 30px rgba(var(--red-rgb),.28)}
.art-card h3{margin-top:0}
.ims-article ul,.ims-article ol{color:#d7d7de;line-height:1.7;padding-left:1.2rem}
.ims-article li{margin:6px 0}
.guide-card{
  margin:18px 0;padding:20px 20px 8px;border-radius:18px;
  border:1px solid rgba(var(--red-rgb),.4);background:rgba(var(--red-rgb),.07);
  transition:transform .25s,box-shadow .25s,border-color .25s;
}
.guide-card:hover{transform:translateY(-4px);border-color:#ff4d57;box-shadow:0 12px 30px rgba(var(--red-rgb),.25)}
.guide-card h3{margin-top:0}

.dl-hero{position:relative;z-index:1;padding:120px 0 40px;text-align:center}
.dl-hero h1{font-family:var(--display);font-size:clamp(2rem,5vw,3.6rem);margin:10px 0;animation:fadeUp .8s both}
.dl-hero .lead{color:var(--muted);max-width:52ch;margin:0 auto 18px;animation:fadeUp .9s .1s both}
.dl-visual{max-width:920px;margin:28px auto 0;border-radius:28px;overflow:hidden;border:1px solid var(--line);box-shadow:0 0 50px rgba(var(--red-rgb),.35);animation:fadeUp 1s .15s both}
.dl-visual img{width:100%;height:auto;object-fit:cover}

.sticky-dl{
  position:fixed;right:18px;bottom:18px;z-index:40;
}
.legal-page{position:relative;z-index:1;padding:130px 0 80px}

.foot{position:relative;z-index:1;padding:40px 0 28px;border-top:1px solid rgba(var(--red-rgb),.3);background:#070708}
.foot-in{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.foot nav{display:flex;flex-wrap:wrap;gap:14px}
.foot a{color:#ccc;font-size:.88rem}
.foot a:hover{color:var(--red-hot)}
.foot small{color:#888}

.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
.press{transform:scale(.97)!important}
body.embed .nav,body.embed .sticky-dl,body.embed .foot{display:none}
body.embed .hero,body.embed .dl-hero,body.embed .legal-page{padding-top:36px}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}

@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes shine{to{background-position:200% center}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

@media(max-width:980px){
  .hero-grid.hero-two{grid-template-columns:1fr;gap:16px}
  .hero-grid.hero-two .hero-center{grid-column:1;order:-2}
  .hero-shot-left{display:none!important}
  .hero-shot-right{order:-1;min-height:220px;max-height:280px;border-radius:22px;animation:fromRight .7s ease both}
  .hero-two .hero-shot{min-height:220px;max-height:280px}
  .shot-frame.tall{min-height:180px;max-height:200px}
  .gallery,.phone-rail,.shot-marquee{display:none!important}
  .art-duo{grid-template-columns:1fr;margin-top:24px}
  .art-media img{max-height:220px}
  .dl-visual{max-width:100%;margin-top:16px}
  .dl-visual img{max-height:180px;object-fit:cover}
  .nav-toggle{display:block;margin-left:auto}
  .nav-links{display:none;position:absolute;top:64px;left:18px;right:18px;background:#0c0c0f;border:1px solid var(--line);border-radius:14px;padding:14px;flex-direction:column}
  .nav-links.open{display:flex}
  .btn-nav{display:none}
  .ims-article,.legal{padding:22px 16px 32px}
  .feat-grid{grid-template-columns:1fr 1fr;gap:8px}
  .hero{padding:96px 0 28px}
  .platforms{gap:12px}
  .plat span{font-size:.68rem}
  .url-pill{font-size:.82rem;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .strip-card{width:min(168px,62vw);height:310px}
  .phone-bezel-sm{width:min(142px,48vw);height:290px}
}

.phone-rail{display:flex;justify-content:center}
.phone-bezel{
  width:min(280px,100%);height:560px;border-radius:42px;padding:12px;
  background:#111;border:1px solid rgba(var(--red-rgb),.5);
  box-shadow:0 24px 50px rgba(0,0,0,.5),0 0 30px rgba(var(--red-rgb),.3);
  position:relative;overflow:hidden;
}
.phone-notch{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:90px;height:16px;background:#000;border-radius:0 0 12px 12px;z-index:2}
.phone-slider{height:100%;border-radius:32px;overflow:hidden;position:relative}
.phone-slider img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;animation:shotFade 16s infinite;
}
.phone-slider img:nth-child(1){opacity:1;animation-delay:0s}
.phone-slider img:nth-child(1){animation-delay:0s}
.phone-slider img:nth-child(2){animation-delay:4s}
.phone-slider img:nth-child(3){animation-delay:8s}
.phone-slider img:nth-child(4){animation-delay:12s}
.phone-slider img:nth-child(n+5){animation-delay:2s}
@keyframes shotFade{
  0%{opacity:0;transform:scale(1.06)}
  8%{opacity:1;transform:scale(1)}
  22%{opacity:1}
  30%{opacity:0}
  100%{opacity:0}
}
.shot-strip-wrap{position:relative;z-index:1;padding:8px 0 28px}
.shot-strip{
  display:flex;gap:14px;overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  padding:8px 18px 18px;cursor:grab;touch-action:pan-x;
  scrollbar-width:thin;
  animation:fromRight .85s ease both;
}
.shot-strip:active{cursor:grabbing}
.shot-strip::-webkit-scrollbar{height:6px}
.shot-strip::-webkit-scrollbar-thumb{background:rgba(var(--red-rgb),.45);border-radius:99px}
.strip-card{
  flex:0 0 auto;width:min(220px,72vw);height:400px;border-radius:26px;overflow:hidden;
  scroll-snap-align:start;
  border:1px solid rgba(var(--red-rgb),.45);background:#000;
  box-shadow:0 16px 36px rgba(0,0,0,.45),0 0 20px rgba(var(--red-rgb),.22);
}
.strip-card img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.phone-shot{
  flex:0 0 auto;scroll-snap-align:start;padding:6px 4px;
  transition:transform .28s ease;
}
.phone-shot:hover{transform:translateY(-8px) scale(1.03)}
.phone-bezel-sm{
  width:min(168px,58vw);height:340px;border-radius:32px;padding:10px;
  background:linear-gradient(160deg,#1a1a1f,#0a0a0c);
  border:1px solid rgba(var(--red-rgb),.55);
  box-shadow:0 18px 40px rgba(0,0,0,.55),0 0 24px rgba(var(--red-rgb),.28);
  position:relative;overflow:hidden;
  transition:box-shadow .28s,border-color .28s;
}
.phone-shot:hover .phone-bezel-sm{
  border-color:#ff4d57;
  box-shadow:0 22px 48px rgba(0,0,0,.6),0 0 36px rgba(var(--red-rgb),.5);
}
.phone-bezel-sm .phone-notch{width:72px;height:12px;top:8px}
.phone-screen{
  height:calc(100% - 8px);border-radius:24px;overflow:hidden;background:#000;margin-top:4px;
}
.phone-screen img{width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none;display:block}
.phone-home{
  position:absolute;bottom:8px;left:50%;transform:translateX(-50%);
  width:72px;height:4px;border-radius:99px;background:rgba(255,255,255,.35);
}
.shot-phones-wrap{position:relative;z-index:1;padding:10px 0 20px}
.phone-shot-strip{padding-bottom:22px}
@keyframes fromRight{from{opacity:0;transform:translateX(28%)}to{opacity:1;transform:none}}

.ims-article h1,.ims-article h2,.legal h1{
  letter-spacing:.04em;animation:fadeUp .7s both,shine 5s linear infinite;
}
.ims-article p:nth-child(odd){animation-delay:.08s}
.ims-article p:nth-child(even){animation-delay:.16s}

body.edit [data-edit],body.edit [data-edit-card]{
  outline:1px dashed rgba(var(--red-rgb),.7);cursor:text;min-height:1em;
}
body.edit img[data-slot],body.edit .phone-bezel,body.edit .marquee-phone{
  cursor:pointer;outline:1px dashed rgba(var(--red-rgb),.5);
}
.edit-bar{
  position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:80;
  display:flex;gap:12px;align-items:center;flex-wrap:wrap;
  background:#111;border:1px solid var(--red);border-radius:14px;
  padding:10px 14px;box-shadow:0 0 30px rgba(var(--red-rgb),.4);max-width:92vw;
}
.edit-bar span{font-size:.78rem;color:#ccc}
body.embed .edit-bar{bottom:8px}
body.edit{padding-bottom:70px}