/* =========================================================
   LELEKA DRON — app.css  (v2 · Tactical HUD)
   Light sand · olive panels · yellow accent · pixel display
   ========================================================= */

:root{
  /* palette */
  --sand:#d7d4c3;
  --sand-2:#cecaba;
  --sand-3:#e3e0d2;
  --olive:#5d6440;
  --olive-2:#4b5132;
  --olive-3:#6e7649;
  --olive-soft:#7c8358;
  --ink:#23251a;
  --ink-2:#4a4e38;
  --cream:#e9e7d6;
  --cream-2:#c8c7b2;
  --yellow:#f3c80f;
  --yellow-2:#ffd633;
  --yellow-ink:#1c1b08;
  --line:rgba(35,37,26,.18);
  --line-2:rgba(35,37,26,.10);
  --grid:rgba(35,37,26,.06);

  --cut:16px;
  --maxw:1240px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --pixel:'Handjet','Pixelify Sans',system-ui,sans-serif;
  --pixel2:'Pixelify Sans',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --sans:'Manrope',system-ui,sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{
  font-family:var(--sans);
  background:var(--sand);
  color:var(--ink);
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  cursor:auto;
}
body.lock{overflow:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
.container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 28px}
section{position:relative}

/* paper + grid texture */
body::before{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background-image:
    linear-gradient(var(--grid) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:42px 42px;
  opacity:.7;
}
body::after{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- Typography ---------- */
h1,h2,h3,.pixel{font-family:var(--pixel);font-weight:600;line-height:1.02;letter-spacing:.005em;text-transform:uppercase}
h1{font-size:clamp(38px,6.4vw,86px)}
h2{font-size:clamp(28px,4.4vw,56px)}
h3{font-size:clamp(18px,2vw,24px)}
/* accent word on a dark gradient chip (site-wide) */
.hl{color:var(--yellow);
  background:linear-gradient(135deg,#15180e 0%,#363c22 100%);
  padding:.03em .26em .07em;
  -webkit-box-decoration-break:clone;box-decoration-break:clone}
/* Ukrainian-flag headline word: blue top, yellow bottom, on dark gradient chip */
.hl-flag{position:relative;isolation:isolate;padding:.03em .28em .07em;
  background:linear-gradient(180deg,#0a64d6 0 47%,#ffd400 53% 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 2px 0 rgba(20,22,12,.45)) drop-shadow(0 0 1px rgba(20,22,12,.35))}
.hl-flag::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(135deg,#15180e 0%,#363c22 100%);
  clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,7px 100%,0 calc(100% - 7px))}
.ink-hl{background:var(--yellow);color:var(--yellow-ink);padding:0 .18em}
p{color:var(--ink-2)}
.lead{font-size:clamp(16px,1.5vw,19px);color:var(--ink-2)}

.eyebrow,.mono{font-family:var(--mono);font-weight:500;letter-spacing:.18em;text-transform:uppercase;font-size:12px;color:var(--ink-2)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--olive-2)}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--olive-2)}
.num{font-family:var(--mono);font-weight:700;color:var(--olive-2)}

/* section heading block */
.shead{display:flex;flex-direction:column;gap:13px;margin-bottom:30px;position:relative}
.shead--center{align-items:center;text-align:center}
.shead h2{max-width:18ch}

/* ---------- HUD primitives ---------- */
/* chamfered solid panel */
.cut{clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,var(--cut) 100%,0 calc(100% - var(--cut)))}
.cut-all{clip-path:polygon(var(--cut) 0,calc(100% - var(--cut)) 0,100% var(--cut),100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,var(--cut) 100%,0 calc(100% - var(--cut)),0 var(--cut))}

/* corner-bracket frame (transparent) */
.frame{position:relative}
.frame>.br{position:absolute;width:22px;height:22px;border:2px solid var(--olive-2);pointer-events:none;transition:all .5s var(--ease)}
.frame>.br.tl{top:8px;left:8px;border-right:0;border-bottom:0}
.frame>.br.tr{top:8px;right:8px;border-left:0;border-bottom:0}
.frame>.br.bl{bottom:8px;left:8px;border-right:0;border-top:0}
.frame>.br.br2{bottom:8px;right:8px;border-left:0;border-top:0}

/* reticle / crosshair marker */
.reticle{position:relative;width:26px;height:26px;flex:none}
.reticle::before,.reticle::after{content:"";position:absolute;background:var(--olive-2)}
.reticle::before{left:50%;top:0;width:1.5px;height:100%;transform:translateX(-50%)}
.reticle::after{top:50%;left:0;height:1.5px;width:100%;transform:translateY(-50%)}
.reticle i{position:absolute;inset:7px;border:1.5px solid var(--olive-2);border-radius:50%}

/* ruler strip with ticks + numbers */
.ruler{height:20px;display:flex;align-items:center;gap:0;position:relative;
  background-image:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px 14px);
  background-position:bottom;background-repeat:repeat-x;background-size:auto 8px}
.ruler__n{font-family:var(--mono);font-size:9.5px;color:var(--ink-2);opacity:.6;position:absolute;bottom:9px}

/* tiny + markers scattered */
.plus{position:absolute;font-family:var(--mono);color:var(--line);font-size:16px;line-height:1;pointer-events:none;user-select:none}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;justify-content:center;
  font-family:var(--pixel);font-weight:500;letter-spacing:.02em;text-transform:uppercase;font-size:16px;
  padding:14px 26px;border:0;position:relative;transition:transform .3s var(--ease),background .25s,color .25s;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}
.btn--yellow{background:var(--yellow);color:var(--yellow-ink)}
.btn--yellow:hover{background:var(--yellow-2);transform:translateY(-2px)}
.btn--olive{background:var(--olive);color:var(--cream)}
.btn--olive:hover{background:var(--olive-2);transform:translateY(-2px)}
.btn--ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn--ghost:hover{background:var(--ink);color:var(--sand)}
.btn--lg{padding:18px 34px;font-size:15px}
.btn--block{width:100%}
.btn svg{width:16px;height:16px}

/* ---------- Boot / preloader ---------- */
#boot{position:fixed;inset:0;z-index:9999;background:var(--olive-2);color:var(--cream);
  display:grid;place-items:center;transition:opacity .5s ease,visibility .5s ease}
#boot.done{opacity:0;visibility:hidden}
#boot::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.25;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.25) 0 2px,transparent 2px 4px)}
.boot__box{width:min(440px,86vw);font-family:var(--mono);font-size:13px;position:relative;z-index:2}
.boot__logo{font-family:var(--pixel);font-size:30px;letter-spacing:.06em;margin-bottom:16px;color:var(--yellow)}
.boot__log{min-height:96px;line-height:1.9;white-space:pre-wrap;color:var(--cream-2)}
.boot__log b{color:var(--yellow)}
.boot__bar{margin-top:14px;height:6px;background:rgba(255,255,255,.15)}
.boot__bar i{display:block;height:100%;width:0;background:var(--yellow);transition:width .2s linear}

/* ---------- Page transition overlay ---------- */
#trans{position:fixed;inset:0;z-index:9500;background:var(--olive-2);pointer-events:none;
  transform:scaleY(0);transform-origin:bottom;transition:transform .5s var(--ease)}
#trans.in{transform:scaleY(1);transform-origin:bottom}
#trans.out{transform:scaleY(1);transform-origin:top;animation:transOut .55s var(--ease) forwards}
@keyframes transOut{to{transform:scaleY(0);transform-origin:top}}
#trans::before{content:"";position:absolute;inset:0;opacity:.3;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.3) 0 2px,transparent 2px 4px)}
#trans span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-family:var(--pixel);
  color:var(--yellow);font-size:24px;letter-spacing:.1em;opacity:0;transition:opacity .25s}
