/*
Theme Name: MI Nurul Huda Cikampek
Theme URI: https://misnurulhudacikampek.sch.id
Author: Tim IT MIS Nurul Huda Cikampek
Author URI: https://misnurulhudacikampek.sch.id
Description: Tema WordPress serbaguna untuk situs sekolah/madrasah — desain fresh, minimalis modern, bernuansa islami. Seluruh teks dan blok konten beranda bisa ditampilkan/disembunyikan lewat Customizer tanpa kode, punya carousel beranda, dan gambar yang diunggah otomatis menyesuaikan ukuran tampilan (tidak memberatkan loading meski file aslinya besar). Awalnya dikembangkan untuk MIS Nurul Huda Cikampek, dirancang generik agar mudah dipakai sekolah lain.
Version: 1.0.19
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mi-nurul-huda-cikampek
Tags: education, one-column, two-columns, right-sidebar, custom-menu, custom-logo, featured-images, translation-ready

MI Nurul Huda Cikampek Theme. Licensed under GPL v2 or later.
*/

/* =========================================================
   0. RESET & DESIGN TOKENS
   ========================================================= */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;overflow-x:clip;}
body{
  margin:0;
  font-family:var(--minh-font);
  background:var(--minh-bg);
  color:var(--minh-ink);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
  max-width:100%;
}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
ul{margin:0;padding:0;list-style:none;}
button{font:inherit;cursor:pointer;}
input,textarea,select{font:inherit;}
:focus-visible{outline:2px solid var(--minh-primary);outline-offset:2px;}

:root{
  --minh-bg:#FBFAF6;
  --minh-bg-alt:#F1F5F0;
  --minh-white:#FFFFFF;
  --minh-ink:#1D2420;
  --minh-ink-soft:#5B665F;
  --minh-primary:#245C48;
  --minh-primary-dark:#173F30;
  --minh-primary-100:#E7EFE9;
  --minh-accent:#C79A2B;
  --minh-accent-soft:#F4E8C8;
  --minh-line:#E6E3D6;
  --minh-radius-lg:22px;
  --minh-radius:16px;
  --minh-radius-sm:10px;
  --minh-shadow:0 12px 32px -14px rgba(23,63,48,.22);
  --minh-shadow-sm:0 4px 14px -6px rgba(23,63,48,.14);
  --minh-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Inter","Helvetica Neue",Arial,sans-serif;
  --minh-container:1180px;
}

.container{max-width:var(--minh-container);margin:0 auto;padding:0 1.5rem;}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;}
.skip-link{position:absolute;left:-999px;top:0;background:var(--minh-primary);color:#fff;padding:.8em 1.2em;z-index:9999;border-radius:0 0 8px 0;}
.skip-link:focus{left:0;}

/* =========================================================
   1. TYPOGRAPHY
   ========================================================= */
h1,h2,h3,h4{margin:0 0 .5em;font-weight:700;letter-spacing:-.01em;color:var(--minh-primary-dark);}
h1{font-size:clamp(1.9rem,4vw,2.7rem);line-height:1.15;}
h2{font-size:clamp(1.5rem,3vw,2.1rem);line-height:1.2;}
h3{font-size:1.15rem;}
p{margin:0 0 1em;color:var(--minh-ink-soft);}
.eyebrow{display:inline-flex;align-items:center;gap:.5em;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--minh-accent);margin-bottom:.6em;}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--minh-accent);display:inline-block;}
.section-head{max-width:640px;margin:0 auto 2.4rem;text-align:center;}
.section-head p{margin-top:.6rem;}

/* =========================================================
   2. BUTTONS
   ========================================================= */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:.85em 1.6em;border-radius:999px;font-weight:600;font-size:.92rem;border:1px solid transparent;transition:transform .15s ease,box-shadow .15s ease,background .15s ease;}
.btn:hover{transform:translateY(-1px);}
.btn-primary{background:var(--minh-primary);color:#fff;box-shadow:var(--minh-shadow-sm);}
.btn-primary:hover{background:var(--minh-primary-dark);}
.btn-ghost{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.55);backdrop-filter:blur(2px);}
.btn-ghost:hover{background:rgba(255,255,255,.22);}
.btn-outline{background:transparent;color:var(--minh-primary);border-color:var(--minh-primary);}
.btn-outline:hover{background:var(--minh-primary-100);}

