/* Lumivue Display Systems - holographic / rail / transparent showcase site */
:root{
  --navy:#0b2545; --navy-2:#123761; --steel:#41627c; --accent:#0d8ba6;
  --accent-d:#0a6f86; --bg:#f6f8fb; --card:#fff; --text:#1c2b3a;
  --muted:#5f7285; --line:#dce5ed; --soft:#eaf1f7; --ok:#167a68;
  --shadow:0 2px 14px rgba(16,42,70,.07); --radius:10px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);
  font:16px/1.7 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased}
a{color:var(--navy-2);text-decoration:none}
a:hover{color:var(--accent)}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{line-height:1.25;color:var(--navy);letter-spacing:-.01em;margin:0 0 .6em}
h1{font-size:2.25rem} h2{font-size:1.55rem;margin-top:2.1rem} h3{font-size:1.16rem}
p{margin:0 0 1.05rem}
ul,ol{margin:0 0 1.2rem;padding-left:1.3rem} li{margin:.35rem 0}
strong{color:var(--navy)}
.wrap{width:min(1180px,92vw);margin:0 auto}
.section{padding:56px 0}
.section.alt{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.75rem;font-weight:700;color:var(--accent);margin-bottom:.7rem}
.lead{font-size:1.12rem;color:var(--muted);max-width:820px}

