/* =========================================================
   HALAMAN PPDB LENGKAP (pages/ppdb.html)
   Memakai .page-hero, .profil-section, dan .profil-heading dari profil.css
   ========================================================= */
.pp-chips { display: flex; flex-wrap: wrap; gap: 0.625rem; margin-top: 1.5rem; }
.pp-chip { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; background: rgb(255 255 255 / 0.12); border: 1px solid rgb(255 255 255 / 0.3); border-radius: var(--radius-full); color: var(--white); font-size: 0.875rem; font-weight: 700; }
.pp-chip i { color: var(--gold-300); }

.pp-notice { padding-block: 1rem; background: #fef3c7; border-bottom: 1px solid var(--gold-300); color: #78350f; }
.pp-notice .container { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; align-items: center; justify-content: space-between; }
.pp-notice p { font-weight: 600; line-height: 1.5; }
.pp-notice a { color: #78350f; font-weight: 800; text-decoration: underline; }

/* ---- jadwal ---- */
.pp-waves { display: grid; gap: 1rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .pp-waves { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; } }
.pp-wave { padding: 1.5rem; background: var(--white); border: 1px solid var(--slate-200); border-left: 6px solid var(--gold-500); border-radius: var(--radius-2xl); box-shadow: var(--shadow-sm); }
.pp-wave__head { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; justify-content: space-between; margin-bottom: 0.625rem; }
.pp-wave__title { color: var(--emerald-1000); font-size: 1.25rem; font-weight: 800; }
.pp-wave__date { color: var(--slate-700); font-size: 1.0625rem; line-height: 1.6; font-weight: 600; }
.pp-wave__date i { margin-right: 0.5rem; color: var(--emerald-700); }
.pp-badge { padding: 0.25rem 0.75rem; border-radius: var(--radius-full); font-size: 0.75rem; font-weight: 800; }
.pp-badge--open   { background: var(--emerald-100); color: var(--emerald-800); }
.pp-badge--soon   { background: var(--gold-100); color: #92400e; }
.pp-badge--closed { background: var(--slate-200); color: var(--slate-700); }

.pp-cta { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.75rem; }
.pp-cta .btn--ghost { color: var(--emerald-800); border-color: var(--emerald-700); background: transparent; box-shadow: none; }

/* ---- syarat & biaya ---- */
.pp-two { display: grid; gap: 1.25rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .pp-two { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 1.5rem; } }
.pp-card { padding: 1.5rem; background: var(--white); border: 1px solid var(--slate-200); border-radius: var(--radius-2xl); box-shadow: var(--shadow-sm); }
.pp-card__title { margin-bottom: 1rem; color: var(--emerald-1000); font-size: 1.125rem; font-weight: 800; }
.pp-check { display: grid; gap: 0.75rem; }
.pp-check li { display: flex; gap: 0.75rem; align-items: flex-start; color: var(--slate-700); line-height: 1.6; }
.pp-check i { flex: none; margin-top: 0.25rem; color: var(--emerald-700); }
.pp-fee { margin-top: 0.25rem; color: var(--emerald-700); font-size: 2rem; font-weight: 800; }
.pp-fee__label { color: var(--slate-600); font-size: 0.875rem; }
.pp-note { margin-top: 1rem; color: var(--slate-600); font-size: 0.875rem; line-height: 1.6; }

/* ---- alasan, ekstrakurikuler, fasilitas ---- */
.pp-why { display: grid; gap: 0.875rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .pp-why { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pp-why li { display: flex; gap: 0.875rem; align-items: flex-start; padding: 1rem 1.25rem; background: var(--white); border: 1px solid var(--slate-200); border-radius: var(--radius-xl); color: var(--slate-800); font-weight: 600; line-height: 1.55; }
.pp-why i { flex: none; margin-top: 0.2rem; color: var(--gold-600); }

.pp-ekskul__group + .pp-ekskul__group { margin-top: 1.5rem; }
.pp-ekskul__label { margin-bottom: 0.75rem; color: var(--slate-600); font-size: 0.8125rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.pp-tags { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.pp-tags li { padding: 0.5rem 1rem; background: var(--white); border: 1px solid var(--emerald-200); border-radius: var(--radius-full); color: var(--emerald-800); font-weight: 700; font-size: 0.9375rem; }
.pp-tags--must li { background: var(--gold-100); border-color: var(--gold-300); color: #92400e; }

.pp-facilities { display: grid; gap: 0.75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 768px) { .pp-facilities { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; } }
.pp-facilities li { display: flex; flex-direction: column; align-items: center; gap: 0.625rem; padding: 1.25rem 0.75rem; text-align: center; background: var(--white); border: 1px solid var(--slate-200); border-radius: var(--radius-xl); color: var(--slate-800); font-weight: 700; font-size: 0.9375rem; }
.pp-facilities i { display: grid; place-items: center; width: 3rem; height: 3rem; background: var(--emerald-50); color: var(--emerald-700); border-radius: var(--radius-xl); font-size: 1.25rem; }

/* ---- prestasi ---- */
.pp-awards { display: grid; gap: 0.75rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .pp-awards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pp-awards li { display: flex; gap: 0.875rem; align-items: flex-start; padding: 1rem 1.25rem; background: var(--white); border: 1px solid var(--slate-200); border-radius: var(--radius-xl); line-height: 1.5; }
.pp-awards i { flex: none; margin-top: 0.15rem; color: var(--gold-600); }
.pp-awards strong { display: block; color: var(--emerald-1000); }
.pp-awards span { color: var(--slate-600); font-size: 0.875rem; }

/* ---- kontak ---- */
.pp-contacts { display: grid; gap: 1rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .pp-contacts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pp-contact { display: flex; flex-wrap: wrap; gap: 0.75rem 1rem; align-items: center; justify-content: space-between; padding: 1.25rem 1.5rem; background: var(--white); border: 1px solid var(--slate-200); border-radius: var(--radius-xl); }
.pp-contact__name { color: var(--emerald-1000); font-weight: 800; }
.pp-contact__num { color: var(--slate-600); font-size: 0.9375rem; }
.pp-address { margin-top: 1.25rem; display: flex; gap: 0.875rem; align-items: flex-start; padding: 1.25rem 1.5rem; background: var(--emerald-50); border-radius: var(--radius-xl); color: var(--slate-800); line-height: 1.6; }
.pp-address i { margin-top: 0.25rem; color: var(--emerald-700); }
.pp-address a { color: var(--emerald-800); font-weight: 700; text-decoration: underline; }

/* ---- FAQ ---- */
.pp-faq { display: grid; gap: 0.75rem; }
.pp-faq details { background: var(--white); border: 1px solid var(--slate-200); border-radius: var(--radius-xl); }
.pp-faq summary { padding: 1rem 1.25rem; color: var(--emerald-1000); font-weight: 800; cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
.pp-faq summary::-webkit-details-marker { display: none; }
.pp-faq summary::after { content: "+"; color: var(--emerald-700); font-size: 1.25rem; line-height: 1; }
.pp-faq details[open] summary::after { content: "\2212"; }
.pp-faq summary:focus-visible { outline: 3px solid var(--gold-500); outline-offset: 2px; border-radius: var(--radius-xl); }
.pp-faq p { padding: 0 1.25rem 1.25rem; color: var(--slate-700); line-height: 1.7; }

.pp-source { margin-top: 2rem; color: var(--slate-500); font-size: 0.8125rem; line-height: 1.6; }
.pp-source a { color: var(--emerald-700); text-decoration: underline; }