/*
Theme Name: Nyala
Theme URI: https://tokonaik.com
Author: TokoNaik
Description: Tema toko online kuliner untuk WooCommerce. Master template TokoNaik — warung ayam goreng modern, frozen kirim-nasional, foto konteks Indonesia, siap clone per klien. Warna, nomor WhatsApp, foto hero, dan badge PIRT/Halal diatur lewat Customizer.
Version: 1.0.1
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: nyala
Tags: e-commerce, woocommerce, custom-colors
*/

/* ====== FONT (self-host, subset latin, variable) ====== */
@font-face{
  font-family:'Bricolage Grotesque';font-style:normal;font-weight:600 800;font-display:swap;
  src:url('assets/font/bricolage.woff2') format('woff2');
}
@font-face{
  font-family:'Hanken Grotesk';font-style:normal;font-weight:400 600;font-display:swap;
  src:url('assets/font/hanken.woff2') format('woff2');
}

/* ====== TOKEN ======
   --cabai/--kunyit/--latar diganti Customizer via inline style (functions.php). */
:root{
  --latar:#FAF3E7; --arang:#241F1C; --cabai:#B5301C; --kunyit:#D99A2B;
  --font-display:'Bricolage Grotesque',system-ui,sans-serif;
  --font-teks:'Hanken Grotesk',system-ui,sans-serif;
  /* turunan statis */
  --cabai-tua:#8C2413; --kartu:#FFFBF1; --kraft:#F2E4CC; --abu:#6F6155;
  --garis:rgba(36,31,28,.16); --garis-tebal:rgba(36,31,28,.85);
  --garis-terang:rgba(250,243,231,.28);
  --r:16px;
  --display:var(--font-display); --sans:var(--font-teks);
}

/* ====== DASAR ====== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);font-weight:400;color:var(--arang);background:var(--latar);
  font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;position:relative}
/* Serat kertas kraft halus di seluruh halaman */
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:2;opacity:.4;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E")}
img{max-width:100%;height:auto;display:block}
a{color:var(--cabai);text-decoration:none}
a:hover{color:var(--cabai-tua)}
h1,h2,h3,h4{font-family:var(--display);font-weight:750;line-height:1.05;letter-spacing:-.015em}
ins{text-decoration:none}
::selection{background:var(--kunyit);color:var(--arang)}

/* JANGAN beri padding shorthand pada .wrap — padding samping 24px wajib bertahan */
.wrap{max-width:1160px;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}
.seksi{padding-top:88px;padding-bottom:88px}
.kosong{text-align:center;color:var(--abu)}

/* Kicker "cap stempel": kapital tebal merah dalam bingkai miring tipis */
.kicker{display:inline-flex;align-items:center;gap:8px;font-family:var(--display);
  font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--cabai);border:1.5px solid currentColor;border-radius:6px;
  padding:6px 13px;transform:rotate(-1.5deg)}
.kicker .ik{color:var(--kunyit)}
.kicker-terang{color:var(--latar)}
.kicker-terang .ik{color:var(--kunyit)}
.kepala{margin-bottom:46px}
.kepala h2{font-size:clamp(2rem,4.2vw,3.1rem);font-weight:800;margin-top:18px}
.kepala p{color:var(--abu);max-width:560px;margin-top:12px}
.kepala.tengah{text-align:center}
.kepala.tengah p{margin-left:auto;margin-right:auto}
.kepala-terang h2{color:var(--latar)}
.kepala-terang p{color:var(--garis-terang);color:rgba(250,243,231,.72)}

/* Tombol pil — energi menu cepat saji */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;
  font-family:var(--sans);font-size:.8rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--arang);background:transparent;border:2px solid var(--arang);border-radius:999px;
  padding:13px 27px;transition:background .22s,color .22s,border-color .22s,transform .22s,box-shadow .22s}
