/* ===================================================================
   Partinu.ir — Coming Soon | Foton G7
   RTL · Vazirmatn · Glassmorphism · Ken Burns · Glow · Particles
   =================================================================== */

:root{
  --bg:        #0b0b0d;
  --bg-2:      #131318;
  --orange:    #ff7a18;
  --orange-2:  #ff9a3c;
  --orange-d:  #e2620a;
  --ink:       #f4f5f7;
  --ink-dim:   #b9bcc4;
  --glass:     rgba(20, 21, 26, .42);
  --glass-brd: rgba(255,255,255,.12);
  --radius:    22px;
  --shadow:    0 30px 80px rgba(0,0,0,.55);
  --ease:      cubic-bezier(.22,.61,.36,1);
}

*{ box-sizing:border-box; margin:0; padding:0; }

html{ -webkit-text-size-adjust:100%; }

body{
  font-family:'Vazirmatn', system-ui, -apple-system, 'Segoe UI', Tahoma, sans-serif;
  background:var(--bg);
  color:var(--ink);
  min-height:100svh;
  overflow-x:hidden;
  position:relative;
  line-height:1.85;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img,svg{ display:block; }
b{ font-weight:800; }

/* ============================ LOADER ============================ */
.loader{
  position:fixed; inset:0; z-index:100;
  display:grid; place-content:center; gap:26px;
  background:radial-gradient(120% 120% at 50% 40%, #16171c 0%, #0a0a0c 70%);
  transition:opacity .6s var(--ease), visibility .6s;
}
.loader.is-done{ opacity:0; visibility:hidden; }
.loader__logo{ position:relative; display:grid; place-items:center; }
.loader__ring{ animation:spin 1.15s linear infinite; }
.loader__ring circle{
  fill:none; stroke:var(--orange); stroke-width:4; stroke-linecap:round;
  stroke-dasharray:230; stroke-dashoffset:150;
  filter:drop-shadow(0 0 8px rgba(255,122,24,.7));
}
.loader__brand{
  position:absolute; font-weight:800; font-size:1.05rem; letter-spacing:.5px;
  color:var(--ink);
}
.loader__brand b{ color:var(--orange); }
.loader__bar{
  width:190px; height:4px; border-radius:99px;
  background:rgba(255,255,255,.1); overflow:hidden;
}
.loader__bar span{
  display:block; height:100%; width:40%; border-radius:99px;
  background:linear-gradient(90deg,var(--orange),var(--orange-2));
  animation:load 1.1s var(--ease) infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }
@keyframes load{ 0%{ transform:translateX(-120%);} 100%{ transform:translateX(320%);} }

/* ======================= SCENE (fully designed) ======================= */
.scene{ position:fixed; inset:0; z-index:0; overflow:hidden; background:#08070a; }

/* 1 — deep charcoal base with warm bloom on the left */
.scene__base{
  position:absolute; inset:0;
  background:
    radial-gradient(120% 95% at 22% 90%, rgba(255,122,24,.20), transparent 55%),
    radial-gradient(90% 80% at 90% 6%,  rgba(80,110,165,.10), transparent 60%),
    linear-gradient(160deg, #18130d 0%, #0d0c10 46%, #08070a 100%);
}

/* 2 — drifting warm light field = "Ken Burns" motion (parallax target) */
.scene__aurora{
  position:absolute; inset:-25%;
  background:
    radial-gradient(38% 46% at 30% 60%, rgba(255,140,40,.40), transparent 62%),
    radial-gradient(32% 40% at 58% 34%, rgba(255,86,10,.30),  transparent 62%),
    radial-gradient(26% 32% at 46% 82%, rgba(255,182,92,.20), transparent 62%);
  filter:blur(64px);
  mix-blend-mode:screen;
  transform:scale(1.05);
  opacity:0;
  will-change:transform;
  transition:opacity 1.4s var(--ease);
  animation:aurora 32s ease-in-out infinite alternate;
}
.scene.is-ready .scene__aurora{ opacity:1; }
@keyframes aurora{
  0%   { transform:scale(1.05) translate3d(-3%,-2%,0) rotate(0deg); }
  50%  { transform:scale(1.18) translate3d(4%,3%,0)   rotate(4deg); }
  100% { transform:scale(1.10) translate3d(-2%,4%,0)  rotate(-3deg); }
}

/* 3 — glowing orbs */
.scene__glow, .scene__glow2{
  position:absolute; border-radius:50%; mix-blend-mode:screen;
  pointer-events:none; will-change:transform; filter:blur(32px);
}
.scene__glow{
  width:60vmax; height:60vmax; left:4%; top:18%;
  background:radial-gradient(circle at center, rgba(255,122,24,.38) 0%, rgba(255,122,24,.12) 34%, transparent 64%);
  animation:floatGlow 18s ease-in-out infinite alternate;
}
.scene__glow2{
  width:44vmax; height:44vmax; right:-8%; bottom:-10%;
  background:radial-gradient(circle at center, rgba(255,170,70,.22) 0%, rgba(255,120,20,.08) 40%, transparent 66%);
  animation:floatGlow 24s ease-in-out infinite alternate-reverse;
}
@keyframes floatGlow{
  0%  { transform:translate3d(-4%,-3%,0) scale(1); }
  100%{ transform:translate3d(6%,5%,0)  scale(1.16); }
}

/* 4 — glowing G7 hex emblem = focal point (left, opposite the RTL text) */
.scene__emblem{
  position:absolute; left:9%; top:50%; transform:translateY(-50%);
  opacity:0; transition:opacity 1.6s var(--ease) .3s;
  animation:emblemPulse 7s ease-in-out infinite;
  pointer-events:none;
}
.scene.is-ready .scene__emblem{ opacity:.9; }
.scene__emblem svg{ display:block; max-width:42vw; height:auto; }
.em-outer{ fill:none; stroke:rgba(255,122,24,.55); stroke-width:1.2; }
.em-inner{
  fill:none; stroke:rgba(255,150,60,.30); stroke-width:.8; stroke-dasharray:6 6;
  transform-origin:100px 100px; animation:spinSlow 60s linear infinite;
}
.em-t{ fill:rgba(255,255,255,.10); font:800 44px 'Vazirmatn',sans-serif; letter-spacing:2px; }
@keyframes emblemPulse{
  0%,100%{ filter:drop-shadow(0 0 30px rgba(255,122,24,.28)); }
  50%    { filter:drop-shadow(0 0 62px rgba(255,122,24,.52)); }
}
@keyframes spinSlow{ to{ transform:rotate(360deg); } }

/* 5 — soft sweeping light beam */
.scene__streak{
  position:absolute; inset:-40%; pointer-events:none;
  background:linear-gradient(74deg, transparent 42%, rgba(255,175,80,.07) 50%, transparent 58%);
  animation:beam 15s ease-in-out infinite;
}
@keyframes beam{
  0%,100%{ transform:translateX(-25%); opacity:.35; }
  50%    { transform:translateX(20%);  opacity:.85; }
}

/* 6 — carbon-fibre micro texture */
.scene__carbon{
  position:absolute; inset:0; opacity:.5; pointer-events:none;
  background-image:
    repeating-linear-gradient(45deg, rgba(255,255,255,.022) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(-45deg, rgba(0,0,0,.10) 0 1px, transparent 1px 3px);
  background-size:5px 5px, 5px 5px;
  mask-image:radial-gradient(140% 120% at 30% 50%, #000 30%, transparent 85%);
}

/* 7 — subtle tech grid */
.scene__grid{
  position:absolute; inset:0; opacity:.05; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.6) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.6) 1px, transparent 1px);
  background-size:48px 48px;
  mask-image:radial-gradient(120% 120% at 26% 45%, #000 16%, transparent 72%);
}

/* 8 — legibility gradient — darkest on the RIGHT where RTL text sits */
.scene__overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(8,7,10,.08) 0%, rgba(8,7,10,.30) 40%, rgba(8,7,10,.72) 78%, rgba(8,7,10,.88) 100%),
    linear-gradient(0deg,  rgba(8,7,10,.55) 0%, transparent 46%);
}

/* 9 — vignette */
.scene__vignette{
  position:absolute; inset:0; pointer-events:none;
  box-shadow:inset 0 0 220px 40px rgba(0,0,0,.72);
}

.scene__particles{
  position:absolute; inset:0; width:100%; height:100%;
  pointer-events:none;
}

/* ============================ LAYOUT ============================ */
.wrap{
  position:relative; z-index:2;
  min-height:100svh;
  display:flex; align-items:center;
  padding:clamp(20px,5vw,64px);
  padding-inline-start:clamp(20px,7vw,110px);
}

/* ============================ GLASS CARD ============================ */
.glass{
  background:var(--glass);
  border:1px solid var(--glass-brd);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  backdrop-filter:blur(18px) saturate(140%);
  box-shadow:var(--shadow), inset 0 1px 0 rgba(255,255,255,.08);
}
.card{
  width:min(620px, 100%);
  border-radius:var(--radius);
  padding:clamp(26px,4vw,48px);
  position:relative;
  overflow:hidden;
}
.card::before{               /* top orange hairline highlight */
  content:''; position:absolute; inset:0 0 auto 0; height:2px;
  background:linear-gradient(90deg,transparent, var(--orange), transparent);
  opacity:.8;
}

/* Brand */
.brand{ display:flex; align-items:center; gap:12px; margin-bottom:18px; }
.brand__mark .hex{ fill:none; stroke:var(--orange); stroke-width:2.4; filter:drop-shadow(0 0 6px rgba(255,122,24,.5)); }
.brand__mark .hex-t{ fill:var(--ink); font:800 13px 'Vazirmatn',sans-serif; }
.brand__name{ font-weight:800; font-size:1.4rem; letter-spacing:.3px; }
.brand__name b{ color:var(--orange); }

/* Eyebrow chip */
.eyebrow{
  display:inline-block; font-size:.82rem; font-weight:700;
  color:var(--orange-2);
  background:rgba(255,122,24,.1);
  border:1px solid rgba(255,122,24,.32);
  padding:5px 14px; border-radius:99px; margin-bottom:18px;
}

/* Headline */
.headline{
  font-size:clamp(3rem, 9vw, 5.4rem);
  font-weight:900; line-height:1.05; letter-spacing:-1px;
  background:linear-gradient(180deg,#fff 30%, #d8d9de 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  text-shadow:0 4px 40px rgba(0,0,0,.35);
}
.headline .dots{ color:var(--orange); -webkit-text-fill-color:var(--orange); }

.subhead{
  font-size:clamp(1.15rem, 3.4vw, 1.7rem);
  font-weight:700; margin-top:10px; color:var(--ink);
}
.subhead .hl{ color:var(--orange); }

.lede{
  margin-top:16px; max-width:46ch;
  font-size:clamp(.98rem, 2.6vw, 1.12rem);
  color:var(--ink-dim); font-weight:400;
}
.lede b{ color:var(--orange-2); }

/* Features */
.features{
  list-style:none; display:flex; flex-wrap:wrap; gap:10px 14px;
  margin:26px 0 4px;
}
.feature{
  display:inline-flex; align-items:center; gap:8px;
  font-size:.92rem; font-weight:600; color:var(--ink);
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  padding:8px 14px; border-radius:12px;
  transition:transform .3s var(--ease), border-color .3s, background .3s;
}
.feature:hover{ transform:translateY(-3px); border-color:rgba(255,122,24,.5); background:rgba(255,122,24,.08); }
.feature__ic{ width:17px; height:17px; fill:var(--orange); flex:none; }

/* ============================ BUTTONS ============================ */
.contacts{ display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }

.btn{
  --tx:0; --ty:0; --rx:0; --ry:0;
  position:relative; overflow:hidden;
  display:inline-flex; align-items:center; gap:10px;
  padding:13px 20px; border-radius:14px;
  font:700 .98rem 'Vazirmatn',sans-serif; color:var(--ink);
  text-decoration:none; cursor:pointer;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  transform:perspective(700px) rotateX(var(--rx)) rotateY(var(--ry)) translate3d(var(--tx),var(--ty),0);
  transition:transform .18s var(--ease), box-shadow .3s, border-color .3s, background .3s;
  will-change:transform;
}
.btn__ic{ width:19px; height:19px; fill:currentColor; flex:none; }
.btn__txt{ direction:ltr; unicode-bidi:plaintext; }
.btn:hover{ border-color:rgba(255,122,24,.55); box-shadow:0 12px 30px rgba(0,0,0,.4); }

/* moving light sweep on buttons */
.btn__shine{
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(115deg, transparent 30%, rgba(255,255,255,.28) 50%, transparent 70%);
  transform:translateX(-160%);
}
.btn:hover .btn__shine{ animation:sweep .9s var(--ease); }
@keyframes sweep{ to{ transform:translateX(160%); } }

.btn--primary{
  background:linear-gradient(135deg,var(--orange),var(--orange-d));
  border-color:transparent; color:#1a0e02;
  box-shadow:0 10px 26px rgba(255,122,24,.4);
}
.btn--primary:hover{ box-shadow:0 16px 40px rgba(255,122,24,.55); }

/* ===================== REVEAL (fade + blur in) ===================== */
.reveal{
  opacity:0; transform:translateY(22px);
  filter:blur(10px);
  transition:opacity .9s var(--ease), transform .9s var(--ease), filter .9s var(--ease);
}
.reveal.is-in{ opacity:1; transform:none; filter:blur(0); }

/* ============================ RESPONSIVE ============================ */
@media (max-width:1024px){
  .wrap{ padding-inline-start:clamp(20px,5vw,60px); }
  .scene__emblem svg{ max-width:52vw; }
  .scene__emblem{ left:4%; opacity:.7; }
  .scene__overlay{
    background:
      linear-gradient(90deg, rgba(8,7,10,.14) 0%, rgba(8,7,10,.5) 48%, rgba(8,7,10,.82) 100%),
      linear-gradient(0deg,  rgba(8,7,10,.6) 0%, transparent 55%);
  }
}

@media (max-width:640px){
  body{ line-height:1.7; }
  .wrap{ align-items:flex-end; padding:16px; padding-bottom:26px; }
  .card{ width:100%; padding:24px 20px; }
  .scene__overlay{
    background:
      linear-gradient(0deg, rgba(8,7,10,.95) 10%, rgba(8,7,10,.5) 48%, rgba(8,7,10,.55) 100%);
  }
  .scene__glow{ left:-12%; top:-8%; }
  /* emblem floats near the top on mobile, out of the way of the bottom card */
  .scene__emblem{ top:30%; left:50%; transform:translate(-50%,-50%); opacity:.5; }
  .scene__emblem svg{ max-width:66vw; }
  .scene__vignette{ box-shadow:inset 0 0 140px 24px rgba(0,0,0,.7); }
  .headline{ font-size:clamp(2.6rem,15vw,3.4rem); }
  .contacts{ gap:10px; }
  .btn{ flex:1 1 100%; justify-content:center; }
  .btn--primary{ order:-1; }
}

@media (max-width:380px){
  .features{ gap:8px; }
  .feature{ font-size:.84rem; padding:7px 11px; }
}

/* Large screens — keep card left-anchored (RTL start = right, content reads well) */
@media (min-width:1600px){
  .card{ width:min(680px,100%); }
}

/* ===================== ACCESSIBILITY / PERF ===================== */
@media (prefers-reduced-motion:reduce){
  .scene__aurora,
  .scene__glow,
  .scene__glow2,
  .scene__emblem,
  .em-inner,
  .scene__streak{ animation:none; }
  .loader__ring{ animation-duration:2s; }
  .reveal{ transition-duration:.01ms; }
  .btn:hover .btn__shine{ animation:none; }
}