/* ============================================================
   ACOSORB ACOUSTIC SOLUTIONS PAGE — acosorb.v2.css
   Page-specific styles only.
   Tokens, reset, #pb, animations, .wrap, breadcrumb, sub-nav,
   .tag, .dh, .btn-p/.btn-g → common.css
============================================================ */


/* ── HERO ── */
#hero {
  min-height: 60svh;
  display: grid; grid-template-columns: 60% 40%;
  position: relative; overflow: hidden;
}
.hero-l {
  background: var(--navy-deep);
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: clamp(5rem, 10vw, 6rem) var(--pad) clamp(3.5rem, 5vw, 4rem);
  position: relative; z-index: 2;
}
.hero-l::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  background-size: 200px; opacity: .6; mix-blend-mode: overlay;
}

/* Exclusive badge */
.exclusive-badge {
  display: inline-flex; align-items: center; gap: .9rem;
  background: rgba(74,148,80,.15); border: 1px solid rgba(74,148,80,.4);
  border-radius: 2px; padding: .65rem 1.2rem; margin-bottom: 2rem;
  animation: hIn .6s var(--ease) 1.7s both;
}
.excl-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--green-lite); flex-shrink: 0;
  animation: pulse 2.5s ease-in-out infinite;
}
@keyframes pulse { 0%,100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.5); opacity: .6; } }
.exclusive-badge span { font-family: var(--mono); font-size: .62rem; letter-spacing: .18em; text-transform: uppercase; color: var(--green-lite); }

.hero-h1 {
  font-family: var(--serif);
  font-size: clamp(3.5rem, 7vw, 8rem);
  font-weight: 300; line-height: .9; letter-spacing: -.01em; color: var(--white);
  animation: hIn 1s var(--ease) 1.8s both;
}
.hero-h1 em { font-style: italic; color: rgba(255,255,255,.28); }
.hero-rule  { width: 0; height: 1px; background: var(--green-lite); margin: 2rem 0; animation: ruleW 1s var(--ease) 2.1s forwards; }
@keyframes ruleW { to { width: 44px; } }
.hero-sub   { font-size: clamp(.95rem, 1.4vw, 1.1rem); color: rgba(255,255,255,.52); line-height: 1.82; max-width: 40ch; animation: hIn .8s var(--ease) 2.25s both; }
.hero-btns  { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2.5rem; animation: hIn .8s var(--ease) 2.45s both; }

.hero-stats { display: flex; gap: 2.5rem; margin-top: 3rem; padding-top: 2.5rem; border-top: 1px solid rgba(255,255,255,.08); animation: hIn .8s var(--ease) 2.65s both; }
.hstat-n    { font-family: var(--serif); font-size: 2.4rem; font-weight: 300; color: var(--green-lite); line-height: 1; }
.hstat-l    { font-family: var(--mono); font-size: .56rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.35); margin-top: .25rem; }

@keyframes hIn { from { opacity: 0; transform: translate3d(0, 32px, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }

.hero-r     { position: relative; overflow: hidden; }
.hero-r img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); animation: zoomOut 12s var(--ease) forwards; }
@keyframes zoomOut { to { transform: scale(1.0); } }
.hero-r::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(6,15,28,.45) 0%, transparent 45%); pointer-events: none; }
.hero-wipe { position: absolute; inset: 0; z-index: 5; background: var(--navy-deep); animation: wipeUp 1.1s var(--ease) 1.5s forwards; }
@keyframes wipeUp { to { transform: translate3d(0, -100%, 0); } }

.nrc-float { position: absolute; bottom: 3rem; right: 3rem; z-index: 10; background: var(--green); padding: 1.6rem 2rem; border-radius: 3px; box-shadow: 0 22px 65px rgba(30,70,32,.6); text-align: center; animation: hIn .7s var(--ease) 2.9s both; }
.nrc-big   { font-family: var(--serif); font-size: 3.8rem; font-weight: 300; color: var(--white); line-height: 1; }
.nrc-sml   { font-family: var(--mono); font-size: .56rem; letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.65); margin-top: .3rem; }

