:root{
  --wine-deep:#2A1C22; --wine:#3A2830; --wine-soft:#4A343C;
  --forest-deep:#1C2622; --forest:#26332E; --forest-soft:#2F3D37;
  --paper:#F0EBE2; --paper-dim:#E2D9CC;
  --stone:#A89E96; --stone-dark:#756A64; --accent:#A89158;
  --line:rgba(240,235,226,0.12); --line-light:rgba(42,28,34,0.10);
  --ink-deep:var(--wine-deep); --ink:var(--wine); --ink-soft:var(--wine-soft);
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *{ animation-duration:0.001ms !important; transition-duration:0.001ms !important; }
}
body{
  margin:0; color:var(--paper);
  background-color:var(--wine-deep);
  background-image:linear-gradient(180deg, var(--wine-deep) 0%, var(--wine) 22%, var(--forest-deep) 52%, var(--forest) 78%, var(--wine-soft) 100%);
  background-attachment:fixed;
  font-family:'Inter',sans-serif; font-weight:300; font-size:15px; line-height:1.75;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
::selection{ background:var(--paper); color:var(--wine-deep); }
.container{ max-width:1180px; margin:0 auto; padding:0 48px; }
.section{ padding:160px 0; }
.section.light{
  background:linear-gradient(180deg, var(--paper) 0%, var(--paper-dim) 55%, #D8CEC0 100%);
  color:var(--wine-deep);
}
.section.dark{ color:var(--paper); }
#deneyim.section.dark{
  background:linear-gradient(165deg, var(--wine-deep) 0%, var(--wine) 55%, var(--wine-soft) 100%);
}
#projeler.section.dark{
  background:linear-gradient(165deg, var(--wine-soft) 0%, var(--forest-deep) 38%, var(--forest) 100%);
}
#iletisim.section.dark{
  background:linear-gradient(165deg, var(--forest) 0%, var(--forest-deep) 45%, var(--wine-deep) 100%);
}
@media (max-width:800px){
  .container{ padding:0 28px; }
  .section{ padding:96px 0; }
}

/* NAV */
.site-nav{
  position:fixed; top:0; left:0; right:0; z-index:70; height:64px;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 48px; background:transparent; transition:background .35s ease, border-color .35s ease;
}
.site-nav.scrolled{
  background:rgba(42,28,34,0.84); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.nav-brand{
  font-family:'Cormorant Garamond',serif; font-weight:400; font-size:14px;
  letter-spacing:0.2em; text-transform:uppercase; color:var(--paper); text-decoration:none;
}
.nav-end{ display:flex; align-items:center; gap:28px; }
.nav-links{ display:flex; gap:32px; list-style:none; margin:0; padding:0; }
.nav-links a{
  font-size:12px; letter-spacing:0.14em; text-transform:uppercase; text-decoration:none;
  color:var(--stone); position:relative; padding-bottom:4px; transition:color .3s;
}
.nav-links a:hover, .nav-links a.active{ color:var(--paper); }
.nav-links a.active::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--accent);
}
.nav-cta{
  font-size:12px; letter-spacing:0.14em; text-transform:uppercase; text-decoration:none;
  color:var(--stone); padding-bottom:4px; position:relative; transition:color .3s;
}
.nav-cta:hover{ color:var(--paper); }
.nav-cta::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--accent);
  transform:scaleX(0); transform-origin:left; transition:transform .35s ease;
}
.nav-cta:hover::after{ transform:scaleX(1); }
.lang-toggle{ display:flex; align-items:center; gap:6px; }
.lang-toggle button{
  background:none; border:none; cursor:pointer; font-family:'Inter',sans-serif;
  font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--stone); padding:0;
}
.lang-toggle button.active{ color:var(--paper); }
.lang-toggle .sep{ color:var(--stone); font-size:11px; opacity:.5; }

