@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Playfair+Display:ital,wght@1,500&display=swap');

:root{--ink:#171714;--paper:#f4f2ed;--line:#d5d1c8;--accent:#d85d39;--serif:'Playfair Display',Georgia,serif;--sans:'DM Sans',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px}a{color:inherit;text-decoration:none}button,input,select{font:inherit}img{display:block;max-width:100%;-webkit-user-drag:none;-webkit-touch-callout:none;user-select:none}.site-header{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;background:var(--paper);position:relative;z-index:20}.brand{display:flex;align-items:center;gap:12px;font-size:14px;letter-spacing:.13em}.brand b{font-weight:600}.brand-mark{width:30px;height:30px;border:1px solid var(--ink);border-radius:50%;display:grid;place-items:center;position:relative}.brand-mark i{position:absolute;width:10px;height:10px;border:1px solid var(--ink);transform:rotate(45deg)}.brand-mark i:nth-child(2){transform:rotate(105deg)}.brand-mark i:nth-child(3){transform:rotate(165deg)}nav{display:flex;align-items:center;gap:32px;font-size:14px}nav a:not(.nav-cta){position:relative}nav a:not(.nav-cta):after{content:'';position:absolute;left:0;bottom:-6px;width:0;height:1px;background:var(--ink);transition:.25s}nav a:hover:after{width:100%}.nav-cta{border:1px solid var(--ink);padding:11px 18px;border-radius:99px;transition:.25s}.nav-cta:hover{background:var(--ink);color:white}.menu-button{display:none;background:none;border:0;padding:8px}.hero{height:calc(100svh - 82px);min-height:620px;position:relative;color:white;overflow:hidden}.hero>img{width:100%;height:100%;object-fit:cover;object-position:center 46%}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,8,.6),rgba(10,10,8,.05) 70%),linear-gradient(0deg,rgba(10,10,8,.3),transparent 45%)}.hero-content{position:absolute;left:7vw;bottom:14%;max-width:800px}.eyebrow,.section-kicker{text-transform:uppercase;letter-spacing:.18em;font-size:11px;font-weight:600}.hero h1,.section h2,.about h2{font-size:clamp(3.3rem,7.1vw,7.2rem);line-height:.91;letter-spacing:-.045em;margin:24px 0 28px;font-weight:500}.hero h1 em,.contact h2 em{font-family:var(--serif);font-weight:500}.hero-content>p:not(.eyebrow){font-size:clamp(1rem,1.4vw,1.25rem);max-width:490px;line-height:1.55}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:36px;margin-top:20px;padding:15px 20px;border-radius:99px;border:1px solid;cursor:pointer;transition:.25s}.button.light{background:white;color:var(--ink);border-color:white}.button:hover{transform:translateY(-2px)}.hero-note{position:absolute;right:4vw;bottom:4%;font-size:11px;letter-spacing:.13em;text-transform:uppercase}.section{padding:120px 7vw}.intro{display:grid;grid-template-columns:1fr 2.3fr;border-bottom:1px solid var(--line)}.intro h2{font-size:clamp(2.7rem,5vw,5.7rem);margin-top:0}.intro>div>p{max-width:650px;line-height:1.75;color:#5f5c55}.section-head{display:flex;align-items:end;justify-content:space-between;gap:32px;margin-bottom:55px}.section-head h2{font-size:clamp(3rem,6vw,6.2rem);margin:18px 0 0}.filters{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.filters button{border:1px solid var(--line);background:transparent;padding:8px 14px;border-radius:99px;font-size:12px;cursor:pointer}.filters button.active,.filters button:hover{background:var(--ink);color:white;border-color:var(--ink)}.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:46px 22px}.project{margin:0}.project.wide{grid-column:span 2}.project img{width:100%;aspect-ratio:4/3;object-fit:cover;background:#ddd}.project.wide img{aspect-ratio:16/8}.project.tall img{aspect-ratio:4/5}.project-meta{display:flex;justify-content:space-between;align-items:center;padding-top:13px}.project-meta span{font-weight:500}.project-meta small{color:#77736a}.services{background:var(--ink);color:var(--paper)}.service-list{border-top:1px solid #494942}.service-list article{display:grid;grid-template-columns:70px 1fr 1fr 30px;align-items:center;gap:30px;padding:34px 0;border-bottom:1px solid #494942}.service-list article>span{color:#898981;font-size:12px}.service-list h3{font-size:clamp(1.4rem,2.5vw,2.4rem);font-weight:500;margin:0}.service-list p{color:#aaa99f;line-height:1.6;margin:0;max-width:470px}.service-list b{font-size:24px;font-weight:400}.about{display:grid;grid-template-columns:1fr 1fr;min-height:750px}.about-image img{width:100%;height:100%;object-fit:cover}.about-copy{padding:100px 7vw;display:flex;flex-direction:column;justify-content:center}.about h2{font-size:clamp(2.7rem,4.8vw,5.3rem)}.about-copy>p:not(.section-kicker){line-height:1.75;color:#5f5c55;max-width:600px}.stats{display:grid;grid-template-columns:repeat(3,1fr);margin-top:48px;padding-top:24px;border-top:1px solid var(--line)}.stats div{display:flex;flex-direction:column;gap:4px}.stats strong{font-size:1.6rem}.stats span{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#77736a}.demo-note{margin-top:40px;color:#88847c;line-height:1.5}.contact{display:grid;grid-template-columns:1.2fr .8fr;gap:10vw;background:#ddd8ce}.contact h2{font-size:clamp(3.1rem,6vw,6.5rem);margin-bottom:0}.contact form{align-self:center;display:grid;gap:22px}.contact label{display:grid;gap:8px;font-size:12px;text-transform:uppercase;letter-spacing:.1em}.contact input,.contact select{border:0;border-bottom:1px solid #aaa59a;background:transparent;padding:13px 0;outline:none;border-radius:0}.contact input:focus,.contact select:focus{border-color:var(--ink)}.button.dark{border:0;background:var(--ink);color:white;width:100%;margin-top:12px}.contact form>p{font-size:11px;color:#706c65;line-height:1.5}footer{min-height:130px;padding:38px 4vw;display:flex;align-items:center;justify-content:space-between;gap:20px;background:var(--ink);color:white;font-size:12px}footer .brand-mark{border-color:white}footer .brand-mark i{border-color:white}.footer-brand{font-size:12px}footer p{color:#8e8e86}.menu-button span{display:block;width:24px;height:1px;background:var(--ink);margin:6px}
@media(max-width:820px){.site-header{height:68px}.menu-button{display:block}nav{display:none;position:absolute;top:68px;left:0;right:0;background:var(--paper);padding:28px 5vw;flex-direction:column;align-items:stretch;border-top:1px solid var(--line)}nav.open{display:flex}.hero{height:calc(92svh - 68px);min-height:570px}.hero-content{left:6vw;right:6vw;bottom:12%}.hero h1{font-size:clamp(3rem,14vw,5.3rem)}.hero-note{display:none}.section{padding:82px 6vw}.intro{grid-template-columns:1fr;gap:45px}.section-head{display:block}.filters{justify-content:flex-start;margin-top:30px}.gallery{gap:32px 12px}.project.wide{grid-column:auto}.project.wide img,.project img{aspect-ratio:4/5}.service-list article{grid-template-columns:35px 1fr 22px}.service-list p{grid-column:2/4}.about{grid-template-columns:1fr}.about-image{height:70vw}.about-copy{padding:80px 6vw}.contact{grid-template-columns:1fr;gap:65px}footer{flex-direction:column;align-items:flex-start}.footer-brand{margin-bottom:15px}}
@media(max-width:540px){.gallery{grid-template-columns:1fr}.project.wide{grid-column:auto}.project img,.project.wide img,.project.tall img{aspect-ratio:4/5}.hero h1{font-size:3.3rem}.hero-content>p:not(.eyebrow){font-size:.95rem}.intro h2,.about h2{font-size:2.75rem}.section-head h2{font-size:3.3rem}.service-list article{gap:14px}.service-list h3{font-size:1.35rem}.stats{gap:12px}.contact h2{font-size:3.3rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Hikâyeler: bütün kartlar aynı ölçü ve hizada */
.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
.project,.project.wide,.project.tall{grid-column:auto;min-width:0}
.project img,.project.wide img,.project.tall img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center}
@media(max-width:820px){.project img,.project.wide img,.project.tall img{aspect-ratio:4/3}}
@media(max-width:540px){.gallery{grid-template-columns:1fr}.project img,.project.wide img,.project.tall img{aspect-ratio:4/3}}

/* Modern arayüz katmanı */
.site-header{position:sticky;top:0;background:rgba(244,242,237,.86);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(23,23,20,.08);transition:box-shadow .3s ease}
.hero>img{animation:hero-in 1.3s cubic-bezier(.2,.7,.2,1) both}
.hero-content{animation:copy-in .9s .15s cubic-bezier(.2,.7,.2,1) both}
.portfolio{background:linear-gradient(180deg,#f4f2ed 0%,#eeebe4 100%)}
.project{position:relative;overflow:hidden;border-radius:2px}
.project img{transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .5s ease;will-change:transform}
.project:after{content:'Fotoğrafı incele ↗';position:absolute;left:18px;top:18px;padding:8px 11px;border-radius:99px;background:rgba(244,242,237,.88);backdrop-filter:blur(10px);font-size:10px;letter-spacing:.08em;text-transform:uppercase;opacity:0;transform:translateY(8px);transition:.35s ease;pointer-events:none}
.project:hover img{transform:scale(1.035);filter:saturate(.92)}
.project:hover:after{opacity:1;transform:translateY(0)}
.project-meta{position:relative;background:var(--paper);padding:14px 2px 2px;z-index:2}
.filters button{transition:background .25s,color .25s,transform .25s}.filters button:hover{transform:translateY(-2px)}
.service-list article{transition:padding .3s ease,background .3s ease}.service-list article:hover{padding-left:18px;padding-right:18px;background:#20201d}
.about-image{overflow:hidden}.about-image img{transition:transform 1s cubic-bezier(.2,.7,.2,1)}.about:hover .about-image img{transform:scale(1.025)}
.button span{transition:transform .25s}.button:hover span{transform:translate(3px,-3px)}
@keyframes hero-in{from{opacity:.35;transform:scale(1.045)}to{opacity:1;transform:scale(1)}}
@keyframes copy-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:820px){.site-header{position:sticky}.project:after{display:none}.service-list article:hover{padding-left:0;padding-right:0}.project-meta{padding-top:12px}}
@media(prefers-reduced-motion:reduce){.hero>img,.hero-content{animation:none}.project img,.about-image img{transform:none!important}}