/* FRAYDA — Florence Leather Atelier.
   Visual system: OpenAI-inspired — white canvas, near-black ink, one warm
   copper accent, Inter typography, pill controls, large-radius media. */

:root {
  --bg: #FFFFFF;
  --ink: #0D0D0D;
  --muted: #5E5D59;
  --leather: #9A5B35;   /* single warm accent (copper) */
  --stone: #6B6965;     /* secondary text; >= 5:1 on white/sand surfaces */
  --sand: #F5F5F3;      /* light neutral surface */
  --cream: #F7F7F5;
  --border: #E6E5E2;
  --font-sans: ui-sans-serif, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --radius-media: 16px;
  --radius-card: 12px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4 {
  font-family: var(--font-sans);
  font-weight: 500;
  line-height: 1.15;
  margin: 0;
  letter-spacing: -0.015em;
}

p { margin: 0; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; padding: 0; }
input, textarea, select { font-family: inherit; }

.eyebrow {
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--muted);
}

.container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 80px;
}
.container-narrow {
  max-width: 880px;
  margin: 0 auto;
  padding: 0 80px;
}
@media (max-width: 768px) {
  .container, .container-narrow { padding: 0 24px; }
}

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

.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.9s cubic-bezier(0.2, 0.6, 0.2, 1),
              transform 0.9s cubic-bezier(0.2, 0.6, 0.2, 1);
  will-change: opacity, transform;
}
.reveal.in {
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  .stagger > * { opacity: 1; animation: none; }
  html { scroll-behavior: auto; }
}

/* ─── Surfaces & textures ───────────────────────────────── */

.leather-surface {
  background:
    radial-gradient(ellipse 80% 60% at 30% 20%, rgba(255, 220, 180, 0.25), transparent 60%),
    radial-gradient(ellipse 70% 50% at 80% 80%, rgba(60, 35, 18, 0.35), transparent 65%),
    radial-gradient(ellipse 50% 40% at 60% 40%, rgba(200, 140, 90, 0.2), transparent 70%),
    linear-gradient(135deg, #8a5e3a 0%, #a67c52 35%, #6f4a2c 70%, #8a5e3a 100%);
  position: relative;
  overflow: hidden;
}
.leather-surface::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    repeating-radial-gradient(circle at 30% 40%, rgba(0,0,0,0.04) 0, rgba(0,0,0,0.04) 1px, transparent 1px, transparent 4px),
    repeating-radial-gradient(circle at 70% 60%, rgba(255,255,255,0.03) 0, rgba(255,255,255,0.03) 1px, transparent 1px, transparent 3px);
  mix-blend-mode: overlay;
  opacity: 0.7;
}
.leather-surface::after {
  content: '';
  position: absolute; inset: 0;
  background:
    linear-gradient(115deg, transparent 0%, transparent 40%, rgba(255,255,255,0.06) 50%, transparent 60%, transparent 100%);
  pointer-events: none;
}

.leather-closeup {
  background:
    radial-gradient(ellipse 90% 70% at 20% 30%, rgba(220, 180, 140, 0.4), transparent 55%),
    radial-gradient(ellipse 80% 60% at 75% 75%, rgba(80, 50, 30, 0.45), transparent 60%),
    linear-gradient(160deg, #9c7048 0%, #b88a5d 40%, #7d553a 80%, #9c7048 100%);
  position: relative;
  overflow: hidden;
}
.leather-closeup::before {
  content: '';
  position: absolute; inset: 0;
  background:
    repeating-linear-gradient(45deg, rgba(0,0,0,0.03) 0 1px, transparent 1px 6px),
    repeating-linear-gradient(-45deg, rgba(255,255,255,0.02) 0 1px, transparent 1px 5px),
    repeating-radial-gradient(circle at 50% 50%, rgba(0,0,0,0.04) 0 1px, transparent 1px 7px);
  mix-blend-mode: overlay;
  opacity: 0.8;
}
.leather-closeup::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(120deg, rgba(255,255,255,0.08), transparent 40%, rgba(0,0,0,0.15));
}

