:root{
  --bg:#87aecb;
  --text:#0b1a2c;
  --panel:rgba(255,255,255,.6);
  --primary:#1f5ca8;
  --accent:#2d5d7b;
}
*{box-sizing:border-box}
body{ margin:0; font-family:'Inter','IBM Plex Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif; color:var(--text); background:var(--bg); }
a{ color:var(--primary); text-decoration:none }
a:hover{ color:#0a4fa0 }
.site{ max-width:1100px; margin:0 auto; padding:1.25rem; }
.site-header{ background:rgba(255,255,255,.15); backdrop-filter: blur(6px); }
.site-title{ margin:.2rem 0; font-size:1.4rem }
.site-nav{ text-align:right; }
.site-nav ul{ list-style:none; margin:0; padding:0; display:flex; gap:1rem; justify-content:flex-end }
.hero{ position:relative; background: radial-gradient(ellipse at center, rgba(135,174,203,.45), rgba(135,174,203,.05)), var(--hero) center/cover no-repeat; }
.hero:before{ content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(135,174,203,.25), rgba(135,174,203,.85)); mix-blend-mode:multiply }
.hero-inner{ position:relative; z-index:1; max-width:880px; margin:0 auto; padding:7rem 1.25rem 5rem; text-align:center; color:#fff; text-shadow:0 2px 20px rgba(0,0,0,.25) }
.hero h1{ margin:0 0 .8rem; font-size: clamp(2rem, 5vw, 3.5rem); }
.hero p{ margin:0 0 1.2rem; font-size: clamp(1rem, 2.5vw, 1.2rem); opacity:.95 }
.btn{ display:inline-block; background:#2b5672; color:#fff; padding:.8rem 1.2rem; border-radius:.75rem; box-shadow:0 10px 24px rgba(0,0,0,.18) }
.btn:hover{ background:#21465e }
.section{ margin:2rem 0; padding:1rem; background:var(--panel); border-radius:16px; box-shadow:0 10px 20px rgba(0,0,0,.08) }
.cards{ display:grid; grid-template-columns:1fr; gap:1rem }
@media(min-width:900px){ .cards{ grid-template-columns:repeat(3,1fr) } }
.card{ background:rgba(255,255,255,.9); border-radius:14px; padding:1rem; box-shadow:0 10px 20px rgba(0,0,0,.08) }
.card .ico{ font-size:32px; line-height:1; color:var(--primary); margin-bottom:.35rem }
.case-grid{ display:grid; grid-template-columns:1fr; gap:1rem }
@media(min-width:900px){ .case-grid{ grid-template-columns:repeat(2,1fr) } }
.case{ background:rgba(255,255,255,.9); border-radius:14px; padding:1rem; }
.cta{ text-align:center; padding:1.5rem 0 2rem }
.site-footer{ text-align:center; padding:1rem; color:rgba(255,255,255,.95) }