/*
Theme Name: Nordén
Theme URI: https://norden.se
Author: MORSING CO.
Author URI: https://morsing.co
Description: Nordén — Luxury Secondhand. A premium editorial WooCommerce theme inspired by the Prestige Allure aesthetic. Warm ivory tones, refined typography, image-first layouts.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: Proprietary
Text Domain: norden
Tags: e-commerce, woocommerce, luxury, minimal, editorial
*/

/* ============================================================
   DESIGN TOKENS
   ============================================================ */
:root {
  /* Colors */
  --color-bg:          #F6F4EF;
  --color-bg-alt:      #EFECE4;
  --color-bg-dark:     #1C1B18;
  --color-surface:     #FFFFFF;
  --color-border:      #E0DBD1;
  --color-border-dark: #C8C2B4;

  --color-text:        #1C1B18;
  --color-text-muted:  #7A7167;
  --color-text-light:  #A89E90;
  --color-text-inverse:#F6F4EF;

  --color-accent:      #8B7355;
  --color-accent-dark: #6A5640;
  --color-accent-light:#C4AF96;

  /* Typography */
  --font-display:  'Cormorant Garamond', Georgia, serif;
  --font-body:     'Jost', 'Helvetica Neue', Arial, sans-serif;
  --font-mono:     'Courier New', monospace;

  --fs-xs:   0.6875rem;   /* 11px */
  --fs-sm:   0.75rem;     /* 12px */
  --fs-base:  0.875rem;   /* 14px */
  --fs-md:    1rem;        /* 16px */
  --fs-lg:    1.125rem;   /* 18px */
  --fs-xl:    1.375rem;   /* 22px */
  --fs-2xl:   1.75rem;    /* 28px */
  --fs-3xl:   2.5rem;     /* 40px */
  --fs-4xl:   3.5rem;     /* 56px */
  --fs-5xl:   5rem;       /* 80px */
  --fs-6xl:   7rem;       /* 112px */

  --lh-tight:  1.1;
  --lh-snug:   1.3;
  --lh-normal: 1.6;
  --lh-loose:  1.9;

  --ls-tight:  -0.02em;
  --ls-normal:  0em;
  --ls-wide:    0.06em;
  --ls-wider:   0.12em;
  --ls-widest:  0.2em;

  /* Spacing */
  --sp-1:  0.25rem;
  --sp-2:  0.5rem;
  --sp-3:  0.75rem;
  --sp-4:  1rem;
  --sp-6:  1.5rem;
  --sp-8:  2rem;
  --sp-10: 2.5rem;
  --sp-12: 3rem;
  --sp-16: 4rem;
  --sp-20: 5rem;
  --sp-24: 6rem;
  --sp-32: 8rem;

  /* Layout */
  --container-sm:  640px;
  --container-md:  900px;
  --container-lg: 1200px;
  --container-xl: 1440px;

  /* Effects */
  --shadow-sm:  0 1px 3px rgba(28,27,24,0.06);
  --shadow-md:  0 4px 16px rgba(28,27,24,0.08);
  --shadow-lg:  0 12px 40px rgba(28,27,24,0.12);

  --radius-sm:  2px;
  --radius-md:  4px;
  --radius-lg:  8px;

  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   400ms ease;
  --transition-slower: 600ms cubic-bezier(0.25, 0.1, 0.25, 1);

  /* Header */
  --header-height: 70px;
}

/* ============================================================
   RESET & BASE
   ============================================================ */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body {
  background-color: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: var(--fs-base);
  line-height: var(--lh-normal);
  font-weight: 300;
  overflow-x: hidden;
}

img, video {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
  transition: opacity var(--transition-fast);
}

a:hover { opacity: 0.7; }

ul, ol { list-style: none; }

button, input, select, textarea {
  font-family: inherit;
  font-size: inherit;
}

button {
  cursor: pointer;
  border: none;
  background: none;
}

/* ============================================================
   TYPOGRAPHY
   ============================================================ */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: 300;
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-tight);
  color: var(--color-text);
}

h1 { font-size: var(--fs-5xl); }
h2 { font-size: var(--fs-4xl); }
h3 { font-size: var(--fs-3xl); }
h4 { font-size: var(--fs-2xl); }
h5 { font-size: var(--fs-xl); }
h6 { font-size: var(--fs-lg); }

p {
  line-height: var(--lh-loose);
  color: var(--color-text-muted);
}

.label {
  font-family: var(--font-body);
  font-size: var(--fs-xs);
  font-weight: 400;
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  color: var(--color-text-muted);
}

.eyebrow {
  display: block;
  font-family: var(--font-body);
  font-size: var(--fs-xs);
  font-weight: 400;
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: var(--sp-4);
}

/* ============================================================
   LAYOUT UTILITIES
   ============================================================ */
.container {
  width: 100%;
  max-width: var(--container-lg);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--sp-6);
  padding-right: var(--sp-6);
}

.container--sm  { max-width: var(--container-sm); }
.container--md  { max-width: var(--container-md); }
.container--xl  { max-width: var(--container-xl); }
.container--full { max-width: 100%; padding: 0; }

.section {
  padding-top: var(--sp-24);
  padding-bottom: var(--sp-24);
}

.section--sm {
  padding-top: var(--sp-16);
  padding-bottom: var(--sp-16);
}

.section--lg {
  padding-top: var(--sp-32);
  padding-bottom: var(--sp-32);
}

.grid {
  display: grid;
  gap: var(--sp-6);
}

.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }

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

/* ============================================================
   ANNOUNCEMENT BAR
   ============================================================ */
.announcement-bar {
  background: var(--color-bg-dark);
  color: var(--color-text-inverse);
  text-align: center;
  padding: var(--sp-2) var(--sp-6);
  font-size: var(--fs-xs);
  font-weight: 400;
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  position: relative;
  z-index: 101;
}

.announcement-bar a {
  color: var(--color-accent-light);
  border-bottom: 1px solid currentColor;
}

/* ============================================================
   HEADER
   ============================================================ */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--color-bg);
  border-bottom: 1px solid var(--color-border);
  height: var(--header-height);
  transition: background var(--transition-base), box-shadow var(--transition-base);
}

.site-header.scrolled {
  box-shadow: var(--shadow-sm);
}

.site-header.transparent {
  background: transparent;
  border-bottom-color: transparent;
  position: absolute;
  width: 100%;
}

.header-inner {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  height: 100%;
  padding: 0 var(--sp-6);
  max-width: var(--container-xl);
  margin: 0 auto;
}

/* Logo */
.site-branding {
  grid-column: 2;
  text-align: center;
}

.site-logo {
  font-family: var(--font-display);
  font-size: var(--fs-xl);
  font-weight: 300;
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  color: var(--color-text);
  line-height: 1;
}

.site-logo span {
  display: block;
  font-size: var(--fs-xs);
  font-family: var(--font-body);
  font-weight: 300;
  letter-spacing: var(--ls-wide);
  color: var(--color-text-muted);
  margin-top: 2px;
}

/* Left nav */
.header-nav-left {
  grid-column: 1;
}

/* Right actions */
.header-actions {
  grid-column: 3;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--sp-4);
}

/* Navigation */
.primary-navigation ul {
  display: flex;
  align-items: center;
  gap: var(--sp-8);
}

.primary-navigation a {
  font-family: var(--font-body);
  font-size: var(--fs-xs);
  font-weight: 400;
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  color: var(--color-text);
  position: relative;
  padding-bottom: 2px;
}

.primary-navigation a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--color-text);
  transition: width var(--transition-base);
}

.primary-navigation a:hover { opacity: 1; }
.primary-navigation a:hover::after { width: 100%; }

/* Header icons */
.header-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  color: var(--color-text);
  transition: color var(--transition-fast);
  position: relative;
}

.header-icon svg {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.5;
}

.cart-count {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--color-text);
  color: var(--color-bg);
  font-size: 9px;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

/* Mobile hamburger */
.menu-toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
}

.menu-toggle span {
  display: block;
  width: 22px;
  height: 1px;
  background: var(--color-text);
  transition: all var(--transition-base);
}

/* ============================================================
   MOBILE MENU
   ============================================================ */
.mobile-menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--color-bg);
  z-index: 200;
  display: flex;
  flex-direction: column;
  padding: var(--sp-8) var(--sp-6);
  transform: translateX(-100%);
  transition: transform var(--transition-slower);
}

.mobile-menu.is-open {
  transform: translateX(0);
}

.mobile-menu-close {
  align-self: flex-end;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--sp-8);
}

.mobile-menu nav ul {
  display: flex;
  flex-direction: column;
  gap: var(--sp-6);
}

.mobile-menu nav a {
  font-family: var(--font-display);
  font-size: var(--fs-3xl);
  font-weight: 300;
  letter-spacing: var(--ls-tight);
}

/* ============================================================
   SLIDE-OUT CART
   ============================================================ */
.cart-overlay {
  position: fixed;
  inset: 0;
  background: rgba(28,27,24,0.4);
  z-index: 300;
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--transition-base);
}

.cart-overlay.is-open {
  opacity: 1;
  pointer-events: all;
}

.cart-drawer {
  position: fixed;
  top: 0;
  right: 0;
  width: 420px;
  max-width: 100%;
  height: 100%;
  background: var(--color-surface);
  z-index: 301;
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform var(--transition-slower);
}

.cart-drawer.is-open {
  transform: translateX(0);
}

.cart-drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--sp-6) var(--sp-8);
  border-bottom: 1px solid var(--color-border);
}

.cart-drawer-header h2 {
  font-size: var(--fs-xs);
  font-family: var(--font-body);
  font-weight: 400;
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
}

.cart-drawer-body {
  flex: 1;
  overflow-y: auto;
  padding: var(--sp-6) var(--sp-8);
}

.cart-drawer-footer {
  padding: var(--sp-6) var(--sp-8);
  border-top: 1px solid var(--color-border);
}