.florence-arch {
  background: var(--cream);
  position: relative;
  overflow: hidden;
}
.florence-arch .palazzo {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, #ddd2bf 0%, #c4b9a8 100%);
}
.florence-arch .arch-shape {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 58%;
  height: 78%;
  background: var(--cream);
  border-radius: 50% 50% 0 0 / 60% 60% 0 0;
  box-shadow:
    inset 0 8px 20px rgba(0,0,0,0.08),
    0 -2px 0 rgba(0,0,0,0.06);
}
.florence-arch .arch-inner {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 44%;
  height: 64%;
  background: linear-gradient(180deg, #b8ac99 0%, #8e8270 100%);
  border-radius: 50% 50% 0 0 / 60% 60% 0 0;
  box-shadow: inset 0 14px 32px rgba(0,0,0,0.25);
}
.florence-arch .ledge {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 5%;
  background: linear-gradient(180deg, #a89a85, #8a7d6a);
}
.florence-arch .keystone {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 18%;
  width: 8%;
  height: 6%;
  background: #a89a85;
  border-radius: 1px;
}

/* Library swatches — 12 unique compositions */
.sw { position: relative; overflow: hidden; }
.sw-1 { background: radial-gradient(circle at 25% 25%, #c89968 0%, #a67c52 40%, #7a5535 100%); }
.sw-2 { background: linear-gradient(140deg, #1A1714 0%, #3a302a 50%, #5a4a3e 100%); }
.sw-3 { background: radial-gradient(ellipse at 70% 30%, #e8d8c2 0%, #c4b9a8 60%, #9e9080 100%); }
.sw-4 { background: linear-gradient(160deg, #8a5e3a 0%, #a67c52 100%); }
.sw-4::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 80% 80%, rgba(255,255,255,0.6) 0%, transparent 50%); }
.sw-5 { background: linear-gradient(180deg, #E8E2D8 0%, #C4B9A8 50%, #A67C52 100%); }
.sw-6 { background: radial-gradient(circle at 40% 60%, #6b4a2c 0%, #3a2818 60%, #1f140c 100%); }
.sw-7 { background: linear-gradient(45deg, #c4b9a8 0%, #e8d8c2 50%, #f0ede6 100%); }
.sw-7::after { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(45deg, rgba(0,0,0,0.04) 0 2px, transparent 2px 14px); }
.sw-8 { background: radial-gradient(ellipse at 50% 0%, #4a3424 0%, #2a1d14 80%); }
.sw-9 { background: linear-gradient(135deg, #d4a574 0%, #a67c52 40%, #6b4a2c 100%); }
.sw-10 { background: linear-gradient(180deg, #2a1d14 0%, #4a3424 40%, #8a5e3a 100%); }
.sw-11 { background:
  radial-gradient(circle at 20% 80%, #e8d8c2 0%, transparent 50%),
  radial-gradient(circle at 80% 20%, #a67c52 0%, transparent 50%),
  #c4b9a8;
}
.sw-12 { background: linear-gradient(160deg, #5a4a3e 0%, #8a7060 60%, #c4b9a8 100%); }

/* Journal palettes */
.jp-1 { background: linear-gradient(135deg, #c89968, #6b4a2c); }
.jp-2 { background: radial-gradient(ellipse at 30% 70%, #e8d8c2, #a67c52 70%); }
.jp-3 { background: linear-gradient(180deg, #f0ede6, #c4b9a8); }
.jp-4 { background: linear-gradient(45deg, #3a302a, #8a7060); }
.jp-5 { background: radial-gradient(circle at 70% 30%, #d4a574, #4a3424 80%); }
.jp-6 { background: linear-gradient(135deg, #8a5e3a 0%, #c89968 100%); }
.jp-7 { background: linear-gradient(180deg, #c4b9a8 0%, #8a7060 100%); }
.jp-8 { background: radial-gradient(ellipse at 20% 20%, #f0ede6, #a67c52 80%); }

/* Library card hover behavior */
.lib-card { position: relative; overflow: hidden; cursor: pointer; }
.lib-card .swatch { position: absolute; inset: 0; transition: transform 0.6s cubic-bezier(0.2,0.6,0.2,1); }
.lib-card:hover .swatch { transform: scale(1.04); }
.lib-card .overlay {
  position: absolute; inset: 0;
  background: rgba(13, 13, 13, 0.72);
  opacity: 0;
  transition: opacity 0.5s ease;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 24px;
}
.lib-card:hover .overlay { opacity: 1; }
.lib-card .overlay h4 {
  color: #fff;
  font-size: 22px;
  margin-bottom: 12px;
  transform: translateY(10px);
  transition: transform 0.5s ease 0.05s;
}
.lib-card .overlay span {
  color: rgba(255, 255, 255, 0.65);
  font-size: 11px;
  letter-spacing: 0.02em;
   transform: translateY(10px);
  transition: transform 0.5s ease 0.1s;
}
.lib-card:hover .overlay h4,
.lib-card:hover .overlay span { transform: translateY(0); }

/* Underline links */
.ul-link {
  position: relative;
  color: var(--ink);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.02em;
  display: inline-block;
  cursor: pointer;
}
.ul-link::after {
  content: '';
  position: absolute; left: 0; right: 0; bottom: -2px;
  height: 1px;
  background: currentColor;
  transform-origin: left center;
  transition: transform 0.4s ease;
}
.ul-link:hover::after { transform: scaleX(0.6); }

/* ─── Navigation ────────────────────────────────────────── */

.nav {
  position: fixed; top: 0; left: 0; right: 0;
  height: 72px;
  z-index: 100;
  display: flex; align-items: center;
  transition: background 0.35s ease;
}
.nav.scrolled, .nav.solid {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: saturate(140%) blur(12px);
  -webkit-backdrop-filter: saturate(140%) blur(12px);
}
.nav-inner {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 80px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 32px;
}
.wordmark {
  font-family: var(--font-sans);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.02em;
   cursor: pointer;
}
.nav-links {
  display: flex; gap: 24px; align-items: center;
  flex-wrap: nowrap;
}
.nav-links a { white-space: nowrap; cursor: pointer; }
.nav-links a {
  font-size: 13px;
  color: var(--ink);
  opacity: 0.78;
  transition: opacity 0.25s ease;
}
.nav-links a:hover, .nav-links a.active { opacity: 1; }
.nav-cta {
  border: 1px solid var(--ink);
  padding: 9px 18px;
  font-size: 12px;
  letter-spacing: 0.02em;
   white-space: nowrap;
  flex-shrink: 0;
  cursor: pointer;
  transition: background 0.4s ease, color 0.4s ease;
}
.nav-cta:hover { background: var(--ink); color: var(--bg); }

.hamburger {
  display: none;
  flex-direction: column; gap: 5px;
  width: 24px;
  cursor: pointer;
}
.hamburger span {
  display: block;
  height: 1px;
  background: var(--ink);
  transition: transform 0.3s ease, opacity 0.3s ease;
}
.hamburger span:nth-child(2) { width: 70%; align-self: flex-end; }

@media (max-width: 900px) {
  .nav { height: 60px; }
  .nav-inner { padding: 0 24px; }
  .nav-links, .nav-cta { display: none; }
  .hamburger { display: flex; }
}

.mobile-menu {
  position: fixed; inset: 0;
  background: var(--bg);
  z-index: 200;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 80px 32px 40px;
  transform: translateY(-100%);
  transition: transform 0.5s cubic-bezier(0.2, 0.6, 0.2, 1), visibility 0s linear 0.5s;
  visibility: hidden;
  pointer-events: none;
  overflow-y: auto;
  gap: 4px;
}
.mobile-menu.open {
  transform: translateY(0);
  visibility: visible;
  pointer-events: auto;
  transition: transform 0.5s cubic-bezier(0.2, 0.6, 0.2, 1), visibility 0s linear 0s;
}
.mobile-menu a {
  font-family: var(--font-sans);
  font-size: 26px;
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--ink);
  padding: 12px 0;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.mobile-menu.open a { opacity: 1; transform: translateY(0); }
.mobile-menu.open a:nth-child(1) { transition-delay: 0.15s; }
.mobile-menu.open a:nth-child(2) { transition-delay: 0.22s; }
.mobile-menu.open a:nth-child(3) { transition-delay: 0.29s; }
.mobile-menu.open a:nth-child(4) { transition-delay: 0.36s; }
.mobile-menu.open a:nth-child(5) { transition-delay: 0.43s; }
.mobile-menu.open a:nth-child(6) { transition-delay: 0.50s; }
.mobile-menu.open a:nth-child(7) { transition-delay: 0.57s; }
.mobile-close {
  position: absolute; top: 18px; right: 24px;
  color: var(--ink);
  font-size: 28px; line-height: 1;
  cursor: pointer;
}
@media (min-width: 901px) {
  .mobile-menu { display: none; }
}

/* ─── Buttons ───────────────────────────────────────────── */

.btn-primary {
  display: inline-flex; align-items: center; justify-content: center;
  height: 48px; padding: 0 24px;
  background: var(--ink);
  color: #fff;
  border-radius: 999px;
  font-size: 14px; letter-spacing: 0; font-weight: 500;
  cursor: pointer;
  transition: background 0.3s ease, transform 0.3s ease;
}
.btn-primary:hover { background: #2f2f2f; }
.btn-outline-light {
  display: inline-flex; align-items: center; justify-content: center;
  height: 48px; padding: 0 24px;
  border: 1px solid rgba(255,255,255,.4);
  color: #fff;
  border-radius: 999px;
  font-size: 14px; letter-spacing: 0; font-weight: 500;
  cursor: pointer;
  transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
.btn-outline-light:hover { background: #fff; border-color: #fff; color: var(--ink); }

/* ─── Sections ──────────────────────────────────────────── */

section { position: relative; }
.sec-pad { padding: 180px 0 160px; }
.sec-pad-tight { padding: 120px 0 100px; }
@media (max-width: 900px) {
  .sec-pad { padding: 100px 0 96px; }
  .sec-pad-tight { padding: 80px 0 80px; }
}
.sec-center { text-align: center; }
.sec-center .eyebrow { display: inline-block; margin-bottom: 28px; }
.hr-mini { width: 80px; height: 1px; background: var(--border); margin: 48px auto 0; }

/* ─── Page hero (shared, for non-home pages) ───────────── */

.page-hero {
  padding: 200px 0 100px;
}
.page-hero .eyebrow { color: var(--muted); margin-bottom: 28px; display: inline-block; }
.page-hero h1 { font-size: clamp(36px, 4.2vw, 56px); margin-bottom: 28px; max-width: 880px; }
.page-hero p { font-size: 18px; color: rgba(13,13,13,0.7); max-width: 580px; line-height: 1.65; }
@media (max-width: 900px) {
  .page-hero { padding: 120px 0 64px; }
}

/* ─── Home — Hero ───────────────────────────────────────── */

.hero {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 55% 45%;
  position: relative;
  padding-top: 72px;
}
.hero-image { position: relative; }
.hero-text {
  display: flex; flex-direction: column; justify-content: center;
  padding: 80px;
  max-width: 640px;
}
.hero-text .eyebrow { color: var(--leather); margin-bottom: 32px; }
.hero-text h1 { font-size: clamp(36px, 4.4vw, 60px); margin-bottom: 28px; letter-spacing: -0.015em; }
.hero-text .lede { font-size: 18px; line-height: 1.65; color: rgba(13, 13, 13, 0.72); max-width: 480px; margin-bottom: 40px; }
.hero-ctas { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.hero-footnote {
  position: absolute;
  bottom: 32px; left: 0; right: 0;
  text-align: center;
  font-size: 10px;
  letter-spacing: 0.02em;
   opacity: 0.4;
}
@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; min-height: auto; }
  .hero-image { height: 70vh; }
  .hero-text { padding: 64px 24px 96px; }
}

/* Stagger */
.stagger > * { opacity: 0; animation: fadeUp 1s cubic-bezier(0.2,0.6,0.2,1) forwards; }
.stagger > *:nth-child(1) { animation-delay: 0.1s; }
.stagger > *:nth-child(2) { animation-delay: 0.25s; }
.stagger > *:nth-child(3) { animation-delay: 0.4s; }
.stagger > *:nth-child(4) { animation-delay: 0.55s; }
.stagger > *:nth-child(5) { animation-delay: 0.7s; }
.stagger > *:nth-child(6) { animation-delay: 0.85s; }

.arrow { display: inline-block; transition: transform 0.4s ease; }
.btn-primary:hover .arrow, .ul-link:hover .arrow, .cta-link:hover .arrow { transform: translateX(4px); }

/* ─── Services grid (home) ──────────────────────────────── */

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 64px;
  margin-top: 88px;
  text-align: left;
}
.service-card .num {
  font-family: var(--font-sans);
  font-size: 13px; font-weight: 500; line-height: 1;
  color: var(--muted); opacity: 1;
  margin-bottom: 20px;
}
.service-card h3 {
  font-family: var(--font-sans);
  font-size: 20px; font-weight: 700;
  margin-bottom: 16px; letter-spacing: 0;
}
.service-card p { font-size: 15px; color: rgba(13,13,13,0.65); line-height: 1.7; margin-bottom: 24px; }
@media (max-width: 900px) {
  .services-grid { grid-template-columns: 1fr; gap: 0; margin-top: 56px; }
  .service-card { padding: 40px 0; border-bottom: 1px solid var(--border); }
  .service-card:last-child { border-bottom: none; }
}

/* ─── Library grids ─────────────────────────────────────── */

.lib-head {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 80px;
  align-items: end;
  margin-bottom: 72px;
}
.lib-head h2 { font-size: clamp(28px, 3.2vw, 40px); }
.lib-head p { font-size: 16px; color: rgba(13,13,13,0.6); max-width: 460px; }
@media (max-width: 900px) {
  .lib-head { grid-template-columns: 1fr; gap: 24px; margin-bottom: 48px; }
}

/* Home library — asymmetric 6 */
.lib-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-auto-rows: 140px;
  gap: 16px;
}
.lib-grid > :nth-child(1) { grid-column: span 3; grid-row: span 4; }
.lib-grid > :nth-child(2) { grid-column: span 3; grid-row: span 3; }
.lib-grid > :nth-child(3) { grid-column: span 2; grid-row: span 3; }
.lib-grid > :nth-child(4) { grid-column: span 2; grid-row: span 3; }
.lib-grid > :nth-child(5) { grid-column: span 2; grid-row: span 3; }
.lib-grid > :nth-child(6) { grid-column: span 6; grid-row: span 3; }
@media (max-width: 900px) {
  .lib-grid { grid-template-columns: 1fr; grid-auto-rows: 280px; }
  .lib-grid > * { grid-column: span 1 !important; grid-row: span 1 !important; }
}
.lib-foot { text-align: center; margin-top: 72px; }

/* Library page — uniform grid: every product card the same size (4:5). */
.lib-page-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.lib-page-card { aspect-ratio: 4 / 5; }
@media (max-width: 900px) { .lib-page-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .lib-page-grid { grid-template-columns: 1fr; } }

.lib-page-card {
  position: relative; overflow: hidden; cursor: pointer;
}
.lib-page-card .swatch { position: absolute; inset: 0; transition: transform 0.6s cubic-bezier(0.2,0.6,0.2,1); }
.lib-page-card:hover .swatch { transform: scale(1.03); }
/* Real product/article photos fill their gradient-swatch containers (indexable <img>). */
.swatch img, .gallery-main img, .jrn-card .visual img, .article-figure img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lib-page-card .meta {
  position: absolute; left: 20px; bottom: 18px; right: 20px;
  color: var(--bg);
  text-shadow: 0 1px 8px rgba(0,0,0,0.4);
  z-index: 2;
}
.lib-page-card .meta .name { font-size: 15px; font-weight: 500; }
.lib-page-card .meta .cat { font-size: 12px; opacity: 0.78; letter-spacing: 0.01em; margin-bottom: 4px; }
.lib-page-card::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,0.4) 100%);
  pointer-events: none;
}
.lib-page-card .hover-cta {
  position: absolute; inset: 0;
  background: rgba(13,13,13,0.55);
  opacity: 0;
  transition: opacity 0.4s ease;
  display: flex; align-items: center; justify-content: center;
  z-index: 3;
}
.lib-page-card:hover .hover-cta { opacity: 1; }
.lib-page-card .hover-cta span {
  color: var(--bg);
  font-size: 12px; letter-spacing: 0.02em;  border-bottom: 1px solid currentColor;
  padding-bottom: 4px;
}

/* Filter pills */
.filter-bar {
  display: flex; flex-wrap: wrap; gap: 10px;
  margin-bottom: 56px;
}
.filter-pill {
  padding: 10px 20px;
  font-size: 13px;
  letter-spacing: 0;
  font-weight: 500;
  border: 0;
  border-radius: 999px;
  background: var(--sand);
  color: rgba(13,13,13,0.62);
  cursor: pointer;
  transition: all 0.25s ease;
}
.filter-pill:hover { color: var(--ink); background: #ecebe8; }
.filter-pill.active { background: var(--ink); color: var(--bg); }
.lib-page-card.hidden { display: none; }

/* ─── Process strip (home) ──────────────────────────────── */

.process-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 32px;
  margin-top: 88px;
  position: relative;
}
.process-grid::before { display: none; }
.step { position: relative; z-index: 1; text-align: left; }
.step .num {
  font-family: var(--font-sans);
  font-size: 13px; font-weight: 500; line-height: 1;
  color: var(--muted); opacity: 1;
  margin-bottom: 18px;
  background: var(--bg);
  display: inline-block;
  padding-right: 14px;
}
.step h4 {
  font-family: var(--font-sans);
  font-size: 16px; font-weight: 700;
  margin-bottom: 12px; letter-spacing: 0.01em;
}
.step p { font-size: 13.5px; color: rgba(13,13,13,0.6); line-height: 1.65; }
@media (max-width: 1024px) {
  .process-grid { grid-template-columns: repeat(3, 1fr); row-gap: 48px; }
  .process-grid::before { display: none; }
}
@media (max-width: 640px) {
  .process-grid { grid-template-columns: 1fr; }
}

/* ─── Materials & 2-column blocks ───────────────────────── */

.materials {
  display: grid;
  grid-template-columns: 60% 40%;
  gap: 96px;
  align-items: center;
}
.materials .visual { aspect-ratio: 4 / 5; border-radius: 2px; }
.materials .copy h2 { font-size: clamp(28px, 3vw, 36px); margin-bottom: 28px; }
.materials .copy p { font-size: 16px; line-height: 1.8; color: rgba(13,13,13,0.7); margin-bottom: 32px; }
.materials .copy .eyebrow { color: var(--stone); margin-bottom: 24px; }
.materials .links { display: flex; flex-direction: column; gap: 12px; }
@media (max-width: 900px) {
  .materials { grid-template-columns: 1fr; gap: 56px; }
}

/* ─── Trust ─────────────────────────────────────────────── */

.trust h2 { font-size: clamp(28px, 3.2vw, 40px); margin: 28px auto 36px; max-width: 760px; }
.trust .lede { font-size: 17px; line-height: 1.75; color: rgba(13,13,13,0.7); max-width: 580px; margin: 0 auto 64px; }
.markers { display: inline-flex; align-items: center; gap: 0; }
.markers span {
  font-size: 12px; letter-spacing: 0.02em;  color: rgba(13,13,13,0.62);
  padding: 0 28px;
  border-right: 1px solid var(--border);
}
.markers span:last-child { border-right: none; }
@media (max-width: 640px) {
  .markers { flex-direction: column; gap: 16px; }
  .markers span { border-right: none; padding: 0; }
}

/* ─── Made in Italy ─────────────────────────────────────── */

.mii { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 96px; align-items: center; }
.mii .copy .eyebrow { color: var(--stone); margin-bottom: 24px; }
.mii .copy h2 { font-size: clamp(28px, 3vw, 36px); margin-bottom: 28px; }
.mii .copy p { font-size: 16px; line-height: 1.8; color: rgba(13,13,13,0.7); margin-bottom: 20px; }
.mii .addr { font-size: 13px; color: var(--stone); letter-spacing: 0.02em; }
.mii .visual { aspect-ratio: 5 / 4; border-radius: 2px; }
@media (max-width: 900px) {
  .mii { grid-template-columns: 1fr; gap: 56px; }
  .mii .copy { order: 1; }
  .mii .visual { order: 2; }
}

/* ─── CTA dark ──────────────────────────────────────────── */

.cta { background: var(--ink); color: var(--bg); text-align: center; padding: 180px 0; }
.cta h2 { color: var(--bg); font-size: clamp(32px, 3.8vw, 48px); margin-bottom: 32px; max-width: 760px; margin-left: auto; margin-right: auto; }
.cta p { font-size: 17px; color: rgba(255,255,255,0.65); max-width: 520px; margin: 0 auto 36px; line-height: 1.65; }
.cta-row { display: inline-flex; align-items: center; gap: 40px; flex-wrap: wrap; justify-content: center; }
.cta-link {
  color: rgba(255,255,255,0.6);
  font-size: 13px; letter-spacing: 0.02em;  border-bottom: 1px solid transparent; padding-bottom: 4px;
  cursor: pointer;
  transition: color 0.4s ease, border-color 0.4s ease;
}
.cta-link:hover { color: var(--bg); border-bottom-color: rgba(255,255,255,0.6); }
@media (max-width: 900px) { .cta { padding: 120px 0; } }

/* ─── Footer ────────────────────────────────────────────── */

footer { background: var(--sand); padding: 96px 0 48px; }
.foot-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 56px; }
.foot-col h5, .foot-col .foot-heading {
  font-family: var(--font-sans);
  font-size: 12px; letter-spacing: 0.02em;  color: rgba(13,13,13,0.58); font-weight: 500;
  margin-bottom: 24px;
}
.foot-brand .wordmark { font-size: 16px; margin-bottom: 16px; display: block; }
.foot-brand .small { font-size: 13px; color: rgba(13,13,13,0.62); line-height: 1.7; }
.foot-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.foot-col a { font-size: 14px; color: rgba(13,13,13,0.72); transition: color 0.25s; cursor: pointer; }
.foot-col a:hover { color: var(--ink); }
.foot-bottom {
  margin-top: 72px; padding-top: 28px;
  display: flex; justify-content: space-between; align-items: center;
  font-size: 12px; color: rgba(13,13,13,0.5); letter-spacing: 0.01em;
}
@media (max-width: 900px) {
  .foot-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
  .foot-bottom { flex-direction: column; gap: 12px; align-items: flex-start; margin-top: 56px; }
}
@media (max-width: 540px) { .foot-grid { grid-template-columns: 1fr; } }

/* ─── Model Detail ──────────────────────────────────────── */

.pdp {
  display: grid;
  grid-template-columns: 55% 45%;
  gap: 80px;
  align-items: start;
}
.pdp-back { display: inline-block; margin-bottom: 32px; font-size: 13px; }
.pdp .gallery-main { aspect-ratio: 4 / 5; }
.pdp .gallery-thumbs {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 16px;
}
.pdp .gallery-thumbs > div { aspect-ratio: 1 / 1; }
.pdp .info { padding-top: 8px; position: sticky; top: 96px; }
.pdp .info .eyebrow { color: var(--muted); margin-bottom: 20px; display: inline-block; }
.pdp .info h1 { font-size: clamp(28px, 3vw, 40px); margin-bottom: 24px; }
.pdp .info .desc { font-size: 16px; color: rgba(13,13,13,0.7); line-height: 1.75; margin-bottom: 32px; }
.pdp .divider { height: 1px; background: var(--border); margin: 32px 0; }
.pdp h3 {
  font-family: var(--font-sans);
  font-size: 13px; font-weight: 700;
  letter-spacing: 0.02em;  margin-bottom: 20px;
  color: rgba(13,13,13,0.62);
}
.spec-row {
  display: grid; grid-template-columns: 140px 1fr; gap: 16px;
  padding: 12px 0;
  font-size: 14px;
  border-bottom: 1px solid rgba(213, 207, 197, 0.5);
}
.spec-row:last-child { border-bottom: none; }
.spec-row .label { color: rgba(13,13,13,0.62); font-size: 13px; letter-spacing: 0.01em; padding-top: 2px; }
.spec-row .value { color: rgba(13,13,13,0.85); line-height: 1.6; }
.pdp .price-note { font-size: 14px; color: rgba(13,13,13,0.55); line-height: 1.6; margin: 24px 0 32px; }
.pdp .ctas { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
.pdp .ctas .btn-primary { width: 100%; justify-content: space-between; padding: 0 28px; }
@media (max-width: 900px) {
  .pdp { grid-template-columns: 1fr; gap: 40px; }
  .pdp .info { position: static; }
}

/* ─── Customization axes (private label) ────────────────── */

.axes-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--border); margin-top: 72px; }
.axis {
  background: var(--bg);
  padding: 56px 40px;
}
.axis .num { font-family: var(--font-sans); font-size: 52px; color: var(--leather); opacity: 0.32; line-height: 1; margin-bottom: 24px; }
.axis h3 { font-family: var(--font-sans); font-size: 18px; font-weight: 700; margin-bottom: 14px; }
.axis p { font-size: 14.5px; color: rgba(13,13,13,0.65); line-height: 1.7; }
@media (max-width: 900px) {
  .axes-grid { grid-template-columns: 1fr; }
}

/* ─── Alternating editorial sections ────────────────────── */

.alt-row {
  display: grid; grid-template-columns: 50% 50%; gap: 96px;
  align-items: center;
  margin-bottom: 140px;
}
.alt-row:last-child { margin-bottom: 0; }
.alt-row.reverse > :first-child { order: 2; }
.alt-row .visual { aspect-ratio: 4 / 5; }
.alt-row .copy .eyebrow { color: var(--stone); margin-bottom: 20px; }
.alt-row .copy h2 { font-size: clamp(26px, 3vw, 36px); margin-bottom: 24px; }
.alt-row .copy h3 { font-family: var(--font-sans); font-size: 28px; margin-bottom: 20px; }
.alt-row .copy p { font-size: 16px; color: rgba(13,13,13,0.7); line-height: 1.8; margin-bottom: 16px; }
.alt-row .step-num {
  font-family: var(--font-sans);
  font-size: 110px; line-height: 0.9;
  color: var(--leather); opacity: 0.18;
  margin-bottom: 16px;
}
@media (max-width: 900px) {
  .alt-row { grid-template-columns: 1fr; gap: 40px; margin-bottom: 80px; }
  .alt-row.reverse > :first-child { order: 0; }
}

/* ─── Process page deep ─────────────────────────────────── */

.proc-subblock {
  display: grid; grid-template-columns: auto 1fr; gap: 16px 24px;
  margin-top: 20px;
}
.proc-subblock dt {
  font-size: 13px; letter-spacing: 0; color: var(--muted);
  font-weight: 500;
  padding-top: 4px;
}
.proc-subblock dd {
  margin: 0;
  font-size: 15.5px;
  color: rgba(13,13,13,0.78);
  line-height: 1.7;
}

/* ─── Materials cards ───────────────────────────────────── */

.mat-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 64px;
  margin-top: 64px;
}
.mat-card .visual { aspect-ratio: 4 / 3; margin-bottom: 32px; }
.mat-card h3 { font-family: var(--font-sans); font-size: 26px; margin-bottom: 16px; }
.mat-card p { font-size: 15.5px; color: rgba(13,13,13,0.7); line-height: 1.75; }
@media (max-width: 900px) {
  .mat-grid { grid-template-columns: 1fr; gap: 48px; }
}

/* ─── List rows (custom dev capabilities) ───────────────── */

.row-list {
  border-top: 1px solid var(--border);
  margin-top: 56px;
}
.row-list > div {
  border-bottom: 1px solid var(--border);
  padding: 28px 0;
  font-family: var(--font-sans);
  font-size: 24px;
  color: var(--ink);
}
@media (max-width: 600px) {
  .row-list > div { font-size: 20px; padding: 20px 0; }
}

/* ─── Accordion / FAQ ───────────────────────────────────── */

.accordion { border-top: 1px solid var(--border); margin-top: 48px; }
.acc-item { border-bottom: 1px solid var(--border); }
.acc-q {
  width: 100%;
  text-align: left;
  padding: 28px 0;
  display: flex; align-items: center; justify-content: space-between;
  gap: 24px;
  font-family: var(--font-sans);
  font-size: 17px;
  font-weight: 500;
  color: var(--ink);
  cursor: pointer;
  transition: color 0.3s ease;
}
.acc-q:hover { color: rgba(13,13,13,.65); }
.acc-q .acc-mark {
  flex-shrink: 0;
  width: 16px; height: 16px;
  position: relative;
}
.acc-q .acc-mark::before,
.acc-q .acc-mark::after {
  content: ''; position: absolute;
  top: 50%; left: 0; right: 0; height: 1px;
  background: currentColor;
  transition: transform 0.4s ease;
}
.acc-q .acc-mark::after { transform: rotate(90deg); }
.acc-item.open .acc-q .acc-mark::after { transform: rotate(0deg); }
.acc-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s ease;
}
.acc-body-inner {
  padding: 0 0 28px;
  font-size: 15px; color: rgba(13,13,13,0.7); line-height: 1.75;
  max-width: 760px;
}
.acc-item.open .acc-body { max-height: 640px; }

/* ─── Forms ─────────────────────────────────────────────── */

.form-grid {
  display: grid; grid-template-columns: 1.4fr 1fr; gap: 96px;
  margin-top: 72px;
}
@media (max-width: 900px) {
  .form-grid { grid-template-columns: 1fr; gap: 64px; }
}
.form-field { margin-bottom: 36px; }
.form-field label {
  display: block;
  font-size: 13px; letter-spacing: 0; color: rgba(13,13,13,0.62); font-weight: 500;
  margin-bottom: 8px;
}
.form-field input,
.form-field select,
.form-field textarea {
  width: 100%;
  border: 1px solid #DAD9D5;
  border-radius: 10px;
  background: #fff;
  padding: 12px 14px;
  font-size: 16px;
  color: var(--ink);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  outline: none;
  resize: vertical;
}
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(13,13,13,0.06); }
.form-field textarea { min-height: 120px; line-height: 1.6; }
.radio-group { display: flex; flex-wrap: wrap; gap: 10px; }
.radio-pill {
  padding: 9px 18px;
  font-size: 13px; letter-spacing: 0; font-weight: 500;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: transparent; color: rgba(13,13,13,0.65);
  cursor: pointer;
  transition: all 0.3s ease;
}
.radio-pill:hover { color: var(--ink); }
.radio-pill.active { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.form-submit { width: 100%; height: 56px; margin-top: 16px; }
.form-submit[disabled] { opacity: 0.6; cursor: default; }
.form-error {
  color: #9a3412; font-size: 14px; margin-top: 16px; display: none;
}
.form-error.show { display: block; }

.contact-info h2, .contact-info h3 {
  font-family: var(--font-sans);
  font-size: 13px; letter-spacing: 0; color: rgba(13,13,13,0.62); font-weight: 500;
  margin-bottom: 14px;
}
.contact-info .block { margin-bottom: 40px; padding-bottom: 40px; border-bottom: 1px solid var(--border); }
.contact-info .block:last-child { border-bottom: none; }
.contact-info .lines { font-size: 15px; line-height: 1.85; color: rgba(13,13,13,0.78); }

/* ─── Journal grid ──────────────────────────────────────── */

.jrn-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 64px 56px;
  margin-top: 72px;
}
.jrn-card .visual { aspect-ratio: 16 / 10; margin-bottom: 24px; transition: transform 0.6s; }
.jrn-card:hover .visual { transform: scale(1.02); }
.jrn-card .cat {
  font-size: 13px; letter-spacing: 0; color: var(--muted); font-weight: 500;
  margin-bottom: 12px;
}
.jrn-card h2, .jrn-card h3 { font-family: var(--font-sans); font-size: 24px; line-height: 1.25; margin-bottom: 12px; }
.jrn-card p { font-size: 14.5px; color: rgba(13,13,13,0.6); line-height: 1.65; margin-bottom: 16px; }
.jrn-card { cursor: pointer; }
@media (max-width: 700px) {
  .jrn-grid { grid-template-columns: 1fr; gap: 48px; }
}

/* Inline toast */
.toast {
  position: fixed; bottom: 32px; left: 50%; transform: translateX(-50%) translateY(80px);
  background: var(--ink); color: #fff;
  padding: 14px 22px;
  border-radius: 12px;
  font-size: 14px; letter-spacing: 0;  z-index: 300;
  opacity: 0;
  transition: opacity 0.4s ease, transform 0.4s ease;
}
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* Cookie / consent banner (GDPR — analytics + marketing) */
.consent-banner {
  position: fixed; z-index: 300;
  left: 24px; right: 24px; bottom: 24px;
  max-width: 720px; margin: 0 auto;
  display: flex; align-items: center; gap: 24px; flex-wrap: wrap;
  justify-content: space-between;
  padding: 18px 22px;
  background: var(--ink); color: #fff;
  border-radius: 14px;
  box-shadow: 0 18px 50px rgba(13,13,13,0.28);
  opacity: 0; transform: translateY(16px);
  transition: opacity 0.4s ease, transform 0.4s ease;
}
.consent-banner.show { opacity: 1; transform: translateY(0); }
.consent-banner p { flex: 1; min-width: 240px; font-size: 13.5px; line-height: 1.55; color: rgba(255,255,255,0.82); }
.consent-banner a { color: #fff; text-decoration: underline; text-underline-offset: 2px; }
.consent-actions { display: flex; gap: 10px; flex-shrink: 0; }
.consent-banner button {
  height: 40px; padding: 0 20px; border-radius: 999px;
  font-size: 13px; font-weight: 500; cursor: pointer;
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}
.consent-decline { background: transparent; color: rgba(255,255,255,0.8); border: 1px solid rgba(255,255,255,0.32); }
.consent-decline:hover { border-color: #fff; color: #fff; }
.consent-accept { background: #fff; color: var(--ink); border: 1px solid #fff; }
.consent-accept:hover { background: var(--story-warm, #e9e7e3); }
@media (max-width: 600px) {
  .consent-banner { left: 12px; right: 12px; bottom: 12px; padding: 16px; }
  .consent-actions { width: 100%; }
  .consent-banner button { flex: 1; }
}

/* Sectioned narrative (about) */
.prose {
  max-width: 720px; margin: 0 auto;
  font-size: 17px; color: rgba(13,13,13,0.78);
  line-height: 1.85;
}
.prose p { margin-bottom: 28px; }
.prose p:last-child { margin-bottom: 0; }
.prose h2 {
  font-family: var(--font-sans);
  font-size: clamp(23px, 2.6vw, 30px);
  letter-spacing: -0.01em;
  margin: 48px 0 18px;
}
.prose h3 {
  font-family: var(--font-sans);
  font-size: 18px; font-weight: 700;
  margin: 32px 0 12px;
}
.prose ul { margin: 0 0 28px; padding-left: 22px; }
.prose li { margin-bottom: 10px; }
.prose strong { font-weight: 700; color: var(--ink); }
.prose em { color: rgba(13,13,13,0.6); }
.prose a { color: var(--ink); border-bottom: 1px solid rgba(13,13,13,0.3); }
.prose a:hover { border-bottom-color: var(--ink); }

/* Journal card meta + article page */
.jrn-meta {
  font-size: 11px; letter-spacing: 0.02em;  color: rgba(13,13,13,0.58); margin-top: 14px;
}
.article-meta {
  font-size: 12px; letter-spacing: 0.02em;  color: rgba(13,13,13,0.62); margin-top: 24px;
}
.article-figure {
  height: clamp(220px, 38vw, 440px);
  border-radius: 2px;
}
.article-foot {
  max-width: 720px; margin: 64px auto 0;
  display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  border-top: 1px solid var(--border); padding-top: 32px;
}

/* Visitor address tile */
.info-tile {
  border-left: 1px solid var(--border);
  padding-left: 32px;
}
@media (max-width: 900px) {
  .info-tile { border-left: none; border-top: 1px solid var(--border); padding-left: 0; padding-top: 32px; }
}

/* ─── Breadcrumbs ───────────────────────────────────────── */
.breadcrumb {
  font-size: 12px; letter-spacing: 0.02em;
  color: rgba(13,13,13,0.62);
  margin-bottom: 24px;
}
.breadcrumb a { color: rgba(13,13,13,0.62); transition: color 0.25s; }
.breadcrumb a:hover { color: var(--ink); }
.breadcrumb .sep { margin: 0 8px; opacity: 0.5; }

/* ─── Accessibility ─────────────────────────────────────── */
.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 400;
  background: var(--ink); color: var(--bg);
  padding: 12px 20px; font-size: 13px; letter-spacing: 0.02em;
}
.skip-link:focus { left: 8px; top: 8px; }
:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 3px;
}
.nav-cta:focus-visible, .btn-primary:focus-visible, .btn-outline-light:focus-visible { outline-offset: 4px; }

/* Honeypot — visually hidden, off-screen, not announced */
.hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px; height: 1px; overflow: hidden;
}

/* ─── Admin ─────────────────────────────────────────────── */
.del-btn {
  font-size: 11px; letter-spacing: 0.02em;  color: #9a3412; border: 1px solid #d9c2b5; padding: 6px 12px;
  background: transparent; transition: all 0.25s ease; white-space: nowrap;
}
.del-btn:hover { background: #9a3412; color: var(--bg); border-color: #9a3412; }
.admin-wrap { max-width: 1100px; margin: 0 auto; padding: 120px 24px 80px; }
.admin-login { max-width: 360px; margin: 0 auto; }
.admin-table { width: 100%; border-collapse: collapse; font-size: 14px; margin-top: 24px; }
.admin-table th, .admin-table td { text-align: left; padding: 12px 14px; border-bottom: 1px solid var(--border); vertical-align: top; }
.admin-table th { font-size: 11px; letter-spacing: 0.02em; text-transform: uppercase; color: rgba(13,13,13,0.62); }
.admin-table tr:hover td { background: var(--cream); }
.admin-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.admin-table .desc-cell { max-width: 360px; white-space: pre-wrap; }
/* ── Admin management platform ─────────────────────── */
.admin-wrap { max-width: 1180px; }
.admin-shell { display: grid; grid-template-columns: 200px 1fr; gap: 32px; margin-top: 24px; }
.admin-nav { display: flex; flex-direction: column; gap: 2px; position: sticky; top: 24px; align-self: start; }
.admin-nav-item { text-align: left; background: none; border: 0; border-left: 2px solid transparent; padding: 9px 14px; font: inherit; font-size: 14px; color: rgba(13,13,13,0.6); cursor: pointer; border-radius: 0 6px 6px 0; }
.admin-nav-item:hover { background: var(--cream); color: var(--ink); }
.admin-nav-item.active { color: var(--ink); border-left-color: var(--leather); background: var(--cream); font-weight: 500; }
.admin-view { min-width: 0; }
.admin-h2 { font-size: 24px; margin-bottom: 18px; }
.admin-muted { color: rgba(13,13,13,0.5); }
.admin-block { margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--border); }
.admin-block h3 { font-size: 14px; letter-spacing: 0.02em; text-transform: uppercase; color: rgba(13,13,13,0.62); margin-bottom: 14px; }
.admin-input { width: 100%; padding: 9px 12px; border: 1px solid var(--border); border-radius: 6px; font: inherit; font-size: 14px; background: #fff; }
.admin-input:focus { outline: none; border-color: var(--leather); }
.admin-toolbar { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 18px; }
.admin-toolbar .admin-input { width: auto; flex: 1; min-width: 200px; }

.btn-mini { background: var(--ink); color: #fff; border: 0; border-radius: 6px; padding: 8px 16px; font: inherit; font-size: 13px; cursor: pointer; }
.btn-mini:hover { background: var(--leather); }
.btn-mini.danger { background: none; color: #b42318; border: 1px solid rgba(180,35,24,0.35); }
.btn-mini.danger:hover { background: #b42318; color: #fff; }

.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 16px; }
.stat-card { border: 1px solid var(--border); border-radius: 10px; padding: 20px; background: var(--cream); }
.stat-val { font-size: 30px; font-weight: 700; font-family: var(--font-sans); }
.stat-label { font-size: 12px; letter-spacing: 0.02em; text-transform: uppercase; color: rgba(13,13,13,0.55); margin-top: 6px; }
.chips { display: flex; gap: 8px; flex-wrap: wrap; }
.chip { background: var(--cream); border: 1px solid var(--border); border-radius: 20px; padding: 5px 14px; font-size: 13px; }
.badge { display: inline-block; background: #fde68a; color: #92400e; border-radius: 4px; padding: 1px 7px; font-size: 11px; margin-right: 6px; }

.brief-list { display: flex; flex-direction: column; gap: 14px; }
.brief-card { border: 1px solid var(--border); border-radius: 10px; padding: 16px 18px; }
.brief-card-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; flex-wrap: wrap; }
.brief-card-body { margin-top: 12px; font-size: 14px; }
.brief-desc { white-space: pre-wrap; margin: 10px 0; color: rgba(13,13,13,0.8); }
.brief-card-actions { display: flex; gap: 10px; margin-top: 10px; }
.brief-files { margin: 8px 0; font-size: 13px; }
.brief-files a { color: var(--leather); }
.attach-list { font-size: 13px; color: rgba(13,13,13,0.6); margin-top: 8px; }
.attach-list.error { color: #9a3412; }
.form-privacy { max-width: 560px; margin-top: 16px; font-size: 12px; line-height: 1.6; color: rgba(13,13,13,.56); }
.form-privacy a { text-decoration: underline; text-underline-offset: 2px; }

.cms-list { display: flex; flex-direction: column; gap: 8px; }
.cms-item { border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.cms-item summary { padding: 13px 16px; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 15px; }
.cms-item summary::-webkit-details-marker { display: none; }
.cms-reorder { display: inline-flex; gap: 4px; }
.cms-form { padding: 6px 16px 18px; }
.cms-form-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 12px; flex-wrap: wrap; }
.cms-actions { display: flex; gap: 10px; }
.cms-check { font-size: 14px; display: inline-flex; gap: 7px; align-items: center; }
.cms-image { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.cms-thumb { width: 72px; height: 72px; object-fit: cover; border-radius: 6px; border: 1px solid var(--border); }

.media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 16px; }
.media-card { border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.media-card img { width: 100%; height: 130px; object-fit: cover; display: block; }
.media-meta { padding: 8px 10px; font-size: 12px; word-break: break-all; }
.media-meta code { font-size: 11px; }
.media-actions { display: flex; gap: 8px; padding: 0 10px 10px; }
.retention-list { display: grid; gap: 8px; max-width: 720px; margin: 0 0 16px; }
.retention-list > div { display: flex; justify-content: space-between; gap: 20px; padding: 9px 0; border-bottom: 1px solid var(--admin-border); }
.retention-list span { color: var(--admin-text); }
.retention-list small { color: var(--admin-muted); text-align: right; }

@media (max-width: 760px) {
  .admin-shell { grid-template-columns: 1fr; }
  .admin-nav { flex-direction: row; flex-wrap: wrap; position: static; }
  .admin-nav-item { border-left: 0; border-bottom: 2px solid transparent; border-radius: 6px; }
  .admin-nav-item.active { border-left: 0; border-bottom-color: var(--leather); }
}

/* v46 — B2B page architecture: inner pages are purpose-built, while the
   homepage retains the client-approved catalogue layout. */
body:not(.admin-body) .section-heading { max-width: 760px; margin-bottom: 42px; }
body:not(.admin-body) .section-heading .eyebrow { color: #56514b; }
body:not(.admin-body) .section-heading h2 {
  margin-top: 18px;
  font-family: var(--font-serif);
  font-size: clamp(30px, 3.4vw, 46px);
  line-height: 1.14;
  letter-spacing: -.015em;
}

body:not(.admin-body) .b2b-cap-grid,
body:not(.admin-body) .about-proof-grid,
body:not(.admin-body) .blog-topic-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  border: 1px solid #d8d2ca;
  background: #d8d2ca;
}
body:not(.admin-body) .b2b-cap-card,
body:not(.admin-body) .about-proof-card,
body:not(.admin-body) .blog-topic-card {
  min-height: 245px;
  padding: 34px 30px;
  background: #f8f6f3;
}
body:not(.admin-body) .b2b-cap-card > span,
body:not(.admin-body) .about-proof-card > span,
body:not(.admin-body) .blog-topic-card > span {
  display: block;
  margin-bottom: 42px;
  color: #5e5851;
  font-size: 10px;
  letter-spacing: .14em;
}
body:not(.admin-body) .b2b-cap-card h3,
body:not(.admin-body) .about-proof-card h3,
body:not(.admin-body) .blog-topic-card h2 {
  margin-bottom: 14px;
  font-family: var(--font-sans);
  font-size: 17px;
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: .035em;
  text-transform: uppercase;
}
body:not(.admin-body) .b2b-cap-card p,
body:not(.admin-body) .about-proof-card p,
body:not(.admin-body) .blog-topic-card p { color: #625d57; font-size: 13px; line-height: 1.65; }
body:not(.admin-body) .blog-topic-grid { grid-template-columns: repeat(4, 1fr); }
body:not(.admin-body) .blog-topic-card { min-height: 280px; display: flex; flex-direction: column; }
body:not(.admin-body) .blog-topic-card > span { margin-bottom: 36px; }
body:not(.admin-body) .blog-topic-card b { margin-top: auto; padding-top: 24px; font-size: 10px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }

body:not(.admin-body) .manufacturing-proof { background: #e9e4dd; }
body:not(.admin-body) .manufacturing-proof-copy { max-width: 820px; margin-bottom: 48px; }
body:not(.admin-body) .manufacturing-proof-copy h2 { margin: 18px 0; font-family: var(--font-serif); font-size: clamp(30px, 3.5vw, 48px); line-height: 1.12; }
body:not(.admin-body) .manufacturing-proof-copy p { max-width: 690px; color: #625d57; font-size: 15px; line-height: 1.75; }
body:not(.admin-body) .manufacturing-proof-media { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
body:not(.admin-body) .manufacturing-proof-media figure { background: #f8f6f3; }
body:not(.admin-body) .manufacturing-proof-media img { width: 100%; height: 390px; object-fit: cover; display: block; filter: saturate(.62) contrast(.94); }
body:not(.admin-body) .manufacturing-proof-media figcaption { min-height: 62px; padding: 20px 22px; color: #56514b; font-size: 11px; line-height: 1.5; letter-spacing: .04em; text-transform: uppercase; }
body:not(.admin-body) .contact-link-row { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }

/* Seven concise B2B navigation labels fit cleanly at desktop widths. */
@media (min-width: 1121px) {
  body:not(.admin-body) .nav-inner { gap: clamp(18px, 2vw, 28px); }
  body:not(.admin-body) .nav-wordmark { min-width: 170px; }
  body:not(.admin-body) .nav-links { gap: clamp(13px, 1.35vw, 22px); }
  body:not(.admin-body) .nav-links a { font-size: 10px; }
}
@media (max-width: 1000px) {
  body:not(.admin-body) .b2b-cap-grid,
  body:not(.admin-body) .about-proof-grid { grid-template-columns: repeat(2, 1fr); }
  body:not(.admin-body) .blog-topic-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  body:not(.admin-body) .section-heading { margin-bottom: 30px; }
  body:not(.admin-body) .b2b-cap-grid,
  body:not(.admin-body) .about-proof-grid,
  body:not(.admin-body) .blog-topic-grid,
  body:not(.admin-body) .manufacturing-proof-media { grid-template-columns: 1fr; }
  body:not(.admin-body) .b2b-cap-card,
  body:not(.admin-body) .about-proof-card,
  body:not(.admin-body) .blog-topic-card { min-height: 0; padding: 28px 24px; }
  body:not(.admin-body) .b2b-cap-card > span,
  body:not(.admin-body) .about-proof-card > span,
  body:not(.admin-body) .blog-topic-card > span { margin-bottom: 26px; }
  body:not(.admin-body) .manufacturing-proof-media img { height: 270px; }
}
@media (max-width: 760px) {
  .admin-table, .admin-table tbody, .admin-table tr, .admin-table td { display: block; width: 100%; }
  .admin-table thead { display: none; }
  .admin-table tr { border: 1px solid var(--border); margin-bottom: 16px; padding: 8px; }
  .admin-table td { border: none; padding: 6px 8px; }
  .admin-table td::before { content: attr(data-label); display: block; font-size: 10px; letter-spacing: 0.02em; text-transform: uppercase; color: rgba(13,13,13,0.62); margin-bottom: 2px; }
}

/* ─── Narrative system — OpenAI-inspired ─────────────────
   White canvas, near-black ink, one copper accent, restrained
   type scale, pill controls, large-radius media blocks. */

:root {
  --story-paper: #ffffff;
  --story-ink: #0d0d0d;
  --story-line: rgba(13, 13, 13, 0.12);
  --story-copper: #9a5b35;
  --story-warm: #e9e7e3;
}

body { background: var(--story-paper); }

.nav {
  height: 68px;
  background: rgba(255, 255, 255, 0.88);
  border-bottom-color: var(--story-line);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.nav.scrolled, .nav.solid { background: rgba(255, 255, 255, 0.92); border-bottom-color: var(--story-line); }
.nav-inner { max-width: none; padding: 0 32px; }
.wordmark { font-family: var(--font-sans); font-size: 19px; font-weight: 600; letter-spacing: -0.02em; }
.nav-links { gap: 4px; }
.nav-links a {
  font-size: 14px; opacity: 0.85;
  padding: 8px 13px; border-radius: 10px;
  transition: background .2s ease, opacity .2s ease;
}
.nav-links a:hover, .nav-links a.active { background: rgba(13,13,13,.05); opacity: 1; }
.nav-cta {
  background: var(--story-ink); color: #fff; border-color: var(--story-ink);
  padding: 10px 18px; border-radius: 999px; letter-spacing: 0; text-transform: none; font-size: 14px;
}
.nav-cta:hover { background: #2f2f2f; border-color: #2f2f2f; }

.story-section-label {
  display: block; font-size: 14px; line-height: 1.3; font-weight: 500;
  letter-spacing: 0; color: var(--muted);
}

footer { background: var(--bg); color: var(--ink); }
footer .wordmark { color: var(--ink); }
footer .foot-col a { color: rgba(13,13,13,.65); }
footer .foot-col a:hover { color: var(--ink); }
footer .foot-col h5, footer .foot-col .foot-heading, footer .foot-brand .small, footer .foot-bottom { color: rgba(13,13,13,.62); }

@media (max-width: 900px) {
  .nav { height: 60px; }
  .nav-inner { padding: 0 20px; }
}

/* ─── Unified product admin — ChatGPT-inspired proportions ───────────── */
.admin-body {
  --admin-bg: #fff;
  --admin-sidebar: #f7f7f8;
  --admin-hover: #ececee;
  --admin-border: #e5e5e5;
  --admin-text: #171717;
  --admin-muted: #737373;
  margin: 0; background: var(--admin-bg); color: var(--admin-text);
  font: 14px/1.5 var(--font-sans);
}
.admin-body #main { min-height: 100vh; }
.admin-body h1, .admin-body h2, .admin-body h3, .admin-body h4 { font-family: var(--font-sans); }
.admin-root { min-height: 100vh; }

.admin-auth { min-height: 100vh; display: grid; place-items: center; padding: 48px 24px; background: #fff; }
.admin-auth-card { width: min(100%, 400px); }
.admin-brand { display: inline-flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 600; letter-spacing: -.02em; }
.admin-brand-mark { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: #171717; color: #fff; font-size: 13px; font-weight: 600; }
.admin-auth-copy { margin: 70px 0 34px; }
.admin-overline { display: block; margin-bottom: 10px; color: var(--admin-muted); font-size: 11px; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; }
.admin-auth-copy h1 { margin: 0 0 10px; font-size: 32px; line-height: 1.1; font-weight: 600; letter-spacing: -0.02em; }
.admin-auth-copy p { color: var(--admin-muted); font-size: 15px; }
.admin-body .admin-field { margin-bottom: 18px; }
.admin-body .admin-field label, .admin-body .cms-form label, .admin-body .admin-form-surface label {
  display: block; margin: 0 0 7px; color: #525252; font-size: 13px; font-weight: 500; letter-spacing: 0; text-transform: none;
}
.admin-body .admin-field input, .admin-body .admin-input {
  width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid #d9d9d9; border-radius: 9px;
  background: #fff; color: var(--admin-text); font: inherit; outline: none; transition: border-color .15s, box-shadow .15s, background .15s;
}
.admin-body .admin-field input:focus, .admin-body .admin-input:focus { border-color: #a3a3a3; box-shadow: 0 0 0 3px rgba(0,0,0,.055); }
.admin-primary { width: 100%; min-height: 46px; margin-top: 8px; border: 0; border-radius: 9px; background: #171717; color: #fff; font: inherit; font-weight: 600; }
.admin-primary:hover { background: #2d2d2d; }
.admin-primary[disabled] { opacity: .55; cursor: wait; }
.admin-auth-note { margin-top: 22px; text-align: center; color: #a3a3a3; font-size: 12px; }
.admin-body .form-error { margin-top: 14px; font-size: 13px; }

.admin-app { grid-template-columns: 260px minmax(0, 1fr); min-height: 100vh; background: #fff; }
.admin-sidebar { position: fixed; z-index: 40; inset: 0 auto 0 0; width: 260px; display: flex; flex-direction: column; padding: 14px 12px; border-right: 1px solid var(--admin-border); background: var(--admin-sidebar); }
.admin-sidebar-head { height: 44px; padding: 4px 8px 12px; display: flex; align-items: center; justify-content: space-between; }
.admin-sidebar-head .admin-brand-mark { width: 28px; height: 28px; border-radius: 8px; }
.admin-workspace-badge { padding: 3px 7px; border: 1px solid #ddd; border-radius: 6px; color: #737373; background: #fff; font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; }
.admin-nav { position: static; display: flex; flex-direction: column; gap: 2px; margin-top: 18px; }
.admin-nav-item { width: 100%; min-height: 40px; display: flex; align-items: center; gap: 11px; padding: 0 10px; border: 0; border-radius: 8px; background: transparent; color: #525252; text-align: left; font: inherit; font-size: 14px; }
.admin-nav-item svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.45; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 auto; }
.admin-nav-item:hover { background: var(--admin-hover); color: #171717; }
.admin-nav-item.active { background: #e8e8ea; color: #171717; font-weight: 500; }
.admin-sidebar-foot { margin-top: auto; padding-top: 14px; border-top: 1px solid #e2e2e2; }
.admin-site-link { min-height: 38px; padding: 0 10px; display: flex; align-items: center; justify-content: space-between; border-radius: 8px; color: #525252; font-size: 13px; }
.admin-site-link:hover { background: var(--admin-hover); color: #171717; }
.admin-user-row { display: grid; grid-template-columns: 30px 1fr 30px; gap: 9px; align-items: center; margin-top: 8px; padding: 8px; border-radius: 9px; }
.admin-avatar { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #d6bda9; color: #5d3824; font-size: 12px; font-weight: 600; }
.admin-who { min-width: 0; overflow: hidden; text-overflow: ellipsis; color: #404040; font-size: 13px; white-space: nowrap; }
.admin-user-row button { width: 30px; height: 30px; border-radius: 7px; color: #737373; }
.admin-user-row button:hover { background: #ddd; color: #171717; }
.admin-sidebar-scrim { display: none; }

.admin-main { grid-column: 2; min-width: 0; min-height: 100vh; }
.admin-topbar { position: sticky; z-index: 25; top: 0; height: 56px; padding: 0 28px; display: flex; align-items: center; gap: 16px; border-bottom: 1px solid var(--admin-border); background: rgba(255,255,255,.92); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.admin-topbar > span { font-weight: 500; }
.admin-top-action { margin-left: auto; color: #525252; font-size: 13px; }
.admin-top-action:hover { color: #171717; }
.admin-menu-toggle { display: none; width: 34px; height: 34px; border-radius: 7px; font-size: 17px; }
.admin-content { width: min(100%, 1280px); margin: 0 auto; padding: 48px 56px 80px; }
.admin-view { min-width: 0; }
.admin-page-head { min-height: 92px; margin-bottom: 30px; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
.admin-page-head h2 { margin: 0; font-size: 30px; font-weight: 600; line-height: 1.1; letter-spacing: -0.02em; }
.admin-page-head p { max-width: 620px; margin-top: 10px; color: var(--admin-muted); font-size: 14px; }
.admin-muted { color: var(--admin-muted); }
.admin-secondary, .btn-mini { min-height: 38px; display: inline-flex; align-items: center; justify-content: center; gap: 14px; padding: 0 14px; border: 1px solid #d7d7d7; border-radius: 8px; background: #fff; color: #262626; font: inherit; font-size: 13px; font-weight: 500; white-space: nowrap; }
.admin-secondary:hover, .btn-mini:hover { background: #f5f5f5; border-color: #c8c8c8; }
.btn-mini { min-height: 34px; padding: 0 12px; }
.btn-mini.danger { border-color: #ead0cc; background: #fff; color: #b42318; }
.btn-mini.danger:hover { background: #fff2f0; color: #991b1b; }
.admin-loading { height: 180px; display: flex; align-items: center; justify-content: center; gap: 5px; }
.admin-loading span { width: 5px; height: 5px; border-radius: 50%; background: #a3a3a3; animation: adminPulse 1s infinite alternate; }
.admin-loading span:nth-child(2) { animation-delay: .15s; }.admin-loading span:nth-child(3) { animation-delay: .3s; }
@keyframes adminPulse { to { opacity: .25; transform: translateY(-3px); } }

.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(145px,1fr)); gap: 12px; }
.stat-card { min-height: 116px; padding: 20px; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid var(--admin-border); border-radius: 12px; background: #fff; }
.stat-val { font: 600 28px/1 var(--font-sans); letter-spacing: -0.02em; }
.stat-label { color: var(--admin-muted); font-size: 12px; font-weight: 500; letter-spacing: 0; text-transform: none; }
.admin-dashboard-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 14px; margin-top: 14px; }
.admin-surface { margin-top: 14px; padding: 22px; border: 1px solid var(--admin-border); border-radius: 12px; background: #fff; }
.admin-dashboard-grid .admin-surface { margin-top: 0; min-height: 244px; }
.admin-surface-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.admin-surface-head h3 { margin: 0; color: #262626; font-size: 14px; font-weight: 600; letter-spacing: 0; text-transform: none; }
.admin-surface-head > span { color: #737373; font-size: 12px; }
.admin-surface-head button { color: #737373; font: inherit; font-size: 12px; }
.admin-breakdown-row { margin-bottom: 18px; }
.admin-breakdown-row:last-child { margin-bottom: 0; }
.admin-breakdown-row > div { display: grid; grid-template-columns: 9px 1fr auto; gap: 8px; align-items: center; margin-bottom: 7px; font-size: 12px; }
.admin-breakdown-row strong { font-weight: 500; }
.admin-status-dot { width: 7px; height: 7px; border-radius: 50%; background: #a3a3a3; }
.status-new { --status:#7c3aed; }.status-contacted { --status:#2563eb; }.status-quoted { --status:#d97706; }.status-won { --status:#16803a; }.status-lost { --status:#dc2626; }.status-archived { --status:#737373; }
.admin-status-dot { background: var(--status, #a3a3a3); }
.admin-breakdown-track { display: block; height: 4px; overflow: hidden; border-radius: 99px; background: #f0f0f0; }
.admin-breakdown-track i { display: block; height: 100%; border-radius: inherit; background: #171717; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { min-height: 36px; padding: 0 12px; display: inline-flex; align-items: center; gap: 16px; border: 1px solid var(--admin-border); border-radius: 8px; background: #fafafa; font-size: 12px; }
.chip strong { margin-left: auto; font-weight: 600; }
.admin-recent { padding-bottom: 8px; }
.admin-empty { color: var(--admin-muted); font-size: 13px; }
.admin-table { width: 100%; margin: 0; border-collapse: collapse; font-size: 13px; }
.admin-table th, .admin-table td { padding: 13px 10px; border-bottom: 1px solid #ededed; text-align: left; vertical-align: middle; }
.admin-table th { color: #666; font-size: 11px; font-weight: 500; letter-spacing: .02em; text-transform: none; }
.admin-table tbody tr:last-child td { border-bottom: 0; }
.admin-table tr:hover td { background: #fafafa; }
.admin-table-primary, .admin-table-secondary { display: block; }.admin-table-primary { font-weight: 500; }.admin-table-secondary { margin-top: 2px; color: #8a8a8a; font-size: 12px; }

.admin-toolbar { margin-bottom: 16px; padding: 10px; display: grid; grid-template-columns: minmax(210px,1fr) repeat(4, minmax(125px, .45fr)) auto; gap: 8px; align-items: center; border: 1px solid var(--admin-border); border-radius: 11px; background: #fafafa; }
.admin-toolbar.company-toolbar { grid-template-columns: minmax(240px, 560px); }
.admin-toolbar.audit-toolbar { grid-template-columns: minmax(240px, 560px) minmax(180px, 280px); }
.admin-toolbar .admin-input { width: 100%; min-width: 0; background: #fff; }
.brief-list { display: flex; flex-direction: column; gap: 10px; }
.brief-card { padding: 20px; border: 1px solid var(--admin-border); border-radius: 12px; background: #fff; transition: box-shadow .15s, border-color .15s; }
.brief-card:hover { border-color: #d5d5d5; box-shadow: 0 5px 18px rgba(0,0,0,.035); }
.brief-card-head { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; }
.brief-reference { display: block; margin-bottom: 8px; color: #9a5b35; font-size: 10px; font-weight: 600; letter-spacing: 0.02em; }
.brief-card-head strong { display: inline-block; margin-right: 8px; font-size: 15px; font-weight: 600; }
.brief-company { color: #737373; font-size: 13px; }
.brief-meta, .brief-contact { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 7px; }
.brief-meta span, .brief-contact span, .brief-contact a { color: #737373; font-size: 12px; }
.brief-meta span:not(:last-child)::after { content: '·'; margin-left: 7px; color: #c4c4c4; }
.brief-contact a { color: #404040; text-decoration: underline; text-decoration-color: #ddd; text-underline-offset: 3px; }
.brief-status-sel { width: 138px !important; min-height: 36px !important; padding: 7px 30px 7px 11px !important; border-color: color-mix(in srgb, var(--status, #a3a3a3) 25%, #ddd) !important; background-color: color-mix(in srgb, var(--status, #a3a3a3) 6%, #fff) !important; color: #404040 !important; font-size: 12px !important; text-transform: capitalize; }
.brief-card-body { margin-top: 18px; font-size: 13px; }
.brief-desc { margin: 16px 0; padding: 14px 16px; border-radius: 9px; background: #f8f8f8; color: #404040; line-height: 1.65; white-space: pre-wrap; }
.brief-notes { min-height: 74px; resize: vertical; }
.brief-card-actions { display: flex; gap: 8px; margin-top: 10px; }
.brief-files { margin: 12px 0; padding: 10px 12px; border: 1px solid #e8e8e8; border-radius: 8px; background: #fbfbfb; font-size: 12px; }
.brief-files a { color: #9a5b35; }
.brief-crm-grid { margin-top: 16px; display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; }
.brief-crm-grid label, .brief-lost-field, .brief-notes-label, .company-edit-grid label { display: block; }
.brief-crm-grid label > span, .brief-lost-field > span, .brief-notes-label > span, .company-edit-grid label > span { display: block; margin-bottom: 6px; color: #737373; font-size: 11px; font-weight: 500; }
.brief-crm-grid .brief-next { grid-column: span 3; }
.brief-lost-field { display: none; margin-top: 12px; }
.brief-lost-field.show { display: block; }
.brief-notes-label { margin-top: 12px; }
.brief-card-actions { align-items: center; flex-wrap: wrap; }
.brief-card-actions .danger { margin-left: auto; }
.brief-activity-panel { margin-top: 18px; padding-top: 18px; border-top: 1px solid #ededed; }
.brief-activity-form { display: grid; grid-template-columns: 120px minmax(200px,1fr) 190px auto; gap: 8px; }
.brief-timeline { margin-top: 16px; }
.timeline-item { padding: 12px 0; display: grid; grid-template-columns: 58px minmax(0,1fr) auto; gap: 12px; align-items: start; border-top: 1px solid #ededed; }
.timeline-item:first-child { border-top: 0; }
.timeline-item.completed { opacity: .55; }
.timeline-item.completed p { text-decoration: line-through; }
.timeline-kind { min-height: 22px; padding: 4px 6px; border-radius: 5px; background: #f2f2f2; color: #525252; font-size: 10px; text-align: center; text-transform: capitalize; }
.timeline-item p { margin: 0 0 4px; color: #333; line-height: 1.5; white-space: pre-wrap; }
.timeline-item small { color: #8a8a8a; font-size: 10px; }
.timeline-actions { display: flex; gap: 4px; }
.timeline-actions button { width: 25px; height: 25px; border: 1px solid #ddd; border-radius: 6px; color: #737373; }
.admin-pagination { margin: 20px 0; display: flex; justify-content: center; align-items: center; gap: 14px; color: #737373; font-size: 12px; }
.admin-pagination button:disabled { opacity: .4; cursor: default; }

.company-list { display: flex; flex-direction: column; gap: 12px; }
.company-card { padding: 22px; border: 1px solid var(--admin-border); border-radius: 12px; background: #fff; }
.company-card-head { display: flex; justify-content: space-between; gap: 24px; }
.company-card-head h3 { margin: 5px 0 3px; font-size: 20px; font-weight: 550; letter-spacing: -.02em; }
.company-card-head p { color: #8a8a8a; font-size: 12px; }
.company-kpis { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.company-kpis span { min-width: 90px; padding: 9px 11px; border: 1px solid #e8e8e8; border-radius: 8px; color: #737373; font-size: 10px; }
.company-kpis strong { display: block; margin-bottom: 3px; color: #262626; font-size: 13px; font-weight: 600; }
.company-contacts { margin: 18px 0; display: grid; grid-template-columns: repeat(auto-fit,minmax(210px,1fr)); gap: 8px; }
.company-contacts > div { padding: 11px 12px; border-radius: 8px; background: #f8f8f8; }
.company-contacts strong, .company-contacts a, .company-contacts span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.company-contacts strong { font-size: 12px; }.company-contacts a { margin: 3px 0; color: #9a5b35; font-size: 11px; }.company-contacts span { color: #8a8a8a; font-size: 10px; }
.company-edit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.company-notes-wrap { grid-column: 1 / -1; }

.cms-list { display: flex; flex-direction: column; gap: 8px; }
.cms-item { overflow: hidden; border: 1px solid var(--admin-border); border-radius: 11px; background: #fff; }
.cms-item[open] { border-color: #d0d0d0; box-shadow: 0 4px 18px rgba(0,0,0,.03); }
.cms-item summary { min-height: 54px; padding: 0 16px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; font-size: 14px; font-weight: 500; }
.cms-item summary::-webkit-details-marker { display: none; }
.cms-item summary::before { content: '›'; width: 20px; color: #a3a3a3; font-size: 19px; transition: transform .18s; }
.cms-item[open] summary::before { transform: rotate(90deg); }
.cms-item summary > .cms-reorder { margin-left: auto; }
.cms-reorder { display: inline-flex; gap: 4px; }
.cms-reorder .btn-mini { min-width: 30px; padding: 0; }
.cms-form { padding: 18px; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; border-top: 1px solid #ededed; background: #fcfcfc; }
.cms-form .form-field { margin: 0; }
.cms-form .form-field:has(textarea), .cms-form .cms-form-foot { grid-column: 1 / -1; }
.cms-form textarea.admin-input { min-height: 96px; resize: vertical; }
.cms-form-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 4px; }
.cms-actions { display: flex; gap: 8px; }
.cms-check { display: inline-flex !important; align-items: center; gap: 8px; margin: 0 !important; }
.cms-check input { accent-color: #171717; }
.badge { display: inline-flex; align-items: center; min-height: 22px; margin-right: 8px; padding: 0 7px; border-radius: 6px; background: #f3f3f3; color: #737373; font-size: 10px; font-weight: 600; }
.admin-create { margin-top: 28px; }
.admin-create .cms-form { padding: 0; border-top: 0; background: transparent; }
.cms-image { display: flex; align-items: center; gap: 12px; }
.cms-thumb { width: 72px; height: 72px; border: 1px solid var(--admin-border); border-radius: 9px; object-fit: cover; }

.admin-file-note { margin: -16px 0 22px; color: #8a8a8a; font-size: 12px; }
.media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 12px; }
.media-card { overflow: hidden; border: 1px solid var(--admin-border); border-radius: 11px; background: #fff; }
.media-card img { width: 100%; height: 158px; display: block; object-fit: cover; background: #f3f3f3; }
.media-meta { min-height: 60px; padding: 12px; font-size: 12px; word-break: break-all; }
.media-meta code { color: #525252; font: 11px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; }
.media-actions { display: flex; gap: 6px; padding: 0 12px 12px; }
.admin-form-surface { max-width: 820px; margin-top: 12px; }
.admin-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0 16px; }
.admin-form-surface .form-field { margin-bottom: 18px; }
.health-checks { margin: 4px 0 16px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.health-checks > div { padding: 10px 11px; display: grid; grid-template-columns: 10px minmax(0,1fr); gap: 2px 8px; align-items: center; border: 1px solid #ededed; border-radius: 8px; }
.health-checks strong { color: #404040; font-size: 12px; font-weight: 600; }
.health-checks small { grid-column: 2; color: #737373; font-size: 10px; }
.health-dot { width: 8px; height: 8px; display: block; border-radius: 50%; background: #b45309; }
.health-dot.ok { background: #16803c; }
.admin-audit { overflow-x: auto; padding: 8px 12px; }

.admin-toast { position: fixed; z-index: 200; left: 50%; bottom: 28px; max-width: min(420px, calc(100vw - 32px)); padding: 11px 16px; border: 1px solid #333; border-radius: 9px; background: #202020; color: #fff; box-shadow: 0 10px 35px rgba(0,0,0,.18); font-size: 13px; opacity: 0; transform: translate(-50%, 20px); pointer-events: none; transition: opacity .2s, transform .2s; }
.admin-toast.show { opacity: 1; transform: translate(-50%,0); }

@media (max-width: 1080px) {
  .stat-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .admin-dashboard-grid { grid-template-columns: 1fr; }
  .admin-toolbar { grid-template-columns: minmax(200px,1fr) repeat(2,minmax(130px,.5fr)); }
  .brief-crm-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .brief-crm-grid .brief-next { grid-column: span 1; }
}
@media (max-width: 820px) {
  .admin-app { display: block !important; }
  .admin-sidebar { transform: translateX(-102%); transition: transform .22s ease; box-shadow: 12px 0 40px rgba(0,0,0,.08); }
  .admin-sidebar.open { transform: translateX(0); }
  .admin-sidebar-scrim { position: fixed; z-index: 35; inset: 0; display: block; background: rgba(0,0,0,.22); opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s; }
  .admin-sidebar-scrim.show { opacity: 1; visibility: visible; }
  .admin-main { min-height: 100vh; }
  .admin-menu-toggle { display: grid; place-items: center; }
  .admin-content { padding: 34px 24px 64px; }
  .admin-page-head { align-items: flex-start; }
}
@media (max-width: 620px) {
  .admin-topbar { padding: 0 14px; }
  .admin-top-action { font-size: 0; }.admin-top-action span { font-size: 14px; }
  .admin-content { padding: 28px 16px 52px; }
  .admin-page-head { display: block; min-height: 0; margin-bottom: 26px; }
  .admin-page-head > .admin-secondary, .admin-page-head > label.admin-secondary { margin-top: 18px; }
  .admin-page-head h2 { font-size: 27px; }
  .stat-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .stat-card { min-height: 100px; }
  .admin-toolbar { grid-template-columns: 1fr; }
  .admin-toolbar.audit-toolbar { grid-template-columns: 1fr; }
  .brief-card-head { display: block; }.brief-status-sel { margin-top: 14px; }
  .brief-crm-grid, .brief-activity-form, .company-edit-grid { grid-template-columns: 1fr; }
  .brief-crm-grid .brief-next, .company-notes-wrap { grid-column: 1; }
  .company-card-head { display: block; }
  .company-kpis { margin-top: 14px; justify-content: flex-start; }
  .timeline-item { grid-template-columns: 48px minmax(0,1fr); }.timeline-actions { grid-column: 2; }
  .cms-form, .admin-form-grid { grid-template-columns: 1fr; }
  .health-checks { grid-template-columns: 1fr; }
  .cms-form .form-field, .cms-form .cms-form-foot { grid-column: 1; }
  .cms-form-foot { align-items: flex-start; flex-direction: column; }
  .admin-surface { padding: 17px; }
}

/* ─── Unified editorial subpages — OpenAI-inspired hierarchy ─────────── */
body:not(.admin-body) .page-hero { min-height: 520px; padding: 180px 0 96px; display: flex; align-items: flex-end; background: var(--story-paper); }
body:not(.admin-body) .page-hero .container { width: 100%; max-width: 1420px; }
body:not(.admin-body) .page-hero .eyebrow { margin-bottom: 42px; color: var(--muted); font-size: 14px; font-weight: 500; letter-spacing: 0; }
body:not(.admin-body) .page-hero h1 { max-width: 1000px; margin-bottom: 30px; font-family: var(--font-sans); font-size: clamp(36px, 4.4vw, 62px); font-weight: 500; line-height: 1.08; letter-spacing: -0.015em; }
body:not(.admin-body) .page-hero p { max-width: 700px; font-size: clamp(18px, 1.6vw, 22px); line-height: 1.55; color: rgba(13,13,13,.65); }
body:not(.admin-body) .page-hero ~ section h2,
body:not(.admin-body) .page-hero ~ section h3 { font-family: var(--font-sans); letter-spacing: -0.02em; }
body:not(.admin-body) .page-hero ~ section .container { max-width: 1420px; }
body:not(.admin-body) .page-hero ~ .sec-pad { padding: 150px 0; }
body:not(.admin-body) .page-hero ~ .sec-pad-tight { padding: 115px 0; }
body:not(.admin-body) .page-hero ~ section .eyebrow { font-weight: 500; letter-spacing: 0; }

body:not(.admin-body) .axes-grid { gap: 14px; margin-top: 70px; border: 0; background: transparent; }
body:not(.admin-body) .axis { min-height: 300px; padding: 30px; border: 0; background: var(--cream); border-radius: 18px; }
body:not(.admin-body) .axis .num { font: 500 13px/1 var(--font-sans); color: var(--muted); opacity: 1; }
body:not(.admin-body) .axis h3 { margin-top: 88px; font-size: 25px; font-weight: 500; }
body:not(.admin-body) .axis p { max-width: 350px; color: rgba(13,13,13,.62); }

body:not(.admin-body) .alt-row { grid-template-columns: minmax(0,1.05fr) minmax(340px,.95fr); gap: clamp(60px, 9vw, 150px); margin-bottom: 170px; }
body:not(.admin-body) .alt-row .visual { aspect-ratio: 5 / 4; }
body:not(.admin-body) .alt-row .copy h3 { font-size: clamp(26px, 3vw, 42px); font-weight: 500; line-height: 1.1; }
body:not(.admin-body) .alt-row .copy p { max-width: 570px; font-size: 17px; line-height: 1.7; }
body:not(.admin-body) .alt-row .step-num { font: 500 13px/1 var(--font-sans); color: var(--muted); opacity: 1; }

body:not(.admin-body) .mat-grid { grid-template-columns: repeat(2,1fr); gap: 70px 24px; }
body:not(.admin-body) .mat-card .visual { margin-bottom: 24px; aspect-ratio: 16 / 10; }
body:not(.admin-body) .mat-card h3 { font-size: 28px; font-weight: 500; }
body:not(.admin-body) .mat-card p { max-width: 580px; font-size: 16px; }
body:not(.admin-body) .row-list > div { padding: 25px 0; font-family: var(--font-sans); font-size: clamp(20px,2.3vw,30px); letter-spacing: -0.016em; }
body:not(.admin-body) .accordion { margin-top: 60px; }
body:not(.admin-body) .acc-q { padding: 30px 0; font-size: 18px; }
body:not(.admin-body) .acc-body-inner { font-size: 16px; }

body:not(.admin-body) .jrn-grid { grid-template-columns: repeat(2,1fr); gap: 80px 24px; }
body:not(.admin-body) .jrn-card .visual { aspect-ratio: 4 / 3; }
body:not(.admin-body) .jrn-card h2, body:not(.admin-body) .jrn-card h3 { font-size: clamp(21px,2.2vw,28px); font-weight: 500; line-height: 1.2; }
body:not(.admin-body) .jrn-card p { max-width: 580px; font-size: 15px; }

body:not(.admin-body) .form-grid { grid-template-columns: minmax(0,1.15fr) minmax(320px,.85fr); gap: clamp(70px,9vw,150px); }
body:not(.admin-body) .form-field input,
body:not(.admin-body) .form-field select,
body:not(.admin-body) .form-field textarea { padding: 12px 14px; font-size: 16px; }
body:not(.admin-body) .radio-pill { border-radius: 999px; letter-spacing: 0.01em; text-transform: none; }
body:not(.admin-body) .btn-primary { border-radius: 999px; letter-spacing: 0; text-transform: none; }
body:not(.admin-body) .pdp { grid-template-columns: minmax(0,1.1fr) minmax(360px,.9fr); gap: clamp(60px,8vw,130px); }
body:not(.admin-body) .pdp .info h1 { font-family: var(--font-sans); font-size: clamp(30px,3.4vw,46px); font-weight: 500; letter-spacing: -0.025em; line-height: 1.1; }
body:not(.admin-body) .pdp .gallery-main { aspect-ratio: 4 / 5; }
body:not(.admin-body) .cta { padding: 84px 0; width: min(100% - 64px, 1420px); margin: 0 auto 40px; border-radius: 24px; overflow: hidden; }
body:not(.admin-body) .cta h2 { font-family: var(--font-sans); font-size: clamp(30px,3.8vw,52px); font-weight: 500; letter-spacing: -0.02em; line-height: 1.12; }
body:not(.admin-body) .cta .btn-outline-light { border-radius: 999px; letter-spacing: 0; text-transform: none; }

@media (max-width: 900px) {
  body:not(.admin-body) .page-hero { min-height: 500px; padding: 150px 0 80px; }
  body:not(.admin-body) .page-hero h1 { font-size: clamp(32px,7.5vw,48px); }
  body:not(.admin-body) .page-hero ~ .sec-pad { padding: 100px 0; }
  body:not(.admin-body) .page-hero ~ .sec-pad-tight { padding: 82px 0; }
  body:not(.admin-body) .axes-grid { grid-template-columns: 1fr; }
  body:not(.admin-body) .axis { min-height: 230px; border: 0; }
  body:not(.admin-body) .axis h3 { margin-top: 50px; }
  body:not(.admin-body) .alt-row, body:not(.admin-body) .pdp, body:not(.admin-body) .form-grid { grid-template-columns: 1fr; gap: 48px; }
  body:not(.admin-body) .alt-row { margin-bottom: 96px; }
  body:not(.admin-body) .alt-row { margin-bottom: 100px; }
  body:not(.admin-body) .alt-row.reverse > :first-child { order: 0; }
}
@media (max-width: 650px) {
  body:not(.admin-body) .page-hero { min-height: 450px; }
  body:not(.admin-body) .page-hero h1 { font-size: 32px; }
  body:not(.admin-body) .mat-grid, body:not(.admin-body) .jrn-grid { grid-template-columns: 1fr; }
  body:not(.admin-body) .cta { padding: 64px 0; width: min(100% - 40px, 1420px); }
}

/* OpenAI-reference refinements: 1440px editorial canvas, restrained controls */
.nav-inner { max-width:1440px; }
.nav-actions { display:flex; align-items:center; gap:18px; margin-left:auto; }
.language-switch { font:500 13px/1 var(--font-sans); letter-spacing:.02em; color:inherit; opacity:.62; padding:9px 12px; border-radius:10px; transition:background .2s ease, opacity .2s ease; }
.language-switch:hover { opacity:1; background:rgba(13,13,13,.05); }
.page-editor-list { display:grid; gap:10px; margin-bottom:96px; }
.locale-tabs { display:flex; gap:4px; width:max-content; padding:3px; margin:-16px 0 28px; border-radius:10px; background:#f2f2f2; }
.locale-tabs button { border:0; border-radius:7px; padding:8px 14px; background:transparent; color:#666; font:500 13px/1.2 var(--font-sans); cursor:pointer; }
.locale-tabs button.active { background:#fff; color:#111; box-shadow:0 1px 3px rgba(0,0,0,.08); }
.page-editor-group { border:1px solid #e5e5e5; border-radius:10px; background:#fff; overflow:hidden; }
.page-editor-group > summary { display:flex; justify-content:space-between; align-items:center; min-height:58px; padding:0 18px; cursor:pointer; list-style:none; font:500 14px/1.2 var(--font-sans); }
.page-editor-group > summary::-webkit-details-marker { display:none; }
.page-editor-group > summary span:last-child { color:#999; font-size:12px; font-weight:400; }
.page-editor-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 18px; padding:18px; border-top:1px solid #ececec; background:#fcfcfc; }
.page-editor-fields .form-field:has(textarea), .page-editor-fields .form-field:has(.page-image-field) { grid-column:1 / -1; }
.page-image-field { display:flex; align-items:center; gap:12px; min-height:82px; padding:10px; border:1px solid #ddd; border-radius:9px; background:#fff; }
.page-image-field img { width:96px; height:64px; border-radius:6px; object-fit:cover; }
.page-editor-save { position:sticky; z-index:8; bottom:18px; display:flex; justify-content:space-between; align-items:center; gap:20px; max-width:760px; margin:-72px auto 24px; padding:12px 14px 12px 18px; border:1px solid #dedede; border-radius:12px; background:rgba(255,255,255,.94); box-shadow:0 10px 35px rgba(0,0,0,.09); backdrop-filter:blur(16px); }
.page-editor-save span { color:#777; font-size:13px; }
.page-editor-save .admin-primary { width:auto; min-width:172px; }

@media (max-width:820px) {
  .nav-actions { margin-left:auto; }
  .nav-actions .language-switch { display:none; }
  .page-editor-fields { grid-template-columns:1fr; }
  .page-editor-fields .form-field { grid-column:1; }
  .page-editor-save { bottom:10px; margin-left:0; margin-right:0; }
  .page-editor-save span { display:none; }
  .page-editor-save .admin-primary { width:100%; }
}

/* ─── Rounded media surfaces (OpenAI-style) ──────────────────────────── */
body:not(.admin-body) .lib-card,
body:not(.admin-body) .lib-page-card,
body:not(.admin-body) .jrn-card .visual,
body:not(.admin-body) .article-figure,
body:not(.admin-body) .materials .visual,
body:not(.admin-body) .alt-row .visual,
body:not(.admin-body) .mat-card .visual,
body:not(.admin-body) .mii .visual,
body:not(.admin-body) .pdp .gallery-main,
body:not(.admin-body) .pdp .gallery-thumbs > div {
  border-radius: var(--radius-media);
  overflow: hidden;
}

/* ─── FRAYDA narrative edition — point of view → collection ────────── */
:root {
  --story-paper: #fffefa;
  --story-warm: #eee7df;
  --story-copper: #985a36;
  --story-wash: #f4efe9;
  --story-deep: #16120f;
}

body:not(.admin-body) {
  background: var(--story-paper);
}

/* Content stays legible even when motion or IntersectionObserver fails. */
body:not(.admin-body) .reveal {
  opacity: 1;
}

body:not(.admin-body) .nav {
  background: color-mix(in srgb, var(--story-paper) 88%, transparent);
}

.lib-page-card .swatch,
.jrn-card .visual {
  box-shadow: inset 0 0 0 1px rgba(45,27,16,.055);
}

/* Shared subpage hero: each page is visibly part of the same four-part story. */
body:not(.admin-body) .page-hero.has-chapter {
  min-height: 680px;
  padding: 150px 0 70px;
  align-items: stretch;
  border-bottom: 0;
  background:
    radial-gradient(circle at 5% 20%, rgba(152,90,54,.08), transparent 30%),
    linear-gradient(135deg, var(--story-paper), #f7f1ea);
}

body:not(.admin-body) .page-hero.has-chapter .container {
  display: flex;
}

.page-hero-grid {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(300px, .45fr);
  gap: clamp(70px, 10vw, 170px);
  align-items: stretch;
}

.page-hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 30px 0 22px;
}

body:not(.admin-body) .page-hero.has-chapter h1 {
  max-width: 940px;
  font-size: clamp(46px, 5.6vw, 78px);
  line-height: 1.01;
  letter-spacing: -.035em;
}

body:not(.admin-body) .page-hero.has-chapter p {
  max-width: 760px;
  color: rgba(13,13,13,.63);
}

.page-hero-chapter {
  min-height: 440px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  border: 1px solid rgba(79,46,25,.1);
  border-radius: 18px;
  background:
    radial-gradient(circle at 76% 24%, rgba(255,255,255,.28), transparent 22%),
    radial-gradient(circle at 20% 82%, rgba(67,34,16,.22), transparent 37%),
    linear-gradient(145deg, #bf8158, #9c5c37 52%, #744025);
  color: #fff;
  box-shadow: 0 25px 70px rgba(71,40,20,.13);
}

.page-hero-chapter::before {
  content: '';
  position: absolute;
  width: 160px;
  height: 160px;
  right: -60px;
  top: 92px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 50%;
}

.page-hero-chapter::after {
  content: '';
  position: absolute;
  inset: 0;
  opacity: .3;
  background-image: repeating-radial-gradient(circle at 20% 30%, rgba(255,255,255,.1) 0 1px, transparent 1px 5px);
  mix-blend-mode: soft-light;
  pointer-events: none;
}

.page-chapter-top,
.page-chapter-route {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 11px;
}

.page-chapter-top i,
.page-chapter-route i {
  height: 1px;
  flex: 1;
  background: rgba(255,255,255,.44);
}

.page-hero-chapter > strong {
  position: relative;
  z-index: 1;
  max-width: 260px;
  font-size: clamp(28px, 3vw, 42px);
  font-weight: 500;
  line-height: 1.04;
  letter-spacing: -.03em;
}

.page-chapter-route span { white-space: nowrap; }

body:not(.admin-body) .page-hero.has-chapter + section {
  border-top: 1px solid var(--story-line);
}

body:not(.admin-body) .page-hero ~ section[style*="background:var(--cream)"],
body:not(.admin-body) .page-hero ~ section[style*="background:var(--sand)"] {
  background-image: linear-gradient(135deg, rgba(255,255,255,.36), transparent 55%);
}

body:not(.admin-body) .axis,
body:not(.admin-body) .step,
body:not(.admin-body) .mat-card,
body:not(.admin-body) .jrn-card,
body:not(.admin-body) .lib-page-card {
  transition: transform .35s ease, background .35s ease;
}

body:not(.admin-body) .axis:hover,
body:not(.admin-body) .step:hover {
  background: #f7f1eb;
}

body:not(.admin-body) .mat-card:hover,
body:not(.admin-body) .jrn-card:hover,
body:not(.admin-body) .lib-page-card:hover {
  transform: translateY(-4px);
}

.cta {
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 22%, rgba(152,90,54,.24), transparent 28%),
    radial-gradient(circle at 84% 72%, rgba(152,90,54,.12), transparent 32%),
    var(--story-deep);
}

.cta::after {
  content: '';
  position: absolute;
  width: 440px;
  height: 440px;
  right: -240px;
  top: -260px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 50%;
}

.cta-kicker {
  display: block;
  margin-bottom: 42px;
  color: rgba(255,255,255,.48);
  font-size: 12px;
}

.foot-story {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 50px;
  align-items: end;
  margin-bottom: 84px;
  padding-bottom: 0;
}

.foot-story > div > span {
  display: block;
  margin-bottom: 28px;
  color: var(--muted);
  font-size: 12px;
}

.foot-story p {
  max-width: 780px;
  font-size: clamp(30px, 4vw, 58px);
  line-height: 1.08;
  letter-spacing: -.035em;
}

.foot-story > a {
  min-height: 48px;
  padding: 0 24px;
  display: inline-flex;
  align-items: center;
  gap: 24px;
  background: #f0efec;
  border-radius: 999px;
  font-size: 14px;
  white-space: nowrap;
  transition: color .25s ease, background .25s ease;
}

.foot-story > a:hover { color: #fff; background: var(--ink); }
.prose .prose-lead { font-size: clamp(25px, 3vw, 38px); line-height: 1.25; letter-spacing: -.025em; }

@media (max-width: 1000px) {
  .page-hero-grid { grid-template-columns: minmax(0, 1fr) 300px; gap: 50px; }
  body:not(.admin-body) .page-hero.has-chapter h1 { font-size: clamp(42px, 6.4vw, 64px); }
  body:not(.admin-body) .process-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 760px) {
  body:not(.admin-body) .page-hero.has-chapter { min-height: 0; padding: 118px 0 34px; }
  .page-hero-grid { grid-template-columns: 1fr; gap: 44px; }
  .page-hero-copy { padding: 28px 0 0; }
  body:not(.admin-body) .page-hero.has-chapter h1 { font-size: clamp(38px, 10.8vw, 54px); }
  .page-hero-chapter { min-height: 300px; }
  .page-hero-chapter > strong { max-width: 230px; font-size: 32px; }
  .foot-story { grid-template-columns: 1fr; align-items: start; margin-bottom: 68px; padding-bottom: 46px; }
  .foot-story > a { white-space: normal; }
  body:not(.admin-body) .process-grid { grid-template-columns: 1fr !important; }
  body:not(.admin-body) .process-grid .step { padding: 30px 0; border-bottom: 1px solid var(--story-line); }
}

/* ══════════════════════════════════════════════════════════════════
   Real photography, craft video, trust & portfolio (added for the
   trust/evidence pass). Neutral, on-system — no copper UI chrome.
   ══════════════════════════════════════════════════════════════════ */

/* Video may stand in for a swatch in any alt-row / mat-card visual. */
.visual video, .visual.swatch video { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Craft film band — muted, looping, full-bleed within the container. */
.craft-film { position: relative; height: min(58vw, 600px); min-height: 380px; overflow: hidden; color: #fff; width: min(100% - 64px, 1420px); margin: 0 auto; border-radius: 24px; }
.craft-film::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(15,10,6,.68), rgba(15,10,6,.05) 62%); z-index: 1; }
.craft-film-media { width: 100%; height: 100%; object-fit: cover; display: block; }
.craft-film-overlay { position: absolute; left: clamp(26px, 6vw, 90px); bottom: clamp(30px, 6vw, 62px); z-index: 2; max-width: 640px; }
.craft-film-overlay .story-section-label { display: block; margin-bottom: 18px; color: rgba(255,255,255,.82); }
.craft-film-overlay h2 { font-size: clamp(25px, 3.2vw, 44px); line-height: 1.12; letter-spacing: -0.02em; }
@media (max-width: 768px) { .craft-film { height: auto; aspect-ratio: 4 / 3; min-height: 0; width: min(100% - 40px, 1420px); } }
@media (max-width: 768px) {
  .mq-grid, .cap-grid, .hw-grid, .lp-grid {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
}

/* MOQ soft-range orientation band. */
.moq-band { margin: 0; font-size: 15px; line-height: 1.75; color: rgba(13,13,13,.6); padding: 16px 20px; border-left: 2px solid rgba(13,13,13,.16); background: rgba(13,13,13,.02); border-radius: 2px; }

/* Portfolio / recent-work gallery. */
.portfolio { background: var(--bg); }
.portfolio-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.portfolio-note { margin: 40px auto 0; max-width: 640px; font-size: 14px; line-height: 1.7; color: rgba(13,13,13,.55); }
@media (max-width: 900px) { .portfolio-grid { grid-template-columns: repeat(2, 1fr); } }

/* Team / people block. */
.team-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(24px, 4vw, 48px); margin-top: 56px; }
.team-card .team-photo { aspect-ratio: 4 / 5; border-radius: var(--radius-media); overflow: hidden; background: #e5e3df; margin-bottom: 20px; }
.team-card .team-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.team-card h3 { font-size: 20px; font-weight: 500; margin-bottom: 4px; }
.team-card .team-role { font-size: 13px; letter-spacing: .04em; text-transform: uppercase; color: var(--stone); margin-bottom: 14px; }
.team-card p { font-size: 14.5px; line-height: 1.7; color: rgba(13,13,13,.62); margin: 0; }
@media (max-width: 820px) { .team-grid { grid-template-columns: 1fr; max-width: 420px; } }

/* Progressive brief form — email-first, "Continue" reveals the rest.
   Without JS (no .js-progressive) the whole form shows and Continue/hint hide. */
.form-continue { display: none; }
.form-step-hint { display: none; margin: 14px 0 0; font-size: 13px; color: rgba(13,13,13,.62); }
.js-progressive:not(.revealed) .brief-step-2 { display: none; }
.js-progressive:not(.revealed) .form-continue { display: inline-flex; }
.js-progressive:not(.revealed) .form-step-hint { display: block; }
.js-progressive.revealed .brief-step-1 { padding-bottom: 8px; margin-bottom: 24px; border-bottom: 1px solid var(--border); }

/* Lower-commitment ways to start. */
.ways-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 44px; }
.way-card { display: flex; flex-direction: column; justify-content: space-between; gap: 40px; min-height: 190px; padding: 32px; border-radius: 18px; background: var(--sand); color: var(--ink); text-decoration: none; transition: background .3s, transform .3s; }
.way-card:hover { background: #ecebe8; transform: translateY(-2px); }
.way-card h3 { font-size: 20px; font-weight: 500; margin-bottom: 12px; }
.way-card p { font-size: 14.5px; line-height: 1.6; color: rgba(13,13,13,.62); margin: 0; }
.way-card .way-arrow { font-size: 18px; color: var(--muted); }
@media (max-width: 820px) { .ways-grid { grid-template-columns: 1fr; } .way-card { min-height: 0; } }

/* Private-label axis cards with a real photo instead of a bare label. */
body:not(.admin-body) .axis.axis-photo { padding: 0; min-height: 0; overflow: hidden; }
.axis.axis-photo .axis-media { aspect-ratio: 4 / 3; overflow: hidden; background: #e5e3df; border-radius: 18px 18px 0 0; }
.axis.axis-photo .axis-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.axis.axis-photo:hover .axis-media img { transform: scale(1.04); }
body:not(.admin-body) .axis.axis-photo .num { margin: 22px 28px 0; }
body:not(.admin-body) .axis.axis-photo h3 { margin: 8px 28px 0; }
body:not(.admin-body) .axis.axis-photo p { margin: 10px 28px 30px; max-width: none; }

/* ── Light unification for real product photos ─────────────────────────
   The supplied photos have mixed studio backgrounds (white / grey / taupe).
   We can't repaint them, but a common warm matte, a consistent hairline
   frame, and a barely-there tonal filter make them read as one set. */
.lib-page-card,
body:not(.admin-body) .mat-card .visual, .pdp .gallery-main, .gallery-thumbs > .swatch {
  background-color: #efece7;
}
.lib-page-card img,
.mat-card .visual img, .pdp .gallery-main img, .gallery-thumbs img {
  filter: saturate(1.04) contrast(1.02) brightness(1.004);
}
.mat-card .visual { position: relative; }

/* ═══════════════════════════════════════════════════════════════════════
   HOME — editorial layout in the openai.com design language, built around
   FRAYDA content. White canvas, restrained system type, strong gray meta
   labels, image-forward rounded cards, pill buttons, generous rhythm.
   Prefixed .hp- so the rest of the site's story-*/page styles are untouched.
   ═══════════════════════════════════════════════════════════════════════ */

/* Shared type + controls */
.hp-eyebrow { display: block; font-size: 14px; font-weight: 500; color: var(--muted); }
.hp-meta { display: block; font-size: 13px; font-weight: 500; color: var(--muted); }
.hp-btn {
  min-height: 50px; padding: 0 26px; display: inline-flex; align-items: center; justify-content: center; gap: 14px;
  border-radius: 999px; font-size: 15px; font-weight: 500; letter-spacing: -0.01em; transition: background .25s ease;
}
.hp-btn-dark { background: var(--ink); color: #fff; }
.hp-btn-dark:hover { background: #2f2f2f; }
.hp-link { display: inline-flex; align-items: center; gap: 9px; font-size: 15px; font-weight: 500; width: fit-content; }
.hp-link:hover, .hp-viewall:hover { text-decoration: underline; text-underline-offset: 5px; }
.hp-btn span, .hp-link span, .hp-viewall span { display: inline-block; transition: transform .3s ease; }
.hp-btn:hover span, .hp-link:hover span, .hp-viewall:hover span { transform: translateX(4px); }
.hp-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; margin-top: clamp(30px, 3.5vw, 44px); }
.hp-actions-center { justify-content: center; }

/* Sections + headers */
.hp-section { padding: clamp(74px, 9vw, 130px) 0; }
.hp-tint { background: var(--sand); }
.hp-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 28px; margin-bottom: clamp(40px, 4.6vw, 64px); }
.hp-head .hp-eyebrow { margin-bottom: 16px; }
.hp-head h2 { font-size: clamp(28px, 3.4vw, 44px); font-weight: 500; letter-spacing: -0.022em; line-height: 1.1; }
.hp-head > p { flex: none; max-width: 420px; margin: 0 0 4px; font-size: 17px; line-height: 1.6; color: rgba(13,13,13,.65); }
.hp-head-center { flex-direction: column; align-items: center; text-align: center; max-width: 760px; margin-left: auto; margin-right: auto; }
.hp-head-center p { max-width: 620px; margin: 22px auto 0; font-size: 17px; line-height: 1.6; color: rgba(13,13,13,.65); }
.hp-viewall { flex: none; display: inline-flex; align-items: center; gap: 7px; font-size: 15px; font-weight: 500; white-space: nowrap; }
.hp-head-foot { margin-top: clamp(40px, 5vw, 60px); display: flex; justify-content: center; }

/* Hero */
.hp-hero { padding: clamp(96px, 15vh, 172px) 0 clamp(56px, 7vw, 92px); text-align: center; }
.hp-hero-inner { max-width: 920px; }
.hp-hero h1 { font-size: clamp(38px, 5vw, 68px); font-weight: 500; line-height: 1.06; letter-spacing: -0.025em; margin: 0 0 clamp(22px, 2.4vw, 30px); }
.hp-hero-em { color: rgba(13,13,13,.5); }
.hp-hero p { max-width: 660px; margin: 0 auto; font-size: clamp(16px, 1.3vw, 19px); line-height: 1.6; color: rgba(13,13,13,.7); }
.hp-hero .hp-actions { justify-content: center; }

/* Image-forward cards (shared) */
.hp-card { display: block; }
.hp-card-media, .hp-model-media { overflow: hidden; border-radius: 16px; background: #e5e3df; }
.hp-card-media { aspect-ratio: 3 / 2; }
.hp-card-media > img, .hp-model-media > img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.hp-card:hover .hp-card-media > img, .hp-model:hover .hp-model-media > img { transform: scale(1.03); }

/* Ways-in featured grid */
.hp-ways-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(18px, 2vw, 26px); }
.hp-card-body { padding-top: 20px; }
.hp-way .hp-meta { margin-bottom: 10px; }
.hp-way h3 { font-size: clamp(19px, 1.7vw, 23px); font-weight: 500; letter-spacing: -0.02em; line-height: 1.2; margin-bottom: 12px; }
.hp-way p { font-size: 15px; line-height: 1.6; color: rgba(13,13,13,.62); max-width: 42ch; }

/* Design-library grid */
.hp-model-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 1.8vw, 24px); }
.hp-model-media { aspect-ratio: .8; }
.hp-model-meta { padding-top: 16px; }
.hp-model-meta .hp-meta { margin-bottom: 5px; }
.hp-model-meta h3 { font-size: 17px; font-weight: 500; letter-spacing: -0.015em; }

/* How-it-works steps (one merged four-step journey) */
.hp-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(22px, 2.6vw, 40px); }
.hp-step-n { display: block; font-size: 13px; font-weight: 500; color: rgba(13,13,13,.58); margin-bottom: 18px; }
.hp-step h3 { font-size: clamp(18px, 1.5vw, 21px); font-weight: 500; letter-spacing: -0.018em; line-height: 1.2; margin-bottom: 12px; }
.hp-step p { font-size: 15px; line-height: 1.62; color: rgba(13,13,13,.62); }

/* Editorial image/text band (atelier + materials) */
.hp-editorial { padding: clamp(74px, 9vw, 130px) 0; }
.hp-edit-row { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 84px); align-items: center; margin-bottom: clamp(52px, 6.5vw, 104px); }
.hp-edit-row:last-child { margin-bottom: 0; }
.hp-edit-media { border-radius: 20px; overflow: hidden; background: #e5e3df; aspect-ratio: 7 / 5; }
.hp-edit-media > img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hp-edit-reverse .hp-edit-media { order: 2; }
.hp-edit-copy .hp-eyebrow { margin-bottom: 20px; }
.hp-edit-copy h2 { font-size: clamp(24px, 2.6vw, 38px); font-weight: 500; letter-spacing: -0.02em; line-height: 1.14; margin-bottom: 22px; }
.hp-edit-copy p { font-size: 17px; line-height: 1.7; color: rgba(13,13,13,.68); margin-bottom: 24px; max-width: 560px; }

/* The essentials — fact tiles */
.hp-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(16px, 1.8vw, 22px); }
.hp-fact { background: #fff; border-radius: 16px; padding: 30px; min-height: 168px; display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.hp-fact strong { font-size: clamp(20px, 1.8vw, 24px); font-weight: 500; letter-spacing: -0.018em; }
.hp-fact span { font-size: 14px; line-height: 1.55; color: rgba(13,13,13,.62); max-width: 250px; }
.hp-facts-note { max-width: 660px; margin: clamp(40px, 4vw, 58px) 0 0 auto; font-size: 16px; line-height: 1.7; color: rgba(13,13,13,.62); }

/* From the journal — recent-news list */
.hp-news-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(6px, 1vw, 12px) clamp(32px, 4vw, 64px); }
.hp-news { display: flex; align-items: center; gap: 20px; padding: clamp(14px, 1.4vw, 18px); margin: 0 clamp(-14px, -1.4vw, -18px); border-radius: 14px; transition: background .2s ease; }
.hp-news:hover { background: rgba(13,13,13,.045); }
.hp-news-thumb { flex: none; width: 82px; height: 82px; border-radius: 12px; overflow: hidden; background: #e5e3df; }
.hp-news-thumb > img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hp-news-text h3 { font-size: clamp(16px, 1.3vw, 18px); font-weight: 500; letter-spacing: -0.01em; line-height: 1.3; margin-bottom: 8px; }

/* Closing CTA */
.hp-final { padding: clamp(96px, 12vw, 170px) 0; text-align: center; }
.hp-final-inner { max-width: 760px; }
.hp-final .hp-eyebrow { margin-bottom: clamp(24px, 3vw, 38px); }
.hp-final h2 { font-size: clamp(30px, 4vw, 52px); font-weight: 500; letter-spacing: -0.025em; line-height: 1.08; }
.hp-final p { max-width: 620px; margin: 24px auto 0; font-size: 18px; line-height: 1.6; color: rgba(13,13,13,.7); }
.hp-final-lite { margin-top: clamp(28px, 3vw, 40px); display: flex; flex-wrap: wrap; justify-content: center; gap: 28px; font-size: 14px; }
.hp-final-lite a { color: var(--muted); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: rgba(13,13,13,.22); }
.hp-final-lite a:hover { color: var(--ink); }

/* Work page (recent-work gallery) */
.hp-hero-page { padding-bottom: clamp(16px, 2.5vw, 36px); }
.hp-hero-page .hp-eyebrow { margin-bottom: 18px; }
.hp-hero-page h1 { font-size: clamp(34px, 4.4vw, 58px); font-weight: 500; line-height: 1.06; letter-spacing: -0.025em; margin: 0 0 clamp(20px, 2.2vw, 28px); }
.work-gallery { padding-top: clamp(16px, 2.5vw, 36px); }
.work-piece { margin: 0; }
.work-piece figcaption { padding-top: 14px; font-size: 14px; line-height: 1.5; color: var(--muted); }

/* Footer: social links (settings-gated) + newsletter subscribe */
.foot-social { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 18px; }
.foot-social a { font-size: 13px; color: rgba(13,13,13,.65); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: rgba(13,13,13,.2); }
.foot-social a:hover { color: var(--ink); }
.foot-subscribe { margin-top: 22px; max-width: 340px; position: relative; }
.foot-subscribe label { display: block; font-size: 13px; color: rgba(13,13,13,.6); margin-bottom: 10px; }
.foot-subscribe-row { display: flex; gap: 8px; }
.foot-subscribe-row input { flex: 1; min-width: 0; border: 1px solid var(--border); border-radius: 999px; padding: 9px 16px; font-size: 14px; background: #fff; color: var(--ink); outline: none; font-family: inherit; }
.foot-subscribe-row input:focus { border-color: rgba(13,13,13,.35); }
.foot-subscribe-row button { flex: none; border-radius: 999px; background: var(--ink); color: #fff; font-size: 13px; font-weight: 500; padding: 0 16px; transition: background .2s ease; }
.foot-subscribe-row button:hover { background: #2f2f2f; }
.foot-subscribe-row button:disabled { opacity: .6; cursor: default; }
.hny-field { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; } /* honeypot */
.foot-subscribe-msg { margin-top: 8px; font-size: 12px; min-height: 1em; }
.foot-subscribe-privacy { margin-top: 9px; color: rgba(13,13,13,.62); font-size: 11px; line-height: 1.45; }
.foot-subscribe-privacy a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.foot-subscribe-msg.ok { color: #2c6e49; }
.foot-subscribe-msg.error { color: #a33333; }

/* Responsive */
@media (max-width: 1000px) {
  .hp-ways-grid, .hp-model-grid, .hp-steps, .hp-facts { grid-template-columns: repeat(2, 1fr); }
  .hp-steps { row-gap: clamp(32px, 5vw, 48px); }
}
@media (max-width: 900px) {
  .hp-head { flex-direction: column; align-items: flex-start; gap: 14px; }
  .hp-head > p { max-width: 560px; }
  .hp-head-center { align-items: center; }
  .hp-edit-row { grid-template-columns: 1fr; gap: 28px; margin-bottom: 56px; }
  .hp-edit-reverse .hp-edit-media { order: 0; }
  .hp-edit-media { aspect-ratio: 16 / 10; }
}
@media (max-width: 760px) {
  .hp-news-grid { grid-template-columns: 1fr; gap: 2px; }
}
@media (max-width: 600px) {
  .hp-ways-grid, .hp-model-grid, .hp-steps, .hp-facts { grid-template-columns: 1fr; }
  .hp-facts { gap: 12px; }
  .hp-actions { align-items: stretch; flex-direction: column; }
  .hp-actions .hp-btn { width: 100%; }
  .hp-hero .hp-actions, .hp-final .hp-actions { align-items: center; }
  .hp-news-thumb { width: 68px; height: 68px; }
}

/* ═══════════════════════════════════════════════════════════════════════
   FRAYDA reference edition — August 2026
   Compact Italian catalogue proportions, warm mineral surfaces, square
   photography, fine rules and a serif/sans hierarchy. This final layer also
   brings every public subpage into the same visual system. Admin is excluded.
   ═══════════════════════════════════════════════════════════════════════ */
:root {
  --bg: #f3f0eb;
  --ink: #252321;
  --muted: #6d6963;
  --stone: #595650;
  --sand: #e9e4dd;
  --cream: #f7f5f1;
  --border: #d3cdc4;
  --leather: #61564c;
  --radius-media: 0;
  --radius-card: 0;
  --font-display: Georgia, 'Times New Roman', serif;
}

body:not(.admin-body) { background: var(--bg); color: var(--ink); }
body:not(.admin-body) .container { max-width: 1500px; padding-left: clamp(24px, 4.5vw, 72px); padding-right: clamp(24px, 4.5vw, 72px); }
body:not(.admin-body) .container-narrow { max-width: 980px; }
body:not(.admin-body) .eyebrow,
body:not(.admin-body) .ref-kicker {
  font-size: 11px;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: .14em;
  text-transform: uppercase;
}

/* Navigation: white catalogue bar, generous wordmark, restrained controls. */
body:not(.admin-body) .nav {
  height: 80px;
  background: rgba(247,245,241,.97);
  border-bottom: 1px solid rgba(37,35,33,.12);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
body:not(.admin-body) .nav-inner { max-width: 1500px; padding: 0 clamp(24px, 4.5vw, 72px); gap: 24px; }
body:not(.admin-body) .wordmark { font-size: 22px; font-weight: 500; letter-spacing: .28em; }
body:not(.admin-body) .nav-wordmark { align-self: center; display: inline-flex; flex-direction: column; gap: 3px; line-height: 1; }
body:not(.admin-body) .nav-wordmark > span { font-size: 26px; }
body:not(.admin-body) .nav-wordmark small { padding-left: .15em; font-family: var(--font-sans); font-size: 8px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; }
body:not(.admin-body) .nav-links { gap: clamp(12px, 1.7vw, 28px); margin-left: auto; }
body:not(.admin-body) .nav-links a {
  padding: 6px 0;
  border-bottom: 1px solid transparent;
  border-radius: 0;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .025em;
  text-transform: uppercase;
  opacity: .78;
}
body:not(.admin-body) .nav-links a:hover,
body:not(.admin-body) .nav-links a.active { background: transparent; border-bottom-color: var(--ink); }
body:not(.admin-body) .nav-actions { gap: 12px; }
body:not(.admin-body) .language-switch { border-radius: 0; color: #5b5853; font-size: 11px; letter-spacing: .08em; opacity: 1; }
body:not(.admin-body) .language-switch:hover { background: transparent; }
body:not(.admin-body) .nav-cta {
  min-height: 38px;
  padding: 0 20px;
  border: 1px solid var(--ink);
  border-radius: 0;
  display: inline-flex;
  align-items: center;
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* Reference home — hero */
.ref-hero { position: relative; min-height: clamp(560px, 73vh, 760px); margin-top: 80px; overflow: hidden; background: #cfc8bf; }
.ref-hero-image { position: absolute; inset: 0 0 0 auto; width: 69%; height: 100%; object-fit: cover; object-position: 54% 54%; display: block; transform: scale(1.055); transform-origin: 72% 52%; }
.ref-hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, #cfc8bf 0%, rgba(207,200,191,.98) 34%, rgba(207,200,191,.72) 48%, rgba(207,200,191,0) 72%); }
.ref-hero-inner { position: relative; z-index: 1; min-height: inherit; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.ref-hero .ref-kicker { margin-bottom: 24px; color: rgba(37,35,33,.76); }
.ref-hero h1 {
  max-width: 720px;
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(48px, 4.3vw, 64px);
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: .01em;
  text-transform: uppercase;
}
.ref-hero h1 > span { white-space: nowrap; }
.ref-hero p { max-width: 500px; margin-top: 28px; font-size: clamp(15px, 1.15vw, 18px); line-height: 1.65; color: rgba(37,35,33,.82); }
.ref-button {
  min-width: 198px;
  min-height: 50px;
  padding: 0 24px;
  border: 1px solid currentColor;
  border-radius: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  transition: background .25s ease, color .25s ease;
}
.ref-hero .ref-button { margin-top: 34px; }
.ref-button:hover { background: var(--ink); color: #fff; }
.ref-button-light { color: inherit; }
.ref-text-link { display: inline-flex; gap: 18px; align-items: center; padding-bottom: 5px; border-bottom: 1px solid currentColor; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }

/* The reference puts the decision-making proof immediately after the hero. */
.ref-proof-band { position: relative; z-index: 2; background: #f7f5f1; border-top: 1px solid rgba(37,35,33,.12); border-bottom: 1px solid var(--border); }
.ref-proof-heading { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.ref-proof-band .container { max-width: 1380px; padding: 0; }
.ref-proof-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.ref-proof-band .ref-strength { min-height: 152px; padding: 28px clamp(24px, 2.7vw, 42px); border-left: 1px solid var(--border); display: grid; grid-template-columns: 34px 1fr; grid-template-rows: auto 1fr; column-gap: 18px; align-content: center; }
.ref-proof-band .ref-strength:first-child { border-left: 0; }
.ref-proof-band .ref-strength-mark { width: 34px; height: 34px; margin: 0; grid-row: 1 / 3; }
.ref-proof-band .ref-strength strong { margin: 1px 0 7px; }
.ref-proof-band .ref-strength p { font-size: 12px; line-height: 1.5; }

/* Three direct category entrances, drawn as full-image catalogue tiles. */
.ref-category-band { padding: 8px 0; background: #f7f5f1; }
.ref-category-band .container { max-width: 1380px; padding-left: 0; padding-right: 0; }
.ref-category-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.ref-category { position: relative; min-height: 300px; overflow: hidden; color: #fff; }
.ref-category img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.ref-category:nth-child(1) img { object-position: center 57%; }
.ref-category:nth-child(2) img { object-position: center 54%; }
.ref-category:nth-child(3) img { object-position: center 43%; }
.ref-category:hover img { transform: scale(1.025); }
.ref-category-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20,18,16,.5), rgba(20,18,16,.04) 72%); }
.ref-category-copy { position: absolute; inset: auto 28px 28px; display: flex; flex-direction: column; align-items: flex-start; }
.ref-category-copy .ref-kicker { color: rgba(255,255,255,.76); margin-bottom: 8px; }
.ref-category-copy strong { font-size: 20px; font-weight: 400; letter-spacing: .07em; text-transform: uppercase; }
.ref-category-link { margin-top: 17px; padding-bottom: 4px; border-bottom: 1px solid rgba(255,255,255,.7); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }

/* About + strengths follows the compact lower half of the supplied reference. */
.ref-about { padding: 0 0 84px; background: #f7f5f1; }
.ref-about .container { max-width: 1380px; padding: 0; }
.ref-about-grid { display: grid; grid-template-columns: .8fr 1.2fr; }
.ref-about-copy { padding: clamp(42px, 5vw, 72px); border-right: 1px solid var(--border); }
.ref-about-copy .ref-kicker { display: block; margin-bottom: 22px; color: var(--muted); }
.ref-about-copy h2,
.ref-section-head h2,
.ref-process-intro h2,
.ref-final h2,
.ref-section-title h2 {
  font-family: var(--font-display);
  font-weight: 400;
  line-height: 1.13;
  letter-spacing: .01em;
}
.ref-about-copy h2 { max-width: 470px; font-size: clamp(30px, 3vw, 46px); }
.ref-about-copy p { max-width: 520px; margin: 25px 0 30px; font-size: 15px; line-height: 1.75; color: rgba(37,35,33,.7); }
.ref-about-image { min-height: 430px; overflow: hidden; }
.ref-about-image img { width: 100%; height: 100%; object-fit: cover; object-position: center 45%; display: block; }
.ref-strengths-block { grid-column: 1 / -1; padding: clamp(46px, 5vw, 70px); border-top: 1px solid var(--border); }
.ref-section-title { display: flex; justify-content: space-between; align-items: baseline; gap: 28px; margin-bottom: 42px; }
.ref-section-title h2 { font-size: clamp(26px, 2.4vw, 38px); }
.ref-strength-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.ref-strength { min-height: 185px; padding: 0 32px; border-left: 1px solid var(--border); }
.ref-strength:first-child { padding-left: 0; border-left: 0; }
.ref-strength-mark { width: 42px; height: 42px; margin-bottom: 32px; border: 1px solid rgba(37,35,33,.65); display: grid; place-items: center; border-radius: 50%; font-size: 10px; letter-spacing: .08em; }
.ref-strength strong { display: block; margin-bottom: 12px; font-size: 12px; font-weight: 500; letter-spacing: .075em; text-transform: uppercase; }
.ref-strength p { max-width: 260px; font-size: 13px; line-height: 1.6; color: rgba(37,35,33,.64); }

/* Product, process and final conversion sections. */
.ref-section { padding: clamp(76px, 8vw, 118px) 0; }
.ref-section-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; margin-bottom: 44px; }
.ref-section-head .ref-kicker { display: block; margin-bottom: 14px; color: var(--muted); }
.ref-section-head h2 { font-size: clamp(31px, 3.2vw, 50px); }
.ref-products { border-top: 1px solid var(--border); }
.ref-product-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--border); border: 1px solid var(--border); }
.ref-product { min-width: 0; background: var(--bg); }
.ref-product-media { display: block; aspect-ratio: 4 / 5; overflow: hidden; background: #e6e0d9; }
.ref-product-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .65s cubic-bezier(.2,.7,.2,1); }
.ref-product:hover img { transform: scale(1.025); }
.ref-product-copy { min-height: 84px; padding: 20px; display: flex; flex-direction: column; gap: 4px; }
.ref-product-copy > span { color: var(--muted); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.ref-product-copy strong { font-family: var(--font-display); font-size: 19px; font-weight: 400; }
.ref-process { background: #ddd6cd; border-top: 1px solid rgba(37,35,33,.16); }
.ref-process-grid { display: grid; grid-template-columns: .84fr 1.16fr; gap: clamp(60px, 8vw, 130px); }
.ref-process-intro .ref-kicker { display: block; margin-bottom: 20px; }
.ref-process-intro h2 { max-width: 520px; font-size: clamp(34px, 3.5vw, 54px); }
.ref-process-intro > p { max-width: 480px; margin: 24px 0 32px; font-size: 15px; line-height: 1.7; color: rgba(37,35,33,.7); }
.ref-step { display: grid; grid-template-columns: 46px 1fr; gap: 20px; padding: 25px 0; border-top: 1px solid rgba(37,35,33,.22); }
.ref-step:last-child { border-bottom: 1px solid rgba(37,35,33,.22); }
.ref-step > span { font-size: 10px; letter-spacing: .08em; }
.ref-step strong { display: block; margin-bottom: 8px; font-size: 12px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }
.ref-step p { max-width: 620px; font-size: 14px; line-height: 1.6; color: rgba(37,35,33,.68); }
.ref-final { padding: clamp(92px, 10vw, 150px) 0; background: #292724; color: #f5f1eb; }
.ref-final-inner { max-width: 930px !important; text-align: center; }
.ref-final .ref-kicker { display: block; margin-bottom: 25px; color: rgba(255,255,255,.62); }
.ref-final h2 { font-size: clamp(39px, 4.7vw, 70px); }
.ref-final p { max-width: 660px; margin: 25px auto 34px; color: rgba(255,255,255,.67); font-size: 16px; line-height: 1.7; }
.ref-final-actions { display: flex; align-items: center; justify-content: center; gap: 34px; flex-wrap: wrap; }
.ref-final .ref-button:hover { background: #f5f1eb; color: #292724; }
.ref-text-link-light { color: rgba(255,255,255,.78); }

/* Public subpages: the same compact catalogue system, not a second design. */
body:not(.admin-body) .page-hero,
body:not(.admin-body) .page-hero.has-chapter {
  min-height: 430px;
  margin-top: 80px;
  padding: 90px 0 70px;
  align-items: center;
  background: #ddd6cd;
  border-bottom: 1px solid var(--border);
}
body:not(.admin-body) .page-hero-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
body:not(.admin-body) .page-hero-copy { padding: 0; }
body:not(.admin-body) .page-hero-chapter { display: none; }
body:not(.admin-body) .page-hero .eyebrow { margin-bottom: 23px; color: #58544f; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
body:not(.admin-body) .page-hero h1 {
  max-width: 1050px;
  margin-bottom: 24px;
  font-family: var(--font-display);
  font-size: clamp(43px, 5.2vw, 76px);
  font-weight: 400;
  line-height: 1.04;
  letter-spacing: .005em;
}
body:not(.admin-body) .page-hero p { max-width: 690px; font-size: 17px; line-height: 1.65; color: rgba(37,35,33,.7); }
body:not(.admin-body) .page-hero ~ .sec-pad { padding: clamp(82px, 8vw, 118px) 0; }
body:not(.admin-body) .page-hero ~ .sec-pad-tight { padding: clamp(70px, 7vw, 100px) 0; }
body:not(.admin-body) .page-hero ~ section h2,
body:not(.admin-body) .page-hero ~ section h3,
body:not(.admin-body) .pdp .info h1 { font-family: var(--font-display); font-weight: 400; letter-spacing: 0; }
body:not(.admin-body) .axis,
body:not(.admin-body) .axis.axis-photo,
body:not(.admin-body) .way-card,
body:not(.admin-body) .hp-card-media,
body:not(.admin-body) .hp-model-media,
body:not(.admin-body) .lib-card,
body:not(.admin-body) .lib-page-card,
body:not(.admin-body) .jrn-card .visual,
body:not(.admin-body) .article-figure,
body:not(.admin-body) .materials .visual,
body:not(.admin-body) .alt-row .visual,
body:not(.admin-body) .mat-card .visual,
body:not(.admin-body) .mii .visual,
body:not(.admin-body) .pdp .gallery-main,
body:not(.admin-body) .pdp .gallery-thumbs > div,
body:not(.admin-body) .team-photo,
body:not(.admin-body) .craft-film { border-radius: 0; }
body:not(.admin-body) .axes-grid,
body:not(.admin-body) .mat-grid,
body:not(.admin-body) .lib-page-grid,
body:not(.admin-body) .jrn-grid { gap: 1px; background: var(--border); border: 1px solid var(--border); }
body:not(.admin-body) .axis,
body:not(.admin-body) .mat-card,
body:not(.admin-body) .lib-page-card,
body:not(.admin-body) .jrn-card { background: var(--cream); }
body:not(.admin-body) .axis { border-radius: 0; }
body:not(.admin-body) .alt-row { margin-bottom: clamp(76px, 8vw, 120px); }
body:not(.admin-body) .btn-primary,
body:not(.admin-body) .btn-outline-light,
body:not(.admin-body) .radio-pill,
body:not(.admin-body) .form-field input,
body:not(.admin-body) .form-field select,
body:not(.admin-body) .form-field textarea { border-radius: 0; }
body:not(.admin-body) .btn-primary,
body:not(.admin-body) .btn-outline-light { letter-spacing: .08em; text-transform: uppercase; }
body:not(.admin-body) .cta { width: 100%; margin: 0; padding: clamp(84px, 9vw, 130px) 0; border-radius: 0; }
body:not(.admin-body) .cta h2 { font-family: var(--font-display); font-weight: 400; }
body:not(.admin-body) .cta-kicker { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; }

/* Dark, compact information footer from the reference. */
body:not(.admin-body) footer { padding: 72px 0 34px; background: #292724; color: #f3f0eb; }
body:not(.admin-body) footer .wordmark { color: #fff; }
body:not(.admin-body) .foot-story { margin-bottom: 56px; padding-bottom: 38px; border-bottom-color: rgba(255,255,255,.18); }
body:not(.admin-body) .foot-story > div > span,
body:not(.admin-body) .foot-col h5,
body:not(.admin-body) .foot-col .foot-heading { color: rgba(255,255,255,.52); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
body:not(.admin-body) .foot-story p { color: #fff; font-family: var(--font-display); font-size: clamp(24px, 2.5vw, 37px); font-weight: 400; }
body:not(.admin-body) .foot-story > a { border: 1px solid rgba(255,255,255,.58); border-radius: 0; background: transparent; color: #fff; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
body:not(.admin-body) .foot-story > a:hover { background: #fff; color: #292724; }
body:not(.admin-body) .foot-grid { grid-template-columns: 1.5fr .8fr .9fr 1fr; gap: clamp(34px, 5vw, 70px); }
body:not(.admin-body) footer .foot-col a { color: rgba(255,255,255,.72); font-size: 12px; }
body:not(.admin-body) footer .foot-col a:hover { color: #fff; }
body:not(.admin-body) footer .foot-brand .small { color: rgba(255,255,255,.56); font-size: 12px; }
body:not(.admin-body) .foot-bottom { color: rgba(255,255,255,.68); border-top-color: rgba(255,255,255,.16); }
body:not(.admin-body) .foot-subscribe label,
body:not(.admin-body) .foot-subscribe-privacy { color: rgba(255,255,255,.52); }
body:not(.admin-body) .foot-subscribe-row { gap: 0; }
body:not(.admin-body) .foot-subscribe-row input { border-radius: 0; border-color: rgba(255,255,255,.28); background: transparent; color: #fff; }
body:not(.admin-body) .foot-subscribe-row button { border-radius: 0; border: 1px solid rgba(255,255,255,.28); background: #f5f1eb; color: #292724; }

@media (max-width: 1120px) {
  body:not(.admin-body) .nav-links { display: none; }
  body:not(.admin-body) .nav-cta { display: none; }
  body:not(.admin-body) .hamburger { display: flex; }
  .ref-strength-grid, .ref-product-grid { grid-template-columns: repeat(2, 1fr); }
  .ref-strength:nth-child(3) { padding-left: 0; border-left: 0; }
  .ref-strength:nth-child(n+3) { margin-top: 36px; padding-top: 36px; border-top: 1px solid var(--border); }
  .ref-proof-grid { grid-template-columns: repeat(2, 1fr); }
  .ref-proof-band .ref-strength,
  .ref-proof-band .ref-strength:nth-child(3),
  .ref-proof-band .ref-strength:nth-child(n+3) { min-height: 138px; margin: 0; padding: 26px 30px; border-left: 1px solid var(--border); border-top: 1px solid var(--border); }
  .ref-proof-band .ref-strength:nth-child(odd) { border-left: 0; }
  .ref-proof-band .ref-strength:nth-child(-n+2) { border-top: 0; }
}

@media (max-width: 760px) {
  body:not(.admin-body) .nav { height: 64px; }
  body:not(.admin-body) .nav-inner { padding: 0 20px; }
  body:not(.admin-body) .wordmark { font-size: 18px; }
  .ref-hero { min-height: 690px; margin-top: 64px; }
  .ref-hero-image { inset: auto 0 0; width: 100%; height: 53%; object-position: center 53%; transform: none; }
  .ref-hero-shade { background: linear-gradient(180deg, #cfc8bf 0%, #cfc8bf 47%, rgba(207,200,191,.8) 58%, rgba(207,200,191,0) 78%); }
  .ref-hero-inner { min-height: 0; height: 48%; justify-content: flex-start; padding-top: 58px !important; }
  .ref-hero .ref-kicker { margin-bottom: 16px; }
  .ref-hero h1 { font-size: clamp(34px, 10vw, 44px); }
  .ref-hero h1 > span { white-space: normal; }
  .ref-hero p { margin-top: 17px; font-size: 14px; line-height: 1.55; }
  .ref-hero .ref-button { margin-top: 24px; min-height: 44px; }
  .ref-category-band { padding: 6px 0; }
  .ref-category-grid { grid-template-columns: 1fr; gap: 6px; }
  .ref-category { min-height: 255px; }
  .ref-about { padding-bottom: 56px; }
  .ref-about-grid { grid-template-columns: 1fr; }
  .ref-about-copy { padding: 50px 24px; border-right: 0; }
  .ref-about-image { min-height: 360px; }
  .ref-strengths-block { padding: 48px 24px 0; }
  .ref-section-title { display: block; }
  .ref-section-title .ref-kicker { display: block; margin-bottom: 14px; }
  .ref-strength-grid { grid-template-columns: 1fr; }
  .ref-strength,
  .ref-strength:first-child,
  .ref-strength:nth-child(3) { min-height: 0; padding: 28px 0; margin: 0; border: 0; border-top: 1px solid var(--border); }
  .ref-strength:last-child { border-bottom: 1px solid var(--border); }
  .ref-strength-mark { margin-bottom: 20px; }
  .ref-section-head { display: block; }
  .ref-section-head .ref-text-link { margin-top: 24px; }
  .ref-product-grid { grid-template-columns: repeat(2, 1fr); }
  .ref-product-copy { min-height: 76px; padding: 14px; }
  .ref-product-copy strong { font-size: 16px; }
  .ref-process-grid { grid-template-columns: 1fr; gap: 52px; }
  .ref-final-actions { flex-direction: column; }
  body:not(.admin-body) .page-hero,
  body:not(.admin-body) .page-hero.has-chapter { min-height: 390px; margin-top: 64px; padding: 70px 0 56px; }
  body:not(.admin-body) .page-hero h1 { font-size: clamp(38px, 11vw, 54px); }
  body:not(.admin-body) .page-hero p { font-size: 15px; }
  body:not(.admin-body) .foot-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 500px) {
  .ref-proof-grid { grid-template-columns: 1fr; }
  .ref-proof-band .ref-strength,
  .ref-proof-band .ref-strength:nth-child(2),
  .ref-proof-band .ref-strength:nth-child(3),
  .ref-proof-band .ref-strength:nth-child(4) { min-height: 0; padding: 24px; border-left: 0; border-top: 1px solid var(--border); }
  .ref-proof-band .ref-strength:first-child { border-top: 0; }
  .ref-product-grid { grid-template-columns: 1fr; }
  body:not(.admin-body) .foot-grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════════════
   Client-selected strict reference layout — August 2026, v42.
   The homepage geometry follows the supplied mock-up: white catalogue nav,
   shallow full-bleed hero, three collection tiles, compact company/strengths
   row, then a six-column dark footer.
   ═══════════════════════════════════════════════════════════════════════ */
body:not(.admin-body) .nav {
  height: 80px;
  background: #faf9f7;
  border-bottom: 0;
  box-shadow: none;
}
body:not(.admin-body) .nav-inner { max-width: 1400px; padding: 0 64px; gap: 30px; }
body:not(.admin-body) .nav-wordmark { gap: 5px; min-width: 190px; }
body:not(.admin-body) .nav-wordmark > span { font-size: 25px; letter-spacing: .34em; }
body:not(.admin-body) .nav-wordmark small { padding-left: 0; font-size: 8px; letter-spacing: .24em; }
body:not(.admin-body) .nav-links { gap: clamp(20px, 2.15vw, 36px); margin: 0 auto; }
body:not(.admin-body) .nav-links a {
  padding: 6px 0;
  border: 0;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .015em;
  opacity: 1;
}
body:not(.admin-body) .nav-links a:hover { border: 0; opacity: .72; }
body:not(.admin-body) .nav-links a.active { border: 0; opacity: 1; }
.language-pair { display: inline-flex; align-items: center; gap: 7px; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.language-pair a { opacity: .68; }
.language-pair a[aria-current="page"] { opacity: 1; }
body:not(.admin-body) .nav-actions { gap: 30px; }
body:not(.admin-body) .nav-cta { min-width: 120px; min-height: 36px; padding: 0 20px; justify-content: center; background: #292826; color: #fff; border-color: #292826; font-size: 10px; }

.strict-hero { position: relative; height: 600px; margin-top: 80px; overflow: hidden; background: #554f48; color: #fff; }
.strict-hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 62%; display: block; }
.strict-hero-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(25,22,19,.64) 0%, rgba(25,22,19,.42) 37%, rgba(25,22,19,.06) 69%, rgba(25,22,19,.08) 100%); }
.strict-hero-content { position: relative; z-index: 1; height: 100%; max-width: 1312px !important; padding: 0 0 0 54px !important; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.strict-hero h1 { max-width: 610px; color: #fff; font-family: var(--font-sans); font-size: clamp(27px, 2.15vw, 34px); font-weight: 400; line-height: 1.22; letter-spacing: .13em; text-transform: uppercase; text-wrap: balance; }
.strict-hero p { max-width: 390px; margin-top: 16px; color: rgba(255,255,255,.86); font-size: 13px; line-height: 1.6; }
.strict-outline-button { min-width: 150px; height: 40px; margin-top: 30px; border: 1px solid rgba(255,255,255,.72); display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; transition: background .2s ease, color .2s ease; }
.strict-outline-button:hover { background: #fff; color: #292826; }
.strict-hero-dots { position: absolute; z-index: 2; left: 50%; bottom: 17px; display: flex; gap: 11px; transform: translateX(-50%); }
.strict-hero-dots i { width: 29px; height: 2px; background: rgba(255,255,255,.36); }
.strict-hero-dots i:first-child { background: #fff; }

.strict-categories { padding: 10px 0 18px; background: #f7f4f1; }
.strict-category-grid { max-width: 1312px !important; padding: 0 !important; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.strict-category { position: relative; height: auto; overflow: hidden; display: block; border: 1px solid #e4ded8; background: #f5f0ec; color: #292725; }
.strict-category img { position: relative; inset: auto; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; object-position: center; display: block; filter: none; transition: transform .55s ease; }
.strict-category:hover img { transform: scale(1.025); }
.strict-category-shade { display: none; }
.strict-category-copy { position: static; padding: 18px 20px 20px; display: flex; flex-direction: row; justify-content: space-between; align-items: baseline; gap: 18px; border-top: 1px solid #e4ded8; background: #fff; }
.strict-category-copy strong { font-family: var(--font-serif); font-size: 20px; font-weight: 400; letter-spacing: 0; text-transform: none; }
.strict-category-copy > span { flex: 0 0 auto; padding-bottom: 3px; border-bottom: 1px solid rgba(41,39,37,.55); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }

.strict-summary { background: #f5f3f0; }
.strict-summary-grid { max-width: 1312px !important; height: 218px; padding: 0 !important; display: grid; grid-template-columns: .72fr 1fr 1.68fr; border-top: 1px solid #e2ded8; overflow: hidden; }
.strict-about-copy { padding: 25px 32px 22px; background: #f8f6f3; }
.strict-about-copy h2,
.strict-strengths > h2 { font-family: var(--font-sans); font-size: 17px; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; }
.strict-about-copy p { max-width: 275px; margin-top: 18px; color: #56514b; font-size: 11px; line-height: 1.72; }
.strict-small-button { min-width: 108px; height: 30px; margin-top: 17px; border: 1px solid #5e5953; display: inline-flex; align-items: center; justify-content: center; font-size: 9px; letter-spacing: .07em; text-transform: uppercase; }
.strict-about-image { min-height: 218px; overflow: hidden; }
.strict-about-image img { width: 100%; height: 100%; object-fit: cover; object-position: center 45%; filter: grayscale(1) contrast(.84); display: block; }
.strict-strengths { padding: 24px 28px 18px; background: #f8f6f3; }
.strict-strength-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 17px; margin-top: 28px; }
.strict-strength { text-align: center; }
.strict-strength-icon { width: 42px; height: 42px; margin: 0 auto 13px; display: grid; place-items: center; font-family: Georgia, serif; font-size: 34px; font-weight: 300; line-height: 1; }
.strict-strength strong { display: block; min-height: 27px; font-size: 9px; font-weight: 600; line-height: 1.35; letter-spacing: .045em; text-transform: uppercase; }
.strict-strength p { margin: 7px auto 0; max-width: 125px; color: #625d57; font-size: 10px; line-height: 1.45; }

body:not(.admin-body) .reference-footer { padding: 24px 0 15px; background: #292927; }
body:not(.admin-body) .reference-footer .container { max-width: 1312px; padding: 0; }
body:not(.admin-body) .reference-foot-grid { grid-template-columns: 1.42fr .78fr .86fr 1fr .7fr 1.12fr; gap: 34px; }
.reference-foot-name { color: #fff; font-size: 17px; font-weight: 500; letter-spacing: .2em; }
.reference-foot-brand p { margin-top: 5px; color: rgba(255,255,255,.58); font-size: 9px; letter-spacing: .12em; }
body:not(.admin-body) .reference-footer .foot-heading { margin-bottom: 10px; color: rgba(255,255,255,.7); font-size: 9px; font-weight: 500; letter-spacing: .08em; }
body:not(.admin-body) .reference-footer .foot-col li { margin-bottom: 2px; line-height: 1.35; }
body:not(.admin-body) .reference-footer .foot-col a { color: rgba(255,255,255,.72); font-size: 9px; }
body:not(.admin-body) .reference-footer .foot-social { display: flex; flex-direction: column; gap: 3px; }
body:not(.admin-body) .reference-footer .foot-bottom { margin-top: 18px; padding-top: 10px; color: rgba(255,255,255,.5); font-size: 8px; }

@media (max-width: 1400px) {
  .strict-hero-content,
  .strict-category-grid,
  .strict-summary-grid,
  body:not(.admin-body) .reference-footer .container { width: calc(100% - 64px); }
}

@media (max-width: 1120px) {
  body:not(.admin-body) .nav-inner { padding: 0 28px; }
  body:not(.admin-body) .nav-wordmark { min-width: 0; }
  body:not(.admin-body) .nav-actions .language-pair { display: none; }
  .strict-strength-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; margin-top: 20px; }
  .strict-summary-grid { grid-template-columns: .8fr 1fr 1.4fr; }
  .strict-summary-grid { height: 300px; }
  .strict-about-image { min-height: 0; }
  body:not(.admin-body) .reference-foot-grid { grid-template-columns: repeat(3, 1fr); row-gap: 28px; }
}

@media (max-width: 760px) {
  body:not(.admin-body) .nav { height: 64px; }
  body:not(.admin-body) .nav-wordmark > span { font-size: 20px; }
  .mobile-menu .language-pair { display: flex; justify-content: center; margin: 10px 0; font-size: 16px; }
  .strict-hero { height: 560px; margin-top: 64px; }
  .strict-hero-image { object-position: 70% center; }
  .strict-hero-overlay { background: linear-gradient(180deg, rgba(25,22,19,.64), rgba(25,22,19,.28) 62%, rgba(25,22,19,.08)); }
  .strict-hero-content { width: 100%; padding: 58px 24px 0 !important; justify-content: flex-start; }
  .strict-hero h1 { max-width: 340px; font-size: 29px; line-height: 1.25; letter-spacing: .09em; }
  .strict-hero p { max-width: 330px; font-size: 13px; }
  .strict-category-grid { width: 100%; grid-template-columns: 1fr; gap: 10px; }
  .strict-category { height: auto; }
  .strict-summary-grid { width: 100%; height: auto; grid-template-columns: 1fr; overflow: visible; }
  .strict-about-copy { padding: 38px 24px; }
  .strict-about-copy p { max-width: 430px; font-size: 13px; }
  .strict-about-image { display: none; }
  .strict-strengths { padding: 38px 24px; }
  .strict-strength-grid { grid-template-columns: repeat(2, 1fr); gap: 30px 20px; }
  .strict-strength strong { font-size: 10px; }
  .strict-strength p { font-size: 11px; }
  body:not(.admin-body) .reference-footer { padding: 40px 0 22px; }
  body:not(.admin-body) .reference-footer .container { width: 100%; padding: 0 24px; }
  body:not(.admin-body) .reference-foot-grid { grid-template-columns: 1fr 1fr; gap: 30px 22px; }
  .reference-foot-brand { grid-column: 1 / -1; }
  body:not(.admin-body) .reference-footer .foot-col a { font-size: 11px; }
}

@media (max-width: 500px) {
  .strict-hero h1 { font-size: 26px; }
  .strict-strength-grid { grid-template-columns: 1fr 1fr; }
  body:not(.admin-body) .reference-foot-grid { grid-template-columns: 1fr; }
  .reference-foot-brand { grid-column: auto; }
  body:not(.admin-body) .reference-footer .foot-bottom { display: block; }
  body:not(.admin-body) .reference-footer .foot-bottom > div + div { margin-top: 8px; }
}

/* ══════════════════════════════════════════════════════════════════════
   Client-reference system for every public subpage — v44.
   The strict home is the source of truth: shallow photographic headers,
   square catalogue geometry, warm greys, fine rules and compact dark CTAs.
   ══════════════════════════════════════════════════════════════════════ */

body:not(.admin-body) main { background: #f5f3f0; }
body:not(.admin-body) main > section:not(.strict-hero):not(.strict-categories):not(.strict-summary):not(.page-hero):not(.cta):not(.craft-film) {
  border-top-color: #ded9d2;
}

/* Every subpage opens like the selected homepage reference. */
body:not(.admin-body) .page-hero,
body:not(.admin-body) .page-hero.has-chapter {
  position: relative;
  min-height: 360px;
  height: 360px;
  margin-top: 80px;
  padding: 0;
  overflow: hidden;
  display: block;
  background: #4d4842;
  color: #fff;
  border: 0;
}
body:not(.admin-body) .page-hero-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 52%;
  display: block;
  filter: saturate(.72) contrast(.94) brightness(.8);
}
body:not(.admin-body) .page-hero-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(24,21,18,.78) 0%, rgba(24,21,18,.58) 39%, rgba(24,21,18,.16) 69%, rgba(24,21,18,.07) 100%);
}
body:not(.admin-body) .page-hero > .container {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 1312px;
  height: 100%;
  padding: 0 0 0 54px;
}
body:not(.admin-body) .page-hero-grid {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
}
body:not(.admin-body) .page-hero-copy,
body:not(.admin-body) .page-hero.has-chapter .page-hero-copy {
  max-width: 690px;
  padding: 0;
}
body:not(.admin-body) .page-hero-chapter { display: none; }
body:not(.admin-body) .page-hero .eyebrow {
  display: block;
  margin: 0 0 18px;
  color: rgba(255,255,255,.72);
  font-size: 10px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: .15em;
  text-transform: uppercase;
}
body:not(.admin-body) .page-hero h1,
body:not(.admin-body) .page-hero.has-chapter h1 {
  max-width: 690px;
  margin: 0;
  color: #fff;
  font-family: var(--font-sans);
  font-size: clamp(30px, 3vw, 43px);
  font-weight: 400;
  line-height: 1.16;
  letter-spacing: .09em;
  text-transform: uppercase;
  text-wrap: balance;
}
body:not(.admin-body) .page-hero p,
body:not(.admin-body) .page-hero.has-chapter p {
  max-width: 520px;
  margin: 18px 0 0;
  color: rgba(255,255,255,.82);
  font-size: 13px;
  line-height: 1.62;
}
body:not(.admin-body) .page-hero .article-meta {
  margin-top: 18px;
  color: rgba(255,255,255,.62);
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* Compact catalogue sections and headings. */
body:not(.admin-body) .page-hero ~ .sec-pad,
body:not(.admin-body) .page-hero ~ .sec-pad-tight,
body:not(.admin-body) .sec-pad,
body:not(.admin-body) .sec-pad-tight { padding: 68px 0; }
body:not(.admin-body) .page-hero ~ section h2,
body:not(.admin-body) .page-hero ~ section h3,
body:not(.admin-body) .pdp .info h1,
body:not(.admin-body) .jrn-card h2,
body:not(.admin-body) .jrn-card h3,
body:not(.admin-body) .mat-card h3,
body:not(.admin-body) .axis h3,
body:not(.admin-body) .mii .copy h2 {
  font-family: var(--font-sans);
  font-weight: 500;
  letter-spacing: .025em;
}
body:not(.admin-body) .page-hero ~ section h2,
body:not(.admin-body) .page-hero ~ section h3 { line-height: 1.22; }
body:not(.admin-body) .page-hero ~ section[style*="background:var(--cream)"],
body:not(.admin-body) .page-hero ~ section[style*="background:var(--sand)"] { border-top: 1px solid #ded9d2; }
body:not(.admin-body) .eyebrow { font-size: 10px; letter-spacing: .13em; text-transform: uppercase; }
body:not(.admin-body) .ul-link { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
body:not(.admin-body) .btn-primary,
body:not(.admin-body) .btn-outline-light {
  min-height: 40px;
  padding: 0 22px;
  border-radius: 0;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .09em;
  text-transform: uppercase;
}

/* Editorial rows become compact image-and-copy catalogue modules. */
body:not(.admin-body) .alt-row {
  grid-template-columns: minmax(0, 1.08fr) minmax(330px, .92fr);
  gap: 0;
  margin: 0 0 8px;
  align-items: stretch;
  border: 1px solid #ded9d2;
  background: #f8f6f3;
  overflow: hidden;
}
body:not(.admin-body) .alt-row .visual {
  min-height: 330px;
  height: 100%;
  aspect-ratio: auto;
  border-radius: 0;
}
body:not(.admin-body) .alt-row .visual img,
body:not(.admin-body) .alt-row .visual video {
  width: 100%;
  height: 100%;
  min-height: 330px;
  object-fit: cover;
  filter: saturate(.66) contrast(.92);
}
body:not(.admin-body) .alt-row .copy {
  min-height: 330px;
  padding: clamp(38px, 4.4vw, 64px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
body:not(.admin-body) .alt-row .copy h3 {
  margin: 13px 0 17px;
  font-size: clamp(22px, 2.2vw, 31px);
}
body:not(.admin-body) .alt-row .copy p { max-width: 520px; margin: 0; font-size: 14px; line-height: 1.7; color: #625d57; }
body:not(.admin-body) .alt-row .step-num { margin: 0 0 10px; color: #77716a; font-size: 11px; font-weight: 500; letter-spacing: .12em; opacity: 1; }
body:not(.admin-body) .proc-subblock { margin-top: 8px; gap: 11px 22px; }
body:not(.admin-body) .proc-subblock dt { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
body:not(.admin-body) .proc-subblock dd { font-size: 13px; line-height: 1.55; }

/* Customisation, material, product, work and journal grids. */
body:not(.admin-body) .axes-grid {
  margin-top: 40px;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  border: 1px solid #d8d2ca;
  background: #d8d2ca;
}
body:not(.admin-body) .axis,
body:not(.admin-body) .axis.axis-photo { padding: 0 0 26px; background: #f8f6f3; }
body:not(.admin-body) .axis-media { height: 176px; margin-bottom: 23px; overflow: hidden; }
body:not(.admin-body) .axis-media img { filter: saturate(.65) contrast(.92); }
body:not(.admin-body) .axis .num,
body:not(.admin-body) .axis h3,
body:not(.admin-body) .axis p { margin-left: 25px; margin-right: 25px; }
body:not(.admin-body) .axis .num { margin-bottom: 8px; color: #716b64; font-size: 10px; letter-spacing: .12em; opacity: 1; }
body:not(.admin-body) .axis h3 { margin-bottom: 9px; font-size: 15px; text-transform: uppercase; }
body:not(.admin-body) .axis p { font-size: 12px; line-height: 1.55; }

body:not(.admin-body) .mat-grid {
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  margin-top: 38px;
  border: 1px solid #d8d2ca;
  background: #d8d2ca;
}
body:not(.admin-body) .mat-card { padding: 0 0 24px; background: #f8f6f3; }
body:not(.admin-body) .mat-card .visual { height: 180px; aspect-ratio: auto; margin: 0 0 22px; }
body:not(.admin-body) .mat-card .visual img { filter: saturate(.64) contrast(.92); }
body:not(.admin-body) .mat-card h3,
body:not(.admin-body) .mat-card p { margin-left: 22px; margin-right: 22px; }
body:not(.admin-body) .mat-card h3 { margin-bottom: 9px; font-size: 15px; text-transform: uppercase; }
body:not(.admin-body) .mat-card p { font-size: 12px; line-height: 1.55; }

body:not(.admin-body) .filter-bar { gap: 6px; margin-bottom: 28px; }
body:not(.admin-body) .filter-pill { padding: 8px 17px; border: 1px solid #9c958c; border-radius: 0; background: transparent; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
body:not(.admin-body) .filter-pill.active { background: #292826; color: #fff; border-color: #292826; }
body:not(.admin-body) .lib-page-grid { gap: 7px; border: 0; background: transparent; }
body:not(.admin-body) .lib-page-card { background: #dfd9d2; }
body:not(.admin-body) .lib-page-card .swatch img { filter: saturate(.58) contrast(.94); }
body:not(.admin-body) .lib-page-card .meta { left: 22px; right: 22px; bottom: 19px; }
body:not(.admin-body) .lib-page-card .meta .cat { font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
body:not(.admin-body) .lib-page-card .meta .name { font-size: 15px; font-weight: 400; letter-spacing: .05em; text-transform: uppercase; }

body:not(.admin-body) .jrn-grid { grid-template-columns: repeat(3, 1fr); gap: 36px 8px; margin-top: 42px; border: 0; background: transparent; }
body:not(.admin-body) .jrn-card { background: transparent; }
body:not(.admin-body) .jrn-card .visual { margin-bottom: 17px; filter: saturate(.6) contrast(.92); }
body:not(.admin-body) .jrn-card .cat { margin-bottom: 8px; font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
body:not(.admin-body) .jrn-card h2,
body:not(.admin-body) .jrn-card h3 { margin-bottom: 9px; font-size: 17px; }
body:not(.admin-body) .jrn-card p { margin-bottom: 11px; font-size: 12px; line-height: 1.55; }
body:not(.admin-body) .jrn-meta { font-size: 9px; letter-spacing: .06em; text-transform: uppercase; }

body:not(.admin-body) .work-gallery { padding: 8px 0 70px; }
body:not(.admin-body) .work-gallery .hp-model-grid { grid-template-columns: repeat(4, 1fr); gap: 8px; }
body:not(.admin-body) .work-piece { background: #f8f6f3; }
body:not(.admin-body) .work-piece .hp-model-media { aspect-ratio: 4 / 5; }
body:not(.admin-body) .work-piece img { filter: saturate(.48) contrast(.94); }
body:not(.admin-body) .work-piece figcaption { min-height: 62px; padding: 17px; font-size: 11px; line-height: 1.5; }

/* About, showroom, long-form content and FAQs. */
body:not(.admin-body) .prose {
  max-width: 860px;
  padding: clamp(34px, 4.5vw, 58px);
  border: 1px solid #ded9d2;
  background: #f8f6f3;
  color: #57524d;
  font-size: 14px;
  line-height: 1.75;
}
body:not(.admin-body) .prose .prose-lead { color: #292622; font-size: 20px; line-height: 1.55; }
body:not(.admin-body) .prose h2 { margin: 38px 0 12px; font-size: 19px; letter-spacing: .03em; text-transform: uppercase; }
body:not(.admin-body) .mii {
  grid-template-columns: 1fr 1fr;
  gap: 0;
  align-items: stretch;
  border: 1px solid #ded9d2;
  background: #f8f6f3;
}
body:not(.admin-body) .mii .visual { min-height: 340px; height: 100%; aspect-ratio: auto; }
body:not(.admin-body) .mii .visual img { filter: grayscale(1) contrast(.86); }
body:not(.admin-body) .mii .copy { min-height: 340px; padding: clamp(36px, 4.5vw, 64px); display: flex; flex-direction: column; justify-content: center; }
body:not(.admin-body) .mii .copy h2 { margin: 15px 0 17px; font-size: clamp(22px, 2.2vw, 31px); }
body:not(.admin-body) .mii .copy p { margin-bottom: 13px; font-size: 13px; line-height: 1.65; }
body:not(.admin-body) .row-list { margin-top: 30px; }
body:not(.admin-body) .row-list > div { padding: 17px 0; font-size: 15px; }
body:not(.admin-body) .accordion { margin-top: 0; }
body:not(.admin-body) .acc-q { padding: 22px 0; font-size: 14px; }
body:not(.admin-body) .acc-body-inner { font-size: 13px; line-height: 1.65; }

/* Form and model detail preserve functionality but adopt the catalogue finish. */
body:not(.admin-body) .form-grid { grid-template-columns: minmax(0, 1.12fr) minmax(300px, .88fr); gap: 8px; margin-top: 0; }
body:not(.admin-body) #brief-form,
body:not(.admin-body) .contact-info { height: 100%; padding: clamp(30px, 4vw, 52px); border: 1px solid #ded9d2; background: #f8f6f3; }
body:not(.admin-body) .form-field { margin-bottom: 25px; }
body:not(.admin-body) .form-field label { margin-bottom: 7px; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
body:not(.admin-body) .form-field input,
body:not(.admin-body) .form-field select,
body:not(.admin-body) .form-field textarea { border-color: #c9c2ba; background: #fff; padding: 11px 12px; font-size: 14px; }
body:not(.admin-body) .radio-group { gap: 6px; }
body:not(.admin-body) .radio-pill { padding: 8px 13px; border-radius: 0; font-size: 10px; }
body:not(.admin-body) .contact-info h2,
body:not(.admin-body) .contact-info h3 { font-size: 11px; letter-spacing: .09em; text-transform: uppercase; }
body:not(.admin-body) .contact-info .lines { font-size: 13px; }

body:not(.admin-body) .pdp-section { margin-top: 80px; padding: 58px 0 70px; }
body:not(.admin-body) .pdp { grid-template-columns: minmax(0, 1.05fr) minmax(340px, .95fr); gap: 8px; align-items: stretch; }
body:not(.admin-body) .pdp > div { background: #f8f6f3; }
body:not(.admin-body) .pdp .gallery-main { aspect-ratio: 4 / 5; }
body:not(.admin-body) .pdp .gallery-main img,
body:not(.admin-body) .pdp .gallery-thumbs img { filter: saturate(.58) contrast(.94); }
body:not(.admin-body) .pdp .info { position: static; padding: clamp(34px, 4vw, 58px); }
body:not(.admin-body) .pdp .info h1 { margin-bottom: 17px; font-size: clamp(28px, 3vw, 41px); text-transform: uppercase; }
body:not(.admin-body) .pdp .info .desc { margin-bottom: 22px; font-size: 14px; line-height: 1.65; }
body:not(.admin-body) .pdp .divider { margin: 22px 0; }
body:not(.admin-body) .pdp h3 { margin-bottom: 12px; font-size: 10px; letter-spacing: .09em; text-transform: uppercase; }
body:not(.admin-body) .spec-row { grid-template-columns: 112px 1fr; padding: 9px 0; font-size: 12px; }
body:not(.admin-body) .spec-row .label { font-size: 10px; letter-spacing: .05em; text-transform: uppercase; }

body:not(.admin-body) .article-figure { max-height: 520px; }
body:not(.admin-body) .article-figure img { filter: saturate(.62) contrast(.94); }
body:not(.admin-body) .article-foot { border-top-color: #cfc8c0; }

/* End every route with the same compact dark conversion band. */
body:not(.admin-body) .cta {
  width: 100%;
  min-height: 270px;
  margin: 0;
  padding: 58px 0;
  display: flex;
  align-items: center;
  border-radius: 0;
  background: #292826;
}
body:not(.admin-body) .cta h2 { margin-bottom: 16px; font-family: var(--font-sans); font-size: clamp(25px, 2.6vw, 38px); font-weight: 400; letter-spacing: .04em; text-transform: uppercase; }
body:not(.admin-body) .cta p { margin-bottom: 24px; font-size: 13px; line-height: 1.6; }
body:not(.admin-body) .cta-kicker { margin-bottom: 13px; }
body:not(.admin-body) .cta-link { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
body:not(.admin-body) .craft-film { height: 440px; }
body:not(.admin-body) .craft-film-media { filter: saturate(.6) contrast(.92); }

@media (max-width: 1400px) {
  body:not(.admin-body) .page-hero > .container { width: calc(100% - 64px); }
}

@media (max-width: 1000px) {
  body:not(.admin-body) .mat-grid { grid-template-columns: repeat(2, 1fr); }
  body:not(.admin-body) .jrn-grid { grid-template-columns: repeat(2, 1fr); }
  body:not(.admin-body) .work-gallery .hp-model-grid { grid-template-columns: repeat(2, 1fr); }
  body:not(.admin-body) .axes-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 760px) {
  body:not(.admin-body) .page-hero,
  body:not(.admin-body) .page-hero.has-chapter { height: 340px; min-height: 340px; margin-top: 64px; padding: 0; }
  body:not(.admin-body) .page-hero-media { object-position: 62% center; }
  body:not(.admin-body) .page-hero-shade { background: linear-gradient(90deg, rgba(24,21,18,.82), rgba(24,21,18,.48) 72%, rgba(24,21,18,.18)); }
  body:not(.admin-body) .page-hero > .container { width: 100%; padding: 0 24px; }
  body:not(.admin-body) .page-hero h1,
  body:not(.admin-body) .page-hero.has-chapter h1 { max-width: 340px; font-size: clamp(25px, 7.7vw, 32px); line-height: 1.18; letter-spacing: .07em; }
  body:not(.admin-body) .page-hero p,
  body:not(.admin-body) .page-hero.has-chapter p { max-width: 330px; font-size: 12px; line-height: 1.55; }
  body:not(.admin-body) .page-hero ~ .sec-pad,
  body:not(.admin-body) .page-hero ~ .sec-pad-tight,
  body:not(.admin-body) .sec-pad,
  body:not(.admin-body) .sec-pad-tight { padding: 48px 0; }
  body:not(.admin-body) .alt-row,
  body:not(.admin-body) .alt-row.reverse { grid-template-columns: 1fr; }
  body:not(.admin-body) .alt-row.reverse > :first-child { order: 0; }
  body:not(.admin-body) .alt-row .visual,
  body:not(.admin-body) .alt-row .visual img,
  body:not(.admin-body) .alt-row .visual video { min-height: 250px; height: 250px; }
  body:not(.admin-body) .alt-row .copy { min-height: 0; padding: 34px 24px; }
  body:not(.admin-body) .axes-grid,
  body:not(.admin-body) .mat-grid,
  body:not(.admin-body) .jrn-grid,
  body:not(.admin-body) .work-gallery .hp-model-grid { grid-template-columns: 1fr; }
  body:not(.admin-body) .mii { grid-template-columns: 1fr; }
  body:not(.admin-body) .mii .visual { min-height: 260px; }
  body:not(.admin-body) .mii .copy { min-height: 0; padding: 34px 24px; }
  body:not(.admin-body) .form-grid { grid-template-columns: 1fr; }
  body:not(.admin-body) #brief-form,
  body:not(.admin-body) .contact-info { padding: 30px 22px; }
  body:not(.admin-body) .pdp-section { margin-top: 64px; padding: 32px 0 48px; }
  body:not(.admin-body) .pdp { grid-template-columns: 1fr; }
  body:not(.admin-body) .pdp .info { padding: 32px 24px; }
  body:not(.admin-body) .cta { min-height: 0; padding: 58px 0; }
  body:not(.admin-body) .craft-film { height: 340px; }
}

/* ══════════════════════════════════════════════════════════════════════
   Content-led subpages — v45.
   The homepage keeps the selected client layout. Internal pages share its
   restraint and geometry, but open according to their job: split product
   story, image feature, editorial masthead or direct utility content.
   ══════════════════════════════════════════════════════════════════════ */

body:not(.admin-body) .page-hero,
body:not(.admin-body) .page-hero.has-chapter {
  height: auto;
  min-height: 0;
  margin-top: 80px;
  padding: 0;
  overflow: visible;
  background: #f3f0eb;
  color: #292622;
}
body:not(.admin-body) .page-hero > .container {
  width: min(100% - 64px, 1312px);
  max-width: 1312px;
  height: auto;
  margin: 0 auto;
  padding: 0;
}
body:not(.admin-body) .page-hero-grid {
  width: 100%;
  height: auto;
  display: grid;
  align-items: stretch;
}
body:not(.admin-body) .page-hero-copy,
body:not(.admin-body) .page-hero.has-chapter .page-hero-copy {
  max-width: none;
  padding: 0;
}
body:not(.admin-body) .page-hero .eyebrow {
  margin: 0 0 20px;
  color: #6f6860;
  font-size: 10px;
  letter-spacing: .15em;
}
body:not(.admin-body) .page-hero h1,
body:not(.admin-body) .page-hero.has-chapter h1 {
  max-width: 800px;
  margin: 0;
  color: #292622;
  font-size: clamp(34px, 3.7vw, 54px);
  font-weight: 400;
  line-height: 1.12;
  letter-spacing: .045em;
  text-transform: uppercase;
}
body:not(.admin-body) .page-hero p,
body:not(.admin-body) .page-hero.has-chapter p {
  max-width: 610px;
  margin: 24px 0 0;
  color: #635d56;
  font-size: 15px;
  line-height: 1.72;
}
body:not(.admin-body) .page-hero-visual {
  position: relative;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  background: #d8d1c8;
}
body:not(.admin-body) .page-hero-media {
  position: static;
  inset: auto;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
  filter: saturate(.68) contrast(.94);
}

/* Split opening: product choice, private label, manufacturing, about, showroom. */
body:not(.admin-body) .page-hero-split .page-hero-grid {
  grid-template-columns: minmax(390px, .78fr) minmax(0, 1.22fr);
  min-height: 490px;
  border: 1px solid #d8d2ca;
  background: #f7f5f2;
}
body:not(.admin-body) .page-hero-split .page-hero-copy {
  padding: clamp(46px, 5vw, 78px) clamp(38px, 4.5vw, 70px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
body:not(.admin-body) .page-hero-split .page-hero-visual { min-height: 488px; }

/* Feature opening: a direct introduction followed by one thematic scene. */
body:not(.admin-body) .page-hero-feature {
  padding: clamp(68px, 7vw, 96px) 0 0;
  background: #f5f3f0;
}
body:not(.admin-body) .page-hero-feature .page-hero-grid { grid-template-columns: 1fr; }
body:not(.admin-body) .page-hero-feature .page-hero-copy {
  width: min(100%, 940px);
  padding: 0 0 clamp(42px, 5vw, 66px);
}
body:not(.admin-body) .page-hero-feature .page-hero-visual {
  width: 100%;
  height: clamp(350px, 38vw, 520px);
}

/* Utility and editorial pages lead with information, not decorative media. */
body:not(.admin-body) .page-hero-plain,
body:not(.admin-body) .page-hero-editorial,
body:not(.admin-body) .page-hero-article {
  border-bottom: 1px solid #d8d2ca;
  background: #f5f3f0;
}
body:not(.admin-body) .page-hero-plain .page-hero-grid,
body:not(.admin-body) .page-hero-editorial .page-hero-grid,
body:not(.admin-body) .page-hero-article .page-hero-grid { grid-template-columns: 1fr; }
body:not(.admin-body) .page-hero-plain .page-hero-copy {
  width: min(100%, 900px);
  padding: clamp(74px, 8vw, 112px) 0 clamp(62px, 7vw, 92px);
}
body:not(.admin-body) .page-hero-editorial .page-hero-copy {
  width: min(100%, 1080px);
  padding: clamp(78px, 9vw, 128px) 0 clamp(68px, 8vw, 108px);
}
body:not(.admin-body) .page-hero-editorial h1,
body:not(.admin-body) .page-hero-article h1 {
  max-width: 1050px;
  font-family: var(--font-serif);
  font-size: clamp(44px, 6vw, 78px);
  line-height: 1.02;
  letter-spacing: -.02em;
  text-transform: none;
}
body:not(.admin-body) .page-hero-article .page-hero-copy {
  width: min(100%, 980px);
  padding: clamp(64px, 7vw, 96px) 0 clamp(44px, 5vw, 66px);
}
body:not(.admin-body) .page-hero-article p { max-width: 720px; }
body:not(.admin-body) .page-hero .article-meta {
  margin-top: 24px;
  color: #7a736b;
  font-size: 10px;
  letter-spacing: .09em;
}

/* Give long process pages a calmer editorial rhythm than the v44 card stack. */
body:not(.admin-body) .alt-row {
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
  margin: 0 0 28px;
  border: 0;
  background: transparent;
}
body:not(.admin-body) .alt-row .visual,
body:not(.admin-body) .alt-row .visual img,
body:not(.admin-body) .alt-row .visual video { min-height: 390px; }
body:not(.admin-body) .alt-row .copy {
  min-height: 390px;
  padding: clamp(44px, 5vw, 72px);
  background: #eeeae4;
}
body:not(.admin-body) .alt-row.reverse .copy { background: #e8e3dc; }

/* About copy should read as an editorial statement, not a boxed legal notice. */
body:not(.admin-body) .page-hero-split + .sec-pad-tight .prose {
  max-width: 980px;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: 15px;
  line-height: 1.82;
}
body:not(.admin-body) .page-hero-split + .sec-pad-tight .prose .prose-lead {
  max-width: 820px;
  margin-bottom: 34px;
  font-family: var(--font-serif);
  font-size: clamp(26px, 3vw, 40px);
  line-height: 1.32;
}

body:not(.admin-body) .contact-side-visual {
  height: 250px;
  margin: calc(-1 * clamp(30px, 4vw, 52px)) calc(-1 * clamp(30px, 4vw, 52px)) 38px;
  overflow: hidden;
  background: #d8d1c8;
}
body:not(.admin-body) .contact-side-visual img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 66% center;
  filter: saturate(.64) contrast(.94);
}
body:not(.admin-body) .mii .visual > img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

@media (max-width: 1000px) {
  body:not(.admin-body) .page-hero-split .page-hero-grid { grid-template-columns: minmax(340px, .88fr) minmax(0, 1.12fr); }
  body:not(.admin-body) .page-hero-split h1 { font-size: clamp(31px, 4.6vw, 44px); }
}

@media (max-width: 760px) {
  body:not(.admin-body) .page-hero,
  body:not(.admin-body) .page-hero.has-chapter {
    height: auto;
    min-height: 0;
    margin-top: 64px;
    padding: 0;
  }
  body:not(.admin-body) .page-hero > .container { width: 100%; padding: 0; }
  body:not(.admin-body) .page-hero-split .page-hero-grid { grid-template-columns: 1fr; min-height: 0; border-left: 0; border-right: 0; }
  body:not(.admin-body) .page-hero-split .page-hero-copy { padding: 46px 24px 42px; }
  body:not(.admin-body) .page-hero-split .page-hero-visual { min-height: 0; height: 260px; }
  body:not(.admin-body) .page-hero-feature { padding: 0; }
  body:not(.admin-body) .page-hero-feature .page-hero-copy { padding: 48px 24px 40px; }
  body:not(.admin-body) .page-hero-feature .page-hero-visual { height: 250px; }
  body:not(.admin-body) .page-hero-plain .page-hero-copy,
  body:not(.admin-body) .page-hero-editorial .page-hero-copy,
  body:not(.admin-body) .page-hero-article .page-hero-copy { width: 100%; padding: 58px 24px 50px; }
  body:not(.admin-body) .page-hero h1,
  body:not(.admin-body) .page-hero.has-chapter h1 { max-width: none; font-size: clamp(30px, 9.2vw, 41px); letter-spacing: .035em; }
  body:not(.admin-body) .page-hero-editorial h1,
  body:not(.admin-body) .page-hero-article h1 { font-size: clamp(39px, 12vw, 58px); letter-spacing: -.02em; }
  body:not(.admin-body) .page-hero p,
  body:not(.admin-body) .page-hero.has-chapter p { max-width: none; font-size: 14px; }
  body:not(.admin-body) .alt-row,
  body:not(.admin-body) .alt-row.reverse { margin-bottom: 16px; }
  body:not(.admin-body) .alt-row .visual,
  body:not(.admin-body) .alt-row .visual img,
  body:not(.admin-body) .alt-row .visual video { min-height: 250px; height: 250px; }
  body:not(.admin-body) .alt-row .copy { min-height: 0; padding: 38px 24px; }
  body:not(.admin-body) .contact-side-visual { height: 210px; margin: -30px -22px 30px; }
}

/* v46 final cascade: seven public B2B labels, no public login control. */
@media (min-width: 1121px) {
  body:not(.admin-body) .nav-inner { gap: clamp(16px, 1.8vw, 26px); }
  body:not(.admin-body) .nav-wordmark { min-width: 164px; }
  body:not(.admin-body) .nav-links { gap: clamp(11px, 1.15vw, 19px); }
  body:not(.admin-body) .nav-links a { font-size: 10.5px; }
  body:not(.admin-body) .nav-actions { gap: 12px; }
}

/* v48 — buyer-led page architecture. The homepage keeps the client's warm,
   restrained catalogue language; each inner page now has its own job and
   hierarchy instead of repeating one generic content stack. */
body:not(.admin-body) .split-heading {
  max-width: none;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr);
  gap: clamp(44px, 8vw, 120px);
  align-items: end;
}
body:not(.admin-body) .split-heading > div:last-child p,
body:not(.admin-body) .split-heading > p {
  color: #68615a;
  font-size: 14px;
  line-height: 1.75;
}
body:not(.admin-body) .split-heading .ul-link { display: inline-block; margin-top: 20px; }

/* Homepage */
body:not(.admin-body) .buyer-home-hero { height: 500px; }
body:not(.admin-body) .buyer-home-hero .strict-hero-content { padding-left: clamp(38px, 5vw, 68px) !important; }
body:not(.admin-body) .buyer-home-hero h1 { max-width: 690px; font-size: clamp(30px, 2.5vw, 40px); letter-spacing: .105em; }
body:not(.admin-body) .buyer-home-hero p { max-width: 520px; font-size: 14px; }
body:not(.admin-body) .buyer-hero-kicker {
  margin-bottom: 22px;
  color: rgba(255,255,255,.8);
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
}
body:not(.admin-body) .buyer-hero-actions { display: flex; align-items: center; gap: 28px; margin-top: 28px; }
body:not(.admin-body) .buyer-hero-actions .strict-outline-button { margin-top: 0; }
body:not(.admin-body) .buyer-hero-link { color: #fff; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
body:not(.admin-body) .buyer-hero-link span { margin-left: 8px; }

body:not(.admin-body) .buyer-facts { border-bottom: 1px solid #d7d0c8; background: #ede9e3; }
body:not(.admin-body) .buyer-facts-grid { display: grid; grid-template-columns: repeat(5, 1fr); max-width: 1312px; }
body:not(.admin-body) .buyer-fact { min-height: 168px; padding: 28px 22px; border-left: 1px solid #d7d0c8; }
body:not(.admin-body) .buyer-fact:last-child { border-right: 1px solid #d7d0c8; }
body:not(.admin-body) .buyer-fact-mark { display: block; height: 27px; margin-bottom: 20px; color: #6f665d; font-size: 23px; line-height: 1; }
body:not(.admin-body) .buyer-fact h3 { margin-bottom: 8px; font-size: 11px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }
body:not(.admin-body) .buyer-fact p { color: #6d665f; font-size: 11px; line-height: 1.55; }

.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
body:not(.admin-body) .home-collection { background: #f5f3f0; }
body:not(.admin-body) .home-model-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
body:not(.admin-body) .home-model-card { display: block; padding-bottom: 22px; border: 1px solid #dad4cd; background: #faf9f7; }
body:not(.admin-body) .home-model-card figure { aspect-ratio: 4 / 4.7; overflow: hidden; background: #dfd8d0; }
body:not(.admin-body) .home-model-card img { width: 100%; height: 100%; display: block; object-fit: cover; filter: saturate(.72) contrast(.96); transition: transform .6s ease; }
body:not(.admin-body) .home-model-card:hover img { transform: scale(1.025); }
body:not(.admin-body) .home-model-copy { display: flex; justify-content: space-between; gap: 20px; padding: 20px 20px 13px; }
body:not(.admin-body) .home-model-copy span { color: #777068; font-size: 9px; letter-spacing: .11em; text-transform: uppercase; }
body:not(.admin-body) .home-model-copy h3 { margin-top: 7px; font-size: 15px; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; }
body:not(.admin-body) .home-model-copy p { color: #777068; font-size: 10px; white-space: nowrap; }
body:not(.admin-body) .home-model-card > b { margin-left: 20px; font-size: 9px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; }

body:not(.admin-body) .home-process { border-top: 1px solid #d5cec6; background: #eae5de; }
body:not(.admin-body) .home-process .section-heading > p { max-width: 680px; margin-top: 20px; color: #655e57; font-size: 14px; line-height: 1.7; }
body:not(.admin-body) .home-process-grid { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid #d0c8bf; background: #d0c8bf; gap: 1px; }
body:not(.admin-body) .home-process-step { min-height: 230px; padding: 30px; background: #f6f3ef; }
body:not(.admin-body) .home-process-step > span { display: block; margin-bottom: 52px; color: #5f5851; font-size: 10px; letter-spacing: .13em; }
body:not(.admin-body) .home-process-step h3 { margin-bottom: 11px; font-size: 15px; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; }
body:not(.admin-body) .home-process-step p { color: #69625a; font-size: 12px; line-height: 1.65; }
body:not(.admin-body) .home-process-link { margin-top: 30px; text-align: right; }

body:not(.admin-body) .home-partner { background: #f5f3f0; }
body:not(.admin-body) .home-partner-grid { display: grid; grid-template-columns: 1.15fr .85fr; min-height: 540px; border: 1px solid #d9d3cc; background: #f8f6f3; }
body:not(.admin-body) .home-partner figure { min-height: 540px; overflow: hidden; }
body:not(.admin-body) .home-partner figure img { width: 100%; height: 100%; display: block; object-fit: cover; filter: saturate(.68) contrast(.94); }
body:not(.admin-body) .home-partner-copy { padding: clamp(48px, 6vw, 86px); display: flex; flex-direction: column; justify-content: center; }
body:not(.admin-body) .home-partner-copy h2 { margin: 20px 0; font-family: var(--font-serif); font-size: clamp(30px, 3.4vw, 46px); line-height: 1.12; }
body:not(.admin-body) .home-partner-copy > p { color: #655f58; font-size: 14px; line-height: 1.75; }
body:not(.admin-body) .home-partner-copy ul { margin: 28px 0; padding: 0; list-style: none; border-top: 1px solid #d7d0c8; }
body:not(.admin-body) .home-partner-copy li { padding: 12px 0 12px 20px; border-bottom: 1px solid #d7d0c8; color: #4f4a45; font-size: 12px; position: relative; }
body:not(.admin-body) .home-partner-copy li::before { content: "✓"; position: absolute; left: 0; color: #877262; }

/* Collection */
body:not(.admin-body) .collection-route,
body:not(.admin-body) .private-label-route,
body:not(.admin-body) .about-evidence,
body:not(.admin-body) .contact-route { border-bottom: 1px solid #d4cdc5; background: #ebe6df; }
body:not(.admin-body) .collection-route-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
body:not(.admin-body) .collection-route-grid > div { padding: 30px; border-left: 1px solid #d4cdc5; }
body:not(.admin-body) .collection-route-grid > div:last-child { border-right: 1px solid #d4cdc5; }
body:not(.admin-body) .collection-route span,
body:not(.admin-body) .private-label-route span,
body:not(.admin-body) .about-evidence span { display: block; margin-bottom: 16px; color: #5f5851; font-size: 9px; letter-spacing: .13em; }
body:not(.admin-body) .collection-route strong { display: block; margin-bottom: 7px; font-size: 13px; font-weight: 500; text-transform: uppercase; letter-spacing: .05em; }
body:not(.admin-body) .collection-route p { color: #6c655d; font-size: 11px; line-height: 1.55; }
body:not(.admin-body) .collection-catalog { padding: 80px 0 120px; }
body:not(.admin-body) .collection-tools { display: flex; justify-content: space-between; gap: 50px; align-items: end; margin-bottom: 34px; }
body:not(.admin-body) .collection-tools h2 { max-width: 600px; margin-top: 15px; font-family: var(--font-serif); font-size: clamp(28px, 3vw, 42px); line-height: 1.15; }
body:not(.admin-body) .collection-tools .filter-bar { justify-content: flex-end; margin-bottom: 0; }
body:not(.admin-body) .lib-page-card .meta { display: flex; justify-content: space-between; gap: 16px; align-items: end; }
body:not(.admin-body) .lib-page-card .dimensions { font-size: 9px; letter-spacing: .05em; white-space: nowrap; opacity: .78; }

/* Private label */
body:not(.admin-body) .private-label-route-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
body:not(.admin-body) .private-label-route-grid > div { min-height: 120px; padding: 26px; border-left: 1px solid #d4cdc5; }
body:not(.admin-body) .private-label-route-grid > div:last-child { border-right: 1px solid #d4cdc5; }
body:not(.admin-body) .private-label-route strong { display: block; max-width: 220px; font-size: 12px; font-weight: 500; line-height: 1.45; text-transform: uppercase; letter-spacing: .045em; }
body:not(.admin-body) .private-label-faq { background: #ece7e0; }
body:not(.admin-body) .private-label-faq-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(50px, 9vw, 130px); align-items: start; }
body:not(.admin-body) .private-label-faq .section-heading p { margin-top: 20px; color: #665f58; font-size: 14px; line-height: 1.7; }

/* Craftsmanship */
body:not(.admin-body) .craft-detail-section { background: #f4f1ed; }
body:not(.admin-body) .craft-detail-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
body:not(.admin-body) .craft-detail-card { border: 1px solid #d8d1c9; background: #faf8f5; }
body:not(.admin-body) .craft-detail-card figure { height: 290px; overflow: hidden; background: #ded7cf; }
body:not(.admin-body) .craft-detail-card img { width: 100%; height: 100%; display: block; object-fit: cover; filter: saturate(.7) contrast(.95); transition: transform .55s ease; }
body:not(.admin-body) .craft-detail-card:hover img { transform: scale(1.025); }
body:not(.admin-body) .craft-detail-copy { min-height: 260px; padding: 28px; }
body:not(.admin-body) .craft-detail-copy > span { display: block; margin-bottom: 30px; color: #81786f; font-size: 9px; letter-spacing: .14em; }
body:not(.admin-body) .craft-detail-copy h2 { margin-bottom: 14px; font-family: var(--font-sans); font-size: 15px; font-weight: 500; letter-spacing: .055em; text-transform: uppercase; }
body:not(.admin-body) .craft-detail-copy p { color: #675f58; font-size: 12px; line-height: 1.68; }

/* About */
body:not(.admin-body) .about-story { background: #f5f3f0; }
body:not(.admin-body) .about-story-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(60px, 10vw, 150px); }
body:not(.admin-body) .about-story-lead { margin-top: 24px; font-family: var(--font-serif); font-size: clamp(27px, 3.2vw, 44px); line-height: 1.28; }
body:not(.admin-body) .about-story-body p { margin-bottom: 20px; color: #625c55; font-size: 14px; line-height: 1.8; }
body:not(.admin-body) .about-evidence-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
body:not(.admin-body) .about-evidence-grid > div { min-height: 180px; padding: 28px; border-left: 1px solid #d4cdc5; }
body:not(.admin-body) .about-evidence-grid > div:last-child { border-right: 1px solid #d4cdc5; }
body:not(.admin-body) .about-evidence strong { display: block; margin-bottom: 10px; font-size: 12px; letter-spacing: .05em; text-transform: uppercase; }
body:not(.admin-body) .about-evidence p { color: #6a635b; font-size: 11px; line-height: 1.6; }
body:not(.admin-body) .about-showroom-visual img { filter: saturate(.7) contrast(.94) !important; }

/* Blog and contact */
body:not(.admin-body) .blog-articles { padding: 95px 0 140px; background: #f5f3f0; }
body:not(.admin-body) .blog-articles .jrn-grid { margin-top: 0; }
body:not(.admin-body) .contact-route-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
body:not(.admin-body) .contact-route-grid > a { min-height: 150px; padding: 28px 30px; border-left: 1px solid #d4cdc5; display: flex; flex-direction: column; }
body:not(.admin-body) .contact-route-grid > a:last-child { border-right: 1px solid #d4cdc5; }
body:not(.admin-body) .contact-route-grid span { margin-bottom: 26px; color: #5f5851; font-size: 9px; letter-spacing: .13em; text-transform: uppercase; }
body:not(.admin-body) .contact-route-grid strong { font-size: 14px; font-weight: 500; }
body:not(.admin-body) .contact-route-grid b { margin-top: auto; padding-top: 20px; font-size: 9px; font-weight: 500; letter-spacing: .09em; text-transform: uppercase; }
body:not(.admin-body) .contact-form-section { background: #f5f3f0; }

@media (max-width: 1000px) {
  body:not(.admin-body) .buyer-facts-grid { grid-template-columns: repeat(3, 1fr); }
  body:not(.admin-body) .buyer-fact:nth-child(4), body:not(.admin-body) .buyer-fact:nth-child(5) { border-top: 1px solid #d7d0c8; }
  body:not(.admin-body) .home-partner-grid { grid-template-columns: 1fr 1fr; }
  body:not(.admin-body) .private-label-route-grid, body:not(.admin-body) .about-evidence-grid { grid-template-columns: repeat(2, 1fr); }
  body:not(.admin-body) .craft-detail-grid { grid-template-columns: repeat(2, 1fr); }
  body:not(.admin-body) .collection-tools { display: block; }
  body:not(.admin-body) .collection-tools .filter-bar { justify-content: flex-start; margin-top: 28px; }
}

@media (max-width: 760px) {
  body:not(.admin-body) .split-heading,
  body:not(.admin-body) .about-story-grid,
  body:not(.admin-body) .private-label-faq-grid { grid-template-columns: 1fr; gap: 24px; }
  body:not(.admin-body) .buyer-home-hero { height: 610px; }
  body:not(.admin-body) .buyer-home-hero .strict-hero-content { padding: 54px 24px 0 !important; }
  body:not(.admin-body) .buyer-home-hero h1 { max-width: 335px; font-size: 27px; }
  body:not(.admin-body) .buyer-home-hero p { max-width: 330px; font-size: 13px; }
  body:not(.admin-body) .buyer-hero-actions { align-items: flex-start; flex-direction: column; gap: 18px; }
  body:not(.admin-body) .buyer-facts-grid,
  body:not(.admin-body) .home-model-grid,
  body:not(.admin-body) .home-process-grid,
  body:not(.admin-body) .home-partner-grid,
  body:not(.admin-body) .collection-route-grid,
  body:not(.admin-body) .private-label-route-grid,
  body:not(.admin-body) .craft-detail-grid,
  body:not(.admin-body) .about-evidence-grid,
  body:not(.admin-body) .contact-route-grid { grid-template-columns: 1fr; }
  body:not(.admin-body) .buyer-fact { min-height: 0; padding: 24px; border-right: 1px solid #d7d0c8; border-bottom: 1px solid #d7d0c8; }
  body:not(.admin-body) .home-model-grid { gap: 14px; }
  body:not(.admin-body) .home-process-step { min-height: 0; }
  body:not(.admin-body) .home-process-step > span { margin-bottom: 30px; }
  body:not(.admin-body) .home-partner-grid { min-height: 0; }
  body:not(.admin-body) .home-partner figure { min-height: 300px; height: 300px; }
  body:not(.admin-body) .home-partner-copy { padding: 40px 24px; }
  body:not(.admin-body) .collection-route-grid > div,
  body:not(.admin-body) .private-label-route-grid > div,
  body:not(.admin-body) .about-evidence-grid > div,
  body:not(.admin-body) .contact-route-grid > a { min-height: 0; border-right: 1px solid #d4cdc5; border-bottom: 1px solid #d4cdc5; }
  body:not(.admin-body) .collection-catalog { padding: 60px 0 80px; }
  body:not(.admin-body) .craft-detail-card figure { height: 260px; }
  body:not(.admin-body) .craft-detail-copy { min-height: 0; }
  body:not(.admin-body) .blog-articles { padding: 70px 0 90px; }
}

/* v50 — narrative reset. Fewer sections, larger images and a clear story:
   where the buyer is now → how FRAYDA works → what can be made → start. */
body:not(.admin-body) .narrative-home-hero { height: 535px; }
body:not(.admin-body) .narrative-home-hero .strict-hero-content { padding-left: clamp(38px, 5vw, 68px) !important; }
body:not(.admin-body) .narrative-home-hero h1 { max-width: 720px; font-size: clamp(32px, 3vw, 47px); line-height: 1.16; letter-spacing: .095em; }
body:not(.admin-body) .narrative-home-hero p { max-width: 560px; font-size: 14px; line-height: 1.72; }

body:not(.admin-body) .home-routes { background: #f5f3f0; }
body:not(.admin-body) .home-routes .section-heading { margin-bottom: 42px; }
body:not(.admin-body) .home-route-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
body:not(.admin-body) .home-route-card { position: relative; min-height: 360px; overflow: hidden; color: #fff; }
body:not(.admin-body) .home-route-card > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; filter: saturate(.68) contrast(.94); transition: transform .65s ease; }
body:not(.admin-body) .home-route-card:hover > img { transform: scale(1.025); }
body:not(.admin-body) .home-route-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20,18,16,.05) 8%, rgba(20,18,16,.74) 100%); }
body:not(.admin-body) .home-route-copy { position: absolute; inset: auto 30px 30px; display: block; }
body:not(.admin-body) .home-route-copy small { display: block; margin-bottom: 12px; color: rgba(255,255,255,.74); font-size: 9px; letter-spacing: .16em; text-transform: uppercase; }
body:not(.admin-body) .home-route-copy strong { display: block; max-width: 330px; font-family: var(--font-serif); font-size: clamp(24px, 2.2vw, 34px); font-weight: 400; line-height: 1.08; }
body:not(.admin-body) .home-route-copy > span { display: block; max-width: 340px; margin-top: 14px; color: rgba(255,255,255,.82); font-size: 12px; line-height: 1.6; }
body:not(.admin-body) .home-route-copy b { display: inline-block; margin-top: 20px; padding-bottom: 4px; border-bottom: 1px solid rgba(255,255,255,.58); font-size: 9px; font-weight: 500; letter-spacing: .11em; text-transform: uppercase; }
body:not(.admin-body) .home-route-copy i,
body:not(.admin-body) .home-selected-card i { margin-left: 7px; font-style: normal; }

body:not(.admin-body) .home-relationship { border-top: 1px solid #d7d0c8; background: #e9e3dc; }
body:not(.admin-body) .home-relationship-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr); min-height: 650px; background: #f7f4f0; }
body:not(.admin-body) .home-relationship figure { min-height: 650px; overflow: hidden; }
body:not(.admin-body) .home-relationship figure img { width: 100%; height: 100%; display: block; object-fit: cover; filter: saturate(.65) contrast(.94); }
body:not(.admin-body) .home-relationship-copy { padding: clamp(48px, 5.7vw, 82px); display: flex; flex-direction: column; justify-content: center; }
body:not(.admin-body) .home-relationship-copy > h2 { max-width: 560px; margin: 20px 0 21px; font-family: var(--font-serif); font-size: clamp(35px, 3.5vw, 52px); font-weight: 400; line-height: 1.08; }
body:not(.admin-body) .home-relationship-lead { max-width: 600px; color: #5f5953; font-size: 14px; line-height: 1.78; }
body:not(.admin-body) .home-stage-heading { margin-top: 35px; padding-top: 27px; border-top: 1px solid #d3cbc2; }
body:not(.admin-body) .home-stage-heading > span { color: #6b635b; font-size: 9px; letter-spacing: .15em; text-transform: uppercase; }
body:not(.admin-body) .home-stage-heading h3 { margin-top: 9px; font-size: 14px; font-weight: 500; letter-spacing: .05em; text-transform: uppercase; }
body:not(.admin-body) .home-stage-heading p { max-width: 600px; margin-top: 8px; color: #6a635c; font-size: 11px; line-height: 1.6; }
body:not(.admin-body) .home-stage-list { margin: 24px 0 28px; border-top: 1px solid #d3cbc2; }
body:not(.admin-body) .home-stage { display: grid; grid-template-columns: 42px 1fr; gap: 16px; padding: 18px 0; border-bottom: 1px solid #d3cbc2; }
body:not(.admin-body) .home-stage > span { color: #716960; font-size: 9px; letter-spacing: .12em; }
body:not(.admin-body) .home-stage h3 { font-size: 12px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; }
body:not(.admin-body) .home-stage p { max-width: 550px; margin-top: 6px; color: #655e57; font-size: 11px; line-height: 1.55; }

body:not(.admin-body) .home-proof { border-top: 1px solid #d1c9c0; border-bottom: 1px solid #d1c9c0; background: #ded6cd; }
body:not(.admin-body) .home-proof-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
body:not(.admin-body) .home-proof-item { min-height: 122px; padding: 29px 28px; border-left: 1px solid #c9c0b7; }
body:not(.admin-body) .home-proof-item:last-child { border-right: 1px solid #c9c0b7; }
body:not(.admin-body) .home-proof-item strong { display: block; font-size: 11px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }
body:not(.admin-body) .home-proof-item span { display: block; max-width: 230px; margin-top: 9px; color: #625b54; font-size: 11px; line-height: 1.5; }

body:not(.admin-body) .home-selected { background: #f5f3f0; }
body:not(.admin-body) .home-selected .section-heading { margin-bottom: 42px; }
body:not(.admin-body) .home-selected .split-heading > div:last-child p { color: #625c55; }
body:not(.admin-body) .home-selected-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
body:not(.admin-body) .home-selected-card { display: block; }
body:not(.admin-body) .home-selected-card figure { aspect-ratio: 4 / 4.7; overflow: hidden; background: #ddd6ce; }
body:not(.admin-body) .home-selected-card figure img { width: 100%; height: 100%; display: block; object-fit: cover; filter: saturate(.72) contrast(.95); transition: transform .65s ease; }
body:not(.admin-body) .home-selected-card:hover figure img { transform: scale(1.022); }
body:not(.admin-body) .home-selected-card > div { position: relative; padding: 20px 2px 8px; border-top: 1px solid #cdc5bc; }
body:not(.admin-body) .home-selected-card span { color: #6b645d; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
body:not(.admin-body) .home-selected-card h3 { margin-top: 8px; font-size: 15px; font-weight: 500; letter-spacing: .045em; text-transform: uppercase; }
body:not(.admin-body) .home-selected-card b { display: inline-block; margin-top: 13px; font-size: 9px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; }

@media (max-width: 1000px) {
  body:not(.admin-body) .home-relationship-grid { grid-template-columns: 1fr 1fr; }
  body:not(.admin-body) .home-relationship-copy { padding: 48px 38px; }
  body:not(.admin-body) .home-proof-grid { grid-template-columns: repeat(2, 1fr); }
  body:not(.admin-body) .home-proof-item:nth-child(3),
  body:not(.admin-body) .home-proof-item:nth-child(4) { border-top: 1px solid #c9c0b7; }
}

@media (max-width: 760px) {
  body:not(.admin-body) .narrative-home-hero { height: 610px; }
  body:not(.admin-body) .narrative-home-hero .strict-hero-image { object-position: 64% center; }
  body:not(.admin-body) .narrative-home-hero .strict-hero-content { padding: 54px 24px 0 !important; }
  body:not(.admin-body) .narrative-home-hero h1 { max-width: 340px; font-size: 30px; line-height: 1.22; letter-spacing: .075em; }
  body:not(.admin-body) .narrative-home-hero p { max-width: 330px; font-size: 13px; }
  body:not(.admin-body) .home-route-grid,
  body:not(.admin-body) .home-relationship-grid,
  body:not(.admin-body) .home-selected-grid { grid-template-columns: 1fr; }
  body:not(.admin-body) .home-route-card { min-height: 330px; }
  body:not(.admin-body) .home-route-copy { inset: auto 24px 25px; }
  body:not(.admin-body) .home-route-copy strong { font-size: 29px; }
  body:not(.admin-body) .home-relationship-grid { min-height: 0; }
  body:not(.admin-body) .home-relationship figure { min-height: 0; height: 390px; }
  body:not(.admin-body) .home-relationship-copy { padding: 45px 24px 50px; }
  body:not(.admin-body) .home-relationship-copy > h2 { font-size: 37px; }
  body:not(.admin-body) .home-proof-grid { grid-template-columns: 1fr 1fr; }
  body:not(.admin-body) .home-proof-item { min-height: 132px; padding: 25px 20px; }
  body:not(.admin-body) .home-proof-item:nth-child(odd) { border-left: 1px solid #c9c0b7; }
  body:not(.admin-body) .home-proof-item:nth-child(even) { border-right: 1px solid #c9c0b7; }
  body:not(.admin-body) .home-selected-grid { gap: 30px; }
}

/* v51 — compact reference-led homepage */
body:not(.admin-body) .compact-home-hero {
  height: 410px;
}

body:not(.admin-body) .compact-home-hero h1 {
  max-width: 650px;
}

body:not(.admin-body) .strict-about-lead {
  display: block;
  margin-top: 14px;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.45;
}

body:not(.admin-body) .strict-about-copy .strict-about-lead + p {
  margin-top: 8px;
  line-height: 1.55;
}

body:not(.admin-body) .strict-about-copy .strict-small-button {
  margin-top: 12px;
}

@media (max-width: 760px) {
  body:not(.admin-body) .compact-home-hero {
    height: 560px;
  }

  body:not(.admin-body) .strict-about-lead {
    font-size: 13px;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   v52 — photographic inner pages.
   Product packshots, documentary atelier details and lifestyle images now
   have distinct jobs. The homepage remains untouched by this cascade.
   ══════════════════════════════════════════════════════════════════════ */

body.site-page main {
  background: #fff;
}

body.site-page main > section:not(.page-hero):not(.cta):not(.craft-film) {
  border-top: 0;
}

body.site-page .page-hero ~ .sec-pad,
body.site-page .page-hero ~ .sec-pad-tight,
body.site-page .sec-pad,
body.site-page .sec-pad-tight {
  padding: clamp(78px, 8vw, 118px) 0;
}

body.site-page main section[style*="background:var(--cream)"] {
  background: #f8f6f2 !important;
}

body.site-page main section[style*="background:var(--sand)"] {
  background: #eee9e2 !important;
}

body.site-page .section-heading h2,
body.site-page .collection-tools h2,
body.site-page .mii .copy h2,
body.site-page .contact-info > h2 {
  font-family: var(--font-serif);
  font-weight: 400;
  letter-spacing: -.015em;
  text-transform: none;
}

body.site-page .section-heading h2 {
  font-size: clamp(34px, 4vw, 54px);
  line-height: 1.08;
}

body.site-page .eyebrow {
  color: #746b62;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .16em;
}

/* Four opening systems: split campaign, photographic feature, editorial and utility. */
body.site-page .page-hero,
body.site-page .page-hero.has-chapter {
  margin-top: 80px;
  background: #fff;
}

body.site-page .page-hero > .container {
  width: min(100% - 64px, 1440px);
  max-width: 1440px;
}

body.site-page .page-hero h1,
body.site-page .page-hero.has-chapter h1 {
  color: #201f1d;
  font-family: var(--font-serif);
  font-size: clamp(46px, 5vw, 72px);
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: -.025em;
  text-transform: none;
}

body.site-page .page-hero p,
body.site-page .page-hero.has-chapter p {
  max-width: 560px;
  margin-top: 26px;
  color: #625d57;
  font-size: 15px;
  line-height: 1.78;
}

body.site-page .page-hero-media,
body.site-page .alt-row img,
body.site-page .mat-card img,
body.site-page .craft-detail-card img,
body.site-page .jrn-card img,
body.site-page .work-piece img,
body.site-page .mii img,
body.site-page .article-figure img,
body.site-page .contact-side-visual img,
body.site-page .craft-film-media,
body.site-page .pdp img,
body.site-page .lib-page-card img {
  filter: none !important;
}

body.site-page .page-hero-split {
  padding: 34px 0 68px;
}

body.site-page .page-hero-split .page-hero-grid {
  grid-template-columns: minmax(390px, .8fr) minmax(0, 1.2fr);
  min-height: 620px;
  border: 0;
  background: #f6f3ee;
}

body.site-page .page-hero-split .page-hero-copy {
  padding: clamp(54px, 6vw, 94px);
}

body.site-page .page-hero-split .page-hero-visual {
  min-height: 620px;
  background: #e6e1da;
}

body.site-page .page-hero-split .page-hero-media {
  object-position: center;
}

body.site-page .page-hero-design_library .page-hero-media {
  object-position: 58% center;
}

body.site-page .page-hero-private_label .page-hero-media {
  object-position: 60% center;
}

body.site-page .page-hero-about .page-hero-media {
  object-position: 58% center;
}

body.site-page .page-hero-feature {
  padding: 34px 0 84px;
  background: #fff;
}

body.site-page .page-hero-feature .page-hero-grid {
  position: relative;
  display: block;
  min-height: 650px;
  overflow: hidden;
  background: #e7e2db;
}

body.site-page .page-hero-feature .page-hero-visual {
  width: 100%;
  height: 650px;
}

body.site-page .page-hero-feature .page-hero-copy {
  position: absolute;
  z-index: 2;
  left: 0;
  bottom: 0;
  width: min(47%, 610px);
  padding: clamp(42px, 5vw, 70px);
  background: rgba(250, 248, 244, .97);
}

body.site-page .page-hero-feature h1,
body.site-page .page-hero-feature.has-chapter h1 {
  font-size: clamp(40px, 4.2vw, 62px);
}

body.site-page .page-hero-custom_development .page-hero-media {
  object-position: 62% 48%;
}

body.site-page .page-hero-materials .page-hero-media {
  object-position: center 55%;
}

body.site-page .page-hero-craftsmanship .page-hero-media {
  object-position: 70% 54%;
}

body.site-page .page-hero-process .page-hero-media {
  object-position: center 52%;
}

body.site-page .page-hero-plain,
body.site-page .page-hero-editorial,
body.site-page .page-hero-article {
  border: 0;
  border-bottom: 1px solid #d9d4cd;
  background: #faf9f7;
}

body.site-page .page-hero-plain .page-hero-copy {
  width: min(100%, 940px);
  padding: clamp(92px, 10vw, 150px) 0 clamp(76px, 8vw, 118px);
}

body.site-page .page-hero-editorial .page-hero-copy {
  width: min(100%, 1120px);
  padding: clamp(100px, 11vw, 164px) 0 clamp(82px, 9vw, 132px);
}

body.site-page .page-hero-editorial h1,
body.site-page .page-hero-article h1 {
  font-size: clamp(52px, 6.5vw, 92px);
}

body.site-page .page-hero-article .page-hero-copy {
  width: min(100%, 980px);
  padding: clamp(82px, 9vw, 132px) 0 clamp(62px, 7vw, 96px);
}

/* Collection: clean product photography above simple catalogue information. */
body.site-page .collection-route,
body.site-page .private-label-route,
body.site-page .about-evidence,
body.site-page .contact-route {
  border-top: 1px solid #ddd8d1;
  border-bottom: 1px solid #ddd8d1;
  background: #fff;
}

body.site-page .collection-route-grid > div,
body.site-page .private-label-route-grid > div,
body.site-page .about-evidence-grid > div,
body.site-page .contact-route-grid > a {
  border-color: #ddd8d1;
}

body.site-page .collection-route-grid > div {
  padding: 38px 34px;
}

body.site-page .collection-route strong {
  font-size: 14px;
  text-transform: none;
  letter-spacing: .01em;
}

body.site-page .collection-route p {
  max-width: 310px;
  font-size: 12px;
  line-height: 1.65;
}

body.site-page .collection-catalog {
  padding: clamp(82px, 9vw, 132px) 0 clamp(110px, 12vw, 176px);
  background: #fff;
}

body.site-page .collection-tools {
  margin-bottom: 54px;
}

body.site-page .collection-tools h2 {
  font-size: clamp(34px, 4vw, 56px);
}

body.site-page .filter-bar {
  gap: 20px;
}

body.site-page .filter-pill {
  padding: 8px 0;
  border: 0;
  border-bottom: 1px solid transparent;
  background: transparent;
  color: #777068;
  font-size: 10px;
}

body.site-page .filter-pill:hover,
body.site-page .filter-pill.active {
  border-color: #282624;
  background: transparent;
  color: #282624;
}

body.site-page .lib-page-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 52px 18px;
}

body.site-page .lib-page-card {
  position: relative;
  display: block;
  aspect-ratio: auto;
  overflow: visible;
  background: transparent;
  color: #292725;
}

body.site-page .lib-page-card::after,
body.site-page .lib-page-card .hover-cta {
  display: none;
}

body.site-page .lib-page-card .swatch {
  position: relative;
  inset: auto;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #f1efeb;
}

body.site-page .lib-page-card .swatch img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform .6s cubic-bezier(.2,.6,.2,1);
}

body.site-page .lib-page-card:hover .swatch {
  transform: none;
}

body.site-page .lib-page-card:hover .swatch img {
  transform: scale(1.018);
}

body.site-page .lib-page-card .meta {
  position: static;
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 20px;
  padding: 18px 2px 0;
  color: #292725;
  text-shadow: none;
}

body.site-page .lib-page-card .meta .cat {
  margin-bottom: 7px;
  color: #625c56;
  font-size: 9px;
  opacity: 1;
}

body.site-page .lib-page-card .meta .name {
  font-family: var(--font-serif);
  font-size: 22px;
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: 0;
  text-transform: none;
}

body.site-page .lib-page-card .dimensions {
  padding-top: 2px;
  color: #625c56;
  opacity: 1;
}

/* Product detail: editorial gallery and a restrained, sticky specification. */
body.site-page .pdp-section {
  margin-top: 80px;
  padding: 44px 0 clamp(100px, 10vw, 150px);
  background: #fff;
}

body.site-page .pdp-back {
  margin: 20px 0 36px;
}

body.site-page .pdp {
  grid-template-columns: minmax(0, 1.18fr) minmax(370px, .82fr);
  gap: clamp(48px, 6vw, 90px);
  align-items: start;
}

body.site-page .pdp > div {
  background: transparent;
}

body.site-page .pdp .gallery-main {
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #f1efeb;
}

body.site-page .pdp .gallery-main img,
body.site-page .pdp .gallery-thumbs img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

body.site-page .pdp .gallery-thumbs {
  gap: 12px;
  margin-top: 12px;
}

body.site-page .pdp .gallery-thumbs .swatch {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #f1efeb;
}

body.site-page .pdp .info {
  position: sticky;
  top: 112px;
  padding: 20px 0 0;
  background: #fff;
}

body.site-page .pdp .info h1 {
  margin: 14px 0 22px;
  font-family: var(--font-serif);
  font-size: clamp(42px, 4.5vw, 64px);
  font-weight: 400;
  line-height: 1.03;
  letter-spacing: -.025em;
  text-transform: none;
}

body.site-page .pdp .info .desc {
  max-width: 520px;
  font-size: 15px;
  line-height: 1.78;
}

body.site-page .pdp .divider {
  margin: 30px 0;
  background: #d8d2ca;
}

body.site-page .spec-row {
  grid-template-columns: 118px 1fr;
  padding: 12px 0;
  border-color: #e0dbd5;
  font-size: 13px;
  line-height: 1.55;
}

/* Service and process pages: large photography, fewer card edges. */
body.site-page .alt-row,
body.site-page .alt-row.reverse {
  grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr);
  gap: 0;
  margin: 0 0 clamp(56px, 7vw, 96px);
  background: transparent;
}

body.site-page .alt-row .visual,
body.site-page .alt-row .visual img,
body.site-page .alt-row .visual video {
  min-height: 520px;
  height: 520px;
}

body.site-page .alt-row .visual img,
body.site-page .alt-row .visual video {
  object-fit: cover;
}

body.site-page .alt-row .copy,
body.site-page .alt-row.reverse .copy {
  min-height: 520px;
  padding: clamp(54px, 6vw, 88px);
  background: #f5f2ed;
}

body.site-page .alt-row .copy h3 {
  margin: 16px 0 22px;
  font-family: var(--font-serif);
  font-size: clamp(32px, 3.4vw, 48px);
  font-weight: 400;
  line-height: 1.08;
}

body.site-page .alt-row .copy p {
  font-size: 14px;
  line-height: 1.8;
}

body.site-page .alt-row .step-num {
  font-size: 10px;
}

body.site-page .proc-subblock {
  margin-top: 10px;
  gap: 15px 24px;
}

body.site-page .proc-subblock dd {
  font-size: 13px;
  line-height: 1.65;
}

body.site-page .axes-grid {
  gap: 24px;
  border: 0;
  background: transparent;
}

body.site-page .axis,
body.site-page .axis.axis-photo {
  padding: 0 0 30px;
  background: transparent;
}

body.site-page .axis-media {
  height: 260px;
}

body.site-page .axis .num,
body.site-page .axis h3,
body.site-page .axis p {
  margin-left: 0;
  margin-right: 0;
}

/* Material and craft pages use fewer, larger editorial modules. */
body.site-page .mat-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(48px, 6vw, 82px) 24px;
  margin-top: 58px;
  border: 0;
  background: transparent;
}

body.site-page .mat-card {
  padding: 0;
  background: transparent;
}

body.site-page .mat-card .visual {
  height: auto;
  aspect-ratio: 4 / 3;
  margin: 0 0 24px;
  overflow: hidden;
}

body.site-page .mat-card h3,
body.site-page .mat-card p {
  margin-left: 0;
  margin-right: 0;
}

body.site-page .mat-card h3 {
  margin-bottom: 12px;
  font-family: var(--font-serif);
  font-size: 30px;
  font-weight: 400;
  text-transform: none;
}

body.site-page .mat-card p {
  max-width: 560px;
  font-size: 14px;
  line-height: 1.75;
}

body.site-page .craft-detail-section {
  background: #fff;
}

body.site-page .craft-detail-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(56px, 7vw, 92px) 24px;
  margin-top: 62px;
}

body.site-page .craft-detail-card {
  border: 0;
  background: transparent;
}

body.site-page .craft-detail-card figure {
  height: clamp(360px, 38vw, 520px);
  background: #eeeae4;
}

body.site-page .craft-detail-copy {
  min-height: 0;
  padding: 26px 0 0;
}

body.site-page .craft-detail-copy > span {
  margin-bottom: 18px;
}

body.site-page .craft-detail-copy h2 {
  margin-bottom: 14px;
  font-family: var(--font-serif);
  font-size: 30px;
  font-weight: 400;
  letter-spacing: -.01em;
  text-transform: none;
}

body.site-page .craft-detail-copy p {
  max-width: 560px;
  font-size: 14px;
  line-height: 1.75;
}

body.site-page .craft-film {
  height: min(72vw, 720px);
}

/* About and showroom: open editorial storytelling instead of boxed tiles. */
body.site-page .about-story {
  background: #fff;
}

body.site-page .about-story-grid {
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(72px, 11vw, 170px);
}

body.site-page .about-story-lead {
  font-size: clamp(34px, 4.2vw, 58px);
  line-height: 1.16;
}

body.site-page .about-story-body p {
  font-size: 15px;
  line-height: 1.85;
}

body.site-page .about-proof-grid {
  gap: 1px;
  margin-top: 52px;
  background: #d6d0c8;
}

body.site-page .about-proof-card {
  min-height: 270px;
  padding: 38px;
  background: #faf8f4;
}

body.site-page .about-proof-card h3 {
  margin: 52px 0 14px;
  font-family: var(--font-serif);
  font-size: 25px;
  font-weight: 400;
}

body.site-page .about-proof-card p {
  font-size: 13px;
  line-height: 1.7;
}

body.site-page .mii {
  min-height: 570px;
  border: 0;
  background: #f5f2ed;
}

body.site-page .mii .visual {
  min-height: 570px;
}

body.site-page .mii .copy {
  min-height: 570px;
  padding: clamp(54px, 6vw, 88px);
}

body.site-page .mii .copy h2 {
  font-size: clamp(34px, 3.7vw, 52px) !important;
  line-height: 1.08;
}

body.site-page .mii .copy p {
  font-size: 14px;
  line-height: 1.78;
}

body.site-page .about-evidence-grid > div {
  min-height: 210px;
  padding: 36px 30px;
}

body.site-page .about-evidence strong {
  font-size: 13px;
  letter-spacing: .01em;
  text-transform: none;
}

body.site-page .about-evidence p {
  font-size: 12px;
  line-height: 1.7;
}

/* Blog and articles: larger photography and readable long form. */
body.site-page .blog-topic-hub {
  background: #fff;
}

body.site-page .blog-topic-grid {
  gap: 1px;
  margin-top: 50px;
  background: #d8d2ca;
}

body.site-page .blog-topic-card {
  min-height: 285px;
  padding: 34px;
  background: #f8f6f2;
}

body.site-page .blog-topic-card h2 {
  margin-top: 54px;
  font-family: var(--font-serif);
  font-size: 25px;
  font-weight: 400;
  line-height: 1.15;
}

body.site-page .blog-articles {
  padding: clamp(90px, 10vw, 142px) 0 clamp(120px, 13vw, 184px);
  background: #f7f5f1;
}

body.site-page .jrn-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 72px 24px;
  margin-top: 64px;
}

body.site-page .jrn-card .visual {
  aspect-ratio: 4 / 3;
  margin-bottom: 24px;
  overflow: hidden;
}

body.site-page .jrn-card .visual img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

body.site-page .jrn-card h2,
body.site-page .jrn-card h3 {
  max-width: 560px;
  margin: 10px 0 12px;
  font-family: var(--font-serif);
  font-size: 29px;
  font-weight: 400;
  line-height: 1.12;
}

body.site-page .jrn-card p {
  max-width: 590px;
  font-size: 13px;
  line-height: 1.7;
}

body.site-page .article-figure {
  max-height: none;
  margin-bottom: 66px;
}

body.site-page .article-figure img {
  max-height: 700px;
  object-fit: cover;
}

body.site-page .prose {
  max-width: 780px;
  margin: 0 auto;
  padding: 0;
  border: 0;
  background: transparent;
  color: #4e4a45;
  font-size: 16px;
  line-height: 1.88;
}

body.site-page .prose .prose-lead {
  font-family: var(--font-serif);
  font-size: 30px;
  line-height: 1.42;
}

body.site-page .prose h2 {
  margin: 56px 0 16px;
  font-family: var(--font-serif);
  font-size: 34px;
  font-weight: 400;
  letter-spacing: -.01em;
  text-transform: none;
}

/* Contact, FAQ and recent work: functional, quiet and spacious. */
body.site-page .contact-route-grid > a {
  min-height: 178px;
  padding: 34px;
  background: #fff;
  transition: background .2s ease;
}

body.site-page .contact-route-grid > a:hover {
  background: #f4f1ec;
}

body.site-page .contact-route-grid strong {
  max-width: 280px;
  font-family: var(--font-serif);
  font-size: 23px;
  font-weight: 400;
  line-height: 1.18;
}

body.site-page .contact-form-section {
  background: #f5f2ed;
}

body.site-page .form-grid {
  grid-template-columns: minmax(0, 1.16fr) minmax(330px, .84fr);
  gap: 24px;
}

body.site-page #brief-form,
body.site-page .contact-info {
  padding: clamp(40px, 5vw, 68px);
  border: 0;
  background: #fff;
  box-shadow: 0 18px 60px rgba(48, 41, 34, .055);
}

body.site-page .contact-side-visual {
  height: 290px;
  margin: calc(-1 * clamp(40px, 5vw, 68px)) calc(-1 * clamp(40px, 5vw, 68px)) 44px;
}

body.site-page .form-field input,
body.site-page .form-field select,
body.site-page .form-field textarea {
  border: 0;
  border-bottom: 1px solid #aaa198;
  border-radius: 0;
  background: transparent;
  padding: 12px 0;
}

body.site-page .radio-pill {
  border-radius: 999px;
}

body.site-page .accordion {
  border-top: 1px solid #cfc8c0;
}

body.site-page .acc-item {
  border-color: #cfc8c0;
}

body.site-page .acc-q {
  padding: 28px 0;
  font-family: var(--font-serif);
  font-size: 22px;
  font-weight: 400;
}

body.site-page .acc-body-inner {
  max-width: 720px;
  padding-bottom: 28px;
  font-size: 14px;
  line-height: 1.8;
}

body.site-page .work-gallery {
  padding: 76px 0 130px;
  background: #fff;
}

body.site-page .work-gallery .hp-model-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 58px 18px;
}

body.site-page .work-piece {
  background: transparent;
}

body.site-page .work-piece .hp-model-media {
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #f0ede8;
}

body.site-page .work-piece img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

body.site-page .work-piece figcaption {
  min-height: 0;
  padding: 18px 0 0;
  font-size: 12px;
  line-height: 1.65;
}

body.site-page .cta {
  min-height: 360px;
  padding: 78px 0;
  background: #242321;
}

body.site-page .cta h2 {
  max-width: 760px;
  margin-bottom: 20px;
  font-family: var(--font-serif);
  font-size: clamp(38px, 4.5vw, 62px);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -.015em;
  text-transform: none;
}

body.site-page .cta p {
  max-width: 620px;
  font-size: 14px;
  line-height: 1.75;
}

@media (max-width: 1080px) {
  body.site-page .page-hero-split .page-hero-grid {
    grid-template-columns: minmax(340px, .9fr) minmax(0, 1.1fr);
    min-height: 560px;
  }

  body.site-page .page-hero-split .page-hero-visual {
    min-height: 560px;
  }

  body.site-page .page-hero-feature .page-hero-copy {
    width: 56%;
  }

  body.site-page .lib-page-grid,
  body.site-page .work-gallery .hp-model-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.site-page .pdp {
    grid-template-columns: 1fr 1fr;
    gap: 38px;
  }

  body.site-page .alt-row,
  body.site-page .alt-row.reverse {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 760px) {
  body.site-page .page-hero,
  body.site-page .page-hero.has-chapter {
    margin-top: 64px;
  }

  body.site-page .page-hero > .container {
    width: 100%;
  }

  body.site-page .page-hero h1,
  body.site-page .page-hero.has-chapter h1 {
    font-size: clamp(40px, 12vw, 56px);
  }

  body.site-page .page-hero-split {
    padding: 0 0 48px;
  }

  body.site-page .page-hero-split .page-hero-grid {
    grid-template-columns: 1fr;
    min-height: 0;
    background: #f6f3ee;
  }

  body.site-page .page-hero-split .page-hero-copy {
    padding: 52px 24px 46px;
  }

  body.site-page .page-hero-split .page-hero-visual {
    min-height: 0;
    height: 390px;
  }

  body.site-page .page-hero-feature {
    padding: 0 0 48px;
  }

  body.site-page .page-hero-feature .page-hero-grid {
    min-height: 0;
    overflow: visible;
  }

  body.site-page .page-hero-feature .page-hero-copy {
    position: static;
    width: 100%;
    padding: 52px 24px 46px;
    background: #f6f3ee;
  }

  body.site-page .page-hero-feature .page-hero-visual {
    height: 340px;
  }

  body.site-page .page-hero-plain .page-hero-copy,
  body.site-page .page-hero-editorial .page-hero-copy,
  body.site-page .page-hero-article .page-hero-copy {
    padding: 70px 24px 60px;
  }

  body.site-page .page-hero-editorial h1,
  body.site-page .page-hero-article h1 {
    font-size: clamp(44px, 13vw, 62px);
  }

  body.site-page .page-hero ~ .sec-pad,
  body.site-page .page-hero ~ .sec-pad-tight,
  body.site-page .sec-pad,
  body.site-page .sec-pad-tight {
    padding: 64px 0;
  }

  body.site-page .collection-tools {
    margin-bottom: 36px;
  }

  body.site-page .collection-tools .filter-bar {
    gap: 10px 16px;
    margin-top: 28px;
    overflow: visible;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding-bottom: 4px;
  }

  body.site-page .filter-pill {
    flex: 0 0 auto;
  }

  body.site-page .lib-page-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 36px 10px;
  }

  body.site-page .lib-page-card .meta {
    display: block;
    padding-top: 14px;
  }

  body.site-page .lib-page-card .meta .name {
    font-size: 19px;
  }

  body.site-page .lib-page-card .dimensions {
    margin-top: 8px;
  }

  body.site-page .pdp-section {
    margin-top: 64px;
    padding: 28px 0 72px;
  }

  body.site-page .pdp {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  body.site-page .pdp .info {
    position: static;
    padding: 8px 0 0;
  }

  body.site-page .alt-row,
  body.site-page .alt-row.reverse {
    grid-template-columns: 1fr;
    margin-bottom: 34px;
  }

  body.site-page .alt-row.reverse > :first-child {
    order: 0;
  }

  body.site-page .alt-row .visual,
  body.site-page .alt-row .visual img,
  body.site-page .alt-row .visual video {
    min-height: 0;
    height: 360px;
  }

  body.site-page .alt-row .copy,
  body.site-page .alt-row.reverse .copy {
    min-height: 0;
    padding: 42px 26px;
  }

  body.site-page .mat-grid,
  body.site-page .craft-detail-grid,
  body.site-page .jrn-grid,
  body.site-page .work-gallery .hp-model-grid {
    grid-template-columns: 1fr;
  }

  body.site-page .mat-grid,
  body.site-page .craft-detail-grid,
  body.site-page .jrn-grid {
    gap: 52px;
  }

  body.site-page .about-story-grid,
  body.site-page .split-heading,
  body.site-page .private-label-faq-grid {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  body.site-page .mii {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  body.site-page .mii .visual {
    min-height: 0;
    height: 390px;
  }

  body.site-page .mii .copy {
    min-height: 0;
    padding: 44px 26px;
  }

  body.site-page .form-grid {
    grid-template-columns: 1fr;
  }

  body.site-page #brief-form,
  body.site-page .contact-info {
    padding: 34px 24px;
  }

  body.site-page .contact-side-visual {
    height: 250px;
    margin: -34px -24px 34px;
  }

  body.site-page .acc-q {
    font-size: 19px;
  }

  body.site-page .cta {
    min-height: 0;
    padding: 68px 0;
  }
}

@media (max-width: 420px) {
  body.site-page .lib-page-grid {
    grid-template-columns: 1fr;
  }

  body.site-page .page-hero-split .page-hero-visual,
  body.site-page .page-hero-feature .page-hero-visual,
  body.site-page .mii .visual {
    height: 320px;
  }
}

/* Route-specific open grids and proof imagery. */
body.site-page .private-label-services {
  background: #fff;
}

body.site-page .b2b-cap-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0 34px;
  border: 0;
  border-top: 1px solid #d5cfc7;
  background: transparent;
}

body.site-page .b2b-cap-card {
  min-height: 250px;
  padding: 34px 0 40px;
  border-bottom: 1px solid #d5cfc7;
  background: transparent;
}

body.site-page .b2b-cap-card > span {
  margin-bottom: 48px;
}

body.site-page .b2b-cap-card h3 {
  font-family: var(--font-serif);
  font-size: 25px;
  font-weight: 400;
  letter-spacing: -.01em;
  text-transform: none;
}

body.site-page .b2b-cap-card p {
  max-width: 360px;
  font-size: 13px;
  line-height: 1.72;
}

body.site-page .process-grid:not(.home-process-grid) {
  gap: 0;
  border-top: 1px solid #d5cfc7;
  border-bottom: 1px solid #d5cfc7;
}

body.site-page .process-grid:not(.home-process-grid) .step {
  min-height: 220px;
  padding: 32px 28px;
  border-left: 1px solid #d5cfc7;
}

body.site-page .process-grid:not(.home-process-grid) .step:last-child {
  border-right: 1px solid #d5cfc7;
}

body.site-page .process-grid:not(.home-process-grid) .step h3,
body.site-page .process-grid:not(.home-process-grid) .step h4 {
  margin-bottom: 12px;
  font-family: var(--font-serif);
  font-size: 23px;
  font-weight: 400;
  line-height: 1.14;
}

body.site-page .manufacturing-proof {
  background: #eee9e2;
}

body.site-page .manufacturing-proof-copy h2 {
  font-size: clamp(38px, 4.5vw, 60px);
}

body.site-page .manufacturing-proof-media {
  gap: 18px;
}

body.site-page .manufacturing-proof-media figure {
  background: transparent;
}

body.site-page .manufacturing-proof-media img {
  height: 500px;
  filter: none;
}

body.site-page .manufacturing-proof-media figcaption {
  min-height: 0;
  padding: 18px 0 0;
  font-size: 10px;
}

body.site-page .private-label-faq {
  background: #f6f3ee;
}

@media (max-width: 1000px) {
  body.site-page .b2b-cap-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.site-page .cap-grid,
  body.site-page .hw-grid,
  body.site-page .lp-grid,
  body.site-page .mq-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 48px !important;
  }
}

@media (max-width: 760px) {
  body.site-page .b2b-cap-grid {
    grid-template-columns: 1fr;
  }

  body.site-page .b2b-cap-card {
    min-height: 0;
    padding: 30px 0 34px;
  }

  body.site-page .b2b-cap-card > span {
    margin-bottom: 26px;
  }

  body.site-page .process-grid:not(.home-process-grid) {
    grid-template-columns: 1fr !important;
  }

  body.site-page .process-grid:not(.home-process-grid) .step {
    min-height: 0;
    padding: 28px 0;
    border-left: 0;
    border-bottom: 1px solid #d5cfc7;
  }

  body.site-page .process-grid:not(.home-process-grid) .step:last-child {
    border-right: 0;
    border-bottom: 0;
  }

  body.site-page .cap-grid,
  body.site-page .hw-grid,
  body.site-page .lp-grid,
  body.site-page .mq-grid {
    grid-template-columns: 1fr !important;
    gap: 34px !important;
  }

  body.site-page .manufacturing-proof-media {
    grid-template-columns: 1fr;
  }

body.site-page .manufacturing-proof-media img {
    height: 360px;
  }
}

/* ──────────────────────────────────────────────────────────────
   V54 — reference-led retail system
   Full-bleed campaign media, square product photography and a
   restrained modern retail UI. Public pages only; admin is untouched.
   ────────────────────────────────────────────────────────────── */

:root {
  --bridge-brown: #8a543b;
  --bridge-ink: #111827;
  --bridge-warm: #f9f6f4;
  --bridge-line: #dedbd8;
  --bridge-grey: #646b75;
}

body.home,
body.site-page {
  background: #fff;
  color: var(--bridge-ink);
  font-family: Roboto, var(--font-sans);
  font-size: 14px;
  line-height: 1.5;
}

body.home h1,
body.home h2,
body.home h3,
body.site-page h1,
body.site-page h2,
body.site-page h3,
body.site-page h4 {
  color: inherit;
  font-family: Roboto, var(--font-sans);
  font-weight: 700;
  letter-spacing: -.02em;
}

body.home img,
body.site-page img {
  border-radius: 0;
}

body.home .container,
body.site-page .container {
  width: 100%;
  max-width: 1440px;
  padding-inline: 32px;
}

.bridge-promo {
  position: fixed;
  inset: 0 0 auto;
  z-index: 140;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  height: 32px;
  padding: 0 24px;
  background: #181818;
  color: #fff;
  font-size: 10px;
  line-height: 1;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.bridge-promo strong {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .12em;
}

.bridge-promo > :last-child { text-align: right; }
.nav-inner > .nav-links:first-child { display: none !important; }

body.home .nav,
body.site-page .nav {
  top: 32px;
  height: 78px;
  border: 0;
  background: #fff;
  color: var(--bridge-ink);
  box-shadow: none;
  transition: background .25s ease, color .25s ease, border-color .25s ease;
}

body.home .nav[data-home="true"]:not(.solid) {
  border-bottom-color: transparent;
  background: transparent;
  color: #fff;
}

body.site-page.media-hero-page .nav[data-home="true"]:not(.solid) {
  border-bottom-color: transparent;
  background: transparent;
  color: #fff;
}

body.home .nav.solid,
body.site-page .nav.solid {
  border-bottom: 1px solid rgba(17, 24, 39, .12);
  background: rgba(255, 255, 255, .97);
  color: var(--bridge-ink);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

body.home .nav-inner,
body.site-page .nav-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  width: 100%;
  max-width: none;
  height: 100%;
  padding: 0 24px;
  gap: 24px;
}

body.home .nav-wordmark,
body.site-page .nav-wordmark {
  grid-column: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: inherit;
  font-family: Roboto, var(--font-sans);
  font-size: 22px;
  font-weight: 700;
  line-height: .92;
  letter-spacing: .035em;
}

.nav-wordmark small {
  margin-top: 5px;
  font-size: 7px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: .18em;
  text-transform: uppercase;
}

body.home .nav-links,
body.site-page .nav-links {
  display: flex;
  gap: 22px;
  align-items: center;
}

body.home .nav-links-left,
body.site-page .nav-links-left { grid-column: 1; justify-content: flex-start; }

body.home .nav-links-right,
body.site-page .nav-links-right { grid-column: 3; justify-content: flex-end; }

body.home .nav-links a,
body.site-page .nav-links a,
body.home .language-pair,
body.site-page .language-pair {
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font-size: 11px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: .025em;
  opacity: .94;
  text-transform: uppercase;
}

body.home .nav-links a.active,
body.site-page .nav-links a.active,
body.home .nav-links a:hover,
body.site-page .nav-links a:hover {
  background: transparent;
  opacity: 1;
  text-decoration: underline;
  text-underline-offset: 5px;
}

body.home main { padding-top: 32px; }
body.site-page main { padding-top: 110px; }
body.site-page.media-hero-page main { padding-top: 32px !important; }

/* Home */
.bridge-home-hero {
  position: relative;
  height: clamp(570px, 42.57vw, 680px);
  overflow: hidden;
  background: #09223a;
  color: #fff;
}

.bridge-home-hero-image,
.bridge-home-hero-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.bridge-home-hero-image {
  object-fit: cover;
  object-position: center center;
}

.bridge-home-hero-shade {
  background: linear-gradient(90deg, rgba(3, 14, 26, .44) 0%, rgba(3, 14, 26, .12) 45%, transparent 72%);
}

.bridge-home-hero-copy {
  position: absolute;
  z-index: 2;
  left: 32px;
  bottom: 48px;
  width: min(470px, calc(100% - 64px));
}

.bridge-home-kicker,
.bridge-campaign-copy small,
.bridge-wide-story-copy small {
  display: block;
  margin-bottom: 10px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.bridge-home-hero-copy h1 {
  margin: 0 0 22px;
  color: #fff;
  font-size: 32px;
  font-weight: 700;
  line-height: 40px;
  letter-spacing: -.02em;
}

.bridge-home-hero-copy > p {
  max-width: 540px;
  margin: -6px 0 22px;
  color: rgba(255, 255, 255, .88);
  font-size: 13px;
  line-height: 1.65;
}

.bridge-home-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 26px;
}

.bridge-home-hero-actions a,
.bridge-campaign-copy > span,
.bridge-wide-story-copy > span {
  display: inline-block;
  padding-bottom: 3px;
  border-bottom: 1px solid currentColor;
  color: inherit;
  font-size: 12px;
  font-weight: 600;
}

.bridge-home-capabilities {
  border-top: 0;
}

.bridge-product-section,
.bridge-category-section,
.bridge-related {
  padding: 34px 12px 46px;
  background: #fff;
}

.bridge-section-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 20px;
  padding: 0 12px 24px;
}

.bridge-section-head h2 {
  font-size: 24px;
  line-height: 32px;
}

.bridge-section-head a {
  padding-bottom: 2px;
  border-bottom: 1px solid currentColor;
  font-size: 12px;
  font-weight: 500;
}

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

.bridge-product-card,
.bridge-collection-card {
  display: block;
  min-width: 0;
  color: var(--bridge-ink);
}

.bridge-product-card { padding: 0 12px; }

.bridge-product-media,
.bridge-category-media,
.bridge-collection-media {
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden;
  aspect-ratio: 1;
  background: #f6f1ec;
}

.bridge-product-media img,
.bridge-category-media img,
.bridge-collection-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  transition: transform .35s ease;
}

.bridge-product-card:hover img,
.bridge-category-card:hover img,
.bridge-collection-card:hover img { transform: scale(1.018); }

.bridge-product-copy,
.bridge-collection-copy {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 140px;
  padding: 38px 0 18px;
}

.bridge-product-copy small,
.bridge-collection-copy small {
  margin-bottom: 5px;
  color: #4b5563;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.bridge-product-copy strong,
.bridge-collection-copy strong {
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
}

.bridge-product-copy > span,
.bridge-collection-copy > span {
  margin-top: 2px;
  color: var(--bridge-grey);
  font-size: 11px;
}

.bridge-campaign-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  padding: 0 0 35px;
  overflow: hidden;
}

.bridge-campaign-tile {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 960 / 1210;
  color: #fff;
}

.bridge-campaign-tile > img,
.bridge-campaign-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.bridge-campaign-tile > img {
  object-fit: cover;
  transition: transform .55s ease;
}

.bridge-campaign-tile:hover > img { transform: scale(1.015); }

.bridge-campaign-shade {
  background: linear-gradient(0deg, rgba(7, 9, 12, .54), rgba(7, 9, 12, 0) 42%);
}

.bridge-campaign-copy,
.bridge-wide-story-copy {
  position: absolute;
  z-index: 2;
  left: 32px;
  right: 32px;
  bottom: 34px;
  display: block;
}

.bridge-campaign-copy strong,
.bridge-wide-story-copy strong {
  display: block;
  max-width: 540px;
  margin-bottom: 16px;
  color: #fff;
  font-size: 30px;
  line-height: 1.12;
}

.bridge-category-section { padding-top: 24px; }

.bridge-category-rail {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.bridge-category-card {
  display: block;
  min-width: 0;
  padding: 0 12px;
}

.bridge-category-card strong {
  display: block;
  padding-top: 16px;
  font-size: 13px;
  font-weight: 500;
}

.bridge-wide-story {
  position: relative;
  display: block;
  width: 100%;
  height: min(62.5vw, 900px);
  min-height: 620px;
  overflow: hidden;
  color: #fff;
}

.bridge-wide-story > img,
.bridge-wide-story-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.bridge-wide-story > img { object-fit: cover; object-position: center; }
.bridge-wide-story-shade { background: linear-gradient(0deg, rgba(7, 9, 12, .52), transparent 45%); }
.bridge-wide-story-copy { bottom: 42px; }
.bridge-wide-story-copy strong { font-size: 32px; }

.bridge-service-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3px;
  padding-top: 3px;
}

.bridge-service-grid .bridge-campaign-tile { aspect-ratio: 4 / 5; }
.bridge-service-grid .bridge-campaign-copy strong { font-size: 25px; }

/* Collection */
.bridge-collection-head {
  padding: 24px 24px 20px;
  background: #fff;
}

.bridge-collection-head h1 {
  max-width: 820px;
  font-size: 32px;
  line-height: 40px;
}

.bridge-collection-head p {
  max-width: 1200px;
  margin-top: 6px;
  color: #4b5563;
  font-size: 13px;
  line-height: 18px;
}

.bridge-collection-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 28px;
  min-height: 58px;
  padding: 8px 24px;
  border-top: 1px solid var(--bridge-line);
  border-bottom: 1px solid var(--bridge-line);
  background: #fff;
}

.bridge-collection-toolbar > span {
  flex: none;
  color: var(--bridge-grey);
  font-size: 11px;
  text-transform: uppercase;
}

body.site-page .bridge-collection-toolbar .filter-bar {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px 20px;
  margin: 0;
}

body.site-page .bridge-collection-toolbar .filter-pill {
  padding: 4px 0;
  border: 0;
  border-bottom: 1px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--bridge-ink);
  font-size: 11px;
  font-weight: 500;
  line-height: 1.2;
}

body.site-page .bridge-collection-toolbar .filter-pill:hover,
body.site-page .bridge-collection-toolbar .filter-pill.active {
  border-bottom-color: currentColor;
  background: transparent;
  color: var(--bridge-ink);
}

.bridge-collection-catalog { overflow: hidden; }

.bridge-collection-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-flow: row dense;
  grid-auto-rows: calc(25vw + 234px);
  width: 100%;
  background: #fff;
}

body.site-page .bridge-collection-card {
  height: 100%;
  padding: 40px 12px 0;
  border: 0;
  background: #fff;
}

body.site-page .bridge-collection-card.hidden { display: none; }

body.site-page .bridge-collection-card .bridge-collection-media {
  height: auto;
  border: 0;
  background: var(--bridge-warm);
}

body.site-page .bridge-collection-card .bridge-collection-copy {
  display: flex;
  padding-top: 38px;
}

.bridge-collection-campaign {
  position: relative;
  grid-column: span 2;
  grid-row: span 2;
  display: block;
  min-width: 0;
  overflow: hidden;
  color: #fff;
}

.bridge-collection-campaign img,
.bridge-collection-campaign > span {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

.bridge-collection-campaign img { object-fit: cover; }
.bridge-collection-campaign > span { background: linear-gradient(0deg, rgba(8, 8, 8, .48), transparent 42%); }

.bridge-collection-campaign strong {
  position: absolute;
  z-index: 2;
  left: 32px;
  bottom: 35px;
  color: #fff;
  font-size: 32px;
  line-height: 1.15;
}

.bridge-collection-empty {
  display: none;
  padding: 80px 24px;
  color: var(--bridge-grey);
  text-align: center;
}

.bridge-collection-end {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 40px;
  padding: 76px 32px;
  background: var(--bridge-brown);
  color: #fff;
}

.bridge-collection-end small {
  display: block;
  margin-bottom: 10px;
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.bridge-collection-end h2 {
  max-width: 720px;
  color: #fff;
  font-size: 32px;
  line-height: 40px;
}

.bridge-collection-end p {
  max-width: 650px;
  margin-top: 12px;
  color: rgba(255, 255, 255, .82);
}

.bridge-collection-end > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 220px;
  height: 46px;
  padding: 0 28px;
  border: 1px solid #fff;
  font-weight: 600;
}

/* Product detail */
.bridge-pdp {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  background: #fff;
}

.bridge-pdp-gallery { min-width: 0; }

.bridge-pdp-image {
  position: relative;
  width: 100%;
  margin: 0;
  overflow: hidden;
  aspect-ratio: 1;
  background: #f6f1ec;
}

.bridge-pdp-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.bridge-pdp-packshot img { object-fit: contain; }
.bridge-pdp-detail img { object-fit: cover; }

.bridge-pdp-meta {
  position: sticky;
  top: 110px;
  display: flex;
  flex-direction: column;
  min-height: calc(100vh - 110px);
  max-height: calc(100vh - 110px);
  padding: 50px 16px 40px 50px;
  overflow-y: auto;
  background: #fff;
}

.bridge-pdp-breadcrumb {
  display: flex;
  gap: 7px;
  margin-bottom: auto;
  color: var(--bridge-grey);
  font-size: 10px;
  text-transform: uppercase;
}

.bridge-pdp-breadcrumb a { text-decoration: underline; text-underline-offset: 3px; }

.bridge-pdp-vendor {
  display: block;
  margin-top: 44px;
  margin-bottom: 8px;
  font-size: 10px;
  font-weight: 500;
  line-height: 18px;
  letter-spacing: .05em;
}

.bridge-pdp-meta h1 {
  max-width: 480px;
  font-size: 24px;
  line-height: 32px;
}

.bridge-pdp-category {
  margin-top: 6px;
  color: var(--bridge-grey);
  font-size: 11px;
}

.bridge-pdp-desc {
  max-width: 480px;
  margin-top: 22px;
  color: #4b5563;
  font-size: 13px;
  line-height: 1.65;
}

.bridge-pdp-actions {
  display: grid;
  gap: 10px;
  width: min(350px, 100%);
  margin-top: 28px;
}

.bridge-pdp-primary,
.bridge-pdp-secondary {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 45px;
  padding: 12px 20px;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
}

.bridge-pdp-primary { background: var(--bridge-brown); color: #fff; }
.bridge-pdp-secondary { border: 1px solid var(--bridge-ink); background: #fff; }

.bridge-pdp-note {
  max-width: 480px;
  margin-top: 20px;
  color: var(--bridge-grey);
  font-size: 11px;
  line-height: 1.55;
}

.bridge-pdp-details {
  width: min(500px, 100%);
  border-top: 1px solid var(--bridge-line);
}

.bridge-pdp-details:first-of-type { margin-top: 30px; }
.bridge-pdp-details:last-of-type { border-bottom: 1px solid var(--bridge-line); }

.bridge-pdp-details summary {
  position: relative;
  padding: 17px 26px 17px 0;
  list-style: none;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}

.bridge-pdp-details summary::-webkit-details-marker { display: none; }
.bridge-pdp-details summary::after { content: '+'; position: absolute; right: 2px; font-size: 16px; font-weight: 400; }
.bridge-pdp-details[open] summary::after { content: '−'; }

.bridge-pdp-details dl { margin: 0 0 18px; }
.bridge-pdp-details > p { margin: 0 0 20px; color: #4b5563; font-size: 12px; line-height: 1.65; }

.bridge-pdp-row {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  gap: 16px;
  padding: 8px 0;
  font-size: 11px;
}

.bridge-pdp-row dt { color: var(--bridge-grey); }
.bridge-pdp-row dd { margin: 0; }
.bridge-related { padding-top: 58px; }

/* Shared page openings */
body.site-page .bridge-page-hero,
body.site-page .bridge-page-hero.page-hero-feature,
body.site-page .bridge-page-hero.page-hero-split,
body.site-page .bridge-page-hero.page-hero-editorial,
body.site-page .bridge-page-hero.page-hero-article,
body.site-page .bridge-page-hero.page-hero-plain {
  margin: 0;
  padding: 0;
  background: #fff;
}

body.site-page .bridge-page-hero > .bridge-page-visual {
  position: relative;
  width: 100%;
  height: min(56.25vw, 810px);
  min-height: 620px;
  margin: 0;
  overflow: hidden;
}

body.site-page .bridge-page-hero .page-hero-media {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

body.site-page .bridge-page-intro {
  display: flex;
  justify-content: center;
  padding: 84px 24px 92px;
  background: #fff;
}

body.site-page .bridge-page-hero-plain .bridge-page-intro { padding-top: 72px; }

body.site-page .bridge-page-hero .page-hero-copy,
body.site-page .bridge-page-hero.page-hero-feature .page-hero-copy,
body.site-page .bridge-page-hero.page-hero-split .page-hero-copy,
body.site-page .bridge-page-hero.page-hero-editorial .page-hero-copy,
body.site-page .bridge-page-hero.page-hero-article .page-hero-copy {
  position: static;
  width: min(860px, 100%);
  padding: 0;
  background: transparent;
  color: var(--bridge-ink);
  text-align: center;
}

body.site-page .bridge-page-hero .eyebrow {
  display: block;
  margin-bottom: 13px;
  color: var(--bridge-grey);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
}

body.site-page .bridge-page-hero h1,
body.site-page .bridge-page-hero.has-chapter h1,
body.site-page .bridge-page-hero.page-hero-feature h1,
body.site-page .bridge-page-hero.page-hero-editorial h1,
body.site-page .bridge-page-hero.page-hero-article h1 {
  max-width: none;
  color: var(--bridge-ink);
  font-family: Roboto, var(--font-sans);
  font-size: 32px;
  font-weight: 700;
  line-height: 40px;
  letter-spacing: -.02em;
}

body.site-page .bridge-page-hero p,
body.site-page .bridge-page-hero.has-chapter p {
  max-width: 680px;
  margin: 18px auto 0;
  color: #4b5563;
  font-size: 14px;
  line-height: 1.7;
}

/* About */
.bridge-about-story {
  max-width: 840px;
  margin: 0 auto;
  padding: 70px 24px 100px;
  text-align: center;
}

.bridge-about-story .eyebrow { color: var(--bridge-grey); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }

.bridge-about-story h2 {
  margin-top: 18px;
  font-size: 30px;
  line-height: 1.25;
}

.bridge-about-story > div { max-width: 680px; margin: 38px auto 0; }
.bridge-about-story p { margin-top: 18px; color: #4b5563; font-size: 14px; line-height: 1.75; }

.bridge-about-triptych {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3px;
  padding: 0 40px 92px;
}

.bridge-about-triptych figure {
  margin: 0;
  overflow: hidden;
  aspect-ratio: 465 / 674;
  background: var(--bridge-warm);
}

.bridge-about-triptych img { width: 100%; height: 100%; object-fit: cover; }

body.site-page .bridge-about-evidence {
  padding: 0;
  border: 0;
  background: var(--bridge-warm);
}

body.site-page .bridge-about-evidence .about-evidence-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-width: none;
  padding: 0;
}

body.site-page .bridge-about-evidence .about-evidence-grid > div {
  min-height: 230px;
  padding: 30px 24px;
  border-right: 1px solid var(--bridge-line);
}

.bridge-about-location {
  display: grid;
  grid-template-columns: 3fr 2fr;
  min-height: 680px;
  background: #fff;
}

.bridge-about-location figure { margin: 0; overflow: hidden; }
.bridge-about-location figure img { width: 100%; height: 100%; object-fit: cover; }
.bridge-about-location > div { display: flex; flex-direction: column; justify-content: center; padding: 70px 9vw; }
.bridge-about-location h2 { margin-top: 18px; font-size: 30px; line-height: 1.2; }
.bridge-about-location p { margin-top: 18px; color: #4b5563; line-height: 1.7; }
.bridge-about-location a { align-self: flex-start; margin-top: 28px; padding-bottom: 3px; border-bottom: 1px solid currentColor; font-weight: 600; }

/* Clean the remaining inner-page components into the same visual system. */
body.site-page .sec-pad,
body.site-page .sec-pad-tight,
body.site-page .page-hero ~ .sec-pad,
body.site-page .page-hero ~ .sec-pad-tight {
  padding: 82px 0;
}

body.site-page .section-heading h2,
body.site-page .split-heading h2,
body.site-page .mii .copy h2,
body.site-page .contact-info > h2,
body.site-page .manufacturing-proof-copy h2 {
  font-family: Roboto, var(--font-sans);
  font-size: clamp(28px, 3vw, 38px);
  font-weight: 700;
  line-height: 1.15;
}

body.site-page .alt-row,
body.site-page .alt-row.reverse,
body.site-page .mii {
  gap: 0;
  margin: 0 0 3px;
  border: 0;
  border-radius: 0;
  background: #fff;
}

body.site-page .alt-row .visual,
body.site-page .alt-row .visual img,
body.site-page .alt-row .visual video,
body.site-page .mii .visual {
  border-radius: 0;
}

body.site-page .alt-row .copy,
body.site-page .alt-row.reverse .copy,
body.site-page .mii .copy {
  padding: 72px 8vw;
  background: #fff;
}

body.site-page .mat-card,
body.site-page .craft-detail-card,
body.site-page .b2b-cap-card,
body.site-page .blog-topic-card,
body.site-page .jrn-card,
body.site-page .work-piece,
body.site-page #brief-form,
body.site-page .contact-info {
  border-radius: 0;
  box-shadow: none;
}

body.site-page .mat-card h3,
body.site-page .craft-detail-copy h2,
body.site-page .b2b-cap-card h3,
body.site-page .process-grid:not(.home-process-grid) .step h3,
body.site-page .process-grid:not(.home-process-grid) .step h4,
body.site-page .jrn-card h2,
body.site-page .jrn-card h3,
body.site-page .prose h2 {
  font-family: Roboto, var(--font-sans);
  font-weight: 700;
}

body.site-page .btn-primary,
body.site-page .form-submit {
  border-radius: 0;
  background: var(--bridge-brown);
  color: #fff;
}

body.site-page .filter-pill,
body.site-page .radio-pill,
body.site-page input,
body.site-page textarea,
body.site-page select {
  border-radius: 0;
}

body.site-page .cta {
  min-height: 0;
  padding: 78px 0;
  background: var(--bridge-brown);
  color: #fff;
}

body.site-page .cta h2 {
  max-width: 760px;
  color: #fff;
  font-family: Roboto, var(--font-sans);
  font-size: 32px;
  font-weight: 700;
  line-height: 40px;
}

body.site-page .cta p { color: rgba(255, 255, 255, .82); }
body.site-page .cta-kicker { color: rgba(255, 255, 255, .9); }
body.site-page .cta-link,
body.site-page .cta-link:hover { color: #fff; }

/* Footer */
body.home .reference-footer,
body.site-page .reference-footer {
  padding: 66px 0 28px;
  border-top: 1px solid var(--bridge-line);
  background: #fff;
  color: var(--bridge-ink);
}

body.home .reference-footer .container,
body.site-page .reference-footer .container { max-width: none; padding-inline: 32px; }

body.home .reference-foot-grid,
body.site-page .reference-foot-grid {
  display: grid;
  grid-template-columns: 1.6fr repeat(5, minmax(110px, 1fr));
  gap: 34px;
}

body.home .reference-footer .foot-heading,
body.site-page .reference-footer .foot-heading {
  margin-bottom: 18px;
  color: var(--bridge-grey);
  font-family: Roboto, var(--font-sans);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
}

body.home .reference-footer li,
body.site-page .reference-footer li { margin: 8px 0; }

body.home .reference-footer a,
body.site-page .reference-footer a,
body.home .reference-footer p,
body.site-page .reference-footer p { color: var(--bridge-ink); font-size: 12px; }

body.home .reference-foot-name,
body.site-page .reference-foot-name { font-size: 16px; font-weight: 700; letter-spacing: .02em; }

body.home .foot-bottom,
body.site-page .foot-bottom {
  margin-top: 54px;
  padding-top: 18px;
  border-top: 1px solid var(--bridge-line);
  color: var(--bridge-grey);
  font-size: 10px;
}

@media (max-width: 1100px) {
  body.home .nav-links,
  body.site-page .nav-links { gap: 14px; }
  body.home .nav-links a,
  body.site-page .nav-links a { font-size: 10px; }
  .bridge-collection-grid { grid-auto-rows: calc(25vw + 210px); }
  body.home .reference-foot-grid,
  body.site-page .reference-foot-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .bridge-promo { padding: 0 16px; }
  .bridge-promo > span { display: none; }
  .bridge-promo { grid-template-columns: 1fr; text-align: center; }

  body.home .nav,
  body.site-page .nav { height: 66px; }

  body.home .nav-inner,
  body.site-page .nav-inner {
    display: flex;
    justify-content: center;
    padding: 0 16px;
  }

  body.home .nav-links,
  body.site-page .nav-links { display: none; }

  body.home .nav-wordmark,
  body.site-page .nav-wordmark { font-size: 20px; }

  body.home .hamburger,
  body.site-page .hamburger {
    position: absolute;
    right: 18px;
    display: flex;
  }

  body.home .nav[data-home="true"]:not(.solid) .hamburger span { background: #fff; }
  body.site-page.media-hero-page .nav[data-home="true"]:not(.solid) .hamburger span { background: #fff; }
  body.home main { padding-top: 32px; }
  body.site-page main { padding-top: 98px; }
  body.site-page.media-hero-page main { padding-top: 32px !important; }

  .mobile-menu { z-index: 210; }
  .mobile-menu .language-pair { margin-top: 22px; }

  .bridge-product-copy,
  .bridge-collection-copy { padding-top: 22px; }
  .bridge-collection-grid { grid-auto-rows: calc(25vw + 210px); }
  .bridge-pdp-meta { top: 98px; min-height: calc(100vh - 98px); max-height: calc(100vh - 98px); }
}

@media (max-width: 760px) {
  body.home .container,
  body.site-page .container { padding-inline: 16px; }

  .bridge-home-hero {
    height: 610px;
    min-height: 0;
  }

  .bridge-home-hero-image { object-position: 59% center; }
  .bridge-home-hero-shade { background: linear-gradient(0deg, rgba(3, 14, 26, .55), rgba(3, 14, 26, 0) 58%); }

  .bridge-home-hero-copy {
    left: 16px;
    right: 16px;
    bottom: 46px;
    width: auto;
    text-align: center;
  }

  .bridge-home-hero-copy h1 { font-size: 32px; line-height: 40px; }
  .bridge-home-hero-copy > p { margin-inline: auto; font-size: 12px; line-height: 1.55; }
  .bridge-home-hero-actions { justify-content: center; }

  .bridge-product-section,
  .bridge-category-section,
  .bridge-related { padding: 30px 0 38px; }

  .bridge-section-head { padding: 0 16px 22px; }
  .bridge-section-head h2 { font-size: 20px; line-height: 28px; }

  .bridge-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bridge-product-card { padding: 0 1px 30px; }
  .bridge-product-copy { min-height: 126px; padding: 22px 12px 12px; }

  .bridge-campaign-grid { grid-template-columns: 1fr; gap: 3px; padding-bottom: 30px; }
  .bridge-campaign-copy { left: 16px; right: 16px; bottom: 22px; }
  .bridge-campaign-copy strong { font-size: 26px; }

  .bridge-category-rail {
    display: flex;
    gap: 2px;
    padding: 0;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .bridge-category-rail::-webkit-scrollbar { display: none; }
  .bridge-category-card { flex: 0 0 56vw; padding: 0; scroll-snap-align: start; }
  .bridge-category-card strong { padding: 14px 12px 24px; }

  .bridge-wide-story { height: 610px; min-height: 0; }
  .bridge-wide-story > img { object-position: 66% center; }
  .bridge-wide-story-copy { left: 16px; right: 16px; bottom: 28px; }
  .bridge-wide-story-copy strong { font-size: 28px; }

  .bridge-service-grid { grid-template-columns: 1fr; }

  .bridge-collection-head { padding: 46px 16px 0; }
  .bridge-collection-head h1 { font-size: 32px; line-height: 40px; }
  .bridge-collection-head p { display: none; }
  .bridge-collection-toolbar { min-height: 40px; align-items: flex-start; padding: 5px 16px; overflow: hidden; }
  .bridge-collection-toolbar > span { padding-top: 5px; }

  body.site-page .bridge-collection-toolbar .filter-bar {
    flex-wrap: nowrap;
    justify-content: flex-start;
    width: calc(100vw - 100px);
    overflow-x: auto;
    scrollbar-width: none;
  }

  body.site-page .bridge-collection-toolbar .filter-bar::-webkit-scrollbar { display: none; }
  body.site-page .bridge-collection-toolbar .filter-pill { flex: none; }

  .bridge-collection-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: auto;
  }

  .bridge-collection-campaign {
    grid-column: span 2;
    grid-row: span 1;
    height: 100vw;
  }

  .bridge-collection-campaign strong { left: 16px; bottom: 24px; font-size: 27px; }

  body.site-page .bridge-collection-card {
    min-height: 440px;
    padding: 24px 1px 0;
  }

  body.site-page .bridge-collection-card .bridge-collection-copy {
    min-height: 168px;
    padding: 24px 12px 14px;
  }

  .bridge-collection-end {
    grid-template-columns: 1fr;
    align-items: start;
    padding: 60px 20px;
  }

  .bridge-collection-end h2 { font-size: 28px; line-height: 36px; }
  .bridge-collection-end > a { width: 100%; }

  .bridge-pdp { display: block; }

  .bridge-pdp-gallery {
    display: flex;
    width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .bridge-pdp-gallery::-webkit-scrollbar { display: none; }
  .bridge-pdp-image { flex: 0 0 100vw; scroll-snap-align: start; }

  .bridge-pdp-meta {
    position: static;
    min-height: 0;
    max-height: none;
    padding: 16px;
    overflow: visible;
  }

  .bridge-pdp-breadcrumb { display: none; }
  .bridge-pdp-vendor { display: none; }
  .bridge-pdp-meta h1 { font-size: 24px; line-height: 32px; }
  .bridge-pdp-actions { width: auto; margin: 28px -16px 0; }
  .bridge-pdp-primary,
  .bridge-pdp-secondary { min-height: 58px; }
  .bridge-pdp-note { margin-top: 20px; }
  .bridge-pdp-details { width: 100%; }
  .bridge-pdp-row { grid-template-columns: 94px minmax(0, 1fr); }

  body.site-page .bridge-page-hero > .bridge-page-visual {
    height: 610px;
    min-height: 0;
  }

  body.site-page .bridge-page-hero .page-hero-media { object-position: center; }
  body.site-page .bridge-page-intro { padding: 58px 20px 66px; }
  body.site-page .bridge-page-hero h1,
  body.site-page .bridge-page-hero.has-chapter h1,
  body.site-page .bridge-page-hero.page-hero-feature h1,
  body.site-page .bridge-page-hero.page-hero-editorial h1,
  body.site-page .bridge-page-hero.page-hero-article h1 { font-size: 32px; line-height: 40px; }

  .bridge-about-story { padding: 55px 20px 74px; }
  .bridge-about-story h2 { font-size: 27px; }

  .bridge-about-triptych {
    display: flex;
    gap: 3px;
    padding: 0 0 62px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .bridge-about-triptych::-webkit-scrollbar { display: none; }
  .bridge-about-triptych figure { flex: 0 0 82vw; scroll-snap-align: start; }

  body.site-page .bridge-about-evidence .about-evidence-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.site-page .bridge-about-evidence .about-evidence-grid > div { min-height: 210px; padding: 26px 18px; }

  .bridge-about-location { grid-template-columns: 1fr; min-height: 0; }
  .bridge-about-location figure { height: 480px; }
  .bridge-about-location figure img { object-position: 60% center; }
  .bridge-about-location > div { padding: 56px 20px 64px; }

  body.site-page .sec-pad,
  body.site-page .sec-pad-tight,
  body.site-page .page-hero ~ .sec-pad,
  body.site-page .page-hero ~ .sec-pad-tight { padding: 62px 0; }

  body.site-page .alt-row .copy,
  body.site-page .alt-row.reverse .copy,
  body.site-page .mii .copy { padding: 44px 22px; }

  body.site-page .cta { padding: 62px 0; }
  body.site-page .cta h2 { font-size: 28px; line-height: 36px; }

  body.home .reference-footer,
  body.site-page .reference-footer { padding: 52px 0 24px; }

  body.home .reference-footer .container,
  body.site-page .reference-footer .container { padding-inline: 20px; }

  body.home .reference-foot-grid,
  body.site-page .reference-foot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 38px 20px; }

  body.home .reference-foot-brand,
  body.site-page .reference-foot-brand { grid-column: 1 / -1; }

  body.home .foot-bottom,
  body.site-page .foot-bottom { display: grid; gap: 8px; margin-top: 40px; }
}

@media (max-width: 390px) {
  body.site-page .bridge-collection-card { min-height: 440px; }
  .bridge-product-copy strong,
  .bridge-collection-copy strong { font-size: 13px; }
}

/* ──────────────────────────────────────────────────────────────
   V60 — Italian editorial image system
   Reference-led story pages: full-bleed opening photography,
   warm topic backgrounds, alternating image/text chapters and
   retail-clean product modules. Admin remains untouched.
   ────────────────────────────────────────────────────────────── */

:root {
  --bridge-paper: #f5f4f1;
  --bridge-paper-deep: #ecebe7;
  --bridge-story-ink: #171717;
}

/* Every public story page now opens with one photographic chapter instead of
   a detached image followed by a second white title block. */
body.site-page .bridge-page-hero.bridge-page-hero-media .bridge-page-visual {
  position: relative;
  width: 100%;
  height: min(58vw, 835px);
  min-height: 640px;
  overflow: hidden;
}

body.site-page .bridge-page-hero.bridge-page-hero-media .page-hero-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

body.site-page .bridge-page-hero-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(0deg, rgba(11, 15, 12, .58) 0%, rgba(11, 15, 12, .18) 38%, rgba(11, 15, 12, .04) 68%);
}

body.site-page .bridge-page-hero.bridge-page-hero-media .bridge-page-intro {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 0 24px 66px;
  background: transparent;
}

body.site-page .bridge-page-hero.bridge-page-hero-media .page-hero-copy {
  width: min(760px, 100%);
  color: #fff;
  text-align: center;
}

body.site-page .bridge-page-hero.bridge-page-hero-media .eyebrow,
body.site-page .bridge-page-hero.bridge-page-hero-media h1,
body.site-page .bridge-page-hero.bridge-page-hero-media p,
body.site-page .bridge-page-hero.bridge-page-hero-media .article-meta {
  color: #fff;
}

body.site-page .bridge-page-hero.bridge-page-hero-media h1,
body.site-page .bridge-page-hero.bridge-page-hero-media.page-hero-article h1 {
  max-width: 760px;
  margin-inline: auto;
  font-size: clamp(32px, 3.15vw, 46px);
  line-height: 1.08;
  text-wrap: balance;
}

body.site-page .bridge-page-hero.bridge-page-hero-media p {
  max-width: 620px;
  margin-top: 14px;
  font-size: 14px;
  line-height: 1.55;
  text-wrap: balance;
}

body.site-page .bridge-page-hero.bridge-page-hero-media .article-meta {
  margin-top: 17px;
  font-size: 10px;
  letter-spacing: .08em;
  opacity: .9;
  text-transform: uppercase;
}

body.site-page .bridge-page-hero-plain .bridge-page-intro {
  min-height: 390px;
  padding: 110px 24px 90px;
  background: var(--bridge-paper);
}

body.site-page .bridge-page-hero-plain .page-hero-copy {
  width: min(780px, 100%);
  text-align: center;
}

/* Carbon-style chapter rhythm for process, custom and manufacturing routes. */
body.site-page .alt-row,
body.site-page .alt-row.reverse {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-height: 570px;
  margin: 0;
  background: var(--bridge-paper);
}

body.site-page .alt-row .visual,
body.site-page .alt-row .visual img,
body.site-page .alt-row .visual video {
  width: 100%;
  height: 100%;
  min-height: 570px;
  object-fit: cover;
}

body.site-page .alt-row .copy,
body.site-page .alt-row.reverse .copy {
  min-height: 570px;
  padding: clamp(62px, 8vw, 118px);
  background: var(--bridge-paper);
  color: var(--bridge-story-ink);
}

body.site-page .alt-row .copy h3,
body.site-page .alt-row.reverse .copy h3 {
  margin: 18px 0 25px;
  color: var(--bridge-story-ink);
  font-family: Roboto, var(--font-sans);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: .025em;
  text-transform: uppercase;
}

body.site-page .alt-row .copy p,
body.site-page .alt-row .copy dd {
  color: rgba(23, 23, 23, .82);
  font-size: 14px;
  line-height: 1.9;
}

body.site-page .alt-row .step-num {
  color: rgba(23, 23, 23, .62);
  font-size: 10px;
  letter-spacing: .12em;
}

body.site-page .proc-subblock dt {
  color: var(--bridge-story-ink);
  font-size: 10px;
  letter-spacing: .08em;
}

/* Shared sections lose the old dashboard/card feeling. */
body.site-page .section-heading h2,
body.site-page .split-heading h2,
body.site-page .manufacturing-proof-copy h2,
body.site-page .mii .copy h2 {
  font-size: clamp(28px, 3vw, 40px) !important;
  line-height: 1.12;
  text-wrap: balance;
}

body.site-page .private-label-route,
body.site-page .bridge-about-evidence,
body.site-page .private-label-faq,
body.site-page .manufacturing-proof,
body.site-page .contact-form-section {
  background: var(--bridge-paper);
}

body.site-page .private-label-route-grid > div,
body.site-page .about-evidence-grid > div {
  border-color: rgba(23, 23, 23, .18);
}

body.site-page .axes-grid,
body.site-page .mat-grid,
body.site-page .craft-detail-grid {
  border: 0;
  background: transparent;
}

body.site-page .axis.axis-photo,
body.site-page .mat-card,
body.site-page .craft-detail-card,
body.site-page .b2b-cap-card,
body.site-page .blog-topic-card {
  border: 0;
  background: transparent;
}

body.site-page .axis-media,
body.site-page .mat-card .visual,
body.site-page .craft-detail-card figure {
  border-radius: 0;
  background: #e8e5de;
}

body.site-page .axis-media img,
body.site-page .mat-card img,
body.site-page .craft-detail-card img,
body.site-page .manufacturing-proof-media img,
body.site-page .mii img {
  filter: none;
}

body.site-page .manufacturing-proof-copy {
  max-width: 820px;
  margin: 0 auto 62px;
  text-align: center;
}

body.site-page .manufacturing-proof-media {
  gap: 3px;
}

body.site-page .manufacturing-proof-media img {
  height: min(44vw, 620px);
}

body.site-page .mii {
  min-height: 620px;
  background: var(--bridge-paper);
}

body.site-page .mii .visual,
body.site-page .mii .copy {
  min-height: 620px;
}

body.site-page .mii .copy {
  background: var(--bridge-paper);
  color: var(--bridge-story-ink);
}

/* Homepage: one model hero, then product-only, environment and outfit roles. */
.bridge-story-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3px;
  padding-bottom: 3px;
}

.bridge-story-grid .bridge-campaign-tile {
  aspect-ratio: 1 / 1;
}

.bridge-story-grid .bridge-campaign-copy strong {
  max-width: 390px;
  font-size: clamp(23px, 2.1vw, 30px);
}

.bridge-environment-product {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(390px, 2fr);
  min-height: 760px;
  background: var(--bridge-warm);
}

.bridge-environment-panel {
  position: relative;
  min-height: 760px;
  overflow: hidden;
  color: #fff;
}

.bridge-environment-panel > img,
.bridge-environment-panel > .bridge-wide-story-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.bridge-environment-panel > img {
  object-fit: cover;
  object-position: center;
  transition: transform .55s ease;
}

.bridge-environment-panel:hover > img { transform: scale(1.015); }

.bridge-featured-product {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: 56px clamp(30px, 4vw, 64px);
  color: var(--bridge-ink);
}

.bridge-featured-product-image {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  overflow: hidden;
  background: var(--bridge-warm);
}

.bridge-featured-product-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bridge-featured-product-copy {
  display: flex;
  flex-direction: column;
  padding-top: 24px;
}

.bridge-featured-product-copy small {
  margin-bottom: 6px;
  color: var(--bridge-grey);
  font-size: 10px;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.bridge-featured-product-copy strong {
  font-size: 20px;
  font-weight: 500;
}

.bridge-featured-product-copy span {
  margin-top: 12px;
  font-size: 12px;
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* About follows the same atmosphere -> story -> craft -> place sequence. */
.bridge-about-story {
  width: 100%;
  max-width: none;
  padding: 90px max(24px, calc((100vw - 840px) / 2)) 105px;
  background: var(--bridge-paper);
  color: var(--bridge-story-ink);
}

.bridge-about-story h2,
.bridge-about-story p { color: var(--bridge-story-ink); }

.bridge-about-triptych {
  padding: 0 40px 100px;
  background: var(--bridge-paper);
}

.bridge-about-location {
  background: var(--bridge-paper);
  color: var(--bridge-story-ink);
}

.bridge-about-location > div { background: var(--bridge-paper); }
.bridge-about-location p { color: rgba(23, 23, 23, .8); }

/* Journal list: three clean landscape cards plus one full-width brand chapter. */
body.site-page .blog-articles {
  padding: clamp(86px, 9vw, 132px) 0 clamp(110px, 11vw, 160px);
  background: #fff;
}

body.site-page .blog-articles .split-heading {
  padding-bottom: 58px;
  border-bottom: 1px solid var(--bridge-line);
}

body.site-page .jrn-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 70px 24px;
  margin-top: 56px;
}

body.site-page .jrn-card .visual {
  aspect-ratio: 4 / 3;
  margin-bottom: 22px;
  background: var(--bridge-warm);
}

body.site-page .jrn-card .visual img {
  filter: none;
  transition: transform .45s ease;
}

body.site-page .jrn-card:hover .visual img { transform: scale(1.018); }

.jrn-card-kicker {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  color: var(--bridge-grey);
  font-size: 9px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

body.site-page .jrn-card h2,
body.site-page .jrn-card h3 {
  margin: 12px 0 10px;
  font-size: 19px;
  line-height: 1.25;
}

body.site-page .jrn-card p {
  margin-bottom: 17px;
  color: #4b5563;
  font-size: 12px;
  line-height: 1.65;
}

.jrn-read {
  display: inline-block;
  padding-bottom: 3px;
  border-bottom: 1px solid var(--bridge-brown);
  color: var(--bridge-brown);
  font-size: 11px;
  font-weight: 600;
}

.bridge-journal-wide {
  position: relative;
  display: block;
  width: 100%;
  height: min(56.25vw, 810px);
  min-height: 620px;
  overflow: hidden;
  color: #fff;
}

.bridge-journal-wide > img,
.bridge-journal-wide > span {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.bridge-journal-wide > img { object-fit: cover; }
.bridge-journal-wide > span { background: linear-gradient(0deg, rgba(9, 13, 10, .52), transparent 46%); }

.bridge-journal-wide > strong {
  position: absolute;
  z-index: 2;
  left: 32px;
  bottom: 38px;
  max-width: 520px;
  color: #fff;
  font-size: clamp(28px, 3vw, 40px);
  line-height: 1.08;
}

.bridge-journal-wide > strong small {
  display: block;
  margin-bottom: 11px;
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

body.site-page .blog-topic-hub {
  background: var(--bridge-paper);
}

body.site-page .blog-topic-grid {
  background: rgba(23, 23, 23, .18);
}

body.site-page .blog-topic-card {
  background: var(--bridge-paper);
  color: var(--bridge-story-ink);
}

/* Article pages use the reference topic-page cadence: image hero, restrained
   green paper, long readable column, then a small product module. */
.bridge-article-story {
  padding: clamp(82px, 9vw, 132px) 0 clamp(96px, 11vw, 154px);
  background: var(--bridge-paper);
  color: var(--bridge-story-ink);
}

body.site-page .bridge-article-story .container-narrow {
  max-width: 960px;
}

body.site-page .bridge-article-story .prose {
  max-width: 900px;
  color: var(--bridge-story-ink);
  font-size: 16px;
  line-height: 2;
}

body.site-page .bridge-article-story .prose p,
body.site-page .bridge-article-story .prose li,
body.site-page .bridge-article-story .prose strong,
body.site-page .bridge-article-story .prose em {
  color: var(--bridge-story-ink);
}

body.site-page .bridge-article-story .prose h2 {
  margin: 62px 0 20px;
  color: var(--bridge-story-ink);
  font-size: 18px;
  line-height: 1.4;
  letter-spacing: .035em;
  text-transform: uppercase;
}

body.site-page .bridge-article-story .article-foot {
  margin-top: 74px;
  padding-top: 28px;
  border-top-color: rgba(23, 23, 23, .22);
}

.bridge-article-library {
  padding: 86px 24px 112px;
  background: #fff;
}

.bridge-article-library-head {
  max-width: 720px;
  margin: 0 auto 50px;
  text-align: center;
}

.bridge-article-library-head h2 {
  margin-top: 14px;
  font-size: 30px;
  line-height: 1.18;
}

.bridge-article-library-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 330px));
  justify-content: center;
  gap: 24px;
}

.bridge-article-library-grid > a {
  display: flex;
  flex-direction: column;
  color: var(--bridge-ink);
}

.bridge-article-library-grid > a > span {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  overflow: hidden;
  background: var(--bridge-warm);
}

.bridge-article-library-grid img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bridge-article-library-grid small {
  margin-top: 20px;
  color: var(--bridge-grey);
  font-size: 9px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.bridge-article-library-grid strong {
  margin-top: 6px;
  font-size: 14px;
  font-weight: 500;
}

/* Functional routes share the same flat paper and rule-based hierarchy. */
body.site-page .contact-route-grid > a,
body.site-page #brief-form,
body.site-page .contact-info {
  border: 0;
  background: #fff;
  box-shadow: none;
}

body.site-page .contact-route-grid strong,
body.site-page .acc-q {
  font-family: Roboto, var(--font-sans);
  font-weight: 500;
}

body.site-page .contact-side-visual img { filter: none; }

body.site-page .acc-q {
  color: var(--bridge-story-ink);
  font-size: 18px;
}

@media (max-width: 980px) {
  .bridge-story-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bridge-story-grid .bridge-campaign-tile:last-child { grid-column: 1 / -1; aspect-ratio: 16 / 9; }
  .bridge-environment-product { grid-template-columns: minmax(0, 1.4fr) minmax(320px, .8fr); }
  body.site-page .jrn-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  body.site-page .bridge-page-hero.bridge-page-hero-media .bridge-page-visual {
    height: 590px;
    min-height: 0;
  }

  body.site-page .bridge-page-hero.bridge-page-hero-media .bridge-page-intro {
    padding: 0 18px 44px;
  }

  body.site-page .bridge-page-hero.bridge-page-hero-media h1,
  body.site-page .bridge-page-hero.bridge-page-hero-media.page-hero-article h1 {
    font-size: 31px;
    line-height: 1.1;
  }

  body.site-page .bridge-page-hero.bridge-page-hero-media p {
    font-size: 13px;
    line-height: 1.55;
  }

  body.site-page .bridge-page-hero-plain .bridge-page-intro {
    min-height: 340px;
    padding: 82px 20px 66px;
  }

  body.site-page .alt-row,
  body.site-page .alt-row.reverse {
    display: flex;
    flex-direction: column;
    min-height: 0;
  }

  body.site-page .alt-row .copy,
  body.site-page .alt-row.reverse .copy {
    order: 1 !important;
    min-height: 0;
    padding: 58px 22px 52px;
  }

  body.site-page .alt-row .visual,
  body.site-page .alt-row.reverse .visual {
    order: 2 !important;
    min-height: 0;
    height: 100vw;
  }

  body.site-page .alt-row .visual img,
  body.site-page .alt-row .visual video {
    min-height: 0;
    height: 100%;
  }

  .bridge-story-grid { grid-template-columns: 1fr; }
  .bridge-story-grid .bridge-campaign-tile,
  .bridge-story-grid .bridge-campaign-tile:last-child {
    grid-column: auto;
    aspect-ratio: 1 / 1;
  }

  .bridge-environment-product { grid-template-columns: 1fr; min-height: 0; }
  .bridge-environment-panel { min-height: 560px; }
  .bridge-featured-product { padding: 34px 16px 48px; }

  .bridge-about-story {
    padding: 64px 20px 76px;
  }

  .bridge-about-triptych {
    padding-bottom: 68px;
  }

  body.site-page .jrn-grid {
    grid-template-columns: 1fr;
    gap: 62px;
  }

  body.site-page .blog-articles .split-heading {
    padding-bottom: 36px;
  }

  .bridge-journal-wide {
    height: 560px;
    min-height: 0;
  }

  .bridge-journal-wide > img { object-position: 66% center; }
  .bridge-journal-wide > strong { left: 18px; right: 18px; bottom: 28px; }

  .bridge-article-story { padding: 68px 0 88px; }

  body.site-page .bridge-article-story .prose {
    padding-inline: 4px;
    font-size: 15px;
    line-height: 1.88;
  }

  body.site-page .bridge-article-story .prose h2 {
    margin-top: 50px;
    font-size: 16px;
  }

  .bridge-article-library { padding: 66px 0 86px; }
  .bridge-article-library-head { padding-inline: 20px; }
  .bridge-article-library-head h2 { font-size: 26px; }
  .bridge-article-library-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px; }
  .bridge-article-library-grid small,
  .bridge-article-library-grid strong { margin-left: 12px; margin-right: 12px; }

  body.site-page .mii,
  body.site-page .mii .visual,
  body.site-page .mii .copy { min-height: 0; }

  body.site-page .mii .visual { height: 100vw; }
body.site-page .manufacturing-proof-media img { height: 100vw; }
}

/* V65 — approved-sample hero story and neutral B2B capability system. */
body.home .bridge-home-hero-image {
  object-position: center 50%;
  filter: saturate(.96) contrast(1.01);
}

body.home .bridge-home-hero-shade {
  background: linear-gradient(90deg, rgba(5, 8, 11, .84) 0%, rgba(5, 8, 11, .62) 37%, rgba(5, 8, 11, .16) 72%, rgba(5, 8, 11, .05) 100%);
}

body.site-page .manufacturing-factory-photo {
  object-position: center 60%;
  filter: saturate(.82) contrast(.98);
}

.bridge-home-capabilities strong a {
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
}

body.site-page .page-hero-capabilities .page-hero-media { object-position: center 52%; }

.capabilities-intro {
  padding: clamp(76px, 8vw, 118px) 0;
  background: #fff;
}

.capabilities-intro-grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(54px, 8vw, 112px);
  align-items: start;
}

.capabilities-intro h2,
.capabilities-scope h2,
.capabilities-operations h2 {
  max-width: 680px;
  margin-top: 15px;
  font-size: clamp(31px, 4vw, 54px);
  line-height: 1.04;
  letter-spacing: -.025em;
  text-wrap: balance;
}

.capabilities-intro-grid > p,
.capabilities-scope-copy > p {
  max-width: 690px;
  color: #454545;
  font-size: 15px;
  line-height: 1.9;
}

.capabilities-services { background: var(--bridge-paper); }

.capabilities-services .b2b-cap-grid {
  border-top: 1px solid rgba(23, 23, 23, .18);
}

.capabilities-services .b2b-cap-card {
  border-bottom: 1px solid rgba(23, 23, 23, .18);
}

.capabilities-scope {
  padding: clamp(88px, 10vw, 142px) 0;
  background: #fff;
}

.capabilities-scope-grid {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: clamp(62px, 9vw, 126px);
  align-items: start;
}

.capabilities-scope-copy > p { margin-top: 25px; }

.capabilities-scope-row {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 18px;
  align-items: baseline;
  padding: 23px 0;
  border-top: 1px solid rgba(23, 23, 23, .2);
}

.capabilities-scope-row > span,
.capabilities-operation > span {
  color: #737373;
  font-size: 10px;
  letter-spacing: .1em;
}

.capabilities-scope-row strong {
  font-size: clamp(18px, 2vw, 25px);
  font-weight: 500;
  line-height: 1.3;
}

.capabilities-scope-note {
  margin-top: 28px;
  color: #666;
  font-size: 12px;
  line-height: 1.75;
}

.capabilities-operations {
  padding: clamp(88px, 10vw, 142px) 0;
  background: var(--bridge-paper);
}

.capabilities-operations-head { max-width: 760px; }

.capabilities-operations-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: clamp(54px, 6vw, 82px);
  border-top: 1px solid rgba(23, 23, 23, .2);
}

.capabilities-operation {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 15px;
  padding: 42px 42px 48px 0;
  border-bottom: 1px solid rgba(23, 23, 23, .2);
}

.capabilities-operation:nth-child(odd) {
  margin-right: 42px;
  border-right: 1px solid rgba(23, 23, 23, .2);
}

.capabilities-operation h3 {
  margin-bottom: 14px;
  font-size: 18px;
  line-height: 1.3;
}

.capabilities-operation p {
  max-width: 490px;
  color: #525252;
  font-size: 13px;
  line-height: 1.75;
}

.capabilities-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: 64px;
  background: rgba(23, 23, 23, .18);
  border: 1px solid rgba(23, 23, 23, .18);
}

.capabilities-links a {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  padding: 24px;
  background: var(--bridge-paper);
  color: #171717;
  font-size: 12px;
  font-weight: 600;
}

@media (max-width: 760px) {
  body.home .bridge-home-hero-image { object-position: 64% center; }
  body.home .bridge-home-hero-shade {
    background: linear-gradient(0deg, rgba(5, 8, 11, .86) 0%, rgba(5, 8, 11, .48) 50%, rgba(5, 8, 11, .06) 100%);
  }

  .capabilities-intro-grid,
  .capabilities-scope-grid,
  .capabilities-operations-grid,
  .capabilities-links { grid-template-columns: 1fr; }

  .capabilities-intro-grid,
  .capabilities-scope-grid { gap: 38px; }

  .capabilities-operation,
  .capabilities-operation:nth-child(odd) {
    margin-right: 0;
    padding: 32px 0 36px;
    border-right: 0;
  }

  .capabilities-links { margin-top: 48px; }
}