:root{
  --concrete:#FFFFFF;
  --bone:#FAFAF9;
  --ink:#0A0A0A;
  --ink-soft:#5C5C5C;
  --steel:#0A0A0A;
  --steel-soft:#8A8A8A;
  --yellow:#0A0A0A;
  --yellow-deep:#0A0A0A;
  --rule:#DEDEDC;
  --rule-dark:#6E6E6E;
  --display: 'Big Shoulders Display', sans-serif;
  --body: 'Inter', sans-serif;
  --mono: 'IBM Plex Mono', monospace;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--body);
  background:var(--concrete);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit; text-decoration:none;}
img{display:block; max-width:100%;}
.wrap{max-width:1280px; margin:0 auto; padding:0 40px;}
.eyebrow{
  font-family:var(--mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ink-soft); font-weight:600;
}
.eyebrow.on-dark{color:#C9C9C9;}
.eyebrow.on-yellow{color:#3A3A3A;}
h1,h2,h3{font-family:var(--display); text-transform:uppercase; line-height:.92; letter-spacing:.005em;}
.btn{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  padding:15px 26px; border:1.5px solid var(--ink); cursor:pointer;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 100%);
  transition:transform .15s ease, background .15s ease;
  white-space:nowrap;
}
.btn:hover{transform:translate(-2px,-2px);}
.btn-primary{background:var(--ink); border-color:var(--ink); color:#FFFFFF;}
.btn-primary:hover{background:#2A2A2A; border-color:#2A2A2A;}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--ink);}
.btn-ghost:hover{background:var(--ink); color:#FFFFFF;}
.btn-ghost.on-dark{color:#FFFFFF; border-color:rgba(255,255,255,.45);}
.btn-ghost.on-dark:hover{background:#FFFFFF; color:var(--ink);}
.btn-sm{padding:11px 18px; font-size:10.5px;}
.btn.is-disabled{opacity:.55; cursor:default; pointer-events:none;}
.chip{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase;
  background:var(--ink); color:var(--bone); padding:6px 11px;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 100%);
  border:1px solid rgba(255,255,255,.15);
}
.chip.yellow{background:var(--ink); color:#FFFFFF;}

/* ---------- NAV ---------- */
nav{
  position:sticky; top:0; z-index:100; background:rgba(234,231,225,.92); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--rule);
}
.nav-inner{display:flex; align-items:center; justify-content:space-between; padding:18px 40px;}
.logo{font-family:var(--display); font-weight:800; font-size:22px; letter-spacing:.02em; display:flex; align-items:center; gap:10px;}
.logo .mark{width:12px; height:12px; flex-shrink:0; background-image:url('../images/brand/mark-nav.png'); background-size:cover; background-position:center;}
.nav-links{display:flex; align-items:center; gap:34px; font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase;}
.nav-links a:not(.btn){position:relative; padding-bottom:3px;}
.nav-links a:hover{text-decoration:underline; text-underline-offset:4px;}

.nav-toggle{
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:34px; height:34px; background:none; border:none; cursor:pointer; padding:6px;
  flex:none;
}
.nav-toggle span{display:block; width:100%; height:2px; background:var(--ink); transition:transform .25s ease, opacity .2s ease;}
.nav-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.is-open span:nth-child(2){opacity:0;}
.nav-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ---------- HERO ---------- */
.hero{position:relative; min-height:92vh; display:flex; align-items:flex-end; overflow:hidden; color:var(--ink);}
.hero img.bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(1.02);}
.hero::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.55) 55%, rgba(255,255,255,.92) 100%);
}
.hero-content{position:relative; z-index:2; padding:0 40px 64px; width:100%;}
.hero-badge{
  display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:11px; letter-spacing:.14em;
  text-transform:uppercase; border:1px solid rgba(10,10,10,.35); padding:7px 14px; margin-bottom:28px; color:var(--ink-soft);
}
.hero-badge::before{content:""; width:6px; height:6px; background:var(--ink); border-radius:50%;}
h1.hero-title{font-size:clamp(46px,7.4vw,108px); max-width:16ch; margin-bottom:22px;}
h1.hero-title em{font-style:normal; text-decoration:underline; text-decoration-thickness:3px; text-underline-offset:6px;}
.hero-sub{font-size:18px; line-height:1.55; max-width:44ch; color:var(--ink); margin-bottom:38px; font-weight:400;}
.hero-ctas{display:flex; gap:16px; flex-wrap:wrap; margin-bottom:56px;}

.dim-line{position:relative; max-width:560px; padding-top:14px; border-top:1px solid rgba(255,255,255,.55);}
.dim-line::before,.dim-line::after{
  content:""; position:absolute; top:0; width:1px; height:10px; background:rgba(255,255,255,.55);
}
.dim-line::before{left:0;} .dim-line::after{right:0;}
.dim-line .dim-label{
  display:flex; justify-content:space-between; font-family:var(--mono); font-size:11px; letter-spacing:.05em; color:#C9C9C9;
}
.dim-line .dim-label b{color:#FFFFFF; font-weight:600;}

/* ---------- STAT STRIP ---------- */
.stat-strip{background:var(--steel); color:var(--bone);}
.stat-grid{display:grid; grid-template-columns:repeat(3,1fr);}
.stat{padding:44px 40px; border-right:1px solid rgba(255,255,255,.12);}
.stat:last-child{border-right:none;}
.stat .num{font-family:var(--display); font-size:52px; color:#FFFFFF; line-height:1;}
.stat .label{font-family:var(--mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:#B5B5B5; margin-top:10px; line-height:1.4;}

/* ---------- SECTION HEADERS ---------- */
.section{padding:100px 0;}
.section-head{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:56px; gap:40px; flex-wrap:wrap;}
.section-head h2{font-size:clamp(34px,4.4vw,58px);}
.section-head p{max-width:38ch; color:var(--ink-soft); font-size:15px; line-height:1.6;}

/* ---------- COLLECTIONS GRID ---------- */
.collections{display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--rule); border:1px solid var(--rule);}
.collections.featured-row{grid-template-columns:1fr; margin-bottom:2px;}
.card{background:var(--bone); position:relative; display:flex; flex-direction:column; overflow:hidden;}
.card .img-wrap{position:relative; overflow:hidden; aspect-ratio:4/3; background:#ddd;}
.card.tall .img-wrap{aspect-ratio:16/10.5;}
.card img{width:100%; height:100%; object-fit:cover; transition:transform .5s cubic-bezier(.2,.8,.2,1);}
.card:hover img{transform:scale(1.06);}
.card .img-wrap::after{
  content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 55%, rgba(10,10,10,.72) 100%);
  opacity:0; transition:opacity .3s ease;
}
.card:hover .img-wrap::after{opacity:1;}
.card .tag{position:absolute; top:14px; left:14px; z-index:2;}
.card .price{position:absolute; top:14px; right:14px; z-index:2;}
.card .ribbon{
  position:absolute; top:20%; left:-16%; width:132%; z-index:3;
  transform:rotate(-38deg); transform-origin:center;
  background:var(--ink); color:#FFFFFF;
  font-family:var(--mono); font-size:12.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  text-align:center; padding:8px 0;
  box-shadow:0 2px 12px rgba(0,0,0,.3);
  pointer-events:none;
}
.card-hover-cta{
  position:absolute; bottom:16px; left:16px; right:16px; z-index:2;
  display:flex; justify-content:space-between; align-items:center;
  opacity:0; transform:translateY(8px); transition:all .3s ease;
}
.card:hover .card-hover-cta{opacity:1; transform:translateY(0);}
.card-hover-cta span{font-family:var(--mono); font-size:11px; color:var(--bone); letter-spacing:.05em;}
.card-body{padding:22px 22px 26px;}
.card-body h3{font-size:26px; margin-bottom:9px;}
.card-body p{font-size:13.5px; color:var(--ink-soft); line-height:1.55; margin-bottom:16px; min-height:40px;}
.card-body .row{display:flex; justify-content:space-between; align-items:center;}
.card-body .row .link{font-family:var(--mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; border-bottom:1.5px solid var(--yellow-deep); padding-bottom:2px;}
.card:hover .card-body .row .link{color:var(--yellow-deep);}

/* Touch devices have no real :hover — reveal the same info permanently
   rather than gate it behind an interaction that will never fire. */
@media (hover: none){
  .card-hover-cta{opacity:1; transform:translateY(0);}
  .card .img-wrap::after{opacity:1;}
}

/* ---------- INSTALLED PROOF ---------- */
.installed{background:var(--ink); color:var(--bone);}
.installed .section-head p{color:#B5B5B5;}
.installed-grid{display:grid; grid-template-columns:1.3fr 1fr; grid-auto-rows:clamp(380px, 38vw, 620px); gap:2px;}
.installed-grid > *{min-width:0;}
.install-card{position:relative;}
.install-card img{width:100%; height:100%; object-fit:cover;}
.install-card .overlay{
  position:absolute; inset:0; background:linear-gradient(180deg, transparent 40%, rgba(10,10,10,.88) 100%);
  display:flex; flex-direction:column; justify-content:flex-end; padding:28px;
}
.install-card .eyebrow{margin-bottom:8px;}
.install-card h3{font-size:28px; margin-bottom:8px; color:var(--bone);}
.install-card p{font-size:13.5px; color:#D2D2D2; max-width:36ch; line-height:1.55;}
.install-stat{font-family:var(--mono); font-size:11px; color:#FFFFFF; margin-top:12px; letter-spacing:.04em;}

/* ---------- COMMISSION FUNNEL ---------- */
.funnel{background:var(--bone); border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);}
.funnel-steps{display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin-bottom:48px;}
.funnel-step{padding:0 30px 0 0; position:relative;}
.funnel-step:not(:last-child)::after{
  content:"→"; position:absolute; right:-6px; top:6px; font-family:var(--mono); color:var(--rule-dark); font-size:18px;
}
.funnel-step .step-num{font-family:var(--mono); font-size:11px; color:var(--yellow-deep); margin-bottom:10px;}
.funnel-step h4{font-family:var(--body); font-weight:600; font-size:16px; margin-bottom:8px;}
.funnel-step p{font-size:13.5px; color:var(--ink-soft); line-height:1.5;}
.funnel-ctas{display:flex; gap:28px; flex-wrap:wrap;}
.funnel-option{display:flex; flex-direction:column; align-items:flex-start; gap:10px; max-width:250px;}
.funnel-option p{font-size:12.5px; color:var(--ink-soft); line-height:1.45;}

/* ---------- FOOTER ---------- */
footer{background:var(--steel); color:#B5B5B5; padding:64px 0 32px;}
.footer-top{display:flex; justify-content:space-between; flex-wrap:wrap; gap:40px; padding-bottom:44px; border-bottom:1px solid rgba(255,255,255,.12); margin-bottom:28px;}
.footer-top h3{color:var(--bone); font-size:30px; max-width:14ch; margin-bottom:20px;}
footer .cols{display:flex; gap:64px;}
footer .col h5{font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:#9A9A9A; margin-bottom:14px;}
footer .col a{display:block; font-size:13.5px; margin-bottom:9px; color:#D6D6D6;}
footer .col a:hover{color:#FFFFFF;}
.footer-bottom{display:flex; justify-content:space-between; font-family:var(--mono); font-size:11px; color:#8A8A8A; flex-wrap:wrap; gap:10px;}

/* ---------- GALLERY DETAIL PAGES ---------- */
.shop-bar{
  position:sticky; top:69px; z-index:90; background:var(--ink); color:var(--bone);
  display:flex; justify-content:space-between; align-items:center; padding:12px 40px;
  font-family:var(--mono); font-size:11.5px; letter-spacing:.03em;
}
.shop-bar b{color:#FFFFFF;}
.breadcrumb{font-family:var(--mono); font-size:11px; color:var(--ink-soft); padding:26px 0 0; letter-spacing:.04em;}
.breadcrumb a:hover{color:var(--yellow-deep);}
.gallery-hero{padding:18px 0 50px; display:grid; grid-template-columns:1.15fr .85fr; gap:60px; align-items:end;}
.gallery-hero > *{min-width:0;}
.gallery-hero h1{font-size:clamp(44px,6vw,84px); margin-bottom:20px;}
.gallery-hero p{font-size:16px; line-height:1.6; color:var(--ink-soft); max-width:48ch; margin-bottom:24px;}
.gallery-hero .meta{display:flex; gap:26px; font-family:var(--mono); font-size:11.5px; color:var(--ink-soft); flex-wrap:wrap;}
.gallery-hero .meta b{color:var(--ink); display:block; font-size:13px; margin-bottom:2px;}
.gallery-hero .hero-shot{aspect-ratio:4/3; overflow:hidden; border:1px solid var(--rule);}
.gallery-hero .hero-shot img{width:100%; height:100%; object-fit:cover;}
/* Individual piece pages show the real artwork, not a curated banner crop —
   let each image keep its own aspect ratio instead of forcing 4:3. */
.gallery-hero .hero-shot.piece-hero-shot{aspect-ratio:auto; height:auto;}
.gallery-hero .hero-shot.piece-hero-shot img{height:auto; object-fit:contain;}
.gallery-ctas{margin-top:28px; display:flex; gap:14px; flex-wrap:wrap;}

.scale-panel{background:var(--bone); border:1px solid var(--rule); padding:26px 28px; margin:6px auto 0; max-width:720px;}
.scale-panel .eyebrow{margin-bottom:14px;}

.about-series{background:var(--bone); border:1px solid var(--rule); margin-top:20px;}
.about-series summary{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:22px 28px; cursor:pointer; list-style:none;}
.about-series summary::-webkit-details-marker{display:none;}
.about-series summary .eyebrow{margin:0;}
.about-series .about-toggle{font-family:var(--mono); font-size:20px; line-height:1; color:var(--ink-soft); transition:transform .2s ease; flex:none;}
.about-series[open] .about-toggle{transform:rotate(45deg);}
.about-series p{font-size:14.5px; line-height:1.7; color:var(--ink-soft); padding:0 28px 26px; max-width:72ch;}

/* ---------- CASE STUDY (AS INSTALLED) PAGES ---------- */
.story-block{margin:44px 0; max-width:70ch;}
.story-block h2{font-size:clamp(26px,3.4vw,38px); margin-bottom:18px;}
.story-block p{font-size:15.5px; line-height:1.75; color:var(--ink-soft); margin-bottom:18px;}
.story-block blockquote{
  border-left:3px solid var(--ink); margin:30px 0; padding:2px 0 2px 22px;
  font-family:var(--display); font-size:clamp(19px,2.2vw,24px); line-height:1.35;
  text-transform:uppercase; letter-spacing:.005em;
}

.context-section{margin:44px 0;}
.context-section .eyebrow{margin-bottom:16px;}
.context-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--rule); border:1px solid var(--rule);}
.context-grid img{width:100%; height:100%; aspect-ratio:3/2; object-fit:cover; display:block;}
.context-grid.wide{grid-template-columns:1fr;}
.context-grid.wide img{aspect-ratio:16/5; object-fit:contain; background:var(--bone);}
/* For a header image shot specifically at a 2:1 ratio (not a wide letterbox
   panorama like St. Louis's elevation diagram, and not a standard gallery
   crop) — sized to the image's own shape so it fills edge to edge at any
   viewport width with no letterboxing and no cropping. aspect-ratio scales
   proportionally on its own, so this needs no extra breakpoints to behave
   correctly from mobile through desktop. */
.context-grid.wide.ratio-2-1 img{aspect-ratio:2/1; object-fit:cover;}

.diagram-stack{display:flex; flex-direction:column; gap:20px; margin:20px 0 0;}
.diagram-stack figure{background:var(--bone); border:1px solid var(--rule); padding:18px;}
.diagram-stack img{width:100%; height:auto; display:block;}
.diagram-stack figcaption{font-family:var(--mono); font-size:11px; color:var(--ink-soft); letter-spacing:.04em; margin-top:12px; text-transform:uppercase;}

@media(max-width:768px){
  .context-grid{grid-template-columns:1fr;}
  .context-grid img{aspect-ratio:3/2;}
}

.video-section{margin:44px 0;}
.video-section .eyebrow{margin-bottom:16px;}
.video-embed{position:relative; width:100%; aspect-ratio:16/9; background:var(--ink); border:1px solid var(--rule); overflow:hidden;}
.video-embed iframe{position:absolute; inset:0; width:100%; height:100%; border:0; display:block;}

/* ---------- CONTACT / INTAKE FORM ---------- */
.contact-panel{background:var(--bone); border:1px solid var(--rule); padding:36px; max-width:640px; margin:6px auto 0;}
.contact-panel .kicker{margin-bottom:10px;}
.contact-panel h2{font-size:clamp(24px,3vw,32px); margin-bottom:14px;}
.contact-panel .intro{font-size:14.5px; line-height:1.65; color:var(--ink-soft); margin-bottom:30px; max-width:56ch;}
.contact-field{margin-bottom:20px;}
.contact-field label{display:block; font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:8px;}
.contact-field input, .contact-field textarea, .contact-field select{
  width:100%; border:1.5px solid var(--ink); background:var(--concrete); color:var(--ink);
  font-family:var(--body); font-size:14.5px; padding:12px 13px; border-radius:0;
}
.contact-field textarea{min-height:110px; resize:vertical;}
.contact-field select{cursor:pointer;}
.contact-field input:focus, .contact-field textarea:focus, .contact-field select:focus{outline:2px solid var(--ink); outline-offset:1px;}
.contact-submit-row{display:flex; align-items:center; gap:16px; margin-top:8px; flex-wrap:wrap;}
.contact-status{font-family:var(--mono); font-size:12px; letter-spacing:.02em;}
.contact-status.ok{color:#3D6B4F;}
.contact-status.err{color:#8A3B2E;}
.contact-panel .btn[disabled]{opacity:.55; cursor:default; transform:none;}
.scale-svg{width:100%; height:auto; display:block;}

/* ---------- PANORAMIC GRID (full-width, uncropped, one per row) ---------- */
.pano-grid{display:flex; flex-direction:column; gap:2px; background:var(--rule); border:1px solid var(--rule);}
.pano-card{background:var(--bone);}
.pano-img-wrap{position:relative; overflow:hidden; background:#ddd;}
.pano-img-wrap img{width:100%; height:auto; display:block; transition:transform .5s cubic-bezier(.2,.8,.2,1);}
.pano-card .grid-card-trigger:hover .pano-img-wrap img{transform:scale(1.03);}
.pano-card .grid-card-body{display:flex; align-items:baseline; gap:14px; padding:16px 20px;}
.pano-card .grid-piece-num{margin-bottom:0;}

.piece-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:2px; background:var(--rule); border:1px solid var(--rule);}
.grid-card{background:var(--bone);}
.grid-card a{display:block;}
.grid-img-wrap{position:relative; aspect-ratio:1/1; overflow:hidden; background:#ddd;}
.grid-img-wrap img{width:100%; height:100%; object-fit:cover; transition:transform .5s cubic-bezier(.2,.8,.2,1);}
.grid-card a:hover .grid-img-wrap img{transform:scale(1.06);}
.grid-img-wrap::after{
  content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 60%, rgba(10,10,10,.65) 100%);
  opacity:0; transition:opacity .3s ease;
}
.grid-card a:hover .grid-img-wrap::after{opacity:1;}
.grid-card-body{padding:14px 16px 18px;}
.grid-piece-num{font-family:var(--mono); font-size:10.5px; letter-spacing:.05em; color:var(--ink-soft); display:block; margin-bottom:4px;}
.grid-piece-link{display:block; padding:8px 16px 12px; font-family:var(--mono); font-size:10px; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-soft); border-top:1px solid var(--rule);}
.grid-piece-link:hover{color:var(--ink); background:var(--bone);}
.pano-card .grid-piece-link{padding:6px 20px 12px;}
.grid-card-body h3{font-size:16px; text-transform:none; letter-spacing:0; line-height:1.25; font-family:var(--body); font-weight:600;}
.grid-card-trigger{display:block; width:100%; background:none; border:none; padding:0; margin:0; cursor:pointer; text-align:left; font:inherit; color:inherit;}

.gallery-shop-bar{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;
  padding:20px 0; border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);
  margin:32px 0;
}
.gallery-shop-bar .eyebrow{margin:0;}

/* ---------- LIGHTBOX ---------- */
.lightbox-overlay{
  position:fixed; inset:0; z-index:300;
  background:var(--ink);
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:opacity .25s ease;
  padding:24px;
}
.lightbox-overlay.is-open{opacity:1; visibility:visible;}
.lightbox-content{
  display:flex; flex-direction:column; align-items:center; gap:16px;
  width:100%; height:100%;
  max-width:96vw; max-height:94vh;
}
.lightbox-img-wrap{
  flex:1 1 0; min-height:0; width:100%;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; border:1px solid rgba(255,255,255,.15); background:#000;
}
.lightbox-img-wrap img{max-width:100%; max-height:100%; width:auto; height:auto; display:block; object-fit:contain; user-select:none; -webkit-user-drag:none;}
.lightbox-caption{flex:0 0 auto; text-align:center; color:#FFFFFF;}
.lightbox-caption .grid-piece-num{color:#B5B5B5;}
.lightbox-caption h3{font-family:var(--display); text-transform:uppercase; font-size:24px; letter-spacing:.01em; margin:4px 0 16px; color:#FFFFFF;}
.lightbox-cta.btn-primary{background:#FFFFFF; border-color:#FFFFFF; color:var(--ink);}
.lightbox-cta.btn-primary:hover{background:#E4E4E4; border-color:#E4E4E4;}
.lightbox-actions{display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:12px;}
.lightbox-share{font-family:inherit; cursor:pointer;}
.lightbox-share[hidden]{display:none;}
.lightbox-close{
  position:absolute; top:20px; right:24px; z-index:2;
  background:transparent; border:none; color:#FFFFFF; font-size:34px; line-height:1; cursor:pointer;
  width:44px; height:44px; display:flex; align-items:center; justify-content:center;
}
.lightbox-close:hover{color:#B5B5B5;}
.lightbox-nav{
  position:absolute; top:50%; transform:translateY(-50%); z-index:2;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.25); color:#FFFFFF;
  width:48px; height:48px; border-radius:50%; font-size:26px; cursor:pointer;
  display:flex; align-items:center; justify-content:center; transition:background .15s ease;
}
.lightbox-nav:hover{background:rgba(255,255,255,.18);}
.lightbox-prev{left:20px;}
.lightbox-next{right:20px;}

@media(max-width:980px){
  .wrap{padding:0 22px;}
  .nav-inner{padding:16px 22px;}
  .nav-toggle{display:flex;}
  .nav-links{
    flex-direction:column; align-items:stretch; gap:0;
    position:absolute; top:100%; left:0; right:0;
    background:var(--concrete); border-bottom:1px solid var(--rule);
    padding:8px 22px 24px;
    max-height:0; overflow:hidden; opacity:0;
    transition:max-height .3s ease, opacity .25s ease;
  }
  .nav-links.is-open{max-height:400px; opacity:1;}
  .nav-links a{width:100%; padding:16px 0; border-bottom:1px solid var(--rule); font-size:13px;}
  .nav-links .btn{margin-top:16px; justify-content:center; width:100%;}
  .hero-content{padding:0 22px 44px;}
  .stat-grid{grid-template-columns:1fr;}
  .stat{border-right:none; border-bottom:1px solid rgba(255,255,255,.12);}
  .stat:last-child{border-bottom:none;}
  .collections, .collections.featured-row{grid-template-columns:1fr;}
  .installed-grid{grid-template-columns:1fr; grid-auto-rows:auto;}
  .install-card{aspect-ratio:1/1;}
  .funnel-steps{grid-template-columns:1fr; gap:26px;}
  .funnel-step::after{display:none;}
  .footer-top{flex-direction:column;}
  footer .cols{gap:36px; flex-wrap:wrap;}
  .gallery-hero{grid-template-columns:1fr;}
  .gallery-hero .hero-shot{order:-1; margin-bottom:8px;}
  .piece-grid{grid-template-columns:repeat(2,1fr);}
  .shop-bar{padding:12px 22px;}
}
@media(max-width:560px){
  .piece-grid{grid-template-columns:1fr;}
  .lightbox-nav{width:44px; height:44px; font-size:22px;}
  .lightbox-prev{left:8px;}
  .lightbox-next{right:8px;}
  .lightbox-close{top:12px; right:12px;}
  .shop-bar{flex-direction:column; align-items:flex-start; gap:4px;}
}