@font-face{font-family:"Archivo";font-style:normal;font-weight:400 900;font-stretch:62% 125%;font-display:swap;src:url(/assets/fonts/archivo-latin-ext.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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Archivo";font-style:normal;font-weight:400 900;font-stretch:62% 125%;font-display:swap;src:url(/assets/fonts/archivo-latin.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:"Courier Prime";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/courier-400-latin-ext.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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Courier Prime";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/courier-400-latin.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:"Courier Prime";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/courier-700-latin-ext.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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Courier Prime";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/courier-700-latin.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}
:root{
  --paper:#F3EFE6;
  --parch:#D8C6A3;
  --ink:#1D1B18;
  --ink-soft:#5A554C;
  --red:#A8171C;
  --marker:#F4C20D;
  --wall:#C3D0BE;
  --wall-low:#5E7764;
  --rail:#46594B;
  --sans:"Archivo","Arial Narrow",Arial,sans-serif;
  --type:"Courier Prime","Courier New",Courier,monospace;
  color-scheme:light;
  box-sizing:border-box;
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:1.0625rem;line-height:1.55}
img{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--marker);outline-offset:3px}
.wrap{max-width:1240px;margin:0 auto;padding:0 clamp(18px,4vw,44px)}
h2.big{margin:0;font-weight:850;font-variation-settings:"wdth" 112;font-size:clamp(2.2rem,5vw,4rem);line-height:.95;letter-spacing:-.01em}

/* Olay yeri */
.scene{position:relative;height:min(100svh,920px);min-height:620px;overflow:hidden;background:#000;color:#fff;--x:50%;--y:45%;--r:240px;touch-action:pan-y}
.strips{position:absolute;inset:0;display:grid;grid-template-columns:repeat(8,1fr)}
.strip{position:relative;border:0;padding:0;background:#000;overflow:hidden;cursor:crosshair}
.strip + .strip{box-shadow:inset 1px 0 0 rgba(255,255,255,.07)}
.strip img{width:100%;height:100%;object-fit:cover;filter:saturate(.85) contrast(1.05)}
.strip .tag{position:absolute;z-index:3;left:50%;top:104px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;opacity:0;transition:opacity .35s;pointer-events:none;width:88%}
.strip .tag .tent{display:grid;place-items:center;width:40px;height:32px;background:var(--marker);color:#111;font-weight:800;font-size:1rem;clip-path:polygon(18% 0,82% 0,100% 100%,0 100%);box-shadow:inset 0 -5px 0 rgba(0,0,0,.18)}
.strip .tag .t{background:var(--marker);color:#111;font-family:var(--type);font-weight:700;font-size:.8rem;line-height:1.2;padding:4px 7px;text-align:center}
.strip.found .tag{opacity:1}
.strip.found{cursor:pointer}
.dark{position:absolute;inset:0;pointer-events:none;z-index:2;background:radial-gradient(circle var(--r) at var(--x) var(--y),rgba(0,0,0,0) 0%,rgba(0,0,0,.2) 45%,rgba(0,0,0,.975) 100%);transition:opacity 1.4s ease}
.scene.done .dark{opacity:.5}
.scene-top{position:absolute;z-index:4;top:0;left:0;right:0;padding-top:env(safe-area-inset-top,0px)}
.scene-top .wrap{display:flex;justify-content:space-between;align-items:center;height:84px}
.logo{position:relative;display:block;width:168px;transform:rotate(-2.5deg);text-decoration:none}
.logo img{width:100%;height:auto;box-shadow:0 6px 14px rgba(0,0,0,.5)}
.logo::before{content:"";position:absolute;left:50%;top:-9px;width:62px;height:18px;transform:translateX(-50%) rotate(3deg);background:rgba(232,224,200,.75);box-shadow:0 1px 2px rgba(0,0,0,.2)}
.logo .fallback{display:none;font-weight:900;font-size:1.6rem;color:var(--red);background:var(--parch);padding:6px 14px}
.scene-top nav{display:flex;gap:26px;font-weight:600;font-size:.95rem}
.scene-top nav a{text-decoration:none;opacity:.85}
.scene-top nav a:hover{opacity:1;text-decoration:underline;text-underline-offset:4px}
.scene-copy{position:absolute;z-index:4;left:0;right:0;bottom:0;padding-bottom:calc(34px + env(safe-area-inset-bottom,0px));pointer-events:none}
.scene-copy .wrap{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;flex-wrap:wrap}
.scene h1{margin:0;font-weight:850;font-variation-settings:"wdth" 112;font-size:clamp(2.5rem,6.6vw,6rem);line-height:.92;letter-spacing:-.015em;text-shadow:0 2px 24px rgba(0,0,0,.7);max-width:13ch}
.scene .lede{margin:16px 0 0;max-width:46ch;font-size:clamp(1rem,1.5vw,1.15rem);color:rgba(255,255,255,.85);text-shadow:0 1px 12px rgba(0,0,0,.9)}
.count{pointer-events:auto;font-family:var(--type);font-size:.95rem;line-height:1.45;max-width:31ch;margin:0;border-left:4px solid var(--marker);padding:4px 0 4px 14px;text-shadow:0 1px 10px #000}
.count b{color:var(--marker)}
.count .ok{display:none}
.scene.done .count .q{display:none}
.scene.done .count .ok{display:inline}
.count a{color:var(--marker)}

/* Dosyalar */
.files{background:#141412;color:#fff;padding:clamp(56px,7vw,96px) 0 0}
.files .head{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:28px}
.files .head p{margin:0;max-width:44ch;color:rgba(255,255,255,.7)}
.tabs{display:flex;gap:10px;overflow-x:auto;scrollbar-width:thin;padding:0 0 0 2px;scroll-snap-type:x proximity}
.tab{flex:0 0 auto;scroll-snap-align:start;display:flex;align-items:center;gap:10px;border:0;cursor:pointer;background:#2a2925;padding:8px 14px 8px 8px;border-radius:6px 6px 0 0;text-align:left;opacity:.75;transition:opacity .2s,background .2s}
.tab img{width:38px;height:48px;object-fit:cover;border-radius:2px}
.tab small{display:block;font-family:var(--type);font-size:.72rem;opacity:.8}
.tab span{font-weight:750;font-variation-settings:"wdth" 90;font-size:.95rem;white-space:nowrap}
.tab:hover{opacity:1}
.tab[aria-selected="true"]{opacity:1;background:var(--parch);color:var(--ink)}

.panel{background:var(--parch) url("/assets/img/doku.webp") center/cover;color:var(--ink);position:relative}
.case-hero{position:relative;height:clamp(300px,38vw,480px);overflow:hidden;background:#000}
.case-hero .bg{position:absolute;inset:-40px;width:calc(100% + 80px);height:calc(100% + 80px);max-width:none;object-fit:cover;filter:blur(26px) brightness(.5) saturate(1.1)}
.case-hero .poster{position:absolute;z-index:1;top:30px;height:calc(100% - 60px);width:auto;max-width:40%;right:max(22px,calc((100% - 1240px) / 2 + 44px));background:#FBF8F0;padding:8px;transform:rotate(2deg);box-shadow:0 22px 44px -10px rgba(0,0,0,.75)}
.case-title .wrap > div{max-width:56%}
.case-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05) 30%,rgba(0,0,0,.82))}
.case-title{position:absolute;z-index:1;left:0;right:0;bottom:0;color:#fff}
.case-title .wrap{padding-bottom:96px}
.case-title small{display:block;font-family:var(--type);font-size:1rem;color:var(--marker)}
.case-title .case-h{margin:2px 0 4px;font-weight:900;font-variation-settings:"wdth" 108;font-size:clamp(2.4rem,6vw,5rem);line-height:.92;text-transform:uppercase;letter-spacing:-.01em}
.case-title p{margin:0;font-size:1.05rem;color:rgba(255,255,255,.85)}
.case-hero .state{position:absolute;z-index:2;top:22px;left:22px;font-weight:800;font-size:.85rem;letter-spacing:.06em;padding:5px 12px;border:2px solid currentColor;transform:rotate(-4deg)}
.state.on{color:var(--marker)}
.state.soon{color:#fff;opacity:.8;border-style:dashed}

.case-body{display:grid;grid-template-columns:minmax(0,270px) minmax(0,1fr) minmax(0,290px);gap:clamp(24px,4vw,52px);padding-top:clamp(36px,5vw,60px);padding-bottom:clamp(30px,4vw,48px);align-items:start}
.polaroids{display:flex;flex-direction:column;gap:22px;margin-top:-70px;position:relative;z-index:2}
.polaroid{margin:0;background:#FBF8F0;padding:12px 12px 14px;box-shadow:0 14px 26px -10px rgba(0,0,0,.55);transform:rotate(-3deg);position:relative}
.polaroid:nth-child(2){transform:rotate(3deg)}
.polaroids.two .polaroid:nth-child(2){margin-top:-62%;margin-left:30%;width:76%}
.polaroid::before{content:"";position:absolute;left:50%;top:-12px;width:90px;height:24px;transform:translateX(-50%) rotate(-4deg);background:rgba(225,214,183,.82);box-shadow:0 1px 2px rgba(0,0,0,.15)}
.polaroid img{aspect-ratio:4/5;object-fit:cover;width:100%;background:#ccc}
.polaroid figcaption{font-family:var(--type);text-align:center;font-size:.92rem;line-height:1.35;padding-top:10px}
.polaroid figcaption b{display:block;font-family:var(--sans);font-size:1.05rem}
.blurb{margin:0 0 18px;font-weight:650;font-size:clamp(1.15rem,1.9vw,1.4rem);line-height:1.42;max-width:44ch}
.ask{margin:0 0 26px;font-weight:850;font-variation-settings:"wdth" 100;font-size:clamp(1.15rem,2vw,1.45rem);line-height:1.2;color:var(--red);text-transform:uppercase;max-width:30ch}
.btn{display:inline-block;background:var(--ink);color:#fff;text-decoration:none;font-weight:700;padding:14px 22px;border:0;cursor:pointer}
.btn:hover{background:var(--red)}
.kutu{position:relative;background:#EFE4CB;padding:24px 22px 20px;box-shadow:0 10px 22px -12px rgba(0,0,0,.5);transform:rotate(1deg)}
.kutu::before{content:"";position:absolute;right:26px;top:-11px;width:80px;height:22px;transform:rotate(5deg);background:rgba(225,214,183,.85)}
.kutu h4{margin:0 0 10px;font-weight:850;font-size:1.05rem;letter-spacing:.04em}
.kutu ul{margin:0;padding:0;list-style:none;font-family:var(--type);font-size:.9rem;line-height:1.4}
.kutu li{position:relative;padding-left:16px;margin:6px 0}
.kutu li::before{content:"";position:absolute;left:0;top:.45em;width:7px;height:7px;border-radius:50%;background:var(--red)}

.case-lineup{padding-bottom:clamp(44px,6vw,72px)}
.case-lineup h4{margin:0 0 14px;font-weight:850;font-size:1.05rem;letter-spacing:.04em}
.chart{position:relative;padding:22px 0 0 40px;background:repeating-linear-gradient(to bottom,rgba(29,27,24,.35) 0 1px,transparent 1px 46px)}
.chart .cm{position:absolute;left:0;top:0;display:flex;flex-direction:column;font-family:var(--type);font-size:.72rem;color:var(--ink-soft)}
.chart .cm span{height:46px;line-height:1;transform:translateY(-.5em)}
.people{display:flex;gap:14px;overflow-x:auto;padding-bottom:12px;scrollbar-width:thin;scroll-snap-type:x proximity}
.person{flex:0 0 clamp(118px,13vw,150px);margin:0;scroll-snap-align:start}
.person img{aspect-ratio:4/5;object-fit:cover;width:100%;background:#9c917c}
.person figcaption{margin-top:6px;background:#111;color:#fff;font-family:var(--type);font-size:.85rem;padding:3px 8px}
.person figcaption b{color:var(--marker)}

/* Tutanak */
.wall{background:linear-gradient(var(--wall) 0 72%,var(--rail) 72% calc(72% + 6px),var(--wall-low) calc(72% + 6px));padding:clamp(56px,8vw,110px) 0}
.wall .wrap{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,5vw,72px);align-items:start}
.wall .intro p{margin:16px 0 0;max-width:38ch;font-size:1.1rem}
.sheet{position:relative;background:#FCFCF8;padding:clamp(24px,4vw,44px);transform:rotate(.6deg);box-shadow:0 1px 0 #e3e2da,0 18px 30px -12px rgba(30,40,30,.45);font-family:var(--type)}
.sheet .h{display:flex;justify-content:space-between;gap:12px;border-bottom:2px solid var(--ink);padding-bottom:10px;margin-bottom:6px;font-family:var(--sans);font-weight:800;font-variation-settings:"wdth" 75;font-size:1.05rem;letter-spacing:.06em}
.sheet dl{margin:0}
.sheet .row{display:grid;grid-template-columns:9.5rem 1fr;gap:14px;padding:11px 0;border-bottom:1px dashed #b9b8b0}
.sheet dt{font-family:var(--sans);font-weight:700;font-variation-settings:"wdth" 75;font-size:.9rem;color:var(--ink-soft);padding-top:2px}
.sheet dd{margin:0;line-height:1.45}
.sheet .sign{display:flex;justify-content:space-between;margin-top:22px;font-size:.9rem;color:var(--ink-soft)}
.stamp{position:absolute;right:-14px;bottom:-30px;transform:rotate(-14deg);color:var(--red);opacity:.85;border:3px double currentColor;border-radius:50%;width:122px;height:122px;display:grid;place-items:center;text-align:center;font-weight:900;font-variation-settings:"wdth" 80;font-size:.95rem;line-height:1.05;letter-spacing:.04em;mix-blend-mode:multiply}

/* Şüpheliler mozaiği */
.faces{background:#000;color:#fff;padding:clamp(56px,7vw,96px) 0}
.faces .head{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:28px}
.faces .head p{margin:0;max-width:40ch;color:rgba(255,255,255,.7)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:4px}
.face{position:relative;border:0;padding:0;background:#222;cursor:pointer;aspect-ratio:4/5;overflow:hidden}
.face img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.1) brightness(.8);transition:filter .25s}
.face:hover img,.face:focus-visible img{filter:none}
.face span{position:absolute;left:0;right:0;bottom:0;background:var(--marker);color:#111;font-family:var(--type);font-size:.7rem;line-height:1.2;padding:2px 4px;opacity:0;transition:opacity .2s}
.face:hover span,.face:focus-visible span{opacity:1}

/* Satış */
.buy{background:var(--marker);color:#111}
.buy .wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:28px;align-items:center;padding-top:48px;padding-bottom:48px}
.buy h2{margin:0;font-weight:850;font-variation-settings:"wdth" 112;font-size:clamp(1.9rem,4vw,3.1rem);line-height:1}
.buy p{margin:10px 0 0;max-width:46ch}
.buy ul{list-style:none;margin:0;padding:0;font-family:var(--type);font-size:1rem}
.buy li{border-top:1.5px solid #111;padding:10px 0;display:flex;justify-content:space-between;gap:12px}
.buy li a{font-weight:700}

/* SSS */
.sec{padding:clamp(56px,8vw,100px) 0}
.faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 44px;margin-top:28px}
details{border-top:1.5px solid var(--ink);padding:16px 0}
summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:14px;font-weight:700;font-size:1.08rem}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-weight:400;font-size:1.4rem;line-height:1}
details[open] summary::after{content:"−"}
details p{margin:10px 0 0;color:var(--ink-soft);max-width:52ch}

footer{background:#000;color:rgba(255,255,255,.7);font-size:.9rem;padding:40px 0 calc(40px + env(safe-area-inset-bottom,0px))}
footer .wrap{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap}
footer p{margin:4px 0 0;max-width:52ch}

/* Ek: SEO turu */
.eyebrow{display:block;font-family:var(--type);font-weight:700;font-size:clamp(.85rem,1.3vw,1rem);letter-spacing:.02em;color:var(--marker);text-shadow:0 1px 10px #000;margin-bottom:12px}
.panel[hidden]{display:none}
.case-link{display:inline-block;margin-left:14px;font-weight:700;text-underline-offset:4px}
.topbar{background:#000;color:#fff}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:76px}
.topbar .logo{width:140px}
.topbar nav{display:flex;gap:22px;font-weight:600;font-size:.95rem}
.topbar nav a{text-decoration:none;opacity:.85}
.crumbs{margin:0;font-family:var(--type);font-size:.85rem;color:rgba(255,255,255,.7);padding:12px 0}
.crumbs a{color:inherit}
.page-case .case-hero{height:clamp(320px,42vw,520px)}
.others{background:#141412;color:#fff;padding:clamp(48px,6vw,80px) 0}
.others ul{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.others a{display:flex;gap:12px;align-items:center;background:#2a2925;padding:10px;text-decoration:none;border-radius:4px}
.others a:hover{background:#3a3833}
.others img{width:48px;height:60px;object-fit:cover;border-radius:2px}
.others small{display:block;font-family:var(--type);font-size:.75rem;opacity:.75}
.others span{font-weight:750}

@media (max-width:980px){
  .case-body{grid-template-columns:minmax(0,220px) minmax(0,1fr)}
  .kutu{grid-column:1 / -1}
  .wall .wrap,.buy .wrap{grid-template-columns:1fr}
  .wall{background:linear-gradient(var(--wall) 0 82%,var(--rail) 82% calc(82% + 6px),var(--wall-low) calc(82% + 6px))}
  .faq{grid-template-columns:1fr}
}
@media (max-width:640px){
  .scene{--r:150px;min-height:660px}
  .strips{grid-template-columns:repeat(4,1fr);grid-template-rows:1fr 1fr}
  .strip .tag{top:auto;bottom:14px}
  .strip .tag .t{font-size:.68rem}
  .strip:nth-child(-n+4) .tag{top:96px;bottom:auto}
  .scene-top nav a:not(.keep){display:none}
  .logo{width:132px}
  .count{max-width:none}
  .case-body{grid-template-columns:1fr}
  .case-hero .poster{display:none}
  .case-hero .bg{inset:0;width:100%;height:100%;filter:brightness(.6)}
  .case-title .wrap > div{max-width:none}
  .polaroids{flex-direction:row;margin-top:-70px;gap:14px;max-width:340px}
  .polaroid{flex:1;max-width:220px}
  .polaroids.two .polaroid:nth-child(2){margin:0;width:auto}
  .sheet .row{grid-template-columns:1fr;gap:2px}
  .stamp{width:96px;height:96px;font-size:.78rem;right:-6px;bottom:-26px}
  .grid{grid-template-columns:repeat(auto-fill,minmax(62px,1fr))}
  .topbar nav a:not(:last-child){display:none}
  .topbar .logo{width:120px}
}
