/* O1H SAFE RESPONSIVE FIX */
/* This file only fixes mobile layout without breaking desktop */

/* Stop sideways scrolling */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

/* Keep charcoal background */
body {
  background-color: #282829;
}

/* Images should never stretch badly */
img {
  max-width: 100%;
}

/* HOME PAGE IMAGE ONLY */
.home-hero {
  width: 100%;
  position: relative;
  overflow: hidden;
  background-color: #282829;
  margin-bottom: 2rem;
}

.home-hero-image {
  width: 100%;
  height: auto;
  display: block;
}

/* Desktop text on image */
.home-hero-content {
  position: absolute;
  left: 50%;
  bottom: 2.5rem;
  transform: translateX(-50%);
  width: 90%;
  max-width: 900px;
  text-align: center;
}

.home-hero-text {
  color: white;
  font-size: clamp(1.2rem, 2.5vw, 2.4rem);
  line-height: 1.2;
  font-weight: 700;
  text-shadow: 0 3px 12px rgba(0, 0, 0, 0.8);
  margin-bottom: 1.2rem;
}

.home-hero-button {
  display: inline-block;
  background-color: #ff5a14;
  color: white;
  font-weight: 700;
  padding: 0.85rem 2.2rem;
  border-radius: 999px;
  text-decoration: none;
}

/* Partner logo boxes */
.logo-carousel-container {
  max-width: 92%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 2rem;
}

/* MOBILE ONLY */
@media (max-width: 768px) {
  .home-hero {
    margin-bottom: 2rem;
  }

  .home-hero-image {
    width: 100%;
    height: auto;
    display: block;
  }

  .home-hero-content {
    position: static;
    transform: none;
    width: 100%;
    max-width: 100%;
    padding: 2rem 1rem 2.5rem;
    background-color: #282829;
  }

  .home-hero-text {
    font-size: 1.55rem;
    line-height: 1.25;
    margin-bottom: 1.5rem;
  }

  .home-hero-button {
    font-size: 1.2rem;
    padding: 1rem 2.5rem;
  }

  .logo-carousel-container {
    max-width: 94%;
    border-radius: 1.2rem;
    margin-bottom: 2rem;
  }

  .logo-item {
    width: 90px !important;
    height: 60px !important;
    margin-left: 1rem !important;
    margin-right: 1rem !important;
  }

  .glass-effect,
  .glass {
    margin-left: 1rem !important;
    margin-right: 1rem !important;
  }

  footer {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
}