/* STUDIO INDEX */
.studio-index{
  position:fixed; left:48px; bottom:36px; z-index:36; pointer-events:none;
}
.studio-index-num{
  display:block; font-family:'Cormorant Garamond',serif; font-weight:300; font-size:14px;
  color:var(--accent); line-height:1;
}
.studio-index-label{
  display:block; margin-top:6px; font-family:'Inter',sans-serif; font-size:10px;
  letter-spacing:0.18em; text-transform:uppercase; color:var(--stone);
}
body[data-tone="light"] .studio-index-label{ color:var(--stone-dark); }

/* REVEAL */
.reveal{
  opacity:0; transform:translateY(16px);
  transition:opacity .9s cubic-bezier(.2,.8,.2,1), transform .9s cubic-bezier(.2,.8,.2,1);
}
.section.is-active .reveal, .section.is-entered .reveal, .reveal.is-visible{ opacity:1; transform:translateY(0); }

/* HERO */
.hero{
  position:relative; min-height:100vh; display:flex; align-items:flex-end;
  overflow:hidden; background:var(--wine-deep);
}
.hero-bg{
  position:absolute; inset:0; z-index:0;
}
.hero-bg img{
  width:100%; height:100%; object-fit:cover; transform:scale(1);
  animation:hero-burn 18s ease-out forwards;
}
@keyframes hero-burn{ to{ transform:scale(1.04); } }
.hero-overlay{
  position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(to top, rgba(42,28,34,0.88) 0%, rgba(38,51,46,0.42) 48%, rgba(42,28,34,0.72) 100%),
    linear-gradient(135deg, rgba(42,28,34,0.35) 0%, transparent 50%, rgba(28,38,34,0.28) 100%);
}
.hero-inner{
  position:relative; z-index:2; width:100%; padding:0 48px 120px;
}
.hero-eyebrow{
  font-size:11px; letter-spacing:0.22em; text-transform:uppercase; color:var(--stone);
  margin:0 0 24px;
}
.hero-brand{
  margin:0; font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:clamp(28px,5vw,64px); letter-spacing:0.18em; text-transform:uppercase; line-height:1.1;
}
.hero-manifesto{
  margin:28px 0 0; max-width:22ch;
  font-family:'Cormorant Garamond',serif; font-style:italic; font-weight:400;
  font-size:clamp(22px,3.2vw,34px); line-height:1.25; color:rgba(240,235,226,0.92);
}
.hero-meta{
  margin-top:32px; max-width:42ch; font-size:14px; line-height:1.8; color:var(--stone);
}
.scroll-cue{
  position:absolute; right:48px; bottom:48px; z-index:2;
  display:flex; align-items:center; gap:12px;
  font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:var(--stone);
}
.scroll-cue .line{ width:1px; height:40px; background:var(--stone); opacity:.6; }
.hero-enter{ opacity:0; transform:translateY(12px); animation:hero-rise 1.1s cubic-bezier(.2,.8,.2,1) forwards; }
.hero-enter.d1{ animation-delay:.12s; }
.hero-enter.d2{ animation-delay:.24s; }
.hero-enter.d3{ animation-delay:.36s; }
.hero-enter.d4{ animation-delay:.48s; }
@keyframes hero-rise{ to{ opacity:1; transform:translateY(0); } }

/* SECTION HEADERS */
.section-kicker{
  margin:0 0 16px; font-size:11px; letter-spacing:0.22em; text-transform:uppercase;
  color:var(--stone); font-weight:400;
}
.section.light .section-kicker{ color:var(--stone-dark); }
.section-head{ margin-bottom:56px; }
.section-title{
  margin:0; font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:clamp(32px,4vw,56px); letter-spacing:-0.01em; line-height:1.05;
}

