/* ============================================
   UMG Technologies — Dark‑mode master stylesheet
   v2.3 • Header shrink, hero crop, asym overlap   2025‑06‑24
   ============================================ */

:root{
  --c-red:#E2231A;--c-charcoal:#1E1E1E;--c-charcoal-2:#2F2F2F;--c-charcoal-3:#0c0c0c;--c-white:#FFF;--c-grey-light:#D9D9D9;
  --c-blue:#3AB0FF;--c-green:#24C661;--c-amber:#FFB300;--c-error:#B00020;
  --font-site:"Inter","Segoe UI",sans-serif;
  /* layout vars */
  --header-pad-default:1.5rem;   /* tall state */
  --header-pad-small:0.5rem;     /* shrunk on scroll */
}

/* Hide Key Capabilities box on phones */
@media(max-width:720px){
  .key-capabilities-block{
    display:none !important;
  }
}

/* ─────────── Reset & base ─────────── */
*{box-sizing:border-box;margin:0;padding:0;font-family:var(--font-site);color:inherit;}
html,body{scroll-behavior:smooth;background:var(--c-charcoal);color:var(--c-white);line-height:1.5;}
body.nav-open{overflow:hidden;}
img,video{max-width:100%;display:block;}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline:2px solid var(--c-red);
  outline-offset:3px;
}

/* ─────────── Utilities ─────────── */
.container{width:min(90%,1200px);margin-inline:auto;}
.flex{display:flex;}.column{flex-direction:column;}.between{justify-content:space-between;}.center{align-items:center;}.gap-2{gap:2rem;}
.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;}

/* ─────────── Header (fixed opaque + shrink) ─────────── */
header{
  position:fixed;top:0;left:0;width:100%;z-index:1000;
  background:var(--c-charcoal-3);
  padding-block:var(--header-pad-default);
  transition:padding .25s ease;
  box-shadow:0 2px 6px rgba(0,0,0,.4);
}

header{
  background:var(--c-charcoal-3);
  padding:1.25rem 0;                 /* ← top + bottom */
}

/* smaller bar once scrolled */
header.shrink{
  padding:.4rem 0;                   /* any value you like */
}

/* make logo + nav links follow the shrink */
header .logo img{height:40px;}
header nav ul a{padding:.7rem 1rem;}

/* when header.shrink is active */
header.shrink .logo img{height:28px;}
header.shrink nav ul a{padding:.3rem 1rem;}

/* remove any easing so it just “snaps” */
header, header .logo img, header nav ul a{transition:none;}

/* ─────────── Mobile nav toggle & drawer ─────────── */
.nav-toggle{
  display:none;
  margin-left:auto;
  width:44px;height:44px;
  border:none;
  background:transparent;
  border-radius:12px;
  align-items:center;justify-content:center;gap:6px;
  padding:10px 12px;
  cursor:pointer;
  transition:.2s ease;
  flex-shrink:0;
  position:relative;
}
.nav-toggle span{
  width:18px;
  height:2px;
  display:block;
  background:var(--c-white);
  transition:transform .25s ease, opacity .2s ease;
  transform-origin:center;
}
.nav-toggle:hover,
.nav-toggle:focus-visible{
  outline:none;
}
body.nav-open .nav-toggle span:nth-child(1){transform:translateY(6px) rotate(45deg);}
body.nav-open .nav-toggle span:nth-child(2){opacity:0;}
body.nav-open .nav-toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}

.mobile-drawer{
  position:fixed;
  top:0;left:0;right:0;
  transform:translateY(-110%);
  width:100%;
  height:100vh;
  background:#000;
  box-shadow:0 14px 30px rgba(0,0,0,.35);
  padding:1.25rem 1.25rem 2rem;
  display:flex;flex-direction:column;gap:1.25rem;
  z-index:1200;
  transition:transform .28s ease;
  visibility:hidden;
  pointer-events:none;
  overflow-x:hidden;
}
.mobile-drawer__header{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:.75rem;
}
.mobile-drawer__scroll{
  overflow-y:auto;
  overflow-x:hidden;
  padding-right:.25rem;
  flex:1;
  min-height:0;
  -ms-overflow-style:none;
  scrollbar-width:none;
}
.mobile-drawer__scroll::-webkit-scrollbar{display:none;}
.mobile-logo{height:32px;}
.drawer-close{
  position:relative;
  width:28px;height:28px;
  border:none;
  background:transparent;
  color:var(--c-white);
  cursor:pointer;
  font-size:0;
  padding:0;
}
.drawer-close::before,
.drawer-close::after{
  content:"";
  position:absolute;
  top:50%;left:50%;
  width:22px;
  height:1.5px;
  background:var(--c-white);
  transform-origin:center;
  transition:background .2s ease;
}
.drawer-close::before{transform:translate(-50%,-50%) rotate(45deg);}
.drawer-close::after{ transform:translate(-50%,-50%) rotate(-45deg);}
.drawer-close:focus-visible{outline:2px solid var(--c-red);outline-offset:4px;}
.mobile-drawer__backdrop{
  position:fixed;inset:0;
  background:rgba(0,0,0,.55);
  opacity:0;pointer-events:none;
  transition:opacity .25s ease;
  z-index:1100;
}
body.nav-open .mobile-drawer{transform:translateY(0);visibility:visible;pointer-events:auto;}
body.nav-open .mobile-drawer__backdrop{opacity:1;pointer-events:auto;}

