:root{
  --green:#2E5637;
  --dgreen:#22412A;
  --gold:#C3A47A;
  --beige:#E4D5BC;
  --brown:#4A2C20;
  --ivory:#F7F2EA;
  --line:rgba(74,44,32,.16);
  --shell:min(100% - 2.5rem, 46rem);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--ivory);
  color:var(--brown);
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(1.05rem,.95rem + .5vw,1.28rem);
  line-height:1.6;
  font-variant-numeric:lining-nums;
}
img{max-width:100%;display:block}
h1,h2,h3,p,figure{margin:0}

.shell{width:var(--shell);margin-inline:auto}
.center{text-align:center}

/* ---------- монограмма ---------- */
.mono{
  width:4.4rem;height:4.4rem;border-radius:50%;
  border:1px solid var(--gold);
  display:grid;place-items:center;
  font-family:"Great Vibes",cursive;font-size:1.7rem;line-height:1;
  padding-bottom:.35rem;margin-inline:auto;
}
.mono--light{color:var(--gold)}
.mono--dark{color:var(--green)}

.eyebrow{
  font-size:.78rem;letter-spacing:.4em;text-indent:.4em;
  text-transform:uppercase;color:var(--gold);
}

/* ---------- обложка ---------- */
.hero{
  position:relative;overflow:hidden;
  background:var(--green);color:var(--ivory);
  padding:clamp(2.5rem,7vw,4.5rem) 0 clamp(3rem,8vw,5rem);
  text-align:center;
}
.hero::before{
  content:"";position:absolute;inset:0;
  background:url("pattern.svg") repeat;
  background-size:430px 574px;opacity:.9;
}
.hero > *{position:relative}
.hero .eyebrow{margin-top:1.4rem;color:var(--beige);opacity:.85}

.arch{
  width:min(20rem,82%);margin:clamp(1.8rem,5vw,2.6rem) auto 0;
  padding:.55rem;border:1px solid var(--gold);
  border-radius:14.6rem 14.6rem .4rem .4rem;
}
.arch img{
  width:100%;height:auto;
  border-radius:14rem 14rem .25rem .25rem;
}

.names{margin-top:clamp(1.6rem,5vw,2.4rem);line-height:1.04}
.names span{display:block;font-size:clamp(2.4rem,9vw,3.6rem);font-weight:400;letter-spacing:.1em;text-indent:.1em}
.names .amp{
  font-family:"Great Vibes",cursive;color:var(--gold);
  font-size:clamp(1.9rem,6vw,2.6rem);letter-spacing:0;text-indent:0;margin:.35rem 0;
}
.when{
  margin-top:1.6rem;color:var(--beige);
  font-size:.95rem;letter-spacing:.3em;text-indent:.3em;text-transform:uppercase;
}
.where{margin-top:.5rem;color:var(--beige);opacity:.75;font-size:.82rem;letter-spacing:.24em;text-indent:.24em;text-transform:uppercase}

/* ---------- секции ---------- */
section{padding:clamp(2.8rem,8vw,4.5rem) 0}
.lede{font-size:clamp(1.2rem,1rem + .9vw,1.5rem);line-height:1.55;max-width:34ch;margin-inline:auto}

.date{
  display:flex;align-items:center;justify-content:center;
  gap:clamp(.9rem,4vw,1.8rem);margin-top:2.6rem;
}
.date .col{
  font-size:.85rem;letter-spacing:.24em;text-indent:.24em;
  text-transform:uppercase;color:var(--green);font-weight:600;line-height:2;
}
.date .day{
  font-size:clamp(3.6rem,14vw,5rem);line-height:.9;color:var(--green);font-weight:600;
  padding-inline:clamp(.8rem,3vw,1.4rem);
  border-inline:1px solid var(--gold);
}