.btn:hover{background:var(--arang);color:var(--latar);transform:translateY(-2px)}
.btn-isi{background:var(--cabai);border-color:var(--cabai);color:#fff}
.btn-isi:hover{background:var(--cabai-tua);border-color:var(--cabai-tua);color:#fff}
.btn-wa{border-color:var(--cabai);color:var(--cabai)}
.btn-wa:hover{background:var(--cabai);border-color:var(--cabai);color:#fff}
.btn-terang{background:var(--latar);border-color:var(--latar);color:var(--arang)}
.btn-terang:hover{background:var(--arang);border-color:var(--arang);color:var(--latar)}
.btn.besar{padding:17px 36px;font-size:.86rem}
.btn-mini{padding:9px 17px;font-size:.68rem;letter-spacing:.08em}
.ik{display:inline-flex;vertical-align:-.18em}

/* ====== BAR & NAV ====== */
.bar{background:var(--cabai);color:#fff;text-align:center;font-size:.72rem;
  font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:9px 16px}
.situs-nav{position:sticky;top:0;z-index:50;background:var(--latar);
  border-bottom:2px solid var(--arang)}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding-top:15px;padding-bottom:15px}
.logo{font-family:var(--display);font-weight:800;font-size:1.5rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--arang)}
.logo:hover{color:var(--cabai)}
.menu-utama{display:flex;align-items:center;gap:28px;list-style:none}
.menu-utama a{font-size:.78rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--arang)}
.menu-utama a:hover{color:var(--cabai)}
.item-tas .tas-link{position:relative;display:inline-flex;color:var(--arang)}
.item-tas .hitung{position:absolute;top:-7px;right:-11px;background:var(--cabai);color:#fff;
  font-size:.62rem;font-weight:600;min-width:17px;height:17px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;padding-left:4px;padding-right:4px}

/* ====== HERO ====== */
.hero{overflow:hidden;border-bottom:2px solid var(--arang)}
.hero-in{display:grid;grid-template-columns:1.08fr .92fr;gap:56px;align-items:center;
  padding-top:64px;padding-bottom:72px}
.hero-teks h1{font-size:clamp(3rem,6.6vw,4.9rem);font-weight:800;line-height:.98;
  letter-spacing:-.02em;margin-top:24px;max-width:12ch}
.hero-teks>p{color:var(--abu);font-size:1.06rem;max-width:46ch;margin-top:20px}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
/* Deret angka khas warung: bilangan besar Bricolage */
.hero-angka{list-style:none;display:flex;gap:0;margin-top:38px;border-top:2px solid var(--arang);max-width:520px}
.hero-angka li{flex:1;padding-top:14px;padding-right:16px;border-right:1px solid var(--garis)}
.hero-angka li:last-child{border-right:none}
.hero-angka b{display:block;font-family:var(--display);font-weight:800;font-size:1.5rem;color:var(--cabai)}
.hero-angka span{font-size:.76rem;color:var(--abu);letter-spacing:.04em}
/* Piring bundar + ring putus-putus kunyit yang berputar pelan */
.hero-foto{position:relative;justify-self:end;width:min(100%,460px)}
.piring{display:block;position:relative;border-radius:50%;overflow:hidden;z-index:1;
  border:5px solid var(--arang);background:var(--kartu)}
.piring img{aspect-ratio:1/1;object-fit:cover;width:100%}
.hero-foto::before{content:'';position:absolute;inset:-17px;border:2px dashed var(--kunyit);
  border-radius:50%;animation:nyala-putar 46s linear infinite}
@keyframes nyala-putar{to{transform:rotate(360deg)}}
/* Cap stempel PIRT · Halal */
.stempel{position:absolute;z-index:2;left:-14px;bottom:26px;width:112px;height:112px;border-radius:50%;
  background:var(--latar);border:2px dashed var(--cabai);transform:rotate(-11deg);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  font-family:var(--display);font-weight:800;font-size:.86rem;letter-spacing:.05em;
  text-transform:uppercase;color:var(--cabai);box-shadow:0 4px 16px rgba(36,31,28,.14)}
.stempel small{font-family:var(--sans);font-weight:600;font-size:.56rem;letter-spacing:.14em;
  color:var(--abu);margin-top:3px}

