/* ==========================================================================
   Product detail page
   ========================================================================== */
.pdp { display: grid; grid-template-columns: 56px 1fr 1fr; gap: 24px; }
.pdp__thumbs { display: flex; flex-direction: column; gap: 10px; }
.pdp__thumbs img { border-radius: var(--r-sm); border: 1px solid var(--c-line); cursor: pointer; aspect-ratio: 1/1; object-fit: cover; }
.pdp__thumbs img.is-active { border-color: var(--c-forest); border-width: 2px; }
.pdp__main-image { border-radius: var(--r-lg); overflow: hidden; background: var(--c-stone); aspect-ratio: 1/1; }
.pdp__main-image img { width: 100%; height: 100%; object-fit: cover; }
.pdp__info { padding-left: 12px; }
.pdp__category { font-family: var(--f-utility); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: 0.06em; color: var(--c-ink-muted); }
.pdp__name { margin-top: 6px; }
.pdp__meta-row { display: flex; align-items: center; gap: 16px; margin-top: 12px; }
.pdp__price-row { display: flex; align-items: baseline; gap: 12px; margin-top: 18px; }
.pdp__price-row .price { font-size: var(--fs-3xl); }
.pdp__desc { margin-top: 16px; color: var(--c-ink-muted); }
.pdp__variants { margin-top: 24px; }
.variant-group__title { font-family: var(--f-utility); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 10px; color: var(--c-ink-muted); }
.variant-pill { display: inline-flex; align-items: center; padding: 9px 16px; border: 1px solid var(--c-line); border-radius: var(--r-pill); font-size: var(--fs-sm); margin: 0 8px 8px 0; cursor: pointer; }
.variant-pill.is-selected { border-color: var(--c-forest); background: var(--c-forest); color: var(--c-paper); }
.pdp__add-row { display: flex; gap: 12px; margin-top: 28px; align-items: center; }
.pdp__care-grid { margin-top: 32px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; padding: 20px; background: var(--c-stone); border-radius: var(--r-lg); }
.pdp__care-item { display: flex; flex-direction: column; gap: 6px; }
.pdp__care-item svg { width: 22px; height: 22px; color: var(--c-moss); }
.pdp__care-item span.label { font-family: var(--f-utility); font-size: 10px; text-transform: uppercase; color: var(--c-ink-muted); }
.pdp__highlights { margin-top: 28px; }
.pdp__highlights li { display: flex; gap: 10px; padding: 8px 0; font-size: var(--fs-sm); }
.pdp__highlights li svg { width: 16px; height: 16px; color: var(--c-moss); flex-shrink: 0; margin-top: 3px; }
.pdp__sticky-bar {
  position: fixed; bottom: 0; left: 0; right: 0; background: var(--c-white); border-top: 1px solid var(--c-line);
  padding: 14px var(--space-gutter); display: none; align-items: center; justify-content: space-between; z-index: 55;
  box-shadow: 0 -6px 24px rgba(23,48,31,0.08);
}
.pdp__sticky-bar.is-visible { display: flex; }
@media (max-width: 900px) {
  .pdp { grid-template-columns: 1fr; }
  .pdp__thumbs { flex-direction: row; overflow-x: auto; }
  .pdp__thumbs img { width: 60px; flex-shrink: 0; }
  .pdp__info { padding-left: 0; }
  .pdp__care-grid { grid-template-columns: repeat(2, 1fr); }
}

.pdp-tabs { display: flex; gap: 28px; border-bottom: 1px solid var(--c-line); margin-top: var(--space-section); }
.pdp-tab { padding: 14px 0; font-family: var(--f-utility); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: 0.06em; color: var(--c-ink-muted); border-bottom: 2px solid transparent; cursor: pointer; }
.pdp-tab.is-active { color: var(--c-forest); border-color: var(--c-forest); }
.pdp-tab-panel { display: none; padding-top: 28px; }
.pdp-tab-panel.is-active { display: block; }

.review-item { display: flex; flex-direction: column; gap: 6px; padding: 20px 0; border-bottom: 1px solid var(--c-line); }
.review-item__stars { display: flex; gap: 2px; }
.review-item__stars svg { width: 14px; height: 14px; color: var(--c-ochre); }
.review-item__author { font-family: var(--f-utility); font-size: var(--fs-xs); color: var(--c-ink-muted); }

/* ==========================================================================
   About page
   ========================================================================== */
.about-hero { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.about-hero__media { aspect-ratio: 4/5; border-radius: var(--r-lg); overflow: hidden; background: var(--c-stone); }
.about-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.stat-row { display: flex; gap: 48px; margin-top: 40px; flex-wrap: wrap; }
.stat-item .num { font-family: var(--f-display); font-size: var(--fs-3xl); color: var(--c-forest); }
.stat-item .label { font-family: var(--f-utility); font-size: var(--fs-xs); text-transform: uppercase; color: var(--c-ink-muted); }
.value-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
@media (max-width: 900px) { .about-hero { grid-template-columns: 1fr; } .value-grid { grid-template-columns: 1fr; } }

/* ==========================================================================
   Policy / legal pages
   ========================================================================== */
.policy-page { max-width: 780px; margin-inline: auto; }
.policy-page h2 { margin-top: 40px; margin-bottom: 12px; }
.policy-page p, .policy-page li { color: var(--c-ink-muted); font-size: var(--fs-base); margin-bottom: 12px; }
.policy-page ul { padding-left: 20px; list-style: disc; }
.policy-updated { font-family: var(--f-utility); font-size: var(--fs-xs); color: var(--c-ink-muted); }

/* Contact page */
.contact-layout { display: grid; grid-template-columns: 1fr 1.2fr; gap: 48px; }
.contact-info-card { background: var(--c-stone); border-radius: var(--r-lg); padding: 32px; }
.contact-info-row { display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--c-line); }
.contact-info-row svg { width: 20px; height: 20px; color: var(--c-moss); flex-shrink: 0; }
@media (max-width: 900px) { .contact-layout { grid-template-columns: 1fr; } }

/* 404 helper (used by JS router fallback) */
.state-404 { text-align: center; padding: 120px 20px; }