:root {
  /* Kazoku core scale (replaces old Barik RED scale) */
  --barik-50:  #F4F5F7;   /* Steel Silver / soft surface */
  --barik-100: #EEF1F6;
  --barik-200: #DDE3EE;
  --barik-300: #C6D0E1;
  --barik-400: #8FA1BF;
  --barik-500: #55698F;
  --barik-600: #2B385A;
  --barik-700: #1A233E;   /* PRIMARY (Deep Indigo) */
  --barik-800: #121A30;
  --barik-900: #0B1224;

  /* Ink / text (no pure black) */
  --ink-900: var(--barik-700); /* default text */
  --ink-800: var(--barik-800);
  --ink-700: #2B385A;          /* slightly softer headings/subtext */
  --ink-500: #55698F;          /* muted text */
  --ink-400: #8FA1BF;

  /* Backgrounds & surfaces */
  --bg: #FFFFFF;               /* main background */
  --surface: #FFFFFF;          /* cards */
  --surface-2: #F4F5F7;        /* Steel Silver blocks */

  /* Lines & borders */
  --line: rgba(26, 35, 62, 0.12);
  --line-strong: rgba(26, 35, 62, 0.18);

  /* Action (conversion) */
  --action: #2D5A42;           /* Add to cart */
  --action-hover: #1E3D2C;     /* Add to cart hover */
  --action-ink: #FFFFFF;

  /* Checkout / secure actions */
  --checkout: var(--barik-700);
  --checkout-hover: var(--barik-800);
  --checkout-ink: #FFFFFF;

  /* Accent (use sparingly) */
  --accent: #BC7C56;           /* Brushed Copper */
  --accent-soft: rgba(188, 124, 86, 0.14);
  --accent-ink: var(--barik-700);

  /* System semantic (avoid red per guide) */
  --warn: var(--accent);
  --warn-hover: #A86A47;
  --danger: var(--barik-800);
  --danger-hover: var(--barik-900);

  /* UI tokens */
  --muted: var(--ink-500);
  --radius-sm: 4px;   /* tags, badge, input */
  --radius-md: 8px;   /* buttons, cards */

  --container: 1160px;

  /* Shadows */
  --shadow-1: 0 10px 30px rgba(11, 18, 36, 0.10);
  --shadow-2: 0 14px 44px rgba(11, 18, 36, 0.14);
  --shadow:   0 18px 40px rgba(11, 18, 36, 0.10);

  /* Focus */
  --focus: 0 0 0 4px rgba(26, 35, 62, 0.18);

  /* Base elevation (resting) */
  --btn-shadow-sm: 0 2px 6px rgba(11,18,36,.12);
  --btn-shadow-md: 0 6px 14px rgba(11,18,36,.16);

  /* Primary / System (Indigo) */
  --btn-primary-shadow: 0 6px 14px rgba(26,35,62,.28);
  --btn-primary-shadow-hover: 0 10px 22px rgba(26,35,62,.32);

  /* Add to Cart (Green) */
  --btn-cart-shadow: 0 6px 14px rgba(45,90,66,.28);
  --btn-cart-shadow-hover: 0 10px 22px rgba(45,90,66,.34);

  /* Pressed */
  --btn-shadow-active: 0 2px 6px rgba(11,18,36,.22);
}

* {
    box-sizing: border-box
}
html, body {
  background: var(--bg);
  color: var(--ink-900);

    height: 100%
}

