:root {
  --ink:#152022; --night:#121718; --paper:#f5f3ef; --white:#fff;
  --teal:#346366; --silver:#b9c0bd; --amber:#d7b27a; --muted:#5f6968; --line:#d5d9d4;
  --space-1:.5rem; --space-2:1rem; --space-3:1.5rem; --space-4:2rem; --space-6:3rem;
  --space-8:4rem; --space-12:6rem; --radius-sm:6px; --radius-lg:18px;
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  color:var(--ink); background:var(--paper); font-synthesis:none;
}
* {box-sizing:border-box}
html {scroll-behavior:smooth;scroll-padding-top:1rem}
body {margin:0;font-size:1rem;line-height:1.8}
h1,h2,h3,p,dl,dd {margin:0}
h1,h2,h3 {line-height:1.3;overflow-wrap:anywhere;text-wrap:balance}
h2 {font-weight:500;font-size:clamp(1.9rem,3vw,2.8rem)}
p+p {margin-top:1rem}
a {color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible {outline:3px solid #b77a23;outline-offset:5px}
.hero a:focus-visible,.site-header a:focus-visible {outline-color:var(--amber)}
a,button {-webkit-tap-highlight-color:#d7b27a55}
img {display:block;max-width:100%;height:auto}
.wrap,.header-inner {width:min(90%,1320px);margin:auto}
.site-header {position:sticky;top:0;z-index:10;background:var(--night);color:var(--paper);border-bottom:1px solid #ffffff25}
.header-inner {min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:2rem}
.wordmark {font-weight:700;font-size:1.25rem;letter-spacing:.05em;white-space:nowrap}
nav {display:flex;gap:1.6rem;flex-wrap:wrap}
nav a {font-size:.875rem;min-height:44px;display:flex;align-items:center;border-bottom:2px solid transparent}
nav a:hover,nav a[aria-current] {color:var(--amber);border-color:var(--amber)}
.menu-toggle {display:none;background:none;color:inherit;border:1px solid #ffffff55;padding:.5rem .8rem;font:inherit;min-height:44px;min-width:80px;cursor:pointer}
.hero {background:var(--night);color:var(--paper);padding:3.8rem 0 3.4rem}
.eyebrow,.section-label {font-size:.875rem;font-weight:500;letter-spacing:.08em}
.hero .eyebrow {color:var(--silver)}
.hero-title {display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:2.3rem;border-bottom:1px solid #ffffff35}
.hero h1 {font-size:clamp(4rem,10.5vw,9.4rem);font-weight:650;letter-spacing:.01em;line-height:1.1}
.hero-title .eyebrow {padding-top:.7rem;max-width:11rem}
.hero-position h2 {font-size:clamp(1.7rem,2.7vw,2.6rem);font-weight:500;line-height:1.45}
.hero-position p {max-width:35rem;color:var(--silver);margin-top:1.3rem}
.hero-composition {display:grid;grid-template-columns:1fr 1.7fr;grid-template-areas:"position visual" "notes visual";align-items:center;gap:2rem 4rem;padding-top:2.8rem}
.hero-position {grid-area:position}
.hero-visual {grid-area:visual;width:100%;justify-self:center}
.hero-visual img {width:100%;object-fit:contain}
.hero-notes {grid-area:notes;display:flex;align-items:center;gap:2rem;border-top:1px solid #ffffff35;padding-top:1.3rem}
.hero-notes .section-label {color:var(--amber)}
.hero-notes>p {font-size:1.2rem;margin-top:.8rem}
.hero-notes dl {display:flex;gap:2rem;margin:0;white-space:nowrap}
.hero-notes dt {font-size:2.3rem;line-height:1.2;font-variant-numeric:tabular-nums;font-weight:300}
.hero-notes dd {font-size:.875rem;color:var(--silver)}
.service-links {display:flex;gap:2rem;align-items:center;margin-top:2rem}
.service-links a {min-height:48px;min-width:44px;display:inline-flex;align-items:center;border-bottom:1px solid var(--amber);color:var(--amber);font-weight:600}
.service-links a:hover {color:white}
.service-links a:active {background:#ffffff16}
.position-band {border-bottom:1px solid var(--line)}
.position-band .wrap {padding:2.2rem 0;display:grid;grid-template-columns:1fr 1.4fr;gap:5rem;align-items:center}
.position-band .eyebrow {font-size:1.15rem;color:var(--teal)}
.position-band p+p {margin:0;color:var(--muted)}
.picks-section {padding:6rem 0}
.section-heading {display:grid;grid-template-columns:1fr 1fr;gap:9%;align-items:end;margin-bottom:3rem}
.section-heading .eyebrow {color:var(--teal);margin-bottom:.8rem}
.section-heading>p {color:var(--muted);max-width:36rem}
.story-pair {border-top:1px solid var(--line);padding:2.2rem 0 3.5rem}
.pair-heading {display:flex;gap:1.5rem;align-items:baseline;margin-bottom:1.8rem}
.pair-number {color:var(--teal);font-size:1.4rem;font-variant-numeric:tabular-nums}
.pair-heading h3 {font-size:1.5rem;font-weight:500;display:inline}
.pair-heading p {font-size:.875rem;color:var(--muted);display:inline;margin-left:1.5rem}
.paired-works {display:grid;grid-template-columns:1fr 1fr;gap:3.5rem}
.feature-work {display:grid;grid-template-columns:minmax(130px,.72fr) 1fr;gap:1.5rem;align-items:start}
.feature-work.landscape-work {grid-template-columns:1fr}
.feature-work.landscape-work .poster-link {max-width:none}
.poster-link {display:block;position:relative;min-width:44px;min-height:44px;border:1px solid transparent;transition:border-color .18s,box-shadow .18s}
.poster-frame {display:block;overflow:hidden;background:#e3e5e1;aspect-ratio:5/7}
.poster-frame img {width:100%;height:100%;object-fit:contain;transition:transform .22s}
.poster-link:hover {border-color:var(--teal);box-shadow:0 6px 18px #1423231a}
.poster-link:hover img {transform:scale(1.025)}
.poster-link:active {outline:2px solid var(--teal);outline-offset:2px}
.episodes {position:absolute;right:.4rem;bottom:.4rem;background:#121718df;color:white;font-size:.8125rem;padding:.15rem .5rem;line-height:1.6}
.work-meta {font-size:.8125rem;line-height:1.6;color:var(--teal)}
.feature-copy h3 {font-size:1.6rem;font-weight:600;margin:.55rem 0 .9rem}
.feature-copy>p:not(.work-meta) {color:var(--muted);line-height:1.85}
.feature-copy .reading-note {margin-top:1rem;padding-top:.8rem;border-top:1px solid var(--line);color:var(--ink)!important;font-size:.875rem}
.collections-section {padding:5rem 0;background:#e9eeeb}
.theme-map {display:grid;grid-template-columns:repeat(3,1fr);background:var(--teal);color:var(--white);margin:2rem 0 3.5rem}
.theme-map article {padding:2rem;border-right:1px solid #ffffff40}
.theme-map article:last-child {border:0}
.theme-map .section-label {color:#e6ccaa}
.theme-map h3 {font-size:1.5rem;font-weight:500;margin:1rem 0}
.theme-map p {font-size:.9375rem;color:#e3ede9}
.theme-map .theme-titles {font-size:.8125rem;border-top:1px solid #ffffff30;padding-top:1rem;margin-top:1.5rem}
.catalog-chapter {margin-top:3.5rem}
.catalog-heading {display:flex;align-items:baseline;justify-content:space-between;gap:2rem;border-bottom:1px solid #8caaa1;padding-bottom:1rem}
.catalog-heading h3 {font-size:1.75rem;font-weight:500}
.catalog-heading p {font-size:.875rem;color:var(--muted)}
.compact-catalog {display:grid;grid-template-columns:1fr 1fr;gap:0 3rem}
.compact-work {display:grid;grid-template-columns:115px 1fr;gap:1.25rem;padding:1.8rem 0;border-bottom:1px solid #cbd4ce}
.compact-poster {align-self:start}
.compact-work h3 {font-size:1.25rem;margin:.35rem 0 .65rem}
.compact-work p:not(.work-meta) {font-size:.9375rem;line-height:1.8;color:#54615e}
.compact-work .cast {font-size:.8125rem!important}
.release-section {display:grid;grid-template-columns:.7fr 1.3fr;gap:8%;padding:5.5rem 0}
.release-intro .eyebrow {color:var(--teal);margin-bottom:1rem}
.release-intro>p:last-child {color:var(--muted);margin-top:1.5rem}
.release-list {list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.release-list li {display:grid;grid-template-columns:7rem 1fr;gap:2rem;padding:1.5rem 0;border-bottom:1px solid var(--line)}
.release-list time {font-size:.875rem;color:var(--teal);font-variant-numeric:tabular-nums}
.release-list h3 {font-size:1.2rem;margin-bottom:.6rem}
.release-list p {color:var(--muted)}
.release-list span {font-size:.8125rem;color:var(--muted)}
.service-section {padding:5rem 0;background:#1a2527;color:#f0f1ec}
.service-section .section-heading .eyebrow {color:var(--amber)}
.service-section .section-heading>p {color:#b7c4c1}
.access-columns {display:grid;grid-template-columns:repeat(3,1fr);gap:3rem;padding:1.5rem 0 3rem}
.access-columns article {border-top:1px solid #587073;padding-top:1rem}
.access-columns span {font-size:.875rem;color:var(--amber)}
.access-columns h3 {font-size:1.3rem;font-weight:500;margin:.7rem 0 1rem}
.access-columns p {color:#c1cbc6}
.faq-area {display:grid;grid-template-columns:.5fr 1.5fr;gap:5rem;padding-top:3rem;border-top:1px solid #587073}
.faq-area h2 {font-size:1.8rem}
.faq-area article {display:flex;gap:1.5rem;padding:1.2rem 0;border-bottom:1px solid #3a4e50}
.faq-area article:first-child {padding-top:0}
.faq-area article>span {font-size:.875rem;color:var(--amber)}
.faq-area h3 {font-size:1.1rem;font-weight:500;margin-bottom:.6rem}
.faq-area p {color:#bac6c2}
.brand-section {padding:6rem 0;display:grid;grid-template-columns:1fr 1fr;gap:10%}
.brand-section .eyebrow {color:var(--teal);margin-bottom:1rem}
.brand-section p {max-width:40rem;color:var(--muted)}
.brand-facts {margin-top:2rem;font-size:.875rem}
.brand-facts>div {display:grid;grid-template-columns:6rem 1fr;gap:1rem;padding:.6rem 0;border-top:1px solid var(--line)}
.brand-facts dt {color:var(--muted)}
footer {border-top:1px solid var(--line);padding:2rem 0}
footer .wrap {display:flex;justify-content:space-between;gap:2rem;font-size:.875rem}
section {scroll-margin-top:5rem}

/* STYLE_CONTRACT / D2: masthead, navigation and service links.
   Strong typography, exact alignment and structural space; no simulated controls. */
.hero-title {align-items:end;padding-bottom:var(--space-4)}
.hero-title .eyebrow {padding-bottom:.8rem;line-height:2}
.hero h1 {font-weight:700;letter-spacing:-.055em}
.hero-position h2 {letter-spacing:-.035em}
.hero-position p {font-size:.9375rem;line-height:1.95}
.hero-composition {column-gap:var(--space-8)}
.hero-notes dt {font-size:2.9rem;letter-spacing:-.055em;color:var(--paper)}
.hero-notes dl {gap:var(--space-4)}
.hero-notes .section-label {font-size:.8rem;max-width:7rem;line-height:1.9}
.hero-visual .poster-frame {border-radius:var(--radius-sm)}

/* D2: section headings and paired works. Unequal media proportions preserve
   each poster; hierarchy comes from type and rules rather than repeated cards. */
.section-heading h2 {font-size:clamp(2rem,3.9vw,3.5rem);letter-spacing:-.045em;font-weight:600;line-height:1.25}
.section-heading .eyebrow {display:flex;align-items:center;gap:.8rem}
.section-heading .eyebrow::before {content:"";width:1.5rem;height:2px;background:currentColor}
.story-pair {padding-top:var(--space-4);padding-bottom:var(--space-8)}
.pair-number {font-size:2.8rem;line-height:1;font-weight:300;letter-spacing:-.07em;min-width:3.1rem}
.pair-heading {gap:var(--space-3);margin-bottom:var(--space-4)}
.pair-heading h3 {font-weight:600;letter-spacing:-.025em}
.paired-works {gap:var(--space-6)}
.feature-copy h3 {letter-spacing:-.025em}
.reading-note {border-left:2px solid var(--teal);border-top:0!important;padding:.1rem 0 .1rem .85rem!important}
.poster-frame {border-radius:var(--radius-sm)}
.poster-link {border-radius:var(--radius-sm)}
.poster-link:focus-visible {outline:3px solid #b77a23;outline-offset:5px}

/* D6 + D2: thematic bento. One tall statement beside two concise statements;
   different spans reflect editorial weight, never pretend to be buttons. */
.theme-map {grid-template-columns:1.05fr 1fr;gap:1px;background:#668481;border:1px solid #668481;border-radius:var(--radius-lg);overflow:hidden}
.theme-map article {padding:var(--space-4) var(--space-6);border:0;background:var(--teal);min-width:0}
.theme-map article:first-child {grid-row:span 2;display:flex;flex-direction:column;justify-content:center;padding:var(--space-8) var(--space-6);background:#24494c}
.theme-map article:first-child h3 {font-size:clamp(2rem,3.1vw,2.9rem);max-width:10em;line-height:1.4;letter-spacing:-.035em}
.theme-map article:first-child .theme-titles {margin-top:var(--space-4)}
.theme-map article:not(:first-child) h3 {margin:.6rem 0;font-size:1.45rem}
.theme-map article:not(:first-child) .theme-titles {padding-top:.7rem;margin-top:1rem}

/* D2: catalog and release list. Image–metadata–copy align on a strict grid. */
.catalog-heading {padding-bottom:var(--space-3);border-color:#8ca39b}
.catalog-heading h3 {font-size:2rem;letter-spacing:-.035em}
.compact-work {padding:var(--space-4) 0;column-gap:var(--space-3)}
.compact-work h3 {letter-spacing:-.015em}
.release-list time {font-size:1rem;letter-spacing:.02em}
.release-intro h2 {font-size:clamp(2rem,3.4vw,3rem);letter-spacing:-.035em;font-weight:600}

/* D2: access, questions, brand facts and footer. Reading-first, fine dividers,
   a shared number column, controlled contrast, no decorative interaction. */
.access-columns article>span {font-size:2rem;font-weight:300;line-height:1.5}
.access-columns h3 {font-weight:600}
.faq-area article>span {min-width:1.5rem;font-variant-numeric:tabular-nums}
.brand-section h2 {font-size:clamp(2rem,3.6vw,3.2rem);font-weight:600;letter-spacing:-.04em}
.menu-toggle {border-radius:var(--radius-sm)}
.menu-toggle span {display:inline-block;transition:transform .18s}
.menu-toggle[aria-expanded="true"] span {transform:rotate(45deg)}
@media(max-width:1000px){
  nav {gap:.9rem}.hero-composition{grid-template-columns:1fr 1.2fr;gap:2.5rem;grid-template-areas:"position visual" "notes notes"}.hero-notes{display:flex;gap:3rem;align-items:center}.hero-notes>p,.hero-notes dl{margin:0}.paired-works{gap:2rem}.feature-work{grid-template-columns:1fr}.feature-work .poster-link{max-width:225px}.compact-work{grid-template-columns:95px 1fr}.theme-map article{padding:1.5rem}
}
@media(max-width:780px){
  .header-inner{flex-wrap:wrap;padding:.7rem 0;gap:.5rem}.header-inner nav{flex-basis:100%;gap:.25rem 1.4rem}.site-header.enhanced .menu-toggle{display:block}.site-header.enhanced nav{display:none}.site-header.enhanced.menu-open nav{display:flex}.hero-title{flex-direction:column-reverse;gap:1.2rem}.hero-title .eyebrow{max-width:none}.hero-title .eyebrow br{display:none}.hero h1{font-size:clamp(3.5rem,15vw,6rem)}.position-band .wrap{grid-template-columns:1fr;gap:1rem}.section-heading{grid-template-columns:1fr;gap:1.5rem}.picks-section{padding:3.5rem 0}.pair-heading{align-items:flex-start}.pair-heading h3,.pair-heading p{display:block}.pair-heading p{margin:.7rem 0 0}.theme-map{grid-template-columns:1fr}.theme-map article{border-right:0;border-bottom:1px solid #ffffff35}.theme-map .theme-titles{margin-top:1rem}.compact-catalog{grid-template-columns:1fr}.catalog-heading{display:block}.catalog-heading p{margin-top:.7rem}.release-section{grid-template-columns:1fr;gap:2rem}.access-columns{grid-template-columns:1fr;gap:2rem}.faq-area{grid-template-columns:1fr;gap:2rem}.brand-section{grid-template-columns:1fr;gap:2rem;padding:3.5rem 0}.service-section,.collections-section{padding:3.5rem 0}footer .wrap{flex-wrap:wrap;gap:.6rem 2rem}
}
@media(max-width:560px){
  .hero{padding:2.4rem 0 3rem}.hero-composition,.hero-lower{grid-template-columns:1fr;gap:2.5rem}.hero-composition{grid-template-areas:"position" "visual" "notes"}.hero-visual{max-width:none}.hero-notes{display:flex;justify-content:space-between;gap:1rem}.hero-notes .section-label{max-width:8rem}.hero-position h2{font-size:1.8rem}.hero-summary{padding-left:0;padding-top:2rem;border-left:0;border-top:1px solid #ffffff30}.paired-works{grid-template-columns:1fr;gap:2rem}.feature-work{grid-template-columns:112px 1fr;gap:1rem}.feature-copy h3{font-size:1.3rem}.feature-copy>p:not(.work-meta){font-size:.9375rem}.feature-copy .reading-note{grid-column:1/-1}.compact-work{grid-template-columns:92px 1fr;gap:1rem}.release-list li{grid-template-columns:1fr;gap:.5rem}.hero-summary h3{font-size:1.5rem}.hero-summary dl>div{grid-template-columns:5rem 1fr}.theme-map h3{font-size:1.35rem}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
@media(max-width:780px){
  .hero-title{align-items:start}.hero h1{letter-spacing:-.045em}
  .theme-map{grid-template-columns:1fr}.theme-map article:first-child{grid-row:auto;padding:var(--space-6) var(--space-4)}
  .theme-map article{padding:var(--space-4)}.theme-map article:first-child h3{font-size:2rem}
  .section-heading{margin-bottom:var(--space-4)}.pair-number{font-size:2.2rem;min-width:2.4rem}
}
@media(max-width:560px){
  .hero-notes dt{font-size:2.4rem}.hero-composition{gap:var(--space-4)}
  .feature-work.landscape-work{grid-template-columns:1fr}.feature-work.landscape-work .poster-link{max-width:none}
  .catalog-heading h3{font-size:1.7rem}
}