/* Emlak stüdyosu — ortak stiller
   Yapı reel-e.ai'nin modüllerinden; renk, yazı, metin ve görüntüler bu markanın.
   Hareket değerleri animate / emil-design-eng tablolarından: eğriler --ease-* belirteçleri,
   yalnızca transform, opacity ve clip-path hareket eder. */

/* hidden özniteliği her zaman gizler: display tanımlı öğelerde (form, düğme) tarayıcının kendi kuralı eziliyordu */
[hidden]{display:none !important}

/* ── Yazı tipleri: siteden sunulur (Fontshare: Zodiak ve Switzer). Dışarıya istek gitmez ── */
@font-face{font-family:"Zodiak";src:url("fonts/zodiak-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Zodiak";src:url("fonts/zodiak-400-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Switzer";src:url("fonts/switzer-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Switzer";src:url("fonts/switzer-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Switzer";src:url("fonts/switzer-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}

/* ── Belirteçler: gündüz ── */
:root{
  color-scheme:light;
  --bg:#F5F6F4; --bg-lift:#FCFCFB; --panel:#ECEEEB; --panel-2:#E2E5E1;
  --ink:#14181C; --muted:#535C66; --faint:#5F6871;
  --line:rgba(20,24,28,.12); --line-strong:rgba(20,24,28,.3);
  --accent:#F0A830; --accent-hi:#F6BB52; --accent-ink:#2B1B02; --accent-soft:rgba(240,168,48,.2);
  --film:#0B0E11; --film-ink:#EEF0F1; --film-dim:#AEB5BB; --film-line:rgba(255,255,255,.14); --scrim:rgba(8,10,12,.62);
  --glass:rgba(245,246,244,.8);
  --shadow:0 40px 80px -36px rgba(20,24,28,.32),0 16px 32px -20px rgba(20,24,28,.18);
  --shadow-sm:0 14px 24px -18px rgba(20,24,28,.34),0 2px 5px -2px rgba(20,24,28,.14);
  --shadow-frame:0 26px 44px -22px rgba(20,24,28,.6),0 5px 12px -5px rgba(20,24,28,.28);

  --display:"Zodiak","Iowan Old Style",Georgia,serif;
  --text:"Switzer","Helvetica Neue",Arial,sans-serif;
  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-in-out:cubic-bezier(.77,0,.175,1);
  --ease-drawer:cubic-bezier(.32,.72,0,1);
  --wrap:1200px; --gutter:clamp(16px,4vw,48px);
  --sec:clamp(88px,11.5vw,176px);
  --nav-h:72px;
  --r:12px; --r-sm:10px; --r-lg:14px;
}
/* ── Belirteçler: gece (sistem koyuya geçince ya da elle seçilince) ── */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#0E1114; --bg-lift:#13171B; --panel:#191E23; --panel-2:#20262C;
    --ink:#EEF0F1; --muted:#A3ABB3; --faint:#8A929A;
    --line:rgba(255,255,255,.1); --line-strong:rgba(255,255,255,.26);
    --film:#050607; --glass:rgba(14,17,20,.8);
    --shadow:0 40px 80px -36px rgba(0,0,0,.7),0 16px 32px -20px rgba(0,0,0,.5);
    --shadow-sm:0 14px 24px -18px rgba(0,0,0,.7),0 2px 5px -2px rgba(0,0,0,.4);
    --shadow-frame:0 26px 44px -22px rgba(0,0,0,.85),0 5px 12px -5px rgba(0,0,0,.5);
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0E1114; --bg-lift:#13171B; --panel:#191E23; --panel-2:#20262C;
  --ink:#EEF0F1; --muted:#A3ABB3; --faint:#8A929A;
  --line:rgba(255,255,255,.1); --line-strong:rgba(255,255,255,.26);
  --film:#050607; --glass:rgba(14,17,20,.8);
  --shadow:0 40px 80px -36px rgba(0,0,0,.7),0 16px 32px -20px rgba(0,0,0,.5);
  --shadow-sm:0 14px 24px -18px rgba(0,0,0,.7),0 2px 5px -2px rgba(0,0,0,.4);
  --shadow-frame:0 26px 44px -22px rgba(0,0,0,.85),0 5px 12px -5px rgba(0,0,0,.5);
}

/* ── Temel ── */
*{box-sizing:border-box}
html{overflow-x:clip;-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--nav-h) + 16px)}
body{margin:0;overflow-x:clip;background:var(--bg);color:var(--ink);font:400 17px/1.55 var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,video,svg{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;touch-action:manipulation}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:4px}
.wrap{max-width:calc(var(--wrap) + 2*var(--gutter));margin-inline:auto;padding-inline:var(--gutter)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:8px;text-decoration:none}
.skip:focus{top:12px}

h1,h2,h3{font-family:var(--display);font-weight:400;letter-spacing:-.022em;margin:0;text-wrap:balance}
h1 em,h2 em{font-style:italic;letter-spacing:-.026em}
p{margin:0}
.kicker{font-size:12.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.sub{color:var(--muted);font-size:clamp(17px,1.5vw,20px);max-width:46ch;margin:22px auto 0;text-wrap:pretty}

/* ── Düğmeler ── */
/* Düğmeler nesne gibi durur: hap biçim, üstten gelen ışık, ince bir kenar, zemine yakın gölge.
   Üstüne gelince zemin rengi değil üstündeki ince ışık katmanı açılır (yalnızca opaklık), basınca düğme hafifçe küçülür.
   Ok ayrı bir yuvada durur; üstüne gelince yuvanın içinde iki piksel ilerler. */
.btn{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:0 24px;border-radius:999px;font-weight:600;font-size:15.5px;letter-spacing:-.006em;text-decoration:none;white-space:nowrap;transition:transform 160ms var(--ease-out)}
.btn:active{transform:scale(.97)}
.btn::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:#fff;opacity:0;transition:opacity 200ms ease;pointer-events:none}
.btn--primary{color:var(--accent-ink);background:var(--accent) linear-gradient(180deg,#F6BF5C 0%,#F1AC37 50%,#EDA42B 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -1px 0 rgba(120,66,0,.16),0 0 0 1px rgba(166,96,0,.32),0 1px 2px rgba(120,66,0,.28),0 12px 22px -14px rgba(184,112,10,.7)}
.btn--line{color:var(--ink);background:var(--bg-lift);box-shadow:inset 0 0 0 1px var(--line-strong),0 1px 2px rgba(20,24,28,.06)}
.btn--glass{color:var(--film-ink);background:rgba(8,10,12,.5);box-shadow:inset 0 0 0 1px rgba(255,255,255,.34),inset 0 1px 0 rgba(255,255,255,.2);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.btn--lg{min-height:56px;padding:0 30px;font-size:16.5px}
.btn--sm{min-height:44px;padding:0 20px;font-size:15px}
.btn svg{flex:none;box-sizing:border-box;width:32px;height:32px;padding:8px;margin-right:-16px;border-radius:50%;background:rgba(43,27,2,.1);transition:background-color 200ms ease}
.btn--lg svg{width:38px;height:38px;padding:10px;margin-right:-21px}
.btn--line svg{background:var(--panel)}
.btn--glass svg{background:rgba(255,255,255,.14)}
.btn svg path{transform-box:fill-box;transform-origin:center;transition:transform 220ms var(--ease-out)}
.link{display:inline-flex;align-items:center;gap:8px;font-size:15.5px;font-weight:500;text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:5px;text-decoration-thickness:1px;white-space:nowrap;min-height:44px}
.link svg{width:16px;height:16px;flex:none;transition:transform 200ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .btn--primary:hover::after{opacity:.16}
  .btn--primary:hover svg{background:rgba(43,27,2,.17)}
  .btn--line:hover{box-shadow:inset 0 0 0 1px var(--ink),0 1px 2px rgba(20,24,28,.06)}
  .btn--glass:hover::after{opacity:.1}
  .btn--glass:hover svg{background:rgba(255,255,255,.22)}
  .btn:hover svg path{transform:translateX(2px)}
  .link:hover svg{transform:translateX(3px)}
  .link:hover{text-decoration-color:var(--ink)}
}

/* ── Menü ── */
.nav{position:sticky;top:0;z-index:50;background:var(--glass);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);border-bottom:1px solid transparent;transition:border-color 200ms ease}
.nav[data-stuck]{border-color:var(--line)}
.nav__in{display:flex;align-items:center;justify-content:space-between;gap:24px;height:var(--nav-h)}
.brand{font-family:var(--display);font-size:21px;text-decoration:none;letter-spacing:-.01em;white-space:nowrap;display:inline-flex;align-items:center;min-height:44px}
.nav__links{display:flex;gap:clamp(18px,2.4vw,34px);list-style:none;margin:0;padding:0}
.nav__links a{display:block;font-size:15px;color:var(--muted);text-decoration:none;padding:10px 0;white-space:nowrap;transition:color 200ms ease}
.nav__links a[aria-current]{color:var(--ink);box-shadow:inset 0 -1px 0 var(--ink)}
@media (hover:hover) and (pointer:fine){.nav__links a:hover{color:var(--ink)}}
.nav__menu{display:none;min-height:44px;padding:0 14px;border:1px solid var(--line-strong);border-radius:var(--r-sm);font-size:15px;font-weight:500}
@media (max-width:959px){
  :root{--nav-h:60px}
  .nav__cta{display:none}
  .nav__menu{display:inline-flex;align-items:center}
  .nav__links{position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;padding:8px var(--gutter) 18px;background:var(--bg);border-bottom:1px solid var(--line);box-shadow:var(--shadow-sm);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity 200ms var(--ease-out),transform 200ms var(--ease-out),visibility 0s 200ms}
  .nav[data-open] .nav__links{opacity:1;visibility:visible;transform:none;transition-delay:0s}
  .nav__links a{padding:14px 0;font-size:17px;color:var(--ink);border-bottom:1px solid var(--line)}
  .nav__links a[aria-current]{box-shadow:none;font-weight:600}
}

/* ── Hero ── */
.hero{padding:clamp(36px,5.4vw,64px) 0 clamp(72px,9vw,128px);text-align:center}
.hero .kicker{font-size:13px}
.hero h1{font-size:clamp(40px,5.9vw,86px);line-height:.99;margin-top:clamp(18px,2vw,26px)}
.line{display:block;overflow:hidden;padding-block:.1em .2em;margin-block:-.1em -.2em}
.line>*{display:block}
.h1__stroke{display:block;width:min(88%,12.4em);height:.2em;margin:.16em auto 0;overflow:visible}
.h1__stroke path{fill:none;stroke:var(--accent);stroke-width:2.5;stroke-linecap:round;vector-effect:non-scaling-stroke}
.hero__lead{color:var(--muted);font-size:clamp(17px,1.55vw,21px);line-height:1.5;max-width:60ch;margin:clamp(20px,2.4vw,30px) auto 0;text-wrap:pretty}
.hero__lead b{color:var(--ink);font-weight:500}
.hero__cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:clamp(24px,2.8vw,36px)}
.hero__note{color:var(--muted);font-size:15px;margin-top:16px}

/* Sayfa açılışı: tek kurgulanmış an (başlık yükselir, çizgi çizilir, film yerine oturur) */
@media (prefers-reduced-motion:no-preference){
  .line>*{animation:line-up 900ms var(--ease-out) both}
  .line:nth-child(2)>*{animation-delay:90ms}
  .h1__stroke{animation:draw 1100ms var(--ease-in-out) 620ms both}
  .hero .kicker,.hero__lead,.hero__cta,.hero__note{animation:rise 800ms var(--ease-out) both}
  .hero__lead{animation-delay:260ms}.hero__cta{animation-delay:340ms}.hero__note{animation-delay:420ms}
  .matte--enter{animation:settle 1200ms var(--ease-out) 380ms both}
  .matte--enter::before{content:"";position:absolute;inset:0;z-index:12;border-radius:inherit;background:var(--bg);pointer-events:none;animation:veil 1100ms var(--ease-out) 380ms both}
}
@keyframes line-up{from{transform:translateY(108%)}to{transform:none}}
@keyframes draw{from{clip-path:inset(-100% 100% -100% 0)}to{clip-path:inset(-100% 0 -100% 0)}}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes settle{from{transform:translateY(18px) scale(.972)}to{transform:none}}
@keyframes veil{from{opacity:1}to{opacity:0}}

/* ── Film çerçevesi: kaydırdıkça büyür ── */
.film-track{margin-top:clamp(36px,4.4vw,56px);padding-inline:var(--gutter)}
.film-scale{max-width:1180px;margin-inline:auto;transform-origin:50% 0}
@media (min-width:1024px) and (prefers-reduced-motion:no-preference){
  /* Genişlik, tam ölçekte çerçeve menünün altına tam sığacak biçimde hesaplanır. */
  .film-scale{width:min(100%,1680px,calc(177.78svh - 266px));max-width:none;transform:scale(.82);will-change:transform}
}
.matte{position:relative;background:var(--film);color:var(--film-ink);border-radius:var(--r-lg);padding:8px 8px 0;box-shadow:var(--shadow),inset 0 0 0 1px rgba(255,255,255,.06)}
.matte__film{position:relative;aspect-ratio:16/9;border-radius:5px;overflow:hidden;background:#000}
.matte__film>img,.matte__film>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.matte__film>video{transition:opacity 500ms ease}
[data-mode="photo"] .matte__film>video{opacity:0}
.matte__film::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at center,transparent 60%,rgba(0,0,0,.3) 100%)}
.matte__bar{display:flex;align-items:center;justify-content:center;min-height:48px;padding:10px 16px;font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;text-align:center;text-wrap:balance}
@media (min-width:768px){.matte{padding:20px 20px 0}.matte__bar{min-height:58px;font-size:12px;letter-spacing:.22em}}
@media (min-width:1024px){.matte__bar{min-height:64px;font-size:13px}}

.film-ui{position:absolute;z-index:3;display:flex;gap:8px}
.film-ui--tl{left:12px;top:12px}.film-ui--tr{right:12px;top:12px}.film-ui--br{right:12px;bottom:12px}.film-ui--bl{left:12px;bottom:12px}
@media (min-width:768px){.film-ui--tl{left:18px;top:18px}.film-ui--tr{right:18px;top:18px}.film-ui--br{right:18px;bottom:18px}.film-ui--bl{left:18px;bottom:18px}}
.chip{display:inline-flex;align-items:center;min-height:36px;padding:0 13px;border-radius:999px;background:var(--scrim);color:var(--film-ink);font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px var(--film-line)}
.round{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--scrim);color:var(--film-ink);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px var(--film-line);transition:transform 160ms var(--ease-out),background-color 200ms ease}
.round:active{transform:scale(.94)}
.round svg{width:16px;height:16px}
.round [data-icon="play"]{display:none}
.round[data-paused] [data-icon="pause"]{display:none}
.round[data-paused] [data-icon="play"]{display:block}
@media (hover:hover) and (pointer:fine){.round:hover{background:rgba(8,10,12,.85)}}
.round:focus-visible,.seg button:focus-visible{outline-color:var(--film-ink)}
/* Sesli izleme düğmesi: film üstündeki öteki düğmelerle aynı cam, yanında ne yapacağını söyleyen yazı */
.sound{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:0 17px 0 13px;border-radius:999px;background:var(--scrim);color:var(--film-ink);font-size:13.5px;font-weight:500;white-space:nowrap;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px var(--film-line);transition:transform 160ms var(--ease-out),background-color 200ms ease}
.sound:active{transform:scale(.97)}
.sound svg{width:18px;height:18px;flex:none}
.sound [data-icon="on"],.sound[data-on] [data-icon="off"]{display:none}
.sound[data-on] [data-icon="on"]{display:block}
@media (hover:hover) and (pointer:fine){.sound:hover{background:rgba(8,10,12,.85)}}
.sound:focus-visible{outline-color:var(--film-ink)}

.seg{display:inline-flex;padding:4px;gap:2px;border-radius:999px;background:var(--scrim);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px var(--film-line)}
.seg button{min-height:40px;padding:0 15px;border-radius:999px;font-size:13.5px;font-weight:500;color:var(--film-dim);transition:background-color 200ms ease,color 200ms ease}
.seg button[aria-pressed="true"]{background:var(--film-ink);color:#0B0E11}
.seg--bar{background:none;box-shadow:none;padding:0;backdrop-filter:none;-webkit-backdrop-filter:none}
.seg--bar button{min-height:40px;padding:0 13px;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.seg--bar button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.seg--bar button:focus-visible{outline-color:var(--ink)}

/* ── Bölümler ── */
.sec{padding-block:var(--sec)}
.sec--lift{background:var(--bg-lift);box-shadow:inset 0 1px 0 var(--line),inset 0 -1px 0 var(--line)}
.sec--tight{padding-top:0}
/* Başlıksız, kısa bölümler için dar boşluk */
.sec--snug{padding-block:clamp(56px,7vw,104px)}
/* Aynı zeminde art arda gelen bölümler boşluğu iki kez saymaz */
.sec:not(.sec--lift)+.sec:not(.sec--lift),.sec:not(.sec--lift)+.end{padding-top:0}
.head{text-align:center}
.head h2{font-size:clamp(34px,4.9vw,70px);line-height:1.02;margin-top:20px}
.head--left{text-align:left}
.head--left .sub{margin-left:0}

/* Kaydırınca beliren öğeler: JS "armed" yapar, bir kez çalışır */
[data-reveal]{transition:opacity 700ms var(--ease-out),transform 900ms var(--ease-out);transition-delay:calc(var(--n,0)*70ms)}
[data-reveal="armed"]{opacity:0;transform:translateY(22px);transition:none}
[data-reveal][data-kind="media"]{transition:opacity 700ms var(--ease-out),transform 1000ms var(--ease-out),clip-path 1000ms var(--ease-out);transition-delay:calc(var(--n,0)*70ms);clip-path:inset(-12% -12% -20%)}
[data-reveal="armed"][data-kind="media"]{clip-path:inset(12% 0 0);transform:translateY(34px) scale(.98)}

/* ── Kartlar ── */
.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(56px,6vw,80px) clamp(28px,4.6vw,64px);margin-top:clamp(48px,6vw,84px)}
@media (max-width:859px){.cards{grid-template-columns:minmax(0,1fr)}}
.card__top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:8px}
.card__box{border-radius:var(--r);overflow:hidden;background:var(--panel);box-shadow:var(--shadow-sm),inset 0 0 0 1px var(--line)}
.card__media{position:relative;aspect-ratio:16/9;overflow:hidden}
.card__bar{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:50px;padding:0 16px;border-top:1px solid var(--line);font-size:11.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.card__bar b{color:var(--ink);font-weight:500}
.card h3{font-size:clamp(22px,2.1vw,26px);line-height:1.14;margin-top:22px}
.card p{color:var(--muted);margin-top:10px;max-width:44ch}

/* Format değiştirici: çerçeve clip-path ile biçim değiştirir, video ölçekle çerçeveyi hep doldurur */
.fmt__stage{background:var(--panel)}
@media (max-width:639px){.fmt__stage{aspect-ratio:5/4}}
.fmt__frame{position:absolute;inset:0;background:var(--film);clip-path:inset(0px 0px 0px 0px round 0px)}
.fmt__frame video{position:absolute;inset:0;margin:auto;object-fit:cover;opacity:0}
.fmt__frame video[data-on]{opacity:1}
.fmt__shadow{position:absolute;inset:0;margin:auto;border-radius:14px;box-shadow:var(--shadow-frame);opacity:0}
[data-ready] .fmt__frame{transition:clip-path 800ms var(--ease-in-out)}
[data-ready] .fmt__frame video{transition:transform 800ms var(--ease-in-out),opacity 300ms ease 560ms}
[data-ready] .fmt__frame video[data-on]{transition:transform 800ms var(--ease-in-out),opacity 460ms ease 120ms}
[data-ready] .fmt__shadow{transition:opacity 150ms ease}
[data-ready] .fmt__shadow[data-on]{opacity:1;transition:opacity 420ms var(--ease-out) 460ms}
.fmt__shadow[data-on]{opacity:1}
.fmt__tabs{justify-content:center;gap:4px;padding:0 8px}
.fmt__tab{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;min-width:44px;padding:0 12px;font-size:11.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;color:var(--faint);transition:color 200ms ease}
.fmt__tab svg{width:16px;height:16px;flex:none}
.fmt__tab[aria-pressed="true"]{color:var(--ink)}
.fmt__tab i{position:absolute;left:12px;right:12px;top:-1px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:0 50%}
.fmt__tab[aria-pressed="true"] i[data-static]{transform:none}
@media (hover:hover) and (pointer:fine){.fmt__tab:hover{color:var(--ink)}}
@media (max-width:420px){.fmt__tab{padding:0 8px;letter-spacing:.1em}.fmt__tab svg{display:none}.fmt__tab i{left:8px;right:8px}}
.fmt__where{font-size:14.5px;color:var(--faint);min-height:1.55em}

/* Önce / sonra */
.ba__area{cursor:ew-resize;touch-action:pan-y;user-select:none;-webkit-user-select:none;background:var(--film)}
.ba__pair{position:absolute;inset:0;opacity:0;transition:opacity 420ms ease}
.ba__pair[data-on]{opacity:1}
.ba__pair img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.ba__pair img.after{clip-path:inset(0 0 0 50%)}
.ba__line{position:absolute;z-index:2;top:0;bottom:0;left:0;width:1px;background:rgba(255,255,255,.9);box-shadow:0 0 0 1px rgba(0,0,0,.12)}
/* Çizgi ve tutamaç JS ile transform üzerinden taşınır; sürüklemeyi geciktirmesin diye geçiş yok */
.ba__knob{position:absolute;z-index:3;top:50%;left:0;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:#fff;color:#14181C;display:grid;place-items:center;box-shadow:0 6px 22px rgba(0,0,0,.35)}
.ba__knob:focus-visible{outline-color:#fff;outline-offset:4px}
.ba__knob svg{width:18px;height:18px}
.ba__tag{position:absolute;z-index:2;top:14px}
.ba__tag--b{left:14px}.ba__tag--a{right:14px}
.ba__tag.chip{min-height:30px;border-radius:6px;padding:0 10px;font-size:11px}
.ba__prompt{position:absolute;z-index:2;left:50%;bottom:16px;transform:translateX(-50%);padding:8px 16px;border-radius:8px;font-family:var(--display);font-style:italic;font-size:17px;white-space:nowrap;background:var(--scrim);color:var(--film-ink);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px var(--film-line);transition:opacity 200ms ease,filter 200ms ease}
.ba__prompt[data-swap]{opacity:.3;filter:blur(2px)}
.ba__segs{display:flex;gap:2px}
.ba__segs button{width:34px;height:44px;position:relative}
.ba__segs button::before{content:"";position:absolute;left:3px;right:3px;top:21px;height:2px;border-radius:2px;background:var(--line-strong)}
.ba__segs i{position:absolute;left:3px;right:3px;top:21px;height:2px;border-radius:2px;background:var(--ink);transform:scaleX(0);transform-origin:0 50%}
.ba__segs button[data-done] i{transform:none}

/* Plan: odadan odaya yürüyen nokta */
.plan__media{display:grid;place-items:center;background:var(--panel)}
.plan__media svg{width:94%;height:auto}
.plan .room{fill:var(--bg-lift);stroke:var(--line-strong);stroke-width:1.2;transition:fill 300ms ease}
.plan .room[data-here]{fill:color-mix(in srgb,var(--accent) 34%,var(--bg-lift))}
.plan text{font:500 9.5px var(--text);letter-spacing:.12em;text-transform:uppercase;fill:var(--muted);text-anchor:middle;pointer-events:none}
.plan .path{fill:none;stroke:var(--line-strong);stroke-width:1;stroke-dasharray:3 5}
.plan .cone{fill:var(--accent);opacity:.5}
.plan .me{fill:var(--ink)}
.plan .me-ring{fill:none;stroke:var(--ink);stroke-width:1;opacity:.4}

/* Render / film */
.proj__media{background:var(--film)}
.proj__media img,.proj__media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.proj__media video{transition:opacity 500ms ease}
.proj[data-mode="photo"] video{opacity:0}

/* ── Nasıl çalışır: ekrana sabitlenen üç adım ── */
.how{position:relative}
.how__pin{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;justify-content:center;padding:calc(var(--nav-h) + 20px) 0 28px}
.how__in{display:flex;flex-direction:column;height:100%;min-height:0}
.how .head h2{font-size:clamp(30px,4vw,56px)}
.how__stage{position:relative;flex:1;min-height:0;max-height:560px;margin-top:26px;border-radius:var(--r-lg);background:var(--bg-lift);box-shadow:var(--shadow-sm),inset 0 0 0 1px var(--line);overflow:hidden}
.how__panel{position:absolute;inset:0;padding:clamp(16px,2.2vw,30px);opacity:0;transform:translateY(12px);transition:opacity 260ms ease,transform 420ms var(--ease-out);pointer-events:none;display:flex;flex-direction:column;gap:16px}
.how[data-step="0"] .how__panel[data-p="0"],.how[data-step="1"] .how__panel[data-p="1"],.how[data-step="2"] .how__panel[data-p="2"]{opacity:1;transform:none;pointer-events:auto}
.how__title{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.how__title b{color:var(--ink);font-weight:500;font-variant-numeric:tabular-nums}
.drop{border:1px dashed var(--line-strong);border-radius:var(--r-sm);padding:13px;text-align:center;color:var(--muted);font-size:15px}
.tiles{flex:1;min-height:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:10px}
.tiles div{border-radius:8px;overflow:hidden;background:var(--panel)}
.tiles img{width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity 300ms ease,transform 600ms var(--ease-out)}
.tiles div[data-in] img{opacity:1;transform:none}
.direct{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:18px}
.shots{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;min-height:0;overflow:hidden}
.shots li{display:flex;align-items:center;gap:12px;padding:7px;border-radius:10px;color:var(--muted);font-size:15px;transition:background-color 200ms ease,color 200ms ease}
.shots li[data-on]{background:var(--panel);color:var(--ink)}
.shots img{width:74px;height:46px;object-fit:cover;border-radius:6px;flex:none}
.shots i{display:block;font-style:normal;font-size:13px;color:var(--faint)}
.direct__view{position:relative;border-radius:10px;overflow:hidden;background:var(--film);min-height:0}
.direct__view video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.beats{display:flex;gap:4px;align-items:flex-end;height:22px}
.beats i{flex:1;height:22px;border-radius:2px;background:var(--line-strong);transform:scaleY(.27);transform-origin:50% 100%;transition:transform 300ms var(--ease-out),background-color 200ms ease}
.beats i[data-on]{transform:none;background:var(--ink)}
.out{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,16fr) minmax(0,5.1fr) minmax(0,9fr);gap:16px;align-items:center}
.out figure{margin:0;min-height:0;max-height:100%;display:flex;flex-direction:column;gap:10px}
.out video{width:100%;border-radius:10px;background:var(--film);object-fit:cover}
.out figure:nth-child(1) video{aspect-ratio:16/9}.out figure:nth-child(2) video{aspect-ratio:9/16}.out figure:nth-child(3) video{aspect-ratio:1/1}
.out figcaption{font-size:13.5px;color:var(--muted)}
.out figcaption b{color:var(--ink);font-weight:500;display:block}
.how__rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:20px}
.how__rail button{text-align:left;display:block;padding-bottom:4px}
.how__rail .bar{display:block;height:2px;background:var(--line);position:relative;overflow:hidden}
.how__rail .bar i{position:absolute;inset:0;background:var(--ink);transform-origin:0 50%;transform:scaleX(0)}
.how__rail b{display:block;margin-top:14px;font-family:var(--display);font-weight:400;font-size:clamp(19px,1.8vw,24px);color:var(--faint);transition:color 200ms ease}
.how__rail span:not(.bar){display:block;margin-top:6px;font-size:14.5px;color:var(--faint);max-width:34ch}
.how__rail button[data-on] b{color:var(--ink)}
.how__rail button[data-on] span:not(.bar){color:var(--muted)}
@media (min-width:900px){
  .how{height:340vh}
  /* Ekrana sabitlenen sahnenin yüksekliği pencereye bağlı. Alçak pencerede (1000x680 gibi) içerik kırpılmasın:
     çekim planının beş satırı yüksekliği paylaşır, üç format da panelin yüksekliğine göre küçülür. */
  .how__panel{container-type:size}
  .shots li{flex:1 1 0;min-height:0;max-height:60px;padding-block:0}
  .shots img{width:auto;height:calc(100% - 10px);max-height:46px;aspect-ratio:74/46}
  .shots span{line-height:1.25}
  .out{width:100%;max-width:calc((100cqh - 92px) * 3.344 + 32px);margin-inline:auto}
  /* Çok alçak pencerede satıra tek yazı sığar: kamera hareketi notu gizlenir */
  @container (max-height:270px){.shots i{display:none}}
}
@media (max-width:899px){
  .how{padding-block:var(--sec)}
  .how__pin{position:static;height:auto;padding:0}
  .how__stage{max-height:none;overflow:visible;background:none;box-shadow:none;display:flex;flex-direction:column;gap:18px}
  .how__panel{position:relative;opacity:1;transform:none;pointer-events:auto;border-radius:var(--r);background:var(--bg-lift);box-shadow:var(--shadow-sm),inset 0 0 0 1px var(--line)}
  .tiles{grid-template-rows:none;grid-auto-rows:80px}
  .direct{grid-template-columns:minmax(0,1fr)}.direct__view{aspect-ratio:16/9}
  .out{grid-template-columns:minmax(0,1fr) minmax(0,.42fr)}.out figure:nth-child(3){display:none}
  .how__rail,.beats{display:none}
  .how__title{font-size:11px;letter-spacing:.08em}
}

/* ── Hesap ── */
.math{margin-top:clamp(44px,5.6vw,76px);border-top:1px solid var(--line)}
.math__row{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.2fr) minmax(0,1.2fr);border-bottom:1px solid var(--line)}
.math__row>*{padding:20px 22px}
.math__row>:first-child{color:var(--muted);font-size:15.5px;padding-left:0}
.math__row>:nth-child(2){color:var(--muted)}
.math__row>:nth-child(3){background:var(--bg-lift);font-weight:500;box-shadow:inset 1px 0 0 var(--line),inset -1px 0 0 var(--line)}
.math__row--head>*{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:500}
.math__row--head>:nth-child(3){box-shadow:inset 0 2px 0 var(--ink),inset 1px 0 0 var(--line),inset -1px 0 0 var(--line)}
.note{font-size:14px;color:var(--faint);margin-top:16px}
@media (max-width:640px){.math__row>*{padding:14px 10px;font-size:15px}.math__row--head>*{font-size:10.5px;letter-spacing:.06em}}

/* ── Paketler ── */
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:clamp(44px,5.6vw,76px)}
@media (max-width:899px){.plans{grid-template-columns:minmax(0,1fr)}}
.plan-card{border-radius:var(--r);background:var(--bg-lift);box-shadow:inset 0 0 0 1px var(--line);padding:30px 28px 28px;display:flex;flex-direction:column}
.sec--lift .plan-card{background:var(--bg)}
.plan-card h3{font-size:26px}
.plan-card .price{font-family:var(--display);font-size:46px;letter-spacing:-.02em;line-height:1;margin-top:22px;font-variant-numeric:lining-nums}
.plan-card .price small{font-family:var(--text);font-size:15.5px;color:var(--muted);letter-spacing:0;margin-left:6px}
.plan-card ul{list-style:none;margin:26px 0 28px;padding:0;flex:1}
.plan-card li{padding:12px 0;border-top:1px solid var(--line);font-size:16px;color:var(--muted)}
.plans__more{display:flex;flex-wrap:wrap;gap:10px 36px;justify-content:center;margin-top:30px;color:var(--muted);font-size:15.5px}
.plans__more b{color:var(--ink);font-weight:500}

/* ── Kurucu ── */
.who{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(32px,6vw,88px);align-items:center}
@media (max-width:899px){.who{grid-template-columns:minmax(0,1fr)}}
.who__photo{aspect-ratio:4/5;border:1px dashed var(--line-strong);border-radius:var(--r);display:grid;place-items:center;color:var(--faint);font-size:15px;text-align:center;padding:24px;max-width:420px}
.who h2{font-size:clamp(32px,4.2vw,58px);line-height:1.04;margin-top:20px}
.who p{color:var(--muted);font-size:clamp(17px,1.4vw,19px);max-width:56ch;margin-top:24px}
.who p.who__sign{margin-top:28px;font-size:16px;color:var(--ink)}
.who__sign span{color:var(--muted)}

/* ── SSS ── */
.faq{max-width:820px;margin:clamp(36px,4.6vw,60px) auto 0;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:22px 0;font-family:var(--display);font-size:clamp(20px,2vw,25px);line-height:1.2}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:14px;height:14px;background:linear-gradient(var(--muted),var(--muted)) 50%/100% 1.5px no-repeat,linear-gradient(var(--muted),var(--muted)) 50%/1.5px 100% no-repeat;transition:transform 200ms var(--ease-out)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{color:var(--muted);margin:0 0 24px;max-width:62ch}
.faq p a{text-underline-offset:4px}

/* ── Hizmet sayfaları: liste, adımlar, çapraz bağlantı ── */
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);align-items:start}
@media (max-width:899px){.split{grid-template-columns:minmax(0,1fr)}}
.split .head h2{font-size:clamp(30px,3.3vw,46px);line-height:1.06}
.split--fig{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center;margin-top:clamp(44px,5.6vw,76px)}
@media (max-width:899px){.split--fig{grid-template-columns:minmax(0,1fr)}}
.rows--stack li{grid-template-columns:minmax(0,1fr)}
.rows{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.rows li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:8px 28px;padding:22px 0;border-bottom:1px solid var(--line)}
.rows b{font-family:var(--display);font-weight:400;font-size:clamp(20px,1.9vw,24px);line-height:1.2}
.rows span{color:var(--muted)}
@media (max-width:560px){.rows li{grid-template-columns:minmax(0,1fr)}}
.steps{list-style:none;margin:clamp(44px,5.6vw,76px) 0 0;padding:0;display:grid;grid-template-columns:repeat(var(--cols,4),minmax(0,1fr));gap:36px 28px;counter-reset:step}
.steps li{counter-increment:step;border-top:1px solid var(--line-strong);padding-top:18px}
.steps li::before{content:counter(step);display:block;font-family:var(--display);font-size:34px;line-height:1;color:var(--faint);margin-bottom:22px;font-variant-numeric:lining-nums}
.steps b{display:block;font-family:var(--display);font-weight:400;font-size:clamp(20px,1.9vw,24px);line-height:1.2}
.steps span{display:block;color:var(--muted);margin-top:8px;max-width:34ch}
@media (max-width:899px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.steps{grid-template-columns:minmax(0,1fr)}}
.cross{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px 40px;padding:clamp(28px,3.6vw,44px);border-radius:var(--r-lg);background:var(--panel);box-shadow:inset 0 0 0 1px var(--line)}
.cross h2{font-size:clamp(26px,3vw,40px);line-height:1.08;max-width:18ch}
.cross p{color:var(--muted);margin-top:10px;max-width:46ch}
.figure{margin:0}
.figure figcaption{margin-top:12px;font-size:14px;color:var(--faint)}

/* ── Kuruluş: mavi saat bandı ──
   Filmin zemini bandın rengidir (#192141, kodlanmış filmden ölçüldü); model bandın üstünde durur.
   Bölüm listesi filmi izler: soldaki ince çizgi o bölümün süresince kehribarla dolar.
   Yerleşim pencereye değil sahnenin kendi genişliğine bakar (container query): hiçbir metin sütunu daralmaz. */
:root{--dusk:#192141;--dusk-ink:#F3F1EC;--dusk-dim:#BAC1DC;--dusk-faint:#929AB8;--dusk-line:rgba(255,255,255,.16)}
.kur{background:var(--dusk);color:var(--dusk-ink);padding-block:var(--sec)}
.kur .kicker{color:var(--dusk-dim)}
.kur .sub{color:var(--dusk-dim);max-width:62ch}
.kur a:focus-visible,.kur button:focus-visible{outline-color:var(--dusk-ink)}
.kur__stage{container-type:inline-size;margin-top:clamp(40px,5vw,72px)}
.kur__grid{display:grid;gap:clamp(22px,3.4cqw,44px)}
.kur__main{margin:0;min-width:0}
/* Tek sütunda film ekrana sığacak kadar büyür; liste altına iner */
.kur__film{position:relative;aspect-ratio:16/9;max-width:calc((100svh - 150px)*1.7778);margin-inline:auto;border-radius:var(--r-lg);overflow:hidden;background:var(--dusk);box-shadow:0 44px 80px -44px rgba(3,5,20,.9)}
.kur__film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.kur__film::after{content:"";position:absolute;inset:0;z-index:2;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--dusk-line);pointer-events:none}
.kur__note{margin-top:14px;font-size:14px;line-height:1.5;color:var(--dusk-faint);text-wrap:pretty}
/* Bölüme özel katmanlar: kroki kâğıdı (1) ve örnek bağlantı düğmesi (5) */
.kur__over{position:absolute;z-index:1;opacity:0;visibility:hidden;transition:opacity 180ms ease,transform 180ms ease,visibility 0s linear 180ms}
.kur__over[data-on]{opacity:1;visibility:visible;transition:opacity 320ms ease,transform 560ms var(--ease-out)}
.kur__over--kroki{right:5.5%;top:50%;width:31%;transform:translateY(calc(-50% + 16px)) rotate(2.4deg) scale(.96)}
.kur__over--kroki[data-on]{transform:translateY(-50%) rotate(2.4deg)}
.kur__over--kroki img{width:100%;height:auto;border-radius:6px;box-shadow:0 26px 44px -20px rgba(3,5,20,.85)}
.kur__over--link{left:50%;bottom:9%;transform:translate(-50%,12px)}
.kur__over--link[data-on]{transform:translate(-50%,0)}
/* Bölüm listesi */
.kur__list{list-style:none;margin:0;padding:0;min-width:0}
.kur__list button{position:relative;display:grid;grid-template-columns:20px minmax(0,1fr);gap:5px 12px;align-items:baseline;width:100%;padding:13px 16px 14px 22px;text-align:left;border-radius:0 10px 10px 0;transition:background-color 200ms ease}
.kur__list button::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--dusk-line)}
.kur__fill{position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--accent);transform-origin:50% 0;transform:scaleY(0)}
.kur__list .num{font-size:13px;font-weight:500;font-variant-numeric:tabular-nums;color:var(--dusk-faint);transition:color 200ms ease}
.kur__list b{font-family:var(--display);font-weight:400;font-size:21px;line-height:1.2;letter-spacing:-.012em;color:var(--dusk-dim);text-wrap:balance;transition:color 200ms ease}
.kur__list .txt{grid-column:2;font-size:15px;line-height:1.5;color:var(--dusk-faint);text-wrap:pretty;transition:color 200ms ease}
.kur__list button[data-on]{background:rgba(255,255,255,.05)}
.kur__list button[data-on] .num{color:var(--accent)}
.kur__list button[data-on] b{color:var(--dusk-ink)}
.kur__list button[data-on] .txt{color:var(--dusk-dim)}
/* Orta genişlik: başlık solda, açıklama sağda; her satır tek bakışta okunur */
@container (min-width:640px) and (max-width:1119.98px){
  .kur__list button{grid-template-columns:20px minmax(0,.58fr) minmax(0,1fr);column-gap:22px;padding-block:15px 16px}
  .kur__list .txt{grid-column:3}
}
/* Geniş: film solda, liste yanında; ikisi aynı anda görünür */
@container (min-width:1120px){
  .kur__grid{grid-template-columns:minmax(0,1.62fr) minmax(0,1fr);align-items:start}
  .kur__film{max-width:none}
}
@media (max-width:639px){
  .kur__over--kroki{width:34%;right:4%}
  .kur__over--link{bottom:7%}
  .kur__list b{font-size:20px}
}

