/* ==========================================================================
   Yeşilyurt — özel stiller
   Renk paleti: antresit (anthracite) tonları + sıcak bronz vurgu
   Nav / mega menü animasyonları: transform + cubic-bezier(0.25,0.46,0.45,0.94)
   ========================================================================== */

:root {
  --yy-ease: cubic-bezier(0.250, 0.460, 0.450, 0.940);
  --yy-950: #14161a;
  --yy-900: #1c1f23;
  --yy-800: #262a2f;
  --yy-700: #34383e;
  --yy-600: #454a51;
  --yy-500: #5c6169;
  --yy-400: #83898f;
  --yy-300: #aeb2b7;
  --yy-200: #d3d5d8;
  --yy-100: #eef0f1;
  --yy-accent: #b5863c;
  --yy-accent-dark: #8f6a2e;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Montserrat', 'Segoe UI', sans-serif;
  color: var(--yy-900);
}

[dir="rtl"] body {
  font-family: 'Montserrat', 'Tahoma', sans-serif;
}

/* -------------------------------------------------------------------------
   Üst menü — masaüstü (mega menü / dropdown)
   Kaynak site incelemesindeki mekanik: panel translateY(-120%) -> 0 (700ms),
   içerik sütunları translateY(120%) opacity 0 -> translateY(0) opacity 1 (900ms)
   ------------------------------------------------------------------------- */
.yy-nav-list {
  position: relative;
}

.yy-nav-link {
  position: relative;
  display: block;
  border-bottom: 0.2em solid transparent;
  transition: all 200ms var(--yy-ease);
}

.yy-nav-item:hover > .yy-nav-link,
.yy-nav-item.yy-open > .yy-nav-link {
  border-bottom-color: var(--yy-accent);
}

.yy-mega-panel {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  z-index: -1;
  background: #fff;
  overflow: hidden;
  transform: translateY(-12px);
  opacity: 0;
  visibility: hidden;
  transition: transform 400ms var(--yy-ease), opacity 300ms var(--yy-ease), visibility 0s linear 400ms;
  box-shadow: 0 24px 48px -12px rgba(20, 22, 26, 0.18);
}

.yy-nav-item:hover .yy-mega-panel,
.yy-nav-item.yy-open .yy-mega-panel {
  transform: translateY(0%);
  opacity: 1;
  visibility: visible;
  z-index: 30;
  transition: transform 400ms var(--yy-ease), opacity 300ms var(--yy-ease), visibility 0s linear 0s;
}

.yy-mega-col {
  transform: translateY(120%);
  opacity: 0;
  transition: transform 900ms var(--yy-ease), opacity 900ms var(--yy-ease);
}

.yy-nav-item:hover .yy-mega-col,
.yy-nav-item.yy-open .yy-mega-col {
  transform: translateY(0%);
  opacity: 1;
}

/* -------------------------------------------------------------------------
   Küçük dropdown'lar (dil seçici gibi kısa listeler)
   Mega panel ile aynı yükseklik-yüzdeli mantığı kullanmaz; kısa içerikte
   üstten taşma bırakmaz. Görünürlük opacity/visibility ile kontrol edilir.
   ------------------------------------------------------------------------- */
.yy-dropdown {
  position: absolute;
  top: 100%;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 300ms var(--yy-ease), transform 300ms var(--yy-ease), visibility 0s linear 300ms;
  box-shadow: 0 24px 48px -12px rgba(20, 22, 26, 0.18);
}

.yy-nav-item:hover .yy-dropdown,
.yy-nav-item.yy-open .yy-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition: opacity 300ms var(--yy-ease), transform 300ms var(--yy-ease), visibility 0s linear 0s;
}

/* -------------------------------------------------------------------------
   Mobil menü (hamburger)
   .yy-mobile-menu: translateY(-150%) -> .is-active: translateY(0) (500ms)
   .yy-mobile-submenu: translateY(-200%) -> .is-active: translateY(0) (500ms)
   ------------------------------------------------------------------------- */
.yy-mobile-menu {
  position: fixed;
  inset: 0;
  top: 0;
  z-index: 100;
  background: #fff;
  transform: translateY(-150%);
  transition: transform 500ms var(--yy-ease);
  overflow-y: auto;
}

.yy-mobile-menu.is-active {
  transform: translateY(0%);
}