.cart-drawer-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--sp-4);
  font-size: var(--fs-sm);
  letter-spacing: var(--ls-wide);
}

.cart-item {
  display: grid;
  grid-template-columns: 80px 1fr auto;
  gap: var(--sp-4);
  padding: var(--sp-4) 0;
  border-bottom: 1px solid var(--color-border);
}

.cart-item-image {
  width: 80px;
  height: 100px;
  object-fit: cover;
  background: var(--color-bg-alt);
}

.cart-item-name {
  font-size: var(--fs-sm);
  font-weight: 400;
  margin-bottom: var(--sp-1);
}

.cart-item-meta {
  font-size: var(--fs-xs);
  color: var(--color-text-muted);
  letter-spacing: var(--ls-wide);
}

.cart-item-price {
  font-size: var(--fs-sm);
  font-weight: 400;
  text-align: right;
}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  padding: var(--sp-4) var(--sp-8);
  font-family: var(--font-body);
  font-size: var(--fs-xs);
  font-weight: 400;
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid transparent;
  cursor: pointer;
  transition: all var(--transition-base);
  white-space: nowrap;
  line-height: 1;
}

.btn--primary {
  background: var(--color-text);
  color: var(--color-bg);
  border-color: var(--color-text);
}

.btn--primary:hover {
  background: var(--color-accent);
  border-color: var(--color-accent);
  opacity: 1;
}

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

.btn--outline:hover {
  background: var(--color-text);
  color: var(--color-bg);
  opacity: 1;
}

.btn--ghost {
  background: transparent;
  color: var(--color-text);
  border-color: transparent;
  padding-left: 0;
  padding-right: 0;
  position: relative;
}

.btn--ghost::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: currentColor;
  transition: opacity var(--transition-base);
}

.btn--ghost:hover { opacity: 1; }
.btn--ghost:hover::after { opacity: 0.4; }

.btn--full { width: 100%; }

.btn--lg {
  padding: var(--sp-6) var(--sp-10);
}

/* ============================================================
   HERO — FULL BLEED
   ============================================================ */
.hero {
  position: relative;
  height: 100vh;
  min-height: 600px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}

.hero__media {
  position: absolute;
  inset: 0;
}

.hero__media img,
.hero__media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

.hero__media::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(28,27,24,0.55) 0%,
    rgba(28,27,24,0.2) 40%,
    transparent 70%
  );
}

.hero__content {
  position: relative;
  z-index: 2;
  padding: var(--sp-16) var(--sp-16);
  max-width: 700px;
  color: var(--color-text-inverse);
}

.hero__eyebrow {
  display: block;
  font-size: var(--fs-xs);
  font-weight: 400;
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  color: rgba(246,244,239,0.7);
  margin-bottom: var(--sp-4);
}

.hero__title {
  font-family: var(--font-display);
  font-size: clamp(3rem, 6vw, var(--fs-6xl));
  font-weight: 300;
  letter-spacing: var(--ls-tight);
  line-height: 1;
  color: var(--color-text-inverse);
  margin-bottom: var(--sp-6);
}

.hero__subtitle {
  font-size: var(--fs-base);
  font-weight: 300;
  color: rgba(246,244,239,0.8);
  margin-bottom: var(--sp-8);
  line-height: var(--lh-loose);
}

.hero__actions {
  display: flex;
  gap: var(--sp-4);
  flex-wrap: wrap;
}

/* Hero split variant */
.hero--split {
  height: auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 90vh;
}

.hero--split .hero__media {
  position: relative;
}

.hero--split .hero__media::after { display: none; }

.hero--split .hero__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--sp-24) var(--sp-16);
  color: var(--color-text);
  background: var(--color-bg);
}

.hero--split .hero__title { color: var(--color-text); }
.hero--split .hero__eyebrow { color: var(--color-accent); }

/* ============================================================
   FEATURED CATEGORIES
   ============================================================ */
.categories-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-4);
}

.category-card {
  position: relative;
  overflow: hidden;
  aspect-ratio: 3/4;
  background: var(--color-bg-alt);
}

.category-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition-slower);
}

.category-card:hover .category-card__image {
  transform: scale(1.04);
}

.category-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(28,27,24,0.5) 0%,
    transparent 50%
  );
  transition: opacity var(--transition-base);
}

.category-card:hover::after {
  opacity: 0.7;
}

.category-card__content {
  position: absolute;
  bottom: var(--sp-8);
  left: var(--sp-8);
  right: var(--sp-8);
  z-index: 2;
  color: var(--color-text-inverse);
}

.category-card__label {
  display: block;
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  margin-bottom: var(--sp-2);
  opacity: 0.7;
}

.category-card__title {
  font-family: var(--font-display);
  font-size: var(--fs-2xl);
  font-weight: 300;
  letter-spacing: var(--ls-tight);
  color: var(--color-text-inverse);
}

.category-card__link {
  display: inline-block;
  margin-top: var(--sp-3);
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  border-bottom: 1px solid rgba(246,244,239,0.5);
  color: var(--color-text-inverse);
  padding-bottom: 2px;
  transition: border-color var(--transition-fast);
}

.category-card:hover .category-card__link {
  border-color: var(--color-text-inverse);
}

/* ============================================================
   SECTION HEADER
   ============================================================ */
.section-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: var(--sp-10);
}

.section-header__title {
  font-family: var(--font-display);
  font-size: var(--fs-4xl);
  font-weight: 300;
  letter-spacing: var(--ls-tight);
}

.section-header__link {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  border-bottom: 1px solid var(--color-text);
  padding-bottom: 2px;
  color: var(--color-text);
}

/* ============================================================
   PRODUCT CARD
   ============================================================ */
.products-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--sp-6) var(--sp-4);
}

.products-grid--3col { grid-template-columns: repeat(3, 1fr); }
.products-grid--2col { grid-template-columns: repeat(2, 1fr); }

.product-card {
  position: relative;
}

.product-card__media {
  position: relative;
  overflow: hidden;
  background: var(--color-bg-alt);
  aspect-ratio: 3/4;
  margin-bottom: var(--sp-4);
}

.product-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition-slower);
}

.product-card__image--hover {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity var(--transition-slow);
}

.product-card:hover .product-card__image { transform: scale(1.03); }
.product-card:hover .product-card__image--hover { opacity: 1; }

/* Badges */
.product-card__badges {
  position: absolute;
  top: var(--sp-4);
  left: var(--sp-4);
  display: flex;
  flex-direction: column;
  gap: var(--sp-1);
  z-index: 2;
}

.badge {
  display: inline-block;
  padding: 3px 8px;
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1.4;
}

.badge--new     { background: var(--color-text); color: var(--color-bg); }
.badge--sale    { background: var(--color-accent); color: var(--color-bg); }
.badge--sold    { background: var(--color-bg-alt); color: var(--color-text-muted); }

/* Quick add */
.product-card__quick-add {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 3;
  padding: var(--sp-4);
  transform: translateY(100%);
  transition: transform var(--transition-base);
}

.product-card:hover .product-card__quick-add {
  transform: translateY(0);
}

.product-card__quick-add .btn {
  background: var(--color-bg);
  color: var(--color-text);
  border-color: transparent;
  box-shadow: var(--shadow-md);
}

/* Product info */
.product-card__info { padding: 0 0 var(--sp-2); }

.product-card__brand {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  color: var(--color-text-muted);
  margin-bottom: var(--sp-1);
}

.product-card__name {
  font-family: var(--font-display);
  font-size: var(--fs-lg);
  font-weight: 400;
  letter-spacing: var(--ls-tight);
  margin-bottom: var(--sp-2);
  line-height: var(--lh-snug);
}

.product-card__condition {
  font-size: var(--fs-xs);
  color: var(--color-text-light);
  letter-spacing: var(--ls-wide);
  margin-bottom: var(--sp-2);
}

.product-card__price {
  display: flex;
  align-items: baseline;
  gap: var(--sp-2);
}

.product-card__price .price {
  font-size: var(--fs-base);
  font-weight: 400;
  color: var(--color-text);
}

.product-card__price .price--original {
  font-size: var(--fs-sm);
  color: var(--color-text-light);
  text-decoration: line-through;
}

/* ============================================================
   EDITORIAL BANNER (Image + Text)
   ============================================================ */
.editorial-banner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 600px;
  overflow: hidden;
}

.editorial-banner--reverse { direction: rtl; }
.editorial-banner--reverse > * { direction: ltr; }

.editorial-banner__media {
  position: relative;
  overflow: hidden;
}

.editorial-banner__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition-slower);
}

.editorial-banner:hover .editorial-banner__media img {
  transform: scale(1.02);
}

.editorial-banner__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--sp-20) var(--sp-16);
  background: var(--color-bg-alt);
}

.editorial-banner__content--dark {
  background: var(--color-bg-dark);
  color: var(--color-text-inverse);
}

.editorial-banner__content--dark h2,
.editorial-banner__content--dark p {
  color: var(--color-text-inverse);
}

.editorial-banner__title {
  font-family: var(--font-display);
  font-size: var(--fs-4xl);
  font-weight: 300;
  letter-spacing: var(--ls-tight);
  margin-bottom: var(--sp-6);
}

.editorial-banner__text {
  font-size: var(--fs-base);
  line-height: var(--lh-loose);
  margin-bottom: var(--sp-8);
  max-width: 380px;
}

/* ============================================================
   TRUST BAR
   ============================================================ */
.trust-bar {
  background: var(--color-bg-alt);
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
  padding: var(--sp-6) 0;
}

.trust-bar__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-12);
  flex-wrap: wrap;
}

.trust-item {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
}

.trust-item__icon {
  width: 24px;
  height: 24px;
  color: var(--color-accent);
}

.trust-item__icon svg {
  width: 100%;
  height: 100%;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.5;
}

.trust-item__text {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  color: var(--color-text-muted);
}

/* ============================================================
   CONDITION GUIDE SECTION
   ============================================================ */
.condition-guide {
  background: var(--color-bg-dark);
  color: var(--color-text-inverse);
  padding: var(--sp-20) 0;
}