/* ── Tek render | Film: solda sizden gelen kare, sağda ondan çıkan film; altında filmin çekimleri ──
   Mavi saat bandında durur (.kur). Çekim şeridi filmi izler: etkin çekimin görseli açılır, altındaki çizgi kehribarla dolar. */
.tek{margin-top:clamp(40px,5vw,72px)}
.tek__pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,24px)}
.tek__panel{margin:0;min-width:0}
.tek__media{position:relative;aspect-ratio:16/9;border-radius:var(--r-lg);overflow:hidden;background:#0D1226;box-shadow:0 36px 64px -40px rgba(3,5,20,.9)}
.tek__media>img,.tek__media>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tek__media::after{content:"";position:absolute;inset:0;z-index:2;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--dusk-line);pointer-events:none}
.tek__panel figcaption{margin-top:12px;font-size:14.5px;color:var(--dusk-dim)}
.tek .kur__note{margin-top:20px}
.cek{list-style:none;margin:clamp(20px,2.6vw,32px) 0 0;padding:0;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:clamp(8px,1.4vw,18px)}
.cek button{display:block;width:100%;text-align:left}
.cek__thumb{display:block;aspect-ratio:16/9;border-radius:8px;overflow:hidden;opacity:.55;transition:opacity 200ms ease}
.cek__thumb img{display:block;width:100%;height:100%;object-fit:cover}
.cek__bar{position:relative;display:block;height:2px;margin-top:9px;border-radius:2px;background:var(--dusk-line);overflow:hidden}
.cek .kur__fill{inset:0;width:auto;transform-origin:0 50%;transform:scaleX(0)}
.cek b{display:block;margin-top:9px;font-weight:500;font-size:13.5px;line-height:1.3;color:var(--dusk-faint);text-wrap:balance;transition:color 200ms ease}
.cek button[data-on] .cek__thumb{opacity:1}
.cek button[data-on] b{color:var(--dusk-ink)}
@media (max-width:639px){
  .tek__pair{grid-template-columns:minmax(0,1fr)}
  .cek{gap:6px}
  .cek__thumb{border-radius:5px}
  .cek b{font-size:11.5px}
}

