:root{--bg:#f3eee6;--bg2:#ebe4d8;--card:#faf7f2;--ink:#14161a;--mut:#6a6862;--red:#d60a12;--line:rgba(20,22,26,.14);--r:26px;--ease:cubic-bezier(.16,1,.3,1);--sans:'Montserrat',system-ui,sans-serif;--serif:'Fraunces',Georgia,serif;--mono:'Geist Mono',ui-monospace,monospace;--g:clamp(20px,4.4vw,64px)}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:400 16px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%}a{color:inherit;text-decoration:none}
.wrap{width:min(1320px,100% - var(--g)*2);margin-inline:auto}
h1,h2,h3{font-family:var(--serif);font-weight:300;letter-spacing:-.02em;line-height:1.04;text-wrap:balance}
h2{font-size:clamp(2.2rem,5.2vw,4.4rem)}
h2 em,h1 i,.hero__rot i{font-style:italic;color:var(--red)}
.tag{font:500 .72rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;display:inline-flex;gap:10px;align-items:center;color:var(--ink)}
.tag b{font-weight:500;border:1px solid var(--ink);border-radius:5px;padding:4px 7px}
.sec-head{margin-bottom:50px}.sec-head h2{margin-top:22px}

/* loader */
.loader{position:fixed;inset:0;z-index:100;background:var(--bg);display:grid;place-items:center;transition:transform 1.1s var(--ease) .1s}
.loader__in{display:grid;justify-items:center;gap:22px}
.loader__in img{width:150px;opacity:0;transform:translateY(16px);animation:up 1s var(--ease) .1s forwards}
.loader__line{width:150px;height:1px;background:var(--red);transform:scaleX(0);animation:line 1.1s var(--ease) .45s forwards}
body:not(.is-loading) .loader{transform:translateY(-100%)}
@keyframes up{to{opacity:1;transform:none}}@keyframes line{to{transform:scaleX(1)}}
.reveal{opacity:0;transform:translateY(36px);transition:opacity 1s var(--ease) var(--d,0ms),transform 1.1s var(--ease) var(--d,0ms)}
.reveal.in{opacity:1;transform:none}
.ln{display:block;overflow:hidden;padding-bottom:.08em}.ln>span{display:block;transform:translateY(110%);transition:transform 1.25s var(--ease) var(--ld,0s)}
body:not(.is-loading) .ln>span{transform:none}

/* header + dropdown nav (FabriCo duzeni) */
.top{position:fixed;z-index:60;inset:0 0 auto 0;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px var(--g);transition:background .4s,border-color .4s;border-bottom:1px solid transparent}
.top.is-stuck{background:rgba(243,238,230,.9);backdrop-filter:blur(14px);border-color:var(--line)}
.top.on-dark:not(.is-stuck) .top__logo img{filter:invert(1) hue-rotate(180deg)}
.top__logo img{height:46px;width:auto;transition:filter .3s}
.nav{display:flex;align-items:center;gap:2px;margin-left:auto;font:500 .92rem/1 var(--sans)}
.nav>a,.nav__i>a{display:inline-flex;gap:6px;align-items:center;padding:12px 15px;border-radius:99px;transition:background .3s}
.nav>a:hover,.nav__i:hover>a{background:rgba(20,22,26,.07)}
.nav small{font-size:.6rem;color:var(--mut)}
.nav .lang{font:500 .68rem var(--mono);letter-spacing:.14em;border:1px solid var(--ink);border-radius:99px;padding:7px 12px;margin:0 8px}
.nav .cta{background:var(--ink);color:#fff;padding:16px 24px;font-weight:600;transition:background .3s}.nav .cta:hover{background:var(--red)}
.nav__i{position:relative}
.drop{position:absolute;left:0;top:100%;width:640px;margin-top:10px;background:var(--card);border:1px solid var(--line);border-radius:22px;padding:14px;display:grid;grid-template-columns:1fr 1fr;gap:14px;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .35s var(--ease),transform .5s var(--ease),visibility .35s;box-shadow:0 30px 60px -30px rgba(20,22,26,.3)}
.nav__i:hover .drop,.nav__i:focus-within .drop{opacity:1;visibility:visible;transform:none}
.drop__l{display:flex;flex-direction:column}
.drop__l a{padding:13px 14px;border-radius:12px;font:500 .95rem var(--sans);transition:background .25s,color .25s,padding .35s var(--ease)}
.drop__l a:hover{background:var(--bg);color:var(--red);padding-left:20px}
.drop__v{border-radius:14px;background:var(--bg2) center/cover;min-height:180px;transition:background-image .3s}
.top__menu{display:none;align-items:center;gap:12px;background:none;border:1px solid var(--ink);border-radius:99px;padding:10px 18px;font:600 .72rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;color:var(--ink);margin-left:auto}
.top__menu i{width:18px;height:7px;border-block:1.5px solid var(--red);transition:transform .4s}.top__menu[aria-expanded=true] i{transform:rotate(90deg)}
@media(max-width:1080px){.nav{display:none}.top__menu{display:flex}}

/* mobil / tam ekran numarali menu */
.menu{position:fixed;inset:0;z-index:55;background:var(--bg);display:grid;grid-template-columns:1fr 1fr;padding-top:90px;clip-path:inset(0 0 100% 0);transition:clip-path .9s var(--ease);visibility:hidden}
.menu.open{clip-path:inset(0);visibility:visible}
.menu__list{padding:5vh 6vw;display:flex;flex-direction:column;gap:2px;justify-content:center}.menu__list .tag{margin-bottom:22px}
.menu__list a{display:flex;align-items:baseline;gap:22px;font:300 clamp(2rem,4.6vw,3.8rem)/1.15 var(--serif);letter-spacing:-.02em;padding:6px 0;border-bottom:1px solid var(--line);transition:color .3s,padding .5s var(--ease)}
.menu__list a b{font:500 .72rem var(--mono);color:var(--red);letter-spacing:.2em}.menu__list a:hover{color:var(--red);padding-left:14px}
.menu__view{padding:0 6vw 5vh 0}.menu__img{height:100%;border-radius:var(--r);background:center/cover;min-height:50vh;transition:opacity .25s}
@media(max-width:860px){.menu{grid-template-columns:1fr}.menu__view{display:none}}

/* hero: clip-path ile (GPU) buyuyen video */
.hero{height:260vh;position:relative}
.hero__stage{position:sticky;top:0;height:100vh;overflow:hidden}
.hero__copy{position:absolute;z-index:3;left:var(--g);right:var(--g);top:clamp(100px,16vh,160px);will-change:opacity,transform}
.hero h1{font-size:clamp(3rem,8.2vw,8.2rem);line-height:.95;letter-spacing:-.035em;margin:24px 0 18px}
.hero__rot{font:400 clamp(1rem,1.8vw,1.5rem)/1.3 var(--sans);color:var(--mut)}
.rot{display:inline-grid;vertical-align:bottom;font-family:var(--serif)}
.rot__w{grid-area:1/1;font-style:italic;opacity:0;transform:translateY(60%);transition:opacity .6s var(--ease),transform .9s var(--ease)}
.rot__w.is-on{opacity:1;transform:none}.rot__w.is-out{opacity:0;transform:translateY(-60%)}
.hero__frame{position:absolute;inset:0;z-index:2;clip-path:inset(var(--it,50vh) var(--is,6vw) var(--ib,4vh) var(--is,6vw) round var(--ir,26px));background:#111;will-change:clip-path}
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(var(--vs,1.08));will-change:transform}
.hero__veil{position:absolute;inset:0;background:rgba(10,12,16,.45);opacity:var(--vo,0)}
.hero__cap{position:absolute;left:var(--g);bottom:calc(var(--ib,4vh) + 22px);color:#fff;font:500 .7rem var(--mono);letter-spacing:.16em;text-transform:uppercase;display:flex;gap:10px;align-items:center;opacity:var(--co,1)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--red)}
.hero__big{position:absolute;left:var(--g);right:var(--g);top:50%;transform:translateY(-50%);color:#fff;font:300 clamp(2.2rem,6vw,5.6rem)/1.02 var(--serif);letter-spacing:-.03em;opacity:var(--bo,0)}
@media(max-width:700px){.hero h1{font-size:clamp(2.8rem,15vw,5rem)}}

/* manifesto */
.manifesto{padding:140px 0 110px}
.manifesto__t{font:300 clamp(1.7rem,3.8vw,3.4rem)/1.2 var(--serif);letter-spacing:-.02em;margin:34px 0 70px;max-width:1120px}
.manifesto__t span{color:rgba(20,22,26,.2);transition:color .35s}.manifesto__t span.lit{color:var(--ink)}
.tri{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}.tri h3{font-size:1.5rem;margin-bottom:8px}.tri p{color:var(--mut);font-size:.95rem;max-width:300px}
@media(max-width:760px){.tri{grid-template-columns:1fr}}

/* referans logo akisi (iki sira, ters yon) */
.refs{padding:100px 0;border-top:1px solid var(--line)}.refs h2{margin:22px 0 50px}
.rows{display:grid;gap:14px;overflow:hidden}
.row__t{display:flex;gap:12px;width:max-content;animation:mq 60s linear infinite}.row--1 .row__t{animation-direction:reverse;animation-duration:70s}
.lg{flex:0 0 176px;height:104px;border-radius:14px;display:grid;place-items:center;padding:18px 24px}.lg--l{background:var(--card)}.lg--d{background:#1b1d21}
.lg img{width:100%;height:100%;object-fit:contain}
@keyframes mq{to{transform:translateX(-50%)}}

/* isler */
.works{padding:110px 0 70px}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px 20px}
.work{display:block}.work--wide{grid-column:1/-1}
.work__img{display:block;overflow:hidden;border-radius:var(--r);background:var(--bg2);aspect-ratio:1100/820;border:1px solid var(--line)}.work--wide .work__img{aspect-ratio:16/8}
.work__img img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform 1.4s var(--ease)}.work:hover .work__img img{transform:scale(1.05)}
.work__meta{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:16px 6px 0}
.work__t{display:block;height:1.4em;overflow:hidden;font:400 clamp(1.3rem,2.2vw,1.9rem)/1.4 var(--serif);letter-spacing:-.01em}
.roll{display:flex;flex-direction:column;transition:transform .7s var(--ease)}.roll>span{display:block;height:1.4em;white-space:nowrap}.roll>span+span{font-style:italic;color:var(--red)}
.work:hover .roll{transform:translateY(-1.4em)}
.work__tag{font:500 .7rem var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mut);white-space:nowrap}
@media(max-width:760px){.grid{grid-template-columns:1fr}.work--wide .work__img{aspect-ratio:1100/820}.work__meta{flex-direction:column;gap:4px}}

/* laterna */
.feature{padding:110px 0}
.feature--dark{background:var(--ink);color:#f3eee6;border-radius:var(--r);margin:40px 12px}
.feature--dark .tag{color:#f3eee6}.feature--dark .tag b{border-color:#f3eee6}.feature--dark em{color:#ff5a60}
.feature__in{display:grid;grid-template-columns:1fr 1.2fr;gap:64px;align-items:center}
.feature h2{margin:22px 0}.feature p{color:rgba(243,238,230,.72);max-width:500px;margin-bottom:28px}
.feature__shot{display:block;border-radius:20px;overflow:hidden;border:1px solid rgba(243,238,230,.2)}.feature__shot img{width:100%;transition:transform 1.3s var(--ease)}.feature__shot:hover img{transform:scale(1.04)}
.btns{display:flex;gap:12px;flex-wrap:wrap}
@media(max-width:900px){.feature__in{grid-template-columns:1fr;gap:40px}}

.btn{display:inline-flex;align-items:center;background:var(--ink);color:#fff;border:1px solid transparent;border-radius:99px;padding:17px 28px;font:600 .8rem/1 var(--sans);letter-spacing:.04em;transition:background .35s,color .35s}
.btn:hover{background:var(--red)}.btn--ghost{background:none;color:inherit;border-color:currentColor}.btn--ghost:hover{background:#f3eee6;color:var(--ink)}
.feature--dark .btn{background:var(--red)}.feature--dark .btn:hover{background:#fff;color:var(--ink)}

/* kimlik / yatay serit */
.ident{padding:90px 0 40px}
.hs{display:flex;gap:18px;overflow-x:auto;padding-bottom:20px;scroll-snap-type:x proximity;scrollbar-width:thin}
.id{flex:0 0 min(340px,72vw);scroll-snap-align:start}
.id__img{display:block;aspect-ratio:4/5;border-radius:22px;overflow:hidden;background:var(--bg2);border:1px solid var(--line)}
.id__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}.id:hover .id__img img{transform:scale(1.06)}
.id__t{display:block;margin-top:14px;font:500 .95rem/1.3 var(--sans)}.id__t b{font:500 .72rem var(--mono);color:var(--red);margin-right:12px;letter-spacing:.14em}

/* hizmetler */
.svc{padding:90px 0 110px;position:relative}
.svc__list{list-style:none;border-top:1px solid var(--line)}
.svc__list a{display:grid;grid-template-columns:70px 1.1fr 1.4fr 40px;gap:24px;align-items:center;padding:32px 0;border-bottom:1px solid var(--line);transition:padding .6s var(--ease),background .4s}
.svc__list a:hover{padding-left:18px;background:linear-gradient(90deg,rgba(214,10,18,.06),transparent)}
.svc__list b{font:500 .74rem var(--mono);letter-spacing:.2em;color:var(--red)}
.svc__t{font:300 clamp(1.4rem,2.8vw,2.4rem)/1.1 var(--serif);letter-spacing:-.01em}.svc__m{color:var(--mut);font-size:.92rem}
.svc__a{font-size:1.5rem;color:var(--red);transition:transform .5s var(--ease)}.svc__list a:hover .svc__a{transform:translateX(8px)}
.peek{position:fixed;z-index:30;width:300px;height:200px;border-radius:18px;background:center/cover;pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.85);transition:opacity .3s,transform .5s var(--ease)}.peek.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
@media(max-width:760px){.svc__list a{grid-template-columns:44px 1fr 24px}.svc__m,.peek{display:none}}

/* dai */
.dai{background:var(--ink);color:#f3eee6;padding:120px 0;border-radius:var(--r) var(--r) 0 0}
.dai .tag{color:#f3eee6}.dai .tag b{border-color:#f3eee6}.dai em{color:#ff5a60}
.dai__in{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start}
.dai h2{font-size:clamp(2rem,3.8vw,3.3rem);margin:22px 0}.dai p{color:rgba(243,238,230,.7);margin-bottom:30px;max-width:480px}
.dai .btn{background:var(--red)}.dai .btn:hover{background:#fff;color:var(--ink)}
.steps{list-style:none;display:grid;gap:16px}
.steps li{display:grid;grid-template-columns:54px 1fr;gap:0 18px;padding:22px;border:1px solid rgba(243,238,230,.16);border-radius:22px;transition:border-color .4s,transform .6s var(--ease)}.steps li:hover{border-color:#ff5a60;transform:translateX(6px)}
.steps b{grid-row:span 2;width:46px;height:46px;border-radius:50%;background:var(--red);display:grid;place-items:center;font:500 1rem var(--mono)}
.steps h3{font:400 1.25rem var(--serif)}.steps p{margin:4px 0 0;font-size:.9rem}
@media(max-width:860px){.dai__in{grid-template-columns:1fr}}

.final{padding:130px 0;text-align:left;background:var(--ink);color:#f3eee6;margin:0;width:100%;padding-inline:max(var(--g),calc((100% - 1320px)/2))}
.final .tag{color:#f3eee6}.final .tag b{border-color:#f3eee6}.final em{color:#ff5a60}.final h2{margin:22px 0 34px;max-width:900px}.final .btn{background:var(--red)}.final .btn:hover{background:#fff;color:var(--ink)}
.foot{background:var(--ink);color:#f3eee6;border-top:1px solid rgba(243,238,230,.14);padding:56px 0}
.foot__in{display:grid;gap:16px}.foot__logo img{height:56px;filter:invert(1) hue-rotate(180deg)}.foot p{color:rgba(243,238,230,.62);max-width:560px;font-size:.9rem}.foot a:hover{color:#ff5a60}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal,.ln>span{opacity:1;transform:none}.loader{display:none}}

/* hero v3: tam ekran video + donen baslik (RND House tarzi) */
.hero{height:100vh;min-height:560px}
.hero__stage{position:relative;height:100%}
.hero__frame{clip-path:none!important;background:#111}
.hero__video{transform:none!important}
.hero__veil{opacity:1!important;background:linear-gradient(180deg,rgba(10,12,16,.45) 0%,rgba(10,12,16,.15) 40%,rgba(10,12,16,.6) 100%)}
.hero__copy{top:auto;bottom:clamp(40px,9vh,100px);color:#fff}
.hero__copy .tag{color:rgba(255,255,255,.85)}
.hero h1.hero__h{font:300 clamp(3.2rem,10vw,10rem)/.98 var(--serif);letter-spacing:-.04em;margin:18px 0 14px;color:#fff}
.hero__h .rot{display:inline-grid;min-width:0}
.hero__h .rot__w{font-style:normal;color:#fff}
.hero__rot{color:rgba(255,255,255,.88)}
.hero__veil{background:linear-gradient(180deg,rgba(10,12,16,.6) 0%,rgba(10,12,16,.42) 45%,rgba(10,12,16,.72) 100%)!important}
.top.on-dark:not(.is-stuck) .nav>a:not(.cta),.top.on-dark:not(.is-stuck) .nav__i>a,.top.on-dark:not(.is-stuck) .lang{color:#fff;border-color:rgba(255,255,255,.6)}
.hero__h .rot{margin-right:-.04em}
.lg--d,.lg--l{background:var(--card)}.lg{border:1px solid var(--line)}
.lg{overflow:hidden;grid-template:100%/100%}.lg img{min-width:0;min-height:0;max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain}.lg:has(img[src*="abcyapi"]) img,.lg:has(img[src*="agvaskg"]) img,.lg:has(img[src*="pizza"]) img{width:auto;height:100%;padding:0}
/* referans hover (FabriCo gibi): serit durur, uzerindeki kart one cikar, digerleri soner */
.rows{-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.lg{transition:opacity .3s,background .3s,border-color .3s}.lg img{transition:transform .35s cubic-bezier(.2,.7,.2,1)}
@media(hover:hover){
.rows:hover .row__t{animation-play-state:paused}
.rows:hover .lg{opacity:.45}
.rows .lg:hover{opacity:1;background:#fff;border-color:var(--ink,#1b1d21)}
.rows .lg:hover img{transform:scale(1.1)}
}
.top.on-dark:not(.is-stuck) .top__menu{color:#fff;border-color:rgba(255,255,255,.7)}
body.menu-on .top .top__logo img{filter:none!important}
body.menu-on .top .top__menu{color:var(--ink,#111)!important;border-color:currentColor!important}
::selection{background:var(--red,#d4141c);color:#fff}::-moz-selection{background:var(--red,#d4141c);color:#fff}
/* Cizgiden urune: sabitlenen yatay kaydirma (FabriCo "Uretim surecimiz" gibi) */
.hs__bar{display:none}
@media(min-width:861px) and (hover:hover){
.ident{padding:0;position:relative}
.ident__pin{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;gap:34px;overflow:hidden}
.ident .sec-head{margin:0}
.hs{overflow:visible;width:max-content;max-width:none;padding:0 var(--g);gap:22px;will-change:transform;scroll-snap-type:none}
.id{flex:0 0 clamp(280px,23vw,380px)}
.hs__bar{display:block;height:2px;background:var(--line);position:relative;overflow:hidden}
.hs__bar i{position:absolute;inset:0;background:var(--red);transform:scaleX(0);transform-origin:left}
}
@media(min-width:861px) and (hover:hover){.ident .sec-head{align-self:stretch;box-sizing:border-box;width:100%;max-width:none;padding:0 var(--g)}.ident .hs__bar{align-self:stretch;margin:0 var(--g)}}
.id__all{display:flex;flex-direction:column;justify-content:space-between;width:100%;height:100%;box-sizing:border-box;padding:28px;background:var(--ink);color:#fff;transition:background .4s var(--ease)}
.id__all small{font:500 .7rem var(--mono);letter-spacing:.16em;text-transform:uppercase;opacity:.7}
.id__all b{font:300 clamp(2rem,3vw,3rem)/1 var(--serif);letter-spacing:-.03em}
.id__all i{font-style:normal;font-size:2.4rem;transition:transform .4s var(--ease)}
.id--all:hover .id__all{background:var(--red)}.id--all:hover .id__all i{transform:translateX(10px)}
/* S.08 acik tema */
.final{background:var(--bg);color:var(--ink)}
.final .tag,.final .tag b{color:var(--ink)}.final .tag b{border-color:var(--ink)}.final em{color:var(--red)}
.final .btn{background:var(--ink);color:#fff}.final .btn:hover{background:var(--red);color:#fff}
/* hero: video scrolla bagli (test) */
.hero--scrub{height:520vh}
.hero--scrub .hero__stage{position:sticky;top:0;height:100vh}

/* hero scroll dugmesi */
.hero__scroll{position:absolute;z-index:4;right:var(--g);bottom:clamp(28px,6vh,64px);width:84px;height:84px;border:0;border-radius:50%;padding:0;background:rgba(10,12,16,.28);backdrop-filter:blur(8px);color:#fff;cursor:pointer;display:grid;place-items:center;transition:opacity .4s,transform .4s var(--ease),background .3s}
.hero__scroll:hover{background:rgba(214,10,18,.85);transform:scale(1.06)}
.hero__scroll svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.hero__scroll circle{fill:none;stroke-width:1.5}
.hero__ring0{stroke:rgba(255,255,255,.35)}.hero__ring{stroke:#fff;transition:stroke-dashoffset .15s linear}
.hero__scroll span{font:500 .62rem var(--mono);letter-spacing:.18em;text-transform:uppercase;margin-top:-14px}
.hero__scroll i{font-style:normal;font-size:1.15rem;position:absolute;bottom:17px;animation:hbob 1.8s ease-in-out infinite}
.hero__scroll.is-auto i{animation:none}.hero__scroll.is-auto i:before{content:"■";font-size:.6rem}.hero__scroll.is-auto i{font-size:0}.hero__scroll.is-auto i:before{font-size:.7rem}
.hero__scroll.is-gone{opacity:0;pointer-events:none;transform:translateY(20px)}
@keyframes hbob{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
@media(max-width:700px){.hero__scroll{width:68px;height:68px;bottom:22px}.hero__scroll span{font-size:.55rem}}
