:root{
  /* Официальная палитра сайта KAIS Fest */
  --cobalt:#0048A3; --cobalt-d:#003A85; --flag:#003478; --navy:#1A2F6F; --navy-deep:#0A1B43; --ink:#0F172A;
  --orange:#FF4D14; --teal:#4DBFC0; --mint:#99E5E5;
  --gold:#C8A24C; --gold-d:#9A7A33; --gold-l:#F0DCA0; --gold-deep:#5C4517;
  --mid-1:#0C1530; --mid-2:#080E20; --mid-3:#05080F;
  --paper:#F4F5F9; --line:#E3E6F0; --slate:#5B6079;
  --sans:"Inter", system-ui, sans-serif;
}
*{box-sizing:border-box; margin:0; padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans); color:var(--ink); background:var(--paper); overflow-x:hidden}
body.locked{overflow:hidden; height:100vh}
b{font-weight:700; color:var(--cobalt)}

/* ============================================================
   КОНВЕРТ — премиальный
   ============================================================ */
.cover{position:fixed; inset:0; z-index:100; display:flex; align-items:center; justify-content:center; overflow:hidden;
  background:
    radial-gradient(120% 85% at 50% -8%, rgba(26,47,111,.6), transparent 55%),
    radial-gradient(150% 130% at 50% 118%, rgba(0,72,163,.16), transparent 60%),
    linear-gradient(180deg, var(--mid-1) 0%, var(--mid-2) 55%, var(--mid-3) 100%);
  transition:opacity .7s ease .75s, visibility 0s linear 1.45s}
.cover.open{opacity:0; visibility:hidden}