/* ── Kıyas: geleneksel 3D stüdyo ile bu stüdyo ──
   Kehribar sütun tablonun üstüne konmuş tek bir karttır: üstten ışık alır, ince bir kenarı ve yumuşak gölgesi vardır,
   tablodan yukarı ve aşağı biraz taşar. Satır çizgileri kartın içinde kenara kadar gitmez. */
.vs{position:relative;margin-top:clamp(48px,5.8vw,80px);font-variant-numeric:tabular-nums}
.vs::before{content:"";position:absolute;z-index:0;top:-12px;bottom:-12px;right:0;width:calc(100%*1.08/2.8);border-radius:18px;background:var(--accent) linear-gradient(180deg,#F8C261 0%,#F2AD38 44%,#ECA024 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 0 0 1px rgba(160,92,0,.2),0 30px 50px -32px rgba(160,96,0,.62),0 10px 20px -14px rgba(110,62,0,.38)}
.vs__row{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1fr) minmax(0,1.08fr)}
.vs__row>*{display:flex;flex-direction:column;justify-content:center;min-height:94px;padding:18px 28px 18px 0}
.vs__row>:nth-child(-n+2){border-bottom:1px solid var(--line)}
.vs__row>:first-child{color:var(--muted);font-size:15px}
.vs__row>:nth-child(2){color:var(--muted);font-size:16.5px}
.vs__row>:nth-child(3){--surface:#F0A830;padding:18px 30px;color:#4A3206;font-size:15px;line-height:1.45;background:linear-gradient(rgba(43,27,2,.17),rgba(43,27,2,.17)) 30px 100%/calc(100% - 60px) 1px no-repeat}
.vs__row>:nth-child(3) b{font-family:var(--display);font-weight:400;font-size:clamp(25px,2.5vw,32px);line-height:1.08;letter-spacing:-.02em;color:var(--accent-ink);margin-bottom:5px}
.vs__row--head>*{min-height:0;padding-block:15px;font-size:13.5px;font-weight:500}
.vs__row--head>:nth-child(2){font-size:13.5px}
.vs__row--head>:nth-child(3){padding-block:15px;font-size:13.5px;font-weight:600;color:var(--accent-ink)}
.vs__row:last-child>:nth-child(-n+2){border-bottom:0}
.vs__row:last-child>:nth-child(3){background:none}
.vs+.note{margin-top:32px}
.nb{white-space:nowrap}
@media (max-width:719px){
  .vs::before{display:none}
  .vs__row{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);column-gap:12px}
  .vs__row>*{min-height:0;padding:14px 0}
  .vs__row>:first-child{grid-column:1/-1;padding:20px 0 6px;border-bottom:0;font-size:13.5px;font-weight:500;color:var(--ink)}
  .vs__row--head>:first-child{display:none}
  .vs__row>:nth-child(2){border-bottom:0;font-size:15.5px}
  .vs__row>:nth-child(3){padding:14px 16px;border-radius:14px;background:var(--accent) linear-gradient(180deg,#F8C261,#ECA024);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 0 0 1px rgba(160,92,0,.2)}
  .vs__row--head>*{padding-block:0 4px}
  .vs__row--head>:nth-child(3){padding:0 16px 4px;background:none;box-shadow:none}
  .vs__row:last-child>:nth-child(3){background:var(--accent) linear-gradient(180deg,#F8C261,#ECA024)}
  .vs__row>:nth-child(3) b{font-size:23px}
}

/* ── Bağlantı: solda başlık ve kullanım yerleri, sağda telefon paneli. İki sütun aynı yükseklikte biter ── */
.bag{display:grid;grid-template-columns:minmax(0,1fr) clamp(264px,29%,340px);gap:clamp(32px,5vw,80px);align-items:stretch}
.bag .head h2{font-size:clamp(30px,3.3vw,46px);line-height:1.06}
.bag .rows{margin-top:clamp(28px,3.4vw,44px)}
.bag .rows li{grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr)}
.bag__dev{margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:clamp(26px,3vw,38px) 24px clamp(20px,2.4vw,28px);border-radius:var(--r-lg);background:var(--panel);box-shadow:inset 0 0 0 1px var(--line)}
.bag__dev img{width:min(100%,232px);height:auto;border-radius:26px;box-shadow:0 0 0 1px rgba(20,24,28,.16),var(--shadow-frame)}
.bag__dev figcaption{font-size:13.5px;color:var(--muted)}
@media (max-width:899px){.bag{grid-template-columns:minmax(0,1fr)}.bag__dev img{width:200px}}
@media (max-width:560px){.bag .rows li{grid-template-columns:minmax(0,1fr)}}

/* ── İkili film kartı: görüntü kartın kendisidir ── */
.duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.duo__card{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:clamp(340px,34vw,470px);border-radius:var(--r-lg);overflow:hidden;background:var(--film);color:var(--film-ink);box-shadow:var(--shadow-sm)}
.duo__card video{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}
.duo__card::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(8,10,12,0) 18%,rgba(8,10,12,.66) 54%,rgba(8,10,12,.92) 100%)}
.duo__body{padding:clamp(22px,2.6vw,34px)}
.duo__body h2{font-size:clamp(26px,2.7vw,38px);line-height:1.08;max-width:16ch}
.duo__body p{margin-top:10px;max-width:40ch;color:#DFE3E6}
.duo__body .btn{margin-top:20px}
.duo__card a:focus-visible{outline-color:var(--film-ink)}
@media (max-width:859px){.duo{grid-template-columns:minmax(0,1fr)}}

.keys{display:flex;flex-wrap:wrap;gap:10px 28px;justify-content:center;margin-top:20px;color:var(--muted);font-size:15px}
.keys kbd{display:inline-grid;place-items:center;min-width:26px;height:26px;padding:0 6px;margin-right:4px;border-radius:6px;font:500 13px var(--text);color:var(--ink);background:var(--bg-lift);box-shadow:inset 0 0 0 1px var(--line-strong),0 1px 0 var(--line-strong);transition:transform 100ms var(--ease-out),background-color 100ms ease}

.keys__to{margin-right:4px}
.keys--touch{display:none}
@media (hover:none),(max-width:639px){.keys--desk{display:none}.keys--touch{display:flex}}

/* ── Gerçek 3D gezinti: afiş, düğme ve görüntüleyicinin yerleşeceği alan ── */
.tur3d{position:absolute;inset:0}
.tur3d__poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tur3d__cta{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:16px;background:linear-gradient(rgba(8,10,12,.12),rgba(8,10,12,.46))}
.tur3d__cta .link{color:var(--film-ink);text-decoration-color:rgba(255,255,255,.55)}
.tur3d__cta .link:focus-visible,.tur3d__cta .btn:focus-visible{outline-color:var(--film-ink)}
.tur3d__host{position:absolute;inset:0;z-index:4}
.tur3d[data-open] .tur3d__cta{display:none}
@media (hover:hover) and (pointer:fine){.tur3d__cta .link:hover{text-decoration-color:var(--film-ink)}}

/* ── Arsa çizimi ── */
.parcel{border-radius:var(--r);overflow:hidden;background:var(--panel);box-shadow:var(--shadow-sm),inset 0 0 0 1px var(--line)}
.parcel svg{width:100%;height:auto;aspect-ratio:760/440}
@media (max-width:639px){.parcel svg{aspect-ratio:1/1}.parcel .tag text{font-size:14px}}
.parcel .contour{fill:none;stroke:var(--line);stroke-width:1}
.parcel .road{fill:none;stroke:var(--bg-lift);stroke-width:20;stroke-linecap:round}
.parcel .road-mid{fill:none;stroke:var(--line-strong);stroke-width:1;stroke-dasharray:7 9}
.parcel .lot{fill:none;stroke:var(--line-strong);stroke-width:1}
.parcel .tree{fill:color-mix(in srgb,var(--ink) 16%,var(--panel))}
/* Arsa yalnızca vurgulanır; görünür olunca yumuşakça belirir, ardından kamera yolu gelir */
.parcel .mine-fill{fill:var(--accent);opacity:0;transition:opacity 600ms ease 200ms}
.parcel .mine{fill:none;stroke:var(--ink);stroke-width:1.5;stroke-linejoin:round;opacity:0;transition:opacity 600ms ease 200ms}
.parcel .tag rect{fill:var(--ink)}
.parcel .tag text{fill:var(--bg);font:500 12px var(--text);letter-spacing:.04em}
.parcel .late{opacity:0;transition:opacity 500ms ease calc(600ms + var(--n,0)*150ms)}
.parcel .flight{fill:none;stroke:var(--ink);stroke-width:1.2;stroke-dasharray:1 7;stroke-linecap:round}
.parcel .drone circle{fill:var(--ink)}
.parcel .drone path{fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round}
.parcel[data-in] .mine{opacity:.7}
.parcel[data-in] .mine-fill{opacity:.3}
.parcel[data-in] .late{opacity:1}
.parcel[data-in] .flight.late{opacity:.55}
.parcel__bar{display:flex;justify-content:space-between;gap:14px;min-height:50px;align-items:center;padding:0 16px;border-top:1px solid var(--line);font-size:11.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}

/* ── Kapanış ve altbilgi ── */
.end{text-align:center;padding:var(--sec) 0}
.end h2{font-size:clamp(38px,5.6vw,84px);line-height:1}
.end .btn{margin-top:36px}
.end p{color:var(--muted);margin-top:16px;font-size:15.5px}
.foot{border-top:1px solid var(--line);padding:56px 0 64px;font-size:15px;color:var(--muted)}
@media (max-width:959px){.foot{padding-bottom:128px}}
.foot__grid{display:grid;grid-template-columns:1.4fr repeat(3,minmax(0,1fr));gap:32px}
@media (max-width:899px){.foot__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.foot__grid>:first-child,.foot__grid>:last-child{grid-column:1/-1}}
@media (max-width:400px){.foot__grid{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}}
.foot h2{margin:0 0 14px;font:500 12px var(--text);letter-spacing:.18em;text-transform:uppercase;color:var(--faint)}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:0}
.foot li a{display:inline-block;padding:9px 0;white-space:nowrap;text-decoration:none;color:var(--ink)}
@media (hover:hover) and (pointer:fine){.foot li a:hover{text-decoration:underline;text-underline-offset:4px}}
.foot__notes{margin-top:40px;padding-top:24px;border-top:1px solid var(--line);display:grid;gap:8px;font-size:14px;color:var(--faint)}
.theme{display:inline-flex;gap:2px;padding:3px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-strong);margin-top:16px}
.theme button{min-height:40px;padding:0 13px;border-radius:999px;font-size:14px;color:var(--muted);transition:background-color 200ms ease,color 200ms ease}
.theme button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.mbar{display:none}
@media (max-width:959px){.mbar{display:block;position:fixed;z-index:40;left:0;right:0;bottom:0;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line)}.mbar .btn{width:100%}
  /* Alttaki sabit çubuk odaklanan öğeyi örtmesin */
  html{scroll-padding-bottom:88px}}

