/** Shopify CDN: Minification failed

Line 1508:0 Unexpected "}"

**/
/* Nakhrey global chrome.
   Brand identity lives entirely in chrome (borders, shadows, pills) — never
   in product imagery. Palette comes from :root vars set in nakhrey-vars.liquid. */

/* ---------- Base ---------- */

body,
body.gradient {
  background: var(--nk-bg);
  background-image: none;
  color: var(--nk-ink);
}

h1, h2, h3, h4, h5, h6,
.h0, .h1, .h2, .h3, .h4, .h5 {
  color: var(--nk-ink);
  letter-spacing: -0.01em;
}

/* Prices and buttons carry the display face */
.price,
.price * ,
.button,
.shopify-challenge__button,
.customer button,
button.shopify-payment-button__button--unbranded {
  font-family: var(--nk-font-display);
}

/* ---------- Buttons ---------- */

.button,
.shopify-challenge__button,
.customer button,
.nk-btn {
  border-radius: 999px;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.nk-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 1.1rem 2.2rem;
  font-size: 1.5rem;
  line-height: 1.2;
  text-decoration: none;
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.nk-btn:hover {
  transform: translateY(-2px);
}

.nk-btn--a1 {
  background: var(--nk-a1);
  color: #fff;
}

.nk-btn--dark {
  background: var(--nk-ink);
  color: #fff;
}

.nk-btn--line {
  background: transparent;
  border-color: var(--nk-ink);
  color: var(--nk-ink);
}

/* ---------- Badges & chips ---------- */

.badge,
.nk-badge {
  background: var(--nk-a2);
  border: 2px solid var(--nk-ink);
  border-radius: 999px;
  color: var(--nk-ink);
  font-family: var(--nk-font-display);
  font-weight: 600;
  font-size: 1.1rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.4rem 1rem;
}

.nk-chip {
  display: inline-block;
  font-family: var(--nk-font-deva);
  font-size: 1.4rem;
  line-height: 1;
  /* softink, not a1: a1-on-soft fails WCAG contrast at this size */
  color: var(--nk-softink);
  background: var(--nk-soft);
  border-radius: 999px;
  padding: 0.5rem 1.2rem 0.7rem;
  vertical-align: middle;
}

.nk-tag {
  display: inline-block;
  background: var(--nk-soft);
  color: var(--nk-softink);
  border-radius: 999px;
  font-family: var(--nk-font-display);
  font-weight: 600;
  font-size: 1.1rem;
  letter-spacing: 0.04em;
  padding: 0.35rem 1rem;
}

.nk-price-pill {
  display: inline-block;
  background: var(--nk-a1);
  color: #fff;
  border-radius: 999px;
  font-family: var(--nk-font-display);
  font-weight: 700;
  font-size: 1.4rem;
  padding: 0.5rem 1.3rem;
  white-space: nowrap;
}

/* ---------- Section header pattern ---------- */

/* padding-block only: the shorthand `padding: 4rem 0` was zeroing
   .page-width's horizontal padding on the same element (this file loads
   after base.css), leaving every custom section flush to the viewport
   edge on mobile. */
.nk-section {
  padding-block: 4rem;
}

@media screen and (min-width: 990px) {
  .nk-section {
    padding-block: 5.5rem;
  }
}

/* Mobile floor: base.css gives .page-width 1.5rem; hold custom sections at
   a minimum 16px so cards and their offset shadows never touch the edge. */
@media screen and (max-width: 749px) {
  .nk-section.page-width {
    padding-inline: 1.6rem;
  }
}

.nk-section-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem 2rem;
  margin-bottom: 2.4rem;
}

.nk-section-head__title {
  margin: 0;
  font-size: 2.6rem;
}

@media screen and (min-width: 990px) {
  .nk-section-head__title {
    font-size: 3.4rem;
  }
}

.nk-section-head__title .nk-chip {
  margin-inline-start: 1rem;
}

.nk-section-head__link {
  font-family: var(--nk-font-display);
  font-weight: 600;
  color: var(--nk-ink);
  text-decoration: none;
  border-bottom: 2px solid var(--nk-a1);
  padding-bottom: 0.2rem;
  /* When the head wraps on narrow screens, the link takes its own line
     right-aligned instead of dangling left under the heading. */
  margin-inline-start: auto;
}

.nk-section-head__link:hover {
  color: var(--nk-a1);
}

.nk-eyebrow {
  display: inline-block;
  font-family: var(--nk-font-display);
  font-weight: 600;
  font-size: 1.2rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border-radius: 999px;
  padding: 0.5rem 1.2rem;
}

.nk-eyebrow--soft {
  background: var(--nk-soft);
  color: var(--nk-softink);
}

.nk-eyebrow--accent2 {
  background: var(--nk-a2);
  color: var(--nk-ink);
  border: 2px solid var(--nk-ink);
}

/* ---------- Global card chrome ---------- */
/* Applies to every Dawn product card (collections, search, related,
   featured) plus custom .nk-card surfaces. */

