:root{
  --navy:#0c3d70;
  --deep:#062d56;
  --blue:#1b83c6;
  --blue2:#2395d0;
  --green:#54ae43;
  --green-dark:#237a31;
  --ink:#16344f;
  --muted:#667786;
  --line:#dfe7ec;
  --pale:#f5f8fa;
  --shadow:0 10px 30px rgba(12,61,112,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#fff;line-height:1.5}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(1380px,calc(100% - 80px));margin:auto}
.site-header{height:100px;background:#fff;border-bottom:1px solid #e4e9ec;display:flex;align-items:center;position:sticky;top:0;z-index:30}
.nav-wrap{display:grid;grid-template-columns:320px 1fr auto;gap:34px;align-items:center}
.brand{display:flex;align-items:center}
.brand-logo{width:295px;height:auto}
.nav{display:flex;align-items:center;justify-content:center;gap:35px;font-size:13px;font-weight:700;text-transform:uppercase}
.nav a{padding:38px 0 34px;position:relative;white-space:nowrap}
.nav a:hover,.nav a.active{color:var(--navy)}
.nav a.active:after{content:"";height:3px;background:var(--blue);position:absolute;left:0;right:0;bottom:25px}
.header-actions{display:flex;align-items:center;gap:24px}
.phone-top{display:flex;align-items:center;gap:10px;color:var(--navy);font-size:21px}
.phone-top strong{display:flex;flex-direction:column;font-size:15px;line-height:1.1}
.phone-top small{font-size:12px;font-weight:500;margin-top:4px;color:#111}
.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:5px;padding:14px 24px;font-weight:800;text-transform:uppercase;font-size:14px;cursor:pointer}
.btn-small{padding:15px 22px}
.btn-green{background:var(--green);color:#fff}
.btn-blue{background:var(--blue);color:#fff}
.btn-navy{background:var(--navy);color:#fff}
.btn:hover{filter:brightness(.96);transform:translateY(-1px)}
.menu-toggle{display:none;border:0;background:none;font-size:26px}

.hero{display:grid;grid-template-columns:40% 60%;height:345px;background:var(--deep);overflow:hidden}
.hero-copy{background:
  radial-gradient(circle at 80% 30%,rgba(35,149,208,.28),transparent 34%),
  linear-gradient(120deg,#07345f 0%,#0c4377 100%);
  color:#fff;display:flex;align-items:center;position:relative;z-index:3}
.hero-copy:after{content:"";position:absolute;right:-85px;top:0;border-top:345px solid transparent;border-left:86px solid #0d477f;z-index:5}
.hero-copy-inner{padding-left:max(5vw,55px);position:relative;z-index:6;max-width:640px}
.hero h1{font-size:52px;line-height:1.08;margin:0 0 16px;letter-spacing:-1.5px}
.hero h1 span{color:var(--green)}
.hero p{font-size:19px;max-width:520px;margin:0 0 24px;color:#f0f6fb}
.hero-actions-main{display:flex;gap:24px}
.hero-button{display:flex;align-items:center;gap:16px;border-radius:7px;color:#fff;padding:14px 26px;min-width:220px;box-shadow:0 8px 20px rgba(0,0,0,.16)}
.hero-button.blue{background:linear-gradient(135deg,#248bc9,#116fb3)}
.hero-button.green{background:linear-gradient(135deg,#58b84a,#3d9d3c)}
.hero-button .button-icon{font-size:26px}
.hero-button span:last-child{display:flex;flex-direction:column}
.hero-button strong{text-transform:uppercase;font-size:16px}
.hero-button small{font-size:13px}
.hero-photos{display:grid;grid-template-columns:1fr 1fr;height:100%}
.hero-photo{background-size:cover;background-position:center}
.hospitality-photo{background-image:linear-gradient(90deg,rgba(7,52,95,.15),rgba(7,52,95,0)),url('assets/hero-hospitality.jpg')}
.warehouse-photo{background-image:url('assets/hero-warehouse.jpg');background-position:center}

.section{padding:28px 0 0}
.service-overview{background:#fff}
.service-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.service-tile{height:185px;border:1px solid var(--line);border-radius:10px;display:grid;grid-template-columns:60% 40%;overflow:hidden;box-shadow:0 4px 15px rgba(0,0,0,.05)}
.service-content{padding:27px 20px;display:grid;grid-template-columns:115px 1fr;gap:14px;align-items:center}
.service-icon{width:86px;height:86px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:35px;font-weight:700}
.hospitality-icon{background:var(--navy)}
.warehouse-icon{background:var(--green-dark)}
.service-tile h2{text-transform:uppercase;font-size:22px;line-height:1.15;margin:0 0 8px;color:var(--navy)}
.warehouse-tile h2{color:var(--green-dark)}
.service-tile p{font-size:14px;color:#566675;margin:0 0 11px}
.service-tile a{text-transform:uppercase;font-weight:800;font-size:13px;color:var(--blue)}
.warehouse-tile a{color:var(--green-dark)}
.service-image{background-size:cover;background-position:center}
.hospitality-image{background-image:linear-gradient(90deg,rgba(255,255,255,.08),transparent),url('assets/hospitality-service.jpg')}
.warehouse-image{background-image:url('assets/warehouse-service.jpg')}

.audience-panels{display:grid;grid-template-columns:1fr 1fr;margin-top:28px;border-top:1px solid #edf1f3}
.audience-panel{display:grid;grid-template-columns:120px 1fr 1fr;align-items:center;padding:34px 38px;min-height:185px}
.audience-panel+article{border-left:1px solid var(--line)}
.round-icon{width:82px;height:82px;border-radius:50%;background:#eef5fb;display:grid;place-items:center;font-size:36px;color:var(--navy)}
.green-round{background:#eff8ee;color:var(--green-dark)}
.audience-copy h2{text-transform:uppercase;color:var(--navy);margin:0 0 10px;font-size:22px}
.employer-panel h2{color:var(--green-dark)}
.audience-copy p{margin:0 0 18px;font-size:14px;color:#536676;max-width:440px}
.audience-panel ul{list-style:none;margin:0;padding:0 0 0 24px}
.audience-panel li{font-size:13px;margin:8px 0;position:relative}
.audience-panel li:before{content:"✓";color:var(--blue);position:absolute;left:-22px;font-weight:800}
.employer-panel li:before{color:var(--green)}

.detail-section{padding:74px 0}
.detail-section.alt{background:#f7faf8}
.detail-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:start}
.eyebrow{text-transform:uppercase;letter-spacing:.08em;font-weight:800;color:var(--blue);font-size:13px}
.green-text{color:var(--green-dark)}
.detail-grid h2,.form-intro h2,.about-grid h2{font-size:38px;line-height:1.12;margin:10px 0 16px;color:var(--navy)}
.detail-grid p,.form-intro p,.about-grid p{font-size:16px;color:var(--muted)}
.role-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.role-grid span{background:#f4f8fb;border-left:4px solid var(--blue);padding:14px 16px;border-radius:5px;font-weight:700;font-size:14px}
.green-grid span{border-left-color:var(--green);background:#f4faf3}

.form-section{background:#f5f8fa;padding:78px 0}
.employer-form-section{padding:78px 0}
.form-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:65px;align-items:start}
.form-layout.reverse{grid-template-columns:1.2fr .8fr}
.form-intro{position:sticky;top:125px}
.notice{margin-top:24px;background:#eaf5e7;border-left:4px solid var(--green);padding:16px 18px;border-radius:4px;font-size:14px;color:#36544b}
.form-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:32px;box-shadow:var(--shadow)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
label{display:block;font-size:13px;font-weight:700;color:#36536a;margin-bottom:16px}
input,select,textarea{width:100%;margin-top:7px;border:1px solid #cad7df;border-radius:6px;padding:12px 13px;font:inherit;color:var(--ink);background:#fff;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(27,131,198,.10)}
.optional{color:#8a98a4;font-weight:500}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:500;color:#506879}
.check input{width:auto;margin-top:5px}
.full{width:100%}
.form-note{font-size:11px;text-align:center;color:#8594a0;margin:14px 0 0}
.honeypot{position:absolute;left:-9999px}
.contact-mini{display:grid;gap:12px;margin-top:28px}
.contact-mini a{display:flex;flex-direction:column;border:1px solid var(--line);padding:15px;border-radius:8px}
.contact-mini b{color:var(--green-dark);font-size:11px;text-transform:uppercase;letter-spacing:.1em}
.contact-mini span{font-weight:700;margin-top:2px}
.about-section{padding:70px 0;background:#f8fafb}
.about-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:75px}

.contact-band{background:linear-gradient(90deg,#0c477d,#0d568f);color:#fff;padding:27px 0}
.contact-grid{display:grid;grid-template-columns:1fr 1.2fr 1.4fr 1fr;align-items:center}
.contact-grid>a,.contact-grid>div{display:flex;gap:16px;align-items:center;padding:0 28px;min-height:60px}
.contact-grid>*+*{border-left:1px solid rgba(255,255,255,.32)}
.contact-symbol{font-size:27px}
.contact-grid strong{text-transform:uppercase;font-size:12px;display:block;margin-bottom:3px}
.contact-grid small{display:block;font-size:12px;line-height:1.45}

footer{padding:19px 0;background:#fff;color:#687785;font-size:12px;border-top:1px solid #e5ebef}
.footer-grid{display:flex;justify-content:center;gap:50px}
.footer-grid span:last-child{color:var(--navy)}
.toast{position:fixed;z-index:50;right:20px;bottom:20px;max-width:430px;padding:16px 20px;border-radius:8px;color:#fff;box-shadow:0 12px 35px rgba(0,0,0,.2);animation:in .3s ease}
.toast.success{background:#337f38}
.toast.error{background:#9d3b3b}
@keyframes in{from{transform:translateY(20px);opacity:0}to{transform:none;opacity:1}}

@media(max-width:1180px){
  .container{width:min(100% - 40px,1180px)}
  .nav-wrap{grid-template-columns:260px 1fr auto;gap:18px}
  .brand-logo{width:245px}
  .nav{gap:20px;font-size:11px}
  .phone-top{display:none}
  .hero{grid-template-columns:48% 52%}
  .hero h1{font-size:44px}
}
@media(max-width:900px){
  .site-header{height:82px}
  .nav-wrap{grid-template-columns:1fr auto auto}
  .brand-logo{width:230px}
  .menu-toggle{display:block;order:3}
  .header-actions .btn{display:none}
  .nav{display:none;position:absolute;top:82px;left:0;right:0;background:#fff;padding:18px 24px;flex-direction:column;align-items:stretch;gap:0;border-bottom:1px solid var(--line);box-shadow:0 12px 25px rgba(0,0,0,.08)}
  .nav.open{display:flex}
  .nav a{padding:12px 0}
  .nav a.active:after{display:none}
  .hero{grid-template-columns:1fr;height:auto}
  .hero-copy{min-height:350px}
  .hero-copy:after{display:none}
  .hero-copy-inner{padding:60px 35px}
  .hero-photos{height:320px}
  .service-grid,.audience-panels,.detail-grid,.form-layout,.form-layout.reverse,.about-grid{grid-template-columns:1fr}
  .audience-panel+article{border-left:0;border-top:1px solid var(--line)}
  .form-intro{position:static}
  .contact-grid{grid-template-columns:1fr 1fr}
  .contact-grid>*+*{border-left:0}
  .contact-grid>a,.contact-grid>div{border-bottom:1px solid rgba(255,255,255,.2);padding:15px}
}
@media(max-width:620px){
  .container{width:min(100% - 28px,1180px)}
  .brand-logo{width:205px}
  .hero h1{font-size:39px}
  .hero p{font-size:17px}
  .hero-actions-main{flex-direction:column}
  .hero-button{width:100%}
  .hero-photos{grid-template-columns:1fr;height:300px}
  .warehouse-photo{display:none}
  .service-grid{gap:16px}
  .service-tile{height:auto;grid-template-columns:1fr}
  .service-content{grid-template-columns:80px 1fr;padding:22px}
  .service-icon{width:68px;height:68px}
  .service-image{height:150px}
  .audience-panel{grid-template-columns:80px 1fr;padding:28px 18px}
  .audience-panel ul{grid-column:2;margin-top:12px}
  .round-icon{width:62px;height:62px;font-size:28px}
  .role-grid,.field-row,.contact-grid{grid-template-columns:1fr}
  .detail-section,.form-section,.employer-form-section,.about-section{padding:58px 0}
  .detail-grid h2,.form-intro h2,.about-grid h2{font-size:32px}
  .form-card{padding:22px}
  .contact-grid>a,.contact-grid>div{padding:14px 4px}
  .footer-grid{flex-direction:column;gap:4px;text-align:center}
}