:root{
  --navy:#0a3a8a; --navy-d:#08306f; --band:#0d4a8c; --orange:#f26a0f; --orange-d:#d85a05;
  --ink:#10213f; --muted:#5b6b86; --line:#e3eaf4; --bg:#f4f8fc; --white:#fff;
  --radius:14px; --shadow:0 8px 28px rgba(10,58,138,.10);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Poppins',system-ui,sans-serif;color:var(--ink);background:#fff;line-height:1.55;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;height:82px;gap:20px}
.brand img{height:62px;width:auto}
.nav{display:flex;align-items:center;gap:30px}
.nav a.link{font-size:14px;font-weight:500;color:var(--navy-d);padding:6px 0;border-bottom:2px solid transparent}
.nav a.link:hover,.nav a.link.active{border-color:var(--orange)}
.nav-actions{display:flex;gap:12px;align-items:center}
.burger{display:none;background:none;border:0;font-size:26px;color:var(--navy);cursor:pointer}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 14px 'Poppins',sans-serif;border-radius:10px;padding:11px 22px;border:2px solid transparent;cursor:pointer;transition:.18s}
.btn-orange{background:var(--orange);color:#fff;box-shadow:0 4px 0 var(--orange-d)}
.btn-orange:hover{transform:translateY(-1px);background:#ff7418}
.btn-outline{border-color:var(--navy);color:var(--navy);background:#fff}
.btn-outline:hover{background:var(--navy);color:#fff}
.btn-navy{background:var(--navy);color:#fff}
.btn-navy:hover{background:var(--navy-d)}
.btn-sm{padding:7px 14px;font-size:13px;border-radius:8px}
.btn-danger{background:#fff;border-color:#e8b4b4;color:#b42318}

/* hero */
.hero{position:relative;min-height:456px;background:#cfe6ff url(hero.jpg) center right/cover no-repeat;display:flex;align-items:center;padding:36px 0 76px}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.78) 40%,rgba(255,255,255,0) 66%)}
.hero .wrap{position:relative;width:100%}
.eyebrow{font-size:12.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--navy);font-weight:500;margin-bottom:16px}
.hero h1{font-size:clamp(40px,5.2vw,58px);line-height:1.08;color:var(--ink);font-weight:700;letter-spacing:-.02em;max-width:520px}
.hero p.lead{margin:20px 0 26px;max-width:430px;font-size:16.5px;color:#1a2b4a}
.track-box{display:flex;gap:12px;background:#fff;border-radius:16px;padding:14px;max-width:560px;box-shadow:0 14px 40px rgba(10,58,138,.18)}
.input-icon{flex:1;display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:0 14px;background:#f8fbff}
.input-icon input{flex:1;border:0;background:none;font:400 14px 'Poppins',sans-serif;height:46px;outline:none;min-width:0}
.badges{display:flex;gap:30px;margin-top:22px;flex-wrap:wrap}
.badges span{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:500;color:var(--navy-d)}
.ico{width:22px;height:22px;stroke:var(--navy);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* partners */
.partners{background:linear-gradient(#f6f9fd,#eef4fb);padding:30px 0}
.partners .wrap{text-align:center}
.partners small{display:block;letter-spacing:.3em;font-size:12px;color:var(--navy-d);font-weight:500;margin-bottom:14px}
.partner-row{display:flex;justify-content:center;align-items:center;gap:44px;flex-wrap:wrap}
.partner-row .p{font-size:34px;font-weight:800;letter-spacing:-.02em;color:#3b4a66}
.partner-row .div{width:1px;height:48px;background:#c8d3e4}
.partner-row .note{max-width:200px;text-align:left;font-size:14px;color:#33415e}

/* sections */
section.sec{padding:74px 0}
.sec-head{text-align:center;max-width:640px;margin:0 auto 42px}
.sec-head .eyebrow{margin-bottom:8px}
.sec-head h2{font-size:clamp(28px,3.4vw,38px);color:var(--navy-d);line-height:1.2}
.sec-head p{color:var(--muted);margin-top:12px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column}
.card .img{height:136px;background-size:cover;background-position:center}
.card .ic{width:54px;height:54px;border-radius:50%;background:#fff;box-shadow:0 3px 10px rgba(10,58,138,.15);margin:-27px 0 0 20px;display:grid;place-items:center;position:relative}
.card .body{padding:12px 20px 22px;display:flex;flex-direction:column;flex:1}
.card h3{color:var(--navy);font-size:19px;margin-bottom:6px}
.card p{font-size:14px;color:var(--muted);flex:1}
.card .more{margin-top:14px;font-weight:600;font-size:14px;color:var(--navy);display:inline-flex;gap:6px;align-items:center}
.card .more:hover{color:var(--orange)}

/* trust band */
.band{background:linear-gradient(rgba(13,74,140,.94),rgba(13,74,140,.94)),url(hero.jpg) center/cover;color:#fff;padding:54px 0}
.band .wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center}
.band .eyebrow{color:#cfe0f7}
.band h2{font-size:clamp(30px,3.6vw,40px);line-height:1.15}
.band p{color:#dbe7f8;margin-top:10px;max-width:420px;font-size:15px}
.feat{display:grid;grid-template-columns:1fr 1fr;gap:26px 30px}
.feat div{display:flex;gap:14px;align-items:center;font-weight:500;font-size:14px}
.feat .ico{stroke:#fff;width:34px;height:34px}

/* cta + footer */
.cta-strip{background:#fff;border-top:1px solid var(--line)}
.cta-strip .wrap{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:30px;padding-top:26px;padding-bottom:26px;align-items:center}
.cta-strip h4{font-size:17px;color:var(--navy-d)}
.cta-strip p{font-size:13px;color:var(--muted);margin-bottom:10px}
.cta-strip .col+.col{border-left:1px solid var(--line);padding-left:30px}
.contact-list{list-style:none;display:grid;gap:8px;font-size:13.5px}
.contact-list li{display:flex;align-items:center;gap:10px}
.contact-list .ico{stroke:var(--navy);width:18px;height:18px}
.footer-bar{background:var(--navy-d);color:#cfe0f7;font-size:12.5px}
.footer-bar .wrap{display:flex;justify-content:space-between;align-items:center;height:52px;gap:20px}
.socials{display:flex;gap:16px}
.socials a{color:#fff;font-weight:700;font-size:13px;opacity:.9}
.socials a:hover{color:var(--orange)}

/* inner pages */
.page-hero{background:linear-gradient(110deg,var(--navy-d),var(--band));color:#fff;padding:58px 0 52px}
.page-hero h1{font-size:clamp(30px,4vw,44px);line-height:1.15}
.page-hero p{color:#d6e4f8;max-width:560px;margin-top:10px}
.prose p{margin-bottom:14px;color:#33415e}
.prose h2{color:var(--navy-d);margin:6px 0 14px;font-size:28px}
.stat{background:var(--bg);border-radius:var(--radius);padding:22px;text-align:center}
.stat b{display:block;font-size:30px;color:var(--navy)}
.stat span{font-size:13px;color:var(--muted)}
.svc-detail{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;padding:34px 0}
.svc-detail:nth-child(even) .pic{order:2}
.svc-detail .pic{height:300px;border-radius:var(--radius);background-size:cover;background-position:center;box-shadow:var(--shadow)}
.svc-detail ul{margin:12px 0 0 18px;color:#33415e;font-size:14.5px}
.svc-detail h3{font-size:26px;color:var(--navy-d);margin-bottom:8px}

/* forms */
.form{display:grid;gap:14px}
.form label{font-size:13px;font-weight:600;color:var(--navy-d);display:grid;gap:6px}
.form input,.form select,.form textarea{font:400 14px 'Poppins',sans-serif;border:1px solid #cfdaea;border-radius:10px;padding:11px 14px;background:#fff;outline:none;width:100%}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--navy);box-shadow:0 0 0 3px rgba(10,58,138,.12)}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px}

/* tracking page */
.track-top{background:var(--bg);padding:34px 0;border-bottom:1px solid var(--line)}
.track-top .track-box{max-width:680px;margin:0 auto;box-shadow:var(--shadow)}
.result{padding:34px 0 70px}
.result-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap;margin-bottom:22px}
.result-head h2{font-size:26px;color:var(--navy-d)}
.status-pill{display:inline-block;padding:5px 14px;border-radius:99px;font-size:13px;font-weight:600;background:#e4efff;color:var(--navy)}
.status-pill.Delivered{background:#dcf6e6;color:#0b7a3b}
.status-pill.Delayed,.status-pill.Exception{background:#fde7e7;color:#b42318}
.status-pill.In-Transit,.status-pill.Out-for-Delivery{background:#fff0e0;color:#b45309}
.result-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:24px}
#map{height:430px;border-radius:var(--radius);border:1px solid var(--line);box-shadow:var(--shadow);z-index:1}
.live{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:#0b7a3b}
.live i{width:9px;height:9px;border-radius:50%;background:#18b255;animation:pulse 1.6s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(24,178,85,.6)}100%{box-shadow:0 0 0 12px rgba(24,178,85,0)}}
.kv{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:6px}
.kv div{background:var(--bg);border-radius:10px;padding:11px 14px}
.kv small{display:block;font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.kv b{font-size:14px;color:var(--ink);font-weight:600}
.timeline{list-style:none;margin-top:18px;border-left:2px solid var(--line);padding-left:20px}
.timeline li{position:relative;padding:0 0 18px}
.timeline li::before{content:"";position:absolute;left:-27px;top:5px;width:12px;height:12px;border-radius:50%;background:#fff;border:3px solid var(--navy)}
.timeline li:first-child::before{background:var(--orange);border-color:var(--orange)}
.timeline b{display:block;font-size:14px}
.timeline span{font-size:12.5px;color:var(--muted)}
.notice{padding:16px 20px;border-radius:12px;background:#fff6ec;border:1px solid #ffd9b0;color:#7a3b00;font-size:14px;margin-top:16px}
.hidden{display:none!important}
.pulse-marker{width:18px;height:18px;border-radius:50%;background:var(--orange);border:3px solid #fff;box-shadow:0 0 0 0 rgba(242,106,15,.7);animation:mp 1.6s infinite}
@keyframes mp{0%{box-shadow:0 0 0 0 rgba(242,106,15,.7)}100%{box-shadow:0 0 0 18px rgba(242,106,15,0)}}

/* admin */
.admin-body{background:var(--bg);min-height:100vh}
.admin-bar{background:var(--navy-d);color:#fff}
.admin-bar .wrap{display:flex;align-items:center;justify-content:space-between;height:64px;gap:16px}
.admin-bar img{height:44px;background:#fff;border-radius:8px;padding:3px 8px}
.admin-main{padding:30px 0 70px}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}
.kpi{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px}
.kpi b{font-size:28px;color:var(--navy);display:block}
.kpi span{font-size:12.5px;color:var(--muted)}
.tabs{display:flex;gap:8px;margin-bottom:18px;flex-wrap:wrap}
.tab{padding:9px 18px;border-radius:99px;background:#fff;border:1px solid var(--line);font:600 13px 'Poppins',sans-serif;cursor:pointer;color:var(--navy-d)}
.tab.on{background:var(--navy);color:#fff;border-color:var(--navy)}
table.t{width:100%;border-collapse:collapse;font-size:13.5px;background:#fff}
table.t th{text-align:left;font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:12px 14px;border-bottom:1px solid var(--line);background:#fafcff}
table.t td{padding:12px 14px;border-bottom:1px solid #eef2f8;vertical-align:middle}
.tbl-wrap{overflow:auto;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
.actions{display:flex;gap:6px;flex-wrap:wrap}
.toast{position:fixed;bottom:24px;right:24px;background:var(--ink);color:#fff;padding:13px 20px;border-radius:10px;font-size:14px;z-index:999;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.modal-bg{position:fixed;inset:0;background:rgba(10,25,50,.55);display:grid;place-items:center;z-index:200;padding:20px}
.modal{background:#fff;border-radius:16px;max-width:760px;width:100%;max-height:92vh;overflow:auto;padding:28px}
.modal h3{color:var(--navy-d);margin-bottom:16px}
.help{font-size:12.5px;color:var(--muted)}
.login-wrap{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,var(--navy-d),var(--band));padding:20px}
.login-card{background:#fff;border-radius:18px;padding:34px;width:100%;max-width:420px;box-shadow:0 30px 70px rgba(0,0,0,.3)}
.login-card img{height:70px;margin:0 auto 18px}

@media(max-width:980px){
  .grid4{grid-template-columns:1fr 1fr}.grid3{grid-template-columns:1fr 1fr}
  .band .wrap,.result-grid,.svc-detail,.grid2{grid-template-columns:1fr}
  .svc-detail:nth-child(even) .pic{order:0}
  .cta-strip .wrap{grid-template-columns:1fr}.cta-strip .col+.col{border-left:0;padding-left:0}
  .kpis{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .burger{display:block}
  .nav{position:absolute;top:82px;left:0;right:0;background:#fff;flex-direction:column;align-items:flex-start;padding:18px 24px;gap:14px;border-bottom:1px solid var(--line);display:none}
  .nav.open{display:flex}
  .nav-actions{display:none}
  .hero::before{background:rgba(255,255,255,.78)}
  .track-box{flex-direction:column}
  .grid4,.grid3{grid-template-columns:1fr}
  .form .row,.kv{grid-template-columns:1fr}
  .partner-row .div{display:none}
}