.partner-bar { background: rgba(255,255,255,.04); border-top: 1px solid rgba(255,255,255,.07); padding: 1.25rem 0; }
.partner-bar .wrap { display: flex; align-items: center; gap: 2rem; flex-wrap: wrap; justify-content: space-evenly; }
.pb-label  { font-family: var(--mono); font-size: .58rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(255,255,255,.3); flex-shrink: 0; }
.pb-logos  { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.pb-pill   { font-family: var(--mono); font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.5); background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); padding: .4rem 1rem; border-radius: 50px; }


/* ── WHAT IS ACOSORB ── */
#what-is  { padding: var(--sec) 0; background: var(--cream); }
.wia-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5.5rem; align-items: center; }
.wia-lead { font-size: 1.1rem; color: rgba(11,31,56,.72); line-height: 1.85; margin: 1.75rem 0; }
.wia-p    { font-size: .92rem; color: var(--grey); line-height: 1.9; margin-bottom: 1.25rem; }
.wia-checks    { list-style: none; display: flex; flex-direction: column; gap: .75rem; margin: 1.75rem 0 2.5rem; }
.wia-checks li { display: flex; align-items: center; gap: .9rem; font-size: .92rem; color: rgba(11,31,56,.7); }
.wia-checks li svg { flex-shrink: 0; width: 20px; height: 20px; }

.certs-row { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.5rem; }
.cert      { font-family: var(--mono); font-size: .58rem; letter-spacing: .1em; text-transform: uppercase; padding: .4rem .9rem; border-radius: 50px; border: 1px solid rgba(11,31,56,.2); color: var(--navy); display: inline-flex; align-items: center; gap: .4rem; }
.cert::before { content: '✓'; color: var(--green); font-weight: 700; }

.wia-visual { position: relative; }
.wia-main   { width: 100%; aspect-ratio: 4/5; object-fit: cover; border-radius: 3px; }
.wia-float  {
  position: absolute; bottom: -2.5rem; right: -2.5rem;
  width: 50%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: 3px; border: 5px solid var(--cream);
  box-shadow: 0 24px 68px rgba(0,0,0,.22);
  transition: transform .8s var(--ease);
}
.wia-visual:hover .wia-float { transform: translate(-6px, -6px); }
.wia-badge     { position: absolute; top: 2rem; left: -2rem; background: var(--navy); color: var(--white); padding: 1.4rem 1.7rem; border-radius: 3px; box-shadow: 0 18px 52px rgba(6,15,28,.45); }
.wia-badge-big { font-family: var(--serif); font-size: 2.6rem; font-weight: 300; color: var(--green-lite); line-height: 1; }
.wia-badge-sml { font-family: var(--mono); font-size: .54rem; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.5); margin-top: .3rem; }


/* ── HOW IT WORKS ── */
#how-it-works { padding: var(--sec) 0; background: var(--navy); }
.process-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 1px; background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 3px; overflow: hidden; margin-top: 3rem;
}
.proc-step       { background: var(--navy); padding: 1.5rem 2rem; position: relative; transition: background .3s; }
.proc-step:hover { background: rgba(255,255,255,.04); }
.proc-n          { font-family: var(--serif); font-size: 5rem; font-weight: 300; color: rgba(255,255,255,.05); line-height: 1; margin-bottom: 1.5rem; transition: color .3s; }
.proc-step:hover .proc-n { color: rgba(74,148,80,.15); }
.proc-icon { font-size: 1.6rem; margin-bottom: 1rem; }
.proc-t    { font-family: var(--serif); font-size: 1.3rem; font-weight: 400; color: var(--white); margin-bottom: .6rem; }
.proc-d    { font-size: .87rem; color: rgba(255,255,255,.42); line-height: 1.8; }
.proc-step::after { content: '→'; position: absolute; top: 50%; right: -1px; transform: translateY(-50%); font-size: 1rem; color: rgba(255,255,255,.12); z-index: 2; }
.proc-step:last-child::after { display: none; }