/* ── Dokunma ve üzerine gelme ── */
html{-webkit-tap-highlight-color:rgba(20,24,28,.08)}
a,summary{touch-action:manipulation}
.math{font-variant-numeric:tabular-nums}
@media (hover:hover) and (pointer:fine){
  .seg button:hover{color:var(--film-ink)}
  .seg button[aria-pressed="true"]:hover{color:#0B0E11}
  .seg--bar button:hover,.theme button:hover,.nav__menu:hover{color:var(--ink)}
  .seg--bar button[aria-pressed="true"]:hover,.theme button[aria-pressed="true"]:hover{color:var(--bg)}
  .how__rail button:hover b{color:var(--ink)}
  .kur__list button:hover b{color:var(--dusk-ink)}
  .cek button:not([data-on]):hover .cek__thumb{opacity:.85}
  .cek button:hover b{color:var(--dusk-ink)}
  .kur__list button:not([data-on]):hover{background:rgba(255,255,255,.03)}
  .faq summary:hover::after{transform:scale(1.25)}
  .faq details[open] summary:hover::after{transform:rotate(45deg) scale(1.25)}
  .ba__segs button:hover::before{background:var(--ink)}
}

/* ── Azaltılmış hareket: yer değiştirme yok, kısa geçişler kalır ── */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  [data-reveal],[data-reveal="armed"]{opacity:1;transform:none;clip-path:none;transition:none}
  [data-ready] .fmt__frame{transition:none}
  [data-ready] .fmt__frame video,[data-ready] .fmt__frame video[data-on]{transition:opacity 200ms ease}
  .how__panel{transform:none;transition:opacity 200ms ease}
  .kur__over--kroki,.kur__over--kroki[data-on]{transform:translateY(-50%) rotate(2.4deg)}
  .kur__over--link,.kur__over--link[data-on]{transform:translate(-50%,0)}
  .tiles img{transform:none}
  .btn:active,.round:active,.sound:active{transform:none}
  .btn:hover svg path{transform:none}
}

