/* ==========================================================================
   NECCAR BRANDING — Site Katmanı (chrome, bölümler, formlar)
   ========================================================================== */

/* ------------------------------------------------------------- Açılış */
.intro {
  position: fixed; inset: 0; z-index: 1000; background: var(--void);
  display: grid; place-items: center;
  transition: opacity .7s var(--ease), visibility .7s;
}
.intro__mark { width: clamp(190px, 32vw, 330px); opacity: 0; transform: translateY(14px) scale(.96); }
.intro.is-ready .intro__mark {
  opacity: 1; transform: none;
  transition: opacity .9s var(--ease), transform 1.1s var(--ease);
}
.intro__bar {
  position: absolute; left: 50%; bottom: 18%; transform: translateX(-50%);
  width: min(260px, 44vw); height: 1px; background: var(--rule); overflow: hidden;
}
.intro__bar i { position: absolute; inset: 0; background: var(--metal); transform: scaleX(0); transform-origin: left; }
.intro.is-ready .intro__bar i { transform: scaleX(1); transition: transform 1.15s var(--ease-io) .25s; }
.intro.is-done { opacity: 0; visibility: hidden; pointer-events: none; }
body.no-intro .intro { display: none; }

/* -------------------------------------------------------------- Header */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 700; height: var(--header-h);
  display: flex; align-items: center; border-bottom: 1px solid transparent;
  transition: transform .55s var(--ease), background-color .45s, backdrop-filter .45s,
              border-color .45s, height .45s var(--ease);
}
.site-header.is-stuck {
  height: 70px; background: rgba(4, 6, 12, .78);
  backdrop-filter: saturate(150%) blur(16px); -webkit-backdrop-filter: saturate(150%) blur(16px);
  border-bottom-color: rgba(233, 236, 243, .09);
}
.site-header.is-hidden { transform: translateY(-100%); }
.site-header.is-open { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; border-color: transparent; }
.site-header__in {
  width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gutter);
  display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
}

.brand { display: inline-flex; align-items: center; z-index: 2; }
.brand img { height: clamp(34px, 3.6vw, 44px); width: auto; transition: height .45s var(--ease); }
.site-header.is-stuck .brand img { height: clamp(30px, 3.2vw, 38px); }

.nav { display: flex; align-items: center; gap: clamp(1.2rem, 2.1vw, 2.3rem); }
.nav__link {
  font-family: var(--sans); font-size: .78rem; font-weight: 400;
  letter-spacing: .13em; text-transform: uppercase;
  color: rgba(233, 236, 243, .74); transition: color .35s var(--ease);
}
.nav__link:hover, .nav__link.is-active { color: var(--platinum); }
.nav__link.is-active::after { transform: scaleX(1); transform-origin: left; background: var(--metal-line); }
@media (max-width: 1180px) { .nav--desk { display: none; } }

.header__cta { display: inline-flex; align-items: center; gap: 1.1rem; z-index: 2; }
@media (max-width: 760px) { .header__cta .btn { display: none; } }

.burger {
  position: relative; z-index: 2; display: inline-flex; align-items: center; gap: .7rem;
  padding: .6rem 0; color: var(--platinum);
  font-family: var(--sans); font-size: var(--t-micro); letter-spacing: .2em; text-transform: uppercase;
}
.burger__bars { display: grid; gap: 5px; width: 22px; }
.burger__bars i { display: block; height: 1px; background: currentColor; transition: transform .5s var(--ease), opacity .3s; }
.burger.is-open .burger__bars i:nth-child(1) { transform: translateY(3px) rotate(45deg); }
.burger.is-open .burger__bars i:nth-child(2) { opacity: 0; }
.burger.is-open .burger__bars i:nth-child(3) { transform: translateY(-3px) rotate(-45deg); }

/* ---------------------------------------------------------- Tam menü */
.menu {
  position: fixed; inset: 0; z-index: 690; background: var(--void);
  clip-path: inset(0 0 100% 0); visibility: hidden; overflow-y: auto;
  transition: clip-path .85s var(--ease);
  display: flex; flex-direction: column;
}
.menu::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(90% 70% at 78% 12%, rgba(195,146,72,.14), transparent 62%);
}
.menu.is-open { clip-path: inset(0 0 0 0); visibility: visible; }
.menu__in {
  position: relative; flex: 1;
  width: 100%; max-width: var(--maxw); margin-inline: auto;
  padding: calc(var(--header-h) + clamp(1.5rem, 5vh, 4rem)) var(--gutter) clamp(2rem, 5vh, 3.5rem);
  display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--col-gap); align-content: center;
}
.menu__nav { grid-column: 1 / span 7; }
.menu__aside { grid-column: 9 / -1; align-self: end; }
@media (max-width: 980px) {
  .menu__nav { grid-column: 1 / -1; }
  .menu__aside { grid-column: 1 / -1; margin-top: 2.5rem; }
}
.menu__item { border-bottom: 1px solid var(--rule); }
.menu__item:first-child { border-top: 1px solid var(--rule); }
.menu__a {
  display: flex; align-items: baseline; gap: 1.3rem;
  padding: clamp(.5rem, 1.3vw, .95rem) 0;
  font-family: var(--display); font-weight: 600;
  font-size: clamp(1.75rem, 4.4vw, 3.7rem); line-height: 1.1; letter-spacing: -.024em;
  color: var(--platinum);
  transition: color .4s var(--ease), padding-left .55s var(--ease);
}
.menu__a:hover { color: var(--gold-lit); padding-left: clamp(.5rem, 1.8vw, 1.8rem); }
.menu__a .n {
  font-family: var(--sans); font-size: .62rem; letter-spacing: .2em;
  color: var(--fg-faint); transform: translateY(-.7em);
}
.menu__a > span:not(.n) { overflow: hidden; display: block; }
.menu__a i {
  display: block; font-style: normal; transform: translateY(110%);
  transition: transform .8s var(--ease); transition-delay: var(--d, 0s);
}
.menu.is-open .menu__a i { transform: translateY(0); }
.menu__contact { font-family: var(--display); font-size: clamp(1.05rem, 1.6vw, 1.5rem); line-height: 1.4; }
.menu__social { display: flex; flex-wrap: wrap; gap: 1.3rem; margin-top: 1.8rem; font-size: .82rem; color: var(--fg-soft); }
.menu__logo { width: clamp(158px, 18vw, 240px); opacity: .9; margin-bottom: 2rem; }

