@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@300;400&family=Inter:wght@400;500;600&family=Instrument+Serif:ital@0;1&display=swap');
:root{--paper:#efede7;--ink:#11110f;--line:rgba(17,17,15,.22);--acid:#d9ff43;--serif:'Instrument Serif',Georgia,serif;--sans:Inter,Arial,sans-serif;--mono:'DM Mono',monospace}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);overflow-x:hidden}a{color:inherit;text-decoration:none}img{display:block;width:100%}button{font:inherit;color:inherit}.section-pad{padding:7rem clamp(1.25rem,4vw,4.75rem)}
.site-header{position:fixed;z-index:20;top:0;left:0;right:0;height:68px;padding:0 clamp(1.25rem,4vw,4.75rem);display:flex;align-items:center;justify-content:space-between;mix-blend-mode:difference;color:#fff}.brand{font-weight:600;letter-spacing:.06em}.nav{display:flex;gap:1.7rem;font:12px var(--mono);text-transform:uppercase}.nav a{opacity:.72}.nav a:hover{opacity:1}.menu-toggle{display:none;background:none;border:0;font:12px var(--mono)}
.hero{min-height:100svh;background:linear-gradient(90deg,rgba(8,8,7,.50) 0%,rgba(8,8,7,.22) 48%,rgba(8,8,7,.16) 100%),linear-gradient(180deg,rgba(8,8,7,.05) 45%,rgba(8,8,7,.55) 100%),url("assets/tolga-su-hero.webp") 50% 50%/cover no-repeat;color:#f2f0e9;position:relative;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}.hero-kicker{position:absolute;top:8rem;right:4.75rem;font:11px var(--mono);letter-spacing:.14em}.hero-title{font:400 clamp(6.2rem,19vw,18rem)/.66 var(--serif);letter-spacing:-.07em;margin:0;position:relative;z-index:1}.hero-title span{display:block}.hero-title span:last-child{margin-left:41vw;font-style:italic}.hero-foot{display:flex;justify-content:space-between;align-items:flex-end;border-top:1px solid rgba(255,255,255,.24);padding-top:1rem;margin-top:3rem;position:relative;z-index:1}.hero-foot p{max-width:510px;font-size:clamp(1rem,1.7vw,1.35rem);line-height:1.45}.circle-link{width:66px;height:66px;border:1px solid rgba(255,255,255,.5);border-radius:50%;display:grid;place-items:center;font-size:28px;transition:.25s}.circle-link:hover{background:var(--acid);color:#10110e;border-color:var(--acid)}
.grain{position:absolute;inset:-50%;opacity:.09;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");animation:grain .2s steps(2) infinite}@keyframes grain{0%{transform:translate(0)}25%{transform:translate(3%,-4%)}50%{transform:translate(-4%,2%)}75%{transform:translate(2%,4%)}100%{transform:translate(-3%,-2%)}}
.eyebrow{font:11px var(--mono);letter-spacing:.13em;border-bottom:1px solid var(--line);padding-bottom:.8rem;margin-bottom:4.5rem}.about-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:8vw}.display{font:400 clamp(4.2rem,8vw,8.4rem)/.78 var(--serif);letter-spacing:-.055em;margin:0}.display em,.contact-title em{font-weight:400}.about-copy{padding-top:.5rem}.about-copy p{max-width:620px;line-height:1.7;color:#3b3b36}.about-copy .lead{font-size:clamp(1.25rem,2.2vw,1.85rem);line-height:1.36;color:var(--ink)}.facts{margin-top:4rem}.facts div{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:1rem 0}.facts dt{font:10px var(--mono);letter-spacing:.12em;text-transform:uppercase}.facts dd{margin:0}
.work{background:#151613;color:#f2f0e9}.work .eyebrow{border-color:rgba(255,255,255,.2)}.project{display:grid;grid-template-columns:minmax(280px,44vw) 1fr;gap:5vw;align-items:end;margin-bottom:12rem}.project-right{grid-template-columns:1fr minmax(280px,38vw)}.project-right .project-image{order:2}.project-image{display:block;overflow:hidden;background:#222}.project-image img{aspect-ratio:3/4;object-fit:cover;filter:saturate(.72) contrast(1.04);transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .5s}.project-image:hover img{transform:scale(1.025);filter:saturate(1)}.project-meta span{font:10px var(--mono);letter-spacing:.14em;color:#b7b7ad}.project-meta h3{font:400 clamp(3.5rem,7vw,8rem)/.82 var(--serif);letter-spacing:-.04em;margin:1rem 0}.project-meta p{color:#b8b8b0}
.credits{border-top:1px solid var(--line)}.credit{display:grid;grid-template-columns:90px 1fr 220px;align-items:center;border-bottom:1px solid var(--line);padding:1.4rem 0;transition:padding .25s}.credit:hover{padding-left:1rem}.credit span,.credit small{font:10px var(--mono);letter-spacing:.08em}.credit strong{font:500 clamp(1.2rem,2.3vw,2rem)/1.1 var(--sans)}.credit small{text-align:right}.credit.muted{opacity:.52}.source-note{max-width:720px;margin:2rem 0 0 auto;font:10px/1.6 var(--mono);opacity:.62}
.gallery{background:#d6d3c9}.gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.gallery-card{position:relative;border:0;padding:0;background:none;cursor:zoom-in;overflow:hidden}.gallery-card img{aspect-ratio:16/10;object-fit:cover;filter:grayscale(1) contrast(1.05);transition:.5s}.gallery-card.tall img{aspect-ratio:4/5}.gallery-card:hover img{filter:grayscale(0);transform:scale(1.015)}.gallery-card span{position:absolute;left:1rem;bottom:1rem;background:var(--paper);padding:.55rem .7rem;font:9px var(--mono);letter-spacing:.08em}
.contact{background:var(--acid)}.contact-title{font:400 clamp(5.5rem,14vw,14rem)/.68 var(--serif);letter-spacing:-.06em;margin:0 0 5rem}.contact-row{display:grid;grid-template-columns:1fr 1fr;gap:2rem;border-top:1px solid rgba(17,17,15,.35);padding-top:1rem}.contact-row p{max-width:500px;margin:0}.contact-row a{font-size:clamp(1.2rem,2.5vw,2.25rem);text-align:right}.sources{display:flex;gap:1.25rem;justify-content:flex-end;margin-top:5rem;font:10px var(--mono);letter-spacing:.08em}.sources span{opacity:.55}.sources a{text-decoration:underline;text-underline-offset:4px}footer{display:flex;justify-content:space-between;padding:1.5rem clamp(1.25rem,4vw,4.75rem);background:#0f100d;color:#c9c8bf;font:10px var(--mono);letter-spacing:.1em}
.lightbox{width:min(92vw,900px);border:0;padding:0;background:#111;color:#fff}.lightbox::backdrop{background:rgba(0,0,0,.9)}.lightbox img{max-height:84vh;object-fit:contain}.close{position:fixed;top:1.5rem;right:2rem;border:1px solid rgba(255,255,255,.4);border-radius:999px;background:#111;color:#fff;padding:.7rem 1rem;font:10px var(--mono);cursor:pointer}.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}.reveal.in{opacity:1;transform:none}
@media(max-width:800px){.hero{background-position:57% 50%}.section-pad{padding:5.5rem 1.25rem}.site-header{padding:0 1.25rem}.menu-toggle{display:block}.nav{display:none;position:absolute;top:60px;left:1rem;right:1rem;padding:1.2rem;background:#111;color:#fff;flex-direction:column;mix-blend-mode:normal}.nav.open{display:flex}.hero-kicker{right:1.25rem}.hero-title{font-size:28vw}.hero-title span:last-child{margin-left:27vw}.hero-foot{align-items:center}.hero-foot p{max-width:75%;font-size:.95rem}.about-grid,.contact-row{grid-template-columns:1fr}.display{font-size:18vw}.project,.project-right{grid-template-columns:1fr;gap:1.7rem;margin-bottom:7rem}.project-right .project-image{order:0}.project-image img{aspect-ratio:4/5}.credit{grid-template-columns:52px 1fr}.credit small{display:none}.gallery-grid{grid-template-columns:1fr}.gallery-card.tall img,.gallery-card img{aspect-ratio:4/5}.contact-title{font-size:21vw}.contact-row a{text-align:left}.sources{justify-content:flex-start;flex-wrap:wrap}.hero-kicker{top:6.2rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.grain{animation:none}}

/* Responsive refinement v2 */
.about-grid > *, .project > *, .contact-row > *, .credit > * { min-width: 0; }
img { height: auto; }

@media (min-width: 801px) and (max-width: 1100px) {
  .section-pad { padding: 6rem 2.5rem; }
  .site-header { padding-inline: 2.5rem; }
  .hero { background-position: 40% 50%; }
  .hero-kicker { right: 2.5rem; }
  .hero-title { font-size: 17vw; }
  .hero-title span:last-child { margin-left: 36vw; }
  .about-grid { grid-template-columns: 1fr 1fr; gap: 5vw; }
  .display { font-size: 7.5vw; }
  .project { grid-template-columns: minmax(280px, 48vw) 1fr; gap: 3vw; }
  .project-right { grid-template-columns: 1fr minmax(280px, 44vw); }
  .project-meta h3 { font-size: 6vw; }
  .credit { grid-template-columns: 72px 1fr 160px; }
  .contact-title { font-size: 13vw; }
}

@media (max-width: 800px) {
  html { scroll-padding-top: 64px; }
  body { font-size: 15px; }
  .section-pad { padding: 4.75rem 1.25rem; }
  .site-header { height: 60px; padding: 0 1.25rem; mix-blend-mode: normal; background: linear-gradient(180deg,rgba(8,8,7,.72),rgba(8,8,7,0)); color: #fff; }
  .brand { font-size: 13px; }
  .menu-toggle { font-size: 10px; letter-spacing: .08em; padding: .75rem 0 .75rem 1rem; color: #fff; }
  .nav { position: fixed; top: 0; left: 0; right: 0; padding: 5.4rem 1.25rem 2rem; gap: 0; background: rgba(15,16,13,.97); border-bottom: 1px solid rgba(255,255,255,.16); box-shadow: 0 18px 44px rgba(0,0,0,.28); z-index: -1; }
  .nav.open { display: flex; }
  .nav a { padding: .9rem 0; border-top: 1px solid rgba(255,255,255,.14); font-size: 12px; opacity: 1; }
  body.menu-open { overflow: hidden; }

  .hero.section-pad { min-height: 100svh; padding: 5.5rem 1.25rem 2rem; justify-content: flex-end; background-position: 26% 50%; }
  .hero-kicker { top: 5.8rem; right: 1.25rem; font-size: 9px; letter-spacing: .13em; }
  .hero-title { width: 100%; font-size: clamp(5.6rem,28vw,7.15rem); line-height: .64; letter-spacing: -.065em; }
  .hero-title span:last-child { margin-left: 24vw; }
  .hero-foot { gap: 1rem; margin-top: 2.2rem; padding-top: .9rem; align-items: flex-end; }
  .hero-foot p { max-width: calc(100% - 72px); margin: 0; font-size: .92rem; line-height: 1.42; }
  .circle-link { flex: 0 0 58px; width: 58px; height: 58px; font-size: 24px; }

  .eyebrow { margin-bottom: 2.8rem; font-size: 9px; }
  .about-grid { gap: 2.6rem; }
  .display { font-size: clamp(4.1rem,18vw,5.4rem); line-height: .78; }
  .about-copy { padding-top: 0; }
  .about-copy .lead { font-size: 1.13rem; line-height: 1.4; }
  .about-copy p { line-height: 1.62; }
  .facts { margin-top: 2.7rem; }
  .facts div { padding: .9rem 0; gap: 1rem; }

  .work .eyebrow { margin-bottom: 3rem; }
  .project, .project-right { gap: 1.25rem; margin-bottom: 5.5rem; }
  .project:last-child { margin-bottom: 0; }
  .project-image img { aspect-ratio: 7 / 10; object-fit: cover; }
  .project-meta h3 { font-size: clamp(2.9rem,13vw,4.3rem); line-height: .84; margin: .65rem 0 .7rem; overflow-wrap: normal; }
  .project-meta p { margin: 0; font-size: .9rem; line-height: 1.45; }
  .project-meta span { font-size: 9px; }

  .credits { margin-top: -.25rem; }
  .credit { grid-template-columns: 46px minmax(0,1fr); gap: .55rem; padding: 1.1rem 0; }
  .credit:hover { padding-left: 0; }
  .credit span { font-size: 8px; }
  .credit strong { font-size: clamp(1rem,4.4vw,1.2rem); line-height: 1.2; }
  .source-note { margin-top: 1.6rem; font-size: 8px; line-height: 1.55; }

  .gallery-grid { gap: .85rem; }
  .gallery-card.tall img { aspect-ratio: 7 / 10; }
  .gallery-card:not(.tall) img { aspect-ratio: 16 / 10; }
  .gallery-card span { left: .7rem; bottom: .7rem; padding: .48rem .58rem; font-size: 8px; }

  .contact-title { font-size: clamp(4.7rem,20vw,6.5rem); line-height: .7; margin-bottom: 3.25rem; }
  .contact-row { gap: 1.35rem; }
  .contact-row p { line-height: 1.5; }
  .contact-row a { font-size: clamp(1.08rem,5vw,1.35rem); overflow-wrap: anywhere; }
  .sources { justify-content: flex-start; gap: .8rem 1rem; margin-top: 3.6rem; font-size: 8px; }
  footer { gap: 1rem; padding: 1.15rem 1.25rem; font-size: 8px; }
  .lightbox { width: calc(100vw - 1.5rem); max-width: none; }
  .close { top: .75rem; right: .75rem; }
}

@media (max-width: 420px) {
  .section-pad { padding: 4.35rem 1rem; }
  .site-header { padding-inline: 1rem; }
  .nav { padding-inline: 1rem; }
  .hero.section-pad { padding: 5.2rem 1rem 1.6rem; background-position: 26% 50%; }
  .hero-kicker { top: 5.2rem; right: 1rem; }
  .hero-title { font-size: 27.5vw; }
  .hero-title span:last-child { margin-left: 23vw; }
  .hero-foot { margin-top: 1.9rem; }
  .hero-foot p { font-size: .88rem; }
  .circle-link { flex-basis: 54px; width: 54px; height: 54px; }
  .display { font-size: 18.5vw; }
  .project-meta h3 { font-size: 12.5vw; }
  .contact-title { font-size: 20vw; }
  footer { padding-inline: 1rem; }
}

@media (max-width: 350px) {
  .hero-title { font-size: 26.5vw; }
  .hero-foot p { max-width: calc(100% - 60px); font-size: .82rem; }
  .circle-link { flex-basis: 50px; width: 50px; height: 50px; }
  .project-meta h3 { font-size: 11.8vw; }
  .contact-row a { font-size: 1rem; }
  footer { font-size: 7px; }
}

@media (max-width: 900px) and (orientation: landscape) {
  .hero.section-pad { min-height: 620px; background-position: 30% 48%; }
  .hero-title { font-size: clamp(5.2rem,17vw,8rem); }
  .hero-title span:last-child { margin-left: 30vw; }
  .hero-foot p { max-width: 62%; }
}

/* nameflip3 */
.hero{background:#0f100d;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:0;background:url("assets/tolga-su-hero.webp?v=20260916-nameflip3") 50% 50%/cover no-repeat;transform:scaleX(-1);transform-origin:center}
.hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(8,8,7,.66) 0%,rgba(8,8,7,.36) 43%,rgba(8,8,7,.12) 75%),linear-gradient(180deg,rgba(8,8,7,.04) 42%,rgba(8,8,7,.56) 100%);pointer-events:none}
.hero-kicker,.hero-title,.hero-foot{z-index:2}.grain{z-index:1}
.hero-title{font-size:clamp(5rem,13.5vw,13rem);line-height:.78;max-width:72vw}
.hero-title span:last-child{margin-left:18vw;font-size:.72em;letter-spacing:-.045em}
@media(max-width:800px){.hero::before{background-position:22% 50%}.hero-title{font-size:23vw;line-height:.84;max-width:84vw}.hero-title span:last-child{margin-left:8vw;font-size:.67em}.brand{font-size:.76rem;max-width:72%;line-height:1.08}.hero-foot p{max-width:72%;font-size:.9rem}}
@media(max-width:430px){.hero::before{background-position:22% 50%}.hero-title{font-size:22vw;max-width:88vw}.hero-title span:last-child{margin-left:6vw;font-size:.66em}}
@media(max-width:360px){.hero::before{background-position:20% 50%}.hero-title{font-size:20vw}.brand{font-size:.7rem}}


/* biography + career archive v4 */
.bio-note{padding:1rem 0 0;margin-top:1rem;border-top:1px solid var(--line);font:11px/1.65 var(--mono)!important;color:#55554f!important}
.archive{background:#ebe8df}
.archive-intro{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:end;margin-bottom:6rem}
.archive-intro h2{font:400 clamp(5rem,10vw,11rem)/.72 var(--serif);letter-spacing:-.055em;margin:0}.archive-intro h2 em{font-weight:400}
.archive-intro p{max-width:620px;margin:0 0 .5rem;line-height:1.65;color:#41413c}
.archive-groups{border-top:1px solid var(--line)}
.archive-group{display:grid;grid-template-columns:minmax(210px,.32fr) 1fr;border-bottom:1px solid var(--line);padding:3rem 0 4rem;gap:4vw}
.archive-head{display:flex;gap:1rem;align-items:flex-start;position:sticky;top:90px;align-self:start}.archive-head span{font:10px var(--mono);opacity:.55}.archive-head h3{font:500 clamp(1.1rem,2vw,1.65rem)/1.15 var(--sans);letter-spacing:-.02em;margin:0}
.archive-list{border-top:1px solid var(--line)}
.archive-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.5rem;align-items:center;padding:1.1rem 0;border-bottom:1px solid var(--line)}
.archive-item strong{display:block;font-size:clamp(1.05rem,1.7vw,1.4rem);font-weight:500;letter-spacing:-.02em}.archive-item p{margin:.35rem 0 0;color:#5c5c55;line-height:1.45;font-size:.9rem}
@media(max-width:800px){.archive-intro{grid-template-columns:1fr;gap:2rem;margin-bottom:4rem}.archive-intro h2{font-size:19vw}.archive-group{grid-template-columns:1fr;gap:1.2rem;padding:2.25rem 0 3rem}.archive-head{position:static}.archive-item{grid-template-columns:1fr;gap:.75rem}.archive-item .status{justify-self:start}.archive-item strong{font-size:1.08rem}.archive-item p{font-size:.86rem}.bio-note{font-size:9px!important}}


/* Archive visual wall */
.archive-visual-grid{display:grid;gap:.9rem;margin:1.6rem 0 2.2rem}.archive-visual-grid-cinema{grid-template-columns:repeat(6,minmax(0,1fr))}.archive-visual-grid-feature{grid-template-columns:minmax(0,1fr)}.archive-visual{appearance:none;border:0;padding:0;background:#111;position:relative;overflow:hidden;cursor:zoom-in;text-align:left}.archive-visual img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1),filter .45s;filter:saturate(.78) contrast(1.03)}.archive-visual.tall{aspect-ratio:3/4}.archive-visual.wide{aspect-ratio:16/7;max-height:420px}.archive-visual:hover img{transform:scale(1.025);filter:saturate(1)}.archive-visual span{position:absolute;left:.65rem;bottom:.65rem;background:rgba(239,237,231,.94);color:#111;padding:.45rem .55rem;font:8px var(--mono);letter-spacing:.08em;text-transform:uppercase}.archive-group{padding-top:1.2rem}.archive-head{margin-bottom:0}.archive-list{border-top:1px solid var(--line)}
@media(max-width:1100px){.archive-visual-grid-cinema{grid-template-columns:repeat(3,minmax(0,1fr))}.archive-visual.wide{aspect-ratio:16/8}}
@media(max-width:800px){.archive-visual-grid{margin:1.2rem 0 1.7rem;gap:.6rem}.archive-visual-grid-cinema{grid-template-columns:repeat(2,minmax(0,1fr))}.archive-visual.wide{aspect-ratio:16/10}.archive-visual span{font-size:7px;left:.5rem;bottom:.5rem;max-width:calc(100% - 1rem)}}

.archive-external{display:inline-flex;align-items:center;gap:.25rem;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.archive-external:hover{opacity:.62}