.yy-mobile-submenu {
  position: absolute;
  inset: 0;
  z-index: 10;
  background: #fff;
  transform: translateY(-200%);
  transition: transform 500ms var(--yy-ease);
  overflow-y: auto;
}

.yy-mobile-submenu.is-active {
  transform: translateY(0%);
}

.yy-hamburger-icon {
  transition: transform 300ms var(--yy-ease);
}

/* Body scroll lock while mobile menu is open */
body.yy-menu-locked {
  overflow: hidden;
}

/* -------------------------------------------------------------------------
   Anasayfa hero slider — Akfen'in slider mekaniği (Swiper) ile eşleşen
   özel pagination (soldaki dikey ikon+etiket listesi) ve scroll göstergesi.
   Kaynak sitede: span geçişi 300ms aynı ease, aktifte 2px çerçeve + kalın yazı.
   ------------------------------------------------------------------------- */
.yy-hero-pagination {
  display: flex;
  flex-direction: column;
  /* Kapsayıcı kutu slayt içeriğinin üzerine taşabildiği için tıklamaları
     yutmasın; yalnızca bullet'lar tıklanabilir olsun. */
  pointer-events: none;
}

.yy-hero-bullet {
  pointer-events: auto;
  display: flex;
  align-items: center;
  gap: 0.85em;
  padding: 10px 22px;
  margin-bottom: 6px;
  cursor: pointer;
  color: #fff;
  border: 2px solid transparent;
  border-radius: 32px;
  background: transparent;
  width: fit-content;
}

.yy-hero-bullet-icon {
  display: flex;
  opacity: 0.9;
}

.yy-hero-bullet-label {
  font-size: 0.95rem;
  font-weight: 500;
  white-space: nowrap;
  position: relative;
  left: 0;
  transition: left 300ms var(--yy-ease), font-weight 300ms var(--yy-ease);
}

.yy-hero-bullet:hover .yy-hero-bullet-label {
  left: 0.6em;
}

.yy-hero-bullet.swiper-pagination-bullet-active {
  border-color: var(--yy-accent);
}

.yy-hero-bullet.swiper-pagination-bullet-active .yy-hero-bullet-label {
  font-weight: 700;
  left: 0 !important;
}

.yy-scroll-chevron {
  position: absolute;
  left: 50%;
  bottom: 22px;
  width: 12px;
  height: 12px;
  border-bottom: 3px solid var(--yy-accent);
  border-right: 3px solid var(--yy-accent);
  transform: translateX(-50%) rotate(45deg);
  animation: yy-chevron-bounce 1.6s ease-in-out infinite;
  z-index: 20;
  pointer-events: none;
}

@keyframes yy-chevron-bounce {
  0%, 100% { margin-top: 0; opacity: 0.6; }
  50% { margin-top: 8px; opacity: 1; }
}

/* -------------------------------------------------------------------------
   Genel yardımcılar
   ------------------------------------------------------------------------- */
.yy-fade-up {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 700ms var(--yy-ease), transform 700ms var(--yy-ease);
}
.yy-fade-up.yy-in {
  opacity: 1;
  transform: translateY(0);
}

.yy-underline-accent {
  position: relative;
}
.yy-underline-accent::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -0.4em;
  height: 3px;
  width: 3.5em;
  background: var(--yy-accent);
}

.yy-scrollbar-hide::-webkit-scrollbar { display: none; }
.yy-scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }

/* -------------------------------------------------------------------------
   Üst bilgi çubuğu (topbar) — sticky header'ın üstünde ince kurumsal şerit
   ------------------------------------------------------------------------- */
.yy-topbar {
  background: var(--yy-950);
  color: var(--yy-300);
}
/* Topbar öğelerinin dar genişlikte kelime kelime sarilip taşmasını önler
   (flex item min-width:auto varsayılanı nedeniyle oluşan sarma sorunu). */
.yy-topbar .whitespace-nowrap {
  white-space: nowrap;
}
.yy-topbar .shrink-0 {
  flex-shrink: 0;
}
.yy-topbar a:hover {
  color: var(--yy-accent);
}
.yy-topbar-social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  border: 1px solid var(--yy-700);
  border-radius: 2px;
  color: var(--yy-300);
  transition: border-color 250ms var(--yy-ease), color 250ms var(--yy-ease);
}
.yy-topbar-social a:hover {
  border-color: var(--yy-accent);
  color: var(--yy-accent-light, var(--yy-accent));
}

