/* Yeniden tasarim taslagi (prototype/redesign). Fontlar yerel: Archivo VF (baslik, wdth 72 wght 620) + Atkinson Hyperlegible Next 400/500 (metin), OFL, fonts/ icinde. font-display:block: yakalamada yedek font gorunmesin. */
@font-face{font-family:"Archivo VF";font-style:normal;font-weight:100 900;font-display:block;src:url("fonts/archivo-latin-standard-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Archivo VF";font-style:normal;font-weight:100 900;font-display:block;src:url("fonts/archivo-latin-ext-standard-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Atkinson Next";font-style:normal;font-weight:400;font-display:block;src:url("fonts/atkinson-hyperlegible-next-latin-400-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Atkinson Next";font-style:normal;font-weight:400;font-display:block;src:url("fonts/atkinson-hyperlegible-next-latin-ext-400-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Atkinson Next";font-style:normal;font-weight:500;font-display:block;src:url("fonts/atkinson-hyperlegible-next-latin-500-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Atkinson Next";font-style:normal;font-weight:500;font-display:block;src:url("fonts/atkinson-hyperlegible-next-latin-ext-500-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{
  --ink:#14181b;--paper:#eceae4;--line:#14181b;--soft:#14181b24;--film:#d9622b;
  --sans:"Atkinson Next",system-ui,-apple-system,"Segoe UI",sans-serif;
  --head:"Archivo VF","Atkinson Next",system-ui,sans-serif;--h-disp:'wdth' 72,'wght' 620;--h-title:'wdth' 100,'wght' 600;--band:clamp(140px,19.5svh,200px);--rail:9px;
  --bar:56px;--gut:clamp(16px,4vw,56px);--slide:.85s;--night:1.2s;
  --e-inis:cubic-bezier(.65,0,.2,1);--e-kontrol:cubic-bezier(.2,0,0,1);
  --stage-min:560px;--stage-h:max(var(--stage-min),calc(100svh - var(--bar)));
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--paper);color:var(--ink);font:400 17px/1.45 var(--sans);overflow-x:clip}
img{display:block;max-width:100%;height:auto;background:#9a9a9a}
a{color:inherit}
button{appearance:none;border:0;background:none;color:inherit;font:500 15px var(--sans);min-height:48px;padding:12px 18px;cursor:pointer}
:focus-visible{outline:3px solid var(--film);outline-offset:2px}
section[id]{scroll-margin-top:var(--bar)}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:8px;top:-60px;z-index:30;background:var(--ink);color:var(--paper);padding:12px 16px}
.skip:focus{top:8px}

/* Üst bar: opak, buzlu yüzey yok (K3 şartı) */
.bar{position:sticky;top:0;z-index:20;height:var(--bar);background:var(--paper);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:20px;padding:0 var(--gut)}
.brand{display:flex;flex-direction:column;justify-content:center;min-height:44px;line-height:1.1;text-decoration:none;white-space:nowrap}
.brand strong{font-weight:700;font-size:16px}
.brand small{font:400 12px var(--sans)}
.nav{display:flex;gap:4px;margin-left:auto}
.nav a{display:flex;align-items:center;min-height:44px;padding:0 10px;text-decoration:none;font-size:15px}
.nav a:hover{text-decoration:underline}
.reach{display:flex;align-items:center;gap:6px}
.reach a{display:flex;align-items:center;min-height:44px;padding:0 10px;text-decoration:none;font:500 14px var(--sans);white-space:nowrap}
.reach-wa{background:var(--ink);color:var(--paper)}
.reach-tel .short{display:none}
.menu-btn{display:none;min-height:44px;padding:0 10px;font-size:14px}

/* 1. Sahne */
.stage-track{scroll-margin-top:var(--bar)}
/* Taraf: --out 1 dışarıdan, 0 içeriden. Gündüz/gece --k-* değişkenleriyle (JS, yalnız Gündüz/Gece düğmesinden; kaydırmayla değişmez). */
@property --out{syntax:"<number>";inherits:true;initial-value:1}
.stage{--out:1;--k-oda:0;--k-parlama:1;--k-yansima:.62;--k-ayna:1;--k-gece:0;--kt:0;--k-aksam:0;--p:0;position:relative;height:var(--stage-h);overflow:hidden;background:#000;transition:--out 1.2s var(--e-kontrol)}
.stage[data-side=inside]{--out:0}
.plates,.p{position:absolute;inset:0}
.p{width:100%;height:100%;object-fit:cover;opacity:0;background:none}
.p-room-day{opacity:1}
.p-street-day{opacity:calc(1 - var(--out))}
.p-street-night{opacity:calc((1 - var(--out)) * var(--k-oda))}
.p-room-night{opacity:calc(var(--out) * var(--k-oda))}
.p-person{opacity:var(--out)}

/* Film tarayıcıda hesaplanır: kayma 700-900 ms, gece yaklaşık 1,2 sn */
/* Film cama yukarıdan iner, kenarı yumuşak (K1: yan yana öncesi/sonrası okunmasın) */
@property --wipe{syntax:"<percentage>";inherits:false;initial-value:0%}
.film{position:absolute;inset:0;--wipe:0%;-webkit-mask-image:linear-gradient(to bottom,#000 calc(var(--wipe) - 20%),transparent var(--wipe));mask-image:linear-gradient(to bottom,#000 calc(var(--wipe) - 20%),transparent var(--wipe));transition:--wipe var(--slide) var(--e-inis),background var(--night)}
.film:before{content:"";position:absolute;inset:0;opacity:0;pointer-events:none}
[data-film=mirror] .film,[data-film=frost] .film,[data-film=sun] .film,[data-film=oneway] .film,[data-film=tint] .film{--wipe:120%}
/* Gündüz ayna tonu (motion-spec §5): soğuk gümüş zemin; gündüz/gece --k-ayna ile */
[data-film=mirror] .film{background:linear-gradient(115deg,#2b2f33,#3d4348 34%,#24282b 62%,#353b3f);opacity:var(--k-ayna);filter:brightness(calc(1 - .5 * var(--k-aksam)))}
/* Ayna gerçekten yansıtır: dışarıdan gündüz camda karşı sokak, yatay çevrilmiş; gri, soğuk, düşük kontrast */
.p-reflect{transform:scaleX(-1)}
/* Akşam: dışarısı karardıkça gündüz yansıması ve gümüş film söner (--k-aksam, p .20–.65, doğrusal); tersine dönme .55–.70'te */
[data-film=mirror][data-side=outside] .p-reflect{opacity:var(--k-yansima);filter:saturate(calc(.75 - .25 * var(--k-aksam))) contrast(.9) brightness(calc(1.03 - .55 * var(--k-aksam)))}
/* Akşam mavisi (owner kararı 2026-11-10): p≈.4te en yoğun (azami .5), 0 ve 1de yok; yansımanın üstünde akşam mavisi örtü #1f3a6b, sepya kalktı (çamurlu gri yapıyordu) */
[data-film=mirror][data-side=outside] .film:after{content:"";position:absolute;inset:0;pointer-events:none;background:#1f3a6b;opacity:calc(2 * var(--k-aksam) * (1 - var(--k-aksam)))}
/* İçeriden: gündüz koyu zemin, gece kahve gradyan ::before katmanında (--kt) */
[data-film=mirror][data-side=inside] .film{background:#3c4243;opacity:calc(.38 + .62 * var(--kt))}
[data-film=mirror][data-side=inside] .film:before{background:linear-gradient(115deg,#6a5d48,#a08c6b 40%,#574d3c);opacity:var(--kt)}
[data-film=frost] .film{-webkit-backdrop-filter:blur(16px) brightness(1.05);backdrop-filter:blur(16px) brightness(1.05);background:rgba(240,240,236,.46)}
[data-film=sun] .film{background:#2e3234;opacity:calc(.42 - .28 * var(--kt))}
[data-film=sun][data-side=outside] .film{opacity:calc(.86 - .72 * var(--kt))}
[data-film=sun][data-side=outside] .film:before{background:linear-gradient(115deg,#8f9594,#c4c8c6 40%,#7c8282);opacity:calc(1 - var(--kt))}
[data-film=tint] .film{background:var(--film);opacity:.26}
[data-film=oneway] .film{background:radial-gradient(circle at 50% 50%,transparent 36%,var(--dot,var(--film)) 37%) 0 0/9px 9px;opacity:calc(1 - .58 * var(--kt))}
[data-film=oneway][data-side=inside] .film{--dot:#16181a;opacity:calc(.72 - .30 * var(--kt))}
.cut{position:absolute;left:var(--gut);right:var(--gut);top:12%;opacity:0;transition:opacity .6s .4s;font:700 clamp(40px,8vw,120px)/.95 var(--sans);letter-spacing:-.02em;color:rgba(245,245,240,.86)}
.cut span{display:inline-block}
[data-film=mark] .cut{opacity:1}
[data-side=inside] .cut span{transform:scaleX(-1)}
/* Cam hissi: bronz doğrama, gündüz soğuk parlama, gece kalıntı yansıma */
.rail{position:absolute;left:0;right:0;height:clamp(12px,2vh,20px);background:linear-gradient(#2d241d,#6b5846 45%,#2a221b)}
.rail-t{top:0}.rail-b{display:none}
.rail-l,.rail-r{top:0;bottom:0;left:0;right:auto;width:clamp(10px,1vw,16px);height:auto;background:linear-gradient(90deg,#2d241d,#6b5846 45%,#2a221b)}
.rail-r{left:auto;right:0}
.sheen{position:absolute;inset:0;background:linear-gradient(112deg,transparent 16%,rgba(255,255,255,.11) 28%,rgba(255,255,255,.03) 36%,transparent 44%,transparent 60%,rgba(255,255,255,.06) 68%,transparent 76%),rgba(196,210,222,.08);opacity:var(--k-parlama)}
[data-film=mirror][data-side=outside] .sheen{background:linear-gradient(112deg,transparent 16%,rgba(255,255,255,.24) 28%,rgba(255,255,255,.03) 36%,transparent 44%,transparent 60%,rgba(255,255,255,.05) 68%,transparent 76%),rgba(196,210,222,.08)}
.p-reflect-night{transform:scaleX(-1);mix-blend-mode:screen}
[data-side=outside] .p-reflect-night{opacity:var(--k-gece)}

/* Başlık cama yapışmış opak film parçasında: plaka ne olursa olsun okunur, buzlu yüzey değildir (K3) */
.glass{position:absolute;left:var(--gut);max-width:calc(100% - 2*var(--gut) - 344px - 24px);bottom:calc(64px + clamp(12px,2vh,20px) + 24px);background:var(--paper);color:var(--ink);padding:clamp(16px,2vw,28px)}
h1{max-width:11ch;font-size:clamp(44px,5.6vw,92px);line-height:.94;letter-spacing:-.035em;font-weight:500;margin-bottom:.3em}
.who{font:400 14px/1.45 var(--sans);max-width:42ch}
.temsili{font:400 12px/1.4 var(--sans);margin-top:6px}


/* Kontroller: denizlik (art-director şartnamesi 2026-11-07). Kâğıt içeriktir, mürekkep kontroldür. Opak, buzlu yüzey yok (K3). */
.panel{position:absolute;left:0;right:0;bottom:0;height:64px;background:var(--ink);color:var(--paper);display:flex;align-items:stretch;padding-left:var(--gut)}
/* Camın alt doğraması kontrollerin üstünde kapanır */
.panel:before{content:"";position:absolute;left:0;right:0;bottom:100%;height:clamp(12px,2vh,20px);background:linear-gradient(#2d241d,#6b5846 45%,#2a221b)}
html:not(.js) .panel,html:not(.js) .tabs,html:not(.js) .row-acts button,html:not(.js) .vitrin-ctl .seg,html:not(.js) .flip{display:none}
.seg{display:flex;border-right:1px solid var(--line)}
button[aria-pressed=true]{background:var(--ink);color:var(--paper)}
.panel :focus-visible{outline:2px solid var(--paper);outline-offset:-6px}
/* Taraf ve zaman: rayın üstünde ayrı mürekkep kutu, sağda */
.sw{position:absolute;right:var(--gut);bottom:calc(100% + clamp(12px,2vh,20px));width:344px;height:52px;padding:4px;background:var(--ink);display:flex;align-items:center}
.sw .seg{flex:1;border:0;position:relative}
.sw .seg+.seg{margin-left:9px}
.sw .seg+.seg:before{content:"";position:absolute;left:-5px;top:10px;width:1px;height:24px;background:rgba(236,234,228,.18)}
.sw button{flex:1;min-height:44px;padding:0 8px;font:500 13px var(--sans);color:#a9a8a3;background:none;transition:background-color .16s ease-out,color .16s ease-out}
.sw button:hover{color:var(--paper)}
.sw button[aria-pressed=true]{background:var(--paper);color:var(--ink)}
/* Dertler: çizgisiz, seçili olanın üstünde rayına değen ince turuncu bant */
.needs-label{display:flex;align-items:center;flex:none;margin-right:24px;font:400 13px var(--sans);color:#a9a8a3}
.needs{display:flex;align-items:stretch;overflow-x:auto;scrollbar-width:none;overscroll-behavior:contain}
.needs button{position:relative;white-space:nowrap;min-height:64px;padding:0 14px;font:500 15px var(--sans);color:#a9a8a3;background:none;transition:color .16s ease-out}
.needs button:after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--film);transform:scaleX(0);transform-origin:left;transition:transform .12s ease-in}
.needs button:hover{color:var(--paper)}
.needs button[aria-pressed=true]{background:none;color:var(--paper)}
.needs button[aria-pressed=true]:after{transform:scaleX(1);transition:transform .24s cubic-bezier(.2,0,0,1)}
.needs-toggle{display:none}

/* Bölümler */
.sec{padding:clamp(56px,9vw,120px) var(--gut)}
.sec-head{max-width:62ch;margin-bottom:clamp(24px,4vw,48px)}
h2{font-size:clamp(32px,4.4vw,64px);line-height:1;letter-spacing:-.03em;font-weight:500;margin-bottom:.45em;max-width:18ch}

/* 2. Davranış tablosu */
.tabs{display:none}
.beh{width:100%;border-collapse:collapse;font-size:16px}
.beh thead th{text-align:left;font:500 13px var(--sans);padding:10px 16px 10px 0;border-bottom:1px solid var(--line)}
.beh tbody th,.beh td{text-align:left;vertical-align:top;padding:16px 16px 16px 0;border-bottom:1px solid var(--soft);font-weight:400}
.beh tbody th{font-weight:700;width:27%}
.row-acts{display:flex;flex-wrap:wrap;gap:0 14px;margin-top:2px;font:400 13px var(--sans)}
.row-acts button{min-height:44px;padding:0;font:inherit;text-decoration:underline;text-underline-offset:3px}
.row-acts a{display:inline-flex;align-items:center;min-height:44px}
.limit td{padding:0 0 16px}
.limit figure{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,4fr);gap:clamp(16px,3vw,40px);align-items:end}
.limit figcaption strong{display:block;font-size:clamp(22px,2.4vw,32px);line-height:1.1;letter-spacing:-.02em;font-weight:500;margin-bottom:.4em}

/* 3. Vitrin */
.vitrin{background:var(--ink);color:var(--paper)}
.vitrin-stage{position:relative;aspect-ratio:3/2;max-height:72vh;width:100%;overflow:hidden}
.vp{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity var(--night)}
html:not(.js) .vp-out,[data-v=out] .vp-out,[data-v=in] .vp-in,[data-v=night] .vp-night{opacity:1}
.vitrin-ctl{display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;margin-top:16px}
.vitrin .seg{border:1px solid var(--paper)}
.vitrin button[aria-pressed=true]{background:var(--paper);color:var(--ink)}
.vitrin-say{list-style:none;padding:0;font-size:16px}
.js .vitrin-say li{display:none}
[data-v=out] .vs-out,[data-v=in] .vs-in,[data-v=night] .vs-night{display:block!important}
.go{display:inline-flex;align-items:center;min-height:48px;padding:0 18px;background:var(--film);color:var(--ink);font-weight:500;text-decoration:none;white-space:nowrap}

/* 4. Camın ötesi */
.otesi-list{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,32px)}
.otesi-list h3{font-size:20px;line-height:1.15;font-weight:700;margin:12px 0 4px}
.otesi-list a{display:inline-flex;align-items:center;min-height:44px;font:400 13px var(--sans)}

/* 5. Proje */
.proje{border-top:1px solid var(--line)}
.proje p{max-width:52ch;margin-bottom:20px}

/* 6. Kapanış: ters yazı */
.close{background:#a8a8a8;padding:clamp(56px,9vw,120px) var(--gut)}
.close-lead{font:400 14px var(--sans);margin-bottom:12px}
.reverse{display:block;width:max-content;max-width:100%;font-size:clamp(44px,10.5vw,176px);line-height:1;letter-spacing:-.04em;font-weight:500;text-decoration:none;white-space:nowrap}
.reverse span{display:inline-block;transition:transform .9s cubic-bezier(.65,0,.2,1)}
.js [data-side=inside] .reverse span{transform:scaleX(-1)}
.flip{margin:20px 0 clamp(32px,5vw,64px);background:var(--ink);color:var(--paper)}
.flip[aria-pressed=true]{background:none;color:var(--ink);border:1px solid var(--ink)}
.contact{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:18px 24px}
.contact dt{font:400 13px var(--sans);margin-bottom:2px}
.contact dd{margin:0;overflow-wrap:anywhere}
.contact a{display:inline-flex;align-items:center;min-height:44px;font-weight:500}
.foot{padding:20px var(--gut);font:400 13px/1.5 var(--sans);background:var(--paper)}
.foot p{max-width:90ch}

/* Tablet: kontroller iki sıra, nav sığsın */
@media (max-width:1100px){
  .nav a{padding:0 7px;font-size:14px}
}

/* 1200 px altı: başparmak şeridi. Üstte taraf/zaman, altta Derdiniz ne?; liste şeridin üstünden açılır */
@media (max-width:1199px){
  .panel{height:auto;display:flex;flex-direction:column;padding:0 0 env(safe-area-inset-bottom)}
  .sw{position:static;width:auto;height:52px;border-bottom:1px solid rgba(236,234,228,.14)}
  .needs-label{display:none}
  .needs-toggle{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;padding:0 16px;color:var(--paper);text-align:left}
  .nt-label{font:400 13px var(--sans);color:#a9a8a3}
  .nt-pick{display:inline-flex;align-items:center;gap:8px;font:500 15px var(--sans);color:var(--paper)}
  .nt-pick:not(:empty):before{content:"";width:3px;height:20px;background:var(--film)}
  .needs-toggle:after{content:"+";margin-left:auto;font:400 20px var(--sans)}
  .needs-toggle[aria-expanded=true]:after{content:"\2212"}
  .needs{position:absolute;left:0;right:0;bottom:100%;z-index:2;flex-direction:column;align-items:stretch;max-height:56svh;overflow-y:auto;background:var(--ink);visibility:hidden;opacity:0;transform:translateY(8px);transition:opacity .14s ease-in,transform .14s ease-in,visibility 0s .14s}
  .needs.open{visibility:visible;opacity:1;transform:none;transition:opacity .2s cubic-bezier(.2,0,0,1),transform .2s cubic-bezier(.2,0,0,1)}
  .needs button{min-height:52px;padding:0 16px;text-align:left;white-space:normal;font-size:16px;border-bottom:1px solid rgba(236,234,228,.12)}
  .needs button:after{right:auto;bottom:0;width:3px;height:auto;transform:scaleY(0);transform-origin:top}
  .needs button[aria-pressed=true]:after{transform:scaleY(1)}
  .glass{bottom:calc(105px + clamp(12px,2vh,20px) + 24px)}
}

/* Mobil: cam kapı kanadı, küçültülmüş masaüstü değil */
@media (max-width:760px), (max-width:1199px) and (orientation:portrait){
  html{scroll-padding-top:var(--bar)}
  body{font-size:16px}
  .bar{gap:8px}
  .menu-btn{display:block}
  .reach{margin-left:auto}
  .reach-tel .long{display:none}.reach-tel .short{display:inline}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--paper);border-bottom:1px solid var(--line);flex-direction:column;gap:0;margin:0;padding:6px var(--gut)}
  .nav.open{display:flex}
  .nav a{font-size:16px}
  .rail{display:none}
  .glass{top:20px;bottom:auto;max-width:none;left:calc(var(--gut) + 14px);right:calc(var(--gut) + 14px);padding:14px}
  h1{max-width:none;font-size:clamp(32px,11vw,68px);margin-bottom:.28em}
  .who{font-size:13px}.temsili{font-size:12px}
  .cut{top:42%;left:calc(var(--gut) + 14px);font-size:clamp(36px,11vw,60px)}
  .panel:before{display:none}
  /* Tablo: seçili sütunu değiştiren üç sekmeli tek liste */
  .tabs{display:flex;position:sticky;top:var(--bar);z-index:5;background:var(--paper);border:1px solid var(--line);margin-bottom:8px}
  .tabs button{flex:1;padding:10px 4px}
  .beh thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .beh,.beh tbody,.beh tr{display:block;width:100%}
  .beh tbody th,.beh td{display:block;width:100%;border:0;padding:0}
  .beh tr{padding:16px 0;border-bottom:1px solid var(--soft)}
  .beh tbody th{display:flex;flex-direction:column}
  .row-acts{order:2;margin-top:8px}
  .js .beh[data-col=in] td.c-out,.js .beh[data-col=in] td.c-night,
  .js .beh[data-col=out] td.c-in,.js .beh[data-col=out] td.c-night,
  .js .beh[data-col=night] td.c-in,.js .beh[data-col=night] td.c-out{display:none}
  .beh td{margin-top:4px}
  .limit figure{grid-template-columns:1fr}
  .vitrin-stage{aspect-ratio:4/5;max-height:none}
  .vitrin-ctl{grid-template-columns:1fr}
  .vitrin .seg{border:1px solid var(--paper)}
  .go{justify-content:center}
  .otesi-list{grid-template-columns:1fr}
}

@media (max-width:360px){
  .brand{white-space:normal}
  .brand strong{font-size:14px}
  .brand small{display:none}
  .reach a,.menu-btn{padding:0 8px;min-width:44px;justify-content:center}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{transition:none!important}
}

/* ===================== YENIDEN TASARIM (art-director sartnamesi, kagit zemin + berrak cam penceresi) ===================== */
/* Tipografi: Archivo VF basliklar, Atkinson metin; mono yok; sayilar tabular. Atkinson'da 600/700 yok: kalin gerekli yer Archivo'dur (sahte kalin yok). */
:root{--gap1:8px;--gap2:16px;--gap3:24px;--gap4:40px;--gap5:64px;--gap6:104px;--gap7:160px}
html:root body *,html:root body{font-variant-numeric:tabular-nums}
b,strong{font-weight:500}
h1,h2,h3{font-family:var(--head);font-weight:400;font-variation-settings:var(--h-disp)}
h2{font-size:clamp(32px,4.4vw,64px);line-height:1;letter-spacing:-.02em;word-spacing:.04em;margin-bottom:.45em;max-width:18ch}
.brand strong{font-weight:500}
.otesi-list h3{font-weight:400;font-variation-settings:var(--h-title);letter-spacing:-.005em}
.cut{font-family:var(--head);font-weight:400;font-variation-settings:var(--h-disp);letter-spacing:-.025em}
.reverse{font-family:var(--head);font-weight:400;font-variation-settings:var(--h-disp);letter-spacing:-.025em}

/* Pencere: berrak cam, kenarlari bronz dort dograma (look-contract §4 gradyani), kart ve bulaniklik yok */
.stage{background:var(--paper)}
.rail{height:var(--rail)}
.rail-b{display:block;top:auto;bottom:0}
.rail-l,.rail-r{top:0;bottom:0;height:auto;width:var(--rail)}
.p{object-position:50% 50%}
.cut{left:clamp(24px,4vw,56px);right:clamp(24px,4vw,56px)}

/* Sahne yazilari: iki satirli baslik, ikisi de h1'in span'i */
h1 span{display:block;white-space:nowrap}

@media (min-width:1200px){
  .stage{--fs:clamp(64px,8.33vw,132px)}
  .plates{inset:auto;left:calc(var(--gut) + 3*((100% - 2*var(--gut) - 264px)/12 + 24px));top:var(--band);right:0;bottom:64px;overflow:hidden}
  .glass{display:contents}
  .stage h1{display:contents}
  .stage h1 span{position:absolute;font:400 var(--fs)/.92 var(--head);font-variation-settings:var(--h-disp);letter-spacing:-.025em;word-spacing:.02em}
  /* 1. satir: tabani pencere ust rayinin 24 px ustunde (--l1b = Archivo satir kutusu tabanindan alt kenara, olcumle ayarlanir) */
  h1 .l1{left:var(--gut);bottom:calc(100% - var(--band) + 24px - var(--l1b,.1278em));z-index:3}
  /* 2. satir: kagit dil. Metin 3. sutundan baslar, sag kenar metin + 40; dil pencerenin alt kenarindan 64 px yukarida biter */
  h1 .l2{left:0;bottom:128px;height:calc(var(--fs)*.92 + 22px);padding:11px 40px 11px calc(var(--gut) + 2*((100% - 2*var(--gut) - 264px)/12 + 24px));background:var(--paper);z-index:5}
  .who{position:absolute;right:var(--gut);bottom:calc(100% - var(--band) + 24px - var(--whob,5.3px));max-width:none;white-space:nowrap;margin:0;font:400 14px/1.45 var(--sans);z-index:3}
  .who.low{bottom:calc(100% - var(--band) + 32px - var(--whob,5.3px))}
  .panel{display:contents}
  .sw{right:auto;bottom:auto;left:var(--gut);top:408px;width:314px;height:auto;padding:0;background:none;display:grid;gap:8px;z-index:3}
  .sw .seg{flex:none;display:flex;border:0;box-shadow:inset 0 0 0 1px var(--ink)}
  .sw .seg+.seg{margin-left:0}
  .sw .seg+.seg:before{display:none}
  .sw button{flex:1 1 0;min-height:44px;height:44px;padding:0;font:500 15px var(--sans);color:var(--ink)}
  .sw button:hover{color:var(--ink);background:rgba(20,24,27,.08)}
  .sw button[aria-pressed=true]{background:var(--ink);color:var(--paper)}
  .sw :focus-visible{outline:3px solid var(--film);outline-offset:2px}
  .temsili{position:absolute;left:var(--gut);bottom:72px;margin:0;font:400 12px/1.4 var(--sans);z-index:3}
  .needs{position:absolute;left:0;right:0;bottom:0;height:64px;padding-left:var(--gut);background:var(--ink);color:var(--paper);z-index:6}
  .panel:before{display:none}
}

/* 1199 px alti ve mobil: bant 0-164 kagit, pencere sag kenara tasar, not pencerenin sol ustunde kagit dil */
@media (max-width:1199px){
  .plates{inset:auto;left:16px;right:0;top:240px;bottom:105px;overflow:hidden}
  .p{object-position:50% 55%}
  .rail{display:none}
  .glass{display:contents}
  .stage h1{display:block;position:absolute;left:16px;top:20px;margin:0;max-width:none;font:400 clamp(44px,15.4vw,64px)/.92 var(--head);font-variation-settings:var(--h-disp);letter-spacing:-.025em;word-spacing:.02em;z-index:3}
  .stage h1 span{position:static;display:block;white-space:nowrap}
  .who{position:absolute;left:16px;top:148px;right:auto;max-width:none;white-space:nowrap;margin:0;font:400 13px/1.2 var(--sans);z-index:3}
  .temsili{position:absolute;left:16px;top:166px;margin:0;font:400 12px/1.4 var(--sans);z-index:3}
}

/* #filmler: 12 sutun, sol baslik yapisir, tablo 5-12; gece sutunu surekli murekkep bant */
@media (min-width:1200px){
  .films{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:start;padding:clamp(72px,8.9vw,128px) 56px 160px}
  .films .sec-head{grid-column:1/span 4;position:sticky;top:96px;max-width:none;margin:0}
  .films .sec-head h2{max-width:none;margin-bottom:24px}
  .films .beh{grid-column:5/-1}
}
.films .sec-head h2{font-size:clamp(40px,3.9vw,56px);line-height:1;letter-spacing:-.01em;word-spacing:.04em;font-variation-settings:'wdth' 75,'wght' 620}
.films .sec-head h2 span{display:block}
.films .sec-head p{font-size:16px;line-height:1.5;max-width:34ch}
@media (min-width:1200px),(min-width:761px) and (orientation:landscape){
  .beh{border-collapse:separate;border-spacing:0;table-layout:fixed;background:linear-gradient(90deg,transparent 76%,var(--ink) 76%)}
  .beh thead th{position:sticky;top:56px;z-index:2;background:var(--paper);font:500 14px/1.2 var(--sans);padding:14px 16px 14px 0;width:24%}
  .beh thead th:first-child{width:28%}
  .beh tbody th{width:28%;font:400 20px/1.15 var(--head);font-variation-settings:var(--h-title);letter-spacing:-.005em}
  .beh tbody th,.beh td{padding:16px 16px 16px 0;font-size:16px;line-height:1.45}
  .beh .c-night{color:var(--paper);padding-left:16px}
  .beh thead th.c-night{background:var(--ink)}
  .beh tbody td.c-night{border-bottom-color:rgba(236,234,228,.16)}
  .row-acts{font:500 14px/1.2 var(--sans);font-variation-settings:normal;gap:0 16px;margin-top:4px;letter-spacing:0}
  .row-acts button,.row-acts a{min-height:44px;text-decoration:underline;text-underline-offset:3px}
  .beh .limit td{padding:40px 0 24px;border:0;background:none}
  .limit figure{display:block;margin-right:-56px}
  .limit figure img{width:100%;height:auto}
  .limit figcaption{margin-top:16px;max-width:calc(.625*(100% - 56px) - 9px);font-size:16px;line-height:1.5}
  .limit figcaption strong{display:block;font:400 32px/1.1 var(--head);font-variation-settings:var(--h-title);letter-spacing:-.01em;margin-bottom:8px}
}

@media (max-width:760px),(max-width:1199px) and (orientation:portrait){
  .films{padding:72px var(--gut) 96px}
  .films .sec-head{position:static}
  .films .sec-head h2{font-size:36px;line-height:1}
  .tabs{gap:0}
  .beh tbody th{font:400 20px/1.15 var(--head);font-variation-settings:var(--h-title)}
  .row-acts{font:500 14px/1.2 var(--sans);font-variation-settings:normal;letter-spacing:0}
  .beh[data-col=night] td.c-night{background:transparent;color:var(--ink);border-left:3px solid #14181B;padding:12px 0 12px 12px;margin-top:8px}
  .limit figure{margin-right:0}
  .limit figcaption strong{display:block;font:400 24px/1.1 var(--head);font-variation-settings:var(--h-title);margin-bottom:6px}
}

/* ===================== TUR 2: bolum yeniden kompozisyonu (art-director 1. tur) ===================== */
/* #filmler: kumlama satiri kagit zeminli (gece bandi gorselde kesilir), film adlari 20 px */
.beh tr.limit td{background:var(--paper);position:relative;z-index:1}
.beh tbody th{font-size:20px;line-height:1.15}

/* #vitrin: sayfadaki tek simetrik bolum; murekkep zemin, her sey ortada */
.vitrin .sec-head{text-align:center;margin-left:auto;margin-right:auto}
.vitrin .sec-head h2{margin-left:auto;margin-right:auto}
.vitrin .sec-head p{margin-left:auto;margin-right:auto;max-width:44ch}
.vitrin-ctl{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;margin-top:32px}
.vitrin-say{max-width:52ch;min-height:3em}
.vitrin .go{align-self:center}

/* #otesi: kirik ritim */
.otesi .sec-head{max-width:none;margin-bottom:clamp(40px,6vw,64px)}
.otesi .sec-head h2{max-width:none;font-size:clamp(72px,10vw,144px);line-height:.92;letter-spacing:-.025em;font-variation-settings:'wdth' 72,'wght' 620;margin-bottom:.2em}
.otesi .sec-head p{max-width:30ch}
.otesi-list img{width:100%;height:auto;object-fit:cover}
.otesi-list li:nth-child(1) img{aspect-ratio:4/3}
.otesi-list li:nth-child(2) img{aspect-ratio:4/5;object-position:30% 50%}
.otesi-list li:nth-child(3) img{aspect-ratio:4/3}
.otesi-list li:nth-child(1) p{max-width:30ch}
.otesi-list li:nth-child(2) p{max-width:22ch}
.otesi-list li:nth-child(3) p{max-width:26ch}

/* #proje: kagit zemin, tek dar blok */
.proje h2{max-width:14ch}
.proje .go{margin-top:4px}

/* #iletisim: murekkep zemin, ters numara */
.close{background:var(--ink);color:var(--paper)}
.reverse{font-size:clamp(64px,11vw,168px);letter-spacing:-.025em;font-variation-settings:'wdth' 72,'wght' 620}
.close .flip{background:var(--paper);color:var(--ink)}
.close .flip[aria-pressed=true]{background:none;color:var(--paper);border:1px solid var(--paper)}
.contact{grid-template-columns:1fr}
.contact dt{color:#a9a8a3}

/* Mobil/tablet dikey: her bolum tek sutun, kendi ritmi */
@media (max-width:1023px){
  .otesi-list{display:block}
  .otesi-list li:nth-child(2){width:78%;margin:56px 0 0 auto}
  .otesi-list li:nth-child(3){width:66%;margin:40px 0 0}
  .proje{padding-top:96px;padding-bottom:96px}
  .reverse{white-space:normal;width:auto}
}
@media (min-width:600px) and (max-width:1023px){
  .contact{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (min-width:1024px){
  .vitrin{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;padding-top:clamp(72px,8.9vw,128px);padding-bottom:clamp(72px,8.9vw,128px)}
  .vitrin>*{grid-column:3/11}
  .vitrin-stage{max-height:none}

  .otesi{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;padding-bottom:160px}
  .otesi .sec-head{grid-column:1/-1}
  .otesi-list{display:contents}
  .otesi-list li:nth-child(1){grid-column:1/8;grid-row:2/4;align-self:start}
  .otesi-list li:nth-child(2){grid-column:8/13;grid-row:2;margin-top:160px}
  .otesi-list li:nth-child(3){grid-column:9/13;grid-row:3;margin-top:40px}

  .proje{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;padding-top:clamp(96px,12vw,176px);padding-bottom:clamp(96px,12vw,176px)}
  .proje>*{grid-column:4/10}
  .proje .go{justify-self:start}

  .close{padding-top:clamp(72px,9vw,128px)}
  .contact{grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}
}

/* ===================== TUR 3: owner onayli (A-G) ===================== */
/* A) masaustu: 2. satir 1. satirin hemen altindan baslar, dil pencere ust kenarina biner; soldaki sutun dilin altina iner */
@media (min-width:1200px){
  .stage{--nt:calc(var(--band) + 1.0478*var(--fs) + 14px)}
  h1 .l2{bottom:auto;top:calc(var(--band) - 24px + .1278em)}
  /* .who: 1. satirla ayni taban cizgisi, daha belirgin (20 px / 500) */
  .who{font:500 20px/1.3 var(--sans);bottom:calc(100% - var(--band) + 24px - var(--whob,6.1px))}
  .who.low{bottom:calc(100% - var(--band) + 32px - var(--whob,6.1px))}
}
/* C) mobil/tablet: olu bant kapanir (pencere ve not 28 px yukari), not pencereyle ayni sol-sag kenarda */
@media (max-width:1199px){
  :root{--pt:212px}
  .plates{top:var(--pt)}
  .who{font:500 14px/1.2 var(--sans)}
}
/* l1024: yatay tablette baslik tek satir, pencere yuksekligi artar (367 -> 483 px) */
@media (min-width:761px) and (max-width:1199px) and (orientation:landscape){
  :root{--pt:124px}
  .stage h1{top:12px;font-size:52px;line-height:1}
  .stage h1 span{display:inline-block;margin-right:.22em}
  .who{top:68px}
  .temsili{top:90px}
}
/* D) #proje: iki sutun */
@media (min-width:1024px){
  .proje{align-items:start}
  .proje{grid-template-columns:5fr 7fr;column-gap:24px}
  .proje>h2{grid-column:1;grid-row:1;max-width:14ch;margin:0 0 24px}
  .proje>p{grid-column:1;grid-row:2;margin:0;max-width:46ch}
  .proje>.go{grid-column:2;grid-row:1;justify-self:start}
}
/* E) #vitrin: simetri korunur, gorsel 2.-11. sutun, bosluk dar, h2 buyuk */
.vitrin .sec-head h2{font-size:clamp(44px,5.8vw,84px);max-width:20ch;line-height:.98}
.vitrin .sec-head{margin-bottom:clamp(16px,2.4vw,32px)}
@media (min-width:1024px){
  .vitrin{padding-top:clamp(48px,5vw,72px);padding-bottom:clamp(48px,5vw,72px)}
  .vitrin>.sec-head{grid-column:3/11}
  .vitrin>.vitrin-stage,.vitrin>.vitrin-ctl{grid-column:2/12}
}
@media (max-width:1023px){
  .vitrin{padding-top:48px;padding-bottom:48px}
}
@media (max-width:760px),(max-width:1199px) and (orientation:portrait){
  .vitrin-ctl{align-items:stretch}
  .vitrin .seg{width:100%}
  .vitrin .seg button{flex:1;padding:0 6px;white-space:nowrap;font-size:15px}
  .vitrin .go{align-self:stretch}
}
/* F) #iletisim: ters numara icerik genisligini doldurur (olcum: 64 px'te metin 5,153 em; JS yok) */
.reverse{font-size:calc((100vw - 2*var(--gut))/5.2);width:max-content;max-width:none;white-space:nowrap}
@media (max-width:1023px){.reverse{white-space:nowrap;width:max-content}}
/* G) #filmler: gorsel basliktan kopuk, ustte yapisan baslik ve sutun basliklari hep ustte, gorsel kenara tasmaz */
.films .sec-head{z-index:3}
.beh thead th{z-index:6}
.beh tr.limit td{z-index:0}
.limit figure{position:relative;isolation:isolate;margin-right:0!important}
.limit figcaption{position:relative;z-index:1;background:var(--paper);margin-top:0;padding-top:32px}
@media (min-width:1200px),(min-width:761px) and (orientation:landscape){
  .beh .limit td{padding-top:64px}
}

/* ===================== TUR 4: acilis, filmler, mobil acilis (yalniz bu uc alan) ===================== */
.seg-l,.tab-say{display:none}
.fname{display:block}
/* Gunduz tonu: owner 2026-11-11: C secildi (varsayilan). Filtre = saturate(.75-.25*aksam) contrast(.9) brightness(1.03-.55*aksam) contrast(1.08) saturate(1.1). look-contract'a yazilmaz (koordinator yazar). */
[data-film=mirror][data-side=outside] .p-reflect{filter:saturate(calc(.75 - .25 * var(--k-aksam))) contrast(.9) brightness(calc(1.03 - .55 * var(--k-aksam))) contrast(1.08) saturate(1.1)}
/* Eski ton A yalniz ?ton=A ile acilir. */
html[data-ton=A] [data-film=mirror][data-side=outside] .p-reflect{filter:saturate(calc(.75 - .25 * var(--k-aksam))) contrast(.9) brightness(calc(1.03 - .55 * var(--k-aksam)))}

/* ---- A) ACILIS, masaustu. Izgara: 12 sutun, kenar --gut, oluk 24 px (--cw sutun genisligi, --st adim). Varsayilan V1; ?v=2 -> html[data-hv=2] ---- */
@media (min-width:1200px){
  .stage{--cw:calc((100% - 2*var(--gut) - 264px)/12);--st:calc(var(--cw) + 24px);--gw:calc(3*var(--cw) + 48px);
    --l1o:32px;--l1g:16px;--l2s:var(--rail);--ty:0px;--pp:0px;--tl:3;--ee:var(--cw);--n:7;--pb:20px;--pitch:calc(1.1*var(--fs));
    --tgb:calc(var(--band) + var(--pitch) + var(--pp) - var(--l1o) + .1278*var(--fs) + var(--pb));--nt:calc(var(--tgb) + var(--rail))}
  html[data-hv="2"] .stage{--l1g:0px;--l2s:0px;--l1o:24px;--ty:7px;--pp:8px;--tl:4;--ee:0px;--n:9}
  @supports (width:round(up,1px,1px)){.stage{--pitch:round(up,calc(1.1*var(--fs)),8px)}}
  /* baslik: 1. satirin tabani pencere ustunun --l1o ustunde; .who ayni tabanda */
  h1 .l1{bottom:calc(100% - var(--band) + var(--l1o) + var(--l1g) - var(--l1b,.1278em))}
  .who{bottom:calc(100% - var(--band) + var(--l1o) + var(--l1g) - var(--whob,6.1px))}
  .who.low{bottom:calc(100% - var(--band) + var(--l1o) + var(--l1g) + 8px - var(--whob,6.1px))}
  /* kagit dil: ust kenar pencere ustune (V1) ya da yarim rayin ortasina (V2) oturur; metin --tl. sutundan; sag kenar sutun cizgisi (JS --n) */
  h1 .l2{left:0;top:calc(var(--band) + var(--ty));bottom:auto;height:auto;box-sizing:border-box;width:calc(var(--gut) + (var(--n) - 1)*var(--st) + var(--ee));
    padding:calc(var(--pitch) + var(--pp) - var(--l1o) - .7922*var(--fs) - var(--ty) + var(--l2s)) 0 var(--pb) calc(var(--gut) + (var(--tl) - 1)*var(--st))}
  .stage[data-time=night] h1 .l2{background:var(--ink);color:var(--paper)}
  /* V1: sol bolmeye de ust ray (pencere rayiyla ayni bronz gradyan), pencere ust rayiyla ayni hizada; metin rayin altina iner */
  /* Tur 7: dilin ust rayi kalkti (metin sutununu saran ayri suz); ust ray yalniz pencere fotografinda. Dil yuksekligi/metin konumu degismesin diye padding korunur */
  html[data-hv="2"] h1 .l2{border-right:1px solid var(--ink);border-bottom:1px solid var(--ink)}
  html[data-hv="2"] .stage[data-time=night] h1 .l2{border-color:#6b5846}
  /* V1: dilin sag kenarinda dikey bronz dograma (pencere sutunu), sutun cizgisinden baslar */
  .stage:after{content:"";position:absolute;z-index:4;left:calc(var(--gut) + (var(--n) - 1)*var(--st) + var(--cw));top:var(--band);bottom:64px;width:var(--rail);background:linear-gradient(90deg,#2d241d,#6b5846 45%,#2a221b);pointer-events:none}
  html[data-hv="2"] .stage:after{display:none}
  /* sol grup: ortak sol hiza (sutun 1), 3 sutun genisligi, 16 px adim; film adi notun basligi, kontroller notun altinda */
  /* Tur 7: Temsili sahne, kontrol grubunun 32 px altina sabit (sol grup: not, kontroller, yazi; pencere yuksekligiyle uzamaz) */
}

@media (min-width:1200px){.p-reflect,.p-reflect-night{object-position:var(--rx,50%) 50%}}

/* ---- B) #filmler ---- */
@media (min-width:1200px),(min-width:761px) and (orientation:landscape){
  .beh thead th:first-child{padding-left:16px}
  .beh tbody th{padding-left:16px}
  .beh tbody th .fname{font:400 22px/1.15 var(--head);font-variation-settings:var(--h-title);letter-spacing:-.005em}
  .row-acts{display:flex;align-items:center;flex-wrap:wrap;gap:4px 16px;margin-top:12px;font:400 13px/1.2 var(--sans);letter-spacing:0}
  .row-acts button{min-height:44px;padding:0 2px;border:0;color:var(--ink);font:500 15px/1 var(--sans);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px;background:none}
  .row-acts button:hover{text-decoration-color:var(--film)}
  .row-acts a{min-height:44px;padding:0 2px;font:400 13px/1.2 var(--sans);color:#3d4347;text-decoration:underline;text-underline-offset:3px}
  .row-acts a:only-child{padding:0 2px;border:0;font-size:13px}
  .beh tbody tr.sel th,.beh tbody tr.sel td:not(.c-night){background:rgba(107,88,70,.11)}
  .beh tbody tr.sel th{box-shadow:inset 4px 0 0 #6b5846}
  .beh tbody tr.sel td.c-night{background:#2b3238}
  .beh tbody tr.sel th:before{content:"Görselde gösteriliyor";display:block;width:max-content;margin-bottom:8px;padding:3px 8px;background:var(--ink);color:var(--paper);font:500 12px/1.2 var(--sans);letter-spacing:.02em}
  .beh tbody td.c-night{border-bottom-color:rgba(236,234,228,.34)}
  .beh .limit td{padding:72px 0 48px}
  .beh .limit td{border-bottom:0}
}

/* ---- B) mobil sekmeler + C) mobil acilis ---- */
@media (max-width:760px),(max-width:1199px) and (orientation:portrait){
  /* tablo: sekme ustunde etiket, sutun adi icerik blogunda, ad ve eylemler sekme degisince yer degistirmez (3 sutun ayni hucrede, gorunmeyen gizli) */
  .tabs{flex-wrap:wrap}
  .tab-say{display:block;flex:0 0 100%;padding:8px 12px 6px;font:500 13px/1.2 var(--sans);background:var(--paper);color:var(--ink)}
  .beh tr:not(.limit){display:grid;grid-template-columns:minmax(0,1fr);padding:16px 0}
  .beh tbody th{display:contents}
  .beh tbody th:before{grid-row:1}
  .beh tbody th .fname{grid-row:2;font:400 22px/1.15 var(--head);font-variation-settings:var(--h-title)}
  .beh tr:not(.limit) td{grid-area:3/1;margin-top:6px}
  .js .beh[data-col] tr:not(.limit) td{display:block;visibility:hidden}
  .js .beh[data-col=in] tr:not(.limit) td.c-in,.js .beh[data-col=out] tr:not(.limit) td.c-out,.js .beh[data-col=night] tr:not(.limit) td.c-night{visibility:visible}
  .beh tr:not(.limit) td.c-in,.beh tr:not(.limit) td.c-out{padding:12px 0;margin-top:6px}
  .beh tr:not(.limit) td.c-night{background:transparent;border-left:2px solid rgba(20,24,27,.4);padding:12px 0 12px 12px;margin-top:6px}
  .reach a{min-width:44px;justify-content:center}
  .beh td:before{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;font:500 12px/1.2 var(--sans)}
  .beh td.c-in:before{content:"İçeriden"}.beh td.c-out:before{content:"Dışarıdan"}.beh td.c-night:before{content:"Gece";color:#3d4347}
  .beh .row-acts{grid-row:4;display:flex;align-items:center;gap:4px 16px;margin-top:10px;order:0}
  .row-acts button{min-height:44px;padding:0 2px;border:0;color:var(--ink);font:500 15px/1 var(--sans);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px;background:none}
  .row-acts a{display:inline-flex;align-items:center;min-height:44px;padding:0 2px;font:400 13px/1.2 var(--sans);color:#3d4347;text-decoration:underline;text-underline-offset:3px}
  .row-acts a:only-child{padding:0 2px;border:0;font-size:13px}
  .beh tbody tr.sel{background:rgba(107,88,70,.11);padding-left:14px}
  .tab-say{font:500 14px/1.2 var(--sans);padding:12px 12px 8px}
  .beh tbody tr.sel th:before{content:"Görselde gösteriliyor";grid-row:1;display:block;width:max-content;margin-bottom:8px;padding:3px 8px;background:var(--ink);color:var(--paper);font:500 12px/1.2 var(--sans)}

  /* mobil acilis: baslik, aciklama, gosterge, pencere tek ritimde; kontroller pencerenin alt kenarinda sahneye oturur */
  /* Tur 14: bilgi grubu fotografin hemen ustunde (en uzun duruma gore ayrilmis, 11.2em x 15 px); fotograf penceresi ve kadraj degismez: sahne bilgi grubu ve serit eklemesi kadar uzar */
  .stage{--f:clamp(48px,13.33vw,56px);--whot:calc(20px + 2*var(--f) + 8px);--infoH:calc(14.2*15px);--pt:calc(var(--whot) + 48px + var(--infoH) + 8px);--dstrip:54px;--nbar:calc(52px + env(safe-area-inset-bottom));--stage-h:calc(min(100vw*2.0205,max(868px,100vw*1.26)) + var(--pt) - var(--whot) - 73px + var(--dstrip))}
  .stage h1{font-size:var(--f);line-height:1}
  .who{top:var(--whot)}
  .temsili{top:calc(var(--whot) + 19px)}
  .plates{top:var(--pt);bottom:var(--nbar)}
  .p{object-position:62% var(--oy,55%)}
  h1 .l2{padding-left:18%}
  .rail-l,.rail-r{display:block;width:6px}
  .panel{padding:0 0 env(safe-area-inset-bottom)}
  .needs{z-index:6}
}

/* ===================== TUR 8 ===================== */
/* Mobil odak halkasi: secili dugmenin murekkep dolgusundan ayri okunsun (turuncu 3 px, 2 px aralikli) */
@media (max-width:760px),(max-width:1199px) and (orientation:portrait){
  .sw :focus-visible{outline:3px solid var(--film);outline-offset:2px}
}

/* Koyu bolumler (vitrin, kapanis) bronz doseme esigiyle acilir: pencere doğramasi dili, kesik dikdortgen degil */
.vitrin,.close{position:relative}
.vitrin:before,.close:before{content:"";position:absolute;left:0;right:0;top:0;height:var(--rail);background:linear-gradient(#2d241d,#6b5846 45%,#2a221b)}
.vitrin{padding-top:72px}
@media (min-width:1024px){
  .vitrin{padding-top:clamp(72px,7vw,104px);padding-bottom:clamp(72px,7vw,104px)}
}
@media (min-width:1200px){
  .films{padding-bottom:96px}
}
@media (max-width:760px),(max-width:1199px) and (orientation:portrait){
  .films{padding-bottom:88px}
}

/* Camin otesi: sol buyuk gorsel, sag iki gorsel ayni genislikte ust uste; sol gorsel sag yiginin yuksekligini doldurur, alt satirlar ayni cizgide biter. Tum gorseller 4:3 kaynaktan. */
.otesi-list img{aspect-ratio:4/3;object-fit:cover}
.otesi-list li:nth-child(n) p{max-width:28ch}
.otesi-list li:nth-child(n) img{aspect-ratio:4/3;object-position:50% 50%}
@media (min-width:1024px){
  .otesi{padding-bottom:clamp(96px,9vw,128px)}
  .otesi-list li{display:flex;flex-direction:column;min-width:0}
  .otesi-list li:nth-child(1){grid-column:1/9;grid-row:2/4;align-self:stretch;margin:0}
  .otesi-list li:nth-child(2){grid-column:9/13;grid-row:2;margin:0 0 40px}
  .otesi-list li:nth-child(3){grid-column:9/13;grid-row:3;margin:0}
  .otesi-list li:nth-child(1) img{flex:1 1 0;min-height:320px;aspect-ratio:auto;height:auto}
  .otesi-list a{margin-top:auto}
}
@media (max-width:1023px){
  .otesi-list li:nth-child(1){width:100%;margin:0}
  .otesi-list li:nth-child(2){width:78%;margin:48px 0 0 auto}
  .otesi-list li:nth-child(3){width:66%;margin:40px 0 0}
}

/* Proje: e-posta, WhatsApp, telefon ayni boy ve ayni genislikte; yalniz e-posta dolgulu */
.proje .acts{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;max-width:420px}
.proje .acts .go{min-height:52px;justify-content:flex-start;white-space:normal}
.proje .acts .go.alt{background:none;box-shadow:inset 0 0 0 2px var(--ink)}
.proje .acts .go.alt:hover{background:rgba(20,24,27,.08)}
@media (min-width:1024px){
  .proje>.acts{grid-column:2;grid-row:1/3;align-self:start;justify-self:start;width:100%;max-width:320px}
  .proje .acts .go{display:flex;width:100%;max-width:320px;justify-self:stretch;margin-top:0}
}

/* Kapanis: dekoratif ters numara; gercek baglantilar altta, altli cizgili ve en az 44 px */
.contact a{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.contact a:hover{text-decoration-thickness:2px}

/* Mobil not: en uzun durum (3 satir govde + baslik, olculen 104.78 px) icin sabit yukseklik; gunduz/gece/film degisince kutu buyumez */
@media (max-width:760px),(max-width:1199px) and (orientation:portrait){
  .needs{max-height:none;overflow:visible}
}


/* Gorselde gosterilen filmin satirinda 'Bu filmin gorunumunu goster' gizlenir (basinca bir sey olmaz); 'WhatsApp'tan sor' kalir */
.beh tbody tr[aria-current=true] [data-try]{display:none}


/* ===================== TUR 14: kaydirmadan bagimsiz sahne, tek bilgi grubu, kontrol yonergesi ===================== */
/* Etkin film bilgisi (Gosterilen film / ad / bakis yonu · zaman / aciklama) ve kontrol yonergesi. Sahne kaydirmayla degismez: sabitleme, iz ve ilerleme cizgisi yok. */
.note{position:absolute;z-index:3;box-sizing:border-box;color:var(--ink);scroll-margin-top:calc(var(--bar) + 12px)}
.note:focus-visible{outline:3px solid var(--film);outline-offset:4px}
html:not(.js) .note{display:none}
.n-l{display:block;font:400 13px/15px var(--sans);color:#3d4347}
.n-t{margin:4px 0 0;font:400 26px/28px var(--head);font-variation-settings:var(--h-disp);letter-spacing:-.01em}
.n-s{margin:2px 0 0;font:500 15px/20px var(--sans)}
.n-d{margin:6px 0 0;font:400 15px/20px var(--sans);min-height:80px}
.n-d a{font-weight:500;text-underline-offset:3px}
.hint{font:400 15px/20px var(--sans);color:var(--ink)}
.sw .seg-l{font:500 13px/15px var(--sans);color:#3d4347}

/* Masaustu: sol sutun (3 sutun) ust uste: bilgi grubu, yonerge, kontroller (basliklariyla yan yana iki grup), Temsili sahne. Hepsi sabit yukseklik: durum degisince sicrama yok. */
@media (min-width:1200px){
  .stage{--infoH:170px;--swH:113px}
  .note{left:var(--gut);width:var(--gw);top:var(--nt);height:var(--infoH);border-top:1px solid var(--ink);padding:14px 0 0;background:none;text-align:left}
  .sw{right:auto;bottom:auto;left:var(--gut);width:var(--gw);top:calc(var(--nt) + var(--infoH) + 14px);height:auto;padding:0;background:none;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);column-gap:8px;row-gap:4px;z-index:3}
  .hint{grid-column:1/-1;grid-row:1;margin:0 0 6px;min-height:40px}
  .ly{grid-area:2/1}.sy{grid-area:3/1}.lz{grid-area:2/2}.sz{grid-area:3/2}
  .seg-l{display:block}
  .temsili{top:calc(var(--nt) + var(--infoH) + 14px + var(--swH) + 16px);bottom:auto}
}
/* Dar masaustu (1200-1239 px, sutun < 266 px): aciklama 5 satira, kontrol basliklari 2 satira inebilir; ayrilan alan buna gore */
@media (min-width:1200px) and (max-width:1239px){
  .stage{--infoH:190px;--swH:128px}
  .n-d{min-height:100px}
  .sw .seg-l{min-height:30px}
}
@media (min-width:761px){
  .stage a,.stage button{scroll-margin-top:calc(var(--bar) + 8px)}
}

/* 1199 px alti (mobil, tablet): kontrol seridi fotografin alt kenarinda kagit zeminli; basta kontrol yonergesi, sonra iki baslikli grup */
@media (max-width:1199px){
  .stage{--nbar:calc(52px + env(safe-area-inset-bottom))}
  .plates{bottom:var(--nbar)}
  .panel{padding:0 0 env(safe-area-inset-bottom)}
  .sw{position:absolute;left:16px;right:0;bottom:100%;width:auto;height:auto;padding:0 16px 14px;box-sizing:border-box;background:var(--paper);display:grid;grid-template-columns:1fr 1fr;column-gap:20px;row-gap:2px;border-bottom:0;z-index:4}
  .sw:before{content:"";grid-column:1/-1;height:6px;margin:0 -16px 8px;background:linear-gradient(#2d241d,#6b5846 45%,#2a221b)}
  .hint{grid-column:1/-1;grid-row:2;margin:0 0 8px;min-height:2.8em}
  .seg-l{display:block}
  .ly{grid-area:3/1}.sy{grid-area:4/1}.lz{grid-area:3/2}.sz{grid-area:4/2}
  .sw .seg{flex:none;display:flex;gap:6px;border:0;box-shadow:none;position:relative}
  .sw .seg+.seg{margin-left:0}.sw .seg+.seg:before{display:none}
  .sw button{flex:1 1 0;min-height:44px;height:44px;padding:0 4px;font:500 14px var(--sans);color:var(--ink);background:none;box-shadow:inset 0 0 0 1px rgba(20,24,27,.45)}
  .sw button:hover{color:var(--ink)}
  .sw button[aria-pressed=true]{background:var(--ink);color:var(--paper);box-shadow:none}
  .sw :focus-visible{outline:3px solid var(--film);outline-offset:2px}
  .needs{max-height:none;overflow:visible}
}

/* Mobil: bilgi grubu fotografin hemen ustunde, ortali; en uzun duruma gore ayrilmis alan (11.2em: etiket + 2 satir ad + bakis · zaman + 3 satir aciklama) */
@media (max-width:760px),(max-width:1199px) and (orientation:portrait){
  .note{left:16px;right:16px;top:calc(var(--whot) + 48px);width:auto;min-height:14.2em;display:flex;flex-direction:column;justify-content:flex-end;padding:0;background:none;font-size:15px;line-height:1.4;text-align:center}
  .n-l{font-size:13px;line-height:1.25}
  .n-t{margin:.25em 0 0;font-size:clamp(22px,6.2vw,24px);line-height:1.15}
  .n-s{margin:.15em 0 0;line-height:1.35}
  .n-d{margin:.4em 0 0;line-height:1.4;min-height:0}
  /* gece bağlantısı mobilde de görünür: ayrı satır, 44 px dokunma alanı; ayrılan alan buna göre (14.2em = etiket + 2 satır ad + alt satır + 3 satır açıklama + 44 px bağlantı), içerik alta hizalı: fazla boşluk grubun üstünde, grup fotoğrafın hemen üstünde */
  .n-d a{display:flex;align-items:center;justify-content:center;min-height:44px}
  /* fotograf penceresi eski boyutunda kalir (kadraj ve gradyanlar ayni); serit ekleme kadar pencerenin altina, kagit zemine tasar */
  .plates{bottom:calc(var(--nbar) + var(--dstrip))}
  .sw .seg-l{font-size:13px;line-height:16px}
  .row-acts button,.row-acts a{scroll-margin-top:104px}
}
/* Yatay tablet: bilgi grubu fotografin sol ustunde, kagit zeminli */
@media (min-width:761px) and (max-width:1199px) and (orientation:landscape){
  .note{left:32px;top:calc(var(--pt) + 16px);width:min(320px,calc(100% - 64px));min-height:170px;padding:14px 16px;background:var(--paper);text-align:left}
  .row-acts button,.row-acts a{scroll-margin-top:120px}
}
@media (min-width:1200px){
  .row-acts button,.row-acts a{scroll-margin-top:120px}
}