:root{
  --navy:#03152d;
  --navy2:#061d3b;
  --blue:#1263dc;
  --blue2:#0a4fc0;
  --ink:#07182e;
  --muted:#5f6d7e;
  --bg:#f6f8fb;
  --line:#dce3ec;
  --white:#fff;
  --shadow:0 14px 35px rgba(3,21,45,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;color:var(--ink);background:var(--bg);line-height:1.55}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.container{width:min(1180px,92%);margin:auto}
.topbar{height:76px;background:var(--navy);color:#fff;display:flex;align-items:center;position:sticky;top:0;z-index:20;box-shadow:0 2px 12px rgba(0,0,0,.18)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:28px}
.logo{width:188px;height:52px;object-fit:cover;object-position:left center;border-radius:3px}
.menu{display:flex;align-items:center;gap:34px;font-size:14px;font-weight:700}
.menu a{opacity:.9;position:relative}
.menu a:hover,.menu a.active{opacity:1;color:#4f8eff}
.menu a.active:after{content:"";position:absolute;left:0;right:0;bottom:-11px;height:3px;background:var(--blue);border-radius:4px}
.cta{background:var(--blue);padding:13px 22px;border-radius:4px;font-weight:800;color:#fff;white-space:nowrap}
.lang{font-size:13px;color:#fff;opacity:.95}
.mobile-btn{display:none;background:none;border:0;color:#fff;font-size:26px}
.hero{min-height:460px;background:#071b34;position:relative;overflow:hidden}
.hero-photo{position:absolute;inset:0;background-size:cover;background-position:center;filter:saturate(.9)}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,17,38,.96) 0%,rgba(2,17,38,.82) 34%,rgba(2,17,38,.18) 70%,rgba(2,17,38,.08));}
.hero-content{position:relative;z-index:2;padding:82px 0 70px;color:#fff;max-width:610px}
.kicker{font-weight:800;letter-spacing:.7px;font-size:14px;color:#dce8ff}
.hero h1{font-size:54px;line-height:1.02;margin:15px 0 18px;letter-spacing:-1.7px}
.hero h1 span{color:#3678e7}
.hero p{font-size:17px;color:#eef3fa;max-width:580px}
.checks{display:grid;gap:8px;margin-top:24px}
.check{display:flex;gap:10px;align-items:center;font-weight:700;font-size:14px}
.check i{width:20px;height:20px;border-radius:50%;background:#2875e9;display:inline-grid;place-items:center;font-style:normal;font-size:12px}
.trust-row{background:#fff;box-shadow:0 3px 14px rgba(0,0,0,.07);position:relative;z-index:3}
.trust-grid{display:grid;grid-template-columns:repeat(5,1fr)}
.trust{padding:26px 18px;text-align:center;border-right:1px solid var(--line)}
.trust:last-child{border-right:0}
.icon{font-size:30px;color:#1665d7;margin-bottom:8px}
.trust h4{margin:0 0 5px;font-size:13px}
.trust p{margin:0;color:var(--muted);font-size:12px}
.section{padding:72px 0}
.section-head{text-align:center;max-width:760px;margin:0 auto 36px}
.section-head .kicker{color:#1464d8}
.section-head h2{font-size:34px;line-height:1.15;margin:8px 0 12px}
.section-head p{color:var(--muted);margin:0}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:#fff;border-radius:6px;overflow:hidden;box-shadow:var(--shadow);border:1px solid #e8edf4}
.card img{width:100%;height:155px;object-fit:cover}
.card-body{padding:22px}
.card h3{margin:0 0 8px;font-size:19px}
.card p{margin:0 0 16px;color:var(--muted);font-size:14px}
.more{font-size:12px;color:#0b59c8;font-weight:900;letter-spacing:.2px}
.band{background:var(--navy);color:#fff}
.band-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:15px;text-align:center}
.band-item{padding:25px 10px}
.band-item .icon{color:#3678e7}
.band-item strong{display:block;margin-bottom:5px}
.band-item span{font-size:12px;color:#b9c5d6}
.split{display:grid;grid-template-columns:1fr 1.2fr;gap:55px;align-items:center}
.split img{border-radius:6px;box-shadow:var(--shadow);width:100%;height:360px;object-fit:cover}
.split h2{font-size:36px;line-height:1.1;margin:8px 0 18px}
.split p{color:var(--muted)}
.value-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.value{padding:24px 15px;text-align:center;border-right:1px solid var(--line)}
.value:last-child{border-right:0}
.value h4{margin:7px 0;font-size:15px}
.value p{font-size:12px;color:var(--muted);margin:0}
.fleet-row{display:grid;grid-template-columns:1fr 2fr;gap:40px;align-items:center}
.fleet-row img{height:280px;width:100%;object-fit:cover;border-radius:6px}
.contact-banner{background:linear-gradient(110deg,#073b91,#1263dc);color:#fff;border-radius:7px;padding:28px 34px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.contact-banner h3{margin:0 0 5px;font-size:21px}.contact-banner p{margin:0;color:#dce9ff}
.page-hero{min-height:325px}
.page-hero .hero-content{padding:76px 0 58px}
.page-hero h1{font-size:48px}
.service-intro{font-size:15px}
.application-wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:30px;align-items:start}
.form-card,.side-card{background:#fff;border:1px solid #e2e8f0;border-radius:7px;box-shadow:var(--shadow);padding:28px}
.form-card h2{margin:0 0 4px;font-size:27px}.form-card .sub{color:var(--muted);margin:0 0 24px;font-size:14px}
.form-section{border-top:1px solid var(--line);padding-top:22px;margin-top:22px}
.form-section:first-of-type{border-top:0;padding-top:0;margin-top:0}
.form-section h3{font-size:14px;color:#0c4b9d;margin:0 0 15px;text-transform:uppercase;letter-spacing:.3px}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.field{display:flex;flex-direction:column;gap:6px}.field.full{grid-column:1/-1}
label{font-size:12px;font-weight:800;color:#24344a}
input,select,textarea{font:inherit;border:1px solid #ccd6e2;border-radius:4px;padding:11px 12px;background:#fff;outline:none}
input:focus,select:focus,textarea:focus{border-color:#2d72df;box-shadow:0 0 0 3px rgba(45,114,223,.12)}
textarea{min-height:120px;resize:vertical}
.check-list{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.check-label{display:flex;align-items:center;gap:8px;font-size:13px;color:#33455c}
.check-label input{accent-color:#1764d5}
.radio-row{display:flex;gap:20px;flex-wrap:wrap}
.radio-label{font-size:13px;display:flex;align-items:center;gap:7px}
.submit{width:100%;border:0;background:var(--blue);color:#fff;font-weight:900;padding:14px 18px;border-radius:4px;cursor:pointer;font-size:14px}
.submit:hover{background:var(--blue2)}
.status{margin-top:12px;font-size:13px;font-weight:700;display:none}
.side-card{background:#061b36;color:#fff;position:sticky;top:98px}
.side-card h3{font-size:24px;margin-top:0}.side-card p{color:#c9d5e6;font-size:14px}
.side-list{display:grid;gap:15px;margin-top:24px}.side-list div{display:flex;gap:11px}.side-list b{font-size:13px}.side-list span{font-size:12px;color:#b9c7d9}
footer{background:#02132b;color:#fff;padding:44px 0 16px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1.1fr 1fr;gap:35px}
footer h4{margin:0 0 14px;font-size:14px}.footer-copy{font-size:13px;color:#bdc9d8;max-width:310px}.footer-links{display:grid;gap:8px;font-size:13px;color:#c7d1df}.footer-contact{display:grid;gap:10px;font-size:13px;color:#c7d1df}.copyright{border-top:1px solid rgba(255,255,255,.12);margin-top:30px;padding-top:14px;color:#8290a4;font-size:11px;display:flex;justify-content:space-between}
@media(max-width:900px){
 .menu{gap:17px;font-size:12px}.cta{padding:10px 14px}
 .hero h1{font-size:43px}.trust-grid{grid-template-columns:repeat(3,1fr)}.trust:nth-child(4),.trust:nth-child(5){border-top:1px solid var(--line)}
 .cards{grid-template-columns:repeat(2,1fr)}.split,.fleet-row,.application-wrap{grid-template-columns:1fr}.side-card{position:static}.footer-grid{grid-template-columns:repeat(2,1fr)}
 .band-grid{grid-template-columns:repeat(3,1fr)}.value-grid{grid-template-columns:repeat(3,1fr)}.value:nth-child(4),.value:nth-child(5){border-top:1px solid var(--line)}
}
@media(max-width:650px){
 .topbar{height:68px}.mobile-btn{display:block}.menu{display:none}.nav{gap:10px}.logo{width:160px;height:45px}
 .hero{min-height:560px}.hero-content{padding:70px 0 45px}.hero h1{font-size:38px}.hero p{font-size:15px}
 .trust-grid,.cards,.band-grid,.value-grid,.fields,.check-list{grid-template-columns:1fr}
 .trust,.value{border-right:0;border-top:1px solid var(--line)}.trust:first-child,.value:first-child{border-top:0}
 .section{padding:52px 0}.section-head h2,.split h2{font-size:29px}.split img{height:250px}
 .footer-grid{grid-template-columns:1fr}.copyright{flex-direction:column;gap:8px}
}

.language-switcher{
  appearance:auto;
  background:#061b36;
  color:#fff;
  border:1px solid rgba(255,255,255,.22);
  border-radius:4px;
  padding:9px 9px;
  font:inherit;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
  outline:none;
}
.language-switcher:hover,.language-switcher:focus{border-color:#4f8eff}
.language-switcher option{background:#061b36;color:#fff}

/* =========================================================
   Draft 2.0 — uniform list layouts across EN / NL / EL
   Keeps list content aligned even when translations are longer.
   ========================================================= */

/* Hero check list: fixed icon column + flexible text column. */
.checks{
  display:grid;
  gap:10px;
  margin-top:24px;
}
.check{
  display:grid;
  grid-template-columns:20px minmax(0,1fr);
  gap:10px;
  align-items:start;
  font-weight:700;
  font-size:14px;
  line-height:1.4;
}
.check i{
  margin-top:1px;
  flex:none;
}

/* Checkbox lists in the application form: equal, tidy cells. */
.check-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 14px;
  align-items:stretch;
}
.check-label{
  display:grid;
  grid-template-columns:18px minmax(0,1fr);
  gap:9px;
  align-items:start;
  min-height:40px;
  padding:9px 10px;
  border:1px solid #e3e9f1;
  border-radius:5px;
  background:#fbfcfe;
  color:#33455c;
  font-size:13px;
  font-weight:700;
  line-height:1.35;
}
.check-label input{
  width:15px;
  height:15px;
  margin:1px 0 0;
  padding:0;
  accent-color:#1764d5;
}

/* Radio-option groups use the same aligned structure as checkbox lists. */
.radio-row{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:10px 14px;
  width:100%;
}
.radio-label{
  display:grid;
  grid-template-columns:18px minmax(0,1fr);
  gap:8px;
  align-items:start;
  min-height:40px;
  padding:9px 10px;
  border:1px solid #e3e9f1;
  border-radius:5px;
  background:#fbfcfe;
  color:#33455c;
  font-size:13px;
  font-weight:700;
  line-height:1.35;
}
.radio-label input{
  width:15px;
  height:15px;
  margin:1px 0 0;
  padding:0;
  accent-color:#1764d5;
}

/* Partnership sidebar: every description starts on the same vertical line. */
.side-list{
  display:grid;
  gap:0;
  margin-top:24px;
}
.side-list div{
  display:grid;
  grid-template-columns:minmax(135px,42%) minmax(0,1fr);
  gap:14px;
  align-items:start;
  padding:13px 0;
  border-bottom:1px solid rgba(255,255,255,.10);
}
.side-list div:first-child{padding-top:0}
.side-list div:last-child{
  padding-bottom:0;
  border-bottom:0;
}
.side-list b{
  display:block;
  min-width:0;
  font-size:13px;
  line-height:1.35;
}
.side-list span{
  display:block;
  min-width:0;
  font-size:12px;
  color:#b9c7d9;
  line-height:1.45;
}

/* Footer lists also keep consistent spacing regardless of language length. */
.footer-links,
.footer-contact{
  display:grid;
  align-content:start;
}
.footer-links{gap:9px}
.footer-contact{gap:10px}
.footer-links a,
.footer-contact span{
  display:block;
  min-width:0;
  line-height:1.45;
}

@media(max-width:650px){
  .check-list,
  .radio-row{
    grid-template-columns:1fr;
  }
  .side-list div{
    grid-template-columns:1fr;
    gap:4px;
  }
  .side-list b,
  .side-list span{
    width:100%;
  }
}


/* =========================================================
   Draft 2.1 — useful Contact page + real service detail areas
   ========================================================= */
.service-overview-cards .card{transition:transform .18s ease,box-shadow .18s ease}
.service-overview-cards .card:hover{transform:translateY(-4px);box-shadow:0 18px 42px rgba(3,21,45,.16)}
.service-details-section{background:#fff;padding-top:68px}
.service-detail{scroll-margin-top:105px;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:46px;align-items:center;padding:46px 0;border-bottom:1px solid var(--line)}
.service-detail:first-of-type{padding-top:10px}
.service-detail:last-child{border-bottom:0;padding-bottom:0}
.service-detail.reverse img{order:2}
.service-detail.reverse .service-detail-copy{order:1}
.service-detail img{width:100%;height:330px;object-fit:cover;border-radius:8px;box-shadow:var(--shadow)}
.service-detail-copy .kicker{color:#1464d8}
.service-detail-copy h2{font-size:30px;line-height:1.15;margin:7px 0 12px}
.service-detail-copy>p{color:var(--muted);margin:0 0 20px}
.detail-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.detail-list li{display:grid;grid-template-columns:26px minmax(0,1fr);gap:12px;align-items:start;padding:12px 0;border-top:1px solid #edf1f6}
.detail-list li>span{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#eaf2ff;color:#1263dc;font-size:12px;font-weight:900}
.detail-list strong{display:block;font-size:14px;margin-bottom:2px}
.detail-list p{margin:0;color:var(--muted);font-size:13px;line-height:1.45}

.contact-hero .hero-content{max-width:650px}
.contact-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.contact-card{background:#fff;border:1px solid #e4eaf2;border-radius:8px;padding:25px;box-shadow:var(--shadow);transition:transform .18s ease,border-color .18s ease}
.contact-card:hover{transform:translateY(-4px);border-color:#a9c9f8}
.contact-card-icon{width:44px;height:44px;border-radius:10px;background:#eaf2ff;color:#1263dc;display:grid;place-items:center;font-size:22px;margin-bottom:16px}
.contact-card h3{margin:0 0 6px;font-size:19px}
.contact-card p{margin:0 0 14px;color:var(--muted);font-size:13px;min-height:42px}
.contact-card span{font-size:12px;font-weight:900;color:#0b59c8}
.quote-panel,.partner-contact-panel{display:flex;align-items:center;justify-content:space-between;gap:32px;border-radius:8px;padding:34px 38px}
.quote-panel{background:linear-gradient(110deg,#061d3b,#0b3b82);color:#fff}
.quote-panel .kicker{color:#89b6ff}.quote-panel h2{font-size:30px;margin:6px 0 8px}.quote-panel p{max-width:760px;margin:0;color:#d8e4f6}
.partner-contact-panel{background:#fff;border:1px solid #e2e8f0;box-shadow:var(--shadow)}
.partner-contact-panel .kicker{color:#1464d8}.partner-contact-panel h3{font-size:23px;margin:5px 0 7px}.partner-contact-panel p{margin:0;color:var(--muted);max-width:760px}

@media(max-width:900px){
 .service-detail,.service-detail.reverse{grid-template-columns:1fr;gap:25px}
 .service-detail.reverse img,.service-detail.reverse .service-detail-copy{order:initial}
 .service-detail img{height:290px}
 .contact-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
 .quote-panel,.partner-contact-panel{align-items:flex-start;flex-direction:column}
}
@media(max-width:650px){
 .service-detail{padding:36px 0}.service-detail img{height:220px}.service-detail-copy h2{font-size:26px}
 .contact-cards{grid-template-columns:1fr}.contact-card p{min-height:auto}
 .quote-panel,.partner-contact-panel{padding:26px 22px}.quote-panel h2{font-size:26px}
}


/* Draft 2.2 — direct website contact form */
#contact-form{scroll-margin-top:95px}
.contact-form-layout{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:48px;align-items:start}
.contact-form-layout>.kicker,.contact-form-layout>div>.kicker{color:#1464d8}
.contact-form-layout h2{font-size:32px;line-height:1.15;margin:7px 0 12px}
.contact-form-intro{color:var(--muted);max-width:520px;margin:0}
.contact-form-card{box-shadow:var(--shadow)}
@media(max-width:900px){.contact-form-layout{grid-template-columns:1fr;gap:25px}}

/* =========================================================
   Draft 3.0 — functional responsive mobile navigation
   ========================================================= */
.nav{position:relative}
.mobile-btn{
  width:44px;
  height:44px;
  padding:0;
  border:1px solid transparent;
  border-radius:6px;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  line-height:1;
  transition:background .16s ease,border-color .16s ease;
}
.mobile-btn:hover,.mobile-btn:focus-visible{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.18);
  outline:none;
}
.mobile-btn span{font-size:29px;line-height:1;display:block;transform:translateY(-1px)}

@media(max-width:820px){
  .topbar{height:68px}
  .nav{gap:12px}
  .logo{width:160px;height:45px}
  .mobile-btn{display:flex;flex:none}

  .menu{
    display:none;
    position:absolute;
    top:calc(100% + 11px);
    left:0;
    right:0;
    z-index:100;
    flex-direction:column;
    align-items:stretch;
    gap:3px;
    padding:10px;
    max-height:calc(100vh - 92px);
    overflow-y:auto;
    overscroll-behavior:contain;
    background:#041831;
    border:1px solid rgba(255,255,255,.12);
    border-radius:8px;
    box-shadow:0 18px 45px rgba(0,0,0,.36);
  }
  .menu.mobile-open{display:flex}

  .menu>a{
    display:block;
    width:100%;
    padding:12px 14px;
    border-radius:5px;
    color:#fff;
    font-size:14px;
    line-height:1.25;
    opacity:.95;
  }
  .menu>a:hover,.menu>a:focus-visible,.menu>a.active{
    background:rgba(56,121,230,.15);
    color:#74a7ff;
    outline:none;
  }
  .menu a.active:after{display:none}

  .menu .language-switcher{
    width:100%;
    min-height:44px;
    margin:3px 0;
    padding:10px 12px;
    border-color:rgba(255,255,255,.18);
    background:#071f3f;
    font-size:14px;
  }
  .menu .cta{
    margin-top:3px;
    padding:13px 14px;
    text-align:center;
    background:var(--blue);
    color:#fff;
  }
  .menu .cta:hover,.menu .cta:focus-visible{
    background:var(--blue2);
    color:#fff;
  }

  body.mobile-menu-open{overflow:hidden}
}

@media(max-width:420px){
  .container{width:min(94%,1180px)}
  .logo{width:145px;height:43px}
  .mobile-btn{width:42px;height:42px}
}