:root{
  --navy:#031a3a;
  --navy-dark:#02142f;
  --navy2:#062a59;
  --blue:#0968d8;
  --blue2:#2c8dff;
  --cyan:#25a1ff;
  --ink:#10233f;
  --muted:#63748a;
  --line:#dce4ee;
  --soft:#f6f8fb;
  --white:#ffffff;
}

/* ======================================================
   GLOBAL
====================================================== */

*{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  font-family:Inter,Arial,Helvetica,sans-serif;
  color:var(--ink);
  background:#fff;
  -webkit-font-smoothing:antialiased;
}

a{
  color:inherit;
}

.wrap{
  width:min(1440px,calc(100% - 80px));
  margin:auto;
}


/* ======================================================
   HEADER
====================================================== */

.site-header{
  position:absolute;
  z-index:20;
  top:0;
  left:0;
  width:100%;
  padding:25px 0;
}

.nav-wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
}

/*
SVG LOGO
The logo is loaded from assets/images/logo.svg in the PHP templates.
Do not apply brightness/invert filters; preserve the SVG's original colors.
*/
.brand{
  display:block;
  line-height:0;
}

.brand img{
  display:block;
  width:250px;
  max-width:100%;
  height:auto;
  max-height:82px;
  object-fit:contain;
  object-position:left center;
  filter:none !important;
}

/* navigation */

.main-nav{
  display:flex;
  align-items:center;
  gap:42px;
  color:#fff;
  font-size:16px;
  font-weight:500;
}

.main-nav a{
  text-decoration:none;
  opacity:.94;
  transition:.2s ease;
}

.main-nav a:hover{
  opacity:1;
  color:#42a7ff;
}

.nav-cta{
  border:1px solid rgba(64,158,255,.9);
  padding:15px 24px;
  border-radius:5px;
}

.nav-cta span{
  padding-left:18px;
}

/* mobile menu */

.mobile-toggle{
  display:none;
  background:none;
  border:0;
  padding:6px;
}

.mobile-toggle span{
  display:block;
  width:28px;
  height:2px;
  background:#fff;
  margin:6px;
}


/* ======================================================
   HERO
====================================================== */

.hero{
  position:relative;
  width:100%;
  height:80vh;
  min-height:720px;
  overflow:hidden;
  background:#031a3a;
  color:#fff;
}

/* Replace hero-new.png with your new hero file name if different */
.hero-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  background-image:url("https://environmental-simulation.com/wp-content/uploads/2026/08/Hero-1-scaled.webp");
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center center;
  opacity:1;
  z-index:1;
}

/* No extra overlay over the hero artwork */
.hero-overlay{
  display:none;
}

/* HERO CONTENT */
.hero-grid{
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:52% 48%;
  height:80vh;
  min-height:720px;
  align-items:center;
  padding-top:110px;
  padding-bottom:30px;
}

.hero-copy{
  max-width:710px;
  padding:56px 0 35px;
}

/* EYEBROW */
.eyebrow{
  display:flex;
  align-items:center;
  gap:16px;
  color:#2da1ff;
  letter-spacing:2.2px;
  font-weight:700;
  font-size:15px;
  margin-bottom:28px;
}

.eyebrow span{
  display:inline-block;
  width:34px;
  height:1px;
  background:#758fab;
}

/* HERO TITLE */
.hero h1{
  font-size:clamp(54px,4.7vw,76px);
  line-height:1.02;
  letter-spacing:-2.6px;
  margin:0 0 20px;
  font-weight:760;
}

.hero h1 em{
  font-style:normal;
  color:#8eb7e4;
}

/* BLUE ACCENT LINE */
.accent-rule{
  width:56px;
  height:4px;
  background:#1595ff;
  margin:20px 0;
}

/* DESCRIPTION */
.hero p{
  max-width:610px;
  margin:0;
  color:#fff;
  font-size:18px;
  line-height:1.62;
}

/* ======================================================
   HERO BUTTONS - DEMO MOCKUP STYLE
====================================================== */

.hero-actions{
  display:flex;
  align-items:center;
  gap:20px;
  margin-top:30px;
}

/* Generic button base remains usable for form/footer buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  text-decoration:none;
  border-radius:5px;
  padding:16px 27px;
  font-weight:700;
  border:1px solid transparent;
  transition:
    transform .22s ease,
    background .22s ease,
    border-color .22s ease,
    box-shadow .22s ease;
  cursor:pointer;
}

.btn:hover{
  transform:translateY(-2px);
}

/*
Hero buttons:
- fixed mockup-like height
- larger icon
- exact spacing
- hides the old text-symbol icon such as ✉ / ▣
- draws clean line icons from CSS
*/
.hero-actions .btn{
  position:relative;
  height:54px;
  min-height:54px;
  padding:0 28px;
  gap:13px;
  border-radius:5px;
  font-size:0; /* hides the old raw icon character */
  line-height:1;
  white-space:nowrap;
}

.hero-actions .btn span{
  font-size:16px;
  line-height:1;
  font-weight:700;
}

/* SVG-style icon area created entirely with CSS */
.hero-actions .btn::before{
  content:"";
  display:block;
  width:23px;
  min-width:23px;
  height:23px;
  background-position:center;
  background-repeat:no-repeat;
  background-size:22px 22px;
}

/* REQUEST A QUOTE */
.hero-actions .btn-primary{
  min-width:220px;
  background:#0868d6;
  color:#fff;
  border-color:#0868d6;
  box-shadow:0 7px 20px rgba(0,74,170,.20);
}

.hero-actions .btn-primary::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='1.5'/%3E%3Cpath d='M4 7l8 6 8-6'/%3E%3C/svg%3E");
}

.hero-actions .btn-primary:hover{
  background:#1176e8;
  border-color:#1176e8;
  box-shadow:0 10px 26px rgba(0,93,205,.28);
}

/* EXPLORE SOLUTIONS */
.hero-actions .btn-outline{
  min-width:235px;
  background:rgba(3,24,52,.22);
  border-color:rgba(255,255,255,.47);
  color:#fff;
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
  box-shadow:none;
}

.hero-actions .btn-outline::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='2'/%3E%3Cpath d='M9 8h6M9 12h6M9 16h4'/%3E%3C/svg%3E");
}

.hero-actions .btn-outline:hover{
  background:rgba(255,255,255,.06);
  border-color:#fff;
}

/* Keep non-hero primary/outline buttons working if used elsewhere */
.btn-primary:not(.hero-actions .btn-primary){
  background:#0875eb;
  color:#fff;
  border-color:#0875eb;
}

.btn-outline:not(.hero-actions .btn-outline){
  background:rgba(3,26,58,.22);
  border-color:rgba(255,255,255,.58);
  color:#fff;
}

