/* ============================================================
   TEMA FESTIVAL AKSARA — merah + batik
   Palet: --t-bg:#FBEDE9  --t-ink:#2B1210  --t-red:#B3242C
          --t-red-deep:#7A1015  --t-gold:#C99A3E (aksen batik)
   Tipografi: Playfair Display (megah, kompetitif) + Work Sans
   Diterapkan pada wrapper <div class="theme-festival"> di dalam <main>,
   header & footer situs tetap memakai tema utama (emas-hitam-putih).
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,600;0,800;1,600&family=Work+Sans:wght@400;500;600&display=swap');

.theme-festival{
  --t-bg:#fbeee9; --t-ink:#2b1210; --t-red:#b3242c; --t-red-deep:#7a1015;
  --t-gold:#c99a3e; --t-gold-soft:#f1dfb2; --t-line:#e7c9be; --t-accent-soft:#f6ddd3;
  --t-display:'Playfair Display', Georgia, serif;
  display:block;
  background:
    radial-gradient(circle at 4px 4px, rgba(179,36,44,.06) 2px, transparent 2.6px) 0 0/22px 22px,
    var(--t-bg);
  color:var(--t-ink); font-family:'Work Sans', sans-serif;
}
.theme-festival h1, .theme-festival h2, .theme-festival h3{font-family:var(--t-display); color:var(--t-red-deep)}
.theme-festival a{color:var(--t-red-deep)}

.theme-festival .fa-hero{position:relative; padding:68px 0 50px; border-bottom:3px double var(--t-gold); overflow:hidden;
  background:linear-gradient(180deg, rgba(43,18,16,.88), rgba(122,16,21,.86) 55%, var(--t-bg) 100%), url('/assets/images/festival-aksara-hero.jpg') center 18%/cover no-repeat}
.theme-festival .fa-hero:before{content:""; position:absolute; inset:0; opacity:.35; pointer-events:none;
  background-image:
   repeating-linear-gradient(45deg, rgba(201,154,62,.14) 0 2px, transparent 2px 26px),
   repeating-linear-gradient(-45deg, rgba(0,0,0,.10) 0 2px, transparent 2px 26px);}
.theme-festival .fa-hero-wrap{position:relative; max-width:1180px; margin:0 auto; padding:0 24px; display:grid; grid-template-columns:1.2fr .8fr; gap:40px; align-items:center}
@media(max-width:880px){.theme-festival .fa-hero-wrap{grid-template-columns:1fr}}
.theme-festival .fa-kicker{font-family:var(--t-display); font-style:italic; color:var(--t-gold); display:block; margin-bottom:.3em}
.theme-festival .fa-hero h1{font-size:clamp(2.3rem,4.8vw,3.6rem); font-weight:800; color:#fff}
.theme-festival .fa-hero-wrap > div > p{color:#f6e2da; position:relative}
.theme-festival .fa-card{background:linear-gradient(160deg, rgba(122,16,21,.25), rgba(43,18,16,.82)), url('/assets/images/festival-aksara-hero.jpg') center 12%/cover no-repeat; border:2px solid var(--t-gold); border-radius:4px; padding:26px; position:relative; overflow:hidden; min-height:300px; display:flex; flex-direction:column; justify-content:flex-end; box-shadow:0 20px 50px rgba(20,5,5,.4)}
.theme-festival .fa-card:before{content:"";position:absolute; inset:0; background:linear-gradient(0deg, rgba(20,5,5,.88) 0%, rgba(20,5,5,.2) 55%, transparent 80%)}
.theme-festival .fa-card strong, .theme-festival .fa-card p{position:relative; z-index:1}
.theme-festival .fa-card strong{display:block; font-family:var(--t-display); font-size:1.1rem; margin-bottom:8px; color:#fff}
.theme-festival .fa-card p{color:#f6e2da}
.theme-festival .btn-festival{background:var(--t-red-deep); color:#fdf0e8; padding:.9em 1.7em; text-decoration:none; font-weight:600; border:1px solid var(--t-red-deep); display:inline-block; border-radius:4px}
.theme-festival .btn-festival:hover{background:var(--t-red)}
.theme-festival .btn-festival-outline{border:1px solid var(--t-red-deep); color:var(--t-red-deep); padding:.9em 1.7em; text-decoration:none; display:inline-block; border-radius:4px}

.theme-festival .fa-section{max-width:1180px; margin:0 auto; padding:56px 24px}
.theme-festival .fa-event-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:22px}
@media(max-width:900px){.theme-festival .fa-event-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.theme-festival .fa-event-grid{grid-template-columns:1fr}}
.theme-festival .fa-event{background:#fff; border:1px solid var(--t-line); border-radius:4px; overflow:hidden}
.theme-festival .fa-event-top{background:var(--t-red-deep); color:#fdf0e8; padding:14px 18px; font-family:var(--t-display); font-weight:700; display:flex; justify-content:space-between; align-items:center; gap:10px}
.theme-festival .fa-event-body{padding:18px}
.theme-festival .fa-event-body .muted{color:#7a5a52}
.theme-festival .fa-podium{display:flex; align-items:flex-end; gap:10px; justify-content:center; margin:18px 0}
.theme-festival .fa-podium span{width:56px; display:flex; align-items:center; justify-content:center; font-family:var(--t-display); font-weight:800; color:#fff; background:var(--t-gold); border-radius:4px 4px 0 0}
.theme-festival .fa-podium span:nth-child(1){height:60px; background:#c7c7c7}
.theme-festival .fa-podium span:nth-child(2){height:86px; background:var(--t-gold)}
.theme-festival .fa-podium span:nth-child(3){height:44px; background:#a8662f}

/* Tombol di atas latar merah hero: pakai emas dan krem agar terbaca */
.theme-festival .fa-hero .btn-festival{background:#f3d98a;border-color:#f3d98a;color:#4a0f14;font-weight:700}
.theme-festival .fa-hero .btn-festival:hover{background:#fff1c2}
.theme-festival .fa-hero .btn-festival-outline{border-color:#f3d98a;color:#fdf0e8}
.theme-festival .fa-hero .btn-festival-outline:hover{background:rgba(243,217,138,.14)}