body {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  letter-spacing: -0.01em; /* bikin tajam */
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.page {
    padding: 32px 0 64px
}
.container {
    width: min(var(--container), calc(100% - 20px));
    margin: 0 auto;
    padding: 0 15px;
}
/* =========================
   Add to Cart Toast (Barik)
   ========================= */

.cart-toast {
    position: fixed;
    top: 24px;
    right: 24px;
    z-index: 9999;
    pointer-events: none;
    opacity: 0;
    transform: translateY(-12px) scale(.98);
    transition: opacity .28s ease, transform .32s ease;
}
.cart-toast.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}
.cart-toast-inner {
    display: grid;
    grid-template-columns: 36px 1fr auto 24px;
    gap: 12px;
    align-items: center;
    min-width: 320px;
    max-width: 420px;
    background: var(--barik-700);
    color: #fff;
    border-radius: var(--radius-sm);
    padding: 14px 16px;
    box-shadow: var(--shadow-2);
    border: 1px solid rgba(255, 255, 255, .10);
}
.cart-toast-icon {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .14);
    display: grid;
    place-items: center;
    font-weight: 700;
    font-size: 16px;
}
.cart-toast-title {
    font-weight: 900;
    font-size: 13px;
    letter-spacing: .01em;
}
.cart-toast-qty { display: inline;}
.cart-toast-text {
    font-size: 12px;
    opacity: .9;
    margin-top: 2px;
}
.cart-toast-action {
    font-size: 12px;
    font-weight: 800;
    color: #fff;
    text-decoration: none;
    padding: 6px 10px;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(255, 255, 255, .35);
    transition: background .18s ease, transform .12s ease;
}
.cart-toast-action:hover {
    background: rgba(255, 255, 255, .2);
    transform: translateY(-1px);
    color: #fff;
}
.cart-toast-close {
    border: 0;
    background: transparent;
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    opacity: .75;
}
.cart-toast-close:hover {
    opacity: 1
}

span#toastProduct a {
    color: #fff;
    font-weight: 600;
}

/*Utilities*/
.two-sided {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
}


/* Mobile (if later shown) */
@media (max-width: 820px) {
    .two-sided {
        grid-template-columns: auto;
    }
}

/*  From old stylesheet.css  */
.category-banner-ban {
  position: relative;
}


.cst-title {
    clear: both;
    padding-top: 60px;
    margin: 0;
}

/*Buttons*/
.btn-ghost {
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45em;

  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .02em;
  line-height: 1.2;

  padding: 10px 18px;
  border-radius: var(--radius-sm);
  border: 1px solid transparent;

  background: transparent;
  color: var(--ink-900);
  cursor: pointer;
  text-decoration: none;

  transition:
    background-color .18s ease,
    border-color .18s ease,
    color .18s ease,
    box-shadow .18s ease,
    transform .06s ease;
}

.btn:focus-visible {
  outline: none;
  box-shadow: var(--focus);
}

.btn:active {
  transform: translateY(1px);
}

.btn[disabled],
.btn.disabled {
  opacity: .55;
  pointer-events: none;
}

.btn-primary {
  background: var(--checkout);
  color: var(--checkout-ink);
  border: 1px solid var(--checkout);
  box-shadow: var(--btn-primary-shadow);
}

.btn-primary:hover,
.btn-primary:focus {
  background: var(--checkout-hover);
  border-color: var(--checkout-hover);
  box-shadow: var(--btn-primary-shadow-hover);
}

.btn-primary:active{
  transform: translateY(1px);
  box-shadow: var(--btn-shadow-active);
}

/* Add to cart (commerce-only) */
.btn-addtocart,
#button-cart{
  background: var(--action);
  color: var(--action-ink);
  border: 1px solid var(--action);
  box-shadow: var(--btn-cart-shadow);
}

.btn-addtocart:hover,
#button-cart:hover{
  background: var(--action-hover);
  border-color: var(--action-hover);
  box-shadow: var(--btn-cart-shadow-hover);
  color: var(--action-ink);
}

.btn-addtocart:active,
#button-cart:active{
  transform: translateY(1px);
  box-shadow: var(--btn-shadow-active);
}

/* Buy / Buy Now (leads to checkout) */
.btn-buy,
.btn-buynow{
  background: var(--checkout);
  color: var(--checkout-ink);
  border: 1px solid var(--checkout);
  box-shadow: var(--btn-primary-shadow);
}

