/**** HEADER ****//**** HEADER ****//**** HEADER ****/
.site-header {position: sticky; z-index: var(--z-header); top: 0px; height: var(--header-height); background: var(--paper); border-bottom: 1px solid var(--border-light); box-shadow: var(--shadow-header);}
.header-inner {display: flex; align-items: center; justify-content: space-between; height: 100%;}
.header-brand {display: flex; align-items: center; gap: 12px; min-height: var(--tap);}
.header-logo {width: 58px; height: 58px; object-fit: contain;}
.header-name {font-size: 15px; line-height: 1.25; font-weight: 700;}
.navigation-list {display: flex; align-items: center; gap: 32px;}
.navigation-list a {position: relative; display: flex; align-items: center; min-height: var(--tap); font-size: 16px; font-weight: 600; color: var(--graphite); transition: color var(--transition);}
.navigation-list a::after {position: absolute; right: 0px; bottom: 3px; left: 0px; height: 2px; content: ''; background: var(--cobalt); transform: scaleX(0); transform-origin: left; transition: transform var(--transition);}
.navigation-list a:hover, .navigation-list a[aria-current="page"] {color: var(--cobalt-dark);}
.navigation-list a:hover::after, .navigation-list a[aria-current="page"]::after {transform: scaleX(1);}
.menu-toggle {display: none; align-items: center; justify-content: center; width: var(--tap); height: var(--tap); color: var(--cobalt-dark);}
.menu-icon {display: flex; width: 28px; height: 28px;}
.menu-icon svg {width: 100%; height: 100%;}
.menu-icon-close {display: none;}

/**** BUTTONS ****//**** BUTTONS ****//**** BUTTONS ****/
.button-row {display: flex; flex-wrap: wrap; gap: 12px;}
.button {display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: var(--tap); padding: 14px 24px 14px 24px; font-size: 16px; line-height: 1.2; font-weight: 700; border: 2px solid transparent; border-radius: var(--radius-sm); transition: color var(--transition), background var(--transition), border-color var(--transition);}
.button-primary {color: var(--white); background: var(--cobalt); border-color: var(--cobalt);}
.button-primary:hover {background: var(--cobalt-dark); border-color: var(--cobalt-dark);}
.button-secondary {color: var(--cobalt-dark); background: transparent; border-color: var(--cobalt);}
.button-secondary:hover {color: var(--white); background: var(--cobalt-dark); border-color: var(--cobalt-dark);}
.text-link {display: inline-flex; align-items: center; gap: 9px; min-height: var(--tap); font-size: 16px; line-height: 1.35; font-weight: 700; color: var(--cobalt-dark);}
.text-link .icon {transition: transform var(--transition);}
.text-link:hover .icon {transform: translateX(4px);}
.back-link {display: inline-flex; align-items: center; gap: 10px; min-height: var(--tap); margin: 0px 0px 40px 0px; font-size: 16px; font-weight: 700; color: var(--cobalt-dark);}
.back-link .icon {transition: transform var(--transition);}
.back-link:hover .icon {transform: translateX(-4px);}

/**** PAGE INTRO ****//**** PAGE INTRO ****//**** PAGE INTRO ****/
.page-intro {position: relative; min-height: 430px; padding: 112px 0px 96px 0px; overflow: hidden; border-bottom: 1px solid var(--border-light);}
.page-intro-grid {display: grid; grid-template-columns: 3fr 9fr; gap: 48px; align-items: start;}
.page-intro-copy {position: relative; z-index: 2; max-width: 860px;}
.page-intro-copy h1 {margin: 0px 0px 28px 0px;}

/**** DECOR ****//**** DECOR ****//**** DECOR ****/
.decor-cluster {position: absolute; z-index: 0; pointer-events: none;}
.decor-item {position: absolute; width: 100%; height: 100%; object-fit: contain;}
.decor-cluster-ring {right: -170px; bottom: -240px; width: 520px; height: 520px; opacity: 0.24;}
.decor-cluster-air {top: -260px; right: -180px; width: 620px; height: 620px;}
.decor-cluster-air .decor-item-1 {opacity: 0.30;}
.decor-cluster-air .decor-item-2 {top: 230px; left: -100px; width: 280px; height: 280px; opacity: 0.48;}
.decor-cluster-rhythm {top: 18px; right: -90px; width: 300px; height: 300px;}
.decor-cluster-rhythm .decor-item-1 {top: 20px; left: 45px; opacity: 0.32;}
.decor-cluster-rhythm .decor-item-2 {top: 76px; left: -64px; width: 160px; height: 160px;}
.decor-cluster-anchor {right: -85px; bottom: -120px; width: 500px; height: 500px;}
.decor-cluster-anchor .decor-item-1 {right: -90px; bottom: -100px;}
.decor-cluster-anchor .decor-item-2 {top: 30px; left: 10px; width: 190px; height: 190px;}
.decor-cluster-anchor .decor-item-3 {top: 145px; left: 90px; width: 170px; height: 170px; opacity: 0.76;}
.decor-cluster-anchor .decor-item-4 {top: -80px; left: -90px; width: 390px; height: 390px; opacity: 0.32;}

