:root { --maxw: 1060px; --radius: 14px; }
* { box-sizing: border-box; }
html, body { margin:0; padding:0; font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; background:#0b0d12; color:#e7e9ee; }
.container { max-width: var(--maxw); margin: 0 auto; padding: 0 20px; }

/* --- HEADER (transparent, non-sticky) --- */
.site-header {
  position: relative; /* no sticky */
  background: transparent; /* no box */
  border: none;
}
.nav { display:flex; align-items:center; justify-content: space-between; gap: 16px; padding: 20px 0; }
.logo { height: 45px; width: auto; display:block; }
nav a { color:#cbd3e1; text-decoration:none; margin-left: 14px; font-weight:600; opacity:.95; }
nav a:hover { color:#ffffff; opacity:1; }
nav .pill { background:#0e1320; padding: 8px 12px; border-radius: 999px; border:1px solid #26304a; }
nav .phone { color:#f59e0b; font-weight:700; }

/* --- HERO --- */
.hero { display:flex; align-items:center; min-height: 52vh; padding: 28px 0 34px;
  background: radial-gradient(1200px 500px at 20% -10%, #5a3a2455, transparent); }
.hero h1 {
  margin: 10px 0 8px;
  font-size: 42px;
  letter-spacing: -0.02em;
  color: #ffffff; /* bright white headline */
}
.tagline {
  color: #d1d5db; /* stronger grey tagline */
  margin: 6px 0 10px;
  font-size: 18px;
}
.highlights { display:flex; gap:10px; flex-wrap:wrap; margin: 8px 0 12px; padding:0; list-style:none; color:#9fb1d1; }
.highlights li { background:#0e1320; border:1px solid #1f2533; padding:6px 10px; border-radius: 999px; font-size: 13px; }
.cta-row { display:flex; gap:12px; margin-top: 8px; }
.btn { display:inline-block; padding: 11px 14px; border-radius: 10px; background: linear-gradient(135deg, #f59e0b, #fbbf24); color:#0b0d12; font-weight:800; text-decoration:none; }
.btn.alt { background:#0e1320; color:#d5dcf1; border:1px solid #2a3346; }

/* --- CARDS --- */
.card { background: #121623; padding: 22px; border: 1px solid #1a1f2b; border-radius: var(--radius); box-shadow: 0 10px 30px rgba(0,0,0,.25); margin: 20px 0; }
.card h2 { margin: 0 0 12px; font-size: 26px; }

/* --- SERVICES --- */
.service-grid { display:grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.service { background:#0e1320; border:1px solid #1f2533; border-radius: 12px; padding: 14px; }
.service h3 { margin: 8px 0 6px; font-size: 18px; }
.service p { margin: 0; color:#b8c0d4; line-height:1.5; font-size: 14px; }
.ico { width: 26px; height: 26px; display:block; }
@media (max-width: 960px) { .service-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .service-grid { grid-template-columns: 1fr; } }

/* --- GALLERY --- */
.gallery { display:grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.gallery a { display:block; width: 100%; height: 250px; border-radius: 10px; overflow: hidden; border:1px solid #1f2533; background:#0e1320; }
.gallery img { width: 100%; height: 100%; object-fit: cover; display:block; }
.gallery .placeholder { display:flex; align-items:center; justify-content:center; height: 250px; border-radius: 10px; border:1px dashed #3a4156; background:#0e1320; color:#97a0b3; font-size: 14px; }
@media (max-width: 900px) { .gallery { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 580px) { .gallery { grid-template-columns: 1fr; } }

/* --- CONTACT --- */
.contact-wrap { scroll-margin-top: 100px; }
.contact-grid { display:grid; grid-template-columns: 2fr 1fr; gap: 16px; }
@media (max-width: 820px) { .contact-grid { grid-template-columns: 1fr; } }
label { display:block; margin: 12px 0; }
label span { display:block; font-weight:600; margin-bottom:6px; color:#cbd3e1; font-size:14px; }
input[type="text"], input[type="email"], textarea { width:100%; padding:11px 12px; border-radius:10px; background:#0e1320; border:1px solid #1f2533; color:#e7e9ee; outline:none; font-size:14px; }
input::placeholder, textarea::placeholder { color:#6f7a90; }
textarea { resize: vertical; min-height: 120px; }
.grid { display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 720px) { .grid { grid-template-columns: 1fr; } }
button { appearance: none; border: none; background: linear-gradient(135deg, #f59e0b, #fbbf24); color: #0b0d12; font-weight: 800; padding: 11px 14px; border-radius: 10px; cursor: pointer; margin-top: 6px; }
button:hover { filter: brightness(1.05); }
.fineprint { color:#8a93a7; font-size: 12px; }

/* --- ALERTS & FOOTER --- */
.alert { padding: 10px 12px; border-radius: 10px; margin: 12px 0 18px; font-size: 14px;}
.alert.success { background:#10351c; border:1px solid #1f5131; color:#bfe8c7; }
.alert.error { background:#3a0f16; border:1px solid #5b1d27; color:#ffc1c8; }
.site-footer { border-top:1px solid #1a1f2b; margin-top:18px; padding:20px 0; color:#97a0b3; text-align:center; }

/* --- FOCUS --- */
a:focus, button:focus, input:focus, textarea:focus { outline: 2px solid #fbbf24; outline-offset: 2px; }