#trans.in span{opacity:1}

/* ---------- Custom cursor (reticle) ---------- */
.cursor{position:fixed;left:0;top:0;z-index:9600;pointer-events:none;mix-blend-mode:multiply;
  width:30px;height:30px;margin:-15px 0 0 -15px;transition:width .2s,height .2s,margin .2s,opacity .3s;opacity:0}
.cursor::before,.cursor::after{content:"";position:absolute;background:var(--olive-2)}
.cursor::before{left:50%;top:-6px;bottom:-6px;width:1.5px;transform:translateX(-50%)}
.cursor::after{top:50%;left:-6px;right:-6px;height:1.5px;transform:translateY(-50%)}
.cursor i{position:absolute;inset:0;border:1.5px solid var(--olive-2);border-radius:50%}
.cursor.hot{width:46px;height:46px;margin:-23px 0 0 -23px}
.cursor.hot i{border-color:var(--yellow);background:rgba(243,200,15,.12)}
@media(hover:none){.cursor{display:none}}

/* ---------- Header ---------- */
.site-header{position:fixed;top:0;left:0;width:100%;z-index:900;transition:transform .4s var(--ease)}
.site-header .container{position:relative}
.site-header__bar{position:relative;display:flex;align-items:center;justify-content:flex-end;gap:clamp(12px,2vw,24px);
  margin-top:clamp(22px,3.2vh,32px);min-height:clamp(76px,8.2vh,86px);padding:8px clamp(18px,2.2vw,30px)}
.site-header__bar::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--sand-3);box-shadow:0 0 0 1.5px var(--line);
  clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}
.site-header.hide{transform:translateY(-200%)}
.brand-logo{position:absolute;left:clamp(60px,6.4vw,92px);top:50%;transform:translateY(-50%);z-index:40;display:block;line-height:0;
  filter:drop-shadow(0 7px 14px rgba(35,37,26,.34))}
.brand-logo img{height:clamp(104px,9vw,116px);width:auto;display:block;transition:transform .4s var(--ease)}
.brand-logo:hover img{transform:scale(1.04)}
.foot-logo{display:inline-block;line-height:0}
.foot-logo img{height:clamp(112px,11vw,142px);width:auto;display:block;filter:drop-shadow(0 8px 16px rgba(0,0,0,.3))}
.foot-deco{width:min(240px,86%);margin-top:20px;filter:drop-shadow(0 14px 22px rgba(0,0,0,.45));animation:floaty 6s ease-in-out infinite}
.foot-deco-cta{margin-top:18px}
/* language toggle */
.lang-toggle{position:relative;display:inline-flex;align-items:center;background:var(--sand);
  box-shadow:inset 0 0 0 1.5px var(--line);padding:3px;cursor:pointer;
  clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,7px 100%,0 calc(100% - 7px))}
.lang-toggle__opt{position:relative;z-index:2;font-family:var(--mono);font-weight:700;font-size:12px;letter-spacing:.05em;
  padding:6px 12px;color:var(--ink-2);background:none;border:0;cursor:pointer;transition:color .25s}
.lang-toggle__thumb{position:absolute;z-index:1;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);
  background:var(--olive);transition:transform .3s var(--ease);
  clip-path:polygon(0 0,calc(100% - 5px) 0,100% 5px,100% 100%,5px 100%,0 calc(100% - 5px))}
html[data-lang="en"] .lang-toggle__thumb{transform:translateX(100%)}
html[data-lang="uk"] .lang-toggle__opt[data-l="uk"],html[data-lang="en"] .lang-toggle__opt[data-l="en"]{color:var(--cream)}
.header-cta{padding:11px 18px!important;font-size:14px!important}
.brand{display:flex;align-items:center;gap:11px}
.brand__mark{width:38px;height:38px;flex:none}
.brand__txt{font-family:var(--pixel);font-size:19px;letter-spacing:.04em;line-height:1}
.brand__txt b{color:var(--olive-2);font-weight:600}
.brand__txt span{color:var(--ink)}
.mainnav{position:absolute;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:clamp(6px,1.3vw,20px)}
.mainnav a{font-family:var(--pixel);font-weight:500;text-transform:uppercase;letter-spacing:.02em;font-size:16px;white-space:nowrap;
  color:var(--ink-2);padding:9px 11px;position:relative;transition:color .25s}
.mainnav a::after{content:"";position:absolute;left:13px;bottom:5px;width:0;height:2px;background:var(--yellow);transition:width .3s var(--ease)}
.mainnav a:hover,.mainnav a.active{color:var(--ink)}
.mainnav a:hover::after,.mainnav a.active::after{width:calc(100% - 26px)}
/* dropdown submenus */
.nav-item{position:relative;display:flex;align-items:center}
.has-sub>a::after{content:"▾";position:static;width:auto;height:auto;background:none;margin-left:5px;font-size:11px;opacity:.6;transition:transform .25s,opacity .25s}
.nav-item:hover.has-sub>a::after{transform:rotate(180deg);opacity:1}
.subnav{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(8px);min-width:236px;
  background:var(--sand-3);box-shadow:0 18px 36px -12px rgba(35,37,26,.5),0 0 0 1.5px var(--line);
  padding:9px;display:flex;flex-direction:column;gap:1px;opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .24s var(--ease),transform .24s var(--ease),visibility 0s linear .4s;z-index:60;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}
.subnav::before{content:"";position:absolute;left:-12px;right:-12px;top:-18px;height:20px}
.nav-item:hover .subnav,.nav-item:focus-within .subnav,.nav-item.open .subnav{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);
  transition:opacity .22s var(--ease),transform .22s var(--ease),visibility 0s}
.subnav a{font-family:var(--mono);font-weight:500;text-transform:none;letter-spacing:.01em;font-size:13px;white-space:nowrap;
  padding:10px 13px;color:var(--ink-2);transition:background .2s,color .2s;
  clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,7px 100%,0 calc(100% - 7px))}
.subnav a::after{display:none}
.subnav a:hover{background:var(--olive);color:var(--cream)}
.mnav-contacts{display:none}
.header__right{display:flex;align-items:center;gap:clamp(10px,1.2vw,16px)}
.lang{font-family:var(--mono);font-weight:700;font-size:12px;background:transparent;border:0;
  color:var(--ink-2);display:flex;gap:3px;padding:6px}
.lang b{color:var(--olive-2)}
html[data-lang="en"] .lang .l-ua{color:var(--ink-2);font-weight:500}
html[data-lang="en"] .lang .l-en{color:var(--olive-2);font-weight:700}
html[data-lang="uk"] .lang .l-en{color:var(--ink-2);font-weight:500}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;padding:6px}
.burger span{width:24px;height:2px;background:var(--ink);transition:.3s}
.burger.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.active span:nth-child(2){opacity:0}
.burger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- Footer ---------- */
.site-footer{margin-top:90px;background:var(--olive-2);color:var(--cream);position:relative;padding-top:60px}
.pixel-edge{position:absolute;top:-22px;left:0;width:100%;height:24px;display:flex;align-items:flex-end;overflow:hidden}
.pixel-edge i{flex:1;background:var(--olive-2)}
.foot__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:36px;padding-bottom:40px}
.foot__brand .brand__txt span{color:var(--cream)}
.foot__brand .brand__txt b{color:var(--yellow)}
.foot__slogan{font-family:var(--pixel);color:var(--yellow);text-transform:uppercase;margin-top:18px;font-size:clamp(20px,2.4vw,30px);letter-spacing:.04em;line-height:1.1}
.foot__col h4{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--cream-2);margin-bottom:14px}
.foot__col a,.foot__col p{display:block;color:var(--cream);opacity:.85;margin-bottom:9px;font-size:14.5px;transition:opacity .2s,color .2s}
.foot__col a:hover{opacity:1;color:var(--yellow)}
.foot__social{display:flex;gap:10px;margin-top:6px}
.foot__social a{width:40px;height:40px;display:grid;place-items:center;background:rgba(255,255,255,.08);color:var(--cream);transition:.25s;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}
.foot__social a:hover{background:var(--yellow);color:var(--yellow-ink)}
.foot__bottom{border-top:1px solid rgba(255,255,255,.14);padding:18px 0;display:flex;justify-content:space-between;
  flex-wrap:wrap;gap:8px;font-family:var(--mono);font-size:12px;color:var(--cream-2)}
