/* Tema kopru stili: bayi renk/yazi tipi belirtecleri + perdeci bolumleri + yerlesik akislarin tema ici gorunumu. */

.tg-theme, .tg-theme body { font-family: var(--tg-font); }
.tg-theme .font-11, .tg-theme .font-2 { font-family: var(--tg-font) !important; }
.tg-theme .text-dark-8 { color: var(--tg-dark) !important; }
.tg-bg-accent { background-color: var(--tg-accent) !important; color: #fff !important; }
.tg-bg-accent:hover { filter: brightness(.92); }
.tg-bg-surface { background-color: var(--tg-surface) !important; }
.tg-btn-outline { border: 1px solid var(--tg-accent) !important; color: var(--tg-accent) !important; background: transparent !important; }
.tg-btn-outline:hover { background: var(--tg-accent) !important; color: #fff !important; }
.tg-img-empty { display: block; width: 100%; height: 100%; min-height: 320px; background: linear-gradient(135deg, var(--tg-surface), #fff); }

.tg-preview-bar { position: relative; z-index: 1000; }
.tg-logo-text {
  /* Marka adi logo sutununa sigmali: demolarda o sutun dar (col-xl-2) ve uzun bir
     firma adi nowrap kalirsa menunun uzerine biner. */
  display: block; max-width: 100%;
  font-size: clamp(13px, 1.2vw, 22px); line-height: 1.15;
  font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--tg-dark);
}
.header-white:not(.header-bg) .tg-logo-text { color: #fff; }
.tg-logo-img { max-height: 44px; width: auto; }
/* Menu kendi sutununda kalsin; tasarsa komsu sutunun (logo) uzerine biniyor. */
.box-navigation, .box-nav-menu { min-width: 0; }
.box-nav-menu { flex-wrap: wrap; }
.tg-header .count-box { background: var(--tg-accent); }
.tg-topbar a { text-decoration: underline; text-underline-offset: 3px; }

/* Olcu alma rehberi */
.tg-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 24px; }
.tg-steps li { display: flex; gap: 14px; align-items: flex-start; }
.tg-step-n { flex: 0 0 36px; height: 36px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 600; }

/* Numune */
.tg-samples-img img, .tg-samples-img .tg-img-empty { width: 100%; height: 100%; min-height: 420px; object-fit: cover; }
.tg-samples-text { padding: 48px 8%; max-width: 620px; }

/* Oda ilhami */
.tg-rooms { display: grid; gap: 16px; grid-template-columns: 1fr; }
@media (min-width: 768px) { .tg-rooms-2 { grid-template-columns: 1fr 1fr; } .tg-rooms-3 { grid-template-columns: repeat(3, 1fr); } }
.tg-rooms .image img, .tg-rooms .tg-img-empty { aspect-ratio: 4 / 5; width: 100%; object-fit: cover; }

/* SSS, yorum */
.tg-qa { border-bottom: 1px solid #e5e1da; padding: 16px 0; }
.tg-qa summary { cursor: pointer; font-size: 17px; list-style: none; display: flex; justify-content: space-between; gap: 12px; }
.tg-qa summary::after { content: '+'; font-size: 22px; line-height: 1; color: var(--tg-accent); }
.tg-qa[open] summary::after { content: '–'; }
.tg-qa p { margin: 12px 0 0; }
.tg-review { padding: 28px; }

.tg-footer-row { display: grid; gap: 32px; grid-template-columns: 1fr; }
@media (min-width: 768px) { .tg-footer-row { grid-template-columns: 2fr 1fr 1fr; } }
.tg-footer-row .footer-col-block { max-width: none; }

/* Kategori, urun */
.tg-cat-head { padding: 24px 0 32px; }
.tg-product { padding-bottom: 48px; }
.tg-gallery-main img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; background: #f5f5f5; }
.tg-gallery-thumbs { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin-top: 8px; }
.tg-gallery-thumbs .thumb { border: 1px solid transparent; padding: 0; background: none; }
.tg-gallery-thumbs .thumb.is-active { border-color: var(--tg-dark); }
.tg-gallery-thumbs img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.tg-richtext img { max-width: 100%; height: auto; }
.tg-richtext table { width: 100%; }

/* Yerlesik akislar (sepet, kasa, numune, olcu kutusu) tema icinde */
.tg-legacy { --primary: var(--tg-accent); --accent: var(--tg-accent); --ink: var(--tg-dark); --radius: 0px; font-family: var(--tg-font); background: transparent; color: var(--tg-dark); }
.tg-legacy h1, .tg-legacy h2, .tg-legacy h3 { font-family: var(--tg-font); font-weight: 500; letter-spacing: 0; }
.tg-page { padding: 32px 0 64px; }
.tg-page .btn { border-radius: 0; }
.tg-buy { margin-top: 20px; }
.tg-buy .buy { padding: 0; background: none; border: 0; box-shadow: none; }
.tg-buy .btn-buy { width: 100%; }

/* Ince ayarlar (gorsel kontrol sonrasi) */
.tg-product .product-name { font-size: clamp(26px, 2.4vw, 34px); line-height: 1.2; margin-bottom: 10px; }
.tg-product .product-price .price-new { font-size: 22px; color: var(--tg-accent); }
.tg-theme main h2.title { font-size: clamp(22px, 2vw, 28px); }
@media (min-width: 992px) { .tg-steps { grid-template-columns: 1fr 1fr; } }
.tg-rooms-section { padding-top: 64px; }
.tg-footer-row { align-items: start; }
.tg-footer-row > .footer-col-block { padding: 0 !important; margin: 0 !important; }
.tg-iconbox .tf-icon-box { align-items: center; }

/* Demolarin vurgu rengi (kirmizi/turuncu) yerine temanin kendi vurgusu.
   Fiyat bazi demolarda .text-primary ile kirmizi geliyordu. */
.tg-theme .text-primary { color: var(--tg-accent) !important; }

/* Kirinti yolu: paketlerin kendi .breadcrumb-list stili her demoda yok,
   liste alt alta diziliyordu. */
.tg-theme .breadcrumb-list {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  list-style: none; margin: 0; padding: 16px 0 0;
}
.tg-theme .breadcrumb-list .item + .item::before { content: "/"; opacity: .45; margin-right: 8px; }
.tg-theme .breadcrumb-list .item { display: flex; align-items: center; font-size: 14px; }
.tg-theme .breadcrumb-list .link { color: inherit; opacity: .7; }
.tg-theme .breadcrumb-list .link:hover { opacity: 1; }

/* Arama: baslikta simge, arama sayfasinda kutu */
.tg-theme .tg-search-form { display: flex; gap: 8px; max-width: 520px; margin: 16px 0 8px; }
.tg-theme .tg-search-form input {
  flex: 1; min-width: 0; padding: 12px 16px; font: inherit;
  border: 1px solid rgba(0,0,0,.18); border-radius: 3px; background: #fff; color: var(--tg-dark);
}
.tg-theme .tg-search-form input:focus { outline: 2px solid var(--tg-accent); outline-offset: 1px; }
/* Dugmenin gorunumu pakete birakilmiyor: .tf-btn her demoda ayni tanimli degil
   ve arama kutusunda cercevesiz duz yazi gibi kaliyordu. */
.tg-theme .tg-search-form button {
  white-space: nowrap; border: 0; border-radius: 3px; cursor: pointer;
  padding: 12px 22px; font: inherit; font-weight: 500;
  background: var(--tg-accent); color: #fff;
}
.tg-theme .tg-search-form button:hover { filter: brightness(.92); }
.tg-theme .tg-search-cats { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.tg-theme .tg-search-hint { margin: 12px 0; opacity: .75; }

/* Kampanya rozeti ve kampanyasiz fiyat.
   Demoda karsiligi olmayan temalarda BIZ ekliyoruz; olanlarda demonun kendi
   isaretlemesi doldurulur ve bu stiller devreye girmez. */
.tg-theme .card-product-wrapper { position: relative; }
.tg-theme .tg-sale {
  position: absolute; z-index: 3; top: 10px; left: 10px;
  padding: 4px 10px; border-radius: 3px;
  background: var(--tg-dark); color: #fff;
  font-size: 12px; font-weight: 600; letter-spacing: .02em; line-height: 1.4;
}
.tg-theme .tg-price-old { margin-left: 8px; opacity: .55; text-decoration: line-through; }

/* ---- Mini sepet ----------------------------------------------------------
   Demolarin kendi mini sepeti (sahte urunler, "ucretsiz kargoya X kaldi")
   iskelette siliniyor; bu panel bizim ve 5 pakette de ayni gorunuyor. */
.tg-cart { position: fixed; inset: 0; z-index: 1100; }
.tg-cart[hidden] { display: none; }
.tg-cart-back {
  position: absolute; inset: 0; background: rgba(0,0,0,.42);
  opacity: 0; transition: opacity .25s ease;
}
.tg-cart.is-open .tg-cart-back { opacity: 1; }
.tg-cart-panel {
  position: absolute; top: 0; right: 0; height: 100%; width: min(420px, 100%);
  display: flex; flex-direction: column; background: #fff; color: var(--tg-dark);
  box-shadow: -8px 0 40px rgba(0,0,0,.18);
  transform: translateX(100%); transition: transform .25s ease;
}
.tg-cart.is-open .tg-cart-panel { transform: none; }
.tg-cart-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 20px; border-bottom: 1px solid rgba(0,0,0,.08); font-size: 17px;
}
.tg-cart-x { border: 0; background: none; font-size: 26px; line-height: 1; cursor: pointer; color: inherit; }
.tg-cart-body { flex: 1; overflow: auto; padding: 8px 20px; }
.tg-cart-body[aria-busy="true"] { opacity: .5; }
.tg-cart-empty { padding: 32px 0; opacity: .7; }
.tg-cart-line { display: flex; gap: 12px; padding: 16px 0; border-bottom: 1px solid rgba(0,0,0,.07); }
.tg-cart-line.has-problem { background: rgba(200,60,40,.06); }
.tg-cart-img { flex: 0 0 72px; }
.tg-cart-img img { width: 72px; height: 88px; object-fit: cover; display: block; }
.tg-cart-info { flex: 1; min-width: 0; }
.tg-cart-name { color: inherit; font-weight: 500; text-decoration: none; }
.tg-cart-meta { font-size: 13px; opacity: .65; margin-top: 3px; }
.tg-cart-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 10px; }
.tg-qty { display: inline-flex; align-items: center; border: 1px solid rgba(0,0,0,.18); border-radius: 3px; }
.tg-qty button { width: 30px; height: 30px; border: 0; background: none; cursor: pointer; font-size: 16px; color: inherit; }
.tg-qty span { min-width: 26px; text-align: center; font-size: 14px; }
.tg-cart-price { font-weight: 600; white-space: nowrap; }
.tg-cart-del { border: 0; background: none; font-size: 20px; line-height: 1; cursor: pointer; opacity: .4; color: inherit; }
.tg-cart-del:hover { opacity: 1; }
.tg-cart-foot { padding: 16px 20px 22px; border-top: 1px solid rgba(0,0,0,.08); display: grid; gap: 10px; }
.tg-cart-sum { display: flex; justify-content: space-between; font-size: 16px; margin-bottom: 4px; }
.tg-btn {
  display: block; text-align: center; padding: 13px 18px; border-radius: 3px;
  font-weight: 500; text-decoration: none; cursor: pointer;
}
.tg-btn-fill { background: var(--tg-accent); color: #fff; }
.tg-btn-line { border: 1px solid rgba(0,0,0,.25); color: inherit; }
body.tg-cart-open { overflow: hidden; }

/* ---- Hizli bakis ---------------------------------------------------------
   Demolarda "Quick View" dugmesi vardi ama arkasi bostu; artik olcu kutusu
   urun sayfasindakiyle ayni koddan geliyor. */
.tg-qv-btn {
  position: absolute; left: 50%; bottom: 12px; transform: translate(-50%, 8px);
  z-index: 3; border: 0; border-radius: 3px; cursor: pointer;
  padding: 9px 18px; font: inherit; font-size: 13px; font-weight: 500;
  background: #fff; color: var(--tg-dark); box-shadow: 0 2px 12px rgba(0,0,0,.14);
  opacity: 0; transition: opacity .2s ease, transform .2s ease;
}
.card-product:hover .tg-qv-btn, .tg-qv-btn:focus-visible { opacity: 1; transform: translate(-50%, 0); }
@media (hover: none) { .tg-qv-btn { opacity: 1; transform: translate(-50%, 0); } }

.tg-qv { position: fixed; inset: 0; z-index: 1200; }
.tg-qv[hidden] { display: none; }
.tg-qv-back { position: absolute; inset: 0; background: rgba(0,0,0,.45); opacity: 0; transition: opacity .25s ease; }
.tg-qv.is-open .tg-qv-back { opacity: 1; }
.tg-qv-panel {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -46%) scale(.98);
  width: min(920px, calc(100% - 32px)); max-height: min(86vh, 760px); overflow: auto;
  background: #fff; color: var(--tg-dark); border-radius: 4px;
  box-shadow: 0 24px 60px rgba(0,0,0,.28);
  opacity: 0; transition: opacity .25s ease, transform .25s ease;
}
.tg-qv.is-open .tg-qv-panel { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.tg-qv-x {
  position: absolute; top: 10px; right: 12px; z-index: 2;
  border: 0; background: none; font-size: 28px; line-height: 1; cursor: pointer; color: inherit;
}
.tg-qv-body { display: grid; grid-template-columns: minmax(0, 40%) minmax(0, 1fr); gap: 0; }
.tg-qv-media { background: var(--tg-surface); }
.tg-qv-media img { width: 100%; height: 100%; max-height: 760px; object-fit: cover; display: block; }
.tg-qv-info { padding: 28px 30px 30px; min-width: 0; }
.tg-qv-title { font-size: 24px; margin: 0 0 6px; }
.tg-qv-price { margin: 0 0 18px; opacity: .8; }
.tg-qv-more { display: inline-block; margin-top: 14px; color: inherit; }
.tg-qv-loading { min-height: 320px; }
@media (max-width: 767px) { .tg-qv-body { grid-template-columns: 1fr; } .tg-qv-media img { max-height: 260px; } }

/* ---- Siparis takibi ------------------------------------------------------
   Musteri hesabi yok; demolardaki "Account" simgesi buraya baglanir. */
.tg-theme .tg-track { max-width: 520px; }
.tg-theme .tg-track h1 { margin: 0 0 8px; }
.tg-theme .tg-track .lede { opacity: .75; margin: 0 0 20px; }
.tg-theme .tg-track-form { display: grid; gap: 14px; }
.tg-theme .tg-track-form label { display: grid; gap: 6px; font-size: 14px; }
.tg-theme .tg-track-form input {
  padding: 12px 16px; font: inherit; color: var(--tg-dark);
  border: 1px solid rgba(0,0,0,.18); border-radius: 3px; background: #fff;
}
.tg-theme .tg-track-form input:focus { outline: 2px solid var(--tg-accent); outline-offset: 1px; }
.tg-theme .tg-track-form button {
  justify-self: start; border: 0; border-radius: 3px; cursor: pointer;
  padding: 13px 26px; font: inherit; font-weight: 500;
  background: var(--tg-accent); color: #fff;
}
.tg-theme .tg-track-error {
  padding: 12px 14px; border-radius: 3px; margin-bottom: 16px;
  background: rgba(190,60,40,.09); color: #8c2d1c;
}

/* ---- Buyuk gorsel yuksekligi ---------------------------------------------
   Demolar gorselin kendi oranina gore yukseklik aliyor. Katalog gorsellerimiz
   dar/uzun oranli oldugu icin hero 1100 px'i asiyor ve metin ekranin altina
   dusuyordu. Yukseklik ekrana gore sinirlanir, gorsel kirpilarak doldurur. */
.tg-theme .tf-slideshow .wrap-slider,
.tg-theme .tf-slideshow .slider-wrap {
  height: clamp(460px, 78vh, 820px);
}
.tg-theme .tf-slideshow .wrap-slider > img,
.tg-theme .tf-slideshow .slider-wrap .image,
.tg-theme .tf-slideshow .slider-wrap .image img,
.tg-theme .tf-slideshow .img-slider,
.tg-theme .tf-slideshow .img-slider img {
  height: 100%; width: 100%; object-fit: cover;
}

/* ---- Gorsel ustunde yazi: okunabilirlik -----------------------------------
   Demolar bu kartlari DUZ RENKLI yer tutucuyla tasarlamis; beyaz yazi orada
   okunuyor. Gercek (karisik renkli) fotograf gelince yazi kayboluyordu.
   Yazinin durdugu kenara dogru koyulasan bir katman eklenir; paketler arasi
   ortak kart siniflari hedeflenir. */
.tg-theme .collection-position-2,
.tg-theme .collection-position,
.tg-theme .collection-item-v2 { position: relative; }
.tg-theme .collection-position-2 .img-style,
.tg-theme .collection-position .img-style { position: relative; display: block; }
.tg-theme .collection-position-2 .img-style::after,
.tg-theme .collection-position .img-style::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: inherit;
  background: linear-gradient(180deg, rgba(0,0,0,.52) 0%, rgba(0,0,0,.18) 38%, rgba(0,0,0,0) 62%);
}
.tg-theme .collection-position-2 .content,
.tg-theme .collection-position .content { z-index: 2; padding-left: 14px; padding-right: 14px; }
.tg-theme .collection-position-2 .content .title,
.tg-theme .collection-position .content .title {
  font-size: clamp(18px, 1.55vw, 26px); line-height: 1.15;
  overflow-wrap: normal; word-break: normal;
  text-shadow: 0 1px 12px rgba(0,0,0,.25);
}

/* Buyuk gorsel metni: gorselin sol-alt kenari koyulasir */
.tg-theme .tf-slideshow .wrap-slider::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background: linear-gradient(90deg, rgba(0,0,0,.42) 0%, rgba(0,0,0,.18) 42%, rgba(0,0,0,0) 70%);
}
.tg-theme .tf-slideshow .wrap-slider .box-content,
.tg-theme .tf-slideshow .wrap-slider .content-slider { position: relative; z-index: 2; }
/* Modave'de .box-content gorselin ustune MUTLAK konumlu; relative olunca yazi
   gorselin altina tasip kesiliyordu ("Lys, der passer" yarim gorunuyordu). */
.tg-theme.tg-modave .tf-slideshow .wrap-slider .box-content { position: absolute; }
/* Metni sagda duran varyant (Ecomus "reverse"): koyulasma sagdan */
.tg-theme .tf-slideshow .wrap-slider.reverse::after {
  background: linear-gradient(270deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,.22) 45%, rgba(0,0,0,0) 72%);
}
/* Metni ortada duran varyant (Vineta "slider-wrap" + text-center): ortada yumusak leke.
   Uretilen fotograflar acik renkli perdeli; beyaz baslik perdenin ustune dusuyordu. */
/* Yalniz Vineta: Modave de ayni sinif adini kullaniyor ama .image orada mutlak konumlu;
   position:relative verince yazi gorselin altina kayiyordu. */
.tg-theme.tg-vineta .tf-slideshow .slider-wrap .image::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background: radial-gradient(ellipse 60% 55% at 50% 50%, rgba(0,0,0,.42) 0%, rgba(0,0,0,.2) 55%, rgba(0,0,0,0) 100%);
}
.tg-theme.tg-vineta .tf-slideshow .slider-wrap .box-content { z-index: 2; }
.tg-theme .tf-slideshow .slider-wrap .heading,
.tg-theme .tf-slideshow .wrap-slider .heading { text-shadow: 0 2px 18px rgba(0,0,0,.28); }

