/* Generated by scratchpad/gen_responsive.py from the inline styles in
   views/. The design ships as a fixed 1440px canvas with everything inline, so
   overriding those exact declarations is the only lever available.
   ponytail: substring selectors on inline styles; if the design ever moves to
   classes, delete this file and use them instead. */

.shell { overflow-x: clip; } /* clip, not hidden: hidden makes .shell a scroll container and breaks position: sticky inside it */
img, svg, video { max-width: 100%; }

@media (max-width: 1180px) {
  [style*="grid-template-columns:1.4fr 1fr 1fr 1fr 1fr"],
  [style*="grid-template-columns:repeat(4,1fr)"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 900px) {
  [style*="grid-template-columns:1.15fr 1fr"],
  [style*="grid-template-columns:1.1fr 1fr"],
  [style*="grid-template-columns:1.2fr 1fr"],
  [style*="grid-template-columns:1.3fr 1fr"],
  [style*="grid-template-columns:1.4fr 1fr 1fr"],
  [style*="grid-template-columns:1.4fr 1fr 1fr 1fr 1fr"],
  [style*="grid-template-columns:1fr 1.05fr"],
  [style*="grid-template-columns:1fr 1.15fr"],
  [style*="grid-template-columns:1fr 1.1fr"],
  [style*="grid-template-columns:1fr 1.3fr"],
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns:1fr 1fr 1fr"],
  [style*="grid-template-columns:1fr 3fr"],
  [style*="grid-template-columns:200px 1fr"],
  [style*="grid-template-columns:280px 1fr"],
  [style*="grid-template-columns:2fr 1fr 1fr 1fr"],
  [style*="grid-template-columns:80px 1fr 1fr"],
  [style*="grid-template-columns:repeat(3,1fr)"],
  [style*="grid-template-columns:repeat(3,max-content)"],
  [style*="grid-template-columns:repeat(4,1fr)"],
  [style*="grid-template-columns:repeat(5,1fr)"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  [style*="padding:0 72px 56px"],
  [style*="padding:0 72px 64px"],
  [style*="padding:18px 56px"],
  [style*="padding:18px 72px"],
  [style*="padding:20px 72px"],
  [style*="padding:24px 72px"],
  [style*="padding:24px 72px 64px"],
  [style*="padding:32px 72px 64px"],
  [style*="padding:32px 72px 72px"],
  [style*="padding:40px 72px 64px"],
  [style*="padding:48px 72px 72px"],
  [style*="padding:56px 72px"],
  [style*="padding:56px 72px 32px"],
  [style*="padding:56px 72px 60px"],
  [style*="padding:64px 72px"],
  [style*="padding:64px 72px 24px"],
  [style*="padding:64px 72px 32px"],
  [style*="padding:64px 72px 40px"],
  [style*="padding:64px 72px 72px"],
  [style*="padding:72px"],
  [style*="padding:72px 72px 40px"],
  [style*="padding:72px 72px 80px"],
  [style*="padding:76px 72px"],
  [style*="padding:76px 72px 68px"],
  [style*="padding:80px 72px"],
  [style*="padding:80px 72px 88px"] {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  /* Stacked heroes and CTA rows: let the two halves sit under each other. */
  [style*="display:flex"][style*="justify-content:space-between"] {
    flex-wrap: wrap;
  }
  [style*="position:sticky"] {
    position: static !important;
  }
  h1[style] { font-size: 34px !important; }
  h2[style*="font-size:32px"] { font-size: 26px !important; }
  [style*="height:420px"] { height: 260px !important; }
  [style*="height:360px"] { height: 220px !important; }
}

@media (max-width: 900px) {
  /* Grid and flex children default to min-width:auto, so one wide child (a CTA
     row, a long heading) keeps the whole column at its intrinsic width and the
     page overflows sideways. These three rules are what actually make the
     fixed-canvas design fit a phone. */
  .shell *,
  .shell {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .shell [style*="display:flex"] {
    flex-wrap: wrap !important;
  }
  .shell [style*="white-space:nowrap"] {
    white-space: normal !important;
  }
}

@media (max-width: 620px) {
  [style*="padding:18px 56px"],
  [style*="white-space:nowrap"] {
    white-space: normal !important;
  }
  [style*="display:flex"][style*="gap:18px"] { flex-wrap: wrap; }
  h1[style] { font-size: 28px !important; }
}