:root {
  --ink: #171217;
  --muted: #6f646c;
  --line: #e9e1e6;
  --paper: #ffffff;
  --wash: #f8f4f7;
  --accent: #8d1749;
  --accent-dark: #681035;
  --gold: #b77b25;
  --affiliate: #16764a;
  --affiliate-dark: #0f5d3a;
  --affiliate-ink: #ffffff;
  --radius: 22px;
  --shadow: 0 18px 50px rgba(54, 23, 39, 0.1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.55;
}
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; }
img { display: block; max-width: 100%; }

.site-header {
  position: sticky;
  z-index: 20;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 66px;
  padding: 9px clamp(18px, 5vw, 72px);
  background: rgba(255,255,255,.94);
  border-bottom: 1px solid rgba(233,225,230,.88);
  backdrop-filter: blur(16px);
}
.brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.brand-mark {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  color: white;
  background: var(--accent);
  border-radius: 14px;
  font-family: Georgia, serif;
  font-size: 23px;
}
.brand strong, .brand small { display: block; }
.brand strong { font-family: Georgia, "Times New Roman", serif; font-size: 18px; letter-spacing: -.02em; }
.brand small { margin-top: -2px; color: var(--muted); font-size: 12px; }
.site-header nav { display: flex; gap: 24px; }
.site-header nav a, .back-link { color: #554a51; text-decoration: none; font-weight: 650; }
.site-header nav a:hover, .back-link:hover { color: var(--accent); }

main { width: min(1440px, 100%); margin: 0 auto; }
.catalog-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, .72fr);
  gap: clamp(28px, 5vw, 72px);
  align-items: end;
  padding: clamp(24px, 3vw, 44px) clamp(18px, 5vw, 72px) 22px;
}
.eyebrow { margin: 0 0 8px; color: var(--accent); font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
h1, h2, h3 { font-family: Georgia, "Times New Roman", serif; line-height: 1.05; letter-spacing: -.035em; }
.catalog-intro h1 { max-width: 620px; margin: 0; font-size: clamp(38px, 4.4vw, 60px); font-weight: 500; }
.catalog-intro h1 span { color: var(--accent-dark); background: linear-gradient(transparent 66%, rgba(230,165,58,.38) 66%); }
.catalog-intro > div > p:last-child { max-width: 670px; margin: 14px 0 0; color: var(--muted); font-size: 16px; }
.search label { display: block; margin-bottom: 7px; font-size: 13px; font-weight: 750; }
.search-box { display: grid; grid-template-columns: 22px 1fr auto; gap: 10px; align-items: center; padding: 6px 8px 6px 14px; background: var(--wash); border: 1px solid var(--line); border-radius: 16px; }
.search-box:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(141,23,73,.1); }
.search-box svg { width: 22px; fill: none; stroke: var(--muted); stroke-width: 1.8; stroke-linecap: round; }
.search-box input { width: 100%; min-width: 0; padding: 9px 0; background: transparent; border: 0; color: var(--ink); outline: 0; font-size: 15px; }
.search-box button { padding: 8px 11px; color: var(--accent); background: white; border: 0; border-radius: 11px; cursor: pointer; font-weight: 750; }

