:root{
  --ink:#0B1622;
  --steel:#5B6B7B;
  --line:#D3DBE3;
  --line-soft:#E5EAEF;
  --wash:#EDF1F5;
  --paper:#FFFFFF;
  --signal:#14509B;
  --hazard:#B4830F;
  --rail:150px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:16.5px;line-height:1.62;-webkit-font-smoothing:antialiased;
}
h1,h2,h3,.arch{font-family:Archivo,"IBM Plex Sans",sans-serif;letter-spacing:-.021em;}
img{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:2px solid var(--signal);outline-offset:3px}

.wrap{max-width:1180px;margin:0 auto;padding:0 28px}

/* ---- masthead ---- */
.mast{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.mast .wrap{display:flex;align-items:center;gap:28px;min-height:84px;position:relative}
.mark{display:flex;align-items:center;gap:11px;text-decoration:none;min-width:0}
.mark img{flex:none;width:76px;height:auto}
.mk{font-family:Archivo;font-weight:700;font-size:21px;letter-spacing:-.032em;line-height:1.1;white-space:nowrap}
.mast nav{margin-left:auto;display:flex;gap:26px;align-items:center;flex:none}
.mast nav a{font-size:14.5px;text-decoration:none;color:var(--steel)}
.mast nav a:hover{color:var(--ink)}
.mailbtn{background:var(--ink);color:#fff;padding:9px 16px;border-radius:2px;font-size:14.5px;text-decoration:none;white-space:nowrap}
.mailbtn:hover{background:var(--signal)}
.wabtn{border:1px solid var(--line);color:var(--ink);padding:8px 15px;border-radius:2px;font-size:14.5px;text-decoration:none;white-space:nowrap;display:inline-flex;align-items:center;gap:7px}
.wabtn::before{content:"";width:15px;height:15px;background:#25D366;border-radius:50%;flex:none}
.wabtn:hover{border-color:var(--ink)}

.burger{display:none;background:none;border:1px solid var(--line);border-radius:2px;width:40px;height:38px;padding:0;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.burger span{display:block;width:18px;height:2px;background:var(--ink);transition:transform .18s ease,opacity .18s ease}
.burger.on span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.on span:nth-child(2){opacity:0}
.burger.on span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.drop{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);box-shadow:0 12px 24px rgba(11,22,34,.07);z-index:50}
.drop a{display:block;padding:15px 16px;text-decoration:none;font-size:16px;color:var(--ink);border-bottom:1px solid var(--line-soft)}
.drop a:last-child{border-bottom:0}
.drop a:active{background:var(--wash)}
.drop[hidden]{display:none}

/* ---- rail layout ---- */
.band{border-bottom:1px solid var(--line)}
.band .wrap{display:grid;grid-template-columns:var(--rail) 1fr;gap:0}
.rail{padding:38px 24px 38px 0;border-right:1px solid var(--line);font-size:13.5px;color:var(--steel);line-height:1.45}
.rail b{display:block;font-weight:600;font-size:14.5px;color:var(--ink);margin-bottom:2px}
.body{padding:38px 0 54px 40px}

/* ---- hero ---- */
.hero{border-bottom:1px solid var(--line);background:linear-gradient(180deg,#fff 0%,var(--wash) 100%)}
.hero .wrap{display:grid;grid-template-columns:1.08fr .92fr;gap:56px;align-items:end;padding-top:64px;padding-bottom:0}
.heroshot img{max-height:620px;width:auto;margin:0 auto}
.hero h1{font-size:clamp(38px,5.4vw,66px);line-height:1.02;font-weight:700;margin:0 0 22px}
.hero p.lede{font-size:19.5px;line-height:1.55;color:#2B3A48;max-width:34em;margin:0 0 34px}
.facts{display:flex;gap:0;border-top:1px solid var(--line);margin-bottom:64px}
.fact{padding:16px 22px 6px 0;margin-right:22px;border-right:1px solid var(--line)}
.fact:last-child{border-right:0}
.fact b{display:block;font-family:Archivo;font-weight:600;font-size:23px;letter-spacing:-.03em}
.fact span{font-size:13px;color:var(--steel)}
.heroshot{position:relative;align-self:end}
.heroshot img{width:100%;height:auto}
.heroshot figcaption{font-size:13px;color:var(--steel);padding:12px 0 0;letter-spacing:.01em}

/* ---- supply lines ---- */
.lines{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}
.line h3{font-size:20px;margin:0 0 8px;font-weight:600}
.line p{margin:0 0 12px;color:#36454F;font-size:15.5px}
.line ul{margin:0;padding-left:17px;color:var(--steel);font-size:14.5px}
.line li{margin-bottom:3px}
.line{border-top:2px solid var(--signal);padding-top:14px}

/* ---- products ---- */
h2.sec{font-size:29px;font-weight:600;margin:0 0 10px}
p.sub{color:var(--steel);max-width:60ch;margin:0 0 36px;font-size:16px}
.unit{display:grid;grid-template-columns:230px 1fr;gap:36px;padding:30px 0;border-top:1px solid var(--line-soft)}
.unit:first-of-type{border-top:1px solid var(--line)}
.shot{width:100%;max-width:150px;height:auto;margin:0 0 18px}
.unit .id h3{margin:0 0 4px;font-size:21px;font-weight:600}
.unit .id .model{font-size:13.5px;color:var(--signal);font-weight:500;margin-bottom:12px}
.unit .id p{font-size:14.5px;color:var(--steel);margin:0}
.spec{width:100%;border-collapse:collapse;font-size:14.5px}
.spec th{text-align:left;font-weight:500;color:var(--steel);padding:7px 18px 7px 0;width:44%;border-bottom:1px solid var(--line-soft);vertical-align:top}
.spec td{padding:7px 0;border-bottom:1px solid var(--line-soft);font-variant-numeric:tabular-nums}
.spec tr:last-child th,.spec tr:last-child td{border-bottom:0}
.speccols{display:grid;grid-template-columns:1fr 1fr;gap:0 44px}

/* ---- projects ---- */
.proj{display:grid;grid-template-columns:1.25fr 1fr;gap:44px;align-items:start;border-top:1px solid var(--line);padding-top:28px}
.projshot{margin:0}
.projshot img{width:100%;height:auto}
.projshot figcaption{font-size:13px;color:var(--steel);padding-top:10px}

/* ---- compliance ---- */
.docs{width:100%;border-collapse:collapse;font-size:14.5px;margin-bottom:30px}
.docs th{text-align:left;font-weight:500;font-size:13px;color:var(--steel);padding-bottom:9px;border-bottom:1px solid var(--ink)}
.docs td{padding:11px 16px 11px 0;border-bottom:1px solid var(--line-soft);vertical-align:top}
.docs td.no{font-variant-numeric:tabular-nums;color:var(--steel);white-space:nowrap}
.ship{background:var(--wash);border-left:3px solid var(--hazard);padding:20px 24px}
.ship h3{margin:0 0 8px;font-size:17px;font-weight:600}
.ship dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:5px 16px;font-size:14.5px}
.ship dt{color:var(--steel)}
.ship dd{margin:0}

/* ---- gallery ---- */
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.gal figure{margin:0}
.gal img{width:100%;height:290px;object-fit:cover;background:var(--wash)}
.gal figcaption{font-size:13px;color:var(--steel);padding-top:7px}

/* ---- company ---- */
.co{display:grid;grid-template-columns:1fr 300px;gap:56px;align-items:start}
.co-spec th{width:35%}
.co-spec .cn{color:var(--steel)}
.lock{width:100%;max-width:290px;margin-top:6px}

/* ---- contact ---- */
.contact{background:var(--ink);color:#E8EEF4}
.contact .wrap{display:grid;grid-template-columns:var(--rail) 1fr;padding-top:0;padding-bottom:0}
.contact .rail{border-right:1px solid #22303D;color:#8CA0B4}
.contact .rail b{color:#fff}
.contact .body{padding-bottom:58px}
.contact h2{font-size:29px;font-weight:600;margin:0 0 14px;color:#fff}
.contact p{max-width:52ch;color:#B4C2D0;margin:0 0 30px}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:4px}
.contact .mail{font-family:Archivo;font-weight:600;font-size:19px;color:#fff;text-decoration:none;border-bottom:2px solid var(--signal);padding-bottom:3px;letter-spacing:-.015em}
.contact .mail:hover{border-color:#fff}
.wacta{display:inline-flex;align-items:center;gap:10px;background:#25D366;color:#06301A;text-decoration:none;font-weight:600;font-size:15.5px;padding:12px 20px;border-radius:2px}
.wacta::before{content:"";width:17px;height:17px;border-radius:50%;background:#06301A;flex:none}
.wacta:hover{background:#1FBE5A}
.reach{display:grid;grid-template-columns:1fr 168px;gap:56px;align-items:start}
.qr{margin:0;background:#fff;padding:14px 14px 12px;width:168px}
.qr img{width:140px;height:140px;display:block;margin:0 auto}
.qr figcaption{font-size:12.5px;color:#33424F;text-align:center;padding-top:10px;line-height:1.4}
.cmeta{margin-top:40px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 34px;font-size:14.5px;border-top:1px solid #22303D;padding-top:22px}
.cmeta .num{font-variant-numeric:tabular-nums;letter-spacing:.02em}
.cmeta b{display:block;font-weight:500;color:#8CA0B4;font-size:13px;margin-bottom:3px}
footer{background:var(--ink);color:#6E8296;font-size:13px;padding-bottom:30px}
footer .wrap{display:flex;gap:20px;flex-wrap:wrap;justify-content:space-between}

@media(max-width:940px){
  :root{--rail:0px}
  .hero .wrap{grid-template-columns:1fr;gap:34px;padding-top:44px}
  .heroshot{order:-1}
  .facts{margin-bottom:44px;flex-wrap:wrap}
  .band .wrap,.contact .wrap{grid-template-columns:1fr}
  .rail{border-right:0;border-bottom:1px solid var(--line);padding:26px 0 14px}
  .contact .rail{border-bottom:1px solid #22303D}
  .body{padding:26px 0 44px}
  .lines,.gal,.speccols,.cmeta,.reach,.co,.proj{grid-template-columns:1fr}
  .proj{gap:24px}
  .lock{max-width:230px}
  .qr{width:168px}
  .actions{gap:14px}
  .qr{justify-self:start}
  .unit{grid-template-columns:1fr;gap:16px}
  .shot{max-width:120px}
  .mast nav a:not(.mailbtn):not(.wabtn){display:none}
  .mast .wrap{gap:10px;min-height:64px;padding:0 16px}
  .mast nav{gap:8px}
  .mark{gap:8px}
  .mark img{width:44px}
  .mk{font-size:16px}
  .mk .lg{display:none}
  .wabtn,.mailbtn{font-size:13.5px;padding:8px 11px}
  .burger{display:flex}
  .drop{display:block}
  .wabtn{gap:6px}
  .wabtn::before{width:12px;height:12px}
  .gal img{height:340px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}