/* =========================================================
   HTC Media · Tasarım katmanı (11 Kasım 2026)
   Sinematik giriş, seçilmiş işler vitrini ve bütün bölümlerde
   ortak dil: sıcak kahve / krem, Cormorant başlıklar, kaydırmayla
   açılan katmanlar. index.html içindeki temel stillerin ÜSTÜNE yüklenir.
   ========================================================= */
:root{
  --mocha:#16130f;      /* kimliğin mürekkep siyahı (eski kahve kalktı) */
  --mink-d:#6c6054;      /* krem üstünde gövde metni (AA) */
  --gold-d:#94763f;      /* krem üstünde vurgu */
  --on-dark:rgba(250,248,245,.66);
  --ease:cubic-bezier(.2,.7,.1,1);
  --pad-x:clamp(20px,6vw,96px);
  --pad-y:clamp(96px,11vw,176px);
}

/* ---------- Temel: yükleyici, imleç, odak ---------- */
#loader{background:var(--mocha)}
html.has-cur body{cursor:none}
.cur{opacity:0;transition:opacity .3s,width .3s,height .3s}
.cur.on{opacity:1}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline-color:var(--ink)}
[data-tone="dark"] :focus-visible,.mnav :focus-visible,body.on-dark nav :focus-visible{outline-color:var(--gold-lt)!important}
.f-group:focus-within{border-bottom-color:var(--gold-lt);box-shadow:0 1px 0 0 var(--gold-lt)}
.f-submit button:hover span{color:var(--ink)}
.f-status.note{color:var(--on-dark)}

/* ---------- Ortak parçalar ---------- */
.lbl{display:flex;align-items:center;gap:12px;font-family:var(--sans);font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--mink-d);font-weight:500;margin:0 0 30px}
.lbl-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);flex:none}
.h2{font-family:var(--serif);font-weight:300;font-size:clamp(40px,5.4vw,84px);line-height:1.04;letter-spacing:-.012em;color:var(--ink);margin:0}
.h2 em,[data-tone="dark"] .h2 em{font-style:italic;color:inherit}
[data-tone="dark"] .h2{color:var(--cream)}
.cta-q{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(22px,2.2vw,30px);line-height:1.3;color:var(--ink);margin:0 0 18px}
[data-tone="dark"] .cta-q{color:var(--cream)}
.link-u{display:inline-flex;align-items:center;gap:12px;font-family:var(--sans);font-size:10px;letter-spacing:.26em;text-transform:uppercase;font-weight:600;color:var(--ink);text-decoration:none;padding-bottom:8px;border-bottom:1px solid var(--gold);transition:color .3s,gap .3s}
.link-u:hover{color:var(--gold-d);gap:16px}
[data-tone="dark"] .link-u{color:var(--cream)}
[data-tone="dark"] .link-u:hover{color:var(--gold-lt)}
.link-u svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.4}

/* başlıklar satır satır (JS .ln oluşturur) */
.ln{display:block;overflow:hidden;padding:0 .12em .24em .15em;margin:0 0 -.24em -.15em}
.ln-i{display:inline-block}
.motion .ln-i{transform:translateY(108%);transition:transform 1.15s var(--ease);transition-delay:calc(var(--i,0) * .1s)}
.motion .in .ln-i{transform:none}

/* görsel perdesi */
.motion [data-wipe]{clip-path:inset(100% 0 0 0);transition:clip-path 1.5s cubic-bezier(.75,0,.2,1)}
.motion [data-wipe] img{transform:scale(1.16);transition:transform 2s var(--ease)}
.motion [data-wipe].in{clip-path:inset(0 0 0 0)}
.motion [data-wipe].in img{transform:none}

/* satır / adım girişleri */
.motion [data-row]{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform 1.1s var(--ease);transition-delay:calc(var(--i,0) * .08s)}
.motion [data-row].in{opacity:1;transform:none}

