/* style.css - custom additions to match Elementor template */

/* container-custom: EXACT max-width 1200px and centered with responsive padding */
.container-custom {
  max-width: 1150px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
}

/* Slight adjustments to mimic Elementor fixed heights and radii where used */
@media (min-width: 768px) {
  /* Increase internal padding for desktop when needed */
  .container-custom { padding-left: 24px; padding-right: 24px; }
}

/* Card and hero adjustments */
.rounded-tr-xl { border-top-right-radius: 12px; }
.rounded-br-lg { border-bottom-right-radius: 12px; }

.bg-cover { background-repeat: no-repeat; background-size: cover; }

/* If you need to limit hero min-height like JSON (650px) for large screens */
@media (min-width: 768px) {
  .hero-min-h { min-height: 650px; }
}

/* Utility to keep images tidy */
img { display: block; max-width: 100%; height: auto; }

/* Example: ensure headings don't jump if Roboto loads late */
h1, h2, h3, h4, h5 { font-family: 'Roboto', sans-serif; }

/* Small typography tweaks to reflect the JSON font sizing */
h1 { font-weight: 600; }
h2 { font-weight: 600; }
h3 { font-weight: 600; }

/* Preserve colors frequently used in the template as CSS variables (optional) */
:root{
  --dark-navy: #040054;
  --green: #6CC037;
  --deep-blue: #08006F;
  --panel-blue: #02005A;
  --panel-darker: #000556;
  --cta-green: #32873E;
  --cta-green-hover: #107649;
}