/* ============================================================
   HOME PAGE — MOBILE-ONLY REFINEMENTS
   Loaded only on index.html and last in the cascade so it wins.
   Everything here is wrapped in a max-width query, so desktop
   is untouched.
   ============================================================ */

/* The header CTA mobile fit/label rules now live in sections.css so
   every page shares them. This file keeps only home-specific tweaks. */

/* --- Hero CTA: let the long label wrap instead of overflowing ---
   .btn sets white-space:nowrap, which pushed the arrow off the
   right edge on narrow screens. */
@media (max-width: 680px) {
  .hero-big-btn {
    white-space: normal;
    line-height: 1.2;
    text-align: center;
    padding: 16px 22px !important;
    font-size: 15px !important;
  }
}

/* --- Remove the creative carousel on mobile, and close the gap
   it left between the logos and the next section. --- */
@media (max-width: 680px) {
  .hero-rows { display: none !important; }
  .brand-strip { padding-bottom: clamp(18px, 6vw, 32px); }
  /* the extra top padding on the next section was there to breathe
     under the carousel — no longer needed. */
  .clients { padding-top: clamp(32px, 8vw, 48px); }
}

/* --- Trim one partner logo and center the strip so the remaining
   five sit as a tidy 3 + 2 group rather than left-aligned. --- */
@media (max-width: 680px) {
  .bs-slots {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 22px 26px;
  }
  .bs-slots .bs-slot { flex: 0 0 26%; }
  .bs-slots .bs-slot:nth-child(n+6) { display: none; }
}

/* --- Remove the YouTube section on mobile --- */
@media (max-width: 680px) {
  .youtube { display: none !important; }
}

/* --- Drop one partner on mobile only (Nosto stays on desktop) so the
   grid reads as an even set on a narrow screen. --- */
@media (max-width: 680px) {
  #partner-grid .partner-cell[title="Nosto"] { display: none; }
}