/* ==========================================================================
   Toprak Mobilya — site geneli tasarım sistemi
   Sunucu bu dosyayı her sayfanın <head> sonuna ekler (backend/lib/shell.js),
   bu yüzden sayfaların eski stillerinin üzerine yazar.
   Yeni stil yazarken renk/yazı tipi/boşluk için aşağıdaki tokenları kullanın;
   sabit hex kodu yazmayın.
   ========================================================================== */

:root {
  /* Renk */
  --tm-ink: #1f2628;          /* ana metin */
  --tm-ink-2: #2c3639;        /* marka koyu: header menüsü, footer, koyu düğmeler */
  --tm-ink-3: #3f4e4f;        /* ikincil koyu */
  --tm-muted: #6b7374;        /* açıklama metni */
  --tm-subtle: #9aa1a1;       /* üst başlık, pasif */
  --tm-line: #e6e2db;         /* çizgi, kenarlık */
  --tm-bg: #ffffff;
  --tm-bg-soft: #f5f3ef;      /* liste zemini, kart arkası */
  --tm-sand: #dcd7c9;         /* marka açık */
  --tm-accent: #a27b5c;       /* marka bakır: vurgu, aktif durum */
  --tm-accent-ink: #8b6543;   /* bakır üzerine hover */
  --tm-accent-soft: #d9b382;  /* koyu zemin üzerinde bakır metin */
  --tm-wa: #1fae55;           /* WhatsApp (#25d366 beyaz metinle okunmuyor) */
  --tm-danger: #c0392b;

  /* Yazı */
  --tm-font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --tm-fs-xs: 12px;
  --tm-fs-sm: 13px;
  --tm-fs-base: 15px;
  --tm-fs-md: 17px;
  --tm-fs-lg: clamp(22px, 2.2vw, 28px);
  --tm-fs-xl: clamp(28px, 3.4vw, 44px);
  --tm-tracking-caps: .08em;

  /* Ölçü */
  --tm-container: 1320px;
  --tm-gutter: clamp(16px, 3.2vw, 40px);
  --tm-radius-sm: 4px;
  --tm-radius: 8px;
  --tm-radius-pill: 999px;
  --tm-topbar-h: 36px;
  --tm-header-h: 76px;
  --tm-shadow: 0 10px 30px rgba(31, 38, 40, .10);
  --tm-shadow-lg: 0 24px 60px rgba(31, 38, 40, .18);
  --tm-ease: cubic-bezier(.2, .7, .2, 1);

  /* Eski değişken adları (style.css ve sayfa içi stiller bunları kullanıyor) */
  --primary-color: var(--tm-ink-2);
  --secondary-color: var(--tm-accent);
  --accent-color: var(--tm-sand);
  --text-color: var(--tm-ink-3);
  --light-color: var(--tm-sand);
  --light-bg: var(--tm-bg-soft);
  --dark-bg: var(--tm-ink);
  --promo-bar-h: 0px;
}

@media (max-width: 1099.98px) {
  :root { --tm-header-h: 60px; --tm-topbar-h: 0px; }
}

/* --------------------------------------------------------------------------
   Temel: sayfalar Poppins / Playfair / Roboto ve 4 farklı metin rengi
   kullanıyordu. Tek yazı tipi ve tek metin rengi.
   -------------------------------------------------------------------------- */
/* Yatay taşmayı html kırpar. Bazı sayfalar body'ye de overflow-x: hidden
   veriyordu; bu body'yi kaydırma kabı yapıyor ve sticky header kaydırınca
   kayboluyordu. */
html { -webkit-text-size-adjust: 100%; overflow-x: hidden; }
/* Bootstrap yüklemeyen sayfalarda (giriş) kutular taşıyordu */
*, *::before, *::after { box-sizing: border-box; }
body { overflow: visible !important; }

body {
  font-family: var(--tm-font) !important;
  color: var(--tm-ink) !important;
  background-color: var(--tm-bg);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--tm-font);
  color: var(--tm-ink);
  font-weight: 400;
  letter-spacing: -.01em;
}

a { color: inherit; }
a:hover { color: var(--tm-accent); }