/* Animasi masuk hero */
.naik{opacity:0;transform:translateY(18px);animation:nyala-naik .8s cubic-bezier(.2,.7,.3,1) forwards}
.naik-2{animation-delay:.12s}.naik-3{animation-delay:.24s}.naik-4{animation-delay:.36s}.naik-5{animation-delay:.48s}
@keyframes nyala-naik{to{opacity:1;transform:none}}

/* ====== USP ====== */
.usp{border-bottom:1px solid var(--garis);background:var(--kartu)}
.usp-in{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding-top:26px;padding-bottom:26px}
.usp-item{display:flex;align-items:center;gap:14px;justify-content:center;
  font-size:.8rem;color:var(--abu)}
.usp-item .ik{flex:none;color:var(--cabai);background:var(--kraft);border-radius:50%;
  width:46px;height:46px;align-items:center;justify-content:center}
.usp-item b{display:block;font-family:var(--display);font-weight:700;color:var(--arang);
  font-size:.86rem;letter-spacing:.02em}

/* ====== KATEGORI ====== */
.kat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.kat{display:block;background:var(--kartu);border:2px solid var(--arang);border-radius:var(--r);
  overflow:hidden;transition:transform .25s,box-shadow .25s}
.kat:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--kunyit)}
.kat figure{overflow:hidden}
.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;border-top:2px solid var(--arang);
  padding:14px 16px;background:var(--kartu)}
.kat-nama{font-family:var(--display);font-weight:750;font-size:1.06rem;color:var(--arang)}
.kat-jml{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--abu)}
.kat-panah{margin-left:auto;color:var(--cabai);transition:transform .25s}
.kat:hover .kat-panah{transform:translateX(4px)}

/* ====== PAPAN MENU BER-TAB ====== */
.seksi-menu{background:var(--kraft);border-top:2px solid var(--arang);border-bottom:2px solid var(--arang)}
.tab-bar{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:40px}
.tab-btn{font-family:var(--sans);font-size:.78rem;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--arang);background:transparent;border:2px solid var(--arang);
  border-radius:999px;padding:11px 24px;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.tab-btn:hover{background:var(--kartu)}
.tab-btn.aktif{background:var(--cabai);border-color:var(--cabai);color:#fff}
.prod-grid{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.prod{background:var(--kartu);border:2px solid var(--arang);border-radius:var(--r);overflow:hidden;
  display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s}
.prod:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--kunyit)}
.prod-vis{position:relative;overflow:hidden;border-bottom:2px solid var(--arang)}
.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:12px;left:12px;z-index:1;background:var(--cabai);color:#fff;border-radius:999px;
  font-size:.64rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:5px 12px}
.pita.baru{background:var(--kunyit);color:var(--arang)}
.prod-info{display:flex;flex-direction:column;flex:1;align-items:stretch;padding:16px 18px 18px}
.prod-info h3{font-size:1.04rem;font-weight:700;line-height:1.25}
.prod-info h3 a{color:var(--arang)}
.prod-info h3 a:hover{color:var(--cabai)}
.pedas{display:inline-flex;gap:1px;color:var(--cabai);margin-left:6px;vertical-align:-.1em}
.prod-kaki{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:14px}
/* Harga tampil BESAR — DNA papan menu */
.prod .harga{font-family:var(--display);font-weight:800;font-size:1.18rem;color:var(--cabai);line-height:1.15}
.prod .harga del{display:block;font-family:var(--sans);font-weight:400;font-size:.76rem;color:var(--abu);opacity:.8}
.prod .harga ins{font-weight:800}
.prod-info .bintang{margin-top:4px}

