/* The header and footer every public page shares, taken from the homepage.
   The markup lives in each page and test/site-chrome.test.js holds every page
   to the homepage's copy, so change both here and in index.html, never one
   page on its own. Colours are written out rather than read from variables
   because the landing pages name their variables differently. */

/* NAV */
.nav{display:flex;align-items:center;gap:24px;padding:20px 28px;position:sticky;top:0;z-index:100;background:rgba(255,253,249,0.95);backdrop-filter:blur(12px);border-bottom:1px solid rgba(0,0,0,0.08)}
/* Full-width bar, links held to the 1100px column, so nothing shows beside it
   when a page scrolls under it. */
@media(min-width:768px){.nav{padding:20px max(48px,calc(50% - 502px));width:100%}}
.nav-brand{margin-right:auto;font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:700;letter-spacing:3px;text-transform:uppercase}
.nav-brand a{color:#111;text-decoration:none}
.nav-brand .haus{font-weight:600;color:#D4522E}
.nav-links{display:flex;gap:24px;align-items:center}
.nav-link{font-family:'Outfit',sans-serif;font-size:11px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:#3A3A3A;text-decoration:none;transition:color .2s}
.nav-link:hover{color:#E8634A}
.nav-reserve{font-family:'Outfit',sans-serif;font-size:11px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:#FFFDF9;background:#111;text-decoration:none;padding:10px 20px;transition:background .2s;white-space:nowrap}
.nav-reserve:hover{background:#E8634A}
.nav-toggle{display:none}
@media(max-width:767px){
  .nav{padding:14px 16px}
  .nav-brand{font-size:18px;letter-spacing:2px}
  .nav{gap:12px}
  /* Phones: Book Now stays in the bar and the links fold into a menu. */
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:#FFFDF9;border-bottom:1px solid rgba(0,0,0,0.08);box-shadow:0 14px 24px rgba(0,0,0,0.08)}
  .nav.open .nav-links{display:flex}
  .nav-link{font-size:12px;padding:16px;border-top:1px solid rgba(0,0,0,0.08)}
  .nav-reserve{padding:8px 13px;font-size:10px;letter-spacing:1px}
  .nav-toggle{display:flex;flex-direction:column;justify-content:center;gap:4px;width:40px;height:40px;margin-right:-8px;padding:0 10px;background:none;border:0;cursor:pointer}
  .nav-toggle span{display:block;height:1.5px;background:#111;transition:transform .2s,opacity .2s}
  .nav.open .nav-toggle span:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
  .nav.open .nav-toggle span:nth-child(2){opacity:0}
  .nav.open .nav-toggle span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}
}

/* FOOTER */
.footer{font-family:'Outfit',sans-serif;padding:40px 28px;border-top:1px solid rgba(0,0,0,0.08);background:#F8F7F4;max-width:1100px;margin:0 auto;width:100%}
@media(min-width:768px){.footer{padding:40px 48px}}
.footer-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:24px;flex-wrap:wrap;gap:24px}
.footer-brand{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:#111}
.footer-brand .haus{font-weight:600;color:#D4522E}
.footer-contact{text-align:right;font-size:12px;color:#3A3A3A;line-height:2}
.footer-contact a{color:#D4522E;text-decoration:none;font-weight:600}
.footer-bottom{padding-top:20px;border-top:1px solid rgba(0,0,0,0.08);display:flex;justify-content:space-between;font-size:11px;color:#8E8474;flex-wrap:wrap;gap:8px}
.footer-bottom a{color:#8E8474;text-decoration:none}
.footer-bottom a:hover{color:#D4522E}
.footer-events{padding:16px 0;border-top:1px solid rgba(0,0,0,0.08);font-size:12px;color:#3A3A3A}
.footer-events a{color:#D4522E;text-decoration:none;font-weight:600}
.footer-events a:hover{opacity:.7}
.footer-subscribe{padding:24px 0;border-top:1px solid rgba(0,0,0,0.08)}
.footer-subscribe-label{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#3A3A3A;margin-bottom:12px}
.footer-subscribe-form{display:flex;gap:8px;flex-wrap:wrap;max-width:420px}
.footer-subscribe-input{flex:1 1 200px;padding:11px 14px;border:1px solid rgba(0,0,0,0.08);border-radius:4px;font-family:'Outfit',sans-serif;font-size:13px;background:#FFFDF9;color:#111}
.footer-subscribe-input:focus{outline:none;border-color:#D4522E}
.footer-subscribe-btn{padding:11px 22px;background:#111;color:#FFFDF9;border:none;font-family:'Outfit',sans-serif;font-size:11px;font-weight:600;letter-spacing:2px;text-transform:uppercase;cursor:pointer;transition:background .2s;border-radius:4px}
.footer-subscribe-btn:hover{background:#E8634A}
.footer-subscribe-thanks{margin-top:12px;font-size:12px;color:#D4522E;font-weight:600;letter-spacing:1px}