/* ===== CRITICAL OVERFLOW PREVENTION ===== */
/* This file contains critical CSS rules to prevent horizontal scrolling on mobile devices */

/* Global overflow prevention */
html {
  overflow-x: hidden !important;
  max-width: 100vw !important;
}

body {
  overflow-x: hidden !important;
  max-width: 100vw !important;
  width: 100% !important;
}

/* Container and grid system fixes */
.container,
.container-fluid,
.container-sm,
.container-md,
.container-lg,
.container-xl,
.container-xxl {
  max-width: 100% !important;
  overflow-x: hidden !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  box-sizing: border-box !important;
}

.row {
  margin-left: -15px !important;
  margin-right: -15px !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

/* All Bootstrap columns */
[class*="col-"] {
  padding-left: 15px !important;
  padding-right: 15px !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
}

/* Images */
img {
  max-width: 100% !important;
  height: auto !important;
  box-sizing: border-box !important;
}

/* Tables */
table {
  width: 100% !important;
  max-width: 100% !important;
  table-layout: fixed !important;
  box-sizing: border-box !important;
}

/* Form elements */
.form-control,
.form-select,
.form-check-input,
input,
textarea,
select {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Buttons */
.btn {
  max-width: 100% !important;
  box-sizing: border-box !important;
  word-wrap: break-word !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Cards and components */
.card,
.service-card,
.testimonial-card,
.price-card,
.case-study-card,
.process-step,
.timeline-item,
.career-item,
.coreinfo-item,
.blog-card,
.contact-form,
.faq-item {
  max-width: 100% !important;
  box-sizing: border-box !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
}

/* Sections */
section,
.section,
.hero-section,
header,
footer,
.footer,
nav,
.navbar {
  max-width: 100vw !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}

/* Gallery specific */
.gallery-grid {
  max-width: 100% !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}

.gallery-item {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Text elements */
p, span, div, h1, h2, h3, h4, h5, h6,
.testimonial-text,
.card-text,
.hero-description,
.section-title,
.faq-question,
.faq-answer {
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
  hyphens: auto !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Mobile specific adjustments */
@media (max-width: 575.98px) {
  .container {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  
  .row {
    margin-left: -10px !important;
    margin-right: -10px !important;
  }
  
  [class*="col-"] {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  
  /* Force single column on mobile */
  .col-6,
  .col-md-4,
  .col-md-6,
  .col-lg-2,
  .col-lg-3,
  .col-lg-4,
  .col-lg-6 {
    width: 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

/* Very small screens */
@media (max-width: 359.98px) {
  .container {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
  
  .row {
    margin-left: -5px !important;
    margin-right: -5px !important;
  }
  
  [class*="col-"] {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
}

/* Prevent any element from exceeding viewport width */
* {
  max-width: 100vw !important;
  box-sizing: border-box !important;
}

/* Scrollbar fix */
::-webkit-scrollbar-horizontal {
  display: none !important;
}

/* Final safety net */
body * {
  max-width: 100% !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
} 