/* ====== IDE SAJIAN (papan kapur di atas arang) ====== */
.sajian{background:var(--arang);padding-top:92px;padding-bottom:92px;position:relative;overflow:hidden}
.sajian::before{content:'';position:absolute;inset:0;opacity:.55;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.07'/%3E%3C/svg%3E")}
.sajian .wrap{position:relative}
.sajian .kicker{color:var(--kunyit)}
.sajian-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.resep{border:2px dashed var(--garis-terang);border-radius:var(--r);padding:30px 28px 26px;
  transition:border-color .3s}
.resep:hover{border-color:var(--kunyit)}
.resep-no{font-family:var(--display);font-weight:800;font-size:2.2rem;color:var(--kunyit);
  display:block;line-height:1}
.resep h3{color:var(--latar);font-size:1.35rem;margin-top:12px}
.resep p{color:rgba(250,243,231,.78);font-size:.94rem;margin-top:12px}
.resep p a{color:var(--latar);font-weight:600;border-bottom:1px solid var(--kunyit)}
.resep p a:hover{color:var(--kunyit)}
.resep small{display:inline-block;margin-top:16px;font-size:.68rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--kunyit)}

/* ====== BANNER PAKET (merah menyala) ====== */
.promo{background:var(--cabai);position:relative;overflow:hidden}
.promo::before{content:'';position:absolute;inset:0;opacity:.5;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.06'/%3E%3C/svg%3E")}
.promo-in{position:relative;display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:center}
.promo-foto{justify-self:center}
.piring.kecil{width:min(100%,340px);border-color:var(--latar);border-width:4px}
.promo-foto{position:relative}
.promo-foto::before{content:'';position:absolute;inset:-14px;border:2px dashed rgba(250,243,231,.5);
  border-radius:50%;animation:nyala-putar 46s linear infinite}
.promo-teks h2{color:#fff;font-size:clamp(2rem,4vw,3rem);font-weight:800;margin-top:16px}
.promo-teks p{color:rgba(255,246,235,.85);margin-top:12px;max-width:46ch}
.promo-harga{margin-top:20px;margin-bottom:24px;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;color:#fff}
.promo-harga del{opacity:.6}
.promo-harga b{font-family:var(--display);font-size:2.5rem;font-weight:800;letter-spacing:-.01em}
.promo-harga .hemat{font-size:.68rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  background:var(--kunyit);color:var(--arang);border-radius:999px;padding:6px 13px}

/* ====== TESTIMONI ====== */
.seksi-testi{background:var(--kartu);border-bottom:1px solid var(--garis)}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.testi{background:var(--latar);border:2px solid var(--arang);border-radius:var(--r);padding:28px 26px}
.kutip{font-family:var(--display);font-weight:800;font-size:3.6rem;line-height:0;display:block;
  color:var(--cabai);margin-top:22px;margin-bottom:6px}
.testi p{font-size:.95rem}
.testi-nama{margin-top:18px;padding-top:14px;border-top:1px solid var(--garis);
  font-family:var(--display);font-weight:700;font-size:1rem}
.testi-nama small{display:block;font-family:var(--sans);font-weight:600;font-size:.7rem;
  letter-spacing:.12em;text-transform:uppercase;color:var(--abu);margin-top:4px}

/* ====== CTA WA ====== */
.cta-wa{text-align:center}
.cta-wa h2{font-size:clamp(2rem,4vw,3rem);font-weight:800;margin-top:18px}
.cta-wa p{color:var(--abu);max-width:520px;margin:14px auto 30px}

/* ====== FOOTER ====== */
.situs-footer{background:var(--arang);color:rgba(250,243,231,.8)}
.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);font-size:1.35rem}
.situs-footer .logo:hover{color:var(--kunyit)}
.situs-footer p{margin-top:12px;max-width:300px;font-size:.9rem}
.situs-footer h4{font-family:var(--sans);font-size:.72rem;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--kunyit);margin-bottom:16px}
.situs-footer a{display:inline-flex;align-items:center;gap:8px;color:rgba(250,243,231,.8);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(250,243,231,.55)}
.foot-bawah a{font-size:.78rem;color:rgba(250,243,231,.55);text-decoration:underline}
.wa-float{position:fixed;right:22px;bottom:22px;z-index:60;width:54px;height:54px;border-radius:50%;
  background:var(--cabai);color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 18px rgba(36,31,28,.3);transition:transform .25s,background .25s}
