/*
 * Vero reference, inspected in the live browser on 2026-11-03:
 * body background rgb(243, 240, 237), text rgb(24, 22, 21).
 * Keep photography and existing dark chapters untouched. The monochrome
 * mannequin study alone receives a render-time backdrop correction below.
 */
:root {
  --paper: #f3f0ed;
  --ink: #181615;
  --muted: #726b65;
  --surface: #eae6e1;
  --surface-hover: #dfdad4;
  --line: rgba(24, 22, 21, .2);
}

.secondary-page {
  --secondary-paper: var(--paper);
  --secondary-ink: var(--ink);
  --secondary-line: var(--line);
}

html,
body,
.secondary-page,
.menu-panel,
.object-story,
.design-dialog {
  background-color: var(--paper);
}

.object-overlay { color: var(--ink); }

/* Neutralize only the mannequin source's pale pink backdrop before blending
 * it into the reference paper. Preserve the existing bottom silhouette mask. */
.object-sticky {
  background: var(--paper);
  isolation: isolate;
}
.object-story .mannequin-canvas { mix-blend-mode: multiply; }
.object-story .mannequin-poster,
.object-story .mannequin-turntable { filter: grayscale(1) brightness(1.1); }

/* The filmed paper is a few RGB levels darker at the right edge. Fade only
 * the empty margins of the portrait frame; keep the sculpted neck, black wool,
 * shirt and hands at full opacity. The enclosing layer owns the lower fade. */
@media (min-width: 651px) {
  .object-story :is(.mannequin-poster, .mannequin-turntable) {
    --side-matte: linear-gradient(90deg, transparent 1%, #0002 4%, #000c 10%, #000 14% 86%, #000c 90%, #0002 96%, transparent 99%);
    --rim-matte: linear-gradient(180deg, transparent .25%, #000 1.8%);
    -webkit-mask-image: var(--side-matte), var(--rim-matte);
    -webkit-mask-composite: source-in;
    mask-image: var(--side-matte), var(--rim-matte);
    mask-composite: intersect;
  }
}

html { scrollbar-color: #aaa39c var(--paper); }

.menu-toggle,
.header-cta,
.secondary-page .site-header .menu-toggle,
.secondary-page .site-header .header-cta {
  background: rgba(234, 230, 225, .92);
  color: var(--ink);
}

.menu-toggle:hover,
.header-cta:hover,
.secondary-page .site-header .menu-toggle:hover,
.secondary-page .site-header .header-cta:hover,
.menu-open .menu-toggle {
  background: var(--ink);
  color: var(--paper);
}

.button-link,
.skip-link,
.secondary-skip,
.archive-item button > span,
.image-cursor,
#credits-panel {
  background: var(--surface);
  color: var(--ink);
}

.button-link:hover {
  background: var(--ink);
  color: var(--paper);
}

.wedding-section,
.process-care,
.review-snapshot {
  background-color: var(--surface);
}

.review-snapshot img { background-color: var(--paper); }
.collection-object::before { background-color: var(--surface); }
.gallery-image-button { background-color: var(--surface); }
.editorial-rail .gallery-image-button { background-color: transparent; }
.gallery-image-hint { background: rgba(243, 240, 237, .92); color: var(--ink); }

.look-nav,
.compare-dock { background: rgba(243, 240, 237, .96); }
.image-action { background: rgba(234, 230, 225, .94); }
.compare-dock { box-shadow: none; }

.image-lightbox,
.gallery-lightbox {
  background: var(--paper);
  color: var(--ink);
}

/* The editorial gallery intentionally retains its existing dark viewer. */
.gallery-page .gallery-lightbox { background: #20211f; color: var(--paper); }
.lightbox-stage > button { background: rgba(243, 240, 237, .92); }
.lightbox-stage > button:hover,
.review-controls button:hover { background: var(--surface-hover); }
.gallery-page .lightbox-stage > button { background: rgba(32, 33, 31, .9); }
.gallery-page .lightbox-stage > button:hover { background: #3a3b36; }

.secondary-intro-copy,
.secondary-small-note,
.secondary-footer-bottom,
.process-chapter-intro > p:last-child,
.process-steps li div > p:last-of-type,
.process-film-caption,
.process-care > p:not(.secondary-eyebrow),
.gallery-count,
.gallery-filters button,
.lightbox-counter,
.lightbox-description,
.lightbox-keyboard-hint {
  color: var(--muted);
}

.process-care .process-care-note { color: var(--muted) !important; }
.gallery-filters button:hover,
.gallery-filters button.is-active { color: var(--ink); }
.gallery-filters button.is-active { font-weight: 600; }
.gallery-page .lightbox-description,
.gallery-page .lightbox-counter,
.gallery-page .lightbox-keyboard-hint { color: #bbbcb4; }

/* Separation comes from space and type, without decorative rules. */
body .menu-topline,
body .menu-bottom,
body .menu-bottom a,
body .craft-detail,
body .fabric-row,
body .fabric-row:last-of-type,
body .benefit-list details,
body .benefit-list details:last-child,
body .archive-explore,
body .review-section,
body .footer-bottom,
body .secondary-footer-top,
body .gallery-filter-bar,
body .process-steps > li,
body .editorial-rail .gallery-item figcaption,
body .editorial-chapter--wedding .gallery-item figcaption,
body .editorial-explore a,
body .text-link,
body .secondary-link,
body .secondary-text-link,
body .selection-header,
body .look-nav,
body .look,
body .look:nth-child(odd),
body .compare-dock,
body .dialog-header,
body .dialog-look + .dialog-look,
body .dialog-footer {
  border: 0;
}

.home-page .editorial-explore a { border: 0; }

.text-link::after,
.secondary-footer-top nav a::after,
.gallery-filters button::after {
  content: none;
}

.object-progress { display: none; }
.editorial-track { visibility: hidden; }

.text-link:hover,
.secondary-link:hover,
.secondary-text-link:hover,
.editorial-explore a:hover { opacity: .68; }

/* Keyboard focus rings and actionable button outlines remain visible. */