@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@500&display=swap');

:root{
  --graphite:#FFFFFF;
  --panel:#F4F7F9;
  --panel-2:#EBF0F3;
  --line:#DFE5EA;
  --steel:#5B6B7A;
  --paper:#0F2A4A;
  --paper-dim:#44536A;
  --amber:#3EA042;
  --copper:#2D7A31;
  --navy:#0F2A4A;
  --max:1180px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--graphite);
  color:var(--paper);
  font-family:'IBM Plex Sans', sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.disp{
  font-family:'Oswald', sans-serif;
  font-weight:600;
  letter-spacing:0.2px;
  margin:0;
  color:var(--paper);
}
a{color:inherit;}
.wrap{max-width:var(--max); margin:0 auto; padding:0 32px;}
img{max-width:100%; display:block;}
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
  outline:2px solid var(--amber);
  outline-offset:3px;
}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important;}
}

/* Header */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,0.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.headerbar{
  display:flex; align-items:center; justify-content:space-between;
  padding:20px 32px;
  max-width:var(--max); margin:0 auto;
}
.logo{
  font-family:'Oswald', sans-serif;
  font-weight:600;
  font-size:19px;
  letter-spacing:0.3px;
  text-decoration:none;
  display:flex; align-items:center; gap:10px;
  color:var(--paper);
}
.logo img{height:36px; width:auto; flex-shrink:0;}
.logo .logo-text{display:flex; flex-direction:column; line-height:1.15;}
.logo .logo-text small{
  font-family:'IBM Plex Sans',sans-serif; font-weight:400; letter-spacing:0.04em;
  font-size:9.5px; color:var(--steel); text-transform:uppercase; margin-top:2px;
}
.logo .mark{color:var(--amber);}
nav{display:flex; gap:34px;}
nav a{
  text-decoration:none;
  font-size:15px;
  color:var(--paper-dim);
  transition:color .15s ease;
  padding-bottom:2px;
}
nav a:hover{color:var(--paper);}
nav a.active{color:var(--paper); border-bottom:2px solid var(--amber);}
.nav-toggle{display:none;}
@media (max-width:760px){
  nav{
    position:fixed; inset:64px 0 0 0; background:var(--graphite);
    flex-direction:column; padding:32px; gap:22px; font-size:19px;
    transform:translateY(-8px); opacity:0; pointer-events:none;
    transition:opacity .2s ease, transform .2s ease;
  }
  nav.open{opacity:1; pointer-events:auto; transform:translateY(0);}
  .nav-toggle{
    display:block; background:none; border:1px solid var(--line); color:var(--paper);
    width:40px; height:40px; border-radius:2px; font-size:18px; cursor:pointer;
  }
}

/* Section shell */
section{padding:88px 0;}
.section-head{
  display:grid;
  grid-template-columns:5fr 7fr;
  gap:48px;
  margin-bottom:56px;
}
.section-head h2{font-size:clamp(28px,3.6vw,42px); max-width:14ch;}
.section-head .desc{color:var(--paper-dim); max-width:52ch; align-self:end;}
@media (max-width:760px){.section-head{grid-template-columns:1fr;}}

