.iwyw-page { --iwyw-magenta: #b50073; --iwyw-green: #357c30; --iwyw-ink: #120000; }
.iwyw-page .project-eyebrow { --eyebrow-left: 3.5rem; --eyebrow-right: 5rem; }

.iwyw-hero { padding: clamp(4.5rem, 7vw, 7rem) 0; background: var(--smoke); }
.iwyw-hero-inner { display: grid; grid-template-columns: minmax(22rem, 1.12fr) minmax(0, .88fr); gap: clamp(3rem, 8vw, 8rem); align-items: center; }
.iwyw-hero-art { position: relative; margin: 0; box-shadow: -7px 7px 0 var(--iwyw-magenta), 7px -7px 0 var(--iwyw-green); }
.iwyw-hero-art img { display: block; width: 100%; height: auto; }
.iwyw-hero-copy { min-width: 0; }
.iwyw-hero .project-eyebrow { color: var(--cloud); }
.iwyw-hero .project-eyebrow::before, .iwyw-hero .project-eyebrow::after { content: none; }
.iwyw-hero h1 { max-width: 8ch; margin: 0; color: var(--cloud); font-family: var(--font-display); font-size: clamp(4rem, 7vw, 6.8rem); font-weight: 700; letter-spacing: -.065em; line-height: .92; }
.iwyw-hero h1 span { color: var(--raz); }
.iwyw-hero .project-hero-intro { --intro-overhang: clamp(2rem, 4vw, 4rem); width: calc(100% + var(--intro-overhang)); max-width: 38rem; margin-left: calc(0px - var(--intro-overhang)); }

.iwyw-release-story { padding: clamp(5.5rem, 9vw, 8.5rem) 0; background: var(--cloud); }
.iwyw-release-story-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(20rem, .92fr); gap: clamp(3rem, 9vw, 9rem); align-items: center; }
.iwyw-timeline { display: grid; grid-template-columns: auto 1fr auto; gap: clamp(1rem, 3vw, 2.5rem); align-items: center; color: var(--pavement); }
.iwyw-timeline span, .iwyw-timeline strong { font-family: var(--font-display); font-size: clamp(3.8rem, 8vw, 7.5rem); font-weight: 700; letter-spacing: -.07em; line-height: .85; }
.iwyw-timeline span { color: var(--mist); -webkit-text-stroke: 2px var(--pavement); }
.iwyw-timeline strong { color: var(--raz); }
.iwyw-timeline i { color: var(--pavement); font-size: clamp(1.5rem, 3vw, 2.5rem); }
.iwyw-release-story .project-section-heading, .iwyw-release-story .project-copy { color: var(--pavement); }
.iwyw-release-story .project-section-heading { max-width: 12ch; }

.iwyw-artwork { padding: clamp(5.5rem, 9vw, 9rem) 0; background: var(--pavement); }
.iwyw-artwork-intro { display: grid; grid-template-columns: minmax(0, .85fr) minmax(24rem, 1.15fr); gap: clamp(3rem, 7vw, 7rem); align-items: end; }
.iwyw-artwork-intro .project-section-heading { max-width: 11ch; }
.iwyw-artwork-intro .project-copy { max-width: 44rem; margin: 0; }
.iwyw-artwork-composition { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(1.5rem, 3.5vw, 3.5rem); align-items: start; margin-top: clamp(4rem, 7vw, 6rem); }
.iwyw-artwork-reference { grid-column: 1 / span 4; margin: clamp(2rem, 6vw, 6rem) 0 0; }
.iwyw-artwork-reference img { display: block; width: 100%; height: auto; border: 1px solid rgba(232,232,232,.25); }
.iwyw-artwork-reference figcaption { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1rem; color: var(--mist); font-size: .7rem; font-weight: 700; letter-spacing: .11em; line-height: 1.4; text-transform: uppercase; }
.iwyw-artwork-reference figcaption i { flex: 0 0 auto; color: var(--raz); font-size: 1.15rem; }
.iwyw-artwork-cover { grid-column: 5 / -1; margin: 0; outline: 2px solid var(--raz); outline-offset: 7px; }
.iwyw-artwork-cover img { display: block; width: 100%; height: auto; }

