/**
 * ============================================================
 * CONFIG.CSS — Konfigurasi Tampilan Undangan Digital
 * ============================================================
 *
 * Ubah nilai di file ini untuk mengubah warna, font, dan ukuran.
 * File ini harus DIMUAT SEBELUM styles.css agar overrides生效.
 *
 * CARA PAKAI:
 *   1. Buka file ini dengan text editor
 *   2. Edit nilai sesuai kebutuhan
 *   3. Simpan file
 *   4. Buka index.html di browser
 */

:root {

  /* ============================================================
     WARNA UTAMA
     Ganti warna-warna ini untuk mengubah tema keseluruhan undangan
     ============================================================ */

  /* Warna utama */
  --olive-green:       #7c8864;   /* merah tua utama */
  --olive-dark:   #4d5b22;   /* merah tua gelap */
  --olive-light:  #788826;  /* merah tua terang */

  /* Warna aksen */
  --gold:            #C9A227;   /* gold / emas */
  --gold-light:      #E8C547;   /* gold terang */
  --gold-dark:       #A07D1C;   /* gold gelap */

  /* Warna teks */
  --text-primary:    #2C2C2C;   /* teks utama */
  --text-secondary:  #666666;  /* teks sekunder */
  --text-muted:     #999999;   /* teks muted */
  --text-light:      #FFFFFF;  /* teks di atas background gelap */
  --text-gold:       #C9A227;  /* teks berwarna gold */

  /* Warna background */
  --bg-white:       #FFFFFF;   /* putih */
  --bg-cream:       #FFF8F0;  /* cream / off-white */
  --bg-light:        #F5F0EB; /* abu-abu sangat terang */
  --bg-overlay:      rgba(255, 255, 255, 0.88); /* overlay putih transparan */

  /* ============================================================
     FONT / TIPOGRAFI
     ============================================================ */

  /* Font utama untuk body text */
  --font-body: 'Cormorant Garamond', serif;

  /* Font untuk heading / nama pengantin */
  --font-heading: 'Great Vibes', cursive;

  /* Font untuk tanggal dan angka */
  --font-date: 'Cormorant Garamond', serif;

  /* Ukuran font dasar */
  --font-size-base:  16px;
  --font-size-small: 14px;
  --font-size-large: 18px;

  /* ============================================================
     UKURAN MAKSIMAL (MAX WIDTH)
     ============================================================ */

  /* Lebar maksimal container utama */
  --max-width-container: 480px;

  /* Lebar maksimal kartu Love Story */
  --max-width-love-story: 380px;

  /* ============================================================
     UKURAN FOTO
     ============================================================ */

  /* Maksimum tinggi foto orang */
  --max-height-person-photo: 260px;

  /* Maksimum lebar foto orang (arch) */
  --max-width-person-photo: 220px;

  /* Maksimum tinggi foto story */
  --max-height-story-img: 200px;

  /* Maksimum lebar foto gallery */
  --max-width-gallery-img: 400px;

  /* ============================================================
     UKURAN LOGO
     ============================================================ */

  /* Lebar maksimal logo footer */
  --max-width-footer-logo: 180px;

  /* ============================================================
     SPACING / JARAK
     ============================================================ */

  /* Padding section default */
  --section-padding: 3rem 1.5rem;

  /* Padding Love Story container */
  --love-story-padding: 2rem 1.5rem;

  /* ============================================================
     ANIMASI SCROLL REVEAL
     ============================================================ */

  /* Durasi animasi fade-up (detik) */
  --reveal-duration: 0.8s;

  /* Durasi animasi scale (detik) */
  --reveal-scale-duration: 1s;

  /* ============================================================
     UKURAN TOMBOL
     ============================================================ */

  /* Border radius tombol */
  --btn-radius: 30px;

  /* Border radius kartu */
  --card-radius: 16px;

  /* ============================================================
     WARNA OVERLAY
     ============================================================ */

  /* Opacity overlay Love Story (0 = transparan, 1 = solid) */
  --love-story-overlay-opacity: 0.7;

}