/* The one Fair header: topline, logo, menu with the Plan your visit guides, and parking passes.
   Generated pages get it through fair-pages.css; the Webflow homepage links it directly, so it
   carries its own colors and fonts. Markup: siteHeader() in scripts/fair-feature-pages.mjs. */
@import url("https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Playfair+Display:ital,wght@1,600&display=swap");

.topline,.site-nav{--nav-navy:#172d46;--nav-gold:#d39330;--nav-paper:#f7efe3;--nav-brown:#9a402f;box-sizing:border-box;font-family:"DM Mono",monospace}
.site-nav *,.site-nav *::before,.site-nav *::after{box-sizing:border-box}
.topline{height:36px;display:flex;align-items:center;justify-content:center;gap:22px;padding:0 18px;color:#fff;background:var(--nav-navy);font-size:11px;line-height:1;white-space:nowrap}
.topline i{width:5px;height:5px;background:var(--nav-paper);display:block}

.site-nav{position:sticky;top:0;z-index:50;height:82px;display:grid;grid-template-columns:180px minmax(0,1fr) auto;align-items:center;gap:18px;padding:0 24px;color:var(--nav-navy);background:#fff;box-shadow:0 1px 0 rgba(23,45,70,.08)}
.site-nav .brand{width:170px;height:54px;display:flex;padding:8px 4px;background:#fff}
.site-nav .brand img{width:100%;height:100%;object-fit:contain}
.site-nav .nav-links{display:flex;justify-content:center;align-items:center;gap:22px;font-size:11px;line-height:1.2}
.site-nav .nav-links a,.site-nav .nav-group summary{color:inherit;text-decoration:none;padding:12px 0;border-bottom:2px solid transparent}
.site-nav .nav-links a:hover,.site-nav .nav-links a[aria-current="page"],.site-nav .nav-group summary:hover,.site-nav .nav-group.is-current summary{border-color:var(--nav-navy)}
.site-nav .nav-links a:focus-visible,.site-nav .nav-group summary:focus-visible{outline:2px solid var(--nav-navy);outline-offset:4px}

/* Plan your visit: a dropdown on wide screens, a labelled group inside the phone menu */
.site-nav .nav-group{position:relative}
.site-nav .nav-group summary{display:flex;align-items:center;gap:7px;cursor:pointer;list-style:none}
.site-nav .nav-group summary::-webkit-details-marker{display:none}
.site-nav .nav-group summary::after{content:"";width:6px;height:6px;border-right:1.5px solid;border-bottom:1.5px solid;rotate:45deg;translate:0 -2px;transition:rotate .2s,translate .2s}
.site-nav .nav-group[open] summary::after{rotate:-135deg;translate:0 2px}
.site-nav .nav-group-links{position:absolute;top:calc(100% + 16px);left:50%;translate:-50% 0;display:grid;min-width:280px;padding:8px;background:#fff;border:1px solid var(--nav-navy);box-shadow:0 16px 30px rgba(23,45,70,.16)}
.site-nav .nav-group-links a{padding:13px 14px;border:0;font-size:12px}
.site-nav .nav-group-links a:hover,.site-nav .nav-group-links a[aria-current="page"]{background:var(--nav-paper)}

.site-nav .pass{justify-self:end;min-width:185px;padding:18px 24px;text-align:center;text-decoration:none;color:var(--nav-navy);background:var(--nav-gold);font:italic 600 20px/1.2 "Playfair Display",serif;clip-path:polygon(4% 0,96% 0,100% 16%,100% 84%,96% 100%,4% 100%,0 84%,0 16%);transition:transform .2s ease}
.site-nav .pass:hover{transform:rotate(-1deg) scale(1.03)}
.site-nav .pass-short{display:none}

.site-nav .mobile-toggle{display:none;position:relative;height:48px;margin:0;padding:0 16px 0 42px;color:var(--nav-navy);background:#fff;border:2px solid var(--nav-navy);border-radius:0;font:italic 600 17px/44px "Playfair Display",serif;cursor:pointer;transition:background .2s ease}
.site-nav .mobile-toggle::before,.site-nav .mobile-toggle::after{content:"";position:absolute;left:15px;top:50%;width:16px;height:2px;background:currentColor;transition:transform .2s ease}
.site-nav .mobile-toggle::before{transform:translateY(-5px)}
.site-nav .mobile-toggle::after{transform:translateY(3px)}
.site-nav .mobile-toggle[aria-expanded="true"]::before{transform:translateY(-1px) rotate(45deg)}
.site-nav .mobile-toggle[aria-expanded="true"]::after{transform:translateY(-1px) rotate(-45deg)}
.site-nav .mobile-toggle:hover{background:var(--nav-paper)}
.site-nav .mobile-toggle:focus-visible{outline:2px solid var(--nav-navy);outline-offset:3px}

@media(max-width:1180px){
  .site-nav{grid-template-columns:minmax(0,1fr) auto auto;height:72px;padding:0 12px;gap:10px}
  .site-nav .brand{width:132px;height:48px}
  .site-nav .mobile-toggle{display:block}
  .site-nav .nav-links{position:absolute;top:72px;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;max-height:calc(100dvh - 72px);overflow-y:auto;padding:10px 22px 26px;background:#fff;font-size:14px;box-shadow:0 15px 30px rgba(9,28,51,.15)}
  .site-nav .nav-links.open{display:flex}
  .site-nav .nav-links a{padding:14px 12px}
  .site-nav .nav-group summary{padding:22px 12px 8px;border:0;color:var(--nav-brown);font-size:11px;letter-spacing:.12em;text-transform:uppercase;pointer-events:none}
  .site-nav .nav-group summary::after{display:none}
  .site-nav .nav-group-links{position:static;translate:none;min-width:0;margin:0 0 0 12px;padding:0 0 0 4px;border:0;border-left:2px solid var(--nav-gold);box-shadow:none}
  .site-nav .nav-group-links a{font-size:14px}
  .site-nav .pass{min-width:0;height:48px;padding:0 18px;font-size:16px;line-height:48px}
}
@media(max-width:700px){
  .topline{justify-content:flex-start;overflow:hidden;font-size:9px;gap:12px}
  .site-nav{gap:8px}
  .site-nav .brand{width:112px}
  .site-nav .pass{padding:0 14px}
  .site-nav .pass-long{display:none}
  .site-nav .pass-short{display:inline}
  .site-nav .mobile-toggle{padding:0 12px 0 37px}
  .site-nav .mobile-toggle::before,.site-nav .mobile-toggle::after{left:12px}
}
@media(prefers-reduced-motion:reduce){.site-nav .pass,.site-nav .mobile-toggle,.site-nav .nav-group summary::after{transition:none}}