.condition-guide__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--sp-8);
  margin-top: var(--sp-12);
}

.condition-item {
  padding-top: var(--sp-8);
  border-top: 1px solid rgba(246,244,239,0.15);
}

.condition-item__grade {
  font-family: var(--font-display);
  font-size: var(--fs-5xl);
  font-weight: 300;
  color: rgba(246,244,239,0.15);
  line-height: 1;
  margin-bottom: var(--sp-4);
}

.condition-item__name {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  color: var(--color-accent-light);
  margin-bottom: var(--sp-3);
}

.condition-item__desc {
  font-size: var(--fs-sm);
  color: rgba(246,244,239,0.55);
  line-height: var(--lh-loose);
}

/* ============================================================
   SHOP / ARCHIVE PAGE
   ============================================================ */
.shop-header {
  border-bottom: 1px solid var(--color-border);
  padding: var(--sp-8) 0;
}

.shop-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.shop-header__title {
  font-family: var(--font-display);
  font-size: var(--fs-3xl);
  font-weight: 300;
  letter-spacing: var(--ls-tight);
}

.shop-header__count {
  font-size: var(--fs-xs);
  color: var(--color-text-muted);
  letter-spacing: var(--ls-wide);
}

.shop-layout {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: var(--sp-10);
  padding: var(--sp-10) 0;
}

/* Filters sidebar */
.shop-filters {
  position: sticky;
  top: calc(var(--header-height) + var(--sp-8));
  align-self: start;
}

.filter-group {
  padding: var(--sp-6) 0;
  border-bottom: 1px solid var(--color-border);
}

.filter-group:first-child {
  padding-top: 0;
}

.filter-group__title {
  font-size: var(--fs-xs);
  font-family: var(--font-body);
  font-weight: 400;
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  color: var(--color-text);
  margin-bottom: var(--sp-4);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.filter-option {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin-bottom: var(--sp-2);
  cursor: pointer;
}

.filter-option input[type="checkbox"] {
  width: 14px;
  height: 14px;
  border: 1px solid var(--color-border-dark);
  border-radius: 0;
  appearance: none;
  cursor: pointer;
  flex-shrink: 0;
  position: relative;
}

.filter-option input[type="checkbox"]:checked {
  background: var(--color-text);
  border-color: var(--color-text);
}

.filter-option input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  top: 1px;
  left: 3px;
  width: 5px;
  height: 8px;
  border: 1.5px solid var(--color-bg);
  border-top: none;
  border-left: none;
  transform: rotate(45deg);
}

.filter-option label {
  font-size: var(--fs-sm);
  color: var(--color-text-muted);
  cursor: pointer;
}

/* Sort bar */
.shop-sort {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--sp-4);
  margin-bottom: var(--sp-6);
}

.sort-select {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  color: var(--color-text);
  border: none;
  background: transparent;
  cursor: pointer;
  appearance: none;
  padding-right: var(--sp-4);
}

/* ============================================================
   SINGLE PRODUCT PAGE
   ============================================================ */
.product-layout {
  display: grid;
  grid-template-columns: 1fr 440px;
  gap: var(--sp-16);
  padding: var(--sp-12) 0;
  align-items: start;
}

/* Gallery */
.product-gallery {
  position: sticky;
  top: calc(var(--header-height) + var(--sp-6));
}

.product-gallery__main {
  aspect-ratio: 3/4;
  overflow: hidden;
  background: var(--color-bg-alt);
  margin-bottom: var(--sp-3);
  cursor: zoom-in;
}

.product-gallery__main img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--transition-slower);
}

.product-gallery__main:hover img {
  transform: scale(1.05);
}

.product-gallery__thumbs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--sp-2);
}

.product-gallery__thumb {
  aspect-ratio: 3/4;
  overflow: hidden;
  background: var(--color-bg-alt);
  cursor: pointer;
  border: 1px solid transparent;
  transition: border-color var(--transition-fast);
}

.product-gallery__thumb.is-active,
.product-gallery__thumb:hover {
  border-color: var(--color-text);
}

.product-gallery__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Product details */
.product-details {}

.product-details__breadcrumb {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-wide);
  color: var(--color-text-muted);
  margin-bottom: var(--sp-6);
}

.product-details__breadcrumb a {
  color: var(--color-text-muted);
}

.product-details__brand {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  color: var(--color-accent);
  margin-bottom: var(--sp-2);
}

.product-details__title {
  font-family: var(--font-display);
  font-size: var(--fs-4xl);
  font-weight: 300;
  letter-spacing: var(--ls-tight);
  line-height: var(--lh-snug);
  margin-bottom: var(--sp-4);
}

.product-details__condition {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  margin-bottom: var(--sp-6);
}

.condition-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #5C9B6E;
}

.condition-dot--fair    { background: #C4933F; }
.condition-dot--good    { background: #5C9B6E; }
.condition-dot--vgood   { background: #3B7FBF; }
.condition-dot--mint    { background: #7B5EA7; }

.product-details__condition-label {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  color: var(--color-text-muted);
}

.product-details__price {
  font-family: var(--font-display);
  font-size: var(--fs-3xl);
  font-weight: 300;
  margin-bottom: var(--sp-2);
}

.product-details__original-price {
  font-size: var(--fs-sm);
  color: var(--color-text-light);
  text-decoration: line-through;
  margin-bottom: var(--sp-8);
}

/* Size selector */
.size-selector { margin-bottom: var(--sp-6); }

.size-selector__label {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  margin-bottom: var(--sp-3);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.size-guide-trigger {
  color: var(--color-text-muted);
  border-bottom: 1px solid var(--color-text-muted);
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-wide);
  cursor: pointer;
}

.size-options {
  display: flex;
  gap: var(--sp-2);
  flex-wrap: wrap;
}

.size-option {
  min-width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-border);
  font-size: var(--fs-sm);
  font-weight: 400;
  cursor: pointer;
  transition: all var(--transition-fast);
  letter-spacing: var(--ls-wide);
}

.size-option:hover,
.size-option.is-selected {
  border-color: var(--color-text);
  background: var(--color-text);
  color: var(--color-bg);
}

/* ATC */
.product-atc {
  display: grid;
  gap: var(--sp-3);
  margin-bottom: var(--sp-6);
}

/* Product meta */
.product-meta {
  border-top: 1px solid var(--color-border);
  padding-top: var(--sp-6);
  margin-top: var(--sp-6);
}

.product-meta__row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: var(--sp-4) 0;
  border-bottom: 1px solid var(--color-border);
  font-size: var(--fs-sm);
}

.product-meta__key {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  color: var(--color-text-muted);
}

.product-meta__value {
  color: var(--color-text);
  text-align: right;
  max-width: 60%;
}

/* Accordion */
.product-accordion {
  margin-top: var(--sp-6);
  border-top: 1px solid var(--color-border);
}

.accordion-item {
  border-bottom: 1px solid var(--color-border);
}

.accordion-trigger {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--sp-5) 0;
  font-size: var(--fs-xs);
  font-weight: 400;
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  color: var(--color-text);
  cursor: pointer;
}

.accordion-icon {
  width: 16px;
  height: 16px;
  position: relative;
}

.accordion-icon::before,
.accordion-icon::after {
  content: '';
  position: absolute;
  background: currentColor;
  transition: transform var(--transition-base), opacity var(--transition-base);
}

.accordion-icon::before {
  width: 16px;
  height: 1px;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.accordion-icon::after {
  width: 1px;
  height: 16px;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
}

.accordion-item.is-open .accordion-icon::after {
  transform: translateX(-50%) rotate(90deg);
  opacity: 0;
}

.accordion-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height var(--transition-slow);
}

.accordion-item.is-open .accordion-body {
  max-height: 500px;
}

.accordion-content {
  padding-bottom: var(--sp-5);
  font-size: var(--fs-sm);
  line-height: var(--lh-loose);
  color: var(--color-text-muted);
}

/* ============================================================
   NEWSLETTER
   ============================================================ */
.newsletter {
  background: var(--color-bg-dark);
  padding: var(--sp-24) 0;
  text-align: center;
}

.newsletter__eyebrow {
  color: var(--color-accent-light);
}

.newsletter__title {
  font-family: var(--font-display);
  font-size: var(--fs-4xl);
  font-weight: 300;
  letter-spacing: var(--ls-tight);
  color: var(--color-text-inverse);
  margin-bottom: var(--sp-4);
}

.newsletter__subtitle {
  color: rgba(246,244,239,0.55);
  margin-bottom: var(--sp-10);
  font-size: var(--fs-base);
}

.newsletter__form {
  display: flex;
  max-width: 460px;
  margin: 0 auto;
  border: 1px solid rgba(246,244,239,0.2);
}

.newsletter__input {
  flex: 1;
  background: transparent;
  border: none;
  padding: var(--sp-4) var(--sp-6);
  color: var(--color-text-inverse);
  font-size: var(--fs-sm);
  outline: none;
}

.newsletter__input::placeholder {
  color: rgba(246,244,239,0.3);
  letter-spacing: var(--ls-wide);
}

.newsletter__btn {
  padding: var(--sp-4) var(--sp-6);
  background: transparent;
  border: none;
  border-left: 1px solid rgba(246,244,239,0.2);
  color: var(--color-text-inverse);
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--transition-fast);
}

.newsletter__btn:hover {
  background: rgba(246,244,239,0.08);
}

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer {
  background: var(--color-bg-dark);
  color: var(--color-text-inverse);
  padding: var(--sp-16) 0 var(--sp-8);
}

.footer-main {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: var(--sp-12);
  padding-bottom: var(--sp-12);
  border-bottom: 1px solid rgba(246,244,239,0.1);
}

.footer-brand__logo {
  font-family: var(--font-display);
  font-size: var(--fs-xl);
  font-weight: 300;
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  color: var(--color-text-inverse);
  margin-bottom: var(--sp-4);
}