.btn-buy:hover,
.btn-buynow:hover{
  background: var(--checkout-hover);
  border-color: var(--checkout-hover);
  box-shadow: var(--btn-primary-shadow-hover);
}

.btn-buy:active,
.btn-buynow:active{
  transform: translateY(1px);
  box-shadow: var(--btn-shadow-active);
}

/* Optional: if you want "dual CTA" look nicer */
.pdp-cta-group{
  display:flex;
  gap:10px;
  align-items:stretch;
}
.pdp-cta-group .btn{
  flex:1;
  border-radius: var(--radius-sm);
}


.btn-warning {
  background: var(--warn);
  color: #fff;
  border-color: var(--warn);
}

.btn-warning:hover {
  background: var(--warn-hover);
  border-color: var(--warn-hover);
}

.btn-warning:focus,
.btn-warning.active {
  box-shadow: var(--focus);
}
.btn-danger {
  background: var(--danger);
  color: #fff;
  border-color: var(--danger);
}

.btn-danger:hover {
  background: var(--danger-hover);
  border-color: var(--danger-hover);
}

.btn-danger:focus,
.btn-danger.active {
  box-shadow: var(--focus);
}
.btn-secondary {
  background: #fff;
  color: var(--ink-900);
  border-color: var(--line);
}

.btn-secondary:hover {
  background: var(--surface-2);
  border-color: var(--line-strong);
}

.btn-secondary:focus,
.btn-secondary.active {
  box-shadow: var(--focus);
}

.btn-outline {
  background: transparent;
  color: var(--barik-700);
  border-color: var(--barik-700);
}

.btn-outline:hover {
  background: var(--barik-700);
  border-color: var(--barik-700);
  color: #fff;
}

.btn-outline:focus {
  box-shadow: var(--focus);
}


.btn-sm {
  padding: 7px 12px;
  font-size: 13px;
}

.btn-lg {
  padding: 14px 26px;
  font-size: 15px;
  font-weight: 600;
}




