/* ==========================================================================
   06 · Event (Akad & Party)
   Referensi: assets/image-reference/6.00 Event.png (frame 412 × 917)
   Urutan masuk: bunga mekar + muter (0ms) → geometri (400ms)
   → "AKAD &" naik per huruf (600ms) → "PARTY" membesar + gelap + shake (1200ms)
   → Tanggal / Waktu / Lokasi (1600 / 1700 / 1800ms) → tombol Maps (2100ms)
   ========================================================================== */

.event {
  --event-gutter: clamp(2.5rem, 14.56vw, 3.75rem); /* 60px di frame 412 */

  /* Tinggi pas satu layar; konten menempel ke bawah, jarak antar blok
     menyusut di layar pendek (pakai svh) supaya tetap muat. */
  height: var(--frame-h);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 0 var(--event-gutter) 2.5625rem;
}

/* Bunga matahari terpotong di pojok kanan atas */
.event__flower {
  position: absolute;
  top: -1.8125rem;
  right: -3.375rem;
  width: 12.25rem; /* 196px */
  aspect-ratio: 1;
}

.event__flower img {
  width: 100%;
  height: 100%;
}

.event__content {
  position: relative;
  z-index: 1;
}

/* --- Judul ---------------------------------------------------------------- */

.event__title {
  margin-top: clamp(1.5rem, 4.44svh, 2.55rem);
  font-size: clamp(3.5rem, 16.87vw, 4.34375rem); /* 69.5px di frame 412 */
  line-height: 1;
}

.event__title-light,
.event__title-bold {
  display: block;
}

.event__title-light {
  font-weight: 300;
}

.event__title-bold {
  /* Selebar teksnya saja, supaya animasi membesar berpusat di kata "PARTY" */
  width: fit-content;
  font-weight: 700;
  color: var(--color-accent);
  /* Saat membesar: oranye sedikit lebih gelap, jauh lebih besar (heboh),
     membesar dari tepi kiri supaya tidak keluar layar */
  --pop-color: var(--amber-600);
  --pop-scale: 1.5; /* maks. ±1,6 sebelum menyentuh tepi kanan frame */
  --pop-dur: 1600ms;
  transform-origin: 0% 60%;
}

/* --- Detail --------------------------------------------------------------- */

.event__details {
  margin-top: clamp(1.25rem, 4.38svh, 2.5rem);
}

.event__detail + .event__detail {
  margin-top: clamp(0.875rem, 2.16svh, 1.25rem);
}

.event__detail dt {
  font-size: 0.75rem; /* 12px */
  font-weight: 700;
  line-height: 1.2;
  text-transform: uppercase;
}

.event__detail dd {
  margin-top: 0.5rem;
}

.event__detail .event__value {
  margin-top: 0.61rem;
}

.event__value {
  font-size: clamp(2rem, 9.89vw, 2.546875rem); /* 40.75px di frame 412 */
  line-height: 1.1;
}

.event__address {
  font-size: 1rem;
  font-style: normal;
  line-height: 1.375; /* 22px */
}

.event__action {
  margin-top: clamp(1.25rem, 4.39svh, 2.5rem);
}