/* ============================================================
   Preserve A Spot — header skin (Night at the Lodge).
   Add the CSS class  aspot-header  to your Theme Builder header
   section/row. Skins the brand lockup + a real WP menu, whether
   rendered by QuadMenu (primary) or Divi's Menu module (fallback).
   ============================================================ */

/* ---- brand lockup ([aspot_brand]) ---- */
.aspot-header .aspot-brand{display:inline-flex;align-items:center;gap:14px;text-decoration:none;}
.aspot-header .aspot-crest{height:46px;width:auto;display:block;}
.aspot-header .aspot-wm{display:flex;flex-direction:column;align-items:center;line-height:1;
  font-family:"Playfair Display",Georgia,serif;}
.aspot-header .aspot-wm .the{font-weight:500;font-size:11.5px;letter-spacing:.46em;text-transform:uppercase;
  color:#c9a159;padding-left:.46em;}
.aspot-header .aspot-wm .name{font-weight:600;font-size:21px;letter-spacing:.24em;text-transform:uppercase;
  color:#f3ecdd;padding-left:.24em;margin-top:4px;white-space:nowrap;}
.aspot-header .aspot-wm .tag{font-family:"Montserrat",sans-serif;font-weight:600;font-size:7px;letter-spacing:.34em;
  text-transform:uppercase;color:#a89e8c;margin-top:6px;padding-left:.34em;}
/* on a light header, darken the wordmark */
.aspot-header.aspot-light .aspot-wm .name{color:#1c1a17;}
.aspot-header.aspot-light .aspot-wm .tag{color:#6f675a;}

/* ---- menu links (QuadMenu primary, Divi fallback) ---- */
.aspot-header .quadmenu-navbar .quadmenu-item > a.quadmenu-link,
.aspot-header .et-menu li a,
.aspot-header .et_pb_menu .et-menu-nav li a{
  font-family:"Montserrat",sans-serif !important;font-weight:600;font-size:12.5px;
  letter-spacing:.16em;text-transform:uppercase;color:#cfc6b5;position:relative;
  padding:6px 0;transition:color .2s;background:transparent;
}
.aspot-header .quadmenu-navbar .quadmenu-item > a.quadmenu-link:hover,
.aspot-header .et-menu li a:hover{color:#ffffff;}

/* gold underline on hover / current */
.aspot-header .quadmenu-navbar .quadmenu-item > a.quadmenu-link::after,
.aspot-header .et-menu > li > a::after{
  content:"";position:absolute;left:0;right:100%;bottom:-2px;height:1.5px;background:#c9a159;transition:right .28s ease;
}
.aspot-header .quadmenu-navbar .quadmenu-item:hover > a.quadmenu-link::after,
.aspot-header .quadmenu-navbar .quadmenu-item.current-menu-item > a.quadmenu-link::after,
.aspot-header .et-menu > li:hover > a::after,
.aspot-header .et-menu > li.current-menu-item > a::after{right:0;}
.aspot-header .et-menu > li.current-menu-item > a{color:#c9a159;}

/* spacing between top-level items (QuadMenu) */
.aspot-header .quadmenu-navbar > .quadmenu-nav > .quadmenu-item{margin:0 clamp(10px,1.6vw,22px);}

/* ---- "Get Started" CTA — add menu-item CSS class  aspot-cta  ---- */
.aspot-header .aspot-cta > a.quadmenu-link,
.aspot-header .et-menu li.aspot-cta a{
  background:#c9a159 !important;color:#1c150a !important;font-weight:700;
  padding:10px 20px !important;border-radius:16px;letter-spacing:.1em;
}
.aspot-header .aspot-cta > a.quadmenu-link::after,
.aspot-header .et-menu li.aspot-cta a::after{display:none;}
.aspot-header .aspot-cta > a.quadmenu-link:hover,
.aspot-header .et-menu li.aspot-cta a:hover{background:#8f2418 !important;color:#faf6ed !important;}

/* ---- QuadMenu mega panels: keep them on-brand (dark) ---- */
.aspot-header .quadmenu-dropdown,
.aspot-header .quadmenu-dropdown-content{
  background:#1b1712 !important;border:1px solid rgba(201,161,89,.2) !important;
}
.aspot-header .quadmenu-dropdown .quadmenu-item > a{color:#d8d1c4 !important;}
.aspot-header .quadmenu-dropdown .quadmenu-item > a:hover{color:#c9a159 !important;}

/* ---- mobile toggle ---- */
.aspot-header .quadmenu-navbar-toggle,
.aspot-header .quadmenu-navbar-toggle .quadmenu-icon-bar{color:#c9a159 !important;border-color:#c9a159 !important;background:#c9a159;}

@media(max-width:980px){
  .aspot-header .aspot-wm .name{font-size:18px;}
}

/* ============================================================
   Header follows the sun/moon toggle (0.12.0)
   The toggle is site-wide — it puts .lodge-light on <html> — but the light
   rules were all scoped inside the shortcode wrappers, so the Divi header
   stayed cream while the page went dark and the menu looked detached from
   the rest of the page. Dark is the default state, so the DARK rules are
   what needed writing.
   ============================================================ */
html:not(.lodge-light) #main-header,
html:not(.lodge-light) .et-l--header .et_pb_menu,
html:not(.lodge-light) .et-l--header .et_pb_row{background-color:#1c1a17!important}
html:not(.lodge-light) #main-header{box-shadow:0 1px 0 rgba(201,161,89,.22)!important}
html:not(.lodge-light) #top-menu a,
html:not(.lodge-light) .et-l--header .et_pb_menu a,
html:not(.lodge-light) #et_mobile_nav_menu a{color:#e9e1d2!important}
html:not(.lodge-light) #top-menu a:hover,
html:not(.lodge-light) .et-l--header .et_pb_menu a:hover,
html:not(.lodge-light) #top-menu a:focus,
html:not(.lodge-light) .et-l--header .et_pb_menu a:focus{color:#c9a159!important;opacity:1}
html:not(.lodge-light) #top-menu li.current-menu-item > a{color:#c9a159!important}
html:not(.lodge-light) .aspot-brand b,
html:not(.lodge-light) .aspot-brand .name{color:#faf6ed!important}
html:not(.lodge-light) .aspot-brand s,
html:not(.lodge-light) .aspot-brand .tag{color:#c9a159!important}
html:not(.lodge-light) #main-header .mobile_menu_bar::before{color:#c9a159!important}
html:not(.lodge-light) .et_mobile_menu{background-color:#1c1a17!important;border-color:#c9a159!important}

/* ============================================================
   §  [aspot_header] — Theme Builder global header (0.14.0)
   Live-text lockup instead of an uploaded logo image: the old dark PNG was
   invisible on the dark ground and could not be recoloured by the toggle.
   ============================================================ */
.aspot-hd{
  --ink:#151210; --gold:#c9a159; --gold-lt:#e2c483; --paper:#f3ecdd;
  --bone:#cbc0aa; --line:rgba(201,161,89,.2);
  --disp:"Playfair Display",Georgia,serif; --serif:"Cormorant Garamond",Georgia,serif;
  --sans:"Montserrat",system-ui,sans-serif;
  display:block;background:var(--ink);border-bottom:1px solid var(--line);
  font-family:var(--sans);position:relative;z-index:50
}
.aspot-hd *{box-sizing:border-box}
.aspot-hd.is-sticky{position:sticky;top:var(--aspot-sticky-top,0px)}
.aspot-hd-in{width:min(1280px,92vw);margin-inline:auto;display:flex;align-items:center;
  gap:clamp(16px,3vw,40px);padding:14px 0;transition:padding .22s;min-height:76px}
.aspot-hd.is-scrolled .aspot-hd-in{padding:9px 0}

/* brand lockup — text, so it recolours with the toggle */
.aspot-hd-brand{display:flex;align-items:center;gap:13px;text-decoration:none;flex:none;min-width:0}
.aspot-hd-brand img{height:46px;width:auto;flex:none;transition:height .22s}
.aspot-hd.is-scrolled .aspot-hd-brand img{height:38px}
/* Wordmark set to the master's spec: a tracked-out uppercase "THE" over the name,
   both in Playfair, centred as a column — not the italic serif version. */
/* Left-justified, matching the footer lockup — the centred column left the tracked-out
   "THE" and the tagline floating off-axis from the name. */
.aspot-hd-brand .wm{display:flex;flex-direction:column;align-items:flex-start;line-height:1;min-width:0}
.aspot-hd-brand .the{font-family:var(--disp);font-weight:500;font-size:11.5px;
  letter-spacing:.46em;text-transform:uppercase;color:var(--gold)}
.aspot-hd-brand .name{font-family:var(--disp);font-weight:600;font-size:21px;
  letter-spacing:.24em;text-transform:uppercase;margin-top:4px;
  color:#f3ecdd;white-space:nowrap}
.aspot-hd-brand .tag{font-family:var(--sans);font-weight:600;font-size:7px;
  letter-spacing:.34em;text-transform:uppercase;margin-top:6px;
  color:#a89e8c;white-space:nowrap}
.aspot-hd-brand:hover .name,.aspot-hd-brand:focus .name{color:var(--gold-lt);outline:none}

/* nav */
.aspot-hd-nav{margin-left:auto;display:flex;align-items:center;gap:clamp(18px,2.2vw,34px)}
/* Divi's global list styles put bottom padding/margin on ul and li (its content CSS
   uses padding:0 0 23px 1em). Inside a centred flex row that pads the bottom of the
   list, which pushes the link text ABOVE the optical centre of the bar — the nav
   looked high no matter what alignment was set. Cleared with !important, on the
   items too. */
.aspot-hd-menu{list-style:none;display:flex;align-items:center;gap:clamp(18px,2.2vw,34px);
  margin:0!important;padding:0!important;line-height:1}
.aspot-hd-menu li{margin:0!important;padding:0!important;line-height:1}
.aspot-hd-nav{align-self:stretch}
/* Divi applies a list-style to li directly, so clearing it on the ul is not enough —
   the nav rendered with bullets between every item. */
.aspot-hd-menu,.aspot-hd-menu li,.aspot-hd-menu .sub-menu{list-style:none!important}
.aspot-hd-menu li::marker,.aspot-hd-menu li::before{content:none!important;display:none!important}
.aspot-hd-menu li{position:relative}
/* Master spec: uppercase Montserrat 600 at 12.5px, .16em tracking, with a gold
   underline that wipes in from the left. inline-flex + line-height:1 so the text
   sits on the same optical centre line as the crest and the toggle — loose inline
   text was riding high in the row. */
.aspot-hd-menu > li{display:flex;align-items:center}
.aspot-hd-menu a{display:inline-flex;align-items:center;font-family:var(--sans);
  font-weight:600;font-size:12.5px;line-height:1;letter-spacing:.16em;
  text-transform:uppercase;color:#cfc6b5;text-decoration:none;position:relative;
  padding:6px 0;transition:color .2s;white-space:nowrap}
.aspot-hd-menu a::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;
  height:1.5px;background:var(--gold);transition:right .28s ease}
.aspot-hd-menu a:hover,.aspot-hd-menu a:focus{color:#fff;outline:none}
.aspot-hd-menu a:hover::after,.aspot-hd-menu a:focus-visible::after{right:0}
.aspot-hd-menu .current-menu-item > a,.aspot-hd-menu .current_page_item > a{color:var(--gold)}
.aspot-hd-menu .current-menu-item > a::after,.aspot-hd-menu .current_page_item > a::after{right:0}
.aspot-hd-menu .sub-menu a::after{display:none}
/* one level of dropdown */
.aspot-hd-menu .sub-menu{position:absolute;top:100%;left:-14px;margin-top:14px!important;
  list-style:none;display:block;padding:10px 0!important;min-width:210px;
  background:#191512;border:1px solid var(--line);
  opacity:0;visibility:hidden;transform:translateY(-4px);transition:.18s;z-index:60}
.aspot-hd-menu li:hover > .sub-menu,.aspot-hd-menu li:focus-within > .sub-menu{opacity:1;visibility:visible;transform:none}
.aspot-hd-menu .sub-menu li{display:block}
.aspot-hd-menu .sub-menu a{display:block;padding:11px 20px!important;font-size:11.5px;
  letter-spacing:.14em;color:#cfc6b5}
.aspot-hd-menu .sub-menu a:hover,.aspot-hd-menu .sub-menu a:focus{color:var(--gold);background:rgba(201,161,89,.07)}
/* the two view links (Calendar / List) are a different kind of thing from the
   categories above them — a hairline separates them */
.aspot-hd-menu .sub-menu .is-sep{border-top:1px solid var(--line);margin-top:8px;padding-top:8px}
.aspot-hd-menu .caret{font-size:9px;opacity:.7;margin-left:5px;display:inline-block;
  transition:transform .2s}
.aspot-hd-menu li:hover > a .caret{transform:translateY(1px)}
/* hover has to survive the gap between the link and the panel */
.aspot-hd-menu .menu-item-has-children{padding-bottom:2px}
.aspot-hd-nomenu{margin:0;font-size:12px;color:var(--bone)}
.aspot-hd-cta{display:inline-flex;align-items:center;font:600 10.5px/1 var(--sans);
  letter-spacing:.16em;text-transform:uppercase;background:var(--gold);color:#1c150a;
  border:1px solid var(--gold);padding:13px 22px;text-decoration:none;transition:.18s}
.aspot-hd-cta:hover,.aspot-hd-cta:focus{background:transparent;color:var(--gold-lt);border-color:var(--gold-lt);outline:none}
/* the toggle is a button, so it needs explicit centring to share the links'
   baseline rather than sitting proud of the row */
.aspot-hd-tog{flex:none;display:inline-flex;align-items:center;justify-content:center;align-self:center}
.aspot-hd-tog svg{display:block}

/* burger + drawer */
.aspot-hd-burger{display:none;width:42px;height:42px;margin-left:auto;padding:0;flex:none;
  background:transparent;border:1px solid var(--line);cursor:pointer;
  flex-direction:column;align-items:center;justify-content:center;gap:5px}
.aspot-hd-burger span{display:block;width:18px;height:1.5px;background:var(--paper);
  transition:transform .24s,opacity .18s}
.aspot-hd-burger:hover,.aspot-hd-burger:focus{border-color:var(--gold);outline:none}
.aspot-hd.nav-open .aspot-hd-burger span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.aspot-hd.nav-open .aspot-hd-burger span:nth-child(2){opacity:0}
.aspot-hd.nav-open .aspot-hd-burger span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

@media(max-width:980px){
  .aspot-hd-burger{display:flex}
  .aspot-hd-nav{position:absolute;top:100%;left:0;right:0;margin:0;
    flex-direction:column;align-items:stretch;gap:0;background:var(--ink);
    border-bottom:1px solid var(--line);padding:0 max(4vw,20px);
    max-height:0;overflow:hidden;transition:max-height .28s ease,padding .28s ease}
  .aspot-hd.nav-open .aspot-hd-nav{max-height:min(74vh,620px);overflow-y:auto;padding:8px max(4vw,20px) 22px}
  .aspot-hd-menu{flex-direction:column;align-items:stretch;gap:0;width:100%}
  .aspot-hd-menu a{display:block;padding:16px 0;border-bottom:1px solid var(--line);
    font-size:14px;letter-spacing:.14em;text-transform:uppercase}
  .aspot-hd-menu .sub-menu{position:static;opacity:1;visibility:visible;transform:none;
    margin:0 0 0 14px;border:0;padding:0;background:transparent;min-width:0}
  .aspot-hd-cta{margin-top:18px;justify-content:center}
  .aspot-hd-brand .tag{display:none}
}
@media(prefers-reduced-motion:reduce){
  .aspot-hd-nav,.aspot-hd-in,.aspot-hd-brand img,.aspot-hd-burger span{transition:none}
}

/* light mode */
html.lodge-light .aspot-hd{background:#faf6ed;border-bottom-color:rgba(28,26,23,.12)}
html.lodge-light .aspot-hd-brand .name{color:#1c1a17}
html.lodge-light .aspot-hd-brand .tag{color:#6f665a}
html.lodge-light .aspot-hd-brand .the,html.lodge-light .aspot-hd-brand .tag{color:#8f2418}
html.lodge-light .aspot-hd-brand:hover .name{color:#8f2418}
html.lodge-light .aspot-hd-menu a{color:#4b4439}
html.lodge-light .aspot-hd-menu a:hover,html.lodge-light .aspot-hd-menu a:focus,
html.lodge-light .aspot-hd-menu .current-menu-item > a{color:#8f2418}
html.lodge-light .aspot-hd-menu .sub-menu{background:#fff;border-color:rgba(28,26,23,.12)}
html.lodge-light .aspot-hd-menu .sub-menu a{color:#4b4439}
html.lodge-light .aspot-hd-menu .sub-menu a:hover,html.lodge-light .aspot-hd-menu .sub-menu a:focus{color:#8f2418;background:rgba(143,36,24,.05)}
html.lodge-light .aspot-hd-menu .sub-menu .is-sep{border-top-color:rgba(28,26,23,.12)}
html.lodge-light .aspot-hd-menu a{border-bottom-color:rgba(28,26,23,.1)}
html.lodge-light .aspot-hd-cta{background:#8f2418;border-color:#8f2418;color:#faf6ed}
html.lodge-light .aspot-hd-cta:hover,html.lodge-light .aspot-hd-cta:focus{background:transparent;color:#8f2418;border-color:#8f2418}
html.lodge-light .aspot-hd-burger{border-color:rgba(28,26,23,.16)}
html.lodge-light .aspot-hd-burger span{background:#1c1a17}
html.lodge-light .aspot-hd-nav{background:#faf6ed;border-bottom-color:rgba(28,26,23,.12)}


/* ============================================================
   0.36.1 — WORDMARK CRISPNESS
   Letter-spaced caps carry a trailing space after the last letter, so
   the three lines of the lockup each sat a different distance from the
   crest and the stack read as drifting. Compensate the tracking on every
   line, nudge the small type up off its mush size, and lock the
   rendering hints. CSS-only — no header re-paste.
   ============================================================ */
.aspot-hd-brand .wm,.aspot-header .aspot-wm{-webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-kerning:normal}

/* tracking compensation: the padding equals the letter-spacing, so the optical
   left edge of all three lines is the same */
.aspot-hd-brand .the{font-size:11px;letter-spacing:.42em;padding-left:.42em;line-height:1}
.aspot-hd-brand .name{font-size:22px;letter-spacing:.2em;padding-left:.2em;margin-top:5px;line-height:1}
.aspot-hd-brand .tag{font-size:8px;letter-spacing:.28em;padding-left:.28em;margin-top:7px;line-height:1}
.aspot-header .aspot-wm .the{font-size:11px;letter-spacing:.42em;padding-left:.42em}
.aspot-header .aspot-wm .name{font-size:22px;letter-spacing:.2em;padding-left:.2em;margin-top:5px}
.aspot-header .aspot-wm .tag{font-size:8px;letter-spacing:.28em;padding-left:.28em;margin-top:7px}

/* nothing in the lockup is ever a coloured or underlined link */
.aspot-hd-brand,.aspot-hd-brand *,.aspot-header .aspot-brand,.aspot-header .aspot-brand *{
  text-decoration:none!important}

@media(max-width:980px){
  .aspot-hd-brand .name,.aspot-header .aspot-wm .name{font-size:19px}
  .aspot-hd-brand .the,.aspot-header .aspot-wm .the{font-size:10px}
}


/* ============================================================
   0.37.0 — MOBILE DRAWER REBUILD
   Was: a max-height panel hanging off the header, with every submenu
   forced open and each top-level <li> a flex ROW (so the children sat
   BESIDE their parent as a second column). Now: a real sheet from the
   header to the bottom of the screen, over a scrim, with collapsed
   accordions and 52px rows.
   ============================================================ */
@media(max-width:980px){
  .aspot-hd-scrim{position:fixed;inset:0;z-index:48;background:rgba(10,8,5,.6);
    opacity:0;visibility:hidden;transition:opacity .24s;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
  .aspot-hd.nav-open ~ .aspot-hd-scrim,.aspot-hd-scrim.on{opacity:1;visibility:visible}

  .aspot-hd-nav{position:fixed;top:var(--aspot-hd-h,64px);left:0;right:0;bottom:0;z-index:50;
    display:flex;flex-direction:column;align-items:stretch;gap:0;margin:0;
    background:var(--ink);border-top:1px solid var(--line);border-bottom:0;
    max-height:none;height:auto;overflow-y:auto;overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding:6px max(5vw,20px) calc(28px + env(safe-area-inset-bottom));
    transform:translateY(-8px);opacity:0;visibility:hidden;
    transition:opacity .22s ease,transform .22s ease,visibility .22s}
  .aspot-hd.nav-open .aspot-hd-nav{transform:none;opacity:1;visibility:visible}

  /* the second-column bug: a top-level item is a block, its children stack under it */
  .aspot-hd-menu > li{display:block}
  .aspot-hd-menu > li{border-bottom:1px solid var(--line)}
  .aspot-hd-menu a{display:block;border-bottom:0;padding:0;font-size:14.5px;letter-spacing:.13em}
  .aspot-hd-menu > li > a{padding:17px 0;min-height:52px;display:flex;align-items:center}

  /* accordion toggle, injected by aspot-header.js */
  .aspot-hd-menu > li.has-kids{display:grid;grid-template-columns:1fr 52px;align-items:center}
  .aspot-hd-menu > li.has-kids > .sub-menu{grid-column:1/-1}
  .aspot-hd-sub-tog{grid-column:2;width:52px;height:52px;padding:0;background:transparent;
    border:0;cursor:pointer;color:var(--gold);display:flex;align-items:center;justify-content:center}
  .aspot-hd-sub-tog::before{content:"";width:9px;height:9px;border-right:1.5px solid currentColor;
    border-bottom:1.5px solid currentColor;transform:rotate(45deg) translate(-2px,-2px);transition:transform .22s}
  .aspot-hd-menu > li.is-open > .aspot-hd-sub-tog::before{transform:rotate(225deg) translate(-2px,-2px)}
  .aspot-hd-menu > li > a .caret{display:none}

  /* children: hidden until asked for, rail-indented, full-size touch rows */
  .aspot-hd-menu .sub-menu{position:static;opacity:1;visibility:visible;transform:none;
    background:transparent;border:0;min-width:0;box-shadow:none;
    margin:0!important;padding:0!important;display:none}
  .aspot-hd-menu > li.is-open > .sub-menu{display:block;padding:2px 0 12px 16px!important;
    border-left:1px solid rgba(201,161,89,.28);margin-left:2px!important}
  .aspot-hd-menu .sub-menu a{padding:0!important;min-height:46px;display:flex;align-items:center;
    font-size:12.5px;letter-spacing:.12em;color:#b9b0a0}
  .aspot-hd-menu .sub-menu a:hover,.aspot-hd-menu .sub-menu a:focus{background:transparent;color:var(--gold)}
  .aspot-hd-menu .sub-menu .is-sep{margin-top:6px;padding-top:6px}

  .aspot-hd-cta{margin-top:22px;justify-content:center;min-height:52px;font-size:11.5px}
}
html.lodge-light .aspot-hd-nav{background:#faf6ed}
html.lodge-light .aspot-hd-scrim{background:rgba(28,26,23,.4)}
html.lodge-light .aspot-hd-menu .sub-menu a{color:#5c5446}
html.lodge-light .aspot-hd-menu > li.is-open > .sub-menu{border-left-color:rgba(143,36,24,.3)}
html.lodge-light .aspot-hd-sub-tog{color:#8f2418}


/* ---- 0.38.1: burger + light toggle are one right-hand pair ----
   They were different sizes (42 vs 34), only one had a border, and the burger's
   margin-left:auto with the toggle trailing it left the burger sitting short of
   the edge. Same 40px box, same frame, 8px apart, hard right. */
.aspot-hd-burger,.aspot-hd-tog{box-sizing:border-box;width:40px!important;height:40px!important;
  min-width:40px;flex:none;padding:0!important;border:1px solid var(--line);background:transparent;
  align-items:center;justify-content:center;align-self:center;
  border-radius:0;cursor:pointer;transition:border-color .18s,color .18s}
/* The burger is a PHONE control. Setting display on the shared rule above resurrected
   it on desktop, where it sat beside the wordmark next to a full nav. Its display is
   owned by the breakpoints only. */
.aspot-hd-tog{display:inline-flex}
.aspot-hd-burger{display:none}
@media(max-width:980px){.aspot-hd-burger{display:flex}}
/* the accordion chevron is injected into every parent item by aspot-header.js;
   on desktop those items are hover dropdowns, so it has no business showing */
.aspot-hd-sub-tog{display:none}
@media(max-width:980px){.aspot-hd-sub-tog{display:flex}}
@media(min-width:981px){.aspot-hd-menu > li.has-kids{display:flex}}
/* auto on the FIRST of the pair only; the second just sits 8px after it, so the pair
   travels to the right edge together instead of the toggle drifting inward */
.aspot-hd-burger{margin:0 0 0 auto!important;gap:5px;flex-direction:column}
.aspot-hd-tog{margin:0 0 0 8px!important}
.aspot-hd-tog svg{width:17px;height:17px;display:block}
.aspot-hd-burger:hover,.aspot-hd-burger:focus,
.aspot-hd-tog:hover,.aspot-hd-tog:focus{border-color:var(--gold);outline:none}
/* desktop: the nav already took the auto space, so the burger is hidden and the
   toggle is simply the last item in the row */
@media(min-width:981px){.aspot-hd-tog{margin-left:14px!important}}
html.lodge-light .aspot-hd-burger,html.lodge-light .aspot-hd-tog{border-color:rgba(28,26,23,.18)}
html.lodge-light .aspot-hd-burger span{background:#1c1a17}
html.lodge-light .aspot-hd-burger:hover,html.lodge-light .aspot-hd-tog:hover{border-color:#8f2418}