.wa-float:hover{transform:translateY(-3px);background:var(--cabai-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.7rem);font-weight:800;margin-bottom:22px}
.konten-halaman article{margin-bottom:36px;max-width:720px}
.konten-halaman .wrap>*{max-width:760px}

/* ====== WOOCOMMERCE ====== */
.woocommerce .wrap{padding-top:52px;padding-bottom:84px}
.woocommerce .woocommerce-breadcrumb{font-family:var(--sans);font-size:.72rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--abu);margin-bottom:28px}
.woocommerce .woocommerce-breadcrumb a{color:var(--abu)}
.woocommerce .woocommerce-result-count{font-size:.8rem;color:var(--abu);padding-top:8px}
.woocommerce .woocommerce-ordering select{font-family:var(--sans);font-size:.8rem;padding:9px 13px;
  border:2px solid var(--arang);border-radius:999px;background:var(--kartu);color:var(--arang)}

/* Tombol Woo — pil merah */
.woocommerce .button, .woocommerce a.button, .woocommerce button.button,
.woocommerce input.button, .woocommerce #respond input#submit,
.woocommerce a.button.alt, .woocommerce button.button.alt{
  background:var(--cabai);color:#fff;border-radius:999px;font-family:var(--sans);font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;font-size:.76rem;padding:13px 26px}
.woocommerce .button:hover, .woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover{background:var(--cabai-tua);color:#fff}
.woocommerce a.button.loading::after,.woocommerce button.button.loading::after{color:#fff}

/* Badge sale */
.woocommerce span.onsale{background:var(--cabai);border-radius:999px;min-height:auto;min-width:auto;
  font-size:.64rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  padding:5px 12px;line-height:1.4;top:12px;left:12px}

/* Arsip produk */
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product{
  background:var(--kartu);border:2px solid var(--arang);border-radius:var(--r);overflow:hidden;
  padding-bottom:18px;text-align:left;transition:transform .25s,box-shadow .25s}
.woocommerce ul.products li.product:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--kunyit)}
.woocommerce ul.products li.product .woocommerce-LoopProduct-link{display:block;overflow:hidden}
.woocommerce ul.products li.product a img{aspect-ratio:1/1;object-fit:cover;background:var(--latar);
  margin-bottom:0;border-bottom:2px solid var(--arang);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-family:var(--display);font-weight:700;font-size:1.04rem;padding:14px 16px 4px;color:var(--arang)}
.woocommerce ul.products li.product .price{font-family:var(--display);font-weight:800;font-size:1.1rem;
  color:var(--cabai);padding-left:16px;padding-right:16px}
.woocommerce ul.products li.product .price del{color:var(--abu);font-family:var(--sans);
  font-weight:400;font-size:.78rem;opacity:.8}
.woocommerce ul.products li.product .price ins{font-weight:800}
.woocommerce ul.products li.product .star-rating{margin-left:16px}
.woocommerce ul.products li.product .button{margin:12px 16px 0;display:inline-block;background:transparent;
  color:var(--arang);border:2px solid var(--arang);padding:9px 18px}
.woocommerce ul.products li.product .button:hover{background:var(--arang);color:var(--latar)}
.woocommerce .star-rating span::before, .woocommerce p.stars a{color:var(--kunyit)}

/* Produk single */
.woocommerce div.product .product_title{font-family:var(--display);font-weight:800;
  font-size:clamp(1.8rem,3.2vw,2.5rem);line-height:1.08;letter-spacing:-.015em}
.woocommerce div.product p.price, .woocommerce div.product span.price{
  color:var(--cabai);font-family:var(--display);font-weight:800}
.woocommerce div.product p.price{font-size:1.6rem;margin:10px 0 16px}
.woocommerce div.product p.price del{opacity:.5;font-family:var(--sans);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(--kartu);border-radius:var(--r)}
.woocommerce div.product div.images .flex-viewport{border-radius:var(--r);border:2px solid var(--arang)}
.woocommerce div.product form.cart{margin:22px 0}
.woocommerce div.product form.cart div.quantity .qty{height:46px;border:2px solid var(--arang);
  border-radius:999px;background:var(--kartu);font-family:var(--sans)}
.woocommerce div.product .product_meta{font-size:.78rem;letter-spacing:.06em;color:var(--abu);
  border-top:1px solid var(--garis);padding-top:16px;margin-top:20px}
.woocommerce div.product .product_meta a{color:var(--cabai)}
.woocommerce div.product .pedas{margin-bottom:12px}

/* Badge PIRT/Halal (p.badge-produk.badge-izin > span) */
.badge-izin{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}
.badge-izin span{display:inline-flex;align-items:center;gap:7px;font-family:var(--display);
  font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--cabai);border:1.5px dashed var(--cabai);border-radius:6px;padding:5px 11px;
  transform:rotate(-1deg)}
