.hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(370px, 0.72fr) minmax(0, 1.65fr);
  min-height: 100svh;
  padding-top: var(--header-height);
  background: var(--color-paper);
}

.hero > * { min-width: 0; }

.hero__copy {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--space-6) clamp(28px, 5vw, 86px);
}

.hero__copy .eyebrow { margin-bottom: var(--space-5); color: var(--color-muted); }
.hero h1 { font-family: var(--font-display); font-size: clamp(4.1rem, 6.5vw, 8.6rem); font-weight: 400; letter-spacing: -0.065em; line-height: 0.84; }
.hero h1 em { font-weight: 400; }
.hero__intro { max-width: 28ch; margin-top: var(--space-5); color: var(--color-muted); font-size: clamp(1rem, 1.2vw, 1.18rem); }
.hero__actions { display: flex; align-items: center; gap: var(--space-4); margin-top: var(--space-4); }

.hero__media { position: relative; min-height: calc(100svh - var(--header-height)); overflow: hidden; }
.hero__media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(23, 24, 22, 0.06), transparent 30%); pointer-events: none; }
.hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 52% center; animation: hero-in 1.4s var(--ease-standard) both; }
.hero__media figcaption { position: absolute; z-index: 2; inset: auto 22px 18px; display: flex; justify-content: space-between; color: rgba(255, 255, 255, 0.84); font-size: 0.62rem; letter-spacing: 0.12em; text-transform: uppercase; }
.hero__scroll { position: absolute; z-index: 3; left: clamp(28px, 5vw, 86px); bottom: 22px; display: flex; align-items: center; gap: 14px; color: var(--color-muted); font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.1em; }
.hero__scroll i { width: 38px; height: 1px; background: currentColor; }

@keyframes hero-in { from { transform: scale(1.04); opacity: 0.2; } to { transform: scale(1); opacity: 1; } }

.categories__grid { display: grid; grid-template-columns: 1.1fr 0.9fr 1fr; gap: 12px; }
.category-card a { display: block; }
.category-card__media { overflow: hidden; aspect-ratio: 0.84; background: var(--color-paper-deep); }
.category-card:nth-child(2) { margin-top: 88px; }
.category-card__media img,
.collection-card__media img,
.project-card__media img { width: 100%; height: 100%; object-fit: cover; object-position: var(--object-position, center); transition: transform 900ms var(--ease-standard), filter 500ms ease; }
.category-card:hover img,
.collection-card:hover img,
.project-card:hover img { transform: scale(1.025); }
.category-card:nth-child(1) img { filter: saturate(0.65) brightness(0.92); }
.category-card:nth-child(2) img { filter: saturate(0.55) brightness(1.1); }
.category-card:nth-child(3) img { filter: saturate(0.7) contrast(1.08); }
.category-card__caption { display: grid; grid-template-columns: 32px 1fr auto; gap: 14px; align-items: start; padding-top: 18px; }
.category-card__caption > span { color: var(--color-muted); font-size: 0.65rem; }
.category-card h3 { font-family: var(--font-display); font-size: clamp(1.35rem, 2vw, 2rem); font-weight: 400; line-height: 1; }
.category-card p { margin-top: 7px; color: var(--color-muted); font-size: 0.74rem; }
.category-card b { font-size: 0.85rem; font-weight: 400; }

.statement { display: grid; grid-template-columns: 1.5fr 1fr; min-height: 86svh; background: var(--color-dark); color: var(--color-paper); }
.statement > *,
.constructor-preview > *,
.about-preview > *,
.interiors__grid > * { min-width: 0; }
.statement__media { min-height: 720px; overflow: hidden; }
.statement__media img { width: 100%; height: 100%; object-fit: cover; object-position: 75% center; filter: saturate(0.5) brightness(0.66); }
.statement__copy { display: flex; flex-direction: column; justify-content: center; padding: var(--space-6); }
.statement__copy h2 { margin: var(--space-5) 0; font-size: clamp(3.2rem, 4.5vw, 6rem); }
.statement__copy > p:not(.eyebrow) { max-width: 40ch; color: rgba(243, 240, 233, 0.66); }
.statement__copy .text-link { align-self: flex-start; margin-top: var(--space-5); }

.section-heading--row .eyebrow { margin: 0 0 20px; }
.collections__grid { display: grid; grid-template-columns: 1.25fr 0.75fr; gap: 64px 14px; }
.collection-card:nth-child(3) { grid-column: 1; }
.collection-card:nth-child(4) { grid-column: 2; margin-top: -80px; }
.collection-card__media { overflow: hidden; aspect-ratio: 1.5; background: var(--color-paper-deep); }
.collection-card:nth-child(even) .collection-card__media { aspect-ratio: 0.86; }
.collection-card--glass img { filter: grayscale(0.45) brightness(1.12); }
.collection-card--walnut img { filter: saturate(0.65) brightness(0.72); }
.collection-card--stone img { filter: grayscale(0.65) contrast(0.9); }
.collection-card__caption { position: relative; display: grid; grid-template-columns: 48px 1fr auto; gap: 16px; padding-top: 16px; }
.collection-card__caption > span { color: var(--color-muted); font-size: 0.65rem; }
.collection-card h3 { font-family: var(--font-display); font-size: clamp(1.4rem, 2vw, 2.2rem); font-weight: 400; line-height: 1; }
.collection-card p { grid-column: 2; max-width: 34ch; color: var(--color-muted); font-size: 0.76rem; }
.collection-card b { grid-column: 3; grid-row: 1; font-weight: 400; }