/* ======================================================
   HERO TRUST / FEATURE BAR
====================================================== */

.hero-trust{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  width:100%;
  max-width:860px;
  margin-top:34px;
  border-top:1px solid rgba(255,255,255,.22);
  background:transparent;
}

/* Works with the new SVG markup */
.trust-item{
  position:relative;
  display:flex;
  align-items:center;
  gap:16px;
  min-height:88px;
  padding:20px 26px 20px 0;
  margin-right:26px;
}

.trust-item:not(:last-child)::after{
  content:"";
  position:absolute;
  right:0;
  top:22px;
  width:1px;
  height:44px;
  background:rgba(255,255,255,.22);
}

.trust-item:last-child{
  margin-right:0;
  padding-right:0;
}

.trust-icon{
  width:50px;
  min-width:50px;
  height:50px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
}

.trust-icon svg{
  width:46px;
  height:46px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  overflow:visible;
  filter:drop-shadow(0 0 8px rgba(35,151,255,.14));
}

.trust-text{
  display:block;
  color:#fff;
  font-size:15px;
  line-height:1.28;
  font-weight:600;
  white-space:nowrap;
}

/* Fallback for your old hero-trust markup */
.hero-trust > div{
  display:flex;
  align-items:center;
  gap:16px;
  min-height:88px;
}

.hero-trust > div:not(.trust-item){
  position:relative;
  padding:20px 26px 20px 0;
  margin-right:26px;
}

.hero-trust > div:not(.trust-item):not(:last-child)::after{
  content:"";
  position:absolute;
  right:0;
  top:22px;
  width:1px;
  height:44px;
  background:rgba(255,255,255,.22);
}

.hero-trust > div:not(.trust-item):last-child{
  margin-right:0;
  padding-right:0;
}

.hero-trust > div:not(.trust-item) b{
  display:flex;
  align-items:center;
  justify-content:center;
  width:50px;
  min-width:50px;
  height:50px;
  font-size:38px;
  line-height:1;
  color:#fff;
  font-weight:400;
}

.hero-trust > div:not(.trust-item) span{
  color:#fff;
  font-size:15px;
  line-height:1.28;
  font-weight:600;
  white-space:nowrap;
}

/* ======================================================
   HERO INTRO ANIMATION
====================================================== */

.hero .eyebrow,
.hero h1,
.hero .accent-rule,
.hero p,
.hero .hero-actions,
.hero .hero-trust{
  opacity:0;
  transform:translateY(24px);
  animation:heroReveal .75s cubic-bezier(.2,.7,.2,1) forwards;
  will-change:opacity,transform;
}

.hero .eyebrow{animation-delay:.12s}
.hero h1{animation-delay:.24s}
.hero .accent-rule{animation-delay:.34s}
.hero p{animation-delay:.42s}
.hero .hero-actions{animation-delay:.54s}
.hero .hero-trust{animation-delay:.68s}

.trust-item{
  opacity:0;
  transform:translateY(14px);
  animation:trustReveal .5s ease forwards;
}

.trust-item:nth-child(1){animation-delay:.84s}
.trust-item:nth-child(2){animation-delay:.94s}
.trust-item:nth-child(3){animation-delay:1.04s}
.trust-item:nth-child(4){animation-delay:1.14s}

@keyframes heroReveal{
  from{opacity:0;transform:translateY(24px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes trustReveal{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:translateY(0)}
}

/* ======================================================
   SCROLL REVEAL
====================================================== */

.scroll-reveal{
  opacity:0;
  transform:translateY(28px);
  transition:
    opacity .75s cubic-bezier(.2,.7,.2,1),
    transform .75s cubic-bezier(.2,.7,.2,1);
  will-change:opacity,transform;
}

.scroll-reveal.is-visible{
  opacity:1;
  transform:translateY(0);
}

.solution-card.scroll-reveal{
  transform:translateY(30px) scale(.985);
}

.solution-card.scroll-reveal.is-visible{
  transform:translateY(0) scale(1);
}

.solution-card:nth-child(1){transition-delay:.03s}
.solution-card:nth-child(2){transition-delay:.08s}
.solution-card:nth-child(3){transition-delay:.13s}
.solution-card:nth-child(4){transition-delay:.18s}
.solution-card:nth-child(5){transition-delay:.23s}
.solution-card:nth-child(6){transition-delay:.28s}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .hero .eyebrow,
  .hero h1,
  .hero .accent-rule,
  .hero p,
  .hero .hero-actions,
  .hero .hero-trust,
  .trust-item,
  .scroll-reveal{
    animation:none!important;
    transition:none!important;
    opacity:1!important;
    transform:none!important;
  }
}

/* ======================================================
   SOLUTIONS SECTION
====================================================== */

.solutions-section{
  padding:58px 0 0;
  background:#fff;
  text-align:center;
}

.solutions-section .section-kicker{
  color:#0968d8;
  font-size:12px;
  font-weight:800;
  letter-spacing:1.8px;
  margin-bottom:8px;
}

.solutions-section .section-kicker::before,
.solutions-section .section-kicker::after{
  content:"";
  display:inline-block;
  width:30px;
  height:1px;
  background:#9bb5d8;
  vertical-align:middle;
  margin:0 14px;
}

.solutions-section h2{
  margin:0 0 8px;
  color:#082b5d;
  font-size:32px;
  line-height:1.15;
  letter-spacing:-.7px;
  font-weight:750;
}

.section-intro{
  max-width:620px;
  margin:0 auto 30px;
  color:#57687d;
  font-size:14px;
  line-height:1.55;
}

/* ======================================================
   PRODUCT GRID
====================================================== */

.solution-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:12px;
  width:100%;
}

/* CARD */

.solution-card{
  min-height:168px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:22px 10px 20px;
  background:#fff;
  border:1px solid #dce5ef;
  border-radius:7px;
  box-shadow:none;
  transition:
    transform .25s ease,
    border-color .25s ease,
    box-shadow .25s ease;
}

.solution-card:hover{
  transform:translateY(-4px);
  border-color:#aacdf7;
  box-shadow:0 10px 25px rgba(15,67,125,.08);
}

/* ======================================================
   PRODUCT ICONS
====================================================== */

.solution-icon{
  width:64px;
  height:64px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:14px;
  color:#126ee8;
}

.solution-icon-wide{
  width:76px;
}

.solution-icon svg{
  width:58px;
  height:58px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
  overflow:visible;
}

.solution-icon-wide svg{
  width:72px;
}

.solution-card h3{
  margin:0;
  color:#082f65;
  font-size:14px;
  line-height:1.35;
  font-weight:700;
}

/* ======================================================
   BENEFITS ROW
====================================================== */

.solution-benefits{
  width:100%;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:26px;
  border-top:1px solid #e2e8f0;
  border-bottom:1px solid #e2e8f0;
  background:#fff;
}

