:root { --black:#0b0b0b; --paper:#f2f0ea; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--black); font-family:"DM Sans",sans-serif; }
a { color:inherit; text-decoration:none; }
img { width:100%; display:block; }
.gallery-head { position:sticky; top:0; z-index:10; display:grid; grid-template-columns:1fr 1fr auto; align-items:center; gap:30px; height:82px; padding:0 clamp(20px,3vw,52px); background:rgba(242,240,234,.94); border-bottom:1px solid #0b0b0b; backdrop-filter:blur(12px); font-size:12px; text-transform:uppercase; letter-spacing:.1em; }
.gallery-brand { display:flex; gap:18px; align-items:center; font-weight:600; }
.gallery-brand span { color:#777; font-weight:400; }
.gallery-head p { margin:0; }
.gallery-count { font-family:"DM Mono",monospace; }
.gallery-intro { padding:clamp(80px,11vw,175px) clamp(20px,4vw,64px) clamp(70px,8vw,120px); display:grid; grid-template-columns:1.5fr .5fr; gap:50px; align-items:end; }
.eyebrow { grid-column:1/-1; margin:0 0 20px; font:500 11px "DM Mono",monospace; text-transform:uppercase; letter-spacing:.12em; }
.gallery-intro h1 { margin:0; font-size:clamp(60px,9vw,145px); line-height:.82; letter-spacing:-.075em; font-weight:500; }
.gallery-intro-copy { max-width:430px; }
.gallery-intro-copy p { margin:0; font-size:18px; line-height:1.45; }
.gallery-intro-copy .gallery-instruction { margin-top:20px; color:#5f5d58; font:400 12px/1.55 "DM Mono",monospace; text-transform:uppercase; letter-spacing:.045em; }
.concept-grid { border-top:1px solid #111; }
.concept-card { display:grid; grid-template-columns:80px 1fr; padding:clamp(24px,4vw,60px); border-bottom:1px solid #111; transition:background .35s,color .35s; }
.concept-number { font:400 13px "DM Mono",monospace; }
.concept-image { overflow:hidden; aspect-ratio:16/8.8; background:#ddd; }
.concept-image img { width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.2,.8,.2,1); }
.concept-card:hover .concept-image img { transform:scale(1.018); }
.concept-info { grid-column:2; display:flex; justify-content:space-between; align-items:end; gap:30px; padding-top:20px; }
.concept-info h2 { margin:0 0 3px; font-size:clamp(28px,4vw,56px); letter-spacing:-.05em; font-weight:500; }
.concept-info p,.concept-info span { margin:0; font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.concept-desert:hover { background:#cc4b15; color:#fff; }
.concept-chrome:hover { background:#dfe4e9; }
.concept-heritage:hover { background:#1a1917; color:#efe7d9; }
.concept-color:hover { background:#ffd400; }
.concept-night:hover { background:#050505; color:#fff; }
.gallery-footer { min-height:180px; padding:50px clamp(20px,4vw,64px); display:flex; justify-content:space-between; align-items:end; font:11px "DM Mono",monospace; text-transform:uppercase; border-top:1px solid #111; }
@media (max-width:760px) {
  .gallery-head { grid-template-columns:1fr auto; }
  .gallery-head>p:not(.gallery-count) { display:none; }
  .gallery-brand span { display:none; }
  .gallery-intro { grid-template-columns:1fr; }
  .eyebrow { grid-column:auto; }
  .gallery-intro h1 { font-size:clamp(54px,17vw,90px); }
  .concept-card { grid-template-columns:36px 1fr; padding:24px 16px; }
  .concept-image { aspect-ratio:4/3; }
  .concept-info { align-items:start; flex-direction:column; gap:12px; }
  .concept-info h2 { font-size:34px; }
  .gallery-footer { flex-direction:column; align-items:flex-start; gap:15px; }
}
