/* Percaya Cuan — Design System
   Tema: klasik & elegan · hitam + hijau tua + emas (premium) */
:root{
  --black:#080a08;--panel:#0e1410;--panel-2:#121a14;--green-deep:#0c3a26;--green:#15543a;
  --green-glow:rgba(24,90,62,.55);--gold:#cda765;--gold-2:#ecd49a;
  --gold-line:rgba(205,167,101,.28);--gold-line-soft:rgba(205,167,101,.16);
  --ivory:#f4f1e7;--text:#dcded3;--sage:#9aa89d;--line:#22392d;--line-soft:#18271f;
  --display:'Cormorant Garamond',Georgia,serif;--body:'Jost',system-ui,-apple-system,sans-serif;
  --wrap:1160px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--body);font-weight:400;color:var(--text);line-height:1.7;
  background:radial-gradient(1200px 600px at 50% -200px,rgba(21,84,58,.30),transparent 70%),var(--black);
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
img,svg{display:block}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px}
.eyebrow{font-size:.72rem;font-weight:500;letter-spacing:.32em;text-transform:uppercase;color:var(--gold)}


/* === ASTRA OVERRIDES === */
body,.ast-plain-container,.ast-separate-container,.ast-container,#content,.site-content,#primary,#secondary{background:transparent!important;background-color:transparent!important}
.ast-separate-container{background-color:var(--black)!important}
.ast-separate-container .ast-article-post,.ast-separate-container .ast-article-single{background:var(--panel)!important;border:1px solid var(--line)!important}
.entry-content,.ast-article-inner{background:transparent!important}
.ast-container{padding-left:0!important;padding-right:0!important}
.site-main{margin:0!important}
.ast-separate-container #primary,.ast-separate-container.ast-left-sidebar #primary,.ast-separate-container.ast-right-sidebar #primary{margin:0!important;padding:0!important}
.ast-separate-container .ast-article-post,.ast-separate-container .ast-article-single{border-radius:0!important;padding:0!important}
.ast-separate-container .ast-author-box,.ast-separate-container .ast-404-layout-1,.ast-separate-container .no-results{padding:0!important}
#page{background:var(--black)!important}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--body);font-weight:500;font-size:.9rem;letter-spacing:.05em;padding:14px 28px;border:1px solid var(--gold);transition:transform .18s ease,background .25s,color .25s,box-shadow .25s;cursor:pointer}
.btn-gold{background:linear-gradient(180deg,var(--gold-2),var(--gold));color:#1a1408;border-color:var(--gold-2)}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 14px 30px -12px rgba(205,167,101,.5)}
.btn-line{background:transparent;color:var(--gold-2)}
.btn-line:hover{background:rgba(205,167,101,.1);transform:translateY(-2px)}

/* Header */
.site-header{background:rgba(8,10,8,.78)!important;backdrop-filter:blur(14px);border-bottom:1px solid var(--gold-line-soft)!important}
.ast-site-identity .site-title,.ast-site-identity .site-title a{font-family:var(--display)!important;font-weight:600!important;font-size:1.5rem!important;color:var(--ivory)!important}
.ast-site-identity .site-description{font-size:.56rem!important;letter-spacing:.3em!important;text-transform:uppercase!important;color:var(--sage)!important}
.main-header-menu a{color:var(--ivory)!important;opacity:.82}
.main-header-menu a:hover{color:var(--gold-2)!important;opacity:1}
.main-header-menu .current-menu-item a{color:var(--gold)!important}

/* Hero */
.hero{padding:104px 0 100px;position:relative;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
.hero h1{font-family:var(--display);font-weight:600;font-size:clamp(2.9rem,5.6vw,4.7rem);line-height:1.02;letter-spacing:-.01em;margin:24px 0 0;color:var(--ivory)}
.hero h1 em{font-style:italic;color:var(--gold-2)}
.hero p.lede{font-size:1.16rem;color:var(--sage);max-width:42ch;margin:28px 0 36px}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap}
.hero-trust{display:flex;align-items:center;gap:18px;margin-top:34px;color:var(--sage);font-size:.82rem;letter-spacing:.04em;flex-wrap:wrap}
.hero-trust span{display:flex;align-items:center;gap:9px}
.hero-trust span::before{content:"";width:5px;height:5px;background:var(--gold);transform:rotate(45deg)}

/* Hero feature card */
.hero-feature{position:relative;background:linear-gradient(160deg,var(--panel-2),var(--green-deep));border:1px solid var(--gold-line);padding:44px 40px 40px;box-shadow:0 40px 80px -40px rgba(0,0,0,.9)}
.hero-feature .label{font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.hero-feature h2{font-family:var(--display);font-weight:600;font-size:2.05rem;line-height:1.18;color:var(--ivory);margin:18px 0 14px}
.hero-feature p{color:var(--text);font-size:.98rem;margin-bottom:24px}
.hero-feature .meta{display:flex;gap:14px;align-items:center;color:var(--sage);font-size:.8rem;letter-spacing:.05em;border-top:1px solid var(--line);padding-top:20px}
.hero-feature .meta b{color:var(--gold-2);font-weight:500}
.hero-feature .read-link{display:inline-flex;align-items:center;gap:8px;color:var(--gold-2);font-weight:500;font-size:.92rem;margin-bottom:22px}

/* Section */
.sec{padding:104px 0}
.sec.green{background:linear-gradient(180deg,var(--green-deep),#0a2a1c);border-top:1px solid var(--gold-line-soft);border-bottom:1px solid var(--gold-line-soft)}
.sec-head{max-width:640px;margin:0 auto 60px;text-align:center}
.sec-head h2{font-family:var(--display);font-weight:600;font-size:clamp(2.2rem,4.2vw,3.2rem);line-height:1.06;letter-spacing:-.01em;margin:18px 0 14px;color:var(--ivory)}
.sec-head p{color:var(--sage);font-size:1.05rem}
.ornament{display:flex;align-items:center;gap:14px;justify-content:center;margin-bottom:18px}
.ornament::before,.ornament::after{content:"";height:1px;width:60px;background:linear-gradient(90deg,transparent,var(--gold))}
.ornament::after{background:linear-gradient(90deg,var(--gold),transparent)}
.ornament i{width:7px;height:7px;border:1px solid var(--gold);transform:rotate(45deg);flex:none}

/* Categories grid */
.cats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.cat-card{position:relative;background:linear-gradient(180deg,var(--panel),var(--black));border:1px solid var(--line);padding:38px 30px 34px;transition:transform .22s ease,border-color .25s,box-shadow .25s}
.cat-card:hover{transform:translateY(-6px);border-color:var(--gold);box-shadow:0 28px 50px -32px rgba(0,0,0,.9)}
.cat-card .ic{width:54px;height:54px;border:1px solid var(--gold-line);border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:24px}
.cat-card h3{font-family:var(--display);font-weight:600;font-size:1.55rem;color:var(--ivory);margin-bottom:10px}
.cat-card p{font-size:.92rem;color:var(--sage);line-height:1.6}
.cat-card .more{display:inline-block;margin-top:18px;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}

/* Articles grid */
.arts{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.art-card{position:relative;background:var(--panel-2);border:1px solid var(--line);transition:transform .22s ease,border-color .25s,box-shadow .25s}
.art-card::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--gold);opacity:.6;transition:opacity .25s}
.art-card:hover{transform:translateY(-7px);border-color:var(--gold);box-shadow:0 30px 56px -32px rgba(0,0,0,.9)}
.art-card:hover::before{opacity:1}
.art-card .body{padding:32px 30px 34px}
.art-card .cat-label{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:16px}
.art-card h3{font-family:var(--display);font-weight:600;font-size:1.5rem;line-height:1.2;color:var(--ivory);margin-bottom:13px}
.art-card p{font-size:.93rem;color:var(--sage)}
.art-card .read-link{display:inline-block;margin-top:20px;font-size:.86rem;color:var(--gold-2);border-bottom:1px solid var(--gold-line);padding-bottom:3px}

/* Trust */
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:46px}
.trust-item{text-align:center}
.trust-item .tic{width:62px;height:62px;margin:0 auto 22px;border:1px solid var(--gold);border-radius:50%;display:flex;align-items:center;justify-content:center}
.trust-item h3{font-family:var(--display);font-weight:600;font-size:1.5rem;color:var(--ivory);margin-bottom:10px}
.trust-item p{color:var(--sage);font-size:.95rem}

/* Newsletter */
.news{text-align:center}
.news-inner{max-width:580px;margin:0 auto}
.news h2{font-family:var(--display);font-weight:600;font-size:clamp(2.1rem,3.8vw,2.9rem);color:var(--ivory);margin:18px 0 12px}
.news p{color:var(--text);margin-bottom:30px}
.news form{display:flex;gap:12px;max-width:460px;margin:0 auto}
.news input{flex:1;padding:15px 18px;background:rgba(0,0,0,.35);border:1px solid var(--line);color:var(--ivory);font-family:var(--body);font-size:.95rem}
.news input:focus{outline:none;border-color:var(--gold)}
.news .note{font-size:.78rem;color:#76847a;margin-top:18px}

/* Page hero */
.page-hero{padding:100px 0 70px;text-align:center;border-bottom:1px solid var(--gold-line-soft)}
.page-hero h1{font-family:var(--display);font-weight:600;font-size:clamp(2.6rem,5.2vw,3.9rem);color:var(--ivory);margin:22px 0 14px}
.page-hero p{color:var(--sage);max-width:54ch;margin:0 auto;font-size:1.05rem}

/* Prose */
.prose{max-width:740px;margin:0 auto;padding:76px 32px 100px}
.prose h2{font-family:var(--display);font-weight:600;font-size:2rem;color:var(--ivory);margin:46px 0 18px;padding-bottom:12px;border-bottom:1px solid var(--gold-line-soft)}
.prose h3{font-family:var(--display);font-weight:600;font-size:1.45rem;color:var(--gold-2);margin:32px 0 12px}
.prose p{color:var(--text);margin:16px 0;line-height:1.9}
.prose ul{margin:18px 0;list-style:none}
.prose li{color:var(--text);position:relative;padding-left:28px;margin:11px 0;line-height:1.75}
.prose li::before{content:"";position:absolute;left:5px;top:.66em;width:6px;height:6px;border:1px solid var(--gold);transform:rotate(45deg)}
.prose a{color:var(--gold-2);border-bottom:1px solid var(--gold-line)}
.prose strong{color:var(--ivory);font-weight:500}
.callout{background:linear-gradient(160deg,var(--panel-2),var(--green-deep));border:1px solid var(--gold-line);border-left:3px solid var(--gold);padding:22px 26px;margin:28px 0;color:var(--ivory)}

/* Footer */
.site-footer{background:var(--panel)!important;border-top:1px solid var(--gold-line-soft)!important;padding:76px 0 34px!important}
.site-footer,.site-footer *{color:var(--sage)!important}
.site-footer h2,.site-footer h3,.site-footer h4{color:var(--gold)!important}

/* Reveal animation */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

/* AMP */
body.amp,html[amp] body{background:var(--black)!important;color:var(--text)!important}
html[amp] .amp-wp-header,html[amp] .ampstart-headerbar{background:var(--panel)!important;border-bottom:1px solid var(--gold-line-soft)!important}
html[amp] .amp-wp-header a,html[amp] .ampstart-headerbar a{color:var(--gold-2)!important}
html[amp] .amp-wp-article-content,html[amp] .cntn-wrp{color:var(--text)!important}
html[amp] .amp-wp-article-content a,html[amp] .cntn-wrp a{color:var(--gold-2)!important}
html[amp] footer,html[amp] .amp-wp-footer{background:var(--panel)!important;color:var(--sage)!important;border-top:1px solid var(--line)!important}

/* Responsive */
@media(max-width:920px){
  .hero-grid{grid-template-columns:1fr;gap:48px}
  .cats{grid-template-columns:1fr 1fr}
  .arts{grid-template-columns:1fr;max-width:480px;margin:0 auto}
  .trust-grid{grid-template-columns:1fr;gap:38px;max-width:400px;margin:0 auto}
}
@media(max-width:540px){
  .wrap{padding:0 22px}
  .cats{grid-template-columns:1fr}
  .news form{flex-direction:column}
  .hero{padding:80px 0 76px}
  .hero-feature{padding:36px 26px 30px}
}

/* Full-width hero image */
.entry-content > figure.wp-block-image:first-child,
.entry-content > figure.size-full:first-child {
    width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    max-width: none !important;
}
.entry-content > figure.wp-block-image:first-child img,
.entry-content > figure.size-full:first-child img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
}


/* FEATURED IMAGE — display nicely, not full-bleed crop */
.ast-single-post-featured-section img {
    width: 100% !important;
    height: auto !important;
    max-height: 420px !important;
    object-fit: contain !important;
    border-radius: 8px !important;
}
.ast-single-post-featured-section + article {
    margin-top: 1.5em !important;
}

/* === MOBILE MENU FIXES v2 — strong specificity === */

/* OVERRIDE ASTRA INLINE #ffffff backgrounds */
.ast-mobile-popup-drawer.active .ast-mobile-popup-inner {
    background-color: #0e1410 !important;
}
.ast-mobile-header-wrap .ast-mobile-header-content,
.ast-desktop-header-content {
    background-color: #0e1410 !important;
}
.ast-mobile-popup-drawer .ast-mobile-popup-content,
.ast-mobile-popup-drawer .ast-mobile-popup-header,
.ast-mobile-popup-drawer .ast-mobile-header-content {
    background-color: #0e1410 !important;
}
.ast-mobile-popup-drawer {
    background-color: rgba(0,0,0,.65) !important;
}

/* All text in drawer — ivory */
.ast-mobile-popup-drawer,
.ast-mobile-popup-drawer *,
.ast-mobile-popup-content,
.ast-mobile-popup-content *,
.ast-mobile-header-content,
.ast-mobile-header-content * {
    color: #f4f1e7 !important;
}
.ast-mobile-popup-drawer a:hover,
.ast-mobile-popup-content a:hover,
.ast-mobile-header-content a:hover {
    color: #ecd49a !important;
}

/* Menu items separator */
.ast-mobile-popup-drawer .menu-item {
    border-bottom: 1px solid #22392d !important;
}

/* Close button */
.ast-mobile-popup-drawer.active .menu-toggle-close {
    color: #f4f1e7 !important;
}

/* Hamburger toggle icon */
[data-section="section-header-mobile-trigger"] .ast-button-wrap .ast-mobile-menu-trigger-minimal {
    color: #ecd49a !important;
    border: 1px solid rgba(205,167,101,.28) !important;
    border-radius: 4px !important;
}
[data-section="section-header-mobile-trigger"] .ast-button-wrap .mobile-menu-toggle-icon .ast-mobile-svg {
    fill: #ecd49a !important;
}

/* Mobile header bar */
.ast-mobile-header-wrap .ast-primary-header-bar {
    background: rgba(8,10,8,.78) !important;
    backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(205,167,101,.16) !important;
}


/* === NAVBAR GOLD BUTTONS (Daftar / Login) === */
.main-header-menu .btn-gold-nav a,
.main-header-menu .btn-line-nav a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-weight: 500 !important;
    font-size: .85rem !important;
    letter-spacing: .04em !important;
    padding: 8px 20px !important;
    border-radius: 6px !important;
    transition: all .2s ease !important;
    line-height: 1.4 !important;
    margin-left: 6px !important;
}
.main-header-menu .btn-gold-nav a {
    background: linear-gradient(180deg, #ecd49a, #cda765) !important;
    background-color: #cda765 !important;
    color: #1a1408 !important;
    border: 1px solid #ecd49a !important;
    opacity: 1 !important;
}
.main-header-menu .btn-gold-nav a:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px -8px rgba(205,167,101,.5) !important;
    color: #1a1408 !important;
    background-color: #ecd49a !important;
}
.main-header-menu .btn-line-nav a {
    background: transparent !important;
    background-color: transparent !important;
    color: #ecd49a !important;
    border: 1px solid rgba(205,167,101,.4) !important;
    opacity: 1 !important;
}
.main-header-menu .btn-line-nav a:hover {
    background: rgba(205,167,101,.1) !important;
    border-color: #ecd49a !important;
    color: #ecd49a !important;
    transform: translateY(-2px) !important;
}
