/* ============================================================
   BERK TANEROĞLU — PORTFOLYO
   Konsept: "Diyafram / Karanlık Oda" — fotoğrafçılık enstrümanlarının
   (diyafram, pozlama, kare, EXIF) görsel diline dayanan efekt sistemi.
   ============================================================ */

:root{
	--ink:        #0c0b09;
	--ink-soft:   #16140f;
	--paper:      #f3ede1;
	--paper-dim:  #a89f8e;
	--paper-faint:#6f6858;
	--signal:     #ff4e1f;
	--signal-2:   #ffb020;
	--line:       rgba(243,237,225,0.14);
	--line-strong:rgba(243,237,225,0.28);

	--f-display: 'Space Grotesk', system-ui, sans-serif;
	--f-body:    'Inter', system-ui, sans-serif;
	--f-mono:    'JetBrains Mono', 'Courier New', monospace;

	--container: 1360px;
	--pad: clamp(20px, 4vw, 64px);
	--ease: cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; background:var(--ink); }
html,body{ margin:0; padding:0; }
body{
	background:var(--ink);
	color:var(--paper);
	font-family:var(--f-body);
	font-size:16px;
	line-height:1.6;
	overflow-x:hidden;
	-webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; background:none; border:none; color:inherit; padding:0; -webkit-appearance:none; appearance:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family:var(--f-display); font-weight:600; margin:0; line-height:1.05; letter-spacing:-0.01em; }
p{ margin:0 0 1em; }
::selection{ background:var(--signal); color:var(--ink); }

/* Odak durumları — erişilebilirlik */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
	outline:2px solid var(--signal);
	outline-offset:3px;
	border-radius:2px;
}

.bt-label-mono{
	font-family:var(--f-mono);
	font-size:11px;
	letter-spacing:0.14em;
	text-transform:uppercase;
	color:var(--paper-dim);
}
.bt-eyebrow{
	font-family:var(--f-mono);
	font-size:12px;
	letter-spacing:0.16em;
	text-transform:uppercase;
	color:var(--signal);
}

/* ============ REDUCED MOTION ============ */
@media (prefers-reduced-motion: reduce){
	*{ animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important; }
}

/* ============================================================
   PRELOADER — Diyafram (aperture) açılışı
   ============================================================ */
.bt-loader{
	position:fixed; inset:0; z-index:9999;
	background:var(--ink);
	display:flex; flex-direction:column; align-items:center; justify-content:center;
	gap:22px;
	transition:opacity .7s var(--ease), visibility .7s var(--ease);
}
.bt-loader.is-done{ opacity:0; visibility:hidden; pointer-events:none; }
.bt-loader__iris{ width:120px; height:120px; overflow:visible; }
.bt-blade{
	fill:var(--paper);
	transform-origin:100px 100px;
	animation:bt-blade-open 1.1s var(--ease) forwards .15s;
	opacity:0.95;
}
@keyframes bt-blade-open{
	0%{ transform:rotate(var(--r,0deg)) scale(1); }
	100%{ transform:rotate(var(--r,0deg)) scale(0.05); opacity:0; }
}
.bt-loader__label{
	font-family:var(--f-mono); font-size:11px; letter-spacing:0.2em; color:var(--paper-dim); text-transform:uppercase;
}
.bt-dots{ animation:bt-dots 1.2s steps(4) infinite; }
@keyframes bt-dots{ to{ clip-path:inset(0 0 0 100%); } }

/* ============================================================
   GRAIN / FILM DOKUSU
   ============================================================ */
.bt-grain{
	position:fixed; inset:-100px; z-index:2; pointer-events:none;
	opacity:0.045; mix-blend-mode:overlay;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
	animation:bt-grain-shift 1s steps(2) infinite;
}
@keyframes bt-grain-shift{ 0%{ transform:translate(0,0); } 50%{ transform:translate(-2%,2%); } 100%{ transform:translate(2%,-1%); } }

/* ============================================================
   SCROLL PROGRESS
   ============================================================ */
.bt-progress{ position:fixed; top:0; left:0; width:100%; height:2px; z-index:900; background:transparent; }
.bt-progress span{ display:block; height:100%; width:0%; background:var(--signal); transition:width .1s linear; }

/* ============================================================
   ÖZEL İMLEÇ (viewfinder)
   ============================================================ */