/* ── PRODUCTS SHOWCASE ── */
#products { padding: var(--sec) 0; background: var(--navy-deep); }
.prod-hd   { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 2rem; margin-bottom: 3rem; }
.prod-tabs { display: flex; gap: 0; border-bottom: 1px solid rgba(255,255,255,.1); margin-bottom: 3rem; }
.prod-tab  { font-family: var(--mono); font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.4); padding: .85rem 1.8rem; border-bottom: 2px solid transparent; background: none; border-top: none; border-left: none; border-right: none; cursor: pointer; transition: all .25s; white-space: nowrap; }
.prod-tab:hover { color: rgba(255,255,255,.75); }
.prod-tab.on    { color: var(--green-lite); border-bottom-color: var(--green-lite); }
.prod-panel     { display: none; }
.prod-panel.on  { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }

.pp-img  { width: 100%; aspect-ratio: 3/3; object-fit: cover; border-radius: 3px; }
.pp-copy .dh    { color: var(--white); font-size: clamp(2rem, 4vw, 3.5rem); }
.pp-copy .dh em { color: rgba(255,255,255,.22); }
.pp-lead { font-size: 1rem; color: rgba(255,255,255,.55); line-height: 1.85; margin: 1.5rem 0; }
.pp-specs  { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; margin: 1.5rem 0; }
.pp-spec   { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.07); border-radius: 2px; padding: 1rem; }
.pp-spec-l { font-family: var(--mono); font-size: .56rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.35); margin-bottom: .3rem; }
.pp-spec-v { font-family: var(--serif); font-size: 1.2rem; font-weight: 300; color: var(--white); }

