/* ============================================================
   IMPO-RF — RF & Microwave Solutions
   Defense / aerospace technical homepage
   ============================================================ */

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

:root{
  /* Brand — client palette */
  --green:        #4B874B;   /* primary green */
  --green-600:    #437a43;
  --green-700:    #3a6b3a;   /* darker */
  --green-ink:    #41743f;   /* heading/text green */
  --green-sage:   #7EAE5B;   /* secondary sage */
  --green-900:    #2c532c;
  --green-950:    #1a311a;
  --green-tint:   #eef4ee;
  --mint-50:      #f5f9f3;
  --mint-100:     #ecf2e4;
  --yellow:       #F0C946;   /* gold */
  --yellow-600:   #d8af2c;
  --yellow-tint:  #fcf4d2;

  /* Greys */
  --ink:          #15211a;
  --slate:        #41514a;
  --grey:         #6c7d74;
  --grey-300:     #c4c9c4;
  --grey-200:     #dedede;
  --grey-100:     #eeeeee;
  --grey-50:      #F4F4F4;
  --paper:        #ffffff;

  /* Deep green surface (footer) — rich, not black */
  --dark:         #244a24;
  --dark-2:       #2d5a2d;
  --line-dark:    rgba(255,255,255,.14);
  --line:         #e2e2e2;

  /* Warm neutral greys for section areas */
  --grey-area:    #EFEFEF;
  --grey-area-2:  #e4e4e4;
  --grey-warm:    #F4F4F4;

  /* Radii — soft, friendly */
  --r-sm:  10px;
  --r:     16px;
  --r-lg:  22px;
  --r-xl:  28px;
  --r-pill: 999px;

  --maxw: 1320px;
  --pad: 48px;

  --mono: 'IBM Plex Mono', ui-monospace, monospace;
  --sans: 'IBM Plex Sans', system-ui, sans-serif;
  --head: 'Saira', system-ui, sans-serif;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--sans);
  color:var(--ink);
  background:var(--paper);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; }

.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 var(--pad); }

/* Shared eyebrow / mono label */
.eyebrow{
  font-family:var(--mono);
  font-size:12px;
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--green);
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.eyebrow::before{
  content:"";
  width:22px; height:2px;
  background:var(--yellow);
}
.eyebrow.on-dark{ color:var(--yellow); }
.eyebrow.on-dark::before{ background:var(--yellow); }

h1,h2,h3{ font-family:var(--head); font-weight:700; line-height:1.04; letter-spacing:-.01em; }