.foot__bottom .glory{color:var(--yellow)}

/* ---------- Reveal animation ---------- */
.rv{opacity:0;transform:translateY(30px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv-clip{clip-path:inset(0 100% 0 0);transition:clip-path .6s var(--ease)}
.rv-clip.in{clip-path:inset(0 0 0 0)}
[data-stagger]>*{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
[data-stagger].in>*{opacity:1;transform:none}
/* heading clip-wipe (text always readable, never garbled) */
.rv-head{clip-path:inset(0 102% 0 -2%)}
.rv-head.in{clip-path:inset(0 -2% 0 -2%);transition:clip-path .75s var(--ease) .08s,opacity .6s var(--ease),transform .7s var(--ease)}

/* =========================================================
   SHARED CONTENT COMPONENTS
   ========================================================= */
.page{padding-top:120px}
.section{padding:clamp(38px,5vw,76px) 0}

/* HUD media frame (hero / showcase) */
.media-frame{position:relative;overflow:hidden;background:var(--olive-2)}
.media-frame img,.media-frame video{width:100%;height:100%;object-fit:cover;display:block}
.media-frame__scan{position:absolute;left:0;top:0;width:100%;height:2px;z-index:3;
  background:linear-gradient(90deg,transparent,var(--yellow),transparent);box-shadow:0 0 12px var(--yellow);
  animation:scanY 4s ease-in-out infinite}
@keyframes scanY{0%,100%{top:4%}50%{top:96%}}
.media-frame__tag{position:absolute;left:0;bottom:0;z-index:4;background:var(--yellow);color:var(--yellow-ink);
  font-family:var(--mono);font-weight:700;font-size:12px;letter-spacing:.08em;padding:7px 14px;text-transform:uppercase}
.media-frame .reticle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;width:40px;height:40px;mix-blend-mode:screen;opacity:.8}
.media-frame .reticle::before,.media-frame .reticle::after,.media-frame .reticle i{background:var(--yellow);border-color:var(--yellow)}

/* stat */
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stat{padding:30px 22px;border-right:1px solid var(--line);position:relative}
.stat:last-child{border-right:0}
.stat__n{font-family:var(--pixel);font-size:clamp(40px,5vw,60px);color:var(--olive-2);line-height:.95}
.stat__n i{font-style:normal;color:var(--yellow)}
.stat__l{font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2);margin-top:8px}
.stat::before{content:"+";position:absolute;top:10px;right:12px;font-family:var(--mono);color:var(--line)}

/* product / category cards */
.grid-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.pcard{background:var(--sand-3);box-shadow:0 0 0 1.5px var(--line);position:relative;overflow:hidden;
  transition:transform .45s var(--ease),box-shadow .35s;
  clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px))}
.pcard:hover{transform:translateY(-6px);box-shadow:0 0 0 1.5px var(--olive-2)}
.pcard__img{aspect-ratio:16/11;overflow:hidden;position:relative}
.pcard__img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease);filter:saturate(.92)}
.pcard:hover .pcard__img img{transform:scale(1.07)}
.pcard__no{position:absolute;top:10px;left:12px;font-family:var(--mono);font-weight:700;color:var(--cream);
  background:var(--olive-2);padding:3px 9px;font-size:12px;z-index:2}
.card__scan{position:absolute;left:0;top:0;width:100%;height:2px;z-index:3;opacity:0;pointer-events:none;
  background:linear-gradient(90deg,transparent,var(--yellow),transparent);box-shadow:0 0 10px var(--yellow)}
.pcard:hover .card__scan,.ncard:hover .card__scan{opacity:.9;animation:scanY 1.7s ease-in-out infinite}
.pcard__b{padding:20px 20px 24px}
.pcard__cat{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--olive-2)}
.pcard__b h3{margin:8px 0 10px;text-transform:none}
.pcard__b p{font-size:14px;line-height:1.55}
.pcard__more{display:inline-flex;align-items:center;gap:7px;margin-top:14px;font-family:var(--mono);font-weight:700;
  font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--olive-2)}
.pcard__more svg{width:15px;transition:transform .3s var(--ease)}
.pcard:hover .pcard__more svg{transform:translateX(5px)}

/* olive feature panel + numbered list (like screenshot) */
.panel{background:var(--olive);color:var(--cream);
  clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,var(--cut) 100%,0 calc(100% - var(--cut)))}
.numlist{display:grid;gap:12px}
.numitem{display:flex;align-items:center;gap:16px;background:var(--olive);color:var(--cream);padding:16px 20px;
  position:relative;transition:transform .35s var(--ease),background .25s;
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px))}
.numitem:hover{transform:translateX(8px);background:var(--olive-2)}
.numitem__ic{width:42px;height:42px;flex:none;display:grid;place-items:center;background:var(--olive-2);color:var(--yellow)}
.numitem__ic svg{width:22px;height:22px}
.numitem__no{position:absolute;top:8px;right:12px;font-family:var(--mono);font-size:11px;color:var(--cream-2)}
.numitem h4{font-family:var(--sans);font-weight:700;font-size:15px;text-transform:none}
.numitem p{color:var(--cream-2);font-size:13px;margin-top:2px}

/* big CTA block */
.cta-block{background:linear-gradient(100deg,rgba(64,70,42,.92),rgba(64,70,42,.55) 70%,rgba(64,70,42,.35)),var(--olive) url("../img/news/news-forbes.jpg") center/cover;
  color:var(--cream);padding:clamp(34px,5vw,56px);position:relative;overflow:hidden;
  display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;
  clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,24px 100%,0 calc(100% - 24px))}
.cta-block::after{content:"";position:absolute;left:0;top:0;width:100%;height:2px;z-index:1;opacity:.7;
  background:linear-gradient(90deg,transparent,var(--yellow),transparent);box-shadow:0 0 12px var(--yellow);animation:scanY 5s ease-in-out infinite}
.cta-block>*{position:relative;z-index:2}
.cta-block h2{color:var(--cream);max-width:16ch}
.cta-block .reticle{position:absolute;right:30px;top:24px;opacity:.5}
.cta-block .reticle::before,.cta-block .reticle::after,.cta-block .reticle i{background:var(--yellow);border-color:var(--yellow)}

/* marquee */
.marq{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0;background:var(--sand-2)}
.marq__t{display:flex;gap:30px;width:max-content;white-space:nowrap;animation:marq 26s linear infinite;align-items:center}
.marq:hover .marq__t{animation-play-state:paused}
.marq__t span{font-family:var(--pixel);font-size:clamp(20px,2.6vw,30px);text-transform:uppercase;color:var(--olive-2)}
.marq__t i{color:var(--yellow);font-style:normal}
@keyframes marq{to{transform:translateX(-50%)}}

/* simple form */
.form-card{background:var(--sand-3);box-shadow:0 0 0 1.5px var(--line);padding:clamp(24px,4vw,38px);
  clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,20px 100%,0 calc(100% - 20px))}
