/* ====== Variabel warna dan ukuran dasar ====== */
  :root{
    --krem:      #F5F0E6;
    --kertas:    #FCFAF4;
    --krem-tua:  #EDE6D6;
    --tinta:     #33402A;
    --tinta-lmb: #5C6650;
    --emas:      #97793F;
    --daun:      #7C8B66;
    --garis:     #D9D0BC;
    --gelap:     #2E3A26;
    --terang:    #F2ECDD;
    --terang-lmb:#C9C2AC;
    --merah:     #A2452E;
  }

  *{ margin:0; padding:0; box-sizing:border-box; }

  html{ scroll-behavior:smooth; }

  body{
    font-family:'Plus Jakarta Sans', 'Segoe UI', Arial, sans-serif;
    background:var(--krem);
    color:var(--tinta);
    line-height:1.7;
    -webkit-font-smoothing:antialiased;
  }

  /* Tekstur kertas halus di seluruh halaman */
  body::before{
    content:"";
    position:fixed; inset:0;
    pointer-events:none; z-index:90;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.045'/%3E%3C/svg%3E");
  }

  /* Bingkai halaman, hanya tampil pada layar lebar */
  body::after{
    content:"";
    position:fixed; inset:18px;
    border:1px solid rgba(169,138,77,.35);
    pointer-events:none; z-index:2;
    display:none;
  }
  @media (min-width:960px){ body::after{ display:block; } }

  body.terkunci{ overflow:hidden; }

  ::selection{ background:rgba(169,138,77,.28); }

  img,svg{ display:block; }
  a{ color:inherit; }

  /* ====== Komponen umum ====== */
  .wadah{ width:100%; max-width:640px; margin:0 auto; padding:0 22px; }
  .wadah--sempit{ max-width:560px; }

  .section{ padding:4rem 0; padding:clamp(4rem,10vw,6.5rem) 0; scroll-margin-top:14px; }

  .band{
    background:var(--kertas);
    border-top:1px solid var(--garis);
    border-bottom:1px solid var(--garis);
  }

  .kicker{
    font-size:.72rem; font-weight:600;
    letter-spacing:.3em; text-transform:uppercase;
    color:var(--emas);
  }
  .kicker--terang{ color:#CBB878; }

  .sec-head{ text-align:center; margin-bottom:clamp(2.2rem,6vw,3.2rem); }
  .sec-head h2{
    font-family:'Cormorant Garamond', Georgia, serif;
    font-weight:600;
    font-size:2rem;
    font-size:clamp(1.9rem,6vw,2.6rem);
    line-height:1.2;
    margin-top:.5rem;
  }

  /* Tombol */
  .btn{
    display:inline-flex; align-items:center; justify-content:center;
    gap:.6rem; min-height:52px; padding:.9rem 1.7rem;
    border-radius:999px; border:1px solid transparent;
    font:600 .95rem/1 'Plus Jakarta Sans', sans-serif;
    letter-spacing:.02em; text-decoration:none; cursor:pointer;
    transition:transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease;
  }
  .btn:active{ transform:scale(.97); }
  .btn:focus-visible{ outline:2px solid var(--emas); outline-offset:3px; }
  .btn-solid{ background:var(--tinta); color:var(--terang); }
  .btn-solid:hover{ background:#26311E; }
  .btn-outline{ border-color:var(--tinta); color:var(--tinta); background:transparent; }
  .btn-outline:hover{ background:var(--tinta); color:var(--terang); }
  .btn-terang{ background:var(--terang); color:var(--gelap); }
  .btn-terang:hover{ background:#FFFFFF; }

  /* Ikon garis */
  .ic{
    width:1.2em; height:1.2em; flex:none;
    fill:none; stroke:currentColor;
    stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;
  }

  /* Pembatas ornamen antarbagian */
  .divider{
    display:flex; align-items:center; gap:.9rem;
    max-width:280px; margin:1.6rem auto;
  }
  .divider .garis{ flex:1; height:1px; background:var(--garis); transform:scaleX(0); }
  .divider .garis--kiri{ transform-origin:right; }
  .divider .garis--kanan{ transform-origin:left; }
  .divider.is-visible .garis{ transform:scaleX(1); transition:transform 1s cubic-bezier(.22,.61,.36,1) .2s; }
  .divider .leafmark{ width:34px; color:var(--emas); opacity:0; transition:opacity .8s ease .55s; }
  .divider.is-visible .leafmark{ opacity:1; }

  /* ====== Animasi kemunculan saat digulir ====== */
  [data-reveal]{
    opacity:0; transform:translateY(26px);
    transition:opacity .9s ease var(--d,0s), transform .9s cubic-bezier(.22,.61,.36,1) var(--d,0s);
  }
  [data-reveal].is-visible{ opacity:1; transform:none; }

  /* ====== Hero pembuka ====== */
  .hero{
    position:relative;
    min-height:100vh; min-height:100svh;
    display:flex; align-items:center; justify-content:center;
    text-align:center; overflow:hidden;
  }
  .branch{ position:absolute; pointer-events:none; z-index:0; width:clamp(48px,10vw,120px); }
  .branch--kiri{ left:4vw; bottom:7vh; }
  .branch--kanan{ right:4vw; top:7vh; transform:rotate(180deg); }

  .branch .stem{
    stroke:#6E7D5A; stroke-width:1.6; fill:none; stroke-linecap:round;
    stroke-dasharray:1; stroke-dashoffset:1;
    animation:gambarBatang 1.6s cubic-bezier(.4,0,.2,1) .3s forwards;
  }
  .branch .leaf{ fill:var(--daun); opacity:0; animation:daunTumbuh .7s ease forwards; }
  .branch .leaf:nth-of-type(1){ animation-delay:.55s; }
  .branch .leaf:nth-of-type(2){ animation-delay:.67s; }
  .branch .leaf:nth-of-type(3){ animation-delay:.79s; }
  .branch .leaf:nth-of-type(4){ animation-delay:.91s; }
  .branch .leaf:nth-of-type(5){ animation-delay:1.03s; }
  .branch .leaf:nth-of-type(6){ animation-delay:1.15s; }

  @keyframes gambarBatang{ to{ stroke-dashoffset:0; } }
  @keyframes daunTumbuh{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }

  .hero-isi{ position:relative; z-index:1; padding:0 24px; }
  .hero-isi > *{ animation:fadeUp .9s ease both; }
  .hero-isi > *:nth-child(1){ animation-delay:.1s; }
  .hero-isi > *:nth-child(2){ animation-delay:.22s; }
  .hero-isi > *:nth-child(3){ animation-delay:.34s; }
  .hero-isi > *:nth-child(4){ animation-delay:.46s; }
  .hero-isi > *:nth-child(5){ animation-delay:.58s; }
  @keyframes fadeUp{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }

    .bingkai{
    --bk-lebar: clamp(150px, 46vw, 190px);
    position:relative;
    width:150px; width:var(--bk-lebar);
    margin:1.5rem auto 1.9rem;
    padding:8px;
    background:var(--kertas);
    border:1px solid var(--emas);
    border-radius:999px 999px 18px 18px;
    box-shadow:0 22px 44px -20px rgba(46,58,38,.35);
    }
    .bingkai::before{
    content:"";
    position:absolute; inset:-6px;
    border:1px solid rgba(169,138,77,.3);
    border-radius:999px 999px 24px 24px;
    pointer-events:none;
    }
    .bingkai::after{
    content:"";
    position:absolute; top:-4.5px; left:50%;
    width:8px; height:8px;
    background:var(--emas);
    transform:translateX(-50%) rotate(45deg);
    }
    .bingkai-dalam{
    position:relative;
    height:195px; height:calc(var(--bk-lebar) * 1.3);
    border:1px solid rgba(169,138,77,.45);
    border-radius:999px 999px 12px 12px;
    overflow:hidden;
    background:var(--krem-tua);
    }
    .bingkai-mono{
    position:absolute; inset:0; z-index:0;
    display:flex; align-items:center; justify-content:center; gap:.3rem;
    font-family:'Cormorant Garamond', serif;
    font-size:1.4rem; font-weight:500; color:var(--tinta);
    }
    .bingkai-mono i{ font-style:italic; color:var(--emas); font-size:1.05rem; }
    .bingkai-dalam img{
    position:relative; z-index:1;
    width:100%; height:100%;
    object-fit:cover; object-position:center 30%;
    }

  .nama{
    font-family:'Cormorant Garamond', Georgia, serif;
    font-weight:500;
    font-size:3rem;
    font-size:clamp(3rem,13vw,5.4rem);
    line-height:1; letter-spacing:.01em;
  }
  .nama span{ display:block; }
  .nama .nama-amp{
    font-style:italic; font-size:.48em;
    color:var(--emas); margin:.25em 0;
  }

  .hero-tanggal{
    display:flex; align-items:center; justify-content:center; gap:1rem;
    margin:1.7rem 0 2.2rem;
    font-weight:500; letter-spacing:.06em;
  }
  .hero-tanggal .garis-pendek{ width:52px; height:1px; background:var(--emas); }

  /* ====== Kutipan pembuka ====== */
  .pengantar{
    max-width:46ch; margin:1.4rem auto 0;
    color:var(--tinta-lmb); text-align:center;
  }
  blockquote{ text-align:center; max-width:52ch; margin:0 auto; }
  blockquote p{
    font-family:'Cormorant Garamond', Georgia, serif;
    font-style:italic; font-size:clamp(1.25rem,4.6vw,1.6rem);
    line-height:1.65;
  }
  blockquote cite{
    display:block; margin-top:1.2rem;
    font-style:normal; font-size:.72rem; font-weight:600;
    letter-spacing:.3em; text-transform:uppercase; color:var(--emas);
  }

  /* ====== Bagian mempelai ====== */
  .mempelai-grid{ display:grid; gap:2.4rem; }
  .mempelai{ text-align:center; }
  .foto{
    --ft-lebar: min(150px, 42vw);
    position:relative;
    width:150px; width:var(--ft-lebar);
    height:195px; height:calc(var(--ft-lebar) * 1.3);
    margin:0 auto 1.2rem;
    border:1px solid var(--emas);
    border-radius:999px 999px 14px 14px;
    overflow:hidden;
    background:var(--krem-tua);
    box-shadow:0 18px 34px -20px rgba(46,58,38,.35);
  }
  .foto::before{
    content:"";
    position:absolute; inset:5px; z-index:2;
    border:1px solid rgba(169,138,77,.45);
    border-radius:999px 999px 10px 10px;
    pointer-events:none;
  }
  .foto .huruf{
    position:absolute; inset:0;
    display:flex; align-items:center; justify-content:center;
    font-family:'Cormorant Garamond', serif; font-size:2.2rem; font-weight:500;
    color:var(--tinta);
  }
  .foto img{
    position:absolute; inset:0; width:100%; height:100%;
    object-fit:cover;
  }
  .mempelai h3{
    font-family:'Cormorant Garamond', serif; font-weight:600;
    font-size:clamp(1.5rem,5vw,1.9rem); line-height:1.25;
  }
  .mempelai .ortu{ margin-top:.6rem; font-size:.92rem; color:var(--tinta-lmb); }
  .amp{
    display:flex; align-items:center; justify-content:center;
    font-family:'Cormorant Garamond', serif; font-style:italic;
    font-size:2.8rem; color:var(--emas);
  }
  @media (min-width:640px){
    .mempelai-grid{
      grid-template-columns:1fr auto 1fr;
      align-items:center; gap:1.5rem;
    }
    .amp{ font-size:3.4rem; }
  }

  .galeri-grid{ display:grid; gap:1rem; }
  .galeri-item{
    margin:0;
    border:1px solid var(--garis); border-radius:14px;
    overflow:hidden; background:var(--kertas);
  }
  .galeri-item img{
    display:block; width:100%;
    aspect-ratio:3/4; object-fit:cover;
  }
  @media (min-width:560px){
    .galeri-grid{ grid-template-columns:1fr 1fr; }
  }

  /* ====== Detail acara dan lokasi ====== */
  .acara-item{ text-align:center; }
  .acara-item h3{
    font-family:'Cormorant Garamond', serif; font-weight:600;
    font-size:clamp(1.45rem,5vw,1.8rem); margin-bottom:.9rem;
  }
  .detail{ list-style:none; display:grid; gap:.55rem; justify-content:center; }
  .detail li{ display:flex; align-items:center; justify-content:center; gap:.65rem; }
  .detail .ic{ color:var(--emas); }

  .lokasi{
    margin-top:2.8rem; padding-top:2.4rem;
    border-top:1px solid var(--garis);
    text-align:center;
  }
  .lokasi-label{ font-size:.78rem; letter-spacing:.2em; text-transform:uppercase; color:var(--emas); font-weight:600; }
  .lokasi-nama{
    font-family:'Cormorant Garamond', serif; font-weight:600;
    font-size:clamp(1.5rem,5.5vw,1.9rem); margin-top:.5rem;
  }
  .lokasi-alamat{ max-width:40ch; margin:.5rem auto 1.6rem; font-size:.95rem; color:var(--tinta-lmb); }
  .lokasi-ket{ margin-top:.9rem; font-size:.8rem; color:var(--tinta-lmb); }

  /* ====== Panel penghitung hari ====== */
  .hitung{
    background:var(--gelap); color:var(--terang);
    text-align:center; padding:clamp(4rem,10vw,6rem) 0;
  }
  .hitung h2{
    font-family:'Cormorant Garamond', serif; font-weight:600;
    font-size:1.7rem; margin:.5rem 0 2.2rem;
    font-size:clamp(1.7rem,5.5vw,2.3rem); margin:.5rem 0 2.2rem;
  }
  .cd{ display:flex; align-items:center; justify-content:center; gap:clamp(.7rem,3vw,1.4rem); }
  .cd-item{ min-width:2.4ch; }
  .cd-item span{
    display:block;
    font-family:'Cormorant Garamond', serif; font-weight:600;
    font-size:2.4rem;
    font-size:clamp(2.4rem,9vw,3.6rem); line-height:1;
    font-variant-numeric:tabular-nums;
  }
  .cd-item small{
    display:block; margin-top:.45rem;
    font-size:.66rem; font-weight:600; letter-spacing:.26em; text-transform:uppercase;
    color:var(--terang-lmb);
  }
  .cd-sep{ width:1px; height:46px; background:rgba(242,236,221,.22); }
  .cd-selesai{
    font-family:'Cormorant Garamond', serif; font-style:italic;
    font-size:clamp(1.3rem,5vw,1.7rem); color:var(--terang);
  }
  .hitung .btn{ margin-top:2.4rem; }
  .hitung-note{ margin-top:1rem; font-size:.82rem; color:var(--terang-lmb); }

  /* ====== Amplop digital ====== */
  .kasih-teks{ max-width:48ch; margin:0 auto 2.4rem; text-align:center; color:var(--tinta-lmb); }
  .rekening{ max-width:460px; margin:0 auto; }
  .rek-baris{
    display:flex; align-items:center; justify-content:space-between;
    gap:1rem; padding:1.15rem 0;
  }
  .rekening hr{ border:0; border-top:1px solid var(--garis); }
  .rek-info{ display:grid; gap:.15rem; }
  .rek-bank{ font-size:.72rem; font-weight:600; letter-spacing:.28em; text-transform:uppercase; color:var(--emas); }
  .rek-no{ font-size:1.22rem; font-weight:600; letter-spacing:.08em; font-variant-numeric:tabular-nums; }
  .rek-nama{ font-size:.85rem; color:var(--tinta-lmb); }
  .rek-salin{
    width:46px; height:46px; flex:none;
    border-radius:50%; border:1px solid var(--garis);
    background:transparent; color:var(--tinta-lmb); cursor:pointer;
    display:grid; place-items:center;
    transition:background .25s ease, color .25s ease;
  }
  .rek-salin:hover{ background:var(--tinta); border-color:var(--tinta); color:var(--terang); }
  .rek-salin:focus-visible{ outline:2px solid var(--emas); outline-offset:3px; }

  /* ====== Formulir konfirmasi ====== */
  .rsvp-teks{ max-width:46ch; margin:0 auto 2.2rem; text-align:center; color:var(--tinta-lmb); }
  #formRsvp{ max-width:440px; margin:0 auto; }
  .field{ margin-bottom:1.15rem; border:0; }
  .field label, .field legend{
    display:block; margin-bottom:.45rem;
    font-size:.82rem; font-weight:600; letter-spacing:.05em;
  }
  .kontrol{
    width:100%; min-height:50px; padding:.8rem 1rem;
    font:inherit; color:var(--tinta);
    background:var(--krem); border:1px solid var(--garis); border-radius:10px;
    transition:border-color .25s ease, box-shadow .25s ease;
  }
  .kontrol:focus{ outline:none; border-color:var(--tinta); box-shadow:0 0 0 3px rgba(51,64,42,.12); }
  select.kontrol{
    appearance:none; -webkit-appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2333402A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat:no-repeat; background-position:right 1rem center;
  }
  .pilihan{ display:grid; gap:.8rem; padding-top:.3rem; }
  @media (min-width:420px){
    .pilihan{ grid-template-columns:1fr 1fr; }
  }
  .radio{ position:relative; display:block; cursor:pointer; }
  .radio input{ position:absolute; opacity:0; pointer-events:none; }
  .radio-kartu{
    display:flex; align-items:center; justify-content:center; gap:.55rem;
    min-height:52px; padding:.8rem 1rem;
    border:1.5px solid var(--garis); border-radius:999px;
    background:var(--krem);
    font-weight:600; font-size:.95rem; color:var(--tinta);
    transition:background .25s ease, color .25s ease, border-color .25s ease,
               transform .2s ease, box-shadow .25s ease;
  }
  .radio-cek{
    width:1.05em; height:1.05em; stroke-width:2.4;
    transform:scale(0);
    transition:transform .25s cubic-bezier(.34,1.56,.64,1);
  }
  .radio:hover .radio-kartu{ border-color:var(--tinta); }
  .radio:active .radio-kartu{ transform:scale(.97); }
  .radio input:checked + .radio-kartu{
    background:var(--tinta); border-color:var(--tinta); color:var(--terang);
    box-shadow:0 10px 22px -12px rgba(46,58,38,.5);
  }
  .radio input:checked + .radio-kartu .radio-cek{ transform:scale(1); }
  .radio input:focus-visible + .radio-kartu{ outline:2px solid var(--emas); outline-offset:3px; }
  .form-galat{ color:var(--merah); font-size:.85rem; margin-bottom:.9rem; }
  .form-catatan{ margin-top:1rem; font-size:.8rem; color:var(--tinta-lmb); text-align:center; }
  #formRsvp .btn{ width:100%; }

  /* ====== Penutup dan kaki halaman ====== */
  .penutup{ text-align:center; }
  .penutup p{ max-width:46ch; margin:0 auto; color:var(--tinta-lmb); }
  .penutup .ttd{
    margin-top:2rem;
    font-family:'Cormorant Garamond', serif; font-style:italic;
    font-size:clamp(1.6rem,6vw,2.2rem); color:var(--tinta);
  }
  .penutup .keluarga{ font-size:.85rem; letter-spacing:.14em; text-transform:uppercase; color:var(--emas); font-weight:600; }

  .kaki{
    background:var(--gelap); color:var(--terang-lmb);
    text-align:center; padding:1.9rem 1rem 1.7rem;
    font-size:.8rem; letter-spacing:.06em;
  }
  .kaki p{ margin-bottom:.9rem; }

  .kaki-kredit{
    display:inline-flex; align-items:center; gap:.45rem;
    padding:.5rem 1.1rem;
    border:1px solid rgba(242,236,221,.18); border-radius:999px;
    color:var(--terang-lmb); text-decoration:none;
    font-size:.76rem; font-weight:500; letter-spacing:.04em;
    transition:color .25s ease, border-color .25s ease, background .25s ease;
  }
  .kaki-kredit strong{ color:var(--terang); font-weight:600; }
  .kaki-kredit .ic{ width:1.05em; height:1.05em; }
  .kaki-kredit:hover,
  .kaki-kredit:focus-visible{
    color:var(--terang);
    border-color:rgba(203,184,120,.55);
    background:rgba(203,184,120,.08);
  }
  .kaki-kredit:focus-visible{ outline:2px solid var(--emas); outline-offset:3px; }

  /* ====== Dialog lokasi (peta) ====== */
  .modal{ position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:20px; }
  .modal[hidden]{ display:none; }
  .modal-veil{
    position:absolute; inset:0;
    background:rgba(35,42,28,.55);
    opacity:0; transition:opacity .3s ease;
  }
  .modal.tampil .modal-veil{ opacity:1; }
  .modal-card{
    position:relative; width:100%; max-width:420px;
    background:var(--kertas); border-radius:16px;
    padding:clamp(1.7rem,5vw,2.3rem);
    text-align:center;
    box-shadow:0 24px 60px rgba(30,38,24,.35);
    opacity:0; transform:translateY(18px) scale(.98);
    transition:opacity .3s ease, transform .3s cubic-bezier(.22,.61,.36,1);
  }
  .modal.tampil .modal-card{ opacity:1; transform:none; }
  .modal-close{
    position:absolute; top:12px; right:12px;
    width:40px; height:40px; border:0; border-radius:50%;
    background:transparent; color:var(--tinta-lmb); cursor:pointer;
    display:grid; place-items:center;
    transition:background .25s ease;
  }
  .modal-close:hover{ background:var(--krem-tua); }
  .modal-close:focus-visible{ outline:2px solid var(--emas); }
  .modal-venue{
    font-family:'Cormorant Garamond', serif; font-weight:600;
    font-size:1.6rem; margin-top:.4rem;
  }
  .modal-alamat{ font-size:.92rem; color:var(--tinta-lmb); margin-top:.35rem; }
  .modal-kordinat{
    margin-top:.8rem; font-size:.78rem; letter-spacing:.12em;
    color:var(--emas); font-weight:600; font-variant-numeric:tabular-nums;
  }
  .modal-aksi{ display:flex; flex-direction:column; gap:.7rem; margin-top:1.5rem; }

  /* ====== Toast pemberitahuan ====== */
  .toast{
    position:fixed; left:50%; bottom:26px; z-index:120;
    display:flex; align-items:center; gap:.55rem;
    background:var(--gelap); color:var(--terang);
    padding:.85rem 1.3rem; border-radius:999px;
    font-size:.88rem; font-weight:500;
    box-shadow:0 14px 34px rgba(30,38,24,.35);
    opacity:0; transform:translate(-50%,16px);
    pointer-events:none;
    transition:opacity .35s ease, transform .35s cubic-bezier(.22,.61,.36,1);
  }
  .toast.tampil{ opacity:1; transform:translate(-50%,0); }
  .toast .ic{ color:#CBB878; }

  /* ====== Penyesuaian layar sangat kecil ====== */
  @media (max-width:360px){
    .wadah{ padding:0 16px; }
    .btn{ padding:.85rem 1.2rem; font-size:.9rem; }
    .cd{ gap:.5rem; }
    .cd-item span{ font-size:2.1rem; }
    .cd-item small{ letter-spacing:.16em; }
    .cd-sep{ height:36px; }
    .hero-tanggal{ gap:.6rem; }
    .hero-tanggal .garis-pendek{ width:34px; }
}

  /* Matikan animasi apabila pengguna meminta pengurangan gerak */
  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    *, *::before, *::after{
      animation-duration:.01ms !important;
      animation-iteration-count:1 !important;
      transition-duration:.01ms !important;
    }
    [data-reveal]{ opacity:1; transform:none; }
  }

/* ====== Keterbacaan semua umur & kenyamanan sentuh ====== */
html{ -webkit-text-size-adjust:100%; }
body{ -webkit-tap-highlight-color:transparent; }
a, button, input, select{ touch-action:manipulation; }

.kicker{ font-size:.78rem; }
.cd-item small{ font-size:.7rem; }
.hitung-note, .lokasi-ket{ font-size:.88rem; }
.lokasi-alamat{ font-size:1rem; }
.rek-nama{ font-size:.92rem; }
.field label, .field legend{ font-size:.9rem; }
.form-galat{ font-size:.92rem; }
.penutup .keluarga{ font-size:.9rem; }
.kaki{ font-size:.85rem; }

/* ====== Ornamen bunga ====== */
.section--rumbai{ position:relative; overflow:hidden; }
.section--rumbai > .wadah{ position:relative; z-index:1; }

.rumbai{
  position:absolute; z-index:0;
  width:clamp(60px,14vw,110px); height:auto;
  opacity:.75; pointer-events:none;
}
.rumbai--garis{ opacity:.4; color:#CBB878; }

.rumbai--ta{ top:-2px; left:-2px;     transform:scaleY(-1); animation:goyang-atas 7s ease-in-out infinite alternate; }
.rumbai--tr{ top:-2px; right:-2px;    transform:scale(-1);  animation:goyang-atas-kanan 7s ease-in-out infinite alternate; }
.rumbai--bl{ bottom:-2px; left:-2px;  animation:goyang-bawah 7s ease-in-out infinite alternate; }
.rumbai--br{ bottom:-2px; right:-2px; transform:scaleX(-1); animation:goyang-bawah-kanan 7s ease-in-out infinite alternate; }

@keyframes goyang-bawah        { from{ transform:rotate(-1.4deg); }              to{ transform:rotate(1.4deg); } }
@keyframes goyang-atas         { from{ transform:scaleY(-1) rotate(-1.4deg); }   to{ transform:scaleY(-1) rotate(1.4deg); } }
@keyframes goyang-bawah-kanan  { from{ transform:scaleX(-1) rotate(-1.4deg); }   to{ transform:scaleX(-1) rotate(1.4deg); } }
@keyframes goyang-atas-kanan   { from{ transform:scale(-1) rotate(-1.4deg); }    to{ transform:scale(-1) rotate(1.4deg); } }

/* Bunga di ujung ranting hero, mekar setelah daun selesai tumbuh */
.bunga-ranting{ opacity:0; animation:daunTumbuh .7s ease 1.3s forwards; }

@media (max-width:360px){
  .rumbai{ width:54px; }
}

/* Mode hemat perangkat lemah: hentikan animasi goyang tak berujung */
html.hemat .rumbai{ animation:none; }

/* ====== Tombol aksi lokasi ====== */
.lokasi-aksi{
  display:flex; flex-wrap:wrap; justify-content:center; gap:.8rem;
  max-width:420px; margin:1.6rem auto 0;
}
.lokasi-aksi .btn{ flex:1 1 100%; }
@media (min-width:520px){
  .lokasi-aksi .btn{ flex:1 1 0; }
}

/* ====== Sampul pembuka ====== */
.sampul{
  position:fixed; inset:0; z-index:95;
  background:var(--krem);
  display:flex; align-items:center; justify-content:center;
  padding:clamp(1rem,4vw,2.5rem);
  border-bottom:1px solid var(--garis);
  transition:transform 1.05s cubic-bezier(.77,0,.18,1);
  overflow:hidden;
}
.sampul.terbuka{ transform:translateY(-102%); }

.sampul-kelopak{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }

.sampul-kartu{
  position:relative; z-index:1; width:100%; max-width:480px; text-align:center;
  background:var(--kertas);
  border:1px solid var(--emas);
  padding:clamp(2rem,6vw,3rem) clamp(1.2rem,5vw,2.4rem);
  box-shadow:0 30px 60px -30px rgba(46,58,38,.45);
}
.sampul-kartu::before{
  content:""; position:absolute; inset:8px;
  border:1px solid rgba(169,138,77,.35);
  pointer-events:none;
}
/* Ornamen yang menggambar dirinya sendiri */
.sampul-ornamen{
  width:clamp(180px,52vw,280px); display:block; margin:0 auto; color:var(--emas);
}
.sampul-ornamen path{
  stroke-dasharray:1; stroke-dashoffset:1;
  animation:gambarGaris 1.5s ease .2s forwards;
}
.sampul-ornamen-titik{ opacity:0; animation:fadeTipis .6s ease 1.4s forwards; }
@keyframes gambarGaris{ to{ stroke-dashoffset:0; } }
@keyframes fadeTipis{ to{ opacity:1; } }

/* Kemunculan berurutan per elemen (delay via --d di HTML) */
.sampul-kartu .c-in{
  animation:fadeUp .9s cubic-bezier(.22,1,.36,1) both;
  animation-delay:var(--d,0s);
}

.ornamen-garis{
  display:flex; align-items:center; justify-content:center; gap:14px;
  color:var(--emas); margin:1.4rem auto;
}
.ornamen-garis i{ display:block; width:clamp(44px,12vw,84px); height:1px; background:currentColor; opacity:.5; }
.ornamen-garis b{ display:block; width:7px; height:7px; transform:rotate(45deg); background:currentColor; }

.nama--sampul{ font-size:clamp(2.4rem,10vw,3.6rem); margin:.35rem 0 0; }
.sampul-tanggal{
  font-family:'Cormorant Garamond',serif; font-style:italic;
  font-size:clamp(1.1rem,3.6vw,1.3rem); color:var(--tinta-lmb);
}
.sampul-kepada{
  max-width:24rem; margin:1.4rem auto 0;
  padding:1rem 1.2rem;
  background:var(--krem); border:1px solid var(--garis);
}
.sampul-kepada-label{
  font-size:.7rem; font-weight:600; letter-spacing:.18em;
  text-transform:uppercase; color:var(--tinta-lmb);
}
.sampul-kepada-nama{
  font-family:'Cormorant Garamond',serif; font-weight:600;
  font-size:clamp(1.4rem,5vw,1.7rem); line-height:1.3;
  margin-top:.3rem; color:var(--tinta);
  overflow-wrap:break-word;
}
.sampul-buka{ margin-top:1.4rem; }
.sampul-catatan{
  margin-top:1.2rem; font-size:.8rem;
  font-style:italic; color:var(--tinta-lmb);
}

/* ====== Peta tertanam ====== */
.peta-bingkai{
  background:var(--kertas); border:1px solid var(--garis);
  padding:8px; max-width:560px; margin:1.8rem auto 0;
  box-shadow:0 22px 45px -28px rgba(46,58,38,.45);
}
.peta-bingkai iframe{
  display:block; width:100%;
  height:clamp(220px,42vw,340px); border:0;
  filter:sepia(.18) saturate(.92);
}
.lokasi .lokasi-aksi{ margin-top:1.6rem; }

/* ====== Tombol gulir hero ====== */
.cue{
  display:inline-flex; align-items:center; justify-content:center;
  width:52px; height:52px; border-radius:50%;
  border:1px solid var(--garis); background:var(--kertas);
  color:var(--tinta-lmb); cursor:pointer;
  animation:bob 2.4s ease-in-out infinite;
  transition:color .3s ease, border-color .3s ease;
}
.cue:hover{ color:var(--emas); border-color:var(--emas); }
.cue:focus-visible{ outline:2px solid var(--emas); outline-offset:3px; }
.cue .ic{ width:1.3em; height:1.3em; }
@keyframes bob{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(9px);} }

/* ====== Acara: tanggal besar + grid berdampingan ====== */
.tanggal-besar{
  display:flex; align-items:center; justify-content:center;
  gap:clamp(.9rem,3.5vw,1.7rem); margin-top:2rem;
}
.tb-sisi{ font-size:.76rem; letter-spacing:.3em; text-transform:uppercase; color:var(--tinta-lmb); }
.tb-sisi b{
  display:block; font-weight:500; padding:.5rem .1rem;
  border-top:1px solid var(--garis); border-bottom:1px solid var(--garis);
}
.tb-sisi:first-child b{ text-align:right; }
.tb-sisi:last-child b{ text-align:left; }
.tb-angka{
  font-family:'Cormorant Garamond',serif; font-weight:500; line-height:1;
  font-size:3.4rem; font-size:clamp(3.4rem,15vw,6rem);
}
.acara-grid{
  display:grid; grid-template-columns:1fr auto 1fr; align-items:stretch;
  gap:clamp(1.5rem,4vw,3rem); max-width:640px; margin:3rem auto 0;
}
.acara-ikon{ width:1.6em; height:1.6em; color:var(--emas); margin:0 auto; }
.acara-item h3{ margin:.7rem 0 0; }
.acara-jam{
  margin-top:.55rem; font-size:.98rem; color:var(--tinta-lmb);
  display:flex; align-items:center; justify-content:center; gap:.5rem;
}
.acara-jam .ic{ width:1.05em; height:1.05em; color:var(--emas); }
.acara-ket{ margin-top:.5rem; font-size:.92rem; color:var(--tinta-lmb); max-width:22rem; margin-inline:auto; }
.acara-pembatas{ display:flex; flex-direction:column; align-items:center; gap:.8rem; color:var(--emas); }
.acara-pembatas::before,.acara-pembatas::after{ content:""; flex:1; width:1px; background:currentColor; opacity:.5; }
.acara-pembatas b{ display:block; width:7px; height:7px; transform:rotate(45deg); background:currentColor; }
@media (max-width:680px){
  .acara-grid{ grid-template-columns:1fr; }
  .acara-pembatas{ flex-direction:row; padding:0 8%; }
  .acara-pembatas::before,.acara-pembatas::after{ height:1px; width:auto; }
}

/* ====== Galeri: kolase foto miring ala kartu pos ====== */
.kolase{
  display:grid; grid-template-columns:1.2fr 1fr; gap:clamp(.9rem,3vw,1.6rem);
  max-width:640px; margin:0 auto;
}
.jepret{
  --miring:0deg; margin:0;
  background:var(--kertas); border:1px solid var(--garis);
  padding:10px 10px 0;
  box-shadow:0 20px 45px -28px rgba(46,58,38,.5);
  transition:transform .6s ease;
}
.jepret--a{ --miring:-1.6deg; }
.jepret--b{ --miring:1.4deg; }
.jepret[data-reveal],
.jepret[data-reveal].is-visible{ transform:rotate(var(--miring)); }
.jepret:hover{ transform:rotate(0deg)!important; }
.jepret-bingkai{ overflow:hidden; }
.jepret img{
  display:block; width:100%; aspect-ratio:4/5; object-fit:cover;
  filter:saturate(.9) sepia(.1); transition:transform 1s ease;
}
.jepret--b img{ aspect-ratio:4/3; }
.jepret:hover img{ transform:scale(1.05); }
.jepret figcaption{
  font-family:'Cormorant Garamond',serif; font-style:italic; text-align:center;
  padding:.7rem .2rem .85rem; color:var(--tinta-lmb);
  font-size:.95rem; font-size:clamp(.92rem,2.6vw,1.05rem);
}

/* ====== RSVP: kartu formulir + label kapital ====== */
#formRsvp{
  background:var(--kertas); border:1px solid var(--garis);
  padding:clamp(1.5rem,5vw,2.4rem);
  box-shadow:0 25px 55px -32px rgba(46,58,38,.4);
}
.field label, .field legend{
  font-size:.74rem; font-weight:500; letter-spacing:.22em;
  text-transform:uppercase; color:var(--tinta-lmb); margin-bottom:.55rem;
}
.kontrol--teks{ min-height:110px; resize:vertical; }

/* ====== Footer: garis pemisah seperti referensi ====== */
.kaki{ padding:0 1rem 1.9rem; }
.kaki::before{
  content:""; display:block;
  width:min(460px,100%); height:1px; margin:0 auto;
  background:rgba(242,236,221,.16);
}
.kaki p{ padding-top:1.4rem; letter-spacing:.08em; }