.swatch-row { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.25rem 0; }
.sw         { width: 32px; height: 32px; border-radius: 50%; border: 2px solid rgba(255,255,255,.15); cursor: pointer; transition: transform .2s, border-color .2s; }
.sw:hover   { transform: scale(1.15); border-color: rgba(255,255,255,.5); }
.sw-white  { background: #f5f5f3; } .sw-grey1  { background: #9fa4ab; }
.sw-grey2  { background: #7a8087; } .sw-grey3  { background: #6b6f75; }
.sw-black  { background: #2a2a2a; } .sw-blue   { background: #3d5a7a; }
.sw-olive  { background: #5a6632; } .sw-terra  { background: #8b4e38; }


/* ── SECTORS ── */
#sectors    { padding: var(--sec) 0; background: var(--cream); }
.sector-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; margin-top: 3rem; }
.sector-card { position: relative; overflow: hidden; border-radius: 3px; aspect-ratio: 3/4; cursor: pointer; }
.sector-card img       { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease); }
.sector-card:hover img { transform: scale(1.08); }
.sc-ov   { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 30%, rgba(6,15,28,.92) 100%); display: flex; flex-direction: column; justify-content: flex-end; padding: 1.6rem; }
.sc-num  { font-family: var(--mono); font-size: .55rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(255,255,255,.35); margin-bottom: .25rem; }
.sc-name { font-family: var(--serif); font-size: 1.5rem; font-weight: 300; color: var(--white); line-height: 1.1; margin-bottom: .5rem; }
.sc-desc { font-size: .82rem; color: rgba(255,255,255,.5); line-height: 1.65; max-height: 0; overflow: hidden; transition: max-height .5s var(--ease); }
.sector-card:hover .sc-desc { max-height: 80px; }
.sc-cta  { font-family: var(--mono); font-size: .58rem; letter-spacing: .12em; text-transform: uppercase; color: var(--green-lite); display: inline-flex; align-items: center; gap: .4rem; margin-top: .75rem; opacity: 0; transform: translateY(8px); transition: opacity .35s var(--ease), transform .35s var(--ease); }
.sector-card:hover .sc-cta { opacity: 1; transform: translateY(0); }


/* ── COMPARISON TABLE ── */
#compare    { padding: var(--sec) 0; background: var(--navy-mid); }
.cmp-intro  { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: end; margin-bottom: 1rem; }
.cmp-sub    { font-size: .95rem; color: rgba(255,255,255,.45); line-height: 1.85; margin-top: 1rem; }
.cmp-table  { width: 100%; border-collapse: collapse; border-radius: 4px; overflow: hidden; }
.cmp-table th    { font-family: var(--mono); font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; padding: 1.1rem 1.5rem; text-align: left; background: rgba(255,255,255,.06); color: rgba(255,255,255,.4); }
.cmp-table th.hl { background: rgba(74,148,80,.22); color: var(--green-lite); }
.cmp-table td    { padding: 1.1rem 1.5rem; font-size: .88rem; color: rgba(255,255,255,.55); border-bottom: 1px solid rgba(255,255,255,.05); }
.cmp-table td.hl { background: rgba(74,148,80,.08); color: var(--white); font-weight: 500; }
.cmp-table tr:last-child td    { border-bottom: none; }
.ck  { color: var(--green-lite); font-size: 1.1rem; }
.cx  { color: rgba(255,255,255,.18); font-size: 1.1rem; }
.cmp-table tr:hover td    { background: rgba(255,255,255,.02); }
.cmp-table tr:hover td.hl { background: rgba(74,148,80,.12); }


/* ── PROJECT GALLERY ── */
#gallery  { padding: var(--sec) 0; background: var(--navy-deep); }
.gal-hd   { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 2rem; margin-bottom: 2.5rem; }
.gal-bento { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: 260px 200px 240px; gap: 6px; }
.g-cell:nth-child(1) { grid-column: 1/3; grid-row: 1; }
.g-cell:nth-child(2) { grid-column: 3;   grid-row: 1; }
.g-cell:nth-child(3) { grid-column: 4;   grid-row: 1; }
.g-cell:nth-child(4) { grid-column: 1;   grid-row: 2; }
.g-cell:nth-child(5) { grid-column: 2/4; grid-row: 2; }
.g-cell:nth-child(6) { grid-column: 4;   grid-row: 2; }
.g-cell:nth-child(7) { grid-column: 1/3; grid-row: 3; }
.g-cell:nth-child(8) { grid-column: 3;   grid-row: 3; }
.g-cell:nth-child(9) { grid-column: 4;   grid-row: 3; }
.g-cell      { position: relative; overflow: hidden; border-radius: 2px; cursor: zoom-in; }
.g-cell img  { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease); }
.g-cell:hover img { transform: scale(1.08); }
.g-ov        { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(6,15,28,.9) 100%); opacity: 0; transition: opacity .4s; display: flex; align-items: flex-end; padding: 1.1rem; }
.g-cell:hover .g-ov { opacity: 1; }
.g-lbl       { font-family: var(--mono); font-size: .6rem; letter-spacing: .1em; text-transform: uppercase; color: var(--white); transform: translate3d(0, 8px, 0); transition: transform .4s var(--ease); }
.g-cell:hover .g-lbl { transform: translate3d(0, 0, 0); }

/* Lightbox */
#lb { position: fixed; inset: 0; z-index: 5000; background: rgba(6,15,28,.97); display: flex; align-items: center; justify-content: center; opacity: 0; pointer-events: none; transition: opacity .4s var(--ease); }
#lb.open     { opacity: 1; pointer-events: all; }
#lb img      { max-width: 90vw; max-height: 90vh; object-fit: contain; transform: scale(.92); transition: transform .4s var(--ease); }
#lb.open img { transform: scale(1); }
.lb-x  { position: absolute; top: 2rem; right: 2rem; background: none; border: 1px solid rgba(255,255,255,.2); color: var(--white); width: 44px; height: 44px; border-radius: 50%; font-size: 1.1rem; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .2s; }
.lb-x:hover { background: rgba(255,255,255,.1); }
.lb-nav { position: absolute; top: 50%; transform: translateY(-50%); background: none; border: 1px solid rgba(255,255,255,.2); color: var(--white); width: 52px; height: 52px; border-radius: 50%; font-size: 1.3rem; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .2s; }
.lb-nav:hover { background: rgba(255,255,255,.1); }
.lb-prev { left: 2rem; } .lb-next { right: 2rem; }