.bt-cursor{
	position:fixed; top:0; left:0; width:34px; height:34px;
	transform:translate(-50%,-50%);
	pointer-events:none; z-index:9998; mix-blend-mode:difference;
	opacity:0; transition:opacity .3s, width .25s var(--ease), height .25s var(--ease);
}
.bt-cursor.is-active{ opacity:1; }
.bt-cursor.is-hover{ width:64px; height:64px; }
.bt-cursor__dot{ position:absolute; top:50%; left:50%; width:5px; height:5px; margin:-2.5px; background:var(--paper); border-radius:50%; }
.bt-cursor__corner{ position:absolute; width:9px; height:9px; border:1.4px solid var(--paper); }
.bt-cursor__corner--tl{ top:0; left:0; border-right:none; border-bottom:none; }
.bt-cursor__corner--tr{ top:0; right:0; border-left:none; border-bottom:none; }
.bt-cursor__corner--bl{ bottom:0; left:0; border-right:none; border-top:none; }
.bt-cursor__corner--br{ bottom:0; right:0; border-left:none; border-top:none; }
@media (hover:none), (pointer:coarse){ .bt-cursor{ display:none; } }

/* ============================================================
   HEADER / NAV
   ============================================================ */
.bt-header{
	position:fixed; top:0; left:0; width:100%; z-index:500;
	padding:20px var(--pad);
	display:flex; align-items:center;
	transition:background .35s var(--ease), padding .35s var(--ease), border-color .35s;
	border-bottom:1px solid transparent;
}
.bt-header.is-scrolled{
	background:rgba(12,11,9,0.86);
	backdrop-filter:blur(10px);
	padding-top:14px; padding-bottom:14px;
	border-bottom-color:var(--line);
}
.bt-header__inner{ width:100%; max-width:var(--container); margin:0 auto; display:flex; align-items:center; gap:28px; }
.bt-logo{ display:flex; align-items:center; margin-right:24px; flex-shrink:0; }
.bt-logo img{ height:34px; width:auto; filter:invert(1) brightness(2); }

/* ============ LANGUAGE SWITCHER ============ */
.bt-lang-switch{ display:flex; align-items:center; gap:4px; font-family:var(--f-mono); font-size:11px; letter-spacing:.04em; }
.bt-lang-switch a{ color:var(--paper-faint); padding:5px 8px; border-radius:4px; transition:color .2s, background .2s; }
.bt-lang-switch a:hover{ color:var(--paper); }
.bt-lang-switch a.is-active{ color:var(--signal); background:rgba(255,78,31,.1); }
.bt-lang-switch--desktop{ margin-right:8px; }
.bt-lang-switch--mobile{ display:none; }
.bt-lang-switch--footer{ order:2; }

.bt-nav__list{ display:flex; gap:32px; }
.bt-nav__list a{
	font-size:14px; font-weight:500; color:var(--paper-dim);
	position:relative; padding:4px 0; transition:color .25s;
}
.bt-nav__list a::after{
	content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--signal);
	transition:width .3s var(--ease);
}
.bt-nav__list a:hover{ color:var(--paper); }
.bt-nav__list a:hover::after{ width:100%; }

.bt-header__cta{ display:inline-flex; }
.bt-burger{ display:none; flex-direction:column; align-items:center; justify-content:center; gap:5px; width:26px; height:26px; padding:0; }
.bt-burger span{ height:2px; width:22px; flex-shrink:0; background:var(--paper); transition:transform .3s var(--ease), opacity .3s; }
.bt-burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.bt-burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.bt-burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ============================================================
   BUTTONS
   ============================================================ */
.bt-btn{ position:relative; display:inline-flex; align-items:center; justify-content:center; padding:14px 30px; font-size:14px; font-weight:600; border-radius:100px; white-space:nowrap; overflow:hidden; }
.bt-btn--solid{ background:var(--signal); color:var(--ink); }
.bt-btn--solid:hover{ background:var(--signal-2); }
.bt-btn--ghost{ border:1px solid var(--line-strong); color:var(--paper); padding:12px 26px; }
.bt-btn--ghost:hover{ border-color:var(--signal); color:var(--signal); }
.bt-btn span{ position:relative; z-index:2; }

