
html{scroll-behavior:smooth}*{box-sizing:border-box}
body.home{margin:0;background:#0c0d10;color:var(--fg);font:17px/1.65 Georgia,"Times New Roman",serif;overflow:hidden}
.m,.hud,td,th,.k,.fl,.chips a,.dm,.gl a{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase}
canvas{position:fixed;inset:0;width:100%;height:100%;z-index:0}
.vig{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 50% 55%,#0000 55%,#07080b88 100%)}
#intro{position:fixed;inset:0;z-index:50;background:#0b0c0f;color:#d9d6cc;display:flex;align-items:flex-end;justify-content:center;text-align:center;padding:0 7vw;cursor:pointer;transition:opacity .9s,visibility .9s}
#intro.out{opacity:0;visibility:hidden}
#intro p{margin:0 0 8px;opacity:0;transform:translateY(6px);transition:opacity .7s,transform .7s}#intro p.on{opacity:1;transform:none}#intro b{color:#e0825a;font-weight:400}
#intro p:first-of-type{font-size:clamp(22px,4.4vw,40px);letter-spacing:.14em;text-transform:uppercase}
.sk{display:block;margin-top:30px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;opacity:.4}
.hud{position:fixed;left:4vw;right:4vw;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:20;display:flex;justify-content:space-between;color:#e9e7e0;transition:opacity .4s;text-shadow:0 1px 6px #0008}
.hud.off{opacity:0}
.sc{position:relative;z-index:5;min-height:100vh;min-height:100svh;padding:90px 4vw 14vh;display:flex;flex-direction:column;justify-content:flex-end;color:#f3f1ea}
.sc h1,.sc h2{font-weight:400;margin:6px 0 14px;line-height:1;text-shadow:0 2px 24px #0007}
.sc h1{font-size:clamp(44px,10vw,128px);letter-spacing:.01em}.sc h2{font-size:clamp(40px,7vw,92px)}
.sc p{max-width:480px;margin:0;text-shadow:0 1px 14px #000a}
.sc>*{opacity:0;transform:translateY(16px);transition:.9s}.sc.in>*{opacity:1;transform:none}
.tag{color:#f0a37e}
.cue{margin-top:26px}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.chips a{color:#f3f1ea;text-decoration:none;border:1px solid #f3f1ea66;padding:8px 14px;backdrop-filter:blur(2px);background:#0003}
.chips a:hover{background:#f3f1ea;color:#0b0d10}.chips i{font-style:normal;color:#f0a37e;margin-left:8px}
.fl{list-style:none;padding:0;margin:26px 0 0;max-width:640px}
.fl li{display:grid;grid-template-columns:92px 1fr;gap:12px;padding:11px 0;border-top:1px solid #f3f1ea40;text-transform:none;letter-spacing:.02em;font-size:13px;line-height:1.45;text-shadow:0 1px 10px #000a}
.fl .d{color:#f0a37e;text-transform:uppercase;letter-spacing:.1em;font-size:11px}.fl small{display:block;opacity:.7;font-size:11px;text-transform:uppercase;letter-spacing:.1em}
.nw{background:#f0a37e;color:#111;padding:1px 6px;margin-right:6px;font-size:10px}
.paper{position:relative;z-index:6;background:var(--bg);color:var(--fg);padding:110px 4vw 40px}
.paper h3{font:400 clamp(28px,4vw,46px)/1.1 Georgia,serif;margin:10px 0 28px;max-width:720px}
.k{color:var(--mut)}.w{max-width:1100px;margin:0 auto}
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;border-top:1px solid var(--line);padding-top:24px}
.three b{display:block;font-weight:400;font-size:22px;margin:6px 0}
table{width:100%;border-collapse:collapse;margin:8px 0 14px}
td,th{text-align:left;padding:14px 10px 14px 0;border-top:1px solid var(--line);font-weight:400;vertical-align:top}th{color:var(--mut)}
td.t{text-transform:none;letter-spacing:.01em;font:15px/1.4 Georgia,serif}
.dm{background:none;border:1px solid var(--line);color:var(--mut);padding:9px 14px;cursor:pointer;margin:6px 0 90px}.dm:hover{border-color:var(--acc);color:var(--acc)}
.mapw{display:grid;grid-template-columns:1.5fr 1fr;gap:40px;margin-bottom:90px;align-items:center}
.mbox{border:1px solid var(--line);background:color-mix(in srgb,var(--bg) 92%,var(--fg))}.mapw svg{width:100%;display:block}
.il{fill:var(--bg);stroke:var(--line);stroke-width:.6;transition:fill .2s}.il.on{fill:color-mix(in srgb,var(--acc) 22%,var(--bg));stroke:var(--acc);stroke-width:1;cursor:pointer}.il.sel{fill:color-mix(in srgb,var(--acc) 45%,var(--bg))}
.ring{fill:none;stroke:var(--acc);stroke-width:1;opacity:.5;pointer-events:none}.dot{fill:var(--acc)}.lb{font:10px ui-monospace,monospace;fill:var(--fg)}
#mpanel h4{font:400 28px Georgia,serif;margin:6px 0 4px}#mpanel ul{padding-left:18px;margin:8px 0}
.steps{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);margin-bottom:90px}
.steps div{padding:22px;border-right:1px solid var(--line)}.steps div:last-child{border:0}
.steps b{display:block;font-weight:400;font-size:20px;margin-top:6px}
body.home footer.hf{border-top:1px solid var(--line);padding:26px 0;color:var(--mut);font-size:14px}
@media(max-width:800px){.three,.steps{grid-template-columns:1fr}.steps div{border-right:0;border-bottom:1px solid var(--line)}.mapw{grid-template-columns:1fr}.hud span:last-child{display:none}table{font-size:10px}.fl li{grid-template-columns:1fr;gap:2px}.sc{padding-bottom:12vh}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}html{scroll-behavior:auto}}

.gl{margin-top:22px}.gl a{color:#f0a37e;text-decoration:none}.gl a:hover{text-decoration:underline}.fl li a{color:inherit;text-decoration:none}.fl li a:hover{color:#f0a37e}td.t a{color:inherit;text-decoration:none}td.t a:hover{color:var(--acc)}#mpanel li a{color:inherit}
.mapw svg text.lb{pointer-events:none}
/* Düzen: koyu sahnelerde okunur etiketler, HUD kâğıt bölümünde tamamen gizli, menüyle çakışma yok */
.sc .k{color:#f0d6c4;text-shadow:0 1px 10px #000a}
.hud.off{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s,visibility 0s .3s}
.sc{scroll-margin-top:0}
.sc>.k:first-child{margin-bottom:4px}
.mapw{margin-top:8px}
@media(max-width:800px){.paper{padding-top:70px}.mapw{gap:22px;margin-bottom:60px}.steps,.three{margin-bottom:50px}}
.pjs{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin-top:22px}
.pj{display:flex;flex-direction:column;gap:8px;padding:22px;border:1px solid currentColor;border-color:#0002;border-radius:12px;text-decoration:none;color:inherit;transition:transform .25s,border-color .25s}
.pj:hover{transform:translateY(-3px);border-color:#e0825a}
.pj b{font-weight:400;font-size:clamp(20px,2.2vw,26px);line-height:1.2}
.pj span{font-size:14.5px;opacity:.75;line-height:1.5}
.pj em{margin-top:auto;padding-top:8px;font-style:normal;color:#c2603a;font-size:13px;letter-spacing:.08em}
.chips .vb{display:block;font-size:10px;letter-spacing:.22em;opacity:.6;margin-bottom:2px;text-transform:uppercase}
.sc .lead{margin:20px 0 0;max-width:30em;font-size:clamp(18px,2.1vw,24px);line-height:1.5;color:#f3f1ea;text-shadow:0 2px 20px #0008}
.cta{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:26px}
.cta .pri{background:#e0825a;color:#14100d;text-decoration:none;padding:13px 22px;font:600 12.5px ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;transition:background .2s}
.cta .pri:hover{background:#f0a37e}
.cta .sec{color:#f3f1ea;font:12.5px ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid #f3f1ea66;padding-bottom:3px}
.cta .sec:hover{border-color:#f3f1ea}

/* Söz bölümü: sahnenin devamı, koyu zeminde büyük tipografi */
.cl{position:relative;z-index:5;min-height:86vh;min-height:86svh;display:flex;align-items:center;padding:12vh 4vw;background:linear-gradient(to bottom,#0c0d1000,#0c0d10dd 35%,#0c0d10)}
.cl .w{max-width:1100px}
.cl .ln{margin:0;font:400 clamp(30px,5.8vw,82px)/1.12 Georgia,"Times New Roman",serif;color:#f3f1ea;letter-spacing:-.01em;opacity:.12;transform:translateY(14px);transition:opacity 1.1s ease,transform 1.1s ease}
.cl .ln.ac{color:#e0825a;font-style:italic}
.cl .sub{margin:34px 0 0;font:15px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em;color:#f3f1ea99;opacity:0;transition:opacity 1.2s ease .2s}
.cl.on .ln{opacity:1;transform:none}.cl.on .ln:nth-child(2){transition-delay:.45s}.cl.on .ln:nth-child(3){transition-delay:.9s}.cl.on .sub{opacity:1;transition-delay:1.5s}
@media(prefers-reduced-motion:reduce){.cl .ln,.cl .sub{opacity:1;transform:none;transition:none}}
.cl .w{width:100%;margin:0 auto}
#ic{position:absolute;inset:0;width:100%;height:100%;display:block}
#intro .it{position:relative;padding-bottom:max(11vh,64px)}
#intro p:nth-of-type(2){font-size:clamp(15px,2.1vw,22px);letter-spacing:.04em;text-transform:none;font-family:Georgia,serif;font-style:italic;max-width:30em;margin-inline:auto;line-height:1.45}
.cl{min-height:0;padding:16vh 4vw 11vh}.paper{padding-top:80px}.paper>.w>h3:first-child{margin-top:0}
