/*
Theme Name: Sekar
Theme URI: https://tokonaik.com
Author: TokoNaik
Author URI: https://tokonaik.com
Description: Tema toko online kosmetik & skincare untuk WooCommerce. Master template TokoNaik — apotek botani modern, jamu heritage, foto konteks Indonesia, siap clone per klien. Warna, nomor WhatsApp, foto hero, dan badge BPOM/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: sekar
Tags: e-commerce, woocommerce, custom-colors
*/

/* ====== FONT (self-host, subset latin, variable) ====== */
@font-face{
  font-family:'Newsreader';font-style:normal;font-weight:500 600;font-display:swap;
  src:url('assets/font/newsreader.woff2') format('woff2');
}
@font-face{
  font-family:'Newsreader';font-style:italic;font-weight:500;font-display:swap;
  src:url('assets/font/newsreader-italic.woff2') format('woff2');
}
@font-face{
  font-family:'Instrument Sans';font-style:normal;font-weight:400 600;font-display:swap;
  src:url('assets/font/instrument.woff2') format('woff2');
}

/* ====== TOKEN ======
   --botani/--amber/--latar diganti Customizer via inline style (functions.php). */
:root{
  --latar:#F5EFE4; --tinta:#231E17; --botani:#33523E; --amber:#A96D2C;
  --font-display:'Newsreader',Georgia,serif;
  --font-teks:'Instrument Sans',system-ui,sans-serif;
  /* turunan statis */
  --botani-tua:#24382B; --kartu:#FBF7EC; --abu:#6E6558;
  --garis:rgba(35,30,23,.16); --garis-terang:rgba(245,239,228,.22);
  --serif: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(--tinta);background:var(--latar);
  font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;position:relative}
/* Serat kertas halus di seluruh halaman — atmosfer etiket apotek */
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:2;opacity:.35;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E")}
img{max-width:100%;height:auto;display:block}
a{color:var(--botani);text-decoration:none}
a:hover{color:var(--amber)}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.14;letter-spacing:-.01em}
em{font-family:var(--serif);font-style:italic}
ins{text-decoration:none}
::selection{background:var(--amber);color:#fff}

/* 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:84px;padding-bottom:84px}
.kosong{text-align:center;color:var(--abu)}

/* Kicker etiket: kapital renggang diapit garis rangkap pendek */
.kicker{display:inline-flex;align-items:center;gap:14px;font-size:.72rem;font-weight:600;
  letter-spacing:.24em;text-transform:uppercase;color:var(--amber)}
.kicker::before,.kicker::after{content:'';width:34px;height:5px;flex:none;
  border-top:1px solid var(--amber);border-bottom:1px solid var(--amber);opacity:.55}
.kepala{margin-bottom:44px}
.kepala h2{font-size:clamp(1.7rem,3.4vw,2.5rem);margin-top:14px}
.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 .kicker{color:var(--latar)}
.kepala-terang .kicker::before,.kepala-terang .kicker::after{border-color:var(--amber)}
.kepala-terang h2{color:#fff}
.kepala-terang p{color:rgba(245,239,228,.75)}

/* Tombol */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;
  font-family:var(--sans);font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--tinta);background:transparent;border:1px solid var(--tinta);padding:13px 26px;
  transition:background .25s,color .25s,border-color .25s}