.mobile-nav{
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:.25rem;
  padding:0;
  margin:0;
  width:100%;
}
.mobile-nav > li,
.mobile-submenu,
.mobile-submenu li{width:100%;}
.mobile-nav,
.mobile-submenu{overflow-x:hidden;}
.mobile-nav .mega,
.mobile-nav .submega{
  position:static;
  opacity:1;
  pointer-events:auto;
  transform:none;
  width:100%;
  background:transparent;
  border:none;
  border-radius:0;
  box-shadow:none;
}
.mobile-nav .submega{padding-left:0;}
.mobile-nav a{color:var(--c-white);}
.mobile-nav > li > a{
  display:block;
  padding:.9rem .3rem;
  color:var(--c-white);
  font-weight:300;
  font-size:1.2rem;
  text-decoration:none;
  border-bottom:1px solid #333;
  letter-spacing:.01em;
}
.mobile-item-row{display:flex;}
.mobile-sub-toggle{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.5rem;
  padding:.9rem .3rem;
  background:transparent;
  border:none;
  border-radius:0;
  color:var(--c-white);
  cursor:pointer;
  text-align:left;
  font-size:1.05rem;
  letter-spacing:.01em;
  font-weight:300;
  font-size:1.2rem;
  border-bottom:1px solid #333;
}
.mobile-sub-toggle.nested{
  font-size:1.05rem;
  font-weight:300;
  padding:.55rem 0 .55rem 1.2rem;
  border-bottom:1px solid #333;
  color:var(--c-white);
}
.mobile-sub-toggle .chevron{display:inline-block;transform:rotate(90deg);transition:.2s;color:var(--c-white);}
/* top-level open state only affects its own toggle */
.mobile-nav > li.open > .mobile-item-row > .mobile-sub-toggle{color:var(--c-red);}
.mobile-nav > li.open > .mobile-item-row > .mobile-sub-toggle .chevron{transform:rotate(-90deg);color:var(--c-red);}
/* nested open state isolated */
.mobile-submenu .has-sub.open > .mobile-item-row > .mobile-sub-toggle{color:var(--c-red);}
.mobile-submenu .has-sub.open > .mobile-item-row > .mobile-sub-toggle .chevron{transform:rotate(-90deg);color:var(--c-red);}
.mobile-submenu{
  display:none;
  margin-top:0;
  padding:0;
  position:static;
  width:100%;
  opacity:1;
  pointer-events:auto;
  transform:none;
  background:var(--c-charcoal-3);
  border:none;
  box-shadow:none;
  border-radius:0;
}
.mobile-nav li.open > .mobile-submenu{display:block;}
.mobile-submenu a{
  display:block;
  padding:.55rem 0;
  text-decoration:none;
  color:var(--c-white);
  font-weight:300;
  letter-spacing:.01em;
  font-size:1.05rem;
  border-bottom:1px solid rgba(255,255,255,.05);
}
.mobile-submenu a:last-child{border-bottom:none;}
.mobile-submenu .has-sub{margin-top:.4rem;}
.mobile-submenu .has-sub > a{
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:var(--c-white);
  font-weight:600;
  padding:.4rem 0;
  border:none;
}
.mobile-submenu .has-sub .submega{
  display:none;
  padding-left:1.2rem;
}
.mobile-submenu .has-sub.open .submega{display:block;}
.mobile-submenu .submega{
  position:static;
  opacity:1;pointer-events:auto;transform:none;
  background:transparent;
  border:none;
  border-radius:0;
  box-shadow:none;
  padding-left:0;
  border-left:none;
}
.mobile-submenu .submega a{
  border:none;
  padding:.3rem 0 .3rem 1.2rem;
  font-size:.93rem;
}
.mobile-direct{
  display:block;
  padding:.35rem 1.4rem .35rem 1.2rem;
  font-weight:500;
  color:#c8c8c8;
  text-decoration:none;
  letter-spacing:.01em;
  font-size:.74rem;
  position:relative;
  padding-right:1.4rem;
}
.mobile-submenu .mobile-direct,
.mobile-submenu .mobile-direct::before,
.mobile-nav .mobile-direct,
.mobile-nav .mobile-direct::before{
  color:#c8c8c8;
}
.mobile-direct::before{
  content:"→";
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%);
  color:#c8c8c8;
}
.mobile-direct:hover{opacity:.85;}

/* Mobile drawer hover: center highlight with black fade on both sides */
.mobile-nav .mobile-sub-toggle,
.mobile-submenu a{
  transition:background .2s ease, color .2s ease;
}
.mobile-nav .mobile-sub-toggle:hover,
.mobile-nav .mobile-sub-toggle:focus-visible,
.mobile-submenu a:hover,
.mobile-submenu a:focus-visible{
  background:
    linear-gradient(
      90deg,
      rgba(0,0,0,.98) 0%,
      rgba(30,30,30,.94) 24%,
      rgba(47,47,47,.9) 50%,
      rgba(30,30,30,.94) 76%,
      rgba(0,0,0,.98) 100%
    );
}

/* Staggered reveal for mobile items */
.mobile-nav li{
  opacity:0;
  transform:translateY(-18px);
  transition:opacity .35s ease, transform .4s ease;
}
body.nav-open .mobile-nav li{opacity:1;transform:translateY(0);}
.mobile-nav li:nth-child(1){transition-delay:.05s;}
.mobile-nav li:nth-child(2){transition-delay:.10s;}
.mobile-nav li:nth-child(3){transition-delay:.15s;}
.mobile-nav li:nth-child(4){transition-delay:.20s;}
.mobile-nav li:nth-child(5){transition-delay:.25s;}
.mobile-nav li:nth-child(6){transition-delay:.30s;}
.mobile-nav li:nth-child(7){transition-delay:.35s;}

/*.logo{font-size:2rem;font-weight:700;text-decoration:none;color:var(--c-red);} .logo span{color:var(--c-grey-light);} */
.logo{
  display:inline-block;
  line-height:1;          /* kill extra baseline space */
}
.logo img{
  display:block;          /* removes bottom gap */
}

.adv-subtitle { 
  margin-top: .25rem; 
  font-size: 1.125rem; 
  opacity: .8; 
}

nav ul{list-style:none;}nav ul a{color:var(--c-white);text-decoration:none;font-weight:500;position:relative;padding:.75rem 1rem;display:inline-block;}
nav ul a::after{content:"";position:absolute;left:0;bottom:.4rem;width:0;height:2px;background:var(--c-red);transition:.3s;}
nav ul a:hover::after{width:100%;}

/* Mega‑menu */
nav ul li{position:relative;}.mega{position:absolute;left:0;top:100%;width:220px;background:var(--c-charcoal-2);border-radius:8px;box-shadow:0 8px 20px rgba(0,0,0,.4);opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s;}
nav ul li:hover>.mega{opacity:1;transform:translateY(0);pointer-events:auto;}
.mega a{display:block;padding:.75rem 1rem;color:var(--c-grey-light);font-weight:400;}.mega a:hover{background:var(--c-charcoal);color:var(--c-white);} 

