/* ============================================================
   sections.css — hero, лист, фото, финал, футер
   ============================================================ */

/* ============================================================
   1. HERO
   ============================================================ */
.hero{
  position:relative;
  isolation:isolate;
  display:grid;
  place-items:center;
  min-height:100svh;
  padding:clamp(84px,12vh,132px) var(--pad-x) clamp(72px,10vh,110px);
  overflow:clip;
  background:
    radial-gradient(1200px 620px at 50% -14%, rgba(255,255,255,.95), transparent 62%),
    radial-gradient(760px 520px at 8% 108%, rgba(246,220,222,.7), transparent 64%),
    radial-gradient(820px 540px at 96% 88%, rgba(246,233,207,.85), transparent 66%),
    linear-gradient(178deg, #FEFAF4 0%, var(--cream) 42%, #F6EADA 100%);
  transition:background 1.6s var(--e-out);
}

/* мягкое «потепление» фона после открытия */
.hero.is-open{
  background:
    radial-gradient(1200px 640px at 50% -10%, rgba(255,250,236,.98), transparent 60%),
    radial-gradient(820px 560px at 6% 106%, rgba(243,206,208,.72), transparent 64%),
    radial-gradient(880px 580px at 98% 86%, rgba(250,229,180,.9), transparent 64%),
    linear-gradient(178deg, #FFF9EC 0%, #FCF2DF 40%, #F3E3CC 100%);
}

.hero__glow{
  position:absolute;
  top:-24%; left:50%;
  width:min(1000px, 120vw); aspect-ratio:1.6;
  transform:translateX(-50%) scale(.7);
  background:radial-gradient(closest-side, rgba(255,224,158,.42), rgba(255,224,158,0) 70%);
  opacity:.7;
  z-index:-1;
  transition:transform 1.8s var(--e-out), opacity 1.8s var(--e-out);
  pointer-events:none;
}
.hero.is-open .hero__glow{ transform:translateX(-50%) scale(1.15); opacity:1; }

.hero__corner--tl{ top:clamp(10px,2.4vw,26px); left:clamp(10px,2.4vw,26px); }
.hero__corner--br{ bottom:clamp(10px,2.4vw,26px); right:clamp(10px,2.4vw,26px); transform:rotate(180deg); }

.hero__inner{
  position:relative;
  width:100%;
  max-width:940px;
  margin-inline:auto;
  text-align:center;
}

/* --- эмблема --- */
.hero__eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.6em;
  padding:.62em 1.25em;
  border-radius:999px;
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--gold-3);
  background:rgba(255,255,255,.6);
  border:1px solid var(--line-soft);
  box-shadow:var(--sh-xs);
  backdrop-filter:blur(6px);
}
.hero__eyebrow .ico{ color:var(--gold); }

.hero__emblem{
  margin:0 auto clamp(14px,2vw,22px);
  color:var(--gold);
}
.emblem{
  width:clamp(150px,20vw,210px);
  height:auto;
  margin:0 auto;
  filter:drop-shadow(0 14px 26px rgba(168,124,44,.22));
}
.emblem__rays{ transform-origin:110px 30px; animation: raysPulse 6.5s var(--e-soft) infinite; }
.emblem__heart{ animation: floatY 5.4s var(--e-soft) infinite; transform-origin:110px 42px; }
.emblem__book{ animation: floatY 6.8s var(--e-soft) infinite; }
.emblem__sparkles{ animation: twinkle 3.6s var(--e-soft) infinite; }
@keyframes raysPulse{ 0%,100%{ opacity:.35; } 50%{ opacity:.75; } }
@keyframes floatY{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-5px); } }
@keyframes twinkle{ 0%,100%{ opacity:.35; } 50%{ opacity:1; } }

