/*
Theme Name: Söğütlü
Theme URI: https://sogutlu.neosgn.co.uk
Author: NeoSgn
Description: Ertuğrul by Söğütlü — editoryal mobilya kataloğu blok teması.
Version: 2.0.0
Requires at least: 6.5
Tested up to: 7.0
Requires PHP: 8.0
License: GPL-2.0-or-later
Text Domain: sogutlu
*/

/* =========================================================
   Tasarım yönü: "Exaggerated Minimalism" (editoryal)
   — devasa tipografi, yüksek kontrast, bol negatif alan
   — aşırı süslemeden kaçınılır
   Palet: sıcak nötr zemin + logodan gelen bordo tek vurgu.
   Tüm renk çiftleri WCAG AA (ölçüldü).
   ========================================================= */

body { -webkit-font-smoothing: antialiased; }

/* ---------- SG-GUTTER ----------
   ⚠️ WP kök yan boşluğu (useRootPaddingAwareAlignments) yalnızca
   .wp-site-blocks'un DOĞRUDAN çocuklarına uygulanır. Erişilebilirlik için
   eklenen <main> sarmalayıcısı bu zinciri kırdı → mobilde içerik ekran
   kenarına yapışıyordu (ölçüm: sol kenar 0px). Yan boşluk açıkça veriliyor.
   Tam genişlik zeminler (.sg-cta, .sg-note) etkilenmez; yalnız içerik padlenir. */
/* ⚠️ WP'nin `.has-global-padding` kuralı (0,1,0) tema sheet'inden SONRA
   yüklenir ve kök değişken boş olduğu için padding'i 0'a çeker.
   !important yerine ATA SEÇİCİYLE özgüllük (0,2,0). */
.wp-site-blocks .sg-topbar,
.wp-site-blocks .sg-header,
.wp-site-blocks .sg-note,
.wp-site-blocks .sg-hero,
.wp-site-blocks .sg-section,
.wp-site-blocks .sg-cta,
.wp-site-blocks .sg-footer,
.wp-site-blocks .sg-footer-bottom {
  padding-left: clamp(1.25rem, 5vw, 3rem);
  padding-right: clamp(1.25rem, 5vw, 3rem);
}

/* ---------- SG-A11Y ---------- */
/* Skip-link WP çekirdeğinden gelir (#wp-skip-link → #icerik).
   Odaklandığında görünür olması için markanın rengi veriliyor. */
.skip-link.screen-reader-text:focus {
  outline: 3px solid #94002D;
  outline-offset: 2px;
}

a:focus-visible, button:focus-visible, input:focus-visible,
.wp-block-button__link:focus-visible {
  outline: 3px solid #94002D;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .sg-card:hover img { transform: none; }
}

/* ---------- SG-TYPE ---------- */
.sg-eyebrow {
  font-size: .7rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: #A16207;
  margin: 0 0 1.2rem 0;
}
.sg-lead {
  font-size: clamp(1.05rem, 1.6vw, 1.3rem);
  line-height: 1.65;
  color: #6B635C;
  font-weight: 300;
  max-width: 46ch;
}
/* ⚠️ Bu ezme YALNIZCA sayfa içeriği için. Daha önce tüm .sg-lead'lere
   uygulanıyordu ve anasayfa bölümlerinde paragrafı içerik sütunundan
   dolgu kenarına kaydırıyordu (ölçüm: 130px yerine 48px).
   Bölüm içindeki lead'ler .sg-lead-kutu sarmalayıcısıyla hizalanır. */