/* ───────── Canlıya çıkış eklemeleri (14 Kas) ───────── */

/* Filmsiz giriş (Hakkımızda, Teklif) */
.hero--plain{padding-bottom:clamp(44px,5.5vw,80px)}

/* "Stüdyonun arkasında": fotoğraf gelene kadar yalnız metin */
.who--solo{display:block}
.who--solo p:first-child{margin-top:0}
.who--solo .link{margin-top:14px}

/* Kapanış: iki düğme yan yana, altında açık iletişim satırı */
.end__cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:36px}
.end .end__cta .btn{margin-top:0}
.end p a,.plans__more a,.teklif__mail a{color:var(--ink);text-underline-offset:4px;text-decoration-thickness:1px}

/* Teklif sayfası: solda form, sağda doğrudan iletişim */
.teklif{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(28px,5vw,72px);align-items:start}
@media (max-width:899px){.teklif{grid-template-columns:minmax(0,1fr)}}
.teklif__yan{border-radius:var(--r-lg);background:var(--bg-lift);box-shadow:var(--shadow-sm),inset 0 0 0 1px var(--line);padding:clamp(22px,2.6vw,32px)}
.teklif__yan h2{font-size:clamp(24px,2.2vw,30px);line-height:1.1}
.teklif__yan p{color:var(--muted);margin-top:10px}
.teklif__yan .btn{margin-top:20px}
.teklif__yan .teklif__mail{margin-top:18px;font-size:15.5px}

