/* ============================================================
   ICB MOBILE FLOOR — responsive rescue layer
   ------------------------------------------------------------
   Purpose: the minimum sitewide safety net so no page is
   broken or trapped on a phone. NOT a redesign and NOT the
   responsive layout work — those come later with the new
   full-width templates and icb- components.

   How to deploy:
   - Load this AFTER the existing main stylesheet, as the last
     <link> in the template, so it wins on equal-specificity ties.
   - Pair it with the viewport meta tag (see handover notes).
   - These are element-level selectors only. They deliberately
     touch no icb- or legacy class names, so there is nothing
     to guess at and nothing layout-specific to break.
   ============================================================ */

/* Predictable sizing everywhere. Stops padding/border from
   pushing elements past their container width. */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Stop iOS auto-inflating text in landscape. */
html {
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
}

/* Long unbroken strings (URLs, SIC code text, reference numbers)
   are a classic cause of horizontal overflow. Let them wrap. */
body {
  overflow-wrap: break-word;
}

/* Media must never exceed its container. max-width (not width)
   caps oversized assets even where an explicit width is set
   elsewhere, without stretching small ones. */
img,
svg,
video,
iframe,
embed,
object {
  max-width: 100%;
  height: auto;
}

/* Form controls are a frequent overflow culprit on legacy sites. */
input,
select,
textarea,
button {
  max-width: 100%;
}

/* Cap tables so a wide grid can't force the whole page to scroll
   sideways. (The proper scroll-wrapper / card treatment for the
   AML client list and comparison tables comes later — this just
   stops them blowing out the page in the meantime.) */
table {
  max-width: 100%;
}

/* ------------------------------------------------------------
   BACKSTOP — read before keeping.
   This clips any remaining horizontal overflow so a single rogue
   fixed-width element can't give the whole site a sideways scroll
   on mobile. It HIDES the symptom rather than fixing the cause:
   if something is genuinely too wide, its right edge gets cut off
   off-screen instead of being made to fit.
   Keep it on for the initial ship as a tourniquet. During the
   post-ship eyeball pass, look for clipped content; once the real
   culprits are found and fixed, remove this rule.
   ------------------------------------------------------------ */
body {
  overflow-x: hidden;
}
