/*
Theme Name: Penerbit Wreksa Utama
Theme URI: https://penerbitwreksa.com
Author: Penerbit Wreksa Utama
Description: Hybrid theme (klasik + theme.json) untuk Penerbit Wreksa Utama — penerbit karya domain publik. Akar lama, tunas baru. v2.0: design system baru yang lebih segar, minimalis, dan modern.
Version: 2.0.0
Requires at least: 6.2
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: wreksa
*/

/* ================================================================
   WREKSA DESIGN SYSTEM v2
   Dua font saja: Fraunces (display) + Inter (UI).
   Lebih lega, garis lebih sedikit, bayangan lebih halus.
   ================================================================ */

:root{
  --olive:#5A6B47; --olive-deep:#3F4D33;
  --cream:#EFE8D9; --cream-soft:#F6F1E4; --paper:#FCFAF4;
  --terracotta:#C26B47; --terracotta-deep:#9E5236;
  --gold:#B8894A;
  --ink:#1F1A17; --ink-soft:#6B625B;
  --line:rgba(31,26,23,.08);
  --line-strong:rgba(31,26,23,.16);
  --radius:14px;
  --shadow-sm:0 2px 10px rgba(31,26,23,.06);
  --shadow-md:0 10px 30px rgba(31,26,23,.10);
  --ease:cubic-bezier(.22,.61,.36,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0; background:var(--paper); color:var(--ink); font-family:'Inter',sans-serif; font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased;}
img{max-width:100%; height:auto;}
a{color:inherit; text-decoration:none;}
::selection{background:var(--olive); color:var(--cream);}
:focus-visible{outline:2px solid var(--olive); outline-offset:3px; border-radius:4px;}

.serif{font-family:'Fraunces',serif; font-weight:300;}
.display{font-family:'Fraunces',serif; font-weight:300;}

/* Kicker: sekarang Inter kecil, bukan Cormorant */
.wx-kicker{font-family:'Inter',sans-serif; font-weight:600; letter-spacing:.16em; font-size:11px; text-transform:uppercase; color:var(--olive);}

.wx-container{max-width:1200px; margin:0 auto; padding-left:clamp(1.25rem,4vw,2.5rem); padding-right:clamp(1.25rem,4vw,2.5rem);}
.wx-section{padding:clamp(4rem,8vw,7rem) 0;}
.wx-section-min{padding:clamp(4rem,8vw,6.5rem) 0;}
.wx-rule{height:1px; background:var(--line); max-width:1100px; margin:0 auto;}
.divider-leaf{height:1px; background:linear-gradient(90deg,transparent,var(--line-strong) 50%,transparent);}

/* ---------- Tombol: sentence case, tenang ---------- */
.btn-ink,.btn-line,.btn-primary,.btn-ghost{
  display:inline-block; padding:12px 26px; border-radius:999px;
  font-size:14px; font-weight:500; letter-spacing:.01em;
  border:1px solid transparent; cursor:pointer;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .2s, color .2s, border-color .2s;
}
.btn-ink{background:var(--ink); color:var(--paper);}
.btn-ink:hover{transform:translateY(-1px); box-shadow:var(--shadow-md);}
.btn-primary{background:var(--terracotta); color:#fff;}
.btn-primary:hover{background:var(--terracotta-deep); transform:translateY(-1px); box-shadow:var(--shadow-md);}
.btn-line{border-color:var(--line-strong); color:var(--ink); background:transparent;}
.btn-line:hover{border-color:var(--ink);}
.btn-ghost{border-color:rgba(239,232,217,.5); color:var(--cream);}
.btn-ghost:hover{border-color:var(--cream); background:rgba(239,232,217,.08);}

/* Pill meta (status, harga) — kecil & tenang */
.pill{display:inline-block; padding:5px 14px; border-radius:999px; font-size:12px; font-weight:500; letter-spacing:.02em;}
.pill-terra{background:var(--terracotta); color:#fff;}
.pill-olive{background:var(--olive); color:var(--cream);}
.pill-outline{border:1px solid var(--line-strong); color:var(--ink-soft);}

/* ---------- Nav: terang, blur, konsisten di semua halaman ---------- */
.wx-nav,.wx-nav-light{
  background:rgba(252,250,244,.82);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  backdrop-filter:saturate(180%) blur(14px);
  color:var(--ink); border-bottom:1px solid var(--line);
  position:sticky; top:0; z-index:50;
}
.wx-nav-inner{display:flex; align-items:center; justify-content:space-between; padding:.9rem clamp(1.25rem,4vw,2.5rem); max-width:1200px; margin:0 auto;}
.wx-brand{display:flex; align-items:center; gap:.65rem;}
.wx-brand svg{width:24px; height:34px;}
.wx-brand svg line{stroke:var(--olive);}
.wx-brand svg ellipse[fill="#EFE8D9"]{fill:var(--olive);}
.wx-brand-custom img,.custom-logo{max-height:42px; width:auto; display:block;}
.wx-wordmark{font-family:'Fraunces',serif; font-weight:400; font-size:1.15rem; letter-spacing:.01em; text-transform:lowercase; color:var(--ink);}
.wx-menu{display:none; align-items:center; gap:2rem; list-style:none; margin:0; padding:0;}
.wx-menu a{font-size:14px; color:var(--ink); opacity:.65; transition:opacity .2s;}
.wx-menu a:hover{opacity:1;}
@media(min-width:768px){.wx-menu{display:flex;}}
.wx-nav-cta{display:flex; align-items:center; gap:.75rem;}
.wx-nav-cta-text{font-size:13px; font-weight:500; color:var(--olive); border:1px solid rgba(90,107,71,.35); padding:8px 18px; border-radius:999px; transition:all .2s;}
.wx-nav-cta-text:hover{background:var(--olive); color:var(--cream); border-color:var(--olive);}

.wx-inpage-logo{max-width:180px; height:auto; display:block; margin:0 auto;}
.wx-footer-logo{max-height:44px; width:auto; display:block; margin-bottom:.75rem;}

/* ---------- Hero homepage ---------- */
.wx-hero-min{background:var(--paper); text-align:center; padding:clamp(5rem,10vw,8rem) 1.5rem clamp(4rem,8vw,6rem);}
.wx-hero-min .wx-inpage-logo,.wx-hero-min svg{margin:0 auto 2.25rem; width:56px; height:80px;}
.wx-hero-min-kicker{font-family:'Inter',sans-serif; font-weight:600; letter-spacing:.18em; font-size:11px; text-transform:uppercase; color:var(--ink-soft); margin-bottom:1.5rem;}
.wx-hero-min h1{font-family:'Fraunces',serif; font-weight:300; font-size:clamp(3rem,8vw,6rem); line-height:1.02; letter-spacing:-.015em; margin:0 0 1.75rem; color:var(--ink);}
.wx-hero-min h1 em{font-style:italic; color:var(--olive);}
.wx-hero-min p.lead{font-size:clamp(1.05rem,1.6vw,1.2rem); color:var(--ink-soft); max-width:34rem; margin:0 auto 2.5rem; line-height:1.7;}
.wx-hero-min-cta{display:flex; gap:.85rem; justify-content:center; flex-wrap:wrap;}

/* ---------- Chips kategori ---------- */
.wx-browse{max-width:1100px; margin:0 auto; padding:3.5rem 1.5rem; text-align:center;}
.wx-browse-kicker{font-family:'Inter',sans-serif; font-weight:600; letter-spacing:.16em; font-size:11px; text-transform:uppercase; color:var(--ink-soft); margin:0 0 1.5rem;}
.wx-chips{display:flex; flex-wrap:wrap; justify-content:center; gap:.6rem;}
.wx-chip{display:inline-block; padding:9px 20px; border-radius:999px; font-size:13.5px; font-weight:450; border:1px solid var(--line-strong); color:var(--ink); background:transparent; transition:all .2s var(--ease);}
.wx-chip:hover{background:var(--olive); color:var(--cream); border-color:var(--olive); transform:translateY(-1px);}

/* ---------- Heading section ---------- */
.wx-head-min{max-width:1100px; margin:0 auto; padding:0 clamp(1.25rem,4vw,2rem); display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; flex-wrap:wrap;}
.wx-head-min .k{font-family:'Inter',sans-serif; font-weight:600; letter-spacing:.16em; font-size:11px; text-transform:uppercase; color:var(--olive); display:block; margin-bottom:.65rem;}
.wx-head-min h2{font-family:'Fraunces',serif; font-weight:300; font-size:clamp(1.9rem,3.5vw,2.6rem); margin:0; line-height:1.12; letter-spacing:-.01em; color:var(--ink);}
.wx-link-min{font-size:14px; font-weight:500; color:var(--olive); position:relative; padding-bottom:2px;}
.wx-link-min::after{content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:currentColor; transform:scaleX(.35); transform-origin:left; transition:transform .3s var(--ease);}
.wx-link-min:hover::after{transform:scaleX(1);}

.wx-heading{text-align:center; margin-bottom:3rem;}
.wx-heading .wx-kicker{display:block; margin-bottom:.75rem;}
.wx-heading h2{font-family:'Fraunces',serif; font-weight:300; font-size:clamp(2rem,4vw,2.8rem); margin:0; line-height:1.15;}
.wx-heading h2 em{color:var(--olive);}

/* ---------- Sampul buku ---------- */
.wx-covers{display:grid; grid-template-columns:repeat(2,1fr); gap:1.5rem;}
@media(min-width:768px){.wx-covers{grid-template-columns:repeat(3,1fr);}}
@media(min-width:1024px){.wx-covers{grid-template-columns:repeat(6,1fr);}}
.wx-covers.wx-covers-wide{grid-template-columns:repeat(2,1fr);}
@media(min-width:768px){.wx-covers.wx-covers-wide{grid-template-columns:repeat(3,1fr);}}
@media(min-width:1024px){.wx-covers.wx-covers-wide{grid-template-columns:repeat(4,1fr);}}

.wx-covers-min{max-width:1100px; margin:2.5rem auto 0; padding:0 clamp(1.25rem,4vw,2rem); display:grid; grid-template-columns:repeat(2,1fr); gap:1.5rem;}
@media(min-width:640px){.wx-covers-min{grid-template-columns:repeat(3,1fr);}}
@media(min-width:1024px){.wx-covers-min{grid-template-columns:repeat(4,1fr); gap:2rem;}}

.cover{aspect-ratio:2/3; border-radius:6px; overflow:hidden; position:relative; box-shadow:var(--shadow-sm); transition:transform .35s var(--ease), box-shadow .35s var(--ease); display:block;}
.cover:hover{transform:translateY(-6px); box-shadow:var(--shadow-md);}
.cover img{width:100%; height:100%; object-fit:cover;}
.cover-title{position:absolute; inset:0; padding:20px; display:flex; flex-direction:column; justify-content:space-between;}
.cover-genre{font-size:10px; text-transform:uppercase; letter-spacing:.18em; font-weight:600; opacity:.75;}
.cover-name{font-family:'Fraunces',serif; font-weight:300; font-style:italic; font-size:1.25rem; line-height:1.2;}
.cover-author{font-size:10px; margin-top:.5rem; opacity:.75; text-transform:uppercase; letter-spacing:.18em; font-weight:500;}
.cover-caption{font-size:12.5px; color:var(--ink-soft); margin-top:.8rem;}

.bg-terra{background:var(--terracotta); color:var(--cream);}
.bg-terra-deep{background:var(--terracotta-deep); color:var(--cream);}
.bg-olive{background:var(--olive); color:var(--cream);}
.bg-olive-deep{background:var(--olive-deep); color:var(--cream);}
.bg-gold{background:var(--gold); color:var(--cream);}
.bg-cream{background:var(--cream); color:var(--ink); border:1px solid #ddd5c2;}
.bg-cream .cover-genre{color:var(--olive); opacity:1;}
.bg-cream .cover-author{color:var(--ink-soft); opacity:1;}

/* ---------- Tiga prinsip ---------- */
.wx-principles{max-width:1100px; margin:0 auto; padding:0 clamp(1.25rem,4vw,2rem); display:grid; gap:1.25rem; grid-template-columns:1fr;}
@media(min-width:768px){.wx-principles{grid-template-columns:repeat(3,1fr);}}
.wx-principle{background:var(--cream-soft); border-radius:var(--radius); padding:2.25rem 2rem;}
.wx-principle + .wx-principle{border:0;}
.wx-principle .n{font-family:'Inter',sans-serif; font-weight:600; font-size:11px; letter-spacing:.18em; color:var(--terracotta); margin-bottom:1.1rem;}
.wx-principle h3{font-family:'Fraunces',serif; font-weight:400; font-style:italic; font-size:1.35rem; margin:0 0 .6rem; color:var(--ink);}
.wx-principle p{font-size:14px; color:var(--ink-soft); line-height:1.75; margin:0;}

/* ---------- Quote ---------- */
.wx-quote-min{max-width:800px; margin:0 auto; padding:clamp(4.5rem,9vw,7rem) 1.5rem; text-align:center;}
.wx-quote-min h2{font-family:'Fraunces',serif; font-weight:300; font-style:italic; font-size:clamp(1.8rem,3.5vw,2.5rem); line-height:1.3; color:var(--ink); margin:0 0 2rem; letter-spacing:-.01em;}
.wx-quote-min p{font-size:1rem; color:var(--ink-soft); line-height:1.85; margin:0 auto 1.25rem; max-width:40rem;}

/* ---------- CTA band ---------- */
.wx-band{background:var(--olive); color:var(--cream); text-align:center; padding:clamp(4rem,8vw,5.5rem) 1.5rem; position:relative; overflow:hidden;}
.wx-band h2{font-family:'Fraunces',serif; font-weight:300; font-style:italic; font-size:clamp(1.9rem,4vw,2.8rem); margin:0 0 1rem; letter-spacing:-.01em;}
.wx-band p{opacity:.88; max-width:32rem; margin:0 auto 2rem; font-size:15px; line-height:1.7;}
.wx-band .btn-line{border-color:rgba(239,232,217,.45); color:var(--cream);}
.wx-band .btn-line:hover{border-color:var(--cream); background:rgba(239,232,217,.08);}

/* ---------- Split panel (reseller / naskah) ---------- */
.wx-split-min{max-width:1100px; margin:0 auto; padding:clamp(4rem,8vw,5.5rem) clamp(1.25rem,4vw,2rem); display:grid; gap:1.25rem; grid-template-columns:1fr;}
@media(min-width:768px){.wx-split-min{grid-template-columns:1fr 1fr;}}
.wx-panel-min{border:0; border-radius:var(--radius); padding:2.5rem; background:var(--cream-soft); transition:transform .3s var(--ease), box-shadow .3s var(--ease);}
.wx-panel-min:hover{transform:translateY(-3px); box-shadow:var(--shadow-md);}
.wx-panel-min .k{font-family:'Inter',sans-serif; font-weight:600; letter-spacing:.16em; font-size:11px; text-transform:uppercase; color:var(--olive); display:block; margin-bottom:.6rem;}
.wx-panel-min h3{font-family:'Fraunces',serif; font-weight:400; font-style:italic; font-size:1.55rem; margin:0 0 .85rem; color:var(--ink); line-height:1.25;}
.wx-panel-min p{font-size:14px; color:var(--ink-soft); line-height:1.75; margin:0 0 1.5rem;}

/* ---------- Footer ---------- */
.wx-footer{background:var(--olive-deep); color:var(--cream);}
.wx-footer-grid{max-width:1200px; margin:0 auto; padding:clamp(3.5rem,7vw,5rem) clamp(1.25rem,4vw,2.5rem) 3rem; display:grid; grid-template-columns:repeat(2,1fr); gap:2.5rem;}
@media(min-width:768px){.wx-footer-grid{grid-template-columns:2fr 1fr 1fr 1.5fr;}}
.wx-footer .wx-wordmark{font-size:1.4rem; display:block; margin-bottom:.85rem; color:var(--cream);}
.wx-footer-about{grid-column:span 2;}
@media(min-width:768px){.wx-footer-about{grid-column:span 1;}}
.wx-footer p{font-size:13px; opacity:.7; line-height:1.75; max-width:26rem;}
.wx-footer-head{font-family:'Inter',sans-serif; font-weight:600; letter-spacing:.16em; font-size:11px; text-transform:uppercase; opacity:.6; margin:0 0 1rem;}
.wx-footer ul{list-style:none; margin:0; padding:0;}
.wx-footer ul li{margin-bottom:.6rem; font-size:14px;}
.wx-footer ul a{opacity:.8; transition:opacity .2s;}
.wx-footer ul a:hover{opacity:1;}
.wx-newsletter{display:flex; gap:.5rem;}
.wx-newsletter input{flex:1; background:rgba(239,232,217,.08); border:1px solid rgba(239,232,217,.2); border-radius:999px; padding:.6rem 1.1rem; font-size:13px; color:var(--cream); font-family:'Inter',sans-serif;}
.wx-newsletter input::placeholder{color:rgba(239,232,217,.45);}
.wx-newsletter input:focus{outline:0; border-color:rgba(239,232,217,.5);}
.wx-newsletter button{border:0; cursor:pointer; background:var(--terracotta); color:#fff; padding:.6rem 1.1rem; border-radius:999px; font-size:14px; transition:background .2s;}
.wx-newsletter button:hover{background:var(--terracotta-deep);}
.wx-footer-bottom{border-top:1px solid rgba(239,232,217,.12);}
.wx-footer-bottom-inner{max-width:1200px; margin:0 auto; padding:1.25rem clamp(1.25rem,4vw,2.5rem); display:flex; flex-wrap:wrap; justify-content:space-between; gap:.75rem; font-size:12.5px; opacity:.65;}

/* ---------- Hero halaman dalam: terang, bukan blok gelap ---------- */
.wx-page-hero{background:var(--paper); color:var(--ink); position:relative; overflow:hidden; border-bottom:1px solid var(--line);}
.wx-page-hero .grain{display:none;}
.wx-page-hero-inner{position:relative; max-width:1100px; margin:0 auto; padding:clamp(4rem,8vw,6rem) clamp(1.25rem,4vw,2rem) clamp(3rem,6vw,4.5rem);}
.wx-page-hero .wx-kicker{opacity:1;}
.wx-page-hero h1{font-family:'Fraunces',serif; font-weight:300; font-size:clamp(2.4rem,5.5vw,4rem); margin:.75rem 0 0; line-height:1.06; letter-spacing:-.015em; color:var(--ink);}
.wx-page-hero h1 em{color:var(--olive); font-style:italic;}

/* ---------- Prosa / artikel ---------- */
.wx-prose{max-width:720px; margin:0 auto; padding:clamp(3.5rem,7vw,5rem) 1.5rem;}
.wx-prose h2,.wx-prose h3{font-family:'Fraunces',serif; font-weight:400; line-height:1.25; letter-spacing:-.01em;}
.wx-prose p{font-size:1.06rem; line-height:1.9; color:var(--ink);}
.wx-prose blockquote{border-left:2px solid var(--terracotta); margin:2rem 0; padding:.25rem 0 .25rem 1.5rem; font-family:'Fraunces',serif; font-style:italic; font-size:1.15rem; color:var(--ink-soft);}
.wx-prose a{color:var(--terracotta); text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px;}
.wx-prose img{border-radius:10px;}
.wx-prose .alignwide{margin-left:-4rem; margin-right:-4rem; max-width:none;}
@media(max-width:900px){.wx-prose .alignwide{margin-left:0; margin-right:0;}}

/* ---------- Listing jurnal ---------- */
.wx-post-list{max-width:800px; margin:0 auto; padding:clamp(3.5rem,7vw,5rem) 1.5rem; display:grid; gap:2.25rem;}
.wx-post-item{border-bottom:1px solid var(--line); padding-bottom:2.25rem;}
.wx-post-item:last-of-type{border-bottom:0;}
.wx-post-meta{font-size:11px; text-transform:uppercase; letter-spacing:.14em; font-weight:600; color:var(--ink-soft);}
.wx-post-item h2{font-family:'Fraunces',serif; font-weight:300; font-size:1.7rem; margin:.4rem 0 .5rem; line-height:1.2; letter-spacing:-.01em;}
.wx-post-item h2 a{transition:color .2s;}
.wx-post-item h2 a:hover{color:var(--terracotta);}
.wx-post-item p{color:var(--ink-soft); font-size:15px; line-height:1.75;}

/* ---------- Detail buku ---------- */
.wx-book{max-width:1050px; margin:0 auto; padding:clamp(3.5rem,7vw,5.5rem) clamp(1.25rem,4vw,2rem); display:grid; gap:clamp(2.5rem,5vw,4rem); align-items:start;}
@media(min-width:768px){.wx-book{grid-template-columns:340px 1fr;}}
.wx-book-cover .cover{max-width:340px; box-shadow:var(--shadow-md);}
.wx-book h1{font-family:'Fraunces',serif; font-weight:300; font-style:italic; font-size:clamp(2rem,4vw,3rem); margin:.6rem 0 .4rem; line-height:1.12; letter-spacing:-.01em;}
.wx-book-author{font-size:12px; text-transform:uppercase; letter-spacing:.18em; font-weight:600; color:var(--ink-soft); margin-bottom:1.25rem;}
.wx-book-meta{display:flex; flex-wrap:wrap; gap:.5rem; margin:1.25rem 0 1.75rem;}
.wx-book-body{font-size:1rem; line-height:1.9; color:var(--ink);}
.wx-book-actions{display:flex; flex-wrap:wrap; gap:.85rem; margin-top:2rem;}

/* ---------- Pagination & util ---------- */
.wx-pagination{text-align:center; padding:2rem; font-size:14px;}
.wx-pagination a,.wx-pagination span{display:inline-block; padding:.45rem 1rem; border-radius:999px; margin:0 .15rem; transition:background .2s;}
.wx-pagination .current{background:var(--ink); color:var(--paper);}
.wx-pagination a:hover{background:var(--cream);}
.screen-reader-text{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0);}

/* ---------- Gerak dikurangi ---------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none !important; animation:none !important;}
  html{scroll-behavior:auto;}
}
