/*
Theme Name: ULAR288 Panduan NKNO5
Theme URI: https://ular288login.asia/
Author: ULAR288 Panduan Indonesia
Description: Bright mobile-first editorial guide for ULAR288.
Version: 1.0.1
Text Domain: ular288-panduan
*/
:root{--bg:#f3f7f6;--surface:#fff;--mint:#e7f3ef;--deep:#123c3a;--brand:#167d72;--violet:#6d5bd0;--amber:#f0b84a;--ink:#142b2a;--muted:#637572;--line:#d3e3df;--info:#e8f4fa;--warn:#fff2d2;--focus:#5a46c8;--shadow:0 14px 34px rgba(20,70,65,.1);--radius:18px;--wide:1140px;--text:760px}
*{box-sizing:border-box;min-width:0}html{scroll-behavior:smooth;scroll-padding-top:86px}body{margin:0;background:var(--bg);color:var(--ink);font-family:"Noto Sans",Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:17px;line-height:1.72}img{display:block;max-width:100%;height:auto}a{color:#0d685f;text-decoration-thickness:.08em;text-underline-offset:.18em}a:hover{color:var(--violet)}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link:focus{clip:auto!important;width:auto;height:auto;left:1rem;top:1rem;background:#fff;padding:.6rem 1rem;z-index:1000}
.site-header{position:sticky;top:0;z-index:100;background:rgba(18,60,58,.97);color:#fff;border-bottom:1px solid rgba(255,255,255,.12)}.header-inner{max-width:var(--wide);height:68px;margin:auto;padding:0 22px;display:flex;align-items:center;gap:26px}.brand-link,.custom-logo-link{display:flex;align-items:center;color:#fff;text-decoration:none;font-weight:850;letter-spacing:-.02em}.custom-logo{width:auto;max-width:280px;height:42px}.site-brand-text{font-size:1.05rem}.menu-toggle{display:none;margin-left:auto;width:48px;height:48px;border:1px solid rgba(255,255,255,.3);border-radius:12px;background:transparent;color:#fff;font-size:0}.menu-toggle span,.menu-toggle:before,.menu-toggle:after{content:"";display:block;width:23px;height:2px;margin:5px auto;background:currentColor;transition:.2s}.primary-nav{margin-left:auto}.primary-nav ul{display:flex;align-items:center;gap:3px;margin:0;padding:0;list-style:none}.primary-nav a{display:flex;align-items:center;min-height:44px;padding:.42rem .64rem;border-radius:10px;color:#fff;text-decoration:none;font-size:.82rem;font-weight:720;white-space:nowrap}.primary-nav a:hover,.primary-nav .current-menu-item>a{background:rgba(255,255,255,.12);color:#fff}
.site-main{overflow:hidden}.page-shell{max-width:var(--wide);margin:0 auto;padding:64px 22px 84px}.content-column{max-width:var(--text);margin:0 auto}.entry-header{max-width:880px;margin:0 auto 36px}.entry-header .eyebrow,.hero-copy .eyebrow{margin:0 0 10px;color:var(--brand);font-size:.77rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase}.entry-title,h1{font-size:clamp(2.35rem,5.4vw,4.35rem);line-height:1.04;letter-spacing:-.045em;margin:.1em 0 .38em;color:var(--deep)}.entry-deck{font-size:1.15rem;color:var(--muted)}
.entry-content>section{padding:72px max(22px,calc((100vw - var(--text))/2));margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}.entry-content>section:nth-of-type(odd){background:var(--surface)}.entry-content>section:nth-of-type(even){background:var(--mint)}.entry-content>section:first-child{padding-top:86px;background:linear-gradient(142deg,#e1f3ed 0%,#f8fbfa 55%,#eeeaff 100%)}.entry-content>section>*{max-width:var(--text);margin-left:auto;margin-right:auto}.entry-content .hero-copy>*{max-width:900px}.entry-content h2,.content-column h2{margin:1.7em 0 .55em;color:var(--deep);font-size:clamp(1.75rem,3.4vw,2.55rem);line-height:1.15;letter-spacing:-.025em}.entry-content h2:before,.content-column h2:before{content:"";display:block;width:46px;height:5px;margin-bottom:14px;border-radius:4px;background:linear-gradient(90deg,var(--brand),var(--violet))}.entry-content h3,.content-column h3{margin:1.6em 0 .5em;color:var(--deep);font-size:1.35rem;line-height:1.25}.entry-content p,.content-column p{margin:0 0 1.15em}.entry-content ul,.entry-content ol,.content-column ul,.content-column ol{padding-left:1.35rem;margin:1rem 0 1.5rem}.entry-content li,.content-column li{margin:.45rem 0}.entry-content strong,.content-column strong{color:#0c514b}
.entry-content figure{max-width:1040px!important;margin-top:40px!important;margin-bottom:18px!important}.entry-content figure img{width:100%;border-radius:var(--radius);box-shadow:var(--shadow);aspect-ratio:16/10;object-fit:cover}.entry-content figure figcaption{max-width:760px;margin:12px auto 0;color:var(--muted);font-size:.9rem}.entry-content>section#identitas figure img,.entry-content>section#kepercayaan figure img{aspect-ratio:16/9}.content-column table,.entry-content table{width:100%;border-collapse:separate;border-spacing:0;margin:30px 0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 8px 22px rgba(20,70,65,.07)}th,td{text-align:left;vertical-align:top;padding:13px 15px;border-bottom:1px solid var(--line)}th{background:var(--deep);color:#fff;font-size:.9rem}tr:last-child td{border-bottom:0}.content-column .comparison,.content-column .decision-matrix,.content-column .trust-matrix{display:table}.content-column>ol[class],.content-column>ul[class]{padding:20px 24px 20px 46px;border-radius:var(--radius);background:var(--mint);border-left:5px solid var(--brand)}
.faq-section details{max-width:var(--text);margin:12px auto!important;border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden}.faq-section summary{cursor:pointer;padding:18px 52px 18px 20px;font-weight:780;line-height:1.35;position:relative}.faq-section summary:after{content:"+";position:absolute;right:19px;top:14px;color:var(--brand);font-size:1.5rem}.faq-section details[open] summary:after{content:"−"}.faq-answer{padding:0 20px 18px;color:#354f4d}.faq-answer p{margin:0}.source-note{background:var(--info);border-left:5px solid #4b98bd;padding:18px;border-radius:12px}
.site-footer{background:var(--deep);color:#d5e7e3;padding:54px 22px 28px}.footer-inner{max-width:var(--wide);margin:auto;display:grid;grid-template-columns:1.4fr 1fr;gap:36px}.footer-brand{font-size:1.25rem;font-weight:850;color:#fff}.site-footer p{margin:.35rem 0 1rem;max-width:650px}.footer-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 18px;align-content:start}.site-footer a{color:#fff}.footer-bottom{max-width:var(--wide);margin:32px auto 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.14);font-size:.87rem;color:#abc5c1}
@media(max-width:980px){.header-inner{height:58px;padding:0 16px}.custom-logo{max-width:226px;height:36px}.menu-toggle{display:block}.primary-nav{position:fixed;inset:58px 0 auto;background:var(--deep);padding:14px 16px 22px;border-top:1px solid rgba(255,255,255,.1);transform:translateY(-120%);visibility:hidden;transition:.2s}.primary-nav.is-open{transform:translateY(0);visibility:visible}.primary-nav ul{display:block}.primary-nav a{font-size:1rem;padding:.65rem .8rem}.nav-open{overflow:hidden}.page-shell{padding-top:46px}}
@media(max-width:720px){body{font-size:16px}.page-shell{padding:38px 16px 58px}.entry-content>section{padding:44px 16px}.entry-content>section:first-child{padding-top:52px}.entry-title,h1{font-size:clamp(2.15rem,11vw,3.2rem)}.entry-content h2,.content-column h2{font-size:1.72rem}.entry-content figure{margin-top:28px!important}.entry-content figure img{border-radius:14px;aspect-ratio:4/3}.entry-content>section#identitas figure img,.entry-content>section#kepercayaan figure img{aspect-ratio:4/3}.footer-inner{grid-template-columns:1fr}.footer-links{grid-template-columns:1fr 1fr}.content-column table{display:block;overflow-x:auto;white-space:normal}th,td{min-width:150px}.custom-logo{max-width:210px}}
@media(max-width:370px){.custom-logo{max-width:192px}.footer-links{grid-template-columns:1fr}.entry-content>section{padding-left:15px;padding-right:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.menu-toggle span,.menu-toggle:before,.menu-toggle:after,.primary-nav{transition:none}}
.custom-logo{width:300px;max-width:100%;height:45px;object-fit:contain}
@media(max-width:980px){.custom-logo{width:252px;height:38px}}
@media(max-width:370px){.custom-logo{width:230px}}
.header-inner{max-width:1360px}.primary-nav a{padding:.42rem .56rem;font-size:.8rem}
@media(max-width:1240px) and (min-width:981px){.header-inner{height:58px;padding:0 18px}.custom-logo{width:252px;height:38px}.menu-toggle{display:block}.primary-nav{position:fixed;inset:58px 0 auto;background:var(--deep);padding:14px 18px 22px;border-top:1px solid rgba(255,255,255,.1);transform:translateY(-120%);visibility:hidden;transition:.2s}.primary-nav.is-open{transform:translateY(0);visibility:visible}.primary-nav ul{display:block}.primary-nav a{font-size:1rem;padding:.65rem .8rem}.nav-open{overflow:hidden}}