/* Hit Studios — ortak stiller (tüm sayfalar) */
:root{
  --paper:#EEEBE3;
  --paper-2:#E4E0D5;
  --ink:#111110;
  --ink-2:#1C1C1A;
  --mute:#625F58;
  --line:rgba(17,17,16,.14);
  --line-d:rgba(238,235,227,.18);
  --signal:#FF3B1F;
  --fg-2:#34322E;
  --fg-3:#45433E;
  --ph:rgba(17,17,16,.3);
  --ring:rgba(17,17,16,.35);
  --bg-rgb:238,235,227;
  /* her iki temada da koyu kalan "ters" alanlar */
  --inv-bg:#111110;
  --inv-bg-rgb:17,17,16;
  --inv-fg:#EEEBE3;
  --inv-ink:#111110;
  --inv-border:transparent;
  --ok-bg:#DCEFE3;--ok-fg:#14532D;--bad-bg:#FFE1DB;--bad-fg:#8A1C0B;
  --grain:.07;
  color-scheme:light;
  --sans:"Archivo","Helvetica Neue",Arial,sans-serif;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --gut:clamp(16px,3.2vw,48px);
  --ease:cubic-bezier(.7,0,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}
/* ---------- KARANLIK TEMA ---------- */
:root[data-theme="dark"]{
  --paper:#121211;--paper-2:#1B1B19;--ink:#ECE8DF;--ink-2:#DAD6CC;--mute:#9C988E;
  --line:rgba(236,232,223,.14);--fg-2:#CFCBC1;--fg-3:#B8B4AA;--ph:rgba(236,232,223,.3);--ring:rgba(236,232,223,.4);
  --bg-rgb:18,18,17;--inv-bg:#1C1C1A;--inv-bg-rgb:28,28,26;--inv-border:rgba(236,232,223,.08);
  --ok-bg:#12351F;--ok-fg:#9FE0B5;--bad-bg:#3D1610;--bad-fg:#FFB4A6;--grain:.05;
  color-scheme:dark;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:#121211;--paper-2:#1B1B19;--ink:#ECE8DF;--ink-2:#DAD6CC;--mute:#9C988E;
    --line:rgba(236,232,223,.14);--fg-2:#CFCBC1;--fg-3:#B8B4AA;--ph:rgba(236,232,223,.3);--ring:rgba(236,232,223,.4);
    --bg-rgb:18,18,17;--inv-bg:#1C1C1A;--inv-bg-rgb:28,28,26;--inv-border:rgba(236,232,223,.08);
    --ok-bg:#12351F;--ok-fg:#9FE0B5;--bad-bg:#3D1610;--bad-fg:#FFB4A6;--grain:.05;
    color-scheme:dark;
  }
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);transition:background-color .5s var(--ease),color .5s var(--ease);font-family:var(--sans);font-size:16px;line-height:1.45;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,input,textarea,select{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
::selection{background:var(--signal);color:var(--paper)}
:focus-visible{outline:2px solid var(--signal);outline-offset:3px}
.it{font-family:var(--serif);font-style:italic;font-weight:300;letter-spacing:-.01em}
.wrap{padding-inline:var(--gut)}
.label{font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:500;font-variation-settings:"wdth" 100}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* kâğıt dokusu */
body::after{content:"";position:fixed;inset:-50%;pointer-events:none;z-index:400;opacity:var(--grain);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-4%)}60%{transform:translate(-4%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}

/* ---------- İMLEÇ ---------- */
.cur,.cur-ring{position:fixed;top:0;left:0;pointer-events:none;z-index:390;border-radius:50%}
.cur{width:8px;height:8px;margin:-4px 0 0 -4px;background:var(--signal)}
.cur-ring{width:44px;height:44px;margin:-22px 0 0 -22px;border:1px solid var(--ring);display:grid;place-items:center;
  transition:width .35s var(--ease-out),height .35s var(--ease-out),margin .35s var(--ease-out),background .35s,border-color .35s}
.cur-ring span{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--paper);opacity:0;transition:opacity .2s}
.cur-ring.big{width:96px;height:96px;margin:-48px 0 0 -48px;background:var(--signal);border-color:var(--signal)}
.cur-ring.big span{opacity:1}
.cur-ring.link{width:64px;height:64px;margin:-32px 0 0 -32px;border-color:var(--signal)}
.cur.hide{opacity:0}
.cur,.cur-ring{display:none}
body.has-cursor .cur,body.has-cursor .cur-ring{display:grid}
body.has-cursor,body.has-cursor a,body.has-cursor button,body.has-cursor label{cursor:none}
body.has-cursor input,body.has-cursor textarea{cursor:text}

