*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);color:#334155;line-height:1.7;background:#f6f9ff;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--font-head);line-height:1.15;color:#0f1f4a}

.hero{position:relative;min-height:640px;display:flex;align-items:center;overflow:hidden}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(9,24,70,.88),rgba(9,24,70,.45) 60%,rgba(9,24,70,.15))}
.hero-inner{position:relative;z-index:2;max-width:1100px;width:100%;margin:0 auto;padding:60px max(22px,5vw);color:#fff}
.brand{display:block;font-family:var(--font-head);font-size:1.25rem;margin-bottom:46px;color:#fff}
.tag{display:inline-block;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);padding:6px 16px;border-radius:999px;font-size:.85rem;font-weight:600}
.hero h1{color:#fff;font-size:clamp(2.2rem,5.5vw,3.9rem);max-width:640px;margin:18px 0}
.hero p{max-width:520px;font-size:1.1rem;color:#dbe7ff;margin-bottom:30px}
.actions{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-block;background:var(--accent);color:#fff;font-weight:700;text-decoration:none;padding:14px 30px;border-radius:12px;
  box-shadow:0 12px 28px color-mix(in srgb,var(--accent) 50%,transparent);transition:transform .15s}
.btn:hover{transform:translateY(-2px)}
.btn.ghost{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.4);box-shadow:none}

.stats{max-width:900px;margin:-56px auto 0;position:relative;z-index:3;display:grid;grid-template-columns:repeat(3,1fr);
  background:#fff;border-radius:22px;box-shadow:0 20px 60px rgba(15,31,74,.15);padding:26px 10px;text-align:center}
.stats b{display:block;font-family:var(--font-head);font-size:2rem;color:var(--accent)}
.stats span{font-size:.92rem;color:#64748b}

.block{max-width:1100px;margin:0 auto;padding:84px 22px 0}
.block>h2{font-size:clamp(1.7rem,4vw,2.5rem);text-align:center;margin-bottom:36px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:22px}
.service{background:#fff;border-radius:20px;padding:30px;box-shadow:0 10px 34px rgba(15,31,74,.07);border-top:4px solid var(--accent);transition:transform .2s}
.service:hover{transform:translateY(-4px)}
.service h3{font-size:1.2rem;margin-bottom:8px}
.about{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.about img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:24px;box-shadow:0 24px 60px rgba(15,31,74,.2)}
.about h2{text-align:left;margin-bottom:14px}
.work{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.work img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:18px;display:block;transition:transform .25s}
.work img:hover{transform:scale(1.03)}

.quote{max-width:760px;margin:84px auto 0;padding:0 22px;text-align:center}
.quote p{font-family:var(--font-head);font-size:clamp(1.3rem,3vw,1.8rem);color:#0f1f4a;line-height:1.4}
.quote span{display:block;margin-top:14px;color:var(--accent);font-weight:700}
.contact{max-width:1000px;margin:84px auto 40px;padding:56px 22px;text-align:center;color:#dbe7ff;border-radius:28px;
  background:linear-gradient(135deg,#0f2a6e,var(--accent))}
.contact h2{color:#fff;margin-bottom:12px}
footer{text-align:center;padding:26px;font-size:.85rem;color:#94a3b8}
@media (max-width:760px){.about{grid-template-columns:1fr}.stats{margin:-40px 16px 0}.hero{min-height:560px}}