/* nested fly-out ---------------------------------------------------------*/
.mega .has-sub{position:relative;}
.mega .arrow{float:right;font-size:1rem;opacity:.6;}
.submega{
  position:absolute;left:100%;top:0;
  width:220px;background:var(--c-charcoal-2);
  border-radius:4px;box-shadow:0 8px 20px rgba(0,0,0,.4);
  opacity:0;pointer-events:none;transform:translateX(10px);transition:.2s;
}
.has-sub:hover>.submega{opacity:1;pointer-events:auto;transform:translateX(0);}
.submega a{padding:.75rem 1rem;display:block;color:var(--c-grey-light);}
.submega a:hover{background:var(--c-charcoal);color:var(--c-white);}

/* CTA outline generic */
.btn-outline{padding:.5rem 1.5rem;border:2px solid var(--c-red);background:none;color:var(--c-red);border-radius:4px;cursor:pointer;transition:.2s;}
.btn-outline:hover{background:var(--c-red);color:#fff;}

/* ─────────── Hero (video bg) ─────────── */
.hero{
  height:100vh;
  height:100svh;
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow:hidden;
}

.hero .hero-bg{
  position:absolute;inset:0; /* full container */
  width:100%;height:100%;object-fit:cover;object-position:center;
  transform:translate3d(0, var(--hero-shift, 0px), 0) scale(1.08);
  transform-origin:center;
  will-change:transform;
  z-index:0;pointer-events:none;background:var(--c-charcoal);
}
.hero .hero-bg::-webkit-media-controls,.hero .hero-bg::-webkit-media-controls-start-playback-button{display:none!important;}

.hero iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  transform:translate3d(0, var(--hero-shift, 0px), 0) scale(1.16);
  transform-origin:center;
  will-change:transform;
  z-index:0;
}

@supports (height: 100dvh){
  .hero{
    height:100dvh;
  }
}

.solutions-hero .hero-bg{
  transform:translate3d(0, var(--hero-shift, 0px), 0) scale(1.12);
  transform-origin:center;
  will-change:transform;
}

.hero::before{
  content:"";                 /* makes the pseudo-element exist */
  position:absolute;          /* takes it out of normal flow      */
  inset:0;                    /* shorthand for top/right/bottom/left:0;
                                 stretches it to cover the hero   */
  background:
    radial-gradient(
      to bottom,              /* gradient direction               */
      rgba(30,30,30,.3) 0%,  /* 1st color stop (light charcoal)  */
      rgba(30,30,30,.9)  100%  /* 2nd stop  (darker, 85 % point)   */
    );
  z-index:1;                  /* sits above media, below text     */
  pointer-events:none;
}

.hero-text{position:relative;margin-top:4rem;z-index:2;text-shadow:0 2px 4px rgba(0,0,0,.6);} 
.hero h1{font-size:clamp(2.5rem,6vw,4rem);margin-bottom:.75rem;}
.hero p{font-size:1.25rem;}
.hero-cta{display:inline-block;margin-top:2rem;padding:.9rem 2.5rem;border:2px solid var(--c-white);border-radius:30px;backdrop-filter:blur(4px);font-weight:600;letter-spacing:.05em;text-transform:uppercase;transition:.3s;color:var(--c-white);} 
.hero-cta:hover{background:var(--c-red);border-color:var(--c-red);color:#fff;}

/* ─────────── Asym intro (rounded + overlap) ─────────── */
.asym{position:relative;padding:0 0 6rem 0;display:flex;gap:2rem;margin-top:-13rem;align-items:center;} /* pulls block upward over hero */
.asym .col{flex:1;background:var(--c-charcoal-2);border-radius:16px;padding:3rem;box-shadow:0 6px 20px rgba(0,0,0,.4);} 
.asym .col:first-child{max-width:530px;}
.asym > .col{margin-top:0 !important;margin-bottom:0 !important;}
.asym p{padding-left: 2rem;}

.home-asym,
.industry-page .asym.container.gap-2,
.services-page .services-intro{
  --shared-asym-lift:0px;
  margin-bottom:var(--shared-asym-lift);
  transform:translate3d(0, var(--shared-asym-lift), 0);
  will-change:transform;
  z-index:3;
}

.home-asym{
  margin-top:0;
}

/* ─────────── Content, partners, news, footer unchanged ─────────── */
.content{padding:4rem 0;}
.content h2{padding-bottom: 2rem;text-shadow:0 2px 4px rgba(0,0,0,.6);}
.alt-bg{background:var(--c-charcoal-2);} 
.card{background:var(--c-charcoal-2);padding:2rem;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.4);color:var(--c-grey-light);} 
.partners{padding:4rem 1rem;background:var(--c-charcoal-2);text-align:center;}.partners h2{margin-bottom:2rem;text-shadow:0 2px 4px rgba(0,0,0,.6);}.logo-grid{display:flex;flex-wrap:wrap;gap:2rem;justify-content:center;align-items:center;}.logo-grid img{height:60px;filter:grayscale(1);opacity:.8;transition:filter .3s,opacity .3s;}.logo-grid img:hover{filter:grayscale(0);opacity:1;}
.news-feed{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;margin-top:2rem;}.news-feed article{background:var(--c-charcoal-2);border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.4);padding:1.5rem;}

/* News slider cards */
.news-card{
  flex:0 0 328px;                 /* width per card */
  background:var(--c-charcoal-2);
  border-radius:10px; overflow:hidden;
  box-shadow:0 4px 14px rgba(0,0,0,.35);
  scroll-snap-align:start;
  display:flex; flex-direction:column;
}
.news-card img{ width:100%; height:160px; object-fit:cover; }
.news-card .meta{ padding:1rem 1rem 1.1rem; display:flex; flex-direction:column; gap:.4rem; }
.news-card h3{ font-size:1rem; line-height:1.35; }
.news-card .byline{ font-size:.85rem; color:var(--c-grey-light); opacity:.85; }
.news-card a{
  align-self:flex-start; margin-top:.35rem; text-decoration:none;
  border:1px solid var(--c-red); border-radius:999px; padding:.4rem .8rem; color:var(--c-red);
  transition:.2s;
}
.news-card a:hover{ background:var(--c-red); color:#fff; }

footer{
  background:var(--c-charcoal-3);
  color:var(--c-grey-light);
  padding:3.25rem 0 2.25rem;
  border-top:1px solid rgba(255,255,255,.08);
}

.footer-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-bottom:1.5rem;
  margin-bottom:2rem;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.footer-logo{height:36px;}

.footer-back-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:auto;height:auto;
  padding:.15rem 0;
  border-radius:0;
  border:none;
  color:var(--c-grey-light);
  background:transparent;
  text-decoration:none;
  transition:color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease;
}
.footer-back-btn:hover{
  color:var(--c-white);
  background:transparent;
  border-color:transparent;
  transform:translateY(-2px);
}