.btn:hover{background:var(--tinta);color:var(--latar)}
.btn-isi{background:var(--botani);border-color:var(--botani);color:#fff}
.btn-isi:hover{background:var(--botani-tua);border-color:var(--botani-tua);color:#fff}
.btn-wa{border-color:var(--botani);color:var(--botani)}
.btn-wa:hover{background:var(--botani);color:#fff}
.btn.besar{padding:16px 34px;font-size:.82rem}
.ik{display:inline-flex;vertical-align:-.18em}

/* ====== BAR & NAV ====== */
.bar{background:var(--botani-tua);color:var(--latar);text-align:center;font-size:.72rem;
  font-weight:600;letter-spacing:.18em;text-transform:uppercase;padding:9px 16px}
.situs-nav{position:sticky;top:0;z-index:50;background:var(--latar);
  border-bottom:1px solid var(--garis);box-shadow:0 1px 0 rgba(35,30,23,.04)}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding-top:16px;padding-bottom:16px}
.logo{font-family:var(--serif);font-weight:600;font-size:1.45rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--tinta)}
.logo:hover{color:var(--botani)}
.menu-utama{display:flex;align-items:center;gap:30px;list-style:none}
.menu-utama a{font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--tinta)}
.menu-utama a:hover{color:var(--amber)}
.item-tas .tas-link{position:relative;display:inline-flex}
.item-tas .hitung{position:absolute;top:-7px;right:-11px;background:var(--amber);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{border-bottom:1px solid var(--garis);overflow:hidden}
.hero-in{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;
  padding-top:72px;padding-bottom:72px}
.hero-teks h1{font-size:clamp(2.5rem,5.2vw,4rem);margin-top:20px;max-width:11ch}
.hero-teks p{color:var(--abu);font-size:1.06rem;max-width:46ch;margin-top:18px}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.hero-latin{margin-top:34px;padding-top:16px;border-top:1px solid var(--garis);
  font-size:.95rem;color:var(--amber);letter-spacing:.04em}
/* Ceruk apotek: lengkung penuh di atas, kaki lurus — bingkai khas SEKAR */
.hero-foto{position:relative;justify-self:end;width:min(100%,440px)}
.ceruk{display:block;overflow:hidden;border-radius:999px 999px 0 0;position:relative;z-index:1;
  background:var(--kartu)}
.ceruk img{aspect-ratio:4/5.4;object-fit:cover;width:100%}
.hero-foto::before{content:'';position:absolute;inset:0;transform:translate(-16px,16px);
  border:1px solid var(--amber);border-radius:999px 999px 0 0;opacity:.65}
.hero-foto figcaption{position:relative;z-index:1;text-align:center;font-size:.78rem;color:var(--abu);
  letter-spacing:.12em;text-transform:uppercase;padding-top:14px;padding-bottom:2px;
  border-bottom:1px solid var(--garis)}

/* Animasi masuk hero */
.naik{opacity:0;transform:translateY(18px);animation:sekar-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 sekar-naik{to{opacity:1;transform:none}}

/* ====== USP ====== */
.usp{border-bottom:1px solid var(--garis)}
.usp-in{display:grid;grid-template-columns:repeat(4,1fr);padding-top:26px;padding-bottom:26px}
.usp-item{display:flex;align-items:center;gap:14px;justify-content:center;color:var(--botani);
  border-left:1px solid var(--garis);font-size:.8rem;color:var(--abu);padding-left:12px;padding-right:12px}
.usp-item:first-child{border-left:none}
.usp-item .ik{color:var(--botani);flex:none}
.usp-item b{display:block;font-family:var(--sans);font-weight:600;color:var(--tinta);
  font-size:.8rem;letter-spacing:.06em}

/* ====== KATEGORI ====== */
.kat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.kat{display:block;background:var(--kartu);border:1px solid var(--garis);transition:border-color .3s}
.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.045)}
.kat:hover{border-color:var(--amber)}
.kat-label{display:flex;align-items:baseline;gap:12px;border-top:1px solid var(--garis);
  padding:14px 16px}
.kat-no{font-family:var(--serif);font-style:italic;font-size:1.05rem;color:var(--amber)}
.kat-nama{font-family:var(--serif);font-size:1.12rem;color:var(--tinta)}
.kat-jml{margin-left:auto;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--abu)}

/* ====== GRID PRODUK (front-page + fallback) ====== */
.seksi-koleksi{background:var(--kartu);border-top:1px solid var(--garis);border-bottom:1px solid var(--garis)}
.prod-grid{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.prod{background:var(--latar);border:1px solid var(--garis);display:flex;flex-direction:column;
  transition:border-color .3s}
.prod:hover{border-color:var(--amber)}
.prod-vis{position:relative;overflow:hidden}
.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(--amber);color:#fff;
  font-size:.64rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:5px 10px}
.pita.baru{background:var(--botani)}
.prod-info{display:flex;flex-direction:column;flex:1;align-items:flex-start;padding:16px 18px 20px}
.prod-info .jenis{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--amber);
  font-weight:600;margin-bottom:6px}