.btn{
  display:inline-block;
  padding:13px 26px;
  border-radius:30px;
  text-decoration:none;
  font-size:15px;
  font-weight:500;
  border:1px solid transparent;
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.btn-primary{background:var(--amber); color:#fff;}
.btn-primary:hover{background:#2D7A31;}
.btn-ghost{border-color:var(--line); color:var(--paper);}
.btn-ghost:hover{border-color:var(--steel);}

/* Stat row (reused across pages) */
.stat-row{display:flex; flex-direction:column; gap:0;}
.stat{
  display:flex; align-items:baseline; justify-content:space-between;
  padding:16px 0;
  border-top:1px solid var(--line);
}
.stat:last-child{border-bottom:1px solid var(--line);}
.stat .num{font-family:'Oswald',sans-serif; font-size:30px; color:var(--paper);}
.stat .lbl{font-size:14px; color:var(--paper-dim); text-align:right;}

/* Product line cards on homepage */
.lines{border-bottom:1px solid var(--line);}
.line-item{
  display:grid;
  grid-template-columns:2fr 3fr 3fr 1fr;
  gap:24px;
  align-items:center;
  padding:34px 0;
  border-top:1px solid var(--line);
  text-decoration:none;
  color:inherit;
  transition:background .15s ease;
}
.lines .line-item:last-child{border-bottom:1px solid var(--line);}
.line-item:hover{background:var(--panel);}
.line-item .idx{font-family:'IBM Plex Mono',monospace; color:var(--amber); font-size:14px;}
.line-item .name{font-family:'Oswald',sans-serif; font-size:26px;}
.line-item .desc{color:var(--paper-dim); font-size:15px; max-width:44ch;}
.line-item .go{justify-self:end; font-size:14px; color:var(--steel);}
@media (max-width:760px){
  .line-item{grid-template-columns:1fr;}
  .line-item .go{justify-self:start;}
}

/* Generic content list (specs, process steps) */
.rowlist{border-bottom:1px solid var(--line);}
.row-item{
  display:grid;
  grid-template-columns:2fr 3fr 4fr;
  gap:28px;
  padding:30px 0;
  border-top:1px solid var(--line);
}
.rowlist .row-item:last-child{border-bottom:1px solid var(--line);}
.row-item .name{font-family:'Oswald',sans-serif; font-size:23px; color:var(--paper);}
.row-item .tag{color:var(--amber); font-size:14px; align-self:start; margin-top:5px;}
.row-item .desc{color:var(--paper-dim); font-size:15.5px; max-width:56ch;}
@media (max-width:760px){.row-item{grid-template-columns:1fr; gap:8px;}}

/* Catalog grid (product tiles) */
.catalog-search{
  display:flex; align-items:center; gap:14px;
  background:var(--panel); border:1px solid var(--line); border-radius:30px;
  padding:16px 24px; margin-bottom:28px;
}
.catalog-search svg{width:18px; height:18px; flex-shrink:0; color:var(--steel);}
.catalog-search input{
  background:none; border:none; padding:0; font-size:16px; color:var(--paper);
}
.catalog-search input::placeholder{color:var(--steel);}

.catalog-tabs{display:flex; flex-wrap:wrap; gap:12px; margin-bottom:40px;}
.tab-btn{
  display:inline-flex; align-items:center; gap:9px;
  background:var(--panel); border:1px solid var(--line); color:var(--paper-dim);
  padding:11px 22px; border-radius:30px; font-family:'IBM Plex Sans',sans-serif;
  font-size:14.5px; cursor:pointer; transition:all .15s ease;
}
.tab-btn .tico{width:16px; height:16px; flex-shrink:0;}
.tab-btn:hover{border-color:var(--steel); color:var(--paper);}
.tab-btn.active{background:var(--panel-2); border-color:var(--amber); color:var(--paper);}
.tab-btn.active .tico{color:var(--amber);}

.product-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(270px, 1fr));
  gap:2px;
  background:var(--line);
  border:1px solid var(--line);
}
.product-card{
  background:var(--graphite);
  padding:0;
  display:flex; flex-direction:column;
  transition:background .15s ease;
}
.product-card:hover{background:var(--panel);}
.product-thumb{
  aspect-ratio:4/3;
  background:
    linear-gradient(135deg, var(--panel) 0%, var(--panel-2) 100%);
  position:relative;
  overflow:hidden;
  border-bottom:1px solid var(--line);
}
.product-thumb::before{
  content:'';
  position:absolute; inset:0;
  background-image:
    repeating-linear-gradient(90deg, var(--line) 0 1px, transparent 1px 34px),
    repeating-linear-gradient(0deg, var(--line) 0 1px, transparent 1px 34px);
  opacity:0.5;
}
.product-thumb .thumb-tag{
  position:absolute; top:12px; left:12px;
  font-family:'IBM Plex Mono',monospace; font-size:11px;
  background:var(--amber); color:#fff; padding:4px 9px; border-radius:2px;
  z-index:1;
}
.product-thumb .thumb-icon{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  z-index:1;
}
.product-thumb svg{width:44%; height:44%; opacity:0.85;}
.product-body{padding:22px 22px 24px; display:flex; flex-direction:column; gap:10px; flex:1;}
.product-body .pname{font-family:'Oswald',sans-serif; font-size:20px; color:var(--paper);}
.product-body .pcat{font-size:12.5px; color:var(--steel); font-family:'IBM Plex Mono',monospace;}
.product-body .pspec{font-size:14px; color:var(--paper-dim); flex:1;}
.product-body .pfoot{
  display:flex; align-items:center; justify-content:space-between;
  margin-top:8px; padding-top:14px; border-top:1px solid var(--line);
}
.product-body .prating{font-family:'Oswald',sans-serif; font-size:16px; color:var(--amber);}
.product-body .plink{font-size:13.5px; color:var(--steel); text-decoration:none;}
.product-body .plink:hover{color:var(--paper);}
.catalog-note{color:var(--paper-dim); font-size:14px; margin-top:28px;}

/* Product detail page */
.pd-hero{padding:56px 0 0;}
.pd-grid{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start;}
@media (max-width:900px){.pd-grid{grid-template-columns:1fr;}}
.pd-gallery-main{
  aspect-ratio:4/3; border:1px solid var(--line); background:
    linear-gradient(150deg, var(--panel) 0%, var(--panel-2) 60%, #dfe8ec 100%);
  position:relative; overflow:hidden; margin-bottom:12px;
}
.pd-gallery-main::before{
  content:''; position:absolute; inset:0;
  background-image:
    repeating-linear-gradient(90deg, var(--line) 0 1px, transparent 1px 40px),
    repeating-linear-gradient(0deg, var(--line) 0 1px, transparent 1px 40px);
  opacity:0.4;
}
.pd-gallery-main .pd-badge{
  position:absolute; top:16px; left:16px; z-index:2;
  font-family:'IBM Plex Mono',monospace; font-size:11.5px;
  background:var(--amber); color:#fff; padding:5px 11px; border-radius:2px;
}
.pd-gallery-main svg{position:relative; z-index:1; width:70%; height:70%; margin:auto; display:block; top:15%;}
.pd-thumbs{display:grid; grid-template-columns:repeat(4,1fr); gap:10px;}
.pd-thumb{
  aspect-ratio:1/1; border:1px solid var(--line); background:var(--panel);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition:border-color .15s ease;
}
.pd-thumb:hover, .pd-thumb.active{border-color:var(--amber);}
.pd-thumb svg{width:56%; height:56%;}
.pd-eyebrow{font-family:'IBM Plex Mono',monospace; font-size:13px; color:var(--amber); margin:0 0 14px;}
.pd-title{font-size:clamp(32px,4.2vw,48px); margin-bottom:14px;}
.pd-tagline{color:var(--paper-dim); font-size:16.5px; max-width:44ch; margin-bottom:28px;}
.pd-keyspecs{display:grid; grid-template-columns:1fr 1fr; gap:0; border-top:1px solid var(--line); margin-bottom:28px;}
.pd-keyspecs .ks{padding:16px 0; border-bottom:1px solid var(--line);}
.pd-keyspecs .ks:nth-child(odd){padding-right:20px;}
.pd-keyspecs .ks .ks-num{font-family:'Oswald',sans-serif; font-size:24px; color:var(--paper);}
.pd-keyspecs .ks .ks-lbl{font-size:13px; color:var(--steel); margin-top:2px;}
.pd-cta-row{display:flex; gap:16px; flex-wrap:wrap;}

/* Feature list (checkmarks) */
.feature-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:2px; background:var(--line); border:1px solid var(--line);}
@media (max-width:700px){.feature-grid{grid-template-columns:1fr;}}
.feature-item{background:var(--graphite); padding:26px 28px;}
.feature-item .fi-icon{color:var(--amber); font-family:'Oswald',sans-serif; font-size:20px; margin-bottom:10px;}
.feature-item h3{font-size:17px; margin-bottom:8px;}
.feature-item p{color:var(--paper-dim); font-size:14.5px; margin:0;}

/* Downloads */
.dl-list{display:flex; flex-direction:column;}
.dl-item{
  display:flex; align-items:center; justify-content:space-between;
  padding:20px 0; border-top:1px solid var(--line);
}
.dl-list .dl-item:last-child{border-bottom:1px solid var(--line);}
.dl-item .dl-name{font-family:'Oswald',sans-serif; font-size:17px;}
.dl-item .dl-meta{font-size:13px; color:var(--steel); margin-top:3px;}
.dl-item a{
  font-size:14px; text-decoration:none; color:var(--amber); border:1px solid var(--line);
  padding:9px 18px; border-radius:2px; transition:border-color .15s ease;
}
.dl-item a:hover{border-color:var(--amber);}

/* Spec table */
.spectable{width:100%; border-collapse:collapse; font-size:15px;}
.spectable th{
  text-align:left; font-family:'IBM Plex Mono',monospace; font-weight:500;
  font-size:13px; color:var(--steel); padding:12px 20px 12px 0; border-bottom:1px solid var(--line);
}
.spectable td{padding:16px 20px 16px 0; border-bottom:1px solid var(--line); color:var(--paper-dim);}
.spectable td:first-child, .spectable th:first-child{color:var(--paper); font-weight:500; padding-left:0;}
.spectable{margin-top:8px;}
.tablewrap{overflow-x:auto;}

/* Process steps - genuine sequence */
.approach-list{display:grid; grid-template-columns:repeat(4,1fr); gap:0;}
.approach-item{border-top:1px solid var(--line); padding:26px 26px 0 0; position:relative;}
.approach-item:not(:last-child){border-right:1px solid var(--line);}
.approach-item .idx{font-family:'Oswald',sans-serif; color:var(--amber); font-size:15px; margin-bottom:14px;}
.approach-item h3{font-size:19px; margin-bottom:10px;}
.approach-item p{color:var(--paper-dim); font-size:14.5px; margin:0 0 26px;}
@media (max-width:860px){
  .approach-list{grid-template-columns:1fr 1fr;}
  .approach-item:nth-child(2n){border-right:none;}
}
@media (max-width:520px){
  .approach-list{grid-template-columns:1fr;}
  .approach-item{border-right:none !important;}
}

/* Panels / bands */
.band{background:var(--panel); border-bottom:1px solid var(--line);}
.band-2{background:var(--panel-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}

.chip-row{display:flex; flex-wrap:wrap; gap:14px;}
.chip{border:1px solid var(--line); padding:11px 20px; border-radius:2px; font-size:15px; color:var(--paper-dim);}

/* Page hero (product pages) */
.page-hero{padding:72px 0 56px; border-bottom:1px solid var(--line);}
.page-hero .eyebrow{font-family:'IBM Plex Mono',monospace; font-size:13px; color:var(--amber); margin:0 0 16px;}
.page-hero h1{font-size:clamp(36px,5.4vw,60px); max-width:16ch;}
.page-hero .sub{color:var(--paper-dim); max-width:52ch; margin-top:20px; font-size:17px;}
.page-hero-grid{display:grid; grid-template-columns:7fr 5fr; gap:56px; align-items:end;}
@media (max-width:860px){.page-hero-grid{grid-template-columns:1fr;}}
.crumb{font-size:13px; color:var(--steel); margin-bottom:18px;}
.crumb a{text-decoration:none; color:var(--steel);}
.crumb a:hover{color:var(--paper-dim);}

/* Contact / CTA panel */
.cta{background:var(--panel-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.cta-grid{display:grid; grid-template-columns:5fr 7fr; gap:56px;}
.cta h2{font-size:clamp(28px,4vw,44px); max-width:12ch;}
.cta .desc{color:var(--paper-dim); margin-top:18px; max-width:42ch;}
.contact-details{margin-top:32px; display:flex; flex-direction:column; gap:10px; font-size:15px; color:var(--paper-dim);}
.contact-details strong{color:var(--paper); font-weight:500;}
form{display:grid; gap:18px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
@media (max-width:600px){.form-row{grid-template-columns:1fr;} .cta-grid{grid-template-columns:1fr;}}
label{font-size:13px; color:var(--steel); display:block; margin-bottom:7px;}
input,textarea,select{
  width:100%; background:var(--graphite); border:1px solid var(--line); color:var(--paper);
  padding:12px 14px; font-family:inherit; font-size:15px; border-radius:2px;
}
textarea{min-height:120px; resize:vertical;}
::placeholder{color:#9aa7b3;}

footer{padding:40px 0;}
.foot-row{
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;
  color:var(--steel); font-size:13.5px;
}
.foot-row a{text-decoration:none; color:var(--steel);}
.foot-row a:hover{color:var(--paper-dim);}

/* ============================================================
   PRODUCT PHOTOGRAPHY
   ============================================================ */
.product-thumb.has-photo{
  background:#fff;
}
.product-thumb.has-photo::before{
  opacity:0.28;
}
.thumb-photo{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:contain;
  padding:16px;
  z-index:1;
  mix-blend-mode:multiply;
  transition:transform .5s cubic-bezier(.2,.7,.3,1);
}
.product-card:hover .thumb-photo{transform:scale(1.06);}
.product-card{
  border:1px solid var(--line);
  transition:background .2s ease, transform .25s cubic-bezier(.2,.7,.3,1), box-shadow .25s ease, border-color .2s ease;
}
.product-card:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 34px -18px rgba(15,42,74,0.45);
  border-color:var(--amber);
}

.pd-gallery-main{background:#fff;}
.pd-photo{
  width:100%; height:100%;
  object-fit:contain;
  padding:22px;
  mix-blend-mode:multiply;
  transition:transform .5s cubic-bezier(.2,.7,.3,1);
}
.pd-gallery-main:hover .pd-photo{transform:scale(1.05);}
.pd-thumb{background:#fff; overflow:hidden; cursor:pointer;}
.pd-thumb img{
  width:100%; height:100%; object-fit:contain; padding:6px;
  mix-blend-mode:multiply;
}

/* ============================================================
   MOTION — scroll reveal
   ============================================================ */
[data-reveal]{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .7s cubic-bezier(.2,.7,.3,1), transform .7s cubic-bezier(.2,.7,.3,1);
  transition-delay:var(--d, 0ms);
  will-change:opacity, transform;
}
[data-reveal].is-in{opacity:1; transform:none;}

/* hero intro */
.page-hero .eyebrow,
.page-hero h1,
.page-hero .sub,
.page-hero .btn,
.pd-hero .pd-eyebrow,
.pd-hero .pd-title,
.pd-hero .pd-tagline{
  animation:heroUp .85s cubic-bezier(.2,.7,.3,1) both;
}
.page-hero h1, .pd-hero .pd-title{animation-delay:.08s;}
.page-hero .sub, .pd-hero .pd-tagline{animation-delay:.16s;}
.page-hero .btn{animation-delay:.24s;}
@keyframes heroUp{
  from{opacity:0; transform:translateY(26px);}
  to{opacity:1; transform:none;}
}

/* animated accent sweep behind the hero */
.page-hero, .pd-hero{position:relative; overflow:hidden;}
.page-hero::after, .pd-hero::after{
  content:'';
  position:absolute;
  width:820px; height:820px;
  top:-380px; right:-260px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(62,160,66,0.10) 0%, rgba(62,160,66,0) 68%);
  pointer-events:none;
  animation:drift 18s ease-in-out infinite alternate;
}
@keyframes drift{
  from{transform:translate3d(0,0,0) scale(1);}
  to{transform:translate3d(-60px,48px,0) scale(1.12);}
}

/* stat counters */
.stat .num{display:inline-block;}

/* production-line cards on the home page */
.line-item{
  position:relative;
  transition:transform .25s cubic-bezier(.2,.7,.3,1), background .2s ease;
}
.line-item::after{
  content:'';
  position:absolute; left:0; bottom:0;
  height:2px; width:0;
  background:var(--amber);
  transition:width .45s cubic-bezier(.2,.7,.3,1);
}
.line-item:hover::after{width:100%;}
.line-item:hover{transform:translateX(6px);}
.line-item .go{transition:transform .25s ease, color .2s ease;}
.line-item:hover .go{transform:translateX(6px); color:var(--amber);}

/* feature + process cards */
.feature-item, .approach-item{
  transition:transform .25s cubic-bezier(.2,.7,.3,1), box-shadow .25s ease;
}
.feature-item:hover, .approach-item:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 30px -20px rgba(15,42,74,0.5);
}

/* chips */
.chip{transition:background .2s ease, color .2s ease, transform .2s ease;}
.chip:hover{background:var(--amber); color:#fff; transform:translateY(-2px);}

/* buttons */
.btn{transition:transform .18s ease, box-shadow .2s ease, background .2s ease, color .2s ease;}
.btn:hover{transform:translateY(-2px);}
.btn-primary:hover{box-shadow:0 10px 24px -12px rgba(62,160,66,0.75);}

/* nav underline */
nav a{position:relative;}
nav a::after{
  content:'';
  position:absolute; left:0; bottom:-5px;
  height:2px; width:0;
  background:var(--amber);
  transition:width .28s cubic-bezier(.2,.7,.3,1);
}
nav a:hover::after, nav a.active::after{width:100%;}

/* spec table rows */
.spectable tbody tr{transition:background .18s ease;}
.spectable tbody tr:hover{background:var(--panel);}

/* download rows */
.dl-item{transition:background .2s ease, padding-left .25s ease;}
.dl-item:hover{background:var(--panel); padding-left:8px;}

/* scroll progress bar */
.scroll-progress{
  position:fixed; top:0; left:0; height:3px; width:0;
  background:var(--amber);
  z-index:100;
  transition:width .08s linear;
}

@media (prefers-reduced-motion: reduce){
  [data-reveal]{opacity:1 !important; transform:none !important;}
  .page-hero::after, .pd-hero::after{animation:none;}
}

/* ============================================================
   ILLUSTRATED THUMBS (no photography supplied yet)
   ============================================================ */
.product-thumb:not(.has-photo){
  background:linear-gradient(150deg, #F7FAFB 0%, #E7EEF2 100%);
}
.product-thumb:not(.has-photo)::before{opacity:0.35;}
.product-thumb:not(.has-photo) svg{
  width:56%; height:56%;
  opacity:1;
  stroke-linecap:round;
  transition:transform .45s cubic-bezier(.2,.7,.3,1);
}
.product-card:hover .product-thumb:not(.has-photo) svg{transform:scale(1.08);}
.product-thumb:not(.has-photo) svg [stroke="var(--paper-dim)"]{stroke:#7C8C9C;}
.product-thumb:not(.has-photo) .thumb-icon::after{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(115deg, transparent 38%, rgba(255,255,255,.65) 50%, transparent 62%);
  transform:translateX(-120%);
  pointer-events:none;
}
.product-card:hover .product-thumb:not(.has-photo) .thumb-icon::after{
  animation:sheen 1.1s cubic-bezier(.3,.6,.4,1) forwards;
}
@keyframes sheen{to{transform:translateX(120%);}}

@media (prefers-reduced-motion: reduce){
  .product-card:hover .product-thumb:not(.has-photo) .thumb-icon::after{animation:none;}
}

/* ============================================================
   LAYOUT POLISH — rhythm, breathing room, card geometry
   ============================================================ */

/* vertical rhythm */
section{padding:104px 0;}
@media (max-width:760px){section{padding:68px 0;}}

.section-head{
  margin-bottom:52px;
  padding-top:6px;
  position:relative;
}
.section-head::before{
  content:'';
  position:absolute; top:-14px; left:0;
  width:44px; height:3px;
  background:var(--amber);
  transform:scaleX(0); transform-origin:left;
  transition:transform .6s cubic-bezier(.2,.7,.3,1) .1s;
}
.section-head.is-in::before{transform:scaleX(1);}
.section-head h2{line-height:1.12; max-width:16ch;}
.section-head .desc{line-height:1.7;}

h1{line-height:1.1;}
h3{line-height:1.25;}

/* ---- product grid: real gutters instead of hairlines ---- */
.product-grid{
  grid-template-columns:repeat(auto-fill, minmax(288px, 1fr));
  gap:24px;
}
.product-card{
  border:1px solid var(--line);
  border-radius:4px;
  overflow:hidden;
  background:var(--graphite);
}
.product-card:hover{background:var(--graphite);}
.product-thumb{
  aspect-ratio:4/3;
  border-bottom:1px solid var(--line);
}
.product-body{
  padding:24px 24px 26px;
  gap:12px;
}
.product-body .pcat{
  font-size:11.5px;
  letter-spacing:.09em;
  line-height:1.5;
}
.product-body .pname{
  font-size:21px;
  line-height:1.2;
  margin:2px 0 2px;
}
.product-body .pspec{
  font-size:14.5px;
  line-height:1.65;
}
.product-body .pfoot{
  margin-top:14px;
  padding-top:16px;
}
.catalog-note{margin-top:34px;}
.catalog-tabs{margin-bottom:34px; gap:10px;}
.searchbar{margin-bottom:22px;}

/* ---- feature + process cards ---- */
.feature-grid{gap:1px;}
.feature-item{padding:32px 34px 34px;}
.feature-item h3{margin-bottom:10px;}
.feature-item p{line-height:1.7; margin:0;}
.fi-icon{margin-bottom:14px;}

.approach-list{gap:26px;}
.approach-item{padding:28px 26px 4px 0;}
.approach-item h3{margin:10px 0 8px;}
.approach-item p{line-height:1.7; margin:0;}
.approach-item .idx{letter-spacing:.08em;}

/* ---- home page production lines ---- */
.line-item{padding:38px 0; gap:28px;}
.line-item .name{line-height:1.2;}
.line-item .desc{line-height:1.7;}

/* ---- stats ---- */
.stat{padding:20px 0;}
.stat .lbl{line-height:1.5; margin-top:4px;}

/* ---- hero ---- */
.page-hero{padding:84px 0 68px;}
.page-hero h1{margin-bottom:22px;}
.page-hero .eyebrow{margin-bottom:18px; letter-spacing:.1em;}
.page-hero .sub{line-height:1.75; max-width:56ch;}
.page-hero::before{
  content:'';
  position:absolute; inset:0;
  background-image:
    repeating-linear-gradient(90deg, var(--line) 0 1px, transparent 1px 86px),
    repeating-linear-gradient(0deg, var(--line) 0 1px, transparent 1px 86px);
  opacity:.32;
  pointer-events:none;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.9), transparent 78%);
  -webkit-mask-image:linear-gradient(to bottom, rgba(0,0,0,.9), transparent 78%);
}
.page-hero > .wrap{position:relative; z-index:1;}

/* ---- product detail page ---- */
.pd-hero{padding:64px 0 16px;}
.pd-title{line-height:1.12; margin-bottom:18px;}
.pd-tagline{line-height:1.75; margin-bottom:34px;}
.pd-keyspecs{gap:0 32px; margin-bottom:34px;}
.pd-keyspecs .ks{padding:18px 0;}
.pd-keyspecs .ks-lbl{margin-top:3px; line-height:1.4;}
.pd-thumbs{gap:12px; margin-top:12px;}
.pd-thumb{
  border:1px solid var(--line);
  border-radius:3px;
  aspect-ratio:1/1;
  transition:border-color .2s ease, transform .2s ease;
}
.pd-thumb:hover{transform:translateY(-2px);}
.pd-thumb.active{border-color:var(--amber);}
.pd-gallery-main{border:1px solid var(--line); border-radius:4px;}

/* ---- spec tables ---- */
.spectable th{padding:14px 22px 14px 0; letter-spacing:.07em;}
.spectable td{padding:18px 22px 18px 0; line-height:1.6;}

/* ---- downloads ---- */
.dl-item{padding:24px 0;}
.dl-name{margin-bottom:4px;}

/* ---- contact ---- */
.cta{padding:104px 0;}
.cta-grid{gap:64px;}
.contact-details{margin-top:36px; gap:14px; line-height:1.65;}
.contact-details strong{color:var(--paper);}
form .form-row{gap:18px;}
form label{margin-bottom:7px;}
form input, form textarea, form select{
  transition:border-color .2s ease, box-shadow .2s ease;
}
form input:focus, form textarea:focus, form select:focus{
  box-shadow:0 0 0 3px rgba(62,160,66,.14);
}

/* ---- chips ---- */
.chip-row{gap:12px;}
.chip{padding:12px 22px;}

/* ---- footer ---- */
footer{padding:36px 0;}
.foot-row{gap:14px; line-height:1.7;}

/* photo fade-in + hero wash parallax */
.thumb-photo, .pd-photo{opacity:0; transition:opacity .5s ease, transform .5s cubic-bezier(.2,.7,.3,1);}
.thumb-photo.img-ready, .pd-photo.img-ready{opacity:1;}
.page-hero::after, .pd-hero::after{
  translate:0 var(--wash-y, 0px);
}
@media (prefers-reduced-motion: reduce){
  .thumb-photo, .pd-photo{opacity:1;}
}