/* Barik Chef Pagination (OpenCart default markup) */
.pagination{
  --pg-accent: var(--barik-700);
  --pg-ink: var(--ink-900, #0f172a);
  --pg-muted: var(--muted, #6b7280);
  --pg-bg: #fff;
  --pg-border: var(--line);
  --pg-shadow: var(--shadow-1, 0 10px 30px rgba(11, 35, 68, .10));
  --pg-radius: 12px;

  display:flex;
  align-items:center;
  justify-content:flex-end; /* common for category pages */
  gap:8px;
  padding:0;
  list-style:none;
  flex-wrap:wrap;
}

/* li wrappers */
.pagination > li{
  margin:0;
  padding:0;
}

/* clickable items */
.pagination > li > a,
.pagination > li > span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:40px;
  height:40px;
  padding:0 12px;
  border-radius:var(--pg-radius);
  border:1px solid var(--pg-border);
  background:var(--pg-bg);
  color:var(--pg-ink);
  text-decoration:none;
  font-weight:600;
  font-size:14px;
  line-height:1;
  box-shadow:0 1px 0 rgba(15, 23, 42, .04);
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease, color .12s ease;
}

/* active page */
.pagination > li.active > span{
  background:var(--pg-accent);
  border-color:transparent;
  color: #fff;
  box-shadow: 0 10px 24px rgba(11, 18, 36, 0.14);
}

/* hover / focus */
.pagination > li > a:hover{
  transform:translateY(-1px);
  border-color: rgba(26, 35, 62, 0.28);
  box-shadow:0 14px 32px rgba(11, 35, 68, .14);
}

.pagination > li > a:focus{
  outline:none;
}

.pagination > li > a:focus-visible{
  box-shadow: var(--focus), 0 14px 32px rgba(11, 18, 36, 0.12);
  border-color: rgba(26, 35, 62, 0.32);
}

/* arrow buttons (">" and ">|") should look like controls */
.pagination > li:last-child > a,
.pagination > li:nth-last-child(2) > a{
  font-weight:700;
  letter-spacing:.2px;
}

/* disabled support (if OpenCart renders .disabled) */
.pagination > li.disabled > span,
.pagination > li.disabled > a{
  opacity:.45;
  cursor:not-allowed;
  pointer-events:none;
  box-shadow:none;
}

/* tighter on mobile */
@media (max-width: 480px){
  .pagination{
    justify-content:center;
  }

  .pagination > li > a,
  .pagination > li > span{
    min-width:38px;
    height:38px;
    padding:0 10px;
    border-radius:10px;
  }
}


.pagination>li:first-child>a, .pagination>li:first-child>span {
    border-top-left-radius: var(--pg-radius);
    border-bottom-left-radius: var(--pg-radius);
}

.pagination>li:last-child>a, .pagination>li:last-child>span {
    border-top-right-radius: var(--pg-radius);
    border-bottom-right-radius: var(--pg-radius);
}

/*Homepage*/
.new-arrivals-sec {
    background: url('/image/catalog/template-image/arrival-banner.png') center / cover no-repeat;
    padding: 60px 0;
    color: #fff;
}

.new-arrivals-right {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 242px;
}

.new-arrivals-sec .row {
  align-items: center;
}

.new-arrivals-section h2 {
  color: #fff;
  margin-bottom: 15px;
}

.new-arrivals-section p {
    color: #eaeaea;
}


/*FAQ*/
/*
#content .faq-content { max-height: 0; overflow: hidden; transition: max-height 0.3s ease-out; }

#content .faq-item.active .faq-content { max-height: 100% !important; display: block !important; }

#content .faq-content {
  overflow: hidden;
  transition: max-height .35s ease;
}

#content .faq-item .faq-icon {
  transition: transform .25s ease;
}

#content .faq-item.active .faq-icon {
  transform: rotate(0deg);
}
*/

.kz-bc {
  max-width: var(--container);
  margin: 10px auto 14px auto;
}

.kz-bc .breadcrumb.kz-bc__list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  background: none;
}

.kz-bc__item{
  display:inline-flex;
  align-items:center;
  font-size:12px;
  line-height:1.2;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-weight:300;
  color:rgba(15,23,42,.55);
  padding: 0 !important;
}

.kz-bc__item + .kz-bc__item::before{
  content:"›";
  margin:0 12px;
  color:rgba(15,23,42,.35);
  transform:translateY(-.5px);
}

.kz-bc__item a{
  color:inherit;
  text-decoration:none;
}

.kz-bc__item a:hover{
  color:rgba(15,23,42,.78);
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-color:rgba(15,23,42,.25);
}

.kz-bc__item[aria-current="page"] {
  color: var(--ink-700);
  font-weight: 400;
}

@media (max-width:576px){
  .kz-bc__item{ font-size:12px; letter-spacing:.06em; }
  .kz-bc__item + .kz-bc__item::before{ margin:0 10px; }
}


/* ===== Filter panel overall feel (lighter + premium) ===== */
.kz-filter__panel{
  background:var(--bg);
}

/* Header "Filter" */
.kz-filter__head{
  padding:14px 16px;
  border-bottom:1px solid var(--line);
}
.kz-filter__head h3{
  font-size:13px;
  font-weight:700;
  letter-spacing:.3px;
  text-transform:uppercase;
  color:var(--ink-900);
}

/* Section block */
.kz-filter__section{
  padding:0;
  border-bottom:1px solid var(--line);
}
.kz-filter__section:last-child{
  border-bottom:none;
}

/* Replace your label style -> Zwilling-ish (not huge, not too formal) */
.kz-filter__label{
  margin:0;
  padding:14px 16px;
  font-size:14px;
  font-weight:600;          /* less heavy than 700/800 */
  letter-spacing:.1px;      /* not shouty */
  text-transform:none;      /* avoid all caps for this */
  color:var(--ink-900);

  display:flex;
  align-items:center;
  justify-content:space-between;
}

