:root{
  --cream:#fbf6ef;
  --blush:#f6e7e6;
  --blush-deep:#efd9dd;
  --rose:#c97b8e;
  --rose-soft:#e6a9b6;
  --sage:#9bb08a;
  --gold:#c9a86a;
  --ink:#5c4750;
  --ink-soft:#8a7680;
  --paper:#fffdf9;
  --shadow:24px 40px 80px -30px rgba(120,80,90,.45);
  --serif:"Cormorant Garamond","PT Serif",Georgia,serif;
  --sans:"PT Sans","Nunito",system-ui,sans-serif;
  --script:"Marck Script","PT Serif",cursive;
  --display:"Playfair Display","PT Serif",serif;
}

*{box-sizing:border-box}
html,body{margin:0}
body{
  font-family:var(--sans);
  color:var(--ink);
  background:linear-gradient(165deg,#fbf6ef 0%,#f6e7e6 48%,#efe1ea 100%);
  min-height:100vh;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body.locked{overflow:hidden;height:100vh}

/* ---------- фон ---------- */
.bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.blob{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55;mix-blend-mode:multiply}
.blob--1{width:46vw;height:46vw;left:-12vw;top:-10vw;background:radial-gradient(circle at 30% 30%,#f3c6d0,transparent 70%)}
.blob--2{width:52vw;height:52vw;right:-16vw;top:18vh;background:radial-gradient(circle at 60% 40%,#d9c8e6,transparent 70%)}
.blob--3{width:40vw;height:40vw;left:8vw;bottom:-14vw;background:radial-gradient(circle at 50% 50%,#cfe0c4,transparent 70%)}

.petals{position:absolute;inset:0}
.petal{
  position:absolute;top:-8vh;width:16px;height:16px;
  background:radial-gradient(circle at 30% 30%,#f6c9d3,#e39fb0);
  border-radius:0 100% 0 100%;
  opacity:.75;filter:blur(.3px);
  animation:fall linear infinite;
}
@keyframes fall{
  0%{transform:translateY(-10vh) rotate(0);opacity:0}
  10%{opacity:.8}
  100%{transform:translateY(115vh) rotate(560deg);opacity:.15}
}

/* ---------- переключатель языка ---------- */
.lang{
  position:fixed;top:16px;right:16px;z-index:20;
  display:flex;align-items:center;gap:6px;
  background:rgba(255,253,249,.75);backdrop-filter:blur(8px);
  border:1px solid rgba(201,168,106,.4);
  padding:6px 12px;border-radius:999px;
  box-shadow:0 10px 30px -12px rgba(120,80,90,.4);
}
.lang__btn{
  border:0;background:none;cursor:pointer;
  font-family:var(--sans);font-weight:700;font-size:.82rem;letter-spacing:.08em;
  color:var(--ink-soft);padding:2px 4px;transition:color .25s;
}
.lang__btn.is-active{color:var(--rose)}
.lang__sep{color:var(--ink-soft);opacity:.5}

/* ---------- ЭКРАН 1: КОНВЕРТ ---------- */
.stage{
  position:relative;z-index:5;
  min-height:100vh;min-height:100svh;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:34px;padding:24px;
  transition:opacity .7s ease,transform .7s ease;
}
.stage.gone{opacity:0;transform:scale(1.06);pointer-events:none}

.envelope{
  position:relative;width:min(82vw,420px);aspect-ratio:3/2;
  cursor:pointer;transform-style:preserve-3d;
  filter:drop-shadow(0 30px 45px rgba(120,80,90,.35));
  transition:transform .6s ease;
}
.envelope:focus-visible{outline:3px solid var(--gold);outline-offset:10px;border-radius:8px}
.envelope:hover{transform:translateY(-4px)}

.envelope__back,.envelope__front,.envelope__flap{position:absolute;inset:0}
.envelope__back{
  background:linear-gradient(135deg,#f3ded9,#e9cdc9);
  border-radius:10px;
}
.envelope__front{
  background:linear-gradient(135deg,#f7e6e0,#efd2cd);
  border-radius:10px;
  clip-path:polygon(0 22%,50% 74%,100% 22%,100% 100%,0 100%);
  z-index:4;
}
.envelope__flap{
  background:linear-gradient(135deg,#efd2cd,#e6bdb7);
  border-radius:10px 10px 4px 4px;
  clip-path:polygon(0 0,100% 0,50% 62%);
  transform-origin:top;
  transition:transform .7s cubic-bezier(.6,-0.2,.3,1.4),z-index 0s .35s;
  z-index:6;
  backface-visibility:hidden;
}
.envelope__seal{
  position:absolute;left:50%;top:52%;width:74px;height:74px;
  transform:translate(-50%,-50%);z-index:8;
  transition:transform .45s ease,opacity .45s ease;
}
.envelope__seal svg{width:100%;height:100%}
.envelope__seal circle{fill:#c97b8e;stroke:#b0647a;stroke-width:3}
.envelope__seal text{fill:#fff;font-family:var(--display);font-size:34px;font-weight:700;text-anchor:middle;dominant-baseline:central}

.envelope__letter{
  position:absolute;left:6%;right:6%;top:8%;bottom:8%;
  background:var(--paper);border-radius:6px;
  box-shadow:0 8px 24px rgba(120,80,90,.18);
  z-index:5;
  display:flex;align-items:center;justify-content:center;
  transform:translateY(0);opacity:0;
  transition:transform .8s cubic-bezier(.2,.8,.2,1) .25s,opacity .3s .25s;
}
.envelope__letter-inner{text-align:center;padding:10px}
.envelope__letter-inner .mono{
  display:block;font-family:var(--script);font-size:2.6rem;color:var(--rose);line-height:1
}
.envelope__letter-inner .mini-name{
  display:block;font-family:var(--display);font-size:1.5rem;color:var(--ink);margin-top:4px
}
.envelope__letter-inner .mini-sub{
  display:block;font-family:var(--serif);font-size:.95rem;color:var(--ink-soft);margin-top:2px
}

.envelope.is-open .envelope__flap{transform:rotateX(178deg);z-index:1}
.envelope.is-open .envelope__seal{transform:translate(-50%,-50%) scale(1.8);opacity:0}
.envelope.is-open .envelope__letter{transform:translateY(-58%) scale(1.04);opacity:1;z-index:9}

.open-hint{
  font-family:var(--serif);font-size:1.05rem;color:var(--ink-soft);
  letter-spacing:.04em;margin:0;
  animation:breathe 2.6s ease-in-out infinite;
}
@keyframes breathe{0%,100%{opacity:.5;transform:translateY(0)}50%{opacity:1;transform:translateY(-4px)}}
.open-hint.gone{opacity:0;transition:opacity .4s}

/* ---------- ЭКРАН 2: ПРИГЛАШЕНИЕ ---------- */
.invite{
  position:relative;z-index:5;
  max-width:640px;margin:0 auto;padding:64px 20px 90px;
}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

.hero{text-align:center;margin-bottom:46px}
.hero__kicker{
  font-family:var(--serif);letter-spacing:.42em;text-transform:uppercase;
  font-size:.8rem;color:var(--gold);margin:0 0 18px
}
.hero__wreath{position:relative;display:inline-block;color:var(--sage);padding:14px 30px}
.hero__wreath svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hero__name{
  position:relative;font-family:var(--script);font-size:clamp(3rem,13vw,4.6rem);
  color:var(--rose);line-height:1;display:block;
}
.hero__num{
  font-family:var(--display);font-weight:700;
  font-size:clamp(3.4rem,18vw,6rem);color:var(--ink);
  background:linear-gradient(160deg,#c97b8e,#c9a86a);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero__age{margin:6px 0 0}
.hero__age-word{font-family:var(--serif);font-size:1.15rem;color:var(--ink-soft);margin:2px 0 0;letter-spacing:.06em}

.card{
  background:rgba(255,253,249,.82);backdrop-filter:blur(6px);
  border:1px solid rgba(201,168,106,.28);
  border-radius:22px;padding:32px 26px;margin:20px 0;
  box-shadow:var(--shadow);
}
.card h2{
  font-family:var(--display);font-weight:600;font-size:1.5rem;
  color:var(--ink);margin:0 0 18px;text-align:center;
}
.card h2::after{
  content:"❧";display:block;color:var(--rose-soft);font-size:1rem;margin-top:6px
}
.greeting p{font-family:var(--serif);font-size:1.16rem;line-height:1.75;margin:0;text-align:center;color:var(--ink)}

.details__list{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:16px}
.details__list li{
  display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;
  column-gap:12px;align-items:center;
  padding-bottom:14px;border-bottom:1px dashed rgba(201,168,106,.35)
}
.details__list li:last-child{border-bottom:0;padding-bottom:0}
.details__ico{grid-row:1/3;font-size:1.3rem;text-align:center}
.details__label{font-family:var(--sans);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.details__value{font-family:var(--serif);font-size:1.12rem;color:var(--ink)}

.gallery__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px}
.gallery__grid img{width:100%;height:100%;aspect-ratio:3/4;object-fit:cover;border-radius:14px;box-shadow:0 12px 26px -12px rgba(120,80,90,.5)}

.cd{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;text-align:center}
.cd__cell{
  background:linear-gradient(160deg,#fdeef0,#f6e0e4);
  border-radius:14px;padding:14px 4px;
}
.cd__cell b{display:block;font-family:var(--display);font-weight:700;font-size:1.7rem;color:var(--rose)}
.cd__cell span{font-family:var(--sans);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}

/* ---------- кнопки ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--sans);font-weight:700;font-size:.95rem;letter-spacing:.03em;
  padding:13px 26px;border-radius:999px;border:1.5px solid transparent;
  cursor:pointer;transition:transform .2s ease,box-shadow .25s ease,background .25s;
  text-decoration:none;
}
.btn:active{transform:scale(.97)}
.btn--primary{
  background:linear-gradient(160deg,#d98a9e,#c97b8e);color:#fff;
  box-shadow:0 16px 30px -12px rgba(201,123,142,.8)
}
.btn--primary:hover{box-shadow:0 20px 38px -12px rgba(201,123,142,.95)}
.btn--ghost{background:rgba(255,255,255,.6);border-color:var(--rose-soft);color:var(--rose)}
.btn--ghost:hover{background:#fff}
.btn--text{background:none;color:var(--ink-soft);padding:13px 14px}
.btn--text:hover{color:var(--rose)}
.btn[disabled]{opacity:.6;pointer-events:none}

/* ---------- RSVP ---------- */
.rsvp{text-align:center}
.rsvp__q{font-family:var(--serif);font-size:1.2rem;color:var(--ink);margin:0 0 20px}
.rsvp__buttons{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:8px}
.rsvp__step{animation:soft .5s ease}
@keyframes soft{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

.field{display:block;text-align:left;margin:0 0 14px}
.field span{
  display:block;font-family:var(--sans);font-size:.76rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-soft);margin-bottom:6px
}
.field input{
  width:100%;padding:12px 14px;font-family:var(--serif);font-size:1.05rem;color:var(--ink);
  background:#fff;border:1.5px solid rgba(201,168,106,.4);border-radius:12px;outline:none;
  transition:border-color .2s
}
.field input:focus{border-color:var(--rose)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.form-error{color:#b0475a;font-family:var(--sans);font-size:.9rem;margin:0 0 12px}

.rsvp__result .result__ico{font-size:2.6rem;animation:pop .6s cubic-bezier(.2,1.4,.4,1)}
@keyframes pop{from{transform:scale(0)}to{transform:scale(1)}}
.rsvp__result h3{font-family:var(--display);font-size:1.5rem;color:var(--rose);margin:10px 0 8px}
.rsvp__result p{font-family:var(--serif);font-size:1.1rem;line-height:1.65;color:var(--ink);margin:0 0 18px}

/* ---------- подвал ---------- */
.foot{text-align:center;margin-top:44px;color:var(--ink-soft)}
.foot__flourish{display:block;color:var(--gold);font-size:1.2rem;margin-bottom:8px}
.foot p{font-family:var(--script);font-size:1.7rem;color:var(--rose);margin:0}

/* конфетти-лепестки при подтверждении */
.celebrate .petal{animation-duration:2.6s !important;opacity:1}

@media (max-width:420px){
  .cd__cell b{font-size:1.4rem}
  .card{padding:26px 20px}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;transition-duration:.001ms !important}
  .petal{display:none}
  .reveal{opacity:1;transform:none}
}
