/* OPS Alliance — Responsive Overrides
   Loaded via Sidebar.dc.html helmet (auto-included on all dc-import pages).
   For pages without Sidebar DC, include manually in helmet. */

/* ========================
   ANTI-FLICKER — ALL SCREEN SIZES
   Scroll-reveal / blur pop-in animations read as page flicker on load
   (the DC runtime re-renders once after load, restarting them).
   Content is visible immediately, everywhere.
   ======================== */
[data-reveal] {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  transition: none !important;
}
h1 span[style*="animation:wordBlurIn"],
h1 span[style*="animation: wordBlurIn"],
[style*="animation:blurFadeUp"],
[style*="animation: blurFadeUp"] {
  animation: none !important;
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}

/* ========================
   MOBILE (≤768px)
   ======================== */
@media (max-width: 768px), (max-height: 500px) and (orientation: landscape) {

  /* --- Page Layout --- */
  html, body { overflow-x: hidden !important; max-width: 100vw; }
  main, main > section { overflow-x: clip !important; }

  /* Kill decorative hero animations on mobile — the fire-glow / ember / scan-line
     layers repaint constantly and read as image flicker on phones. */
  [style*="fire-flicker"],
  [style*="ember-rise"],
  [style*="scan-line"] {
    animation: none !important;
    display: none !important;
  }

  [style*="display:flex"][style*="min-height:100vh"],
  [style*="display: flex"][style*="min-height: 100vh"] {
    flex-direction: column !important;
  }

  [data-sidebar-mount] {
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    width: 100% !important;
    position: relative !important;
  }

  /* Collapse the sidebar wrapper's desktop 100vh sticky box on mobile —
     otherwise it leaves a full screen of empty space above the content.
     (The mobile header bar and drawer inside it are position:fixed, unaffected.) */
  [data-sidebar-mount] > div[data-menu-open],
  [data-sidebar-mount] > div {
    height: auto !important;
    position: static !important;
  }

  /* Show mobile header on request pages */
  .ops-req-mob-bar {
    display: block !important;
  }

  /* Push main content below fixed mobile header */
  main {
    padding-top: 54px !important;
  }

  /* --- Section Padding --- */
  main > section {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  main > section > div[style*="padding:80px 56px"],
  main > section > div[style*="padding: 80px 56px"],
  main > section > div[style*="padding:64px 56px"],
  main > section > div[style*="padding: 64px 56px"] {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  main > footer {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Sticky elements sit below mobile header */
  main > [style*="position: sticky"],
  main > section[style*="position: sticky"] {
    top: 52px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* --- Grid → Stack (both space and no-space variants) --- */
  [style*="grid-template-columns:repeat(6,1fr)"],
  [style*="grid-template-columns: repeat(6, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  [style*="grid-template-columns:repeat(4,1fr)"],
  [style*="grid-template-columns: repeat(4, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  [style*="grid-template-columns:repeat(3,1fr)"],
  [style*="grid-template-columns: repeat(3, 1fr)"] {
    grid-template-columns: 1fr !important;
  }
  [style*="grid-template-columns:repeat(3,1fr)"] > div,
  [style*="grid-template-columns: repeat(3, 1fr)"] > div {
    border-right: none !important;
    border-left: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }
  [style*="grid-template-columns:repeat(2,1fr)"],
  [style*="grid-template-columns: repeat(2, 1fr)"] {
    grid-template-columns: 1fr !important;
  }
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
  [style*="grid-template-columns:1.2fr 0.8fr"],
  [style*="grid-template-columns: 1.2fr 0.8fr"] {
    grid-template-columns: 1fr !important;
  }
  [style*="grid-template-columns:1.1fr 0.9fr"],
  [style*="grid-template-columns: 1.1fr 0.9fr"] {
    grid-template-columns: 1fr !important;
  }
  [style*="grid-template-columns:1.3fr 0.7fr"],
  [style*="grid-template-columns: 1.3fr 0.7fr"] {
    grid-template-columns: 1fr !important;
  }
  /* Contact / Request Brief hero grid — never force full-viewport height on mobile */
  section[style*="min-height:100vh"], section[style*="min-height: 100vh"] {
    min-height: auto !important;
  }
  /* Shrink the Request Brief / contact page background photo so it doesn't dominate or crop oddly on small screens */
  section[style*="min-height:100vh"] img[src*="bg-flag-stone"] {
    object-position: center 20% !important;
  }
  section[style*="min-height:100vh"] > div[style*="position:absolute;inset:0"] {
    opacity: 0.7;
  }
  /* Footer grid */
  footer[style*="grid-template-columns:1fr auto 1fr"],
  footer[style*="grid-template-columns: 1fr auto 1fr"] {
    grid-template-columns: 1fr !important;
    text-align: center !important;
    gap: 12px !important;
    padding-top: 16px !important;
    padding-bottom: 16px !important;
  }
  footer[style*="grid-template-columns"] > div[style*="justify-self:end"],
  footer[style*="grid-template-columns"] > div[style*="justify-self: end"] {
    justify-self: center !important;
  }

  /* --- Flex Stacking for side-by-side content --- */
  div[style*="display:flex"][style*="gap:32px"],
  div[style*="display: flex"][style*="gap: 32px"],
  div[style*="display:flex"][style*="gap:48px"],
  div[style*="display: flex"][style*="gap: 48px"],
  div[style*="display:flex"][style*="gap:56px"],
  div[style*="display: flex"][style*="gap: 56px"],
  div[style*="display:flex"][style*="gap:64px"],
  div[style*="display: flex"][style*="gap: 64px"] {
    flex-direction: column !important;
  }

  /* --- Typography Scaling ---
     Larger-than-before on phones per client direction: headlines stay big,
     body text never drops below its desktop size. */
  h1[style*="font-size:64px"], h1[style*="font-size: 64px"] { font-size: 38px !important; }
  h1[style*="font-size:60px"], h1[style*="font-size: 60px"] { font-size: 36px !important; }
  h1[style*="font-size:56px"], h1[style*="font-size: 56px"] { font-size: 36px !important; }
  h1[style*="font-size:54px"], h1[style*="font-size: 54px"] { font-size: 34px !important; }
  h1[style*="font-size:52px"], h1[style*="font-size: 52px"] { font-size: 32px !important; }
  h1[style*="font-size:48px"], h1[style*="font-size: 48px"] { font-size: 32px !important; }
  h1[style*="font-size:44px"], h1[style*="font-size: 44px"] { font-size: 30px !important; }
  h1[style*="font-size:42px"], h1[style*="font-size: 42px"] { font-size: 28px !important; }

  h2[style*="font-size:48px"], h2[style*="font-size: 48px"] { font-size: 30px !important; }
  h2[style*="font-size:44px"], h2[style*="font-size: 44px"] { font-size: 28px !important; }
  h2[style*="font-size:40px"], h2[style*="font-size: 40px"] { font-size: 26px !important; }
  h2[style*="font-size:38px"], h2[style*="font-size: 38px"] { font-size: 26px !important; }
  h2[style*="font-size:36px"], h2[style*="font-size: 36px"] { font-size: 24px !important; }
  h2[style*="font-size:28px"], h2[style*="font-size: 28px"] { font-size: 22px !important; }

  /* Large stat numbers */
  div[style*="font-size:60px"], div[style*="font-size: 60px"] { font-size: 44px !important; }
  div[style*="font-size:56px"], div[style*="font-size: 56px"] { font-size: 40px !important; }
  div[style*="font-size:52px"], div[style*="font-size: 52px"] { font-size: 38px !important; }
  div[style*="font-size:48px"], div[style*="font-size: 48px"] { font-size: 36px !important; }
  div[style*="font-size:44px"], div[style*="font-size: 44px"] { font-size: 32px !important; }
  div[style*="font-family:var(--font-display)"][style*="font-size:40px"],
  div[style*="font-family: var(--font-display)"][style*="font-size: 40px"] { font-size: 32px !important; }
  div[style*="font-size:42px"], div[style*="font-size: 42px"] { font-size: 32px !important; }

  /* Body text — INCREASED for phone readability, never below 16px */
  p[style*="font-size:22px"], p[style*="font-size: 22px"] { font-size: 19px !important; }
  p[style*="font-size:21px"], p[style*="font-size: 21px"] { font-size: 19px !important; }
  p[style*="font-size:20px"], p[style*="font-size: 20px"] { font-size: 18px !important; }
  p[style*="font-size:18px"], p[style*="font-size: 18px"] { font-size: 18px !important; }
  p[style*="font-size:17px"], p[style*="font-size: 17px"] { font-size: 17px !important; }
  p[style*="font-size:16px"], p[style*="font-size: 16px"] { font-size: 17px !important; }
  p[style*="font-size:15px"], p[style*="font-size: 15px"] { font-size: 16px !important; }
  p[style*="font-size:14px"], p[style*="font-size: 14px"] { font-size: 16px !important; }
  div[style*="font-size:22px"]:not([style*="font-family:var(--font-display)"]),
  div[style*="font-size: 22px"]:not([style*="font-family: var(--font-display)"]) { font-size: 19px !important; }
  div[style*="font-size:20px"][style*="font-family:var(--font-body)"],
  div[style*="font-size: 20px"][style*="font-family: var(--font-body)"] { font-size: 18px !important; }
  div[style*="font-size:18px"][style*="font-family:var(--font-body)"],
  div[style*="font-size: 18px"][style*="font-family: var(--font-body)"] { font-size: 17px !important; }
  div[style*="font-size:17px"][style*="font-family:var(--font-body)"],
  div[style*="font-size: 17px"][style*="font-family: var(--font-body)"] { font-size: 17px !important; }
  div[style*="font-size:16px"][style*="font-family:var(--font-body)"],
  div[style*="font-size: 16px"][style*="font-family: var(--font-body)"] { font-size: 17px !important; }
  div[style*="font-size:15px"][style*="font-family:var(--font-body)"],
  div[style*="font-size: 15px"][style*="font-family: var(--font-body)"] { font-size: 16px !important; }
  /* Card/box copy generally reads small on phones — set a readable floor for body text */
  p, .testimonial-card p, .feat-briefing-text div[style*="font-family:var(--font-body)"] {
    line-height: 1.55 !important;
  }

  /* Prevent horizontal text overflow */
  [style*="white-space:nowrap"],
  [style*="white-space: nowrap"] {
    white-space: normal !important;
  }

  /* --- Hero Section --- */
  section[style*="min-height:100vh"],
  section[style*="min-height: 100vh"] {
    min-height: auto !important;
  }
  section[style*="min-height:560px"],
  section[style*="min-height: 560px"],
  section[style*="min-height:540px"],
  section[style*="min-height: 540px"] {
    min-height: 360px !important;
  }
  section[style*="min-height:480px"],
  section[style*="min-height: 480px"] {
    min-height: 300px !important;
  }

  /* Hero content inner padding */
  div[style*="padding:80px 56px 48px"],
  div[style*="padding: 80px 56px 48px"] {
    padding: 60px 20px 32px !important;
  }

  /* Hero stats strip margin */
  div[style*="margin:0 56px"],
  div[style*="margin: 0 56px"],
  div[style*="margin:0px 56px"] {
    margin-left: 20px !important;
    margin-right: 20px !important;
  }

  /* Coordinate strip bottom of hero */
  div[style*="padding:16px 56px"],
  div[style*="padding: 16px 56px"] {
    padding: 12px 16px !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    justify-content: center !important;
    font-size: 11px !important;
  }

  /* --- Featured Video Section --- */
  .feat-briefing {
    flex-direction: column !important;
  }
  .feat-briefing-text {
    padding: 24px !important;
    text-align: center !important;
    align-items: center !important;
  }
  .feat-briefing-caption {
    left: 0 !important;
    right: 0 !important;
    text-align: center !important;
  }

  /* --- Testimonials --- */
  div[style*="display:flex"][style*="align-items:baseline"][style*="gap:20px"],
  div[style*="display: flex"][style*="align-items: baseline"][style*="gap: 20px"] {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }
  /* Homepage testimonial cards ("What they say about us") — center on mobile */
  .testimonial-card {
    text-align: center !important;
    align-items: center !important;
  }

  /* --- Clients Grid --- */
  div[style*="grid-template-columns:repeat(3,1fr)"],
  div[style*="grid-template-columns: repeat(3, 1fr)"] {
    grid-template-columns: 1fr !important;
  }
  /* Remove mid-column borders on stacked layout */
  div[style*="grid-template-columns:repeat(3,1fr)"] > div[style*="border-right"],
  div[style*="grid-template-columns: repeat(3, 1fr)"] > div[style*="border-right"] {
    border-right: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  /* LE row separators */
  div[style*="display:flex"][style*="flex-wrap:wrap"][style*="justify-content:center"] {
    flex-direction: column !important;
    align-items: center !important;
  }
  div[style*="display:flex"][style*="flex-wrap:wrap"][style*="justify-content:center"] > span[style*="margin:0 12px"] {
    display: none !important;
  }

  /* --- Contact Form --- */
  section#contact > div[style*="display:grid"],
  section#contact > div[style*="display: grid"] {
    grid-template-columns: 1fr !important;
    padding: 48px 20px !important;
  }
  section#contact div[style*="grid-template-columns:1fr 1fr"],
  section#contact div[style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  /* --- Footer --- */
  footer[style*="display:grid"],
  footer[style*="display: grid"] {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    text-align: center !important;
    align-items: center !important;
  }

  /* --- Video Embeds --- */
  [style*="flex:0 0 480px"],
  [style*="flex: 0 0 480px"] {
    flex: none !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  /* Thermal-spray / product video box — force a real 16:9 box when stacked
     (the height:0 + padding-bottom trick can collapse inside column flex) */
  [style*="flex:0 0 480px"] > div[style*="padding-bottom:56.25%"],
  [style*="flex: 0 0 480px"] > div[style*="padding-bottom: 56.25%"] {
    height: auto !important;
    padding-bottom: 0 !important;
    aspect-ratio: 16 / 9 !important;
    width: 100% !important;
  }
  /* Product video card (materials page) — stack video above text */
  div[style*="display:flex"][style*="gap:48px"][style*="border:1px solid rgba(184,149,72,.4)"],
  div[style*="display: flex"][style*="gap: 48px"][style*="border: 1px solid rgba(184,149,72,.4)"] {
    flex-direction: column !important;
    gap: 20px !important;
    padding: 16px !important;
  }

  /* Hero buttons — stack vertically */
  div[style*="display:flex"][style*="gap:14px"] > a[style*="display:inline-flex"] {
    width: 100% !important;
    justify-content: center !important;
  }
  div[style*="display:flex"][style*="gap:14px"][style*="animation:blurFadeUp"] {
    flex-direction: column !important;
    gap: 10px !important;
  }

  /* --- Forms --- */
  [style*="max-width:520px"],
  [style*="max-width: 520px"],
  [style*="max-width:480px"],
  [style*="max-width: 480px"] {
    max-width: 100% !important;
  }

  /* Hide contact section divider lines */
  div[style*="height:1px"][style*="background:var(--border-subtle)"],
  div[style*="height: 1px"][style*="background: var(--border-subtle)"] {
    display: none !important;
  }

  /* --- Scroll Margins --- */
  [style*="scroll-margin-top"] {
    scroll-margin-top: 120px !important;
  }

  /* --- Hero eyebrow line — hide decorative elements on small screens --- */
  div[style*="padding:80px 56px 48px"] > div:first-child > span[style*="flex:1"],
  div[style*="padding: 80px 56px 48px"] > div:first-child > span[style*="flex: 1"] {
    display: none !important;
  }

  /* Gryphon watermark — hide on mobile */
  img[src*="gryphon-transparent"][style*="opacity:.05"],
  img[src*="gryphon-transparent"][style*="opacity: .05"],
  img[src*="gryphon-transparent"][style*="opacity:0.05"] {
    display: none !important;
  }

  /* --- Stat bars --- */
  div[style*="display:flex"][style*="align-items:center"][style*="justify-content:center"],
  div[style*="display: flex"][style*="align-items: center"][style*="justify-content: center"] {
    flex-wrap: wrap !important;
    text-align: center !important;
  }

  /* Contact section min-height */
  section#contact {
    min-height: auto !important;
  }

  /* --- Additional inner content padding overrides --- */
  div[style*="padding:72px 56px"],
  div[style*="padding: 72px 56px"] {
    padding: 40px 20px !important;
  }
  div[style*="padding:48px 56px"],
  div[style*="padding: 48px 56px"] {
    padding: 32px 20px !important;
  }
  div[style*="padding:56px 56px"],
  div[style*="padding: 56px 56px"] {
    padding: 36px 20px !important;
  }
  section[style*="padding:72px 56px 32px"],
  section[style*="padding: 72px 56px 32px"] {
    padding: 40px 20px 20px !important;
  }
  section[style*="padding:64px 56px 56px"],
  section[style*="padding: 64px 56px 56px"] {
    padding: 36px 20px 20px !important;
  }

  /* Contract card inner padding */
  div[style*="padding:48px 40px"],
  div[style*="padding: 48px 40px"] {
    padding: 24px 16px !important;
  }

  /* Sticky nav bar */
  section[style*="padding:20px 56px"],
  section[style*="padding: 20px 56px"] {
    padding: 12px 16px !important;
  }

  /* Clamp hero min-height */
  section[style*="min-height:clamp"],
  section[style*="min-height: clamp"] {
    min-height: 360px !important;
  }

  /* Scrolling banner logos */
  div[style*="animation:scrollBanner"] img,
  div[style*="animation: scrollBanner"] img {
    height: 32px !important;
  }

  /* Contract section cards — reduce gap */
  section[style*="display:flex"][style*="gap:32px"],
  section[style*="display: flex"][style*="gap: 32px"] {
    gap: 20px !important;
  }

  /* Intel cards right-align link */
  div[style*="text-align:right"],
  div[style*="text-align: right"] {
    text-align: center !important;
  }

  /* Heritage inset image height */
  img[style*="height:320px"],
  img[style*="height: 320px"] {
    height: 220px !important;
  }

  /* Capability tags wrap tighter */
  div[style*="display:flex"][style*="flex-wrap:wrap"][style*="gap:10px"],
  div[style*="display: flex"][style*="flex-wrap: wrap"][style*="gap: 10px"] {
    gap: 6px !important;
  }
  div[style*="display:flex"][style*="flex-wrap:wrap"][style*="gap:10px"] > span,
  div[style*="display: flex"][style*="flex-wrap: wrap"][style*="gap: 10px"] > span {
    font-size: 11px !important;
    padding: 6px 12px !important;
  }

  /* About page — Client Voice grid to single column */
  div[style*="grid-template-columns:1fr 1fr"][style*="gap:20px"] {
    grid-template-columns: 1fr !important;
  }

  /* About page — 150+ stat flex to block center */
  div[style*="display:flex"][style*="align-items:center"][style*="justify-content:center"][style*="gap:16px"][style*="margin-top:28px"] {
    flex-direction: column !important;
    gap: 12px !important;
  }
  div[style*="display:flex"][style*="align-items:center"][style*="justify-content:center"][style*="gap:16px"][style*="margin-top:28px"] > div[style*="flex:1"],
  div[style*="display: flex"][style*="align-items: center"][style*="justify-content: center"][style*="gap: 16px"][style*="margin-top: 28px"] > div[style*="flex: 1"] {
    display: none !important;
  }

  /* Contracts page — Contact link centering */
  div[style*="display:flex"][style*="gap:16px"][style*="flex-wrap:wrap"] {
    justify-content: center !important;
  }

  /* Materials & Training — 3-column card grids to 2-column on mobile */
  div[style*="grid-template-columns:repeat(3,1fr)"][style*="gap:16px"][style*="margin-bottom:48px"],
  div[style*="grid-template-columns: repeat(3, 1fr)"][style*="gap: 16px"][style*="margin-bottom: 48px"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* Hero stat grid — 4-column to 2x2 on mobile, cells centered */
  .stats-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 24px !important;
  }
  .stat-cell {
    padding: 0 !important;
    border-left: none !important;
    text-align: center !important;
  }
  /* Hide scrolling logo banner on mobile */
  div[style*="position:sticky"][style*="z-index:50"][style*="background:var(--bg-surface)"],
  div[style*="display:flex"][style*="align-items:center"][style*="gap:64px"][style*="animation:scrollBanner"] {
    display: none !important;
  }

  /* Request Brief (contact) page — center everything on mobile */
  .req-brief-grid {
    text-align: center !important;
    justify-items: center !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
    grid-template-columns: 1fr !important;
  }
  .req-brief-grid > div {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  .req-brief-grid > div > div {
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .req-brief-grid input,
  .req-brief-grid textarea {
    text-align: left !important;
  }
  .req-brief-grid p[style*="max-width:520px"],
  .req-brief-grid div[style*="max-width:480px"],
  .req-brief-grid div[style*="max-width:520px"] {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .req-brief-grid div[style*="display:flex"][style*="align-items:center"][style*="gap:16px"] {
    justify-content: center !important;
  }
  .req-brief-grid a[style*="display:block"] {
    text-align: center !important;
  }

  /* Request pages — sidebar contact cards full width on mobile */
  div[style*="display:flex"][style*="flex-direction:column"][style*="gap:16px"][style*="padding-top:40px"] {
    gap: 16px !important;
  }
  div[style*="display:flex"][style*="flex-direction:column"][style*="gap:16px"][style*="padding-top:40px"] > div[style*="border:1px solid var(--border-default)"] {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* --- Kill scroll-reveal / intro-animation flicker on mobile & tablet ---
     The blur/opacity/transform pop-in (JS-driven IntersectionObserver + load-time
     keyframes) reads as flicker on phones where most sections are already near the
     viewport. Show everything immediately, no animation, no blur. */
  [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
  h1 span[style*="animation:wordBlurIn"],
  h1 span[style*="animation: wordBlurIn"] {
    animation: none !important;
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
  }
  [style*="animation:blurFadeUp"],
  [style*="animation: blurFadeUp"] {
    animation: none !important;
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
  }
}

/* ========================
   TABLET (769px–1024px)
   ======================== */
@media (min-width: 769px) and (max-width: 1024px) {

  html, body { overflow-x: hidden !important; max-width: 100vw; }

  /* Section padding */
  main > section {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
  main > footer {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
  main > section > div[style*="padding:80px 56px"],
  main > section > div[style*="padding: 80px 56px"],
  main > section > div[style*="padding:64px 56px"],
  main > section > div[style*="padding: 64px 56px"] {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }

  /* Hero content padding */
  div[style*="padding:80px 56px 48px"],
  div[style*="padding: 80px 56px 48px"] {
    padding: 72px 32px 40px !important;
  }

  /* Stats strip margin */
  div[style*="margin:0 56px"],
  div[style*="margin: 0 56px"] {
    margin-left: 32px !important;
    margin-right: 32px !important;
  }

  /* Coordinate strip */
  div[style*="padding:16px 56px"],
  div[style*="padding: 16px 56px"] {
    padding: 14px 32px !important;
  }

  /* 4-col → 2-col */
  [style*="grid-template-columns:repeat(4,1fr)"],
  [style*="grid-template-columns: repeat(4, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* 3-col → 2-col */
  [style*="grid-template-columns:repeat(3,1fr)"],
  [style*="grid-template-columns: repeat(3, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* About 2-col — keep but even */
  [style*="grid-template-columns:1.1fr 0.9fr"],
  [style*="grid-template-columns: 1.1fr 0.9fr"] {
    grid-template-columns: 1fr 1fr !important;
  }

  /* Contact / Request Brief 2-col forms — stack on tablet (was only handled on mobile) */
  [style*="grid-template-columns:1.2fr 0.8fr"],
  [style*="grid-template-columns: 1.2fr 0.8fr"],
  [style*="grid-template-columns:1.3fr 0.7fr"],
  [style*="grid-template-columns: 1.3fr 0.7fr"] {
    grid-template-columns: 1fr !important;
  }
  /* Never force full-viewport height on tablet — was causing oversized/shifted hero sections */
  section[style*="min-height:100vh"], section[style*="min-height: 100vh"] {
    min-height: auto !important;
  }

  /* Contact 2-col — stack */
  section#contact > div[style*="display:grid"],
  section#contact > div[style*="display: grid"] {
    grid-template-columns: 1fr !important;
    padding: 56px 32px !important;
  }

  /* Typography scaling — keep tablet text large (client direction) */
  h1[style*="font-size:54px"], h1[style*="font-size: 54px"] { font-size: 48px !important; }
  h1[style*="font-size:56px"], h1[style*="font-size: 56px"] { font-size: 48px !important; }
  h2[style*="font-size:48px"], h2[style*="font-size: 48px"] { font-size: 40px !important; }
  div[style*="font-size:60px"], div[style*="font-size: 60px"] { font-size: 52px !important; }

  /* Body text — never below 17px on tablet */
  p[style*="font-size:16px"], p[style*="font-size: 16px"] { font-size: 17px !important; }
  p[style*="font-size:15px"], p[style*="font-size: 15px"] { font-size: 17px !important; }
  p[style*="font-size:14px"], p[style*="font-size: 14px"] { font-size: 16px !important; }

  /* Product video card (materials page) — stack video above text on tablet */
  div[style*="display:flex"][style*="gap:48px"][style*="border:1px solid rgba(184,149,72,.4)"],
  div[style*="display: flex"][style*="gap: 48px"][style*="border: 1px solid rgba(184,149,72,.4)"] {
    flex-direction: column !important;
    gap: 24px !important;
  }
  [style*="flex:0 0 480px"],
  [style*="flex: 0 0 480px"] {
    flex: none !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  [style*="flex:0 0 480px"] > div[style*="padding-bottom:56.25%"],
  [style*="flex: 0 0 480px"] > div[style*="padding-bottom: 56.25%"] {
    height: auto !important;
    padding-bottom: 0 !important;
    aspect-ratio: 16 / 9 !important;
    width: 100% !important;
  }

  /* Prevent hero h1 nowrap overflow on tablet */
  h1[style*="white-space:nowrap"], h1[style*="white-space: nowrap"] {
    white-space: normal !important;
  }

  /* Featured video — stack on tablet */
  section[style*="padding:64px 56px"] > div[style*="display:flex"][style*="gap:32px"],
  section[style*="padding: 64px 56px"] > div[style*="display: flex"][style*="gap: 32px"] {
    flex-direction: column !important;
  }

  /* Featured Briefing — stack */
  div[style*="display:flex"][style*="gap:32px"][style*="border:1px solid rgba(184,149,72,.4)"],
  div[style*="display: flex"][style*="gap: 32px"][style*="border: 1px solid rgba(184,149,72,.4)"] {
    flex-direction: column !important;
    gap: 0 !important;
  }
  div[style*="display:flex"][style*="gap:32px"][style*="border:1px solid rgba(184,149,72,.4)"] > div,
  div[style*="display: flex"][style*="gap: 32px"][style*="border: 1px solid rgba(184,149,72,.4)"] > div {
    flex: 1 !important;
  }
  div[style*="display:flex"][style*="gap:32px"][style*="border:1px solid rgba(184,149,72,.4)"] > div[style*="padding:36px"],
  div[style*="display: flex"][style*="gap: 32px"][style*="border: 1px solid rgba(184,149,72,.4)"] > div[style*="padding: 36px"] {
    padding: 24px !important;
    text-align: center !important;
  }

  /* Hero metrics — 4-column to 2-column */
  div[style*="display:grid"][style*="grid-template-columns:repeat(4,1fr)"],
  div[style*="display: grid"][style*="grid-template-columns: repeat(4, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 24px !important;
  }
  div[style*="display:grid"][style*="grid-template-columns:repeat(4,1fr)"] > div,
  div[style*="display: grid"][style*="grid-template-columns: repeat(4, 1fr)"] > div {
    padding: 20px 0 !important;
    border-left: none !important;
    border-right: none !important;
    text-align: center !important;
  }

  /* Additional inner content padding */
  div[style*="padding:72px 56px"],
  div[style*="padding: 72px 56px"] {
    padding: 56px 32px !important;
  }
  div[style*="padding:48px 56px"],
  div[style*="padding: 48px 56px"] {
    padding: 40px 32px !important;
  }

  /* Clamp hero */
  section[style*="min-height:clamp"],
  section[style*="min-height: clamp"] {
    min-height: 420px !important;
  }

  /* Footer */
  footer[style*="grid-template-columns:1fr auto 1fr"],
  footer[style*="grid-template-columns: 1fr auto 1fr"] {
    grid-template-columns: 1fr !important;
    text-align: center !important;
    gap: 10px !important;
  }
  footer[style*="grid-template-columns"] > div[style*="justify-self:end"],
  footer[style*="grid-template-columns"] > div[style*="justify-self: end"] {
    justify-self: center !important;
  }

  /* Hide scrolling logo banner on tablet */
  div[style*="position:sticky"][style*="z-index:50"][style*="background:var(--bg-surface)"],
  div[style*="display:flex"][style*="align-items:center"][style*="gap:64px"][style*="animation:scrollBanner"] {
    display: none !important;
  }

  /* Request pages — sidebar contact cards full width on tablet */
  div[style*="display:flex"][style*="flex-direction:column"][style*="gap:16px"][style*="padding-top:40px"] {
    gap: 16px !important;
  }
  div[style*="display:flex"][style*="flex-direction:column"][style*="gap:16px"][style*="padding-top:40px"] > div[style*="border:1px solid var(--border-default)"] {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* About page — Client Voice grid to single column */
  div[style*="grid-template-columns:1fr 1fr"][style*="gap:20px"] {
    grid-template-columns: 1fr !important;
  }

  /* Client Voice testimonial cards — center on tablet */
  .testimonial-card {
    text-align: center !important;
    align-items: center !important;
  }

  /* Request Brief (contact) page — center everything on tablet */
  .req-brief-grid {
    text-align: center !important;
    justify-items: center !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
  }
  .req-brief-grid > div {
    max-width: 100% !important;
    min-width: 0 !important;
  }
  .req-brief-grid p[style*="max-width:520px"],
  .req-brief-grid div[style*="max-width:480px"],
  .req-brief-grid div[style*="max-width:520px"] {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .req-brief-grid div[style*="display:flex"][style*="align-items:center"][style*="gap:16px"] {
    justify-content: center !important;
  }

  /* About page — 150+ stat flex to block center */
  div[style*="display:flex"][style*="align-items:center"][style*="justify-content:center"][style*="gap:16px"][style*="margin-top:28px"] {
    flex-direction: column !important;
    gap: 12px !important;
  }
  div[style*="display:flex"][style*="align-items:center"][style*="justify-content:center"][style*="gap:16px"][style*="margin-top:28px"] > div[style*="flex:1"],
  div[style*="display: flex"][style*="align-items: center"][style*="justify-content: center"][style*="gap: 16px"][style*="margin-top: 28px"] > div[style*="flex: 1"] {
    display: none !important;
  }

  /* Kill scroll-reveal / intro-animation flicker on tablet too */
  [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
  h1 span[style*="animation:wordBlurIn"],
  h1 span[style*="animation: wordBlurIn"] {
    animation: none !important;
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
  }
  [style*="animation:blurFadeUp"],
  [style*="animation: blurFadeUp"] {
    animation: none !important;
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
  }
}

/* ========================
   SMALL DESKTOP / LAPTOP (1025px–1440px)
   ======================== */
@media (min-width: 1025px) and (max-width: 1440px) {
  /* Slight padding reduction */
  div[style*="padding:80px 56px 48px"],
  div[style*="padding: 80px 56px 48px"] {
    padding: 72px 48px 44px !important;
  }
}

/* ========================
   TV / LARGE DISPLAYS (≥1921px)
   ======================== */
@media (min-width: 1921px) {
  /* Scale up content for large viewing distances */
  main {
    font-size: 1.15em;
  }

  /* Increase section padding */
  main > section {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }
  main > section > div[style*="padding:80px 56px"],
  main > section > div[style*="padding: 80px 56px"] {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }
  main > section > div[style*="padding:64px 56px"],
  main > section > div[style*="padding: 64px 56px"] {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }

  /* Hero content */
  div[style*="padding:80px 56px 48px"],
  div[style*="padding: 80px 56px 48px"] {
    padding: 120px 80px 64px !important;
    max-width: 960px !important;
  }

  /* Stats strip */
  div[style*="margin:0 56px"],
  div[style*="margin: 0 56px"] {
    margin-left: 80px !important;
    margin-right: 80px !important;
  }

  /* Coordinate strip */
  div[style*="padding:16px 56px"],
  div[style*="padding: 16px 56px"] {
    padding: 20px 80px !important;
    font-size: 15px !important;
  }

  /* Scale up headings */
  h1[style*="font-size:54px"], h1[style*="font-size: 54px"] { font-size: 68px !important; }
  h2[style*="font-size:48px"], h2[style*="font-size: 48px"] { font-size: 56px !important; }
  h2[style*="font-size:38px"], h2[style*="font-size: 38px"] { font-size: 46px !important; }
  h2[style*="font-size:36px"], h2[style*="font-size: 36px"] { font-size: 44px !important; }
  h2[style*="font-size:28px"], h2[style*="font-size: 28px"] { font-size: 34px !important; }

  /* Scale up stat numbers */
  div[style*="font-size:60px"], div[style*="font-size: 60px"] { font-size: 76px !important; }
  div[style*="font-size:56px"], div[style*="font-size: 56px"] { font-size: 68px !important; }

  /* Body text */
  p[style*="font-size:22px"], p[style*="font-size: 22px"] { font-size: 26px !important; }
  p[style*="font-size:21px"], p[style*="font-size: 21px"] { font-size: 25px !important; }
  p[style*="font-size:20px"], p[style*="font-size: 20px"] { font-size: 24px !important; }
  p[style*="font-size:18px"], p[style*="font-size: 18px"] { font-size: 22px !important; }

  /* Footer padding */
  main > footer {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }

  /* Contact section */
  section#contact > div[style*="display:grid"],
  section#contact > div[style*="display: grid"] {
    padding-left: 80px !important;
    padding-right: 80px !important;
  }

  /* Larger intel cards gap */
  div[style*="grid-template-columns:repeat(3,1fr)"][style*="gap:20px"],
  div[style*="grid-template-columns: repeat(3, 1fr)"][style*="gap: 20px"] {
    gap: 28px !important;
  }

  /* Inner content padding scale-up */
  div[style*="padding:72px 56px"],
  div[style*="padding: 72px 56px"] {
    padding: 100px 80px !important;
  }
  div[style*="padding:48px 56px"],
  div[style*="padding: 48px 56px"] {
    padding: 64px 80px !important;
  }

  /* Featured Briefing scale */
  div[style*="display:flex"][style*="gap:32px"][style*="border:1px solid rgba(184,149,72,.4)"],
  div[style*="display: flex"][style*="gap: 32px"][style*="border: 1px solid rgba(184,149,72,.4)"] {
    gap: 40px !important;
  }
  div[style*="display:flex"][style*="gap:32px"][style*="border:1px solid rgba(184,149,72,.4)"] > div[style*="padding:36px"],
  div[style*="display: flex"][style*="gap: 32px"][style*="border: 1px solid rgba(184,149,72,.4)"] > div[style*="padding: 36px"] {
    padding: 48px !important;
  }

  /* Hero metrics — 4-column restored on TV */
  div[style*="display:grid"][style*="grid-template-columns:repeat(4,1fr)"],
  div[style*="display: grid"][style*="grid-template-columns: repeat(4, 1fr)"] {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 32px !important;
  }
  div[style*="display:grid"][style*="grid-template-columns:repeat(4,1fr)"] > div,
  div[style*="display: grid"][style*="grid-template-columns: repeat(4, 1fr)"] > div {
    padding: 28px 24px !important;
    border-left: 1px solid rgba(184,149,72,.3) !important;
    text-align: left !important;
  }
  div[style*="display:grid"][style*="grid-template-columns:repeat(4,1fr)"] > div:first-child,
  div[style*="display: grid"][style*="grid-template-columns: repeat(4, 1fr)"] > div:first-child {
    border-left: none !important;
  }
}

/* ========================
   ULTRA-WIDE TV (≥2560px)
   ======================== */
@media (min-width: 2560px) {
  main {
    max-width: 2200px;
    margin: 0 auto;
    font-size: 1.3em;
  }

  h1[style*="font-size:54px"], h1[style*="font-size: 54px"] { font-size: 80px !important; }
  h2[style*="font-size:48px"], h2[style*="font-size: 48px"] { font-size: 64px !important; }
  div[style*="font-size:60px"], div[style*="font-size: 60px"] { font-size: 88px !important; }

  main > section {
    padding-left: 120px !important;
    padding-right: 120px !important;
  }
  main > footer {
    padding-left: 120px !important;
    padding-right: 120px !important;
  }
}

/* --- Tablet additions (769-1024px): rules the main tablet block above lacks.
   About-page proof band + display-heading sizes added 2026-08-11. --- */
@media (min-width: 769px) and (max-width: 1024px) {
  /* Proof/stat band: 6-up becomes 3-up */
  [style*="grid-template-columns:repeat(6,1fr)"],
  [style*="grid-template-columns: repeat(6, 1fr)"] {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  /* Display headings not covered by the main tablet block */
  h1[style*="font-size:64px"], h1[style*="font-size: 64px"] { font-size: 48px !important; }
  h2[style*="font-size:44px"], h2[style*="font-size: 44px"] { font-size: 36px !important; }
}