@font-face{font-family:Onest;src:url("/fonts/onest-cyrillic.woff2") format("woff2");font-weight:400 900;font-display:swap;unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Onest;src:url("/fonts/onest-latin.woff2") format("woff2");font-weight:400 900;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F}
:root{--ink:#2b2540;--paper:#fbf8f2;--light:#f4f7fa;--night:#0d0a1c;color-scheme:light;font:500 16px/1.5 Onest,system-ui,sans-serif;color:#fff;background:var(--night)}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;padding:clamp(14px,3vw,44px);min-height:100svh;display:grid;align-items:center;background:#100c22 url("/assets/fblur0.png") center/cover fixed}
.frame{width:min(100%,1630px);margin:auto;min-height:min(850px,calc(100svh - 2 * clamp(14px,3vw,44px)));border-radius:28px;box-shadow:0 30px 80px #0a081980;display:flex;flex-direction:column;background:linear-gradient(100deg,rgba(13,10,28,.71),rgba(13,10,28,.48) 50%,rgba(13,10,28,.76)),url("/photos/sp1_palace_alley_notapir.jpg") center/cover}
.bar,footer{display:flex;align-items:center;gap:22px;padding:22px clamp(24px,4vw,58px)}
.bar{justify-content:space-between}
a,.link{color:inherit;text-underline-offset:3px}
a:hover,.link:hover{text-decoration:underline}
.brand{display:flex;align-items:center;gap:10px;font-size:28px;line-height:1;font-weight:900;letter-spacing:-.03em;text-decoration:none}
.home-link{font-size:14px;font-weight:700}
main{width:min(100%,870px);margin:auto;padding:8px 30px 26px}
h1{font-size:clamp(32px,4.1vw,56px);line-height:1.07;letter-spacing:-.045em;margin:0 0 clamp(22px,3vw,38px);text-wrap:balance}
.layout{display:grid;grid-template-columns:minmax(250px,.86fr) minmax(310px,1.15fr);gap:clamp(26px,4.4vw,65px);align-items:center}


button,select{font:inherit}
button:not(:disabled),select,.check{cursor:pointer}











.panel{min-width:0;background:rgba(13,10,28,.76);border:1px solid rgba(255,255,255,.25);border-radius:26px;padding:clamp(24px,2.7vw,38px);box-shadow:0 18px 46px #0a081942;backdrop-filter:blur(12px)}
h2{margin:0 0 10px;font-size:clamp(22px,2.2vw,29px);line-height:1.12;letter-spacing:-.035em;overflow-wrap:anywhere}
p{margin:0 0 15px}
#existingAccount:not(:first-child),#formSection:not([hidden]),#result:not([hidden]){margin-top:23px;padding-top:22px;border-top:1px solid #ffffff38}
#newAccount[hidden]+#existingAccount{margin-top:0;padding-top:0;border:0}
.button{display:inline-flex;min-height:46px;align-items:center;justify-content:center;padding:10px 20px;border:0;border-radius:99px;background:#fff;color:var(--ink);font-weight:750;font-size:15px;text-decoration:none;text-align:center}
.button:hover{text-decoration:none;background:#f1ecfa}
.secondary{background:transparent;color:white;border:1px solid #ffffff7a}
.secondary:hover{background:#ffffff1a}
button:disabled{opacity:.55}
.link{border:0;background:transparent;min-height:40px;padding:4px 0;text-decoration:underline;text-align:left}
.text-link, .legal a{font-weight:650}
:focus-visible{outline:3px solid #baa7ef;outline-offset:3px}
select{display:block;margin:5px 0 12px;padding:8px 14px;min-height:44px;border-radius:12px;background:#fff;color:var(--ink);border:0;max-width:100%}
.check{display:flex;gap:10px;align-items:center;min-height:48px}
.check input{width:20px;height:20px;flex:none;accent-color:#baa7ef;margin:0}
#details{white-space:pre-line;background:#ffffff16;padding:13px 16px;border-radius:14px;margin:12px 0}
.legal,footer{font-size:13px}
.actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
#notice{margin-top:16px}
.panel>:first-child:not([hidden]),#notice p,#access,#renewal p{margin-bottom:0}
#openCab{display:inline-block;margin-top:12px}
footer{justify-content:center;flex-wrap:wrap;gap:8px 20px}
@media(max-width:700px){
 body{padding:10px}
 .frame{border-radius:23px;min-height:calc(100svh - 20px)}
 .bar{padding:16px 18px}.brand{font-size:23px}.brand img{width:28px;height:28px}
 main{width:min(100%,500px);padding:14px 15px 18px}h1{font-size:33px;margin:0 0 18px}
 .layout{grid-template-columns:1fr;gap:14px}







 .panel{padding:21px 19px;border-radius:22px}
 #existingAccount:not(:first-child),#formSection:not([hidden]),#result:not([hidden]){margin-top:17px;padding-top:17px}
 footer{padding:14px 12px}
}
.layout.compact{display:block}
.compact .panel{max-width:580px}
main:has(.compact){max-width:640px}

main{width:min(100%,1220px)}
.layout{grid-template-columns:minmax(0,1.45fr) minmax(275px,.85fr);gap:clamp(20px,3vw,42px)}
.pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.plan{min-width:0;display:flex;flex-direction:column;color:var(--ink);border-radius:26px;background:#f4f7fa;padding:clamp(14px,2vw,28px);overflow:hidden}
#lightPlan{background:#ffefd9}
.plan h2{font-size:clamp(18px,2vw,29px);margin:0 0 18px}
.price{font-weight:850;font-size:clamp(30px,3.5vw,54px);letter-spacing:-.05em;line-height:1.05;white-space:nowrap;margin:0}
.unit{margin:3px 0 14px}.condition{font-size:clamp(14px,1.2vw,17px);line-height:1.35}
.art{width:100%;height:clamp(110px,12vw,180px);object-fit:contain;margin-top:auto}
.common{margin:14px 2px 0;font-size:15px}.invite{display:block;width:fit-content;margin-top:14px}
@media(max-width:760px){main{width:min(100%,560px)}.layout{grid-template-columns:1fr;gap:14px}.pair{gap:8px}.plan{padding:14px 11px;border-radius:19px}.plan h2{margin-bottom:11px}.price{font-size:clamp(28px,7.8vw,43px)}.art{height:86px}.unit{font-size:14px;margin-bottom:10px}.condition{margin-bottom:7px}.common{font-size:14px}}
.art{object-fit:cover;object-position:center 79%;mix-blend-mode:multiply}
.art.light{object-fit:contain;object-position:center bottom}

.pair{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}
.plan h2{line-height:1.16;overflow-wrap:normal;letter-spacing:-.04em}
@media(max-width:420px){
  .plan h2{font-size:clamp(15px,4.4vw,18px)}
}
@media(max-width:360px){
  .pair{grid-template-columns:minmax(0,.74fr) minmax(0,1.26fr)}
  .plan{padding-inline:8px}
  .plan h2{font-size:14px}
}
#regularPlan .art{object-fit:contain;object-position:center bottom;object-view-box:inset(42% 13% 0 13%)}

.email-line{display:flex;align-items:center;column-gap:14px;flex-wrap:wrap}
#receiptEmail,#promoCode{padding:10px 12px;min-height:44px;border:1px solid #ffffff70;border-radius:10px;color:var(--ink);background:#fff;font:inherit;width:min(100%,260px)}
.consent{align-items:flex-start;padding:8px 0;line-height:1.45;white-space:pre-line}
.consent input{margin-top:2px}
#details:empty{display:none}
#emailHint{margin:0 0 12px}

#promoBlock{margin:20px 0} #promoCode{min-width:0;text-transform:uppercase} #promoHint{line-height:1.5}