/* ---------- Menü ---------- */
nav{transition:background .15s,padding .5s,border-color .15s}
.nav-links a{transition:color .15s}
.nav-burger span{transition:transform .45s cubic-bezier(.4,0,.2,1),background .15s}
.nav-cta:hover{color:var(--ink)}
.nav-links a{color:var(--mink-d)}
.nav-cta{white-space:nowrap}
.logo-alt{display:none}
body.on-dark nav .logo-ana,body.menu-open nav .logo-ana{display:none}
body.on-dark nav .logo-alt,body.menu-open nav .logo-alt{display:block}
body.menu-open .logo-img{filter:none}
.ft-logo{height:38px}
body.on-dark nav{background:transparent;border-bottom-color:transparent}
body.on-dark nav.scr{background:rgba(22,19,15,.88);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom-color:rgba(250,248,245,.07)}
body.at-top.on-dark nav.scr,body.menu-open.on-dark nav.scr,body.menu-open nav.scr{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom-color:transparent}
body.on-dark .nav-links a{color:rgba(250,248,245,.74)}
body.on-dark .nav-links a:hover{color:var(--cream)}
body.on-dark .nav-cta{color:var(--cream);border-color:rgba(250,248,245,.42)}
body.on-dark .nav-cta:hover{color:var(--ink);background:var(--gold-lt);border-color:var(--gold-lt)}
body.on-dark .nav-burger span{background:var(--cream)}

/* mobil menü: girişle aynı dil */
.mnav{background:var(--mocha);padding:96px 32px 72px;overflow-y:auto;justify-content:safe center}
.mnav-link{font-family:var(--serif);font-weight:300;font-size:clamp(36px,10vw,48px);letter-spacing:0;line-height:1.1;padding:14px 0;border-bottom:1px solid rgba(250,248,245,.08)}
.mnav-cta{background:transparent;color:var(--cream);border:1px solid rgba(250,248,245,.45);padding:16px 36px}
.mnav-cta:active{border-color:var(--gold-lt);color:var(--gold-lt)}
.mnav-foot{left:32px;color:rgba(250,248,245,.5);letter-spacing:.24em}

