/* =========================================================
   SECTIONS — tata letak tiap bagian undangan
   ========================================================= */

/* ---------- Section 3 · Ayat ---------- */
.scripture {
  display: flex;
  align-items: center;
  min-height: 92vh;
  min-height: 92svh;
  padding-block: var(--section-y);
  text-align: center;
}
.scripture .bg-media { --pos: 50% 55%; }
.scripture__inner { position: relative; }
.scripture__figure { margin-top: 2rem; }
.scripture__text {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(1.3rem, 5.2vw, 1.85rem);
  line-height: 1.55;
  color: var(--on-dark);
  text-wrap: pretty;
}
.scripture__text p + p { margin-top: .55em; }
.scripture__text::before {
  content: "“";
  display: block;
  height: .55em;
  font-size: 3.4em;
  line-height: 1;
  font-style: normal;
  color: var(--gold-soft);
  opacity: .75;
}
.scripture__ref {
  display: inline-block;
  margin-top: 1.8rem;
  padding: 8px 18px;
  border-radius: 999px;
  border: 1px solid rgba(233, 207, 138, .4);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--gold-light);
}

/* ---------- Section 4 · Wedding Couple ---------- */
.couple__layout {
  display: grid;
  gap: clamp(3rem, 8vw, 4.5rem);
  align-items: center;
  justify-items: center;
}
.couple__photo { --pos: 50% 20%; }
.couple__text { max-width: 36rem; text-align: center; }
.couple__names {
  margin-top: 1.6rem;
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2.2rem, 9vw, 3.2rem);
  line-height: 1.1;
  color: var(--wine);
}
.couple__names .amp { font-style: italic; color: var(--gold-ink); }