/**** ALBUM CARD ****//**** ALBUM CARD ****//**** ALBUM CARD ****/
.album-grid {display: grid; grid-template-columns: repeat(3,minmax(0px,1fr)); gap: 28px;}
.album-card {min-width: 0px;}
.album-card-link {display: flex; flex-direction: column; height: 100%;}
.gallery-mat {display: flex; align-items: center; justify-content: center; overflow: hidden; background: var(--cool); border: 1px solid var(--border);}
.album-cover {min-height: 0px; aspect-ratio: 1 / 1; margin: 0px 0px 24px 0px; padding: 14px; overflow: hidden; background: var(--cool); border: 1px solid var(--border); transition: border-color var(--transition);}
.album-collage {display: grid; grid-template-columns: minmax(0px,1fr) minmax(0px,1fr); grid-template-rows: minmax(0px,1fr) minmax(0px,1fr); gap: 12px;}
.album-collage-tile {min-width: 0px; min-height: 0px;}
.album-collage-tile img {display: block; width: 100%; height: 100%; object-fit: contain;}
.album-card-link:hover .album-cover {border-color: var(--cobalt);}
.album-meta {margin: 0px 0px 10px 0px; font-size: 14px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--coral-dark);}
.album-title {margin: 0px 0px 12px 0px; font-size: 23px; line-height: 1.35; font-weight: 700;}
.album-count {margin: 0px 0px 18px 0px; font-size: 15px; color: var(--text-soft);}
.album-card .text-link {margin: auto 0px 0px 0px;}

/**** NEWS CARD ****//**** NEWS CARD ****//**** NEWS CARD ****/
.news-list {display: flex; flex-direction: column;}
.news-card {padding: 32px 0px 32px 0px; border-top: 1px solid var(--border);}
.news-card:last-child {border-bottom: 1px solid var(--border);}
.news-card-link {display: grid; grid-template-columns: 220px minmax(0px,1fr); gap: 44px; align-items: center;}
.poster-stage {display: flex; align-items: center; justify-content: center; overflow: hidden; background: var(--cool); border: 1px solid var(--border);}
.news-card-poster {aspect-ratio: 3 / 4; padding: 14px; transition: border-color var(--transition);}
.news-card-poster > img {width: 100%; height: 100%; object-fit: contain; box-shadow: var(--shadow-poster);}
.news-card-link:hover .news-card-poster {border-color: var(--cobalt);}
.news-card-content {display: flex; flex-direction: column; align-items: flex-start;}
.news-card-content time {margin: 0px 0px 14px 0px; font-size: 14px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--coral-dark);}
.news-card-title {max-width: 780px; margin: 0px 0px 12px 0px; font-size: 25px; line-height: 1.35; font-weight: 700;}
.news-card-anons {max-width: 760px; margin: 0px 0px 18px 0px; color: var(--text-soft);}
.poster-placeholder {position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 20px; color: var(--cobalt-dark); background: var(--cobalt-soft);}
.poster-placeholder-date {position: relative; z-index: 2; font-family: var(--font-display); font-size: 24px; line-height: 1.3; text-align: center; color: var(--coral-dark);}
.poster-placeholder img {position: absolute; right: -15px; bottom: -15px; width: 120px; height: 120px; object-fit: contain;}

/**** ACHIEVEMENT ****//**** ACHIEVEMENT ****//**** ACHIEVEMENT ****/
.achievement-band {position: relative; padding: 104px 0px 104px 0px; overflow: hidden; color: var(--white); background: var(--cobalt-dark);}
.achievement-band .eyebrow {color: var(--coral-soft);}
.achievement-grid {position: relative; z-index: 1; display: grid; grid-template-columns: 5fr 7fr; gap: 80px; align-items: start;}
.achievement-grid h2 {margin: 16px 0px 0px 0px;}
.achievement-copy > p + p {margin: 28px 0px 0px 0px;}
.achievement-mark {display: grid; grid-template-columns: auto 1fr; gap: 24px; align-items: center; padding: 24px 0px 0px 0px; font-family: var(--font-display); font-size: 30px; line-height: 1.15; color: var(--coral-soft); border-top: 1px solid var(--cobalt-soft);}
.achievement-mark span {font-family: var(--font-body); font-size: 16px; line-height: 1.5; font-weight: 600; color: var(--white);}

