
:root{
  --navy:#0d1b4d;
  --navy-2:#132867;
  --blue:#1f4ed8;
  --light:#f5f7fb;
  --white:#ffffff;
  --silver:#d9e1f2;
  --text:#10203a;
  --accent:#7fb5ff;
  --shadow:0 20px 50px rgba(7,19,57,.12);
  --radius:22px;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--text);
  background:var(--light);
  line-height:1.6;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{max-width:var(--max);margin:0 auto;padding:0 20px}
.topbar{
  background:linear-gradient(90deg,var(--navy),var(--navy-2));
  color:#fff;
  position:sticky;top:0;z-index:20;
  box-shadow:0 8px 24px rgba(0,0,0,.14);
}
.topbar .container{
  display:flex;align-items:center;justify-content:space-between;
  gap:20px;padding:14px 20px;
}
.brand{display:flex;align-items:center;gap:14px}
.brand img{width:62px;height:62px;border-radius:50%;background:#fff;padding:6px}
.brand-text strong{display:block;font-size:1.15rem;letter-spacing:.3px}
.brand-text span{display:block;font-size:.92rem;color:var(--silver)}
nav{display:flex;gap:18px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
nav a{font-weight:700;font-size:.95rem;opacity:.95}
nav a:hover{opacity:1;text-decoration:underline}
.lang-switch{
  display:flex;gap:8px;align-items:center
}
.lang-switch a{
  border:1px solid rgba(255,255,255,.35);
  padding:8px 12px;border-radius:999px;font-size:.85rem
}
.lang-switch a.active,.lang-switch a:hover{background:#fff;color:var(--navy)}
.hero{
  background:radial-gradient(circle at top left,#224db4 0,#152962 34%,#0d1b4d 70%);
  color:#fff;padding:72px 0 48px;
}
.hero-grid{
  display:grid;grid-template-columns:1.15fr .85fr;gap:34px;align-items:center
}
.eyebrow{
  display:inline-block;background:rgba(255,255,255,.12);
  padding:8px 14px;border-radius:999px;font-size:.85rem;font-weight:700;
  border:1px solid rgba(255,255,255,.18)
}
.hero h1{font-size:3rem;line-height:1.1;margin:16px 0 14px}
.hero p{font-size:1.1rem;max-width:760px;color:#e9efff}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.btn{
  display:inline-block;padding:14px 20px;border-radius:999px;font-weight:700;
  box-shadow:var(--shadow)
}
.btn-primary{background:#fff;color:var(--navy)}
.btn-secondary{border:1px solid rgba(255,255,255,.35);color:#fff}
.hero-card{
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);
  padding:22px;border-radius:26px;backdrop-filter: blur(8px)
}
.hero-card img{border-radius:22px;box-shadow:var(--shadow)}
.stats{
  margin-top:22px;display:grid;grid-template-columns:repeat(3,1fr);gap:14px
}
.stat{
  background:#fff;border-radius:18px;padding:18px;box-shadow:var(--shadow);text-align:center
}
.stat strong{display:block;font-size:1.3rem;color:var(--navy)}
.stat span{display:block;font-size:.95rem;color:#51617f}
.section{padding:66px 0}
.section-alt{background:#fff}
.section h2{font-size:2rem;line-height:1.15;margin:0 0 12px;color:var(--navy)}
.section-intro{max-width:760px;color:#4d5d7d;margin-bottom:28px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center}
.card{
  background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:28px
}
.story-card p{margin-top:0}
.quote{
  border-left:4px solid var(--blue);padding-left:16px;color:#465777;font-style:italic
}
.gallery{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px
}
.gallery figure{
  background:#fff;border-radius:22px;box-shadow:var(--shadow);overflow:hidden;margin:0
}
.gallery img{height:330px;width:100%;object-fit:cover}
.gallery figcaption{padding:14px 16px;font-weight:700;color:var(--navy)}
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.feature{
  background:#fff;padding:24px;border-radius:22px;box-shadow:var(--shadow)
}
.feature h3{margin:0 0 8px;color:var(--navy)}
.feature p{margin:0;color:#556681}
.split{
  display:grid;grid-template-columns:1.2fr .8fr;gap:28px
}
.contact-wrap{
  display:grid;grid-template-columns:1fr 1fr;gap:26px
}
form{
  display:grid;gap:14px
}
input,textarea{
  width:100%;padding:14px 16px;border:1px solid #cfd8ea;border-radius:16px;
  font:inherit;background:#fff
}
textarea{min-height:150px;resize:vertical}
button{
  border:0;cursor:pointer;font:inherit
}
.socials{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}
.socials a{
  background:var(--navy);color:#fff;padding:12px 16px;border-radius:999px;font-weight:700
}
.footer{
  background:var(--navy);color:#dbe5ff;padding:28px 0;margin-top:32px
}
.footer p{margin:8px 0}
.small{font-size:.92rem;color:#647493}
.notice{
  background:#eef4ff;border:1px solid #d8e4ff;color:#31466f;padding:14px 16px;border-radius:16px
}
ul.clean{padding-left:18px;margin:10px 0 0}
ul.clean li{margin-bottom:8px}
@media (max-width:980px){
  .hero-grid,.grid-2,.split,.contact-wrap{grid-template-columns:1fr}
  .features,.gallery,.stats{grid-template-columns:1fr 1fr}
  nav{display:none}
}
@media (max-width:640px){
  .hero h1{font-size:2.2rem}
  .features,.gallery,.stats{grid-template-columns:1fr}
  .brand img{width:54px;height:54px}
  .topbar .container{padding:12px 16px}
}