.filter-panel { margin: 0 clamp(18px, 5vw, 72px); padding: 16px 18px; background: #171217; border-radius: 18px; box-shadow: var(--shadow); }
.filter-row { display: grid; grid-template-columns: 108px 1fr; gap: 12px; align-items: start; }
.filter-row + .filter-row { margin-top: 11px; padding-top: 11px; border-top: 1px solid #3e353b; }
.filter-row > span { padding-top: 6px; color: #cfc5cb; font-size: 12px; font-weight: 750; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip { padding: 7px 11px; color: #f2edf0; background: #2a2327; border: 1px solid #473c43; border-radius: 999px; cursor: pointer; font-size: 13px; font-weight: 700; }
.chip:hover { background: #3a2f35; }
.chip.active { color: var(--ink); background: white; border-color: white; }

.products { padding: clamp(30px, 4vw, 48px) clamp(18px, 5vw, 72px) 0; }
.collection-strip { padding: clamp(46px, 5vw, 66px) clamp(18px, 5vw, 72px) 0; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 16px; }
.section-heading h2 { margin: 0; font-size: clamp(30px, 3vw, 44px); font-weight: 500; }
.section-heading > p { max-width: 410px; margin: 0; color: var(--muted); text-align: right; }
.collection-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.collection-card { min-height: 150px; padding: 20px; text-align: left; border: 0; border-radius: var(--radius); cursor: pointer; transition: transform .2s ease, box-shadow .2s ease; }
.collection-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.collection-card span, .collection-card strong, .collection-card small { display: block; }
.collection-card span { margin-bottom: 22px; font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.collection-card strong { max-width: 250px; margin-bottom: 7px; font-family: Georgia, serif; font-size: 25px; line-height: 1.05; }
.collection-card small { max-width: 290px; font-size: 13px; line-height: 1.4; }
.collection-card.plum { color: white; background: #6e123c; }
.collection-card.saffron { color: #371f09; background: #e6a53a; }
.collection-card.rose { color: #431326; background: #efb5ca; }

.product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.product-card { overflow: hidden; background: white; border: 1px solid var(--line); border-radius: var(--radius); transition: transform .2s ease, box-shadow .2s ease; }
.product-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.product-image { position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden; background: var(--wash); }
.product-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.product-card:hover .product-image img { transform: scale(1.02); }
.retailer-badge { position: absolute; top: 14px; left: 14px; padding: 7px 11px; color: white; background: rgba(23,18,23,.82); border-radius: 999px; backdrop-filter: blur(8px); font-size: 12px; font-weight: 800; }
.product-content { padding: 20px; }
.product-brand { margin: 0 0 5px; color: var(--muted); font-size: 13px; font-weight: 750; text-transform: uppercase; letter-spacing: .06em; }
.product-content h3 { margin: 0 0 18px; font-size: 27px; font-weight: 500; }
.product-content h3 a { text-decoration: none; }
.product-meta { display: flex; justify-content: space-between; gap: 16px; align-items: baseline; }
.product-meta strong { font-size: 21px; }
.product-meta span { color: #5f5059; font-weight: 700; }
.product-meta small { font-weight: 500; }
.checked { margin: 6px 0 18px; color: var(--muted); font-size: 12px; }
.card-link { display: flex; justify-content: space-between; padding-top: 16px; border-top: 1px solid var(--line); color: var(--accent); text-decoration: none; font-weight: 800; }
.empty-state { padding: 56px; text-align: center; background: var(--wash); border-radius: var(--radius); }
.empty-state strong { font-family: Georgia, serif; font-size: 28px; }
.empty-state p { color: var(--muted); }
.empty-state button { padding: 11px 16px; color: white; background: var(--accent); border: 0; border-radius: 12px; cursor: pointer; font-weight: 750; }

.trust-panel { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(36px, 8vw, 120px); margin: clamp(60px, 8vw, 110px) clamp(18px, 5vw, 72px); padding: clamp(32px, 5vw, 64px); color: white; background: #171217; border-radius: var(--radius); }
.trust-panel h2 { max-width: 570px; margin: 0; font-size: clamp(34px, 4vw, 58px); font-weight: 500; }
.trust-copy { align-self: end; color: #d8cfd4; }

footer { display: flex; justify-content: space-between; gap: 20px; padding: 28px clamp(18px, 5vw, 72px); color: var(--muted); border-top: 1px solid var(--line); font-size: 13px; }

.product-detail { padding: 30px clamp(18px, 5vw, 72px) 70px; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 24px; color: var(--muted); font-size: 13px; }
.breadcrumbs a { text-decoration: none; }
.breadcrumbs a:hover { color: var(--accent); }
.detail-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(400px, .85fr); gap: clamp(28px, 4vw, 58px); align-items: start; }
.detail-gallery { min-width: 0; }
.hero-sheet { width: 100%; background: var(--wash); border-radius: var(--radius); box-shadow: var(--shadow); }
.detail-gallery details { margin-top: 16px; border: 1px solid var(--line); border-radius: 16px; }
.detail-gallery summary { padding: 16px 18px; color: var(--accent); cursor: pointer; font-weight: 800; }
.detail-gallery details img { padding: 0 16px 16px; border-radius: 22px; }
.purchase-card { position: sticky; top: 104px; padding: 28px; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 12px 40px rgba(54,23,39,.08); }
.retailer-line { display: flex; justify-content: space-between; gap: 16px; margin: 0 0 16px; color: var(--muted); font-size: 13px; font-weight: 750; text-transform: uppercase; letter-spacing: .05em; }
.retailer-line span { color: var(--accent); }
.purchase-card h1 { margin: 0 0 8px; font-size: clamp(36px, 3.4vw, 52px); font-weight: 500; }
.product-name { margin-top: 0; color: var(--muted); }
.price-line { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; margin-top: 24px; }
.price-line strong { font-size: 29px; }
.price-line span { color: #5f5059; font-weight: 700; }
.purchase-actions { margin: 12px 0 22px; }
.purchase-actions + .verdict { margin-top: 0; }
.verdict { margin: 25px 0 20px; padding: 18px; color: white; background: var(--accent); border-radius: 16px; }
.verdict span { font-size: 12px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.verdict p { margin: 7px 0 0; }
.feature-list { display: grid; gap: 9px; padding-left: 20px; }
.feature-list li::marker { color: var(--accent); }
.caveat { margin: 20px 0; padding: 16px; background: #fff7e9; border-left: 4px solid var(--gold); border-radius: 8px 14px 14px 8px; }
.caveat p { margin: 5px 0 0; color: #5e4b33; }
.shop-button { display: flex; justify-content: space-between; width: 100%; padding: 16px 18px; color: var(--affiliate-ink); background: var(--affiliate); border: 1px solid rgba(15,93,58,.2); border-radius: 14px; box-shadow: 0 9px 24px rgba(22,118,74,.24); text-decoration: none; cursor: pointer; font-weight: 850; }
.purchase-card a.shop-button:not(.disabled) { color: #fff; background: var(--affiliate); }
.shop-button:hover, .purchase-card a.shop-button:not(.disabled):hover { background: var(--affiliate-dark); }
.shop-button.disabled { justify-content: center; color: #81757c; background: #eee9ec; cursor: not-allowed; }
.copy-code { width: 100%; margin-top: 10px; padding: 13px 16px; color: var(--ink); background: white; border: 1px solid var(--line); border-radius: 14px; cursor: pointer; }
.disclosure-band { display: grid; grid-template-columns: .4fr 1.6fr; gap: 30px; margin: 0 clamp(18px, 5vw, 72px) 70px; padding: 24px; background: var(--wash); border-radius: 18px; }
.disclosure-band p { margin: 0; color: var(--muted); }
.detail-loading, .detail-error { padding: 80px; text-align: center; background: var(--wash); border-radius: var(--radius); }
.detail-error strong { font-family: Georgia, serif; font-size: 30px; }
.detail-error a { color: var(--accent); font-weight: 750; }

@media (max-width: 900px) {
  .site-header nav { display: none; }
  .catalog-intro { grid-template-columns: 1fr; }
  .catalog-intro h1 { font-size: clamp(38px, 11vw, 58px); }
  .filter-row { grid-template-columns: 1fr; gap: 8px; }
  .filter-row > span { padding: 0; }
  .collection-grid { grid-template-columns: 1fr; }
  .collection-card { min-height: 200px; }
  .collection-card span { margin-bottom: 34px; }
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .trust-panel, .detail-grid { grid-template-columns: 1fr; }
  .purchase-card { position: static; }
}

@media (max-width: 1100px) and (min-width: 901px) {
  .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
  .site-header { min-height: 68px; }
  .brand small { display: none; }
  .brand-mark { width: 40px; height: 40px; }
  .catalog-intro { padding-top: 38px; }
  .catalog-intro > div > p:last-child { font-size: 16px; }
  .filter-panel { padding: 18px; }
  .chip { padding: 8px 12px; }
  .section-heading { align-items: start; }
  .section-heading > p { text-align: right; font-size: 13px; }
  .product-grid { grid-template-columns: 1fr; }
  .product-image { aspect-ratio: 5 / 6; }
  .trust-panel { margin-bottom: 46px; }
  .detail-page .brand span:last-child { display: none; }
  .product-detail { padding-top: 20px; }
  .purchase-card { padding: 22px; }
  .purchase-card h1 { font-size: 40px; }
  .disclosure-band { grid-template-columns: 1fr; gap: 7px; }
  footer { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}