:root {
	--ow-black: #050505;
	--ow-panel: #111;
	--ow-yellow: #f2df00;
	--ow-white: #f4f1e8;
	--ow-gray: #b7b7b2;
	--ow-line: rgba(242, 223, 0, 0.28);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body.oneway-artist-page {
	margin: 0;
	background: var(--ow-black);
	color: var(--ow-white);
	font-family: Arial, Helvetica, sans-serif;
	line-height: 1.65;
}

.oneway-artist-page a { color: inherit; }
.content-width { width: min(1180px, calc(100% - 2rem)); margin-inline: auto; }

.skip-link {
	position: fixed;
	top: .5rem;
	left: .5rem;
	z-index: 100;
	transform: translateY(-150%);
	background: var(--ow-yellow);
	color: #000 !important;
	padding: .65rem 1rem;
}
.skip-link:focus { transform: translateY(0); }

.site-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: .85rem max(1rem, calc((100vw - 1180px) / 2));
	border-bottom: 1px solid var(--ow-line);
	background: rgba(5,5,5,.97);
}
.oneway-mark {
	color: var(--ow-yellow) !important;
	font-weight: 900;
	letter-spacing: .1em;
	text-decoration: none;
}
.site-bar nav { display: flex; flex-wrap: wrap; gap: 1rem; }
.site-bar nav a {
	color: var(--ow-gray);
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-decoration: none;
	text-transform: uppercase;
}
.site-bar nav a:hover, .site-bar nav a:focus-visible { color: var(--ow-yellow); }