/* -------------------------------------------------------------------------
   Breadcrumb (iç sayfalar)
   ------------------------------------------------------------------------- */
.yy-breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5em;
}
.yy-breadcrumb a {
  color: var(--yy-300);
  transition: color 200ms var(--yy-ease);
}
.yy-breadcrumb a:hover {
  color: var(--yy-accent);
}
.yy-breadcrumb-sep {
  color: var(--yy-600);
}
.yy-breadcrumb-current {
  color: #fff;
  font-weight: 600;
}

/* -------------------------------------------------------------------------
   Sürecimiz — adım göstergesi bağlayıcı çizgisi
   ------------------------------------------------------------------------- */
.yy-process-grid {
  position: relative;
}
.yy-process-step {
  position: relative;
}
.yy-process-num {
  position: relative;
  z-index: 2;
}
@media (min-width: 1024px) {
  .yy-process-grid::before {
    content: '';
    position: absolute;
    top: 28px;
    left: 12.5%;
    right: 12.5%;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--yy-200) 15%, var(--yy-200) 85%, transparent);
    z-index: 1;
  }
}

/* -------------------------------------------------------------------------
   Kurumsal duruş / alıntı bloğu
   ------------------------------------------------------------------------- */
.yy-quote-mark {
  font-family: Georgia, 'Times New Roman', serif;
  line-height: 0.6;
  color: var(--yy-accent);
  opacity: 0.55;
}

/* -------------------------------------------------------------------------
   Neden Yeşilyurt — kart üst çizgi vurgusu
   ------------------------------------------------------------------------- */
.yy-why-card {
  position: relative;
  overflow: hidden;
}
.yy-why-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--yy-accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 400ms var(--yy-ease);
}
.yy-why-card:hover::before {
  transform: scaleX(1);
}

/* -------------------------------------------------------------------------
   Hero / sayfa başlığı metin bloğu — Akfen'deki mekanik:
   sol 3px accent çizgi + slayt/​sayfa değişiminde yumuşak "yerine oturma"
   animasyonu (aynı yy-ease eğrisi, 600ms).
   ------------------------------------------------------------------------- */
.yy-hero-textblock,
.yy-page-hero-text {
  border-left: 3px solid var(--yy-accent);
  padding-left: 1.1em;
}

@keyframes yy-hero-settle {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}

.yy-hero-textblock {
  opacity: 1;
}
.swiper-slide-active .yy-hero-textblock {
  animation: yy-hero-settle 600ms var(--yy-ease);
}

.yy-page-hero-text {
  animation: yy-hero-settle 700ms var(--yy-ease);
}

/* -------------------------------------------------------------------------
   Mega menü arka plan perdesi (backdrop) — Akfen'deki gibi: panel açıkken
   altındaki hero/sayfa içeriği kararır, panelin alt kenarında içerik
   "kesilmiş" gibi görünmez. main.js açık nav-item üzerinde .is-active ekler.
   ------------------------------------------------------------------------- */
.yy-nav-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(20, 22, 26, 0.6);
  opacity: 0;
  visibility: hidden;
  z-index: 20;
  pointer-events: none;
  transition: opacity 400ms var(--yy-ease), visibility 0s linear 400ms;
}

.yy-nav-backdrop.is-active {
  opacity: 1;
  visibility: visible;
  transition: opacity 400ms var(--yy-ease);
}

/* -------------------------------------------------------------------------
   Anasayfa — YouTube video bölümü (includes/home-media.php)
   İlk video büyük (sol), diğerleri sağda alt alta.
   ------------------------------------------------------------------------- */