.footer-brand__tagline {
  font-size: var(--fs-sm);
  color: rgba(246,244,239,0.45);
  line-height: var(--lh-loose);
  max-width: 280px;
  margin-bottom: var(--sp-6);
}

.footer-social {
  display: flex;
  gap: var(--sp-4);
}

.footer-social a {
  width: 36px;
  height: 36px;
  border: 1px solid rgba(246,244,239,0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(246,244,239,0.6);
  transition: all var(--transition-fast);
}

.footer-social a:hover {
  border-color: var(--color-text-inverse);
  color: var(--color-text-inverse);
  opacity: 1;
}

.footer-social svg {
  width: 16px;
  height: 16px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.5;
}

.footer-col__title {
  font-size: var(--fs-xs);
  font-family: var(--font-body);
  font-weight: 400;
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  color: var(--color-text-inverse);
  margin-bottom: var(--sp-6);
}

.footer-col ul {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
}

.footer-col a {
  font-size: var(--fs-sm);
  color: rgba(246,244,239,0.5);
  transition: color var(--transition-fast);
}

.footer-col a:hover {
  color: var(--color-text-inverse);
  opacity: 1;
}

.footer-bottom {
  padding-top: var(--sp-8);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-4);
  flex-wrap: wrap;
}

.footer-bottom p {
  font-size: var(--fs-xs);
  color: rgba(246,244,239,0.3);
  letter-spacing: var(--ls-wide);
}

.footer-payment-icons {
  display: flex;
  gap: var(--sp-2);
  align-items: center;
}

.payment-icon {
  width: 38px;
  height: 24px;
  background: rgba(246,244,239,0.08);
  border: 1px solid rgba(246,244,239,0.1);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 8px;
  color: rgba(246,244,239,0.4);
  letter-spacing: 0.05em;
}

/* ============================================================
   FORMS & INPUTS (WooCommerce)
   ============================================================ */
.woocommerce-form input[type="text"],
.woocommerce-form input[type="email"],
.woocommerce-form input[type="tel"],
.woocommerce-form input[type="password"],
.woocommerce-form textarea,
.woocommerce-form select,
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
textarea,
select {
  width: 100%;
  padding: var(--sp-4) var(--sp-4);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 0;
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  color: var(--color-text);
  outline: none;
  transition: border-color var(--transition-fast);
  appearance: none;
}

input:focus, textarea:focus, select:focus {
  border-color: var(--color-text);
}

label {
  display: block;
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  color: var(--color-text-muted);
  margin-bottom: var(--sp-2);
}

/* ============================================================
   WOOCOMMERCE OVERRIDES
   ============================================================ */

/* ── PRODUCT FORM: VARIATION SELECT (SIZE dropdown) ── */
.woocommerce div.product form.cart .variations,
.woocommerce div.product form.cart .variations tbody,
.woocommerce div.product form.cart .variations tr {
  display: block;
  width: 100%;
}

.woocommerce div.product form.cart .variations {
  margin-bottom: var(--sp-6);
  border: none;
}

.woocommerce div.product form.cart .variations td,
.woocommerce div.product form.cart .variations th {
  display: block;
  padding: 0;
  border: none;
  text-align: left;
}

.woocommerce div.product form.cart .variations td.label,
.woocommerce div.product form.cart .variations th.label {
  font-size: var(--fs-xs);
  font-family: var(--font-body);
  font-weight: 400;
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  color: var(--color-text-muted);
  margin-bottom: var(--sp-2);
  padding: 0;
}

.woocommerce div.product form.cart .variations td.value {
  margin-bottom: 0;
}

/* The actual select element */
.woocommerce div.product form.cart .variations select,
.woocommerce div.product form.cart select {
  width: 100%;
  padding: var(--sp-4) var(--sp-4);
  height: 52px;
  background: var(--color-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237A7167' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 14px center;
  border: 1px solid var(--color-border);
  border-radius: 0;
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  font-weight: 300;
  color: var(--color-text);
  appearance: none;
  -webkit-appearance: none;
  outline: none;
  cursor: pointer;
  transition: border-color var(--transition-fast);
}

.woocommerce div.product form.cart .variations select:focus {
  border-color: var(--color-text);
}

/* Reset variation link */
.woocommerce div.product form.cart .reset_variations {
  display: none !important;
}

/* ── PRODUCT FORM: QUANTITY ── */
.woocommerce div.product form.cart .quantity,
.woocommerce .quantity {
  float: none;
  display: flex;
  align-items: center;
  gap: 0;
  width: auto;
}

/* Hide native quantity input, keep only the styled one */
.woocommerce div.product form.cart .quantity input.qty,
.woocommerce .quantity input.qty {
  width: 56px;
  height: 52px;
  text-align: center;
  border: 1px solid var(--color-border);
  border-radius: 0;
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  color: var(--color-text);
  background: var(--color-bg);
  appearance: none;
  -moz-appearance: textfield;
  outline: none;
  -webkit-appearance: none;
}

.woocommerce div.product form.cart .quantity input.qty::-webkit-inner-spin-button,
.woocommerce div.product form.cart .quantity input.qty::-webkit-outer-spin-button {
  -webkit-appearance: none;
}

/* ── PRODUCT FORM: ADD TO CART BUTTON ── */
/* Nuclear override — hits every possible WC selector */
.woocommerce div.product form.cart button[type="submit"],
.woocommerce div.product form.cart .single_add_to_cart_button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce div.product form.cart button.button,
.woocommerce div.product form.cart button.button.alt,
.woocommerce div.product .single_add_to_cart_button.button {
  display: block !important;
  width: 100% !important;
  height: 52px !important;
  padding: 0 var(--sp-8) !important;
  background: var(--color-text) !important;
  color: var(--color-bg) !important;
  border: 1px solid var(--color-text) !important;
  border-radius: 0 !important;
  font-family: var(--font-body) !important;
  font-size: var(--fs-xs) !important;
  font-weight: 400 !important;
  letter-spacing: var(--ls-widest) !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  transition: background var(--transition-base), border-color var(--transition-base) !important;
  box-shadow: none !important;
  text-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  line-height: 1 !important;
}

.woocommerce div.product form.cart button.button:hover,
.woocommerce div.product form.cart button.button.alt:hover,
.woocommerce div.product .single_add_to_cart_button.button:hover {
  background: var(--color-accent) !important;
  border-color: var(--color-accent) !important;
  color: var(--color-bg) !important;
}

/* Disabled state */
.woocommerce div.product form.cart button.button:disabled,
.woocommerce div.product form.cart button.disabled {
  background: var(--color-bg-alt) !important;
  color: var(--color-text-light) !important;
  border-color: var(--color-border) !important;
  cursor: not-allowed !important;
}

/* ── PRODUCT FORM: ATC LAYOUT ── */
/* Stack: variant select → qty + button row */
.woocommerce div.product form.cart {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  margin-bottom: var(--sp-4);
}

/* The qty + button row */
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart,
.woocommerce div.product form.cart > .cart-atc-row {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: var(--sp-2);
  align-items: center;
}

/* Simple product (no variations) — same layout */
.woocommerce div.product form.cart:not(.variations_form) {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: var(--sp-2);
  align-items: center;
}

/* Variable product restores column layout */
.woocommerce div.product form.variations_form {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--sp-3) !important;
}

.woocommerce div.product form.variations_form .woocommerce-variation-add-to-cart {
  display: grid !important;
  grid-template-columns: 56px 1fr !important;
  gap: var(--sp-2) !important;
  align-items: center !important;
}

/* ── WOOPAYMENTS / EXPRESS CHECKOUT (Google Pay, Apple Pay) ── */
.woocommerce-product-page #wc-stripe-product-checkout-widget-button-container,
.woocommerce-product-page .wc-stripe-product-gateway-container,
.wp-pay-form--product,
#wcpay-product-checkout-widget,
#wc-stripe-product-payment-request-button,
#payment-request-button,
.woocommerce-PaymentMethod--stripe-payment-request-button,
.woo-stripe-payment-request-button__separator ~ div,
[id*="woopay"],
[id*="gpay"],
[class*="express-checkout"],
[class*="gpay"],
[class*="apple-pay"] {
  margin-top: var(--sp-3) !important;
  border-radius: 0 !important;
  overflow: hidden;
}

/* Separator between ATC and express checkout */
.woocommerce-product-page .wc-stripe-product-gateway-container::before,
#wcpay-product-checkout-widget::before,
#wc-stripe-product-payment-request-button::before {
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background: var(--color-border);
  margin-bottom: var(--sp-3);
}

/* Make Google Pay iframe match our aesthetic */
.woocommerce-product-page #wc-stripe-product-checkout-widget-button-container iframe,
#wcpay-product-checkout-widget iframe {
  border-radius: 0 !important;
  max-height: 52px !important;
}

/* Or text divider */
.woocommerce-product-page .wc-stripe-pay-button-separator,
.wc-block-components-express-payment-continue-rule {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin: var(--sp-3) 0;
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  color: var(--color-text-light);
}

.woocommerce-product-page .wc-stripe-pay-button-separator::before,
.woocommerce-product-page .wc-stripe-pay-button-separator::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--color-border);
}

/* ── VARIATION PRICE / STOCK ── */
.woocommerce div.product form.cart .woocommerce-variation-price {
  display: none; /* We show price in our own element above */
}

.woocommerce div.product .stock {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  color: #5C9B6E;
  margin-bottom: var(--sp-3);
}

.woocommerce div.product .out-of-stock {
  color: var(--color-text-muted);
}

/* ── Remove WooCommerce default styles we don't want ── */
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-error,
.woocommerce .woocommerce-info {
  border-top: none;
  border-left: 3px solid var(--color-accent);
  padding: var(--sp-4) var(--sp-6);
  background: var(--color-bg-alt);
  font-size: var(--fs-sm);
  border-radius: 0;
}