.field{position:relative;margin-bottom:16px}
.field label{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);margin-bottom:6px}
.field input,.field textarea{width:100%;background:var(--sand);border:1.5px solid var(--line);color:var(--ink);
  font-family:var(--sans);font-size:15px;padding:13px 14px;transition:border-color .2s}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--olive-2)}
.form-note{font-family:var(--mono);font-size:11px;color:var(--ink-2);margin-top:10px}

/* toast */
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,160%);z-index:1200;background:var(--olive-2);color:var(--cream);
  font-family:var(--mono);font-size:13px;padding:14px 22px;transition:transform .45s var(--ease);
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px))}
.toast.show{transform:translate(-50%,0)}

/* breadcrumb / page hero */
.page-hero{padding-top:140px;padding-bottom:30px}
.crumb{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);margin-bottom:16px}
.crumb a:hover{color:var(--olive-2)}
.crumb span{color:var(--olive-2)}

/* article cards */
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ncard{background:var(--sand-3);box-shadow:0 0 0 1.5px var(--line);overflow:hidden;transition:transform .4s var(--ease);
  clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}
.ncard:hover{transform:translateY(-5px)}
.ncard__img{aspect-ratio:16/10;overflow:hidden}
.ncard__img img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.ncard:hover .ncard__img img{transform:scale(1.06)}
.ncard__b{padding:18px 18px 22px}
.ncard__date{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--olive-2);text-transform:uppercase}
.ncard__b h3{font-family:var(--sans);font-weight:700;font-size:17px;text-transform:none;margin:8px 0;line-height:1.3}

/* job items */
.job{display:flex;align-items:center;justify-content:space-between;gap:20px;background:var(--sand-3);
  box-shadow:0 0 0 1.5px var(--line);padding:22px 24px;margin-bottom:14px;flex-wrap:wrap;transition:transform .35s var(--ease),box-shadow .3s;
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px))}
.job:hover{transform:translateX(6px);box-shadow:0 0 0 1.5px var(--olive-2)}
.job h3{font-family:var(--sans);font-weight:700;text-transform:none;font-size:18px}
.job__meta{font-family:var(--mono);font-size:12px;color:var(--ink-2);margin-top:4px}

/* product detail block (alternating) */
.prod{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px);align-items:center;margin-bottom:clamp(40px,6vw,90px);scroll-margin-top:120px}
.catnav{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.catnav a{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-2);background:var(--sand-3);box-shadow:0 0 0 1.5px var(--line);padding:9px 14px;transition:.25s;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}
.catnav a:hover{color:var(--olive-2);box-shadow:0 0 0 1.5px var(--olive-2)}
.prod:nth-child(even) .prod__media{order:2}
.prod__media{position:relative}
.prod__no{font-family:var(--pixel);font-size:60px;color:var(--line);line-height:1;position:absolute;top:-44px;left:0}
.prod h2{text-transform:none;margin:10px 0 14px}
.prod__cat{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--olive-2)}
.prod__feats{list-style:none;display:grid;gap:10px;margin:20px 0}
.prod__feats li{display:flex;gap:11px;align-items:flex-start;font-size:15px;color:var(--ink)}
.prod__feats li::before{content:"▸";color:var(--yellow);font-weight:700}
.spec{display:flex;gap:14px;flex-wrap:wrap;margin-top:18px}
.spec div{background:var(--sand-3);box-shadow:0 0 0 1.5px var(--line);padding:10px 14px;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}
.spec b{display:block;font-family:var(--pixel);font-size:20px;color:var(--olive-2)}
.spec span{font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2)}

/* feature cards (light) */
.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.fcard{background:var(--sand-3);box-shadow:0 0 0 1.5px var(--line);padding:30px 26px;transition:transform .4s var(--ease),box-shadow .3s;position:relative;overflow:hidden;
  clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}
.fcard:hover{transform:translateY(-6px);box-shadow:0 0 0 1.5px var(--olive-2)}
.fcard__img{margin:-30px -26px 18px;aspect-ratio:16/9;overflow:hidden;position:relative}
.fcard__img img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease);filter:saturate(.95)}
.fcard:hover .fcard__img img{transform:scale(1.07)}
.fcard__img .card__scan{position:absolute;left:0;top:0;width:100%;height:2px;opacity:0;pointer-events:none;background:linear-gradient(90deg,transparent,var(--yellow),transparent);box-shadow:0 0 10px var(--yellow)}
.fcard:hover .fcard__img .card__scan{opacity:.9;animation:scanY 1.7s ease-in-out infinite}
.fcard__no{position:absolute;top:12px;left:14px;right:auto;font-family:var(--mono);font-weight:700;font-size:11px;color:var(--cream);background:var(--olive-2);padding:3px 9px;z-index:2}
.fcard__ic{width:52px;height:52px;display:grid;place-items:center;background:var(--olive);color:var(--yellow);margin-bottom:16px;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}
.fcard__ic svg{width:24px;height:24px}
.fcard h3{text-transform:none;font-family:var(--sans);font-weight:700;font-size:18px;margin-bottom:8px}
.fcard p{font-size:14px;line-height:1.55}

/* process flow (a real sequence) */
.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.flow__step{background:var(--olive);color:var(--cream);padding:26px 22px;position:relative;
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px))}
.flow__no{font-family:var(--pixel);font-size:38px;color:var(--yellow);line-height:1}
.flow__step h4{font-family:var(--sans);font-weight:700;text-transform:none;margin:10px 0 6px;font-size:16px}
.flow__step p{color:var(--cream-2);font-size:13px}

/* ========== CUTOUT HERO (subject on clean tactical bg) ========== */
.hero-cut{position:relative;min-height:100svh;display:flex;align-items:center;padding:90px 0 24px;overflow:hidden}
.hero-cut__fx{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero-cut__glow{position:absolute;right:6%;top:50%;transform:translateY(-50%);width:min(600px,50vw);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(110,118,73,.4),rgba(243,200,15,.08) 45%,transparent 64%);filter:blur(6px)}
.hero-cut .container{position:relative;z-index:2;margin:0 auto;width:100%}
.hero-cut .ruler{margin-bottom:clamp(10px,2vh,20px)}
.hero-cut__grid{display:grid;grid-template-columns:1.04fr .96fr;gap:34px;align-items:center}
.hero-cut__text{max-width:640px}
.hero-cut__text h1{font-size:clamp(38px,5.2vw,76px);margin:12px 0 16px;color:var(--ink)}
.hero-cut__text .lead{max-width:46ch;font-size:clamp(15px,1.4vw,18px)}
.hero-cut__cta{display:flex;gap:13px;flex-wrap:wrap;margin-top:clamp(16px,2.4vh,26px)}
.hero-cut__chips{display:flex;gap:12px;margin-top:clamp(12px,2vh,22px);flex-wrap:wrap}

