{"id":2277,"date":"2026-09-01T07:21:07","date_gmt":"2026-09-01T00:21:07","guid":{"rendered":"https:\/\/lpb.unindra.ac.id\/?page_id=2277"},"modified":"2026-10-01T15:31:15","modified_gmt":"2026-10-01T08:31:15","slug":"musikalisasi-puisi-2026","status":"publish","type":"page","link":"https:\/\/lpb.unindra.ac.id\/index.php\/musikalisasi-puisi-2026\/","title":{"rendered":"Musikalisasi Puisi 2026"},"content":{"rendered":"\n<div id=\"mp-landing\">\n\n  <style>\n  \n  \/* =========================================================\n     LANDING PAGE MUSIKALISASI PUISI 2026\n     WORDPRESS COMPATIBLE - FINAL REVISION\n  ========================================================= *\/\n  \n  #mp-landing {\n    --mp-ink: #17151f;\n    --mp-ink-2: #211d2a;\n    --mp-gold: #d5a84a;\n    --mp-gold-light: #f0d99a;\n    --mp-burgundy: #6e2638;\n    --mp-paper: #f7f3ea;\n    --mp-paper-2: #eee7da;\n    --mp-white: #ffffff;\n    --mp-text: #292733;\n    --mp-muted: #77727d;\n    --mp-border: rgba(23,21,31,.12);\n    --mp-shadow: 0 20px 60px rgba(23,21,31,.12);\n  \n    position: relative;\n    width: 100%;\n    max-width: 100% !important;\n    margin: 0 auto;\n    padding: 0;\n    font-family: Inter, Arial, Helvetica, sans-serif;\n    color: var(--mp-text);\n    background: var(--mp-paper);\n    line-height: 1.7;\n    overflow-x: hidden;\n    -webkit-font-smoothing: antialiased;\n  }\n  \n  \/* RESET EKSPLISIT UNTUK TEMPLATE WORDPRESS *\/\n  #mp-landing *,\n  #mp-landing *::before,\n  #mp-landing *::after {\n    box-sizing: border-box !important;\n  }\n  \n  #mp-landing a {\n    color: inherit;\n    text-decoration: none !important;\n    box-shadow: none !important;\n  }\n  \n  #mp-landing img {\n    max-width: 100% !important;\n    height: auto !important;\n    display: block;\n    margin: 0;\n    padding: 0;\n    border: none;\n    box-shadow: none;\n  }\n  \n  #mp-landing button {\n    font-family: inherit;\n  }\n  \n  #mp-landing h1, #mp-landing h2, #mp-landing h3, #mp-landing h4, #mp-landing p, #mp-landing ul, #mp-landing blockquote {\n    margin: 0;\n    padding: 0;\n  }\n  \n  .mp-container {\n    width: min(1180px, calc(100% - 40px));\n    margin: 0 auto;\n  }\n  \n  .mp-serif {\n    font-family: Georgia, \"Times New Roman\", serif;\n  }\n  \n  .mp-section {\n    padding: 110px 0;\n  }\n  \n  .mp-section-title {\n    max-width: 760px;\n    margin-bottom: 55px;\n  }\n  \n  .mp-section-title h2 {\n    margin: 12px 0 18px !important;\n    font-family: Georgia, \"Times New Roman\", serif !important;\n    font-size: clamp(38px, 5vw, 68px) !important;\n    line-height: 1.02 !important;\n    letter-spacing: -.035em !important;\n  }\n  \n  .mp-section-title p {\n    max-width: 680px;\n    margin: 0;\n    font-size: 17px;\n    color: var(--mp-muted);\n  }\n  \n  .mp-eyebrow {\n    display: inline-flex;\n    align-items: center;\n    gap: 10px;\n    font-size: 12px;\n    font-weight: 800;\n    letter-spacing: .18em;\n    text-transform: uppercase;\n  }\n  \n  .mp-eyebrow::before {\n    content: \"\";\n    width: 30px;\n    height: 1px;\n    background: currentColor;\n  }\n  \n  .mp-reveal {\n    opacity: 0;\n    transform: translateY(30px);\n    transition: opacity .8s ease, transform .8s ease;\n  }\n  \n  .mp-reveal.mp-visible {\n    opacity: 1;\n    transform: translateY(0);\n  }\n  \n  \n  \/* =========================================================\n     03. NAVIGATION (STICKY\/FIXED FIX)\n  ========================================================= *\/\n  \n  #mp-nav {\n    position: fixed;\n    z-index: 99999;\n    top: 0;\n    left: 0;\n    right: 0;\n    padding: 14px 0;\n    color: white;\n    transition: background .3s ease, padding .3s ease, box-shadow .3s ease;\n  }\n  \n  #mp-nav.mp-scrolled {\n    padding: 8px 0;\n    background: rgba(23,21,31,.96);\n    backdrop-filter: blur(15px);\n    box-shadow: 0 8px 30px rgba(0,0,0,.18);\n  }\n  \n  .mp-nav-inner {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 20px;\n  }\n  \n  .mp-brand {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    flex-shrink: 0;\n  }\n  \n  .mp-brand-logo {\n    width: 120px;\n    height: 42px;\n    padding: 4px 8px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background: #ffffff;\n    border-radius: 5px;\n    overflow: hidden;\n    flex-shrink: 0;\n  }\n  \n  .mp-brand-logo img {\n    max-width: 100% !important;\n    max-height: 100% !important;\n    width: auto !important;\n    height: auto !important;\n    object-fit: contain !important;\n  }\n  \n  .mp-brand-text {\n    font-size: 10px;\n    font-weight: 800;\n    line-height: 1.25;\n    letter-spacing: .08em;\n    text-transform: uppercase;\n    color: rgba(255,255,255,.85);\n  }\n  \n  .mp-brand-text span {\n    display: block;\n    margin-top: 2px;\n    color: rgba(255,255,255,.45);\n    font-weight: 400;\n    letter-spacing: .03em;\n    text-transform: none;\n  }\n  \n  .mp-nav-links {\n    display: flex;\n    align-items: center;\n    gap: 23px;\n    font-size: 11px;\n    font-weight: 800;\n    text-transform: uppercase;\n    letter-spacing: .07em;\n  }\n  \n  .mp-nav-links a {\n    opacity: .8;\n    transition: .2s ease;\n  }\n  \n  .mp-nav-links a:hover {\n    color: var(--mp-gold-light);\n    opacity: 1;\n  }\n  \n  .mp-nav-cta {\n    padding: 10px 18px;\n    border-radius: 999px;\n    background: var(--mp-gold);\n    color: var(--mp-ink) !important;\n    opacity: 1 !important;\n  }\n  \n  .mp-mobile-toggle {\n    display: none;\n    border: 0;\n    background: transparent;\n    color: white;\n    font-size: 25px;\n    cursor: pointer;\n  }\n  \n  \n  \/* =========================================================\n     04. HERO SECTION\n  ========================================================= *\/\n  \n  .mp-hero {\n    position: relative;\n    isolation: isolate;\n    min-height: 820px;\n    display: flex;\n    align-items: center;\n    color: white;\n    background: \n      radial-gradient(circle at 82% 20%, rgba(213,168,74,.16), transparent 30%),\n      radial-gradient(circle at 10% 85%, rgba(110,38,56,.35), transparent 35%),\n      var(--mp-ink);\n    overflow: hidden;\n  }\n  \n  .mp-hero::before {\n    content: \"\";\n    position: absolute;\n    inset: 0;\n    z-index: -3;\n    opacity: .12;\n    background-image: \n      linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px),\n      linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);\n    background-size: 55px 55px;\n    pointer-events: none;\n  }\n  \n  .mp-hero::after {\n    content: \"\";\n    position: absolute;\n    z-index: -2;\n    width: 620px;\n    height: 620px;\n    right: -250px;\n    top: -170px;\n    border: 1px solid rgba(213,168,74,.18);\n    border-radius: 50%;\n    box-shadow: \n      0 0 0 70px rgba(213,168,74,.025),\n      0 0 0 140px rgba(213,168,74,.02),\n      0 0 0 210px rgba(213,168,74,.015);\n    pointer-events: none;\n  }\n  \n  .mp-hero-inner {\n    position: relative;\n    z-index: 5;\n    display: grid;\n    grid-template-columns: minmax(0, 1fr) minmax(390px, .78fr);\n    align-items: center;\n    gap: 55px;\n    width: 100%;\n    padding-top: 90px;\n    padding-bottom: 50px;\n  }\n  \n  .mp-hero-content {\n    position: relative;\n    z-index: 20;\n    min-width: 0;\n  }\n  \n  .mp-hero-kicker {\n    margin-bottom: 20px;\n    color: var(--mp-gold-light);\n  }\n  \n  .mp-hero h1 {\n    margin: 0;\n    font-family: Georgia, \"Times New Roman\", serif !important;\n    font-size: clamp(52px, 7vw, 100px) !important;\n    line-height: .9 !important;\n    letter-spacing: -.055em !important;\n    color: var(--mp-gold-light) !important;\n  }\n  \n  .mp-hero h1 span {\n    display: block;\n    color: var(--mp-gold) !important;\n  }\n  \n  .mp-hero-theme {\n    max-width: 650px;\n    margin: 28px 0 22px;\n    font-family: Georgia, \"Times New Roman\", serif;\n    font-size: clamp(22px, 3vw, 34px);\n    font-style: italic;\n    line-height: 1.22;\n    color: var(--mp-gold-light);\n  }\n  \n  .mp-hero-description {\n    max-width: 600px;\n    margin: 0;\n    color: rgba(255,255,255,.82);\n    font-size: 16px;\n  }\n  \n  .mp-hero-meta {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 8px;\n    margin: 25px 0 30px;\n  }\n  \n  .mp-pill {\n    padding: 7px 12px;\n    border: 1px solid rgba(213,168,74,.35);\n    border-radius: 999px;\n    color: var(--mp-gold-light);\n    background: rgba(213,168,74,.04);\n    font-size: 10px;\n    font-weight: 800;\n    letter-spacing: .06em;\n  }\n  \n  .mp-actions {\n    position: relative;\n    z-index: 50;\n    display: flex;\n    flex-wrap: wrap;\n    gap: 12px;\n  }\n  \n  .mp-btn {\n    position: relative;\n    z-index: 51;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    min-height: 52px;\n    padding: 0 25px;\n    border: 1px solid transparent;\n    border-radius: 999px;\n    font-size: 11px;\n    font-weight: 900;\n    letter-spacing: .08em;\n    text-transform: uppercase;\n    cursor: pointer;\n    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;\n  }\n  \n  .mp-btn:hover {\n    transform: translateY(-3px);\n  }\n  \n  .mp-btn-primary {\n    background: var(--mp-gold);\n    color: var(--mp-ink) !important;\n    box-shadow: 0 12px 35px rgba(213,168,74,.25);\n  }\n  \n  .mp-btn-secondary {\n    border-color: rgba(255,255,255,.28);\n    background: rgba(255,255,255,.04);\n    color: white !important;\n  }\n  \n  \n  \/* =========================================================\n     HERO POSTER (FIX TERPOTONG)\n  ========================================================= *\/\n  \n  .mp-hero-visual {\n    position: relative;\n    z-index: 10;\n    min-width: 0;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n  \n  .mp-poster-frame {\n    position: relative;\n    width: min(100%, 450px);\n    padding: 10px;\n    background: linear-gradient(145deg, rgba(213,168,74,.65), rgba(255,255,255,.08));\n    box-shadow: 0 35px 80px rgba(0,0,0,.42);\n    border-radius: 8px;\n    transform: rotate(1.5deg);\n    transition: transform .4s ease;\n  }\n  \n  .mp-poster-frame:hover {\n    transform: rotate(0deg) translateY(-5px);\n  }\n  \n  .mp-poster-frame img {\n    display: block !important;\n    width: 100% !important;\n    height: auto !important;\n    max-height: none !important;\n    object-fit: contain !important;\n    border-radius: 4px;\n    background: white;\n  }\n  \n  .mp-poster-caption {\n    position: absolute;\n    left: 18px;\n    bottom: 18px;\n    padding: 7px 11px;\n    background: rgba(23,21,31,.88);\n    border: 1px solid rgba(213,168,74,.35);\n    color: var(--mp-gold-light);\n    font-size: 9px;\n    font-weight: 800;\n    letter-spacing: .12em;\n    text-transform: uppercase;\n    border-radius: 4px;\n  }\n  \n  \n  \/* =========================================================\n     05. HOOK\n  ========================================================= *\/\n  \n  .mp-hook {\n    background: var(--mp-paper);\n    text-align: center;\n  }\n  \n  .mp-hook-inner {\n    max-width: 900px;\n    margin: auto;\n  }\n  \n  .mp-hook blockquote {\n    margin: 30px 0 !important;\n    font-family: Georgia, \"Times New Roman\", serif !important;\n    font-size: clamp(34px, 5.5vw, 70px) !important;\n    line-height: 1.05 !important;\n    letter-spacing: -.04em !important;\n    border: none !important;\n    background: none !important;\n    padding: 0 !important;\n  }\n  \n  .mp-hook blockquote em {\n    color: var(--mp-burgundy);\n    font-style: italic;\n  }\n  \n  .mp-hook-copy {\n    max-width: 680px;\n    margin: auto;\n    font-size: 18px;\n    color: var(--mp-muted);\n  }\n  \n  \n  \/* =========================================================\n     06. BENEFITS\n  ========================================================= *\/\n  \n  .mp-benefits {\n    background: var(--mp-ink);\n    color: white;\n  }\n  \n  .mp-benefit-grid {\n    display: grid;\n    grid-template-columns: repeat(4, 1fr);\n    gap: 1px;\n    background: rgba(255,255,255,.13);\n    border: 1px solid rgba(255,255,255,.13);\n  }\n  \n  .mp-benefit {\n    min-height: 300px;\n    padding: 35px;\n    background: var(--mp-ink);\n    transition: background .3s ease, transform .3s ease;\n  }\n  \n  .mp-benefit:hover {\n    background: var(--mp-ink-2);\n    transform: translateY(-5px);\n  }\n  \n  .mp-benefit-number {\n    color: var(--mp-gold);\n    font-size: 12px;\n    font-weight: 800;\n    letter-spacing: .15em;\n  }\n  \n  .mp-benefit-icon {\n    margin: 45px 0 25px;\n    font-size: 35px;\n    color: var(--mp-gold);\n  }\n  \n  .mp-benefit h3 {\n    margin: 0 0 10px;\n    font-family: Georgia, serif;\n    font-size: 27px;\n    color: white;\n  }\n  \n  .mp-benefit p {\n    margin: 0;\n    color: rgba(255,255,255,.58);\n    font-size: 14px;\n  }\n  \n  \n  \/* =========================================================\n     07. CATEGORY\n  ========================================================= *\/\n  \n  .mp-categories {\n    background: var(--mp-paper);\n  }\n  \n  .mp-category-grid {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 20px;\n  }\n  \n  .mp-category {\n    position: relative;\n    min-height: 330px;\n    padding: 45px;\n    overflow: hidden;\n    background: white;\n    border: 1px solid var(--mp-border);\n    box-shadow: var(--mp-shadow);\n  }\n  \n  .mp-category:nth-child(2) {\n    background: var(--mp-burgundy);\n    color: white;\n  }\n  \n  .mp-category::after {\n    content: \"\";\n    position: absolute;\n    right: -80px;\n    bottom: -100px;\n    width: 260px;\n    height: 260px;\n    border: 1px solid rgba(110,38,56,.12);\n    border-radius: 50%;\n  }\n  \n  .mp-category-label {\n    font-size: 11px;\n    font-weight: 800;\n    letter-spacing: .15em;\n    text-transform: uppercase;\n    opacity: .6;\n  }\n  \n  .mp-category h3 {\n    margin: 50px 0 12px;\n    font-family: Georgia, serif;\n    font-size: clamp(40px, 5vw, 64px);\n    line-height: .95;\n  }\n  \n  .mp-category p {\n    max-width: 330px;\n    opacity: .7;\n  }\n  \n  .mp-category-facts {\n    position: relative;\n    z-index: 2;\n    display: flex;\n    flex-wrap: wrap;\n    gap: 8px;\n    margin-top: 25px;\n  }\n  \n  .mp-category-facts span {\n    padding: 7px 11px;\n    border: 1px solid currentColor;\n    border-radius: 999px;\n    font-size: 10px;\n    font-weight: 700;\n  }\n  \n  .mp-region {\n    margin-top: 35px;\n    padding-top: 25px;\n    border-top: 1px solid var(--mp-border);\n    text-align: center;\n  }\n  \n  .mp-region strong {\n    font-family: Georgia, serif;\n    font-size: 23px;\n  }\n  \n  \n  \/* =========================================================\n     08. SUBTHEMES\n  ========================================================= *\/\n  \n  .mp-subthemes {\n    background: var(--mp-paper-2);\n  }\n  \n  .mp-subtheme-grid {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 12px;\n  }\n  \n  .mp-subtheme {\n    min-height: 180px;\n    padding: 25px;\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    background: var(--mp-paper);\n    border: 1px solid rgba(23,21,31,.1);\n    transition: transform .25s ease, background .25s ease;\n  }\n  \n  .mp-subtheme:hover {\n    transform: translateY(-6px);\n    background: white;\n  }\n  \n  .mp-subtheme-number {\n    color: var(--mp-burgundy);\n    font-family: Georgia, serif;\n    font-size: 30px;\n  }\n  \n  .mp-subtheme h3 {\n    margin: 20px 0 0;\n    font-size: 17px;\n    line-height: 1.35;\n  }\n  \n  \n  \/* =========================================================\n     09. TECHNICAL\n  ========================================================= *\/\n  \n  .mp-technical {\n    background: var(--mp-paper);\n  }\n  \n  .mp-tech-highlight {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 1px;\n    background: var(--mp-border);\n    border: 1px solid var(--mp-border);\n  }\n  \n  .mp-tech-item {\n    padding: 40px 30px;\n    background: white;\n    text-align: center;\n  }\n  \n  .mp-tech-big {\n    font-family: Georgia, serif;\n    font-size: clamp(48px, 6vw, 75px);\n    line-height: 1;\n    color: var(--mp-burgundy);\n  }\n  \n  .mp-tech-label {\n    margin-top: 12px;\n    font-size: 11px;\n    font-weight: 800;\n    letter-spacing: .12em;\n    text-transform: uppercase;\n  }\n  \n  .mp-rule-list {\n    margin-top: 35px;\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 12px;\n  }\n  \n  .mp-rule {\n    display: flex;\n    gap: 18px;\n    padding: 22px;\n    background: white;\n    border-left: 3px solid var(--mp-gold);\n  }\n  \n  .mp-rule-number {\n    font-family: Georgia, serif;\n    color: var(--mp-burgundy);\n    font-size: 25px;\n  }\n  \n  .mp-rule p {\n    margin: 0;\n    font-size: 14px;\n  }\n  \n  \n  \/* =========================================================\n     10. TIMELINE\n  ========================================================= *\/\n  \n  .mp-timeline-section {\n    background: var(--mp-ink);\n    color: white;\n  }\n  \n  .mp-timeline {\n    position: relative;\n    display: grid;\n    grid-template-columns: repeat(5, 1fr);\n    gap: 0;\n    margin-top: 60px;\n  }\n  \n  .mp-timeline::before {\n    content: \"\";\n    position: absolute;\n    top: 15px;\n    left: 5%;\n    right: 5%;\n    height: 1px;\n    background: rgba(255,255,255,.2);\n  }\n  \n  .mp-timeline-item {\n    position: relative;\n    padding: 0 15px;\n    text-align: center;\n  }\n  \n  .mp-timeline-dot {\n    position: relative;\n    z-index: 2;\n    width: 30px;\n    height: 30px;\n    margin: 0 auto 28px;\n    border: 7px solid var(--mp-ink);\n    border-radius: 50%;\n    background: var(--mp-gold);\n  }\n  \n  .mp-timeline-date {\n    color: var(--mp-gold-light);\n    font-size: 12px;\n    font-weight: 800;\n    letter-spacing: .08em;\n  }\n  \n  .mp-timeline-item h3 {\n    margin: 10px auto;\n    max-width: 180px;\n    font-family: Georgia, serif;\n    font-size: 20px;\n    line-height: 1.2;\n    color: white;\n  }\n  \n  .mp-timeline-item p {\n    max-width: 190px;\n    margin: auto;\n    color: rgba(255,255,255,.5);\n    font-size: 12px;\n  }\n  \n  .mp-timeline-final .mp-timeline-dot {\n    width: 40px;\n    height: 40px;\n    margin-top: -5px;\n    background: var(--mp-burgundy);\n    border-color: var(--mp-ink);\n    box-shadow: 0 0 0 1px var(--mp-gold);\n  }\n  \n  .mp-timeline-final h3 {\n    color: var(--mp-gold-light);\n  }\n  \n  \n  \/* =========================================================\n     11. JOURNEY\n  ========================================================= *\/\n  \n  .mp-journey {\n    background: var(--mp-paper);\n  }\n  \n  .mp-journey-flow {\n    display: grid;\n    grid-template-columns: repeat(5, 1fr);\n  }\n  \n  .mp-journey-step {\n    position: relative;\n    padding: 35px 25px;\n    background: white;\n    border: 1px solid var(--mp-border);\n  }\n  \n  .mp-journey-step:not(:last-child)::after {\n    content: \"\u2192\";\n    position: absolute;\n    z-index: 3;\n    right: -13px;\n    top: 50%;\n    width: 26px;\n    height: 26px;\n    display: grid;\n    place-items: center;\n    border-radius: 50%;\n    background: var(--mp-gold);\n    color: var(--mp-ink);\n    font-weight: 900;\n    transform: translateY(-50%);\n  }\n  \n  .mp-journey-number {\n    color: var(--mp-burgundy);\n    font-family: Georgia, serif;\n    font-size: 30px;\n  }\n  \n  .mp-journey-step h3 {\n    margin: 30px 0 8px;\n    font-family: Georgia, serif;\n    font-size: 22px;\n  }\n  \n  .mp-journey-step p {\n    margin: 0;\n    font-size: 13px;\n    color: var(--mp-muted);\n  }\n  \n  \n  \/* =========================================================\n     12. JUDGING\n  ========================================================= *\/\n  \n  .mp-judging {\n    background: var(--mp-paper-2);\n  }\n  \n  .mp-score-grid {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 15px;\n  }\n  \n  .mp-score-card {\n    background: var(--mp-paper);\n    border: 1px solid var(--mp-border);\n    overflow: hidden;\n  }\n  \n  .mp-score-head {\n    padding: 35px;\n    background: var(--mp-ink);\n    color: white;\n  }\n  \n  .mp-score-percent {\n    font-family: Georgia, serif;\n    font-size: 60px;\n    line-height: 1;\n    color: var(--mp-gold-light);\n  }\n  \n  .mp-score-head h3 {\n    margin: 10px 0 0;\n    font-family: Georgia, serif;\n    font-size: 25px;\n    color: white;\n  }\n  \n  .mp-score-body {\n    padding: 25px;\n  }\n  \n  .mp-score-row {\n    padding: 14px 0;\n    border-bottom: 1px solid var(--mp-border);\n  }\n  \n  .mp-score-row:last-child {\n    border-bottom: 0;\n  }\n  \n  .mp-score-row strong {\n    display: block;\n    font-size: 13px;\n  }\n  \n  .mp-score-row span {\n    color: var(--mp-burgundy);\n    font-size: 12px;\n    font-weight: 800;\n  }\n  \n  \n  \/* =========================================================\n     13. PRIZE\n  ========================================================= *\/\n  \n  .mp-prize {\n    position: relative;\n    background: \n      radial-gradient(circle at center, rgba(213,168,74,.12), transparent 40%),\n      var(--mp-ink);\n    color: white;\n    text-align: center;\n  }\n  \n  .mp-trophy {\n    margin-bottom: 15px;\n    font-size: 65px;\n    color: var(--mp-gold);\n  }\n  \n  .mp-prize h2 {\n    max-width: 800px;\n    margin: 0 auto 20px;\n    font-family: Georgia, serif;\n    font-size: clamp(48px, 7vw, 85px);\n    line-height: .95;\n    color: white;\n  }\n  \n  .mp-prize-intro {\n    max-width: 600px;\n    margin: 0 auto 50px;\n    color: rgba(255,255,255,.6);\n  }\n  \n  .mp-prize-grid {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 15px;\n    max-width: 850px;\n    margin: auto;\n  }\n  \n  .mp-prize-card {\n    padding: 35px;\n    border: 1px solid rgba(213,168,74,.3);\n    background: rgba(255,255,255,.035);\n  }\n  \n  .mp-prize-card .mp-small {\n    color: var(--mp-gold-light);\n    font-size: 10px;\n    font-weight: 800;\n    letter-spacing: .15em;\n    text-transform: uppercase;\n  }\n  \n  .mp-prize-card h3 {\n    margin: 12px 0;\n    font-family: Georgia, serif;\n    font-size: 26px;\n    color: white;\n  }\n  \n  .mp-prize-card p {\n    margin: 0;\n    color: rgba(255,255,255,.58);\n    font-size: 14px;\n  }\n  \n  \n  \/* =========================================================\n     14. REGISTRATION\n  ========================================================= *\/\n  \n  .mp-registration {\n    background: var(--mp-paper);\n  }\n  \n  .mp-registration-box {\n    display: grid;\n    grid-template-columns: .8fr 1.2fr;\n    gap: 60px;\n    align-items: center;\n  }\n  \n  .mp-fee-grid {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 12px;\n  }\n  \n  .mp-fee {\n    padding: 35px;\n    background: white;\n    border: 1px solid var(--mp-border);\n  }\n  \n  .mp-fee:nth-child(2) {\n    background: var(--mp-burgundy);\n    color: white;\n  }\n  \n  .mp-fee-label {\n    font-size: 10px;\n    font-weight: 800;\n    letter-spacing: .15em;\n    text-transform: uppercase;\n    opacity: .65;\n  }\n  \n  .mp-fee-price {\n    margin-top: 20px;\n    font-family: Georgia, serif;\n    font-size: clamp(32px, 4vw, 50px);\n    line-height: 1;\n  }\n  \n  .mp-registration-info {\n    padding: 50px;\n    background: var(--mp-ink);\n    color: white;\n  }\n  \n  .mp-registration-info h3 {\n    margin: 0 0 10px;\n    font-family: Georgia, serif;\n    font-size: 34px;\n    color: white;\n  }\n  \n  .mp-deadline {\n    margin: 25px 0;\n    padding: 20px;\n    border-left: 3px solid var(--mp-gold);\n    background: rgba(255,255,255,.04);\n  }\n  \n  .mp-deadline small {\n    display: block;\n    color: rgba(255,255,255,.5);\n    font-size: 10px;\n    letter-spacing: .12em;\n    text-transform: uppercase;\n  }\n  \n  .mp-deadline strong {\n    display: block;\n    margin-top: 5px;\n    color: var(--mp-gold-light);\n    font-family: Georgia, serif;\n    font-size: 28px;\n  }\n  \n  .mp-countdown {\n    display: grid;\n    grid-template-columns: repeat(4, 1fr);\n    gap: 7px;\n    margin: 25px 0;\n  }\n  \n  .mp-count-box {\n    padding: 14px 5px;\n    background: rgba(255,255,255,.06);\n    text-align: center;\n  }\n  \n  .mp-count-number {\n    font-family: Georgia, serif;\n    font-size: 27px;\n    line-height: 1;\n    color: var(--mp-gold-light);\n  }\n  \n  .mp-count-label {\n    margin-top: 5px;\n    color: rgba(255,255,255,.45);\n    font-size: 8px;\n    text-transform: uppercase;\n    letter-spacing: .08em;\n  }\n  \n  \n  \/* =========================================================\n     15. FAQ\n  ========================================================= *\/\n  \n  .mp-faq {\n    background: white;\n  }\n  \n  .mp-faq-list {\n    max-width: 850px;\n    margin: auto;\n    border-top: 1px solid var(--mp-border);\n  }\n  \n  .mp-faq-item {\n    border-bottom: 1px solid var(--mp-border);\n  }\n  \n  .mp-faq-question {\n    width: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 20px;\n    padding: 23px 0;\n    border: 0;\n    background: transparent;\n    color: var(--mp-text);\n    text-align: left;\n    font-size: 15px;\n    font-weight: 750;\n    cursor: pointer;\n  }\n  \n  .mp-faq-plus {\n    flex: 0 0 auto;\n    font-family: Georgia, serif;\n    font-size: 25px;\n    transition: transform .3s ease;\n  }\n  \n  .mp-faq-answer {\n    display: grid;\n    grid-template-rows: 0fr;\n    transition: grid-template-rows .35s ease;\n  }\n  \n  .mp-faq-answer-inner {\n    overflow: hidden;\n  }\n  \n  .mp-faq-answer p {\n    margin: 0;\n    padding: 0 40px 25px 0;\n    color: var(--mp-muted);\n    font-size: 14px;\n  }\n  \n  .mp-faq-item.mp-open .mp-faq-answer {\n    grid-template-rows: 1fr;\n  }\n  \n  .mp-faq-item.mp-open .mp-faq-plus {\n    transform: rotate(45deg);\n  }\n  \n  \n  \/* =========================================================\n     16. FINAL CTA\n  ========================================================= *\/\n  \n  .mp-final {\n    position: relative;\n    background: linear-gradient(135deg, rgba(110,38,56,.97), rgba(23,21,31,.99));\n    color: white;\n    text-align: center;\n    overflow: hidden;\n  }\n  \n  .mp-final::before {\n    content: \"PUISI \u2022 NADA \u2022 EKSPRESI\";\n    position: absolute;\n    left: 50%;\n    top: 50%;\n    white-space: nowrap;\n    font-family: Georgia, serif;\n    font-size: 13vw;\n    color: rgba(255,255,255,.025);\n    transform: translate(-50%,-50%) rotate(-8deg);\n  }\n  \n  .mp-final-inner {\n    position: relative;\n    z-index: 2;\n  }\n  \n  .mp-final h2 {\n    max-width: 850px;\n    margin: 15px auto;\n    font-family: Georgia, serif;\n    font-size: clamp(55px, 8vw, 105px);\n    line-height: .9;\n    letter-spacing: -.05em;\n    color: var(--mp-gold-light);\n  }\n  \n  .mp-final p {\n    margin: 25px auto 35px;\n    color: rgba(255,255,255,.7);\n    font-family: Georgia, serif;\n    font-size: 22px;\n    font-style: italic;\n  }\n  \n  .mp-final-date {\n    margin-top: 25px;\n    color: var(--mp-gold-light);\n    font-size: 11px;\n    letter-spacing: .12em;\n    text-transform: uppercase;\n  }\n  \n  \n  \/* =========================================================\n     17. CONTACT\n  ========================================================= *\/\n  \n  .mp-contact {\n    background: var(--mp-paper);\n  }\n  \n  .mp-contact-grid {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 50px;\n  }\n  \n  .mp-contact-card {\n    padding: 40px;\n    background: white;\n    border: 1px solid var(--mp-border);\n  }\n  \n  .mp-contact-card h3 {\n    margin: 0 0 20px;\n    font-family: Georgia, serif;\n    font-size: 30px;\n  }\n  \n  .mp-contact-logo {\n    width: 100%;\n    max-width: 390px;\n    margin: 20px 0 25px;\n    display: flex;\n    align-items: center;\n  }\n  \n  .mp-contact-logo img {\n    display: block;\n    max-width: 100% !important;\n    max-height: 90px !important;\n    width: auto !important;\n    height: auto !important;\n    object-fit: contain !important;\n  }\n  \n  .mp-contact-item {\n    padding: 15px 0;\n    border-bottom: 1px solid var(--mp-border);\n  }\n  \n  .mp-contact-item:last-child {\n    border-bottom: 0;\n  }\n  \n  .mp-contact-label {\n    display: block;\n    margin-bottom: 3px;\n    color: var(--mp-muted);\n    font-size: 10px;\n    letter-spacing: .12em;\n    text-transform: uppercase;\n  }\n  \n  .mp-contact-value {\n    font-weight: 750;\n  }\n  \n  \n  \/* =========================================================\n     18. FOOTER (FIX LOGO UNINDRA)\n  ========================================================= *\/\n  \n  .mp-footer {\n    padding: 45px 0 100px;\n    background: var(--mp-ink);\n    color: white;\n  }\n  \n  .mp-footer-top {\n    display: flex;\n    justify-content: space-between;\n    gap: 40px;\n    padding-bottom: 35px;\n    border-bottom: 1px solid rgba(255,255,255,.1);\n  }\n  \n  .mp-footer-brand {\n    font-family: Georgia, serif;\n    font-size: 25px;\n    color: white;\n  }\n  \n  .mp-footer-brand small {\n    display: block;\n    margin-top: 5px;\n    font-family: Inter, Arial, sans-serif;\n    color: rgba(255,255,255,.45);\n    font-size: 10px;\n  }\n  \n  .mp-footer-logo {\n    width: 250px;\n    max-width: 100%;\n    padding: 8px 12px;\n    margin-top: 20px;\n    background: #ffffff;\n    border-radius: 5px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  \n  .mp-footer-logo img {\n    display: block !important;\n    max-width: 100% !important;\n    max-height: 48px !important;\n    width: auto !important;\n    height: auto !important;\n    object-fit: contain !important;\n  }\n  \n  .mp-footer-partners {\n    text-align: right;\n  }\n  \n  .mp-footer-partners small {\n    display: block;\n    margin-bottom: 10px;\n    color: rgba(255,255,255,.4);\n    font-size: 9px;\n    letter-spacing: .12em;\n    text-transform: uppercase;\n  }\n  \n  .mp-partner-list {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: flex-end;\n    gap: 7px;\n  }\n  \n  .mp-partner-list span {\n    padding: 6px 10px;\n    border: 1px solid rgba(255,255,255,.14);\n    border-radius: 999px;\n    color: rgba(255,255,255,.65);\n    font-size: 9px;\n  }\n  \n  .mp-copyright {\n    padding-top: 25px;\n    color: rgba(255,255,255,.35);\n    font-size: 10px;\n  }\n  \n  \n  \/* =========================================================\n     19. MOBILE STICKY CTA\n  ========================================================= *\/\n  \n  .mp-mobile-cta {\n    display: none;\n    position: fixed;\n    z-index: 99998;\n    left: 12px;\n    right: 12px;\n    bottom: 12px;\n    padding: 8px;\n    background: rgba(23,21,31,.95);\n    border: 1px solid rgba(255,255,255,.12);\n    border-radius: 999px;\n    box-shadow: 0 10px 40px rgba(0,0,0,.25);\n    backdrop-filter: blur(10px);\n  }\n  \n  .mp-mobile-cta a {\n    display: block;\n    padding: 12px;\n    border-radius: 999px;\n    background: var(--mp-gold);\n    color: var(--mp-ink) !important;\n    text-align: center;\n    font-size: 11px;\n    font-weight: 900;\n    letter-spacing: .1em;\n    text-transform: uppercase;\n  }\n  \n  \n  \/* =========================================================\n     20. RESPONSIVE TABLET & MOBILE\n  ========================================================= *\/\n  \n  @media (max-width: 1000px) {\n    .mp-nav-links {\n      gap: 12px;\n    }\n  \n    .mp-hero {\n      min-height: auto;\n      padding: 120px 0 80px;\n    }\n  \n    .mp-hero-inner {\n      grid-template-columns: 1fr;\n      gap: 40px;\n    }\n  \n    .mp-hero-content {\n      text-align: center;\n    }\n  \n    .mp-hero-kicker, .mp-hero-description {\n      margin-left: auto;\n      margin-right: auto;\n    }\n  \n    .mp-hero-meta, .mp-actions {\n      justify-content: center;\n    }\n  \n    .mp-hero-visual {\n      max-width: 480px;\n      width: 100%;\n      margin: auto;\n    }\n  \n    .mp-benefit-grid, .mp-subtheme-grid, .mp-journey-flow {\n      grid-template-columns: 1fr 1fr;\n    }\n  \n    .mp-timeline {\n      grid-template-columns: 1fr;\n      gap: 25px;\n    }\n  \n    .mp-timeline::before {\n      top: 0;\n      bottom: 0;\n      left: 15px;\n      right: auto;\n      width: 1px;\n      height: auto;\n    }\n  \n    .mp-timeline-item {\n      display: grid;\n      grid-template-columns: 45px 1fr;\n      gap: 15px;\n      text-align: left;\n      padding: 0;\n    }\n  \n    .mp-timeline-dot {\n      margin: 0;\n      grid-row: 1 \/ span 3;\n    }\n  \n    .mp-timeline-date, .mp-timeline-item h3, .mp-timeline-item p {\n      grid-column: 2;\n      margin-left: 0;\n    }\n  \n    .mp-journey-step::after {\n      display: none !important;\n    }\n  \n    .mp-score-grid, .mp-registration-box {\n      grid-template-columns: 1fr;\n    }\n  }\n  \n  @media (max-width: 760px) {\n    .mp-container {\n      width: min(calc(100% - 28px), 600px);\n    }\n  \n    .mp-section {\n      padding: 70px 0;\n    }\n  \n    .mp-section-title {\n      margin-bottom: 35px;\n    }\n  \n    .mp-section-title h2 {\n      font-size: 40px !important;\n    }\n  \n    .mp-brand-logo {\n      width: 100px;\n      height: 36px;\n    }\n  \n    .mp-brand-text {\n      display: none;\n    }\n  \n    .mp-nav-links {\n      position: absolute;\n      top: 62px;\n      left: 14px;\n      right: 14px;\n      display: none;\n      flex-direction: column;\n      align-items: stretch;\n      padding: 20px;\n      background: rgba(23,21,31,.98);\n      border: 1px solid rgba(255,255,255,.1);\n      border-radius: 15px;\n    }\n  \n    .mp-nav-links.mp-menu-open {\n      display: flex;\n    }\n  \n    .mp-nav-cta {\n      text-align: center;\n    }\n  \n    .mp-mobile-toggle {\n      display: block;\n    }\n  \n    .mp-hero {\n      padding: 110px 0 70px;\n    }\n  \n    .mp-hero-content {\n      text-align: left;\n    }\n  \n    .mp-hero h1 {\n      font-size: clamp(48px, 14vw, 75px) !important;\n    }\n  \n    .mp-hero-theme {\n      font-size: 24px;\n    }\n  \n    .mp-hero-description {\n      font-size: 15px;\n    }\n  \n    .mp-hero-meta, .mp-actions {\n      justify-content: flex-start;\n    }\n  \n    .mp-poster-frame {\n      transform: rotate(0deg);\n    }\n  \n    .mp-benefit-grid, .mp-category-grid, .mp-subtheme-grid, \n    .mp-tech-highlight, .mp-prize-grid, .mp-fee-grid, \n    .mp-contact-grid, .mp-journey-flow, .mp-rule-list {\n      grid-template-columns: 1fr;\n    }\n  \n    .mp-registration-info {\n      padding: 30px;\n    }\n  \n    .mp-footer-top {\n      flex-direction: column;\n    }\n  \n    .mp-footer-partners {\n      text-align: left;\n    }\n  \n    .mp-partner-list {\n      justify-content: flex-start;\n    }\n  \n    .mp-mobile-cta {\n      display: block;\n    }\n  \n    .mp-footer {\n      padding-bottom: 100px;\n    }\n  }\n  \n  @media (max-width: 420px) {\n    .mp-hero h1 {\n      font-size: 46px !important;\n    }\n  \n    .mp-actions {\n      flex-direction: column;\n      align-items: stretch;\n    }\n  \n    .mp-actions .mp-btn {\n      width: 100%;\n    }\n  \n    .mp-countdown {\n      gap: 4px;\n    }\n  \n    .mp-count-number {\n      font-size: 22px;\n    }\n  }\n  \n  \n  \/* =========================================================\n     OVERRIDE WARNA WORDPRESS THEME\n  ========================================================= *\/\n  \n  #mp-landing .mp-benefits .mp-section-title h2 {\n    color: #ffffff !important;\n  }\n  \n  #mp-landing .mp-benefits .mp-section-title p {\n    color: rgba(255,255,255,.65) !important;\n  }\n  \n  #mp-landing .mp-benefits .mp-section-title .mp-eyebrow {\n    color: #f0d99a !important;\n  }\n  \n  <\/style>\n  \n  \n\n  \n  <!-- =========================================================\n       HERO SECTION\n  ========================================================= -->\n  \n  <section class=\"mp-hero\" id=\"mp-hero\">\n    <div class=\"mp-container mp-hero-inner\">\n      <div class=\"mp-hero-content mp-reveal\">\n        <div class=\"mp-eyebrow mp-hero-kicker\">Bulan Bahasa 2026<\/div>\n  \n        <h1>\n          LOMBA\n          <span>MUSIKALISASI<\/span>\n          PUISI\n        <\/h1>\n  \n        <div class=\"mp-hero-theme\">\n          \u201cMerawat Sastra: Denyut Bahasa dalam Nada\u201d\n        <\/div>\n  \n        <p class=\"mp-hero-description\">\n          Satukan kekuatan kata, musik, dan ekspresi. Hidupkan puisi melalui kreativitas generasi muda.\n        <\/p>\n  \n        <div class=\"mp-hero-meta\">\n          <span class=\"mp-pill\">SMA \/ SMK \/ MA<\/span>\n          <span class=\"mp-pill\">MAHASISWA<\/span>\n          <span class=\"mp-pill\">DKI JAKARTA<\/span>\n          <span class=\"mp-pill\">BANTEN<\/span>\n          <span class=\"mp-pill\">JAWA<\/span>\n        <\/div>\n  \n        <div class=\"mp-actions\">\n          <a href=\"https:\/\/musikalisasipuisiunindra.s.gy\/lpb\" target=\"_blank\" rel=\"noopener\" class=\"mp-btn mp-btn-primary\">\n            Daftar Sekarang \u2192\n          <\/a>\n          <a href=\"#mp-mechanism\" class=\"mp-btn mp-btn-secondary\">\n            Pelajari Lomba\n          <\/a>\n        <\/div>\n      <\/div>\n  \n      <div class=\"mp-hero-visual mp-reveal\">\n        <div class=\"mp-poster-frame\">\n          <img decoding=\"async\" src=\"https:\/\/lpb.unindra.ac.id\/wp-content\/uploads\/2026\/09\/POSTER-MP_2026-NEW-2.png\" alt=\"Poster Lomba Musikalisasi Puisi Bulan Bahasa 2026\">\n          <div class=\"mp-poster-caption\">Bulan Bahasa 2026<\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n  \n  \n  <!-- =========================================================\n       HOOK SECTION\n  ========================================================= -->\n  \n  <section class=\"mp-section mp-hook\" id=\"mp-about\">\n    <div class=\"mp-container mp-hook-inner mp-reveal\">\n      <div class=\"mp-eyebrow\">Kata \u2022 Nada \u2022 Ekspresi<\/div>\n  \n      <blockquote>\n        Ketika kata bertemu nada,\n        <em>puisi kembali berdenyut.<\/em>\n      <\/blockquote>\n  \n      <p class=\"mp-hook-copy\">\n        Musikalisasi puisi menjadi ruang untuk mempertemukan kekuatan bahasa, kedalaman makna sastra, dan keindahan musik dalam sebuah pertunjukan yang kreatif dan relevan dengan generasi muda.\n      <\/p>\n    <\/div>\n  <\/section>\n  \n  \n  <!-- =========================================================\n       BENEFITS SECTION\n  ========================================================= -->\n  \n  <section class=\"mp-section mp-benefits\">\n    <div class=\"mp-container\">\n      <div class=\"mp-section-title mp-reveal\">\n        <div class=\"mp-eyebrow\">Mengapa ikut?<\/div>\n        <h2>Bukan sekadar lomba.<\/h2>\n        <p>\n          Sebuah ruang apresiasi, ekspresi, kreativitas, dan pertemuan generasi muda dengan bahasa dan sastra Indonesia.\n        <\/p>\n      <\/div>\n  \n      <div class=\"mp-benefit-grid\">\n        <div class=\"mp-benefit mp-reveal\">\n          <div class=\"mp-benefit-number\">01<\/div>\n          <div class=\"mp-benefit-icon\">\u25cc<\/div>\n          <h3>Ekspresi<\/h3>\n          <p>Salurkan kreativitas melalui perpaduan puisi dan musik.<\/p>\n        <\/div>\n  \n        <div class=\"mp-benefit mp-reveal\">\n          <div class=\"mp-benefit-number\">02<\/div>\n          <div class=\"mp-benefit-icon\">\u2726<\/div>\n          <h3>Sastra<\/h3>\n          <p>Bangun minat dan apresiasi terhadap sastra Indonesia.<\/p>\n        <\/div>\n  \n        <div class=\"mp-benefit mp-reveal\">\n          <div class=\"mp-benefit-number\">03<\/div>\n          <div class=\"mp-benefit-icon\">\u221e<\/div>\n          <h3>Jejaring<\/h3>\n          <p>Bangun silaturahmi antarsekolah dan perguruan tinggi.<\/p>\n        <\/div>\n  \n        <div class=\"mp-benefit mp-reveal\">\n          <div class=\"mp-benefit-number\">04<\/div>\n          <div class=\"mp-benefit-icon\">\u265b<\/div>\n          <h3>Prestasi<\/h3>\n          <p>Raih piagam, hadiah, dan piala bergilir.<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n  \n  \n  <!-- =========================================================\n       CATEGORY SECTION\n  ========================================================= -->\n  \n  <section class=\"mp-section mp-categories\" id=\"mp-category\">\n    <div class=\"mp-container\">\n      <div class=\"mp-section-title mp-reveal\">\n        <div class=\"mp-eyebrow\">Peserta<\/div>\n        <h2>Siapa yang bisa ikut?<\/h2>\n        <p>Lomba terbuka bagi pelajar dan mahasiswa sesuai cakupan wilayah kegiatan.<\/p>\n      <\/div>\n  \n      <div class=\"mp-category-grid\">\n        <div class=\"mp-category mp-reveal\">\n          <div class=\"mp-category-label\">Kategori 01<\/div>\n          <h3>Pelajar<\/h3>\n          <p>Siswa\/i SMA, SMK, MA atau sederajat.<\/p>\n          <div class=\"mp-category-facts\">\n            <span>3\u20135 orang\/tim<\/span>\n            <span>Maks. 5 tim\/sekolah<\/span>\n          <\/div>\n        <\/div>\n  \n        <div class=\"mp-category mp-reveal\">\n          <div class=\"mp-category-label\">Kategori 02<\/div>\n          <h3>Mahasiswa<\/h3>\n          <p>Peserta dari perguruan tinggi.<\/p>\n          <div class=\"mp-category-facts\">\n            <span>3\u20135 orang\/tim<\/span>\n            <span>Maks. 5 tim\/PT<\/span>\n          <\/div>\n        <\/div>\n      <\/div>\n  \n      <div class=\"mp-region mp-reveal\">\n        <div style=\"font-size:10px; text-transform:uppercase; letter-spacing:.15em; color:var(--mp-muted);\">\n          Wilayah peserta\n        <\/div>\n        <strong>DKI Jakarta \u2022 Banten \u2022 Pulau Jawa<\/strong>\n      <\/div>\n    <\/div>\n  <\/section>\n  \n  \n  <!-- =========================================================\n       SUBTHEMES SECTION\n  ========================================================= -->\n  \n  <section class=\"mp-section mp-subthemes\">\n    <div class=\"mp-container\">\n      <div class=\"mp-section-title mp-reveal\">\n        <div class=\"mp-eyebrow\">Pilih gagasanmu<\/div>\n        <h2>Pilih suaramu.<\/h2>\n        <p>\n          Peserta bebas memilih puisi karya sastrawan Indonesia dengan mencantumkan nama pengarang dan menyelaraskannya dengan tema lomba.\n        <\/p>\n      <\/div>\n  \n      <div class=\"mp-subtheme-grid\">\n        <div class=\"mp-subtheme mp-reveal\">\n          <div class=\"mp-subtheme-number\">01<\/div>\n          <h3>Budaya dan Kearifan Lokal<\/h3>\n        <\/div>\n  \n        <div class=\"mp-subtheme mp-reveal\">\n          <div class=\"mp-subtheme-number\">02<\/div>\n          <h3>Nasionalisme dan Kebangsaan<\/h3>\n        <\/div>\n  \n        <div class=\"mp-subtheme mp-reveal\">\n          <div class=\"mp-subtheme-number\">03<\/div>\n          <h3>Generasi Muda dan Masa Depan<\/h3>\n        <\/div>\n  \n        <div class=\"mp-subtheme mp-reveal\">\n          <div class=\"mp-subtheme-number\">04<\/div>\n          <h3>Kemanusiaan dan Perdamaian<\/h3>\n        <\/div>\n  \n        <div class=\"mp-subtheme mp-reveal\">\n          <div class=\"mp-subtheme-number\">05<\/div>\n          <h3>Alam dan Kelestarian Lingkungan<\/h3>\n        <\/div>\n  \n        <div class=\"mp-subtheme mp-reveal\">\n          <div class=\"mp-subtheme-number\">06<\/div>\n          <h3>Cinta, Keluarga, dan Kehidupan<\/h3>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n  \n  \n  <!-- =========================================================\n       TECHNICAL SECTION\n  ========================================================= -->\n  \n  <section class=\"mp-section mp-technical\" id=\"mp-mechanism\">\n    <div class=\"mp-container\">\n      <div class=\"mp-section-title mp-reveal\">\n        <div class=\"mp-eyebrow\">Mekanisme<\/div>\n        <h2>Bebaskan musikmu.<\/h2>\n        <p>\n          Tampilkan interpretasi puisi melalui musik yang dimainkan secara langsung dan harmonis.\n        <\/p>\n      <\/div>\n  \n      <div class=\"mp-tech-highlight\">\n        <div class=\"mp-tech-item mp-reveal\">\n          <div class=\"mp-tech-big\">\u2264 7<\/div>\n          <div class=\"mp-tech-label\">Menit<\/div>\n        <\/div>\n  \n        <div class=\"mp-tech-item mp-reveal\">\n          <div class=\"mp-tech-big\">MP4<\/div>\n          <div class=\"mp-tech-label\">Format Video<\/div>\n        <\/div>\n  \n        <div class=\"mp-tech-item mp-reveal\">\n          <div class=\"mp-tech-big\">LIVE<\/div>\n          <div class=\"mp-tech-label\">Performance<\/div>\n        <\/div>\n      <\/div>\n  \n      <div class=\"mp-rule-list\">\n        <div class=\"mp-rule mp-reveal\">\n          <div class=\"mp-rule-number\">01<\/div>\n          <p>Instrumen musik dapat berupa akustik, elektrik, dan tradisional.<\/p>\n        <\/div>\n  \n        <div class=\"mp-rule mp-reveal\">\n          <div class=\"mp-rule-number\">02<\/div>\n          <p>Penampilan harus memadukan unsur musik dan penyajikan puisi secara harmonis.<\/p>\n        <\/div>\n  \n        <div class=\"mp-rule mp-reveal\">\n          <div class=\"mp-rule-number\">03<\/div>\n          <p>Playback tidak diperkenankan. Musik harus dimainkan secara langsung.<\/p>\n        <\/div>\n  \n        <div class=\"mp-rule mp-reveal\">\n          <div class=\"mp-rule-number\">04<\/div>\n          <p>Kostum dan properti diperbolehkan sepanjang mendukung penampilan dan tidak berlebihan.<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n  \n  \n  <!-- =========================================================\n       TIMELINE SECTION\n  ========================================================= -->\n  \n   <section class=\"mp-section mp-timeline-section\">\n    <div class=\"mp-container\">\n      <div class=\"mp-section-title mp-reveal\">\n        <div class=\"mp-eyebrow\" style=\"color:var(--mp-gold-light);\">Perjalanan lomba<\/div>\n        <h2 style=\"color: #ffffff !important;\">Dari karya menuju panggung.<\/h2>\n        <p>Simpan tanggal penting berikut agar tim Anda tidak melewatkan setiap tahap kompetisi.<\/p>\n      <\/div>\n  \n      <div class=\"mp-timeline\">\n        <div class=\"mp-timeline-item mp-reveal\">\n          <div class=\"mp-timeline-dot\"><\/div>\n          <div class=\"mp-timeline-date\">31 AGUSTUS<\/div>\n          <h3>Pendaftaran Dimulai<\/h3>\n          <p>Pendaftaran dan pengumpulan karya dimulai.<\/p>\n        <\/div>\n  \n        <div class=\"mp-timeline-item mp-reveal\">\n          <div class=\"mp-timeline-dot\"><\/div>\n          <div class=\"mp-timeline-date\">20 OKTOBER<\/div>\n          <h3>Batas Pengumpulan<\/h3>\n          <p>Batas akhir pendaftaran dan pengumpulan.<\/p>\n        <\/div>\n  \n        <div class=\"mp-timeline-item mp-reveal\">\n          <div class=\"mp-timeline-dot\"><\/div>\n          <div class=\"mp-timeline-date\">21\u201325 OKTOBER<\/div>\n          <h3>Penjurian &amp; Seleksi<\/h3>\n          <p>Penilaian karya peserta.<\/p>\n        <\/div>\n  \n        <div class=\"mp-timeline-item mp-reveal\">\n          <div class=\"mp-timeline-dot\"><\/div>\n          <div class=\"mp-timeline-date\">28 OKTOBER<\/div>\n          <h3>Pengumuman Finalis<\/h3>\n          <p>5 tim terbaik dari masing-masing kategori.<\/p>\n        <\/div>\n  \n        <div class=\"mp-timeline-item mp-timeline-final mp-reveal\">\n          <div class=\"mp-timeline-dot\">\u2605<\/div>\n          <div class=\"mp-timeline-date\">31 OKTOBER<\/div>\n          <h3>Grand Final &amp; Pementasan<\/h3>\n          <p>Panggung final di Kampus B.<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n  \n  \n  <!-- =========================================================\n       JOURNEY SECTION\n  ========================================================= -->\n  \n  <section class=\"mp-section mp-journey\">\n    <div class=\"mp-container\">\n      <div class=\"mp-section-title mp-reveal\">\n        <div class=\"mp-eyebrow\">Dari video menuju panggung<\/div>\n        <h2>Karya yang kamu kirim hari ini, bisa tampil di panggung final.<\/h2>\n      <\/div>\n  \n      <div class=\"mp-journey-flow\">\n        <div class=\"mp-journey-step mp-reveal\">\n          <div class=\"mp-journey-number\">01<\/div>\n          <h3>Daftar<\/h3>\n          <p>Lengkapi pendaftaran tim secara daring.<\/p>\n        <\/div>\n  \n        <div class=\"mp-journey-step mp-reveal\">\n          <div class=\"mp-journey-number\">02<\/div>\n          <h3>Kirim Karya<\/h3>\n          <p>Kirim video musikalisasi puisi dalam format MP4.<\/p>\n        <\/div>\n  \n        <div class=\"mp-journey-step mp-reveal\">\n          <div class=\"mp-journey-number\">03<\/div>\n          <h3>Dinilai<\/h3>\n          <p>Karya dinilai berdasarkan kriteria juri.<\/p>\n        <\/div>\n  \n        <div class=\"mp-journey-step mp-reveal\">\n          <div class=\"mp-journey-number\">04<\/div>\n          <h3>5 Tim Terbaik<\/h3>\n          <p>Lima tim terbaik dari masing-masing kategori melaju ke final.<\/p>\n        <\/div>\n  \n        <div class=\"mp-journey-step mp-reveal\">\n          <div class=\"mp-journey-number\">05<\/div>\n          <h3>Panggung Final<\/h3>\n          <p>Tampilkan karya secara langsung di panggung Grand Final.<\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n  \n  \n  <!-- =========================================================\n       JUDGING SECTION\n  ========================================================= -->\n  \n  <section class=\"mp-section mp-judging\" id=\"mp-judging\">\n    <div class=\"mp-container\">\n      <div class=\"mp-section-title mp-reveal\">\n        <div class=\"mp-eyebrow\">Kriteria penilaian<\/div>\n        <h2>Apa yang dicari juri?<\/h2>\n        <p>\n          Bukan hanya kemampuan bermusik. Interpretasi, penghayatan, penampilan, dan kesesuaian musik dengan puisi juga penting.\n        <\/p>\n      <\/div>\n  \n      <div class=\"mp-score-grid\">\n        <div class=\"mp-score-card mp-reveal\">\n          <div class=\"mp-score-head\">\n            <div class=\"mp-score-percent\">40%<\/div>\n            <h3>Musikalitas<\/h3>\n          <\/div>\n          <div class=\"mp-score-body\">\n            <div class=\"mp-score-row\">\n              <strong>Aransemen Musik<\/strong>\n              <span>15%<\/span>\n            <\/div>\n            <div class=\"mp-score-row\">\n              <strong>Vokal<\/strong>\n              <span>10%<\/span>\n            <\/div>\n            <div class=\"mp-score-row\">\n              <strong>Harmonisasi &amp; Permainan Musik<\/strong>\n              <span>10%<\/span>\n            <\/div>\n            <div class=\"mp-score-row\">\n              <strong>Kreativitas Musikal<\/strong>\n              <span>5%<\/span>\n            <\/div>\n          <\/div>\n        <\/div>\n  \n        <div class=\"mp-score-card mp-reveal\">\n          <div class=\"mp-score-head\">\n            <div class=\"mp-score-percent\">20%<\/div>\n            <h3>Penampilan<\/h3>\n          <\/div>\n          <div class=\"mp-score-body\">\n            <div class=\"mp-score-row\">\n              <strong>Teknik &amp; Penguasaan Panggung<\/strong>\n              <span>7%<\/span>\n            <\/div>\n            <div class=\"mp-score-row\">\n              <strong>Ekspresi &amp; Komunikasi<\/strong>\n              <span>7%<\/span>\n            <\/div>\n            <div class=\"mp-score-row\">\n              <strong>Kekompakan &amp; Tata Artistik<\/strong>\n              <span>6%<\/span>\n            <\/div>\n          <\/div>\n        <\/div>\n  \n        <div class=\"mp-score-card mp-reveal\">\n          <div class=\"mp-score-head\">\n            <div class=\"mp-score-percent\">40%<\/div>\n            <h3>Penghayatan<\/h3>\n          <\/div>\n          <div class=\"mp-score-body\">\n            <div class=\"mp-score-row\">\n              <strong>Pemahaman &amp; Interpretasi Puisi<\/strong>\n              <span>15%<\/span>\n            <\/div>\n            <div class=\"mp-score-row\">\n              <strong>Penghayatan &amp; Ekspresi<\/strong>\n              <span>15%<\/span>\n            <\/div>\n            <div class=\"mp-score-row\">\n              <strong>Kesesuaian Musik dengan Puisi<\/strong>\n              <span>10%<\/span>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n  \n  \n  <!-- =========================================================\n       PRIZE SECTION\n  ========================================================= -->\n  \n  <section class=\"mp-section mp-prize\">\n    <div class=\"mp-container\">\n      <div class=\"mp-trophy\">\u265b<\/div>\n  \n      <h2 class=\"mp-reveal\">Rebut Piala<br>Bergilir.<\/h2>\n  \n      <p class=\"mp-prize-intro mp-reveal\">\n        Tampilkan karya terbaikmu dan jadikan kreativitas sebagai prestasi yang dikenang.\n      <\/p>\n  \n      <div class=\"mp-prize-grid\">\n        <div class=\"mp-prize-card mp-reveal\">\n          <div class=\"mp-small\">Terbaik 1 \u2014 Kategori Pelajar<\/div>\n          <h3>Piala Bergilir Rektor Unindra<\/h3>\n          <p>Piala Bergilir Rektor Universitas Indraprasta PGRI.<\/p>\n        <\/div>\n  \n        <div class=\"mp-prize-card mp-reveal\">\n          <div class=\"mp-small\">Terbaik 1 \u2014 Kategori Mahasiswa<\/div>\n          <h3>Piala Bergilir Kepala LPB<\/h3>\n          <p>Piala Bergilir Kepala Lembaga Pengembangan Bahasa Unindra.<\/p>\n        <\/div>\n      <\/div>\n  \n      <div style=\"margin-top:25px; color:rgba(255,255,255,.5); font-size:12px;\">\n        Piagam penghargaan \u2022 Hadiah \u2022 Piala Bergilir\n      <\/div>\n    <\/div>\n  <\/section>\n  \n  \n  <!-- =========================================================\n       REGISTRATION SECTION\n  ========================================================= -->\n  \n  <section class=\"mp-section mp-registration\" id=\"mp-registration\">\n    <div class=\"mp-container mp-registration-box\">\n      <div class=\"mp-reveal\">\n        <div class=\"mp-eyebrow\">Registrasi<\/div>\n        <h2 style=\"margin:15px 0; font-family:Georgia,serif; font-size:clamp(45px,6vw,75px); line-height:.95;\">\n          Saatnya<br>tampil.\n        <\/h2>\n        <p style=\"color:var(--mp-muted);\">\n          Pilih kategori, bentuk tim, siapkan karya, lalu bawa puisimu menuju panggung.\n        <\/p>\n      <\/div>\n  \n      <div class=\"mp-reveal\">\n        <div class=\"mp-fee-grid\">\n          <div class=\"mp-fee\">\n            <div class=\"mp-fee-label\">Pelajar<\/div>\n            <div class=\"mp-fee-price\">Rp150.011<\/div>\n          <\/div>\n  \n          <div class=\"mp-fee\">\n            <div class=\"mp-fee-label\">Mahasiswa<\/div>\n            <div class=\"mp-fee-price\">Rp175.011<\/div>\n          <\/div>\n        <\/div>\n  \n        <div class=\"mp-registration-info\">\n          <h3>Pendaftaran &amp; Pengumpulan<\/h3>\n          <p style=\"margin:0; color:rgba(255,255,255,.55); font-size:13px;\">\n            Dilaksanakan secara daring.\n          <\/p>\n  \n          <div class=\"mp-deadline\">\n            <small>Batas akhir<\/small>\n            <strong>20 Oktober 2026<\/strong>\n          <\/div>\n  \n          <div class=\"mp-countdown\" id=\"mp-countdown\">\n            <div class=\"mp-count-box\">\n              <div class=\"mp-count-number\" id=\"mp-days\">00<\/div>\n              <div class=\"mp-count-label\">Hari<\/div>\n            <\/div>\n            <div class=\"mp-count-box\">\n              <div class=\"mp-count-number\" id=\"mp-hours\">00<\/div>\n              <div class=\"mp-count-label\">Jam<\/div>\n            <\/div>\n            <div class=\"mp-count-box\">\n              <div class=\"mp-count-number\" id=\"mp-minutes\">00<\/div>\n              <div class=\"mp-count-label\">Menit<\/div>\n            <\/div>\n            <div class=\"mp-count-box\">\n              <div class=\"mp-count-number\" id=\"mp-seconds\">00<\/div>\n              <div class=\"mp-count-label\">Detik<\/div>\n            <\/div>\n          <\/div>\n  \n          <a href=\"https:\/\/musikalisasipuisiunindra.s.gy\/lpb\" target=\"_blank\" rel=\"noopener\" class=\"mp-btn mp-btn-primary\" style=\"width:100%;\">\n            Daftar Sekarang \u2192\n          <\/a>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n  \n  \n  <!-- =========================================================\n       FAQ SECTION\n  ========================================================= -->\n  \n  <section class=\"mp-section mp-faq\" id=\"mp-faq\">\n    <div class=\"mp-container\">\n      <div class=\"mp-section-title mp-reveal\">\n        <div class=\"mp-eyebrow\">FAQ<\/div>\n        <h2>Masih punya pertanyaan?<\/h2>\n        <p>Temukan jawaban atas pertanyaan penting sebelum mendaftar.<\/p>\n      <\/div>\n  \n      <div class=\"mp-faq-list\">\n        <div class=\"mp-faq-item\">\n          <button class=\"mp-faq-question\">\n            <span>Siapa yang dapat mengikuti lomba?<\/span>\n            <span class=\"mp-faq-plus\">+<\/span>\n          <\/button>\n          <div class=\"mp-faq-answer\">\n            <div class=\"mp-faq-answer-inner\">\n              <p>Lomba diikuti oleh siswa\/i SMA\/SMK\/MA sederajat dan mahasiswa sesuai kategori se-DKI Jakarta, Banten, dan Pulau Jawa.<\/p>\n            <\/div>\n          <\/div>\n        <\/div>\n  \n        <div class=\"mp-faq-item\">\n          <button class=\"mp-faq-question\">\n            <span>Berapa jumlah anggota dalam satu tim?<\/span>\n            <span class=\"mp-faq-plus\">+<\/span>\n          <\/button>\n          <div class=\"mp-faq-answer\">\n            <div class=\"mp-faq-answer-inner\">\n              <p>Setiap tim terdiri dari 3\u20135 orang. Setiap sekolah atau perguruan tinggi dapat mengirimkan maksimal 5 tim.<\/p>\n            <\/div>\n          <\/div>\n        <\/div>\n  \n        <div class=\"mp-faq-item\">\n          <button class=\"mp-faq-question\">\n            <span>Puisi seperti apa dan bagaiaman?<\/span>\n            <span class=\"mp-faq-plus\">+<\/span>\n          <\/button>\n          <div class=\"mp-faq-answer\">\n            <div class=\"mp-faq-answer-inner\">\n              <p>Peserta bebas memilih puisi karya sastrawan Indonesia dengan mencantumkan nama pengarang. Fokuslah pada penguatan tafsir sastra melalui komposisi musik (aransemen instrumen, dinamika volume, tempo, dan harmonisasi vokal). Biarkan melodi musik Anda yang menyesuaikan dengan jumlah suku kata asli puisi, bukan sebaliknya. Pengulangan diperbolehkan, seandainya 1 bait untuk penegasan makna atau reff <\/p>\n            <\/div>\n          <\/div>\n        <\/div>\n  \n        <div class=\"mp-faq-item\">\n          <button class=\"mp-faq-question\">\n            <span>Apakah playback diperbolehkan?<\/span>\n            <span class=\"mp-faq-plus\">+<\/span>\n          <\/button>\n          <div class=\"mp-faq-answer\">\n            <div class=\"mp-faq-answer-inner\">\n              <p>Boleh,selama musik yang diputar itu hasil Aransemen sendiri.<\/p>\n            <\/div>\n          <\/div>\n        <\/div>\n  \n        <div class=\"mp-faq-item\">\n          <button class=\"mp-faq-question\">\n            <span>Berapa durasi penampilan?<\/span>\n            <span class=\"mp-faq-plus\">+<\/span>\n          <\/button>\n          <div class=\"mp-faq-answer\">\n            <div class=\"mp-faq-answer-inner\">\n              <p>Durasi penampilan maksimal 7 menit dalam video format MP4.<\/p>\n            <\/div>\n          <\/div>\n        <\/div>\n  \n        <div class=\"mp-faq-item\">\n          <button class=\"mp-faq-question\">\n            <span>Instrumen apa yang boleh digunakan?<\/span>\n            <span class=\"mp-faq-plus\">+<\/span>\n          <\/button>\n          <div class=\"mp-faq-answer\">\n            <div class=\"mp-faq-answer-inner\">\n              <p>Instrumen dapat berupa akustik, elektrik, tradisional, musik digital (Aransemen sendiri, tidak boleh mengambil karya orang).<\/p>\n            <\/div>\n          <\/div>\n        <\/div>\n  \n        <div class=\"mp-faq-item\">\n          <button class=\"mp-faq-question\">\n            <span>Berapa biaya pendaftaran?<\/span>\n            <span class=\"mp-faq-plus\">+<\/span>\n          <\/button>\n          <div class=\"mp-faq-answer\">\n            <div class=\"mp-faq-answer-inner\">\n              <p>Pelajar Rp150.011 dan mahasiswa Rp175.011.<\/p>\n            <\/div>\n          <\/div>\n        <\/div>\n  \n        <div class=\"mp-faq-item\">\n          <button class=\"mp-faq-question\">\n            <span>Berapa tim yang lolos ke final?<\/span>\n            <span class=\"mp-faq-plus\">+<\/span>\n          <\/button>\n          <div class=\"mp-faq-answer\">\n            <div class=\"mp-faq-answer-inner\">\n              <p>Lima tim terbaik dari masing-masing kategori akan tampil pada tahap final.<\/p>\n            <\/div>\n          <\/div>\n        <\/div>\n  \n        <div class=\"mp-faq-item\">\n          <button class=\"mp-faq-question\">\n            <span>Kapan Grand Final?<\/span>\n            <span class=\"mp-faq-plus\">+<\/span>\n          <\/button>\n          <div class=\"mp-faq-answer\">\n            <div class=\"mp-faq-answer-inner\">\n              <p>Grand Final dan pementasan dilaksanakan pada 31 Oktober 2026 di Kampus B.<\/p>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n  \n  \n  <!-- =========================================================\n       FINAL CTA SECTION\n  ========================================================= -->\n  \n  <section class=\"mp-section mp-final\">\n    <div class=\"mp-container mp-final-inner\">\n      <div class=\"mp-eyebrow\" style=\"color:var(--mp-gold-light);\">Bulan Bahasa 2026<\/div>\n  \n      <h2 class=\"mp-reveal\">Hidupkan<br>puisimu.<\/h2>\n  \n      <p class=\"mp-reveal\">\n        Satukan kata. Hadirkan nada. Tampilkan makna.\n      <\/p>\n  \n      <a href=\"https:\/\/musikalisasipuisiunindra.s.gy\/lpb\" target=\"_blank\" rel=\"noopener\" class=\"mp-btn mp-btn-primary\">\n        Daftar Sekarang \u2192\n      <\/a>\n  \n      <div class=\"mp-final-date\">\n        Pendaftaran: 31 Agustus \u2013 20 Oktober 2026\n      <\/div>\n    <\/div>\n  <\/section>\n  \n  \n  <!-- =========================================================\n       CONTACT SECTION\n  ========================================================= -->\n  \n  <section class=\"mp-section mp-contact\">\n    <div class=\"mp-container\">\n      <div class=\"mp-contact-grid\">\n        <div class=\"mp-contact-card mp-reveal\">\n          <div class=\"mp-eyebrow\">Narahubung<\/div>\n          <h3>Butuh informasi?<\/h3>\n  \n          <div class=\"mp-contact-item\">\n            <span class=\"mp-contact-label\">Nama<\/span>\n            <div class=\"mp-contact-value\">Puji Anto<\/div>\n          <\/div>\n  \n          <div class=\"mp-contact-item\">\n            <span class=\"mp-contact-label\">WhatsApp<\/span>\n            <a href=\"https:\/\/wa.me\/6281383972448\" target=\"_blank\" rel=\"noopener\" class=\"mp-contact-value\">\n              081383972448\n            <\/a>\n          <\/div>\n  \n          <div class=\"mp-contact-item\">\n            <span class=\"mp-contact-label\">Email<\/span>\n            <a href=\"mailto:unindra.lpb@gmail.com\" class=\"mp-contact-value\">\n              unindra.lpb@gmail.com\n            <\/a>\n          <\/div>\n        <\/div>\n  \n        <div class=\"mp-contact-card mp-reveal\">\n          <div class=\"mp-eyebrow\">Penyelenggara<\/div>\n          <h3>Lembaga Pengembangan Bahasa<\/h3>\n  \n          <div class=\"mp-contact-logo\">\n            <img decoding=\"async\" src=\"https:\/\/lpb.unindra.ac.id\/wp-content\/uploads\/2026\/09\/Logo-Sablon.jpg\" alt=\"Logo Lembaga Pengembangan Bahasa\">\n          <\/div>\n  \n          <p style=\"color:var(--mp-muted);\">Universitas Indraprasta PGRI<\/p>\n  \n          <div style=\"margin-top:30px; padding-top:25px; border-top:1px solid var(--mp-border);\">\n            <div style=\"font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--mp-muted);\">\n              Tema\n            <\/div>\n            <div style=\"margin-top:8px; font-family:Georgia,serif; font-size:23px;\">\n              \u201cMerawat Sastra: Denyut Bahasa dalam Nada\u201d\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n  \n  \n  <!-- =========================================================\n       FOOTER SECTION\n  ========================================================= -->\n  \n  <footer class=\"mp-footer\">\n    <div class=\"mp-container\">\n      <div class=\"mp-footer-top\">\n        <div>\n          <div class=\"mp-footer-brand\">\n            Lomba Musikalisasi Puisi\n            <small>Bulan Bahasa 2026<\/small>\n          <\/div>\n  \n          <div class=\"mp-footer-logo\">\n            <img decoding=\"async\" src=\"https:\/\/lpb.unindra.ac.id\/wp-content\/uploads\/2024\/09\/logo_unindra_3-1.png\" alt=\"Universitas Indraprasta PGRI\">\n          <\/div>\n  \n          <div style=\"margin-top:12px; color:rgba(255,255,255,.45); font-size:10px;\">\n            Lembaga Pengembangan Bahasa<br>Universitas Indraprasta PGRI\n          <\/div>\n        <\/div>\n  \n        <div class=\"mp-footer-partners\">\n          <small>Sponsor<\/small>\n          <div class=\"mp-partner-list\">\n            <span>BSI<\/span>\n            <span>Penerbit Erlangga<\/span>\n            <span>HISKI<\/span>\n            <span>GEMA<\/span>\n          <\/div>\n  \n          <small style=\"margin-top:20px;\">Didukung Oleh<\/small>\n          <div class=\"mp-partner-list\">\n            <span>Badan Pengembangan dan Pembinaan Bahasa<\/span>\n          <\/div>\n        <\/div>\n      <\/div>\n  \n      <div class=\"mp-copyright\">\n        \u00a9 2026 Lembaga Pengembangan Bahasa Universitas Indraprasta PGRI.\n      <\/div>\n    <\/div>\n  <\/footer>\n  \n  \n  <!-- =========================================================\n       MOBILE STICKY CTA\n  ========================================================= -->\n  \n  <div class=\"mp-mobile-cta\">\n    <a href=\"https:\/\/musikalisasipuisiunindra.s.gy\/lpb\" target=\"_blank\" rel=\"noopener\">\n      Daftar Sekarang\n    <\/a>\n  <\/div>\n  \n  \n  <!-- =========================================================\n       JAVASCRIPT\n  ========================================================= -->\n  \n  <script>\n  (function () {\n    \/* NAVIGATION SCROLL & TOGGLE *\/\n    const nav = document.getElementById(\"mp-nav\");\n    const toggle = document.getElementById(\"mp-toggle\");\n    const menu = document.getElementById(\"mp-menu\");\n  \n    window.addEventListener(\"scroll\", function () {\n      if (window.scrollY > 50) {\n        nav.classList.add(\"mp-scrolled\");\n      } else {\n        nav.classList.remove(\"mp-scrolled\");\n      }\n    });\n  \n    if (toggle) {\n      toggle.addEventListener(\"click\", function () {\n        menu.classList.toggle(\"mp-menu-open\");\n      });\n    }\n  \n    document.querySelectorAll(\"#mp-menu a\").forEach(function (link) {\n      link.addEventListener(\"click\", function () {\n        menu.classList.remove(\"mp-menu-open\");\n      });\n    });\n  \n    \/* SMOOTH SCROLL *\/\n    document.querySelectorAll('#mp-landing a[href^=\"#\"]').forEach(function (link) {\n      link.addEventListener(\"click\", function (e) {\n        const targetId = this.getAttribute(\"href\");\n        if (!targetId || targetId === \"#\") return;\n        const target = document.querySelector(targetId);\n        if (!target) return;\n        e.preventDefault();\n        target.scrollIntoView({\n          behavior: \"smooth\",\n          block: \"start\"\n        });\n      });\n    });\n  \n    \/* FAQ TOGGLE *\/\n    document.querySelectorAll(\".mp-faq-question\").forEach(function (button) {\n      button.addEventListener(\"click\", function () {\n        const item = this.closest(\".mp-faq-item\");\n        document.querySelectorAll(\".mp-faq-item\").forEach(function (other) {\n          if (other !== item) {\n            other.classList.remove(\"mp-open\");\n          }\n        });\n        item.classList.toggle(\"mp-open\");\n      });\n    });\n  \n    \/* SCROLL REVEAL *\/\n    const revealItems = document.querySelectorAll(\".mp-reveal\");\n    const observer = new IntersectionObserver(\n      function (entries) {\n        entries.forEach(function (entry) {\n          if (entry.isIntersecting) {\n            entry.target.classList.add(\"mp-visible\");\n            observer.unobserve(entry.target);\n          }\n        });\n      },\n      { threshold: 0.10 }\n    );\n  \n    revealItems.forEach(function (item) {\n      observer.observe(item);\n    });\n  \n    \/* COUNTDOWN TIMER TO 20 OKTOBER 2026 23:59:59 WIB *\/\n    const deadline = new Date(\"2026-10-20T23:59:59+07:00\").getTime();\n  \n    function updateCountdown() {\n      const now = new Date().getTime();\n      const distance = deadline - now;\n  \n      const days = document.getElementById(\"mp-days\");\n      const hours = document.getElementById(\"mp-hours\");\n      const minutes = document.getElementById(\"mp-minutes\");\n      const seconds = document.getElementById(\"mp-seconds\");\n  \n      if (!days || !hours || !minutes || !seconds) return;\n  \n      if (distance <= 0) {\n        days.textContent = \"00\";\n        hours.textContent = \"00\";\n        minutes.textContent = \"00\";\n        seconds.textContent = \"00\";\n        return;\n      }\n  \n      const d = Math.floor(distance \/ (1000 * 60 * 60 * 24));\n      const h = Math.floor((distance % (1000 * 60 * 60 * 24)) \/ (1000 * 60 * 60));\n      const m = Math.floor((distance % (1000 * 60 * 60)) \/ (1000 * 60));\n      const s = Math.floor((distance % (1000 * 60)) \/ 1000);\n  \n      days.textContent = String(d).padStart(2, \"0\");\n      hours.textContent = String(h).padStart(2, \"0\");\n      minutes.textContent = String(m).padStart(2, \"0\");\n      seconds.textContent = String(s).padStart(2, \"0\");\n    }\n  \n    updateCountdown();\n    setInterval(updateCountdown, 1000);\n  })();\n  <\/script>\n  \n  <\/div>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Bulan Bahasa 2026 LOMBA MUSIKALISASI PUISI \u201cMerawat Sastra: Denyut Bahasa dalam Nada\u201d Satukan kekuatan kata, musik, dan ekspresi. Hidupkan puisi melalui kreativitas generasi muda. SMA \/ SMK \/ MA MAHASISWA<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-2277","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/lpb.unindra.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/2277","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lpb.unindra.ac.id\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/lpb.unindra.ac.id\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/lpb.unindra.ac.id\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lpb.unindra.ac.id\/index.php\/wp-json\/wp\/v2\/comments?post=2277"}],"version-history":[{"count":23,"href":"https:\/\/lpb.unindra.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/2277\/revisions"}],"predecessor-version":[{"id":2317,"href":"https:\/\/lpb.unindra.ac.id\/index.php\/wp-json\/wp\/v2\/pages\/2277\/revisions\/2317"}],"wp:attachment":[{"href":"https:\/\/lpb.unindra.ac.id\/index.php\/wp-json\/wp\/v2\/media?parent=2277"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}