/* nav-final.css v4 — mobile CTA in-list. Tightens top space, styles both
   buttons clearly, forces readable button text. */

.nav-mobile-cta { display: none; }

@media (max-width: 880px) {
  .nav-mobile-cta { display: block; border-bottom: 0 !important; }
  .nav-mobile-cta .btn {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
    margin-top: 12px !important;
    min-height: 50px !important;
    line-height: 50px !important;
    padding: 0 16px !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
  }
  .nav-mobile-cta:first-of-type { margin-top: 20px !important; }

  /* Sign in = outlined button so it reads as tappable */
  .nav-mobile-cta .btn-ghost {
    border: 1.5px solid var(--ink-10, rgba(0,0,0,.15)) !important;
    color: var(--ink, #140e08) !important;
    background: transparent !important;
  }
  /* Get started = solid; force white label so it's visible */
  .nav-mobile-cta .btn-primary {
    background: var(--ink, #140e08) !important;
    color: #fff !important;
  }
  .nav-mobile-cta .btn-primary * { color: #fff !important; }

  /* Hide the separate top .nav-cta panel on mobile */
  html body nav.site-nav .nav-cta { display: none !important; }

  /* Drawer = the links panel; tighter top padding (close btn is small) */
  html body nav.site-nav .nav-links {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    height: 100dvh;
    width: min(86vw, 360px);
    padding: 72px 24px 32px;
    overflow-y: auto;
    background: var(--paper-pure, #fcfaf6);
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.4,0,0.2,1);
    z-index: 105;
    box-shadow: -20px 0 60px rgba(0,0,0,0.08);
  }
  html body nav.site-nav.is-menu-open .nav-links { transform: translateX(0); }

  /* First real link sits close to the top, no big gap */
  html body nav.site-nav .nav-links > li:first-child { padding-top: 0 !important; }

  html body nav.site-nav .nav-toggle {
    position: fixed;
    top: 18px;
    right: 18px;
    width: 44px;
    height: 44px;
    z-index: 130;
  }
}