/* CAREER */
.career-list{ display:flex; flex-direction:column; }
.career-row{
  display:grid; grid-template-columns:repeat(12,1fr); gap:32px;
  padding:48px 0; border-top:1px solid var(--line);
}
.career-row:last-child{ border-bottom:1px solid var(--line); }
.career-meta{
  grid-column:1/4; font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--stone);
}
.career-body{ grid-column:4/13; }
.career-role{
  margin:0; font-family:'Cormorant Garamond',serif; font-weight:400; font-size:24px; line-height:1.25;
}
.career-company{ margin:8px 0 0; font-size:13px; color:var(--stone); }
.career-desc{ margin:20px 0 0; max-width:60ch; color:var(--stone); }
.career-refs{ margin:16px 0 0; font-size:12px; color:var(--stone); max-width:60ch; }
@media (max-width:800px){
  .career-row{ grid-template-columns:1fr; gap:12px; padding:36px 0; }
  .career-meta, .career-body{ grid-column:1/-1; }
}

/* PROJECTS */
.projects-note{
  margin:0 0 40px; max-width:60ch; color:var(--stone); font-size:14px;
}
.projects-note a{ color:var(--stone); text-decoration:none; border-bottom:1px solid var(--line); transition:border-color .3s; }
.projects-note a:hover{ border-color:var(--accent); }
.project-filters{
  display:flex; flex-wrap:wrap; gap:32px; margin-bottom:56px;
}
.filter-btn{
  background:none; border:none; padding:0 0 6px; cursor:pointer;
  font-family:'Inter',sans-serif; font-size:12px; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--stone); position:relative; transition:color .25s;
}
.filter-btn.active{ color:var(--paper); }
.filter-btn.active::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--accent);
}
.project-grid{
  display:grid; grid-template-columns:repeat(12,1fr); column-gap:32px; row-gap:96px;
}
.project-card{
  border:none; background:none; padding:0; text-align:left; cursor:zoom-in;
  opacity:0; transform:translateY(16px);
  transition:opacity .9s cubic-bezier(.2,.8,.2,1), transform .9s cubic-bezier(.2,.8,.2,1);
}
.project-card.is-visible{ opacity:1; transform:translateY(0); }
.project-card.layout-1{ grid-column:1/8; }
.project-card.layout-1 .project-media{ aspect-ratio:4/3; }
.project-card.layout-2{ grid-column:9/13; margin-top:120px; }
.project-card.layout-2 .project-media{ aspect-ratio:3/4; }
.project-card.layout-3{ grid-column:2/6; }
.project-card.layout-3 .project-media{ aspect-ratio:1/1; }
.project-card.layout-4{ grid-column:7/13; }
.project-card.layout-4 .project-media{ aspect-ratio:16/10; }
.project-card.layout-5{ grid-column:1/6; }
.project-card.layout-5 .project-media{ aspect-ratio:3/4; }
.project-card.layout-6{ grid-column:7/12; margin-top:80px; }
.project-card.layout-6 .project-media{ aspect-ratio:4/3; }
.project-media{ position:relative; overflow:hidden; background:var(--forest-deep); }
.project-media img{
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform 1.2s cubic-bezier(.2,.8,.2,1);
}
.project-card:hover .project-media img{ transform:scale(1.03); }
.project-count{
  position:absolute; right:12px; bottom:12px;
  font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color:rgba(240,235,226,0.76);
}
.project-info{
  display:flex; justify-content:space-between; align-items:baseline; gap:20px;
  margin-top:14px; padding-top:14px; border-top:1px solid var(--line);
}
.project-title{
  margin:0; font-family:'Cormorant Garamond',serif; font-weight:400; font-size:18px;
  color:var(--paper); transition:color .35s ease;
}
.project-card:hover .project-title{ color:var(--accent); }
.project-cat-label{
  font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:var(--stone); flex-shrink:0;
}
@media (max-width:800px){
  .project-grid{ grid-template-columns:1fr; row-gap:48px; }
  .project-card[class*="layout-"]{ grid-column:1/-1; margin-top:0 !important; }
  .project-card[class*="layout-"] .project-media{ aspect-ratio:4/3 !important; }
  .nav-links{ display:none; }
  .site-nav, .hero-inner{ padding-left:28px; padding-right:28px; }
  .scroll-cue{ right:28px; bottom:28px; }
  .studio-index{ left:28px; }
}

