/**
 * İzo Anadolu — UI (layout, kartlar, header, detay sayfaları)
 */

html {
  overflow-x: clip;
  scroll-behavior: smooth;
}

body {
  overflow-x: clip;
  max-width: 100vw;
  letter-spacing: -0.01em;
  background: hsl(var(--background)) !important;
}

#root {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  overflow-x: clip;
  overflow-y: visible;
}

img, video {
  max-width: 100%;
  height: auto;
}

/* ========== HEADER — kaydırma sıçraması azaltma ========== */
header {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  will-change: auto;
}

header > div:first-child {
  transition: background-color 0.2s ease, backdrop-filter 0.2s ease !important;
}

header nav div[class*="absolute"][class*="top-full"],
header nav div.absolute[class*="w-["],
header nav div.absolute[class*="translate-x"],
header [class*="group-hover"][class*="shadow"] {
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: hsl(var(--card)) !important;
  border: 1px solid hsl(var(--border) / 0.9) !important;
  border-radius: 12px !important;
}

header nav a,
header nav button {
  font-weight: 500 !important;
}

header div[class*="grid"] > a:hover {
  background: hsl(var(--background)) !important;
  transform: none !important;
  box-shadow: none !important;
}

header div[class*="fixed"][class*="inset-0"],
header div[class*="fixed"][class*="top-0"][class*="right-0"] {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background: hsl(var(--card)) !important;
}

/* ========== Layout — içerik max 1300px, ortalanmış ========== */
.container-custom {
  width: 100% !important;
  max-width: 1300px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}

@media (min-width: 640px) {
  .container-custom {
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
  }
}

@media (min-width: 1024px) {
  .container-custom {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
  }
}

@media (max-width: 1023px) {
  header > div[class*="lg:hidden"] {
    margin-left: 0.5rem !important;
    margin-right: 0.5rem !important;
  }
}

section {
  scroll-margin-top: 88px;
}

@media (max-width: 767px) {
  .section-padding {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }
}

.grid {
  align-items: stretch;
}

/* Kart gölgeleri kaldır */
[class*="shadow-["],
[class*="shadow-lg"],
[class*="shadow-xl"],
[class*="shadow-2xl"],
.card-premium,
.bg-card.rounded-2xl,
.bg-card.rounded-3xl,
a.bg-card,
.group.bg-card {
  box-shadow: none !important;
}

.group.bg-card:hover,
a.bg-card:hover {
  transform: none !important;
}

/* Kesik köşeli kart — “Tüm hizmetleri keşfedin” stili */
.izo-card-cut,
#root a.bg-card.rounded-xl.border,
#root a.bg-card.rounded-2xl.border,
#root .group.bg-card.rounded-2xl.border,
#root .group.bg-card.rounded-3xl.border,
#root article.bg-card {
  position: relative;
  border-radius: 12px !important;
  border: 1px solid hsl(var(--border) / 0.5) !important;
  background: #fff !important;
  box-shadow: none !important;
  overflow: visible;
}

.izo-card-cut::before,
#root a.bg-card.rounded-xl.border::before,
#root a.bg-card.rounded-2xl.border::before,
#root .group.bg-card.rounded-2xl.border::before,
#root .group.bg-card.rounded-3xl.border::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  border-top-left-radius: 15px;
  box-shadow: inset -15px -15px 0 0 #fff;
  pointer-events: none;
  z-index: 2;
}

.dark .izo-card-cut,
.dark #root a.bg-card.rounded-xl.border,
.dark #root a.bg-card.rounded-2xl.border,
.dark #root .group.bg-card.rounded-2xl.border,
.dark #root .group.bg-card.rounded-3xl.border {
  background: hsl(var(--card)) !important;
}

.dark .izo-card-cut::before,
.dark #root a.bg-card.rounded-xl.border::before,
.dark #root a.bg-card.rounded-2xl.border::before,
.dark #root .group.bg-card.rounded-2xl.border::before,
.dark #root .group.bg-card.rounded-3xl.border::before {
  box-shadow: inset -15px -15px 0 0 hsl(var(--card));
}