.form{display:grid;gap:22px}
.form__row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 20px;align-items:start}
@media (max-width:599px){.form__row{grid-template-columns:minmax(0,1fr)}}
.field{display:grid;gap:8px;align-content:start;min-width:0;border:0;padding:0;margin:0}
.field>span,.field legend{font-size:15px;font-weight:500;padding:0}
.field legend{margin-bottom:10px}
.field i{font-style:normal;font-weight:400;color:var(--faint);margin-left:6px}
.field input,.field textarea{width:100%;min-height:52px;padding:14px 16px;border:0;border-radius:var(--r-sm);background:var(--bg-lift);color:var(--ink);font:inherit;font-size:16px;box-shadow:inset 0 0 0 1px var(--line-strong);transition:box-shadow 160ms ease}
.field textarea{resize:vertical;min-height:120px;line-height:1.5}
.field input::placeholder{color:var(--faint)}
.field input:focus-visible,.field textarea:focus-visible{outline:0;box-shadow:inset 0 0 0 2px var(--ink)}
.field[data-invalid] input,.field[data-invalid] textarea{box-shadow:inset 0 0 0 2px var(--bad)}
.field__err{font-size:14px;color:var(--bad)}
.check .field__err{flex-basis:100%;margin-left:36px}
:root{--bad:#B3261E}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bad:#FF8A80}}
:root[data-theme="dark"]{--bad:#FF8A80}

/* Hizmet seçimi: hap biçimli işaret kutuları */
.picks{display:flex;flex-wrap:wrap;gap:10px}
.pick{position:relative;display:inline-flex}
.pick input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.pick span{display:inline-flex;align-items:center;min-height:46px;padding:0 18px;border-radius:999px;font-size:15.5px;font-weight:500;color:var(--muted);box-shadow:inset 0 0 0 1px var(--line-strong);transition:background-color 160ms ease,color 160ms ease,box-shadow 160ms ease}
.pick input:checked+span{background:var(--ink);color:var(--bg);box-shadow:none}
.pick input:focus-visible+span{outline:2px solid var(--ink);outline-offset:3px}
@media (hover:hover) and (pointer:fine){.pick input:not(:checked):hover+span{color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}}

/* Onay kutuları */
.check{display:flex;flex-wrap:wrap;align-items:flex-start;gap:0 12px;font-size:15.5px;color:var(--muted);cursor:pointer}
.check input{flex:none;appearance:none;-webkit-appearance:none;width:24px;height:24px;margin:1px 0 0;border-radius:7px;background:var(--bg-lift);box-shadow:inset 0 0 0 1px var(--line-strong);cursor:pointer;transition:background-color 160ms ease,box-shadow 160ms ease}
.check input:checked{background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F5F6F4' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6.5 12.5 3.6 3.6 7.4-8'/%3E%3C/svg%3E") center/100% no-repeat;box-shadow:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .check input:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230E1114' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6.5 12.5 3.6 3.6 7.4-8'/%3E%3C/svg%3E")}}
:root[data-theme="dark"] .check input:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230E1114' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6.5 12.5 3.6 3.6 7.4-8'/%3E%3C/svg%3E")}
.check input:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.check[data-invalid] input{box-shadow:inset 0 0 0 2px var(--bad)}
.check span{flex:1;min-width:0;padding-top:2px}
.check a{color:var(--ink);text-underline-offset:4px}