.benefit-item{
  min-height:92px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:15px;
  padding:18px 25px;
  text-align:left;
  position:relative;
}

.benefit-item:not(:last-child)::after{
  content:"";
  position:absolute;
  right:0;
  top:25px;
  width:1px;
  height:42px;
  background:#dce4ee;
}

.benefit-icon{
  width:46px;
  min-width:46px;
  height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#126ee8;
}

.benefit-icon svg{
  width:43px;
  height:43px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.benefit-number{
  color:#116ce5;
  font-size:36px;
  line-height:1;
  font-weight:500;
  letter-spacing:-1.5px;
}

.benefit-number span{
  font-size:25px;
  vertical-align:top;
}

.benefit-item strong,
.benefit-item span{
  display:block;
}

.benefit-item strong{
  color:#344c6d;
  font-size:14px;
  font-weight:500;
  line-height:1.25;
}

.benefit-item > div:last-child > span{
  color:#344c6d;
  font-size:14px;
  line-height:1.25;
}

/* ======================================================
   SOLUTIONS TABLET
====================================================== */

@media(max-width:1100px){

  .solution-grid{
    grid-template-columns:repeat(3,1fr);
  }

  .solution-card{
    min-height:175px;
  }

}

/* ======================================================
   SOLUTIONS MOBILE / TABLET
====================================================== */

@media(max-width:820px){

  .solution-benefits{
    grid-template-columns:1fr 1fr;
  }

  .benefit-item:nth-child(2)::after{
    display:none;
  }

  .benefit-item:nth-child(1),
  .benefit-item:nth-child(2){
    border-bottom:1px solid #e2e8f0;
  }

}

/* ======================================================
   SOLUTIONS SMALL MOBILE
====================================================== */

@media(max-width:560px){

  .solutions-section{
    padding-top:44px;
  }

  .solutions-section h2{
    font-size:28px;
  }

  .section-intro{
    font-size:14px;
  }

  .solution-grid{
    grid-template-columns:1fr 1fr;
    gap:9px;
  }

  .solution-card{
    min-height:155px;
    padding:18px 8px;
  }

  .solution-icon{
    width:54px;
    height:54px;
    margin-bottom:10px;
  }

  .solution-icon svg{
    width:50px;
    height:50px;
  }

  .solution-card h3{
    font-size:13px;
  }

  .solution-benefits{
    grid-template-columns:1fr;
  }

  .benefit-item{
    justify-content:flex-start;
    padding-left:30px;
    min-height:78px;
    border-bottom:1px solid #e2e8f0;
  }

  .benefit-item::after{
    display:none !important;
  }

  .benefit-item:last-child{
    border-bottom:0;
  }

}

/* ======================================================
   ENQUIRY
====================================================== */

.enquiry-section{
  padding:82px 0;

  background:#f5f7fa;
}

.enquiry-grid{
  display:grid;

  grid-template-columns:.9fr 1.1fr;

  gap:75px;

  align-items:center;
}

.enquiry-copy p{
  font-size:17px;

  line-height:1.72;

  color:#5e6e83;

  max-width:620px;
}


/* ======================================================
   PREMIUM CONTACT CARDS
====================================================== */

.contact-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin-top:32px;
}

.contact-list > a,
.contact-list > div{
  min-height:82px;

  display:flex;
  align-items:center;

  gap:16px;

  padding:15px 18px;

  background:#ffffff;

  border:1px solid #dfe7f1;

  border-radius:9px;

  text-decoration:none !important;

  transition:
    transform .22s ease,
    border-color .22s ease,
    box-shadow .22s ease;
}

.contact-list > a:hover{
  transform:translateY(-2px);

  border-color:#b9d4f5;

  box-shadow:
    0 9px 24px rgba(12,58,112,.08);
}


/* ======================================================
   NEW ICON STYLE
====================================================== */

.contact-icon{
  width:48px !important;
  min-width:48px !important;
  height:48px !important;

  display:flex !important;

  align-items:center;
  justify-content:center;

  padding:0 !important;

  border-radius:12px !important;

  background:
    linear-gradient(
      145deg,
      #0b67cc 0%,
      #064b9e 100%
    ) !important;

  color:#ffffff !important;

  box-shadow:
    0 6px 16px rgba(5,80,165,.16);

  flex:0 0 48px;

  transition:
    transform .22s ease,
    box-shadow .22s ease;
}

.contact-list > a:hover .contact-icon{
  transform:
    translateY(-1px)
    scale(1.05);

  box-shadow:
    0 9px 20px rgba(5,80,165,.23);
}


/* SVG */

.contact-icon svg{
  display:block;

  width:23px !important;
  height:23px !important;

  max-width:23px !important;
  max-height:23px !important;

  fill:none !important;

  stroke:#ffffff !important;

  stroke-width:1.7;

  stroke-linecap:round;
  stroke-linejoin:round;

  overflow:visible;
}


/* WHATSAPP slightly larger */

.contact-icon-whatsapp svg{
  width:24px !important;
  height:24px !important;

  max-width:24px !important;
  max-height:24px !important;
}


/* ======================================================
   CONTACT TEXT
====================================================== */

.contact-list small{
  display:block;

  color:#91a3b8;

  font-size:12px;

  line-height:1.2;

  margin-bottom:5px;

  font-weight:500;
}

.contact-list strong{
  display:block;

  color:#0d3569;

  font-size:14px;

  line-height:1.35;

  font-weight:700;
}


/* ======================================================
   MOBILE
====================================================== */

@media(max-width:560px){

  .contact-list{
    grid-template-columns:1fr;
  }

  .contact-list > a,
  .contact-list > div{
    min-height:78px;
  }

  .contact-icon{
    width:45px !important;
    min-width:45px !important;
    height:45px !important;

    flex-basis:45px;
  }

  .contact-icon svg{
    width:21px !important;
    height:21px !important;
  }

}

/* ======================================================
   FORM
====================================================== */

.form-card{
  background:
    linear-gradient(
      145deg,
      #07346c 0%,
      #05295b 45%,
      #031a3a 100%
    );

  color:#fff;

  border-radius:11px;

  padding:36px;

  box-shadow:
    0 20px 48px rgba(5,34,73,.18);
}

.form-kicker{
  text-align:center;

  color:#45a7ff;

  letter-spacing:1.7px;

  font-size:12px;

  font-weight:800;
}

.form-card h3{
  text-align:center;

  font-size:31px;

  margin:8px 0 5px;
}

.form-card > p{
  text-align:center;

  color:#ced8e6;

  margin:0 0 25px;
}

.form-row{
  display:grid;

  grid-template-columns:1fr 1fr;

  gap:14px;
}

