/* Inner pages: Music, release page, Videos, About, Shows, Contact, Privacy. Shared parts live in ginobla.css. */

/* Page header: big title and a short intro under a solid top bar */
.page-head { padding: clamp(56px, 9vw, 120px) 0 var(--s-8); border-bottom: 1px solid var(--line); }
.page-head .mega, .page-head .h1 { margin: 0; }
.page-intro { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s-6); flex-wrap: wrap; margin-top: var(--s-7); }
.page-intro .lead { margin: 0; }
.page-intro .actions { display: flex; flex-wrap: wrap; gap: var(--s-3); }

.section-title { margin: 0 0 var(--s-7); }
.block + .block { border-top: 1px solid var(--line); }

/* Music: all releases as a grid of cards */
.release-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--s-5); list-style: none; margin: 0; padding: 0; }
.listen-everywhere { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: var(--s-8); align-items: start; }
@media (max-width: 860px) { .listen-everywhere { grid-template-columns: 1fr; gap: var(--s-6); } }

/* Release page */
.release-page { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--s-8); align-items: start; }
.release-page .cover { position: sticky; top: 104px; aspect-ratio: 1; }
.release-page .kind { margin: 0 0 var(--s-3); color: var(--ash); font-weight: 600; }
.release-page .h1 { font-size: clamp(2.75rem, 6.5vw, 6.5rem); margin-bottom: var(--s-5); }
.release-page .platforms { margin-top: var(--s-7); max-width: none; }
.facts { display: grid; grid-template-columns: max-content 1fr; gap: var(--s-2) var(--s-5); margin: var(--s-6) 0 0; font-size: .9375rem; }
.facts dt { color: var(--ash); }
.facts dd { margin: 0; font-weight: 600; }
.embed { margin-top: var(--s-7); }
.embed iframe { display: block; width: 100%; height: 352px; border: 0; border-radius: 12px; background: var(--night-2); }
@media (max-width: 860px) { .release-page { grid-template-columns: 1fr; gap: var(--s-6); } .release-page .cover { position: relative; top: 0; } }

/* Videos page */
.video-feature .frame { aspect-ratio: 16 / 9; }
.video-feature .h3 { font-size: var(--t-h3); margin-top: var(--s-4); }
.video-feature .play { width: 72px; height: 72px; left: var(--s-5); bottom: var(--s-5); }
.video-feature .play svg { width: 26px; height: 26px; }

/* About page */
.story { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--s-8); align-items: start; }
.story .portrait { position: relative; aspect-ratio: 4 / 5; }
.story-text { display: grid; gap: var(--s-8); }
.story-part h2 { margin: 0 0 var(--s-4); }
.story-part p { margin: 0 0 var(--s-4); max-width: 36em; }
.to-come { color: var(--ash); font-style: italic; }
@media (min-width: 861px) { .story .portrait { position: sticky; top: 104px; } }
@media (max-width: 860px) { .story { grid-template-columns: 1fr; gap: var(--s-7); } }

.pillars { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-5); list-style: none; margin: 0; padding: 0; }
.pillars li { border-top: 2px solid var(--gold); padding-top: var(--s-5); }
.pillars .h3 { text-transform: uppercase; font-weight: 850; letter-spacing: -.02em; font-variation-settings: "wdth" var(--display-wdth); margin-bottom: var(--s-3); }
.pillars p { margin: 0; color: var(--ash); }
@media (max-width: 760px) { .pillars { grid-template-columns: 1fr; } }

/* Gallery: rows of photos at their own shape, never cropped. Each photo's width ÷ height comes in as --r;
   photos in a row share one height and together fill the width. --h is the height a row aims for. */
.gallery { --h: 380px; display: flex; flex-wrap: wrap; gap: var(--s-4); }
.gallery .shot { position: relative; --r: .8; flex: var(--r) 1 calc(var(--r) * var(--h)); aspect-ratio: var(--r); max-width: calc(var(--r) * var(--h) * 1.7); }
@media (max-width: 760px) { .gallery { --h: 210px; gap: var(--s-3); } }