/* Optional icon on the right (+ / −) using pseudo (no extra markup) */
/* Add class .is-open on .kz-filter__section when expanded */
.kz-filter__label::after{
  content:"+";
  font-weight:500;
  color:var(--ink-400);
  font-size:18px;
  line-height:1;
  transform:translateY(-1px);
}
.kz-filter__section.is-open .kz-filter__label::after{
  content:"–";
}

/* Content area (list) */
.kz-filter__list{
  padding:2px 16px 14px;
  display:flex;
  flex-direction:column;
  gap:0;
}

/* Make list items simple like Zwilling: no cards, no borders */
.kz-filter__item{
  border:none;
  background:transparent;
  border-radius:0;
  padding:10px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;

  transform:none;
}

/* hairline separator between items */
.kz-filter__item + .kz-filter__item{
  border-top:1px solid rgba(26,35,62,.08);
}

/* text styling */
.kz-filter__item span{
  font-size:13px;
  font-weight:500;
  color:var(--ink-900);
}
.kz-filter__item small{
  font-size:12px;
  color:var(--ink-400);
}

/* hover: subtle, not card-y */
.kz-filter__item:hover{
  border-color:transparent;
  background:transparent;
}
.kz-filter__item:hover span{
  color:var(--ink-800);
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-thickness:1px;
}

/* focus */
.kz-filter__item:focus-visible{
  outline:none;
  box-shadow:var(--focus);
  border-radius:var(--radius-sm);
  padding-left:8px;
  padding-right:8px;
}

/* Accordion behavior (optional): collapse/expand with smooth height) */
.kz-filter__section .kz-filter__list{
  max-height:0;
  overflow:hidden;
  transition:max-height .45s ease;
}
.kz-filter__section.is-open .kz-filter__list{
  max-height:520px; /* enough for most lists */
}


/* ================================
   Kazoku Minimal Category Nav
   Calm • Knife-first • No borders
================================ */

/* Container */
.nav-card{
  background:#FFFFFF;
}

/* Title */
.nav-title{
  padding:16px 0 10px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.35px;
  text-transform:uppercase;
  color:#1A233E;
}

/* Reset list */
.nav-list,
.nav-sublist{
  list-style:none;
  margin:0;
  padding:0;
}

/* Top-level item */
.nav-item > a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 0;
  text-decoration:none;

  color:#1A233E;
  font-size:14px;
  font-weight:600;
  line-height:1.35;

  transition:opacity .15s ease;
}

.nav-item > a:hover{
  opacity:.7;
}

/* Active category */
.nav-item > a.is-active{
  font-weight:700;
}

.nav-list > .nav-item > a::after {
  content: "+";
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  color: #BC7C56;
  margin-left: 12px;
}

/* Plus / minus — ultra subtle */
.nav-item:has(> .nav-sublist) > a::after{
  content:"+";
  font-size:14px;
  font-weight:400;
  line-height:1;
  color:#BC7C56;          /* brushed copper */
  margin-left:12px;
}

/* Expanded state */
.nav-item:has(> .nav-sublist) > a.is-active::after{
  content:"–";
}

/* Sublist */
.nav-sublist{
  padding:4px 0 8px 14px; /* light indent only */
}

/* Sub item */
.nav-sublist > li > a{
  display:block;
  padding:6px 0;
  text-decoration:none;

  font-size:13px;
  font-weight:500;
  line-height:1.4;

  color:rgba(26,35,62,.75);

  transition:opacity .15s ease;
}

.nav-sublist > li > a:hover{
  opacity:.7;
}

/* Active sub item */
.nav-sublist > li > a.is-active{
  color:#1A233E;
  font-weight:600;
}


/* Mobile tighten */
@media (max-width:768px){
  .kz-filter__label{padding:12px 14px}
  .kz-filter__list{padding:2px 14px 12px}
}


