/* Site fonts: Cornerstone (Zac Freeland, SIL OFL) for headings/nav/buttons; Arial for paragraph text */
@font-face{font-family:"Cornerstone";src:url(fonts/Cornerstone.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}
html,body,*{font-family:"Cornerstone",Arial,Helvetica,sans-serif!important;font-weight:400!important}
p,p *{font-family:Arial,Helvetica,sans-serif!important}
/* Booking page mailing-list line: Cornerstone (the "Contact us" face) at its
   existing 28px/24px size. Needs the id to outrank the p,p * rule above. */
/* Charcoal ground so a short page never shows white below the last section */
html,body{background-color:rgb(34,34,34)}
/* Fixed footer bar (desktop) */
@media (min-width:920px){
  #zNXL5j{position:fixed;bottom:0;left:0;right:0;z-index:200}
  main{padding-bottom:67px}
}

/* Mobile nav toggle. The mirrored site's JS never came across, so the hamburger
   had nothing to toggle and nav links were unreachable on phones. The site's own
   open-state rules (.block-header-layout-mobile__dropdown--open, .burger--open)
   still exist in the astro CSS; these replicate them off a hidden checkbox, so
   the menu works with zero JavaScript. The <button> is now a <label for>; the
   checkbox stays focusable (clipped, not display:none) so Space still toggles it
   and :focus-visible paints a ring on the burger. Desktop is untouched --
   .block-header-layout-mobile is display:none above 920px. */
.rt-nav-toggle{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media screen and (max-width:920px){
  .burger{cursor:pointer}
  .rt-nav-toggle:focus-visible ~ .burger{outline:2px solid var(--nav-link-text-color,#f1f1f1);outline-offset:4px}
  .rt-nav-toggle:checked ~ .block-header-layout-mobile__dropdown{visibility:visible;height:auto;max-height:calc(100svh - var(--header-height-mobile,67px));padding:24px 16px;overflow-y:auto;box-shadow:0 6px 14px -10px #0000001a}
  .rt-nav-toggle:checked ~ .burger .burger__bun:first-child{top:-1px;transform:rotate(45deg)}
  .rt-nav-toggle:checked ~ .burger .burger__bun:last-child{transform:rotate(-45deg)}
  .rt-nav-toggle:checked ~ .burger .burger__meat{opacity:0;width:0}
}

/* Nav links are 20px with .06em letter-spacing, matched to the hero subtitle
   "Alternative Rock from Tucson, AZ" (index hero tagline). That widened the desktop link
   row from 710px to 847px, which crowds the logo: the header grid is
   `1fr auto 1fr` with the nav centred, so the logo's clearance is
   (container - nav)/2 - 86, and at 1000px it went negative -- logo and HOME
   touched. The clamp ramps the link gaps 28px -> 64px across 920..1180px, so
   clearance stays >=25px at the low end while wide desktop keeps its roomy
   64px, with no jump at a breakpoint. `!important` is mandatory:
   --link-spacing:64px is set in the header's inline style attribute, which a
   plain @media rule cannot beat (gotcha 8). Re-check 921-1024px after ANY nav
   font-size or letter-spacing change. */
@media (min-width:920px){
  .block-header{--link-spacing:clamp(28px, calc(28px + (100vw - 920px) * 0.1385), 64px)!important}
}

/* Mobile header: logo right, burger left. The mirror's mobile-2 layout is
   `grid-template-areas:"hamburger-menu logo cart"` over columns
   `max-content max-content auto`, so burger and logo both packed against the
   left edge with dead space beside them. Widening the logo's own column to 1fr
   lets the class's existing `justify-items:end` push it to the far right; the
   burger's column stays max-content, so it remains flush left. Gives symmetric
   32px insets (16px .block-header + 16px --m-padding).
   `!important` is mandatory: fonts.css is linked BEFORE the astro stylesheet
   and the original rule carries [data-v-c1535ecd]. None of the three stock
   mobile layouts do burger-left/logo-right, so this override is the only way.
   (Added, reverted, then reinstated Sep 2026 -- the user confirmed it reads
   better on real phones. Do not "tidy" it away.) */
@media screen and (max-width:920px){
  .block-header-layout-mobile--mobile-2{grid-template-columns:max-content 1fr max-content!important}
}