/* «SHARQ» kirish sahnasi: oppoq fon, faqat qizcha va kitob (Kling videosidan kadrlar).
   Qizcha kitobni ko'taradi va ochadi -> kitob ichidan nur -> nur to'lqini qizchani, sarlavha va menyuni rangga kiritadi. */
.sx-intro{position:relative;height:360vh;background:#fff}
.sx-intro-stick{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#fff}

.sx-intro-girl{position:absolute;left:50%;top:var(--gt,10vh);height:var(--gh,min(84vh,150vw));aspect-ratio:720/1296;z-index:3;
  transform:translateX(-50%) scale(var(--zoom,1));transform-origin:50% 100%;will-change:transform}
.sx-intro-lay{position:absolute;inset:0;width:100%;height:100%;display:block}
.sx-intro-lay.bw{filter:grayscale(1) contrast(1.04)}
/* rangli qatlam quyosh botishi yorug'ligiga moslanadi */
.sx-intro-lay.col{filter:sepia(.14) saturate(1.06) brightness(1.02) contrast(1.02)}
/* oyoq ostidagi yer: kontakt soyasi va iliq yorug'lik halqasi (qizcha havoda turmasin) */
.sx-intro-girl::before{content:"";position:absolute;left:50%;bottom:-1.2%;width:78%;height:7%;transform:translateX(-50%);z-index:-1;
  border-radius:50%;opacity:var(--gr,0);pointer-events:none;
  background:radial-gradient(closest-side,rgba(40,22,8,.55),rgba(40,22,8,.28) 45%,rgba(40,22,8,0) 100%)}
.sx-intro-girl::after{content:"";position:absolute;left:50%;bottom:-6%;width:190%;height:22%;transform:translateX(-50%);z-index:-2;
  border-radius:50%;opacity:var(--gr,0);pointer-events:none;mix-blend-mode:screen;filter:blur(6px);
  background:radial-gradient(closest-side,rgba(255,214,140,.85),rgba(255,190,110,.4) 45%,rgba(255,190,110,0) 100%)}
.sx-intro-lay.col{
  -webkit-mask-image:radial-gradient(circle at var(--ox,50%) var(--oy,50%),#000 var(--rin,-1px),transparent var(--rout,0px));
          mask-image:radial-gradient(circle at var(--ox,50%) var(--oy,50%),#000 var(--rin,-1px),transparent var(--rout,0px))}

/* nur: kitob sahifalari orasidan (--lx/--ly = ekrandagi nuqta) */
.sx-intro-light{position:absolute;inset:0;z-index:4;pointer-events:none;mix-blend-mode:screen}
.sx-intro-glow,.sx-intro-rays,.sx-intro-wave{position:absolute;left:var(--lx,50%);top:var(--ly,60%);border-radius:50%;transform:translate(-50%,-50%)}
/* yumshoq porlash: sahifalar ustida, eni bo'yidan katta (yuzgacha yetmaydi) */
.sx-intro-glow{width:var(--gw,0px);aspect-ratio:1.9;opacity:var(--g,0);margin-top:calc(var(--gw,0px) * .06);filter:blur(10px);
  background:radial-gradient(closest-side,rgba(255,248,228,.95),rgba(255,232,180,.55) 38%,rgba(255,224,165,.18) 68%,rgba(255,224,165,0) 100%)}
/* mayin nur tolalari: faqat yon tomonlarga, o'rtasi (yuz) ochiq */
.sx-intro-rays{width:var(--rw,0px);aspect-ratio:1;opacity:var(--ra,0);filter:blur(9px);
  background:repeating-conic-gradient(from var(--rr,0deg),rgba(255,232,180,0) 0deg,rgba(255,232,180,.45) 5deg,rgba(255,232,180,0) 11deg);
  -webkit-mask-image:radial-gradient(closest-side,transparent 10%,#000 22%,rgba(0,0,0,.4) 55%,transparent 92%),
    conic-gradient(transparent 0 32deg,#000 55deg 78deg,transparent 100deg 260deg,#000 282deg 305deg,transparent 328deg);
  -webkit-mask-composite:source-in;
          mask-image:radial-gradient(closest-side,transparent 10%,#000 22%,rgba(0,0,0,.4) 55%,transparent 92%),
    conic-gradient(transparent 0 32deg,#000 55deg 78deg,transparent 100deg 260deg,#000 282deg 305deg,transparent 328deg);
          mask-composite:intersect}
/* nur to'lqini: keng va xira */
.sx-intro-wave{width:calc(var(--wr,0px) * 2);aspect-ratio:1;opacity:var(--wa,0);filter:blur(14px);
  background:radial-gradient(closest-side,rgba(255,236,190,0) 55%,rgba(255,228,170,.32) 86%,rgba(255,236,190,0) 100%)}
/* qizchaga kitobdan tushayotgan iliq yorug' (yuzni to'smaydi) */
.sx-intro-warm{position:absolute;inset:0;z-index:2;pointer-events:none;mix-blend-mode:soft-light;opacity:var(--wm,0);
  background:radial-gradient(ellipse 60% 30% at var(--ox,50%) var(--oy,50%),rgba(255,196,110,.9),rgba(255,196,110,.35) 55%,rgba(255,196,110,0) 100%)}

/* sarlavha: nur yetib kelganda ko'rinadi (maskani JS beradi) */
.sx-intro-title{position:absolute;left:0;right:0;top:var(--tt,3vh);text-align:center;z-index:5}
.sx-intro-title h1{display:inline-block;max-width:100%;white-space:normal;margin:0;padding:0 16px;
  font:800 clamp(26px,4.4vw,58px)/1.1 var(--sx-sans,"Inter",system-ui,sans-serif);color:#0E2357;letter-spacing:-.02em}
.sx-intro-title h1,.sx-intro .sx-intro-title p{text-shadow:0 0 18px rgba(255,250,240,.95),0 0 36px rgba(255,250,240,.75),0 0 4px rgba(255,255,255,.9)}
.sx-intro-title h1 .sx-serif{color:#9A6B1E}
.sx-intro-title h1 em{font-family:var(--sx-serif,"Playfair Display",Georgia,serif);font-weight:500;color:#B8893A}

@media (max-width:700px){
  .sx-intro-title h1{font-size:24px}
}

/* nur tarqalguncha sahifa foni ham oppoq */
body.sx-oq{background:#fff}
body{transition:background-color .8s}

/* butun ekran fon (tarix | bugun) — nur yetganda paydo bo'ladi */
.sx-intro-side.bg{position:absolute;inset:0;z-index:1}
/* fon: ozgina chuqurlik (qizcha oldinda, manzara orqada) va pastda iliq tuman — yer sifatida */
.sx-intro .sx-intro-side.bg .sx-intro-pic{filter:saturate(1.05)}
.sx-intro-side.bg::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to bottom,rgba(255,226,170,0) 62%,rgba(255,214,150,.38) 82%,rgba(255,206,140,.62) 100%)}
.sx-intro .sx-intro-pic{width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 60%;display:block}

/* sarlavha ostidagi matn */
.sx-intro .sx-intro-title p{max-width:640px;margin:14px auto 0;padding:0 16px;font:500 clamp(14px,1.25vw,18px)/1.5 var(--sx-sans,"Inter",system-ui,sans-serif);color:#22304f}

/* "pastga aylantiring" belgisi (sahifa ochilganda; aylantirganda yo'qoladi) */
.sx-intro-hint{position:absolute;z-index:7;bottom:calc(5vh + var(--off,0px));left:calc(50% + var(--gwid,300px) / 2 + 5vw);display:flex;flex-direction:column;align-items:center;gap:12px;
  color:#0E2357;pointer-events:none;transition:opacity .2s}
.sx-intro-hint b{white-space:nowrap;font:600 12px/1 var(--sx-sans,"Inter",system-ui,sans-serif);letter-spacing:.24em}
.sx-mouse{width:28px;height:44px;border:2px solid currentColor;border-radius:16px;position:relative;opacity:.85}
.sx-mouse i{position:absolute;left:50%;top:8px;width:4px;height:9px;margin-left:-2px;border-radius:2px;background:#B8893A;animation:sx-wheel 1.6s ease-in-out infinite}
.sx-intro-hint::after{content:"";width:10px;height:10px;border-right:2px solid #B8893A;border-bottom:2px solid #B8893A;transform:rotate(45deg);margin-top:-4px;animation:sx-arrow 1.6s ease-in-out infinite}
@keyframes sx-wheel{0%{transform:translateY(0);opacity:1}70%{transform:translateY(14px);opacity:0}100%{transform:translateY(0);opacity:0}}
@keyframes sx-arrow{0%,100%{transform:translateY(0) rotate(45deg);opacity:.4}50%{transform:translateY(6px) rotate(45deg);opacity:1}}
/* telefon: barmoq bilan tepaga surish belgisi */
.sx-swipe,.sx-h-m{display:none}
.sx-swipe svg{width:30px;height:30px;color:#0E2357}
@keyframes sx-swipe{0%{transform:translateY(10px);opacity:0}25%{opacity:1}80%{transform:translateY(-12px);opacity:1}100%{transform:translateY(-14px);opacity:0}}
@keyframes sx-arrow-up{0%,100%{transform:translateY(0) rotate(-135deg);opacity:.4}50%{transform:translateY(-6px) rotate(-135deg);opacity:1}}
@media (max-width:900px){
  .sx-mouse,.sx-h-d{display:none}
  .sx-swipe,.sx-h-m{display:block}
  .sx-swipe{animation:sx-swipe 1.8s ease-in-out infinite}
  .sx-intro-hint{flex-direction:column-reverse}
  .sx-intro-hint::after{transform:rotate(-135deg);margin:4px 0 -2px;animation-name:sx-arrow-up}
}
@media (max-width:900px){.sx-intro-hint{left:50%;bottom:calc(2.5vh + var(--off,0px));transform:translateX(-50%);gap:6px;background:rgba(255,255,255,.85);padding:8px 14px 6px;border-radius:14px}
  .sx-mouse{width:22px;height:34px}.sx-mouse i{top:6px;height:7px}}
@media (prefers-reduced-motion:reduce){.sx-mouse i,.sx-intro-hint::after,.sx-swipe{animation:none}}

/* sahna sahifa tepasidan boshlanadi: yuqori qatorlar uning ustida (nur yetganda ko'rinadi) */
.sx-test,.sx-top{position:relative;z-index:10}