/* ============================================================
   HERO
   ============================================================ */
.bt-hero{ position:relative; min-height:100svh; display:flex; align-items:flex-end; overflow:hidden; }
.bt-hero__media{ position:absolute; inset:0; z-index:0; }
.bt-hero__img{ width:100%; height:100%; object-fit:cover; object-position:center 20%; transform:scale(1.08); will-change:transform; }
.bt-hero__scrim{
	position:absolute; inset:0;
	background:
		linear-gradient(90deg, rgba(12,11,9,.96) 0%, rgba(12,11,9,.7) 42%, rgba(12,11,9,.25) 68%, rgba(12,11,9,.55) 100%),
		linear-gradient(0deg, var(--ink) 0%, transparent 34%, transparent 100%);
}
.bt-hero__inner{ position:relative; z-index:2; width:100%; max-width:var(--container); margin:0 auto; padding:0 var(--pad) 96px; }
.bt-hero__eyebrow{ margin-bottom:22px; display:inline-block; }
.bt-hero__title{ font-size:clamp(42px, 8.6vw, 118px); text-transform:uppercase; }
.bt-hero__title-main{ display:inline-block; }
.bt-hero__tagline{ font-size:clamp(16px,2vw,21px); color:var(--paper-dim); max-width:560px; margin-top:20px; font-weight:400; }
.bt-hero__row{ display:flex; align-items:center; gap:28px; margin-top:40px; flex-wrap:wrap; }
.bt-hero__loc{ display:inline-flex; align-items:center; gap:7px; font-family:var(--f-mono); font-size:12px; color:var(--paper-dim); letter-spacing:.05em; }

.bt-hero__scroll{ position:absolute; right:var(--pad); bottom:34px; z-index:2; display:flex; flex-direction:column; align-items:center; gap:10px; }
.bt-hero__scroll span{ width:1px; height:46px; background:linear-gradient(var(--paper-dim), transparent); position:relative; overflow:hidden; }
.bt-hero__scroll span::after{ content:''; position:absolute; top:-100%; left:0; width:100%; height:100%; background:var(--signal); animation:bt-scrollline 1.8s var(--ease) infinite; }
@keyframes bt-scrollline{ to{ top:100%; } }
.bt-hero__scroll em{ font-style:normal; font-family:var(--f-mono); font-size:10px; letter-spacing:.2em; color:var(--paper-faint); writing-mode:vertical-rl; }

