/* ============ TOKENS — videodan alınan palet ============
     ivory / sand : zarfın krem kağıdı ve taş kameriyenin sıcak tonları
     gold         : balmumu mührün antika altını
     navy         : damadın lacivert takımı
     sea          : gün batımı ufkundaki deniz/gökyüzü grisi-mavisi
     ink          : derin sıcak antrasit (gölgelerden)                */
  :root{
    --ivory:#F3ECDE;
    --sand:#E4D3B6;
    --card:#FBF6EC;
    --ink:#2B2420;
    --ink-soft:#6E6355;
    --navy:#232A3B;
    --gold:#B4894F;
    --gold-light:#D9BD8B;
    --sea:#7C8F97;
    --shadow:0 20px 40px -24px rgba(30,24,16,.35);
  }

  *{box-sizing:border-box}
  html,body{margin:0;padding:0}
  html{scroll-behavior:smooth}

  body{
    background:var(--ivory);
    color:var(--ink);
    font-family:'Fraunces',serif;
    font-weight:300;
    text-align:center;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }

  h1,h2,h3,.display{
    font-family:'Cormorant Garamond',serif;
    font-weight:500;
    margin:0;
    letter-spacing:.015em;
  }

  a{color:inherit}
  button{font-family:inherit}

  .eyebrow{
    font-size:.72rem;
    letter-spacing:.28em;
    text-transform:uppercase;
    color:var(--gold);
    font-weight:500;
  }

  .wrap{max-width:720px;margin:0 auto;padding:0 1.5rem}

  /* ============ REVEAL ============ */
  .reveal{
    opacity:0;
    filter:blur(5px);
    transform:translateY(30px) scale(.985);
    transition:
      opacity 1s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0s),
      transform 1s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0s),
      filter .9s ease var(--reveal-delay,0s);
  }
  .reveal.in-view{opacity:1;filter:blur(0);transform:translateY(0) scale(1)}
  .section-head.reveal > *{
    opacity:0;
    filter:blur(3px);
    transform:translateY(14px);
    transition:opacity .8s ease,transform .9s cubic-bezier(.22,1,.36,1),filter .8s ease;
  }
  .section-head.reveal.in-view > *{opacity:1;filter:blur(0);transform:translateY(0)}
  .section-head.reveal.in-view > :nth-child(1){transition-delay:.08s}
  .section-head.reveal.in-view > :nth-child(2){transition-delay:.22s}
  .section-head.reveal.in-view > :nth-child(3){transition-delay:.36s}

  @media (prefers-reduced-motion: reduce){
    *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
    .reveal,.section-head.reveal > *{opacity:1;filter:none;transform:none}
  }

  /* ============ SCALLOP / ARCH DIVIDER ============ */
  .scallop{
    height:22px;
    width:100%;
    background-image:radial-gradient(circle at 11px 0, transparent 11px, var(--target,var(--ivory)) 12px);
    background-size:22px 22px;
    background-repeat:repeat-x;
  }

  .arch-tile{border-radius:999px 999px 6px 6px}

  /* ============ HERO — kalıcı döngülü (loop) video arka plan ============
     --hero-ink: kopyaladığın tasarımdaki rgb(139,136,137) yerine, videonun
     karanlık/aydınlık değişen alanlarında da okunaklı kalsın diye kırık-beyaz
     kullandım. Orijinal griyi istersen tek satırdan değiştirebilirsin. */
  .hero{
    --hero-ink:var(--card);
    position:relative;
    min-height:100svh;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:0;
  }
  .hero__video{
    position:absolute;inset:0;
    width:100%;height:100%;
    object-fit:cover;
    opacity:1;
    transition:opacity .7s ease;
  }
  .hero__video.is-hidden{opacity:0}
  .hero__video--loop{opacity:0}
  .hero__video--loop.is-visible{opacity:1}

  .hero__scrim{
    position:absolute;inset:0;
    background:
      linear-gradient(to top, rgba(15,12,9,.62) 0%, rgba(15,12,9,.22) 45%, rgba(15,12,9,.35) 100%);
    pointer-events:none;
  }

  .hero__sound{
    position:absolute;
    top:1.1rem;left:1.1rem;
    z-index:3;
    width:38px;height:38px;padding:0;
    display:flex;align-items:center;justify-content:center;
    background:rgba(20,16,12,.4);
    border:1px solid rgba(255,255,255,.35);
    color:#fff;
    border-radius:50%;
    font-size:1rem;
    cursor:pointer;
    backdrop-filter:blur(4px);
  }

  .hero__content{
    position:relative;z-index:2;
    display:flex;flex-direction:column;align-items:center;
    color:var(--hero-ink);
    width:min(94vw,760px);
    padding:clamp(3.2rem,7vh,5rem) clamp(.75rem,4vw,2.5rem);
  }

  /* Metinler yürüyüş başladığında videodaki gibi sırayla açılır. */
  .hero-fade{
    opacity:0;
    filter:blur(7px);
    clip-path:inset(0 0 100% 0);
    transform:translateY(24px) scale(.98);
    transition:
      opacity 1s ease,
      transform 1.25s cubic-bezier(.22,1,.36,1),
      filter 1s ease,
      clip-path 1.25s cubic-bezier(.22,1,.36,1);
  }
  .hero__content.is-in .hero-fade{
    opacity:1;
    filter:blur(0);
    clip-path:inset(0 0 0 0);
    transform:translateY(0) scale(1);
    transition-delay:var(--hero-delay,0s);
  }

  .hero__kicker{
    margin:0 auto .9rem;
    font-size:clamp(.58rem,1.4vw,.76rem);
    font-weight:400;
    letter-spacing:.28em;
    line-height:1.5;
    text-transform:uppercase;
    text-shadow:0 2px 10px rgba(0,0,0,.35);
  }
  .hero__label{
    font-family:inherit;
    font-weight:300;
    font-size:clamp(.44rem,1.6vw,.82rem);
    letter-spacing:.03em;
    line-height:1.7;
    max-width:none;
    white-space:nowrap;
    margin:1.35rem auto 0;
    text-shadow:0 2px 10px rgba(0,0,0,.35);
  }
  .hero__script{
    display:flex;
    flex-direction:column;
    align-items:center;
    font-family:'Cormorant Garamond',serif;
    font-weight:500;
    font-size:clamp(3.15rem,9vw,5.75rem);
    line-height:.76;
    letter-spacing:-.02em;
    margin:0;
    max-width:100%;
    white-space:nowrap;
    text-shadow:0 4px 18px rgba(0,0,0,.35);
  }
  .hero__name{display:block}
  .hero__amp{
    display:block;
    margin:.16em 0 .12em;
    color:var(--gold-light);
    font-size:.4em;
    font-style:italic;
    font-weight:500;
    line-height:.75;
    letter-spacing:0;
  }

  .hero__date{
    font-family:'Cormorant Garamond',serif;
    margin-top:1.7rem;
  }
  .hero__date-grid{
    display:grid;
    grid-template-columns:88px auto 88px;
    align-items:center;
    justify-content:center;
    gap:1.1rem;
  }
  .hero__date-side{display:flex;flex-direction:column;align-items:center;gap:.5rem}
  .hero__date-line{
    display:block;
    height:1px;
    width:100%;
    background:currentColor;
    opacity:.75;
    transform:scaleX(0);
    transition:transform .9s cubic-bezier(.22,1,.36,1) 2.12s;
  }
  .hero__content.is-in .hero__date-line{transform:scaleX(1)}
  .hero__date-month,.hero__date-year{
    font-size:.92rem;letter-spacing:.16em;text-transform:uppercase;line-height:1;
  }
  .hero__date-day{font-size:clamp(2.8rem,10vw,4.2rem);line-height:.85;font-weight:400}
  .hero__date-weekday{margin-top:.9rem;text-transform:uppercase;letter-spacing:.24em;font-size:1.05rem}

  .hero__scrolldown{
    margin-top:2.2rem;
    display:flex;flex-direction:column;align-items:center;gap:.5rem;
  }
  .hero__scrolldown svg{width:20px;height:20px;animation:herobounce 2s ease-in-out infinite}
  .hero__scrolldown p{font-size:.8rem;margin:0}
  @keyframes herobounce{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}

  /* Geniş masaüstü ölçeği; mobil ve tablet ölçülerini etkilemez. */
  @media(min-width:1200px) and (min-height:700px){
    .hero__content{
      width:min(86vw,980px);
      padding-block:clamp(3.6rem,6vh,5.2rem);
    }
    .hero__kicker{font-size:.82rem}
    .hero__script{font-size:clamp(6.1rem,6.2vw,7.25rem)}
    .hero__label{font-size:clamp(.88rem,.78vw,1rem)}
    .hero__date{margin-top:2rem}
    .hero__date-grid{
      grid-template-columns:108px auto 108px;
      gap:1.4rem;
    }
    .hero__date-month,.hero__date-year{font-size:1.05rem}
    .hero__date-day{font-size:5rem}
    .hero__date-weekday{font-size:1.16rem}
    .hero__scrolldown{margin-top:2.35rem}
    .hero__scrolldown p{font-size:.9rem}
  }

  /* ============ HERO GATE — "Açmak için dokunun" ============ */
  .hero__gate{
    position:absolute;inset:0;z-index:5;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:1rem;
    background:rgba(20,16,12,.3);
    color:#fff;
    border:none;
    cursor:pointer;
    transition:opacity .7s ease,visibility .7s ease;
  }
  .hero__gate.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
  .hero__gate-ring{
    width:56px;height:56px;border:1px solid rgba(255,255,255,.75);
    border-radius:50%;display:flex;align-items:center;justify-content:center;
    font-size:1.05rem;
    animation:gatepulse 2.4s ease-in-out infinite;
  }
  @keyframes gatepulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.08);opacity:.7}}
  .hero__gate-text{font-size:.7rem;letter-spacing:.24em;text-transform:uppercase}

  /* ============ SECTION SHELLS ============ */
  section{position:relative;padding:5rem 0}
  .section-head{text-align:center;margin-bottom:3rem}
  .section-head h2{font-size:clamp(2rem,5vw,2.85rem);line-height:1.05;margin-top:.5rem}
  .section-head p{color:var(--ink-soft);margin-top:.5rem;font-size:.92rem}

  /* ============ COUNTDOWN ============ */
  .countdown{
    background:var(--sand);
    overflow:hidden;
    isolation:isolate;
  }
  .countdown .wrap{position:relative;z-index:2}
  .countdown__deco{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:clamp(118px,13vw,170px);
    height:auto;
    max-width:none;
    max-height:calc(100% - 1.5rem);
    object-fit:contain;
    pointer-events:none;
    z-index:1;
    filter:drop-shadow(0 16px 24px rgba(30,24,16,.16));
  }
  .countdown__deco--left{left:clamp(-18px,1.5vw,24px)}
  .countdown__deco--right{right:clamp(-18px,1.5vw,24px)}
  .countdown__note{
    max-width:32ch;
    margin:1.8rem auto 0;
    font-family:inherit;
    font-style:italic;
    font-weight:400;
    font-size:.82rem;
    line-height:1.7;
    color:var(--ink-soft);
    opacity:.85;
  }
  .countdown__grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:.9rem;
    max-width:520px;
    margin:0 auto;
  }
  .countdown__item{
    background:var(--card);
    padding:1.3rem .5rem 1.1rem;
    text-align:center;
    box-shadow:var(--shadow);
  }
  .countdown__grid.reveal .countdown__item{
    opacity:0;
    transform:translateY(18px) scale(.96);
    transition:opacity .7s ease,transform .85s cubic-bezier(.22,1,.36,1);
  }
  .countdown__grid.reveal.in-view .countdown__item{opacity:1;transform:translateY(0) scale(1)}
  .countdown__grid.reveal.in-view .countdown__item:nth-child(1){transition-delay:.08s}
  .countdown__grid.reveal.in-view .countdown__item:nth-child(2){transition-delay:.18s}
  .countdown__grid.reveal.in-view .countdown__item:nth-child(3){transition-delay:.28s}
  .countdown__grid.reveal.in-view .countdown__item:nth-child(4){transition-delay:.38s}
  .countdown__value{
    font-family:inherit;
    font-size:clamp(1.6rem,5vw,2.3rem);
    font-weight:600;
    color:var(--gold);
    display:block;
  }
  .countdown__label{
    font-size:.6rem;
    letter-spacing:.16em;
    text-transform:uppercase;
    color:var(--ink-soft);
    display:block;
    margin-top:.3rem;
  }

  @media(max-width:700px){
    .countdown{padding:4rem 0 4.25rem}
    .countdown .wrap{padding-inline:1rem}
    .countdown__deco{
      top:.75rem;
      transform:none;
      width:clamp(78px,25vw,112px);
      max-height:none;
      filter:drop-shadow(0 10px 18px rgba(30,24,16,.12));
    }
    .countdown__deco--left{left:clamp(-18px,-3vw,-8px)}
    .countdown__deco--right{right:clamp(-18px,-3vw,-8px)}
    .countdown .section-head{
      position:relative;
      z-index:2;
      max-width:340px;
      margin:0 auto 2.2rem;
      padding-inline:clamp(3.6rem,18vw,4.8rem);
    }
    .countdown .section-head h2{
      font-size:clamp(1.8rem,7.2vw,2.2rem);
      line-height:1.15;
    }
    .countdown__grid{
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:.75rem;
      width:min(100%,310px);
    }
    .countdown__item{padding:1.15rem .45rem 1rem}
    .countdown__value{font-size:clamp(1.65rem,9vw,2.15rem)}
    .countdown__note{max-width:29ch;margin-top:1.5rem}
  }

  /* ============ NOTE / PHOTO MARQUEE ============
     Fotoğraflar sürekli sağdan sola kayar, sonsuz döngü. CONFIG.photos
     dizisine yol eklediğinde gerçek fotoğraflar, boşken yer tutucu
     kutular görünür (bkz. script.js). */
  .note{display:flex;flex-direction:column;gap:0;text-align:center}

  .marquee{
    width:100vw;
    position:relative;
    left:50%;
    right:50%;
    margin-left:-50vw;
    margin-right:-50vw;
    overflow:hidden;
    -webkit-mask-image:linear-gradient(to right, transparent, black 6%, black 94%, transparent);
    mask-image:linear-gradient(to right, transparent, black 6%, black 94%, transparent);
  }
  .marquee__track{
    display:flex;
    align-items:center;
    gap:14px;
    width:max-content;
    padding:0 14px;
    animation:marquee-scroll 32s linear infinite;
  }
  .marquee:hover .marquee__track{animation-play-state:paused}
  @keyframes marquee-scroll{
    from{transform:translateX(0)}
    to{transform:translateX(-50%)}
  }
  @media (prefers-reduced-motion: reduce){
    .marquee__track{animation:none}
  }

  .marquee__item{
    flex:0 0 auto;
    width:min(46vw,210px);
    aspect-ratio:3/4;
    border-radius:14px 14px 4px 4px;
    overflow:hidden;
    box-shadow:var(--shadow);
  }
  .marquee__item img{width:100%;height:100%;object-fit:cover;display:block}
  .marquee__item--placeholder{
    display:flex;align-items:center;justify-content:center;
    background:var(--card);
    border:1px dashed var(--gold);
    color:var(--ink-soft);
    font-family:inherit;
    font-size:.72rem;
    letter-spacing:.06em;
    text-align:center;
    padding:1rem;
  }

  .photo-divider{
    display:grid;
    place-items:center;
    width:100%;
    margin:clamp(.8rem,2vw,1.4rem) auto clamp(.35rem,1vw,.8rem);
    padding:0 1rem;
    overflow:hidden;
    pointer-events:none;
  }
  .photo-divider__image{
    display:block;
    width:min(940px,100%);
    height:auto;
  }

  .note__text{
    width:fit-content;
    max-width:calc(100vw - 2rem);
    margin:0 auto;
    font-size:clamp(.68rem,2.6vw,1.05rem);
    line-height:1.75;
    color:var(--ink-soft);
    font-style:italic;
    font-family:inherit;
    font-weight:400;
    white-space:pre-line;
  }

  /* ============ DETAILS ============ */
  .details{
    background:
      radial-gradient(circle at 50% 0, rgba(251,246,236,.68), transparent 36rem),
      var(--sand);
    overflow:hidden;
  }
  .details .wrap{max-width:1040px}
  .details .section-head{margin-bottom:2.6rem}
  .details__grid{
    display:grid;
    gap:clamp(1.4rem,3vw,2rem);
    grid-template-columns:1fr;
  }
  @media(min-width:760px){ .details__grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
  .detail-card{
    background:rgba(251,246,236,.94);
    box-shadow:0 26px 60px -38px rgba(43,36,32,.52);
    border:1px solid rgba(180,137,79,.28);
    border-radius:24px 24px 8px 8px;
    overflow:hidden;
    transition:transform .35s ease,box-shadow .35s ease;
  }
  .detail-card:hover{
    transform:translateY(-6px);
    box-shadow:0 34px 72px -38px rgba(43,36,32,.62);
  }
  .detail-card__media{
    position:relative;
    aspect-ratio:4/3;
    overflow:hidden;
    background:var(--ivory);
    border-bottom:1px solid rgba(180,137,79,.2);
  }
  .detail-card__media::after{
    content:'';
    position:absolute;
    inset:auto 0 0;
    height:32%;
    background:linear-gradient(to top,rgba(43,36,32,.18),transparent);
    pointer-events:none;
  }
  .detail-card__media img{
    display:block;
    width:100%;height:100%;
    object-fit:cover;
    object-position:center 30%;
    transition:transform .65s ease;
  }
  .detail-card:hover .detail-card__media img{transform:scale(1.025)}
  .detail-card__tag{
    position:absolute;
    z-index:1;
    left:50%;bottom:1rem;
    transform:translateX(-50%);
    margin:0;
    padding:.62rem 1.05rem .58rem;
    border:1px solid rgba(180,137,79,.38);
    border-radius:999px;
    background:rgba(251,246,236,.88);
    color:var(--gold);
    backdrop-filter:blur(9px);
    box-shadow:0 10px 24px -16px rgba(43,36,32,.5);
    font-size:.66rem;
    font-weight:500;
    letter-spacing:.22em;
    line-height:1;
    text-transform:uppercase;
    white-space:nowrap;
  }
  .detail-card__body{
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:2rem 2rem 2.2rem;
  }
  .detail-card h3{
    position:relative;
    font-size:clamp(1.85rem,3.4vw,2.3rem);
    margin:0;
    color:var(--ink);
  }
  .detail-card h3::after{
    content:'';
    display:block;
    width:34px;height:1px;
    margin:.9rem auto 0;
    background:var(--gold);
  }
  .detail-card__time{
    display:inline-block;
    margin-top:1rem;
    font-family:inherit;
    font-size:clamp(1rem,2.4vw,1.22rem);
    font-weight:400;
    color:var(--navy);
  }
  .detail-card__addr{
    min-height:2.8em;
    max-width:31ch;
    margin:.9rem auto 0;
    font-size:.84rem;
    color:var(--ink-soft);
    line-height:1.6;
  }
  .detail-card__link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.85rem;
    margin-top:1.5rem;
    padding:.7rem .72rem .7rem 1.2rem;
    border-radius:999px;
    background:var(--navy);
    color:var(--card);
    font-size:.64rem;
    font-weight:500;
    letter-spacing:.16em;
    text-transform:uppercase;
    text-decoration:none;
    box-shadow:0 12px 24px -16px rgba(35,42,59,.72);
    transition:transform .25s ease,background .25s ease;
  }
  .detail-card__link::after{
    content:'↗';
    display:flex;
    align-items:center;
    justify-content:center;
    width:1.8rem;height:1.8rem;
    border-radius:50%;
    background:var(--gold);
    color:var(--card);
    font-size:.9rem;
    letter-spacing:0;
    transition:transform .25s ease;
  }
  .detail-card__link:hover{background:var(--ink);transform:translateY(-2px)}
  .detail-card__link:hover::after{transform:rotate(8deg)}
  @media(max-width:520px){
    .detail-card{border-radius:20px 20px 7px 7px}
    .detail-card__media{aspect-ratio:1/1}
    .detail-card__body{padding:1.75rem 1.25rem 2rem}
  }
  @media(prefers-reduced-motion:reduce){
    .detail-card,.detail-card__media img,.detail-card__link,.detail-card__link::after{transition:none}
    .detail-card:hover,.detail-card:hover .detail-card__media img,.detail-card__link:hover{transform:none}
  }

  /* ============ FULL-WIDTH VISUAL DIVIDER ============ */
  .visual-divider{
    position:relative;
    display:grid;
    place-items:center;
    min-height:0;
    padding:clamp(.4rem,1.5vw,1rem) 1rem;
    overflow:hidden;
    background:var(--sand);
  }
  .visual-divider__art{
    position:relative;
    width:min(560px,84vw);
    aspect-ratio:1/1;
  }
  .visual-divider__image{
    position:absolute;
    inset:0;
    display:block;
    width:100%;height:100%;
    object-fit:contain;
  }
  .visual-divider__image--base{
    opacity:1;
    filter:none;
    -webkit-mask-image:radial-gradient(ellipse 56% 56% at 50% 50%,#000 0%,#000 70%,rgba(0,0,0,.95) 78%,rgba(0,0,0,.45) 88%,transparent 100%);
    mask-image:radial-gradient(ellipse 56% 56% at 50% 50%,#000 0%,#000 70%,rgba(0,0,0,.95) 78%,rgba(0,0,0,.45) 88%,transparent 100%);
    -webkit-mask-size:100% 100%;
    mask-size:100% 100%;
    -webkit-mask-repeat:no-repeat;
    mask-repeat:no-repeat;
  }
  /* ============ TIMELINE ============ */
  .timeline{background:var(--sand)}
  .timeline__day{margin-bottom:3rem}
  .timeline__day:last-child{margin-bottom:0}
  .timeline__day h3{
    font-family:'Cormorant Garamond',serif;
    font-size:1.4rem;
    font-weight:500;
    text-align:center;
    margin-bottom:1.8rem;
    color:var(--navy);
  }
  .timeline__list{
    position:relative;
    max-width:420px;
    margin:0 auto;
    padding-left:0;
  }
  .timeline__item{position:relative;padding:1.2rem 0 1.8rem;text-align:center}
  .timeline__item:last-child{padding-bottom:0}
  .timeline__item::before{
    content:'';
    position:absolute;
    left:50%;
    top:0;
    transform:translateX(-50%);
    width:9px;height:9px;
    border-radius:50%;
    background:var(--gold);
    border:2px solid var(--sand);
  }
  .timeline__time{font-size:.72rem;letter-spacing:.12em;color:var(--gold);font-weight:500}
  .timeline__item h4{font-family:'Cormorant Garamond',serif;font-size:1.45rem;font-weight:500;margin-top:.2rem}
  .timeline__item p{margin:.2rem 0 0;font-size:.86rem;color:var(--ink-soft)}

  /* ============ RSVP / KATILIM BİLDİRİMİ ============ */
  .rsvp{
    background:
      radial-gradient(circle at 50% 12%,rgba(217,189,139,.2),transparent 24rem),
      var(--ivory);
    overflow:hidden;
  }
  .rsvp__wrap{max-width:760px}
  .rsvp .section-head{margin-bottom:2.2rem}
  .rsvp .section-head p:last-child{max-width:44ch;margin:.7rem auto 0;line-height:1.65}
  .rsvp__card{
    position:relative;
    display:grid;
    gap:1.55rem;
    padding:clamp(1.45rem,4vw,2.6rem);
    border:1px solid rgba(180,137,79,.32);
    border-radius:28px 28px 10px 10px;
    background:rgba(251,246,236,.94);
    box-shadow:0 28px 64px -42px rgba(43,36,32,.55);
    text-align:left;
  }
  .rsvp__card.reveal > *{
    opacity:0;
    transform:translateY(14px);
    transition:opacity .7s ease,transform .8s cubic-bezier(.22,1,.36,1);
  }
  .rsvp__card.reveal.in-view > *{opacity:1;transform:translateY(0)}
  .rsvp__card.reveal.in-view > :nth-child(1){transition-delay:.08s}
  .rsvp__card.reveal.in-view > :nth-child(2){transition-delay:.16s}
  .rsvp__card.reveal.in-view > :nth-child(3){transition-delay:.24s}
  .rsvp__card.reveal.in-view > :nth-child(4){transition-delay:.32s}
  .rsvp__card.reveal.in-view > :nth-child(5){transition-delay:.4s}
  .rsvp__card.reveal.in-view > :nth-child(6){transition-delay:.48s}
  .rsvp__card.reveal.in-view > :nth-child(7){transition-delay:.56s}
  .rsvp__card::before{
    content:'';
    position:absolute;
    top:-1px;left:50%;
    width:72px;height:3px;
    transform:translateX(-50%);
    border-radius:0 0 999px 999px;
    background:var(--gold);
  }
  .rsvp__field{min-width:0;margin:0;padding:0;border:0}
  .rsvp__label{
    display:block;
    margin:0 0 .65rem;
    color:var(--ink);
    font-size:.78rem;
    font-weight:500;
    letter-spacing:.05em;
  }
  .rsvp__label span{color:var(--ink-soft);font-size:.7rem;font-weight:300}
  .rsvp__control{
    width:100%;
    min-height:48px;
    padding:.85rem 1rem;
    border:1px solid rgba(110,99,85,.24);
    border-radius:12px;
    background:rgba(255,255,255,.54);
    color:var(--ink);
    font:inherit;
    font-size:.86rem;
    outline:none;
    transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
  }
  .rsvp__control::placeholder{color:rgba(110,99,85,.65)}
  .rsvp__control:focus{
    border-color:var(--gold);
    background:rgba(255,255,255,.78);
    box-shadow:0 0 0 3px rgba(180,137,79,.12);
  }
  .rsvp__textarea{resize:vertical;min-height:110px;line-height:1.55}
  .rsvp__choices{display:grid;gap:.7rem}
  .rsvp__choices--two{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rsvp__choices--events{grid-template-columns:repeat(3,minmax(0,1fr))}
  .rsvp__choice{position:relative;display:block;cursor:pointer}
  .rsvp__choice input{position:absolute;opacity:0;pointer-events:none}
  .rsvp__choice-text{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:48px;
    padding:.7rem .8rem;
    border:1px solid rgba(110,99,85,.22);
    border-radius:12px;
    background:rgba(255,255,255,.46);
    color:var(--ink-soft);
    font-size:.76rem;
    line-height:1.35;
    text-align:center;
    transition:border-color .2s ease,background .2s ease,color .2s ease,transform .2s ease;
  }
  .rsvp__choice input:checked + .rsvp__choice-text{
    border-color:var(--gold);
    background:rgba(217,189,139,.2);
    color:var(--ink);
  }
  .rsvp__choice input:focus-visible + .rsvp__choice-text{
    outline:2px solid var(--navy);
    outline-offset:3px;
  }
  .rsvp__choice:hover .rsvp__choice-text{transform:translateY(-1px)}
  .rsvp__attending-fields{display:grid;gap:1.55rem}
  .rsvp__guest-field{display:flex;align-items:center;justify-content:space-between;gap:1rem}
  .rsvp__guest-field .rsvp__label{margin:0}
  .rsvp__stepper{
    display:grid;
    grid-template-columns:42px 48px 42px;
    align-items:center;
    border:1px solid rgba(110,99,85,.22);
    border-radius:999px;
    overflow:hidden;
    background:rgba(255,255,255,.55);
  }
  .rsvp__stepper-button{
    width:42px;height:42px;
    padding:0;
    border:0;
    background:transparent;
    color:var(--gold);
    font-size:1.25rem;
    cursor:pointer;
  }
  .rsvp__stepper-button:hover{background:rgba(217,189,139,.16)}
  .rsvp__stepper input{
    width:48px;height:42px;
    padding:0;
    border:0;
    border-inline:1px solid rgba(110,99,85,.14);
    background:transparent;
    color:var(--ink);
    font:inherit;
    font-weight:500;
    text-align:center;
    appearance:textfield;
  }
  .rsvp__stepper input::-webkit-outer-spin-button,.rsvp__stepper input::-webkit-inner-spin-button{appearance:none;margin:0}
  .rsvp__submit{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.8rem;
    width:100%;
    min-height:52px;
    padding:.85rem 1.2rem;
    border:0;
    border-radius:999px;
    background:var(--navy);
    color:var(--card);
    box-shadow:0 16px 28px -18px rgba(35,42,59,.75);
    font-size:.72rem;
    font-weight:500;
    letter-spacing:.12em;
    text-transform:uppercase;
    cursor:pointer;
    transition:transform .22s ease,background .22s ease;
  }
  .rsvp__submit:hover{background:var(--ink);transform:translateY(-2px)}
  .rsvp__helper,.rsvp__status{
    margin:-.85rem 0 0;
    color:var(--ink-soft);
    font-size:.69rem;
    line-height:1.5;
    text-align:center;
  }
  .rsvp__status{min-height:1.05em;margin-top:-1rem;color:var(--gold)}
  @media(max-width:600px){
    .rsvp{padding:4rem 0}
    .rsvp__wrap{padding-inline:1rem}
    .rsvp__card{gap:1.35rem;border-radius:22px 22px 8px 8px}
    .rsvp__choices--two,.rsvp__choices--events{grid-template-columns:1fr}
    .rsvp__choice-text{min-height:45px}
    .rsvp__guest-field{align-items:flex-start;flex-direction:column}
  }
  @media(prefers-reduced-motion:reduce){
    .rsvp__control,.rsvp__choice-text,.rsvp__submit{transition:none}
    .rsvp__choice:hover .rsvp__choice-text,.rsvp__submit:hover{transform:none}
  }

  /* ============ FOOTER ============ */
  footer{
    position:relative;
    isolation:isolate;
    display:flex;
    min-height:clamp(400px,46vw,560px);
    flex-direction:column;
    align-items:center;
    overflow:hidden;
    padding:clamp(6.5rem,10vw,8.5rem) 1.5rem 3rem;
    text-align:center;
    background:var(--ivory);
  }
  footer::before{
    content:'';
    position:absolute;
    inset:0;
    z-index:-2;
    background:url('assets/images/footer-fade-bg.webp') center bottom/cover no-repeat;
  }
  footer::after{
    content:'';
    position:absolute;
    inset:0;
    z-index:-1;
    pointer-events:none;
    background:
      linear-gradient(to bottom,
        var(--ivory) 0%,
        rgba(243,236,222,.98) 12%,
        rgba(243,236,222,.82) 31%,
        rgba(243,236,222,.34) 55%,
        rgba(243,236,222,.08) 76%,
        transparent 100%),
      linear-gradient(to top,rgba(35,42,59,.12),transparent 46%);
  }
  footer .foot-names{
    position:relative;
    font-family:'Cormorant Garamond',serif;
    font-weight:500;
    font-size:clamp(1.45rem,4vw,2rem);
    margin:.9rem 0 0;
    text-shadow:0 2px 14px rgba(251,246,236,.85);
  }
  footer .foot-line{
    position:relative;
    margin:.8rem 0 0;
    font-size:.78rem;
    letter-spacing:.1em;
    color:var(--ink-soft);
    text-shadow:0 2px 12px rgba(251,246,236,.9);
  }
  @media(max-width:600px){
    footer{min-height:430px;padding-top:5.8rem}
    footer::before{background-position:center bottom}
  }

  .amp{color:var(--gold);font-style:italic;font-weight:500;padding:0 .15em}

  a:focus-visible,button:focus-visible{outline:2px solid var(--navy);outline-offset:3px}