/* ---------------------------------------------------------------- Hero */
.hero {
  position: relative;
  /* Çok kısa görünümlerde (yatay mobil, dar panel) içerik üst üste binmesin */
  min-height: max(100svh, 640px);
  display: flex; flex-direction: column; justify-content: space-between;
  overflow: hidden; isolation: isolate;
  padding-block: calc(var(--header-h) + clamp(.8rem, 2.5vh, 2rem)) clamp(1.5rem, 4vh, 3rem);
  background: var(--void);
}
.hero__media {
  position: absolute; inset: 0; z-index: 0;
  /* Videonun kenarları sayfa zeminine eriyerek karışsın — çerçeve hissi olmasın.
     Videonun kendi zemini de siyah olduğu için geçiş görünmez olur. */
  -webkit-mask-image: radial-gradient(135% 118% at 50% 38%, #000 58%, rgba(0,0,0,.55) 82%, transparent 100%);
          mask-image: radial-gradient(135% 118% at 50% 38%, #000 58%, rgba(0,0,0,.55) 82%, transparent 100%);
}
.hero__media video, .hero__media img {
  width: 100%; height: 100%; object-fit: cover; object-position: center 30%;
}
/* Tipografiyi her koşulda okunur tutan katmanlı perde */
.hero__scrim {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(to top, rgba(4,6,12,.97) 0%, rgba(4,6,12,.88) 18%, rgba(4,6,12,.45) 36%, rgba(4,6,12,0) 58%),
    linear-gradient(to bottom, rgba(4,6,12,.82) 0%, rgba(4,6,12,0) 30%),
    radial-gradient(130% 95% at 50% 34%, transparent 34%, rgba(4,6,12,.60) 100%);
}
.hero__in { position: relative; z-index: 2; width: 100%; }

/* Mobil kadraj: 16:9 video dikey ekranda aşırı kırpılıyordu. Mobilde hero
   akış düzenine geçer; video tam en-boy oranıyla yerleşir, altında tipografi
   için düz koyu zemin kalır. Videonun kendi zemini siyah olduğu için
   sayfa zeminiyle kusursuz birleşir. */
@media (max-width: 760px) {
  .hero { min-height: auto; justify-content: flex-start; padding-bottom: clamp(2.5rem, 7vh, 4rem); }
  .hero__media {
    position: relative; order: 2; inset: auto;
    height: auto; aspect-ratio: 16 / 9;
    margin-block: clamp(.6rem, 2.5vh, 1.4rem) 0;
    /* Mobilde blok tam genişlikte; üst ve alt kenar zemine eriyerek karışır */
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 15%, #000 66%, transparent 100%);
            mask-image: linear-gradient(to bottom, transparent 0%, #000 15%, #000 66%, transparent 100%);
    /* Kırpılmadan sığsın ama kenar boşluğu maskeyle gizlensin */
    margin-inline: calc(-1 * var(--gutter));
    width: calc(100% + 2 * var(--gutter));
  }
  .hero__media video, .hero__media img { object-fit: cover; object-position: center center; }
  .hero__scrim { display: none; }
  .hero__top { order: 1; }
  .hero__in  { order: 3; margin-top: clamp(1.6rem, 5vh, 2.6rem); }
}

.hero__top { position: relative; z-index: 2; }
.hero__top .shell { display: flex; flex-wrap: wrap; gap: 1rem 2.5rem; align-items: center; }

.hero__tagline {
  display: flex; flex-wrap: wrap; gap: .45em 1.1em;
  font-family: var(--sans); font-weight: 500;
  font-size: clamp(.58rem, 1.05vw, .9rem);
  letter-spacing: clamp(.14em, .8vw, .34em);
  color: var(--platinum);
}
.hero__tagline span { display: inline-flex; align-items: center; gap: 1.15em; }
.hero__tagline span::after {
  content: ""; width: 4px; height: 4px; border-radius: 50%;
  background: var(--gold); flex: none;
}
@media (max-width: 620px) {
  .hero__tagline { gap: .4em .75em; }
  .hero__tagline span { gap: .75em; }
}
.hero__tagline span:last-child::after { display: none; }

.hero__what {
  max-width: 52ch; margin-top: clamp(.9rem, 1.6vw, 1.3rem);
  font-size: clamp(.9rem, 1.02vw, 1.02rem); line-height: 1.6;
  color: var(--fg-soft);
}
@media (max-width: 700px) { .hero__what { font-size: .95rem; } }

.hero__foot {
  display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--col-gap);
  align-items: end; padding-top: clamp(1.2rem, 2.6vh, 2rem); border-top: 1px solid var(--rule);
}
.hero__claim { grid-column: 1 / span 6; }
.hero__claim .display { line-height: .96; }
.hero__actions { grid-column: 8 / span 3; display: flex; flex-wrap: wrap; gap: .7rem; }
.hero__scroll { grid-column: 12 / -1; justify-self: end; }
@media (max-width: 1180px) {
  .hero__claim { grid-column: 1 / span 8; }
  .hero__actions { grid-column: 1 / -1; margin-top: 1.5rem; }
  .hero__scroll { display: none; }
}
@media (max-width: 700px) { .hero__claim { grid-column: 1 / -1; } }

.scroll-cue { display: inline-flex; flex-direction: column; align-items: center; gap: .8rem; color: var(--fg-faint); }
.scroll-cue__line { display: block; width: 1px; height: 56px; background: var(--rule-2); position: relative; overflow: hidden; }
.scroll-cue__line::after {
  content: ""; position: absolute; inset: 0; background: var(--metal);
  animation: cue 2.6s var(--ease-io) infinite;
}
@keyframes cue { 0% { transform: translateY(-100%); } 55%, 100% { transform: translateY(100%); } }


.hero__sound {
  position: absolute; right: var(--gutter); bottom: clamp(1.5rem, 4vh, 3rem); z-index: 3;
}

/* --------------------------------------------------------- Beyan bölümü */
.statement { position: relative; overflow: hidden; }
.statement__bg {
  /* Doku görseli kaldırıldı; yerine tek bir sakin ışık düşüşü. */
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: radial-gradient(100% 78% at 18% 0%, rgba(18,49,99,.24), transparent 62%);
}
.statement__in { position: relative; z-index: 1; }
.statement__type {
  font-family: var(--display); font-weight: 600;
  font-size: clamp(2rem, 5.6vw, 5.4rem); line-height: 1.02; letter-spacing: -.028em;
  max-width: 17ch;
}
.statement__meta { margin-top: clamp(2rem, 4vw, 3.4rem); display: grid; grid-template-columns: repeat(12,1fr); gap: var(--col-gap); }
.statement__meta > div:first-child { grid-column: 1 / span 4; }
.statement__meta > div:last-child { grid-column: 7 / span 5; }
@media (max-width: 940px) { .statement__meta > div { grid-column: 1 / -1 !important; } }

/* ------------------------------------------------------------- Sayılar */
.stat-row {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: var(--col-gap); border-top: 1px solid var(--rule);
}
.stat { padding: 1.5rem 1.4rem 0 0; border-right: 1px solid var(--rule); }
.stat:last-child { border-right: 0; }
.stat__k {
  display: block; font-family: var(--display); font-weight: 600;
  font-size: clamp(2.4rem, 4.6vw, 4rem); line-height: .92; letter-spacing: -.028em;
  background: var(--metal); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.stat__k sup { font-size: .34em; vertical-align: super; }
.stat__v { display: block; margin-top: .8rem; font-size: .85rem; color: var(--fg-soft); max-width: 24ch; line-height: 1.5; }
@media (max-width: 640px) { .stat { border-right: 0; } }

.clients__title {
  font-family: var(--display); font-weight: 600;
  font-size: clamp(1.35rem, 2.4vw, 2.05rem); line-height: 1.15; letter-spacing: -.03em;
}

/* ====================================================== Marka dizini ==== */
.clients { padding-block: clamp(2.4rem, 4.6vw, 4rem); border-bottom: 1px solid var(--rule); }
.clients__head {
  display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--col-gap);
  align-items: end; padding-bottom: clamp(1rem, 1.9vw, 1.5rem);
}
.clients__head > div { grid-column: 1 / span 5; }
.clients__note { grid-column: 7 / -1; font-size: .95rem; color: var(--fg-soft); }
@media (max-width: 900px) {
  .clients__head > div, .clients__note { grid-column: 1 / -1; }
  .clients__note { margin-top: .9rem; }
}

/* Üç sütunlu sıkı dizin — 18 marka tek bakışta taranır */
.cindex {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: clamp(1.2rem, 2.6vw, 3rem);
  border-top: 1px solid rgba(233, 236, 243, .09);
}
.cref {
  /* Ad ve sektör tek satırda: dizin iki kat sıkı olur. */
  position: relative; display: grid; align-items: baseline;
  grid-template-columns: 1.9rem minmax(0, 1fr) auto auto;
  gap: 0 .7rem; padding: clamp(.55rem, .9vw, .72rem) 0;
  border-bottom: 1px solid rgba(233, 236, 243, .07);
}
.cref--link { transition: padding-left .45s var(--ease); }
.cref--link::before {
  content: ""; position: absolute; inset: 0 -.7rem;
  background: linear-gradient(90deg, rgba(195,146,72,.07), transparent 72%);
  opacity: 0; transition: opacity .4s var(--ease); pointer-events: none;
}
.cref--link:hover::before, .cref--link:focus-visible::before { opacity: 1; }
.cref--link:hover { padding-left: .4rem; }
.cref__n {
  font-family: var(--sans); font-weight: 700; font-size: .68rem; letter-spacing: .05em;
  color: var(--fg-faint); transition: color .4s;
}
.cref--link:hover .cref__n {
  background: var(--metal); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.cref__t {
  font-family: var(--display); font-weight: 600;
  font-size: clamp(.92rem, 1.05vw, 1.02rem); line-height: 1.3; letter-spacing: -.02em;
  transition: color .4s var(--ease);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cref--link:hover .cref__t { color: var(--gold-lit); }
.cref__s {
  font-family: var(--sans); font-size: .62rem;
  letter-spacing: .12em; text-transform: uppercase; color: var(--fg-faint);
  white-space: nowrap; text-align: right;
}
.cref__s:empty { display: none; }
.cref__i {
  color: var(--fg-faint); font-size: .78rem; padding-left: .15rem;
  transition: transform .4s var(--ease), color .4s;
}
.cref--link:hover .cref__i { transform: translate(3px, -3px); color: var(--gold); }

@media (max-width: 1100px) { .cref__s { display: none; } }
@media (max-width: 900px) { .cindex { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) {
  /* Mobilde iki sütun: 18 marka yarı yükseklikte sığar.
     İsim kesilmez, gerekirse iki satıra sarar. */
  .cref { grid-template-columns: minmax(0, 1fr) auto; min-height: 48px; align-items: center; }
  .cref__n { display: none; }
  .cref__t { white-space: normal; font-size: .92rem; line-height: 1.25; }
  .cref--link:hover { padding-left: 0; }
}

/* ================================================== Logo dizilimi ======== */
/* Statik — slider yok. Her hücre sabit yükseklikte bir kutu; logo içine
   sığdırılarak optik denge sağlanır (geniş logolar genişlikten, kompakt
   olanlar yükseklikten sınırlanır). */
.lrow {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(1.4rem, 3vw, 3rem) clamp(1.2rem, 2.6vw, 2.6rem);
  align-items: center;
}
.lrow__i {
  display: flex; align-items: center; justify-content: center;
  height: 58px; min-width: 0;
}
.lrow__logo {
  /* Yükseklik kutunun tamamını doldurmaz: kompakt logolar geniş olanlardan
     optik olarak daha büyük görünmesin diye %78'de sınırlanır. */
  max-height: 78%; max-width: 100%; width: auto; height: auto;
  object-fit: contain;
  /* Tek tona indirgeme: farklı kaynaklardan gelen logolar set gibi dursun */
  filter: grayscale(1) brightness(0) invert(1);
  opacity: .62; transition: opacity .45s var(--ease);
}
.lrow__i:hover .lrow__logo { opacity: .95; }
.lrow__txt {
  font-family: var(--display); font-weight: 600;
  font-size: clamp(.92rem, 1.15vw, 1.08rem); line-height: 1.25;
  letter-spacing: -.02em; color: var(--fg-soft); text-align: center;
  transition: color .45s var(--ease);
}
.lrow__i:hover .lrow__txt { color: var(--fg); }

.lrow--sm { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.lrow--sm .lrow__i { height: 44px; }
.lrow--sm .lrow__logo { opacity: .55; }
.lrow--sm .lrow__txt { font-size: clamp(.86rem, 1.02vw, .98rem); }

@media (max-width: 1080px) {
  .lrow { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lrow--sm { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .lrow { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.6rem 1.2rem; }
  .lrow--sm { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lrow__i { height: 46px; }
  .lrow--sm .lrow__i { height: 40px; }
}

/* Arşiv kartında canlı site adresi *//* Arşiv kartında canlı site adresi *//* Arşiv kartında canlı site adresi *//* Arşiv kartında canlı site adresi */
.work__url {
  font-family: var(--sans); font-size: .72rem; letter-spacing: .06em;
  color: var(--fg-faint); padding-top: .3rem; transition: color .35s var(--ease);
}
.work:hover .work__url { color: var(--gold-lit); }

/* --------------------------------------------------- Hizmet ızgarası ---- */
/* Altı hizmet de açıkta durur: bilgi akordeon arkasına saklanmaz. */
.svc-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px; background: var(--rule);
  border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
}
.svc-card {
  background: var(--bg); padding: clamp(1.5rem, 2.4vw, 2.2rem) clamp(1.3rem, 2vw, 1.9rem) clamp(1.6rem, 2.6vw, 2.2rem);
  display: flex; flex-direction: column; gap: .75rem;
  transition: background .45s var(--ease);
}
.svc-card:hover { background: var(--ink-2); }
.tone-pearl .svc-card:hover { background: #fff; }
.svc-card__n {
  font-family: var(--sans); font-weight: 700; font-size: .8rem; letter-spacing: .04em;
  background: var(--metal); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.svc-card__t {
  font-family: var(--display); font-weight: 600;
  font-size: clamp(1.08rem, 1.45vw, 1.32rem); line-height: 1.22; letter-spacing: -.024em;
}
.svc-card__d { font-size: .92rem; line-height: 1.6; color: var(--fg-soft); }
.svc-card__l { display: grid; gap: .4rem; margin-top: .2rem; }
.svc-card__l li {
  position: relative; padding-left: 1.1rem; font-size: .84rem; color: var(--fg-faint); line-height: 1.5;
}
.svc-card__l li::before {
  content: ""; position: absolute; left: 0; top: .62em;
  width: 6px; height: 1px; background: var(--gold);
}
.svc-card__a {
  margin-top: auto; padding-top: .9rem;
  font-family: var(--sans); font-size: .74rem; letter-spacing: .1em;
  text-transform: uppercase; color: var(--fg-faint); transition: color .35s;
}
.svc-card:hover .svc-card__a { color: var(--gold-lit); }
@media (max-width: 1080px) { .svc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px)  { .svc-grid { grid-template-columns: 1fr; } }

/* ------------------------------------------------------------ Hizmetler */
.svc-list { border-top: 1px solid var(--rule); }
.svc { position: relative; border-bottom: 1px solid var(--rule); }
.svc__head {
  display: grid; grid-template-columns: 4.5rem minmax(0, 1fr) auto;
  align-items: center; gap: clamp(.9rem, 2.6vw, 2.4rem);
  width: 100%; padding: clamp(1.1rem, 2.4vw, 2rem) 0; text-align: left; color: var(--fg);
}
.svc__n {
  font-family: var(--display); font-weight: 700; font-size: .82rem; letter-spacing: .04em;
  color: var(--fg-faint); transition: color .4s;
}
.svc__t {
  font-family: var(--display); font-weight: 600;
  font-size: clamp(1.45rem, 3.4vw, 3rem); line-height: 1.04; letter-spacing: -.022em;
  transform-origin: left; transition: transform .55s var(--ease), color .4s var(--ease);
}
.svc__plus {
  position: relative; width: 34px; height: 34px; flex: none;
  border: 1px solid var(--rule-2); border-radius: 999px;
  transition: background .45s var(--ease), border-color .45s var(--ease);
}
.svc__plus::before, .svc__plus::after {
  content: ""; position: absolute; top: 50%; left: 50%; background: currentColor;
  transition: transform .5s var(--ease);
}
.svc__plus::before { width: 11px; height: 1px; transform: translate(-50%,-50%); }
.svc__plus::after { width: 1px; height: 11px; transform: translate(-50%,-50%); }
.svc[data-open="true"] .svc__plus::after { transform: translate(-50%,-50%) scaleY(0); }
.svc[data-open="true"] .svc__plus { background: var(--metal-btn); border-color: transparent; color: #14100A; }
.svc:hover .svc__t { transform: translateX(clamp(4px, .9vw, 13px)); }
.svc:hover .svc__n { color: var(--gold); }

.svc__panel { overflow: hidden; height: 0; transition: height .62s var(--ease); }
.svc__panel-in {
  display: grid; grid-template-columns: 4.5rem minmax(0,1fr); gap: clamp(.9rem, 2.6vw, 2.4rem);
  padding-bottom: clamp(1.6rem, 3vw, 2.6rem);
}
.svc__body { grid-column: 2; display: grid; grid-template-columns: repeat(12,1fr); gap: var(--col-gap); }
.svc__desc { grid-column: 1 / span 6; }
.svc__tags { grid-column: 8 / -1; display: flex; flex-wrap: wrap; gap: .5rem; align-content: start; }
.svc__more { grid-column: 1 / -1; margin-top: 1.4rem; }
@media (max-width: 940px) {
  .svc__head { grid-template-columns: 2.2rem minmax(0,1fr) auto; }
  .svc__panel-in { grid-template-columns: 2.2rem minmax(0,1fr); }
  .svc__desc, .svc__tags { grid-column: 1 / -1; }
  .svc__tags { margin-top: 1.1rem; }
}
.tag {
  display: inline-flex; align-items: center; padding: .5em 1em;
  border: 1px solid var(--rule); border-radius: 999px;
  font-family: var(--sans); font-size: .74rem; letter-spacing: .04em; color: var(--fg-soft);
  transition: border-color .4s, color .4s;
}
.tag:hover { border-color: var(--rule-2); color: var(--fg); }

/* --------------------------------------------------------------- Grup */
.grup-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--col-gap); }
.grup-card {
  grid-column: span 4; position: relative;
  border: 1px solid var(--rule); border-radius: 3px; padding: clamp(1.4rem, 2.4vw, 2.1rem);
  background: linear-gradient(160deg, rgba(18,49,99,.20), rgba(7,11,21,.5));
  overflow: hidden; isolation: isolate;
  transition: border-color .5s var(--ease), transform .5s var(--ease);
}
.grup-card::before {
  content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0;
  background: radial-gradient(120% 90% at 20% 0%, rgba(195,146,72,.16), transparent 62%);
  transition: opacity .6s var(--ease);
}
.grup-card:hover { border-color: rgba(195,146,72,.42); }
.grup-card:hover::before { opacity: 1; }
.grup-card--self { border-color: rgba(195,146,72,.45); }
.grup-card__n { font-family: var(--sans); font-size: var(--t-micro); letter-spacing: .24em; color: var(--fg-faint); }
.grup-card__t {
  font-family: var(--sans); font-weight: 500; font-size: clamp(1.05rem, 1.5vw, 1.32rem);
  letter-spacing: .1em; text-transform: uppercase; margin: 1.1rem 0 .55rem;
}
.grup-card--self .grup-card__t { background: var(--metal); -webkit-background-clip: text; background-clip: text; color: transparent; }
.grup-card__s { font-size: .85rem; color: var(--fg-soft); }
.grup-card__tag {
  display: inline-block; margin-top: 1.2rem;
  font-family: var(--sans); font-size: .62rem; letter-spacing: .2em; text-transform: uppercase;
  color: var(--gold); padding: .35em .8em; border: 1px solid rgba(195,146,72,.32); border-radius: 999px;
}
@media (max-width: 1000px) { .grup-card { grid-column: span 6; } }
@media (max-width: 620px) { .grup-card { grid-column: span 12; } }

.grup-visual { position: relative; border: 1px solid var(--rule); border-radius: 3px; overflow: hidden; }
.grup-visual img { width: 100%; height: auto; }

/* -------------------------------------------------------------- Süreç */
.approach { display: grid; grid-template-columns: repeat(12,1fr); gap: var(--col-gap); }
.approach__sticky { grid-column: 1 / span 4; position: sticky; top: calc(var(--header-h) + 3vh); align-self: start; }
.approach__steps { grid-column: 6 / -1; }
@media (max-width: 1000px) {
  .approach__sticky { position: static; grid-column: 1 / -1; }
  .approach__steps { grid-column: 1 / -1; margin-top: 2.6rem; }
}
.step {
  border-top: 1px solid var(--rule); padding-block: clamp(1.8rem, 4vw, 3.2rem);
  display: grid; grid-template-columns: 5rem minmax(0,1fr); gap: clamp(.9rem, 2.2vw, 2rem);
}
.step:last-child { border-bottom: 1px solid var(--rule); }
.step__n {
  font-family: var(--display); font-weight: 700; font-size: clamp(1.25rem, 2vw, 1.75rem); line-height: 1; letter-spacing: -.02em;
  background: var(--metal); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.step__t { font-size: var(--t-h3); margin-bottom: .8rem; }
.step__list { margin-top: 1.3rem; display: grid; gap: .55rem; }
.step__list li { position: relative; padding-left: 1.5rem; font-size: .87rem; color: var(--fg-soft); }
.step__list li::before { content: ""; position: absolute; left: 0; top: .68em; width: 8px; height: 1px; background: var(--gold); }
@media (max-width: 560px) { .step { grid-template-columns: 1fr; gap: .7rem; } }

/* ------------------------------------------------------------ Çalışmalar */
.works__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 2rem; }
.rail {
  margin-top: clamp(2.2rem, 4.5vw, 3.6rem); display: flex; gap: clamp(.9rem, 1.8vw, 1.8rem);
  overflow-x: auto; scroll-snap-type: x mandatory;
  padding-inline: var(--gutter); margin-inline: calc(-1 * var(--gutter));
  padding-bottom: 1.4rem; scrollbar-width: none; cursor: grab;
}
.rail::-webkit-scrollbar { display: none; }
.rail.is-dragging { cursor: grabbing; scroll-snap-type: none; }
.rail.is-dragging a { pointer-events: none; }
.work { flex: 0 0 clamp(265px, 31vw, 470px); scroll-snap-align: start; display: block; }

.work__media {
  position: relative; overflow: hidden; aspect-ratio: 4 / 5;
  background: var(--ink-2); border: 1px solid var(--rule); border-radius: 2px;
}
.work__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--ease); }
.work:hover .work__media img { transform: scale(1.05); }
.work__ph {
  position: absolute; inset: 0; display: grid; place-items: center;
  background-size: cover; background-position: center;
}
.work__ph img { width: 42%; max-width: 130px; opacity: .5; transition: opacity .6s var(--ease), transform .8s var(--ease); }
.work:hover .work__ph img { opacity: .8; transform: scale(1.04); }
.work__tagline {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 1.15rem;
  background: linear-gradient(to top, rgba(4,6,12,.92), transparent);
  font-size: .8rem; color: rgba(233,236,243,.88);
  transform: translateY(101%); transition: transform .55s var(--ease);
}
.work:hover .work__tagline { transform: translateY(0); }
.work__meta { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding-top: .9rem; }
.work__t { font-family: var(--display); font-weight: 600; font-size: clamp(1.05rem, 1.5vw, 1.45rem); line-height: 1.18; letter-spacing: -.014em; }
.work__c {
  font-family: var(--sans); font-size: .66rem; letter-spacing: .2em; text-transform: uppercase;
  color: var(--fg-faint); text-align: right; flex: none;
}
.rail-bar { position: relative; height: 1px; background: var(--rule); margin-top: .5rem; }
.rail-bar i { position: absolute; inset: 0; background: var(--metal); transform-origin: left; transform: scaleX(.2); }

/* Tek tip ızgara. Önceki "editoryal" desen (her 7n+1 ve 7n+2 kartı 6 sütun
   ve 3:2) 11 projede satır delikleri ve farklı kart yükseklikleri üretiyor,
   ayrıca 4:5 ekran görüntülerini 3:2'ye kırparak site tasarımını kesiyordu. */
.work-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0,1fr));
  gap: clamp(1.8rem, 3.2vw, 3rem) var(--col-gap); align-items: start;
}
.work-grid .work { flex: initial; }
@media (max-width: 940px) { .work-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 560px) { .work-grid { grid-template-columns: minmax(0,1fr); } }

/* 3B eğilme — kart imleci takip eder */
.tilt { transform-style: preserve-3d; will-change: transform; }
.tilt__inner { transition: transform .35s var(--ease); }
@media (hover: hover) and (pointer: fine) {
  .tilt { perspective: 1100px; }
  .tilt__inner { transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); }
  .tilt__glare {
    position: absolute; inset: 0; pointer-events: none; opacity: 0;
    background: radial-gradient(60% 60% at var(--mx,50%) var(--my,50%), rgba(232,203,148,.20), transparent 68%);
    transition: opacity .45s var(--ease);
  }
  .tilt:hover .tilt__glare { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) { .tilt__inner { transform: none !important; } }

/* -------------------------------------------------------------- İlkeler */
.principles { display: grid; grid-template-columns: repeat(12,1fr); gap: var(--col-gap); }
.principle { grid-column: span 4; border-top: 1px solid var(--rule); padding-top: 1.5rem; transition: border-color .5s; }
.principle:hover { border-image: var(--metal-line) 1; border-top-color: var(--gold); }
.principle__n { font-family: var(--display); font-weight: 700; font-size: .82rem; letter-spacing: .04em; background: var(--metal); -webkit-background-clip: text; background-clip: text; color: transparent; }
.principle__t { margin: 1.1rem 0 .7rem; font-family: var(--sans); font-weight: 500; font-size: var(--t-h4); letter-spacing: .01em; line-height: 1.35; }
.principle p { font-size: .89rem; color: var(--fg-soft); }
@media (max-width: 940px) { .principle { grid-column: span 6; } }
@media (max-width: 560px) { .principle { grid-column: span 12; } }

/* ---------------------------------------------------------------- Bant */
.band { position: relative; padding-block: clamp(4.5rem, 11vw, 9rem); overflow: hidden; background: var(--ink-2); }
.band__bg {
  position: absolute; inset: 0;
  background: radial-gradient(80% 120% at 50% 118%, rgba(195,146,72,.22), transparent 64%);
}
.band__in { position: relative; }
.band__q { font-family: var(--display); font-weight: 600; font-size: clamp(1.7rem, 4.2vw, 4rem); line-height: 1.08; letter-spacing: -.026em; max-width: 20ch; }
.band__cite { margin-top: clamp(1.5rem, 3vw, 2.4rem); }

/* ----------------------------------------------------------------- SSS */
.faq { border-top: 1px solid var(--rule); }
.faq__item { border-bottom: 1px solid var(--rule); }
.faq__q {
  display: flex; align-items: center; justify-content: space-between; gap: 2rem;
  width: 100%; text-align: left; padding: clamp(1rem, 2vw, 1.6rem) 0;
  font-family: var(--display); font-weight: 600;
  font-size: clamp(1.08rem, 1.85vw, 1.6rem); line-height: 1.25; letter-spacing: -.014em;
  transition: color .4s;
}
.faq__q:hover { color: var(--gold-lit); }
.faq__i { position: relative; width: 12px; height: 12px; flex: none; }
.faq__i::before, .faq__i::after { content: ""; position: absolute; top: 50%; left: 0; width: 12px; height: 1px; background: currentColor; transition: transform .5s var(--ease); }
.faq__i::after { transform: rotate(90deg); }
.faq__item[data-open="true"] .faq__i::after { transform: rotate(0); }
.faq__a { overflow: hidden; height: 0; transition: height .55s var(--ease); }
.faq__a-in { padding-bottom: clamp(1.1rem, 2.2vw, 1.8rem); max-width: 64ch; color: var(--fg-soft); }

/* -------------------------------------------------------------- İletişim */
.contact { display: grid; grid-template-columns: repeat(12,1fr); gap: var(--col-gap); align-items: start; }
.contact__aside { grid-column: 1 / span 4; position: sticky; top: calc(var(--header-h) + 4vh); }
.contact__form { grid-column: 6 / -1; }
@media (max-width: 1000px) {
  .contact__aside { position: static; grid-column: 1 / -1; }
  .contact__form { grid-column: 1 / -1; margin-top: 2.6rem; }
}
.contact__big { font-family: var(--display); font-weight: 600; font-size: clamp(1.35rem, 2vw, 1.95rem); line-height: 1.28; letter-spacing: -.016em; }
.contact__list { margin-top: 2.2rem; display: grid; gap: 1.4rem; }
.contact__list dt { font-family: var(--sans); font-size: var(--t-micro); letter-spacing: .24em; text-transform: uppercase; color: var(--fg-faint); margin-bottom: .4rem; }
.contact__list dd { font-size: 1rem; }

.form { display: grid; }
.field { position: relative; border-bottom: 1px solid var(--rule); padding-top: 1.8rem; transition: border-color .4s; }
.field:focus-within { border-bottom-color: var(--gold); }
.field > label {
  position: absolute; left: 0; top: 1.9rem; font-size: .95rem; color: var(--fg-faint);
  pointer-events: none; transform-origin: left top;
  transition: transform .45s var(--ease), font-size .45s var(--ease), letter-spacing .45s;
}
.field input, .field textarea, .field select {
  width: 100%; padding: .35rem 0 .9rem; font-size: 1rem; color: var(--fg); background: transparent; border: 0;
}
.field textarea { resize: vertical; min-height: 5.5rem; }
.field input:focus, .field textarea:focus, .field select:focus { outline: none; }
.field.is-filled > label, .field:focus-within > label {
  transform: translateY(-1.55rem) scale(.7);
  font-family: var(--sans); letter-spacing: .2em; text-transform: uppercase;
}
.field select { appearance: none; cursor: pointer; padding-right: 2rem; }
.field--select::after {
  content: ""; position: absolute; right: 4px; top: 2.5rem; width: 7px; height: 7px;
  border-right: 1px solid var(--fg-faint); border-bottom: 1px solid var(--fg-faint);
  transform: rotate(45deg); pointer-events: none;
}
.field select option { background: var(--ink-2); color: var(--platinum); }
.tone-pearl .field select option { background: #fff; color: #0B1426; }

.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 var(--col-gap); }
@media (max-width: 640px) { .form__row { grid-template-columns: 1fr; } }

.chips { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1.05rem; }
.chip { position: relative; }
.chip input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.chip span {
  display: inline-flex; padding: .62em 1.1em; border: 1px solid var(--rule); border-radius: 999px;
  font-family: var(--sans); font-size: .76rem; letter-spacing: .04em; color: var(--fg-soft);
  cursor: pointer; transition: all .35s var(--ease);
}
.chip input:checked + span { background: var(--metal-btn); border-color: transparent; color: #14100A; font-weight: 500; }
.chip input:focus-visible + span { outline: 1.5px solid var(--gold-lit); outline-offset: 3px; }

.form__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.4rem; margin-top: 2.4rem; }
.form__note { font-size: .78rem; color: var(--fg-faint); max-width: 44ch; }
.form__msg { margin-top: 1.3rem; font-size: .88rem; display: none; padding: 1rem 1.2rem; border-radius: 3px; }
.form__msg.is-on { display: block; }
.form__msg.is-ok { background: rgba(195,146,72,.10); border: 1px solid rgba(195,146,72,.38); color: var(--fg); }
.form__msg.is-err { background: rgba(196,74,66,.10); border: 1px solid rgba(196,74,66,.42); color: var(--fg); }
.hp { position: absolute; left: -9999px; opacity: 0; height: 0; width: 0; }

/* ----------------------------------------------------------------- CTA */
.cta { position: relative; padding-block: clamp(4.5rem, 12vw, 10rem); text-align: center; overflow: hidden; }
.cta__bg {
  position: absolute; inset: 0;
  background: radial-gradient(70% 130% at 50% 128%, rgba(195,146,72,.20), transparent 62%);
}
.cta__in { position: relative; }
.cta__t { font-family: var(--display); font-weight: 600; font-size: var(--t-display); line-height: .98; letter-spacing: -.028em; }
.cta canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }

/* --------------------------------------------------------------- Footer */
.site-footer { background: var(--void); border-top: 1px solid var(--rule); padding-top: clamp(3.2rem, 6vw, 5.5rem); }
/* Sütunlar kendiliğinden akar: gizlenen bir sütun (ör. sosyal medya
   girilmemişse) düzeni bozmaz. Eski 12'li ızgarada açık grid-column-start
   ile otomatik yerleşim çakışıyor ve sütun alt satıra düşüyordu. */
.footer__grid {
  display: grid; grid-template-columns: 2.2fr 1fr 1.25fr 1fr;
  gap: clamp(2rem,4vw,3rem) var(--col-gap); align-items: start;
}
.footer__brand { grid-column: 1; }
.footer__brand img { width: clamp(180px, 17vw, 250px); margin-bottom: 1.5rem; }
@media (max-width: 1100px) {
  .footer__grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 640px) { .footer__grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
.footer__col h3 { font-family: var(--sans); font-weight: 500; font-size: var(--t-micro); letter-spacing: .24em; text-transform: uppercase; color: var(--fg-faint); margin-bottom: 1.1rem; }
.footer__col li + li { margin-top: .55rem; }
.footer__col a { font-size: .88rem; color: var(--fg-soft); transition: color .35s; }
.footer__col a:hover { color: var(--fg); }
.footer__bar {
  margin-top: clamp(2.4rem, 4vw, 3.4rem); padding-block: 1.5rem; border-top: 1px solid var(--rule);
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem;
  font-size: .74rem; color: var(--fg-faint);
}
.footer__bar a:hover { color: var(--fg); }
.footer__legal { display: flex; flex-wrap: wrap; gap: 1.3rem; }

/* ------------------------------------------------------------- İç sayfa */
.page-hero {
  position: relative; overflow: hidden; border-bottom: 1px solid var(--rule);
  padding-block: calc(var(--header-h) + clamp(3.5rem, 11vh, 8rem)) clamp(2.6rem, 6vw, 5rem);
}
.page-hero__bg {
  position: absolute; inset: 0;
  background: radial-gradient(90% 90% at 82% 0%, rgba(18,49,99,.26), transparent 60%);
}

/* Videolu sayfa başlığı */
.page-hero--video { padding-block: calc(var(--header-h) + clamp(4.5rem, 14vh, 10rem)) clamp(3.5rem, 8vw, 6.5rem); }
.page-hero__media { position: absolute; inset: 0; overflow: hidden; }
.page-hero__media video {
  width: 100%; height: 100%; object-fit: cover; object-position: center 55%;
  /* Video burada atmosferdir, ikinci bir logo değil: başlık videodaki
     marka kilidiyle çakışmasın diye yumuşatılıp geri çekilir. */
  opacity: .5;
  filter: blur(1.5px) saturate(.92);
  transform: scale(1.08);
  /* Kenarlar zemine erisin — çerçeve hissi olmasın */
  -webkit-mask-image: radial-gradient(130% 120% at 50% 44%, #000 54%, rgba(0,0,0,.5) 82%, transparent 100%);
          mask-image: radial-gradient(130% 120% at 50% 44%, #000 54%, rgba(0,0,0,.5) 82%, transparent 100%);
}
.page-hero__scrim {
  position: absolute; inset: 0;
  background:
    /* metin sütunu (sol) her zaman koyu kalsın */
    linear-gradient(to right, rgba(7,11,21,.88) 0%, rgba(7,11,21,.62) 34%, rgba(7,11,21,.12) 62%, transparent 84%),
    linear-gradient(to top, var(--ink) 0%, rgba(7,11,21,.86) 24%, rgba(7,11,21,.34) 52%, transparent 76%),
    linear-gradient(to bottom, rgba(7,11,21,.74) 0%, transparent 34%);
}
@media (max-width: 760px) {
  .page-hero--video { padding-block: calc(var(--header-h) + 2.5rem) clamp(2.5rem, 7vw, 4rem); }
  .page-hero__media video { object-position: center 50%; }
  .page-hero__scrim {
    background: linear-gradient(to top, var(--ink) 0%, rgba(7,11,21,.9) 30%, rgba(7,11,21,.5) 58%, rgba(7,11,21,.25) 100%);
  }
}
.page-hero__in { position: relative; }
.page-hero h1 { font-size: var(--t-display); margin-top: clamp(1rem, 2.4vw, 1.8rem); }
.page-hero__lead { max-width: 58ch; margin-top: clamp(1.4rem, 2.8vw, 2.2rem); }
.crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .55rem; font-family: var(--sans); font-size: var(--t-micro); letter-spacing: .22em; text-transform: uppercase; color: var(--fg-faint); }
.crumbs a:hover { color: var(--fg); }

/* Hizmet detay sayfası */
.svc-hero-grid { display: grid; grid-template-columns: repeat(12,1fr); gap: var(--col-gap); align-items: start; }
.svc-hero-grid > .a { grid-column: 1 / span 7; }
.svc-hero-grid > .b { grid-column: 9 / -1; }
@media (max-width: 1000px) { .svc-hero-grid > .a, .svc-hero-grid > .b { grid-column: 1 / -1; } .svc-hero-grid > .b { margin-top: 2rem; } }

.deliver { display: grid; gap: .1rem; }
.deliver li {
  display: flex; gap: 1rem; align-items: baseline; font-size: .9rem; color: var(--fg-soft);
  padding-block: .85rem; border-bottom: 1px solid var(--rule);
}
.deliver li > span {
  font-family: var(--display); font-weight: 700; font-size: .78rem; letter-spacing: .04em; flex: none;
  background: var(--metal); -webkit-background-clip: text; background-clip: text; color: transparent;
}

.svc-nav { display: grid; grid-template-columns: 1fr 1fr; gap: var(--col-gap); border-top: 1px solid var(--rule); padding-top: 2rem; }
.svc-nav a { display: block; }
.svc-nav a:last-child { text-align: right; }
.svc-nav .lbl { font-family: var(--sans); font-size: var(--t-micro); letter-spacing: .22em; text-transform: uppercase; color: var(--fg-faint); }
.svc-nav .ttl { font-family: var(--display); font-weight: 600; font-size: clamp(1.1rem,1.8vw,1.6rem); margin-top: .5rem; transition: color .4s; }
.svc-nav a:hover .ttl { color: var(--gold-lit); }
@media (max-width: 640px) { .svc-nav { grid-template-columns: 1fr; gap: 1.6rem; } .svc-nav a:last-child { text-align: left; } }

/* Zaman çizelgesi */
.tl { border-top: 1px solid var(--rule); }
.tl__row { display: grid; grid-template-columns: 8rem minmax(0,1fr); gap: clamp(1rem,3vw,3rem); padding-block: clamp(1.5rem,2.8vw,2.4rem); border-bottom: 1px solid var(--rule); }
.tl__y { font-family: var(--display); font-weight: 600; font-size: clamp(1.5rem,2.4vw,2.1rem); line-height: 1; background: var(--metal); -webkit-background-clip: text; background-clip: text; color: transparent; }
.tl__t { font-family: var(--sans); font-weight: 500; font-size: var(--t-h4); margin-bottom: .5rem; letter-spacing: .01em; }
@media (max-width: 620px) { .tl__row { grid-template-columns: 1fr; gap: .6rem; } }

/* Editoryal ikili */
.split { display: grid; grid-template-columns: repeat(12,1fr); gap: var(--col-gap); align-items: center; }
.split__media { grid-column: 1 / span 5; }
.split__body { grid-column: 7 / -1; }
.split--tight { align-items: center; gap: clamp(1.6rem, 3vw, 3rem) var(--col-gap); }
.split--tight .split__body { grid-column: 1 / span 5; }
.split--tight .split__media { grid-column: 7 / -1; }
@media (max-width: 940px) {
  .split--tight .split__body, .split--tight .split__media { grid-column: 1 / -1; }
}
.split--rev .split__media { grid-column: 8 / -1; order: 2; }
.split--rev .split__body { grid-column: 1 / span 6; order: 1; }
@media (max-width: 940px) {
  .split__media, .split__body, .split--rev .split__media, .split--rev .split__body { grid-column: 1 / -1; order: initial; }
  .split__body { margin-top: 1.8rem; }
}
.frame { position: relative; overflow: hidden; border: 1px solid var(--rule); border-radius: 2px; }
.frame img { width: 100%; height: 100%; object-fit: cover; }

/* İletişim kartları */
.info-grid { display: grid; grid-template-columns: repeat(12,1fr); gap: var(--col-gap); }
.info-card { grid-column: span 4; border-top: 1px solid var(--rule); padding-top: 1.3rem; }
.info-card h2 { font-family: var(--sans); font-weight: 500; font-size: var(--t-micro); letter-spacing: .24em; text-transform: uppercase; color: var(--fg-faint); margin-bottom: .8rem; }
.info-card p, .info-card a { font-family: var(--display); font-size: clamp(1.05rem,1.5vw,1.38rem); line-height: 1.35; }
/* Dört bilgi kartı: 3'lü satır tek kart öksüz bıraktığı için 2x2 sakin düzen */
.info-grid--pair .info-card { grid-column: span 6; }
/* Mobilde tam genişlik. --pair daha özgül olduğu için burada da adı geçmeli. */
@media (max-width: 800px) { .info-card, .info-grid--pair .info-card { grid-column: span 12; } }

/* Footer adresi — künye tonu: sessiz ama okunur */
.footer__addr { font-style: normal; font-family: var(--text);
  font-size: .9rem; line-height: 1.6; color: var(--fg-faint); max-width: 26ch; }

/* Hukuki metin sayfaları */
.legal { display: grid; grid-template-columns: repeat(12,1fr); gap: var(--col-gap); align-items: start; }
.legal__toc { grid-column: 1 / span 3; position: sticky; top: calc(var(--header-h) + 24px); }
.legal__toc li + li { margin-top: .6rem; }
.legal__toc a { font-size: .84rem; color: var(--fg-soft); }
.legal__toc a:hover { color: var(--gold-lit); }
.legal__body { grid-column: 5 / -1; max-width: 72ch; }
.legal__body h2 { font-size: clamp(1.3rem,2.1vw,1.85rem); margin: clamp(2.2rem,4vw,3.2rem) 0 1rem; }
.legal__body h2:first-child { margin-top: 0; }
.legal__body p { color: var(--fg-soft); margin-bottom: 1rem; }
.legal__body ul { margin: 0 0 1.2rem; display: grid; gap: .5rem; }
.legal__body li { position: relative; padding-left: 1.4rem; color: var(--fg-soft); font-size: .92rem; }
.legal__body li::before { content: ""; position: absolute; left: 0; top: .72em; width: 7px; height: 1px; background: var(--gold); }
@media (max-width: 1000px) { .legal__toc { display: none; } .legal__body { grid-column: 1 / -1; } }

/* 404 */
.err { min-height: 100svh; display: grid; place-items: center; text-align: center; position: relative; overflow: hidden; }
.err__bg { position: absolute; inset: 0; background: radial-gradient(80% 70% at 50% 20%, rgba(18,49,99,.24), transparent 62%); }
.err__code {
  font-family: var(--display); font-weight: 600; font-size: clamp(5rem, 22vw, 17rem); line-height: .84; letter-spacing: -.04em;
  background: var(--metal); -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ==========================================================================
   MOBİL — bileşen düzeltmeleri ve mobile özel eylem çubuğu
   ========================================================================== */
@media (max-width: 900px) {
  /* Marka kilidi dokunulabilir boyutta */
  .brand { min-height: 44px; align-items: center; }
  .brand img { height: 34px; }
  .site-header.is-stuck .brand img { height: 30px; }

  /* Menü düğmesi tam hedef */
  .burger { min-height: 44px; min-width: 44px; justify-content: flex-end; }
  .burger__bars { width: 24px; gap: 6px; }

  /* Hero üst şeridi: 9px çok küçüktü */
  .hero__tagline {
    font-size: .78rem; letter-spacing: .14em; gap: .5em .9em;
  }
  .hero__tagline span { gap: .9em; }

  /* Bölüm başlıkları mobilde tek sütun akar */
  .sec-head { padding-top: 1.6rem; }
  .sec-head__meta { margin-bottom: 1.2rem; }

  /* Hizmet satırları */
  .svc__n { font-size: .74rem; }
  .svc__plus { width: 40px; height: 40px; }

  /* Sayı bloğu: iki sütun daha okunur */
  .stat-row { grid-template-columns: 1fr 1fr; gap: 0; }
  .stat { padding: 1.3rem 1rem 1.3rem 0; border-bottom: 1px solid var(--rule); }
  .stat:nth-child(odd) { border-right: 1px solid var(--rule); padding-right: 1rem; }
  .stat:nth-child(even) { padding-left: 1rem; }
  .stat:nth-last-child(-n+2) { border-bottom: 0; }
  .stat__v { max-width: none; font-size: .82rem; }

  /* Arşiv rayı: kart genişliği ve kaydırma hissi */
  .rail { gap: .9rem; scroll-padding-inline: var(--gutter); }
  .work { flex: 0 0 78vw; }
  .work__tagline { transform: none; position: static; background: none; padding: .55rem 0 0; color: var(--fg-soft); font-size: .84rem; }
  .work__meta { padding-top: .7rem; }

  /* Footer */
  .footer__bar { flex-direction: column; align-items: flex-start; gap: .6rem; font-size: .8rem; }
  .footer__legal { gap: 1.4rem; flex-wrap: wrap; }
  .footer__legal a { min-height: 44px; display: inline-flex; align-items: center; }

  /* 12 px altına düşen mikro yazılar */
  .work__c { font-size: .75rem; letter-spacing: .14em; }
  .tag { font-size: .8rem; padding: .55em 1em; }
  .work__url { font-size: .75rem; }
  .svc-card__a { font-size: .75rem; min-height: 44px; display: inline-flex; align-items: center; }
  .cref__n, .prt__n { font-size: .75rem; }
  .site-footer { padding-bottom: calc(1rem + var(--safe-b)); }

  /* Alt eylem çubuğu için sayfa sonunda pay bırak */
  body.has-actionbar .site-footer { padding-bottom: calc(5.5rem + var(--safe-b)); }
}

@media (max-width: 900px) {
  /* Tam ekran menü — büyük hedefler, güvenli alan */
  .menu__in { padding-top: calc(var(--header-h) + 1.5rem); padding-bottom: calc(2rem + var(--safe-b)); align-content: start; }
  .menu__a { padding-block: .85rem; font-size: clamp(2rem, 9vw, 2.8rem); min-height: 62px; align-items: center; }
  .menu__a .n { transform: none; font-size: .68rem; }
  .menu__logo { width: 168px; margin-bottom: 1.2rem; }
  .menu__contact { font-size: 1.15rem; }
  .menu__contact a { min-height: 44px; display: inline-flex; align-items: center; }
  .menu__social { gap: 1.4rem; margin-top: 1.4rem; }
}

/* ------------------------------------------------- Mobil eylem çubuğu ---- */
.actionbar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 720;
  display: none;
  padding: .7rem var(--gutter) calc(.7rem + var(--safe-b));
  background: rgba(4, 6, 12, .82);
  backdrop-filter: saturate(150%) blur(16px);
  -webkit-backdrop-filter: saturate(150%) blur(16px);
  border-top: 1px solid rgba(233, 236, 243, .1);
  transform: translateY(115%);
  transition: transform .5s var(--ease);
}
.actionbar.is-on { transform: translateY(0); }
.actionbar__in { display: flex; align-items: center; gap: .6rem; }
.actionbar .btn { flex: 1; min-height: 50px; padding-inline: 1rem; }
.actionbar__call {
  display: grid; place-items: center; flex: none;
  width: 50px; height: 50px; border-radius: 2px;
  border: 1px solid var(--rule-2); color: var(--fg);
  transition: background .3s var(--ease), border-color .3s var(--ease);
}
.actionbar__call:active { background: rgba(233, 236, 243, .08); }
.actionbar__call svg { width: 19px; height: 19px; }

@media (max-width: 900px) { .actionbar { display: block; } }
@media (prefers-reduced-motion: reduce) { .actionbar { transition: none; } }