.elementor-kit-5{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#162B69;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-5 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* ============================================================
   GLOBAL FIX — Floating/Absolute Card Cluster Overlap
   Covers: #dtshc2-root, #dtcx-command, and any future section
   built the same way (fixed-width cards, % positioning, inside
   a shrinking flex/grid container)
   ============================================================ */

/* ---- 1. THE ACTUAL BUG: dtshc2-root breakpoint was too low ----
   Cards are 300px fixed-width but the stage column shrinks with
   the viewport — on 1280–1440px laptops the stage narrows to
   ~650-700px while cards stay 300px, so they collide.
   Raising the collapse point to 1500px fixes it everywhere this
   pattern repeats on the site. */

@media(max-width:1500px){
  #dtshc2-root .dtshc2-container{
    grid-template-columns:1fr !important;
    gap:64px !important;
  }
  #dtshc2-root .dtshc2-left{ max-width:760px !important; }
  #dtshc2-root .dtshc2-stage{
    min-height:auto !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:18px !important;
  }
  #dtshc2-root .dtshc2-hub,
  #dtshc2-root .dtshc2-wires{ display:none !important; }
  #dtshc2-root .dtshc2-card{
    position:relative !important;
    inset:auto !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    bottom:auto !important;
    width:auto !important;
    min-height:238px !important;
    transform:none !important;
    opacity:1 !important;
  }
}

/* ---- 2. dtcx-command (case study command center) — same pattern,
   fixed 300px + 330px side columns. Safer margin than dtshc2-root
   but tightens uncomfortably below 1300px. Give it more room too. */

@media(max-width:1300px){
  #dt-case-command .dtcx-command{
    grid-template-columns:1fr !important;
  }
  #dt-case-command .dtcx-rail{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  #dt-case-command .dtcx-evidence{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

/* ---- 3. SAFETY NET for any future "floating card" section ----
   Your build pattern for these sections consistently uses class
   names ending in -card, -stage, -cluster, or -wrap for the
   absolutely-positioned pieces. This generic rule forces ANY
   matching element into a safe static layout below 1400px,
   regardless of what fixed px values the individual card happens
   to use — so a brand-new section you build next month degrades
   safely even before you've had a chance to hand-tune its own
   breakpoint. */

@media(max-width:1400px){
  [class$="-card"][style*="position"],
  [class*="-card-"][style*="left"],
  [class*="-card-"][style*="right"] {
    position:relative !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    bottom:auto !important;
    width:auto !important;
    max-width:100% !important;
  }
}

/* ---- 4. Baseline overflow guard (prevents any absolute element
   from creating horizontal scroll while you're mid-fix) ---- */
html, body{
  overflow-x:hidden;
  max-width:100%;
}/* End custom CSS */