/* Metric-matched fallbacks so the web-font swap does not move the page
   (layout shift). Oswald is about 74.5% of Arial's width, PT Sans about 95%. */
@font-face{font-family:"Oswald Fallback";
  src:local("Arial"),local("Liberation Sans"),local("Helvetica");
  size-adjust:74.5%}
@font-face{font-family:"PT Sans Fallback";
  src:local("Arial"),local("Liberation Sans"),local("Helvetica");
  size-adjust:95%}

/* WNG: header, footer, hero overlay, focus.
   Palette: black / white, body text #6f738f, surface #f3f5f7.
   No accent color: hover and active states invert black and white. */

.screen-reader-text{position:absolute;width:1px;
  height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Focus: black ring on light, white ring on dark. */
:focus-visible{outline:3px solid #000;outline-offset:2px}
.wng-header :focus-visible,
.wng-footer :focus-visible{outline-color:#fff}

/* Strip Twenty Twenty-Five's spacing between top-level blocks. */
body .wp-site-blocks{padding-top:0;padding-bottom:0}
body .wp-site-blocks > *{margin-block-start:0}

/* Bold really is bold. */
strong,b{font-weight:700}

/* ---------- Header: logo left, menu centered, social right ---------- */
.wng-header{position:relative;background:#000;color:#fff;
  min-height:90px;padding:0 1.5rem;gap:1rem;align-items:center}
.wng-logo{margin:0;flex:0 0 auto}
.wng-logo img{display:block;width:225px;height:auto;
  aspect-ratio:225/56;max-width:100%}
.wng-nav{position:absolute;left:50%;transform:translateX(-50%);
  white-space:nowrap}
.wng-menu{list-style:none;margin:0;padding:0;display:flex;
  flex-wrap:wrap;align-items:center;gap:0}
.wng-menu li{position:relative}
.wng-nav a{display:block;padding:0 15px;line-height:90px;
  font-size:13px;letter-spacing:1px;text-transform:uppercase;
  text-decoration:none;color:rgba(255,255,255,.77)}
.wng-nav a:hover,
.wng-nav a:focus{color:#fff;text-decoration:underline;
  text-underline-offset:6px}
.wng-nav .current-menu-item > a,
.wng-nav .current-menu-ancestor > a,
.wng-nav [aria-current="page"]{color:#fff}
/* Dropdowns (two levels) if a menu ever has them. */
.wng-nav .sub-menu{display:none;position:absolute;left:0;
  top:100%;min-width:12em;background:#fff;list-style:none;
  margin:0;padding:0;box-shadow:0 3px 3px rgba(0,0,0,.2);z-index:60}
.wng-nav .menu-item-has-children:hover > .sub-menu,
.wng-nav .menu-item-has-children:focus-within > .sub-menu{display:block}
.wng-nav .sub-menu li{border-bottom:1px solid #e1e2e4}
.wng-nav .sub-menu li:last-child{border:0}
.wng-nav .sub-menu a{line-height:22px;padding:10px 14px;
  font-size:14px;text-transform:none;color:#6f738f}
.wng-nav .sub-menu a:hover{color:#000}
.wng-social{margin:0;flex:0 0 auto;gap:.9rem}
.wng-social .wp-social-link a{padding:.25rem}

.wng-menu-toggle{display:none;align-items:center;
  justify-content:center;width:44px;height:44px;
  padding:0;background:none;border:2px solid #fff;
  border-radius:6px;cursor:pointer}
.wng-menu-toggle-bar,
.wng-menu-toggle-bar:before,
.wng-menu-toggle-bar:after{display:block;width:22px;
  height:2px;background:#fff;content:"";position:relative}
.wng-menu-toggle-bar:before{position:absolute;top:-7px}
.wng-menu-toggle-bar:after{position:absolute;top:7px}

@media (max-width:1100px){
  .wng-social{display:none}
}
@media (max-width:781px){
  .wng-header{min-height:76px;justify-content:space-between}
  .wng-logo img{width:180px}
  .wng-nav{position:static;transform:none;margin-left:auto}
  .wng-menu-toggle{display:inline-flex}
  .wng-nav .wng-menu-panel{display:none;position:absolute;
    left:0;right:0;top:100%;background:#000;
    padding:.5rem 1.5rem 1rem;z-index:60}
  .wng-nav.is-open .wng-menu-panel{display:block}
  .wng-nav .wng-menu{flex-direction:column;align-items:flex-start}
  .wng-nav a{line-height:44px;padding:0 4px}
  .wng-nav .sub-menu{display:block;position:static;
    min-width:0;background:none;box-shadow:none}
  .wng-nav .sub-menu li{border:0}
  .wng-nav .sub-menu a{color:rgba(255,255,255,.77);padding-left:1rem}
}

/* ---------- Homepage hero: header floats over the band photo ---------- */
.wng-hero-wrap{position:relative;background:#000}
/* Block-gap margin on the hero would leave a white strip under the
   floating header; the hero must start at the very top. */
.wng-hero-wrap,.wng-hero-wrap > .wng-hero,.wng-hero{margin-block-start:0;margin-top:0}
.wng-header-overlay{position:absolute;top:0;left:0;right:0;z-index:5}
.wng-header-overlay .wng-header{background:transparent}
.wng-hero{position:relative;overflow:hidden;background:#000}
.wng-hero-img{display:block;width:100%;height:auto;
  max-height:85vh;min-height:320px;object-fit:cover;
  object-position:50% 25%}
/* Dark wash so the white menu stays readable (matches the old 38% overlay). */
.wng-hero::after{content:"";position:absolute;inset:0;
  background:rgba(0,0,0,.38);pointer-events:none}
@media (max-width:781px){
  /* Phone: menu bar above the photo, no overlap. */
  .wng-header-overlay{position:static}
  .wng-header-overlay .wng-header{background:#000}
  .wng-hero-img{min-height:0;max-height:none}
  .wng-hero::after{display:none}
}

/* ---------- Inner pages ---------- */
.wng-page-title,
.wng-single{padding-top:2.5rem}
.wng-page .wp-block-post-title,
.wng-single .wp-block-post-title{margin:0 0 1.5rem}
.wng-page-title,
.wng-page > .wp-block-post-content,
.wng-single{padding-inline:1.25rem}
.wng-page > .wp-block-post-content{padding-bottom:3rem}
.wng-single{padding-bottom:3rem}
.wng-single .wp-block-post-date{font-size:.9rem;margin:0 0 1.25rem}
.wng-single .wp-block-post-featured-image{margin:0 0 1.5rem}
.wng-single .wp-block-post-featured-image img{width:100%;height:auto}
.wng-post-nav{margin-top:2.5rem;padding-top:1.25rem;
  border-top:1px solid #e1e2e4;gap:1rem}
.wng-post-nav a{font-weight:700}

/* The Band: member rows (Media & Text, alternating sides). */
.wp-block-media-text{margin:0 0 3rem;gap:2rem}
.wp-block-media-text__content{padding:0 !important}
.wp-block-media-text__content h2{margin:0 0 .25rem}
.wp-block-media-text__content h3{font-size:1.1rem;
  font-weight:400;margin:0 0 1rem}
.wp-block-media-text__content h5{font-size:1rem;margin:1rem 0 0}
.wp-block-media-text__media img{display:block;width:100%;height:auto}

/* ---------- Footer ---------- */
.wng-footer{background:#000;color:#fff;padding:2.5rem 1rem;
  text-align:center}
.wng-footer a{color:#fff}
.wng-footer a:hover,
.wng-footer a:focus{text-decoration:underline}
.wng-footer-email{font-size:1.6rem;font-weight:700;margin:0 0 1rem}
.wng-footer-email a{text-decoration:none}
.wng-footer-nav .wng-menu{justify-content:center;gap:.25rem 1.5rem}
.wng-footer-nav a{display:block;padding:.5rem .25rem;font-size:.85rem;
  letter-spacing:1px;text-transform:uppercase;text-decoration:none;
  color:#fff}
.wng-footer .wp-block-social-links{margin:1.25rem 0}
.wng-copyright{font-size:.85rem;margin:0;color:rgba(255,255,255,.77)}
@media (max-width:600px){
  .wng-footer-email{font-size:1.25rem}
}

/* Social icon tooltips: network name on hover and keyboard focus. */
.wp-block-social-links .wp-social-link a{position:relative}
.wp-block-social-links .wp-social-link a::after{
  position:absolute;left:50%;bottom:calc(100% + 4px);
  transform:translateX(-50%);padding:.25rem .6rem;border-radius:4px;
  background:#fff;color:#000;font:700 .8rem/1.2 "PT Sans","PT Sans Fallback",Arial,sans-serif;
  letter-spacing:.5px;white-space:nowrap;pointer-events:none;
  opacity:0;visibility:hidden;transition:opacity .15s;z-index:70}
.wp-block-social-links .wp-social-link a:hover::after,
.wp-block-social-links .wp-social-link a:focus-visible::after{
  opacity:1;visibility:visible}
.wp-block-social-links .wp-social-link-instagram a::after{content:"Instagram"}
.wp-block-social-links .wp-social-link-spotify a::after{content:"Spotify"}
.wp-block-social-links .wp-social-link-youtube a::after{content:"YouTube"}
.wp-block-social-links .wp-social-link-facebook a::after{content:"Facebook"}
.wp-block-social-links .wp-social-link-tiktok a::after{content:"TikTok"}
.wp-block-social-links .wp-social-link-x a::after{content:"X"}
.wp-block-social-links .wp-social-link-bluesky a::after{content:"Bluesky"}
.wp-block-social-links .wp-social-link-threads a::after{content:"Threads"}
.wp-block-social-links .wp-social-link-soundcloud a::after{content:"SoundCloud"}
.wp-block-social-links .wp-social-link-bandcamp a::after{content:"Bandcamp"}
.wp-block-social-links .wp-social-link-amazon a::after{content:"Amazon"}
.wp-block-social-links .wp-social-link-apple a::after{content:"Apple Music"}
.wp-block-social-links .wp-social-link-chain a::after{content:"Link"}
@media (prefers-reduced-motion:reduce){
  .wp-block-social-links .wp-social-link a::after{transition:none}}

/* Smooth page-to-page fades where supported; ignored elsewhere. */
@view-transition{navigation:auto}
@media (prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  html{scroll-behavior:auto}
}

/* Shows (The Events Calendar): site fonts instead of the plugin's
   Helvetica. Titles match site headings. */
body .tribe-common,body .tribe-events{
  --tec-font-family-sans-serif:"PT Sans","PT Sans Fallback",Arial,sans-serif;
  --tec-font-family-base:"PT Sans","PT Sans Fallback",Arial,sans-serif}
body .tribe-events .tribe-events-calendar-list__event-title,
body .tribe-events .tribe-events-calendar-list__event-title a,
body .tribe-events .tribe-events-single-event-title{
  font-family:Oswald,"Oswald Fallback",Arial,sans-serif;font-weight:400;
  color:#000}

/* Carried over from the old theme: Content Views "read more" button. */
.pt-cv-readmore{color:#6f738f !important;background:#fff !important;
  border:1px solid #6f738f !important}

/* Carried over from the old theme: checkout fields. */
.woocommerce-billing-fields .form-row,
.woocommerce-shipping-fields .form-row{display:block}
#customer_details{display:flex}
#customer_details .col-1,
#customer_details .col-2{width:50%;max-width:100%;flex:1 0 auto}
textarea#order_comments{width:30em;max-width:100%}
@media (max-width:781px){
  #customer_details{display:block}
  #customer_details .col-1,
  #customer_details .col-2{width:100%}
}