.form-card label{
  display:block;

  font-size:12px;

  font-weight:700;

  color:#e8eef6;

  margin-bottom:13px;
}

.form-card input,
.form-card textarea,
.form-card select{
  width:100%;

  margin-top:7px;

  background:#082b5b;

  color:#fff;

  border:1px solid #4d6d94;

  border-radius:5px;

  padding:13px 14px;

  outline:none;

  font:inherit;
}

.form-card input::placeholder,
.form-card textarea::placeholder{
  color:#9fb0c5;
}

.form-card select option{
  color:#111;

  background:#fff;
}

.form-card input:focus,
.form-card textarea:focus,
.form-card select:focus{
  border-color:#43a0ff;

  box-shadow:
    0 0 0 2px rgba(44,141,255,.16);
}

.btn-submit{
  width:100%;

  border:0;

  background:#0872e8;

  color:#fff;

  font-size:16px;

  margin-top:4px;
}

.btn-submit:hover{
  background:#1482fa;
}

.form-message{
  margin-top:12px;

  font-size:13px;

  min-height:18px;
}

.form-message.success{
  color:#9fe0bc;
}

.form-message.error{
  color:#ffb0b0;
}

.hp-field{
  position:absolute!important;

  left:-9999px!important;
}


/* ======================================================
   LAUNCH BAR
====================================================== */

.launch-strip{
  background:#062b5f;

  color:#fff;
}

.launch-inner{
  display:flex;

  align-items:center;

  justify-content:space-between;

  padding:26px 0;

  gap:30px;
}

.launch-inner small{
  display:block;

  color:#62b3ff;

  letter-spacing:1.2px;

  font-weight:800;

  margin-bottom:5px;
}

.launch-inner strong{
  font-size:18px;
}

.btn-light{
  background:#fff;

  color:#073a78;
}


/* ======================================================
   FOOTER
====================================================== */

.site-footer{
  background:#02132d;

  color:#aebbd0;

  padding:28px 0;
}

.footer-inner{
  display:flex;

  align-items:center;

  justify-content:space-between;
}

.footer-inner img{
  display:block;
  width:190px;
  max-width:100%;
  height:auto;
  object-fit:contain;
  filter:none !important;
}

.footer-inner p{
  font-size:13px;
}

.generic-content{
  padding:160px 0 80px;
}

.simple-header{
  position:relative;

  background:#031a3a;
}


/* ======================================================
   LARGE TABLET
====================================================== */

@media(max-width:1100px){

  .wrap{
    width:min(100% - 50px,1440px);
  }

  .main-nav{
    gap:24px;
  }

  .hero{
    height:80vh;
    min-height:700px;
  }

  .hero-grid{
    height:80vh;
    min-height:700px;
    grid-template-columns:58% 42%;
  }

  .hero-copy{
    max-width:640px;
  }

  /*
  Keep the actual image clear.
  Only move it slightly to the right.
  */

  .hero-bg{
    width:100%;
    height:100%;
    background-position:center center;
  }

  .solution-grid{
    grid-template-columns:repeat(3,1fr);
  }

  .enquiry-grid{
    grid-template-columns:1fr;
  }

}


/* ======================================================
   TABLET / MOBILE
====================================================== */

@media(max-width:820px){

  .wrap{
    width:min(100% - 34px,1440px);
  }

  .site-header{
    padding:20px 0;
  }

  .brand img{
    width:200px;
  }

  .mobile-toggle{
    display:block;
  }

  .main-nav{
    display:none;

    position:absolute;

    left:17px;
    right:17px;

    top:78px;

    background:#031a3a;

    border:1px solid #204b7f;

    border-radius:7px;

    padding:20px;

    flex-direction:column;

    align-items:stretch;

    gap:0;

    box-shadow:
      0 20px 40px rgba(0,0,0,.25);
  }

  .main-nav.is-open{
    display:flex;
  }

  .main-nav a{
    padding:13px;
  }

  .nav-cta{
    margin-top:6px;
  }


  /* MOBILE HERO */

  .hero{
    height:90vh;
    min-height:760px;
    padding-bottom:0;
  }

  .hero-grid{
    height:90vh;
    min-height:760px;
    display:block;
    padding-top:85px;
    padding-bottom:40px;
  }

  .hero-copy{
    padding:85px 0 45px;
    max-width:600px;
  }

  /*
  On smaller screens image becomes a full hero background,
  but we still keep it much clearer than before.
  */

  .hero-bg{
    width:100%;
    height:100%;
    background-position:67% center;
  }

  /*
  Mobile needs some darkening for text readability.
  This affects mainly the LEFT side.
  */

  

  .hero h1{
    max-width:580px;
  }

  .hero p{
    max-width:530px;
  }

  .hero-trust{
    grid-template-columns:1fr 1fr;

    max-width:600px;
  }

  .hero-trust > div:nth-child(2){
    border-right:0;
  }

  .hero-trust > div:nth-child(-n+2){
    border-bottom:1px solid rgba(255,255,255,.14);
  }

  .industry-bar{
    grid-template-columns:1fr 1fr;
  }

  .industry-bar > div:nth-child(2){
    border-right:0;
  }

  .industry-bar > div:nth-child(-n+2){
    border-bottom:1px solid #e6ebf2;
  }

}


/* ======================================================
   MOBILE
====================================================== */

@media(max-width:560px){

  .wrap{
    width:calc(100% - 28px);
  }


  .brand img{
    width:170px;
  }


    .hero{
    height:100vh;
    min-height:800px;
  }

/* HERO */

  .hero-grid{
    height:100vh;
    min-height:800px;
  }

  .hero-copy{
    padding-top:90px;
  }

  .hero-bg{
    background-position:70% center;
  }

  

  .hero h1{
    font-size:43px;

    line-height:1.05;

    letter-spacing:-1.4px;
  }

  .hero p{
    font-size:16px;

    line-height:1.6;
  }

  .eyebrow{
    font-size:13px;

    margin-bottom:22px;
  }

  .hero-actions{
    flex-direction:column;

    max-width:360px;
  }

  .btn{
    width:100%;
  }


  /* HERO FEATURES */

  .hero-trust{
    grid-template-columns:1fr 1fr;
  }

  .hero-trust > div{
    padding:16px 12px;
    min-height:78px;
  }

  .hero-trust b{
    width:42px;
    min-width:42px;
    height:42px;
    font-size:31px;
  }

  .hero-trust span{
    font-size:12px;
  }


  /* SOLUTIONS */

  .solution-grid{
    grid-template-columns:1fr 1fr;

    gap:10px;
  }

  .solution-card{
    min-height:165px;

    padding:22px 8px;
  }

  .solution-card .icon{
    font-size:44px;

    min-height:52px;

    margin-bottom:16px;
  }

  .solution-card h3{
    font-size:14px;
  }

  .solutions-section h2,
  .enquiry-copy h2{
    font-size:29px;
  }


  /* FORM */

  .form-row{
    grid-template-columns:1fr;
  }

  .contact-list{
    grid-template-columns:1fr;
  }

  .industry-bar{
    grid-template-columns:1fr;
  }

  .industry-bar > div{
    border-right:0;

    border-bottom:1px solid #e6ebf2;
  }

  .industry-bar > div:last-child{
    border-bottom:0;
  }

  .form-card{
    padding:26px 18px;
  }


  /* FOOTER */

  .launch-inner,
  .footer-inner{
    flex-direction:column;

    text-align:center;
  }

}

