:root{
  --bg1:#f6fbff;
  --bg2:#eef5fb;
  --ink:#0d204b;
  --muted:#516784;
  --line:#d7e4f2;
  --card:#ffffffee;
  --blue:#1967ff;
  --blue2:#0aa3d8;
  --shadow:0 18px 50px rgba(26, 56, 102, .12);
  --radius:26px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial, Helvetica, sans-serif;
  color:var(--ink);
  background:
    radial-gradient(circle at 0% 90%, rgba(42,132,255,.12), transparent 34%),
    radial-gradient(circle at 100% 0%, rgba(102,196,255,.16), transparent 26%),
    linear-gradient(180deg,var(--bg1),var(--bg2));
}
a{text-decoration:none;color:inherit}
.page{min-height:100vh;display:flex;flex-direction:column}
.container{width:min(1480px, calc(100% - 40px)); margin:0 auto}
.topbar{
  display:flex; align-items:center; justify-content:space-between;
  gap:20px; padding:18px 0 10px;
}
.brand img{height:42px; width:auto; display:block}
.lang-switch{display:flex; gap:8px; align-items:center}
.lang-switch a{
  width:42px; height:42px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:999px; font-weight:700; font-size:14px;
  border:1px solid #b8cde3; color:#4d6481; background:#ffffffcc;
  box-shadow:0 6px 18px rgba(20,52,102,.08)
}
.lang-switch a.active{background:#0f2d68; color:#fff; border-color:#0f2d68}
.hero{
  padding:8px 0 16px;
}
.hero-card{
  background:linear-gradient(180deg, rgba(255,255,255,.68), rgba(255,255,255,.45));
  border:1px solid rgba(175,199,222,.7);
  border-radius:34px; padding:18px 18px 14px;
  box-shadow:var(--shadow);
  backdrop-filter: blur(10px);
}
.hero-image-wrap{
  display:flex; justify-content:center; align-items:center; overflow:hidden;
  border-radius:24px;
}
.hero-image{
  display:block; max-width:100%; width:auto; height:auto;
  max-height:min(72vh, 900px);
  border-radius:20px;
}
.actions{
  display:flex; flex-wrap:wrap; justify-content:center; gap:14px;
  padding:18px 6px 6px;
}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:14px 22px; border-radius:999px; font-weight:700; font-size:16px;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(90deg,#0b5cf2,#1b74ff); color:#fff; box-shadow:0 14px 26px rgba(25,103,255,.22)}
.btn-secondary{background:#ffffffd8; color:var(--ink); border:1px solid #cfe0f0}
.copy-mini{
  text-align:center; color:var(--muted); font-size:15px; line-height:1.55;
  max-width:920px; margin:0 auto; padding:2px 16px 2px;
}
.section{padding:34px 0}
.section h2{font-size:42px; line-height:1.08; margin:0 0 14px; letter-spacing:-.02em}
.section p.lead{font-size:18px; color:var(--muted); max-width:880px; margin:0 0 24px; line-height:1.65}
.grid{display:grid; gap:18px}
.cap-grid{grid-template-columns:repeat(4, minmax(0, 1fr))}
.card{
  background:var(--card); border:1px solid rgba(200,218,236,.95); border-radius:22px;
  padding:22px; box-shadow:0 12px 28px rgba(27,55,107,.08)
}
.card h3{margin:0 0 10px; font-size:24px; line-height:1.15}
.card p{margin:0; font-size:16px; line-height:1.62; color:var(--muted)}
.icon{
  width:52px; height:52px; border-radius:16px;
  display:inline-flex; align-items:center; justify-content:center; margin-bottom:14px;
  background:linear-gradient(180deg,#eff6ff,#dbeafc); color:#0f4dc7; font-size:24px; font-weight:700
}
.impact-grid{grid-template-columns:repeat(4, minmax(0,1fr))}
.impact-card{text-align:center}
.impact-card .kpi{font-size:20px; font-weight:800; margin:0 0 8px}
.footer{
  padding:26px 0 34px; color:#60728d; font-size:14px; text-align:center
}
.anchor-offset{scroll-margin-top:18px}
@media (max-width: 1180px){
  .section h2{font-size:36px}
  .cap-grid,.impact-grid{grid-template-columns:repeat(2, minmax(0,1fr))}
  .hero-image{max-height:64vh}
}
@media (max-width: 760px){
  .container{width:min(100% - 24px, 1480px)}
  .topbar{padding:14px 0 8px}
  .brand img{height:34px}
  .lang-switch a{width:38px;height:38px;font-size:13px}
  .hero-card{padding:10px 10px 12px; border-radius:24px}
  .hero-image{max-height:none; width:100%; height:auto}
  .copy-mini{font-size:14px}
  .section{padding:26px 0}
  .section h2{font-size:30px}
  .section p.lead{font-size:16px}
  .cap-grid,.impact-grid{grid-template-columns:1fr}
  .card{padding:18px}
}