.prod-info h3{font-size:1.08rem;font-weight:500}
.prod-info h3 a{color:var(--tinta)}
.prod-info h3 a:hover{color:var(--botani)}
.prod-info .harga{font-weight:600;font-size:.94rem;margin-top:8px}
.prod-info .harga del{color:var(--abu);font-weight:400;margin-right:8px;opacity:.7}
.prod-info .btn{margin-top:14px;padding:10px 18px;font-size:.72rem}
.prod-info .bintang{margin-top:4px}

/* ====== RITUAL PAGI–MALAM (seksi khas — resep apotek di atas hijau botani) ====== */
.ritual{background:var(--botani-tua);color:var(--latar);padding-top:92px;padding-bottom:92px;
  position:relative;overflow:hidden}
.ritual::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='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.06'/%3E%3C/svg%3E")}
.ritual .wrap{position:relative}
.ritual-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;max-width:920px;
  margin-left:auto;margin-right:auto;border-top:1px double var(--garis-terang)}
.ritual-kolom{padding:38px 48px 10px;border-left:1px solid var(--garis-terang)}
.ritual-kolom:first-child{border-left:none}
.ritual-judul{display:flex;align-items:center;gap:12px;font-size:.8rem;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;color:var(--latar);margin-bottom:26px}
.ritual-judul .ik{color:var(--amber)}
.ritual-langkah{list-style:none}
.ritual-langkah li{display:flex;gap:18px;align-items:baseline;padding-top:13px;padding-bottom:13px;
  border-top:1px solid var(--garis-terang)}
.ritual-langkah li:first-child{border-top:none}
.ritual-langkah .no{font-family:var(--serif);font-style:italic;font-size:1.3rem;color:var(--amber);flex:none;width:34px}
.ritual-langkah a{font-family:var(--serif);font-size:1.1rem;color:#fff;border-bottom:1px solid transparent;
  transition:border-color .25s,color .25s}
.ritual-langkah a:hover{color:var(--latar);border-bottom-color:var(--amber)}
.ritual-langkah small{display:block;font-size:.8rem;color:rgba(245,239,228,.6);margin-top:2px}
.ritual-kaki{text-align:center;margin-top:44px;color:rgba(245,239,228,.75)}
.ritual-kaki a{color:var(--latar);font-weight:600;font-size:.8rem;letter-spacing:.14em;
  text-transform:uppercase;font-family:var(--sans);margin-left:8px;border-bottom:1px solid var(--amber)}
.ritual-kaki a:hover{color:var(--amber)}
.ritual-kaki .ik{margin-left:6px}

/* ====== BANNER BUNDLE (kupon apotek: bingkai rangkap) ====== */
.bundle{display:grid;grid-template-columns:.9fr 1.1fr;gap:0;background:var(--kartu);
  border:1px solid var(--tinta);position:relative}
.bundle::after{content:'';position:absolute;inset:7px;border:1px dashed var(--garis);pointer-events:none}
.bundle-foto{overflow:hidden}
.bundle-foto img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.bundle-teks{padding:44px 48px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
  position:relative;z-index:1}
.bundle-teks h2{font-size:clamp(1.6rem,2.8vw,2.2rem);margin-top:12px}
.bundle-teks p{color:var(--abu);margin-top:12px;max-width:44ch}
.bundle-harga{margin-top:18px;margin-bottom:22px;font-size:1.05rem;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.bundle-harga del{color:var(--abu);opacity:.7}
.bundle-harga b{font-family:var(--serif);font-size:1.7rem;font-weight:600}
.bundle-harga .hemat{font-size:.7rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--amber);border:1px solid var(--amber);padding:4px 9px}

/* ====== TESTIMONI ====== */
.seksi-testi{background:var(--kartu);border-top:1px solid var(--garis);border-bottom:1px solid var(--garis)}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.testi{background:var(--latar);border:1px solid var(--garis);padding:30px 28px;position:relative}
.kutip{font-family:var(--serif);font-style:italic;font-size:3.4rem;line-height:0;display:block;
  color:var(--amber);margin-top:18px;margin-bottom:8px}