/* ======================================================
   HERO TRUST RESPONSIVE PATCH
====================================================== */

@media(max-width:820px){
  .hero-trust{
    grid-template-columns:1fr 1fr;
    max-width:600px;
  }

  .trust-item,
  .hero-trust > div:not(.trust-item){
    margin-right:0;
    padding:18px;
  }

  .trust-item:nth-child(2)::after,
  .hero-trust > div:not(.trust-item):nth-child(2)::after{
    display:none;
  }

  .trust-item:nth-child(1),
  .trust-item:nth-child(2),
  .hero-trust > div:not(.trust-item):nth-child(1),
  .hero-trust > div:not(.trust-item):nth-child(2){
    border-bottom:1px solid rgba(255,255,255,.16);
  }
}

@media(max-width:560px){
  .hero-trust{
    margin-top:26px;
  }

  .trust-item,
  .hero-trust > div:not(.trust-item){
    gap:11px;
    min-height:76px;
    padding:15px 10px;
  }

  .trust-icon{
    width:42px;
    min-width:42px;
    height:42px;
  }

  .trust-icon svg{
    width:38px;
    height:38px;
  }

  .trust-text,
  .hero-trust > div:not(.trust-item) span{
    font-size:12px;
  }

  .hero-trust > div:not(.trust-item) b{
    width:42px;
    min-width:42px;
    height:42px;
    font-size:31px;
  }
}


/* ======================================================
   HERO BUTTON RESPONSIVE OVERRIDE
====================================================== */

@media(max-width:820px){
  .hero-actions{
    gap:14px;
  }

  .hero-actions .btn{
    height:52px;
    min-height:52px;
    padding:0 22px;
  }

  .hero-actions .btn-primary{
    min-width:205px;
  }

  .hero-actions .btn-outline{
    min-width:220px;
  }
}

@media(max-width:560px){
  .hero-actions{
    flex-direction:column;
    align-items:stretch;
    gap:12px;
    width:100%;
    max-width:370px;
  }

  .hero-actions .btn{
    width:100%;
    min-width:0;
    height:52px;
    min-height:52px;
  }

  .hero-actions .btn span{
    font-size:15px;
  }
}
/* ======================================================
   FINAL UI FIXES
====================================================== */


/* ======================================================
   HERO CTA BUTTONS
====================================================== */

.hero-actions{
  display:flex;
  align-items:center;
  gap:20px;
  margin-top:30px;
}

.hero-btn{
  height:54px;
  min-height:54px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  gap:13px;

  padding:0 28px;

  border-radius:5px;

  text-decoration:none !important;

  font-size:16px;
  font-weight:700;
  line-height:1;

  white-space:nowrap;

  transition:
    transform .22s ease,
    background .22s ease,
    border-color .22s ease,
    box-shadow .22s ease;
}

.hero-btn:hover{
  transform:translateY(-2px);
}


/* BLUE BUTTON */

.hero-btn-primary{
  min-width:220px;

  background:#0868d6;

  color:#fff !important;

  border:1px solid #0868d6;

  box-shadow:
    0 8px 22px rgba(0,80,180,.22);
}

.hero-btn-primary:hover{
  background:#1176e8;

  border-color:#1176e8;
}


/* OUTLINE BUTTON */

.hero-btn-outline{
  min-width:235px;

  color:#fff !important;

  background:rgba(3,24,52,.25);

  border:1px solid rgba(255,255,255,.52);

  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
}

.hero-btn-outline:hover{
  background:rgba(255,255,255,.07);

  border-color:#fff;
}


/* HERO BUTTON ICON */

.hero-btn-icon{
  width:23px;
  min-width:23px;
  height:23px;

  display:flex;
  align-items:center;
  justify-content:center;
}

.hero-btn-icon svg{
  width:22px !important;
  height:22px !important;

  display:block;

  fill:none !important;

  stroke:currentColor !important;

  stroke-width:1.8;

  stroke-linecap:round;
  stroke-linejoin:round;
}

.hero-btn-text{
  display:inline-block;

  font-size:16px;
  line-height:1;
}


/* ======================================================
   CONTACT CARDS
====================================================== */

.contact-list{
  display:grid;

  grid-template-columns:1fr 1fr;

  gap:14px;

  margin-top:32px;
}

.contact-list > a,
.contact-list > div{
  min-height:78px;

  display:flex;
  align-items:center;

  gap:15px;

  padding:15px 17px;

  background:#fff;

  border:1px solid #e0e7f0;

  border-radius:8px;

  text-decoration:none !important;

  transition:
    transform .22s ease,
    border-color .22s ease,
    box-shadow .22s ease;
}

.contact-list > a:hover{
  transform:translateY(-2px);

  border-color:#bcd7f7;

  box-shadow:
    0 8px 20px rgba(10,65,130,.07);
}


/* CONTACT ICON */

.contact-icon{
  width:46px !important;
  min-width:46px !important;
  height:46px !important;

  display:flex !important;
  align-items:center;
  justify-content:center;

  padding:0 !important;

  background:#eaf4ff !important;
  border-radius:50%;

  color:#1282ff !important;

  flex:0 0 46px;

  transition:
    transform .22s ease,
    background .22s ease,
    box-shadow .22s ease;
}

.contact-list > a:hover .contact-icon{
  transform:translateY(-1px) scale(1.04);
  background:#e2f0ff !important;
  box-shadow:0 5px 14px rgba(18,130,255,.10);
}

.contact-icon svg{
  display:block;

  width:22px !important;
  height:22px !important;

  max-width:22px !important;
  max-height:22px !important;

  fill:none !important;
  stroke:currentColor !important;

  stroke-width:1.75;
  stroke-linecap:round;
  stroke-linejoin:round;

  overflow:visible;
}

/* Slightly larger WhatsApp mark for better visual balance */
.whatsapp-icon svg{
  width:23px !important;
  height:23px !important;
  max-width:23px !important;
  max-height:23px !important;
}

.contact-list small{
  display:block;

  color:#8ba0ba;

  font-size:12px;

  margin-bottom:4px;
}

.contact-list strong{
  display:block;

  color:#0e3568;

  font-size:14px;

  line-height:1.3;

  font-weight:700;
}