::selection { background: var(--tm-ink-2); color: #fff; }

:focus-visible { outline: 2px solid var(--tm-accent); outline-offset: 2px; }

/* Bootstrap'in mavi "primary" rengi markaya çekilir */
.text-primary { color: var(--tm-accent) !important; }
.bg-primary { background-color: var(--tm-ink-2) !important; }
.btn-primary, .btn-primary:not(:disabled):not(.disabled):active {
  background-color: var(--tm-ink-2); border-color: var(--tm-ink-2); color: #fff;
}
.btn-primary:hover, .btn-primary:focus { background-color: var(--tm-accent); border-color: var(--tm-accent); color: #fff; }
.btn-outline-primary { color: var(--tm-ink-2); border-color: var(--tm-ink-2); }
.btn-outline-primary:hover { background-color: var(--tm-ink-2); border-color: var(--tm-ink-2); color: #fff; }
.form-control:focus { border-color: var(--tm-accent); box-shadow: 0 0 0 3px rgba(162, 123, 92, .18); }
.spinner-border.text-primary { color: var(--tm-accent) !important; }

/* Header artık normal akışta (sticky). Sayfaların eski sabit mobil header
   için verdiği body { padding-top: 85px } telafileri boşluk bırakıyordu. */
body { padding-top: 0 !important; }

/* Eski header/şerit yerleşim değişkenleri artık kullanılmıyor */
.promo-bar, #mobile-header-container { display: none !important; }

/* --------------------------------------------------------------------------
   Yardımcılar ve ortak bileşenler
   -------------------------------------------------------------------------- */
.tm-container {
  width: 100%;
  max-width: calc(var(--tm-container) + 2 * var(--tm-gutter));
  margin: 0 auto;
  padding-left: var(--tm-gutter);
  padding-right: var(--tm-gutter);
}

.tm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 40px;
  padding: 0 18px;
  border: 1px solid transparent;
  border-radius: var(--tm-radius-pill);
  font: 500 var(--tm-fs-sm)/1 var(--tm-font);
  letter-spacing: .01em;
  text-decoration: none !important;
  cursor: pointer;
  white-space: nowrap;
  transition: background-color .2s, color .2s, border-color .2s;
}
.tm-btn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.tm-btn svg .tm-fill { fill: currentColor; stroke: none; }
.tm-btn--dark { background: var(--tm-ink-2); color: #fff !important; }
.tm-btn--dark:hover { background: var(--tm-accent); }
.tm-btn--wa { background: var(--tm-wa); color: #fff !important; }
.tm-btn--wa:hover { background: #17924a; }
.tm-btn--ghost { background: transparent; border-color: var(--tm-line); color: var(--tm-ink) !important; }
.tm-btn--ghost:hover { border-color: var(--tm-ink); }
.tm-btn--block { display: flex; width: 100%; }

.tm-icon-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 40px;
  height: 40px;
  padding: 0 8px;
  border: 0;
  border-radius: var(--tm-radius-pill);
  background: transparent;
  color: var(--tm-ink);
  font: 400 var(--tm-fs-sm)/1 var(--tm-font);
  cursor: pointer;
  text-decoration: none !important;
  transition: background-color .2s, color .2s;
  -webkit-tap-highlight-color: transparent;
}
.tm-icon-btn:hover { background: var(--tm-bg-soft); color: var(--tm-ink); }
.tm-icon-btn svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }

.tm-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  padding: 0 16px;
  border: 1px solid var(--tm-line);
  border-radius: var(--tm-radius-pill);
  background: var(--tm-bg);
  color: var(--tm-ink) !important;
  font: 400 var(--tm-fs-sm)/1 var(--tm-font);
  white-space: nowrap;
  text-decoration: none !important;
  transition: background-color .2s, border-color .2s, color .2s;
}
.tm-chip:hover { border-color: var(--tm-ink); }
.tm-chip.is-active, .tm-chip[aria-current="page"] { background: var(--tm-ink-2); border-color: var(--tm-ink-2); color: #fff !important; }
.tm-chip small { color: inherit; opacity: .55; font-size: 11px; }

@media (max-width: 1099.98px) { .tm-hide-mobile { display: none !important; } }

/* Yalnızca html: body'ye de overflow verilirse body kaydırma kabı olur ve
   sticky header sayfayla birlikte yukarı kayıp kaybolur. */
html.tm-lock { overflow: hidden !important; }

/* --------------------------------------------------------------------------
   Üst şerit (yalnızca masaüstü)
   -------------------------------------------------------------------------- */
#header-container { display: contents; }

.tm-topbar {
  height: var(--tm-topbar-h);
  background: var(--tm-ink-2);
  color: rgba(255, 255, 255, .78);
  font: 400 12px/1 var(--tm-font);
  letter-spacing: .01em;
  overflow: hidden;
}
.tm-topbar__inner { display: flex; align-items: center; justify-content: space-between; height: 100%; gap: 24px; }
.tm-topbar__promo { display: flex; gap: 28px; min-width: 0; }
.tm-topbar__item { white-space: nowrap; }
.tm-topbar__item strong { color: var(--tm-accent-soft); font-weight: 500; }
.tm-topbar__item i { display: none; }
.tm-topbar__links { display: flex; gap: 22px; }
.tm-topbar__links a { color: rgba(255, 255, 255, .78) !important; text-decoration: none !important; }
.tm-topbar__links a:hover { color: #fff !important; }
@media (max-width: 1099.98px) { .tm-topbar { display: none; } }

/* --------------------------------------------------------------------------
   Header
   Normal akışta ve sticky: kendi yüksekliğini baştan ayırır, sayfa içeriği
   kaymaz ve hiçbir sayfanın padding-top ile telafi etmesi gerekmez.
   -------------------------------------------------------------------------- */
.tm-header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 1030;
  height: var(--tm-header-h);
  background: rgba(255, 255, 255, .96);
  border-bottom: 1px solid var(--tm-line);
  font-family: var(--tm-font);
  transition: box-shadow .25s var(--tm-ease), background-color .25s;
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .tm-header { background: rgba(255, 255, 255, .86); -webkit-backdrop-filter: saturate(180%) blur(14px); backdrop-filter: saturate(180%) blur(14px); }
}
.tm-header.is-scrolled { box-shadow: 0 6px 24px rgba(31, 38, 40, .07); }
.tm-header.is-mega-open { background: #fff; }

.tm-header__inner { display: flex; align-items: center; height: 100%; gap: 32px; }

.tm-header__logo { display: flex; align-items: center; flex: 0 0 auto; }
.tm-header__logo img { display: block; width: 136px; height: auto; aspect-ratio: 4 / 1; }

.tm-header__actions { display: flex; align-items: center; gap: 4px; margin-left: auto; }
/* Header'da yeşil düğme fazla bağırıyordu: marka koyusu, ikon WhatsApp'ı belli ediyor */
.tm-header__actions .tm-btn--wa { margin-left: 8px; background: var(--tm-ink-2); }
.tm-header__actions .tm-btn--wa:hover { background: var(--tm-wa); }
.tm-icon-btn--label .tm-icon-btn__text { font-size: var(--tm-fs-sm); color: var(--tm-muted); }
.tm-header__burger { display: none; }

.favorites-count {
  position: absolute;
  top: 3px;
  right: 1px;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  border-radius: var(--tm-radius-pill);
  background: var(--tm-accent);
  color: #fff;
  font: 600 10px/17px var(--tm-font);
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

/* Ana menü */
.tm-nav { height: 100%; }
.tm-nav__list { display: flex; align-items: stretch; height: 100%; margin: 0; padding: 0; list-style: none; gap: 4px; }
.tm-nav__item { display: flex; align-items: center; }
.tm-nav__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 100%;
  padding: 0 12px;
  color: var(--tm-ink) !important;
  font: 400 14px/1 var(--tm-font);
  letter-spacing: .005em;
  text-decoration: none !important;
  white-space: nowrap;
}
.tm-nav__link::after {
  content: '';
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: -1px;
  height: 2px;
  background: var(--tm-ink-2);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .3s var(--tm-ease);
}
.tm-nav__link:hover::after,
.tm-nav__link[aria-current="page"]::after,
.tm-nav__item.is-open > .tm-nav__link::after { transform: scaleX(1); }
.tm-nav__link[aria-current="page"] { font-weight: 500; }
.tm-nav__caret { width: 10px; height: 10px; fill: none; stroke: currentColor; stroke-width: 1.4; transition: transform .25s; }
.tm-nav__item.is-open .tm-nav__caret { transform: rotate(180deg); }

/* Mega menü (Fuga tarzı koyu panel) */
.tm-mega {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  z-index: 2;
  background: var(--tm-ink-2);
  color: #fff;
  visibility: hidden;
  opacity: 0;
  transform: translateY(-6px);
  transition: opacity .22s var(--tm-ease), transform .22s var(--tm-ease), visibility 0s linear .22s;
}
.tm-nav__item.is-open > .tm-mega {
  visibility: visible;
  opacity: 1;
  transform: none;
  transition-delay: 0s;
}
.tm-mega__inner { display: grid; grid-template-columns: 1fr minmax(260px, 340px); gap: 48px; padding-top: 36px; padding-bottom: 40px; }
.tm-mega__cols { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 28px 32px; }
.tm-mega__col ul { margin: 0; padding: 0; list-style: none; }
.tm-mega__col li + li { margin-top: 2px; }
.tm-mega__heading {
  margin: 0 0 14px;
  color: var(--tm-accent-soft);
  font: 500 12px/1.2 var(--tm-font);
  letter-spacing: var(--tm-tracking-caps);
  text-transform: uppercase;
}
.tm-mega__col a {
  display: inline-block;
  padding: 5px 0;
  color: rgba(255, 255, 255, .86) !important;
  font: 400 14px/1.35 var(--tm-font);
  text-decoration: none !important;
  transition: color .15s, transform .2s var(--tm-ease);
}
.tm-mega__col a:hover { color: #fff !important; transform: translateX(3px); }
.tm-mega__col--wide { grid-column: 1 / -1; }
.tm-mega__collections { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0 32px; }
.tm-mega__collections a { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid rgba(255, 255, 255, .08); padding: 10px 0; }
.tm-mega__collections a span { color: rgba(255, 255, 255, .4); font-size: 12px; }
.tm-mega__aside { display: grid; gap: 10px; align-content: start; }
.tm-mega__tile {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 52px;
  padding: 0 18px;
  border-radius: var(--tm-radius-sm);
  background: rgba(255, 255, 255, .06);
  color: #fff !important;
  font: 500 14px/1.2 var(--tm-font);
  text-decoration: none !important;
  transition: background-color .2s;
}
.tm-mega__tile:hover { background: rgba(255, 255, 255, .12); }
.tm-mega__tile svg { flex: 0 0 auto; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.4; opacity: .6; }

/* Header'ın altından başlar; üstte olsaydı header'ı da karartırdı */
.tm-mega-backdrop {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  height: 100vh;
  z-index: 1;
  background: rgba(20, 24, 25, .38);
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s, visibility 0s linear .25s;
  pointer-events: none;
}
.tm-header.is-mega-open .tm-mega-backdrop { opacity: 1; visibility: visible; transition-delay: 0s; }

/* Favori paneli */
.tm-fav { position: relative; }
.tm-fav__panel {
  position: absolute;
  top: calc(100% + 14px);
  right: -8px;
  width: 340px;
  max-height: min(70vh, 520px);
  overflow: auto;
  background: #fff;
  border: 1px solid var(--tm-line);
  border-radius: var(--tm-radius);
  box-shadow: var(--tm-shadow-lg);
  font-family: var(--tm-font);
}
.tm-fav__panel[hidden] { display: none; }
.tm-fav__head { display: flex; justify-content: space-between; align-items: center; padding: 16px 18px; border-bottom: 1px solid var(--tm-line); font: 500 14px/1 var(--tm-font); }
.tm-fav__head a { color: var(--tm-muted) !important; font-weight: 400; font-size: 13px; text-decoration: underline !important; text-underline-offset: 3px; }
.tm-fav .favorites-empty { padding: 28px 22px; color: var(--tm-muted); font-size: 14px; line-height: 1.5; text-align: center; }
.tm-fav .favorites-actions { padding: 14px 18px 18px; }
.tm-fav .favorite-item { display: flex; align-items: center; gap: 12px; padding: 10px 18px; border-bottom: 1px solid var(--tm-line); }
.tm-fav .favorite-item-link { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; color: var(--tm-ink) !important; text-decoration: none !important; }
.tm-fav .favorite-item img { width: 56px; height: 56px; object-fit: cover; border-radius: var(--tm-radius-sm); background: var(--tm-bg-soft); }
.tm-fav .favorite-item-info h4 { margin: 0; font: 400 14px/1.3 var(--tm-font); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tm-fav .favorite-item-info span { color: var(--tm-muted); font-size: 12px; }
.tm-fav .remove-favorite-btn { border: 0; background: none; color: var(--tm-subtle); width: 32px; height: 32px; border-radius: 50%; cursor: pointer; }
.tm-fav .remove-favorite-btn:hover { background: var(--tm-bg-soft); color: var(--tm-ink); }

/* Dar masaüstü: etiketleri sıkıştır */
@media (max-width: 1279.98px) {
  .tm-header__inner { gap: 20px; }
  .tm-nav__link { padding: 0 9px; }
  .tm-nav__link::after { left: 9px; right: 9px; }
  .tm-icon-btn--label .tm-icon-btn__text { display: none; }
}

/* Mobil / tablet header */
@media (max-width: 1099.98px) {
  .tm-nav { display: none; }
  .tm-header__inner { gap: 8px; }
  .tm-header__logo img { width: 116px; }
  .tm-header__actions { gap: 0; margin-right: -8px; }
  .tm-header__burger { display: inline-flex; }
  .tm-icon-btn--label .tm-icon-btn__text { display: none; }
  .tm-fav__panel { display: none !important; }
}

/* --------------------------------------------------------------------------
   Mobil menü: tam ekran koyu panel (masaüstü mega menüyle aynı dil).
   Ana panel büyük tipografi; Ürünler / Koleksiyonlar sağdan kayan alt
   paneller, görselli kartlarla.
   -------------------------------------------------------------------------- */
.tm-drawer { position: fixed; inset: 0; z-index: 1100; font-family: var(--tm-font); }
.tm-drawer[hidden] { display: none; }
.tm-drawer__panel {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  height: 100vh;
  height: 100dvh;
  background: var(--tm-ink-2);
  color: #fff;
  opacity: 0;
  transform: translateY(-12px);
  transition: opacity .3s var(--tm-ease), transform .4s var(--tm-ease);
}
.tm-drawer.is-open .tm-drawer__panel { opacity: 1; transform: none; }
.tm-drawer__panel:focus { outline: none; }

.tm-drawer__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 0 0 auto;
  height: calc(60px + env(safe-area-inset-top, 0px));
  padding: env(safe-area-inset-top, 0px) var(--tm-gutter) 0;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.tm-drawer__head img { display: block; width: 116px; height: auto; }
.tm-drawer__close {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  margin-right: -8px;
  padding: 0 8px;
  border: 0;
  background: none;
  color: rgba(255, 255, 255, .8);
  font: 400 13px/1 var(--tm-font);
  letter-spacing: .04em;
  cursor: pointer;
}
.tm-drawer__close svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; }

/* Paneller üst üste; aktif olan görünür, alt panel sağdan gelir */
.tm-drawer__stage { position: relative; flex: 1 1 auto; overflow: hidden; }
.tm-drawer__view {
  position: absolute;
  inset: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  padding: 8px var(--tm-gutter) 32px;
  transform: translateX(100%);
  transition: transform .42s var(--tm-ease), opacity .3s, visibility 0s linear .42s;
  visibility: hidden;
}
.tm-drawer__view.is-active { transform: none; opacity: 1; visibility: visible; transition-delay: 0s; }
.tm-drawer__view[data-view="main"]:not(.is-active) { transform: translateX(-28%); opacity: 0; }

/* Ana menü: büyük, ince yazı + bakır sıra numarası */
.tm-drawer__menu { margin: 0; padding: 0; list-style: none; }
.tm-drawer__menu li { border-bottom: 1px solid rgba(255, 255, 255, .08); }
.tm-drawer__menu a,
.tm-drawer__menu button {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 62px;
  padding: 0;
  border: 0;
  background: none;
  color: #fff !important;
  font: 300 26px/1.1 var(--tm-font);
  letter-spacing: -.01em;
  text-align: left;
  text-decoration: none !important;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.tm-drawer__menu i {
  width: 34px;
  flex: 0 0 auto;
  color: var(--tm-accent-soft);
  font: 500 11px/1 var(--tm-font);
  font-style: normal;
  letter-spacing: .06em;
  transform: translateY(-6px);
}
.tm-drawer__menu svg { width: 18px; height: 18px; margin-left: auto; fill: none; stroke: rgba(255, 255, 255, .5); stroke-width: 1.4; }
.tm-drawer__menu a:active, .tm-drawer__menu button:active { color: var(--tm-accent-soft) !important; }

/* Açılışta satırlar sırayla belirir */
.tm-drawer.is-open .tm-drawer__menu li,
.tm-drawer.is-open .tm-drawer__featured,
.tm-drawer.is-open .tm-drawer__quick { animation: tm-rise .5s var(--tm-ease) both; }
.tm-drawer.is-open .tm-drawer__menu li:nth-child(2) { animation-delay: .03s; }
.tm-drawer.is-open .tm-drawer__menu li:nth-child(3) { animation-delay: .06s; }
.tm-drawer.is-open .tm-drawer__menu li:nth-child(4) { animation-delay: .09s; }
.tm-drawer.is-open .tm-drawer__menu li:nth-child(5) { animation-delay: .12s; }
.tm-drawer.is-open .tm-drawer__menu li:nth-child(6) { animation-delay: .15s; }
.tm-drawer.is-open .tm-drawer__menu li:nth-child(7) { animation-delay: .18s; }
.tm-drawer.is-open .tm-drawer__featured { animation-delay: .2s; }
.tm-drawer.is-open .tm-drawer__quick { animation-delay: .24s; }
@keyframes tm-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

.tm-drawer__label {
  margin: 0 0 12px;
  color: var(--tm-accent-soft);
  font: 500 11px/1 var(--tm-font);
  letter-spacing: var(--tm-tracking-caps);
  text-transform: uppercase;
}

/* Öne çıkan kategoriler: yatay kaydırılan görselli şerit */
.tm-drawer__featured { margin-top: 28px; }
.tm-drawer__strip {
  display: flex;
  gap: 10px;
  margin: 0 calc(-1 * var(--tm-gutter));
  padding: 0 var(--tm-gutter) 4px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-padding: 0 var(--tm-gutter);
  scrollbar-width: none;
}
.tm-drawer__strip::-webkit-scrollbar { display: none; }

/* Kategori kartı (şerit + Ürünler paneli) */
.tm-tile { display: block; color: #fff !important; text-decoration: none !important; -webkit-tap-highlight-color: transparent; }
.tm-tile__media { position: relative; display: block; aspect-ratio: 1; overflow: hidden; border-radius: var(--tm-radius-sm); background: #f2efea; }
.tm-tile__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s var(--tm-ease); }
.tm-tile:active .tm-tile__media img { transform: scale(1.04); }
.tm-tile__name { display: block; margin-top: 10px; font: 400 14px/1.3 var(--tm-font); }
.tm-tile__count { display: block; margin-top: 2px; color: rgba(255, 255, 255, .5); font-size: 12px; }
.tm-tile--strip { flex: 0 0 38%; max-width: 160px; scroll-snap-align: start; }
.tm-tile--strip .tm-tile__media { aspect-ratio: 4 / 5; }

/* Alt kısayollar */
.tm-drawer__quick { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 28px; }
.tm-drawer__quick a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 14px 6px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: var(--tm-radius);
  color: rgba(255, 255, 255, .85) !important;
  font-size: 12px;
  text-decoration: none !important;
}
.tm-drawer__quick svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linejoin: round; }

/* Alt paneller */
.tm-drawer__back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 44px;
  margin-left: -6px;
  padding: 0 6px;
  border: 0;
  background: none;
  color: rgba(255, 255, 255, .7);
  font: 400 13px/1 var(--tm-font);
  cursor: pointer;
}
.tm-drawer__back svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.tm-drawer__title { display: flex; align-items: baseline; justify-content: space-between; margin: 6px 0 22px; }
.tm-drawer__title p { margin: 0; color: #fff; font: 300 32px/1.1 var(--tm-font); letter-spacing: -.02em; }
.tm-drawer__title a { color: var(--tm-accent-soft) !important; font-size: 13px; text-decoration: underline !important; text-underline-offset: 4px; }
.tm-drawer__room + .tm-drawer__room { margin-top: 28px; }
.tm-drawer__tiles { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px 10px; }
@media (min-width: 560px) { .tm-drawer__tiles { grid-template-columns: repeat(3, 1fr); } }

/* Koleksiyon kartı: geniş görsel, ad üstünde */
.tm-drawer__collections { display: grid; gap: 10px; }
.tm-ctile {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 132px;
  padding: 16px 18px;
  overflow: hidden;
  border-radius: var(--tm-radius-sm);
  background: #f2efea;
  color: #fff !important;
  text-decoration: none !important;
}
.tm-ctile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.tm-ctile::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20, 24, 25, .72), rgba(20, 24, 25, .05) 70%); }
.tm-ctile__name, .tm-ctile__count { position: relative; z-index: 1; }
.tm-ctile__name { font: 400 22px/1.1 var(--tm-font); }
.tm-ctile__count { margin-top: 4px; color: rgba(255, 255, 255, .7); font-size: 12px; }

/* Sabit alt eylem çubuğu */
.tm-drawer__foot {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 8px;
  padding: 12px var(--tm-gutter) calc(12px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid rgba(255, 255, 255, .08);
  background: rgba(0, 0, 0, .14);
}
.tm-drawer__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 48px;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: var(--tm-radius-pill);
  color: #fff !important;
  font: 500 14px/1 var(--tm-font);
  text-decoration: none !important;
}
.tm-drawer__cta svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linejoin: round; }
.tm-drawer__cta--wa { background: var(--tm-wa); border-color: var(--tm-wa); }
.tm-drawer__meta { grid-column: 1 / -1; margin: 2px 0 0; color: rgba(255, 255, 255, .45); font-size: 11px; text-align: center; }

/* --------------------------------------------------------------------------
   Arama paneli
   -------------------------------------------------------------------------- */
.tm-search { position: fixed; inset: 0; z-index: 1100; font-family: var(--tm-font); }
.tm-search[hidden] { display: none; }
.tm-search__scrim { position: absolute; inset: 0; background: rgba(20, 24, 25, .45); opacity: 0; transition: opacity .25s; }
.tm-search__panel {
  position: relative;
  z-index: 1;
  max-height: 100vh;
  max-height: 100dvh;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: #fff;
  box-shadow: var(--tm-shadow-lg);
  transform: translateY(-16px);
  opacity: 0;
  transition: transform .3s var(--tm-ease), opacity .25s;
}
.tm-search.is-open .tm-search__scrim { opacity: 1; }
.tm-search.is-open .tm-search__panel { transform: none; opacity: 1; }
.tm-search__bar {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 84px;
  padding-top: env(safe-area-inset-top, 0px);
  border-bottom: 1px solid var(--tm-ink);
}
.tm-search__bar > svg { flex: 0 0 auto; width: 24px; height: 24px; fill: none; stroke: var(--tm-ink); stroke-width: 1.4; }
.tm-search__bar input {
  flex: 1;
  min-width: 0;
  height: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--tm-ink);
  font: 300 clamp(18px, 2.4vw, 26px)/1.2 var(--tm-font);
  -webkit-appearance: none;
  appearance: none;
}
.tm-search__bar input::-webkit-search-cancel-button { display: none; }
.tm-search__body { padding: 24px 0 36px; }
.tm-search__label { margin: 0 0 12px; color: var(--tm-subtle); font: 500 11px/1 var(--tm-font); letter-spacing: var(--tm-tracking-caps); text-transform: uppercase; }
.tm-search__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.tm-search__results:not(:empty) { margin-top: 28px; }
.tm-search__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 20px 16px; }
.tm-search__item { display: block; color: var(--tm-ink) !important; text-decoration: none !important; }
.tm-search__item img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--tm-radius-sm); background: var(--tm-bg-soft); transition: opacity .2s; }
.tm-search__item:hover img { opacity: .85; }
.tm-search__item strong { display: block; margin-top: 10px; font: 400 14px/1.35 var(--tm-font); }
.tm-search__item span { color: var(--tm-muted); font-size: 12px; }
.tm-search__empty { color: var(--tm-muted); font-size: 15px; }
.tm-search__all { display: inline-block; margin-top: 24px; color: var(--tm-ink) !important; font-size: 14px; text-decoration: underline !important; text-underline-offset: 4px; }
@media (max-width: 767.98px) {
  .tm-search__bar { height: 64px; }
  .tm-search__grid { grid-template-columns: 1fr 1fr; gap: 16px 10px; }
  .tm-search__chips { flex-wrap: nowrap; overflow-x: auto; margin: 0 calc(-1 * var(--tm-gutter)); padding: 0 var(--tm-gutter) 4px; scrollbar-width: none; }
  .tm-search__chips::-webkit-scrollbar { display: none; }
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.tm-footer {
  background: var(--tm-ink-2);
  color: rgba(255, 255, 255, .72);
  font: 400 14px/1.7 var(--tm-font);
  padding: 64px 0 28px;
}
.tm-footer a { color: rgba(255, 255, 255, .72) !important; text-decoration: none !important; transition: color .15s; }
.tm-footer a:hover { color: #fff !important; }
.tm-footer__top { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 40px; }
.tm-footer__brand img { display: block; width: 160px; height: auto; margin-bottom: 20px; }
.tm-footer__brand p { max-width: 320px; margin: 0; }
.tm-footer__social { display: flex; gap: 8px; margin-top: 22px; }
.tm-footer__social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 50%;
}
.tm-footer__social a:hover { border-color: #fff; }
.tm-footer__social svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.4; }
.tm-footer__title {
  margin: 0 0 16px;
  color: var(--tm-accent-soft);
  font: 500 12px/1.2 var(--tm-font);
  letter-spacing: var(--tm-tracking-caps);
  text-transform: uppercase;
}
.tm-footer ul { margin: 0; padding: 0; list-style: none; }
.tm-footer li + li { margin-top: 6px; }
.tm-footer address { margin: 0 0 12px; font-style: normal; }
.tm-footer__contact p { margin: 0 0 12px; }
.tm-footer__hours { color: rgba(255, 255, 255, .5); }
.tm-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px 24px;
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, .1);
  color: rgba(255, 255, 255, .45);
  font-size: 12px;
}
@media (max-width: 991.98px) {
  .tm-footer { padding: 48px 0 24px; }
  .tm-footer__top { grid-template-columns: 1fr 1fr; gap: 32px 24px; }
  .tm-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 479.98px) {
  .tm-footer__top { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   Ürün listesi / kategori sayfaları (Fuga tarzı)
   -------------------------------------------------------------------------- */
.tm-hero {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: clamp(280px, 46vh, 520px);
  background: var(--tm-ink-2) center / cover no-repeat;
  color: #fff;
  overflow: hidden;
}
.tm-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(20, 24, 25, .05) 30%, rgba(20, 24, 25, .62) 100%);
}
.tm-hero__content { position: relative; padding-top: 48px; padding-bottom: 44px; }
.tm-hero__eyebrow { margin: 0 0 10px; color: rgba(255, 255, 255, .75); font: 500 12px/1 var(--tm-font); letter-spacing: var(--tm-tracking-caps); text-transform: uppercase; }
.tm-hero__title { margin: 0; color: #fff !important; font: 400 var(--tm-fs-xl)/1.1 var(--tm-font); letter-spacing: -.02em; }
.tm-hero__text { max-width: 620px; margin: 14px 0 0; color: rgba(255, 255, 255, .88); font: 400 var(--tm-fs-base)/1.6 var(--tm-font); }

.tm-crumbs { background: var(--tm-ink-2); color: rgba(255, 255, 255, .6); font: 400 13px/1 var(--tm-font); }
/* Tek satır: uzun son öğe (ürün/yazı adı) üç noktayla kısalır, taşmaz */
.tm-crumbs ol { display: flex; flex-wrap: nowrap; align-items: center; gap: 8px; height: 44px; margin: 0; padding: 0; overflow: hidden; list-style: none; white-space: nowrap; }
.tm-crumbs li { flex: 0 0 auto; }
.tm-crumbs li:last-child { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.tm-crumbs li + li::before { content: '•'; margin-right: 8px; opacity: .5; }
.tm-crumbs a { color: rgba(255, 255, 255, .8) !important; text-decoration: none !important; }
.tm-crumbs a:hover { color: #fff !important; }
.tm-crumbs [aria-current] { color: #fff; font-weight: 500; }

.tm-listing { background: var(--tm-bg-soft); padding: 32px 0 72px; }
.tm-toolbar { display: flex; align-items: center; gap: 16px; margin-bottom: 24px; }
.tm-toolbar__chips {
  display: flex;
  gap: 8px;
  flex: 1;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 32px), transparent);
  mask-image: linear-gradient(90deg, #000 calc(100% - 32px), transparent);
  padding-right: 32px;
}
.tm-toolbar__chips::-webkit-scrollbar { display: none; }
.tm-toolbar__meta { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; color: var(--tm-muted); font-size: 13px; }
.tm-toolbar select {
  height: 36px;
  padding: 0 34px 0 14px;
  border: 1px solid var(--tm-line);
  border-radius: var(--tm-radius-pill);
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='%231f2628' stroke-width='1.4'/%3E%3C/svg%3E") no-repeat right 14px center;
  color: var(--tm-ink);
  font: 400 13px/1 var(--tm-font);
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
}
.tm-density { display: inline-flex; border: 1px solid var(--tm-line); border-radius: var(--tm-radius-pill); background: #fff; padding: 2px; }
.tm-density button { width: 34px; height: 30px; border: 0; border-radius: var(--tm-radius-pill); background: none; color: var(--tm-subtle); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.tm-density button[aria-pressed="true"] { background: var(--tm-ink-2); color: #fff; }
.tm-density svg { width: 14px; height: 14px; fill: currentColor; }

.tm-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.tm-grid[data-density="4"] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tm-grid__empty { grid-column: 1 / -1; padding: 64px 0; color: var(--tm-muted); text-align: center; }

.tm-pcard {
  position: relative;
  display: flex;
  flex-direction: column;
  background: #fff;
  color: var(--tm-ink) !important;
  text-decoration: none !important;
  transition: box-shadow .3s var(--tm-ease);
}
.tm-pcard:hover { box-shadow: var(--tm-shadow); }
.tm-pcard__media {
  position: relative;
  display: block;
  aspect-ratio: 4 / 3.2;
  overflow: hidden;
  background: var(--tm-bg-soft);
  touch-action: pan-y;
  -webkit-user-select: none;
  user-select: none;
}
.tm-pcard__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity .35s var(--tm-ease), transform .8s var(--tm-ease);
}
.tm-pcard__media img.is-active { opacity: 1; }
.tm-pcard:hover .tm-pcard__media img.is-active { transform: scale(1.025); }
.tm-pcard__bars { position: absolute; left: 14px; right: 14px; bottom: 12px; display: flex; gap: 4px; opacity: 0; transition: opacity .2s; }
.tm-pcard:hover .tm-pcard__bars, .tm-pcard.is-touched .tm-pcard__bars { opacity: 1; }
/* Ürün fotoğrafları beyaz fonlu: beyaz çubuklar görünmüyordu, koyu ton */
.tm-pcard__bars i { flex: 1; height: 3px; border-radius: 3px; background: rgba(31, 38, 40, .14); transition: background-color .2s; }
.tm-pcard__bars i.is-active { background: var(--tm-accent); }
/* Dokunmatik ekranda üzerine gelme yok: birden çok görsel olduğu baştan belli olsun */
@media (hover: none) { .tm-pcard__bars { opacity: 1; } }
.tm-pcard__body { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px 18px; }
.tm-pcard__eyebrow { color: var(--tm-subtle); font: 500 11px/1.2 var(--tm-font); letter-spacing: var(--tm-tracking-caps); text-transform: uppercase; }
.tm-pcard__title { margin: 0; color: var(--tm-ink); font: 400 15px/1.35 var(--tm-font); letter-spacing: 0; }
.tm-pcard__tag { align-self: flex-start; margin-top: 6px; color: var(--tm-accent); font-size: 12px; }

/* Kart üstü kalp ve kampanya rozeti (style.css'teki eski görünümün yerine) */
.tm-pcard .btn-favorite-corner {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .92);
  color: var(--tm-ink);
  box-shadow: none;
  font-size: 15px;
  cursor: pointer;
  transition: transform .2s, color .2s;
}
.tm-pcard .btn-favorite-corner:hover { transform: scale(1.06); }
.tm-pcard .btn-favorite-corner.active, .tm-pcard .btn-favorite-corner.active i { color: var(--tm-accent); }
.tm-pcard .promo-badge { top: 10px; left: 10px; z-index: 2; background: rgba(44, 54, 57, .88); border-radius: var(--tm-radius-sm); }

/* Koleksiyon kartı: büyük görsel, başlık görselin üstünde (Fuga kategori kartları) */
.tm-ccard {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: var(--tm-radius-sm);
  background: var(--tm-ink-2);
  color: #fff !important;
  text-decoration: none !important;
  aspect-ratio: 4 / 3;
}
.tm-ccard__media, .tm-ccard__media img { position: absolute; inset: 0; width: 100%; height: 100%; }
.tm-ccard__media img { object-fit: cover; transition: transform .9s var(--tm-ease); }
.tm-ccard:hover .tm-ccard__media img { transform: scale(1.04); }
.tm-ccard::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(20, 24, 25, .7)); }
.tm-ccard__body { position: absolute; left: 22px; right: 22px; bottom: 20px; z-index: 1; display: grid; gap: 4px; }
.tm-ccard__title { font: 400 20px/1.2 var(--tm-font); }
.tm-ccard__count { color: rgba(255, 255, 255, .75); font-size: 13px; }

.tm-category-article { background: #fff; padding: 56px 0 64px; }
.tm-category-article .tm-container { max-width: calc(860px + 2 * var(--tm-gutter)); }

@media (max-width: 1199.98px) {
  .tm-grid[data-density="4"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
  .tm-toolbar { flex-wrap: wrap; gap: 12px; margin-bottom: 16px; }
  .tm-toolbar__chips { flex: 1 1 100%; order: 2; margin: 0 calc(-1 * var(--tm-gutter)); padding-left: var(--tm-gutter); }
  .tm-toolbar__meta { flex: 1 1 100%; justify-content: space-between; }
}
@media (max-width: 767.98px) {
  .tm-hero { min-height: 300px; }
  .tm-hero__content { padding-bottom: 28px; }
  .tm-hero__text { font-size: 14px; }
  .tm-listing { padding: 20px 0 48px; }
  /* Telefonda varsayılan tek sütun, büyük kart (2 sütunda ürünler çok
     küçük kalıyordu). "Küçük görseller" seçilirse 2 sütun. */
  .tm-grid { grid-template-columns: 1fr; gap: 14px; }
  .tm-pcard__body { padding: 16px 18px 18px; }
  .tm-pcard__title { font-size: 17px; }
  .tm-grid[data-density="4"] { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .tm-grid[data-density="4"] .tm-pcard__body { padding: 12px 12px 14px; }
  .tm-grid[data-density="4"] .tm-pcard__title { font-size: 14px; }
  .tm-grid[data-density="4"] .tm-pcard__eyebrow { font-size: 10px; }
  .tm-grid[data-density="4"] .tm-pcard .btn-favorite-corner { top: 6px; right: 6px; width: 32px; height: 32px; font-size: 13px; }
  .tm-grid[data-density="4"] .tm-pcard .promo-badge { top: 6px; left: 6px; }
  .tm-grid--collections { grid-template-columns: 1fr; gap: 12px; }
}

/* ==========================================================================
   Sayfa bileşenleri — içerik sayfaları (iletişim, hakkımızda, kurumsal,
   danışmanlık, projeler, blog, favoriler...) bunlarla kurulur.
   Kapak için .tm-hero + .tm-crumbs (ürün listesiyle aynı) kullanılır.
   ========================================================================== */
.tm-hero--short { min-height: clamp(260px, 38vh, 400px); }
.tm-hero--plain { min-height: 0; background: var(--tm-ink-2); }
.tm-hero--plain::before { display: none; }
.tm-hero--plain .tm-hero__content { padding-top: 64px; padding-bottom: 56px; }

.tm-section { padding: clamp(56px, 7vw, 96px) 0; }
.tm-section--soft { background: var(--tm-bg-soft); }
.tm-section--dark { background: var(--tm-ink-2); color: rgba(255, 255, 255, .82); }
.tm-section--tight { padding: clamp(32px, 4vw, 48px) 0; }
/* Art arda iki beyaz bölüm arasında boşluk iki katına çıkmasın */
.tm-section:not(.tm-section--soft):not(.tm-section--dark) + .tm-section:not(.tm-section--soft):not(.tm-section--dark) { padding-top: 0; }

.tm-eyebrow {
  display: block;
  margin: 0 0 14px;
  color: var(--tm-accent);
  font: 500 12px/1.2 var(--tm-font);
  letter-spacing: var(--tm-tracking-caps);
  text-transform: uppercase;
}
.tm-section--dark .tm-eyebrow { color: var(--tm-accent-soft); }
.tm-title { margin: 0; color: var(--tm-ink); font: 300 clamp(28px, 3.4vw, 44px)/1.12 var(--tm-font); letter-spacing: -.02em; }
.tm-title--sm { font-size: clamp(22px, 2.4vw, 30px); line-height: 1.2; }
.tm-section--dark .tm-title { color: #fff; }
.tm-lead { max-width: 640px; margin: 18px 0 0; color: var(--tm-muted); font: 400 17px/1.7 var(--tm-font); }
.tm-section--dark .tm-lead { color: rgba(255, 255, 255, .78); }
.tm-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: clamp(24px, 3vw, 40px); }
.tm-head--center { flex-direction: column; align-items: center; text-align: center; }
.tm-head--center .tm-lead { margin-left: auto; margin-right: auto; }
.tm-link {
  color: var(--tm-ink) !important;
  font: 400 14px/1 var(--tm-font);
  text-decoration: underline !important;
  text-underline-offset: 6px;
  text-decoration-color: var(--tm-line) !important;
  white-space: nowrap;
}
.tm-link:hover { text-decoration-color: var(--tm-ink) !important; }

/* Büyük düğmeler (koyu/açık zemin) */
.tm-btn--lg { height: 48px; padding: 0 26px; font-size: 14px; }
.tm-btn--light { background: #fff; color: var(--tm-ink) !important; }
.tm-btn--light:hover { background: var(--tm-sand); }
.tm-btn--outline { border-color: var(--tm-ink); color: var(--tm-ink) !important; background: transparent; }
.tm-btn--outline:hover { background: var(--tm-ink-2); color: #fff !important; }
.tm-btn--outline-light { border-color: rgba(255, 255, 255, .6); color: #fff !important; background: transparent; }
.tm-btn--outline-light:hover { background: rgba(255, 255, 255, .12); border-color: #fff; }
.tm-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

/* Görsel + metin bölmesi */
.tm-split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 6vw, 88px); align-items: center; }
.tm-split--wide-media { grid-template-columns: 7fr 5fr; }
.tm-split--reverse > :first-child { order: 2; }
.tm-split--contact { grid-template-columns: 5fr 7fr; align-items: stretch; }
.tm-split__media img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--tm-radius-sm); }
.tm-split__text p { margin: 18px 0 0; color: var(--tm-ink-3); font: 400 16px/1.75 var(--tm-font); }
.tm-split__text ul { margin: 18px 0 0; padding: 0; list-style: none; }
.tm-split__text li { position: relative; padding: 8px 0 8px 22px; border-bottom: 1px solid var(--tm-line); color: var(--tm-ink-3); font-size: 15px; }
.tm-split__text li::before { content: ''; position: absolute; left: 0; top: 17px; width: 8px; height: 1px; background: var(--tm-accent); }

/* Kartlar */
.tm-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.tm-cards--2 { grid-template-columns: repeat(2, 1fr); }
.tm-cards--3 { grid-template-columns: repeat(3, 1fr); }
.tm-cards--4 { grid-template-columns: repeat(4, 1fr); }
.tm-card {
  display: flex;
  flex-direction: column;
  padding: 28px 26px;
  border-radius: var(--tm-radius-sm);
  background: #fff;
  color: var(--tm-ink) !important;
  text-decoration: none !important;
}
.tm-section:not(.tm-section--soft) .tm-card { border: 1px solid var(--tm-line); }
a.tm-card { transition: box-shadow .3s var(--tm-ease), transform .3s var(--tm-ease); }
a.tm-card:hover { box-shadow: var(--tm-shadow); transform: translateY(-2px); }
.tm-card__icon { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-bottom: 20px; border-radius: 50%; background: var(--tm-bg-soft); color: var(--tm-accent); font-size: 18px; }
.tm-section--soft .tm-card__icon { background: var(--tm-bg-soft); }
.tm-card__icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linejoin: round; stroke-linecap: round; }
.tm-card__title { margin: 0; color: var(--tm-ink); font: 400 20px/1.25 var(--tm-font); }
.tm-card__text { margin: 10px 0 0; color: var(--tm-muted); font-size: 14px; line-height: 1.65; }
.tm-card__text a { color: var(--tm-ink) !important; }
.tm-card__go { margin-top: auto; padding-top: 18px; color: var(--tm-accent); font-size: 13px; font-weight: 500; }
.tm-card__go::after { content: ' →'; }
.tm-card__num { color: var(--tm-accent); font: 300 40px/1 var(--tm-font); letter-spacing: -.02em; }

/* Görselli kart (proje, blog) */
.tm-mcard { display: flex; flex-direction: column; color: var(--tm-ink) !important; text-decoration: none !important; }
.tm-mcard__media { display: block; overflow: hidden; border-radius: var(--tm-radius-sm); background: var(--tm-bg-soft); aspect-ratio: 4 / 3; }
.tm-mcard__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--tm-ease); }
.tm-mcard:hover .tm-mcard__media img { transform: scale(1.04); }
.tm-mcard__meta { margin-top: 16px; color: var(--tm-accent); font: 500 11px/1.2 var(--tm-font); letter-spacing: var(--tm-tracking-caps); text-transform: uppercase; }
.tm-mcard__title { margin: 8px 0 0; color: var(--tm-ink); font: 400 20px/1.3 var(--tm-font); }
.tm-mcard__text { margin: 8px 0 0; color: var(--tm-muted); font-size: 14px; line-height: 1.6; }

/* Rakamlar */
.tm-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 16px; padding-top: 24px; border-top: 1px solid var(--tm-line); }
.tm-stats strong { display: block; color: var(--tm-ink); font: 300 34px/1.1 var(--tm-font); }
.tm-stats span { color: var(--tm-muted); font-size: 13px; }
.tm-section--dark .tm-stats { border-color: rgba(255, 255, 255, .14); }
.tm-section--dark .tm-stats strong { color: #fff; }

/* Bilgi listesi (iletişim) */
.tm-info { margin: 0; padding: 0; list-style: none; }
.tm-info li { display: grid; grid-template-columns: 44px 1fr; gap: 16px; padding: 22px 0; border-bottom: 1px solid var(--tm-line); }
.tm-info li:first-child { padding-top: 0; }
.tm-info__icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--tm-bg-soft); color: var(--tm-accent); }
.tm-info__icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linejoin: round; stroke-linecap: round; }
.tm-info__label { display: block; margin-bottom: 4px; color: var(--tm-subtle); font: 500 11px/1.2 var(--tm-font); letter-spacing: var(--tm-tracking-caps); text-transform: uppercase; }
.tm-info__value { color: var(--tm-ink); font-size: 16px; line-height: 1.6; }
.tm-info__value a { color: var(--tm-ink) !important; text-decoration: none !important; }
.tm-info__value a:hover { color: var(--tm-accent) !important; }
.tm-hours { display: grid; grid-template-columns: auto 1fr; gap: 4px 20px; }
.tm-hours span:nth-child(odd) { color: var(--tm-muted); }

