/* ============================================================
   SELARAS TIER SYSTEM v2.0 — Bahasa visual per tier
   [data-tier="basic"]   = Essential: bersih, cepat, tanpa ornamen
   [data-tier="premium"] = Signature: kaya, berlapis (baseline)
   [data-tier="elegant"] = Royale: sinematik, emas, GIF mewah
   ============================================================ */

/* ============ BASIC: Essential ============ */
/* Ornamen: matikan semua */
#app .atlas[data-tier="basic"] .atlas-petals,
#app .atlas[data-tier="basic"] .atlas-motion,
#app .atlas[data-tier="basic"] .atlas-motifs,
#app .atlas[data-tier="basic"] .atlas-botanical,
#app .atlas[data-tier="basic"] .botanical { display:none !important; }

/* Cover basic: polos, tengah, garis tipis */
#app .atlas[data-tier="basic"] #cover { background:var(--atlas-paper); }
#app .atlas[data-tier="basic"] .atlas-seal {
  width:64px; height:64px; font-size:.72rem; letter-spacing:.14em;
  border:1px solid var(--atlas-ink); color:var(--atlas-ink); background:transparent;
}
#app .atlas[data-tier="basic"] .atlas-stamp { opacity:.45; letter-spacing:.22em; }

/* Tipografi basic: ringkas, tidak megah */
#app .atlas[data-tier="basic"] .atlas-names { font-size:clamp(1.7rem,7.5vw,2.4rem); letter-spacing:.01em; }
#app .atlas[data-tier="basic"] .eyebrow { letter-spacing:.3em; font-size:.62rem; opacity:.65; }
#app .atlas[data-tier="basic"] .atlas-date { font-size:.85rem; opacity:.75; }

/* Section basic: pemisah hairline, kartu flat */
#app .atlas[data-tier="basic"] .invite-section { padding:2.6rem 1.25rem; }
#app .atlas[data-tier="basic"] .invite-section + .invite-section { border-top:1px solid color-mix(in srgb, var(--atlas-ink) 14%, transparent); }
#app .atlas[data-tier="basic"] .atlas-frame,
#app .atlas[data-tier="basic"] .atlas-story-photo,
#app .atlas[data-tier="basic"] .gallery-button img {
  border-radius:6px !important; border:1px solid color-mix(in srgb, var(--atlas-ink) 18%, transparent) !important;
  box-shadow:none !important;
}
/* Galeri basic: grid 2 kolom polos, tanpa label */
#app .atlas[data-tier="basic"] .atlas-photo-label { display:none; }
/* Nomor chapter: kecil & redup */
#app .atlas[data-tier="basic"] .atlas-event-number,
#app .atlas[data-tier="basic"] .atlas-index { opacity:.4; font-size:.7rem; }
/* Animasi basic: cepat & sederhana */
#app .atlas[data-tier="basic"] .reveal { transition-duration:.7s; }

/* ============ PREMIUM: Signature (baseline, sedikit dipoles) ============ */
#app .atlas[data-tier="premium"] .atlas-names { font-size:clamp(2.1rem,9vw,3.1rem); }
#app .atlas[data-tier="premium"] .invite-section { padding:3.4rem 1.5rem; }

/* ============ ELEGANT: Royale ============ */
#app .atlas[data-tier="elegant"] { --atlas-gold:#c9a24b; --atlas-gold-deep:#9a7a2e; }

/* Segel monogram elegant: besar, emas */
#app .atlas[data-tier="elegant"] .atlas-seal {
  width:104px; height:104px; font-size:1rem; letter-spacing:.18em;
  border:2px solid var(--atlas-gold); color:var(--atlas-gold);
  box-shadow:0 0 0 6px color-mix(in srgb, var(--atlas-gold) 18%, transparent), 0 8px 30px rgba(0,0,0,.25);
  background:radial-gradient(circle, color-mix(in srgb, var(--atlas-gold) 14%, transparent), transparent 70%);
}
/* Tipografi elegant: megah */
#app .atlas[data-tier="elegant"] .atlas-names {
  font-size:clamp(2.6rem,11vw,4rem); letter-spacing:.02em; line-height:1.08;
  text-shadow:0 2px 24px rgba(0,0,0,.18);
}
#app .atlas[data-tier="elegant"] .eyebrow { letter-spacing:.42em; font-size:.68rem; color:var(--atlas-gold); }
#app .atlas[data-tier="elegant"] .atlas-date { letter-spacing:.24em; font-size:.92rem; }
/* Chapter number elegant: emas */
#app .atlas[data-tier="elegant"] .atlas-event-number,
#app .atlas[data-tier="elegant"] .atlas-index { color:var(--atlas-gold); font-size:.8rem; letter-spacing:.3em; }
/* Bingkai foto elegant: emas ganda */
#app .atlas[data-tier="elegant"] .atlas-frame {
  border:1px solid var(--atlas-gold) !important;
  box-shadow:0 0 0 5px var(--atlas-paper), 0 0 0 6px var(--atlas-gold), 0 18px 50px rgba(0,0,0,.28) !important;
}
/* Section elegant: lebih lega & dramatis */
#app .atlas[data-tier="elegant"] .invite-section { padding:4.2rem 1.5rem; }
#app .atlas[data-tier="elegant"] .atlas-finale-mark { color:var(--atlas-gold); font-size:1.6rem; }
/* Tombol elegant: aksen emas */
#app .atlas[data-tier="elegant"] .btn-primary, #app .atlas[data-tier="elegant"] .rsvp-submit {
  background:linear-gradient(135deg, var(--atlas-gold-deep), var(--atlas-gold));
  border-color:var(--atlas-gold-deep);
}
/* Motion GIF elegant: sedikit lebih terlihat */
#app .atlas[data-tier="elegant"] .atlas-motion { opacity:.32; }
