/* ============================================================
   EMC Group — Visual polish layer
   Loaded after each page's own <style> block. Refines shadows,
   spacing and card treatment without changing the brand palette
   (navy #004d80 / amber #f9b233) or layout structure.
   ============================================================ */

:root {
  --emc-navy: #004d80;
  --emc-navy-deep: #003459;
  --emc-amber: #f9b233;
  --emc-ink: #24303d;
  --emc-muted: #64748b;
  --emc-border: #e6e9f0;
  --emc-surface: #ffffff;
  --emc-shadow-rest: 0 1px 2px rgba(0, 45, 77, 0.06), 0 10px 28px -12px rgba(0, 45, 77, 0.16);
  --emc-shadow-hover: 0 2px 4px rgba(0, 45, 77, 0.08), 0 22px 40px -16px rgba(0, 45, 77, 0.24);
}

/* Slightly warmer, higher-contrast body text than the site default */
body { color: var(--emc-ink); }

/* --- Section rhythm: a touch more breathing room on desktop --- */
@media (min-width: 992px) {
  section.py-5, #sector-content, section#about, section#qhse-content {
    padding-top: 6rem !important;
    padding-bottom: 6rem !important;
  }
}

/* --- Cards: replace the flat grey "SaaS kit" shadow with a soft,
   navy-tinted shadow, and give cards a touch more internal air --- */
.news-item,
.info-card,
.card-values,
.card-cert,
.card-ref,
.ref-card,
.info-card.p-4 {
  box-shadow: var(--emc-shadow-rest) !important;
  border: 1px solid var(--emc-border) !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}
.news-item:hover,
.info-card:hover,
.card-values:hover,
.card-cert:hover,
.card-ref:hover,
.ref-card:hover {
  box-shadow: var(--emc-shadow-hover) !important;
  transform: translateY(-3px) !important;
}

/* Give card bodies a little more room to breathe */
.card-body, .news-content, .info-card { padding: 1.5rem !important; }

/* --- Buttons: slightly deeper, more deliberate hover state --- */
.btn-warning {
  background-color: var(--emc-amber);
  border: none;
  color: var(--emc-navy-deep);
  font-weight: 600;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}
.btn-warning:hover {
  background-color: #ffc95c;
  color: var(--emc-navy-deep);
  transform: translateY(-2px);
  box-shadow: 0 10px 22px -8px rgba(249, 178, 51, 0.55);
}
.btn-outline-primary {
  border-color: var(--emc-navy);
  color: var(--emc-navy);
}
.btn-outline-primary:hover {
  background-color: var(--emc-navy);
  border-color: var(--emc-navy);
}

/* --- Hero sections: slightly deeper overlay gradient for better
   text contrast, and a touch of letter-spacing restraint on H1 --- */
.hero-section h1 { letter-spacing: -0.01em; }

/* --- CTA sections: subtle gradient instead of flat navy fill --- */
.cta-section {
  background: linear-gradient(135deg, var(--emc-navy) 0%, var(--emc-navy-deep) 100%) !important;
}

/* --- Muted secondary text (small tags under headings, etc.) --- */
.ref-card small, .text-muted { color: var(--emc-muted) !important; }

/* --- Footer: quieter, more finished --- */
footer { border-top: 1px solid var(--emc-border) !important; }

/* --- Respect reduced motion preference --- */
@media (prefers-reduced-motion: reduce) {
  .news-item, .info-card, .card-values, .card-cert, .card-ref, .ref-card, .btn-warning {
    transition: none !important;
  }
}