/* ======================================================
   SOLUTIONS CARDS - CLOSER TO MOCKUP
====================================================== */

.solution-card{
  min-height:170px;

  padding:22px 12px 20px;

  border-radius:6px;

  border:1px solid #dce5ef;
}

.solution-icon{
  width:68px;
  height:68px;

  margin-bottom:12px;

  color:#1776ed;
}

.solution-icon svg{
  width:60px;
  height:60px;

  stroke-width:1.55;
}

.solution-icon-wide{
  width:82px;
}

.solution-icon-wide svg{
  width:75px;
}

.solution-card h3{
  color:#092f66;

  font-size:14px;

  line-height:1.35;

  font-weight:700;
}


/* ======================================================
   BENEFIT STRIP
====================================================== */

.solution-benefits{
  min-height:105px;

  margin-top:26px;

  display:grid;

  grid-template-columns:repeat(4,1fr);

  align-items:center;
}

.benefit-item{
  min-height:100px;

  gap:16px;

  padding:18px 28px;
}

.benefit-icon{
  width:48px;
  min-width:48px;
  height:48px;

  color:#116fe9;
}

.benefit-icon svg{
  width:45px;
  height:45px;

  stroke-width:1.65;
}


/* IMPORTANT: fixes + dropping below 100 */

.benefit-number{
  display:flex;
  align-items:flex-start;

  color:#116fe9;

  font-size:38px;

  line-height:1;

  font-weight:500;

  letter-spacing:-2px;

  white-space:nowrap;
}

.benefit-number span{
  display:inline !important;

  margin-left:2px;

  color:#116fe9;

  font-size:25px;

  line-height:1;

  vertical-align:top;

  transform:translateY(-3px);
}


.benefit-item strong{
  display:block;

  color:#354c6c;

  font-size:14px;

  font-weight:500;

  line-height:1.25;
}

.benefit-item > div:last-child > span{
  display:block;

  color:#354c6c;

  font-size:14px;

  line-height:1.25;
}


/* ======================================================
   BIGGER ENQUIRY SECTION
====================================================== */

.enquiry-section{
  padding:100px 0 110px;

  background:#f5f7fa;
}

.enquiry-grid{
  display:grid;

  grid-template-columns:.88fr 1.12fr;

  gap:85px;

  align-items:center;
}


/* LEFT */

.enquiry-copy{
  max-width:650px;
}

.enquiry-copy h2{
  font-size:40px;

  margin-bottom:18px;
}

.enquiry-copy p{
  max-width:650px;

  color:#6b7f98;

  font-size:17px;

  line-height:1.75;
}


/* BIGGER FORM */

.form-card{
  min-height:590px;

  padding:42px 42px 40px;

  border-radius:11px;

  background:
    linear-gradient(
      145deg,
      #073b7a 0%,
      #062d61 42%,
      #031d41 100%
    );

  box-shadow:
    0 22px 55px rgba(3,32,73,.16);
}

.form-kicker{
  font-size:12px;

  letter-spacing:2px;

  margin-bottom:7px;
}

.form-card h3{
  margin:5px 0 6px;

  font-size:34px;
}

.form-card > p{
  margin-bottom:29px;

  font-size:14px;
}


/* FORM INPUTS */

.form-row{
  gap:16px;
}

.form-card label{
  margin-bottom:15px;

  font-size:12px;
}

.form-card input,
.form-card select{
  min-height:48px;

  padding:13px 15px;
}

.form-card textarea{
  min-height:115px;

  padding:14px 15px;

  resize:vertical;
}


/* ======================================================
   SUBMIT ENQUIRY - ROUNDED RECTANGLE WAVE EFFECT
====================================================== */

.submit-wave-wrap{
  position:relative;
  width:100%;
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  isolation:isolate;
  overflow:visible;
}

/* MAIN SUBMIT BUTTON */

.btn-submit{
  position:relative;
  z-index:5;

  width:100%;
  height:58px;

  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;

  overflow:hidden;

  border:0;
  border-radius:6px;

  background:
    linear-gradient(
      90deg,
      #0874ec 0%,
      #1596ff 100%
    );

  color:#fff;

  font-size:16px;
  font-weight:700;
  letter-spacing:.1px;

  cursor:pointer;

  box-shadow:
    0 10px 26px rgba(0,100,220,.22);

  transition:
    transform .25s ease,
    box-shadow .25s ease,
    background .25s ease;
}

.btn-submit span,
.btn-submit .submit-arrow{
  position:relative;
  z-index:6;
}

.submit-arrow{
  font-size:18px;
  line-height:1;
}

/* FIRST RECTANGULAR PULSE */

.submit-wave-wrap::before{
  content:"";

  position:absolute;
  left:0;
  top:0;

  width:100%;
  height:58px;

  border-radius:6px;

  border:2px solid rgba(62,157,255,.40);

  opacity:0;

  z-index:1;
  pointer-events:none;

  box-shadow:
    0 0 0 8px rgba(65,158,255,.12),
    0 0 0 18px rgba(65,158,255,.080),
    0 0 0 30px rgba(65,158,255,.045),
    0 0 0 44px rgba(65,158,255,.020);

  animation:
    rectanglePulseOne
    2.7s
    cubic-bezier(.2,.6,.25,1)
    infinite;
}

/* SECOND RECTANGULAR PULSE */

.submit-wave-wrap::after{
  content:"";

  position:absolute;
  left:0;
  top:0;

  width:100%;
  height:58px;

  border-radius:6px;

  border:2px solid rgba(105,184,255,.32);

  opacity:0;

  z-index:1;
  pointer-events:none;

  box-shadow:
    0 0 0 7px rgba(95,175,255,.10),
    0 0 0 16px rgba(95,175,255,.065),
    0 0 0 27px rgba(95,175,255,.035),
    0 0 0 40px rgba(95,175,255,.018);

  animation:
    rectanglePulseTwo
    2.7s
    cubic-bezier(.2,.6,.25,1)
    1.35s
    infinite;
}

/* WAVE ANIMATION */

@keyframes rectanglePulseOne{

  0%{
    transform:
      scaleX(.98)
      scaleY(.92);

    opacity:0;
  }

  12%{
    opacity:.85;
  }

  55%{
    opacity:.28;
  }

  100%{
    transform:
      scaleX(1.08)
      scaleY(1.35);

    opacity:0;
  }
}

@keyframes rectanglePulseTwo{

  0%{
    transform:
      scaleX(.98)
      scaleY(.92);

    opacity:0;
  }

  12%{
    opacity:.65;
  }

  55%{
    opacity:.22;
  }

  100%{
    transform:
      scaleX(1.08)
      scaleY(1.35);

    opacity:0;
  }
}