/* ---------- NAV ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  padding:calc(env(safe-area-inset-top,0px) + 18px) var(--gut) 18px;color:var(--ink);transition:color .4s,transform .6s var(--ease)}
.nav::before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background:rgba(var(--bg-rgb),.84);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);opacity:0;transition:opacity .4s,background .4s}
.nav.solid::before{opacity:1}
.nav.dark{color:var(--inv-fg)}
.nav.dark::before{background:rgba(var(--inv-bg-rgb),.84)}
.nav.away{transform:translateY(-110%)}
.logo{font-weight:800;font-size:19px;letter-spacing:-.02em;display:flex;align-items:baseline;gap:2px;font-variation-settings:"wdth" 110;justify-self:start}
.logo b{color:var(--signal);font-weight:900}
.logo span{font-weight:300;font-variation-settings:"wdth" 80}
.nav .clock{white-space:nowrap;font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-variant-numeric:tabular-nums}
.nav ul{list-style:none;display:flex;gap:28px;justify-self:end}
.nav ul a{font-size:14px;font-weight:500;position:relative;display:inline-block;overflow:hidden;height:1.3em;line-height:1.3em}
.nav ul a span{display:block;transition:transform .5s var(--ease)}
.nav ul a span+span{position:absolute;top:100%;left:0}
.nav ul a:hover span{transform:translateY(-100%)}
.menu-btn{display:none;font-size:14px;font-weight:600;padding:12px 4px;min-height:44px}
.nav-r{justify-self:end;display:flex;align-items:center;gap:22px}
.theme-btn{width:38px;height:38px;border-radius:50%;border:1px solid currentColor;display:grid;place-items:center;position:relative;overflow:hidden;opacity:.85;transition:opacity .3s,background .3s,color .3s,border-color .3s}
.theme-btn:hover{opacity:1;background:var(--signal);border-color:var(--signal);color:var(--inv-ink)}
.theme-btn svg{width:16px;height:16px;position:absolute;transition:transform .6s var(--ease),opacity .4s}
.theme-btn .moon{transform:translateY(0)}
.theme-btn .sun{transform:translateY(140%);opacity:0}
.is-dark .theme-btn .moon{transform:translateY(-140%);opacity:0}
.is-dark .theme-btn .sun{transform:translateY(0);opacity:1}
.sheet .sheet-theme{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:15px;border:1px solid currentColor;border-radius:999px;padding:10px 16px;margin-top:24px}
@media (max-width:1000px){.nav{grid-template-columns:1fr auto}.nav .clock{display:none}}
@media (max-width:760px){.nav-r>nav{display:none}.menu-btn{display:block}.nav-r{gap:12px}.theme-btn{width:40px;height:40px}}

.sheet{position:fixed;top:0;right:0;bottom:0;left:0;z-index:150;background:var(--signal);color:var(--inv-ink);padding:calc(env(safe-area-inset-top,0px) + 90px) var(--gut) calc(env(safe-area-inset-bottom,0px) + var(--gut));
  display:flex;flex-direction:column;justify-content:space-between;clip-path:circle(0% at calc(100% - 40px) 34px);transition:clip-path .8s var(--ease);visibility:hidden;overflow-y:auto;overscroll-behavior:contain}
.sheet.open{clip-path:circle(150% at calc(100% - 40px) 34px);visibility:visible}
.sheet :focus-visible{outline-color:var(--inv-ink)}
.sheet a.big{display:block;font-size:clamp(2.4rem,min(16vw,11vh),7rem);font-weight:800;line-height:.95;letter-spacing:-.03em;font-variation-settings:"wdth" 75}
.sheet .close{position:absolute;top:calc(env(safe-area-inset-top,0px) + 12px);right:var(--gut);font-weight:600;font-size:14px;padding:12px 4px;min-height:44px}

/* ---------- AÇILIŞ ANİMASYONLARI ---------- */
.mask{display:block;overflow:hidden;padding-block:.14em .16em;margin-block:-.14em -.16em}
.mask>span{display:block;transform:translateY(105%);transition:transform 1.1s var(--ease-out)}
.in .mask>span,.mask.in>span{transform:none}
.rv{opacity:0;transform:translateY(30px);transition:opacity 1s var(--ease-out),transform 1s var(--ease-out)}
.rv.in{opacity:1;transform:none}

/* ---------- BUTONLAR ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;border-radius:999px;padding:14px 22px;font-weight:600;font-size:15px;background:var(--ink);color:var(--paper);transition:background .3s,color .3s,transform .3s var(--ease-out)}
.btn:hover{background:var(--signal);color:var(--inv-ink)}
.btn.ghost{background:transparent;color:inherit;border:1px solid currentColor}
.btn.ghost:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn[disabled]{opacity:.5;pointer-events:none}

/* ---------- FOOTER ---------- */
.foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-block:28px calc(env(safe-area-inset-bottom,0px) + 28px);font-size:13px;color:rgba(238,235,227,.55)}
.foot a:hover{color:var(--inv-fg)}
.foot nav{display:flex;gap:6px 22px;flex-wrap:wrap}
.foot nav a,.foot nav button{padding:10px 0;display:inline-block}
.foot button{font-size:13px;color:inherit;padding:0}
.foot button:hover{color:var(--inv-fg)}

/* ---------- PROJE FORMU (MODAL) ---------- */
.brief{position:fixed;top:0;right:0;bottom:0;left:0;z-index:300;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);background:var(--paper);
  clip-path:inset(100% 0 0 0);transition:clip-path .9s var(--ease);visibility:hidden}
