/* IDENTITY SYSTEM — edit these tokens to adjust the current direction.
   Favicon colors are generated from --bg and --accent (six-digit hex).
   Monogram letters: content.json > site.monogram / site.microMonogram. */
:root {
  /* Dark and light surfaces */
  --bg: #0D1726;
  --surface: #142238;
  --paper: #EEF4FA;
  --accent: #8FB8FF;
  /* Text on dark / light surfaces */
  --text: #F4F7FB;
  --muted: #B7C4D3;
  --ink: #111A26;
  --light-muted: #59697A;
  --light-label: #4F6174;
  --contact-muted: #526579;
  /* Borders and subtle details */
  --line: #2A3B50;
  --light-line: #CBD7E3;
  --accent-line: #6F98D5;
  --button-line: #7FA5D8;
  --radius: 0px;
  --border-width: 1px;
  /* Typography */
  --font: Arial, Helvetica, sans-serif;
  --serif: Georgia, 'Times New Roman', serif;
  --monogram-font: var(--font);
  --monogram-weight: 700;
  --monogram-tracking: -.08em;
  /* Layout and main spacing */
  --max: 1280px;
  --gutter: clamp(24px, 5.4vw, 88px);
  --layout-gap: clamp(36px, 6vw, 92px);
  --section-space: 96px;
  --about-space: 110px;
  --project-space: 64px;
  --heading-space: 48px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 32px;
  --cover-size: 300px;
  --cover-ratio: 1;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:32px}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:1rem;line-height:1.65;-webkit-font-smoothing:antialiased}
body,button,a{-webkit-tap-highlight-color:transparent}
::selection{background:var(--accent);color:var(--bg)}
h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}
a{color:inherit;text-decoration:none;text-underline-offset:5px}
a:hover{text-decoration:underline}
button{font:inherit}
button,a{touch-action:manipulation}
a:focus-visible,button:focus-visible,audio:focus-visible,video:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
img,video{max-width:100%;display:block}
audio{width:100%;display:block}
[hidden]{display:none!important}
.shell{width:calc(100% - var(--gutter)*2);max-width:var(--max);margin-inline:auto}
.skip-link{position:absolute;z-index:5;left:24px;top:12px;background:var(--accent);color:var(--bg);padding:12px 20px;transform:translateY(-160%)}
.skip-link:focus{transform:translateY(0)}
.site-header{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:104px;border-bottom:1px solid var(--line)}
.monogram{font-family:var(--monogram-font);font-weight:var(--monogram-weight);letter-spacing:var(--monogram-tracking);font-style:normal;line-height:1}
.wordmark{display:inline-flex;align-items:center;min-height:44px;font-size:1.55rem;color:var(--accent)}
.wordmark:hover{text-decoration:none}