/* HOVER */

.btn-submit:hover{
  transform:translateY(-2px);

  background:
    linear-gradient(
      90deg,
      #0c7df2 0%,
      #29a2ff 100%
    );

  box-shadow:
    0 14px 34px rgba(0,105,230,.30);
}

.btn-submit:active{
  transform:translateY(0);
}

/* ACCESSIBILITY */

@media(prefers-reduced-motion:reduce){

  .submit-wave-wrap::before,
  .submit-wave-wrap::after{
    animation:none !important;
  }
}

/* ======================================================
   RESPONSIVE
====================================================== */

@media(max-width:1100px){

  .enquiry-grid{
    grid-template-columns:1fr;

    gap:50px;
  }

  .form-card{
    min-height:auto;
  }

}


@media(max-width:820px){

  .hero-actions{
    gap:14px;
  }

  .hero-btn{
    height:52px;
  }

  .solution-benefits{
    grid-template-columns:1fr 1fr;
  }

  .contact-list{
    grid-template-columns:1fr 1fr;
  }

}


@media(max-width:560px){

  .hero-actions{
    flex-direction:column;

    align-items:stretch;

    width:100%;

    max-width:370px;
  }

  .hero-btn{
    width:100%;

    min-width:0;
  }


  .solution-benefits{
    grid-template-columns:1fr;
  }


  .benefit-item{
    justify-content:flex-start;
  }


  .contact-list{
    grid-template-columns:1fr;
  }


  .enquiry-section{
    padding:65px 0;
  }


  .form-card{
    padding:28px 18px;
  }


  .form-card h3{
    font-size:29px;
  }

}

/* ======================================================
   CONTACT ICON MOBILE REFINEMENT
====================================================== */

@media(max-width:560px){

  .contact-icon{
    width:44px !important;
    min-width:44px !important;
    height:44px !important;
    flex-basis:44px;
  }

  .contact-icon svg{
    width:21px !important;
    height:21px !important;
  }

  .whatsapp-icon svg{
    width:22px !important;
    height:22px !important;
  }

  .btn-submit{
    height:56px;
  }

}


/* ======================================================
   SUBMIT RECTANGLE WAVE MOBILE REFINEMENT
====================================================== */

@media(max-width:560px){

  .submit-wave-wrap{
    margin-top:10px;
  }

  .btn-submit,
  .submit-wave-wrap::before,
  .submit-wave-wrap::after{
    height:56px;
  }

}
/* WhatsApp icon correction */