footer .footer-top{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.75rem 3rem;
  padding-bottom:2rem;
  margin:0 0 1.5rem;
  justify-items:start;
  border-bottom:1px solid rgba(255,255,255,.08);
}

footer h4{
  font-size:.95rem;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--c-white);
  font-weight:700;
  margin-bottom:.65rem;
}
footer h4 a{color:inherit;text-decoration:none;}

footer ul{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:.5rem;
}

footer a{
  color:var(--c-grey-light);
  text-decoration:none;
  opacity:.9;
  transition:color .2s ease, opacity .2s ease, transform .2s ease;
}
footer .footer-top a{line-height:1.5;}
footer a:hover{color:var(--c-white);opacity:1;}

.footer-bottom{
  display:flex;
  justify-content:flex-start;
  align-items:center;
  gap:1rem 1.5rem;
  flex-wrap:wrap;
  font-size:.95rem;
}

.sr-only{
  position:absolute;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

@media(max-width:720px){
  .footer-bottom{flex-direction:column;align-items:flex-start;}
}
@media(max-width:520px){
  footer .footer-top{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none;}
  .footer-logo{height:32px;}
}

/* ─────────── Product spec tables ─────────── */
.spec-table{
  width:100%;
  border-collapse:collapse;
  background:var(--c-charcoal-2);
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 6px 20px rgba(0,0,0,.35);
}
.spec-table th,
.spec-table td{
  padding:.9rem 1.1rem;
  border-bottom:1px solid rgba(255,255,255,.08);
  text-align:left;
}
.spec-table th{
  width:38%;
  color:var(--c-grey-light);
  font-weight:600;
  background:rgba(255,255,255,.02);
}
.spec-table tr:last-child th,
.spec-table tr:last-child td{border-bottom:none;}

/* ─────────── Media queries & responsive polish ─────────── */
@media(max-width:1100px){
  .asym{gap:1.5rem;}
}

@media(max-width:980px){
  header{padding:.95rem 0;}
  header .logo img{height:34px;}
  body.nav-ready nav.primary-nav{display:none;}
  body.nav-ready .nav-toggle{display:inline-flex;}
  header .container{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.85rem;
  }
  header .logo{
    margin-inline:0;
    flex:0 1 auto;
  }
  header .logo img{margin:0;}
  header .nav-toggle{
    position:static;
    left:auto;
    top:auto;
    transform:none;
    margin-left:auto;
    order:2;
  }
}

@media(max-width:900px){
  .hero{height:auto;padding-inline:1.5rem;padding-bottom:4rem;}
  .hero-text{margin-top:2rem;}
  .home-asym,
  .industry-page .asym.container.gap-2,
  .services-page .services-intro{
    margin-bottom:0;
    transform:none;
  }
  .home-asym{margin-top:0;}
  .asym{
    flex-direction:column;
    margin-top:0;
    padding-top:clamp(2rem,6vw,3rem)!important;
    padding-bottom:clamp(2rem,6vw,3rem)!important;
  }
  .asym .col{
    padding:clamp(1.4rem,5vw,2rem)!important;
    width:100%!important;
  }
  .asym .col:first-child,
  .asym .col:last-child{
    height:auto;
    margin:0!important;
  }
  .asym p{padding-left:0;}
  .content{padding:3rem 0;}
  .carousel-track{gap:1.25rem;}
}

@media(max-width:720px){
  .hero h1{font-size:clamp(2rem,7vw,2.8rem);}
  .hero p{font-size:1.05rem;}
  .hero-cta{width:100%;text-align:center;}
  .container{width:min(94%,1200px);} 
  .partners{padding:3rem 1rem;}
  .footer-bottom{flex-direction:column;align-items:flex-start;}
  .spec-table th{width:44%;}
  /* show one card at a time on mobile carousels */
  #solutionsTrack .solution-card{
    flex:0 0 100%;
    max-width:100%;
  }
  .carousel-track{gap:1rem;}
}

@media(max-width:560px){
  header{padding:.7rem 0;}
  .nav-toggle{width:42px;height:42px;}
  .hero{padding-inline:1rem;padding-bottom:3rem;}
  .content{padding:2.5rem 0;}
  .card{padding:1.5rem;}
  .news-card{flex:0 0 260px;}
}

/* ─────────── Mobile hero reflow (video on top, copy below) ─────────── */
@media(max-width:768px){
  .hero{
    display:flex;
    flex-direction:column;
    height:auto;
    min-height:auto;
    padding:0;
    gap:0;
  }
  .hero .hero-bg{
    position:static !important;
    width:100% !important;
    height:auto !important;
    aspect-ratio:16/9;
    display:block;
  }
  .hero iframe{
    position:static !important;
    width:100% !important;
    height:auto !important;
    aspect-ratio:16/9;
    display:block;
  }
  .hero .hero-bg,
  .hero iframe{
    transform:none !important;
  }
  .hero-text{
    position:static;
    margin:0;
    padding:calc(1.5rem + var(--header-pad-default)) 1.25rem 2.5rem;
    text-align:center;
    background:var(--c-charcoal-3);
  }
  .hero-cta{width:100%;}
}

@media(max-width:640px){
  .solutions-hero .hero-bg{
    transform:none !important;
  }
}

/* ─────────── Generic carousel scaffold ─────────── */
/* Generic carousel scaffold (fix paths + stacking + insets) */
/* ─────────── Generic carousel scaffold (grid layout, no overlap) ─────────── */
.carousel-wrapper{
  /* [prev] [track] [next] */
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:1rem;
  position:relative;
}

/* Track: keep snap scroll but hide scrollbars everywhere */
.carousel-track{
  display:flex;
  gap:2rem;
  overflow-x:auto;
  scroll-behavior:smooth;
  scroll-snap-type:x mandatory;
  padding:1rem 0;

  /* hide scrollbars: Edge/IE + Firefox + WebKit */
  -ms-overflow-style: none;   /* Edge legacy/IE */
  scrollbar-width: none;      /* Firefox */
}
.carousel-track::-webkit-scrollbar{ display:none; }  /* Chrome/Safari */

