/* ---------- Mobile nav adjustments (only <= 600px) ---------- */
@media (max-width: 600px) {
  .nav { grid-template-columns: 1fr auto 1fr !important; }
  .nav-brand { grid-column: 2 !important; justify-self: center !important; }
  .nav-right { grid-column: 3 !important; justify-content: flex-end !important; }
  .nav-right .pill { display: none !important; }

  /* Reserve room at the bottom so content can scroll past the floating capsule */
  body { padding-bottom: 96px; }

  /* Footer wordmark — shrink so KOMODO LOUNGE fits the viewport */
  .foot-brand .mark {
    font-size: clamp(24px, 7.5vw, 32px) !important;
    letter-spacing: 0.16em !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: clip;
  }
}

/* ---------- Footer address list (used by pages that don't style it inline) ---------- */
.foot-address {
  list-style: none;
  margin-top: 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 14.5px;
  color: #1C1814;
}
.foot-address a { transition: color .25s; }
.foot-address a:hover { color: #85634D; }

/* ---------- Footer: force single-column stack on narrow viewports ---------- */
@media (max-width: 900px) {
  .foot-top {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
  .foot-brand, .foot-col { min-width: 0; }
  .foot-brand .tag { max-width: none; }
}

/* ---------- Mobile floating capsule (two symmetric buttons) ---------- */
.mobile-bar { display: none; }

@media (max-width: 600px) {
  .mobile-bar {
    display: flex;
    position: fixed;
    left: 50%;
    bottom: calc(16px + env(safe-area-inset-bottom));
    transform: translateX(-50%);
    z-index: 60;

    background: #3A2A1F;
    border-radius: 999px;
    padding: 6px;
    gap: 6px;
    box-shadow: 0 10px 32px rgba(15, 9, 5, 0.28);
  }
  .mobile-bar a {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-width: 110px;

    padding: 12px 24px;
    background: #F4EDE2;
    color: #1C1814;
    border-radius: 999px;

    font-family: 'Inter Tight', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 11.5px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;

    transition: background .2s ease, color .2s ease;
  }
  .mobile-bar a:active {
    background: #FBFAF8;
  }
}