.woocommerce .woocommerce-error { border-left-color: #B85450; }
.woocommerce .woocommerce-message { border-left-color: #5C9B6E; }

/* WooCommerce product page */
.woocommerce div.product div.images { float: none; width: 100%; }
.woocommerce div.product div.summary { float: none; width: 100%; }
.woocommerce div.product { display: grid; grid-template-columns: 1fr 440px; gap: var(--sp-16); }

/* Cart & Checkout */
.woocommerce table.shop_table {
  border: none;
  border-radius: 0;
}

.woocommerce table.shop_table th {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  font-weight: 400;
  color: var(--color-text-muted);
  padding: var(--sp-4) var(--sp-4);
  border-bottom: 1px solid var(--color-border);
}

.woocommerce table.shop_table td {
  padding: var(--sp-4);
  border-bottom: 1px solid var(--color-border);
  font-size: var(--fs-sm);
  vertical-align: middle;
}

.woocommerce-cart .cart-collaterals,
.woocommerce-cart .woocommerce-cart-form {
  float: none;
  width: 100%;
}

/* Checkout */
.woocommerce-checkout .col2-set {
  float: none;
  width: 100%;
}

/* ============================================================
   ANIMATIONS
   ============================================================ */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(24px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.animate-in {
  animation: fadeInUp 0.6s cubic-bezier(0.25, 0.1, 0.25, 1) forwards;
}

[data-reveal] {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}

[data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ============================================================
   RESPONSIVE — TABLET
   ============================================================ */
@media (max-width: 1024px) {
  :root {
    --header-height: 60px;
  }

  h1 { font-size: var(--fs-4xl); }
  h2 { font-size: var(--fs-3xl); }
  h3 { font-size: var(--fs-2xl); }

  .hero__content { padding: var(--sp-12) var(--sp-8); }
  .hero__title { font-size: clamp(2.5rem, 5vw, var(--fs-5xl)); }

  .footer-main { grid-template-columns: 1fr 1fr; gap: var(--sp-8); }

  .categories-grid { grid-template-columns: repeat(2, 1fr); }

  .products-grid { grid-template-columns: repeat(3, 1fr); }

  .editorial-banner { min-height: 500px; }

  .condition-guide__grid { grid-template-columns: repeat(2, 1fr); }

  .product-layout,
  .woocommerce div.product {
    grid-template-columns: 1fr;
    gap: var(--sp-10);
  }

  .product-gallery { position: relative; top: 0; }

  .shop-layout { grid-template-columns: 200px 1fr; }
}

/* ============================================================
   RESPONSIVE — MOBILE
   ============================================================ */
@media (max-width: 768px) {
  :root {
    --sp-24: 4rem;
    --sp-32: 5rem;
  }

  .container { padding-left: var(--sp-4); padding-right: var(--sp-4); }

  /* Header */
  .header-inner { grid-template-columns: auto 1fr auto; padding: 0 var(--sp-4); }
  .site-branding { grid-column: 2; }
  .header-nav-left { display: none; }
  .header-actions .header-icon:not(.cart-toggle):not(.search-toggle) { display: none; }
  .menu-toggle { display: flex; grid-column: 1; }

  /* Hero */
  .hero { min-height: 85vh; }
  .hero__content { padding: var(--sp-8) var(--sp-4); }
  .hero__title { font-size: clamp(2rem, 8vw, 3rem); }
  .hero__subtitle { font-size: var(--fs-sm); }

  .hero--split { grid-template-columns: 1fr; min-height: auto; }
  .hero--split .hero__media { aspect-ratio: 4/3; }
  .hero--split .hero__content { padding: var(--sp-10) var(--sp-6); }

  /* Categories */
  .categories-grid { grid-template-columns: repeat(2, 1fr); gap: var(--sp-3); }

  /* Products */
  .products-grid { grid-template-columns: repeat(2, 1fr); gap: var(--sp-3) var(--sp-3); }
  .products-grid--3col { grid-template-columns: repeat(2, 1fr); }

  /* Section header */
  .section-header { flex-direction: column; align-items: flex-start; gap: var(--sp-4); }
  .section-header__title { font-size: var(--fs-2xl); }

  /* Editorial */
  .editorial-banner { grid-template-columns: 1fr; min-height: auto; }
  .editorial-banner--reverse { direction: ltr; }
  .editorial-banner__media { aspect-ratio: 4/3; }
  .editorial-banner__content { padding: var(--sp-10) var(--sp-6); }
  .editorial-banner__title { font-size: var(--fs-3xl); }

  /* Trust bar */
  .trust-bar__inner { gap: var(--sp-6); }
  .trust-item__text { display: none; }

  /* Condition guide */
  .condition-guide__grid { grid-template-columns: repeat(2, 1fr); gap: var(--sp-6); }

  /* Newsletter */
  .newsletter__title { font-size: var(--fs-2xl); }
  .newsletter__form { flex-direction: column; }
  .newsletter__btn { border-left: none; border-top: 1px solid rgba(246,244,239,0.2); }

  /* Footer */
  .footer-main { grid-template-columns: 1fr 1fr; gap: var(--sp-8); }
  .footer-bottom { flex-direction: column; align-items: flex-start; }

  /* Shop */
  .shop-layout { grid-template-columns: 1fr; }
  .shop-filters { display: none; }
  .shop-filters.is-open { display: block; }

  /* Product */
  .product-gallery__thumbs { grid-template-columns: repeat(4, 1fr); }
  .product-details__title { font-size: var(--fs-3xl); }

  /* Cart drawer */
  .cart-drawer { width: 100%; }

  /* Product card quick add - always show on mobile */
  .product-card__quick-add { display: none; }

  /* Section spacing */
  .section { padding-top: var(--sp-16); padding-bottom: var(--sp-16); }
}

@media (max-width: 480px) {
  .categories-grid { grid-template-columns: 1fr; }
  .footer-main { grid-template-columns: 1fr; }

  .hero__actions { flex-direction: column; }
  .hero__actions .btn { width: 100%; }
}

/* ============================================================
   MISC UTILITIES
   ============================================================ */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

.text-center { text-align: center; }
.text-muted   { color: var(--color-text-muted); }
.text-accent  { color: var(--color-accent); }

.divider {
  width: 40px;
  height: 1px;
  background: var(--color-border-dark);
  margin: var(--sp-6) 0;
}

.divider--center { margin-left: auto; margin-right: auto; }

.no-scroll { overflow: hidden; }

/* ============================================================
   NORDÉN PRODUCT PAGE — SCOPED LAYOUT
   All form overrides prefixed with .nd-summary-col so they
   always beat WooCommerce's generic selectors. Same technique
   as CAIN & MARCÉL (cm-summary-col).
   ============================================================ */

.nd-product-page {
  padding-top: var(--header-height);
}

/* Two-column grid: gallery left, info right */
.nd-product-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: start;
  min-height: 90vh;
}

/* ── GALLERY COL ── */
.nd-gallery-col {
  position: sticky;
  top: var(--header-height);
  background: var(--color-bg-alt);
  align-self: start;
}

/* Main image */
.nd-main-img-wrap {
  width: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  background: var(--color-bg-alt);
}

.nd-main-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  transition: opacity 0.18s ease;
}

/* Thumbnail strip */
.nd-thumbs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
  padding: 4px 0 0;
  background: var(--color-bg-alt);
}

.nd-thumb {
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border: 1px solid transparent;
  padding: 0;
  cursor: pointer;
  background: var(--color-bg-alt);
  transition: border-color 0.15s;
}

.nd-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.nd-thumb--active {
  border-color: var(--color-text) !important;
}

/* Kill any WC gallery output that might still sneak through */
.nd-gallery-col .woocommerce-product-gallery,
.nd-gallery-col .woocommerce-product-gallery__image,
.nd-gallery-col .flex-control-nav,
.nd-gallery-col .flex-control-thumbs {
  display: none !important;
}

/* ── SUMMARY COL ── */
.nd-summary-col {
  padding: 48px 48px 64px 60px;
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* Breadcrumb */
.nd-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-wide);
  color: var(--color-text-muted);
  margin-bottom: var(--sp-6);
}
.nd-breadcrumb a { color: var(--color-text-muted); }
.nd-breadcrumb span { opacity: 0.4; }

/* Eyebrow / brand */
.nd-eyebrow {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  color: var(--color-accent);
  margin: 0 0 var(--sp-2);
}

/* Title */
.nd-product-title {
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 3vw, 2.8rem);
  font-weight: 300;
  letter-spacing: var(--ls-tight);
  line-height: 1.05;
  color: var(--color-text);
  margin: 0 0 var(--sp-4);
}