.hero-cut__visual{position:relative;display:grid;place-items:center;min-height:clamp(300px,44vh,520px)}
.radar{position:absolute;width:min(540px,94%);aspect-ratio:1;z-index:1}
.radar::before,.radar::after{content:"";position:absolute;border-radius:50%;border:1.5px solid var(--line)}
.radar::before{inset:0}
.radar::after{inset:18%;border-color:var(--line);border-style:dashed}
.radar i{position:absolute;inset:36%;border:1px solid var(--olive-3);border-radius:50%;opacity:.5}
.radar__sweep{position:absolute;width:min(540px,94%);aspect-ratio:1;border-radius:50%;z-index:1;
  background:conic-gradient(from 0deg,rgba(243,200,15,.3),transparent 26%);
  -webkit-mask:radial-gradient(circle,#000 0,transparent 72%);mask:radial-gradient(circle,#000 0,transparent 72%);
  animation:spin 6.5s linear infinite}
.radar__cross{position:absolute;width:min(540px,94%);aspect-ratio:1;z-index:1}
.radar__cross::before,.radar__cross::after{content:"";position:absolute;background:var(--line)}
.radar__cross::before{left:50%;top:0;bottom:0;width:1px;transform:translateX(-50%)}
.radar__cross::after{top:50%;left:0;right:0;height:1px;transform:translateY(-50%)}
.drone-cut{position:relative;z-index:3;width:min(560px,100%);max-height:min(60vh,540px);object-fit:contain;
  filter:drop-shadow(0 26px 36px rgba(35,37,26,.42));animation:floaty 6s ease-in-out infinite}
.hero-truck{width:min(680px,112%);max-height:min(54vh,440px)}
/* second floating subject — drone, moves OPPOSITE to the truck */
.hero-extra-drone{position:absolute;z-index:6;top:-16%;right:-6%;width:min(330px,48%);object-fit:contain;
  filter:drop-shadow(0 18px 26px rgba(35,37,26,.5));animation:floatyRev 5.5s ease-in-out infinite}
@keyframes floatyRev{0%,100%{transform:translateY(-12px) rotate(-2deg)}50%{transform:translateY(22px) rotate(2deg)}}
.hero-cut__dronetag{position:absolute;z-index:7;top:12%;right:3%;background:var(--olive-2);color:var(--cream);
  font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}
@media(max-width:860px){.hero-truck{width:min(440px,92%)}.hero-extra-drone{width:min(200px,50%);top:-6%;right:0}.hero-cut__dronetag{top:6%}}
.hero-cut__visual .reticle{position:absolute;z-index:4;left:58%;top:30%;width:40px;height:40px}
.hero-cut__visual .reticle::before,.hero-cut__visual .reticle::after,.hero-cut__visual .reticle i{background:var(--olive-2);border-color:var(--olive-2)}
.hero-cut__tagchip{position:absolute;z-index:4;right:6%;bottom:14%;background:var(--olive-2);color:var(--cream);
  font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}
@keyframes floaty{50%{transform:translateY(-18px)}}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:860px){
  .hero-cut__grid{grid-template-columns:1fr;text-align:center}
  .hero-cut__text{max-width:100%;display:flex;flex-direction:column}
  .hero-cut__text .eyebrow{order:1}
  .hero-cut__text h1{order:2}
  .hero-cut__text .lead{order:3;margin-inline:auto}
  .hero-cut__chips{order:4;justify-content:center}
  .hero-cut__cta{order:5;justify-content:center}
  .hero-cut__visual{order:-1;min-height:auto}
  .drone-cut{width:min(380px,82%)}
}

/* ========== IMAGE-FIRST HERO (unwave-style, light) ========== */
.hero-x{padding-top:116px}
.hero-x .ruler{margin-bottom:16px}
.hero-x__frame{position:relative;height:clamp(500px,78vh,800px);overflow:hidden;background:var(--olive-2)}
.hero-x__frame>img{position:absolute;inset:-7% 0;width:100%;height:114%;object-fit:cover;object-position:center}
.hero-x__scrim{position:absolute;inset:0;pointer-events:none;z-index:2;
  background:linear-gradient(100deg,var(--sand) 3%,rgba(215,212,195,.86) 24%,rgba(215,212,195,.3) 48%,rgba(35,37,26,.12) 76%,rgba(35,37,26,.32) 100%)}
.hero-x__scan{position:absolute;inset:0;pointer-events:none;z-index:2;mix-blend-mode:multiply;opacity:.45;
  background:repeating-linear-gradient(0deg,rgba(35,37,26,.12) 0 1px,transparent 1px 3px)}
.hero-x__overlay{position:absolute;left:0;top:0;bottom:0;display:flex;flex-direction:column;justify-content:center;
  padding:0 clamp(26px,4vw,60px);max-width:min(660px,64%);z-index:4}
.hero-x__overlay h1{font-size:clamp(40px,6.3vw,94px);margin:14px 0 18px;color:var(--ink)}
.hero-x__overlay .lead{max-width:44ch;color:var(--ink-2)}
.hero-x__cta{margin-top:26px;display:flex;gap:12px;flex-wrap:wrap}
.hero-x__cards{position:absolute;right:clamp(14px,2vw,26px);top:50%;transform:translateY(-50%);
  display:flex;flex-direction:column;gap:13px;z-index:4}
.hx-card{width:clamp(132px,14vw,170px);background:var(--olive);color:var(--cream);box-shadow:0 0 0 1.5px var(--olive-2);
  padding:20px 16px;text-align:center;transition:background .3s,transform .3s var(--ease),color .3s;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}
.hx-card:hover{background:var(--ink);color:var(--cream);transform:translateY(-4px)}
.hx-card:hover .hx-card__ic{color:var(--yellow)}
.hx-card__ic{display:block;margin:0 auto 10px;width:40px;height:40px;color:var(--yellow);transition:color .3s}
.hx-card__ic svg{width:100%;height:100%}
.hx-card b{display:block;font-family:var(--mono);font-weight:700;font-size:12px;letter-spacing:.05em;text-transform:uppercase;line-height:1.4}

/* ========== FULL-WIDTH SHOWCASE BAND (parallax image) ========== */
.showcase{position:relative;height:clamp(320px,46vh,520px);overflow:hidden;margin:clamp(16px,2.2vw,34px) 0;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.showcase>img{position:absolute;inset:-12% 0;width:100%;height:124%;object-fit:cover;will-change:transform}
.showcase__o{position:absolute;inset:0;background:linear-gradient(90deg,rgba(35,37,26,.6),rgba(35,37,26,.15) 60%,transparent)}
.showcase__scan{position:absolute;inset:0;mix-blend-mode:overlay;opacity:.4;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.25) 0 1px,transparent 1px 3px)}
.showcase__in{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center}
.showcase__in .eyebrow{color:var(--yellow)}
.showcase__in .eyebrow::before{background:var(--yellow)}
.showcase h2{color:var(--cream);max-width:20ch;margin:12px 0 18px}
.showcase__br{position:absolute;width:22px;height:22px;border:2px solid var(--yellow);z-index:2}
.showcase__br.tl{top:18px;left:18px;border-right:0;border-bottom:0}
.showcase__br.br{bottom:18px;right:18px;border-left:0;border-top:0}