/* ---------- GİRİŞ: logo kendini kurar, kaydırınca krem perde iner ---------- */
.intro{position:relative;background:#110f0d;isolation:isolate}
.intro-stage{position:relative;overflow:hidden;overflow:clip}
.intro-stage::after{content:'';position:absolute;inset:0;z-index:-1;opacity:.07;mix-blend-mode:overlay;pointer-events:none;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='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
/* altın ışıklar */
.intro-bg{position:absolute;inset:0;z-index:-3;overflow:hidden}
.intro-bg i{position:absolute;border-radius:50%;will-change:transform}
.intro-bg .b1{width:70vmax;height:70vmax;left:-26vmax;top:-34vmax;background:radial-gradient(closest-side,rgba(212,178,122,.34) 0%,rgba(212,178,122,.1) 50%,rgba(212,178,122,0) 100%);animation:blob1 15s ease-in-out infinite alternate}
.intro-bg .b2{width:66vmax;height:66vmax;right:-24vmax;bottom:-34vmax;background:radial-gradient(closest-side,rgba(184,151,90,.36) 0%,rgba(184,151,90,.11) 50%,rgba(184,151,90,0) 100%);animation:blob2 18s ease-in-out infinite alternate}
.intro-bg .b3{width:46vmax;height:46vmax;right:4vmax;top:-22vmax;background:radial-gradient(closest-side,rgba(243,223,174,.2) 0%,rgba(243,223,174,.06) 50%,rgba(243,223,174,0) 100%);animation:blob3 13s ease-in-out infinite alternate}
.intro-bg .b4{width:44vmax;height:44vmax;left:6vmax;bottom:-26vmax;background:radial-gradient(closest-side,rgba(150,112,52,.32) 0%,rgba(150,112,52,.1) 50%,rgba(150,112,52,0) 100%);animation:blob4 16s ease-in-out infinite alternate}
@keyframes blob1{to{transform:translate(14vmax,10vmax) scale(1.18)}}
@keyframes blob2{to{transform:translate(-12vmax,-10vmax) scale(1.12)}}
@keyframes blob3{to{transform:translate(-16vmax,8vmax) scale(.9)}}
@keyframes blob4{to{transform:translate(12vmax,-6vmax) scale(1.15)}}

/* logo */
.intro-logo{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:center;padding:0 6vw}
.lg{display:block;width:min(64vw,720px);height:auto;overflow:visible;will-change:transform,opacity;translate:-8.8% 0}
.lg *{transform-box:fill-box}
.lg-p{fill:#f5efe4}
.lg-spark{fill:#f6e6bd;opacity:0;transform-origin:50% 50%}
.lg-m{font-family:var(--sans);font-weight:300;font-size:34px;fill:#f5efe4;text-anchor:middle}
.lg-c{stroke-dasharray:360;stroke-dashoffset:0}
.intro.play .lg-p1{transform-origin:50% 100%;animation:lgGrow .75s cubic-bezier(.7,0,.2,1) .2s both}
.intro.play .lg-p2{transform-origin:50% 100%;animation:lgGrow .75s cubic-bezier(.7,0,.2,1) .38s both,lgHit .42s ease-out 1.55s}
.intro.play .lg-ok{animation:lgFly .66s cubic-bezier(.25,.85,.25,1) .95s both}
.intro.play .lg-spark{animation:lgSpark .7s ease-out 1.5s both}
.intro.play .lg-tt{transform-origin:50% 0;animation:lgDrop .6s cubic-bezier(.2,.8,.2,1) 1.85s both}
.intro.play .lg-ts{transform-origin:50% 0;animation:lgGrow .6s cubic-bezier(.7,0,.2,1) 2s both}
.intro.play .lg-c{animation:lgDraw .95s cubic-bezier(.6,0,.2,1) 2.15s both}
.intro.play .lg-alt{transform-origin:0 50%;animation:lgLine .9s cubic-bezier(.7,0,.2,1) 2.6s both}
.intro.play .lg-l{animation:lgUp .6s var(--ease) both}
.intro.play .lg-l1{animation-delay:2.9s}
.intro.play .lg-l2{animation-delay:2.97s}
.intro.play .lg-l3{animation-delay:3.04s}
.intro.play .lg-l4{animation-delay:3.11s}
.intro.play .lg-l5{animation-delay:3.18s}
@keyframes lgGrow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes lgFly{0%{transform:translateX(-170%) scaleX(1.6);opacity:0}18%{opacity:1}82%{transform:translateX(2.5%) scaleX(1)}100%{transform:none;opacity:1}}
@keyframes lgHit{0%{transform:none}25%{transform:translateX(7px)}55%{transform:translateX(-2px)}100%{transform:none}}
@keyframes lgSpark{0%{opacity:.95;transform:scale(.3)}100%{opacity:0;transform:scale(5.5)}}
@keyframes lgDrop{from{transform:translateY(-70px);opacity:0}to{transform:none;opacity:1}}
@keyframes lgDraw{from{stroke-dashoffset:360}to{stroke-dashoffset:0}}
@keyframes lgLine{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes lgUp{from{transform:translateY(10px);opacity:0}to{transform:none;opacity:1}}

/* kaydır işareti */
.intro-cue{position:absolute;left:50%;top:calc(100vh - 104px);top:calc(100svh - 104px);transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:14px;font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:rgba(250,248,245,.65);text-decoration:none;font-weight:500;transition:color .3s}
.intro-cue:hover{color:var(--gold-lt)}
.intro-cue i{display:block;width:1px;height:46px;background:linear-gradient(to bottom,var(--gold-lt),rgba(212,178,122,0));transform-origin:top;animation:introCue 2.6s 3.8s ease-in-out infinite}
.intro.play .intro-cue{animation:lgUp .8s var(--ease) 3.4s both}
@keyframes introCue{0%{transform:scaleY(0);opacity:1}55%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}

/* krem perde */
.curtain{position:relative;z-index:3;color:var(--ink);isolation:isolate;--hem:26px;--fold:72px}
.curtain::before,.curtain::after{content:'';position:absolute;left:0;right:0;top:0;pointer-events:none;
  -webkit-mask:linear-gradient(#000 0 0) top/100% calc(100% - var(--hem)) no-repeat,radial-gradient(calc(var(--fold) / 2) var(--hem) at 50% 0,#000 97%,transparent 100%) bottom/var(--fold) var(--hem) repeat-x;
  mask:linear-gradient(#000 0 0) top/100% calc(100% - var(--hem)) no-repeat,radial-gradient(calc(var(--fold) / 2) var(--hem) at 50% 0,#000 97%,transparent 100%) bottom/var(--fold) var(--hem) repeat-x}
.curtain::before{bottom:0;z-index:-1;background:
  linear-gradient(180deg,rgba(70,48,20,.22) 0%,rgba(70,48,20,0) 14%,rgba(70,48,20,0) 80%,rgba(70,48,20,.12) 100%),
  repeating-linear-gradient(90deg,#d9c9b0 0,#e9dfcd 9px,#f7f0e4 20px,#fffcf6 31px,#f9f3e8 40px,#ebe0cd 54px,#dccdb5 66px,#d9c9b0 72px)}
.curtain::after{bottom:-5px;z-index:-2;background:linear-gradient(90deg,#8a6a35,#d4b27a 30%,#f0dba8 50%,#d4b27a 70%,#8a6a35)}
.curtain-in{min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:110px 24px 90px;box-sizing:border-box}
.intro-h{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(46px,8.4vw,138px);line-height:1.04;letter-spacing:-.012em;color:var(--ink);margin:0}
.intro-h .w{display:inline-block}
.intro-h em .w{background:linear-gradient(100deg,#8a6a35 0%,#b8975a 32%,#dcc084 48%,#b8975a 64%,#8a6a35 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 7s linear infinite}
@keyframes shine{from{background-position:120% 0}to{background-position:-100% 0}}
.intro-sub{margin:clamp(30px,4vw,52px) 0 0;display:flex;gap:10px 18px;align-items:center;justify-content:center;flex-wrap:wrap;font-family:var(--sans);font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--mink-d);font-weight:500}
.intro-dot{width:4px;height:4px;border-radius:50%;background:var(--gold);flex:none}
.intro-cta{display:inline-block;margin-top:clamp(28px,3.4vw,44px);font-family:var(--sans);font-size:10px;letter-spacing:.26em;text-transform:uppercase;font-weight:600;color:var(--cream);background:var(--ink);border:1px solid var(--ink);padding:16px 36px;text-decoration:none;transition:background .3s,color .3s,border-color .3s}
.intro-cta:hover{background:var(--gold-lt);border-color:var(--gold-lt);color:var(--ink)}
/* perde inince yazı gelir (JS .anim ve .go ekler) */
.intro.anim .w{opacity:0;transform:translateY(.22em);filter:blur(10px)}
.intro.anim .intro-sub,.intro.anim .intro-cta{opacity:0}
.intro.anim.go .w{animation:introW 1.4s var(--ease) forwards}
.intro.anim.go .w2{animation-delay:.14s}
.intro.anim.go .w3{animation-delay:.36s}
.intro.anim.go .w4{animation-delay:.5s}
.intro.anim.go .intro-h em .w{animation:introW 1.4s var(--ease) forwards,shine 7s linear 1.8s infinite}
.intro.anim.go .intro-h em .w3{animation-delay:.36s,1.8s}
.intro.anim.go .intro-h em .w4{animation-delay:.5s,1.8s}
.intro.anim.go .intro-sub{transition:opacity 1s .7s;opacity:1}
.intro.anim.go .intro-cta{transition:opacity 1s .9s,background .3s,color .3s,border-color .3s;opacity:1}
@keyframes introW{to{opacity:1;transform:none;filter:none}}

/* kaydırmayla oynayan sürüm (JS .live ekler) */
.intro.live{height:200vh;height:200svh}
.intro.live .intro-stage{position:sticky;top:0;height:100vh;height:100svh}
.intro.live .intro-logo{position:absolute;inset:0;min-height:0}
.intro.live .curtain{position:absolute;top:-8%;left:-4%;right:-4%;height:calc(108% + var(--hem));transform:translateY(calc((var(--cp,0) - 1) * 104%)) skewX(var(--sway,0deg));transform-origin:50% 0;filter:drop-shadow(0 22px 26px rgba(0,0,0,.55));will-change:transform}
.intro.live .curtain-in{min-height:0;height:100%;justify-content:center;padding-top:calc(8% + 70px);padding-bottom:calc(var(--hem) + 40px)}
.nav-logo{transition:opacity .4s,visibility .4s}
body.logo-on .nav-logo{opacity:0;visibility:hidden}

/* ---------- SEÇİLMİŞ İŞLER ---------- */
.works{background:var(--cream)}
.works-hdr{padding:clamp(40px,4vw,64px) 24px 0}
.works-hdr .lbl{justify-content:center;margin:0}

/* Marka bölümleri: yazı bir yanda, kayan kartlar öbür yanda */
.br{position:relative;background:var(--cream);overflow-x:clip;--ch:min(62vh,600px);--cg:24px}
.br-pin{display:grid;grid-template-columns:minmax(0,.6fr) minmax(0,1fr);align-items:center;gap:clamp(32px,5vw,88px);padding:clamp(56px,6vw,96px) 0 clamp(56px,6vw,96px) var(--pad-x)}
.br[data-side="right"] .br-pin{grid-template-columns:minmax(0,1fr) minmax(0,.6fr);padding:clamp(56px,6vw,96px) var(--pad-x) clamp(56px,6vw,96px) 0}
.br[data-side="right"] .br-text{order:2}
.br-text{max-width:420px}
.br-no{display:block;font-family:var(--serif);font-style:italic;font-weight:300;font-size:24px;color:var(--gold-d);margin-bottom:14px}
.br-name{font-family:var(--serif);font-weight:300;font-size:clamp(40px,4.6vw,76px);line-height:1.02;letter-spacing:-.012em;color:var(--ink);margin:0 0 14px}
.br-type{font-family:var(--sans);font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--mink-d);font-weight:500;margin:0}
.br-desc{font-size:15px;line-height:1.8;color:var(--mink-d);margin:24px 0 30px}
.br-count{display:flex;align-items:center;gap:6px;font-family:var(--serif);font-style:italic;font-size:19px;color:var(--mink-d);margin:0}
.br-count-i{color:var(--ink)}
.br-count-s{color:var(--taupe)}
.br-bar{display:none;position:relative;width:96px;height:1px;background:var(--stone);margin-left:18px}
.br-bar i{position:absolute;inset:0;background:var(--gold);transform-origin:left;transform:scaleX(var(--bp,0))}
.br-track-wrap{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.br-track-wrap::-webkit-scrollbar{display:none}
.br-track{display:flex;gap:var(--cg);list-style:none;margin:0;padding:0}
.br[data-side="right"] .br-track{flex-direction:row-reverse}
.br-card{flex:none;height:var(--ch);aspect-ratio:4/5;overflow:hidden;background:var(--warm);scroll-snap-align:start}
.br-card img{width:100%;height:100%;object-fit:cover;display:block}
.br-card video{width:100%;height:100%;object-fit:cover;display:block;background:#000}
.br-card--v{position:relative}
.br-card--v::after{content:'Reels';position:absolute;top:12px;left:12px;font-family:var(--sans);font-size:9px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:#fff;background:rgba(0,0,0,.45);padding:5px 9px;border-radius:2px;pointer-events:none}
/* kaydırmayla oynayan sürüm (JS .live ekler) */
.br.live{height:calc(100vh + (var(--k,6) - 1) * 46vh);height:calc(100svh + (var(--k,6) - 1) * 46svh)}
.br.live .br-pin{position:sticky;top:0;height:100vh;height:100svh;box-sizing:border-box;padding-top:84px;padding-bottom:24px}
.br.live .br-track-wrap{overflow:hidden;scroll-snap-type:none}
.br.live .br-track{will-change:transform}
.br.live .br-card{opacity:.42}
.br.live .br-bar{display:block}

/* Diğer işler: ortada görsel, iki yanda bulanık zemin */
.sc{position:relative;background:var(--cream);overflow-x:clip}
.sc-pin{padding:96px 6vw 24px;max-width:1440px;margin:0 auto}
.sc .lbl{justify-content:center;margin-bottom:30px}
.sc-frame{position:relative}
.sc-slide{margin:0 0 64px;isolation:isolate}
.sc-media{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--charcoal)}
.sc-slide--acik .sc-media{background:var(--warm)}
.sc-bg{position:absolute;inset:-10%;width:120%;height:120%;object-fit:cover;filter:blur(14px) brightness(.58) saturate(1.05)}
.sc-slide--acik .sc-bg{filter:blur(18px) brightness(1.04) saturate(.5);opacity:.5}
.sc-img{position:absolute;top:0;left:50%;height:100%;width:auto;max-width:none;transform:translateX(-50%);object-fit:cover;box-shadow:0 40px 90px -40px rgba(0,0,0,.55)}
.sc-slide--acik .sc-img{box-shadow:0 30px 70px -36px rgba(44,40,37,.35)}
.sc-no{position:absolute;left:clamp(20px,4vw,64px);bottom:clamp(14px,2.6vw,44px);z-index:2;font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(56px,8vw,136px);line-height:.8;color:rgba(250,248,245,.92)}
.sc-slide--acik .sc-no{color:var(--gold)}
.sc-cap{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:20px;text-align:center}
.sc-cap-n,.sc-meta-n{font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.5vw,36px);line-height:1.1;color:var(--ink)}
.sc-cap-t,.sc-meta-t{font-family:var(--sans);font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--mink-d);font-weight:500}
.sc-meta,.sc-c{display:none}
.sc.live{height:calc(100vh + (var(--sc-n,3) - 1) * 78vh);height:calc(100svh + (var(--sc-n,3) - 1) * 78svh)}
.sc.live .sc-pin{position:sticky;top:0;height:100vh;height:100svh;max-width:none;display:flex;flex-direction:column;align-items:center;justify-content:center;justify-content:safe center;padding:92px 6vw 26px;box-sizing:border-box}
.sc.live .lbl{margin-bottom:22px}
.sc.live .sc-frame{width:min(88vw,1320px);height:calc(100vh - 262px);height:calc(100svh - 262px);min-height:300px}
.sc.live .sc-slide{position:absolute;inset:0;margin:0;clip-path:inset(100% 0 0 0)}
.sc.live .sc-slide:first-child{clip-path:none}
.sc.live .sc-media{position:absolute;inset:0;aspect-ratio:auto}
.sc.live .sc-cap{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.sc.live .sc-c{display:block;position:absolute;width:22px;height:22px;z-index:6;pointer-events:none;border-color:var(--gold);border-style:solid;border-width:0;opacity:.85}
.sc.live .sc-c.k-tl{top:-11px;left:-11px;border-top-width:1px;border-left-width:1px}
.sc.live .sc-c.k-tr{top:-11px;right:-11px;border-top-width:1px;border-right-width:1px}
.sc.live .sc-c.k-bl{bottom:-11px;left:-11px;border-bottom-width:1px;border-left-width:1px}
.sc.live .sc-c.k-br{bottom:-11px;right:-11px;border-bottom-width:1px;border-right-width:1px}
.sc.live .sc-meta{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;width:min(88vw,1320px);margin-top:24px;min-height:70px}
.sc-meta p{margin:0}
.sc-meta-n,.sc-meta-t{grid-column:2;text-align:center;transition:opacity .22s,transform .22s}
.sc-meta-n{grid-row:1}
.sc-meta-t{grid-row:2;margin-top:8px!important}
.sc-meta.swap .sc-meta-n,.sc-meta.swap .sc-meta-t{opacity:0;transform:translateY(6px)}
.sc-count{grid-column:3;grid-row:1 / span 2;justify-self:end;display:flex;align-items:baseline;gap:6px;font-family:var(--serif);font-style:italic;font-size:19px;color:var(--mink-d)}
.sc-count-i{color:var(--mink-d)}
.sc-count-s{color:var(--taupe)}
.sc-more{text-align:center;padding:16px 24px clamp(88px,9vw,128px);background:var(--cream)}
.link-ig{display:block;width:max-content;margin:22px auto 0;font-size:12px;color:var(--mink-d);text-decoration:underline;text-underline-offset:4px;transition:color .3s}
.link-ig:hover{color:var(--ink)}

/* ---------- HAKKIMIZDA ---------- */
.about{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:clamp(48px,7vw,128px);align-items:center;padding:var(--pad-y) var(--pad-x);background:var(--cream);max-width:1500px;margin:0 auto}
.about-media{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--mocha)}
.about-media .pl{position:absolute;inset:-9% 0}
.about-media img{width:100%;height:100%;object-fit:cover;display:block;filter:sepia(.3) saturate(.8) brightness(.95)}
.about-cnt{max-width:560px}
.about-cnt .h2{margin-bottom:34px}
.about-cnt p.txt{font-size:15px;line-height:1.85;color:var(--mink-d);margin:0 0 18px}
.clients{margin-top:40px;padding-top:34px;border-top:1px solid var(--stone)}
.clients-t{font-size:12px;color:var(--mink-d);margin:0 0 14px}
.clients-l{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;row-gap:6px;font-family:var(--serif);font-size:clamp(20px,1.8vw,26px);line-height:1.35;color:var(--ink)}
.clients-l li:not(:last-child)::after{content:'·';margin:0 14px;color:var(--gold)}

/* ---------- HİZMETLER + FELSEFE (tek koyu bant) ---------- */
.services{position:relative;background:var(--mocha);color:var(--cream);padding:var(--pad-y) var(--pad-x) clamp(72px,8vw,120px);isolation:isolate;overflow:hidden;overflow:clip}
.services::before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(50% 40% at 85% 10%,rgba(184,151,90,.12),transparent 70%)}
.svc-hdr{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:40px clamp(40px,6vw,120px);align-items:end;max-width:1320px;margin:0 auto clamp(48px,6vw,88px)}
.svc-intro{font-size:15px;line-height:1.85;color:var(--on-dark);max-width:420px;margin:0;justify-self:end}
.svc-list{list-style:none;margin:0 auto;padding:0;max-width:1320px;border-bottom:1px solid rgba(250,248,245,.14)}
.svc-row{position:relative;display:grid;grid-template-columns:72px minmax(0,1.05fr) minmax(0,1.3fr) minmax(0,.75fr);gap:12px 40px;align-items:baseline;padding:clamp(28px,3vw,42px) 0}
.svc-row::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:rgba(250,248,245,.14);transform-origin:left}
.motion .svc-row::before{transform:scaleX(0);transition:transform 1.3s cubic-bezier(.75,0,.2,1);transition-delay:calc(var(--i,0) * .08s)}
.motion .svc-row.in::before{transform:none}
.svc-no{font-family:var(--serif);font-style:italic;font-weight:300;font-size:22px;color:var(--gold-lt)}
.svc-name{font-family:var(--serif);font-weight:300;font-size:clamp(28px,3vw,46px);line-height:1.05;color:var(--cream);margin:0;transition:transform .5s var(--ease),color .4s}
.svc-txt{font-size:14px;line-height:1.8;color:var(--on-dark);margin:0}
.svc-tags{font-family:var(--serif);font-style:italic;font-size:17px;color:rgba(212,178,122,.88);margin:0;text-align:right;line-height:1.5}
@media (hover:hover){
  .svc-row::after{content:'';position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
  .svc-row:hover::after{transform:scaleX(1)}
  .svc-row:hover .svc-name{transform:translateX(10px)}
}
.svc-cta{max-width:1320px;margin:clamp(48px,5vw,72px) auto 0;display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:16px 40px}
.svc-cta .cta-q{margin:0;max-width:640px}

.phil{position:relative;background:var(--mocha);padding:clamp(48px,6vw,96px) var(--pad-x) var(--pad-y);text-align:center;isolation:isolate;overflow:hidden;overflow:clip}
.phil::before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 70% at 50% 50%,rgba(184,151,90,.13),transparent 70%)}
.phil-inner{max-width:1100px;margin:0 auto}
.phil-q{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(34px,5.6vw,86px);line-height:1.16;letter-spacing:-.01em;color:var(--cream);margin:0}
.phil-q em{font-style:normal;color:var(--gold-lt)}
.motion [data-words] .wd{opacity:.16;transition:opacity .45s ease}
.motion [data-words] .wd.on{opacity:1}

/* ---------- SÜREÇ ---------- */
.process{padding:var(--pad-y) var(--pad-x);background:var(--cream)}
.proc-hdr{text-align:center;max-width:760px;margin:0 auto clamp(64px,7vw,104px)}
.proc-hdr .h2{margin-bottom:22px}
.proc-hdr p.txt{font-size:15px;line-height:1.8;color:var(--mink-d);margin:0 auto;max-width:460px}
.proc-track{position:relative;max-width:1320px;margin:0 auto;--p:1}
.proc-line{position:absolute;top:7px;left:7px;right:calc((100% - 120px) / 4 - 7px);height:1px;background:var(--stone)}
.proc-line i{display:block;width:100%;height:100%;background:var(--gold);transform-origin:left;transform:scaleX(var(--p))}
.proc-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px}
.proc-step{position:relative;padding-top:48px}
.proc-dot{position:absolute;top:0;left:0;width:15px;height:15px;border-radius:50%;border:1px solid var(--gold);background:var(--cream);transition:background .5s,transform .5s var(--ease)}
.proc-step.on .proc-dot{background:var(--gold);transform:scale(1.15)}
.proc-step h3{font-family:var(--serif);font-weight:300;font-size:clamp(26px,2.3vw,34px);line-height:1.1;color:var(--ink);margin:0 0 14px}
.proc-step p{font-size:14px;line-height:1.8;color:var(--mink-d);margin:0;max-width:280px}

/* ---------- İLETİŞİM + ALTBİLGİ (tek koyu bant) ---------- */
.contact{background:var(--mocha);padding:var(--pad-y) var(--pad-x);isolation:isolate;gap:clamp(52px,7vw,120px)}
.contact::before{content:'';position:absolute;inset:0;width:auto;height:auto;border:0;border-radius:0;transform:none;z-index:-1;background:radial-gradient(55% 60% at 15% 85%,rgba(184,151,90,.12),transparent 70%)}
.contact::after{display:none}
.ct-left .h2{margin-bottom:24px}
.ct-left p.txt{font-size:15px;line-height:1.85;color:var(--on-dark);margin:0 0 48px;max-width:400px}
.ct-lbl{color:rgba(250,248,245,.55)}
.ct-ico{border-color:rgba(250,248,245,.14)}
footer{background:var(--mocha);border-top:1px solid rgba(250,248,245,.06)}
.ft-display{padding:clamp(48px,6vw,88px) var(--pad-x) 0}
.ft-display-txt{display:block;font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(56px,11vw,184px);line-height:1;letter-spacing:-.02em;color:rgba(212,178,122,.32);-webkit-text-stroke:0;white-space:normal;text-decoration:none;transition:color .4s}
.ft-display-txt:hover{color:var(--gold-lt)}
.ft-bottom{padding:32px var(--pad-x)}
.ft-social a{color:rgba(250,248,245,.6)}

/* ---------- Duyarlı ---------- */
@media (max-height:760px) and (min-width:901px){
  .sc.live .sc-pin{padding-top:76px;padding-bottom:12px}
  .sc.live .lbl{margin-bottom:12px}
  .sc.live .sc-frame{height:calc(100vh - 196px);height:calc(100svh - 196px)}
  .sc.live .sc-meta{margin-top:12px;min-height:56px}
}
@media (max-width:900px){
  .nav-links,.nav-cta{display:none}
  .nav-burger{display:flex}
  nav,nav.scr{padding:22px 24px}
}
@media (max-height:500px){
  .mnav{padding:72px 32px 32px}
  .mnav-link{font-size:28px;padding:8px 0}
  .mnav-cta{margin-top:20px}
  .mnav-foot{position:static;margin-top:20px}
}
@media (max-width:1100px){
  .svc-row{grid-template-columns:56px minmax(0,1fr) minmax(0,1.2fr)}
  .svc-tags{grid-column:2 / -1;text-align:left}
  .proc-track{max-width:640px;padding-left:40px}
  .proc-steps{grid-template-columns:1fr;gap:44px}
  .proc-line{top:0;bottom:0;left:7px;right:auto;width:1px;height:auto}
  .proc-line i{transform-origin:top;transform:scaleY(var(--p))}
  .proc-step{padding-top:0}
  .proc-dot{left:-40px;top:8px}
}
@media (max-width:900px){
  .sc-pin{padding:104px 20px 16px}
  .sc-no{font-size:60px}
  .sc.live .sc-c{display:none}
  .br{--ch:min(calc((100vw - 40px) * .9),46vh)}
  .br-pin,.br[data-side="right"] .br-pin{grid-template-columns:1fr;gap:22px;padding:96px 0 24px 20px}
  .br[data-side="right"] .br-text{order:0}
  .br[data-side="right"] .br-track{flex-direction:row}
  .br-text{max-width:none;padding-right:20px}
  .br-no{font-size:18px;margin-bottom:6px}
  .br-name{font-size:clamp(32px,8vw,44px);margin-bottom:8px}
  .br-desc{font-size:14px;margin:12px 0 14px}
  .br.live .br-pin{padding-top:84px}
  .sc.live .sc-pin{padding:104px 20px 18px}
  .sc.live .sc-frame{width:100%;height:calc(100vh - 260px);height:calc(100svh - 260px)}
  .sc.live .sc-meta{width:100%;grid-template-columns:1fr auto;margin-top:20px}
  .sc-meta-n,.sc-meta-t{grid-column:1;text-align:left}
  .sc-count{grid-column:2}
  .about{grid-template-columns:1fr;gap:48px}
  .about-media{aspect-ratio:4/5;max-height:72vh;max-height:72svh;width:100%}
  .about-cnt{max-width:none}
  .svc-hdr{grid-template-columns:1fr}
  .svc-intro{justify-self:start}
  .contact{grid-template-columns:1fr}
}
@media (max-width:640px){
  .svc-row{grid-template-columns:40px minmax(0,1fr);gap:10px 16px}
  .svc-txt,.svc-tags{grid-column:2}
}
@media (max-width:600px){
  .sc-media{aspect-ratio:4/5}
  .sc-img{left:0;width:100%;transform:none;box-shadow:none}
  .sc-no,.sc-bg{display:none}
  .sc.live .sc-frame{height:min(calc(100vh - 260px),calc((100vw - 40px) * 1.25));height:min(calc(100svh - 260px),calc((100vw - 40px) * 1.25))}
  .intro-sub{flex-direction:column;gap:10px}
  .intro-dot{display:none}
  .clients-l li:not(:last-child)::after{margin:0 10px}
}
@media (max-width:900px){
  .br-pin,.br[data-side="right"] .br-pin{align-content:center}
}
@media (max-width:480px){
  .curtain-in{padding:96px 20px 80px}
  .intro-sub{font-size:9px;letter-spacing:.22em}
}
@media (prefers-reduced-motion:reduce){
  .intro.anim .w,.intro.anim .intro-sub,.intro.anim .intro-cta{opacity:1;transform:none;filter:none;animation:none}
  .intro-bg i{animation:none!important}
}
@media (max-width:900px) and (max-height:760px){
  .br-desc{display:none}
}
@media (max-width:600px){
  .lg{width:84vw}
}