/* ============================================================
   LCS HOSTING SOLUTIONS — Overflow & Scrollbar Fix
   Eliminates ALL horizontal scrollbars
   ============================================================ */

/* Root fix — prevent any horizontal overflow */
html, body {
  overflow-x: hidden !important;
  max-width: 100vw;
}

/* Fix Bootstrap row negative margins causing overflow */
.row {
  --bs-gutter-x: 1.5rem;
  margin-right: calc(var(--bs-gutter-x) * -0.5);
  margin-left: calc(var(--bs-gutter-x) * -0.5);
}

/* Constrain all sections to viewport */
section, footer, div[id], header, nav {
  max-width: 100vw;
  overflow-x: hidden;
}

/* Fix trust marquee — it must not cause horizontal scroll */
#trust-bar {
  overflow: hidden !important;
  max-width: 100vw;
}
.trust-marquee {
  width: max-content;
  overflow: visible;
}

/* Fix plan-includes-card column going off-screen */
.col-12.col-lg-3 {
  overflow: hidden;
}
.plan-includes-card {
  overflow: hidden;
  word-break: break-word;
}

/* Fix hero section overflow */
#hero {
  overflow: hidden !important;
}
#hero .row {
  overflow: hidden;
}
#hero .container {
  overflow: hidden;
}

/* Fix all containers */
.container, .container-fluid {
  overflow-x: hidden;
  max-width: 100%;
}

/* Fix Bootstrap columns overflow */
[class*="col-"] {
  min-width: 0;
  max-width: 100%;
}

/* Fix pricing section overflow */
#pricing {
  overflow-x: hidden;
}
.pricing-panel {
  overflow-x: hidden;
}

/* Fix portfolio grid overflow */
.portfolio-grid {
  overflow: hidden;
}

/* Fix testimonials grid overflow */
.testimonials-grid {
  overflow: hidden;
}

/* Fix footer overflow */
#footer-main, #footer-trust-bar, #footer-disclaimer, #footer-copyright {
  overflow-x: hidden;
}

#main-navbar { overflow: visible !important; }
#mega-menu { overflow: visible !important; }

/* Fix all flex/grid containers */
.d-flex, .d-grid {
  min-width: 0;
  max-width: 100%;
}

/* Prevent long text from causing overflow */
p, h1, h2, h3, h4, h5, h6, li, a, span, div {
  overflow-wrap: break-word;
  word-wrap: break-word;
}

/* Fix pre-footer section */
#pre-footer {
  overflow-x: hidden;
}

/* Fix newsletter section */
#newsletter-section {
  overflow-x: hidden;
}

/* Fix video testimonials section */
#video-testimonials {
  overflow-x: hidden;
}

/* Fix portfolio section */
#portfolio {
  overflow-x: hidden;
}

/* Fix data centers section */
#data-centers {
  overflow-x: hidden;
}

/* Fix services section */
#services {
  overflow-x: hidden;
}

/* Fix trust badges section */
#trust-badges {
  overflow-x: hidden;
}

/* Fix stats section */
#stats {
  overflow-x: hidden;
}

/* Fix FAQ section */
#faq {
  overflow-x: hidden;
}

/* Fix yellow plans intro section */
#plans-intro {
  overflow-x: hidden;
}

/* Fix page transition overlay */
.page-transition-overlay {
  overflow: hidden;
}

/* Remove custom scrollbar on horizontal axis */
::-webkit-scrollbar:horizontal {
  display: none;
}

/* Keep only vertical scrollbar styled */
::-webkit-scrollbar {
  width: 6px;
  height: 0px; /* hide horizontal scrollbar */
}
::-webkit-scrollbar-track {
  background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #FFD338 0%, #e6ae00 100%);
  border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
  background: #e6ae00;
}

/* Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #FFD338 #f1f5f9;
}

/* Pricing tabs horizontal scroll — keep but hide scrollbar */
.pricing-tabs {
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.pricing-tabs::-webkit-scrollbar {
  display: none;
}

/* Portfolio tabs horizontal scroll — keep but hide scrollbar */
.portfolio-tabs {
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.portfolio-tabs::-webkit-scrollbar {
  display: none;
}

/* Mobile specific — hard clamp */
@media (max-width: 767.98px) {
  html, body {
    overflow-x: hidden !important;
    width: 100%;
    position: relative;
  }
  * {
    max-width: 100vw;
  }
  img {
    max-width: 100%;
    height: auto;
  }
  /* Fix Bootstrap negative gutter on mobile */
  .row {
    margin-right: 0;
    margin-left: 0;
  }
  [class*="col-"] {
    padding-right: 0.75rem;
    padding-left: 0.75rem;
  }
}