.yy-video-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.75rem;
}
@media (min-width: 768px) {
  .yy-video-grid { grid-template-columns: 1fr 1fr; }
  .yy-video-card.is-featured { grid-column: 1 / -1; }
}
@media (min-width: 1024px) {
  .yy-video-grid { grid-template-columns: 2fr 1fr; grid-template-rows: auto auto; }
  .yy-video-card.is-featured { grid-column: 1; grid-row: 1 / span 2; }
}
.yy-video,
.yy-video-card iframe {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: 2px;
  overflow: hidden;
  background: #262a2f;
}
.yy-video { padding: 0; cursor: pointer; }
.yy-video[disabled] { cursor: default; }
.yy-video img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 700ms var(--yy-ease);
}
.yy-video:not([disabled]):hover img { transform: scale(1.05); }
.yy-video-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(20, 22, 26, 0.75), rgba(20, 22, 26, 0.15));
}
.yy-video-play {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 4.25rem;
  height: 4.25rem;
  margin: -2.125rem 0 0 -2.125rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background: #b5863c;
  color: #fff;
  box-shadow: 0 0 0 10px rgba(181, 134, 60, 0.25);
  transition: transform 300ms var(--yy-ease), background 300ms var(--yy-ease);
}
.yy-video-play svg { width: 1.75rem; height: 1.75rem; margin-left: 3px; }
.yy-video:hover .yy-video-play { transform: scale(1.08); background: #8f6a2e; }
.yy-video-soon {
  position: absolute;
  top: 1rem;
  left: 1rem;
  padding: 0.375rem 0.75rem;
  background: rgba(20, 22, 26, 0.85);
  color: #d3ab6f;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  border-radius: 2px;
}
.yy-video-title {
  margin-top: 1rem;
  color: #fff;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.4;
}
.yy-video-card.is-featured .yy-video-title { font-size: 1.25rem; }

/* -------------------------------------------------------------------------
   Marka logosu (header / mobil menü / footer)
   ------------------------------------------------------------------------- */
.yy-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
}
.yy-brand-mark {
  width: 3.25rem;
  height: 3.25rem;
  border-radius: 9999px;
  flex-shrink: 0;
  transition: transform 500ms var(--yy-ease);
}
a:hover > .yy-brand .yy-brand-mark { transform: rotate(-8deg) scale(1.04); }
.yy-brand-text {
  display: flex;
  flex-direction: column;
  line-height: 1;
  padding-left: 0.75rem;
  border-left: 1px solid #d3d5d8;
}
.yy-brand-name {
  font-size: 1.125rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: #1c1f23;
}
.yy-brand-sub {
  margin-top: 0.375rem;
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.28em;
  color: #b5863c;
}
#yy-mobile-menu .yy-brand-mark { width: 2.75rem; height: 2.75rem; }
.yy-brand--dark .yy-brand-mark {
  width: 3.75rem;
  height: 3.75rem;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.08);
}
.yy-brand--dark .yy-brand-text { border-left-color: #454a51; }
.yy-brand--dark .yy-brand-name { color: #fff; }
.yy-video-play.is-muted {
  background: rgba(255, 255, 255, 0.14);
  box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(4px);
}
.yy-video[disabled]:hover .yy-video-play.is-muted { transform: none; background: rgba(255, 255, 255, 0.14); }

/* -------------------------------------------------------------------------
   Anasayfa — Portföy galerisi (mozaik ızgara) + lightbox
   ------------------------------------------------------------------------- */
.yy-gallery {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: 160px;
  grid-auto-flow: dense;
  gap: 0.75rem;
}
@media (min-width: 768px) {
  .yy-gallery { grid-template-columns: repeat(4, 1fr); grid-auto-rows: 200px; gap: 1rem; }
}
.yy-gallery-item {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 2px;
  background: #eef0f1;
}
.yy-gallery-item.is-big  { grid-column: span 2; grid-row: span 2; }
.yy-gallery-item.is-wide { grid-column: span 2; }
.yy-gallery-item.is-tall { grid-row: span 2; }
.yy-gallery-item picture,
.yy-gallery-item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.yy-gallery-item img { transition: transform 900ms var(--yy-ease); }
.yy-gallery-item:hover img { transform: scale(1.06); }
.yy-gallery-item::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(20, 22, 26, 0.55), transparent 55%);
  opacity: 0;
  transition: opacity 400ms var(--yy-ease);
}
.yy-gallery-item:hover::after,
.yy-gallery-item:focus-visible::after { opacity: 1; }
.yy-gallery-zoom {
  position: absolute;
  right: 1rem;
  bottom: 1rem;
  z-index: 1;
  width: 2.75rem;
  height: 2.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background: #b5863c;
  color: #fff;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 400ms var(--yy-ease), transform 400ms var(--yy-ease);
}
.yy-gallery-zoom svg { width: 1.25rem; height: 1.25rem; }
.yy-gallery-item:hover .yy-gallery-zoom,
.yy-gallery-item:focus-visible .yy-gallery-zoom { opacity: 1; transform: none; }