/* Buttons now sit left/right (not absolute) */
.carousel-btn{
  position:static;                 /* ← was absolute */
  width:44px; height:44px;
  padding:0; border:0;
  background: transparent center/contain no-repeat;
  background-image:url("../assets/icons/arrow-icon.png"); /* path is from css/ */
  cursor:pointer; opacity:.95;
  transition: background-image .15s ease, transform .15s ease, opacity .15s ease;
  font-size:0; line-height:0; color:transparent; /* hide any fallback glyph */
}

.carousel-btn.prev{ transform: scaleX(-1); }   /* reuse same PNG flipped */
.carousel-btn:hover,
.carousel-btn:focus-visible{
  background-image:url("../assets/icons/arrow-icon-red.png"); /* hover → red */
  outline:none;
  transform: scale(1.06);
}
.carousel-btn.prev:hover,
.carousel-btn.prev:focus-visible{
  transform: scaleX(-1) scale(1.06);
}

/* Optional: disabled state for your JS to toggle */
.carousel-btn:disabled{ opacity:.4; pointer-events:none; }

/* Flickity-inspired media gallery carousel (product pages) */
.product-page .gallery .carousel-wrapper{
  gap:clamp(.5rem,1.25vw,.95rem);
}

.product-page .gallery .carousel-track{
  gap:14px;
  padding:.55rem .65rem;
  scroll-padding-inline:.65rem;
  border-radius:14px;
  align-items:flex-end;
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.025));
}

.product-page .gallery .carousel-track > .gallery-item{
  flex:0 0 auto;
  width:auto;
  height:clamp(120px, 17vw, 215px);
  max-width:min(90vw, 980px);
  border-radius:12px;
  border:1px solid rgba(255,255,255,.14);
  background:transparent;
  box-shadow:0 12px 24px rgba(0,0,0,.34);
  scroll-snap-align:start;
  cursor:zoom-in;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.product-page .gallery .carousel-track > .gallery-item:hover,
.product-page .gallery .carousel-track > .gallery-item:focus-visible{
  transform:scale(1.016);
  box-shadow:0 18px 34px rgba(0,0,0,.46);
  border-color:rgba(255,255,255,.26);
}

.product-page .gallery .carousel-track > .gallery-item:active{
  transform:scale(1.01);
}

.product-page .gallery .carousel-track > video.gallery-item{
  background:#0e0e10;
}

.product-page .gallery .carousel-track > .gallery-video-item{
  position:relative;
  display:inline-flex;
  align-items:stretch;
  overflow:hidden;
}

.product-page .gallery .carousel-track > .gallery-video-item .gallery-video-thumb{
  display:block;
  width:auto;
  height:100%;
  object-fit:cover;
}

.product-page .gallery .carousel-track > .gallery-video-item::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.16), rgba(0,0,0,.38));
  pointer-events:none;
}

.product-page .gallery .carousel-track > .gallery-video-item::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:clamp(44px, 4.3vw, 64px);
  height:clamp(44px, 4.3vw, 64px);
  border-radius:999px;
  border:1px solid rgba(255,255,255,.52);
  background:rgba(0,0,0,.58);
  box-shadow:0 8px 18px rgba(0,0,0,.42);
  transform:translate(-50%, -50%);
  pointer-events:none;
}

.product-page .gallery .carousel-track > .gallery-video-item .gallery-video-play{
  position:absolute;
  top:50%;
  left:50%;
  width:0;
  height:0;
  border-top:11px solid transparent;
  border-bottom:11px solid transparent;
  border-left:17px solid rgba(255,255,255,.95);
  transform:translate(-36%, -50%);
  pointer-events:none;
}

.product-page .gallery .carousel-wrapper.single-media{
  grid-template-columns:minmax(0, 1fr);
}

.product-page .gallery .carousel-wrapper.single-media .carousel-btn{
  display:none;
}

.product-page .gallery .carousel-wrapper.single-media .carousel-track{
  justify-content:center;
  padding:0;
  background:transparent;
}

.product-page .gallery .carousel-wrapper.single-media .carousel-track > .gallery-item{
  height:clamp(140px, 21vw, 280px);
  max-width:min(96vw, 1120px);
}

@media (max-width:900px){
  .product-page .gallery .carousel-track{
    gap:10px;
    padding:.45rem .5rem;
    scroll-padding-inline:.5rem;
  }

  .product-page .gallery .carousel-track > .gallery-item{
    height:clamp(105px, 24vw, 160px);
    max-width:90vw;
  }

  .product-page .gallery .carousel-wrapper.single-media .carousel-track > .gallery-item{
    height:clamp(115px, 28vw, 215px);
  }
}

@media (max-width:640px){
  .product-page .gallery .carousel-track{
    gap:8px;
    padding:0;
    scroll-padding-inline:0;
    background:transparent;
  }

  .product-page .gallery .carousel-track > .gallery-item{
    height:clamp(95px, 29vw, 140px);
    max-width:95vw;
  }
}

body.gallery-lightbox-open{
  overflow:hidden;
}

.gallery-lightbox{
  position:fixed;
  inset:0;
  z-index:2200;
  display:none;
  align-items:center;
  justify-content:center;
  padding:clamp(1rem, 2vw, 2rem);
  background:rgba(7,9,12,.84);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}

.gallery-lightbox.is-open{
  display:flex;
  animation:gallery-lightbox-in .2s ease;
}

@keyframes gallery-lightbox-in{
  from{opacity:0;}
  to{opacity:1;}
}

.gallery-lightbox__media-wrap{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  max-width:96vw;
  max-height:94vh;
}

.gallery-lightbox__media{
  display:flex;
  align-items:center;
  justify-content:center;
}

.gallery-lightbox__media > img,
.gallery-lightbox__media > video{
  width:auto;
  height:auto;
  max-width:96vw;
  max-height:92vh;
  object-fit:contain;
  border-radius:10px;
  background:transparent;
  box-shadow:0 20px 44px rgba(0,0,0,.52);
}

.gallery-lightbox__media > video{
  background:#0b0b0d;
}