/* ---------- Responsive ---------- */
@media(max-width:860px){
  .hero-x__frame{height:auto;background:transparent}
  .hero-x__frame>img{position:relative;inset:0;height:300px}
  .hero-x__scrim,.hero-x__scan{display:none}
  .hero-x__overlay{position:static;max-width:100%;padding:22px 4vw 6px}
  .hero-x__overlay h1{color:var(--ink)}
  .hero-x__cards{position:static;flex-direction:row;transform:none;padding:8px 4vw 0}
  .hx-card{flex:1}
}
@media(max-width:1024px){
  .grid-cards,.news-grid,.fgrid{grid-template-columns:repeat(2,1fr)}
  .flow{grid-template-columns:repeat(2,1fr)}
  .foot__grid{grid-template-columns:1fr 1fr;gap:28px}
  .prod{grid-template-columns:1fr;gap:24px}
  .prod:nth-child(even) .prod__media{order:0}
  .prod__no{position:static;font-size:42px}
}
@media(max-width:860px){
  .mainnav{position:fixed;inset:0;width:100%;height:100%;height:100dvh;background:var(--olive-2);flex-direction:column;
    align-items:stretch;justify-content:flex-start;padding:96px 26px 40px;gap:0;
    transform:translateX(100%);transition:transform .4s var(--ease);z-index:870;overflow-y:auto;-webkit-overflow-scrolling:touch}
  .mainnav::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.18;pointer-events:none;
    background:repeating-linear-gradient(0deg,rgba(0,0,0,.25) 0 2px,transparent 2px 4px)}
  .mainnav.open{transform:none}
  .mainnav a{color:var(--cream);font-size:18px;padding:15px 6px;border-bottom:1px solid rgba(255,255,255,.1)}
  .mainnav a::after{display:none}
  .mainnav a:hover,.mainnav a.active{color:var(--yellow)}
  .nav-item{flex-direction:column;align-items:stretch;width:100%}
  /* accordion: section title + caret; submenu collapsed until tapped */
  .has-sub>a{display:flex!important;align-items:center;padding-right:12px}
  .has-sub>a::after{content:"⌄"!important;margin-left:auto;flex:none;
    display:flex!important;align-items:center;justify-content:center;width:30px;height:30px;
    font-family:Arial,sans-serif;font-weight:700;font-size:22px;line-height:1;
    color:var(--yellow);opacity:.85;background:rgba(0,0,0,.18);border-radius:6px;transition:transform .3s var(--ease),opacity .25s,background .25s}
  .nav-item.open>a{color:var(--yellow)}
  .nav-item.open>a::after{transform:rotate(180deg);opacity:1;background:rgba(243,200,15,.2)}
  .subnav{position:static;transform:none;opacity:1;visibility:visible;pointer-events:auto;background:rgba(0,0,0,.18);
    box-shadow:none;min-width:0;clip-path:none;gap:0;margin:0;
    max-height:0;overflow:hidden;padding:0 0 0 18px;transition:max-height .42s var(--ease),padding .42s var(--ease)}
  .nav-item.open .subnav{max-height:600px;padding:4px 0 10px 18px;margin-bottom:6px;transform:none!important}
  .subnav a{color:var(--cream-2);font-size:15px;padding:12px 6px;border-bottom:1px solid rgba(255,255,255,.06);white-space:normal}
  .subnav a:last-child{border-bottom:0}
  .subnav a:hover,.subnav a:active{background:transparent;color:var(--yellow)}
  /* mobile menu contact block */
  .mnav-contacts{display:flex;flex-direction:column;gap:10px;margin-top:24px;padding-top:22px;border-top:1px solid rgba(255,255,255,.16)}
  .mnav-c__h{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-2);opacity:.7;padding:0 2px 2px}
  .mnav-c{display:flex!important;align-items:center;gap:13px;color:var(--cream)!important;font-family:var(--mono);font-weight:500;font-size:15px;
    padding:14px 16px!important;border:0!important;background:rgba(0,0,0,.2);text-transform:none;
    clip-path:polygon(0 0,calc(100% - 11px) 0,100% 11px,100% 100%,11px 100%,0 calc(100% - 11px))}
  .mnav-c::after{display:none!important}
  .mnav-c svg{width:22px;height:22px;flex:none;color:var(--yellow)}
  .mnav-c--ig{background:linear-gradient(105deg,rgba(243,200,15,.18),rgba(0,0,0,.22));box-shadow:inset 0 0 0 1.5px rgba(243,200,15,.5);color:var(--yellow)!important}
  .mnav-c:hover,.mnav-c:active{color:var(--yellow)!important;background:rgba(0,0,0,.32)}
  .burger{display:flex;position:relative;z-index:920}
  .stats-row{grid-template-columns:repeat(2,1fr)}
  .stat:nth-child(2){border-right:0}
  .stat{border-bottom:1px solid var(--line)}
  [style*="grid-template-columns"]{grid-template-columns:1fr!important}
}
@media(max-width:560px){
  .container{padding:0 18px}
  .grid-cards,.news-grid,.fgrid,.flow{grid-template-columns:1fr}
  .cta-block,.job{flex-direction:column;align-items:flex-start}
  .cursor{display:none}
}
/* ===== MOBILE HEADER + HERO FIXES ===== */
@media(max-width:860px){
  .site-header__bar{min-height:62px;padding:6px 12px;gap:8px}
  .brand-logo{left:12px;top:50%}
  .brand-logo img{height:clamp(96px,28vw,126px)}
  .header__right{gap:8px}
  .lang-toggle{margin-right:20px}        /* push UA/EN toggle leftward */
  .header-cta{padding:11px 22px!important}  /* wider call button, sits a bit more left */
  .header-cta span{display:none}
  .lang-toggle__opt{padding:7px 11px;font-size:12.5px}
  .hero-cut{min-height:100svh;padding:94px 0 22px}       /* full screen, content pushed down */
  .hero-cut .container{display:flex;flex-direction:column;justify-content:center;min-height:calc(100svh - 116px)}
  .hero-cut__grid{gap:18px}
  .hero-cut__glow{width:90%;opacity:.7}
  .hero-cut__visual{min-height:212px;margin:0 0 8px}
  .hero-truck{width:min(350px,78%)}
  .hero-extra-drone{top:0;right:-3%;width:min(148px,40%)}    /* more gap from truck, lifted up */
  .hero-cut__dronetag{top:32%;right:2%}                  /* tag sits below the drone */
  .hero-cut__text{max-width:100%}
  .hero-cut__chips{justify-content:center}
  .hx-card{flex:1 1 0;min-width:0}
  .hx-card b{font-size:11px}
}
@media(max-width:560px){
  .hero-cut__cta{flex-direction:column;align-items:stretch}
  .hero-cut__cta .btn{width:100%}
  .stat__n{font-size:clamp(34px,12vw,48px)}
}
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .rv,.rv-clip,[data-stagger]>*{opacity:1!important;transform:none!important;clip-path:none!important}
}

/* =======================================================
   v3 — PREMIUM TACTICAL POLISH (light, GPU-friendly)
   ======================================================= */

/* ---- Sound HUD toggle ---- */
.snd-toggle{position:fixed;left:14px;bottom:14px;z-index:1150;display:inline-flex;align-items:center;gap:8px;
  font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--cream);background:var(--olive-2);padding:8px 12px;border:0;cursor:pointer;
  box-shadow:0 0 0 1.5px rgba(0,0,0,.22),0 6px 18px rgba(35,37,26,.26);
  clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,9px 100%,0 calc(100% - 9px));
  transition:background .25s,transform .25s}