.primary-nav{display:flex;gap:clamp(22px,3vw,48px);margin-left:auto;margin-right:clamp(12px,5vw,80px)}
.primary-nav a{font-size:.9rem;padding-block:14px}
.languages{display:flex;align-items:center;gap:10px;font-size:.8rem}
.languages a{padding:12px 2px;color:var(--muted)}
.languages a[aria-current]{color:var(--accent)}
.languages span{color:#697366}
.eyebrow{font-size:.76rem;font-weight:500;letter-spacing:.12em;line-height:1.5;text-transform:uppercase;color:var(--accent)}
.hero{padding-top:60px;padding-bottom:0}
.hero-top{display:flex;align-items:center;justify-content:space-between}
.hero h1{font-size:clamp(4.2rem,11.15vw,10.3rem);line-height:1.06;font-weight:400;letter-spacing:-.072em;margin:37px 0 42px;white-space:nowrap}
.hero h1 span{font-family:"Avenir Next","Helvetica Neue",Helvetica,Arial,sans-serif;font-style:normal;font-weight:300;letter-spacing:-.075em;color:var(--accent)}
.hero-bottom{display:grid;grid-template-columns:1.3fr 1fr;gap:15%;padding-bottom:58px}
.hero-roles{font-size:clamp(1.2rem,1.7vw,1.6rem);line-height:1.5;max-width:580px}
.hero-intro{max-width:360px;justify-self:end}
.hero-intro>p{color:var(--muted);font-size:1rem;line-height:1.75;margin-bottom:16px}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:52px;background:var(--accent);color:var(--ink);padding:12px 22px;min-height:48px;font-size:.9rem;font-weight:600;border:1px solid var(--accent);transition:background .15s,color .15s}
.button:hover{background:var(--text);border-color:var(--text);text-decoration:none}
.hero .button{margin-top:30px}
.text-link{display:inline-flex;gap:24px;align-items:center;font-size:.9rem;padding-block:8px}
.text-link span{color:var(--accent);font-size:1.15rem}
.hero-baseline{border-block:1px solid var(--line);display:flex;justify-content:space-between;padding:15px 0;color:var(--muted);font-size:.76rem;letter-spacing:.02em}
.section{padding-block:var(--section-space)}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:48px;margin-bottom:var(--heading-space)}
.section-heading h2{font-size:clamp(2rem,3.4vw,3rem);line-height:1.2;font-weight:400;letter-spacing:-.035em;margin-top:18px}
.section-heading>p{font-size:1rem;color:var(--muted);max-width:300px}
.project-main{display:grid;grid-template-columns:minmax(0,var(--cover-size)) minmax(0,1fr);gap:var(--layout-gap);align-items:start}
.project+.project{margin-top:var(--project-space);padding-top:var(--project-space);border-top:var(--border-width) solid var(--line)}
.project-main>*{min-width:0}
.project-cover{min-width:0;width:100%;max-width:var(--cover-size)}
.cover-frame{width:100%;aspect-ratio:var(--cover-ratio);background:var(--bg);overflow:hidden;border-radius:var(--radius)}
.cover-frame img{width:100%;height:100%;object-fit:contain;object-position:50% 50%}
.project-cover figcaption{color:var(--muted);font-size:.8rem;margin-top:12px}
.cover-empty{display:grid;place-items:center;border:1px solid var(--line);color:var(--muted);font-size:.9rem}








.project-copy .eyebrow{margin-bottom:18px}
.project-copy h3{font-weight:400;font-size:clamp(1.85rem,3.2vw,2.9rem);letter-spacing:-.035em;line-height:1.13;max-width:470px}
.project-roles{color:var(--accent);font-size:.88rem;line-height:1.6;margin-top:18px}
.project-description{color:var(--muted);margin-top:24px;max-width:510px}
.credits{display:flex;flex-wrap:wrap;gap:18px 32px;border-top:1px solid var(--line);margin-top:30px;padding-top:22px}
dt{font-size:.76rem;color:var(--muted);margin-bottom:4px}
dd{font-size:.9rem}
.review{display:grid;grid-template-columns:40px 1fr;gap:22px;border-bottom:1px solid var(--line);padding:42px 0 36px;margin-top:8px}
.quote-mark{font:4.7rem/.8 var(--serif);color:var(--accent);margin-top:8px}
.review blockquote{font:italic clamp(1.4rem,2.6vw,2.1rem)/1.4 var(--serif);letter-spacing:-.02em}
.review figcaption{margin-top:18px;display:flex;align-items:baseline;gap:8px 18px;flex-wrap:wrap;font-size:.8rem;line-height:1.6}
.review figcaption strong{font-weight:400;color:var(--text)}
.review figcaption span{color:var(--muted);max-width:650px}
.quote-translation{font-size:.88rem;color:var(--muted);margin-top:10px}
.project-media{padding-top:26px}
.media-heading{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:20px}
.media-heading h4{font-size:.9rem;font-weight:400}
.media-heading p{font-size:.8rem;color:var(--muted)}
.media-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:16px;align-items:start;}
.media-empty{display:flex;align-items:center;gap:16px;padding:22px 18px;border:1px solid var(--line);min-width:0}
.media-index{font-size:.75rem;color:var(--muted);align-self:flex-start;padding-top:3px}
.media-empty h4{font-weight:400;font-size:.86rem;line-height:1.5}
.media-empty p{color:var(--muted);font-size:.76rem;margin-top:4px}
.empty-mark{margin-left:auto;color:var(--muted)}
.media-player{min-width:0;background:var(--surface);padding:22px}
.media-player h4{font-size:1rem;font-weight:400;margin-bottom:14px}
.media-caption,.production-photo figcaption{color:var(--muted);font-size:.8rem;margin-block:10px 14px}
.production-photo img{width:100%;height:auto}
.media-credit{display:block}
.transcript{display:inline-block;font-size:.85rem;text-decoration:underline;margin-top:12px}




.podcast-art 