/* Butonlar */
button[class*="rounded-full"]:not([class*="w-"]):not([class*="h-"]),
a[class*="bg-primary"][class*="rounded-full"] {
  border-radius: 10px !important;
}

button[class*="bg-primary"],
a[class*="bg-primary"],
.btn-primary {
  box-shadow: none !important;
  font-weight: 600 !important;
  border-radius: 10px !important;
}

button[class*="bg-primary"]:hover,
a[class*="bg-primary"]:hover {
  transform: none !important;
  filter: brightness(1.05);
}

h1, h2, h3, h4 {
  letter-spacing: -0.02em;
  line-height: 1.25;
}

footer {
  border-top: 1px solid hsl(var(--border) / 0.6);
}

input, textarea, select {
  border-radius: 8px !important;
  box-shadow: none !important;
}

/* ========== Detay — sol geniş + sağ sticky sidebar ========== */
.izo-detail-grid,
.izo-service-grid,
.container-custom.py-12 > div:has(> .space-y-12):has(> .lg\:sticky) {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.5rem;
  align-items: start;
  width: 100%;
}

@media (min-width: 1024px) {
  .izo-detail-grid,
  .izo-service-grid,
  .container-custom.py-12 > div:has(> .space-y-12):has(> .lg\:sticky) {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
    gap: 2rem;
  }
}

.izo-detail-main,
.izo-service-main,
.container-custom.py-12 > div:has(> .space-y-12) > .space-y-12 {
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  grid-column: 1;
}

.izo-detail-aside,
.izo-service-aside,
.container-custom.py-12 > div:has(> .space-y-12) > .space-y-5.lg\:sticky,
.container-custom.py-12 > div:has(> .space-y-12) > [class*="lg:sticky"] {
  grid-column: 1;
  width: 100%;
  max-width: 100%;
  position: sticky !important;
  top: 5rem !important;
  align-self: start;
  z-index: 5;
  order: -1;
}

.izo-detail-main,
.izo-service-main,
.container-custom.py-12 > div:has(> .space-y-12) > .space-y-12 {
  order: 2;
}

@media (min-width: 1024px) {
  .izo-detail-main,
  .izo-service-main,
  .container-custom.py-12 > div:has(> .space-y-12) > .space-y-12 {
    order: 0;
  }

  .izo-detail-aside,
  .izo-service-aside,
  .container-custom.py-12 > div:has(> .space-y-12) > .space-y-5.lg\:sticky,
  .container-custom.py-12 > div:has(> .space-y-12) > [class*="lg:sticky"] {
    order: 0;
    grid-column: 2;
    grid-row: 1;
    top: 6rem !important;
  }
}