.artist-hero {
	position: relative;
	display: grid;
	align-items: end;
	min-height: min(78vh, 820px);
	overflow: hidden;
}
.artist-hero-image {
	position: absolute;
	inset: 0;
	background-position: center;
	background-size: cover;
}
.artist-hero-shade {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(0,0,0,.94), rgba(0,0,0,.46) 62%, rgba(0,0,0,.18)), linear-gradient(0deg, #050505, transparent 55%);
}
.artist-hero-copy { position: relative; z-index: 1; padding: 5rem 0; }
.eyebrow, .section-kicker, .archive-date {
	margin: 0 0 .65rem;
	color: var(--ow-yellow);
	font-size: .78rem;
	font-weight: 900;
	letter-spacing: .16em;
	text-transform: uppercase;
}
.artist-hero h1, .story-section h2, .release-section h2, .track-section h2, .video-section h2, .gallery-section h2 {
	margin: 0;
	font-family: Impact, "Arial Black", sans-serif;
	font-weight: 900;
	letter-spacing: .02em;
	line-height: .95;
	text-transform: uppercase;
}
.artist-hero h1 { color: var(--ow-yellow); font-size: clamp(4rem, 12vw, 10rem); text-shadow: .06em .06em 0 #000; }
.artist-deck { max-width: 720px; margin: 1rem 0 1.6rem; font-size: clamp(1rem, 2vw, 1.25rem); }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.button {
	display: inline-block;
	border: 2px solid var(--ow-yellow);
	padding: .75rem 1.1rem;
	color: var(--ow-yellow) !important;
	font-size: .8rem;
	font-weight: 900;
	letter-spacing: .07em;
	text-decoration: none;
	text-transform: uppercase;
}
.button.primary, .button:hover, .button:focus-visible { background: var(--ow-yellow); color: #000 !important; }

.identity-strip { border-block: 1px solid var(--ow-line); background: #0d0d0d; }
.identity-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.identity-grid > div { padding: 1.35rem; border-right: 1px solid var(--ow-line); }
.identity-grid > div:last-child { border-right: 0; }
.identity-grid span { display: block; color: var(--ow-yellow); font-weight: 900; text-transform: uppercase; }
.identity-grid small { display: block; color: var(--ow-gray); line-height: 1.35; }

.story-section, .track-section, .video-section, .gallery-section, .archive-notes { padding: 5rem 0; }
.story-heading, .section-heading-inline { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; }
.story-heading h2, .release-section h2, .track-section h2, .video-section h2, .gallery-section h2 { font-size: clamp(2.4rem, 6vw, 5.5rem); }
.story-heading img { width: min(300px, 30vw); height: auto; }
.story-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(280px, .55fr); gap: clamp(2rem, 6vw, 5rem); align-items: start; }
.story-copy { color: #d3d0c8; font-size: 1.05rem; }
.story-copy p:first-child { margin-top: 0; }
.story-figure { margin: 0; position: sticky; top: 1.5rem; }
.story-figure img { display: block; width: 100%; height: auto; border: 1px solid var(--ow-line); }
.story-figure figcaption { margin-top: .65rem; color: var(--ow-gray); font-size: .8rem; }

.release-section { padding: 5rem 0; background: var(--ow-yellow); color: #050505; }
.release-grid { display: grid; grid-template-columns: minmax(220px, 390px) minmax(0, 1fr); gap: clamp(2rem, 7vw, 6rem); align-items: center; }
.release-cover img { display: block; width: 100%; box-shadow: 1rem 1rem 0 rgba(0,0,0,.2); }
.release-section .section-kicker { color: #050505; }
.release-copy p:not(.section-kicker) { max-width: 650px; font-size: 1.05rem; }
.release-section .button { border-color: #050505; background: #050505; color: var(--ow-yellow) !important; }

.track-list { columns: 2; column-gap: 4rem; margin: 2rem 0 0; padding-left: 2.2rem; color: #d3d0c8; }
.track-list li { padding: .45rem .7rem; break-inside: avoid; border-bottom: 1px solid rgba(255,255,255,.08); }
.track-list li::marker { color: var(--ow-yellow); font-weight: 900; }

.section-heading-inline > p { max-width: 400px; margin: 0; color: var(--ow-gray); text-align: right; }
.video-frame { position: relative; aspect-ratio: 16 / 9; background: #000; border: 1px solid var(--ow-line); }
.video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.photo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 2rem; }
.photo-grid img { display: block; width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; border: 1px solid rgba(255,255,255,.1); }

.archive-notes details { border: 1px solid var(--ow-line); background: #0d0d0d; }
.archive-notes summary { cursor: pointer; padding: 1.25rem 1.5rem; color: var(--ow-yellow); font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.original-copy { padding: 0 1.5rem 1.5rem; color: var(--ow-gray); }

.oneway-footer { padding: 2.5rem 0; border-top: 1px solid var(--ow-line); background: #000; }
.footer-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.footer-grid strong { color: var(--ow-yellow); letter-spacing: .06em; text-transform: uppercase; }
.footer-grid p { margin: .35rem 0 0; color: var(--ow-gray); }

@media screen and (max-width: 780px) {
	.site-bar, .story-heading, .section-heading-inline { align-items: flex-start; flex-direction: column; }
	.identity-grid { grid-template-columns: 1fr 1fr; }
	.identity-grid > div:nth-child(2) { border-right: 0; }
	.identity-grid > div:nth-child(-n+2) { border-bottom: 1px solid var(--ow-line); }
	.story-grid, .release-grid { grid-template-columns: 1fr; }
	.story-figure { position: static; }
	.story-heading img { width: min(300px, 80vw); }
	.section-heading-inline > p { text-align: left; }
	.photo-grid { grid-template-columns: 1fr; }
	.footer-grid { grid-template-columns: 1fr; }
}

@media screen and (max-width: 520px) {
	.site-bar { align-items: flex-start; flex-direction: column; }
	.site-bar nav { gap: .45rem .9rem; }
	.artist-hero { min-height: 650px; }
	.artist-hero-image { background-position: 57% center; }
	.identity-grid { grid-template-columns: 1fr; }
	.identity-grid > div { border-right: 0; border-bottom: 1px solid var(--ow-line); }
	.track-list { columns: 1; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
