/* =========================================================
   STRAIVV — Hide Blocksy header on mobile (full app mode)
========================================================= */
@media (max-width: 999px) {
  header#header,
  .ct-header,
  .ct-sticky-container {
    display: none !important;
  }

  /* Remove any top offset Blocksy may reserve */
  body {
    padding-top: 0 !important;
  }
}


/* Hide Blocksy header on desktop only */
@media (min-width: 1024px) {
  header#header,
  .ct-header {
    display: none !important;
  }

  /* Remove the top offset that Blocksy sometimes keeps */
  body {
    padding-top: 0 !important;
  }
}

/* =========================================================
   STRAIVV — Frosted sticky header (mobile)
========================================================= */
@media (max-width: 999px) {

  .ct-sticky-container,
  .ct-sticky-container [data-sticky]{
    background: transparent !important;
  }

  /* Default fallback (works everywhere) */
  .ct-sticky-container [data-sticky] [data-row="middle"]{
    position: relative !important;
    background-color: rgba(255,255,255,0.85) !important; /* fallback */
  }

  /* Frosted glass only where supported */
  @supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .ct-sticky-container [data-sticky] [data-row="middle"]{
      background-color: rgba(255,255,255,0.25) !important;
      -webkit-backdrop-filter: blur(8px) saturate(140%) !important;
      backdrop-filter: blur(8px) saturate(140%) !important;

      /* helps some GPUs / Android compositing */
      will-change: backdrop-filter;
      transform: translateZ(0);
    }
  }

  /* Make the header behave like normal flow on single-session,
     but do NOT break the drawer by forcing static on everything */
  body.single-session .ct-sticky-container{
    position: relative !important;
  }

  body.single-session .ct-sticky-container [data-sticky*="yes"]{
    position: relative !important;
  }
} /* ✅ close @media (max-width: 999px) */

/* STRAIVV — Homepage device gating (CSS) */

/* Default: assume non-phone (desktop + tablets) */
body.home .straivv-home-qr { display: block !important; }
body.home .straivv-home-mobile { display: none !important; }

/* Phones: show mobile landing, hide QR */
@media (max-width: 687px) {
  body.home .straivv-home-qr { display: none !important; }
  body.home .straivv-home-mobile { display: block !important; }
}

/* =========================================================
   STRAIVV — Visually hidden (password manager compatible)
   ========================================================= */
.straivv-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}