/* Buttons */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--mono); font-size:13px; font-weight:500;
  letter-spacing:.08em; text-transform:uppercase;
  padding:15px 26px; border-radius:var(--r-pill);
  transition:.18s ease;
}
.btn .arr{ transition:transform .18s ease; }
.btn:hover .arr{ transform:translateX(4px); }
.btn-primary{ background:var(--green); color:#fff; box-shadow:0 10px 24px -12px rgba(75,135,75,.7); }
.btn-primary:hover{ background:var(--green-700); }
.btn-yellow{ background:var(--yellow); color:var(--ink); box-shadow:0 10px 24px -12px rgba(216,175,44,.8); }
.btn-yellow:hover{ background:var(--yellow-600); }
.btn-ghost{ border:1px solid var(--line); color:var(--ink); background:#fff; }
.btn-ghost:hover{ border-color:var(--green); color:var(--green); }
.btn-ghost-d{ border:1px solid var(--line-dark); color:#fff; }
.btn-ghost-d:hover{ border-color:var(--yellow); color:var(--yellow); }

/* ============================================================
   TOP UTILITY BAR
   ============================================================ */
.utility{
  background:var(--dark);
  color:var(--grey-300);
  font-family:var(--mono);
  font-size:11px;
  border-bottom:1px solid var(--line-dark);
}
.utility .wrap{ display:flex; align-items:center; justify-content:space-between; height:38px; }
.utility .u-left{ display:flex; gap:22px; align-items:center; }
.utility .u-left span{ display:inline-flex; align-items:center; gap:8px; white-space:nowrap; }
.utility .u-left b{ color:#fff; font-weight:500; }
.utility .u-right{ display:flex; gap:8px; align-items:center; white-space:nowrap; }
.u-tag{ color:var(--yellow); letter-spacing:.12em; }
.u-soc{
  width:28px; height:28px; border:1px solid var(--line-dark);
  display:grid; place-items:center; border-radius:8px; color:var(--grey-300);
  transition:.16s;
}
.u-soc:hover{ border-color:var(--yellow); color:var(--yellow); }

/* ============================================================
   PRIMARY NAV
   ============================================================ */
.nav{ position:sticky; top:0; z-index:60; background:#fff; border-bottom:1px solid var(--line); }
.nav .wrap{ display:flex; align-items:center; justify-content:space-between; height:84px; }
.brand{ display:flex; align-items:center; gap:14px; }
.brand-logo{ height:46px; width:auto; }
.brand .logo-slot{ width:168px; height:48px; }
.brand .mark{
  width:46px; height:46px; border-radius:3px;
  background:var(--green); display:grid; place-items:center; flex:none;
}
.brand .mark svg{ width:30px; height:30px; }
.brand .word{ display:flex; flex-direction:column; line-height:1; }
.brand .word b{ font-family:var(--head); font-weight:800; font-size:24px; letter-spacing:.02em; color:var(--ink); }
.brand .word small{ font-family:var(--mono); font-size:9.5px; letter-spacing:.28em; color:var(--grey); text-transform:uppercase; margin-top:4px; }

/* Networked-globe lockup — header (on white) */
.brand-globe{ height:42px; width:42px; object-fit:contain; flex:none; }
.brand-word{ display:flex; flex-direction:column; line-height:1; }
.brand-word b{ font-family:var(--head); font-weight:800; font-size:26px; letter-spacing:-.01em; color:#41743f; }
.brand-word b i{ font-style:normal; color:#7EAE5B; }
.brand-word small{ font-family:var(--head); font-weight:600; font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:#d8af2c; margin-top:5px; }

/* Networked-globe lockup — footer (reversed, on dark) */
.foot-lockup{ display:flex; align-items:center; gap:14px; }
.foot-globe{ width:52px; height:52px; object-fit:contain; flex:none; }
.foot-word{ display:flex; flex-direction:column; line-height:1; }
.foot-word b{ font-family:var(--head); font-weight:800; font-size:30px; letter-spacing:-.01em; color:#fff; }
.foot-word b i{ font-style:normal; color:#F0C946; }
.foot-word small{ font-family:var(--head); font-weight:600; font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:#F0C946; margin-top:6px; }

.menu{ display:flex; align-items:center; gap:4px; }
.menu > li{ position:relative; list-style:none; }
.menu > li > a{
  display:flex; align-items:center; gap:6px;
  padding:0 16px; height:84px;
  font-size:14px; font-weight:600; color:var(--slate);
  border-bottom:3px solid transparent;
  transition:.16s;
}
.menu > li > a:hover{ color:var(--green); border-bottom-color:var(--green); }
.menu > li > a .chev{ width:9px; height:9px; opacity:.55; }

/* dropdown */
.dd{
  position:absolute; top:84px; left:0; min-width:300px;
  background:#fff; border:1px solid var(--line);
  box-shadow:0 24px 50px -18px rgba(12,30,18,.32);
  padding:10px; opacity:0; visibility:hidden; transform:translateY(8px);
  transition:.16s ease; border-radius:18px;
}
.menu > li:hover .dd{ opacity:1; visibility:visible; transform:translateY(0); }
.dd a{
  display:flex; align-items:center; gap:12px;
  padding:11px 14px; font-size:13.5px; font-weight:500; color:var(--slate);
  border-radius:10px; transition:.14s;
}
.dd a:hover{ background:var(--green-tint); color:var(--green); }
.dd a .dot{ width:6px; height:6px; background:var(--yellow); flex:none; border-radius:50%; }

.nav-cta{ display:flex; align-items:center; gap:14px; }
.menu > li > a.nav-contact{ background:var(--green); color:#fff; height:auto; padding:11px 20px; border-radius:var(--r-pill); margin-left:8px; }
.menu > li > a.nav-contact:hover{ background:var(--green-900); color:#fff; }
.menu > li > a.nav-contact.active{ background:var(--green-900); color:#fff; border-bottom-color:transparent; }
.nav-search{
  width:40px; height:40px; border:1px solid var(--line); border-radius:12px;
  display:grid; place-items:center; color:var(--slate); transition:.16s;
}
.nav-search:hover{ border-color:var(--green); color:var(--green); }

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative; overflow:hidden; color:var(--ink);
  background:
    radial-gradient(110% 80% at 92% 0%, var(--mint-100) 0%, transparent 52%),
    radial-gradient(80% 70% at 0% 100%, var(--yellow-tint) 0%, transparent 46%),
    linear-gradient(180deg, #ffffff 0%, var(--mint-50) 100%);
  border-bottom:1px solid var(--line);
}
.hero-grid{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(46% 60% at 86% 28%, rgba(126,174,91,.20) 0%, transparent 70%),
    radial-gradient(40% 50% at 70% 86%, rgba(240,201,70,.16) 0%, transparent 72%);
}
.hero .wrap{ position:relative; z-index:3; display:grid; grid-template-columns:1.03fr .97fr; gap:58px; align-items:center; padding-top:74px; padding-bottom:74px; }
.hero-copy{ max-width:640px; }
.hero h1{
  font-size:62px; font-weight:700; letter-spacing:-.02em; margin:22px 0 0; color:var(--ink);
}
.hero h1 .hl{ color:var(--green); background:linear-gradient(transparent 76%, rgba(240,201,70,.65) 76%, rgba(240,201,70,.65) 93%, transparent 93%); }
.hero h1 .gr{ color:var(--green-sage); }
.hero-sub{
  font-size:18px; color:var(--slate); max-width:560px; margin-top:24px; line-height:1.62;
}
.hero-actions{ display:flex; gap:14px; margin-top:34px; flex-wrap:wrap; }

/* hero media panel */
.hero-media{ position:relative; aspect-ratio:1.02/1; border-radius:var(--r-lg); }
.hero-media .hero-photo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:var(--r-lg); box-shadow:0 34px 70px -30px rgba(20,50,25,.42); }
.hero-media .panel-grid{ display:none; }
.hero-media .frame{ position:absolute; inset:0; z-index:3; border:1px solid rgba(20,50,25,.14); border-radius:var(--r-lg); pointer-events:none; }
.hero-readout{
  position:absolute; left:16px; bottom:16px; z-index:4;
  font-family:var(--mono); font-size:11px; letter-spacing:.08em; color:#fff;
  background:rgba(12,60,30,.72); backdrop-filter:blur(4px);
  padding:9px 13px; border-radius:var(--r-pill); display:flex; align-items:center; gap:9px;
}
.hero-readout .led{ width:7px; height:7px; border-radius:50%; background:#8cbf6a; box-shadow:0 0 9px #8cbf6a; }

/* hero spec readout, bottom strip */
.hero-spec{
  position:relative; z-index:3; border-top:1px solid rgba(255,255,255,.18);
  background:linear-gradient(110deg, var(--green-900) 0%, var(--green-ink) 55%, var(--green-sage) 130%);
}
.hero-spec .wrap{ display:grid; grid-template-columns:repeat(3,1fr); padding:0; }
.spec{
  padding:24px var(--pad); border-left:1px solid rgba(255,255,255,.16);
  display:flex; flex-direction:column; gap:5px;
}
.spec:first-child{ border-left:none; }
.spec .v{ font-family:var(--head); font-weight:700; font-size:32px; color:#fff; line-height:1; }
.spec .v em{ color:var(--yellow); font-style:normal; }
.spec .k{ font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.72); }

/* corner ticks decoration */
.tick{ position:absolute; width:13px; height:13px; z-index:5; }
.tick::before,.tick::after{ content:""; position:absolute; background:var(--yellow); }
.tick::before{ width:13px; height:2px; }
.tick::after{ width:2px; height:13px; }
.tick.tl{ top:-1px; left:-1px; }
.tick.tr{ top:-1px; right:-1px; }
.tick.tr::before{ right:0; } .tick.tr::after{ right:0; }
.tick.bl{ bottom:-1px; left:-1px; }
.tick.bl::before{ bottom:0; } .tick.bl::after{ bottom:0; }
.tick.br{ bottom:-1px; right:-1px; }
.tick.br::before{ right:0; bottom:0; } .tick.br::after{ right:0; bottom:0; }

/* ============================================================
   INDUSTRIES STRIP
   ============================================================ */
.industries{ background:linear-gradient(90deg, var(--green) 0%, var(--green) 42%, var(--green-sage) 100%); color:#fff; }
.industries .wrap{ display:flex; align-items:center; gap:0; height:62px; overflow:hidden; }
.ind-lab{ font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:#fff; white-space:nowrap; padding-right:30px; border-right:1px solid rgba(255,255,255,.28); opacity:.92; }
.ind-track{ display:flex; align-items:center; gap:34px; padding-left:30px; flex:1; flex-wrap:wrap; }
.ind-track span{ font-family:var(--head); font-weight:500; font-size:16px; color:#fff; white-space:nowrap; display:flex; align-items:center; gap:12px; }
.ind-track span::before{ content:""; width:6px; height:6px; background:var(--yellow); flex:none; }

/* ============================================================
   SECTION HEADER (shared)
   ============================================================ */
.section{ padding:104px 0; }
.section.grey{ background:var(--grey-area); }
.section#products{ background:linear-gradient(180deg, #edf1ed 0%, #e4ebe3 100%); }
.section#products .pcard-img{ background:#fff; }
.section.soft{ position:relative; background:linear-gradient(180deg, #f4f8f1 0%, #eaf3e6 55%, #e3efdd 100%); }
.section.soft::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:radial-gradient(rgba(75,135,75,.10) 1.3px, transparent 1.3px);
  background-size:24px 24px; mask-image:linear-gradient(180deg, transparent 4%, #000 55%); -webkit-mask-image:linear-gradient(180deg, transparent 4%, #000 55%); }
.section.soft > .wrap{ position:relative; z-index:1; }
.section.soft-grey{ position:relative; background:linear-gradient(180deg, #eef1ee 0%, #e8ece8 100%); }
.section.soft-grey > .wrap{ position:relative; z-index:1; }
.section.grey .cat-img{ background:#fff; }
.sec-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:40px; margin-bottom:54px; }
.sec-head .left{ max-width:660px; }
.sec-head h2{ font-size:46px; margin-top:18px; }
.sec-head p{ color:var(--grey); font-size:17px; margin-top:16px; max-width:560px; }

/* ============================================================
   PRODUCT CATEGORIES GRID
   ============================================================ */
.cats{ display:grid; grid-template-columns:repeat(6,1fr); gap:18px; }
.cat{
  position:relative; background:#fff; border:1px solid var(--line);
  display:flex; flex-direction:column; min-height:340px; overflow:hidden;
  border-radius:var(--r-lg); transition:.2s ease;
}
.cat:hover{ border-color:var(--green); box-shadow:0 26px 50px -28px rgba(12,30,18,.4); transform:translateY(-4px); }
/* feature spans */
.cat.feature{ grid-column:span 3; min-height:380px; }
.cat.half{ grid-column:span 3; }
.cat.third{ grid-column:span 2; }

.cat-img{ position:relative; flex:1; background:#fff; overflow:hidden; padding:16px; border-radius:16px; }
.cat-img img{ position:absolute; inset:16px; width:calc(100% - 32px); height:calc(100% - 32px); object-fit:cover; box-sizing:border-box; }
.cat-img img.contain{ object-fit:contain; padding:0; background:#fff; }
.cat-imglink{ display:flex; flex:1; min-height:0; width:100%; }
.cat-imglink > .cat-img{ flex:1; width:100%; }
.cat-body h3 a{ color:inherit; }
.cat:hover .cat-body h3 a{ color:var(--green); }
.cat-slide{ opacity:0; transition:opacity 1.5s ease; }
.cat-slide.on{ opacity:1; }
.cat:hover .cat-body h3{ color:var(--green); }
.cat-img img{ border-radius:16px; }
/* Shared FAQ accordion */
.home-faq{ max-width:880px; margin:0 auto; }
.faq-item{ background:#fff; border:1px solid var(--line); border-radius:14px; margin-bottom:12px; overflow:hidden; transition:.18s; }
.faq-item[open]{ border-color:var(--green-sage); box-shadow:0 16px 36px -26px rgba(20,50,25,.4); }
.faq-item summary{ list-style:none; cursor:pointer; padding:20px 24px; font-family:var(--display); font-size:18px; color:var(--ink); display:flex; justify-content:space-between; gap:16px; align-items:center; }
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{ content:"+"; font-size:26px; line-height:1; color:var(--green); font-weight:300; transition:transform .2s; flex:none; }
.faq-item[open] summary::after{ transform:rotate(45deg); }
.faq-item .faq-a{ padding:0 24px 22px; color:var(--slate); font-size:15.5px; line-height:1.72; }
.faq-item .faq-a p{ margin:0; }
.cat-tags span, .cat-tags a{ transition:background .4s ease, color .4s ease, border-color .4s ease; }
.cat-tags span.tag-on, .cat-tags a.tag-on{ background:var(--green); color:#fff; border-color:var(--green); }
.cat-num{
  position:absolute; top:14px; left:14px; z-index:3;
  font-family:var(--mono); font-size:11px; letter-spacing:.1em; color:#fff;
  background:var(--green); padding:6px 11px; border-radius:var(--r-pill);
}
.cat-body{ padding:22px 24px 26px; background:#fff; position:relative; z-index:2; }
.cat-body h3{ font-size:24px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.cat-body h3 .go{
  width:32px; height:32px; border:1px solid var(--line); border-radius:50%;
  display:grid; place-items:center; color:var(--green); flex:none; transition:.16s;
}
.cat:hover .cat-body h3 .go{ background:var(--green); color:#fff; border-color:var(--green); }
.cat-tags{ display:flex; flex-wrap:wrap; gap:7px; margin-top:14px; }
.cat-tags span, .cat-tags a{
  font-family:var(--mono); font-size:11px; letter-spacing:.04em;
  color:var(--slate); background:var(--grey-warm); border:1px solid var(--line);
  padding:6px 12px; border-radius:var(--r-pill); cursor:pointer; transition:.18s;
}
.cat-tags a:hover{ background:var(--green); color:#fff; border-color:var(--green); }

/* ============================================================
   CAPABILITIES / WHY US
   ============================================================ */
.caps{ display:grid; grid-template-columns:1.05fr 1fr; gap:64px; align-items:center; }
.caps-media{ position:relative; }
.caps-cap{ margin-top:40px; font-size:13.5px; line-height:1.55; color:var(--slate); font-style:italic; padding:0 6px 0 220px; }
.caps-media .caps-photo{ width:100%; height:480px; object-fit:contain; padding:18px; box-sizing:border-box; background:#fff; border-radius:var(--r-xl); border:1px solid var(--line); }
.caps-badge{
  position:absolute; bottom:-26px; left:-26px; background:var(--green);
  color:#fff; padding:24px 28px; max-width:230px; border-radius:var(--r-lg);
  box-shadow:0 24px 44px -22px rgba(75,135,75,.6);
}
.caps-badge .v{ font-family:var(--head); font-weight:700; font-size:42px; line-height:1; }
.caps-badge .k{ font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; margin-top:8px; color:#d8f3df; }
.cap-list{ margin-top:36px; display:flex; flex-direction:column; gap:14px; }
.cap-item{ display:flex; gap:20px; padding:22px; background:var(--grey-warm); border:1px solid var(--line); border-radius:var(--r); }
.cap-ico{
  width:50px; height:50px; flex:none; border-radius:var(--r-sm);
  display:grid; place-items:center; color:#fff; background:var(--green-sage);
}
.cap-ico svg{ width:24px; height:24px; }
.cap-item h3{ font-size:20px; }
.cap-item p{ color:var(--grey); font-size:15px; margin-top:6px; }

/* ============================================================
   MANUFACTURERS
   ============================================================ */
.mfr-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:14px; }
.mfr-marquee{ display:flex; flex-direction:column; gap:14px; margin-top:8px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%); }
.mfr-row{ overflow:hidden; }
.mfr-track{ display:flex; gap:14px; width:max-content; animation:mfrscroll 60s linear infinite; }
.mfr-row.rev .mfr-track{ animation-direction:reverse; animation-duration:72s; }
.mfr-marquee:hover .mfr-track{ animation-play-state:paused; }
.mfr-marquee .mfr{ flex:0 0 auto; width:172px; }
@keyframes mfrscroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){ .mfr-track{ animation:none; } }
.mfr{
  aspect-ratio:16/9; border:1px solid var(--line); border-radius:var(--r);
  background:#fff; transition:.18s ease; position:relative; min-width:0; overflow:hidden;
}
.mfr:hover{ border-color:var(--green); box-shadow:0 18px 36px -24px rgba(12,30,18,.35); transform:translateY(-3px); }
.mfr img{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); max-width:84%; max-height:74%; width:auto; height:auto; object-fit:contain; filter:saturate(.96); transition:.18s ease; }
.mfr:hover img{ filter:saturate(1.08); transform:translate(-50%,-50%) scale(1.05); }
.mfr .ph{ font-family:var(--mono); font-size:12px; letter-spacing:.1em; color:var(--grey-300); }

/* ============================================================
   STATS / CTA BAND
   ============================================================ */
.cta{ position:relative; background:linear-gradient(135deg, var(--green) 0%, var(--green) 50%, var(--green-sage) 125%); color:#fff; overflow:hidden; border-radius:var(--r-xl); margin:28px 24px; }
.cta-grid{
  position:absolute; inset:0;
  background:
    radial-gradient(50% 80% at 82% 30%, rgba(255,255,255,.16) 0%, transparent 70%),
    radial-gradient(40% 70% at 95% 100%, rgba(240,201,70,.22) 0%, transparent 72%);
}
.cta .wrap{ position:relative; z-index:2; padding:96px var(--pad); display:grid; grid-template-columns:1.2fr 1fr; gap:60px; align-items:center; }
.cta h2{ font-size:52px; }
.cta h2 .hl{ color:var(--yellow); }
.cta p{ color:#e3f6e9; font-size:18px; margin-top:20px; max-width:480px; }
.cta-actions{ display:flex; gap:14px; margin-top:34px; flex-wrap:wrap; }
.cta-card{
  background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.22); padding:34px; backdrop-filter:blur(2px); border-radius:var(--r-lg);
}
.cta-card .eyebrow{ margin-bottom:18px; }
.cta-row{ display:flex; align-items:center; gap:14px; padding:16px 0; border-top:1px solid rgba(255,255,255,.18); font-family:var(--mono); font-size:14px; }
.cta-row:first-of-type{ border-top:none; }
.cta-row .ci{ width:36px; height:36px; border:1px solid rgba(255,255,255,.28); border-radius:50%; display:grid; place-items:center; color:var(--yellow); flex:none; }
.cta-row b{ color:#fff; font-weight:500; }
.cta-row small{ display:block; color:#bfe6ca; font-size:11px; letter-spacing:.1em; text-transform:uppercase; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer{ background:var(--dark); color:#bfe6ca; padding:74px 0 0; }
.foot-top{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:48px; padding-bottom:54px; border-bottom:1px solid var(--line-dark); }
.foot-brand .mark{ width:44px; height:44px; border-radius:3px; background:var(--green); display:grid; place-items:center; }
.foot-brand .mark svg{ width:28px; height:28px; }
.foot-brand .mark.logo{ width:auto; height:auto; max-width:230px; border-radius:0; background:transparent; place-items:start; }
.foot-brand .mark.logo img{ width:100%; max-width:220px; height:auto; display:block; }
.foot-brand p{ margin-top:22px; font-size:14px; max-width:330px; line-height:1.7; color:#cde9d4; }
.foot-col h4{ font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--yellow); margin-bottom:18px; }
.foot-col a{ display:block; font-size:14px; padding:7px 0; color:#cde9d4; transition:.14s; }
.foot-col a:hover{ color:#fff; }
.foot-bot{ display:flex; align-items:center; justify-content:space-between; padding:24px 0; font-family:var(--mono); font-size:12px; color:#9cc7a8; flex-wrap:wrap; gap:14px; }
.foot-bot a{ color:#9cc7a8; }
.foot-bot a:hover{ color:var(--yellow); }
.foot-soc{ display:flex; gap:10px; align-items:center; }
.foot-soc a{ width:34px; height:34px; border:1px solid var(--line-dark); display:grid; place-items:center; border-radius:10px; transition:.16s; }
.foot-soc a[aria-label="Privacy"], .foot-soc a[aria-label="Terms of Use"]{ width:auto; height:34px; padding:0 16px; font-family:var(--mono); font-size:12px; letter-spacing:.04em; color:#9cc7a8; }
.foot-soc a:hover{ border-color:var(--yellow); color:var(--yellow); }

@media (max-width:1200px){
  .cats{ grid-template-columns:repeat(4,1fr); }
  .cat.feature,.cat.half{ grid-column:span 2; }
  .cat.third{ grid-column:span 2; }
  .mfr-grid{ grid-template-columns:repeat(4,1fr); }
  .sys-grid{ grid-template-columns:repeat(2,1fr); }
}

/* ============================================================
   CATEGORY / SYSTEMS LANDING PAGE
   ============================================================ */
.menu > li > a.active{ color:var(--green); border-bottom-color:var(--green); }

.pagehead{
  position:relative; overflow:hidden;
  background:
    radial-gradient(85% 75% at 90% -12%, var(--mint-100) 0%, transparent 55%),
    linear-gradient(180deg, #ffffff 0%, var(--mint-50) 48%, var(--yellow-tint) 100%);
}
.pagehead .wrap{ padding:46px 0 56px; position:relative; z-index:2; }
.crumb{ font-family:var(--mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--grey); display:flex; align-items:center; gap:9px; }
.crumb a{ color:var(--grey); }
.crumb a:hover{ color:var(--green); }
.crumb .sep{ color:var(--grey-300); }
.crumb .cur{ color:var(--green); }
.pagehead .eyebrow{ margin-top:22px; }
.pagehead h1{ font-size:56px; margin:14px 0 0; }
.pagehead .lead{ font-size:18px; color:var(--slate); max-width:660px; margin-top:16px; line-height:1.62; }
.chip-row{ display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.chip{ font-family:var(--mono); font-size:12px; letter-spacing:.03em; color:var(--slate); background:#fff; border:1px solid var(--line); padding:9px 15px; border-radius:var(--r-pill); transition:.15s; display:inline-flex; align-items:center; gap:9px; }
.chip::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--yellow); flex:none; }
.chip:hover{ border-color:var(--green); color:var(--green); }

.sys-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.sys-card{ position:relative; background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; display:flex; flex-direction:column; transition:.2s ease; box-shadow:0 2px 4px rgba(20,50,25,.04); }
.sys-card:hover{ border-color:var(--green); box-shadow:0 26px 50px -28px rgba(20,50,25,.4); transform:translateY(-4px); }
.sys-logo{ height:150px; background:linear-gradient(150deg, #f6faf3 0%, #eaf4e6 100%); display:grid; place-items:center; padding:24px 26px; position:relative; overflow:hidden; border-bottom:2px solid var(--green-sage); }
.sys-logo img{ max-width:78%; max-height:96px; width:auto; height:auto; object-fit:contain; display:block; margin:auto; }
.sys-num{ position:absolute; top:14px; left:14px; font-family:var(--mono); font-size:11px; letter-spacing:.1em; color:#fff; background:var(--green); padding:5px 11px; border-radius:var(--r-pill); }
.sys-body{ padding:24px 24px 26px; display:flex; flex-direction:column; flex:1; }
.sys-label{ display:block; min-height:30px; font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--green); }
.sys-card h3{ font-size:21px; margin-top:9px; line-height:1.16; min-height:49px; }
.sys-mfr{ display:inline-flex; align-items:center; gap:8px; margin-top:13px; font-family:var(--mono); font-size:12px; color:var(--grey); }
.sys-mfr::before{ content:""; width:14px; height:2px; background:var(--yellow); }
.sys-mfr b{ color:var(--green-ink); font-weight:600; }
.sys-card p{ color:var(--grey); font-size:14px; margin-top:13px; line-height:1.6; flex:1; }
.sys-more{ display:inline-flex; align-items:center; gap:8px; margin-top:20px; font-family:var(--mono); font-size:12.5px; font-weight:500; letter-spacing:.06em; text-transform:uppercase; color:var(--green); }
.sys-more::after{ content:""; position:absolute; inset:0; z-index:2; }
.sys-card{ cursor:pointer; }
.sys-more{ display:none; }
.sys-card a[href]:not(.sys-more){ position:relative; z-index:3; }
.sys-more svg{ transition:transform .16s; }
.sys-card:hover .sys-more svg{ transform:translateX(4px); }

@media (max-width:760px){ .sys-grid{ grid-template-columns:1fr; } }
.amp-grid{ grid-template-columns:repeat(2,1fr); }
@media (max-width:760px){ .amp-grid{ grid-template-columns:1fr; } }

/* Decorative tinted section background — warm at top, greener toward the bottom */
.section.tint{
  position:relative;
  background:
    radial-gradient(80% 65% at 50% 132%, rgba(126,174,91,.26) 0%, transparent 72%),
    linear-gradient(180deg, var(--yellow-tint) 0%, #f5f6ec 38%, var(--mint-50) 68%, var(--mint-100) 100%);
}
.section.tint::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:radial-gradient(rgba(75,135,75,.11) 1.4px, transparent 1.4px);
  background-size:26px 26px;
  -webkit-mask-image:linear-gradient(180deg, transparent 6%, #000 60%);
  mask-image:linear-gradient(180deg, transparent 6%, #000 60%);
}
.section.tint > .wrap{ position:relative; z-index:1; }

/* ============================================================
   MANUFACTURER PROFILE PAGE
   ============================================================ */
.mfrhero{
  position:relative; overflow:hidden;
  background:
    radial-gradient(60% 60% at 100% 0%, rgba(126,174,91,.18) 0%, transparent 60%),
    linear-gradient(180deg, var(--mint-100) 0%, var(--mint-50) 45%, var(--yellow-tint) 100%);
}
.mfrhero::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:radial-gradient(rgba(75,135,75,.09) 1.4px, transparent 1.4px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(110% 90% at 85% 0%, #000 20%, transparent 70%);
  mask-image:radial-gradient(110% 90% at 85% 0%, #000 20%, transparent 70%);
}
.mfrhero .wrap{ position:relative; z-index:2; display:grid; grid-template-columns:1.05fr .95fr; gap:54px; align-items:center; padding:30px 0 52px; }
.mfrhero-logo{ display:flex; width:max-content; max-width:100%; background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:18px 24px; align-items:center; box-shadow:0 4px 14px -6px rgba(20,50,25,.18); }
.mfrhero-logo img{ height:64px; width:auto; }
.mfrhero h1{ font-size:50px; margin:24px 0 0; }
.mfrhero .tag{ font-family:var(--head); font-size:21px; font-weight:600; color:var(--green-ink); margin-top:10px; }
.mfrhero p.intro{ color:var(--slate); font-size:16px; margin-top:16px; line-height:1.66; max-width:580px; }
.mfrhero .actions{ display:flex; gap:12px; margin-top:26px; flex-wrap:wrap; }
.mfrhero-media{ position:relative; }
.mfrhero-media img{ width:100%; height:440px; object-fit:cover; border-radius:var(--r-lg); box-shadow:0 30px 60px -28px rgba(20,50,25,.45); }
.mfrhero-media.product{ background:transparent;
  border-radius:28px; box-shadow:none; overflow:hidden; }
.mfrhero-media.product img{ object-fit:contain; padding:0; box-sizing:border-box; background:transparent; box-shadow:none; border-radius:28px; overflow:hidden; mix-blend-mode:normal; }
.mfrhero-media .tagchip{ position:absolute; left:16px; bottom:16px; font-family:var(--mono); font-size:11px; letter-spacing:.08em; color:#fff; background:rgba(20,50,25,.72); backdrop-filter:blur(4px); padding:9px 13px; border-radius:var(--r-pill); }

.facts{ display:flex; gap:34px; margin-top:30px; padding-top:24px; border-top:1px solid var(--line); flex-wrap:wrap; }
.fact b{ display:block; font-family:var(--head); font-weight:700; font-size:22px; color:var(--green-ink); line-height:1.1; white-space:nowrap; }
.fact span{ font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--grey); }

/* capability cards */
.capgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.capcard{ background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:26px; display:flex; flex-direction:column; transition:.2s ease; box-shadow:0 2px 4px rgba(20,50,25,.04); }
.capcard:hover{ border-color:var(--green); box-shadow:0 22px 44px -26px rgba(20,50,25,.4); transform:translateY(-4px); }
.capcard .cico{ width:46px; height:46px; border-radius:var(--r-sm); background:var(--green-sage); color:#fff; display:grid; place-items:center; }
.capcard .cico svg{ width:23px; height:23px; }
.capcard h3{ font-size:19px; margin-top:16px; }
.capcard p{ color:var(--grey); font-size:14px; margin-top:9px; line-height:1.6; flex:1; }
.capcard .more{ display:inline-flex; align-items:center; gap:7px; margin-top:16px; font-family:var(--mono); font-size:12px; font-weight:500; letter-spacing:.05em; text-transform:uppercase; color:var(--green); }
.capcard:hover .more svg{ transform:translateX(4px); }
.capcard .more svg{ transition:transform .16s; }

/* product cards */
.pgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.pcard{ background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; display:flex; flex-direction:column; transition:.2s ease; box-shadow:0 2px 4px rgba(20,50,25,.04); }
.pcard:hover{ border-color:var(--green); box-shadow:0 26px 50px -28px rgba(20,50,25,.4); transform:translateY(-4px); }
.pcard-img{ height:188px; overflow:hidden; position:relative;
  background:linear-gradient(150deg, #fcfcfb 0%, #f3f4f2 100%);
}
.pcard-img img{ width:100%; height:100%; object-fit:contain; padding:10px; box-sizing:border-box; mix-blend-mode:multiply; border-radius:12px; }
.pcard-img.photo img{ object-fit:contain; padding:8px; mix-blend-mode:multiply; }
.pcard-body{ padding:22px 22px 24px; display:flex; flex-direction:column; flex:1; }
.pcard .pn{ font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--green); }
.pcard h3{ font-size:19px; margin-top:7px; line-height:1.18; }
.pcard p{ color:var(--grey); font-size:13.5px; margin-top:10px; line-height:1.6; flex:1; }
.pcard .more{ display:inline-flex; align-items:center; gap:7px; margin-top:16px; font-family:var(--mono); font-size:12px; font-weight:500; letter-spacing:.05em; text-transform:uppercase; color:var(--green); }
.pcard .more svg{ transition:transform .16s; }
.pcard:hover .more svg{ transform:translateX(4px); }

/* about band */
.aboutgrid{ display:grid; grid-template-columns:1.15fr .85fr; gap:54px; align-items:start; }
.aboutgrid h2{ font-size:40px; }
.aboutgrid .body{ color:var(--slate); font-size:16px; line-height:1.75; margin-top:18px; }
.aboutgrid .body p{ margin-top:14px; }
.aboutcard{ background:#fff; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:0 16px 40px -26px rgba(20,50,25,.4); }
.aboutcard .ah{ background:linear-gradient(135deg,var(--green) 0%, var(--green-sage) 130%); color:#fff; padding:22px 24px; font-family:var(--head); font-weight:700; font-size:18px; }
.aboutcard .arow{ display:flex; gap:14px; padding:16px 24px; border-bottom:1px solid var(--line); font-size:14px; }
.aboutcard .arow:last-child{ border-bottom:none; }
.aboutcard .arow .k{ font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--grey); width:104px; flex:none; padding-top:2px; }
.aboutcard .arow .v{ color:var(--ink); font-weight:500; }
.aboutcard .arow .v a{ color:var(--green); }

@media (max-width:980px){
  .mfrhero .wrap, .aboutgrid{ grid-template-columns:1fr; }
  .capgrid, .pgrid{ grid-template-columns:repeat(2,1fr); }
}

/* ============================================================
   MOBILE / RESPONSIVE
   ============================================================ */
.nav-toggle{ display:none; }

@media (max-width:980px){
  :root{ --pad:20px; }

  /* Utility bar — keep tag + phone/socials, drop dense middle items */
  .utility .wrap{ height:auto; padding-top:6px; padding-bottom:6px; }
  .utility .u-left span:not(.u-tag){ display:none; }
  .utility .u-left{ gap:12px; }
  .utility .u-right > span{ font-size:11px; }

  /* Nav bar */
  .nav .wrap{ height:64px; justify-content:center; }
  .brand{ margin:0 auto; }
  .brand-logo{ height:44px; }
  .brand-globe{ height:38px; width:38px; }
  .brand-word b{ font-size:22px; }
  .brand-word small{ font-size:9px; letter-spacing:.16em; }
  .nav-search{ display:none; }
  .nav-cta .btn{ display:none; }
  .nav-cta{ gap:10px; }

  .nav-toggle{
    display:grid; place-items:center; width:44px; height:44px;
    position:fixed; top:10px; right:16px;
    border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--ink); z-index:130;
    box-shadow:0 4px 14px -6px rgba(0,0,0,.3);
  }
  .nav-toggle svg{ width:24px; height:24px; }

  /* Slide-in panel */
  .nav nav{ position:static; }
  .menu{
    position:fixed; top:0; right:0; bottom:0; width:min(86vw,360px);
    background:#fff; flex-direction:column; align-items:stretch; gap:0;
    padding:78px 0 40px; overflow-y:auto;
    transform:translateX(105%); transition:transform .28s cubic-bezier(.22,.7,.2,1);
    box-shadow:-24px 0 60px -24px rgba(0,0,0,.45); z-index:120;
  }
  body.nav-open{ overflow:hidden; }
  body.nav-open .menu{ transform:translateX(0); }
  body.nav-open::after{ content:""; position:fixed; inset:0; background:rgba(10,20,12,.5); z-index:50; }

  .menu > li{ position:static; border-bottom:1px solid var(--line); }
  .menu > li > a{
    height:auto; padding:16px 24px; font-size:16px; color:var(--ink);
    border-bottom:none; justify-content:space-between;
  }
  .menu > li > a:hover{ border-bottom-color:transparent; }
  .menu > li > a .chev{ width:15px; height:15px; opacity:.7; transition:transform .22s; }
  .menu > li.open > a{ color:var(--green); }
  .menu > li.open > a .chev{ transform:rotate(180deg); }

  /* dropdowns become accordions */
  .dd{
    position:static; opacity:1; visibility:visible; transform:none;
    box-shadow:none; border:none; border-radius:0; padding:0; min-width:0;
    max-height:0; overflow:hidden; transition:max-height .28s ease; background:var(--mint-50);
  }
  .menu > li:hover .dd{ transform:none; }
  .menu > li.open .dd{ max-height:640px; padding:6px 0 12px; }
  .dd a{ padding:13px 26px 13px 30px; font-size:14px; border-radius:0; }

  /* Hero */
  .hero .wrap{ grid-template-columns:1fr; gap:34px; padding-top:44px; padding-bottom:48px; }
  .hero h1{ font-size:40px; }
  .hero p.sub, .hero-copy p{ font-size:16px; }
  .hero-spec .wrap{ grid-template-columns:1fr 1fr; }
  .spec{ border-top:1px solid var(--line); }

  /* Industries marquee */
  .industries .wrap{ height:auto; flex-direction:column; align-items:flex-start; gap:10px; padding:16px var(--pad); }
  .ind-lab{ border-right:none; padding-right:0; }

  /* Section headers + spacing */
  .section{ padding:64px 0; }
  .pagehead .wrap{ padding-left:var(--pad); padding-right:var(--pad); }
  .pagehead h1{ font-size:40px; }
  .pagehead .lead{ font-size:16px; }
  .sec-head{ flex-direction:column; align-items:flex-start; gap:18px; margin-bottom:36px; }
  .sec-head h2, .aboutgrid h2{ font-size:30px; }
  .sec-head p{ font-size:15.5px; }

  /* Category cards */
  .cats{ grid-template-columns:1fr 1fr; }
  .cat, .cat.feature, .cat.half, .cat.third{ grid-column:span 1; min-height:260px; }

  /* Manufacturer marquee */
  .mfr-marquee .mfr{ width:140px; }

  /* CTA */
  .cta .wrap{ grid-template-columns:1fr; gap:34px; padding:60px var(--pad); }
  .cta h2{ font-size:34px; }
  .cta p{ font-size:16px; }

  /* Manufacturer hero / detail */
  .mfrhero h1{ font-size:38px; }
  .facts{ flex-wrap:wrap; }

  /* Footer */
  .foot-top{ grid-template-columns:1fr 1fr; gap:32px; }
  .foot-bot{ flex-direction:column; gap:14px; align-items:flex-start; }
}

@media (max-width:560px){
  .cats{ grid-template-columns:1fr; }
  .capgrid, .pgrid, .hero-spec .wrap{ grid-template-columns:1fr; }
  .foot-top{ grid-template-columns:1fr; }
  .hero h1{ font-size:34px; }
  .sec-head h2{ font-size:26px; }
  .cta h2{ font-size:28px; }
  .hero-actions{ flex-direction:column; align-items:stretch; }
  .hero-actions .btn{ justify-content:center; }
  .utility .u-left span.u-tag{ font-size:10px; }
}

/* ---- Mobile overflow & layout fixes ---- */
@media (max-width:980px){
  html, body{ overflow-x:clip; max-width:100%; }
  .mfr-marquee{ overflow:hidden; }
  /* Manufacturer hero — restore side padding + center on mobile */
  .mfrhero{ overflow:hidden; }
  .mfrhero .wrap{ padding-left:var(--pad); padding-right:var(--pad); text-align:center; justify-items:center; }
  .mfrhero-copy{ display:flex; flex-direction:column; align-items:center; }
  .mfrhero .crumb{ justify-content:center; }
  .mfrhero p.intro{ margin-left:auto; margin-right:auto; }
  .mfrhero .actions{ justify-content:center; }
  .mfrhero .facts{ flex-wrap:wrap; justify-content:center; }
  .mfrhero-media{ width:100%; max-width:100%; }
  .mfrhero-media img{ width:100%; max-width:100%; height:300px; }
  /* Manufacturer cards centered on mobile */
  .sys-body{ align-items:center; text-align:center; }
  .sys-mfr{ justify-content:center; }
  .sys-more{ justify-content:center; }
  /* Category cards: larger, fuller images */
  .cat{ min-height:300px; }
  .cat-img{ min-height:200px; }
  .cat-img img.contain{ object-fit:cover; padding:0; }
  /* "Why IMPO-RF" caps section stacks */
  .caps{ grid-template-columns:1fr; gap:36px; }
  .caps-media{ display:flex; flex-direction:column; }
  .caps-media .caps-photo{ height:320px; order:0; }
  .caps-badge{ order:1; position:static; align-self:flex-start; margin:-52px 0 0 16px; bottom:auto; left:auto; }
  .caps-cap{ order:2; padding:0 6px !important; margin-top:22px; }
  .caps-text h2{ font-size:30px !important; }
  /* Utility bar: let it wrap and shrink instead of overflowing */
  .utility .wrap{ flex-wrap:wrap; gap:6px 14px; }
  .utility .u-right{ flex-wrap:wrap; }
  .utility .u-right > span{ margin-right:8px !important; }
  /* Featured product band (McManus) stacks */
  .feat{ grid-template-columns:1fr !important; }
  .feat-media{ min-height:240px; }
  /* About page intro + contact form stack */
  .about-intro, .contact-wrap{ grid-template-columns:1fr !important; }
  .fgrid{ grid-template-columns:1fr !important; }
}
@media (max-width:560px){
  .utility .u-left span:not(.u-tag){ display:none; }
  .caps-media .caps-photo{ height:260px; }
}