/* ── WHY US (exclusive installer) ── */
#why-us { padding: var(--sec) 0; background: var(--green); position: relative; overflow: hidden; }
#why-us::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px); background-size: 28px 28px; pointer-events: none; }
.why-2c      { display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; align-items: center; position: relative; z-index: 1; }
.why-copy .dh    { color: var(--white); }
.why-copy .dh em { color: rgba(255,255,255,.35); }
.why-lead    { font-size: 1.05rem; color: rgba(255,255,255,.72); line-height: 1.85; margin: 1.75rem 0 2.5rem; }
.why-reasons { display: flex; flex-direction: column; gap: 1.25rem; }
.wr       { display: flex; gap: 1.5rem; align-items: flex-start; }
.wr-icon  { width: 44px; height: 44px; border-radius: 50%; background: rgba(255,255,255,.15); display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 1.1rem; }
.wr-t     { font-family: var(--serif); font-size: 1.15rem; font-weight: 400; color: var(--white); margin-bottom: .3rem; }
.wr-d     { font-size: .88rem; color: rgba(255,255,255,.62); line-height: 1.75; }
.why-img  { position: relative; }
.why-img img { width: 100%; aspect-ratio: 4/5; object-fit: cover; border-radius: 3px; box-shadow: 0 40px 100px rgba(0,0,0,.4); }


/* ── PERFORMANCE STATS ── */
.perf-strip { background: var(--navy); display: grid; grid-template-columns: repeat(5, 1fr); border-top: 1px solid rgba(255,255,255,.07); }
.ps          { padding: 2.2rem var(--pad); border-right: 1px solid rgba(255,255,255,.06); transition: background .3s; }
.ps:last-child { border-right: none; }
.ps:hover    { background: rgba(255,255,255,.03); }
.ps-n        { font-family: var(--serif); font-size: 2.8rem; font-weight: 300; color: var(--green-lite); line-height: 1; }
.ps-l        { font-family: var(--mono); font-size: .58rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.35); margin-top: .4rem; }