/* Mobile */
@media (max-width:520px) {

    .new-arrivals-right {
        height: unset;
    }

    .cart-toast {
        right: 12px;
        left: 12px;
        top: 12px;
    }
    .cart-toast-inner {
        min-width: auto;
        width: 100%;
    }
}


/*Section Title*/
.kz-sec__head{
  margin: 0 0 14px;
}

.kz-sec__kicker{
  margin: 0 0 8px;
  font-size: 12px;
  line-height: 1.2;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 800;
  color: rgba(11,18,36,.58);
}

.kz-sec__title{
  margin: 0;
  font-size: 22px;
  line-height: 1.15;
  letter-spacing: -0.02em;
  font-weight: 800;
  color: #0b1224;
}

.kz-sec__sub{
  margin: 8px 0 0;
  font-size: 13px;
  line-height: 1.65;
  color: rgba(11,18,36,.70);
  max-width: 62ch;
}

@media (max-width: 767px){
  .kz-sec__title{ font-size: 20px; }
}


/*Bottom Category Description*/
/* ===============================
   Kazoku – Category Description
   Target: .description-bottom only
   (No HTML change required)
================================ */

/*

.cs__description .description-bottom {
  background-color: #000;
  padding: 90px 20px;
  background: url('/image/catalog/template-image/slider_8_new.png') center/cover no-repeat;
}
.description-bottom p,
.description-bottom h2,
.description-bottom ul {
  margin: 0 auto;
}
.cs__description .description-bottom h2 {
  color: #000;
}
.cs__description .description-bottom p {
  color: #3a3a3a;
  margin-top: 28px;
}
.cs__description .description-bottom ul li {
  color: #000;
  list-style: disc;
  font-size: 16px;
  margin: 12px 0;
}
.cs__description .description-bottom ul {
  margin: 30px auto 30px;
  border-bottom: 1px #fff solid;
  padding-bottom: 30px;
}

.cs__description .description-bottom * {
    max-width: 900px;
}

*/

.cs__description {
    background: url(/image/catalog/template-image/slider_8_new.png) center / cover no-repeat;
}

.description-bottom{
  margin: 18px 0 0;
  padding: 40px 20px;
  border-radius: 6px;
/*  border: 1px solid rgba(11,18,36,.10);*/
  background-color: linear-gradient(180deg, rgba(255,255,255,.92), rgba(245,246,248,.92));
/*  box-shadow: 0 14px 34px rgba(11,18,36,.08);*/

  color:#1a233e;
  font-size:15px;
  line-height:1.75;
  letter-spacing:.01em;
  max-width: var(--container);
  margin: 0 auto;
}

/* headings */
.description-bottom h2, section.text-center h3 {
  margin: 0 0 10px;
  padding: 0;
  font-size: 25px;
  line-height: 1.25;
  font-weight: 900;
  letter-spacing: .01em;
  color: #0b1224;
  position: relative;
}

/* micro accent underline (copper-ish) */
.description-bottom h2::after{
  content:"";
  display:block;
  width:46px;
  height:2px;
  margin-top:8px;
  border-radius:2px;
  background: linear-gradient(90deg, rgba(193,132,92,.92), rgba(193,132,92,.28));
  opacity:.9;
}

/* paragraph spacing */
.description-bottom p{
  margin: 0 0 12px;
  color: rgba(26,35,62,.88);
}

.description-bottom p:last-child{
  margin-bottom: 0;
}

/* bold */
.description-bottom b,
.description-bottom strong{
  color:#0b1224;
}


.description-bottom ol li b{
  font-weight: 400;
  color: inherit;
}

.description-bottom ol li > b:first-of-type{
  font-weight: 800;
  color: #0b1224;
}

/* list becomes premium feature rows */
.description-bottom ol{
  margin: 10px 0 30px;
  padding: 0;
  list-style: none;
  counter-reset: kzStep;
}