.snd-toggle:hover{background:var(--olive);transform:translateY(-2px)}
.snd-toggle__dot{width:8px;height:8px;border-radius:50%;background:#7d815f;flex:none}
.snd-toggle.on .snd-toggle__dot{background:var(--yellow);animation:hudPulse 1.6s ease-out infinite}
.snd-toggle b{color:var(--cream-2);font-weight:700}
.snd-toggle.on b{color:var(--yellow)}
@keyframes hudPulse{0%{box-shadow:0 0 0 0 rgba(243,200,15,.55)}100%{box-shadow:0 0 0 7px rgba(243,200,15,0)}}

/* ---- Hero tactical background layers ---- */
.hero-cut__grid-bg{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.55;
  background-image:linear-gradient(rgba(75,81,50,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(75,81,50,.11) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(125% 95% at 70% 42%,#000 32%,transparent 84%);
  mask-image:radial-gradient(125% 95% at 70% 42%,#000 32%,transparent 84%)}
.hero-cut__scanfx{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;opacity:.5;mix-blend-mode:multiply;
  background:repeating-linear-gradient(0deg,rgba(35,37,26,.08) 0 1px,transparent 1px 4px)}
.hero-cut__scanfx::after{content:"";position:absolute;left:0;right:0;height:130px;top:-130px;
  background:linear-gradient(180deg,transparent,rgba(243,200,15,.07),transparent);
  animation:heroSweep 7s linear infinite}
@keyframes heroSweep{0%{transform:translateY(0)}100%{transform:translateY(115vh)}}
.radar__pulse{position:absolute;width:min(540px,94%);aspect-ratio:1;border-radius:50%;z-index:1;pointer-events:none;
  border:1.5px solid rgba(243,200,15,.45);animation:radarPulse 3.8s ease-out infinite}
@keyframes radarPulse{0%{transform:scale(.32);opacity:0}28%{opacity:.5}100%{transform:scale(1);opacity:0}}
.hero-status{position:relative;z-index:3;margin-top:18px;display:inline-flex;gap:9px;align-items:center;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--olive-2)}
.hero-status i{width:7px;height:7px;border-radius:50%;background:var(--yellow);box-shadow:0 0 8px rgba(243,200,15,.85);
  animation:hudPulse 1.9s ease-out infinite;flex:none}

/* glitch/scan hover on key flag word */
@media (hover:hover){
  .hl-flag{cursor:default}
  .hl-flag:hover{animation:flagGlitch .42s steps(2,end) 1}
}
@keyframes flagGlitch{0%,100%{text-shadow:none;transform:translateX(0)}
  25%{text-shadow:-2px 0 rgba(0,87,183,.65),2px 0 rgba(243,200,15,.65);transform:translateX(1px)}
  50%{text-shadow:1px 0 rgba(0,87,183,.5),-1px 0 rgba(243,200,15,.5)}
  75%{text-shadow:2px 0 rgba(0,87,183,.65),-2px 0 rgba(243,200,15,.65);transform:translateX(-1px)}}

/* ---- Combat CTA buttons ---- */
.btn--combat{transition:transform .3s var(--ease),background .25s,color .25s,box-shadow .3s}
.btn--combat::after{content:attr(data-status);position:absolute;top:4px;right:13px;
  font-family:var(--mono);font-weight:700;font-size:8px;letter-spacing:.08em;opacity:.4;transition:opacity .3s;pointer-events:none}
.btn--combat:hover::after{opacity:.9}
.btn--yellow.btn--combat:hover{box-shadow:0 0 0 1.5px rgba(243,200,15,.5),0 12px 30px rgba(243,200,15,.28)}
.btn--ghost.btn--combat:hover{box-shadow:inset 0 0 0 1.5px var(--ink),0 12px 26px rgba(35,37,26,.22)}

/* ---- Target-lock hover on catalog imagery ---- */
.pcard__img,.prod__media{position:relative}
.pcard__img::after,.prod__media::after{content:"";position:absolute;inset:11px;opacity:0;pointer-events:none;
  transition:opacity .35s,inset .35s;
  background:
    linear-gradient(var(--yellow),var(--yellow)) left top/15px 2px no-repeat,
    linear-gradient(var(--yellow),var(--yellow)) left top/2px 15px no-repeat,
    linear-gradient(var(--yellow),var(--yellow)) right top/15px 2px no-repeat,
    linear-gradient(var(--yellow),var(--yellow)) right top/2px 15px no-repeat,
    linear-gradient(var(--yellow),var(--yellow)) left bottom/15px 2px no-repeat,
    linear-gradient(var(--yellow),var(--yellow)) left bottom/2px 15px no-repeat,
    linear-gradient(var(--yellow),var(--yellow)) right bottom/15px 2px no-repeat,
    linear-gradient(var(--yellow),var(--yellow)) right bottom/2px 15px no-repeat}
.pcard:hover .pcard__img::after,.prod__media:hover::after{opacity:.95;inset:8px}
.prod__media:hover img{transform:scale(1.05)}
.prod__media img{transition:transform .8s var(--ease)}
.pcard:hover{box-shadow:0 0 0 1.5px var(--olive-2),0 18px 40px rgba(35,37,26,.16)}
.pcard:hover .pcard__more{color:var(--olive-2)}
.pcard__more{transition:color .3s,gap .3s}

/* ---- Ecosystem flow ---- */
.eco{display:flex;flex-wrap:wrap;gap:12px;align-items:stretch;justify-content:center;margin-top:34px}
.eco__node{flex:1 1 168px;max-width:216px;min-width:150px;min-height:180px;background:var(--sand-3);box-shadow:0 0 0 1.5px var(--line);
  padding:26px 16px 22px;text-align:center;position:relative;overflow:hidden;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  transition:transform .35s var(--ease),box-shadow .35s,background .35s,color .35s;
  clip-path:polygon(0 0,calc(100% - 13px) 0,100% 13px,100% 100%,13px 100%,0 calc(100% - 13px))}
.eco__node::after{content:"";position:absolute;inset:9px;opacity:0;pointer-events:none;transition:opacity .35s;
  background:linear-gradient(var(--yellow),var(--yellow)) left top/13px 2px no-repeat,linear-gradient(var(--yellow),var(--yellow)) left top/2px 13px no-repeat,linear-gradient(var(--yellow),var(--yellow)) right top/13px 2px no-repeat,linear-gradient(var(--yellow),var(--yellow)) right top/2px 13px no-repeat,linear-gradient(var(--yellow),var(--yellow)) left bottom/13px 2px no-repeat,linear-gradient(var(--yellow),var(--yellow)) left bottom/2px 13px no-repeat,linear-gradient(var(--yellow),var(--yellow)) right bottom/13px 2px no-repeat,linear-gradient(var(--yellow),var(--yellow)) right bottom/2px 13px no-repeat}
.eco__node:hover{transform:translateY(-6px);background:var(--olive);color:var(--cream);box-shadow:0 0 0 1.5px var(--olive-2),0 18px 38px rgba(35,37,26,.24)}
.eco__node:hover::after{opacity:.9}
.eco__ic{width:50px;height:50px;margin-bottom:4px;color:var(--olive-2);transition:color .35s,transform .35s}
.eco__node:hover .eco__ic{color:var(--yellow);transform:scale(1.08)}
.eco__ic svg{width:100%;height:100%}
.eco__no{position:absolute;top:9px;right:12px;font-family:var(--mono);font-size:10px;color:var(--olive-3);opacity:.7}
.eco__t{font-family:var(--mono);font-weight:700;font-size:13px;letter-spacing:.05em;text-transform:uppercase;line-height:1.25}
.eco__s{font-size:11px;opacity:.72;font-family:var(--mono)}
.eco__arrow{align-self:center;color:var(--olive-3);flex:0 0 auto;display:flex;align-items:center}
.eco__arrow svg{width:22px;height:22px}

/* ---- Gallery (production / vehicles / details) ---- */
.gal{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:clamp(148px,16.5vw,205px);gap:14px;margin-top:30px}
.gal__cell--feat{grid-column:span 2;grid-row:span 2}
.gal__cell{position:relative;overflow:hidden;background:var(--olive-2);
  box-shadow:0 0 0 1.5px var(--line);clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px))}
.gal__cell--wide{grid-column:span 2}
.gal__cell img{width:100%;height:100%;object-fit:cover;filter:saturate(.92);transition:transform .9s var(--ease),filter .4s}
.gal__cell:hover img{transform:scale(1.06);filter:saturate(1.05)}
.gal__cell::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.8;
  background:linear-gradient(180deg,transparent 45%,rgba(35,37,26,.55))}
.gal__tag{position:absolute;z-index:2;left:14px;bottom:13px;font-family:var(--mono);font-weight:700;font-size:11px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--cream)}
.gal__tag span{display:block;font-size:9.5px;color:var(--yellow);letter-spacing:.14em;margin-bottom:3px}
.gal__tag b{display:block;font-size:13px;font-weight:700}
.gal__cell .card__scan{opacity:0}
.gal__cell:hover .card__scan{opacity:.85;animation:scanY 1.7s ease-in-out infinite}

/* ---- Trust / production grid ---- */
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:30px}
.trust__card{position:relative;background:var(--sand-3);box-shadow:0 0 0 1.5px var(--line);padding:24px 22px;
  display:flex;flex-direction:column;gap:10px;overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s;
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px))}
.trust__card:hover{transform:translateY(-5px);box-shadow:0 0 0 1.5px var(--olive-2),0 16px 34px rgba(35,37,26,.16)}
.trust__card::after{content:"";position:absolute;left:0;top:0;width:0;height:3px;background:var(--yellow);transition:width .4s var(--ease)}
.trust__card:hover::after{width:100%}
.trust__ic{width:44px;height:44px;color:var(--olive-2);transition:color .35s,transform .35s}
.trust__card:hover .trust__ic{color:var(--yellow);transform:scale(1.06)}
.trust__ic svg{width:100%;height:100%}
.trust__card h3{font-size:17px;text-transform:none;line-height:1.25}
.trust__card p{font-size:13.5px;line-height:1.55;color:var(--ink-2);margin:0}
.trust__no{position:absolute;top:13px;right:15px;font-family:var(--mono);font-size:11px;color:var(--olive-3);opacity:.6}

