:root{--bg:#0A1224;--bg2:#0F1730;--ink:#EAF2FF;--muted:#9DB3D9;--primary:#E10600;--accent:#F59E0B;}
*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--ink);line-height:1.6}
a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}
.container{max-width:1180px;margin:0 auto;padding:clamp(16px,3vw,24px)}
header{background:linear-gradient(180deg,var(--bg) 0%, var(--bg2) 100%);border-bottom:3px solid var(--primary)}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:12px;font-weight:900;font-size:1.2rem;color:var(--ink)}
.brand img{height:40px;width:auto}
nav a{margin-left:16px;font-weight:700;color:var(--ink)}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center;padding:36px 0}
.hero h1{font-size:clamp(2rem,4vw,3rem);line-height:1.1;margin:0 0 12px;color:var(--ink)}
.hero p{font-size:1.05rem;margin:0 0 18px;color:var(--muted)}
.cta{display:inline-block;padding:12px 18px;border:2px solid var(--primary);background:var(--primary);color:#000;border-radius:10px;font-weight:800}
.cta.alt{background:transparent;color:var(--ink);border-color:var(--accent)}
.section{padding:48px 0}h2,h3{color:var(--ink);margin:0 0 12px}
.card{background:var(--bg2);border:1px solid rgba(0,0,0,.15);border-radius:12px;padding:18px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.list-plain{margin:0;padding-left:18px}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.kpi{text-align:center;background:var(--bg2);border:1px solid rgba(0,0,0,.15);border-radius:10px;padding:12px}
.kpi .num{font-weight:900;font-size:1.6rem;color:var(--primary)}.kpi .lbl{font-size:.9rem;color:var(--muted)}
footer{background:var(--bg2);border-top:3px solid var(--primary);padding:24px 0;color:var(--muted)}
.badge{display:inline-block;border:1px solid var(--accent);color:var(--accent);border-radius:999px;font-size:.8rem;padding:4px 8px;margin-bottom:8px}
.small{font-size:.9rem;color:var(--muted)}
.sticky-bar{position:fixed;bottom:0;left:0;right:0;background:var(--bg2);border-top:3px solid var(--primary);box-shadow:0 -6px 24px rgba(0,0,0,.3);z-index:9999}
.sticky-wrap{max-width:1180px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:12px;justify-content:space-between}
.sticky-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.btn-wa,.btn-call{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:10px;font-weight:800;text-decoration:none}
.btn-call{background:var(--primary);color:#000;border:2px solid var(--primary)}.btn-wa{background:#25D366;color:#000;border:2px solid #25D366}
.btn-wa img{height:20px;width:20px}.book-now{display:flex;align-items:center;gap:8px;font-weight:900;color:var(--ink)}
.book-now .arrow{display:inline-block;animation:pulse 1.2s infinite}@keyframes pulse{0%{transform:translateX(0)}50%{transform:translateX(6px)}100%{transform:translateX(0)}}
body{padding-bottom:72px}
@media (max-width:900px){.hero{grid-template-columns:1fr}.grid-3{grid-template-columns:1fr}.grid-2{grid-template-columns:1fr}.kpis{grid-template-columns:1fr 1fr}}


/* === Mobile stability enhancements (no overlap) === */
img, svg {max-width: 100%; height: auto;}
.topbar {flex-wrap: wrap; min-width: 0;}
.brand {min-width: 0; flex: 1 1 auto; display:flex; align-items:center; gap:10px; flex-wrap: nowrap;}
.brand span {overflow-wrap: anywhere;}
nav {display: flex; flex-wrap: wrap; gap: 8px; min-width: 0;}
nav a {margin-left: 0; padding: 10px 12px; border-radius: 10px; text-align: center; flex: 1 1 auto; white-space: normal; overflow-wrap: anywhere;}
.container.small {display:flex; justify-content:space-between; gap: 12px; flex-wrap: wrap;}
/* Sticky bar: stack buttons on small screens */
@media (max-width: 820px) {
  .sticky-wrap {flex-direction: column; align-items: stretch; gap: 8px;}
  .sticky-actions {width: 100%;}
  .btn-wa, .btn-call {flex: 1 1 100%; justify-content: center;}
  body {padding-bottom: 108px;} /* extra space for stacked sticky bar */
}
/* Header nav stacks on narrow phones */
@media (max-width: 720px) {
  .topbar {flex-direction: column; align-items: stretch;}
  nav {gap: 8px;}
  nav a {flex: 1 1 calc(50% - 8px);} /* two-column button grid */
}
@media (max-width: 420px) {
  nav a {flex: 1 1 100%;} /* single column on very small phones */
}
/* Footer: prevent collisions and ensure wrapping */
footer .container.small {flex-direction: column; align-items: flex-start;}
footer .container.small a {overflow-wrap: anywhere;}