/* вариант 2 "Ночь": темный, крупный шрифт, неоновые акценты, бегущие строки */
:root{
  color-scheme:dark;
  --bg:#0B090E;--paper:#17121B;--ink:#F7F2EC;--ink2:#CFC4CD;--mut:#8E8492;--line:#2B2231;
  --acc:#FF3D7F;--acc2:#B44DFF;--accSoft:rgba(255,61,127,.16);--lime:#D4FF3F;
  --gold:#FFC24A;--goldSoft:rgba(255,194,74,.16);
  --sh:0 1px 0 rgba(255,255,255,.04) inset,0 20px 40px -20px rgba(0,0,0,.8);
}
body{background:var(--bg)}
body:before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.07;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.top,.hero,.guide,.sec,footer,.band,.msgv{position:relative;z-index:1}
.top{z-index:40}
::selection{background:var(--lime);color:#000}

/* шапка */
.top{background:rgba(11,9,14,.72)}
.top.sc{border-color:var(--line)}
.logo{text-transform:uppercase;letter-spacing:.02em;font-weight:800}
.logo .h1{fill:var(--acc)}
.logo .h2{fill:var(--lime);mix-blend-mode:normal;opacity:.95}
.logo .lt b{letter-spacing:-.01em}
.nav a:hover{color:var(--lime)}
.btn.pri{background:var(--lime);color:#0B090E;box-shadow:0 0 0 0 rgba(212,255,63,.5),0 10px 30px -10px rgba(212,255,63,.55)}
.btn.pri:hover{box-shadow:0 0 0 6px rgba(212,255,63,.14),0 14px 34px -10px rgba(212,255,63,.7)}
.btn.gh{background:transparent;border:1px solid #3A2F40;color:var(--ink)}
.btn.gh:hover{border-color:var(--lime)}

/* первый экран: сияние за спиной и пятно за курсором */
.hero{overflow:hidden;padding:30px 0 40px}
.aur{position:absolute;inset:-20% -10% auto;height:900px;z-index:-1;pointer-events:none;filter:blur(70px);opacity:.75}
.aur i{position:absolute;border-radius:50%;mix-blend-mode:screen}
.aur i:nth-child(1){width:560px;height:560px;left:52%;top:8%;background:#FF3D7F;animation:au1 16s ease-in-out infinite alternate}
.aur i:nth-child(2){width:520px;height:520px;left:68%;top:30%;background:#7A3DFF;animation:au2 19s ease-in-out infinite alternate}
.aur i:nth-child(3){width:380px;height:380px;left:-6%;top:44%;background:#1E6BFF;opacity:.55;animation:au1 22s ease-in-out infinite alternate-reverse}
@keyframes au1{to{transform:translate(-140px,90px) scale(1.15)}}
@keyframes au2{to{transform:translate(120px,-80px) scale(.9)}}
.spot{position:absolute;width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;pointer-events:none;z-index:-1;
  background:radial-gradient(circle,rgba(212,255,63,.13),transparent 62%);left:30%;top:40%;transition:opacity .4s}
.live{background:rgba(255,255,255,.05);border-color:#2E2534;color:var(--ink2)}
.live .dot{background:var(--lime);animation:pingL 1.8s infinite}
@keyframes pingL{70%{box-shadow:0 0 0 9px rgba(212,255,63,0)}0%{box-shadow:0 0 0 0 rgba(212,255,63,.6)}}
h1{font-size:clamp(58px,9.2vw,148px);line-height:.86;letter-spacing:-.055em;font-weight:820;text-transform:uppercase;margin:22px 0 22px}
h1 em.s{color:var(--lime);text-transform:none;font-weight:400;letter-spacing:-.03em;font-size:.82em}
h1 .o{color:transparent;-webkit-text-stroke:2px var(--ink);transition:color .4s}
h1 .o:hover{color:var(--acc);-webkit-text-stroke-color:var(--acc)}
.lead{font-size:19px;color:var(--ink2)}
.hero .wrap{grid-template-columns:1.1fr .9fr}

/* поиск */
.search{background:rgba(23,18,27,.78);border:1px solid #2E2534;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.seg{background:#0F0C12;border:1px solid #2A2130}
.seg button{color:var(--mut)}
.seg button.on{background:var(--acc);color:#fff;box-shadow:0 6px 18px -6px rgba(255,61,127,.8)}
.sel select{background:#0F0C12;border-color:#2E2534;color:var(--ink)}
.sel select option{background:#17121B}
.sel:after{border-color:var(--lime)}
.rng .tr{background:#2E2534}
.rng .fl{background:linear-gradient(90deg,var(--acc),var(--lime))}
.rng input::-webkit-slider-thumb{background:#0B090E;border-color:var(--lime);box-shadow:0 0 0 4px rgba(212,255,63,.15)}
.rng input::-moz-range-thumb{background:#0B090E;border-color:var(--lime)}

/* стопка и орбиты */
.rings span{border-color:rgba(212,255,63,.16)}
.rings span:nth-child(2){border-color:rgba(255,61,127,.14)}
.rings span:nth-child(3){border-color:rgba(180,77,255,.12)}
.rings .wave{border-color:rgba(212,255,63,.45)}
@keyframes wave{0%{width:300px;height:300px;opacity:.9}100%{width:760px;height:760px;opacity:0}}
.orb{border-color:#0B090E;box-shadow:0 0 0 2px rgba(255,61,127,.7),0 10px 24px -8px rgba(255,61,127,.6)}
.orb b{background:var(--lime);border-color:#0B090E}
.card{border-radius:30px;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 40px 80px -30px rgba(255,61,127,.55),0 0 80px -30px rgba(180,77,255,.6)}
.card .nm{font-size:34px;font-weight:800;text-transform:uppercase;letter-spacing:-.03em}
.card .ct i{background:var(--lime)}
.card .tg span{background:rgba(212,255,63,.16);color:var(--lime);border:1px solid rgba(212,255,63,.25)}
.stamp.yes{color:var(--lime);border-color:var(--lime)}
.dbtn{background:#1C1620;border:1px solid #352B3B}
.dbtn svg{stroke:#CFC4CD}
.dbtn.like{background:var(--lime);border:0;box-shadow:0 0 0 0 rgba(212,255,63,.5),0 14px 34px -8px rgba(212,255,63,.7);animation:lk 2.4s infinite}
.dbtn.like svg{fill:#0B090E}
@keyframes lk{0%,70%,100%{box-shadow:0 0 0 0 rgba(212,255,63,.45),0 14px 34px -8px rgba(212,255,63,.7)}35%{box-shadow:0 0 0 14px rgba(212,255,63,0),0 14px 34px -8px rgba(212,255,63,.7)}}
.hint{background:#17121B;border-color:#2E2534;color:var(--ink2)}
.hint svg{color:var(--lime)}
.chip{background:rgba(23,18,27,.9);border:1px solid #2E2534;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.chip.c1 .ic{background:rgba(212,255,63,.14);color:var(--lime)}
.empty{background:rgba(23,18,27,.6);border-color:#3A2F40}
.heart{color:var(--lime)}

/* бегущие строки */
.band{overflow:hidden;padding:18px 0;margin:10px 0 0}
.band .row{display:flex;white-space:nowrap;font-weight:820;text-transform:uppercase;letter-spacing:-.02em;font-size:clamp(28px,4vw,54px);line-height:1;padding:14px 0}
.band .row span{display:inline-flex;align-items:center;gap:.5em;padding-right:.5em;animation:mq 26s linear infinite}
.band .row b{color:transparent;-webkit-text-stroke:1.5px currentColor;font-weight:820}
.band .row i{font-style:normal;font-size:.6em}
.band .r1{background:var(--lime);color:#0B090E;transform:rotate(-2deg);margin:0 -20px;box-shadow:0 20px 40px -20px rgba(212,255,63,.5)}
.band .r2{background:var(--acc);color:#fff;transform:rotate(1.5deg);margin:-12px -20px 0}
.band .r2 span{animation-direction:reverse;animation-duration:32s}
@keyframes mq{to{transform:translateX(-100%)}}

/* шаги демо */
.guide .wrap{background:var(--paper);border:1px solid var(--line)}
.gplay{background:var(--lime);color:#0B090E}
.gplay small{opacity:.65}
.gs{border-color:var(--line)}
.gs:hover{border-color:#4A3D52;background:#1C1620}
.gs .n{background:rgba(255,61,127,.16);color:var(--acc)}
.gs.on{border-color:var(--lime);background:rgba(212,255,63,.06)}
.gs.on .n{background:var(--lime);color:#0B090E}
.gs.ok .n{background:var(--acc);color:#fff}
.pulse:before{border-color:var(--lime)}
.gplay.pulse:before{border-color:var(--acc)}

/* разделы */
h2{font-size:clamp(40px,6vw,92px);line-height:.9;letter-spacing:-.05em;font-weight:820;text-transform:uppercase}
h2 em.s{color:var(--lime);text-transform:none;font-weight:400;letter-spacing:-.03em}
.sub{color:var(--ink2)}
.bar{background:rgba(11,9,14,.86)}
.bar .age,.tog{background:#17121B;border-color:#2E2534}
.tog i{background:#3A2F40}
.tog.on i{background:var(--lime)}
.tog.on i:after{background:#0B090E}

/* анкеты: имя поверх фото */
.pf{background:#17121B;box-shadow:0 0 0 1px #261E2B,0 20px 40px -24px rgba(0,0,0,.9);border-radius:22px}
.pf:hover{transform:translateY(-6px) rotate(-.6deg);box-shadow:0 0 0 1px var(--acc),0 26px 50px -20px rgba(255,61,127,.55)}
.pf .ph{background:#221A27}
.pf .ph:after{content:"";position:absolute;inset:auto 0 0;height:50%;background:linear-gradient(transparent,rgba(11,9,14,.9));pointer-events:none}
.pf .bd{position:absolute;left:0;right:56px;bottom:0;z-index:2;padding:14px 14px 13px;background:none!important}
.pf .nm{font-size:19px;font-weight:800;text-transform:uppercase;letter-spacing:-.02em;color:#fff}
.pf .nm i{background:var(--lime);box-shadow:0 0 10px var(--lime)}
.pf .ct{color:rgba(255,255,255,.72)}
.pf .lk{background:rgba(11,9,14,.6);border:1px solid rgba(255,255,255,.18);color:#fff;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.pf .lk.on{background:var(--acc);border-color:var(--acc)}
.pf.me .bd{position:static;padding:11px 13px 8px}
.pf.me .ph:after{display:none}
.t-up{background:var(--lime);color:#0B090E}
.t-pr{background:#0B090E;color:var(--gold);border:1px solid rgba(255,194,74,.5)}
.t-me{background:#fff;color:#0B090E}
.pf.hl{box-shadow:0 0 0 3px var(--c),0 0 40px -6px var(--c)}
.pf.pr{box-shadow:0 0 0 3px var(--gold),0 0 46px -8px rgba(255,194,74,.8)}
.pf.pr:hover{box-shadow:0 0 0 3px var(--gold),0 26px 50px -18px rgba(255,194,74,.9)}
.meact button{background:rgba(255,61,127,.16);color:#FF8FB5}
.meact button.pri{background:var(--lime);color:#0B090E}
.noresult{color:var(--ink2)}

/* услуги: три цветных блока с крупной ценой */
.svc{gap:14px}
.sv{border-radius:30px;padding:28px}
.sv h3{font-size:26px;font-weight:800;text-transform:uppercase;letter-spacing:-.03em}
.sv .pr{font-size:62px;font-weight:820;letter-spacing:-.05em;line-height:.9}
.sv .ttl{flex-direction:column-reverse;gap:14px}
.sv:nth-child(1){background:var(--lime);color:#0B090E}
.sv:nth-child(1) p,.sv:nth-child(1) .pr small{color:rgba(11,9,14,.7)}
.sv:nth-child(1) .demo{background:rgba(11,9,14,.08)}
.sv:nth-child(1) .btn.pri{background:#0B090E;color:var(--lime);box-shadow:none}
.sv:nth-child(2){background:linear-gradient(150deg,#FF3D7F,#B44DFF);color:#fff}
.sv:nth-child(2) p,.sv:nth-child(2) .pr small{color:rgba(255,255,255,.82)}
.sv:nth-child(2) .demo{background:rgba(11,9,14,.18)}
.sv:nth-child(2) .btn.pri{background:#fff;color:#0B090E;box-shadow:none}
.sv.prem{background:#0B090E;border:1px solid rgba(255,194,74,.45);box-shadow:0 0 60px -20px rgba(255,194,74,.45) inset}
.sv.prem .pr{color:var(--gold)}
.sv.prem .btn{background:var(--gold);color:#0B090E}
.mini{background:#17121B}
.mini div:before{background:#3A2F40}
.swatch button{border-color:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.2)}
.swatch button.on{box-shadow:0 0 0 3px #0B090E}
.note{color:var(--mut)}

/* как это работает */
.hw{background:#141017;border-color:var(--line);border-radius:28px;padding:26px}
.hw .n{font-family:var(--font);font-style:normal;font-weight:820;font-size:84px;letter-spacing:-.06em;color:transparent;-webkit-text-stroke:1.5px var(--lime)}
.hw b{font-size:21px;text-transform:uppercase;letter-spacing:-.02em;font-weight:800}
.cta{background:var(--lime);color:#0B090E}
.cta h2 em.s{color:#0B090E}
.cta .btn{background:#0B090E;color:var(--lime)}
.cta .faces{opacity:.28;filter:grayscale(1) contrast(1.2)}

footer{border-color:var(--line)}

/* окна */
.ov{background:rgba(5,3,7,.72)}
.dlg{background:#17121B;border:1px solid #2E2534;box-shadow:0 40px 80px -30px rgba(0,0,0,.9),0 0 60px -30px rgba(255,61,127,.4)}
.dlg .x{background:#251D2A;color:var(--ink)}
.dlg h3{text-transform:uppercase;font-weight:800;letter-spacing:-.03em}
.inp{background:#0F0C12;border-color:#2E2534;color:var(--ink)}
.inp::placeholder{color:#6E6372}
.inp:focus{border-color:var(--lime)}
.upl .pv{background-color:#251D2A}
.upl label{color:var(--lime)}
.tabs{background:#0F0C12;border:1px solid #2A2130}
.tabs button{color:var(--mut)}
.tabs button.on{background:var(--acc);color:#fff;box-shadow:none}
.dlg.pfl .big{background:#221A27}
.dlg.pfl .meta span{background:rgba(212,255,63,.12);color:var(--lime)}
.sum{background:#0F0C12;border:1px solid #2A2130}
.sum b{color:var(--lime)}
.qr svg{border-color:#fff}
.sbp{background:rgba(180,77,255,.18);color:#D9B3FF}
.spin{border-color:#2E2534;border-top-color:var(--lime)}
.okc{background:var(--lime);color:#0B090E}

/* тост и подсказка */
.toast{background:var(--lime);color:#0B090E;font-weight:650}
.tip{background:#17121B;border-color:#2E2534}
.tip small{color:var(--lime)}

/* вспышка "нравится" при свайпе вправо */
.zap{position:fixed;left:50%;top:50%;z-index:96;pointer-events:none;font-weight:820;text-transform:uppercase;letter-spacing:-.05em;
  font-size:clamp(60px,12vw,170px);line-height:.9;color:var(--lime);transform:translate(-50%,-50%) rotate(-8deg);
  text-shadow:0 0 40px rgba(212,255,63,.6);white-space:nowrap}

@media(max-width:900px){
  .hero .wrap{grid-template-columns:1fr}
  .aur{height:700px}
  h1{font-size:clamp(50px,15vw,92px)}
  .band .row{font-size:30px}
}
@media(max-width:560px){
  .sv .pr{font-size:50px}
  .hw .n{font-size:64px}
  .pf .nm{font-size:16px}
  .pf .bd{right:48px;padding:10px 10px 10px}
  .pf .lk{width:36px;height:36px}
}
@media(prefers-reduced-motion:reduce){.band .row span,.aur i{animation:none}}
.aur{-webkit-mask-image:linear-gradient(#000 55%,transparent 92%);mask-image:linear-gradient(#000 55%,transparent 92%)}
.sv .pr small{margin-left:6px;font-size:15px;letter-spacing:0}
@media(max-width:900px){.chip.c1{top:auto;bottom:230px;left:0}.chip.c2{top:auto;bottom:130px}}
.grid{align-items:start}
.pf .nm{font-size:clamp(14px,1.25vw,18px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.pf .nm i{display:inline-block;margin-left:6px;vertical-align:middle}
.pbar{background:#1A141E;color:var(--ink2);position:relative;z-index:41}
.pbar b{color:var(--lime)}
h1{font-size:clamp(48px,6.6vw,100px)}
@media(max-width:900px){h1{font-size:clamp(40px,12.6vw,84px)}}