
:root{
  --header:#0E2A47; --header-text:#ffffff; --footer:#0B1220; --bg:#fff; --surface:#fff; --text:#0B1328; --muted:#5B6478;
  --accent:#F59E0B; --glass:rgba(0,0,0,.07); --max:1200px; --shadow:0 12px 30px rgba(0,0,0,.12)
}
*{box-sizing:border-box}
html,body{margin:0}
body{font:16px/1.6 ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Arial;color:var(--text);background:var(--bg)}
img{max-width:100%;display:block}
.container{max-width:var(--max);margin:0 auto;padding:0 16px}
a{text-decoration:none}

.topbar{background:var(--header);color:var(--header-text);font-size:14px}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0}
.topbar .tel{color:#FFD599;font-weight:800}

.header{position:sticky;top:0;z-index:50;background:var(--surface);border-bottom:1px solid var(--glass);transition:box-shadow .2s ease}
.header.scrolled{box-shadow:0 6px 18px rgba(0,0,0,.08)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0}
.logo{display:flex;align-items:baseline;gap:6px;font-weight:900;letter-spacing:.4px}
.brand-strong{color:var(--header);font-size:22px}
.brand-light{color:#111;font-size:22px}
.nav-desktop ul{display:flex;gap:18px;list-style:none;margin:0;padding:0}
.nav-desktop a{color:#111;padding:8px 10px;border-radius:10px;font-weight:700}
.nav-desktop a:hover{background:var(--glass)}
.nav-desktop a.active{ box-shadow: inset 0 -2px 0 var(--accent); color:var(--header) }
.nav-toggle{display:none;border:0;background:transparent;padding:8px;cursor:pointer}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--header);margin:4px 0;border-radius:2px}

.backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);z-index:49;transition:opacity .3s ease;opacity:1}
.backdrop[hidden]{opacity:0;visibility:hidden}
.drawer{position:fixed;top:0;right:0;height:100%;width:300px;background:linear-gradient(180deg, rgba(14,42,71,0.98), rgba(14,42,71,0.94));border-left:1px solid rgba(255,255,255,.08);transform:translateX(100%);transition:transform .35s ease;z-index:50;padding:22px 16px;outline:0}
.drawer.open{transform:translateX(0)}
.drawer .drawer-close.pretty{position:absolute;top:12px;right:12px;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.18);border-radius:999px;padding:6px;cursor:pointer;transition:transform .15s ease, background .2s ease}
.drawer .drawer-close.pretty:hover{transform:scale(1.05);background:rgba(255,255,255,0.15)}
.drawer ul{display:flex;flex-direction:column;gap:10px;margin:32px 0 0;padding:0;list-style:none}
.drawer a{display:block;padding:12px 10px;border-radius:10px;color:#fff;font-weight:700;transition:background .2s ease, transform .15s ease}
.drawer a:hover{background:rgba(255,255,255,.08);color:var(--accent);transform:translateX(2px)}
.drawer a.active{ color: var(--accent); background: rgba(245,158,11,.12) }
.drawer .drawer-call .btn.call.solid{ display:block; text-align:center; background: var(--accent); color:#111; font-weight:800; border-radius:12px; padding:12px 14px; margin-bottom:8px; }
.menu-logo-text{ text-align:center;padding:18px 0 10px;border-bottom:1px solid rgba(255,255,255,0.1);margin-bottom:10px }
.menu-logo-text span{ font-size:20px;font-weight:800;color:var(--accent);text-transform:uppercase;letter-spacing:1px;text-shadow:0 1px 2px rgba(0,0,0,.4) }

.hero{padding:16px 0}
.slider{position:relative;border-radius:16px;overflow:hidden;box-shadow:var(--shadow)}
.slider::before{content:'';display:block;aspect-ratio:16/6}
.track{display:flex;position:absolute;inset:0;transition:transform .6s cubic-bezier(.2,.6,.2,1)}
.slide{flex:0 0 100%;position:relative;margin:0}
.slide img{width:100%;height:100%;object-fit:cover}
.slide figcaption{position:absolute;left:16px;bottom:16px;background:rgba(0,0,0,.5);color:#fff;padding:6px 10px;border-radius:8px;font-size:14px}
.ctrl{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.5);color:#fff;border:0;border-radius:10px;padding:8px 12px;cursor:pointer}
.prev{left:12px}.next{right:12px}
.dots{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);display:flex;gap:6px}
.dots button{width:10px;height:10px;border-radius:50%;border:0;background:rgba(255,255,255,.6);cursor:pointer}
.dots button[aria-selected='true']{background:#fff}

.section{padding:32px 0}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.cards .card{border:1px solid var(--glass);border-radius:14px;padding:16px;background:linear-gradient(180deg,#fff,#f8fafc);box-shadow:var(--shadow)}

.vehicles .vehicle{border:1px solid var(--glass);border-radius:14px;padding:12px;background:#fff;box-shadow:var(--shadow)}
.vehicles img{width:100%;height:200px;object-fit:cover;border-radius:10px}
.specs{margin:8px 0 0 0;padding-left:16px}
.specs li{margin:4px 0;color:#334155}

.posts.cards .postcard .cover{ display:block }
.posts.cards .postcard .cover img{ width:100%; height:220px; object-fit:cover; display:block; border-radius:10px }

.post .poster{width:100%;max-width:100%;height:auto;border-radius:10px;margin:10px 0}
.post .poster.slim{max-height:360px;object-fit:cover}
.meta{color:#667085;font-size:14px}

.footer{margin-top:28px;background:var(--footer);color:#cbd5e1;border-top:1px solid rgba(255,255,255,.06)}
.foot-flex{display:flex;align-items:center;justify-content:space-between;padding:18px 0}
.footer a.tel{color:#fff;font-weight:800}

.breadcrumbs{ margin:8px 0 16px; font-size:14px; color:#64748b; border-bottom:1px dashed #e2e8f0; padding-bottom:8px }
.breadcrumbs a{ color:#0A3D91 } .breadcrumbs a:hover{ text-decoration:underline }
.breadcrumbs .sep{ margin:0 6px; color:#94a3b8 }

.btn{ background: var(--accent); color:#111; font-weight:800; border:none; padding:10px 18px; border-radius:10px; cursor:pointer }

@media (max-width: 980px){
  .nav-desktop{display:none}
  .nav-toggle{display:block}
}
@media (max-width: 600px){
  .slider::before{display:none}
  .track{position:relative}
  .slide img{width:100%;height:auto;object-fit:contain;background:none}
  .container{ padding-left:22px; padding-right:22px; }
  .header-inner{ min-height:64px; }
  .logo{ padding-left:10px; }
}
@media (max-width: 380px){
  .container{ padding-left:18px; padding-right:18px; }
  .logo{ padding-left:8px; }
}


/* --- Contact layout tweaks --- */
.contact-cards.two-col{
  display:grid;
  grid-template-columns:repeat(3,minmax(220px,1fr));
  gap:16px;
  align-items:stretch;
}
.contact-card{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--glass);border-radius:14px;padding:14px;background:linear-gradient(180deg,#fff,#f8fafc)}
.cc-icon{flex:0 0 auto;color:var(--header)}
.cc-body h3{margin:0 0 6px 0}
.cc-body p{margin:0}

/* --- Regions (inline chips, not stacked) --- */
.regions-wrap{margin-top:24px;border:1px dashed #e2e8f0;border-radius:14px;padding:16px;background:#fff}
.regions-head{display:flex;align-items:baseline;gap:10px;margin-bottom:10px}
.regions{display:flex;flex-wrap:wrap;gap:10px}
.chip{padding:8px 12px;border-radius:999px;background:#0E2A47; color:#fff; font-weight:700; box-shadow:0 2px 6px rgba(14,42,71,.18)}
.chip:nth-child(odd){background:#13375F}
.muted{color:#64748b}

@media (max-width: 900px){
  .contact-cards.two-col{ grid-template-columns:repeat(2,minmax(220px,1fr)); }
}
@media (max-width: 600px){
  .contact-cards.two-col{ grid-template-columns:1fr; }
}


/* === v4-like contact layout === */
.pagehead.compact{ margin-bottom:12px }
.contact-wrap{
  display:grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap:18px;
}
.panel{
  background:#fff;
  border:1px solid var(--glass);
  border-radius:14px;
  padding:16px;
  box-shadow: var(--shadow);
}
.contact-panel .row{ display:flex; align-items:flex-start; gap:12px; padding:10px 0; border-bottom:1px dashed #e5e7eb; }
.contact-panel .row:last-child{ border-bottom:0 }
.contact-panel .badge{
  width:38px; height:38px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background: #0E2A47; color:#fff; box-shadow: 0 2px 6px rgba(14,42,71,.18);
}
.contact-panel h3{ margin:0 0 6px 0 }
.contact-panel p{ margin:0 }

.regions-panel .regions-head.tight{ margin:0 0 10px 0 }
.regions.chips{ display:flex; flex-wrap:wrap; gap:10px }
.regions .chip{
  display:inline-block; padding:8px 12px; border-radius:999px; background:#13375F; color:#fff; font-weight:700;
  box-shadow:0 2px 6px rgba(14,42,71,.18)
}
.regions .chip:nth-child(even){ background:#0E2A47 }

@media (max-width: 900px){
  .contact-wrap{ grid-template-columns: 1fr; }
}


/* === v4 desktop alignment tweaks === */
@media (min-width: 1024px){
  .contact-wrap{ grid-template-columns: 1fr 1fr; gap:20px; }
  .panel{ padding:18px; border:1px solid rgba(15,23,42,.08); box-shadow:0 8px 22px rgba(0,0,0,.10); }
  .contact-panel .row{ padding:8px 0; border-bottom:1px dashed rgba(15,23,42,.12); }
  .contact-panel .badge{ width:42px; height:42px; border-radius:14px; }
  .regions-panel .regions-head.tight{ margin-bottom:12px }
  .regions .chip{ padding:9px 14px; }
}


/* --- Home Pro Sections --- */
.info-strip{ background: #0E2A47; color:#fff; }
.strip-inner{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0; }
.strip-item{ opacity:.95; }
.strip-inner .btn.call{ background:#F59E0B; color:#111; border-radius:10px; padding:10px 14px; font-weight:800 }

.intro .sec-head{ text-align:center }

.service-cards.six{ grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.service-card{ border:1px solid var(--glass); border-radius:14px; padding:16px; background:linear-gradient(180deg,#fff,#f8fafc); box-shadow: var(--shadow); transition: transform .15s ease, box-shadow .2s ease }
.service-card:hover{ transform: translateY(-2px); box-shadow:0 14px 30px rgba(0,0,0,.12) }
.service-card .s-ico{ color:#0E2A47; margin-bottom:8px }
.service-card .lnk{ font-weight:800; color:#0E2A47 }

.about-split .about-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:18px; align-items:center }
.about-split .ticks{ margin:10px 0 0 0; padding-left:18px }
.about-split .ticks li{ list-style:'✓ '; margin:6px 0; color:#334155 }
.about-visual img{ border-radius:14px; box-shadow: var(--shadow) }

.refs .ref-logos{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; align-items:center; }
.refs .ref-logos img{ width:100%; height:64px; object-fit:contain; filter:grayscale(100%); opacity:.9 }

.map-static .map-box{ border:1px solid var(--glass); border-radius:14px; padding:12px; background:#fff; display:grid; grid-template-columns:1fr 1fr; gap:12px; align-items:center }
.map-static .map-box img{ width:100%; border-radius:10px }
.map-static .map-tags{ margin:0; padding-left:18px }
.map-static .map-tags li{ margin:6px 0 }

.testimonials .testi-card{ border:1px solid var(--glass); border-radius:14px; padding:14px; background:#fff; box-shadow:var(--shadow) }
.testimonials .testi-card cite{ display:block; margin-top:8px; color:#667085 }

.faq .faq-list details{ border:1px solid var(--glass); border-radius:10px; padding:10px 12px; margin-bottom:10px; background:#fff }
.faq .faq-list summary{ cursor:pointer; font-weight:800; color:#0E2A47 }
.faq .faq-list .ans{ margin-top:8px; color:#334155 }

@media (max-width: 980px){
  .strip-inner{ flex-wrap:wrap; }
  .about-split .about-grid{ grid-template-columns:1fr; }
  .map-static .map-box{ grid-template-columns:1fr; }
}