.form__foot{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:6px}
.form__status{color:var(--muted);font-size:15.5px;min-height:1.5em}
.form button[disabled]{opacity:.6;cursor:progress}
/* Tuzak alanı: ekranda ve ekran okuyucuda yok */
.hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);opacity:0;pointer-events:none}

.form__ok{border-radius:var(--r-lg);background:var(--bg-lift);box-shadow:var(--shadow-sm),inset 0 0 0 1px var(--line);padding:clamp(28px,4vw,56px)}
.form__ok:focus{outline:0}
.form__ok h2{font-size:clamp(30px,3.4vw,46px);line-height:1.05}
.form__ok p{color:var(--muted);margin-top:14px;max-width:52ch}
.form__ok .btn{margin-top:26px}

/* Logo: ışığı yanan pencere + yazı. Koyu görünümde karo biraz açılır ki zeminden ayrılsın */
:root{--logo-karo:#192141}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--logo-karo:#2A3668}}
:root[data-theme="dark"]{--logo-karo:#2A3668}
.brand{gap:.5em}
.brand__mark{width:1.32em;height:1.32em;flex:none}
.brand__karo{fill:var(--logo-karo)}
.brand__cizgi{stroke:var(--logo-karo)}

/* Yasal sayfalar: dar sütun, okunur satır boyu */
.hero--yasal{text-align:left}
.hero--yasal .wrap{max-width:calc(760px + 2*var(--gutter))}
.hero--yasal h1{font-size:clamp(34px,4.4vw,56px);line-height:1.05}
.yasal__tarih{margin-top:16px;font-size:14.5px;color:var(--faint)}
.yasal{max-width:calc(760px + 2*var(--gutter))}
.yasal h2{font-size:clamp(23px,2.3vw,30px);line-height:1.15;margin-top:clamp(36px,4vw,54px)}
.yasal p,.yasal li{color:var(--muted);font-size:17px;line-height:1.65}
.yasal p{margin-top:14px}
.yasal>p:first-child{margin-top:0}
.yasal ul{margin:12px 0 0;padding-left:22px;display:grid;gap:8px}
.yasal a{color:var(--ink);text-underline-offset:4px;text-decoration-thickness:1px}
.yasal strong{color:var(--ink);font-weight:500}
.yasal code{font:500 .92em ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--panel);padding:2px 6px;border-radius:5px;color:var(--ink)}

/* Altbilgide yasal bağlantılar */
.foot .foot__yasal{display:flex;flex-wrap:wrap;gap:0 28px;margin-top:32px}
.foot .foot__yasal a,.foot .foot__yasal button{display:inline-block;padding:9px 0;font-size:14.5px;color:var(--muted);text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:4px;white-space:nowrap}
.foot .foot__yasal+.foot__notes{margin-top:14px}

/* Çerez çubuğu: sol altta küçük bir kart; iki düğme aynı ağırlıkta. Telefonda sabit çağrı çubuğunun üstünde durur */
.cerez{position:fixed;left:16px;bottom:16px;z-index:60;width:min(420px,calc(100vw - 32px));padding:20px 22px 18px;border-radius:var(--r-lg);background:var(--bg-lift);color:var(--ink);box-shadow:var(--shadow),inset 0 0 0 1px var(--line);opacity:0;transform:translateY(10px);transition:opacity 220ms var(--ease-out),transform 220ms var(--ease-out)}
.cerez[data-open]{opacity:1;transform:none}
.cerez p{font-size:15px;line-height:1.5;color:var(--muted)}
.cerez p a{color:var(--ink);text-underline-offset:4px;white-space:nowrap}
.cerez__btns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:16px}
.cerez__btns .btn{justify-content:center}
@media (max-width:959px){.cerez{bottom:92px}}
@media (prefers-reduced-motion:reduce){.cerez{transform:none;transition:opacity 200ms ease}}