/* Shared mobile header: logo + call button + menu toggle, with the page
   links moved into a drop-down panel so nothing overflows small screens. */
.nav-toggle, .nav-menu { display:none; }

@media (max-width:768px) {
  .nav {
    height:62px !important; min-height:62px;
    padding:0 16px !important;
    gap:12px; flex-wrap:nowrap !important;
  }
  .nav-logo { font-size:19px !important; white-space:nowrap; flex:0 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; }
  .nav-logo .nav-logo-extra { display:none; }
  .nav-center, .nav-cta, .nav .nav-link { display:none !important; }
  .nav-right, .nav-links, .nav-actions {
    display:flex !important; align-items:center; gap:10px !important;
    flex:0 0 auto; margin-left:auto;
  }
  .nav-phone {
    display:inline-flex !important; align-items:center; gap:6px;
    white-space:nowrap;
    font-family:'Jost',sans-serif !important;
    font-size:13px !important; font-weight:500 !important; letter-spacing:0.04em !important;
    background:var(--brown,#614338); color:var(--cream,#ece6d8) !important;
    padding:10px 14px !important; line-height:1; text-decoration:none;
  }

  .nav-toggle {
    display:inline-flex; flex-direction:column; justify-content:center; align-items:center; gap:5px;
    width:40px; height:40px; padding:0; flex:0 0 auto;
    background:transparent; border:1px solid rgba(97,67,56,0.3); cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }
  .nav-toggle span {
    display:block; width:18px; height:1.5px; background:#614338;
    transition:transform 0.25s, opacity 0.25s;
  }
  .nav.menu-open .nav-toggle span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
  .nav.menu-open .nav-toggle span:nth-child(2) { opacity:0; }
  .nav.menu-open .nav-toggle span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }

  .nav-menu {
    position:absolute; top:100%; left:0; right:0;
    display:flex; flex-direction:column;
    background:var(--cream,#ece6d8);
    border-bottom:1px solid rgba(97,67,56,0.18);
    box-shadow:0 12px 24px rgba(97,67,56,0.12);
    padding:6px 20px 16px;
    visibility:hidden; opacity:0; transform:translateY(-6px);
    transition:opacity 0.2s, transform 0.2s, visibility 0.2s;
  }
  .nav.menu-open .nav-menu { visibility:visible; opacity:1; transform:none; }
  .nav-menu a {
    display:block; padding:15px 2px;
    font-family:'Jost',sans-serif; font-size:15px; font-weight:500;
    letter-spacing:0.16em; text-transform:uppercase;
    color:#1e1108; text-decoration:none;
    border-bottom:1px solid rgba(97,67,56,0.12);
  }
  .nav-menu a.active { color:var(--brown,#614338); }
  .nav-menu a.nav-menu-cta {
    margin-top:14px; border:none; text-align:center;
    background:var(--brown,#614338); color:var(--cream,#ece6d8);
  }
}

@media (max-width:360px) {
  .nav { padding:0 12px !important; gap:8px; }
  .nav-logo { font-size:17px !important; }
  .nav-phone { font-size:12px !important; padding:9px 10px !important; }
}
