:root{--blue:#002366;--gold:#c8a43a;--black:#111;--white:#fff;--muted:#f5f7fb}
*{box-sizing:border-box}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;color:var(--black);background:var(--white);line-height:1.6;margin:0}
.container{max-width:1100px;margin:0 auto;padding:0 1rem}
.site-header{background:var(--blue);color:var(--white)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 0}
.brand{display:flex;align-items:center;gap:.8rem}
.logo{width:56px;height:56px;object-fit:cover;border-radius:6px}
.brand-text h1{font-size:1.25rem;margin:0}
.tagline{margin:.15rem 0 0;color:#dfe8ff}
.lang-switch button{background:var(--gold);border:none;padding:.45rem .8rem;border-radius:6px;color:var(--black);font-weight:600;cursor:pointer}
.lang-switch button+button{margin-left:.4rem}
.hero{background:linear-gradient(135deg,#001a57,#0041a8);color:var(--white);padding:2.2rem 0}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:1rem;align-items:center}
.hero .cta{display:inline-block;margin-top:1rem;background:var(--gold);color:var(--black);padding:.6rem 1rem;border-radius:8px;text-decoration:none;font-weight:700}
.hero-figure img{width:100%;border-radius:10px;border:2px solid rgba(255,255,255,.35)}
.services{background:var(--muted);padding:2rem 0}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.card{background:#fff;border:1px solid #e6ebf5;border-radius:10px;padding:1rem;box-shadow:0 2px 6px rgba(0,0,0,.04)}
.gallery,.flyers{padding:2rem 0}
.ba-item,.flyer{background:#fff;border:1px solid #e6ebf5;border-radius:10px;overflow:hidden}
.ba-item img,.flyer img{width:100%;height:260px;object-fit:cover;background:#e9eef8}
.ba-item figcaption,.flyer figcaption{padding:.6rem 1rem;color:#333}
.contact{background:#fff;padding:2rem 0}
.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:start}
.contact-list{list-style:none;padding-left:0}
.contact-list li{margin:.35rem 0}
.map-wrap{margin-top:.6rem;border-radius:10px;overflow:hidden;border:1px solid #e6ebf5}
.map-wrap iframe{width:100%;height:300px;border:0}
.contact-form{display:grid;gap:.7rem;background:var(--muted);padding:1rem;border-radius:10px;border:1px solid #e6ebf5}
.contact-form label{display:grid;gap:.25rem;font-size:.95rem}
.contact-form input,.contact-form textarea{padding:.6rem;border-radius:8px;border:1px solid #cdd6ea}
.contact-form button{background:var(--blue);color:#fff;border:none;padding:.7rem 1rem;border-radius:8px;font-weight:700;cursor:pointer}
.site-footer{background:#0f1530;color:#b8c1ff;padding:1rem 0;margin-top:2rem;text-align:center}
.is-hidden{display:none}
@media (max-width: 900px){
  .grid-3{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  .hero-grid{grid-template-columns:1fr}
  .ba-item img,.flyer img{height:220px}
}

/* Sticky CTA bar (mobile) */
.cta-bar{
  position: fixed; left: 0; right: 0; bottom: 0;
  display: grid; grid-template-columns: 1fr 1fr; gap: 6px;
  padding: .6rem; background: rgba(15,21,48,.95); z-index: 9999;
  border-top: 1px solid #2a3366;
}
.cta-bar a{display:block; text-align:center; padding:.7rem 1rem; border-radius:8px; font-weight:800; text-decoration:none}
.cta-bar .cta-call{background:#19c37d; color:#0b2d1e}
.cta-bar .cta-directions{background:#c8a43a; color:#111}
/* On larger screens, show a small top bar instead and hide bottom one */
.top-actions{display:none}
@media (min-width: 901px){
  .cta-bar{display:none}
  .top-actions{display:flex; gap:.5rem; align-items:center}
  .top-actions a{background:#19c37d;color:#0b2d1e;padding:.4rem .7rem;border-radius:6px;text-decoration:none;font-weight:700}
  .top-actions a:last-child{background:#c8a43a;color:#111}
}

.cta-bar .cta-whatsapp{background:#25D366; color:#0b2d1e}
@media (min-width: 901px){
  .top-actions a:nth-child(3){background:#25D366;color:#0b2d1e}
}

/* === Blue-forward theme with image-backed sections === */

/* HERO with gradient + image */
.hero{
  background:
    linear-gradient(135deg, rgba(0,26,87,0.80), rgba(0,65,168,0.70)),
    url('../img/ba_truck.png') center/cover no-repeat;
  color: var(--white);
}

/* SERVICES subtle gradient */
.services{
  background:
    radial-gradient(1200px 500px at 10% 0%, rgba(0,65,168,0.08), transparent 60%),
    linear-gradient(180deg, #f7f9ff 0%, #eef3ff 100%);
}

/* BEFORE & AFTER with soft blue mesh */
.gallery{
  background:
    radial-gradient(800px 400px at 85% 15%, rgba(0,65,168,0.10), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #f6f8ff 100%);
}

/* FLYERS with diagonal blue glow */
.flyers{
  background:
    radial-gradient(900px 500px at 15% 20%, rgba(0,35,102,0.10), transparent 60%),
    linear-gradient(180deg, #f7f9ff 0%, #eef3ff 100%);
}

/* CONTACT with image + overlay */
.contact{
  background:
    linear-gradient(180deg, rgba(0,26,87,0.82), rgba(0,26,87,0.82)),
    url('../img/folder_paint_quality.jpg') center/cover no-repeat;
  color: var(--white);
}
.contact .contact-form{ background: rgba(245,247,251,0.95); }
.contact .contact-list li, .contact p, .contact h2{ color: #fff; }
.map-wrap{ border-color: rgba(255,255,255,0.35); }
.map-wrap iframe{ filter: saturate(0.95) contrast(1.02); }

/* FOOTER with subtle carbon pattern (keeps deep blue) */
.site-footer{
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.04) 0 8px, rgba(255,255,255,0.00) 8px 16px),
    #0f1530;
}

/* Cards pop more on patterned backgrounds */
.card, .ba-item, .flyer{
  box-shadow: 0 8px 22px rgba(0,0,0,0.08), 0 2px 6px rgba(0,0,0,0.05);
}

/* Improve hero figure border on image background */
.hero-figure img{ border: 2px solid rgba(255,255,255,0.45); }

/* Keep CTA bar readable over imagery */
.cta-bar{ backdrop-filter: blur(6px); background: rgba(15,21,48,0.88); }
