/* Phone pass: keeps the desktop "wow" on small screens.
   Home hero on a blueprint stage, a sticky quote bar, tap feedback, and tidier odd card grids.
   Loaded on every page after the other stylesheets; everything here is phone-only except the bar's base styles. */

/* ---------- Sticky quote bar (phones) ---------- */
.mb-bar{display:none}
@media (max-width:760px){
  .mb-bar{position:fixed;z-index:60;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));display:flex;gap:10px;align-items:center;padding:8px;border-radius:999px;background:#0b1622e6;backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);box-shadow:0 18px 40px -12px #0b1622a6,0 0 0 1px #ffffff1f;transform:translateY(calc(100% + 30px));opacity:0;transition:transform .45s cubic-bezier(.22,.8,.24,1),opacity .3s;pointer-events:none}
  .mb-bar.is-on{transform:none;opacity:1;pointer-events:auto}
  .menu-open .mb-bar{transform:translateY(calc(100% + 30px));opacity:0;pointer-events:none}
  .mb-bar .button{flex:1;justify-content:center;min-height:46px;margin:0;padding:10px 16px;font-size:15px}
  .mb-bar .mb-wa{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#ffffff14;border:1px solid #ffffff33;color:#fff}
  .mb-bar .mb-wa svg{width:22px;height:22px;fill:currentColor}
  .mb-bar .mb-wa:active{background:#ffffff2e}
  .mb-bar .mb-meta{flex:none;display:flex;flex-direction:column;padding:0 4px 0 12px;color:#fff;font:600 11px/1.25 Inter,sans-serif;letter-spacing:.02em}
  .mb-bar .mb-meta b{font-size:13px;color:#E5B85C}
  @media (max-width:360px){.mb-bar .mb-meta{display:none}}
}

@media (max-width:760px){
  /* ---------- Home hero: the mould on a blueprint stage ---------- */
  .home .sq-sticky{background:
    linear-gradient(#016fc014 1px,transparent 1px) 0 0/26px 26px,
    linear-gradient(90deg,#016fc014 1px,transparent 1px) 0 0/26px 26px,
    radial-gradient(90% 46% at 50% 30%,#d9ebfa 0%,#eef6fd 45%,#fff 80%)}
  .home .sq-canvas{mix-blend-mode:multiply}
  .home .sq-poster{mix-blend-mode:multiply;inset:auto;left:-21%;top:7.5%;width:142%;height:auto;padding:0;object-fit:contain}
  .home .sq-veil{background:linear-gradient(180deg,#fff0 0%,#fff0 40%,#ffffffd6 52%,#fff 62%)}
  .home .sq-intro .ind-row{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-16px;padding-right:16px}
  .home .sq-intro .ind-row::-webkit-scrollbar{display:none}
  .home .sq-intro .ind-row li{flex:none}
  .home .sq-chapters li{background:#ffffffd9;backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 20px 44px -18px #016fc059;border-radius:16px}
  .home .sq-bar{height:4px}

  /* ---------- Tap feedback ---------- */
  .button,.mw-card,.fm-card,.pj-card,.why-card,.gf-social a,.gf-social button{-webkit-tap-highlight-color:transparent}
  .button:active{transform:scale(.97)}
  .why-card:active,.pj-card:active{transform:scale(.985)}

  /* ---------- Odd card grids: the last card spans the row (set by mobile.js) ---------- */
  .mb-span{grid-column:1/-1!important}

  /* ---------- Section rhythm ---------- */
  .sec-head h2{text-wrap:balance}
  .sec-head p{text-wrap:pretty}
}
@media (max-width:760px) and (prefers-reduced-motion:reduce){
  .mb-bar{transition:none}
  .button:active,.why-card:active,.pj-card:active{transform:none}
}

/* ---------- Floating WhatsApp button (all pages, all sizes) ---------- */
.wa-fab{position:fixed;z-index:59;right:22px;bottom:calc(22px + env(safe-area-inset-bottom,0px));display:flex;align-items:center;gap:0;height:56px;padding:0 16px;border-radius:999px;background:#25D366;color:#fff;font:700 15px/1 Inter,sans-serif;text-decoration:none;box-shadow:0 16px 34px -10px #128c7ecc,0 0 0 1px #ffffff40 inset;transition:transform .4s cubic-bezier(.22,.8,.24,1),opacity .3s,gap .35s,box-shadow .3s}
.wa-fab svg{flex:none;width:26px;height:26px;fill:#fff}
.wa-fab span{max-width:0;overflow:hidden;white-space:nowrap;transition:max-width .4s cubic-bezier(.22,.8,.24,1)}
.wa-fab:hover,.wa-fab:focus-visible{gap:10px;box-shadow:0 20px 40px -10px #128c7ee6}
.wa-fab:hover span,.wa-fab:focus-visible span{max-width:200px}
.wa-fab:focus-visible{outline:3px solid #0B1622;outline-offset:3px}
.wa-fab::before{content:"";position:absolute;inset:0;border-radius:inherit;border:2px solid #25D366;animation:waPulse 2.4s ease-out infinite;pointer-events:none}
@keyframes waPulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.45);opacity:0}}
.wa-fab.is-away{transform:translateY(140%);opacity:0;pointer-events:none}
.menu-open .wa-fab{opacity:0;pointer-events:none}
@media (max-width:760px){.wa-fab{right:14px;bottom:calc(16px + env(safe-area-inset-bottom,0px));height:52px;padding:0 13px}}
@media (prefers-reduced-motion:reduce){.wa-fab::before{animation:none}.wa-fab{transition:none}}
