/* BoulevardLabs — mobile layer. Applies below 820px; desktop is untouched. */
@media (max-width: 820px) {
  html, body { overflow-x: clip !important; }
  [style*="min-width: 1280px"] { min-width: 0 !important; }
  [style*="max-width: 1440px"] { max-width: 100% !important; }

  /* horizontal gutters: 68px -> 20px */
  [style*="px 68px"], [style*="padding: 0px 68px"], [style*="padding-left: 68px"] { padding-left: 20px !important; padding-right: 20px !important; }
  [style*="margin: 0px -18px"] { margin-left: 0 !important; margin-right: 0 !important; }

  /* vertical section rhythm */
  [style*="padding: 100px"], [style*="padding: 96px"], [style*="padding: 94px"], [style*="padding: 92px"],
  [style*="padding: 88px"], [style*="padding: 86px"], [style*="padding: 84px"], [style*="padding: 80px"],
  [style*="padding: 76px"] { padding-top: 56px !important; padding-bottom: 56px !important; }

  /* grids stack */
  [style*="grid-template-columns: repeat("], [style*="grid-template-columns: minmax("] { grid-template-columns: 1fr !important; }
  [style*="grid-column: span"] { grid-column: auto !important; }
  [style*="grid-template-columns: 200px 1fr"], [style*="grid-template-columns: 130px 1fr"],
  [style*="grid-template-columns: 690px"], [style*="grid-template-columns: 230px 1fr"],
  [style*="grid-template-columns: 1fr 1fr"], [style*="grid-template-columns: 2fr"] { grid-template-columns: 1fr !important; }
  [style*="grid-template-columns: 200px 1fr 250px 40px"] { grid-template-columns: 1fr auto !important; row-gap: 8px !important; }
  [style*="gap: 56px"], [style*="gap: 48px"], [style*="gap: 72px"] { gap: 28px !important; }
  [style*="justify-content: space-between"] { flex-wrap: wrap; }
  [style*="display: flex"][style*="gap: 12px"] { flex-wrap: wrap; }

  /* type scale */
  h1 { font-size: 34px !important; line-height: 1.12 !important; }
  h2 { font-size: 27px !important; line-height: 1.18 !important; }
  h3[style*="font-size: 2"], h3[style*="font-size: 3"] { font-size: 21px !important; line-height: 1.26 !important; }
  p[style*="font-size: 17"], p[style*="font-size: 18"], p[style*="font-size: 19"] { font-size: 16px !important; }
  :not(.pd-dash *)[style*="font-size: 8px"], :not(.pd-dash *)[style*="font-size: 8.5px"],
  :not(.pd-dash *)[style*="font-size: 9px"], :not(.pd-dash *)[style*="font-size: 9.5px"],
  :not(.pd-dash *)[style*="font-size: 10px"] { font-size: 11px !important; }
  :not(.pd-dash *)[style*="font-size: 13.5px; letter-spacing: 0.18em"] { font-size: 12px !important; }
  [style*="max-width: 760px"], [style*="max-width: 720px"], [style*="max-width: 940px"], [style*="max-width: 1000px"] { max-width: 100% !important; }

  /* hero */
  [style*="height: 880px"] { height: 720px !important; }
  .hero-copy { padding: 32px 20px 120px !important; }
  .hero-mobile-scrim { display: block !important; }
  .dw-hero { display: none !important; }
  .dw-info { display: none !important; }
  .dw-thumb { border-color: #1F1F29 !important; box-shadow: none !important; pointer-events: none !important; opacity: 1 !important; }
  .hero-copy h1 + p[style*="font-size: 36px"] { font-size: 20px !important; line-height: 1.3 !important; letter-spacing: -0.015em !important; margin-top: -2px !important; }
  [style*="position: absolute; right: 68px"] { right: 20px !important; }
  [style*="position: absolute; left: 68px"] { left: 20px !important; }

  /* desktop mega menu is replaced by the mobile drawer */
  [style*="position: absolute; top: 100%; left: 0px; width: 100%"] { display: none !important; }
  .bl-links { display: none !important; }

  /* iPad mockups scale to the phone */

  /* sticky side indexes become a horizontal strip */
  aside { position: static !important; width: auto !important; display: flex !important; overflow-x: auto; gap: 4px; padding: 12px 20px !important; }

  /* media */
  img[style*="max-width: 240px"] { max-width: 100% !important; }
  table { display: block; overflow-x: auto; }
  [style*="white-space: nowrap"] { white-space: normal !important; }
  [style*="width: 52px; height: 2px"] { width: 32px !important; }

  /* What We Do: detail panels move under their rows */
  .wd-mob.wd-on { display: flex !important; padding: 6px 14px 26px 16px; border-left: 2px solid var(--a); margin: 0 0 4px 14px; animation: wd-in .28s ease-out; }
  .wd-row + .wd-mob, .wd-row ~ .wd-mob { width: auto; }
  [style*="border-bottom: 1px solid rgb(26, 26, 34)"][style*="flex-direction: column"] > .wd-mob { align-self: stretch; }
  .wd-mob .wd-big svg { width: 40px !important; height: 40px !important; }
  .wd-mob p { max-width: 100% !important; }
  .wd-mob a { align-self: stretch !important; text-align: center; }
  .wd-row { flex: none !important; min-height: 56px; }
  .wd-row .wd-arrow { opacity: 1 !important; transform: rotate(90deg) !important; transition: transform .26s !important; }
  .wd-row.wd-on .wd-arrow { transform: rotate(-90deg) !important; }
  div:has(> .wd-panel) { display: none !important; }
  [style*="border-bottom: 1px solid rgb(26, 26, 34)"][style*="height: 100%"] { height: auto !important; }

  /* Hero carousel controls */
  .hero-nav { left: 20px !important; bottom: 30px !important; gap: 12px !important; right: 108px; }
  .hero-nav .hero-dot { width: 16px !important; }
  .hero-count { white-space: nowrap !important; font-size: 11px !important; flex: none; }
  .hero-nav .hero-dots { gap: 6px !important; }
  .hero-nav .hero-dot { width: 18px !important; }
  .hero-arrows { right: 20px !important; bottom: 22px !important; gap: 8px !important; }
  .hero-arrows > span { width: 40px !important; height: 40px !important; font-size: 13px !important; }
  /* No Soup Sandwich: image right, white fade from the left */
  .hero-nss { background-position: 88% center !important; }
  .hero-nss-fade { display: block !important; position: absolute; inset: 0; z-index: 2; pointer-events: none; background: linear-gradient(90deg, rgba(255,255,255,.98) 0%, rgba(255,255,255,.94) 50%, rgba(255,255,255,.7) 78%, rgba(255,255,255,.15) 100%); }

  /* Why Us: each platform sits above its numbered point; arrows dropped */
  .wy-stage { display: none !important; }
  .wy-mob { display: block !important; width: 100%; max-width: 330px; margin: 0 auto 6px; }
  .wy-cols > div { gap: 12px !important; }

  /* AI for Impact free resources: two covers per row */
  div:has(> .ai-res) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 18px 14px !important; }

  /* ---------- Capabilities page (mobile) ---------- */
  body:has(.cap-sec) aside { display: none !important; }
  .mc-bar { position: sticky; top: 62px; z-index: 40; background: rgba(255,255,255,.97); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); padding: 14px 20px 0; border-bottom: 1px solid #E2E2E7; }
  /* flatten the two-column block so copy, CTAs and proof can be reordered */
  .cap-sec [style*="grid-template-columns: repeat(12"] { display: contents !important; }
  .cap-sec > *, .cap-sec > div[style*="position: relative"] > * { order: 5; }
  .cap-sec [style*="grid-template-columns: repeat(12"]:not(.cap-detail *) > div:first-child { order: 1 !important; }
  .cap-sec [style*="grid-template-columns: repeat(12"]:not(.cap-detail *) + div { order: 2 !important; }
  .cap-sec [style*="grid-template-columns: repeat(12"]:not(.cap-detail *) > div:last-child { order: 3 !important; }
  .cap-detail { order: 6 !important; }
  .cap-detail [style*="grid-template-columns: repeat(12"] { display: grid !important; }
  .cap-detail * { order: 0 !important; }
  .cap-sec h2 { max-width: 100% !important; }
  /* tags: one swipeable row */
  .cap-sec [style*="grid-template-columns: repeat(12"]:not(.cap-detail *) > div:first-child > [style*="flex-wrap: wrap"] { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; margin-right: -20px; padding-right: 20px; }
  .cap-sec [style*="grid-template-columns: repeat(12"]:not(.cap-detail *) > div:first-child > [style*="flex-wrap: wrap"]::-webkit-scrollbar { display: none; }
  .cap-sec [style*="grid-template-columns: repeat(12"]:not(.cap-detail *) > div:first-child > [style*="flex-wrap: wrap"] > span { flex: none; white-space: nowrap; font-size: 11px !important; }
  /* CTAs stack, full width */
  .cap-sec [style*="grid-template-columns: repeat(12"]:not(.cap-detail *) + div { flex-direction: column !important; align-items: stretch !important; gap: 14px !important; }
  .cap-sec [style*="grid-template-columns: repeat(12"]:not(.cap-detail *) + div > * { justify-content: center; text-align: center; white-space: nowrap; min-height: 48px; display: flex !important; align-items: center; }
  /* delivery options: collapsed toggle */
  .mc-dl > span:first-child { font-size: 0 !important; cursor: pointer; }
  .mc-dl > span:first-child::before { content: 'DELIVERY OPTIONS +'; font-size: 11px; letter-spacing: .16em; }
  .mc-dl.mc-dl-open > span:first-child::before { content: 'DELIVERY OPTIONS \2212'; }
  .mc-dl > span:not(:first-child) { display: none !important; }
  .mc-dl.mc-dl-open { flex-direction: column; align-items: flex-start !important; }
  .mc-dl.mc-dl-open > span:not(:first-child) { display: block !important; font-size: 12px !important; }
  .mc-dl.mc-dl-open > span:not(:first-child):not([style*="font-size: 9px"]) { padding-left: 2px; }
  .mc-dl.mc-dl-open > span[style*="font-size: 9px"] { display: none !important; }

  /* Current Signal band (Industries hub + industry pages) */
  .sgb { grid-template-columns: 1fr !important; gap: 0 !important; padding-bottom: 20px !important; }
  .sgb > div:first-of-type { min-width: 0; }
  .sgb-item { padding: 22px 0 14px !important; min-width: 0; }
  .sgb-item > span:first-child { min-width: 0; }
  .sgb-item > span:first-child > span:last-child { white-space: normal !important; overflow: visible; font-size: 9.5px !important; line-height: 1.5; letter-spacing: .05em !important; min-width: 0; }
  .sgb-item > span:last-child { max-width: 100% !important; font-size: 17px !important; }
  .sgb > :last-child:not(:first-child) { justify-self: end; }

  /* Proven in Practice: one card at a time */
  .pp-track { gap: 0 !important; }
  .pp-track > .ppc { flex: 0 0 100% !important; }

  /* ---------- Products: portrait iPad + reflowed dashboards ---------- */
  .pr-tab { font-size: 10.5px !important; letter-spacing: .06em !important; }
  div:has(> .pr-tab) { flex-wrap: nowrap !important; gap: 0 !important; justify-content: space-between !important; }
  [style*="height: 773px"] { height: auto !important; overflow: visible !important; padding: 6px 0 24px; }
  [style*="width: 690px"][style*="scale(1.6)"] { width: min(330px, calc(100vw - 50px)) !important; transform: none !important; margin: 0 auto; }
  .pd-dash > div:first-child { height: 422px !important; }
  .pd-dash [style*="width: 1160px"] { width: 580px !important; height: 760px !important; transform: scale(.5) !important; }
  .pd-dash [style*="width: 1160px"] * { max-width: 100%; min-width: 0; }
  .pd-dash [style*="width: 1160px"] [style*="grid-template-columns"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .pd-dash [style*="width: 1160px"] > div:last-child { min-width: 0; flex: 1; overflow: hidden; }
  .pd-dash [style*="width: 1160px"] svg { width: 100% !important; height: auto !important; }

  /* RAM portrait dashboard */
  .pd-dash > div:first-child { position: relative; }
  /* keep the RAM dashboard's own grid/flex layout — exempt it from the mobile stacking rules */
  .pd-dash :is(.ram-mob,.st-mob) [style*="grid-template-columns: 1fr 1fr"] { grid-template-columns: 1fr 1fr !important; }
  .pd-dash :is(.ram-mob,.st-mob) [style*="grid-template-columns: repeat(4"] { grid-template-columns: repeat(4, 1fr) !important; }
  .pd-dash :is(.ram-mob,.st-mob) [style*="grid-template-columns: repeat(3"] { grid-template-columns: repeat(3, 1fr) !important; }
  .pd-dash .st-mob [style*="grid-template-columns: repeat(12"] { grid-template-columns: repeat(12, 1fr) !important; }
  .pd-dash .st-mob [style*="grid-template-columns: 2fr 1fr 1fr"] { grid-template-columns: 2fr 1fr 1fr !important; }
  .pd-dash .st-mob [style*="grid-template-columns: 1fr 1fr"] { grid-template-columns: 1fr 1fr !important; }
  .pd-dash .st-mob [style*="grid-template-columns: 1.5fr"] { grid-template-columns: 1.5fr repeat(5, 1fr) !important; }
  .pd-dash .st-mob [style*="grid-template-columns: 1.6fr"] { grid-template-columns: 1.6fr repeat(4, 1fr) !important; }
  .pd-dash :is(.ram-mob,.st-mob) [style*="justify-content: space-between"], .pd-dash :is(.ram-mob,.st-mob) [style*="display: flex"] { flex-wrap: nowrap !important; }
  .pd-dash :is(.ram-mob,.st-mob) [style*="gap: 12px"] { gap: 12px !important; }
  .pd-dash:has(> .ram-mob), .pd-dash:has(> * > .st-mob), .pd-dash:has(> .st-mob) { position: relative !important; height: 422px !important; padding: 0 !important; }
  .pd-dash > .ram-mob ~ *, .pd-dash > * > .st-mob ~ * { visibility: hidden; }
  .pd-dash :is(.ram-mob,.st-mob) { display: block !important; z-index: 5; --rms: .537; }

  /* Ghost Works (Work page): show the shield, darken behind the copy */
  #ghost-works > div[style*="ghost-works-bg2"] { background-size: 150% auto !important; background-position: 70% top !important; }
  #ghost-works > div[style*="linear-gradient(90deg"] { background-image: linear-gradient(180deg, rgba(8,8,10,.72) 0%, rgba(8,8,10,.8) 40%, rgba(8,8,10,.92) 100%) !important; }
  #ghost-works { padding-top: 56px !important; }

  /* Industry case studies: stack image over copy */
  .pp-sum { grid-template-columns: 1fr !important; gap: 18px !important; padding: 22px 0 !important; }
  .pp-sum > span:first-child, .pp-sum .pp-img { min-height: 190px !important; }
  .pp-sum span { max-width: 100% !important; min-width: 0; overflow-wrap: anywhere; }
  .pp-sum span[style*="font-size: 26px"] { font-size: 21px !important; }
  .pp-body { grid-template-columns: 1fr !important; gap: 22px !important; }
  .pp-body > * { grid-column: auto !important; min-width: 0; }

  /* Contracting: identifiers fit the phone */
  #identifiers [style*="grid-template-columns"] { grid-template-columns: 1fr !important; gap: 14px !important; }
  #identifiers [style*="grid-template-columns"] > * { grid-column: auto !important; min-width: 0; }
  #identifiers [style*="display: flex"] { flex-wrap: wrap; min-width: 0; }
  #identifiers * { max-width: 100%; overflow-wrap: anywhere; }
  #identifiers img, #identifiers svg { height: auto; }

  /* Insights hero carousel controls — match the landing hero on mobile */
  body:has(#all-articles) [style*="position: absolute; left: 68px; bottom: 44px"] { left: 20px !important; bottom: 30px !important; gap: 12px !important; right: 108px; flex-wrap: nowrap !important; }
  body:has(#all-articles) [style*="position: absolute; left: 68px; bottom: 44px"] > span { white-space: nowrap !important; font-size: 11px !important; flex: none; }
  body:has(#all-articles) [style*="position: absolute; left: 68px; bottom: 44px"] > div { gap: 6px !important; flex-wrap: nowrap !important; }
  body:has(#all-articles) .hero-dot { width: 18px !important; }
  body:has(#all-articles) [style*="position: absolute; right: 68px; bottom: 36px"] { right: 20px !important; bottom: 22px !important; gap: 8px !important; }
  body:has(#all-articles) [style*="position: absolute; right: 68px; bottom: 36px"] > span { width: 40px !important; height: 40px !important; font-size: 13px !important; }

  /* Insights: LATEST sits above the counter */
  body:has(#all-articles) span:has(> .ins-latest) { display: inline-flex !important; flex-direction: column-reverse; align-items: flex-start; gap: 4px; line-height: 1; }
  .ins-latest { font-size: 10px; letter-spacing: .16em; }
  .ins-dot { display: none; }

  /* Insights filter: hamburger on mobile */
  .fdd { align-self: stretch !important; }
  .fdd-btn { width: 100%; justify-content: flex-start; }
  .fdd-ham { display: inline-flex !important; }
  .fdd-caret { display: none; }
  .fdd-menu { left: 0 !important; right: 0 !important; min-width: 0 !important; }

  /* Insight article: back button sits on the hero image */
  .ia-back { left: 20px !important; top: 22px !important; }

  /* Insights hero keeps a full scrim on mobile */
  .ins-scrim { background-image: linear-gradient(180deg,rgba(8,8,10,.55) 0%,rgba(8,8,10,.86) 100%) !important; }
  /* Article pages: clean hero, header below */
  .ia-hero { height: 260px !important; }
  .ia-head { padding: 0 0 12px !important; }

  /* OPAL fill */
  .pd-dash .st-mob [style*="grid-template-columns: 2fr 1.3fr"] { grid-template-columns: 2fr 1.3fr .8fr !important; }
  .pd-dash .st-mob [style*="grid-template-columns: 2.4fr"] { grid-template-columns: 2.4fr .6fr .6fr !important; }
  .pd-dash .st-mob [style*="grid-template-columns: 1fr 1.3fr"] { grid-template-columns: 1fr 1.3fr .5fr .6fr !important; }
  .pd-dash .st-mob > div > div:last-child { justify-content: flex-start; }
  .pd-dash .st-mob > div > div:last-child > * { flex-shrink: 0; }

  .ft-logo-col { transform: none !important; align-self: center !important; }

  /* footer: centre everything on mobile */
  div:has(> div > .ft-logo-col) > div:has(> .ft-logo-col) { flex-direction: column !important; align-items: center !important; gap: 32px !important; }
  .ft-logo-col { align-items: center !important; margin-left: auto !important; margin-right: auto !important; width: min(220px, 70%) !important; }
  .ft-logo-col img { margin-left: auto !important; margin-right: auto !important; }
  div:has(> div > .ft-logo-col) > div:has(> .ft-logo-col) > div:last-child { justify-content: center !important; width: 100% !important; gap: 0 28px !important; flex-wrap: wrap !important; }
  div:has(> div > .ft-logo-col) > div:has(> .ft-logo-col) > div:last-child > div { align-items: center !important; text-align: center !important; }
  .ft-meta { flex-direction: column !important; justify-content: center !important; align-items: center !important; text-align: center !important; }
  .ft-meta p { text-align: center !important; margin-left: auto !important; margin-right: auto !important; }
  .ft-meta > div, .ft-meta > div > div { justify-content: center !important; }

  .ih-grid { grid-template-columns: 1fr !important; }

  /* footer legal row stacks on mobile */
  .ft-bottom { flex-direction: column !important; align-items: center !important; gap: 12px !important; }
  .ft-legal { justify-content: center !important; row-gap: 6px !important; }
}