/* İçerik panelleri */
.izo-detail-main > [class*="order-"]:not(.order-11),
.izo-service-main > [class*="order-"]:not(.order-11),
.container-custom.py-12 .space-y-12 > [class*="order-"]:not(.order-11) {
  background: linear-gradient(135deg, #ffffff 0%, #f1f5f9 100%);
  border: 1px solid rgb(231 231 231 / 36%);
  border-radius: 16px;
  padding: 1.35rem 1.5rem;
  box-shadow: none !important;
}

.dark .izo-detail-main > [class*="order-"]:not(.order-11),
.dark .izo-service-main > [class*="order-"]:not(.order-11),
.dark .container-custom.py-12 .space-y-12 > [class*="order-"]:not(.order-11) {
  background: linear-gradient(135deg, hsl(var(--card)) 0%, hsl(var(--background)) 100%);
  border-color: hsl(var(--border) / 0.45);
}

.izo-detail-main > .order-11,
.izo-service-main > .order-11,
.container-custom.py-12 .space-y-12 > .order-11 {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  box-shadow: none !important;
}

.izo-detail-aside > div,
.izo-service-aside > div,
.container-custom.py-12 .space-y-5.lg\:sticky > div {
  background: linear-gradient(135deg, #ffffff 0%, #f1f5f9 100%) !important;
  border: 1px solid rgb(231 231 231 / 36%) !important;
  box-shadow: none !important;
}

.dark .izo-detail-aside > div,
.dark .izo-service-aside > div,
.dark .container-custom.py-12 .space-y-5.lg\:sticky > div {
  background: linear-gradient(135deg, hsl(var(--card)) 0%, hsl(var(--background)) 100%) !important;
  border-color: hsl(var(--border) / 0.45) !important;
}

.izo-detail-aside .gradient-dark,
.izo-service-aside .gradient-dark,
.container-custom.py-12 .space-y-5.lg\:sticky .gradient-dark {
  border-radius: 0 !important;
}

.izo-detail-main .hidden.md\:block,
.izo-service-main .hidden.md\:block,
.container-custom.py-12 .space-y-12 .hidden.md\:block {
  border-radius: 12px;
  overflow: hidden;
}

.izo-detail-main > .order-12,
.izo-service-main > .order-12,
.container-custom.py-12 .space-y-12 > .order-12 {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}

.izo-detail-main > .order-12 > a,
.izo-detail-main > .order-12 > div,
.izo-service-main > .order-12 > a,
.izo-service-main > .order-12 > div,
.container-custom.py-12 .space-y-12 > .order-12 > a,
.container-custom.py-12 .space-y-12 > .order-12 > div {
  background: linear-gradient(135deg, #ffffff 0%, #f1f5f9 100%) !important;
  border: 1px solid rgb(231 231 231 / 36%) !important;
  box-shadow: none !important;
}

/* Hero ve üst bantlar — aynı 1300px çerçeve */
#root section.relative.overflow-hidden .container-custom,
#root section.pt-10 .container-custom {
  max-width: 1300px !important;
}

/* ========== Site genişliği — header, hero ve bantlar aynı hizada ========== */
:root {
  --izo-site-max: 1300px;
  --izo-site-x: 1rem;
  --izo-panel-radius: 1.25rem;
  --izo-panel-radius-lg: 1.5rem;
}

@media (max-width: 639px) {
  :root {
    --izo-site-x: 0.5rem;
  }
}

@media (min-width: 640px) {
  :root {
    --izo-site-x: 1rem;
  }
}

@media (min-width: 1024px) {
  :root {
    --izo-site-x: 1.5rem;
    --izo-panel-radius-lg: 1.65rem;
  }
}

/* Header iç satırları — container ile aynı genişlik */
header > div > div[class*="px-8"],
header nav > div[class*="px-8"],
header > div[class*="lg:hidden"][class*="mx-"] {
  max-width: var(--izo-site-max) !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--izo-site-x) !important;
  padding-right: var(--izo-site-x) !important;
  box-sizing: border-box;
}

@media (max-width: 1023px) {
  header > div[class*="lg:hidden"] {
    margin-left: auto !important;
    margin-right: auto !important;
    width: min(var(--izo-site-max), calc(100% - (var(--izo-site-x) * 2))) !important;
  }
}

/* Ana sayfa slider / hero — tam genişlik (orijinal) */
#root section[class*="h-[85vh]"][class*="min-h-[600px]"] {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

#root section[class*="h-[85vh]"] > div[class*="absolute"],
#root section[class*="h-[85vh]"] img {
  border-radius: 0 !important;
}

/* Koyu / birincil / açık şeritler — aynı genişlik, dikey boşluk azaltıldı */
#root section.relative.overflow-hidden > div.bg-secondary[class*="py-"],
#root section.relative.overflow-hidden > div.bg-primary[class*="py-"],
#root section.relative.overflow-hidden > div.bg-background[class*="py-16"],
#root section.relative.overflow-hidden > div.bg-background[class*="py-24"] {
  width: min(var(--izo-site-max), calc(100% - (var(--izo-site-x) * 2))) !important;
  max-width: var(--izo-site-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0.35rem !important;
  margin-bottom: 0.35rem !important;
  padding-top: 2.75rem !important;
  padding-bottom: 2.75rem !important;
  border-radius: var(--izo-panel-radius-lg) !important;
  overflow: hidden !important;
  box-sizing: border-box;
}

