/* Jhumkhana — premium jewelry storefront custom styles */
:root{
  --gold:#C8A24D;
  --gold-light:#E4CFA5;
  --gold-dark:#a1802f;
  --ivory:#FAF7F2;
  --ivory-warm:#F3ECDF;
  --cream:#F7EFE3;
  --rose:#F5E6E4;
  --rose-deep:#D9A6A0;
  --burgundy:#5B2333;
  --burgundy-dark:#421828;
  --charcoal:#1F1A18;
  --muted:#8A7A72;
  --line:rgba(45,31,27,.12);
  /* Fraunces carries the personality: a variable serif with a SOFT axis
     that is actually used — higher on display headings, lower on product
     names — so headings read hand-cut rather than stock. Karla is the
     quiet counterpart and does not fight it. */
  --serif:'Fraunces', 'Cormorant Garamond', Georgia, serif;
  --sans:'Karla', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --script:'Great Vibes', cursive;
  --shadow-soft:0 20px 60px -30px rgba(45,31,27,.35);
  --shadow-lift:0 30px 80px -40px rgba(45,31,27,.5);
}
/* One fluid ramp for the whole site, so shop, product and checkout share
   the homepage's rhythm instead of each setting its own sizes. */
:root{
  --step--1:clamp(.78rem,.76rem + .1vw,.85rem);
  --step-0:clamp(.98rem,.95rem + .15vw,1.06rem);
  --step-1:clamp(1.2rem,1.1rem + .5vw,1.5rem);
  --step-2:clamp(1.6rem,1.35rem + 1.2vw,2.4rem);
  --step-3:clamp(2.3rem,1.7rem + 3vw,4.4rem);
}
h1,h2,h3,h4,.font-serif{font-variation-settings:"SOFT" 30,"opsz" 100}
html{scroll-behavior:smooth}
html,body{max-width:100%;overflow-x:hidden}
body{font-family:var(--sans);background:var(--ivory);color:var(--charcoal);line-height:1.6;-webkit-font-smoothing:antialiased}
body.dark{background:#141010;color:#f4ebe0}
body.dark .bg-white{background:#1e1815 !important}
body.dark .text-charcoal,body.dark .text-\[\#1F1A18\]{color:#f4ebe0 !important}
body.dark .border-line,body.dark .border-\[\#e8e0d3\]{border-color:rgba(255,255,255,.08) !important}
body.dark .bg-ivory,body.dark .bg-\[\#FAF7F2\]{background:#141010 !important}
body.dark .bg-cream,body.dark .bg-\[\#F7EFE3\]{background:#1a1512 !important}

/* Nothing — image, video, iframe, or a stray wide element — should ever be
   able to push the page wider than the screen. Height:auto only applies to
   img/video (content media); small inline icon SVGs keep their own
   width/height so this can't distort them. */
img,video{max-width:100%;height:auto}
svg,iframe,embed,object,canvas{max-width:100%}
table{max-width:100%}
* {min-width:0}

/* Padding must live INSIDE a declared width. Without this, every element that
   pairs `width:100%` with horizontal padding — .btn, .jk-google-btn, the auth
   cards, the checkout fields — renders its padding on top of the full width
   and pushes past its parent. On the login page that shifted the whole card
   ~50px to the right, which is why the Google button's centred label looked
   off-centre and "Forgot password?" fell off the screen. */
*,*::before,*::after{box-sizing:border-box}

.font-serif{font-family:var(--serif)}
.font-script{font-family:var(--script)}
.text-gold{color:var(--gold)}
.bg-gold{background:var(--gold)}
.bg-gold-grad{background:linear-gradient(135deg,#d9b878,#C8A24D 55%,#a1802f)}
.text-burgundy{color:var(--burgundy)}
.bg-burgundy{background:var(--burgundy)}
.bg-ivory{background:var(--ivory)}
.bg-cream{background:var(--cream)}
.bg-rose{background:var(--rose)}
.border-gold{border-color:var(--gold)}
.border-line{border-color:var(--line)}
.shadow-soft{box-shadow:var(--shadow-soft)}
.shadow-lift{box-shadow:var(--shadow-lift)}

/* Eyebrow */
.eyebrow{font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--gold);font-weight:600}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 26px;border-radius:999px;font-weight:600;font-size:14px;letter-spacing:.05em;transition:transform .25s ease,box-shadow .25s ease,background .25s;cursor:pointer;white-space:nowrap}
.btn-primary{background:var(--burgundy);color:#fff}
.btn-primary:hover{background:var(--burgundy-dark);transform:translateY(-2px);box-shadow:0 15px 40px -15px rgba(91,35,51,.6)}
.btn-gold{background:linear-gradient(135deg,#d9b878,#C8A24D);color:#1F1A18}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 15px 40px -15px rgba(200,162,77,.7)}
.btn-outline{background:transparent;border:1.5px solid var(--burgundy);color:var(--burgundy)}
.btn-outline:hover{background:var(--burgundy);color:#fff}
.btn-ghost{background:#fff;color:var(--charcoal);border:1px solid var(--line)}
.btn-ghost:hover{border-color:var(--gold);color:var(--burgundy)}

/* Divider ornament */
.ornament{display:flex;align-items:center;justify-content:center;gap:12px;color:var(--gold)}
.ornament::before,.ornament::after{content:'';height:1px;width:50px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}

/* Cards */
.card{background:#fff;border-radius:20px;border:1px solid var(--line);box-shadow:var(--shadow-soft);overflow:hidden;transition:transform .35s ease,box-shadow .35s ease}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lift)}

/* Product card */
.product-card{position:relative;background:#fff;border-radius:18px;overflow:hidden;border:1px solid var(--line);transition:transform .35s ease,box-shadow .35s ease}
.product-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lift)}
.product-media{position:relative;overflow:hidden;aspect-ratio:1/1;background:var(--ivory-warm)}
.product-media img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.product-card:hover .product-media img{transform:scale(1.08)}
.badge{position:absolute;top:12px;left:12px;z-index:3;background:var(--burgundy);color:#fff;font-size:11px;font-weight:600;padding:5px 10px;border-radius:999px;letter-spacing:.05em}
.badge-gold{background:linear-gradient(135deg,#d9b878,#C8A24D);color:#1F1A18}
.badge-muted{background:rgba(45,31,27,.78);color:#fff}
.wish{position:absolute;top:12px;right:12px;z-index:3;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.9);display:grid;place-items:center;cursor:pointer;transition:.25s;border:none}
.wish:hover{background:#fff;color:var(--burgundy);transform:scale(1.1)}
.wish.active{background:var(--burgundy);color:#fff}
.quick{position:absolute;left:0;right:0;bottom:0;z-index:4;background:rgba(255,255,255,.96);backdrop-filter:blur(6px);padding:12px;display:flex;gap:8px;transform:translateY(100%);transition:transform .35s ease}
.product-card:hover .quick{transform:translateY(0)}
/* Both children share the bar equally: min-width:0 stops the button's own text
   width acting as a floor, which previously made the two buttons uneven. */
.quick > *{flex:1 1 0;min-width:0}
.quick .quick-form{display:flex}
.quick .btn{padding:10px 14px;font-size:12px;flex:1 1 0;min-width:0}
.quick .btn.is-soldout{background:var(--muted);cursor:not-allowed;opacity:.75}
.quick .btn.is-soldout:hover{background:var(--muted);transform:none;box-shadow:none}

/* Category circle */
.cat-circle{width:112px;height:112px;border-radius:50%;overflow:hidden;background:var(--ivory-warm);border:2px solid #fff;box-shadow:0 15px 35px -18px rgba(45,31,27,.4);transition:transform .3s ease}
.cat-circle:hover{transform:translateY(-4px) scale(1.03)}
.cat-circle img{width:100%;height:100%;object-fit:cover}

/* Shop by Collection — single-line horizontal scroller */
.jk-cat-scroll{display:flex;flex-wrap:nowrap;gap:26px;overflow-x:auto;scroll-snap-type:x proximity;scroll-behavior:smooth;padding:6px 2px 16px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.jk-cat-scroll::-webkit-scrollbar{display:none}
.jk-cat-item{flex:0 0 auto;width:132px;scroll-snap-align:start;text-align:center;text-decoration:none;color:inherit}
.jk-cat-item .cat-circle{margin:0 auto}
.jk-cat-label{margin-top:12px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.jk-scroller--cats .jk-arrow{top:34px}
@media (max-width:640px){
	.jk-cat-scroll{gap:16px;padding-bottom:12px}
	.jk-cat-item{width:104px}
	.jk-cat-scroll .cat-circle{width:88px;height:88px}
	.jk-cat-label{font-size:11px}
}

/* Fade-in on scroll */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

/* Hero */
.hero{position:relative;overflow:hidden;background:linear-gradient(120deg,var(--cream) 0%,var(--rose) 100%)}
.hero-illus{position:absolute;inset:0;background-image:url('https://images.unsplash.com/photo-1611591437281-460bfbe1220a?auto=format&fit=crop&w=1800&q=80');background-size:cover;background-position:center;opacity:.9}
.hero-veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(250,247,242,.94) 0%,rgba(250,247,242,.65) 45%,rgba(250,247,242,0) 70%)}

/* Sticky header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(250,247,242,.85);backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--line)}
.site-header.scrolled{background:rgba(255,255,255,.95)}
.custom-logo-link{display:flex;align-items:center;flex:none}
.custom-logo-link img{height:44px;width:auto;max-width:220px;object-fit:contain}
@media (max-width:600px){.custom-logo-link img{height:34px;max-width:160px}}

/* Mega menu */
.mega{position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--line);box-shadow:0 30px 60px -30px rgba(45,31,27,.4);padding:30px 0;
	opacity:0;visibility:hidden;transform:translateY(-6px);pointer-events:none;
	transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s}
.has-mega{position:static}
.has-mega.open .mega,.has-mega:focus-within .mega{
	opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto;
	transition:opacity .2s ease,transform .2s ease,visibility 0s linear 0s}
.mega-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;align-items:start}
@media (max-width:1024px){.mega-grid{grid-template-columns:repeat(2,1fr);gap:22px}}
.mega-grid > div{min-width:0}
.mega-grid a{display:block;padding:6px 0;overflow-wrap:anywhere}
.has-mega > a{display:flex;align-items:center;gap:4px}
.has-mega > a .care{display:inline-block;transition:transform .2s ease}
.has-mega.open > a .care{transform:rotate(180deg)}

/* Floating actions */
.floating{position:fixed;right:18px;bottom:18px;display:flex;flex-direction:column;gap:10px;z-index:60}
/* Sign-in, register and password-reset pages have nothing to add to a cart
   and barely scroll, so the floating stack is pure obstruction there — at
   z-index 60 it sat directly on top of the "Forgot password?" link and made
   it unhittable on a phone. */
body.jk-auth-page .floating{display:none}
.fab{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;color:#fff;box-shadow:0 15px 35px -10px rgba(0,0,0,.35);cursor:pointer;transition:transform .25s;border:none}
.fab:hover{transform:translateY(-3px) scale(1.05)}
.fab-wa{background:#25D366}
.fab-cart{background:var(--burgundy);position:relative}
.fab-cart .count{position:absolute;top:-4px;right:-4px;background:var(--gold);color:#1F1A18;font-size:10px;font-weight:700;border-radius:999px;min-width:18px;height:18px;display:grid;place-items:center;padding:0 5px}
.fab-top{background:var(--charcoal);opacity:0;pointer-events:none;transition:.3s}
.fab-top.show{opacity:1;pointer-events:auto}

/* Mobile bottom nav */
.mob-nav{position:fixed;bottom:0;left:0;right:0;background:rgba(255,255,255,.94);-webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px);border-top:1px solid rgba(45,31,27,.08);display:none;grid-template-columns:repeat(5,1fr);z-index:55;padding:8px 6px calc(8px + env(safe-area-inset-bottom,0px));box-shadow:0 -8px 24px -16px rgba(45,31,27,.28)}
.mob-nav a{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10.5px;font-weight:600;letter-spacing:.01em;color:var(--muted);text-decoration:none;padding:3px 0}
.mob-nav .mn-ico{display:grid;place-items:center;width:46px;height:30px;border-radius:999px;transition:background .22s ease,color .22s ease,transform .22s ease}
.mob-nav .mn-ico svg{width:23px;height:23px;display:block;transition:transform .22s ease}
.mob-nav a:active .mn-ico{transform:scale(.9)}
.mob-nav a.active{color:var(--burgundy)}
.mob-nav a.active .mn-ico{background:linear-gradient(180deg,var(--rose),#f3dcd8);color:var(--burgundy)}
.mob-nav a.active .mn-ico svg{transform:translateY(-.5px)}
.mob-nav a:hover{color:var(--burgundy)}
@media (max-width:768px){.mob-nav{display:grid}body{padding-bottom:calc(70px + env(safe-area-inset-bottom,0px))}.floating{bottom:calc(84px + env(safe-area-inset-bottom,0px))}}

/* Toast */
.toast{position:fixed;top:20px;right:20px;left:20px;margin-left:auto;background:#fff;border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:12px;padding:14px 18px;box-shadow:var(--shadow-lift);z-index:100;width:max-content;max-width:min(320px,calc(100vw - 40px));transform:translateX(120%);transition:transform .35s ease}
.toast.show{transform:translateX(0)}

/* Skeleton */
.skeleton{background:linear-gradient(90deg,#eee 0%,#f5f5f5 50%,#eee 100%);background-size:200% 100%;animation:sk 1.4s infinite;border-radius:8px}
@keyframes sk{from{background-position:200% 0}to{background-position:-200% 0}}

/* Search overlay */
/* --- Search overlay -------------------------------------------------------
   The search input previously carried border:none;box-shadow:none inline, so
   there was no visible field at all — just grey placeholder text floating on
   white, which read as disabled rather than "type here". It is now a real,
   filled, tappable field. */
.search-overlay{position:fixed;inset:0;background:rgba(26,21,18,.72);backdrop-filter:blur(8px);
  z-index:95;display:none;padding:7vh 18px;overflow-y:auto}
.search-overlay.open{display:block}
.search-box{position:relative;max-width:640px;margin:0 auto;background:#fff;border-radius:22px;
  padding:30px 26px 26px;box-shadow:0 30px 70px -30px rgba(0,0,0,.6);
  animation:jk-search-in .28s cubic-bezier(.2,.8,.3,1) both}
@keyframes jk-search-in{from{opacity:0;transform:translateY(-14px) scale(.985)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.search-box{animation:none}}

.search-close{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;
  border:none;background:var(--ivory);color:var(--muted);display:grid;place-items:center;
  cursor:pointer;transition:.2s}
.search-close:hover{background:var(--burgundy);color:#fff}
.search-close svg{width:16px;height:16px}

.search-form{display:flex;gap:10px;align-items:stretch;margin-top:6px}
.search-field{position:relative;flex:1 1 auto;min-width:0;display:flex;align-items:center}
.search-field__ico{position:absolute;left:16px;color:var(--gold-dark);pointer-events:none}
.search-input{width:100%;padding:15px 16px 15px 46px;font-size:16px;color:var(--charcoal);
  background:var(--ivory);border:1.5px solid var(--line);border-radius:14px;
  font-family:var(--sans);transition:border-color .2s,background .2s,box-shadow .2s}
.search-input::placeholder{color:#9a8f80}
.search-input:focus{outline:none;background:#fff;border-color:var(--burgundy);
  box-shadow:0 0 0 4px rgba(91,35,51,.1)}
/* Hide the WebKit clear "x" — it collides with our own close button. */
.search-input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.search-submit{flex:0 0 auto;padding-inline:26px;white-space:nowrap}

.search-pop-label{margin:24px 0 12px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);font-weight:700}
.search-pop{display:flex;flex-wrap:wrap;gap:9px}
.chip--search{padding:9px 16px;font-size:13px;background:var(--ivory);border-color:transparent}

@media (max-width:560px){
  /* Side by side, the field lost so much width the placeholder truncated
     mid-word. Stack instead and let both hit full width. */
  .search-overlay{padding:5vh 14px}
  .search-box{padding:26px 18px 22px;border-radius:18px}
  .search-form{flex-direction:column;gap:12px}
  .search-submit{width:100%}
  .search-input{font-size:16px} /* keep at 16px: anything smaller makes iOS zoom on focus */
}

/* Drawer (cart/menu) */
.drawer-back{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:80;display:none}
.drawer-back.open{display:block}
.drawer{position:fixed;top:0;bottom:0;right:0;width:min(420px,100%);background:#fff;z-index:90;transform:translateX(100%);transition:transform .35s ease;display:flex;flex-direction:column}
.drawer.left{right:auto;left:0;transform:translateX(-100%)}
.drawer.open{transform:translateX(0)}

/* Accordion */
.acc-item{border-bottom:1px solid var(--line)}
.acc-btn{width:100%;text-align:left;padding:20px 0;display:flex;justify-content:space-between;align-items:center;font-weight:600;color:var(--charcoal);background:none;border:none;cursor:pointer;font-size:16px}
.acc-body{max-height:0;overflow:hidden;transition:max-height .35s ease;color:var(--muted)}
.acc-item.open .acc-body{max-height:400px;padding-bottom:20px}
.acc-item.mega-acc.open .acc-body{max-height:1400px}
.acc-btn .plus{color:var(--gold);font-size:22px;transition:transform .3s}
.acc-item.open .plus{transform:rotate(45deg)}

/* Utility */
.container-x{max-width:1280px;margin:0 auto;padding:0 20px}
@media (min-width:1024px){.container-x{padding:0 40px}}

/* Star */
.stars{color:var(--gold);letter-spacing:2px;font-size:13px}

/* Price line-through */
.price-old{color:var(--muted);text-decoration:line-through;font-size:13px}

/* Zoom image */
.zoom-wrap{overflow:hidden;border-radius:20px;background:var(--ivory-warm)}
.zoom-wrap img{transition:transform .5s ease;width:100%;display:block}
.zoom-wrap:hover img{transform:scale(1.15)}

/* Input */
.inp{width:100%;padding:14px 16px;border-radius:12px;border:1px solid var(--line);background:#fff;font-family:var(--sans);font-size:15px;transition:.2s}
.inp:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-light)}

/* Chips */
.chip{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:12px;color:var(--charcoal);cursor:pointer;transition:.2s}
.chip:hover,.chip.active{background:var(--burgundy);color:#fff;border-color:var(--burgundy)}

/* Section spacing */
.section{padding:70px 0}
@media (min-width:1024px){.section{padding:96px 0}}

/* Newsletter */
.news{background:linear-gradient(135deg,var(--burgundy),var(--burgundy-dark));color:#fff;border-radius:28px;padding:60px 30px;position:relative;overflow:hidden}
.news::before{content:'';position:absolute;inset:-40px;background:radial-gradient(circle at 20% 20%,rgba(200,162,77,.25),transparent 40%),radial-gradient(circle at 80% 80%,rgba(217,166,160,.2),transparent 40%);pointer-events:none}

/* Footer */
.site-footer{background:#1a1512;color:#e8ddc9;padding:80px 0 30px;margin-top:60px}
.site-footer a{color:#c9bda7;text-decoration:none;transition:color .2s}
.site-footer a:hover{color:var(--gold)}

/* Breadcrumb */
.crumbs{font-size:13px;color:var(--muted)}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--burgundy)}
.crumbs .sep{margin:0 8px;color:var(--gold)}

/* Table */
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th,.tbl td{padding:14px;text-align:left;border-bottom:1px solid var(--line)}
.tbl th{background:var(--ivory-warm);font-weight:600;color:var(--charcoal);font-size:12px;text-transform:uppercase;letter-spacing:.06em}

/* Focus for accessibility */
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}

/* Reduce motion */
@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}}

/* ==========================================================================
   Utility classes.
   The reference build used Tailwind's CDN for these; the theme ships them
   explicitly so the header, product cards and responsive toggles work
   without loading Tailwind.
   ========================================================================== */

.hidden{display:none}
.block{display:block}
.inline-flex{display:inline-flex}
.flex{display:flex}
.grid{display:grid}
.relative{position:relative}
.text-xs{font-size:12px;line-height:1.5}
.text-sm{font-size:14px;line-height:1.6}
.font-medium{font-weight:500}
.font-semibold{font-weight:600}
.font-bold{font-weight:700}
.text-center{text-align:center}
.w-full{width:100%}

@media (min-width:768px){
	.md\:flex{display:flex}
	.md\:inline-flex{display:inline-flex}
	.md\:grid{display:grid}
	.md\:block{display:block}
	.md\:hidden{display:none}
}

/* ==========================================================================
   Link colours.
   A bare `a{color:inherit}` loses to any stylesheet WordPress or a plugin
   enqueues after the theme, which is what turns navigation links browser-blue.
   These rules are scoped so they win on specificity rather than order.
   ========================================================================== */

.site-header a,
.site-header a:visited,
.site-header nav a,
.site-header .mega a,
.mob-nav a,
.drawer a,
.search-overlay a,
.product-card a,
.jk-post-card a,
.card a,
.crumbs a,
.jk-dash-nav a,
.jk-filters a{color:inherit;text-decoration:none}

.site-header nav > a,
.site-header nav > .has-mega > a{color:var(--charcoal)}
.site-header nav > a:hover,
.site-header nav > .has-mega > a:hover{color:var(--burgundy)}

.mega a{color:var(--charcoal);font-size:14px}
.mega a:hover{color:var(--burgundy)}

.site-footer a,
.site-footer a:visited{color:#c9bda7;text-decoration:none}
.site-footer a:hover{color:var(--gold-light)}

.prose a,
.prose a:visited{color:var(--burgundy);text-decoration:underline;text-underline-offset:3px}

.btn,
.btn:visited,
.btn:hover{text-decoration:none}

/* ==========================================================================
   WordPress bridge — Jhumkhana theme
   Maps legacy theme class names onto the Jhumkhana design system, plus
   grid/layout utilities the original relied on Tailwind for.
   ========================================================================== */

/* --- Layout utilities (replacing the Tailwind classes used inline) ------- */
/* Editor-only notice shown where the products row would be when the
   catalogue is empty. Visitors never see this. */
.jk-empty-products{max-width:520px;margin:0 auto;text-align:center;background:#fff;
  border:1px dashed var(--line);border-radius:20px;padding:38px 30px}
.jk-empty-products__title{font-family:var(--serif);font-size:20px;color:var(--burgundy);margin:0 0 8px}
.jk-empty-products__body{color:var(--muted);font-size:14px;line-height:1.55;margin:0 0 20px}

/* --- New Collection row --------------------------------------------------
   The product row itself is the theme's shared .jk-scroller / .jk-hscroll
   component (see jumkhana_render_hscroll), so it inherits the arrows and the
   scroll-stepping JS. Only the section chrome lives here. */
.jk-newcol{background:var(--ivory)}
.jk-newcol-head{text-align:center;margin-bottom:38px}
.jk-newcol-title{font-family:var(--serif);font-size:clamp(28px,4vw,42px);color:var(--burgundy);margin:6px 0 0}
.jk-newcol-sub{color:var(--muted);font-size:15px;line-height:1.55;margin:10px auto 0;max-width:46ch}
.jk-newcol-head .ornament{margin-top:12px}
.jk-newcol-foot{text-align:center;margin-top:40px}
.jk-rail-hint{text-align:center;font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted);margin:2px 0 0}
@media (min-width:1024px){.jk-rail-hint{display:none}}

/* On a touch screen there is no hover, so the slide-up action bar was
   unreachable — the only Add to Cart on a card lives inside it. Pin it open
   wherever hover does not exist. It stays absolutely positioned: .product-media
   is overflow:hidden with a fixed aspect-ratio, so a static bar would simply
   be clipped. */
@media (hover:none){
  .quick{transform:translateY(0)}
  .product-card:hover{transform:none;box-shadow:none}
  .product-card:hover .product-media img{transform:none}
}

/* --- Auth page messaging -------------------------------------------------- */
.jk-note--error{background:#fdf1f1;border-color:#e6c4c4;color:#8a2b2b}
.jk-note--success{background:#f1f8f2;border-color:#c2ddc7;color:#276b36}
.jk-note--notice{background:#fdf8ec;border-color:#e6d6ae;color:#7a5a17}

/* Honeypot: kept out of sight and out of the tab order, but NOT display:none —
   the better bots skip hidden inputs, and a field they skip catches nobody. */
.jk-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.jk-resend{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;
  margin-top:18px;font-size:13px;color:var(--muted)}
.jk-linkbtn{background:none;border:none;padding:0;cursor:pointer;font:inherit;
  color:var(--burgundy);font-weight:600;text-decoration:underline}
.jk-linkbtn:hover{color:var(--burgundy-dark)}

.jk-grid{display:grid;gap:24px}
.jk-grid-2{grid-template-columns:repeat(2,1fr)}
.jk-grid-3{grid-template-columns:repeat(3,1fr)}
.jk-grid-4{grid-template-columns:repeat(4,1fr)}
.jk-grid-5{grid-template-columns:repeat(5,1fr)}
.jk-grid-6{grid-template-columns:repeat(6,1fr)}
@media (max-width:1024px){.jk-grid-4,.jk-grid-5,.jk-grid-6{grid-template-columns:repeat(3,1fr)}}
@media (max-width:768px){.jk-grid-3,.jk-grid-4,.jk-grid-5,.jk-grid-6{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.jk-grid-2,.jk-grid-3,.jk-grid-4,.jk-grid-5,.jk-grid-6{grid-template-columns:1fr}}

.jk-flex{display:flex}
.jk-between{display:flex;align-items:center;justify-content:space-between;gap:20px}
.jk-center{display:flex;align-items:center;justify-content:center;gap:10px}
.jk-wrap{flex-wrap:wrap}
.jk-stack{display:flex;flex-direction:column;gap:14px}

/* --- Section heading block ---------------------------------------------- */
.sec-head{text-align:center;margin-bottom:48px}
.sec-head .eyebrow{display:block;margin-bottom:12px}
.sec-head h2{font-family:var(--serif);font-size:clamp(30px,4vw,46px);color:var(--burgundy);font-weight:700;line-height:1.15;margin:0 0 14px}
.sec-head p{color:var(--muted);max-width:620px;margin:0 auto;font-size:15px}
.sec-head .ornament{margin-top:18px}
.sec-head--left{text-align:left}
.sec-head--left p{margin-left:0}

/* --- Typography ---------------------------------------------------------- */
h1,h2,h3,h4,h5,h6{font-family:var(--serif);color:var(--burgundy);font-weight:700;line-height:1.2}
.page-title{font-family:var(--serif);font-size:clamp(32px,5vw,52px);color:var(--burgundy);margin:0 0 12px}
.lead{font-size:17px;color:var(--muted);line-height:1.7}
a{color:inherit;text-decoration:none}
.prose{color:var(--charcoal);line-height:1.8}
.prose h2{font-size:28px;margin:36px 0 14px}
.prose h3{font-size:21px;margin:28px 0 10px}
.prose p{margin:0 0 16px}
.prose ul,.prose ol{margin:0 0 18px;padding-left:22px;list-style:disc}
.prose ol{list-style:decimal}
.prose li{margin-bottom:8px}
.prose a{color:var(--burgundy);text-decoration:underline;text-underline-offset:3px}
.prose img{border-radius:16px;margin:20px 0}
.prose blockquote{border-left:3px solid var(--gold);padding-left:20px;margin:24px 0;font-family:var(--serif);font-size:20px;color:var(--burgundy);font-style:italic}

/* --- Page hero band ------------------------------------------------------ */
.page-hero{background:linear-gradient(120deg,var(--cream) 0%,var(--rose) 100%);padding:54px 0 46px;border-bottom:1px solid var(--line)}
.page-hero .crumbs{margin-bottom:14px}

/* --- Legacy class bridge (older template parts) -------------------------- */
.prod{position:relative;background:#fff;border-radius:18px;overflow:hidden;border:1px solid var(--line);transition:transform .35s ease,box-shadow .35s ease}
.prod:hover{transform:translateY(-6px);box-shadow:var(--shadow-lift)}
.prod-img{position:relative;overflow:hidden;aspect-ratio:1/1;background:var(--ivory-warm)}
.prod-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.prod:hover .prod-img img{transform:scale(1.08)}
.prod-body{padding:16px}
.prod-cat{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:6px}
.prod-body h4{font-family:var(--serif);font-size:17px;color:var(--charcoal);margin:0 0 8px;font-weight:600;line-height:1.35}
.prod-body h4 a:hover{color:var(--burgundy)}
.prod-price{font-weight:700;color:var(--burgundy);font-size:16px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.prod-price del{color:var(--muted);font-weight:400;font-size:13px}
.rating{font-size:12px;color:var(--muted);margin-top:8px;display:flex;align-items:center;gap:6px}
.quick-add{display:block;width:100%;text-align:center;background:var(--burgundy);color:#fff;border:none;padding:11px;font-size:12px;font-weight:600;letter-spacing:.05em;cursor:pointer;transition:background .25s}
.quick-add:hover{background:var(--burgundy-dark)}
.quick-add-form{position:absolute;left:0;right:0;bottom:0;transform:translateY(100%);transition:transform .35s ease}
.prod:hover .quick-add-form{transform:translateY(0)}

/* --- Horizontal scroller ------------------------------------------------- */
.jk-scroller{position:relative}
/*
 * Three things this row has to get right, and previously got wrong:
 *
 * 1. It must actually overflow. The tracks used to be minmax(230px,1fr), and
 *    a `1fr` maximum makes every track share the container instead of
 *    exceeding it — so on a wide screen all ten products squeezed in side by
 *    side, each one narrower than intended, and nothing ever scrolled. Fixed
 *    track widths are what create the overflow a scroller needs.
 *
 * 2. It must not clip the cards. `overflow-x:auto` forces the *other* axis to
 *    compute as `auto` too (per spec `visible` is not allowed on one axis
 *    alone), so the -6px hover lift and its drop shadow were being cut off by
 *    the scroll box. The padding below reserves that room; the equal negative
 *    margin keeps the section spacing unchanged.
 *
 * 3. A lifted card must paint above its neighbours. Without a z-index the
 *    hovered card sits under every card that follows it in the DOM, which
 *    reads as the cards overlapping and stacking on each other.
 */
.jk-hscroll{
  display:grid;grid-auto-flow:column;
  grid-auto-columns:262px;
  gap:22px;
  overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;scroll-behavior:smooth;
  /* Room for the hover lift + shadow, cancelled by the negative margin. */
  padding:16px 2px 26px;margin:-16px -2px -14px;
  scrollbar-width:none;
  overscroll-behavior-x:contain;
}
.jk-hscroll::-webkit-scrollbar{display:none}
.jk-hscroll > *{scroll-snap-align:start;position:relative;z-index:1}
.jk-hscroll > *:hover{z-index:4}
.jk-hscroll--wide{grid-auto-columns:300px}
@media (min-width:640px){.jk-hscroll{grid-auto-columns:274px}}
@media (min-width:1024px){
  /* Four across the container, with a sliver of the fifth showing so it is
     obvious the row keeps going. */
  .jk-hscroll{grid-auto-columns:calc((100% - 3 * 22px) / 4.25)}
  .jk-hscroll--wide{grid-auto-columns:calc((100% - 2 * 22px) / 3.25)}
}
.jk-arrow{position:absolute;top:38%;z-index:5;width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-soft);display:grid;place-items:center;cursor:pointer;color:var(--burgundy);transition:.25s}
.jk-arrow:hover{background:var(--burgundy);color:#fff;border-color:var(--burgundy)}
.jk-arrow--prev{left:-18px}
.jk-arrow--next{right:-18px}
.jk-arrow svg{width:20px;height:20px}
.jk-arrow[hidden]{display:none}
/* Below 1024px the arrows used to be hidden outright, leaving touch users with
   no visible control and no hint that the row moved. They now sit just inside
   the track, slightly smaller, riding over the card edge the way a carousel
   control normally does. */
@media (max-width:1024px){
  .jk-arrow{width:38px;height:38px;top:32%;background:rgba(255,255,255,.94);
    backdrop-filter:blur(4px);box-shadow:0 6px 18px -8px rgba(0,0,0,.45)}
  .jk-arrow--prev{left:-6px}
  .jk-arrow--next{right:-6px}
  .jk-arrow svg{width:17px;height:17px}
}
.jk-dots{display:flex;gap:7px;justify-content:center;margin-top:6px}
.jk-dots button{width:7px;height:7px;border-radius:50%;background:var(--line);border:none;padding:0;cursor:pointer;transition:.25s}
.jk-dots button.active{background:var(--gold);width:20px;border-radius:999px}

/* --- Forms --------------------------------------------------------------- */
.jk-form{display:flex;flex-direction:column;gap:18px}
.jk-field label{display:block;font-size:11.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.jk-form textarea.inp{min-height:140px;resize:vertical}
.jk-auth-card{max-width:440px;margin:0 auto;background:#fff;border-radius:22px;border:1px solid var(--line);box-shadow:var(--shadow-soft);padding:40px 36px}
.jk-auth-card h1{font-family:var(--serif);font-size:30px;line-height:1.15;text-align:center;color:var(--burgundy);margin:0 0 6px}
.jk-auth-sub{text-align:center;color:var(--muted);font-size:14px;line-height:1.5;margin:0 0 26px}
.jk-auth-alt{text-align:center;font-size:14px;color:var(--muted);margin-top:24px}
.jk-auth-alt a{color:var(--burgundy);font-weight:600}
@media (max-width:520px){.jk-auth-card{padding:28px 22px;border-radius:18px}.jk-auth-card h1{font-size:26px}}
.jk-note{background:var(--cream);border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:12px;padding:14px 16px;font-size:14px;color:var(--muted)}
.jk-error{background:#fdf0ee;border-left-color:var(--rose-deep);color:#8a3a3a}

/* --- Dashboard ----------------------------------------------------------- */
.jk-dash{display:grid;grid-template-columns:240px 1fr;gap:34px;align-items:start}
@media (max-width:900px){.jk-dash{grid-template-columns:1fr}}
.jk-dash-nav{background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px;box-shadow:var(--shadow-soft);position:sticky;top:96px}
.jk-dash-nav a{display:block;padding:11px 14px;border-radius:10px;font-size:14px;font-weight:500;color:var(--charcoal);transition:.2s}
.jk-dash-nav a:hover{background:var(--cream);color:var(--burgundy)}
.jk-dash-nav a.active{background:var(--burgundy);color:#fff}
.jk-panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:28px;box-shadow:var(--shadow-soft)}
.jk-panel + .jk-panel{margin-top:22px}
.jk-panel h2{font-size:22px;margin:0 0 18px}
.jk-stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:22px}
@media (max-width:768px){.jk-stat-row{grid-template-columns:repeat(2,1fr)}}
.jk-stat{background:var(--cream);border-radius:16px;padding:20px;text-align:center}
.jk-stat b{display:block;font-family:var(--serif);font-size:30px;color:var(--burgundy);line-height:1}
.jk-stat span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:7px;display:block}

/* --- Filter rail --------------------------------------------------------- */
.jk-shop{display:grid;grid-template-columns:250px 1fr;gap:34px;align-items:start}
@media (max-width:900px){.jk-shop{grid-template-columns:1fr}}
.jk-filters{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:var(--shadow-soft);position:sticky;top:96px}
.jk-filters h3{font-size:15px;letter-spacing:.1em;text-transform:uppercase;color:var(--charcoal);margin:0 0 16px;font-family:var(--sans);font-weight:700}
.jk-filter-group{border-top:1px solid var(--line);padding:16px 0}
.jk-filter-group:first-of-type{border-top:none;padding-top:0}
.jk-filter-group > strong{display:block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:11px}
.jk-filter-group label{display:flex;align-items:center;gap:9px;font-size:14px;padding:5px 0;cursor:pointer;color:var(--charcoal)}
.jk-filter-group input[type=checkbox],.jk-filter-group input[type=radio]{accent-color:var(--burgundy);width:15px;height:15px}
.jk-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.jk-toolbar .count{font-size:14px;color:var(--muted)}
.jk-select{padding:10px 14px;border-radius:999px;border:1px solid var(--line);background:#fff;font-family:var(--sans);font-size:13px;color:var(--charcoal);cursor:pointer}

/* --- Pagination ---------------------------------------------------------- */
.jk-pagination{display:flex;justify-content:center;gap:8px;margin-top:44px;flex-wrap:wrap}
.jk-pagination .page-numbers{display:grid;place-items:center;min-width:42px;height:42px;padding:0 12px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:14px;font-weight:600;color:var(--charcoal);transition:.2s}
.jk-pagination .page-numbers:hover{border-color:var(--gold);color:var(--burgundy)}
.jk-pagination .page-numbers.current{background:var(--burgundy);color:#fff;border-color:var(--burgundy)}

/* --- Blog ---------------------------------------------------------------- */
.jk-post-card{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:var(--shadow-soft);transition:transform .35s ease,box-shadow .35s ease;display:flex;flex-direction:column}
.jk-post-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lift)}
.jk-post-card .thumb{aspect-ratio:16/10;overflow:hidden;background:var(--ivory-warm)}
.jk-post-card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.jk-post-card:hover .thumb img{transform:scale(1.07)}
.jk-post-card .body{padding:22px;flex:1;display:flex;flex-direction:column}
.jk-post-card .meta{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:9px}
.jk-post-card h3{font-size:19px;margin:0 0 10px;line-height:1.35;color:var(--charcoal)}
.jk-post-card:hover h3{color:var(--burgundy)}
.jk-post-card p{font-size:14px;color:var(--muted);margin:0 0 16px;flex:1}

/* --- Cart / checkout ----------------------------------------------------- */
.jk-cart-grid{display:grid;grid-template-columns:1fr 360px;gap:34px;align-items:start}
@media (max-width:900px){.jk-cart-grid{grid-template-columns:1fr}}
.jk-summary{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px;box-shadow:var(--shadow-soft);position:sticky;top:96px}
.jk-summary h2{font-size:20px;margin:0 0 18px}
.jk-sum-row{display:flex;justify-content:space-between;font-size:14px;padding:9px 0;color:var(--muted)}
.jk-sum-row.total{border-top:1px solid var(--line);margin-top:9px;padding-top:15px;font-size:18px;font-weight:700;color:var(--burgundy);font-family:var(--serif)}
.jk-line{display:grid;grid-template-columns:88px 1fr auto;gap:16px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
.jk-line img{width:88px;height:88px;object-fit:cover;border-radius:12px;background:var(--ivory-warm)}
.jk-line h4{font-size:15px;margin:0 0 5px;color:var(--charcoal)}
.jk-qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.jk-qty button{width:32px;height:32px;background:#fff;border:none;cursor:pointer;color:var(--burgundy);font-size:16px}
.jk-qty button:hover{background:var(--cream)}
.jk-qty input{width:40px;text-align:center;border:none;font-family:var(--sans);font-size:14px;background:#fff}
.jk-qty input[type=number]{-moz-appearance:textfield;appearance:textfield}
.jk-qty input[type=number]::-webkit-outer-spin-button,
.jk-qty input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* --- Empty state --------------------------------------------------------- */
.jk-empty{text-align:center;padding:70px 20px}
.jk-empty svg{width:64px;height:64px;color:var(--gold);margin:0 auto 20px;display:block;opacity:.7}
.jk-empty h2{font-size:26px;margin:0 0 10px}
.jk-empty p{color:var(--muted);margin:0 0 24px}

/* --- Footer detail ------------------------------------------------------- */
.site-footer h4{font-family:var(--sans);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin:0 0 18px;font-weight:700}
.site-footer ul{display:flex;flex-direction:column;gap:11px;font-size:14px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);margin-top:46px;padding-top:24px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px;color:#8a7f6c}

/* --- Accessibility ------------------------------------------------------- */
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--burgundy);color:#fff;padding:12px 20px;z-index:200;border-radius:0 0 8px 0}
.skip-link:focus{left:0}

/* --- WP admin bar -------------------------------------------------------- */
.admin-bar .site-header{top:32px}
@media (max-width:782px){.admin-bar .site-header{top:46px}}

/* ==========================================================================
   Store skin — restyles the Jhumkhana Core cart / checkout / account
   shortcodes into the Jhumkhana design system.
   ========================================================================== */

.jk-cart,.jk-checkout,.jk-account,.jk-received{font-family:var(--sans);color:var(--charcoal)}

/* Cart table */
.jk-cart-table{width:100%;border-collapse:collapse;font-size:14px}
.jk-cart-table th{background:var(--ivory-warm);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:700;padding:14px;text-align:left}
.jk-cart-table td{padding:18px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
.jk-cart-prod{display:flex;align-items:center;gap:14px}
.jk-cart-prod img{width:78px;height:78px;object-fit:cover;border-radius:12px;background:var(--ivory-warm);flex:none}
.jk-cart-prod a{font-family:var(--serif);font-size:16px;color:var(--charcoal);font-weight:600;line-height:1.3}
.jk-cart-prod a:hover{color:var(--burgundy)}
.jk-cart-var{font-size:12px;color:var(--muted);margin-top:4px}
.jk-remove{background:none;border:none;color:var(--muted);cursor:pointer;font-size:18px;line-height:1;padding:6px;border-radius:8px;transition:.2s}
.jk-remove:hover{color:var(--rose-deep);background:var(--rose)}
.jk-cart-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:26px}
.jk-cart-total{font-family:var(--serif);font-size:24px;font-weight:700;color:var(--burgundy)}
.jk-cart-empty{text-align:center;padding:70px 20px;color:var(--muted)}
.jk-cart-empty h2{font-family:var(--serif);font-size:26px;color:var(--burgundy);margin:0 0 10px}
/* Cart quantity stepper — compact, never full-width */
.jk-cart-qty{border-radius:10px}
.jk-cart-qty button{width:30px;height:34px}
.jk-cart-qty input{width:38px;height:34px}
.jk-cart-remove-cell{width:1%;text-align:right;white-space:nowrap}
/* --- Cart on mobile: stack each row into a tidy card --- */
@media (max-width:640px){
	.jk-cart-table thead{display:none}
	.jk-cart-table,.jk-cart-table tbody,.jk-cart-table tr,.jk-cart-table td{display:block;width:100%}
	.jk-cart-table tr{position:relative;border:1px solid var(--line);border-radius:16px;padding:16px;margin-bottom:14px;background:#fff;box-shadow:0 1px 2px rgba(45,31,27,.04)}
	.jk-cart-table td{border:none;padding:8px 0;display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:14px}
	.jk-cart-table td[data-label]::before{content:attr(data-label);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}
	.jk-cart-prod{justify-content:flex-start;padding:0 40px 12px 0;margin-bottom:6px;border-bottom:1px solid var(--line)}
	.jk-cart-prod img{width:60px;height:60px}
	.jk-cart-prod a{font-size:15px}
	.jk-cart-qty{margin-left:auto}
	.jk-cart-remove-cell{position:absolute;top:12px;right:12px;width:auto;padding:0}
	.jk-cart-foot{gap:14px}
	.jk-cart-foot .btn-ghost{order:3}
	.jk-cart-total{order:1;width:100%;text-align:center}
	.jk-checkout-btn{order:2}
}

/* Checkout layout */
.jk-checkout-grid{display:grid;grid-template-columns:1fr 380px;gap:34px;align-items:start}
@media (max-width:900px){.jk-checkout-grid{grid-template-columns:1fr}}
.jk-checkout-main{background:#fff;border:1px solid var(--line);border-radius:20px;padding:30px;box-shadow:var(--shadow-soft)}
.jk-checkout-side{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px;box-shadow:var(--shadow-soft);position:sticky;top:96px}
/* On phones the 30px card padding costs ~20% of the usable field width, and a
   sticky summary has nothing to stick beside once the grid is one column. */
@media (max-width:640px){
	.jk-checkout-main{padding:20px}
	.jk-checkout-side{padding:20px;position:static;top:auto}
	.jk-checkout-grid{gap:22px}
	.jk-checkout h2{font-size:20px}
	.jk-checkout-main h2:not(:first-child){margin-top:28px}
}
.jk-checkout h2,.jk-checkout h3{font-family:var(--serif);color:var(--burgundy)}
.jk-checkout h2{font-size:22px;margin:0 0 20px}
/* "Contact" and "Payment" follow a field, so without a top margin they sat
   only one row-gap below it and read as part of the previous group. */
.jk-checkout-main h2+*{margin-top:0}
.jk-checkout-main h2:not(:first-child){margin-top:34px}
.jk-checkout h3{font-size:17px;margin:26px 0 14px}

/* Checkout form rows */
/* Form controls are the one place this theme needs border-box: they are all
   `width:100%` inside grid columns, and under the default content-box the
   32px of padding plus 2px of border made every field 34px WIDER than its
   column — which is why the left field of each two-column row ran underneath
   the right one. Scoped to controls rather than a global `*` reset, so the
   rest of the theme's content-box layouts are untouched. */
input,select,textarea,.inp{box-sizing:border-box}

.jk-frow{margin-bottom:18px}
.jk-frow.jk-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
/* Collapse to one column while the form is still comfortably wide, and match
   the vertical rhythm exactly so stacked rows keep the same 18px gap. */
@media (max-width:640px){.jk-frow.jk-2{grid-template-columns:1fr;gap:0}.jk-frow.jk-2 > label{margin-bottom:18px}.jk-frow.jk-2 > label:last-child{margin-bottom:0}}
.jk-frow label{display:block;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:0}
/* The input sits INSIDE its label, so the gap between the caption and the
   field has to come from the input — a margin on the label only pushed the
   next row away. */
.jk-frow input,.jk-frow select,.jk-frow textarea{display:block;margin-top:7px;width:100%;padding:14px 16px;border-radius:12px;border:1px solid var(--line);background:#fff;font-family:var(--sans);font-size:15px;color:var(--charcoal);text-transform:none;letter-spacing:normal;transition:.2s}
/* Anything under 16px makes iOS Safari zoom the whole page in on focus and
   leave it zoomed — so on small screens the fields step up to 16px. */
@media (max-width:640px){.jk-frow input,.jk-frow select,.jk-frow textarea,.inp{font-size:16px}}
.jk-frow input::placeholder,.jk-frow textarea::placeholder{color:#B9ACA4;font-weight:400;letter-spacing:normal}
.jk-frow input:focus,.jk-frow select:focus,.jk-frow textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-light)}
.jk-frow select:disabled{background:var(--cream);color:var(--muted);cursor:not-allowed}
.jk-frow textarea{min-height:110px;resize:vertical}
/* Required / optional markers: gold asterisk, quiet lowercase "optional". */
.jk-req{color:var(--gold-dark,#a1802f);font-weight:700}
.jk-opt{text-transform:lowercase;letter-spacing:.02em;font-weight:400;opacity:.7}
/* Only flag a field red once it has been touched and left invalid, so the
   form does not look angry the moment it loads. */
.jk-frow input:not(:placeholder-shown):invalid{border-color:var(--rose-deep,#c98b8b)}

/* Payment methods */
.jk-pay-methods{display:flex;flex-direction:column;gap:12px}
.jk-pay-opt{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:14px;padding:16px 18px;cursor:pointer;transition:.2s;background:#fff}
.jk-pay-opt:hover{border-color:var(--gold)}
.jk-pay-opt input{accent-color:var(--burgundy);width:17px;height:17px}
.jk-pay-opt.selected,.jk-pay-opt:has(input:checked){border-color:var(--burgundy);background:var(--cream)}

/* Order summary */
.jk-sum-items{display:flex;flex-direction:column;gap:14px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.jk-sum-row{display:flex;justify-content:space-between;gap:12px;font-size:14px;color:var(--muted);padding:8px 0}
.jk-sum-total{border-top:1px solid var(--line);margin-top:8px;padding-top:15px;font-family:var(--serif);font-size:19px;font-weight:700;color:var(--burgundy)}

/* Buttons from the shortcodes */
.jk-cart .btn,.jk-checkout .btn,.jk-account .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 26px;border-radius:999px;font-weight:600;font-size:14px;letter-spacing:.05em;cursor:pointer;border:none;transition:transform .25s ease,box-shadow .25s ease,background .25s;background:var(--burgundy);color:#fff}
.jk-cart .btn:hover,.jk-checkout .btn:hover,.jk-account .btn:hover{background:var(--burgundy-dark);transform:translateY(-2px);box-shadow:0 15px 40px -15px rgba(91,35,51,.6)}
.jk-checkout-btn,.jk-place-order{width:100%}
.jk-place-order{background:linear-gradient(135deg,#d9b878,#C8A24D)!important;color:#1F1A18!important}
.jk-place-order:hover{box-shadow:0 15px 40px -15px rgba(200,162,77,.7)!important}

/* Notices */
.jk-callout,.jk-note,.jk-secure,.jk-service{background:var(--cream);border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:12px;padding:14px 16px;font-size:13px;color:var(--muted);margin:16px 0}
.jk-checkout-err{background:#fdf0ee;border:1px solid var(--rose-deep);border-left-width:3px;border-radius:12px;padding:14px 16px;font-size:14px;color:#8a3a3a;margin-bottom:20px}
.jk-pin-status{font-size:13px;margin-top:8px;color:var(--muted)}

/* Shop by Material tiles */
.jk-mat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}
.jk-mat-tile{position:relative;display:block;overflow:hidden;border-radius:16px;border:1px solid var(--line);background:linear-gradient(150deg,var(--cream),var(--ivory-warm));box-shadow:var(--shadow-soft);text-decoration:none;transition:transform .28s ease,border-color .28s ease}
/* 4:5 portrait, matching the recommended upload ratio. */
.jk-mat-tile.has-img{aspect-ratio:4/5}
.jk-mat-tile:not(.has-img){min-height:96px;display:flex;align-items:center}
.jk-mat-tile:hover{transform:translateY(-3px);border-color:var(--gold)}
.jk-mat-tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.jk-mat-tile:hover img{transform:scale(1.06)}
.jk-mat-label{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:14px 16px;font-size:14px;font-weight:600;color:var(--charcoal)}
.jk-mat-label span{color:var(--gold)}
/* Over a photo the label needs its own backdrop to stay readable. */
.jk-mat-tile.has-img .jk-mat-label{position:absolute;left:0;right:0;bottom:0;color:#fff;background:linear-gradient(to top,rgba(30,20,16,.82),rgba(30,20,16,0))}
.jk-mat-tile.has-img .jk-mat-label span{color:var(--gold-light)}

/* Map / location picker */
.jk-loc-fields{margin-bottom:18px}
.jk-map-holder,.jk-loc-map{border-radius:16px;overflow:hidden;border:1px solid var(--line);background:var(--ivory-warm);min-height:240px}
.jk-map-holder{position:relative}
.jk-map-title{font-family:var(--serif);font-size:17px;color:var(--burgundy);margin:0 0 4px}
.jk-map-sub{font-size:13px;color:var(--muted);margin:0 0 12px}
.jk-map-loading{display:grid;place-items:center;min-height:240px;color:var(--muted);font-size:14px}

/* The SVG had no fill rules at all, so every path fell back to the browser
   default of solid black — the whole country rendered as one dark blob with
   the highlighted area invisible inside it. */
#jkMap{display:block;width:100%;height:auto;aspect-ratio:1/1;background:linear-gradient(160deg,#FBF7F0,#F3ECDF)}
/* non-scaling-stroke keeps borders hairline-thin at 16x zoom instead of
   ballooning into thick bands. */
.jk-state,.jk-district{vector-effect:non-scaling-stroke;transition:fill .55s ease,opacity .55s ease}
.jk-state{fill:#E7DAC3;stroke:#FBF7F0;stroke-width:.7}
.jk-state.dim{fill:#EDE4D5}
.jk-state.active{fill:#D8C39B}
.jk-district{fill:#E4D5BA;stroke:#FBF7F0;stroke-width:.6}
.jk-district.active{fill:var(--gold);stroke:var(--burgundy);stroke-width:1.1}

/* Cross-fade: states recede to a faint backdrop as districts arrive, so the
   detail swap never flashes an empty frame mid-zoom. */
.jk-states-layer{transition:opacity .6s ease}
.jk-states-layer.behind{opacity:.28}
.jk-districts-layer{opacity:0;transition:opacity .6s ease}
.jk-districts-layer.show{opacity:1}

.jk-pin{opacity:0;transition:opacity .45s ease .25s;pointer-events:none}
.jk-pin.show{opacity:1}
.jk-pin .halo{fill:var(--burgundy)}
.jk-pin .ring{fill:#fff;stroke:var(--burgundy);stroke-width:2}
.jk-pin .dot{fill:var(--burgundy)}

.jk-map-callout{position:absolute;left:0;top:0;transform:translate(-50%,-190%);background:var(--burgundy);color:#fff;font-size:12px;font-weight:600;letter-spacing:.02em;padding:6px 11px;border-radius:999px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .4s ease;box-shadow:0 8px 22px -8px rgba(45,31,27,.75);z-index:2}
.jk-map-callout.show{opacity:1}

@media (prefers-reduced-motion:reduce){
	.jk-state,.jk-district,.jk-states-layer,.jk-districts-layer,.jk-pin{transition-duration:.01ms}
}

/* Order received */
.jk-received{text-align:center;padding:50px 20px}
.jk-received-badge{display:inline-grid;place-items:center;width:74px;height:74px;border-radius:50%;background:linear-gradient(135deg,#d9b878,#C8A24D);color:#1F1A18;font-size:34px;margin-bottom:20px}
.jk-received h1,.jk-received h2{font-family:var(--serif);color:var(--burgundy)}
.jk-received-meta{display:inline-flex;gap:28px;flex-wrap:wrap;justify-content:center;background:var(--cream);border-radius:16px;padding:20px 28px;margin-top:24px;font-size:14px}

/* Account shortcode */
.jk-account{display:grid;gap:22px}

/* ==========================================================================
   Shop filter chips — the reference build uses pill toggles rather than
   checkboxes, with the rail scrolling internally on tall lists.
   ========================================================================== */

.jk-filters--chips{padding:20px}
.jk-filters--chips h3{font-size:17px;font-family:var(--serif);letter-spacing:0;text-transform:none;color:var(--burgundy);font-weight:700}
.jk-filters-scroll{max-height:min(64vh,620px);overflow-y:auto;overscroll-behavior:contain;padding-right:6px;margin-top:6px}
.jk-filters-scroll::-webkit-scrollbar{width:5px}
.jk-filters-scroll::-webkit-scrollbar-thumb{background:var(--line);border-radius:99px}
.jk-filters-scroll::-webkit-scrollbar-track{background:transparent}

.jk-chip-row{display:flex;flex-wrap:wrap;gap:7px}
.jk-fchip{display:inline-block;padding:6px 13px;border-radius:999px;border:1px solid var(--line);
	background:#fff;font-size:12.5px;font-weight:500;color:var(--charcoal);line-height:1.4;
	transition:background .2s,border-color .2s,color .2s;white-space:nowrap}
.jk-fchip:hover{border-color:var(--gold);color:var(--burgundy)}
.jk-fchip.on{background:var(--burgundy);border-color:var(--burgundy);color:#fff}
.jk-fchip.on:hover{background:var(--burgundy-dark);color:#fff}
.jk-fchip-count{color:var(--muted);font-size:11px}
.jk-fchip.on .jk-fchip-count{color:rgba(255,255,255,.75)}
.jk-fchip.is-empty{opacity:.5}

.jk-filters--chips .jk-filter-group > strong{margin-bottom:9px}

/* Mobile-only controls — hidden on desktop where the sidebar is always visible. */
.jk-sheet-handle,.jk-filter-close,.jk-filter-trigger,.jk-filter-backdrop{display:none}

@media (max-width:900px){
	.jk-filter-backdrop{display:block;position:fixed;inset:0;background:rgba(31,26,24,.5);
		z-index:190;opacity:0;pointer-events:none;transition:opacity .3s ease}
	.jk-filter-backdrop.is-open{opacity:1;pointer-events:auto}

	.jk-filters--chips{position:fixed;left:0;right:0;bottom:0;top:auto;max-height:85vh;
		border-radius:20px 20px 0 0;transform:translateY(110%);transition:transform .32s ease;
		z-index:191;box-shadow:0 -20px 60px rgba(31,26,24,.35);display:flex;flex-direction:column}
	.jk-filters--chips.is-open{transform:translateY(0)}
	.jk-filters--chips .jk-between{flex:none;padding-top:2px}
	.jk-filters-scroll{max-height:none;overflow-y:auto;flex:1 1 auto}

	.jk-sheet-handle{display:block;width:38px;height:4px;border-radius:99px;
		background:var(--line);margin:0 auto 12px}

	.jk-filter-close{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;
		border:none;background:var(--cream);color:var(--charcoal);font-size:18px;line-height:1;cursor:pointer}

	.jk-filter-trigger{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;
		border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--charcoal);
		font-size:13px;font-weight:600;cursor:pointer}
	.jk-filter-trigger:hover{border-color:var(--gold);color:var(--burgundy)}
	.jk-filter-badge{display:inline-grid;place-items:center;min-width:18px;height:18px;
		padding:0 5px;border-radius:999px;background:var(--burgundy);color:#fff;font-size:10.5px;font-weight:700}

	.jk-toolbar{justify-content:flex-start}
	.jk-toolbar .count{order:3;width:100%;font-size:13px}
}

/* --- Footer extras --------------------------------------------------------- */
.jk-wa-btn{display:inline-flex;align-items:center;gap:8px;background:#25D366;color:#fff !important;
	padding:11px 20px;border-radius:999px;font-size:13px;font-weight:600;text-decoration:none;transition:.25s}
.jk-wa-btn:hover{background:#1eb257;color:#fff !important;transform:translateY(-2px)}

.jk-pay{display:inline-block;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);
	border-radius:6px;padding:4px 10px;font-size:11px;font-weight:600;color:#c9bda7;letter-spacing:.03em}

/* --- Footer layout --------------------------------------------------------
   The old grid was repeat(auto-fit,minmax(200px,1fr)) set inline, which gave
   the brand column — logo, description and socials — exactly as much room as
   a four-link list, and squeezed the Reach Us email field to nothing. The
   brand block now gets its own wider track, and the four link columns share
   the rest evenly. */
.site-footer .jk-foot-grid{display:grid;gap:44px 36px;
  grid-template-columns:minmax(0,1.6fr) repeat(4,minmax(0,1fr))}
@media (max-width:1100px){
  .site-footer .jk-foot-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .site-footer .jk-foot-brand{grid-column:1 / -1}
}
@media (max-width:640px){
  .site-footer .jk-foot-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px}
}
@media (max-width:400px){
  .site-footer .jk-foot-grid{grid-template-columns:minmax(0,1fr)}
}

.jk-foot-logo{display:inline-flex;align-items:center;gap:11px;text-decoration:none}
/* A wordmark is usually wide and short, so cap the height and let width follow.
   The logo is inked for a light header; on the near-black footer it would be
   almost invisible, so it is knocked out to white. If your logo is already
   light, delete this filter line. */
.jk-foot-logo img{max-height:52px;width:auto;max-width:210px;object-fit:contain;
  filter:brightness(0) invert(1);opacity:.92}
.jk-foot-mark{width:44px;height:44px;border-radius:50%;flex:none;
  background:linear-gradient(135deg,#d9b878,#a1802f);display:grid;place-items:center;
  color:#1a1512;font-family:var(--serif);font-size:22px;font-weight:700}
.jk-foot-name{font-family:var(--serif);font-size:26px;color:#f4e7c9;font-weight:700;line-height:1.1}
.jk-foot-about{margin:16px 0 0;font-size:14px;line-height:1.65;color:#c9bda7;max-width:34ch}
.jk-foot-social{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}

.site-footer .jk-foot-col ul{display:flex;flex-direction:column;gap:11px;font-size:14px;list-style:none;margin:0;padding:0}
.site-footer .jk-foot-contact{margin-bottom:18px}
/* Long addresses were the thing forcing this column wide enough to crush the
   others, so let them break instead of pushing. */
.site-footer .jk-foot-contact a{word-break:break-word}
.jk-foot-form{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.jk-foot-input{flex:1 1 150px;min-width:0;background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.14);color:#f4e7c9}
.jk-foot-input::placeholder{color:#8a7f6c}
.jk-foot-form .btn{flex:0 0 auto}

.site-footer .container-x + .container-x{display:block}
@media (max-width:640px){.site-footer{padding-top:56px}}

/* Chip representing the collection you are already browsing. */
.jk-fchip.is-locked{cursor:default;padding-right:10px}
.jk-fchip.is-locked::after{content:"✦";margin-left:7px;opacity:.65;font-size:10px}

/* --- Price slider ---------------------------------------------------------
   Single-thumb range: the floor is always the catalog's lowest price, the
   thumb sets the ceiling. Track fill is painted in JS to match the value. */
.jk-price-current{font-size:12.5px;font-weight:600;color:var(--burgundy);margin-bottom:10px}
.jk-price-slider{-webkit-appearance:none;appearance:none;width:100%;height:6px;
	border-radius:999px;background:var(--line);outline:none;cursor:pointer;margin:2px 0}
.jk-price-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;
	width:18px;height:18px;border-radius:50%;background:var(--burgundy);
	border:3px solid #fff;box-shadow:0 2px 8px rgba(45,31,27,.35);cursor:pointer}
.jk-price-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;
	background:var(--burgundy);border:3px solid #fff;box-shadow:0 2px 8px rgba(45,31,27,.35);
	cursor:pointer}
.jk-price-slider::-moz-range-track{height:6px;border-radius:999px;background:var(--line)}
.jk-price-scale{display:flex;justify-content:space-between;font-size:11.5px;
	color:var(--muted);margin-top:8px}

/* ============================================================================
   PRODUCT DETAIL PAGE (PDP) — ecommerce-grade layout
   Interactive gallery, ratings, price, offers, delivery, reviews, mobile bar.
   ========================================================================== */
.pdp-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
@media (min-width:1100px){.pdp-top{grid-template-columns:minmax(0,54fr) minmax(0,46fr);gap:56px}}

/* ---- Gallery ---- */
.pdp-gallery{display:flex;gap:14px;align-items:flex-start}
@media (min-width:900px){.pdp-gallery{position:sticky;top:92px}}
.pdp-thumbs{display:flex;flex-direction:column;gap:10px;flex:none;width:76px;max-height:520px;overflow:auto;scrollbar-width:thin}
.pdp-thumb{padding:0;border:1.5px solid var(--line);border-radius:12px;overflow:hidden;background:var(--ivory-warm);cursor:pointer;aspect-ratio:1/1;transition:border-color .2s ease,transform .2s ease}
.pdp-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.pdp-thumb:hover{border-color:var(--gold-light);transform:translateY(-1px)}
.pdp-thumb.is-active{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}
.pdp-stage{position:relative;flex:1;aspect-ratio:1/1;border-radius:22px;overflow:hidden;background:var(--ivory-warm);border:1px solid var(--line);box-shadow:var(--shadow-soft);touch-action:pan-y}
.pdp-zoom{position:absolute;inset:0;overflow:hidden}
.pdp-zoom img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.pdp-stage.is-zooming{cursor:zoom-in}
.pdp-stage.is-zooming .pdp-zoom img{transition:transform .05s linear;transform:scale(2.1)}
.pdp-stage-badge{position:absolute;top:14px;left:14px;z-index:3;background:linear-gradient(135deg,#d9b878,#C8A24D);color:#1F1A18;font-size:12px;font-weight:700;padding:6px 12px;border-radius:999px;letter-spacing:.03em;box-shadow:0 8px 18px -8px rgba(200,162,77,.7)}
.pdp-stage-wish{position:absolute;top:12px;right:12px;z-index:3;width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.92);border:none;display:grid;place-items:center;color:var(--burgundy);cursor:pointer;transition:.2s;box-shadow:0 8px 18px -10px rgba(45,31,27,.5)}
.pdp-stage-wish svg{width:20px;height:20px}
.pdp-stage-wish:hover{background:#fff;transform:scale(1.08)}
.pdp-stage-wish.active{background:var(--burgundy);color:#fff}
.pdp-stage-wish.active svg{fill:#fff}
.pdp-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:40px;height:40px;border-radius:50%;border:none;background:rgba(255,255,255,.92);color:var(--burgundy);font-size:26px;line-height:1;cursor:pointer;display:grid;place-items:center;box-shadow:0 8px 20px -10px rgba(45,31,27,.5);opacity:0;transition:opacity .2s ease}
.pdp-stage:hover .pdp-nav{opacity:1}
.pdp-nav-prev{left:12px}.pdp-nav-next{right:12px}
.pdp-dots{position:absolute;bottom:12px;left:0;right:0;z-index:3;display:none;justify-content:center;gap:7px}
.pdp-dot{width:7px;height:7px;border-radius:50%;background:rgba(31,26,24,.28);transition:.2s}
.pdp-dot.is-active{background:var(--burgundy);width:20px;border-radius:999px}
.pdp-stage-empty{display:grid;place-items:center;color:var(--muted);gap:10px}
.pdp-stage-empty svg{width:56px;height:56px}

/* ---- Summary column ---- */
.pdp-summary{min-width:0}
.pdp-title{font-family:var(--serif);font-size:clamp(27px,3.6vw,40px);color:var(--burgundy);margin:8px 0 12px;line-height:1.14}
.pdp-rating-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:13.5px;color:var(--muted)}
.pdp-rating-pill{display:inline-flex;align-items:center;gap:4px;background:#2f7a4d;color:#fff;font-weight:700;font-size:13px;padding:3px 9px;border-radius:6px}
.pdp-rating-count{color:var(--burgundy);font-weight:600;text-decoration:none}
.pdp-rating-count:hover{text-decoration:underline}
.pdp-rating-new{color:var(--gold-dark)}
.pdp-stars{position:relative;display:inline-block;font-size:15px;letter-spacing:2px;line-height:1;white-space:nowrap}
.pdp-stars-base{color:#dcd3c4}
.pdp-stars-fill{position:absolute;left:0;top:0;color:var(--gold);overflow:hidden}
.pdp-stock{font-weight:600}
.pdp-stock.is-in{color:#2f7a4d}
.pdp-stock.is-out{color:var(--rose-deep)}

.pdp-price{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-top:16px}
.pdp-price-now{font-family:var(--serif);font-weight:700;font-size:36px;color:var(--burgundy);line-height:1}
.pdp-price-mrp{color:var(--muted);text-decoration:line-through;font-size:17px}
.pdp-price-off{color:#2f7a4d;font-weight:700;font-size:15px}
.pdp-save{margin-top:6px;font-size:13.5px;color:#2f7a4d}
.pdp-save b{font-weight:700}
.pdp-tax{font-size:12.5px;color:var(--muted);margin-top:6px}

.pdp-trust{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:20px}
.pdp-trust-item{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:12px 6px;background:#fff;border:1px solid var(--line);border-radius:14px;font-size:11px;font-weight:600;color:var(--charcoal)}
.pdp-trust-item svg{width:22px;height:22px;color:var(--gold-dark)}

.pdp-buy{margin-top:22px}
.pdp-buy-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pdp-qty{height:52px}
.pdp-qty button{width:44px;height:100%;font-size:20px}
.pdp-qty input{width:46px;font-size:15px}
.pdp-cta{flex:1;min-width:150px;height:52px;font-size:15px}
.pdp-cta svg{flex:none}
.pdp-soldout{margin-top:22px}
.pdp-mini-actions{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.pdp-mini-actions .btn{padding:11px 18px;font-size:13px}
.pdp-mini-actions [data-wish].active{background:var(--burgundy);color:#fff;border-color:var(--burgundy)}

/* ---- Delivery / pincode ---- */
.pdp-delivery{margin-top:24px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px 20px}
.pdp-delivery-head{display:flex;align-items:center;gap:9px;font-weight:600;font-size:14px;color:var(--charcoal)}
.pdp-delivery-head svg{color:var(--gold-dark)}
.pdp-pin{display:flex;gap:8px;margin-top:14px}
.pdp-pin input{flex:1;min-width:0;height:44px;border:1px solid var(--line);border-radius:10px;padding:0 14px;font-family:var(--sans);font-size:14px;background:var(--ivory)}
.pdp-pin input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(200,162,77,.18)}
.pdp-pin-btn{height:44px;padding:0 20px;border:none;border-radius:10px;background:var(--burgundy);color:#fff;font-weight:600;font-size:14px;cursor:pointer;transition:background .2s}
.pdp-pin-btn:hover{background:var(--burgundy-dark)}
.pdp-pin-result{margin-top:12px;font-size:13px;color:var(--muted);line-height:1.5}
.pdp-pin-result.is-ok{color:#2f7a4d}
.pdp-pin-result.is-err{color:var(--rose-deep)}
.pdp-pin-result b{color:var(--charcoal);font-weight:700}

/* ---- Offers ---- */
.pdp-offers{margin-top:20px;background:var(--cream);border:1px dashed var(--gold-light);border-radius:16px;padding:18px 20px}
.pdp-offers-head{display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-dark);font-weight:700;margin-bottom:12px}
.pdp-offers ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.pdp-offers li{font-size:13.5px;color:var(--charcoal);line-height:1.5;padding-left:2px}
.pdp-offers li b{display:inline-block;min-width:64px;color:var(--burgundy);font-weight:700}
.pdp-code{display:inline-block;background:#fff;border:1px dashed var(--gold);border-radius:6px;padding:1px 8px;font-weight:700;font-size:12.5px;color:var(--burgundy);letter-spacing:.04em}

/* ---- Detail panels ---- */
.pdp-details{margin-top:48px;display:flex;flex-direction:column;gap:20px}
.pdp-panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px 28px;box-shadow:var(--shadow-soft)}
.pdp-panel-title{font-family:var(--serif);font-size:23px;color:var(--burgundy);margin:0 0 16px}
.pdp-panel-text{font-size:14.5px;color:var(--charcoal);line-height:1.7;margin:0}
.pdp-panel-split{display:grid;grid-template-columns:1fr 1fr;gap:34px}
.pdp-prose{font-size:15px}
.pdp-highlights{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px 28px}
.pdp-highlights li{position:relative;padding-left:28px;font-size:14.5px;color:var(--charcoal);line-height:1.5}
.pdp-highlights li::before{content:'';position:absolute;left:0;top:2px;width:18px;height:18px;border-radius:50%;background:var(--cream);border:1px solid var(--gold);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a1802f' stroke-width='3'%3E%3Cpath d='m5 12 5 5L20 7'/%3E%3C/svg%3E");background-size:12px;background-repeat:no-repeat;background-position:center}
.pdp-spec-scroll{overflow-x:auto}
.pdp-spec th{width:38%}

/* ---- Reviews ---- */
.pdp-reviews{display:grid;grid-template-columns:auto 1fr;gap:38px;align-items:start}
.pdp-reviews-score{text-align:center;padding-right:34px;border-right:1px solid var(--line);min-width:150px}
.pdp-reviews-avg{font-family:var(--serif);font-size:52px;font-weight:700;color:var(--burgundy);line-height:1}
.pdp-reviews-avg span{font-size:22px;color:var(--muted)}
.pdp-reviews-score .pdp-stars{font-size:18px;margin-top:8px}
.pdp-reviews-count{font-size:12.5px;color:var(--muted);margin-top:8px}
.pdp-reviews-bars{display:flex;flex-direction:column;gap:9px}
.pdp-reviews-lead{font-size:15px;color:var(--charcoal);margin:0}
.pdp-reviews-lead b{color:var(--burgundy)}
.pdp-reviews-sub{font-size:12.5px;color:var(--muted);margin:2px 0 4px;line-height:1.5}
.pdp-bar-row{display:flex;align-items:center;gap:12px;font-size:12.5px;color:var(--muted)}
.pdp-bar-label{width:26px;font-weight:600;color:var(--charcoal)}
.pdp-bar{flex:1;height:8px;border-radius:999px;background:var(--ivory-warm);overflow:hidden}
.pdp-bar span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--gold-light),var(--gold))}
.pdp-bar-pct{width:38px;text-align:right}
.pdp-review-cta{margin-top:8px;align-self:flex-start;padding:10px 20px;font-size:13px}
.pdp-reviews-empty{text-align:center;padding:14px 0}
.pdp-reviews-empty .pdp-stars{font-size:22px}
.pdp-reviews-empty p{color:var(--muted);font-size:14px;margin:12px 0 16px}

/* ---- Review notices ---- */
.pdp-review-note{border-radius:12px;padding:12px 16px;font-size:14px;margin:0 0 18px;border:1px solid transparent}
.pdp-review-note.is-ok{background:#e9f6ee;border-color:#bfe3cc;color:#1e6b34}
.pdp-review-note.is-err{background:#fbeaea;border-color:#eccaca;color:#9b2c2c}

/* ---- Individual reviews ---- */
.pdp-review-list{list-style:none;margin:24px 0 0;padding:22px 0 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:22px}
.pdp-review{display:flex;flex-direction:column;gap:6px}
.pdp-review-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pdp-review-author{font-weight:700;color:var(--charcoal);font-size:15px}
.pdp-review-verified{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:#1e6b34;background:#e9f6ee;border:1px solid #bfe3cc;border-radius:999px;padding:2px 10px}
.pdp-review-verified svg{display:block}
.pdp-review-stars{font-size:15px}
.pdp-review-date{font-size:12px;color:var(--muted)}
.pdp-review-body{margin:4px 0 0;font-size:14.5px;line-height:1.6;color:var(--charcoal)}

/* ---- Review gate / form ---- */
.pdp-review-gate{margin-top:24px;padding:18px 20px;border:1px dashed var(--line);border-radius:14px;background:var(--cream);text-align:center}
.pdp-review-gate p{margin:0 0 12px;color:var(--muted);font-size:14px}
.pdp-review-gate p:last-child{margin-bottom:0}
.pdp-review-form{margin-top:26px;padding:22px;border:1px solid var(--line);border-radius:16px;background:#fff;display:flex;flex-direction:column;gap:16px;box-shadow:0 1px 3px rgba(45,31,27,.05)}
.pdp-review-form-title{font-family:var(--serif);font-size:20px;color:var(--burgundy);margin:0}
.pdp-star-pick{display:flex;flex-direction:column;gap:8px}
.pdp-star-pick>label{font-weight:600;font-size:13px;color:var(--charcoal)}
.pdp-star-buttons{display:inline-flex;gap:4px}
.pdp-star{font-size:30px;line-height:1;background:none;border:none;cursor:pointer;color:var(--ivory-warm);padding:0 2px;transition:color .12s,transform .12s}
.pdp-star:hover{transform:scale(1.08)}
.pdp-star.is-on{color:var(--gold)}
.pdp-review-field{display:flex;flex-direction:column;gap:6px}
.pdp-review-field>span{font-weight:600;font-size:13px;color:var(--charcoal)}
.pdp-review-field textarea{width:100%;border:1px solid var(--line);border-radius:12px;padding:12px 14px;font:inherit;font-size:14.5px;resize:vertical;background:var(--cream)}
.pdp-review-field textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(200,162,77,.18)}
.pdp-review-form>.btn{align-self:flex-start}
@media(max-width:600px){.pdp-review-form>.btn{align-self:stretch}}

/* ---- Sticky mobile buy bar ---- */
.pdp-buybar{position:fixed;left:0;right:0;bottom:0;z-index:58;display:none;align-items:center;gap:10px;padding:10px 14px;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);border-top:1px solid var(--line);box-shadow:0 -12px 30px -18px rgba(45,31,27,.4);transform:translateY(110%);transition:transform .32s cubic-bezier(.2,.7,.2,1)}
.pdp-buybar.is-visible{transform:translateY(0)}
.pdp-buybar-price{display:flex;flex-direction:column;line-height:1.1;flex:none}
.pdp-buybar-now{font-family:var(--serif);font-weight:700;font-size:19px;color:var(--burgundy)}
.pdp-buybar-mrp{font-size:11px;color:var(--muted);text-decoration:line-through}
.pdp-buybar .btn{flex:1;padding:12px 8px;font-size:13.5px;min-width:0}

/* ---- Dark mode ---- */
body.dark .pdp-trust-item,body.dark .pdp-delivery,body.dark .pdp-panel{background:#1e1815;border-color:rgba(255,255,255,.08)}
body.dark .pdp-panel-text,body.dark .pdp-highlights li,body.dark .pdp-offers li{color:#e9dfd2}
body.dark .pdp-pin input{background:#141010;color:#f4ebe0}
body.dark .pdp-buybar{background:rgba(20,16,16,.97)}

/* ---- Responsive ---- */
@media (max-width:1099px){.pdp-highlights{grid-template-columns:1fr}}
@media (max-width:899px){
	.pdp-top{grid-template-columns:1fr;gap:30px}
	.pdp-gallery{flex-direction:column-reverse}
	.pdp-stage{flex:none;width:100%}
	.pdp-thumbs{flex-direction:row;width:100%;max-height:none;overflow-x:auto;overflow-y:hidden;padding-bottom:4px}
	.pdp-thumb{width:66px;flex:none}
	.pdp-dots{display:flex}
	.pdp-nav{opacity:1;width:36px;height:36px;font-size:22px;background:rgba(255,255,255,.85)}
	.pdp-details{margin-top:32px}
}
@media (max-width:768px){
	body.single-jk_product .mob-nav{display:none}
	/* The mobile bottom-nav is hidden here, but the sticky Buy bar (~56px,
	   fixed at the bottom) still needs clearance or it covers the footer's
	   last row and the final related-products. */
	body.single-jk_product{padding-bottom:calc(66px + env(safe-area-inset-bottom,0px))}
	body.single-jk_product .floating{bottom:calc(90px + env(safe-area-inset-bottom,0px))}
	body.single-jk_product .floating .fab-cart{display:none}
	.pdp-buybar{display:flex}
	.pdp-panel{padding:22px 20px}
	.pdp-panel-split{grid-template-columns:1fr;gap:22px}
	.pdp-reviews{grid-template-columns:1fr;gap:22px}
	.pdp-reviews-score{border-right:none;border-bottom:1px solid var(--line);padding-right:0;padding-bottom:20px}
}
@media (max-width:600px){
	.pdp-buy-row{gap:10px}
	.pdp-buy-row .pdp-qty{flex:0 0 100%;justify-content:space-between;height:50px}
	.pdp-buy-row .pdp-qty input{flex:1;width:auto}
	.pdp-cta{flex:1 1 0;min-width:0;font-size:14px;padding-left:8px;padding-right:8px;white-space:nowrap}
	.pdp-cta svg{width:16px;height:16px}
}
@media (max-width:520px){
	.pdp-trust{grid-template-columns:repeat(2,1fr)}
	.pdp-title{font-size:26px}
	.pdp-price-now{font-size:30px}
}
@media (prefers-reduced-motion:reduce){
	.pdp-zoom img,.pdp-buybar,.pdp-dot{transition:none}
	.pdp-stage.is-zooming .pdp-zoom img{transform:none}
}

/* ============================================================================
   BRANDED LOADING SCREEN (splash) — full styles; critical subset is inlined
   in the header so it paints instantly before this stylesheet loads.
   ========================================================================== */
.jk-preloader{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;background:radial-gradient(120% 120% at 50% 30%,#fdfaf4 0%,var(--ivory) 55%,var(--ivory-warm) 100%);transition:opacity .6s ease,visibility .6s ease}
.jk-preloader.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
.jk-preloader__mark{width:88px;height:88px;color:var(--gold-dark);animation:jkFloat 2.6s ease-in-out infinite}
.jk-preloader__mark svg{width:100%;height:100%;overflow:visible}
.jk-preloader__ring{transform-origin:50% 50%;animation:jkSpin 1.4s linear infinite}
.jk-preloader__brand{font-family:var(--serif);font-size:30px;font-weight:700;color:var(--burgundy);letter-spacing:.04em}
.jk-preloader__tag{margin-top:-14px;font-size:10px;letter-spacing:.34em;text-transform:uppercase;color:var(--gold);font-weight:600}
.jk-preloader__bar{width:150px;height:3px;border-radius:999px;background:var(--ivory-warm);overflow:hidden;position:relative}
.jk-preloader__bar::before{content:'';position:absolute;inset:0;width:40%;border-radius:999px;background:linear-gradient(90deg,transparent,var(--gold),transparent);animation:jkSlide 1.15s ease-in-out infinite}
@keyframes jkSpin{to{transform:rotate(360deg)}}
@keyframes jkFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes jkSlide{0%{left:-40%}100%{left:100%}}
.jk-booting main{opacity:0}
main{transition:opacity .5s ease}
@media (prefers-reduced-motion:reduce){
	.jk-preloader__mark,.jk-preloader__ring,.jk-preloader__bar::before{animation:none}
	.jk-booting main{opacity:1}
}

/* ============================================================
   HERO — hanging jhumkas
   The rail is a pseudo-element that bleeds past the container;
   each piece hangs on its own thread of a different length, so
   the two sway at different rates and never look looped.
   ============================================================ */
.jk-hero{position:relative;overflow:hidden;
  background:radial-gradient(120% 90% at 78% 0%,#FFF9EF 0%,var(--ivory) 55%)}
.jk-hero-in{display:grid;gap:clamp(1rem,3vw,1.6rem);align-items:center;
  padding-block:clamp(2rem,7vw,4.5rem) clamp(3rem,9vw,6rem)}
@media(min-width:900px){.jk-hero-in{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:clamp(2rem,5vw,4rem)}}
/* 34ch is measured against the BODY font, not the display face, so on desktop
   it capped this column near 270px while the grid gave it ~580px. The h1 then
   wrapped a word per line and the whole hero looked pushed left with a dead
   gap before the jhumkas. The cap is only useful on narrow screens now. */
.jk-hero-copy{max-width:min(100%,34rem)}
.jk-hero-title{font-family:var(--serif);font-size:var(--step-3);line-height:1.04;
  letter-spacing:-.025em;margin:.6rem 0 0;color:var(--charcoal);
  font-variation-settings:"SOFT" 40,"opsz" 144;font-weight:400}
.jk-hero-title em{font-style:italic;color:var(--gold)}
.jk-hero-lede{font-size:var(--step-1);color:var(--muted);margin:1rem 0 0;
  line-height:1.45;max-width:32ch}
.jk-hero-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.8rem}
.jk-hero-note{display:flex;align-items:center;gap:.5rem;margin:1.4rem 0 0;
  font-size:var(--step--1);color:var(--muted)}
.jk-hero-note svg{color:var(--gold);flex:none}

.jk-hang{position:relative;min-height:min(58vh,460px)}
.jk-hang::before{content:"";position:absolute;inset-inline:-50vw;top:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold) 18%,var(--gold) 82%,transparent)}
.jk-drop{position:absolute;top:0;display:block;transform-origin:50% 0;
  animation:jk-sway 7s ease-in-out infinite alternate}
.jk-drop::before{content:"";position:absolute;left:50%;top:0;width:1px;
  background:linear-gradient(180deg,var(--gold),rgba(200,162,77,.25));
  transform:translateX(-.5px)}
.jk-drop img{width:100%;aspect-ratio:4/5;object-fit:cover;
  border-radius:200px 200px 14px 14px;
  background:linear-gradient(160deg,var(--ivory-warm),#E7D3B4);
  box-shadow:0 30px 60px -30px rgba(45,31,27,.45)}
.jk-drop-1{left:2%;width:min(43%,230px)}
.jk-drop-1::before{height:clamp(28px,6vw,64px)}
.jk-drop-1 img{margin-top:clamp(28px,6vw,64px)}
.jk-drop-2{right:2%;width:min(46%,268px);animation-duration:8.5s;animation-delay:-2s}
.jk-drop-2::before{height:clamp(64px,13vw,130px)}
.jk-drop-2 img{margin-top:clamp(64px,13vw,130px)}
@keyframes jk-sway{from{transform:rotate(-1.6deg)}to{transform:rotate(1.6deg)}}
@media(min-width:900px){
  .jk-hang{min-height:min(74vh,620px)}
  /* The copy fills its own column instead of a 34ch sliver; text-wrap:balance
     evens the headline's line lengths so it reads as a block, not a ladder. */
  .jk-hero-copy{max-width:none;padding-right:clamp(0px,2vw,2rem)}
  .jk-hero-title{max-width:14ch;text-wrap:balance}
  .jk-hero-lede{max-width:40ch}
  /* The rail bled 50vw in BOTH directions, so it drew a gold line straight
     across the headline. It now starts just left of the jhumkas and only
     bleeds off the right edge of the screen. */
  .jk-hang::before{inset-inline:-2rem -50vw}
}
@media(prefers-reduced-motion:reduce){.jk-drop{animation:none;transform:rotate(.8deg)}}

/* Promise row: three points on hairlines, no cards — the v1 treatment. */
.jk-promise{display:grid;gap:clamp(1.6rem,4vw,2.5rem)}
@media(min-width:760px){.jk-promise{grid-template-columns:repeat(3,1fr)}}
.jk-promise .jk-p-item{padding-top:1.1rem;border-top:1px solid var(--line)}
.jk-promise h3{font-family:var(--serif);font-size:var(--step-1);margin:0 0 .3rem;
  font-variation-settings:"SOFT" 25;font-weight:400}
.jk-promise p{margin:0;color:var(--muted);font-size:var(--step--1);max-width:34ch}

/* Delivery-area notice on checkout */
.jk-area-note{margin:.7rem 0 0;padding:.6rem .85rem;border-radius:10px;
  background:var(--cream);border-left:3px solid var(--gold);
  font-size:var(--step--1);color:var(--charcoal)}
.jk-place-order:disabled{opacity:.45;cursor:not-allowed}

/* ---------------------------------------------------------------------------
   Refund / problem claim form (Report a Problem — Contact page)
   Uploads an unboxing video + photos; handled server-side by the core plugin.
--------------------------------------------------------------------------- */
.jk-claim-wrap{margin:50px auto 0;max-width:840px}
.jk-claim{background:#fff;border:1px solid var(--line);border-radius:20px;padding:clamp(22px,4vw,34px);box-shadow:var(--shadow-soft)}
.jk-claim h2{font-family:var(--serif);font-size:clamp(22px,3vw,28px);color:var(--burgundy);margin:0 0 10px}
.jk-claim-lead{font-size:14px;color:var(--muted);line-height:1.7;margin:0 0 22px}
.jk-claim-form{display:flex;flex-direction:column;gap:18px}
.jk-claim-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.jk-claim .jk-field{margin:0}
.jk-req{color:var(--rose-deep);font-weight:700}
.jk-claim-upload{border:1.5px dashed var(--line);border-radius:14px;padding:16px 16px 18px;background:var(--ivory)}
.jk-claim-upload label{margin-bottom:10px}
.jk-claim-upload input[type=file]{width:100%;font-size:13px;color:var(--charcoal)}
.jk-claim-upload input[type=file]::file-selector-button{margin-right:12px;padding:9px 16px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--burgundy);font-family:var(--sans);font-weight:600;font-size:12px;letter-spacing:.04em;cursor:pointer;transition:.2s}
.jk-claim-upload input[type=file]::file-selector-button:hover{border-color:var(--gold);color:var(--gold-dark)}
.jk-claim-hint{display:block;margin-top:8px;font-size:12px;color:var(--muted);line-height:1.6}
.jk-claim-submit{align-self:flex-start;margin-top:4px}
.jk-claim-note{border-radius:12px;padding:14px 16px;font-size:14px;line-height:1.6;margin-bottom:20px}
.jk-claim-ok{background:#eef7ee;border:1px solid #cfe6cf;border-left:3px solid #4a9d5f;color:#2f6b3f}
.jk-claim-err{background:#fbeceb;border:1px solid #f0cfcc;border-left:3px solid var(--rose-deep);color:#9a3b34}
@media(max-width:640px){
  .jk-claim-grid{grid-template-columns:1fr;gap:16px}
  .jk-claim-submit{align-self:stretch}
}

/* ---------------------------------------------------------------------------
   Consistent vertical rhythm on small screens.
   Sections no longer carry ad-hoc inline padding overrides, so a single
   value here keeps the gap between every section even on mobile.
--------------------------------------------------------------------------- */
@media(max-width:640px){
  .section{padding:52px 0}
}

/* ---- Product variations (colour picker) ---- */
.pdp-variations{margin:18px 0 6px}
.pdp-var-label{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted,#8a7f6c);margin-bottom:8px}
.pdp-var-label strong{color:var(--ink,#3a332e);text-transform:none;letter-spacing:0;font-size:15px}
.pdp-var-choices{display:flex;flex-wrap:wrap;gap:9px}
.pdp-var{position:relative;padding:9px 16px;border:1.5px solid var(--line,#e6ddd0);background:#fff;border-radius:999px;
  font:inherit;font-size:14px;color:var(--ink,#3a332e);cursor:pointer;transition:border-color .15s,box-shadow .15s}
.pdp-var:hover:not(:disabled){border-color:var(--gold,#c9a227)}
.pdp-var.is-active{border-color:var(--burgundy,#5B2333);box-shadow:0 0 0 2px rgba(91,35,51,.12)}
.pdp-var.is-out,.pdp-var:disabled{opacity:.45;cursor:not-allowed;text-decoration:line-through}
.pdp-var-out{display:block;font-size:10px;letter-spacing:.05em;text-transform:uppercase;text-decoration:none}
.pdp-var-stock{margin:9px 0 0;font-size:13px;color:#b3541e;min-height:18px}
.pdp-buy-row button:disabled{opacity:.5;cursor:not-allowed}

/* ---- Add-to-cart toast ---- */
#jkToast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,14px);z-index:9999;
  background:var(--charcoal,#2D1F1B);color:#fff;padding:12px 20px;border-radius:999px;
  font-size:14px;font-weight:600;box-shadow:0 8px 26px rgba(0,0,0,.22);
  opacity:0;pointer-events:none;transition:opacity .22s,transform .22s;max-width:90vw;text-align:center}
#jkToast.is-on{opacity:1;transform:translate(-50%,0)}
@media (prefers-reduced-motion:reduce){#jkToast{transition:none}}

/* Cart rows fade while an edit is in flight */
#jkCartLive{transition:opacity .15s}
.jk-cart-remove-cell .jk-remove{cursor:pointer;font-size:22px;line-height:1;background:none;border:none;
  color:var(--muted,#8A7A72);padding:4px 8px;border-radius:8px;transition:color .15s,background .15s}
.jk-cart-remove-cell .jk-remove:hover{color:#b32d2e;background:rgba(179,45,46,.08)}

/* ---------------------------------------------------------------------------
   Vertical rhythm — tightened.

   Every homepage block is a .section, and each carried symmetrical padding
   (70px, rising to 96px above 1024px). Stacked, adjacent sections added their
   padding together: 192px of empty space between blocks on desktop and 140px
   on a phone. Individually each value looked reasonable, which is why it was
   easy to miss — the gap is a property of the pair, not of either section.

   One fluid value replaces the three fixed breakpoint values below, so the
   spacing scales with the viewport instead of stepping at 640px and 1024px.
   These rules are last in the file and therefore win over the earlier ones.

   Resulting gap between two sections: ~60px on a phone, ~100px on a wide
   desktop — enough to separate blocks, not enough to look like a loading error.
--------------------------------------------------------------------------- */
.section{padding:clamp(28px,4vw,50px) 0}
@media (min-width:1024px){.section{padding:clamp(28px,4vw,50px) 0}}
@media (max-width:640px){.section{padding:clamp(24px,5vw,32px) 0}}

/* The heading block sat 48px above its own content at every size. */
.sec-head{margin-bottom:clamp(20px,3vw,32px)}
.sec-head p{font-size:15px}

/* A section that sets its own background needs a little more room inside it,
   or the colour band crowds the text it is meant to frame. */
.section[style*="background"]{padding:clamp(34px,4.6vw,60px) 0}

/* The footer added a 60px margin on top of the previous section's padding,
   producing the largest gap on the page right before the darkest element. */
.site-footer{padding:clamp(38px,5vw,60px) 0 24px;margin-top:0}

/* Newsletter panel: fluid rather than a flat 60px. */
.news{padding:clamp(30px,4.5vw,48px) clamp(20px,3vw,30px)}

/* Hero should not leave a chasm before the first product row. */
.jk-hang{padding-bottom:clamp(10px,2vw,24px)}

/* ---- Cart drawer: editable line items ---- */
.jk-drawer-cart{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.jk-dc-item{display:flex;gap:12px;align-items:flex-start;transition:opacity .15s}
.jk-dc-item img{width:56px;height:56px;object-fit:cover;border-radius:10px;flex:none}
.jk-dc-main{flex:1;min-width:0}
.jk-dc-main>a{display:block;font-weight:600;line-height:1.3;color:var(--charcoal)}
.jk-dc-price{font-size:13px;color:var(--muted,#8A7A72);margin-top:2px}
.jk-cart-var{display:block;font-size:12px;color:var(--muted,#8A7A72)}
.jk-dc-controls{display:flex;align-items:center;gap:12px;margin-top:8px}
.jk-dc-qty{display:inline-flex;align-items:center;border:1px solid var(--line,#e6ddd0);border-radius:999px;overflow:hidden}
.jk-dc-qty button{background:none;border:none;width:28px;height:28px;font-size:15px;line-height:1;
  cursor:pointer;color:var(--charcoal)}
.jk-dc-qty button:hover{background:rgba(0,0,0,.05)}
.jk-dc-n{min-width:26px;text-align:center;font-size:14px;font-weight:600}
.jk-dc-remove{background:none;border:none;padding:0;font-size:12.5px;color:var(--muted,#8A7A72);
  cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.jk-dc-remove:hover{color:#b32d2e}
.jk-dc-total{font-weight:700;white-space:nowrap}
.jk-dc-foot{display:flex;justify-content:space-between;align-items:center;margin-top:18px;
  padding-top:16px;border-top:1px solid rgba(45,31,27,.12)}
.jk-dc-foot strong{font-size:18px}

/* ---- Add-to-cart button states ---- */
[data-jk-add-btn].is-loading{opacity:.7;cursor:progress}
[data-jk-add-btn].is-added{background:#1e7a45!important;border-color:#1e7a45!important;color:#fff!important}
