:root{
  --color-primary:#0f4c81;
  --color-secondary:#1f2937;
  --color-accent:#f4b400;
  --color-bg:#ffffff;
  --color-muted:#6b7280;
  --color-border:#e5e7eb;
  --radius:14px;
  --shadow:0 6px 20px rgba(0,0,0,.06);
  --maxw:1100px;
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Helvetica Neue", Arial, "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol", sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-sans);color:var(--color-secondary);background:var(--color-bg);line-height:1.6;font-size:16px}
img{max-width:100%;height:auto;display:block}
a{color:var(--color-primary);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:var(--maxw);margin-inline:auto;padding: clamp(16px, 3vw, 40px)}
.section{padding: clamp(32px, 6vw, 72px) 0;border-bottom:1px solid var(--color-border)}
h1,h2,h3{line-height:1.2;margin:0 0 12px}
h1{font-size: clamp(28px, 4vw, 44px)}
h2{font-size: clamp(22px, 3vw, 32px)}
h3{font-size: clamp(18px, 2.2vw, 24px)}
p{margin:0 0 14px;color:#111827}
header.site-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--color-border);box-shadow: var(--shadow)}
.site-header .inner{display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;color:#111827}
.logo img{width:42px;height:auto}
nav.primary ul{list-style:none;margin:0;padding:0;display:flex;gap: clamp(12px, 2vw, 28px)}
nav.primary a{padding:10px 6px;border-radius:10px}
nav.primary a:hover{background:#f9fafb;text-decoration:none}
.menu-toggle{display:none}
@media (max-width: 820px){
  nav.primary ul{display:none;flex-direction:column;gap:8px;padding:10px;border:1px solid var(--color-border);border-radius:var(--radius);background:#fff;position:absolute;right:16px;top:62px;min-width:220px;box-shadow:var(--shadow)}
  nav.primary.open ul{display:flex}
  .menu-toggle{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--color-border);border-radius:12px;background:#fff}
}
.hero{background:linear-gradient(180deg, #f8fafc, #fff);padding: clamp(48px, 8vw, 120px) 0}
.hero .kpis{display:grid;grid-template-columns:repeat(auto-fit, minmax(160px,1fr));gap:16px;margin-top:16px}
.kpi{padding:16px;border:1px solid var(--color-border);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow);text-align:center}
.grid{display:grid;gap: clamp(14px, 3vw, 28px)}
.grid.cols-3{grid-template-columns:repeat(3,1fr)}
.grid.cols-2{grid-template-columns:repeat(2,1fr)}
@media (max-width: 980px){.grid.cols-3{grid-template-columns:repeat(2,1fr)}}
@media (max-width: 680px){.grid.cols-2,.grid.cols-3{grid-template-columns:1fr}}
.card{border:1px solid var(--color-border);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow)}
.card .card-body{padding: clamp(14px,2.2vw,22px)}
.btn,.button, button, input[type="submit"], .cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;border-radius:12px;border:1px solid transparent;background:var(--color-primary);color:#fff;font-weight:600;cursor:pointer;transition: transform .05s ease, box-shadow .2s ease, background .2s ease;box-shadow: 0 8px 18px rgba(15,76,129,.18)}
.btn.secondary{background:#fff;color:var(--color-primary);border-color:var(--color-primary)}
.btn:hover,.button:hover,.cta:hover{transform: translateY(-1px)}
input, textarea, select{width:100%;padding:12px 14px;border:1px solid var(--color-border);border-radius:12px;background:#fff;color:#111827}
label{display:block;margin-bottom:6px;color:var(--color-muted);font-size:14px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:700px){.form-row{grid-template-columns:1fr}}
footer.site-footer{background:#0b1220;color:#d1d5db;padding: clamp(28px, 6vw, 64px) 0;margin-top:40px}
.site-footer a{color:#e5e7eb}
.site-footer .cols{display:grid;gap:16px;grid-template-columns:repeat(4,1fr)}
@media (max-width: 900px){.site-footer .cols{grid-template-columns:repeat(2,1fr)}}
@media (max-width: 560px){.site-footer .cols{grid-template-columns:1fr}}
.center{text-align:center}
.muted{color:var(--color-muted)}
.badge{display:inline-block;padding:6px 10px;border-radius:999px;background:#f3f4f6;color:#111827;border:1px solid var(--color-border)}
.shadow{box-shadow:var(--shadow)}
.rounded{border-radius:var(--radius)}
.maxw{max-width:var(--maxw);margin-inline:auto}
:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}