/* Keep every public-facing image fully visible at all viewport sizes. */
main img {
  max-width: 100%;
  object-position: center;
}

.hero-image img,
.portrait img,
.artist-photo img,
.feature img,
.book img,
.book-art img,
.friend-photo img,
.book-cover img,
.album-art,
.album-sale-art,
.track-art,
.logo-card img,
.logo-panel img,
.hero-logo img,
.seal img {
  object-fit: contain !important;
  object-position: center !important;
  background: #090909;
}

/* Album and portrait images that are not intentional thumbnails keep their natural proportions. */
.album-art,
.album-sale-art,
.book-art img,
.logo-card img,
.logo-panel img,
.hero-logo img,
.seal img {
  height: auto !important;
  aspect-ratio: auto !important;
}

/* Desktop layout polish: a tighter editorial grid with more breathing room where it matters. */
.menu-toggle { display: none; }

@media (min-width: 1001px) {
  .wrap { width: min(1240px, calc(100vw - 96px)); }
  header nav { min-height: 64px; }
  header .brand img { width: 42px; height: 42px; }
  .brand { flex: 0 0 auto; }
  .brand span { white-space: nowrap; }
  .links { gap: .85rem; align-items: center; }
  .links { margin-left: 1.5rem; }
  .links a { font-size: .88rem; }
  main { padding-bottom: 4rem; }

  body:has(.logo-card) .hero { min-height: 40vh; grid-template-columns: 1.15fr .85fr; gap: 5rem; padding: 1.35rem 0 1.8rem; }
  body:has(.logo-card) .logo-card { max-width: 430px; justify-self: end; padding: 1.1rem; }
  body:has(.logo-card) section { padding: 3.6rem 0; }
  body:has(.logo-card) .highlights { grid-template-columns: repeat(4, 1fr); gap: 1.1rem; }
  body:has(.logo-card) .card { min-height: 238px; padding: 1.25rem; }
  body:has(.logo-card) .card h3 { font-size: 1.42rem; }
  body:has(.logo-card) .feature-row { gap: 1.5rem; }

  body:has(.books) .hero, body:has(.hero-logo) .hero,
  body:has(.hero-image) .hero, body:has(.portrait) .hero { min-height: 52vh; padding-top: 2.4rem; padding-bottom: 2.5rem; }
  body:has(.books) section, body:has(.hero-logo) section,
  body:has(.hero-image) section, body:has(.portrait) .story { padding-top: 3.8rem; padding-bottom: 3.8rem; }
  body:has(.books) .books { grid-template-columns: repeat(6, 1fr); gap: 1rem; }
  body:has(.books) .book-body { padding: .85rem; gap: .65rem; }
  body:has(.books) .book h3 { font-size: 1rem; }

  body:has(.plans) .hero, body:has(.form-card) .hero { padding-top: 2.4rem; padding-bottom: 1.8rem; }
  body:has(.plans) .plans { padding-bottom: 3.8rem; }
  body:has(.plans) .contact { padding: 3.8rem 0; }
  body:has(.tracks) .hero, body:has(.story-grid) .hero { min-height: 52vh; padding-top: 2.4rem; padding-bottom: 2.5rem; }
  body:has(.tracks) section { padding-top: 3.8rem; padding-bottom: 3.8rem; }
  body:has(.tracks) .tracks { gap: 1.2rem; }
  .hero-image img, .portrait img, .artist-photo img, .feature img, .book img, .book-art img { object-fit: contain; }
  footer { padding: 1.8rem 0; }
  a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 2px solid var(--gold, #e8b84c); outline-offset: 3px; }
}

@media (max-width: 700px) {
  .menu-toggle { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: .55rem .8rem; border: 1px solid var(--gold, #e8b84c); background: transparent; color: var(--gold2, #ffdf82); font: 700 .9rem Arial, sans-serif; }
  .menu-toggle[aria-expanded="true"] { background: var(--gold, #e8b84c); color: #080808; }
  header nav { position: relative; display: flex; flex-wrap: wrap; align-items: center; padding: .65rem 0; }
  header .brand { width: auto; flex: 1 1 auto; min-width: 0; }
  header .brand span { font-size: .78rem; line-height: 1.15; white-space: normal; }
  header .brand img { width: 42px; height: 42px; }
  header .links {
    display: none;
    position: absolute;
    top: calc(100% - .15rem);
    left: 0;
    right: 0;
    width: 100%;
    max-height: calc(100dvh - 118px);
    margin: 0;
    padding: .65rem;
    border: 1px solid var(--line, #493a24);
    background: rgba(5,5,5,.99);
    box-shadow: 0 18px 38px rgba(0,0,0,.65);
    overflow-y: auto;
    overscroll-behavior: contain;
    z-index: 100;
  }
  header .links.is-open { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .35rem; }
  header .links a {
    display: flex;
    align-items: center;
    min-height: 42px;
    padding: .48rem .55rem;
    border: 1px solid rgba(232,184,76,.2);
    background: #111;
    font-size: .82rem;
    line-height: 1.18;
    white-space: normal;
  }
  header .links a:hover,
  header .links a[aria-current="page"] { background: rgba(232,184,76,.14); border-color: var(--gold, #e8b84c); }
  .actions, .buttons, .purchase-buttons { flex-direction: column; align-items: stretch; }
  .actions .btn, .buttons .btn, .purchase-buttons .btn { width: 100%; }
  body:has(.logo-card) .hero h1 { font-size: clamp(2.35rem, 12vw, 3.5rem); }
  body:has(.logo-card) .card { min-height: 0; }
  .site-chat-button { right: .75rem !important; bottom: .75rem !important; padding: .65rem .8rem !important; font-size: .86rem !important; }
  .hero-image img, .portrait img, .artist-photo img { aspect-ratio: 1 / 1; object-fit: contain; background: #090909; }
  .feature img { aspect-ratio: 4 / 3; object-fit: contain; background: #090909; }
  .book img { aspect-ratio: 2 / 3; object-fit: contain; background: #090909; }
  .book-art img { object-fit: contain; background: #090909; }
}

/* Desktop-site mode on narrower screens (for example, a phone requesting the desktop page). */
@media (min-width: 701px) and (max-width: 1100px) {
  header nav { overflow: visible; }
  header .brand { flex: 0 0 auto; white-space: nowrap; }
  header .brand span { white-space: nowrap; }
  .hero-image img, .portrait img, .artist-photo img, .feature img, .book img, .book-art img { object-fit: contain; background: #090909; }
}

/* Desktop navigation: show every page without horizontal scrolling. */
@media (min-width: 701px) {
  header nav {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
    gap: .55rem;
    min-height: 0;
    padding: .7rem 0 .75rem;
    overflow: visible;
  }
  header .brand {
    justify-self: center;
    margin: 0;
  }
  header .links {
    width: 100%;
    min-width: 0;
    margin: 0;
    padding-top: .55rem;
    border-top: 1px solid var(--line, #493a24);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: .3rem .45rem;
    overflow: visible;
  }
  header .links a {
    flex: 0 0 auto;
    padding: .36rem .58rem;
    border-radius: .25rem;
    font-size: clamp(.76rem, 1.05vw, .88rem);
    line-height: 1.25;
  }
  header .links a:hover,
  header .links a[aria-current="page"] {
    background: rgba(232,184,76,.1);
  }
}
/* Upcoming event images keep their complete composition at every viewport. */
.event-card{overflow:hidden}.event-card-image{display:block;width:100%;height:auto;max-height:32rem;object-fit:contain;background:#17110c}.event-card-content{padding:clamp(1rem,3vw,1.5rem)}.event-host,.event-time{font-weight:700}.event-meta{overflow-wrap:anywhere}
.event-state-filter{margin-bottom:2rem;padding:clamp(1rem,3vw,1.6rem);border:1px solid rgba(169,121,52,.45);border-radius:18px;background:rgba(255,255,255,.035)}.event-filter-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.event-filter-heading h2{margin:0 0 .25rem}.event-filter-heading p{margin:0}.us-state-map{width:min(100%,62rem);margin:1.25rem auto .75rem;padding:clamp(.35rem,1.5vw,1rem);border-radius:16px;background:linear-gradient(180deg,#153349,#091b28);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}.usa-map-svg{display:block;width:100%;height:auto;filter:drop-shadow(0 10px 18px rgba(0,0,0,.28))}.usa-map-svg path{fill:#d7c7a6;stroke:#fff7e7;stroke-width:1.25;vector-effect:non-scaling-stroke;cursor:pointer;transition:fill .15s ease,filter .15s ease}.usa-map-svg path:hover,.usa-map-svg path:focus-visible{fill:#f0c15b;filter:brightness(1.08);outline:none}.usa-map-svg path.has-events{fill:#b8892e}.usa-map-svg path.active{fill:#f6d477;stroke:#24170f;stroke-width:2.4}.event-state-select-label{display:block;margin:.85rem 0 .35rem;font-weight:800}.event-state-select{width:min(100%,24rem);min-height:48px;border:1px solid #b98a45;border-radius:10px;background:#17110c;color:#fff;padding:.7rem .8rem;font:inherit}.event-map-fallback{padding:1rem;color:#fff}.event-filter-status{font-weight:700;margin:.75rem 0 0}.event-list{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:.3rem .15rem 1.25rem;overscroll-behavior-inline:contain}.event-list>.review-empty{min-width:100%}.event-card{flex:0 0 min(82vw,22rem);scroll-snap-align:start;border:1px solid rgba(169,121,52,.45);border-radius:16px;background:#17110c}.event-card-summary{display:block;cursor:pointer;list-style:none}.event-card-summary::-webkit-details-marker{display:none}.event-card-summary .event-card-image{width:100%;height:15rem;object-fit:cover;border-radius:15px 15px 0 0}.event-card-quick{display:grid;gap:.35rem;padding:1rem}.event-card-quick strong,.event-card-quick span{display:block}.event-open-label{margin-top:.35rem;color:#e3b568;font-weight:800}.event-card[open] .event-open-label{font-size:0}.event-card[open] .event-open-label::after{content:'Hide details';font-size:1rem}.event-card-details{padding:0 1rem 1.2rem;border-top:1px solid rgba(169,121,52,.35)}.event-card-details h2{margin-top:1rem}.event-card-details p{overflow-wrap:anywhere}@media(max-width:700px){.event-filter-heading{display:grid}.event-filter-heading .btn{width:100%}.us-state-map{padding:.25rem}.event-card{flex-basis:84vw}}
.event-engagement{margin-top:1.25rem;padding-top:1rem;border-top:1px solid rgba(169,121,52,.4)}.event-engagement h3{margin:1rem 0 .65rem;font-size:1.05rem}.event-reactions{display:flex;flex-wrap:wrap;gap:.45rem}.event-reaction-button{border:1px solid #a97934;border-radius:999px;background:#241b13;color:#fff;padding:.45rem .7rem;cursor:pointer;font-size:.9rem}.event-reaction-button:hover,.event-reaction-button:focus-visible,.event-reaction-button.active{background:#d8a852;color:#17110c}.event-share{margin:.9rem 0}.event-share-links{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.65rem}.event-share-links a{border:1px solid rgba(169,121,52,.65);border-radius:8px;padding:.4rem .65rem;color:#f3d9a7;text-decoration:none}.event-comments{display:grid;gap:.6rem;max-height:17rem;overflow-y:auto}.event-comment{padding:.7rem;border-radius:10px;background:rgba(255,255,255,.05)}.event-comment p,.event-no-comments{margin:.25rem 0 0}.event-comment-form{display:grid;gap:.7rem;margin-top:.8rem}.event-comment-form label{display:grid;gap:.3rem;font-weight:700}.event-comment-form input,.event-comment-form textarea{width:100%;box-sizing:border-box;border:1px solid #8f6b36;border-radius:8px;background:#fff;color:#17110c;padding:.65rem;font:inherit}.event-comment-form .btn{justify-self:start}.event-comment-status{margin:0;font-weight:700}
.event-card-summary .event-card-image{object-fit:contain!important;object-position:center;background:#0b0907;padding:.35rem}

/* Shared public-site actions. Ordinary paragraph links remain normal links. */
:where(.btn,.links a,.card>a,.feature a,.socials a,.purchase-buttons a,.event-share-links a,.foot a,.share-link) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  min-height: 44px;
  padding: .62rem .9rem;
  border: 1px solid var(--gold, #d49b49);
  border-radius: 8px;
  background: #17110c;
  color: var(--gold2, #ffdf82);
  text-align: center;
  text-decoration: none;
  font-weight: 800;
  line-height: 1.25;
  white-space: normal;
  overflow-wrap: anywhere;
}
:where(.btn,.links a,.card>a,.feature a,.socials a,.purchase-buttons a,.event-share-links a,.foot a,.share-link):hover,
:where(.btn,.links a,.card>a,.feature a,.socials a,.purchase-buttons a,.event-share-links a,.foot a,.share-link):focus-visible {
  background: var(--gold, #d49b49);
  color: #100b07;
}
.links,.actions,.buttons,.purchase-buttons,.socials,.event-share-links,.foot {
  flex-wrap: wrap;
  gap: .7rem;
}
@media(max-width:700px){
  .actions>a,.buttons>a,.purchase-buttons>a,.socials>a,.foot a{flex:1 1 calc(50% - .7rem);width:auto}
  .links a{min-width:0}
}
@media(max-width:359px){.actions>a,.buttons>a,.purchase-buttons>a,.socials>a,.foot a{flex-basis:100%;width:100%}}