.gallery-lightbox__media > iframe{
  width:min(96vw, calc(92vh * (16 / 9)));
  max-width:96vw;
  max-height:92vh;
  aspect-ratio:16 / 9;
  border:0;
  border-radius:10px;
  background:#0b0b0d;
  box-shadow:0 20px 44px rgba(0,0,0,.52);
}

.gallery-lightbox__close{
  position:absolute;
  top:10px;
  right:10px;
  transform:none;
  width:38px;
  height:38px;
  border:1px solid rgba(255,255,255,.28);
  background:rgba(0,0,0,.58);
  color:#fff;
  border-radius:999px;
  padding:0;
  font-size:1.35rem;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background .2s ease, border-color .2s ease;
}

.gallery-lightbox__close:hover,
.gallery-lightbox__close:focus-visible{
  background:rgba(226,35,26,.85);
  border-color:rgba(226,35,26,.95);
  outline:none;
}

/* Solution cards (small) */
.solution-card{
  flex:0 0 220px;scroll-snap-align:start;
  background:var(--c-charcoal-2);border-radius:8px;padding:2rem;
  display:flex;flex-direction:column;align-items:center;gap:1rem;
  box-shadow:0 4px 12px rgba(0,0,0,.4);text-align:center;
}
.solution-card img{max-height: 80px;}

@media (min-width:900px){                /* desktop only     */
  .solution-card{                        /* 4 cards visible  */
    flex:0 0 calc((100% - 3*2.2rem)/4);    /* = 25 % minus gaps */
    max-width:280px;                     /* optional hard cap */
  }
}

.solution-card h3{font-weight: lighter;}

/* Advantages (large) */
.adv-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;}
.adv-card{background:var(--c-charcoal);border-radius:8px;overflow:hidden;box-shadow:0 4px 12px rgba(0,0,0,.4);}
.adv-card img{width:100%;aspect-ratio:16/9;object-fit:cover;}
.adv-card h3{padding:1.25rem 1.5rem 0;}
.adv-card p{padding:0 1.5rem 1.5rem;color:var(--c-grey-light);}

/* Homepage: keep 130px side gutters around Advantages cards on desktop */
#advantages > .container{
  width:calc(100% - 260px);
  max-width:none;
  margin-inline:auto;
}

#advantages .adv-grid{
  grid-template-columns:repeat(3, minmax(0, 1fr));
}

@media (max-width:1199px){
  #advantages > .container{
    width:min(92%, 1200px);
    max-width:1200px;
  }

  #advantages .adv-grid{
    grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  }
}

@media (max-width:640px){
  #advantages > .container{
    width:min(94%, 1200px);
  }

  #advantages .adv-grid{
    grid-template-columns:1fr;
    gap:1.25rem;
  }
}

/* Trusted-by-Industry Leaders marquee (homepage) */
#partners{
  background:
    radial-gradient(125% 105% at 100% 0%, rgba(168,24,18,.16) 0%, rgba(168,24,18,.07) 34%, rgba(168,24,18,0) 68%),
    radial-gradient(125% 105% at 0% 100%, rgba(168,24,18,.145) 0%, rgba(168,24,18,.062) 34%, rgba(168,24,18,0) 68%),
    #f4f3ef;
  color:#131722;
  --trusted-logo-gap:clamp(2.3rem,4.6vw,4.6rem);
  padding:clamp(3.1rem,5vw,4.4rem) 0 clamp(2.2rem,4.4vw,3rem);
  text-align:center;
  position:relative;
  box-shadow:
    inset 0 18px 20px -14px rgba(8,12,20,.78),
    inset 0 -18px 20px -14px rgba(8,12,20,.78),
    inset 0 1px 0 rgba(255,255,255,.42),
    inset 0 -1px 0 rgba(255,255,255,.34);
}

#partners::before,
#partners::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  height:24px;
  pointer-events:none;
}

#partners::before{
  top:0;
  background:linear-gradient(180deg, rgba(10,14,24,.5) 0%, rgba(10,14,24,0) 62%);
}

#partners::after{
  bottom:0;
  background:linear-gradient(0deg, rgba(10,14,24,.5) 0%, rgba(10,14,24,0) 62%);
}

#partners .partners-head{
  max-width:min(92vw, 860px);
  margin-bottom:clamp(1.2rem,2vw,1.8rem);
  transform:translateY(-6px);
}

#partners .partners-kicker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0 auto .85rem;
  padding:.42rem .85rem;
  border-radius:999px;
  background:rgba(168,24,18,.08);
  border:1px solid rgba(168,24,18,.18);
  color:#7f1d15;
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
}

#partners h2{
  margin-bottom:0;
  color:#141b27;
  text-shadow:
    0 1px 0 rgba(255,255,255,.85),
    0 2px 4px rgba(10,14,24,.28);
}

#partners .partners-subtitle{
  max-width:42rem;
  margin:.95rem auto 0;
  color:rgba(20,27,39,.78);
  font-size:clamp(.98rem,1.2vw,1.06rem);
  line-height:1.72;
}

#partners .trusted-marquee{
  width:100vw;
  margin-left:calc(50% - 50vw);
  overflow:hidden;
  position:relative;
  padding:.35rem 0 .5rem;
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
  mask-image:linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
}

#partners .trusted-marquee-track{
  display:flex;
  align-items:center;
  gap:var(--trusted-logo-gap);
  width:max-content;
  will-change:transform;
  transform:translate3d(0,0,0);
}

#partners .trusted-marquee-track.is-static{
  transform:none;
}

#partners .trusted-marquee-group{
  display:flex;
  align-items:center;
  gap:var(--trusted-logo-gap);
  padding-inline:0;
}

#partners .trusted-logo{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:clamp(96px, 9vw, 112px);
  padding:clamp(.85rem, 1.4vw, 1rem) clamp(1rem, 1.8vw, 1.35rem);
  border-radius:22px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.75), rgba(255,255,255,.52));
  border:1px solid rgba(20,27,39,.08);
  box-shadow:
    0 12px 24px rgba(20,27,39,.08),
    inset 0 1px 0 rgba(255,255,255,.72);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease;
}

#partners .trusted-logo img{
  height:clamp(78px,7.3vw,96px);
  width:auto;
  max-width:220px;
  object-fit:contain;
  filter:grayscale(1) opacity(.72);
  transition:filter .22s ease, opacity .22s ease, transform .22s ease;
}