/* =========================================================
   3. TOPBAR + HEADER
   ========================================================= */
/* Bungkus topbar + header jadi satu unit yang selalu menempel di atas
   layar saat discroll (tidak ikut naik/hilang), baik di desktop maupun HP. */
.site-header-wrap{position:sticky;top:0;z-index:100;}
.topbar{background:var(--minh-primary-dark);color:rgba(255,255,255,.85);font-size:.78rem;}
.topbar .container{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem;padding-top:.5rem;padding-bottom:.5rem;}
.topbar-info{display:flex;gap:1.4rem;flex-wrap:wrap;}
.topbar-info span{display:inline-flex;align-items:center;gap:.4em;}
.topbar-social{display:flex;gap:.9rem;}
.topbar-social a{opacity:.85;}
.topbar-social a:hover{opacity:1;color:var(--minh-accent);}

.site-header{background:var(--minh-white);border-bottom:1px solid var(--minh-line);z-index:80;}
.site-header .container{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding-top:.85rem;padding-bottom:.85rem;}
.brand{display:flex;align-items:center;gap:.75rem;min-width:0;}
.brand img.custom-logo{width:48px;height:48px;object-fit:contain;border-radius:10px;flex-shrink:0;}
.brand-mark{width:48px;height:48px;border-radius:12px;background:var(--minh-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem;letter-spacing:.02em;flex-shrink:0;}
.brand-text{min-width:0;}
.brand-name{font-weight:700;font-size:1.05rem;color:var(--minh-primary-dark);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.brand-sub{font-size:.72rem;color:var(--minh-ink-soft);letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.main-nav ul{display:flex;align-items:center;gap:.3rem;}
.main-nav a{padding:.6em 1em;border-radius:999px;font-weight:600;font-size:.92rem;color:var(--minh-ink);transition:background .15s ease,color .15s ease;}
.main-nav a:hover{background:var(--minh-primary-100);color:var(--minh-primary-dark);}
.main-nav .current-menu-item>a{background:var(--minh-primary-100);color:var(--minh-primary-dark);}
.main-nav .nav-cta{background:var(--minh-primary);color:#fff;margin-left:.4rem;}
.main-nav .nav-cta:hover{background:var(--minh-primary-dark);color:#fff;}

.menu-toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;padding:.5rem;position:relative;z-index:95;}
.menu-toggle span{width:24px;height:2px;background:var(--minh-ink);border-radius:2px;transition:transform .2s ease,opacity .2s ease;}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.nav-overlay{display:none;}

@media (max-width:900px){
  .menu-toggle{display:flex;}
  .main-nav{position:fixed;inset:0 0 0 30%;background:var(--minh-white);transform:translateX(100%);transition:transform .25s ease;z-index:90;padding:5.5rem 1.5rem 2rem;overflow-y:auto;}
  .main-nav.is-open{transform:translateX(0);box-shadow:-10px 0 30px rgba(0,0,0,.15);}
  .main-nav ul{flex-direction:column;align-items:stretch;gap:.2rem;}
  .main-nav a{display:block;padding:.9em 1em;}
  .main-nav .nav-cta{margin-left:0;margin-top:.6rem;text-align:center;}
  .topbar-info{display:none;}

  .nav-overlay{display:block;position:fixed;inset:0;background:rgba(15,23,42,.45);opacity:0;pointer-events:none;transition:opacity .25s ease;z-index:85;}
  .nav-overlay.is-open{opacity:1;pointer-events:auto;}
  body.menu-is-open{overflow:hidden;}
}

/* =========================================================
   4. HERO CAROUSEL
   ========================================================= */
.hero-carousel{position:relative;overflow:hidden;background:var(--minh-primary-dark);}
.hero-slides{position:relative;height:560px;}
@media (max-width:700px){.hero-slides{height:460px;}}
.hero-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .7s ease;display:flex;align-items:center;z-index:1;}
.hero-slide.is-active{opacity:1;visibility:visible;z-index:2;}
.hero-slide-bg{position:absolute;inset:0;background-size:cover;background-position:center;}
.hero-slide-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(15,38,29,.88) 0%,rgba(15,38,29,.62) 45%,rgba(15,38,29,.32) 100%);}
.hero-slide-noimg .hero-slide-bg{background:radial-gradient(circle at 15% 20%,rgba(199,154,43,.25),transparent 45%),linear-gradient(120deg,var(--minh-primary-dark),var(--minh-primary) 70%);}
.hero-slide-content{position:relative;z-index:2;max-width:620px;padding:0 1.5rem;margin:0 auto;width:100%;}
.hero-slide-content .container{padding:0;}
.hero-slide-inner{max-width:600px;}
.hero-slide h1,.hero-slide h2{color:#fff;margin-bottom:.5em;}
.hero-slide p{color:rgba(255,255,255,.88);font-size:1.05rem;max-width:520px;}
.hero-slide-actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.4rem;}
.hero-eyebrow{color:var(--minh-accent);font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:.75rem;margin-bottom:.7em;display:inline-block;}

.hero-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.4);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.1rem;transition:background .15s ease;}
.hero-nav:hover{background:rgba(255,255,255,.32);}
.hero-prev{left:1.2rem;}
.hero-next{right:1.2rem;}
@media (max-width:700px){.hero-nav{width:36px;height:36px;}}