/* зернистость для глубины */
.cover-grain{position:absolute; inset:0; pointer-events:none; opacity:.32; mix-blend-mode:overlay;
  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='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E")}

/* диагональные клапаны */
.flap{position:absolute; inset:0; transition:transform 1.2s cubic-bezier(.76,0,.24,1); will-change:transform; z-index:2}
.flap-l{clip-path:polygon(0 0, 100% 0, 0 100%);
  background:linear-gradient(150deg, rgba(255,255,255,.045), rgba(0,0,0,.18) 60%, rgba(0,0,0,.42));
  box-shadow:6px 6px 34px rgba(0,0,0,.45)}
.flap-r{clip-path:polygon(100% 0, 100% 100%, 0 100%);
  background:linear-gradient(330deg, rgba(255,255,255,.03), rgba(0,0,0,.22) 55%, rgba(0,0,0,.48))}
.cover.open .flap-l{transform:translate(-118%,-118%)}
.cover.open .flap-r{transform:translate(118%,118%)}

/* золотая рамка */
.cover-frame{position:absolute; inset:22px; border:1px solid rgba(200,162,76,.42); border-radius:3px; pointer-events:none; z-index:3}
.cover-frame::before{content:""; position:absolute; inset:6px; border:1px solid rgba(200,162,76,.16); border-radius:2px}

.cover-content{position:relative; z-index:4; text-align:center; padding:30px; max-width:560px;
  transition:opacity .55s ease, transform .6s ease}
.cover.open .cover-content{opacity:0; transform:scale(.94)}
.falcon{width:82px; height:94px; margin:0 auto 24px;
  background:linear-gradient(158deg, #F6EAC6 0%, #E1C277 38%, #C8A24C 62%, #9E7C32 100%);
  -webkit-mask:url("../assets/falcon-mask.png") center/contain no-repeat;
  mask:url("../assets/falcon-mask.png") center/contain no-repeat;
  filter:drop-shadow(0 5px 16px rgba(200,162,76,.45));
  animation:falconRise 1s ease both .15s}
@keyframes falconRise{from{opacity:0; transform:translateY(10px)}to{opacity:1; transform:none}}
.cover-eyebrow{letter-spacing:.42em; text-transform:uppercase; font-size:clamp(11px,2.6vw,14px); font-weight:500; color:var(--gold-l);
  padding-left:.42em}
.cover-title{margin-top:18px; font-weight:800; letter-spacing:.05em; line-height:1; font-size:clamp(46px,12vw,88px);
  text-shadow:0 2px 30px rgba(0,0,0,.45);
  background:linear-gradient(180deg, #FFFDF8 0%, #F3E8CC 58%, #DBC289 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent}
.cover-rule{display:flex; align-items:center; justify-content:center; gap:14px; margin:16px 0 4px;
  color:var(--gold); font-size:13px; letter-spacing:.3em; font-weight:500}
.cover-rule span{height:1px; width:46px; background:linear-gradient(90deg, transparent, var(--gold))}
.cover-rule span:last-child{background:linear-gradient(90deg, var(--gold), transparent)}

/* печать — реалистичный воск/золото */
.seal{appearance:none; border:0; background:none; cursor:pointer; position:relative; width:138px; height:138px;
  margin:46px auto 38px; display:block; animation:sealFloat 4.2s ease-in-out infinite; transition:transform .25s}
.seal:hover{transform:translateY(-3px) scale(1.03)}
@keyframes sealFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.seal-glow{position:absolute; inset:-28px; border-radius:50%; z-index:0;
  background:radial-gradient(circle, rgba(200,162,76,.42), transparent 66%); filter:blur(7px); animation:glowPulse 4.2s ease-in-out infinite}
@keyframes glowPulse{0%,100%{opacity:.55}50%{opacity:.9}}
.seal-disc{position:absolute; inset:0; border-radius:50%; overflow:hidden; z-index:1;
  background:radial-gradient(circle at 38% 30%, #F6EAC6 0%, #D8B65E 42%, #9E7C32 100%);
  box-shadow:inset 0 4px 9px rgba(255,255,255,.55), inset 0 -12px 24px rgba(60,42,8,.55),
             inset 0 0 0 7px rgba(255,255,255,.09), 0 18px 36px rgba(0,0,0,.6)}
.seal-disc::after{content:""; position:absolute; inset:12px; border-radius:50%; border:1.5px solid rgba(70,52,15,.45)}
.seal-disc::before{content:""; position:absolute; inset:0; border-radius:50%;
  background:linear-gradient(115deg, transparent 36%, rgba(255,255,255,.55) 50%, transparent 64%);
  background-size:260% 260%; animation:shine 5.5s ease-in-out infinite}
@keyframes shine{0%{background-position:200% 0}55%,100%{background-position:-70% 0}}
.seal-label{position:absolute; inset:0; z-index:2; display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:14px; letter-spacing:.2em; text-transform:uppercase; color:#473714; padding-left:.2em;
  text-shadow:0 1px 0 rgba(255,255,255,.25)}
.seal.crack{animation:sealCrack .65s cubic-bezier(.5,-0.4,.6,1) forwards}
@keyframes sealCrack{35%{transform:scale(1.14) translateY(-6px)}100%{transform:scale(.18) rotate(38deg); opacity:0}}

.cover-hint{margin-top:6px; color:#B9C6E6; font-size:14px; line-height:1.7}
.cover-hint span{font-size:12.5px; color:#8190B6; font-style:italic}

/* ============================================================
   САЙТ
   ============================================================ */
.site{max-width:680px; margin:0 auto; padding:0 22px 150px; opacity:0; transition:opacity .8s ease .9s}
.site.show{opacity:1}
.reveal{opacity:0; transform:translateY(30px); transition:opacity .8s ease, transform .8s ease}
.reveal.in{opacity:1; transform:none}

.hero{text-align:center; padding:72px 0 10px}
.hero-eyebrow{letter-spacing:.32em; text-transform:uppercase; font-size:12px; color:var(--slate); font-weight:600}
.hero-title{font-weight:900; letter-spacing:.05em; font-size:clamp(54px,15vw,104px); line-height:.95; margin:10px 0;
  background:linear-gradient(180deg, var(--cobalt), var(--navy)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent}
.hero-tagline{font-style:italic; font-weight:300; font-size:clamp(16px,4vw,22px); color:var(--cobalt)}
.divider{display:flex; align-items:center; justify-content:center; gap:14px; margin:30px 0; color:var(--gold)}
.divider::before,.divider::after{content:""; height:1px; width:64px; background:linear-gradient(90deg, transparent, var(--gold))}
.divider::after{background:linear-gradient(90deg, var(--gold), transparent)}
.divider span{font-size:12px}

.block{text-align:center; padding:18px 0}
.block-h{font-weight:700; font-size:clamp(23px,5.6vw,32px); color:var(--navy); margin-bottom:18px; line-height:1.3; letter-spacing:-.01em}
.block p{font-size:17px; line-height:1.78; color:#2C3650; margin:0 auto 14px; max-width:560px}
.muted{color:var(--slate); font-style:italic; font-size:15px}
.center{text-align:center}

/* инфо-блок */
.infoband{text-align:center; background:linear-gradient(180deg,#fff, var(--paper)); border:1px solid var(--line);
  border-top:4px solid var(--gold); border-radius:20px; padding:32px 22px; margin:28px 0;
  box-shadow:0 24px 50px -30px rgba(15,23,42,.5)}
.info-date{font-weight:800; font-size:clamp(22px,5.5vw,30px); color:var(--navy)}
.info-time{font-size:20px; color:var(--cobalt); margin-top:4px; font-weight:600}
.info-place{margin-top:12px; color:var(--ink); line-height:1.6}
.info-place span{color:var(--slate); font-size:14px}
.btn-ghost{display:inline-block; margin-top:18px; border:1.5px solid var(--cobalt); color:var(--cobalt); text-decoration:none;
  padding:11px 26px; border-radius:40px; font-weight:600; font-size:13px; letter-spacing:.05em; transition:.2s}
.btn-ghost:hover{background:var(--cobalt); color:#fff}

/* countdown */
.countdown{text-align:center; padding:24px 0 8px}
.cd-title{letter-spacing:.26em; font-size:12px; color:var(--slate); font-weight:600; margin-bottom:18px}
.cd-grid{display:flex; justify-content:center; gap:10px}
.cd-cell{flex:1; max-width:94px; background:linear-gradient(180deg,var(--cobalt),var(--navy)); color:#fff; border-radius:16px; padding:18px 6px;
  box-shadow:0 18px 34px -20px rgba(0,72,163,.85)}
.cd-num{display:block; font-size:clamp(26px,8vw,38px); font-weight:800; line-height:1; color:#fff}
.cd-lbl{display:block; margin-top:6px; font-size:11px; letter-spacing:.1em; color:var(--mint); text-transform:uppercase}

/* RSVP */
.rsvp{text-align:center; padding:46px 0 10px}
.rsvp-count{display:inline-block; margin:16px auto 0; padding:9px 20px; border-radius:40px;
  background:linear-gradient(180deg,#FBF4E2,#F3E6C2); border:1px solid rgba(200,162,76,.55);
  color:var(--gold-deep); font-weight:600; font-size:14px; animation:pop .5s ease}
.rsvp-count b{color:var(--cobalt)}
.fld-name{max-width:480px; margin:22px auto 4px}
.rsvp-options{display:flex; flex-direction:column; gap:12px; max-width:480px; margin:14px auto 22px}
.rsvp-opt{display:flex; align-items:center; gap:12px; text-align:left; border:1.5px solid var(--line); border-radius:40px;
  padding:15px 22px; cursor:pointer; transition:.2s; background:#fff; font-size:15px}
.rsvp-opt:hover{border-color:var(--cobalt)}
.rsvp-opt input{accent-color:var(--cobalt); width:18px; height:18px; flex:0 0 auto}
.rsvp-opt:has(input:checked){border-color:var(--cobalt); background:#eef4ff; box-shadow:0 0 0 3px rgba(0,72,163,.1)}
.btn-primary{appearance:none; border:0; cursor:pointer; background:linear-gradient(180deg,var(--cobalt),var(--navy)); color:#fff;
  padding:15px 40px; border-radius:40px; font-weight:700; letter-spacing:.05em; font-size:14px; margin-top:6px;
  box-shadow:0 18px 36px -16px rgba(0,72,163,.9); transition:.2s}
.btn-primary:hover{transform:translateY(-2px)}
.btn-primary:disabled{opacity:.6; cursor:default; transform:none}
.form-note{display:none; margin-top:18px; color:#1f8a52; font-weight:600}
.form-note.show{display:block; animation:pop .4s ease}
@keyframes pop{0%{transform:scale(.85);opacity:0}100%{transform:scale(1);opacity:1}}

/* footer */
.foot{text-align:center; padding:64px 0 0; color:var(--slate)}
.foot p{margin:4px 0}
.foot-sign{font-style:italic; font-weight:300; color:var(--cobalt); font-size:19px}
.foot-by{font-size:12px; letter-spacing:.2em; text-transform:uppercase; margin-top:14px; color:#9AA0BB}

/* FAB */
.fab{position:fixed; bottom:20px; right:18px; z-index:60; cursor:pointer; font-weight:600; font-size:13.5px;
  display:flex; align-items:center; gap:8px; padding:14px 24px; border-radius:40px; color:var(--gold-l);
  background:linear-gradient(180deg,#16224A,#0C1530); border:1px solid rgba(200,162,76,.5);
  box-shadow:0 16px 34px -14px rgba(5,8,15,.7); opacity:0; transform:translateY(20px);
  transition:opacity .5s ease 1.2s, transform .5s ease 1.2s, filter .2s, box-shadow .2s}
.site.show ~ .fab{opacity:1; transform:none}
.fab:hover{filter:brightness(1.12); box-shadow:0 18px 38px -12px rgba(5,8,15,.8)}

/* модалка */
.modal{position:fixed; inset:0; z-index:120; background:rgba(7,15,40,.6); backdrop-filter:blur(5px);
  display:flex; align-items:center; justify-content:center; padding:20px; opacity:0; visibility:hidden; transition:.25s}
.modal.open{opacity:1; visibility:visible}
.modal-card{background:#fff; border-radius:24px; padding:28px; width:100%; max-width:440px; box-shadow:0 36px 80px -24px rgba(0,0,0,.55);
  transform:translateY(18px); transition:.3s}
.modal.open .modal-card{transform:none}
.modal-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:18px}
.modal-head h3{font-size:22px; color:var(--navy); font-weight:700}
.modal-x{border:0; background:#f0f3fa; width:38px; height:38px; border-radius:50%; font-size:22px; cursor:pointer; color:var(--slate)}
.fld{display:block; text-align:left; font-weight:600; color:var(--navy); font-size:14px; margin-bottom:16px}
.fld input,.fld textarea{width:100%; margin-top:8px; border:1.5px solid var(--line); border-radius:12px; padding:13px 16px;
  font-family:var(--sans); font-size:15px; color:var(--ink); outline:none; transition:.2s; resize:vertical}
.fld textarea{min-height:120px}
.fld input:focus,.fld textarea:focus{border-color:var(--cobalt); box-shadow:0 0 0 3px rgba(0,72,163,.12)}
.modal .btn-primary{width:100%}

@media(max-width:520px){
  .fab{padding:13px 18px; font-size:13px}
  .cd-cell{padding:14px 4px}
  .cover-content{padding:24px}
}