/* Guides dropdown, shared by the homepage, guide pages and booking page */
.dd{position:relative;display:inline-block}
.dd summary{list-style:none;cursor:pointer;color:var(--charcoal);font-size:15px;letter-spacing:.08em;display:inline-flex;align-items:center;gap:6px;user-select:none}
.dd summary::-webkit-details-marker{display:none}
.dd summary::after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.dd[open] summary::after{transform:rotate(-135deg) translateY(-1px)}
.dd summary:hover{color:var(--accent)}
.dd-menu{position:absolute;right:0;top:calc(100% + 14px);min-width:240px;background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--brass-line);box-shadow:0 12px 30px rgba(0,0,0,.08);padding:8px 0;z-index:20;display:flex;flex-direction:column}
.dd-menu a{display:block;padding:10px 18px;color:var(--charcoal) !important;text-decoration:none;font-size:15px;letter-spacing:.02em;white-space:nowrap}
.dd-menu a:hover{background:var(--bone);color:var(--accent) !important}
.dd-menu a.all{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--olive) !important;border-bottom:1px solid var(--line);margin-bottom:4px}
/* phones: no guides menu in the header (Guides link lives in the footer and breadcrumbs) */
@media (max-width:780px){.dd,.nav ul li.dd-li{display:none !important}}

/* ---------- Phone menu (☰) ---------- */
.menu-btn{display:none;background:none;border:1px solid var(--line);width:40px;height:36px;padding:0;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;flex:none}
.menu-btn span{display:block;width:18px;height:2px;background:var(--charcoal);transition:transform .2s,opacity .2s}
html.m-open .menu-btn span:nth-child(1){transform:translateY(7px) rotate(45deg)}
html.m-open .menu-btn span:nth-child(2){opacity:0}
html.m-open .menu-btn span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.m-menu{position:fixed;left:0;right:0;top:64px;bottom:0;background:var(--bone);z-index:50;overflow-y:auto;padding:28px 24px 40px;display:flex;flex-direction:column;gap:28px;border-top:1px solid var(--line)}
.m-menu[hidden]{display:none}
.m-menu nav{display:flex;flex-direction:column}
.m-menu .m-big{font-family:var(--serif);font-size:30px;line-height:1.2;color:var(--charcoal);text-decoration:none;padding:10px 0;border-bottom:1px solid var(--line)}
.m-menu .m-lbl{margin:26px 0 6px;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--olive);font-weight:500}
.m-menu .m-small{font-size:17px;color:var(--charcoal);text-decoration:none;padding:9px 0}
.m-menu .m-all{color:var(--accent);font-size:15px}
.m-menu .m-row{display:flex;gap:12px}
.m-menu .m-theme,.m-menu .m-lang{flex:1;text-align:center;font:500 14px var(--sans);letter-spacing:.08em;color:var(--charcoal);background:transparent;border:1px solid var(--line);padding:12px;text-decoration:none;cursor:pointer}
.m-menu .m-book{text-align:center;display:block}
html.m-open,html.m-open body{overflow:hidden}
@media (max-width:780px){
  .menu-btn{display:inline-flex}
  /* in the header on phones: logo, language, Book, menu button */
  .nav ul li.theme-li,.navr .theme-btn,.navr a.plain,.navr .back,.dd{display:none !important}
  .nav{gap:10px}
}
@media (max-width:600px){.menu-btn{width:36px;height:32px}}
@media (max-width:360px){.nav .lang-li,.navr .lang{display:none !important}}
@media (max-width:360px){header .wordmark{letter-spacing:.06em !important;font-size:15px !important}header .nav .btn{padding:8px 8px !important}.nav{gap:8px}}

/* Guides sub-list in the phone menu (shown once there are several guides) */
.m-menu .m-sub{background:none;border:0;border-bottom:1px solid var(--line);text-align:left;width:100%;cursor:pointer;display:flex;justify-content:space-between;align-items:center}
.m-menu .m-sub::after{content:"";width:9px;height:9px;border-right:2px solid var(--charcoal);border-bottom:2px solid var(--charcoal);transform:rotate(45deg) translateY(-3px);margin-right:6px;transition:transform .2s}
.m-menu .m-sub[aria-expanded="true"]::after{transform:rotate(-135deg)}
.m-menu .m-subl{display:flex;flex-direction:column;padding:6px 0 10px 16px;border-bottom:1px solid var(--line);border-left:2px solid var(--brass-line);margin-top:8px}
.m-menu .m-subl[hidden]{display:none}
.m-menu .m-subl a{font-size:18px;color:var(--charcoal);text-decoration:none;padding:9px 0}
.m-menu .m-subl a.m-all{color:var(--accent);font-size:15px;letter-spacing:.04em}