:root{
  --navy:#012045;          /* logo colour */
  --navy-dark:#01152e;
  --navy-soft:#e9eef6;     /* very light navy tint for alternating sections */
  --orange:#e8832a;
  --orange-text:#b85a0b;   /* darker orange for small text on white */
  --white:#ffffff;
  --ink:#0d1b2e;
  --muted:#4b5a70;
  --line:#d5dce8;
  --maxw:1180px;
  --font:'Calisto MT','Calisto','Libre Caslon Text',Georgia,'Times New Roman',serif;
}
*{box-sizing:border-box;}
html,body{text-align:left;}
body{
  margin:0;
  font-family:var(--font);
  color:var(--ink);
  background:var(--navy);
  line-height:1.65;
}
h1,h2,h3{
  font-family:var(--font);
  margin:0 0 .4em;
  font-weight:700;
  color:var(--navy);
  line-height:1.2;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;}
section{padding:90px 0;}
.eyebrow{
  letter-spacing:.2em;
  text-transform:uppercase;
  font-size:13px;
  color:var(--orange-text);
  margin-bottom:10px;
  display:block;
}

/* ---------- Header: logo at the far LEFT, menu left → right ---------- */
html,body,.site-header,.site-header *{direction:ltr !important;}
:root{--ab:0px;--header-h:76px;--bp-menu:960px;}
.admin-bar{--ab:32px;}
@media (max-width:782px){.admin-bar{--ab:46px;}}
.site-header{
  position:sticky;top:var(--ab);z-index:60;
  background:var(--orange);color:var(--navy);
  border-bottom:1px solid var(--navy);
}
.header-inner{
  display:flex;flex-direction:row;align-items:center;justify-content:flex-start;
  width:100%;max-width:none;margin:0;           /* full width: logo touches the real left edge */
  padding:10px clamp(16px,3vw,40px);
  min-height:var(--header-h);
}
.site-logo{display:inline-flex;align-items:center;gap:14px;flex:0 0 auto;}
.site-logo img{height:56px;width:auto;}
.site-logo-text{font-size:28px;font-weight:700;line-height:1.2;white-space:nowrap;color:var(--navy);}
.site-menu{display:flex;align-items:center;flex:1 1 auto;margin-left:clamp(64px,6vw,96px);min-width:0;gap:24px;}
.site-nav{min-width:0;}
.site-nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:6px 24px;margin:0;padding:0;}
.site-nav a{
  display:block;color:var(--navy);font-size:15px;letter-spacing:.01em;text-transform:none;
  padding:6px 0;border-bottom:2px solid transparent;transition:border-color .2s,color .2s;white-space:normal;
}
.site-nav a:hover,.site-nav a.is-active{border-bottom-color:var(--navy);}
.lang-switch{display:flex;flex-shrink:0;gap:6px;margin-left:auto;}
.lang-switch a{
  color:var(--navy);font-size:13px;border:1px solid var(--navy);
  padding:4px 10px;border-radius:3px;line-height:1.4;
}
.lang-switch a.active{background:var(--navy);color:var(--orange);}
.lang-switch .full{display:none;}
.menu-toggle{display:none;}
/* ---------- Drawer menu (hamburger) at every screen width ---------- */
@media (max-width:960px){
  .site-logo{gap:10px;}
  .site-logo img{height:46px;}
  .site-logo-text{font-size:24px;}
}
@media all{
  .header-inner{min-height:68px;justify-content:space-between;}
  .menu-toggle{
    display:flex;align-items:center;justify-content:center;
    width:46px;height:46px;margin-left:auto;padding:0;flex-shrink:0;
    background:var(--navy);border:0;border-radius:50%;cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }
  .menu-toggle .bars{position:relative;display:block;width:20px;height:14px;}
  .menu-toggle .bars span{
    position:absolute;left:0;width:100%;height:2px;background:var(--orange);border-radius:2px;
    transition:transform .3s ease,opacity .2s ease,top .3s ease;
  }
  .menu-toggle .bars span:nth-child(1){top:0;}
  .menu-toggle .bars span:nth-child(2){top:6px;}
  .menu-toggle .bars span:nth-child(3){top:12px;}
  .menu-open .menu-toggle{background:var(--navy);}
  .menu-open .menu-toggle .bars span{background:var(--orange);}
  .menu-open .menu-toggle .bars span:nth-child(1){top:6px;transform:rotate(45deg);}
  .menu-open .menu-toggle .bars span:nth-child(2){opacity:0;}
  .menu-open .menu-toggle .bars span:nth-child(3){top:6px;transform:rotate(-45deg);}

  .site-menu{
    position:fixed;left:0;right:0;bottom:0;
    top:calc(var(--ab) + var(--header-offset,68px));margin:0;
    z-index:55;
    flex-direction:column;align-items:stretch;justify-content:space-between;
    background:var(--orange);
    padding:12px clamp(20px,6vw,40px) calc(28px + env(safe-area-inset-bottom));
    overflow-y:auto;-webkit-overflow-scrolling:touch;
    visibility:hidden;opacity:0;transform:translateY(-12px);
    transition:opacity .28s ease,transform .28s ease,visibility 0s linear .28s;
  }
  .menu-open .site-menu{visibility:visible;opacity:1;transform:none;transition:opacity .28s ease,transform .28s ease;}
  body.no-scroll{overflow:hidden;}

  .site-nav ul{flex-direction:column;gap:0;counter-reset:m;}
  .site-nav li{
    border-bottom:1px solid var(--navy);
    opacity:0;transform:translateY(10px);
  }
  .menu-open .site-nav li{opacity:1;transform:none;transition:opacity .4s ease,transform .4s ease;}
  .menu-open .site-nav li:nth-child(1){transition-delay:.05s}
  .menu-open .site-nav li:nth-child(2){transition-delay:.10s}
  .menu-open .site-nav li:nth-child(3){transition-delay:.15s}
  .menu-open .site-nav li:nth-child(4){transition-delay:.20s}
  .menu-open .site-nav li:nth-child(5){transition-delay:.25s}
  .menu-open .site-nav li:nth-child(n+6){transition-delay:.30s}
  .site-nav a{
    display:flex;align-items:baseline;gap:16px;
    color:var(--navy);font-size:14px;letter-spacing:.02em;text-transform:none;
    padding:18px 0;border-bottom:0;white-space:normal;
  }
  .site-nav a::before{
    counter-increment:m;content:counter(m, decimal-leading-zero);
    font-size:13px;letter-spacing:.2em;color:var(--navy);min-width:26px;
  }
  .site-nav a:hover,.site-nav a.is-active{color:var(--navy);border-bottom:0;text-decoration:underline;text-underline-offset:6px;}

  .lang-switch{margin:28px 0 0;gap:10px;}
  .lang-switch a{
    flex:1;text-align:center;padding:13px 10px;font-size:16px;border-radius:999px;
    color:var(--navy);border-color:var(--navy);
  }
  .lang-switch a.active{background:var(--navy);color:var(--orange);border-color:var(--navy);}
  .lang-switch .code{display:none;}
  .lang-switch .full{display:inline;}
}
@media (min-width:961px){
  .site-menu{left:auto;width:min(460px,100%);border-left:1px solid var(--navy);box-shadow:-24px 0 48px rgba(1,21,46,.28);}
}
section[id]{scroll-margin-top:calc(var(--header-offset,var(--header-h)) + var(--ab) + 8px);}

