/* Hin & Co — everything GenerateBlocks, the block library and the plugins used to provide.
   GeneratePress's own CSS (gp-main.min.css + gp-customizer.css) is loaded first, unchanged.
   Values come from the WordPress site's GenerateBlocks CSS (reference/inline/). */

:root { --logo: #e200ee; --purple: #ab2eba; --plum: #811e84; --bg: none; }
html { scroll-behavior: smooth; scroll-padding-top: 76px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { overflow-x: hidden; }
[hidden] { display: none !important; }
img { max-width: 100%; height: auto; }
.site-content { display: block; }
.site-main > * { margin-bottom: 0; } /* GP adds 20px between blocks */
.one-container .site-content { padding: 0; }
.screen-reader-text:focus { clip: auto; width: auto; height: auto; position: fixed; top: 8px; left: 8px; z-index: 9999; background: #fff; color: #000; padding: 10px 16px; }

/* Logo word in headings */
.HClogo { text-transform: none; word-spacing: -0.3em; font-family: "Merienda One", handwriting; color: var(--logo); letter-spacing: normal; }
.logo-spacing { word-spacing: -0.3em; }

/* ---------- Header (sticky, translucent; GP "header-wrap" + sticky fade) ---------- */
.header-wrap { position: sticky; top: 0; z-index: 100; }
.header-wrap #site-navigation { background: rgba(10, 10, 10, 0.5); transition: background-color 300ms ease; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.is-scrolled .header-wrap #site-navigation { background: rgba(10, 10, 10, 0.85); }
.home .header-wrap { position: fixed; left: 0; right: 0; }
.main-navigation .inside-navigation { display: flex; align-items: center; justify-content: space-between; padding: 0 40px; }
.main-navigation .main-title { margin: 0; line-height: 76px; word-spacing: -10px; }
.main-navigation .main-title a { display: inline-flex; align-items: center; }
.site-logo { height: 1.1em; width: auto; margin-right: .3em; }
.main-navigation .main-title a, .main-navigation .main-title a:hover { font-family: "Merienda One", handwriting; font-weight: 500; font-size: 40px; text-transform: none; color: #fff; text-decoration: none; }
.main-navigation .main-nav ul li a { color: #fff; line-height: 76px; }
.main-navigation .main-nav > ul > li:hover > a, .main-navigation .main-nav > ul > li:focus-within > a,
.main-navigation .main-nav > ul > li.current-menu-item > a { color: var(--purple); background: transparent; }
.main-navigation .dropdown-menu-toggle svg { font-size: 10px; }
.main-navigation ul ul { background: #3f3f3f; }
.main-navigation .main-nav ul ul li a { line-height: normal; padding: 10px 20px; font-size: 13px; }
.main-navigation .main-nav ul ul li a:hover { background: #4f4f4f; color: #fff; }
.main-navigation .main-nav ul li:focus-within > ul { left: auto; opacity: 1; pointer-events: auto; height: auto; overflow: visible; }
.main-navigation .menu-toggle { display: none; background: transparent; color: #fff; line-height: 54px; padding: 0 20px; font-size: 14px; }
.main-navigation .menu-toggle svg { vertical-align: -0.15em; margin-right: 8px; }
@media (max-width: 960px) {
  .main-navigation .inside-navigation { padding: 0 0 0 10px; }
  .main-navigation .main-title { line-height: 54px; }
  .main-navigation .main-nav { display: none; }
  .main-navigation .menu-toggle { display: block; }
}

/* Mobile slide-out menu (GP Menu Plus "off-canvas") */
.slideout-navigation { position: fixed; top: 0; bottom: 0; left: 0; width: 265px; max-width: 85vw; background: #fff; z-index: 1000; overflow-y: auto; padding: 50px 0 30px; box-shadow: 0 0 20px rgba(0,0,0,.3); }
.slideout-navigation ul { list-style: none; margin: 0; }
.slideout-navigation a { display: block; padding: 0 20px; line-height: 54px; color: #000; font-family: "Open Sans", sans-serif; font-weight: 600; text-transform: uppercase; font-size: 14px; text-decoration: none; }
.slideout-navigation ul ul a { line-height: 40px; padding-left: 40px; font-size: 13px; text-transform: none; }
.slideout-navigation .current-menu-item > a, .slideout-navigation a:hover { color: var(--purple); }
.slideout-navigation .slideout-exit { position: absolute; top: 6px; right: 0; background: none; color: #000; padding: 10px 20px; font-size: 18px; }
.slideout-overlay { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.6); z-index: 999; }
.slide-opened { overflow: hidden; }

/* ---------- Shared section pieces ---------- */
.has-bg { position: relative; overflow: hidden; }
/* Photo behind a section: a tiny inline preview shows at once, the real photo covers it when loaded */
.has-bg::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background-image: var(--bg, none), var(--bg-lqip, none); background-position: center; background-size: cover; background-repeat: no-repeat; opacity: var(--bg-opacity, 1); }
@media (max-width: 767px) { .has-bg::before { background-image: var(--bg-m, var(--bg, none)), var(--bg-lqip, none); } }
.has-bg > * { position: relative; z-index: 1; }
.bg-fixed::before { background-attachment: fixed; }
.section-title { text-transform: uppercase; text-align: center; margin-bottom: 40px; color: #fff; font-size: 40px; }
.section-title--left { text-align: left; }
@media (max-width: 767px) { .section-title { font-size: 28px; } .section-title--left { text-align: center; } }

/* ---------- Home: hero ---------- */
.hero { --bg-opacity: .5; background: #000; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 250px 30px 150px; margin-top: 75px; }
.hero__inner { max-width: 1300px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.hero__tagline { text-transform: uppercase; color: #fff; margin: 0 0 20px; }
.hero__name { font-family: Merienda, handwriting; font-size: 90px; line-height: 1em; font-weight: 600; margin: 20px 0 40px; color: var(--logo); text-transform: none; white-space: nowrap; }
.hero__name { display: inline-flex; align-items: center; }
.hero__logo { height: 1em; width: auto; margin-right: .25em; }
.hero__text { max-width: 800px; font-size: 21px; line-height: 30px; font-weight: normal; text-transform: none; color: #fff; margin: 0 0 20px; }
.hero__text strong { font-weight: 700; }
.hero__button { display: inline-flex; align-items: center; justify-content: center; margin-top: 20px; padding: 20px 120px; border: 4px solid #fff; background: #000; color: #fff; line-height: 0; }
.hero__button svg { width: 1.6em; height: 1.6em; }
.hero__button:hover, .hero__button:focus { background: #6e1f77; color: #fff; }
@media (max-width: 1024px) { .hero { padding-top: 100px; } .hero__name { font-size: 100px; } }
@media (max-width: 767px) {
  .hero { padding: 40px 0; margin-top: 54px; }
  .hero__tagline { font-size: 25px; margin: 0; }
  .hero__name { font-size: 50px; margin: 0; }
  .hero__text { font-size: 16px; margin: 0; }
  .hero__button { align-self: stretch; margin: 30px 30px 0; padding: 20px; }
}

/* ---------- Home: about ---------- */
.about { --bg-opacity: .6; background: rgba(0, 0, 0, 0.8); }
.about__inner { max-width: 1300px; margin: 0 auto; padding: 160px 0; display: flex; justify-content: center; }
.about__text { width: 75%; padding: 40px; color: #fff; }
.about__text p { font-size: 20px; line-height: 30px; margin-bottom: 30px; }
@media (max-width: 1024px) { .about__inner { padding: 100px 0; } .about__text { width: 100%; } }
@media (max-width: 767px) { .about__inner { padding: 20px 0; } }

/* ---------- Home: testimonials ---------- */
.testimonials { padding: 120px 0 100px; background-image: linear-gradient(343deg, var(--plum), rgba(0, 0, 0, 0.3)); }
.testimonials .section-title { margin-bottom: 40px; }
.testimonials__grid { width: 57%; max-width: 1300px; margin: 0 auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2em 4%; font-family: Poppins, sans-serif; text-align: center; padding: 0 30px; }
.testimonial p { margin-bottom: 1.5em; color: #fefefe; }
.testimonial__name { display: block; font-weight: 700; margin-top: .5em; }
@media (max-width: 1024px) { .testimonials__grid { width: 90%; grid-template-columns: 1fr; padding: 0 5px; } }
@media (max-width: 767px) { .testimonials { padding: 40px 0 20px; } .testimonials__grid { font-size: 14px; } }

/* ---------- Home: tribute ---------- */
.tribute { --bg-opacity: 0; background: var(--contrast); min-height: 400px; padding: 20px 0; }
.tribute__inner { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1em; padding: 5rem 3rem; }
.tribute__photo img { width: 100%; height: 100%; object-fit: cover; }
.tribute__text { padding: 3rem; }
.tribute__text h3, .tribute__text h4 { text-align: center; text-transform: none; }
@media (max-width: 767px) {
  .tribute { --bg-opacity: .25; }
  .tribute__inner { grid-template-columns: 1fr; padding: 0 .5rem; }
  .tribute__photo img { height: 300px; }
  .tribute__text { padding: 1px; }
}

/* ---------- Members (cards on home + archive) ---------- */
.team { background-color: var(--plum); color: #fff; }
.team a { color: #fff; }
.team a:hover { color: var(--contrast-3); }
.team__inner { max-width: 1300px; margin: 0 auto; padding: 120px; }
.member-grid { display: flex; flex-wrap: wrap; }
.member-card { width: 25%; padding: 20px; text-align: center; }
.member-card__photo { display: block; margin: 0 auto 30px; width: 160px; aspect-ratio: 1; }
.member-card__photo img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; vertical-align: middle; transition: filter .2s; }
.member-card__name { margin-bottom: 5px; }
.member-card__name a { text-decoration: none; }
@media (min-width: 1025px) { .member-card__photo:hover img { filter: blur(2px); } }
.team__note-heading { font-size: 20px; margin: 0; }
.team__note { margin: 0; }
@media (max-width: 1024px) { .team__inner { padding: 80px 30px; } }
@media (max-width: 767px) { .team__inner { padding: 40px 5px; } .member-card { width: 100%; } .team__note-heading, .team__note { text-align: center; } }

/* ---------- Home: gallery ---------- */
.gallery-section { max-width: 1000px; margin: 0 auto; padding: 100px 40px 40px; }
.gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.gallery a { display: block; aspect-ratio: 4 / 3; overflow: hidden; }
.gallery a:first-child, .gallery a:nth-child(2), .gallery a:nth-child(3) { aspect-ratio: 1; }
.gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.gallery a:hover img { transform: scale(1.03); }
@media (max-width: 1024px) { .gallery-section { padding-top: 80px; } }
@media (max-width: 767px) { .gallery-section { padding: 10px 5px; margin-top: 40px; } .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } .gallery a, .gallery a:nth-child(-n+3) { aspect-ratio: 1; } }

/* Lightbox */
.lightbox { position: fixed; inset: 0; z-index: 2000; background: rgba(0, 0, 0, 0.92); display: flex; align-items: center; justify-content: center; }
.lightbox[hidden] { display: none; }
.lightbox img { max-width: 92vw; max-height: 88vh; object-fit: contain; }
.lightbox button { position: absolute; background: none; color: #fff; font-size: 44px; line-height: 1; padding: 10px 18px; }
.lightbox button:hover, .lightbox button:focus { background: rgba(255, 255, 255, .1); color: #fff; }
.lb-close { top: 10px; right: 10px; } .lb-prev { left: 10px; top: 50%; transform: translateY(-50%); } .lb-next { right: 10px; top: 50%; transform: translateY(-50%); }
.lb-open { overflow: hidden; }

/* ---------- Home: videos ---------- */
.videos { --bg-opacity: .8; background-color: var(--purple); }
.videos__inner { max-width: 1300px; margin: 0 auto; padding: 50px 40px; }
.videos__title { text-transform: none; padding: 5px 0 20px; margin: 0 auto 1em; background: rgba(33, 33, 33, 0.75); }
.videos__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1em; }
@media (max-width: 767px) { .videos__inner { padding: 30px 10px; } .videos__grid { grid-template-columns: 1fr; } }

/* YouTube click-to-load (shared with member pages) */
.yt-embed { margin: 0 0 1.5em; }
.yt-facade, .yt-embed iframe { display: block; position: relative; width: 100%; aspect-ratio: 16 / 9; background: #000 center / cover no-repeat; border: 0; }
.yt-play { position: absolute; left: 50%; top: 50%; width: 68px; height: 48px; transform: translate(-50%, -50%); background: rgba(33, 33, 33, .85); border-radius: 14px; transition: background-color .2s; }
.yt-play::after { content: ""; position: absolute; left: 27px; top: 14px; border-style: solid; border-width: 10px 0 10px 18px; border-color: transparent transparent transparent #fff; }
.yt-facade:hover .yt-play, .yt-facade:focus .yt-play { background: #f00; }

/* ---------- Home: gigs ---------- */
.gigs { --bg-opacity: .5; background: #000; }
.gigs__inner { max-width: 1300px; margin: 0 auto; padding: 120px 70px; }
.gigs__title { font-size: 40px; }
.gig-card { display: grid; grid-template-columns: 2fr 1fr; gap: 30px; align-items: center; padding: 40px; border-top: 1px solid rgba(210, 210, 210, 0.16); border-bottom: 1px solid rgba(210, 210, 210, 0.16); background: rgba(23, 23, 23, 0.57); }
.gig-card + .gig-card { margin-top: 20px; }
.gig-card__date { font-size: 40px; line-height: 60px; text-transform: none; margin: 0; color: #fff; }
.gig-card__event h4 { font-size: 25px; line-height: 32px; margin: 0; color: #fff; text-transform: none; }
.gig-card__event p { margin: 8px 0 0; }
.gigs__none { text-align: center; font-size: 21px; }
@media (max-width: 1024px) { .gig-card { padding: 30px; grid-template-columns: 3fr 2fr; } }
@media (max-width: 767px) {
  .gigs__inner { padding: 60px 0; } .gigs__title { font-size: 28px; }
  .gig-card { grid-template-columns: 1fr; gap: 10px; padding: 20px 15px; text-align: center; }
  .gig-card__date { font-size: 26px; line-height: 36px; } .gig-card__event h4 { font-size: 18px; }
}

/* ---------- Home: contact ---------- */
.contact { --bg-opacity: .4; color: #fff; }
.contact__inner { max-width: 850px; margin: 0 auto; padding: 160px 40px; }
.contact__title { letter-spacing: 0.08em; }
.contact__call { text-align: center; padding: 5px; background: rgba(129, 30, 133, 0.76); font-size: 24px; margin-bottom: 0; }
.contact__call a { color: #fff; }
@media (max-width: 1024px) { .contact__inner { padding: 100px 40px; } }
@media (max-width: 767px) { .contact__inner { padding: 80px 30px; } .contact__call { font-size: 20px; } }
.contact-form { margin-top: 0; }
.contact-form p { margin-bottom: 1em; }
.contact-form label { display: block; }
.contact-form input[type=text], .contact-form input[type=email], .contact-form input[type=tel] { width: 66%; background: #fafafa; color: #000; }
.contact-form textarea { width: 100%; background: #fafafa; color: #000; }
.contact-form input:focus, .contact-form textarea:focus { background: #fff; color: #000; }
.contact-form .cf-hp { position: absolute; left: -9999px; }
.contact-form .cf-turnstile { margin-bottom: 1em; }
.cf-status:empty { display: none; }
@media (max-width: 767px) { .contact-form input[type=text], .contact-form input[type=email], .contact-form input[type=tel] { width: 100%; } }

/* Social icons band */
.social { display: flex; justify-content: center; gap: 30px; padding: 30px 0; background: var(--plum); }
.social a { display: inline-flex; padding: 15px; border-radius: 50%; background: #0d0d0d; color: #fff; font-size: 17px; }
.social__ig:hover, .social__ig:focus { background: #E43C90; color: #fff; }
.social__fb:hover, .social__fb:focus { background: #007cf7; color: #fff; }
.social__yt:hover, .social__yt:focus { background: #f00; color: #fff; }

/* Footer + back to top */
.inside-site-info { justify-content: center; text-align: center; }
.generate-back-to-top { width: 40px; height: 40px; padding: 0; border-radius: 50%; display: flex; align-items: center; justify-content: center; line-height: 1; }

/* ---------- Member page ---------- */
.member { max-width: 1300px; margin: 0 auto; padding: 64px calc(2em + 40px) 80px; }
.member__top { display: grid; grid-template-columns: 1fr 2fr; gap: 20px; }
.member__photo img { width: 100%; height: auto; vertical-align: middle; }
.member__pepeha p { margin-bottom: 1em; }
.member__name { font-size: 40px; text-transform: none; margin: 20px 0; color: #fff; }
.member__name span { color: var(--purple); }
.member__body { margin-top: 0; }
.member__profile { margin-top: 0; }
@media (max-width: 767px) { .member { padding: 40px calc(2em + 30px) 60px; } .member__top { grid-template-columns: 1fr; } .member__name { font-size: 32px; } }

/* ---------- Archives + simple pages ---------- */
.archive { max-width: 1300px; margin: 0 auto; padding: 30px 5% 60px; }
.archive__title { text-transform: none; }
.gig-list { display: grid; row-gap: 40px; padding-top: 0; }
.gig-item h2 { font-size: 24px; text-transform: none; margin-bottom: 5px; color: #fff; }
@media (max-width: 767px) { .archive { padding: 30px 20px 40px; } .gig-item h2 { font-size: 22px; } }

.members-archive { max-width: 1300px; margin: 0 auto; padding: 60px 0 120px; }
.members-archive__intro { max-width: 66%; margin: 0 auto; padding: 0 120px; }
.members-archive__intro h1 { text-transform: none; margin-bottom: 20px; }
.members-archive__intro p { margin: 0; }
.member-grid--archive { justify-content: center; padding: 120px 120px 0; row-gap: 20px; align-items: flex-start; }
.member-card--square .member-card__photo { width: 188px; margin-bottom: 0; }
.member-card--square .member-card__photo img { border-radius: 0; }
.member-card--square .member-card__name { margin-top: 0; }
@media (max-width: 1024px) { .members-archive__intro { max-width: none; padding: 0 30px; } .member-grid--archive { padding: 80px 30px 0; } .member-card { width: 33.33%; } }
@media (max-width: 767px) { .member-grid--archive { padding: 40px 5px 0; } .member-card--square { width: 50%; padding: 10px; } .member-card--square .member-card__photo { width: 100%; } }

.repertoire { max-width: 750px; margin: 0 auto; padding: 50px 20px 80px; }
.repertoire .section-title { text-align: left; text-transform: none; margin-bottom: 20px; }
.repertoire__box { background: var(--plum); }
.repertoire__intro { padding: 5% 5% 1%; }
.repertoire__table { padding: 5%; }
.repertoire__search { text-align: right; }
.repertoire__search input { width: auto; max-width: 60%; padding: 4px 8px; background: #fff; color: #000; }
table.repertoire { width: 100%; border-collapse: collapse; background: #fff; color: #111; font-size: 15px; margin: 0; border: 1px solid #ccc; }
table.repertoire th, table.repertoire td { padding: 8px; text-align: left; border: 0; border-top: 1px solid #ddd; }
table.repertoire th { background: #d9edf7; padding: 0; }
table.repertoire th button { display: flex; width: 100%; justify-content: space-between; align-items: center; background: none; color: #111; font-weight: 700; padding: 8px; font-size: 15px; }
table.repertoire th button svg { opacity: .35; font-size: 10px; }
table.repertoire th[aria-sort] button svg { opacity: 1; }
table.repertoire th[aria-sort=ascending] button svg { transform: rotate(180deg); }
table.repertoire tbody tr:nth-child(odd) { background: #f9f9f9; }
table.repertoire tbody tr:hover { background: #f3f3f3; }

.page-article { max-width: 1300px; margin: 0 auto; padding: 40px 40px 60px; }
.page-article h1 { text-transform: none; }
.page-article h2 { font-size: 28px; margin-top: 1.5em; }
.button-blue { display: inline-flex; align-items: center; column-gap: .5em; background: #215bc2; color: #fff; padding: 1rem 2rem; text-decoration: none; }
.button-blue:hover, .button-blue:focus { background: #1a4a9b; color: #fff; text-decoration: none; }
@media (max-width: 767px) { .page-article { padding: 30px 20px 40px; } }