/* Condition */
.nd-condition {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  margin-bottom: var(--sp-6);
}
.nd-condition-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #5C9B6E;
  flex-shrink: 0;
}
.nd-condition-dot--fair  { background: #C4933F; }
.nd-condition-dot--good  { background: #5C9B6E; }
.nd-condition-dot--vgood { background: #3B7FBF; }
.nd-condition-dot--mint  { background: #7B5EA7; }
.nd-condition-label {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  color: var(--color-text-muted);
}

/* Price */
.nd-price {
  margin-bottom: var(--sp-4);
}
.nd-price .woocommerce-Price-amount,
.nd-price .price {
  font-family: var(--font-display) !important;
  font-size: var(--fs-3xl) !important;
  font-weight: 300 !important;
  letter-spacing: var(--ls-tight) !important;
  color: var(--color-text) !important;
}

/* Short desc */
.nd-short-desc {
  font-size: var(--fs-sm);
  color: var(--color-text-muted);
  line-height: var(--lh-loose);
  margin-bottom: var(--sp-6);
  padding-bottom: var(--sp-6);
  border-bottom: 1px solid var(--color-border);
}

/* ══════════════════════════════════════════════
   WOOCOMMERCE FORM — scoped to .nd-summary-col
   Higher specificity than WC's generic selectors
   without needing !important on most things.
   ══════════════════════════════════════════════ */

/* Form wrapper */
.nd-summary-col .variations_form,
.nd-summary-col form.cart {
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

/* Variation table — flatten to block */
.nd-summary-col .variations,
.nd-summary-col .variations tbody,
.nd-summary-col .variations tr,
.nd-summary-col .variations td,
.nd-summary-col .variations th {
  display: block !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
}

/* Variation label */
.nd-summary-col .variations .label label,
.nd-summary-col .variations td.label {
  font-family: var(--font-body) !important;
  font-size: var(--fs-xs) !important;
  font-weight: 400 !important;
  letter-spacing: var(--ls-widest) !important;
  text-transform: uppercase !important;
  color: var(--color-text-muted) !important;
  margin-bottom: 8px !important;
  display: block !important;
}

/* SELECT — size / variation dropdown */
.nd-summary-col select,
.nd-summary-col .variations select {
  width: 100% !important;
  height: 52px !important;
  padding: 0 40px 0 16px !important;
  background-color: var(--color-bg) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7' viewBox='0 0 12 7'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237A7167' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 0 !important;
  font-family: var(--font-body) !important;
  font-size: var(--fs-sm) !important;
  font-weight: 300 !important;
  color: var(--color-text) !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer !important;
  box-shadow: none !important;
  outline: none !important;
  transition: border-color 0.2s !important;
}

.nd-summary-col select:focus,
.nd-summary-col .variations select:focus {
  border-color: var(--color-text) !important;
}

/* Reset variations link */
.nd-summary-col .reset_variations {
  display: none !important;
}

/* Quantity + button row */
.nd-summary-col .woocommerce-variation-add-to-cart {
  display: grid !important;
  grid-template-columns: 64px 1fr !important;
  gap: 8px !important;
  align-items: center !important;
}

.nd-summary-col form.cart:not(.variations_form) {
  display: grid !important;
  grid-template-columns: 64px 1fr !important;
  gap: 8px !important;
  align-items: center !important;
}

/* QUANTITY INPUT */
.nd-summary-col .quantity {
  margin: 0 !important;
}

.nd-summary-col .quantity input.qty {
  width: 64px !important;
  height: 52px !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 0 !important;
  background: var(--color-bg) !important;
  color: var(--color-text) !important;
  font-family: var(--font-body) !important;
  font-size: var(--fs-sm) !important;
  text-align: center !important;
  box-shadow: none !important;
  outline: none !important;
  appearance: none !important;
  -moz-appearance: textfield !important;
  padding: 0 !important;
}

.nd-summary-col .quantity input.qty::-webkit-inner-spin-button,
.nd-summary-col .quantity input.qty::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
}

/* ADD TO CART BUTTON — scoped, beats WC's .woocommerce button.button.alt */
.nd-summary-col button.single_add_to_cart_button,
.nd-summary-col .single_add_to_cart_button,
.nd-summary-col button[type="submit"] {
  width: 100% !important;
  height: 52px !important;
  padding: 0 !important;
  background: var(--color-text) !important;
  background-color: var(--color-text) !important;
  background-image: none !important;
  color: var(--color-bg) !important;
  border: 1px solid var(--color-text) !important;
  border-radius: 0 !important;
  font-family: var(--font-body) !important;
  font-size: var(--fs-xs) !important;
  font-weight: 400 !important;
  letter-spacing: var(--ls-widest) !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  box-shadow: none !important;
  text-shadow: none !important;
  display: block !important;
  transition: background-color 0.25s ease, border-color 0.25s ease !important;
  line-height: 52px !important;
}

.nd-summary-col button.single_add_to_cart_button:hover,
.nd-summary-col .single_add_to_cart_button:hover,
.nd-summary-col button[type="submit"]:hover {
  background: var(--color-accent) !important;
  background-color: var(--color-accent) !important;
  border-color: var(--color-accent) !important;
  color: var(--color-bg) !important;
}

/* Express checkout */
.nd-summary-col #wcpay-product-checkout-widget,
.nd-summary-col #wc-stripe-product-checkout-widget-button-container,
.nd-summary-col .wc-stripe-product-gateway-container {
  margin-top: 10px !important;
  padding-top: 10px !important;
  border-top: 1px solid var(--color-border) !important;
}

/* Hide WC variation price (we show our own) */
.nd-summary-col .woocommerce-variation-price,
.nd-summary-col .woocommerce-variation-availability {
  display: none !important;
}

/* ── META TABLE ── */
.nd-meta {
  border-top: 1px solid var(--color-border);
  margin-top: var(--sp-6);
  padding-top: var(--sp-2);
}

.nd-meta-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--sp-3) 0;
  border-bottom: 1px solid var(--color-border);
}

.nd-meta-key {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  color: var(--color-text-muted);
}

.nd-meta-val {
  font-size: var(--fs-sm);
  color: var(--color-text);
  text-align: right;
}

/* ── ACCORDION ── */
.nd-accordion {
  margin-top: var(--sp-4);
  border-top: 1px solid var(--color-border);
}

.nd-acc-item {
  border-bottom: 1px solid var(--color-border);
}

.nd-acc-trigger {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--sp-5) 0;
  font-family: var(--font-body);
  font-size: var(--fs-xs);
  font-weight: 400;
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  color: var(--color-text);
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
}

.nd-acc-icon {
  width: 16px; height: 16px;
  position: relative;
  flex-shrink: 0;
}
.nd-acc-icon::before,
.nd-acc-icon::after {
  content: '';
  position: absolute;
  background: currentColor;
  transition: transform 0.25s ease, opacity 0.25s ease;
}
.nd-acc-icon::before { width: 16px; height: 1px; top: 50%; left: 0; transform: translateY(-50%); }
.nd-acc-icon::after  { width: 1px; height: 16px; left: 50%; top: 0; transform: translateX(-50%); }

.nd-acc-item.nd-acc-open .nd-acc-icon::after {
  transform: translateX(-50%) rotate(90deg);
  opacity: 0;
}

.nd-acc-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
}
.nd-acc-item.nd-acc-open .nd-acc-body {
  max-height: 600px;
}

.nd-acc-content {
  font-size: var(--fs-sm);
  line-height: var(--lh-loose);
  color: var(--color-text-muted);
  padding-bottom: var(--sp-5);
}

/* ── TRUST STRIP ── */
.nd-trust-strip {
  display: flex;
  gap: var(--sp-6);
  margin-top: var(--sp-6);
  padding-top: var(--sp-6);
  border-top: 1px solid var(--color-border);
  flex-wrap: wrap;
}

.nd-trust-item {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  flex: 1;
  min-width: 120px;
}

.nd-trust-item svg {
  width: 16px; height: 16px;
  stroke: var(--color-accent);
  fill: none;
  stroke-width: 1.5;
  flex-shrink: 0;
}

.nd-trust-item span {
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  color: var(--color-text-muted);
}

/* ── MOBILE ── */
@media (max-width: 768px) {
  .nd-product-page  { padding-top: var(--header-height); }
  .nd-product-grid  { grid-template-columns: 1fr; }

  .nd-gallery-col {
    position: relative;
    top: auto;
  }

  .nd-gallery-col .woocommerce-product-gallery__image img,
  .nd-gallery-col .woocommerce-product-gallery img {
    aspect-ratio: 1 / 1;
    object-fit: cover;
  }

  .nd-summary-col {
    padding: 24px 20px 48px !important;
    border-top: 1px solid var(--color-border);
  }

  .nd-product-title { font-size: 1.9rem !important; }

  .nd-summary-col .woocommerce-variation-add-to-cart,
  .nd-summary-col form.cart:not(.variations_form) {
    grid-template-columns: 56px 1fr !important;
  }

  .nd-trust-strip { gap: var(--sp-4); }
  .nd-trust-item span { display: none; }
}

/* ── HIDE BLEEDING WC ELEMENTS on product page ── */

/* "Clear" reset variations link */
.nd-summary-col .reset_variations,
.nd-summary-col a.reset_variations {
  display: none !important;
}

/* "X in stock" text */
.nd-summary-col .stock,
.nd-summary-col .woocommerce-variation-availability {
  display: none !important;
}

/* WC default product tabs — we removed them via PHP but belt+suspenders */
.woocommerce-tabs,
.wc-tabs-wrapper,
.woocommerce-product-tabs {
  display: none !important;
}

/* Blue links from WC tabs bleeding in */
.nd-summary-col .woocommerce-product-tabs a,
.nd-summary-col .wc-tabs a {
  display: none !important;
}