/* ---------- Hero ---------- */
.hero{
  position:relative;min-height:80vh;display:flex;align-items:flex-end;
  background-color:var(--navy);
  background-size:cover;background-position:center;color:#fff;padding:0 0 60px;
}
.hero::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(1,32,69,.25),rgba(1,21,46,.82));
  z-index:0;
}
.hero .wrap{position:relative;z-index:1;width:100%;}
.hero h1{font-size:clamp(34px,5vw,56px);max-width:720px;color:#fff;}

/* ---------- Intro / split image+text ---------- */
#intro,#portfolio{background:var(--orange);color:var(--navy);}
.split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.split img{border-radius:2px;}
.split .eyebrow{color:var(--navy);}
.split h2{font-size:32px;}
.split p{color:var(--navy);}

/* ---------- What We Do ---------- */
.whatwedo{background:var(--navy);color:var(--orange);}
.whatwedo .eyebrow{color:var(--orange);}
.whatwedo h2{font-size:34px;color:var(--orange);}
.whatwedo .sub{font-style:italic;font-size:21px;color:var(--orange);margin-bottom:22px;}
.whatwedo p{max-width:720px;margin:0;color:var(--orange);}
.characteristics-grid{
  display:grid;grid-template-columns:minmax(0,1fr);gap:36px;
  margin-top:38px;
}
.characteristic{min-width:0;border-top:1px solid rgba(255,255,255,.25);padding-top:22px;}
.whatwedo .characteristic h3{color:var(--orange);font-size:22px;line-height:1.35;margin:0 0 14px;}
.whatwedo .characteristic p{max-width:none;font-size:16px;line-height:1.7;}
@media (min-width:640px){
  .characteristics-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (min-width:1024px){
  .characteristics-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:42px 36px;}
}

/* ---------- Portfolio ---------- */
.portfolio-head{margin-bottom:46px;}
.portfolio-head .eyebrow{color:var(--navy);}
.portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.portfolio-item{position:relative;overflow:hidden;border-radius:2px;aspect-ratio:3/4;}
.portfolio-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s;}
.portfolio-item:hover img{transform:scale(1.04);}
.portfolio-item span{
  position:absolute;left:0;right:0;bottom:0;padding:18px;
  background:var(--orange);
  color:var(--navy);font-size:17px;
}