#partners .trusted-logo:hover,
#partners .trusted-logo:focus-within{
  transform:translateY(-2px);
  border-color:rgba(20,27,39,.14);
  box-shadow:
    0 16px 28px rgba(20,27,39,.12),
    inset 0 1px 0 rgba(255,255,255,.78);
}

#partners .trusted-logo:hover img,
#partners .trusted-logo:focus-within img,
#partners .trusted-logo img:hover,
#partners .trusted-logo img:focus-visible{
  filter:grayscale(0) opacity(1);
  transform:translateY(-1px);
}

@media(max-width:900px){
  #partners{
    --trusted-logo-gap:clamp(1.6rem,5vw,2.8rem);
    padding:clamp(2.4rem,5.5vw,3rem) 0 2rem;
  }

  #partners .partners-kicker{
    font-size:.74rem;
    letter-spacing:.1em;
  }

  #partners .trusted-logo img{
    height:clamp(58px,9.2vw,76px);
    max-width:170px;
  }

  #partners .trusted-logo{
    min-height:84px;
    padding:.7rem .95rem;
    border-radius:18px;
  }
}

/* ───── ABOUT PAGE: split hero ───── */
.about-page .split-hero{
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:60vh;
}

.about-page .split-hero .half{
  background-size:cover;
  background-position:center;
}

/* Stack the halves on small screens */
@media(max-width:768px){
  .about-page .split-hero{
    grid-template-columns:1fr;
  }
  .about-page .split-hero .half{
    min-height:40vh;
  }
}

.about-page .stats h3{
  text-shadow: #000 1px 0 10px;
}

/* ───  Core-values grid: keep box size but centre the layout  ─── */
.about-page .values-grid{
  display:grid;
  grid-template-columns:repeat(2,350px);   /* fixed 350-px columns      */
  gap:2.5rem;                              /* same gap X & Y            */
  justify-content:center;                  /* centre the 2-column grid  */
}

.about-page .values-grid .adv-card{
  width:350px;         /* exact width so both columns line up */
  min-height:370px;
  margin:0;            /* kill any stray auto-margins         */
}

/* ───  Section titles: bigger, centred, red glow  ─── */
.about-page .section-title{
  text-align:center;
  font-size:clamp(2.5rem,5vw,3.5rem);  /* scales up on wide screens */
  text-shadow:#000 2px 2px 2px;
  margin-bottom:1rem;
}

/* ───  Worldwide-presence intro text  ─── */
.about-page .worldwide{
  text-align:center;          /* centre everything in that section */
}

.about-page .worldwide p{
  font-size:1.25rem;          /* bigger copy */
  font-weight:300;            /* lighter weight */
  margin-bottom:2rem;         /* breathing room above the map */
}

/* ─── 4-corner placement for the 2 × 2 “Core Values” grid ─── */
.about-page .values-grid{
  /* keep the fixed card width/height you already have …         */
  grid-template-columns:repeat(2,minmax(350px,1fr));
  grid-auto-rows:minmax(370px,1fr);     /* cell at least 370 px tall    */
  gap:2.5rem;                           /* same spacing X & Y           */
  width:max-content;                    /* shrink-wrap grid, then …     */
  margin:0 auto;                        /* …center entire wrapper       */
}

/* default for all cards = top-left  */
.about-page .values-grid .adv-card{
  justify-self:start;
  align-self:start;
}

/* 1️⃣ top-left cell → move card to bottom-right */
.about-page .values-grid .adv-card:nth-child(1){
  justify-self:end;
  align-self:end;
}

/* 2️⃣ top-right cell → move card to bottom-left */
.about-page .values-grid .adv-card:nth-child(2){
  justify-self:start;
  align-self:end;
}

/* 3️⃣ bottom-left cell → move card to top-right */
.about-page .values-grid .adv-card:nth-child(3){
  justify-self:end;
  align-self:start;
}

/* ───── Contact page card & form ───── */
.contact-card{
  background:var(--c-charcoal-2);
  padding:3rem 2.5rem;
  border-radius:1rem;
  box-shadow:0 6px 24px rgba(0,0,0,.35);
  max-width:900px;margin-inline:auto;
}

.contact-card h2{
  text-align:center;
  padding-bottom: 20px;
}

.contact-card .sub{
  text-align:center;
  margin-bottom:2rem;
  color:var(--c-grey-light);
}

.grid-two{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2rem;
  padding-bottom: .8rem;
}

@media(max-width:700px){
  .grid-two{grid-template-columns:1fr;}
}

.form-group{display:flex;flex-direction:column;gap:.5rem;}
.form-group.full{grid-column:1 / -1;padding-top: 1rem;}          /* span both columns */

.form-group label{font-weight:500;}
.form-group label span{color:var(--c-red);}
.form-group input,
.form-group select,
.form-group textarea{
  padding:.75rem 1rem;
  border:2px solid var(--c-charcoal-3);
  background:var(--c-charcoal-3);
  color:var(--c-grey-light);
  border-radius:6px;
  resize:vertical;
  font-size:1rem;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
  outline:none;
  border-color:var(--c-red);
}

.btn-primary{
  display:inline-block;
  margin-top:2rem;
  padding:.9rem 2.5rem;
  background:var(--c-red);
  color:var(--c-grey-light);
  border:none;
  border-radius:30px;
  font-weight:600;
  letter-spacing:.03em;
  cursor:pointer;
  transition:.2s;
}
.btn-primary:hover{filter:brightness(1.1);}

/* ========= Keep dropdown menus from shrinking ========= */

/* Only shrink TOP-LEVEL nav links when header.shrink is set */
header nav.primary-nav > ul > li > a { padding:.75rem 1rem; }         /* normal */
header.shrink nav.primary-nav > ul > li > a { padding:.3rem 1rem; }   /* shrink */

/* Keep dropdown link padding constant (never shrink) */
header .mega a,
header .submega a {
  padding:.75rem 1rem !important;
}

/* Your global "no transition" rule was catching ALL <a> in nav.
   Limit it to top-level links so dropdown hovers stay smooth. */
header, 
header .logo img, 
header nav.primary-nav > ul > li > a {
  transition:none;
}

/* Restore a gentle hover transition inside dropdowns */
header .mega a,
header .submega a {
  transition:.2s;
}

/* ============================================
   Cohesive Polish + Readability Pass (palette/font preserved)
   ============================================ */
