/*
Theme Name: Tandur
Theme URI: https://tokonaik.com
Author: TokoNaik
Description: Tema toko online agribisnis & hasil bumi untuk WooCommerce. Master template TokoNaik — toko hasil bumi modern berbahasa data (kartu asal panen, kalender musim), halaman putih lapang beraksen lime, siap clone per klien. Warna, nomor WhatsApp, foto hero, kartu lokasi, dan badge PIRT/Halal diatur lewat Customizer.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: tandur
Tags: e-commerce, woocommerce, custom-colors
*/

/* ====== FONT (self-host, satu keluarga variable — General Sans, Fontshare/ITF FFL) ====== */
@font-face{
  font-family:'General Sans';font-style:normal;font-weight:200 700;font-display:swap;
  src:url('assets/font/general-sans.woff2') format('woff2');
}

/* ====== TOKEN ======
   --hutan/--lime/--latar diganti Customizer via inline style (functions.php). */
:root{
  --hutan:#1E4D2B; --lime:#A8D93C; --latar:#F4F6F0;
  --font:'General Sans',system-ui,sans-serif;
  /* turunan statis */
  --tinta:#17201A; --abu:#57645A; --putih:#FFFFFF;
  --hutan-tua:#14351D; --lime-muda:#EDF5D8;
  --garis:rgba(23,32,26,.10); --garis-tebal:rgba(23,32,26,.45);
  --garis-terang:rgba(244,246,240,.22);
  --r:22px; --r-besar:28px;
  --bayang:0 14px 34px rgba(23,32,26,.10),0 2px 6px rgba(23,32,26,.05);
  --bayang-kecil:0 6px 16px rgba(23,32,26,.08);
}

/* ====== DASAR ====== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{font-family:var(--font);font-weight:400;color:var(--tinta);background:var(--latar);
  font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--hutan);text-decoration:none}
a:hover{color:var(--hutan-tua)}
h1,h2,h3,h4{font-weight:600;line-height:1.06;letter-spacing:-.028em}
ins{text-decoration:none}
::selection{background:var(--lime);color:var(--tinta)}
.wrap{max-width:1200px;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}
.seksi{padding-top:96px;padding-bottom:96px}
.kosong{text-align:center;color:var(--abu)}
.ik{display:inline-flex;vertical-align:-.18em}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Label titik-pil (tata bahasa referensi: "• About Us") */
.tanda{display:inline-flex;align-items:center;gap:9px;font-size:.8rem;font-weight:500;
  letter-spacing:.01em;color:var(--tinta);background:var(--putih);border:1px solid var(--garis);
  border-radius:999px;padding:7px 15px}
.tanda::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--lime);
  box-shadow:0 0 0 3px var(--lime-muda);flex:none}
.tanda-terang{background:rgba(23,32,26,.35);border-color:rgba(244,246,240,.25);color:#fff}
.tanda-terang::before{box-shadow:0 0 0 3px rgba(168,217,60,.25)}

.kepala{margin-bottom:44px}
.kepala h2{font-size:clamp(1.9rem,3.8vw,2.8rem);margin-top:16px;max-width:22ch}
.kepala p{color:var(--abu);max-width:58ch;margin-top:12px}
.kepala.tengah{text-align:center}
.kepala.tengah h2,.kepala.tengah p{margin-left:auto;margin-right:auto}
.kepala-baris{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}

/* Tombol — semuanya pil, sentence case */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;
  font-family:var(--font);font-size:.92rem;font-weight:500;letter-spacing:.005em;
  color:var(--tinta);background:var(--putih);border:1px solid var(--garis);border-radius:999px;
  padding:13px 26px;transition:transform .22s,box-shadow .22s,background .22s,color .22s,border-color .22s}