/* ---------- Company features (hidden by the template until filled) ---------- */
.features{background:var(--orange);color:var(--navy);}
.features .eyebrow{color:var(--navy);}
.features-head{margin-bottom:56px;}
.features-head h2{font-size:34px;margin:0;}
.feature{
  display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;
  margin-bottom:64px;
}
.feature:last-child{margin-bottom:0;}
.feature.no-image{grid-template-columns:1fr;}
.feature.is-flipped .feature-media{order:2;}
.feature-media{position:relative;}
.feature-media::before{
  content:"";position:absolute;inset:18px -18px -18px 18px;
  border:2px solid var(--navy);border-radius:4px;z-index:0;
}
.feature.is-flipped .feature-media::before{inset:18px 18px -18px -18px;}
.feature-media img{
  position:relative;z-index:1;width:100%;aspect-ratio:4/3;object-fit:cover;
  border-radius:4px;box-shadow:0 18px 40px rgba(1,32,69,.18);
}
.feature-body{max-width:520px;}
.feature.no-image .feature-body{max-width:760px;}
.feature-num{
  display:inline-block;font-size:15px;letter-spacing:.2em;color:var(--navy);
  padding-bottom:8px;margin-bottom:14px;border-bottom:3px solid var(--navy);
}
.feature-body h3{font-size:28px;margin-bottom:.5em;}
.feature-body p{margin:0;color:var(--navy);font-size:17px;}

/* ---------- Clients (logo strip) ---------- */
.clients .wrap{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap;gap:30px 64px;}
.clients .logo{font-size:18px;letter-spacing:.03em;color:#7b879a;}

/* ---------- Testimonials (navy base) ---------- */
.testimonials{background:var(--navy);color:var(--orange);}
.testimonials h2{font-size:32px;margin-bottom:46px;color:var(--orange);}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;}
.testi-card{background:var(--navy);border:1px solid var(--orange);padding:30px 26px;border-radius:4px;}
.testi-card p{font-style:italic;color:var(--orange);margin-top:0;}
.testi-card .who{margin-top:16px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--orange);font-weight:700;}

