img{max-width:100%;height:auto}
.wordmark{display:block;width:150px;height:auto;filter:brightness(0) invert(1)}
.wordmark-sm{width:118px}
.wordmark-link{display:block;flex:0 0 auto;line-height:0}
.nav-toggle{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.nav-burger{display:none}

/* NOTE: the DC runtime re-serializes inline style attributes with a space
   after each colon (e.g. "font-size: 52px"), so all [style*=...] selectors
   below must use that normalized form to match the live DOM. */

@media (max-width:780px){
  body{overflow-x:hidden}

  /* ---- Collapse all multi-column grids to one column ---- */
  [style*="grid-template-columns: repeat(3"],
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns: 1fr 460px"],
  [style*="grid-template-columns: 1.1fr 0.9fr"]{grid-template-columns:1fr !important}

  /* Footer: brand spans full width, link columns pair up side by side */
  [style*="grid-template-columns: 1.4fr"]{grid-template-columns:1fr 1fr !important;gap:28px 20px !important}
  [style*="grid-template-columns: 1.4fr"] > div:first-child{grid-column:1 / -1}

  /* ---- Type scale ---- */
  [style*="font-size: 52px"]{font-size:34px !important;line-height:1.15 !important}
  [style*="font-size: 46px"]{font-size:32px !important;line-height:1.18 !important}
  [style*="font-size: 44px"]{font-size:32px !important;line-height:1.18 !important}
  [style*="font-size: 38px"]{font-size:28px !important;line-height:1.2 !important}
  [style*="font-size: 34px"]{font-size:25px !important}
  [style*="font-size: 30px"]{font-size:23px !important}
  [style*="font-size: 24px"]{font-size:21px !important}
  [style*="font-size: 18px"]{font-size:16px !important}
  [style*="font-size: 17px"]{font-size:15.5px !important}

  /* Wide-tracked eyebrow labels wrap awkwardly at full tracking */
  [style*="letter-spacing: 0.28em"],
  [style*="letter-spacing: 0.24em"],
  [style*="letter-spacing: 0.22em"]{letter-spacing:0.12em !important;line-height:1.5}

  /* ---- Section spacing ---- */
  [style*="padding: 26px 40px"]{padding:14px 18px !important}
  [style*="padding: 64px 40px"]{padding-top:44px !important;padding-bottom:52px !important}
  [style*="padding: 56px 40px"],
  [style*="padding: 48px 40px"],
  [style*="padding: 72px 40px"]{padding-top:44px !important}
  [style*="padding: 88px 40px"]{padding:48px 20px 52px !important}
  [style*="padding: 52px 40px"]{padding-top:40px !important;padding-bottom:44px !important}
  [style*="padding: 64px 40px"],
  [style*="padding: 56px 40px"],
  [style*="padding: 48px 40px"],
  [style*="padding: 52px 40px"],
  [style*="padding: 72px 40px"],
  [style*="padding: 24px 40px"],
  [style*="padding: 20px 40px"],
  [style*="padding: 0px 40px"]{padding-left:20px !important;padding-right:20px !important}
  [style*="padding: 64px 56px"]{padding:40px 22px !important}
  [style*="padding: 44px 48px"]{padding:28px 20px !important}
  [style*="padding: 40px 48px"]{padding:28px 20px !important}
  [style*="padding: 32px 36px"]{padding:24px 18px 28px !important}
  [style*="padding: 56px 36px"]{padding:40px 22px !important}
  [style*="gap: 64px"]{gap:32px !important}
  [style*="gap: 48px"],[style*="gap: 56px"]{gap:28px !important}

  /* ---- Flex rows that must stack or wrap ---- */
  [style*="justify-content: space-between"]{flex-wrap:wrap;row-gap:14px}
  div[style*="justify-content: space-between"] > a:not(.wordmark-link){
    flex:1 1 100%;
    text-align:center;
    box-sizing:border-box;
  }
  [style*="display: flex; gap: 14px"]{flex-direction:column;align-items:stretch;flex-wrap:nowrap}
  [style*="display: flex; gap: 14px"] > a{text-align:center}
  [style*="align-items: center; gap: 12px"]{flex-wrap:wrap;row-gap:10px}

  /* Parallax backgrounds stutter on mobile */
  [style*="fixed"]{background-attachment:scroll !important}

  /* Comfortable tap targets for footer link stacks */
  [style*="flex-direction: column; gap: 9px"]{gap:2px !important}
  [style*="flex-direction: column; gap: 9px"] a{padding:7px 0}

  input,select,textarea{font-size:16px !important}

  /* ---- Header + hamburger nav ---- */
  .site-header{
    flex-wrap:nowrap !important;
    position:relative;
    z-index:20;
  }
  .site-header .wordmark{width:124px}
  .nav-burger{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    width:44px;
    height:44px;
    border-radius:8px;
    border:1.5px solid rgba(255,255,255,0.35);
    background:rgba(255,255,255,0.08);
    cursor:pointer;
    flex:0 0 auto;
    box-sizing:border-box;
  }
  .nav-burger span{
    display:block;
    width:18px;
    height:2px;
    background:#FFFFFF;
    border-radius:1px;
    transition:transform .2s,opacity .2s;
  }
  .nav-toggle:checked + .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-toggle:checked + .nav-burger span:nth-child(2){opacity:0}
  .nav-toggle:checked + .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .site-nav{
    display:none !important;
    position:absolute;
    top:calc(100% + 6px);
    left:18px;
    right:18px;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    flex-wrap:nowrap !important;
    gap:0 !important;
    background:#0D234A;
    border:1px solid rgba(255,255,255,0.14);
    border-radius:12px;
    padding:6px 0 12px;
    box-shadow:0 18px 40px rgba(4,12,28,0.5);
  }
  .nav-toggle:checked ~ .site-nav{display:flex !important}
  .site-nav a{
    padding:14px 20px;
    border-top:1px solid rgba(255,255,255,0.08);
    font-size:15px !important;
    color:#FFFFFF !important;
  }
  .site-nav a:first-child{border-top:none}
  .site-nav a[href="support.html"]{color:#ED7A2A !important}
  .site-nav a[href="request-demo.html"]{
    margin:10px 20px 4px;
    text-align:center;
    border-top:none;
    background:#ED7A2A !important;
    border-radius:8px;
    padding:14px 20px;
  }
}