.btn:hover{transform:translateY(-2px);box-shadow:var(--bayang-kecil);color:var(--tinta)}
.btn .ik{flex:none}
.btn-lime{background:var(--lime);border-color:var(--lime);color:var(--tinta);font-weight:550}
.btn-lime:hover{background:var(--lime);filter:saturate(1.08) brightness(1.03)}
.btn-hutan{background:var(--hutan);border-color:var(--hutan);color:#fff}
.btn-hutan:hover{background:var(--hutan-tua);border-color:var(--hutan-tua);color:#fff}
.btn-putih{background:var(--putih);border-color:var(--putih);color:var(--tinta)}
.btn-garis{background:transparent;border:1.5px solid var(--garis-tebal)}
.btn-wa{border:1.5px solid var(--hutan);color:var(--hutan);background:var(--putih)}
.btn-wa:hover{background:var(--hutan);color:#fff}
.btn.besar{padding:16px 34px;font-size:1rem}
.btn-mini{padding:9px 18px;font-size:.8rem}
.btn-nav{background:var(--hutan);border-color:var(--hutan);color:#fff;padding:10px 20px;font-size:.85rem}
.btn-nav:hover{background:var(--hutan-tua);color:#fff}

/* Chip data kecil (asal kebun di kartu produk & halaman produk) */
.chip{display:inline-flex;align-items:center;gap:6px;font-size:.74rem;font-weight:500;
  color:var(--tinta);background:var(--latar);border-radius:999px;padding:5px 11px}
.chip .ik{color:var(--hutan)}
.chip-asal{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.chip-asal .chip{background:var(--lime-muda);font-size:.8rem;padding:7px 13px}

/* ====== BAR & NAV ====== */
.bar{background:var(--hutan-tua);color:rgba(244,246,240,.92);text-align:center;
  font-size:.78rem;font-weight:450;letter-spacing:.02em;padding:9px 16px}
.situs-nav{position:sticky;top:0;z-index:50;padding-top:14px;padding-bottom:10px;
  background:linear-gradient(180deg,var(--latar) 62%,rgba(244,246,240,0))}
.nav-pil{display:flex;align-items:center;justify-content:space-between;gap:18px;
  background:var(--putih);border:1px solid var(--garis);border-radius:999px;
  box-shadow:var(--bayang-kecil);padding:9px 9px 9px 22px}
.logo{display:inline-flex;align-items:center;gap:9px;font-weight:650;font-size:1.22rem;
  letter-spacing:.05em;color:var(--tinta)}
.logo:hover{color:var(--hutan)}
.logo-daun{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;
  border-radius:50%;background:var(--lime);color:var(--tinta);flex:none}
.menu-utama{display:flex;align-items:center;gap:4px;list-style:none}
.menu-utama a{display:inline-block;font-size:.9rem;font-weight:500;color:var(--tinta);
  border-radius:999px;padding:9px 16px;transition:background .2s}
.menu-utama a:hover{background:var(--latar);color:var(--tinta)}
.item-tas .tas-link{position:relative;display:inline-flex;color:var(--tinta);padding:9px 12px}
.item-tas .tas-link:hover{background:var(--latar);border-radius:999px}
.item-tas .hitung{position:absolute;top:2px;right:2px;background:var(--lime);color:var(--tinta);
  font-size:.62rem;font-weight:650;min-width:17px;height:17px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;padding-left:4px;padding-right:4px}

/* ====== HERO: foto besar membulat + kartu data melayang ====== */
.hero{padding-top:8px}
.hero-foto{position:relative;border-radius:var(--r-besar);overflow:hidden;
  box-shadow:var(--bayang)}
.hero-foto>img{width:100%;height:clamp(520px,74vh,680px);object-fit:cover;object-position:center 45%}
.hero-lapis{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(16,26,18,.32) 0%,rgba(16,26,18,.30) 42%,rgba(16,26,18,.64) 100%)}
.hero-isi{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
  justify-content:center;text-align:center;color:#fff;padding:36px 24px 24px}
.hero-isi h1{font-size:clamp(2.5rem,5.6vw,4.3rem);font-weight:620;max-width:17ch;margin-top:20px;
  text-wrap:balance;text-shadow:0 2px 24px rgba(16,26,18,.35)}
.hero-sub{font-size:clamp(.98rem,1.4vw,1.12rem);font-weight:420;color:rgba(255,255,255,.94);
  max-width:52ch;margin-top:16px;text-shadow:0 1px 14px rgba(16,26,18,.4)}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:30px}
/* Kartu data melayang — bahasa data referensi, diisi data panen sungguhan */
.kartu-data{position:absolute;z-index:2;background:var(--putih);color:var(--tinta);
  box-shadow:var(--bayang);font-size:.82rem}
.kartu-data .ik{color:var(--hutan)}
.kartu-lokasi{top:22px;left:22px;display:inline-flex;align-items:center;gap:8px;
  border-radius:999px;padding:9px 16px;font-weight:500;max-width:min(72%,420px)}
.kartu-musim{left:22px;bottom:22px;border-radius:18px;padding:15px 18px;max-width:290px}
.kartu-musim b{display:flex;align-items:center;gap:7px;font-size:.8rem;font-weight:600;
  letter-spacing:.01em;margin-bottom:8px}
.kartu-musim ul{list-style:none}
.kartu-musim li{padding:4px 0;border-top:1px solid var(--garis);font-weight:450}
.kartu-musim li:first-child{border-top:none}
.kartu-musim a{color:var(--hutan);font-weight:520}
.kartu-musim a:hover{text-decoration:underline}
.kartu-mitra{right:22px;bottom:22px;display:inline-flex;align-items:center;gap:8px;
  border-radius:999px;padding:9px 16px;font-weight:500;max-width:min(60%,380px)}

/* Animasi masuk hero — satu momen yang diarahkan */
.naik{opacity:0;transform:translateY(16px);animation:tandur-naik .85s cubic-bezier(.16,.8,.3,1) forwards}
.naik-2{animation-delay:.1s}.naik-3{animation-delay:.2s}.naik-4{animation-delay:.3s}.naik-5{animation-delay:.4s}
@keyframes tandur-naik{to{opacity:1;transform:none}}

/* ====== USP ====== */
.usp-in{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding-top:34px;padding-bottom:6px}
.usp-item{display:flex;align-items:center;gap:13px;font-size:.82rem;color:var(--abu)}
.usp-item .ik{flex:none;color:var(--hutan);background:var(--lime-muda);border-radius:50%;
  width:46px;height:46px;align-items:center;justify-content:center}
.usp-item b{display:block;font-weight:600;color:var(--tinta);font-size:.9rem}

/* ====== PERNYATAAN ASAL (dua nada + angka) ====== */
.asal{background:var(--putih);border-radius:var(--r-besar);margin-top:56px}
.asal.seksi{padding-top:84px;padding-bottom:84px}
.asal-in{display:grid;grid-template-columns:.85fr 1.15fr;gap:64px;align-items:center}
.asal-foto{position:relative}
.asal-foto>img:first-child{border-radius:var(--r);aspect-ratio:4/5;object-fit:cover;width:100%}
.asal-foto-kecil{position:absolute;right:-26px;bottom:-26px;width:42%;aspect-ratio:1/1;
  object-fit:cover;border-radius:18px;border:6px solid var(--putih);box-shadow:var(--bayang)}
.asal-kalimat{font-size:clamp(1.4rem,2.6vw,2.05rem);font-weight:560;line-height:1.28;
  letter-spacing:-.018em;margin-top:20px;max-width:30ch}
.asal-kalimat .redup{color:var(--abu);font-weight:480}
.asal-angka{list-style:none;display:flex;gap:0;margin-top:36px;border-top:1px solid var(--garis);max-width:520px}
.asal-angka li{flex:1;padding-top:16px;padding-right:18px}
.asal-angka li+li{border-left:1px solid var(--garis);padding-left:18px}
.asal-angka b{display:block;font-size:1.9rem;font-weight:620;letter-spacing:-.02em;color:var(--hutan)}
.asal-angka span{font-size:.78rem;color:var(--abu)}

/* ====== KATEGORI ====== */
.kat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.kat{display:block;background:var(--putih);border-radius:var(--r);padding:10px;
  box-shadow:var(--bayang-kecil);transition:transform .25s,box-shadow .25s}
.kat:hover{transform:translateY(-4px);box-shadow:var(--bayang)}
.kat figure{overflow:hidden;border-radius:14px}
.kat img{aspect-ratio:4/3;object-fit:cover;width:100%;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.kat:hover img{transform:scale(1.05)}
.kat-label{display:flex;align-items:center;gap:10px;padding:13px 8px 6px}
.kat-nama{font-weight:600;font-size:1.02rem;color:var(--tinta)}
.kat-jml{font-size:.74rem;color:var(--abu)}
.kat-panah{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:50%;background:var(--latar);color:var(--tinta);
  transition:background .25s,color .25s,transform .25s}
.kat:hover .kat-panah{background:var(--lime);transform:translateX(2px)}

/* ====== PANEN UNGGULAN (grid produk) ====== */
.prod-grid{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.prod{background:var(--putih);border-radius:var(--r);padding:10px;box-shadow:var(--bayang-kecil);
  display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s}
.prod:hover{transform:translateY(-4px);box-shadow:var(--bayang)}
.prod-vis{position:relative;overflow:hidden;border-radius:14px}
.prod-vis img{aspect-ratio:1/1;object-fit:cover;width:100%;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.prod:hover .prod-vis img{transform:scale(1.05)}
.pita{position:absolute;top:10px;left:10px;z-index:1;background:var(--lime);color:var(--tinta);
  border-radius:999px;font-size:.72rem;font-weight:600;padding:5px 12px}
.pita.baru{background:var(--putih)}
.prod-info{display:flex;flex-direction:column;flex:1;align-items:flex-start;padding:12px 8px 8px}
.prod-info .chip-kartu{margin-bottom:8px}
.prod-info h3{font-size:1rem;font-weight:560;line-height:1.3;letter-spacing:-.01em}
.prod-info h3 a{color:var(--tinta)}
.prod-info h3 a:hover{color:var(--hutan)}
.prod-kaki{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
  margin-top:auto;padding-top:14px}
.prod .harga{font-weight:650;font-size:1.05rem;letter-spacing:-.01em;color:var(--tinta);line-height:1.2}
.prod .harga del{display:block;font-weight:400;font-size:.76rem;color:var(--abu)}
.prod .harga ins{font-weight:650}
.prod-info .bintang{margin-top:4px}
.prod .btn-mini{background:var(--lime);border-color:var(--lime)}
.prod .btn-mini:hover{filter:saturate(1.08) brightness(1.03)}

/* ====== KALENDER PANEN (seksi khas) ====== */
.seksi-kalender .kepala{margin-bottom:36px}
.kalender-kartu{background:var(--putih);border-radius:var(--r-besar);box-shadow:var(--bayang);
  padding:30px;overflow-x:auto}
.kal-baris{display:grid;grid-template-columns:200px repeat(12,minmax(34px,1fr));gap:7px;
  align-items:center;min-width:760px;padding:5px 0}
.kal-baris+.kal-baris{border-top:1px solid var(--garis)}
.kal-kepala{border-top:none;padding-bottom:10px}
.kal-bulan{font-size:.72rem;font-weight:500;color:var(--abu);text-align:center}
.kal-bulan.kini{color:var(--hutan);font-weight:650}
.kal-nama{font-size:.88rem;font-weight:520;padding-right:12px;line-height:1.3}
.kal-nama a{color:var(--tinta)}
.kal-nama a:hover{color:var(--hutan)}
.kal-sel{height:32px;border-radius:9px;background:var(--latar)}
.kal-sel.isi{background:var(--lime)}
.kal-sel.kini{box-shadow:inset 0 0 0 2px var(--hutan)}
.kal-ket{display:flex;align-items:center;gap:9px;margin-top:18px;font-size:.78rem;color:var(--abu);
  min-width:760px}
.kal-contoh{width:22px;height:14px;border-radius:5px;background:var(--lime);flex:none}

/* ====== BANNER GULA AREN (kartu menimpa foto) ====== */
.banner-in{display:grid;grid-template-columns:1.05fr .95fr;align-items:center}
.banner-foto{border-radius:var(--r-besar);overflow:hidden;box-shadow:var(--bayang)}
.banner-foto img{width:100%;height:100%;min-height:440px;object-fit:cover}
.banner-kartu{background:var(--putih);border-radius:var(--r-besar);box-shadow:var(--bayang);
  padding:44px 42px;margin-left:-90px;z-index:2}
.banner-kartu h2{font-size:clamp(1.5rem,2.6vw,2.1rem);margin-top:16px;max-width:20ch}
.banner-kartu>p:not(.tanda){color:var(--abu);margin-top:14px;max-width:52ch}
.banner-cta{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:24px}
.banner-harga{font-weight:650;font-size:1.02rem}

/* ====== TESTIMONI ====== */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.testi{background:var(--putih);border-radius:var(--r);box-shadow:var(--bayang-kecil);padding:28px 26px;
  display:flex;flex-direction:column}
.testi p{font-size:.95rem}
.testi-nama{margin-top:20px;padding-top:14px;border-top:1px solid var(--garis);
  font-weight:600;font-size:.95rem;display:flex;flex-direction:column;gap:2px}
.testi-nama::before{content:'';width:22px;height:5px;border-radius:999px;background:var(--lime);
  margin-bottom:8px}
.testi-nama small{font-weight:450;font-size:.76rem;color:var(--abu)}

/* ====== CTA AKHIR (panel hijau hutan) ====== */
.cta-akhir{padding-bottom:110px}
.cta-panel{background:var(--hutan);border-radius:var(--r-besar);padding:76px 30px;text-align:center;
  color:#fff;box-shadow:var(--bayang)}
.cta-panel h2{font-size:clamp(1.8rem,3.4vw,2.6rem);max-width:24ch;margin:18px auto 0;text-wrap:balance}
.cta-panel>p:not(.tanda){color:rgba(244,246,240,.82);max-width:52ch;margin:14px auto 30px}

/* ====== FOOTER ====== */
.situs-footer{background:var(--hutan-tua);color:rgba(244,246,240,.82)}
.situs-footer .wrap{padding-top:64px;padding-bottom:28px}
.foot-in{display:grid;grid-template-columns:1.4fr 1fr 1.2fr;gap:40px;padding-bottom:44px;
  border-bottom:1px solid var(--garis-terang)}
.situs-footer .logo{color:var(--latar)}
.situs-footer .logo:hover{color:var(--lime)}
.situs-footer p{margin-top:12px;max-width:300px;font-size:.9rem}
.situs-footer h4{font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--lime);margin-bottom:16px}
.situs-footer a{display:inline-flex;align-items:center;gap:8px;color:rgba(244,246,240,.82);font-size:.9rem}
.foot-in div>a{display:flex;margin-bottom:10px}
.situs-footer a:hover{color:#fff}
.foot-bawah{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;
  padding-top:22px;font-size:.78rem;color:rgba(244,246,240,.6)}
.foot-bawah a{font-size:.78rem;color:rgba(244,246,240,.6);text-decoration:underline}
.wa-float{position:fixed;right:22px;bottom:22px;z-index:60;width:54px;height:54px;border-radius:50%;
  background:var(--hutan);color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 24px rgba(23,32,26,.28);transition:transform .25s,background .25s}
.wa-float:hover{transform:translateY(-3px);background:var(--hutan-tua);color:#fff}

/* ====== KONTEN HALAMAN (index/page) ====== */
.konten-halaman{padding-top:64px;padding-bottom:84px}
.judul-halaman{font-size:clamp(1.9rem,3.6vw,2.6rem);margin-bottom:22px}
.konten-halaman article{margin-bottom:36px;max-width:720px}
.konten-halaman .wrap>*{max-width:760px}

/* ====== WOOCOMMERCE ====== */
.woocommerce .wrap{padding-top:48px;padding-bottom:84px}
.woocommerce .woocommerce-breadcrumb{font-size:.78rem;color:var(--abu);margin-bottom:26px}
.woocommerce .woocommerce-breadcrumb a{color:var(--abu)}
.woocommerce .woocommerce-result-count{font-size:.82rem;color:var(--abu);padding-top:10px}
.woocommerce .woocommerce-ordering select{font-family:var(--font);font-size:.85rem;padding:10px 14px;
  border:1px solid var(--garis-tebal);border-radius:999px;background:var(--putih);color:var(--tinta)}

/* Tombol Woo — pil lime (utama) & hutan (alt) */
.woocommerce .button, .woocommerce a.button, .woocommerce button.button,
.woocommerce input.button, .woocommerce #respond input#submit{
  background:var(--lime);color:var(--tinta);border-radius:999px;font-family:var(--font);
  font-weight:550;font-size:.88rem;padding:12px 24px}
.woocommerce .button:hover, .woocommerce a.button:hover, .woocommerce button.button:hover{
  background:var(--lime);color:var(--tinta);filter:saturate(1.08) brightness(1.03)}
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt{
  background:var(--hutan);color:#fff}
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover{
  background:var(--hutan-tua);color:#fff}
.woocommerce a.button.loading::after,.woocommerce button.button.loading::after{color:var(--tinta)}

/* Badge sale */
.woocommerce span.onsale{background:var(--lime);color:var(--tinta);border-radius:999px;
  min-height:auto;min-width:auto;font-size:.72rem;font-weight:600;padding:5px 12px;
  line-height:1.4;top:10px;left:10px}

/* Arsip produk */
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product{
  background:var(--putih);border-radius:var(--r);box-shadow:var(--bayang-kecil);overflow:hidden;
  padding:10px 10px 18px;text-align:left;transition:transform .25s,box-shadow .25s}
.woocommerce ul.products li.product:hover{transform:translateY(-4px);box-shadow:var(--bayang)}
.woocommerce ul.products li.product .woocommerce-LoopProduct-link{display:block;overflow:hidden;border-radius:14px}
.woocommerce ul.products li.product a img{aspect-ratio:1/1;object-fit:cover;background:var(--latar);
  margin-bottom:0;border-radius:14px;transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.woocommerce ul.products li.product:hover a img{transform:scale(1.05)}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-weight:560;font-size:1rem;padding:13px 8px 4px;color:var(--tinta)}
.woocommerce ul.products li.product .price{font-weight:650;font-size:1.02rem;
  color:var(--tinta);padding-left:8px;padding-right:8px}
.woocommerce ul.products li.product .price del{color:var(--abu);font-weight:400;font-size:.78rem}
.woocommerce ul.products li.product .price ins{font-weight:650}
.woocommerce ul.products li.product .star-rating{margin-left:8px}
.woocommerce ul.products li.product .button{margin:12px 8px 0}
.woocommerce .star-rating span::before, .woocommerce p.stars a{color:var(--hutan)}

/* Produk single */
.woocommerce div.product .product_title{font-weight:620;
  font-size:clamp(1.7rem,3.2vw,2.4rem);line-height:1.1;letter-spacing:-.025em}
.woocommerce div.product p.price, .woocommerce div.product span.price{
  color:var(--tinta);font-weight:650}
.woocommerce div.product p.price{font-size:1.5rem;margin:10px 0 16px}
.woocommerce div.product p.price del{opacity:.5;font-weight:400;font-size:1rem}
.woocommerce div.product .woocommerce-product-details__short-description{color:var(--abu);font-size:.95rem}
.woocommerce div.product div.images img{background:var(--putih);border-radius:var(--r)}
.woocommerce div.product div.images .flex-viewport{border-radius:var(--r);box-shadow:var(--bayang-kecil)}
.woocommerce div.product form.cart{margin:22px 0}
.woocommerce div.product form.cart div.quantity .qty{height:46px;border:1px solid var(--garis-tebal);
  border-radius:999px;background:var(--putih);font-family:var(--font)}
.woocommerce div.product form.cart .variations select{border:1px solid var(--garis-tebal);
  border-radius:999px;padding:10px 14px;background:var(--putih);font-family:var(--font);font-size:.9rem}
.woocommerce div.product form.cart .variations label{font-weight:550;font-size:.85rem}
.woocommerce div.product form.cart .reset_variations{font-size:.78rem;color:var(--abu)}
.woocommerce div.product .product_meta{font-size:.8rem;color:var(--abu);
  border-top:1px solid var(--garis);padding-top:16px;margin-top:20px}
.woocommerce div.product .product_meta a{color:var(--hutan)}

/* Badge PIRT/Halal — pil tenang */
.badge-izin{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.badge-izin span{display:inline-flex;align-items:center;gap:7px;font-size:.76rem;font-weight:550;
  color:var(--tinta);border:1px solid var(--garis-tebal);border-radius:999px;padding:6px 13px}
.badge-izin .ik{color:var(--hutan)}

/* Akordion info produk */
.akordion-produk{margin-top:24px;border-top:1px solid var(--garis-tebal)}
.akordion{border-bottom:1px solid var(--garis)}
.akordion summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;
  font-weight:600;font-size:.98rem;padding-top:15px;padding-bottom:15px;color:var(--tinta)}
.akordion summary::-webkit-details-marker{display:none}
.akordion summary::after{content:'+';font-weight:500;font-size:1.4rem;
  color:var(--hutan);transition:transform .3s;line-height:1}
.akordion[open] summary::after{transform:rotate(45deg)}
.akordion-isi{padding-bottom:18px;color:var(--abu);font-size:.93rem}
.woocommerce div.product .woocommerce-tabs ul.tabs{padding:0;margin:0 0 1.2em}
.woocommerce div.product .woocommerce-tabs ul.tabs::before{border-bottom:1px solid var(--garis)}
.woocommerce div.product .woocommerce-tabs ul.tabs li{background:transparent;border:none;border-radius:0;
  margin:0 26px 0 0;padding:0}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{display:none}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{font-size:.85rem;font-weight:550;
  color:var(--abu);padding:12px 0}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:var(--tinta);
  box-shadow:inset 0 -2px 0 var(--lime)}
.woocommerce .related.products>h2,.woocommerce .upsells.products>h2{font-weight:620;
  font-size:1.6rem;margin-bottom:22px}
.woocommerce #reviews #comments ol.commentlist li img.avatar{border-radius:50%;border:none;background:var(--latar)}
.woocommerce #reviews #comments ol.commentlist li .comment-text{border:1px solid var(--garis);border-radius:var(--r)}

/* Notifikasi */
.woocommerce-message, .woocommerce-info{border-top-color:var(--hutan);background:var(--putih);
  color:var(--tinta);font-size:.88rem;border-radius:0 0 14px 14px}
.woocommerce-message::before{color:var(--hutan)}
.woocommerce-info::before{color:var(--hutan)}
.woocommerce-error{font-size:.88rem}

/* Cart */
.woocommerce table.shop_table{border:none;border-top:1px solid var(--garis-tebal);border-radius:0}
.woocommerce table.shop_table th{font-size:.76rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--abu);font-weight:600}
.woocommerce table.shop_table td{border-top:1px solid var(--garis);padding:14px 12px}
.woocommerce-cart table.cart td.product-name a,.woocommerce table.shop_table td.product-name a{
  font-weight:600;font-size:.98rem;color:var(--tinta)}
.woocommerce-cart table.cart img{width:64px;background:var(--latar);border-radius:12px}
.woocommerce-cart table.cart td.actions .coupon .input-text{border:1px solid var(--garis-tebal);
  border-radius:999px;padding:10px 14px;background:var(--putih);font-family:var(--font)}
.woocommerce a.remove{color:var(--abu)!important;border-radius:50%;font-weight:400}
.woocommerce a.remove:hover{background:var(--hutan);color:#fff!important}
.woocommerce .cart-collaterals .cart_totals{background:var(--putih);padding:26px;
  border-radius:var(--r);box-shadow:var(--bayang-kecil)}
.woocommerce .cart-collaterals .cart_totals h2{font-size:1.35rem;font-weight:620;margin-bottom:10px}
.woocommerce .cart-collaterals .cart_totals table{border:none}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button{display:block;text-align:center}

/* Checkout */
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea,
.woocommerce form .form-row select,
#add_payment_method table.cart td.actions .coupon .input-text{
  border:1px solid var(--garis-tebal);border-radius:12px;padding:11px 14px;background:var(--putih);
  font-family:var(--font);font-size:.9rem;color:var(--tinta)}
.woocommerce form .form-row input.input-text:focus,.woocommerce form .form-row textarea:focus{
  border-color:var(--hutan);outline:none}
.woocommerce form .form-row label{font-size:.82rem;color:var(--abu)}
.woocommerce-checkout h3,#order_review_heading{font-weight:620;font-size:1.35rem}
.woocommerce-checkout #payment{background:var(--putih);border-radius:var(--r);box-shadow:var(--bayang-kecil)}
.woocommerce-checkout #payment div.payment_box{background:var(--latar);border-radius:12px;font-size:.85rem}
.woocommerce-checkout #payment div.payment_box::before{border-bottom-color:var(--latar)}
.woocommerce-checkout #payment ul.payment_methods{border-bottom:1px solid var(--garis)}
#place_order{width:100%}

/* Akun */
.woocommerce-MyAccount-navigation ul{list-style:none;border-radius:var(--r);
  background:var(--putih);box-shadow:var(--bayang-kecil);overflow:hidden}
.woocommerce-MyAccount-navigation li{border-bottom:1px solid var(--garis)}
.woocommerce-MyAccount-navigation li:last-child{border-bottom:none}
.woocommerce-MyAccount-navigation li a{display:block;padding:13px 18px;
  font-size:.85rem;font-weight:500;color:var(--abu)}
.woocommerce-MyAccount-navigation li.is-active a,.woocommerce-MyAccount-navigation li a:hover{
  color:var(--tinta);box-shadow:inset 3px 0 0 var(--lime);background:var(--latar)}
.woocommerce-account .woocommerce-MyAccount-content{font-size:.92rem}
.woocommerce-account .woocommerce-MyAccount-content h3{font-weight:620}
.woocommerce form.login,.woocommerce form.register{border:none;
  border-radius:var(--r);background:var(--putih);box-shadow:var(--bayang-kecil)}

/* WooCommerce Blocks (cart/checkout berbasis blok) */
.wc-block-components-button:not(.is-link){background:var(--lime);color:var(--tinta);border-radius:999px;
  font-family:var(--font);font-weight:550;font-size:.88rem}
.wc-block-components-button:not(.is-link):hover,.wc-block-components-button:not(.is-link):focus{
  background:var(--lime);color:var(--tinta);filter:saturate(1.08) brightness(1.03)}
.wp-block-woocommerce-cart .wc-block-components-product-name,
.wp-block-woocommerce-checkout .wc-block-components-product-name{
  font-weight:600;font-size:.98rem;color:var(--tinta)}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label{font-weight:650}
.wc-block-components-product-badge{border-radius:999px}
.wc-block-components-textarea,.wc-block-components-text-input input{border-radius:12px;border-color:var(--garis-tebal)}
.wc-block-components-checkout-step__heading .wc-block-components-title{font-weight:600}

/* Pagination */
.woocommerce nav.woocommerce-pagination ul{border:none}
.woocommerce nav.woocommerce-pagination ul li{border:none;margin:0 3px}
.woocommerce nav.woocommerce-pagination ul li a,.woocommerce nav.woocommerce-pagination ul li span{
  font-size:.85rem;padding:10px 16px;border-radius:999px;background:var(--putih);
  color:var(--tinta);box-shadow:var(--bayang-kecil)}
.woocommerce nav.woocommerce-pagination ul li a:focus, .woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current{background:var(--hutan);color:#fff}

/* ====== RESPONSIVE ====== */
@media (max-width:1080px){
  .prod-grid{grid-template-columns:repeat(3,1fr)}
  .kat-grid{grid-template-columns:repeat(2,1fr)}
  .banner-kartu{margin-left:-50px;padding:36px 32px}
}
@media (max-width:860px){
  .seksi{padding-top:64px;padding-bottom:64px}
  .nav-pil{padding-left:16px}
  .menu-utama{gap:0}
  .menu-utama a{font-size:.82rem;padding:8px 10px}
  .btn-nav span:not(.ik){display:none}
  .btn-nav{padding:15px 16px}
  .hero-foto>img{height:min(78vh,620px)}
  /* Lapisan & teks hero dikunci setinggi FOTO — di bawahnya kartu data mengalir statis */
  .hero-lapis{inset:auto 0 auto 0;top:0;height:min(78vh,620px);
    background:linear-gradient(180deg,rgba(16,26,18,.42) 0%,rgba(16,26,18,.34) 42%,rgba(16,26,18,.66) 100%)}
  .hero-isi{inset:auto 0 auto 0;top:0;height:min(78vh,620px)}
  .hero-isi h1{font-size:clamp(2rem,7.4vw,2.7rem)}
  .hero-foto{background:var(--putih)}
  /* Kartu musim (elemen data hidup) pindah ke bawah foto, bukan hilang */
  .kartu-musim{position:static;max-width:none;margin:12px 12px 14px;
    box-shadow:none;border:1px solid var(--garis);border-radius:16px}
  .kartu-mitra{position:static;display:flex;margin:12px 12px 0;box-shadow:none;
    border:1px solid var(--garis);max-width:none}
  .usp-in{grid-template-columns:repeat(2,1fr);row-gap:18px}
  .asal-in{grid-template-columns:1fr;gap:52px}
  .asal-foto{max-width:440px}
  .asal-foto-kecil{right:-10px}
  .asal.seksi{padding-top:60px;padding-bottom:60px}
  .prod-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .banner-in{grid-template-columns:1fr}
  .banner-foto img{min-height:300px;height:44vw}
  .banner-kartu{margin-left:0;margin-top:-40px;width:calc(100% - 28px);justify-self:center}
  .testi-grid{grid-template-columns:1fr}
  .foot-in{grid-template-columns:1fr;gap:28px}
  .cta-panel{padding:56px 22px}
}
@media (max-width:700px){
  /* Nav HP: logo + keranjang + tombol WA. Tautan seksi disembunyikan —
     halaman satu gulungan panjang dan tombol WA melayang selalu hadir. */
  .menu-utama{margin-left:auto}
  .menu-utama li{display:none}
  .menu-utama li.item-tas{display:list-item}
}
@media (max-width:560px){
  .prod-grid{grid-template-columns:1fr 1fr;gap:10px}
  .prod-info{padding:10px 6px 6px}
  .prod-info h3{font-size:.9rem}
  .prod .harga{font-size:.95rem}
  .prod-kaki{flex-wrap:wrap;row-gap:8px}
  .btn-mini{padding:8px 14px;font-size:.74rem}
  .kat-grid{grid-template-columns:1fr}
  .btn{padding:12px 20px;font-size:.86rem}
  .bar{font-size:.68rem}
  .kartu-lokasi{max-width:calc(100% - 44px)}
  .asal-angka b{font-size:1.5rem}
  .kalender-kartu{padding:20px}
}

/* Aksesibilitas gerak */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .naik{animation:none;opacity:1;transform:none}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}