/**** DOCUMENTS ****//**** DOCUMENTS ****//**** DOCUMENTS ****/
.document-list {border-top: 1px solid var(--border);}
.document-row {display: grid; grid-template-columns: 28px minmax(0px,1fr) auto 28px; gap: 18px; align-items: center; min-height: 84px; padding: 18px 20px 18px 20px; background: var(--surface); border-bottom: 1px solid var(--border); transition: border-color var(--transition);}
.document-row:hover {border-color: var(--cobalt);}
.document-row .icon {color: var(--cobalt);}
.document-type {font-size: 15px; font-weight: 700; color: var(--text-soft);}
.attachment-list {border-top: 1px solid var(--border);}
.attachment-row {display: grid; grid-template-columns: 28px minmax(0px,1fr) auto 28px; gap: 18px; align-items: center; min-height: 76px; padding: 16px 18px 16px 18px; border-bottom: 1px solid var(--border);}

/**** LIGHTBOX ****//**** LIGHTBOX ****//**** LIGHTBOX ****/
.lightbox {position: fixed; z-index: var(--z-lightbox); inset: 0px; display: none; align-items: center; justify-content: center; padding: 24px; background: var(--black-overlay);}
.lightbox.open {display: flex;}
.lightbox-dialog {position: relative; display: grid; grid-template-rows: minmax(0px,1fr) auto auto; width: min(1180px,100%); max-height: calc(100vh - 48px); padding: 24px; background: var(--surface); border-radius: var(--radius-md); box-shadow: var(--shadow-dialog);}
.lightbox-close {position: absolute; z-index: 2; top: 14px; right: 14px; display: flex; align-items: center; justify-content: center; width: var(--tap); height: var(--tap); color: var(--white); background: var(--cobalt-dark); border-radius: 50%;}
.lightbox-stage {display: flex; align-items: center; justify-content: center; min-height: 0px; background: var(--cool);}
.lightbox-stage img {width: 100%; height: min(68vh,760px); object-fit: contain;}
.lightbox-stage video {display: none; width: 360px; max-width: 100%; max-height: min(68vh,640px); aspect-ratio: 360 / 640; object-fit: contain; background: var(--graphite);}
.lightbox[data-media-type="video"] .lightbox-stage img {display: none;}
.lightbox[data-media-type="video"] .lightbox-stage video {display: block;}
.lightbox-caption {padding: 18px 0px 14px 0px; font-size: 16px; text-align: center;}
.lightbox-controls {display: grid; grid-template-columns: 1fr auto 1fr; gap: 18px; align-items: center;}
.lightbox-control {display: inline-flex; align-items: center; gap: 8px; min-height: var(--tap); font-weight: 700; color: var(--cobalt-dark);}
.lightbox-control:last-child {justify-self: end;}
.lightbox-count {font-size: 15px; font-weight: 700; color: var(--text-soft);}

/**** FOOTER ****//**** FOOTER ****//**** FOOTER ****/
.site-footer {position: relative; padding: 80px 0px 36px 0px; overflow: hidden; color: var(--white); background: var(--cobalt-dark);}
.footer-grid {position: relative; z-index: 1; display: grid; grid-template-columns: 6fr 3fr 3fr; gap: 56px;}
.footer-brand {display: flex; align-items: center; gap: 18px; max-width: 440px; font-size: 22px; line-height: 1.3; font-weight: 700;}
.footer-logo-wrap {display: flex; align-items: center; justify-content: center; width: 84px; height: 84px; padding: 13px; flex: 0 0 84px; background: var(--white); border-radius: 50%;}
.footer-logo-wrap img {width: 100%; height: 100%; object-fit: contain;}
.footer-address {display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin: 28px 0px 0px 0px; font-size: 16px; color: var(--cobalt-soft);}
.footer-address a:hover, .footer-navigation a:hover, .footer-meta a:hover {color: var(--white); text-decoration: underline; text-underline-offset: 4px;}
.footer-social {display: inline-flex; align-items: center; gap: 9px; margin: 8px 0px 0px 0px;}
.footer-navigation {display: flex; flex-direction: column; align-items: flex-start; gap: 12px; font-size: 16px; font-weight: 600;}
.footer-meta {display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 32px; font-size: 15px; color: var(--cobalt-soft);}