.press { display: flex; justify-content: space-between; align-items: center; gap: var(--s-6); flex-wrap: wrap; padding: var(--s-7); border: 1px solid var(--line); background: var(--night-2); }
.press .h3 { margin-bottom: var(--s-2); }
.press p { margin: 0; color: var(--ash); max-width: 36em; }
.btn[aria-disabled="true"] { opacity: .45; pointer-events: none; }

/* Shows page */
.shows-empty { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: var(--s-8); align-items: start; padding: var(--s-7) 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.shows-empty .lead { margin: 0 0 var(--s-5); }
@media (max-width: 860px) { .shows-empty { grid-template-columns: 1fr; gap: var(--s-6); } }
.book-band { background: var(--red); color: var(--bone); }
.book-band .wrap { display: flex; justify-content: space-between; align-items: center; gap: var(--s-6); flex-wrap: wrap; padding-top: var(--s-8); padding-bottom: var(--s-8); }
.book-band .h2 { color: var(--bone); }

/* Contact page */
.contact { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: var(--s-9); align-items: start; }
.booking-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-5); }
.booking-form .full { grid-column: 1 / -1; }
.booking-form .consent { display: flex; gap: var(--s-3); align-items: flex-start; font-size: .9375rem; color: var(--ash); }
.booking-form .consent input { width: 20px; height: 20px; margin-top: 3px; accent-color: var(--gold); flex: none; }
.form-done { grid-column: 1 / -1; padding: var(--s-5); border: 1px solid var(--gold); color: var(--bone); }
@media (max-width: 860px) { .contact { grid-template-columns: 1fr; gap: var(--s-8); } }
@media (max-width: 560px) { .booking-form { grid-template-columns: 1fr; } }
.contact-side { display: grid; gap: var(--s-7); }
.contact-side h2 { margin: 0 0 var(--s-3); }
.contact-side p { margin: 0 0 var(--s-3); color: var(--ash); }
.contact-lines { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.contact-lines li { display: flex; justify-content: space-between; gap: var(--s-4); padding: var(--s-4) 0; border-bottom: 1px solid var(--line); }
.contact-lines span:first-child { color: var(--ash); }
.contact-lines span:last-child, .contact-lines a { font-weight: 600; text-align: right; }

/* Privacy page */
.legal-text { max-width: 44em; }
.legal-text h2 { font-size: var(--t-h3); font-weight: 700; margin: var(--s-8) 0 var(--s-3); }
.legal-text p, .legal-text li { color: var(--bone); }
.legal-text ul { padding-left: 1.2em; }
.legal-text li { margin-bottom: var(--s-2); }
.draft-note { padding: var(--s-4) var(--s-5); border-left: 3px solid var(--gold); background: var(--night-2); color: var(--ash); font-size: .9375rem; }
.booking-form .consent { flex-wrap: wrap; }
.consent .error { flex-basis: 100%; color: #FF8A7A; font-size: var(--t-small); }

/* Music page: the newest release opens the page, under a small page title */
.music-top { padding-top: clamp(40px, 6vw, 80px); }
.page-title { margin: 0 0 var(--s-6); font-size: var(--t-h3); font-weight: 700; color: var(--ash); }
.shows-alerts { margin-top: var(--s-7); max-width: 520px; }

/* Highlights list and real gallery photos (filled from the CMS) */
.highlights { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); max-width: 52em; }
.highlights li { padding: var(--s-4) 0; border-bottom: 1px solid var(--line); font-weight: 600; }
.gallery .shot { overflow: hidden; }
.gallery .shot img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Questions and answers (About page) */
.faq { margin: 0; border-top: 1px solid var(--line); max-width: 52em; }
.faq-item { padding: var(--s-5) 0; border-bottom: 1px solid var(--line); }
.faq dt { font-weight: 700; font-size: 1.125rem; margin-bottom: var(--s-2); }
.faq dd { margin: 0; color: var(--ash); }