/*
 * mobile.css — Responsive overrides for stica.co.uk
 * Loaded after stica.css + scenes.css.
 * Desktop untouched; all rules are inside max-width: 719px unless noted.
 */


/* ──────────────────────────────────────────────────────
   HAMBURGER BUTTON (hidden by default; shown only on mobile)
   ────────────────────────────────────────────────────── */

.nav-ham {
  display: none;
  background: transparent;
  border: 1px solid var(--line2);
  border-radius: 5px;
  padding: 7px 10px;
  cursor: pointer;
  color: var(--ink);
  line-height: 1;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.nav-ham svg { display: block; }

/* Keep hamburger hidden on desktop (safety) */
@media (min-width: 720px) {
  .nav-ham { display: none !important; }
  .nav-links { display: flex !important; }
}


/* ──────────────────────────────────────────────────────
   MOBILE OVERRIDES
   ────────────────────────────────────────────────────── */

@media (max-width: 719px) {

  /* ── Header ── */
  .st-head { padding: 13px 20px; }

  /* Show hamburger */
  .nav-ham { display: flex; }

  /* Hide desktop nav row; replace with dropdown on .nav-open */
  .nav-links {
    display: none !important;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    flex-direction: column;
    background: var(--bg);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 8px 20px rgba(0,0,0,.09);
    padding-bottom: 12px;
    z-index: 99;
  }
  .nav-links.nav-open {
    display: flex !important;
  }

  /* Nav links: full-width tap targets */
  .nav-links a:not(.st-btn) {
    display: block !important;
    padding: 14px 20px !important;
    font-size: 15px !important;
    color: var(--ink) !important;
    text-decoration: none !important;
    border-bottom: 1px solid var(--line);
  }
  .nav-links a.st-btn.acc {
    display: block !important;
    margin: 12px 20px 0 !important;
    text-align: center;
    font-size: 14px !important;
    padding: 12px 16px !important;
    border-radius: 6px !important;
    border-bottom: none !important;
  }
  .nav-links .st-modebtn {
    display: block !important;
    width: calc(100% - 40px) !important;
    margin: 8px 20px 0 !important;
    padding: 10px 0 !important;
    font-size: 14px !important;
    text-align: left;
    background: transparent;
    border: 0;
    color: var(--ink2);
    cursor: pointer;
  }

  /* ── Section padding ── */
  .st-section { padding: 28px 20px; }

  /* ── Typography ── */
  .st-display {
    font-size: 38px !important;
    letter-spacing: -2px !important;
    line-height: 0.94 !important;
  }
  .st-h2 {
    font-size: 22px !important;
    letter-spacing: -0.6px !important;
  }

}