/* Harita */
.tm-map { position: relative; overflow: hidden; border-radius: var(--tm-radius-sm); background: var(--tm-bg-soft); min-height: 420px; height: 100%; }
.tm-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: grayscale(.25); }

/* Koyu çağrı bandı */
.tm-band { position: relative; display: flex; align-items: center; min-height: clamp(360px, 50vh, 520px); overflow: hidden; background: var(--tm-ink-2); color: #fff; }
.tm-band > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.tm-band::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20, 24, 25, .8), rgba(20, 24, 25, .25) 72%); }
.tm-band__content { position: relative; z-index: 1; padding-top: 56px; padding-bottom: 56px; }
.tm-band .tm-title { color: #fff; max-width: 640px; }
.tm-band .tm-lead { color: rgba(255, 255, 255, .82); }

/* Uzun metin (blog yazıları, kurumsal metinler) */
.tm-prose { max-width: 760px; margin: 0 auto; color: var(--tm-ink-3); font: 400 17px/1.8 var(--tm-font); }
.tm-prose > * + * { margin-top: 1.1em; }
.tm-prose h2 { margin-top: 2.2em; color: var(--tm-ink); font: 300 clamp(24px, 2.6vw, 32px)/1.25 var(--tm-font); letter-spacing: -.01em; }
.tm-prose h3 { margin-top: 1.8em; color: var(--tm-ink); font: 500 20px/1.35 var(--tm-font); }
.tm-prose a:not(.tm-btn) { color: var(--tm-ink) !important; text-decoration: underline !important; text-underline-offset: 4px; text-decoration-color: var(--tm-accent) !important; }
.tm-prose ul, .tm-prose ol { padding-left: 1.2em; }
.tm-prose li + li { margin-top: .4em; }
.tm-prose img { display: block; width: 100%; height: auto; border-radius: var(--tm-radius-sm); }
.tm-prose blockquote { margin-left: 0; padding: 4px 0 4px 22px; border-left: 2px solid var(--tm-accent); color: var(--tm-ink); font-size: 19px; }
.tm-prose table { width: 100%; border-collapse: collapse; font-size: 15px; }
.tm-prose th, .tm-prose td { padding: 10px 12px; border-bottom: 1px solid var(--tm-line); text-align: left; }
.tm-prose th { color: var(--tm-ink); font-weight: 500; }

/* Form */
.tm-field { display: grid; gap: 8px; }
.tm-field label { color: var(--tm-ink); font-size: 13px; font-weight: 500; }
.tm-field input, .tm-field textarea, .tm-field select {
  width: 100%;
  min-height: 48px;
  padding: 12px 16px;
  border: 1px solid var(--tm-line);
  border-radius: var(--tm-radius-sm);
  background: #fff;
  color: var(--tm-ink);
  font: 400 15px/1.4 var(--tm-font);
  transition: border-color .2s, box-shadow .2s;
}
.tm-field input:focus, .tm-field textarea:focus, .tm-field select:focus { outline: none; border-color: var(--tm-ink); box-shadow: 0 0 0 3px rgba(44, 54, 57, .08); }

@media (max-width: 991.98px) {
  .tm-split, .tm-split--wide-media, .tm-split--contact { grid-template-columns: 1fr; }
  .tm-split--reverse > :first-child { order: 0; }
  .tm-cards--3, .tm-cards--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767.98px) {
  .tm-cards--2, .tm-cards--3, .tm-cards--4 { grid-template-columns: 1fr; }
  .tm-head { flex-direction: column; align-items: flex-start; }
  .tm-head--center { align-items: center; }
  .tm-map { min-height: 320px; }
  .tm-prose { font-size: 16px; }
  .tm-actions .tm-btn { flex: 1 1 auto; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}