.page-hukum,
.page-hukum-detail {
    --hukum-black: #111111;
    --hukum-black-soft: #1b1b1b;
    --hukum-red: #b8324b;
    --hukum-yellow: #f4c542;
    --hukum-white: #f8f8f8;
}

.page-hukum .hero-caption {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    z-index: 5;
    padding: 1rem;
    pointer-events: none;
    background: transparent;
    transition: opacity 0.2s ease-out;
    opacity: 1;
    will-change: opacity, transform;
}

.page-hukum .caption-content {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

.page-hukum .caption-title {
    font-size: clamp(2.5rem, 8vw, 4rem);
    font-weight: 800;
    line-height: 1.2;
    color: var(--hukum-white);
    margin: 0 0 1.5rem;
    letter-spacing: 1px;
    text-shadow: 0 5px 20px rgba(0, 0, 0, 0.8);
    animation: hukumTitleGlow 3s ease-in-out infinite alternate;
}

.page-hukum .caption-title span {
    color: var(--hukum-red) !important;
    font-weight: 900;
    letter-spacing: -2px;
    text-shadow: 0 0 20px var(--hukum-red), 0 5px 15px rgba(0, 0, 0, 0.7);
    display: inline-block;
}

@keyframes hukumTitleGlow {
    from {
        text-shadow: 0 5px 20px rgba(0, 0, 0, 0.8), 0 0 20px var(--hukum-red);
    }
    to {
        text-shadow: 0 5px 30px rgba(0, 0, 0, 0.9), 0 0 40px var(--hukum-red);
    }
}

.page-hukum .caption-narasi {
    max-width: 800px;
    color: var(--hukum-white);
    font-size: clamp(1rem, 2.2vw, 1.2rem);
    line-height: 1.7;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
    margin: 1rem auto 2rem;
    letter-spacing: 0.3px;
}

.hukum-public-content {
    position: relative;
    z-index: 10;
    margin-top: 100vh;
    padding: 2rem 0 4rem;
}

.page-hukum-detail .hukum-public-detail {
    padding-top: 6rem;
}

.page-hukum-detail .hukum-public-back {
    margin-bottom: 2rem;
}

.hukum-public-filters { display:flex; flex-wrap:wrap; gap:12px; align-items:end; margin-bottom:2rem; padding:18px; border:1px solid rgba(184,50,75,.2); border-radius:16px; background:rgba(10,20,30,.4); box-shadow:0 10px 25px rgba(0,0,0,.2); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.hukum-public-filters label { display:flex; flex-direction:column; gap:5px; color:var(--hukum-white); font-size:.85rem; flex:1 1 180px; }
.hukum-public-filters input, .hukum-public-filters select { border:1px solid rgba(255,255,255,.17); border-radius:8px; padding:10px; background:rgba(8,13,20,.58); color:var(--hukum-white); }
.hukum-public-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:18px; }
.hukum-public-card, .hukum-document-header, .hukum-chapter { background:rgba(10,20,30,.4); border:1px solid rgba(184,50,75,.2); border-radius:16px; padding:22px; box-shadow:0 10px 25px rgba(0,0,0,.2); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.hukum-public-card h2, .hukum-document-header h1, .hukum-chapter h2 { color:var(--hukum-white); margin:10px 0; }
.hukum-public-card p, .hukum-document-header p { color:rgba(248,248,248,.76); line-height:1.65; }
.hukum-public-card-top { display:flex; justify-content:space-between; gap:10px; color:rgba(248,248,248,.62); font-size:.8rem; text-transform:uppercase; letter-spacing:.04em; }
.hukum-public-badge { color:var(--hukum-yellow); font-weight:700; }
.hukum-public-muted { color:rgba(248,248,248,.6); }
.hukum-public-empty { text-align:center; padding:3rem 1.5rem; border:1px solid rgba(184,50,75,.2); border-radius:16px; color:rgba(248,248,248,.68); background:rgba(10,20,30,.4); box-shadow:0 10px 25px rgba(0,0,0,.2); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.hukum-public-empty i { color:var(--hukum-yellow); font-size:3rem; margin-bottom:1rem; }
.hukum-public-back { display:inline-block; margin:2rem 0 1rem; color:var(--hukum-yellow); }
.hukum-document-header { margin-bottom:20px; }
.hukum-chapter { margin:18px 0; }
.hukum-pasal { border-top:1px solid rgba(248,248,248,.14); padding:16px 0; line-height:1.7; }
.hukum-pasal h3 { color:var(--hukum-yellow); margin:0 0 8px; }
.hukum-pasal ul { margin:8px 0; padding-left:22px; }
.hukum-summary-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; margin:18px 0 24px; }
.hukum-diff-table { display:grid; gap:12px; }
.hukum-diff-row { display:flex; flex-wrap:wrap; gap:10px; align-items:center; border:1px solid rgba(184,50,75,.2); border-radius:12px; padding:14px 16px; background:rgba(10,20,30,.4); box-shadow:0 8px 20px rgba(0,0,0,.16); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.hukum-status-tag { display:inline-flex; align-items:center; border-radius:999px; padding:4px 10px; font-size:.72rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.status-added { background:rgba(244,197,66,.18); color:var(--hukum-yellow); }
.status-removed { background:rgba(184,50,75,.22); color:#ff8fa2; }
.status-modified { background:rgba(244,197,66,.18); color:var(--hukum-yellow); }
.status-unchanged { background:rgba(248,248,248,.1); color:var(--hukum-white); }

.page-hukum .hukum-public-card:hover,
.page-hukum-detail .hukum-public-card:hover { border-color:rgba(184,50,75,.48); background:rgba(15,30,45,.5); }
.page-hukum .hukum-public-card .btn-small,
.page-hukum-detail .hukum-public-detail a {
    border: 2px solid var(--hukum-red);
    border-radius: 25px;
    padding: .5rem 1.2rem;
    background: var(--hukum-red);
    color: var(--hukum-white);
    text-decoration: none;
    display: inline-block;
    transition: all .3s ease;
}
.page-hukum-detail .hukum-public-detail a { margin: 0; }
.page-hukum .hukum-public-card .btn-small,
.page-hukum-detail .hukum-public-card .btn-small { background:var(--hukum-red); border-color:var(--hukum-red); color:var(--hukum-white); }
.page-hukum .hukum-public-card .btn-small:hover,
.page-hukum-detail .hukum-public-detail a:hover { background:var(--hukum-yellow); border-color:var(--hukum-yellow); color:var(--hukum-black); }
.hukum-pasal-explanation { margin-top:12px; }
.hukum-pasal-tools { display:flex; flex-direction:column; align-items:flex-start; gap:10px; margin-top:14px; }
.hukum-pasal-tools .hukum-pasal-explanation { width:100%; margin:0; }
.hukum-pasal-toggle summary { display:inline-flex; min-height:36px; align-items:center; gap:8px; padding:7px 12px; border:1px solid rgba(255,255,255,.18); border-radius:999px; color:rgba(255,255,255,.86); background:rgba(255,255,255,.055); cursor:pointer; list-style:none; font-size:.86rem; font-weight:500; transition:background .2s ease,border-color .2s ease,color .2s ease; }
.hukum-pasal-toggle summary:hover { border-color:rgba(184,50,75,.55); color:#fff; background:rgba(184,50,75,.12); }
.hukum-pasal-toggle summary > i { color:rgba(231,155,169,.9); font-size:.88rem; }
.hukum-pasal-toggle summary::-webkit-details-marker { display:none; }
.hukum-pasal-toggle summary::after { content:"\f078"; margin-left:3px; color:rgba(255,255,255,.55); font-family:"Font Awesome 6 Free"; font-size:.68rem; font-weight:900; transition:transform .2s ease; }
.hukum-pasal-toggle[open] summary::after { transform:rotate(180deg); }
.hukum-pasal-toggle[open] summary { border-color:rgba(184,50,75,.42); background:rgba(184,50,75,.09); }
.hukum-pasal-explanation summary::-webkit-details-marker { display:none; }
.hukum-pasal-explanation-content { display:grid; grid-template-rows:0fr; opacity:0; transition:grid-template-rows .25s ease, opacity .2s ease; }
.hukum-pasal-explanation[open] .hukum-pasal-explanation-content { grid-template-rows:1fr; opacity:1; }
.hukum-pasal-explanation-content > div { overflow:hidden; padding:0 14px; border-left:2px solid var(--hukum-yellow); color:var(--hukum-white); white-space:pre-wrap; }
.hukum-pasal-explanation[open] .hukum-pasal-explanation-content > div { padding-top:12px; padding-bottom:12px; }
.hukum-pasal-tools .hukum-pasal-clear { margin:0; color:var(--hukum-white); font-size:.9rem; font-style:italic; opacity:.72; }
.hukum-pasal-reference .hukum-pasal-explanation-content { margin-top:8px; }
.hukum-pasal-reference .hukum-pasal-explanation-content ul { margin:0; padding:0 0 0 22px; color:rgba(255,255,255,.82); }
.page-hukum-detail .hukum-pasal-reference .hukum-pasal-explanation-content a { display:inline; margin:0; padding:0; border:0; color:#e7a3af; background:transparent; font-weight:500; text-decoration:underline; text-underline-offset:3px; }
.page-hukum-detail .hukum-pasal-reference .hukum-pasal-explanation-content a:hover { color:#fff; background:transparent; }
.hukum-mukadimah { white-space:pre-wrap; line-height:1.7; }
@media (prefers-reduced-motion:reduce) { .hukum-pasal-explanation-content, .hukum-pasal-toggle summary::after { transition:none; } }

@media (max-width:700px) {
    .hukum-public-card, .hukum-document-header, .hukum-chapter { padding:16px; }
}

/* Public catalog follows the site's restrained glass-card and crimson accent theme. */
.page-hukum .hero-caption { padding:clamp(1.25rem,4vw,2.5rem); }
.page-hukum .caption-title { font-size:clamp(2.2rem,6vw,3.75rem); animation:none; text-shadow:0 5px 20px rgba(0,0,0,.72); }
.page-hukum .caption-title span { color:var(--biru-primary) !important; text-shadow:0 4px 16px rgba(0,0,0,.65); letter-spacing:0; }
.page-hukum .caption-narasi { max-width:680px; }
.page-hukum .hukum-public-content { width:min(1100px,calc(100% - 48px)); max-width:1100px; margin:100vh auto 0; padding:2rem 0 4rem; }
.hukum-catalog-heading { margin:0 auto 24px; text-align:center; }
.hukum-catalog-eyebrow { display:inline-block; margin-bottom:7px; color:#e8a0ad; font-size:.76rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.hukum-catalog-heading h2 { margin:0; color:#fff; font-size:clamp(1.55rem,3vw,2rem); line-height:1.3; }
.hukum-catalog-heading p { margin:8px 0 0; color:rgba(255,255,255,.72); }
.page-hukum .hukum-public-filters { display:grid; grid-template-columns:minmax(220px,2fr) repeat(2,minmax(140px,1fr)) auto; gap:14px; align-items:end; margin:0 0 28px; padding:18px; border-color:rgba(184,50,75,.2); }
.page-hukum .hukum-public-filters label { min-width:0; gap:7px; color:rgba(255,255,255,.78); font-size:.8rem; font-weight:600; letter-spacing:.025em; }
.page-hukum .hukum-public-filters input,
.page-hukum .hukum-public-filters select { width:100%; min-height:46px; padding:10px 12px; border:1px solid rgba(255,255,255,.17); border-radius:9px; color:#fff; background:rgba(8,13,20,.58); font:inherit; font-size:.92rem; }
.page-hukum .hukum-public-filters input::placeholder { color:rgba(255,255,255,.48); }
.page-hukum .hukum-public-filters input:focus,
.page-hukum .hukum-public-filters select:focus { outline:none; border-color:var(--biru-primary); box-shadow:0 0 0 3px rgba(184,50,75,.16); }
.hukum-filter-submit { display:inline-flex; min-height:46px; align-items:center; justify-content:center; gap:8px; padding:0 19px; border:1px solid var(--biru-primary); border-radius:10px; color:#fff; background:var(--biru-primary); font:inherit; font-weight:600; cursor:pointer; transition:transform .2s ease,background .2s ease,box-shadow .2s ease; }
.hukum-filter-submit:hover { transform:translateY(-2px); background:#a92d45; box-shadow:0 8px 20px rgba(184,50,75,.24); }
.page-hukum .hukum-public-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; align-items:stretch; }
.page-hukum .hukum-public-card { display:flex; min-width:0; min-height:270px; flex-direction:column; padding:22px; border:1px solid rgba(184,50,75,.2); border-radius:16px; background:rgba(10,20,30,.4); box-shadow:0 10px 25px rgba(0,0,0,.2); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); transition:transform .24s ease,border-color .24s ease,background .24s ease,box-shadow .24s ease; }
.page-hukum .hukum-public-card:hover { transform:translateY(-4px); border-color:rgba(184,50,75,.48); background:rgba(15,30,45,.5); box-shadow:0 15px 30px rgba(184,50,75,.16); }
.hukum-public-card-top { align-items:center; }
.hukum-public-badge, .hukum-public-scope { display:inline-flex; align-items:center; min-height:27px; padding:4px 10px; border-radius:999px; font-size:.72rem; font-weight:700; letter-spacing:.06em; }
.hukum-public-badge { color:#f1b3be; background:rgba(184,50,75,.16); }
.hukum-public-scope { color:rgba(255,255,255,.76); background:rgba(255,255,255,.08); }
.hukum-public-card-body { flex:1; }
.page-hukum .hukum-public-card h2 { margin:16px 0 9px; font-size:1.22rem; line-height:1.42; overflow-wrap:anywhere; }
.page-hukum .hukum-public-card p { margin:0 0 10px; color:rgba(255,255,255,.72); font-size:.92rem; line-height:1.65; overflow-wrap:anywhere; }
.page-hukum .hukum-public-card p.hukum-public-muted { color:rgba(255,255,255,.53); font-size:.84rem; }
.hukum-public-card-link { display:inline-flex; width:fit-content; align-items:center; gap:9px; margin-top:16px; padding:9px 14px; border:1px solid rgba(184,50,75,.72); border-radius:999px; color:#fff; background:rgba(184,50,75,.82); font-size:.86rem; font-weight:600; text-decoration:none; transition:gap .2s ease,background .2s ease,transform .2s ease; }
.hukum-public-card-link:hover { gap:13px; transform:translateY(-1px); background:#a92d45; }
.hukum-public-card-link:focus-visible, .hukum-filter-submit:focus-visible { outline:3px solid rgba(255,255,255,.8); outline-offset:3px; }
.page-hukum .hukum-public-empty { margin:0; }

@media (max-width:900px) {
    .page-hukum .hukum-public-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .page-hukum .hukum-public-filters { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .page-hukum .hukum-public-filters label:first-child { grid-column:1/-1; }
}

@media (max-width:600px) {
    .page-hukum .hero-caption { min-height:92svh; }
    .page-hukum .caption-title { font-size:clamp(2rem,9vw,2.7rem); line-height:1.12; }
    .page-hukum .caption-narasi { max-width:34rem; margin:1rem auto 0; font-size:.96rem; line-height:1.6; }
    .page-hukum .hukum-public-content { width:calc(100% - 32px); padding:1.5rem 0 3rem; }
    .hukum-catalog-heading { margin-bottom:19px; }
    .hukum-catalog-heading h2 { font-size:1.42rem; }
    .hukum-catalog-heading p { max-width:32rem; margin:7px auto 0; font-size:.88rem; line-height:1.55; }
    .page-hukum .hukum-public-filters { grid-template-columns:minmax(0,1fr); gap:11px; margin-bottom:20px; padding:14px; border-radius:14px; }
    .page-hukum .hukum-public-filters label:first-child { grid-column:auto; }
    .page-hukum .hukum-public-filters label { font-size:.76rem; }
    .page-hukum .hukum-public-filters input,
    .page-hukum .hukum-public-filters select { min-height:44px; font-size:.88rem; }
    .hukum-filter-submit { width:100%; min-height:44px; font-size:.88rem; }
    .page-hukum .hukum-public-grid { grid-template-columns:minmax(0,1fr); gap:14px; }
    .page-hukum .hukum-public-card { min-height:0; padding:18px; border-radius:14px; }
    .page-hukum .hukum-public-card h2 { margin:13px 0 7px; font-size:1.08rem; line-height:1.4; }
    .page-hukum .hukum-public-card p { margin-bottom:8px; font-size:.86rem; line-height:1.58; }
    .hukum-public-card-link { margin-top:12px; padding:8px 12px; font-size:.82rem; }
    .page-hukum-detail .hukum-chapter { margin:16px 0; }
    .page-hukum-detail .hukum-pasal { padding:18px 0; line-height:1.75; }
    .page-hukum-detail .hukum-pasal h3 { margin-bottom:12px; font-size:1.03rem; line-height:1.5; }
    .page-hukum-detail .hukum-pasal > div:not(.hukum-pasal-tools) { font-size:.92rem; line-height:1.75; }
    .hukum-pasal-tools { gap:10px; margin-top:16px; }
    .hukum-pasal-toggle summary { min-height:38px; padding:8px 13px; font-size:.84rem; }
    .hukum-pasal-explanation-content > div { padding-right:8px; padding-left:12px; line-height:1.7; }
}

@media (prefers-reduced-motion:reduce) {
    .page-hukum .hukum-public-card, .hukum-filter-submit, .hukum-public-card-link { transition:none; }
}