/* ---------- Get in touch (navy, image on the side) ---------- */
.contact{background:var(--navy);color:var(--orange);}
.contact .wrap{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:stretch;}
.contact h2{font-size:34px;color:var(--orange);}
.contact-intro{color:var(--orange);margin-top:0;}
.contact-info{list-style:none;margin:22px 0 26px;padding:0;}
.contact-info li{margin:0 0 8px;color:var(--orange);font-weight:700;}
.contact-info a{overflow-wrap:anywhere;text-decoration:underline;text-underline-offset:3px;}
.form-success{
  background:var(--navy);border-left:4px solid var(--orange);color:var(--orange);
  padding:12px 16px;margin-bottom:18px;border-radius:2px;
}
.contact-form input,.contact-form textarea{
  width:100%;padding:14px 16px;margin-bottom:14px;border:1px solid var(--orange);
  background:var(--navy-dark);color:var(--orange);border-radius:3px;font-family:inherit;font-size:16px;
}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:var(--orange);opacity:.75;}
.contact-form input:focus,.contact-form textarea:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(232,131,42,.35);}
.contact-form button{
  background:var(--navy);color:var(--orange);border:none;padding:14px 34px;font-family:inherit;
  letter-spacing:.08em;text-transform:uppercase;font-size:14px;cursor:pointer;border-radius:3px;
  transition:background .2s;
}
.contact-form button:hover{background:var(--navy-dark);color:var(--orange);}
.contact-media{position:relative;min-height:380px;}
.contact-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:4px;}

/* ---------- Footer ---------- */
.site-footer{background:var(--navy-dark);color:var(--orange);padding:30px 0;text-align:left;font-size:14px;}

/* ---------- Responsive ---------- */
h1,h2,h3,p{overflow-wrap:break-word;}

@media (max-width:860px){
  .split,.contact .wrap,.feature{grid-template-columns:1fr;}
  .feature.is-flipped .feature-media{order:0;}
  .feature-media::before{display:none;}
  .portfolio-grid,.testi-grid{grid-template-columns:1fr;}
  .contact-media{min-height:260px;}
  section{padding:56px 0;}
}

/* ---------- Company portfolio (products): headings that open a bulleted list ---------- */
.products{background:var(--navy);color:var(--orange);}
.products h2{font-size:34px;color:var(--orange);}
.products .eyebrow{color:var(--orange);}
.products-intro{max-width:760px;margin:0 0 34px;color:var(--orange);font-style:italic;opacity:.9;}
.products-list{border-top:1px solid var(--orange);max-width:900px;}
.product-cat{border-bottom:1px solid var(--orange);}
.product-cat summary{
  list-style:none;cursor:pointer;display:flex;align-items:baseline;gap:18px;
  padding:20px 44px 20px 0;position:relative;color:var(--orange);font-size:22px;font-weight:700;
}
.product-cat summary::-webkit-details-marker{display:none;}
.product-cat summary .num{font-size:14px;letter-spacing:.2em;font-weight:400;min-width:28px;}
.product-cat summary::after{
  content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);
  font-size:30px;font-weight:400;line-height:1;transition:transform .25s;
}
.product-cat[open] summary::after{transform:translateY(-50%) rotate(45deg);}
.product-cat summary:hover .title,.product-cat summary:focus-visible .title{text-decoration:underline;text-underline-offset:6px;}
.product-cat summary:focus-visible{outline:2px solid var(--orange);outline-offset:4px;}
.product-cat ul{list-style:none;margin:0 0 24px;padding:0 0 0 46px;}
.product-cat li{position:relative;padding:6px 0 6px 22px;font-size:17px;line-height:1.55;color:var(--orange);}
.product-cat li::before{
  content:"";position:absolute;left:0;top:.95em;width:9px;height:9px;border-radius:50%;
  border:2px solid var(--orange);box-sizing:border-box;
}
.button-link{
  display:inline-block;margin-top:38px;background:var(--orange);color:var(--navy);padding:14px 30px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;font-size:14px;border-radius:3px;transition:background .2s,color .2s;
}
.button-link:hover{background:var(--navy-dark);color:var(--orange);outline:1px solid var(--orange);}

/* ---------- Leadership ---------- */
.leadership{background:var(--orange);color:var(--navy);}
.leadership h2{font-size:34px;margin-bottom:40px;}
.people-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;max-width:860px;}
.person{border:2px solid var(--navy);border-radius:4px;padding:28px 26px;}
.person{text-align:center;}
.person-photo{display:block;width:140px;height:140px;object-fit:cover;border-radius:50%;border:3px solid var(--navy);margin:0 auto 18px;}
.person-initials{display:flex;align-items:center;justify-content:center;background:var(--navy);color:var(--orange);font-size:44px;font-weight:700;letter-spacing:.04em;}
.person-contact li{justify-content:center;}
.person h3{font-size:26px;margin-bottom:4px;}
.person .role{letter-spacing:.12em;text-transform:uppercase;font-size:13px;}
.person-contact{list-style:none;margin:18px 0 0;padding:16px 0 0;border-top:1px solid var(--navy);}
.person-contact li{display:flex;align-items:center;gap:10px;margin:0 0 8px;font-weight:700;}
.person-contact a{text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere;}