/* ---- Mission: two photos + 2x2 principle cards (centered) ---- */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:940px;margin:0 auto 22px}
.duo .gal__cell{aspect-ratio:16/11}
.numlist--grid{grid-template-columns:1fr 1fr;gap:14px;max-width:940px;margin:0 auto}
@media(max-width:620px){
  .duo,.numlist--grid{grid-template-columns:1fr;max-width:480px}
}

/* ---- Contacts: tactical command panel + quick topics + success ---- */
.cmd-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:-4px 0 18px;
  font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--olive-2)}
.cmd-head i{width:7px;height:7px;border-radius:50%;background:var(--yellow);box-shadow:0 0 8px rgba(243,200,15,.8);
  animation:hudPulse 1.9s ease-out infinite;flex:none;margin-right:7px}
.cmd-head__l{display:inline-flex;align-items:center}
.qtopics{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:18px}
.qtopic{font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.04em;text-transform:uppercase;
  color:var(--ink-2);background:var(--sand);box-shadow:inset 0 0 0 1.5px var(--line);padding:9px 13px;cursor:pointer;
  transition:background .25s,color .25s,box-shadow .25s,transform .2s;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}
.qtopic:hover{background:var(--olive);color:var(--cream);box-shadow:inset 0 0 0 1.5px var(--olive-2);transform:translateY(-2px)}
.qtopic.active{background:var(--yellow);color:var(--yellow-ink);box-shadow:inset 0 0 0 1.5px var(--yellow)}
.form-card{position:relative}
.form-success{position:absolute;inset:0;z-index:5;display:none;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;gap:14px;padding:30px;background:linear-gradient(160deg,var(--olive),var(--olive-2));color:var(--cream);
  clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}
.form-card.sent .form-success{display:flex;animation:fadeIn .4s ease both}
.form-success__ic{width:60px;height:60px;border:2px solid var(--yellow);border-radius:50%;display:grid;place-items:center;color:var(--yellow)}
.form-success__ic svg{width:30px;height:30px}
.form-success h3{font-family:var(--pixel);font-weight:600;font-size:clamp(20px,3vw,26px);text-transform:uppercase}
.form-success p{color:var(--cream-2);max-width:32ch;font-size:14px}
.form-success small{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--yellow);opacity:.85}
@keyframes fadeIn{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}

/* ---- News: materials / guides cards + IG button ---- */
.matgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:26px}
.matcard{position:relative;display:flex;flex-direction:column;gap:10px;background:var(--sand-3);box-shadow:0 0 0 1.5px var(--line);
  padding:22px 20px 24px;text-decoration:none;color:inherit;overflow:hidden;
  transition:transform .3s var(--ease),box-shadow .3s;
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px))}
.matcard:hover{transform:translateY(-5px);box-shadow:0 0 0 1.5px var(--olive-2),0 16px 34px rgba(35,37,26,.16)}
.matcard__k{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--olive-2)}
.matcard__ic{width:40px;height:40px;color:var(--olive-2);transition:color .3s}
.matcard:hover .matcard__ic{color:var(--yellow)}
.matcard__ic svg{width:100%;height:100%}
.matcard h3{font-size:17px;text-transform:none;line-height:1.3}
.matcard__more{margin-top:auto;font-family:var(--mono);font-weight:700;font-size:12px;color:var(--olive-2);display:inline-flex;align-items:center;gap:7px}
.matcard__badge{position:absolute;top:0;right:0;background:var(--olive-2);color:var(--cream);font-family:var(--mono);font-size:9px;
  letter-spacing:.1em;padding:5px 10px;clip-path:polygon(0 0,100% 0,100% 100%,8px 100%)}
.ig-cta{display:inline-flex;align-items:center;gap:11px;position:relative}
.ig-cta svg.ig{width:20px;height:20px}
.btn--ig{background:linear-gradient(105deg,#5d6440,#4b5132);color:var(--cream);box-shadow:0 0 0 1.5px var(--olive-2)}
.btn--ig:hover{transform:translateY(-2px);box-shadow:0 0 0 1.5px var(--yellow),0 12px 28px rgba(243,200,15,.2)}

@media(max-width:860px){
  .gal{grid-template-columns:repeat(2,1fr);grid-auto-rows:clamp(140px,30vw,200px)}
  .gal__cell--feat{grid-column:span 2;grid-row:span 1}
  .matgrid{grid-template-columns:1fr}
  .trust{grid-template-columns:repeat(2,1fr)}
  .eco__arrow{transform:rotate(90deg)}
  .eco__node{flex-basis:46%}
  /* lighter on mobile: drop continuous hero sweep + radar pulse */
  .hero-cut__scanfx::after,.radar__pulse{animation:none;display:none}
  .hero-cut__grid-bg{opacity:.4}
  .snd-toggle{left:10px;bottom:10px;font-size:10px;padding:7px 10px}
}
@media(max-width:560px){
  .gal__cell--feat{grid-column:span 1;grid-row:span 1}
}

/* ===== mobile swipe carousels (horizontal scroll-snap + dots) ===== */
.swipe-dots{display:none}
@media(max-width:640px){
  .swipe{
    display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:stretch;
    grid-template-columns:none!important;max-width:none!important;
    overflow-x:auto;overflow-y:visible;
    scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
    gap:12px;margin:22px -18px 0!important;padding:4px 18px 10px;
    scrollbar-width:none}
  .swipe::-webkit-scrollbar{display:none}
  .swipe>*{flex:0 0 84%!important;width:auto!important;max-width:84%!important;min-width:0!important;margin:0!important;scroll-snap-align:center}
  .swipe--two>*{flex-basis:46%!important;max-width:46%!important}
  .eco.swipe{flex-direction:row!important;align-items:stretch;max-width:none!important;margin-inline:-18px!important}
  .eco.swipe .eco__arrow{display:none!important}
  .eco.swipe>.eco__node{min-height:176px}
  .gal.swipe{grid-auto-rows:initial!important}
  .gal.swipe>.gal__cell{aspect-ratio:1/1}
  .swipe-dots{display:flex;justify-content:center;gap:8px;margin-top:14px}
  .swipe-dots button{width:8px;height:8px;border-radius:50%;border:0;background:var(--olive-3);opacity:.35;padding:0;cursor:pointer;
    transition:width .25s,opacity .25s,background .25s;-webkit-appearance:none;appearance:none}
  .swipe-dots button.on{opacity:1;background:var(--yellow);width:22px;border-radius:4px}
}
