/* =====================================================================
   GML NEXUS — tema bersama untuk semua halaman selain index.php
   Memakai token desain yang sama dengan index.php (paper / forest / lime / tangerine).
   Dimuat SEBELUM Tailwind CDN, jadi semua aturan diberi prefix body.nx-skin
   agar spesifisitasnya lebih tinggi dari utility Tailwind.
   ===================================================================== */
:root{
  --paper:#f3efe6;--paper2:#e9e3d4;--card:#fbf9f3;--ink:#101512;--mute:#5b645e;
  --forest:#0c2b21;--forest2:#14402f;--lime:#c9f26b;--tang:#ff7a2f;--line:rgba(16,21,18,.13);
  --f-d:'Bricolage Grotesque','Manrope',sans-serif;--f-b:'Manrope','Inter',sans-serif;
  --ease:cubic-bezier(.22,.85,.28,1);--r:28px;
  --sh1:0 1px 2px rgba(12,43,33,.06),0 8px 24px -12px rgba(12,43,33,.18);
  --sh2:0 2px 4px rgba(12,43,33,.06),0 28px 60px -24px rgba(12,43,33,.35);
}

/* ---------- dasar ---------- */
body.nx-skin{
  font-family:var(--f-b)!important;color:var(--ink);line-height:1.6;
  background-color:var(--paper)!important;
  background-image:
    radial-gradient(900px 520px at 100% -8%,rgba(201,242,107,.34),transparent 60%),
    radial-gradient(760px 480px at -10% 8%,rgba(255,122,47,.12),transparent 60%);
  background-repeat:no-repeat;background-attachment:fixed;
  -webkit-font-smoothing:antialiased;
}
body.nx-skin ::selection{background:var(--lime);color:var(--ink)}
body.nx-skin :focus-visible{outline:2px solid var(--tang);outline-offset:3px}
body.nx-skin h1,body.nx-skin h2,body.nx-skin h3,body.nx-skin h4{font-family:var(--f-d);letter-spacing:-.035em;text-wrap:balance}
body.nx-skin h1{line-height:1.02}
body.nx-skin ::-webkit-scrollbar{width:11px;height:11px}
body.nx-skin ::-webkit-scrollbar-track{background:var(--paper2)}
body.nx-skin ::-webkit-scrollbar-thumb{background:var(--forest2);border-radius:99px;border:3px solid var(--paper2)}

/* progress bar scroll */
#nxProg{position:fixed;left:0;top:0;height:3px;width:0;z-index:99999;background:linear-gradient(90deg,var(--lime),var(--tang));transition:width .1s linear}

