/* Poppins di-host sendiri (subset latin, lisensi OFL) — tanpa koneksi ke Google Fonts */
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url(font/poppins-400.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url(font/poppins-500.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(font/poppins-600.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(font/poppins-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Situs web publik PKBM Tumbuh Kembang — palet oranye-krem (warna-pkbm-
   tumbuh-kembang.md). Mobile dulu; satu tombol oranye per tampilan layar. */
:root{--aksen:#d97757;--aksen-gelap:#c2603f;--aksen-rgb:217,119,87;--aksen-tipis:var(--aksen-tipis);--aksen-ikon:var(--aksen-ikon);--aksen-garis:var(--aksen-garis);--aksen-teks:var(--aksen-teks);--aksen-pudar:var(--aksen-pudar);--teks:#141413;--latar:#faf9f5;--abu:#b0aea5;--abu-terang:#e8e6dc;--biru:#6a9bcc;--hijau:#788c5d;--mut:#6b6960;--kartu:#fff;--bilah-latar:#2a1a14;--bilah-latar-hp:rgba(12,12,11,.94);--bilah-teks:#fff;--bilah-tautan:#e8e6dc;--bilah-redup:#b0aea5;--bilah-garis:rgba(255,255,255,.14);--bilah-hover:rgba(255,255,255,.1);--bilah-bayang:0 12px 34px rgba(20,20,19,.28),inset 0 1px 0 rgba(255,255,255,.08);--footer-atas:#2a1a14;--footer-tengah:#141413;--footer-bawah:#0e0e0d;--gelap-latar:#141413;--krem:#f3f0e8;--hero-teks:#e8e6dc;--footer-teks:#e8e6dc;--setara-latar:#e6ebdc;--setara-teks:#3f4d2b;--info-latar:#fff8ec;--info-garis:#f5dfae;--pita-teks:#fde9df;--ok-latar:#f1f4ea;--ok-garis:#c5d1ad;--ok-teks:#3f4d2b;--isian-latar:#fcfbf8;--media-latar:#0b5d2e;--gelap-mata:#f0a98c;--hero-mata:#f0b9a2;--sbilah-latar:var(--bilah-latar);--sbilah-latar-hp:var(--bilah-latar-hp);--sbilah-teks:var(--bilah-teks);--sbilah-tautan:var(--bilah-tautan);--sbilah-redup:var(--bilah-redup);--sbilah-garis:var(--bilah-garis);--sbilah-hover:var(--bilah-hover);--sbilah-bayang:var(--bilah-bayang);--sbilah-awal:var(--sbilah-latar);--sbilah-akhir:var(--sbilah-latar)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
[id]{scroll-margin-top:calc(var(--nav-h,72px) + 12px)}
body{margin:0;background:var(--latar);color:var(--teks);font:16px/1.65 'Poppins',system-ui,-apple-system,sans-serif}
a{color:var(--aksen-gelap);text-decoration:none}
img{max-width:100%;display:block}
.wadah{width:min(1120px,100% - 40px);margin-inline:auto}
h1,h2,h3{line-height:1.15;margin:0 0 .4em;letter-spacing:-.01em}
h1{font-size:clamp(30px,5.2vw,52px);font-weight:700}
h2{font-size:clamp(24px,3.4vw,36px);font-weight:700}
h3{font-size:18px;font-weight:600}
p{margin:0 0 1em}
.mata{display:inline-block;font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--aksen-gelap);margin-bottom:10px}
.tombol{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:12px;background:var(--aksen);color:#fff;font-weight:600;font-size:15px;border:0;cursor:pointer;font-family:inherit;transition:background .15s,transform .15s}
.tombol:hover{background:var(--aksen-gelap);transform:translateY(-1px)}
.tombol.garis{background:transparent;color:var(--teks);border:2px solid var(--abu-terang)}
.tombol.garis:hover{background:#fff;border-color:var(--abu)}
.tombol.wa{background:#25d366;color:#fff}
.tombol.wa:hover{background:#1ebe5b}
.tombol.gelap{background:var(--teks)}
.tombol.gelap:hover{background:#000}
.tombol svg{width:18px;height:18px}

/* ---------- navigasi ---------- */
.nav{position:sticky;top:10px;z-index:40;margin:10px 16px 0;border-radius:16px;background:var(--sbilah-latar);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%);border:1px solid var(--sbilah-garis);box-shadow:var(--sbilah-bayang);color:var(--sbilah-teks)}
.nav .wadah{width:auto;padding:0 8px 0 16px}
.nav .wadah{display:flex;align-items:center;gap:14px;min-height:62px}
.nav .merek{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--sbilah-teks);font-size:16px;white-space:nowrap;flex:none}
.nav .merek img{width:40px;height:40px}
.nav .merek small{display:block;font-weight:500;font-size:11px;color:var(--sbilah-redup);letter-spacing:.06em;text-transform:uppercase}
.nav nav{margin-left:auto;display:flex;align-items:center;gap:4px;white-space:nowrap}
/* Baris info di atas bilah (sekolah): alamat · WA · jam · sosmed. Tersembunyi ≤960 px. */
.info-atas{background:var(--footer-bawah);color:rgba(255,255,255,.82);font-size:12.5px;position:relative;z-index:41}
.info-atas .wadah{display:flex;align-items:center;gap:22px;min-height:34px;width:auto;margin:0 16px;padding:0 16px}   /* sejajar tepi bilah, bukan isi (Apink 18 Sep) */
.info-atas .info-item{display:inline-flex;align-items:center;gap:6px;color:inherit;white-space:nowrap}
.info-atas a.info-item:hover{color:#fff}
.info-atas .info-sos{margin-left:auto;display:flex;gap:4px}
.info-atas .info-sos a{display:inline-flex;width:26px;height:26px;align-items:center;justify-content:center;border-radius:7px;color:inherit}
.info-atas .info-sos a:hover{background:rgba(255,255,255,.14);color:#fff}
.info-atas .info-sos svg{width:14px;height:14px}
body:has(.hero-video) .info-atas{background:rgba(7,26,54,.55)}   /* di atas video hero: setengah tembus pandang; halaman tanpa hero: pekat */
/* Baris info bening (sekolah, 17 Sep 2026): tanpa latar; teks navy di halaman polos, putih di halaman ber-hero (beranda, lembaga, SPMB, program). */
.info-atas.bening,body:has(.hero-video) .info-atas.bening{background:transparent;color:var(--teks)}
.info-atas.bening a.info-item:hover{color:var(--aksen)}
.info-atas.bening .info-sos a:hover{background:rgba(var(--aksen-rgb),.12);color:var(--aksen)}
body:has(.hero) .info-atas.bening{color:rgba(255,255,255,.88)}
body:has(.hero) .info-atas.bening a.info-item:hover,body:has(.hero) .info-atas.bening .info-sos a:hover{color:#fff;background:rgba(255,255,255,.14)}
/* Dropdown menu bilah: <details.turun> */
.nav nav details.turun{position:relative;background:transparent;color:inherit;border:0;border-radius:0;padding:0;margin:0}
.nav nav details.turun summary::after,.nav nav details.turun summary::before{content:none}
.nav nav details.turun summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:3px;padding:8px 10px 8px 12px;border-radius:9px;color:var(--sbilah-tautan);font-weight:500;font-size:14.5px;-webkit-user-select:none;user-select:none}
.nav nav details.turun summary::-webkit-details-marker{display:none}
.nav nav details.turun summary .cev{width:14px;height:14px;transition:transform .2s}
.nav nav details.turun[open] summary .cev{transform:rotate(180deg)}
.nav nav details.turun summary:hover,.nav nav details.turun[open] summary,.nav nav details.turun summary.on{background:var(--sbilah-hover);color:var(--sbilah-teks)}
.nav nav details.turun .isi{position:absolute;left:0;top:calc(100% + 10px);min-width:230px;background:var(--sbilah-latar);border:1px solid var(--sbilah-garis);border-radius:12px;padding:8px;box-shadow:var(--sbilah-bayang);display:flex;flex-direction:column;gap:2px;animation:turun .18s ease-out}
.nav nav details.turun .isi a{display:flex;align-items:baseline;gap:6px;padding:9px 12px;white-space:nowrap}
.nav nav details.turun .isi a small{font-size:12px;color:var(--sbilah-redup);font-weight:400}
.nav nav details.turun .isi a.lain{border-top:1px solid var(--sbilah-garis);margin-top:4px;padding-top:11px;border-radius:0 0 9px 9px}
.nav.bening:not(.terisi) nav details.turun summary{color:#fff}
.nav.bening:not(.terisi) nav details.turun summary:hover,.nav.bening:not(.terisi) nav details.turun[open] summary{background:rgba(255,255,255,.14)}
.nav.bening:not(.terisi) nav details.turun .isi{background:var(--sbilah-akhir)}
@media (max-width:1180px){.nav nav details.turun summary{padding:8px 7px 8px 9px;font-size:14px}.nav nav a.ke-beranda{display:none}.nav nav:has(details.turun){gap:2px}}
@media (max-width:1180px){.nav .merek small{display:none}.nav nav a{padding:8px 9px;font-size:14px}}
@media (max-width:900px){.nav .merek span{font-size:14px}.nav nav a.tombol{padding:0 12px}}
.nav nav a{padding:8px 12px;border-radius:9px;color:var(--sbilah-tautan);font-weight:500;font-size:14.5px}
.nav nav a:hover,.nav nav a.on{background:var(--sbilah-hover);color:var(--sbilah-teks)}
.nav nav a.tombol{background:var(--cta-nav,var(--aksen));color:var(--cta-nav-teks,#fff);min-height:40px;padding:0 16px;margin-left:6px}   /* tombol Daftar di bilah: warna kontras terhadap bilah (sekolah kuning emas, Apink 18 Sep) */
.nav nav a.tombol:hover{background:var(--cta-nav-hover,var(--aksen-gelap));color:var(--cta-nav-teks,#fff)}
.nav .buka{display:none;margin-left:auto;width:44px;height:44px;padding:0;border:0;background:transparent;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px}
.nav .buka span{display:block;width:22px;height:2px;background:var(--sbilah-teks);margin:0;border-radius:2px;transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .2s}
#menu-hp:checked ~ .buka span:nth-child(1){transform:translateY(7px) rotate(45deg)}
#menu-hp:checked ~ .buka span:nth-child(2){opacity:0;transform:scaleX(0)}
#menu-hp:checked ~ .buka span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
#menu-hp{display:none}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;padding:56px 0 48px;background:
  radial-gradient(520px 320px at 88% 8%,rgba(var(--aksen-rgb),.16),transparent 70%),
  radial-gradient(420px 320px at 8% 100%,rgba(106,155,204,.14),transparent 70%),var(--latar)}
.hero .wadah{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;position:relative;z-index:2}
.hero-video{min-height:min(84vh,880px);margin-top:calc(-1 * var(--nav-h,72px));padding-top:calc(56px + var(--nav-h,72px));display:flex;align-items:center;background:var(--gelap-latar) url(hero-poster.jpg) center/cover no-repeat;color:#faf9f5}
.hero-video .latar-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero-video .lapis{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(20,20,19,.82) 0%,rgba(20,20,19,.62) 55%,rgba(20,20,19,.35) 100%)}
.hero-video .mata{color:var(--hero-mata)}
.hero-video h1{color:#fff}
.hero.hero-video p.pengantar{color:var(--hero-teks)}
.hero-video .tombol.garis{color:#fff;border-color:rgba(255,255,255,.55)}
.hero-video .tombol.garis:hover{background:rgba(255,255,255,.12)}
.hero-video .cip span{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22);color:var(--hero-teks)}
.hero-video .cip span b{color:#fff}
.hero.hero-video .kartu-hero{background:rgba(20,20,19,.38);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.16);box-shadow:0 18px 44px rgba(0,0,0,.25)}
@media (prefers-reduced-motion:reduce){.hero-video .latar-video{display:none}}
.hero p.pengantar{font-size:18px;color:var(--mut);max-width:560px}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.hero .cip{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.hero .cip .hp-sembunyi{font-style:normal}
/* Hero dua slide (sekolah): hanya blok teks yang bergeser, latar video diam. */
.hero-video:has(.geser){padding-top:calc(28px + var(--nav-h,72px));padding-bottom:40px}
.hero .wadah:has(.geser){display:flex;align-items:stretch;align-self:stretch;min-height:calc(min(84vh,880px) - 28px - 40px - var(--nav-h,72px))}
.hero .geser{position:relative;overflow:hidden;max-width:680px;flex:1;display:flex;flex-direction:column}
.hero .geser .rel{display:flex;flex:1;transition:transform .6s cubic-bezier(.4,0,.2,1);will-change:transform}
.hero .geser .slide{flex:0 0 100%;min-width:100%;max-width:100%;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-start;padding:4px 8px 0 0;box-sizing:border-box}
.hero .geser .cta{margin-top:auto;padding-top:40px}   /* teks di atas, tombol menempel bawah: tengah longgar (Apink 16 Sep) */
.hero .geser p.pengantar.singkat{font-size:20px;max-width:520px}
.hero .geser .titik{display:flex;gap:8px;margin-top:28px}
.hero .geser .titik button{width:28px;height:6px;border-radius:999px;border:0;padding:0;background:rgba(255,255,255,.35);cursor:pointer;transition:background .2s,width .2s}
.hero .geser .titik button.on{background:#fff;width:44px}
.hero .geser .titik button:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media (prefers-reduced-motion:reduce){.hero .geser .rel{transition:none}}
.cip span{background:#fff;border:1px solid var(--abu-terang);border-radius:9px;padding:6px 12px;font-size:13px;font-weight:500;color:var(--mut)}
.cip span b{color:var(--teks)}
.hero .kartu-hero{background:var(--teks);color:#faf9f5;border-radius:24px;padding:28px;box-shadow:0 24px 60px rgba(20,20,19,.22);position:relative}
.hero .kartu-hero img{width:64px;height:64px;margin-bottom:14px}
.hero .kartu-hero h3{color:#fff;font-size:20px}
.hero .kartu-hero ul{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:10px}
.hero .kartu-hero li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;color:var(--hero-teks)}
.hero .kartu-hero li::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--aksen);margin-top:9px}
.hero .kartu-hero .npsn{position:absolute;top:22px;right:24px;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--abu)}

/* ---------- bagian umum ---------- */
.bagian{padding:64px 0}
.bagian.krem{background:var(--krem)}
.bagian.gelap{background:var(--gelap-latar);color:#faf9f5}
.bagian.gelap h2,.bagian.gelap h3{color:#fff}
.bagian.gelap .mata{color:var(--gelap-mata)}
.kepala-bagian{max-width:640px;margin-bottom:32px}
.kepala-bagian p{color:var(--mut);font-size:17px}
.bagian.gelap .kepala-bagian p{color:var(--abu)}
.grid{display:grid;gap:18px}
.grid.dua{grid-template-columns:repeat(2,1fr)}
.grid.tiga{grid-template-columns:repeat(3,1fr)}
.grid.empat{grid-template-columns:repeat(4,1fr)}
.grid.kabar{grid-template-columns:1.4fr 1fr;align-items:start}
.kartu{background:var(--kartu);border:1px solid var(--abu-terang);border-radius:18px;padding:24px;color:inherit;transition:transform .15s,box-shadow .15s}
a.kartu:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(20,20,19,.08)}
.kartu .ikon{width:46px;height:46px;border-radius:12px;background:var(--aksen-ikon);color:var(--aksen-gelap);display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.kartu .ikon svg{width:24px;height:24px}
.kartu p{color:var(--mut);font-size:15px;margin:0}

/* angka fakta */
.angka{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:18px}   /* 4 atau 5 kartu (tahun berdiri) */
.angka div{text-align:center;padding:22px 10px;border-radius:18px;background:#fff;border:1px solid var(--abu-terang)}
.angka b{display:block;font-size:clamp(30px,4vw,44px);font-weight:700;color:var(--aksen-gelap);line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.angka span{font-size:13.5px;color:var(--mut);font-weight:500}

/* program */
.program .kartu{position:relative;overflow:hidden;padding-top:28px}
.program .huruf{position:absolute;right:16px;top:8px;font-size:84px;font-weight:700;color:var(--aksen-pudar);line-height:1;letter-spacing:-.05em}
.program h3{font-size:22px;position:relative}
.program .setara{display:inline-block;background:var(--setara-latar);color:var(--setara-teks);border-radius:9px;padding:3px 10px;font-size:12.5px;font-weight:600;margin-bottom:12px;position:relative}
.program ul{margin:12px 0 0;padding-left:18px;color:var(--mut);font-size:15px;position:relative}
.program li{margin-bottom:4px}

/* berita */
.berita-kartu{display:flex;flex-direction:column;overflow:hidden;padding:0}
.berita-kartu .sampul{aspect-ratio:16/9;background:linear-gradient(135deg,var(--aksen-ikon),var(--abu-terang));overflow:hidden}
.berita-kartu .sampul img{width:100%;height:100%;object-fit:cover}
.berita-kartu .isi{padding:18px 20px 22px}
.berita-kartu time{font-size:12.5px;color:var(--mut);font-weight:500}
.berita-kartu h3{margin:6px 0 8px;font-size:17px}
.berita-kartu p{font-size:14.5px}

/* agenda */
.agenda{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.agenda-bulan{font-size:18px;margin:26px 0 10px;color:var(--aksen-gelap)}
.agenda-bulan:first-of-type{margin-top:4px}
.agenda-jenis{display:inline-block;font-size:11.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--mut);background:var(--abu-terang);border-radius:6px;padding:1px 7px;margin-left:6px;vertical-align:1px}
.agenda-desk{margin-top:4px}
.agenda li{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid var(--abu-terang);border-radius:14px;padding:12px 16px}
.agenda li.klik{cursor:pointer;transition:border-color .15s,transform .15s}.agenda li.klik:hover{border-color:var(--aksen);transform:translateY(-1px)}.agenda .pil-daftar{margin-left:auto;flex:none;font-size:12.5px;font-weight:600;color:#fff;background:var(--aksen);padding:6px 11px;border-radius:999px}
.agenda .tgl{flex:none;width:58px;text-align:center;background:var(--teks);color:#fff;border-radius:10px;padding:6px 0;line-height:1.1}
.agenda .tgl b{display:block;font-size:20px}
.agenda .tgl small{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--abu)}
.agenda .ket{font-size:13.5px;color:var(--mut)}
.pengumuman-kotak{background:var(--info-latar);border:1px solid var(--info-garis);border-radius:14px;padding:16px 18px;margin-bottom:12px}
.pengumuman-kotak b{display:block;margin-bottom:4px}
.pengumuman-kotak p{font-size:14.5px;margin:0;white-space:pre-line}

/* galeri */
.galeri{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.galeri a{display:block;aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:var(--abu-terang);position:relative}
.galeri img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.galeri a:hover img{transform:scale(1.04)}
.galeri span{position:absolute;left:0;right:0;bottom:0;padding:22px 12px 10px;font-size:12.5px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.6))}

/* mitra & faq */
.mitra{display:flex;flex-wrap:wrap;gap:10px}
.mitra span{background:#fff;border:1px solid var(--abu-terang);border-radius:99px;padding:8px 16px;font-size:14px;font-weight:500}
details{background:#fff;color:var(--teks);border:1px solid var(--abu-terang);border-radius:14px;padding:0 20px;margin-bottom:10px}
summary{cursor:pointer;font-weight:600;padding:16px 0;list-style:none;display:flex;justify-content:space-between;gap:12px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--aksen);font-size:22px;line-height:1}
details[open] summary::after{content:"−"}
details p{color:var(--mut);padding-bottom:16px;margin:0;font-size:15px}

/* pilihan sekali ketuk — pola bersama yayasan (kepegawaian .pilihjenis/.pilihan/.lipat),
   pengganti <select> bawaan yang di iOS butuh tiga ketukan. Ukuran ikut aslinya. */
.pilihjenis{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pilihjenis label{display:flex;flex-direction:column;gap:1px;justify-content:center;border:1.8px solid var(--abu-terang);border-radius:11px;background:#fff;padding:9px 11px;min-height:56px;cursor:pointer;user-select:none;margin:0;font-weight:400;font-size:inherit}
.pilihjenis label:hover{border-color:var(--aksen)}
.pilihjenis input{position:absolute;opacity:0;width:0;height:0;min-height:0}
.pilihjenis .nm{font-size:14px;font-weight:500;line-height:1.3;color:var(--teks)}
.pilihjenis .hr{font-size:12px;color:var(--mut);line-height:1.3}
.pilihjenis label:has(input:checked){border-color:var(--aksen);background:var(--aksen-tipis)}
.pilihjenis label:has(input:checked) .nm{color:var(--aksen-gelap);font-weight:600}
.pilihjenis label:has(input:checked) .hr{color:var(--aksen-gelap);opacity:.75}
.pilihjenis label:has(input:focus-visible){outline:2px solid var(--aksen);outline-offset:2px}
.pilihjenis label.lebar{grid-column:1/-1}
/* Borang SPMB (16 Sep 2026): pilihan tingkat & tahun ajaran — nama + keterangan kecil, 3 kolom di desktop */
.pilihjenis.tingkat,.pilihjenis.ta{grid-template-columns:repeat(3,1fr)}
.pilihjenis.ta{grid-template-columns:repeat(4,1fr)}
.pilihjenis.tingkat label,.pilihjenis.ta label{min-height:54px;padding:8px 10px}
.pilihjenis .nm{font-size:14.5px}
.pilihjenis .hr{font-size:12px;letter-spacing:.01em}
.borang .ta-lain{display:none;margin-top:10px}
.borang .pilihjenis.ta:has(input[value=lainnya]:checked)+.ta-lain{display:block}
.borang .pilihjenis+*:not(.ta-lain),.borang .pilihan+*,.borang .ta-lain+*,.borang .baris+*,.borang .ta-lain{margin-top:14px}   /* jarak seragam antar kelompok isian */
.pilihan{display:flex;gap:9px;flex-wrap:wrap}
.pilihan label{flex:1;min-width:110px;margin:0;border:1.8px solid var(--abu-terang);border-radius:9px;padding:9px 12px;min-height:46px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;font-weight:500;color:var(--teks);text-align:center;background:#fff}
.pilihan input{position:absolute;opacity:0;width:0;height:0;min-height:0}
.pilihan label:has(input:checked){background:var(--aksen);border-color:var(--aksen);color:#fff}
.pilihan label:has(input:focus-visible){outline:2px solid var(--aksen);outline-offset:2px}
.lipat{border:1.8px solid var(--abu-terang);border-radius:11px;background:#fff}
.lipat>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 13px;min-height:46px;cursor:pointer;list-style:none;font-size:14.5px;font-weight:400}
.lipat>summary::-webkit-details-marker{display:none}
.lipat>summary::after{content:"";flex:0 0 auto;width:8px;height:8px;margin-right:4px;border-right:2px solid var(--mut);border-bottom:2px solid var(--mut);transform:rotate(45deg) translateY(-2px)}
.lipat[open]>summary::after{transform:rotate(225deg) translateY(2px)}
.lipat[open]>summary{border-bottom:1px solid var(--abu-terang)}
.lipat .lipat-nilai{color:var(--mut);text-align:right;line-height:1.35}
.lipat.terisi .lipat-nilai{color:var(--aksen-gelap);font-weight:600}
.lipat .pilihjenis{padding:10px}

/* pita ajakan */
.pita{background:linear-gradient(135deg,var(--aksen),var(--aksen-gelap));color:#fff;border-radius:24px;padding:40px;display:flex;gap:24px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.pita h2{color:#fff;margin:0 0 6px}
.pita p{margin:0;color:var(--pita-teks);max-width:520px}
.pita .tombol{background:#fff;color:var(--aksen-gelap)}
.pita .tombol:hover{background:var(--aksen-ikon)}

/* kontak */
.kontak{display:grid;grid-template-columns:1.1fr .9fr;gap:24px}
.kontak dl{margin:0;display:grid;grid-template-columns:110px 1fr;gap:8px 12px;font-size:15px}
.kontak dt{color:var(--mut);font-weight:500}
.kontak dd{margin:0}

/* borang daftar & halaman dalam */
.halaman-dalam{padding:48px 0 64px}
.halaman-dalam .isi-berita{max-width:760px;font-size:17px}
.halaman-dalam .isi-berita img{border-radius:18px;margin:0 0 24px}
.borang{background:#fff;border:1px solid var(--abu-terang);border-radius:20px;padding:28px;max-width:720px}
.borang .baris{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 16px}
.borang .baris .lebar{grid-column:1/-1}
.borang label{display:block;font-size:13px;font-weight:600;margin-bottom:5px}
.borang .pilihjenis label{display:flex;margin:0;font-size:inherit;font-weight:400}.borang .pilihan input,.borang .pilihjenis input{position:absolute;opacity:0;width:0;height:0;min-height:0;padding:0;border:0}   /* .borang input{width:100%} sama spesifisitasnya dan ditulis belakangan → radio tersembunyi melebar 375 px (SPMB sekolah, 15 Sep) */.borang .pilihan label{display:flex;margin:0;font-size:14px;font-weight:500}.borang .lipat summary{font-size:14.5px}
.borang input,.borang select,.borang textarea{width:100%;min-height:46px;padding:10px 13px;border:1px solid var(--abu-terang);border-radius:11px;font:inherit;font-size:15px;background:var(--isian-latar);color:var(--teks)}
.borang textarea{min-height:90px;resize:vertical}
.borang input:focus,.borang select:focus,.borang textarea:focus{outline:0;border-color:var(--aksen);box-shadow:0 0 0 3px rgba(var(--aksen-rgb),.16);background:#fff}
.borang .pernyataan{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border:1px solid var(--abu-terang);border-radius:12px;background:var(--isian-latar);font-size:14.5px;font-weight:400;line-height:1.55;cursor:pointer;margin:0}
.borang .pernyataan:has(input:checked){border-color:var(--aksen);background:var(--aksen-tipis)}
.borang .pernyataan input{width:22px;min-width:22px;height:22px;min-height:0;margin:3px 0 0;padding:0;accent-color:var(--aksen);cursor:pointer}
.borang .pernyataan b{font-weight:600}
.borang .salah{color:#b91c1c;font-size:12.5px;display:block;margin-top:4px}
.pesan{border-radius:14px;padding:14px 16px;margin-bottom:18px;font-size:15px;border:1px solid}
.pesan.ok{background:var(--ok-latar);border-color:var(--ok-garis);color:var(--ok-teks)}
.pesan.err{background:#fef2f2;border-color:#fecaca;color:#b91c1c}
.halaman-nomor{display:flex;gap:6px;flex-wrap:wrap;margin-top:24px}
.halaman-nomor a,.halaman-nomor span{min-width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;border:1px solid var(--abu-terang);background:#fff;padding:0 10px;font-size:14px}
.halaman-nomor .on{background:var(--aksen);color:#fff;border-color:var(--aksen)}

/* footer */
footer{color:var(--abu);padding:52px 0 28px;font-size:14px;margin:56px 16px 0;border-radius:28px 28px 0 0;position:relative;overflow:hidden;
  background:radial-gradient(900px 320px at 50% -60px,rgba(var(--aksen-rgb),.55),rgba(var(--aksen-rgb),.12) 45%,transparent 70%),linear-gradient(180deg,var(--footer-atas) 0%,var(--footer-tengah) 38%,var(--footer-bawah) 100%)}
footer::before{content:"";position:absolute;inset:0;border-radius:inherit;border:1px solid rgba(255,255,255,.08);pointer-events:none}
footer .kepala-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:34px;position:relative}
footer .merek{display:flex;align-items:center;gap:14px}
footer .merek img{width:48px;height:48px;object-fit:contain}
footer .merek b{display:block;color:#fff;font-size:19px;letter-spacing:.2px}
footer .merek span{display:block;color:var(--footer-teks);font-size:13.5px;margin-top:2px}
footer .sosmed{display:flex;gap:10px}
footer .sosmed a{width:44px;height:44px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#fff;transition:background .15s,transform .15s,border-color .15s}
footer .sosmed a:hover{background:var(--aksen);border-color:var(--aksen);transform:translateY(-2px)}
footer .sosmed svg{width:22px;height:22px}
footer .kolom{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:28px;margin-bottom:28px}
footer h4{color:#fff;font-size:14px;margin:0 0 10px;letter-spacing:.08em;text-transform:uppercase}
footer a{color:var(--footer-teks)}
footer a:hover{color:#fff}
footer ul{list-style:none;padding:0;margin:0;display:grid;gap:6px}
footer .bawah{border-top:1px solid rgba(255,255,255,.12);padding-top:18px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px}
footer .pengunjung{display:inline-flex;align-items:center;gap:6px;opacity:.85}footer .pengunjung svg{width:16px;height:16px}footer .pengunjung b{font-weight:600;color:#fff}
.wa-melayang{position:fixed;right:18px;bottom:18px;z-index:50;width:56px;height:56px;border-radius:50%;background:#25d366;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px rgba(37,211,102,.4)}
.wa-melayang svg{width:30px;height:30px;fill:#fff}

@media (max-width:900px){
  .hero .wadah{grid-template-columns:minmax(0,1fr)}
  .hero .wadah>*{min-width:0}
  .hero .kartu-hero{display:none}
  .hero-video{min-height:min(74vh,560px);padding-top:calc(36px + var(--nav-h,70px))}
  .grid.tiga,.grid.empat{grid-template-columns:repeat(2,1fr)}
  .angka{grid-template-columns:repeat(2,1fr)}
  .angka div:last-child:nth-child(odd){grid-column:1/-1}   /* kartu ganjil terakhir melebar, tidak menyendiri di kiri (21 Sep 2026) */
  .angka div:nth-child(5):last-child{grid-column:1/-1}   /* kartu ke-5 (tahun berdiri) melebar penuh di HP */
  .kontak{grid-template-columns:1fr}
  footer .kolom{grid-template-columns:1fr 1fr}
}
@media (max-width:960px){
  .nav{margin:8px 8px 0;top:8px;border-radius:14px}
  .nav nav{display:none;position:absolute;left:0;right:0;top:calc(100% + 8px);background:var(--sbilah-latar-hp);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--sbilah-garis);border-radius:14px;flex-direction:column;align-items:stretch;padding:10px 12px 14px;gap:2px;box-shadow:0 16px 40px rgba(20,20,19,.35)}
  .nav nav a{padding:12px;font-size:16px}
  .nav nav a.tombol{margin:8px 0 0}
  #menu-hp:checked ~ nav{display:flex;animation:turun .22s ease-out}
  @keyframes turun{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
  .nav .buka{display:flex}
  .nav .wadah{padding:0 6px 0 16px}
  .info-atas{display:none}
  .nav nav a.ke-beranda{display:block}
  .nav nav details.turun summary{display:flex;justify-content:space-between;padding:12px;font-size:16px}
  .nav nav details.turun .isi{position:static;min-width:0;background:rgba(255,255,255,.06);border:0;box-shadow:none;padding:4px 6px 8px 18px;animation:none}
  .nav nav details.turun .isi a{padding:10px 12px;white-space:normal}
  .nav nav details.turun .isi a.lain{border-radius:0}
}
@media (max-width:640px){
  body{font-size:15.5px}
  .wadah{width:min(1120px,100% - 32px)}
  .hero{padding:36px 0 32px}
  .hero.hero-video{padding-top:calc(28px + var(--nav-h,70px));padding-bottom:36px;min-height:0}
  .hero h1{margin-bottom:.2em}
  .hero p.pengantar{font-size:16.5px;line-height:1.55}
  .hero .cta{gap:10px;flex-wrap:nowrap;margin-top:12px}
  .hero-video .lapis{background:linear-gradient(180deg,rgba(20,20,19,.78) 0%,rgba(20,20,19,.62) 54%,rgba(20,20,19,.22) 64%,rgba(20,20,19,.58) 72%,rgba(20,20,19,.72) 100%)}
  .hero .cta .tombol{flex:1 1 0;padding:0 12px;font-size:14.5px;white-space:nowrap}
  .hero .cip{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:76px}
  .hero .geser .cip{margin-top:18px}
  .hero .wadah:has(.geser){min-height:0}
  .hero .geser .cta{margin-top:auto;padding-top:24px}   /* HP: tombol menempel dasar slide, sejajar di kedua slide (Apink 16 Sep) */
  .hero .geser .slide{padding-top:0}
  .hero .geser .cta .tombol{flex:0 1 auto;padding:0 12px;font-size:13.5px;min-width:0}
  .hero .geser .titik{margin-top:20px}
  .hero .geser p.pengantar.singkat{font-size:17px}
  .hero .cip span{text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:6px 8px;font-size:12.5px}
  .hero .cip .hp-sembunyi{display:none}
  .bagian{padding:44px 0}
  .grid.dua,.grid.tiga,.grid.empat,.grid.kabar{grid-template-columns:1fr}
  .galeri{grid-template-columns:repeat(2,1fr)}
  .pita{padding:28px 22px}
  .borang{padding:20px}
  .pilihjenis.tingkat,.pilihjenis.ta{grid-template-columns:repeat(2,1fr)}
  .pilihjenis .nm{font-size:14px}
  .pilihjenis .hr{font-size:11.5px}
  .borang .baris{grid-template-columns:1fr}
  footer .kolom{grid-template-columns:1fr}
  footer{margin:40px 8px 0;border-radius:20px 20px 0 0}
  .program .huruf{font-size:64px}
}

/* ---------- halaman kegiatan ---------- */
.keg .keg-gambar{border-radius:24px;overflow:hidden;margin-bottom:22px;box-shadow:0 18px 44px rgba(20,20,19,.16);background:var(--media-latar)}
.keg .keg-gambar img{display:block;width:100%;height:auto}
.keg .keg-video video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--media-latar)}
.keg .keg-kolab{display:grid;grid-template-columns:auto auto auto;justify-content:start;align-items:center;gap:8px 10px;margin-bottom:14px}
.keg .keg-kolab .pihak{display:inline-flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--abu-terang);border-radius:11px;padding:5px 14px 5px 6px;font-size:13.5px;font-weight:600;color:var(--teks);line-height:1.2}
.keg .keg-kolab .pihak img{width:32px;height:32px;border-radius:7px;object-fit:contain;background:#fff}
.keg .keg-kolab .pihak b{width:32px;height:32px;border-radius:7px;background:var(--aksen);color:#fff;font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;letter-spacing:.02em}
.keg .keg-kolab .pihak.rekan{background:#fff}
@media (max-width:640px){.keg .keg-kolab{grid-template-columns:auto auto}.keg .keg-kolab .pihak:first-child{grid-column:1/-1;justify-self:start}}
.keg .keg-kolab .kali{font-size:16px;font-weight:500;color:var(--abu)}
.keg .keg-sub{font-size:clamp(17px,2.4vw,21px);color:var(--teks);font-weight:500;margin:6px 0 12px}
.keg .keg-info{display:flex;gap:10px 18px;flex-wrap:wrap;font-size:15px;color:var(--mut);margin:0}
.keg .keg-nilai{margin-top:16px;padding:14px 16px;border-radius:14px;background:var(--aksen-tipis);border:1px solid var(--aksen-garis);color:var(--aksen-teks);font-size:15px;line-height:1.5}
.keg .keg-nilai b{color:var(--aksen-gelap)}
.keg .keg-sorot{list-style:none;padding:0;margin:16px 0 0;display:grid;grid-template-columns:repeat(2,1fr);gap:8px 14px}
.keg .keg-sorot li{position:relative;padding-left:26px;font-size:15px;line-height:1.45}
.keg .keg-sorot li::before{content:"✓";position:absolute;left:0;top:0;width:18px;height:18px;border-radius:50%;background:var(--aksen);color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:3px}
@media (max-width:640px){.keg .keg-sorot{grid-template-columns:1fr}.keg .keg-gambar{border-radius:18px}}

/* ---------- halaman SPMB ---------- */
.spmb-hero{background-image:url(hero-poster.jpg)}
.tab-paket{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.tab-paket label{display:flex;align-items:center;gap:12px;background:#fff;border:2px solid var(--abu-terang);border-radius:16px;padding:14px 16px;cursor:pointer;transition:border-color .15s,transform .15s}
.tab-paket label .huruf{width:44px;height:44px;border-radius:12px;background:var(--aksen-tipis);color:var(--aksen-gelap);font-weight:800;font-size:22px;display:flex;align-items:center;justify-content:center;flex:none}
.tab-paket label b{display:block;font-size:15px}.tab-paket label small{color:var(--mut);font-size:12.5px}
.tab-paket label:hover{transform:translateY(-1px)}
#tab-A:checked ~ label[for=tab-A],#tab-B:checked ~ label[for=tab-B],#tab-C:checked ~ label[for=tab-C]{border-color:var(--aksen);background:var(--aksen-tipis)}
.tab-paket .isi-tab{display:none;grid-column:1/-1;background:#fff;border:1px solid var(--abu-terang);border-radius:20px;padding:26px;margin-top:6px}
#tab-A:checked ~ #isi-A,#tab-B:checked ~ #isi-B,#tab-C:checked ~ #isi-C{display:block}
.cek-list{list-style:none;padding:0;margin:0;display:grid;gap:8px;counter-reset:b}
.cek-list li{position:relative;padding-left:32px;counter-increment:b}.cek-list li::before{content:counter(b);position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:50%;background:var(--aksen);color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center}
.langkah-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.langkah-grid li{background:#fff;border:1px solid var(--abu-terang);border-radius:18px;padding:22px 20px;position:relative}
.langkah-grid .no{display:inline-flex;width:36px;height:36px;border-radius:50%;background:var(--teks);color:#fff;font-weight:700;align-items:center;justify-content:center;margin-bottom:12px}
.langkah-grid b{display:block;font-size:16px;margin-bottom:6px}.langkah-grid p{margin:0;color:var(--mut);font-size:14.5px}
@media (max-width:900px){.tab-paket{grid-template-columns:1fr}.langkah-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.langkah-grid{grid-template-columns:1fr}}

/* ---------- bukti / status pendaftaran ---------- */
.bukti{padding:24px}.bukti-kepala{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;flex-wrap:wrap;margin-bottom:18px}
.pil-status{font-size:12.5px;font-weight:700;padding:6px 12px;border-radius:999px;background:#fff7e0;color:#8a5a00}.pil-status.diterima{background:var(--ok-latar);color:var(--ok-teks)}.pil-status.ditolak{background:#fee2e2;color:#b91c1c}
.jejak{list-style:none;padding:0;margin:0;display:grid;gap:0}.jejak li{position:relative;padding:0 0 18px 34px}.jejak li::before{content:"";position:absolute;left:9px;top:22px;bottom:-4px;width:2px;background:var(--abu-terang)}.jejak li:last-child::before{display:none}
.jejak li::after{content:"";position:absolute;left:0;top:3px;width:20px;height:20px;border-radius:50%;border:2px solid var(--abu-terang);background:#fff}
.jejak li.sudah::after{background:var(--hijau);border-color:var(--hijau)}.jejak li.kini::after{border-color:var(--aksen);background:var(--aksen-tipis)}.jejak li.gagal::after{border-color:#dc2626;background:#fee2e2}
.jejak b{display:block;font-size:15px}.jejak small{color:var(--mut);font-size:13.5px}
.bukti-catatan{margin:8px 0 0;font-size:13.5px;color:var(--mut)}
/* Situs sekolah: kartu lembaga berlogo (pengganti huruf paket) & bagian video profil (16:9, radius 24) */
.lembaga .kartu{padding-top:24px}
.lembaga .logo-lembaga{width:64px;height:64px;object-fit:contain;display:block;margin-bottom:12px}
.lembaga .kartu h3{font-size:20px}
.video-profil{max-width:960px;margin:0 auto;border-radius:24px;overflow:hidden;background:var(--gelap-latar);box-shadow:0 18px 44px rgba(20,20,19,.18)}
.video-profil video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
@media (max-width:640px){.video-profil{border-radius:18px}.lembaga .logo-lembaga{width:52px;height:52px}}

/* Bilah bening (instans dengan situs.bilah_transparan): di atas hero tanpa latar/garis/bayangan, teks putih;
   .terisi ditambahkan JS setelah gulir 40 px → kembali ke token --bilah-*. Transisi .35 s. */
.nav.bening{transition:background .35s,box-shadow .35s,border-color .35s,color .35s}
.nav.bening.terisi{background:color-mix(in srgb,var(--sbilah-akhir) calc(var(--gulir,0)*100%),var(--sbilah-awal))}
.nav.bening:not(.terisi){background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;border-color:transparent;box-shadow:none;color:#fff}
.nav.bening:not(.terisi) .merek,.nav.bening:not(.terisi) nav a{color:#fff}
.nav.bening:not(.terisi) .merek small{color:rgba(255,255,255,.75)}
.nav.bening:not(.terisi) nav a:hover,.nav.bening:not(.terisi) nav a.on{background:rgba(255,255,255,.14)}
.nav.bening:not(.terisi) .buka span{background:#fff}
.nav.bening:not(.terisi) nav a.tombol{color:var(--cta-nav-teks,#fff)}
@media (max-width:960px){.nav.bening:not(.terisi) nav{background:var(--sbilah-latar-hp);color:var(--sbilah-teks)}.nav.bening:not(.terisi) nav a{color:var(--sbilah-tautan)}}

/* Lima kartu lembaga (4 sekolah + PKBM): 5 kolom ≥1100, 3 kolom ≤1100, 2 ≤900, 1 ≤640 */
/* Beranda sekolah #3–#10 (16 Sep 2026) */
.angka div{box-shadow:0 10px 30px rgba(13,41,80,.06)}
.lembaga .kartu p{font-size:14.5px}
.lembaga .pkbm-baris{display:flex;align-items:center;gap:22px;margin-top:18px;padding:22px 26px;overflow:visible}
.lembaga .pkbm-baris .logo-lembaga{margin:0;flex:none}
.lembaga .pkbm-baris .isi{flex:1;min-width:0}
.lembaga .pkbm-baris .isi .setara{margin-bottom:6px}
.lembaga .pkbm-baris .isi h3{margin:0 0 4px;font-size:20px}
.lembaga .pkbm-baris .isi p{margin:0;color:var(--mut);font-size:14.5px}
.lembaga .pkbm-baris .tombol.garis{flex:none;margin-left:auto;color:var(--aksen-gelap);border-color:var(--aksen-garis)}
.kartu.foto{padding:0;overflow:hidden;display:flex;flex-direction:column}
.kartu.foto img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block}
.kartu.foto .isi{padding:18px 20px 22px}
.kartu.foto h3{font-size:18px;margin:0 0 6px}
.kartu.foto p{margin:0;font-size:14.5px;color:var(--mut)}
.tentang .kartu h3{font-size:20px;margin:0 0 10px}
.tentang .kartu .visi{font-size:18px;line-height:1.6;margin:0;color:var(--teks)}
.tentang .kartu .misi{margin:0;padding-left:20px;color:var(--mut);font-size:15.5px;line-height:1.6}
.tentang .kartu .misi li{margin-bottom:6px}
.kutip{display:flex;flex-direction:column;gap:14px;margin:0}
.kutip .bintang{display:inline-flex;gap:2px}
.kutip .bintang i{width:16px;height:16px;display:block}
.kutip .bintang svg{width:16px;height:16px;fill:var(--abu-terang);display:block}
.kutip .bintang i.isi svg{fill:#f5b400}
.kutip blockquote{flex:1}
/* Marquee testimoni: kartu lebar tetap, daftar digandakan dua kali, geser 1 kartu ≈ 6 dtk */
.testi-geser{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.testi-geser .rel{display:flex;gap:18px;width:max-content;padding:4px 20px;animation:marquee calc(var(--n,3) * 6s) linear infinite}
.testi-geser:hover .rel,.testi-geser:active .rel{animation-play-state:paused}
.testi-geser .kutip{flex:none;width:360px}
@media (prefers-reduced-motion:reduce){.testi-geser{mask-image:none;-webkit-mask-image:none;overflow-x:auto}.testi-geser .rel{animation:none}.testi-geser .kutip[aria-hidden=true]{display:none}}
@media (max-width:640px){.testi-geser .kutip{width:290px}.testi-geser .rel{gap:12px;padding:4px 16px}}
.kutip blockquote{margin:0;font-size:16px;line-height:1.65;color:var(--teks)}
.kutip figcaption{display:flex;align-items:center;gap:12px}
.kutip figcaption .avatar{flex:none;width:44px;height:44px;border-radius:50%;background:var(--aksen-tipis);color:var(--aksen-gelap);font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.kutip figcaption .avatar img{width:100%;height:100%;object-fit:cover;display:block}
.kutip figcaption .siapa{min-width:0}
.kutip figcaption b{display:block;font-size:14.5px}
.kutip figcaption .siapa>span{display:block;font-size:13px;color:var(--mut)}
#faq .kepala-bagian{margin-bottom:22px}
.pita-bagian{padding-top:32px}
#ekosistem .marquee{-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
@media (max-width:1100px){.lembaga-4.grid.empat{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.lembaga .pkbm-baris{flex-direction:column;align-items:flex-start;gap:14px}.lembaga .pkbm-baris .tombol.garis{margin-left:0}.lembaga-4.grid.empat{grid-template-columns:1fr}}
/* Halaman per lembaga (16 Sep 2026) */
.hero-lembaga{min-height:min(64vh,620px);margin-top:calc(-1 * var(--nav-h,72px));padding-top:calc(48px + var(--nav-h,72px));padding-bottom:56px;display:flex;align-items:flex-end;background-size:cover;background-position:center;color:#fff}
.hero-lembaga .lapis{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(7,26,54,.35) 0%,rgba(7,26,54,.55) 55%,rgba(7,26,54,.86) 100%)}
.hero-lembaga .wadah{display:block}
.hero-lembaga .isi-hero{max-width:720px}
.hero-lembaga .logo-hero{width:72px;height:72px;object-fit:contain;display:block;margin-bottom:14px;background:#fff;border-radius:16px;padding:6px}
.hero-lembaga .mata{color:var(--hero-mata)}
.hero-lembaga h1{color:#fff;font-size:clamp(32px,5vw,52px);margin:0 0 10px}
.hero-lembaga p.pengantar{color:var(--hero-teks);font-size:18px;max-width:600px}
.hero-lembaga .tombol.garis{color:#fff;border-color:rgba(255,255,255,.55)}
.daftar-berkas{margin:0;padding-left:20px;color:var(--mut);font-size:15.5px;line-height:1.6}
.daftar-berkas li{margin-bottom:6px}
.info-lembaga{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;margin:0;font-size:15px}
.info-lembaga dt{color:var(--mut);font-weight:500}
.info-lembaga dd{margin:0}
.nav nav a.on{background:var(--sbilah-hover);color:var(--sbilah-teks)}
@media (max-width:640px){.hero-lembaga{min-height:min(60vh,520px);padding-bottom:36px}.hero-lembaga .cta{flex-wrap:wrap}.hero-lembaga .cta .tombol{flex:0 1 auto;white-space:nowrap}.hero-lembaga .mata{font-size:11.5px}.hero-lembaga .logo-hero{width:56px;height:56px}.hero-lembaga p.pengantar{font-size:16px}.info-lembaga{grid-template-columns:1fr;gap:2px 0}.info-lembaga dd{margin-bottom:8px}}
/* SPMB tahap 2–3: borang lengkap (16 Sep 2026) */
.borang.polos{background:transparent;border:0;padding:0;max-width:none}
.pil-bagian{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.pil-bagian a{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:500;color:var(--mut);border:1.5px solid var(--abu-terang);border-radius:999px;padding:6px 12px 6px 6px;background:#fff;line-height:1;white-space:nowrap}
.pil-bagian a b{width:22px;height:22px;border-radius:50%;background:var(--abu-terang);color:var(--teks);font-size:12px;display:inline-flex;align-items:center;justify-content:center}
.pil-bagian a.sudah{border-color:var(--ok-garis);background:var(--ok-latar);color:var(--ok-teks)}.pil-bagian a.sudah b{background:var(--ok-teks);color:#fff}
.pil-bagian a.gagal{border-color:#fecaca;background:#fef2f2;color:#b91c1c}.pil-bagian a.gagal b{background:#b91c1c;color:#fff}
@media (max-width:640px){.pil-bagian{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;margin:0 -20px 14px;padding-left:20px;padding-right:20px;scrollbar-width:none}.pil-bagian::-webkit-scrollbar{display:none}.pil-bagian a{font-size:13px;flex:none}}
details.bagian-borang{background:#fff;border:1px solid var(--abu-terang);border-radius:16px;padding:0 20px;margin-bottom:12px}
details.bagian-borang summary{padding:16px 0;font-size:17px;display:flex;align-items:center;gap:10px}
details.bagian-borang summary::after{margin-left:auto}
details.bagian-borang .ket-bagian{margin:0 0 12px;color:var(--mut);font-size:14.5px}
details.bagian-borang .borang{margin-bottom:18px}
details.bagian-borang .pil-status{font-size:11.5px;padding:3px 9px}
.pil-status.baru{background:#fff7e0;color:#8a5a00}
.tabel-berkas{width:100%;border-collapse:collapse;font-size:14.5px}
.tabel-berkas td{padding:8px 6px;border-top:1px solid var(--abu-terang);vertical-align:middle}
.tabel-berkas tr:first-child td{border-top:0}
.tabel-berkas input[type=file]{font-size:13px;max-width:220px;min-height:0;padding:6px;background:#fff}
.tabel-berkas select{min-height:38px;padding:4px 8px;font-size:14px;width:auto;background:#fff}
.daftar-item{display:flex;flex-direction:column}
.item-baris{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--abu-terang)}
.item-baris:first-child{border-top:0}
.item-baris .cek-item{flex:1;min-width:0;align-items:center;gap:12px}
.item-baris .cek-item input{width:26px;height:26px;min-width:26px;margin:0;accent-color:var(--aksen)}   /* kotak centang sepadan dengan tombol 48 px (Apink: kok kecil) */
.item-baris select{flex:none;width:auto;min-height:38px;padding:4px 30px 4px 10px;font-size:14px;background:#fff}
/* Tombol kamera ala Foto Kilat di borang orang tua (kelas sama dengan siswa/foto-kilat) */
.item-baris .fk-tombol{display:inline-flex;align-items:center;justify-content:center;width:56px;height:48px;border-radius:12px;background:var(--aksen);color:#fff;cursor:pointer;flex:none;margin:0}
.item-baris .fk-tombol svg{width:26px;height:26px}
.item-baris .fk-tombol.ada{background:var(--aksen-gelap)}   /* sudah ada foto: tetap biru senada Foto Kilat (Apink: jangan hijau) */
.fk-mini{width:48px;height:48px;border-radius:12px;overflow:hidden;border:1.5px solid var(--aksen-garis);padding:0;background:#fff;cursor:pointer;flex:none}
.fk-mini img{width:100%;height:100%;object-fit:cover;display:block}
dialog.dialog-foto{border:0;border-radius:20px;padding:0;max-width:min(92vw,520px);width:100%;background:#fff;box-shadow:0 30px 80px rgba(0,0,0,.35)}
dialog.dialog-foto::backdrop{background:rgba(7,26,54,.7);backdrop-filter:blur(3px)}
dialog.dialog-foto .isi-dialog{padding:12px}
dialog.dialog-foto img{width:100%;max-height:70vh;object-fit:contain;border-radius:12px;display:block;background:var(--latar)}
dialog.dialog-foto p{margin:10px 4px 0;color:var(--mut);font-size:14px}
dialog.dialog-foto .aksi{display:flex;gap:10px;justify-content:flex-end;margin-top:12px}
dialog.dialog-foto .aksi .tombol{min-height:42px;padding:0 16px;font-size:14px;cursor:pointer}
.cek-item,.borang label.cek-item{display:flex;align-items:flex-start;gap:10px;cursor:pointer;font-weight:500;font-size:15px;margin:0}
.cek-item input{width:20px;height:20px;min-height:0;margin:2px 0 0;accent-color:var(--aksen)}
.cek-item small{display:block;font-weight:400;color:var(--mut);font-size:12.5px;line-height:1.35}
.cek-item>span{min-width:0;line-height:1.3}
.unggah-bukti{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:10px}
.unggah-bukti input[type=file]{flex:1;min-width:200px;font-size:13px;min-height:0;padding:8px;background:#fff}
.jejak li form .tombol{min-height:40px;padding:0 16px;font-size:14px}
@media (max-width:640px){details.bagian-borang{padding:0 14px}.tabel-berkas tr{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:8px 0;border-top:1px solid var(--abu-terang)}.tabel-berkas td{display:block;padding:0;border:0}.tabel-berkas td:nth-child(3){grid-column:1/-1;padding-top:4px}.tabel-berkas input[type=file]{max-width:100%}.item-baris{padding:9px 0}.item-baris select{min-height:36px;font-size:13.5px;padding:4px 26px 4px 8px}}
.grid.lima{grid-template-columns:repeat(5,1fr)}
@media (max-width:1100px){.grid.lima{grid-template-columns:repeat(3,1fr)}}
@media (max-width:900px){.grid.lima{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.grid.lima{grid-template-columns:1fr}}

/* Hero sambutan (halaman Lembaga sekolah): teks di tengah, tanpa kartu; label emas, judul putih besar */
.hero.hero-video.sambut{min-height:100svh;display:flex;align-items:center;justify-content:center;padding-bottom:calc(28px + var(--nav-h,70px))}
.hero.sambut .wadah{display:block;text-align:center}
.hero.sambut .sambutan{max-width:900px;margin:0 auto}
.hero.sambut .mata{color:var(--hero-emas,#f5b400);font-size:14px;letter-spacing:.2em}
.hero.sambut h1{color:#fff;font-size:clamp(34px,6vw,64px);margin:0;line-height:1.1}
@media (max-width:640px){.hero.sambut .mata{font-size:12.5px}}

/* Marquee logo (Ekosistem Digital Sekolah): deret digandakan dua kali, digeser -50% supaya mulus tanpa putus. */
.kepala-bagian.tengah{margin:0 auto 24px;text-align:center}
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.marquee .rel{display:flex;gap:64px;width:max-content;align-items:center;animation:marquee 36s linear infinite}
.marquee:hover .rel{animation-play-state:paused}
.marquee .item{display:flex;align-items:center;gap:12px;white-space:nowrap}
.marquee .item img{height:36px;width:auto;flex:none;display:block}
.marquee .item img[src*="/lms.svg"]{height:44px;border-radius:11px;box-shadow:0 6px 14px rgba(20,20,19,.14)}   /* ikon LMS buatan sendiri (17 Sep): sedikit lebih besar dari logo vendor, ada bayang */
.marquee .item.wm{flex-direction:column;align-items:flex-start;gap:2px}
.marquee .item.wm small{padding-left:2px}
.marquee .t{display:flex;flex-direction:column;text-align:left;line-height:1.15}
.marquee .t b{color:var(--teks);font-size:15px;font-weight:600}
.marquee small{color:var(--mut);font-size:12px}
@keyframes marquee{to{transform:translateX(-50%)}}
@media (max-width:640px){.marquee .rel{gap:44px;animation-duration:30s}.marquee .item img{height:30px}.marquee .item img[src*="/lms.svg"]{height:36px;border-radius:9px}.marquee .t b{font-size:14px}}
@media (prefers-reduced-motion:reduce){.marquee .rel{animation:none;flex-wrap:wrap;width:auto;justify-content:center;gap:28px 40px}.marquee .item[aria-hidden]{display:none}.marquee{mask-image:none;-webkit-mask-image:none}}
.bagian.gelap .kartu h3{color:var(--aksen-gelap)}.bagian.gelap .kartu p{color:var(--teks)}
.mitra-judul{font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--mut);margin:26px 0 10px}
/* Kartu paket AIDA di beranda PKBM (16 Sep 2026): lencana huruf, kail, manfaat, poin bercentang, tombol daftar. Hanya token; selektor :is(.lembaga,.silang-baris) .paket-kartu mengalahkan .lembaga .kartu. */
:is(.lembaga,.silang-baris) .paket-kartu{display:flex;flex-direction:column;gap:10px;padding:22px 22px 20px;overflow:visible;border-top:4px solid var(--aksen);transition:transform .2s ease,box-shadow .2s ease}
:is(.lembaga,.silang-baris) .paket-kartu .kepala{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
:is(.lembaga,.silang-baris) .paket-kartu .kepala .setara{margin-bottom:8px}
:is(.lembaga,.silang-baris) .paket-kartu h3{font-size:24px;margin:0;line-height:1.15}
:is(.lembaga,.silang-baris) .paket-kartu .lencana{flex:none;width:56px;height:56px;border-radius:16px;background:var(--aksen);color:#fff;font-weight:800;font-size:28px;line-height:1;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 18px rgba(20,20,19,.12)}
:is(.lembaga,.silang-baris) .paket-kartu p.kail{margin:2px 0 0;font-size:16.5px;font-weight:600;color:var(--teks);line-height:1.35}
:is(.lembaga,.silang-baris) .paket-kartu p.minat{margin:0;font-size:14.5px;color:var(--mut);line-height:1.55}
:is(.lembaga,.silang-baris) .paket-kartu ul{list-style:none;margin:4px 0 0;padding:14px 0 0;border-top:1px solid var(--line);display:grid;gap:9px}
:is(.lembaga,.silang-baris) .paket-kartu li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;line-height:1.45;color:var(--teks)}
:is(.lembaga,.silang-baris) .paket-kartu li svg{width:19px;height:19px;flex:none;color:var(--ok);margin-top:1px}
:is(.lembaga,.silang-baris) .paket-kartu .aksi{margin-top:auto;padding-top:14px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
:is(.lembaga,.silang-baris) .paket-kartu .aksi .tombol{padding:11px 18px;font-size:14px}
:is(.lembaga,.silang-baris) .paket-kartu .aksi .lanjut{font-size:14px;font-weight:500;color:var(--aksen-gelap);white-space:nowrap}
:is(.lembaga,.silang-baris) .paket-kartu:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(20,20,19,.08)}
@media (prefers-reduced-motion:reduce){:is(.lembaga,.silang-baris) .paket-kartu{transition:none}:is(.lembaga,.silang-baris) .paket-kartu:hover{transform:none}}
@media (max-width:640px){:is(.lembaga,.silang-baris) .paket-kartu{padding:20px 18px 18px}:is(.lembaga,.silang-baris) .paket-kartu h3{font-size:22px}:is(.lembaga,.silang-baris) .paket-kartu .lencana{width:50px;height:50px;font-size:25px;border-radius:14px}}
/* Nav padat (16 Sep 2026): instans dengan 9 item menu (PKBM: Paket A·B·C + "Sekolah Formal Lainnya") — jarak & padding dirapatkan supaya muat 1024–1366 px. Diukur: nav 1030 px → jebol 73 px di 1280. */
.nav.padat nav{gap:2px}
.nav.padat nav a,.nav.padat nav details.turun summary{padding:8px 8px;font-size:14px}
.nav.padat nav details.turun summary{padding-right:6px}
.nav.padat nav a.tombol{padding:0 14px}
@media (min-width:961px) and (max-width:1170px){.nav.padat .merek span{display:none}}   /* logo saja di laptop kecil; HP (≤960, menu burger) tetap tampil nama — Apink 16 Sep malam */
@media (min-width:961px) and (max-width:1060px){.nav .merek span{display:none}}   /* logo saja di laptop kecil (sekolah jebol 12 px di 1024); HP tetap tampil nama */
/* Kartu tautan silang (PKBM → Sekolah Al Islam Madani), 16 Sep 2026: layout = .paket-kartu, warna navy lewat token --silang-* (bukan warna instans sekolah; PKBM tetap oranye di tempat lain). */
:root{--silang:#1a4789;--silang-gelap:#0d2950;--silang-tipis:#eef4ff;--silang-garis:#c9dbf5}   /* kartu → Sekolah (navy) */
.silang-pkbm{--silang:#d97757;--silang-gelap:#c2603f;--silang-tipis:#fdf5f1;--silang-garis:#f0c9b8}   /* kartu → PKBM (oranye) — di situs sekolah */
:is(.lembaga,.silang-baris) .paket-kartu.silang,.program .paket-kartu.silang{border-top-color:var(--silang)}
.paket-kartu.silang .setara{background:var(--silang-tipis);color:var(--silang-gelap)}
.paket-kartu.silang .lencana{background:#fff;border:1px solid var(--silang-garis);box-shadow:0 8px 18px rgba(20,20,19,.14);padding:5px}
.paket-kartu.silang .lencana img{width:100%;height:100%;object-fit:contain;display:block}
.paket-kartu.silang li svg{color:var(--silang)}
.paket-kartu.silang .aksi .tombol{background:var(--silang);border-color:var(--silang);color:#fff}
.paket-kartu.silang .aksi .tombol:hover{background:var(--silang-gelap);border-color:var(--silang-gelap)}
.paket-kartu.silang .aksi .lanjut{color:var(--silang-gelap)}
.silang-baris{margin-top:18px}
.silang-baris .paket-kartu.silang{grid-column:1/-1;max-width:none}
.silang-baris .paket-kartu.silang .kepala .setara{margin-bottom:10px}
@media (min-width:641px){.silang-baris .paket-kartu.silang{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"kepala kail" "minat poin" "aksi poin";column-gap:28px;row-gap:8px;align-items:start}
.silang-baris .paket-kartu.silang .kepala{grid-area:kepala}.silang-baris .paket-kartu.silang .kail{grid-area:kail;margin:0;align-self:end;padding-bottom:6px}.silang-baris .paket-kartu.silang .minat{grid-area:minat}.silang-baris .paket-kartu.silang ul{grid-area:poin;margin:0;padding:0;border:0}.silang-baris .paket-kartu.silang .aksi{grid-area:aksi;margin-top:6px;padding-top:0}}
/* Kartu lembaga AIDA di beranda sekolah (17 Sep 2026): lencana berisi logo lembaga; 4 kolom → padding & ukuran sedikit lebih rapat dari kartu paket 3 kolom. */
:is(.lembaga,.silang-baris) .paket-kartu .lencana.logo{background:#fff;border:1px solid var(--aksen-garis);box-shadow:0 6px 14px rgba(20,20,19,.10);padding:5px}
:is(.lembaga,.silang-baris) .paket-kartu .lencana.logo img{width:100%;height:100%;object-fit:contain;display:block}
/* Kartu lembaga 4 kolom (Apink 17 Sep: hampir persegi, jangan terlalu memanjang): di ≥1101 px dirapatkan (266×328 di 1280); di bawah itu 2/1 kolom memakai ukuran biasa. */
.lembaga-4 .paket-kartu{padding:18px 18px 16px}
.lembaga-4 .paket-kartu h3{font-size:20px}
.lembaga-4 .paket-kartu .kail{font-size:15px}
.lembaga-4 .paket-kartu .minat,.lembaga-4 .paket-kartu li{font-size:13.5px}
.lembaga-4 .paket-kartu .aksi .tombol{padding:10px 14px;font-size:13.5px}
.lembaga-4 .paket-kartu .aksi .lanjut{white-space:normal}
@media (min-width:1101px){
.lembaga-4 .paket-kartu{padding:14px 14px 12px;gap:6px}
.lembaga-4 .paket-kartu .kepala{gap:8px}
.lembaga-4 .paket-kartu .kepala .setara{margin-bottom:4px;font-size:11.5px;padding:3px 8px}
.lembaga-4 .paket-kartu h3{font-size:18px;line-height:1.12}
.lembaga-4 .paket-kartu .lencana{width:42px;height:42px;border-radius:12px}
.lembaga-4 .paket-kartu .lencana img{width:34px;height:34px}
.lembaga-4 .paket-kartu .kail{font-size:14px;line-height:1.3;margin-top:0}
.lembaga-4 .paket-kartu ul{padding-top:8px;gap:4px;margin-top:2px}
.lembaga-4 .paket-kartu .minat,.lembaga-4 .paket-kartu li{font-size:12.5px;line-height:1.35}
.lembaga-4 .paket-kartu li svg{width:16px;height:16px;margin-top:0}
.lembaga-4 .paket-kartu .aksi{padding-top:8px;gap:12px;flex-wrap:nowrap}
.lembaga-4 .paket-kartu .aksi .tombol{padding:8px 16px;font-size:13px;min-height:38px}
.lembaga-4 .paket-kartu .aksi .lanjut{white-space:nowrap;font-size:13px}
}
/* Visi & Misi sebagai kartu AIDA (17 Sep 2026): lencana ikon SVG, kail visi lebih besar. */
:is(.lembaga,.silang-baris) .paket-kartu .lencana svg{width:28px;height:28px}
.tentang.lembaga .paket-kartu{padding:24px 24px 22px}
#kartu-visi .kail{font-size:22px;line-height:1.35}
.tentang.lembaga .paket-kartu li{font-size:15px}
/* Berita sorotan (17 Sep 2026): kartu lebar dua kolom di atas daftar /berita; lencana, tanggal, judul besar, ringkasan, tombol. Token saja; beranda hanya mengurutkan sorotan ke depan. */
.sorotan-daftar{display:grid;gap:22px;margin-bottom:28px}
.berita-sorotan{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);padding:0;overflow:hidden;border-top:4px solid var(--aksen);transition:transform .2s ease,box-shadow .2s ease}
.berita-sorotan:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(0,0,0,.12)}
.berita-sorotan .sampul{position:relative;min-height:340px;background:linear-gradient(135deg,var(--aksen-ikon),var(--abu-terang));overflow:hidden}
.berita-sorotan .sampul img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.berita-sorotan .isi{display:flex;flex-direction:column;gap:10px;padding:30px 32px;align-self:center}
.berita-sorotan .lencana-sorotan{align-self:flex-start;background:var(--aksen);color:#fff;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:999px}
.berita-sorotan time{font-size:13px;color:var(--mut);font-weight:500}
.berita-sorotan h2{margin:0;font-size:clamp(22px,2.4vw,30px);line-height:1.25;color:var(--teks)}
.berita-sorotan p{margin:0;font-size:15.5px;color:var(--mut);line-height:1.6}
.berita-sorotan .tombol{align-self:flex-start;margin-top:6px}
@media (prefers-reduced-motion:reduce){.berita-sorotan{transition:none}.berita-sorotan:hover{transform:none}}
@media (max-width:820px){.berita-sorotan{grid-template-columns:1fr}.berita-sorotan .sampul{aspect-ratio:16/9;min-height:0}.berita-sorotan .sampul img{position:static}.berita-sorotan .isi{padding:22px 20px 24px}.berita-sorotan h2{font-size:22px}}
/* Korsel sorotan beranda (17 Sep 2026): kartu tengah besar, kiri-kanan mengintip lebih kecil & redup, tombol ‹ › kanan bawah, gulir otomatis 7 dtk (berhenti saat disorot), usap di HP. */
.korsel{position:relative}
.korsel-layar{overflow:hidden;padding:8px 0 4px;-webkit-mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent)}
.korsel-jalur{display:flex;gap:24px;align-items:stretch;transition:transform .55s cubic-bezier(.22,.61,.36,1);will-change:transform}
.korsel-slide{flex:0 0 56%;display:flex;flex-direction:column;padding:0;overflow:hidden;border-top:4px solid var(--aksen);transform:scale(.86);opacity:.55;filter:blur(1.5px);transition:transform .55s cubic-bezier(.22,.61,.36,1),opacity .55s,filter .55s,box-shadow .3s;cursor:pointer}
.korsel-slide.aktif{transform:scale(1);opacity:1;filter:none;box-shadow:0 18px 40px rgba(0,0,0,.12)}
.korsel-slide.aktif:hover,.korsel-slide.aktif:focus-visible{transform:scale(1.015) translateY(-5px);box-shadow:0 26px 48px rgba(0,0,0,.16)}   /* goyang seperti kartu lain: naik sedikit saat disorot */
.korsel-slide:not(.aktif):hover{transform:scale(.89);opacity:.8;filter:blur(.5px)}
.korsel-slide:active{transform:scale(.985);transition-duration:.12s}
.korsel-slide .sampul{aspect-ratio:16/9;background:linear-gradient(135deg,var(--aksen-ikon),var(--abu-terang));overflow:hidden}
.korsel-slide .sampul img{width:100%;height:100%;object-fit:cover;display:block}
.korsel-slide .isi{display:flex;flex-direction:column;gap:8px;padding:20px 24px 24px}
.korsel-slide .lencana-sorotan{align-self:flex-start;background:var(--aksen);color:#fff;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:999px}
.korsel-slide time{font-size:13px;color:var(--mut);font-weight:500}
.korsel-slide h3{margin:0;font-size:clamp(19px,1.9vw,24px);line-height:1.3;color:var(--teks)}
.korsel-slide p{margin:0;font-size:15px;color:var(--mut);line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.korsel-tombol{position:absolute;top:50%;z-index:2;width:52px;height:52px;margin-top:-26px;border-radius:50%;border:0;background:#fff;color:var(--teks);box-shadow:0 6px 20px rgba(0,0,0,.16);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:transform .15s,box-shadow .15s;font-family:inherit}
.korsel.tunggal .korsel-layar{-webkit-mask-image:none;mask-image:none}
.korsel.tunggal .korsel-jalur{justify-content:center}
.korsel-tombol.kiri{left:calc(22% - 26px)}.korsel-tombol.kanan{right:calc(22% - 26px)}   /* tepat di tepi kartu tengah (lebar 56%) */
.korsel-tombol:hover{transform:scale(1.06);box-shadow:0 10px 26px rgba(0,0,0,.2)}
.korsel-titik{display:flex;justify-content:center;gap:10px;margin-top:20px}
.korsel-titik button{width:13px;height:13px;padding:0;border-radius:50%;border:0;background:var(--aksen);opacity:.35;cursor:pointer;transition:opacity .2s,transform .2s}
.korsel-titik button.on{opacity:1;transform:scale(1.15)}
.korsel-titik button:focus-visible{outline:3px solid var(--aksen-ikon);outline-offset:2px}
.korsel-tombol:focus-visible{outline:3px solid var(--aksen-ikon);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.korsel-jalur,.korsel-slide{transition:none}.korsel-slide.aktif:hover{transform:scale(1)}}
@media (max-width:820px){.korsel-tombol{width:42px;height:42px;margin-top:-21px}.korsel-tombol.kiri{left:calc(9% - 21px)}.korsel-tombol.kanan{right:calc(9% - 21px)}.korsel-titik{margin-top:14px}.korsel-layar{-webkit-mask-image:none;mask-image:none}.korsel-slide{flex-basis:82%;transform:scale(.92)}.korsel-jalur{gap:14px}.korsel-slide .isi{padding:16px 18px 20px}.korsel-slide h3{font-size:19px}}
/* Pop-up galeri (17 Sep 2026): lapisan gelap penuh layar, foto muat di layar, keterangan di bawah, tombol × kanan atas, panah kiri-kanan; HP: panah di bawah foto. */
.lampu[hidden]{display:none}
.lampu{position:fixed;inset:0;z-index:200;background:rgba(7,12,20,.92);display:flex;align-items:center;justify-content:center;padding:56px 64px}
.lampu figure{margin:0;max-width:min(1100px,100%);max-height:100%;display:flex;flex-direction:column;align-items:center;gap:12px}
.lampu img{max-width:100%;max-height:calc(100vh - 150px);object-fit:contain;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.5);background:#000}
.lampu figcaption{color:rgba(255,255,255,.85);font-size:14px;text-align:center;max-width:70ch}
.lampu button{border:0;cursor:pointer;color:#fff;background:rgba(255,255,255,.12);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-family:inherit;line-height:1;transition:background .15s}
.lampu button:hover{background:rgba(255,255,255,.24)}
.lampu button:focus-visible{outline:3px solid #fff;outline-offset:2px}
.lampu-tutup{position:absolute;top:14px;right:14px;width:48px;height:48px;font-size:30px}
.lampu-panah{position:absolute;top:50%;margin-top:-26px;width:52px;height:52px;font-size:34px}
.lampu-panah.kiri{left:12px}.lampu-panah.kanan{right:12px}
@media (max-width:700px){.lampu{padding:64px 12px 84px}.lampu img{max-height:calc(100vh - 170px)}.lampu-panah{top:auto;bottom:16px;margin-top:0;width:48px;height:48px}.lampu-panah.kiri{left:calc(50% - 60px)}.lampu-panah.kanan{right:calc(50% - 60px)}}
/* Tombol kembali ke atas (18 Sep 2026): bulat warna aksen instans (navy sekolah, oranye PKBM); kanan bawah di atas tombol WhatsApp; tampil hanya saat mentok di dasar. */
.ke-atas{position:fixed;right:22px;bottom:88px;z-index:50;width:48px;height:48px;border-radius:50%;border:0;background:var(--aksen);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 26px rgba(0,0,0,.22);cursor:pointer;transition:transform .15s,opacity .2s}
.ke-atas:hover{transform:translateY(-3px)}
.ke-atas:focus-visible{outline:3px solid var(--aksen-ikon);outline-offset:2px}
.ke-atas[hidden]{display:none}
@media (max-width:640px){.ke-atas{right:18px;bottom:84px;width:44px;height:44px}}
/* Tombol "Tanya lewat WhatsApp" (18 Sep 2026, Apink): hijau WhatsApp di semua halaman dua instans, menggantikan gaya garis yang samar. */
a.tombol.garis[href*="wa.me"],a.tombol.garis[href*="whatsapp"]{background:#25d366;border-color:#25d366;color:#fff}
a.tombol.garis[href*="wa.me"]:hover,a.tombol.garis[href*="whatsapp"]:hover{background:#1ebe5a;border-color:#1ebe5a;color:#fff}
a.tombol.garis[href*="wa.me"]::before,a.tombol.garis[href*="whatsapp"]::before{content:"";width:18px;height:18px;flex:none;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.5 14.4c-.3-.1-1.8-.9-2-1s-.5-.1-.7.1-.8 1-1 1.2-.4.2-.7.1a8.2 8.2 0 0 1-4-3.5c-.3-.5.3-.5.9-1.6.1-.2 0-.4 0-.5l-.9-2.2c-.2-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4s-1.1 1.1-1.1 2.6 1.1 3 1.3 3.2 2.2 3.4 5.4 4.7c2 .8 2.7.9 3.7.8.6-.1 1.8-.7 2-1.4s.3-1.3.2-1.4l-.5-.3zM12 2a10 10 0 0 0-8.6 15l-1.4 5 5.2-1.4A10 10 0 1 0 12 2zm0 18.2c-1.5 0-3-.4-4.3-1.2l-.3-.2-3.1.8.8-3-.2-.3A8.2 8.2 0 1 1 12 20.2z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.5 14.4c-.3-.1-1.8-.9-2-1s-.5-.1-.7.1-.8 1-1 1.2-.4.2-.7.1a8.2 8.2 0 0 1-4-3.5c-.3-.5.3-.5.9-1.6.1-.2 0-.4 0-.5l-.9-2.2c-.2-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4s-1.1 1.1-1.1 2.6 1.1 3 1.3 3.2 2.2 3.4 5.4 4.7c2 .8 2.7.9 3.7.8.6-.1 1.8-.7 2-1.4s.3-1.3.2-1.4l-.5-.3zM12 2a10 10 0 0 0-8.6 15l-1.4 5 5.2-1.4A10 10 0 1 0 12 2zm0 18.2c-1.5 0-3-.4-4.3-1.2l-.3-.2-3.1.8.8-3-.2-.3A8.2 8.2 0 1 1 12 20.2z'/%3E%3C/svg%3E") center/contain no-repeat}
/* Kartu paket PKBM 3 kolom di beranda dipadatkan (Apink 18 Sep: kalimat tetap, ukuran & jarak dirapatkan agar tidak memanjang). Hanya ≥ 961 px. */
@media (min-width:961px){
.lembaga .grid.tiga .paket-kartu{padding:16px 18px 14px;gap:6px}
.lembaga .grid.tiga .paket-kartu .kepala{gap:10px}
.lembaga .grid.tiga .paket-kartu .kepala .setara{margin-bottom:4px;font-size:12px;padding:3px 9px}
.lembaga .grid.tiga .paket-kartu h3{font-size:21px;line-height:1.12}
.lembaga .grid.tiga .paket-kartu .lencana{width:46px;height:46px;border-radius:13px;font-size:23px}
.lembaga .grid.tiga .paket-kartu p.kail{font-size:15px;line-height:1.3;margin-top:0}
.lembaga .grid.tiga .paket-kartu p.minat{font-size:13.5px;line-height:1.45}
.lembaga .grid.tiga .paket-kartu ul{padding-top:9px;gap:5px;margin-top:2px}
.lembaga .grid.tiga .paket-kartu li{font-size:13.5px;line-height:1.38}
.lembaga .grid.tiga .paket-kartu li svg{width:17px;height:17px;margin-top:0}
.lembaga .grid.tiga .paket-kartu .aksi{padding-top:10px;gap:12px;flex-wrap:nowrap}
.lembaga .grid.tiga .paket-kartu .aksi .tombol{padding:9px 15px;font-size:13.5px;min-height:40px;white-space:nowrap}
.lembaga .grid.tiga .paket-kartu .aksi .lanjut{white-space:nowrap;font-size:13.5px}
}

/* ---------- karir & kerja sama (18 Sep 2026) ---------- */
.lowongan .kartu{display:flex;flex-direction:column;text-decoration:none}
.lowongan .kartu h3{margin:6px 0 10px}
.lowongan .kartu ul{margin:0 0 12px;padding-left:18px;color:var(--mut);font-size:14.5px;flex:1}
.lowongan .kartu .meta{font-size:13.5px;margin:0 0 10px}
.poin{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.poin li{position:relative;padding-left:26px;font-size:15px;color:var(--mut)}
.poin li::before{content:"";position:absolute;left:0;top:6px;width:14px;height:14px;border-radius:50%;background:var(--aksen-ikon);box-shadow:inset 0 0 0 4px var(--aksen)}
.poin li b{display:block;color:var(--teks);font-size:15.5px;margin-bottom:2px}
.poin.rapat{gap:7px}
.langkah-grid.lima{grid-template-columns:repeat(5,1fr)}.langkah-grid.tiga{grid-template-columns:repeat(3,1fr)}
.catatan-karir{font-size:13.5px;color:var(--mut);margin:0;max-width:720px}
.pil-status.administrasi,.pil-status.tes,.pil-status.wawancara,.pil-status.ditindaklanjuti{background:var(--aksen-tipis);color:var(--aksen-gelap)}
@media (max-width:960px){.langkah-grid.lima{grid-template-columns:repeat(3,1fr)}.karir-info{grid-template-columns:1fr}}
@media (max-width:560px){.langkah-grid.lima,.langkah-grid.tiga{grid-template-columns:1fr}}

/* Tombol aksi di bawah borang (19 Sep 2026, diukur: dulu jarak 4 px desktop / 0 px HP) */
.aksi-borang{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
@media (max-width:640px){.aksi-borang{flex-direction:column;gap:10px}.aksi-borang .tombol{width:100%}}