.contact-icon-whatsapp{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.contact-icon-whatsapp svg{
  width:25px !important;
  height:25px !important;

  max-width:25px !important;
  max-height:25px !important;

  fill:none !important;
  stroke:currentColor !important;

  stroke-width:1.8 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;

  transform:scale(1.08);

  overflow:visible;
}


/* ======================================================
   FINAL MOBILE VIEW FIX
   Added as the last override so it wins over older
   responsive rules above.
====================================================== */

@media(max-width:820px){

  /* ---------- GLOBAL ---------- */

  .wrap{
    width:calc(100% - 28px);
    max-width:none;
  }

  body{
    overflow-x:hidden;
  }


  /* ---------- HEADER ---------- */

  .site-header{
    padding:15px 0;
  }

  .nav-wrap{
    min-height:72px;
    align-items:flex-start;
  }

  .brand{
    position:relative;
    z-index:25;
  }

  .brand img{
    width:175px !important;
    max-height:68px !important;
    height:auto !important;
    object-fit:contain;
    object-position:left top;
    filter:none !important;
  }

  .mobile-toggle{
    display:block;
    position:relative;
    z-index:26;
    margin-top:6px;
    padding:4px;
  }

  .mobile-toggle span{
    width:30px;
    height:2px;
    margin:6px 0;
    background:#fff;
    border-radius:3px;
  }

  .main-nav{
    display:none;
    position:absolute;
    left:14px;
    right:14px;
    top:82px;
    z-index:30;
    padding:14px;
    border:1px solid rgba(100,160,225,.35);
    border-radius:9px;
    background:rgba(2,22,50,.97);
    box-shadow:0 18px 45px rgba(0,0,0,.28);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
  }

  .main-nav.is-open{
    display:flex;
  }

  .main-nav a{
    padding:13px 14px;
    font-size:15px;
  }

  .nav-cta{
    margin-top:7px;
    text-align:center;
  }


  /* ---------- HERO ---------- */

  .hero{
    position:relative;
    height:auto !important;
    min-height:100svh !important;
    overflow:hidden;
  }

  /* Mobile darkening layer:
     keeps the product visible but improves text readability. */
  .hero::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:2;
    pointer-events:none;
    background:
      linear-gradient(
        90deg,
        rgba(2,21,48,.98) 0%,
        rgba(2,24,54,.96) 38%,
        rgba(3,30,66,.88) 58%,
        rgba(3,31,68,.62) 76%,
        rgba(3,28,61,.35) 100%
      );
  }

  .hero-bg{
    width:100% !important;
    height:100% !important;
    background-size:cover !important;
    background-position:72% center !important;
  }

  .hero-overlay{
    display:none !important;
  }

  .hero-grid{
    position:relative;
    z-index:3;
    display:block !important;
    height:auto !important;
    min-height:100svh !important;
    padding-top:112px !important;
    padding-bottom:42px !important;
  }

  .hero-copy{
    width:100%;
    max-width:100% !important;
    padding:54px 0 24px !important;
  }

  .eyebrow{
    gap:12px;
    margin-bottom:22px;
    font-size:13px;
    letter-spacing:1.8px;
  }

  .eyebrow span{
    width:32px;
  }

  .hero h1{
    width:100%;
    max-width:390px !important;
    margin:0 0 18px;
    font-size:40px !important;
    line-height:1.055 !important;
    letter-spacing:-1.3px !important;
    overflow-wrap:normal;
    word-break:normal;
  }

  .hero h1 em{
    display:block;
    margin-top:2px;
  }

  .accent-rule{
    width:52px;
    height:4px;
    margin:19px 0 20px;
  }

  .hero p{
    width:100%;
    max-width:390px !important;
    font-size:15.5px !important;
    line-height:1.58 !important;
    color:rgba(255,255,255,.94);
  }


  /* ---------- HERO BUTTONS ---------- */

  .hero-actions{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    width:100% !important;
    max-width:390px !important;
    gap:12px !important;
    margin-top:27px !important;
  }

  .hero-actions .btn,
  .hero-btn{
    width:100% !important;
    min-width:0 !important;
    height:54px !important;
    min-height:54px !important;
    padding:0 20px !important;
    justify-content:center;
    border-radius:6px !important;
  }

  .hero-actions .btn span,
  .hero-btn-text{
    font-size:15px !important;
  }

  .hero-btn-icon,
  .hero-actions .btn::before{
    flex:0 0 21px;
  }


  /* ---------- HERO FEATURE / TRUST GRID ---------- */

  .hero-trust{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    width:100% !important;
    max-width:390px !important;
    margin-top:25px !important;
    border-top:1px solid rgba(255,255,255,.18) !important;
    border-bottom:1px solid rgba(255,255,255,.12);
    background:rgba(2,25,56,.16);
  }

  .trust-item,
  .hero-trust > div:not(.trust-item){
    position:relative;
    min-height:82px !important;
    margin:0 !important;
    padding:16px 12px !important;
    gap:11px !important;
    border:0 !important;
    justify-content:flex-start;
  }

  /* Remove old desktop vertical divider pseudo-elements. */
  .trust-item::after,
  .hero-trust > div:not(.trust-item)::after{
    display:none !important;
  }

  .trust-item:nth-child(odd),
  .hero-trust > div:not(.trust-item):nth-child(odd){
    border-right:1px solid rgba(255,255,255,.16) !important;
  }

  .trust-item:nth-child(-n+2),
  .hero-trust > div:not(.trust-item):nth-child(-n+2){
    border-bottom:1px solid rgba(255,255,255,.16) !important;
  }

  .trust-icon,
  .hero-trust > div:not(.trust-item) b{
    width:40px !important;
    min-width:40px !important;
    height:40px !important;
    font-size:29px !important;
    flex:0 0 40px;
  }

  .trust-icon svg{
    width:37px !important;
    height:37px !important;
  }

  .trust-text,
  .hero-trust > div:not(.trust-item) span{
    font-size:12px !important;
    line-height:1.25 !important;
    white-space:normal !important;
  }


  /* ---------- SOLUTIONS ---------- */

  .solutions-section{
    padding-top:44px !important;
  }

  .solutions-section h2{
    font-size:29px !important;
    line-height:1.15;
  }

  .section-intro{
    width:100%;
    max-width:500px;
    font-size:14px;
    margin-bottom:24px;
  }

  .solution-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }

  .solution-card{
    min-height:152px !important;
    padding:17px 8px !important;
  }

  .solution-icon{
    width:54px !important;
    height:54px !important;
    margin-bottom:10px !important;
  }

  .solution-icon svg{
    width:49px !important;
    height:49px !important;
  }

  .solution-card h3{
    font-size:12.5px !important;
    line-height:1.3 !important;
  }

  .solution-benefits{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    margin-top:20px !important;
  }

  .benefit-item{
    min-height:86px !important;
    justify-content:flex-start !important;
    gap:11px !important;
    padding:14px 12px !important;
  }

  .benefit-item::after{
    display:none !important;
  }

  .benefit-item:nth-child(odd){
    border-right:1px solid #e2e8f0;
  }

  .benefit-item:nth-child(-n+2){
    border-bottom:1px solid #e2e8f0;
  }

  .benefit-icon{
    width:39px !important;
    min-width:39px !important;
    height:39px !important;
  }

  .benefit-icon svg{
    width:36px !important;
    height:36px !important;
  }

  .benefit-number{
    font-size:31px !important;
  }

  .benefit-number span{
    font-size:20px !important;
  }

  .benefit-item strong,
  .benefit-item > div:last-child > span{
    font-size:12px !important;
  }


  /* ---------- ENQUIRY ---------- */

  .enquiry-section{
    padding:58px 0 68px !important;
  }

  .enquiry-grid{
    grid-template-columns:1fr !important;
    gap:34px !important;
  }

  .enquiry-copy{
    max-width:none !important;
  }

  .enquiry-copy h2{
    font-size:31px !important;
    margin-bottom:14px !important;
  }

  .enquiry-copy p{
    max-width:none !important;
    font-size:15px !important;
    line-height:1.65 !important;
  }

  .contact-list{
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  .contact-list > a,
  .contact-list > div{
    min-height:74px !important;
  }

  .form-card{
    width:100%;
    min-height:0 !important;
    padding:27px 17px 26px !important;
    border-radius:10px !important;
  }

  .form-card h3{
    font-size:28px !important;
  }

  .form-card > p{
    font-size:13px !important;
    line-height:1.5;
  }

  .form-row{
    grid-template-columns:1fr !important;
    gap:0 !important;
  }

  .form-card input,
  .form-card select{
    min-height:46px !important;
  }

  .form-card textarea{
    min-height:100px !important;
  }


  /* ---------- FOOTER / STRIP ---------- */

  .launch-inner,
  .footer-inner{
    flex-direction:column !important;
    text-align:center;
  }
}


/* Smaller phones */
@media(max-width:420px){

  .wrap{
    width:calc(100% - 22px);
  }

  .brand img{
    width:160px !important;
  }

  .hero-grid{
    padding-top:104px !important;
  }

  .hero-copy{
    padding-top:49px !important;
  }

  .hero h1{
    max-width:355px !important;
    font-size:37px !important;
  }

  .hero p,
  .hero-actions,
  .hero-trust{
    max-width:355px !important;
  }

  .trust-item,
  .hero-trust > div:not(.trust-item){
    padding:14px 9px !important;
    gap:9px !important;
  }

  .trust-icon,
  .hero-trust > div:not(.trust-item) b{
    width:36px !important;
    min-width:36px !important;
    height:36px !important;
    flex-basis:36px;
  }

  .trust-icon svg{
    width:34px !important;
    height:34px !important;
  }

  .trust-text,
  .hero-trust > div:not(.trust-item) span{
    font-size:11.5px !important;
  }

  .solution-card{
    min-height:145px !important;
  }

  .solution-card h3{
    font-size:12px !important;
  }

  .benefit-item{
    min-height:82px !important;
  }

  .benefit-number{
    font-size:28px !important;
  }
}


/* ======================================================
   FINAL HERO BACKGROUND MOTION
====================================================== */

.hero-bg{
  animation:heroImageFloat 14s ease-in-out infinite alternate;
  transform-origin:center center;
  will-change:transform;
}

@keyframes heroImageFloat{
  0%{
    transform:scale(1) translate3d(0,0,0);
  }

  50%{
    transform:scale(1.025) translate3d(-5px,-2px,0);
  }

  100%{
    transform:scale(1.04) translate3d(6px,2px,0);
  }
}

@media(max-width:820px){
  .hero-bg{
    animation:heroImageFloatMobile 16s ease-in-out infinite alternate;
  }

  @keyframes heroImageFloatMobile{
    0%{
      transform:scale(1) translate3d(0,0,0);
    }

    100%{
      transform:scale(1.025) translate3d(-4px,0,0);
    }
  }
}

@media(prefers-reduced-motion:reduce){
  .hero-bg{
    animation:none !important;
    transform:none !important;
  }
}