.iwyw-release { padding: clamp(5rem, 8vw, 7rem) 0; background: var(--cloud); }
.iwyw-release-inner { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(18rem, .8fr); gap: clamp(3rem, 10vw, 9rem); align-items: end; }
.iwyw-release .project-section-heading { max-width: 8ch; color: var(--pavement); }
.iwyw-release .project-section-heading span { color: var(--raz); }
.iwyw-release-meta { display: grid; gap: 1.5rem; padding-bottom: .5rem; }
.iwyw-release-meta p { margin: 0; color: var(--pavement); font-size: clamp(1.05rem, 1.5vw, 1.25rem); }
.iwyw-release-links { display: flex; width: fit-content; max-width: 100%; flex-wrap: wrap; gap: 1rem 2.25rem; padding-top: .8rem; border-top: 1px solid var(--mist); }
.iwyw-listen-link { display: inline-flex; width: fit-content; align-items: center; gap: .5rem; color: var(--pavement); font-size: .82rem; font-weight: 700; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; transition: color 180ms ease; }
.iwyw-listen-link span { text-decoration: underline; text-underline-offset: .2em; }
.iwyw-listen-link i { display: inline-block; font-size: .68em; transition: transform 180ms ease; }
.iwyw-listen-link:hover, .iwyw-listen-link:focus-visible { color: var(--raz); }
.iwyw-listen-link:focus-visible { outline: 2px solid var(--raz); outline-offset: 4px; }
.iwyw-listen-link:hover i, .iwyw-listen-link:focus-visible i { transform: translate(2px, -2px); }

@media (max-width: 1000px) {
  .iwyw-hero-inner { grid-template-columns: minmax(20rem, 1fr) minmax(0, 1fr); gap: 3rem; }
  .iwyw-release-story-grid, .iwyw-artwork-intro { gap: 3rem; }
}

@media (max-width: 900px) {
  .iwyw-hero-inner, .iwyw-release-story-grid, .iwyw-artwork-intro, .iwyw-release-inner { grid-template-columns: minmax(0, 1fr); }
  .iwyw-hero-copy { grid-row: 1; }
  .iwyw-hero .project-hero-intro { width: auto; margin-left: 0; }
  .iwyw-hero-art { grid-row: 2; width: min(100%, 40rem); margin: 0 auto; }
  .iwyw-release-story-grid, .iwyw-artwork-intro, .iwyw-release-inner { gap: 2.75rem; }
  .iwyw-timeline { width: min(100%, 42rem); }
  .iwyw-release-story-copy { max-width: 42rem; }
  .iwyw-artwork-reference { grid-column: 1 / span 5; }
  .iwyw-artwork-cover { grid-column: 5 / -1; }
}

@media (max-width: 700px) {
  .iwyw-page .project-eyebrow { --eyebrow-left: 1.5rem; --eyebrow-right: 3rem; }
  .iwyw-hero, .iwyw-release-story, .iwyw-artwork, .iwyw-release { padding: 4rem 0; }
  .iwyw-hero h1 { font-size: clamp(3.55rem, 16vw, 5rem); }
  .iwyw-timeline { gap: 1rem; }
  .iwyw-timeline span, .iwyw-timeline strong { font-size: clamp(3.25rem, 18vw, 5.5rem); }
  .iwyw-artwork-composition { grid-template-columns: minmax(0, 1fr); margin-top: 3rem; }
  .iwyw-artwork-reference { grid-column: 1; width: min(68%, 20rem); margin: 0; }
  .iwyw-artwork-reference figcaption i { transform: rotate(90deg); }
  .iwyw-artwork-cover { grid-column: 1; width: calc(100% - 8px); margin: 1rem 0 0 auto; }
}

@media (max-width: 420px) {
  .iwyw-hero, .iwyw-release-story, .iwyw-artwork, .iwyw-release { padding: 3.25rem 0; }
  .iwyw-hero h1 { font-size: clamp(3.1rem, 15.5vw, 4rem); }
  .iwyw-hero-art { width: calc(100% - 8px); box-shadow: -4px 4px 0 var(--iwyw-magenta), 4px -4px 0 var(--iwyw-green); }
  .iwyw-timeline span { -webkit-text-stroke-width: 1px; }
  .iwyw-artwork-cover { outline-offset: 4px; }
}