@media (min-width: 768px) {
  #root section.relative.overflow-hidden > div.bg-secondary[class*="py-28"],
  #root section.relative.overflow-hidden > div.bg-primary[class*="py-28"] {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }

  #root section.relative.overflow-hidden > div.bg-background[class*="py-16"],
  #root section.relative.overflow-hidden > div.bg-background[class*="py-24"] {
    padding-top: 2.5rem !important;
    padding-bottom: 2.5rem !important;
  }
}

#root section.relative.overflow-hidden:has(> div.bg-secondary),
#root section.relative.overflow-hidden:has(> div.bg-primary),
#root section.relative.overflow-hidden:has(> div.bg-background[class*="py-16"]) {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Footer üst CTA — aynı genişlik */
#root footer > div.relative.bg-primary {
  width: min(var(--izo-site-max), calc(100% - (var(--izo-site-x) * 2))) !important;
  max-width: var(--izo-site-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0.5rem !important;
  margin-bottom: 0 !important;
  border-radius: var(--izo-panel-radius-lg) !important;
  overflow: hidden !important;
  box-sizing: border-box;
}

/* İletişim ve iç sayfa hero (container içi görsel kutusu) */
#root section.relative.overflow-hidden:has(.container-custom [class*="rounded-2xl"]) {
  padding-left: var(--izo-site-x) !important;
  padding-right: var(--izo-site-x) !important;
  padding-top: 0.5rem !important;
  padding-bottom: 0 !important;
  box-sizing: border-box;
}

#root section.relative.overflow-hidden .container-custom > div[class*="rounded-2xl"],
#root section.relative.overflow-hidden .container-custom > div[class*="rounded-3xl"],
#root section.pt-10 .container-custom > div[class*="rounded-2xl"],
#root section.pt-10 .container-custom > div[class*="rounded-3xl"],
#root section[class*="pt-4"] .container-custom > div[class*="rounded-2xl"],
#root section[class*="pt-4"] .container-custom > div[class*="rounded-3xl"] {
  border-radius: var(--izo-panel-radius-lg) !important;
  overflow: hidden !important;
  width: 100%;
}

#root section.relative.overflow-hidden .container-custom > div[class*="rounded-2xl"] > .absolute,
#root section.relative.overflow-hidden .container-custom > div[class*="rounded-2xl"] img,
#root section.relative.overflow-hidden .container-custom > div[class*="rounded-3xl"] > .absolute,
#root section.relative.overflow-hidden .container-custom > div[class*="rounded-3xl"] img {
  border-radius: inherit !important;
}

/* İletişim formu / kart alanı — container ile hizalı */
#root section.section-padding .container-custom {
  width: min(var(--izo-site-max), calc(100% - (var(--izo-site-x) * 2))) !important;
  max-width: var(--izo-site-max) !important;
}

/* ========== Referanslar bandı (py-8 bg-card) ========== */
#root section.izo-refs-section,
#root section[class*="py-8"][class*="bg-card"][class*="border-y"] {
  padding: 0 !important;
  margin-top: 0.75rem !important;
  margin-bottom: 0.5rem !important;
  border: none !important;
  background: transparent !important;
  overflow: visible !important;
}

#root section.izo-refs-section .container-custom,
#root section[class*="py-8"][class*="bg-card"][class*="border-y"] .container-custom {
  width: min(var(--izo-site-max), calc(100% - (var(--izo-site-x) * 2))) !important;
  max-width: var(--izo-site-max) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.izo-refs-panel {
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border) / 0.55);
  border-radius: var(--izo-panel-radius-lg);
  overflow: hidden;
  padding: 1rem 0 1.1rem;
}

.izo-refs-label {
  text-align: center;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: hsl(var(--primary));
  margin: 0 0 0.85rem;
}

.izo-refs-viewport {
  overflow: hidden;
  width: 100%;
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}

.izo-refs-track {
  display: flex;
  align-items: center;
  gap: 2.5rem;
  width: max-content;
  animation: izo-refs-marquee 38s linear infinite;
  padding: 0.25rem 1rem;
}