.hero-dots{position:absolute;bottom:1.4rem;left:0;right:0;z-index:3;display:flex;justify-content:center;gap:.5rem;}
.hero-dots button{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.45);border:0;padding:0;transition:background .15s ease,width .15s ease;}
.hero-dots button.is-active{background:#fff;width:22px;border-radius:6px;}

/* =========================================================
   5. INFO STRIP
   ========================================================= */
.info-strip{background:var(--minh-primary-100);border-bottom:1px solid var(--minh-line);}
.info-strip .container{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 2.2rem;padding-top:.9rem;padding-bottom:.9rem;font-size:.85rem;color:var(--minh-primary-dark);font-weight:600;}
.info-strip span{display:inline-flex;align-items:center;gap:.45em;}
.info-strip .dot{width:5px;height:5px;border-radius:50%;background:var(--minh-accent);}

/* =========================================================
   6. SECTIONS / CARDS
   ========================================================= */
.section{padding:4.5rem 0;}
.section-alt{background:var(--minh-bg-alt);}
.pattern-corner{position:relative;}
.pattern-corner::before{content:"";position:absolute;top:0;right:0;width:180px;height:180px;background:radial-gradient(circle,var(--minh-accent-soft) 0%,transparent 70%);opacity:.6;pointer-events:none;}

.grid{display:grid;gap:1.5rem;}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr));}
@media (max-width:900px){.grid-3,.grid-4{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:560px){.grid-2,.grid-3,.grid-4{grid-template-columns:minmax(0,1fr);}}

.card{background:var(--minh-white);border:1px solid var(--minh-line);border-radius:var(--minh-radius);padding:1.8rem;transition:box-shadow .2s ease,transform .2s ease;}
.card:hover{box-shadow:var(--minh-shadow);transform:translateY(-3px);}
.card-icon{width:52px;height:52px;border-radius:14px;background:var(--minh-primary-100);color:var(--minh-primary);display:flex;align-items:center;justify-content:center;font-size:1.4rem;margin-bottom:1rem;}
.card h3{margin-bottom:.4em;}
.card p{margin-bottom:0;font-size:.92rem;}

/* Sambutan */
.sambutan{display:grid;grid-template-columns:280px 1fr;gap:2.5rem;align-items:center;background:var(--minh-white);border:1px solid var(--minh-line);border-radius:var(--minh-radius-lg);padding:2.5rem;}
@media (max-width:760px){.sambutan{grid-template-columns:1fr;text-align:center;}}
.sambutan-photo{width:100%;aspect-ratio:1/1;border-radius:var(--minh-radius);object-fit:cover;background:var(--minh-primary-100);display:flex;align-items:center;justify-content:center;color:var(--minh-primary);font-size:.85rem;text-align:center;padding:1rem;}
.sambutan blockquote{margin:0 0 1rem;font-size:1.15rem;color:var(--minh-ink);font-style:italic;position:relative;padding-left:1.2rem;border-left:3px solid var(--minh-accent);}
.sambutan-role{font-weight:700;color:var(--minh-primary-dark);}
.sambutan-role span{display:block;font-weight:400;color:var(--minh-ink-soft);font-size:.85rem;}

/* Statistik */
.stat-card{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35rem;}
.stat-num{font-size:2.4rem;font-weight:800;color:var(--minh-primary);line-height:1.1;position:relative;padding-bottom:.5rem;}
.stat-num::after{content:"";display:block;width:32px;height:3px;border-radius:3px;background:var(--minh-accent);margin:.6rem auto 0;position:absolute;left:50%;bottom:0;transform:translateX(-50%);}
.stat-label{font-size:.88rem;color:var(--minh-ink-soft);font-weight:600;}

/* Berita */
.post-card{background:var(--minh-white);border:1px solid var(--minh-line);border-radius:var(--minh-radius);overflow:hidden;transition:box-shadow .2s ease,transform .2s ease;}
.post-card:hover{box-shadow:var(--minh-shadow);transform:translateY(-3px);}
.post-card-thumb{aspect-ratio:16/10;background:var(--minh-primary-100);overflow:hidden;}
.post-card-thumb img{width:100%;height:100%;object-fit:cover;}
.post-card-body{padding:1.3rem;}
.post-card-date{font-size:.75rem;color:var(--minh-accent);font-weight:700;letter-spacing:.06em;text-transform:uppercase;}
.post-card h3{margin:.4em 0;font-size:1.02rem;}
.post-card h3 a:hover{color:var(--minh-primary);}
.post-card p{font-size:.88rem;margin:0;}

/* CTA */
.cta-band{background:linear-gradient(120deg,var(--minh-primary-dark),var(--minh-primary));border-radius:var(--minh-radius-lg);padding:3rem;display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap;color:#fff;position:relative;overflow:hidden;}
.cta-band::before{content:"";position:absolute;right:-40px;top:-40px;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.06);}
.cta-band h2{color:#fff;margin-bottom:.3em;}
.cta-band p{color:rgba(255,255,255,.85);margin:0;}

/* Peta */
.map-wrap{border-radius:var(--minh-radius-lg);overflow:hidden;border:1px solid var(--minh-line);box-shadow:var(--minh-shadow-sm);}
.map-wrap iframe{width:100%;height:380px;border:0;display:block;}

/* =========================================================
   7. INNER PAGES
   ========================================================= */
.page-header{background:var(--minh-primary-100);padding:2.6rem 0;border-bottom:1px solid var(--minh-line);}
.page-header h1{margin-bottom:.2rem;}
.breadcrumb{font-size:.78rem;color:var(--minh-ink-soft);letter-spacing:.02em;}
.breadcrumb a{color:var(--minh-primary);}

.content-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:3rem;padding-top:3.5rem;padding-bottom:3.5rem;}
/* Jaga-jaga: pastikan padding kanan-kiri konten TIDAK PERNAH hilang,
   berapa pun urutan CSS di-cache/minify oleh plugin caching. */
.container.content-layout{padding-left:1.5rem!important;padding-right:1.5rem!important;}
@media (max-width:480px){
  .container{padding:0 1.1rem;}
  .container.content-layout{padding-left:1.1rem!important;padding-right:1.1rem!important;}
}
.content-layout--full{grid-template-columns:1fr;}
@media (max-width:820px){.content-layout{grid-template-columns:minmax(0,1fr);}}
/* Perbaikan bug: item grid (kolom konten & sidebar) secara bawaan punya
   min-width:auto, jadi kalau ada elemen yang sedikit lebih lebar dari
   kolomnya (gambar, tabel, teks tanpa spasi, dsb) kolom itu melebar
   menembus container. Karena body overflow-x:hidden, kelebihan itu tidak
   memunculkan scroll, tapi malah TERPOTONG di sisi kanan layar — inilah
   penyebab tulisan mepet/tertutup di HP. min-width:0 mencegah pelebaran
   ini dan memaksa konten membungkus (wrap) di dalam kolomnya sendiri. */
.content-layout>*{min-width:0;}

.entry-content{overflow-wrap:anywhere;word-break:break-word;min-width:0;max-width:100%;}
.entry-content h2{margin-top:1.5em;}
.entry-content ul{list-style:disc;padding-left:1.3em;margin-bottom:1.2em;}
.entry-content ul li{margin-bottom:.4em;}
.entry-content img,.entry-content video,.entry-content iframe,.entry-content embed,.entry-content object{max-width:100% !important;width:auto !important;height:auto !important;border-radius:var(--minh-radius);}
/* WordPress core secara bawaan bikin blok perataan "Lebar"/"Penuh" (align-wide/
   align-full) melebar sampai 100vw menembus batas kontainer. Tema ini pakai
   desain kotak konsisten (tidak ada elemen lain yang tembus tepi layar), jadi
   perataan itu dikunci mengikuti lebar kontainer supaya bacaan tetap nyaman. */
.entry-content .alignwide,.entry-content .alignfull{max-width:100%;width:auto;margin-left:0;margin-right:0;left:auto;right:auto;transform:none;}
.entry-content table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;border-collapse:collapse;margin:1.4em 0;}
.entry-content table th,.entry-content table td{border:1px solid var(--minh-line);padding:.6em .8em;text-align:left;font-size:.92rem;white-space:nowrap;}
.entry-content blockquote{border-left:3px solid var(--minh-accent);padding-left:1.2rem;font-style:italic;color:var(--minh-ink-soft);}
.entry-content pre{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:pre-wrap;word-wrap:break-word;}