/* SERVICES */
.services-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:64px 80px; }
.service-block{ display:grid; grid-template-columns:48px 1fr; gap:24px; }
.service-num{
  font-family:'Cormorant Garamond',serif; font-weight:300; font-size:14px; color:var(--stone-dark);
}
.service-title{
  margin:0 0 20px; font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:28px; line-height:1.2;
}
.service-list{ list-style:none; margin:0; padding:0; }
.service-list li{ font-size:15px; line-height:2; color:var(--wine-deep); }
@media (max-width:800px){ .services-grid{ grid-template-columns:1fr; gap:48px; } }

/* CONTACT */
.contact-section{
  min-height:70vh; display:flex; align-items:center; justify-content:center; text-align:center;
}
.contact-title{
  margin:0; font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:clamp(40px,6vw,88px); line-height:1.05; letter-spacing:-0.01em;
}
.contact-email{
  display:inline-block; margin-top:40px; font-size:18px; color:var(--paper); text-decoration:none;
  padding-bottom:6px; border-bottom:1px solid var(--accent); transition:border-width .3s, opacity .3s;
}
.contact-email:hover{ opacity:.85; border-bottom-width:2px; }
.contact-behance{
  display:block; margin-top:28px; font-size:12px; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--stone); text-decoration:none; transition:color .3s;
}
.contact-behance:hover{ color:var(--paper); }

/* FOOTER */
footer{
  border-top:1px solid var(--line); padding:28px 0;
  background:linear-gradient(180deg, var(--wine-deep) 0%, #1E1418 100%);
}
.footer-row{
  display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap;
  font-size:11px; color:var(--stone);
}
.footer-name{
  font-family:'Cormorant Garamond',serif; font-weight:400; font-size:14px;
  letter-spacing:0.1em; color:var(--paper);
}

/* LIGHTBOX */
.lightbox{
  position:fixed; inset:0; z-index:100; background:rgba(42,28,34,0);
  visibility:hidden; opacity:0; transition:opacity .3s ease, visibility .3s ease;
}
.lightbox.open{ visibility:visible; opacity:1; background:rgba(30,20,24,0.95); }
.lightbox-stage{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  padding:80px 120px 140px;
}
.lightbox-slide{
  position:absolute; max-height:86vh; max-width:min(92vw,1400px); object-fit:contain;
  opacity:0; transform:scale(0.98); transition:opacity .5s ease, transform .5s ease;
  cursor:zoom-in;
}
.lightbox-slide.is-active{ opacity:1; transform:scale(1); }
.lightbox-ui{
  position:absolute; left:0; right:0; bottom:0; padding:32px 48px;
  display:flex; justify-content:space-between; align-items:flex-end; gap:32px;
}
.lightbox-copy{ max-width:48ch; }
.lightbox-title{
  margin:0 0 8px; font-family:'Cormorant Garamond',serif; font-weight:400; font-size:22px;
}
.lightbox-desc{ margin:0; font-size:14px; line-height:1.65; color:var(--stone); max-width:48ch; }
.lightbox-counter{
  font-family:'Cormorant Garamond',serif; font-weight:300; font-size:18px;
  font-variant-numeric:tabular-nums; color:var(--paper); white-space:nowrap;
}
.lightbox-close{
  position:absolute; top:28px; right:32px; width:40px; height:40px;
  background:none; border:none; cursor:pointer; padding:0; color:var(--paper);
}
.lightbox-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:40px; height:40px; border-radius:50%; border:1px solid var(--line);
  background:none; cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0;
  color:var(--paper); transition:border-color .25s, opacity .25s;
}
.lightbox-nav:hover{ border-color:var(--accent); }
.lightbox-prev{ left:40px; }
.lightbox-next{ right:40px; }
@media (max-width:800px){
  .lightbox-stage{ padding:72px 20px 160px; }
  .lightbox-ui{ flex-direction:column; align-items:flex-start; padding:20px 28px 28px; }
  .lightbox-nav{ display:none; }
}