.brief.open{clip-path:inset(0 0 0 0);visibility:visible}
.brief aside{background:var(--inv-bg);color:var(--inv-fg);border-right:1px solid var(--inv-border);padding:calc(env(safe-area-inset-top,0px) + 30px) var(--gut) var(--gut);display:flex;flex-direction:column;justify-content:space-between;gap:30px}
.brief aside h2{font-size:clamp(3rem,7vw,7rem);line-height:.86;font-weight:800;letter-spacing:-.015em;font-variation-settings:"wdth" 65}
.brief aside h2 .it{color:var(--signal);font-weight:300}
.brief aside p{color:rgba(238,235,227,.7);max-width:36ch}
.brief aside .alt{display:grid;gap:8px;font-size:15px}
.brief aside .alt a{color:var(--inv-fg);border-bottom:1px solid rgba(238,235,227,.25);padding-bottom:8px;display:flex;justify-content:space-between;gap:10px}
.brief aside .alt a:hover{color:var(--signal)}
.brief aside .alt small{color:rgba(238,235,227,.5)}
.brief form{overflow-y:auto;padding:calc(env(safe-area-inset-top,0px) + 30px) var(--gut) calc(env(safe-area-inset-bottom,0px) + 40px);display:flex;flex-direction:column;gap:30px}
.brief .x{align-self:flex-end;display:flex;align-items:center;gap:10px;font-weight:600;font-size:14px;padding:6px 0}
.brief .x i{width:38px;height:38px;border-radius:50%;border:1px solid var(--ink);display:grid;place-items:center;font-style:normal;transition:transform .5s var(--ease),background .3s}
.brief .x:hover i{transform:rotate(90deg);background:var(--signal);border-color:var(--signal)}
.field{display:grid;gap:10px}
.field>span{font-size:13px;color:var(--mute)}
.field>span b{color:var(--signal);font-weight:500}
.field input,.field textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--ink);padding:10px 0 12px;font-size:clamp(20px,2.2vw,28px);font-variation-settings:"wdth" 90;border-radius:0;outline:none;transition:border-color .3s}
.field textarea{resize:vertical;min-height:120px;font-size:20px;line-height:1.4}
.field input:focus,.field textarea:focus{border-color:var(--signal)}
.field input::placeholder,.field textarea::placeholder{color:var(--ph)}
.field.err input,.field.err textarea{border-color:var(--signal)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips label{position:relative}
.chips input{position:absolute;opacity:0;top:0;right:0;bottom:0;left:0}
.chips span{display:block;border:1px solid var(--line);border-radius:999px;padding:10px 16px;font-size:15px;transition:background .25s,color .25s,border-color .25s}
.chips input:checked+span{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.chips input:focus-visible+span{outline:2px solid var(--signal);outline-offset:2px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:var(--fg-3)}
.consent input{width:20px;height:20px;accent-color:var(--signal);flex:none;margin-top:1px}
.consent.err{color:var(--bad-fg)}
.consent.err input{outline:2px solid var(--signal);outline-offset:2px}
.consent a{text-decoration:underline;text-underline-offset:3px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.status{font-size:15px;padding:14px 18px;border-radius:10px;display:none}
.status.on{display:block}
.status.ok{background:var(--ok-bg);color:var(--ok-fg)}
.status.bad{background:var(--bad-bg);color:var(--bad-fg)}
.send{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.send small{color:var(--mute);font-size:13px}
@media (max-width:900px){
  .brief{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  .brief aside{padding-bottom:24px}
  .brief aside h2{font-size:clamp(2.6rem,13vw,4.2rem)}
  .brief aside p,.brief aside .alt{display:none}
  .two{grid-template-columns:1fr}
}

/* ---------- ÇEREZ BANDI ---------- */
.cookie{position:fixed;left:var(--gut);bottom:calc(env(safe-area-inset-bottom,0px) + 20px);z-index:250;width:min(420px,calc(100% - 2 * var(--gut)));
  background:var(--inv-bg);color:var(--inv-fg);border:1px solid var(--inv-border);border-radius:14px;padding:22px;box-shadow:0 30px 70px -30px rgba(0,0,0,.6);
  transform:translateY(calc(100% + 40px));transition:transform .8s var(--ease)}
.cookie.on{transform:none}
.cookie h4{font-size:20px;font-weight:700;letter-spacing:-.02em;font-variation-settings:"wdth" 85;margin-bottom:8px;display:flex;align-items:center;gap:10px}
.cookie h4::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--signal)}
.cookie p{font-size:14px;color:rgba(238,235,227,.72);margin-bottom:16px}
.cookie p a{color:var(--inv-fg);text-decoration:underline;text-underline-offset:3px}
.cookie .row{display:flex;gap:8px;flex-wrap:wrap}
.cookie .btn{padding:11px 18px;font-size:14px;background:var(--signal);color:var(--inv-ink)}
.cookie .btn:hover{background:var(--inv-fg)}
.cookie .btn.ghost{background:transparent;color:var(--inv-fg);border-color:rgba(238,235,227,.35)}
.cookie .btn.ghost:hover{background:var(--inv-fg);color:var(--inv-ink)}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .mask>span,.rv{transform:none!important;opacity:1!important}
}