/* Site-wide mobile responsive overrides — loaded after page inline styles */

@media (max-width: 900px) {
  body {
    overflow-x: hidden;
    padding-bottom: 72px !important;
  }

  /* ── Layout & spacing ── */
  header > div,
  section > div,
  footer > div {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  section > div[style*="padding:76px"],
  section > div[style*="padding: 76px"],
  section > div[style*="padding:64px"],
  section > div[style*="padding: 64px"],
  section > div[style*="padding:58px"],
  section > div[style*="padding: 58px"],
  section > div[style*="padding:70px"],
  section > div[style*="padding: 70px"],
  section > div[style*="padding:66px"],
  section > div[style*="padding: 66px"] {
    padding-top: 44px !important;
    padding-bottom: 44px !important;
  }

  [style*="padding:70px 36px"],
  [style*="padding: 70px 36px"] {
    padding: 44px 18px !important;
  }

  [style*="padding:28px 30px"],
  [style*="padding: 28px 30px"] {
    padding: 20px 18px !important;
  }

  /* Main quote form — stack phone/city row */
  #quote form [style*="display:flex"][style*="gap:10px"],
  #quote form [style*="display:flex"][style*="gap: 10px"] {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
  }

  #quote form [style*="flex:1 1 150px"],
  #quote form [style*="flex:1 1 190px"],
  #quote form [style*="flex:1 1 170px"] {
    flex: 1 1 100% !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  #quote button[type="submit"] {
    width: 100% !important;
  }

  /* White form card inside #quote */
  #quote [style*="border-radius:30px"],
  #quote [style*="border-radius: 30px"] {
    padding: 24px 20px !important;
    border-radius: 22px !important;
  }

  section > div[style*="padding:36px"],
  section > div[style*="padding: 36px"]:not([style*="padding:76px"]):not([style*="padding:64px"]):not([style*="padding:58px"]) {
    padding-top: 28px !important;
    padding-bottom: 28px !important;
  }

  [style*="padding:64px 36px"],
  [style*="padding:64px 36px 74px"],
  [style*="padding: 64px 36px"],
  [style*="padding: 64px 36px 74px"] {
    padding: 40px 18px 48px !important;
  }

  [style*="padding:76px 36px"],
  [style*="padding: 76px 36px"] {
    padding: 44px 18px !important;
  }

  [style*="padding:58px 36px"],
  [style*="padding: 58px 36px"] {
    padding: 36px 18px 24px !important;
  }

  [style*="padding:44px 48px"],
  [style*="padding: 44px 48px"],
  [style*="padding:40px"],
  [style*="padding: 40px"],
  [style*="padding:36px 40px"],
  [style*="padding: 36px 40px"],
  [style*="padding:34px 40px"],
  [style*="padding: 34px 40px"],
  [style*="padding:34px 38px"],
  [style*="padding: 34px 38px"],
  [style*="padding:32px 36px"],
  [style*="padding: 32px 36px"] {
    padding: 22px !important;
  }

  [style*="padding:30px 34px"],
  [style*="padding: 30px 34px"],
  [style*="padding:28px 30px"],
  [style*="padding: 28px 30px"],
  [style*="padding:26px 28px"],
  [style*="padding: 26px 28px"],
  [style*="padding:24px 26px"],
  [style*="padding: 24px 26px"],
  [style*="padding:28px 32px"],
  [style*="padding: 28px 32px"],
  [style*="padding:22px 24px 24px"],
  [style*="padding: 22px 24px 24px"] {
    padding: 20px !important;
  }

  [style*="padding:32px"]:not([style*="padding:32px 36px"]):not([style*="padding:32px 36px"]) {
    padding: 22px !important;
  }

  [style*="gap:52px"],
  [style*="gap: 52px"],
  [style*="gap:48px"],
  [style*="gap: 48px"],
  [style*="gap:44px"],
  [style*="gap: 44px"],
  [style*="gap:34px"],
  [style*="gap: 34px"],
  [style*="gap:56px"],
  [style*="gap: 56px"] {
    gap: 20px !important;
  }

  [style*="border-radius:40px"],
  [style*="border-radius: 40px"] {
    border-radius: 24px !important;
  }

  [style*="margin:0 12px"],
  [style*="margin: 0 12px"],
  [style*="margin:0px 12px"],
  [style*="margin: 0px 12px"] {
    margin-left: 6px !important;
    margin-right: 6px !important;
  }

  section[style*="border-radius:0 0 40px"],
  section[style*="border-radius: 0 0 40px"] {
    border-radius: 0 0 24px 24px !important;
  }

  footer[style*="border-radius:40px"],
  footer[style*="border-radius: 40px"] {
    border-radius: 24px 24px 0 0 !important;
  }

  [style*="min-width:420px"],
  [style*="min-width: 420px"],
  [style*="min-width:380px"],
  [style*="min-width: 380px"],
  [style*="min-width:320px"],
  [style*="min-width: 320px"],
  [style*="min-width:300px"],
  [style*="min-width: 300px"],
  [style*="min-width:240px"],
  [style*="min-width: 240px"] {
    min-width: 0 !important;
  }

  /* ── Typography ── */
  h1 {
    font-size: 31px !important;
    line-height: 1.1 !important;
    letter-spacing: -0.028em !important;
    max-width: none !important;
  }

  h2 {
    font-size: 25px !important;
    line-height: 1.15 !important;
    letter-spacing: -0.022em !important;
    max-width: none !important;
  }

  h3 {
    font-size: 18.5px !important;
  }

  [style*="font-size:59px"],
  [style*="font-size: 59px"],
  [style*="font-size:46px"],
  [style*="font-size: 46px"],
  [style*="font-size:42px"],
  [style*="font-size: 42px"] {
    font-size: 28px !important;
    line-height: 1.1 !important;
    max-width: none !important;
  }

  [style*="font-size:36px"],
  [style*="font-size: 36px"],
  [style*="font-size:34px"],
  [style*="font-size: 34px"],
  [style*="font-size:30px"],
  [style*="font-size: 30px"] {
    font-size: 25px !important;
  }

  [style*="font-size:27px"],
  [style*="font-size: 27px"],
  [style*="font-size:26px"],
  [style*="font-size: 26px"],
  [style*="font-size:24px"],
  [style*="font-size: 24px"],
  [style*="font-size:22.5px"],
  [style*="font-size: 22.5px"],
  [style*="font-size:22px"],
  [style*="font-size: 22px"],
  [style*="font-size:21px"],
  [style*="font-size: 21px"] {
    font-size: 18.5px !important;
  }

  [style*="font-size:20px"],
  [style*="font-size: 20px"],
  [style*="font-size:19.5px"],
  [style*="font-size: 19.5px"],
  [style*="font-size:19px"],
  [style*="font-size: 19px"],
  [style*="font-size:18.5px"],
  [style*="font-size: 18.5px"],
  [style*="font-size:18px"],
  [style*="font-size: 18px"],
  [style*="font-size:17.5px"],
  [style*="font-size: 17.5px"] {
    font-size: 16.5px !important;
  }

  p[style*="max-width"] {
    max-width: none !important;
  }

  /* ── Grids — collapse multi-column layouts ── */
  [style*="display:grid"],
  [style*="display: grid"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  /* 4-column stat / logo grids → 2 columns */
  [style*="grid-template-columns:repeat(4"],
  [style*="grid-template-columns: repeat(4"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  /* 3-column grids → 1 column (reviews, categories) */
  [style*="grid-template-columns:repeat(3"],
  [style*="grid-template-columns: repeat(3"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  /* 7-column mill wall → 3 columns */
  #mill-wall {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 9px !important;
  }

  #mill-wall > div {
    height: 62px !important;
    padding: 9px !important;
  }

  /* Logo wall */
  #logo-wall {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  #logo-wall > div {
    height: 64px !important;
    padding: 10px !important;
  }

  /* 2-column small grids inside cards — keep 2-up where sensible */
  #quote [style*="grid-template-columns:1fr 1fr"],
  #quote [style*="grid-template-columns: 1fr 1fr"],
  .hero-quote-card [style*="grid-template-columns:repeat(auto-fit"],
  [style*="grid-template-columns:repeat(2,minmax(0,1fr))"],
  [style*="grid-template-columns: repeat(2,minmax(0,1fr))"],
  footer [style*="grid-template-columns:repeat(2"],
  footer [style*="grid-template-columns: repeat(2"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  /* Fabric recommender spec cards */
  [style*="grid-template-columns:1fr 1fr 1fr auto"],
  [style*="grid-template-columns: 1fr 1fr 1fr auto"] {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
    padding: 20px !important;
  }

  [style*="grid-template-columns:1fr 1fr 1fr auto"] a,
  [style*="grid-template-columns: 1fr 1fr 1fr auto"] a {
    width: 100% !important;
    text-align: center !important;
    justify-self: stretch !important;
    white-space: normal !important;
  }

  /* ── Flex rows — stack CTA bands ── */
  [style*="display:flex"][style*="align-items:center"][style*="justify-content:space-between"] {
    flex-wrap: wrap !important;
    gap: 12px !important;
  }

  [style*="display:flex"][style*="align-items:center"][style*="gap:34px"],
  [style*="display:flex"][style*="align-items:center"][style*="gap: 34px"],
  [style*="display:flex"][style*="align-items:center"][style*="gap:30px"],
  [style*="display:flex"][style*="align-items:center"][style*="gap: 30px"],
  [style*="display:flex"][style*="align-items:center"][style*="gap:28px"],
  [style*="display:flex"][style*="align-items:center"][style*="gap: 28px"],
  [style*="display:flex"][style*="align-items:center"][style*="gap:26px"],
  [style*="display:flex"][style*="align-items:center"][style*="gap: 26px"] {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 18px !important;
  }

  [style*="display:flex"][style*="align-items:center"][style*="gap:34px"] > div:last-child,
  [style*="display:flex"][style*="align-items:center"][style*="gap: 34px"] > div:last-child,
  [style*="display:flex"][style*="align-items:center"][style*="gap:30px"] > div:last-child,
  [style*="display:flex"][style*="align-items:center"][style*="gap: 30px"] > div:last-child {
    width: 100% !important;
  }

  [style*="display:flex"][style*="align-items:center"][style*="gap:34px"] > div:last-child a,
  [style*="display:flex"][style*="align-items:center"][style*="gap: 34px"] > div:last-child a,
  [style*="display:flex"][style*="align-items:center"][style*="gap:30px"] > div:last-child a,
  [style*="display:flex"][style*="align-items:center"][style*="gap: 30px"] > div:last-child a {
    flex: 1 1 auto !important;
    text-align: center !important;
    justify-content: center !important;
  }

  /* ── Images & media ── */
  [style*="rotate(1.2deg)"],
  [style*="rotate(3deg)"],
  [style*="rotate(-1.5deg)"] {
    transform: none !important;
  }

  img[style*="height:530px"],
  img[style*="height: 530px"],
  img[style*="height:500px"],
  img[style*="height: 500px"],
  img[style*="height:460px"],
  img[style*="height: 460px"],
  img[style*="height:420px"],
  img[style*="height: 420px"] {
    height: 260px !important;
    width: 100% !important;
    object-fit: cover !important;
  }

  img[style*="height:320px"],
  img[style*="height: 320px"],
  img[style*="height:290px"],
  img[style*="height: 290px"],
  img[style*="height:260px"],
  img[style*="height: 260px"],
  img[style*="height:252px"],
  img[style*="height: 252px"],
  img[style*="height:250px"],
  img[style*="height: 250px"],
  img[style*="height:238px"],
  img[style*="height: 238px"],
  img[style*="height:216px"],
  img[style*="height: 216px"] {
    height: 200px !important;
    width: 100% !important;
    object-fit: cover !important;
  }

  iframe {
    max-width: 100% !important;
    width: 100% !important;
    min-height: 220px;
  }

  /* Hero floating cards */
  [style*="position:absolute"][style*="width:318px"],
  [style*="position: absolute"][style*="width: 318px"] {
    position: static !important;
    width: auto !important;
    margin-top: 14px !important;
    animation: none !important;
    box-shadow: 0 18px 40px -22px rgba(0, 0, 0, 0.45) !important;
  }

  [style*="position:absolute"][style*="top:-16px"],
  [style*="position: absolute"][style*="top: -16px"] {
    position: static !important;
    margin-top: 12px !important;
    animation: none !important;
    display: inline-block !important;
  }

  [style*="position:absolute"][style*="left:-24px"],
  [style*="position: absolute"][style*="left: -24px"] {
    left: auto !important;
    bottom: auto !important;
  }

  [style*="min-height:460px"],
  [style*="min-height: 460px"],
  [style*="min-height:440px"],
  [style*="min-height: 440px"],
  [style*="min-height:420px"],
  [style*="min-height: 420px"],
  [style*="min-height:300px"],
  [style*="min-height: 300px"],
  [style*="min-height:210px"],
  [style*="min-height: 210px"] {
    min-height: 0 !important;
  }

  /* ── Forms & inputs ── */
  input,
  select,
  textarea {
    font-size: 16px !important;
    min-height: 50px !important;
    max-width: 100%;
  }

  textarea {
    min-height: 100px !important;
  }

  .main-quote-form label,
  .main-quote-form .quote-field-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
  }

  .main-quote-form .quote-field-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
  }

  /* ── Cards & FAQ ── */
  details summary {
    padding: 16px 18px !important;
    gap: 12px !important;
  }

  details summary h3 {
    font-size: 16px !important;
  }

  details p {
    padding: 0 18px 18px !important;
  }

  /* ── Touch targets ── */
  button,
  a[style*="border-radius:999px"],
  a[style*="border-radius: 999px"] {
    min-height: 48px !important;
  }

  header a[href^="tel:"],
  footer a[href^="tel:"],
  footer a[href^="mailto:"] {
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  footer [style*="flex-direction:column"] > a,
  footer [style*="flex-direction: column"] > a {
    min-height: 40px !important;
    display: flex !important;
    align-items: center !important;
  }

  /* ── Fixed bottom bar ── */
  [style*="position:fixed"][style*="bottom:0"],
  [style*="position: fixed"][style*="bottom: 0"] > div {
    max-width: 100% !important;
    padding: 9px 10px !important;
    gap: 6px !important;
  }

  [style*="position:fixed"][style*="bottom:0"] a,
  [style*="position: fixed"][style*="bottom: 0"] a {
    padding: 12px 8px !important;
    font-size: 13px !important;
    flex: 1 1 0 !important;
    text-align: center !important;
    min-height: 46px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
  }

  [style*="position:fixed"][style*="bottom:0"] > div > span,
  [style*="position: fixed"][style*="bottom: 0"] > div > span {
    display: none !important;
  }

  [style*="position:fixed"][style*="bottom:0"] > div > div,
  [style*="position: fixed"][style*="bottom: 0"] > div > div {
    width: 100% !important;
    margin-left: 0 !important;
  }

  .mm-panel {
    display: none !important;
  }
}

@media (max-width: 560px) {
  h1 {
    font-size: 28px !important;
  }

  h2 {
    font-size: 23px !important;
  }

  [style*="font-size:59px"],
  [style*="font-size: 59px"],
  [style*="font-size:46px"],
  [style*="font-size: 46px"],
  [style*="font-size:42px"],
  [style*="font-size: 42px"] {
    font-size: 26px !important;
  }

  #logo-wall {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #mill-wall {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  [style*="grid-template-columns:repeat(4"],
  [style*="grid-template-columns: repeat(4"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  footer [style*="grid-template-columns:repeat(2"],
  footer [style*="grid-template-columns: repeat(2"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #quote [style*="grid-template-columns:1fr 1fr"],
  #quote [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}