/* ---------- расписание ---------- */
.plan{max-width:24rem;margin:2.6rem auto 0;text-align:left}
.plan li{display:grid;grid-template-columns:4.2rem .6rem 1fr;align-items:center;gap:1rem;list-style:none}
.plan .time{font-size:1.5rem;font-weight:600;color:var(--green);text-align:right}
.plan .dot{width:.6rem;height:.6rem;border-radius:50%;background:var(--gold)}
.plan .what{font-size:.9rem;letter-spacing:.18em;text-indent:.18em;text-transform:uppercase}
.plan .gap{height:2.1rem;border-left:1px solid var(--gold);opacity:.55;margin-left:4.9rem;list-style:none}
.plan{padding:0;margin-block-start:2.6rem}

.place{margin-top:2.8rem}
.place .addr{font-size:1.35rem;font-weight:700;margin-top:.4rem}
.place a{color:var(--green);text-underline-offset:.25em}

/* ---------- кнопка ---------- */
.cta{background:#F1EADE;border-block:1px solid var(--line)}
.cta p{max-width:32ch;margin:.9rem auto 0}
.btn{
  display:inline-block;margin-top:1.6rem;
  padding:.9rem 2.4rem;border:1px solid var(--green);border-radius:2rem;
  background:var(--green);color:var(--ivory);
  font-family:inherit;font-size:1.05rem;letter-spacing:.08em;
  white-space:nowrap;text-align:center;text-decoration:none;cursor:pointer;
  box-shadow:0 6px 18px rgba(46,86,55,.18);
  transition:background .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.btn:hover,.btn:focus-visible{background:transparent;color:var(--green);box-shadow:0 4px 12px rgba(46,86,55,.12);transform:translateY(-1px)}
.btn:active{transform:translateY(0);box-shadow:0 3px 8px rgba(46,86,55,.16)}
.btn--ghost{background:transparent;color:var(--green);box-shadow:none}
.btn--ghost:hover,.btn--ghost:focus-visible{background:var(--green);color:var(--ivory)}
@media (max-width:360px){.btn{padding-inline:1.5rem;font-size:1rem;letter-spacing:.04em}}
:where(a,button,input,select,textarea):focus-visible{outline:2px solid var(--gold);outline-offset:3px}

.deadline{margin-top:1rem;font-size:.98rem;color:var(--green)}

/* ---------- палитра ---------- */
.dots{display:flex;justify-content:center;gap:.7rem;margin-top:1rem}
.dots span{width:2.1rem;height:2.1rem;border-radius:50%;box-shadow:0 0 0 1px rgba(74,44,32,.18)}

/* ---------- стих ---------- */
.verse{background:var(--dgreen);color:var(--ivory);text-align:center}
.verse blockquote{margin:0 auto;max-width:30ch;font-style:italic;font-size:clamp(1.25rem,1rem + 1vw,1.6rem)}
.verse cite{
  display:block;margin-top:1rem;font-style:normal;color:var(--gold);
  font-size:.82rem;letter-spacing:.28em;text-indent:.28em;text-transform:uppercase;
}
.sprig{width:9rem;margin:0 auto 1.4rem;opacity:.9}

/* ---------- подвал ---------- */
footer{background:var(--green);color:var(--beige);text-align:center;padding:2.6rem 0}
footer a{color:var(--ivory);text-decoration:none;font-size:1.2rem}
footer a:hover{text-decoration:underline}
.contacts{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem 2.6rem;margin-top:1.2rem}
.contacts .who{display:block;font-size:.76rem;letter-spacing:.26em;text-indent:.26em;text-transform:uppercase;color:var(--gold)}

/* ---------- форма ---------- */
/* .formhead делит обложку с первой страницей (.hero) */
.formhead .eyebrow{margin-top:1.4rem;color:var(--beige);opacity:.85}
.formhead .back{
  display:inline-block;margin-top:clamp(1.6rem,5vw,2.4rem);color:var(--beige);
  font-size:.98rem;text-underline-offset:.3em;
}

form{width:var(--shell);max-width:32rem;margin:0 auto}
.field{margin-top:2.1rem}
.field > label,.legend{
  display:block;font-size:.82rem;letter-spacing:.22em;text-indent:.22em;
  text-transform:uppercase;color:var(--green);font-weight:600;margin-bottom:.6rem;
}
.hint{font-size:.95rem;color:rgba(74,44,32,.7);margin:-.3rem 0 .6rem;letter-spacing:0;text-transform:none}
input[type=text],input[type=tel],input[type=number],input[type=date],textarea,select{
  width:100%;padding:.75rem .9rem;
  font-family:inherit;font-size:1.05rem;color:var(--brown);
  background:#FFFDF9;border:1px solid var(--line);border-radius:.35rem;
}
input[type=number]{max-width:8rem}
.dates{display:flex;gap:1rem;flex-wrap:wrap}
.dates .field{flex:1;min-width:9rem;margin-top:0}
textarea{min-height:6rem;resize:vertical}
fieldset{border:0;padding:0;margin:0}

.choice{display:flex;gap:.7rem}
.choice input{position:absolute;opacity:0;width:0;height:0}
.choice label{
  flex:1;text-align:center;padding:.7rem 1rem;cursor:pointer;
  border:1px solid var(--line);border-radius:.35rem;background:#FFFDF9;
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.choice input:checked + label{background:var(--green);border-color:var(--green);color:var(--ivory)}
.choice input:focus-visible + label{outline:2px solid var(--gold);outline-offset:3px}

.check{display:flex;align-items:flex-start;gap:.7rem;margin-top:.7rem}
.check input{margin-top:.45rem;accent-color:var(--green);width:1.1rem;height:1.1rem}
.check label{letter-spacing:0;text-transform:none;font-size:1.05rem;color:var(--brown);font-weight:400}

.err{color:#8C2F1E;font-size:.95rem;margin-top:.4rem}
[aria-invalid=true]{border-color:#8C2F1E}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.actions{margin:2.6rem 0 1rem;text-align:center}
.actions .btn{width:100%;max-width:20rem}
.actions .btn[disabled]{opacity:.55;cursor:progress}

.notice{
  margin-top:1.6rem;padding:1rem 1.2rem;border-left:3px solid var(--gold);
  background:#F1EADE;font-size:1rem;
}

.done{text-align:center;padding:1rem 0 2rem}
.done h2{font-size:clamp(1.8rem,6vw,2.4rem);color:var(--green);margin-bottom:.8rem}

/* ---------- анимация появления ---------- */
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* обложка: элементы поднимаются по очереди при загрузке */
.js .hero > *{animation:rise .8s cubic-bezier(.22,.61,.36,1) both}
.js .hero > *:nth-child(1){animation-delay:.05s}
.js .hero > *:nth-child(2){animation-delay:.13s}
.js .hero > *:nth-child(3){animation-delay:.21s}
.js .hero > *:nth-child(4){animation-delay:.29s}
.js .hero > *:nth-child(5){animation-delay:.37s}
.js .hero > *:nth-child(6){animation-delay:.45s}

/* секции проявляются по мере прокрутки */
.js [data-reveal]{opacity:0;transform:translateY(24px)}
.js [data-reveal].in{
  opacity:1;transform:none;
  transition:opacity .75s ease,transform .75s cubic-bezier(.22,.61,.36,1);
}

/* сворачиваемые блоки формы (плавное раскрытие) */
.js .collapse{
  display:grid;grid-template-rows:0fr;opacity:0;
  transition:grid-template-rows .4s ease,opacity .3s ease;
}
.js .collapse.open{grid-template-rows:1fr;opacity:1}
.js .collapse > .collapse__inner{overflow:hidden;min-height:0}

@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
  .js .hero > *,
  .js [data-reveal]{opacity:1!important;transform:none!important}
}