/* ---------- Section 5 · Mempelai ---------- */
.profiles__grid {
  display: grid;
  gap: 2.2rem;
  justify-items: center;
}
.profile { width: 100%; max-width: 420px; text-align: center; }
.profile .arch { max-width: 300px; margin-bottom: 2.4rem; }
.profile__role {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .34em;
  text-transform: uppercase;
  color: var(--rose-ink);
}
.profile__name {
  margin-top: .5rem;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(1.9rem, 7.6vw, 2.5rem);
  line-height: 1.15;
  color: var(--wine);
  text-wrap: balance;
}
.profile__order {
  margin-top: 1rem;
  font-size: 12.5px;
  letter-spacing: .08em;
  color: var(--ink-soft);
}
.profile__parents {
  margin-top: .35rem;
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.45;
  color: var(--ink);
}
.profile__parents span { display: block; }
.profile__parents .amp { font-style: italic; color: var(--gold-ink); font-size: 1.1rem; }
.profiles__amp {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 300;
  font-size: 4.5rem;
  line-height: 1;
  color: var(--gold);
}
/* Mempelai di atas maroon: nama emas foil, peran perak, orang tua gading */
.section--maroon .profile__role { color: var(--silver); }
.section--maroon .profile__name {
  background: var(--grad-gold);
  background-size: 220% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.section--maroon .profile__order { color: var(--on-dark-soft); }
.section--maroon .profile__parents { color: var(--on-dark); }
.section--maroon .profile__parents .amp { color: var(--gold-soft); }
.section--maroon .profiles__amp {
  background: var(--grad-silver);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  padding-inline: .1em;
}
.section--maroon .arch::before { border-color: rgba(233, 207, 138, .75); }
.section--maroon .arch::after { border-color: rgba(220, 222, 229, .6); }

/* ---------- Section 6 · Wedding Event (Save the date) ---------- */
.event-intro { text-align: center; }
.date-lockup {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  color: var(--wine);
}
.date-lockup__day, .date-lockup__month {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .5em;
  padding-left: .5em;
  text-transform: uppercase;
  color: var(--gold-ink);
}
.date-lockup__row { display: flex; align-items: center; gap: 18px; margin: .3rem 0 .5rem; }
.date-lockup__line { width: 64px; height: 1px; background: linear-gradient(90deg, transparent, var(--gold), var(--silver-deep)); }
.date-lockup__row .date-lockup__line:last-child { transform: scaleX(-1); }
.date-lockup__num {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(5rem, 22vw, 7.5rem);
  line-height: 1;
  background: var(--grad-gold-ink);
  background-size: 220% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.event-intro__times {
  display: grid;
  gap: 12px;
  margin: 2.4rem auto 0;
  max-width: 460px;
}
.time-chip {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 14px 20px;
  border-radius: 16px;
  background: rgba(255, 255, 255, .7);
  border: 1px solid rgba(212, 169, 71, .35);
  text-align: left;
}
.time-chip__label { font-family: var(--font-display); font-size: 1.3rem; font-weight: 500; color: var(--wine); line-height: 1.2; }
.time-chip__time { font-size: 12px; font-weight: 600; letter-spacing: .14em; color: var(--gold-ink); white-space: nowrap; }

/* ---------- Section 7 · Countdown ----------
   Foto tampil utuh di pita atas lalu larut ke maroon; judul & timer berada DI BAWAH foto
   sehingga wajah pengantin tidak pernah tertutup. Laptop: foto kiri, timer kanan (lihat RESPONSIVE). */
.countdown {
  display: flex;
  flex-direction: column;
  padding: 0 0 var(--section-y);
  text-align: center;
}
.countdown .bg-media {
  --pos: 50% 46%;
  position: relative;
  inset: auto;
  z-index: 0;
  flex: none;
  height: clamp(420px, 76svh, 760px);
  -webkit-mask-image: linear-gradient(180deg, #000 72%, transparent);
  mask-image: linear-gradient(180deg, #000 72%, transparent);
}
.countdown .bg-media::after {
  /* tidak ada teks di atas foto → cukup rona maroon tipis di tepi atas */
  background: linear-gradient(180deg, rgba(44, 4, 13, .3), rgba(44, 4, 13, 0) 22%);
}
.countdown__inner { position: relative; z-index: 1; margin-top: -56px; }
.timer {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(8px, 2.5vw, 18px);
  max-width: 560px;
  margin: 2.6rem auto 0;
}
.timer__unit {
  position: relative;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  aspect-ratio: 4 / 5;
  border-radius: 20px 20px 999px 999px;
  border: 1px solid transparent;
  background:
    linear-gradient(180deg, rgba(44, 4, 13, .58), rgba(44, 4, 13, .38)) padding-box,
    linear-gradient(160deg, rgba(246, 227, 168, .85), rgba(220, 222, 229, .35) 50%, rgba(230, 232, 238, .8)) border-box;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 18px 40px -22px rgba(0, 0, 0, .7);
}
.timer__num {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(2rem, 9vw, 3.2rem);
  line-height: 1;
  font-variant-numeric: tabular-nums lining-nums;
  color: var(--gold-light);
}
.timer__label {
  margin-top: .45rem;
  font-size: clamp(8.5px, 2.3vw, 10.5px);
  font-weight: 500;
  letter-spacing: .22em;
  padding-left: .22em;
  text-transform: uppercase;
  color: var(--on-dark-soft);
}
.countdown__status {
  margin-top: 2rem;
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(1.1rem, 4.4vw, 1.35rem);
  color: var(--rose-soft);
}

/* ---------- Section 8–11 · Kartu acara & peta ---------- */
.events__grid {
  display: grid;
  gap: 1.6rem;
  max-width: 560px;
}
.event-card {
  padding: clamp(2.6rem, 8vw, 3.4rem) clamp(1.5rem, 6vw, 2.6rem) clamp(2.2rem, 7vw, 2.8rem);
  text-align: center;
}
.event-card__icon {
  display: grid; place-items: center;
  width: 64px; height: 64px;
  margin: 0 auto 1.2rem;
  border-radius: 50%;
  color: var(--wine);
  background: radial-gradient(circle at 30% 25%, #fff, var(--blush) 70%);
  border: 1px solid rgba(212, 169, 71, .55);
  box-shadow: 0 0 0 6px rgba(255, 255, 255, .7), 0 0 0 7px rgba(212, 169, 71, .25);
}
.event-card__icon .icon { width: 28px; height: 28px; stroke-width: 1.3; }
.event-card__title {
  margin-top: .6rem;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(2rem, 8vw, 2.6rem);
  line-height: 1.1;
  color: var(--wine);
}
.event-card__list { display: grid; gap: 1rem; margin: 1.8rem 0 0; }
.event-card__item {
  display: grid;
  justify-items: center;
  gap: 4px;
  color: var(--ink);
}
.event-card__item .icon { width: 20px; height: 20px; color: var(--gold-ink); margin-bottom: 2px; }
.event-card__strong { font-family: var(--font-display); font-size: 1.35rem; font-weight: 500; line-height: 1.3; }
.event-card__soft { font-size: 13px; color: var(--ink-soft); line-height: 1.6; }

.map-card { padding: 12px; }
.map-card__head { padding: 1.4rem 1rem 1.2rem; text-align: center; }
.map-card__title {
  margin-top: .4rem;
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 1.45rem;
  line-height: 1.25;
  color: var(--wine);
}
.map-frame {
  position: relative;
  aspect-ratio: 4 / 3;
  border-radius: 18px;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 45%, rgba(212, 169, 71, .22), transparent 55%),
    repeating-linear-gradient(0deg, rgba(166, 124, 46, .08) 0 1px, transparent 1px 28px),
    repeating-linear-gradient(90deg, rgba(166, 124, 46, .08) 0 1px, transparent 1px 28px),
    var(--ivory);
  isolation: isolate;
}
.map-frame iframe {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  border: 0;
  pointer-events: none; /* pratinjau saja → tidak "menjebak" gesture scroll di HP */
  opacity: 0;
  transition: opacity .6s var(--ease-lux);
}
.map-frame.is-loaded iframe { opacity: 1; }
.map-frame__placeholder {
  position: absolute; inset: 0;
  display: grid; place-content: center; justify-items: center; gap: 8px;
  padding: 16px;
  text-align: center;
  font-size: 12.5px;
  color: var(--ink-soft);
}
.map-frame__placeholder .icon { width: 34px; height: 34px; color: var(--rose-ink); }
.map-frame.is-loaded .map-frame__placeholder { opacity: 0; }
.map-frame__link { position: absolute; inset: 0; z-index: 2; }
.map-card__actions {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 10px;
  padding: 1.3rem .5rem .9rem;
}
.map-card__actions .btn { flex: 1 1 auto; }

/* ---------- Section 12 · Galeri (masonry) ---------- */
.masonry {
  columns: 2;
  column-gap: 12px;
}
.masonry__item {
  position: relative;
  display: block;
  width: 100%;
  margin: 0 0 12px;
  padding: 0;
  border: 0;
  border-radius: 16px;
  overflow: hidden;
  background: var(--tone, var(--blush));
  box-shadow: 0 14px 34px -22px rgba(74, 10, 24, .55);
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  cursor: zoom-in;
  touch-action: manipulation;
  transform: translateZ(0);
  -webkit-mask-image: -webkit-radial-gradient(white, black);
}
.masonry__item img {
  width: 100%;
  height: auto;
  transition: transform 1.1s var(--ease-out-expo), filter .6s;
}
.masonry__item::after {
  content: "";
  position: absolute; inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .35);
  background: linear-gradient(180deg, transparent 55%, rgba(74, 10, 24, .35));
  opacity: 0;
  transition: opacity .5s;
  pointer-events: none;
}
.masonry__item:active img { transform: scale(1.03); }
@media (hover: hover) and (pointer: fine) {
  .masonry__item:hover img { transform: scale(1.06); }
  .masonry__item:hover::after { opacity: 1; }
}
.masonry__item--feature { column-span: all; margin-bottom: 12px; }
/* Galeri di atas maroon: bingkai emas tipis di setiap foto */
.section--maroon .masonry__item { box-shadow: 0 0 0 1px rgba(233, 207, 138, .42), 0 20px 44px -24px rgba(0, 0, 0, .85); }

/* ---------- Section 13 · Keluarga ---------- */
.family__list { display: grid; gap: 0; text-align: center; }
.family__list li {
  font-family: var(--font-display);
  font-size: clamp(1.45rem, 6vw, 1.9rem);
  font-weight: 400;
  line-height: 1.3;
  color: var(--wine);
  padding: .9rem 0;
}
.family__list li + li::before {
  content: "";
  display: block;
  width: 6px; height: 6px;
  margin: 0 auto 1.6rem;
  transform: rotate(45deg) translateY(-.4rem);
  background: var(--grad-rose-gold);
}
.family__list .is-couple { font-style: italic; color: var(--gold-ink); font-size: clamp(1.7rem, 7vw, 2.2rem); }

/* ---------- Section 14 · Turut mengundang ---------- */
.co-invite__grid { display: grid; gap: 1.4rem; max-width: 900px; margin: 0 auto; }
.co-invite__card { padding: 2.4rem 1.6rem 2rem; text-align: center; }
.co-invite__title {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--rose-ink);
}
.co-invite__list { margin-top: 1.3rem; display: grid; gap: .55rem; }
.co-invite__list li {
  font-family: var(--font-display);
  font-size: 1.22rem;
  font-weight: 500;
  line-height: 1.35;
  color: var(--ink);
}

/* ---------- RSVP ---------- */
.rsvp__card { padding: clamp(1.8rem, 6vw, 2.8rem) clamp(1.3rem, 5vw, 2.4rem); }
.rsvp__actions { margin-top: 1.8rem; display: flex; flex-direction: column; align-items: center; }
.rsvp__actions .btn { width: 100%; max-width: 320px; }
.rsvp__send-label { margin-bottom: .8rem; font-size: 12.5px; letter-spacing: .04em; text-align: center; color: var(--ink-soft); }
.rsvp__send-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); gap: 10px; width: 100%; max-width: 360px; }
.rsvp__send-row .btn { padding: 0 1em; }
.rsvp__note { margin-top: .8rem; font-size: 12.5px; line-height: 1.6; color: var(--ink-soft); }
.rsvp__done { text-align: center; padding: 1rem 0; }
.rsvp__done .icon {
  width: 56px; height: 56px; margin: 0 auto 1rem;
  padding: 14px; border-radius: 50%;
  color: var(--wine-deep); background: var(--grad-gold-btn);
}
.rsvp__done h3 { font-family: var(--font-display); font-weight: 400; font-size: 1.9rem; color: var(--wine); line-height: 1.2; }
.rsvp__done p { margin-top: .6rem; color: var(--ink-soft); font-size: 14px; }
.rsvp__status { margin-top: 1rem; font-size: 13px; text-align: center; color: var(--ink-soft); min-height: 1.5em; }
.rsvp__status.is-error { color: #b3261e; }

/* ---------- Tanda Kasih · Amplop Digital ---------- */
.gift .section-sub { max-width: 40ch; }
.gift__list { display: grid; gap: 2.4rem; justify-items: center; }
.gift__item { display: grid; justify-items: center; gap: 1.5rem; width: 100%; max-width: 380px; }
/* Kartu rekening bergaya kartu premium: maroon pekat, bingkai emas-perak, chip emas, kilau perak */
.gift-card {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  aspect-ratio: 1.586; /* rasio kartu bank ID-1; tinggi bertambah otomatis bila layar sangat sempit */
  padding: 20px 22px 18px;
  border: 1px solid transparent;
  border-radius: 20px;
  text-align: left;
  color: var(--on-dark);
  background:
    radial-gradient(120% 90% at 0% 0%, rgba(160, 30, 55, .6), transparent 60%) padding-box,
    radial-gradient(90% 80% at 100% 100%, rgba(212, 169, 71, .2), transparent 60%) padding-box,
    var(--damask) padding-box,
    linear-gradient(135deg, #3b0714 0%, #1f030a 60%, #2c040d 100%) padding-box,
    var(--grad-frame) border-box;
  box-shadow: 0 34px 60px -30px rgba(0, 0, 0, .95), 0 0 34px -12px rgba(233, 207, 138, .35), inset 0 1px 0 rgba(255, 255, 255, .08);
  isolation: isolate;
}
.gift-card__shine {
  position: absolute; inset: 0;
  z-index: 1;
  border-radius: inherit;
  overflow: hidden;
  pointer-events: none;
}
.gift-card__shine::before {
  content: "";
  position: absolute;
  top: -40%; bottom: -40%; left: -60%;
  width: 55%;
  background: linear-gradient(105deg, transparent, rgba(255, 255, 255, .07) 35%, rgba(255, 255, 255, .3) 50%, rgba(255, 255, 255, .07) 65%, transparent);
  transform: translateX(0) rotate(8deg);
}
.gift-card__top { display: flex; align-items: center; justify-content: space-between; margin-bottom: auto; padding-bottom: 12px; }
.gift-card__chip {
  width: 46px; height: 35px;
  border-radius: 7px;
  background:
    linear-gradient(90deg, transparent 31%, rgba(110, 78, 24, .5) 31% 33%, transparent 33% 67%, rgba(110, 78, 24, .5) 67% 69%, transparent 69%),
    linear-gradient(0deg, transparent 30%, rgba(110, 78, 24, .5) 30% 33%, transparent 33% 67%, rgba(110, 78, 24, .5) 67% 70%, transparent 70%),
    var(--grad-gold-btn);
  box-shadow: inset 0 0 0 1px rgba(110, 78, 24, .45), 0 1px 3px rgba(0, 0, 0, .45);
}
.gift-card__bank {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 500;
  font-size: 2rem;
  line-height: 1;
  letter-spacing: .06em;
  background: var(--grad-gold);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  padding-inline: .08em;
}
.gift-card__label {
  margin-top: 8px;
  font-size: 9.5px;
  font-weight: 500;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: rgba(220, 222, 229, .72);
  line-height: 1.4;
}
.gift-card__number {
  font-size: clamp(1.3rem, 6.4vw, 1.6rem);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: .14em;
  font-variant-numeric: tabular-nums lining-nums;
  background: var(--grad-silver);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.gift-card__holder {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .22em;
  line-height: 1.4;
  color: var(--silver-light);
}
.gift__copy { min-width: min(280px, 100%); }

/* ---------- Section 15 · Penutup ---------- */
.closing {
  display: flex;
  align-items: center;
  min-height: 100vh;
  min-height: 100svh;
  padding-block: var(--section-y);
  text-align: center;
}
.closing .bg-media { --pos: 50% 68%; }
.closing .bg-media::after {
  background:
    radial-gradient(120% 90% at 50% 45%, transparent 25%, rgba(22, 2, 7, .6) 100%),
    linear-gradient(180deg, rgba(44, 4, 13, .88) 0%, rgba(110, 20, 38, .62) 50%, rgba(22, 2, 7, .92) 100%);
}
.closing__text {
  margin-top: 2rem;
  font-family: var(--font-display);
  font-size: clamp(1.2rem, 4.8vw, 1.45rem);
  line-height: 1.65;
  color: var(--on-dark);
  text-wrap: pretty;
}
.closing__blessing {
  margin-top: 1.4rem;
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.35rem;
  color: var(--rose-soft);
}
.closing__sign { margin-top: 2.4rem; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--on-dark-soft); }
.closing__names {
  margin-top: .8rem;
  font-size: clamp(2.5rem, 11vw, 3.6rem);
}
@media (min-width: 640px) {
  .closing__names { flex-direction: row; justify-content: center; gap: .3em; }
}
.closing__names > span:not(.amp) {
  background: var(--grad-gold);
  background-size: 220% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.closing__names .amp { color: var(--silver); font-size: .75em; line-height: 1.3; }

/* ---------- Section 16 · Footer ---------- */
.footer {
  position: relative;
  /* ruang bawah ≥ tinggi dock + tumpukan tombol mengambang (±192px) agar baris terakhir tidak tertutup */
  padding: 4rem 0 calc(var(--safe-b) + 220px);
  text-align: center;
  color: var(--on-dark-soft);
  background:
    radial-gradient(80% 60% at 50% 0%, rgba(140, 29, 51, .5), transparent 70%),
    var(--wine-night);
}
.footer__inner { display: flex; flex-direction: column; align-items: center; gap: .5rem; }
.monogram {
  /* flex (bukan grid): "R", "&", "M" harus satu baris — grid menumpuknya vertikal */
  display: flex; align-items: center; justify-content: center;
  flex: none;
  width: 84px; height: 84px;
  margin-bottom: .8rem;
  border-radius: 50%;
  border: 1px solid rgba(233, 207, 138, .55);
  box-shadow: 0 0 0 6px rgba(44, 4, 13, 1), 0 0 0 7px rgba(220, 222, 229, .3);
  font-family: var(--font-display);
  font-size: 1.7rem;
  font-weight: 300;
  letter-spacing: .06em;
  color: var(--gold-light);
}
.monogram i { font-style: italic; color: var(--silver); padding: 0 .06em; }
.footer__names { font-family: var(--font-display); font-size: 1.8rem; font-weight: 300; color: var(--on-dark); letter-spacing: .06em; }
.footer__date { font-size: 12px; letter-spacing: .4em; padding-left: .4em; color: var(--gold-soft); }
.footer__song { display: inline-flex; align-items: center; gap: 8px; margin-top: 1rem; font-size: 12px; color: var(--on-dark-soft); }
.footer__song .icon { width: 15px; height: 15px; color: var(--gold-soft); }
.footer .btn { margin-top: 1.4rem; }
.footer__copy { margin-top: 1.2rem; font-size: 11px; letter-spacing: .06em; color: rgba(251, 245, 239, .5); text-wrap: balance; }

/* Kredit pembuat undangan & kontak */
.footer__credit {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .3rem;
  width: min(100%, 560px);
  margin-top: 2.4rem;
  padding-top: 2.2rem;
  border-top: 1px solid rgba(233, 207, 138, .18);
}
.footer__credit-label {
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: .32em;
  padding-left: .32em;
  text-transform: uppercase;
  color: var(--on-dark-soft);
}
.footer__brand {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 .4em;
  font-family: var(--font-display);
  font-size: 1.75rem;
  font-weight: 500;
  letter-spacing: .04em;
  color: var(--gold-light);
  text-decoration: none;
  transition: color .3s;
}
.footer__brand:hover { color: #fff; }
.footer__cta { margin-top: 1.1rem; }
.footer__cta .btn { margin-top: 0; }

/* =========================================================
   RESPONSIVE
   ========================================================= */

/* Layar pendek (HP lama / landscape kecil): rapatkan sampul */
@media (max-height: 700px) {
  .cover__names { font-size: clamp(2.3rem, 10.5vw, 3.4rem); }
  .cover__guest { padding: .6rem 1.2rem; margin-top: .8rem; }
  .cover__note { display: none; }
  .hero__names { font-size: clamp(2.5rem, 11vw, 4rem); }
}
@media (max-width: 359px) {
  .bottom-nav a { width: 54px; }
  .bottom-nav a span { font-size: 8.5px; }
  .gift-card { padding: 16px 16px 14px; }
}

/* Tablet */
@media (min-width: 640px) {
  .masonry { columns: 3; column-gap: 16px; }
  .masonry__item { margin-bottom: 16px; }
  .co-invite__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  .event-intro__times { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 620px; }
  .time-chip { flex-direction: column; align-items: center; text-align: center; gap: 4px; }
}

@media (min-width: 820px) {
  .profiles__grid { grid-template-columns: 1fr auto 1fr; align-items: start; gap: 2rem; }
  .profiles__amp { align-self: center; font-size: 6rem; margin-top: -4rem; }
  .couple__layout { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); justify-items: stretch; }
  .couple__text { text-align: left; justify-self: start; }
  .events__grid {
    max-width: 1080px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas: "c1 m1" "c2 m2";
    align-items: stretch;
    gap: 1.8rem;
  }
  #pemberkatan { grid-area: c1; }
  #peta-pemberkatan { grid-area: m1; }
  #resepsi { grid-area: c2; }
  #peta-resepsi { grid-area: m2; }
  .event-card, .map-card { height: 100%; }
  .map-card { display: flex; flex-direction: column; }
  .map-frame { flex: 1; aspect-ratio: auto; min-height: 260px; }
}

/* Desktop / laptop landscape: sampul & hero bergaya editorial terbelah */
@media (min-width: 900px) and (min-aspect-ratio: 1/1) {
  .cover__media, .hero__media { right: auto; width: 50%; }
  .hero__media { left: auto; right: 0; }
  .cover__tint {
    background: linear-gradient(90deg, rgba(44, 4, 13, .05) 60%, rgba(44, 4, 13, .55) 100%),
                linear-gradient(180deg, rgba(44, 4, 13, .25), transparent 30%, transparent 70%, rgba(44, 4, 13, .45));
  }
  .hero__tint {
    background: linear-gradient(270deg, rgba(44, 4, 13, .05) 60%, rgba(44, 4, 13, .55) 100%),
                linear-gradient(180deg, rgba(44, 4, 13, .2), transparent 30%, transparent 70%, rgba(44, 4, 13, .45));
  }
  .cover__panel, .hero__panel {
    margin-left: 50%;
    justify-content: center;
    background:
      radial-gradient(90% 70% at 50% 20%, rgba(140, 29, 51, .55), transparent 70%),
      radial-gradient(70% 50% at 50% 100%, rgba(212, 169, 71, .16), transparent 70%),
      linear-gradient(180deg, #4a0a18, #2c040d);
  }
  .hero__panel { margin-left: 0; margin-right: 50%; padding-bottom: 120px; }
  /* Countdown: foto kiri (utuh, wajah terlihat) larut ke maroon, judul & timer di kanan */
  .countdown { flex-direction: row; align-items: stretch; min-height: 88svh; padding: 0; }
  .countdown .bg-media {
    width: 50%;
    height: auto;
    -webkit-mask-image: linear-gradient(90deg, #000 78%, transparent);
    mask-image: linear-gradient(90deg, #000 78%, transparent);
  }
  .countdown__inner {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0;
    padding-block: var(--section-y);
  }
  .cover__content { flex: 0 1 auto; justify-content: center; }
  .cover__eyebrow { margin-bottom: 0; }
  .cover__names { margin-top: 1.4rem; font-size: clamp(3.4rem, 5.4vw, 5.2rem); }
  .hero__names { font-size: clamp(3.6rem, 5.8vw, 5.6rem); }
  .scroll-cue { left: 25%; }
}

@media (min-width: 1100px) {
  .masonry { columns: 4; }
  .masonry__item--feature { column-span: all; }
}