.ser-head { position: relative; margin: 0; border-radius: 0; overflow: hidden; isolation: isolate; min-height: min(80svh, 900px); display: grid; align-items: end; color: var(--white); background: var(--char-900); }
.ser-head .media { position: absolute; inset: 0; z-index: -2; }
.ser-head .media img { width: 100%; height: 100%; object-fit: cover; filter: blur(28px) brightness(.5) saturate(1.1); transform: scale(1.15); }
/* 18 Oct: the artwork behind is colour only; its letters must never read behind the white words */
.ser-head::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(14, 16, 19, .2) 0%, rgba(14, 16, 19, .55) 55%, rgba(14, 16, 19, .78) 100%); }
.ser-head .inner { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); align-items: end; padding-block: calc(var(--nav-h) + var(--s-xl)) var(--s-xl); row-gap: var(--s-m); }
.ser-head .art { grid-column: 1 / 7; border-radius: var(--r-card); overflow: hidden; box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .7); }
.ser-head .txt { grid-column: 8 / 13; display: grid; gap: var(--s-s); justify-items: start; }
.ser-head .facts { display: flex; flex-wrap: wrap; gap: .4em 1.4em; color: rgba(255, 255, 255, .86); }
.hrow2 { display: grid; grid-template-columns: 4em 160px minmax(0, 1fr) auto 46px; gap: var(--gap); align-items: center; padding-block: var(--s-s); border-bottom: 1px solid var(--border); transition: padding var(--d-move) var(--ease); }
.hrow2:first-child { border-top: 1px solid var(--border); }
.hrow2 .n { font-size: var(--t-xl); font-weight: 500; letter-spacing: -.05em; color: var(--gold-700); }
.hrow2 .photo { aspect-ratio: 16 / 9; }
.hrow2 .t { font-size: var(--t-l); font-weight: 500; letter-spacing: -.02em; line-height: 1.15; }
.hrow2 .d { color: var(--muted); }
.hrow2 .icon-btn { border-color: rgba(18, 18, 18, .25); }
.hrow2:hover, .hrow2:focus-visible { padding-left: .6em; outline: none; }
.hrow2:hover .icon-btn { background: var(--gold-500); border-color: var(--gold-500); }
@media (max-width: 1024px) { .ser-head .art, .ser-head .txt { grid-column: 1 / -1; } .hrow2 { grid-template-columns: 96px minmax(0, 1fr); } .hrow2 .n, .hrow2 .icon-btn { display: none; } .hrow2 .photo { grid-row: 1 / 3; } }