.wp-block-post-content .sg-lead,
.sg-lead-kutu .sg-lead {
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* Bölüm içi lead: içerik sütununa oturur, metin genişliği içeride sınırlanır */
.sg-lead-kutu {
  max-width: 1180px;
  margin-inline: auto;
}

/* ---------- SG-TOPBAR ---------- */
.sg-topbar {
  background: #1C1917;
  color: #D6CFC9;
  font-size: .72rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}
/* Kullanıcı isteği: şerit daha ince.
   min-height 44 → 34px. WCAG 2.5.8 (AA) eşiği 24px olduğu için hâlâ geçer;
   44px yalnızca AAA (2.5.5) gereğiydi. */
.sg-topbar__links a {
  color: #fff; text-decoration: none; margin-left: 1.6rem;
  display: inline-flex; align-items: center; min-height: 34px;
}
.sg-topbar__links a:hover { color: #E9B7C3; }
@media (max-width: 781px) {
  .sg-topbar__note { display: none; }
  .sg-topbar__links a { margin: 0 1rem 0 0; min-width: 44px; }
}

/* ---------- SG-HEADER ---------- */
.sg-header { background: #FAF5F2; }
.sg-logo img { height: 76px; width: auto; display: block; }
@media (max-width: 599px) {
  .sg-logo img { height: 58px; }
}
.sg-header .wp-block-navigation {
  font-size: .78rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-weight: 400;
}
.sg-header .wp-block-navigation a {
  display: inline-flex; align-items: center; min-height: 44px;
}

/* 768-1023: menü sığmıyordu (header 94→147px). Hamburger 1023'e çıkarıldı.
   ⚠️ WP kuralları (0,2,0) ve tema sheet'inden SONRA yüklenir →
   !important değil, ATA SEÇİCİYLE özgüllük (0,3,0). */
@media (min-width: 600px) and (max-width: 1023px) {
  .wp-block-navigation .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
  .wp-block-navigation .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none; }
}
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
  min-width: 44px; min-height: 44px;
  align-items: center; justify-content: center;
}

/* ---------- SG-BUTTONS ---------- */
.wp-block-button__link {
  border-radius: 0;
  text-transform: uppercase;
  letter-spacing: .16em;
  font-size: .72rem;
  font-weight: 500;
  padding: 1.15rem 2.6rem;
  transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}
.is-style-outline > .wp-block-button__link { border-width: 1px; }

/* Metin bağlantısı — altı çizgili editoryal iz */
.sg-textlink {
  display: inline-flex; align-items: center; min-height: 44px;
  font-size: .74rem; letter-spacing: .18em; text-transform: uppercase;
  color: #1C1917; text-decoration: none;
  border-bottom: 1px solid #1C1917;
  padding-bottom: 2px;
  transition: color .25s ease, border-color .25s ease;
}
.sg-textlink:hover { color: #94002D; border-color: #94002D; }

/* ---------- SG-HERO (asimetrik editoryal) ---------- */
/* Alt boşluk kasıtlı olarak dar: koleksiyonlar slider'a yakın dursun
   (ölçüm: kontroller→başlık arası 225px idi, ~118px'e indirildi). */
.sg-hero { padding: clamp(3rem, 7vw, 7rem) 0 clamp(1.25rem, 2.5vw, 2.5rem); }
.sg-hero__grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
}
.sg-hero h1 {
  /* checklist: clamp ile devasa tipografi */
  font-size: clamp(2.6rem, 7vw, 5.75rem);
  line-height: .98;
  letter-spacing: -.035em;
  margin: 0 0 1.6rem 0;
}
.sg-hero h1 em {
  font-style: italic;
  color: #94002D;
}
.sg-hero__media img {
  display: block; width: 100%; height: auto;
  aspect-ratio: 4 / 5; object-fit: cover;
}
.sg-hero__actions {
  display: flex; flex-wrap: wrap; gap: 1.2rem 2.2rem;
  align-items: center; margin-top: 2.4rem;
}
@media (max-width: 899px) {
  .sg-hero__grid { grid-template-columns: 1fr; }
  .sg-hero__media { order: -1; }
  .sg-hero__media img { aspect-ratio: 3 / 2; }
}
@media (max-width: 599px) {
  /* .98 satır aralığı mobilde 3 satırlık başlığı sıkıştırıyordu */
  .sg-hero h1 { line-height: 1.06; letter-spacing: -.02em; }
  .sg-hero__actions { gap: 1rem 1.4rem; margin-top: 2rem; }
}

/* ---------- SG-SLIDER ----------
   Hero karuseli. JS yoksa tüm slaytlar alt alta görünür (progressive enhancement);
   JS yüklenince .is-ready gelir ve yalnız aktif slayt kalır. */
.sg-slider { position: relative; }
.sg-slider__slide { animation: sg-fade .5s ease; }
.sg-slider.is-ready .sg-slider__slide[hidden] { display: none; }

@keyframes sg-fade {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .sg-slider__slide { animation: none; }
}

/* Kontroller kasıtlı olarak hafif: çerçeve yok, ince ikon.
   ⚠️ Görsel küçük ama düğme kutusu 44x44 KALIR (dokunma hedefi). */
.sg-slider__controls {
  display: flex; align-items: center; gap: .15rem;
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
}
.sg-slider__btn {
  width: 44px; height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent;
  border: 0;
  color: #6B635C;
  cursor: pointer;
  padding: 0;
  transition: color .25s ease, transform .25s ease;
}
.sg-slider__btn:hover { color: #94002D; }
.sg-slider__btn svg { width: 15px; height: 15px; }
/* yön ipucu: ok hover'da kendi yönüne kayar */
.sg-slider__btn[data-sg-prev]:hover { transform: translateX(-2px); }
.sg-slider__btn[data-sg-next]:hover { transform: translateX(2px); }

.sg-slider__btn[data-sg-pause] { margin-left: .35rem; }
.sg-slider__btn[data-sg-pause] svg { width: 11px; height: 11px; }

.sg-slider__dots { display: flex; gap: .1rem; margin: 0 .5rem; }
.sg-slider__dot {
  width: 44px; height: 44px;
  padding: 0; border: 0; background: transparent; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
}
.sg-slider__dot::before {
  content: ""; display: block;
  /* #D3C9C0 daha zarifti ama zeminde 1.51 → WCAG 1.4.11 (UI 3:1) kaldı.
     #988C80 = 3.03, eşiği geçen en açık ton. */
  width: 20px; height: 1px; background: #988C80;
  transition: background-color .25s ease, height .25s ease;
}
.sg-slider__dot.is-active::before { background: #94002D; height: 2px; }
.sg-slider__dot:hover::before { background: #6B635C; }

.sg-slider__count {
  /* #A79E96 denendi ama 2.43 → metin eşiği 4.5'i geçmiyor, soluk tona dönüldü */
  font-size: .68rem; letter-spacing: .2em; color: #6B635C;
  font-variant-numeric: tabular-nums;
  margin-left: auto;
}

@media (max-width: 599px) {
  .sg-slider__controls { flex-wrap: wrap; }
  .sg-slider__count { margin-left: 0; width: 100%; }
}

/* ---------- SG-SECTION ---------- */
.sg-section { padding: clamp(3.5rem, 8vw, 8rem) 0; }
.sg-section--warm { background: #F3EAE3; }
.sg-head {
  display: flex; justify-content: space-between; align-items: flex-end;
  gap: 2rem; flex-wrap: wrap;
  margin-bottom: clamp(2rem, 4vw, 3.5rem);
  border-bottom: 1px solid #E7E0DA;
  padding-bottom: 1.4rem;
}
.sg-head h2 {
  font-size: clamp(1.9rem, 4vw, 3.25rem);
  margin: 0;
}

/* Koleksiyonlar hero'ya yakın başlasın — yalnız bu bölüm */
#koleksiyonlar { padding-top: clamp(2rem, 4vw, 4rem); }

/* ---------- SG-EDITORIAL GRID ----------
   Tekdüze 8'li ızgara yerine asimetrik editoryal düzen:
   1 büyük + küçükler. */
.sg-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: clamp(1rem, 2vw, 1.75rem);
}
.sg-card { grid-column: span 2; }
.sg-card--feature { grid-column: span 3; }

@media (max-width: 899px) { .sg-card, .sg-card--feature { grid-column: span 3; } }

/* Mobilde tek sütun 375x500px kartlar veriyordu → sayfa 10,6 ekran boyu.
   Küçük kartlar ikili, yalnız "feature" kartlar tam genişlik. */
@media (max-width: 599px) {
  .sg-card { grid-column: span 3; }
  .sg-card--feature { grid-column: span 6; }
}

.sg-card {
  display: block; text-decoration: none; cursor: pointer;
  background: transparent;
}
.sg-card__media { overflow: hidden; background: #F3EAE3; }
.sg-card img {
  display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover;
  transition: transform .3s ease;  /* checklist: 150-300ms */
}
.sg-card--feature img { aspect-ratio: 3 / 4; }
.sg-card:hover img { transform: scale(1.03); }

/* Ürünler yüklenene kadar kategori kartları <a> değil <div>:
   ölü link yerine tıklanamaz kart. Ürün gelince tekrar link olacak. */
.sg-card.is-pending { cursor: default; }
.sg-card.is-pending:hover img { transform: none; }
.sg-card.is-pending:hover { border-color: #E7E0DA; box-shadow: none; }

.sg-card__meta {
  display: flex; align-items: baseline; gap: .75rem;
  padding-top: 1rem;
}
.sg-card__num {
  font-size: .7rem; letter-spacing: .18em; color: #A16207;
  font-variant-numeric: tabular-nums;
}
.sg-card__title {
  font-family: Fraunces, Georgia, serif;
  font-size: 1.15rem; letter-spacing: -.01em; color: #1C1917;
  transition: color .25s ease;
}
.sg-card:hover .sg-card__title { color: #94002D; }

/* ⚠️ Bu blok, yukarıdaki temel .sg-card img / .sg-card--feature img
   kurallarından SONRA gelmek ZORUNDA — eşit özgüllükte sonra gelen kazanır.
   Daha önce ızgara bölümünde yazılmıştı ve temel kurallar tarafından eziliyordu. */
@media (max-width: 599px) {
  .sg-card img { aspect-ratio: 1 / 1; }
  .sg-card--feature img { aspect-ratio: 4 / 3; }
  .sg-card__title { font-size: 1rem; }
  .sg-card__meta { gap: .5rem; padding-top: .7rem; }
}

/* ---------- SG-STORY (tam genişlik hikâye) ---------- */
.sg-story { position: relative; }
.sg-story img {
  display: block; width: 100%; height: clamp(340px, 52vh, 620px); object-fit: cover;
}
.sg-story__quote {
  max-width: 900px;
  margin: clamp(-4rem, -6vw, -6rem) auto 0;
  position: relative;
  background: #FAF5F2;
  padding: clamp(2rem, 4vw, 3.5rem);
}
.sg-story__quote p {
  font-family: Fraunces, Georgia, serif;
  font-size: clamp(1.35rem, 2.6vw, 2.1rem);
  line-height: 1.3; letter-spacing: -.02em;
  margin: 0; color: #1C1917;
}
.sg-story__quote cite {
  display: block; margin-top: 1.4rem;
  font-family: Jost, sans-serif; font-style: normal;
  font-size: .74rem; letter-spacing: .2em; text-transform: uppercase;
  color: #6B635C;
}

/* ---------- SG-STEPS (mimari destek) ---------- */
.sg-steps {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  margin-top: clamp(2rem, 4vw, 3rem);
}
@media (max-width: 781px) { .sg-steps { grid-template-columns: 1fr; } }
.sg-step__num {
  font-family: Fraunces, Georgia, serif;
  font-size: 2.75rem; line-height: 1; color: #94002D;
  display: block; margin-bottom: .9rem;
}
.sg-step h3 {
  font-size: 1.1rem; margin: 0 0 .5rem 0; letter-spacing: -.01em;
}
.sg-step p { margin: 0; color: #6B635C; font-size: .95rem; }

/* ---------- SG-CTA ----------
   Zemin logo bordosu. Buton bordo KALAMAZ (zeminle aynı → kaybolur)
   → krem zemin + bordo yazı. */
.sg-cta { background: #94002D; color: #FFFFFF; text-align: center; }
.sg-cta h2 {
  color: #FFFFFF;
  font-size: clamp(2rem, 5.5vw, 4.25rem);
  margin: 0 0 1.4rem 0;
}
.sg-cta p { color: #F0E4E8; margin: 0 auto 2.4rem; max-width: 48ch; }

.sg-cta .wp-block-button__link {
  background: #FAF5F2;
  color: #94002D;
}
.sg-cta .wp-block-button__link:hover {
  background: #1C1917;
  color: #FAF5F2;
}

/* ⚠️ Global odak halkası bordo → bordo zeminde GÖRÜNMEZ olurdu.
   Bu bölümde açık renge çevriliyor. */
.sg-cta a:focus-visible,
.sg-cta button:focus-visible,
.sg-cta .wp-block-button__link:focus-visible {
  outline: 3px solid #FAF5F2;
  outline-offset: 3px;
}

/* ---------- SG-FOOTER ---------- */
/* Footer gövdeyle aynı tonda kalıyordu (#FAF5F2) → sıcak tona alındı
   ve üst çizgi belirginleştirildi ki sayfa bitişi net okunsun. */
.sg-footer { background: #F3EAE3; border-top: 1px solid #DCD2C8; }
.sg-footer h3 {
  font-family: Jost, sans-serif;
  font-size: .72rem; letter-spacing: .2em; text-transform: uppercase;
  color: #6B635C; font-weight: 500; margin-bottom: 1.1rem;
}
.sg-footer ul { list-style: none; padding-left: 0; margin: 0; }
.sg-footer li { margin: 0 0 .4rem 0; padding-left: 0; }
.sg-footer a {
  color: #1C1917; text-decoration: none; font-size: .95rem;
  display: inline-flex; align-items: center; min-height: 44px;
}
.sg-footer a:hover { color: #94002D; }
/* ---------- SG-SOSYAL ---------- */
.sg-social { margin-top: 1.6rem; }
.sg-social__baslik {
  display: block;
  font-size: .72rem; letter-spacing: .2em; text-transform: uppercase;
  color: #6B635C; margin-bottom: .5rem;
}
.sg-social__ikonlar { display: flex; gap: .25rem; }
.sg-social__ikonlar a {
  /* görsel ikon 20px ama dokunma hedefi 44x44 */
  width: 44px; height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
  color: #1C1917;
  transition: color .25s ease;
}
.sg-social__ikonlar a:hover { color: #94002D; }
.sg-social__ikonlar svg { width: 20px; height: 20px; }

/* ETBİS rozeti — şu an yer tutucu, canlıda gerçek dosyayla değişecek */
.sg-etbis img {
  display: block;
  width: 100%;
  max-width: 128px;
  height: auto;
}

.sg-footer-bottom {
  background: #EDE2D9;
  border-top: 1px solid #DCD2C8;
  color: #6B635C; font-size: .78rem; text-align: center;
}

/* ---------- SG-HESAP / FORMLAR ---------- */
.woocommerce-account .woocommerce {
  max-width: 1180px;
  margin-inline: auto;
  padding-block: clamp(2.5rem, 6vw, 5rem);
}
.woocommerce form .form-row { margin-bottom: 1.25rem; }
.woocommerce form label { display: block; margin-bottom: .4rem; font-size: .92rem; }
.woocommerce .input-text,
.woocommerce input[type="text"],
.woocommerce input[type="email"],
.woocommerce input[type="tel"],
.woocommerce input[type="date"],
.woocommerce select,
.woocommerce input[type="password"] {
  width: 100%;
  padding: .85rem 1rem;
  border: 1px solid #E7E0DA;
  background: #FFFFFF;
  border-radius: 0;
  font-family: inherit;
  font-size: 1rem;
  color: #1C1917;
  min-height: 48px;
}
.woocommerce .input-text:focus { border-color: #1C1917; }
.woocommerce .required { color: #94002D; }
.sg-optional { color: #6B635C; font-size: .85rem; }

/* Bal küpü — ekranda görünmez, ekran okuyucudan da gizli.
   ⚠️ display:none KULLANMA: bazı botlar display:none alanları atlar. */
.sg-hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px; height: 1px; overflow: hidden;
}

/* Onay kutuları */
.sg-consents {
  border: 1px solid #E7E0DA;
  background: #F3EAE3;
  padding: 1.25rem;
  margin: 1.5rem 0;
}
.sg-consents legend {
  font-size: .72rem; letter-spacing: .2em; text-transform: uppercase;
  color: #6B635C; padding: 0 .5rem;
}
.sg-consent label {
  display: flex; align-items: flex-start; gap: .7rem;
  font-size: .93rem; line-height: 1.55; cursor: pointer;
}
.sg-consent input[type="checkbox"] {
  /* dokunma hedefi + hizalama */
  width: 22px; height: 22px; min-width: 22px;
  margin: .15rem 0 0 0;
  accent-color: #94002D;
  cursor: pointer;
}
.sg-consent em {
  display: block; color: #6B635C; font-size: .85rem; font-style: normal;
  margin-top: .2rem;
}
.sg-consent a { color: #94002D; text-decoration: underline; }

.woocommerce .button,
.woocommerce button.button {
  background: #94002D; color: #FAF5F2;
  border: 0; border-radius: 0;
  text-transform: uppercase; letter-spacing: .16em;
  font-size: .72rem; font-weight: 500;
  padding: 1.05rem 2.4rem;
  min-height: 48px;
  cursor: pointer;
  transition: background-color .25s ease;
}
.woocommerce .button:hover { background: #1C1917; }

/* Hesabım menüsü */
.woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; margin: 0; }
.woocommerce-MyAccount-navigation li { border-bottom: 1px solid #E7E0DA; }
.woocommerce-MyAccount-navigation a {
  display: flex; align-items: center; min-height: 48px;
  text-decoration: none; color: #1C1917;
  font-size: .82rem; letter-spacing: .1em; text-transform: uppercase;
}
.woocommerce-MyAccount-navigation .is-active a { color: #94002D; }

/* ---------- SG-İLETİŞİM ---------- */
.sg-iletisim {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: start;
  margin: 2rem 0;
}
@media (max-width: 781px) { .sg-iletisim { grid-template-columns: 1fr; } }

.sg-iletisim h3 {
  font-family: Jost, sans-serif;
  font-size: .72rem; letter-spacing: .2em; text-transform: uppercase;
  color: #6B635C; margin: 0 0 .6rem 0;
}
.sg-adres, .sg-calisma { margin: 0 0 1.4rem 0; line-height: 1.7; }
.sg-tbd { color: #94002D; font-size: .85rem; }
.sg-yol { display: flex; flex-wrap: wrap; gap: 1.5rem; }

/* Harita yer tutucu — açık adres gelince <iframe> ile değişecek */
.sg-harita-yer {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  aspect-ratio: 16 / 10;
  background: #F3EAE3;
  border: 1px dashed #B9ADA2;
  color: #6B635C;
  text-align: center;
}
.sg-harita-yer span {
  font-size: .8rem; letter-spacing: .22em; text-transform: uppercase;
}
.sg-harita-yer small { font-size: .78rem; margin-top: .4rem; color: #857B72; }

/* Harita tıkla-yükle: çerez politikamız yalnız zorunlu çerez diyor,
   bu yüzden Google Maps kullanıcı istemeden YÜKLENMEZ. */
.sg-harita { position: relative; }
.sg-harita__yukle {
  display: inline-flex; align-items: center; min-height: 44px;
  margin-top: .8rem; padding: 0 1.4rem;
  background: #1C1917; color: #FAF5F2; border: 0; cursor: pointer;
  font-family: inherit; font-size: .72rem; letter-spacing: .16em; text-transform: uppercase;
  transition: background-color .25s ease;
}
.sg-harita__yukle:hover { background: #94002D; }
.sg-harita iframe { display: block; width: 100%; aspect-ratio: 16 / 10; border: 0; }
.sg-harita__not { font-size: .78rem; color: #857B72; margin: .5rem 0 0; }

/* ---------- SG-FORM ---------- */
/* ⚠️⚠️ WP constrained layout çocuğu ORTALIYOR ve bunu !important ile yapıyor:
     .is-layout-constrained > :where(...) { margin-left:auto !important; margin-right:auto !important }
   Özgüllük artırmak YETMEZ (!important normal bildirimi her zaman ezer).
   Tek çözüm aynı silah. Ölçüm: form 360px'de başlıyordu, içerik 130px'de. */
.wp-site-blocks .sg-form {
  max-width: 720px;
  margin-top: 1.5rem;
  margin-left: 0 !important;
  margin-right: auto !important;
}
.sg-form__satir { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.25rem; }
@media (max-width: 599px) { .sg-form__satir { grid-template-columns: 1fr; } }

.sg-form__alan { margin: 0 0 1.25rem 0; min-width: 0; }
/* grid çocuğunun varsayılan min-width:auto'su input'u sütundan taşırıyordu */
.sg-form__satir > * { min-width: 0; }
.sg-form input, .sg-form select, .sg-form textarea { max-width: 100%; box-sizing: border-box; }
.sg-form label { display: block; margin-bottom: .4rem; font-size: .92rem; }
.sg-form input[type="text"],
.sg-form input[type="email"],
.sg-form input[type="tel"],
.sg-form select,
.sg-form textarea {
  width: 100%;
  padding: .85rem 1rem;
  border: 1px solid #E7E0DA;
  background: #FFFFFF;
  border-radius: 0;
  font-family: inherit;
  font-size: 1rem;
  color: #1C1917;
  min-height: 48px;
}
.sg-form textarea { min-height: 140px; resize: vertical; }
.sg-form input:focus, .sg-form select:focus, .sg-form textarea:focus { border-color: #1C1917; }
.sg-form .required { color: #94002D; }
.sg-form button { cursor: pointer; border: 0; }

.sg-form-mesaj {
  padding: 1rem 1.2rem;
  margin: 1.5rem 0;
  border-left: 3px solid;
  font-size: .95rem;
}
.sg-form-mesaj--ok    { background: #F1F6F1; border-color: #2F6B34; color: #24512A; }
.sg-form-mesaj--hata  { background: #FBF0F2; border-color: #94002D; color: #7A0526; }

/* ---------- SG-NOTE ---------- */
.sg-note {
  background: #F3EAE3;
  border-bottom: 1px solid #E7E0DA;
  color: #6B635C;
  font-size: .8rem;
  letter-spacing: .06em;
}

/* ---------- SG-HESAP DÜZENİ ----------
   Giriş/Üye ol yan yana iki sütundu → tek kolon, ortalanmış panel.
   Hesabım (giriş yapılmış) → kenarlıklı panel + yan menü. */

/* ---------- SG-AUTH (sekmeli giriş/üyelik kartı) ---------- */
.sg-auth {
  max-width: 680px;
  margin: 0 auto;
  border: 1px solid #E7E0DA;
  background: #FFFFFF;
  padding: clamp(1.5rem, 3.5vw, 2.75rem);
}
.sg-auth__tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid #E7E0DA;
  margin-bottom: 1.75rem;
}
.sg-auth__tab {
  background: none; border: 0; cursor: pointer;
  padding: .9rem .5rem 1rem;
  font-family: inherit; font-size: .78rem; font-weight: 500;
  letter-spacing: .16em; text-transform: uppercase;
  color: #6B635C;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  min-height: 44px;
  transition: color .25s ease, border-color .25s ease;
}
.sg-auth__tab:hover { color: #1C1917; }
.sg-auth__tab.is-active { color: #94002D; border-bottom-color: #94002D; }

.sg-auth__aciklama { color: #6B635C; margin: 0 0 1.5rem; font-size: .98rem; }
.sg-auth form { margin: 0; }
.sg-auth .form-row { margin: 0 0 1.25rem; }
.sg-auth label { display: block; margin-bottom: .4rem; font-size: .92rem; }
.sg-auth .required { color: #94002D; }

.sg-auth__submit {
  width: 100%;
  background: #94002D; color: #FAF5F2;
  border: 0; border-radius: 0; cursor: pointer;
  padding: 1.1rem 2rem; min-height: 52px;
  font-family: inherit; font-size: .74rem; font-weight: 500;
  letter-spacing: .16em; text-transform: uppercase;
  transition: background-color .25s ease;
}
.sg-auth__submit:hover { background: #1C1917; }

.sg-auth__alt {
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: .75rem;
  font-size: .9rem;
}
.sg-auth__hatirla { display: inline-flex; align-items: center; gap: .5rem; margin: 0; }
.sg-auth__hatirla input { width: 18px; height: 18px; accent-color: #94002D; }
.sg-auth__alt a { color: #1C1917; }

.sg-auth__gecis {
  margin: 1.75rem 0 0;
  padding-top: 1.5rem;
  border-top: 1px solid #E7E0DA;
  text-align: center;
  font-size: .95rem; color: #6B635C;
}
.sg-auth__link {
  background: none; border: 0; padding: 0; cursor: pointer;
  font-family: inherit; font-size: inherit;
  color: #94002D; text-decoration: underline;
}
.sg-auth__link:hover { color: #1C1917; }

.sg-auth__not {
  max-width: 680px; margin: 1.5rem auto 0;
  text-align: center; font-size: .9rem; color: #6B635C;
}

/* kayıt formundaki iki sütunlu satırlar kartta da çalışsın */
.sg-auth .sg-form__satir { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.25rem; }
@media (max-width: 599px) { .sg-auth .sg-form__satir { grid-template-columns: 1fr; } }

/* Giriş yapılmış: panel görünümü */
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content {
  box-sizing: border-box;
}
.woocommerce-account .woocommerce-MyAccount-navigation {
  float: left;
  width: 26%;
  border: 1px solid #E7E0DA;
  background: #FFFFFF;
  padding: .5rem 1.25rem;
}
.woocommerce-account .woocommerce-MyAccount-content {
  float: right;
  width: 71%;
  border: 1px solid #E7E0DA;
  background: #FFFFFF;
  padding: clamp(1.5rem, 3vw, 2.25rem);
}
.woocommerce-account .woocommerce-MyAccount-content::after {
  content: ""; display: block; clear: both;
}
@media (max-width: 781px) {
  .woocommerce-account .woocommerce-MyAccount-navigation,
  .woocommerce-account .woocommerce-MyAccount-content {
    float: none; width: 100%; margin-bottom: 1.5rem;
  }
}

/* Menü satırları tablo hissi versin */
.woocommerce-MyAccount-navigation li { border-bottom: 1px solid #E7E0DA; }
.woocommerce-MyAccount-navigation li:last-child { border-bottom: 0; }
.woocommerce-MyAccount-navigation a { padding: 0; }

/* Hesap içi tablolar */
.woocommerce-account table.woocommerce-table,
.woocommerce-account table.shop_table {
  width: 100%; border-collapse: collapse; border: 1px solid #E7E0DA;
}
.woocommerce-account table th,
.woocommerce-account table td {
  border-bottom: 1px solid #E7E0DA; padding: .85rem 1rem; text-align: left;
  font-size: .95rem;
}
.woocommerce-account table th {
  background: #F3EAE3;
  font-size: .72rem; letter-spacing: .14em; text-transform: uppercase;
  font-weight: 500; color: #6B635C;
}

/* ---------- SG-AUTH düzeltmeleri ----------
   1) .woocommerce .button kuralı (daha sonra tanımlı) .sg-auth__submit'i eziyordu
      → renk bordo kalsın diye özgüllük yükseltildi.
   2) Kart içinde form ayrıca çerçeveleniyordu (çift kutu) → kaldırıldı. */
.sg-auth .sg-auth__submit,
.woocommerce .sg-auth .sg-auth__submit {
  background: #94002D;
  color: #FAF5F2;
}
.sg-auth .sg-auth__submit:hover,
.woocommerce .sg-auth .sg-auth__submit:hover {
  background: #1C1917;
}

.woocommerce-account .sg-auth form.login,
.woocommerce-account .sg-auth form.register {
  border: 0;
  background: transparent;
  padding: 0;
}

/* ---------- SG-AUTH SADELEŞTİRME ----------
   Sorun: kart içinde alanlar farklı kaynaklardan stil alıyordu
   (WooCommerce + tema + .sg-form) → kimi kalın çerçeveli/yüksek,
   kimi çerçevesiz ve yan yana yapışık, select komşusundan alçak.
   Çözüm: kart içindeki TÜM alanlar tek kurala bağlandı. */

.sg-auth input[type="text"],
.sg-auth input[type="email"],
.sg-auth input[type="tel"],
.sg-auth input[type="date"],
.sg-auth input[type="password"],
.sg-auth select,
.woocommerce .sg-auth .input-text,
.woocommerce .sg-auth select {
  width: 100%;
  box-sizing: border-box;
  min-width: 0;
  height: 50px;
  padding: 0 1rem;
  border: 1px solid #E7E0DA;
  border-radius: 0;
  background: #FFFFFF;
  font-family: inherit;
  font-size: 1rem;
  line-height: normal;
  color: #1C1917;
  appearance: none;
  -webkit-appearance: none;
}
.sg-auth select {
  /* ok işareti (appearance:none sonrası kaybolur) */
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%236B635C' stroke-width='1.5' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.5rem;
}
.sg-auth input:focus,
.sg-auth select:focus { border-color: #1C1917; outline-offset: 2px; }

/* satır aralıkları eşit, sütunlar arasında gerçek boşluk */
.sg-auth .sg-form__satir {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 1.25rem;
}
.sg-auth .sg-form__satir > .form-row,
.sg-auth .sg-form__satir > p { margin: 0 0 1.25rem; min-width: 0; }
@media (max-width: 599px) { .sg-auth .sg-form__satir { grid-template-columns: 1fr; } }

.sg-auth label {
  display: block;
  margin-bottom: .45rem;
  font-size: .88rem;
  color: #1C1917;
}
.sg-auth .sg-optional { color: #857B72; font-size: .82rem; }

/* İzinler: ağır bej kutu yerine sade bölüm */
.sg-auth .sg-consents {
  border: 0;
  border-top: 1px solid #E7E0DA;
  background: transparent;
  padding: 1.5rem 0 .25rem;
  margin: .5rem 0 1.5rem;
}
.sg-auth .sg-consents legend {
  padding: 0;
  font-size: .72rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #857B72;
  margin-bottom: 1rem;
}
.sg-auth .sg-consent { margin: 0 0 1rem; }
.sg-auth .sg-consent label {
  display: flex; align-items: flex-start; gap: .7rem;
  margin: 0; font-size: .93rem; line-height: 1.55; cursor: pointer;
}
.sg-auth .sg-consent input[type="checkbox"] {
  width: 20px; height: 20px; min-width: 20px; margin: .1rem 0 0;
  accent-color: #94002D; cursor: pointer; appearance: auto; -webkit-appearance: auto;
}
.sg-auth .sg-consent em {
  display: block; margin-top: .15rem;
  font-style: normal; font-size: .84rem; color: #857B72;
}

/* WooCommerce'in gizlilik paragrafı kartta küçük ve sakin dursun */
.sg-auth .woocommerce-privacy-policy-text p {
  font-size: .85rem; color: #857B72; margin: 0 0 1.25rem;
}

/* E-posta/Parola alanları WooCommerce'in kendi kuralından koyu çerçeve alıyordu
   (rgba(32,7,7,.8)); diğer alanlar açık. Ata seçiciyle tek renge indiriliyor. */
.wp-site-blocks .sg-auth input[type="text"],
.wp-site-blocks .sg-auth input[type="email"],
.wp-site-blocks .sg-auth input[type="tel"],
.wp-site-blocks .sg-auth input[type="date"],
.wp-site-blocks .sg-auth input[type="password"],
.wp-site-blocks .sg-auth select {
  border: 1px solid #E7E0DA;
}
.wp-site-blocks .sg-auth input:focus,
.wp-site-blocks .sg-auth select:focus { border-color: #1C1917; }

/* ---------- SG-TOPBAR HOŞGELDİN ---------- */
.sg-topbar__hosgeldin { text-transform: none; letter-spacing: .04em; }
.sg-topbar__selam { color: #D6CFC9; }
.sg-topbar__hosgeldin strong { color: #fff; font-weight: 500; }
.sg-topbar__hosgeldin:hover strong { color: #E9B7C3; }
@media (max-width: 781px) {
  /* mobilde "Hoş geldiniz," gizlenir, sadece isim kalır */
  .sg-topbar__selam { display: none; }
}

/* ---------- SG-İLETİŞİM (yeni düzen) ----------
   Üstte: adres + form yan yana. Altta: tam genişlik harita. */
.sg-iletisim-ust { align-items: flex-start; }

/* Form artık sütun içinde → kart genişliğini kaplasın */
/* Sol sütundaki mağaza listesiyle aynı hizada başlasın diye ek üst boşluk yok:
   iki sütun da h2 + tek satır paragraf sonrası aynı noktadan devam eder. */
.wp-site-blocks .sg-iletisim-ust .sg-form {
  max-width: none;
  margin-top: 0 !important;
}
.sg-iletisim-ust .sg-magazalar { margin-top: 0; }
.sg-iletisim-ust .sg-magaza:first-child { padding-top: 0; }
.sg-iletisim-ust .sg-form__satir { grid-template-columns: 1fr 1fr; }
@media (max-width: 899px) {
  .sg-iletisim-ust .sg-form__satir { grid-template-columns: 1fr; }
}

/* Tam genişlik harita — üstteki iki sütunun toplam genişliği kadar */
.sg-harita-tam {
  margin-top: clamp(2.5rem, 5vw, 4rem);
  border: 1px solid #E7E0DA;
  background: #F3EAE3;
  line-height: 0;
}
.sg-harita-tam iframe {
  display: block;
  width: 100%;
  height: clamp(320px, 42vh, 460px);
  border: 0;
}

/* harita üstündeki aktif mağaza etiketi */
.sg-harita__etiket {
  margin: 0;
  padding: .85rem 1.25rem;
  background: #F3EAE3;
  border-bottom: 1px solid #E7E0DA;
  font-size: .72rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #6B635C;
  line-height: 1.4;
}
/* ---------- SG-MAĞAZA SEÇİCİ ----------
   Beyaz kutu kaldırıldı: yalnız mağaza ADI tıklanabilir.
   Aktif mağaza sol bordo çizgiyle işaretlenir. */
.sg-magazalar { margin: 0 0 2rem; }

.sg-magaza {
  padding: 0 0 1.25rem 1rem;
  margin-bottom: 1.25rem;
  border-left: 2px solid #E7E0DA;
  transition: border-color .25s ease;
}
.sg-magaza:last-child { margin-bottom: 0; }
.sg-magaza.is-active { border-left-color: #94002D; }

.sg-magaza__ad {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0;
  background: none;
  border: 0;
  cursor: pointer;
  font-family: Fraunces, Georgia, serif;
  font-size: 1.15rem;
  color: #1C1917;
  text-align: left;
  border-bottom: 1px solid transparent;
  transition: color .25s ease, border-color .25s ease;
}
.sg-magaza__ad:hover { color: #94002D; border-bottom-color: #94002D; }
.sg-magaza.is-active .sg-magaza__ad {
  color: #94002D;
  border-bottom-color: #94002D;
}

.sg-magaza__adres {
  margin: .2rem 0 .6rem;
  font-size: .93rem;
  line-height: 1.65;
  color: #6B635C;
}
.sg-magaza .sg-yol { gap: 1.25rem; }

.sg-iletisim__kanal h3 {
  font-family: Jost, sans-serif;
  font-size: .72rem; letter-spacing: .2em; text-transform: uppercase;
  color: #6B635C; margin: 0 0 .6rem;
}

/* ---------- SG-FOOTER derli toplu ---------- */
.sg-footer .wp-block-columns { gap: 2rem; }
.sg-footer h3 { margin-bottom: .9rem; }
.sg-footer li { margin: 0; }
.sg-footer a { min-height: 38px; }

/* ETBİS + sosyal aynı sütunda, alt alta */
.sg-etbis img { max-width: 112px; }
.sg-footer .sg-social { margin-top: 1.25rem; }
.sg-social__baslik { margin-bottom: .35rem; }
.sg-social__ikonlar { margin-left: -10px; }


/* ---------- SG-DOKUNMA HEDEFİ DÜZELTMELERİ ----------
   Denetim: onay kutuları 18-22px, şifre göster düğmesi 22px idi.
   WCAG 2.5.8 (AA) asgari 24x24 → hepsi eşiğin üstüne çıkarıldı. */
input[type="checkbox"] {
  width: 24px;
  height: 24px;
  min-width: 24px;
  accent-color: #94002D;
}
.sg-auth .sg-consent input[type="checkbox"],
.sg-form .sg-consent input[type="checkbox"],
.sg-consents input[type="checkbox"] {
  width: 24px;
  height: 24px;
  min-width: 24px;
}
.sg-auth__hatirla input[type="checkbox"] { width: 24px; height: 24px; }

/* WooCommerce parola göster/gizle düğmesi */
.woocommerce-password-hint,
button.show-password-input,
.show-password-input {
  min-width: 28px;
  min-height: 28px;
}
.woocommerce .sg-auth .password-input { position: relative; display: block; }

/* ---------- SG-YORUMLAR ----------
   Müşteri yorumları şeridi.

   ⚠️ Bilinçli olarak KARUSEL DEĞİL, kaydırılabilir liste:
   hero'da zaten otomatik dönen bir karusel var. İkinci bir otomatik hareket
   kaynağı hem dikkati böler hem WCAG 2.2.2 (Pause/Stop/Hide) yükümlülüğünü
   ikiye katlar. Burada otomatik geçiş yok → duraklat düğmesi de gerekmiyor.

   ⚠️ Kartlar BEYAZ, warm (#F3EAE3) değil: altın yıldız #A16207 warm zeminde
   4.15 (metin eşiği 4.5'in altı), beyazda 4.92 ile geçiyor.

   ⚠️ Gutter: bölüm `.sg-section` sınıfını da taşıdığı için üstteki
   `.wp-site-blocks .sg-section` kuralından yan boşluğu zaten alıyor;
   listeye ayrıca eklenmesi gerekmedi. */

/* Zemin tam genişlik, içerik sayfa standardında (theme.json contentSize: 1180px).
   Diğer bölümler bunu WP'nin constrained layout'undan alır; bu bölüm gerçek bir
   wp:group olmadığı (renderer'dan ham HTML geliyor) için sütun elle veriliyor. */
.sg-yorumlar__ic {
  max-width: 1180px;
  margin-inline: auto;
}

.sg-yorumlar__uyari {
  /* #6B635C / #F3EAE3 = 4.96 ✅ */
  color: #6B635C;
  font-size: .9rem;
  max-width: 62ch;
  margin: -1rem 0 2rem;
}

.sg-yorumlar__serit {
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  /* Kaydırma çubuğu GİZLİ: gezinme ok/gösterge düğmeleriyle yapılıyor,
     çubuk kartların altında ikinci bir kontrol gibi duruyordu.
     ⚠️ Yalnız GÖRÜNÜM gizlenir — şerit hâlâ kaydırılabilir (dokunma,
     trackpad, klavye ok tuşları), yani erişilebilirlik kaybı yok. */
  scrollbar-width: none;              /* Firefox */
  -ms-overflow-style: none;           /* eski Edge */
}
.sg-yorumlar__serit::-webkit-scrollbar { display: none; }  /* Chrome/Safari */
.sg-yorumlar__serit:focus-visible {
  outline: 3px solid #94002D;      /* bordo */
  outline-offset: 3px;
}

/* ⚠️ WP çekirdek liste stilleri sola girinti verir → reset şart. */
.sg-yorumlar__liste {
  display: flex;
  gap: 1.5rem;
  list-style: none;
  margin: 0;
  padding: 0 0 1rem;
}

.sg-yorum-kart {
  position: relative;
  /* ⚠️ ŞART: tema li'lere border-box vermiyor → flex-basis dolguyu saymaz ve
     kart 2rem×2 dolgu + çerçeve kadar şişer (ölçüm: 1440px'te 360 yerine 426px,
     360px'te kart 328px / şerit 320px → mobilde kart şeride HİÇ sığmıyordu). */
  box-sizing: border-box;
  /* Masaüstünde AYNI ANDA TAM 3 kart: iki boşluk (2 x 1.5rem) düşülüp üçe bölünür.
     clamp(...30%...) 3 kartı garanti etmiyordu (1440'ta 3 sığıyordu ama
     ara genişliklerde 2'ye düşüyordu). */
  flex: 0 0 calc((100% - 3rem) / 3);
  scroll-snap-align: start;
  background: #FFFFFF;             /* surface */
  border: 1px solid #E7E0DA;       /* line */
  /* Tema genelinde köşe yarıçapı 0 (editoryal sert çizgi); yorum kartları
     bilinçli istisna — Motsveva'daki yumuşak kart dili istendi.
     Gölge sıcak paletle uyumlu olsun diye mürekkep tonundan (#1C1917) türetildi;
     Motsveva'nın mavi-gri gölgesi (34,54,79) bu zeminde soğuk kalıyordu. */
  border-radius: 10px;
  box-shadow: 0 10px 30px rgba(28, 25, 23, .06);
  padding: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
}

.sg-yorum-kart__rozet {
  position: absolute;
  top: 1rem; right: 1rem;
  font-size: .62rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #6B635C;                  /* 5.89 / beyaz ✅ */
  border: 1px solid #C9BFB6;
  padding: .2rem .5rem;
}

.sg-yorum-kart__yildiz {
  letter-spacing: .12em;
  font-size: .95rem;
  line-height: 1;
}
.sg-yorum-kart__yildiz-dolu { color: #A16207; }   /* altın, 4.92 / beyaz ✅ */
/* Boş yıldızlar dekoratif: puan role="img" + aria-label ile TAM olarak
   iletiliyor, dolu/boş ayrımı bilgiyi anlamak için gerekli değil
   → WCAG 1.4.11 kapsamı dışında (bkz. .sg-slider__dot notu). */
.sg-yorum-kart__yildiz-bos { color: #C9BFB6; }

.sg-yorum-kart__metin {
  margin: 0;
  border: 0;
  padding: 0;
  flex: 1;
}
.sg-yorum-kart__metin p {
  margin: 0;
  font-size: .98rem;
  line-height: 1.7;
  color: #1C1917;                  /* mürekkep, 17.49 ✅ */
}

.sg-yorum-kart__kimlik {
  display: flex;
  align-items: center;
  gap: .85rem;
  border-top: 1px solid #E7E0DA;
  padding-top: 1.1rem;
}
.sg-yorum-kart__avatar {
  flex: 0 0 auto;
  width: 40px; height: 40px;
  border-radius: 50%;
  background: #F3EAE3;             /* warm */
  color: #94002D;                  /* bordo */
  display: inline-flex;
  align-items: center; justify-content: center;
  font-family: Fraunces, Georgia, serif;
  font-size: .9rem;
  letter-spacing: .02em;
}
.sg-yorum-kart__ad {
  font-size: .92rem;
  color: #1C1917;
  display: flex;
  flex-direction: column;
  line-height: 1.35;
}
.sg-yorum-kart__konum {
  font-size: .78rem;
  color: #6B635C;                  /* 5.89 ✅ */
  letter-spacing: .04em;
}

/* Ok düğmeleri yalnız JS bağlandıktan sonra görünür (hero'daki is-ready deseni)
   → JS kapalıyken işlevsiz düğme gösterilmez; şerit parmakla zaten kayar. */
/* Düzen .sg-slider__controls'tan gelir (hero ile tek kaynak);
   burada yalnız üst boşluk daraltılıyor — şerit zaten gölge payı bırakıyor. */
.sg-yorumlar__nav { margin-top: .25rem; }
.sg-yorumlar:not(.is-ready) .sg-yorumlar__nav { display: none; }

.sg-yorumlar__nav .sg-slider__btn[disabled] {
  opacity: .3;
  cursor: default;
}
.sg-yorumlar__nav .sg-slider__btn[data-sg-yorum-prev]:hover:not([disabled]) { transform: translateX(-2px); }
.sg-yorumlar__nav .sg-slider__btn[data-sg-yorum-next]:hover:not([disabled]) { transform: translateX(2px); }

@media (max-width: 899px) {
  .sg-yorum-kart { flex-basis: min(78%, 340px); padding: 1.6rem; }
}
@media (max-width: 599px) {
  .sg-yorum-kart { flex-basis: 86%; }
  .sg-yorumlar__uyari { margin-top: -.5rem; }
}

/* Duraklat düğmesi — hero'daki desenle aynı, ikon biraz küçük ama kutu 44x44 kalır */
.sg-yorumlar__nav .sg-slider__btn[data-sg-yorum-pause] { margin-left: .35rem; }
.sg-yorumlar__nav .sg-slider__btn[data-sg-yorum-pause] svg { width: 11px; height: 11px; }
.sg-yorumlar__nav .sg-slider__btn[data-sg-yorum-pause].is-paused { color: #94002D; }

/* Gölge kartın kenarında kırpılmasın: şeridin alt boşluğu gölgeye yer açar */
.sg-yorumlar__liste { padding-bottom: 2.2rem; }

/* ⚠️ Hero'da 3 slayt var, burada sayfa sayısı ekran daraldıkça ARTIYOR
   (1440'ta 3, 360'ta 8) → 8 × 44px gösterge mobilde şeride sığmıyordu
   (ölçüm: 391px içerik / 360px ekran = yatay taşma).
   Çözüm: göstergeler sarabilir + dar ekranda kutu 36px.
   Dokunma hedefi 36×44 → WCAG 2.5.8 (AA) 24px eşiğinin üstünde kalır. */
.sg-yorumlar__nav .sg-slider__dots { flex-wrap: wrap; }
@media (max-width: 599px) {
  .sg-yorumlar__nav .sg-slider__dot { width: 36px; }
}

/* ---------- SG-YORUMLAR: yükseklik ----------
   Ölçüm: bölüm 770px'ti ve 230px'i (yaklaşık üçte biri) yalnızca üst/alt
   boşluktu. Kartlar tek satır olduğu için bu bölüm diğerleri kadar nefes
   alanına ihtiyaç duymuyor; .sg-section varsayılanı burada daraltılıyor.
   ⚠️ padding-block kullanılıyor: yan boşluk (.wp-site-blocks .sg-section
   gutter kuralı, 0,2,0) bozulmasın. */
.sg-yorumlar { padding-block: clamp(2.25rem, 4.5vw, 4rem); }

/* Başlık ile kartlar arası: 56px → 32px */
.sg-yorumlar .sg-head { margin-bottom: 2rem; }

/* Uyarı notu daha sıkı otursun */
.sg-yorumlar__uyari { margin: -.75rem 0 1.5rem; }

/* Gölge payı: 35px gereğinden fazlaydı, gölge ~30px'te sönüyor */
.sg-yorumlar__liste { padding-bottom: 1.5rem; }

/* Kart iç dolgusu 32 → 26px (okunabilirlik bozulmadan) */
.sg-yorum-kart { padding: 1.6rem; }
.sg-yorum-kart__kimlik { padding-top: .9rem; }

/* İkinci tur daraltma (kullanıcı isteği): 613 → ~550px.
   Kart METNİNE dokunulmuyor (satır aralığı/punto aynı) — yalnız
   çevresindeki boşluklar toplanıyor. */
.sg-yorumlar { padding-block: clamp(2rem, 3.5vw, 3rem); }
.sg-yorumlar .sg-head { margin-bottom: 1.5rem; padding-bottom: 1rem; }
.sg-yorumlar__uyari { margin: -.5rem 0 1.15rem; }
.sg-yorumlar__liste { padding-bottom: 1.25rem; }
.sg-yorum-kart { gap: .85rem; }
.sg-yorum-kart__kimlik { padding-top: .75rem; }

/* Yıldızlar büyütüldü (kullanıcı isteği): .95rem → 1.25rem.
   Puan kartın ilk okunan bilgisi; bu ölçekte metinle yarışmadan öne çıkıyor.
   Satır yüksekliği 1 olduğu için kart yalnız ~5px uzuyor. */
.sg-yorum-kart__yildiz { font-size: 1.25rem; letter-spacing: .1em; }