/* ---------- Contact: lead form, details with icons, map ---------- */
.ks-icon{flex:0 0 auto;width:20px;height:20px;}
.form-gate{color:var(--orange);margin:0 0 18px;}
.form-error{background:var(--navy-dark);border-left:4px solid var(--orange);color:var(--orange);padding:12px 16px;margin-bottom:18px;border-radius:2px;}
.contact-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:0 14px;}
.contact-form .hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden;}
.contact-form .consent{display:flex;gap:10px;align-items:flex-start;margin:2px 0 18px;font-size:14px;line-height:1.5;color:var(--orange);cursor:pointer;}
.contact-form .consent input{width:auto;margin:4px 0 0;flex:0 0 auto;accent-color:var(--orange);}
.contact-form button{background:var(--orange);color:var(--navy);font-weight:700;}
.contact-form button:hover{background:var(--navy-dark);color:var(--orange);outline:1px solid var(--orange);}
.contact-info li{display:flex;align-items:center;flex-wrap:wrap;gap:10px;}
.contact-info li.has-who .who{flex:0 0 100%;}
.contact-info .who{display:block;font-weight:400;font-size:13px;letter-spacing:.06em;text-transform:uppercase;margin-top:10px;}
.contact-address{display:flex;align-items:flex-start;gap:10px;margin:24px 0 0;font-weight:700;color:var(--orange);}
.contact-address .ks-icon{margin-top:3px;}
.contact-media.has-map{display:flex;flex-direction:column;}
.contact-media iframe{flex:1 1 auto;width:100%;min-height:380px;border:1px solid var(--orange);border-radius:4px;background:var(--navy-dark);}
.map-route{display:inline-block;margin-top:12px;color:var(--orange);text-decoration:underline;text-underline-offset:3px;}

@media (max-width:860px){
  .people-grid,.contact-form .form-row{grid-template-columns:1fr;}
  .contact-media iframe{min-height:300px;}
  .product-cat summary{font-size:19px;}
  .product-cat ul{padding-left:0;}
}

/* ---------- Overview, supply regions, why us (navy / orange, bulleted) ---------- */
.points-section h2{font-size:34px;margin-bottom:30px;}
.overview,.why-us{background:var(--orange);color:var(--navy);}
.overview h2,.why-us h2{color:var(--navy);}
.points{list-style:none;margin:0;padding:0;max-width:900px;}
.points li{position:relative;padding:12px 0 12px 30px;font-size:18px;line-height:1.55;border-bottom:1px solid var(--navy);}
.points li:last-child{border-bottom:0;}
.points li::before{
  content:"";position:absolute;left:2px;top:1.15em;width:12px;height:12px;border-radius:50%;
  border:2px solid var(--navy);box-sizing:border-box;
}
.regions{background:var(--navy);color:var(--orange);}
.regions h2{color:var(--orange);}
.regions-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;}
.region{border:1px solid var(--orange);border-radius:4px;padding:24px 22px;}
.region h3{color:var(--orange);font-size:22px;margin-bottom:8px;}
.region p{margin:0;color:var(--orange);font-size:16px;line-height:1.55;}
.compliance-note{max-width:900px;margin:0 0 14px;font-size:13px;line-height:1.6;opacity:.85;}
@media (max-width:1023px){ .regions-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:640px){ .regions-grid{grid-template-columns:1fr;} .points li{font-size:16px;} }

/* ---------- Visit counter (footer) ---------- */
.visit-counter{display:flex;align-items:center;gap:8px;margin:0 0 14px;font-size:15px;}
.visit-counter strong{font-size:18px;letter-spacing:.02em;}

.visit-counter strong.is-updated{animation:ks-bump .6s ease;}
@keyframes ks-bump{0%{transform:scale(1);}40%{transform:scale(1.25);}100%{transform:scale(1);}}
.visit-counter strong{display:inline-block;}