/* --- заголовок --- */
.hero__title{
  font-family:var(--f-display);
  font-weight:700;
  line-height:1.04;
  letter-spacing:-.024em;
  color:var(--wine);
}
.hero__line{ display:block; }
.hero__line--1{
  font-size:clamp(2.05rem, 6.4vw, 5.1rem);
  font-weight:600;
}
.hero__line--2{
  font-size:clamp(1.9rem, 6vw, 4.8rem);
  margin-top:.1em;
}
.hero__name{
  position:relative;
  display:inline-block;
  font-style:italic;
  font-weight:700;
  background:linear-gradient(96deg, var(--gold-3) 0%, var(--gold) 26%, #F0D69C 48%, var(--gold) 70%, var(--gold-3) 100%);
  background-size:220% 100%;
  -webkit-background-clip:text;
          background-clip:text;
  color:transparent;
  animation: goldShift 9s var(--e-soft) infinite;
}
@supports not ((-webkit-background-clip:text) or (background-clip:text)){
  .hero__name{ color:var(--gold-3); animation:none; }
}
@keyframes goldShift{ 0%,100%{ background-position:0% 50%; } 50%{ background-position:100% 50%; } }

.hero__underline{
  width:min(330px,72vw);
  height:auto;
  margin:.16em auto 0;
  color:var(--gold);
  opacity:.7;
}

/* --- подзаголовок --- */
.hero__sub{
  margin:clamp(20px,2.6vw,30px) auto 0;
  max-width:min(46ch,100%);
  font-size:clamp(1.02rem, 1.85vw, 1.32rem);
  font-weight:500;
  line-height:1.62;
  color:var(--ink-soft);
  text-wrap:balance;
}

.hero__actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:12px 16px;
  margin-top:clamp(26px,3.4vw,40px);
}

/* --- печать «ІВ» --- */
.hero__seal{
  display:inline-flex;
  align-items:center;
  gap:12px;
  margin-top:clamp(26px,3.4vw,40px);
  text-align:left;
}
.hero__seal-text{
  font-family:var(--f-hand);
  font-size:1.12rem;
  line-height:1.25;
  color:var(--gold-3);
}
.hero__seal-text em{
  font-style:normal;
  font-size:.98rem;
  color:var(--ink-faint);
}

/* --- индикатор скролла --- */
.hero__scroll{
  position:absolute;
  left:50%;
  bottom:clamp(18px,3vh,30px);
  transform:translateX(-50%);
  display:grid;
  place-items:center;
  gap:6px;
  padding:10px 16px;
  border:0;
  background:none;
  color:var(--gold-3);
  cursor:pointer;
  opacity:.75;
  transition:opacity .4s, transform .5s var(--e-out);
}
.hero__scroll:hover{ opacity:1; transform:translateX(-50%) translateY(3px); }
.hero__scroll-line{
  width:1px; height:38px;
  background:linear-gradient(180deg, transparent, var(--gold));
  animation: scrollPulse 2.2s var(--e-soft) infinite;
}
@keyframes scrollPulse{
  0%{ transform:scaleY(.3); transform-origin:top; opacity:0; }
  40%{ transform:scaleY(1); opacity:1; }
  100%{ transform:scaleY(1); transform-origin:bottom; opacity:0; }
}
.hero.is-open .hero__scroll{ opacity:0; pointer-events:none; }

