/*
 * Desain beranda SDIT Nurul Anshar.
 * Semua selector di-scope ke .na supaya tidak bentrok dengan Astra / Elementor kit.
 */
:root{
  --na-g900:#0a3323; --na-g800:#0d4a31; --na-g700:#11643f; --na-g600:#16804f; --na-g100:#e3f0e8; --na-g50:#f1f7f3;
  --na-gold:#e9b72f; --na-cream:#faf8f2;
  --na-ink:#17231d; --na-muted:#5a6a61; --na-line:#dfe6e1;
  --na-radius:18px; --na-shadow:0 10px 30px -12px rgba(10,51,35,.25);
  --na-sans:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --na-serif:"Fraunces",Georgia,"Times New Roman",serif;
}

/* Wadah Elementor: tanpa padding/gap supaya tiap bagian menempel penuh */
body.na-body{background:var(--na-cream)}
.e-con.na-page{padding:0!important;--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;--gap:0px;--row-gap:0px;--column-gap:0px;--kit-widget-spacing:0px;--widgets-spacing:0px;max-width:100%}
.e-con.na-page>.elementor-element{width:100%;max-width:100%;margin:0!important}
.elementor-element.na-sticky{position:sticky;top:var(--wp-admin--admin-bar--height,0px);z-index:50}
/* Halaman lain: top bar + header ada di dalam <header id="masthead"> (Header Footer Elementor).
   Masthead dibuat sticky, digeser ke atas setinggi top bar lewat --na-sticky-top (diisi beranda.js). */
#masthead:has(.na-site){position:sticky;top:var(--na-sticky-top,0px);z-index:99}