/* header */
.topbar{background:var(--navy);color:#cddced;font-size:.82rem}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;min-height:34px;gap:1rem}
.topbar a{color:#cddced}
.site-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 1px 8px rgba(10,35,65,.05)}
.nav{display:flex;align-items:center;gap:1.4rem;min-height:70px}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:800;font-size:1.32rem;color:var(--navy);letter-spacing:-.02em;white-space:nowrap}
.brand-mark{width:30px;height:30px;border-radius:7px;background:linear-gradient(135deg,var(--accent),#4bc6d8);display:grid;place-items:center;color:#fff;font-size:1rem;font-weight:900}
.brand small{display:block;font-size:.6rem;font-weight:600;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;line-height:1}
.nav-links{display:flex;align-items:center;gap:.15rem;margin-left:auto;list-style:none;padding:0;margin:0}
.nav-links>li{position:relative}
.nav-links>li>a{display:block;padding:.55rem .8rem;font-weight:600;font-size:.93rem;color:var(--text);border-radius:6px}
.nav-links>li>a:hover{background:var(--soft);color:var(--navy-2)}
.dropdown{display:none;position:absolute;top:100%;left:0;min-width:530px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 14px 40px rgba(11,37,69,.15);padding:1rem;grid-template-columns:repeat(3,1fr);gap:1rem}
.nav-links>li:hover .dropdown{display:grid}
.dropdown h4{font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:var(--accent);margin:0 0 .5rem}
.dropdown a{display:block;padding:.28rem .3rem;font-size:.86rem;color:var(--muted);border-radius:4px}
.dropdown a:hover{background:var(--soft);color:var(--navy)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.72rem 1.35rem;border-radius:6px;font-weight:700;font-size:.92rem;border:1px solid transparent;cursor:pointer;transition:.18s}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-d);color:#fff}
.btn-outline{border-color:var(--line);background:#fff;color:var(--navy)}
.btn-outline:hover{border-color:var(--accent);color:var(--accent)}
.btn-sm{padding:.5rem 1rem;font-size:.85rem}
.nav-toggle{display:none;background:none;border:1px solid var(--line);border-radius:6px;padding:.4rem .6rem;font-size:1.1rem;color:var(--navy);cursor:pointer}

/* hero */
.hero{background:linear-gradient(120deg,#0b2545 0%,#123761 62%,#1a4a78 100%);color:#fff;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:44px 44px;pointer-events:none}
.hero .wrap{position:relative;z-index:1;padding:76px 0 72px}
.hero h1{color:#fff;font-size:2.9rem;max-width:820px;line-height:1.15}
.hero .lead{color:#c9dbea;font-size:1.16rem}
.hero .eyebrow{color:#ffb08e}
.hero-actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.7rem}
.hero .btn-outline{background:transparent;border-color:rgba(255,255,255,.4);color:#fff}
.hero .btn-outline:hover{border-color:#fff;color:#fff}
.hero-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.13);margin-top:3.2rem;border-radius:8px;overflow:hidden}
.hero-stats div{background:rgba(11,37,69,.55);padding:1.15rem;text-align:center}
.hero-stats b{display:block;font-size:1.35rem;color:#fff}
.hero-stats span{font-size:.78rem;color:#b9cfe2;letter-spacing:.03em}

/* cards / grids */
.grid{display:grid;gap:1.15rem}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem;box-shadow:var(--shadow);transition:.2s}
.card:hover{transform:translateY(-3px);border-color:#b9d0e3;box-shadow:0 8px 26px rgba(11,37,69,.11)}
.card h3{font-size:1.05rem;margin-bottom:.45rem}
.card h3 a{color:var(--navy)}
.card p{font-size:.9rem;color:var(--muted);margin:0}
.cat-card .ico{width:42px;height:42px;border-radius:9px;background:var(--soft);display:grid;place-items:center;color:var(--navy-2);font-weight:800;font-size:1.1rem;margin-bottom:.9rem}
.product-card{display:flex;flex-direction:column;padding:0;overflow:hidden}
.product-card .thumb{background:#fff;border-bottom:1px solid var(--line);aspect-ratio:4/3;display:grid;place-items:center;padding:1rem}
.product-card .thumb img{max-height:100%;width:auto;object-fit:contain}
.product-card .body{padding:1.05rem 1.2rem 1.25rem}
.product-card h3{font-size:.98rem;line-height:1.35}
.product-card .meta{font-size:.78rem;color:var(--muted);margin:.3rem 0 .8rem}
.product-card .price-line{border-top:1px solid var(--line);padding-top:.7rem;font-size:.82rem;color:var(--navy-2);font-weight:600;display:flex;justify-content:space-between;align-items:center}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:1.8rem;flex-wrap:wrap}
.section-head h2{margin:0}
.section-head p{margin:.35rem 0 0;color:var(--muted);font-size:.95rem}
.text-link{font-weight:700;font-size:.9rem}

/* breadcrumbs + article */
.breadcrumb{font-size:.82rem;color:var(--muted);padding:1.1rem 0;border-bottom:1px solid var(--line);margin-bottom:2rem}
.breadcrumb a{color:var(--muted)} .breadcrumb a:hover{color:var(--accent)}
.breadcrumb span{margin:0 .4rem;color:#a9bccb}
.page-head{padding:34px 0 8px}
.page-head h1{font-size:2.3rem}
.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:2rem;align-items:start;padding:26px 0 60px}
/* v14: the main column must fill its grid track. The old 68ch cap left a
   ~260px dead strip between the article and the sticky sidebar on desktop. */
.article{max-width:none}
.article h2{border-bottom:1px solid var(--line);padding-bottom:.45rem}
.side{position:sticky;top:95px}
.side-box{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem;margin-bottom:1.1rem}
.side-box h3{font-size:.98rem;margin-bottom:.7rem}
.side-box ul{list-style:none;padding:0;margin:0;font-size:.88rem}
.side-box li{padding:.32rem 0;border-bottom:1px dashed var(--line)}
.side-box li:last-child{border:0}
.cta-box{background:var(--navy);color:#fff;border:0}
.cta-box h3{color:#fff}
.cta-box p{color:#c9dbea;font-size:.87rem}
.cta-box .btn{width:100%}

/* tables */
.table-wrap{overflow-x:auto;margin:1.2rem 0 1.8rem;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
table{width:100%;border-collapse:collapse;font-size:.9rem}
th,td{padding:.72rem 1rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
th{background:var(--soft);color:var(--navy);font-weight:700;width:34%}
tr:last-child td{border-bottom:0}

/* feature list */
.check-list{list-style:none;padding:0;margin:1rem 0 1.6rem}
.check-list li{position:relative;padding-left:1.6rem;margin:.55rem 0}
.check-list li:before{content:"";position:absolute;left:0;top:.55em;width:.62rem;height:.62rem;border-radius:50%;background:var(--accent)}
.note{background:var(--soft);border-left:4px solid var(--navy-2);padding:1rem 1.2rem;border-radius:0 8px 8px 0;margin:1.4rem 0;font-size:.93rem;color:var(--muted)}

/* product detail */
.pd{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:2rem;align-items:start;margin:1.6rem 0 2.4rem}
.pd-img{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem;display:grid;place-items:center;aspect-ratio:4/3;min-height:0}
.pd-img img{max-height:340px;object-fit:contain}
.pd-gallery{display:flex;gap:.6rem;margin-top:.8rem}
.pd-gallery img{width:76px;height:76px;object-fit:contain;border:1px solid var(--line);border-radius:6px;background:#fff;padding:.3rem}
.pd-summary h1{font-size:2rem}
.tag{display:inline-block;background:var(--soft);color:var(--navy-2);border-radius:20px;padding:.2rem .7rem;font-size:.75rem;font-weight:700;margin:0 .35rem .5rem 0}

/* faq */
.faq-item{border:1px solid var(--line);border-radius:8px;background:#fff;margin-bottom:.7rem;padding:1rem 1.2rem}
.faq-item h3{font-size:1rem;margin:0 0 .45rem}
.faq-item p{margin:0;font-size:.92rem;color:var(--muted)}

/* form */
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
label{display:block;font-size:.85rem;font-weight:700;margin-bottom:.35rem;color:var(--navy)}
input,select,textarea{width:100%;padding:.7rem .85rem;border:1px solid var(--line);border-radius:6px;font:inherit;font-size:.92rem;background:#fff;color:var(--text)}
textarea{min-height:120px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid #b9d0e3;border-color:var(--navy-2)}
.full{grid-column:1/-1}

/* footer */
.site-footer{background:#081d34;color:#b8cadd;padding:52px 0 22px;margin-top:20px}
.site-footer .grid-4{gap:2rem}
.site-footer h4{color:#fff;font-size:.92rem;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.9rem}
.site-footer ul{list-style:none;padding:0;margin:0;font-size:.88rem}
.site-footer li{margin:.42rem 0}
.site-footer a{color:#b8cadd} .site-footer a:hover{color:#ffb08e}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:2.6rem;padding-top:1.2rem;font-size:.8rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}

@media(max-width:1000px){
  .article-layout{grid-template-columns:1fr}.side{position:static;display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
  .grid-4{grid-template-columns:repeat(2,1fr)}.hero-stats{grid-template-columns:repeat(2,1fr)}
  .dropdown{min-width:460px;grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  .nav-toggle{display:block;margin-left:auto}
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;padding:.6rem 1rem 1.2rem;box-shadow:0 12px 24px rgba(11,37,69,.12)}
  .nav-links.open{display:flex}
  .dropdown{position:static;display:none;min-width:0;grid-template-columns:1fr;box-shadow:none;border:0;padding:.2rem 0 .6rem}
  .nav-links>li:hover .dropdown{display:block}
  .nav .btn-primary{display:none}
  .grid-2,.grid-3,.grid-4,.pd,.form-grid{grid-template-columns:1fr}
  .hero .wrap{padding:52px 0}.hero h1{font-size:2.05rem}
  .section{padding:38px 0}h1{font-size:1.8rem}.page-head h1{font-size:1.85rem}
  .side{grid-template-columns:1fr}
  .topbar .wrap{flex-wrap:wrap;padding:.35rem 0}
}

/* ============ v5: product-first merchandising ============ */
.hero-grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:2.4rem;align-items:center}
.hero-products{display:grid;grid-template-columns:repeat(3,1fr);gap:.65rem}
.hero-prod{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.18);border-radius:9px;padding:.65rem;text-align:center}
.hero-prod .hp-img{background:#fff;border-radius:6px;height:92px;display:grid;place-items:center;padding:.35rem;margin-bottom:.45rem}
.hero-prod img{max-height:84px;object-fit:contain}
.hero-prod b{display:block;font-size:.74rem;color:#fff;letter-spacing:.05em}
.hero-prod span{display:block;font-size:.66rem;color:#b9cfe2;line-height:1.4;margin-top:.15rem}
.hero-trust{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1.25rem}
.hero-trust span{font-size:.73rem;color:#c9dbea;border:1px solid rgba(255,255,255,.22);border-radius:20px;padding:.2rem .68rem}
.chip-rail{display:flex;gap:.5rem;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:.2rem 0 .6rem;scroll-snap-type:x proximity}
.chip-rail::-webkit-scrollbar{height:5px}
.chip-rail::-webkit-scrollbar-thumb{background:var(--line);border-radius:5px}
.chip{flex:0 0 auto;background:#fff;border:1px solid var(--line);border-radius:20px;padding:.42rem .85rem;font-size:.82rem;font-weight:600;color:var(--navy-2);white-space:nowrap;scroll-snap-align:start}
.chip:hover{border-color:var(--accent);color:var(--accent)}
.ftabs{display:flex;gap:.4rem;overflow-x:auto;padding-bottom:.35rem;margin-bottom:1.1rem;-webkit-overflow-scrolling:touch}
.ftab{flex:0 0 auto;background:#fff;border:1px solid var(--line);border-radius:6px;padding:.45rem .85rem;font-size:.83rem;font-weight:600;color:var(--muted);cursor:pointer;white-space:nowrap}
.ftab:hover{border-color:var(--navy-2);color:var(--navy-2)}
.ftab.active{background:var(--navy);border-color:var(--navy);color:#fff}
/* v13: context for configured-to-order families + a never-empty filter state. */
.filter-note{background:#f4f7fb;border:1px solid var(--line);border-left:3px solid var(--accent);padding:.8rem 1rem;margin:-.35rem 0 1.1rem;font-size:.85rem;line-height:1.65;color:var(--muted)}
.filter-note strong{color:var(--navy)}
.filter-note a{color:var(--accent);font-weight:600}
.filter-empty{margin:0 0 1.1rem;padding:.9rem 1rem;background:#f4f7fb;border:1px dashed var(--line);font-size:.88rem;color:var(--muted)}
.filter-empty a{color:var(--accent);font-weight:600}
.filter-note[hidden],.filter-empty[hidden]{display:none}
.pgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;align-items:stretch}
.pgrid .pcard-extra{display:none}
.pgrid.expanded .pcard-extra{display:flex}
.pcard.filtered-out{display:none!important}
.pcard{display:flex;flex-direction:column;height:100%;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:.2s;color:var(--text)}
.pcard:hover{transform:translateY(-3px);border-color:#b9d0e3;box-shadow:0 8px 26px rgba(11,37,69,.12);color:var(--text)}
/* Fixed row heights keep every title and spec line on the same baseline across the grid. */
/* v11: the image is absolutely positioned so its intrinsic ratio can never
   stretch the media box. Previously 600x600 photos made it 282px tall while
   400x300 schematics made it 215px, shifting every text row by 67px. */
.pcard-media{position:relative;background:#fff;border-bottom:1px solid var(--line);aspect-ratio:4/3;display:block;padding:0;flex:0 0 auto;overflow:hidden}
.pcard-media img{position:absolute;inset:0;width:100%;height:100%;padding:.45rem;object-fit:contain;display:block}
.pcard-badge{position:absolute;z-index:2;top:.5rem;left:.5rem;background:var(--navy);color:#fff;font-size:.65rem;font-weight:800;letter-spacing:.06em;border-radius:4px;padding:.2rem .45rem}
.pcard-body{padding:.85rem .9rem .95rem;display:flex;flex-direction:column;flex:1}
.pcard-cat{font-size:.67rem;line-height:1.3;height:1.3em;text-transform:uppercase;letter-spacing:.09em;color:var(--accent);font-weight:700;margin-bottom:.35rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pcard-body h3{font-size:.89rem;line-height:1.35;height:2.7em;margin:0 0 .6rem;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.pcard-specs{list-style:none;padding:0;margin:0 0 .7rem;font-size:.74rem;flex:0 0 auto}
.pcard-specs li{display:flex;justify-content:space-between;align-items:center;gap:.4rem;height:2.05em;padding:0;border-bottom:1px dashed var(--line);min-width:0}
.pcard-specs li:last-child{border-bottom:0}
.pcard-specs span{color:var(--muted);white-space:nowrap;flex:0 0 auto}
.pcard-specs b{color:var(--navy);font-weight:700;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.pcard-more{margin-top:auto;height:1.5em;line-height:1.5em;font-size:.76rem;font-weight:700;color:var(--accent)}
/* Two-column technical library: keeps the left column from ending far above the right one. */
.res-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.res-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:.85rem 1rem;box-shadow:var(--shadow);display:flex;flex-direction:column;transition:.2s}
.res-card:hover{transform:translateY(-2px);border-color:#b9d0e3;box-shadow:0 8px 26px rgba(11,37,69,.1)}
.res-card h3{font-size:.88rem;line-height:1.3;height:2.6em;margin:0 0 .35rem;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.res-card p{font-size:.76rem;line-height:1.5;height:3em;color:var(--muted);margin:0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.article .pgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
.show-all-wrap{text-align:center;margin-top:1.3rem}
.show-all-wrap .btn{min-width:230px}
.pd-qspec{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;margin:1.3rem 0 1.9rem}
.pd-qspec div{background:var(--soft);border:1px solid var(--line);border-radius:8px;padding:.8rem .5rem;text-align:center}
.pd-qspec b{display:block;font-size:1rem;color:var(--navy);line-height:1.35}
.pd-qspec span{font-size:.67rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.spec-note{font-size:.83rem;color:var(--muted);background:var(--soft);border-left:3px solid var(--steel);padding:.7rem 1rem;border-radius:0 6px 6px 0;margin:-.6rem 0 1.7rem}
.pd-cta{background:var(--navy);color:#fff;border-radius:10px;padding:1.25rem 1.5rem;margin:2rem 0;display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.pd-cta h3{color:#fff;margin:0;font-size:1.12rem}
.pd-cta p{color:#c9dbea;font-size:.85rem;margin:.3rem 0 0}
.pd-cta .btn-outline{background:transparent;border-color:rgba(255,255,255,.5);color:#fff}
.compare th,.compare td{font-size:.84rem;padding:.55rem .75rem}
.compare thead th{background:var(--navy);color:#fff}
.mobile-cta{display:none}
@media(max-width:1000px){
  .pgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .article .pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-grid{gap:1.3rem}
}
@media(max-width:760px){
  .hero-grid{grid-template-columns:1fr}
  .hero-products{display:none}
  .hero .wrap{padding:30px 0 26px}
  .hero h1{font-size:1.6rem;line-height:1.2}
  .hero .lead{font-size:.9rem;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .hero-actions{margin-top:.95rem;gap:.5rem}
  .hero-actions .btn{padding:.55rem .9rem;font-size:.82rem}
  .hero-trust{margin-top:.75rem;gap:.28rem}
  .hero-trust span{font-size:.65rem;padding:.15rem .48rem}
  .hero-stats{display:none}
  .section{padding:26px 0}
  .section-head{margin-bottom:.95rem}
  .section-head h2{font-size:1.26rem}
  .section-head p{font-size:.86rem}
  .chip-rail{margin-top:-.3rem}
  .ftabs{margin-bottom:.8rem}
  .pgrid,.article .pgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
  .pcard-media{aspect-ratio:1/1}
  .pcard-media img{padding:.35rem}
  .pcard-badge{font-size:.57rem;top:.32rem;left:.32rem;padding:.12rem .32rem}
  .pcard-body{padding:.58rem .6rem .68rem}
  .pcard-cat{font-size:.58rem;margin-bottom:.18rem;height:1.3em;line-height:1.3}
  .pcard-body h3{font-size:.77rem;height:2.7em;margin-bottom:.35rem}
  .pcard-specs{font-size:.65rem;margin-bottom:.4rem}
  .pcard-specs li{height:1.95em;padding:0}
  .pcard-more{font-size:.67rem}
  .res-grid{grid-template-columns:1fr;gap:.6rem}
  .res-card{padding:.7rem .85rem}
  .res-card h3{font-size:.86rem;height:auto}
  .res-card p{font-size:.78rem;height:auto}
  .pd-qspec{grid-template-columns:repeat(2,1fr);gap:.5rem;margin:1rem 0 1.4rem}
  .pd{margin:1rem 0 1.3rem;gap:1rem}
  .pd-img{min-height:205px;padding:.7rem}
  .pd-img img{max-height:205px}
  .pd-summary h1{font-size:1.48rem}
  .pd-cta{padding:1rem}
  .mobile-cta{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;background:#fff;border-top:1px solid var(--line);box-shadow:0 -4px 16px rgba(11,37,69,.12);padding:.5rem .7rem;gap:.6rem}
  .mobile-cta a{flex:1;text-align:center;border-radius:6px;padding:.6rem .4rem;font-size:.82rem;font-weight:700}
  .mbtn-ghost{border:1px solid var(--line);color:var(--navy)}
  .mbtn-primary{background:var(--accent);color:#fff}
  body{padding-bottom:54px}
  .topbar{display:none}
  .nav{min-height:58px}
  .breadcrumb{margin-bottom:.9rem;padding:.7rem 0}
  .article-layout{padding:10px 0 40px;gap:1rem}
  .article h2{font-size:1.22rem;margin-top:1.7rem}
  .table-wrap{font-size:.85rem}
}
@media(max-width:380px){
  .pcard-body h3{font-size:.72rem}
  .pcard-specs{font-size:.6rem}
  .pcard-cat{font-size:.54rem}
}

/* v5: keep the product grid inside the first mobile viewport */
.products-section{padding-top:16px}
@media(max-width:760px){
  .products-section{padding-top:12px;padding-bottom:18px}
  .hero .wrap{padding:22px 0 20px}
  .hero h1{font-size:1.42rem}
  .hero .lead{-webkit-line-clamp:1;margin-bottom:0}
  .hero-actions{margin-top:.7rem}
  .hero-trust{margin-top:.55rem}
  .hero-trust span{font-size:.61rem;padding:.12rem .42rem}
  .section-head{margin-bottom:.55rem}
  .section-head h2{font-size:1.14rem}
  .section-head p{font-size:.8rem;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;margin-top:.2rem}
  .eyebrow{margin-bottom:.35rem;font-size:.68rem}
  .ftabs{margin-bottom:.55rem}
  .ftab{padding:.35rem .7rem;font-size:.76rem}
  .show-all-wrap{margin-top:.9rem}
  .show-all-wrap .btn{padding:.6rem 1rem;font-size:.84rem;min-width:0}
}
.ftabs,.chip-rail{scrollbar-width:none;-ms-overflow-style:none}
.ftabs::-webkit-scrollbar,.chip-rail::-webkit-scrollbar{display:none}

/* ============ v8: audit-driven accessibility, readability & trust ============ */
/* #e8663d measured 3.28:1 on white. #c14a24 gives 4.92:1 on white and
   4.62:1 on the light-grey section background - both pass WCAG AA. */
:root{--accent:#0d8ba6;--accent-d:#0a6f86}

.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:#fff;color:var(--navy);
  padding:.7rem 1.1rem;border:2px solid var(--navy);border-radius:0 0 8px 0;font-weight:700}
.skip-link:focus{left:0}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid var(--accent);outline-offset:2px}
/* Keyboard users must be able to open the product mega menu. */
.nav-links>li:hover .dropdown,.nav-links>li:focus-within .dropdown{display:grid}

.article-meta{font-size:.82rem;color:var(--muted);margin:-.2rem 0 1.5rem;
  padding-bottom:.8rem;border-bottom:1px solid var(--line)}
/* v14: 68ch cap removed (see .article-layout above). Product pages need the
   full track for spec tables, qspec strips and related-model cards; the
   sidebar now sits immediately next to the content instead of floating away. */

/* Two lines of room for category + spec values: no ellipsis, no half words,
   but still fixed row heights so the grid stays perfectly aligned. */
.pcard-cat{white-space:normal;text-overflow:clip;font-size:.72rem;
  height:2.6em;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.pcard-specs li{height:2.9em;align-items:flex-start;padding:.22rem 0}
.pcard-specs b{white-space:normal;text-overflow:clip;line-height:1.3;
  max-height:2.6em;overflow:hidden}
.pcard-more{font-size:.8rem}

/* Consent / honeypot / error states for the server-side quote form */
.consent{display:flex;align-items:flex-start;gap:.55rem;font-size:.86rem;font-weight:400;
  color:var(--muted);margin:1rem 0 0;cursor:pointer}
.consent input{width:auto;flex:0 0 auto;margin-top:.25rem}
.consent a{color:var(--navy-2);text-decoration:underline}
.hp-wrap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-error{background:#fdecea;border:1px solid #f0b3a8;color:#8a2a12;
  border-radius:6px;padding:.75rem 1rem;margin-top:1rem;font-size:.88rem}
.form-error[hidden]{display:none}
.form-note{font-size:.84rem;color:var(--muted);margin:.9rem 0 0}
.form-note a{text-decoration:underline}

/* Quote / thank-you pages must not be covered by the fixed mobile CTA bar. */
body.page-quote{padding-bottom:0}
body.page-quote .mobile-cta{display:none!important}

@media(max-width:760px){
  /* Remove every line clamp that cut key copy off mid-sentence. */
  .hero .lead{-webkit-line-clamp:unset;display:block;overflow:visible;
    font-size:.92rem;line-height:1.55}
  .section-head p{-webkit-line-clamp:unset;display:block;overflow:visible;
    font-size:.86rem;line-height:1.5}
  .pcard-cat{font-size:.75rem;height:2.6em}
  .pcard-body h3{font-size:.88rem;height:2.7em}
  .pcard-specs{font-size:.75rem}
  .pcard-specs li{height:2.9em}
  .pcard-more{font-size:.78rem}
  .pcard-badge{font-size:.66rem}
  .res-card h3,.res-card p{height:auto;-webkit-line-clamp:unset;overflow:visible}
  /* Unify same-level headings; the engineering block used 1.55rem. */
  #engineering h2,.section-head h2{font-size:1.26rem}
  .site-footer .grid-4{grid-template-columns:repeat(2,1fr);gap:1.4rem}
  .nav-links>li:hover .dropdown,.nav-links>li:focus-within .dropdown{display:block}
}
@media(max-width:380px){
  /* Keep every card label at >=12px instead of 8.6-11.5px. */
  .pcard-body h3{font-size:.85rem}
  .pcard-specs{font-size:.75rem}
  .pcard-cat{font-size:.75rem}
  .pcard-more{font-size:.76rem}
  .hero .lead{font-size:.9rem}
}

/* Category rail needs an affordance; horizontal scrolling was undiscoverable. */
.rail-hint{display:none;font-size:.76rem;color:var(--muted);margin:0 0 .35rem}
@media(max-width:760px){
  .rail-hint{display:block}
  /* Keep one real product photo in the mobile first screen without pushing
     the product grid below the fold: a single 64px strip, not three cards. */
  .hero-products{display:grid;grid-template-columns:1fr;margin-top:.85rem}
  .hero-prod:nth-child(n+2){display:none}
  .hero-prod{display:flex;align-items:center;gap:.8rem;text-align:left;padding:.4rem .6rem}
  .hero-prod .hp-img{height:62px;width:86px;flex:0 0 86px;margin:0;padding:.2rem}
  .hero-prod img{max-height:58px}
  .hero-prod b{font-size:.8rem}
  .hero-prod span{font-size:.72rem;margin-top:.1rem}
}

/* ============ v10: concept A layout / original light palette ============
   A's structure is unchanged: three-part monospace status bar, FIG.01
   instrument frame, four-cell spec strip, filtered product range, square
   corners. Only the palette returns to the pre-v9 look: navy gradient hero,
   white sticky header, light-grey body, white cards, #c14a24 orange accent.
   #c14a24 is 4.92:1 on white (WCAG AA); on navy the accent is #ffb08e.
   All selectors remain scoped to body.home-a: the other 68 pages are
   byte-for-byte identical to v8.                                            */

/* The base stylesheet already is the light theme, so no blanket text
   overrides here - just A's square geometry and monospace labels. */
body.home-a{background:var(--bg);color:var(--text)}
body.home-a .eyebrow{color:var(--accent);font:700 .75rem Consolas,"SFMono-Regular",Menlo,monospace;letter-spacing:.18em}
body.home-a .section.alt{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
body.home-a .text-link{color:var(--accent)}
body.home-a .check-list li:before{background:var(--accent)}
body.home-a .card,body.home-a .res-card,body.home-a .faq-item{background:#fff;border:1px solid var(--line);border-radius:0;box-shadow:none}
body.home-a .card:hover,body.home-a .res-card:hover{border-color:var(--accent);box-shadow:none}
body.home-a .card h3,body.home-a .res-card h3,body.home-a .faq-item h3{color:var(--navy)}
body.home-a .card p,body.home-a .res-card p,body.home-a .faq-item p{color:var(--muted)}
body.home-a .rail-hint{color:var(--muted)}
body.home-a .chip{background:#fff;border:1px solid var(--line);border-radius:0;color:var(--muted)}
body.home-a .chip:hover{border-color:var(--accent);color:var(--accent)}
body.home-a .chip-rail::-webkit-scrollbar-thumb{background:var(--line)}

/* Site chrome: navy status bar / white header / navy footer - the original look. */
body.home-a .topbar{background:var(--navy);border-bottom:1px solid #123761;color:#cddced;
  font:11px/28px Consolas,"SFMono-Regular",Menlo,monospace;letter-spacing:.14em;text-transform:uppercase}
body.home-a .topbar .wrap{min-height:28px}
body.home-a .topbar a{color:#cddced}
body.home-a .ha-bar b{color:#ffb08e;font-weight:600}
body.home-a .site-header{background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);box-shadow:0 1px 8px rgba(10,35,65,.05)}
body.home-a .brand{color:var(--navy);font-size:1.15rem;letter-spacing:.06em}
body.home-a .brand-mark{background:linear-gradient(135deg,var(--accent),#4bc6d8);color:#fff;border-radius:3px}
body.home-a .brand small{color:var(--muted);font:10px Consolas,monospace;letter-spacing:.18em}
body.home-a .nav-links>li>a{color:var(--text)}
body.home-a .nav-links>li>a:hover{background:var(--soft);color:var(--navy-2)}
body.home-a .dropdown{background:#fff;border:1px solid var(--line);box-shadow:0 14px 40px rgba(11,37,69,.15)}
body.home-a .dropdown h4{color:var(--accent)}
body.home-a .dropdown a{color:var(--muted)}
body.home-a .dropdown a:hover{background:var(--soft);color:var(--navy)}
body.home-a .nav-toggle{border-color:var(--line);color:var(--navy)}
body.home-a .btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}
body.home-a .btn-primary:hover{background:var(--accent-d);border-color:var(--accent-d);color:#fff}
body.home-a .nav .btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}
body.home-a .nav .btn-primary:hover{background:var(--accent-d);color:#fff}
body.home-a .btn-outline{background:#fff;border-color:var(--line);color:var(--navy)}
body.home-a .btn-outline:hover{border-color:var(--accent);color:var(--accent)}
body.home-a .site-footer{background:#081d34;border-top:0;color:#b8cadd}
body.home-a .site-footer a{color:#b8cadd}
body.home-a .site-footer a:hover{color:#ffb08e}
body.home-a .footer-bottom{border-top-color:rgba(255,255,255,.12)}

/* A-style hero on the original navy gradient. */
.ha-hero{position:relative;overflow:hidden;border-bottom:1px solid #123761;
  background:linear-gradient(120deg,#0b2545 0%,#123761 62%,#1a4a78 100%)}
.ha-hero:before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:40px 40px}
body.home-a .ha-grid{position:relative;z-index:1;width:min(1280px,92vw);
  display:grid;grid-template-columns:1.04fr .96fr;gap:3.4rem;align-items:center;padding:54px 0 52px}
body.home-a .ha-hero{color:#fff}
body.home-a .ha-hero p,body.home-a .ha-hero li,body.home-a .ha-hero strong{color:#c9dbea}
.ha-kicker{font:11px Consolas,"SFMono-Regular",Menlo,monospace;letter-spacing:.2em;
  text-transform:uppercase;color:#ffb08e;margin-bottom:1.1rem}
.ha-kicker b{border:1px solid rgba(255,255,255,.35);padding:.15rem .45rem;margin-right:.7rem;color:#ffd3bf}
body.home-a .ha-hero h1{font-size:3.05rem;line-height:1.09;letter-spacing:-.035em;
  margin:0 0 1.1rem;font-weight:800;color:#fff}
body.home-a .ha-hero h1 span{color:#ffb08e}
body.home-a .ha-sub{color:#c9dbea;font-size:1.02rem;max-width:560px;margin:0 0 1.7rem;line-height:1.65}
.ha-acts{display:flex;gap:.75rem;flex-wrap:wrap}
.ha-b1,.ha-b2{display:inline-flex;align-items:center;padding:.78rem 1.3rem;
  font:700 .78rem Consolas,"SFMono-Regular",Menlo,monospace;letter-spacing:.09em;text-transform:uppercase}
.ha-b1{background:var(--accent);color:#fff}
.ha-b1:hover{background:var(--accent-d);color:#fff}
.ha-b2{border:1px solid rgba(255,255,255,.4);color:#fff}
.ha-b2:hover{border-color:#fff;color:#fff}
.ha-spec{display:grid;grid-template-columns:repeat(4,1fr);margin-top:2.1rem;
  border-top:1px solid rgba(255,255,255,.2);border-bottom:1px solid rgba(255,255,255,.2)}
.ha-spec div{padding:.75rem .8rem .75rem 0}
.ha-spec div+div{border-left:1px solid rgba(255,255,255,.2);padding-left:.9rem}
.ha-spec span{display:block;font:10px Consolas,monospace;letter-spacing:.12em;
  color:#b9cfe2;text-transform:uppercase}
.ha-spec b{font:600 .82rem Consolas,monospace;color:#fff}
.ha-stage{border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.07);
  position:relative;padding:14px}
.ha-stage:before,.ha-stage:after{content:"";position:absolute;width:11px;height:11px;border:1px solid #ffb08e}
.ha-stage:before{left:-1px;top:-1px;border-right:0;border-bottom:0}
.ha-stage:after{right:-1px;bottom:-1px;border-left:0;border-top:0}
.ha-stage-tag{font:10px Consolas,monospace;letter-spacing:.14em;color:#b9cfe2;
  display:flex;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:.5rem}
.ha-stage-img{height:250px;display:grid;place-items:center;background:#fff;margin:12px 0;overflow:hidden}
.ha-stage-img img{width:auto;height:auto;max-width:100%;max-height:225px;
  object-fit:contain;mix-blend-mode:multiply}
.ha-stage-foot{display:flex;justify-content:space-between;font:11px Consolas,monospace;
  color:#c9dbea;border-top:1px solid rgba(255,255,255,.2);padding-top:.55rem}
.ha-stage-foot b{color:#ffb08e}
.ha-thumbs{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.ha-thumb{border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.07);display:flex;align-items:center;gap:.6rem;padding:.5rem}
.ha-thumb:hover{border-color:#ffb08e}
.ha-thumb-img{width:62px;height:62px;flex:0 0 62px;background:#fff;display:grid;place-items:center;overflow:hidden}
.ha-thumb-img img{width:auto;height:auto;max-width:60px;max-height:60px;object-fit:contain}
.ha-thumb b,.ha-thumb span span{display:block}
.ha-thumb b{font:600 .76rem Consolas,monospace;color:#fff}
.ha-thumb span span{font:10px Consolas,monospace;color:#b9cfe2;margin-top:.15rem}

/* A-style product range on the light body: same filter / show-all behaviour. */
body.home-a .ha-prod{padding:34px 0 60px}
.ha-ph{display:flex;justify-content:space-between;align-items:end;
  border-bottom:1px solid var(--line);padding-bottom:.9rem;margin-bottom:.75rem}
.ha-ph .ha-kicker{margin:0}
body.home-a .ha-ph .ha-kicker{color:var(--accent)}
body.home-a .ha-ph h2{font-size:1.5rem;margin:.35rem 0 0;letter-spacing:-.02em}
.ha-ph-link{font:11px Consolas,monospace;letter-spacing:.1em;color:var(--accent);text-transform:uppercase}
body.home-a .ha-prod-intro{color:var(--muted);font-size:.92rem;margin:0 0 1.1rem}
body.home-a .ftab{background:#fff;border:1px solid var(--line);border-radius:0;
  color:var(--muted);font:11px Consolas,monospace;letter-spacing:.04em;text-transform:uppercase}
body.home-a .ftab:hover{border-color:var(--accent);color:var(--accent)}
body.home-a .ftab.active{background:var(--navy);border-color:var(--navy);color:#fff}
body.home-a .filter-note,body.home-a .filter-empty{border-radius:0;font-size:.82rem}
body.home-a .pcard{background:#fff;border:1px solid var(--line);border-radius:0;
  box-shadow:none;color:var(--text)}
body.home-a .pcard:hover{border-color:var(--accent);box-shadow:none;color:var(--text)}
body.home-a .pcard-media{background:#fff;border-bottom:1px solid var(--line)}
body.home-a .pcard-badge{background:var(--navy);color:#fff;border:0;border-radius:0}
body.home-a .pcard-cat{color:var(--accent)}
body.home-a .pcard-body h3{color:var(--navy)}
body.home-a .pcard-specs li{border-bottom-color:var(--line)}
body.home-a .pcard-specs span{color:var(--muted)}
body.home-a .pcard-specs b{color:var(--navy)}
body.home-a .pcard-more{color:var(--accent)}
body.home-a .mobile-cta{background:#fff;border-top:1px solid var(--line)}
body.home-a .mbtn-ghost{border:1px solid var(--line);color:var(--navy)}
body.home-a .mbtn-primary{background:var(--accent);color:#fff}

@media(max-width:760px){
  body.home-a .topbar{display:block;font-size:9px;height:28px;overflow:hidden}
  body.home-a .topbar .wrap{height:28px;min-height:28px;flex-wrap:nowrap;white-space:nowrap}
  body.home-a .ha-bar .wrap span:nth-child(n+2){display:none}
  body.home-a .nav{min-height:52px}
  body.home-a .brand{font-size:1rem}
  body.home-a .brand small{display:none}
  body.home-a .nav-links{background:#fff;border-bottom:1px solid var(--line);box-shadow:none}
  body.home-a .nav-links>li>a{color:var(--text)}
  body.home-a .ha-grid{grid-template-columns:1fr;gap:.85rem;padding:16px 0 16px}
  body.home-a .ha-kicker{margin-bottom:.55rem;font-size:9px}
  body.home-a .ha-hero h1{font-size:1.68rem;margin-bottom:.55rem}
  body.home-a .ha-sub{font-size:.8rem;line-height:1.45;margin-bottom:.75rem}
  body.home-a .ha-b1,body.home-a .ha-b2{padding:.5rem .75rem;font-size:.65rem}
  body.home-a .ha-spec{grid-template-columns:repeat(2,1fr);margin-top:.7rem}
  body.home-a .ha-spec div{padding:.38rem .5rem .38rem 0}
  body.home-a .ha-spec div+div{padding-left:.6rem}
  body.home-a .ha-spec span{font-size:9px}
  body.home-a .ha-spec b{font-size:.75rem}
  body.home-a .ha-spec div:nth-child(3){border-left:0;padding-left:0}
  body.home-a .ha-spec div:nth-child(n+3){border-top:1px solid rgba(255,255,255,.2)}
  body.home-a .ha-stage{padding:9px}
  body.home-a .ha-stage-tag{padding-bottom:.35rem;font-size:9px}
  body.home-a .ha-stage-img{height:100px;margin:6px 0}
  body.home-a .ha-stage-img img{max-height:92px}
  body.home-a .ha-stage-foot{padding-top:.4rem;font-size:9.5px}
  body.home-a .ha-thumbs{display:none}
  body.home-a .ha-prod{padding:14px 0 40px}
  body.home-a .ha-ph{padding-bottom:.6rem;margin-bottom:.55rem}
  body.home-a .ha-ph h2{font-size:1.05rem}
  body.home-a .ha-ph-link{display:none}
  body.home-a .ha-prod-intro{font-size:.76rem;margin-bottom:.6rem}
  body.home-a .ftabs{margin-bottom:.55rem}
  body.home-a .ftab{padding:.35rem .7rem;font-size:.7rem}
  body.home-a .show-all-wrap{margin-top:.9rem}
}

/* ============ v11: product-first category pages ============
   Previously the models sat after 2 intro paragraphs + 3 technical sections
   inside an .article capped at 68ch, so the first product image appeared at
   y=2177px on mobile and the unused right half of the column read as a blank
   block. Now the grid is full-width directly under the H1; copy and sidebar
   follow underneath, with no narrow-column gutter.                         */
.cat-page{padding-top:22px}
.cat-head .eyebrow{margin-bottom:.4rem}
.cat-head h1{font-size:2.25rem;margin:0 0 .55rem}
.cat-head .lead{font-size:1.02rem;line-height:1.6;max-width:78ch;margin:0}
.cat-products{padding:22px 0 30px}
.cat-section-head{display:flex;justify-content:space-between;align-items:end;
  border-bottom:1px solid var(--line);padding-bottom:.55rem;margin-bottom:1rem}
.cat-section-head h2{font-size:1.32rem;margin:0;border:0;padding:0}
.cat-section-head a{font-size:.85rem;font-weight:700;color:var(--accent);white-space:nowrap}
.cat-page .pgrid{grid-template-columns:repeat(4,minmax(0,1fr))}
.cat-lower{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:2.6rem;
  align-items:start;padding:14px 0 60px}
.cat-copy{min-width:0}
.cat-note{margin:0 0 1.4rem}
.cat-copy h2{border-bottom:1px solid var(--line);padding-bottom:.45rem}
.cat-lower .side{position:sticky;top:95px}
@media(max-width:1000px){
  .cat-page .pgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cat-lower{grid-template-columns:1fr;gap:1.4rem}
  .cat-lower .side{position:static;display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
}
@media(max-width:760px){
  .cat-page{padding-top:14px}
  .cat-head h1{font-size:1.5rem;margin-bottom:.4rem}
  .cat-head .lead{font-size:.9rem;line-height:1.55}
  .cat-products{padding:12px 0 18px}
  .cat-section-head{padding-bottom:.45rem;margin-bottom:.65rem}
  .cat-section-head h2{font-size:1.05rem}
  .cat-section-head a{display:none}
  .cat-page .pgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
  .cat-lower{padding:6px 0 40px}
  .cat-lower .side{grid-template-columns:1fr}
}

/* ============ v15: homepage Industries + FAQ layout polish ============
   Layout A and the original light palette are untouched. Two problems were
   purely structural: seven text cards in a 3-column grid leave a 2/3-wide
   empty last row, and five identical FAQ boxes sat in a 900px column with a
   dead band on the right. A featured tile + a closing CTA tile fill 3 x 3
   slots; the FAQ becomes a sticky intro rail + full-width numbered accordion.
   All selectors are scoped to body.home-a, so the other 68 pages are
   byte-for-byte unchanged.                                                  */
body.home-a .ha-ind-section{padding:52px 0 58px}
.ha-ind-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;
  border-bottom:1px solid var(--line);padding-bottom:1rem;margin-bottom:1.25rem}
.ha-ind-head .eyebrow{margin-bottom:.45rem}
.ha-ind-head h2{font-size:1.55rem;margin:0;letter-spacing:-.02em}
.ha-ind-head p{color:var(--muted);font-size:.9rem;margin:.5rem 0 0;max-width:62ch}
.ha-ind-all{flex:0 0 auto;font:700 .72rem Consolas,"SFMono-Regular",Menlo,monospace;
  letter-spacing:.1em;text-transform:uppercase;color:var(--navy);background:#fff;
  border:1px solid var(--line);padding:.6rem .9rem;white-space:nowrap}
.ha-ind-all b{color:var(--accent);margin-left:.55rem;font-size:.9rem}
.ha-ind-all:hover{border-color:var(--accent);color:var(--accent)}
.ha-ind-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.icard{position:relative;display:flex;flex-direction:column;min-height:196px;
  background:#fff;border:1px solid var(--line);border-radius:0;
  padding:1.15rem 1.2rem 1rem;color:var(--text);
  transition:border-color .18s,background .18s}
.icard:hover{border-color:var(--accent);color:var(--text)}
.icard:before{content:"";position:absolute;left:-1px;top:-1px;width:0;height:2px;
  background:var(--accent);transition:width .22s}
.icard:hover:before{width:calc(100% + 2px)}
.icard-no{font:600 10px Consolas,monospace;letter-spacing:.16em;
  color:var(--accent);text-transform:uppercase}
.icard-main{display:block;margin-top:.7rem;flex:1}
.icard h3{font-size:1rem;line-height:1.35;margin:0 0 .45rem;color:var(--navy)}
.icard p{font-size:.85rem;line-height:1.6;color:var(--muted);margin:0}
.icard-go{display:flex;justify-content:space-between;align-items:center;
  border-top:1px solid var(--line);margin-top:1rem;padding-top:.65rem;
  font:600 10px Consolas,monospace;letter-spacing:.12em;text-transform:uppercase;
  color:var(--navy-2)}
.icard-go b{font-size:1rem;color:var(--accent);transition:transform .18s}
.icard:hover .icard-go b{transform:translateX(4px)}
.icard-feature{grid-column:span 2;overflow:hidden;padding:1.4rem 1.5rem 1.15rem;
  background:linear-gradient(120deg,#0b2545 0%,#123761 62%,#1a4a78 100%);
  border-color:#123761}
.icard-feature:after{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:36px 36px}
.icard-feature>*{position:relative;z-index:1}
.icard-feature .icard-no{color:#ffb08e}
.icard-feature h3{color:#fff;font-size:1.4rem;max-width:24ch;margin-bottom:.55rem}
.icard-feature p{color:#c9dbea;font-size:.9rem;max-width:64ch}
.icard-feature .icard-go{border-top-color:rgba(255,255,255,.22);color:#c9dbea}
.icard-feature .icard-go b{color:#ffb08e}
.icard-feature:hover{border-color:#ffb08e}
.icard-cta{background:var(--soft);border-left:2px solid var(--accent)}
.icard-cta .icard-no{color:var(--navy-2)}

body.home-a .ha-faq-section{padding:56px 0}
.ha-faq-wrap{display:grid;grid-template-columns:300px minmax(0,1fr);gap:2.6rem;align-items:start}
.ha-faq-side{position:sticky;top:95px}
.ha-faq-side .eyebrow{margin-bottom:.55rem}
.ha-faq-side h2{font-size:1.55rem;margin:0 0 .8rem;letter-spacing:-.02em}
.ha-faq-side p{font-size:.9rem;color:var(--muted);margin:0 0 1.3rem;line-height:1.65}
.ha-faq-cta{display:inline-flex;align-items:center;gap:1.6rem;padding:.7rem 1rem;
  background:var(--navy);color:#fff;font:700 .72rem Consolas,monospace;
  letter-spacing:.12em;text-transform:uppercase}
.ha-faq-cta b{color:#ffb08e;font-size:1rem}
.ha-faq-cta:hover{background:var(--accent);color:#fff}
.ha-faq-all{display:block;margin-top:.9rem;font-size:.82rem;font-weight:700;color:var(--accent)}
.ha-faq-stamp{margin-top:1.6rem;border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);padding:.7rem 0;display:grid;gap:.15rem}
.ha-faq-stamp span{font:10px Consolas,monospace;letter-spacing:.12em;color:var(--muted)}
.ha-faq-stamp b{font:600 11px Consolas,monospace;letter-spacing:.1em;color:var(--navy)}
.ha-faq-list{background:#fff;border:1px solid var(--line)}
.fitem{border-bottom:1px solid var(--line)}
.fitem:last-child{border-bottom:0}
.fitem summary{list-style:none;display:grid;grid-template-columns:34px minmax(0,1fr) 20px;
  gap:.8rem;align-items:center;padding:1rem 1.25rem;cursor:pointer;transition:background .18s}
.fitem summary::-webkit-details-marker{display:none}
.fitem summary:hover{background:var(--soft)}
.fno{font:600 11px Consolas,monospace;letter-spacing:.08em;color:var(--accent)}
.fq{font-size:.98rem;font-weight:700;color:var(--navy);line-height:1.4}
.fmark{position:relative;width:14px;height:14px;justify-self:end}
.fmark:before,.fmark:after{content:"";position:absolute;background:var(--navy-2);
  transition:transform .2s}
.fmark:before{left:0;top:6px;width:14px;height:2px}
.fmark:after{left:6px;top:0;width:2px;height:14px}
.fitem[open] .fmark:after{transform:rotate(90deg)}
.fitem[open] summary{background:#fff}
.fitem[open] .fq{color:var(--accent)}
.fitem[open]{box-shadow:inset 3px 0 0 var(--accent)}
.fans{padding:0 1.25rem 1.15rem 4.05rem}
.fans p{margin:0;font-size:.9rem;line-height:1.7;color:var(--muted);max-width:76ch}

@media(max-width:1000px){
  .ha-ind-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .icard-feature,.icard-cta{grid-column:span 2}
  .ha-faq-wrap{grid-template-columns:1fr;gap:1.4rem}
  .ha-faq-side{position:static}
  .ha-faq-stamp{display:none}
}
@media(max-width:760px){
  body.home-a .ha-ind-section{padding:30px 0 36px}
  .ha-ind-head{flex-direction:column;align-items:flex-start;gap:.8rem;
    padding-bottom:.8rem;margin-bottom:.9rem}
  .ha-ind-head h2{font-size:1.26rem}
  .ha-ind-head p{font-size:.82rem}
  .ha-ind-all{padding:.5rem .75rem}
  .ha-ind-grid{grid-template-columns:1fr;gap:10px}
  .icard-feature,.icard-cta{grid-column:span 1}
  .icard{min-height:0;padding:1rem}
  .icard-feature{padding:1.1rem}
  .icard-feature h3{font-size:1.15rem}
  .icard-go{margin-top:.8rem}
  body.home-a .ha-faq-section{padding:32px 0}
  .ha-faq-side h2{font-size:1.26rem}
  .fitem summary{padding:.85rem .9rem;grid-template-columns:26px minmax(0,1fr) 16px;gap:.55rem}
  .fq{font-size:.88rem}
  .fans{padding:0 .9rem .95rem 3.15rem}
  .fans p{font-size:.84rem}
}

/* --- Lumivue site-specific layout rules (loaded after the shared system) --- */
.hero .wrap{padding:36px 0 34px}
.hero h1{font-size:2.3rem;max-width:760px}
.hero .lead{font-size:1.04rem;margin-bottom:0}
.hero .eyebrow{color:#7fe0f0}
.hero-actions{margin-top:1.2rem}
.hero-trust{margin-top:1rem}
.hero-grid{gap:1.8rem}
.hero-products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;align-items:stretch}
.hero-prod{display:block;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.18);border-radius:9px;padding:.7rem .5rem;text-align:center}
.hero-prod .hp-img{background:#fff;border-radius:6px;height:132px;display:grid;place-items:center;padding:.4rem;margin-bottom:.5rem}
.hero-prod img{max-height:122px;object-fit:contain}
.hero-prod b{display:block;font-size:.74rem;color:#fff;letter-spacing:.03em;line-height:1.35}
.hero-prod span{display:block;font-size:.66rem;color:#b9cfe2;line-height:1.4;margin-top:.2rem}
.hero-products-note{text-align:center;margin-top:.8rem;font-size:.72rem;color:#b9cfe2;letter-spacing:.04em}

.hn-cat-card .hn-cat-img,.hn-app .hn-app-img{display:block;background:#fff;border:1px solid var(--line);border-radius:8px;height:170px;overflow:hidden;margin-bottom:1rem}
.hn-cat-card .hn-cat-img img,.hn-app .hn-app-img img{width:100%;height:100%;object-fit:contain;padding:.6rem}
.hn-cat-card .text-link,.hn-app .text-link{font-size:.82rem;font-weight:700}
.hn-app-cta{background:var(--navy);border-color:var(--navy);display:flex;flex-direction:column;justify-content:center}
.hn-app-cta h3{color:#fff}
.hn-app-cta p{color:#c9dbea}
.hn-app p{font-size:.86rem;color:var(--muted);margin:0 0 .7rem}
.hn-feat-no{display:block;font-size:.76rem;font-weight:800;letter-spacing:.12em;color:var(--accent);margin-bottom:.65rem}
.hn-feat p{font-size:.88rem;color:var(--muted);margin:0}
.hn-faq-wrap{display:grid;grid-template-columns:minmax(0,.34fr) minmax(0,.66fr);gap:2.4rem;align-items:start}
.hn-faq-side h2{margin-top:0}
.hn-faq-side p{color:var(--muted);font-size:.95rem}
.hn-faq-list{display:flex;flex-direction:column;gap:.55rem}
details.hn-q{background:#fff;border:1px solid var(--line);border-radius:8px;padding:.85rem 1.1rem;box-shadow:var(--shadow)}
details.hn-q[open]{border-color:#b9d0e3}
details.hn-q summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:.8rem;font-weight:700;color:var(--navy);font-size:.95rem}
details.hn-q summary::-webkit-details-marker{display:none}
details.hn-q summary:after{content:"+";margin-left:auto;color:var(--accent);font-size:1.25rem;font-weight:400}
details.hn-q[open] summary:after{content:"\2212"}
.fno{font-size:.7rem;font-weight:800;color:var(--accent);letter-spacing:.08em}
details.hn-q p{margin:.75rem 0 .1rem;color:var(--muted);font-size:.9rem;line-height:1.65}
.hn-lead-img{background:#fff;border:1px solid var(--line);border-radius:var(--radius);margin:1.4rem 0 2rem;overflow:hidden;max-height:420px;display:grid;place-items:center}
.hn-lead-img img{width:100%;max-height:420px;object-fit:contain}
.cat-products{padding:22px 0 30px}
.show-all-wrap{text-align:center;margin-top:1.4rem}
.pcard-media{background:#fff}
#featured{padding-top:24px}
#featured .section-head{margin-bottom:1.1rem}

/* Fill the last grid row so a catalogue never ends in a wide empty gap. */
.pcard.hn-fill{background:#f4f7fb;border-style:dashed;box-shadow:none}
.pcard.hn-fill:hover{transform:none;border-color:var(--accent)}
.hn-fill .hn-fill-media{position:relative;display:grid;place-items:center;background:var(--soft);border-bottom:1px solid var(--line);aspect-ratio:4/3}
.hn-fill-media span{color:var(--navy-2);font-weight:800;font-size:1.02rem;line-height:1.4;text-align:center;padding:.6rem}
.hn-fill .pcard-body p{font-size:.78rem;line-height:1.5;color:var(--muted);margin:0 0 .6rem}

@media(max-width:1000px){
 .pgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .hn-faq-wrap{grid-template-columns:minmax(0,.4fr) minmax(0,.6fr);gap:1.4rem}
 .grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
 .hero h1{font-size:1.95rem}
 .hero-prod .hp-img{height:105px}
 .hero-prod img{max-height:96px}
}
@media(max-width:760px){
 .hero .wrap{padding:26px 0 28px}
 .hero h1{font-size:1.7rem}
 .hero .lead{font-size:.92rem}
 .hero-grid{grid-template-columns:1fr;gap:1rem}
 .hero-actions{margin-top:.9rem}
 .hero-trust{margin-top:.75rem}
 .hero-products{grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem}
 .hero-prod{padding:.45rem .3rem}
 .hero-prod .hp-img{height:74px;padding:.25rem;margin-bottom:.3rem}
 .hero-prod img{max-height:68px}
 .hero-prod b{font-size:.61rem}
 .hero-prod span{font-size:.56rem}
 .hero-products-note{margin-top:.45rem;font-size:.66rem}
 .pgrid,.article .pgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
 .pcard-body{padding:.7rem}
 .pcard-body h3{font-size:.8rem}
 .cat-products{padding:12px 0 18px}
 .hn-faq-wrap{grid-template-columns:1fr;gap:1rem}
 .grid-4,.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
 .hn-cat-card .hn-cat-img,.hn-app .hn-app-img{height:130px}
 .article-layout{grid-template-columns:1fr;gap:1.2rem;padding:16px 0 40px}
 .side{position:static}
 .pd{grid-template-columns:1fr;gap:1.1rem}
 .pd-qspec{grid-template-columns:repeat(2,1fr)}
 .form-grid{grid-template-columns:1fr}
 .hn-fill-media span{font-size:.85rem}
}
@media(max-width:420px){
 .grid-4,.grid-3{grid-template-columns:1fr}
 .hero-products{gap:.3rem}
}

/* Keep all three product families in the mobile hero and pull the product
   cards above the fold. Overrides the shared template's single-card rule. */
@media(max-width:760px){
 .mobile-cta{display:none}
 .hero .wrap{padding:18px 0 20px}
 .hero h1{font-size:1.45rem;line-height:1.25}
 .hero .lead{font-size:.85rem;line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
 .hero-actions{margin-top:.7rem;gap:.5rem}
 .hero-actions .btn{padding:.55rem .9rem;font-size:.82rem}
 .hero-trust{display:none}
 .hero-grid{gap:.8rem}
 .hero-products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.35rem;margin-top:0}
 .hero-prod,.hero-prod:nth-child(n+2){display:block;text-align:center;padding:.4rem .25rem;gap:0}
 .hero-prod .hp-img{height:60px;width:auto;flex:none;margin:0 0 .3rem;padding:.2rem}
 .hero-prod img{max-height:56px}
 .hero-prod b{font-size:.6rem;line-height:1.3}
 .hero-prod span{display:none}
 .hero-products-note{margin-top:.4rem;font-size:.62rem}
 #featured{padding-top:14px}
 #featured .section-head{margin-bottom:.6rem}
 #featured .section-head h2{font-size:1.15rem}
 #featured .section-head p{display:none}
 #featured .ftabs{margin-bottom:.7rem}
 /* Show every filter on small screens instead of a hidden horizontal scroll. */
 .ftabs{flex-wrap:wrap;overflow-x:visible}
 .ftab{white-space:normal;text-align:center;line-height:1.25}
}