/* --- декоративные элементы, появляющиеся при открытии --- */
.hero__reveal{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.hero__petal{
  position:absolute;
  display:grid;
  place-items:center;
  color:var(--gold);
  opacity:0;
  transform:scale(.5) rotate(-25deg);
  transition:opacity 1s var(--e-out), transform 1.2s var(--e-back);
  pointer-events:none;
}
.hero__petal .ico{ width:clamp(20px,2.4vw,30px); height:clamp(20px,2.4vw,30px); }
.hero__petal--1{ top:16%; left:4%;  transition-delay:.15s; }
.hero__petal--2{ top:26%; right:6%; transition-delay:.32s; }
.hero__petal--3{ bottom:22%; left:8%; transition-delay:.5s;  color:var(--rose); }
.hero__petal--4{ bottom:16%; right:5%; transition-delay:.66s; color:var(--rose); }
.hero.is-open .hero__petal{ opacity:.75; transform:scale(1) rotate(0); }

/* --- появление hero --- */
.js .hero [data-hero]{
  opacity:0;
  transform:translate3d(0,26px,0);
}
.js .hero [data-hero="3"]{ transform:translate3d(0,34px,0); }
.js .hero.is-ready [data-hero]{
  opacity:1;
  transform:none;
  transition:
    opacity 1s var(--e-out) var(--d),
    transform 1.15s var(--e-out) var(--d);
}
.hero [data-hero="1"]{ --d:80ms; }
.hero [data-hero="2"]{ --d:200ms; }
.hero [data-hero="3"]{ --d:380ms; }
.hero [data-hero="4"]{ --d:520ms; }
.hero [data-hero="5"]{ --d:680ms; }
.hero [data-hero="6"]{ --d:820ms; }
.hero [data-hero="7"]{ --d:960ms; }

/* короткие экраны */
@media (max-height:720px){
  .emblem{ width:clamp(110px,14vw,150px); }
  .hero__seal{ display:none; }
  .hero__scroll{ display:none; }
}

/* ============================================================
   2. ЛИСТ-ПРИВІТАННЯ
   ============================================================ */
.letter{
  position:relative;
  padding:clamp(36px,5.4vw,74px) clamp(24px,4.6vw,72px) clamp(34px,5vw,66px);
  border-radius:var(--r-xl);
  background:
    linear-gradient(180deg, rgba(255,255,255,1), rgba(255,253,248,.96));
  box-shadow:var(--sh-lg);
  border:1px solid rgba(255,255,255,.9);
}
.letter::before{
  content:"";
  position:absolute;
  inset:12px;
  border-radius:calc(var(--r-xl) - 12px);
  border:1px solid var(--line-soft);
  pointer-events:none;
}
.letter::after{
  content:"";
  position:absolute;
  inset:19px;
  border-radius:calc(var(--r-xl) - 19px);
  border:1px solid rgba(200,162,80,.12);
  pointer-events:none;
}

.letter__corner--tl{ top:18px; left:18px; opacity:.5; width:clamp(70px,9vw,110px); }
.letter__corner--br{ bottom:18px; right:18px; opacity:.5; width:clamp(70px,9vw,110px); transform:rotate(180deg); }

.letter__meta{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin-bottom:clamp(20px,2.6vw,30px);
  font-size:.76rem;
  font-weight:600;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--gold-3);
}
.letter__rule{
  width:clamp(28px,6vw,64px);
  height:1px;
  background:var(--line);
}

.letter__title{
  font-family:var(--f-display);
  font-size:clamp(1.5rem,3.1vw,2.4rem);
  font-weight:700;
  font-style:italic;
  line-height:1.28;
  text-align:center;
  color:var(--wine);
  letter-spacing:-.014em;
  text-wrap:balance;
}

.letter__divider{
  width:clamp(180px,32vw,240px);
  margin:clamp(20px,2.6vw,30px) auto clamp(22px,2.8vw,32px);
  color:var(--gold);
  opacity:.85;
}
.letter__divider svg{ width:100%; height:auto; }

.letter__body{
  display:grid;
  gap:clamp(16px,1.8vw,22px);
  max-width:62ch;
  margin-inline:auto;
  text-align:center;
  color:var(--ink);
  font-size:clamp(1.02rem,1.35vw,1.14rem);
  line-height:1.78;
}
.letter__body p{ text-wrap:pretty; }
.letter__closing{
  margin-top:6px;
  font-weight:600;
  color:var(--wine);
}

.letter__sign{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  margin-top:clamp(30px,4vw,46px);
}
.letter__sign-text{ text-align:left; line-height:1.2; }
.letter__sign-script{
  display:block;
  font-family:var(--f-hand);
  font-size:clamp(1.4rem,2.4vw,1.85rem);
  font-weight:700;
  color:var(--wine-2);
}
.letter__sign-sub{
  display:block;
  font-size:.76rem;
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--ink-faint);
}

/* ============================================================
   3. ФОТО / ГАЛЕРЕЯ
   ============================================================ */
.gallery{
  position:relative;
  display:grid;
  gap:clamp(14px,1.8vw,24px);
  grid-template-columns:1.32fr 1fr;
  align-items:start;
  max-width:920px;
  margin-inline:auto;
}
.gallery__side{ display:grid; gap:clamp(14px,1.8vw,24px); }
.gallery__caption{ grid-column:1 / -1; margin-top:clamp(18px,2.4vw,28px); text-align:center; }
.gallery__hint{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.55em;
  margin-top:20px;
  font-size:.76rem;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--gold-3);
  opacity:.9;
}

.shot{ position:relative; margin:0; }
.shot__btn{
  position:relative;
  display:block;
  width:100%;
  padding:0;
  border:0;
  background:none;
  cursor:zoom-in;
  border-radius:var(--r-md);
  transition:transform .65s var(--e-out);
}
.shot__btn:hover{ transform:translateY(-7px); }
.shot__btn:focus-visible{ outline:2px solid var(--gold-3); outline-offset:6px; }