/* Variation price empty div (causes gap) */
.nd-summary-col .woocommerce-variation-price:empty,
.nd-summary-col .woocommerce-variation-price {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Fix: qty input overlapping button on mobile */
@media (max-width: 480px) {
  .nd-summary-col .woocommerce-variation-add-to-cart,
  .nd-summary-col form.cart:not(.variations_form) {
    grid-template-columns: 52px 1fr !important;
    gap: 6px !important;
  }
  .nd-summary-col .quantity input.qty {
    width: 52px !important;
  }
}

/* ============================================================
   PRODUCT SUMMARY — REFINED SPACING & TYPOGRAPHY (v1.8 fix)
   ============================================================ */

/* Tighten the whole summary column gap */
.nd-summary-col {
  padding: 28px 20px 48px !important;
  gap: 0 !important;
}

/* Breadcrumb — smaller, less prominent */
.nd-breadcrumb {
  font-size: 10px !important;
  letter-spacing: 0.06em !important;
  color: var(--color-text-light) !important;
  margin-bottom: 16px !important;
  gap: 6px !important;
}
.nd-breadcrumb a { color: var(--color-text-light) !important; }

/* Brand eyebrow */
.nd-eyebrow {
  font-size: 10px !important;
  letter-spacing: 0.22em !important;
  margin: 0 0 6px !important;
}

/* Title — tighter */
.nd-product-title {
  font-size: clamp(1.6rem, 7vw, 2.2rem) !important;
  margin: 0 0 10px !important;
  line-height: 1.05 !important;
}

/* Condition — inline, compact */
.nd-condition {
  margin-bottom: 14px !important;
  gap: 6px !important;
}
.nd-condition-dot {
  width: 7px !important;
  height: 7px !important;
}
.nd-condition-label {
  font-size: 10px !important;
  letter-spacing: 0.14em !important;
}

/* Price — refined, not enormous */
.nd-price {
  margin-bottom: 20px !important;
  padding-bottom: 20px !important;
  border-bottom: 1px solid var(--color-border) !important;
}
.nd-price .woocommerce-Price-amount,
.nd-price .price,
.nd-price bdi {
  font-family: var(--font-display) !important;
  font-size: 1.75rem !important;
  font-weight: 300 !important;
  letter-spacing: -0.02em !important;
  color: var(--color-text) !important;
}

/* Remove the orphan "1" that appears — that's the currency symbol rendering oddly */
.nd-price .woocommerce-Price-currencySymbol {
  font-size: 1rem !important;
  vertical-align: super !important;
  margin-right: 2px !important;
}

/* Short description */
.nd-short-desc {
  font-size: 13px !important;
  line-height: 1.75 !important;
  margin-bottom: 16px !important;
  padding-bottom: 16px !important;
  color: var(--color-text-muted) !important;
  border-bottom: 1px solid var(--color-border) !important;
}

/* Variation select — full width, clean */
.nd-summary-col select,
.nd-summary-col .variations select {
  height: 50px !important;
  font-size: 13px !important;
  border-color: var(--color-border) !important;
  margin-bottom: 0 !important;
}

/* Qty + ATC row */
.nd-summary-col .woocommerce-variation-add-to-cart,
.nd-summary-col form.cart:not(.variations_form) {
  grid-template-columns: 56px 1fr !important;
  gap: 6px !important;
  margin-top: 0 !important;
}

.nd-summary-col .quantity input.qty {
  height: 50px !important;
  width: 56px !important;
  font-size: 14px !important;
}

.nd-summary-col button.single_add_to_cart_button,
.nd-summary-col .single_add_to_cart_button,
.nd-summary-col button[type="submit"] {
  height: 50px !important;
  line-height: 50px !important;
  font-size: 10px !important;
  letter-spacing: 0.2em !important;
}

/* Google Pay — match height */
.nd-summary-col #wcpay-product-checkout-widget,
.nd-summary-col #wc-stripe-product-checkout-widget-button-container {
  margin-top: 8px !important;
  padding-top: 8px !important;
  border-top: 1px solid var(--color-border) !important;
}

/* Accordions — tighter */
.nd-acc-trigger {
  padding: 14px 0 !important;
  font-size: 10px !important;
  letter-spacing: 0.18em !important;
}

.nd-acc-content {
  font-size: 13px !important;
  padding-bottom: 14px !important;
  line-height: 1.75 !important;
}

/* Trust strip — horizontal, compact */
.nd-trust-strip {
  margin-top: 16px !important;
  padding-top: 16px !important;
  gap: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
}

.nd-trust-item {
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  gap: 6px !important;
  padding: 12px 4px !important;
  min-width: 0 !important;
}

.nd-trust-item svg {
  width: 18px !important;
  height: 18px !important;
}

.nd-trust-item span {
  display: block !important;
  font-size: 9px !important;
  letter-spacing: 0.1em !important;
  line-height: 1.3 !important;
}

/* Also fix the gallery — show thumbs in a proper strip not a grid */
.nd-thumbs {
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 3px !important;
  padding-top: 3px !important;
}

.nd-thumb {
  aspect-ratio: 1 / 1 !important;
}

/* ============================================================
   PRODUCT PAGE — POLISH PASS (v1.9 fixes)
   ============================================================ */

/* ── PRICE: clean format, no floating "kr" ── */
.nd-price {
  margin-bottom: 16px !important;
  padding-bottom: 16px !important;
  line-height: 1 !important;
}

/* Hide WooCommerce's currency symbol — we'll show SEK via a cleaner layout */
.nd-price .woocommerce-Price-currencySymbol {
  display: none !important;
}

/* Main price amount */
.nd-price .woocommerce-Price-amount,
.nd-price .price,
.nd-price bdi {
  font-family: var(--font-display) !important;
  font-size: 2rem !important;
  font-weight: 300 !important;
  letter-spacing: -0.02em !important;
  color: var(--color-text) !important;
  display: inline !important;
}

/* Append SEK after the amount using a pseudo element on the wrapper */
.nd-price .woocommerce-Price-amount::after {
  content: ' SEK' !important;
  font-family: var(--font-body) !important;
  font-size: 0.75rem !important;
  font-weight: 300 !important;
  letter-spacing: 0.12em !important;
  color: var(--color-text-muted) !important;
  vertical-align: middle !important;
  margin-left: 6px !important;
}

/* Sale price: strikethrough original */
.nd-price del .woocommerce-Price-amount::after { display: none !important; }
.nd-price del .woocommerce-Price-amount {
  font-size: 0.9rem !important;
  color: var(--color-text-light) !important;
}
.nd-price ins {
  text-decoration: none !important;
  background: none !important;
}

/* ── SIZE LABEL: left-align, tighten ── */
.nd-summary-col .variations td.label,
.nd-summary-col .variations .label label {
  text-align: left !important;
  padding-bottom: 6px !important;
  display: block !important;
  margin-bottom: 0 !important;
}

/* ── ADD TO BAG: disabled state should still look intentional ── */
.nd-summary-col button.single_add_to_cart_button:disabled,
.nd-summary-col .single_add_to_cart_button.disabled,
.nd-summary-col button[type="submit"]:disabled {
  background: var(--color-text) !important;
  background-color: var(--color-text) !important;
  color: var(--color-bg) !important;
  border-color: var(--color-text) !important;
  opacity: 0.45 !important;
  cursor: not-allowed !important;
}

/* ── FORM: remove gap between size label and select ── */
.nd-summary-col .variations_form,
.nd-summary-col form.cart {
  gap: 10px !important;
}

.nd-summary-col .variations {
  margin-bottom: 0 !important;
}

/* ── GALLERY: main image must show above thumbs ── */
.nd-main-img-wrap {
  width: 100% !important;
  background: var(--color-bg-alt) !important;
  overflow: hidden !important;
  display: block !important;
}

.nd-main-img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  object-fit: cover !important;
  transition: opacity 0.18s ease !important;
  aspect-ratio: unset !important;
  min-height: 280px !important;
}

/* Thumbnail strip — single row, no wrapping */
.nd-thumbs {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 3px !important;
  padding: 3px 0 0 !important;
  background: var(--color-bg) !important;
}

.nd-thumb {
  aspect-ratio: 1 / 1 !important;
  border: 2px solid transparent !important;
  background: var(--color-bg-alt) !important;
  overflow: hidden !important;
  padding: 0 !important;
  cursor: pointer !important;
  display: block !important;
}

.nd-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

.nd-thumb--active {
  border-color: var(--color-text) !important;
}

/* ── OVERALL SUMMARY SPACING tighten ── */
.nd-summary-col {
  padding: 20px 18px 40px !important;
}

.nd-breadcrumb { margin-bottom: 12px !important; }
.nd-product-title { margin: 0 0 8px !important; }
.nd-condition { margin-bottom: 12px !important; }

/* ============================================================
   SWIPEABLE GALLERY
   ============================================================ */
.nd-gallery-col {
  position: sticky;
  top: var(--header-height);
  align-self: start;
  background: var(--color-bg-alt);
  overflow: hidden;
}

.nd-swipe-wrap {
  position: relative;
  overflow: hidden;
  background: var(--color-bg-alt);
  aspect-ratio: 1 / 1;
  cursor: grab;
}

.nd-swipe-wrap:active { cursor: grabbing; }

.nd-swipe-track {
  display: flex;
  width: 100%;
  height: 100%;
  transition: transform 0.35s cubic-bezier(0.25, 0.1, 0.25, 1);
  will-change: transform;
}

.nd-swipe-slide {
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.nd-swipe-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
}

/* Counter pill */
.nd-img-counter {
  position: absolute;
  bottom: 14px;
  right: 14px;
  background: rgba(28,27,24,0.55);
  color: #F6F4EF;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 300;
  letter-spacing: 0.12em;
  padding: 4px 10px;
  backdrop-filter: blur(6px);
  pointer-events: none;
  z-index: 2;
}

/* Prev / next arrows */
.nd-swipe-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  background: rgba(246,244,239,0.85);
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 3;
  opacity: 0;
  transition: opacity 0.2s;
  backdrop-filter: blur(4px);
}

.nd-swipe-wrap:hover .nd-swipe-arrow { opacity: 1; }

.nd-swipe-arrow--prev { left: 10px; }
.nd-swipe-arrow--next { right: 10px; }

.nd-swipe-arrow svg {
  width: 16px;
  height: 16px;
  stroke: var(--color-text);
  fill: none;
  stroke-width: 2;
}

/* Thumbnail strip */
.nd-thumbs {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 3px !important;
  padding: 3px 0 0 !important;
  background: var(--color-bg) !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
}

.nd-thumbs::-webkit-scrollbar { display: none !important; }

.nd-thumb {
  aspect-ratio: 1 / 1 !important;
  border: 2px solid transparent !important;
  background: var(--color-bg-alt) !important;
  overflow: hidden !important;
  padding: 0 !important;
  cursor: pointer !important;
  display: block !important;
  transition: border-color 0.15s !important;
}

.nd-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

.nd-thumb--active {
  border-color: var(--color-text) !important;
}

/* ============================================================
   SIZE PILLS
   ============================================================ */
.nd-size-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 2px;
}

.nd-pill {
  min-width: 48px;
  height: 44px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-border);
  background: var(--color-bg);
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 300;
  letter-spacing: 0.06em;
  color: var(--color-text);
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
  border-radius: 0;
  -webkit-tap-highlight-color: transparent;
}

.nd-pill:hover {
  border-color: var(--color-text);
}

.nd-pill--active {
  background: var(--color-text) !important;
  color: var(--color-bg) !important;
  border-color: var(--color-text) !important;
}

