:root { color-scheme: dark; --ink: #070707; --paper: #f5f1e8; --gold: #c99a46; --gold-light: #e3c078; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ink); color: var(--paper); font-family: Arial, Helvetica, sans-serif; }
a { color: inherit; text-decoration: none; }
.site-header { position: absolute; z-index: 5; inset: 0 0 auto; display: flex; align-items: flex-start; justify-content: space-between; gap: 3rem; padding: clamp(1.4rem, 3.2vw, 3.25rem) clamp(1.4rem, 5vw, 5.5rem); }
.brand { width: clamp(8.8rem, 13vw, 13rem); flex: 0 0 auto; }
.brand img { display: block; width: 100%; height: auto; }
.navigation { display: flex; align-items: center; justify-content: flex-end; gap: clamp(1rem, 2vw, 2.25rem); padding-top: .45rem; font-size: .72rem; line-height: 1; letter-spacing: .16em; text-transform: uppercase; }
.navigation a { opacity: .86; }
.navigation a[aria-current="page"] { color: var(--gold-light); opacity: 1; }
.instagram { width: 1.2rem; height: 1.2rem; border: 1px solid currentColor; border-radius: .33rem; position: relative; display: inline-block; }
.instagram::before { content: ""; position: absolute; width: .42rem; height: .42rem; inset: 50% auto auto 50%; transform: translate(-50%, -50%); border: 1px solid currentColor; border-radius: 50%; }
.instagram span { position: absolute; width: .14rem; height: .14rem; top: .22rem; right: .22rem; border-radius: 50%; background: currentColor; }
.series-hero { position: relative; min-height: 96vh; display: flex; align-items: flex-end; overflow: hidden; padding: clamp(10rem, 18vh, 13rem) clamp(1.4rem, 7vw, 7rem) clamp(4.5rem, 8vw, 7rem); }
.series-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 47%; }
.hero-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.42), rgba(0,0,0,.03) 38%, rgba(0,0,0,.92)); }
.hero-copy { position: relative; z-index: 1; }
.hero-copy p, .hero-copy span { display: block; margin: 0; color: var(--gold-light); font-size: .68rem; letter-spacing: .22em; text-transform: uppercase; }
h1 { margin: .75rem 0 1.1rem; font-family: Georgia, "Times New Roman", serif; font-size: clamp(3.2rem, 7vw, 7rem); font-weight: 400; line-height: .92; letter-spacing: -.045em; }
.scroll-mark { position: absolute; z-index: 2; bottom: clamp(2.1rem, 4vw, 3.7rem); left: 50%; width: 1.4rem; height: 3.4rem; transform: translateX(-50%); border-left: 1px solid var(--gold-light); }
.scroll-mark span::before, .scroll-mark span::after { content: ""; position: absolute; bottom: 0; left: -1px; width: .65rem; height: 1px; background: var(--gold-light); }
.scroll-mark span::before { transform: rotate(45deg); transform-origin: left center; }
.scroll-mark span::after { transform: rotate(135deg); transform-origin: left center; }
.gallery { padding: clamp(5rem, 10vw, 10rem) clamp(1.4rem, 7vw, 7rem); border-top: 1px solid rgba(201,154,70,.25); }
figure { margin: 0 0 clamp(6rem, 13vw, 13rem); }
figure img { display: block; width: 100%; height: auto; }
figcaption { display: flex; gap: 1.1rem; margin-top: 1rem; color: rgba(245,241,232,.78); font-family: Georgia, "Times New Roman", serif; font-size: clamp(1rem, 1.45vw, 1.3rem); }
figcaption span { color: var(--gold); font-family: Arial, Helvetica, sans-serif; font-size: .62rem; letter-spacing: .18em; padding-top: .35rem; }
.portrait { width: min(44rem, 68vw); }
.align-left { margin-right: auto; }
.align-right { margin-left: auto; }
.wide { width: min(100%, 88rem); margin-left: auto; margin-right: auto; }
.gallery-pair { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); align-items: start; gap: clamp(1.5rem, 6vw, 7rem); margin-bottom: clamp(6rem, 13vw, 13rem); }
.gallery-pair figure { width: 100%; margin: 0; }
.gallery-pair .lower { margin-top: clamp(4rem, 12vw, 12rem); }
.finale { width: min(50rem, 76vw); margin-left: auto; margin-right: auto; margin-bottom: 0; }
.series-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid rgba(201,154,70,.25); }
.series-links a { display: flex; flex-direction: column; gap: .9rem; min-height: 15rem; justify-content: center; padding: clamp(2rem, 6vw, 6rem); border-right: 1px solid rgba(201,154,70,.25); background: #090909; }
.series-links a:last-child { border-right: 0; }
.series-links small { color: var(--gold); font-size: .65rem; letter-spacing: .22em; text-transform: uppercase; }
.series-links strong { font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.8rem, 3vw, 3.2rem); font-weight: 400; }
.series-links strong span { color: var(--gold-light); }
.footer-bar { min-height: 5.25rem; display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 1.4rem clamp(1.4rem,4vw,4.5rem); border-top: 1px solid rgba(245,241,232,.14); background: #050505; color: rgba(245,241,232,.62); font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; }
.footer-bar p { margin: 0; }
@media (max-width: 760px) {
  .site-header { position: relative; flex-direction: column; border-bottom: 1px solid rgba(201,154,70,.25); background: #070707; }
  .navigation { justify-content: flex-start; flex-wrap: wrap; }
  .series-hero { min-height: 78vh; padding-top: 5rem; }
  .portrait, .finale { width: 100%; }
  .gallery-pair, .series-links { grid-template-columns: 1fr; }
  .gallery-pair .lower { margin-top: 4rem; }
  .series-links a { border-right: 0; border-bottom: 1px solid rgba(201,154,70,.25); }
  .footer-bar { align-items: flex-start; flex-direction: column; }
}
