
:root {
  --blue: #0A3D62;
  --red: #A61C2E;
  --dark: #0b1b2b;
  --muted: #f6f8fb;
  --white: #FFFFFF;
}
* { box-sizing: border-box; }
html, body { margin:0; padding:0; font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color: #1a1f2b; }
img { max-width:100%; height:auto; display:block; }

.container { width:min(1100px, 92%); margin:0 auto; }
.site-header { position:sticky; top:0; background:#fff; border-bottom:1px solid #e8edf5; z-index:10; }
.header-inner { display:flex; align-items:center; justify-content:space-between; padding:14px 0; gap:16px; }
.brand { display:flex; align-items:center; gap:10px; text-decoration:none; color:#111; font-weight:700; }
.brand img { width:40px; height:40px; border-radius:8px; object-fit:cover; }
.nav { display:flex; gap:18px; align-items:center; }
.nav a { text-decoration:none; color:#233244; font-weight:600; }
.nav .btn { background:var(--blue); color:#fff; padding:10px 14px; border-radius:10px; }
.menu-toggle { display:none; background:transparent; border:0; font-size:22px; }

.hero { background: linear-gradient(135deg, var(--muted), #fff 60%); padding: 64px 0 24px; }
.hero-inner { display:grid; grid-template-columns: 1.05fr .95fr; gap:28px; align-items:center; }
.hero-text h1 { font-size: clamp(28px, 4vw, 44px); color: var(--dark); line-height:1.1; margin:0 0 10px; }
.hero-text p { font-size: 18px; max-width:60ch; }
.cta { display:flex; gap:12px; margin-top:18px; }
.btn { background: var(--red); color:#fff; padding:12px 16px; border-radius:12px; text-decoration:none; display:inline-block; font-weight:700; }
.btn.ghost { background: transparent; color: var(--blue); border:2px solid var(--blue); }
.hero-media { position:relative; }
.hero-media .shape { position:absolute; inset:-24px -24px auto auto; width:68%; height:68%; background: radial-gradient(120px 120px at 20% 30%, rgba(166,28,46,.18), transparent), linear-gradient(135deg, rgba(10,61,98,.1), transparent); border-radius:24px; filter: blur(2px); }
.features { padding: 36px 0 10px; }
.three { display:grid; grid-template-columns: repeat(3, 1fr); gap:16px; }
.card { background:#fff; border:1px solid #e8edf5; border-radius:16px; padding:18px; }
.sectors { padding: 18px 0 52px; }
h2 { font-size: clamp(22px, 3vw, 32px); margin: 0 0 8px; }
.pill-list { list-style:none; padding:0; margin:10px 0 0; display:flex; flex-wrap:wrap; gap:10px; }
.pill-list li { background: var(--muted); border:1px solid #e7ecf4; padding:8px 12px; border-radius:999px; }

.page-hero { background: linear-gradient(135deg, #fff, var(--muted)); padding: 48px 0; }
.narrow { max-width: 800px; }
.section { padding: 42px 0; }
.section.alt { background: #fbfcfe; }
.grid-2 { display:grid; grid-template-columns: 1fr 1fr; gap:28px; align-items:center; }
.check { line-height:1.7; }
.check li { margin:8px 0; }
.muted { color:#5b6a80; }
.illustration.abstract { height:260px; border-radius:18px; background:
  radial-gradient(120px 120px at 15% 35%, rgba(166,28,46,.18), transparent),
  linear-gradient(135deg, rgba(10,61,98,.12), rgba(10,61,98,.02)),
  linear-gradient(135deg, #fff, #f3f6fb);
  border:1px solid #e8edf5;
}

.cards-4 { display:grid; grid-template-columns: repeat(4, 1fr); gap:16px; }
.cta-strip { background: linear-gradient(135deg, var(--blue), var(--red)); color:#fff; padding:22px 0; }
.between { display:flex; align-items:center; justify-content:space-between; }

.team { display:grid; grid-template-columns: 1fr 1.1fr; gap:28px; align-items:start; }
.team-photo img { border-radius: 18px; border: 1px solid #e8edf5; }
.team-bios article { border-left:4px solid var(--blue); padding:12px 16px; margin:0 0 14px; background:#fff; border-radius:12px; border:1px solid #e8edf5; }
.team-bios h3 { margin:0 0 6px; }
.team-bios h3 span { color:#607089; font-weight:600; }

.contact-list { line-height: 1.9; }
.contact-form label { display:block; font-weight:600; margin: 10px 0 6px; }
.contact-form input, .contact-form textarea { width:100%; padding:12px; border-radius:12px; border:1px solid #dfe6f2; background:#fff; }
.contact-form button { margin-top:10px; }
.map-placeholder { background:#fafbfe; padding: 0 0 40px; }
.map-box { border:1px dashed #cfd9ea; padding:24px; border-radius:18px; text-align:center; color:#5b6a80; }

.site-footer { background:#0f1724; color:#cdd6e6; padding: 28px 0; margin-top: 38px; }
.site-footer h4 { color:#fff; margin:0 0 10px; }
.footer-grid { display:grid; grid-template-columns: 1.1fr .9fr .9fr; gap:18px; }
.site-footer a { color:#cdd6e6; }
.tiny { border-top:1px solid #233044; opacity:.8; margin-top:18px; padding-top:14px; font-size:14px; }

@media (max-width: 900px) {
  .hero-inner, .grid-2, .team, .three, .cards-4, .footer-grid { grid-template-columns: 1fr; }
  .nav { display:none; position: absolute; right: 4%; top: 60px; background:#fff; border:1px solid #e8edf5; border-radius:12px; padding:12px; flex-direction:column; }
  .menu-toggle { display:block; }
}


/* Home expansions */
.kpis { background:#fff; padding: 28px 0; border-top:1px solid #eef2f8; border-bottom:1px solid #eef2f8; }
.kpi { text-align:center; padding:10px 0; }
.kpi-n { font-size: clamp(28px, 4vw, 40px); font-weight:800; color: var(--blue); }
.kpi-l { color:#5b6a80; }
.steps { display:grid; grid-template-columns: repeat(4, 1fr); gap:12px; margin-top:14px; }
.step { background:#fff; border:1px solid #e8edf5; border-radius:14px; padding:14px; text-align:center; }
.step span { display:inline-grid; place-items:center; width:32px; height:32px; background: var(--red); color:#fff; border-radius:999px; font-weight:700; margin-bottom:8px; }
.gallery-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:12px; }
.stock, .hero-stock { border-radius:16px; border:1px solid #e8edf5; }
.hero-stock { width:100%; margin:14px 0; }

@media (max-width: 900px) {
  .steps { grid-template-columns: repeat(2, 1fr); }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); }
}

/* Page hero stock image spacing */
.page-hero img.hero-stock { margin-bottom: 12px; }

.refs { display:grid; grid-template-columns: repeat(3, 1fr); gap:16px; }
.refs article { background:#fff; border:1px solid #e8edf5; border-radius:14px; padding:14px; }
@media (max-width: 900px) { .refs { grid-template-columns: 1fr; } }