.testi p{font-size:.95rem;color:var(--tinta)}
.testi-nama{margin-top:18px;padding-top:14px;border-top:1px solid var(--garis);
  font-family:var(--serif);font-size:1.02rem}
.testi-nama small{display:block;font-family:var(--sans);font-size:.72rem;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(1.7rem,3.2vw,2.4rem);margin-top:14px}
.cta-wa p{color:var(--abu);max-width:520px;margin:14px auto 28px}

/* ====== FOOTER ====== */
.situs-footer{background:var(--botani-tua);color:rgba(245,239,228,.8);margin-top:0}
.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.3rem}
.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(--amber);margin-bottom:16px}
.situs-footer a{display:inline-flex;align-items:center;gap:8px;color:rgba(245,239,228,.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(245,239,228,.55)}
.foot-bawah a{font-size:.78rem;color:rgba(245,239,228,.55);text-decoration:underline}
.wa-float{position:fixed;right:22px;bottom:22px;z-index:60;width:54px;height:54px;border-radius:50%;
  background:var(--botani);color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 18px rgba(35,30,23,.28);transition:transform .25s,background .25s}
.wa-float:hover{transform:translateY(-3px);background:var(--botani-tua);color:#fff}

/* ====== KONTEN HALAMAN (index/page) ====== */
.konten-halaman{padding-top:64px;padding-bottom:84px}
.judul-halaman{font-size:clamp(1.8rem,3.4vw,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: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:8px 12px;
  border:1px solid var(--garis);background:var(--kartu);color:var(--tinta)}

/* Tombol Woo */
.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(--botani);color:#fff;border-radius:0;font-family:var(--sans);font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;font-size:.76rem;padding:13px 24px}
.woocommerce .button:hover, .woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover{background:var(--botani-tua);color:#fff}
.woocommerce a.button.loading::after,.woocommerce button.button.loading::after{color:#fff}

/* Badge sale */
.woocommerce span.onsale{background:var(--amber);border-radius:0;min-height:auto;min-width:auto;
  font-size:.64rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  padding:5px 10px;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:1px solid var(--garis);padding-bottom:18px;text-align:left;transition:border-color .3s}
.woocommerce ul.products li.product:hover{box-shadow:none;transform:none;border-color:var(--amber)}
.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;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(--serif);font-weight:500;font-size:1.05rem;padding:14px 16px 4px;color:var(--tinta)}
.woocommerce div.product p.price, .woocommerce div.product span.price,
.woocommerce ul.products li.product .price{color:var(--tinta);font-family:var(--sans);font-weight:600;font-size:.92rem}
.woocommerce ul.products li.product .price{padding-left:16px;padding-right:16px}
.woocommerce ul.products li.product .price del{color:var(--abu);font-weight:400;opacity:.7}
.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(--tinta);border:1px solid var(--tinta);padding:10px 18px}
.woocommerce ul.products li.product .button:hover{background:var(--tinta);color:var(--latar)}
.woocommerce .star-rating span::before, .woocommerce p.stars a{color:var(--amber)}

/* Produk single */
.woocommerce div.product .product_title{font-family:var(--serif);font-weight:500;
  font-size:clamp(1.7rem,3vw,2.3rem);line-height:1.15}
.woocommerce div.product p.price{font-size:1.15rem;margin:10px 0 16px}
.woocommerce div.product p.price del{opacity:.5}
.woocommerce div.product .woocommerce-product-details__short-description{color:var(--abu);font-size:.95rem}
.woocommerce div.product div.images img{background:var(--kartu)}
.woocommerce div.product form.cart{margin:22px 0}
.woocommerce div.product form.cart div.quantity .qty{height:44px;border:1px solid var(--garis);
  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(--botani)}
.badge-produk{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}
.badge-izin{display:inline-flex;align-items:center;gap:7px;font-size:.68rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--botani);border:1px solid var(--botani);
  padding:5px 11px}
.badge-izin .ik{color:var(--amber)}
.akordion-produk{margin-top:24px;border-top:1px solid var(--garis)}
.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(--serif);font-size:1.05rem;padding-top:15px;padding-bottom:15px;color:var(--tinta)}
.akordion summary::-webkit-details-marker{display:none}
.akordion summary::after{content:'+';font-family:var(--serif);font-size:1.35rem;color:var(--amber);
  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:.14em;text-transform:uppercase;font-weight:600;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(--amber)}
.woocommerce .related.products>h2,.woocommerce .upsells.products>h2{font-family:var(--serif);
  font-weight:500;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:0}

/* Notifikasi */
.woocommerce-message, .woocommerce-info{border-top-color:var(--botani);background:var(--kartu);
  color:var(--tinta);font-size:.88rem}
.woocommerce-message::before, .woocommerce-info::before{color:var(--botani)}
.woocommerce-error{font-size:.88rem}

/* Cart */
.woocommerce table.shop_table{border:none;border-top:1px solid var(--garis);border-radius:0}
.woocommerce table.shop_table th{font-family:var(--sans);font-size:.72rem;letter-spacing:.16em;
  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(--serif);font-size:1.05rem;color:var(--tinta)}
.woocommerce-cart table.cart img{width:64px;background:var(--kartu)}
.woocommerce-cart table.cart td.actions .coupon .input-text{border:1px solid var(--garis);
  padding:11px;background:var(--kartu);font-family:var(--sans)}
.woocommerce a.remove{color:var(--abu)!important;border-radius:0;font-weight:400}
.woocommerce a.remove:hover{background:var(--amber);color:#fff!important}
.woocommerce .cart-collaterals .cart_totals{background:var(--kartu);padding:26px;border:1px solid var(--garis)}
.woocommerce .cart-collaterals .cart_totals h2{font-size:1.4rem;font-weight:500;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);padding:11px 12px;background:var(--kartu);font-family:var(--sans);
  font-size:.9rem;color:var(--tinta)}
.woocommerce form .form-row input.input-text:focus,.woocommerce form .form-row textarea:focus{
  border-color:var(--botani);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(--serif);font-weight:500;font-size:1.4rem}
.woocommerce-checkout #payment{background:var(--kartu);border-radius:0;border:1px solid var(--garis)}
.woocommerce-checkout #payment div.payment_box{background:var(--latar);border-radius:0;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:1px solid var(--garis);background:var(--kartu)}
.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(--tinta);box-shadow:inset 3px 0 0 var(--amber)}
.woocommerce-account .woocommerce-MyAccount-content{font-size:.92rem}
.woocommerce-account .woocommerce-MyAccount-content h3{font-weight:500}
.woocommerce form.login,.woocommerce form.register{border:1px solid var(--garis);border-radius:0;background:var(--kartu)}

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