.badge-izin .ik{color:var(--kunyit)}

/* Akordion info produk */
.akordion-produk{margin-top:24px;border-top:2px solid var(--arang)}
.akordion{border-bottom:1px solid var(--garis)}
.akordion summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;
  font-family:var(--display);font-weight:700;font-size:1rem;padding-top:15px;padding-bottom:15px;color:var(--arang)}
.akordion summary::-webkit-details-marker{display:none}
.akordion summary::after{content:'+';font-family:var(--display);font-weight:700;font-size:1.4rem;
  color:var(--cabai);transition:transform .3s;line-height:1}
.akordion[open] summary::after{transform:rotate(45deg)}
.akordion-isi{padding-bottom:18px;color:var(--abu);font-size:.93rem}
.btn-wa .ik,.btn .ik{flex:none}
.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-family:var(--sans);font-size:.76rem;
  letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--abu);padding:12px 0}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:var(--arang);
  box-shadow:inset 0 -2px 0 var(--cabai)}
.woocommerce .related.products>h2,.woocommerce .upsells.products>h2{font-family:var(--display);
  font-weight:800;font-size:1.7rem;margin-bottom:22px}
.woocommerce #reviews #comments ol.commentlist li img.avatar{border-radius:50%;border:none;background:var(--kartu)}
.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(--cabai);background:var(--kartu);
  color:var(--arang);font-size:.88rem}
.woocommerce-message::before, .woocommerce-info::before{color:var(--cabai)}
.woocommerce-error{font-size:.88rem}

/* Cart */
.woocommerce table.shop_table{border:none;border-top:2px solid var(--arang);border-radius:0}
.woocommerce table.shop_table th{font-family:var(--sans);font-size:.72rem;letter-spacing:.14em;
  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-family:var(--display);font-weight:700;font-size:1rem;color:var(--arang)}
.woocommerce-cart table.cart img{width:64px;background:var(--kartu);border-radius:10px}
.woocommerce-cart table.cart td.actions .coupon .input-text{border:2px solid var(--arang);
  border-radius:999px;padding:10px 14px;background:var(--kartu);font-family:var(--sans)}
.woocommerce a.remove{color:var(--abu)!important;border-radius:50%;font-weight:400}
.woocommerce a.remove:hover{background:var(--cabai);color:#fff!important}
.woocommerce .cart-collaterals .cart_totals{background:var(--kartu);padding:26px;
  border:2px solid var(--arang);border-radius:var(--r)}
.woocommerce .cart-collaterals .cart_totals h2{font-size:1.4rem;font-weight:800;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:1.5px solid var(--garis-tebal);border-radius:10px;padding:11px 13px;background:var(--kartu);
  font-family:var(--sans);font-size:.9rem;color:var(--arang)}
.woocommerce form .form-row input.input-text:focus,.woocommerce form .form-row textarea:focus{
  border-color:var(--cabai);outline:none}
.woocommerce form .form-row label{font-size:.8rem;letter-spacing:.04em;color:var(--abu)}
.woocommerce-checkout h3,#order_review_heading{font-family:var(--display);font-weight:800;font-size:1.4rem}
.woocommerce-checkout #payment{background:var(--kartu);border-radius:var(--r);border:2px solid var(--arang)}
.woocommerce-checkout #payment div.payment_box{background:var(--latar);border-radius:10px;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:2px solid var(--arang);border-radius:var(--r);
  background:var(--kartu);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-family:var(--sans);
  font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--abu)}
