/* Shared site header (nav, open pill, Reserve a table, phone menu, skip link) for the two pages that do not use
   the ported page shell: book-table.html and table-confirmed.php. Generated from the home page: every rule that
   styles the header there (menu closed and open), in the same order, so the header looks and behaves the same.
   Regenerate it if the home-page header changes. */
:is(.nav,.nav-mobile-menu,.skip-link){--ink-green:#06231e;--green:#0a1f1a;--green-deep:#061612;--green-soft:#122d25;--gold:#d4af7a;--cream:#f5f1e8;--line:rgba(212,175,122, 0.18);--tiffany:#81D8D0;--tiffany-soft:#e6c08a;}
:is(.nav,.nav-mobile-menu) *{box-sizing: border-box; margin: 0px; padding: 0px;}
:is(.nav,.nav-mobile-menu) a{color: inherit; text-decoration: none;}
:is(.nav,.nav-mobile-menu) img{max-width: 100%; display: block;}
.nav{position: fixed; top: 0px; left: 0px; right: 0px; z-index: 100; padding: 14px 40px; display: flex; justify-content: space-between; align-items: center; background: rgba(10, 31, 26, 0.85); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); transition: padding 0.3s, background 0.3s;}
.nav-logo{display: flex; align-items: center; gap: 10px;}
.nav-logo img{height: 38px; width: auto; filter: brightness(0) saturate(100%) invert(78%) sepia(36%) saturate(370%) hue-rotate(355deg) brightness(91%) contrast(86%); transition: filter 0.3s, transform 0.3s;}
.nav-logo:hover img{transform: scale(1.04);}
.nav-links{display: flex; gap: 36px; list-style: none; align-items: center; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase;}
.nav-links a{color: var(--cream); opacity: 0.78; transition: opacity 0.2s, color 0.2s; position: relative; padding: 4px 0px;}
.nav-links a:hover{opacity: 1; color: var(--gold);}
.nav-cta{padding: 10px 22px; background: rgb(129, 216, 208); border-radius: 999px; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; transition: background 0.2s, transform 0.2s; color: var(--green) !important;}
.nav-cta:hover{background: rgb(166, 227, 220); transform: translateY(-1px);}
.nav.nav-scrolled{padding: 8px 40px; background: rgba(6, 22, 18, 0.97); border-bottom-color: rgba(212, 175, 122, 0.18); box-shadow: rgba(0, 0, 0, 0.35) 0px 4px 20px;}
.nav.nav-scrolled .nav-logo img{height: 30px;}
@media (max-width: 768px){.nav.nav-scrolled{padding: 8px 24px;}}
.nav-mobile-toggle{display: none; background: transparent; border: 0px; width: 28px; height: 22px; cursor: pointer; padding: 0px; flex-direction: column; justify-content: space-between;}
.nav-mobile-toggle .bar{display: block; width: 100%; height: 2px; background: rgb(129, 216, 208); border-radius: 2px; transition: transform 0.3s, opacity 0.2s; transform-origin: center center;}
.nav-mobile-toggle[aria-expanded="true"] .bar:nth-child(1){transform: translateY(10px) rotate(45deg);}
.nav-mobile-toggle[aria-expanded="true"] .bar:nth-child(2){opacity: 0;}
.nav-mobile-toggle[aria-expanded="true"] .bar:nth-child(3){transform: translateY(-10px) rotate(-45deg);}
.nav-mobile-menu{position: fixed; top: 0px; left: 0px; right: 0px; background: var(--green-deep); border-bottom: 1px solid var(--line); padding: 80px 24px 32px; transform: translateY(-110%); transition: transform 0.35s; z-index: 99; display: none;}
.nav-mobile-menu.open{transform: translateY(0px);}
.skip-link{position: absolute; top: -40px; left: 0px; background: rgb(129, 216, 208); color: var(--green); padding: 8px; z-index: 1000;}
.skip-link:focus{top: 0px;}
@media (max-width: 980px){.nav{padding: 14px 24px;}}
@media (max-width: 980px){.nav-links{gap: 24px; font-size: 12px;}}
@media (max-width: 720px){.nav{padding: 12px 18px;}}
@media (max-width: 720px){.nav-logo img{height: 32px;}}
@media (max-width: 720px){.nav-links{display: none;}}
@media (max-width: 720px){.nav-cta{display: none;}}
@media (max-width: 720px){.nav-mobile-toggle{display: flex;}}
@media (max-width: 720px){.nav-mobile-menu{display: block;}}
.nav-mobile-menu{visibility: hidden;}
.nav-mobile-menu.open{visibility: visible;}
.nav-mobile-toggle{width: 44px; height: 44px;}
.nav-mobile-toggle .bar{left: 10px;}
.nav-mobile-toggle .bar:nth-child(1){top: 16px;}
.nav-mobile-toggle .bar:nth-child(2){top: 22px;}
.nav-mobile-toggle .bar:nth-child(3){top: 28px;}
:is(.nav,.nav-mobile-menu) a:focus-visible,:is(.nav,.nav-mobile-menu) button:focus-visible{outline: rgb(212, 175, 122) solid 2px; outline-offset: 2px;}
.ss-status{display: inline-flex; align-items: center; gap: 8px; font-family: Inter, -apple-system, sans-serif; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(245, 241, 232, 0.75); padding: 4px 10px; border: 1px solid rgba(212, 175, 122, 0.25); border-radius: 100px; background: rgba(10, 31, 26, 0.4); margin-left: 18px; white-space: nowrap; font-weight: 500;}
.ss-status .ss-status-dot{width: 6px; height: 6px; border-radius: 50%; background: rgb(106, 122, 112); flex-shrink: 0;}
.ss-status[data-open="true"] .ss-status-dot{background: rgb(126, 200, 138); box-shadow: rgba(126, 200, 138, 0.18) 0px 0px 0px 2px; animation: 2.4s ease-in-out 0s infinite normal none running ssPulse;}
.ss-status[data-open="true"]{color: rgba(245, 241, 232, 0.9); border-color: rgba(126, 200, 138, 0.35);}
@media (max-width: 1024px){.ss-status{font-size: 10px; padding: 3px 9px; margin-left: 12px;}}
@media (max-width: 720px){.ss-status{display: none;}}
.nav-logo img{height: 50px !important; width: auto !important;}
.nav.nav-scrolled .nav-logo img{height: 40px !important;}
@media (max-width: 720px){.nav-logo img{height: 42px !important;}}
:is(.nav,.nav-mobile-menu) picture.sm-pic{display: contents;}
.nav-links a{white-space: nowrap;}
@media (min-width: 721px) and (max-width: 1020px){.ss-status{display: none;}}
@media (min-width: 721px) and (max-width: 1020px){.nav-links{gap: 18px;}}
@media (min-width: 721px) and (max-width: 1020px){.nav-links a{font-size: 11.5px; letter-spacing: 0.1em;}}
.ss-status{border-color: rgba(212, 175, 122, 0.5) !important; color: var(--tiffany-soft) !important;}
a:not(.btn):not(.nav-logo):hover{color: var(--tiffany-soft);}
:is(.nav,.nav-mobile-menu) :focus-visible{outline: 2px solid var(--tiffany); outline-offset: 3px; border-radius: 2px;}
:is(.nav,.nav-mobile-menu) ::selection{background: rgba(212, 175, 122, 0.3); color: rgb(255, 255, 255);}
:is(.nav,.nav-mobile-menu) ::view-transition-old(root),:is(.nav,.nav-mobile-menu) ::view-transition-new(root){animation-duration: 0.22s;}
@media (min-width: 1021px) and (max-width: 1200px){.ss-status{display: none;}}
@media (min-width: 1021px) and (max-width: 1200px){.nav-links{gap: 24px;}}
@media (min-width: 721px) and (max-width: 900px){.nav-links{gap: 12px;}}
@media (min-width: 721px) and (max-width: 900px){.nav-links a{letter-spacing: 0.04em;}}
@media (max-width: 760px){nav img,nav .nav-logo img{height: 40px !important; width: auto !important;}}
@media (max-width: 760px){.nav-mobile-menu{bottom: 0px !important; overflow-y: auto !important; padding-bottom: calc(32px + env(safe-area-inset-bottom)) !important;}}
@media (max-width: 760px){.nav-mobile-menu > a{align-items: center; gap: 10px; display: flex !important;}}
@media (max-width: 760px){:is(.nav,.nav-mobile-menu) .mm-box{margin: 22px 0px 18px;}}
@media (max-width: 760px){.nav-mobile-menu .mm-box a{border-bottom: 0px !important;}}
@media (max-width: 760px){.nav-mobile-menu .mm-cta{justify-content: center; align-items: center; min-height: 54px; border-radius: 999px; background: rgb(129, 216, 208); letter-spacing: 0.12em; text-transform: uppercase; display: flex !important; color: rgb(10, 31, 26) !important; font: 600 13px Inter, sans-serif !important; padding: 0px !important;}}
@media (max-width: 760px){:is(.nav,.nav-mobile-menu) .mm-row{display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px;}}
@media (max-width: 760px){.nav-mobile-menu .mm-row a{justify-content: center; align-items: center; min-height: 48px; border-radius: 999px; letter-spacing: 0.1em; text-transform: uppercase; display: flex !important; border: 1px solid rgba(245, 241, 232, 0.3) !important; font: 600 12.5px Inter, sans-serif !important; color: rgb(245, 241, 232) !important; padding: 0px !important;}}
@media (max-width: 760px){:is(.nav,.nav-mobile-menu) .mm-hrs{font: 400 12.5px / 1.6 Inter, sans-serif; color: rgb(170, 163, 143); text-align: center; margin: 14px 0px 0px;}}
nav.nav{height: 72px !important; min-height: 72px !important; padding-top: 0px !important; padding-bottom: 0px !important; align-items: center !important;}
.nav-logo{display: flex !important; align-items: center !important;}
.nav-logo img{height: 50px !important; width: auto !important; max-height: none !important;}
.nav .ss-status{margin-left: 22px !important; margin-right: auto !important;}
.nav .nav-links{margin-left: 0px !important; margin-right: 36px !important;}
.nav .nav-links a{font-size: 13px !important; letter-spacing: 0.12em !important;}
.nav .nav-cta{font-size: 12px !important; letter-spacing: 0.12em !important;}
@media (max-width: 900px){nav.nav{height: 62px !important; min-height: 62px !important;}}
@media (max-width: 900px){.nav-logo img{height: 44px !important;}}
@media (prefers-reduced-motion: no-preference){:is(.nav,.nav-mobile-menu) ::view-transition-old(root){animation: 0.2s ease 0s 1 normal both running ssVtOut;}}
@media (prefers-reduced-motion: no-preference){:is(.nav,.nav-mobile-menu) ::view-transition-new(root){animation: 0.32s cubic-bezier(0.2, 0.7, 0.2, 1) 0s 1 normal both running ssVtIn;}}
@media (prefers-reduced-motion: no-preference){nav.nav{view-transition-name: ss-nav;}}
@media (prefers-reduced-motion: no-preference){::view-transition-group(ss-nav),::view-transition-group(ss-pbar),::view-transition-group(ss-mbar){animation: auto ease 0s 1 normal none running none;}}
@media (prefers-reduced-motion: no-preference){::view-transition-old(ss-nav),::view-transition-old(ss-pbar),::view-transition-old(ss-mbar){animation: auto ease 0s 1 normal none running none; opacity: 0;}}
@media (prefers-reduced-motion: no-preference){::view-transition-new(ss-nav),::view-transition-new(ss-pbar),::view-transition-new(ss-mbar){animation: auto ease 0s 1 normal none running none;}}
.nav-logo img{filter: none !important;}
:is(.nav,.nav-mobile-menu) p,:is(.nav,.nav-mobile-menu) li{text-wrap: pretty;}
.nav-cta{box-shadow: rgba(255, 255, 255, 0.5) 0px 1px 0px inset, rgba(6, 35, 30, 0.12) 0px -1px 0px inset, rgba(0, 0, 0, 0.22) 0px 6px 18px; background: linear-gradient(rgb(158, 227, 219) 0%, rgb(129, 216, 208) 55%, rgb(116, 207, 198) 100%) !important; border-color: rgb(129, 216, 208) !important; color: var(--ink-green) !important;}
.nav-cta:hover{transform: translateY(-1px); background: linear-gradient(rgb(180, 235, 228) 0%, rgb(149, 223, 215) 60%, rgb(129, 216, 208) 100%) !important; box-shadow: rgba(255, 255, 255, 0.55) 0px 1px 0px inset, rgba(129, 216, 208, 0.14) 0px 0px 0px 4px, rgba(129, 216, 208, 0.2) 0px 12px 30px !important;}
.nav-cta:active{transform: translateY(0px);}
.nav-cta{transition: box-shadow 0.3s, transform 0.3s, background 0.3s, border-color 0.3s, color 0.3s;}
.nav.nav-scrolled{backdrop-filter: blur(14px) saturate(140%); box-shadow: rgba(212, 175, 122, 0.14) 0px 1px 0px, rgba(0, 0, 0, 0.25) 0px 10px 30px; background: rgba(6, 22, 18, 0.82) !important;}
:is(.nav,.nav-mobile-menu) li a:not([class]){text-decoration-color: rgba(129, 216, 208, 0.55); text-decoration-thickness: 1px; text-underline-offset: 0.22em;}
:is(.nav,.nav-mobile-menu) li a:not([class]):hover{text-decoration-color: rgb(129, 216, 208);}
:is(.nav,.nav-mobile-menu) ::selection{background: rgb(129, 216, 208); color: var(--ink-green);}
:is(.nav,.nav-mobile-menu) :focus-visible{outline-offset: 3px; outline: rgb(129, 216, 208) solid 2px !important;}
::-webkit-scrollbar{width: 10px;}
::-webkit-scrollbar-track{background: rgb(6, 22, 18);}
::-webkit-scrollbar-thumb{background: rgba(129, 216, 208, 0.35); border-radius: 10px; border: 2px solid rgb(6, 22, 18);}
@media (prefers-reduced-motion: reduce){.nav-cta:hover{transform: none !important;}}
.nav .nav-logo img{filter: brightness(0) saturate(100%) invert(78%) sepia(36%) saturate(370%) hue-rotate(355deg) brightness(91%) contrast(86%);}
@media (max-width: 760px){.nav-mobile-toggle[aria-expanded="true"] .bar{transform-origin: 50% 50% !important;}}
@media (max-width: 760px){.nav-mobile-toggle[aria-expanded="true"] .bar:nth-child(1){top: 22px !important; transform: rotate(45deg) !important;}}
@media (max-width: 760px){.nav-mobile-toggle[aria-expanded="true"] .bar:nth-child(3){top: 22px !important; transform: rotate(-45deg) !important;}}
@media (max-width: 760px){.nav-mobile-toggle[aria-expanded="true"] .bar:nth-child(2){opacity: 0 !important;}}
.nav-cta{border-radius: 999px !important;}
@media (max-width: 600px){.nav-logo{display: inline-flex; align-items: center; min-height: 44px;}}
@media (max-width: 600px){.skip-link{min-height: 44px;}}
@media (max-width: 600px){.nav-mobile-toggle{width: 44px; height: 44px; padding: 15px 10px; box-sizing: border-box;}}
@media (max-width: 600px){.nav-mobile-toggle .bar{transition: transform 0.3s, opacity 0.2s;}}
@media (max-width: 600px){.nav-mobile-toggle[aria-expanded="true"] .bar:nth-child(1){transform: translateY(6px) rotate(45deg) !important;}}
@media (max-width: 600px){.nav-mobile-toggle[aria-expanded="true"] .bar:nth-child(2){opacity: 0 !important;}}
@media (max-width: 600px){.nav-mobile-toggle[aria-expanded="true"] .bar:nth-child(3){transform: translateY(-6px) rotate(-45deg) !important;}}
@media (max-width: 600px){.nav-mobile-menu a{display: block; font-family: "Cormorant Garamond", serif; font-weight: 500; font-size: 26px; line-height: 1.2; color: rgb(245, 241, 232); text-decoration: none; padding: 14px 4px; border-bottom: 1px solid rgba(212, 175, 122, 0.16);}}
@media (max-width: 600px){:is(.nav,.nav-mobile-menu) .ss-mm-sec{display: flex; flex-wrap: wrap; gap: 0px 22px; padding: 14px 4px; border-bottom: 0px;}}
@media (max-width: 600px){:is(.nav,.nav-mobile-menu) .ss-mm-sec a{font-family: Inter, sans-serif; font-size: 13px; font-weight: 400; color: rgba(245, 241, 232, 0.62); border-bottom: 0px; padding: 9px 0px; letter-spacing: 0.04em;}}
@keyframes ssPulse { 
  0%, 100% { box-shadow: rgba(126, 200, 138, 0.18) 0px 0px 0px 2px; }
  50% { box-shadow: rgba(126, 200, 138, 0.05) 0px 0px 0px 4px; }
}
@keyframes ssVtOut { 
  100% { opacity: 0; }
}
@keyframes ssVtIn { 
  0% { opacity: 0; transform: translateY(6px); }
}
/* current page (the home page has none, so these come from the shared page shell) */
.nav-links a.is-active,.nav-mobile-menu a.is-active{color:#e6c08a}.nav-links a.is-active{opacity:1}
body.menu-open{overflow:hidden}