.card-wrapper .card,
.nk-card {
  background: #fff;
  border: 2px solid var(--nk-ink);
  border-radius: 16px;
  box-shadow: 7px 7px 0 var(--nk-a2);
  overflow: hidden;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.card-wrapper:hover .card,
a.nk-card:hover,
.nk-card--hover:hover {
  transform: translate(-3px, -3px);
  box-shadow: 12px 12px 0 var(--nk-a1);
}

.card-wrapper .card .card__inner {
  border-radius: 0;
  border-bottom: 2px solid var(--nk-ink);
}

.card-wrapper .card .card__content {
  padding: 1.2rem 1.4rem 1.4rem;
}

.card-wrapper .card .card__inner .card__content {
  padding: 0;
  border: 0;
}

.card-wrapper .card__heading {
  font-size: 1.5rem;
  font-weight: 600;
  /* equal-height cards: titles never exceed two lines */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Containment (P0, 8 Sep 2026): every grid/flex child inside a card may
   shrink below its content — Dawn's .card__content is a grid and
   .card__information a flex column, both default to min-width:auto, so an
   unbreakable child (the nowrap descriptor) set the card's min-content and
   pushed grid tracks wider than the viewport. No overflow:hidden masking:
   long text wraps instead. */
.card-wrapper,
.card-wrapper .card,
.card-wrapper .card__content,
.card-wrapper .card__information,
.card-wrapper .card__information > .card-information,
.card-wrapper .card-information .price,
.card-wrapper .quick-add {
  min-width: 0;
  max-width: 100%;
}

.card-wrapper .card__heading,
.card-wrapper .nk-descriptor {
  overflow-wrap: anywhere;
}

/* Anchor the price/badge row to the card bottom so all cards in a row
   align regardless of title length. */
.card-wrapper .card__information {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.card-wrapper .card__information > .card-information {
  margin-top: auto;
}

.card-wrapper .card-information .price {
  display: inline-block;
  background: var(--nk-a1);
  color: #fff;
  border-radius: 999px;
  font-weight: 700;
  /* never wrap into a blob: nowrap numbers + clamp for narrow screens */
  font-size: clamp(1.15rem, 3.4vw, 1.4rem);
  white-space: nowrap;
  padding: 0.4rem 1.2rem;
  margin-top: 0.6rem;
}

.card-wrapper .card-information .price .price-item {
  color: #fff;
}

/* Compare-at: small inline strikethrough before the sale price; on very
   narrow screens the wrap puts it on its own line above the price.
   Scoped to .price--on-sale (Aug 2026): the unconditional version
   overrode Dawn's hide and leaked the sale div on cards where the
   compare-at threshold suppresses discount styling. */
.card-wrapper .card-information .price.price--on-sale .price__sale {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 0.6rem;
}

.card-wrapper .card-information .price .price__sale s.price-item--regular {
  font-size: 0.82em;
  font-weight: 500;
  opacity: 0.75;
}

.card-wrapper .card-information .price dl {
  margin: 0;
}

/* ---------- Audit 2 (9 Sep 2026): card frame, fixed text rows, aligned CTAs ---------- */
/* 1. One 3:4 media frame on every product card (card-product.liquid sets
   --ratio-percent 133.33% and nk-media--cover|contain from the photo's own
   aspect). Portrait fills; square/landscape letterbox on the page ground —
   the dupatta is never cropped. The frame must NOT flex-grow (Dawn lets
   .card__inner absorb the row's slack, which would give shorter cards a
   taller frame): the content column absorbs it instead. */
/* Dawn only makes the card a full-height flex column when the render call
   passes extend_height (the collection grid does not), so a card without a
   swatch row (or, until 14 Sep 2026, a stock pill) ended ~32px short of its neighbour and
   its Quick Add sat higher. Every media card is a full-height column here. */
/* Dawn wraps the card in <product-component>, an inline custom element, so
   the card's height:100% had nothing to resolve against. */
.grid__item > product-component {
  display: block;
  height: 100%;
}

.grid__item .card-wrapper {
  height: 100%;
}

.card-wrapper .card.card--media {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.card-wrapper .card--media .card__inner {
  flex: 0 0 auto;
}

.card-wrapper .card__media.nk-media--contain {
  background: var(--nk-bg);
}

.card-wrapper .card__media.nk-media--contain .media img {
  object-fit: contain;
}

/* 2. Fixed-height name (2 lines) and descriptor (2 lines) so the price row
   and the Quick Add land on the same line across a grid row. The content
   column is a flex column: information grows, quick-add sits at the bottom. */
.card-wrapper .card > .card__content {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}

.card-wrapper .card > .card__content > .card__information {
  flex: 1 1 auto;
}

.card-wrapper .card > .card__content > .nk-quick-add-m {
  margin-top: auto;
  padding-top: 0.8rem;
}

.card-wrapper .card__heading {
  line-height: 1.3;
  min-height: 2.6em;
}

.card-wrapper .card__information .nk-descriptor {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.35;
  min-height: 2.7em;
}

/* 3. Colour swatches on cards (14 Sep 2026): ONE 44px line at every width.
   Dot 2.8rem visual, tap box 4.4rem (padding), boxes overlap by 0.4rem on each
   side so the visual pitch is dot + 0.8rem gap and six dots fit a 4-col card
   at 1440 (6 × 3.6rem). ≤749px: the first three dots + "+N"; the rest hide. */
.card-wrapper .nk-family--sm {
  flex-wrap: nowrap;
  gap: 0;
  height: 4.4rem;
  margin: -0.6rem 0 -0.6rem -0.8rem;
  overflow: hidden;
}

.card-wrapper .nk-family--sm .nk-family__swatch {
  position: relative;
  box-sizing: border-box;
  flex: 0 0 auto;
  width: 4.4rem;
  height: 4.4rem;
  margin: 0 -0.4rem;
  padding: 0.8rem;
  border: 0;
  border-radius: 50%;
  box-shadow: none;
  background: none;
  overflow: visible;
}

/* Hybrid swatches (14 Sep 2026): image thumbnails carry NO ring; solid dots (.nk-family__dot,
   background from nakhrey.colour_hex) get a hairline so pale colours read on ivory. The current
   colourway is outlined for both. */
.card-wrapper .nk-family--sm .nk-family__swatch img,
.card-wrapper .nk-family--sm .nk-family__swatch .nk-family__dot {
  box-sizing: border-box;
  display: block;
  width: 2.8rem;
  height: 2.8rem;
  border-radius: 50%;
  border: 1.5px solid transparent;
  object-fit: cover;
}

.card-wrapper .nk-family--sm .nk-family__swatch .nk-family__dot {
  box-shadow: 0 0 0 1px rgba(var(--color-foreground), 0.18);
}

.card-wrapper .nk-family--sm .nk-family__swatch--current img,
.card-wrapper .nk-family--sm .nk-family__swatch--current .nk-family__dot {
  border-color: rgb(var(--color-foreground));
}

.card-wrapper .nk-family--sm a.nk-family__swatch:hover img,
.card-wrapper .nk-family--sm a.nk-family__swatch:focus-visible img,
.card-wrapper .nk-family--sm a.nk-family__swatch:hover .nk-family__dot,
.card-wrapper .nk-family--sm a.nk-family__swatch:focus-visible .nk-family__dot {
  border-color: rgba(var(--color-foreground), 0.55);
}

.card-wrapper .nk-family--sm a.nk-family__swatch:focus-visible {
  outline: 2px solid var(--nk-ink);
  outline-offset: -4px;
}

.card-wrapper .nk-family--sm .nk-family__more {
  margin-left: 0.6rem;
  line-height: 4.4rem;
}

/* the mobile "+N" only exists ≤749px; the desktop "+N" (beyond 6) stays as is */
.card-wrapper .nk-family--sm .nk-family__more--sm {
  display: none;
}

@media screen and (max-width: 749px) {
  .card-wrapper .nk-family--sm .nk-family__swatch--overflow {
    display: none;
  }
  .card-wrapper .nk-family--sm .nk-family__more--sm {
    display: inline;
  }
}

/* Price row: on narrow cards the price pill and the "Only N left" pill wrap
   onto two lines; a sold-out card has no second pill. Reserve the two-line
   height so the price pill sits on the same line across a row. */
@media screen and (max-width: 749px) {
  .card-wrapper .card__information > .card-information {
    min-height: 6.5rem;
  }
}

/* Empty collection (no products at all) */
.nk-collection-unavailable {
  font-size: 2rem;
  line-height: 1.4;
}

/* Kill Dawn's opacity-based card shadows so the hard offset reads clean */
.card-wrapper .card:before,
.card-wrapper .card .card__inner:before {
  box-shadow: none;
}

/* Hero-grade media card */
.nk-hero-card {
  background: #fff;
  border: 3px solid var(--nk-ink);
  border-radius: 20px;
  box-shadow: 14px 14px 0 var(--nk-a1);
  overflow: hidden;
}

/* Product meta areas */
.nk-meta-top {
  border-top: 3px solid var(--nk-a1);
}

/* ---------- Rotator controls (shared by hero / three-ways / fan-mail) ---------- */

.nk-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 4rem;
  border-radius: 999px;
  border: 2px solid var(--nk-ink);
  background: #fff;
  color: var(--nk-ink);
  cursor: pointer;
  font-size: 1.8rem;
  line-height: 1;
  transition: background 0.15s ease, color 0.15s ease;
}

.nk-arrow:hover {
  background: var(--nk-ink);
  color: #fff;
}

.nk-dots {
  display: flex;
  gap: 0.8rem;
  align-items: center;
}

.nk-dots button {
  width: 1rem;
  height: 1rem;
  padding: 0;
  border-radius: 999px;
  border: 2px solid var(--nk-ink);
  background: transparent;
  cursor: pointer;
  transition: width 0.2s ease, background 0.2s ease;
}

.nk-dots button[aria-current='true'] {
  width: 2.6rem;
  background: var(--nk-a1);
  border-color: var(--nk-ink);
}

nakhrey-rotator {
  display: block;
  position: relative;
}

nakhrey-rotator .nk-rotator__viewport {
  overflow: hidden;
}

nakhrey-rotator .nk-rotator__track {
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
  transition: transform 0.45s cubic-bezier(0.33, 1, 0.68, 1);
}

nakhrey-rotator .nk-rotator__slide {
  flex: 0 0 100%;
  min-width: 100%;
}

/* Devanagari accents */
.nk-hindi {
  font-family: var(--nk-font-deva);
}

.nk-ghost-word {
  position: absolute;
  /* Mobile (stacked): hugs the copy block at the top of the grid so it never
     reaches the media card below; sized to stay subtle at 393px. */
  inset-inline-start: -4%;
  top: -1rem;
  /* System Devanagari stack on purpose: at 4.5% opacity the face is
     indistinguishable, and skipping the webfont keeps this huge span from
     re-triggering LCP when Noto Serif Devanagari swaps in. */
  font-family: 'Kohinoor Devanagari', 'Devanagari MT', 'Mangal', 'Noto Serif Devanagari', serif;
  font-size: clamp(8rem, 30vw, 12rem);
  line-height: 1;
  color: var(--nk-ink);
  opacity: 0.045;
  pointer-events: none;
  user-select: none;
  white-space: nowrap;
  z-index: 0;
}

@media screen and (min-width: 990px) {
  /* Desktop: large, behind the headline/lede in the text column,
     bottom-left, partially cropped by the rotator viewport — intentional. */
  .nk-ghost-word {
    inset-inline-start: -2%;
    top: auto;
    bottom: -10%;
    font-size: clamp(12rem, 22vw, 30rem);
  }
}

/* ---------- Header & wordmark ---------- */

.header-wrapper,
.section-header .header-wrapper--border-bottom {
  background: var(--nk-bg);
  border-bottom: 2px solid var(--nk-ink);
}

.nk-wordmark {
  display: inline-flex;
  align-items: baseline;
  gap: 0.5rem;
  font-family: var(--nk-font-display);
  font-weight: 700;
  letter-spacing: 0.03em;
  color: var(--nk-ink);
  white-space: nowrap;
}

.nk-wordmark__accent {
  color: var(--nk-a1);
}

.nk-wordmark__hindi {
  font-family: var(--nk-font-deva);
  font-size: 0.55em;
  color: var(--nk-a1);
}

/* ---------- Product page ---------- */

.nk-product-story {
  margin: 0.6rem 0 0;
  font-style: italic;
  font-size: 1.4rem;
  color: var(--nk-softink);
}

/* ---------- Footer ---------- */

.footer {
  border-top: 2px solid var(--nk-ink);
  background: var(--nk-bg);
}

.nk-footer-brand {
  padding-top: 3rem;
  text-align: center;
}

.nk-footer-brand__link {
  text-decoration: none;
}

.nk-footer-brand .nk-wordmark {
  font-size: 2.6rem;
}

.nk-footer-brand__tagline {
  margin: 0.8rem 0 0;
  font-family: var(--nk-font-display);
  font-weight: 500;
  font-size: 1.5rem;
  color: var(--nk-ink);
}

.nk-footer-brand__location {
  margin: 0.4rem 0 0;
  font-size: 1.3rem;
  color: var(--nk-softink);
}

.nk-footer-brand__location a {
  color: var(--nk-a1);
}

/* ---------- Motion ---------- */

@media (prefers-reduced-motion: reduce) {
  .card-wrapper .card,
  .nk-card,
  .nk-btn,
  .nk-dots button,
  nakhrey-rotator .nk-rotator__track {
    transition: none;
  }

  .card-wrapper:hover .card,
  a.nk-card:hover,
  .nk-card--hover:hover,
  .nk-btn:hover {
    transform: none;
  }
}

/* ---------- Header dropdown chrome ---------- */
/* Desktop nav submenus were stock Dawn (flat white, soft shadow) — bring
   them onto brand chrome: ink border, radius, hard offset shadow. */
header .header__submenu.global-settings-popup,
header details[open] > .header__submenu {
  background: var(--nk-bg);
  border: 2px solid var(--nk-ink);
  border-radius: 14px;
  box-shadow: 6px 6px 0 var(--nk-a2);
  overflow: hidden;
  padding-block: 0.6rem;
}

header .header__submenu .header__menu-item {
  color: var(--nk-ink);
}

header .header__submenu .header__menu-item:hover {
  color: var(--nk-a1);
  text-decoration: none;
}

/* ---------- Quick-add on product cards ---------- */
/* Chrome: ink border pill, a1 fill on press; sold-out stays Dawn-disabled. */
.card-wrapper .quick-add__submit.button {
  min-height: 4.4rem;
  background: #fff;
  color: var(--nk-ink);
  border: 2px solid var(--nk-ink);
  border-radius: 999px;
  font-family: var(--nk-font-display);
  font-weight: 600;
  box-shadow: none;
  text-align: center;
  text-decoration: none;
}

.card-wrapper .quick-add__submit.button:active {
  background: var(--nk-a1);
  color: #fff;
  border-color: var(--nk-ink);
}

.card-wrapper .quick-add__submit.button:after,
.card-wrapper .quick-add__submit.button:before {
  box-shadow: none;
}

.card-wrapper .quick-add__submit.button[disabled] {
  background: var(--nk-soft);
  color: var(--nk-softink);
  border-color: var(--nk-softink);
  opacity: 1;
}

/* Card click architecture (Dawn's .card__content spans the WHOLE card via
   its grid, media included):
   - content: paints above the media (z1) but is transparent to events;
     its direct children (title, price, quick-add row) re-enable them.
   - the heading link's stretched ::after is removed — media clicks go
     through the explicit .nk-card-media-link, title clicks through the
     heading anchor, so no phantom overlay is needed and quick-add wins
     its own hit test. */
.card-wrapper .card__content {
  position: relative;
  z-index: 1;
  pointer-events: none;
}

.card-wrapper .card__content > * {
  pointer-events: auto;
}

.card-wrapper .card__heading a::after {
  content: none;
}

.card-wrapper .quick-add {
  position: relative;
  z-index: 3;
}

/* Two copies per card, one visible per breakpoint (unique form ids). */

/* Mobile: content copy — always-visible compact row under the price. */
@media screen and (max-width: 989px) {
  .card-wrapper .nk-quick-add-d {
    display: none;
  }

  .card-wrapper .nk-quick-add-m {
    margin: 0.8rem 0 0;
  }
}

/* Desktop: media copy — hover-reveal pinned to the media bottom.
   card__inner is its containing block, so hover transforms on .card move
   card and button together. */
@media screen and (min-width: 990px) {
  .card-wrapper .nk-quick-add-m {
    display: none;
  }

  .card-wrapper .card__inner {
    position: relative;
  }

  .card-wrapper .nk-quick-add-d {
    position: absolute;
    inset-inline: 1.2rem;
    bottom: 1.2rem;
    margin: 0;
    opacity: 0;
    pointer-events: none;
    transform: translateY(6px);
    transition: opacity 0.15s ease, transform 0.15s ease;
  }

  .card-wrapper:hover .nk-quick-add-d,
  .card-wrapper:focus-within .nk-quick-add-d {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .card-wrapper .quick-add {
    transition: none;
    transform: none;
  }
}

/* Explicit media link (replaces stretched-::after coverage of the media) */
.card-wrapper .nk-card-media-link {
  display: block;
  height: 100%;
}

/* ---------- Global button chrome: rest-state borders ---------- */
/* Dawn draws button borders via an ::after box-shadow that several schemes
   only reveal on hover — the chrome system wants the 2px ink border ALWAYS.
   Covers product-form Add to cart, Buy now (unbranded), cart drawer
   checkout, contact form, challenge and account buttons. */
.button,
.shopify-challenge__button,
.customer button,
.cart__checkout-button,
button.shopify-payment-button__button--unbranded {
  border: 2px solid var(--nk-ink);
}

/* Retire Dawn's ::after border/shadow machinery so it can't double up */
.button:after,
.shopify-challenge__button:after,
.customer button:after,
button.shopify-payment-button__button--unbranded:after {
  box-shadow: none;
  content: none;
}

.button:hover,
.shopify-challenge__button:hover,
.customer button:hover,
button.shopify-payment-button__button--unbranded:hover {
  transform: translateY(-2px);
}

.button:focus-visible,
.shopify-challenge__button:focus-visible,
.customer button:focus-visible,
button.shopify-payment-button__button--unbranded:focus-visible {
  outline: 2px solid var(--nk-a1);
  outline-offset: 2px;
}

.button:disabled,
.button[aria-disabled='true'],
.button.disabled {
  background: var(--nk-soft);
  color: var(--nk-softink);
  border-color: var(--nk-softink);
  transform: none;
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .button:hover,
  .shopify-challenge__button:hover,
  .customer button:hover,
  button.shopify-payment-button__button--unbranded:hover {
    transform: none;
  }
}

/* ---------- Product media lightbox ---------- */
/* One image at a time, centred and contained; arrows/counter in chrome. */
product-modal .product-media-modal__content {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
  overflow: hidden;
  padding: 0;
}

product-modal .product-media-modal__content [data-media-id] {
  display: none;
  margin: 0;
}

/* the media element is often the <img> itself; wrappers (deferred-media)
   also occur — style both shapes */
product-modal .product-media-modal__content [data-media-id].nk-lightbox-active {
  display: block;
  max-width: 92vw;
  max-height: 90vh;
  width: auto;
  height: auto;
  object-fit: contain;
  margin: 0 auto;
}

/* Video slide (7 Oct 2026): the deferred-media wrapper gets its width from JS
   (sizeVideoSlide, from the aspect in its padding-top); the poster, the play button
   and the loaded <video> fill that box; the poster hides once loaded (Dawn). */
product-modal .product-media-modal__content deferred-media.nk-lightbox-active {
  position: relative;
  max-width: 92vw;
  max-height: 90vh;
  overflow: hidden;
  cursor: default;
}
product-modal .product-media-modal__content deferred-media.nk-lightbox-active .deferred-media__poster {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
}
product-modal .product-media-modal__content deferred-media.nk-lightbox-active .deferred-media__poster img,
product-modal .product-media-modal__content deferred-media.nk-lightbox-active video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: contain;
  cursor: default;
}
product-modal .product-media-modal__content deferred-media.nk-lightbox-active[loaded] .deferred-media__poster {
  display: none;
}
product-modal .product-media-modal__content [data-media-id].nk-lightbox-active img {
  max-width: 92vw;
  max-height: 90vh;
  width: auto;
  height: auto;
  object-fit: contain;
}

.nk-lightbox__nav {
  position: absolute;
  z-index: 5;
  width: 4.4rem;
  height: 4.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: var(--nk-ink);
  border: 2px solid var(--nk-ink);
  border-radius: 999px;
  font-size: 1.8rem;
  cursor: pointer;
  box-shadow: 3px 3px 0 var(--nk-a2);
}

.nk-lightbox__nav:hover {
  background: var(--nk-a1);
  color: #fff;
}

/* left/top set by JS, anchored to the displayed image */

.nk-lightbox__counter {
  position: absolute;
  transform: translateX(-50%);
  z-index: 5;
  background: #fff;
  color: var(--nk-ink);
  border: 2px solid var(--nk-ink);
  border-radius: 999px;
  font-family: var(--nk-font-display);
  font-weight: 600;
  font-size: 1.3rem;
  padding: 0.4rem 1.4rem;
}

product-modal .product-media-modal__toggle {
  z-index: 6;
  width: 4.4rem;
  height: 4.4rem;
  border: 2px solid var(--nk-ink);
  border-radius: 999px;
  box-shadow: 3px 3px 0 var(--nk-a2);
}

/* ---------- Lightbox zoom ---------- */
.nk-lightbox__zoom {
  position: absolute;
  transform: translateX(-50%);
  z-index: 5;
  width: 3.2rem;
  height: 3.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: var(--nk-ink);
  border: 2px solid var(--nk-ink);
  border-radius: 999px;
  font-size: 1.8rem;
  line-height: 1;
  cursor: pointer;
  box-shadow: 3px 3px 0 var(--nk-a2);
}

/* hidden on video/model slides (the class's display:flex would otherwise beat [hidden]) */
.nk-lightbox__zoom[hidden] {
  display: none;
}

.nk-lightbox__zoom:hover {
  background: var(--nk-a1);
  color: #fff;
}

product-modal .nk-lightbox-active,
product-modal .nk-lightbox-active img {
  cursor: zoom-in;
}

product-modal.nk-zoomed .nk-lightbox-active,
product-modal.nk-zoomed .nk-lightbox-active img {
  cursor: zoom-out;
}

/* pan owns the gestures while zoomed */
product-modal.nk-zoomed .nk-lightbox__nav {
  display: none;
}

product-modal .product-media-modal__content {
  touch-action: pan-y;
}

product-modal.nk-zoomed .product-media-modal__content {
  touch-action: none;
  overflow: hidden;
}

/* ---------------------------------------------------------------------
   PDP conversion pass (2026-08): COD/shipping pills, trust checklist,
   mobile sticky add-to-cart bar, cart-drawer free-shipping note.
   --------------------------------------------------------------------- */

.nk-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin: 0.8rem 0 0.2rem;
}
.nk-pill {
  font-size: 1.1rem;
  letter-spacing: 0.04em;
  line-height: 1;
  padding: 0.45rem 1rem;
  border-radius: 999px;
  border: 1px solid;
  font-weight: 600;
  white-space: nowrap;
}
.nk-pill--jade {
  color: #0f766e;
  border-color: #0f766e;
  background: rgba(15, 118, 110, 0.07);
}
.nk-pill--gold {
  color: #8a6117;
  border-color: #c9a227;
  background: rgba(201, 162, 39, 0.1);
}

.nk-trust {
  margin: 1.2rem 0 0;
  padding: 0;
  list-style: none;
}
.nk-trust li {
  position: relative;
  padding-left: 2.1rem;
  margin-bottom: 0.45rem;
  font-size: 1.25rem;
  line-height: 1.45;
  color: var(--nk-ink, #26060f);
}
.nk-trust li::before {
  content: '\2713';
  position: absolute;
  left: 0;
  top: 0;
  color: #0f766e;
  font-weight: 700;
}
/* Delivery expectation (Audit 1, P0-3): factual, quiet — no tick, muted ink,
   one size down; sits last in the trust list so it stays near the buttons. */
.nk-trust li.nk-trust__delivery {
  color: rgba(38, 6, 15, 0.72);
  font-size: 1.15rem;
  margin-top: 0.15rem;
}
.nk-trust li.nk-trust__delivery::before {
  content: '';
}

/* Sticky bar: rendered on all breakpoints, displayed only on mobile.
   z-index 5 keeps it under quick-add/media modals (101) and the cart
   drawer (1000). Hidden state is translateY(100%) so the show/hide
   transition works without display toggling. */
.nk-sticky-atc {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 5;
  display: none;
  align-items: center;
  gap: 1.2rem;
  padding: 0.8rem 1.4rem calc(0.8rem + env(safe-area-inset-bottom, 0px));
  background: var(--nk-bg, #fffdf8);
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
  transform: translateY(110%);
  transition: transform 0.25s ease;
}
.nk-sticky-atc--visible {
  transform: translateY(0);
}
.nk-sticky-atc__price {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
  flex-shrink: 0;
}
.nk-sticky-atc__price s {
  color: rgba(0, 0, 0, 0.45);
  font-size: 1.15rem;
}
.nk-sticky-atc__price span {
  font-weight: 700;
  font-size: 1.45rem;
  color: var(--nk-ink, #26060f);
}
/* One CTA system: the sticky buttons are the inline buttons, typographically
   a notch more compact (1.4rem vs 1.5rem) — same face, weight, colour,
   border and radius logic; ≥44px tall. Inline is the source of truth. */
.nk-sticky-atc__btn {
  flex: 1 1 0;
  min-height: 4.4rem;
  border-radius: 999px;
  font-family: var(--nk-font-display);
  font-size: 1.4rem;
  letter-spacing: 0.02em;
  line-height: 1.2;
  padding: 0 0.8rem;
  white-space: nowrap;
  cursor: pointer;
  border: 2px solid var(--nk-ink, #26060f);
}
.nk-sticky-atc__btn--atc {
  background: rgb(var(--color-background));
  color: rgb(var(--color-foreground));
  font-weight: 600;
}
.nk-sticky-atc__btn--buynow {
  background: rgb(var(--color-button));
  color: rgb(var(--color-button-text));
  font-weight: 500;
}
.nk-sticky-atc__btn:focus-visible {
  outline: 2px solid var(--nk-a1);
  outline-offset: 2px;
}
@media screen and (max-width: 749px) {
  .nk-sticky-atc {
    display: flex;
  }
  /* Real-phone bug (15 Sep 2026): the bar lives inside the product form (OCC needs
     closest("form")), and the form sits in Dawn's reveal wrapper
     .product__info-wrapper.scroll-trigger.animate--slide-in, whose slideIn keyframes end on
     transform: translateY(0) with fill-mode forwards. A transformed ancestor becomes the
     containing block for position:fixed, so the bar scrolled away with the page (reproduced on
     WebKit iPhone and Chromium Android; hidden under prefers-reduced-motion, which is why the
     headless probes passed). !important beats the animation's transform, so the wrapper keeps
     its fade but never carries a transform — fixed anchors to the viewport again. */
  .product__info-wrapper.scroll-trigger.animate--slide-in {
    /* Chromium keeps the wrapper as the containing block for as long as a transform
       animation is attached to it, even with the transform overridden — so the reveal
       must be a transform-free animation here: Dawn's own fadeIn (opacity only). */
    animation-name: fadeIn !important;
    transform: none !important;
  }
}

.nk-drawer-ship {
  font-weight: 600;
  color: #0f766e;
}

.nk-drawer-trust {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1.2rem;
  justify-content: center;
  margin-top: 0.8rem;
  font-size: 1.15rem;
  color: var(--nk-ink, #26060f);
}
.nk-drawer-trust .nk-tick {
  color: #126678;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1;
}
.nk-drawer-continue {
  display: block;
  text-align: center;
  margin-top: 0.8rem;
  font-size: 1.2rem;
  color: var(--nk-ink, #26060f);
  text-decoration: underline;
  text-underline-offset: 0.3rem;
}

/* Monoline trust icons (Aug 2026): 15px, currentColor, inherit text colour. */
.nk-ico {
  width: 15px;
  height: 15px;
  flex: none;
  display: inline-block;
  vertical-align: -0.2rem;
  margin-right: 0.5rem;
}
.nk-claim {
  white-space: nowrap;
  margin-right: 0.8rem;
}
.nk-pill {
  display: inline-flex;
  align-items: center;
}
.nk-pill .nk-ico {
  margin-right: 0.45rem;
}
/* At very narrow widths the icons drop before the text does. */
@media screen and (max-width: 360px) {
  .nk-pill .nk-ico,
  .nk-claim .nk-ico {
    display: none;
  }
  .nk-claim {
    white-space: normal;
  }
}

/* ---- Factual descriptor line (settings.nk_descriptor_enabled) ----
   "{fabric} · {craft}" under every product title; PDP adds " · size".
   Muted, one line on cards (ellipsis), never wraps. */
.nk-descriptor{display:block;margin:.2rem 0 0;font-size:1.2rem;line-height:1.35;letter-spacing:.01em;color:rgba(var(--color-foreground),.62)}
.card__information .nk-descriptor{white-space:normal;max-width:100%;font-size:1.1rem;margin-top:.15rem}
.nk-descriptor--pdp{font-size:1.4rem;margin:.6rem 0 0;color:rgba(var(--color-foreground),.7)}
.predictive-search__item-content .nk-descriptor{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:1.1rem;margin-top:.1rem}
.cart-item__title{flex-wrap:wrap}
.cart-item__title .nk-descriptor{flex-basis:100%;width:100%;font-size:1.1rem;margin:.2rem 0 0;white-space:normal}
@media screen and (max-width:749px){.nk-descriptor--pdp{font-size:1.3rem;margin-top:.4rem}}

/* ---- Colour family swatches (settings.nk_colour_family_enabled) ---- */
.nk-family{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin:.35rem 0 0;min-width:0;max-width:100%}
.nk-family__swatch{display:inline-block;width:2.8rem;height:2.8rem;border-radius:50%;overflow:hidden;border:2px solid transparent;box-shadow:0 0 0 1px rgba(var(--color-foreground),.18);background:rgba(var(--color-foreground),.06);flex:0 0 auto}
.nk-family__swatch img,.nk-family__swatch .nk-family__dot{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}
.nk-family__swatch--current{border-color:rgb(var(--color-foreground));box-shadow:0 0 0 1px rgb(var(--color-background))}
a.nk-family__swatch:hover,a.nk-family__swatch:focus-visible{border-color:rgba(var(--color-foreground),.55)}
.nk-family__more{font-size:1.1rem;color:rgba(var(--color-foreground),.62);margin-left:.1rem}
.nk-family--sm{gap:.3rem;margin-top:.3rem}
.nk-family--sm .nk-family__swatch{width:2rem;height:2rem;border-width:1.5px}
.nk-family--md .nk-family__swatch{width:3.4rem;height:3.4rem}
.card__information .nk-family{justify-content:flex-start}

/* ---- Mobile PDP v2 (settings.nk_pdp_v2) ----
   Order on mobile: breadcrumb → media (edge-to-edge, 3:4, dots) → hook →
   title → descriptor → price → buttons → rest. Desktop only gains the
   breadcrumb and the hook. Body text ≥15px, tap targets ≥44px. */
.nk-breadcrumb{margin:0 0 .8rem;font-size:1.5rem;line-height:1.3;color:rgba(var(--color-foreground),.72)}
.nk-breadcrumb__list{list-style:none;margin:0;padding:0;display:flex;align-items:baseline;column-gap:.6rem;white-space:nowrap;min-width:0}
.nk-breadcrumb__list li{overflow:hidden;text-overflow:ellipsis}
.nk-breadcrumb__col{flex:0 1 auto;min-width:8ch;max-width:55%}
.nk-breadcrumb__sep{flex:0 0 auto;opacity:.7}
.nk-breadcrumb__cur{flex:1 1 auto;min-width:0}
.nk-breadcrumb a{color:inherit;text-decoration:none;padding:1.2rem 0;margin:-1.2rem 0;display:inline-block}
.nk-breadcrumb a:hover,.nk-breadcrumb a:focus-visible{text-decoration:underline}
.nk-hook,.product__title .nk-hook{font-family:'Fraunces',Georgia,'Times New Roman',serif;font-style:italic;font-weight:300;font-size:2.1rem;line-height:1.3;letter-spacing:0;margin:0 0 var(--nk-s1);color:rgb(var(--color-foreground))}
.nk-gdots{display:none}
@media screen and (max-width: 749px){
  .nk-pdp-v2 .product__text.caption-with-letter-spacing{display:none}
  .nk-pdp-v2 .product__info-wrapper{padding-top:0}
  .nk-pdp-v2 .product__info-container{display:flex;flex-direction:column}
  /* one rhythm: Dawn's `> * + *` 1.5rem is reset here and every child gets a token margin below (8/12/16/24) */
  .nk-pdp-v2 .product__info-container>*{order:20;margin-top:0;margin-bottom:0}
  /* Visual order == DOM order (title, story, reviews, price, pills, tax,
     variants, quantity, buttons, reassurance, Product Truth, description,
     copy). Only the media/breadcrumb move around the info column. */
  .nk-pdp-v2 .product__info-container>.product__title{order:1;margin-top:.4rem}
  .nk-pdp-v2 .product__info-container>.nk-product-story{order:2;margin-top:var(--nk-s2)}
  .nk-pdp-v2 .product__info-container>div:has(.jdgm-widget,.jdgm-prev-badge){order:3;margin-top:var(--nk-s2)}
  .nk-pdp-v2 .product__info-container>[id^="price-"]{order:4;margin-top:var(--nk-s4)}
  .nk-pdp-v2 .product__info-container>.nk-pill-row{order:5;margin:var(--nk-s1) 0 0}
  .nk-pdp-v2 .product__info-container>.product__tax{order:6;margin:var(--nk-s1) 0 0}
  .nk-pdp-v2 .product__info-container>variant-selects,.nk-pdp-v2 .product__info-container>.product-form__input--dropdown{order:7;margin:var(--nk-s3) 0 0}
  .nk-pdp-v2 .product__info-container>.product-form__quantity{order:8;margin:var(--nk-s3) 0 var(--nk-s1)}
  .nk-pdp-v2 .product__info-container>div:has(product-form){order:9;margin-top:0}
  .nk-pdp-v2 .product__info-container>.nk-buy-trust,.nk-pdp-v2 .product__info-container>.nk-trust{order:10;margin:var(--nk-s2) 0 0}
  /* 15 Sep 2026 hierarchy: CTAs + trust → Same suit. Different story. (only with a pair) → Product Truth → description → copy */
  .nk-pdp-v2 .product__info-container>.nk-transform{order:11;margin:var(--nk-s4) 0 0}
  .nk-pdp-v2 .product__info-container>.nk-truth{order:12;margin:var(--nk-s4) 0 var(--nk-s3)}
  .nk-pdp-v2 .product__info-container>.product__description{order:13;margin-top:var(--nk-s1);margin-bottom:0}
  .nk-pdp-v2 .product__info-container>.nk-copy{order:14;margin-top:var(--nk-s4)}
  .nk-pdp-v2 .product__info-container>.share-button,.nk-pdp-v2 .product__info-container>.product__view-details{margin-top:var(--nk-s4)}
  /* quantity belongs to the buttons: Dawn's product-form carries 2.5rem margins top and bottom — dropped, the token margins on the neighbours do the spacing */
  .nk-pdp-v2 .product__info-container>div>product-form.product-form{margin:0}
  /* quantity belongs to the buttons: label tight, no gap below the stepper */
  .nk-pdp-v2 .product-form__quantity .form__label{margin-bottom:.4rem}
  .nk-pdp-v2 .product-form__quantity .quantity{margin-bottom:0}
  .nk-pdp-v2 .product-form__buttons .product-form__submit{margin-bottom:var(--nk-s1)}
  /* compact reassurance under the buttons: same three facts, tighter type */
  .nk-pdp-v2 .nk-trust li{font-size:1.2rem;line-height:1.4;margin-bottom:.2rem;padding-left:1.8rem}
  .nk-pdp-v2 .product__title h1{font-size:2.6rem;line-height:1.15;margin:0 0 .3rem}
  .nk-pdp-v2 .nk-descriptor--pdp{font-size:1.5rem;margin:.3rem 0 0;color:rgba(var(--color-foreground),.72)}
  .nk-pdp-v2 .nk-family--md{margin-top:.6rem}
  .nk-pdp-v2 .nk-family--md .nk-family__swatch{width:4.4rem;height:4.4rem}
  /* media: edge-to-edge minus 8px gutters, 3:4 frame, no crop */
  .nk-pdp-v2 .product__media-wrapper slider-component:not(.thumbnail-slider--no-slide){margin-left:-1.5rem;margin-right:-1.5rem}
  .nk-pdp-v2 .product__media-list{margin-left:0;width:100%;margin-bottom:.4rem;padding:0 .8rem;box-sizing:border-box;column-gap:.8rem}
  /* Snap alignment must match the 8px gutter: Dawn's .slider.slider--mobile
     sets scroll-padding-left 1.5rem (wins at equal specificity, later
     stylesheet) — every slide after the first was landing 15px in. Same
     selector depth + class here; Dawn's trailing :after spacer dropped. */
  .nk-pdp-v2 .product__media-list.slider--mobile{scroll-padding-left:.8rem;scroll-padding-right:.8rem;scroll-snap-type:x mandatory}
  .nk-pdp-v2 .product__media-list.slider--mobile:after{content:none;padding-left:0;width:0}
  .nk-pdp-v2 .product__media-list .product__media-item{scroll-snap-align:start}
  .nk-pdp-v2 .product__media-list .product__media-item{width:100%;padding:0;margin-left:0}
  .nk-pdp-v2 .product__media-list .product__media-item:first-child{margin-left:0}
  /* 3:4 frame that fills the slide: Dawn's constrain_to_viewport caps the
     container width from the viewport height — lift that cap on mobile. */
  .nk-pdp-v2 .product__media-item .product-media-container{--ratio:0.75 !important;--preview-ratio:0.75 !important;--constrained-height:9999px;width:100%;max-width:100%;margin:0;background:rgb(var(--color-background));border-width:0}
  .nk-pdp-v2 .product__media-item .product-media-container.constrain-height.media-fit-contain{max-width:100%}
  .nk-pdp-v2 .product__media-item .product-media-container.media-fit-contain .media img,
  .nk-pdp-v2 .product__media-item .product-media-container.media-fit-contain .media>*{object-fit:contain}
  .nk-pdp-v2 .product__media-wrapper .slider-buttons{display:none}
  .nk-gdots{display:flex;justify-content:center;gap:0;margin:0 0 .8rem}
  .nk-gdots__dot{width:4.4rem;height:4.4rem;padding:0;border:0;background:transparent;display:grid;place-items:center;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .nk-gdots__dot::before{content:"";width:.7rem;height:.7rem;border-radius:50%;background:rgba(var(--color-foreground),.28);transition:transform .15s,background .15s}
  .nk-gdots__dot.is-active::before{background:rgb(var(--color-foreground));transform:scale(1.35)}
  .nk-gdots[hidden]{display:none}
  /* Thumbnail layout (7 Oct 2026): the swipe carousel stays (this gallery never drops
     slider--mobile), a 5-up thumbnail strip sits under it, the overlay dots retire
     while the strip is on, and the strip keeps the page gutters (only the viewer
     bleeds to the 8px gutter). */
  .nk-pdp-v2 .product__media-wrapper .thumbnail-slider{margin-left:0;margin-right:0}
  .product--mobile-show .thumbnail-slider .thumbnail-list.slider.slider--tablet-up{padding:.4rem 0 .2rem}
  .product--mobile-show .nk-gdots{display:none}
  .product--mobile-show .thumbnail-slider .slider-button{display:none}
  .product--mobile-show .thumbnail-slider .thumbnail-list.slider{padding:.4rem 0 .2rem;gap:.8rem;scroll-padding-left:0}
  .product--mobile-show .thumbnail-list__item.slider__slide{width:calc(20% - .64rem)}
  /* 3:4 thumbs on mobile (creative owner, 7 Oct 2026) — Dawn's item is square */
  .product--mobile-show .thumbnail-list__item::before{padding-bottom:133.333%}
}

/* ---- Compact PDP chrome on mobile (body.nk-pdp-compact = nk_pdp_v2 on a
   product page). Four independent levers, each a block below — delete a
   block to drop that lever. Homepage header untouched (scoped by body class). */
@media screen and (max-width: 749px){
  /* L1 announcement bar: hidden on product pages (its free-shipping line is
     repeated by the COD/shipping pills under the price). ~61px */
  .nk-pdp-compact .section-nakhrey-announcement{display:none}
  /* L2 header: logo capped at 44px tall, header padding tightened. ~70px */
  .nk-pdp-compact .header{padding-top:.4rem;padding-bottom:.4rem}
  .nk-pdp-compact .header__heading-logo-wrapper{width:auto}
  .nk-pdp-compact .header__heading-logo{max-height:4.4rem;width:auto;height:auto}
  /* L3 gallery dots overlay the bottom of the 3:4 frame instead of taking a row. ~52px */
  .nk-pdp-compact .nk-gdots{position:relative;margin-top:-4.6rem;margin-bottom:.2rem;z-index:2;pointer-events:none}
  .nk-pdp-compact .nk-gdots__dot{pointer-events:auto}
  .nk-pdp-compact .nk-gdots__dot::before{background:rgba(255,255,255,.75);box-shadow:0 0 0 1px rgba(0,0,0,.25)}
  .nk-pdp-compact .nk-gdots__dot.is-active::before{background:rgb(var(--color-foreground));box-shadow:0 0 0 2px rgba(255,255,255,.9)}
  /* L4 product section top padding 27px → 8px. ~19px */
  .nk-pdp-compact section[class*="__main-padding"]{padding-top:.8rem}
}

/* ---- Product Truth (settings.nk_product_truth) ----
   Ivory surface, hairline dividers, no fills, no pills. Labels muted at
   the descriptor's 72%; values darker. Body ≥15px; 44px toggle. */
.nk-truth{margin:2rem 0 1.6rem;padding:1.4rem 1.6rem .4rem;background:rgba(var(--color-foreground),.035);border:1px solid rgba(var(--color-foreground),.12);border-radius:14px;max-width:56rem}
.nk-truth__title{font-family:var(--nk-font-display,var(--font-heading-family));font-size:1.7rem;font-weight:500;letter-spacing:.01em;margin:0 0 1rem;color:rgb(var(--color-foreground))}
.nk-truth__grid{display:grid;grid-template-columns:1fr 1fr;gap:0;margin:0;padding:0;border-top:1px solid rgba(var(--color-foreground),.12)}
.nk-truth__grid--1{grid-template-columns:1fr}
.nk-truth__cell{padding:1.1rem 1rem 1.1rem 0;border-bottom:1px solid rgba(var(--color-foreground),.12);min-width:0}
.nk-truth__cell:nth-child(odd){padding-right:1.2rem;border-right:1px solid rgba(var(--color-foreground),.12)}
.nk-truth__cell:nth-child(even){padding-left:1.2rem}
.nk-truth__grid--1 .nk-truth__cell:nth-child(odd){border-right:0;padding-right:0}
.nk-truth__cell:last-child:nth-child(odd){border-right:0}
.nk-truth__grid:last-child .nk-truth__cell:last-child,.nk-truth__grid:last-child .nk-truth__cell:nth-last-child(2):nth-child(odd){border-bottom:0}
.nk-truth__label{display:flex;align-items:center;gap:.5rem;margin:0 0 .3rem;font-size:1.3rem;letter-spacing:.02em;text-transform:none;color:rgba(var(--color-foreground),.72)}
.nk-truth__label .nk-ico{width:1.6rem;height:1.6rem;flex:0 0 auto;stroke-width:1.5}
.nk-truth__value{margin:0;font-size:1.5rem;line-height:1.35;color:rgb(var(--color-foreground));overflow-wrap:anywhere}
.nk-truth__more{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:4.4rem;margin:0;padding:.6rem 0;background:none;border:0;border-bottom:1px solid transparent;font:inherit;font-size:1.5rem;color:rgb(var(--color-foreground));cursor:pointer;text-align:left}
.nk-truth__more:focus-visible{outline:2px solid rgb(var(--color-foreground));outline-offset:2px;border-radius:4px}
.nk-truth__chev{width:1.8rem;height:1.8rem;transition:transform .2s}
.nk-truth__more[aria-expanded="true"] .nk-truth__chev{transform:rotate(180deg)}
.nk-truth__more-panel{margin:0 0 .6rem;padding:0;border-top:1px solid rgba(var(--color-foreground),.12)}
.nk-truth__row{display:grid;grid-template-columns:11rem 1fr;gap:1rem;align-items:start;padding:1rem 0;border-bottom:1px solid rgba(var(--color-foreground),.08)}
.nk-truth__row:last-child{border-bottom:0}
.nk-truth__row .nk-truth__label{margin:0}
/* PDP copy sections (nk_pdp_copy): why special / style it with / best for — typography only, no cards */
.nk-copy{margin:2.4rem 0 0;max-width:56rem}
.nk-copy__h{margin:2rem 0 .6rem;font-weight:500;letter-spacing:.01em;color:rgb(var(--color-foreground))}
.nk-copy__h:first-child{margin-top:0}
.nk-copy__list{margin:0;padding:0 0 0 1.8rem;list-style:disc;font-size:1.5rem;line-height:1.5;color:rgb(var(--color-foreground))}
.nk-copy__list li{margin:0 0 .4rem;padding-left:.2rem}
.nk-copy__list li::marker{color:rgba(var(--color-foreground),.45)}
.nk-copy__inline{margin:0;font-size:1.5rem;line-height:1.6;color:rgb(var(--color-foreground))}
.nk-copy__inline span{white-space:nowrap}
.nk-copy__inline span:not(:last-child)::after{content:'·';display:inline-block;margin:0 .7rem;color:rgba(var(--color-foreground),.4)}
@media screen and (max-width: 749px){
}
/* Desktop gallery is a grid, not a slider: Dawn's prev/next + counter under it read "NaN / -Infinity" — hide unless the list is a tablet-up slider */
@media screen and (min-width: 750px){.product__media-wrapper .product__media-list:not(.slider--tablet-up)~.slider-buttons{display:none}}
@media screen and (max-width: 749px){
  .nk-truth{margin:1.6rem 0 1.2rem;padding:1.2rem 1.4rem .3rem}
}
@media screen and (min-width: 750px){
  .nk-truth{padding:1.6rem 2rem .6rem}
}

/* ---- Gallery zoom control (one control, keyboard-reachable). Dawn's toggle
   was a 0×0 button whose ::after covered the image; the button itself now
   covers the image (≥44×44 everywhere) and carries the visible zoom icon. */
.product__modal-opener .product__media-toggle{position:absolute;inset:0;width:100%;height:100%;z-index:2;display:block;cursor:zoom-in;border-radius:var(--media-radius,0)}
.product__modal-opener .product__media-toggle::after{content:none}
.product__modal-opener .product__media-toggle .product__media-icon{opacity:1;width:4.4rem;height:4.4rem;left:auto;right:1.2rem;top:auto;bottom:1.2rem;pointer-events:none;box-shadow:0 1px 3px rgba(0,0,0,.18)}
.product__modal-opener .product__media-toggle .product__media-icon .icon{width:1.6rem;height:1.8rem}
.product__modal-opener .product__media-toggle:focus-visible{outline:3px solid var(--nk-a1);outline-offset:-4px;box-shadow:none}
.product__modal-opener .product__media-toggle.focused{outline:3px solid var(--nk-a1);outline-offset:-4px}
@media screen and (min-width: 750px){
  .product__modal-opener .product__media-toggle .product__media-icon{opacity:.85}
  .product__modal-opener:hover .product__media-toggle .product__media-icon,.product__modal-opener .product__media-toggle:focus-visible .product__media-icon{opacity:1}
}

/* ---- Desktop rebalance (≥990): ~60/40 media/info on the 1200 page width →
   info wrapper 440 with a 2rem gutter ≈ 420 usable; H1 on the heading
   token at 3.4rem (34px) with a matching 1.15 line-height. */
@media screen and (min-width: 990px){
  .product.product--large:not(.product--no-media) .product__media-wrapper{max-width:60%;width:calc(60% - var(--grid-desktop-horizontal-spacing) / 2)}
  .product.product--large:not(.product--no-media) .product__info-wrapper{max-width:40%;width:calc(40% - var(--grid-desktop-horizontal-spacing) / 2);padding-left:2rem}
  .product__title h1{font-size:calc(var(--font-heading-scale) * 3.4rem);line-height:1.15}
}

/* ---- PDP gallery, Dawn thumbnail_slider layout (7 Oct 2026, creative owner:
   templates/product.json gallery_layout "thumbnail_slider" + mobile_thumbnails "show"):
   desktop = one main image at the full media-column width, horizontal thumbnail strip
   below it (Dawn slider--tablet-up, 5 visible, prev/next when there are more). The
   earlier left rail is gone. Only the strip's gap to the image is ours. */
@media screen and (min-width: 990px){
  .product--thumbnail_slider .product__media-wrapper .thumbnail-slider{margin-top:.8rem}
}
}

/* Purchase cluster (all breakpoints): quantity sits on the buttons; Dawn's 2.5rem product-form margins and the 1.5rem sibling gap above the buttons retired */
.product__info-container>div>product-form.product-form{margin:0}
.product__info-container>.product-form__quantity{margin-bottom:var(--nk-s2)}
.product__info-container>div:has(product-form){margin-top:0}

/* ── Homepage opening flow (9 Sep 2026) ─────────────────────────────────────
   Compact commerce reuses featured-collection + the shared product card; the
   rules below are scoped to the homepage instance by its section id suffix, so
   no other featured-collection instance is touched. */
/* #MainContent anchors these rules with an id: a section's own stylesheet is emitted in the
   body, after this file, so class-only overrides would lose on source order. */
#MainContent [id$="__compact_commerce"] .collection__title{margin-bottom:var(--nk-s1)}
#MainContent [id$="__compact_commerce"] .collection__view-all{margin-top:var(--nk-s1)}
#MainContent [id$="__compact_commerce"] .collection__view-all .button{min-height:44px}
/* the card's price block reserves its own height (Audit 2) — the extra 36px above it is
   what pushes this compact row past its height budget, so only the gap is trimmed here */
#MainContent [id$="__compact_commerce"] .card__information .card-information{margin-top:var(--nk-s1)}
/* Dawn's peek slider sets .slider--tablet.grid--peek .grid__item{box-sizing:content-box}; the
   card and its content column pick that up here, so their border and 14px side padding are
   added OUTSIDE the card's width — the title and the Add to cart button then cross the card
   border. Restoring border-box for this row keeps every child inside the card's padding, and
   the button spans the card's inner width exactly. The collection grid is not in a peek
   slider, so it never had this and is not touched. */
#MainContent [id$="__compact_commerce"] .card,
#MainContent [id$="__compact_commerce"] .card-wrapper,
#MainContent [id$="__compact_commerce"] .card__content,
#MainContent [id$="__compact_commerce"] .card__information,
#MainContent [id$="__compact_commerce"] .quick-add,
#MainContent [id$="__compact_commerce"] .quick-add__submit{box-sizing:border-box;min-width:0;max-width:100%}
#MainContent [id$="__compact_commerce"] .quick-add__submit{width:100%}
#MainContent [id$="__compact_commerce"] .card__heading,
#MainContent [id$="__compact_commerce"] .nk-descriptor{min-width:0;max-width:100%;overflow-wrap:break-word}

/* The swatch row is what threw the price line out of level: family cards carry it, plain
   cards do not. Here it is pinned to a single 44px line (scrolling sideways on the narrowest
   cards rather than wrapping, so the 44px targets survive)... */
#MainContent [id$="__compact_commerce"] .nk-family{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
#MainContent [id$="__compact_commerce"] .nk-family::-webkit-scrollbar{display:none}
/* ...and reserved on the cards that have no family, so price and Add to cart
   sit on the same line across the row — the fixed-row approach already used for the name and
   the descriptor. 32px is the row's own contribution: 44px tall, less its -6px/-6px margins. */
#MainContent [id$="__compact_commerce"] .card__information{--nk-family-row:32px}
#MainContent [id$="__compact_commerce"] .card__information:not(:has(.nk-family)) .card-information{margin-top:calc(var(--nk-s1) + var(--nk-family-row))}

/* modest padding trims inside the card, this instance only, all widths */
#MainContent [id$="__compact_commerce"] .card__content{padding-top:var(--nk-s1);padding-bottom:var(--nk-s1)}
#MainContent [id$="__compact_commerce"] .card__information{padding-top:var(--nk-s1);padding-bottom:var(--nk-s1)}
@media screen and (max-width:749px){
  /* one manual-scroll row, roughly two cards in view; Dawn's peek does the rest */
  #MainContent [id$="__compact_commerce"] .slider--tablet{scroll-snap-type:x mandatory}
  #MainContent [id$="__compact_commerce"] .slider__slide{scroll-snap-align:start}
  /* No prev/next control block on mobile: the row is a native scroll container with snap and a
     peeking third card, and the 44px control strip is what pushed the section past its height
     budget. Swipe, keyboard Tab (each card scrolls into view) and trackpad all still work. */
  #MainContent [id$="__compact_commerce"] .slider-buttons{display:none}
}

/* "Same suit. Different story." — the same pair renders on the homepage module and on the
   product page (after Best for). Both frames on screen together at every width,
   no slider, no drag. 3:4 frames matching the product cards. */
.nk-transform__title{margin:0 0 var(--nk-s1)}
.nk-transform__subline{margin:0 0 var(--nk-s3);max-width:46ch}
.nk-transform__pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:352px}
.nk-transform__item{margin:0;min-width:0}
.nk-transform__frame{aspect-ratio:3/4;overflow:hidden;background:var(--nk-bg);border-radius:2px}
.nk-transform__frame img{width:100%;height:100%;object-fit:cover;display:block}
.nk-transform__label{margin-top:var(--nk-s1);font-size:1.3rem;line-height:1.3}
.nk-transform__cta{margin-top:var(--nk-s3)}
/* on the product page the pair is one more copy section, spaced like its siblings */
.product__info-container .nk-transform{margin-top:var(--nk-s4)}
.product__info-container .nk-transform__pair{max-width:352px}
.nk-transform__cta .button{min-height:44px}
@media screen and (min-width:990px){
  /* the pair stays a constrained, centred object rather than stretching the page */
  .nk-transform__pair{max-width:632px;gap:12px;margin-inline:auto}
  .nk-transform__title,.nk-transform__subline,.nk-transform__cta{text-align:center}
  .nk-transform__subline{margin-inline:auto}
}

/* ── Final closure pass (9 Sep 2026) ─────────────────────────────────────────
   Accessibility and typography fixes from the site-wide audit. Every touch-target
   fix enlarges the HIT AREA, never the decorative mark: the arrows, dots, links and
   openers look exactly as they did. */

/* P1-1 hero controls — arrows were 40px, dots 10px. */
.nk-arrow{width:4.4rem;height:4.4rem}

/* Hero pagination dots: the BUTTON itself is the 44px target and the small visible dot
   is drawn inside it, so every target is its own box with nothing to overlap.
   The first attempt kept 10px buttons and painted a 44px pseudo-element over each one.
   Those overlays sat 10px apart and so covered their neighbours by 34px; the topmost
   overlay swallowed the clicks and a tap on one dot moved the rotator to another slide.
   Only the hero group is styled here — the three-ways and fan-mail rotators share the
   .nk-dots class and are deliberately left exactly as they were. */
/* the dot group is wider now that each target is 44px, so the arrows must not be
   squeezed by the flex row at 320 — they measured 41px without this */
.nk-hero__controls .nk-arrow{flex:0 0 auto}
.nk-hero__controls .nk-dots{gap:0;flex:0 1 auto}
.nk-hero__controls .nk-dots button{
  width:4.4rem;height:4.4rem;
  padding:0;border:0;border-radius:0;background:transparent;
  display:inline-flex;align-items:center;justify-content:center;
}
.nk-hero__controls .nk-dots button::before{
  content:'';display:block;
  width:1rem;height:1rem;border-radius:999px;
  border:2px solid var(--nk-ink);
  background:transparent;
  transition:width .2s ease,background .2s ease;
}
/* the active pill is the inner mark, unchanged at 26x10; the target stays 44 wide */
.nk-hero__controls .nk-dots button[aria-current='true']{width:4.4rem}
.nk-hero__controls .nk-dots button[aria-current='true']::before{
  width:2.6rem;background:var(--nk-a1);border-color:var(--nk-ink);
}
.nk-hero__controls .nk-dots button:focus-visible{outline:2px solid var(--nk-a1);outline-offset:-6px}
@media (prefers-reduced-motion: reduce){
  .nk-hero__controls .nk-dots button::before{transition:none}
}
/* Narrow phones (14 Sep 2026): with five slides the row is 44+16+220+16+44 = 340px,
   wider than the 290px content box at 320 — the next arrow sat at 286–330 (four slides
   already squeezed the dots at 320). Tap targets stay 44px, so the fix wraps instead of
   shrinking: at ≤360px the dot group always takes its own full-width row and the two
   arrows centre on the row below (+48px of hero at that width). The dot group itself may
   wrap for 7+ slides. Above 360px the single row is unchanged. */
@media screen and (max-width: 360px){
  .nk-hero__controls{flex-wrap:wrap;row-gap:0.4rem}
  .nk-hero__controls .nk-dots{order:-1;flex:1 0 100%;flex-wrap:wrap;justify-content:center;min-width:0}
}
/* 361–449px: the single row holds five dots (44+16+220+16+44 = 340 ≤ 360 content at 390);
   a sixth dot overflows (384px), so from six dots up the same two-row layout applies.
   :has() is a progressive enhancement — without it the row behaves as before. */
@media screen and (min-width: 361px) and (max-width: 449px){
  .nk-hero__controls:has(.nk-dots button:nth-child(6)){flex-wrap:wrap;row-gap:0.4rem}
  .nk-hero__controls:has(.nk-dots button:nth-child(6)) .nk-dots{order:-1;flex:1 0 100%;flex-wrap:wrap;justify-content:center;min-width:0}
}

/* P1-2 filter & sort opener — the summary was ~30px tall. */
.mobile-facets__open-wrapper{display:block}
.mobile-facets__open{min-height:4.4rem;display:inline-flex;align-items:center;gap:.6rem}

/* P1-4 supporting text — 11px descriptors and a ~10px tax line are too small for
   this buyer. One shared step up, not per-surface styling. */
.nk-descriptor,
.card__information .nk-descriptor,
.predictive-search__item-content .nk-descriptor{font-size:1.3rem;line-height:1.4}
.product__tax,
.product__tax.caption{font-size:1.28rem;line-height:1.5}
/* the shipping-policy link needs a real target without opening a visual gap */
.product__tax a{display:inline-flex;align-items:center;min-height:4.4rem;padding-block:.2rem}

/* P1-5 sold out is handled in snippets/buy-buttons.liquid: the accelerated Buy action
   is not rendered at all for an unavailable product, so there is nothing to hide here. */

/* P2-1 footer legal links — 31px hit height. */
.policies li{display:inline-flex}
.policies li a{display:inline-flex;align-items:center;min-height:4.4rem;padding-inline:.4rem}

/* P2-3 cart at 320px — the rupee sign wrapped away from its digits. */
.cart-item__price-wrapper .price,
.cart-item__price-wrapper .price-item,
.cart-item__totals .price,
.totals__subtotal-value,
.cart-item__details .product-option{white-space:nowrap}
@media screen and (max-width:479px){
  /* give the money column room to stay on one line without crushing the name */
  .cart-item__totals{min-width:8.5rem}
  .cart-item__name{word-break:break-word}
}

/* ---------- Prepaid price presentation (Sep 2026, PDP only) ----------
   Behind settings.prepaid_price_display; see snippets/nk-prepaid-price.liquid.
   One secondary line under the PDP price: smaller, muted, plain text — no pill,
   no background, no strikethrough. Cards never render it. */
.nk-prepaid--pdp {
  margin: 0.4rem 0 0;
  font-family: var(--nk-font-body);
  font-size: 1.4rem;
  line-height: 1.4;
  color: #7c6560; /* Warm Grey — creative sign-off 13 Sep 2026 */
  text-decoration: none;
}
/* PDP stock line (14 Sep 2026): "Only 1 available" / "Only 2 available" — the same
   muted line as the prepaid presentation; no pill, no colour emphasis, no urgency. */
.nk-stock-line {
  margin: 0.4rem 0 0;
  font-family: var(--nk-font-body);
  font-size: 1.4rem;
  line-height: 1.4;
  color: #7c6560; /* Warm Grey */
}
/* Restocking notice (21 Sep 2026): the same muted line as the stock / prepaid lines on the PDP,
   beside the item in the cart drawer and cart page; the card badge reuses .nk-tag. Driven by the
   nakhrey.restocking metafield + settings.restocking_text; snippets/nk-restocking.liquid. */
.nk-restocking {
  margin: 0.4rem 0 0;
  font-family: var(--nk-font-body);
  font-size: 1.4rem;
  line-height: 1.4;
  color: #7c6560; /* Warm Grey */
}
.nk-restocking--cart {
  margin: 0.2rem 0 0;
  font-size: 1.3rem;
  display: block;
}
/* First-order code line (19 Sep 2026) — same muted style as the prepaid line; the code
   in Deep Rani semibold. Behind settings.first_order_display; snippets/nk-first-order.liquid. */
.nk-first-order {
  margin: 0.4rem 0 0;
  font-family: var(--nk-font-body);
  font-size: 1.4rem;
  line-height: 1.4;
  color: #7c6560;
}
.nk-first-order--cart {
  margin: 0 0 0.8rem;
  text-align: center;
  /* .cart__ctas is a flex row from 750px (Dawn): keep the line on its own row above the button */
  flex: 0 0 100%;
  width: 100%;
  order: -1;
}
@media screen and (min-width: 750px) {
  .cart__ctas:has(.nk-first-order--cart) {
    flex-wrap: wrap;
  }
}
.nk-first-order__code {
  font-family: var(--nk-font-display);
  font-weight: 600;
  color: #8f1d4d;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.nk-prepaid--pdp .nk-prepaid__amount {
  font-family: var(--nk-font-display);
  font-weight: 600;
  color: #8f1d4d; /* Deep Rani — the amount only; never Bright Rani, green, pill or underline */
  white-space: nowrap;
}

/* Pre-book V1 (29 Sep 2026) — snippets/nk-prebook.liquid + assets/nk-prebook.js. The eta line and the
   helper reuse the muted prepaid / stock-line style; the CTA is the theme's primary button (ink);
   the modal is Dawn's modal-dialog, centred on desktop and a bottom sheet under 750px. */
.nk-prebook-line { margin: 0 0 var(--nk-s1, 0.8rem); font-family: var(--nk-font-body); font-size: 1.4rem; line-height: 1.4; color: #7c6560; }
.nk-prebook-help { margin: var(--nk-s1, 0.8rem) 0 0; font-family: var(--nk-font-body); font-size: 1.3rem; line-height: 1.4; color: #7c6560; }
.nk-prebook-buttons .nk-prebook-btn { min-height: 4.4rem; border-radius: 999px; font-family: var(--nk-font-display); font-weight: 600; letter-spacing: 0.02em; }
.nk-prebook-card-link { text-decoration: none; }
.nk-prebook-modal { position: fixed; inset: 0; background: rgba(var(--color-foreground), 0.35); opacity: 0; visibility: hidden; z-index: -1; transition: opacity 0.2s ease; }
.nk-prebook-modal[open] { opacity: 1; visibility: visible; z-index: 1001; }
.nk-prebook-modal__panel { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(44rem, calc(100% - 3.2rem)); max-height: calc(100% - 3.2rem); overflow: auto; background: var(--nk-bg, #fffcf6); color: var(--nk-ink, #26060f); border-radius: 1.6rem; padding: 2.4rem 2rem 2rem; box-shadow: 0 2rem 6rem rgba(0, 0, 0, 0.25); }
.nk-prebook-modal__close { position: absolute; top: 1.2rem; right: 1.2rem; width: 4.4rem; height: 4.4rem; display: grid; place-items: center; background: transparent; border: 0; cursor: pointer; color: inherit; }
.nk-prebook-modal__close svg { width: 1.8rem; height: 1.8rem; }
.nk-prebook-modal__title { font-family: var(--nk-font-display); font-weight: 500; font-size: 2.2rem; line-height: 1.2; margin: 0 3.6rem 0.8rem 0; }
.nk-prebook-modal__body { font-family: var(--nk-font-body); font-size: 1.4rem; line-height: 1.5; margin: 0 0 1.6rem; color: #4a3a36; }
.nk-prebook-field { display: block; margin: 0 0 1.2rem; font-family: var(--nk-font-body); }
.nk-prebook-field > span { display: block; font-size: 1.2rem; letter-spacing: 0.04em; text-transform: uppercase; color: #7c6560; margin: 0 0 0.4rem; }
.nk-prebook-field em { text-transform: none; letter-spacing: 0; font-style: normal; }
.nk-prebook-field input { width: 100%; min-height: 4.4rem; padding: 0.8rem 1.2rem; font-size: 1.6rem; font-family: var(--nk-font-body); border: 1px solid rgba(var(--color-foreground), 0.25); border-radius: 0.8rem; background: #fff; color: inherit; }
.nk-prebook-field input:focus-visible { outline: 2px solid var(--nk-a1); outline-offset: 1px; }
.nk-prebook-hp { position: absolute !important; left: -9999px; }
.nk-prebook-consent { display: flex; gap: 0.8rem; align-items: flex-start; font-family: var(--nk-font-body); font-size: 1.4rem; line-height: 1.4; margin: 0 0 1.2rem; cursor: pointer; }
.nk-prebook-consent input { width: 1.8rem; height: 1.8rem; margin-top: 0.2rem; accent-color: var(--nk-a1); flex: 0 0 auto; }
.nk-prebook-status { min-height: 1.8rem; margin: 0 0 1rem; font-family: var(--nk-font-body); font-size: 1.3rem; line-height: 1.4; }
.nk-prebook-status.is-ok { color: #4a3a36; }
.nk-prebook-status.is-error { color: #b3261e; }
.nk-prebook-success .nk-prebook-modal__title { margin-right: 0; }
@media screen and (max-width: 749px) {
  .nk-prebook-modal__panel { top: auto; bottom: 0; left: 0; transform: none; width: 100%; max-height: 92%; border-radius: 1.6rem 1.6rem 0 0; padding: 2rem 1.6rem calc(2rem + env(safe-area-inset-bottom, 0px)); }
}
/* Pre-book PDP (body.nk-prebook, layout/theme.liquid): no payment / quantity chrome next to "No payment now" —
   the prepaid line, the COD / shipping pill row and the quantity stepper are hidden; trust list + Product Truth stay. */
body.nk-prebook [data-nk-prepaid="line"], body.nk-prebook .nk-pill-row, body.nk-prebook .product-form__quantity { display: none !important; }

/* Craft facet (30 Sep 2026, snippets/nk-craft-facet.liquid): Dawn's facet look with links instead of checkboxes
   (Shopify tag URLs). The active craft shows the checkmark like a checked filter. */
.nk-craft-facet__link { text-decoration: none; color: rgb(var(--color-foreground)); }
.nk-craft-facet__link .svg-wrapper { display: none; }
.nk-craft-facet__link.active .svg-wrapper { display: block; }
.nk-craft-facet__link.active > svg { display: none; }
.nk-craft-facet__link.active { --color-foreground: var(--color-foreground); }
.facets__display .nk-craft-facet__link { display: flex; align-items: center; gap: 0.8rem; padding: 0.4rem 0; }

/* Season-driven navigation (30 Sep 2026, snippets/nk-season.liquid): the seasonal first menu item in Deep Rani
   #8F1D4D so it reads as the primary door; the "Shop by occasion" chip row under the hero — one scrolling line at
   390 (hidden scrollbar), one row at 990+. */
.header__inline-menu .nk-season-link, .menu-drawer__menu .nk-season-link { color: #8f1d4d; font-weight: 600; }
.header__inline-menu .nk-season-link span { color: inherit; }
.header__inline-menu .nk-season-link:hover span, .header__inline-menu .nk-season-link:focus-visible span { text-decoration: underline; text-underline-offset: 0.3rem; }
.nk-occasions { display: flex; align-items: center; gap: 1rem; margin: 1.6rem auto 0; }
.nk-occasions__label { flex: 0 0 auto; font-family: var(--nk-font-body); font-size: 1.3rem; letter-spacing: 0.04em; text-transform: uppercase; color: #7c6560; white-space: nowrap; }
.nk-occasions__list { display: flex; flex: 1 1 auto; gap: 0.8rem; margin: 0; padding: 0 0.2rem 0.2rem 0; list-style: none; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; min-width: 0; }
.nk-occasions__list::-webkit-scrollbar { display: none; }
.nk-occasions__item { flex: 0 0 auto; }
.nk-occasions__chip { display: inline-flex; align-items: center; min-height: 4rem; padding: 0 1.6rem; border-radius: 999px; border: 1.5px solid var(--nk-ink, #26060f); color: var(--nk-ink, #26060f); font-family: var(--nk-font-display); font-size: 1.4rem; font-weight: 600; letter-spacing: 0.02em; text-decoration: none; white-space: nowrap; background: transparent; }
.nk-occasions__chip--current { background: #8f1d4d; border-color: #8f1d4d; color: #fff; }
.nk-occasions__chip:hover, .nk-occasions__chip:focus-visible { background: var(--nk-ink, #26060f); color: #fff; }
.nk-occasions__chip--current:hover, .nk-occasions__chip--current:focus-visible { background: #6f1439; border-color: #6f1439; }
@media screen and (max-width: 749px) {
  .nk-occasions { flex-direction: column; align-items: flex-start; gap: 0.6rem; }
  .nk-occasions__list { width: 100%; }
}
@media screen and (min-width: 990px) {
  .nk-occasions { margin-top: 2rem; }
  .nk-occasions__list { overflow: visible; flex-wrap: nowrap; }
}

/* ---- Hero product pre-order (13 Oct 2026, snippets/nk-preorder.liquid) ---- */
.nk-preorder-line{font-size:1.3rem;line-height:1.45;color:var(--nk-warm-grey,#7C6560);margin:.4rem 0 0}
.nk-preorder-pay .nk-preorder__amount{color:var(--nk-a1,#8F1D4D);font-weight:600}
.nk-preorder-fine{display:block;font-size:1.1rem;opacity:.8}
.nk-preorder-reassure{font-size:1.2rem}
.nk-preorder-cart{font-size:1.2rem;color:var(--nk-warm-grey,#7C6560);margin:.2rem 0 0}
.nk-preorder-mixed{flex-basis:100%;font-size:1.2rem;color:var(--nk-warm-grey,#7C6560);margin:0 0 .6rem;text-align:center}
.nk-preorder-dyn[hidden]{display:none}

/* Pre-order hook as a pill above the product name (creative owner, 14 Oct 2026): Deep Rani on Ivory, the label font
   (Space Grotesk — only the italic Fraunces cut is loaded, so Fraunces upright is not available) 14px, inline-block so it never stretches; one line at 390, wrap allowed at ≤360. Same slot and margin as the hook. */
.nk-hook.nk-preorder-hook{font-style:normal;font-weight:400;font-size:1.4rem;line-height:1.3;margin:0 0 var(--nk-s1)}
.product__title .nk-hook.nk-preorder-hook{font-style:normal}
.nk-preorder-pill{display:inline-block;background:#8F1D4D;color:#FFFCF6;font-family:var(--nk-font-display);font-weight:500;font-style:normal;font-size:1.4rem;line-height:1.3;padding:6px 12px;border-radius:4px;white-space:nowrap;max-width:100%}
.nk-preorder-pill strong{font-weight:700;color:#FFFCF6}
@media screen and (max-width: 360px){.nk-preorder-pill{white-space:normal}}

/* ---- Pre-order round 2 (14 Oct 2026) ---- */
.nk-preorder-dispatch{font-family:var(--nk-font-display);font-size:1.5rem;font-weight:500;line-height:1.35;color:#8F1D4D;margin:var(--nk-s1) 0 0}
.nk-preorder-diwali{font-size:1.4rem;line-height:1.4;color:#7C6560;margin:.2rem 0 0}
.nk-preorder-pay{font-size:1.4rem;line-height:1.45;color:#7C6560;margin:.6rem 0 0}
.nk-preorder-pay+.nk-preorder-pay{margin-top:.2rem}
.nk-preorder-pay .nk-preorder__amount{color:#8F1D4D;font-weight:600}
.nk-preorder-fine{font-size:1.2rem;line-height:1.4;color:#7C6560;opacity:.85;margin:.3rem 0 0}
.nk-preorder-reassure{font-size:1.3rem;line-height:1.4;color:#7C6560;margin:var(--nk-s2) 0 0}
@media screen and (max-width: 749px){.nk-pdp-v2 .product__info-container>.nk-preorder-reassure{order:10;margin-top:var(--nk-s2)}}
.nk-sticky-atc__dispatch{display:block;font-size:1.2rem;line-height:1.2;color:#8F1D4D;font-weight:500;white-space:nowrap}

/* ---- WhatsApp floater (14 Oct 2026, snippets/nk-whatsapp.liquid) ---- */
.nk-wa{position:fixed;right:16px;bottom:var(--nk-wa-bottom,16px);z-index:900;transition:bottom .2s ease,opacity .15s ease}
.nk-wa--footer{opacity:0;pointer-events:none}
.nk-wa__btn{display:flex;align-items:center;justify-content:flex-end;min-width:52px;height:52px;border-radius:999px;background:#8F1D4D;color:#FFFCF6;text-decoration:none;box-shadow:0 4px 14px rgba(0,0,0,.18);padding:0;overflow:hidden}
.nk-wa__icon{display:grid;place-items:center;width:52px;height:52px;flex:0 0 52px}
.nk-wa__label{max-width:0;opacity:0;white-space:nowrap;overflow:hidden;font-family:var(--nk-font-display);font-weight:500;font-size:1.4rem;line-height:1;color:#FFFCF6;padding:0;transition:max-width .25s ease,opacity .2s ease,padding .25s ease}
@media (hover:hover) and (min-width:750px){.nk-wa__btn:hover .nk-wa__label,.nk-wa__btn:focus-visible .nk-wa__label{max-width:28rem;opacity:1;padding:0 .4rem 0 1.6rem}}
.nk-wa__btn:focus-visible{outline:3px solid #26060f;outline-offset:3px}
body.overflow-hidden .nk-wa,body:has(.drawer.active) .nk-wa,body:has(dialog[open]) .nk-wa,body:has(modal-dialog[open]) .nk-wa,body:has(.product-media-modal[open]) .nk-wa,.nk-wa--occ{display:none}
@media (prefers-reduced-motion:reduce){.nk-wa,.nk-wa__label{transition:none}}