/* ============================================================================
   Secure Loopholes — refinement layer (loaded LAST, overrides only).
   Non-destructive polish: no markup/design changes, just sizing & spacing.
   ========================================================================== */

/* ---- Headings: tidy line-height & spacing on all sizes ---- */
.elementor-widget-heading .elementor-heading-title { line-height: 1.25; }

/* ---- Tablet ---- */
@media (max-width: 1024px) {
  .elementor-widget-heading .elementor-heading-title { line-height: 1.22 !important; }
  /* oversized decorative icons (150px on About) */
  .elementor-element-b0f2238 .elementor-icon,
  .elementor-element-537948b .elementor-icon,
  .elementor-element-6e56d94 .elementor-icon { font-size: 96px !important; }
}

/* ---- Mobile (phones) ---- */
@media (max-width: 767px) {
  /* cap big headings so 50px heros fit a phone; small headings barely change */
  .elementor-widget-heading .elementor-heading-title {
    font-size: clamp(1.45rem, 7vw, 2rem) !important;
    line-height: 1.2 !important;
    overflow-wrap: anywhere;
  }
  /* big decorative icons down to phone size */
  .elementor-element-b0f2238 .elementor-icon,
  .elementor-element-537948b .elementor-icon,
  .elementor-element-6e56d94 .elementor-icon { font-size: 70px !important; }

  /* trim section padding further on phones (desktop handled by CSS cap) */
  .elementor-top-section { padding-top: 26px !important; padding-bottom: 26px !important; }

  /* keep body copy comfortably readable */
  .elementor-widget-text-editor,
  .elementor-widget-text-editor p { font-size: 1rem; line-height: 1.6; }

  /* certification badges: 2-up instead of 1-per-screen (they sit in a flex/grid row) */
  .elementor-widget-image img { height: auto; }
}

/* ---- Very small phones ---- */
@media (max-width: 400px) {
  .elementor-widget-heading .elementor-heading-title { font-size: clamp(1.3rem, 7vw, 1.7rem) !important; }
}