.sidebar-widgets .widget{background:var(--minh-white);border:1px solid var(--minh-line);border-radius:var(--minh-radius);padding:1.4rem;margin-bottom:1.4rem;}
.sidebar-widgets .widget-title{font-weight:700;color:var(--minh-primary-dark);margin-bottom:.8em;font-size:.85rem;letter-spacing:.05em;text-transform:uppercase;}
.sidebar-widgets input[type="text"],.sidebar-widgets input[type="search"]{width:100%;padding:.6em .8em;border:1px solid var(--minh-line);border-radius:8px;margin-bottom:.6em;}

/* =========================================================
   8. FOOTER
   ========================================================= */
.site-footer{background:var(--minh-primary-dark);color:rgba(255,255,255,.82);margin-top:2rem;}
.footer-top{padding:3.5rem 0 2.5rem;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2.5rem;}
@media (max-width:820px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.footer-grid{grid-template-columns:1fr;}}
.footer-brand{display:flex;align-items:center;gap:.7rem;margin-bottom:1rem;}
.footer-brand img.custom-logo{width:42px;height:42px;object-fit:contain;border-radius:10px;}
.footer-brand-name{color:#fff;font-weight:700;font-size:1.05rem;}
.footer-col h4{color:#fff;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:1rem;}
.footer-col p,.footer-col li{font-size:.88rem;color:rgba(255,255,255,.72);margin-bottom:.6em;}
.footer-col a:hover{color:var(--minh-accent);}
.footer-contact li{display:flex;align-items:flex-start;gap:.6em;}
.footer-contact-icon{width:16px;height:16px;flex:none;margin-top:.2em;color:var(--minh-accent);}
.footer-social{display:flex;gap:.7rem;margin-top:.8rem;}
.footer-social a{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;}
.footer-social a:hover{background:var(--minh-accent);color:var(--minh-primary-dark);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding:1.2rem 0;font-size:.78rem;color:rgba(255,255,255,.6);text-align:center;}

/* =========================================================
   9. MISC (comments, 404, pagination)
   ========================================================= */
.pagination{display:flex;gap:.4rem;margin-top:2rem;flex-wrap:wrap;}
.pagination a,.pagination span{padding:.5em .9em;border:1px solid var(--minh-line);border-radius:8px;font-size:.85rem;}
.pagination .current{background:var(--minh-primary);color:#fff;border-color:var(--minh-primary);}
.comment-list{list-style:none;margin:0;padding:0;}
.comment-list .comment-body{background:var(--minh-white);border:1px solid var(--minh-line);border-radius:var(--minh-radius);padding:1.2rem;margin-bottom:1rem;}
.not-found{text-align:center;padding:5rem 0;}

@media print{.site-header,.site-footer,.hero-carousel{display:none;}}