/* =========================================================
   SORNNE V2 — Biglux-inspired, modern airy B2B
   Palette: Accent #FDB813 | Dark #1A1A1A | Light #F8FAFC | Border #E5E7EB
   ========================================================= */
:root{
  --accent:#FFC107;
  --accent-2:#FFA800;
  --dark:#111418;
  --dark-2:#1a1d22;
  --light:#F6F7F9;
  --border:#E5E7EB;
  --text:#1f2937;
  --muted:#5b6473;
  --white:#ffffff;
  --shadow:0 4px 18px rgba(17,20,24,.06);
  --shadow-hover:0 14px 34px rgba(17,20,24,.12);
  --radius:12px;
  --radius-sm:8px;
  --maxw:1240px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:"Inter","Roboto","Montserrat",-apple-system,"Segoe UI",sans-serif;
  color:var(--text);background:#fff;line-height:1.65;font-size:16px;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
ul{list-style:none}
h1,h2,h3,h4{line-height:1.22;color:var(--dark);font-weight:700;letter-spacing:-.01em}
.container{max-width:1600px;margin:0 auto;padding:0 40px}
/* Outer shells full-bleed (Header / Hero / Stats / Footer) */
.header,.hero,.hero-stats,.footer{width:100%;max-width:100%;margin:0 auto}
.section{padding:90px 0}
.section-lg{padding:110px 0}
.section-light{background:var(--light)}
.section-dark{background:var(--dark);color:#e5e7eb}
.section-dark h1,.section-dark h2,.section-dark h3{color:#fff}
.section-dark p{color:#aab2bd}
.text-center{text-align:center}
.muted{color:var(--muted)}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 30px;border-radius:6px;font-weight:700;font-size:15px;
  cursor:pointer;border:2px solid transparent;transition:.25s;white-space:nowrap;letter-spacing:.01em;
}
.btn-accent{background:var(--accent);color:#111418;border-color:var(--accent)}
.btn-accent:hover{background:var(--accent-2);border-color:var(--accent-2);transform:translateY(-2px);color:#fff}
.btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.btn-outline:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.btn-dark{background:var(--dark);color:#fff;border-color:var(--dark)}
.btn-dark:hover{background:#000}
.btn-ghost{background:transparent;color:var(--dark);border-color:var(--border)}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent-2)}
.btn-sm{padding:10px 20px;font-size:14px}

/* =========================================================
   HEADER — Two-band: topbar slim | logo band | main nav
   ========================================================= */
.topbar{background:#0a0c0f;color:#9aa3af;font-size:12.5px}
.topbar-inner{display:flex;justify-content:space-between;align-items:center;height:38px}
.topbar-left{display:flex;gap:22px}
.topbar-left a,.topbar-right a{color:#cbd5e1;transition:.2s}
.topbar-right{display:flex;align-items:center;gap:14px}
.topbar-right .div{color:#444}
.topbar-right a.lang{color:var(--accent);font-weight:600}

/* Header band (logo + CTA) */
.header{position:sticky;top:0;z-index:100;background:#fff;border-bottom:1px solid var(--border);transition:.3s}
.header.scrolled{box-shadow:0 4px 20px rgba(0,0,0,.08)}
.header-band{padding:18px 0 14px}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
.logo{display:flex;align-items:center;gap:12px}
.logo img{height:44px;width:auto}
.logo .lname{font-weight:800;font-size:24px;color:var(--dark);letter-spacing:.5px}
.logo .ltag{font-size:12px;color:var(--muted);letter-spacing:.5px;text-transform:uppercase;font-weight:600;padding-left:12px;border-left:1px solid var(--border)}
.h-right{display:flex;align-items:center;gap:14px}

/* Main nav — large horizontal tabs */
.nav{background:var(--dark);position:relative}
.nav-inner{display:flex;align-items:center;justify-content:center}
.nav ul{display:flex;align-items:center;gap:6px;flex-wrap:nowrap}
.nav ul li{position:relative}
.nav ul li>a{
  display:block;padding:22px 22px;color:#fff;font-weight:600;font-size:14.5px;
  letter-spacing:.5px;text-transform:uppercase;transition:.2s;
  border-bottom:3px solid transparent;position:relative;
}
.nav ul li>a:hover,.nav ul li>a.active{color:var(--accent);border-bottom-color:var(--accent)}
.nav ul li a .caret{font-size:10px;opacity:.7;margin-left:4px}

/* Dropdown */
.dropdown{
  position:absolute;top:100%;left:0;width:340px;background:#fff;border:1px solid var(--border);
  border-radius:0 0 10px 10px;box-shadow:var(--shadow-hover);
  padding:14px;display:grid;grid-template-columns:1fr 1fr;gap:6px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.25s;z-index:120;
}
.dropdown.small{width:280px;grid-template-columns:1fr}
.has-dd:hover .dropdown,.has-dd:focus-within .dropdown{opacity:1;visibility:visible;transform:translateY(0)}
.dropdown a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:6px;font-weight:500;font-size:14px;color:var(--text);text-transform:none;letter-spacing:normal;border:0}
.dropdown a:hover{background:var(--light);color:var(--accent-2)}
.dropdown a img{width:42px;height:42px;object-fit:cover;border-radius:6px;border:1px solid var(--border)}
.dropdown a b{font-size:14px;display:block;color:var(--dark)}
.dropdown a span{font-size:12px;color:var(--muted)}
.dropdown.small a{flex-direction:column;align-items:flex-start;gap:0;padding:12px}
.dropdown.small a b{font-size:14px;color:var(--dark)}
.dropdown.small a span{font-size:12px;color:var(--muted)}

.nav-toggle{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:0;padding:8px}
.nav-toggle span{width:26px;height:3px;background:#fff;border-radius:2px;transition:.3s}

/* ========================================================
   HERO FLOATING NAV (transparent over Hero on index page)
   Standard 3-segment header per spec (logo / menu / CTA)
   ======================================================== */
.hero-nav{position:fixed;top:0;left:0;width:100%;z-index:999;background:rgba(13,15,18,.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.07);padding:14px 40px;min-height:72px;display:flex;align-items:center;transition:background .3s ease}
.hero-nav .hn-inner{display:flex;align-items:center;justify-content:space-between;gap:28px;width:100%;max-width:1440px;margin:0 auto}
.hero-nav .hn-logo{display:inline-flex;align-items:center;gap:12px;color:#fff;flex-shrink:0}
.hero-nav .hn-logo-img{height:40px;width:auto;display:block;filter:drop-shadow(0 2px 6px rgba(0,0,0,.45));transition:.25s;object-fit:contain;max-width:240px}
.hero-nav .hn-logo-text{display:inline-flex;flex-direction:column;line-height:1.05;color:#fff}
.hero-nav .hn-logo-text b{font:800 18px/1.05 Inter,Arial,sans-serif;letter-spacing:.5px;text-shadow:0 1px 4px rgba(0,0,0,.4)}
.hero-nav .hn-logo-text small{font:600 9.5px/1.4 Inter,Arial,sans-serif;letter-spacing:1.5px;color:var(--accent);text-transform:uppercase;text-shadow:0 1px 3px rgba(0,0,0,.4)}
.hero-nav .hn-logo:hover .hn-logo-img{filter:drop-shadow(0 2px 6px rgba(0,0,0,.6)) brightness(1.05)}
.hero-nav .hn-nav{display:flex;align-items:center;gap:18px;position:relative;flex:1;justify-content:center}
.hero-nav .hn-menu{display:flex;align-items:center;gap:24px;flex-wrap:nowrap}
.hero-nav .hn-menu>li{position:relative}
.hero-nav .hn-menu>li>a{
  display:block;padding:10px 0;color:#fff;font-weight:700;font-size:14px;letter-spacing:.4px;
  text-transform:uppercase;transition:.2s;position:relative;white-space:nowrap;
  text-shadow:0 1px 6px rgba(0,0,0,.45);font-family:"Inter","Helvetica Neue",Arial,sans-serif;
}
.hero-nav .hn-menu>li>a::after{
  content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;
  background:var(--accent);transform:scaleX(0);transform-origin:left;transition:.25s;
}
.hero-nav .hn-menu>li>a:hover::after,
.hero-nav .hn-menu>li>a.active::after{transform:scaleX(1)}
.hero-nav .hn-menu>li>a:hover,
.hero-nav .hn-menu>li>a.active{color:var(--accent)}
.hero-nav .hn-caret{font-size:9px;margin-left:5px;opacity:.75;vertical-align:middle}
.hero-nav .hn-quote{
  background:linear-gradient(135deg,#FFD23F,#FDB813);color:#111418;font-weight:800;font-size:14px;letter-spacing:.5px;
  padding:12px 24px;border-radius:6px;text-transform:uppercase;transition:.25s;white-space:nowrap;
  font-family:"Inter","Helvetica Neue",Arial,sans-serif;flex-shrink:0;
  box-shadow:0 4px 16px rgba(253,184,19,.5);border:1px solid rgba(255,255,255,.25);
  animation:quotePulse 2.4s ease-in-out infinite;
}
.hero-nav .hn-quote:hover{background:linear-gradient(135deg,#FFE27A,#FFC400);color:#111418;transform:translateY(-2px) scale(1.05);box-shadow:0 10px 26px rgba(253,184,19,.65)}
@keyframes quotePulse{0%,100%{box-shadow:0 4px 16px rgba(253,184,19,.45)}50%{box-shadow:0 6px 22px rgba(253,184,19,.78)}}
.hero-nav .hn-toggle{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:0;padding:8px}
.hero-nav .hn-toggle span{width:26px;height:3px;background:#fff;border-radius:2px;transition:.3s;transform-origin:center}
.hero-nav .hn-toggle.open span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.hero-nav .hn-toggle.open span:nth-child(2){opacity:0}
.hero-nav .hn-toggle.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* ========================================================
   STANDARD HEADER (sub-pages) white-bg sticky, same 3-segment
   Used by about/applications/contact/downloads/faq/news/products/*
   ======================================================== */
.header-standard{position:sticky;top:0;z-index:999;background:#fff;border-bottom:1px solid var(--border);min-height:76px;display:flex;align-items:center;padding:0 40px;box-shadow:0 1px 0 rgba(0,0,0,.04)}
.header-standard .hn-inner{display:flex;align-items:center;justify-content:space-between;gap:28px;width:100%;max-width:1440px;margin:0 auto}
.header-standard .hn-logo{display:inline-flex;align-items:center;flex-shrink:0}
.header-standard .hn-logo-img{height:44px;width:auto;display:block;transition:.25s}
.header-standard .hn-logo:hover .hn-logo-img{transform:scale(1.02)}
.header-standard .hn-nav{display:flex;align-items:center;gap:18px;position:relative;flex:1;justify-content:center}
.header-standard .hn-menu{display:flex;align-items:center;gap:24px;flex-wrap:nowrap}
.header-standard .hn-menu>li{position:relative}
.header-standard .hn-menu>li>a{
  display:block;padding:10px 0;color:var(--dark);font-weight:700;font-size:14px;letter-spacing:.4px;
  text-transform:uppercase;transition:.2s;position:relative;white-space:nowrap;
  font-family:"Inter","Helvetica Neue",Arial,sans-serif;
}
.header-standard .hn-menu>li>a::after{
  content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;
  background:var(--accent);transform:scaleX(0);transform-origin:left;transition:.25s;
}
.header-standard .hn-menu>li>a:hover::after,
.header-standard .hn-menu>li>a.active::after{transform:scaleX(1)}
.header-standard .hn-menu>li>a:hover,
.header-standard .hn-menu>li>a.active{color:var(--accent)}
.header-standard .hn-caret{font-size:9px;margin-left:5px;opacity:.65;vertical-align:middle;color:var(--muted)}
.header-standard .hn-quote{
  background:linear-gradient(135deg,#FFD23F,#FDB813);color:#111418;font-weight:800;font-size:14px;letter-spacing:.5px;
  padding:12px 24px;border-radius:6px;text-transform:uppercase;transition:.25s;white-space:nowrap;
  font-family:"Inter","Helvetica Neue",Arial,sans-serif;flex-shrink:0;
  box-shadow:0 4px 16px rgba(253,184,19,.5);border:1px solid rgba(255,255,255,.25);
  animation:quotePulse 2.4s ease-in-out infinite;
}
.header-standard .hn-quote:hover{background:linear-gradient(135deg,#FFE27A,#FFC400);color:#111418;transform:translateY(-2px) scale(1.05);box-shadow:0 10px 26px rgba(253,184,19,.65)}
.header-standard .hn-toggle{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:0;padding:8px}
.header-standard .hn-toggle span{width:26px;height:3px;background:var(--dark);border-radius:2px;transition:.3s;transform-origin:center}
.header-standard .hn-toggle.open span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.header-standard .hn-toggle.open span:nth-child(2){opacity:0}
.header-standard .hn-toggle.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

@media (max-width:1100px){
  .hero-nav,.header-standard{padding:0 20px}
  .hero-nav .hn-menu,.header-standard .hn-menu{gap:18px}
  .hero-nav .hn-menu>li>a,.header-standard .hn-menu>li>a{font-size:13px}
}

/* Hero nav dropdown — floating frosted glass */
.hn-has::after{content:"";position:absolute;top:100%;left:0;width:100%;height:18px;z-index:119}
.hn-drop{
  position:absolute;top:calc(100% + 18px);left:0;width:512px;
  background:rgba(18,22,28,.55);
  -webkit-backdrop-filter:blur(16px) saturate(160%);
  backdrop-filter:blur(16px) saturate(160%);
  border:1px solid rgba(255,255,255,.16);border-radius:18px;
  box-shadow:0 22px 50px rgba(0,0,0,.5);
  padding:14px;display:grid;grid-template-columns:1fr 1fr;gap:12px;
  opacity:0;visibility:hidden;transform:translateY(12px) scale(.97);
  transition:.3s cubic-bezier(.22,1,.36,1);z-index:120;
}
.hn-drop.small{width:280px;grid-template-columns:1fr}
.hn-has:hover .hn-drop,.hn-has:focus-within .hn-drop{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.hn-drop a{display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding:12px;border-radius:12px;font-weight:500;font-size:14px;color:rgba(255,255,255,.92);text-transform:none;letter-spacing:normal;transition:.2s}
.hn-drop a:hover{background:rgba(253,184,19,.18);color:#fff;transform:translateY(-2px)}
.hn-drop a img{width:100%;height:140px;object-fit:contain;background:#fff;padding:8px 10px;border-radius:10px;border:1px solid rgba(255,255,255,.14)}
.hn-drop a b{font-size:14px;line-height:1.25;display:block;color:#fff}
.hn-drop a span{font-size:11.5px;line-height:1.35;color:rgba(255,255,255,.6)}
.hn-drop.small a{flex-direction:column;align-items:flex-start;gap:2px;padding:11px 12px}
.hn-drop.small a b{font-size:14px}
.hn-drop.small a span{font-size:12px}

/* =========================================================
   HERO — Video background + dark stats band
   ========================================================= */
.hero{
  position:relative;height:85vh;min-height:750px;color:#fff;overflow:hidden;
  display:flex;align-items:center;justify-content:center;text-align:center;
}
.hero-video-stack{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-video{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center center;
  z-index:1;
}
.hero-video-fallback{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center center;z-index:0;
}
.hero-dots-static .hdot{cursor:default}
.hero-dots-static .hdot .bar::after{display:none}
/* Keep image carousel styles as fallback in case a future slide is reintroduced */
.hero-img.active{opacity:1}
.hero-scene-tag{
  display:inline-block;margin-top:46px;color:#fff;font-size:13px;letter-spacing:3px;
  text-transform:uppercase;font-weight:600;padding:7px 18px;border:1px solid rgba(255,255,255,.25);
  border-radius:40px;background:rgba(17,20,24,.35);backdrop-filter:blur(4px);
}
.hero-dots{display:flex;justify-content:center;align-items:center;gap:28px;margin-top:22px}
.hdot{display:flex;flex-direction:column;align-items:center;gap:9px;background:none;border:0;padding:0;cursor:pointer}
.hdot .bar{position:relative;width:46px;height:5px;border-radius:6px;background:rgba(255,255,255,.32);overflow:hidden;transition:width .3s}
.hdot.active .bar{width:66px;background:rgba(255,255,255,.45)}
.hdot .bar::after{content:"";position:absolute;left:0;top:0;height:100%;width:100%;background:var(--accent);border-radius:6px;transform:scaleX(0);transform-origin:left;opacity:0}
.hdot.active .bar::after{opacity:1;animation:heroFill 11s linear forwards}
.hdot .lab{font-size:10.5px;letter-spacing:.5px;text-transform:uppercase;color:rgba(255,255,255,.55);transition:.3s;white-space:nowrap}
.hdot.active .lab{color:var(--accent);font-weight:600}
@keyframes heroFill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.hero-overlay{
  position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(180deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.42) 38%,rgba(0,0,0,.55) 100%),
    radial-gradient(120% 80% at 50% 40%,rgba(0,0,0,0) 38%,rgba(0,0,0,.45) 100%);
}
.hero-inner{position:relative;z-index:2;padding:120px 0 140px;max-width:1100px;margin:0 auto}
.hero-eyebrow{
  display:inline-block;padding:7px 16px;border:1px solid rgba(253,184,19,.4);
  color:var(--accent);font-weight:600;font-size:13px;letter-spacing:2px;text-transform:uppercase;
  border-radius:40px;margin-bottom:30px;background:rgba(253,184,19,.08);
}
.hero h1{color:#fff;font-size:60px;line-height:1.12;letter-spacing:-.02em;font-weight:800;margin-bottom:24px;text-shadow:0 2px 20px rgba(0,0,0,.55)}
.hero .sub{font-size:20px;color:#e5e7eb;max-width:760px;margin:0 auto 40px;line-height:1.6;font-weight:400;text-shadow:0 1px 12px rgba(0,0,0,.5)}
  .hero-cta{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;margin-top:4px}
.hero-cta .btn{padding:16px 40px;font-size:16px;border-radius:8px}
.hero-cta .btn-accent{box-shadow:0 8px 24px rgba(253,184,19,.4)}
.hero-cta .btn-accent:hover{box-shadow:0 12px 30px rgba(253,184,19,.55);transform:translateY(-3px)}
.hero-cta .btn-outline:hover{background:rgba(255,255,255,.12);transform:translateY(-3px)}
.hero-stats{
  position:absolute;left:0;right:0;bottom:0;z-index:3;
  background:rgba(10,12,15,.75);backdrop-filter:blur(12px);
  border-top:1px solid rgba(255,255,255,.08);
}
.hero-stats .container{display:grid;grid-template-columns:repeat(4,1fr);padding:24px 24px}
.hs-item{text-align:center;color:#fff;border-right:1px solid rgba(255,255,255,.08)}
.hs-item:last-child{border-right:0}
.hs-item b{display:block;font-size:34px;color:var(--accent);font-weight:800;line-height:1}
.hs-item span{display:block;font-size:13px;color:#9aa3af;margin-top:6px;font-weight:500;letter-spacing:.5px;text-transform:uppercase}

/* =========================================================
   SECTION HEAD — shared
   ========================================================= */
.section-head{max-width:760px;margin:0 auto 70px;text-align:center}
.section-head .eyebrow{
  display:inline-block;color:var(--accent-2);font-weight:700;letter-spacing:3px;
  text-transform:uppercase;font-size:12.5px;margin-bottom:18px;
}
.section-head h2{font-size:40px;margin-bottom:18px;font-weight:800;letter-spacing:-.02em}
.section-head p{color:var(--muted);font-size:17px;line-height:1.7}
.section-dark .section-head p{color:#9aa3af}

/* =========================================================
   PRODUCT GRID — clean white cards, no clutter
   ========================================================= */
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.product-card{
  background:#FFFFFF;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;
  box-shadow:0 6px 18px rgba(17,20,24,.05);
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
  display:flex;flex-direction:column;color:inherit;
}
.product-card:hover{transform:translateY(-8px);box-shadow:0 20px 40px rgba(17,20,24,.14);border-color:var(--accent)}
.product-card .pc-img{height:260px;overflow:hidden;background:#fff;display:flex;align-items:center;justify-content:center}
.product-card .pc-img img{width:100%;height:100%;object-fit:contain;transition:.5s}
.product-card:hover .pc-img img{transform:scale(1.05)}
.product-card .pc-body{padding:30px;display:flex;flex-direction:column;flex:1}
.product-card .pc-eyebrow{
  display:inline-block;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--accent-2);font-weight:700;margin-bottom:10px;
}
.product-card h3{font-size:18px;line-height:1.35;margin-bottom:12px;letter-spacing:-.01em;transition:.2s}
.product-card:hover h3{color:var(--accent-2)}
.product-card p{color:var(--muted);font-size:14px;line-height:1.65;margin-bottom:18px;flex:1}
.product-card .pc-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.product-card .pc-tags i{
  font-style:normal;font-size:12px;font-weight:600;color:var(--dark);
  padding:5px 14px;border-radius:20px;background:#FBF1D8;
}
.product-card .pc-tags i:nth-child(even){background:#F1F5F9}
.product-card .pc-link{
  color:var(--accent-2);font-weight:700;font-size:14px;display:inline-flex;align-items:center;gap:7px;margin-top:auto;
}
.product-card .pc-link span{transition:.2s}
.product-card:hover .pc-link span{transform:translateX(6px)}

/* =========================================================
   STATS (dark section)
   ========================================================= */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:14px}
.stat{text-align:center;padding:36px 16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:10px}
.stat .num{font-size:54px;font-weight:800;color:var(--accent);line-height:1}
.stat .label{margin-top:12px;color:#cbd5e1;font-size:15px;font-weight:500}

.trust-row{
  display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin-top:60px;
  padding-top:50px;border-top:1px solid rgba(255,255,255,.1);
}
.trust-card{
  padding:24px 16px;background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);border-radius:10px;
  text-align:center;transition:.25s;position:relative;
}
.trust-card:hover{background:rgba(253,184,19,.06);transform:translateY(-3px)}
.trust-card .tr-ic{display:block;font-size:28px;color:var(--accent);margin-bottom:10px}
.trust-card b{display:block;font-size:16px;color:#fff;font-weight:700;margin-bottom:4px}
.trust-card span{display:block;font-size:12px;color:#94a3b8}
.trust-card-highlight{
  background:linear-gradient(135deg,rgba(253,184,19,.12) 0%,rgba(253,184,19,.06) 100%);
  border:1.5px solid var(--accent);
  box-shadow:0 8px 24px rgba(253,184,19,.18);
}
.trust-card-highlight b{color:var(--accent)}
.trust-card-highlight .tr-badge{
  position:absolute;top:-9px;right:12px;background:var(--accent);color:#1a1a1a;
  padding:3px 10px;border-radius:10px;font:800 10px Inter,sans-serif;
  letter-spacing:1.2px;text-transform:uppercase;
  box-shadow:0 4px 10px rgba(253,184,19,.4);
}

/* =========================================================
   SOLUTIONS — Biglux-style 6-cell tile grid
   ========================================================= */
.section-solutions{background:#fff;padding:100px 0}
.section-solutions .eyebrow{display:inline-flex;align-items:center;gap:8px}
.ey-dot{width:8px;height:8px;border-radius:50%;background:#ff3b30;display:inline-block;box-shadow:0 0 0 0 rgba(255,59,48,.6);animation:vid-pulse 1.6s ease-in-out infinite}
@keyframes vid-pulse{0%{box-shadow:0 0 0 0 rgba(255,59,48,.6)}70%{box-shadow:0 0 0 8px rgba(255,59,48,0)}100%{box-shadow:0 0 0 0 rgba(255,59,48,0)}}
.sol-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 28px}
.sol-card{display:block;text-decoration:none;cursor:pointer;transition:transform .3s ease}
.sol-card:hover{transform:translateY(-4px)}
.sol-card .sol-img{
  position:relative;width:100%;height:300px;border-radius:6px;overflow:hidden;
  background:#f3f4f6;
}
.sol-card .sol-img img,
.sol-card .sol-img video{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .55s ease;
}
.sol-card:hover .sol-img img,
.sol-card:hover .sol-img video{transform:scale(1.06)}
.sol-card .sol-lab{
  display:block;margin-top:18px;
  font:700 15px/1.2 Montserrat,'Inter',sans-serif;
  letter-spacing:1.5px;text-transform:uppercase;color:#111;
}
.sol-card:hover .sol-lab{color:var(--accent)}
.sol-card .sol-sub{
  display:block;margin-top:6px;
  font:400 12.5px/1.5 'Inter',-apple-system,sans-serif;color:#666;letter-spacing:0;
}
.sol-card:hover .sol-sub{color:#333}
/* VIDEO card overlays */
.sol-card-vid .sol-vid-badge{
  position:absolute;top:14px;left:14px;z-index:2;display:inline-flex;align-items:center;gap:6px;
  padding:5px 10px 5px 8px;border-radius:3px;
  background:rgba(0,0,0,.7);color:#fff;
  font:700 10px/1 Montserrat,'Inter',sans-serif;letter-spacing:1.6px;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.sol-card-vid .sol-vid-dot{width:6px;height:6px;border-radius:50%;background:#ff3b30;box-shadow:0 0 0 0 rgba(255,59,48,.7);animation:vid-pulse 1.6s ease-in-out infinite}
.sol-card-vid .sol-vid-play{
  position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:42px;opacity:0;transition:opacity .35s ease,transform .35s ease;
  text-shadow:0 2px 14px rgba(0,0,0,.5);pointer-events:none;
}
.sol-card-vid:hover .sol-vid-play{opacity:.9;transform:scale(1.08)}
/* inner 3rd column spans 2 rows for visual rhythm (Biglux masonry flavor) */
.sol-grid .sol-card:nth-child(3){grid-row:span 2}
.sol-grid .sol-card:nth-child(3) .sol-img{height:100%;min-height:632px}
.sol-grid .sol-card:nth-child(3) .sol-lab{margin-top:22px}

@media(max-width:1000px){
  .sol-grid{grid-template-columns:repeat(3,1fr);gap:22px 18px}
  .sol-card .sol-img{height:240px}
  .sol-grid .sol-card:nth-child(3) .sol-img{min-height:502px}
  .sol-card .sol-lab{font-size:13px}
}
@media(max-width:768px){
  .section-solutions{padding:70px 0}
  .sol-grid{grid-template-columns:repeat(2,1fr);gap:20px}
  .sol-card .sol-img{height:200px}
  .sol-grid .sol-card:nth-child(3){grid-row:auto}
  .sol-grid .sol-card:nth-child(3) .sol-img{min-height:auto;height:200px}
}
@media(max-width:480px){
  .sol-grid{grid-template-columns:1fr 1fr;gap:14px}
  .sol-card .sol-img{height:160px}
  .sol-card .sol-lab{font-size:12px;letter-spacing:1px;margin-top:12px}
}

/* =========================================================
   DEPLOYMENT SITES — dark band, 4 tall tiles with overlay
   ========================================================= */
.section-deploy{background:linear-gradient(180deg,#0e1014 0%,#111418 100%);padding:110px 0;color:#fff}
.section-head-light h2{color:#fff}
.section-head-light p{color:rgba(255,255,255,.78)}
.section-head-light .eyebrow{color:var(--accent)}

/* KPI strip */
.dep-kpi{
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  margin:50px 0 50px;border:1px solid rgba(253,184,19,.18);border-radius:14px;overflow:hidden;
  background:linear-gradient(135deg,rgba(253,184,19,.05) 0%,rgba(253,184,19,.0) 100%);
}
.dk-item{padding:28px 24px;text-align:center;border-right:1px solid rgba(255,255,255,.08)}
.dk-item:last-child{border-right:none}
.dk-item b{
  display:block;font:800 36px/1 Montserrat,sans-serif;color:var(--accent);
  letter-spacing:-.5px;margin-bottom:8px;
}
.dk-item span{font:500 12px/1.4 Inter,sans-serif;color:rgba(255,255,255,.7);text-transform:uppercase;letter-spacing:1.5px}

/* Layout: hero + side */
.dep-layout{display:grid;grid-template-columns:1.6fr 1fr;gap:22px}

/* Hero card */
.dep-hero{
  position:relative;display:block;height:600px;border-radius:14px;overflow:hidden;
  background:#1a1d22;text-decoration:none;
}
.dep-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.dep-hero:hover img{transform:scale(1.04)}
.dep-hero-mask{
  position:absolute;inset:0;z-index:2;
  display:flex;flex-direction:column;justify-content:flex-end;
  background:linear-gradient(180deg,rgba(0,0,0,.15) 0%,rgba(0,0,0,0) 40%,rgba(0,0,0,.92) 100%);
  padding:42px;color:#fff;
}
.dh-tag{
  position:absolute;top:24px;left:24px;display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px;border-radius:30px;background:rgba(220,38,38,.95);color:#fff;
  font:700 11px Inter,sans-serif;letter-spacing:1px;text-transform:uppercase;
  backdrop-filter:blur(10px);
}
.dh-pulse{width:8px;height:8px;border-radius:50%;background:#fff;animation:dhBeat 1.4s ease-in-out infinite}
@keyframes dhBeat{0%,100%{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.1)}}
.dh-flag{
  position:absolute;top:24px;right:24px;font-size:42px;line-height:1;
  background:rgba(255,255,255,.95);width:60px;height:60px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;backdrop-filter:blur(10px);
  box-shadow:0 4px 16px rgba(0,0,0,.25);
}
.dh-cat{
  display:inline-block;padding:4px 12px;border-radius:4px;background:var(--accent);color:#1a1a1a;
  font:800 11px Inter,sans-serif;letter-spacing:1.2px;text-transform:uppercase;margin-bottom:14px;
}
.dh-body h3{font:800 32px/1.2 Montserrat,sans-serif;color:#fff;margin-bottom:12px;letter-spacing:-.5px}
.dh-body p{font-size:15px;color:rgba(255,255,255,.85);line-height:1.55;margin-bottom:20px;max-width:520px}
.dh-meta{
  display:flex;gap:28px;padding:16px 0;border-top:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.18);
  margin-bottom:18px;
}
.dh-meta span{font-size:13px;color:rgba(255,255,255,.7);display:flex;flex-direction:column;gap:4px}
.dh-meta b{font:700 18px Inter,sans-serif;color:var(--accent)}
.dh-link{
  display:inline-block;font:700 13px Inter,sans-serif;color:#fff;letter-spacing:1px;
  text-transform:uppercase;padding:12px 0;
  border-bottom:2px solid var(--accent);
}
.dh-link:hover{color:var(--accent)}

/* Side cards column */
.dep-side{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.dep-card{
  position:relative;display:block;height:280px;border-radius:12px;overflow:hidden;
  background:#1a1d22;text-decoration:none;
}
.dep-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .55s ease}
.dep-card:hover img{transform:scale(1.07)}
.dep-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(0,0,0,.88) 100%)}
.dep-mask{position:absolute;left:0;right:0;bottom:0;padding:20px;z-index:2;color:#fff}
.dep-mask .dep-lab{
  display:block;font:800 16px/1.2 Montserrat,'Inter',sans-serif;
  letter-spacing:.5px;color:#fff;margin-bottom:6px;
}
.dep-mask .dep-loc{
  display:block;font:500 11px/1.3 Inter,sans-serif;
  letter-spacing:1px;color:rgba(255,255,255,.78);text-transform:uppercase;
}
.dep-card:hover .dep-lab{color:var(--accent)}
.dep-flag{
  position:absolute;top:14px;right:14px;z-index:3;font-size:24px;line-height:1;
  background:rgba(255,255,255,.92);width:42px;height:42px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;backdrop-filter:blur(10px);
  box-shadow:0 4px 12px rgba(0,0,0,.2);
}

/* CTA card */
.dep-card-cta{
  background:linear-gradient(135deg,var(--accent) 0%,#f59e0b 100%);
  position:relative;display:flex;align-items:center;justify-content:center;
  height:280px;border-radius:12px;overflow:hidden;text-decoration:none;
}
.dep-card-cta::before{
  content:"";position:absolute;top:-30%;right:-20%;width:200px;height:200px;
  background:radial-gradient(circle,rgba(255,255,255,.22) 0%,transparent 70%);
}
.dep-card-cta:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(253,184,19,.35)}
.dcta-body{
  position:relative;z-index:2;text-align:center;color:#1a1a1a;
}
.dcta-icon{
  width:60px;height:60px;border-radius:50%;background:rgba(26,26,26,.12);
  display:flex;align-items:center;justify-content:center;margin:0 auto 14px;color:#1a1a1a;
}
.dcta-body b{display:block;font:800 17px Montserrat,sans-serif;letter-spacing:.5px;margin-bottom:6px}
.dcta-body span{display:block;font-size:12px;color:rgba(26,26,26,.7);line-height:1.4}
.dcta-arrow{
  margin-top:14px;display:inline-block;font-size:20px;font-weight:bold;
  transition:transform .3s;
}
.dep-card-cta:hover .dcta-arrow{transform:translateX(6px)}

/* Responsive */
@media(max-width:1100px){
  .dep-layout{grid-template-columns:1fr}
  .dep-hero{height:480px}
}
@media(max-width:1000px){
  .dep-kpi{grid-template-columns:repeat(2,1fr)}
  .dk-item:nth-child(2){border-right:none}
  .dk-item:nth-child(1),.dk-item:nth-child(2){border-bottom:1px solid rgba(255,255,255,.08)}
  .dep-side{grid-template-columns:1fr 1fr;gap:16px}
}
@media(max-width:640px){
  .section-deploy{padding:70px 0}
  .dep-kpi{grid-template-columns:1fr 1fr;border-radius:10px}
  .dk-item{padding:20px 14px}
  .dk-item b{font-size:28px}
  .dep-hero{height:380px}
  .dep-hero-mask{padding:24px}
  .dh-body h3{font-size:24px}
  .dh-meta{gap:18px}
  .dep-side{grid-template-columns:1fr 1fr;gap:12px}
  .dep-card{height:200px}
  .dep-flag{width:34px;height:34px;font-size:20px}
}

/* =========================================================
   FACTORY SECTION — magazine layout
   ========================================================= */
.section-factory{background:var(--light);padding:110px 0}

/* Layout */
.factory-layout{display:grid;grid-template-columns:1.4fr 1fr;gap:30px;margin-bottom:46px}

/* Main image card */
.fac-main{
  position:relative;display:block;height:560px;border-radius:14px;overflow:hidden;
  background:#1a1d22;text-decoration:none;color:#fff;
  box-shadow:0 12px 40px rgba(15,23,42,.12);
}
.fac-main img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.fac-main:hover img{transform:scale(1.04)}
.fac-overlay{
  position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;
  background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.92) 100%);
  padding:38px;
}
.fac-tag{
  position:absolute;top:24px;left:24px;display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px;border-radius:30px;background:rgba(220,38,38,.95);color:#fff;
  font:700 11px Inter,sans-serif;letter-spacing:1px;text-transform:uppercase;
  backdrop-filter:blur(10px);
}
.fac-pulse{width:8px;height:8px;border-radius:50%;background:#fff;animation:dhBeat 1.4s ease-in-out infinite}
.fac-overlay h3{font:800 30px/1.2 Montserrat,sans-serif;color:#fff;margin-bottom:10px;letter-spacing:-.5px}
.fac-overlay p{font-size:15px;color:rgba(255,255,255,.82);line-height:1.55;margin-bottom:18px;max-width:480px}
.fac-link{
  display:inline-block;font:700 13px Inter,sans-serif;color:#fff;letter-spacing:1px;
  text-transform:uppercase;padding:10px 0;border-bottom:2px solid var(--accent);
}
.fac-link:hover{color:var(--accent)}

/* 2x2 sub grid */
.fac-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fac-cell{
  position:relative;display:block;height:268px;border-radius:12px;overflow:hidden;
  background:#fff;text-decoration:none;color:inherit;
  box-shadow:0 4px 16px rgba(15,23,42,.06);
}
.fac-cell img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.fac-cell:hover img{transform:scale(1.06)}
.fac-cell::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,.85) 100%)}
.fc-lab{
  position:absolute;left:18px;right:18px;bottom:18px;z-index:2;
  font:800 14px Inter,sans-serif;color:#fff;letter-spacing:.5px;text-transform:uppercase;
}

/* Fact strip */
.fac-strip{
  display:grid;grid-template-columns:repeat(5,1fr) auto;gap:0;
  background:#fff;border-radius:14px;overflow:hidden;
  box-shadow:0 6px 22px rgba(15,23,42,.06);
  border:1px solid var(--border);
}
.fs-item{padding:26px 20px;text-align:center;border-right:1px solid var(--border)}
.fs-item:last-child{border-right:none}
.fs-item b{display:block;font:800 24px/1.1 Montserrat,sans-serif;color:var(--dark);margin-bottom:6px;letter-spacing:-.3px}
.fs-item span{font:500 11px/1.3 Inter,sans-serif;color:var(--muted);text-transform:uppercase;letter-spacing:1.2px}
.fs-cta{
  background:linear-gradient(135deg,var(--accent) 0%,#f59e0b 100%);
  text-decoration:none;color:#1a1a1a;
  display:flex;align-items:center;justify-content:center;
  font:700 13px Inter,sans-serif;letter-spacing:1px;text-transform:uppercase;
  padding:26px 32px;transition:.3s;
}
.fs-cta:hover{background:#1a1a1a;color:var(--accent)}

@media(max-width:1100px){
  .factory-layout{grid-template-columns:1fr}
  .fac-main{height:480px}
}
@media(max-width:1000px){
  .fac-strip{grid-template-columns:repeat(3,1fr)}
  .fs-item:nth-child(3){border-right:none}
  .fs-item{border-bottom:1px solid var(--border)}
  .fs-item:nth-last-child(-n+3){border-bottom:none}
  .fs-cta{grid-column:1/-1;border-right:none;border-top:1px solid var(--border)}
}
@media(max-width:640px){
  .section-factory{padding:70px 0}
  .fac-grid{gap:10px}
  .fac-cell{height:180px}
  .fac-overlay{padding:24px}
  .fac-overlay h3{font-size:24px}
  .fac-main{height:380px}
  .fac-strip{grid-template-columns:1fr 1fr}
  .fs-item{padding:20px 12px}
  .fs-item b{font-size:20px}
  .fs-cta{font-size:12px;padding:18px}
}

/* =========================================================
   NEWS
   ========================================================= */
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.news-card{
  border:1px solid var(--border);border-radius:14px;overflow:hidden;
  background:#fff;box-shadow:var(--shadow);transition:.35s;display:flex;flex-direction:column;color:inherit;
}
.news-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover)}
.news-card .n-img{aspect-ratio:16/10;overflow:hidden}
.news-card .n-img img{width:100%;height:100%;object-fit:cover;transition:.5s}
.news-card:hover .n-img img{transform:scale(1.05)}
.news-card .n-body{padding:24px;display:flex;flex-direction:column;flex:1}
.news-card .n-date{font-size:13px;color:var(--accent-2);font-weight:700;letter-spacing:.5px;margin-bottom:10px}
.news-card h3{font-size:18px;line-height:1.45;margin-bottom:12px;flex:1}
.news-card p{color:var(--muted);font-size:14px;margin-bottom:14px}
.news-card .n-link{color:var(--accent-2);font-weight:700;font-size:14px}

/* =========================================================
   CTA BAND
   ========================================================= */
.cta-band{background:linear-gradient(120deg,var(--dark),#000);color:#fff;text-align:center;padding:80px 0}
.cta-band h2{color:#fff;font-size:38px;margin-bottom:14px;font-weight:800;letter-spacing:-.02em}
.cta-band p{color:#aab2bd;margin-bottom:28px;font-size:17px}

/* =========================================================
   FAQ accordion
   ========================================================= */
.faq-list{max-width:860px;margin:0 auto;display:flex;flex-direction:column;gap:14px}
.faq-item{border:1px solid var(--border);border-radius:10px;background:#fff;overflow:hidden;transition:.25s}
.faq-item[open]{border-color:var(--accent);box-shadow:var(--shadow)}
.faq-item summary{
  list-style:none;cursor:pointer;padding:20px 24px;font-weight:600;font-size:16px;color:var(--dark);
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-size:22px;color:var(--accent-2);font-weight:700;transition:.2s}
.faq-item[open] summary::after{content:"−";transform:rotate(0)}
.faq-item .faq-a{padding:0 24px 22px;color:var(--muted);font-size:15px;line-height:1.7}

/* =========================================================
   PRODUCT DETAIL (untouched)
   ========================================================= */
.breadcrumb{font-size:13px;color:var(--muted);padding:18px 0;background:var(--light)}
.breadcrumb a:hover{color:var(--accent-2)}
.breadcrumb span{margin:0 8px}
.pd-wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:start}
.pd-gallery .main-img{border:1px solid var(--border);border-radius:12px;overflow:hidden;margin-bottom:14px;background:var(--light);display:flex;align-items:center;justify-content:center}
.pd-gallery .main-img img{width:100%;height:480px;object-fit:contain;padding:18px}
.pd-thumbs{display:flex;gap:10px;flex-wrap:wrap}
.pd-thumbs img{width:84px;height:84px;object-fit:contain;background:var(--light);padding:4px;border:2px solid var(--border);border-radius:8px;cursor:pointer;transition:.2s}
.pd-thumbs img.active,.pd-thumbs img:hover{border-color:var(--accent)}
.pd-info h1{font-size:32px;margin-bottom:14px}
.pd-info .lead{color:var(--muted);margin-bottom:18px}
.spec-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.pd-feats{margin-bottom:26px}
.pd-feats li{display:flex;gap:10px;padding:7px 0;font-size:15px;border-bottom:1px dashed var(--border)}
.pd-feats li .ck{color:var(--accent-2);font-weight:800;flex-shrink:0}

/* Inquiry form */
.inquiry-form{background:var(--light);border:1px solid var(--border);border-radius:12px;padding:24px}
.inquiry-form h4{font-size:18px;margin-bottom:4px}
.inquiry-form p.sm{color:var(--muted);font-size:13px;margin-bottom:16px}
.inquiry-form .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.inquiry-form input,.inquiry-form textarea,.inquiry-form select{
  width:100%;padding:11px 13px;border:1px solid var(--border);border-radius:7px;font-family:inherit;font-size:14px;background:#fff;margin-bottom:12px;
}
.inquiry-form input:focus,.inquiry-form textarea:focus,.inquiry-form select:focus{outline:none;border-color:var(--accent)}
.inquiry-form .btn{width:100%;justify-content:center}

/* Tabs */
.tabs{margin-top:60px}
.tab-head{display:flex;gap:6px;border-bottom:2px solid var(--border);margin-bottom:30px;flex-wrap:wrap}
.tab-btn{padding:14px 26px;font-weight:600;font-size:15px;color:var(--muted);cursor:pointer;border:0;background:none;border-bottom:3px solid transparent;margin-bottom:-2px;transition:.2s}
.tab-btn.active{color:var(--accent-2);border-bottom-color:var(--accent-2)}
.tab-panel{display:none;animation:fade .3s}
.tab-panel.active{display:block}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* Spec table (zebra + horizontal scroll on mobile) */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.spec{border-collapse:collapse;width:100%;min-width:560px;font-size:14px;background:#fff;border:1px solid var(--border);border-radius:8px;overflow:hidden}
table.spec th,table.spec td{padding:14px 20px;border-bottom:1px solid var(--border);text-align:left}
table.spec th,table.spec td{border-right:1px solid var(--border)}
table.spec th:last-child,table.spec td:last-child{border-right:0}
table.spec thead th{background:var(--dark);color:#fff;font-weight:700;font-size:13px;letter-spacing:.5px;text-transform:uppercase}
table.spec tbody tr:nth-child(even){background:#F8FAFC}
table.spec tbody tr:nth-child(odd){background:#FFFFFF}
table.spec tbody tr:hover{background:#FEF7E1}
table.spec td:first-child{font-weight:700;color:var(--dark);width:38%}

/* =========================================================
   PRODUCT DETAIL — Dual CTA + Inquire bar
   ========================================================= */
.pd-cta-row{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 0}
.pd-cta-row .btn{flex:1 1 220px;justify-content:center;min-width:200px;padding:15px 22px;font-size:14px}
.btn-pdf{background:#1A1A1A;color:#fff;border-color:#1A1A1A}
.btn-pdf:hover{background:#000;border-color:#000;color:#fff;transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.18)}
.btn-factory{background:var(--accent);color:#111418;border-color:var(--accent)}
.btn-factory:hover{background:var(--accent-2);color:#fff;border-color:var(--accent-2);transform:translateY(-2px);box-shadow:0 8px 18px rgba(253,184,19,.4)}
.btn-whatsapp{background:#25D366;color:#fff;border-color:#25D366}
.btn-whatsapp:hover{background:#1FB957;color:#fff;border-color:#1FB957;transform:translateY(-2px);box-shadow:0 8px 18px rgba(37,211,102,.4)}

/* =========================================================
   FLOATING DOCK — bottom-right WhatsApp + Get A Quote
   ========================================================= */
.floating-dock{position:fixed;right:20px;bottom:20px;z-index:998;display:flex;flex-direction:column;gap:12px;align-items:flex-end}
.fd-btn{display:flex;align-items:center;gap:10px;padding:12px 18px;border-radius:50px;font-weight:700;font-size:14px;color:#fff;box-shadow:0 6px 18px rgba(0,0,0,.18);transition:.25s;cursor:pointer;border:0;text-decoration:none;font-family:inherit}
.fd-btn:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,.25);color:#fff}
.fd-btn .fd-ic{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;background:rgba(255,255,255,.18);border-radius:50%;font-size:16px}
.fd-wa{background:#25D366}
.fd-wa:hover{background:#1FB957}
.fd-quote{background:var(--accent);color:#111}
.fd-quote:hover{background:var(--accent-2);color:#fff}
.fd-quote .fd-ic{background:rgba(0,0,0,.12);color:#111}
.fd-quote:hover .fd-ic{background:rgba(255,255,255,.18);color:#fff}
.fd-mail{background:#2563EB}
.fd-mail:hover{background:#1D4ED8;color:#fff}
.fd-mail .fd-ic{background:rgba(255,255,255,.18)}
.fd-quote .fd-ic{font-size:18px}
@media(max-width:600px){.floating-dock{right:12px;bottom:12px}.fd-btn{padding:11px 16px;font-size:13px}.fd-btn .fd-lab{display:none}}

/* Feature blocks */
/* =========================================================
   PRODUCT FEATURE BLOCK
   ========================================================= */
.feat-block{
  display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center;
  margin-bottom:60px;padding:36px;background:#fff;border-radius:18px;
  border:1px solid var(--border);box-shadow:0 4px 18px rgba(15,23,42,.04);
  transition:.35s;
}
.feat-block:hover{box-shadow:0 10px 32px rgba(15,23,42,.08);transform:translateY(-2px)}
.feat-block:nth-child(even) .fb-img{order:2}
.feat-block .fb-img{
  position:relative;border-radius:14px;overflow:hidden;background:#f6f7f9;height:340px;
  display:flex;align-items:center;justify-content:center;
}
.feat-block .fb-img img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:24px;
  transition:transform .5s ease;
}
.feat-block:hover .fb-img img{transform:scale(1.05)}
.feat-block .fb-img::before{
  content:"";position:absolute;top:18px;left:18px;width:46px;height:46px;border-radius:50%;
  background:var(--accent);color:#1a1a1a;font:800 14px Inter,sans-serif;
  display:flex;align-items:center;justify-content:center;z-index:3;
  counter-increment:fbc;
}
.feat-block:nth-child(1) .fb-img::before{content:"01"}
.feat-block:nth-child(2) .fb-img::before{content:"02"}
.feat-block:nth-child(3) .fb-img::before{content:"03"}
.feat-block h3{
  font:800 24px/1.2 Montserrat,sans-serif;color:var(--dark);margin-bottom:14px;
  display:flex;align-items:center;gap:14px;letter-spacing:-.3px;
}
.feat-block h3::before{
  content:"";width:36px;height:3px;background:var(--accent);
}
.feat-block p{color:var(--muted);font-size:15px;line-height:1.7}
.feat-block .fb-points{margin-top:18px;padding-top:18px;border-top:1px dashed var(--border)}
.feat-block .fb-points li{
  display:flex;align-items:flex-start;gap:10px;margin-bottom:10px;font-size:13px;color:#475569;line-height:1.5;
}
.feat-block .fb-points li::before{
  content:"✓";flex-shrink:0;width:20px;height:20px;border-radius:50%;
  background:rgba(253,184,19,.15);color:var(--accent);font-weight:bold;font-size:11px;
  display:inline-flex;align-items:center;justify-content:center;margin-top:1px;
}

/* PDF download */
.pdf-box{display:flex;align-items:center;gap:20px;flex-wrap:wrap;border:1px solid var(--border);border-radius:12px;padding:28px;background:var(--light)}
.pdf-box .pdf-ic{width:60px;height:60px;border-radius:12px;background:rgba(253,184,19,.16);display:flex;align-items:center;justify-content:center;font-size:30px}
.pdf-box .pb-txt{flex:1}
.pdf-box .pb-txt h4{font-size:18px;margin-bottom:4px}
.pdf-box .pb-txt p{color:var(--muted);font-size:14px}

/* =========================================================
   KEY COMPONENTS (untouched)
   ========================================================= */
.components{padding:80px 0;background:#fff;border-top:1px solid var(--border)}
.cd-wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:42px;align-items:center;margin-top:14px}
.cd-figure{position:relative;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:var(--light);aspect-ratio:4/3}
.cd-figure img{width:100%;height:100%;object-fit:cover}
.cd-dot{position:absolute;transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;background:var(--accent);color:#1a1a1a;font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(0,0,0,.35);border:2px solid #fff;z-index:2}
.cd-legend{display:flex;flex-direction:column;gap:16px}
.cd-legend li{display:flex;gap:14px;align-items:flex-start}
.cd-num{flex-shrink:0;width:30px;height:30px;border-radius:50%;background:var(--dark);color:var(--accent);font-weight:800;display:flex;align-items:center;justify-content:center;font-size:14px}
.cd-legend b{font-size:16px;color:var(--dark);display:block;margin-bottom:2px}
.cd-legend p{color:var(--muted);font-size:14px;line-height:1.55}

/* =========================================================
   FOOTER — upgraded
   ========================================================= */
.footer{position:relative;background:#0a0c0f;color:#cbd5e1;padding:0 0 0;overflow:hidden}

/* Top CTA banner */
.ftr-cta{background:linear-gradient(120deg,#0e1014 0%,#16191e 60%,#0e1014 100%);border-bottom:1px solid rgba(253,184,19,.18);padding:48px 0;position:relative;overflow:hidden}
.ftr-cta::before{content:"";position:absolute;left:-80px;top:50%;transform:translateY(-50%);width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(253,184,19,.16) 0%,transparent 70%);pointer-events:none}
.ftr-cta::after{content:"";position:absolute;right:8%;top:50%;transform:translateY(-50%);width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(253,184,19,.12) 0%,transparent 70%);pointer-events:none}
.ftr-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:40px;position:relative;z-index:2;flex-wrap:wrap}
.ftr-cta-text .eyebrow-light{color:var(--accent);font-size:12px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;display:inline-block;margin-bottom:8px}
.ftr-cta-text h3{color:#fff;font-size:28px;font-weight:800;letter-spacing:-.01em;margin-bottom:8px;line-height:1.25}
.ftr-cta-text p{color:rgba(255,255,255,.7);font-size:14.5px;margin:0}
.ftr-cta-form{display:flex;gap:10px;align-items:stretch;background:rgba(255,255,255,.06);padding:8px;border-radius:10px;border:1px solid rgba(255,255,255,.1);min-width:380px}
.ftr-cta-form input{flex:1;background:transparent;border:0;padding:12px 14px;color:#fff;font-size:14.5px;font-family:inherit;outline:0}
.ftr-cta-form input::placeholder{color:rgba(255,255,255,.45)}
.ftr-cta-form .btn{padding:13px 22px;white-space:nowrap;border-radius:7px}

/* Background decoration */
.ftr-bg{position:absolute;inset:0;pointer-events:none;z-index:0}
.ftr-deco{position:absolute;border-radius:50%;border:1px solid rgba(253,184,19,.08)}
.ftr-deco-1{width:520px;height:520px;right:-180px;top:80px;background:radial-gradient(circle,rgba(253,184,19,.05) 0%,transparent 70%)}
.ftr-deco-2{width:340px;height:340px;left:-120px;bottom:-100px;background:radial-gradient(circle,rgba(255,255,255,.03) 0%,transparent 70%)}

/* Grid */
.footer-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.5fr;gap:46px;padding:80px 0 60px;position:relative;z-index:2}
.ftr-col{position:relative}
.ftr-col-brand .f-logo{display:flex;align-items:center;gap:12px;color:#fff;font-weight:800;font-size:22px;margin-bottom:22px}
.ftr-col-brand .f-logo .f-mark{width:42px;height:42px;flex-shrink:0}
.ftr-col-brand .f-logo .f-brand{font-size:24px;letter-spacing:1.5px;display:flex;flex-direction:column;line-height:1.1;font-weight:800}
.ftr-col-brand .f-logo .f-brand em{font-style:normal;font-size:10.5px;font-weight:600;color:rgba(253,184,19,.95);text-transform:uppercase;letter-spacing:2px;margin-top:4px}
.ftr-col-brand .f-intro{font-size:14px;line-height:1.85;color:#9aa3af;max-width:380px;margin-bottom:22px}
.ftr-certs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}
.ftr-cert{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:11px 12px;background:linear-gradient(180deg,rgba(253,184,19,.07) 0%,rgba(253,184,19,.02) 100%);border:1px solid rgba(253,184,19,.18);border-radius:9px;min-width:78px;text-align:center;transition:.25s}
.ftr-cert:hover{background:linear-gradient(180deg,rgba(253,184,19,.13) 0%,rgba(253,184,19,.05) 100%);border-color:rgba(253,184,19,.35);transform:translateY(-2px)}
.ftr-cert .ci{color:var(--accent);font-size:18px;line-height:1;margin-bottom:4px}
.ftr-cert b{color:#fff;font-size:13px;font-weight:700;letter-spacing:.5px;display:block;line-height:1.2}
.ftr-cert i{color:rgba(255,255,255,.55);font-size:10px;font-style:normal;margin-top:2px;letter-spacing:.3px}

.footer h5{color:#fff;font-size:14px;margin-bottom:22px;position:relative;padding-bottom:12px;text-transform:uppercase;letter-spacing:1.8px;font-weight:700}
.footer h5::after{content:"";position:absolute;left:0;bottom:0;width:34px;height:3px;background:var(--accent);border-radius:2px}
.footer ul li{margin-bottom:11px;font-size:14px}
.footer ul li a{color:#9aa3af;transition:.2s;display:inline-block;position:relative;padding-left:0}
.footer ul li a:hover{color:var(--accent);padding-left:8px}
.footer ul li a:hover::before{content:"›";position:absolute;left:0;color:var(--accent);font-weight:700}

.ftr-col-contact .contact-line{display:flex;gap:12px;margin-bottom:18px;font-size:14px;color:#9aa3af;line-height:1.55;align-items:flex-start}
.ftr-col-contact .contact-line .ic{color:var(--accent);flex-shrink:0;width:36px;height:36px;border-radius:8px;background:rgba(253,184,19,.1);border:1px solid rgba(253,184,19,.2);display:flex;align-items:center;justify-content:center;margin-top:1px}
.ftr-col-contact .contact-line .ic svg{width:18px;height:18px;color:var(--accent)}
.ftr-col-contact .contact-line b{color:#fff;font-size:13.5px;display:block;margin-bottom:2px;font-weight:700;letter-spacing:.3px}
.ftr-col-contact .contact-line span{color:#9aa3af;font-size:13.5px;display:block;line-height:1.5}
.ftr-col-contact .contact-line span i{color:rgba(253,184,19,.75);font-style:normal;font-size:11.5px;margin-left:2px}

.footer-social{display:flex;gap:10px;margin-top:6px}
.footer-social a{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:#fff;transition:.25s;overflow:hidden}
.footer-social a svg{width:18px;height:18px;fill:currentColor}
.footer-social a:hover{background:var(--accent);border-color:var(--accent);color:#0a0c0f;transform:translateY(-3px);box-shadow:0 6px 16px rgba(253,184,19,.4)}

/* Bottom strip */
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.35);position:relative;z-index:2}
.ftr-bottom-grid{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px 0;flex-wrap:wrap;font-size:12.5px;color:#6b7280}
.ftr-copyright{color:#9aa3af}
.ftr-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:#6b7280}
.ftr-meta span{color:#9aa3af}
.ftr-meta a{color:#9aa3af;transition:.2s}
.ftr-meta a:hover{color:var(--accent)}
.ftr-meta i{color:rgba(253,184,19,.5);font-style:normal}
.ftr-made{display:flex;align-items:center;gap:8px;color:#9aa3af}
.ftr-made .flag{font-size:18px;line-height:1;filter:saturate(1.2)}

/* =========================================================
   FLOATING CTA + MODAL
   ========================================================= */
.mob-bar{display:none;position:fixed;bottom:0;left:0;right:0;z-index:200;background:#fff;border-top:1px solid var(--border);box-shadow:0 -4px 18px rgba(0,0,0,.08)}
.mob-bar a{flex:1;text-align:center;padding:8px 0;font-size:11px;color:var(--dark);display:flex;flex-direction:column;align-items:center;gap:3px}
.mob-bar a .mi{font-size:18px}
.mob-bar a.quote{background:var(--accent);color:#1a1a1a;font-weight:700}

.floating-cta{position:fixed;right:24px;bottom:24px;z-index:300;display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.fc-wa{width:54px;height:54px;border-radius:50%;background:#25D366;color:#fff;display:flex;align-items:center;justify-content:center;font-size:24px;box-shadow:0 6px 18px rgba(0,0,0,.25);transition:.25s}
.fc-wa:hover{transform:scale(1.08)}
.fc-quote{background:var(--accent);color:#111418;font-weight:700;font-size:15px;padding:14px 22px;border-radius:40px;box-shadow:0 6px 20px rgba(253,184,19,.45);display:inline-flex;align-items:center;gap:8px;transition:.25s}
.fc-quote:hover{background:var(--accent-2);transform:translateY(-2px);color:#fff}

.ty-modal{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:400;display:none;align-items:center;justify-content:center;padding:20px}
.ty-modal.show{display:flex;animation:fade .25s}
.ty-box{background:#fff;border-radius:14px;max-width:420px;width:100%;padding:40px 32px;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.3);position:relative}
.ty-box .ty-ic{width:64px;height:64px;border-radius:50%;background:rgba(253,184,19,.18);color:#b07d00;display:flex;align-items:center;justify-content:center;font-size:34px;margin:0 auto 18px}
.ty-box h3{font-size:22px;margin-bottom:10px;color:var(--dark)}
.ty-box p{color:var(--muted);font-size:15px;margin-bottom:22px;line-height:1.6}
.ty-box .btn{width:100%;justify-content:center}
.ty-close{position:absolute;top:14px;right:18px;font-size:22px;color:var(--muted);cursor:pointer;border:0;background:none;line-height:1}

.inp-err{border-color:#e11d48 !important;background:#fff5f7 !important}

/* =========================================================
   PAGE-SPECIFIC HEROES (about/contact/etc) — slim dark hero
   ========================================================= */
.page-hero{
  position:relative;padding:120px 0 90px;background:linear-gradient(135deg,#0a0c0f,#1a1d22);
  color:#fff;text-align:center;overflow:hidden;
}
.page-hero.slim{padding:96px 0 56px}
.page-hero.slim::before{background:radial-gradient(60% 60% at 50% 50%,rgba(253,184,19,.1) 0%,transparent 70%)}
.page-hero.slim h1{font-size:36px;margin-bottom:0}
.page-hero::before{
  content:"";position:absolute;inset:0;background:radial-gradient(60% 60% at 50% 30%,rgba(253,184,19,.18) 0%,transparent 70%);
}
.page-hero h1{color:#fff;font-size:46px;margin-bottom:14px;position:relative}
.page-hero .ph-sub{color:#cbd5e1;max-width:680px;margin:0 auto;position:relative;font-size:17px}
.page-hero .ph-eyebrow{display:inline-block;font-size:12.5px;letter-spacing:3px;color:var(--accent);font-weight:700;text-transform:uppercase;margin-bottom:14px;position:relative}
.page-hero .ph-bc{position:absolute;bottom:18px;left:0;right:0;font-size:13px;color:#94a3b8}
.page-hero .ph-bc a{color:var(--accent)}
.page-hero .ph-bc span{margin:0 8px;color:#475569}

/* V4.13: page-hero with product-family background (image#2) */
.page-hero.page-hero-banner{
  background:#0a0c0f url(../img/about-hero-products.jpg) center/cover no-repeat;
  padding:140px 0 100px;
  text-align:left;
  min-height:520px;
  display:flex;flex-direction:column;justify-content:center;
}
.page-hero.page-hero-banner .phb-mask{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg, rgba(10,12,15,.86) 0%, rgba(10,12,15,.55) 45%, rgba(10,12,15,.12) 100%);
}
.page-hero.page-hero-banner .container{position:relative;z-index:2;max-width:820px}
.page-hero.page-hero-banner h1{font-size:54px;letter-spacing:-.5px;color:#fff}
.page-hero.page-hero-banner .ph-sub{color:rgba(255,255,255,.92);max-width:640px;margin:0}
.page-hero.page-hero-banner .ph-eyebrow{margin-bottom:18px}
.page-hero.page-hero-banner .ph-bc{position:absolute;bottom:18px;left:0;right:0;color:rgba(255,255,255,.7)}
.page-hero.page-hero-banner .ph-bc a{color:rgba(255,255,255,.9)}
.page-hero.page-hero-banner .ph-bc span{color:rgba(255,255,255,.4)}

/* V4.x: Diesel product page hero — night-mining scene + dark overlay (centered layout) */
.page-hero.diesel-hero{
  background:#0a0c0f url(../img/diesel-hero-banner.jpg) center/cover no-repeat;
  padding:150px 0 110px;
  min-height:480px;
  text-align:center;
  display:flex;flex-direction:column;justify-content:center;
}
.page-hero.diesel-hero .phb-mask{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg, rgba(0,0,0,.50) 0%, rgba(0,0,0,.60) 100%);
}
.page-hero.diesel-hero .container{position:relative;z-index:2;max-width:900px}
.page-hero.diesel-hero h1{font-size:52px;letter-spacing:-.5px;color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.55);max-width:880px;margin:0 auto 16px}
.page-hero.diesel-hero .ph-sub{color:rgba(255,255,255,.92);max-width:680px;margin:0 auto}
.page-hero.diesel-hero .ph-eyebrow{margin-bottom:18px}
.page-hero.diesel-hero .ph-bc{position:absolute;bottom:22px;left:0;right:0;color:rgba(255,255,255,.78);font-size:13px}
.page-hero.diesel-hero .ph-bc a{color:rgba(255,255,255,.95);text-decoration:none}
.page-hero.diesel-hero .ph-bc a:hover{text-decoration:underline}
.page-hero.diesel-hero .ph-bc span{color:rgba(255,255,255,.4);margin:0 8px}
@media(max-width:768px){
  .page-hero.diesel-hero{padding:110px 0 80px;min-height:380px}
  .page-hero.diesel-hero h1{font-size:32px}
}

/* =========================================================
   APPLICATIONS MODULE
   ========================================================= */
.app-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:32px 28px}
.app-card{position:relative;display:block;border-radius:12px;overflow:hidden;background:#0f1216;box-shadow:0 10px 28px rgba(10,18,28,.22),0 2px 6px rgba(10,18,28,.14);transition:transform .35s ease,box-shadow .35s ease;cursor:pointer}
.app-card:hover{transform:translateY(-8px);box-shadow:0 22px 48px rgba(10,18,28,.38),0 8px 18px rgba(10,18,28,.20)}
.app-card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;transition:transform .5s ease}
.app-card:hover img{transform:scale(1.08)}
.app-body{padding:22px 24px 26px;background:#fff}
.app-body h4{font-size:20px;font-weight:700;color:#0e1a26;margin:0 0 8px;letter-spacing:-.2px}
.app-body p{font-size:14.5px;line-height:1.6;color:#4a5563;margin:0}

/* =========================================================
   FACTORY TOUR MODULE — card grid (Real Factory Tour & Production Line)
   ========================================================= */
.factory-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:30px}
.factory-card{position:relative;display:block;border-radius:10px;overflow:hidden;background:#0f1216;box-shadow:0 6px 20px rgba(10,18,28,.18),0 2px 4px rgba(10,18,28,.10);transition:transform .35s ease,box-shadow .35s ease;cursor:pointer;text-decoration:none;color:inherit}
.factory-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(10,18,28,.32),0 6px 12px rgba(10,18,28,.18)}
.factory-card img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;transition:transform .5s ease}
.factory-card:hover img{transform:scale(1.08)}
.factory-cap{padding:14px 16px 16px;background:#fff;border-top:1px solid #eef0f3}
.factory-cap b{display:block;font-size:14.5px;font-weight:700;color:#0e1a26;margin-bottom:3px;letter-spacing:-.1px}
.factory-cap span{font-size:12.5px;color:#6b7280;line-height:1.45;display:block}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media(max-width:1200px){
  .nav ul li>a{padding:18px 16px;font-size:13.5px}
  .product-grid{grid-template-columns:repeat(4,1fr);gap:22px}
}
@media(max-width:1024px){
  .hero h1{font-size:48px}
  .product-row{grid-template-columns:1fr 1fr;gap:30px}
  .product-row h3{font-size:23px}
  .app-grid{grid-template-columns:repeat(2,1fr)}
  .stats{grid-template-columns:repeat(2,1fr)}
  .trust-row{grid-template-columns:repeat(3,1fr)}
  .factory-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
  .ftr-cta-inner{flex-direction:column;align-items:flex-start;gap:24px}
  .ftr-cta-form{width:100%;min-width:0}
  .ftr-cta-text h3{font-size:24px}
  .ftr-bottom-grid{flex-direction:column;align-items:flex-start;gap:12px}
  .pd-wrap{grid-template-columns:1fr;gap:32px}
  .feat-block{grid-template-columns:1fr;gap:20px}
  .feat-block:nth-child(even) .fb-img{order:0}
}
@media(max-width:1000px){
  .product-grid{grid-template-columns:repeat(3,1fr);gap:22px}
}
@media(max-width:880px){
  .nav ul{display:none;position:absolute;top:100%;left:0;right:0;background:rgba(18,22,28,.85);-webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%);flex-direction:column;align-items:stretch;padding:10px 0;gap:0;border-bottom-left-radius:14px;border-bottom-right-radius:14px}
  .nav ul.show{display:flex;z-index:200;box-shadow:0 16px 36px rgba(0,0,0,.35)}
  .nav ul li>a{padding:14px 24px;border-bottom:1px solid rgba(255,255,255,.06)!important;border-bottom-width:1px!important}
  .nav ul li a{border-bottom:0}
  .nav ul li>a:hover{border-bottom:1px solid rgba(255,255,255,.06)}
  .dropdown{position:static;width:100%;grid-template-columns:1fr;display:none;background:rgba(255,255,255,.06);box-shadow:none;padding:6px 12px;border-radius:0}
  .dropdown a{color:#fff;border:0}
  .dropdown a b{color:#fff}
  .dropdown a span{color:#9aa3af}
  .has-dd.open .dropdown{display:grid}
  .nav-toggle{display:flex}
  .header-band{padding:14px 0}
  .logo .ltag{display:none}
  .logo .lname{font-size:20px}

  /* Hero floating nav → collapsible */
  .hero-nav{padding:16px 0}
  .hero-nav .hn-nav .hn-menu{
    display:none;position:absolute;top:100%;right:0;
    background:rgba(18,22,28,.55);
    -webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%);
    flex-direction:column;align-items:stretch;min-width:240px;padding:10px 0;
    border:1px solid rgba(255,255,255,.16);border-radius:0 0 16px 16px;
    box-shadow:0 22px 50px rgba(0,0,0,.5);
  }
  .hero-nav .hn-nav .hn-menu.show{display:flex}
  .hero-nav .hn-menu>li>a{padding:13px 22px;text-shadow:none}
  .hero-nav .hn-menu>li>a::after{display:none}
  .hero-nav .hn-has:hover .hn-drop{opacity:0;visibility:hidden;transform:translateY(8px)}
  .hn-drop{position:static;width:100%;grid-template-columns:1fr;background:rgba(255,255,255,.06);box-shadow:none;display:none;opacity:1;visibility:visible;transform:none;border-radius:0;padding:4px 0}
  .hn-drop.small{width:100%}
  .hn-drop a{color:#fff;padding:11px 22px}
  .hn-drop a b{color:#fff}
  .hn-drop a span{color:#9aa3af}
  .hn-drop a img{display:none}
  .hero-nav .hn-has.open .hn-drop{display:grid;opacity:1;visibility:visible;transform:none}
  .hero-nav .hn-toggle{display:flex}
  .hero-nav .hn-quote{display:none}
  .hero-nav{min-height:auto}
  .hero-nav .hn-nav{justify-content:flex-end}

  /* Standard header (sub-pages, white) → collapsible */
  .header-standard{min-height:auto;padding:14px 20px}
  .header-standard .hn-nav{justify-content:flex-end}
  .header-standard .hn-nav .hn-menu{
    display:none;position:absolute;top:100%;right:0;background:#fff;
    flex-direction:column;align-items:stretch;min-width:250px;padding:10px 0;
    border:1px solid var(--border);border-radius:0 0 16px 16px;
    box-shadow:0 22px 50px rgba(0,0,0,.18);
  }
  .header-standard .hn-nav .hn-menu.show{display:flex}
  .header-standard .hn-menu>li>a{padding:13px 22px}
  .header-standard .hn-menu>li>a::after{display:none}
  .header-standard .hn-has:hover .hn-drop{opacity:0;visibility:hidden;transform:translateY(8px)}
  .header-standard .hn-has.open .hn-drop{display:grid;opacity:1;visibility:visible;transform:none}
  .header-standard .hn-drop{background:#f5f6f8;border-radius:0;padding:4px 0}
  .header-standard .hn-drop a{color:var(--dark);padding:11px 22px}
  .header-standard .hn-drop a:hover{background:rgba(253,184,19,.18)}
  .header-standard .hn-drop a b{color:var(--dark)}
  .header-standard .hn-drop a span{color:var(--muted)}
  .header-standard .hn-toggle{display:flex}
  .header-standard .hn-quote{display:none}
}
@media(max-width:768px){
  .section{padding:60px 0}
  .container{padding:0 22px}
  .section-lg{padding:70px 0}
  .topbar-left a:nth-child(2){display:none}
  .hero{min-height:560px}
  .hero h1{font-size:36px}
  .hero .sub{font-size:16px}
  .hero-inner{padding:90px 0 100px}
  .hero-stats .container{grid-template-columns:repeat(2,1fr);padding:18px}
  .hs-item{padding:12px 0;border-right:0}
  .hs-item:nth-child(odd){border-right:1px solid rgba(255,255,255,.08)}
  .section-head h2{font-size:28px}
  .section-head{margin-bottom:42px}
  .stats{grid-template-columns:repeat(2,1fr)}
  .trust-row{grid-template-columns:repeat(2,1fr);padding-top:30px;margin-top:30px}
  .product-grid{grid-template-columns:repeat(2,1fr);gap:16px}
  .hero-scene-tag{margin-top:34px}
  .app-grid{grid-template-columns:1fr;gap:14px}
  .news-grid{grid-template-columns:1fr}
  .factory-grid{grid-template-columns:1fr;gap:14px}
  .footer-grid{grid-template-columns:1fr}
  .ftr-cta-form{flex-direction:column;background:transparent;padding:0;border:0;gap:12px}
  .ftr-cta-form input{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:14px}
  .ftr-meta{font-size:11.5px}
  .inquiry-form .row{grid-template-columns:1fr}
  .mob-bar{display:flex}
  body{padding-bottom:64px}
  .page-hero{padding:90px 0 70px}
  .page-hero h1{font-size:32px}
  .cd-wrap{grid-template-columns:1fr;gap:24px}
  .floating-cta{display:none}
  .cta-band{padding:60px 0}
  .cta-band h2{font-size:26px}
}
@media(max-width:480px){
  .product-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .hero h1{font-size:30px}
  .logo .lname{font-size:18px}
}

/* Product grid never collapses to a single column — compact 2-up on phones */
@media(max-width:560px){
  .product-grid{gap:12px}
  .product-card .pc-img{height:150px}
  .product-card .pc-body{padding:14px}
  .product-card .pc-eyebrow{font-size:10px;margin-bottom:6px}
  .product-card h3{font-size:14.5px;margin-bottom:8px}
  .product-card p{font-size:12.5px;line-height:1.5;margin-bottom:10px}
  .product-card .pc-tags{gap:6px;margin-bottom:10px}
  .product-card .pc-tags i{font-size:11px;padding:4px 9px}
  .product-card .pc-link{font-size:12.5px}
}

/* =========================================================
   OEM / ODM SERVICES (about page)
   ========================================================= */
.oem-intro{display:grid;grid-template-columns:1.05fr .95fr;gap:36px;align-items:center}
.oem-intro h3{font-size:22px;margin-bottom:14px}
.oem-intro .pd-feats li{margin-bottom:10px}
.oem-intro-imgs{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.oem-intro-imgs img{width:100%;height:225px;object-fit:cover;border-radius:14px;border:1px solid var(--border)}
.oem-cap-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.oem-cap{background:#fff;border:1px solid var(--border);border-radius:14px;padding:22px 20px;transition:.25s}
.oem-cap:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.09);border-color:rgba(253,184,19,.55)}
.oem-cap .oc-n{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:9px;background:rgba(253,184,19,.16);color:#9a7208;font-weight:800;font-size:13px;margin-bottom:12px}
.oem-cap .oc-t{display:block;font-weight:800;font-size:15px;margin-bottom:8px;color:var(--dark)}
.oem-cap .oc-d{display:block;font-size:13.5px;line-height:1.55;color:var(--muted)}
.oem-flow{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.oem-step{background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px 14px;text-align:center}
.oem-step .os-n{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--accent);color:#111418;font-weight:800;font-size:14px}
.oem-step b{display:block;font-size:14px;margin:10px 0 6px;color:var(--dark)}
.oem-step span{display:block;font-size:12.5px;color:var(--muted);line-height:1.5}
.oem-hooks{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;margin-top:48px}
.oem-hooks .pd-feats li{margin-bottom:10px}
.oem-hooks-imgs{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.oem-hooks-imgs img{width:100%;height:215px;object-fit:cover;border-radius:14px;border:1px solid var(--border)}
.oem-scen-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.oem-scen{background:#fff;border:1px solid var(--border);border-radius:14px;padding:22px 20px;transition:.25s}
.oem-scen:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.09)}
.oem-scen .os-tag{display:inline-block;background:rgba(253,184,19,.16);color:#9a7208;font-weight:700;font-size:11.5px;letter-spacing:.6px;text-transform:uppercase;border-radius:30px;padding:5px 12px;margin-bottom:12px}
.oem-scen b{display:block;font-size:15px;margin-bottom:8px;color:var(--dark)}
.oem-scen p{font-size:13px;color:var(--muted);line-height:1.6}
@media(max-width:1000px){
  .oem-intro,.oem-hooks{grid-template-columns:1fr}
  .oem-cap-grid,.oem-scen-grid{grid-template-columns:repeat(2,1fr)}
  .oem-flow{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:640px){
  .oem-cap-grid,.oem-scen-grid,.oem-flow,.oem-intro-imgs,.oem-hooks-imgs{grid-template-columns:1fr}
  .oem-intro-imgs img,.oem-hooks-imgs img{height:200px}
}