:root {
  --header-height: 68px;
  --bg: #f6f5f1;
  --surface: #fffefe;
  --surface-2: #eeebe3;
  --ink: #171717;
  --muted: #5d625c;
  --line: #e4ded2;
  --accent: #b9974e;
  --accent-dark: #243e35;
  --accent-soft: #efe7d5;
  --rose: #e8bdc8;
  --amethyst: #8f72a8;
  --citrine: #b9974e;
  --obsidian: #24292d;
  --radius: 16px;
  --shadow: 0 14px 34px rgba(36, 62, 53, 0.12);
}

/* Designer collection keeps browsing cards minimal before customization. */
body.designer-page #designerGrid .product-stones,
body.designer-page #designerGrid .product-actions > .price {
  display: none !important;
}

body.designer-page #designerGrid .product-meta span {
  justify-content: center !important;
  text-align: center !important;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background:
    radial-gradient(circle at 18% 8%, rgba(185, 151, 78, 0.12), transparent 26%),
    linear-gradient(180deg, #fbfaf7 0, var(--bg) 520px, #faf9f5 100%);
  color: var(--ink);
  font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  line-height: 1.6;
}

a {
  color: inherit;
  text-decoration: none;
}

.skip-link {
  position: absolute;
  left: 16px;
  top: -48px;
  z-index: 80;
  padding: 10px 14px;
  border-radius: 999px;
  background: #173040;
  color: #f7fbfc;
  font-weight: 800;
}

.skip-link:focus {
  top: 14px;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline: 3px solid rgba(45, 91, 116, 0.25);
  outline-offset: 3px;
}

button,
input,
select {
  font: inherit;
}

img {
  display: block;
  width: 100%;
}

.page {
  min-height: 100dvh;
  overflow-x: hidden;
  padding-top: var(--header-height);
}

.container {
  width: min(1160px, calc(100% - 40px));
  margin: 0 auto;
}

.site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 30;
  background: rgba(245, 248, 250, 0.88);
  border-bottom: 1px solid rgba(216, 226, 231, 0.9);
  backdrop-filter: blur(18px);
}

.nav {
  min-height: 68px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.brand {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.brand-logo {
  display: block;
  width: clamp(168px, 18vw, 232px);
  height: auto;
  max-height: 54px;
  object-fit: contain;
}

.brand-mark {
  display: none;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(45, 91, 116, 0.22);
  border-radius: 999px;
  background: conic-gradient(from 42deg, #f8fcfd, #b8cdd8, #ffffff, #d6e5eb, #f8fcfd);
  box-shadow: inset 0 0 0 7px rgba(255, 255, 255, 0.52);
}

.nav-links {
  display: flex;
  align-items: center;
  gap: 22px;
  color: #32414b;
  font-size: 14px;
}

.cart-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.cart-badge {
  display: none;
  min-width: 18px;
  height: 18px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #173040;
  color: #f7fbfc;
  font-size: 11px;
  line-height: 1;
}

.cart-badge.is-visible {
  display: inline-flex;
}

.nav-links a[aria-current="page"] {
  color: var(--accent-dark);
  font-weight: 700;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 20px;
  border-radius: 999px;
  border: 1px solid transparent;
  background: var(--accent-dark);
  color: #f8fbfc;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
  transition: transform 180ms ease, background 180ms ease, border-color 180ms ease;
}

.button:hover {
  background: #244c61;
  transform: translateY(-1px);
}

.button:disabled,
.text-button:disabled {
  cursor: default;
  opacity: 0.68;
}

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

.button.secondary {
  background: transparent;
  border-color: rgba(45, 91, 116, 0.28);
  color: var(--accent-dark);
}

.button.secondary:hover {
  background: rgba(45, 91, 116, 0.06);
}

.hero {
  min-height: min(680px, calc(100dvh - 68px));
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr);
  gap: 54px;
  align-items: center;
  padding: 42px 0 58px;
}

.hero-copy {
  max-width: 560px;
}

.kicker {
  color: #254e63;
  font-size: 13px;
  font-weight: 700;
  margin: 0 0 18px;
}

h1,
h2,
h3 {
  margin: 0;
  line-height: 1.08;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

h1 {
  font-size: clamp(44px, 6vw, 76px);
  max-width: 780px;
  color: #101920;
}

h2 {
  font-size: clamp(30px, 4vw, 48px);
}

h3 {
  font-size: 22px;
}

.lead {
  max-width: 58ch;
  margin: 24px 0 0;
  color: #42535e;
  font-size: 18px;
  text-wrap: pretty;
}

.hero-actions,
.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.hero-media {
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  background: var(--surface);
  border: 1px solid rgba(152, 177, 189, 0.34);
  box-shadow: 0 24px 60px rgba(31, 70, 90, 0.16);
  aspect-ratio: 1.42;
}

.hero-media img {
  height: 100%;
  object-fit: cover;
}

.hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(243, 247, 249, 0.04), transparent 44%);
  pointer-events: none;
}

.hero-full {
  position: relative;
  min-height: min(660px, calc(100dvh - 68px));
  display: grid;
  align-items: center;
  overflow: hidden;
  border-bottom: 1px solid rgba(216, 226, 231, 0.82);
  background: #dbeaf2;
}

.hero-full-image {
  position: absolute;
  inset: 0;
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: 72% center;
  filter: saturate(0.9);
}

.home-hero .hero-full-image {
  object-position: 76% center;
  filter: saturate(1.02) contrast(1.04) brightness(1.03);
}

.hero-full-gallery .hero-full-image {
  object-position: 76% center;
}

.hero-full::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(239, 247, 250, 0.94) 0%, rgba(239, 247, 250, 0.82) 34%, rgba(239, 247, 250, 0.28) 64%, rgba(239, 247, 250, 0.08) 100%),
    linear-gradient(180deg, rgba(239, 247, 250, 0.35), rgba(239, 247, 250, 0.74));
}

.home-hero::before {
  background:
    radial-gradient(ellipse 58% 78% at 16% 51%, rgba(247, 251, 252, 0.9) 0%, rgba(247, 251, 252, 0.78) 34%, rgba(247, 251, 252, 0.42) 54%, rgba(247, 251, 252, 0.12) 72%, rgba(247, 251, 252, 0) 100%),
    linear-gradient(90deg, rgba(239, 247, 250, 0.42) 0%, rgba(239, 247, 250, 0.16) 42%, rgba(239, 247, 250, 0) 74%),
    linear-gradient(180deg, rgba(239, 247, 250, 0.02), rgba(239, 247, 250, 0.18));
}

.hero-full-content {
  position: relative;
  z-index: 2;
  padding: 76px 0 84px;
}

.hero-full .hero-copy {
  max-width: 590px;
}

.home-hero .hero-copy {
  max-width: 620px;
}

.home-hero {
  aspect-ratio: 1672 / 941;
}

.hero-line {
  display: block;
}

.hero-full .lead {
  max-width: 44ch;
}

.home-hero .lead {
  color: #334854;
}

.meaning-section {
  padding-bottom: 36px;
}

.meaning-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.meaning-card {
  min-height: 238px;
  display: grid;
  align-content: space-between;
  gap: 18px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255, 254, 254, 0.84), rgba(255, 254, 254, 0.96)),
    var(--tone, #f4f1f8);
  color: var(--ink);
  transition: transform 180ms ease, border-color 180ms ease, background 180ms ease;
}

.meaning-card:hover {
  transform: translateY(-3px);
  border-color: rgba(87, 74, 115, 0.28);
}

.meaning-card span {
  color: var(--accent-dark);
  font-size: 13px;
  font-weight: 800;
}

.meaning-card strong {
  display: block;
  font-size: 23px;
  line-height: 1.12;
}

.meaning-card p {
  margin: 0;
  color: var(--muted);
}

.meaning-card--calm {
  --tone: #edf6f8;
}

.meaning-card--love {
  --tone: #f8ebf0;
}

.meaning-card--protect {
  --tone: #eff0f3;
}

.meaning-card--confidence {
  --tone: #fbf2d8;
}

.standard-strip {
  display: grid;
  grid-template-columns: 1.2fr repeat(3, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--line);
}

.standard-item {
  min-height: 132px;
  padding: 22px;
  background: rgba(251, 253, 254, 0.86);
  transition: background 180ms ease, color 180ms ease, transform 180ms ease;
}

.standard-item:first-child {
  background: #2f2841;
  color: #f6fbfc;
}

.standard-strip:hover .standard-item:first-child:not(:hover) {
  background: rgba(251, 253, 254, 0.86);
  color: var(--ink);
}

.standard-strip:hover .standard-item:first-child:not(:hover) span {
  color: var(--muted);
}

.standard-item:hover {
  background: #2f2841;
  color: #f6fbfc;
  transform: translateY(-1px);
}

.standard-item strong {
  display: block;
  font-size: 18px;
  margin-bottom: 8px;
}

.standard-item span {
  color: var(--muted);
}

.standard-item:first-child span {
  color: #c7d7de;
}

.standard-item:hover span {
  color: #c7d7de;
}

.section {
  padding: 78px 0;
}

.section.tight {
  padding-top: 34px;
}

.section-header {
  display: grid;
  gap: 16px;
  max-width: 720px;
  margin-bottom: 32px;
}

.section-header p {
  margin: 0;
  color: var(--muted);
  font-size: 17px;
}

.collection-layout {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 22px;
  align-items: stretch;
}

.feature-product,
.panel,
.product-card,
.cart-card,
.checkout-card {
  background: var(--surface);
  border: 1px solid rgba(216, 226, 231, 0.95);
  border-radius: var(--radius);
}

.feature-product {
  overflow: hidden;
  box-shadow: var(--shadow);
}

.feature-product img {
  height: 420px;
  object-fit: cover;
  transition: transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
}

.feature-product:hover img,
.wear-hero:hover img,
.image-panel:hover img {
  transform: scale(1.025);
}

.feature-product .content,
.panel {
  padding: 24px;
}

.product-list {
  display: grid;
  gap: 14px;
}

.product-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 20px;
  align-items: center;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.72);
  cursor: pointer;
  transition: transform 180ms ease, border-color 180ms ease, background 180ms ease;
}

.product-row:hover {
  transform: translateY(-2px);
  border-color: rgba(45, 91, 116, 0.24);
  background: rgba(251, 253, 254, 0.96);
}

.product-row p,
.feature-product p,
.product-card p,
.panel p,
.cart-card p,
.checkout-card p {
  color: var(--muted);
  margin: 8px 0 0;
}

.price {
  color: var(--accent-dark);
  font-weight: 800;
  white-space: nowrap;
}

.cart-card > .price {
  position: absolute;
  right: 88px;
  bottom: 18px;
}

.grid-3,
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.gallery-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.product-card {
  overflow: hidden;
  cursor: pointer;
  transition: transform 180ms ease, border-color 180ms ease;
}

.product-card:hover {
  transform: translateY(-3px);
  border-color: rgba(45, 91, 116, 0.28);
}

.product-card img {
  height: auto;
  object-fit: contain;
  object-position: var(--product-pos, center);
}

.product-card .content {
  padding: 18px;
}

.product-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 14px;
  color: var(--muted);
  font-size: 13px;
}

.product-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 18px;
}

.product-actions .cart-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.gallery-grid.is-filtering .product-card {
  opacity: 0.3;
  transform: translateY(6px);
}

.tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.tag {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--surface-2);
  color: #3d4e58;
  font-size: 13px;
  font-weight: 700;
}

.tag.dark {
  background: #2f2841;
  color: #f7fbfc;
}

.split {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 28px;
  align-items: center;
}

.image-panel {
  overflow: hidden;
  border-radius: 18px;
  background: var(--surface);
  box-shadow: var(--shadow);
}

.image-panel img {
  height: 520px;
  object-fit: cover;
  transition: transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
}

.detail-list {
  display: grid;
  gap: 12px;
  margin-top: 22px;
}

.detail-item {
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
}

.detail-item strong {
  display: block;
}

.customizer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 26px;
  align-items: start;
}

.step-stack {
  display: grid;
  gap: 18px;
}

.option-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
}

.choice {
  min-height: 58px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: #fbfdfe;
  color: var(--ink);
  cursor: pointer;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.choice:hover {
  border-color: rgba(45, 91, 116, 0.32);
  transform: translateY(-1px);
}

.choice.is-active {
  border-color: var(--accent-dark);
  box-shadow: 0 0 0 3px rgba(45, 91, 116, 0.12);
}

.value-changed {
  animation: valuePulse 360ms ease both;
}

.input-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  margin-top: 18px;
}

.input-row input,
.note-field textarea {
  min-height: 48px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 0 14px;
  background: #fbfdfe;
  color: var(--ink);
}

.input-row input.is-invalid {
  border-color: #b86161;
  box-shadow: 0 0 0 3px rgba(184, 97, 97, 0.12);
}

.input-row input.is-valid {
  border-color: rgba(45, 91, 116, 0.46);
}

.field-hint {
  margin: 10px 0 0;
  color: var(--muted);
  font-size: 14px;
}

.field-hint.is-warning {
  color: #8a3c3c;
}

.note-field textarea {
  min-height: 96px;
  padding: 12px 14px;
  resize: vertical;
}

.preview {
  position: sticky;
  top: 92px;
}

.preview-visual {
  border-radius: 14px;
  overflow: hidden;
  margin-bottom: 18px;
}

.preview-visual img {
  height: 240px;
  object-fit: cover;
}

.preview-title {
  margin-bottom: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.preview-title p {
  margin-top: 8px;
}

.timeline {
  display: grid;
  gap: 10px;
  margin-top: 18px;
  padding: 14px;
  border-radius: 14px;
  background: var(--surface-2);
  color: #3f515c;
  font-size: 14px;
}

.summary-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
}

.summary-row strong {
  color: var(--ink);
}

.checkout-options {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.checkout-options h3 {
  margin: 0 0 2px;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.2;
}

.checkout-option {
  position: relative;
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-height: 76px;
  padding: 14px 16px;
  border: 1px solid rgba(82, 63, 59, 0.14);
  border-radius: 16px;
  background: rgba(255, 253, 251, 0.78);
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease;
}

.checkout-option:has(input:checked) {
  border-color: rgba(88, 112, 82, 0.7);
  background: #edf4ea;
}

.checkout-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.checkout-option-dot {
  width: 24px;
  height: 24px;
  border: 2px solid rgba(82, 63, 59, 0.2);
  border-radius: 999px;
  background: #fff;
}

.checkout-option input:checked + .checkout-option-dot {
  border-color: #6f8265;
  box-shadow: inset 0 0 0 6px #fff;
  background: #6f8265;
}

.checkout-option-copy {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.checkout-option-copy strong {
  color: var(--ink);
  font-size: 16px;
  line-height: 1.15;
}

.checkout-option-copy small {
  color: #706b68;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
}

.checkout-option-price {
  color: #9a5651;
  font-size: 17px;
  font-weight: 900;
  white-space: nowrap;
}

.checkout-option:has(input:checked) .checkout-option-price {
  color: #4f6b45;
}

body.cart-page .checkout-options {
  grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  margin-top: 14px;
}

body.cart-page .checkout-options h3 {
  margin: 0;
  font-size: 16px;
  white-space: nowrap;
}

body.cart-page .checkout-option {
  grid-template-columns: 18px minmax(0, 1fr) auto;
  gap: 7px;
  min-height: 42px;
  padding: 9px 10px;
  border-radius: 12px;
}

body.cart-page .checkout-option-dot {
  width: 16px;
  height: 16px;
  border-width: 1.5px;
}

body.cart-page .checkout-option input:checked + .checkout-option-dot {
  box-shadow: inset 0 0 0 4px #fff;
}

body.cart-page .checkout-option-copy strong {
  overflow: hidden;
  font-size: 13px;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cart-page .checkout-option-copy small {
  display: none;
}

body.cart-page .checkout-option-price {
  font-size: 13px;
}

body.cart-page .checkout-options--extras {
  grid-template-columns: 1fr;
  gap: 8px;
}

body.cart-page .checkout-options--extras h3 {
  margin-bottom: 0;
}

@keyframes valuePulse {
  0% {
    color: var(--accent-dark);
    transform: translateY(-1px);
  }
  100% {
    color: var(--ink);
    transform: translateY(0);
  }
}

.filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 24px;
}

.filter-bar button {
  min-height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: #fbfdfe;
  color: #3a4953;
  cursor: pointer;
}

.filter-bar button.is-active {
  background: var(--accent-dark);
  border-color: var(--accent-dark);
  color: #f8fbfc;
}

.cart-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 26px;
  align-items: start;
}

#cartMount {
  display: grid;
  gap: 18px;
}

.cart-card {
  position: relative;
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 18px;
  padding: 44px 16px 54px;
  align-items: center;
  min-width: 0;
}

.cart-card h3 {
  display: none;
}

.cart-select {
  position: absolute;
  top: 14px;
  left: 16px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 26px;
  cursor: pointer;
}

.cart-select input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.cart-select span {
  width: 24px;
  height: 24px;
  border: 1px solid rgba(45, 91, 116, 0.25);
  border-radius: 999px;
  background: #fff;
  box-shadow: inset 0 0 0 3px #fff;
}

.cart-select input:checked + span {
  border-color: var(--accent-dark);
  background: var(--accent-dark);
}

.cart-select input:checked + span::after {
  content: "";
  display: block;
  width: 8px;
  height: 5px;
  margin: 7px auto 0;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg);
}

.cart-delete {
  position: absolute;
  top: auto;
  bottom: 16px;
  right: 14px;
  min-height: 30px;
  padding: 0 12px;
  border: 1px solid rgba(216, 226, 231, 0.95);
  border-radius: 999px;
  background: #fff;
  color: #7f1d1d;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.cart-delete:hover {
  border-color: rgba(127, 29, 29, 0.25);
  background: #fff5f5;
}

.cart-card > div {
  min-width: 0;
}

.cart-card img {
  height: 120px;
  border-radius: 12px;
  object-fit: cover;
}

.cart-bracelet-thumb {
  position: relative;
  width: 150px;
  height: 120px;
  overflow: hidden;
  border: 1px solid rgba(45, 91, 116, 0.16);
  border-radius: 12px;
  background: #f8fbfc;
}

.cart-bracelet-canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.cart-actions {
  display: flex;
  gap: 10px;
  margin-top: 10px;
}

.cart-material-list {
  display: grid;
  gap: 10px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin-top: 12px;
}

.cart-material-list h4 {
  margin: 0;
  color: var(--ink);
  font-size: 20px;
  line-height: 1.15;
}

.cart-material-head,
.cart-material-row {
  display: grid;
  grid-template-columns: minmax(132px, 1.6fr) 58px 54px 52px 64px;
  align-items: center;
  gap: 10px;
}

.cart-material-head {
  padding: 0 14px;
  color: #6d747c;
  font-size: 13px;
  font-weight: 800;
}

.cart-material-row {
  min-height: 58px;
  padding: 9px 12px;
  border: 1px solid rgba(216, 226, 231, 0.95);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.82);
  color: #69727a;
  font-size: 14px;
  font-weight: 800;
}

.cart-material-row > span:not(.cart-material-name) {
  text-align: center;
  white-space: nowrap;
}

.cart-material-detail {
  display: none;
}

.cart-material-row > strong {
  color: var(--ink);
  text-align: right;
  white-space: nowrap;
}

.cart-material-name {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
  color: var(--ink);
}

.cart-material-name img {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border-radius: 999px;
  object-fit: contain;
}

.cart-material-name strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cart-material-meta {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.text-button {
  border: 0;
  background: transparent;
  color: var(--accent-dark);
  padding: 0;
  font-weight: 700;
  cursor: pointer;
}

.text-button.compact {
  padding: 8px 12px;
  border: 1px solid rgba(45, 91, 116, 0.2);
  border-radius: 999px;
  white-space: nowrap;
}

.text-button.compact:hover {
  background: rgba(45, 91, 116, 0.07);
}

.trust-list {
  display: grid;
  gap: 10px;
  margin-top: 18px;
  color: var(--muted);
  font-size: 14px;
}

.policy-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 22px;
}

.policy-section {
  margin-top: 28px;
}

.policy-section h2 {
  margin: 0 0 14px;
  font-family: var(--display-font);
  font-size: 28px;
  line-height: 1.1;
  letter-spacing: -0.01em;
}

.policy-card {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(251, 253, 254, 0.76);
}

.policy-card strong {
  display: block;
  margin-bottom: 6px;
}

.policy-card span {
  color: var(--muted);
}

.wear-grid {
  display: grid;
  grid-template-columns: 1.35fr 0.65fr;
  gap: 20px;
  align-items: stretch;
}

.wear-carousel-main,
.wear-slide,
.wear-note {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--surface);
  overflow: hidden;
}

.wear-carousel-main {
  position: relative;
  --wear-media-height: clamp(280px, 34vw, 430px);
  min-height: calc(var(--wear-media-height) + 132px);
}

.wear-slide {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-rows: var(--wear-media-height) auto;
  opacity: 0;
  pointer-events: none;
  transform: translateX(10px);
  transition: opacity 260ms ease, transform 260ms ease;
}

.wear-slide.is-active {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(0);
}

.wear-slide img {
  height: 100%;
  object-fit: cover;
  transition: transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
}

.wear-copy {
  padding: 24px;
}

.carousel-controls {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: calc(100% - var(--wear-media-height) - 18px);
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  pointer-events: none;
}

.carousel-controls button {
  pointer-events: auto;
}

.carousel-controls > button {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(45, 91, 116, 0.22);
  border-radius: 999px;
  background: rgba(251, 253, 254, 0.82);
  color: var(--accent-dark);
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}

.carousel-dots {
  display: flex;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(251, 253, 254, 0.82);
  pointer-events: auto;
}

.carousel-dots button {
  width: 8px;
  height: 8px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(45, 91, 116, 0.28);
  cursor: pointer;
}

.carousel-dots button.is-active {
  width: 22px;
  background: var(--accent-dark);
}

.wear-note {
  display: grid;
  align-content: space-between;
  padding: 24px;
  background: #2f2841;
  color: #f7fbfc;
}

.wear-note p,
.wear-note span {
  color: #c6d6dd;
}

.occasion-list {
  display: grid;
  gap: 12px;
  margin-top: 24px;
}

.occasion-list div {
  padding: 14px 0;
  border-top: 1px solid rgba(247, 251, 252, 0.16);
}

.quiz-section {
  padding-top: 44px;
  background: linear-gradient(180deg, rgba(240, 238, 247, 0), rgba(240, 238, 247, 0.62));
}

.quiz-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
  gap: 18px;
  align-items: stretch;
}

.quiz-panel,
.quiz-result {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255, 254, 254, 0.86);
}

.quiz-panel {
  padding: 30px;
}

.quiz-panel h2 {
  margin-bottom: 22px;
}

.quiz-panel p:last-child {
  max-width: 62ch;
  margin: 22px 0 0;
  color: var(--muted);
}

.quiz-options {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.quiz-options button {
  min-height: 54px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  color: #31323a;
  font-weight: 800;
  cursor: pointer;
}

.quiz-options button.is-active {
  border-color: rgba(87, 74, 115, 0.34);
  background: var(--accent-soft);
  color: var(--accent-dark);
  box-shadow: 0 0 0 3px rgba(87, 74, 115, 0.08);
}

.quiz-result {
  display: grid;
  align-content: center;
  gap: 12px;
  padding: 30px;
  background:
    linear-gradient(135deg, rgba(255, 254, 254, 0.9), rgba(238, 231, 248, 0.82)),
    #fff;
}

.quiz-result span {
  color: var(--accent-dark);
  font-weight: 800;
}

.quiz-result strong {
  font-size: 30px;
  line-height: 1.08;
}

.quiz-result p {
  color: var(--muted);
}

.ritual-section {
  padding-top: 48px;
}

.ritual-feed {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr 1fr;
  gap: 16px;
}

.ritual-feed article {
  position: relative;
  min-height: 360px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

.ritual-feed article:nth-child(2) {
  margin-top: 36px;
}

.ritual-feed img {
  height: 100%;
  object-fit: cover;
}

.ritual-feed div {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 16px;
  padding: 14px 16px;
  border: 1px solid rgba(255, 255, 255, 0.66);
  border-radius: 14px;
  background: rgba(255, 254, 254, 0.86);
  backdrop-filter: blur(14px);
}

.ritual-feed strong,
.ritual-feed span {
  display: block;
}

.ritual-feed span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
}

.process-track {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--line);
}

.process-step {
  min-height: 156px;
  padding: 20px;
  background: rgba(251, 253, 254, 0.86);
}

.process-step span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  margin-bottom: 16px;
  border-radius: 999px;
  background: var(--surface-2);
  color: var(--accent-dark);
  font-weight: 800;
}

.process-step p {
  margin-bottom: 0;
  color: var(--muted);
}

.care-layout {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 28px;
  align-items: center;
}

.care-list {
  display: grid;
  gap: 14px;
  margin-top: 24px;
}

.care-list div {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 18px;
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
}

.quote-band {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.quote-card {
  padding: 26px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(251, 253, 254, 0.82);
}

.quote-card blockquote {
  margin: 0;
  color: #243641;
  font-size: 20px;
  line-height: 1.55;
}

.quote-card p {
  margin: 18px 0 0;
  color: var(--muted);
}

.faq-section {
  background: linear-gradient(180deg, rgba(237, 243, 246, 0), rgba(237, 243, 246, 0.62));
}

.faq-layout {
  display: grid;
  grid-template-columns: minmax(280px, 0.78fr) minmax(0, 1.22fr);
  gap: 28px;
  align-items: start;
}

.faq-intro {
  position: sticky;
  top: calc(var(--header-height) + 24px);
  padding: 32px;
  border-radius: 18px;
  background: #2f2841;
  color: #f7fbfc;
}

.faq-intro h2 {
  font-size: clamp(30px, 4vw, 46px);
}

.faq-intro p {
  color: #c7d7de;
}

.faq-checklist {
  display: grid;
  gap: 1px;
  overflow: hidden;
  margin-top: 28px;
  border: 1px solid rgba(247, 251, 252, 0.14);
  border-radius: 14px;
  background: rgba(247, 251, 252, 0.14);
}

.faq-checklist div {
  padding: 16px;
  background: rgba(247, 251, 252, 0.06);
}

.faq-checklist strong {
  display: block;
  color: #f7fbfc;
}

.faq-checklist span {
  display: block;
  margin-top: 4px;
  color: #c7d7de;
}

.faq-panel {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(251, 253, 254, 0.78);
}

.faq-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.faq-filter button {
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fbfdfe;
  color: #3a4953;
  cursor: pointer;
}

.faq-filter button.is-active {
  border-color: var(--accent-dark);
  background: var(--accent-dark);
  color: #f8fbfc;
}

.faq-list {
  display: grid;
  gap: 10px;
}

.faq-item {
  display: grid;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fbfdfe;
  overflow: hidden;
}

.faq-item.is-hidden {
  display: none;
}

.faq-question {
  display: grid;
  grid-template-columns: 1fr 34px;
  gap: 16px;
  align-items: center;
  width: 100%;
  min-height: 64px;
  padding: 0 18px;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-weight: 800;
  text-align: left;
  cursor: pointer;
}

.faq-question span:last-child {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: var(--surface-2);
  position: relative;
}

.faq-question span:last-child::before,
.faq-question span:last-child::after {
  content: "";
  position: absolute;
  left: 8px;
  right: 8px;
  top: 13px;
  height: 2px;
  border-radius: 999px;
  background: var(--accent-dark);
}

.faq-question span:last-child::after {
  transform: rotate(90deg);
}

.faq-item.is-open .faq-question span:last-child::after {
  transform: rotate(0);
}

.faq-answer {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 220ms ease;
}

.faq-answer p {
  overflow: hidden;
  margin: 0;
  padding: 0 18px;
  color: var(--muted);
}

.faq-item.is-open .faq-answer {
  grid-template-rows: 1fr;
}

.faq-item.is-open .faq-answer p {
  padding-bottom: 18px;
}

.final-cta {
  padding: 54px;
  border-radius: 22px;
  background:
    linear-gradient(135deg, rgba(47, 40, 65, 0.96), rgba(87, 74, 115, 0.92)),
    var(--accent-dark);
  color: #f7fbfc;
}

.final-cta p {
  color: #cfe0e7;
}

.final-cta .button.secondary {
  border-color: rgba(247, 251, 252, 0.42);
  color: #f7fbfc;
}

.final-cta .button.secondary:hover {
  background: rgba(247, 251, 252, 0.1);
}

.modal-open {
  overflow: hidden;
}

.quick-view {
  position: fixed;
  inset: 0;
  z-index: 70;
  display: grid;
  place-items: center;
  padding: 24px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease;
}

.quick-view.is-open {
  opacity: 1;
  pointer-events: auto;
}

.quick-view-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(16, 25, 32, 0.42);
}

.quick-view-panel {
  position: relative;
  z-index: 1;
  width: min(560px, 100%);
  max-height: min(720px, calc(100dvh - 40px));
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid rgba(216, 226, 231, 0.95);
  border-radius: 18px;
  background: #fbfdfe;
  box-shadow: 0 22px 54px rgba(16, 25, 32, 0.24);
  transform: translateY(10px);
  transition: transform 180ms ease;
}

.quick-view.is-open .quick-view-panel {
  transform: translateY(0);
}

.quick-view-close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 2;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(45, 91, 116, 0.18);
  border-radius: 999px;
  background: rgba(251, 253, 254, 0.86);
  color: var(--ink);
  cursor: pointer;
}

.quick-view-content {
  display: grid;
  align-content: center;
  padding: 34px;
}

.quick-view-content p {
  color: var(--muted);
}

.quick-specs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  margin-top: 22px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--line);
}

.quick-specs div {
  min-height: 78px;
  padding: 14px;
  background: #f8fbfc;
}

.quick-specs span {
  display: block;
  color: var(--muted);
  font-size: 13px;
}

.quick-specs strong {
  display: block;
  margin-top: 4px;
  color: var(--ink);
}

.toast {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 60;
  width: min(360px, calc(100vw - 36px));
  padding: 16px 18px;
  border: 1px solid rgba(216, 226, 231, 0.9);
  border-radius: 16px;
  background: rgba(251, 253, 254, 0.94);
  box-shadow: 0 18px 48px rgba(31, 70, 90, 0.18);
  color: var(--ink);
  opacity: 0;
  transform: translateY(14px);
  pointer-events: none;
  transition: opacity 180ms ease, transform 180ms ease;
}

.toast.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.toast strong {
  display: block;
}

.toast a {
  color: var(--accent-dark);
  font-weight: 800;
}

.mobile-sticky-cta {
  display: none;
}

.empty {
  display: grid;
  grid-template-columns: 1fr;
  place-items: center;
  text-align: center;
  padding: 64px 24px;
}

.cart-card.empty {
  grid-template-columns: 1fr;
}

.empty h2 {
  font-size: clamp(34px, 5vw, 52px);
  margin: 0 auto;
  white-space: nowrap;
}

.empty .actions {
  justify-content: center;
}

.footer {
  padding: 42px 0;
  border-top: 1px solid var(--line);
  color: var(--muted);
}

.footer-inner {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  align-items: center;
}

.footer-brand {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  text-decoration: none;
}

.footer-brand img {
  display: block;
  width: auto;
  height: 34px;
  object-fit: contain;
}

.footer-social {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px 20px;
  margin-left: auto;
  margin-right: clamp(64px, 8vw, 116px);
}

.footer-social a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #765463;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
}

.footer-social svg {
  display: block;
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.footer-social a:hover,
.footer-social a:focus-visible {
  color: #243e35;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.reveal {
  animation: rise 620ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes rise {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }
}

@media (max-width: 900px) {
  .hero,
  .collection-layout,
  .split,
  .wear-grid,
  .care-layout,
  .customizer,
  .cart-layout,
  .faq-layout,
  .quiz-layout,
  .standard-strip {
    grid-template-columns: 1fr;
  }

  .hero {
    min-height: auto;
    padding-top: 42px;
  }

  .hero-full {
    min-height: 640px;
  }

  .home-hero {
    min-height: 0;
    height: auto;
    aspect-ratio: 1672 / 941;
  }

  .hero-full-content {
    padding: 74px 0 64px;
  }

  .hero-full-image {
    object-position: 68% center;
  }

  .home-hero .hero-full-image {
    object-position: 76% center;
  }

  .hero-full-gallery .hero-full-image {
    object-position: 70% center;
  }

  .hero-media {
    min-height: 360px;
  }

  .gallery-grid,
  .grid-3,
  .meaning-grid,
  .option-grid,
  .process-track,
  .quote-band,
  .policy-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ritual-feed {
    grid-template-columns: 1fr;
  }

  .ritual-feed article,
  .ritual-feed article:nth-child(2) {
    min-height: 320px;
    margin-top: 0;
  }

  .customizer-intro-inner {
    grid-template-columns: 1fr;
  }

  .customizer-intro-steps {
    min-width: 0;
    justify-content: flex-start;
  }

  .preview {
    position: static;
  }

  .faq-intro {
    position: static;
  }

  .quick-view-panel {
    grid-template-columns: 1fr;
    overflow-y: auto;
  }

}

@media (max-width: 680px) {
  :root {
    --header-height: 84px;
  }

  .container {
    width: min(100% - 28px, 1160px);
  }

  .nav {
    min-height: auto;
    padding: 14px 0;
    align-items: center;
    gap: 10px;
  }

  .brand {
    min-width: 0;
    flex: 0 1 auto;
  }

  .brand > span:last-child {
    max-width: 132px;
    line-height: 1.18;
  }

  .nav-links {
    flex: 1 1 auto;
    min-width: 0;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 10px;
    overflow-x: auto;
    white-space: nowrap;
    scrollbar-width: none;
  }

  .nav-links::-webkit-scrollbar {
    display: none;
  }

  .nav-links a {
    flex: 0 0 auto;
  }

  .nav .button {
    display: none;
  }

  h1 {
    font-size: 42px;
  }

  .home-hero h1 {
    font-size: clamp(30px, 8.8vw, 38px);
    line-height: 1.02;
  }

  .home-hero .kicker {
    margin-bottom: 8px;
    font-size: 11px;
  }

  .hero-full {
    min-height: 500px;
    align-items: center;
  }

  .home-hero {
    min-height: 0;
    aspect-ratio: 1672 / 941;
  }

  .hero-full::before {
    background:
      linear-gradient(180deg, rgba(239, 247, 250, 0.18) 0%, rgba(239, 247, 250, 0.72) 42%, rgba(239, 247, 250, 0.97) 100%),
      linear-gradient(90deg, rgba(239, 247, 250, 0.92), rgba(239, 247, 250, 0.34));
  }

  .home-hero::before {
    background:
      radial-gradient(ellipse 72% 78% at 13% 50%, rgba(247, 251, 252, 0.94) 0%, rgba(247, 251, 252, 0.8) 38%, rgba(247, 251, 252, 0.32) 68%, rgba(247, 251, 252, 0) 100%),
      linear-gradient(90deg, rgba(239, 247, 250, 0.54) 0%, rgba(239, 247, 250, 0.18) 54%, rgba(239, 247, 250, 0) 100%),
      linear-gradient(180deg, rgba(239, 247, 250, 0.04), rgba(239, 247, 250, 0.2));
  }

  .hero-full-content {
    padding: 18px 0;
  }

  .hero-full .hero-copy {
    max-width: 100%;
  }

  .hero-full .lead {
    max-width: 31ch;
    margin-top: 12px;
    font-size: 13px;
    line-height: 1.45;
  }

  .home-hero .hero-actions {
    gap: 8px;
    margin-top: 14px;
  }

  .home-hero .button {
    min-height: 38px;
    padding: 0 14px;
    font-size: 14px;
  }

  .hero-full-image {
    object-position: 70% top;
  }

  .home-hero .hero-full-image {
    object-position: 74% center;
  }

  .hero-full-gallery .hero-full-image {
    object-position: 68% top;
  }

  .section {
    padding: 54px 0;
  }

  .faq-intro,
  .faq-panel {
    padding: 18px;
  }

  .faq-checklist {
    margin-top: 18px;
  }

  .faq-filter {
    gap: 6px;
  }

  .faq-filter button {
    min-height: 34px;
    padding: 0 12px;
    font-size: 13px;
  }

  .faq-question {
    min-height: 56px;
    padding: 0 14px;
    grid-template-columns: 1fr 28px;
  }

  .faq-answer p {
    padding: 0 14px;
  }

  .faq-item.is-open .faq-answer p {
    padding-bottom: 14px;
  }

  .gallery-grid,
  .grid-3,
  .meaning-grid,
  .option-grid,
  .quote-band,
  .policy-grid {
    grid-template-columns: 1fr;
  }

  .meaning-card {
    min-height: 180px;
  }

  .quiz-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .quiz-panel,
  .quiz-result,
  .customizer-intro-inner {
    padding: 20px;
  }

  .customizer-intro h1 {
    font-size: 32px;
  }

  .customizer-intro-steps {
    display: grid;
    grid-template-columns: 1fr;
  }

  .ritual-feed article {
    min-height: 260px;
  }

  .wear-carousel-main {
    --wear-media-height: clamp(210px, 52vw, 330px);
    min-height: calc(var(--wear-media-height) + 132px);
  }

  .wear-slide img {
    height: 100%;
  }

  .wear-copy {
    padding: 18px;
  }

  .carousel-controls {
    left: 12px;
    right: 12px;
    bottom: calc(100% - var(--wear-media-height) - 14px);
  }

  .process-track {
    grid-template-columns: 1fr;
  }

  .process-step {
    min-height: auto;
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 4px 14px;
    padding: 16px;
  }

  .process-step span {
    grid-row: 1 / 3;
    margin-bottom: 0;
  }

  .process-step h3 {
    font-size: 20px;
  }

  .process-step p {
    margin: 0;
    font-size: 14px;
  }

  @media (min-width: 520px) {
    .process-track {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  #designerGrid.gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .product-card img {
    object-fit: contain;
    object-position: center;
    transform: none;
  }

  #designerGrid .product-card .content {
    padding: 12px;
  }

  #designerGrid .product-card h3 {
    font-size: 18px;
    line-height: 1.18;
  }

  #designerGrid .product-card p {
    font-size: 13px;
    line-height: 1.45;
  }

  #designerGrid .product-meta {
    grid-template-columns: 1fr;
    gap: 4px;
    margin-top: 10px;
    font-size: 12px;
  }

  #designerGrid .tag-row {
    gap: 6px;
    margin-top: 10px;
  }

  #designerGrid .tag {
    min-height: 24px;
    padding: 0 8px;
    font-size: 12px;
  }

  #designerGrid .product-actions {
    gap: 8px;
    margin-top: 12px;
  }

  #designerGrid .product-actions .price {
    font-size: 16px;
  }

  #designerGrid .cart-actions {
    gap: 8px;
    margin-top: 0;
  }

  #designerGrid .text-button {
    font-size: 13px;
    text-align: left;
  }

  .care-list div {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .final-cta {
    padding: 30px;
  }

  .cart-card {
    grid-template-columns: 108px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 38px 14px 14px;
  }

  .cart-card .cart-bracelet-thumb,
  .cart-card > img {
    width: 108px;
    height: 92px;
    justify-self: start;
  }

  .cart-card h3 {
    margin: 0;
    text-align: left;
    font-size: 18px;
    line-height: 1.2;
  }

  .cart-card .price {
    grid-column: auto;
    justify-self: end;
    align-self: center;
    font-size: 15px;
  }

  .cart-card .cart-actions {
    justify-content: flex-start;
    margin-top: 6px;
  }

  .cart-material-list {
    gap: 6px;
    margin-top: 6px;
    overflow: visible;
    padding-bottom: 0;
    scrollbar-width: none;
  }

  .cart-material-list::-webkit-scrollbar {
    display: none;
  }

  .cart-material-list h4 {
    font-size: 14px;
  }

  .cart-material-head {
    display: none;
  }

  .cart-material-row {
    width: 100%;
    min-width: 0;
    min-height: 48px;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2px 8px;
    padding: 7px 9px;
    border-radius: 14px;
    font-size: 13px;
  }

  .cart-material-name {
    gap: 7px;
    grid-column: 1;
    grid-row: 1;
  }

  .cart-material-name img {
    width: 28px;
    height: 28px;
    flex-basis: 28px;
  }

  .cart-material-row > span:not(.cart-material-name):not(.cart-material-detail) {
    display: none;
  }

  .cart-material-detail {
    display: block;
    grid-column: 1 / -1;
    grid-row: 2;
    padding-left: 35px;
    color: #667583;
    font-size: 12px;
    line-height: 1.25;
    text-align: left;
    white-space: normal;
  }

  .cart-material-row > strong {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
    font-size: 13px;
    text-align: right;
  }

  .cart-material-meta {
    font-size: 13px;
    line-height: 1.5;
  }

  @media (max-width: 430px) {
    .cart-card {
      grid-template-columns: 78px minmax(0, 1fr) auto;
      gap: 9px;
      padding: 36px 10px 12px;
    }

    .cart-card .cart-bracelet-thumb,
    .cart-card > img {
      width: 78px;
      height: 78px;
    }

    .cart-card h3 {
      font-size: 16px;
    }

    .cart-material-list h4,
    .cart-material-meta {
      display: none;
    }

    .cart-card .price {
      align-self: end;
      padding-bottom: 2px;
    }

    .cart-actions {
      gap: 8px;
    }
  }

  .product-row {
    grid-template-columns: 1fr auto;
  }

  .product-actions {
    align-items: flex-start;
  }

  .product-actions,
  .product-actions .cart-actions {
    display: grid;
    justify-content: stretch;
  }

  .product-row .text-button.compact {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .quick-view {
    align-items: end;
    padding: 10px;
  }

  .quick-view-panel {
    max-height: calc(100dvh - 20px);
    border-radius: 16px;
  }

  .quick-view-content {
    padding: 22px;
  }

  .quick-specs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .footer-inner {
    display: grid;
    gap: 18px;
    justify-items: start;
  }

  .footer-brand img {
    height: 28px;
  }

  .footer-social {
    display: grid;
    width: min(100%, 420px);
    grid-template-columns: repeat(3, minmax(0, 1fr));
    justify-content: stretch;
    gap: 8px;
    margin-left: 0;
    margin-right: 0;
    padding-right: 0;
  }

  .footer-social a {
    justify-content: center;
    min-height: 42px;
    padding: 0 8px;
    border: 1px solid rgba(118, 84, 99, 0.14);
    border-radius: 999px;
    background: rgba(255, 254, 252, 0.72);
    font-size: 12px;
  }

  .footer-social svg {
    width: 16px;
    height: 16px;
  }

  .mobile-sticky-cta {
    position: sticky;
    bottom: 0;
    z-index: 40;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    padding: 10px 14px;
    border-top: 1px solid var(--line);
    background: rgba(243, 247, 249, 0.92);
    backdrop-filter: blur(16px);
  }
}

@media (max-width: 420px) {
  .home-hero h1 {
    font-size: clamp(26px, 7.2vw, 30px);
    line-height: 1.02;
    color: #102436;
  }

  .home-hero .kicker {
    margin-bottom: 6px;
    color: #244d63;
    font-size: 10px;
    line-height: 1.2;
  }

  .hero-full-content {
    padding: 12px 0;
  }

  .hero-full .lead {
    max-width: 27ch;
    margin-top: 8px;
    color: #294b5e;
    font-size: 12px;
    line-height: 1.38;
  }

  .home-hero .hero-actions {
    margin-top: 9px;
  }

  .home-hero .button {
    min-height: 34px;
    padding: 0 12px;
    font-size: 13px;
  }
}

.site-header--compact {
  position: sticky;
  top: 0;
  z-index: 30;
  background: rgba(246, 248, 250, 0.9);
  backdrop-filter: blur(18px);
}

.customizer-embed-page {
  min-height: calc(100vh - var(--header-height));
  padding: 28px 0 34px;
}

.customizer-intro {
  padding-bottom: 18px;
}

.customizer-intro-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: end;
  padding: 28px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background:
    linear-gradient(135deg, rgba(255, 254, 254, 0.9), rgba(238, 231, 248, 0.72)),
    #fff;
}

.customizer-intro h1 {
  font-size: clamp(32px, 4.4vw, 54px);
}

.customizer-intro p:not(.kicker) {
  max-width: 66ch;
  margin: 14px 0 0;
  color: var(--muted);
}

.customizer-intro-steps {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  min-width: 340px;
}

.customizer-intro-steps span {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid rgba(87, 74, 115, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  color: var(--accent-dark);
  font-weight: 800;
  font-size: 13px;
}

.customizer-embed-shell {
  width: min(1440px, calc(100% - 32px));
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 18px 44px rgba(31, 70, 90, 0.12);
}

.customizer-embed {
  display: block;
  width: 100%;
  height: 1060px;
  min-height: 760px;
  border: 0;
  background: #fff;
  overflow: hidden;
}

@media (max-width: 720px) {
  .site-header--compact .nav {
    gap: 8px;
    align-items: center;
    flex-wrap: nowrap;
    min-height: 60px;
    padding: 10px 0;
  }

  .site-header--compact .brand {
    flex: 0 1 132px;
    min-width: 0;
    gap: 8px;
    font-size: 13px;
    line-height: 1.12;
    letter-spacing: 0;
  }

  .site-header--compact .brand-mark {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
  }

  .site-header--compact .brand > span:last-child {
    min-width: 0;
  }

  .site-header--compact .nav-links {
    flex: 1 1 auto;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 9px;
    min-width: 0;
    font-size: 12px;
    white-space: nowrap;
  }

  .customizer-embed-page {
    padding: 0;
  }

  .customizer-embed-shell {
    width: 100%;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .customizer-embed {
    height: 1120px;
    min-height: 980px;
  }
}

/* DIY customizer polish overrides - 2026-07-01 */
.pp-site-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.pp-site-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-align: center;
}

.pp-site-nav a,
.pp-site-nav button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.pp-home-page .pp-home-materials,
.pp-home-page [data-section="popular-materials"] {
  display: none !important;
}

.pp-bead-thumb-frame,
.pp-real-bead {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.pp-bead-thumb-frame {
  display: grid !important;
  place-items: center !important;
  overflow: visible !important;
  border-radius: 0 !important;
  margin-inline: auto !important;
}

.pp-real-bead {
  display: grid !important;
  place-items: center !important;
  overflow: visible !important;
  border-radius: 0 !important;
  clip-path: none !important;
}

.pp-real-bead::before,
.pp-real-bead::after,
.pp-bead-thumb-frame::before,
.pp-bead-thumb-frame::after {
  display: none !important;
  content: none !important;
}

.pp-real-bead img,
.pp-bead-thumb-frame img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  margin: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  clip-path: none !important;
  box-shadow: none !important;
  filter: none !important;
}

.pp-card-size-stepper {
  display: grid !important;
  grid-template-columns: 28px minmax(48px, 1fr) 28px !important;
  align-items: center !important;
  justify-items: center !important;
  gap: 6px !important;
  width: min(128px, 100%) !important;
  margin: 8px auto 0 !important;
  overflow: visible !important;
}

.pp-card-size-stepper button {
  inline-size: 28px !important;
  block-size: 28px !important;
  min-inline-size: 28px !important;
  min-block-size: 28px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 8px !important;
}

.pp-card-size-stepper strong,
.pp-card-size-stepper span {
  min-width: 46px;
  text-align: center;
  white-space: nowrap;
}

.pp-bead-card {
  overflow: hidden !important;
}

.pp-stats {
  align-items: stretch !important;
}

.pp-mobile-action-stat button,
.pp-action-stat button,
.pp-stats > article:has(button[aria-label*="Clear"]) button,
.pp-stats > article:has(button[aria-label*="Undo"]) button,
.pp-stats > article:has(button[aria-label*="Cart"]) button,
.pp-stats > article:has(button[aria-label*="Purchase"]) button {
  inline-size: 40px !important;
  block-size: 40px !important;
  min-inline-size: 40px !important;
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  display: grid !important;
  place-items: center !important;
}

.pp-fit {
  justify-content: center !important;
  text-align: center !important;
}

.pp-fit > *:not(:first-child) {
  display: none !important;
}

@media (max-width: 720px) {
  .pp-diy {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    padding-inline: 10px !important;
  }

  .pp-site-header {
    gap: 10px;
  }

  .pp-site-nav {
    flex: 1 1 auto;
    justify-content: center;
  }

  .pp-preview-head {
    min-height: 0 !important;
  }

  .pp-preview-head .pp-kicker,
  .pp-preview-head h2 {
    display: none !important;
  }

  .pp-preview-head .pp-icon-row {
    margin-left: auto !important;
  }

  .pp-beads {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  .pp-bead-card {
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: center !important;
    padding: 10px 6px !important;
  }

  .pp-bead-thumb-frame {
    width: 70px !important;
    height: 70px !important;
    max-width: 100% !important;
  }

  .pp-card-size-stepper {
    grid-template-columns: 26px minmax(42px, 1fr) 26px !important;
    gap: 4px !important;
    width: min(112px, 100%) !important;
  }

  .pp-card-size-stepper button {
    inline-size: 26px !important;
    block-size: 26px !important;
    min-inline-size: 26px !important;
    min-block-size: 26px !important;
  }

  .pp-card-size-stepper strong,
  .pp-card-size-stepper span {
    min-width: 40px;
  }

  .pp-chips {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
  }

  .pp-chips button {
    width: 100% !important;
    min-width: 0 !important;
    justify-content: center !important;
  }

  .pp-mobile-action-stat button,
  .pp-action-stat button,
  .pp-stats > article:has(button[aria-label*="Clear"]) button,
  .pp-stats > article:has(button[aria-label*="Undo"]) button,
  .pp-stats > article:has(button[aria-label*="Cart"]) button,
  .pp-stats > article:has(button[aria-label*="Purchase"]) button {
    inline-size: 34px !important;
    block-size: 34px !important;
    min-inline-size: 34px !important;
  }
}

@media (max-width: 430px) {
  .pp-diy {
    padding-inline: 10px !important;
  }

  .pp-mobile-action-stat button,
  .pp-action-stat button,
  .pp-stats > article:has(button[aria-label*="Clear"]) button,
  .pp-stats > article:has(button[aria-label*="Undo"]) button,
  .pp-stats > article:has(button[aria-label*="Cart"]) button,
  .pp-stats > article:has(button[aria-label*="Purchase"]) button {
    inline-size: 32px !important;
    block-size: 32px !important;
    min-inline-size: 32px !important;
  }
}
/* DIY customizer layout patch - card, action, and mobile fit */
.pp-site-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.pp-site-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-align: center;
}

.pp-home-page .pp-home-materials,
.pp-home-page [data-section="popular-materials"] {
  display: none !important;
}

.pp-preview .pp-stats {
  align-items: stretch;
}

.pp-preview .pp-stats > article {
  min-width: 0;
}

.pp-preview .pp-stats > .pp-mobile-action-stat {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 10px 14px;
  background: #f3f5f8;
  border: 1px solid #e6e9ef;
  box-shadow: none;
}

.pp-preview .pp-stats > .pp-mobile-action-stat button,
.pp-icon-row button {
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  min-width: 38px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid #edf0f5;
  box-shadow: none;
}

.pp-bead-card {
  overflow: hidden;
}

.pp-bead-card .pp-bead-thumb-frame,
.pp-bead-card .pp-real-bead {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-inline: auto;
  overflow: visible;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: none !important;
}

.pp-bead-card .pp-real-bead::before,
.pp-bead-card .pp-real-bead::after,
.pp-bead-card .pp-bead-thumb-frame::before,
.pp-bead-card .pp-bead-thumb-frame::after {
  content: none !important;
  display: none !important;
}

.pp-bead-card .pp-real-bead img,
.pp-bead-card .pp-bead-thumb-frame img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
  border-radius: 0;
  clip-path: none;
  mask-image: none;
  -webkit-mask-image: none;
  box-shadow: none !important;
  filter: none !important;
}

.pp-card-size-stepper {
  width: min(100%, 118px);
  min-width: 0;
  margin-inline: auto;
  display: grid;
  grid-template-columns: 28px minmax(42px, 1fr) 28px;
  align-items: center;
  justify-items: center;
  gap: 4px;
  overflow: hidden;
}

.pp-card-size-stepper button {
  width: 28px;
  height: 28px;
  min-width: 28px;
  padding: 0;
  border-radius: 9px;
}

.pp-card-size-stepper strong,
.pp-card-size-stepper span {
  min-width: 0;
  text-align: center;
  white-space: nowrap;
}

.pp-chips,
.pp-subchips,
.pp-tertiary-chips {
  width: 100%;
}

.pp-chips button,
.pp-subchips button,
.pp-tertiary-chips button {
  min-width: 0;
  text-align: center;
}

@media (max-width: 760px) {
  .pp-diy {
    width: 100%;
    max-width: none;
    margin-inline: auto;
    padding-inline: 10px;
  }

  .pp-site-header,
  .pp-site-nav {
    width: 100%;
  }

  .pp-site-header {
    display: block;
  }

  .pp-site-nav {
    justify-content: center;
  }

  .pp-preview .pp-stats {
    display: grid;
    grid-template-columns: minmax(76px, 0.85fr) minmax(128px, 1.15fr) minmax(92px, 0.95fr);
    gap: 8px;
  }

  .pp-preview .pp-stats > .pp-mobile-action-stat {
    gap: 10px;
    padding: 8px;
  }

  .pp-preview .pp-stats > .pp-mobile-action-stat button,
  .pp-icon-row button {
    width: 34px;
    height: 34px;
    min-width: 34px;
    border-radius: 11px;
  }

  .pp-beads {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
  }

  .pp-bead-card {
    min-width: 0;
    padding: 10px 8px;
    align-items: center;
    text-align: center;
  }

  .pp-bead-card .pp-bead-thumb-frame {
    width: 66px;
    height: 66px;
  }

  .pp-bead-card .pp-real-bead {
    width: 58px;
    height: 58px;
  }

  .pp-card-size-stepper {
    width: 104px;
    grid-template-columns: 26px minmax(38px, 1fr) 26px;
    gap: 3px;
  }

  .pp-card-size-stepper button {
    width: 26px;
    height: 26px;
    min-width: 26px;
  }

  .pp-chips {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
  }

  .pp-tertiary-chips {
    display: grid;
    grid-template-columns: 32px repeat(4, minmax(0, 1fr)) 32px;
    gap: 6px;
  }
}

@media (max-width: 430px) {
  .pp-diy {
    padding-inline: 8px;
  }

  .pp-preview .pp-stats {
    grid-template-columns: minmax(74px, 0.8fr) minmax(126px, 1.25fr) minmax(96px, 0.95fr);
    gap: 7px;
  }

  .pp-preview .pp-stats > article {
    padding-inline: 8px;
  }

  .pp-preview .pp-stats > .pp-mobile-action-stat {
    gap: 8px;
    padding-inline: 7px;
  }

  .pp-preview .pp-stats > .pp-mobile-action-stat button {
    width: 32px;
    height: 32px;
    min-width: 32px;
  }

  .pp-beads {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
  }

  .pp-bead-card {
    padding: 9px 6px;
  }

  .pp-bead-card .pp-bead-thumb-frame {
    width: 58px;
    height: 58px;
  }

  .pp-bead-card .pp-real-bead {
    width: 52px;
    height: 52px;
  }

  .pp-card-size-stepper {
    width: 96px;
    grid-template-columns: 24px minmax(36px, 1fr) 24px;
  }

  .pp-card-size-stepper button {
    width: 24px;
    height: 24px;
    min-width: 24px;
  }
}

@media (max-width: 860px) {
  #cartMount {
    gap: 12px;
  }

  .cart-card {
    grid-template-columns: 154px minmax(0, 1fr);
    gap: 18px;
    min-height: 202px;
    padding: 48px 24px 22px;
    align-items: center;
  }

  .cart-select {
    top: 18px;
    left: 24px;
  }

  .cart-select span {
    width: 30px;
    height: 30px;
  }

  .cart-select input:checked + span::after {
    width: 11px;
    height: 7px;
    margin-top: 8px;
    border-width: 3px;
  }

  .cart-delete {
    top: auto;
    bottom: 18px;
    right: 24px;
    min-height: 38px;
    padding: 0 18px;
    font-size: 15px;
  }

  .cart-card .cart-bracelet-thumb,
  .cart-card > img {
    width: 154px;
    height: 154px;
    justify-self: start;
    align-self: center;
  }

  .cart-card h3 {
    display: none;
  }

  .cart-material-list {
    gap: 10px;
    margin-top: 0;
    overflow: visible;
    padding-bottom: 0;
  }

  .cart-material-list h4,
  .cart-material-head,
  .cart-material-meta {
    display: none;
  }

  .cart-material-row {
    width: 100%;
    min-width: 0;
    min-height: 62px;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 12px;
    padding: 9px 14px;
    border-radius: 18px;
    font-size: 15px;
  }

  .cart-material-name {
    grid-column: 1;
    grid-row: 1;
    gap: 12px;
  }

  .cart-material-name img {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
  }

  .cart-material-row > span:not(.cart-material-name):not(.cart-material-detail) {
    display: none;
  }

  .cart-material-detail {
    display: block;
    grid-column: 1 / -1;
    grid-row: 2;
    padding-left: 54px;
    color: #667583;
    font-size: 14px;
    line-height: 1.25;
    text-align: left;
    white-space: normal;
  }

  .cart-material-row > strong {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
    color: var(--ink);
    font-size: 17px;
    text-align: right;
  }

  .cart-card .cart-actions {
    margin-top: 10px;
    justify-content: flex-start;
  }

  .cart-card .price {
    position: absolute;
    right: 112px;
    bottom: 22px;
    font-size: 24px;
    justify-self: auto;
  }
}

@media (max-width: 520px) {
  .cart-card {
    grid-template-columns: 116px minmax(0, 1fr);
    gap: 12px;
    min-height: 176px;
    padding: 44px 16px 18px;
  }

  .cart-card .cart-bracelet-thumb,
  .cart-card > img {
    width: 116px;
    height: 116px;
  }

  .cart-card h3 {
    display: none;
  }

  .cart-delete {
    top: auto;
    bottom: 14px;
    right: 14px;
    min-height: 32px;
    padding: 0 12px;
    font-size: 13px;
  }

  .cart-select {
    left: 16px;
  }

  .cart-select span {
    width: 26px;
    height: 26px;
  }

  .cart-material-row {
    min-height: 52px;
    padding: 7px 9px;
    border-radius: 14px;
    font-size: 13px;
  }

  .cart-material-name {
    gap: 8px;
  }

  .cart-material-name img {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
  }

  .cart-material-detail {
    padding-left: 38px;
    font-size: 12px;
  }

  .cart-material-row > strong {
    font-size: 14px;
  }

  .cart-card .price {
    right: 76px;
    bottom: 18px;
    font-size: 18px;
  }

  .cart-card .cart-actions {
    margin-top: 8px;
  }
}

/* Home style direction C: social lifestyle DTC */
body.home-page {
  background:
    linear-gradient(125deg, rgba(255, 249, 245, 0.98) 0%, rgba(247, 229, 228, 0.96) 42%, rgba(248, 246, 247, 1) 100%);
}

body.home-page .site-header {
  position: fixed;
  top: 0;
  background: rgba(255, 252, 251, 0.9);
  border-bottom-color: rgba(81, 69, 91, 0.14);
}

body.home-page .brand {
  font-family: Georgia, "Times New Roman", "Songti SC", serif;
  font-size: 18px;
  letter-spacing: 0;
}

body.home-page .brand-logo {
  width: clamp(190px, 20vw, 264px);
}

body.home-page .brand-mark {
  border-color: rgba(76, 60, 82, 0.2);
  background:
    radial-gradient(circle at 34% 30%, rgba(255, 255, 255, 0.95) 0 18%, transparent 19%),
    conic-gradient(from 26deg, #f7f0ee, #d4b98e, #fffaf7, #b6ccd2, #f7f0ee);
  box-shadow: inset 0 0 0 8px rgba(255, 255, 255, 0.5);
}

body.home-page .nav-links {
  color: #3b333f;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

body.home-page .nav-links a[aria-current="page"] {
  color: #6f5a2d;
}

body.home-page .button {
  min-height: 42px;
  border-radius: 999px;
  background: #243e35;
  color: #fffaf7;
  box-shadow: none;
}

body.home-page .button:hover {
  background: #172a24;
}

body.home-page .button.secondary {
  border-color: rgba(64, 50, 54, 0.36);
  background: rgba(255, 250, 247, 0.72);
  color: #46343a;
}

body.home-page .button.secondary:hover {
  background: #fffaf7;
}

body.home-page .home-hero {
  min-height: min(720px, calc(100svh - var(--header-height)));
  aspect-ratio: auto;
  border-bottom: 0;
  background: #ead8cf;
}

body.home-page .home-hero .hero-full-image {
  object-position: 64% 50%;
  filter: sepia(0.1) saturate(0.9) contrast(1.02) brightness(1.04);
}

body.home-page .home-hero::before {
  background:
    radial-gradient(ellipse 58% 82% at 18% 50%, rgba(255, 250, 246, 0.94) 0%, rgba(255, 250, 246, 0.83) 42%, rgba(255, 250, 246, 0.38) 66%, rgba(255, 250, 246, 0) 100%),
    linear-gradient(90deg, rgba(255, 246, 241, 0.78) 0%, rgba(255, 246, 241, 0.34) 48%, rgba(255, 246, 241, 0) 100%),
    linear-gradient(180deg, rgba(226, 177, 160, 0.14), rgba(244, 219, 211, 0.18));
}

body.home-page .hero-full-content {
  padding: clamp(72px, 9vw, 116px) 0 clamp(118px, 11vw, 148px);
}

body.home-page .home-hero .hero-copy {
  max-width: 600px;
}

body.home-page .hero-full-content.reveal {
  animation: none;
}

body.home-page .home-hero .kicker {
  color: #8a574f;
  font-size: 12px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

body.home-page .home-hero h1 {
  max-width: 640px;
  color: #2a1e1e;
  font-family: Georgia, "Times New Roman", "Songti SC", serif;
  font-size: clamp(48px, 6.4vw, 84px);
  font-weight: 500;
  letter-spacing: -0.025em;
}

body.home-page .home-hero .lead {
  max-width: 46ch;
  color: #413534;
  font-size: clamp(17px, 1.7vw, 20px);
}

body.home-page .home-proof-section {
  position: relative;
  z-index: 5;
  margin-top: clamp(-86px, -6vw, -54px);
  padding: 0 0 26px;
}

body.home-page .standard-strip {
  border: 0;
  border-radius: 8px;
  background: rgba(255, 252, 249, 0.92);
  box-shadow: 0 10px 28px rgba(62, 44, 42, 0.12);
}

body.home-page .standard-item,
body.home-page .standard-item:first-child,
body.home-page .standard-strip:hover .standard-item:first-child:not(:hover) {
  min-height: 124px;
  background: rgba(255, 252, 249, 0.92);
  color: #30272b;
}

body.home-page .standard-item + .standard-item {
  border-left: 1px solid rgba(80, 63, 61, 0.12);
}

body.home-page .standard-item strong {
  color: #3d3135;
  font-size: 15px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

body.home-page .standard-item span,
body.home-page .standard-item:first-child span,
body.home-page .standard-strip:hover .standard-item:first-child:not(:hover) span {
  color: #675f62;
}

body.home-page .standard-item:hover {
  background: #f8e7e3;
  color: #30272b;
  transform: translateY(-1px);
}

body.home-page .standard-item:hover span {
  color: #5c5155;
}

body.home-page .meaning-section {
  padding-top: clamp(46px, 7vw, 86px);
  background: linear-gradient(180deg, rgba(255, 250, 247, 0) 0%, rgba(255, 250, 247, 0.9) 18%, #fffdfb 100%);
}

body.home-page .section-header h2 {
  color: #211b1f;
  font-family: Georgia, "Times New Roman", "Songti SC", serif;
  font-weight: 500;
  letter-spacing: -0.02em;
}

body.home-page .section-header p {
  color: #655c62;
}

body.home-page .meaning-card {
  min-height: 250px;
  border-color: rgba(72, 58, 64, 0.13);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 252, 250, 0.82), rgba(255, 252, 250, 0.96)),
    var(--tone, #f6edf1);
}

body.home-page .meaning-card span {
  color: #6f5a2d;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

body.home-page .meaning-card strong {
  color: #221c1f;
  font-family: Georgia, "Times New Roman", "Songti SC", serif;
  font-size: 26px;
  font-weight: 600;
}

body.home-page .meaning-card--calm {
  --tone: #eef4f2;
}

body.home-page .meaning-card--love {
  --tone: #f8e6e2;
}

body.home-page .meaning-card--protect {
  --tone: #efedf0;
}

body.home-page .meaning-card--confidence {
  --tone: #f6edda;
}

body.home-page .lifestyle-section {
  background:
    linear-gradient(180deg, #fffdfb 0%, #f8ebe9 100%);
}

body.home-page .lifestyle-section .section-header,
body.home-page .ritual-section .section-header,
body.home-page .review-section .section-header {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

body.home-page .wear-carousel-main {
  background: #fffaf7;
  border-color: rgba(88, 65, 61, 0.14);
}

body.home-page .wear-carousel-main,
body.home-page .wear-note,
body.home-page .quiz-panel,
body.home-page .quiz-result,
body.home-page .ritual-feed article,
body.home-page .process-track,
body.home-page .panel,
body.home-page .quote-card,
body.home-page .faq-intro,
body.home-page .faq-panel,
body.home-page .final-cta {
  border-radius: 8px;
}

body.home-page .wear-note,
body.home-page .faq-intro {
  background: #3b2d32;
}

body.home-page .ritual-feed div {
  border: 0;
  border-radius: 8px;
  background: rgba(255, 252, 249, 0.9);
}

body.home-page .quiz-section,
body.home-page .faq-section {
  background: linear-gradient(180deg, rgba(248, 235, 233, 0.08), rgba(245, 226, 224, 0.72));
}

body.home-page .process-step span,
body.home-page .quiz-options button.is-active {
  background: #f3ddd9;
  color: #7e4d47;
}

body.home-page .quiz-panel,
body.home-page .quiz-result {
  background: rgba(255, 252, 249, 0.92);
  border-color: rgba(88, 65, 61, 0.14);
}

body.home-page .ritual-section {
  background:
    linear-gradient(180deg, #f5e6e4 0%, #fffaf7 100%);
}

body.home-page .ritual-feed article {
  border-color: rgba(88, 65, 61, 0.13);
  background: #fffaf7;
}

body.home-page .process-section {
  background: #fffaf7;
}

body.home-page .process-track {
  border: 0;
  background: rgba(86, 64, 59, 0.12);
}

body.home-page .process-step {
  background: rgba(255, 252, 249, 0.94);
}

body.home-page .material-section {
  background:
    linear-gradient(135deg, #fffaf7 0%, #f2e7e4 100%);
}

body.home-page .material-section .panel {
  background: #3b2d32;
  color: #fffaf7;
  border: 0;
}

body.home-page .material-section .panel .lead,
body.home-page .material-section .detail-item span {
  color: rgba(255, 250, 247, 0.76);
}

body.home-page .material-section .detail-item {
  border-color: rgba(255, 250, 247, 0.16);
}

body.home-page .review-section {
  background: #fffaf7;
}

body.home-page .quote-card {
  background: #fffdfb;
  border-color: rgba(88, 65, 61, 0.13);
}

body.home-page .faq-section {
  background:
    linear-gradient(180deg, #fffaf7 0%, #f4e7e5 100%);
}

body.home-page .faq-panel {
  background: rgba(255, 252, 249, 0.9);
  border-color: rgba(88, 65, 61, 0.14);
}

body.home-page .final-section {
  background:
    linear-gradient(180deg, #f4e7e5 0%, #fff8f5 100%);
}

body.home-page .final-cta {
  border: 0;
  background:
    linear-gradient(90deg, rgba(255, 250, 247, 0.96), rgba(255, 250, 247, 0.78)),
    url("assets/generated-crystal-ritual.png") center / cover;
  color: #2b211f;
}

@media (max-width: 900px) {
  body.home-page .home-hero {
    min-height: 620px;
  }

  body.home-page .home-hero::before {
    background:
      linear-gradient(180deg, rgba(255, 250, 247, 0.06) 0%, rgba(255, 250, 247, 0.54) 46%, rgba(255, 250, 247, 0.96) 100%),
      linear-gradient(90deg, rgba(255, 250, 247, 0.72), rgba(255, 250, 247, 0.08));
  }

  body.home-page .home-hero .hero-full-image {
    object-position: 66% center;
  }

  body.home-page .hero-full-content {
    align-self: end;
    padding: 0 0 112px;
  }

  body.home-page .home-proof-section {
    margin-top: -72px;
  }

  body.home-page .standard-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.home-page .standard-item + .standard-item {
    border-left: 0;
  }
}

@media (max-width: 680px) {
  body.home-page .brand {
    font-size: 14px;
  }

  body.home-page .brand > span:last-child {
    max-width: 88px;
  }

  body.home-page .nav-links {
    justify-content: flex-start;
    text-transform: none;
    letter-spacing: 0;
    font-size: 11px;
    gap: 7px;
  }

  body.home-page .home-hero {
    min-height: 560px;
  }

  body.home-page .home-hero h1 {
    max-width: 12ch;
    font-size: clamp(35px, 10.5vw, 45px);
    line-height: 1.05;
  }

  body.home-page .home-hero .lead {
    max-width: 30ch;
    font-size: 14px;
  }

  body.home-page .hero-full-content {
    padding-bottom: 92px;
  }

  body.home-page .home-proof-section {
    margin-top: -58px;
    padding-bottom: 12px;
  }

  body.home-page .standard-strip {
    grid-template-columns: 1fr 1fr;
  }

  body.home-page .standard-item {
    min-height: 108px;
    padding: 16px;
  }

  body.home-page .standard-item strong {
    font-size: 12px;
  }

  body.home-page .standard-item span {
    font-size: 12px;
    line-height: 1.35;
  }

body.home-page .meaning-card {
    min-height: 164px;
  }
}

/* Style direction C applied across secondary pages */
body.customizer-page,
body.designer-page,
body.cart-page {
  --bg: #f6f5f1;
  --surface: #fffdfb;
  --surface-2: #eeebe3;
  --ink: #171a1d;
  --muted: #596166;
  --line: rgba(36, 62, 53, 0.16);
  --accent: #b9974e;
  --accent-dark: #243e35;
  --accent-soft: #efe7d5;
  background:
    linear-gradient(180deg, rgba(239, 235, 227, 0.72), rgba(255, 253, 251, 0.96) 320px),
    #f6f5f1;
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.customizer-page .site-header,
body.designer-page .site-header,
body.cart-page .site-header {
  background: rgba(255, 253, 251, 0.9);
  border-bottom-color: rgba(36, 62, 53, 0.14);
}

body.customizer-page .site-header--compact {
  position: fixed;
  top: 0;
}

body.customizer-page .brand,
body.designer-page .brand,
body.cart-page .brand {
  color: #171a1d;
  letter-spacing: 0;
}

body.customizer-page .brand-logo,
body.designer-page .brand-logo,
body.cart-page .brand-logo {
  width: clamp(172px, 18vw, 238px);
}

body.customizer-page .brand-mark,
body.designer-page .brand-mark,
body.cart-page .brand-mark {
  border-color: rgba(185, 151, 78, 0.32);
  background: conic-gradient(from 24deg, #fffaf7, #dfc986, #ffffff, #dfe6df, #fffaf7);
  box-shadow: inset 0 0 0 8px rgba(255, 255, 255, 0.58);
}

body.customizer-page .nav-links,
body.designer-page .nav-links,
body.cart-page .nav-links {
  color: #2f332f;
}

body.customizer-page .nav-links a[aria-current="page"],
body.designer-page .nav-links a[aria-current="page"],
body.cart-page .nav-links a[aria-current="page"] {
  color: #243e35;
}

body.customizer-page .button,
body.designer-page .button,
body.cart-page .button {
  background: #243e35;
  color: #fffaf7;
}

body.customizer-page .button:hover,
body.designer-page .button:hover,
body.cart-page .button:hover {
  background: #172a24;
}

body.customizer-page .button.secondary,
body.designer-page .button.secondary,
body.cart-page .button.secondary {
  background: transparent;
  border-color: rgba(36, 62, 53, 0.26);
  color: #3a3132;
}

body.customizer-page .customizer-embed-page {
  min-height: calc(100vh - var(--header-height));
  padding: 32px 16px 48px;
  background:
    linear-gradient(135deg, rgba(251, 242, 240, 0.92), rgba(255, 253, 251, 0.72)),
    #f8f6f6;
}

body.customizer-page .customizer-embed-shell {
  width: min(1280px, 100%);
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid rgba(82, 63, 59, 0.14);
  border-radius: 8px;
  background: rgba(255, 253, 251, 0.92);
  box-shadow: none;
}

body.customizer-page .customizer-embed {
  min-height: 900px;
  background: transparent;
}

body.designer-page .hero-full {
  min-height: 560px;
  background: #efe6e1;
}

body.designer-page .hero-full::before {
  background:
    linear-gradient(90deg, rgba(255, 250, 247, 0.94) 0%, rgba(255, 250, 247, 0.72) 38%, rgba(255, 250, 247, 0.06) 72%),
    linear-gradient(180deg, rgba(43, 31, 27, 0.04), rgba(43, 31, 27, 0.1));
}

body.designer-page .hero-full-gallery .hero-full-image {
  object-position: 72% center;
}

body.designer-page .hero-copy h1 {
  max-width: 12ch;
  color: #3a2822;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 500;
  letter-spacing: -0.025em;
}

body.designer-page .kicker {
  color: #9d6257;
  letter-spacing: 0.08em;
}

body.designer-page .section.tight,
body.cart-page .section {
  background:
    linear-gradient(180deg, rgba(255, 250, 247, 0.8), rgba(248, 246, 246, 0.96));
}

body.designer-page .section-header h2,
body.cart-page .section-header h1,
body.cart-page .checkout-card h2 {
  color: #171a1d;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 500;
  letter-spacing: -0.02em;
}

body.designer-page .filter-bar button {
  border-color: transparent;
  border-radius: 8px;
  background: rgba(255, 253, 251, 0.88);
  color: #42383a;
}

body.designer-page .filter-bar button.is-active {
  background: #3a3132;
  color: #fffaf7;
}

body.designer-page #designerGrid .product-card,
body.designer-page .panel,
body.designer-page .image-panel,
body.cart-page .cart-card,
body.cart-page .checkout-card,
body.cart-page .policy-card {
  border-color: rgba(82, 63, 59, 0.14);
  border-radius: 8px;
  background: rgba(255, 253, 251, 0.92);
  box-shadow: none;
}

body.designer-page #designerGrid .product-card img,
body.designer-page .image-panel img {
  background: #f7f1ef;
}

body.designer-page #designerGrid .product-card h3 {
  color: #21191a;
}

body.designer-page .tag {
  border-color: rgba(185, 120, 114, 0.2);
  background: #f7ebe8;
  color: #74514c;
}

body.cart-page .section {
  padding-top: 84px;
}

body.cart-page .section-header {
  max-width: 780px;
  margin-bottom: 38px;
}

body.cart-page .section-header h1 {
  font-size: clamp(54px, 8vw, 86px);
  line-height: 0.95;
}

body.cart-page .cart-layout {
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 26px;
}

body.cart-page #cartMount {
  gap: 16px;
}

body.cart-page .cart-card {
  grid-template-columns: 34px 158px minmax(0, 1fr) auto;
  min-height: 218px;
  gap: 18px;
  align-items: center;
  padding: 22px 22px 24px;
}

body.cart-page .cart-select {
  position: static;
  justify-self: center;
}

body.cart-page .cart-select span {
  width: 26px;
  height: 26px;
  border-color: rgba(82, 63, 59, 0.24);
  background: #fffdfb;
}

body.cart-page .cart-select input:checked + span {
  border-color: #243e35;
  background: #243e35;
}

body.cart-page .cart-delete {
  top: auto;
  right: 18px;
  bottom: 16px;
  border-color: rgba(127, 29, 29, 0.18);
  background: #fffaf7;
  color: #8b2b26;
}

body.cart-page .cart-card .cart-bracelet-thumb,
body.cart-page .cart-card > img {
  width: 150px;
  height: 150px;
  border-color: rgba(82, 63, 59, 0.14);
  border-radius: 8px;
  background: #f8f3f1;
  object-fit: contain;
}

body.cart-page .cart-card h3 {
  display: none;
}

body.cart-page .cart-material-list {
  margin: 0;
}

body.cart-page .cart-material-list h4 {
  color: #171a1d;
  font-size: 22px;
}

body.cart-page .cart-material-head {
  color: #756b6d;
}

body.cart-page .cart-material-row {
  border-color: rgba(82, 63, 59, 0.14);
  background: #fffdfb;
}

body.cart-page .cart-material-name img {
  background: #f4eeee;
}

body.cart-page .cart-card .price {
  color: #243e35;
  font-size: 22px;
}

body.cart-page .cart-actions {
  margin-top: 12px;
}

body.cart-page .text-button {
  color: #243e35;
  font-weight: 900;
}

body.cart-page .summary-row {
  border-bottom-color: rgba(82, 63, 59, 0.14);
}

body.cart-page textarea {
  border-color: rgba(82, 63, 59, 0.18);
  background: #fffdfb;
  color: #171a1d;
}

body.cart-page .trust-list {
  color: #595052;
}

@media (max-width: 900px) {
  body.designer-page .hero-full {
    min-height: 560px;
  }

  body.designer-page .hero-full::before {
    background:
      linear-gradient(180deg, rgba(255, 250, 247, 0.12), rgba(255, 250, 247, 0.92) 72%),
      linear-gradient(90deg, rgba(255, 250, 247, 0.72), rgba(255, 250, 247, 0.08));
  }

  body.designer-page .hero-full-content {
    align-self: end;
    padding-bottom: 74px;
  }

  body.cart-page .cart-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  body.customizer-page .customizer-embed-page {
    padding: 10px 8px 28px;
  }

  body.customizer-page .customizer-embed-shell {
    border-radius: 8px;
  }

  body.customizer-page .site-header--compact .nav,
  body.designer-page .nav,
  body.cart-page .nav {
    gap: 10px;
  }

  body.customizer-page .brand > span:last-child,
  body.designer-page .brand > span:last-child,
  body.cart-page .brand > span:last-child {
    max-width: 94px;
    line-height: 1.12;
  }

  body.designer-page .nav-links,
  body.cart-page .nav-links,
  body.customizer-page .nav-links {
    gap: 7px;
    font-size: 11px;
  }

  body.designer-page .nav-links .button,
  body.cart-page .nav-links .button {
    display: none;
  }

  body.designer-page .hero-copy h1 {
    max-width: 11ch;
    font-size: 42px;
  }

  body.cart-page .section {
    padding-top: 52px;
  }

  body.cart-page .section-header {
    margin-bottom: 26px;
  }

  body.cart-page .section-header h1 {
    font-size: 54px;
  }

  body.cart-page .cart-card {
    grid-template-columns: 28px 132px minmax(0, 1fr);
    min-height: 184px;
    gap: 12px;
    padding: 18px 14px 52px;
  }

  body.cart-page .cart-card .cart-bracelet-thumb,
  body.cart-page .cart-card > img {
    width: 132px;
    height: 132px;
  }

  body.cart-page .cart-card .price {
    position: absolute;
    right: 118px;
    bottom: 18px;
    font-size: 22px;
  }

  body.cart-page .cart-delete {
    right: 14px;
    bottom: 15px;
  }
}

@media (max-width: 430px) {
  body.cart-page .cart-card {
    grid-template-columns: 24px 112px minmax(0, 1fr);
    gap: 8px;
    padding: 16px 12px 50px;
  }

  body.cart-page .cart-card .cart-bracelet-thumb,
  body.cart-page .cart-card > img {
    width: 112px;
    height: 112px;
  }

  body.cart-page .cart-material-row {
    min-height: 48px;
    padding: 7px 9px;
  }

  body.cart-page .cart-material-name strong {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    line-height: 1.15;
  }

  body.cart-page .cart-material-name img {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
  }

  body.cart-page .cart-material-name strong {
    font-size: 13px;
  }

  body.cart-page .cart-material-detail {
    padding-left: 38px;
    font-size: 12px;
  }

  body.cart-page .cart-card .price {
    right: 102px;
    bottom: 18px;
    font-size: 19px;
  }
}

/* Final cart polish: compact multi-bracelet rows */
body.cart-page .cart-card h3 {
  display: none !important;
}

body.cart-page .cart-delete {
  top: auto !important;
  right: 18px !important;
  bottom: 16px !important;
}

body.cart-page .cart-card .price {
  align-self: end;
  justify-self: end;
}

@media (max-width: 700px) {
  body.cart-page .cart-card {
    grid-template-columns: 26px minmax(118px, 134px) minmax(0, 1fr);
    align-items: center;
    padding-bottom: 54px;
  }

  body.cart-page .cart-material-list {
    gap: 7px;
  }

  body.cart-page .cart-material-list h4,
  body.cart-page .cart-material-head {
    display: none;
  }

  body.cart-page .cart-material-row {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px 8px;
    border-radius: 12px;
  }

  body.cart-page .cart-material-name {
    grid-row: span 2;
  }

  body.cart-page .cart-material-name strong {
    white-space: normal;
  }

  body.cart-page .cart-material-row > span:not(.cart-material-name):not(.cart-material-detail) {
    display: none;
  }

  body.cart-page .cart-material-detail {
    display: block;
    padding-left: 0;
    color: #6b6264;
    font-size: 12px;
    font-weight: 800;
    text-align: right;
    white-space: nowrap;
  }

  body.cart-page .cart-material-row > strong {
    grid-column: 2;
    text-align: right;
  }

  body.cart-page .cart-card .cart-actions {
    margin-top: 10px;
  }

  body.cart-page .cart-card .price {
    position: absolute;
    right: 112px;
    bottom: 18px;
    font-size: 22px;
  }
}

@media (max-width: 430px) {
  body.cart-page .cart-card {
    grid-template-columns: 22px 104px minmax(0, 1fr);
    gap: 7px;
    padding: 14px 10px 52px;
  }

  body.cart-page .cart-card .cart-bracelet-thumb,
  body.cart-page .cart-card > img {
    width: 104px;
    height: 104px;
  }

  body.cart-page .cart-select span {
    width: 23px;
    height: 23px;
  }

  body.cart-page .cart-material-row {
    min-height: 46px;
    padding: 7px 8px;
  }

  body.cart-page .cart-material-name {
    gap: 7px;
  }

  body.cart-page .cart-material-name img {
    width: 28px;
    height: 28px;
    flex-basis: 28px;
  }

  body.cart-page .cart-material-detail {
    font-size: 11px;
  }

  body.cart-page .cart-card .price {
    right: 98px;
    bottom: 17px;
    font-size: 19px;
  }

  body.cart-page .cart-delete {
    right: 12px !important;
    bottom: 14px !important;
  }
}

/* Final responsive corrections from visual QA */
body.customizer-page .customizer-embed-shell {
  overflow: visible !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.customizer-page .customizer-embed-page {
  padding-top: 0 !important;
  padding-right: 18px !important;
  padding-left: 18px !important;
}

body.customizer-page .customizer-embed {
  display: block !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
}

body.cart-page .cart-card.empty {
  display: grid !important;
  grid-template-columns: 1fr !important;
  min-height: 220px !important;
  align-content: center !important;
  justify-items: start !important;
  padding: 42px 48px !important;
}

body.cart-page .cart-card.empty h2 {
  white-space: normal !important;
  text-wrap: balance;
}

body.cart-page .checkout-card {
  min-width: 0;
}

body.cart-page .summary-row {
  grid-template-columns: minmax(0, 1fr) auto;
}

body.cart-page .summary-row strong {
  max-width: 16ch;
  text-align: right;
  white-space: normal;
}

body.cart-page .summary-row strong {
  white-space: nowrap;
}

@media (max-width: 680px) {
  body.home-page .nav {
    gap: 8px;
  }

  body.home-page .brand {
    gap: 7px;
    font-size: 13px;
  }

  body.home-page .brand-mark {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
  }

  body.home-page .brand > span:last-child {
    max-width: 72px;
  }

  body.home-page .nav-links {
    flex: 1 1 auto;
    min-width: 0;
    justify-content: flex-end;
    gap: clamp(7px, 2vw, 11px);
    font-size: clamp(10px, 2.7vw, 12px);
    white-space: nowrap;
  }
}

@media (max-width: 700px) {
  body.customizer-page .customizer-embed-page {
    padding: 0 8px 8px !important;
  }

  body.cart-page .cart-card.empty {
    min-height: 176px !important;
    padding: 32px 24px !important;
    justify-items: center !important;
    text-align: center !important;
  }

  body.cart-page .cart-card.empty .actions {
    justify-content: center;
  }
}

/* Mobile cart QA fixes */
body.cart-page .cart-bracelet-canvas {
  aspect-ratio: 1;
}

@media (max-width: 900px) {
  body.cart-page .cart-card {
    align-items: center;
  }

  body.cart-page .cart-card .cart-bracelet-thumb {
    display: grid;
    place-items: center;
  }

  body.cart-page .cart-material-list {
    min-width: 0;
  }

  body.cart-page .cart-material-list h4,
  body.cart-page .cart-material-head {
    display: none;
  }

  body.cart-page .cart-material-row {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "name total"
      "detail total";
    align-items: center;
    gap: 2px 10px;
    min-height: 66px;
    padding: 9px 12px;
    border-radius: 16px;
  }

  body.cart-page .cart-material-name {
    grid-area: name;
    min-width: 0;
    gap: 9px;
  }

  body.cart-page .cart-material-name strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.cart-page .cart-material-row > span:not(.cart-material-name):not(.cart-material-detail) {
    display: none;
  }

  body.cart-page .cart-material-detail {
    display: block;
    grid-area: detail;
    min-width: 0;
    padding-left: 47px;
    color: #6f6462;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
    text-align: left;
    white-space: nowrap;
  }

  body.cart-page .cart-material-row > strong {
    grid-area: total;
    align-self: center;
    justify-self: end;
    color: var(--ink);
    text-align: right;
  }
}

@media (max-width: 430px) {
  body.cart-page .cart-material-row {
    min-height: 58px;
    padding: 8px 10px;
    gap: 1px 8px;
  }

  body.cart-page .cart-material-name img {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
  }

  body.cart-page .cart-material-detail {
    padding-left: 39px;
    font-size: 11px;
  }

  body.cart-page .checkout-option {
    grid-template-columns: 16px minmax(0, 1fr) auto;
    gap: 6px;
    min-height: 40px;
    padding: 8px;
  }

  body.cart-page .checkout-option-copy strong {
    font-size: 12px;
  }

  body.cart-page .checkout-option-copy small {
    display: none;
  }

  body.cart-page .checkout-option-price {
    font-size: 12px;
  }
}

@media (max-width: 380px) {
  body.cart-page .checkout-options {
    grid-template-columns: 1fr 1fr;
  }

  body.cart-page .checkout-options--extras {
    grid-template-columns: 1fr;
  }

  body.cart-page .checkout-options h3 {
    grid-column: 1 / -1;
  }
}

@media (max-width: 900px) {
  body.cart-page .policy-section {
    margin-top: 22px;
  }

  body.cart-page .policy-section h2 {
    font-size: 24px;
  }

  body.cart-page .policy-grid {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 0;
  }
}

/* VEYLOVA final brand asset */
.brand:has(.brand-logo) {
  gap: 0;
  min-width: 0;
}

.brand:has(.brand-logo) .brand-logo {
  flex: 0 0 auto;
}

.site-header--compact .brand:has(.brand-logo),
body.home-page .brand:has(.brand-logo),
body.customizer-page .brand:has(.brand-logo),
body.designer-page .brand:has(.brand-logo),
body.cart-page .brand:has(.brand-logo) {
  flex: 0 0 auto;
  min-width: 0;
  font-size: 0;
}

@media (max-width: 900px) {
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: clamp(150px, 34vw, 210px);
    max-height: 44px;
  }
}

@media (max-width: 680px) {
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: clamp(122px, 36vw, 172px);
    max-height: 38px;
  }
}

/* VEYLOVA brand refinement */
.site-header,
body.home-page .site-header,
body.customizer-page .site-header,
body.designer-page .site-header,
body.cart-page .site-header {
  background: rgba(251, 250, 247, 0.92);
  border-bottom-color: rgba(36, 62, 53, 0.14);
}

.brand-logo,
body.home-page .brand-logo,
body.customizer-page .brand-logo,
body.designer-page .brand-logo,
body.cart-page .brand-logo {
  width: clamp(184px, 16vw, 226px);
  max-height: 48px;
}

.nav-links,
body.home-page .nav-links,
body.customizer-page .nav-links,
body.designer-page .nav-links,
body.cart-page .nav-links {
  color: #2f332f;
}

.nav-links a:not(.button),
body.home-page .nav-links a:not(.button) {
  color: #2f332f;
}

.nav-links a:not(.button):hover,
body.home-page .nav-links a:not(.button):hover {
  background: rgba(185, 151, 78, 0.12);
  color: #243e35;
}

.nav-links a:not(.button)[aria-current="page"],
body.home-page .nav-links a[aria-current="page"],
body.customizer-page .nav-links a[aria-current="page"],
body.designer-page .nav-links a[aria-current="page"],
body.cart-page .nav-links a[aria-current="page"] {
  background: rgba(185, 151, 78, 0.14);
  color: #243e35;
  font-weight: 900;
}

.button,
body.home-page .button,
body.customizer-page .button,
body.designer-page .button,
body.cart-page .button {
  background: #243e35;
  border-color: #243e35;
  color: #fbfaf7;
  box-shadow: none;
}

.button:hover,
body.home-page .button:hover,
body.customizer-page .button:hover,
body.designer-page .button:hover,
body.cart-page .button:hover {
  background: #172a24;
  border-color: #172a24;
}

.button.secondary,
body.home-page .button.secondary,
body.customizer-page .button.secondary,
body.designer-page .button.secondary,
body.cart-page .button.secondary,
.final-cta .button.secondary {
  background: rgba(251, 250, 247, 0.82);
  border-color: rgba(36, 62, 53, 0.28);
  color: #243e35;
}

.button.secondary:hover,
body.home-page .button.secondary:hover,
body.customizer-page .button.secondary:hover,
body.designer-page .button.secondary:hover,
body.cart-page .button.secondary:hover,
.final-cta .button.secondary:hover {
  background: #fbfaf7;
  border-color: rgba(185, 151, 78, 0.52);
}

.kicker,
body.home-page .kicker {
  color: #243e35;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

body.home-page .home-hero,
body.designer-page .hero-full-gallery {
  background: #f3f0e9;
}

body.home-page .home-hero::before {
  background:
    radial-gradient(ellipse 58% 78% at 16% 51%, rgba(251, 250, 247, 0.9) 0%, rgba(251, 250, 247, 0.78) 34%, rgba(251, 250, 247, 0.42) 54%, rgba(251, 250, 247, 0.12) 72%, rgba(251, 250, 247, 0) 100%),
    linear-gradient(90deg, rgba(251, 250, 247, 0.38) 0%, rgba(251, 250, 247, 0.16) 42%, rgba(251, 250, 247, 0) 74%);
}

.cart-badge,
.quiz-options button.is-active,
.faq-filter button.is-active,
.filter-bar button.is-active,
body.designer-page .filter-bar button.is-active,
.carousel-dots button.is-active {
  background: #243e35;
  border-color: #243e35;
  color: #fbfaf7;
}

.text-button,
body.cart-page .text-button {
  color: #243e35;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline-color: rgba(185, 151, 78, 0.46);
}

@media (max-width: 900px) {
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: clamp(142px, 30vw, 194px);
    max-height: 42px;
  }
}

@media (max-width: 680px) {
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: clamp(94px, 27vw, 112px);
    max-height: 30px;
  }

  .nav {
    gap: 4px;
  }

  .nav-links {
    gap: 2px;
    font-size: 11px;
  }

  .nav-links a:not(.button) {
    min-height: 28px;
    padding: 0 4px;
  }

  body.home-page .home-hero {
    min-height: 520px !important;
    aspect-ratio: auto !important;
    align-items: start;
  }

  body.home-page .hero-full-content {
    padding: 34px 0 126px;
  }

  body.home-page .hero-copy {
    max-width: 330px;
  }

  body.home-page .hero-actions {
    display: flex;
    margin-top: 18px;
  }
}

/* Final responsive polish: navigation, hero images, and cart containment. */
.nav-links {
  gap: 8px;
  font-size: 13px;
  font-weight: 750;
}

.nav-links a:not(.button) {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  border-radius: 999px;
  color: #3a3132;
  transition: background 160ms ease, color 160ms ease, transform 160ms ease;
}

.nav-links a:not(.button):hover {
  background: rgba(185, 151, 78, 0.12);
  color: #243e35;
}

.nav-links a:not(.button)[aria-current="page"] {
  background: rgba(185, 151, 78, 0.14);
  color: #243e35;
  font-weight: 900;
}

.nav-links .button {
  min-height: 42px;
  padding: 0 18px;
  font-size: 13px;
  font-weight: 900;
}

body.home-page .home-hero,
body.designer-page .hero-full-gallery {
  background: #f4ebe6;
}

body.home-page .home-hero .hero-full-image,
body.designer-page .hero-full-gallery .hero-full-image {
  object-fit: contain !important;
  object-position: center center !important;
}

body.cart-page .cart-layout {
  grid-template-columns: minmax(0, 1fr) minmax(320px, 360px);
  align-items: start;
}

body.cart-page .cart-card {
  grid-template-columns: 34px 150px minmax(0, 1fr);
  overflow: hidden;
}

body.cart-page .cart-card > .price {
  display: none !important;
}

body.cart-page .cart-material-list {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

body.cart-page .cart-material-head,
body.cart-page .cart-material-row {
  grid-template-columns: minmax(132px, 1fr) 56px 48px 46px 62px;
  max-width: 100%;
}

body.cart-page .cart-material-row {
  min-width: 0;
}

body.cart-page .cart-material-name {
  min-width: 0;
}

body.cart-page .cart-material-name strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.cart-page .checkout-card {
  position: relative;
  z-index: 2;
}

@media (max-width: 900px) {
  body.home-page .home-hero,
  body.designer-page .hero-full-gallery {
    min-height: auto !important;
    aspect-ratio: 16 / 9;
  }

  body.home-page .home-hero .hero-full-image,
  body.designer-page .hero-full-gallery .hero-full-image {
    object-fit: contain !important;
    object-position: center center !important;
  }

  .nav-links {
    gap: 4px;
    font-size: 12px;
  }

  .nav-links a:not(.button) {
    min-height: 30px;
    padding: 0 7px;
  }

  .nav-links .button {
    min-height: 34px;
    padding: 0 12px;
    font-size: 12px;
  }
}

/* Mobile bag containment: items first, summary second. */
@media (max-width: 900px) {
  body.cart-page .cart-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 26px !important;
  }

  body.cart-page #cartMount {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  body.cart-page .cart-card {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: 26px 116px minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: center !important;
    padding: 16px 14px 54px !important;
    overflow: hidden !important;
  }

  body.cart-page .cart-card .cart-bracelet-thumb,
  body.cart-page .cart-card > img {
    width: 116px !important;
    height: 116px !important;
  }

  body.cart-page .cart-material-list {
    min-width: 0 !important;
    width: 100% !important;
  }

  body.cart-page .cart-material-row {
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "name total"
      "detail total" !important;
    column-gap: 8px !important;
  }

  body.cart-page .cart-material-name {
    min-width: 0 !important;
  }

  body.cart-page .cart-material-name strong {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.cart-page .cart-material-detail {
    grid-area: detail !important;
    min-width: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  body.cart-page .cart-material-row > strong {
    grid-area: total !important;
    white-space: nowrap !important;
  }

  body.cart-page .checkout-card {
    width: 100% !important;
    max-width: 100% !important;
    justify-self: stretch !important;
  }
}

@media (max-width: 430px) {
  .nav-links a[href="index.html"] {
    display: none !important;
  }

  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: 92px !important;
    max-height: 28px !important;
  }

  body.cart-page .cart-card {
    grid-template-columns: 22px 104px minmax(0, 1fr) !important;
    gap: 8px !important;
    padding-inline: 12px !important;
  }

  body.cart-page .cart-card .cart-bracelet-thumb,
  body.cart-page .cart-card > img {
    width: 104px !important;
    height: 104px !important;
  }

  body.cart-page .cart-material-detail {
    display: none !important;
  }

  body.cart-page .cart-material-row {
    grid-template-areas: "name total" !important;
    min-height: 64px !important;
  }
}

/* Absolute final mobile hero and bag badge cleanup - 2026-07-04 */
.cart-badge,
.cart-badge.is-visible {
  display: none !important;
}

@media (max-width: 900px) {
  body.home-page .home-hero .hero-full-image,
  body.designer-page .hero-full-gallery .hero-full-image {
    object-fit: cover !important;
    object-position: center center !important;
  }
}

/* Final mobile commerce layout cleanup - 2026-07-04 */
body.home-page .home-proof-section {
  margin-top: 24px !important;
  padding-top: 0 !important;
  position: relative !important;
  z-index: 2 !important;
}

@media (max-width: 680px) {
  body.home-page .home-proof-section {
    margin-top: 20px !important;
    padding-bottom: 14px !important;
  }

  body.home-page .standard-strip {
    background: rgba(255, 253, 251, 0.98) !important;
    box-shadow: 0 12px 24px rgba(36, 62, 53, 0.04) !important;
  }
}

.nav-links a.cart-link {
  width: 42px !important;
  min-width: 42px !important;
  padding-inline: 0 !important;
  font-size: 0 !important;
  gap: 0 !important;
}

.nav-links a.cart-link::before {
  content: "";
  width: 19px;
  height: 19px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M6 6h15l-1.5 8.5a2 2 0 0 1-2 1.5H9a2 2 0 0 1-2-1.6L5 3H2m7 18h.01M18 21h.01'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M6 6h15l-1.5 8.5a2 2 0 0 1-2 1.5H9a2 2 0 0 1-2-1.6L5 3H2m7 18h.01M18 21h.01'/%3E%3C/svg%3E") center / contain no-repeat;
}

@media (max-width: 900px) {
  body.cart-page .cart-card .cart-actions {
    position: absolute !important;
    left: 50px !important;
    bottom: 15px !important;
    width: 116px !important;
    justify-content: center !important;
    margin: 0 !important;
  }

  body.cart-page .cart-card .cart-actions .text-button {
    display: inline-flex !important;
    min-height: 30px !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 13px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 430px) {
  body.cart-page .cart-card .cart-actions {
    left: 42px !important;
    width: 104px !important;
  }
}

/* Final home trimming after removing selected content blocks - 2026-07-04 */
body.home-page .wear-grid,
body.home-page .wear-carousel {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.home-page .wear-carousel-main {
  width: 100% !important;
}

body.home-page .faq-layout {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.home-page .faq-panel {
  width: 100% !important;
}

@media (max-width: 680px) {
  body.home-page .home-hero,
  body.designer-page .hero-full-gallery {
    overflow: hidden !important;
  }

  body.home-page .home-hero .hero-full-image {
    object-fit: cover !important;
    object-position: 66% center !important;
  }

  body.designer-page .hero-full-gallery .hero-full-image {
    object-fit: cover !important;
    object-position: center center !important;
  }
}

/* Absolute final mobile hero and bag badge cleanup - 2026-07-04 */
.cart-badge,
.cart-badge.is-visible {
  display: none !important;
}

@media (max-width: 900px) {
  body.home-page .home-hero .hero-full-image,
  body.designer-page .hero-full-gallery .hero-full-image {
    object-fit: cover !important;
    object-position: center center !important;
  }
}

@media (max-width: 680px) {
  body.home-page .home-hero,
  body.designer-page .hero-full-gallery {
    overflow: hidden !important;
  }

  body.home-page .home-hero .hero-full-image {
    object-fit: cover !important;
    object-position: 66% center !important;
  }

  body.designer-page .hero-full-gallery .hero-full-image {
    object-fit: cover !important;
    object-position: center center !important;
  }
}

/* Final mobile hero and bag badge cleanup - 2026-07-04 */
.cart-badge,
.cart-badge.is-visible {
  display: none !important;
}

@media (max-width: 900px) {
  body.home-page .home-hero .hero-full-image,
  body.designer-page .hero-full-gallery .hero-full-image {
    object-fit: cover !important;
    object-position: center center !important;
  }
}

@media (max-width: 680px) {
  body.home-page .home-hero,
  body.designer-page .hero-full-gallery {
    overflow: hidden !important;
  }

  body.home-page .home-hero .hero-full-image {
    object-fit: cover !important;
    object-position: 66% center !important;
  }

  body.designer-page .hero-full-gallery .hero-full-image {
    object-fit: cover !important;
    object-position: center center !important;
  }
}

/* Final navigation scale: keep every page on the same uppercase system. */
@media (min-width: 681px) {
  .nav-links,
  body.home-page .nav-links,
  body.customizer-page .nav-links,
  body.designer-page .nav-links,
  body.cart-page .nav-links {
    gap: 8px !important;
    padding: 4px !important;
    border-radius: 999px !important;
    background: rgba(251, 250, 247, 0.74) !important;
  }

  .nav-links a:not(.button),
  body.home-page .nav-links a:not(.button),
  body.customizer-page .nav-links a:not(.button),
  body.designer-page .nav-links a:not(.button),
  body.cart-page .nav-links a:not(.button) {
    min-height: 40px !important;
    padding: 0 17px !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.08em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
  }

  .nav-links .button,
  body.home-page .nav-links .button,
  body.customizer-page .nav-links .button,
  body.designer-page .nav-links .button,
  body.cart-page .nav-links .button {
    min-height: 40px !important;
    padding: 0 19px !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.08em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
  }
}

/* Final navigation scale: keep every page on the same uppercase system. */
@media (min-width: 681px) {
  .nav-links,
  body.home-page .nav-links,
  body.customizer-page .nav-links,
  body.designer-page .nav-links,
  body.cart-page .nav-links {
    gap: 8px !important;
    padding: 4px !important;
    border-radius: 999px !important;
    background: rgba(251, 250, 247, 0.74) !important;
  }

  .nav-links a:not(.button),
  body.home-page .nav-links a:not(.button),
  body.customizer-page .nav-links a:not(.button),
  body.designer-page .nav-links a:not(.button),
  body.cart-page .nav-links a:not(.button) {
    min-height: 40px !important;
    padding: 0 17px !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.08em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
  }

  .nav-links .button,
  body.home-page .nav-links .button,
  body.customizer-page .nav-links .button,
  body.designer-page .nav-links .button,
  body.cart-page .nav-links .button {
    min-height: 40px !important;
    padding: 0 19px !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.08em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
  }
}

/* Compact home proof strip */
body.home-page .home-proof-section {
  margin-top: -72px !important;
}

body.home-page .standard-strip {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  width: min(100%, 1120px) !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 14px 18px !important;
  border: 1px solid rgba(185, 151, 78, 0.2) !important;
  border-radius: 0 !important;
  background: rgba(251, 250, 247, 0.96) !important;
  box-shadow: 0 14px 30px rgba(36, 62, 53, 0.06) !important;
}

body.home-page .standard-item,
body.home-page .standard-item:first-child,
body.home-page .standard-strip:hover .standard-item:first-child:not(:hover) {
  display: inline-flex !important;
  flex: 1 1 0 !important;
  min-width: 0 !important;
  min-height: 58px !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 0 24px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

body.home-page .standard-item + .standard-item {
  border-left: 1px solid rgba(185, 151, 78, 0.28) !important;
}

body.home-page .standard-icon {
  display: inline-grid !important;
  width: 48px !important;
  height: 48px !important;
  flex: 0 0 48px !important;
  place-items: center !important;
  border: 1px solid #b9974e !important;
  border-radius: 999px !important;
  color: #243e35 !important;
  background:
    radial-gradient(circle at 32% 24%, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.48) 58%, rgba(185, 151, 78, 0.08)) !important;
}

body.home-page .standard-icon img,
body.home-page .standard-icon svg {
  display: block !important;
  width: 29px !important;
  height: 29px !important;
  object-fit: contain !important;
}

body.home-page .standard-copy {
  display: grid !important;
  min-width: 0 !important;
  gap: 4px !important;
}

body.home-page .standard-item strong {
  color: #2a2420 !important;
  font-family: Georgia, "Times New Roman", "Songti SC", serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

body.home-page .standard-item span {
  display: inline-grid !important;
}

body.home-page .standard-item small {
  display: block !important;
  color: #5d625c !important;
  font-size: 11px !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
}

body.home-page .standard-item:hover {
  background: transparent !important;
  color: inherit !important;
  transform: none !important;
}

@media (max-width: 680px) {
  body.home-page .home-proof-section {
    margin-top: -86px !important;
  }

  body.home-page .standard-strip {
    width: calc(100% - 28px) !important;
    flex-wrap: wrap !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
  }

  body.home-page .standard-item,
  body.home-page .standard-item:first-child,
  body.home-page .standard-strip:hover .standard-item:first-child:not(:hover) {
    flex: 1 1 50% !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    min-height: 68px !important;
    padding: 11px 8px !important;
  }

  body.home-page .standard-item + .standard-item {
    border-left: 0 !important;
  }

  body.home-page .standard-item:nth-child(odd) {
    border-right: 1px solid rgba(185, 151, 78, 0.22) !important;
  }

  body.home-page .standard-item:nth-child(n + 3) {
    border-top: 1px solid rgba(185, 151, 78, 0.22) !important;
  }

  body.home-page .standard-icon {
    width: 34px !important;
    height: 34px !important;
    flex-basis: 34px !important;
  }

  body.home-page .standard-icon img,
  body.home-page .standard-icon svg {
    width: 22px !important;
    height: 22px !important;
  }

  body.home-page .standard-item strong {
    font-size: 9px !important;
    letter-spacing: 0.04em !important;
  }

  body.home-page .standard-item small {
    font-size: 9px !important;
    white-space: normal !important;
  }
}

/* Final VEYLOVA navigation interaction polish */
.nav {
  gap: clamp(12px, 2vw, 28px);
}

.nav-links {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border: 1px solid rgba(36, 62, 53, 0.12);
  border-radius: 999px;
  background: rgba(251, 250, 247, 0.72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.nav-links a:not(.button) {
  position: relative;
  min-height: 36px;
  padding: 0 13px;
  border-radius: 999px;
  color: #2d342f;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.01em;
  line-height: 1;
  transition:
    background 160ms ease,
    color 160ms ease,
    box-shadow 160ms ease,
    transform 160ms ease;
}

.nav-links a:not(.button):hover {
  background: rgba(185, 151, 78, 0.13);
  color: #172a24;
  transform: translateY(-1px);
}

.nav-links a:not(.button):active {
  transform: translateY(1px);
}

.nav-links a:not(.button):focus-visible {
  outline: 0;
  box-shadow:
    0 0 0 2px #fbfaf7,
    0 0 0 4px rgba(185, 151, 78, 0.5);
}

.nav-links a:not(.button)[aria-current="page"],
body.home-page .nav-links a[aria-current="page"],
body.customizer-page .nav-links a[aria-current="page"],
body.designer-page .nav-links a[aria-current="page"],
body.cart-page .nav-links a[aria-current="page"] {
  background: #243e35;
  color: #fbfaf7;
  box-shadow: 0 6px 14px rgba(36, 62, 53, 0.14);
}

.nav-links .button {
  min-height: 40px;
  padding: 0 18px;
  border-radius: 999px;
  transition:
    background 160ms ease,
    border-color 160ms ease,
    box-shadow 160ms ease,
    transform 160ms ease;
}

.nav-links .button:hover {
  box-shadow: 0 8px 18px rgba(36, 62, 53, 0.16);
}

@media (max-width: 680px) {
  .nav {
    gap: 6px;
  }

  .nav-links,
  body.home-page .nav-links,
  body.customizer-page .nav-links,
  body.designer-page .nav-links,
  body.cart-page .nav-links {
    flex: 0 1 auto;
    min-width: 0;
    justify-content: flex-end;
    gap: 2px;
    max-width: calc(100vw - 132px);
    padding: 3px;
    border-color: rgba(36, 62, 53, 0.1);
    background: rgba(251, 250, 247, 0.62);
    overflow: visible;
  }

  .nav-links a:not(.button) {
    min-height: 30px;
    padding: 0 7px;
    font-size: 11px;
    letter-spacing: 0;
  }
}

@media (max-width: 390px) {
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: clamp(82px, 24vw, 96px);
  }

  .nav-links,
  body.home-page .nav-links,
  body.customizer-page .nav-links,
  body.designer-page .nav-links,
  body.cart-page .nav-links {
    max-width: calc(100vw - 112px);
  }

  .nav-links a:not(.button) {
    min-height: 28px;
    padding: 0 4px;
    font-size: 10px;
  }
}

/* Mobile full-label nav stable override: text nav row + absolute action icons. */
@media (max-width: 560px) {
  :root {
    --header-height: 98px;
  }

  .site-header .container.nav,
  .site-header .nav,
  body.home-page .site-header .container.nav,
  body.customizer-page .site-header .container.nav,
  body.designer-page .site-header .container.nav,
  body.cart-page .site-header .container.nav {
    position: relative !important;
    width: 100% !important;
    min-height: 98px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: 34px 38px !important;
    align-content: center !important;
    gap: 8px !important;
    padding: 8px 10px 9px !important;
  }

  .site-header .brand,
  body.home-page .site-header .brand,
  body.customizer-page .site-header .brand,
  body.designer-page .site-header .brand,
  body.cart-page .site-header .brand {
    grid-row: 1 !important;
    grid-column: 1 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: calc(100% - 82px) !important;
    height: 34px !important;
    overflow: hidden !important;
  }

  .site-header .brand-logo,
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    content: normal !important;
    width: 112px !important;
    max-width: min(112px, 44vw) !important;
    max-height: 34px !important;
  }

  .site-header .nav-links,
  body.home-page .site-header .nav-links,
  body.customizer-page .site-header .nav-links,
  body.designer-page .site-header .nav-links,
  body.cart-page .site-header .nav-links {
    position: static !important;
    grid-row: 2 !important;
    grid-column: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 42px !important;
    min-height: 42px !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    align-items: center !important;
    gap: 3px !important;
    padding: 3px !important;
    overflow: hidden !important;
  }

  .site-header .nav-links a[href="index.html"],
  .site-header .nav-links a[href="customizer.html"],
  .site-header .nav-links a[href="designer.html"],
  .site-header .nav-links a[href="blog.html"] {
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 4px !important;
    border: 1px solid rgba(36, 62, 53, 0.1) !important;
    background: rgba(255, 255, 252, 0.88) !important;
    color: #1f3029 !important;
    font-size: clamp(8px, 2.15vw, 10px) !important;
    font-weight: 900 !important;
    letter-spacing: 0.035em !important;
    line-height: 1 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }

  .site-header .nav-links a[href="index.html"]::after,
  .site-header .nav-links a[href="customizer.html"]::after,
  .site-header .nav-links a[href="designer.html"]::after,
  .site-header .nav-links a[href="blog.html"]::after {
    content: none !important;
    display: none !important;
  }

  .site-header .nav-links a[aria-current="page"]:not(.nav-cart-icon):not(.nav-account-icon) {
    border-color: #243e35 !important;
    background: #243e35 !important;
    color: #fffaf6 !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    position: absolute !important;
    top: 8px !important;
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 !important;
    z-index: 2 !important;
  }

  .site-header .nav-links a.nav-cart-icon {
    right: 51px !important;
  }

  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    right: 10px !important;
  }

  .site-header .nav-links a.nav-cart-icon svg,
  .site-header .nav-links a.nav-account-icon svg,
  .site-header .nav-links a.nav-orders-link.nav-account-icon svg {
    width: 18px !important;
    height: 18px !important;
  }
}

@media (max-width: 390px) {
  .site-header .container.nav,
  .site-header .nav {
    padding-inline: 8px !important;
  }

  .site-header .brand-logo,
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: 96px !important;
    max-width: min(96px, 43vw) !important;
  }

  .site-header .nav-links a[href="index.html"],
  .site-header .nav-links a[href="customizer.html"],
  .site-header .nav-links a[href="designer.html"],
  .site-header .nav-links a[href="blog.html"] {
    font-size: 7.6px !important;
    letter-spacing: 0.01em !important;
    padding-inline: 2px !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    width: 31px !important;
    min-width: 31px !important;
    max-width: 31px !important;
    height: 31px !important;
    min-height: 31px !important;
  }

  .site-header .nav-links a.nav-cart-icon {
    right: 45px !important;
  }

  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    right: 8px !important;
  }
}

/* Mobile full-label nav final layout: brand/actions row + full navigation row. */
@media (max-width: 560px) {
  :root {
    --header-height: 98px;
  }

  .site-header .container.nav,
  .site-header .nav,
  body.home-page .site-header .container.nav,
  body.customizer-page .site-header .container.nav,
  body.designer-page .site-header .container.nav,
  body.cart-page .site-header .container.nav {
    min-height: 98px !important;
    grid-template-columns: minmax(0, 1fr) 34px 34px !important;
    grid-template-rows: 34px 38px !important;
    grid-template-areas:
      "brand cart account"
      "bracelets customize collections journal" !important;
    align-content: center !important;
    column-gap: 7px !important;
    row-gap: 8px !important;
    padding: 8px 10px 9px !important;
  }

  .site-header .brand,
  body.home-page .site-header .brand,
  body.customizer-page .site-header .brand,
  body.designer-page .site-header .brand,
  body.cart-page .site-header .brand {
    grid-area: brand !important;
    align-self: center !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 34px !important;
  }

  .site-header .brand-logo,
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    content: normal !important;
    width: 112px !important;
    max-width: min(112px, 44vw) !important;
    max-height: 34px !important;
  }

  .site-header .nav-links,
  body.home-page .site-header .nav-links,
  body.customizer-page .site-header .nav-links,
  body.designer-page .site-header .nav-links,
  body.cart-page .site-header .nav-links {
    display: contents !important;
  }

  .site-header .nav-links a:not(.button) {
    margin: 0 !important;
  }

  .site-header .nav-links a[href="index.html"] {
    grid-area: bracelets !important;
  }

  .site-header .nav-links a[href="customizer.html"] {
    grid-area: customize !important;
  }

  .site-header .nav-links a[href="designer.html"] {
    grid-area: collections !important;
  }

  .site-header .nav-links a[href="blog.html"] {
    grid-area: journal !important;
  }

  .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon) {
    width: 100% !important;
    min-width: 0 !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 4px !important;
    border: 1px solid rgba(36, 62, 53, 0.1) !important;
    background: rgba(255, 255, 252, 0.88) !important;
    color: #1f3029 !important;
    font-size: clamp(8px, 2.15vw, 10px) !important;
    font-weight: 900 !important;
    letter-spacing: 0.035em !important;
    line-height: 1 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }

  .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon)::after {
    content: none !important;
    display: none !important;
  }

  .site-header .nav-links a[aria-current="page"]:not(.nav-cart-icon):not(.nav-account-icon) {
    border-color: #243e35 !important;
    background: #243e35 !important;
    color: #fffaf6 !important;
  }

  .site-header .nav-links a.nav-cart-icon {
    grid-area: cart !important;
  }

  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    grid-area: account !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    align-self: center !important;
    justify-self: stretch !important;
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 !important;
  }

  .site-header .nav-links a.nav-cart-icon svg,
  .site-header .nav-links a.nav-account-icon svg,
  .site-header .nav-links a.nav-orders-link.nav-account-icon svg {
    width: 18px !important;
    height: 18px !important;
  }
}

@media (max-width: 390px) {
  .site-header .container.nav,
  .site-header .nav {
    grid-template-columns: minmax(0, 1fr) 31px 31px !important;
    column-gap: 6px !important;
    padding-inline: 8px !important;
  }

  .site-header .brand-logo,
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: 96px !important;
    max-width: min(96px, 43vw) !important;
  }

  .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon) {
    font-size: 7.6px !important;
    letter-spacing: 0.01em !important;
    padding-inline: 2px !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    width: 31px !important;
    min-width: 31px !important;
    max-width: 31px !important;
    height: 31px !important;
    min-height: 31px !important;
  }
}

/* Absolute final icon position repair. */
@media (max-width: 560px) {
  .site-header .container.nav,
  .site-header .nav {
    position: relative !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    position: absolute !important;
    top: 8px !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
    z-index: 5 !important;
  }

  .site-header .nav-links a.nav-cart-icon {
    right: 51px !important;
  }

  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    right: 10px !important;
  }
}

@media (max-width: 390px) {
  .site-header .nav-links a.nav-cart-icon {
    right: 45px !important;
  }

  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    right: 8px !important;
  }
}

/* Final mobile full-label nav override - keep labels complete, no collision. */
@media (max-width: 560px) {
  :root {
    --header-height: 98px;
  }

  .site-header .container.nav,
  .site-header .nav,
  body.home-page .site-header .container.nav,
  body.customizer-page .site-header .container.nav,
  body.designer-page .site-header .container.nav,
  body.cart-page .site-header .container.nav {
    position: relative !important;
    width: 100% !important;
    min-height: 98px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: 34px 42px !important;
    align-content: center !important;
    gap: 8px !important;
    padding: 8px 10px 8px !important;
  }

  .site-header .brand,
  body.home-page .site-header .brand,
  body.customizer-page .site-header .brand,
  body.designer-page .site-header .brand,
  body.cart-page .site-header .brand {
    grid-area: auto !important;
    grid-row: 1 !important;
    grid-column: 1 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: calc(100% - 86px) !important;
    height: 34px !important;
    overflow: hidden !important;
  }

  .site-header .brand-logo,
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    content: normal !important;
    width: 112px !important;
    max-width: min(112px, 44vw) !important;
    max-height: 34px !important;
    object-fit: contain !important;
  }

  .site-header .nav-links,
  body.home-page .site-header .nav-links,
  body.customizer-page .site-header .nav-links,
  body.designer-page .site-header .nav-links,
  body.cart-page .site-header .nav-links {
    grid-area: auto !important;
    grid-row: 2 !important;
    grid-column: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 42px !important;
    min-height: 42px !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    align-items: center !important;
    gap: 3px !important;
    padding: 3px !important;
    overflow: hidden !important;
  }

  .site-header .nav-links a[href="index.html"],
  .site-header .nav-links a[href="customizer.html"],
  .site-header .nav-links a[href="designer.html"],
  .site-header .nav-links a[href="blog.html"] {
    grid-area: auto !important;
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 4px !important;
    border: 1px solid rgba(36, 62, 53, 0.1) !important;
    background: rgba(255, 255, 252, 0.88) !important;
    color: #1f3029 !important;
    font-size: clamp(8px, 2.15vw, 10px) !important;
    font-weight: 900 !important;
    letter-spacing: 0.035em !important;
    line-height: 1 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }

  .site-header .nav-links a[href="index.html"]::after,
  .site-header .nav-links a[href="customizer.html"]::after,
  .site-header .nav-links a[href="designer.html"]::after,
  .site-header .nav-links a[href="blog.html"]::after {
    content: none !important;
    display: none !important;
  }

  .site-header .nav-links a[aria-current="page"]:not(.nav-cart-icon):not(.nav-account-icon) {
    border-color: #243e35 !important;
    background: #243e35 !important;
    color: #fffaf6 !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    grid-area: auto !important;
    position: absolute !important;
    top: 8px !important;
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 !important;
    z-index: 2 !important;
  }

  .site-header .nav-links a.nav-cart-icon {
    right: 51px !important;
  }

  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    right: 10px !important;
  }

  .site-header .nav-links a.nav-cart-icon svg,
  .site-header .nav-links a.nav-account-icon svg,
  .site-header .nav-links a.nav-orders-link.nav-account-icon svg {
    width: 18px !important;
    height: 18px !important;
  }
}

@media (max-width: 390px) {
  .site-header .container.nav,
  .site-header .nav {
    padding-inline: 8px !important;
  }

  .site-header .brand-logo,
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: 96px !important;
    max-width: min(96px, 43vw) !important;
  }

  .site-header .nav-links a[href="index.html"],
  .site-header .nav-links a[href="customizer.html"],
  .site-header .nav-links a[href="designer.html"],
  .site-header .nav-links a[href="blog.html"] {
    font-size: 7.6px !important;
    letter-spacing: 0.01em !important;
    padding-inline: 2px !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    width: 31px !important;
    min-width: 31px !important;
    max-width: 31px !important;
    height: 31px !important;
    min-height: 31px !important;
  }

  .site-header .nav-links a.nav-cart-icon {
    right: 45px !important;
  }

  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    right: 8px !important;
  }
}

/* Mobile bag containment: items first, summary second. */
@media (max-width: 900px) {
  body.cart-page .cart-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 26px !important;
  }

  body.cart-page #cartMount {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  body.cart-page .cart-card {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: 26px 116px minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: center !important;
    padding: 16px 14px 54px !important;
    overflow: hidden !important;
  }

  body.cart-page .cart-card .cart-bracelet-thumb,
  body.cart-page .cart-card > img {
    width: 116px !important;
    height: 116px !important;
  }

  body.cart-page .cart-material-list {
    min-width: 0 !important;
    width: 100% !important;
  }

  body.cart-page .cart-material-row {
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "name total"
      "detail total" !important;
    column-gap: 8px !important;
  }

  body.cart-page .cart-material-name {
    min-width: 0 !important;
  }

  body.cart-page .cart-material-name strong {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.cart-page .cart-material-detail {
    grid-area: detail !important;
    min-width: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  body.cart-page .cart-material-row > strong {
    grid-area: total !important;
    white-space: nowrap !important;
  }

  body.cart-page .checkout-card {
    width: 100% !important;
    max-width: 100% !important;
    justify-self: stretch !important;
  }
}

@media (max-width: 430px) {
  .nav-links a[href="index.html"] {
    display: none !important;
  }

  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: 92px !important;
    max-height: 28px !important;
  }

  body.cart-page .cart-card {
    grid-template-columns: 22px 104px minmax(0, 1fr) !important;
    gap: 8px !important;
    padding-inline: 12px !important;
  }

  body.cart-page .cart-card .cart-bracelet-thumb,
  body.cart-page .cart-card > img {
    width: 104px !important;
    height: 104px !important;
  }

  body.cart-page .cart-material-detail {
    display: none !important;
  }

  body.cart-page .cart-material-row {
    grid-template-areas: "name total" !important;
    min-height: 64px !important;
  }
}

/* Absolute final mobile hero and bag badge cleanup - 2026-07-04 */
.cart-badge,
.cart-badge.is-visible {
  display: none !important;
}

@media (max-width: 900px) {
  body.home-page .home-hero .hero-full-image,
  body.designer-page .hero-full-gallery .hero-full-image {
    object-fit: cover !important;
    object-position: center center !important;
  }
}

@media (max-width: 680px) {
  body.home-page .home-hero,
  body.designer-page .hero-full-gallery {
    overflow: hidden !important;
  }

  body.home-page .home-hero .hero-full-image {
    object-fit: cover !important;
    object-position: 66% center !important;
  }

  body.designer-page .hero-full-gallery .hero-full-image {
    object-fit: cover !important;
    object-position: center center !important;
  }
}

/* Absolute final home/cart cleanup - 2026-07-04 */
body.home-page .home-proof-section {
  margin-top: 24px !important;
  padding-top: 0 !important;
  position: relative !important;
  z-index: 2 !important;
}

body.home-page .wear-grid,
body.home-page .wear-carousel {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.home-page .wear-carousel-main,
body.home-page .faq-panel {
  width: 100% !important;
}

body.home-page .faq-layout {
  grid-template-columns: minmax(0, 1fr) !important;
}

.nav-links a.cart-link {
  width: 42px !important;
  min-width: 42px !important;
  padding-inline: 0 !important;
  font-size: 0 !important;
  gap: 0 !important;
}

.nav-links a.cart-link::before {
  content: "";
  width: 19px;
  height: 19px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M6 6h15l-1.5 8.5a2 2 0 0 1-2 1.5H9a2 2 0 0 1-2-1.6L5 3H2m7 18h.01M18 21h.01'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M6 6h15l-1.5 8.5a2 2 0 0 1-2 1.5H9a2 2 0 0 1-2-1.6L5 3H2m7 18h.01M18 21h.01'/%3E%3C/svg%3E") center / contain no-repeat;
}

@media (max-width: 900px) {
  body.cart-page .cart-card .cart-actions {
    position: absolute !important;
    left: 50px !important;
    bottom: 15px !important;
    width: 116px !important;
    justify-content: center !important;
    margin: 0 !important;
  }

  body.cart-page .cart-card .cart-actions .text-button {
    display: inline-flex !important;
    min-height: 30px !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 13px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 680px) {
  body.home-page .home-proof-section {
    margin-top: 20px !important;
    padding-bottom: 14px !important;
  }

  body.home-page .standard-strip {
    background: rgba(255, 253, 251, 0.98) !important;
    box-shadow: 0 12px 24px rgba(36, 62, 53, 0.04) !important;
  }
}

@media (max-width: 430px) {
  body.cart-page .cart-card .cart-actions {
    left: 42px !important;
    width: 104px !important;
  }
}

@media (max-width: 900px) {
  .nav-links .button {
    display: none !important;
  }
}

/* Final lifestyle carousel image fit - 2026-07-04 */
body.home-page .wear-carousel-main {
  --wear-media-height: clamp(360px, 47vw, 620px) !important;
}

body.home-page .wear-slide {
  grid-template-rows: var(--wear-media-height) auto !important;
}

body.home-page .wear-slide img {
  width: 100% !important;
  height: var(--wear-media-height) !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: linear-gradient(135deg, rgba(252, 248, 245, 0.98), rgba(247, 242, 239, 0.92)) !important;
}

@media (max-width: 680px) {
  body.home-page .wear-carousel-main {
    --wear-media-height: min(78vw, 390px) !important;
  }
}

/* Cross-page final synchronization - 2026-07-04 */
.cart-select input:checked + span {
  border-color: #1f4a3e !important;
  background: #1f4a3e !important;
  box-shadow: inset 0 0 0 6px #fbfaf7 !important;
}

.cart-select input:checked + span::after {
  display: none !important;
  content: none !important;
}

.cart-bracelet-thumb {
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  background: #fbfaf7 !important;
}

.cart-bracelet-image {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}

body.customizer-page .customizer-embed-page {
  padding-top: 0 !important;
}

body.customizer-page .customizer-embed-shell {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.customizer-page .customizer-embed {
  display: block !important;
}

.site-header .nav-links {
  align-items: center !important;
}

.site-header .nav-links a:not(.button) {
  min-height: 40px !important;
  padding: 0 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.site-header .nav-links a[aria-current="page"]:not(.button) {
  color: #fbfaf7 !important;
  background: #21483c !important;
  box-shadow: 0 10px 22px rgba(33, 72, 60, 0.16) !important;
}

.site-header .nav-links .button {
  min-height: 44px !important;
  padding-inline: 22px !important;
  font-size: 13px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

@media (max-width: 980px) {
  .site-header .nav-links {
    gap: 2px !important;
    padding: 4px !important;
  }

  .site-header .nav-links a:not(.button) {
    min-height: 36px !important;
    padding: 0 12px !important;
    font-size: 11px !important;
  }
}

@media (max-width: 680px) {
  body.home-page .home-hero,
  body.designer-page .hero-full-gallery {
    min-height: auto !important;
    height: auto !important;
    aspect-ratio: 4 / 3 !important;
    padding: 0 !important;
    background: #f8f4f1 !important;
  }

  body.home-page .home-hero .hero-full-image,
  body.designer-page .hero-full-gallery .hero-full-image {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  body.home-page .home-hero .hero-full-image {
    object-position: 64% center !important;
  }

  body.designer-page .hero-full-gallery .hero-full-image {
    object-position: center center !important;
  }

  body.home-page .hero-full-content,
  body.designer-page .hero-full-content {
    min-height: 100% !important;
    padding-block: clamp(24px, 7vw, 42px) !important;
    display: flex !important;
    align-items: center !important;
  }

  body.home-page .home-proof-section {
    margin-top: 18px !important;
  }

  body.customizer-page .customizer-embed-page {
    padding: 0 !important;
  }

  body.customizer-page .customizer-embed-shell {
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
  }

  body.cart-page .cart-select input:checked + span {
    box-shadow: inset 0 0 0 5px #fbfaf7 !important;
  }
}

@media (max-width: 520px) {
  .site-header .nav {
    gap: 8px !important;
  }

  .site-header .nav-links {
    max-width: calc(100vw - 154px) !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
  }

  .site-header .nav-links::-webkit-scrollbar {
    display: none !important;
  }

  .site-header .nav-links a:not(.button) {
    min-height: 34px !important;
    padding: 0 10px !important;
    font-size: 10px !important;
    letter-spacing: 0.05em !important;
    flex: 0 0 auto !important;
  }
}

@media (max-width: 430px) {
  body.home-page .home-hero,
  body.designer-page .hero-full-gallery {
    aspect-ratio: 1 / 1.03 !important;
  }

  body.home-page .hero-copy,
  body.designer-page .hero-copy {
    max-width: min(78vw, 340px) !important;
  }
}

/* Final desktop/mobile sync polish - 2026-07-04 */
.wear-slide img,
.wear-carousel-main .wear-slide img {
  object-fit: contain !important;
  background: #fbfaf7 !important;
}

@media (max-width: 680px) {
  .site-header .container.nav {
    padding-inline: 14px !important;
    gap: 8px !important;
  }

  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: 86px !important;
    max-height: 28px !important;
  }

  .site-header .nav-links {
    max-width: calc(100vw - 112px) !important;
    gap: 2px !important;
    padding: 4px !important;
    overflow: visible !important;
  }

  .site-header .nav-links .button {
    display: none !important;
  }

  .site-header .nav-links a:not(.button) {
    min-height: 34px !important;
    padding: 0 8px !important;
    font-size: 9px !important;
    letter-spacing: 0.05em !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 430px) {
  .site-header .container.nav {
    padding-inline: 12px !important;
    gap: 6px !important;
  }

  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: 78px !important;
  }

  .site-header .nav-links {
    max-width: calc(100vw - 96px) !important;
  }

  .site-header .nav-links a:not(.button) {
    min-height: 32px !important;
    padding: 0 6px !important;
    font-size: 8.5px !important;
  }
}

/* Absolute last-mile mobile corrections - 2026-07-04 */
.cart-card .cart-bracelet-image,
body.cart-page .cart-card .cart-bracelet-image {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}

@media (max-width: 680px) {
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: 72px !important;
    max-height: 26px !important;
  }

  .site-header .nav-links {
    max-width: calc(100vw - 92px) !important;
  }
}

@media (max-width: 430px) {
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: 64px !important;
  }

  .site-header .nav-links {
    max-width: calc(100vw - 78px) !important;
  }
}

/* Final nav cart icon - 2026-07-04 */
.site-header .nav-links a.nav-cart-icon,
.site-header .nav-links .nav-cart-icon {
  width: 44px !important;
  min-width: 44px !important;
  padding: 0 !important;
  position: relative !important;
  font-size: 0 !important;
  line-height: 1 !important;
}

.site-header .nav-links .nav-cart-icon::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 17px !important;
  height: 13px !important;
  border: 2px solid currentColor !important;
  border-top: 0 !important;
  border-radius: 2px 2px 5px 5px !important;
  transform: translate(-50%, -40%) !important;
}

.site-header .nav-links .nav-cart-icon::after {
  content: "" !important;
  position: absolute !important;
  left: calc(50% - 8px) !important;
  top: calc(50% + 8px) !important;
  width: 4px !important;
  height: 4px !important;
  border-radius: 999px !important;
  background: currentColor !important;
  box-shadow: 12px 0 0 currentColor !important;
}

.site-header .nav-links .nav-cart-label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
}

@media (max-width: 680px) {
  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links .nav-cart-icon {
    width: 38px !important;
    min-width: 38px !important;
    padding: 0 !important;
    font-size: 0 !important;
  }
}

/* Customizer emergency shell repair: let the embedded app decide its own mobile height. */
body.customizer-page .customizer-embed {
  min-height: 0 !important;
}

@media (min-width: 761px) {
  body.customizer-page .customizer-embed {
    min-height: 760px !important;
  }
}

@media (max-width: 760px) {
  body.customizer-page .customizer-embed-page {
    min-height: 0 !important;
    padding: 0 10px 28px !important;
  }

  body.customizer-page .customizer-embed-shell {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}

/* Nav cart icon repair: use the real SVG, not the old CSS-drawn cart. */
.site-header .nav-links a.nav-cart-icon,
.site-header .nav-links .nav-cart-icon {
  width: 44px !important;
  min-width: 44px !important;
  height: 40px !important;
  min-height: 40px !important;
  flex: 0 0 44px !important;
  display: inline-grid !important;
  place-items: center !important;
  padding: 0 !important;
  position: relative !important;
  overflow: visible !important;
  font-size: 0 !important;
  line-height: 1 !important;
  color: #243e35 !important;
}

.site-header .nav-links .nav-cart-icon::before,
.site-header .nav-links .nav-cart-icon::after {
  content: none !important;
  display: none !important;
}

.site-header .nav-links .nav-cart-icon svg {
  width: 21px !important;
  height: 21px !important;
  display: block !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.35 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.site-header .nav-links .nav-cart-icon[aria-current="page"] {
  color: #fffaf6 !important;
  background: #243e35 !important;
}

.site-header .nav-links .nav-cart-icon:not([aria-current="page"]):hover,
.site-header .nav-links .nav-cart-icon:not([aria-current="page"]):focus-visible {
  background: rgba(36, 62, 53, 0.08) !important;
}

@media (max-width: 680px) {
  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links .nav-cart-icon {
    width: 38px !important;
    min-width: 38px !important;
    height: 34px !important;
    min-height: 34px !important;
    flex-basis: 38px !important;
  }

  .site-header .nav-links .nav-cart-icon svg {
    width: 19px !important;
    height: 19px !important;
  }
}

/* Header logo balance - 2026-07-04 */
.brand-logo,
body.home-page .brand-logo,
body.customizer-page .brand-logo,
body.designer-page .brand-logo,
body.cart-page .brand-logo {
  width: clamp(190px, 15.8vw, 216px) !important;
  height: auto !important;
  max-height: 46px !important;
  object-fit: contain !important;
  object-position: left center !important;
}

.site-header .brand,
body.home-page .brand,
body.customizer-page .brand,
body.designer-page .brand,
body.cart-page .brand {
  align-items: center !important;
}

@media (max-width: 680px) {
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: 112px !important;
    max-height: 32px !important;
  }

  .site-header .nav-links {
    max-width: calc(100vw - 142px) !important;
  }
}

@media (max-width: 430px) {
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: 92px !important;
    max-height: 28px !important;
  }

  .site-header .nav-links {
    max-width: calc(100vw - 118px) !important;
  }

  .site-header .nav-links a:not(.button) {
    padding-inline: 5px !important;
    font-size: 8.2px !important;
  }

  body.home-page .site-header .nav-links a[href="index.html"] {
    display: none !important;
  }
}

/* Peer-reference polish: one consistent cart icon, no badge text or duplicate CSS drawing. */
.site-header .nav-links a.nav-cart-icon {
  width: 44px !important;
  min-width: 44px !important;
  height: 40px !important;
  min-height: 40px !important;
  flex: 0 0 44px !important;
  display: inline-grid !important;
  place-items: center !important;
  padding: 0 !important;
  border-radius: 999px !important;
  color: #243e35 !important;
  background: transparent !important;
  font-size: 0 !important;
  line-height: 1 !important;
  overflow: visible !important;
}

.site-header .nav-links a.nav-cart-icon::before,
.site-header .nav-links a.nav-cart-icon::after,
.site-header .nav-links a.nav-cart-icon .nav-cart-label,
.site-header .nav-links a.nav-cart-icon .cart-badge {
  display: none !important;
  content: none !important;
}

.site-header .nav-links a.nav-cart-icon svg {
  display: block !important;
  width: 23px !important;
  height: 23px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.site-header .nav-links a.nav-cart-icon[aria-current="page"] {
  color: #fbfaf7 !important;
  background: #243e35 !important;
  box-shadow: 0 10px 22px rgba(36, 62, 53, 0.16) !important;
}

.site-header .nav-links a.nav-cart-icon:not([aria-current="page"]):hover,
.site-header .nav-links a.nav-cart-icon:not([aria-current="page"]):focus-visible {
  background: rgba(36, 62, 53, 0.08) !important;
}

@media (max-width: 680px) {
  .site-header .nav-links a.nav-cart-icon {
    width: 36px !important;
    min-width: 36px !important;
    height: 34px !important;
    min-height: 34px !important;
    flex-basis: 36px !important;
  }

  .site-header .nav-links a.nav-cart-icon svg {
    width: 20px !important;
    height: 20px !important;
  }
}

/* Keep the same four navigation actions visible on every page. */
@media (max-width: 520px) {
  body.home-page .site-header .nav-links a[href="index.html"],
  .site-header .nav-links a[href="index.html"],
  .site-header .nav-links a[href="customizer.html"]:not(.button),
  .site-header .nav-links a[href="designer.html"],
  .site-header .nav-links a.nav-cart-icon {
    display: inline-flex !important;
  }

  .site-header .nav-links a.button {
    display: none !important;
  }
}

/* Stabilized shared navigation and customizer shell - 2026-07-04 */
.site-header .nav-links {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 4px !important;
  max-width: min(100%, 640px) !important;
  padding: 4px !important;
  border: 1px solid rgba(36, 62, 53, 0.12) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 252, 0.9) !important;
  box-shadow: none !important;
}

.site-header .nav-links a:not(.button) {
  display: inline-flex !important;
  min-height: 42px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 16px !important;
  border-radius: 999px !important;
  color: #1f3029 !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

.site-header .nav-links a[aria-current="page"]:not(.nav-cart-icon) {
  background: #243e35 !important;
  color: #fffaf6 !important;
}

.site-header .nav-links a.nav-cart-icon {
  position: relative !important;
  display: inline-grid !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 42px !important;
  min-height: 42px !important;
  flex: 0 0 44px !important;
  place-items: center !important;
  padding: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #243e35 !important;
  font-size: 0 !important;
  line-height: 1 !important;
  overflow: visible !important;
}

.site-header .nav-links a.nav-cart-icon[aria-current="page"] {
  background: #243e35 !important;
  color: #fffaf6 !important;
}

.site-header .nav-links a.nav-cart-icon::before,
.site-header .nav-links a.nav-cart-icon::after,
.site-header .nav-links a.nav-cart-icon .nav-cart-label,
.site-header .nav-links a.nav-cart-icon .cart-badge {
  display: none !important;
  content: none !important;
}

.site-header .nav-links a.nav-cart-icon svg {
  display: block !important;
  width: 23px !important;
  height: 23px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.05 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body.customizer-page .customizer-embed-page {
  min-height: 0 !important;
}

body.customizer-page .customizer-embed-shell {
  overflow: visible !important;
}

@media (max-width: 760px) {
  body.customizer-page .customizer-embed-page {
    padding: 0 8px 24px !important;
  }

  body.customizer-page .customizer-embed-shell {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }
}

/* Customizer desktop full-width workspace: remove the left/right gutters around the embedded tool. */
@media (min-width: 761px) {
  body.customizer-page .customizer-embed-page {
    width: 100% !important;
    padding: 0 !important;
  }

  body.customizer-page .customizer-embed-shell {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  body.customizer-page .customizer-embed {
    width: 100% !important;
    max-width: none !important;
  }
}

@media (max-width: 680px) {
  .site-header .nav {
    gap: 6px !important;
  }

  .site-header .nav-links {
    max-width: calc(100vw - 122px) !important;
    gap: 1px !important;
    padding: 2px !important;
  }

  .site-header .nav-links a:not(.button) {
    min-height: 36px !important;
    padding: 0 9px !important;
    font-size: 10px !important;
    letter-spacing: 0.06em !important;
  }

  .site-header .nav-links a.nav-cart-icon {
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    flex-basis: 36px !important;
  }

  .site-header .nav-links a.nav-cart-icon svg {
    width: 20px !important;
    height: 20px !important;
  }
}

@media (max-width: 430px) {
  .site-header .nav-links {
    max-width: calc(100vw - 104px) !important;
    gap: 1px !important;
  }

  .site-header .nav-links a:not(.button) {
    min-height: 34px !important;
    padding: 0 7px !important;
    font-size: 9px !important;
    letter-spacing: 0.045em !important;
  }

  .site-header .nav-links a.nav-cart-icon {
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    flex-basis: 34px !important;
  }
}

@media (max-width: 520px) {
  .site-header .nav {
    width: min(100% - 20px, 1160px) !important;
    gap: 8px !important;
  }

  .site-header .brand {
    flex: 0 0 36px !important;
    width: 36px !important;
    min-width: 36px !important;
    overflow: hidden !important;
  }

  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    content: url("assets/favicon.png") !important;
    width: 32px !important;
    height: 32px !important;
    max-width: 32px !important;
    max-height: 32px !important;
    object-fit: contain !important;
  }

  .site-header .nav-links {
    flex: 1 1 auto !important;
    max-width: calc(100vw - 62px) !important;
  }
}

/* Homepage commerce refresh - approved layout, 2026-07-05 */
body.home-page {
  background:
    linear-gradient(180deg, #f8f4ee 0%, #fffdf9 38%, #f8f4ee 100%) !important;
}

body.home-page .home-hero-v2 {
  min-height: clamp(560px, 72svh, 720px) !important;
  display: grid !important;
  align-items: center !important;
  overflow: hidden !important;
  background: #f5efe8 !important;
}

body.home-page .home-hero-v2 .hero-full-image {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  filter: none !important;
}

body.home-page .home-hero-v2::after {
  background: linear-gradient(90deg, rgba(255, 253, 249, 0.94) 0%, rgba(255, 253, 249, 0.68) 42%, rgba(255, 253, 249, 0.08) 82%) !important;
}

body.home-page .home-hero-v2 .hero-full-content {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.home-page .home-hero-v2 .hero-copy {
  max-width: 560px !important;
}

body.home-page .home-hero-v2 h1 {
  max-width: 560px !important;
  font-size: clamp(48px, 6vw, 88px) !important;
  line-height: 0.92 !important;
}

body.home-page .home-hero-v2 .lead {
  max-width: 460px !important;
  font-size: clamp(17px, 1.6vw, 21px) !important;
  line-height: 1.55 !important;
}

body.home-page .home-proof-section.home-proof-v2 {
  margin-top: 0 !important;
  padding: 22px 0 8px !important;
}

body.home-page .home-proof-v2 .standard-strip {
  margin: 0 !important;
  width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

body.home-page .home-proof-v2 .standard-item {
  min-height: 86px !important;
}

body.home-page .home-entry-section,
body.home-page .home-product-section,
body.home-page .home-flow-section,
body.home-page .home-faq-lite {
  padding: clamp(42px, 6vw, 72px) 0 !important;
}

body.home-page .home-entry-section .section-header,
body.home-page .home-product-section .section-header,
body.home-page .home-flow-section .section-header,
body.home-page .home-faq-lite .section-header {
  max-width: 720px !important;
  margin: 0 0 24px !important;
  text-align: left !important;
}

body.home-page .home-entry-section .section-header h2,
body.home-page .home-product-section .section-header h2,
body.home-page .home-flow-section .section-header h2,
body.home-page .home-faq-lite .section-header h2 {
  font-size: clamp(34px, 4vw, 54px) !important;
  line-height: 1 !important;
}

body.home-page .home-entry-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

body.home-page .home-entry-card {
  position: relative !important;
  min-height: 430px !important;
  overflow: hidden !important;
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
  background: #fffaf6 !important;
}

body.home-page .home-entry-card img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

body.home-page .home-entry-card::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(180deg, rgba(255,255,255,0.08) 0%, rgba(35, 28, 25, 0.68) 100%) !important;
}

body.home-page .home-entry-card > div {
  position: absolute !important;
  left: 22px !important;
  right: 22px !important;
  bottom: 22px !important;
  z-index: 1 !important;
  color: #fff !important;
}

body.home-page .home-entry-card h3 {
  margin: 4px 0 8px !important;
  color: #fff !important;
  font-family: var(--serif) !important;
  font-size: clamp(28px, 3vw, 42px) !important;
  line-height: 1 !important;
}

body.home-page .home-entry-card p {
  max-width: 280px !important;
  margin: 0 0 16px !important;
  color: rgba(255,255,255,0.86) !important;
}

body.home-page .home-entry-card a,
body.home-page .home-product-card a {
  display: inline-flex !important;
  min-height: 42px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 18px !important;
  border-radius: 999px !important;
  background: var(--accent-dark) !important;
  color: #fff !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

body.home-page .home-product-section {
  background: #fffaf6 !important;
}

body.home-page .home-product-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

body.home-page .home-product-card {
  overflow: hidden !important;
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
  background: var(--surface) !important;
}

body.home-page .home-product-card img {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  object-position: center !important;
  background: #f4f0ea !important;
}

body.home-page .home-product-card div {
  padding: 16px !important;
}

body.home-page .home-product-card h3 {
  margin: 0 0 8px !important;
  font-size: 18px !important;
  line-height: 1.15 !important;
}

body.home-page .home-product-card p {
  min-height: 42px !important;
  margin: 0 0 12px !important;
  color: var(--muted) !important;
  line-height: 1.45 !important;
}

body.home-page .home-product-card strong {
  display: block !important;
  margin-bottom: 14px !important;
  font-size: 20px !important;
}

body.home-page .home-flow-grid,
body.home-page .home-faq-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

body.home-page .home-flow-grid article,
body.home-page .home-faq-grid article {
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
  background: var(--surface) !important;
  padding: 20px !important;
}

body.home-page .home-flow-grid span {
  display: inline-flex !important;
  width: 34px !important;
  height: 34px !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 18px !important;
  border-radius: 999px !important;
  background: #ead6ce !important;
  color: var(--accent-dark) !important;
  font-weight: 900 !important;
}

body.home-page .home-flow-grid strong,
body.home-page .home-faq-grid h3 {
  display: block !important;
  margin: 0 0 8px !important;
  font-size: 18px !important;
}

body.home-page .home-flow-grid p,
body.home-page .home-faq-grid p {
  margin: 0 !important;
  color: var(--muted) !important;
  line-height: 1.55 !important;
}

body.home-page .home-faq-lite {
  padding-top: 10px !important;
}

body.home-page .footer {
  margin-top: 0 !important;
}

@media (max-width: 680px) {
  body.home-page .footer {
    padding: 28px 0 max(92px, calc(28px + env(safe-area-inset-bottom))) !important;
  }

  body.home-page .footer-inner {
    gap: 16px !important;
  }

  body.home-page .footer-brand {
    width: 100%;
  }

  body.home-page .footer-social {
    width: min(100%, 420px) !important;
    max-width: calc(100vw - 28px);
  }
}

@media (max-width: 360px) {
  body.home-page .footer-social a {
    gap: 5px;
    padding: 0 5px;
    font-size: 11px;
  }

  body.home-page .footer-social svg {
    width: 15px;
    height: 15px;
  }
}

@media (max-width: 900px) {
  body.home-page .home-entry-grid,
  body.home-page .home-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.home-page .home-flow-grid,
  body.home-page .home-faq-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 680px) {
  body.home-page .home-hero-v2 {
    min-height: auto !important;
    aspect-ratio: 4 / 5 !important;
    align-items: end !important;
  }

  body.home-page .home-hero-v2::after {
    background: linear-gradient(180deg, rgba(255,253,249,0.08) 0%, rgba(255,253,249,0.62) 44%, rgba(255,253,249,0.96) 100%) !important;
  }

  body.home-page .home-hero-v2 .hero-full-image {
    object-position: 58% center !important;
  }

  body.home-page .home-hero-v2 .hero-full-content {
    padding: 0 14px 28px !important;
  }

  body.home-page .home-hero-v2 h1 {
    max-width: 360px !important;
    font-size: clamp(42px, 11vw, 58px) !important;
  }

  body.home-page .home-hero-v2 .lead {
    max-width: 340px !important;
    font-size: 15px !important;
  }

  body.home-page .home-hero-v2 .hero-actions {
    gap: 10px !important;
  }

  body.home-page .home-hero-v2 .hero-actions .button {
    min-height: 44px !important;
    padding: 0 16px !important;
    font-size: 13px !important;
  }

  body.home-page .home-proof-section.home-proof-v2 {
    padding: 12px 0 4px !important;
  }

  body.home-page .home-proof-v2 .standard-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.home-page .home-proof-v2 .standard-item {
    min-height: 74px !important;
    padding: 12px !important;
  }

  body.home-page .home-entry-section,
  body.home-page .home-product-section,
  body.home-page .home-flow-section,
  body.home-page .home-faq-lite {
    padding: 34px 0 !important;
  }

  body.home-page .home-entry-grid,
  body.home-page .home-product-grid,
  body.home-page .home-flow-grid,
  body.home-page .home-faq-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  body.home-page .home-entry-card {
    min-height: 320px !important;
  }

  body.home-page .home-product-card {
    display: grid !important;
    grid-template-columns: 128px 1fr !important;
    align-items: stretch !important;
  }

  body.home-page .home-product-card img {
    height: 100% !important;
    aspect-ratio: auto !important;
  }

  body.home-page .home-product-card p {
    min-height: 0 !important;
  }
}

@media (max-width: 420px) {
  body.home-page .home-product-card {
    grid-template-columns: 112px 1fr !important;
  }

  body.home-page .home-product-card div {
    padding: 12px !important;
  }

  body.home-page .home-product-card h3 {
    font-size: 16px !important;
  }
}

/* VEYLOVA button system - rosewood, rose quartz, champagne, 2026-07-05 */
:root {
  --vl-pearl: #fffdf8;
  --vl-ivory: #f8f3ea;
  --vl-moonstone: #eef4f4;
  --vl-rose: #e8bdc8;
  --vl-champagne: #b9974e;
  --vl-rosewood: #765463;
  --vl-rosewood-hover: #654655;
  --vl-rosewood-deep: #533a47;
  --vl-rose-ink: #7b5966;
  --vl-button-shadow:
    inset 0 1px 0 rgba(255, 253, 248, 0.2),
    inset 0 -10px 18px rgba(83, 58, 71, 0.18),
    0 10px 16px rgba(118, 84, 99, 0.16);
  --vl-button-glow:
    inset 0 1px 0 rgba(255, 253, 248, 0.3),
    inset 0 0 22px rgba(232, 189, 200, 0.16),
    inset 0 -8px 18px rgba(83, 58, 71, 0.14),
    0 14px 22px rgba(118, 84, 99, 0.2),
    0 0 22px rgba(232, 189, 200, 0.22);
  --vl-pearl-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.82),
    0 8px 14px rgba(92, 63, 77, 0.1);
  --vl-pearl-glow:
    inset 0 1px 0 rgba(255, 255, 255, 0.94),
    inset 0 0 18px rgba(232, 189, 200, 0.12),
    0 10px 18px rgba(92, 63, 77, 0.12),
    0 0 18px rgba(232, 189, 200, 0.18);
}

.button,
body.home-page .button,
body.customizer-page .button,
body.designer-page .button,
body.cart-page .button,
body.home-page .home-entry-card a,
body.designer-page #featuredAdd {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  border: 1px solid rgba(118, 84, 99, 0.22) !important;
  background-color: var(--vl-rosewood) !important;
  background-image: none !important;
  color: var(--vl-pearl) !important;
  box-shadow: var(--vl-button-shadow) !important;
  text-shadow: none !important;
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    filter 180ms ease,
    opacity 180ms ease !important;
}

.button:hover,
body.home-page .button:hover,
body.customizer-page .button:hover,
body.designer-page .button:hover,
body.cart-page .button:hover,
body.home-page .home-entry-card a:hover,
body.designer-page #featuredAdd:hover {
  border-color: rgba(118, 84, 99, 0.28) !important;
  background-color: var(--vl-rosewood-hover) !important;
  background-image: none !important;
  box-shadow: var(--vl-button-glow) !important;
  filter: saturate(1.02) brightness(1.02) !important;
  transform: translateY(-1px) !important;
}

.button:active,
body.home-page .button:active,
body.customizer-page .button:active,
body.designer-page .button:active,
body.cart-page .button:active {
  transform: scale(0.98) !important;
}

.button.secondary,
body.home-page .button.secondary,
body.customizer-page .button.secondary,
body.designer-page .button.secondary,
body.cart-page .button.secondary,
.final-cta .button.secondary,
body.home-page .home-product-card a,
.text-button.compact,
body.cart-page .text-button.compact {
  border: 1px solid rgba(185, 151, 78, 0.24) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.24)),
    linear-gradient(135deg, #ffffff 0%, #fbf6ee 48%, #efd7dd 100%) !important;
  color: #2c272d !important;
  box-shadow: var(--vl-pearl-shadow) !important;
}

.button.secondary:hover,
body.home-page .button.secondary:hover,
body.customizer-page .button.secondary:hover,
body.designer-page .button.secondary:hover,
body.cart-page .button.secondary:hover,
.final-cta .button.secondary:hover,
body.home-page .home-product-card a:hover,
.text-button.compact:hover,
body.cart-page .text-button.compact:hover {
  border-color: rgba(185, 151, 78, 0.38) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.3)),
    linear-gradient(135deg, #ffffff 0%, #fff8ef 46%, #f1dde4 100%) !important;
  box-shadow: var(--vl-pearl-glow) !important;
  color: #2c272d !important;
}

.product-card .text-button,
#designerGrid .text-button {
  display: inline-flex !important;
  min-height: 34px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 10px !important;
  border: 1px solid rgba(185, 151, 78, 0.24) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.24)),
    linear-gradient(135deg, #ffffff 0%, #fbf6ee 48%, #efd7dd 100%) !important;
  color: #2c272d !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.82),
    0 6px 10px rgba(92, 63, 77, 0.08) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.product-card .text-button:hover,
#designerGrid .text-button:hover {
  border-color: rgba(185, 151, 78, 0.38) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.3)),
    linear-gradient(135deg, #ffffff 0%, #fff8ef 46%, #f1dde4 100%) !important;
  color: var(--vl-rosewood) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.94),
    inset 0 0 16px rgba(232, 189, 200, 0.12),
    0 8px 14px rgba(92, 63, 77, 0.11),
    0 0 14px rgba(232, 189, 200, 0.16) !important;
  transform: translateY(-1px) !important;
}

.product-card [data-add-product],
#designerGrid [data-add-product] {
  border-color: rgba(118, 84, 99, 0.22) !important;
  background-color: var(--vl-rosewood) !important;
  background-image: none !important;
  color: var(--vl-pearl) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 253, 248, 0.2),
    inset 0 -8px 14px rgba(83, 58, 71, 0.16),
    0 8px 12px rgba(118, 84, 99, 0.14) !important;
}

.product-card [data-add-product]:hover,
#designerGrid [data-add-product]:hover {
  border-color: rgba(118, 84, 99, 0.28) !important;
  background-color: var(--vl-rosewood-hover) !important;
  background-image: none !important;
  color: var(--vl-pearl) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 253, 248, 0.3),
    inset 0 0 18px rgba(232, 189, 200, 0.14),
    inset 0 -8px 14px rgba(83, 58, 71, 0.12),
    0 10px 16px rgba(118, 84, 99, 0.18),
    0 0 18px rgba(232, 189, 200, 0.2) !important;
  transform: translateY(-1px) !important;
}

.button.is-added,
.text-button.is-added,
button.is-added,
body.home-page .home-product-card a.is-added {
  border-color: rgba(118, 84, 99, 0.22) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.24)),
    linear-gradient(135deg, #ffffff 0%, #fff7f2 42%, #f1dde4 100%) !important;
  color: var(--vl-rosewood) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.92),
    inset 0 0 18px rgba(232, 189, 200, 0.14),
    0 9px 16px rgba(118, 84, 99, 0.12) !important;
}

.button.is-added:disabled,
.text-button.is-added:disabled,
button.is-added:disabled {
  opacity: 1 !important;
}

.text-button.is-added {
  display: inline-flex !important;
  min-height: 34px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 12px !important;
  border: 1px solid rgba(118, 84, 99, 0.22) !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
}

.button:disabled,
button.button:disabled,
.text-button:disabled,
body.cart-page .text-button:disabled {
  cursor: not-allowed !important;
  opacity: 0.52 !important;
  transform: none !important;
  box-shadow: none !important;
}

.choice,
.filter-bar button,
body.designer-page .filter-bar button,
.quiz-options button,
.faq-filter button,
.checkout-option {
  border-color: rgba(185, 151, 78, 0.24) !important;
  background: rgba(255, 253, 248, 0.76) !important;
  color: var(--vl-rose-ink) !important;
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    background 160ms ease,
    color 160ms ease,
    box-shadow 160ms ease !important;
}

.choice:hover,
.filter-bar button:hover,
body.designer-page .filter-bar button:hover,
.quiz-options button:hover,
.faq-filter button:hover,
.checkout-option:hover {
  border-color: rgba(118, 84, 99, 0.34) !important;
  background: rgba(255, 255, 255, 0.9) !important;
  color: var(--vl-rosewood) !important;
  transform: translateY(-1px) !important;
}

.choice.is-active,
.filter-bar button.is-active,
body.designer-page .filter-bar button.is-active,
.quiz-options button.is-active,
.faq-filter button.is-active,
.checkout-option:has(input:checked) {
  border-color: rgba(118, 84, 99, 0.5) !important;
  background-color: var(--vl-rosewood) !important;
  background-image: none !important;
  color: var(--vl-pearl) !important;
  box-shadow: 0 0 0 3px rgba(232, 189, 200, 0.2) !important;
}

.checkout-option:has(input:checked) .checkout-option-price,
.checkout-option:has(input:checked) .checkout-option-copy strong,
.checkout-option:has(input:checked) .checkout-option-copy small {
  color: var(--vl-pearl) !important;
}

.checkout-option input:checked + .checkout-option-dot,
.cart-select input:checked + span {
  border-color: var(--vl-rosewood) !important;
  background: var(--vl-rosewood) !important;
}

.carousel-controls > button,
.site-header .nav-links a.nav-cart-icon {
  border: 1px solid rgba(185, 151, 78, 0.24) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.28)),
    linear-gradient(135deg, #ffffff, #f3e5ea) !important;
  color: var(--vl-rosewood) !important;
  box-shadow: 0 8px 12px rgba(92, 63, 77, 0.08) !important;
}

.carousel-controls > button:hover,
.site-header .nav-links a.nav-cart-icon:not([aria-current="page"]):hover,
.site-header .nav-links a.nav-cart-icon:not([aria-current="page"]):focus-visible {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.32)),
    linear-gradient(135deg, #ffffff, #f1dde4) !important;
  color: var(--vl-rosewood-hover) !important;
}

.site-header .nav-links a.nav-cart-icon[aria-current="page"],
.cart-badge,
.carousel-dots button.is-active {
  background: var(--vl-rosewood) !important;
  border-color: var(--vl-rosewood) !important;
  color: var(--vl-pearl) !important;
}

.site-header .nav-links a:not(.button):hover,
.site-header .nav-links a:not(.button):focus-visible,
.nav-links a:not(.button):hover,
body.home-page .nav-links a:not(.button):hover {
  background: rgba(232, 189, 200, 0.18) !important;
  color: var(--vl-rosewood) !important;
}

.site-header .nav-links a[aria-current="page"]:not(.nav-cart-icon),
.nav-links a:not(.button)[aria-current="page"],
body.home-page .nav-links a[aria-current="page"],
body.customizer-page .nav-links a[aria-current="page"],
body.designer-page .nav-links a[aria-current="page"],
body.cart-page .nav-links a[aria-current="page"] {
  border-color: var(--vl-rosewood) !important;
  background: var(--vl-rosewood) !important;
  color: var(--vl-pearl) !important;
  box-shadow: 0 10px 18px rgba(118, 84, 99, 0.16) !important;
}

.carousel-dots button {
  background: rgba(118, 84, 99, 0.22) !important;
}

.text-button,
body.cart-page .text-button {
  color: var(--vl-rosewood) !important;
}

.text-button:hover,
body.cart-page .text-button:hover {
  color: var(--vl-rosewood-hover) !important;
}

.cart-delete {
  border-color: rgba(185, 151, 78, 0.22) !important;
  background: rgba(255, 253, 248, 0.82) !important;
  color: #8a3c3c !important;
}

.cart-delete:hover {
  border-color: rgba(138, 60, 60, 0.24) !important;
  background: #fff4f3 !important;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline-color: rgba(232, 189, 200, 0.5) !important;
  box-shadow:
    0 0 0 4px rgba(255, 255, 255, 0.86),
    0 0 0 7px rgba(232, 189, 200, 0.34) !important;
}

@media (prefers-reduced-motion: reduce) {
  .button,
  .choice,
  .filter-bar button,
  .quiz-options button,
  .faq-filter button,
  .checkout-option,
  .carousel-controls > button,
  .site-header .nav-links a.nav-cart-icon {
    transition: none !important;
  }

  .button:hover,
  .choice:hover,
  .filter-bar button:hover,
  .quiz-options button:hover,
  .faq-filter button:hover,
  .checkout-option:hover,
  .carousel-controls > button:hover {
    transform: none !important;
  }
}

@media (max-width: 520px) {
  .site-header .nav-links {
    gap: 6px;
  }
}

/* Layout and interaction refinement - 2026-07-05 */
html {
  scroll-padding-top: calc(var(--header-height) + 18px);
}

.site-header {
  background: rgba(255, 253, 248, 0.94) !important;
}

.site-header .nav {
  min-width: 0;
}

.site-header .nav-links a:not(.button),
.filter-bar button,
.text-button {
  -webkit-tap-highlight-color: transparent;
}

.site-header .nav-links a:not(.button),
.filter-bar button,
.product-card,
body.home-page .home-entry-card,
body.home-page .home-product-card,
body.cart-page .cart-card {
  transition:
    background-color 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease,
    opacity 180ms ease !important;
}

.site-header .nav-links a:not(.button):active,
.filter-bar button:active,
.product-card:active,
body.home-page .home-entry-card:active,
body.home-page .home-product-card:active {
  transform: translateY(1px) !important;
}

body.home-page .home-entry-section .section-header h2,
body.home-page .home-product-section .section-header h2,
body.home-page .home-flow-section .section-header h2,
body.home-page .home-faq-lite .section-header h2,
body.designer-page .section-header h2,
body.cart-page .section-header h1 {
  font-size: 2.5rem !important;
  line-height: 1.08 !important;
  letter-spacing: -0.02em !important;
}

body.home-page .home-entry-section .section-header,
body.home-page .home-product-section .section-header,
body.home-page .home-flow-section .section-header,
body.home-page .home-faq-lite .section-header {
  gap: 10px !important;
  margin-bottom: 26px !important;
}

body.home-page .home-proof-v2 .standard-strip {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  border-radius: 12px !important;
}

body.home-page .home-proof-v2 .standard-item,
body.home-page .home-proof-v2 .standard-item:first-child,
body.home-page .home-proof-v2 .standard-strip:hover .standard-item:first-child:not(:hover) {
  display: flex !important;
  align-items: center !important;
  gap: 13px !important;
  min-height: 96px !important;
  padding: 18px !important;
  background: rgba(255, 253, 248, 0.9) !important;
  color: var(--ink) !important;
}

body.home-page .home-proof-v2 .standard-item:hover {
  border-color: rgba(118, 84, 99, 0.24) !important;
  background: #fff !important;
  box-shadow: inset 0 0 0 1px rgba(118, 84, 99, 0.08) !important;
}

body.home-page .standard-item strong {
  font-family: inherit !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

body.home-page .standard-item small {
  white-space: normal !important;
}

body.home-page .home-entry-card {
  min-height: 360px !important;
  box-shadow: none !important;
}

body.home-page .home-entry-card:hover,
body.home-page .home-entry-card:focus-within,
body.home-page .home-product-card:hover,
body.home-page .home-product-card:focus-within,
.product-card:hover,
.product-card:focus-within {
  border-color: rgba(118, 84, 99, 0.3) !important;
  box-shadow: 0 12px 22px rgba(92, 63, 77, 0.1) !important;
  transform: translateY(-2px) !important;
}

body.home-page .home-entry-card:hover img,
body.home-page .home-entry-card:focus-within img {
  transform: scale(1.025) !important;
}

body.home-page .home-entry-card img {
  transition: transform 420ms cubic-bezier(0.16, 1, 0.3, 1) !important;
}

body.home-page .home-entry-card h3 {
  font-family: inherit !important;
  font-size: 1.75rem !important;
  line-height: 1.08 !important;
}

body.home-page .home-product-card {
  min-width: 0 !important;
}

body.home-page .home-product-card div {
  display: grid !important;
  align-content: start !important;
}

body.home-page .home-product-card a {
  justify-self: start !important;
  margin-top: auto !important;
}

body.home-page .home-flow-grid article,
body.home-page .home-faq-grid article {
  min-width: 0 !important;
  box-shadow: none !important;
}

.filter-bar {
  position: sticky !important;
  top: calc(var(--header-height) + 10px) !important;
  z-index: 12 !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  overflow-x: auto !important;
  margin: 0 0 24px !important;
  padding: 8px !important;
  border: 1px solid rgba(216, 226, 231, 0.9) !important;
  border-radius: 999px !important;
  background: rgba(255, 253, 248, 0.94) !important;
  box-shadow: 0 10px 20px rgba(92, 63, 77, 0.08) !important;
  scrollbar-width: none !important;
}

.filter-bar::-webkit-scrollbar {
  display: none !important;
}

.filter-bar button {
  flex: 0 0 auto !important;
  min-height: 34px !important;
  border-color: rgba(118, 84, 99, 0.16) !important;
  background: rgba(255, 255, 255, 0.72) !important;
  color: #3d3339 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}

.filter-bar button:hover,
.filter-bar button:focus-visible {
  border-color: rgba(118, 84, 99, 0.28) !important;
  background: rgba(232, 189, 200, 0.16) !important;
}

.filter-bar button.is-active {
  background: var(--vl-rosewood) !important;
  border-color: var(--vl-rosewood) !important;
  color: var(--vl-pearl) !important;
}

#designerGrid.gallery-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
}

#designerGrid .product-card img {
  aspect-ratio: 1 / 1 !important;
  background: #f7f3ee !important;
}

#designerGrid .product-actions {
  align-items: end !important;
}

#designerGrid .cart-actions {
  justify-content: flex-end !important;
}

body.cart-page .checkout-card {
  position: sticky !important;
  top: calc(var(--header-height) + 18px) !important;
}

body.cart-page .cart-card {
  border-radius: 12px !important;
}

body.cart-page .cart-card:hover,
body.cart-page .cart-card:focus-within {
  border-color: rgba(118, 84, 99, 0.24) !important;
  box-shadow: 0 10px 22px rgba(92, 63, 77, 0.08) !important;
}

body.cart-page .cart-material-head {
  color: #59625d !important;
}

body.cart-page .cart-material-row {
  border-radius: 12px !important;
  background: rgba(255, 253, 248, 0.84) !important;
}

body.cart-page .cart-select span {
  display: block !important;
}

@media (max-width: 900px) {
  body.home-page .home-proof-v2 .standard-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.cart-page .checkout-card {
    position: static !important;
  }
}

@media (max-width: 680px) {
  :root {
    --header-height: 76px;
  }

  .site-header .nav {
    min-height: 76px !important;
  }

  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: clamp(104px, 29vw, 138px) !important;
    max-height: 34px !important;
  }

  .site-header .nav-links,
  body.home-page .nav-links,
  body.customizer-page .nav-links,
  body.designer-page .nav-links,
  body.cart-page .nav-links {
    max-width: calc(100vw - 150px) !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }

  .site-header .nav-links a:not(.button),
  body.home-page .nav-links a:not(.button),
  body.customizer-page .nav-links a:not(.button),
  body.designer-page .nav-links a:not(.button),
  body.cart-page .nav-links a:not(.button) {
    flex: 0 0 auto !important;
    min-height: 31px !important;
    padding: 0 8px !important;
    font-size: 10px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
  }

  body.home-page .home-hero-v2,
  body.designer-page .hero-full-gallery {
    min-height: min(560px, calc(100svh - var(--header-height) - 96px)) !important;
    aspect-ratio: auto !important;
  }

  body.home-page .home-hero-v2::before {
    background:
      linear-gradient(180deg, rgba(255, 253, 248, 0.05) 0%, rgba(255, 253, 248, 0.36) 42%, rgba(255, 253, 248, 0.95) 100%),
      linear-gradient(90deg, rgba(255, 253, 248, 0.82) 0%, rgba(255, 253, 248, 0.24) 68%, rgba(255, 253, 248, 0) 100%) !important;
  }

  body.home-page .home-hero-v2 .hero-full-content {
    align-items: end !important;
    padding: 32px 0 34px !important;
  }

  body.home-page .home-hero-v2 h1 {
    max-width: 330px !important;
    font-size: 2.45rem !important;
    line-height: 1.02 !important;
  }

  body.home-page .home-hero-v2 .lead {
    max-width: 32ch !important;
    font-size: 0.94rem !important;
  }

  body.home-page .home-entry-section .section-header h2,
  body.home-page .home-product-section .section-header h2,
  body.home-page .home-flow-section .section-header h2,
  body.home-page .home-faq-lite .section-header h2,
  body.designer-page .section-header h2,
  body.cart-page .section-header h1 {
    font-size: 1.8rem !important;
  }

  body.home-page .home-proof-section.home-proof-v2 {
    margin-top: 0 !important;
  }

  body.home-page .home-proof-v2 .standard-strip {
    width: 100% !important;
    padding: 0 !important;
  }

  body.home-page .home-proof-v2 .standard-item,
  body.home-page .home-proof-v2 .standard-item:first-child,
  body.home-page .home-proof-v2 .standard-strip:hover .standard-item:first-child:not(:hover) {
    min-height: 72px !important;
    padding: 12px !important;
  }

  body.home-page .home-entry-card {
    min-height: 280px !important;
  }

  body.home-page .home-entry-card h3 {
    font-size: 1.45rem !important;
  }

  body.home-page .home-product-card {
    grid-template-columns: 118px minmax(0, 1fr) !important;
  }

  body.home-page .home-product-card div {
    min-width: 0 !important;
  }

  body.home-page .home-product-card strong {
    margin-bottom: 10px !important;
  }

  .filter-bar {
    top: calc(var(--header-height) + 6px) !important;
    margin-inline: -2px !important;
    border-radius: 14px !important;
  }

  #designerGrid.gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #designerGrid .cart-actions {
    justify-content: flex-start !important;
  }

  body.cart-page .cart-card {
    grid-template-columns: 92px minmax(0, 1fr) !important;
    gap: 12px !important;
    padding: 14px 14px 56px !important;
  }

  body.cart-page .cart-select {
    left: 22px !important;
    top: 22px !important;
    z-index: 2 !important;
  }

  body.cart-page .cart-card .cart-bracelet-thumb,
  body.cart-page .cart-card > img {
    width: 92px !important;
    height: 92px !important;
  }

  body.cart-page .cart-card > div {
    min-width: 0 !important;
  }

  body.cart-page .cart-material-list h4 {
    font-size: 1rem !important;
  }

  body.cart-page .cart-material-head {
    display: none !important;
  }

  body.cart-page .cart-material-row {
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "name total"
      "detail total" !important;
    min-height: 54px !important;
    padding: 8px 10px !important;
    border-radius: 10px !important;
  }

  body.cart-page .cart-material-row > span:not(.cart-material-name):not(.cart-material-detail) {
    display: none !important;
  }

  body.cart-page .cart-material-detail {
    display: block !important;
    color: var(--muted) !important;
    font-size: 12px !important;
  }

  body.cart-page .cart-material-name img {
    width: 30px !important;
    height: 30px !important;
    flex-basis: 30px !important;
  }

  body.cart-page .cart-card > .price {
    right: 14px !important;
    bottom: 18px !important;
  }

  body.cart-page .cart-card .cart-actions {
    left: 14px !important;
    bottom: 14px !important;
    width: 92px !important;
  }
}

@media (max-width: 430px) {
  .site-header .nav-links,
  body.home-page .nav-links,
  body.customizer-page .nav-links,
  body.designer-page .nav-links,
  body.cart-page .nav-links {
    max-width: calc(100vw - 124px) !important;
  }

  body.home-page .home-hero-v2 h1 {
    font-size: 2.18rem !important;
  }

  #designerGrid.gallery-grid {
    gap: 10px !important;
  }

  #designerGrid .product-actions {
    display: grid !important;
    gap: 8px !important;
  }

  body.cart-page .cart-card {
    grid-template-columns: 82px minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  body.cart-page .cart-card .cart-bracelet-thumb,
  body.cart-page .cart-card > img,
  body.cart-page .cart-card .cart-actions {
    width: 82px !important;
  }
}

/* Cart item placement hardening - 2026-07-05 */
body.cart-page .cart-card:not(.empty) {
  grid-template-columns: 150px minmax(0, 1fr) !important;
  grid-template-areas: "thumb copy" !important;
  align-items: start !important;
}

body.cart-page .cart-card:not(.empty) > img,
body.cart-page .cart-card:not(.empty) > .cart-bracelet-thumb {
  grid-area: thumb !important;
  align-self: start !important;
  justify-self: start !important;
}

body.cart-page .cart-card:not(.empty) > div:last-child {
  grid-area: copy !important;
  width: 100% !important;
  min-width: 0 !important;
}

body.cart-page .cart-card:not(.empty) > div:last-child > p {
  max-width: 46ch !important;
  margin: 0 !important;
  color: var(--muted) !important;
  line-height: 1.55 !important;
}

body.cart-page .cart-select {
  position: absolute !important;
  top: 14px !important;
  left: 16px !important;
  z-index: 2 !important;
  justify-self: auto !important;
}

@media (max-width: 680px) {
  body.cart-page .cart-card:not(.empty) {
    grid-template-columns: 92px minmax(0, 1fr) !important;
    grid-template-areas: "thumb copy" !important;
  }

  body.cart-page .cart-card:not(.empty) > div:last-child > p {
    max-width: none !important;
    font-size: 14px !important;
  }
}

@media (max-width: 430px) {
  body.cart-page .cart-card:not(.empty) {
    grid-template-columns: 82px minmax(0, 1fr) !important;
  }
}

/* Full-screen home hero image - 2026-07-05 */
body.home-page .home-hero-v2,
body.home-page .hero-full.home-hero.home-hero-v2 {
  width: 100% !important;
  height: calc(100svh - var(--header-height)) !important;
  min-height: 680px !important;
  max-height: none !important;
  aspect-ratio: auto !important;
}

body.home-page .home-hero-v2 .hero-full-image {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: 72% center !important;
}

body.home-page .home-hero-v2 .hero-full-content {
  min-height: 100% !important;
  display: flex !important;
  align-items: center !important;
}

@media (max-width: 680px) {
  body.home-page .home-hero-v2,
  body.home-page .hero-full.home-hero.home-hero-v2 {
    height: calc(100svh - var(--header-height)) !important;
    min-height: 560px !important;
  }

  body.home-page .home-hero-v2 .hero-full-image {
    object-position: 64% center !important;
  }

  body.home-page .home-hero-v2 .hero-full-content {
    align-items: end !important;
  }
}

/* Fill the full-screen home hero with the complete source image and no letterbox. */
body.home-page .home-hero-v2,
body.home-page .hero-full.home-hero.home-hero-v2 {
  background: #f6f3ee !important;
}

body.home-page .home-hero-v2 .hero-full-image {
  object-fit: fill !important;
  object-position: center center !important;
}

@media (max-width: 680px) {
  body.home-page .home-hero-v2 .hero-full-image {
    object-fit: fill !important;
    object-position: center center !important;
  }
}

/* Responsive hero: shrink windows show the full image proportionally. */
@media (max-width: 900px) {
  body.home-page .home-hero-v2,
  body.home-page .hero-full.home-hero.home-hero-v2 {
    height: calc(100vw * 941 / 1672) !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 1672 / 941 !important;
    background: #f6f3ee !important;
  }

  body.home-page .home-hero-v2 .hero-full-image {
    object-fit: contain !important;
    object-position: center center !important;
  }

  body.home-page .home-hero-v2 .hero-full-content {
    min-height: 100% !important;
    padding-block: 0 !important;
    align-items: center !important;
  }
}

/* Designer page as a product-selection surface - 2026-07-05 */
body.designer-page main > .section.tight {
  padding-top: clamp(34px, 5vw, 56px) !important;
}

body.designer-page .section-header {
  max-width: 760px !important;
  gap: 12px !important;
  margin-bottom: 22px !important;
}

body.designer-page .section-header h2 {
  color: #181416 !important;
  font-size: 2.35rem !important;
  letter-spacing: -0.02em !important;
}

body.designer-page .section-header p {
  max-width: 68ch !important;
  color: #4f5652 !important;
  font-size: 1rem !important;
  line-height: 1.65 !important;
}

body.designer-page .filter-bar {
  position: sticky !important;
  top: calc(var(--header-height) + 8px) !important;
  border-radius: 14px !important;
  background: rgba(255, 253, 248, 0.96) !important;
}

body.designer-page #designerGrid.gallery-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
  gap: 18px !important;
}

body.designer-page #designerGrid .product-card {
  display: grid !important;
  min-height: 100% !important;
  overflow: hidden !important;
  border-color: rgba(82, 63, 59, 0.14) !important;
  border-radius: 12px !important;
  background: #fffdfb !important;
  box-shadow: none !important;
}

body.designer-page #designerGrid .product-card img {
  width: 100% !important;
  aspect-ratio: 1.05 / 1 !important;
  object-fit: cover !important;
  object-position: var(--product-pos, center) !important;
  opacity: 1 !important;
  filter: saturate(1.02) contrast(1.02) !important;
}

body.designer-page #designerGrid .product-card .content {
  display: grid !important;
  min-width: 0 !important;
  gap: 10px !important;
  padding: 18px !important;
}

body.designer-page #designerGrid .product-card h3 {
  color: #1f1b1d !important;
  font-size: 1.22rem !important;
  line-height: 1.18 !important;
  letter-spacing: 0 !important;
}

body.designer-page #designerGrid .product-stones,
body.designer-page #designerGrid .product-card p {
  margin: 0 !important;
  color: #515954 !important;
  font-size: 0.94rem !important;
  line-height: 1.55 !important;
}

body.designer-page #designerGrid .product-scene {
  color: #70656a !important;
  font-size: 0.88rem !important;
}

body.designer-page #designerGrid .product-meta {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  margin: 0 !important;
}

body.designer-page #designerGrid .product-meta span {
  display: inline-flex !important;
  min-height: 30px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 9px !important;
  border: 1px solid rgba(82, 63, 59, 0.12) !important;
  border-radius: 999px !important;
  background: #faf6f1 !important;
  color: #3f4742 !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  text-align: center !important;
}

body.designer-page #designerGrid .tag-row {
  gap: 6px !important;
  margin: 0 !important;
}

body.designer-page #designerGrid .tag {
  min-height: 26px !important;
  background: #f3e8e7 !important;
  color: #765463 !important;
  font-size: 0.76rem !important;
}

body.designer-page #designerGrid .tag.dark {
  background: #765463 !important;
  color: #fffdf8 !important;
}

body.designer-page #designerGrid .product-actions {
  display: grid !important;
  gap: 12px !important;
  align-items: start !important;
  margin-top: 4px !important;
}

body.designer-page #designerGrid .price {
  color: #171717 !important;
  font-size: 1.45rem !important;
  font-weight: 900 !important;
}

body.designer-page #designerGrid .cart-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  margin: 0 !important;
}

body.designer-page #designerGrid [data-add-product] {
  grid-column: 1 / -1 !important;
  min-height: 42px !important;
  font-size: 0.92rem !important;
}

body.designer-page #designerGrid [data-preview-product-button],
body.designer-page #designerGrid .product-customize-link {
  min-height: 36px !important;
  font-size: 0.82rem !important;
}

body.designer-page #designerGrid .product-customize-link {
  color: #765463 !important;
}

@media (max-width: 680px) {
  body.designer-page main > .section.tight {
    padding-top: 30px !important;
  }

  body.designer-page .section-header h2 {
    font-size: 2rem !important;
  }

  body.designer-page .section-header p {
    font-size: 0.95rem !important;
  }

  body.designer-page #designerGrid.gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  body.designer-page #designerGrid .product-card .content {
    gap: 8px !important;
    padding: 12px !important;
  }

  body.designer-page #designerGrid .product-card img {
    aspect-ratio: 1 / 0.92 !important;
    object-position: var(--product-mobile-pos, center) !important;
  }

  body.designer-page #designerGrid .product-card h3 {
    font-size: 1rem !important;
  }

  body.designer-page #designerGrid .product-stones,
  body.designer-page #designerGrid .product-card p {
    font-size: 0.78rem !important;
  }

  body.designer-page #designerGrid .product-scene {
    display: none !important;
  }

  body.designer-page #designerGrid .product-meta {
    grid-template-columns: 1fr !important;
    gap: 5px !important;
  }

  body.designer-page #designerGrid .product-meta span {
    justify-content: flex-start !important;
    min-height: 24px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #5d625c !important;
    font-size: 0.73rem !important;
    text-align: left !important;
  }

  body.designer-page #designerGrid .tag-row {
    display: none !important;
  }

  body.designer-page #designerGrid .price {
    font-size: 1.18rem !important;
  }

  body.designer-page #designerGrid .cart-actions {
    grid-template-columns: 1fr !important;
  }

  body.designer-page #designerGrid [data-add-product] {
    min-height: 38px !important;
  }

  body.designer-page #designerGrid .product-customize-link {
    display: none !important;
  }
}

/* Final designer card alignment override. */
body.designer-page #designerGrid .product-card .content {
  justify-items: center !important;
  text-align: center !important;
}

body.designer-page #designerGrid .product-card h3,
body.designer-page #designerGrid .product-card p,
body.designer-page #designerGrid .product-scene {
  text-align: center !important;
}

body.designer-page #designerGrid .product-meta {
  width: 100% !important;
  justify-items: center !important;
}

body.designer-page #designerGrid .product-meta span {
  justify-content: center !important;
  width: 100% !important;
  text-align: center !important;
}

body.designer-page #designerGrid .product-actions,
body.designer-page #designerGrid .cart-actions {
  width: 100% !important;
}

/* Designer collection header and filters: centered, no clipped horizontal rail. */
body.designer-page #collection .section-header {
  justify-items: center !important;
  max-width: 760px !important;
  margin-inline: auto !important;
  text-align: center !important;
}

body.designer-page #collection .section-header p {
  margin-inline: auto !important;
  text-align: center !important;
}

body.designer-page #collection .filter-bar {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px !important;
  overflow: visible !important;
  overflow-x: visible !important;
  max-width: 100% !important;
  margin: 0 auto 28px !important;
  padding: 10px !important;
  border-radius: 14px !important;
}

body.designer-page #collection .filter-bar button {
  flex: 0 1 auto !important;
  min-width: 70px !important;
  white-space: nowrap !important;
}

@media (max-width: 680px) {
  body.designer-page #collection .section-header {
    justify-items: center !important;
    text-align: center !important;
  }

  body.designer-page #collection .section-header p {
    text-align: center !important;
  }

  body.designer-page #collection .filter-bar {
    justify-content: center !important;
    margin-inline: 0 !important;
    padding: 8px !important;
  }

  body.designer-page #collection .filter-bar button {
    min-width: 64px !important;
  }
}

/* Finished collection purchase flow: compact cards, direct customization. */
body.designer-page main > #collection.section.tight {
  padding-top: clamp(22px, 4vw, 44px) !important;
  padding-bottom: clamp(28px, 5vw, 56px) !important;
}

body.designer-page #collection .container {
  max-width: 1180px !important;
}

body.designer-page #collection .section-header {
  max-width: 680px !important;
  gap: 8px !important;
  margin-bottom: 18px !important;
}

body.designer-page #collection .section-header h2 {
  font-size: clamp(1.85rem, 3vw, 2.35rem) !important;
  line-height: 1.08 !important;
}

body.designer-page #collection .section-header p {
  max-width: 42rem !important;
  color: #46504a !important;
  font-size: 0.98rem !important;
  line-height: 1.55 !important;
}

body.designer-page #collection .filter-bar {
  top: calc(var(--header-height) + 6px) !important;
  z-index: 5 !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin-bottom: 22px !important;
  border: 1px solid rgba(82, 63, 59, 0.12) !important;
  background: rgba(255, 254, 252, 0.94) !important;
  box-shadow: 0 6px 14px rgba(36, 62, 53, 0.06) !important;
  backdrop-filter: blur(10px) !important;
}

body.designer-page #collection .filter-bar button {
  min-height: 34px !important;
  min-width: 72px !important;
  padding: 0 13px !important;
  border-color: rgba(118, 84, 99, 0.18) !important;
  border-radius: 8px !important;
  background: #fffefd !important;
  color: #67535c !important;
  font-size: 0.84rem !important;
  font-weight: 800 !important;
}

body.designer-page #collection .filter-bar button:hover {
  border-color: rgba(118, 84, 99, 0.32) !important;
  color: #4d3943 !important;
}

body.designer-page #collection .filter-bar button.is-active {
  border-color: #765463 !important;
  background: #765463 !important;
  color: #fffefd !important;
}

body.designer-page #designerGrid.gallery-grid {
  align-items: stretch !important;
  grid-template-columns: repeat(auto-fit, minmax(238px, 1fr)) !important;
  gap: 16px !important;
}

body.designer-page #designerGrid .product-card {
  position: relative !important;
  align-content: start !important;
  border: 1px solid rgba(82, 63, 59, 0.12) !important;
  border-radius: 8px !important;
  background: #fffefd !important;
  cursor: pointer !important;
  transition: border-color 180ms ease, transform 180ms ease, background-color 180ms ease !important;
}

body.designer-page #designerGrid .product-card:hover,
body.designer-page #designerGrid .product-card:focus-within {
  border-color: rgba(118, 84, 99, 0.34) !important;
  background: #fffaf7 !important;
  transform: translateY(-2px) !important;
}

body.designer-page #designerGrid .product-card:focus-visible {
  outline: 3px solid rgba(118, 84, 99, 0.28) !important;
  outline-offset: 3px !important;
}

body.designer-page #designerGrid .product-card img {
  aspect-ratio: 4 / 3 !important;
  border-bottom: 1px solid rgba(82, 63, 59, 0.1) !important;
}

body.designer-page #designerGrid .product-card .content {
  align-content: start !important;
  justify-items: center !important;
  gap: 8px !important;
  min-height: 210px !important;
  padding: 14px !important;
  text-align: center !important;
}

body.designer-page #designerGrid .product-card h3 {
  color: #171717 !important;
  font-size: 1.05rem !important;
  line-height: 1.25 !important;
  text-wrap: pretty !important;
}

body.designer-page #designerGrid .product-stones {
  display: none !important;
  min-height: 1.35em !important;
  margin: 0 !important;
  color: #434d47 !important;
  font-size: 0.86rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

body.designer-page #designerGrid .product-meta {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
}

body.designer-page #designerGrid .product-meta span {
  min-height: 28px !important;
  justify-content: center !important;
  width: 100% !important;
  padding: 0 10px !important;
  border: 1px solid rgba(36, 62, 53, 0.14) !important;
  border-radius: 8px !important;
  background: #f5f3ed !important;
  color: #303a35 !important;
  font-size: 0.78rem !important;
  font-weight: 850 !important;
}

body.designer-page #designerGrid .tag-row {
  display: flex !important;
  justify-content: center !important;
  min-height: 26px !important;
  gap: 6px !important;
}

body.designer-page #designerGrid .tag {
  max-width: 100% !important;
  min-height: 24px !important;
  padding: 0 9px !important;
  border-radius: 999px !important;
  font-size: 0.72rem !important;
  line-height: 1 !important;
}

body.designer-page #designerGrid .product-scene {
  display: -webkit-box !important;
  min-height: 2.6em !important;
  overflow: hidden !important;
  color: #66615f !important;
  font-size: 0.8rem !important;
  line-height: 1.35 !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

body.designer-page #designerGrid .product-actions {
  align-self: end !important;
  width: 100% !important;
  margin-top: 2px !important;
}

body.designer-page #designerGrid .cart-actions {
  display: block !important;
  width: 100% !important;
}

body.designer-page #designerGrid .text-button {
  width: 100% !important;
  min-height: 40px !important;
  border: 1px solid rgba(118, 84, 99, 0.3) !important;
  border-radius: 8px !important;
  background: #765463 !important;
  color: #fffefd !important;
  font-size: 0.88rem !important;
  font-weight: 900 !important;
}

body.designer-page #designerGrid .text-button:hover {
  border-color: #5f4050 !important;
  background: #5f4050 !important;
  color: #fffefd !important;
}

@media (max-width: 680px) {
  body.designer-page main > #collection.section.tight {
    padding-top: 22px !important;
  }

  body.designer-page #collection .section-header {
    margin-bottom: 14px !important;
  }

  body.designer-page #collection .section-header h2 {
    font-size: 1.78rem !important;
  }

  body.designer-page #collection .section-header p {
    max-width: 27rem !important;
    font-size: 0.9rem !important;
    line-height: 1.5 !important;
  }

  body.designer-page #collection .filter-bar {
    width: auto !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    margin: 0 -14px 16px !important;
    padding: 8px 14px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    border-inline: 0 !important;
    border-radius: 0 !important;
    box-shadow: 0 5px 12px rgba(36, 62, 53, 0.05) !important;
    scroll-snap-type: x proximity !important;
  }

  body.designer-page #collection .filter-bar::-webkit-scrollbar {
    display: none !important;
  }

  body.designer-page #collection .filter-bar button {
    flex: 0 0 auto !important;
    min-width: auto !important;
    min-height: 32px !important;
    padding: 0 12px !important;
    font-size: 0.78rem !important;
    scroll-snap-align: start !important;
  }

  body.designer-page #designerGrid.gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body.designer-page #designerGrid .product-card {
    border-radius: 8px !important;
    transform: none !important;
  }

  body.designer-page #designerGrid .product-card:hover,
  body.designer-page #designerGrid .product-card:focus-within {
    transform: none !important;
  }

  body.designer-page #designerGrid .product-card img {
    aspect-ratio: 1 / 0.88 !important;
    object-position: var(--product-mobile-pos, center) !important;
  }

  body.designer-page #designerGrid .product-card .content {
    gap: 6px !important;
    min-height: 174px !important;
    padding: 10px !important;
  }

  body.designer-page #designerGrid .product-card h3 {
    font-size: 0.94rem !important;
    line-height: 1.2 !important;
  }

  body.designer-page #designerGrid .product-stones {
    display: none !important;
    font-size: 0.73rem !important;
    line-height: 1.3 !important;
  }

  body.designer-page #designerGrid .product-meta span {
    min-height: 24px !important;
    padding: 0 6px !important;
    border-radius: 7px !important;
    font-size: 0.68rem !important;
  }

  body.designer-page #designerGrid .tag-row {
    display: none !important;
  }

  body.designer-page #designerGrid .product-scene {
    display: none !important;
  }

  body.designer-page #designerGrid .text-button {
    min-height: 34px !important;
    border-radius: 7px !important;
    font-size: 0.77rem !important;
  }
}

/* Designer finished previews: show the whole bracelet instead of cropping. */
body.designer-page #designerGrid .product-card > img,
body.designer-page #designerGrid .product-card > .cart-bracelet-thumb {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 1 / 1 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(82, 63, 59, 0.1) !important;
  border-radius: 0 !important;
  background: #fbfaf7 !important;
}

body.designer-page #designerGrid .product-card > img,
body.designer-page #designerGrid .product-card .cart-bracelet-image,
body.designer-page #designerGrid .product-card .cart-bracelet-canvas {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}

body.designer-page #designerGrid .product-card > .cart-bracelet-thumb {
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
}

@media (max-width: 680px) {
  body.designer-page #designerGrid .product-card > img,
  body.designer-page #designerGrid .product-card > .cart-bracelet-thumb {
    aspect-ratio: 1 / 1 !important;
  }
}

/* Finished product cards do not show product names. */
body.designer-page #designerGrid .product-card h3 {
  display: none !important;
}


/* Finished product cards: compact content, no names, natural wrist label width. */
body.designer-page #designerGrid .product-card {
  min-height: 0 !important;
  align-content: start !important;
}

body.designer-page #designerGrid .product-card h3 {
  display: none !important;
}

body.designer-page #designerGrid .product-card .content {
  min-height: 0 !important;
  align-content: start !important;
  justify-items: center !important;
  gap: 8px !important;
  padding: 10px !important;
}

body.designer-page #designerGrid .product-meta {
  display: flex !important;
  width: auto !important;
  max-width: 100% !important;
  justify-content: center !important;
  margin: 0 !important;
}

body.designer-page #designerGrid .product-meta span {
  width: fit-content !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 24px !important;
  padding: 0 12px !important;
  white-space: nowrap !important;
  border-radius: 7px !important;
}

body.designer-page #designerGrid .product-actions,
body.designer-page #designerGrid .cart-actions {
  width: 100% !important;
  margin-top: 0 !important;
  align-self: start !important;
}

/* Finished card wrist chip: softer copy, clearer sizing signal. */
body.designer-page #designerGrid .product-meta span {
  border: 1px solid rgba(118, 84, 99, 0.18) !important;
  background: rgba(255, 253, 248, 0.94) !important;
  color: #765463 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.72),
    0 2px 5px rgba(82, 63, 59, 0.04) !important;
  transition:
    background-color 160ms ease,
    border-color 160ms ease,
    color 160ms ease,
    transform 160ms ease,
    box-shadow 160ms ease !important;
}

body.designer-page #designerGrid .product-card:hover .product-meta span,
body.designer-page #designerGrid .product-card:focus-within .product-meta span {
  border-color: rgba(118, 84, 99, 0.32) !important;
  background: rgba(246, 236, 239, 0.92) !important;
  color: #5f4050 !important;
  transform: translateY(-1px) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.8),
    0 5px 10px rgba(118, 84, 99, 0.08) !important;
}

/* Finished cards: keep desktop and mobile content matched. */
body.designer-page #designerGrid .product-card .tag-row,
body.designer-page #designerGrid .product-card .product-scene,
body.designer-page #designerGrid .product-card .product-customize-link {
  display: none !important;
}

body.designer-page #designerGrid .product-card .product-actions,
body.designer-page #designerGrid .product-card .cart-actions {
  display: flex !important;
  width: 100% !important;
  justify-content: center !important;
  justify-items: center !important;
  align-items: center !important;
  align-self: center !important;
  margin: 0 !important;
}

body.designer-page #designerGrid .product-card .text-button,
body.designer-page #designerGrid .product-card [data-add-product] {
  width: fit-content !important;
  min-width: 0 !important;
  justify-self: center !important;
  margin-inline: auto !important;
}


/* Mobile header: keep the full VEYLOVA wordmark visible. */
@media (max-width: 520px) {
  .site-header .nav {
    width: min(100% - 18px, 1160px) !important;
    gap: 6px !important;
  }

  .site-header .brand,
  body.home-page .site-header .brand,
  body.customizer-page .site-header .brand,
  body.designer-page .site-header .brand,
  body.cart-page .site-header .brand {
    flex: 0 0 116px !important;
    width: 116px !important;
    min-width: 116px !important;
    overflow: visible !important;
  }

  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    content: url("assets/veylova-brand/16-veylova-logo-wordmark-transparent.png") !important;
    width: 112px !important;
    max-width: 112px !important;
    height: auto !important;
    max-height: 30px !important;
    object-fit: contain !important;
    object-position: left center !important;
  }

  .site-header .nav-links,
  body.home-page .nav-links,
  body.customizer-page .nav-links,
  body.designer-page .nav-links,
  body.cart-page .nav-links {
    flex: 1 1 auto !important;
    max-width: calc(100vw - 140px) !important;
    gap: 1px !important;
    padding: 2px !important;
  }

  .site-header .nav-links a:not(.button),
  body.home-page .nav-links a:not(.button),
  body.customizer-page .nav-links a:not(.button),
  body.designer-page .nav-links a:not(.button),
  body.cart-page .nav-links a:not(.button) {
    min-height: 31px !important;
    padding: 0 6px !important;
    font-size: 9px !important;
    letter-spacing: 0 !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links .nav-cart-icon {
    width: 31px !important;
    min-width: 31px !important;
    height: 31px !important;
    min-height: 31px !important;
    flex-basis: 31px !important;
  }
}


/* Mobile header final: no blank logo box, show VEYLOVA wordmark. */
@media (max-width: 760px) {
  .site-header .container.nav,
  .site-header .nav {
    width: min(100% - 16px, 1160px) !important;
    gap: 5px !important;
  }

  .site-header .brand,
  body.home-page .site-header .brand,
  body.customizer-page .site-header .brand,
  body.designer-page .site-header .brand,
  body.cart-page .site-header .brand {
    flex: 0 0 96px !important;
    width: 96px !important;
    min-width: 96px !important;
    max-width: 96px !important;
    overflow: visible !important;
  }

  .site-header .brand-logo,
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    content: normal !important;
    width: 94px !important;
    min-width: 94px !important;
    max-width: 94px !important;
    height: auto !important;
    max-height: 28px !important;
    object-fit: contain !important;
    object-position: left center !important;
  }

  .site-header .nav-links,
  body.home-page .nav-links,
  body.customizer-page .nav-links,
  body.designer-page .nav-links,
  body.cart-page .nav-links {
    flex: 1 1 auto !important;
    max-width: calc(100vw - 118px) !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    gap: 1px !important;
    padding: 2px !important;
  }

  .site-header .nav-links a:not(.button),
  body.home-page .nav-links a:not(.button),
  body.customizer-page .nav-links a:not(.button),
  body.designer-page .nav-links a:not(.button),
  body.cart-page .nav-links a:not(.button) {
    min-height: 31px !important;
    padding: 0 6px !important;
    font-size: 9px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
  }
}


/* Mobile header nav: capsule hugs the text buttons instead of filling leftover space. */
@media (max-width: 760px) {
  .site-header .container.nav,
  .site-header .nav {
    justify-content: flex-start !important;
  }

  .site-header .nav-links,
  body.home-page .nav-links,
  body.customizer-page .nav-links,
  body.designer-page .nav-links,
  body.cart-page .nav-links {
    flex: 0 1 auto !important;
    width: fit-content !important;
    min-width: 0 !important;
    max-width: calc(100vw - 126px) !important;
    margin-left: auto !important;
    justify-content: flex-start !important;
  }
}

/* Designer page optimization v1: clearer first screen, steadier cards, keep orders entry. */
body.designer-page {
  background: #fbfaf8 !important;
}

body.designer-page .site-header .container.nav,
body.designer-page .site-header .nav {
  width: min(100% - 48px, 1180px) !important;
}

body.designer-page .site-header .nav-links {
  gap: 5px !important;
  padding: 4px !important;
  max-width: none !important;
}

body.designer-page .site-header .nav-links a:not(.button) {
  min-height: 38px !important;
  padding: 0 15px !important;
  white-space: nowrap !important;
}

body.designer-page .site-header .nav-links a.nav-orders-link {
  color: #765463 !important;
}

body.designer-page main > #collection.section.tight {
  padding-top: 34px !important;
  padding-bottom: 54px !important;
  background: linear-gradient(180deg, #fffcfa 0%, #fbfaf8 100%) !important;
}

body.designer-page #collection .container {
  width: min(100% - 68px, 1160px) !important;
  max-width: 1160px !important;
}

body.designer-page #collection .section-header {
  max-width: 660px !important;
  margin: 0 auto 18px !important;
  gap: 8px !important;
  text-align: center !important;
}

body.designer-page #collection .section-header h2 {
  font-size: clamp(2rem, 2.7vw, 2.55rem) !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
}

body.designer-page #collection .section-header p {
  max-width: 48rem !important;
  color: #3f4843 !important;
  font-size: 0.98rem !important;
  line-height: 1.45 !important;
}

body.designer-page #collection .filter-bar {
  position: sticky !important;
  top: calc(var(--header-height) + 8px) !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  width: min(100%, 760px) !important;
  max-width: 100% !important;
  gap: 8px !important;
  margin: 0 auto 22px !important;
  padding: 9px !important;
  overflow: visible !important;
  border-color: rgba(82, 63, 59, 0.12) !important;
  border-radius: 10px !important;
  background: rgba(255, 254, 252, 0.96) !important;
  box-shadow: 0 4px 10px rgba(36, 62, 53, 0.045) !important;
}

body.designer-page #collection .filter-bar::-webkit-scrollbar {
  display: none !important;
}

body.designer-page #collection .filter-bar button {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 34px !important;
  padding: 0 13px !important;
  border-radius: 8px !important;
  background: #fffefd !important;
  color: #6a5961 !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
  box-shadow: none !important;
}

body.designer-page #collection .filter-bar button.is-active {
  background: #765463 !important;
  color: #fffefd !important;
}

/* Designer collection filters: two equal segmented choices. */
body.designer-page #collection .filter-bar {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  width: min(100%, 520px) !important;
  gap: 8px !important;
}

body.designer-page #collection .filter-bar button {
  width: 100% !important;
  justify-content: center !important;
  text-align: center !important;
}

body.designer-page #designerGrid.gallery-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
  align-items: stretch !important;
  content-visibility: auto !important;
  contain-intrinsic-size: 740px !important;
}

body.designer-page #designerGrid .product-card {
  overflow: hidden !important;
  min-height: 0 !important;
  border-color: rgba(82, 63, 59, 0.13) !important;
  border-radius: 8px !important;
  background: #fffefd !important;
  box-shadow: none !important;
  contain: layout paint !important;
}

body.designer-page #designerGrid .product-card:hover,
body.designer-page #designerGrid .product-card:focus-within {
  border-color: rgba(118, 84, 99, 0.32) !important;
  background: #fffdfb !important;
  transform: translateY(-1px) !important;
}

body.designer-page #designerGrid .product-card > img,
body.designer-page #designerGrid .product-card > .cart-bracelet-thumb {
  aspect-ratio: 1 / 0.92 !important;
  background: #fbfaf7 !important;
}

body.designer-page #designerGrid .product-card .content {
  min-height: 88px !important;
  padding: 10px 12px 12px !important;
  gap: 8px !important;
}

body.designer-page #designerGrid .product-meta span {
  min-height: 24px !important;
  padding: 0 11px !important;
  border-color: rgba(118, 84, 99, 0.18) !important;
  background: #fffefd !important;
  color: #765463 !important;
  font-size: 0.78rem !important;
}

body.designer-page #designerGrid .product-card .text-button,
body.designer-page #designerGrid .product-card [data-add-product] {
  min-height: 36px !important;
  padding: 0 14px !important;
  border-radius: 8px !important;
  font-size: 0.84rem !important;
  box-shadow: none !important;
}

body.designer-page .mobile-sticky-cta {
  display: none !important;
}

@media (max-width: 1080px) {
  body.designer-page #designerGrid.gallery-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  body.designer-page .site-header .container.nav,
  body.designer-page .site-header .nav {
    width: min(100% - 16px, 1160px) !important;
  }

  body.designer-page .site-header .brand {
    flex-basis: 86px !important;
    width: 86px !important;
    min-width: 86px !important;
    max-width: 86px !important;
  }

  body.designer-page .site-header .brand-logo {
    width: 84px !important;
    min-width: 84px !important;
    max-width: 84px !important;
  }

  body.designer-page .site-header .nav-links {
    max-width: calc(100vw - 108px) !important;
    gap: 2px !important;
  }

  body.designer-page .site-header .nav-links a:not(.button) {
    min-height: 31px !important;
    padding: 0 7px !important;
    font-size: 9px !important;
  }

  body.designer-page .site-header .nav-links a.nav-orders-link {
    padding: 0 8px !important;
  }

  body.designer-page main > #collection.section.tight {
    padding-top: 24px !important;
    padding-bottom: 32px !important;
  }

  body.designer-page #collection .container {
    width: min(100% - 28px, 1160px) !important;
  }

  body.designer-page #collection .section-header {
    margin-bottom: 14px !important;
  }

  body.designer-page #collection .section-header h2 {
    font-size: 1.78rem !important;
  }

  body.designer-page #collection .section-header p {
    font-size: 0.9rem !important;
    line-height: 1.45 !important;
  }

  body.designer-page #collection .filter-bar {
    width: 100% !important;
    margin: 0 0 14px !important;
    padding: 7px !important;
    border-inline: 1px solid rgba(82, 63, 59, 0.12) !important;
    border-radius: 10px !important;
  }

  body.designer-page #collection .filter-bar button {
    min-height: 32px !important;
    padding: 0 12px !important;
    font-size: 0.78rem !important;
  }

  body.designer-page #designerGrid.gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    contain-intrinsic-size: 880px !important;
  }

  body.designer-page #designerGrid .product-card > img,
  body.designer-page #designerGrid .product-card > .cart-bracelet-thumb {
    aspect-ratio: 1 / 1 !important;
  }

  body.designer-page #designerGrid .product-card .content {
    min-height: 78px !important;
    padding: 8px 8px 10px !important;
    gap: 6px !important;
  }

  body.designer-page #designerGrid .product-meta span {
    min-height: 23px !important;
    padding: 0 8px !important;
    font-size: 0.68rem !important;
  }

  body.designer-page #designerGrid .product-card .text-button,
  body.designer-page #designerGrid .product-card [data-add-product] {
    min-height: 32px !important;
    padding: 0 10px !important;
    font-size: 0.74rem !important;
  }
}

@media (max-width: 380px) {
  body.designer-page .site-header .nav-links a.nav-orders-link {
    max-width: 72px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
}

/* Designer mobile nav fit: preserve My Orders while avoiding clipped labels. */
@media (max-width: 760px) {
  body.designer-page .site-header .brand {
    flex: 0 0 74px !important;
    width: 74px !important;
    min-width: 74px !important;
    max-width: 74px !important;
  }

  body.designer-page .site-header .brand-logo {
    width: 72px !important;
    min-width: 72px !important;
    max-width: 72px !important;
  }

  body.designer-page .site-header .nav-links {
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: calc(100vw - 94px) !important;
    gap: 1px !important;
    margin-left: auto !important;
  }

  body.designer-page .site-header .nav-links a:not(.button) {
    min-height: 30px !important;
    padding: 0 5px !important;
    font-size: 8px !important;
    font-weight: 850 !important;
  }

  body.designer-page .site-header .nav-links a.nav-cart-icon {
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    flex-basis: 30px !important;
  }

  body.designer-page .site-header .nav-links a.nav-orders-link {
    max-width: none !important;
    padding: 0 6px !important;
  }
}

/* Account/orders navigation stays icon-only across pages. */
.site-header .nav-links a.nav-account-icon,
.site-header .nav-links a.nav-orders-link.nav-account-icon {
  position: relative !important;
  display: inline-grid !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 42px !important;
  min-height: 42px !important;
  flex: 0 0 44px !important;
  place-items: center !important;
  padding: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #765463 !important;
  font-size: 0 !important;
  line-height: 1 !important;
  overflow: visible !important;
}

.site-header .nav-links a.nav-account-icon svg,
.site-header .nav-links a.nav-orders-link.nav-account-icon svg {
  display: block !important;
  width: 22px !important;
  height: 22px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.05 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.site-header .nav-links a.nav-account-icon:hover,
.site-header .nav-links a.nav-account-icon:focus-visible,
.site-header .nav-links a.nav-orders-link.nav-account-icon:hover,
.site-header .nav-links a.nav-orders-link.nav-account-icon:focus-visible {
  background: rgba(118, 84, 99, 0.08) !important;
}

@media (max-width: 680px) {
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    width: 36px !important;
    min-width: 36px !important;
    height: 34px !important;
    min-height: 34px !important;
    flex-basis: 36px !important;
  }

  .site-header .nav-links a.nav-account-icon svg,
  .site-header .nav-links a.nav-orders-link.nav-account-icon svg {
    width: 19px !important;
    height: 19px !important;
  }
}

/* Cart selection control: keep the checkbox in its own lane, away from the bracelet preview. */
body.cart-page .cart-card:not(.empty) {
  grid-template-columns: 34px 150px minmax(0, 1fr) !important;
  grid-template-areas: "select thumb copy" !important;
  column-gap: 18px !important;
  align-items: start !important;
}

body.cart-page .cart-card:not(.empty) > img,
body.cart-page .cart-card:not(.empty) > .cart-bracelet-thumb {
  grid-area: thumb !important;
  align-self: center !important;
  justify-self: center !important;
}

body.cart-page .cart-card:not(.empty) > div:last-child {
  grid-area: copy !important;
}

body.cart-page .cart-select {
  grid-area: select !important;
  position: relative !important;
  top: auto !important;
  left: auto !important;
  z-index: 3 !important;
  display: grid !important;
  width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  align-self: start !important;
  justify-self: center !important;
  place-items: center !important;
  margin: 2px 0 0 !important;
  border-radius: 999px !important;
  background: rgba(255, 253, 251, 0.92) !important;
  box-shadow:
    inset 0 0 0 1px rgba(118, 84, 99, 0.1),
    0 6px 14px rgba(70, 50, 58, 0.08) !important;
}

body.cart-page .cart-select input {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
}

body.cart-page .cart-select span {
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  border: 1.5px solid rgba(118, 84, 99, 0.34) !important;
  border-radius: 999px !important;
  background: #fffdfb !important;
  box-shadow: inset 0 0 0 4px #fffdfb !important;
  pointer-events: none !important;
}

body.cart-page .cart-select input:checked + span {
  border-color: #765463 !important;
  background: #765463 !important;
}

body.cart-page .cart-select input:checked + span::after {
  content: none !important;
  display: none !important;
}

body.cart-page .cart-select:focus-within {
  outline: 3px solid rgba(118, 84, 99, 0.18) !important;
  outline-offset: 2px !important;
}

@media (max-width: 680px) {
  body.cart-page .cart-card:not(.empty) {
    grid-template-columns: 30px 92px minmax(0, 1fr) !important;
    column-gap: 10px !important;
  }

  body.cart-page .cart-select {
    width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    margin-top: 0 !important;
  }

  body.cart-page .cart-select span {
    width: 18px !important;
    height: 18px !important;
    box-shadow: inset 0 0 0 3px #fffdfb !important;
  }

  body.cart-page .cart-select input:checked + span::after {
    content: none !important;
    display: none !important;
  }
}

@media (max-width: 430px) {
  body.cart-page .cart-card:not(.empty) {
    grid-template-columns: 28px 82px minmax(0, 1fr) !important;
    column-gap: 8px !important;
  }

  body.cart-page .cart-select {
    width: 28px !important;
    height: 28px !important;
    min-height: 28px !important;
  }
}

/* Mobile header final alignment: keep the navigation buttons pinned to the right. */
@media (max-width: 760px) {
  .site-header .container.nav,
  .site-header .nav,
  body.home-page .site-header .container.nav,
  body.customizer-page .site-header .container.nav,
  body.designer-page .site-header .container.nav,
  body.cart-page .site-header .container.nav {
    justify-content: space-between !important;
  }

  .site-header .brand,
  body.home-page .site-header .brand,
  body.customizer-page .site-header .brand,
  body.designer-page .site-header .brand,
  body.cart-page .site-header .brand {
    flex: 0 0 auto !important;
    margin-right: auto !important;
  }

  .site-header .nav-links,
  body.home-page .site-header .nav-links,
  body.customizer-page .site-header .nav-links,
  body.designer-page .site-header .nav-links,
  body.cart-page .site-header .nav-links {
    flex: 0 0 auto !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: calc(100vw - 112px) !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    justify-content: flex-end !important;
    overflow: visible !important;
  }
}

/* Home hero without subtitle: tighten the title-to-action rhythm. */
body.home-page .home-hero-v2 .hero-copy {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 28px !important;
}

body.home-page .home-hero-v2 h1 {
  margin-bottom: 0 !important;
}

body.home-page .home-hero-v2 .hero-actions {
  margin-top: 0 !important;
}

@media (max-width: 680px) {
  body.home-page .home-hero-v2 .hero-copy {
    gap: 20px !important;
  }
}

/* Home page content refresh: cleaner product cards, clearer trust strip, stronger closing path. */
body.home-page .home-proof-v2 .standard-copy strong {
  line-height: 1.2 !important;
}

body.home-page .home-proof-v2 .standard-copy small {
  max-width: 24ch !important;
  line-height: 1.45 !important;
}

body.home-page .home-product-section .section-header p,
body.home-page .home-flow-section .section-header p,
body.home-page .home-faq-lite .section-header p,
body.home-page .home-final-cta p {
  max-width: 62ch !important;
}

body.home-page .home-product-card div {
  gap: 10px !important;
}

body.home-page .home-product-card h3 {
  margin-bottom: 0 !important;
}

body.home-page .home-product-card p {
  min-height: 52px !important;
  margin-bottom: 4px !important;
  color: #5c5360 !important;
}

body.home-page .home-product-card a {
  min-height: 38px !important;
  padding-inline: 16px !important;
}

body.home-page .home-flow-grid article {
  display: grid !important;
  align-content: start !important;
  gap: 10px !important;
}

body.home-page .home-flow-grid span {
  margin-bottom: 4px !important;
}

body.home-page .home-flow-grid strong,
body.home-page .home-faq-grid h3 {
  margin-bottom: 0 !important;
}

body.home-page .home-final-cta {
  padding: clamp(42px, 5vw, 68px) 0 !important;
  background: #fffaf6 !important;
}

body.home-page .home-final-cta-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 28px !important;
}

body.home-page .home-final-cta h2 {
  max-width: 560px !important;
  margin: 0 0 10px !important;
  font-family: var(--serif) !important;
  font-size: clamp(34px, 4vw, 52px) !important;
  line-height: 1 !important;
  color: var(--ink) !important;
}

body.home-page .home-final-cta p {
  margin: 0 !important;
  color: var(--muted) !important;
  font-size: 17px !important;
  line-height: 1.55 !important;
}

body.home-page .home-final-cta .hero-actions {
  flex: 0 0 auto !important;
  margin-top: 0 !important;
}

body.home-page .home-brand-section {
  padding: clamp(46px, 6vw, 78px) 0 !important;
  background: linear-gradient(180deg, #fffaf6 0%, #fbf7f1 100%) !important;
}

body.home-page .home-brand-inner {
  display: grid !important;
  grid-template-columns: minmax(0, 0.92fr) minmax(320px, 0.78fr) !important;
  align-items: center !important;
  gap: clamp(28px, 5vw, 68px) !important;
}

body.home-page .home-brand-copy {
  max-width: 680px !important;
  justify-self: end !important;
}

body.home-page .home-brand-label {
  display: inline-flex !important;
  margin-bottom: 14px !important;
  color: #765463 !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

body.home-page .home-brand-copy h2 {
  max-width: 620px !important;
  margin: 0 0 18px !important;
  font-family: var(--serif) !important;
  font-size: clamp(36px, 4.8vw, 62px) !important;
  line-height: 0.98 !important;
  color: var(--ink) !important;
  text-wrap: balance !important;
}

body.home-page .home-brand-copy p {
  max-width: 66ch !important;
  margin: 0 !important;
  color: #514852 !important;
  font-size: clamp(16px, 1.6vw, 19px) !important;
  line-height: 1.65 !important;
}

body.home-page .home-brand-points {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: 24px !important;
}

body.home-page .home-brand-points span {
  display: inline-flex !important;
  min-height: 34px !important;
  align-items: center !important;
  padding: 0 13px !important;
  border: 1px solid rgba(185, 151, 78, 0.28) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  color: #44363d !important;
  font-size: 13px !important;
  font-weight: 750 !important;
}

body.home-page .home-brand-button {
  margin-top: 26px !important;
}

body.home-page .home-brand-media {
  min-height: 360px !important;
  overflow: hidden !important;
  border-radius: 8px !important;
  background: #f4eee9 !important;
}

body.home-page .home-brand-media img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

@media (max-width: 900px) {
  body.home-page .home-brand-inner {
    grid-template-columns: 1fr !important;
  }

  body.home-page .home-brand-media {
    min-height: 280px !important;
  }

  body.home-page .home-final-cta-inner {
    align-items: flex-start !important;
    flex-direction: column !important;
  }
}

@media (max-width: 680px) {
  body.home-page .home-brand-section {
    padding: 38px 0 !important;
  }

  body.home-page .home-brand-copy h2 {
    font-size: clamp(32px, 9vw, 42px) !important;
  }

  body.home-page .home-brand-points {
    gap: 8px !important;
    margin-top: 20px !important;
  }

  body.home-page .home-brand-media {
    min-height: 220px !important;
  }

  body.home-page .home-product-card p {
    min-height: 0 !important;
    font-size: 14px !important;
  }

  body.home-page .home-final-cta {
    padding: 34px 0 !important;
  }

  body.home-page .home-final-cta .hero-actions {
    width: 100% !important;
  }
}

/* Story template: image-left editorial brand block. */
body.home-page .home-brand-section {
  padding: clamp(46px, 6vw, 82px) 0 !important;
  background: #fbf7f1 !important;
}

body.home-page .home-brand-inner {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(185, 151, 78, 0.18) !important;
  border-radius: 8px !important;
  background: #fffdf9 !important;
  box-shadow: 0 18px 38px rgba(83, 60, 70, 0.08) !important;
}

body.home-page .home-brand-media {
  min-height: clamp(460px, 48vw, 640px) !important;
  border-radius: 0 !important;
  background: #f4eee9 !important;
}

body.home-page .home-brand-media img {
  height: 100% !important;
  object-position: center center !important;
}

body.home-page .home-brand-copy {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  justify-self: stretch !important;
  max-width: none !important;
  padding: clamp(34px, 6vw, 78px) clamp(30px, 6vw, 76px) !important;
  border-left: 1px solid rgba(185, 151, 78, 0.16) !important;
}

body.home-page .home-brand-label {
  margin-bottom: 22px !important;
  color: #a9759b !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  letter-spacing: 0.18em !important;
}

body.home-page .home-brand-copy h2 {
  max-width: 620px !important;
  margin: 0 !important;
  color: #4b3540 !important;
  font-size: clamp(44px, 5.6vw, 76px) !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
}

body.home-page .home-brand-divider {
  display: flex !important;
  align-items: center !important;
  width: min(100%, 420px) !important;
  margin: 26px 0 28px !important;
  color: #caa2bd !important;
}

body.home-page .home-brand-divider::before,
body.home-page .home-brand-divider::after {
  content: "" !important;
  height: 1px !important;
  flex: 1 1 auto !important;
  background: rgba(202, 162, 189, 0.48) !important;
}

body.home-page .home-brand-divider::after {
  max-width: 150px !important;
}

body.home-page .home-brand-divider::before {
  max-width: 210px !important;
}

body.home-page .home-brand-divider {
  gap: 14px !important;
}

body.home-page .home-brand-divider::selection {
  background: transparent !important;
}

body.home-page .home-brand-divider {
  text-align: center !important;
}

body.home-page .home-brand-divider::marker {
  content: "" !important;
}

body.home-page .home-brand-divider {
  position: relative !important;
}

body.home-page .home-brand-divider::before {
  order: 1 !important;
}

body.home-page .home-brand-divider::after {
  order: 3 !important;
}

body.home-page .home-brand-divider {
  font-size: 18px !important;
}

body.home-page .home-brand-divider {
  --story-star: "✦";
}

body.home-page .home-brand-divider::selection {
  color: transparent !important;
}

body.home-page .home-brand-divider {
  min-height: 18px !important;
}

body.home-page .home-brand-divider {
  background:
    linear-gradient(currentColor, currentColor) center / 0 0 no-repeat !important;
}

body.home-page .home-brand-divider::before,
body.home-page .home-brand-divider::after {
  display: block !important;
}

body.home-page .home-brand-divider {
  pointer-events: none !important;
}

body.home-page .home-brand-divider {
  word-spacing: 0 !important;
}

body.home-page .home-brand-divider {
  text-indent: 0 !important;
}

body.home-page .home-brand-divider::after {
  box-shadow: -164px 0 0 -163px currentColor !important;
}

body.home-page .home-brand-copy p {
  max-width: 58ch !important;
  color: #4f444d !important;
  font-size: clamp(17px, 1.6vw, 21px) !important;
  line-height: 1.72 !important;
}

body.home-page .home-brand-button {
  width: min(100%, 420px) !important;
  min-height: 56px !important;
  margin-top: 32px !important;
  font-size: 18px !important;
}

@media (max-width: 900px) {
  body.home-page .home-brand-inner {
    grid-template-columns: 1fr !important;
  }

  body.home-page .home-brand-copy {
    border-left: 0 !important;
    border-top: 1px solid rgba(185, 151, 78, 0.16) !important;
  }

  body.home-page .home-brand-media {
    min-height: 360px !important;
  }
}

@media (max-width: 680px) {
  body.home-page .home-brand-section {
    padding: 34px 0 !important;
  }

  body.home-page .home-brand-inner {
    border-radius: 8px !important;
  }

  body.home-page .home-brand-media {
    min-height: 280px !important;
  }

  body.home-page .home-brand-copy {
    padding: 30px 22px 28px !important;
  }

  body.home-page .home-brand-label {
    margin-bottom: 16px !important;
    font-size: 11px !important;
  }

  body.home-page .home-brand-copy h2 {
    font-size: clamp(36px, 10vw, 48px) !important;
  }

  body.home-page .home-brand-divider {
    margin: 20px 0 22px !important;
  }

  body.home-page .home-brand-copy p {
    font-size: 16px !important;
    line-height: 1.62 !important;
  }

  body.home-page .home-brand-button {
    width: 100% !important;
    min-height: 52px !important;
    margin-top: 24px !important;
    font-size: 16px !important;
  }
}

/* Story section as a single supplied template image, with a real clickable button area. */
body.home-page .home-brand-section {
  padding: clamp(34px, 5vw, 68px) 0 !important;
  background: #fbf7f1 !important;
}

body.home-page .home-story-template {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 8px !important;
  background: #fffdf9 !important;
  box-shadow: 0 18px 38px rgba(83, 60, 70, 0.08) !important;
}

body.home-page .home-story-template img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
}

body.home-page .home-story-template-button {
  position: absolute !important;
  left: 56.3% !important;
  top: 74.4% !important;
  width: 24.4% !important;
  height: 8.8% !important;
  border-radius: 6px !important;
  z-index: 2 !important;
  text-decoration: none !important;
}

body.home-page .home-story-template-button:focus-visible {
  outline: 3px solid rgba(118, 84, 99, 0.55) !important;
  outline-offset: 3px !important;
}

@media (max-width: 680px) {
  body.home-page .home-story-template {
    border-radius: 8px !important;
  }

  body.home-page .home-story-template-button {
    left: 53.5% !important;
    top: 72.6% !important;
    width: 31% !important;
    height: 11.8% !important;
  }
}

/* Story template refinement: rounded image corners and a real interactive button. */
body.home-page .home-story-template {
  border-radius: 22px !important;
  clip-path: inset(2px round 20px) !important;
  transform: translateZ(0) !important;
  box-shadow: none !important;
}

body.home-page .home-story-template img {
  border-radius: inherit !important;
  transform: scale(1.004) !important;
  transform-origin: center !important;
}

body.home-page .home-story-template-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(6px, 1vw, 12px) !important;
  left: 56.5% !important;
  top: 74.45% !important;
  width: 24.2% !important;
  height: 8.55% !important;
  box-sizing: border-box !important;
  padding: 0 1.55% !important;
  border: 1px solid rgba(255, 255, 255, 0.24) !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, rgba(202, 151, 178, 0.94), rgba(184, 129, 160, 0.94)) !important;
  color: #fff8f6 !important;
  box-shadow: none !important;
  font-size: clamp(10px, 1.05vw, 15px) !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    filter 180ms ease,
    background 180ms ease !important;
}

body.home-page .home-story-template-button:hover,
body.home-page .home-story-template-button:focus-visible {
  transform: translateY(-1px) !important;
  filter: brightness(1.05) saturate(1.04) !important;
  box-shadow: none !important;
}

body.home-page .home-story-template-button:active {
  transform: translateY(0) scale(0.985) !important;
  box-shadow: none !important;
}

body.home-page .home-story-template-button:focus-visible {
  outline: 2px solid rgba(118, 84, 99, 0.55) !important;
  outline-offset: 4px !important;
}

body.home-page .home-story-template-button span:first-child {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.home-page .home-story-template-button span[aria-hidden="true"] {
  flex: 0 0 auto !important;
  transform: translateX(0) !important;
  transition: transform 180ms ease !important;
}

body.home-page .home-story-template-button:hover span[aria-hidden="true"],
body.home-page .home-story-template-button:focus-visible span[aria-hidden="true"] {
  transform: translateX(3px) !important;
}

@media (max-width: 680px) {
  body.home-page .home-story-template {
    border-radius: 16px !important;
    clip-path: inset(2px round 14px) !important;
  }

  body.home-page .home-story-template-button {
    left: 56.5% !important;
    top: 74.2% !important;
    width: 24.8% !important;
    height: 8.9% !important;
    gap: 5px !important;
    padding: 0 1.5% !important;
    font-size: clamp(7px, 2.1vw, 11px) !important;
  }
}

/* Story section rebuilt as a real module using the supplied original image. */
body.home-page .home-brand-section {
  padding: clamp(36px, 5vw, 70px) 0 !important;
  background: #fbf7f1 !important;
}

body.home-page .home-story-card {
  display: grid !important;
  grid-template-columns: minmax(0, 0.96fr) minmax(0, 1fr) !important;
  align-items: stretch !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 22px !important;
  background: #fffdf9 !important;
  box-shadow: none !important;
}

body.home-page .home-story-photo {
  min-height: clamp(480px, 52vw, 680px) !important;
  overflow: hidden !important;
  border-radius: 22px 0 0 22px !important;
  background: #f5ece6 !important;
}

body.home-page .home-story-photo img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

body.home-page .home-story-copy {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  padding: clamp(36px, 7vw, 88px) clamp(32px, 6.2vw, 78px) !important;
}

body.home-page .home-story-label {
  display: block !important;
  margin-bottom: 18px !important;
  color: #c08aa8 !important;
  font-size: clamp(12px, 1.1vw, 16px) !important;
  font-weight: 850 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

body.home-page .home-story-rule {
  display: flex !important;
  width: min(100%, 260px) !important;
  align-items: center !important;
  gap: 14px !important;
  margin: 0 0 26px !important;
  color: #b9966b !important;
}

body.home-page .home-story-rule::before,
body.home-page .home-story-rule::after {
  content: "" !important;
  height: 1px !important;
  flex: 1 1 auto !important;
  background: rgba(185, 151, 107, 0.34) !important;
}

body.home-page .home-story-rule span {
  flex: 0 0 auto !important;
  font-size: 16px !important;
  line-height: 1 !important;
}

body.home-page .home-story-copy h2 {
  max-width: 680px !important;
  margin: 0 0 24px !important;
  color: #4b3540 !important;
  font-family: var(--serif) !important;
  font-size: clamp(44px, 5.8vw, 78px) !important;
  font-weight: 500 !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
  text-wrap: balance !important;
}

body.home-page .home-story-copy p {
  max-width: 58ch !important;
  margin: 0 !important;
  color: #554850 !important;
  font-size: clamp(17px, 1.5vw, 21px) !important;
  line-height: 1.72 !important;
}

body.home-page .home-story-button {
  display: inline-flex !important;
  width: min(100%, 330px) !important;
  min-height: 54px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 18px !important;
  margin-top: 34px !important;
  padding: 0 28px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #bd83a4 !important;
  color: #fff8f6 !important;
  box-shadow: none !important;
  font-size: 16px !important;
  font-weight: 650 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  transition: transform 180ms ease, background 180ms ease, filter 180ms ease !important;
}

body.home-page .home-story-button:hover,
body.home-page .home-story-button:focus-visible {
  background: #a86f91 !important;
  filter: brightness(1.04) !important;
  transform: translateY(-1px) !important;
}

body.home-page .home-story-button:active {
  transform: translateY(0) scale(0.985) !important;
}

body.home-page .home-story-button:focus-visible {
  outline: 2px solid rgba(118, 84, 99, 0.55) !important;
  outline-offset: 4px !important;
}

body.home-page .home-story-button span:first-child {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.home-page .home-story-button span[aria-hidden="true"] {
  flex: 0 0 auto !important;
  transition: transform 180ms ease !important;
}

body.home-page .home-story-button:hover span[aria-hidden="true"],
body.home-page .home-story-button:focus-visible span[aria-hidden="true"] {
  transform: translateX(3px) !important;
}

@media (max-width: 900px) {
  body.home-page .home-story-card {
    grid-template-columns: 1fr !important;
  }

  body.home-page .home-story-photo {
    min-height: 420px !important;
    border-radius: 22px 22px 0 0 !important;
  }
}

@media (max-width: 680px) {
  body.home-page .home-story-card {
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1fr) !important;
    border-radius: 14px !important;
  }

  body.home-page .home-story-photo {
    min-height: 0 !important;
    border-radius: 14px 0 0 14px !important;
  }

  body.home-page .home-story-copy {
    min-width: 0 !important;
    padding: 18px 14px !important;
  }

  body.home-page .home-story-label {
    margin-bottom: 8px !important;
    font-size: 8px !important;
    letter-spacing: 0.12em !important;
  }

  body.home-page .home-story-rule {
    width: 92% !important;
    gap: 8px !important;
    margin-bottom: 12px !important;
  }

  body.home-page .home-story-rule span {
    font-size: 10px !important;
  }

  body.home-page .home-story-copy h2 {
    margin-bottom: 10px !important;
    font-size: clamp(21px, 6.3vw, 30px) !important;
    line-height: 1.03 !important;
  }

  body.home-page .home-story-copy p {
    display: -webkit-box !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 5 !important;
    font-size: clamp(10px, 2.85vw, 13px) !important;
    line-height: 1.45 !important;
  }

  body.home-page .home-story-button {
    width: 100% !important;
    min-height: 34px !important;
    gap: 8px !important;
    margin-top: 14px !important;
    padding: 0 12px !important;
    font-size: clamp(9px, 2.55vw, 12px) !important;
  }
}

/* Keep story image-left/text-right on phones too. */
@media (max-width: 680px) {
  body.home-page .home-story-card {
    grid-template-columns: minmax(0, 0.94fr) minmax(0, 1fr) !important;
  }
}

/* Story typography refinement: more editorial, less UI-heavy. */
body.home-page .home-story-copy {
  align-items: flex-start !important;
  padding-left: clamp(42px, 6vw, 88px) !important;
  padding-right: clamp(42px, 6vw, 88px) !important;
}

body.home-page .home-story-label {
  color: #be8eac !important;
  font-family: var(--sans) !important;
  font-size: clamp(12px, 1vw, 15px) !important;
  font-weight: 800 !important;
  letter-spacing: 0.22em !important;
}

body.home-page .home-story-rule {
  width: min(100%, 300px) !important;
  margin-bottom: 30px !important;
}

body.home-page .home-story-copy h2 {
  max-width: 620px !important;
  margin-bottom: 28px !important;
  color: #4b3540 !important;
  font-family: Georgia, "Times New Roman", "Songti SC", serif !important;
  font-size: clamp(50px, 5vw, 74px) !important;
  font-weight: 400 !important;
  line-height: 1.06 !important;
  letter-spacing: 0 !important;
  text-wrap: balance !important;
}

body.home-page .home-story-copy p {
  max-width: 50ch !important;
  color: #51464f !important;
  font-family: var(--sans) !important;
  font-size: clamp(17px, 1.35vw, 20px) !important;
  font-weight: 400 !important;
  line-height: 1.78 !important;
}

body.home-page .home-story-button {
  width: min(100%, 360px) !important;
  min-height: 56px !important;
  margin-top: 36px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
}

@media (max-width: 680px) {
  body.home-page .home-story-copy {
    padding: 18px 14px !important;
  }

  body.home-page .home-story-label {
    margin-bottom: 7px !important;
    font-size: 8px !important;
    letter-spacing: 0.14em !important;
  }

  body.home-page .home-story-rule {
    width: 84% !important;
    margin-bottom: 10px !important;
  }

  body.home-page .home-story-copy h2 {
    margin-bottom: 9px !important;
    font-size: clamp(22px, 5.3vw, 29px) !important;
    line-height: 1.06 !important;
  }

  body.home-page .home-story-copy p {
    -webkit-line-clamp: 5 !important;
    font-size: clamp(10px, 2.65vw, 12px) !important;
    line-height: 1.5 !important;
  }

  body.home-page .home-story-button {
    min-height: 34px !important;
    margin-top: 13px !important;
    font-size: clamp(9px, 2.4vw, 11px) !important;
  }
}

/* Story label alignment: center the eyebrow and divider above the heading. */
body.home-page .home-story-label,
body.home-page .home-story-rule {
  align-self: center !important;
  text-align: center !important;
}

@media (max-width: 680px) {
  body.home-page .home-story-label,
  body.home-page .home-story-rule {
    align-self: center !important;
  }
}

/* Cart order notes: compact, scannable checkout guidance. */
body.cart-page .policy-section {
  margin-top: 28px !important;
  display: grid !important;
  grid-template-columns: minmax(220px, 0.78fr) minmax(0, 1.35fr) !important;
  gap: clamp(18px, 3.2vw, 34px) !important;
  align-items: start !important;
  padding: clamp(22px, 3.3vw, 34px) !important;
  border: 1px solid rgba(204, 176, 125, 0.32) !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, rgba(255, 253, 251, 0.98), rgba(250, 244, 242, 0.82)) !important;
}

body.cart-page .policy-heading {
  display: grid !important;
  gap: 10px !important;
  max-width: 420px !important;
  margin-bottom: 0 !important;
}

body.cart-page .policy-heading > span {
  color: #765463 !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
}

body.cart-page .policy-heading h2 {
  margin: 0 !important;
  color: #21191d !important;
  font-family: Georgia, "Times New Roman", "Songti SC", serif !important;
  font-size: clamp(28px, 2.9vw, 38px) !important;
  font-weight: 500 !important;
  line-height: 1.08 !important;
  text-wrap: balance !important;
}

body.cart-page .policy-heading p {
  max-width: 58ch !important;
  margin: 0 !important;
  color: #5f5660 !important;
  line-height: 1.55 !important;
}

body.cart-page .policy-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 0 !important;
}

body.cart-page .policy-card {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  column-gap: 12px !important;
  row-gap: 5px !important;
  align-content: center !important;
  min-height: 116px !important;
  padding: 15px !important;
  border: 1px solid rgba(82, 63, 59, 0.1) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.74) !important;
}

body.cart-page .policy-card .policy-index {
  display: inline-flex !important;
  grid-row: 1 / span 2 !important;
  width: 30px !important;
  height: 30px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border-radius: 999px !important;
  background: #f0ddd8 !important;
  color: #765463 !important;
  font-size: 11px !important;
  font-weight: 850 !important;
}

body.cart-page .policy-card strong {
  margin: 0 !important;
  color: #21191d !important;
  font-size: 15px !important;
  line-height: 1.25 !important;
}

body.cart-page .policy-card > span:not(.policy-index) {
  color: #5f5660 !important;
  font-size: 13.5px !important;
  line-height: 1.48 !important;
  text-wrap: pretty !important;
}

@media (max-width: 900px) {
  body.cart-page .policy-section {
    margin-top: 22px !important;
    padding: 22px 16px !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  body.cart-page .policy-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 520px) {
  body.cart-page .policy-grid {
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }

  body.cart-page .policy-card {
    min-height: 0 !important;
    padding: 14px !important;
  }
}

/* Cart page final controls: center previews and frame the edit action. */
body.cart-page .cart-card:not(.empty) > img,
body.cart-page .cart-card:not(.empty) > .cart-bracelet-thumb {
  align-self: center !important;
  justify-self: center !important;
}

body.cart-page .cart-card .cart-actions .text-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 38px !important;
  padding: 0 22px !important;
  border: 1px solid rgba(204, 176, 125, 0.52) !important;
  border-radius: 999px !important;
  background: rgba(255, 253, 251, 0.95) !important;
  color: #765463 !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

body.cart-page .cart-card .cart-actions .text-button:hover,
body.cart-page .cart-card .cart-actions .text-button:focus-visible {
  background: rgba(118, 84, 99, 0.08) !important;
  border-color: rgba(118, 84, 99, 0.34) !important;
}

/* Home hero carousel: stable copy with rotating designed imagery. */
body.home-page .home-hero.home-hero-v2.home-hero-carousel,
body.home-page .home-hero-carousel {
  position: relative !important;
  isolation: isolate !important;
}

body.home-page .home-hero-carousel .home-hero-slides,
body.home-page .home-hero-carousel .home-hero-slide {
  position: absolute !important;
  inset: 0 !important;
}

body.home-page .home-hero-carousel .home-hero-slides {
  z-index: 0 !important;
  overflow: hidden !important;
}

body.home-page .home-hero-carousel .home-hero-slide {
  opacity: 0 !important;
  transform: scale(1.012) !important;
  transition: opacity 700ms ease, transform 5200ms ease !important;
}

body.home-page .home-hero-carousel .home-hero-slide.is-active {
  opacity: 1 !important;
  transform: scale(1) !important;
}

body.home-page .home-hero-carousel .home-hero-slide .hero-full-image {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: var(--hero-position, 72% center) !important;
  filter: none !important;
}

body.home-page .home-hero-carousel .hero-full-content {
  z-index: 2 !important;
}

body.home-page .home-hero-carousel-controls {
  position: absolute !important;
  z-index: 3 !important;
  left: max(20px, calc((100% - 1160px) / 2)) !important;
  bottom: clamp(18px, 4vw, 42px) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

body.home-page .home-hero-carousel-controls button {
  width: 34px !important;
  height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  cursor: pointer !important;
  position: relative !important;
}

body.home-page .home-hero-carousel-controls button::before {
  content: "" !important;
  position: absolute !important;
  left: 5px !important;
  right: 5px !important;
  top: 10px !important;
  height: 4px !important;
  border-radius: 999px !important;
  background: rgba(118, 84, 99, 0.26) !important;
  transition: background 180ms ease, transform 180ms ease !important;
}

body.home-page .home-hero-carousel-controls button.is-active::before,
body.home-page .home-hero-carousel-controls button[aria-selected="true"]::before {
  background: #765463 !important;
  transform: scaleX(1.25) !important;
}

body.home-page .home-hero-carousel-controls button:focus-visible {
  outline: 2px solid rgba(118, 84, 99, 0.45) !important;
  outline-offset: 2px !important;
}

@media (max-width: 900px) {
  body.home-page .home-hero-carousel .home-hero-slide .hero-full-image {
    object-fit: cover !important;
    object-position: var(--hero-mobile-position, 66% center) !important;
  }
}

@media (max-width: 680px) {
  body.home-page .home-hero-carousel-controls {
    left: 15px !important;
    bottom: 14px !important;
    gap: 6px !important;
  }

  body.home-page .home-hero-carousel-controls button {
    width: 28px !important;
    height: 22px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.home-page .home-hero-carousel .home-hero-slide {
    transform: none !important;
    transition: opacity 180ms ease !important;
  }
}

/* Cart preview image sizing: keep material thumbnails small, make the bracelet preview readable. */
body.cart-page .cart-card:not(.empty) > .cart-bracelet-thumb {
  width: 150px !important;
  height: 150px !important;
}

body.cart-page .cart-card:not(.empty) > .cart-bracelet-image,
body.cart-page .cart-card:not(.empty) > img.cart-bracelet-image {
  display: block !important;
  width: 150px !important;
  height: 150px !important;
  border: 1px solid rgba(82, 63, 59, 0.14) !important;
  border-radius: 8px !important;
  background: #f8f3f1 !important;
  object-fit: contain !important;
  object-position: center center !important;
}

body.cart-page .cart-card:not(.empty) > .cart-bracelet-thumb .cart-bracelet-image {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;
  transform-origin: center center !important;
}

@media (max-width: 680px) {
  body.cart-page .cart-card:not(.empty) {
    grid-template-columns: 30px 112px minmax(0, 1fr) !important;
  }

  body.cart-page .cart-card:not(.empty) > .cart-bracelet-thumb {
    width: 112px !important;
    height: 112px !important;
  }

  body.cart-page .cart-card:not(.empty) > .cart-bracelet-image,
  body.cart-page .cart-card:not(.empty) > img.cart-bracelet-image {
    width: 112px !important;
    height: 112px !important;
  }
}

@media (max-width: 430px) {
  body.cart-page .cart-card:not(.empty) {
    grid-template-columns: 28px 102px minmax(0, 1fr) !important;
  }

  body.cart-page .cart-card:not(.empty) > .cart-bracelet-thumb {
    width: 102px !important;
    height: 102px !important;
  }

  body.cart-page .cart-card:not(.empty) > .cart-bracelet-image,
  body.cart-page .cart-card:not(.empty) > img.cart-bracelet-image {
    width: 102px !important;
    height: 102px !important;
  }
}

/* Keep the homepage carousel editorial without hiding the next section. */
body.home-page .home-hero.home-hero-v2.home-hero-carousel,
body.home-page .home-hero-carousel {
  min-height: clamp(520px, 66vh, 680px) !important;
  height: clamp(520px, 66vh, 680px) !important;
  padding: 0 !important;
}

body.home-page .home-hero-carousel .hero-full-content {
  min-height: 100% !important;
}

@media (max-width: 680px) {
  body.home-page .home-hero.home-hero-v2.home-hero-carousel,
  body.home-page .home-hero-carousel {
    min-height: auto !important;
    height: auto !important;
    aspect-ratio: 4 / 3 !important;
  }
}

.vl-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
}

/* Desktop home hero: large image module, not edge-to-edge. */
@media (min-width: 901px) {
  body.home-page .home-hero.home-hero-v2.home-hero-carousel,
  body.home-page .home-hero-carousel {
    width: min(calc(100% - clamp(36px, 6vw, 88px)), 1188px) !important;
    min-height: clamp(520px, 52vw, 640px) !important;
    height: clamp(520px, 52vw, 640px) !important;
    margin: 18px auto 22px !important;
    overflow: hidden !important;
    border: 1px solid rgba(185, 151, 78, 0.22) !important;
    border-radius: 14px !important;
    background: #f6f3ee !important;
  }

  body.home-page .home-hero-carousel .hero-full-content {
    width: 100% !important;
    padding-inline: clamp(28px, 4vw, 56px) !important;
  }

  body.home-page .home-hero-carousel-controls {
    left: clamp(26px, 4vw, 56px) !important;
    bottom: clamp(22px, 4vw, 42px) !important;
  }
}

/* Home flow copy refresh: clearer customization steps. */
body.home-page .home-flow-section {
  padding-top: clamp(30px, 4vw, 48px) !important;
  padding-bottom: clamp(46px, 5vw, 64px) !important;
}

body.home-page .home-flow-section .section-header {
  max-width: 760px !important;
  margin: 0 auto 26px !important;
  text-align: center !important;
}

body.home-page .home-flow-section .section-header h2 {
  margin-bottom: 10px !important;
  text-wrap: balance !important;
}

body.home-page .home-flow-section .section-header p {
  max-width: 68ch !important;
  margin-inline: auto !important;
  text-wrap: pretty !important;
}

body.home-page .home-flow-section .flow-mobile-text {
  display: none !important;
}

body.home-page .home-flow-grid {
  gap: 16px !important;
}

body.home-page .home-flow-grid article {
  position: relative !important;
  min-height: 190px !important;
  align-content: center !important;
  justify-items: center !important;
  padding: 0 !important;
  text-align: center !important;
  background: #fffdfb !important;
  transition: background 180ms ease, border-color 180ms ease, transform 180ms ease !important;
}

body.home-page .home-flow-card {
  display: grid !important;
  min-height: inherit !important;
  width: 100% !important;
  height: 100% !important;
  align-content: center !important;
  justify-items: center !important;
  gap: 10px !important;
  padding: 22px 18px !important;
  color: inherit !important;
  text-decoration: none !important;
  outline: none !important;
}

body.home-page .home-flow-grid article:hover {
  border-color: rgba(118, 84, 99, 0.28) !important;
  background: #fffaf6 !important;
  transform: translateY(-2px) !important;
}

body.home-page .home-flow-grid article:has(.home-flow-card:focus-visible) {
  border-color: rgba(118, 84, 99, 0.48) !important;
  box-shadow: 0 0 0 3px rgba(118, 84, 99, 0.12) !important;
}

body.home-page .home-flow-grid article:has(.home-flow-card:active) {
  transform: translateY(0) scale(0.985) !important;
  background: #fbf2ea !important;
}

body.home-page .home-flow-card > span {
  display: inline-flex !important;
  width: 36px !important;
  height: 36px !important;
  margin-bottom: 6px !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  background: rgba(118, 84, 99, 0.16) !important;
  color: #243e35 !important;
  font-size: 15px !important;
}

body.home-page .home-flow-card strong span,
body.home-page .home-flow-card p span {
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: initial !important;
  justify-content: initial !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}

body.home-page .home-flow-card strong span.flow-desktop-text,
body.home-page .home-flow-card p span.flow-desktop-text {
  display: inline !important;
}

body.home-page .home-flow-grid strong {
  color: #1f3430 !important;
  line-height: 1.2 !important;
}

body.home-page .home-flow-grid p {
  max-width: 25ch !important;
  color: #5e5660 !important;
}

/* Customer reviews: trust layer before the final CTA. */
body.home-page .home-review-section {
  padding: clamp(42px, 5vw, 64px) 0 !important;
  background: #fffdfb !important;
}

body.home-page .home-review-header {
  position: relative !important;
  display: flex !important;
  align-items: end !important;
  justify-content: center !important;
  gap: 24px !important;
  margin-bottom: 22px !important;
  text-align: center !important;
}

body.home-page .home-review-header > div {
  min-width: 0 !important;
}

body.home-page .home-review-header h2 {
  margin: 0 0 8px !important;
  font-family: var(--serif) !important;
  font-size: clamp(32px, 4vw, 48px) !important;
  line-height: 1 !important;
  color: var(--ink) !important;
  white-space: nowrap !important;
}

body.home-page .home-review-header p {
  max-width: 58ch !important;
  margin: 0 auto !important;
  color: #5e5660 !important;
  font-size: 16px !important;
  line-height: 1.5 !important;
  white-space: nowrap !important;
}

body.home-page .home-review-link {
  position: absolute !important;
  right: 0 !important;
  bottom: 2px !important;
  display: inline-flex !important;
  min-height: 38px !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 18px !important;
  border: 1px solid rgba(118, 84, 99, 0.18) !important;
  border-radius: 999px !important;
  background: #fffaf6 !important;
  color: #765463 !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

body.home-page .home-review-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

body.home-page .home-review-card {
  display: grid !important;
  min-height: 430px !important;
  grid-template-rows: auto 1fr !important;
  align-content: stretch !important;
  gap: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  border: 1px solid rgba(185, 151, 78, 0.24) !important;
  border-radius: 8px !important;
  background: #fff !important;
  transition: transform 180ms ease, border-color 180ms ease, background 180ms ease !important;
}

body.home-page .home-review-card:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(118, 84, 99, 0.28) !important;
  background: #fffaf6 !important;
}

body.home-page .home-review-photo {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 4 / 5 !important;
  object-fit: cover !important;
  object-position: center 38% !important;
  background: #f6f3ee !important;
}

body.home-page .home-review-body {
  display: grid !important;
  align-content: space-between !important;
  gap: 14px !important;
  padding: 20px 22px 22px !important;
}

body.home-page .home-review-stars {
  color: #b9974e !important;
  font-size: 14px !important;
  letter-spacing: 1px !important;
}

body.home-page .home-review-card p {
  margin: 0 !important;
  color: #2d2a2e !important;
  font-size: 16px !important;
  line-height: 1.55 !important;
}

body.home-page .home-review-meta {
  display: flex !important;
  align-items: baseline !important;
  gap: 8px !important;
  color: #5e5660 !important;
  font-size: 13px !important;
}

body.home-page .home-review-meta strong {
  color: #243e35 !important;
  font-size: 14px !important;
}

@media (max-width: 680px) {
  body.home-page .home-flow-section {
    padding-top: 20px !important;
    padding-bottom: 34px !important;
  }

  body.home-page .home-flow-section .section-header {
    text-align: left !important;
    margin-inline: 0 !important;
    margin-bottom: 16px !important;
  }

  body.home-page .home-flow-section .flow-desktop-text {
    display: none !important;
  }

  body.home-page .home-flow-section .flow-mobile-text {
    display: inline !important;
  }

  body.home-page .home-flow-section .home-flow-card .flow-desktop-text {
    display: none !important;
  }

  body.home-page .home-flow-section .home-flow-card .flow-mobile-text {
    display: inline !important;
  }

  body.home-page .home-flow-section .section-header h2 {
    font-size: 28px !important;
    line-height: 1.08 !important;
    margin-bottom: 8px !important;
  }

  body.home-page .home-flow-section .section-header p {
    max-width: 34ch !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
  }

  body.home-page .home-flow-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body.home-page .home-flow-grid article {
    min-height: 132px !important;
    align-content: start !important;
    padding: 0 !important;
  }

  body.home-page .home-flow-card {
    align-content: center !important;
    gap: 7px !important;
    padding: 14px 10px !important;
  }

  body.home-page .home-flow-card > span {
    width: 28px !important;
    height: 28px !important;
    margin-bottom: 2px !important;
    font-size: 12px !important;
  }

  body.home-page .home-flow-grid strong {
    font-size: 13px !important;
    line-height: 1.16 !important;
  }

  body.home-page .home-flow-grid p {
    max-width: 17ch !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
  }

  body.home-page .home-review-section {
    padding: 32px 0 34px !important;
  }

  body.home-page .home-review-header {
    display: block !important;
    margin-bottom: 16px !important;
    text-align: center !important;
  }

  body.home-page .home-review-header h2 {
    max-width: none !important;
    margin: 0 auto 8px !important;
    font-size: clamp(25px, 6.2vw, 30px) !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  body.home-page .home-review-header p {
    max-width: none !important;
    margin-inline: auto !important;
    font-size: clamp(11px, 2.75vw, 14px) !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
  }

  body.home-page .home-review-link {
    display: none !important;
  }

  body.home-page .home-review-scroll {
    margin-inline: -14px !important;
    overflow-x: auto !important;
    overscroll-behavior-inline: contain !important;
    scrollbar-width: none !important;
  }

  body.home-page .home-review-scroll::-webkit-scrollbar {
    display: none !important;
  }

  body.home-page .home-review-grid {
    display: flex !important;
    width: max-content !important;
    gap: 10px !important;
    padding-inline: 14px !important;
    scroll-snap-type: x proximity !important;
  }

  body.home-page .home-review-card {
    width: min(78vw, 286px) !important;
    min-height: 414px !important;
    padding: 0 !important;
    scroll-snap-align: start !important;
  }

  body.home-page .home-review-photo {
    aspect-ratio: 4 / 5 !important;
  }

  body.home-page .home-review-body {
    gap: 12px !important;
    padding: 16px !important;
  }

  body.home-page .home-review-card p {
    font-size: 14px !important;
    line-height: 1.45 !important;
  }

  body.home-page .home-review-stars {
    font-size: 12px !important;
  }
}

.vl-chat-launcher {
  position: fixed !important;
  right: max(18px, env(safe-area-inset-right)) !important;
  bottom: max(18px, env(safe-area-inset-bottom)) !important;
  z-index: 2147483000 !important;
  width: 58px !important;
  height: 58px !important;
  padding: 0 !important;
  border: 1px solid rgba(216, 189, 126, 0.7) !important;
  border-radius: 999px !important;
  background: #fffdfb !important;
  box-shadow: 0 8px 18px rgba(83, 60, 70, 0.16) !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease !important;
}

.vl-chat-launcher[hidden] {
  display: none !important;
}

.vl-chat-launcher::before {
  content: "" !important;
  position: absolute !important;
  inset: -6px !important;
  border-radius: inherit !important;
  background: radial-gradient(circle, rgba(232, 189, 200, 0.22), transparent 68%) !important;
  opacity: 0.92 !important;
  z-index: -1 !important;
}

.vl-chat-launcher:hover,
.vl-chat-launcher:focus-visible {
  transform: translateY(-2px) scale(1.03) !important;
  border-color: rgba(118, 84, 99, 0.46) !important;
  box-shadow: 0 10px 22px rgba(83, 60, 70, 0.2) !important;
}

.vl-chat-launcher-icon {
  width: 44px !important;
  height: 44px !important;
  display: block !important;
}

.vl-chat-launcher-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

body.vl-chat-custom-ready:not(.vl-chat-open) iframe.vl-third-party-chat-bubble {
  opacity: 0 !important;
  pointer-events: none !important;
}

body.vl-chat-open .vl-chat-launcher {
  display: none !important;
}

/* Home hot picks carousel: compact product rail between trust and browsing. */
body.home-page .home-hot-section {
  padding: clamp(30px, 4.5vw, 56px) 0 clamp(38px, 5vw, 64px) !important;
  background: linear-gradient(180deg, #fbf7f1 0%, #fffaf6 100%) !important;
}

body.home-page .home-hot-header {
  display: flex !important;
  align-items: end !important;
  justify-content: space-between !important;
  gap: 20px !important;
  margin-bottom: 18px !important;
}

body.home-page .home-hot-header h2 {
  margin: 0 !important;
  color: #211b1f !important;
  font-family: Georgia, "Times New Roman", "Songti SC", serif !important;
  font-size: clamp(30px, 3.2vw, 44px) !important;
  font-weight: 500 !important;
  line-height: 1.06 !important;
  letter-spacing: -0.01em !important;
  text-wrap: balance !important;
}

body.home-page .home-hot-header p {
  max-width: 56ch !important;
  margin: 0 !important;
  color: #5c5360 !important;
  font-size: 16px !important;
  line-height: 1.55 !important;
}

body.home-page .home-hot-view-all {
  display: inline-flex !important;
  min-height: 38px !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 16px !important;
  border: 1px solid rgba(118, 84, 99, 0.26) !important;
  border-radius: 999px !important;
  background: rgba(255, 253, 248, 0.8) !important;
  color: #765463 !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

body.home-page .home-hot-scroll {
  margin-inline: calc((100vw - min(1160px, calc(100vw - 40px))) / -2) !important;
  overflow-x: auto !important;
  overscroll-behavior-x: contain !important;
  scroll-padding-inline: calc((100vw - min(1160px, calc(100vw - 40px))) / 2) !important;
  scroll-snap-type: x mandatory !important;
  scrollbar-width: none !important;
}

body.home-page .home-hot-scroll::-webkit-scrollbar {
  display: none !important;
}

body.home-page .home-hot-track {
  display: grid !important;
  width: max-content !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(250px, 276px) !important;
  gap: 14px !important;
  padding-inline: calc((100vw - min(1160px, calc(100vw - 40px))) / 2) !important;
}

body.home-page .home-hot-card {
  min-width: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(216, 189, 126, 0.52) !important;
  border-radius: 12px !important;
  background: #fff !important;
  scroll-snap-align: start !important;
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease !important;
}

body.home-page .home-hot-card:hover,
body.home-page .home-hot-card:focus-within {
  border-color: rgba(118, 84, 99, 0.34) !important;
  box-shadow: 0 8px 14px rgba(92, 63, 77, 0.1) !important;
  transform: translateY(-2px) !important;
}

body.home-page .home-hot-card a {
  display: grid !important;
  min-height: 100% !important;
  color: inherit !important;
  text-decoration: none !important;
}

body.home-page .home-hot-media {
  display: grid !important;
  min-height: 224px !important;
  place-items: center !important;
  padding: 18px !important;
  background: #fff !important;
}

body.home-page .home-hot-card img {
  width: min(100%, 220px) !important;
  aspect-ratio: 1 !important;
  object-fit: contain !important;
  object-position: var(--product-pos, center) !important;
  background: transparent !important;
}

body.home-page .home-hot-copy {
  display: grid !important;
  gap: 10px !important;
  justify-items: center !important;
  padding: 14px !important;
  text-align: center !important;
}

body.home-page .home-hot-fit {
  display: inline-flex !important;
  width: fit-content !important;
  min-height: 30px !important;
  align-items: center !important;
  padding: 0 11px !important;
  border-radius: 999px !important;
  background: rgba(185, 151, 78, 0.12) !important;
  color: #765463 !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

body.home-page .home-hot-button {
  display: inline-flex !important;
  min-height: 38px !important;
  width: fit-content !important;
  align-items: center !important;
  justify-content: center !important;
  margin-top: 4px !important;
  padding: 0 16px !important;
  border: 1px solid rgba(204, 176, 125, 0.52) !important;
  border-radius: 999px !important;
  background: rgba(255, 253, 251, 0.95) !important;
  color: #765463 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  transition: background 180ms ease, border-color 180ms ease, transform 180ms ease !important;
}

body.home-page .home-hot-card:hover .home-hot-button,
body.home-page .home-hot-card:focus-within .home-hot-button {
  background: rgba(118, 84, 99, 0.08) !important;
  border-color: rgba(118, 84, 99, 0.34) !important;
  transform: translateY(-1px) !important;
}

@media (max-width: 680px) {
  body.home-page .home-hot-section {
    padding: 28px 0 36px !important;
  }

  body.home-page .home-hot-header {
    align-items: flex-start !important;
    margin-bottom: 14px !important;
  }

  body.home-page .home-hot-header h2 {
    font-size: 30px !important;
  }

  body.home-page .home-hot-header p {
    max-width: 30ch !important;
    font-size: 14px !important;
  }

  body.home-page .home-hot-view-all {
    min-height: 34px !important;
    padding-inline: 13px !important;
    font-size: 12px !important;
  }

  body.home-page .home-hot-scroll {
    margin-inline: -20px !important;
    scroll-padding-inline: 20px !important;
  }

  body.home-page .home-hot-track {
    grid-auto-columns: clamp(136px, 37vw, 208px) !important;
    gap: 10px !important;
    padding-inline: 20px !important;
  }

  body.home-page .home-hot-media {
    min-height: 132px !important;
    padding: 10px !important;
  }

  body.home-page .home-hot-card img {
    width: min(100%, 128px) !important;
    aspect-ratio: 1 !important;
    object-position: var(--product-mobile-pos, var(--product-pos, center)) !important;
  }

  body.home-page .home-hot-copy {
    gap: 8px !important;
    padding: 10px !important;
  }

  body.home-page .home-hot-fit {
    min-height: 26px !important;
    padding-inline: 8px !important;
    font-size: 10px !important;
    white-space: nowrap !important;
  }

  body.home-page .home-hot-button {
    min-height: 30px !important;
    margin-top: 2px !important;
    padding-inline: 10px !important;
    font-size: 10px !important;
    white-space: nowrap !important;
  }

  .vl-chat-launcher {
    right: max(14px, env(safe-area-inset-right)) !important;
    bottom: max(16px, env(safe-area-inset-bottom)) !important;
    width: 54px !important;
    height: 54px !important;
  }

  .vl-chat-launcher-icon {
    width: 41px !important;
    height: 41px !important;
  }
}

/* Home icon polish: tighter proof icons and cleaner header bag glyph. */
body.home-page .home-proof-v2 .standard-strip {
  overflow: hidden !important;
  border: 1px solid rgba(185, 151, 78, 0.24) !important;
  background: rgba(255, 253, 249, 0.92) !important;
}

body.home-page .home-proof-v2 .standard-item,
body.home-page .home-proof-v2 .standard-item:first-child,
body.home-page .home-proof-v2 .standard-strip:hover .standard-item:first-child:not(:hover) {
  align-items: center !important;
  gap: 14px !important;
  min-height: 92px !important;
  padding: 18px 20px !important;
  background: transparent !important;
}

body.home-page .home-proof-v2 .standard-item:hover {
  background: rgba(255, 250, 246, 0.96) !important;
  box-shadow: inset 0 0 0 1px rgba(118, 84, 99, 0.08) !important;
}

body.home-page .home-proof-v2 .standard-icon {
  display: grid !important;
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  flex: 0 0 48px !important;
  place-items: center !important;
  border: 1px solid rgba(185, 151, 78, 0.58) !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #fffdf9 0%, #fbf2ea 100%) !important;
  box-shadow: inset 0 0 0 6px rgba(255, 255, 255, 0.62) !important;
}

body.home-page .home-proof-v2 .standard-icon img,
body.home-page .home-proof-v2 .standard-icon svg {
  display: block !important;
  width: 25px !important;
  height: 25px !important;
  object-fit: contain !important;
  filter: saturate(0.92) contrast(1.08) brightness(0.9) !important;
  opacity: 0.96 !important;
}

body.home-page .home-proof-v2 .standard-copy {
  min-width: 0 !important;
}

body.home-page .home-proof-v2 .standard-copy strong {
  color: #243e35 !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  line-height: 1.18 !important;
}

body.home-page .home-proof-v2 .standard-copy small {
  max-width: 25ch !important;
  color: #5e5660 !important;
  font-size: 12px !important;
  line-height: 1.38 !important;
}

.site-header .nav-links a.nav-cart-icon {
  border-color: rgba(185, 151, 78, 0.26) !important;
  background: rgba(255, 253, 249, 0.78) !important;
  box-shadow: none !important;
  color: #765463 !important;
}

.site-header .nav-links a.nav-cart-icon svg {
  width: 22px !important;
  height: 22px !important;
  stroke-width: 1.9 !important;
}

.site-header .nav-links a.nav-cart-icon:not([aria-current="page"]):hover,
.site-header .nav-links a.nav-cart-icon:not([aria-current="page"]):focus-visible {
  border-color: rgba(118, 84, 99, 0.38) !important;
  background: #fffaf6 !important;
  color: #5f4050 !important;
}

@media (max-width: 680px) {
  body.home-page .home-proof-v2 .standard-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    border-radius: 10px !important;
  }

  body.home-page .home-proof-v2 .standard-item,
  body.home-page .home-proof-v2 .standard-item:first-child,
  body.home-page .home-proof-v2 .standard-strip:hover .standard-item:first-child:not(:hover) {
    gap: 10px !important;
    min-height: 78px !important;
    padding: 12px !important;
  }

  body.home-page .home-proof-v2 .standard-icon {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    flex-basis: 38px !important;
    box-shadow: inset 0 0 0 4px rgba(255, 255, 255, 0.62) !important;
  }

  body.home-page .home-proof-v2 .standard-icon img,
  body.home-page .home-proof-v2 .standard-icon svg {
    width: 20px !important;
    height: 20px !important;
  }

  body.home-page .home-proof-v2 .standard-copy strong {
    font-size: 11px !important;
    line-height: 1.16 !important;
  }

  body.home-page .home-proof-v2 .standard-copy small {
    font-size: 9.5px !important;
    line-height: 1.28 !important;
  }
}

/* Home mobile flow sizing: tighter 4-step cards on narrow screens. */
@media (max-width: 680px) {
  body.home-page .home-flow-section {
    padding-top: 18px !important;
    padding-bottom: 28px !important;
  }

  body.home-page .home-flow-section .section-header {
    margin-bottom: 12px !important;
  }

  body.home-page .home-flow-section .section-header h2 {
    font-size: 25px !important;
    line-height: 1.06 !important;
    margin-bottom: 6px !important;
  }

  body.home-page .home-flow-section .section-header p {
    max-width: 31ch !important;
    font-size: 13px !important;
    line-height: 1.36 !important;
  }

  body.home-page .home-flow-grid {
    gap: 8px !important;
  }

  body.home-page .home-flow-grid article {
    min-height: 106px !important;
    border-radius: 8px !important;
  }

  body.home-page .home-flow-card {
    gap: 5px !important;
    min-height: 106px !important;
    padding: 10px 8px !important;
  }

  body.home-page .home-flow-card > span {
    width: 24px !important;
    height: 24px !important;
    margin-bottom: 1px !important;
    font-size: 11px !important;
  }

  body.home-page .home-flow-grid strong {
    font-size: 12px !important;
    line-height: 1.12 !important;
  }

  body.home-page .home-flow-grid p {
    max-width: 15ch !important;
    font-size: 10px !important;
    line-height: 1.25 !important;
  }
}

@media (max-width: 360px) {
  body.home-page .home-flow-grid article,
  body.home-page .home-flow-card {
    min-height: 98px !important;
  }

  body.home-page .home-flow-card {
    padding-inline: 6px !important;
  }

  body.home-page .home-flow-grid p {
    display: none !important;
  }
}

/* Home flow journey: compact timeline layout with clearer tap feedback. */
body.home-page .home-flow-section.home-flow-journey {
  padding: clamp(40px, 5vw, 70px) 0 !important;
  background:
    linear-gradient(180deg, #fffdfb 0%, #fbf5f1 100%),
    radial-gradient(circle at 12% 16%, rgba(216, 189, 126, 0.12), transparent 34%) !important;
}

body.home-page .home-flow-section.home-flow-journey .container {
  display: grid !important;
  grid-template-columns: minmax(260px, 0.82fr) minmax(0, 1.18fr) !important;
  gap: clamp(24px, 5vw, 64px) !important;
  align-items: center !important;
}

body.home-page .home-flow-section.home-flow-journey .section-header {
  max-width: 440px !important;
  margin: 0 !important;
  text-align: left !important;
}

body.home-page .home-flow-section.home-flow-journey .section-header h2 {
  margin: 0 0 14px !important;
  font-size: clamp(34px, 5vw, 58px) !important;
  line-height: 0.98 !important;
  color: var(--ink) !important;
}

body.home-page .home-flow-section.home-flow-journey .section-header p {
  max-width: 34rem !important;
  margin: 0 !important;
  color: #5d5660 !important;
  font-size: 17px !important;
  line-height: 1.55 !important;
}

body.home-page .home-flow-cta {
  display: inline-flex !important;
  min-height: 44px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  margin-top: 24px !important;
  padding: 0 22px !important;
  border: 1px solid rgba(118, 84, 99, 0.28) !important;
  border-radius: 999px !important;
  background: #83556b !important;
  color: #fffdfb !important;
  box-shadow: 0 14px 28px rgba(118, 84, 99, 0.18) !important;
  font-weight: 850 !important;
  text-decoration: none !important;
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease !important;
}

body.home-page .home-flow-cta:hover,
body.home-page .home-flow-cta:focus-visible {
  background: #74485e !important;
  box-shadow: 0 18px 34px rgba(118, 84, 99, 0.22) !important;
  transform: translateY(-2px) !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-grid {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-grid::before {
  content: "" !important;
  position: absolute !important;
  top: 26px !important;
  bottom: 26px !important;
  left: 27px !important;
  width: 1px !important;
  background: linear-gradient(180deg, rgba(185, 151, 78, 0.22), rgba(118, 84, 99, 0.22)) !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-grid article {
  min-height: 0 !important;
  overflow: visible !important;
  border: 1px solid rgba(185, 151, 78, 0.22) !important;
  border-radius: 8px !important;
  background: rgba(255, 253, 251, 0.86) !important;
  box-shadow: 0 12px 30px rgba(64, 46, 56, 0.05) !important;
  text-align: left !important;
  transform: none !important;
  transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease, transform 180ms ease !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-grid article:hover {
  border-color: rgba(118, 84, 99, 0.35) !important;
  background: #fffaf6 !important;
  box-shadow: 0 18px 36px rgba(118, 84, 99, 0.1) !important;
  transform: translateX(4px) !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-grid article:has(.home-flow-card:focus-visible) {
  border-color: rgba(118, 84, 99, 0.48) !important;
  box-shadow: 0 0 0 3px rgba(118, 84, 99, 0.12), 0 18px 36px rgba(118, 84, 99, 0.1) !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-grid article:has(.home-flow-card:active) {
  transform: translateX(1px) scale(0.992) !important;
  background: #fbf2ea !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-card {
  position: relative !important;
  display: grid !important;
  min-height: 0 !important;
  grid-template-columns: 54px minmax(0, 1fr) auto !important;
  align-items: center !important;
  justify-items: stretch !important;
  gap: 16px !important;
  padding: 18px 20px 18px 0 !important;
  color: inherit !important;
  text-decoration: none !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-card::after {
  content: "→" !important;
  display: inline-flex !important;
  grid-column: 3 !important;
  grid-row: 1 / span 2 !important;
  align-self: center !important;
  width: 34px !important;
  height: 34px !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(185, 151, 78, 0.24) !important;
  border-radius: 999px !important;
  color: #83556b !important;
  font-weight: 850 !important;
  opacity: 0.72 !important;
  transition: transform 180ms ease, opacity 180ms ease, background 180ms ease !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-card:hover::after,
body.home-page .home-flow-section.home-flow-journey .home-flow-card:focus-visible::after {
  background: #fff !important;
  opacity: 1 !important;
  transform: translateX(3px) !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-card > span {
  position: relative !important;
  z-index: 1 !important;
  display: inline-flex !important;
  width: 34px !important;
  height: 34px !important;
  margin: 0 0 0 10px !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(185, 151, 78, 0.28) !important;
  border-radius: 999px !important;
  background: #fffdfb !important;
  color: #243e35 !important;
  box-shadow: 0 0 0 7px #fffdfb !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-grid article:first-child .home-flow-card > span {
  background: #83556b !important;
  color: #fffdfb !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-card strong {
  display: block !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  margin: 0 0 5px !important;
  color: #203832 !important;
  font-size: 17px !important;
  line-height: 1.18 !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-card p {
  grid-column: 2 !important;
  grid-row: 2 !important;
  max-width: none !important;
  margin: 0 !important;
  color: #655c64 !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
}

/* Home flow tablet layout: keep the process readable between phone and desktop widths. */
@media (min-width: 681px) and (max-width: 900px) {
  body.home-page .home-flow-section.home-flow-journey {
    padding: 34px 0 42px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .container {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .section-header {
    max-width: 620px !important;
    margin-inline: auto !important;
    text-align: center !important;
  }

  body.home-page .home-flow-section.home-flow-journey .section-header h2 {
    max-width: 18ch !important;
    margin-inline: auto !important;
    margin-bottom: 10px !important;
    font-size: clamp(34px, 5vw, 44px) !important;
    line-height: 1.03 !important;
    text-wrap: balance !important;
  }

  body.home-page .home-flow-section.home-flow-journey .section-header p {
    max-width: 46ch !important;
    margin-inline: auto !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-cta {
    min-width: 260px !important;
    margin-inline: auto !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-grid::before {
    display: none !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-grid article {
    min-height: 128px !important;
    border-radius: 8px !important;
    text-align: center !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-grid article:hover {
    transform: translateY(-2px) !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-grid article:has(.home-flow-card:active) {
    transform: translateY(0) scale(0.992) !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card {
    display: grid !important;
    grid-template-columns: 1fr !important;
    min-height: 128px !important;
    align-content: center !important;
    justify-items: center !important;
    gap: 7px !important;
    padding: 14px 12px !important;
    text-align: center !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card::after {
    display: none !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card > span,
  body.home-page .home-flow-section.home-flow-journey .home-flow-card strong,
  body.home-page .home-flow-section.home-flow-journey .home-flow-card p {
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card > span {
    width: 28px !important;
    height: 28px !important;
    margin: 0 0 2px !important;
    box-shadow: none !important;
    font-size: 12px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card strong {
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 1.14 !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card p {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    overflow: hidden !important;
    color: #655c64 !important;
    font-size: 11px !important;
    line-height: 1.25 !important;
    text-align: center !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
}

@media (min-width: 681px) {
  body.home-page .home-flow-section.home-flow-journey .flow-desktop-text {
    display: inline !important;
  }

  body.home-page .home-flow-section.home-flow-journey .flow-mobile-text {
    display: none !important;
  }
}

@media (max-width: 680px) {
  body.home-page .home-flow-section.home-flow-journey {
    padding: 32px 0 38px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .container {
    display: block !important;
  }

  body.home-page .home-flow-section.home-flow-journey .section-header {
    max-width: none !important;
    margin-bottom: 18px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .section-header h2 {
    max-width: 12ch !important;
    margin-bottom: 10px !important;
    font-size: 30px !important;
    line-height: 1.02 !important;
  }

  body.home-page .home-flow-section.home-flow-journey .section-header p {
    max-width: 31ch !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-cta {
    display: none !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-grid {
    gap: 9px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-grid::before {
    top: 23px !important;
    bottom: 23px !important;
    left: 24px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-grid article {
    border-radius: 8px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-grid article:hover {
    transform: none !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card {
    grid-template-columns: 48px minmax(0, 1fr) 28px !important;
    gap: 12px !important;
    padding: 13px 13px 13px 0 !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card::after {
    width: 28px !important;
    height: 28px !important;
    font-size: 13px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card > span {
    width: 28px !important;
    height: 28px !important;
    margin-left: 10px !important;
    box-shadow: 0 0 0 6px #fffdfb !important;
    font-size: 12px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card strong {
    margin-bottom: 3px !important;
    font-size: 13px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card p {
    max-width: none !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
  }
}

/* Home flow mobile text alignment: centered heading and single-line step notes. */
@media (max-width: 680px) {
  body.home-page .home-flow-section.home-flow-journey .section-header {
    text-align: center !important;
  }

  body.home-page .home-flow-section.home-flow-journey .section-header h2 {
    max-width: none !important;
    margin-inline: auto !important;
    text-align: center !important;
  }

  body.home-page .home-flow-section.home-flow-journey .section-header p {
    margin-inline: auto !important;
    text-align: center !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card p {
    max-width: none !important;
    font-size: 10px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 380px) {
  body.home-page .home-flow-section.home-flow-journey .home-flow-card p {
    font-size: 9.5px !important;
  }
}

/* Home flow mobile card grid: keep the four steps compact and centered. */
@media (max-width: 680px) {
  body.home-page .home-flow-section.home-flow-journey .home-flow-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-grid::before {
    display: none !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-grid article {
    min-height: 108px !important;
    border-radius: 8px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card {
    display: grid !important;
    grid-template-columns: 1fr !important;
    min-height: 108px !important;
    align-content: center !important;
    justify-items: center !important;
    gap: 5px !important;
    padding: 10px 8px !important;
    text-align: center !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card::after {
    display: none !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card > span {
    width: 24px !important;
    height: 24px !important;
    margin: 0 0 1px !important;
    box-shadow: none !important;
    font-size: 11px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card strong {
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.12 !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card p {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    overflow: visible !important;
    color: #655c64 !important;
    font-size: 10px !important;
    line-height: 1.2 !important;
    text-align: center !important;
    white-space: nowrap !important;
  }
}

/* Home flow tablet copy: use the concise step labels so every note reads cleanly. */
@media (min-width: 681px) and (max-width: 900px) {
  body.home-page .home-flow-section.home-flow-journey .home-flow-card .flow-desktop-text {
    display: none !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card .flow-mobile-text {
    display: inline !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card p {
    overflow: visible !important;
    text-overflow: clip !important;
  }
}

/* Home flow final layout: readable steps on desktop and compact rows on phones. */
body.home-page .home-flow-section.home-flow-journey {
  padding: clamp(42px, 5vw, 68px) 0 !important;
  background: linear-gradient(180deg, #fffdfb 0%, #fbf7f3 100%) !important;
}

body.home-page .home-flow-section.home-flow-journey .container {
  display: block !important;
}

body.home-page .home-flow-section.home-flow-journey .section-header {
  max-width: 720px !important;
  margin: 0 auto 28px !important;
  text-align: center !important;
}

body.home-page .home-flow-section.home-flow-journey .section-header h2 {
  max-width: 20ch !important;
  margin: 0 auto 10px !important;
  color: var(--ink) !important;
  font-size: clamp(34px, 4vw, 48px) !important;
  line-height: 1.08 !important;
  text-wrap: balance !important;
}

body.home-page .home-flow-section.home-flow-journey .section-header p {
  max-width: 58ch !important;
  margin: 0 auto !important;
  color: #5d5660 !important;
  font-size: 16px !important;
  line-height: 1.55 !important;
  text-align: center !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-cta {
  display: inline-flex !important;
  margin-top: 22px !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-grid::before {
  display: none !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-grid article {
  min-height: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(185, 151, 78, 0.24) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
  text-align: center !important;
  transform: none !important;
  transition: border-color 180ms ease, background 180ms ease, transform 180ms ease !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-grid article:hover {
  border-color: rgba(118, 84, 99, 0.38) !important;
  background: #fffaf7 !important;
  box-shadow: none !important;
  transform: translateY(-2px) !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-grid article:has(.home-flow-card:focus-visible) {
  border-color: rgba(118, 84, 99, 0.5) !important;
  box-shadow: 0 0 0 3px rgba(118, 84, 99, 0.12) !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-grid article:has(.home-flow-card:active) {
  transform: translateY(0) scale(0.992) !important;
  background: #fbf3ee !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-card {
  position: relative !important;
  display: flex !important;
  min-height: 174px !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 24px 18px !important;
  color: inherit !important;
  text-align: center !important;
  text-decoration: none !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-card::after {
  display: none !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-card > span {
  display: inline-flex !important;
  width: 34px !important;
  height: 34px !important;
  margin: 0 !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #efe7eb !important;
  color: #243e35 !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-grid article:first-child .home-flow-card > span {
  background: #83556b !important;
  color: #fff !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-card strong {
  display: block !important;
  margin: 0 !important;
  color: #203832 !important;
  font-size: 17px !important;
  line-height: 1.2 !important;
  text-align: center !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-card p {
  display: block !important;
  max-width: 22ch !important;
  margin: 0 auto !important;
  color: #5d5660 !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  text-align: center !important;
  white-space: normal !important;
}

@media (min-width: 681px) and (max-width: 980px) {
  body.home-page .home-flow-section.home-flow-journey .home-flow-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card {
    min-height: 148px !important;
    padding: 20px 18px !important;
  }
}

@media (max-width: 680px) {
  body.home-page .home-flow-section.home-flow-journey {
    padding: 34px 0 38px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .section-header {
    max-width: 440px !important;
    margin-bottom: 18px !important;
    text-align: left !important;
  }

  body.home-page .home-flow-section.home-flow-journey .section-header h2 {
    max-width: 14ch !important;
    margin: 0 0 10px !important;
    font-size: 31px !important;
    line-height: 1.05 !important;
    text-align: left !important;
  }

  body.home-page .home-flow-section.home-flow-journey .section-header p {
    max-width: 34ch !important;
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    text-align: left !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-cta {
    display: none !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-grid {
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-grid article {
    border-radius: 8px !important;
    text-align: left !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-grid article:hover {
    transform: none !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card {
    display: grid !important;
    min-height: 84px !important;
    grid-template-columns: 38px minmax(0, 1fr) 24px !important;
    grid-template-rows: auto auto !important;
    align-items: center !important;
    justify-content: stretch !important;
    gap: 4px 12px !important;
    padding: 14px 14px !important;
    text-align: left !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card::after {
    content: "→" !important;
    display: inline-flex !important;
    grid-column: 3 !important;
    grid-row: 1 / span 2 !important;
    width: 24px !important;
    height: 24px !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid rgba(185, 151, 78, 0.26) !important;
    border-radius: 999px !important;
    color: #83556b !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    opacity: 0.82 !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card > span {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    width: 30px !important;
    height: 30px !important;
    font-size: 13px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card strong {
    grid-column: 2 !important;
    grid-row: 1 !important;
    font-size: 15px !important;
    line-height: 1.18 !important;
    text-align: left !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card p {
    grid-column: 2 !important;
    grid-row: 2 !important;
    max-width: none !important;
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
    text-align: left !important;
    white-space: normal !important;
  }
}

@media (max-width: 380px) {
  body.home-page .home-flow-section.home-flow-journey .home-flow-card {
    min-height: 78px !important;
    gap: 3px 10px !important;
    padding: 12px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card strong {
    font-size: 14px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card p {
    font-size: 11px !important;
  }
}

/* Home flow centered interaction pass. */
body.home-page .home-flow-section.home-flow-journey .home-flow-grid article {
  background: #fff !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-card {
  transition: background 170ms ease, transform 170ms ease !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-card:active {
  transform: scale(0.988) !important;
  background: #fbf1f5 !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-card:focus-visible {
  outline: 3px solid rgba(118, 84, 99, 0.18) !important;
  outline-offset: -3px !important;
}

body.home-page .home-flow-section.home-flow-journey .home-flow-grid article:first-child .home-flow-card > span {
  background: #83556b !important;
  color: #fffdfb !important;
}

@media (hover: hover) and (pointer: fine) {
  body.home-page .home-flow-section.home-flow-journey .home-flow-grid article:hover {
    border-color: rgba(118, 84, 99, 0.42) !important;
    background: #fffaf7 !important;
    transform: translateY(-3px) !important;
  }
}

@media (max-width: 680px) {
  body.home-page .home-flow-section.home-flow-journey .section-header {
    max-width: 390px !important;
    margin: 0 auto 18px !important;
    text-align: center !important;
  }

  body.home-page .home-flow-section.home-flow-journey .section-header h2 {
    max-width: 15ch !important;
    margin: 0 auto 10px !important;
    text-align: center !important;
    text-wrap: balance !important;
  }

  body.home-page .home-flow-section.home-flow-journey .section-header p {
    max-width: 34ch !important;
    margin: 0 auto !important;
    text-align: center !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-grid article {
    background: #fff !important;
    text-align: center !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card {
    grid-template-columns: 38px minmax(0, 1fr) 30px !important;
    min-height: 84px !important;
    padding: 14px 12px !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card::after {
    width: 28px !important;
    height: 28px !important;
    border-color: rgba(118, 84, 99, 0.2) !important;
    background: #f7eff3 !important;
    color: #83556b !important;
    opacity: 1 !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card:active::after {
    background: #83556b !important;
    color: #fffdfb !important;
    transform: translateX(2px) !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card strong {
    justify-self: center !important;
    width: 100% !important;
    text-align: center !important;
  }

  body.home-page .home-flow-section.home-flow-journey .home-flow-card p {
    justify-self: center !important;
    width: 100% !important;
    max-width: 25ch !important;
    margin: 0 auto !important;
    text-align: center !important;
  }
}

/* Journal redesign: editorial browsing for dynamic WordPress posts. */
body.blog-page {
  background: #fffaf7 !important;
  color: #211b1f !important;
}

body.blog-page .journal-hero {
  padding: clamp(34px, 5vw, 58px) 0 26px !important;
  background: linear-gradient(180deg, #fffaf7 0%, #fbf5f0 100%) !important;
}

body.blog-page .journal-hero-panel {
  display: grid !important;
  grid-template-columns: minmax(0, 0.95fr) minmax(360px, 0.78fr) !important;
  gap: clamp(22px, 4vw, 52px) !important;
  align-items: center !important;
}

body.blog-page .journal-hero-copy {
  max-width: 620px !important;
}

body.blog-page .journal-kicker {
  display: inline-flex !important;
  margin-bottom: 14px !important;
  color: #765463 !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  letter-spacing: 0.02em !important;
}

body.blog-page .journal-hero h1,
body.blog-page .journal-section-head h2,
body.blog-page .journal-toolbar h2,
body.blog-page .journal-cta-panel h2 {
  margin: 0 !important;
  color: #211b1f !important;
  font-family: Georgia, "Times New Roman", "Songti SC", serif !important;
  font-weight: 500 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.05 !important;
  text-wrap: balance !important;
}

body.blog-page .journal-hero h1 {
  font-size: clamp(48px, 7vw, 84px) !important;
}

body.blog-page .journal-hero-copy p,
body.blog-page .journal-section-head p,
body.blog-page .journal-toolbar p,
body.blog-page .journal-cta-panel p {
  max-width: 62ch !important;
  margin: 12px 0 0 !important;
  color: #574b51 !important;
  font-size: 16px !important;
  line-height: 1.65 !important;
}

body.blog-page .journal-hero-actions,
body.blog-page .journal-cta-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 24px !important;
}

body.blog-page .journal-hero-media {
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(216, 189, 126, 0.44) !important;
  border-radius: 12px !important;
  background: #fff !important;
}

body.blog-page .journal-hero-media img {
  aspect-ratio: 4 / 3 !important;
  height: auto !important;
  object-fit: cover !important;
}

body.blog-page .journal-hero-media span {
  position: absolute !important;
  left: 14px !important;
  right: 14px !important;
  bottom: 14px !important;
  display: inline-flex !important;
  width: fit-content !important;
  max-width: calc(100% - 28px) !important;
  padding: 8px 12px !important;
  border: 1px solid rgba(255, 255, 255, 0.72) !important;
  border-radius: 999px !important;
  background: rgba(255, 253, 251, 0.9) !important;
  color: #765463 !important;
  font-size: 12px !important;
  font-weight: 850 !important;
}

body.blog-page .journal-feature-section,
body.blog-page .journal-list-section {
  background: #fffaf7 !important;
}

body.blog-page .journal-feature-section {
  padding-top: 30px !important;
}

body.blog-page .journal-list-section {
  padding-top: 16px !important;
}

body.blog-page .journal-section-head,
body.blog-page .journal-toolbar {
  display: flex !important;
  align-items: end !important;
  justify-content: space-between !important;
  gap: 20px !important;
  margin-bottom: 18px !important;
}

body.blog-page .journal-section-head h2,
body.blog-page .journal-toolbar h2,
body.blog-page .journal-cta-panel h2 {
  font-size: clamp(30px, 3vw, 44px) !important;
}

body.blog-page .journal-feature-grid {
  display: grid !important;
  gap: 16px !important;
}

body.blog-page .journal-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
  gap: 16px !important;
  margin-top: 0 !important;
}

body.blog-page .journal-card {
  overflow: hidden !important;
  border: 1px solid rgba(216, 189, 126, 0.42) !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: none !important;
  transition: border-color 180ms ease, background 180ms ease, transform 180ms ease !important;
}

body.blog-page .journal-card:hover,
body.blog-page .journal-card:focus-within {
  border-color: rgba(118, 84, 99, 0.38) !important;
  background: #fffdfb !important;
  transform: translateY(-3px) !important;
}

body.blog-page .journal-card a {
  display: grid !important;
  grid-template-rows: auto 1fr !important;
  min-height: 100% !important;
  color: inherit !important;
  text-decoration: none !important;
}

body.blog-page .journal-card-media {
  display: block !important;
  aspect-ratio: 1.35 / 1 !important;
  overflow: hidden !important;
  background: #fbf7f1 !important;
}

body.blog-page .journal-card-media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 240ms ease !important;
}

body.blog-page .journal-card:hover .journal-card-media img,
body.blog-page .journal-card:focus-within .journal-card-media img {
  transform: scale(1.035) !important;
}

body.blog-page .journal-card-body {
  display: flex !important;
  min-height: 138px !important;
  flex-direction: column !important;
  gap: 12px !important;
  padding: 18px !important;
}

body.blog-page .journal-card-meta {
  color: #765463 !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  letter-spacing: 0.01em !important;
}

body.blog-page .journal-card-body strong {
  color: #211b1f !important;
  font-size: 21px !important;
  line-height: 1.2 !important;
  text-wrap: balance !important;
}

body.blog-page .journal-card-body > span:not(.journal-card-meta):not(.journal-read-more) {
  display: none !important;
  color: #5c5360 !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
}

body.blog-page .journal-read-more {
  display: inline-flex !important;
  width: fit-content !important;
  align-items: center !important;
  gap: 6px !important;
  margin-top: auto !important;
  color: #765463 !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

body.blog-page .journal-read-more span {
  transition: transform 180ms ease !important;
}

body.blog-page .journal-card:hover .journal-read-more span,
body.blog-page .journal-card:focus-within .journal-read-more span {
  transform: translateX(3px) !important;
}

body.blog-page .journal-card a:focus-visible {
  outline: 3px solid rgba(118, 84, 99, 0.28) !important;
  outline-offset: -3px !important;
}

body.blog-page .journal-card--featured a {
  grid-template-columns: minmax(320px, 0.95fr) minmax(0, 1fr) !important;
  align-items: stretch !important;
}

body.blog-page .journal-card--featured .journal-card-media {
  aspect-ratio: auto !important;
  min-height: 360px !important;
}

body.blog-page .journal-card--featured .journal-card-body {
  align-content: center !important;
  padding: clamp(24px, 4vw, 44px) !important;
}

body.blog-page .journal-card--featured .journal-card-body strong {
  font-size: clamp(30px, 3.5vw, 48px) !important;
  line-height: 1.08 !important;
}

body.blog-page .journal-card--featured .journal-card-body > span:not(.journal-card-meta):not(.journal-read-more) {
  max-width: 58ch !important;
  font-size: 16px !important;
}

body.blog-page .journal-filter-bar {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}

body.blog-page .journal-filter-bar button {
  min-height: 38px !important;
  padding: 0 15px !important;
  border: 1px solid rgba(118, 84, 99, 0.24) !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #59424d !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  cursor: pointer !important;
  transition: background 170ms ease, border-color 170ms ease, color 170ms ease, transform 170ms ease !important;
}

body.blog-page .journal-filter-bar button:hover,
body.blog-page .journal-filter-bar button:focus-visible {
  border-color: rgba(118, 84, 99, 0.42) !important;
  background: #fff8f4 !important;
}

body.blog-page .journal-filter-bar button:active {
  transform: scale(0.97) !important;
}

body.blog-page .journal-filter-bar button.is-active {
  border-color: #765463 !important;
  background: #765463 !important;
  color: #fffaf7 !important;
}

body.blog-page .journal-empty {
  grid-column: 1 / -1 !important;
  display: grid !important;
  gap: 12px !important;
  justify-items: start !important;
  padding: 24px !important;
  border: 1px dashed rgba(118, 84, 99, 0.28) !important;
  border-radius: 10px !important;
  background: #fff !important;
}

body.blog-page .journal-empty strong {
  color: #211b1f !important;
  font-size: 20px !important;
}

body.blog-page .journal-empty p {
  max-width: 62ch !important;
  margin: 0 !important;
  color: #574b51 !important;
}

body.blog-page .journal-cta-section {
  background: #fff5f0 !important;
}

body.blog-page .journal-cta-panel {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
}

body.blog-page .journal-cta-panel > div:first-child {
  max-width: 620px !important;
}

@media (max-width: 820px) {
  body.blog-page .journal-hero-panel,
  body.blog-page .journal-card--featured a,
  body.blog-page .journal-cta-panel {
    grid-template-columns: 1fr !important;
    display: grid !important;
  }

  body.blog-page .journal-hero-copy,
  body.blog-page .journal-section-head,
  body.blog-page .journal-toolbar,
  body.blog-page .journal-cta-panel {
    text-align: center !important;
  }

  body.blog-page .journal-hero-copy {
    max-width: none !important;
  }

  body.blog-page .journal-hero-copy p,
  body.blog-page .journal-section-head p,
  body.blog-page .journal-toolbar p,
  body.blog-page .journal-cta-panel p {
    margin-inline: auto !important;
  }

  body.blog-page .journal-hero-actions,
  body.blog-page .journal-cta-actions {
    justify-content: center !important;
  }

  body.blog-page .journal-section-head,
  body.blog-page .journal-toolbar {
    display: grid !important;
    justify-items: center !important;
    align-items: start !important;
  }

  body.blog-page .journal-filter-bar {
    width: 100% !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    overflow-x: auto !important;
    padding: 0 0 4px !important;
    scrollbar-width: none !important;
  }

  body.blog-page .journal-filter-bar::-webkit-scrollbar {
    display: none !important;
  }

  body.blog-page .journal-card--featured .journal-card-media {
    aspect-ratio: 1.25 / 1 !important;
    min-height: 0 !important;
  }
}

@media (max-width: 560px) {
  body.blog-page .journal-hero {
    padding-top: 28px !important;
  }

  body.blog-page .journal-hero h1 {
    font-size: 46px !important;
  }

  body.blog-page .journal-hero-panel {
    gap: 18px !important;
  }

  body.blog-page .journal-hero-media span {
    left: 10px !important;
    right: 10px !important;
    bottom: 10px !important;
    max-width: calc(100% - 20px) !important;
    font-size: 11px !important;
  }

  body.blog-page .journal-feature-section,
  body.blog-page .journal-list-section,
  body.blog-page .journal-cta-section {
    padding-block: 28px !important;
  }

  body.blog-page .journal-card-body {
    padding: 16px !important;
  }

  body.blog-page .journal-card-body strong {
    font-size: 19px !important;
  }

  body.blog-page .journal-card--featured .journal-card-body strong {
    font-size: 28px !important;
  }

  body.blog-page .journal-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Journal featured sync: show up to three backend posts without oversized media. */
body.blog-page .journal-feature-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
  align-items: stretch !important;
}

body.blog-page .journal-card--featured a {
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-items: stretch !important;
}

body.blog-page .journal-card--featured .journal-card-media {
  aspect-ratio: 16 / 10 !important;
  min-height: 0 !important;
}

body.blog-page .journal-card--featured .journal-card-media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

body.blog-page .journal-card--featured .journal-card-body {
  align-content: start !important;
  padding: 18px !important;
  min-height: 150px !important;
}

body.blog-page .journal-card--featured .journal-card-body strong {
  font-size: 22px !important;
  line-height: 1.18 !important;
}

body.blog-page .journal-card--featured .journal-card-body > span:not(.journal-card-meta):not(.journal-read-more) {
  display: none !important;
  max-width: none !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
}

@media (max-width: 900px) {
  body.blog-page .journal-feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 560px) {
  body.blog-page .journal-feature-grid {
    grid-template-columns: 1fr !important;
  }

  body.blog-page .journal-card--featured .journal-card-media {
    aspect-ratio: 4 / 3 !important;
  }

  body.blog-page .journal-card--featured .journal-card-body strong {
    font-size: 20px !important;
  }

  body.blog-page .journal-card-body,
  body.blog-page .journal-card--featured .journal-card-body {
    min-height: 126px !important;
    gap: 10px !important;
    padding: 16px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.blog-page .journal-card,
  body.blog-page .journal-card-media img,
  body.blog-page .journal-read-more span {
    transition: none !important;
  }
}

/* Journal hero background: use the generated journal image as the full module backdrop. */
body.blog-page .journal-hero {
  position: relative !important;
  display: flex !important;
  min-height: clamp(420px, 42vw, 540px) !important;
  align-items: center !important;
  padding: clamp(54px, 7vw, 92px) 0 !important;
  overflow: hidden !important;
  background:
    linear-gradient(90deg, rgba(255, 250, 247, 0.94) 0%, rgba(255, 250, 247, 0.86) 42%, rgba(255, 250, 247, 0.46) 72%, rgba(255, 250, 247, 0.22) 100%),
    linear-gradient(180deg, rgba(255, 250, 247, 0.18), rgba(255, 250, 247, 0.34)),
    url("assets/journal-hero-20260710.png") center center / cover no-repeat !important;
}

body.blog-page .journal-hero::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(180deg, rgba(255, 250, 247, 0), rgba(255, 250, 247, 0.28)) !important;
  pointer-events: none !important;
}

body.blog-page .journal-hero-panel {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
}

body.blog-page .journal-hero-copy {
  max-width: 610px !important;
}

body.blog-page .journal-hero-media {
  display: none !important;
}

body.blog-page .journal-hero .journal-kicker {
  color: #765463 !important;
}

body.blog-page .journal-hero h1 {
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.42) !important;
}

body.blog-page .journal-hero-copy p {
  color: #4f4650 !important;
}

@media (max-width: 820px) {
  body.blog-page .journal-hero {
    min-height: 430px !important;
    align-items: center !important;
    padding: 34px 0 !important;
    background:
      linear-gradient(180deg, rgba(255, 250, 247, 0.96) 0%, rgba(255, 250, 247, 0.9) 52%, rgba(255, 250, 247, 0.68) 100%),
      url("assets/journal-hero-20260710.png") 56% 44% / cover no-repeat !important;
  }

  body.blog-page .journal-hero-panel,
  body.blog-page .journal-hero-copy {
    text-align: center !important;
  }

  body.blog-page .journal-hero-copy {
    max-width: 520px !important;
    margin-inline: auto !important;
    padding: 0 12px !important;
  }

  body.blog-page .journal-hero-copy p {
    margin-inline: auto !important;
  }

  body.blog-page .journal-hero-actions {
    justify-content: center !important;
    gap: 10px !important;
  }
}

@media (max-width: 560px) {
  body.blog-page .journal-hero {
    min-height: 312px !important;
    padding: 22px 0 24px !important;
    background:
      linear-gradient(180deg, rgba(255, 250, 247, 0.68) 0%, rgba(255, 250, 247, 0.5) 54%, rgba(255, 250, 247, 0.34) 100%),
      url("assets/journal-hero-20260710.png") 55% 48% / cover no-repeat !important;
  }

  body.blog-page .journal-hero::after {
    background: linear-gradient(180deg, rgba(255, 250, 247, 0.03), rgba(255, 250, 247, 0.12)) !important;
  }

  body.blog-page .journal-hero .journal-kicker {
    margin-bottom: 8px !important;
    font-size: 11px !important;
  }

  body.blog-page .journal-hero h1 {
    margin: 8px 0 8px !important;
    font-size: 36px !important;
    line-height: 0.98 !important;
    text-shadow: 0 1px 12px rgba(255, 250, 247, 0.82) !important;
  }

  body.blog-page .journal-hero-copy p {
    max-width: 31ch !important;
    font-size: 14px !important;
    line-height: 1.42 !important;
    text-shadow: 0 1px 10px rgba(255, 250, 247, 0.82) !important;
  }

  body.blog-page .journal-hero-actions {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    margin-top: 15px !important;
  }

  body.blog-page .journal-hero-actions .button {
    min-height: 38px !important;
    padding: 0 15px !important;
    font-size: 13px !important;
  }
}

@media (max-width: 430px) {
  body.blog-page .journal-hero {
    min-height: 300px !important;
  }

  body.blog-page .journal-hero h1 {
    font-size: 34px !important;
  }

  body.blog-page .journal-hero-actions {
    gap: 8px !important;
  }

  body.blog-page .journal-hero-actions .button {
    flex: 1 1 150px !important;
  }
}

/* Homepage journal entry: compact editorial bridge into the blog. */
body.home-page .home-journal-section {
  padding: clamp(40px, 5vw, 68px) 0 !important;
  background: #fffaf7 !important;
}

body.home-page .home-journal-panel {
  position: relative !important;
  display: block !important;
  overflow: hidden !important;
  min-height: clamp(380px, 38vw, 520px) !important;
  border: 1px solid rgba(214, 190, 151, 0.56) !important;
  border-radius: 8px !important;
  background: #2b2430 !important;
  color: #fffaf7 !important;
  text-decoration: none !important;
}

body.home-page .home-journal-panel::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background:
    radial-gradient(circle at 50% 52%, rgba(63, 45, 55, 0.42) 0%, rgba(63, 45, 55, 0.28) 38%, rgba(63, 45, 55, 0.08) 72%),
    linear-gradient(180deg, rgba(63, 45, 55, 0.06) 0%, rgba(63, 45, 55, 0.28) 100%) !important;
  pointer-events: none !important;
}

body.home-page .home-journal-copy {
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  min-height: clamp(380px, 38vw, 520px) !important;
  max-width: min(560px, 100%) !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  margin-inline: auto !important;
  padding: clamp(28px, 4vw, 48px) !important;
  text-align: center !important;
}

body.home-page .home-journal-label {
  display: block !important;
  color: rgba(255, 250, 247, 0.78) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

body.home-page .home-journal-copy h2 {
  margin: 12px auto 12px !important;
  max-width: 12ch !important;
  color: #fffaf7 !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(38px, 4.4vw, 56px) !important;
  line-height: 0.98 !important;
  letter-spacing: 0 !important;
  text-shadow: 0 2px 18px rgba(20, 16, 22, 0.22) !important;
  text-wrap: balance !important;
}

body.home-page .home-journal-copy p {
  max-width: 39ch !important;
  margin: 0 auto !important;
  color: rgba(255, 250, 247, 0.9) !important;
  font-size: clamp(16px, 1.4vw, 18px) !important;
  line-height: 1.65 !important;
  text-shadow: 0 1px 14px rgba(20, 16, 22, 0.24) !important;
  text-wrap: pretty !important;
}

body.home-page .home-journal-button {
  display: inline-flex !important;
  min-height: 44px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin-top: 24px !important;
  margin-inline: auto !important;
  padding: 0 22px !important;
  border-radius: 999px !important;
  background: #fffaf7 !important;
  color: #765463 !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  transition: background-color 180ms ease, transform 180ms ease !important;
}

body.home-page .home-journal-button span {
  transition: transform 180ms ease !important;
}

body.home-page .home-journal-media {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  display: block !important;
  min-height: 100% !important;
  overflow: hidden !important;
  background: #2b2430 !important;
}

body.home-page .home-journal-media img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  transform: scale(1.001) !important;
  transition: transform 420ms ease !important;
}

body.home-page .home-journal-panel:hover .home-journal-media img {
  transform: scale(1.025) !important;
}

body.home-page .home-journal-panel:hover .home-journal-button,
body.home-page .home-journal-panel:focus-visible .home-journal-button {
  background: #f4e6ee !important;
}

body.home-page .home-journal-panel:hover .home-journal-button span {
  transform: translateX(3px) !important;
}

body.home-page .home-journal-panel:focus-visible {
  outline: 3px solid rgba(118, 84, 99, 0.28) !important;
  outline-offset: 4px !important;
}

@media (max-width: 820px) {
  body.home-page .home-journal-panel {
    min-height: 500px !important;
  }

  body.home-page .home-journal-panel::before {
    background:
      radial-gradient(circle at 50% 50%, rgba(63, 45, 55, 0.44) 0%, rgba(63, 45, 55, 0.3) 42%, rgba(63, 45, 55, 0.1) 78%),
      linear-gradient(180deg, rgba(63, 45, 55, 0.06) 0%, rgba(63, 45, 55, 0.34) 100%) !important;
  }

  body.home-page .home-journal-media {
    min-height: 100% !important;
  }

  body.home-page .home-journal-copy {
    min-height: 500px !important;
    max-width: none !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 36px 24px !important;
    text-align: center !important;
  }

  body.home-page .home-journal-copy h2 {
    max-width: none !important;
    margin-inline: auto !important;
    font-size: clamp(30px, 8vw, 40px) !important;
    white-space: nowrap !important;
  }

  body.home-page .home-journal-copy p {
    max-width: 31ch !important;
    margin-inline: auto !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
  }

  body.home-page .home-journal-button {
    margin-inline: auto !important;
  }
}

@media (max-width: 520px) {
  body.home-page .home-journal-section {
    padding: 34px 0 !important;
  }

  body.home-page .home-journal-panel {
    min-height: 460px !important;
  }

  body.home-page .home-journal-copy {
    min-height: 460px !important;
  }

  body.home-page .home-journal-copy h2 {
    font-size: clamp(30px, 7.8vw, 36px) !important;
  }

  body.home-page .home-journal-button {
    width: 100% !important;
    max-width: 240px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.home-page .home-journal-media img,
  body.home-page .home-journal-button,
  body.home-page .home-journal-button span {
    transition: none !important;
  }
}

/* Unified storefront navigation v1: keep header buttons identical across pages. */
.site-header .container.nav,
.site-header .nav {
  min-height: 68px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
}

.site-header .brand {
  flex: 0 0 auto !important;
}

.site-header .brand-logo {
  display: block !important;
  width: clamp(126px, 13vw, 184px) !important;
  height: auto !important;
}

.site-header .nav-links,
body.home-page .site-header .nav-links,
body.customizer-page .site-header .nav-links,
body.designer-page .site-header .nav-links,
body.cart-page .site-header .nav-links {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  min-height: 50px !important;
  width: auto !important;
  max-width: min(100%, calc(100vw - 260px)) !important;
  margin-left: auto !important;
  padding: 5px 7px !important;
  border: 1px solid rgba(185, 151, 78, 0.26) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.78) !important;
  box-shadow: 0 10px 26px rgba(92, 63, 77, 0.08) !important;
  overflow: visible !important;
}

.site-header .nav-links a:not(.button),
body.home-page .site-header .nav-links a:not(.button),
body.customizer-page .site-header .nav-links a:not(.button),
body.designer-page .site-header .nav-links a:not(.button),
body.cart-page .site-header .nav-links a:not(.button) {
  flex: 0 0 auto !important;
  min-width: 0 !important;
  min-height: 40px !important;
  height: 40px !important;
  padding: 0 18px !important;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #16352e !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  text-decoration: none !important;
}

.site-header .nav-links a:not(.button):hover,
.site-header .nav-links a:not(.button):focus-visible {
  background: rgba(118, 84, 99, 0.09) !important;
  color: var(--vl-rosewood, #765463) !important;
}

.site-header .nav-links a[aria-current="page"]:not(.nav-cart-icon),
body.home-page .site-header .nav-links a[aria-current="page"],
body.customizer-page .site-header .nav-links a[aria-current="page"],
body.designer-page .site-header .nav-links a[aria-current="page"],
body.cart-page .site-header .nav-links a[aria-current="page"] {
  border-color: transparent !important;
  background: #765463 !important;
  color: #fffdf8 !important;
  box-shadow: 0 10px 18px rgba(118, 84, 99, 0.16) !important;
}

.site-header .nav-links a.nav-cart-icon,
.site-header .nav-links a.nav-account-icon,
.site-header .nav-links a.nav-orders-link.nav-account-icon {
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  border: 1px solid rgba(185, 151, 78, 0.34) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  color: var(--vl-rosewood, #765463) !important;
  box-shadow: none !important;
}

.site-header .nav-links a.nav-cart-icon:hover,
.site-header .nav-links a.nav-cart-icon:focus-visible,
.site-header .nav-links a.nav-account-icon:hover,
.site-header .nav-links a.nav-account-icon:focus-visible {
  background: rgba(118, 84, 99, 0.09) !important;
  color: var(--vl-rosewood-hover, #654655) !important;
}

.site-header .nav-links a.nav-cart-icon[aria-current="page"] {
  background: #765463 !important;
  color: #fffdf8 !important;
}

.site-header .nav-links a.nav-cart-icon svg,
.site-header .nav-links a.nav-account-icon svg,
.site-header .nav-links a.nav-orders-link.nav-account-icon svg {
  width: 21px !important;
  height: 21px !important;
  display: block !important;
  flex: 0 0 auto !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.site-header .nav-links a.nav-cart-icon svg circle,
.site-header .nav-links a.nav-cart-icon svg path,
.site-header .nav-links a.nav-account-icon svg circle,
.site-header .nav-links a.nav-account-icon svg path,
.site-header .nav-links a.nav-orders-link.nav-account-icon svg circle,
.site-header .nav-links a.nav-orders-link.nav-account-icon svg path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.site-header .nav-links a.nav-cart-icon::before,
.site-header .nav-links a.nav-cart-icon::after,
.site-header .nav-links .nav-cart-label,
.site-header .nav-links .cart-badge {
  display: none !important;
}

@media (max-width: 900px) {
  .site-header .container.nav,
  .site-header .nav {
    min-height: 68px !important;
    gap: 14px !important;
    padding-inline: 20px !important;
  }

  .site-header .brand-logo {
    width: clamp(88px, 18vw, 126px) !important;
  }

  .site-header .nav-links,
  body.home-page .site-header .nav-links,
  body.customizer-page .site-header .nav-links,
  body.designer-page .site-header .nav-links,
  body.cart-page .site-header .nav-links {
    gap: 4px !important;
    min-height: 46px !important;
    max-width: calc(100vw - 150px) !important;
    padding: 4px !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
  }

  .site-header .nav-links::-webkit-scrollbar {
    display: none !important;
  }

  .site-header .nav-links a:not(.button),
  body.home-page .site-header .nav-links a:not(.button),
  body.customizer-page .site-header .nav-links a:not(.button),
  body.designer-page .site-header .nav-links a:not(.button),
  body.cart-page .site-header .nav-links a:not(.button) {
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 13px !important;
    font-size: 11px !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
  }
}

@media (max-width: 520px) {
  .site-header .container.nav,
  .site-header .nav {
    gap: 8px !important;
    padding-inline: 14px !important;
  }

  .site-header .brand-logo {
    width: 74px !important;
  }

  .site-header .nav-links,
  body.home-page .site-header .nav-links,
  body.customizer-page .site-header .nav-links,
  body.designer-page .site-header .nav-links,
  body.cart-page .site-header .nav-links {
    max-width: calc(100vw - 106px) !important;
  }

  .site-header .nav-links a:not(.button),
  body.home-page .site-header .nav-links a:not(.button),
  body.customizer-page .site-header .nav-links a:not(.button),
  body.designer-page .site-header .nav-links a:not(.button),
  body.cart-page .site-header .nav-links a:not(.button) {
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 10px !important;
    font-size: 10px !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
  }
}

/* Compact storefront navigation: keep all labels visible at tablet/narrow desktop widths. */
@media (max-width: 960px) {
  .site-header .container.nav,
  .site-header .nav,
  body.home-page .site-header .container.nav,
  body.customizer-page .site-header .container.nav,
  body.designer-page .site-header .container.nav,
  body.cart-page .site-header .container.nav {
    gap: 14px !important;
    padding-inline: 16px !important;
  }

  .site-header .brand,
  body.home-page .site-header .brand,
  body.customizer-page .site-header .brand,
  body.designer-page .site-header .brand,
  body.cart-page .site-header .brand {
    flex: 0 1 168px !important;
    min-width: 132px !important;
  }

  .site-header .brand-logo,
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: clamp(132px, 17vw, 158px) !important;
    max-width: 100% !important;
  }

  .site-header .nav-links,
  body.home-page .site-header .nav-links,
  body.customizer-page .site-header .nav-links,
  body.designer-page .site-header .nav-links,
  body.cart-page .site-header .nav-links {
    gap: 4px !important;
    min-height: 44px !important;
    padding: 3px 5px !important;
    max-width: none !important;
  }

  .site-header .nav-links a:not(.button),
  body.home-page .site-header .nav-links a:not(.button),
  body.customizer-page .site-header .nav-links a:not(.button),
  body.designer-page .site-header .nav-links a:not(.button),
  body.cart-page .site-header .nav-links a:not(.button) {
    height: 36px !important;
    min-height: 36px !important;
    padding-inline: 12px !important;
    font-size: 11px !important;
    letter-spacing: 0.07em !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
  }
}

@media (max-width: 820px) {
  .site-header .container.nav,
  .site-header .nav,
  body.home-page .site-header .container.nav,
  body.customizer-page .site-header .container.nav,
  body.designer-page .site-header .container.nav,
  body.cart-page .site-header .container.nav {
    width: 100% !important;
    min-height: 68px !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    padding-inline: 14px !important;
  }

  .site-header .brand,
  body.home-page .site-header .brand,
  body.customizer-page .site-header .brand,
  body.designer-page .site-header .brand,
  body.cart-page .site-header .brand {
    flex: 0 1 140px !important;
    min-width: 100px !important;
  }

  .site-header .brand-logo,
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: clamp(104px, 17vw, 132px) !important;
    max-width: 100% !important;
  }

  .site-header .nav-links,
  body.home-page .site-header .nav-links,
  body.customizer-page .site-header .nav-links,
  body.designer-page .site-header .nav-links,
  body.cart-page .site-header .nav-links {
    flex: 1 1 auto !important;
    justify-content: flex-end !important;
    gap: 3px !important;
    min-width: 0 !important;
    max-width: none !important;
    overflow: visible !important;
    padding: 4px !important;
  }

  .site-header .nav-links a:not(.button),
  body.home-page .site-header .nav-links a:not(.button),
  body.customizer-page .site-header .nav-links a:not(.button),
  body.designer-page .site-header .nav-links a:not(.button),
  body.cart-page .site-header .nav-links a:not(.button) {
    height: 38px !important;
    min-height: 38px !important;
    padding-inline: clamp(8px, 1.25vw, 12px) !important;
    font-size: 10.5px !important;
    letter-spacing: 0.065em !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
  }

  .site-header .nav-links a.nav-cart-icon svg,
  .site-header .nav-links a.nav-account-icon svg,
  .site-header .nav-links a.nav-orders-link.nav-account-icon svg {
    width: 19px !important;
    height: 19px !important;
  }
}

@media (max-width: 640px) {
  .site-header .container.nav,
  .site-header .nav,
  body.home-page .site-header .container.nav,
  body.customizer-page .site-header .container.nav,
  body.designer-page .site-header .container.nav,
  body.cart-page .site-header .container.nav {
    gap: 7px !important;
    padding-inline: 10px !important;
  }

  .site-header .brand,
  body.home-page .site-header .brand,
  body.customizer-page .site-header .brand,
  body.designer-page .site-header .brand,
  body.cart-page .site-header .brand {
    flex-basis: 96px !important;
    min-width: 78px !important;
  }

  .site-header .brand-logo,
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: 82px !important;
  }

  .site-header .nav-links,
  body.home-page .site-header .nav-links,
  body.customizer-page .site-header .nav-links,
  body.designer-page .site-header .nav-links,
  body.cart-page .site-header .nav-links {
    gap: 2px !important;
    min-height: 42px !important;
    padding: 3px !important;
  }

  .site-header .nav-links a:not(.button),
  body.home-page .site-header .nav-links a:not(.button),
  body.customizer-page .site-header .nav-links a:not(.button),
  body.designer-page .site-header .nav-links a:not(.button),
  body.cart-page .site-header .nav-links a:not(.button) {
    height: 34px !important;
    min-height: 34px !important;
    padding-inline: 7px !important;
    font-size: 9.5px !important;
    letter-spacing: 0.05em !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
  }
}

/* Mobile nav fit repair - 2026-07-12
   Keep full labels visible by giving navigation its own row on narrow screens. */
@media (max-width: 560px) {
  :root {
    --header-height: 108px;
  }

  .site-header .container.nav,
  .site-header .nav,
  body.home-page .site-header .container.nav,
  body.customizer-page .site-header .container.nav,
  body.designer-page .site-header .container.nav,
  body.cart-page .site-header .container.nav {
    width: 100% !important;
    min-height: 108px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "brand"
      "links" !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 10px 10px !important;
  }

  .site-header .brand,
  body.home-page .site-header .brand,
  body.customizer-page .site-header .brand,
  body.designer-page .site-header .brand,
  body.cart-page .site-header .brand {
    grid-area: brand !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 34px !important;
    flex: 1 1 auto !important;
    overflow: hidden !important;
  }

  .site-header .brand-logo,
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    content: normal !important;
    width: 112px !important;
    height: auto !important;
    max-width: 112px !important;
    max-height: 34px !important;
    object-fit: contain !important;
  }

  .site-header .nav-links,
  body.home-page .site-header .nav-links,
  body.customizer-page .site-header .nav-links,
  body.designer-page .site-header .nav-links,
  body.cart-page .site-header .nav-links {
    grid-area: links !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    align-items: center !important;
    justify-content: stretch !important;
    gap: 3px !important;
    padding: 3px !important;
    overflow: hidden !important;
  }

  .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 4px !important;
    overflow: hidden !important;
    color: #1f3029 !important;
    font-size: clamp(8px, 2.2vw, 10px) !important;
    letter-spacing: 0.04em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }

  .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon)::after {
    content: none !important;
    display: none !important;
  }

  .site-header .nav-links a[aria-current="page"]:not(.nav-cart-icon) {
    color: #fffaf6 !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    flex: 0 0 34px !important;
    padding: 0 !important;
  }

  .site-header .nav-links a.nav-cart-icon svg,
  .site-header .nav-links a.nav-account-icon svg,
  .site-header .nav-links a.nav-orders-link.nav-account-icon svg {
    width: 18px !important;
    height: 18px !important;
  }
}

@media (max-width: 390px) {
  .site-header .container.nav,
  .site-header .nav {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 6px !important;
    padding-inline: 8px !important;
  }

  .site-header .brand,
  body.home-page .site-header .brand,
  body.customizer-page .site-header .brand,
  body.designer-page .site-header .brand,
  body.cart-page .site-header .brand {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  .site-header .brand-logo,
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: 96px !important;
    height: auto !important;
    max-width: 96px !important;
    max-height: 30px !important;
  }

  .site-header .nav-links,
  body.home-page .site-header .nav-links,
  body.customizer-page .site-header .nav-links,
  body.designer-page .site-header .nav-links,
  body.cart-page .site-header .nav-links {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 2px !important;
    padding: 2px !important;
  }

  .site-header .nav-links a:not(.button):not(.nav-cart-icon):not(.nav-account-icon) {
    font-size: 7.4px !important;
    letter-spacing: 0.015em !important;
    padding-inline: 2px !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    width: 31px !important;
    min-width: 31px !important;
    max-width: 31px !important;
    height: 31px !important;
    min-height: 31px !important;
  }
}

/* Final mobile nav: one row, full labels, proportional shrink. */
@media (max-width: 560px) {
  :root {
    --header-height: 58px;
  }

  .site-header .container.nav,
  .site-header .nav,
  body.home-page .site-header .container.nav,
  body.customizer-page .site-header .container.nav,
  body.designer-page .site-header .container.nav,
  body.cart-page .site-header .container.nav {
    position: relative !important;
    width: 100% !important;
    min-height: 58px !important;
    display: grid !important;
    grid-template-columns: clamp(54px, 15.5vw, 82px) minmax(0, 1fr) !important;
    grid-template-rows: 42px !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 8px 8px !important;
  }

  .site-header .brand,
  body.home-page .site-header .brand,
  body.customizer-page .site-header .brand,
  body.designer-page .site-header .brand,
  body.cart-page .site-header .brand {
    grid-area: auto !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 32px !important;
    overflow: hidden !important;
  }

  .site-header .brand-logo,
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    content: normal !important;
    width: 100% !important;
    max-width: 82px !important;
    max-height: 30px !important;
    object-fit: contain !important;
    object-position: left center !important;
  }

  .site-header .nav-links,
  body.home-page .site-header .nav-links,
  body.customizer-page .site-header .nav-links,
  body.designer-page .site-header .nav-links,
  body.cart-page .site-header .nav-links {
    grid-area: auto !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 42px !important;
    min-height: 42px !important;
    display: grid !important;
    grid-template-columns: minmax(48px, 1fr) minmax(54px, 1.05fr) minmax(60px, 1.15fr) minmax(42px, .9fr) 31px 31px !important;
    align-items: center !important;
    gap: 2px !important;
    padding: 3px !important;
    overflow: hidden !important;
  }

  .site-header .nav-links a[href="index.html"],
  .site-header .nav-links a[href="customizer.html"],
  .site-header .nav-links a[href="designer.html"],
  .site-header .nav-links a[href="blog.html"] {
    grid-area: auto !important;
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 2px !important;
    overflow: hidden !important;
    color: #1f3029 !important;
    font-size: clamp(6.7px, 1.65vw, 8.8px) !important;
    font-weight: 900 !important;
    letter-spacing: 0.01em !important;
    line-height: 1 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }

  .site-header .nav-links a[href="index.html"]::after,
  .site-header .nav-links a[href="customizer.html"]::after,
  .site-header .nav-links a[href="designer.html"]::after,
  .site-header .nav-links a[href="blog.html"]::after {
    content: none !important;
    display: none !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    grid-area: auto !important;
    position: static !important;
    width: 31px !important;
    min-width: 31px !important;
    max-width: 31px !important;
    height: 31px !important;
    min-height: 31px !important;
    padding: 0 !important;
  }

  .site-header .nav-links a.nav-cart-icon svg,
  .site-header .nav-links a.nav-account-icon svg,
  .site-header .nav-links a.nav-orders-link.nav-account-icon svg {
    width: 17px !important;
    height: 17px !important;
  }
}

@media (max-width: 390px) {
  .site-header .container.nav,
  .site-header .nav,
  body.home-page .site-header .container.nav,
  body.customizer-page .site-header .container.nav,
  body.designer-page .site-header .container.nav,
  body.cart-page .site-header .container.nav {
    grid-template-columns: clamp(42px, 13.5vw, 52px) minmax(0, 1fr) !important;
    gap: 4px !important;
    padding-inline: 6px !important;
  }

  .site-header .nav-links,
  body.home-page .site-header .nav-links,
  body.customizer-page .site-header .nav-links,
  body.designer-page .site-header .nav-links,
  body.cart-page .site-header .nav-links {
    grid-template-columns: minmax(43px, 1fr) minmax(49px, 1.08fr) minmax(54px, 1.16fr) minmax(38px, .9fr) 28px 28px !important;
    gap: 1px !important;
    padding: 2px !important;
  }

  .site-header .nav-links a[href="index.html"],
  .site-header .nav-links a[href="customizer.html"],
  .site-header .nav-links a[href="designer.html"],
  .site-header .nav-links a[href="blog.html"] {
    font-size: clamp(6px, 1.55vw, 7.4px) !important;
    padding-inline: 1px !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    width: 28px !important;
    min-width: 28px !important;
    max-width: 28px !important;
    height: 28px !important;
    min-height: 28px !important;
  }
}

/* Final mobile nav text fit: keep full labels in one proportional row. */
@media (max-width: 560px) {
  .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon) {
    font-size: clamp(6.7px, 1.65vw, 8.8px) !important;
    letter-spacing: 0 !important;
    padding-inline: 1px !important;
  }
}

@media (max-width: 390px) {
  .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon) {
    font-size: clamp(6.8px, 1.8vw, 7.2px) !important;
  }
}

/* Mobile nav desktop-parity: same interaction, proportionally scaled. */
@media (max-width: 560px) {
  .site-header .container.nav,
  .site-header .nav,
  body.home-page .site-header .container.nav,
  body.customizer-page .site-header .container.nav,
  body.designer-page .site-header .container.nav,
  body.cart-page .site-header .container.nav {
    grid-template-columns: clamp(84px, 20vw, 104px) minmax(0, 1fr) !important;
    gap: 4px !important;
    padding-inline: 7px !important;
  }

  .site-header .brand,
  body.home-page .site-header .brand,
  body.customizer-page .site-header .brand,
  body.designer-page .site-header .brand,
  body.cart-page .site-header .brand {
    width: 100% !important;
    height: 34px !important;
    overflow: visible !important;
  }

  .site-header .brand-logo,
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    width: 100% !important;
    max-width: 104px !important;
    max-height: 28px !important;
  }

  .site-header .nav-links,
  body.home-page .site-header .nav-links,
  body.customizer-page .site-header .nav-links,
  body.designer-page .site-header .nav-links,
  body.cart-page .site-header .nav-links {
    grid-template-columns: minmax(48px, 1fr) minmax(53px, 1.08fr) minmax(62px, 1.22fr) minmax(42px, .92fr) 29px 29px !important;
    height: 42px !important;
    min-height: 42px !important;
    gap: 2px !important;
    padding: 3px !important;
    border: 1px solid rgba(36, 62, 53, 0.12) !important;
    border-radius: 999px !important;
    background: rgba(251, 250, 247, 0.72) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
  }

  .site-header .nav-links a[href="index.html"],
  .site-header .nav-links a[href="customizer.html"],
  .site-header .nav-links a[href="designer.html"],
  .site-header .nav-links a[href="blog.html"] {
    height: 34px !important;
    min-height: 34px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #2d342f !important;
    font-size: clamp(6.4px, 1.55vw, 7.7px) !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
    padding-inline: 1px !important;
    transition:
      background 160ms ease,
      color 160ms ease,
      box-shadow 160ms ease,
      transform 160ms ease !important;
  }

  .site-header .nav-links a[href="index.html"]:hover,
  .site-header .nav-links a[href="customizer.html"]:hover,
  .site-header .nav-links a[href="designer.html"]:hover,
  .site-header .nav-links a[href="blog.html"]:hover {
    background: rgba(185, 151, 78, 0.13) !important;
    color: #172a24 !important;
    transform: translateY(-1px) !important;
  }

  .site-header .nav-links a[href="index.html"]:active,
  .site-header .nav-links a[href="customizer.html"]:active,
  .site-header .nav-links a[href="designer.html"]:active,
  .site-header .nav-links a[href="blog.html"]:active {
    transform: translateY(1px) !important;
  }

  .site-header .nav-links a[href="index.html"]:focus-visible,
  .site-header .nav-links a[href="customizer.html"]:focus-visible,
  .site-header .nav-links a[href="designer.html"]:focus-visible,
  .site-header .nav-links a[href="blog.html"]:focus-visible {
    outline: 0 !important;
    box-shadow:
      0 0 0 2px #fbfaf7,
      0 0 0 4px rgba(185, 151, 78, 0.5) !important;
  }

  .site-header .nav-links a[href="index.html"][aria-current="page"],
  .site-header .nav-links a[href="customizer.html"][aria-current="page"],
  .site-header .nav-links a[href="designer.html"][aria-current="page"],
  .site-header .nav-links a[href="blog.html"][aria-current="page"],
  body.home-page .site-header .nav-links a[href="index.html"][aria-current="page"],
  body.home-page .site-header .nav-links a[href="customizer.html"][aria-current="page"],
  body.home-page .site-header .nav-links a[href="designer.html"][aria-current="page"],
  body.home-page .site-header .nav-links a[href="blog.html"][aria-current="page"],
  body.customizer-page .site-header .nav-links a[href="index.html"][aria-current="page"],
  body.customizer-page .site-header .nav-links a[href="customizer.html"][aria-current="page"],
  body.customizer-page .site-header .nav-links a[href="designer.html"][aria-current="page"],
  body.customizer-page .site-header .nav-links a[href="blog.html"][aria-current="page"],
  body.designer-page .site-header .nav-links a[href="index.html"][aria-current="page"],
  body.designer-page .site-header .nav-links a[href="customizer.html"][aria-current="page"],
  body.designer-page .site-header .nav-links a[href="designer.html"][aria-current="page"],
  body.designer-page .site-header .nav-links a[href="blog.html"][aria-current="page"],
  body.cart-page .site-header .nav-links a[href="index.html"][aria-current="page"],
  body.cart-page .site-header .nav-links a[href="customizer.html"][aria-current="page"],
  body.cart-page .site-header .nav-links a[href="designer.html"][aria-current="page"],
  body.cart-page .site-header .nav-links a[href="blog.html"][aria-current="page"] {
    background: #243e35 !important;
    background-color: #243e35 !important;
    background-image: none !important;
    color: #fbfaf7 !important;
    box-shadow: 0 4px 10px rgba(36, 62, 53, 0.14) !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    width: 29px !important;
    min-width: 29px !important;
    max-width: 29px !important;
    height: 29px !important;
    min-height: 29px !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}

@media (max-width: 390px) {
  .site-header .container.nav,
  .site-header .nav,
  body.home-page .site-header .container.nav,
  body.customizer-page .site-header .container.nav,
  body.designer-page .site-header .container.nav,
  body.cart-page .site-header .container.nav {
    grid-template-columns: clamp(64px, 17vw, 74px) minmax(0, 1fr) !important;
    gap: 3px !important;
    padding-inline: 5px !important;
  }

  .site-header .brand-logo,
  .brand-logo,
  body.home-page .brand-logo,
  body.customizer-page .brand-logo,
  body.designer-page .brand-logo,
  body.cart-page .brand-logo {
    max-height: 24px !important;
  }

  .site-header .nav-links,
  body.home-page .site-header .nav-links,
  body.customizer-page .site-header .nav-links,
  body.designer-page .site-header .nav-links,
  body.cart-page .site-header .nav-links {
    grid-template-columns: minmax(43px, 1fr) minmax(48px, 1.08fr) minmax(56px, 1.22fr) minmax(38px, .9fr) 26px 26px !important;
    gap: 1px !important;
    padding: 2px !important;
  }

  .site-header .nav-links a[href="index.html"],
  .site-header .nav-links a[href="customizer.html"],
  .site-header .nav-links a[href="designer.html"],
  .site-header .nav-links a[href="blog.html"] {
    font-size: clamp(6.2px, 1.7vw, 6.8px) !important;
  }

  .site-header .nav-links a.nav-cart-icon,
  .site-header .nav-links a.nav-account-icon,
  .site-header .nav-links a.nav-orders-link.nav-account-icon {
    width: 26px !important;
    min-width: 26px !important;
    max-width: 26px !important;
    height: 26px !important;
    min-height: 26px !important;
  }

  .site-header .nav-links a.nav-cart-icon svg,
  .site-header .nav-links a.nav-account-icon svg,
  .site-header .nav-links a.nav-orders-link.nav-account-icon svg {
    width: 16px !important;
    height: 16px !important;
  }
}

/* Mobile nav final parity: desktop interaction and copy, scaled down only. */
@media (max-width: 560px) {
  .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon) {
    border-color: transparent !important;
    background: transparent !important;
    background-color: transparent !important;
    color: #16352e !important;
    box-shadow: none !important;
    font-size: clamp(6.4px, 1.55vw, 7.7px) !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
  }

  .site-header .nav-links a[href="index.html"][aria-current="page"]:not(.nav-cart-icon),
  .site-header .nav-links a[href="customizer.html"][aria-current="page"]:not(.nav-cart-icon),
  .site-header .nav-links a[href="designer.html"][aria-current="page"]:not(.nav-cart-icon),
  .site-header .nav-links a[href="blog.html"][aria-current="page"]:not(.nav-cart-icon),
  body.home-page .site-header .nav-links a[href="index.html"][aria-current="page"],
  body.home-page .site-header .nav-links a[href="customizer.html"][aria-current="page"],
  body.home-page .site-header .nav-links a[href="designer.html"][aria-current="page"],
  body.home-page .site-header .nav-links a[href="blog.html"][aria-current="page"],
  body.customizer-page .site-header .nav-links a[href="index.html"][aria-current="page"],
  body.customizer-page .site-header .nav-links a[href="customizer.html"][aria-current="page"],
  body.customizer-page .site-header .nav-links a[href="designer.html"][aria-current="page"],
  body.customizer-page .site-header .nav-links a[href="blog.html"][aria-current="page"],
  body.designer-page .site-header .nav-links a[href="index.html"][aria-current="page"],
  body.designer-page .site-header .nav-links a[href="customizer.html"][aria-current="page"],
  body.designer-page .site-header .nav-links a[href="designer.html"][aria-current="page"],
  body.designer-page .site-header .nav-links a[href="blog.html"][aria-current="page"],
  body.cart-page .site-header .nav-links a[href="index.html"][aria-current="page"],
  body.cart-page .site-header .nav-links a[href="customizer.html"][aria-current="page"],
  body.cart-page .site-header .nav-links a[href="designer.html"][aria-current="page"],
  body.cart-page .site-header .nav-links a[href="blog.html"][aria-current="page"] {
    border-color: transparent !important;
    background: #765463 !important;
    background-color: #765463 !important;
    background-image: none !important;
    color: #fffdf8 !important;
    box-shadow: 0 6px 12px rgba(118, 84, 99, 0.16) !important;
  }
}

@media (max-width: 390px) {
  .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="index.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="customizer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="designer.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[href="blog.html"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon) {
    font-size: clamp(6.2px, 1.7vw, 6.8px) !important;
    letter-spacing: 0.02em !important;
  }
}

@media (max-width: 560px) {
  .site-header .nav-links a[aria-current="page"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.home-page .site-header .nav-links a[aria-current="page"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.customizer-page .site-header .nav-links a[aria-current="page"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.designer-page .site-header .nav-links a[aria-current="page"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon),
  body.cart-page .site-header .nav-links a[aria-current="page"]:not(.button):not(.nav-cart-icon):not(.nav-account-icon) {
    border-color: transparent !important;
    background: #765463 !important;
    background-color: #765463 !important;
    background-image: none !important;
    color: #fffdf8 !important;
    box-shadow: 0 6px 12px rgba(118, 84, 99, 0.16) !important;
  }
}