.izo-refs-track:hover {
  animation-play-state: paused;
}

.izo-refs-item {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 120px;
  height: 52px;
  padding: 0.35rem 1rem;
  border-radius: 10px;
  background: hsl(var(--background));
  border: 1px solid hsl(var(--border) / 0.45);
  transition: border-color 0.2s ease;
}

.izo-refs-item:hover {
  border-color: hsl(var(--primary) / 0.45);
}

.izo-refs-item img {
  max-height: 40px;
  max-width: 120px;
  width: auto;
  object-fit: contain;
  filter: grayscale(0.15);
}

@keyframes izo-refs-marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

/* ========== Projeler önizleme (section-padding-sm) ========== */
#root section.section-padding-sm {
  padding-top: 2.75rem !important;
  padding-bottom: 2.75rem !important;
  overflow: visible !important;
}

#root section.section-padding-sm .container-custom {
  width: 100% !important;
  max-width: var(--izo-site-max) !important;
  padding-left: var(--izo-site-x) !important;
  padding-right: var(--izo-site-x) !important;
}

#root section.section-padding-sm .grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 1.25rem !important;
  align-items: stretch !important;
}

@media (min-width: 768px) {
  #root section.section-padding-sm .grid[class*="md:grid-cols-2"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1.35rem !important;
  }
}

@media (min-width: 1024px) {
  #root section.section-padding-sm .grid[class*="lg:grid-cols-3"] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1.5rem !important;
  }
}

#root section.section-padding-sm .grid > * {
  min-width: 0 !important;
  position: relative !important;
  z-index: 1 !important;
  isolation: isolate;
}

#root section.section-padding-sm .grid a.group {
  display: block !important;
  height: 100% !important;
  transform: none !important;
}

#root section.section-padding-sm .grid a.group:hover {
  transform: none !important;
}

#root section.section-padding-sm .flex.flex-wrap.gap-2 {
  gap: 0.5rem !important;
  margin-bottom: 1rem !important;
}

/* ========== SSS — mobilde iç içe geçme düzeltmesi (yalnızca 1fr/1.5fr grid) ========== */
#root section.section-padding.bg-background .grid[class*="lg:grid-cols-[1fr"] {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 1.75rem !important;
  align-items: start !important;
}

@media (min-width: 1024px) {
  #root section.section-padding.bg-background .grid[class*="lg:grid-cols-[1fr"] {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr) !important;
    gap: 3rem !important;
  }
}

@media (max-width: 1023px) {
  #root section.section-padding.bg-background .grid[class*="lg:grid-cols-[1fr"] .lg\:sticky,
  #root section.section-padding.bg-background .grid[class*="lg:grid-cols-[1fr"] [class*="lg:sticky"] {
    position: relative !important;
    top: auto !important;
    margin-bottom: 0.5rem !important;
  }
}

#root section.section-padding.bg-background .grid[class*="lg:grid-cols-[1fr"] .space-y-3 > * {
  position: relative;
  z-index: 1;
}

#root section.section-padding.bg-background .grid[class*="lg:grid-cols-[1fr"] button.rounded-2xl {
  position: relative;
  z-index: 2;
}

#root section.section-padding.bg-background .grid[class*="lg:grid-cols-[1fr"] [class*="max-h-0"] {
  max-height: 0 !important;
}

#root section.section-padding.bg-background .grid[class*="lg:grid-cols-[1fr"] [class*="max-h-40"] {
  max-height: 28rem !important;
}

/* Genel mobil — taşma ve kart çakışması */
@media (max-width: 767px) {
  #root .container-custom {
    padding-left: var(--izo-site-x) !important;
    padding-right: var(--izo-site-x) !important;
  }

  #root .grid > * {
    min-width: 0;
  }

  #root [class*="hover:-translate-y"] {
    transform: none !important;
  }

  #root .section-padding {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }
}

/* Logo / favicon */
.izo-brand-icon,
img[src*="favicon.png"] {
  filter: brightness(0);
}

.dark .izo-brand-icon,
.dark img[src*="favicon.png"] {
  filter: brightness(0) invert(1);
}