:root{
  --navy:#0a1626; --navy-2:#132a45; --navy-3:#1c3a5e;
  --amber:#f2a41f; --amber-dark:#c17d0e;
  --paper:#f5f3ec; --paper-2:#ece8dc;
  --ink:#101820; --steel:#5b6a78; --steel-light:#8b98a3;
  --line:#dcd7c8; --line-dark:rgba(255,255,255,.14);
  font-size:16px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; scroll-padding-top:76px;}
body{
  font-family:'IBM Plex Sans',sans-serif; color:var(--ink); background:var(--paper);
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
h1,h2,h3,h4{font-family:'Oswald',sans-serif; font-weight:600; letter-spacing:.01em; line-height:1.08;}
.mono{font-family:'IBM Plex Mono',monospace;}
img,svg{max-width:100%; display:block;}
a{color:inherit;}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
@media(max-width:640px){.wrap{padding:0 20px;}}

/* NAV */
header{
  position:sticky; top:0; z-index:50; background:rgba(255,255,255,.96); backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line); padding-top:env(safe-area-inset-top,0px);
}
.navbar{display:flex; align-items:center; justify-content:space-between; height:72px;}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none;}
.brand img{height:40px; width:auto;}
.brand-text{line-height:1.15;}
.brand-text b{font-family:'Oswald',sans-serif; font-size:18px; letter-spacing:.02em; display:block; color:var(--navy);}
.brand-text span{font-size:11px; color:var(--steel); letter-spacing:.06em;}
nav.links{display:flex; gap:32px; align-items:center;}
nav.links a{color:var(--ink); text-decoration:none; font-size:14.5px; font-weight:500; transition:color .15s;}
nav.links a:hover{color:var(--amber-dark);}
.nav-cta{background:var(--amber); color:var(--navy); padding:10px 18px; border-radius:2px; font-weight:600; font-size:14px;}
.nav-cta:hover{background:#ffb941;}
.menu-btn{display:none; background:none; border:none; color:var(--navy); font-size:26px; cursor:pointer;}
@media(max-width:880px){
  nav.links{position:fixed; top:72px; left:0; right:0; background:#fff; flex-direction:column; gap:0; align-items:stretch; max-height:0; overflow:hidden; transition:max-height .25s ease; border-bottom:1px solid var(--line);}
  nav.links.open{max-height:400px;}
  nav.links a{padding:16px 28px; border-top:1px solid var(--line);}
  .nav-cta{margin:16px 28px;}
  .menu-btn{display:block;}
}

/* HERO */
.hero{position:relative; background:var(--navy); color:#fff; overflow:hidden;}
.hero-grid{display:grid; grid-template-columns:1.15fr .85fr; min-height:600px;}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr; min-height:auto;}}
.hero-left{padding:84px 0; display:flex; flex-direction:column; justify-content:center; position:relative; z-index:2;}
.eyebrow{color:var(--amber); font-family:'IBM Plex Mono',monospace; font-size:13px; letter-spacing:.08em; margin-bottom:18px;}
.hero h1{font-size:clamp(32px,4.6vw,54px); max-width:620px; margin-bottom:22px;}
.hero h1 em{font-style:normal; color:var(--amber);}
.hero p.lead{font-size:16.5px; line-height:1.65; color:#c6ccd2; max-width:500px; margin-bottom:34px;}
.hero-actions{display:flex; gap:16px; flex-wrap:wrap;}
.btn{display:inline-flex; align-items:center; gap:8px; padding:14px 26px; font-weight:600; font-size:14.5px; text-decoration:none; border-radius:2px; transition:transform .15s, background .15s; border:1px solid transparent; cursor:pointer;}
.btn-primary{background:var(--amber); color:var(--navy);}
.btn-primary:hover{background:#ffb941; transform:translateY(-1px);}
.btn-ghost{border:1px solid rgba(255,255,255,.35); color:#fff; background:none;}
.btn-ghost:hover{border-color:var(--amber); color:var(--amber);}
.hero-right{position:relative; clip-path:polygon(14% 0,100% 0,100% 100%,0% 100%); background-size:cover; background-position:center;}
@media(max-width:900px){.hero-right{clip-path:none; min-height:260px;}}
.hero-right::before{content:'';position:absolute; inset:0; background:linear-gradient(100deg,var(--navy) 0%, rgba(10,22,38,.35) 32%, rgba(10,22,38,.15) 60%);}
.stats-bar{background:var(--navy-2); border-top:1px solid var(--line-dark);}
.stats-bar .wrap{display:grid; grid-template-columns:repeat(4,1fr); padding:30px 28px;}
@media(max-width:720px){.stats-bar .wrap{grid-template-columns:repeat(2,1fr); gap:24px 0;}}
.stat b{font-family:'Oswald',sans-serif; font-size:30px; color:var(--amber); display:block;}
.stat span{color:#aab4bd; font-size:12.5px; letter-spacing:.03em;}

/* SECTION HEADERS */
.section{padding:92px 0;}
.section.tight{padding:68px 0;}
.section-head{max-width:640px; margin-bottom:48px;}
.section-head .tag{font-family:'IBM Plex Mono',monospace; color:var(--amber-dark); font-size:12.5px; letter-spacing:.08em; margin-bottom:12px; display:block;}
.section-head h2{font-size:clamp(26px,3.4vw,38px); color:var(--ink);}
.section-head p{margin-top:14px; color:var(--steel); font-size:16px; line-height:1.65;}
.on-navy{background:var(--navy); color:#fff;}
.on-navy .section-head h2{color:#fff;}
.on-navy .section-head .tag{color:var(--amber);}
.on-navy .section-head p{color:#b7c0c9;}

/* ABOUT */
.about-grid{display:grid; grid-template-columns:1fr .85fr; gap:56px; align-items:start;}
@media(max-width:820px){.about-grid{grid-template-columns:1fr; gap:32px;}}
.about-grid p{color:var(--steel); line-height:1.75; font-size:15.5px; margin-bottom:16px;}
.about-media img{width:100%; height:260px; object-fit:cover; margin-bottom:20px;}
.material-list{border-top:1px solid var(--line);}
.material-list div{display:flex; justify-content:space-between; padding:13px 0; border-bottom:1px solid var(--line); font-size:14px; gap:12px;}
.material-list span:first-child{color:var(--steel);}
.material-list span:last-child{font-family:'IBM Plex Mono',monospace; font-weight:500; color:var(--ink); text-align:right;}

/* CAPABILITIES TABS */
.cap-list{border-top:1px solid var(--line-dark);}
.cap-item{border-bottom:1px solid var(--line-dark);}
.cap-row{width:100%; display:flex; flex-wrap:wrap; align-items:center; gap:6px 18px; background:none; border:none; padding:22px 6px; cursor:pointer; text-align:left; color:#fff; transition:background .15s;}
.cap-row:hover{background:rgba(255,255,255,.03);}
.cap-row .l{font-family:'IBM Plex Mono',monospace; color:var(--amber); font-size:13px; width:20px; flex-shrink:0;}
.cap-row .ti{font-family:'Oswald',sans-serif; font-size:18px; flex:1; min-width:140px;}
.cap-row .chev{color:#7c8894; flex-shrink:0; transition:transform .3s ease; font-size:14px; margin-left:auto;}
.cap-row .sub{color:#8b98a3; font-size:13px; flex-basis:100%; margin:0 0 0 38px; order:4;}
@media(max-width:600px){.cap-row{padding:18px 4px;} .cap-row .ti{font-size:16px;}}
.cap-item.open .cap-row .chev{transform:rotate(180deg); color:var(--amber);}
.cap-item.open .cap-row .ti{color:var(--amber);}
.cap-body{max-height:0; overflow:hidden; transition:max-height .4s ease;}
.cap-body-inner{display:flex; gap:26px; padding:4px 6px 34px 6px; flex-wrap:wrap; align-items:flex-start;}
.cap-body-inner img{width:100%; max-width:210px; height:170px; object-fit:cover; flex-shrink:0;}
.cap-body .desc{color:#c2cad2; line-height:1.7; margin-bottom:18px; max-width:520px; font-size:14.5px;}
.cap-body .range{color:var(--amber); font-family:'IBM Plex Mono',monospace; font-size:12px; margin-bottom:14px; display:block;}
.chips{display:flex; flex-wrap:wrap; gap:8px;}
.chip{font-family:'IBM Plex Mono',monospace; font-size:11.5px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); padding:6px 11px; color:#dfe4e8;}

/* FORKLIFT HIGHLIGHT */
.forklift-feature{background:var(--navy); color:#fff; overflow:hidden;}
.ff-grid{display:grid; grid-template-columns:1fr .8fr; gap:40px; align-items:center;}
@media(max-width:860px){.ff-grid{grid-template-columns:1fr;}}
.ff-badge{display:inline-block; background:var(--amber); color:var(--navy); font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:.06em; padding:5px 11px; margin-bottom:18px;}
.forklift-feature h2{font-size:clamp(26px,3.4vw,38px); margin-bottom:16px; max-width:520px;}
.forklift-feature p.copy{color:#b7c0c9; line-height:1.7; max-width:480px; margin-bottom:26px;}
.ff-points{display:flex; flex-direction:column; gap:12px; margin-bottom:8px;}
.ff-points div{display:flex; gap:12px; align-items:baseline; color:#dfe4e8; font-size:14.5px;}
.ff-points .dot{color:var(--amber); font-family:'IBM Plex Mono',monospace;}
.ff-art{display:flex; align-items:center; justify-content:center; padding:8px;}
.ff-art img{width:100%; max-width:420px; height:320px; object-fit:cover; border:1px solid rgba(242,164,31,.4); box-shadow:0 24px 60px rgba(0,0,0,.35);}
@media(max-width:640px){.ff-art img{height:240px;}}

/* TRACK RECORD */
.tr-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line);}
@media(max-width:760px){.tr-grid{grid-template-columns:1fr;}}
.tr-card{background:var(--paper); display:flex; flex-direction:column;}
.tr-card .photo{width:100%; height:200px; object-fit:cover; display:block;}
.tr-card .icon-panel{width:100%; height:200px; display:flex; align-items:center; justify-content:center; background:var(--paper-2);}
.tr-card .body{padding:26px 28px 30px;}
.tr-card .badge{font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:.05em; color:var(--amber-dark); display:block; margin-bottom:10px;}
.tr-card h3{font-size:20px; margin-bottom:10px;}
.tr-card p{color:var(--steel); font-size:14px; line-height:1.65;}

/* FIELD GALLERY */
.field-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px;}
@media(max-width:700px){.field-grid{grid-template-columns:repeat(2,1fr);}}
.field-grid button{border:none; padding:0; background:none; cursor:pointer; overflow:hidden; aspect-ratio:4/3;}
.field-grid img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s ease;}
.field-grid button:hover img{transform:scale(1.06);}
.lightbox{position:fixed; inset:0; background:rgba(8,14,22,.92); display:none; align-items:center; justify-content:center; z-index:100; padding:40px 20px;}
.lightbox.open{display:flex;}
.lightbox img{max-width:min(900px,92vw); max-height:86vh; object-fit:contain; box-shadow:0 20px 60px rgba(0,0,0,.5);}
.lightbox-close{position:absolute; top:20px; right:26px; color:#fff; font-size:32px; background:none; border:none; cursor:pointer; line-height:1;}

/* SERVICES */

/* CLIENTS MARQUEE */
.marquee{overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);}
.marquee-track{display:flex; align-items:center; width:max-content; animation:scroll 28s linear infinite; will-change:transform;}
@media (hover:hover) and (pointer:fine){.marquee:hover .marquee-track{animation-play-state:paused;}}
.marquee-track img{height:44px; width:auto; object-fit:contain; opacity:.88; transition:opacity .2s; flex-shrink:0; margin-right:64px;}
.marquee-track img:hover{opacity:1;}
@keyframes scroll{from{transform:translateX(0);} to{transform:translateX(-50%);}}
@media (prefers-reduced-motion: reduce){.marquee-track{animation:none;}}

/* CONTACT */
.contact-grid{display:grid; grid-template-columns:1.1fr .9fr;}
@media(max-width:820px){.contact-grid{grid-template-columns:1fr;}}
.contact-left{background:var(--navy); color:#fff; padding:76px 64px;}
@media(max-width:640px){.contact-left{padding:52px 26px;}}
.contact-left h2{font-size:clamp(26px,3.2vw,36px); margin-bottom:18px;}
.contact-left p{color:#b7c0c9; max-width:440px; line-height:1.7; margin-bottom:34px;}
.c-row{display:flex; align-items:center; gap:16px; padding:17px 0; border-top:1px solid var(--line-dark);}
.c-row:last-of-type{border-bottom:1px solid var(--line-dark);}
.c-row .k{font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--amber); width:64px; flex-shrink:0; letter-spacing:.05em;}
.c-row a{text-decoration:none; font-size:15px; color:#fff;}
.c-row a:hover{color:var(--amber);}
.contact-right{background:var(--amber); display:flex; align-items:center; justify-content:center; padding:56px 36px;}
.contact-right .card{background:var(--navy); color:#fff; padding:38px 32px; max-width:340px;}
.contact-right .card b{font-family:'Oswald',sans-serif; font-size:19px; display:block; margin-bottom:10px;}
.contact-right .card p{color:#b7c0c9; font-size:13.5px; line-height:1.6; margin-bottom:20px;}

footer{background:var(--navy); border-top:1px solid var(--line-dark); padding:26px 0;}
footer .wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;}
footer p{color:#7c8894; font-size:12.5px;}
footer a{text-decoration:none;}
footer a:hover{color:var(--amber);}

.reveal{opacity:0; transform:translateY(14px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1; transform:none;}
@media (prefers-reduced-motion: reduce){.reveal{opacity:1; transform:none; transition:none;}}
:focus-visible{outline:2px solid var(--amber); outline-offset:2px;}

/* WHATSAPP FLOAT */
.wa-float{position:fixed; right:20px; bottom:20px; z-index:60; width:56px; height:56px; border-radius:50%; background:#25D366; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 22px rgba(0,0,0,.3); transition:transform .15s;}
.wa-float:hover{transform:scale(1.06);}
.wa-float svg{width:28px; height:28px;}

/* CONTACT METHOD GRID (used on contact page) */
.contact-methods{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line-dark); margin-top:8px;}
@media(max-width:600px){.contact-methods{grid-template-columns:1fr;}}
.cm-card{background:var(--navy); padding:26px 24px; display:flex; gap:16px; align-items:flex-start; text-decoration:none; color:#fff; transition:background .15s;}
.cm-card:hover{background:rgba(255,255,255,.04);}
.cm-card .cm-icon{width:38px; height:38px; border-radius:50%; background:rgba(242,164,31,.12); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.cm-card .cm-icon svg{width:19px; height:19px;}
.cm-card .cm-label{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--amber); letter-spacing:.05em; display:block; margin-bottom:4px;}
.cm-card .cm-value{font-size:14.5px; color:#fff;}

/* SUB-PAGE HERO BANNER */
.page-banner{background:var(--navy); color:#fff; padding:64px 0 48px;}
.page-banner .eyebrow{margin-bottom:10px;}
.page-banner h1{font-size:clamp(28px,4vw,44px); max-width:640px;}
.page-banner p{color:#b7c0c9; margin-top:14px; max-width:560px; line-height:1.65; font-size:15.5px;}

/* MISSION / VISION / MOTTO */
.mvm-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line);}
@media(max-width:760px){.mvm-grid{grid-template-columns:1fr;}}
.mvm-card{background:#fff; padding:36px 30px;}
.mvm-card .tag{font-family:'IBM Plex Mono',monospace; color:var(--amber-dark); font-size:11.5px; letter-spacing:.08em; display:block; margin-bottom:14px;}
.mvm-card h3{font-size:21px; margin-bottom:12px;}
.mvm-card p{color:var(--steel); font-size:14.5px; line-height:1.7;}