/* 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 14px;border:1px solid var(--garis);
  background:var(--kartu);color:var(--tinta)}
.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(--botani);color:#fff;border-color:var(--botani)}

/* ====== RESPONSIVE ====== */
@media (max-width:1080px){
  .prod-grid{grid-template-columns:repeat(3,1fr)}
  .kat-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:820px){
  .seksi{padding-top:60px;padding-bottom:60px}
  .hero-in{grid-template-columns:1fr;gap:40px;padding-top:48px;padding-bottom:56px}
  .hero-foto{justify-self:center;width:min(100%,380px)}
  .hero-teks h1{max-width:none}
  .usp-in{grid-template-columns:repeat(2,1fr);row-gap:18px}
  .usp-item{border-left:none;justify-content:flex-start}
  .prod-grid{grid-template-columns:repeat(2,1fr);gap:16px}
  .ritual-grid{grid-template-columns:1fr}
  .ritual-kolom{border-left:none;border-top:1px solid var(--garis-terang);padding:32px 8px 6px}
  .ritual-kolom:first-child{border-top:none}
  .bundle{grid-template-columns:1fr}
  .bundle-teks{padding:32px 26px}
  .testi-grid{grid-template-columns:1fr}
  .foot-in{grid-template-columns:1fr;gap:28px}
  .menu-utama{gap:18px}
  .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 16px}
  .prod-info h3{font-size:.95rem}
  .prod-info .btn{padding:9px 12px;font-size:.66rem}
  .kat-grid{grid-template-columns:1fr}
  .btn{padding:12px 18px;font-size:.72rem}
  .kicker{letter-spacing:.18em}
  .bar{font-size:.62rem;letter-spacing:.12em}
}

/* 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}
}