.woocommerce-MyAccount-navigation li.is-active a,.woocommerce-MyAccount-navigation li a:hover{
  color:var(--arang);box-shadow:inset 3px 0 0 var(--cabai)}
.woocommerce-account .woocommerce-MyAccount-content{font-size:.92rem}
.woocommerce-account .woocommerce-MyAccount-content h3{font-weight:700}
.woocommerce form.login,.woocommerce form.register{border:2px solid var(--arang);
  border-radius:var(--r);background:var(--kartu)}

/* WooCommerce Blocks (cart/checkout berbasis blok) */
.wc-block-components-button:not(.is-link){background:var(--cabai);color:#fff;border-radius:999px;
  font-family:var(--sans);font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:.78rem}
.wc-block-components-button:not(.is-link):hover,.wc-block-components-button:not(.is-link):focus{
  background:var(--cabai-tua);color:#fff}
.wp-block-woocommerce-cart .wc-block-components-product-name,
.wp-block-woocommerce-checkout .wc-block-components-product-name{font-family:var(--display);
  font-weight:700;font-size:1rem;color:var(--arang)}
.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-family:var(--display);font-weight:800}
.wc-block-components-product-badge{border-radius:999px}
.wc-block-components-textarea,.wc-block-components-text-input input{border-radius:10px;border-color:var(--garis-tebal)}
.wc-block-components-checkout-step__heading .wc-block-components-title{font-family:var(--display);font-weight:700}

/* 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-family:var(--sans);font-size:.8rem;padding:10px 15px;border:2px solid var(--arang);
  border-radius:999px;background:var(--kartu);color:var(--arang)}
.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(--cabai);color:#fff;border-color:var(--cabai)}

/* ====== RESPONSIVE ====== */
@media (max-width:1080px){
  .prod-grid{grid-template-columns:repeat(3,1fr)}
  .kat-grid{grid-template-columns:repeat(2,1fr)}
  .sajian-grid{grid-template-columns:1fr;max-width:560px;margin-left:auto;margin-right:auto}
}
@media (max-width:820px){
  .seksi{padding-top:60px;padding-bottom:60px}
  .hero-in{grid-template-columns:1fr;gap:44px;padding-top:44px;padding-bottom:56px}
  .hero-foto{justify-self:center;width:min(100%,360px)}
  .hero-teks h1{max-width:none}
  .hero-angka{max-width:none}
  .stempel{left:-6px;bottom:12px;width:96px;height:96px;font-size:.76rem}
  .usp-in{grid-template-columns:repeat(2,1fr);row-gap:18px}
  .usp-item{justify-content:flex-start}
  .prod-grid{grid-template-columns:repeat(2,1fr);gap:14px}
  .promo-in{grid-template-columns:1fr;gap:40px}
  .promo-foto{order:-1}
  .piring.kecil{width:min(100%,280px)}
  .testi-grid{grid-template-columns:1fr}
  .foot-in{grid-template-columns:1fr;gap:28px}
  .menu-utama{gap:16px}
  .menu-utama a{font-size:.72rem}
  .nav-in{flex-wrap:wrap}
}
@media (max-width:560px){
  .prod-grid{grid-template-columns:1fr 1fr;gap:12px}
  .prod-info{padding:12px 12px 14px}
  .prod-info h3{font-size:.92rem}
  .prod .harga{font-size:1rem}
  .prod-kaki{flex-wrap:wrap}
  .btn-mini{padding:8px 13px;font-size:.62rem}
  .kat-grid{grid-template-columns:1fr}
  .btn{padding:12px 20px;font-size:.72rem}
  .tab-btn{padding:9px 17px;font-size:.7rem}
  .kicker{letter-spacing:.12em}
  .bar{font-size:.62rem;letter-spacing:.1em}
  .hero-angka b{font-size:1.2rem}
}

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