
*{box-sizing:border-box}
:root{--primary:#0a4da7;--primary-dark:#083d85;--bg:#f7f9fc;--text:#1a2b3c}
html,body{margin:0;padding:0}
body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;background:var(--bg);color:var(--text);line-height:1.6}
a{color:var(--primary);text-decoration:none}
header.hero{position:relative;display:flex;align-items:center;justify-content:center;height:420px;color:#fff;text-align:center;position:absolute;inset:0;background:rgba(0,0,0,.55)}
header.hero .inner{position:relative;z-index:1;padding:0 16px}
header.hero h1{font-size:3rem;margin:.2rem 0}
header.hero p{opacity:.95;margin:0}
nav.top{position:sticky;top:0;z-index:1000;background:var(--primary);box-shadow:0 2px 8px rgba(0,0,0,.08)}
nav.top .wrap{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap}
nav.top a{color:#fff;padding:14px 18px;display:inline-block;border-radius:8px;transition:.2s}
nav.top a:hover{background:var(--primary-dark)}
.lang-switch{position:absolute;right:14px;top:10px;background:#ffffff22;color:#fff;padding:6px 10px;border-radius:8px}
main{max-width:1180px;margin:0 auto;padding:48px 20px}
h2{color:var(--primary-dark);text-align:center;margin:0 0 24px 0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.card{background:#fff;border-radius:14px;box-shadow:0 6px 24px rgba(0,0,0,.06);padding:22px}
.card h3{margin-top:0}
.pricing .price{font-size:1.6rem;font-weight:700}
.section-cta{text-align:center;margin-top:18px}
.btn{background:var(--primary);color:#fff;padding:12px 18px;border:none;border-radius:100px;display:inline-block;font-weight:600}
.btn:hover{background:var(--primary-dark)}
footer{background:#eef2f7;color:#556;display:flex;justify-content:center;align-items:center;padding:26px;margin-top:40px;font-size:.95rem}
.whatsapp-fab{position:fixed;right:18px;bottom:18px;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#25D366;color:#fff;font-size:28px;box-shadow:0 8px 24px rgba(0,0,0,.2);z-index:1200}
.form input,.form textarea{width:100%;padding:12px;border:1px solid #ccd6e3;border-radius:10px}
.form textarea{min-height:120px}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.small{opacity:.8;font-size:.95rem}
blockquote{background:#fff;border-left:5px solid var(--primary);margin:0;padding:16px;border-radius:10px}
.badge{display:inline-block;background:#e8f0ff;color:#083d85;padding:6px 10px;border-radius:999px;font-weight:600;font-size:.85rem}
@media (max-width:640px){header.hero h1{font-size:2.2rem} .form .row{grid-template-columns:1fr} .lang-switch{position:fixed;right:10px;top:auto;bottom:88px}}

.promo-banner{position:sticky;top:0;z-index:1200;background:#0a4da7;color:#fff}
.promo-banner .wrap{max-width:1180px;margin:0 auto;padding:10px 16px;display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.promo-banner .btn{background:#fff;color:#0a4da7;padding:8px 14px;border-radius:999px;font-weight:700}
.promo-banner .btn:hover{background:#eef2f7}
nav.top{top:48px} /* push nav below banner */
@media(max-width:640px){nav.top{top:56px}}

.testimonials{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:10px}
.testimonial{background:#fff;border-radius:14px;box-shadow:0 6px 24px rgba(0,0,0,.06);padding:18px;position:relative}
.stars{font-size:1.1rem;letter-spacing:1px}
.badge-inline{display:inline-block;margin-left:8px;background:#e8f0ff;color:#083d85;padding:4px 8px;border-radius:999px;font-weight:600;font-size:.85rem}
.express{background:#fff;border-left:6px solid #0a4da7;border-radius:10px;padding:18px;box-shadow:0 6px 24px rgba(0,0,0,.06)}
.express .slot{font-weight:700}
.small-muted{opacity:.7;font-size:.9rem}


/* --- Layout fixes (v11) --- */
header.hero{
  position:relative;
  min-height:420px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#fff;
  overflow:hidden;
}
header.hero picture,
header.hero picture img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  z-index:0;
}
header.hero::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.35));
  z-index:1;
}
header.hero .inner{position:relative; z-index:2; padding:0 16px;}
/* Give more air below hero */
main{padding-top:48px; padding-bottom:40px;}
/* Cards air & subtle shadow */
.card{margin:6px 0; box-shadow:0 10px 30px rgba(0,0,0,.08);}
/* Ensure sticky promo + nav don't cover content on small screens */
.promo-banner{position:sticky; top:0; z-index:1200;}
nav.top{position:sticky; top:48px; z-index:1100;}
@media(max-width:640px){
  nav.top{top:56px;}
  main{padding-top:40px;}
}