.process{margin-top:22px}
.process h4{font-weight:400;color:var(--muted);font-size:.76rem;margin-bottom:8px}
.process ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:.8rem}
.process li::before{content:'—';color:var(--accent);margin-right:8px}
.original-music{margin-top:24px;padding-left:18px;border-left:2px solid var(--accent)}
.original-music h4{color:var(--accent);font-size:.8rem;font-weight:400;margin-bottom:6px}
.original-music p{color:var(--muted);font-size:.9rem}


.secondary-project .project-copy h3{font-size:clamp(1.7rem,2.5vw,2.2rem)}
.complementary-role{font-size:.88rem;color:var(--muted);margin-top:14px}


.services-section{background:var(--paper);color:var(--ink)}
.services-section .eyebrow{color:var(--light-label)}
.services-section .section-heading>p{color:var(--light-muted)}
.services-list{border-top:1px solid var(--light-line)}
.service{display:grid;grid-template-columns:38px 1fr 1.07fr;gap:30px;border-bottom:1px solid var(--light-line);padding:30px 0}
.service-number{font-size:.76rem;color:var(--light-label);line-height:2}
.service h3{font-size:clamp(1.2rem,2vw,1.7rem);font-weight:400;line-height:1.3;letter-spacing:-.025em;max-width:360px}
.service p{color:var(--light-muted);font-size:1rem;max-width:530px}
.service .service-tags{font-size:.75rem;letter-spacing:.06em;margin-top:16px;color:var(--light-label)}
.about-section{display:grid;grid-template-columns:1fr 1fr;gap:var(--layout-gap);padding-block:var(--about-space)}
.about-section h2{font-weight:400;font-size:clamp(2.2rem,4.5vw,4rem);line-height:1.12;letter-spacing:-.05em;margin-top:22px}
.about-signature{font-size:clamp(2.5rem,4.8vw,4rem);color:var(--accent);margin-top:40px}
.citizenship-note{font-size:.85rem!important;color:var(--muted)!important;margin-top:var(--space-md)}
.project-detail{margin-top:var(--space-md)}
.project-detail h4{font-size:.85rem;font-weight:400}
.project-detail p{color:var(--muted);font-size:.9rem}
.about-copy>p{font-size:1.1rem;line-height:1.8;color:var(--muted);margin-bottom:22px}
.about-copy>p:first-child{color:var(--text)}
.about-details{border-top:1px solid var(--line);padding-top:24px;margin-top:32px;display:grid;gap:18px}
.about-details dd{font-size:.95rem;max-width:440px}
.contact-section{background:var(--accent);color:var(--ink)}
.contact-section .eyebrow{color:var(--contact-muted)}
.contact-top{display:flex;justify-content:space-between;align-items:flex-end;gap:48px;margin-top:24px}
.contact-top h2{font-size:clamp(2.15rem,4.7vw,4.4rem);line-height:1.13;letter-spacing:-.05em;font-weight:400}
.contact-top>p{max-width:280px;color:var(--contact-muted);font-size:1rem}
.email-row{display:flex;gap:20px;justify-content:space-between;align-items:center;border-bottom:1px solid var(--accent-line);margin-top:54px;padding-bottom:22px}
.email-link{font-size:clamp(1.1rem,3.4vw,3rem);line-height:1.4;letter-spacing:-.035em;display:inline-flex;align-items:center;gap:36px;overflow-wrap:anywhere}
.email-link>span{font-size:.85em}
.copy-email{background:transparent;border:1px solid var(--button-line);border-radius:var(--radius);min-height:44px;padding:8px 16px;font-size:.85rem;color:var(--ink);cursor:pointer;flex-shrink:0}
.copy-email:hover{background:#1722170c}
.contact-section a:focus-visible,.contact-section button:focus-visible{outline-color:var(--ink)}
.copy-status{font-size:.85rem;min-height:30px;padding-top:6px}
.social-links{display:flex;gap:36px;flex-wrap:wrap;margin-top:10px;font-size:.9rem}
.social-pending{display:flex;align-items:baseline;gap:12px}
.social-pending small{font-size:.75rem;color:var(--contact-muted)}
.site-footer{display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:110px;font-size:.76rem;color:var(--muted)}
.site-footer a{display:inline-flex;gap:26px;align-items:center;min-height:44px}
.site-footer>span{color:var(--muted)}
.not-found{padding-block:20vh;max-width:850px}
.not-found h1{font-size:clamp(2rem,6vw,4.5rem);font-weight:400;line-height:1.2;margin-block:20px}
.not-found .button{margin-top:32px;margin-right:24px}
@media(min-width:1600px){.hero h1{font-size:10rem}}
@media(max-width:1000px){.media-grid{grid-template-columns:1fr}.media-heading{display:block}.media-heading p{margin-top:6px}.media-empty{padding:18px}.service{grid-template-columns:26px 1fr 1.1fr;gap:20px}.contact-top>p{max-width:220px}.hero-bottom{gap:8%}.project-description{font-size:.95rem}}
@media(max-width:720px){
  :root{--gutter:24px;--section-space:64px;--about-space:64px;--project-space:44px;--heading-space:32px;--cover-size:240px}
  .site-header{flex-wrap:wrap;min-height:0;padding-block:20px 0;gap:10px 20px}.wordmark{font-size:1.4rem}.languages{margin-left:auto}.primary-nav{order:3;width:100%;justify-content:space-between;margin:0;gap:12px}.primary-nav a{font-size:.84rem;padding-block:14px}
  .hero{padding-top:36px}.hero h1{white-space:normal;font-size:clamp(4.2rem,14.3vw,6.4rem);margin:30px 0;line-height:1.02}.hero h1 span{display:block}.hero-bottom{grid-template-columns:1fr;gap:28px;padding-bottom:36px}.hero-roles{font-size:1.22rem;max-width:430px}.hero-intro{justify-self:start;max-width:480px}.hero .button{margin-top:24px}.hero-baseline{font-size:.75rem;gap:20px}
  .section-heading{display:block;margin-bottom:32px}.section-heading h2{margin-top:14px;font-size:2.1rem}.section-heading>p{margin-top:16px;max-width:420px}.project-main{grid-template-columns:1fr;gap:30px}.project-copy h3{font-size:2rem;max-width:450px}.project-copy .eyebrow{margin-bottom:14px}.project-description{font-size:1rem;margin-top:18px}.credits{gap:16px 30px;margin-top:24px;padding-top:18px}.review{padding-block:30px;grid-template-columns:24px 1fr;gap:14px;margin-top:12px}.review blockquote{font-size:1.45rem}.quote-mark{font-size:3.7rem}.review figcaption{display:block}.review figcaption span{display:block;margin-top:6px}.media-heading p{max-width:400px}
  .service{grid-template-columns:26px 1fr;gap:12px 16px;padding-block:26px}.service h3{font-size:1.45rem;max-width:none}.service>div{grid-column:2}.service .service-tags{font-size:.75rem;letter-spacing:.04em}
  .about-section{grid-template-columns:1fr;gap:30px}.about-section h2{font-size:2.75rem}.about-signature{display:none}.about-copy>p{font-size:1rem}.about-details{margin-top:26px}.contact-top{display:block;margin-top:20px}.contact-top h2{font-size:clamp(2.2rem,7.5vw,3.3rem)}.contact-top>p{max-width:340px;margin-top:24px}.email-row{align-items:flex-start;flex-direction:column;margin-top:32px;padding-bottom:22px;gap:20px}.email-link{font-size:clamp(1.2rem,5.1vw,2.1rem);gap:18px}.copy-email{font-size:.85rem}.social-links{gap:18px 30px}.social-pending{flex-direction:column;gap:0}.site-footer{flex-wrap:wrap;gap:4px 16px;padding-block:26px}.site-footer>a{margin-left:auto}.site-footer>span{width:100%;order:3}
}
@media(max-width:360px){:root{--gutter:18px}.primary-nav{gap:8px}.primary-nav a{font-size:.8rem}.hero h1{font-size:4rem}.credits{gap:16px 22px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
@media print{body{background:white;color:#111}.hero,.section{padding-block:24px}.site-header,.hero .button,.hero-intro .text-link,.project-art,.media-empty,.copy-email,.copy-status,.social-pending,.site-footer a,.languages{display:none!important}.project-main,.about-section{display:block}.eyebrow,.project-roles,.hero h1 span,.project-description,.about-copy>p,.review figcaption span,dt{color:#333}.services-section,.contact-section{background:white}.shell{width:100%}.hero h1{font-size:4rem}.project,.service{break-inside:avoid}.email-link{font-size:1.5rem}}