/* glitch başlık efekti — hover'da RGB kanal ayrışması */
[data-glitch-text]{ position:relative; display:inline-block; cursor:default; }
[data-glitch-text]:hover .bt-hero__title-main{ animation:bt-glitch .38s steps(2) 2; }
@keyframes bt-glitch{
	0%{ transform:translate(0,0); text-shadow:none; }
	20%{ transform:translate(-2px,1px); text-shadow:2px 0 var(--signal), -2px 0 #2be0ff; }
	40%{ transform:translate(2px,-1px); text-shadow:-2px 0 var(--signal), 2px 0 #2be0ff; }
	60%{ transform:translate(-1px,0); text-shadow:1px 0 var(--signal), -1px 0 #2be0ff; }
	100%{ transform:translate(0,0); text-shadow:none; }
}

/* ============================================================
   MARQUEE
   ============================================================ */
.bt-marquee{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); overflow:hidden; background:var(--ink-soft); padding:16px 0; }
.bt-marquee__track{ display:flex; width:max-content; gap:20px; animation:bt-marquee 32s linear infinite; }
.bt-marquee__track span{ font-family:var(--f-display); font-size:clamp(18px,2.6vw,30px); text-transform:uppercase; color:transparent; -webkit-text-stroke:1px var(--paper-dim); white-space:nowrap; }
.bt-marquee__dot{ color:var(--signal); -webkit-text-stroke:0; font-size:16px; align-self:center; }
@keyframes bt-marquee{ to{ transform:translateX(-50%); } }
.bt-marquee:hover .bt-marquee__track{ animation-play-state:paused; }

/* ============================================================
   SECTION FRAME (eyebrow bar reused across sections)
   ============================================================ */
.bt-about__frame, .bt-works__frame{
	max-width:var(--container); margin:0 auto; padding:80px var(--pad) 0;
	display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.bt-section-title{ font-size:clamp(30px,4.6vw,52px); margin-bottom:26px; }

/* ============================================================
   HAKKIMDA
   ============================================================ */
.bt-about{ padding-bottom:60px; }
.bt-about__inner{ max-width:var(--container); margin:0 auto; padding:40px var(--pad) 0; display:grid; grid-template-columns:0.8fr 1.2fr; gap:64px; align-items:start; }
.bt-about__media{ position:relative; aspect-ratio:4/5; overflow:hidden; border-radius:6px; }
.bt-about__media img{ width:100%; height:100%; object-fit:cover; filter:grayscale(0.55) contrast(1.05); transition:filter .5s; }
.bt-about__media:hover img{ filter:grayscale(0) contrast(1); }
.bt-about__frame-tag{
	position:absolute; left:12px; bottom:12px; font-family:var(--f-mono); font-size:10px; letter-spacing:.08em;
	background:rgba(12,11,9,.75); color:var(--paper-dim); padding:5px 9px; border:1px solid var(--line); border-radius:3px;
}
.bt-about__text{ color:var(--paper-dim); font-size:16.5px; max-width:56ch; }
.bt-about__text p{ margin-bottom:1.1em; }

.bt-stats{ display:flex; gap:48px; margin-top:38px; flex-wrap:wrap; }
.bt-stat{ display:flex; flex-direction:column; }
.bt-stat__num{ font-family:var(--f-display); font-size:clamp(34px,3.6vw,48px); font-weight:700; color:var(--signal); line-height:1; }
.bt-stat__num::after{ content:'+'; }
.bt-stat__label{ font-family:var(--f-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--paper-faint); margin-top:8px; }

/* ============================================================
   PROJELER (WORKS GRID)
   ============================================================ */
.bt-works{ padding-bottom:100px; }
.bt-works__filters{ display:flex; gap:10px; flex-wrap:wrap; }
.bt-filter{
	font-family:var(--f-mono); font-size:11.5px; letter-spacing:.06em; text-transform:uppercase;
	padding:8px 16px; border:1px solid var(--line); border-radius:100px; color:var(--paper-dim); transition:all .25s;
}
.bt-filter:hover{ border-color:var(--paper-dim); color:var(--paper); }
.bt-filter.is-active{ background:var(--paper); color:var(--ink); border-color:var(--paper); }

.bt-works__grid{
	max-width:var(--container); margin:40px auto 0; padding:0 var(--pad);
	display:grid; grid-template-columns:repeat(3, 1fr); gap:2px;
	background:var(--line);
}
.bt-work{
	position:relative; background:var(--ink); display:flex; flex-direction:column; overflow:hidden;
	transition:transform .4s var(--ease);
}
.bt-work.is-hidden{ display:none; }
.bt-work__frame-no{
	position:absolute; top:14px; left:14px; z-index:3; font-family:var(--f-mono); font-size:11px; color:var(--paper);
	background:rgba(12,11,9,.65); padding:3px 8px; border-radius:3px; letter-spacing:.05em;
}
.bt-work__media{ position:relative; aspect-ratio:4/5; overflow:hidden; }
.bt-work__media img{ width:100%; height:100%; object-fit:cover; filter:grayscale(0.85) contrast(1.05) brightness(0.85); transition:transform .7s var(--ease), filter .5s; }
.bt-work:hover .bt-work__media img{ transform:scale(1.06); filter:grayscale(0) contrast(1) brightness(1); }
.bt-work__info{ padding:18px 20px 8px; display:flex; flex-direction:column; gap:6px; }
.bt-work__title{ font-size:19px; }
.bt-work__meta{ font-family:var(--f-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--paper-faint); }
.bt-work__view{
	position:absolute; right:16px; bottom:16px; font-family:var(--f-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase;
	color:var(--signal); opacity:0; transform:translateY(6px); transition:all .3s var(--ease);
}
.bt-work:hover .bt-work__view{ opacity:1; transform:translateY(0); }
.bt-work:hover{ z-index:2; }

.bt-works__empty{ max-width:var(--container); margin:40px auto 0; padding:60px var(--pad); text-align:center; color:var(--paper-dim); border:1px dashed var(--line); border-radius:8px; }

/* ============================================================
   CASE STUDY (single-proje)
   ============================================================ */
.bt-case__hero{ position:relative; height:80vh; min-height:520px; overflow:hidden; margin-top:0; }
.bt-case__cover{ width:100%; height:100%; object-fit:cover; }
.bt-case__scrim{ position:absolute; inset:0; background:linear-gradient(0deg, var(--ink) 4%, rgba(12,11,9,.35) 55%, rgba(12,11,9,.55) 100%); }
.bt-case__hero-inner{ position:absolute; left:0; bottom:0; width:100%; padding:0 var(--pad) 56px; max-width:var(--container); margin:0 auto; right:0; }
.bt-back{ display:inline-block; font-family:var(--f-mono); font-size:12px; color:var(--paper-dim); margin-bottom:22px; letter-spacing:.05em; transition:color .25s; }
.bt-back:hover{ color:var(--signal); }
.bt-case__title{ font-size:clamp(34px,6vw,72px); margin-bottom:14px; }

.bt-exif{
	max-width:var(--container); margin:0 auto; padding:34px var(--pad); display:flex; gap:48px; flex-wrap:wrap;
	border-bottom:1px solid var(--line);
}
.bt-exif__item{ display:flex; flex-direction:column; gap:6px; }
.bt-exif__item strong{ font-size:15px; font-weight:500; }
.bt-exif__item a{ color:var(--signal); font-size:15px; }

.bt-case__body{ max-width:760px; margin:0 auto; padding:56px var(--pad) 20px; font-size:17.5px; color:var(--paper-dim); }
.bt-case__body p{ margin-bottom:1.3em; }
.bt-case__body strong{ color:var(--paper); }

.bt-case__gallery{
	max-width:var(--container); margin:40px auto 0; padding:0 var(--pad);
	display:grid; grid-template-columns:repeat(2,1fr); gap:3px;
}
.bt-case__gallery-item{ position:relative; overflow:hidden; aspect-ratio:4/3; display:block; width:100%; padding:0; }
.bt-case__gallery-item img{ width:100%; height:100%; object-fit:cover; filter:grayscale(.7) contrast(1.05); transition:transform .6s var(--ease), filter .4s; }
.bt-case__gallery-item:hover img{ transform:scale(1.04); filter:grayscale(0) contrast(1); }

.bt-case__next{ max-width:var(--container); margin:90px auto 0; padding:0 var(--pad) 100px; }
.bt-case__next-link{ display:block; border-top:1px solid var(--line); padding-top:34px; }
.bt-case__next-title{ display:block; font-family:var(--f-display); font-size:clamp(28px,5vw,58px); margin-top:12px; transition:color .3s; }
.bt-case__next-link:hover .bt-case__next-title{ color:var(--signal); }

/* ============================================================
   LIGHTBOX
   ============================================================ */
.bt-lightbox{
	position:fixed; inset:0; z-index:9997; background:rgba(9,8,7,.96);
	display:flex; align-items:center; justify-content:center;
	opacity:0; visibility:hidden; transition:opacity .35s var(--ease), visibility .35s;
	padding:40px;
}
.bt-lightbox.is-open{ opacity:1; visibility:visible; }
.bt-lightbox img{ max-width:100%; max-height:88vh; object-fit:contain; box-shadow:0 30px 80px rgba(0,0,0,.5); }
.bt-lightbox__close{ position:absolute; top:24px; right:28px; font-size:22px; color:var(--paper); }
.bt-lightbox__nav{ position:absolute; top:50%; transform:translateY(-50%); font-size:26px; color:var(--paper); padding:14px; }
.bt-lightbox__prev{ left:12px; } .bt-lightbox__next{ right:12px; }
.bt-lightbox__close:hover, .bt-lightbox__nav:hover{ color:var(--signal); }

/* ============================================================
   FOOTER / CONTACT
   ============================================================ */
.bt-footer{ padding-top:70px; border-top:1px solid var(--line); background:var(--ink-soft); }
.bt-footer__frame{ max-width:var(--container); margin:0 auto; padding:0 var(--pad); }
.bt-footer__inner{ max-width:var(--container); margin:0 auto; padding:26px var(--pad) 0; }
.bt-footer__heading{ font-size:clamp(30px,6vw,64px); max-width:14ch; }
.bt-footer__sub{ color:var(--paper-dim); font-size:17px; max-width:46ch; margin-top:18px; }
.bt-footer__email{ display:inline-flex; align-items:center; gap:14px; font-family:var(--f-display); font-size:clamp(22px,4.2vw,40px); margin-top:36px; border-bottom:1px solid var(--line-strong); padding-bottom:14px; }
.bt-footer__email-arrow{ transition:transform .3s var(--ease); color:var(--signal); }
.bt-footer__email:hover .bt-footer__email-arrow{ transform:translate(4px,-4px); }

.bt-footer__details{ display:flex; gap:64px; margin-top:44px; flex-wrap:wrap; padding-bottom:60px; }
.bt-footer__col{ display:flex; flex-direction:column; gap:10px; }
.bt-footer__col a{ font-size:15px; transition:color .25s; }
.bt-footer__col a:hover{ color:var(--signal); }
.bt-footer__social-links{ display:flex; flex-direction:column; gap:8px; }

.bt-footer__bottom{
	border-top:1px solid var(--line); padding:22px var(--pad);
	display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;
	font-family:var(--f-mono); font-size:11.5px; color:var(--paper-faint); letter-spacing:.04em;
}
.bt-footer__nav-list{ display:flex; gap:20px; }
.bt-footer__nav-list a:hover{ color:var(--signal); }

/* ============================================================
   GENERIC PAGE / 404 / BLOG FALLBACK
   ============================================================ */
.bt-page-hero{ padding:170px var(--pad) 60px; max-width:var(--container); margin:0 auto; }
.bt-page-hero__title{ font-size:clamp(36px,6vw,72px); margin-top:16px; }
.bt-static-page{ padding-bottom:120px; }
.bt-static-page__inner{ max-width:760px; margin:0 auto; padding:0 var(--pad); font-size:17px; color:var(--paper-dim); }
.bt-static-page__inner h2{ color:var(--paper); margin:1.4em 0 .6em; }
.bt-blog-item{ margin-bottom:40px; padding-bottom:40px; border-bottom:1px solid var(--line); }
.bt-blog-item h2 a:hover{ color:var(--signal); }

.bt-404{ min-height:80vh; display:flex; align-items:center; justify-content:center; text-align:center; padding:120px var(--pad); }
.bt-404__title{ font-size:clamp(80px,18vw,220px); color:var(--signal); margin:10px 0 20px; }
.bt-404 p{ color:var(--paper-dim); margin-bottom:32px; }

/* ============================================================
   SCROLL REVEAL (JS ile .is-visible eklenir)
   ============================================================ */
.bt-reveal-text{ opacity:0; transform:translateY(22px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.bt-reveal-text.is-visible{ opacity:1; transform:translateY(0); }

.bt-reveal-mask{ position:relative; overflow:hidden; }
.bt-reveal-mask::after{
	content:''; position:absolute; inset:0; background:var(--paper); z-index:5;
	transform-origin:top; transform:scaleY(1); transition:transform .9s var(--ease);
}
.bt-reveal-mask.is-visible::after{ transform:scaleY(0); }

/* ============================================================
   RESPONSIVE
   ============================================================ */

/* Dokunmatik cihazlarda tap highlight'ı temizle, tüm interaktif
   elemanlar için minimum 44px dokunma alanı hedefle */
@media (hover:none), (pointer:coarse){
	a, button{ -webkit-tap-highlight-color:transparent; }
	.bt-nav__list a, .bt-filter, .bt-lang-switch a{ min-height:40px; display:inline-flex; align-items:center; }
}

@media (max-width: 980px){
	.bt-about__inner{ grid-template-columns:1fr; gap:36px; }
	.bt-works__grid{ grid-template-columns:repeat(2,1fr); }
	.bt-case__gallery{ grid-template-columns:1fr; }
	.bt-hero__img{ object-position:64% 20%; }
}

@media (max-width: 720px){
	.bt-header{ padding:16px var(--pad); }
	.bt-header.is-scrolled{ padding-top:12px; padding-bottom:12px; }
	.bt-header__inner{ gap:14px; }
	.bt-logo{ margin-right:auto; }
	.bt-lang-switch--desktop{ display:none; }

	.bt-nav{
		position:fixed; inset:0 0 0 auto; width:min(320px,86vw); height:100dvh;
		background:var(--ink-soft); border-left:1px solid var(--line);
		padding:calc(90px + env(safe-area-inset-top)) 28px 40px;
		display:flex; flex-direction:column; justify-content:space-between;
		transform:translateX(100%); transition:transform .4s var(--ease);
		z-index:400; overflow-y:auto;
	}
	.bt-nav.is-open{ transform:translateX(0); }
	.bt-nav__list{ flex-direction:column; gap:8px; }
	.bt-nav__list a{ font-size:22px; padding:10px 0; width:100%; }
	.bt-lang-switch--mobile{ display:flex; gap:10px; margin-top:32px; padding-top:24px; border-top:1px solid var(--line); }
	.bt-lang-switch--mobile a{ font-size:14px; padding:8px 14px; border:1px solid var(--line); border-radius:100px; }

	.bt-header__cta{ display:none; }
	.bt-burger{ display:flex; box-sizing:content-box; padding:11px; margin:-11px; }

	.bt-hero{ min-height:100dvh; }
	.bt-hero__inner{ padding-bottom:64px; padding-top:100px; }
	.bt-hero__title{ overflow-wrap:break-word; word-break:break-word; }
	.bt-hero__scroll{ display:none; }
	.bt-hero__row{ gap:18px; }

	.bt-marquee__track{ animation-duration:22s; }
	.bt-marquee__track span{ -webkit-text-stroke:0; color:var(--paper-dim); }

	.bt-about__frame, .bt-works__frame{ flex-direction:column; align-items:flex-start; gap:16px; padding-top:64px; }
	.bt-about{ padding-bottom:40px; }
	.bt-works__filters{ width:100%; overflow-x:auto; flex-wrap:nowrap; padding-bottom:4px; -ms-overflow-style:none; scrollbar-width:none; }
	.bt-works__filters::-webkit-scrollbar{ display:none; }
	.bt-filter{ flex-shrink:0; }

	.bt-works__grid{ grid-template-columns:1fr; }
	.bt-work__info{ padding:16px 4px 6px; }
	.bt-work__view{ position:static; opacity:1; transform:none; display:inline-block; margin-top:4px; }

	.bt-stats{ gap:24px 30px; }
	.bt-stat__num{ font-size:36px; }

	.bt-footer{ padding-top:56px; }
	.bt-footer__details{ flex-direction:column; gap:26px; padding-bottom:48px; }
	.bt-footer__email{ font-size:26px; word-break:break-word; }
	.bt-footer__bottom{ flex-direction:column; align-items:flex-start; gap:14px; padding-bottom:calc(22px + env(safe-area-inset-bottom)); }
	.bt-lang-switch--footer{ order:0; }

	.bt-exif{ gap:22px; padding:26px var(--pad); }
	.bt-case__hero{ height:64vh; min-height:420px; }
	.bt-case__body{ padding-top:40px; font-size:16.5px; }

	.bt-lightbox{ padding:16px; }
	.bt-lightbox__close{ top:calc(16px + env(safe-area-inset-top)); right:16px; padding:10px; font-size:20px; }
	.bt-lightbox__nav{ padding:16px 10px; font-size:22px; }
	.bt-lightbox__prev{ left:0; } .bt-lightbox__next{ right:0; }
}

@media (max-width:480px){
	:root{ --pad:18px; }
	.bt-hero__title{ font-size:clamp(36px,13vw,58px); }
	.bt-hero__eyebrow{ font-size:10px; }
	.bt-hero__tagline{ font-size:15.5px; }
	.bt-section-title{ font-size:clamp(26px,7.5vw,38px); }
	.bt-footer__email{ font-size:21px; }
	.bt-footer__heading{ font-size:clamp(26px,8vw,40px); }
	.bt-case__title{ font-size:clamp(28px,9vw,44px); }
	.bt-404__title{ font-size:clamp(64px,26vw,120px); }
	.bt-about__media{ aspect-ratio:1/1; }
	.bt-stats{ gap:20px 26px; }
	.bt-stat__num{ font-size:32px; }
	.bt-work__title{ font-size:17px; }
	.bt-btn{ padding:13px 24px; font-size:13.5px; }
}

@media (max-width:360px){
	.bt-hero__title{ font-size:clamp(32px,13vw,48px); }
	.bt-nav{ width:100%; padding-left:22px; padding-right:22px; }
}