.description-bottom ol > li{
  counter-increment: kzStep;
  position: relative;

  margin: 10px 0;
  padding: 12px 12px 12px 44px;

  border-radius: 6px;
  border: 1px solid rgba(11,18,36,.10);
  background: rgba(255,255,255,.78);
  box-shadow: 0 10px 22px rgba(11,18,36,.06);

  color: rgba(26,35,62,.90);
}

/* number badge */
.description-bottom ol > li::before{
  content: counter(kzStep);
  position: absolute;
  left: 12px;
  top: 18px;

  width: 22px;
  height: 22px;
  border-radius: 999px;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 12px;
  font-weight: 900;
  color: #0b1224;

  background: linear-gradient(180deg, rgba(193,132,92,.22), rgba(11,18,36,.06));
  border: 1px solid rgba(193,132,92,.30);
}

/* subtle hover */
@media (hover:hover){
  .description-bottom ol > li:hover{
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(11,18,36,.10);
  }
}

/* section spacing */
.description-bottom h2 + p {
  margin-top: 2px;
}

/* mobile */
@media (max-width: 767px){
  .description-bottom{
    padding: 14px 14px;
    margin-top: 14px;
    font-size: 14px;
    line-height: 1.7;
  }

  .description-bottom h2{
    font-size: 17px;
  }

  .description-bottom ol > li{
    padding-left: 42px;
  }
}


/* ===============================
   Kazoku – UL styling
   Visual sibling of OL
================================ */

.description-bottom ul{
  margin: 10px 0 16px;
  padding: 0;
  list-style: none;
}

/* UL item card (same as OL) */
.description-bottom ul > li{
  position: relative;
  margin: 10px 0;
  padding: 12px 12px 12px 44px;

  border-radius: 6px;
  border: 1px solid rgba(11,18,36,.10);
  background: rgba(255,255,255,.78);
  box-shadow: 0 10px 22px rgba(11,18,36,.06);

  color: rgba(26,35,62,.90);
  line-height: 1.7;
}

/* UL marker (copper dot) */
.description-bottom ul > li::before{
  content: "";
  position: absolute;
  left: 15px;
  top: 18px;

  width: 8px;
  height: 8px;
  border-radius: 999px;

  background: linear-gradient(
    180deg,
    rgba(193,132,92,.95),
    rgba(193,132,92,.55)
  );

  box-shadow:
    0 0 0 3px rgba(193,132,92,.18);
}

/* hover match OL */
@media (hover:hover){
  .description-bottom ul > li:hover{
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(11,18,36,.10);
  }
}

/* bold handling:
   - first strong/b = label
   - others normal (SEO safe)
*/
.description-bottom ul li strong,
.description-bottom ul li b{
  font-weight: 400;
  color: inherit;
}

.description-bottom ul li > strong:first-of-type,
.description-bottom ul li > b:first-of-type{
  font-weight: 800;
  color: #0b1224;
}

/* mobile alignment */
@media (max-width: 767px){
  .description-bottom ul > li{
    padding-left: 42px;
  }

  .description-bottom ul > li::before{
    left: 14px;
  }
}



/*FAQ Section*/
.faq-sec {
    background-image: url(/image/catalog/template-image/faq-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 0;
}

.kz-action--wish, .kz-action--compare {
    display: none !important;
}


/*Product Rating*/
.kz-prod__rating{
  display:flex;
  align-items:center;
  gap:8px;
  margin:6px 0 8px;
  font-size:13px;
  line-height:1;
}

.kz-prod__rating .star{
  color:#d1d5db;
  font-size:14px;
  letter-spacing:1px;
}

.kz-prod__rating .star.is-on{
  color:#f59e0b;
}

.kz-prod__rating .prod-score{
  font-weight:600;
  color:#111827;
  white-space:nowrap;
}

.kz-prod__rating .muted{
  color:#6b7280;
  font-weight:400;
  margin-left:2px;
}