/* Mobile-first layout tweaks without changing visuals */

/* General safety */
.section-hero h1 { word-break: break-word; hyphens: auto; }
.section-hero .underline-accent { display: block; height: 0.25rem; }

@media (max-width: 640px) {
  /* Consistent horizontal rhythm on small screens */
  main .container { padding-left: 1rem; padding-right: 1rem; }

  /* Hero */
  .section-hero h1 { font-size: clamp(1.75rem, 6vw, 2.25rem); line-height: 1.2; margin-bottom: 0.75rem; }
  .section-hero p { font-size: 1rem; line-height: 1.6; }

  /* About */
  .about-grid { gap: 1.25rem; }
  .about-grid .media { height: 14rem; border-radius: 1rem; }
  .about-grid .media img { width: 100%; height: 100%; object-fit: cover; }

  /* Services */
  .services-grid { gap: 1rem; }
  .service-card { transform: none !important; }
  .service-card .icon { width: 3.25rem; height: 3.25rem; font-size: 1.5rem; }
  .service-card h3 { font-size: 1.125rem; }
  .service-card p { font-size: 0.9375rem; }

  /* Customer logos */
  .logos-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
  .logos-grid img { max-height: 3.5rem; width: 100%; object-fit: contain; }

  /* CTA */
  .cta-section h2 { font-size: 1.75rem; }
  .cta-section p { font-size: 1rem; }
}

@media (min-width: 641px) and (max-width: 1024px) {
  .service-card h3 { font-size: 1.25rem; }
  .logos-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Safe-area support for iOS */
@supports (padding: env(safe-area-inset-bottom)) {
  .back-to-top { bottom: calc(1.5rem + env(safe-area-inset-bottom)); }
}
/* Fix burger menu clickability */
header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
}

header .container > div {
  position: relative !important;
  z-index: 1001 !important;
}

#drawerToggle {
  pointer-events: auto !important;
  cursor: pointer !important;
  position: relative !important;
  z-index: 1002 !important;
  background: transparent !important;
}

#drawerToggle i {
  pointer-events: none !important;
}

/* Ensure mobile drawer is above everything */
#mobileDrawer {
  z-index: 9999 !important;
}