.constructor-preview { display: grid; grid-template-columns: 0.76fr 1.24fr; min-height: 900px; background: var(--color-dark-soft); color: var(--color-paper); }
.constructor-preview__intro { display: flex; flex-direction: column; justify-content: center; padding: var(--space-7) clamp(32px, 6vw, 110px); }
.constructor-preview__intro h2 { margin: var(--space-5) 0 var(--space-4); }
.constructor-preview__intro > p:not(.eyebrow) { max-width: 36ch; color: rgba(243, 240, 233, 0.62); }
.constructor-preview__intro .button { align-self: flex-start; margin-top: var(--space-5); }
.door-composer { display: grid; grid-template-columns: 1fr 0.55fr; margin: var(--space-5); background: var(--color-paper); color: var(--color-ink); }
.door-composer__stage { display: flex; flex-direction: column; justify-content: center; align-items: center; min-height: 760px; padding: var(--space-5); background: linear-gradient(135deg, #d8d0c2, #efece4 55%, #c8b9a4); }
.door-composer__frame { display: grid; place-items: center; width: min(72%, 390px); aspect-ratio: 0.57; padding: 13px; background: #3b3129; box-shadow: 28px 30px 50px rgba(35, 27, 20, 0.2); }
.door-composer__leaf { position: relative; width: 100%; height: 100%; background: repeating-linear-gradient(88deg, rgba(255,255,255,.025) 0 2px, transparent 2px 19px), linear-gradient(90deg, #5d3923, #8a5a34 44%, #644027); }
.door-composer__leaf i { position: absolute; right: 10%; top: 48%; width: 5px; height: 70px; background: #181714; }
.door-composer__stage > span { margin-top: var(--space-4); color: var(--color-muted); font-size: 0.65rem; letter-spacing: 0.1em; text-transform: uppercase; }
.door-composer__controls { display: grid; align-content: center; padding: var(--space-4); }
.door-composer__controls > div { min-height: 120px; padding: 20px 0; border-bottom: 1px solid var(--color-line); }
.door-composer__controls > div:last-child { border-bottom: 0; }
.door-composer__controls span { color: var(--color-muted); font-size: 0.62rem; }
.door-composer__controls p { margin: 8px 0 4px; font-family: var(--font-display); font-size: 1.25rem; }
.door-composer__controls b { font-size: 0.68rem; font-weight: 400; color: var(--color-muted); }
.mini-swatches { display: flex; gap: 7px; margin-top: 12px; }
.mini-swatches i { width: 25px; height: 25px; background: #7c5130; border-radius: 50%; }
.mini-swatches i:nth-child(2) { background: #d0bea6; }
.mini-swatches i:nth-child(3) { background: #2b2c29; }
.mini-swatches i:nth-child(4) { background: #8d8a81; }

.materials { background: var(--color-paper); }
.materials__list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.material-sample { aspect-ratio: 0.8; margin-bottom: 16px; background-color: #c8b39a; }
.material--oak { background: repeating-linear-gradient(88deg, #c7ad8a 0 5px, #bfa17d 5px 8px, #d1bb9e 8px 12px); }
.material--walnut { background: repeating-linear-gradient(92deg, #58351f 0 4px, #744b2e 4px 8px, #482c1d 8px 11px); }
.material--graphite { background: linear-gradient(120deg, #333532, #161715 62%, #454641); }
.material--glass { background: linear-gradient(135deg, rgba(235,235,225,.8), rgba(74,77,73,.4)), repeating-linear-gradient(90deg, #91938e 0 1px, transparent 1px 18px); }
.material--stone { background: radial-gradient(circle at 18% 20%, rgba(255,255,255,.55) 0 1px, transparent 2px), linear-gradient(120deg, #c6bfb2, #9f9688); background-size: 17px 17px, 100%; }
.material-card > span { color: var(--color-muted); font-size: 0.63rem; }
.material-card h3 { margin-top: 5px; font-family: var(--font-display); font-size: clamp(1.05rem, 1.5vw, 1.55rem); font-weight: 400; }

.interiors { padding-top: var(--space-6); }
.interiors__grid { display: grid; grid-template-columns: 1.25fr 0.75fr; gap: 14px; }
.project-card:first-child { grid-row: span 2; }
.project-card__media { overflow: hidden; aspect-ratio: 1.2; background: var(--color-paper-deep); }
.project-card:first-child .project-card__media { height: 100%; min-height: 700px; aspect-ratio: auto; }
.project-card:nth-child(1) img { filter: saturate(.55) brightness(1.1); }
.project-card:nth-child(2) img { filter: saturate(.65) brightness(.8); }
.project-card:nth-child(3) img { filter: grayscale(.45) contrast(.9); }
.project-card > div:last-child { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; padding: 13px 0 24px; }
.project-card span { color: var(--color-muted); font-size: 0.64rem; text-transform: uppercase; letter-spacing: .08em; }
.project-card h3 { font-family: var(--font-display); font-size: clamp(1.2rem, 1.8vw, 1.9rem); font-weight: 400; }

.about-preview { display: grid; grid-template-columns: 0.76fr 1.24fr; min-height: 82svh; margin-top: var(--space-7); background: var(--color-paper-deep); }
.about-preview__copy { display: flex; flex-direction: column; justify-content: center; padding: var(--space-6); }
.about-preview__copy h2 { margin: var(--space-5) 0 var(--space-4); }
.about-preview__copy > p:not(.eyebrow) { max-width: 40ch; color: var(--color-muted); }
.about-preview__media { overflow: hidden; }
.about-preview__media img { width: 100%; height: 100%; object-fit: cover; object-position: 10% center; filter: saturate(.6); }

.final-cta { display: grid; place-items: center; min-height: 82svh; padding: var(--space-7) 24px; text-align: center; }
.final-cta h2 { max-width: 13ch; margin: var(--space-4) auto var(--space-5); }
.final-cta > div { display: flex; align-items: center; gap: var(--space-4); }