/* ---------- peta warna: hijau lama -> palet Nexus ---------- */
body.nx-skin .text-green-500,body.nx-skin .text-green-600,body.nx-skin .text-green-700,body.nx-skin .text-green-800,
body.nx-skin .text-emerald-600,body.nx-skin .text-emerald-700{color:var(--forest2)!important}
body.nx-skin .bg-green-50,body.nx-skin .bg-green-100,body.nx-skin .bg-emerald-50,body.nx-skin .bg-emerald-100{background-color:rgba(201,242,107,.38)!important}
body.nx-skin .bg-green-500,body.nx-skin .bg-green-600,body.nx-skin .bg-green-700,body.nx-skin .bg-green-800,
body.nx-skin .bg-emerald-600,body.nx-skin .bg-emerald-700{background-color:var(--forest)!important;color:#fff}
body.nx-skin .bg-green-600:hover,body.nx-skin .bg-green-700:hover,body.nx-skin .bg-green-800:hover,
body.nx-skin .hover\:bg-green-600:hover,body.nx-skin .hover\:bg-green-700:hover,body.nx-skin .hover\:bg-green-800:hover,
body.nx-skin .hover\:bg-emerald-700:hover{background-color:var(--tang)!important;color:#fff!important}
body.nx-skin .hover\:text-green-600:hover,body.nx-skin .hover\:text-green-700:hover,body.nx-skin .group:hover .group-hover\:text-green-600{color:var(--tang)!important}
body.nx-skin .border-green-100,body.nx-skin .border-green-200,body.nx-skin .border-green-600,body.nx-skin .border-green-700{border-color:rgba(20,64,47,.28)!important}
body.nx-skin .bg-zinc-900,body.nx-skin .bg-slate-900,body.nx-skin .bg-black{background-color:var(--ink)}
body.nx-skin .bg-zinc-900:hover,body.nx-skin .bg-slate-900:hover{background-color:var(--forest2)}

/* permukaan & garis */
body.nx-skin .bg-zinc-50,body.nx-skin .bg-slate-50,body.nx-skin .bg-slate-100,body.nx-skin .bg-zinc-100{background-color:transparent!important}
body.nx-skin .bg-white{background-color:var(--card)}
body.nx-skin .border-zinc-100,body.nx-skin .border-zinc-200,body.nx-skin .border-slate-100,body.nx-skin .border-slate-200,body.nx-skin .border-gray-200{border-color:var(--line)!important}
body.nx-skin .text-zinc-400,body.nx-skin .text-zinc-500,body.nx-skin .text-zinc-600,body.nx-skin .text-slate-500,body.nx-skin .text-slate-600{color:var(--mute)!important}
body.nx-skin .text-zinc-800,body.nx-skin .text-zinc-900,body.nx-skin .text-slate-800,body.nx-skin .text-slate-900{color:var(--ink)}
body.nx-skin .shadow-sm,body.nx-skin .shadow,body.nx-skin .shadow-md{box-shadow:var(--sh1)!important}
body.nx-skin .shadow-lg,body.nx-skin .shadow-xl,body.nx-skin .shadow-2xl{box-shadow:var(--sh2)!important}

/* ---------- navbar halaman publik ---------- */
body.nx-skin nav.sticky,body.nx-skin header.sticky{
  background:rgba(243,239,230,.78)!important;backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);
  border-bottom:1px solid var(--line)!important;
}
body.nx-skin nav.sticky h1{font-family:var(--f-d);letter-spacing:-.03em;color:var(--forest)!important}
body.nx-skin nav.sticky a[href="index.php"]:not([class*="nx-"]),
body.nx-skin nav.sticky a[class*="bg-zinc-900"]{background:var(--forest)!important;color:var(--lime)!important;border-radius:999px;padding:.7rem 1.3rem;transition:transform .35s var(--ease),background .3s}
body.nx-skin nav.sticky a[class*="bg-zinc-900"]:hover{background:var(--tang)!important;color:#fff!important;transform:translateY(-2px)}

/* header halaman (judul besar) */
body.nx-skin main > header,body.nx-skin body > header.border-b{position:relative}
body.nx-skin header.border-b.bg-white,body.nx-skin header[class*="py-16"]{
  background:var(--forest)!important;color:#eef3ea;border:0!important;overflow:hidden;position:relative;
  border-radius:0 0 clamp(28px,5vw,64px) clamp(28px,5vw,64px);padding-top:clamp(64px,9vw,120px)!important;padding-bottom:clamp(64px,9vw,120px)!important;
}
body.nx-skin header.border-b.bg-white::before,body.nx-skin header[class*="py-16"]::before{
  content:"";position:absolute;inset:auto -10% -55% auto;width:560px;height:560px;border-radius:50%;
  background:radial-gradient(circle,rgba(201,242,107,.28),transparent 65%);pointer-events:none}
body.nx-skin header.border-b.bg-white h1,body.nx-skin header[class*="py-16"] h1{color:#fff;font-size:clamp(2.6rem,7vw,5.6rem)!important;letter-spacing:-.045em}
body.nx-skin header.border-b.bg-white h1 span,body.nx-skin header[class*="py-16"] h1 span{color:var(--lime)!important}
body.nx-skin header.border-b.bg-white p,body.nx-skin header[class*="py-16"] p{color:rgba(238,243,234,.72)!important}
body.nx-skin header.border-b.bg-white .rounded-full,body.nx-skin header[class*="py-16"] .rounded-full{
  background:rgba(201,242,107,.14)!important;color:var(--lime)!important;border:1px solid rgba(201,242,107,.35);letter-spacing:.18em}

/* ---------- kartu ---------- */
body.nx-skin article{
  background:var(--card)!important;border:1px solid var(--line)!important;border-radius:var(--r)!important;
  box-shadow:var(--sh1);transition:transform .6s var(--ease),box-shadow .6s var(--ease)!important;
}
body.nx-skin article:hover{transform:translateY(-8px)!important;box-shadow:var(--sh2)!important}
body.nx-skin article img{transition:transform 1.1s var(--ease)}
body.nx-skin article:hover img{transform:scale(1.07)}
body.nx-skin article h2,body.nx-skin article h3{font-family:var(--f-d);letter-spacing:-.03em;line-height:1.12}
body.nx-skin [class*="rounded-[2"],body.nx-skin [class*="rounded-[3"]{border-radius:var(--r)!important}

/* ---------- tombol & link aksi ---------- */
body.nx-skin button[type="submit"],body.nx-skin .nx-btn{
  border-radius:999px;font-weight:800;letter-spacing:.01em;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .25s!important;
}
body.nx-skin button[type="submit"]:hover{transform:translateY(-2px);box-shadow:0 14px 30px -12px rgba(12,43,33,.55)}
body.nx-skin button[type="submit"]:active{transform:translateY(0)}
body.nx-skin a[class*="bg-green-"][class*="rounded"],body.nx-skin a[class*="bg-zinc-900"][class*="rounded"]{transition:transform .35s var(--ease),background .25s}
body.nx-skin a[class*="bg-green-"][class*="rounded"]:hover,body.nx-skin a[class*="bg-zinc-900"][class*="rounded"]:hover{transform:translateY(-2px)}

/* ---------- form ---------- */
body.nx-skin input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]),
body.nx-skin select,body.nx-skin textarea{
  background:var(--card);border:1.5px solid var(--line)!important;border-radius:14px!important;color:var(--ink);
  font-family:var(--f-b);transition:border-color .25s,box-shadow .25s,background .25s;
}
body.nx-skin input:focus,body.nx-skin select:focus,body.nx-skin textarea:focus{
  outline:none!important;border-color:var(--forest2)!important;background:#fff;box-shadow:0 0 0 4px rgba(201,242,107,.5)!important}
body.nx-skin label{letter-spacing:.04em}
body.nx-skin input[type="checkbox"],body.nx-skin input[type="radio"]{accent-color:var(--forest2)}
body.nx-skin input[type="file"]{font-family:var(--f-b)}
body.nx-skin input[type="file"]::file-selector-button{background:var(--forest);color:var(--lime);border:0;border-radius:999px;padding:.55rem 1.1rem;font-weight:700;margin-right:12px;cursor:pointer}

/* ---------- tabel (admin & checkout) ---------- */
body.nx-skin table{border-collapse:separate;border-spacing:0;width:100%}
body.nx-skin thead th,body.nx-skin table th{
  background:rgba(12,43,33,.07)!important;color:var(--forest)!important;font-size:11px!important;font-weight:800!important;
  text-transform:uppercase;letter-spacing:.14em;border-bottom:1px solid var(--line)!important}
body.nx-skin tbody tr{transition:background .2s}
body.nx-skin tbody tr:hover{background:rgba(201,242,107,.2)}
body.nx-skin td{border-color:var(--line)!important}

/* ---------- badge status ---------- */
body.nx-skin .bg-red-100,body.nx-skin .bg-red-50{background:rgba(255,122,47,.16)!important}
body.nx-skin .text-red-600,body.nx-skin .text-red-700{color:#c2410c!important}
body.nx-skin .bg-amber-100,body.nx-skin .bg-yellow-100{background:rgba(201,242,107,.5)!important}

/* ---------- admin ---------- */
body.nx-admin nav,body.nx-admin > header{
  background:rgba(243,239,230,.82)!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line)!important}
body.nx-admin aside{background:var(--forest)!important;color:#dfe9e0}
body.nx-admin aside a{border-radius:14px;transition:background .25s,color .25s,transform .3s var(--ease)}
body.nx-admin aside a:hover{background:rgba(201,242,107,.14)!important;color:var(--lime)!important;transform:translateX(3px)}
body.nx-admin .bg-white,body.nx-admin [class*="rounded-2xl"],body.nx-admin [class*="rounded-3xl"]{
  border:1px solid var(--line);border-radius:22px;box-shadow:var(--sh1)}
body.nx-admin h1{font-size:clamp(1.7rem,3vw,2.4rem)}

/* ---------- footer publik (all-news, detail-berita, about) ---------- */
body.nx-public footer,body.nx-public .site-footer{background:var(--forest)!important;color:#dfe9e0;position:relative;overflow:hidden;
  border-radius:clamp(28px,5vw,64px) clamp(28px,5vw,64px) 0 0;margin-top:clamp(40px,6vw,90px)}
body.nx-public footer::after,body.nx-public .site-footer::after{
  content:"";position:absolute;right:-120px;top:-120px;width:420px;height:420px;border-radius:50%;
  background:radial-gradient(circle,rgba(201,242,107,.18),transparent 65%);pointer-events:none}
body.nx-public .footer-heading{color:#fff!important}
body.nx-public .footer-link,body.nx-public .social-link{color:#dfe9e0!important}
body.nx-public .footer-link:hover,body.nx-public .social-link:hover{color:var(--lime)!important}

/* ---------- ABOUT (CSS kustom miliknya) ---------- */
body.nx-about .hero{aspect-ratio:auto!important;min-height:clamp(380px,56vh,620px)!important;border-radius:0 0 clamp(28px,5vw,64px) clamp(28px,5vw,64px);overflow:hidden}
body.nx-about .hero::before{background:linear-gradient(180deg,rgba(12,43,33,.55),rgba(12,43,33,.88))!important}
body.nx-about .hero-title{font-family:var(--f-d)!important;font-weight:700!important;font-size:clamp(3rem,9vw,8rem)!important;letter-spacing:-.05em;top:62%!important;
  text-shadow:0 8px 40px rgba(0,0,0,.35)}
body.nx-about .hero-title::after{content:"";display:block;width:84px;height:6px;border-radius:9px;margin:20px auto 0;background:linear-gradient(90deg,var(--lime),var(--tang))}
body.nx-about .site-navbar .navbar-shell{padding-top:22px}
body.nx-about .nav-link-pill{border-radius:999px!important;transition:background .3s,color .3s,transform .35s var(--ease)}
body.nx-about .nav-link-pill:hover{background:var(--lime)!important;color:var(--ink)!important;transform:translateY(-2px)}
body.nx-about .content{width:min(1080px,100% - 48px)!important;font-size:clamp(1rem,1.15vw,1.12rem)!important;line-height:1.8!important;padding:clamp(56px,8vw,110px) 0!important}
body.nx-about .block{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:clamp(24px,4vw,52px);box-shadow:var(--sh1);margin-bottom:28px!important}
body.nx-about .block h2{font-family:var(--f-d)!important;font-size:clamp(1.5rem,3vw,2.3rem)!important;letter-spacing:-.035em;text-transform:none!important;color:var(--forest);margin-bottom:16px;display:flex;align-items:center;gap:14px}
body.nx-about .block h2::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--tang);box-shadow:0 0 0 6px rgba(255,122,47,.2);flex:none}
body.nx-about .block p{text-align:left!important;color:#2a332d}
body.nx-about section[id]>.max-w-7xl h2,body.nx-about section[id] h2{font-family:var(--f-d)}
body.nx-about section.py-24,body.nx-about section.py-20{position:relative}
body.nx-about section.bg-white{background:var(--card)!important}

/* ---------- animasi muncul ---------- */
.nx-rv{opacity:0;transform:translate3d(0,34px,0);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0ms)}
.nx-rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.nx-rv{opacity:1;transform:none;transition:none}body.nx-skin article,body.nx-skin article img{transition:none!important}}

/* ---------- print: matikan tema ---------- */
@media print{body.nx-skin{background:#fff!important}#nxProg{display:none}}