.nd-pill--soldout {
  opacity: 0.35;
  cursor: not-allowed;
  text-decoration: line-through;
}

/* Hide the native WC select (it still handles form submission) */
.nd-summary-col select[id^="nd-select-"] {
  display: none !important;
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* ============================================================
   STICKY ADD TO BAG BAR
   ============================================================ */
.nd-sticky-atc {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 200;
  background: var(--color-bg);
  border-top: 1px solid var(--color-border);
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
  transform: translateY(100%);
  transition: transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
  will-change: transform;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.nd-sticky-atc.is-visible {
  transform: translateY(0);
}

.nd-sticky-atc__inner {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
  max-width: 600px;
  margin: 0 auto;
}

.nd-sticky-atc__info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  overflow: hidden;
}

.nd-sticky-atc__title {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 300;
  letter-spacing: -0.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--color-text);
}

.nd-sticky-atc__price {
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 300;
  letter-spacing: 0.08em;
  color: var(--color-text-muted);
}

/* Price inside sticky bar — no SEK suffix via CSS (keep it clean) */
.nd-sticky-atc__price .woocommerce-Price-amount::after {
  content: ' SEK' !important;
  font-size: 9px !important;
}
.nd-sticky-atc__price .woocommerce-Price-currencySymbol {
  display: none !important;
}

.nd-sticky-atc__btn {
  height: 44px;
  padding: 0 20px;
  background: var(--color-text);
  color: var(--color-bg);
  border: none;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.2s;
  flex-shrink: 0;
}

.nd-sticky-atc__btn:hover {
  background: var(--color-accent);
}

/* On desktop — hide sticky bar (page has room for full layout) */
@media (min-width: 769px) {
  .nd-sticky-atc { display: none !important; }
}

/* ============================================================
   GALLERY FIX — v2.1 patches
   ============================================================ */

/* Main image: contain not cover so full product is visible */
.nd-swipe-wrap {
  aspect-ratio: 1 / 1 !important;
  background: #fff !important;
}

.nd-swipe-img {
  object-fit: contain !important;
  object-position: center center !important;
  background: #fff !important;
  padding: 12px !important;
}

/* Thumbnail strip: single horizontal row, scrollable */
.nd-thumbs {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  grid-template-columns: unset !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  gap: 4px !important;
  padding: 4px 0 0 !important;
  background: #fff !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
}

.nd-thumbs::-webkit-scrollbar { display: none !important; }

.nd-thumb {
  flex: 0 0 72px !important;
  width: 72px !important;
  height: 72px !important;
  aspect-ratio: 1 / 1 !important;
  background: #fff !important;
}

.nd-thumb img {
  object-fit: contain !important;
  padding: 4px !important;
  background: #fff !important;
}

/* Sticky bar: sits above safe area, no overlap with thumbs */
.nd-sticky-atc {
  padding-bottom: calc(12px + env(safe-area-inset-bottom)) !important;
}

/* Arrow buttons: always visible on mobile */
@media (max-width: 768px) {
  .nd-swipe-arrow { opacity: 0 !important; pointer-events: none !important; }
}

/* ============================================================
   PRODUCT PAGE MOBILE — NUCLEAR OVERRIDE v2.2
   ============================================================ */

/* Force single column on mobile — grid override wasn't specific enough */
@media (max-width: 768px) {
  .nd-product-page {
    padding-top: 0 !important;
  }

  .nd-product-grid {
    display: block !important;
    grid-template-columns: unset !important;
    width: 100% !important;
  }

  /* Gallery: full width, not sticky */
  .nd-gallery-col {
    position: relative !important;
    top: auto !important;
    width: 100% !important;
    display: block !important;
  }

  /* Swipe wrap: square but not too tall */
  .nd-swipe-wrap {
    aspect-ratio: 1 / 1 !important;
    width: 100% !important;
    max-height: 75vw !important;
  }

  /* Summary: full width below gallery */
  .nd-summary-col {
    width: 100% !important;
    display: block !important;
    padding: 20px 18px 120px !important; /* bottom padding for sticky bar */
  }

  /* Thumbnails: horizontal strip, fixed height */
  .nd-thumbs {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    height: 72px !important;
    gap: 3px !important;
    padding: 3px 0 0 !important;
  }

  .nd-thumb {
    flex: 0 0 72px !important;
    height: 68px !important;
    width: 72px !important;
  }

  /* Sticky ATC: above home bar */
  .nd-sticky-atc {
    display: flex !important;
    padding: 10px 16px !important;
    padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .nd-sticky-atc__btn {
    min-width: 120px !important;
  }
}

/* ============================================================
   GALLERY IMAGE HEIGHT FIX — v2.3
   ============================================================ */
@media (max-width: 768px) {
  .nd-swipe-wrap {
    aspect-ratio: unset !important;
    max-height: unset !important;
    height: 85vw !important;
  }

  .nd-swipe-track {
    height: 100% !important;
  }

  .nd-swipe-slide {
    height: 100% !important;
  }

  .nd-swipe-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
    padding: 16px !important;
  }
}

/* ============================================================
   PRODUCT PAGE VISUAL POLISH — v2.4
   ============================================================ */

/* ── GALLERY: full bleed edge to edge ── */
@media (max-width: 768px) {
  .nd-gallery-col {
    margin: 0 !important;
    width: 100vw !important;
    margin-left: calc(-1 * var(--sp-4, 0px)) !important;
  }

  .nd-swipe-wrap {
    height: 92vw !important;
    width: 100% !important;
    border-radius: 0 !important;
    background: #f8f7f4 !important;
  }

  .nd-swipe-img {
    padding: 20px !important;
    object-fit: contain !important;
    background: #f8f7f4 !important;
  }

  /* Counter — more refined */
  .nd-img-counter {
    font-size: 9px !important;
    letter-spacing: 0.15em !important;
    padding: 3px 8px !important;
    bottom: 10px !important;
    right: 10px !important;
    background: rgba(28,27,24,0.4) !important;
    backdrop-filter: blur(8px) !important;
  }

  /* Thumbnail strip — full width, slightly taller */
  .nd-thumbs {
    width: 100% !important;
    height: 68px !important;
    padding: 4px !important;
    gap: 4px !important;
    background: #f8f7f4 !important;
    border-top: none !important;
  }

  .nd-thumb {
    flex: 0 0 60px !important;
    height: 60px !important;
    width: 60px !important;
    border-radius: 0 !important;
  }

  .nd-thumb img {
    padding: 3px !important;
    background: #f8f7f4 !important;
  }

  .nd-thumb--active {
    border: 1.5px solid var(--color-text) !important;
  }

  /* ── SUMMARY: tighter, more editorial ── */
  .nd-summary-col {
    padding: 18px 18px 130px !important;
    border-top: 1px solid var(--color-border) !important;
  }

  .nd-breadcrumb {
    margin-bottom: 10px !important;
    font-size: 10px !important;
    opacity: 0.5 !important;
  }

  .nd-product-title {
    font-size: clamp(1.7rem, 7.5vw, 2.2rem) !important;
    margin-bottom: 6px !important;
    letter-spacing: -0.03em !important;
  }

  .nd-condition {
    margin-bottom: 14px !important;
  }

  /* Price: bigger, cleaner */
  .nd-price {
    margin-bottom: 18px !important;
    padding-bottom: 18px !important;
  }

  .nd-price .woocommerce-Price-amount,
  .nd-price .price,
  .nd-price bdi {
    font-size: 1.9rem !important;
    letter-spacing: -0.03em !important;
  }

  .nd-price .woocommerce-Price-amount::after {
    font-size: 0.65rem !important;
    letter-spacing: 0.18em !important;
    margin-left: 8px !important;
    color: var(--color-text-light) !important;
  }

  /* Size label */
  .nd-summary-col .variations td.label,
  .nd-summary-col .variations .label label {
    font-size: 9px !important;
    letter-spacing: 0.25em !important;
    margin-bottom: 10px !important;
    color: var(--color-text-muted) !important;
  }

  /* Size pills */
  .nd-size-pills {
    gap: 6px !important;
    margin-bottom: 2px !important;
  }

  .nd-pill {
    min-width: 52px !important;
    height: 46px !important;
    font-size: 12px !important;
    border-color: var(--color-border) !important;
  }

  /* ATC button — ALWAYS dark, disabled just slightly muted */
  .nd-summary-col button.single_add_to_cart_button,
  .nd-summary-col .single_add_to_cart_button,
  .nd-summary-col button[type="submit"] {
    background: var(--color-text) !important;
    background-color: #1C1B18 !important;
    color: #F6F4EF !important;
    border-color: #1C1B18 !important;
    height: 52px !important;
    line-height: 52px !important;
    font-size: 10px !important;
    letter-spacing: 0.22em !important;
  }

  .nd-summary-col button.single_add_to_cart_button:disabled,
  .nd-summary-col .single_add_to_cart_button.disabled {
    background: #1C1B18 !important;
    background-color: #1C1B18 !important;
    color: rgba(246,244,239,0.5) !important;
    opacity: 1 !important;
  }

  /* Qty box */
  .nd-summary-col .quantity input.qty {
    height: 52px !important;
    font-size: 14px !important;
    background: var(--color-bg) !important;
    border-color: var(--color-border) !important;
  }

  /* Google Pay — tighter */
  .nd-summary-col #wcpay-product-checkout-widget,
  .nd-summary-col #wc-stripe-product-checkout-widget-button-container,
  [id*="express-payment"] {
    margin-top: 8px !important;
    border-top: 1px solid var(--color-border) !important;
    padding-top: 8px !important;
  }

  /* Accordions */
  .nd-accordion {
    margin-top: 20px !important;
  }

  /* Trust strip: horizontal, centred icons */
  .nd-trust-strip {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    margin-top: 20px !important;
    padding-top: 20px !important;
  }

  .nd-trust-item span {
    font-size: 8px !important;
    display: block !important;
  }
}