.yy-lightbox {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4rem 1rem;
  background: rgba(20, 22, 26, 0.92);
  opacity: 0;
  visibility: hidden;
  transition: opacity 300ms var(--yy-ease), visibility 0s linear 300ms;
}
.yy-lightbox.is-open { opacity: 1; visibility: visible; transition: opacity 300ms var(--yy-ease); }
.yy-lightbox img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 2px; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5); }
.yy-lightbox button {
  position: absolute;
  width: 3rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 9999px;
  color: #fff;
  background: rgba(20, 22, 26, 0.5);
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  transition: background 200ms var(--yy-ease), border-color 200ms var(--yy-ease);
}
.yy-lightbox button:hover { background: #b5863c; border-color: #b5863c; }
.yy-lightbox-close { top: 1rem; right: 1rem; }
.yy-lightbox-prev { left: 1rem; top: 50%; margin-top: -1.5rem; }
.yy-lightbox-next { right: 1rem; top: 50%; margin-top: -1.5rem; }

/* -------------------------------------------------------------------------
   Anasayfa — Müşteri yorumları (Google İşletme profili)
   ------------------------------------------------------------------------- */
.yy-reviews {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: center;
}
@media (min-width: 1024px) {
  .yy-reviews { grid-template-columns: 5fr 7fr; gap: 5rem; }
}
.yy-reviews-office {
  position: relative;
  padding: 0 0 2.5rem 0;
}
.yy-reviews-office img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: 2px;
}
.yy-reviews-office::before {
  content: '';
  position: absolute;
  top: -1rem;
  left: -1rem;
  width: 45%;
  height: 45%;
  border-top: 2px solid #b5863c;
  border-left: 2px solid #b5863c;
}
.yy-reviews-score {
  position: absolute;
  right: -0.5rem;
  bottom: 0;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  background: #14161a;
  color: #fff;
  border-radius: 2px;
  box-shadow: 0 20px 50px rgba(20, 22, 26, 0.25);
}
@media (min-width: 1024px) { .yy-reviews-score { right: -2rem; } }
.yy-reviews-score-num { font-size: 2.75rem; font-weight: 800; line-height: 1; color: #d3ab6f; }
.yy-reviews-score-meta { display: block; margin-top: 0.25rem; font-size: 0.75rem; color: #aeb2b7; letter-spacing: 0.04em; }
.yy-stars { color: #e3a52b; letter-spacing: 0.1em; font-size: 0.95rem; }
.yy-review-list { display: grid; gap: 1rem; }
.yy-review {
  margin: 0;
  padding: 1.5rem 1.75rem;
  background: #fff;
  border: 1px solid #eef0f1;
  border-left: 3px solid #b5863c;
  border-radius: 2px;
  transition: box-shadow 300ms var(--yy-ease), transform 300ms var(--yy-ease);
}
.yy-review:hover { box-shadow: 0 14px 40px rgba(20, 22, 26, 0.08); transform: translateY(-2px); }
.yy-review-head { display: flex; align-items: center; gap: 0.875rem; margin-bottom: 0.875rem; }
.yy-review-head .yy-stars { margin-left: auto; margin-right: 0; }
[dir="rtl"] .yy-review-head .yy-stars { margin-left: 0; margin-right: auto; }
.yy-review-avatar {
  width: 2.5rem;
  height: 2.5rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background: #1c1f23;
  color: #d3ab6f;
  font-weight: 700;
}
.yy-review figcaption strong { display: block; font-size: 0.9rem; color: #1c1f23; }
.yy-review figcaption span { font-size: 0.75rem; color: #83898f; }
.yy-review blockquote { margin: 0; font-size: 1rem; line-height: 1.6; color: #454a51; }
.yy-reviews-contact {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  margin-top: 2rem;
  padding-top: 1.75rem;
  border-top: 1px solid #d3d5d8;
  font-size: 0.875rem;
  color: #454a51;
}
.yy-reviews-contact p { display: flex; align-items: center; gap: 0.5rem; margin: 0.25rem 0; }
.yy-reviews-contact svg { color: #b5863c; flex-shrink: 0; }
.yy-reviews-contact a[href^="tel"] { color: #1c1f23; font-weight: 600; }
.yy-reviews-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.875rem 1.5rem;
  background: #1c1f23;
  color: #fff;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-radius: 2px;
  transition: background 300ms var(--yy-ease);
}
.yy-reviews-btn:hover { background: #b5863c; }

/* =========================================================================
   Çok dilli QA düzeltmeleri — uzun EN/RU menü etiketleri, 1024-1279px
   header sığması ve Arapça (RTL) aynalama. tailwind.css bu dosyadan sonra
   yüklendiği için override'lar bir üst seçici özgüllüğüyle yazıldı.
   ========================================================================= */

/* Menü etiketleri iki satıra kırılmasın ("ABOUT US", "О НАС") */
.yy-nav-link { white-space: nowrap; }

/* Küçük laptop/yatay tablet: menü + dil + CTA tek satıra sığsın */
@media (min-width: 1024px) and (max-width: 1279.98px) {
  header nav.px-10 { padding-left: 1.25rem; padding-right: 1.25rem; }
  .yy-nav-list.gap-10 { gap: 1.25rem; }
  .yy-nav-link.text-sm { font-size: 0.8125rem; }
  header .yy-header-cta { display: none; }
  .yy-topbar .yy-topbar-hours { display: none; }
  /* Uzun adres (AR/RU) üst barı taşırmasın; sığmazsa "…" ile kısalsın */
  .yy-topbar .shrink-0:has(.yy-topbar-address) { flex-shrink: 1; min-width: 0; margin-inline-end: 1.5rem; }
  .yy-topbar .yy-topbar-address { display: block; overflow: hidden; text-overflow: ellipsis; }
  .yy-topbar .whitespace-nowrap:has(.yy-topbar-address) { min-width: 0; }
}

/* Süreç adımları: giriş animasyonunun transform'u adımı ayrı katman yaptığı
   için numara dairesi bağlantı çizgisinin altında kalıyordu */
.yy-process-step { z-index: 2; }

/* Hizmet detayı: "Tüm hizmetler" linki ikon kutusuyla aynı satıra düşmesin */
a.yy-back-link.inline-flex { display: flex; width: fit-content; }

/* Hero hizmet listesi: uzun etiketler (RU/EN) metin bloğuna taşmasın.
   Swiper bullet'a sabit 8px yükseklik verdiği için iki satırlı etiket
   üst üste biniyordu; yükseklik içeriğe göre olsun. */
.yy-hero-bullet.swiper-pagination-bullet { height: auto; }
.yy-hero-pagination.swiper-pagination-bullets { padding-inline: 1rem; }
.yy-hero-bullet-label { white-space: normal; max-width: 17rem; line-height: 1.3; }

/* Mobilde deneyim rozeti ve yorum çerçevesi ekran kenarına dayanmasın */
@media (max-width: 639.98px) {
  .yy-exp-badge.-right-4 { right: 0; }
  .yy-reviews-office::before { left: -0.5rem; }
  .yy-reviews-score { right: 0; }
}

/* ---- RTL (Arapça) ---------------------------------------------------- */

/* Telefon numarası ters dizilmesin: "+90 (216) ..." */
a[href^="tel:"] { direction: ltr; unicode-bidi: isolate; }

/* Yön bildiren ikonlar aynalansın; geri oku (rotate-180) RTL'de sağa baksın */
[dir="rtl"] svg[data-icon="arrow-right"],
[dir="rtl"] svg[data-icon="chevron-right"]:not(.rotate-180) { transform: scaleX(-1); }
[dir="rtl"] svg[data-icon="chevron-right"].rotate-180 { transform: none; }

[dir="rtl"] .yy-hero-textblock,
[dir="rtl"] .yy-page-hero-text {
  border-left: 0; padding-left: 0;
  border-right: 3px solid var(--yy-accent); padding-right: 1.1em;
}
[dir="rtl"] .yy-brand-text {
  padding-left: 0; border-left: 0;
  padding-right: 0.75rem; border-right: 1px solid #d3d5d8;
}
[dir="rtl"] .yy-brand--dark .yy-brand-text { border-right-color: #454a51; }

@media (min-width: 1024px) {
  [dir="rtl"] .yy-hero-swiper .lg\:pl-\[380px\] { padding-left: 2rem; padding-right: 380px; }
}

[dir="rtl"] .yy-review { border-left: 1px solid #eef0f1; border-right: 3px solid #b5863c; }
[dir="rtl"] .yy-reviews-office::before {
  left: auto; right: -1rem;
  border-left: 0; border-right: 2px solid #b5863c;
}
[dir="rtl"] .yy-reviews-score { right: auto; left: -0.5rem; }
@media (min-width: 1024px) { [dir="rtl"] .yy-reviews-score { left: -2rem; } }
@media (max-width: 639.98px) {
  [dir="rtl"] .yy-reviews-office::before { right: -0.5rem; }
  [dir="rtl"] .yy-reviews-score { left: 0; }
}

/* Tailwind fiziksel yön sınıflarının RTL karşılıkları */
[dir="rtl"] .border-l-2 { border-left-width: 0; border-right-width: 2px; }
[dir="rtl"] .pl-4 { padding-left: 0; padding-right: 1rem; }
[dir="rtl"] .left-4 { left: auto; right: 1rem; }
[dir="rtl"] .right-6 { right: auto; left: 1.5rem; }
[dir="rtl"] .-left-4 { left: auto; right: -1rem; }
[dir="rtl"] .-right-4 { right: auto; left: -1rem; }
@media (min-width: 640px) { [dir="rtl"] .sm\:-right-6 { left: -1.5rem; } }
@media (max-width: 639.98px) { [dir="rtl"] .yy-exp-badge.-right-4 { left: 0; } }
[dir="rtl"] .yy-video-play svg { margin-left: 0; margin-right: 3px; }
.yy-review-note { margin-top: 0.5rem; font-size: 0.7rem; color: #8a8f96; letter-spacing: 0.02em; }
/* RTL: dil menüsü sayfanın sol dışına taşmasın, içe doğru açılsın */
[dir="rtl"] .yy-dropdown.right-0 { right: auto; left: 0; }

/* -------------------------------------------------------------------------
   Blog yazı detay sayfası — makale tipografisi, meta satırı, SSS
   ------------------------------------------------------------------------- */
.yy-article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem .75rem;
  font-size: .8125rem;
  color: var(--yy-300);
}
.yy-article {
  color: var(--yy-600);
  font-size: 1.0625rem;
  line-height: 1.8;
}
.yy-article > * + * { margin-top: 1.15em; }
.yy-article > p:first-child {
  font-size: 1.1875rem;
  line-height: 1.7;
  color: var(--yy-800);
}
.yy-article h2 {
  margin-top: 2.2em;
  font-size: 1.5rem;
  line-height: 1.3;
  font-weight: 700;
  color: var(--yy-950);
}
.yy-article h3 {
  margin-top: 1.7em;
  font-size: 1.1875rem;
  line-height: 1.4;
  font-weight: 600;
  color: var(--yy-900);
}
.yy-article h2 + *, .yy-article h3 + * { margin-top: .6em; }
.yy-article ul, .yy-article ol { padding-inline-start: 1.35em; }
.yy-article ul { list-style: disc; }
.yy-article ol { list-style: decimal; }
.yy-article li + li { margin-top: .45em; }
.yy-article li::marker { color: var(--yy-accent); }
.yy-article strong { color: var(--yy-900); font-weight: 600; }
.yy-article a {
  color: var(--yy-accent-dark);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
.yy-article a:hover { color: var(--yy-accent); }
.yy-faq details {
  border-top: 1px solid var(--yy-200);
  padding: 1rem 0;
}
.yy-faq details:last-child { border-bottom: 1px solid var(--yy-200); }
.yy-faq summary {
  cursor: pointer;
  font-weight: 600;
  color: var(--yy-900);
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}
.yy-faq summary::-webkit-details-marker { display: none; }
.yy-faq summary::after { content: "+"; color: var(--yy-accent); font-weight: 700; }
.yy-faq details[open] summary::after { content: "–"; }
.yy-faq details p {
  margin-top: .6rem;
  font-size: .9375rem;
  line-height: 1.7;
  color: var(--yy-600);
}
@media (max-width: 640px) {
  .yy-article { font-size: 1rem; }
  .yy-article h2 { font-size: 1.3125rem; }
}