/* Uzun bilesik kelimeli basliklar kucuk yazilir, ortadan kirilmaz (_common.fitTitle) */
.tg-theme .tg-long { font-size: clamp(16px, 1.3vw, 21px) !important; }
.tg-theme .tg-xlong { font-size: clamp(14px, 1.08vw, 18px) !important; letter-spacing: -.01em; }

/* Duz renkli kampanya banti (Modave "banner-cls-discover" gorselsiz). Temanin
   vurgu rengini alir; bayi rengi degistirince bant da degisir. */
.tg-theme .tg-color-banner {
  position: relative; min-height: clamp(300px, 34vw, 440px);
  background: var(--tg-accent); border-radius: 16px; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
}
.tg-theme .tg-color-banner .cls-content { position: relative; inset: auto; transform: none; padding: 48px 24px; }

/* ---- Kategori menusu ------------------------------------------------------
   Demolarin mega menusu demo sayfalarini listeliyordu, siliniyor. Yerine bizim
   agacimiz: ust kategori + fareyle acilan alt kategori listesi (5 pakette ayni). */
.tg-theme .tg-has-sub { position: relative; }
.tg-theme .tg-caret {
  display: inline-block; width: 6px; height: 6px; margin-left: 7px; vertical-align: 2px;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg);
}
.tg-theme .tg-sub {
  position: absolute; top: 100%; left: 50%; z-index: 60; min-width: 260px;
  margin: 0; padding: 10px 0; list-style: none; text-align: left;
  background: #fff; color: var(--tg-dark); border-radius: 6px;
  box-shadow: 0 16px 40px rgba(0,0,0,.14);
  opacity: 0; visibility: hidden; transform: translate(-50%, 8px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.tg-theme .tg-has-sub:hover > .tg-sub,
.tg-theme .tg-has-sub:focus-within > .tg-sub { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.tg-theme .tg-sub a {
  display: flex; justify-content: space-between; gap: 16px; padding: 8px 20px;
  color: inherit; text-decoration: none; font-size: 15px; white-space: nowrap;
}
.tg-theme .tg-sub a:hover { background: var(--tg-surface); }
.tg-theme .tg-sub a span { opacity: .45; font-size: 13px; }
.tg-theme .tg-mb-sub { list-style: none; margin: 4px 0 10px; padding-left: 14px; }
.tg-theme .tg-mb-sub a { display: block; padding: 5px 0; font-size: 14px; color: inherit; opacity: .8; }

/* ---- Kategori sayfasi: alt kategoriler ve siralama ---- */
.tg-theme .tg-subcats { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 6px; }
.tg-chip {
  display: inline-flex; align-items: center; gap: 7px; padding: 8px 15px;
  border: 1px solid rgba(0,0,0,.16); border-radius: 999px;
  color: inherit; text-decoration: none; font-size: 14px; line-height: 1.2; background: #fff;
}
.tg-chip span { opacity: .5; font-size: 12px; }
.tg-chip:hover { border-color: var(--tg-dark, #222); }
.tg-chip.is-active { background: var(--tg-dark, #222); border-color: var(--tg-dark, #222); color: #fff; }
.tg-cat-tools { display: flex; justify-content: flex-end; margin: 10px 0 18px; }
.tg-sort label { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; }
.tg-sort select {
  padding: 8px 34px 8px 12px; font: inherit; font-size: 14px; color: inherit;
  border: 1px solid rgba(0,0,0,.18); border-radius: 4px; background-color: #fff;
}

/* ---- GearO (Aftenro) --------------------------------------------------------
   Bento izgarasinda sutun genisligi tanimsiz; demo YATAY gorsellere gore oturuyor.
   Bizim gorsellerin orani farkli olunca sutunlar kayiyor, kucuk kutular sutunu
   doldurmuyordu. Oran sabitlenir, gorsel kutuyu kirpilarak doldurur. */
@media (min-width: 768px) {
  .tg-gearo .grid-cls-v2 { grid-template-columns: minmax(0, 1.85fr) minmax(0, 1fr); }
  .tg-gearo .grid-cls-v2 .item1 { height: clamp(460px, 44vw, 630px); }
  .tg-gearo .grid-cls-v2 .item2,
  .tg-gearo .grid-cls-v2 .item3 { height: calc((clamp(460px, 44vw, 630px) - 30px) / 2); }
}
.tg-gearo .grid-cls-v2 .collection-position,
.tg-gearo .grid-cls-v2 .img-style { width: 100%; height: 100%; display: block; border: 0; }
.tg-gearo .grid-cls-v2 .img-style img { width: 100%; height: 100%; object-fit: cover; border: 0; }
@media (max-width: 767px) {
  .tg-gearo .grid-cls-v2 .img-style { aspect-ratio: 4 / 5; height: auto; }
}

/* Ust serit: demoda dar sutunda kisa bir cumle vardi; duyurularimiz uzun.
   Tek duyuru, ortada, tam genislik. */
.tg-gearo .tf-topbar .row > [class*="col-"]:first-child { flex: 0 0 100%; max-width: 100%; }
.tg-gearo .tf-topbar .wrapper-slider-topbar { max-width: 560px; margin: 0 auto; }
.tg-gearo .tf-topbar .swiper-slide { text-align: center; white-space: nowrap; }
.tg-gearo .tf-topbar .swiper-slide p { overflow: hidden; text-overflow: ellipsis; margin: 0; }
/* GearO koleksiyon kartlari: gorsel orani sabit (farkli oranli katalog gorselleri
   kartlari farkli yukseklikte birakiyordu) */
.tg-gearo .flat-spacing-2 .collection-position .img-style,
.tg-gearo .flat-spacing-2 .collection-position-2 .img-style { aspect-ratio: 1 / 1; overflow: hidden; }
.tg-gearo .flat-spacing-2 .collection-position .img-style img,
.tg-gearo .flat-spacing-2 .collection-position-2 .img-style img { width: 100%; height: 100%; object-fit: cover; }
/* GearO koleksiyon karti etiketi: ad one, sayi arkada; uzun ad iki satira iner */
.tg-gearo .collection-position.style-4 .cls-content { align-items: center; gap: 12px; }
.tg-gearo .collection-position.style-4 .cls-content h4 {
  font-size: clamp(17px, 1.35vw, 21px); line-height: 1.2; margin: 0;
  overflow-wrap: normal; word-break: normal; min-width: 0;
}
.tg-gearo .collection-position.style-4 .cls-content h6 {
  font-family: "Kumbh Sans", sans-serif; font-size: 13px; font-weight: 400;
  opacity: .6; white-space: nowrap; margin: 0; flex-shrink: 0;
}
/* GearO alt bilgi sag blok (bultenin yerine marka + numune cagrisi) */
.tg-gearo .tg-footer-brand { display: grid; gap: 14px; align-content: start; max-width: 420px; }
.tg-gearo .tg-footer-brand .footer-heading { margin: 0; }
.tg-gearo .tg-footer-brand p { margin: 0; opacity: .75; }
.tg-gearo .tg-footer-brand .tf-btn { justify-self: start; }
/* Koyu liste alt bilgiden once son bolum: arada genis beyaz serit kalmasin */
.tg-gearo .tg-list-last { padding-bottom: 28px; }

/* Alt bilgide marka adi (logo gorseli yoksa): koyu alt bilgilerde koyu kaliyordu.
   Alt bilginin kendi yazi rengini alir. */
.tg-theme #footer .tg-logo-text, .tg-theme footer .tg-logo-text { color: inherit; }
.tg-theme #footer .footer-bg .tg-logo-text,
.tg-theme #footer.footer-bg .tg-logo-text,
.tg-theme footer[class*="bg-dark"] .tg-logo-text { color: #fff; }

/* Mobil menude arama kutusu */
.tg-theme .tg-mb-search form { display: flex; align-items: center; gap: 6px; margin: 4px 0 14px;
  border: 1px solid rgba(0,0,0,.18); border-radius: 999px; padding: 4px 6px 4px 16px; }
.tg-theme .tg-mb-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 15px; padding: 8px 0; color: inherit; }
.tg-theme .tg-mb-search button { border: 0; background: var(--tg-dark); color: #fff; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; }

/* GearO: ic sayfa basliklari da temanin serif basligini kullanir */
/* (.font-11 kurali !important ile govde yazi tipini dayatiyor; burada daha ozgul + !important) */
.tg-theme.tg-gearo .tg-cat-head .title,
.tg-theme.tg-gearo .tg-product .product-name,
.tg-theme.tg-gearo .tg-track h1,
.tg-theme.tg-gearo .tg-legacy h1, .tg-theme.tg-gearo .tg-legacy h2 { font-family: "Marcellus", serif !important; font-weight: 400; letter-spacing: 0; }

/* Mobil: alt kategori cipleri tek satir, yatay kaydirma (5 satir yer kapliyordu) */
@media (max-width: 767px) {
  .tg-theme .tg-subcats {
    flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none;
    margin-left: -15px; margin-right: -15px; padding: 2px 15px 6px;
    -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity;
  }
  .tg-theme .tg-subcats::-webkit-scrollbar { display: none; }
  .tg-theme .tg-subcats .tg-chip { flex: 0 0 auto; scroll-snap-align: start; white-space: nowrap; }
  .tg-theme .tg-cat-tools { justify-content: flex-start; }
}

/* Telefonda Modave buyuk gorsel yazisi tum genislige yayiliyor; soldan koyulasma
   sagdaki acik renkli perdeyi kapatmiyordu. Asagidan koyulasma. */
@media (max-width: 767px) {
  .tg-theme.tg-modave .tf-slideshow .wrap-slider::after {
    background: linear-gradient(0deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,.3) 45%, rgba(0,0,0,0) 75%);
  }
}

/* ---- bayinin icerik sayfalari (/side/...) ve kategori tanitim metni ---- */
.tg-theme .tg-info-page { max-width: 820px; margin: 0 auto; padding: 8px 0 40px; }
.tg-theme .tg-info-page h1 { margin: 0 0 20px; }
.tg-theme .tg-richtext { line-height: 1.7; }
.tg-theme .tg-richtext h2 { font-size: 1.35rem; margin: 28px 0 10px; }
.tg-theme .tg-richtext h3 { font-size: 1.12rem; margin: 22px 0 8px; }
.tg-theme .tg-richtext p, .tg-theme .tg-richtext ul, .tg-theme .tg-richtext ol { margin: 0 0 14px; }
.tg-theme .tg-richtext ul, .tg-theme .tg-richtext ol { padding-left: 1.3em; }
.tg-theme .tg-richtext ul { list-style: disc; }
.tg-theme .tg-richtext ol { list-style: decimal; }
.tg-theme .tg-richtext a { text-decoration: underline; color: var(--tg-accent); }
.tg-theme .tg-richtext img { max-width: 100%; height: auto; }
.tg-theme .tg-cat-intro { max-width: 760px; margin: 10px 0 18px; line-height: 1.65; }
.tg-theme .tg-cat-intro p { margin: 0 0 10px; }

.tg-theme .confirm-notes { margin: 24px 0; padding: 16px 18px; border-radius: 10px; background: rgba(0,0,0,.035); }
.tg-theme .confirm-notes h2 { font-size: 1.05rem; margin: 0 0 10px; }
.tg-theme .confirm-note { padding: 8px 0; border-top: 1px solid rgba(0,0,0,.08); }
.tg-theme .confirm-note:first-of-type { border-top: 0; }
.tg-theme .confirm-note time { font-size: .85rem; opacity: .7; }
.tg-theme .confirm-note p { margin: 4px 0 0; white-space: pre-line; }