/* Dasar */
.na{font:400 16px/1.65 var(--na-sans);color:var(--na-ink);-webkit-font-smoothing:antialiased}
.na *,.na *::before,.na *::after{box-sizing:border-box}
.na img{max-width:100%;display:block;border:0;border-radius:0;box-shadow:none}
.na a{color:inherit;text-decoration:none}
.na h1,.na h2,.na h3{font-family:var(--na-serif);font-weight:600;line-height:1.15;margin:0;letter-spacing:-.01em;color:inherit;text-transform:none}
.na p{margin:0 0 16px}
.na .na-wrap{max-width:1200px;margin:0 auto;padding-inline:24px}
.na .na-eyebrow{display:inline-flex;align-items:center;gap:8px;font:700 12.5px/1 var(--na-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--na-g600)}
.na .na-eyebrow::before{content:"";width:22px;height:2px;background:var(--na-gold);border-radius:2px}
.na.na-sec{padding-block:96px}
.na .na-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:44px}
.na .na-head h2{font-size:clamp(30px,3.6vw,44px);margin-top:12px;max-width:18ch;color:var(--na-ink)}
.na .na-head p{color:var(--na-muted);max-width:48ch;margin:0}
.na .na-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:700 15px/1 var(--na-sans);padding:15px 24px;border-radius:999px;transition:.2s;border:2px solid transparent;white-space:nowrap}
.na .na-btn-gold{background:var(--na-gold);color:var(--na-g900)}
.na .na-btn-gold:hover{background:#f3c847;color:var(--na-g900);transform:translateY(-1px)}
.na .na-btn-green{background:var(--na-g700);color:#fff}
.na .na-btn-green:hover{background:var(--na-g800);color:#fff}
.na .na-btn-ghost{border-color:rgba(255,255,255,.55);color:#fff}
.na .na-btn-ghost:hover{background:rgba(255,255,255,.12);color:#fff}
.na .na-link{font-weight:700;color:var(--na-g700);display:inline-flex;gap:8px;align-items:center}
.na .na-link:hover{color:var(--na-g900)}
.na .na-link svg{transition:.2s}.na .na-link:hover svg{transform:translateX(3px)}
.na svg.na-i{width:18px;height:18px;flex:none}

/* Top bar */
.na.na-topbar{background:var(--na-g900);color:#cfe3d6;font-size:13.5px}
.na.na-topbar .na-wrap{display:flex;justify-content:space-between;align-items:center;gap:8px 16px;min-height:42px;flex-wrap:wrap;padding-block:6px}
.na.na-topbar .na-info{display:flex;gap:6px 26px;flex-wrap:wrap}
.na.na-topbar span{display:inline-flex;gap:7px;align-items:center}
.na.na-topbar svg{width:15px;height:15px;color:var(--na-gold)}
.na.na-topbar .na-soc{display:flex;gap:14px}
.na.na-topbar .na-soc a:hover{color:#fff}

/* Header + menu (output wp_nav_menu) */
.na.na-site{position:relative;background:rgba(250,248,242,.95);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--na-line)}
.na.na-site .na-wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:78px;max-width:1320px}
.na .na-brand{display:flex;align-items:center;gap:12px;flex-shrink:0;white-space:nowrap}
.na .na-brand img{width:52px;height:52px;object-fit:contain}
.na .na-brand b{display:block;font:800 16px/1.15 var(--na-sans);color:var(--na-g900)}
.na .na-brand small{display:block;font-size:12.5px;color:var(--na-muted);font-weight:500}
.na .na-nav ul{list-style:none;margin:0;padding:0}
.na .na-nav .na-menu{display:flex;gap:2px;align-items:center}
.na .na-nav .na-menu>li{position:relative;margin:0}
.na .na-nav .na-menu>li>a{display:flex;align-items:center;gap:4px;padding:10px;font-weight:600;font-size:14px;border-radius:10px;color:#2a3a31;white-space:nowrap}
.na .na-nav .na-menu>li>a:hover,.na .na-nav .na-menu>li.current-menu-item>a{color:var(--na-g700);background:var(--na-g50)}
.na .na-nav .menu-item-has-children>a::after{content:"";width:6px;height:6px;border:solid currentColor;border-width:0 2px 2px 0;transform:translateY(-2px) rotate(45deg);opacity:.55;margin-left:4px}
.na .na-nav .na-menu>li>a[href*="ppdb"]{background:var(--na-g700);color:#fff;border-radius:999px;padding:12px 20px;margin-left:8px}
.na .na-nav .na-menu>li>a[href*="ppdb"]:hover{background:var(--na-g800);color:#fff}
.na .na-nav .sub-menu{position:absolute;top:100%;left:0;min-width:230px;background:#fff;border:1px solid var(--na-line);border-radius:14px;box-shadow:var(--na-shadow);padding:8px;opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s;z-index:5}
.na .na-nav li:hover>.sub-menu,.na .na-nav li:focus-within>.sub-menu{opacity:1;visibility:visible;transform:none}
.na .na-nav .sub-menu a{display:block;padding:9px 12px;border-radius:9px;font-size:14px;color:#33443a}
.na .na-nav .sub-menu a:hover{background:var(--na-g50);color:var(--na-g700)}
.na .na-menu-btn{display:none;background:none;border:0;padding:8px;color:var(--na-g900);cursor:pointer;box-shadow:none}
.na .na-menu-btn svg{width:28px;height:28px}

/* Hero */
.na.na-hero{position:relative;color:#fff;min-height:min(86vh,760px);display:flex;align-items:center;isolation:isolate;overflow:hidden;background:var(--na-g900)}
.na.na-hero .na-hero-bg{position:absolute;inset:0;z-index:-2;background-position:center 45%;background-size:cover}
.na.na-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(95deg,rgba(7,38,26,.95) 0%,rgba(9,48,33,.84) 40%,rgba(9,48,33,.4) 72%,rgba(9,48,33,.2) 100%),linear-gradient(0deg,rgba(7,38,26,.6),transparent 40%)}
.na.na-hero .na-wrap{width:100%;padding-block:90px 150px}
.na .na-award{display:inline-flex;align-items:center;gap:10px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);padding:8px 16px 8px 8px;border-radius:999px;font-size:13.5px;font-weight:600;color:#fff;backdrop-filter:blur(6px)}
.na .na-award i{font-style:normal;background:var(--na-gold);color:var(--na-g900);font-weight:800;border-radius:999px;padding:4px 10px;font-size:12px;flex:none}
.na.na-hero h1{font-size:clamp(40px,6vw,74px);margin:26px 0 20px;max-width:14ch;color:#fff}
.na.na-hero h1 em{font-style:italic;color:var(--na-gold)}
.na.na-hero .na-lead{font-size:clamp(16px,1.5vw,19px);max-width:52ch;color:#dcebe2;margin:0 0 34px}
.na .na-cta{display:flex;gap:14px;flex-wrap:wrap}
.na .na-tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:40px}
.na .na-tags span{font-size:13px;font-weight:600;color:#d8ece0;display:inline-flex;align-items:center;gap:7px}
.na .na-tags span+span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--na-gold);margin-right:4px}

/* Angka sekolah */
.na.na-stats{position:relative;z-index:2;margin-top:-80px}
.na .na-stats-card{background:#fff;border-radius:22px;box-shadow:0 24px 50px -24px rgba(10,51,35,.35);display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden}
.na .na-stat{padding:30px 28px;display:flex;gap:16px;align-items:center}
.na .na-stat+.na-stat{border-left:1px solid var(--na-line)}
.na .na-stat .na-ic{width:52px;height:52px;border-radius:14px;background:var(--na-g50);color:var(--na-g700);display:grid;place-items:center;flex:none}
.na .na-stat .na-ic svg{width:26px;height:26px}
.na .na-stat b{font:700 34px/1 var(--na-serif);color:var(--na-g900);display:block;margin-bottom:4px}
.na .na-stat small{color:var(--na-muted);font-weight:600;font-size:13.5px}

/* Tentang */
.na .na-about{display:grid;grid-template-columns:1fr 1.1fr;gap:72px;align-items:center}
.na .na-photo{position:relative;isolation:isolate;max-width:440px}
.na .na-photo img{border-radius:24px;aspect-ratio:4/5;object-fit:cover;object-position:center 20%;width:100%;height:auto;box-shadow:var(--na-shadow)}
.na .na-photo::before{content:"";position:absolute;inset:26px -26px -26px 26px;border-radius:24px;background:repeating-linear-gradient(45deg,var(--na-g100) 0 2px,transparent 2px 12px);z-index:-1}
.na .na-name{position:absolute;left:-18px;bottom:34px;background:var(--na-g800);color:#fff;border-radius:16px;padding:16px 22px;box-shadow:var(--na-shadow)}
.na .na-name b{display:block;font-size:17px}
.na .na-name small{color:#bcd9c7;font-size:13px}
.na .na-about h2{font-size:clamp(30px,3.6vw,44px);margin:14px 0 22px;color:var(--na-ink)}
.na .na-about p{color:var(--na-muted)}
.na .na-quote{margin:28px 0 30px;padding:22px 26px;background:var(--na-g50);border-left:4px solid var(--na-gold);border-radius:0 14px 14px 0;font:500 19px/1.5 var(--na-serif);color:var(--na-g900)}
.na .na-quote small{display:block;font:700 12px/1 var(--na-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--na-g600);margin-bottom:10px}
.na .na-motto{display:flex;gap:28px;flex-wrap:wrap;margin-bottom:30px}
.na .na-motto div{font-size:14px;color:var(--na-muted)}
.na .na-motto b{display:block;color:var(--na-g900);font-size:15.5px}

/* Video profil */
.na.na-video-sec{background:#fff}
.na .na-video{position:relative;display:block;width:100%;aspect-ratio:16/9;border-radius:24px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(10,51,35,.45);background:var(--na-g900);isolation:isolate;border:0;padding:0;margin:0;cursor:pointer;color:#fff;text-align:left;font:inherit}
.na .na-video img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:.6s}
.na .na-video::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(7,38,26,.85),rgba(7,38,26,.25) 55%,rgba(7,38,26,.35))}
.na .na-video:hover img{transform:scale(1.03)}
.na .na-video .na-play{position:absolute;left:50%;top:50%;width:96px;height:96px;margin:-48px 0 0 -48px;border-radius:50%;background:var(--na-gold);color:var(--na-g900);display:grid;place-items:center;box-shadow:0 0 0 14px rgba(233,183,47,.25);transition:.25s}
.na .na-video:hover .na-play{box-shadow:0 0 0 22px rgba(233,183,47,.2)}
.na .na-video .na-play svg{width:38px;height:38px;margin-left:5px}
.na .na-video .na-cap{position:absolute;left:32px;right:32px;bottom:28px;display:flex;justify-content:space-between;align-items:end;gap:16px;flex-wrap:wrap}
.na .na-video .na-cap b{font:600 clamp(18px,2.2vw,26px)/1.2 var(--na-serif);max-width:28ch}
.na .na-video .na-cap span{font-size:13.5px;font-weight:600;color:#cfe3d6;display:inline-flex;gap:8px;align-items:center}
.na .na-video.is-playing{cursor:default}
.na .na-video.is-playing::before{display:none}
.na .na-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* Program */
.na.na-programs{background:var(--na-g900);color:#fff;position:relative;overflow:hidden}
.na.na-programs::after{content:"";position:absolute;right:-200px;top:-200px;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(233,183,47,.14),transparent 65%);pointer-events:none}
.na.na-programs .na-eyebrow{color:var(--na-gold)}
.na.na-programs .na-head h2{color:#fff}
.na.na-programs .na-head p{color:#b9d2c3}
.na .na-pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;position:relative;z-index:1}
.na .na-pcard{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--na-radius);padding:30px 26px;transition:.25s}
.na .na-pcard:hover{background:rgba(255,255,255,.09);transform:translateY(-4px)}
.na .na-pcard .na-ic{width:54px;height:54px;border-radius:15px;background:var(--na-gold);color:var(--na-g900);display:grid;place-items:center;margin-bottom:22px}
.na .na-pcard .na-ic svg{width:27px;height:27px}
.na .na-pcard h3{font-size:22px;margin-bottom:10px;color:#fff}
.na .na-pcard p{color:#b9d2c3;font-size:15px;margin:0}
.na .na-inov{margin-top:44px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;position:relative;z-index:1;padding-top:32px;border-top:1px solid rgba(255,255,255,.12)}
.na .na-inov>span{font-weight:700;font-size:14px;color:#cfe3d6;margin-right:6px}
.na .na-inov a{font-weight:700;font-size:13.5px;letter-spacing:.04em;padding:9px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.22);color:#fff;transition:.2s}
.na .na-inov a:hover{background:var(--na-gold);color:var(--na-g900);border-color:var(--na-gold)}

/* Prestasi */
.na .na-agrid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:20px}
.na .na-acard{position:relative;border-radius:var(--na-radius);overflow:hidden;min-height:250px;color:#fff;display:flex;align-items:flex-end;isolation:isolate;box-shadow:var(--na-shadow)}
.na .na-acard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:.5s}
.na .na-acard:hover img{transform:scale(1.05)}
.na .na-acard::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(7,38,26,.92),rgba(7,38,26,.1) 65%)}
.na .na-acard .na-t{padding:24px}
.na .na-yr{display:inline-block;background:var(--na-gold);color:var(--na-g900);font-weight:800;font-size:12px;padding:4px 10px;border-radius:999px;margin-bottom:10px}
.na .na-acard h3{font-size:21px;color:#fff}
.na .na-acard.na-big{grid-row:span 2;min-height:520px}
.na .na-acard.na-big h3{font-size:30px;max-width:16ch}
.na .na-acard.na-big p{margin:10px 0 0;color:#d4e7dc;max-width:40ch}

/* Berita */
.na.na-news{background:#fff}
.na .na-ngrid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.na .na-ncard{border-radius:var(--na-radius);overflow:hidden;background:var(--na-cream);border:1px solid var(--na-line);transition:.25s;display:flex;flex-direction:column}
.na .na-ncard:hover{transform:translateY(-4px);box-shadow:var(--na-shadow)}
.na .na-ncard .na-th{aspect-ratio:4/3;overflow:hidden;background:var(--na-g100)}
.na .na-ncard .na-th img{width:100%;height:100%;object-fit:cover;object-position:top}
.na .na-ncard .na-b{padding:22px 24px 26px;display:flex;flex-direction:column;gap:10px;flex:1}
.na .na-ncard .na-cat{font-size:12px;font-weight:700;color:var(--na-g600);letter-spacing:.08em;text-transform:uppercase}
.na .na-ncard h3{font:700 18.5px/1.35 var(--na-sans);color:var(--na-ink)}
.na .na-ncard .na-more{margin-top:auto;padding-top:8px}

/* Galeri */
.na .na-gal{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:210px;gap:14px}
.na .na-gal a{border-radius:14px;overflow:hidden;position:relative}
.na .na-gal img{width:100%;height:100%;object-fit:cover;transition:.5s}
.na .na-gal a:hover img{transform:scale(1.06)}
.na .na-gal .na-w2{grid-column:span 2}.na .na-gal .na-h2{grid-row:span 2}

/* PPDB */
.na.na-ppdb{padding-bottom:96px}
.na .na-ppdb-box{background:linear-gradient(120deg,var(--na-g700),var(--na-g900));border-radius:28px;color:#fff;padding:56px 60px;display:grid;grid-template-columns:1.4fr auto;gap:40px;align-items:center;position:relative;overflow:hidden}
.na .na-ppdb-box::after{content:"";position:absolute;right:-80px;bottom:-120px;width:380px;height:380px;border-radius:50%;border:60px solid rgba(233,183,47,.13);pointer-events:none}
.na .na-ppdb-box h2{font-size:clamp(28px,3.4vw,42px);margin:12px 0 14px;color:#fff}
.na .na-ppdb-box p{color:#cfe3d6;margin:0;max-width:52ch}
.na .na-ppdb-box .na-eyebrow{color:var(--na-gold)}
.na .na-ppdb-box .na-cta{flex-direction:column;gap:12px;position:relative;z-index:1}

/* Footer */
.na.na-footer{background:#08281c;color:#b3cbbd;font-size:15px}
.na.na-footer .na-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:44px;padding-block:72px 52px}
.na.na-footer h4{color:#fff;font:700 15px/1 var(--na-sans);margin:6px 0 20px;letter-spacing:.02em;text-transform:none}
.na.na-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:11px}
.na.na-footer li{margin:0}
.na.na-footer a:hover{color:var(--na-gold)}
.na.na-footer .na-brand b{color:#fff}
.na.na-footer .na-brand small{color:#8fb09e}
.na.na-footer .na-about-f{margin:20px 0 22px;max-width:36ch}
.na.na-footer .na-soc{display:flex;gap:10px}
.na.na-footer .na-soc a{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.07);color:#fff}
.na.na-footer .na-soc a:hover{background:var(--na-gold);color:var(--na-g900)}
.na.na-footer .na-ct li{display:flex;gap:12px}
.na.na-footer .na-ct svg{color:var(--na-gold);margin-top:3px}
.na.na-footer .na-bottom{border-top:1px solid rgba(255,255,255,.08);padding-block:22px;font-size:13.5px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* Tampilan PDF (mis. halaman Karya Ilmiah) */
.na.na-pdf{max-width:1000px;margin:0 auto}
.na.na-pdf iframe{display:block;width:100%;height:85vh;min-height:520px;border:1px solid var(--na-line);border-radius:14px;background:#fff}
.na.na-pdf .na-pdf-actions{display:flex;justify-content:center;margin-top:16px}

/* Responsif */
@media (max-width:1260px){
  .na .na-nav{display:none}
  .na .na-menu-btn{display:block}
  .na.na-site.is-open .na-nav{display:block;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--na-line);box-shadow:var(--na-shadow);max-height:75vh;overflow:auto}
  .na.na-site.is-open .na-nav .na-menu{flex-direction:column;align-items:stretch;padding:12px 16px}
  .na.na-site.is-open .na-nav .sub-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:0 0 6px 14px;min-width:0}
  .na.na-site.is-open .na-nav .na-menu>li>a[href*="ppdb"]{margin:8px 0 0;justify-content:center}
}
@media (max-width:1180px){
  .na .na-pgrid{grid-template-columns:repeat(2,1fr)}
  .na .na-stats-card{grid-template-columns:repeat(2,1fr)}
  .na .na-stat:nth-child(3){border-left:0}
  .na .na-stat:nth-child(n+3){border-top:1px solid var(--na-line)}
  .na.na-footer .na-top{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .na.na-sec{padding-block:72px}
  .na .na-about{grid-template-columns:1fr;gap:56px}
  .na .na-photo{margin-inline:auto}
  .na .na-agrid{grid-template-columns:1fr 1fr}
  .na .na-acard.na-big{grid-column:span 2;grid-row:auto;min-height:380px}
  .na .na-ngrid{grid-template-columns:1fr 1fr}
  .na .na-gal{grid-template-columns:repeat(2,1fr);grid-auto-rows:170px}
  .na .na-ppdb-box{grid-template-columns:1fr;padding:44px 32px}
  .na.na-topbar .na-hide-sm{display:none}
}
@media (max-width:560px){
  .na .na-wrap{padding-inline:18px}
  .na .na-stat{padding:22px 16px;flex-direction:column;align-items:flex-start;gap:12px}
  .na .na-stat b{font-size:28px}
  .na .na-pgrid,.na .na-ngrid,.na .na-agrid{grid-template-columns:1fr}
  .na .na-acard.na-big{grid-column:auto;min-height:420px}
  .na .na-acard.na-big h3{font-size:25px}
  .na.na-footer .na-top{grid-template-columns:1fr}
  .na.na-hero .na-wrap{padding-block:56px 130px}
  .na .na-name{left:-8px}
  .na .na-photo::before{inset:18px -12px -18px 18px}
  .na .na-brand small{display:none}
  .na.na-topbar .na-soc{display:none}
  .na .na-ppdb-box{padding:36px 24px}
}