/* Blue Lance 2.0 — full-site page template styles.
   Generated from blue-lance-website/ (source of truth). Do not hand-edit;
   re-run  node port-to-theme.js  to regenerate. Loaded AFTER brand.css so the
   design's own resets win over the global brand base styles. */

*{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{margin:0;background:#fff;-webkit-font-smoothing:antialiased;}
  a{text-decoration:none;color:inherit;}
  [data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .72s cubic-bezier(.16,.8,.3,1) var(--rd,0s),transform .72s cubic-bezier(.16,.8,.3,1) var(--rd,0s);will-change:opacity,transform;}
  [data-reveal].rv-in{opacity:1;transform:none;}
  @keyframes blPulse{0%,100%{opacity:1}50%{opacity:.3}}
  @keyframes blDrift{from{transform:translateY(-7%) rotate(20deg)}to{transform:translateY(7%) rotate(20deg)}}
  @keyframes blScan{from{background-position:0 0}to{background-position:0 220px}}
  @keyframes blRise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
  @keyframes blFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
  @media (prefers-reduced-motion:reduce){
    [data-reveal]{opacity:1!important;transform:none!important;transition:none!important;}
    *{animation-duration:.001ms!important;animation-iteration-count:1!important;}
  }

/* --- standalone runtime styles --- */
  .dc-page{display:none;}
  .dc-page.is-active{display:block;}
  [data-cond][hidden]{display:none;}
  /* scroll-padding clears the sticky nav (~58-72px) so scrollIntoView / anchor jumps
     don't tuck content under the header (e.g. the assessment stepping through steps). */
  html{-webkit-text-size-adjust:100%;scroll-padding-top:92px;}

  /* ===== Accessibility: visible focus (WCAG 2.2) ===== */
  #bl-root a:focus-visible,#bl-root button:focus-visible,#bl-root input:focus-visible,#bl-root textarea:focus-visible{
    outline:2px solid #16BDE8;outline-offset:3px;border-radius:5px;
  }
  /* Reset native button chrome so the OS accent colour can't tint our buttons on hover/active */
  #bl-root button{-webkit-appearance:none!important;appearance:none!important;-webkit-tap-highlight-color:transparent!important;-webkit-user-select:none;user-select:none;}
  /* The contact form's submit keeps its cyan on every state (inline bg + these overrides) */
  #bl-root button[data-submit],#bl-root button[data-submit]:hover,#bl-root button[data-submit]:focus,#bl-root button[data-submit]:active,#bl-root button[data-submit]:focus-visible{background:#16BDE8!important;color:#04243A!important;}

  /* ===== Mobile nav toggle (hidden on desktop) =====
     iOS Safari paints a coloured tap/active/focus highlight on <button>; kill it across
     EVERY state with !important (transparent tap-highlight + transparent background).
     Icon stroke is hardcoded #fff so it never inherits a system colour. */
  .bl-burger{display:none;-webkit-appearance:none;appearance:none;border:0;color:#fff;-webkit-text-fill-color:#fff;padding:10px;margin:-10px -6px -10px 0;cursor:pointer;line-height:0;}
  .bl-burger,.bl-burger:hover,.bl-burger:focus,.bl-burger:active,.bl-burger:focus-visible{
    background:transparent!important;background-color:transparent!important;box-shadow:none!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important;
  }
  .bl-burger:focus{outline:none;}
  .bl-burger svg{display:block;transition:stroke .15s;}
  .bl-burger:hover svg,.bl-burger:focus-visible svg{stroke:#16BDE8;}

  /* ===== Tablet & below ===== */
  @media (max-width:900px){
    /* hamburger nav: the links row becomes a dropdown panel */
    #bl-root .bl-burger{display:inline-flex;align-items:center;}
    #bl-root header nav{position:relative;}
    #bl-root nav > [data-navlinks]{
      position:absolute;top:100%;left:0;right:0;
      flex-direction:column!important;align-items:stretch!important;gap:2px!important;
      background:#04243A;
      border-top:1px solid rgba(22,189,232,.18);
      padding:10px 24px 20px;box-shadow:0 26px 46px rgba(0,0,0,.45);
      max-height:0;opacity:0;visibility:hidden;overflow:hidden;
      transition:max-height .32s cubic-bezier(.16,.8,.3,1),opacity .24s ease,visibility .24s;
    }
    #bl-root header.bl-nav-open nav > [data-navlinks]{max-height:80vh;opacity:1;visibility:visible;}
    #bl-root nav > [data-navlinks] > a{
      min-height:50px;display:flex;align-items:center;padding:8px 2px;
      font-size:17px;color:#fff;border-bottom:1px solid rgba(255,255,255,.08);
    }
    #bl-root nav > [data-navlinks] > a[style*="background:#16BDE8"]{
      justify-content:center;margin-top:12px;padding:15px;border-radius:9px;border-bottom:0;box-shadow:none;
    }
    /* section horizontal padding */
    #bl-root main > section > div,#bl-root footer > div{padding-left:clamp(20px,5vw,40px)!important;padding-right:clamp(20px,5vw,40px)!important;}
    /* two-column layouts -> single column */
    #bl-root [style*="grid-template-columns:1.05fr .95fr"],
    #bl-root [style*="grid-template-columns:.9fr 1.1fr"],
    #bl-root [style*="grid-template-columns:.85fr 1.15fr"],
    #bl-root [style*="grid-template-columns:1fr 1.1fr"],
    #bl-root [style*="grid-template-columns:1fr 1fr;gap:60px"],
    #bl-root [style*="grid-template-columns:1fr 1fr;gap:20px"],
    #bl-root [style*="grid-template-columns:1fr 1fr;gap:18px"]{grid-template-columns:1fr!important;gap:36px!important;}
    /* footer 4-col -> 2-col */
    #bl-root [style*="grid-template-columns:1.4fr 1fr 1fr 1fr"]{grid-template-columns:1fr 1fr!important;gap:32px!important;}
    /* soften the diagonal lance motif on small screens */
    #bl-root [style*="rotate(20deg)"]{opacity:.2!important;}
    #bl-root h1{font-size:clamp(2.4rem,6vw,3.4rem)!important;}
  }

  /* ===== Phone ===== */
  @media (max-width:600px){
    #bl-root [style*="grid-template-columns:repeat(3,1fr)"]{grid-template-columns:1fr!important;}
    #bl-root [style*="repeat(4,1fr);gap:32px"]{grid-template-columns:repeat(2,1fr)!important;} /* stats */
    #bl-root [style*="repeat(4,1fr);gap:12px"]{grid-template-columns:repeat(3,1fr)!important;} /* compliance badges */
    #bl-root [style*="repeat(4,1fr);gap:0"]{grid-template-columns:1fr!important;}              /* outcomes */
    #bl-root [style*="grid-template-columns:1fr 1fr;gap:16px"]{grid-template-columns:1fr!important;} /* form pairs */
    #bl-root [style*="grid-template-columns:1.4fr 1fr 1fr 1fr"]{grid-template-columns:1fr!important;gap:34px!important;}
    /* product deep-dive: text before its visual (reset the desktop order swap;
       target children directly since the reveal JS re-serializes inline order values) */
    #bl-root [style*="grid-template-columns:1fr 1fr;gap:60px"] > *{order:0!important;}
    /* vertical rhythm */
    #bl-root main > section > div{padding-top:clamp(48px,11vw,72px)!important;padding-bottom:clamp(48px,11vw,72px)!important;}
    /* fluid display type */
    #bl-root h1{font-size:clamp(2rem,8.5vw,2.7rem)!important;line-height:1.07!important;}
    #bl-root h2{font-size:clamp(1.55rem,6.4vw,2.05rem)!important;line-height:1.14!important;}
    #bl-root h3{font-size:clamp(1.12rem,4.6vw,1.35rem)!important;}
    /* 16px inputs prevent iOS focus-zoom */
    #bl-root input,#bl-root textarea{font-size:16px!important;}
    /* stack hero / CTA button pairs full-width so labels don't wrap mid-word */
    #bl-root [style*="display:flex;gap:14px"]{flex-direction:column!important;align-items:stretch!important;}
    #bl-root [style*="display:flex;gap:14px"] > a{text-align:center!important;justify-content:center!important;}
  }

  @media (prefers-reduced-motion:reduce){
    #bl-root nav > [data-navlinks]{transition:none!important;}
  }