/* ── FAQ ── */
#faq      { padding: var(--sec) 0; background: var(--navy-deep); }
.faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 5rem; margin-top: 3rem; }
.faq-item { border-bottom: 1px solid rgba(255,255,255,.08); }
.faq-btn  { width: 100%; background: none; border: none; text-align: left; padding: 1.5rem 0; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.faq-btn span { font-family: var(--serif); font-size: 1.15rem; font-weight: 300; color: rgba(255,255,255,.7); line-height: 1.35; transition: color .25s; }
.faq-item.open .faq-btn span { color: var(--white); }
.faq-ico  { flex-shrink: 0; width: 24px; height: 24px; border-radius: 50%; border: 1px solid rgba(255,255,255,.2); display: flex; align-items: center; justify-content: center; transition: all .35s var(--ease); }
.faq-ico svg { stroke: rgba(255,255,255,.4); fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; transition: transform .35s var(--ease), stroke .25s; }
.faq-item.open .faq-ico     { background: var(--green); border-color: var(--green); }
.faq-item.open .faq-ico svg { transform: rotate(45deg); stroke: var(--white); }
.faq-ans      { max-height: 0; overflow: hidden; transition: max-height .6s var(--ease), padding .4s; }
.faq-ans.open { max-height: 280px; padding-bottom: 1.5rem; }
.faq-ans p    { font-size: .9rem; color: rgba(255,255,255,.42); line-height: 1.85; }
.faq-ans a    { color: var(--green-lite); }


/* ── CTA BAND ── */
#cta { padding: 7rem 0; background: var(--navy); text-align: center; position: relative; overflow: hidden; }
#cta::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(rgba(255,255,255,.04) 1px, transparent 1px); background-size: 24px 24px; pointer-events: none; }
.cta-in   { position: relative; z-index: 1; }
.cta-in .dh { font-size: clamp(2.5rem, 5vw, 4.5rem); }
.cta-in p { font-size: 1rem; color: rgba(255,255,255,.55); max-width: 48ch; margin: 1.5rem auto 2.5rem; line-height: 1.8; }
.cta-btns { display: flex; justify-content: center; flex-wrap: wrap; gap: 1rem; }


/* ── FOOTER (acosorb page minimal) ── */
#footer      { background: var(--navy-deep); border-top: 1px solid rgba(255,255,255,.06); padding: 3rem 0; }
.foot-in     { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1.5rem; }
.foot-logo-n { font-family: var(--serif); font-size: 1.3rem; letter-spacing: .06em; }
.foot-logo-t { font-family: var(--mono); font-size: .5rem; letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.3); display: block; margin-top: 2px; }
.foot-links  { display: flex; gap: 2rem; flex-wrap: wrap; }
.foot-links a { font-family: var(--mono); font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.38); transition: color .2s; }
.foot-links a:hover { color: var(--white); }
.foot-copy   { font-family: var(--mono); font-size: .58rem; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.2); }


/* ── RESPONSIVE ── */
@media (max-width: 1024px) {
  #hero             { grid-template-columns: 1fr; }
  .hero-r           { display: none; }
  .hero-l           { min-height: 60svh; background: linear-gradient(170deg, var(--navy-deep) 40%, rgba(30,70,32,.35)), url('https://acosorb-strapicms-uploads.b-cdn.net/morgan_170_af45147877.jpg') center/cover no-repeat; }
  .wia-grid         { grid-template-columns: 1fr; gap: 3rem; }
  .wia-visual       { max-width: 500px; }
  .process-grid     { grid-template-columns: 1fr 1fr; }
  .prod-panel.on    { grid-template-columns: 1fr; }
  .sector-grid      { grid-template-columns: 1fr 1fr; }
  .cmp-intro        { grid-template-columns: 1fr; }
  .gal-bento        { grid-template-columns: 1fr 1fr; grid-template-rows: 220px 220px 220px 220px; }
  .g-cell:nth-child(1) { grid-column: 1/3; grid-row: 1; }
  .g-cell:nth-child(2) { grid-column: 1;   grid-row: 2; }
  .g-cell:nth-child(3) { grid-column: 2;   grid-row: 2; }
  .g-cell:nth-child(4) { grid-column: 1;   grid-row: 3; }
  .g-cell:nth-child(5) { grid-column: 2;   grid-row: 3; }
  .g-cell:nth-child(6) { grid-column: 1;   grid-row: 4; }
  .g-cell:nth-child(7) { grid-column: 2;   grid-row: 4; }
  .g-cell:nth-child(8), .g-cell:nth-child(9) { display: none; }
  .why-2c           { grid-template-columns: 1fr; gap: 3rem; }
  .perf-strip       { grid-template-columns: repeat(3, 1fr); }
  .faq-grid         { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  /* hdr-nav + ham → common.css */
  .process-grid  { grid-template-columns: 1fr; }
  .prod-tabs     { overflow-x: auto; scrollbar-width: none; }
  .sector-grid   { grid-template-columns: 1fr 1fr; gap: .75rem; }
  .perf-strip    { grid-template-columns: 1fr 1fr; }
  .cmp-table     { font-size: .8rem; }
  .cmp-table th, .cmp-table td { padding: .75rem 1rem; }
  .lb-nav        { display: none; }
}