:root{
  --surface-fade-1:rgba(255,255,255,.055);
  --surface-fade-2:rgba(255,255,255,.015);
  --surface-stroke:rgba(255,255,255,.11);
  --hero-h1-size:clamp(2rem,5.8vw,4rem);
  --section-h2-size:clamp(1.5rem,3.2vw,2.4rem);
  --body-copy-size:clamp(.98rem,1.1vw,1.08rem);
  --hero-top-offset:clamp(70px,7.8vw,90px);
  --carousel-side-pad:clamp(.25rem,1.8vw,1rem);
}

html,body{
  line-height:1.6;
}

h1,h2,h3,p,li{
  overflow-wrap:anywhere;
}

h1{
  font-size:var(--hero-h1-size);
  line-height:1.08;
}

h2{
  font-size:var(--section-h2-size);
  line-height:1.18;
}

p{
  font-size:var(--body-copy-size);
  line-height:1.65;
}

header{
  background:rgba(12,12,12,.88);
  border-bottom:1px solid var(--surface-stroke);
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
}

header.shrink{
  background:rgba(12,12,12,.95);
}

nav ul a{
  text-underline-offset:.18rem;
}

.mega,
.submega{
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)),
    var(--c-charcoal-2);
  border:1px solid var(--surface-stroke);
}

.alt-bg{
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
    var(--c-charcoal-2);
}

.industry-hero,
.solutions-hero,
.svc-hero,
.spares-hero,
.catalog-hero{
  margin-top:0 !important;
}

.carousel-wrapper{
  gap:clamp(.45rem,1.2vw,1rem);
  grid-template-columns:minmax(34px,44px) minmax(0,1fr) minmax(34px,44px);
}

.carousel-track{
  padding:1rem var(--carousel-side-pad);
  scroll-padding-inline:var(--carousel-side-pad);
}

.carousel-track > *{
  min-width:0;
}

.content{
  padding:clamp(2.75rem,5.5vw,4.25rem) 0;
}

.content h2{
  padding-bottom:clamp(1rem,2.6vw,1.7rem);
}

.hero-text,
.solutions-hero .hero-text,
.svc-hero .hero-text,
.spares-hero .hero-text,
.catalog-hero .hero-text,
.industry-hero .hero-copy,
.company-hero > div,
.jobs-hero > div{
  max-width:min(92vw,980px);
  margin-inline:auto;
}

.card,
.adv-card,
.news-card,
.solution-card,
.dir-card,
.svc-card,
.sol-card,
.cat-card,
.tile,
.feature-card,
.job-list,
.job-desc-panel,
.contact-card,
.tier,
.note,
.spares-banner,
.spec-table,
.local-subnav{
  border:1px solid var(--surface-stroke);
  box-shadow:0 10px 26px rgba(0,0,0,.26);
}

.asym{
  gap:clamp(1.1rem,2.8vw,2rem);
}

.asym .col{
  min-width:0;
}

.asym .col > h2,
.asym .col > p,
.asym .col > ul{
  padding-left:0 !important;
  padding-right:0 !important;
  max-width:100%;
}

.asym h2{
  font-size:clamp(1.45rem,3.2vw,2.2rem) !important;
  line-height:1.2;
}

.asym p,
.asym li{
  line-height:1.65;
}

.asym .col p{
  max-width:72ch;
}

.hero-cta{
  padding:.85rem clamp(1.5rem,3vw,2.4rem);
  font-size:clamp(.86rem,1.6vw,1rem);
}

.solution-card h3,
.svc-card h3,
.dir-card h2,
.cat-card h3,
.tile h3,
.prod-card h3{
  font-size:clamp(1rem,1.55vw,1.28rem);
  line-height:1.3;
}

.nav-toggle{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.14);
}

.mobile-drawer{
  background:linear-gradient(180deg, rgba(0,0,0,.98), rgba(12,12,12,.94));
}

.mobile-submenu{
  background:transparent;
}

.product-page #overview.asym{
  padding-top:clamp(13.5rem,30vw,19rem) !important;
  padding-bottom:clamp(1.6rem,4vw,2.9rem) !important;
}

.industry-page .asym.container.gap-2{
  padding-top:clamp(4rem,9vw,6.5rem) !important;
  padding-bottom:clamp(1.25rem,4vw,2.25rem) !important;
}

.industry-page .asym .col.media{
  background:transparent;
  padding:0 !important;
  min-height:0;
  overflow:hidden;
  box-shadow:none;
}

.industry-page .asym .col.media::after{
  content:none !important;
}

.industry-page .asym .col.media img,
.industry-page .asym .col.media video{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  border:0;
  border-radius:var(--asym-radius);
  -webkit-mask-image:none !important;
  mask-image:none !important;
}

.solutions-page .asym.container.gap-2,
.services-page .asym.container.gap-2{
  padding-top:clamp(3.5rem,8vw,5.6rem) !important;
  padding-bottom:clamp(1.2rem,3.4vw,2rem) !important;
}

@media (max-width:1200px){
  .asym .col:first-child{
    max-width:none;
  }

  .asym .col{
    padding-left:clamp(1.2rem,3.6vw,2.35rem) !important;
    padding-right:clamp(1.2rem,3.6vw,2.35rem) !important;
  }
}

@media (max-width:980px){
  #mainHeader .container{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.85rem;
  }

  #mainHeader .logo{
    margin-inline:0;
    flex:0 1 auto;
  }

  #mainHeader .logo img{
    margin:0;
    height:32px;
  }

  #mainHeader .nav-toggle{
    position:static;
    left:auto;
    top:auto;
    transform:none;
    margin-left:auto;
    order:2;
  }
}

@media (min-width:769px) and (max-width:900px){
  .hero{
    padding-inline:0 !important;
    padding-bottom:0 !important;
  }

  .hero iframe,
  .hero .hero-bg{
    width:100% !important;
    max-width:100% !important;
  }

  .hero-text{
    padding-inline:1.5rem;
  }
}

@media (max-width:900px){
  .asym .col{
    padding:clamp(1.1rem,4.8vw,1.9rem) !important;
  }

  .carousel-track{
    padding-inline:clamp(.2rem,2.2vw,.75rem);
    scroll-padding-inline:clamp(.2rem,2.2vw,.75rem);
  }
}