.photo__frame{
  position:relative;
  display:block;
  padding:clamp(8px,1.1vw,14px);
  border-radius:var(--r-md);
  background:linear-gradient(150deg, #FBEFD4 0%, var(--gold-2) 26%, var(--gold) 55%, #A87C2C 100%);
  box-shadow:var(--sh-lg), var(--sh-gold);
}
.photo__frame::after{
  content:"";
  position:absolute;
  inset:clamp(8px,1.1vw,14px);
  border:1px solid rgba(255,255,255,.42);
  border-radius:calc(var(--r-md) - 6px);
  pointer-events:none;
}

.photo__mat{
  position:relative;
  display:block;
  padding:clamp(10px,1.4vw,16px);
  border-radius:calc(var(--r-md) - 4px);
  background:linear-gradient(180deg,#FFFDF9,#FBF3E6);
  box-shadow:inset 0 0 0 1px rgba(200,162,80,.26);
}

.photo__img{
  display:block;
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:50% 20%;
  border-radius:6px;
  background:linear-gradient(160deg,#F6EADA,#EEDFC8);
}
.photo__img[hidden]{ display:none; }

.photo__placeholder{
  position:absolute;
  inset:clamp(10px,1.4vw,16px);
  display:none;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  padding:8%;
  border-radius:6px;
  color:var(--gold-3);
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(255,255,255,.95), transparent 60%),
    linear-gradient(165deg, #F8EEDF 0%, #F0E1CA 55%, #E7D3B4 100%);
  box-shadow:inset 0 0 0 1px rgba(200,162,80,.3);
  text-align:center;
}

/* пропорции рамок */
.shot .photo__mat{ aspect-ratio:4/5; }
.shot--sm .photo__mat{ aspect-ratio:1/1; }
.shot.is-placeholder .photo__placeholder{ display:flex; }
.shot.is-placeholder .shot__btn{ cursor:default; }
/* горизонтальное фото — свои пропорции, изображение не искажается */
.shot.is-wide .photo__mat,
.shot.is-wide .photo__img{ aspect-ratio:4/3; }
.shot--sm.is-wide .photo__mat,
.shot--sm.is-wide .photo__img{ aspect-ratio:1/1; }
.shot.is-wide .photo__img{ object-position:50% 24%; }

.photo__monogram{
  font-family:var(--f-display);
  font-size:clamp(2.4rem,6vw,3.4rem);
  font-weight:700;
  font-style:italic;
  color:rgba(168,124,44,.42);
  letter-spacing:.04em;
}
.photo__ph-text{
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(140,127,118,.9);
}
.photo__ph-rule{
  width:clamp(52px,12vw,88px);
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(200,162,80,.75),transparent);
}

.shot__zoom{
  position:absolute;
  right:12px; bottom:12px;
  z-index:2;
  display:grid;
  place-items:center;
  width:38px; height:38px;
  border-radius:50%;
  color:#4A3410;
  background:linear-gradient(145deg,#F0D69C,var(--gold));
  box-shadow:0 10px 22px -10px rgba(110,28,47,.6);
  opacity:0;
  transform:translateY(6px) scale(.9);
  transition:opacity .45s var(--e-out), transform .5s var(--e-back);
}
.shot__zoom .ico{ width:19px; height:19px; }
.shot__btn:hover .shot__zoom,
.shot__btn:focus-visible .shot__zoom{ opacity:1; transform:none; }
.shot.is-placeholder .shot__zoom{ display:none; }

.shot__flower{
  position:absolute;
  z-index:3;
  color:var(--gold);
  opacity:.8;
  transform:translate3d(0, var(--py, 0px), 0);
  pointer-events:none;
}
.shot__flower .ico{
  width:clamp(20px,2.4vw,30px); height:clamp(20px,2.4vw,30px);
  animation: floatY 7s var(--e-soft) infinite;
}
.shot__flower--1{ top:-16px; right:-12px; color:var(--rose); }
.shot__flower--2{ bottom:-14px; left:-14px; }
.shot__flower--2 .ico{ animation-delay:-2.6s; }

/* мягкий «прояв» фотографии */
.js .shot:not(.is-photo-in) .photo__img,
.js .shot:not(.is-photo-in) .photo__placeholder{
  transform:scale(1.05);
  filter:saturate(.85);
}
.photo__img, .photo__placeholder{
  transition:transform 1.6s var(--e-out), filter 1.4s var(--e-out);
}

.photo__caption-plate{
  display:inline-block;
  padding:.5em 1.4em;
  border-radius:999px;
  font-family:var(--f-display);
  font-size:clamp(1.02rem,1.7vw,1.24rem);
  font-weight:700;
  color:var(--wine);
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(246,233,207,.9));
  border:1px solid var(--line);
  box-shadow:var(--sh-xs);
}
.photo__caption-sub{
  display:block;
  margin-top:10px;
  font-family:var(--f-hand);
  font-size:clamp(1.1rem,2vw,1.32rem);
  color:var(--gold-3);
}

/* ---- просмотр фото крупно ---- */
.lightbox{
  position:fixed;
  inset:0;
  z-index:80;
  display:grid;
  place-items:center;
  padding:clamp(20px,4vw,48px);
  background:rgba(38,14,22,.84);
  backdrop-filter:blur(8px);
  opacity:0;
  transition:opacity .45s var(--e-out);
}
.lightbox[hidden]{ display:none; }
.lightbox.is-open{ opacity:1; }

.lightbox__inner{
  position:relative;
  margin:0;
  display:grid;
  gap:14px;
  justify-items:center;
  transform:scale(.94) translateY(10px);
  transition:transform .6s var(--e-back);
}
.lightbox.is-open .lightbox__inner{ transform:none; }

.lightbox__img{
  max-width:min(88vw,860px);
  max-height:74vh;
  width:auto;
  height:auto;
  border-radius:10px;
  border:6px solid #F3E4C7;
  box-shadow:0 40px 90px -30px rgba(0,0,0,.7);
  background:#241018;
}
.lightbox__cap{
  font-family:var(--f-hand);
  font-size:1.22rem;
  color:var(--gold-2);
  text-align:center;
}

.lightbox__close{
  position:absolute;
  top:max(14px, env(safe-area-inset-top));
  right:max(14px, env(safe-area-inset-right));
  z-index:2;
  display:grid;
  place-items:center;
  width:48px; height:48px;
  border-radius:50%;
  color:var(--wine);
  background:rgba(255,255,255,.94);
  border:1px solid var(--line);
  box-shadow:var(--sh-md);
  cursor:pointer;
  transition:transform .45s var(--e-back), background .3s;
}
.lightbox__close .ico{ width:22px; height:22px; }
.lightbox__close:hover{ transform:rotate(90deg) scale(1.06); background:#fff; }

body.is-locked{ overflow:hidden; }

/* ============================================================
   4. ФИНАЛ
   ============================================================ */
.section--final{
  position:relative;
  isolation:isolate;
  display:grid;
  place-items:center;
  min-height:100svh;
  padding-block:clamp(96px,14vh,170px);
  text-align:center;
  overflow:clip;
  color:var(--cream);
  background:
    radial-gradient(900px 620px at 50% 8%, rgba(168,124,44,.34), transparent 62%),
    radial-gradient(700px 520px at 12% 92%, rgba(142,44,68,.55), transparent 66%),
    radial-gradient(760px 560px at 92% 86%, rgba(27,42,68,.62), transparent 66%),
    linear-gradient(168deg, #2A0F1B 0%, #4C1220 32%, #5E1A2C 58%, #26182C 100%);
}
.final__glow{
  position:absolute;
  top:50%; left:50%;
  width:min(900px,130vw); aspect-ratio:1.4;
  transform:translate(-50%,-50%);
  background:radial-gradient(closest-side, rgba(255,220,150,.3), transparent 72%);
  opacity:.6;
  animation: finalPulse 7s var(--e-soft) infinite;
  z-index:-1;
  pointer-events:none;
}
@keyframes finalPulse{
  0%,100%{ opacity:.42; transform:translate(-50%,-50%) scale(.92); }
  50%{ opacity:.78; transform:translate(-50%,-50%) scale(1.06); }
}

.final__inner{
  position:relative;
  width:100%;
  max-width:900px;
  margin-inline:auto;
}

.final__flower{
  position:absolute;
  color:var(--gold-2);
  opacity:.5;
  transform:translate3d(0, var(--py, 0px), 0);
  pointer-events:none;
}
.final__flower .ico{
  width:clamp(24px,3vw,38px); height:clamp(24px,3vw,38px);
  animation: floatY 8s var(--e-soft) infinite;
}
.final__flower--1{ top:6%; left:8%; }
.final__flower--2{ bottom:14%; left:2%; color:var(--rose); }
.final__flower--2 .ico{ animation-delay:-2.8s; }
.final__flower--3{ top:22%; right:6%; }
.final__flower--3 .ico{ animation-delay:-1.4s; }

.final__kicker{
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.3em;
  text-transform:uppercase;
  color:var(--gold-2);
}

.final__title{
  margin-top:clamp(14px,2vw,22px);
  font-family:var(--f-display);
  font-size:clamp(2.1rem,6.2vw,4.9rem);
  font-weight:700;
  line-height:1.06;
  letter-spacing:-.022em;
  color:#FFF6E6;
  text-shadow:0 6px 40px rgba(255,214,140,.28);
}
.final__name{
  display:inline-block;
  font-style:italic;
  background:linear-gradient(96deg,#E9C877 0%, #FBE7B8 30%, #C8A250 62%, #F3DCA4 100%);
  background-size:220% 100%;
  -webkit-background-clip:text;
          background-clip:text;
  color:transparent;
  animation: goldShift 9s var(--e-soft) infinite;
}
@supports not ((-webkit-background-clip:text) or (background-clip:text)){
  .final__name{ color:#E9C877; animation:none; }
}

.final__sub{
  margin-top:clamp(14px,2vw,22px);
  font-family:var(--f-display);
  font-size:clamp(1.28rem,2.8vw,2.05rem);
  font-weight:500;
  font-style:italic;
  color:var(--gold-soft);
}

.final__divider{
  width:clamp(170px,30vw,220px);
  margin:clamp(24px,3.2vw,36px) auto;
  color:var(--gold);
  opacity:.8;
}
.final__divider svg{ width:100%; height:auto; }

.final__note{
  max-width:46ch;
  margin-inline:auto;
  font-size:clamp(1rem,1.5vw,1.12rem);
  line-height:1.7;
  color:rgba(255,244,228,.82);
  text-wrap:pretty;
}

.final__date{
  margin-top:clamp(24px,3vw,34px);
  font-size:.76rem;
  font-weight:600;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:rgba(227,195,119,.8);
}

/* появление финала */
.js .final__inner [data-final]{
  opacity:0;
  transform:translate3d(0,30px,0);
}
.js .final__inner.is-in [data-final]{
  opacity:1;
  transform:none;
  transition:opacity 1.1s var(--e-out) var(--fd), transform 1.25s var(--e-out) var(--fd);
}
.final [data-final="1"]{ --fd:80ms; }
.final [data-final="2"]{ --fd:240ms; }
.final [data-final="3"]{ --fd:420ms; }
.final [data-final="4"]{ --fd:560ms; }
.final [data-final="5"]{ --fd:680ms; }
.final [data-final="6"]{ --fd:800ms; }

/* ============================================================
   5. FOOTER
   ============================================================ */
.footer{
  position:relative;
  padding:clamp(40px,6vw,64px) var(--pad-x) clamp(96px,10vw,120px);
  text-align:center;
  background:
    radial-gradient(700px 300px at 50% 0%, rgba(255,255,255,.9), transparent 66%),
    linear-gradient(180deg, var(--cream) 0%, var(--cream-2) 100%);
}
.footer__text{
  display:inline-flex;
  align-items:center;
  gap:.5em;
  font-family:var(--f-display);
  font-size:clamp(1rem,1.6vw,1.18rem);
  font-style:italic;
  color:var(--wine);
}
.footer__text .ico{ color:var(--wine-2); fill:currentColor; }
.footer__sub{
  margin-top:8px;
  font-size:.76rem;
  font-weight:600;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--ink-faint);
}

/* ============================================================
   6. Адаптив
   ============================================================ */
@media (max-width:640px){
  .letter::before{ inset:8px; }
  .letter::after{ inset:14px; }
  .hero__petal--3{ left:2%; }
  .hero__petal--4{ right:1%; }
}

@media (max-width:780px){
  .gallery{ grid-template-columns:1fr; max-width:520px; }
  .gallery__side{ grid-template-columns:repeat(2,1fr); }
  .shot__flower--1{ right:-6px; }
  .shot__flower--2{ left:-6px; }
}

@media (max-width:400px){
  .hero__actions .btn{ width:100%; }
  .section-head__title{ font-size:1.9rem; }
  .letter__sign{ gap:12px; }
  .gallery__side{ grid-template-columns:1fr; }
  .shot--sm .photo__mat{ aspect-ratio:4/3; }
}
