/* ============================================================================
   MABA — shared chrome (nav + footer) behaviour layer.
   The nav/footer MARKUP now carries the design's inline styles verbatim
   (chrome/nav.html, chrome/footer.html). This file only does the few things
   inline styles can't: the auth-slot swap, the logo crossfade, hover on the
   CTA, the active-link treatment, and the mobile burger. Everything here is
   scoped to the chrome ids/classes so it never leaks into page bodies, and it
   uses !important only where it must beat a ported inline base style.
   ========================================================================== */

/* ── Logo crossfade: Latin ⇄ Kannada, opacity .7s, toggled every 3.4s by
      chrome.js (.is-on). Beats the inline opacity:0 on #siteBrandKn. ── */
#siteBrandKn.is-on{opacity:1 !important}
@media (prefers-reduced-motion:reduce){ #siteBrandKn{transition:none !important} }

/* ── Nav links: plain ink, never underlined. Active page (aria-current, applied
      at stamp time) gets the design's red + 2px underline, matching the inner
      pages' active treatment. ── */
.site-nav__link{text-decoration:none}
.site-nav__link[aria-current="page"]{color:#ef2803 !important;border-bottom:2px solid #ef2803;padding-bottom:2px}

/* ── Auth slot: TWO states. The pre-paint <head> script sets html.is-anon / html.is-auth
      from the maba_auth hint cookie; chrome.js (/api/me) corrects it. Anonymous users —
      with or without free dubs left — always get one CTA; signed-in users get the chip.
      All children live in the DOM so swaps never shift layout.
        is-anon (default) → Sign in (.as-signin) + Start here (.as-cta)
        is-auth           → account chip + dropdown (.as-account)
      The Sign in link is the ONLY way back into an existing account: before it, the
      sole sign-in link lived inside the signup modal, which opens only on a gate
      bounce — so a returning customer had to burn their free dubs to reach their
      own wallet. It must therefore never show for someone already signed in. ── */
#siteNavAuth{display:inline-flex;align-items:center;gap:14px}
#siteNavAuth .as-cta{display:inline-flex;align-items:center;text-decoration:none}
/* Outlined button, same height/rhythm as .as-cta (11px 20px + 1.5px border), so
   "Sign in" reads as an ACTION rather than a fifth nav link merging into
   Dub/Download/Pricing/About. Transparent so the red CTA stays the primary. */
#siteNavAuth .as-signin{display:inline-flex;align-items:center;text-decoration:none;
  background:transparent;border:1.5px solid rgba(30,27,23,.28);
  padding:calc(11px - 1.5px) calc(20px - 1.5px);font-weight:700;line-height:1}
#siteNavAuth .as-account{display:none}
html.is-auth #siteNavAuth .as-cta{display:none !important}
html.is-auth #siteNavAuth .as-signin{display:none !important}
html.is-auth #siteNavAuth .as-account{display:inline-flex !important}
#siteNavAuth .as-signin:hover{color:#ef2803 !important;border-color:#ef2803 !important}
#siteNavAuth .as-cta:hover{background:#c11f00 !important;color:#fff}
#siteNavAuth .as-chip:hover{border-color:#ef2803 !important}
#siteNavName{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.as-caret{color:rgba(30,27,23,.45);flex:none;transition:transform .2s ease}
#siteNavChip[aria-expanded="true"] .as-caret{transform:rotate(180deg)}

/* ── Account dropdown — matches the design's card aesthetic: paper bg, 1.5px
      hairline border, square corners, DM Mono labels. Chrome-owned, so it works
      on every page (index / dub / pricing / download / about). ── */
.as-menu{position:absolute;top:calc(100% + 10px);right:0;width:280px;background:#fffdf5;
  border:1.5px solid rgba(30,27,23,.16);box-shadow:0 16px 40px rgba(30,27,23,.16);
  padding:18px;z-index:40;text-align:left;font:400 14px 'Archivo',sans-serif;color:#1e1b17}
.asm-label{font:500 10.5px 'DM Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:rgba(30,27,23,.45)}
.asm-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px;font-size:14px}
.asm-name{font-weight:700}
.asm-note{font:400 11.5px 'DM Mono',monospace;color:rgba(30,27,23,.4);margin-top:4px}
.asm-hr{border:none;border-top:1px solid rgba(30,27,23,.14);margin:14px 0}
.asm-link{color:#ef2803;font-weight:700;cursor:pointer;font-size:13px}
.asm-input{flex:1;padding:6px 8px;border:1.5px solid rgba(30,27,23,.2);background:#f7f1e2;color:#1e1b17;font:400 13px 'Archivo',sans-serif}
.asm-signout{display:block;width:100%;text-align:center;padding:10px;margin-top:6px;
  border:1.5px solid rgba(30,27,23,.2);background:#f7f1e2;font:700 13px 'Archivo',sans-serif;color:#1e1b17;cursor:pointer}
.asm-signout:hover{border-color:#ef2803;color:#ef2803}

/* ── Mobile burger: hidden on desktop, collapses the links into a dropdown. ── */
.site-nav__burger{display:none;width:38px;height:38px;align-items:center;justify-content:center;
  color:#1e1b17;background:none;border:0;cursor:pointer}
.site-nav__burger svg{width:20px;height:20px}

@media (max-width:820px){
  .site-nav__inner{position:relative;padding-left:20px !important;padding-right:20px !important}
  .site-nav__links{display:none !important;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;gap:0 !important;align-items:stretch;
    background:#f7f1e2;border-bottom:1px solid rgba(30,27,23,.12);padding:6px 0}
  .site-nav__links.open{display:flex !important}
  .site-nav__links a{padding:12px 20px;font-size:16px}
  .site-nav__burger{display:inline-flex}
}

/* ── Contact modal (opened from footer [data-contact] links; matches the design card) ── */
.mb-contact-ov{position:fixed;inset:0;z-index:100;display:none;align-items:flex-start;justify-content:center;padding:6vh 20px;background:rgba(23,21,15,.55);overflow-y:auto}
.mb-contact-ov.is-open{display:flex}
.mb-contact-card{position:relative;width:100%;max-width:520px;background:#fffdf5;border:1.5px solid rgba(30,27,23,.14);padding:34px 32px;box-shadow:0 24px 60px rgba(23,21,15,.28)}
.mb-contact-x{position:absolute;top:12px;right:12px;width:34px;height:34px;border:none;background:transparent;font-size:26px;line-height:1;color:rgba(30,27,23,.5);cursor:pointer}
.mb-contact-x:hover{color:#ef2803}
.mb-contact-eyebrow{font:500 11px 'DM Mono',monospace;letter-spacing:.16em;text-transform:uppercase;color:#ef2803;margin-bottom:12px}
.mb-contact-h{font:900 34px/1.02 'Archivo',sans-serif;letter-spacing:-.03em;color:#1e1b17;margin:0 0 8px}
.mb-contact-sub{font:400 15px/1.5 'Archivo',sans-serif;color:rgba(30,27,23,.6);margin:0 0 22px}
.mb-contact-form{display:flex;flex-direction:column;gap:14px}
.mb-contact-form label{display:flex;flex-direction:column;gap:6px;font:600 13px 'Archivo',sans-serif;color:#1e1b17}
.mb-contact-form .opt{font-weight:400;color:rgba(30,27,23,.45)}
.mb-contact-form input,.mb-contact-form select,.mb-contact-form textarea{font:400 15px 'Archivo',sans-serif;color:#1e1b17;background:#fff;border:1.5px solid rgba(30,27,23,.2);padding:11px 12px;outline:none;border-radius:0;width:100%}
.mb-contact-form input:focus,.mb-contact-form select:focus,.mb-contact-form textarea:focus{border-color:#ef2803}
.mb-contact-form textarea{resize:vertical;min-height:96px}
.mb-hp{position:absolute !important;left:-9999px !important;width:1px;height:1px;opacity:0}
.mb-contact-send{margin-top:4px;background:#ef2803;color:#fff;border:none;font:700 16px 'Archivo',sans-serif;padding:15px;cursor:pointer}
.mb-contact-send:hover{background:#c11f00}
.mb-contact-send:disabled{opacity:.6;cursor:default}
.mb-contact-msg{font:500 13px 'DM Mono',monospace;min-height:1px}
.mb-contact-msg.err{color:#c11f00}
.mb-contact-done{display:flex;gap:14px;align-items:center;font:400 16px/1.5 'Archivo',sans-serif;color:#1e1b17;padding:10px 0}
.mb-contact-tick{width:44px;height:44px;border-radius:50%;background:#ef2803;color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;flex:none}