/* Bravo Response Solutions — Website Styles */
:root{
  --navy: #0D1B2A;
  --red: #C8102E;
  --silver: #C0C0C0;
  --white: #FFFFFF;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#e6eaf0;background:#0b1623;}

.container{width:min(1100px, 92%);margin:0 auto;}

.banner{background:linear-gradient(90deg, rgba(200,16,46,0.9), rgba(200,16,46,0.55));color:#fff;padding:8px 0;font-size:14px;letter-spacing:0.2px;text-align:center}

.site-header{background:linear-gradient(180deg, rgba(13,27,42,0.98), rgba(13,27,42,0.7));position:sticky;top:0;z-index:20;backdrop-filter:saturate(135%) blur(6px);}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0;}
.logo{height:44px;width:auto;display:block;filter:drop-shadow(0 1px 0 rgba(255,255,255,0.05));}
.nav a{color:var(--silver);text-decoration:none;margin-left:18px;font-weight:600;opacity:0.9}
.nav a:hover{color:#fff;opacity:1}

.hero{position:relative;min-height:68vh;display:flex;align-items:center;justify-content:center;background:
radial-gradient(60% 40% at 50% 20%, rgba(255,255,255,0.06), transparent 60%),
linear-gradient(180deg, #0D1B2A, #0a1420);}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,0.0), rgba(0,0,0,0.45));}
.hero-content{position:relative;text-align:center;color:#e6eaf0;padding:40px 0;z-index:2;}
.hero h1{font-size: clamp(32px, 6vw, 56px);margin:0 0 8px 0;letter-spacing:0.5px;}
.tagline{font-size: clamp(16px, 2.6vw, 22px);color:#d8dbe2;margin:0 0 6px 0}
.sub{color:#b9c0c9;margin:0 0 22px 0}
.cta{display:inline-block;background:var(--red);color:#fff;text-decoration:none;padding:12px 18px;border-radius:8px;font-weight:700;box-shadow:0 6px 18px rgba(200,16,46,0.28);}
.cta:hover{transform:translateY(-1px)}

.ekg{position:absolute;bottom:26px;left:0;width:100%;height:50px;overflow:hidden;z-index:1;}
.ekg span{display:block;position:absolute;left:-20%;top:50%;width:140%;height:2px;background:linear-gradient(90deg, transparent, var(--red), transparent);
  animation: sweep 3s linear infinite;}
@keyframes sweep{0%{transform:translateX(0)}100%{transform:translateX(20%)}}

main{margin-top:-30px;position:relative;z-index:3}
.card{background:linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.03));border:1px solid rgba(255,255,255,0.1);border-radius:14px;padding:22px 20px;margin:16px 0;color:#e6eaf0;box-shadow:0 10px 30px rgba(0,0,0,0.25);}
.card h2,.card h3{color:#f2f4f7;margin-top:4px}
.small{color:#96a0ac}

.grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));gap:16px;margin-top:8px;}
.service.coming-soon h3 em{color:var(--silver);font-style:normal;font-weight:600;}

.contact a{color:#fff;text-decoration:none;border-bottom:1px dotted rgba(255,255,255,0.35)}
.contact a:hover{border-bottom-color:#fff}

.site-footer{padding:28px 0 34px;border-top:1px solid rgba(255,255,255,0.08);margin-top:24px;background:linear-gradient(180deg, rgba(13,27,42,0.3), rgba(13,27,42,0.7));}
.foot{text-align:center;color:#c7ced7}
.motto{font-style:italic;margin-bottom:6px;color:#d7dce3}

.coming-body{background:linear-gradient(180deg, #0D1B2A, #0a1420);min-height:100vh;display:flex;align-items:center;justify-content:center;color:#e6eaf0}
.coming-wrap{text-align:center;padding:30px;width:min(800px, 92%);}
.coming-logo{height:64px;margin-bottom:18px}
.coming-title{font-size: clamp(24px, 4.8vw, 36px);line-height:1.25;margin:0 0 10px 0}
.coming-sub{color:#cbd3dc;margin:0 0 18px 0}

@media (max-width: 640px){
  .nav a{margin-left:12px}
  .cta{padding:11px 16px}
}