/* Mobile responsiveness patch — overrides fixed desktop inline styles below 860px/600px.
   NOTE: the DC/React runtime re-serializes inline style="a:b" as "a: b" (space after colon)
   with rgb() colors. Every attribute selector below is duplicated for both the raw-authored
   (no space) and runtime-serialized (space) forms so it matches in every environment. */

html, body { overflow-x: hidden; max-width: 100%; }
img, svg, .aura { max-width: 100%; }

/* Nav bar must never overflow, at ANY width — wrap unconditionally */
div[style*="padding:24px 56px"][style*="justify-content:space-between"],
div[style*="padding: 24px 56px"][style*="justify-content: space-between"] {
  flex-wrap: wrap !important;
  row-gap: 10px !important;
  padding: 16px 20px !important;
}
div[style*="padding:24px 56px"][style*="justify-content:space-between"] > div[style*="gap:26px"],
div[style*="padding:24px 56px"][style*="justify-content:space-between"] > div[style*="gap:30px"],
div[style*="padding: 24px 56px"][style*="justify-content: space-between"] > div[style*="gap: 26px"],
div[style*="padding: 24px 56px"][style*="justify-content: space-between"] > div[style*="gap: 30px"] {
  flex-wrap: wrap !important;
  gap: 8px 14px !important;
  row-gap: 8px !important;
  justify-content: flex-end !important;
}

@media (max-width: 860px) {
  /* Stack every multi-column grid (hero splits, image+text, card grids, TOC layouts) */
  div[style*="display:grid"],
  div[style*="display: grid"] {
    grid-template-columns: 1fr !important;
  }

  /* Section padding: cut generous horizontal/vertical desktop padding down */
  div[style*="padding:88px 56px"], div[style*="padding:92px 56px"],
  div[style*="padding:96px 56px"], div[style*="padding:100px 56px"],
  div[style*="padding:84px 56px"], div[style*="padding:64px 56px"],
  div[style*="padding:56px 56px"], div[style*="padding:90px 56px"],
  div[style*="padding:80px 56px"], div[style*="padding:0 56px"],
  div[style*="padding: 88px 56px"], div[style*="padding: 92px 56px"],
  div[style*="padding: 96px 56px"], div[style*="padding: 100px 56px"],
  div[style*="padding: 84px 56px"], div[style*="padding: 64px 56px"],
  div[style*="padding: 56px 56px"], div[style*="padding: 90px 56px"],
  div[style*="padding: 80px 56px"], div[style*="padding: 0 56px"] {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  /* Breadcrumb / TOC article + sidebar padding, sidebar stops being sticky */
  article[style*="padding:64px 72px"], article[style*="padding: 64px 72px"] {
    padding: 40px 20px !important;
  }
  aside[style*="padding:64px 32px"], aside[style*="padding: 64px 32px"] {
    padding: 28px 20px !important;
  }
  aside div[style*="position:sticky"], aside div[style*="position: sticky"] {
    position: static !important;
    top: auto !important;
  }

  /* Headline sizing */
  h1 { font-size: clamp(30px, 8vw, 44px) !important; line-height: 1.15 !important; }
  h2 { font-size: clamp(24px, 6.5vw, 32px) !important; }
  h3 { font-size: clamp(19px, 5vw, 24px) !important; }
}

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