:root {
  --color-primary: #2563eb;
  --color-primary-hover: #1d4ed8;
  --color-primary-text: #1e40af;
  --color-green: #10b981;
  
  --color-text: #0f172a;
  --color-text-muted: #64748b;
  --color-border: #e5e7eb;
  --color-white: #ffffff;
  
  --page-bg-top: #ffffff;
  --page-bg-mid: #f9fafb;
  --page-bg-low: #f9fafb;
  --page-bg-floor: #f9fafb;
  --page-glow-indigo: rgba(99, 102, 241, 0.12);
  --page-glow-sky: rgba(14, 165, 233, 0.08);
  --page-glow-violet: rgba(139, 92, 246, 0.06);
  
  --flow-surface: #f9fafb;
  
  --site-flow-solid-bg: #f9fafb;
  /* Ana sayfa: Yetenekler, Blog, Yorumlar, SSS bantları */
  --home-band-muted-bg: #f3f4f6;
  
  --blog-section-bg: var(--site-flow-solid-bg);
  
  --content-max-width: 80rem;
  --flow-overlap-pull: -40px;
  --flow-radius-top: 32px;
  --ekstre-shift-x: -8px;
  --shadow-header: 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-card: 0 4px 6px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
  --shadow-image: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --radius: 8px;
  --radius-lg: 12px;
  --radius-card: 14px;
  --ekstre-scale: 0.70;
  
  --hero-building-photo: url("medya/login2.png");
}

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.skip-link {
  position: absolute;
  top: -100px;
  left: 0;
  z-index: 10001;
  padding: 0.65rem 1.1rem;
  background: #0f172a;
  color: #fff;
  font-weight: 600;
  font-size: 0.9375rem;
  border-radius: 0 0 10px 0;
  text-decoration: none;
  transition: top 0.18s ease;
}
.skip-link:focus {
  top: max(0.5rem, env(safe-area-inset-top, 0px));
  left: max(0.5rem, env(safe-area-inset-left, 0px));
  outline: 2px solid #60a5fa;
  outline-offset: 2px;
}

.site-main {
  display: block;
  min-width: 0;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
  font-family: var(--font-sans);
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  
  background-color: var(--site-flow-solid-bg);
}

button,
input,
select,
textarea {
  font-family: inherit;
}

body {
  font-family: var(--font-sans);
  color: var(--color-text);
  background-color: var(--site-flow-solid-bg);
  background-image: none;
  line-height: 1.6;
  min-height: 100vh;
  overflow-x: hidden;
}

.banks {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

a {
  color: inherit;
  text-decoration: none;
}

.cta-arrow {
  display: inline-block;
  font-size: 1.35em;
  line-height: 1;
  margin-left: 0.1em;
}

.btn.btn-lg,
.banks-cta,
.sms-cta {
  font-family: var(--font-sans);
  font-size: 1rem;
  font-weight: 600;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  font-family: var(--font-sans);
  font-size: 0.9375rem;
  font-weight: 500;
  padding: 0.5rem 1rem;
  border-radius: var(--radius);
  border: 1px solid transparent;
  cursor: pointer;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.btn .fa-solid {
  font-size: 1em;
  line-height: 1;
}

.btn-ghost {
  background: var(--color-white);
  color: var(--color-primary-text);
  border: 1px solid #d1d5db;
}

.btn-ghost:hover {
  background: #f9fafb;
  border-color: #d1d5db;
}

.btn-primary {
  background: var(--color-primary);
  color: var(--color-white);
}

.btn-primary:hover {
  background: var(--color-primary-hover);
}

.btn-secondary {
  background: var(--color-white);
  color: var(--color-text);
  border: 1px solid var(--color-border);
}

.btn-secondary:hover {
  background: #f9fafb;
  border-color: #d1d5db;
}

.btn-lg {
  padding: 0.75rem 1.5rem;
  font-size: 1rem;
  font-weight: 600;
}

.features {
  position: relative;
  padding: clamp(2.5rem, 5.5vw, 4.25rem) max(1.5rem, env(safe-area-inset-left, 0px)) clamp(2.75rem, 6.5vw, 5rem) max(1.5rem, env(safe-area-inset-right, 0px));
  overflow: hidden;
  
  background-color: var(--site-flow-solid-bg);
  background-image: none;
}

.features::before,
.features::after {
  content: none;
}

.features .features-deco-wave,
.features .features-deco-dots-br {
  display: none;
}

.features-deco {
  position: absolute;
  z-index: 0;
  pointer-events: none;
}

.features-deco-wave {
  width: 280px;
  height: 400px;
  background: linear-gradient(135deg, rgba(147, 197, 253, 0.35) 0%, rgba(196, 181, 253, 0.25) 100%);
  border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;
  filter: blur(40px);
}

.features-deco-left { left: -80px; top: 10%; }
.features-deco-right { right: -80px; bottom: 10%; transform: scaleX(-1); }

.features-deco-dots {
  width: 120px;
  height: 120px;
  background-image: radial-gradient(circle, rgba(251, 191, 36, 0.4) 2px, transparent 2px);
  background-size: 12px 12px;
  opacity: 0.6;
}

.features-deco-dots-tl { left: 5%; top: 5%; }
.features-deco-dots-br { right: 5%; bottom: 15%; }

.features-inner {
  position: relative;
  z-index: 2;
  max-width: 1200px;
  margin: 0 auto;
}

.features-cards-carousel-wrap {
  margin: 0;
  padding: 0;
}

.features-header {
  text-align: center;
  max-width: 56rem;
  margin: 0 auto clamp(2.75rem, 5.5vw, 4.5rem);
}

.features-slider {
  display: flex;
  align-items: center;
  gap: 20px;
  max-width: 1200px;
  margin: 0 auto;
}

.features-slider:focus-visible {
  outline: 2px solid rgba(37, 99, 235, 0.5);
  outline-offset: 6px;
  border-radius: 16px;
}

.features-slides {
  flex: 1;
  overflow: hidden;
  min-width: 0;
}

.features-slide {
  display: none;
  width: 100%;
}

.features-slide.active {
  display: block;
}

.features-strip {
  display: contents;
}

.features-arrow {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: #fff;
  color: #374151;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  transition: background 0.2s, transform 0.2s;
}

.features-arrow:hover {
  background: #f9fafb;
  transform: scale(1.05);
}

.features-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 28px;
}

.features-desktop-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 1200px;
  margin-top: 18px;
  margin-left: auto;
  margin-right: auto;
  padding-inline: max(0.5rem, env(safe-area-inset-left, 0px)) max(0.5rem, env(safe-area-inset-right, 0px));
  box-sizing: border-box;
}

@media (min-width: 901px) {
  .features-desktop-viewport {
    display: block;
    overflow: hidden;
    border-radius: 16px;
  }

  
  .features .features-cards-stack.features-grid {
    display: flex !important;
    flex-wrap: nowrap;
    gap: 24px;
    will-change: transform;
    transform: translate3d(0, 0, 0);
    transition: transform 380ms ease;
    padding: 0.15rem 0.15rem 0.25rem;
    box-sizing: border-box;
    grid-template-columns: none;
  }

  .features-cards-stack .features-card-item {
    display: grid;
    flex: 0 0 calc((100% - (24px * 3)) / 4);
    min-width: 0;
  }

  .features-desktop-arrows {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
  }

  .features-desktop-arrow {
    width: 44px;
    height: 44px;
    border-radius: 9999px;
    border: 1px solid rgba(226, 232, 240, 0.95);
    background: rgba(255, 255, 255, 0.9);
    color: #374151;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
    transition: transform 0.18s ease, background 0.18s ease, opacity 0.18s ease;
    flex-shrink: 0;
  }

  .features-desktop-arrow:hover {
    transform: translateY(-1px);
    background: #ffffff;
  }

  .features-desktop-arrow:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    transform: none;
  }
}

@media (max-width: 900px) {
  .features-desktop-arrows {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
  }

  .features-desktop-arrow {
    width: 44px;
    height: 44px;
    border-radius: 9999px;
    border: 1px solid rgba(226, 232, 240, 0.95);
    background: rgba(255, 255, 255, 0.9);
    color: #374151;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
    transition: transform 0.18s ease, background 0.18s ease, opacity 0.18s ease;
  }

  .features-desktop-arrow:hover {
    transform: translateY(-1px);
    background: #ffffff;
  }

  .features-desktop-arrow:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    transform: none;
  }
}

.features-desktop-viewport {
  display: contents;
}

.features-dot {
  width: 8px;
  height: 8px;
  border-radius: 9999px;
  border: none;
  background: #d1d5db;
  cursor: pointer;
  padding: 0;
  transition: background 0.2s, width 0.2s;
}

.features-dot.active {
  width: 28px;
  background: #2563eb;
}

@media (max-width: 900px) {
  .features-dot {
    width: 38px;
    height: 38px;
    padding: 0;
    background: transparent !important;
    position: relative;
    flex-shrink: 0;
    border-radius: 9999px;
    touch-action: manipulation;
  }

  .features-dot::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    border-radius: 9999px;
    background: #d1d5db;
    transition: width 0.2s, background 0.2s;
  }

  .features-dot.active::before {
    width: 28px;
    height: 8px;
    border-radius: 9999px;
    background: #2563eb;
  }
}

.features-cards-wrap {
  margin-top: clamp(1.35rem, 3vw, 2rem);
  padding-top: 0;
  border-top: none;
  text-align: center;
}

.features-cards-wrap .features-videos-viewport {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

.features-cards-wrap .features-videos-controls {
  justify-content: flex-end;
}

.features-cards-wrap .features-videos-arrows {
  justify-content: flex-end;
}

@media (min-width: 901px) {
  .features-cards-wrap .features-videos-track--quad {
    padding: 0.25rem 0.15rem 0.35rem;
    gap: 22px 20px;
  }
}

.features-videos {
  margin-top: clamp(1.35rem, 3vw, 2rem);
  padding-top: 0;
  border-top: none;
  text-align: center;
}

.features-videos-slider {
  display: block;
  align-items: stretch;
  gap: 12px 16px;
  max-width: 100%;
  margin: 0 auto;
}

#ozellikler .features-videos-slider:focus-visible {
  outline: 2px solid rgba(37, 99, 235, 0.45);
  outline-offset: 3px;
  border-radius: 0;
}

.features-videos-arrow {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  min-height: 44px;
  border-radius: 9999px;
  border: 1px solid rgba(226, 232, 240, 0.95);
  background: rgba(255, 255, 255, 0.9);
  color: #374151;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
  transition: transform 0.18s ease, background 0.18s ease, opacity 0.18s ease;
  align-self: center;
}

.features-videos-arrow:hover {
  transform: translateY(-1px);
  background: #ffffff;
}

.features-videos-arrow:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  transform: none;
}

.features-videos-viewport {
  min-width: 0;
  overflow: visible;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.features-videos-track--quad {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 28px 24px;
  justify-content: center;
  align-items: stretch;
  padding: 0.15rem 0 0;
  overflow: visible;
}

.features-videos-item {
  flex: 1 1 calc(25% - 18px);
  min-width: min(100%, 11.5rem);
  max-width: 100%;
  scroll-margin-top: 6rem;
  scroll-margin-bottom: 1rem;
}

@media (max-width: 899px) {
  .features-videos-item {
    flex: 1 1 calc(50% - 12px);
    min-width: calc(50% - 12px);
    max-width: calc(50% - 12px);
  }
}

.features-videos-item.is-fv-focus {
  outline: none;
  outline-offset: 0;
}

.features-videos .akademi-video-card,
.features-videos-card {
  height: 100%;
  text-align: left;
  text-decoration: none;
  background: #fff;
}

.features-videos-controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  max-width: 1200px;
  margin-top: 18px;
  margin-left: auto;
  margin-right: auto;
  padding-inline: max(0.5rem, env(safe-area-inset-left, 0px)) max(0.5rem, env(safe-area-inset-right, 0px));
  box-sizing: border-box;
}

.features-videos-arrows {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

@media (min-width: 901px) {
  .features-videos-viewport {
    display: block;
    overflow: hidden;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .features-videos-track--quad {
    flex-wrap: nowrap;
    justify-content: flex-start;
    will-change: transform;
    transform: translate3d(0, 0, 0);
    transition: transform 380ms ease;
    padding: 0.15rem 0.15rem 0.25rem;
    box-sizing: border-box;
  }

  .features-videos-item {
    flex: 0 0 calc((100% - (24px * 3)) / 4);
    min-width: 0;
  }
}

@media (max-width: 767px) {
  .features-videos-slider {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px 12px;
  }
}

@media (max-width: 520px) {
  .features-videos-item {
    flex: 1 1 100%;
    min-width: 100%;
    max-width: 100%;
  }

  .features-videos-slider {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .features-videos-track--quad {
    display: block;
    gap: 0;
  }

  
  .features-videos-item {
    display: none;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
  }

  .features-videos-item.is-fv-focus {
    display: block;
  }

  .features-videos .akademi-video-body {
    padding: 0.85rem 0.95rem 1rem;
  }

  .features-videos .akademi-video-title {
    font-size: 0.98rem;
    line-height: 1.32;
  }

  .features-videos .akademi-video-desc {
    font-size: 0.8125rem;
    line-height: 1.48;
  }

}

.features-title {
  font-size: clamp(1.625rem, 4vw, 1.875rem);
  font-weight: 700;
  color: var(--color-text);
  margin-bottom: 1rem;
  letter-spacing: -0.025em;
  line-height: 1.2;
}

.features-subtitle {
  font-size: clamp(0.9375rem, 0.35vw + 0.88rem, 1.125rem);
  color: #4b5563;
  line-height: 1.65;
  max-width: 48rem;
  margin-left: auto;
  margin-right: auto;
  text-wrap: balance;
}

.features-band-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow:
    0 4px 22px rgba(15, 23, 42, 0.07),
    0 1px 3px rgba(15, 23, 42, 0.04);
  transition: box-shadow 0.22s ease, transform 0.22s ease;
  text-align: center;
}

.features-band-card:hover {
  box-shadow:
    0 12px 32px rgba(15, 23, 42, 0.1),
    0 4px 10px rgba(37, 99, 235, 0.08);
  transform: translateY(-3px);
}

.features-band-card-head {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(1.35rem, 3.2vw, 2.15rem) 1.25rem 0.85rem;
  background: #fff;
}

.features-band-card-head .feature-icon {
  margin: 0;
  width: 56px;
  height: 56px;
  border-radius: 14px;
}

.features-band-card-head .feature-icon .fa-solid {
  font-size: 1.35rem;
}

.features-band-card-body {
  padding: 0.4rem 1.35rem clamp(1.35rem, 3vw, 2rem);
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  gap: 0.55rem;
  text-align: center;
}

.features-cards-wrap .features-band-card-body .features-desc-title {
  font-size: clamp(0.98rem, 1.1vw, 1.08rem);
  font-weight: 700;
  color: #111827;
  line-height: 1.38;
  margin: 0;
  text-align: center;
  text-wrap: balance;
  letter-spacing: -0.02em;
}

.features-cards-wrap .features-band-card-body .features-desc-p {
  font-size: 0.875rem;
  color: #666666;
  line-height: 1.62;
  margin: 0;
  flex: 1;
  text-align: center;
  text-wrap: balance;
  max-width: 17.5rem;
}

.features-cards-wrap .features-band-card-head .feature-icon-purple {
  background: #7c3aed;
  color: #fff;
}

.features-cards-wrap .features-band-card-head .feature-icon-orange {
  background: #ea580c;
  color: #fff;
}

.features-cards-wrap .features-band-card-head .feature-icon-teal {
  background: #2dd4bf;
  color: #fff;
}

.features-cards-wrap .features-band-card-head .feature-icon-indigo {
  background: #60a5fa;
  color: #fff;
}

.features-cards-wrap .features-band-card-head .feature-icon-green {
  background: #16a34a;
  color: #fff;
}

.features-cards-wrap .features-band-card-head .feature-icon-emerald {
  background: #059669;
  color: #fff;
}

.features-cards-wrap .features-band-card-head .feature-icon-amber {
  background: #d97706;
  color: #fff;
}

.features-cards-wrap .features-band-card-head .feature-icon-blue {
  background: #2563eb;
  color: #fff;
}

.features-cards-wrap .features-band-card {
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.features-cards-wrap .features-band-card:hover {
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.07);
}

.features-desc-title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #111827;
  margin: 0;
  line-height: 1.3;
}

.features-desc-p {
  font-size: 0.8125rem;
  color: #6b7280;
  line-height: 1.6;
  margin: 0;
}

@media (max-width: 520px) {
  .features-cards-wrap .features-band-card-body .features-desc-title {
    font-size: 0.98rem;
    line-height: 1.32;
  }

  .features-cards-wrap .features-band-card-body .features-desc-p {
    font-size: 0.8125rem;
    line-height: 1.55;
    max-width: none;
  }

  .features-cards-wrap .features-band-card-head {
    padding: 1.15rem 1rem 0.65rem;
  }

  .features-cards-wrap .features-band-card-head .feature-icon {
    width: 52px;
    height: 52px;
    border-radius: 13px;
  }

  .features-cards-wrap .features-band-card-body {
    padding: 0.35rem 1.1rem 1.35rem;
    gap: 0.45rem;
  }
}

.features-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px 24px;
}

.feature-card {
  background: #fff;
  border-radius: var(--radius-lg);
  padding: 1.75rem 1.5rem;
  text-align: center;
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: var(--shadow-card);
  transition: box-shadow 0.3s, transform 0.2s, border-color 0.2s;
}

.feature-card:hover {
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.05);
  border-color: rgba(15, 23, 42, 0.08);
}

.feature-card-focus {
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
}

.feature-card-focus:hover {
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.14);
}

.feature-icon {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.25rem;
}

.feature-icon svg,
.feature-icon img {
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  object-fit: contain;
}

.feature-icon .fa-solid {
  font-size: 1.375rem;
  line-height: 1;
}

.feature-icon-blue { background: #eff6ff; color: #2563eb; }
.feature-icon-green { background: #dcfce7; color: #16a34a; }
.feature-icon-purple { background: #f5f3ff; color: #7c3aed; }
.feature-icon-orange { background: #fff7ed; color: #ea580c; }
.feature-icon-teal { background: #ccfbf1; color: #0d9488; }
.feature-icon-indigo { background: #eef2ff; color: #4f46e5; }
.feature-icon-red { background: #fee2e2; color: #dc2626; }
.feature-icon-cyan { background: #cffafe; color: #0891b2; }
.feature-icon-emerald { background: #d1fae5; color: #059669; }
.feature-icon-violet { background: #ede9fe; color: #7c3aed; }
.feature-icon-amber { background: #fef3c7; color: #d97706; }
.feature-icon-pink { background: #fce7f3; color: #db2777; }

.platform-showcase {
  position: relative;
  padding: clamp(2.35rem, 5vw, 4rem) max(1.5rem, env(safe-area-inset-left, 0px)) clamp(2.5rem, 5.5vw, 4.5rem) max(1.5rem, env(safe-area-inset-right, 0px));
  background:
    radial-gradient(ellipse 85% 45% at 15% 0%, rgba(37, 99, 235, 0.05) 0%, transparent 55%),
    linear-gradient(180deg, var(--flow-surface) 0%, #ffffff 50%, var(--page-bg-mid) 100%);
}

.platform-showcase-inner {
  max-width: 1360px;
  margin: 0 auto;
}

.platform-showcase-header {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 1.5rem 3rem;
  align-items: start;
  margin-bottom: clamp(1.5rem, 3.5vw, 2.35rem);
}

.platform-showcase-title {
  font-size: clamp(1.75rem, 4.2vw, 2.75rem);
  font-weight: 700;
  letter-spacing: -0.035em;
  color: #0f172a;
  line-height: 1.12;
  margin: 0;
}

.platform-showcase-lead {
  font-size: clamp(0.9375rem, 0.55vw + 0.84rem, 1.125rem);
  color: #475569;
  line-height: 1.65;
  margin: 0;
  padding-top: 0.2rem;
}

.platform-showcase-slider {
  position: relative;
}

.platform-showcase-viewport {
  overflow: hidden;
  width: 100%;
}

.platform-showcase-track {
  display: flex;
  gap: 20px;
  transition: transform 0.45s cubic-bezier(0.25, 0.1, 0.25, 1);
  will-change: transform;
}

@media (prefers-reduced-motion: reduce) {
  .platform-showcase-track {
    transition: none;
  }
}

.platform-showcase-track .platform-card {
  flex-shrink: 0;
  box-sizing: border-box;
}

.platform-showcase-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 1.75rem;
  padding: 0 2px;
  gap: 1rem;
}

.platform-showcase-dots {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.platform-showcase-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  border: none;
  padding: 0;
  background: #cbd5e1;
  cursor: pointer;
  transition: width 0.28s ease, background 0.28s ease;
  flex-shrink: 0;
}

.platform-showcase-dot:hover {
  background: #94a3b8;
}

.platform-showcase-dot.is-active {
  width: 28px;
  background: #475569;
  cursor: default;
}

.platform-showcase-dot.is-active:hover {
  background: #475569;
}

.platform-showcase-arrows {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.platform-showcase-arrow {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #475569;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
}

.platform-showcase-arrow:hover:not(:disabled) {
  background: #f8fafc;
  border-color: #cbd5e1;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.1);
}

.platform-showcase-arrow:disabled {
  opacity: 0.38;
  cursor: not-allowed;
}

.platform-card {
  position: relative;
  border-radius: 18px;
  min-height: 440px;
  padding: 1.75rem 1.65rem 3.4rem;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow:
    0 8px 28px rgba(15, 23, 42, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  transition: transform 0.28s ease, box-shadow 0.28s ease;
}

.platform-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(130% 90% at 15% -25%, rgba(255, 255, 255, 0.14) 0%, transparent 48%);
  pointer-events: none;
  z-index: 0;
}

.platform-card--ink::before {
  background: radial-gradient(100% 70% at 50% 0%, rgba(255, 255, 255, 0.07) 0%, transparent 52%);
}

.platform-card--soft::before {
  background: radial-gradient(120% 80% at 85% -15%, rgba(255, 255, 255, 0.45) 0%, transparent 46%);
}

.platform-card--deep::before {
  background: radial-gradient(110% 80% at 20% -20%, rgba(56, 189, 248, 0.12) 0%, transparent 45%);
}

.platform-card--personel::before {
  background: radial-gradient(100% 70% at 100% 0%, rgba(167, 139, 250, 0.2) 0%, transparent 50%);
}

.platform-card--reports::before {
  background: radial-gradient(110% 75% at 10% -15%, rgba(94, 234, 212, 0.18) 0%, transparent 48%);
}

.platform-card:hover {
  transform: translateY(-4px);
  box-shadow:
    0 20px 44px rgba(15, 23, 42, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.platform-card--charcoal {
  background: linear-gradient(165deg, #4a4643 0%, #2d2a28 55%, #252220 100%);
}

.platform-card--ink {
  background: linear-gradient(180deg, #121212 0%, #0a0a0a 100%);
}

.platform-card--soft {
  background: linear-gradient(145deg, #fffbeb 0%, #fef3c7 35%, #e0f2fe 70%, #fce7f3 100%);
}

.platform-card--deep {
  background: linear-gradient(160deg, #1e293b 0%, #0f172a 50%, #0c1222 100%);
}

.platform-card--tgel {
  overflow: hidden;
}

.platform-card-visual--tgel {
  min-height: 188px;
  align-items: stretch;
  justify-content: center;
  padding: 0 2px;
}

.tgv {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 280px;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 8px 28px rgba(0,0,0,.28), 0 0 0 1px rgba(255,255,255,.1);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
}

.tgv-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 9px 12px;
  background: linear-gradient(180deg, #243b53 0%, #152238 100%);
}

.tgv-bar-title {
  font-size: 12px;
  font-weight: 700;
  color: #f1f5f9;
  display: flex;
  align-items: center;
  gap: 6px;
}

.tgv-bar-title i { font-size: 11px; opacity: .8; }

.tgv-bar-btn {
  font-size: 10px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 6px;
  background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%);
  color: #fff;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  box-shadow: 0 2px 8px rgba(37,99,235,.4);
  animation: tgvBtnPulse 2.6s ease-in-out infinite;
}

@keyframes tgvBtnPulse {
  0%, 100% { box-shadow: 0 2px 8px rgba(37,99,235,.35); }
  50%       { box-shadow: 0 2px 16px rgba(37,99,235,.65); }
}

.tgv-kat-bar {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
  padding: 8px 10px 7px;
  overflow: hidden;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.tgv-kat-btn {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 9px;
  font-weight: 600;
  padding: 4px 7px;
  flex-shrink: 1;
  min-width: 0;
  border-radius: 6px;
  background: #fff;
  border: 1px solid #d1d9e3;
  color: #475569;
  cursor: default;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
}

.tgv-kat-btn i { font-size: 10px; flex-shrink: 0; }

.tgv-kat-btn--on {
  background: #2563eb;
  border-color: #2563eb;
  color: #fff;
  box-shadow: 0 2px 8px rgba(37,99,235,.35);
}

.tgv-rows {
  display: flex;
  flex-direction: column;
  padding: 6px 0 2px;
  background: #fff;
}

.tgv-row {
  display: grid;
  grid-template-columns: 8px 1fr auto auto;
  align-items: center;
  gap: 0 10px;
  padding: 7px 12px;
  font-size: 11px;
  border-bottom: 1px solid #f1f5f9;
  transition: background .15s;
}

.tgv-row--a { animation: tgvRowLight 3.6s ease-in-out infinite; }
.tgv-row--b { animation: tgvRowLight 3.6s ease-in-out 1.2s infinite; }
.tgv-row--c { animation: tgvRowLight 3.6s ease-in-out 2.4s infinite; }

@keyframes tgvRowLight {
  0%, 60%, 100% { background: transparent; }
  20%, 40%      { background: rgba(59,130,246,.05); }
}

.tgv-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.tgv-dot--green { background: #22c55e; }
.tgv-dot--red   { background: #f87171; }
.tgv-dot--sky   { background: #38bdf8; }

.tgv-lbl {
  font-weight: 500;
  color: #334155;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tgv-daire {
  font-size: 10px;
  color: #94a3b8;
  white-space: nowrap;
}

.tgv-amt {
  font-weight: 700;
  color: #1d4ed8;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.tgv-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px;
  background: linear-gradient(90deg, rgba(45,212,191,.15) 0%, rgba(59,130,246,.1) 100%);
  border-top: 1px solid rgba(45,212,191,.25);
}

.tgv-foot-l {
  font-size: 10px;
  font-weight: 600;
  color: #0f766e;
  display: flex;
  align-items: center;
  gap: 5px;
}

.tgv-foot-l i { font-size: 11px; }

.tgv-foot-r {
  font-size: 12px;
  font-weight: 700;
  color: #1e40af;
  font-variant-numeric: tabular-nums;
}

.plc-tgel-aura {
  position: absolute;
  inset: 4px 0 8px;
  border-radius: 14px;
  background: radial-gradient(
    80% 75% at 50% 55%,
    rgba(45, 212, 191, 0.18) 0%,
    rgba(59, 130, 246, 0.08) 42%,
    transparent 68%
  );
  pointer-events: none;
  z-index: 0;
  animation: plcTgelAuraPulse 5s ease-in-out infinite;
}

@keyframes plcTgelAuraPulse {
  0%,
  100% {
    opacity: 0.82;
  }
  50% {
    opacity: 1;
  }
}

.plc-tgel-feature-badge {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: rgba(248, 250, 252, 0.96);
  padding: 5px 11px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.72);
  border: 1px solid rgba(45, 212, 191, 0.42);
  box-shadow:
    0 2px 12px rgba(0, 0, 0, 0.28),
    0 0 0 1px rgba(255, 255, 255, 0.06) inset;
}

.plc-tgel-feature-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #2dd4bf;
  box-shadow: 0 0 10px rgba(45, 212, 191, 0.85);
  animation: plcTgelFeatureDot 1.85s ease-in-out infinite;
}

@keyframes plcTgelFeatureDot {
  0%,
  100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.55;
    transform: scale(0.88);
  }
}

.platform-card--personel {
  background: linear-gradient(155deg, #312e81 0%, #1e1b4b 42%, #172554 100%);
}

.platform-card--reports {
  background: linear-gradient(158deg, #0d9488 0%, #0f766e 38%, #115e59 72%, #134e4a 100%);
}

.platform-card--soft .platform-card-title {
  color: #0f172a;
}

.platform-card--soft .platform-card-desc {
  color: rgba(15, 23, 42, 0.72);
}

.platform-card-title {
  font-size: 1.3rem;
  font-weight: 700;
  color: #fff;
  margin: 0 0 0.5rem;
  letter-spacing: -0.02em;
  line-height: 1.2;
  position: relative;
  z-index: 2;
}

.platform-card-desc {
  font-size: 0.925rem;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.74);
  margin: 0;
  max-width: none;
  position: relative;
  z-index: 2;
}

.platform-card-visual {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 1.25rem;
  min-height: 220px;
  position: relative;
  z-index: 1;
}

.platform-card-visual--soft {
  align-items: center;
  padding-bottom: 0;
}

.platform-card-arrow {
  position: absolute;
  bottom: 16px;
  right: 16px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.28);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  z-index: 3;
  pointer-events: none;
}

.platform-card-arrow svg {
  width: 19px;
  height: 19px;
}

.platform-card-arrow--dark {
  border-color: rgba(15, 23, 42, 0.12);
  color: #0f172a;
  background: rgba(255, 255, 255, 0.55);
}

.plc-mock {
  width: 100%;
  max-width: 260px;
}

.plc-mock-ledger {
  position: relative;
  background: rgba(0, 0, 0, 0.28);
  border-radius: 12px;
  padding: 10px 10px 22px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.plc-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  margin-right: 6px;
  vertical-align: middle;
  flex-shrink: 0;
  font-style: normal;
  font-size: 0;
  line-height: 0;
}

.plc-dot--ok {
  background: #4ade80;
  box-shadow: 0 0 8px rgba(74, 222, 128, 0.45);
}

.plc-dot--warn {
  background: #fbbf24;
  box-shadow: 0 0 8px rgba(251, 191, 36, 0.35);
}

.plc-dot--risk {
  background: #f87171;
  box-shadow: 0 0 8px rgba(248, 113, 113, 0.35);
}

.plc-dot--muted {
  background: rgba(255, 255, 255, 0.25);
}

.plc-ledger-name {
  display: inline-flex;
  align-items: center;
}

.plc-ledger-spark {
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 6px;
  display: flex;
  align-items: flex-end;
  gap: 3px;
  height: 14px;
}

.plc-ledger-spark span {
  flex: 1;
  border-radius: 2px 2px 0 0;
  background: linear-gradient(180deg, rgba(52, 211, 153, 0.85) 0%, rgba(52, 211, 153, 0.25) 100%);
  height: 35%;
}

.plc-ledger-spark span:nth-child(2) { height: 55%; }
.plc-ledger-spark span:nth-child(3) { height: 45%; }
.plc-ledger-spark span:nth-child(4) { height: 70%; }
.plc-ledger-spark span:nth-child(5) { height: 50%; }
.plc-ledger-spark span:nth-child(6) { height: 90%; }

.plc-ledger-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.625rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.85);
  margin-bottom: 8px;
}

.plc-pill {
  font-size: 0.5625rem;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.9);
}

.plc-ledger-row {
  display: flex;
  justify-content: space-between;
  font-size: 0.625rem;
  padding: 6px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.92);
}

.plc-ledger-row-dim {
  opacity: 0.55;
}

.plc-ledger-amt {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.plc-mock-faiz {
  text-align: center;
}

.plc-faiz-pills {
  display: flex;
  gap: 6px;
  justify-content: center;
  margin-bottom: 12px;
}

.plc-faiz-pills span {
  font-size: 0.5625rem;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.65);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.plc-faiz-pills span.is-on {
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.22);
}

.plc-faiz-mini {
  background: rgba(167, 139, 250, 0.2) !important;
  border-color: rgba(167, 139, 250, 0.35) !important;
  color: rgba(196, 181, 253, 0.95) !important;
}

.plc-faiz-chart-wrap {
  position: relative;
  margin-bottom: 10px;
}

.plc-faiz-curve {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 40px;
  width: 100%;
  opacity: 0.95;
  pointer-events: none;
}

.plc-faiz-chart {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 5px;
  height: 72px;
  padding-top: 28px;
}

.plc-faiz-chart span {
  width: 10px;
  border-radius: 3px 3px 1px 1px;
  height: var(--h);
  background: linear-gradient(180deg, rgba(147, 197, 253, 0.95) 0%, rgba(59, 130, 246, 0.5) 100%);
  opacity: 0.9;
}

.plc-faiz-badge {
  display: inline-block;
  font-size: 1.125rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: -0.02em;
}

.plc-faiz-badge small {
  display: block;
  font-size: 0.5625rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.5);
  margin-top: 2px;
}

.plc-soft-bloom {
  position: absolute;
  inset: -30%;
  background:
    radial-gradient(circle at 30% 40%, rgba(253, 224, 71, 0.35) 0%, transparent 45%),
    radial-gradient(circle at 70% 60%, rgba(125, 211, 252, 0.3) 0%, transparent 42%),
    radial-gradient(circle at 50% 80%, rgba(251, 207, 232, 0.25) 0%, transparent 40%);
  filter: blur(28px);
  pointer-events: none;
}

.bnk {
  width: 100%;
  max-width: 310px;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 8px 28px rgba(15,23,42,.14), 0 0 0 1px rgba(15,23,42,.07);
  font-family: var(--font-sans);
  font-size: 10px;
  -webkit-font-smoothing: antialiased;
  position: relative;
  z-index: 1;
}

.bnk-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px 8px;
  background: linear-gradient(90deg, #fffbeb 0%, #fef9ee 100%);
  border-bottom: 1px solid #f1e8c8;
}

.bnk-head-icon {
  width: 32px; height: 32px;
  border-radius: 8px;
  background: #fef3c7;
  border: 1px solid #fde68a;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; color: #d97706; flex-shrink: 0;
}

.bnk-head-info {
  display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0;
}

.bnk-head-name {
  font-size: 11px; font-weight: 700; color: #1e293b;
}

.bnk-head-badge {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 9px; font-weight: 600;
  color: #b45309;
  background: #fef3c7; border: 1px solid #fde68a;
  border-radius: 999px; padding: 1px 7px;
  width: fit-content;
}

.bnk-pulse-dot {
  font-size: 6px;
  color: #f59e0b;
  animation: bnkDotPulse 1.4s ease-in-out infinite;
}

@keyframes bnkDotPulse {
  0%,100% { opacity: 1; }
  50%      { opacity: .3; }
}

.bnk-head-bal {
  font-size: 12px; font-weight: 700; color: #1e3a5f;
  font-variant-numeric: tabular-nums; white-space: nowrap;
}

.bnk-filters {
  display: flex; align-items: center; flex-wrap: nowrap;
  gap: 4px; padding: 6px 10px;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  overflow: hidden;
}

.bnk-pill {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 9px; font-weight: 600;
  padding: 3px 7px; border-radius: 5px;
  background: #fff; border: 1px solid #d1d9e3;
  color: #475569; white-space: nowrap; flex-shrink: 0;
}

.bnk-pill--cnt {
  background: #dbeafe; border-color: #93c5fd; color: #1d4ed8;
}

.bnk-pill--on {
  background: #1d4ed8; border-color: #1d4ed8; color: #fff;
}

.bnk-pill--onayla-g {
  background: #dcfce7; border-color: #86efac; color: #166534;
  margin-left: auto;
}

.bnk-pill--onayla-g + .bnk-pill--onayla-g {
  margin-left: 0;
}

.bnk-thead {
  display: grid;
  grid-template-columns: 26px 48px 1fr 50px 20px 52px;
  gap: 0 4px;
  padding: 4px 10px 3px;
  background: #f9fafb;
  border-bottom: 1px solid #f3f4f6;
  font-size: 8px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .05em;
  color: #9ca3af;
}

.bnk-row {
  display: grid;
  grid-template-columns: 26px 48px 1fr 50px 20px 52px;
  gap: 0 4px;
  align-items: center;
  padding: 6px 10px;
  border-bottom: 1px solid #f3f4f6;
  font-size: 9px; color: #374151;
}

.bnk-row--1 { animation: bnkRowFade 4s ease-in-out 0s   infinite; }
.bnk-row--2 { animation: bnkRowFade 4s ease-in-out 1s   infinite; }
.bnk-row--3 { animation: bnkRowFade 4s ease-in-out 2s   infinite; }
.bnk-row--4 { animation: bnkRowFade 4s ease-in-out 3s   infinite; }

@keyframes bnkRowFade {
  0%,60%,100% { background: transparent; }
  20%,40%     { background: rgba(59,130,246,.05); }
}

.bnk-cell-no   { color: #6b7280; font-variant-numeric: tabular-nums; }
.bnk-cell-date { color: #6b7280; font-variant-numeric: tabular-nums; }
.bnk-cell-desc { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }

.bnk-cell-amt {
  font-weight: 700; font-variant-numeric: tabular-nums;
  text-align: right; white-space: nowrap;
}
.bnk-amt--red   { color: #ef4444; }
.bnk-amt--green { color: #059669; }

.bnk-badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 16px; height: 16px; border-radius: 4px;
  font-size: 8px; font-weight: 700;
}
.bnk-badge--b { background: #fee2e2; color: #b91c1c; }
.bnk-badge--a { background: #dcfce7; color: #166534; }

.bnk-btn-onayla {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 9px; font-weight: 600;
  padding: 3px 7px; border-radius: 5px;
  background: #e2e8f0; color: #475569; white-space: nowrap;
}

.bnk-btn-onayla--active {
  background: linear-gradient(180deg, #22c55e 0%, #16a34a 100%);
  color: #fff;
  box-shadow: 0 2px 8px rgba(34,197,94,.35);
  animation: bnkBtnPulse 2s ease-in-out infinite;
}

@keyframes bnkBtnPulse {
  0%,100% { box-shadow: 0 2px 8px rgba(34,197,94,.3); }
  50%     { box-shadow: 0 2px 16px rgba(34,197,94,.6); }
}

.bnk-foot {
  display: flex; align-items: center; justify-content: space-between;
  gap: 8px; padding: 6px 10px;
  background: #f8fafc; border-top: 1px solid #e2e8f0;
}

.bnk-foot-info { font-size: 9px; color: #94a3b8; }

.bnk-pages { display: flex; align-items: center; gap: 3px; }

.bnk-page-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: 4px;
  font-size: 9px; font-weight: 600;
  background: #fff; border: 1px solid #e2e8f0; color: #64748b;
  cursor: default;
}

.bnk-page-btn--on {
  background: #1d4ed8; border-color: #1d4ed8; color: #fff;
}

@media (prefers-reduced-motion: reduce) {
  .plc-tgel-aura,
  .plc-tgel-feature-dot,
  .tgv-bar-btn,
  .tgv-row,
  .bnk-pulse-dot,
  .bnk-row,
  .bnk-btn-onayla--active {
    animation: none;
  }
}

.plc-mock-rapor-hub {
  width: 100%;
  max-width: 248px;
  background: rgba(0, 0, 0, 0.22);
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
  overflow: hidden;
}

.plc-rapor-hub-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 10px;
  font-size: 0.625rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.92);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.plc-rapor-hub-tabs {
  display: flex;
  gap: 6px;
  padding: 8px 10px 0;
  flex-wrap: wrap;
}

.plc-rapor-type {
  font-size: 0.5rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 4px 8px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.45);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.plc-rapor-type:nth-child(1) {
  animation: plcRaporTab1 3.6s ease-in-out infinite;
}

.plc-rapor-type:nth-child(2) {
  animation: plcRaporTab2 3.6s ease-in-out infinite;
}

.plc-rapor-type:nth-child(3) {
  animation: plcRaporTab3 3.6s ease-in-out infinite;
}

@keyframes plcRaporTab1 {
  0%,
  26% {
    background: rgba(94, 234, 212, 0.22);
    border-color: rgba(94, 234, 212, 0.35);
    color: #ecfeff;
    box-shadow: 0 0 14px rgba(94, 234, 212, 0.2);
  }
  30%,
  100% {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.45);
    box-shadow: none;
  }
}

@keyframes plcRaporTab2 {
  0%,
  29% {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.45);
    box-shadow: none;
  }
  33%,
  59% {
    background: rgba(94, 234, 212, 0.22);
    border-color: rgba(94, 234, 212, 0.35);
    color: #ecfeff;
    box-shadow: 0 0 14px rgba(94, 234, 212, 0.2);
  }
  63%,
  100% {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.45);
    box-shadow: none;
  }
}

@keyframes plcRaporTab3 {
  0%,
  62% {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.45);
    box-shadow: none;
  }
  66%,
  92% {
    background: rgba(94, 234, 212, 0.22);
    border-color: rgba(94, 234, 212, 0.35);
    color: #ecfeff;
    box-shadow: 0 0 14px rgba(94, 234, 212, 0.2);
  }
  96%,
  100% {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.45);
    box-shadow: none;
  }
}

.plc-rapor-hub-preview {
  position: relative;
  margin: 10px;
  padding: 10px 10px 8px;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.28);
  border: 1px solid rgba(255, 255, 255, 0.07);
  min-height: 102px;
  overflow: hidden;
}

.plc-rapor-hub-scan {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 22px;
  background: linear-gradient(
    180deg,
    transparent 0%,
    rgba(94, 234, 212, 0.12) 40%,
    rgba(94, 234, 212, 0.22) 50%,
    rgba(94, 234, 212, 0.12) 60%,
    transparent 100%
  );
  animation: plcRaporScan 2.6s ease-in-out infinite;
  pointer-events: none;
}

@keyframes plcRaporScan {
  0% {
    transform: translateY(-4px);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    transform: translateY(88px);
    opacity: 0;
  }
}

.plc-rapor-hub-docbar {
  height: 5px;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.12);
  margin-bottom: 10px;
  position: relative;
  z-index: 1;
}

.plc-rapor-hub-rows {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.plc-rapor-hub-row {
  display: flex;
  align-items: center;
  gap: 6px;
  animation: plcRaporRowFade 3.6s ease-in-out infinite;
}

.plc-rapor-hub-row:nth-child(1) { animation-delay: 0s; }
.plc-rapor-hub-row:nth-child(2) { animation-delay: 0.12s; }
.plc-rapor-hub-row:nth-child(3) { animation-delay: 0.24s; }
.plc-rapor-hub-row:nth-child(4) { animation-delay: 0.36s; }

@keyframes plcRaporRowFade {
  0%,
  100% {
    opacity: 0.45;
  }
  35%,
  65% {
    opacity: 1;
  }
}

.plc-rapor-cell {
  height: 4px;
  border-radius: 2px;
  flex-shrink: 0;
}

.plc-rapor-cell--sm {
  width: 22%;
  background: rgba(255, 255, 255, 0.14);
}

.plc-rapor-cell--lg {
  flex: 1;
  min-width: 0;
  background: rgba(255, 255, 255, 0.2);
}

.plc-rapor-cell--accent {
  width: 20%;
  background: linear-gradient(90deg, rgba(94, 234, 212, 0.5), rgba(45, 212, 191, 0.65));
}

.plc-rapor-hub-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  font-size: 0.5rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.5);
  position: relative;
  z-index: 1;
}

.plc-rapor-hub-pulse {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #5eead4;
  box-shadow: 0 0 8px rgba(94, 234, 212, 0.65);
  animation: plcRaporHubPulse 1.4s ease-in-out infinite;
}

@keyframes plcRaporHubPulse {
  0%,
  100% {
    opacity: 0.45;
    transform: scale(0.85);
  }
  50% {
    opacity: 1;
    transform: scale(1.1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .plc-rapor-type:nth-child(1),
  .plc-rapor-type:nth-child(2),
  .plc-rapor-type:nth-child(3),
  .plc-rapor-hub-scan,
  .plc-rapor-hub-row,
  .plc-rapor-hub-pulse {
    animation: none;
  }

  .plc-rapor-type:nth-child(1) {
    background: rgba(94, 234, 212, 0.22);
    border-color: rgba(94, 234, 212, 0.35);
    color: #ecfeff;
  }

  .plc-rapor-type:nth-child(2),
  .plc-rapor-type:nth-child(3) {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.45);
  }

  .plc-rapor-hub-row {
    opacity: 1;
  }

  .plc-rapor-hub-scan {
    opacity: 0;
    transform: translateY(40px);
  }

  .plc-rapor-hub-pulse {
    opacity: 1;
    transform: none;
  }
}

.plc-mock-personel {
  width: 100%;
  max-width: 232px;
}

.plc-personel-team {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin-bottom: 12px;
}

.plc-av {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--av, #6366f1);
  color: #fff;
  font-size: 0.5625rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid rgba(255, 255, 255, 0.25);
  margin-left: -8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.plc-av:first-child {
  margin-left: 0;
}

.plc-personel-card {
  background: rgba(0, 0, 0, 0.22);
  border-radius: 10px;
  padding: 8px 10px;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.plc-personel-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.5625rem;
  color: rgba(255, 255, 255, 0.9);
  padding: 6px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.plc-personel-row:first-of-type {
  border-top: none;
  padding-top: 0;
}

.plc-personel-row i {
  width: 14px;
  text-align: center;
  color: rgba(196, 181, 253, 0.95);
  font-size: 0.625rem;
}

.plc-personel-row span:nth-child(2) {
  flex: 1;
  min-width: 0;
  line-height: 1.35;
}

.plc-personel-tag {
  font-size: 0.5rem;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(251, 191, 36, 0.2);
  color: #fcd34d;
  flex-shrink: 0;
}

.plc-personel-tag--done {
  background: rgba(52, 211, 153, 0.18);
  color: #6ee7b7;
}

@media (max-width: 1024px) {
  .platform-showcase-header {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
}

@media (max-width: 640px) {
  .platform-showcase-nav {
    margin-top: 1.35rem;
  }

  .platform-showcase-dots {
    flex: 1;
    justify-content: center;
  }

  .platform-card {
    min-height: 300px;
    padding: 1.3rem 1.15rem 2.75rem;
  }

  .platform-card-title {
    font-size: 1.05rem;
  }

  .platform-card-desc {
    font-size: 0.8125rem;
  }

  .platform-card-visual {
    min-height: 150px;
    margin-top: 0.75rem;
  }
}

.feature-card-title {
  font-size: 1rem;
  font-weight: 700;
  color: #111827;
  margin-bottom: 10px;
  line-height: 1.35;
}

.feature-card-desc {
  font-size: 0.8125rem;
  color: #6b7280;
  line-height: 1.55;
  margin: 0 0 1rem;
}

.feature-link {
  font-size: 0.875rem;
  font-weight: 600;
  color: #1e3a8a;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  transition: color 0.2s, gap 0.2s;
}

.feature-link:hover {
  color: #2563eb;
  gap: 6px;
}

.services-header {
  text-align: center;
  max-width: 48rem;
  margin: 0 auto 4rem;
}

.services-title {
  font-size: 1.875rem;
  font-weight: 700;
  color: #111827;
  margin-bottom: 1rem;
  letter-spacing: -0.02em;
}

.services-subtitle {
  font-size: clamp(0.9375rem, 0.32vw + 0.88rem, 1.125rem);
  color: #4b5563;
  line-height: 1.6;
}

.services-slider {
  max-width: 1120px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 24px;
}

.services-slides {
  flex: 1;
  overflow: hidden;
  min-width: 0;
}

.services-slide {
  display: none;
  width: 100%;
}

.services-slide.active {
  display: block;
}

.services-arrow {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: none;
  background: #fff;
  color: #374151;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  transition: background 0.2s, transform 0.2s;
}

.services-arrow:hover {
  background: #f9fafb;
  transform: scale(1.1);
}

.services-grid {
  flex: 1;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px 28px;
  min-width: 0;
}

.service-card {
  background: var(--color-white);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  text-align: center;
  transition: box-shadow 0.2s;
}

.service-icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1rem;
}

.service-icon svg,
.service-icon img.service-icon-img {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  object-fit: contain;
}

.service-icon-blue {
  background: #eff6ff;
  color: #2563eb;
}

.service-icon-green {
  background: #f0fdf4;
  color: #16a34a;
}

.service-icon-purple {
  background: #f5f3ff;
  color: #7c3aed;
}

.service-icon-orange {
  background: #fff7ed;
  color: #ea580c;
}

.service-icon-teal {
  background: #f0fdfa;
  color: #0d9488;
}

.service-icon-pink {
  background: #fdf2f8;
  color: #db2777;
}

.service-icon-indigo {
  background: #eef2ff;
  color: #4f46e5;
}

.service-icon-red {
  background: #fef2f2;
  color: #dc2626;
}

.service-icon-cyan {
  background: #ecfeff;
  color: #0891b2;
}

.service-icon-emerald {
  background: #ecfdf5;
  color: #059669;
}

.service-icon-violet {
  background: #f5f3ff;
  color: #7c3aed;
}

.service-icon-amber {
  background: #fffbeb;
  color: #d97706;
}

.service-card-title {
  font-size: 1rem;
  font-weight: 700;
  color: #333333;
  margin-bottom: 8px;
  line-height: 1.35;
}

.service-card-desc {
  font-size: 0.875rem;
  color: #4b5563;
  line-height: 1.5;
  margin: 0;
}

.services-dots {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: 40px;
}

.services-dot {
  width: 8px;
  height: 8px;
  border-radius: 9999px;
  border: none;
  background: #d1d5db;
  cursor: pointer;
  padding: 0;
  transition: background 0.2s, width 0.2s;
}

.services-dot.active {
  width: 32px;
  background: #2563eb;
}

.blog-section {
  padding: 3.25rem 1.25rem 2.85rem;
  background: var(--home-band-muted-bg, #f3f4f6);
  border: none;
}

.blog-section-inner {
  max-width: 80rem;
  margin: 0 auto;
}

.blog-section-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1.65rem;
  flex-wrap: wrap;
}

.blog-section-label {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #2563eb;
  background: #eff6ff;
  border-radius: 20px;
  padding: 0.25rem 0.85rem;
  margin-bottom: 0.75rem;
}

.blog-section-title {
  font-size: clamp(1.5rem, 3vw, 2.1rem);
  font-weight: 700;
  color: #0f172a;
  margin: 0 0 0.5rem;
  line-height: 1.2;
}

.blog-section-desc {
  color: #64748b;
  font-size: clamp(0.9375rem, 0.28vw + 0.89rem, 1rem);
  margin: 0;
  max-width: 38rem;
}

.blog-section-all {
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  flex-shrink: 0;
}

.blog-section-all .fa-solid {
  font-size: 0.95em;
  line-height: 1;
}

section.blog-section.akademi-home-preview {
  position: relative;
  z-index: 6;
  margin-top: -48px;
  border-radius: 48px 48px 0 0;
  overflow: hidden;
  box-shadow:
    0 -12px 36px -22px rgba(15, 23, 42, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

@media (max-width: 640px) {
  section.blog-section.akademi-home-preview {
    margin-top: -32px;
    border-radius: 28px 28px 0 0;
  }
}

.akademi-home-preview-desc {
  margin-top: 0.35rem;
  margin-bottom: 0;
}

.akademi-home-video-grid {
  margin-top: 0.25rem;
}

.blog-slider-wrapper {
  position: relative;
  overflow: hidden;
}

.blog-slider-track {
  display: flex;
  gap: 1.5rem;
  transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform;
}

.blog-slide-card {
  flex: 0 0 calc((100% - 3rem) / 3);
  min-width: 0;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow 0.25s, transform 0.25s;
}

.blog-slide-card:hover {
  box-shadow: 0 12px 40px rgba(37, 99, 235, 0.10);
  transform: translateY(-4px);
}

.blog-slide-img-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  overflow: hidden;
  background: #e2e8f0;
}

.blog-slide-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.blog-slide-card:hover .blog-slide-img {
  transform: scale(1.04);
}

.blog-slide-badge {
  position: absolute;
  top: 0.85rem;
  left: 0.85rem;
  background: #2563eb;
  color: #fff;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  padding: 0.22rem 0.65rem;
  border-radius: 20px;
}

.blog-slide-body {
  padding: 1.25rem 1.35rem 1.5rem;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.blog-slide-meta {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8rem;
  color: #94a3b8;
  margin-bottom: 0.65rem;
}

.blog-slide-dot {
  color: #cbd5e1;
}

.blog-slide-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.4;
  margin: 0 0 0.6rem;
}

.blog-slide-excerpt {
  font-size: 0.88rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0 0 1.1rem;
  flex: 1;
}

.blog-slide-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.88rem;
  font-weight: 600;
  color: #2563eb;
  text-decoration: none;
  transition: gap 0.2s;
}

.blog-slide-link:hover {
  gap: 0.7rem;
}

.blog-slider-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 2rem;
}

.blog-slider-dots {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.blog-slider-arrows {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.blog-slider-arrow {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1.5px solid #e2e8f0;
  background: #fff;
  color: #0f172a;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08);
  transition: background 0.2s, border-color 0.2s, color 0.2s, box-shadow 0.2s;
  flex-shrink: 0;
}

.blog-slider-arrow:hover:not(:disabled) {
  background: #2563eb;
  border-color: #2563eb;
  color: #fff;
  box-shadow: 0 4px 18px rgba(37,99,235,0.2);
}

.blog-slider-arrow:disabled {
  opacity: 0.35;
  cursor: default;
}

.blog-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: none;
  background: #cbd5e1;
  cursor: pointer;
  padding: 0;
  transition: background 0.2s, transform 0.2s, width 0.25s;
}

.blog-dot.active {
  background: #2563eb;
  width: 28px;
  border-radius: 5px;
  transform: none;
}

@media (max-width: 1023px) {
  .blog-slide-card {
    flex: 0 0 calc((100% - 1.5rem) / 2);
  }
}

@media (max-width: 639px) {
  .blog-section {
    padding: 2.35rem 1rem 2rem;
  }
  .blog-slide-card {
    flex: 0 0 100%;
  }
  .blog-section-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
  }

  .blog-section-all {
    width: 100%;
    justify-content: center;
  }
}

.reviews {
  padding: 2rem 1.25rem 2.15rem;
  box-sizing: border-box;
  
  background: var(--home-band-muted-bg, #f3f4f6);
  border: none;
}

.reviews-inner {
  max-width: var(--content-max-width);
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
}

.reviews-header {
  text-align: center;
  margin-bottom: 0.15rem;
}

.reviews-title-wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin-bottom: 0;
  padding: 0;
  overflow: visible;
}

.reviews-title {
  position: relative;
  font-family: var(--font-sans);
  font-size: 2rem;
  font-weight: 700;
  color: var(--color-text);
  letter-spacing: -0.02em;
  line-height: 1.2;
  margin: 0;
}

.reviews-hero-avatars {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-bottom: clamp(0.2rem, 1vw, 0.45rem);
  pointer-events: none;
}

.reviews-hero-avatars-stack {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.reviews-hero-face {
  flex-shrink: 0;
  border-radius: 50%;
  border: 5px solid #fff;
  object-fit: cover;
  filter: grayscale(1) contrast(1.06);
  box-shadow:
    0 12px 28px rgba(15, 23, 42, 0.14),
    0 2px 8px rgba(15, 23, 42, 0.1);
  position: relative;
}

.reviews-hero-face--side {
  width: 4.25rem;
  height: 4.25rem;
  z-index: 1;
  margin-right: -1.45rem;
}

.reviews-hero-face--side.reviews-hero-face--right {
  margin-right: 0;
  margin-left: -1.45rem;
  z-index: 2;
}

.reviews-hero-face--center {
  width: 5.65rem;
  height: 5.65rem;
  z-index: 3;
}

@media (min-width: 640px) {
  .reviews-hero-face--side {
    width: 4.85rem;
    height: 4.85rem;
    margin-right: -1.65rem;
  }

  .reviews-hero-face--side.reviews-hero-face--right {
    margin-left: -1.65rem;
  }

  .reviews-hero-face--center {
    width: 6.35rem;
    height: 6.35rem;
  }
}

@media (min-width: 640px) {
  .reviews-title {
    font-size: 2.25rem;
  }
}

.reviews-3d-wrap {
  position: relative;
  padding: 0 0 0.5rem;
  margin-top: 0;
  box-sizing: border-box;
  width: 100%;
}

.reviews-3d-viewport {
  position: relative;
  height: 580px;
  width: 100%;
  max-width: none;
  margin: 0;
  overflow: hidden;
  border-radius: 1.5rem;
  isolation: isolate;
  background: linear-gradient(155deg, #f1f5f9 0%, #e8eef5 45%, #dce3ed 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.75),
    0 25px 50px -12px rgba(0, 0, 0, 0.08);
  border: 1px solid rgba(0, 0, 0, 0.06);
}

.reviews-3d-stage {
  position: absolute;
  z-index: 1;
  
  left: 44%;
  top: 34%;
  width: 138%;
  height: 195%;
  margin-left: -69%;
  margin-top: -54%;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 1.65rem;
  transform-style: preserve-3d;
  transform-origin: 52% 42%;
  transform: translate3d(-3vw, -2.5vh, 0) rotateX(54deg) rotateZ(-42deg) scale(0.98);
}

.reviews-3d-col {
  flex: 1 1 0;
  min-width: 220px;
  max-width: none;
  width: 0;
}

.reviews-3d-col-clip {
  overflow: hidden;
  height: 100%;
  min-height: 1120px;
  border-radius: 0.5rem;
}

.reviews-3d-col-track {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  width: 100%;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  will-change: transform;
}

.reviews-3d-marquee--up {
  animation-name: reviews-marquee-3d-up;
  animation-duration: var(--reviews-marquee-dur, 60s);
}

.reviews-3d-marquee--down {
  animation-name: reviews-marquee-3d-down;
  animation-duration: var(--reviews-marquee-dur, 60s);
}

.reviews-3d-col:hover .reviews-3d-col-track {
  animation-play-state: paused;
}

@keyframes reviews-marquee-3d-up {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(-50%);
  }
}

@keyframes reviews-marquee-3d-down {
  from {
    transform: translateY(-50%);
  }
  to {
    transform: translateY(0);
  }
}

.reviews-3d-stack {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  flex-shrink: 0;
}

.reviews-3d-fade {
  position: absolute;
  left: 0;
  right: 0;
  height: 80px;
  z-index: 4;
  pointer-events: none;
}

.reviews-3d-fade--top {
  top: 0;
  height: 56px;
  border-radius: 1.5rem 1.5rem 0 0;
  background: linear-gradient(to bottom, var(--home-band-muted-bg, #f3f4f6), transparent);
}

.reviews-3d-fade--bottom {
  bottom: 0;
  left: 0;
  right: 0;
  border-radius: 0 0 1.5rem 1.5rem;
  
  height: min(38vh, 300px);
  background: linear-gradient(
    to top,
    var(--home-band-muted-bg, #f3f4f6) 0%,
    rgba(243, 244, 246, 0.82) 14%,
    rgba(243, 244, 246, 0.42) 38%,
    rgba(243, 244, 246, 0.12) 68%,
    rgba(243, 244, 246, 0) 100%
  );
}

.reviews-3d-gridlines {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  border-radius: inherit;
  opacity: 0.4;
  background-image:
    linear-gradient(to right, rgba(15, 23, 42, 0.07) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(15, 23, 42, 0.07) 1px, transparent 1px);
  background-size: 52px 52px;
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    black 5%,
    black 93%,
    rgba(0, 0, 0, 0.45) 97%,
    transparent 100%
  );
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    black 5%,
    black 93%,
    rgba(0, 0, 0, 0.45) 97%,
    transparent 100%
  );
}

.reviews--efferd-columns.reviews {
  background: var(--home-band-muted-bg, #f3f4f6);
  padding-top: clamp(2.75rem, 6vw, 4rem);
  padding-bottom: clamp(2.75rem, 6vw, 4rem);
  padding-left: clamp(0.65rem, 2vw, 1rem);
  padding-right: clamp(0.65rem, 2vw, 1rem);
}

.reviews--efferd-columns .reviews-inner {
  max-width: min(100%, 96rem);
  width: 100%;
}

.reviews-header--efferd {
  margin-bottom: clamp(1.75rem, 4vw, 2.5rem);
  max-width: 40rem;
  margin-left: auto;
  margin-right: auto;
}

.reviews-eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 0.75rem;
  padding: 0.35rem 0.9rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3b82f6;
  background: #eff6ff;
  border: 1px solid rgba(59, 130, 246, 0.2);
  border-radius: 9999px;
}

.reviews-header--efferd .reviews-title {
  font-size: clamp(1.75rem, 4.5vw, 2.5rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  color: #0f172a;
}

.reviews-subtitle--efferd {
  margin: 0.85rem 0 0;
  font-size: clamp(0.9375rem, 0.32vw + 0.87rem, 1.0625rem);
  line-height: 1.6;
  color: #64748b;
}

.reviews--efferd-columns .reviews-3d-wrap {
  padding: 0;
  margin-top: 0;
}

.reviews--efferd-columns .reviews-3d-viewport {
  height: auto;
  min-height: 560px;
  max-height: none;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  overflow: hidden;
}

.reviews--efferd-columns .reviews-3d-stage {
  position: relative;
  left: auto;
  top: auto;
  width: 100%;
  max-width: none;
  height: auto;
  min-height: 520px;
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: stretch;
  gap: clamp(0.85rem, 2vw, 1.35rem);
  transform: none !important;
  transform-style: flat;
}

.reviews--efferd-columns .reviews-3d-col {
  flex: 1 1 0;
  min-width: 0;
  max-width: none;
  width: auto;
}

.reviews--efferd-columns .reviews-3d-col-clip {
  min-height: 520px;
  max-height: min(72vh, 720px);
  border-radius: 0;
  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    black 8%,
    black 92%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    black 8%,
    black 92%,
    transparent 100%
  );
}

.reviews--efferd-columns .reviews-3d-col-track {
  gap: 1rem;
}

.reviews--efferd-columns .reviews-3d-stack {
  gap: 1rem;
}

.reviews--efferd-columns .reviews-3d-fade--top {
  height: 72px;
  border-radius: 0;
  background: linear-gradient(
    to bottom,
    var(--home-band-muted-bg, #f3f4f6) 0%,
    rgba(243, 244, 246, 0) 100%
  );
}

.reviews--efferd-columns .reviews-3d-fade--bottom {
  height: min(28vh, 220px);
  border-radius: 0;
  background: linear-gradient(
    to top,
    var(--home-band-muted-bg, #f3f4f6) 0%,
    rgba(243, 244, 246, 0.85) 35%,
    rgba(243, 244, 246, 0) 100%
  );
}

.reviews--efferd-columns .reviews-3d-wrap .review-card {
  position: relative;
  min-height: 0;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding: 1.5rem 1.5rem 1.25rem;
  border-radius: 1rem;
  background: #fff;
  border: 1px solid #e5e7eb;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.05),
    0 4px 12px rgba(15, 23, 42, 0.04);
  
  transform: none;
  backface-visibility: visible;
}

.reviews--efferd-columns .reviews-3d-wrap .review-quote-icon {
  display: none;
}

.reviews--efferd-columns .reviews-3d-wrap .review-text {
  font-size: 0.9375rem;
  line-height: 1.62;
  color: #475569;
  margin: 0 0 1.25rem;
  padding: 0;
}

.reviews--efferd-columns .reviews-3d-wrap .review-author {
  margin: 0;
  width: 100%;
  padding: 1rem 0 0;
  border-top: 1px solid #f1f5f9;
  background: transparent;
  border-radius: 0;
  align-items: center;
  gap: 0.75rem;
}

.reviews--efferd-columns .reviews-3d-wrap .review-avatar {
  width: 44px;
  height: 44px;
  border-radius: 9999px;
  border: 1px solid #f1f5f9;
}

.reviews--efferd-columns .reviews-3d-wrap .review-name {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #0f172a;
}

.reviews--efferd-columns .reviews-3d-wrap .review-role {
  font-size: 0.8125rem;
  color: #64748b;
}

.reviews--efferd-columns .reviews-3d-wrap .review-apartment {
  font-size: 0.8125rem;
  color: #3b82f6;
  font-weight: 500;
}

@media (max-width: 900px) {
  .reviews--efferd-columns .reviews-3d-stage {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    min-height: 0;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  
  .reviews--efferd-columns .reviews-3d-stage > .reviews-3d-col ~ .reviews-3d-col {
    display: none !important;
  }

  .reviews--efferd-columns .reviews-3d-stage > .reviews-3d-col:first-child {
    flex: 0 0 auto;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    isolation: isolate;
  }

  
  .reviews--efferd-columns .reviews-3d-stage > .reviews-3d-col:first-child .reviews-3d-col-track {
    animation-name: reviews-marquee-3d-down !important;
  }

  .reviews--efferd-columns .reviews-3d-col-clip {
    min-height: 280px;
    max-height: min(58vh, 480px);
    width: 100%;
    max-width: 100%;
  }

  .reviews--efferd-columns .reviews-3d-viewport {
    min-height: 0;
    overflow-x: hidden;
  }
}

@media (min-width: 768px) {
  .reviews-3d-wrap {
    padding: 0 0 0.5rem;
  }

  .reviews-3d-viewport {
    height: 680px;
  }

  .reviews--efferd-columns .reviews-3d-viewport {
    height: auto;
    min-height: 560px;
  }
}

@media (max-width: 639px) {
  .reviews:not(.reviews--efferd-columns) .reviews-3d-viewport {
    height: 500px;
  }

  .reviews:not(.reviews--efferd-columns) .reviews-3d-stage {
    left: 42%;
    top: 30%;
    width: 145%;
    height: 200%;
    margin-left: -72.5%;
    margin-top: -58%;
    gap: 1rem;
    transform-origin: 50% 40%;
    transform: translate3d(-4vw, -2vh, 0) rotateX(50deg) rotateZ(-36deg) scale(0.78);
  }

  .reviews:not(.reviews--efferd-columns) .reviews-3d-col {
    min-width: 148px;
  }

  .reviews:not(.reviews--efferd-columns) .reviews-3d-col-clip {
    min-height: 960px;
  }

  .reviews:not(.reviews--efferd-columns) .reviews-3d-wrap .review-card {
    padding-left: 1.35rem;
    padding-right: 1.35rem;
  }

  .reviews:not(.reviews--efferd-columns) .reviews-3d-wrap .review-text {
    padding-left: 3.85rem;
  }

  .reviews:not(.reviews--efferd-columns) .reviews-3d-wrap .review-quote-icon {
    top: 1.3rem;
    left: 1.35rem;
    width: 2.875rem;
    height: 2.875rem;
    min-width: 2.875rem;
    min-height: 2.875rem;
  }

  .reviews:not(.reviews--efferd-columns) .reviews-3d-wrap .review-author {
    margin-left: -1.35rem;
    margin-right: -1.35rem;
    width: calc(100% + 2.7rem);
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .reviews-3d-col-track {
    animation: none !important;
    transform: none !important;
  }
}

.review-card {
  flex-shrink: 0;
  width: 320px;
  min-width: 320px;
  max-width: 320px;
  box-sizing: border-box;
  background: #fff;
  border-radius: 0.875rem;
  padding: 1.75rem 1.5rem 1.5rem;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -2px rgba(0, 0, 0, 0.06);
  border: 1px solid #f3f4f6;
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 260px;
  overflow: visible;
}

.review-quote-icon {
  position: absolute;
  top: -1.25rem;
  left: -1.25rem;
  width: 2.75rem;
  height: 2.75rem;
  min-width: 2.75rem;
  min-height: 2.75rem;
  border-radius: 50%;
  background: #2563eb;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.12), 0 4px 6px -2px rgba(0, 0, 0, 0.08);
  z-index: 3;
  flex-shrink: 0;
}

.review-quote-svg {
  width: 1.125rem;
  height: 1.125rem;
  flex-shrink: 0;
  display: block;
}

.review-stars {
  display: flex;
  align-items: center;
  gap: 0.2rem;
  margin-bottom: 0.75rem;
  margin-top: 0;
}

.review-star-svg {
  width: 1.125rem;
  height: 1.125rem;
  color: #eab308;
  flex-shrink: 0;
}

.review-text {
  font-size: 0.9375rem;
  color: #374151;
  line-height: 1.5;
  margin: 0 0 1rem;
  flex-grow: 1;
  min-width: 0;
  overflow-wrap: break-word;
}

.review-author {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid #e5e7eb;
  margin-top: auto;
}

.review-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.review-author-text {
  min-width: 0;
}

.review-name {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #111827;
  margin: 0 0 0.125rem;
}

.review-role {
  font-size: 0.8125rem;
  color: #6b7280;
  margin: 0 0 0.125rem;
}

.review-apartment {
  font-size: 0.8125rem;
  color: #2563eb;
  font-weight: 500;
  text-decoration: none;
}

.review-apartment:hover {
  color: #1d4ed8;
  text-decoration: underline;
}

.reviews-3d-wrap .review-card {
  width: 100%;
  min-width: 0;
  max-width: none;
  min-height: 300px;
  padding: 2rem 2rem 0;
  border-radius: 1rem;
  box-shadow:
    0 18px 44px -16px rgba(15, 23, 42, 0.22),
    0 6px 16px -6px rgba(15, 23, 42, 0.12);
  border: 1px solid rgba(226, 232, 240, 0.98);
  transform: translateZ(0);
  backface-visibility: hidden;
}

.reviews-3d-wrap .review-text {
  font-size: 1.125rem;
  line-height: 1.55;
  margin: 0 0 1.125rem;
  padding-left: 5.4rem;
  padding-top: 0.15rem;
}

.reviews-3d-wrap .review-name {
  font-size: 1.125rem;
}

.reviews-3d-wrap .review-role {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #4b5563;
}

.reviews-3d-wrap .review-apartment {
  font-size: 0.9375rem;
  line-height: 1.6;
}

.reviews-3d-wrap .review-author {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  margin-top: auto;
  margin-left: -2rem;
  margin-right: -2rem;
  width: calc(100% + 4rem);
  box-sizing: border-box;
  padding: 1rem 1.25rem 1.25rem;
  border-top: 1px solid #f1f5f9;
  background: #fff;
  border-radius: 0 0 1.35rem 1.35rem;
}

.reviews-3d-wrap .review-avatar {
  width: 56px;
  height: 56px;
}

.reviews-3d-wrap .review-quote-icon {
  width: 3.125rem;
  height: 3.125rem;
  min-width: 3.125rem;
  min-height: 3.125rem;
  top: 1.45rem;
  left: 2rem;
}

.reviews-3d-wrap .review-quote-svg {
  width: 1.3125rem;
  height: 1.3125rem;
}

.ekstre-section {
  background: linear-gradient(135deg, #0092B8 0%, #007595 50%, #193CB8 100%);
  padding: 2.85rem 1rem 3.35rem;
}

.ekstre-inner {
  max-width: 80rem;
  margin: 0 auto;
}

.ekstre-card {
  position: relative;
  background: linear-gradient(135deg, rgba(0, 146, 184, 0.18) 0%, rgba(0, 117, 149, 0.22) 50%, rgba(25, 60, 184, 0.18) 100%);
  border-radius: 1.5rem;
  overflow: hidden;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.25);
  min-height: 420px;
}

.ekstre-top {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: center;
  padding: 1.25rem 1rem 2.8125rem;
}

@media (min-width: 768px) {
  .ekstre-top {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

@media (min-width: 1024px) {
  .ekstre-card {
    min-height: 480px;
  }

  .ekstre-top {
    grid-template-columns: 1fr 1fr;
    padding: 1.25rem 2rem 2.8125rem;
  }
}

.ekstre-content {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.ekstre-title {
  font-family: var(--font-sans);
  font-size: 1.875rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--color-white);
  margin: 0;
}

.ekstre-title-line1 {
  display: inline-block;
  white-space: nowrap;
}

@media (min-width: 640px) {
  .ekstre-title {
    font-size: 2.25rem;
  }
}

@media (min-width: 1024px) {
  .ekstre-title {
    font-size: 3rem;
  }
}

.ekstre-desc {
  font-size: 1.125rem;
  line-height: 1.75;
  color: #f3e8ff;
  margin: 0;
}

.ekstre-feature-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  font-family: var(--font-sans);
  font-size: 1rem;
  line-height: 1.4;
  color: #f3e8ff;
}

.ekstre-feature-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.ekstre-feature-icon {
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
  color: #ffffff;
}

.ekstre-cta {
  align-self: flex-start;
  margin-top: 0.25rem;
}

.ekstre-content .ekstre-cta {
  background: #ffffff;
  border: 1px solid #ffffff;
  color: #193cb8;
}

.ekstre-content .ekstre-cta:hover {
  background: #f8fafc;
  color: #193cb8;
}

.ekstre-visual {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  margin-top: -6rem;
}

.ekstre-dashboard {
  width: 100%;
  max-width: 780px;
  background: #f1f5f9;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
  border: 1px solid #e2e8f0;
  transform: translateX(var(--ekstre-shift-x)) scale(var(--ekstre-scale));
  transform-origin: center center;
}

.ekstre-dashboard-slider {
  transition: height 0.35s ease;
}

.ekstre-slider-track {
  display: flex;
  width: 100%;
  will-change: transform;
  transition: transform 0.35s ease;
}

.ekstre-slide {
  flex: 0 0 100%;
  min-width: 100%;
}

.ekstre-slider-nav {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: center;
  position: relative;
  margin-top: -4.5rem;
  top: 0;
  transform: translateX(var(--ekstre-shift-x));
}

.ekstre-slider-nav::before {
  content: "";
  position: absolute;
  left: 6%;
  right: 6%;
  top: 1.45rem;
  height: 1px;
  background: #d7dce3;
}

.ekstre-slider-tab {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.55rem;
  padding: 0.15rem 0.25rem 0.35rem;
  border: none;
  background: transparent;
  color: #1f2f53;
  cursor: pointer;
  position: relative;
  z-index: 1;
}

.ekstre-slider-tab-label {
  order: 2;
  font-size: 0.85rem;
  font-weight: 700;
  line-height: 1.15;
  color: #ffffff;
}

.ekstre-slider-tab-dot {
  order: 1;
  width: 40px;
  height: 40px;
  border-radius: 9999px;
  border: none;
  background: #d6dbe3;
  position: relative;
  transition: background 0.2s ease;
}

.ekstre-slider-tab-dot::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 16px;
  height: 16px;
  border-radius: 9999px;
  transform: translate(-50%, -50%);
  background: #8d97a6;
}

.ekstre-slider-tab.is-active .ekstre-slider-tab-dot {
  background: #2563eb;
}

.ekstre-slider-tab.is-active .ekstre-slider-tab-dot::after {
  background: #fff;
}

.ekstre-slider-tab.is-active .ekstre-slider-tab-label {
  color: #ffffff;
  font-weight: 700;
}

.ekstre-slide-v2 .ekstre-dash-cards {
  grid-template-columns: repeat(4, 1fr);
}

.ekstre-summary-sub {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  margin-top: 0.35rem;
  font-size: 0.6rem;
  color: var(--color-text-muted);
}

.ekstre-orange {
  color: #f59e0b;
}

.ekstre-breakdown {
  margin-top: 0.6rem;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  background: #fff;
}

.ekstre-breakdown-title {
  background: #065f46;
  color: #fff;
  padding: 0.45rem 0.6rem;
  font-size: 0.7rem;
  font-weight: 600;
  text-align: center;
}

.ekstre-breakdown-table-wrap {
  background: #e0f2fe;
  padding: 0.5rem 0.6rem 0.75rem;
}

.ekstre-breakdown-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.65rem;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 10px;
  overflow: hidden;
}

.ekstre-breakdown-table th,
.ekstre-breakdown-table td {
  padding: 0.45rem 0.5rem;
  border-bottom: 1px solid rgba(148, 163, 184, 0.35);
  text-align: left;
  white-space: nowrap;
}

.ekstre-breakdown-table th {
  color: #475569;
  font-weight: 700;
  background: rgba(241, 245, 249, 0.85);
}

.ekstre-breakdown-total td {
  font-weight: 700;
  background: rgba(224, 242, 254, 0.6);
}

.ekstre-dash-bar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: nowrap;
  gap: 0.15rem;
  padding: 0.5rem 1rem;
  background: #475569;
  color: #fff;
  overflow-x: auto;
  overflow-y: hidden;
}

.ekstre-dash-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  padding: 0.2rem 0.3rem;
  background: transparent;
  border: none;
  color: #fff;
  font-size: 0.72rem;
  font-weight: 500;
  cursor: default;
  border-radius: 6px;
  white-space: nowrap;
}

.ekstre-dash-btn:hover {
  background: rgba(255, 255, 255, 0.1);
}

.ekstre-dash-icon {
  width: 11px;
  height: 11px;
  flex-shrink: 0;
}

.ekstre-dash-bar-right {
  display: flex;
  align-items: center;
  gap: 0.15rem;
  flex-shrink: 0;
  margin-left: 0;
}

.ekstre-dash-body {
  padding: 1rem 1rem 25rem;
  background: #fff;
}

.ekstre-dash-header-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.15rem;
}

.ekstre-dash-header-row .ekstre-dash-name {
  flex-shrink: 0;
  margin: 0;
}

.ekstre-dash-header-row .ekstre-dash-filters {
  flex-shrink: 1;
  min-width: 0;
  justify-content: flex-end;
}

.ekstre-dash-name {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-text);
}

.ekstre-dash-sub {
  font-size: 0.7rem;
  color: var(--color-text-muted);
  margin: 0;
}

.ekstre-dash-sub-row {
  margin-bottom: 0.75rem;
}

.ekstre-dash-pills {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.ekstre-pill {
  padding: 0.25rem 0.6rem;
  font-size: 0.7rem;
  font-weight: 500;
  border-radius: 6px;
  background: #f1f5f9;
  color: var(--color-text-muted);
}

.ekstre-pill-active {
  background: #475569;
  color: #fff;
}

.ekstre-dash-records {
  margin-left: auto;
  font-size: 0.7rem;
  color: var(--color-text-muted);
}

.ekstre-dash-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.ekstre-summary-card {
  padding: 0.5rem 0.6rem;
  background: #f8fafc;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
}

.ekstre-summary-label {
  display: block;
  font-size: 0.65rem;
  color: var(--color-text-muted);
  margin-bottom: 0.2rem;
}

.ekstre-summary-value {
  font-size: 0.85rem;
  font-weight: 700;
}

.ekstre-value-red {
  color: #dc2626;
}

.ekstre-value-green {
  color: #16a34a;
}

.ekstre-dash-filters {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-bottom: 0;
  margin-left: 0;
  padding-left: 0;
}

.ekstre-filter-pill {
  padding: 0.12rem 0.3rem;
  font-size: 0.58rem;
  font-weight: 500;
  border-radius: 4px;
  background: #f1f5f9;
  color: var(--color-text-muted);
}

.ekstre-filter-active {
  background: #475569;
  color: #fff;
}

.ekstre-filter-right {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  font-size: 0.58rem;
  color: var(--color-text-muted);
  margin-left: auto;
  min-height: 20px;
  line-height: 1;
}

.ekstre-filter-right .ekstre-dash-icon,
.ekstre-filter-btn .ekstre-dash-icon {
  width: 9px;
  height: 9px;
  flex-shrink: 0;
}

.ekstre-filter-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.12rem 0.3rem;
  font-size: 0.58rem;
  font-weight: 500;
  line-height: 1;
  min-height: 20px;
  background: #16a34a;
  color: #fff;
  border: none;
  border-radius: 4px;
  cursor: default;
}

.ekstre-dash-dates {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.6rem;
  flex-wrap: wrap;
}

.ekstre-date-select {
  padding: 0.35rem 0.6rem;
  font-size: 0.7rem;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #fff;
  color: var(--color-text);
}

.ekstre-date-input {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.5rem;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #fff;
}

.ekstre-date-input input {
  border: none;
  background: transparent;
  font-size: 0.7rem;
  width: 70px;
  outline: none;
}

.ekstre-date-input .ekstre-dash-icon {
  width: 12px;
  height: 12px;
  color: var(--color-text-muted);
}

.ekstre-filtrele-btn {
  padding: 0.35rem 0.75rem;
  font-size: 0.7rem;
  font-weight: 600;
  background: #16a34a;
  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: default;
}

.ekstre-dash-table-wrap {
  overflow-x: auto;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
}

.ekstre-dash-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.65rem;
}

.ekstre-dash-table th,
.ekstre-dash-table td {
  padding: 0.35rem 0.5rem;
  text-align: left;
  border-bottom: 1px solid #f1f5f9;
}

.ekstre-dash-table th {
  background: #f8fafc;
  font-weight: 600;
  color: var(--color-text-muted);
}

.ekstre-dash-table tbody tr:last-child td {
  border-bottom: none;
}

.ekstre-type {
  display: inline-block;
  padding: 0.15rem 0.4rem;
  border-radius: 4px;
  font-size: 0.6rem;
  font-weight: 600;
}

.ekstre-type-green {
  background: #dcfce7;
  color: #166534;
}

.ekstre-type-red {
  background: #fee2e2;
  color: #991b1b;
}

.ekstre-green {
  color: #16a34a !important;
  font-weight: 600;
}

.ekstre-red {
  color: #dc2626 !important;
  font-weight: 600;
}

.ekstre-gear {
  width: 14px;
  height: 14px;
  color: var(--color-text-muted);
}

.ekstre-timeline {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding: 2rem 2rem 2.5rem;
  gap: 0.5rem;
}

.ekstre-timeline-line {
  position: absolute;
  bottom: calc(1.5rem + 8px);
  left: 2rem;
  right: 2rem;
  height: 2px;
  background: #e5e7eb;
  z-index: 0;
}

.ekstre-step {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  flex: 1;
  max-width: 140px;
}

.ekstre-step-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #e5e7eb;
  border: 2px solid #e5e7eb;
  flex-shrink: 0;
}

.ekstre-step-active .ekstre-step-dot {
  background: #1e40af;
  border-color: #1e40af;
}

.ekstre-step-label {
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--color-text-muted);
  text-align: center;
  line-height: 1.2;
}

.ekstre-step-active .ekstre-step-label {
  color: var(--color-text);
  font-weight: 600;
}

@media (max-width: 768px) {
  .ekstre-dash-cards {
    grid-template-columns: 1fr;
  }
  .ekstre-dash-bar {
    flex-direction: row;
    align-items: center;
  }
  .ekstre-dash-bar-right {
    margin-left: 0;
  }
  .ekstre-timeline {
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
  }
  .ekstre-timeline-line {
    display: none;
  }
  .ekstre-step {
    max-width: none;
  }
}

.banks {
  background: var(--site-flow-solid-bg) !important;
  background-color: var(--site-flow-solid-bg) !important;
  background-image: none !important;
  overflow: hidden;
  padding: 20px 0 0;
  position: relative;
  z-index: 5;
}

#site-yonetimi.banks,
#alacak-yonetimi.alacak-section,
#sms.comm-section,
#bankalar-sms.banks {
  background: #fff !important;
  background-color: #fff !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  border: none !important;
  margin-top: 0 !important;
  outline: none !important;
}

.faiz-overlap-root {
  position: relative;
  z-index: 8;
  background: #000;
  margin-top: clamp(-2.2rem, -5vw, -1.2rem);
  max-width: none;
  box-sizing: border-box;
  
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  width: 100vw;
}

#faiz-hesaplama.faiz-section {
  background: transparent !important;
  background-color: transparent !important;
  border-radius: clamp(2rem, 6vw, 3.75rem) clamp(2rem, 6vw, 3.75rem) 0 0 !important;
  box-shadow: none !important;
  border: none !important;
  margin-top: 0 !important;
  outline: none !important;
  position: relative;
  overflow: hidden;
  padding: 1.85rem 0 calc(1.85rem + clamp(0.35rem, 1.2vw, 0.7rem)) 0;
}

#faiz-hesaplama.faiz-section::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  z-index: 0;
  pointer-events: none;
  background: #fff;
}

#faiz-hesaplama.faiz-section > .faiz-inner {
  position: relative;
  z-index: 1;
}

#tahsilat .banks-inner {
  padding-top: 1.75rem;
}

.setup-section-title:not(.shopify-hero-title) {
  margin: 0.5rem 0 0;
  max-width: 22rem;
  font-family: var(--font-sans);
  font-size: clamp(1.35rem, 2.5vw, 1.75rem);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.03em;
  color: #0f172a;
}

@media (min-width: 1024px) {
  .setup-section-title:not(.shopify-hero-title) {
    max-width: 26rem;
  }
}

#tahsilat.banks {
  overflow-anchor: none;
  contain: layout;
}

@media (max-width: 1023px) {
  #tahsilat .setup-grid--reversed {
    display: flex;
    flex-direction: column;
    gap: 2rem;
  }
}

.banks-inner {
  max-width: 80rem;
  margin: 0 auto;
  padding: 1.2rem 1.25rem 1.6rem;
}

.banks-card {
  position: relative;
  border-radius: 0;
  overflow: visible;
  min-height: auto;
  background: transparent;
  border: none;
}

@media (min-width: 1024px) {
  .banks-card {
    min-height: 480px;
  }
}

.banks-card-overlay {
  display: none;
}

.banks-tabs {
  position: relative;
  z-index: 2;
  display: flex;
  gap: 2.5rem;
  padding: 1.5rem 1.75rem 0.75rem;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}

.banks-tab {
  font-size: 0.9rem;
  font-weight: 500;
  color: #64748b;
  padding-bottom: 0.4rem;
}

.banks-tab-active {
  color: #0f172a;
  border-bottom: 2px solid #ec4899;
}

.banks-top {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 4rem;
  align-items: center;
  padding: 2.2rem 0 2.2rem;
}

@media (min-width: 768px) {
  .banks-top {
    padding-left: 0;
    padding-right: 0;
  }
}

@media (min-width: 1024px) {
  .banks-top {
    grid-template-columns: 1fr 1fr;
    padding: 2.2rem 0 2.2rem;
  }
}

@media (min-width: 1024px) {
  .banks-top {
    grid-template-columns: 1fr 1fr;
  }
}

.banks-content {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  color: #0f172a;
  max-width: 32rem;
  
  margin-left: 0;
}

.banks-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  width: fit-content;
  padding: 0.35rem 0.8rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #4338ca;
  background: rgba(99, 102, 241, 0.12);
  border: 1px solid rgba(99, 102, 241, 0.22);
  margin: 0;
}

.banks-title {
  font-size: 1.875rem;
  font-weight: 700;
  line-height: 1.25;
  margin: 0;
  color: #0f172a;
}

.banks-title-accent {
  background: linear-gradient(120deg, #4f46e5 0%, #6366f1 35%, #0ea5e9 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

@media (min-width: 640px) {
  .banks-title {
    font-size: 2.25rem;
  }
}

@media (min-width: 1024px) {
  .banks-title {
    font-size: 3rem;
  }
}

.banks-desc {
  font-size: 1.125rem;
  color: #475569;
  line-height: 1.75;
  margin: 0;
}

.banks-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}

.banks-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.25rem 0.85rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: #e0f2fe;
  color: #0369a1;
}

.banks-meta-text {
  font-size: 0.875rem;
  color: #64748b;
}

.banks-list {
  list-style: none;
  padding: 0;
  margin: 0.2rem 0 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  background: transparent;
  border: none;
  box-shadow: none;
}

.banks-list-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.banks-list-item span {
  color: #1f2933;
  font-size: 0.98rem;
  line-height: 1.35;
}

.banks-check-icon {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.4rem;
  height: 1.4rem;
  border-radius: 50%;
  background: rgba(99, 102, 241, 0.12);
  font-size: 0.65rem;
  color: #4f46e5;
  font-weight: 900;
  margin-top: 0.05rem;
}

.banks-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  padding: 0.75rem 1rem;
  background: #2563eb;
  color: #fff;
  font-weight: 500;
  font-size: 1rem;
  font-family: var(--font-sans);
  border-radius: var(--radius);
  border: 1px solid transparent;
  text-decoration: none;
  transition: background 0.2s, color 0.2s;
}

.banks-cta:hover {
  background: #1d4ed8;
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.4);
}

.banks-card-bottom {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 4.25rem;
  border-top: 1px solid #e5e7eb;
  background: rgba(99, 102, 241, 0.08);
}

.banks-card-bottom-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: #1e293b;
  text-decoration: none;
  transition: color 0.2s ease;
}

.banks-card-bottom-link:hover {
  color: #2563eb;
}

.banks-visual {
  display: none;
  position: relative;
  overflow: visible;
}

@media (min-width: 1024px) {
  .banks-visual {
    display: block;
  }
}

.banks-hub {
  position: relative;
  width: 440px;
  height: 440px;
  flex-shrink: 0;
  margin: 0 auto;
}

.banks-hub-diagram {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: visible;
}

.banks-hub-lines {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: visible;
}

.banks-hub-lines .banks-hub-circle {
  fill: none;
  stroke: rgba(99, 102, 241, 0.25);
  stroke-linecap: round;
  animation: banks-hub-ring-pulse 4.2s ease-in-out infinite;
  transform-origin: 50% 50%;
  transform-box: fill-box;
}

.banks-hub-lines .banks-hub-circle:first-of-type {
  stroke: rgba(99, 102, 241, 0.18);
  stroke-width: 1.1;
  animation-delay: 0s;
}

.banks-hub-lines .banks-hub-circle:nth-of-type(2) {
  stroke: rgba(79, 70, 229, 0.35);
  stroke-width: 1.3;
  animation-delay: 0.6s;
}

.banks-hub-lines .banks-hub-circle:nth-of-type(3) {
  stroke: rgba(67, 56, 202, 0.45);
  stroke-width: 1.8;
  animation-delay: 1.2s;
}

@keyframes banks-hub-ring-pulse {
  0%, 100% {
    opacity: 0.72;
    filter: drop-shadow(0 0 0 rgba(37, 99, 235, 0));
  }
  50% {
    opacity: 1;
    filter: drop-shadow(0 0 11px rgba(37, 99, 235, 0.3));
  }
}

.banks-hub-lines .banks-hub-line {
  fill: none;
  stroke: rgba(255, 255, 255, 0.32);
  stroke-width: 1;
  stroke-linecap: round;
}

.banks-hub-lines .banks-hub-line-center {
  stroke: rgba(255, 255, 255, 0.28);
  stroke-width: 1;
}

.banks-hub-lines .banks-hub-line-mesh {
  stroke: rgba(255, 255, 255, 0.22);
  stroke-width: 1;
}

.banks-hub-lines .banks-hub-line-outer {
  stroke: rgba(255, 255, 255, 0.25);
  stroke-width: 1;
}

.banks-hub-center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 12px 40px rgba(15, 23, 42, 0.25), 0 0 0 1px rgba(15, 23, 42, 0.04);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  z-index: 2;
  animation: banks-hub-pulse 4s ease-in-out infinite;
}

@keyframes banks-hub-pulse {
  0%, 100% { transform: translate(-50%, -50%) scale(1); }
  50% { transform: translate(-50%, -50%) scale(1.05); }
}

.banks-hub-center img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: none;
}

.banks-hub-center .banks-hub-center-logo {
  width: 80%;
  height: 80%;
}

.banks-hub-orbits {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: visible;
}

.banks-hub-orbit {
  position: absolute;
  inset: 0;
  transform-origin: 50% 50%;
}

.banks-hub-orbit-inner {
  animation: banks-hub-orbit-left 60s linear infinite;
}

.banks-hub-orbit-outer {
  animation: banks-hub-orbit-right 60s linear infinite;
}

@keyframes banks-hub-orbit-left {
  to { transform: rotate(-360deg); }
}

@keyframes banks-hub-orbit-right {
  to { transform: rotate(360deg); }
}

.banks-hub-item {
  position: absolute;
  width: 68px;
  height: 68px;
  margin: -34px 0 0 -34px;
  z-index: 1;
  transform-origin: 50% 50%;
}

.banks-hub-orbit-inner .banks-hub-item {
  animation: banks-hub-counter-right 60s linear infinite;
}

.banks-hub-orbit-outer .banks-hub-item {
  animation: banks-hub-counter-left 60s linear infinite;
}

@keyframes banks-hub-counter-right {
  to { transform: rotate(360deg); }
}

@keyframes banks-hub-counter-left {
  to { transform: rotate(-360deg); }
}

.banks-hub-item[data-ring="inner"][data-pos="0"] { left: 75.5%; top: 35.25%; }
.banks-hub-item[data-ring="inner"][data-pos="1"] { left: 50%; top: 20.5%; }
.banks-hub-item[data-ring="inner"][data-pos="2"] { left: 24.5%; top: 35.25%; }
.banks-hub-item[data-ring="inner"][data-pos="3"] { left: 24.5%; top: 64.75%; }
.banks-hub-item[data-ring="inner"][data-pos="4"] { left: 50%; top: 79.5%; }
.banks-hub-item[data-ring="inner"][data-pos="5"] { left: 75.5%; top: 64.75%; }

.banks-hub-item[data-ring="outer"][data-pos="0"] { left: 98%; top: 50%; }
.banks-hub-item[data-ring="outer"][data-pos="1"] { left: 84%; top: 16%; }
.banks-hub-item[data-ring="outer"][data-pos="2"] { left: 50%; top: 2%; }
.banks-hub-item[data-ring="outer"][data-pos="3"] { left: 16%; top: 16%; }
.banks-hub-item[data-ring="outer"][data-pos="4"] { left: 2%; top: 50%; }
.banks-hub-item[data-ring="outer"][data-pos="5"] { left: 16%; top: 84%; }
.banks-hub-item[data-ring="outer"][data-pos="6"] { left: 50%; top: 98%; }
.banks-hub-item[data-ring="outer"][data-pos="7"] { left: 84%; top: 84%; }

.banks-hub-logo {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 0, 0, 0.06);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
}

.banks-hub-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.banks-logos-wrap {
  width: 100%;
  padding-top: 0.625rem;
  padding-bottom: 1.25rem;
  margin-bottom: 1.25rem;
}

.banks-subtitle {
  font-size: 1.125rem;
  font-weight: 600;
  color: #fff;
  text-align: center;
  letter-spacing: 0.025em;
  margin: 0 0 2rem;
}

.banks-logos-scroll {
  position: relative;
  overflow: hidden;
}

.banks-logos-track {
  display: flex;
  gap: 2rem;
}

.banks-logos-set {
  display: flex;
  gap: 2rem;
  flex-shrink: 0;
}

.bank-card {
  flex-shrink: 0;
  width: 180px;
  height: 7rem;
  background: #fff;
  border-radius: 0.5rem;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem 2rem;
}

.bank-card img {
  height: 3.5rem;
  width: auto;
  object-fit: contain;
}

.setup-block {
  position: relative;
  z-index: 10;
  padding: 3rem 1rem 4rem;
}
@media (min-width: 768px) {
  .setup-block {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
@media (min-width: 1024px) {
  .setup-block {
    padding: 3rem 2rem 4rem; 
  }
}

.setup-block .comm-eyebrow-row {
  margin-bottom: 0.75rem;
  justify-content: flex-start;
}

.setup-block .comm-heading {
  margin-bottom: 1rem;
  text-align: left;
  font-family: var(--font-sans);
  font-size: 1.75rem;
  font-weight: 800;
  line-height: 1.15;
  color: #1A202C;
}
@media (min-width: 768px) {
  .setup-block .comm-heading {
    font-size: 2rem;
  }
}
@media (min-width: 1024px) {
  .setup-block .comm-heading {
    font-size: 2.25rem;
  }
}
.setup-block .comm-desc {
  margin-bottom: 1.5rem;
  font-size: 0.9375rem;
  line-height: 1.65;
  color: #4D5765;
  max-width: none;
}

.setup-side-title {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 1rem;
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.2;
  color: #111827;
}

.setup-side-title-icon {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, #f1f5f9 0%, #e2e8f0 100%);
  color: #111827;
  font-size: 17px;
}

@media (min-width: 1024px) {
  .setup-side-title {
    font-size: 1.5rem;
  }
}

.setup-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.75rem;
  align-items: center;
}

@media (min-width: 1024px) {
  .setup-grid {
    grid-template-columns: 1.6fr 1fr;
    gap: 3rem;
    align-items: start;
  }
}

.setup-steps--columns .setup-steps-columns {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem 1.25rem;
  width: 100%;
  margin: 0.25rem 0 0;
  text-align: left;
  align-items: stretch;
}

@media (max-width: 900px) {
  .setup-steps--columns .setup-steps-columns {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.15rem;
  }
}

@media (max-width: 520px) {
  .setup-steps--columns .setup-steps-columns {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
}

.setup-steps--columns .setup-step-column {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  margin: 0;
  padding: 1.1rem 1.2rem 1.2rem;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #fff;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 4px 16px -4px rgba(15, 23, 42, 0.07);
  text-align: left;
  cursor: pointer;
  transition:
    border-color 0.22s ease,
    box-shadow 0.22s ease,
    background 0.22s ease,
    transform 0.22s ease;
}

.setup-steps--columns .setup-step-column:hover {
  border-color: #cbd5e1;
  box-shadow:
    0 4px 12px -2px rgba(15, 23, 42, 0.08),
    0 12px 28px -8px rgba(59, 127, 185, 0.12);
  transform: translateY(-2px);
}

.setup-steps--columns .setup-step-column:focus-visible {
  outline: none;
  border-color: #3b7fb9;
  box-shadow:
    0 0 0 3px rgba(59, 127, 185, 0.28),
    0 4px 16px -4px rgba(59, 127, 185, 0.15);
}

.setup-steps--columns .setup-step-column.setup-card-active {
  border-color: rgba(59, 127, 185, 0.42);
  background: linear-gradient(180deg, #f8fafc 0%, #eff6ff 55%, #f0f9ff 100%);
  box-shadow:
    0 1px 2px rgba(37, 99, 235, 0.06),
    0 8px 28px -6px rgba(37, 99, 235, 0.18);
}

.setup-steps--columns .setup-step-column.setup-card-done:not(.setup-card-active) {
  border-color: #bae6fd;
  background: #fafafa;
}

.setup-steps--columns .setup-step-column-title {
  margin: 0 0 0.55rem;
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.28;
  letter-spacing: -0.02em;
  color: #0f172a;
}

.setup-steps--columns .setup-step-column.setup-card-active .setup-step-column-title {
  color: #1e40af;
}

.setup-steps--columns .setup-step-column-desc {
  margin: 0;
  flex: 1;
  font-size: 0.875rem;
  line-height: 1.62;
  font-weight: 500;
  color: #64748b;
}

.setup-steps--columns .setup-step-column .setup-card-progress--column-top {
  position: relative;
  bottom: auto;
  left: auto;
  order: -1;
  flex-shrink: 0;
  margin: 0 0 0.85rem;
  height: 4px;
  width: 100%;
  border-radius: 999px;
  overflow: hidden;
  background: #e2e8f0;
  opacity: 1;
}

.setup-steps--columns .setup-step-column.setup-card-active .setup-card-progress--column-top {
  opacity: 1;
  background: #e2e8f0;
}

.setup-steps--columns .setup-step-column .setup-card-progress--column-top .setup-card-progress-fill {
  position: relative;
  top: auto;
  left: auto;
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #3b7fb9 0%, #2563eb 100%);
  width: 0;
  transition: width 0.2s ease;
}

.setup-steps--columns .setup-step-column.setup-card-done .setup-card-progress--column-top .setup-card-progress-fill {
  width: 100% !important;
}

.setup-steps--columns .setup-step-column:not(.setup-card-active):not(.setup-card-done) .setup-card-progress--column-top .setup-card-progress-fill {
  width: 0 !important;
}

.setup-mockup-wrap {
  margin-bottom: 0;
}

.setup-mockup-caption {
  margin: 0.65rem 0 0;
  font-size: 0.75rem;
  line-height: 1.35;
  font-weight: 500;
  color: #94a3b8;
  text-align: center;
  letter-spacing: 0.02em;
}

@media (min-width: 1024px) {
  
  .setup-grid .setup-mockup-wrap {
    margin-left: -12%;
    margin-right: 0;
  }
  
  .setup-grid--reversed .setup-mockup-wrap {
    margin-left: 0;
    margin-right: -12%;
  }
}

.setup-mockup-wrap.is-mockup-steps .setup-mockup-panel {
  display: none;
  margin-top: 0;
}
.setup-mockup-wrap.is-mockup-steps .setup-mockup-panel--active {
  display: block;
}

.setup-tahsilat-step-placeholder {
  min-height: 280px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 2rem 1.5rem;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  color: #334155;
}
.setup-tahsilat-step-placeholder-ico {
  font-size: 2.5rem;
  color: #0f766e;
  margin-bottom: 1rem;
  opacity: 0.9;
}
.setup-tahsilat-step-placeholder-title {
  margin: 0 0 0.5rem;
  font-size: 1.125rem;
  font-weight: 700;
  color: #0f172a;
}
.setup-tahsilat-step-placeholder-desc {
  margin: 0;
  max-width: 22rem;
  font-size: 0.9rem;
  line-height: 1.5;
  color: #64748b;
}

.setup-mockup-panel5 .ttp5-mockup {
  min-height: 380px;
}

.setup-mockup-panel5 .kisiler-submenu-open--finans3 {
  max-height: 220px;
}
.setup-mockup-panel5 .kisiler-menu-group > .kisiler-menu-btn.kisiler-menu-active {
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.06);
}
.setup-mockup-panel5 .kisiler-submenu-link.kisiler-submenu-active {
  background: rgba(71, 85, 105, 0.72) !important;
  color: #fff !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
}
.setup-mockup-panel5 .kisiler-submenu-link.kisiler-submenu-active .kisiler-submenu-icon {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #fff !important;
}
.setup-mockup-panel5 .kisiler-main.tg-main.ttp5-main {
  position: relative;
  background: #eef1f5 !important;
  padding: 6px !important;
}
.setup-mockup-panel5 .ttp5-demo-toast {
  position: absolute;
  left: 50%;
  bottom: 10px;
  transform: translateX(-50%) translateY(12px);
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  font-size: 7px;
  font-weight: 700;
  color: #14532d;
  background: #dcfce7;
  border: 1px solid #86efac;
  border-radius: 999px;
  box-shadow: 0 4px 14px rgba(22, 101, 52, 0.15);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease, transform 0.25s ease;
  z-index: 4;
  white-space: nowrap;
  max-width: calc(100% - 16px);
}
.setup-mockup-panel5 .ttp5-demo-toast--visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.setup-mockup-panel5 .ttp5-demo-toast-ico {
  color: #16a34a;
  font-size: 9px;
}
#tahsilat .tahsilat-kayit-modal-box {
  max-width: min(440px, 96vw);
}
.setup-mockup-panel6 .tt6-topbar-muted {
  opacity: 0.72;
  cursor: default;
  box-shadow: none !important;
}
.setup-mockup-panel6 .tt6-mockup {
  min-height: 400px;
}
.setup-mockup-panel6 .kisiler-main.tg-main.tt6-main {
  background: #eef1f5 !important;
  padding: 6px !important;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.setup-mockup-panel6 .tt6-kpi-row {
  display: flex;
  gap: 5px;
  flex-shrink: 0;
}
.setup-mockup-panel6 .tt6-kpi {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  background: #fff;
  border: 1px solid #e8ecf1;
  border-radius: 10px;
  padding: 6px 7px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}
.setup-mockup-panel6 .tt6-kpi--rate {
  flex: 1.15;
}
.setup-mockup-panel6 .tt6-kpi-ring {
  --tt6-pct: 0;
  width: 34px;
  height: 34px;
  flex-shrink: 0;
  border-radius: 50%;
  background: conic-gradient(#10b981 calc(var(--tt6-pct) * 1%), #e2e8f0 0);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.04);
}
.setup-mockup-panel6 .tt6-kpi-ring::after {
  content: '';
  position: absolute;
  inset: 5px;
  background: #fff;
  border-radius: 50%;
}
.setup-mockup-panel6 .tt6-kpi-ring-label {
  position: relative;
  z-index: 1;
  font-size: 7px;
  font-weight: 800;
  color: #047857;
  letter-spacing: -0.03em;
}
.setup-mockup-panel6 .tt6-kpi-ico {
  width: 22px;
  height: 22px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  flex-shrink: 0;
}
.setup-mockup-panel6 .tt6-kpi-ico--warn {
  background: rgba(245, 158, 11, 0.15);
  color: #d97706;
}
.setup-mockup-panel6 .tt6-kpi-ico--alert {
  background: rgba(239, 68, 68, 0.12);
  color: #dc2626;
}
.setup-mockup-panel6 .tt6-kpi-ico--ok {
  background: rgba(16, 185, 129, 0.14);
  color: #059669;
}
.setup-mockup-panel6 .tt6-kpi-text span {
  display: block;
  font-size: 5px;
  font-weight: 600;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  line-height: 1.2;
}
.setup-mockup-panel6 .tt6-kpi-text strong {
  display: block;
  font-size: 8.5px;
  font-weight: 800;
  color: #1e293b;
  line-height: 1.15;
}
.setup-mockup-panel6 .tt6-kpi-amount {
  color: #b45309 !important;
  font-size: 7.5px !important;
  letter-spacing: -0.02em;
}
.setup-mockup-panel6 .tt6-kpi-amount--pos {
  color: #047857 !important;
}
.setup-mockup-panel6 .tt6-body {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 6px;
  flex: 1;
  min-height: 0;
}
@media (max-width: 520px) {
  .setup-mockup-panel6 .tt6-body {
    grid-template-columns: 1fr;
  }
}
.setup-mockup-panel6 .tt6-panel {
  background: #fff;
  border: 1px solid #e8ecf1;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.setup-mockup-panel6 .tt6-panel-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 8px 4px;
  border-bottom: 1px solid #f1f5f9;
  flex-shrink: 0;
}
.setup-mockup-panel6 .tt6-panel-title {
  font-size: 7px;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: 0.02em;
}
.setup-mockup-panel6 .tt6-panel-hint {
  font-size: 5.5px;
  font-weight: 600;
  color: #94a3b8;
}
.setup-mockup-panel6 .tt6-panel--chart {
  min-height: 120px;
}
.setup-mockup-panel6 .tt6-bars {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 4px;
  padding: 8px 10px 10px;
  flex: 1;
  min-height: 100px;
}
.setup-mockup-panel6 .tt6-bar-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-width: 0;
}
.setup-mockup-panel6 .tt6-bar {
  width: 100%;
  max-width: 22px;
  min-height: 8px;
  border-radius: 4px 4px 2px 2px;
  background: linear-gradient(180deg, #93c5fd 0%, #3b82f6 100%);
  align-self: flex-end;
  box-shadow: 0 1px 2px rgba(37, 99, 235, 0.2);
}
.setup-mockup-panel6 .tt6-bar--hi {
  background: linear-gradient(180deg, #6ee7b7 0%, #10b981 100%);
  box-shadow: 0 1px 3px rgba(16, 185, 129, 0.35);
}
.setup-mockup-panel6 .tt6-bar-wrap--hi .tt6-bar-cap {
  color: #047857;
  font-weight: 800;
}
.setup-mockup-panel6 .tt6-bar-cap {
  font-size: 5px;
  font-weight: 700;
  color: #64748b;
  white-space: nowrap;
}
.setup-mockup-panel6 .tt6-tablo-wrap {
  overflow: auto;
  max-height: 200px;
  padding: 0 2px 4px;
}
.setup-mockup-panel6 .tt6-tablo {
  width: 100%;
  border-collapse: collapse;
  font-size: 6px;
}
.setup-mockup-panel6 .tt6-tablo th {
  text-align: left;
  padding: 5px 6px;
  font-size: 5px;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-bottom: 1px solid #e2e8f0;
  background: #f8fafc;
}
.setup-mockup-panel6 .tt6-th-num {
  text-align: right;
}
.setup-mockup-panel6 .tt6-tablo td {
  padding: 5px 6px;
  border-bottom: 1px solid #f1f5f9;
  vertical-align: middle;
  color: #334155;
}
.setup-mockup-panel6 .tt6-td-name {
  font-weight: 600;
  color: #1e293b;
  font-size: 6.5px;
}
.setup-mockup-panel6 .tt6-tablo .tablo-badge {
  font-size: 5px;
  padding: 2px 6px;
}
.setup-mockup-panel6 .tt6-bolum {
  display: inline-flex;
  padding: 2px 6px;
  font-size: 5.8px;
  font-weight: 700;
  color: #6d28d9;
  background: #ede9fe;
  border-radius: 999px;
}
.setup-mockup-panel6 .tt6-td-tutar {
  text-align: right;
  font-weight: 800;
  font-size: 6.5px;
  color: #334155;
  white-space: nowrap;
}
.setup-mockup-panel6 .tt6-td-tutar--ok {
  color: #15803d;
}
.setup-mockup-panel6 .tt6-td-tutar--late {
  color: #b91c1c;
}
.setup-mockup-panel6 .tt6-footnote {
  margin: 0;
  padding: 5px 8px 6px;
  font-size: 5.5px;
  line-height: 1.45;
  color: #64748b;
  background: #f8fafc;
  border: 1px dashed #e2e8f0;
  border-radius: 8px;
  flex-shrink: 0;
}
.setup-mockup-panel6 .tt6-footnote i {
  color: #3b82f6;
  margin-right: 4px;
}
.setup-mockup-panel5 .ttp5-stats-row {
  display: flex;
  gap: 5px;
  padding: 0 0 6px;
  flex-shrink: 0;
}
.setup-mockup-panel5 .ttp5-stat {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 5px;
  background: #fff;
  border: 1px solid #e8ecf1;
  border-radius: 10px;
  padding: 5px 6px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}
.setup-mockup-panel5 .ttp5-stat-ico {
  width: 20px;
  height: 20px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  flex-shrink: 0;
}
.setup-mockup-panel5 .ttp5-stat-ico--doc {
  background: rgba(40, 167, 69, 0.12);
  color: #28a745;
}
.setup-mockup-panel5 .ttp5-stat-ico--month {
  background: rgba(37, 99, 235, 0.1);
  color: #2563eb;
}
.setup-mockup-panel5 .ttp5-stat-ico--week {
  background: rgba(124, 58, 237, 0.1);
  color: #7c3aed;
}
.setup-mockup-panel5 .ttp5-stat-ico--tl {
  background: rgba(40, 167, 69, 0.12);
  color: #28a745;
}
.setup-mockup-panel5 .ttp5-stat-text span {
  display: block;
  font-size: 5px;
  font-weight: 600;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  line-height: 1.2;
}
.setup-mockup-panel5 .ttp5-stat-text strong {
  display: block;
  font-size: 9px;
  font-weight: 800;
  color: #1e293b;
  line-height: 1.15;
}
.setup-mockup-panel5 .ttp5-stat-tl {
  font-size: 7px !important;
  color: #28a745 !important;
  letter-spacing: -0.02em;
}
.setup-mockup-panel5 .ttp5-card {
  position: relative;
  margin: 0;
  flex: 1;
  min-height: 0;
  border-radius: 10px !important;
  border: 1px solid #e8ecf1 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
  overflow: hidden;
}
.setup-mockup-panel5 .ttp5-tabs-excel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 5px 8px 0;
  background: #fff;
  border-bottom: 1px solid #eef1f5;
  flex-wrap: wrap;
}
.setup-mockup-panel5 .ttp5-tabs {
  display: flex;
  align-items: flex-end;
  gap: 1px;
  flex-wrap: wrap;
  min-width: 0;
}
.setup-mockup-panel5 .ttp5-tab {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 5px 6px 6px;
  font-size: 6px;
  font-weight: 600;
  color: #64748b;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  cursor: default;
  white-space: nowrap;
}
.setup-mockup-panel5 .ttp5-tab-ico {
  font-size: 7px;
  opacity: 0.85;
}
.setup-mockup-panel5 .ttp5-tab-active {
  color: #2563eb;
  border-bottom-color: #2563eb;
}
.setup-mockup-panel5 .ttp5-tab-active .ttp5-tab-ico {
  color: #2563eb;
}
.setup-mockup-panel5 .ttp5-tab-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 12px;
  height: 12px;
  padding: 0 3px;
  font-size: 5.5px;
  font-weight: 700;
  background: #eff6ff;
  color: #1d4ed8;
  border-radius: 4px;
}
.setup-mockup-panel5 .ttp5-tab-badge-muted {
  background: #f1f5f9;
  color: #94a3b8;
}
.setup-mockup-panel5 .ttp5-excel-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 18px;
  padding: 0 8px;
  font-size: 6.5px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(to bottom, #34d399, #10b981);
  border: none;
  border-radius: 7px;
  cursor: default;
  box-shadow: 0 1px 2px rgba(16, 185, 129, 0.35);
}
.setup-mockup-panel5 .ttp5-excel-btn i {
  font-size: 7px;
}
.setup-mockup-panel5 .ttp5-filters {
  padding: 7px 8px !important;
  background: #fafbfc;
  border-bottom: 1px solid #eef1f5 !important;
}
.setup-mockup-panel5 .ttp5-btn-filter-green {
  background: linear-gradient(to bottom, #34d399, #28a745) !important;
  border: none !important;
  box-shadow: 0 1px 2px rgba(40, 167, 69, 0.25);
}
.setup-mockup-panel5 .ttp5-btn-clear-outline {
  background: #fff !important;
  color: #64748b !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: none !important;
}
.setup-mockup-panel5 .ttp5-table-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 8px;
  background: #fff;
  border-bottom: 1px solid #eef1f5;
}
.setup-mockup-panel5 .ttp5-toolbar-count {
  font-size: 6.5px;
  font-weight: 600;
  color: #64748b;
}
.setup-mockup-panel5 .ttp5-bulk-delete {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 17px;
  padding: 0 7px;
  font-size: 6px;
  font-weight: 600;
  color: #94a3b8;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  cursor: not-allowed;
  opacity: 0.75;
}
.setup-mockup-panel5 .ttp5-bulk-delete i {
  font-size: 6px;
}
.setup-mockup-panel5 .ttp5-bulk-delete:disabled {
  pointer-events: none;
}
.setup-mockup-panel5 .ttp5-tablo-wrap {
  max-height: 210px;
  overflow: auto;
  background: #fff;
}
.setup-mockup-panel5 .ttp5-tablo .tg-tablo-empty-row .ttp5-tablo-empty {
  text-align: center;
  padding: 18px 10px !important;
  font-size: 6.5px !important;
  color: #94a3b8 !important;
  white-space: normal !important;
}
.setup-mockup-panel5 .ttp5-tablo .ttp5-cell-desc {
  white-space: normal;
  max-width: 130px;
  font-size: 5.8px;
  line-height: 1.4;
  color: #475569;
  vertical-align: middle;
}
.setup-mockup-panel5 .ttp5-tablo td {
  padding: 6px 4px !important;
  vertical-align: middle;
}
.setup-mockup-panel5 .ttp5-tablo thead th {
  padding: 6px 4px !important;
  font-size: 5px !important;
}
.setup-mockup-panel5 .ttp5-check {
  width: 10px !important;
  height: 10px !important;
  accent-color: #334155;
  cursor: default;
}
.setup-mockup-panel5 .ttp5-kisi-cell {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
}
.setup-mockup-panel5 .ttp5-avatar {
  width: 17px;
  height: 17px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 5.5px;
  font-weight: 800;
  color: #fff;
  flex-shrink: 0;
}
.setup-mockup-panel5 .ttp5-avatar--purple {
  background: linear-gradient(135deg, #a855f7, #7c3aed);
}
.setup-mockup-panel5 .ttp5-avatar--blue {
  background: linear-gradient(135deg, #3b82f6, #2563eb);
}
.setup-mockup-panel5 .ttp5-avatar--teal {
  background: linear-gradient(135deg, #14b8a6, #0d9488);
}
.setup-mockup-panel5 .ttp5-avatar--rose {
  background: linear-gradient(135deg, #fb7185, #e11d48);
}
.setup-mockup-panel5 .ttp5-avatar--amber {
  background: linear-gradient(135deg, #fbbf24, #d97706);
}
.setup-mockup-panel5 .ttp5-avatar--indigo {
  background: linear-gradient(135deg, #818cf8, #4f46e5);
}
.setup-mockup-panel5 .ttp5-avatar--slate {
  background: linear-gradient(135deg, #94a3b8, #475569);
}
.setup-mockup-panel5 .ttp5-avatar--pink {
  background: linear-gradient(135deg, #f472b6, #db2777);
}
.setup-mockup-panel5 .ttp5-kisi-name {
  font-size: 6.5px;
  font-weight: 600;
  color: #1e293b;
}
.setup-mockup-panel5 .ttp5-bolum {
  display: inline-flex;
  align-items: center;
  padding: 2px 6px;
  font-size: 5.8px;
  font-weight: 700;
  color: #6d28d9;
  background: #ede9fe;
  border-radius: 999px;
}
.setup-mockup-panel5 .ttp5-tutar {
  font-size: 6.8px;
  font-weight: 800;
  color: #28a745;
  white-space: nowrap;
}
.setup-mockup-panel5 .ttp5-kasa {
  display: inline-flex;
  align-items: center;
  padding: 2px 7px;
  font-size: 5.5px;
  font-weight: 700;
  color: #fff;
  background: #2563eb;
  border-radius: 999px;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(37, 99, 235, 0.2);
}
.setup-mockup-panel5 .ttp5-th-actions {
  text-align: center;
  width: 30px;
}
.setup-mockup-panel5 .ttp5-gear-btn {
  width: 18px;
  height: 18px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e8ecf1;
  border-radius: 50%;
  background: #fff;
  color: #94a3b8;
  font-size: 8px;
  cursor: default;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}
.setup-mockup-panel5 .ttp5-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 10px 7px;
  border-top: 1px solid #eef1f5;
  background: #fafbfc;
  flex-shrink: 0;
}
.setup-mockup-panel5 .ttp5-pagination {
  display: flex;
  align-items: center;
  gap: 4px;
}
.setup-mockup-panel5 .ttp5-page-btn {
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #fff;
  color: #64748b;
  font-size: 7px;
  cursor: default;
}
.setup-mockup-panel5 .ttp5-page-num {
  font-size: 6.5px;
  font-weight: 600;
  color: #64748b;
  min-width: 32px;
  text-align: center;
}
.setup-mockup-panel5 .ttp5-footer-count {
  font-size: 6px;
  font-weight: 600;
  color: #94a3b8;
  flex: 1;
  text-align: right;
}

.setup-mockup {
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 2px 4px rgba(0,0,0,.05), 0 24px 64px -8px rgba(0,0,0,.22), 0 0 0 1px rgba(0,0,0,.07);
}

.setup-mockup-bar {
  height: 44px;
  background: linear-gradient(to bottom, #e8eaed, #dfe1e5);
  display: flex;
  align-items: center;
  padding: 0 16px;
  position: relative;
}

.setup-mockup-dots {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}

.setup-dot {
  width: 13px;
  height: 13px;
  border-radius: 50%;
  box-shadow: inset 0 0 0 0.5px rgba(0,0,0,.15);
}

.setup-dot-red { background: #ff5f57; }
.setup-dot-yellow { background: #febc2e; }
.setup-dot-green { background: #28c840; }

.setup-mockup-url {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 8px;
  height: 28px;
  padding: 0 14px;
  border-radius: 8px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 1px 3px rgba(0,0,0,.12), inset 0 0 0 0.5px rgba(0,0,0,.08);
  min-width: 230px;
  font-size: 12px;
  font-weight: 500;
  color: #475569;
}

.setup-url-icon {
  width: 12px;
  height: 12px;
  color: #94a3b8;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  line-height: 1;
}

.setup-mockup-bar--safari {
  position: relative;
  isolation: isolate;
  height: auto;
  min-height: 42px;
  padding: 6px 9px 7px 11px;
  gap: 8px;
  justify-content: space-between;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.55) 0%,
      rgba(255, 255, 255, 0) 40%
    ),
    linear-gradient(
      180deg,
      rgba(250, 251, 252, 0.98) 0%,
      rgba(228, 230, 234, 0.99) 52%,
      rgba(214, 217, 223, 1) 100%
    );
  border-bottom: 1px solid rgba(0, 0, 0, 0.11);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.92),
    0 3px 8px -2px rgba(0, 0, 0, 0.07);
  -webkit-backdrop-filter: blur(24px) saturate(1.75);
  backdrop-filter: blur(24px) saturate(1.75);
}

.setup-mockup-bar--safari::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.75) 20%,
    rgba(255, 255, 255, 0.75) 80%,
    rgba(255, 255, 255, 0) 100%
  );
  pointer-events: none;
  z-index: 1;
}

.safari-bar-leading,
.safari-bar-trailing {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: 0;
}

.safari-bar-leading .setup-mockup-dots {
  margin-right: 6px;
}

.safari-bar-leading > .safari-tool:first-of-type {
  margin-left: 2px;
  padding-left: 8px;
  border-left: 1px solid rgba(0, 0, 0, 0.09);
}

.safari-bar-trailing {
  margin-left: 4px;
  padding-left: 8px;
  border-left: 1px solid rgba(0, 0, 0, 0.08);
}

.setup-mockup-bar--safari .setup-mockup-dots {
  gap: 5px;
}

.setup-mockup-bar--safari .setup-dot {
  width: 11px;
  height: 11px;
  box-shadow:
    inset 0 1px 1px rgba(255, 255, 255, 0.45),
    inset 0 -1px 1px rgba(0, 0, 0, 0.18),
    0 0.5px 0 rgba(255, 255, 255, 0.25),
    0 0 0 0.5px rgba(0, 0, 0, 0.14);
}

.setup-mockup-bar--safari .setup-dot-red {
  background: radial-gradient(circle at 30% 28%, #ff8a84 0%, #ff5f57 45%, #e0443e 100%);
}

.setup-mockup-bar--safari .setup-dot-yellow {
  background: radial-gradient(circle at 30% 28%, #ffe08a 0%, #febc2e 45%, #dfa520 100%);
}

.setup-mockup-bar--safari .setup-dot-green {
  background: radial-gradient(circle at 30% 28%, #8eef9a 0%, #28c840 45%, #1fa532 100%);
}

.setup-mockup-bar--safari .setup-mockup-url.safari-omnibox {
  position: relative;
  z-index: 2;
  left: auto;
  transform: none;
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  max-width: none;
  height: 28px;
  padding: 0 6px 0 10px;
  gap: 7px;
  border-radius: 7px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 249, 251, 0.94) 100%);
  border: 1px solid rgba(0, 0, 0, 0.11);
  box-shadow:
    0 1px 3px rgba(0, 0, 0, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 1),
    inset 0 0 0 0.5px rgba(255, 255, 255, 0.6),
    inset 0 2px 4px rgba(0, 0, 0, 0.03);
  font-size: 11px;
  font-weight: 500;
  color: #5f6368;
  -webkit-font-smoothing: antialiased;
}

.setup-mockup-bar--safari .setup-mockup-url.safari-omnibox::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 2px;
  border-radius: 5px;
  pointer-events: none;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.04);
  opacity: 0.85;
}

.safari-omnibox-shield {
  position: relative;
  z-index: 1;
  flex-shrink: 0;
  font-size: 10px;
  color: #137333;
  filter: drop-shadow(0 0 0.5px rgba(19, 115, 51, 0.25));
}

.setup-mockup-bar--safari .setup-mockup-url .setup-url-icon {
  position: relative;
  z-index: 1;
  font-size: 9px;
  width: auto;
  height: auto;
  color: #80868b;
  opacity: 0.95;
}

.safari-omnibox-text {
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #202124;
  letter-spacing: -0.015em;
  font-weight: 500;
}

.safari-tool {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 26px;
  border-radius: 6px;
  color: #3c4043;
  font-size: 11px;
  line-height: 1;
  opacity: 0.92;
  flex-shrink: 0;
  transition:
    background 0.14s ease,
    color 0.14s ease,
    opacity 0.14s ease;
}

.safari-tool:hover {
  background: rgba(0, 0, 0, 0.06);
  color: #202124;
}

.safari-tool--muted {
  opacity: 0.34;
}

.safari-tool--muted:hover {
  background: transparent;
  color: #3c4043;
}

.safari-tool--refresh {
  z-index: 1;
  width: 26px;
  height: 24px;
  margin-left: 1px;
  padding-left: 8px;
  margin-right: -2px;
  border-left: 1px solid rgba(0, 0, 0, 0.09);
  border-radius: 0 6px 6px 0;
  font-size: 10px;
  color: #5f6368;
  opacity: 0.88;
}

.safari-tool--refresh:hover {
  background: rgba(0, 0, 0, 0.05);
}

@media (prefers-reduced-motion: reduce) {
  .safari-tool {
    transition: none;
  }
}

.setup-mockup-countdown {
  position: absolute;
  bottom: 12px;
  right: 10px;
  z-index: 5;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 800;
  color: #ffffff;
  background: linear-gradient(145deg, #1d4ed8 0%, #2563eb 55%, #3b82f6 100%);
  box-shadow: 0 10px 20px rgba(37, 99, 235, 0.35), inset 0 0 0 2px rgba(255, 255, 255, 0.32);
}

.setup-mockup-screen {
  position: relative;
  overflow: hidden;
  height: 479px; 
  background: #f8fafc;
}

.setup-dashboard-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}

.kisiler-mockup {
  position: relative;
  display: flex;
  width: calc(100% / 1.20);
  height: 399px;
  min-height: 399px;
  transform: scale(1.20);
  transform-origin: 0 0;
  font-family: var(--font-sans);
  font-size: 10px;
  color: #374151;
  background: linear-gradient(to bottom right, #f8fafc, #f1f5f9);
}

body > .kisiler-mockup,
body > .kisiler-sidebar {
  display: none !important;
}
.kisiler-sidebar {
  width: 88px;
  flex-shrink: 0;
  background: linear-gradient(180deg, #1e293b 0%, #0f172a 100%);
  color: rgba(255,255,255,.85);
  display: flex;
  flex-direction: column;
}
.kisiler-sidebar-header {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 6px 5px 8px;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.kisiler-sidebar-dropdown {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2px;
  padding: 4px 6px;
  font-size: 6px;
  font-weight: 600;
  color: #fff;
  background: #3B7FB9;
  border-radius: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.kisiler-sidebar-chevron {
  flex-shrink: 0;
  font-size: 5px;
  opacity: .9;
}

.kisiler-sidebar-hamburger {
  position: relative;
  width: 20px;
  height: 20px;
  padding: 0;
  border: none;
  border-radius: 6px;
  background: rgba(255,255,255,.08);
  color: rgba(255, 255, 255, 0.9);
  cursor: pointer;
  flex-shrink: 0;
  -webkit-tap-highlight-color: transparent;
}
.kisiler-sidebar-hamburger:hover {
  background: rgba(255, 255, 255, 0.12);
}
.kisiler-sidebar-hamburger:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.45);
  outline-offset: 1px;
}
.kisiler-sidebar-hamburger .kisiler-menu-toggle-line {
  position: absolute;
  left: 50%;
  width: 11px;
  height: 2px;
  margin: 0;
  padding: 0;
  background: currentColor;
  border-radius: 2px;
  transform: translateX(-50%);
  transition:
    transform 0.38s cubic-bezier(0.4, 0, 0.2, 1),
    opacity 0.22s ease,
    top 0.38s cubic-bezier(0.4, 0, 0.2, 1);
}
.kisiler-sidebar-hamburger .kisiler-menu-toggle-line:nth-child(1) {
  top: 5px;
}
.kisiler-sidebar-hamburger .kisiler-menu-toggle-line:nth-child(2) {
  top: 9px;
}
.kisiler-sidebar-hamburger .kisiler-menu-toggle-line:nth-child(3) {
  top: 13px;
}
.kisiler-sidebar-hamburger[aria-expanded="true"] .kisiler-menu-toggle-line:nth-child(1) {
  top: 9px;
  transform: translateX(-50%) rotate(45deg);
}
.kisiler-sidebar-hamburger[aria-expanded="true"] .kisiler-menu-toggle-line:nth-child(2) {
  opacity: 0;
  transform: translateX(-50%) scaleX(0);
}
.kisiler-sidebar-hamburger[aria-expanded="true"] .kisiler-menu-toggle-line:nth-child(3) {
  top: 9px;
  transform: translateX(-50%) rotate(-45deg);
}
@media (prefers-reduced-motion: reduce) {
  .kisiler-sidebar-hamburger .kisiler-menu-toggle-line {
    transition-duration: 0.01ms;
  }
}
.kisiler-menu {
  list-style: none;
  margin: 0;
  padding: 5px 5px 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
  overflow-y: auto;
}
.kisiler-menu li {
  flex-shrink: 0;
}
.kisiler-menu-link {
  display: flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 6px;
  border-radius: 8px;
  text-decoration: none;
  color: #94a3b8;
  font-size: 7px;
  font-weight: 600;
  transition: none;
  border: none;
  background: none;
  width: 100%;
  cursor: default;
  text-align: left;
  font-family: inherit;
  box-sizing: border-box;
}
.kisiler-menu-link:hover {
  background: rgba(255,255,255,.05);
  color: #fff;
}
.kisiler-menu-link.kisiler-menu-active {
  background: rgba(255,255,255,.1);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
  outline: 1px solid rgba(255,255,255,.1);
  outline-offset: -1px;
}
.kisiler-menu-icon {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  margin-right: 6px;
  flex-shrink: 0;
  background: rgba(255,255,255,.05);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
}
.kisiler-menu-icon i {
  font-size: 10px;
  line-height: 1;
  display: block;
}
.kisiler-menu-icon svg {
  width: 10px;
  height: 10px;
  display: block;
}
.kisiler-menu-active .kisiler-menu-icon,
.kisiler-menu-icon.kisiler-menu-icon-active {
  background: #3B7FB9;
  box-shadow: 0 2px 6px rgba(59,127,185,.4);
  color: #fff;
}
.kisiler-menu-active .kisiler-menu-icon svg,
.kisiler-menu-icon.kisiler-menu-icon-active svg {
  color: inherit;
}
.kisiler-menu-label {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.kisiler-menu-dot {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #3B7FB9;
  flex-shrink: 0;
  margin-left: auto;
  box-shadow: 0 0 4px rgba(59,127,185,.8);
}
.kisiler-menu-chevron {
  font-size: 6px;
  margin-left: auto;
  color: #94a3b8;
  flex-shrink: 0;
}
.kisiler-menu-btn-open .kisiler-menu-chevron {
  color: rgba(255,255,255,.8);
}
.kisiler-menu-group {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
}
.kisiler-submenu {
  list-style: none;
  margin: 0;
  padding: 2px 0 0 10px;
  display: flex;
  flex-direction: column;
  gap: 1px;
  max-height: 0;
  overflow: hidden;
}
.kisiler-submenu-open {
  max-height: 120px;
}
.kisiler-submenu-link {
  display: flex;
  align-items: center;
  padding: 3px 6px;
  border-radius: 5px;
  font-size: 6px;
  font-weight: 500;
  color: #94a3b8;
  text-decoration: none;
}
.kisiler-submenu-link:hover {
  background: rgba(255,255,255,.05);
  color: #fff;
}
.kisiler-submenu-link.kisiler-submenu-active {
  background: rgba(255,255,255,.1);
  color: #fff;
}
.kisiler-submenu-icon {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  margin-right: 5px;
  flex-shrink: 0;
  background: transparent;
  color: #94a3b8;
  display: flex;
  align-items: center;
  justify-content: center;
}
.kisiler-submenu-icon svg {
  width: 8px;
  height: 8px;
  display: block;
}
.kisiler-submenu-active .kisiler-submenu-icon,
.kisiler-submenu-link.kisiler-submenu-active .kisiler-submenu-icon {
  background: rgba(59,127,185,.3);
  color: #fff;
}
.kisiler-submenu-link .kisiler-menu-dot {
  margin-left: auto;
}
.kisiler-right {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.kisiler-topbar {
  flex-shrink: 0;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 8px;
  gap: 6px;
  background: linear-gradient(to right, #1e293b, #0f172a);
  border-bottom: 1px solid rgba(255,255,255,.1);
  position: relative;
}
.kisiler-topbar-title {
  font-size: 10px;
  font-weight: 700;
  color: #fff;
  flex-shrink: 0;
  letter-spacing: -0.02em;
}
.kisiler-topbar-center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  display: flex;
  justify-content: center;
  pointer-events: none;
}
.kisiler-topbar-search-wrap {
  display: inline-flex;
  align-items: center;
  width: min(168px, 58%);
  max-width: 70%;
  min-width: 120px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  background: rgba(15, 23, 42, 0.55);
  overflow: hidden;
  pointer-events: auto;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
.kisiler-topbar-search-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 0 0 8px;
  flex-shrink: 0;
  color: rgba(203, 213, 225, 0.95);
  font-size: 9px;
}
.kisiler-topbar-search-icon i {
  font-size: 9px;
}
.kisiler-topbar-search {
  flex: 1;
  min-width: 0;
  height: 22px;
  padding: 0 8px 0 4px;
  font-size: 8px;
  color: #e5e7eb;
  background: transparent;
  border: none;
  outline: none;
}
.kisiler-topbar-search::placeholder {
  color: rgba(203, 213, 225, 0.55);
}
.kisiler-topbar-btns {
  display: flex;
  gap: 4px;
  flex-shrink: 0;
  justify-content: flex-end;
  align-items: center;
  min-width: 0;
}

.kisiler-topbar-btns-spacer {
  display: inline-block;
  width: 92px;
  height: 22px;
  flex-shrink: 0;
  pointer-events: none;
  visibility: hidden;
}
.kisiler-btn-yeni-kisi {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 22px;
  padding: 0 8px;
  font-family: var(--font-sans);
  font-size: 8px;
  font-weight: 600;
  color: #fff;
  background: linear-gradient(to right, #3B7FB9, #2E6A9D);
  border: none;
  border-radius: 6px;
  cursor: default;
  white-space: nowrap;
}
.kisiler-btn-yeni-kisi i {
  margin-right: 4px;
  font-size: 9px;
}
.kisiler-btn-plus {
  margin-right: 2px;
}
.kisiler-main {
  flex: 1;
  min-height: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: 6px 8px;
  overflow: hidden;
}
.kisiler-stats {
  display: flex;
  gap: 3px;
  flex-wrap: nowrap;
  margin-bottom: 2px;
}
.kisiler-stat {
  display: flex;
  align-items: center;
  gap: 3px;
  background: #ffffff;
  border-radius: 7px;
  padding: 2px 5px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}
.kisiler-stat-icon {
  width: 16px;
  height: 16px;
  border-radius: 5px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.kisiler-stat-icon i {
  font-size: 9px;
  line-height: 1;
  display: block;
}
.kisiler-stat-users { background: rgba(59,127,185,.12); }
.kisiler-stat-users i { color: #2563eb; }
.kisiler-stat-home { background: rgba(16,185,129,.12); }
.kisiler-stat-home i { color: #16a34a; }
.kisiler-stat-key { background: rgba(59,130,246,.12); }
.kisiler-stat-key i { color: #2563eb; }
.kisiler-stat-alert { background: rgba(239,68,68,.12); }
.kisiler-stat-alert i { color: #ef4444; }
.kisiler-stat-label {
  display: block;
  font-size: 7px;
  color: #9ca3af;
}
.kisiler-stat strong {
  font-size: 9px;
  color: #111827;
}
.kisiler-tabs-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #f3f4f6;
  padding: 0 6px;
  margin-bottom: 0;
}
.kisiler-tabs { display: flex; }
.kisiler-tab {
  padding: 4px 6px;
  font-family: var(--font-sans);
  font-size: 8px;
  font-weight: 600;
  color: #9ca3af;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  cursor: default;
  margin-bottom: -1px;
}
.kisiler-tab.kisiler-tab-active {
  color: #3B7FB9;
  border-bottom-color: #3B7FB9;
}
.kisiler-tab-count {
  font-size: 7px;
  margin-left: 2px;
  padding: 0 3px;
  border-radius: 4px;
  font-weight: 700;
}
.kisiler-tab-active .kisiler-tab-count { background: #d1fae5; color: #047857; }
.kisiler-btn-excel {
  height: 16px;
  padding: 0 6px;
  border: none;
  border-radius: 6px;
  background: linear-gradient(to right, #10B981, #059669);
  color: #fff;
  font-family: var(--font-sans);
  font-size: 8px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  cursor: default;
}

.kisiler-btn-excel i {
  font-size: 7px;
}
.kisiler-toolbar {
  padding: 2px 6px;
  font-size: 7px;
  color: #9ca3af;
  background: #f9fafb;
  border-bottom: 1px solid #f3f4f6;
}
.kisiler-table-wrap {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  background: #fff;
}
.kisiler-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 7px;
}
.kisiler-table th {
  text-align: left;
  padding: 3px 4px;
  font-weight: 700;
  font-size: 6px;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #9ca3af;
  background: #f9fafb;
  border-bottom: 1px solid #f3f4f6;
}
.kisiler-table td {
  padding: 3px 4px;
  border-bottom: 1px solid #f9fafb;
  color: #4b5563;
}
.kisiler-table th:nth-child(6),
.kisiler-table th:nth-child(7),
.kisiler-table th:nth-child(8),
.kisiler-table th:nth-child(9) { text-align: right; }
.kisiler-table td:nth-child(6),
.kisiler-table td:nth-child(7),
.kisiler-table td:nth-child(8),
.kisiler-table td:nth-child(9) { text-align: right; }
.kisiler-table tbody tr:hover { background: rgba(59,127,185,.05); }

.kisiler-table:has(tbody tr.kisiler-tr-yeni-vurgu) {
  border-collapse: separate;
  border-spacing: 0;
}
.kisiler-table tbody tr.kisiler-tr-yeni-vurgu td {
  --kisiler-vurgu: #059669;
  --kisiler-vurgu-w: 2px;
  background: rgba(16, 185, 129, 0.1);
  background-clip: padding-box;
  border-top: var(--kisiler-vurgu-w) solid var(--kisiler-vurgu) !important;
  border-bottom: var(--kisiler-vurgu-w) solid var(--kisiler-vurgu) !important;
  border-left: none !important;
  border-right: none !important;
}
.kisiler-table tbody tr.kisiler-tr-yeni-vurgu td:first-child {
  border-left: var(--kisiler-vurgu-w) solid var(--kisiler-vurgu) !important;
  border-radius: 5px 0 0 5px;
  background: rgba(16, 185, 129, 0.14);
}
.kisiler-table tbody tr.kisiler-tr-yeni-vurgu td:last-child {
  border-right: var(--kisiler-vurgu-w) solid var(--kisiler-vurgu) !important;
  border-radius: 0 5px 5px 0;
}
.kisiler-table tbody tr.kisiler-tr-yeni-vurgu td:first-child:last-child {
  border-radius: 5px;
}
.kisiler-table tbody tr.kisiler-tr-yeni-vurgu:hover td {
  --kisiler-vurgu: #047857;
  background: rgba(16, 185, 129, 0.15);
}
.kisiler-table tbody tr.kisiler-tr-yeni-vurgu:hover td:first-child {
  background: rgba(16, 185, 129, 0.18);
}

.kisiler-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  font-size: 6px;
  font-weight: 700;
  color: #fff;
  margin-right: 4px;
  vertical-align: middle;
}
.kisiler-avatar-purple { background: linear-gradient(135deg, #6366F1, #8B5CF6); }
.kisiler-avatar-blue { background: linear-gradient(135deg, #3B82F6, #06B6D4); }
.kisiler-avatar-orange { background: linear-gradient(135deg, #F59E0B, #EF4444); }
.kisiler-avatar-pink { background: linear-gradient(135deg, #EC4899, #DB2777); }
.kisiler-badge-aktif {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 6px;
  font-weight: 600;
  color: #059669;
  background: #d1fae5;
  padding: 1px 5px;
  border-radius: 999px;
}
.kisiler-plaka {
  font-size: 6px;
  font-weight: 600;
  color: #4b5563;
  background: #f3f4f6;
  padding: 1px 4px;
  border-radius: 2px;
  letter-spacing: .05em;
}
.kisiler-red { color: #ef4444; font-weight: 700; }
.kisiler-gear {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  font-size: 8px;
  color: #9ca3af;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
}
.kisiler-gear i {
  font-size: 8px;
}

.kisiler-iletisim-title {
  font-size: 6px;
  font-weight: 700;
  color: #9ca3af;
  text-transform: uppercase;
  letter-spacing: .03em;
  margin-bottom: 2px;
}
.kisiler-iletisim-item {
  display: flex;
  align-items: center;
  gap: 3px;
  font-size: 6px;
  line-height: 1.2;
  color: #4b5563;
}
.kisiler-iletisim-item i {
  font-size: 6px;
  color: #9ca3af;
  width: 10px;
  flex: 0 0 10px;
  text-align: center;
}

.bagimsiz-view {
  display: flex;
  flex-direction: column;
  gap: 4px;
  height: 100%;
}
.bagimsiz-topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 6px 0;
  color: #e5e7eb;
}
.bagimsiz-topbar-title {
  font-size: 9px;
  font-weight: 600;
}
.bagimsiz-stats-row {
  display: flex;
  gap: 4px;
  padding: 2px 6px 0;
}
.bag-stat {
  display: flex;
  align-items: center;
  gap: 4px;
  background: #fff;
  border-radius: 8px;
  padding: 4px 5px;
  border: 1px solid #e5e7eb;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
}
.bag-stat-icon {
  width: 14px;
  height: 14px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 8px;
}
.bag-stat-icon-primary {
  background: rgba(59, 127, 185, .1);
  color: #3B7FB9;
}
.bag-stat-icon-success {
  background: rgba(16, 185, 129, .1);
  color: #10B981;
}
.bag-stat-icon-info {
  background: rgba(59, 130, 246, .1);
  color: #3B82F6;
}
.bag-stat-icon-muted {
  background: rgba(148, 163, 184, .15);
  color: #64748b;
}
.bag-stat-icon-key {
  background: rgba(139, 92, 246, .12);
  color: #7c3aed;
}
.bag-stat-icon-takip {
  background: rgba(249, 115, 22, .12);
  color: #ea580c;
}
.bag-stat-text span {
  display: block;
  font-size: 7px;
  color: #9ca3af;
}
.bag-stat-text strong {
  font-size: 9px;
  color: #111827;
}
.bagimsiz-main-card {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 2px 6px 4px;
}
.bagimsiz-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 6px;
  background: #f9fafb;
  border-radius: 8px 8px 0 0;
  border: 1px solid #e5e7eb;
  border-bottom: none;
}
.bagimsiz-count {
  font-size: 8px;
  color: #9ca3af;
}
.bagimsiz-excel-btn {
  height: 16px;
  padding: 0 6px;
  border: none;
  border-radius: 6px;
  background: linear-gradient(to right, #10B981, #059669);
  color: #fff;
  font-size: 8px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.bagimsiz-excel-btn i {
  font-size: 7px;
}
.bagimsiz-table-wrap {
  flex: 1;
  min-height: 0;
  overflow: auto;
  border: 1px solid #e5e7eb;
  border-top: none;
  border-bottom: none;
  background: #fff;
}
.bagimsiz-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 8px;
}

.bagimsiz-table:has(tbody tr.bag-tr-atama-isaret) {
  border-collapse: separate;
}
.bagimsiz-table thead tr {
  background: #f9fafb;
  border-bottom: 1px solid #e5e7eb;
}
.bagimsiz-table th {
  padding: 4px;
  font-size: 7px;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #9ca3af;
  text-align: left;
}
.bagimsiz-table td {
  padding: 4px;
  border-bottom: 1px solid #f3f4f6;
  font-size: 8px;
  color: #4b5563;
}
.bagimsiz-table tbody tr {
  cursor: pointer;
  transition: background 0.15s ease, box-shadow 0.15s ease;
}
.bagimsiz-table tbody tr:hover {
  background: rgba(59, 127, 185, .08);
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.18);
}
.bag-no {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 12px;
  border-radius: 4px;
  background: rgba(59, 127, 185, .1);
  color: #3B7FB9;
  font-size: 7px;
  font-weight: 700;
}

.bagimsiz-table tbody tr.bag-tr-atama-isaret td {
  --atama-accent: #059669;
  --atama-border-w: 2px;
  background: rgba(16, 185, 129, 0.1);
  background-clip: padding-box;
  border-top: var(--atama-border-w) solid var(--atama-accent) !important;
  border-bottom: var(--atama-border-w) solid var(--atama-accent) !important;
  border-left: none !important;
  border-right: none !important;
}
.bagimsiz-table tbody tr.bag-tr-atama-isaret td:first-child {
  border-left: var(--atama-border-w) solid var(--atama-accent) !important;
  border-radius: 5px 0 0 5px;
}
.bagimsiz-table tbody tr.bag-tr-atama-isaret td:last-child {
  border-right: var(--atama-border-w) solid var(--atama-accent) !important;
  border-radius: 0 5px 5px 0;
}
.bagimsiz-table tbody tr.bag-tr-atama-isaret td:first-child:last-child {
  border-radius: 5px;
}
.bagimsiz-table tbody tr.bag-tr-atama-isaret:hover td {
  --atama-accent: #047857;
  background: rgba(16, 185, 129, 0.15);
}

.bag-durum {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 6px;
  border-radius: 999px;
  font-size: 7px;
  font-weight: 600;
  border: 1px solid;
}
.bag-durum i {
  font-size: 6px;
}
.bag-durum-dolu {
  background: #fef2f2;
  color: #dc2626;
  border-color: #fecaca;
}
.bag-durum-bos {
  background: #f3f4f6;
  color: #6b7280;
  border-color: #e5e7eb;
}
.bag-takip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 6px;
  border-radius: 999px;
  font-size: 7px;
  font-weight: 600;
  border: 1px solid #a7f3d0;
  background: #d1fae5;
  color: #065f46;
}
.bag-takip-dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #10b981;
}
.bag-bakiye {
  font-weight: 700;
  font-size: 8px;
}
.bag-faiz {
  color: #9ca3af;
  font-size: 8px;
}
.bag-actions-cell {
  position: relative;
  width: 1%;
  white-space: nowrap;
  vertical-align: middle;
}
.bag-actions-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
}
.bag-actions {
  min-width: 22px;
  height: 14px;
  padding: 0 2px;
  border-radius: 3px;
  border: 1px solid #e5e7eb;
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1px;
  font-size: 6px;
  color: #9ca3af;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.bag-actions:hover,
.bag-actions.bag-actions-open {
  background: #f9fafb;
  border-color: #d1d5db;
  color: #6b7280;
}
.bag-actions-caret {
  font-size: 4px;
  opacity: 0.85;
}

.bag-actions-flyout {
  position: fixed;
  z-index: 99999;
  min-width: 118px;
  padding: 3px 0;
  background: #fff;
  border-radius: 6px;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.1), 0 1px 4px rgba(15, 23, 42, 0.06);
  border: 1px solid rgba(0, 0, 0, 0.06);
  font-size: 7px;
  font-weight: 600;
  color: #374151;
  line-height: 1.2;
}
.bag-flyout-item {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 3px 6px;
  border: none;
  background: transparent;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
  transition: background 0.12s ease;
  white-space: nowrap;
}
.bag-flyout-item:hover {
  background: #f3f4f6;
}
.bag-flyout-item-danger {
  color: #dc2626;
}
.bag-flyout-item-danger:hover {
  background: #fef2f2;
}
.bag-flyout-sep {
  height: 1px;
  margin: 2px 5px;
  background: #e5e7eb;
}
.bag-flyout-ico {
  width: 14px;
  height: 14px;
  border-radius: 3px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 6px;
}
.bag-flyout-ico-house {
  background: rgba(59, 130, 246, 0.15);
  color: #2563eb;
}
.bag-flyout-ico-ruler {
  background: rgba(234, 179, 8, 0.2);
  color: #ca8a04;
}
.bag-flyout-ico-plus {
  background: #06b6d4;
  color: #fff;
  border-radius: 50%;
  width: 14px;
  height: 14px;
  font-size: 7px;
}
.bag-flyout-ico-doc {
  background: rgba(234, 179, 8, 0.2);
  color: #a16207;
}
.bag-flyout-ico-history {
  background: #e5e7eb;
  color: #6b7280;
}
.bag-flyout-ico-trash {
  background: rgba(239, 68, 68, 0.12);
  color: #dc2626;
}
.bag-flyout-item-danger .bag-flyout-ico-trash {
  background: rgba(239, 68, 68, 0.15);
}

@media (max-width: 1023px) {
  .bag-actions-flyout {
    min-width: 84px;
    max-width: min(84vw, 200px);
    padding: 2px 0;
    font-size: 5.5px;
    font-weight: 600;
    line-height: 1.15;
    border-radius: 4px;
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.09), 0 1px 3px rgba(15, 23, 42, 0.05);
  }

  .bag-flyout-item {
    gap: 3px;
    padding: 2px 5px;
  }

  .bag-flyout-sep {
    margin: 1px 4px;
  }

  .bag-flyout-ico {
    width: 10px;
    height: 10px;
    border-radius: 2px;
    font-size: 5px;
  }

  .bag-flyout-ico-plus {
    width: 10px;
    height: 10px;
    font-size: 5px;
  }
}

.bagimsiz-pagination {
  border: 1px solid #e5e7eb;
  border-top: none;
  border-radius: 0 0 8px 8px;
  padding: 3px 6px;
  font-size: 7px;
  color: #9ca3af;
  display: flex;
  justify-content: space-between;
}

.setup-mockup-panel2 .kisiler-mockup,
.setup-mockup-panel3 .kisiler-mockup {
  background: linear-gradient(to bottom right, #f8fafc, #f1f5f9);
}

.setup-mockup-panel2 .kisiler-right,
.setup-mockup-panel3 .kisiler-right {
  background: #f8fafc;
}

.setup-mockup-panel2 .bagimsiz-topbar,
.setup-mockup-panel3 .bagimsiz-topbar {
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 8px;
  gap: 6px;
  background: linear-gradient(to right, #1e293b, #0f172a);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  margin: 0;
}

.setup-mockup-panel2 .bagimsiz-topbar-title,
.setup-mockup-panel3 .bagimsiz-topbar-title {
  font-size: 10px;
  font-weight: 700;
  color: #fff;
  letter-spacing: -0.02em;
}

.setup-mockup-panel2 .kisiler-topbar.bagimsiz-topbar,
.setup-mockup-panel3 .kisiler-topbar.bagimsiz-topbar,
.setup-mockup-panel4 .kisiler-topbar.bagimsiz-topbar {
  gap: 8px;
}

.setup-mockup-panel2 .kisiler-topbar.bagimsiz-topbar .kisiler-topbar-title,
.setup-mockup-panel3 .kisiler-topbar.bagimsiz-topbar .kisiler-topbar-title,
.setup-mockup-panel4 .kisiler-topbar.bagimsiz-topbar .kisiler-topbar-title {
  flex: 0 1 auto;
  max-width: 34%;
  min-width: 0;
  padding-right: 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.setup-mockup-panel2 .kisiler-topbar.bagimsiz-topbar .kisiler-topbar-search-wrap,
.setup-mockup-panel3 .kisiler-topbar.bagimsiz-topbar .kisiler-topbar-search-wrap,
.setup-mockup-panel4 .kisiler-topbar.bagimsiz-topbar .kisiler-topbar-search-wrap {
  width: min(162px, 44%);
  min-width: 100px;
  max-width: 44%;
}

.setup-mockup-panel2 .kisiler-topbar.bagimsiz-topbar .kisiler-topbar-search::placeholder,
.setup-mockup-panel3 .kisiler-topbar.bagimsiz-topbar .kisiler-topbar-search::placeholder,
.setup-mockup-panel4 .kisiler-topbar.bagimsiz-topbar .kisiler-topbar-search::placeholder {
  color: rgba(203, 213, 225, 0.68);
}

.setup-mockup-panel2 .bagimsiz-stats-row,
.setup-mockup-panel3 .bagimsiz-stats-row {
  flex-wrap: wrap;
  gap: 4px;
  padding: 6px 8px 6px;
}

.setup-mockup-panel2 .bag-stat,
.setup-mockup-panel3 .bag-stat {
  border-radius: 10px;
}

.setup-mockup-panel2 .bagimsiz-main-card,
.setup-mockup-panel3 .bagimsiz-main-card {
  padding: 0 8px 8px;
}

.setup-mockup-panel2 .bagimsiz-toolbar,
.setup-mockup-panel3 .bagimsiz-toolbar {
  border-radius: 12px 12px 0 0;
}

.setup-mockup-panel2 .bagimsiz-table-wrap,
.setup-mockup-panel3 .bagimsiz-table-wrap {
  border-left: 1px solid #e5e7eb;
  border-right: 1px solid #e5e7eb;
  border-bottom: none;
}

.setup-mockup-panel2 .bagimsiz-pagination,
.setup-mockup-panel3 .bagimsiz-pagination {
  border-radius: 0 0 12px 12px;
  padding: 4px 8px;
}

.setup-mockup-panel2 .bag-no,
.setup-mockup-panel3 .bag-no {
  min-width: 22px;
  height: 14px;
  border-radius: 999px;
  background: #e0e7ff;
  color: #2563eb;
  font-size: 7px;
}

.setup-mockup-panel2 .bag-durum,
.setup-mockup-panel3 .bag-durum {
  padding: 3px 8px;
  font-size: 7px;
}

.setup-mockup-panel2 .bag-takip,
.setup-mockup-panel3 .bag-takip {
  padding: 3px 9px;
  font-size: 7px;
  border-radius: 999px;
}

.setup-mockup-panel2 .bagimsiz-excel-btn,
.setup-mockup-panel3 .bagimsiz-excel-btn {
  height: 18px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 8px;
}

.setup-mockup-panel2 .bagimsiz-table,
.setup-mockup-panel3 .bagimsiz-table {
  font-size: 7px;
}

.setup-mockup-panel2 .bagimsiz-table th,
.setup-mockup-panel3 .bagimsiz-table th {
  padding: 3px 4px;
  font-size: 6px;
}

.setup-mockup-panel2 .bagimsiz-table td,
.setup-mockup-panel3 .bagimsiz-table td {
  padding: 3px 4px;
  font-size: 7px;
}

.setup-mockup-panel2 .bagimsiz-count,
.setup-mockup-panel2 .bagimsiz-pagination,
.setup-mockup-panel3 .bagimsiz-count,
.setup-mockup-panel3 .bagimsiz-pagination {
  font-size: 7px;
}

.setup-mockup-panel2 .bag-stat-text span,
.setup-mockup-panel3 .bag-stat-text span {
  font-size: 7px;
}

.setup-mockup-panel2 .bag-stat-text strong,
.setup-mockup-panel3 .bag-stat-text strong {
  font-size: 9px;
}

.setup-mockup-panel2 .bagimsiz-excel-btn,
.setup-mockup-panel3 .bagimsiz-excel-btn {
  font-size: 7px;
  height: 16px;
  padding: 0 6px;
}

.setup-mockup-panel2 .bag-bakiye,
.setup-mockup-panel2 .bag-faiz,
.setup-mockup-panel3 .bag-bakiye,
.setup-mockup-panel3 .bag-faiz {
  font-size: 7px;
}

.kisiler-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 6px;
  font-size: 7px;
  color: #9ca3af;
  background: #f9fafb;
  border-top: 1px solid #f3f4f6;
}
.kisiler-pagination-btns {
  display: inline-flex;
  align-items: center;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
}
.kisiler-pagination-btns button {
  width: 16px;
  height: 16px;
  padding: 0;
  border: none;
  border-right: 1px solid #e5e7eb;
  background: none;
  color: #3B7FB9;
  font-size: 10px;
  cursor: default;
}
.kisiler-pagination-btns button:last-child { border-right: none; }
.kisiler-pagination-btns span { padding: 0 6px; font-size: 7px; color: #6b7280; }

.setup-steps {
  display: flex;
  flex-direction: column;
  gap: 0;
  align-items: stretch;
  padding: 0;
  margin-top: 0;
}

.setup-steps-header {
  margin-bottom: 1.5rem;
}

#tahsilat .setup-steps-lead {
  margin: 0.85rem 0 0 0;
  max-width: 28rem;
  font-size: 0.9375rem;
  line-height: 1.55;
  font-weight: 500;
  color: #64748b;
  letter-spacing: -0.01em;
}

.setup-stepper {
  display: none;
}

.setup-step-item {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.setup-steps-rail {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  width: 100%;
}

.setup-step-row {
  display: grid;
  grid-template-columns: 2.125rem minmax(0, 1fr);
  gap: 0.625rem 0.875rem;
  align-items: stretch;
}

@media (min-width: 480px) {
  .setup-step-row {
    grid-template-columns: 2.375rem minmax(0, 1fr);
    gap: 0.75rem 1rem;
  }
}

.setup-rail-side {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
  width: 100%;
}

.setup-step-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border-radius: 9999px;
  border: 2px solid #e2e8f0;
  background: #fff;
  color: #64748b;
  font-family: var(--font-sans);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  cursor: pointer;
  transition:
    border-color 0.2s,
    background 0.2s,
    color 0.2s,
    box-shadow 0.2s,
    transform 0.15s;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.setup-step-btn:hover {
  border-color: #cbd5e1;
  color: #334155;
}

.setup-step-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.25);
}

.setup-step-btn .setup-check {
  display: none;
  width: 13px;
  height: 13px;
  stroke: #fff;
}

.setup-step-btn.setup-step-active:not(.setup-step-done) {
  border-color: #3b7fb9;
  background: #fff;
  color: #1e40af;
  box-shadow:
    0 0 0 4px rgba(59, 127, 185, 0.14),
    0 2px 6px rgba(59, 127, 185, 0.12);
  animation: setupStepPulse 2.8s ease-in-out infinite;
}

.setup-step-btn.setup-step-done {
  border-color: #3b7fb9;
  background: linear-gradient(145deg, #3b7fb9 0%, #2563eb 100%);
  color: #fff;
  animation: none;
  box-shadow: 0 2px 6px rgba(37, 99, 235, 0.2);
}

.setup-step-btn.setup-step-done .setup-step-num {
  display: none;
}

.setup-step-btn.setup-step-done .setup-check {
  display: block;
}

.setup-step-line {
  flex: 1 1 auto;
  width: 2px;
  min-height: 0.5rem;
  margin: 0;
  border: none;
  border-radius: 999px;
  background: linear-gradient(180deg, #e2e8f0 0%, #cbd5e1 100%);
  transition: background 0.3s ease;
}

.setup-step-line.setup-step-line-done {
  background: linear-gradient(180deg, #3b7fb9 0%, #60a5fa 100%);
}

.setup-steps-rail .setup-card-header .setup-card-num {
  display: none;
}

@keyframes setupStepPulse {
  0%,
  100% {
    box-shadow:
      0 0 0 4px rgba(59, 127, 185, 0.14),
      0 2px 6px rgba(59, 127, 185, 0.12);
  }
  50% {
    box-shadow:
      0 0 0 7px rgba(59, 127, 185, 0.1),
      0 2px 8px rgba(59, 127, 185, 0.14);
  }
}

.setup-cards {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

@media (max-width: 1023px) {
  .setup-steps-header {
    margin-bottom: 1.25rem;
  }
}

.setup-card {
  text-align: left;
  width: 100%;
  border-radius: 12px;
  padding: 0;
  cursor: pointer;
  transition: border-color .25s, box-shadow .25s, background .25s;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(148,163,184,.22);
  background: #fff;
  box-shadow: 0 1px 3px rgba(0,0,0,.04);
  font-family: inherit;
  appearance: none;
}

.setup-card:hover {
  border-color: rgba(59,127,185,.35);
  box-shadow: 0 2px 10px rgba(59,127,185,.1);
}

.setup-card-done {
  border-color: rgba(59,127,185,.18);
}

.setup-card-active {
  border-color: rgba(59,127,185,.45);
  box-shadow: 0 4px 18px rgba(59,127,185,.14);
}

.setup-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  gap: 12px;
}

.setup-card-header-left {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  min-width: 0;
}

.setup-card-num {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 700;
  color: #94a3b8;
  background: #f1f5f9;
  border: 1.5px solid #e2e8f0;
  transition: all .25s;
}

.setup-card-active .setup-card-num {
  background: #3B7FB9;
  border-color: #3B7FB9;
  color: #fff;
  box-shadow: 0 0 0 4px rgba(59,127,185,.16);
}

.setup-card-done .setup-card-num {
  background: #3B7FB9;
  border-color: #3B7FB9;
  color: #fff;
  font-size: 0;
}

.setup-card-done .setup-card-num::before {
  content: '✓';
  font-size: 13px;
}

.setup-card-title {
  font-weight: 600;
  font-size: 12px;
  line-height: 1.35;
  color: #64748b;
  transition: color .25s;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 0;
}

.setup-card-active .setup-card-title {
  color: #1e293b;
  font-weight: 700;
}

.setup-card-done .setup-card-title {
  color: #64748b;
}

.setup-card-chevron {
  width: 17px;
  height: 17px;
  flex-shrink: 0;
  color: #cbd5e1;
  transform: rotate(180deg);
  transition: transform .3s ease, color .25s;
}

.setup-card-active .setup-card-chevron {
  transform: rotate(0deg);
  color: #3B7FB9;
}

.setup-card-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height .35s ease, opacity .3s ease;
  opacity: 0;
  padding: 0 18px;
}

.setup-card-active .setup-card-body {
  max-height: 360px;
  opacity: 1;
  padding: 0 16px 16px;
}

.setup-card-desc {
  font-size: 12px;
  line-height: 1.65;
  color: #64748b;
  margin: 0;
  font-weight: 400;
}

.setup-card-desc strong {
  display: block;
  font-size: 12.5px;
  font-weight: 600;
  color: #334155;
  margin-bottom: 6px;
}

.setup-card-progress {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: transparent;
  overflow: hidden;
  opacity: 0;
  transition: opacity .2s;
}

.setup-card-active .setup-card-progress {
  opacity: 1;
  background: rgba(59,127,185,.1);
}

.setup-card-progress-fill {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, #3B7FB9, #1e56c4);
}

.banks.banks--no-overlap {
  margin-top: 0;
  border-radius: 0;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
  background: var(--site-flow-solid-bg) !important;
  background-image: none !important;
}

@media (min-width: 1024px) {
  .setup-grid--reversed {
    grid-template-columns: 1fr 1.6fr;
  }
}

.tahsilat-tablo-wrap {
  overflow-x: auto;
  margin-top: 8px;
}

.tahsilat-tablo {
  width: 100%;
  border-collapse: collapse;
  font-size: 10.5px;
}

.tahsilat-tablo thead tr {
  background: #f8fafc;
}

.tahsilat-tablo th {
  text-align: left;
  padding: 6px 10px;
  font-weight: 600;
  color: #64748b;
  border-bottom: 1px solid #e2e8f0;
  white-space: nowrap;
}

.tahsilat-tablo td {
  padding: 6px 10px;
  color: #334155;
  border-bottom: 1px solid #f1f5f9;
  white-space: nowrap;
}

.tablo-daire {
  display: inline-block;
  background: #eff6ff;
  color: #1d4ed8;
  font-weight: 700;
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 5px;
}

.tablo-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 20px;
}

.tablo-badge-odendi {
  background: #dcfce7;
  color: #15803d;
}

.tablo-badge-bekliyor {
  background: #fef9c3;
  color: #a16207;
}

.tablo-badge-gecikti {
  background: #fee2e2;
  color: #b91c1c;
}

.kisiler-submenu-active {
  background: rgba(255,255,255,.1);
  color: #fff !important;
  font-weight: 600;
}

.setup-mockup-panel3 .kisiler-submenu-active .kisiler-menu-dot {
  width: 4px;
  height: 4px;
  box-shadow: 0 0 6px rgba(59,127,185,.85);
}

.tg-topbar-btn {
  background: #337ab7 !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: 7.5px !important;
  padding: 0 10px !important;
  color: #fff !important;
  box-shadow: none !important;
}
.tg-topbar-btn i {
  color: #fff !important;
}

.tg-main {
  padding: 5px !important;
  overflow: hidden;
  background: linear-gradient(to bottom right, #f8fafc, #f1f5f9);
  display: flex !important;
  flex-direction: column !important;
}

.tg-card {
  background: #fff;
  border-radius: 8px;
  border: 1px solid #f3f4f6;
  box-shadow: 0 1px 3px rgba(0,0,0,.05);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  flex: 1;
  min-height: 0;
}

.tg-tabs--tek {
  flex-wrap: wrap;
}

.tg-tab--readonly {
  cursor: default;
}

@keyframes tgAidatBadgePop {
  0% {
    transform: scale(0.82);
    opacity: 0.35;
  }
  55% {
    transform: scale(1.14);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

.tg-tab-count--aidat.tg-tab-count--aidat-anim {
  animation: tgAidatBadgePop 0.55s ease-out;
}

.setup-mockup .kisiler-right {
  position: relative;
}

.kisiler-mockup > .tg-success-toast--atama-a3,
.kisiler-mockup > .tg-success-toast--atama-k4 {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 88px;
  z-index: 60;
}

.tg-success-toast {
  position: absolute;
  inset: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 12px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.32s ease, visibility 0.32s;
}

.tg-success-toast::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.16);
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}

.tg-success-toast.tg-success-toast--visible {
  opacity: 1;
  visibility: visible;
  pointer-events: none;
}

.tg-success-toast.tg-success-toast--visible::before {
  opacity: 1;
}

.tg-success-toast-inner {
  position: relative;
  z-index: 1;
  pointer-events: auto;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  max-width: min(94%, 320px);
  padding: 9px 10px 9px 11px;
  background: linear-gradient(165deg, #ecfdf5 0%, #ffffff 48%, #f8fafc 100%);
  border: 1px solid rgba(16, 185, 129, 0.45);
  border-radius: 8px;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.85) inset,
    0 10px 32px rgba(15, 23, 42, 0.14),
    0 4px 12px rgba(5, 150, 105, 0.12);
  transform: scale(0.94);
  opacity: 0;
  transition:
    transform 0.38s cubic-bezier(0.34, 1.35, 0.64, 1),
    opacity 0.28s ease;
}

.tg-success-toast.tg-success-toast--visible .tg-success-toast-inner {
  transform: scale(1);
  opacity: 1;
}

.tg-success-toast-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: linear-gradient(145deg, #34d399, #059669);
  color: #fff;
  font-size: 11px;
  box-shadow: 0 2px 6px rgba(5, 150, 105, 0.35);
}

.tg-success-toast-body {
  flex: 1;
  min-width: 0;
}

.tg-success-toast-msg {
  margin: 0 0 3px;
  font-size: 8.5px;
  font-weight: 700;
  color: #064e3b;
  line-height: 1.3;
  letter-spacing: -0.02em;
}

.tg-success-toast-amount {
  margin: 0;
  font-size: 8px;
  font-weight: 700;
  color: #047857;
  line-height: 1.35;
  letter-spacing: 0.01em;
}

.tg-success-toast-close {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  padding: 0;
  border: none;
  background: rgba(16, 185, 129, 0.14);
  color: #065f46;
  border-radius: 5px;
  cursor: pointer;
  font-size: 9px;
  line-height: 1;
  transition: background 0.15s ease;
}

.tg-success-toast-close:hover {
  background: rgba(16, 185, 129, 0.26);
}

.tg-tabs {
  display: flex;
  align-items: flex-end;
  flex-wrap: nowrap;
  gap: 2px;
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
  padding: 4px 6px 0;
  flex-shrink: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.tg-tab {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 6px 5px;
  font-size: 6.5px;
  font-weight: 600;
  color: #6b7280;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  cursor: default;
  white-space: nowrap;
  line-height: 1.15;
  flex-shrink: 0;
}

.tg-tab-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 6.5px;
  color: inherit;
  opacity: 0.95;
}

.tg-tab-text {
  letter-spacing: 0.01em;
}

.tg-tab-active {
  color: #2563eb;
  border-bottom-color: #2563eb;
}

.tg-tab-active .tg-tab-icon {
  color: #2563eb;
}

.tg-tab-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 5.5px;
  font-weight: 700;
  border-radius: 999px;
  min-width: 12px;
  height: 12px;
  padding: 0 3px;
  box-sizing: border-box;
}

.tg-tab-count-active {
  background: #dbeafe;
  color: #1e40af;
}

.tg-tab-count--aidat {
  background: #d1fae5;
  color: #065f46;
}

.tg-tab-count--isinma {
  background: #fee2e2;
  color: #991b1b;
}

.tg-tab-count--su {
  background: #dbeafe;
  color: #1e3a8a;
}

.tg-tab-count--elektrik {
  background: #fef3c7;
  color: #b45309;
}

.tg-tab-count--genel {
  background: #ede9fe;
  color: #6b21a8;
}

.tg-filters {
  display: flex;
  align-items: flex-end;
  gap: 5px;
  padding: 5px 7px 4px;
  background: rgba(249,250,251,.6);
  border-bottom: 1px solid #f3f4f6;
  flex-shrink: 0;
  flex-wrap: nowrap;
  overflow: hidden;
}

.tg-filter-group {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.tg-filter-label {
  font-size: 6px;
  font-weight: 500;
  color: #6b7280;
  white-space: nowrap;
}

.tg-filter-search-wrap {
  display: flex;
  align-items: center;
  height: 18px;
  border: 1px solid #e5e7eb;
  border-radius: 5px;
  background: #fff;
  padding: 0 4px;
  gap: 3px;
  width: 76px;
}

.tg-search-ico {
  font-size: 6px;
  color: #9ca3af;
  flex-shrink: 0;
}

.tg-filter-input {
  border: none;
  outline: none;
  background: transparent;
  font-size: 6.5px;
  color: #374151;
  width: 100%;
  min-width: 0;
}
.tg-filter-input::placeholder { color: #9ca3af; }

.tg-filter-date-wrap {
  display: flex;
  align-items: center;
  height: 18px;
  border: 1px solid #e5e7eb;
  border-radius: 5px;
  background: #fff;
  padding: 0 4px;
  gap: 3px;
  width: 58px;
}

.tg-cal-ico {
  font-size: 6px;
  color: #9ca3af;
  flex-shrink: 0;
}

.tg-filter-select-wrap {
  display: flex;
  align-items: center;
  height: 18px;
  border: 1px solid #e5e7eb;
  border-radius: 5px;
  background: #fff;
  padding: 0 5px;
  gap: 4px;
  font-size: 6.5px;
  color: #374151;
  white-space: nowrap;
  min-width: 44px;
}
.tg-filter-select-wrap i { font-size: 5px; color: #9ca3af; }

.tg-filter-actions {
  display: flex;
  align-items: flex-end;
  gap: 3px;
}

.tg-btn-filter {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 18px;
  padding: 0 7px;
  font-size: 7px;
  font-weight: 600;
  color: #fff;
  background: linear-gradient(to right, #0D9488, #0F766E);
  border: none;
  border-radius: 5px;
  cursor: default;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(0,0,0,.05);
}
.tg-btn-filter i { font-size: 6px; }

.tg-btn-clear {
  display: inline-flex;
  align-items: center;
  height: 18px;
  padding: 0 7px;
  font-size: 7px;
  font-weight: 600;
  color: #6b7280;
  background: #f3f4f6;
  border: none;
  border-radius: 5px;
  cursor: default;
}

.tg-tablo-wrap {
  flex: 1;
  overflow: hidden;
  background: #fff;
  min-height: 0;
}

.tg-tablo {
  width: 100%;
  border-collapse: collapse;
  font-size: 7px;
}

.tg-tablo thead tr { background: #f9fafb; }
.tg-th-check { width: 16px; }

.tg-check {
  width: 9px;
  height: 9px;
  cursor: default;
  accent-color: #3B7FB9;
}

.tg-tablo th {
  text-align: left;
  padding: 5px 4px;
  font-size: 5.5px;
  font-weight: 700;
  color: #9ca3af;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-bottom: 1px solid #f3f4f6;
  white-space: nowrap;
}

.tg-tablo td {
  padding: 5px 4px;
  color: #374151;
  border-bottom: 1px solid #f3f4f6;
  white-space: nowrap;
  font-size: 7px;
}

.tg-no {
  font-size: 6.5px;
  font-weight: 600;
  color: #4b5563;
}

.tg-kat {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 6.5px;
  font-weight: 600;
  padding: 2px 5px;
  border-radius: 5px;
}
.tg-kat i { font-size: 6px; }

.tg-kat-aidat    { background: #D1FAE5; color: #065F46; }
.tg-kat-isinma   { background: #FEE2E2; color: #991B1B; }
.tg-kat-su       { background: #DBEAFE; color: #1E40AF; }
.tg-kat-elektrik { background: #FEF3C7; color: #92400E; }
.tg-kat-genel    { background: #F3E8FF; color: #6B21A8; }

.tg-count-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #0D9488;
  color: #fff;
  font-size: 6.5px;
  font-weight: 700;
  border-radius: 4px;
  min-width: 16px;
  height: 13px;
  padding: 0 3px;
}

.tg-tutar {
  font-weight: 700;
  color: #111827;
}

.tg-gear-ico {
  font-size: 9px;
  color: #9ca3af;
  cursor: default;
}

.tg-tablo-empty-row .tg-tablo-empty {
  text-align: center;
  color: #9ca3af;
  font-weight: 500;
  padding: 14px 8px;
  white-space: normal;
}

@keyframes tgRowFlash {
  0% { background-color: rgba(59, 130, 246, 0.14); }
  100% { background-color: transparent; }
}
.tg-tablo tr.tg-row-demo-new td {
  animation: tgRowFlash 1.2s ease-out;
}

.comm-section {
  position: relative;
  padding: 1.85rem 0 2.1rem;
  width: 100%;
  box-sizing: border-box;
  
  background: transparent;
}

.comm-inner {
  max-width: 80rem;
  margin: 0 auto;
  width: 100%;
  padding: 0 1.25rem;
  box-sizing: border-box;
}

.comm-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 4rem;
  align-items: center;
}

.comm-content {
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
  max-width: 32rem;
  margin-left: 0;
}

@media (min-width: 1100px) {
  #sms .comm-content {
    margin-left: -5%;
  }
}

@media (min-width: 1280px) {
  #sms .comm-content {
    margin-left: -8%;
  }
}

@media (max-width: 1024px) {
  .comm-grid {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .comm-phone-wrap {
    max-width: 100%;
    justify-self: center;
    width: 100%;
  }
}

[data-comm-order="0"] { --comm-order: 0; }
[data-comm-order="1"] { --comm-order: 1; }
[data-comm-order="2"] { --comm-order: 2; }
[data-comm-order="3"] { --comm-order: 3; }
[data-comm-order="4"] { --comm-order: 4; }
[data-comm-order="5"] { --comm-order: 5; }
[data-comm-order="6"] { --comm-order: 6; }
[data-comm-order="7"] { --comm-order: 7; }
[data-comm-order="8"] { --comm-order: 8; }

.banks [data-comm-anim] {
  opacity: 0;
  transform: translateX(-20px);
  transition:
    opacity 0.5s ease-out,
    transform 0.5s ease-out;
}

.banks.comm-anim-visible [data-comm-anim] {
  opacity: 1;
  transform: translateX(0);
  transition-delay: calc(var(--comm-order, 0) * 0.12s + 0.1s);
}

.banks .banks-visual[data-comm-anim] {
  opacity: 0;
  transform: translateX(32px);
  transition:
    opacity 0.55s ease-out,
    transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

.banks.comm-anim-visible .banks-visual[data-comm-anim] {
  opacity: 1;
  transform: translateX(0);
  transition-delay: calc(var(--comm-order, 0) * 0.12s + 0.1s);
}

@keyframes banks-show-fallback {
  from { opacity: 0; transform: translateX(-20px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes banks-show-fallback-right {
  from { opacity: 0; transform: translateX(32px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes banks-show-fallback-y {
  from { opacity: 0; transform: translate3d(0, 16px, 0); }
  to   { opacity: 1; transform: translate3d(0, 0, 0); }
}

.banks:not(#bankalar-sms):not(.comm-anim-visible) [data-comm-anim] {
  animation: banks-show-fallback 0.6s ease-out calc(2.5s + var(--comm-order, 0) * 0.12s) both;
}
.banks:not(#bankalar-sms):not(.comm-anim-visible) .banks-visual[data-comm-anim] {
  animation: banks-show-fallback-right 0.65s ease-out calc(2.5s + var(--comm-order, 0) * 0.12s) both;
}

#bankalar-sms.banks:not(.comm-anim-visible) [data-banka-mockup-anim] {
  animation: banks-show-fallback-right 0.65s ease-out calc(2.5s + 0.25s) both;
}

#tahsilat [data-comm-anim] {
  transition:
    opacity 0.36s ease-out,
    transform 0.36s ease-out;
}

#tahsilat.comm-anim-visible [data-comm-anim] {
  transition-delay: calc(var(--comm-order, 0) * 0.05s + 0.08s);
}

.comm-eyebrow-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.comm-dot {
  width: 6px;
  height: 6px;
  border-radius: 9999px;
  background: #2E6EEF;
  box-shadow: 0 0 0 4px rgba(46, 110, 239, 0.2);
  animation: comm-dot-pulse 1.4s ease-out infinite;
}

@keyframes comm-dot-pulse {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 4px rgba(46, 110, 239, 0.2);
  }
  70% {
    transform: scale(1.35);
    box-shadow: 0 0 0 10px rgba(46, 110, 239, 0);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 4px rgba(46, 110, 239, 0);
  }
}

.comm-eyebrow {
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #4D5765;
}

.comm-eyebrow-line {
  flex-shrink: 0;
  width: 3rem;
  height: 1px;
  background: #2E6EEF;
}

.comm-heading {
  font-family: var(--font-sans);
  font-size: 2rem;
  font-weight: 800;
  line-height: 1.15;
  color: #1A202C;
  margin: 0;
}

.comm-heading-highlight {
  color: #2E6EEF;
}

#sms .comm-heading-highlight {
  display: inline-block;
  margin-top: 0.08em;
  background: linear-gradient(120deg, #2563eb 0%, #3b82f6 45%, #60a5fa 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

@media (min-width: 768px) {
  .comm-heading {
    font-size: 2.5rem;
  }
}

@media (min-width: 1024px) {
  .comm-heading {
    font-size: 3rem;
  }
}

.comm-desc {
  font-size: 1.0625rem;
  line-height: 1.7;
  color: #4D5765;
  margin: 0;
  max-width: 32rem;
  font-weight: 400;
}

.comm-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.comm-list-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.98rem;
  color: #1f2933;
}

.comm-list-item span {
  color: #1f2933;
}

.comm-check {
  width: 1.6rem;
  height: 1.6rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border-radius: 9999px;
  background: radial-gradient(circle at 30% 20%, rgba(224, 231, 255, 0.95), rgba(238, 242, 255, 0.78));
  box-shadow: 0 10px 25px rgba(79, 70, 229, 0.28);
  color: #4f46e5;
}

.comm-check svg {
  width: 0.8rem;
  height: 0.8rem;
  stroke: currentColor;
}

.comm-check-green {
  background: radial-gradient(circle at 30% 20%, #6366f1, #4f46e5);
  box-shadow: 0 12px 30px rgba(79, 70, 229, 0.45);
  color: #ffffff;
}

.comm-check-green svg {
  stroke: #ffffff;
}

.comm-list-item-highlight {
  position: relative;
  align-items: center;
  padding: 1.1rem 1.5rem 1.1rem 1.25rem;
  margin-left: -1.25rem;
  margin-right: 0;
  border-radius: 1.25rem;
  background: linear-gradient(to right, #eef2ff, #f5f3ff);
  border: 1px solid #c7d2fe;
  box-shadow: 0 20px 30px -18px rgba(79, 70, 229, 0.35);
  gap: 0.6rem;
  overflow: hidden;
  max-width: 100%;
  box-sizing: border-box;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.comm-list-item-highlight::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 0.45rem;
  border-radius: 1.25rem 0 0 1.25rem;
  background: linear-gradient(to bottom, #6366f1, #4f46e5);
  box-shadow: 0 24px 35px rgba(79, 70, 229, 0.45);
}

.comm-feature-main {
  display: flex;
  flex-direction: column;
  gap: 0.38rem;
  min-width: 0;
  flex: 1 1 auto;
}

.comm-feature-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.comm-feature-title-row > span:first-child {
  font-weight: 800;
  color: #1f2937;
  letter-spacing: -0.01em;
  min-width: 0;
  flex: 1 1 12rem;
  overflow-wrap: anywhere;
}

.comm-feature-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  padding: 0.25rem 0.625rem;
  border-radius: 9999px;
  background: #eef2ff;
  color: #4338ca;
  border: 1px solid #c7d2fe;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
  animation: comm-badge-pulse 2s ease-in-out infinite;
}

.comm-feature-badge-icon {
  width: 0.875rem;
  height: 0.875rem;
  flex-shrink: 0;
  color: #4f46e5;
}

@keyframes comm-badge-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.85; }
}

.comm-feature-desc {
  margin: 0;
  font-size: 0.92rem;
  line-height: 1.58;
  color: #475569;
  max-width: 30rem;
}

@media (max-width: 768px) {
  .comm-feature-desc {
    max-width: 100%;
  }

  
  #alacak-yonetimi .comm-list-item-highlight {
    margin-left: 0;
    margin-right: 0;
    padding: 1rem 0.9rem 1rem 1.05rem;
    align-items: flex-start;
  }

  #alacak-yonetimi .comm-list-item-highlight .comm-check,
  #alacak-yonetimi .comm-list-item-highlight .alacak-check-red {
    margin-top: 0.15rem;
  }
}

@media (hover: hover) {
  .comm-list-item-highlight:hover {
    transform: translateY(-1px);
    border-color: #a5b4fc;
    box-shadow: 0 26px 34px -20px rgba(79, 70, 229, 0.42);
  }
}

.comm-phone-wrap {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

.comm-phone-bg {
  position: absolute;
  inset: auto;
  top: 40%;
  width: 320px;
  height: 320px;
  background: radial-gradient(circle at center, rgba(79, 70, 229, 0.15), transparent 70%);
  filter: blur(40px);
  transform: translateY(10%);
}

.comm-phone-mask {
  position: relative;
  width: 360px;
  height: 400px;
  -webkit-mask-image: linear-gradient(to bottom, #000 55%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 55%, transparent 100%);
}

@media (min-width: 640px) {
  .comm-phone-mask {
    width: 400px;
    height: 440px;
  }
}

@media (min-width: 1024px) {
  .comm-phone-mask {
    width: 420px;
    height: 480px;
  }
}

@media (min-width: 1280px) {
  .comm-phone-mask {
    width: 460px;
    height: 540px;
  }
}

.comm-phone-frame {
  position: absolute;
  inset-inline: 0;
  top: 0;
  bottom: -100px;
  background: #000;
  border-radius: 3.8rem;
  padding: 12px;
  box-shadow: 0 32px 60px -24px rgba(0, 0, 0, 0.9);
  border: 2px solid #1f1f1f;
}

.comm-phone-screen {
  position: relative;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #100d28 0%, #1a2665 45%, #1c73a1 100%);
  border-radius: 3rem;
  overflow: hidden;
  color: #f9fafb;
  padding: 1.25rem 1.5rem 2.25rem;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.comm-phone-notch {
  position: absolute;
  top: 0.95rem;
  left: 50%;
  transform: translateX(-50%);
  width: 6.5rem;
  height: 1.9rem;
  background: #000;
  border-radius: 9999px;
}

.comm-phone-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.8rem;
  color: rgba(248, 250, 252, 0.9);
}

.comm-phone-status-time {
  visibility: hidden;
}

.comm-phone-status-icons {
  display: flex;
  gap: 0.25rem;
}

.comm-status-dot {
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 9999px;
  background: rgba(248, 250, 252, 0.9);
}

.comm-phone-header {
  margin-top: 2.5rem;
  text-align: center;
  color: #f9fafb;
  align-self: center;
  width: 100%;
}

.comm-phone-date {
  font-size: 0.95rem;
  font-weight: 500;
  opacity: 0.9;
}

.comm-phone-time {
  display: block;
  margin-top: 0.4rem;
  font-size: 4.5rem;
  line-height: 1;
  font-weight: 600;
  letter-spacing: -0.06em;
}

.comm-phone-notifications {
  margin-top: 1.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.62rem;
  width: 100%;
  min-width: 0;
}

.comm-phone-body {
  margin-top: auto;
  padding-top: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  width: 100%;
  min-width: 0;
}

.comm-msg {
  max-width: 92%;
  padding: 0.55rem 0.7rem 0.45rem;
  border-radius: 1rem;
  font-size: 0.78rem;
  line-height: 1.4;
  box-sizing: border-box;
}

.comm-msg-in {
  align-self: flex-start;
  background: rgba(15, 23, 42, 0.55);
  border: 1px solid rgba(248, 250, 252, 0.12);
}

.comm-msg-out {
  align-self: flex-end;
  background: rgba(59, 130, 246, 0.35);
  border: 1px solid rgba(147, 197, 253, 0.35);
}

.comm-msg-label {
  display: block;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(248, 250, 252, 0.65);
  margin-bottom: 0.2rem;
}

.comm-msg-text {
  margin: 0;
  color: #f9fafb;
}

.comm-msg-time {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.65rem;
  color: rgba(248, 250, 252, 0.55);
  text-align: right;
}

.comm-msg-in .comm-msg-time {
  text-align: left;
}

.comm-notification {
  background: rgba(248, 250, 252, 0.97);
  color: #0f172a;
  border-radius: 1.1rem;
  padding: 0.42rem 0.72rem 0.48rem;
  box-shadow: 0 18px 45px -20px rgba(15, 23, 42, 0.95);
  overflow: hidden;
  backdrop-filter: blur(18px);
  transform-origin: top center;
  transition: box-shadow 0.3s ease, margin-top 0.3s ease;
}

.comm-notification-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: flex-start;
  gap: 0.45rem;
}

.comm-notification-icon {
  width: 2.1rem;
  height: 2.1rem;
  border-radius: 0.8rem;
  background: transparent;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.comm-notification-icon-mail {
  background: transparent;
}

.comm-notification-icon-sms {
  background: transparent;
}

.comm-notification-icon-img {
  width: 100%;
  height: 100%;
  border-radius: inherit;
  object-fit: cover;
  display: block;
}

.comm-notification-text {
  display: flex;
  flex-direction: column;
  gap: 0.04rem;
}

.comm-notification-app {
  font-size: 0.75rem;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.2;
}

.comm-notification-title {
  font-size: 0.82rem;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.22;
}

.comm-notification-desc {
  font-size: 0.78rem;
  line-height: 1.28;
  color: #374151;
}

.comm-notification-time {
  font-size: 0.72rem;
  color: #6b7280;
  margin-top: 0;
  line-height: 1.2;
}

.comm-notification + .comm-notification {
  margin-top: 8px;
}

.comm-notification-enter {
  animation: comm-notification-enter 0.55s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.comm-notification-exit {
  animation: comm-notification-exit 0.48s cubic-bezier(0.4, 0, 1, 1) forwards;
  pointer-events: none;
}

.comm-notification-bump {
  animation: comm-notification-bump 0.38s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes comm-notification-enter {
  0% {
    opacity: 0;
    transform: translate3d(10px, -22px, 0) scale(0.92);
    box-shadow: 0 8px 24px -16px rgba(15, 23, 42, 0.35);
  }
  58% {
    opacity: 1;
    transform: translate3d(-3px, 4px, 0) scale(1.02);
    box-shadow: 0 22px 50px -18px rgba(15, 23, 42, 0.55);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    box-shadow: 0 18px 45px -20px rgba(15, 23, 42, 0.95);
  }
}

@keyframes comm-notification-exit {
  0% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    max-height: 220px;
    margin-top: 0;
    padding-top: 0.42rem;
    padding-bottom: 0.48rem;
  }
  35% {
    opacity: 0.55;
    transform: translate3d(14px, -10px, 0) scale(0.97);
  }
  100% {
    opacity: 0;
    transform: translate3d(24px, -20px, 0) scale(0.9);
    max-height: 0;
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
    box-shadow: 0 4px 12px -8px rgba(15, 23, 42, 0.2);
  }
}

@keyframes comm-notification-bump {
  0% {
    transform: translate3d(0, -10px, 0);
  }
  100% {
    transform: translate3d(0, 0, 0);
  }
}

.comm-notification-enter .comm-notification-icon-img {
  animation: comm-notif-icon-in 0.5s cubic-bezier(0.22, 1, 0.36, 1) 0.06s both;
}

.comm-notification-enter .comm-notification-text {
  animation: comm-notif-text-in 0.48s cubic-bezier(0.22, 1, 0.36, 1) 0.1s both;
}

@keyframes comm-notif-icon-in {
  0% {
    opacity: 0;
    transform: scale(0.65) rotate(-8deg);
  }
  100% {
    opacity: 1;
    transform: scale(1) rotate(0deg);
  }
}

@keyframes comm-notif-text-in {
  0% {
    opacity: 0;
    transform: translate3d(0, 6px, 0);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .comm-notification-enter,
  .comm-notification-exit,
  .comm-notification-bump {
    animation: none !important;
  }

  .comm-notification-enter .comm-notification-icon-img,
  .comm-notification-enter .comm-notification-text {
    animation: none !important;
    opacity: 1;
    transform: none;
  }

  .comm-notification-enter {
    opacity: 1;
    transform: none;
  }

  .comm-notification-exit {
    opacity: 0;
    max-height: 0;
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
    transform: none;
  }
}

@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

.banks-logos-track.animate-scroll {
  animation: scroll 25s linear infinite;
}

.banks-logos-track.animate-scroll:hover {
  animation-play-state: paused;
}

.sms-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: linear-gradient(90deg, #f9fafb 0%, #f9fbff 45%, #eef4ff 100%);
  padding: 2.85rem 1.25rem 3.25rem;
  width: 100%;
  box-sizing: border-box;
}

.sms-inner {
  max-width: 80rem;
  width: 100%;
  margin: 0 auto;
  padding-top: 0;
}

.sms-card {
  position: relative;
  border-radius: 0;
  overflow: visible;
  min-height: 0;
  background: transparent;
  border: none;
}

@media (min-width: 1024px) {
  .sms-card {
    min-height: 0;
  }
}

.sms-card-overlay {
  display: none;
}

.sms-grid {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: center;
  padding: 2.5rem 1rem 2.8125rem;
}

@media (min-width: 768px) {
  .sms-grid {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

@media (min-width: 1024px) {
  .sms-grid {
    grid-template-columns: 1fr 1fr;
    padding: 2.75rem 2rem 2.8125rem;
  }
}

.sms-content {
  color: #0f172a;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.sms-eyebrow-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.5rem;
}

.sms-ping-wrap {
  position: relative;
  display: inline-flex;
  width: 0.5rem;
  height: 0.5rem;
}

.sms-ping-outer {
  position: absolute;
  inset: 0;
  border-radius: 9999px;
  background: #2563eb;
  opacity: 1;
}

.sms-ping-inner {
  position: relative;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 9999px;
  background: #2563eb;
}

.sms-eyebrow-line {
  flex-shrink: 0;
  width: 3rem;
  height: 1px;
  background: rgba(37, 99, 235, 0.35);
}

.sms-eyebrow {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #2563eb;
  margin: 0;
}

.sms-title {
  font-size: 1.875rem;
  font-weight: 700;
  line-height: 1.25;
  margin: 0;
  color: #0f172a;
}

.sms-title-highlight {
  color: #2563eb;
}

@media (min-width: 640px) {
  .sms-title {
    font-size: 2.25rem;
  }
}

@media (min-width: 1024px) {
  .sms-title {
    font-size: 3rem;
  }
}

.sms-desc {
  font-size: 1.125rem;
  line-height: 1.625;
  margin: 0;
  color: #475569;
}

.sms-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.sms-list-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 1rem;
}

.sms-list-item span {
  color: #334155;
}

.sms-list-item-highlight {
  align-items: flex-start;
  padding: 1rem 1.25rem;
  margin-left: -0.5rem;
  margin-right: 0.5rem;
  border-radius: 1.25rem;
  background: linear-gradient(to right, #ecfdf3, #f0fdf4);
  border: 1px solid #bbf7d0;
  box-shadow: 0 20px 30px -18px rgba(22, 163, 74, 0.6);
  gap: 0.9rem;
}

.sms-feature-main {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.sms-feature-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.sms-feature-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.125rem 0.6rem;
  border-radius: 9999px;
  background: #bbf7d0;
  color: #166534;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.sms-feature-desc {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.5;
  color: #4b5563;
  max-width: 30rem;
}

.sms-check {
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
  color: #22c55e;
}

.sms-cta-wrap {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding-top: 1rem;
}

@media (min-width: 640px) {
  .sms-cta-wrap {
    flex-direction: row;
  }
}

.sms-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  padding: 0.75rem 1rem;
  background: #fff;
  color: #2563eb;
  font-size: 1rem;
  font-family: var(--font-sans);
  border-radius: var(--radius);
  border: 1px solid transparent;
  text-decoration: none;
  transition: background 0.2s, color 0.2s;
}

.sms-cta:hover {
  background: #f9fafb;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
}

.sms-cta-arrow {
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
}

.sms-phone-right {
  display: none;
}

@media (min-width: 1024px) {
  .sms-phone-right {
    display: flex;
    position: relative;
  }
}

.sms-phone-wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  min-height: 100%;
  padding-left: 0;
  padding-right: 0;
}

.sms-mockup-wrapper .sms-nav-prev {
  left: -64px;
}

.sms-mockup-wrapper .sms-nav-next {
  right: -64px;
}

.sms-mockup-wrapper {
  position: relative;
  width: 360px;
  height: 400px;
  margin: 0 auto;
  transform-origin: center bottom;
  transform: translateY(10px);
  -webkit-mask-image: linear-gradient(to bottom, #000 70%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 70%, transparent 100%);
}

@media (min-width: 640px) {
  .sms-mockup-wrapper {
    width: 400px;
    height: 440px;
  }
}

@media (min-width: 1024px) {
  .sms-mockup-wrapper {
    width: 420px;
    height: 480px;
  }
}

@media (min-width: 1280px) {
  .sms-mockup-wrapper {
    width: 460px;
    height: 540px;
  }
}

.sms-phone-frame {
  position: relative;
  width: 100%;
  height: 100%;
  background: #000;
  border-radius: 3.8rem;
  padding: 12px;
  box-shadow: 0 32px 60px -24px rgba(15, 23, 42, 0.9);
  border: 2px solid #1f1f1f;
}

.sms-phone-screen {
  position: relative;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #100d28 0%, #1a2665 45%, #1c73a1 100%);
  border-radius: 3rem;
  overflow: hidden;
  color: #f9fafb;
}

.sms-lock-screen {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 18px 18px 24px;
  box-sizing: border-box;
}

.sms-lock-screen .sms-phone-status-bar {
  background: transparent;
  color: #f9fafb;
}

.sms-lock-screen .sms-signal-bars span {
  background: #f9fafb;
}

.sms-lock-screen .sms-wifi-svg,
.sms-lock-screen .sms-battery-svg {
  color: #f9fafb;
}

.sms-lock-date-wrap {
  margin-top: 18px;
  text-align: center;
}

.sms-lock-date-text {
  font-size: 0.85rem;
  font-weight: 500;
  color: rgba(248, 250, 252, 0.9);
}

.sms-lock-time {
  margin-top: 4px;
  text-align: center;
  font-size: 3.75rem;
  line-height: 1;
  font-weight: 600;
  letter-spacing: -0.04em;
}

.sms-lock-notifications {
  margin-top: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.sms-lock-notification {
  background: rgba(248, 250, 252, 0.96);
  color: #0f172a;
  border-radius: 18px;
  padding: 10px 12px;
  box-shadow: 0 18px 45px -20px rgba(15, 23, 42, 0.9);
}

.sms-lock-notification-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 2px;
}

.sms-lock-notification-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.sms-lock-app-name {
  font-size: 0.75rem;
  font-weight: 600;
  color: #0f172a;
}

.sms-lock-app-source {
  font-size: 0.75rem;
  font-weight: 500;
  color: #4b5563;
}

.sms-lock-notification-time {
  font-size: 0.75rem;
  color: #6b7280;
  flex-shrink: 0;
}

.sms-lock-notification-title {
  margin: 0;
  margin-top: 4px;
  font-size: 0.9rem;
  line-height: 1.4;
  color: #111827;
}

.sms-lock-notification + .sms-lock-notification {
  margin-top: 2px;
}

.sms-mockup-slide {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  background: #fff;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s;
}

.sms-mockup-slide.active {
  opacity: 1;
  visibility: visible;
  z-index: 1;
}

.sms-phone-status-bar {
  position: relative;
  background: #fff;
  margin: 0;
  padding: 0 24px;
  height: 52px;
  min-height: 52px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  flex-shrink: 0;
}

.sms-time-new {
  font-weight: 600;
  color: #111827;
  flex-shrink: 0;
  line-height: 1;
  display: flex;
  align-items: center;
}

.sms-notch {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100px;
  height: 26px;
  background: #111827;
  border-radius: 18px;
  pointer-events: none;
}

.sms-status-row {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #111827;
  flex-shrink: 0;
  line-height: 1;
}

.sms-signal-bars {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: 12px;
}

.sms-signal-bars span {
  width: 3px;
  background: #111827;
  border-radius: 9999px;
}

.sms-signal-bars span:nth-child(1) { height: 6px; }
.sms-signal-bars span:nth-child(2) { height: 8px; }
.sms-signal-bars span:nth-child(3) { height: 10px; }
.sms-signal-bars span:nth-child(4) { height: 12px; }

.sms-wifi-svg {
  width: 16px;
  height: 14px;
  display: block;
}

.sms-battery-svg {
  width: 24px;
  height: 12px;
  display: block;
}

.sms-phone-header-bar {
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
  padding: 8px 16px 8px 6px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}

.sms-header-left {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #3b82f6;
  flex-shrink: 0;
  margin-left: -2px;
}

.sms-icon-back-svg {
  width: 20px;
  height: 20px;
}

.sms-header-text {
  color: #3b82f6;
  font-size: 16px;
}

.sms-byonetim-label {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-weight: 700;
  color: #111827;
  font-size: 16px;
}

.sms-header-right-btn {
  background: none;
  border: none;
  color: #3b82f6;
  font-size: 16px;
  cursor: default;
  padding: 0;
  font-family: inherit;
}

.sms-phone-chat {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.sms-messages-list {
  flex: 1;
  overflow-y: auto;
  padding: 10px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.sms-msg-block.sms-msg-incoming {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.sms-msg-block.sms-msg-incoming .sms-bubble-new {
  max-width: 75%;
}

.sms-bubble-new {
  padding: 12px 16px;
  background: #e5e7eb;
  border-radius: 16px 16px 16px 4px;
  display: inline-block;
}

.sms-bubble-text {
  margin: 0;
  color: #374151;
  font-size: 14px;
  line-height: 1.4;
  word-wrap: break-word;
}

.sms-msg-time {
  color: #6b7280;
  font-size: 12px;
  margin-left: 8px;
  margin-top: 4px;
  display: block;
}

.sms-phone-input-area {
  padding: 12px 16px;
  background: #fff;
  border-top: 1px solid #e5e7eb;
  flex-shrink: 0;
}

.sms-input-inner {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #f3f4f6;
  border-radius: 9999px;
  padding: 8px 16px;
}

.sms-send-svg {
  width: 24px;
  height: 24px;
  color: #3b82f6;
}

.sms-mail-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px;
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
  flex-shrink: 0;
}

.sms-mail-nav-left {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #3b82f6;
}

.sms-mail-nav-text {
  font-size: 16px;
  color: #3b82f6;
}

.sms-mail-nav-right {
  font-size: 16px;
  color: #3b82f6;
}

.sms-inbox-title {
  margin: 0;
  padding: 16px 16px 12px;
  font-size: 22px;
  font-weight: 700;
  color: #111827;
  flex-shrink: 0;
}

.sms-inbox-list {
  flex: 1;
  overflow-y: auto;
  padding: 0;
}

.sms-inbox-item {
  position: relative;
  padding: 12px 16px 12px 16px;
  border-bottom: 1px solid #e5e7eb;
}

.sms-inbox-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 4px;
}

.sms-inbox-sender {
  font-size: 13px;
  font-weight: 700;
  color: #374151;
}

.sms-inbox-time {
  font-size: 12px;
  color: #9ca3af;
}

.sms-inbox-subject {
  font-size: 15px;
  font-weight: 700;
  color: #111827;
  margin-bottom: 2px;
  padding-right: 24px;
}

.sms-inbox-preview {
  margin: 0;
  font-size: 13px;
  color: #6b7280;
  line-height: 1.4;
}

.sms-inbox-arrow {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  color: #3b82f6;
}

.sms-home-indicator {
  position: absolute;
  bottom: 8px;
  left: 50%;
  transform: translateX(-50%);
  width: 128px;
  height: 4px;
  background: #374151;
  border-radius: 9999px;
}

.sms-nav-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid rgba(15, 23, 42, 0.2);
  background: #fff;
  color: #334155;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: background 0.2s, box-shadow 0.2s;
  z-index: 3;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.sms-nav-arrow:hover {
  background: #f8fafc;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.sms-nav-prev {
  left: 0;
}

.sms-nav-next {
  right: 0;
}

.sms-card-bottom {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 4.25rem;
  border-top: 1px solid #e5e7eb;
  background: rgba(99, 102, 241, 0.08);
}

.sms-card-bottom-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: #1e293b;
  text-decoration: none;
  transition: color 0.2s ease;
}

.sms-card-bottom-link:hover {
  color: #2563eb;
}

.price-dark-section {
  padding: 2.5rem 1.25rem 3.5rem;
  background:
    linear-gradient(180deg, rgba(241, 245, 249, 0.9) 0%, transparent 28%),
    linear-gradient(180deg, transparent 70%, rgba(15, 23, 42, 0.04) 100%),
    linear-gradient(165deg, #f1f5f9 0%, #f6f8fc 45%, #eef2f8 100%);
}

.price-dark-inner {
  max-width: 90rem;
  margin: 0 auto;
}

.price-dark-card {
  border-radius: 28px;
  padding: 2.6rem 2.6rem 2rem;
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 2.2rem;
  color: #fff;
  background:
    radial-gradient(1200px 420px at 8% 0%, rgba(17, 100, 255, 0.28) 0%, rgba(17, 100, 255, 0) 45%),
    radial-gradient(900px 360px at 95% 100%, rgba(110, 45, 255, 0.25) 0%, rgba(110, 45, 255, 0) 55%),
    linear-gradient(135deg, #030b17 0%, #0a1532 40%, #0b0b2c 100%);
  box-shadow: 0 20px 48px rgba(2, 6, 23, 0.35);
}

.price-dark-eyebrow {
  margin: 0 0 0.5rem;
  font-size: 0.75rem;
  letter-spacing: 0.12em;
  color: rgba(255, 255, 255, 0.84);
}

.price-dark-title {
  margin: 0;
  font-size: 2.7rem;
  line-height: 1.08;
  letter-spacing: -0.02em;
}

.price-dark-desc {
  margin: 0.95rem 0 1.2rem;
  max-width: 32rem;
  color: rgba(255, 255, 255, 0.82);
  line-height: 1.5;
}

.price-dark-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 1.3rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  background: rgba(255, 255, 255, 0.03);
}

.price-dark-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
}

.price-dark-btn-ghost {
  border-color: rgba(255, 255, 255, 0.36);
  background: rgba(148, 163, 184, 0.22);
}

.price-dark-note {
  margin-top: 1.2rem;
  max-width: 31rem;
  border-radius: 6px;
  font-size: 0.84rem;
  line-height: 1.35;
  color: rgba(241, 245, 249, 0.9);
  background: rgba(148, 163, 184, 0.25);
  padding: 0.8rem 0.9rem;
}

.price-dark-right {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.price-dark-widget {
  border-radius: 28px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(148, 163, 184, 0.2);
  backdrop-filter: blur(3px);
  padding: 0.9rem 1.35rem 0.55rem;
  min-height: 400px;
}

.price-dark-saving {
  min-height: 1.1rem;
}

.price-dark-switch {
  margin: 0 auto 0.65rem;
  width: fit-content;
  border-radius: 999px;
  padding: 4px;
  background: rgba(15, 23, 42, 0.42);
  border: 1px solid rgba(255, 255, 255, 0.18);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
}

.price-dark-switch-btn {
  border: none;
  border-radius: 999px;
  padding: 0.45rem 0.9rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.78);
  background: transparent;
  cursor: default;
}

.price-dark-switch-btn-active {
  color: #0f172a;
  background: #e2e8f0;
}

.price-dark-widget-title {
  margin: 0;
  text-align: center;
  font-size: 1.85rem;
  line-height: 1.12;
  font-weight: 500;
  color: #f8fafc;
}

.price-dark-block-title {
  margin: 0.9rem 0 0.45rem;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.8);
}

.price-dark-block-title-sms {
  margin-top: 0.95rem;
}

.price-dark-price-row {
  margin-top: 1.35rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}

.price-dark-price-label {
  color: rgba(255, 255, 255, 0.78);
  font-size: 1rem;
}

.price-dark-price-box {
  min-width: 138px;
  height: 48px;
  border-radius: 8px;
  background: #fff;
  color: #0f172a;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
}

.price-dark-price-box strong {
  font-size: 2rem;
  line-height: 1;
}

.price-dark-price-box span {
  font-size: 0.92rem;
  color: #64748b;
}

.price-dark-input-wrap {
  margin-top: 0.95rem;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.price-dark-input-label {
  display: inline-flex;
  margin-bottom: 0;
  color: rgba(255, 255, 255, 0.86);
  font-size: 0.98rem;
  white-space: nowrap;
}

.price-dark-input {
  width: 140px;
  height: 44px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  background: rgba(15, 23, 42, 0.34);
  color: #ffffff;
  font-size: 1rem;
  font-weight: 600;
  padding: 0 0.75rem;
  outline: none;
  margin-left: 0;
}

.price-dark-input::placeholder {
  color: rgba(255, 255, 255, 0.55);
}

.price-dark-duration-label {
  margin: 0.45rem 0 0;
  color: rgba(255, 255, 255, 0.86);
  font-size: 0.98rem;
  text-align: left;
}

.price-dark-duration-wrap {
  margin-top: 0.45rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.price-plan-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
  width: 100%;
}

.price-plan-card {
  min-height: 62px;
  border-radius: 12px;
  border: 1px solid #dbe3ee;
  background: #ffffff;
  color: #0f172a;
  padding: 0.5rem 0.55rem 0.45rem;
  text-align: left;
  cursor: pointer;
  position: relative;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, transform 0.2s ease;
}

.price-plan-card-title {
  display: block;
  font-size: 1.04rem;
  font-weight: 800;
  line-height: 1.05;
}

.price-plan-card-note {
  display: block;
  margin-top: 0.22rem;
  font-size: 0.72rem;
  font-weight: 600;
  color: #64748b;
}

.price-plan-card.is-active {
  border-color: #4f46e5;
  background: linear-gradient(180deg, #f5f7ff 0%, #eef2ff 100%);
  box-shadow:
    0 0 0 1px rgba(79, 70, 229, 0.28),
    0 10px 20px -14px rgba(79, 70, 229, 0.55);
  transform: translateY(-1px);
}

.price-plan-card.is-active::after {
  content: "\f00c";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  top: 8px;
  right: 9px;
  font-size: 0.76rem;
  color: #4f46e5;
}

.price-plan-card.is-active .price-plan-card-note {
  color: #4f46e5;
}

.price-field-help {
  margin: 0.35rem 0 0;
  font-size: 0.77rem;
  font-weight: 500;
  color: #7c8da5;
}

.price-plan-selected {
  margin: 0.45rem 0 0;
  padding: 0.3rem 0.55rem;
  display: inline-flex;
  border-radius: 999px;
  border: 1px solid #dbeafe;
  background: #f8fbff;
  color: #1d4ed8;
  font-size: 0.74rem;
  font-weight: 600;
}

.price-summary-title {
  margin: 0.25rem 0 0.35rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #64748b;
}

.price-dark-select {
  width: 140px;
  margin-left: 0;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M7 10l5 5 5-5' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' opacity='0.92'/%3E%3C/svg%3E");
  background-position: calc(100% - 10px) 50%;
  background-size: 18px 18px;
  background-repeat: no-repeat;
  padding-right: 2.35rem;
  line-height: 1.2;
}

.price-dark-summary {
  margin-top: 0.25rem;
  padding-top: 0.25rem;
  border-top: 1px solid rgba(148, 163, 184, 0.38);
}

.price-sms-summary {
  margin-top: 0.6rem;
}

.price-dark-total-line {
  display: flex;
  align-items: baseline;
  gap: 0.45rem;
}

.price-dark-total-line strong {
  font-size: 2.25rem;
  line-height: 1;
  color: #f8fafc;
  letter-spacing: -0.02em;
}

.price-dark-total-line span {
  font-size: 1.2rem;
  color: rgba(226, 232, 240, 0.85);
  font-weight: 600;
}

.price-dark-saving {
  margin: 0.2rem 0 0;
  color: #34d399;
  font-weight: 700;
  font-size: 1.05rem;
}

.price-dark-summary-cards {
  margin-top: 0.2rem;
  padding-top: 0.2rem;
  border-top: 1px solid rgba(148, 163, 184, 0.38);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.55rem;
}

.price-dark-summary-cards-sms {
  grid-template-columns: 1fr;
}

.price-dark-summary-card {
  border-radius: 16px;
  padding: 0.52rem 0.65rem;
  background: rgba(30, 41, 59, 0.55);
  border: 1px solid rgba(148, 163, 184, 0.2);
}

.price-dark-summary-card span {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: rgba(203, 213, 225, 0.8);
}

.price-dark-summary-card strong {
  display: block;
  margin-top: 0.22rem;
  font-size: 1.2rem;
  line-height: 1;
  color: #f8fafc;
}

.price-dark-right-note {
  margin: 0.7rem 0 0;
  text-align: center;
  font-size: 0.9rem;
  color: rgba(203, 213, 225, 0.88);
}

.price-dark-section.price-saas {
  padding: 1.4rem 0 0;
  background: transparent;
  position: relative;
  z-index: 1;
}

.price-dark-section.price-saas::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1.6rem;
  height: 1.6rem;
  background: linear-gradient(135deg, #030b17 0%, #0a1532 40%, #0b0b2c 100%);
  pointer-events: none;
  z-index: 2;
}

.price-saas-hero {
  max-width: 70rem;
  margin: 0 auto 1.4rem;
  text-align: center;
  color: #0f172a;
}

.price-saas-hero-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.38rem;
  padding: 0.28rem 0.7rem;
  border-radius: 999px;
  border: 1px solid #c7d2fe;
  background: #eef2ff;
  color: #4338ca;
  font-size: 0.72rem;
  font-weight: 600;
}

.price-saas-hero-title {
  margin: 0.75rem 0 0;
  font-size: clamp(2rem, 4vw, 3.35rem);
  line-height: 1.08;
  letter-spacing: -0.03em;
  font-weight: 800;
  color: #0f172a;
}

.price-saas-hero-accent {
  display: inline-block;
  margin-top: 0.08em;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: linear-gradient(120deg, #2563eb 0%, #3b82f6 45%, #60a5fa 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.price-saas-hero-desc {
  margin: 0.55rem auto 0;
  max-width: 46rem;
  color: #64748b;
  font-size: 1.02rem;
  line-height: 1.55;
}

.price-dark-section.price-saas .price-saas-hero {
  display: none;
}

@media (max-width: 1200px) {
  .price-dark-inner {
    max-width: 84rem;
  }
}

.price-dark-section.price-saas .price-dark-inner {
  max-width: none;
  width: 100%;
  margin: 0;
}

.price-saas-shell {
  position: relative;
  color: #fff;
  border-radius: 56px 56px 0 0 !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  background:
    radial-gradient(1200px 420px at 8% 0%, rgba(17, 100, 255, 0.28) 0%, rgba(17, 100, 255, 0) 45%),
    radial-gradient(900px 360px at 95% 100%, rgba(110, 45, 255, 0.25) 0%, rgba(110, 45, 255, 0) 55%),
    linear-gradient(135deg, #030b17 0%, #0a1532 40%, #0b0b2c 100%) !important;
  box-shadow: 0 20px 48px rgba(2, 6, 23, 0.35);
  overflow: hidden;
}

.price-saas-shell .price-saas-copy {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  width: 100%;
  max-width: 80rem;
  margin-left: max(1.25rem, calc((100vw - 80rem) / 2 - 3rem));
  margin-right: auto;
  padding: 0 1.25rem;
  box-sizing: border-box;
}

.price-saas-shell.price-dark-card {
  grid-template-columns: 1fr 380px;
  padding: 2.2rem 0 2rem;
  align-items: center;
}

.price-saas-shell::before {
  display: none;
}

.price-saas-copy,
.price-saas-panel {
  position: relative;
  z-index: 1;
}

.price-saas-copy .price-dark-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  width: fit-content;
  margin: 0;
  padding: 0.35rem 0.8rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #818cf8;
  background: rgba(79, 70, 229, 0.18);
  border: 1px solid rgba(99, 102, 241, 0.35);
}

.price-saas-copy .price-dark-title {
  color: #e2e8f0;
  letter-spacing: -0.01em;
  line-height: 1.25;
  font-weight: 700;
  font-size: 1.875rem;
  margin: 0;
}

@media (min-width: 640px) {
  .price-saas-copy .price-dark-title {
    font-size: 2.25rem;
  }
}

@media (min-width: 1024px) {
  .price-saas-copy .price-dark-title {
    font-size: 3rem;
  }
}

.price-saas-title-accent {
  display: inline;
  background: linear-gradient(120deg, #818cf8 0%, #a5b4fc 40%, #7dd3fc 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.price-saas-copy .price-dark-desc {
  color: rgba(226, 232, 240, 0.8);
  margin: 0;
  line-height: 1.75;
  font-size: 1.125rem;
  max-width: 32rem;
}

.price-saas-shell .price-dark-actions {
  margin-top: 0;
  gap: 0.75rem;
}

.price-saas-shell .price-dark-right {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  width: 100%;
  max-width: none;
  padding: 2rem 1.75rem 2rem 0;
  box-sizing: border-box;
  transform: none;
}

.price-saas-perks {
  list-style: none;
  margin: 0.2rem 0 0;
  padding: 0;
  width: 100%;
  max-width: 44rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  background: transparent;
  border: none;
  box-shadow: none;
}

.price-saas-perks li {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.98rem;
  font-weight: 500;
  color: rgba(226, 232, 240, 0.88);
  line-height: 1.35;
}

.price-check {
  width: 1.6rem;
  height: 1.6rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border-radius: 9999px;
  background: radial-gradient(circle at 30% 20%, rgba(224, 231, 255, 0.95), rgba(238, 242, 255, 0.78));
  box-shadow: 0 10px 25px rgba(79, 70, 229, 0.28);
  color: #4f46e5;
}

.price-check svg {
  width: 0.8rem;
  height: 0.8rem;
  stroke: currentColor;
}

.price-saas-copy .price-dark-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  min-height: 44px;
  padding: 0.75rem 1rem;
  border: none;
  border-radius: 12px;
  color: #fff;
  font-weight: 500;
  font-size: 1rem;
  background: linear-gradient(135deg, #4f46e5 0%, #6366f1 100%);
  box-shadow: 0 8px 18px -12px rgba(79, 70, 229, 0.6);
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
}

.price-saas-copy .price-dark-btn:hover {
  filter: brightness(1.06);
  box-shadow: 0 6px 20px rgba(79, 70, 229, 0.4);
  transform: translateY(-1px);
}

.price-saas-copy .price-dark-btn-ghost {
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
  color: #334155;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.price-saas-copy .price-dark-btn-ghost:hover {
  border-color: #cbd5e1;
  background: #f8fafc;
  transform: translateY(-1px);
}

.price-saas-copy .price-dark-note {
  margin-top: 1.35rem;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  border-left: 4px solid #6366f1;
  background: linear-gradient(90deg, rgba(99, 102, 241, 0.06) 0%, #f8fafc 38%);
  color: #64748b;
  font-size: 0.8125rem;
  line-height: 1.45;
}

.price-left-spacer {
  margin-top: 1.35rem;
  height: 74px;
}

.price-saas-panel {
  align-items: stretch;
  display: flex;
  justify-content: flex-end;
}

.price-saas .price-dark-widget {
  position: relative;
  flex: 0 0 auto;
  min-height: auto;
  border-radius: 0;
  border: none;
  background: transparent;
  backdrop-filter: none;
  box-shadow: none;
  padding: 0;
  width: 340px;
  max-width: 340px;
}

.price-saas .price-dark-widget::before {
  display: none;
}

.price-saas .price-dark-switch {
  margin-bottom: 0.85rem;
  border: 1px solid #e2e8f0;
  background: #eef2f7;
  padding: 5px;
  width: 100%;
  max-width: 240px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
}

.price-view-switch {
  max-width: 100% !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.price-view-switch .price-dark-switch-btn {
  font-size: 0.82rem;
  font-weight: 700;
}

.price-card-hidden {
  display: none !important;
}

.price-saas .price-dark-switch-btn {
  cursor: pointer;
  color: #64748b;
  transition: color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  width: 100%;
  justify-content: center;
}

.price-saas .price-dark-switch-btn-active {
  background: #fff;
  color: #0f172a;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.07);
}

.price-saas .price-dark-widget-title {
  color: #0f172a;
  font-weight: 600;
  font-size: 1.35rem;
  letter-spacing: -0.02em;
}

.price-saas .price-dark-block-title {
  color: #64748b;
}

.price-split-stack {
  margin-top: 0.7rem;
  display: grid;
  grid-template-columns: 340px;
  grid-auto-rows: 1fr;
  gap: 0.5rem;
  justify-content: center;
  align-items: stretch;
  max-width: 340px;
  width: 340px;
}

.price-split-card {
  position: relative;
  background: #ffffff;
  border: 1px solid #dbe3ee;
  border-radius: 14px;
  padding: 0.58rem 0.75rem 0.52rem;
  height: 100%;
  width: 100%;
  max-width: none;
  box-shadow: 0 10px 20px -20px rgba(15, 23, 42, 0.3);
}

.price-split-card::before {
  display: none;
}

.price-split-card-program {
  padding-top: 0.62rem;
  max-width: 340px;
  width: 340px;
  justify-self: stretch;
  min-height: 360px;
  background: #ffffff;
  border-color: #e2e8f0;
  box-shadow: 0 12px 22px -20px rgba(15, 23, 42, 0.28);
}

.price-program-subtitle {
  margin: 0.24rem 0 0.55rem;
  font-size: 0.8rem;
  color: #64748b;
  line-height: 1.35;
}

.price-program-note {
  margin: 0.45rem 0 0.3rem;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.5;
  color: #334155;
}

.price-split-card-sms {
  padding-top: 0.62rem;
  max-width: 340px;
  width: 340px;
  justify-self: stretch;
  min-height: 360px;
  display: flex;
  flex-direction: column;
  background: linear-gradient(150deg, #eef2ff 0%, #e0e7ff 44%, #eef2ff 100%);
  border-color: #c7d2fe;
  box-shadow: 0 12px 24px -20px rgba(79, 70, 229, 0.35);
  overflow: hidden;
}

.price-split-card-sms::after {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  right: -62px;
  top: -48px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(99, 102, 241, 0.28) 0%, rgba(99, 102, 241, 0.02) 70%);
  pointer-events: none;
}

.price-split-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
}

.price-card-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.18rem 0.55rem;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #4338ca;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
}

.price-card-badge-neutral {
  color: #0f766e;
  background: #ecfeff;
  border-color: #99f6e4;
}

.price-split-card .price-dark-block-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 0.8rem;
  letter-spacing: 0.07em;
}

.price-split-card .price-dark-block-title-sms {
  margin-top: 0;
  margin-bottom: 0;
}

.price-split-card .price-dark-summary {
  border-top: none;
  padding-top: 0;
}

.price-split-card .price-dark-summary-cards {
  border-top: 1px solid #e2e8f0;
  padding-top: 0.3rem;
}

.price-split-card-program .price-dark-summary-cards {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.4rem;
}

.price-split-card-program #price-total-card {
  grid-column: 1 / -1;
  background: #f8fafc;
  border-color: #dbe3ee;
  box-shadow: none;
}

.price-split-card-program #price-total-card span {
  color: #64748b;
}

.price-split-card-program #price-total-card strong {
  font-size: 1.75rem;
  color: #0f172a;
}

.price-program-cta {
  margin-top: 0.65rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 40px;
  border-radius: 10px;
  border: 1px solid #c7d2fe;
  background: linear-gradient(135deg, #4f46e5 0%, #6366f1 100%);
  color: #ffffff;
  font-size: 0.9rem;
  font-weight: 700;
  text-decoration: none;
  transition: filter 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
  box-shadow: 0 8px 18px -12px rgba(79, 70, 229, 0.6);
}

@media (hover: hover) {
  .price-program-cta:hover {
    filter: brightness(1.04);
    transform: translateY(-1px);
    box-shadow: 0 12px 20px -14px rgba(79, 70, 229, 0.65);
  }
}

.price-info-grid {
  margin-top: 0.75rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(320px, 420px));
  gap: 0.6rem;
  justify-content: start;
}

.price-info-card {
  width: 100%;
  min-height: 56px;
  border-radius: 12px;
  border: 1px solid #d6deeb;
  border-left: 4px solid #6366f1;
  background: #f8fafc;
  padding: 0.2rem 0.6rem;
}

.price-info-inline {
  margin: 0;
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
}

.price-info-inline i {
  color: #4f46e5;
  font-size: 0.9rem;
  flex-shrink: 0;
  margin-top: 0.08rem;
}

.price-info-text {
  margin: 0;
  font-size: 0.8rem;
  line-height: 1.4;
  color: #64748b;
}

.price-split-card-sms .price-dark-summary-cards,
.price-split-card-sms .price-dark-summary {
  border-top-color: rgba(79, 70, 229, 0.24);
}

.price-sms-plan-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.45rem;
  width: 100%;
}

.price-sms-plan-card {
  min-height: 46px;
  padding: 0.45rem 0.5rem;
}

.price-sms-plan-card .price-plan-card-title {
  font-size: 0.92rem;
}

.price-sms-cta {
  margin-top: auto;
  background: linear-gradient(135deg, #4338ca 0%, #6366f1 100%) !important;
}

@media (hover: hover) {
  .price-plan-card:hover {
    border-color: #a5b4fc;
    transform: translateY(-1px);
  }

  .price-split-card:hover {
    border-color: #cbd5e1;
    box-shadow: 0 18px 30px -24px rgba(15, 23, 42, 0.35);
  }

  .price-split-card-sms:hover {
    border-color: #a5b4fc;
    box-shadow: 0 22px 34px -24px rgba(79, 70, 229, 0.48);
  }
}

@media (max-width: 640px) {
  .price-split-stack {
    grid-template-columns: 1fr;
    max-width: 100%;
    width: 100%;
  }

  .price-split-card-program,
  .price-split-card-sms {
    max-width: 100%;
    width: 100%;
    min-height: auto;
  }

  .price-saas .price-dark-widget {
    padding: 0.55rem 0.55rem 0.3rem;
  }

  .price-info-grid {
    grid-template-columns: 1fr;
  }

  .price-plan-grid {
    grid-template-columns: 1fr;
  }

  .price-sms-plan-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .price-card-badge {
    display: none;
  }
}

.price-saas .price-dark-input-label,
.price-saas .price-dark-duration-label {
  color: #475569;
  font-weight: 500;
  font-size: 0.875rem;
}

.price-saas .price-dark-input {
  width: 100%;
  max-width: 110px;
  height: 36px;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  background: #fff;
  color: #0f172a;
  font-size: 0.95rem;
  font-weight: 600;
  padding: 0 0.65rem;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.price-saas .price-dark-input:focus {
  border-color: #a5b4fc;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
}

.price-saas .price-dark-input::placeholder {
  color: #94a3b8;
  font-size: 0.93rem;
  font-weight: 500;
}

.price-saas .price-dark-select {
  max-width: 160px;
  height: 42px;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  background-color: #fff;
  color: #0f172a;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M7 10l5 5 5-5' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: calc(100% - 8px) 50%;
  background-size: 18px 18px;
  background-repeat: no-repeat;
  padding-right: 2.35rem;
  line-height: 1.2;
}

.price-saas .price-dark-summary,
.price-saas .price-dark-summary-cards {
  border-top-color: #e2e8f0;
}

.price-saas .price-dark-summary-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

@media (hover: hover) {
  .price-saas .price-dark-summary-card:hover {
    border-color: #cbd5e1;
    box-shadow: 0 6px 16px -6px rgba(15, 23, 42, 0.1);
    transform: translateY(-1px);
  }

  .price-saas #price-total-card:hover {
    border-color: #a5b4fc;
  }
}

.price-saas #price-total-card {
  background: linear-gradient(155deg, #f5f3ff 0%, #ffffff 55%);
  border-color: #c7d2fe;
  box-shadow: 0 4px 16px -4px rgba(99, 102, 241, 0.2);
}

.price-saas #price-total-card span {
  color: #4f46e5;
}

.price-saas #price-total-card strong {
  color: #312e81;
  font-size: 1.28rem;
  letter-spacing: -0.02em;
}

.price-saas .price-dark-summary-card span {
  color: #64748b;
  font-weight: 600;
  letter-spacing: 0.04em;
}

.price-saas .price-dark-summary-card strong {
  color: #0f172a;
}

.price-saas .price-dark-saving {
  text-align: center;
  color: #047857;
  font-weight: 700;
  margin-top: 0.4rem;
  padding: 0.4rem 0.65rem;
  border-radius: 10px;
  background: rgba(16, 185, 129, 0.09);
}

@media (max-width: 1024px) {
  .price-dark-card {
    grid-template-columns: 1fr;
  }

  .price-saas-shell.price-dark-card {
    grid-template-columns: 1fr;
    padding: 1.8rem 0 1.6rem;
  }

  .price-saas-shell .price-dark-right {
    justify-content: center;
    padding: 0 1.25rem 1.75rem;
    width: 100%;
    max-width: 100%;
  }

  .price-saas .price-dark-widget {
    width: min(100%, 340px);
    max-width: 340px;
  }

  .price-dark-title {
    font-size: 2.2rem;
  }
  .price-dark-widget-title {
    font-size: 1.7rem;
  }

  .price-saas .price-dark-widget-title {
    font-size: 1.45rem;
  }
}

@media (max-width: 640px) {
  .price-saas-shell {
    padding: 1.75rem 0 !important;
    gap: 1.5rem;
  }

  .price-saas-shell .price-dark-right {
    padding: 0 0.75rem 1.5rem;
  }

  .price-saas .price-dark-widget {
    width: min(100%, 340px);
    max-width: 340px;
  }

  
  .price-saas .price-dark-summary-cards {
    grid-template-columns: 1fr !important;
  }
}

.price-saas .price-split-stack,
.price-saas .price-split-card-program,
.price-saas .price-split-card-sms {
  width: 340px !important;
  max-width: 340px !important;
}

@media (max-width: 520px) {
  .price-saas .price-split-stack,
  .price-saas .price-split-card-program,
  .price-saas .price-split-card-sms {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }
}

@media (max-width: 900px) {
  .features-slider {
    flex-direction: column;
    gap: 16px;
  }

  .features-arrow {
    display: none;
  }

  
  .features .features-dots {
    display: none;
  }

  
  .features-strip {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    overflow: visible;
  }

  .features-slides {
    overflow: visible;
    min-width: 0;
    width: 100%;
    max-width: 100%;
  }

  .features-slide {
    min-width: 0;
    max-width: 100%;
    overflow: visible;
    box-sizing: border-box;
  }

  .features-slide .features-cards-stack {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: visible;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }

  .features-slide .features-cards-stack .features-card-item {
    display: none;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    margin: 0;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    column-gap: 0.85rem;
    row-gap: 0.25rem;
    align-items: start;
    text-align: left;
    height: auto;
    min-height: 0;
    padding: 1.1rem 1.1rem 1.15rem;
    border-radius: 14px;
    border: 1px solid rgba(226, 232, 240, 0.95);
    box-shadow:
      0 1px 2px rgba(15, 23, 42, 0.04),
      0 6px 16px rgba(15, 23, 42, 0.06);
  }

  .features-slide .features-cards-stack .features-card-item.is-active {
    display: grid;
    animation: features-card-enter 0.3s ease-out;
  }

  @keyframes features-card-enter {
    from {
      opacity: 0.88;
      transform: translateY(5px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  .features-slide .features-cards-stack .features-card-item .feature-icon {
    grid-column: 1;
    grid-row: 1 / -1;
    align-self: start;
    width: 48px;
    height: 48px;
    border-radius: 11px;
    margin: 0;
  }

  .features-slide .features-cards-stack .features-card-item .feature-card-title {
    grid-column: 2;
    grid-row: 1;
    margin: 0 0 0.15rem;
  }

  .features-slide .features-cards-stack .features-card-item .feature-card-desc {
    grid-column: 2;
    grid-row: 2;
    margin: 0;
    min-width: 0;
  }

  .features-slide .features-cards-stack .features-card-item .feature-card-title {
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1.3;
    color: #0f172a;
    min-width: 0;
    overflow-wrap: break-word;
  }

  .features-slide .features-cards-stack .features-card-item .feature-card-desc {
    font-size: 0.8125rem;
    line-height: 1.52;
    color: #64748b;
  }

  .features-slide .features-cards-stack .features-card-item .feature-icon .fa-solid {
    font-size: 1.15rem;
  }

  @media (prefers-reduced-motion: reduce) {
    .features-slide .features-cards-stack .features-card-item.is-active {
      animation: none;
    }
  }

  .services-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .services-slider {
    flex-direction: column;
    gap: 16px;
  }

  .services-arrow {
    display: none;
  }

}

@media (max-width: 600px) {
  .features {
    padding-bottom: 3.1rem;
  }

  .features-slide .features-cards-stack .features-card-item:hover {
    box-shadow:
      0 2px 4px rgba(15, 23, 42, 0.06),
      0 10px 22px rgba(15, 23, 42, 0.09);
  }

  .features {
    padding-left: max(1rem, env(safe-area-inset-left, 0px));
    padding-right: max(1rem, env(safe-area-inset-right, 0px));
  }

  .features-header {
    margin-bottom: 1.85rem;
    padding-inline: 0.15rem;
  }

  .features-slides {
    overflow: visible;
    -webkit-overflow-scrolling: touch;
  }

  .features-slider {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .features-title {
    font-size: 1.5rem;
  }

  .features-dots {
    margin-top: 1rem;
  }

  .services-grid {
    grid-template-columns: 1fr;
  }

  .services-title {
    font-size: 1.5rem;
  }

  .services-subtitle {
    margin-bottom: 32px;
  }

  .review-card {
    width: 280px;
    min-width: 280px;
    max-width: 280px;
  }

  .reviews-3d-wrap .review-card {
    width: 100%;
    min-width: 0;
    max-width: none;
  }

  .reviews-title {
    font-size: 1.75rem;
  }

  .sms-section {
    padding: 3rem 1rem 4rem;
  }

  .sms-mockup-wrapper {
    width: 280px;
  }

  .sms-phone-screen {
    height: 560px;
  }

  .sms-bubble-text {
    font-size: 12px;
    line-height: 1.4;
  }

  .setup-mockup-wrap {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
  }

  .setup-mockup-url {
    min-width: 0;
    max-width: calc(100% - 72px);
    font-size: 10px;
    padding: 0 8px;
  }

  .setup-mockup-bar--safari .setup-mockup-url.safari-omnibox {
    max-width: none;
  }

  .banks-inner {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .cta-buttons .cta-btn {
    width: 100%;
    max-width: 100%;
    justify-content: center;
    box-sizing: border-box;
  }
}

.alacak-section {
  position: relative;
  background: var(--site-flow-solid-bg);
  padding: 1.75rem 1rem 2.1rem;
  width: 100%;
  box-sizing: border-box;
}

#alacak-yonetimi.alacak-section {
  margin-top: -2px !important;
  padding-top: calc(1.75rem + 2px) !important;
}

.alacak-section-top-line {
  display: none;
}

.alacak-container {
  max-width: 72rem;
  margin: 0 auto;
  padding: 0 1rem;
  width: 100%;
  position: relative;
  z-index: 10;
}

.alacak-header {
  text-align: center;
  margin-bottom: 5rem;
}

.alacak-title {
  font-size: 1.875rem;
  font-weight: 700;
  margin: 0 0 1rem;
  line-height: 1.25;
  font-family: var(--font-sans);
}

.alacak-title-center {
  color: #111827;
}

.alacak-desc {
  font-family: var(--font-sans);
  font-size: 1.125rem;
  line-height: 1.625;
  margin: 0;
}

.alacak-desc-center {
  color: #4b5563;
  max-width: 48rem;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.7;
}

@media (min-width: 640px) {
  .alacak-title.alacak-title-center {
    font-size: 2.25rem;
  }
}

@media (min-width: 1024px) {
  .alacak-title.alacak-title-center {
    font-size: 2.5rem;
  }
}

.alacak-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: center;
  width: 100%;
}

.alacak-grid-cols {
  gap: 4rem;
}

@media (min-width: 1024px) {
  .alacak-grid-cols {
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
  }
}

.alacak-mockup-wrap {
  position: relative;
  width: 100%;
  min-height: 500px;
  background: #f8fafc;
  border-radius: 2.5rem;
  border: 1px solid #f1f5f9;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.04);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  box-sizing: border-box;
}

@media (min-width: 1024px) {
  .alacak-mockup-wrap {
    min-height: 640px;
  }
}

.alacak-mockup-scaled {
  width: 520px;
  max-width: 100%;
  transform-origin: center;
  
  transform: scale(0.8, 0.72);
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  transition: transform 0.3s ease;
}

@media (min-width: 640px) {
  .alacak-mockup-scaled {
    transform: scale(0.9, 0.85);
  }
}

@media (min-width: 1024px) {
  .alacak-mockup-scaled {
    transform: scale(0.98, 0.94);
  }
}

@media (min-width: 1280px) {
  .alacak-mockup-scaled {
    transform: scale(1, 0.98);
  }
}

.alacak-mockup-card {
  width: 100%;
  background: var(--color-white);
  border-radius: 12px;
  box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.15);
  border: 1px solid #e5e7eb;
  overflow: hidden;
  font-family: var(--font-sans);
}

@keyframes alacak-content-in {
  from {
    opacity: 0;
    transform: translateX(-16px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.alacak-tabs {
  display: flex;
  flex-direction: column;
  gap: 1.125rem;
}

.alacak-tab {
  position: relative;
  padding: 1.5rem 1.5rem;
  border-radius: 1.5rem;
  cursor: pointer;
  transition: border-color 0.3s, background 0.3s, box-shadow 0.3s;
  border: 1px solid transparent;
}

.alacak-tab:hover {
  background: rgba(248, 250, 252, 0.8);
}

.alacak-tab.active {
  border-color: #f1f5f9;
  background: var(--color-white);
  box-shadow: 0 8px 24px -4px rgba(0, 0, 0, 0.07);
}

.alacak-tab-inner {
  display: flex;
  align-items: flex-start;
  gap: 1.125rem;
}

.alacak-tab-icon-wrap {
  flex-shrink: 0;
  width: 3rem;
  height: 3rem;
  border-radius: 0.875rem;
  background: #f1f5f9;
  color: #9ca3af;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s, color 0.3s, box-shadow 0.3s;
}

.alacak-tab.active .alacak-tab-icon-wrap,
.alacak-tab-icon-wrap.active {
  background: #14b8a6;
  color: var(--color-white);
  box-shadow: 0 3px 12px rgba(20, 184, 166, 0.32);
}

.alacak-tab-icon {
  width: 1.25rem;
  height: 1.25rem;
}

.alacak-tab-content {
  flex: 1;
  min-width: 0;
}

.alacak-tab-title {
  font-size: 1rem;
  font-weight: 600;
  color: #6b7280;
  margin: 0 0 0.2rem;
  font-family: var(--font-sans);
  letter-spacing: -0.01em;
  transition: color 0.3s;
}

.alacak-tab.active .alacak-tab-title {
  font-weight: 700;
  color: #111827;
}

.alacak-tab-underline {
  height: 2px;
  margin-top: 0.2rem;
  margin-bottom: 0.6rem;
  width: 0;
  background: #14b8a6;
  transition: width 0.4s ease;
}

.alacak-tab.active .alacak-tab-underline {
  width: 100%;
}

.alacak-tab-desc {
  font-size: 0.875rem;
  line-height: 1.55;
  color: #6b7280;
  margin: 0;
  transition: opacity 0.3s;
}

.alacak-tab.active .alacak-tab-desc {
  color: #4b5563;
}

.alacak-tab-indicator {
  display: none;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 5px;
  height: 2.5rem;
  background: #14b8a6;
  border-radius: 0 3px 3px 0;
}

.alacak-tab.active .alacak-tab-indicator {
  display: block;
}

.alacak-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1.25rem;
}

.alacak-card-header-dark {
  background: #475569;
}

.alacak-card-title {
  font-size: 1rem;
  font-weight: 600;
  color: #64748b;
  margin: 0;
}

.alacak-card-title-white {
  color: var(--color-white);
}

.alacak-card-back {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: #f1f5f9;
  border: none;
  padding: 0.4rem 0.75rem;
  border-radius: 6px;
  font-size: 0.75rem;
  color: #374151;
  cursor: pointer;
}

.alacak-card-back-white {
  background: var(--color-white);
  font-weight: 500;
}

.alacak-card-back-arrow {
  width: 16px;
  height: 16px;
}

.alacak-card-summary {
  padding: 0.75rem 1.25rem;
}

.alacak-card-summary-gray {
  background: #e5e7eb;
  border-bottom: 1px solid #d1d5db;
}

.alacak-card-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #f1f5f9;
  border-radius: var(--radius);
  padding: 0.75rem 1rem;
  margin-bottom: 1rem;
}

.alacak-card-summary-left {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.alacak-card-summary-icon {
  width: 20px;
  height: 20px;
  min-width: 20px;
  background: #22c55e;
  color: var(--color-white);
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.alacak-card-summary-label {
  font-weight: 600;
  font-size: 0.875rem;
  color: var(--color-text);
  display: block;
}

.alacak-card-summary-text {
  font-size: 0.75rem;
  color: var(--color-text-muted);
  margin: 0.25rem 0 0;
}

.alacak-card-dropdown {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: var(--color-white);
  border: 1px solid #d1d5db;
  padding: 0.35rem 0.6rem;
  border-radius: 4px;
  font-size: 0.75rem;
  color: #374151;
  cursor: pointer;
}

.alacak-dropdown-chevron {
  width: 12px;
  height: 12px;
}

.alacak-card-debtor {
  background: var(--color-white);
  border-bottom: 1px solid #e5e7eb;
  padding: 1rem 1.25rem;
}

.alacak-card-debtor-main {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: flex-start;
  margin-bottom: 0.75rem;
}

.alacak-card-daire {
  display: flex;
  flex-direction: column;
}

.alacak-card-daire-label {
  font-size: 10px;
  color: #9ca3af;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.15rem;
}

.alacak-card-daire-num {
  font-size: 1.75rem;
  font-weight: 700;
  color: #94a3b8;
}

.alacak-card-parties {
  flex: 1;
  min-width: 180px;
}

.alacak-card-party {
  display: block;
  margin-bottom: 0.5rem;
}

.alacak-card-party strong {
  display: block;
  font-size: 0.875rem;
  color: var(--color-text);
  margin-bottom: 0.2rem;
}

.alacak-card-contact {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.75rem;
  color: var(--color-text-muted);
  margin-top: 0.15rem;
}

.alacak-icon {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

.alacak-card-amount-wrap {
  text-align: right;
}

.alacak-card-amount {
  display: block;
  font-size: 1.25rem;
  font-weight: 700;
  color: #dc2626;
}

.alacak-card-amount-label {
  font-size: 0.75rem;
  color: var(--color-text-muted);
}

.alacak-card-amount-date {
  font-size: 0.6875rem;
  color: var(--color-text-muted);
  display: block;
  margin-top: 0.2rem;
}

.alacak-card-stats {
  display: flex;
  gap: 0.4rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
}

.alacak-stat {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
  min-height: 24px;
  font-size: 0.6875rem;
  padding: 0.25rem 0.5rem;
  border-radius: 5px;
  font-weight: 500;
  box-sizing: border-box;
}

.alacak-stat-icon {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
}

.alacak-stat-green { background: #dcfce7; color: #166534; border: 1px solid #bbf7d0; }
.alacak-stat-blue { background: #dbeafe; color: #1e40af; border: 1px solid #93c5fd; }
.alacak-stat-red { background: #ffedd5; color: #c2410c; border: 1px solid #fdba74; }
.alacak-stat-grey { background: #f1f5f9; color: #475569; border: 1px solid #e2e8f0; }

.alacak-card-buttons-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  padding-top: 0.75rem;
  margin-bottom: 1rem;
  border-top: 1px solid #f3f4f6;
}

.alacak-card-buttons-row .alacak-card-stats {
  margin-bottom: 0;
}

.alacak-card-buttons-row .alacak-card-actions {
  margin-bottom: 0;
}

.alacak-card-actions {
  display: flex;
  flex-wrap: nowrap;
  gap: 0.5rem;
  margin-bottom: 0;
}

.alacak-action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
  border: none;
  min-height: 24px;
  padding: 0.25rem 0.5rem;
  border-radius: 5px;
  font-size: 0.6875rem;
  font-weight: 500;
  cursor: pointer;
  box-sizing: border-box;
}

.alacak-action-icon {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
}

.alacak-action-green { background: #22c55e; color: var(--color-white); }
.alacak-action-blue { background: #3b82f6; color: var(--color-white); }
.alacak-action-orange { background: #f97316; color: var(--color-white); }
.alacak-action-yellow { background: #eab308; color: var(--color-white); }
.alacak-action-grey { background: #f1f5f9; color: #374151; }

.alacak-mockup-card[data-active-tab="iletisim"] .alacak-action-btn[data-mockup-tab="iletisim"] {
  box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.5);
}
.alacak-mockup-card[data-active-tab="takip"] .alacak-action-btn[data-mockup-tab="takip"] {
  box-shadow: 0 0 0 2px rgba(249, 115, 22, 0.5);
}
.alacak-mockup-card[data-active-tab="ihtar"] .alacak-action-btn[data-mockup-tab="ihtar"] {
  box-shadow: 0 0 0 2px rgba(234, 179, 8, 0.5);
}
.alacak-mockup-card[data-active-tab="icra"] .alacak-action-btn[data-mockup-tab="icra"] {
  box-shadow: 0 0 0 2px rgba(107, 114, 128, 0.5);
}

.alacak-card-timeline {
  position: relative;
  padding: 1rem 1.25rem;
  background: var(--color-white);
}

.alacak-card-timeline-gray .alacak-timeline-line-gray {
  position: absolute;
  left: 1rem;
  top: 1rem;
  bottom: 1rem;
  width: 2px;
  background: #d1d5db;
}

.alacak-card-timeline-gray .alacak-timeline-item {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid #f3f4f6;
  min-height: auto;
  margin-bottom: 0;
}

.alacak-card-timeline-gray .alacak-timeline-item:last-child {
  border-bottom: none;
}

.alacak-timeline-dot {
  width: 8px;
  height: 8px;
  min-width: 8px;
  background: #3b82f6;
  border-radius: 50%;
  box-shadow: 0 0 0 2px var(--color-white);
  position: absolute;
  left: calc(-0.25rem + 1px);
  top: 0.6rem;
  transform: translateX(-50%);
  z-index: 1;
  flex-shrink: 0;
}

.alacak-card-timeline-gray .alacak-timeline-time {
  margin-left: 0.5rem;
}

.alacak-timeline-time {
  font-size: 10px;
  font-family: ui-monospace, monospace;
  color: #4b5563;
  line-height: 1.3;
  min-width: 3rem;
  flex-shrink: 0;
}

.alacak-timeline-time-block {
  padding-top: 0.1rem;
}

.alacak-timeline-content {
  font-size: 0.75rem;
  color: #374151;
  padding-top: 0.1rem;
}

.alacak-timeline-type {
  font-weight: 600;
  margin-right: 0.25rem;
}

.alacak-timeline-type {
  font-weight: 600;
  color: var(--color-text);
  margin-right: 0.25rem;
}

@media (max-width: 1024px) {
  .alacak-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .alacak-card-wrap {
    justify-content: center;
  }

}

@media (max-width: 640px) {
  .alacak-section {
    padding: 1.85rem 1rem 2.2rem;
  }

  .alacak-mockup-card .alacak-card-debtor,
  .alacak-mockup-card .alacak-card-timeline {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .alacak-card-debtor-main {
    flex-direction: column;
  }

  .alacak-card-amount-wrap {
    text-align: left;
  }
}

.cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--color-white);
  box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.08);
  z-index: 1000;
  padding: 1rem 1.25rem;
  font-family: var(--font-sans);
  display: none;
}

.cookie-banner.is-visible {
  display: block;
}

.cookie-banner-inner {
  max-width: 1120px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.cookie-banner-text {
  flex: 1 1  min(100%, 560px);
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--color-text);
}

.cookie-banner-link {
  color: var(--color-primary);
  text-decoration: underline;
}

.cookie-banner-link:hover {
  color: var(--color-primary-hover);
}

.cookie-banner-actions {
  order: -1;
  flex: 0 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.cookie-btn-manage {
  background: var(--color-white);
  color: #2563eb;
  border: 1px solid #93c5fd;
  text-decoration: none;
}

.cookie-btn-manage:hover {
  background: #eff6ff;
  color: var(--color-primary-hover);
}

.cookie-btn {
  font-family: var(--font-sans);
  font-size: 0.875rem;
  font-weight: 500;
  padding: 0.5rem 1rem;
  border-radius: var(--radius);
  cursor: pointer;
  border: 1px solid #93c5fd;
  background: var(--color-white);
  color: #2563eb;
  white-space: nowrap;
  transition: background 0.2s, color 0.2s;
}

.cookie-btn-accept {
  background: #2563eb;
  color: var(--color-white);
  border-color: #2563eb;
}

.cookie-btn-accept:hover {
  background: var(--color-primary-hover);
  border-color: var(--color-primary-hover);
  color: var(--color-white);
}

@media (max-width: 640px) {
  .cookie-banner-inner {
    flex-direction: column;
    align-items: stretch;
  }

  .cookie-banner-actions {
    order: 0;
    justify-content: flex-start;
  }
}

.cookie-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 1001;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s, visibility 0.2s;
}

.cookie-modal-overlay.is-open {
  opacity: 1;
  visibility: visible;
}

.cookie-modal {
  background: var(--color-white);
  border-radius: var(--radius-lg);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
  max-width: 420px;
  width: 100%;
  padding: 1.5rem;
}

.cookie-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 1.25rem;
}

.cookie-modal-title {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--color-text);
  margin: 0;
  text-align: left;
}

.cookie-modal-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: none;
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
  border-radius: var(--radius);
  transition: color 0.2s, background 0.2s;
}

.cookie-modal-close:hover {
  color: var(--color-text);
  background: #f1f5f9;
}

.cookie-modal-intro {
  margin: 0 0 1rem;
  font-size: 0.75rem;
  line-height: 1.5;
  color: var(--color-text);
}

.cookie-modal-intro .cookie-banner-link {
  color: var(--color-primary);
  text-decoration: underline;
}

.cookie-modal-quick-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  margin-bottom: 1.25rem;
}

.cookie-btn-outline {
  background: var(--color-white);
  color: var(--color-text);
  border: 1px solid var(--color-border);
}

.cookie-btn-outline:hover {
  background: #f8fafc;
  border-color: #cbd5e1;
}

.cookie-modal-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.cookie-modal-row {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1rem;
  background: #f8fafc;
  border-radius: var(--radius);
  border: 1px solid #86efac;
}

.cookie-modal-row-top {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.cookie-modal-row-required .cookie-toggle-slider {
  background: #94a3b8;
}

.cookie-modal-row-required .cookie-toggle-input:checked + .cookie-toggle-slider {
  background: #94a3b8;
}

.cookie-modal-row-top .cookie-modal-label {
  flex: 1;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-text);
}

.cookie-toggle {
  position: relative;
  display: inline-block;
  width: 44px;
  height: 24px;
  flex-shrink: 0;
  cursor: pointer;
}

.cookie-toggle-input {
  opacity: 0;
  width: 0;
  height: 0;
}

.cookie-modal-row-required .cookie-toggle {
  cursor: default;
}

.cookie-toggle-slider {
  position: absolute;
  inset: 0;
  background: #cbd5e1;
  border-radius: 24px;
  transition: background 0.2s;
}

.cookie-toggle-slider::before {
  content: '';
  position: absolute;
  height: 18px;
  width: 18px;
  left: 3px;
  bottom: 3px;
  background: var(--color-white);
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  transition: transform 0.2s;
}

.cookie-toggle-input:checked + .cookie-toggle-slider {
  background: var(--color-green);
}

.cookie-toggle-input:checked + .cookie-toggle-slider::before {
  transform: translateX(20px);
}

.cookie-toggle-input:focus-visible + .cookie-toggle-slider {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

.cookie-modal-details {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: none;
  background: transparent;
  color: var(--color-text-muted);
  cursor: pointer;
  border-radius: var(--radius);
  transition: color 0.2s, transform 0.2s;
}

.cookie-modal-details:hover {
  color: var(--color-text);
}

.cookie-modal-details[aria-expanded="true"] svg {
  transform: rotate(180deg);
}

.cookie-modal-detail-text {
  width: 100%;
  margin: 0;
  font-size: 0.8125rem;
  color: var(--color-text-muted);
  line-height: 1.45;
}

.cookie-modal-detail-text[hidden] {
  display: none;
}

.cookie-modal-actions {
  margin-top: 1.25rem;
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
}

.cookie-modal-actions .cookie-btn-accept {
  padding: 0.5rem 1.25rem;
}

.cookie-btn-secondary-modal {
  background: var(--color-white);
  color: #2563eb;
  border: 1px solid #93c5fd;
}

.cookie-btn-secondary-modal:hover {
  background: #eff6ff;
  color: var(--color-primary-hover);
}

.app-section {
  padding: 2.85rem 1.25rem 3.35rem;
  background: #f8fafc;
  box-sizing: border-box;
}

.app-inner {
  max-width: 80rem;
  margin: 0 auto;
  width: 100%;
}

.app-frame {
  position: relative;
  border-radius: 1.5rem;
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, 0.06);
  padding: 2.5rem 1rem 2.5rem;
  background: var(--color-white);
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.1);
  min-height: 420px;
}

@media (min-width: 768px) {
  .app-frame {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

@media (min-width: 1024px) {
  .app-frame {
    padding: 2.75rem 2rem 2.75rem;
    min-height: 480px;
  }
}

.app-grid {
  display: grid;
  gap: 2rem;
  align-items: center;
}

@media (min-width: 1024px) {
  .app-grid {
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
  }
  .app-content { order: 1; }
  .app-phones { order: 2; }
}

.app-content-inner {
  margin-bottom: 2rem;
}

.app-title {
  font-family: var(--font-sans);
  font-size: 1.875rem;
  font-weight: 700;
  color: var(--color-text);
  margin: 0 0 1rem 0;
  line-height: 1.25;
}

@media (min-width: 768px) {
  .app-title { font-size: 2.25rem; }
}

@media (min-width: 1024px) {
  .app-title { font-size: 3rem; }
}

.app-desc {
  font-family: var(--font-sans);
  font-size: 1.125rem;
  line-height: 1.625;
  color: var(--color-text-muted);
  margin: 0;
}

.app-download-row {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.app-brand-logo {
  width: 92px;
  height: 92px;
  object-fit: contain;
  flex-shrink: 0;
}

@media (min-width: 640px) {
  .app-brand-logo {
    width: 100px;
    height: 100px;
  }
}

.app-store-buttons {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  flex-wrap: nowrap;
  align-items: flex-start;
}

.app-store-btn {
  display: block;
  width: 140px;
  height: 44px;
  padding: 0;
  border-radius: 0.75rem;
  box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
  transition: transform 0.2s, box-shadow 0.2s;
  overflow: hidden;
  flex-shrink: 0;
}

.app-store-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.15), 0 10px 10px -5px rgba(0,0,0,0.08);
}

.app-store-icon {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
}

@media (min-width: 640px) {
  .app-store-btn {
    width: 155px;
    height: 48px;
  }
}

.app-phones {
  position: relative;
  height: 520px;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (min-width: 1024px) {
  .app-phones { height: 600px; }
}

.app-phone {
  position: absolute;
  width: 240px;
  z-index: 0;
}

@media (min-width: 1024px) {
  .app-phone { width: 280px; }
}

.app-phone-left {
  left: 0;
  top: 2rem;
  transform: rotate(-8deg);
}

@media (min-width: 1024px) {
  .app-phone-left { left: 2rem; }
}

.app-phone-right {
  right: 0;
  bottom: 2rem;
  transform: rotate(8deg);
  z-index: 10;
}

@media (min-width: 1024px) {
  .app-phone-right { right: 2rem; }
}

.app-phone-shadow {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.2);
  filter: blur(40px);
  transform: translateY(2rem);
  border-radius: 3.5rem;
}

.app-phone-right .app-phone-shadow {
  background: rgba(0,0,0,0.3);
}

.app-phone-body {
  position: relative;
  background: linear-gradient(180deg, #1f2937 0%, #111827 100%);
  border-radius: 3.5rem;
  padding: 0.75rem;
  box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
}

.app-phone-shine {
  position: absolute;
  inset: 0;
  border-radius: 3.5rem;
  background: linear-gradient(135deg, rgba(255,255,255,0.1) 0%, transparent 50%, rgba(0,0,0,0.2) 100%);
  pointer-events: none;
}

.app-phone-btn {
  position: absolute;
  width: 4px;
  background: #374151;
  border-radius: 2px;
}

.app-phone-btn-l1 {
  left: -4px;
  top: 5.5rem;
  height: 2rem;
}

.app-phone-btn-l2 {
  left: -4px;
  top: 8.5rem;
  height: 3rem;
}

.app-phone-btn-r {
  right: -4px;
  top: 7.5rem;
  height: 4rem;
}

.app-phone-screen {
  background: #000;
  border-radius: 3rem;
  overflow: hidden;
  position: relative;
}

.app-screen-shine {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.05) 0%, transparent 50%, transparent 100%);
  pointer-events: none;
  z-index: 20;
}

.app-phone-notch {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 8rem;
  height: 2rem;
  background: #000;
  border-radius: 0 0 1.5rem 1.5rem;
  z-index: 30;
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.2);
  display: flex;
  align-items: center;
  justify-content: center;
}

.app-notch-speaker {
  position: absolute;
  width: 3rem;
  height: 4px;
  background: #1f2937;
  border-radius: 9999px;
}

.app-notch-camera {
  position: absolute;
  top: 6px;
  right: 2rem;
  width: 8px;
  height: 8px;
  background: #111827;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px #374151;
}

.app-screen-content {
  height: 100%;
  padding: 1.25rem;
  padding-top: 3rem;
  overflow: hidden;
}

.app-screen-dashboard {
  background: linear-gradient(135deg, #eff6ff 0%, #eef2ff 100%);
}

.app-status-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.75rem;
  color: #374151;
  margin-bottom: 1rem;
  padding: 0 0.25rem;
}

.app-status-bar-light {
  color: rgba(255,255,255,0.9);
}

.app-time {
  font-weight: 600;
}

.app-signal {
  width: 1rem;
  height: 0.75rem;
  border: 1px solid #374151;
  border-radius: 2px;
  position: relative;
}

.app-signal::after {
  content: '';
  position: absolute;
  inset: 2px;
  background: #374151;
  border-radius: 1px;
}

.app-signal-light {
  border-color: rgba(255,255,255,0.8);
}

.app-signal-light::after {
  background: #fff;
}

.app-screen-header {
  margin-bottom: 1.25rem;
}

.app-screen-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: #111827;
  margin-bottom: 0.25rem;
}

.app-screen-subtitle {
  font-size: 0.75rem;
  color: #6b7280;
}

.app-stats-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.625rem;
  margin-bottom: 1.25rem;
}

.app-stat-card {
  background: #fff;
  border-radius: 0.75rem;
  padding: 0.75rem;
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.07);
}

.app-stat-icon {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 0.5rem;
  margin-bottom: 0.5rem;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}

.app-stat-icon-blue {
  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
}

.app-stat-icon-green {
  background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
}

.app-stat-num {
  font-size: 1.125rem;
  font-weight: 700;
  color: #111827;
}

.app-stat-label {
  font-size: 10px;
  color: #6b7280;
}

.app-list-items {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.app-list-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  background: #fff;
  border-radius: 0.75rem;
  padding: 0.75rem;
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.07);
}

.app-list-icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}

.app-list-icon-1 {
  background: linear-gradient(135deg, #c084fc 0%, #ec4899 100%);
}

.app-list-icon-2 {
  background: linear-gradient(135deg, #fb923c 0%, #ef4444 100%);
}

.app-list-icon-3 {
  background: linear-gradient(135deg, #22d3ee 0%, #3b82f6 100%);
}

.app-list-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.app-list-title {
  font-size: 0.75rem;
  font-weight: 600;
  color: #111827;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.app-list-desc {
  font-size: 10px;
  color: #6b7280;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.app-screen-aidat {
  background: linear-gradient(135deg, #10b981 0%, #14b8a6 50%, #06b6d4 100%);
}

.app-aidat-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.5rem;
}

.app-aidat-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: #fff;
  margin: 0 0 0.25rem 0;
}

.app-aidat-month {
  font-size: 0.75rem;
  color: rgba(255,255,255,0.8);
  margin: 0;
}

.app-aidat-avatar {
  width: 2.25rem;
  height: 2.25rem;
  background: rgba(255,255,255,0.2);
  backdrop-filter: blur(4px);
  border-radius: 50%;
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1);
}

.app-aidat-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-bottom: 4rem;
}

.app-aidat-card {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(12px);
  border-radius: 0.75rem;
  padding: 0.75rem;
  box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1);
}

.app-aidat-daire-num {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.875rem;
  color: #fff;
  flex-shrink: 0;
}

.app-aidat-ok .app-aidat-daire-num {
  background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
}

.app-aidat-wait .app-aidat-daire-num {
  background: linear-gradient(135deg, #f97316 0%, #ea580c 100%);
}

.app-aidat-late .app-aidat-daire-num {
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
}

.app-aidat-info {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
}

.app-aidat-daire {
  font-weight: 600;
  font-size: 0.875rem;
  color: #111827;
}

.app-aidat-tutar {
  font-size: 0.75rem;
  color: #4b5563;
}

.app-aidat-badge {
  padding: 0.25rem 0.5rem;
  border-radius: 0.5rem;
  font-size: 0.75rem;
  font-weight: 600;
  flex-shrink: 0;
}

.app-aidat-badge-ok {
  background: #dcfce7;
  color: #15803d;
}

.app-aidat-badge-wait {
  background: #ffedd5;
  color: #c2410c;
}

.app-aidat-badge-late {
  background: #fee2e2;
  color: #b91c1c;
}

.app-aidat-footer {
  position: absolute;
  bottom: 1.5rem;
  left: 1.25rem;
  right: 1.25rem;
}

.app-aidat-cta {
  width: 100%;
  background: #fff;
  color: #0d9488;
  font-weight: 600;
  font-family: var(--font-sans);
  padding: 0.875rem 1rem;
  border: none;
  border-radius: 0.75rem;
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1);
  cursor: pointer;
  transition: box-shadow 0.2s;
}

.app-aidat-cta:hover {
  box-shadow: 0 25px 50px -12px rgba(0,0,0,0.15);
}

.faq-section {
  padding: clamp(2.35rem, 6vw, 4rem) max(1.25rem, env(safe-area-inset-left, 0px)) clamp(2.5rem, 6.5vw, 4.25rem) max(1.25rem, env(safe-area-inset-right, 0px));
  box-sizing: border-box;
  
  background: var(--home-band-muted-bg, #f3f4f6);
  border: none;
}

.faq-inner {
  max-width: var(--content-max-width);
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
}

.faq-title-wrap {
  position: relative;
  text-align: center;
  margin-bottom: clamp(1.75rem, 4vw, 2.5rem);
}

.faq-title-watermark {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  font-family: var(--font-sans);
  font-size: 8rem;
  font-weight: 800;
  color: #d1d5db;
  opacity: 0.35;
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
}

@media (min-width: 768px) {
  .faq-title-watermark { font-size: 10rem; }
}

.faq-title {
  position: relative;
  z-index: 1;
  font-family: var(--font-sans);
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--color-text);
  letter-spacing: -0.02em;
  line-height: 1.25;
  margin: 0;
  text-align: center;
}

@media (min-width: 768px) {
  .faq-title { font-size: 2rem; }
}

.faq-panels {
  position: relative;
  border-radius: 1.5rem;
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, 0.06);
  padding: 1.5rem 1rem;
  background: #fff;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.08);
}

@media (min-width: 768px) {
  .faq-panels {
    padding: 2rem 1.5rem;
  }
}

.faq-panel {
  display: block;
}

.faq-panel + .faq-panel {
  margin-top: 1.5rem;
}

.faq-accordion {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.faq-item {
  border: 1px solid #e2e8f0;
  border-radius: 9999px;
  overflow: hidden;
  background: #fff;
  transition: background 0.2s, border-color 0.2s, box-shadow 0.2s;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  transform: translateZ(0);
}

.faq-item:hover {
  background: #f8fafc;
  border-color: #cbd5e1;
}

.faq-item.open {
  border-radius: 1.25rem;
  background: #fff;
  border-color: #e2e8f0;
}

.faq-question {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  font-family: var(--font-sans);
  font-size: 0.9375rem;
  font-weight: 500;
  color: #111827;
  text-align: left;
  background: none;
  border: none;
  padding: 1rem 1.25rem;
  cursor: pointer;
  transition: background 0.2s;
}

.faq-question:hover {
  background: transparent;
}

.faq-icon {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  position: relative;
  background: transparent;
  border-radius: 0;
  transition: transform 0.2s;
}

.faq-icon::before,
.faq-icon::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 12px;
  height: 2px;
  background: #9ca3af;
  transform: translate(-50%, -50%);
  transition: transform 0.2s;
}

.faq-icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

.faq-item.open .faq-icon::after {
  transform: translate(-50%, -50%) rotate(0deg);
}

.faq-item.open .faq-icon::before,
.faq-item.open .faq-icon::after {
  background: #6b7280;
}

.faq-answer {
  border-top: 1px solid #f1f5f9;
  background: #fff;
  border-radius: 0;
}

.faq-answer p {
  margin: 0;
  padding: 1rem 1.25rem 1.25rem;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #4b5563;
}

.cta-section {
  padding: 1.5rem 1rem 3rem;
  background: var(--site-flow-solid-bg);
  border: none;
}

@media (min-width: 640px) {
  .cta-section { padding-left: 1.5rem; padding-right: 1.5rem; }
}

@media (min-width: 1024px) {
  .cta-section { padding: 1.5rem 2rem 3rem; }
}

.cta-wrap {
  max-width: 1280px;
  margin: 0 auto;
}

.cta-card {
  position: relative;
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
}

.cta-bg {
  position: absolute;
  inset: 0;
}

.cta-bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cta-bg-overlay {
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.85);
}

.cta-content {
  position: relative;
  display: grid;
  gap: 2rem;
  padding: 2rem 1rem;
}

@media (min-width: 640px) {
  .cta-content { padding: 3rem 1.5rem; }
}

@media (min-width: 1024px) {
  .cta-content {
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    padding: 4rem;
    align-items: center;
  }

}

.cta-left {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.cta-heading-wrap {
  margin-bottom: 0;
}

.cta-heading-sub {
  font-size: 1.5rem;
  color: #111827;
  margin: 0 0 0.5rem 0;
  font-family: var(--font-sans);
}

@media (min-width: 640px) {
  .cta-heading-sub { font-size: 1.875rem; }
}

.cta-heading {
  font-size: 1.5rem;
  font-weight: 700;
  color: #111827;
  margin: 0;
  font-family: var(--font-sans);
}

@media (min-width: 640px) {
  .cta-heading { font-size: 1.875rem; }
}

.cta-buttons {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

@media (min-width: 640px) {
  .cta-buttons { flex-direction: row; flex-wrap: wrap; }
}

.cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 2rem;
  border-radius: 0.5rem;
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: 1rem;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
  cursor: pointer;
  border: none;
  text-decoration: none;
}

.cta-btn-primary {
  background: #2563eb;
  color: #fff;
}

.cta-btn-primary:hover {
  background: #1d4ed8;
}

.cta-btn-outline {
  background: #fff;
  color: #111827;
  border: 1px solid #d1d5db;
}

.cta-btn-outline:hover {
  background: #f9fafb;
}

.cta-btn-icon {
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
  color: #ef4444;
  font-size: 1.25rem;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.cta-right {
  display: flex;
  align-items: center;
}

.cta-text {
  font-size: 1rem;
  color: #374151;
  line-height: 1.625;
  margin: 0;
  font-family: var(--font-sans);
}

@media (min-width: 640px) {
  .cta-text { font-size: 1.125rem; }
}

.blog-main {
  min-height: 100vh;
  background: #f8fafc;
}

.blog-hero {
  background: linear-gradient(135deg, #1e3a5f 0%, #2563eb 100%);
  color: #fff;
  padding: 3rem 1.5rem 3.5rem;
}

.blog-hero-inner {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}

.blog-hero-title {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
  letter-spacing: -0.02em;
}

.blog-hero-subtitle {
  font-size: 1.25rem;
  font-weight: 600;
  opacity: 0.95;
  margin-bottom: 0.5rem;
}

.blog-hero-desc {
  font-size: 1rem;
  opacity: 0.9;
  margin-bottom: 1.5rem;
  line-height: 1.6;
}

.blog-search-wrap {
  display: flex;
  max-width: 400px;
  margin: 0 auto;
  background: rgba(255,255,255,0.15);
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.2);
}

.blog-search {
  flex: 1;
  padding: 0.75rem 1rem;
  border: none;
  background: transparent;
  color: #fff;
  font-size: 0.9375rem;
}

.blog-search::placeholder {
  color: rgba(255,255,255,0.7);
}

.blog-search-btn {
  padding: 0.75rem 1rem;
  border: none;
  background: transparent;
  color: #fff;
  cursor: pointer;
}

.blog-content {
  padding: 2rem 1rem 4rem;
}

.blog-content-inner {
  max-width: 1200px;
  margin: 0 auto;
}

.blog-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}

@media (min-width: 1024px) {
  .blog-layout {
    grid-template-columns: 1fr 320px;
    gap: 3rem;
  }
}

.blog-section-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-text);
  margin-bottom: 1.25rem;
}

.blog-grid {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.blog-card {
  background: #fff;
  border-radius: var(--radius-lg);
  padding: 1.5rem;
  box-shadow: var(--shadow-card);
  border: 1px solid var(--color-border);
  transition: box-shadow 0.2s;
}

.blog-card:hover {
  box-shadow: 0 6px 20px rgba(0,0,0,0.1);
}

.blog-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  margin-bottom: 0.75rem;
}

.blog-card-cat {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-primary);
}

.blog-card-date {
  font-size: 0.8125rem;
  color: var(--color-text-muted);
}

.blog-card-title {
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--color-text);
  line-height: 1.4;
  margin-bottom: 0.5rem;
}

.blog-card-excerpt {
  font-size: 0.9375rem;
  color: var(--color-text-muted);
  line-height: 1.6;
  margin-bottom: 0.75rem;
}

.blog-card-link {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-primary);
}

.blog-card-link:hover {
  text-decoration: underline;
}

.blog-sidebar {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.blog-sidebar-block {
  background: #fff;
  border-radius: var(--radius-lg);
  padding: 1.25rem;
  box-shadow: var(--shadow-card);
  border: 1px solid var(--color-border);
}

.blog-sidebar-title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--color-text);
  margin-bottom: 0.75rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid var(--color-primary);
}

.blog-sidebar-list {
  list-style: none;
}

.blog-sidebar-list li {
  margin-bottom: 0.5rem;
}

.blog-sidebar-list a {
  font-size: 0.9375rem;
  color: var(--color-text);
  line-height: 1.5;
}

.blog-sidebar-list a:hover {
  color: var(--color-primary);
  text-decoration: underline;
}

.blog-sidebar-more {
  display: inline-block;
  margin-top: 0.75rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-primary);
}

.blog-sidebar-more:hover {
  text-decoration: underline;
}

.nav-active {
  color: var(--color-primary) !important;
  font-weight: 600;
}

.blog-hero.akademi-hero {
  position: relative;
  overflow: hidden;
  background: transparent;
}

.akademi-hero-photo {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.akademi-hero-photo-img {
  position: absolute;
  left: -6%;
  top: -6%;
  width: 112%;
  height: 112%;
  background-image: var(--hero-building-photo);
  background-size: cover;
  background-position: center;
  animation: heroBgPhotoMotion 28s ease-in-out infinite alternate;
  will-change: transform;
}

.akademi-hero-photo-scrim {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(
    135deg,
    rgba(15, 23, 42, 0.78) 0%,
    rgba(30, 58, 95, 0.72) 42%,
    rgba(37, 99, 235, 0.58) 100%
  );
}

@media (prefers-reduced-motion: reduce) {
  .akademi-hero-photo-img {
    animation: none;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }
}

.akademi-hero {
  padding-top: 2.5rem;
  padding-bottom: 2rem;
}

.akademi-hero-inner {
  position: relative;
  z-index: 1;
  max-width: 36rem;
}

.akademi-hero .blog-hero-title {
  margin-bottom: 0.65rem;
}

.akademi-hero-tagline {
  margin-bottom: 0 !important;
  font-size: 1rem;
  line-height: 1.55;
  max-width: 28rem;
  margin-left: auto;
  margin-right: auto;
}

.akademi-hero-inline-link {
  color: #fff;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(255, 255, 255, 0.45);
}

.akademi-hero-inline-link:hover {
  text-decoration-color: rgba(255, 255, 255, 0.9);
}

.akademi-hero-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.35rem 0.5rem;
  margin-top: 1.35rem;
}

.akademi-hero-nav a {
  font-size: 0.9375rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.92);
  text-decoration: none;
  padding: 0.2rem 0;
  border-bottom: 1px solid transparent;
  transition: border-color 0.2s, color 0.2s;
}

.akademi-hero-nav a:hover {
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.55);
}

.akademi-hero-sep {
  color: rgba(255, 255, 255, 0.38);
  font-weight: 500;
  user-select: none;
}

.akademi-trust {
  background: #fff;
  border-bottom: 1px solid var(--color-border);
  padding: 1.35rem 1.25rem;
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04);
}

.akademi-trust-inner {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem 1.5rem;
  text-align: center;
  max-width: 900px;
}

@media (min-width: 768px) {
  .akademi-trust-inner {
    grid-template-columns: repeat(4, 1fr);
  }
}

.akademi-trust-item {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.akademi-trust-val {
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--color-primary);
  letter-spacing: -0.03em;
  line-height: 1.1;
}

.akademi-trust-label {
  font-size: 0.8125rem;
  color: var(--color-text-muted);
  line-height: 1.35;
}

.akademi-reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.55s ease, transform 0.55s ease;
}

.akademi-reveal--in {
  opacity: 1;
  transform: translateY(0);
}

.akademi-section {
  padding: 2.75rem 1.25rem 3.25rem;
  scroll-margin-top: 5.5rem;
}

.akademi-section--videos {
  background: #fff;
}

.akademi-section--free {
  background: #f1f5f9;
  padding-bottom: 3.5rem;
}

.akademi-inner {
  max-width: 1120px;
  margin: 0 auto;
}

.akademi-section-head {
  text-align: center;
  max-width: 40rem;
  margin: 0 auto 2rem;
}

.akademi-h2 {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--color-text);
  letter-spacing: -0.02em;
  margin-bottom: 0.5rem;
}

.akademi-lead {
  font-size: 1rem;
  color: var(--color-text-muted);
  line-height: 1.6;
  margin: 0;
}

.akademi-video-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}

@media (min-width: 640px) {
  .akademi-video-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .akademi-video-grid:not(.akademi-video-grid--4) {
    grid-template-columns: repeat(3, 1fr);
  }
}

.akademi-video-grid--4 {
  grid-template-columns: 1fr;
}

@media (min-width: 640px) {
  .akademi-video-grid--4 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1100px) {
  .akademi-video-grid--4 {
    grid-template-columns: repeat(4, 1fr);
  }
}

.akademi-video-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-card);
  transition: box-shadow 0.2s, transform 0.2s;
  color: inherit;
}

.akademi-section--videos .akademi-video-card {
  background: #f8fafc;
}

.akademi-video-card:hover {
  box-shadow: 0 8px 28px rgba(37, 99, 235, 0.12);
  transform: translateY(-2px);
}

.akademi-video-thumb {
  position: relative;
  aspect-ratio: 16 / 9;
  background: linear-gradient(135deg, #1e40af 0%, #3b82f6 55%, #60a5fa 100%);
}

.akademi-video-thumb--alt {
  background: linear-gradient(135deg, #4c1d95 0%, #7c3aed 50%, #a78bfa 100%);
}

.akademi-video-thumb--teal {
  background: linear-gradient(135deg, #0f766e 0%, #14b8a6 50%, #5eead4 100%);
}

.akademi-video-thumb--amber {
  background: linear-gradient(135deg, #b45309 0%, #f59e0b 55%, #fcd34d 100%);
}

.akademi-video-duration {
  position: absolute;
  top: 0.65rem;
  right: 0.65rem;
  z-index: 1;
  font-size: 0.75rem;
  font-weight: 600;
  color: #fff;
  padding: 0.25rem 0.5rem;
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.45);
  backdrop-filter: blur(6px);
}

.akademi-video-play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.95);
  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.25));
}

.akademi-video-body {
  padding: 1.25rem 1.35rem 1.35rem;
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 0.35rem;
}

.akademi-video-title {
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--color-text);
  line-height: 1.35;
  margin: 0;
}

.akademi-video-desc {
  font-size: 0.875rem;
  color: var(--color-text-muted);
  line-height: 1.5;
  margin: 0;
  flex: 1;
}

.akademi-video-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-primary);
  margin-top: 0.5rem;
}

.akademi-ext-ico {
  flex-shrink: 0;
  opacity: 0.75;
  transition: transform 0.2s, opacity 0.2s;
}

.akademi-video-card:hover .akademi-ext-ico {
  opacity: 1;
  transform: translate(2px, -2px);
}

.akademi-video-card:hover .akademi-video-cta span:first-child {
  text-decoration: underline;
}

.akademi-session-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}

@media (min-width: 640px) {
  .akademi-session-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .akademi-session-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.akademi-session-card {
  background: #fff;
  border-radius: var(--radius-lg);
  padding: 1.5rem 1.35rem;
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-card);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.akademi-session-card:hover {
  border-color: rgba(37, 99, 235, 0.25);
  box-shadow: 0 8px 26px rgba(37, 99, 235, 0.08);
}

.akademi-section--free .akademi-session-card--free {
  background: #fff;
}

.akademi-session-hint {
  font-size: 0.8125rem;
  color: var(--color-text-muted);
  line-height: 1.45;
  margin: -0.25rem 0 0;
}

.akademi-session-time {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.875rem;
  color: var(--color-text-muted);
}

.akademi-time-ico {
  flex-shrink: 0;
  opacity: 0.55;
}

.akademi-session-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text);
  margin: 0;
  line-height: 1.3;
}

.akademi-session-meta {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  margin: 0;
}

.akademi-session-day {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-text);
}

.akademi-session-format {
  margin: 0;
}

.akademi-badge {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 0.25rem 0.5rem;
  border-radius: 6px;
}

.akademi-badge-online {
  background: rgba(37, 99, 235, 0.12);
  color: var(--color-primary-text);
}

.akademi-btn-register {
  margin-top: auto;
  align-self: flex-start;
  text-align: center;
}

.akademi-footnote {
  font-size: 0.8125rem;
  color: var(--color-text-muted);
  line-height: 1.55;
  max-width: 48rem;
  margin: 1.75rem auto 0;
  text-align: center;
}

.akademi-section--help {
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  padding-bottom: 3.5rem;
}

.akademi-help-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}

@media (min-width: 768px) {
  .akademi-help-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }
}

.akademi-help-card {
  background: #fff;
  border-radius: var(--radius-lg);
  padding: 1.75rem 1.5rem;
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-card);
}

.akademi-help-card--accent {
  border-color: rgba(37, 99, 235, 0.2);
  box-shadow: 0 8px 30px rgba(37, 99, 235, 0.08);
}

.akademi-help-icon {
  width: 3rem;
  height: 3rem;
  border-radius: 12px;
  background: rgba(37, 99, 235, 0.1);
  color: var(--color-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
}

.akademi-help-card--accent .akademi-help-icon {
  background: rgba(37, 99, 235, 0.14);
}

.akademi-help-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-text);
  margin: 0 0 0.5rem;
  letter-spacing: -0.02em;
}

.akademi-help-desc {
  font-size: 0.9375rem;
  color: var(--color-text-muted);
  line-height: 1.6;
  margin: 0 0 1rem;
}

.akademi-help-link {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-primary);
}

.akademi-help-link:hover {
  text-decoration: underline;
}

.kisiler-mockup .yeni-kisi-modal-overlay {
  position: absolute;
  inset: 0;
  z-index: 50;
  padding: 0.5rem;
  min-width: 0;
}
.kisiler-mockup .yeni-kisi-modal-overlay[aria-hidden="false"] {
  display: flex;
}

.kisiler-mockup .yeni-kisi-modal-box {
  max-height: 100%;
  min-height: 0;
  box-sizing: border-box;
}
.hero-mb-panel1-mock .kisiler-mockup .yeni-kisi-modal-box:not(.atama-modal-box) .yeni-kisi-modal-form {
  min-width: 0;
}
.hero-mb-panel1-mock .kisiler-mockup .yeni-kisi-modal-box:not(.atama-modal-box) .yeni-kisi-modal-grid {
  min-width: 0;
}

@supports not (zoom: 1) {
  .hero-mb-panel1-mock .kisiler-mockup .yeni-kisi-modal-box:not(.atama-modal-box) {
    zoom: normal;
    transform: scale(0.7);
    transform-origin: top center;
  }
}

.yeni-kisi-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(4px);
  font-family: var(--font-sans);
}
.yeni-kisi-modal-overlay[aria-hidden="false"] {
  display: flex;
}
.yeni-kisi-modal-box {
  background: #fff;
  border-radius: var(--radius);
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  border: 1px solid var(--color-border);
  max-width: 460px;
  width: 100%;
  max-height: 95vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transform: none;
}
.yeni-kisi-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--color-border);
  flex-shrink: 0;
}
.yeni-kisi-modal-title-wrap {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.yeni-kisi-modal-icon {
  width: 24px;
  height: 24px;
  border-radius: 6px;
  background: #3B7FB9;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.yeni-kisi-modal-icon svg,
.yeni-kisi-modal-icon i {
  width: auto;
  height: auto;
  font-size: 0.6875rem;
  line-height: 1;
}
.yeni-kisi-modal-title {
  font-size: 0.875rem;
  font-weight: 700;
  color: #3B7FB9;
  margin: 0;
}
.yeni-kisi-modal-close {
  width: 28px;
  height: 28px;
  padding: 0;
  border: none;
  background: none;
  border-radius: 6px;
  color: #6b7280;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s, color 0.2s;
}
.yeni-kisi-modal-close:hover {
  background: #f3f4f6;
  color: #111827;
}

.yeni-kisi-modal-close i {
  font-size: 0.875rem;
  line-height: 1;
}
.yeni-kisi-modal-form {
  padding: 0.75rem 1rem;
  overflow-y: auto;
  flex: 1;
  min-height: 0;
}
.yeni-kisi-modal-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.6rem;
}
.yeni-kisi-field {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.yeni-kisi-field-full {
  grid-column: 1 / -1;
}
.yeni-kisi-label {
  font-size: 0.625rem;
  font-weight: 500;
  color: #4b5563;
}
.yeni-kisi-label .text-red {
  color: #ef4444;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}

.yeni-kisi-input {
  width: 100%;
  padding: 0.35rem 0;
  font-size: 0.75rem;
  color: #111827;
  background: transparent;
  border: none;
  border-bottom: 2px solid #e5e7eb;
  outline: none;
  transition: border-color 0.2s;
  font-family: var(--font-sans);
}
.yeni-kisi-input::placeholder {
  color: #9ca3af;
}
.yeni-kisi-input:focus {
  border-bottom-color: #3B7FB9;
}

@keyframes yeniKisiFillPop {
  0% { transform: translateY(0) scale(1); box-shadow: 0 0 0 rgba(59,127,185,0); }
  45% { transform: translateY(-1px) scale(1.02); box-shadow: 0 0 0 2px rgba(59,127,185,.18); }
  100% { transform: translateY(0) scale(1); box-shadow: 0 0 0 rgba(59,127,185,0); }
}
.yeni-kisi-fill-pop {
  border-bottom-color: #3B7FB9 !important;
  animation: yeniKisiFillPop 0.45s ease-out;
}

@keyframes yeniKisiKvkkPress {
  0% { transform: translateY(0) scale(1); }
  40% { transform: translateY(-1px) scale(1.04); }
  100% { transform: translateY(0) scale(1); }
}
.yeni-kisi-kvkk-press-pop {
  animation: yeniKisiKvkkPress 0.55s ease-out;
  box-shadow: 0 0 0 2px rgba(59,127,185,.18);
}

@keyframes atamaDemoHoverPulse {
  0% {
    box-shadow: 0 0 0 0 rgba(59, 127, 185, 0.28);
  }
  100% {
    box-shadow: 0 0 0 5px rgba(59, 127, 185, 0.12);
  }
}
.atama-demo-hover {
  position: relative;
  z-index: 3;
  animation: atamaDemoHoverPulse 0.38s ease-out forwards;
  outline: 2px solid rgba(59, 127, 185, 0.35);
  outline-offset: 2px;
  border-radius: 8px;
}
.bag-actions.atama-demo-hover,
button.bag-actions.atama-demo-hover {
  border-radius: 10px;
}
.atama-kisi-list-item.atama-demo-hover {
  outline-offset: 1px;
  border-radius: 10px;
}
.bag-flyout-item.atama-demo-hover {
  border-radius: 10px;
  outline-offset: -2px;
}
.atama-demo-press {
  transition:
    transform 0.07s ease-out,
    box-shadow 0.07s ease-out,
    filter 0.07s ease-out;
  transform: scale(0.96);
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.12);
  filter: brightness(0.97);
}
.bag-actions.atama-demo-press,
.kisiler-btn-yeni-kisi.atama-demo-press {
  transform: scale(0.93);
}
.atama-kisi-list-item.atama-demo-press {
  transform: scale(0.98);
}
.yeni-kisi-btn-save.atama-demo-press,
.atama-btn-ghost.atama-demo-press {
  transform: scale(0.97);
}

.kisiler-btn-yeni-kisi.atama-demo-hover {
  border-radius: 6px;
  outline-offset: 1px;
}

@keyframes yeniKisiKvkkSentPulse {
  0% { transform: translateY(0) scale(1); box-shadow: 0 0 0 0 rgba(16,185,129,.0); }
  40% { transform: translateY(-1px) scale(1.03); box-shadow: 0 0 0 8px rgba(16,185,129,.18); }
  100% { transform: translateY(0) scale(1); box-shadow: 0 0 0 0 rgba(16,185,129,.0); }
}
.yeni-kisi-kvkk-sent {
  background: #10b981 !important;
  color: #ffffff;
  cursor: default;
  animation: yeniKisiKvkkSentPulse .6s ease-out;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.yeni-kisi-kvkk-sent i {
  font-size: 0.75rem;
  line-height: 1;
}

@keyframes yeniKisiSpinnerSpin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.yeni-kisi-kvkk-sending {
  background: #9ca3af !important;
  color: #ffffff !important;
  cursor: default;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  animation: yeniKisiKvkkSentPulse .9s ease-out;
}
.yeni-kisi-spinner {
  width: 14px;
  height: 14px;
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,.35);
  border-top-color: rgba(255,255,255,.95);
  animation: yeniKisiSpinnerSpin .8s linear infinite;
  flex: 0 0 auto;
}
.yeni-kisi-input-wrap {
  position: relative;
}
.yeni-kisi-input-wrap .yeni-kisi-input {
  padding-right: 1.25rem;
}
.yeni-kisi-currency {
  position: absolute;
  right: 0;
  bottom: 0.35rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: #9ca3af;
}
.yeni-kisi-textarea {
  resize: none;
  min-height: 2.5rem;
}
.yeni-kisi-error {
  font-size: 0.5625rem;
  color: #ef4444;
  min-height: 0.75rem;
}
.yeni-kisi-btn-kvkk {
  width: 100%;
  padding: 0.5rem 0.75rem;
  font-size: 0.6875rem;
  font-weight: 600;
  color: #fff;
  background: #3B7FB9;
  border: none;
  border-radius: var(--radius);
  cursor: pointer;
  transition: background 0.2s;
  font-family: var(--font-sans);
}
.yeni-kisi-btn-kvkk:hover:not(:disabled) {
  background: #2E6A9D;
}
.yeni-kisi-btn-kvkk:disabled {
  background: #10b981;
  cursor: default;
}
.yeni-kisi-modal-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  border-top: 1px solid var(--color-border);
  background: #f9fafb;
  flex-shrink: 0;
}
.yeni-kisi-btn-save {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.4rem 1rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: #fff;
  background: #3B7FB9;
  border: none;
  border-radius: var(--radius);
  cursor: pointer;
  transition: background 0.2s;
  font-family: var(--font-sans);
}

.yeni-kisi-toast {
  position: fixed;
  top: 18px;
  left: 50%;
  transform: translateX(-50%);
  background: #10b981;
  color: #ffffff;
  padding: 10px 16px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
  z-index: 99999;
  animation: yeniKisiToastIn .25s ease-out;
}

@keyframes yeniKisiToastIn {
  0% { opacity: 0; transform: translateX(-50%) translateY(-6px) scale(0.98); }
  100% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); }
}

.yeni-kisi-success-overlay {
  position: absolute;
  inset: 0;
  background: rgba(17, 24, 39, 0.04);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100000;
  padding: 8px;
  animation: yeniKisiSuccessFade .18s ease-out;
}

@keyframes yeniKisiSuccessFade {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

.yeni-kisi-success-card {
  width: 250px;
  max-width: 90%;
  background: #ffffff;
  border-radius: 14px;
  border: 1px solid var(--color-border);
  box-shadow: 0 18px 45px -18px rgba(0, 0, 0, 0.28);
  padding: 12px 10px 10px;
  text-align: center;
}

.yeni-kisi-success-icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #34d399;
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px;
  font-size: 18px;
  animation: yeniKisiSuccessIconPop .5s ease-out;
}

.yeni-kisi-success-icon i {
  font-size: 18px;
}

.yeni-kisi-success-message {
  font-size: 13px;
  font-weight: 800;
  color: #0f766e;
}

@keyframes yeniKisiSuccessIconPop {
  0% { transform: scale(0.8); opacity: 0.7; }
  60% { transform: scale(1.08); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}

.yeni-kisi-success-ok-btn {
  margin-top: 12px;
  width: auto !important;
  max-width: 200px;
  padding: 8px 14px;
  margin-left: auto;
  margin-right: auto;
  justify-content: center;
  display: inline-flex;
}

.yeni-kisi-success-ok-btn:hover {
  transform: translateY(-1px);
}

.yeni-kisi-success-ok-btn:active {
  transform: translateY(0);
}
.yeni-kisi-btn-save:hover {
  background: #2E6A9D;
}
.yeni-kisi-btn-save svg,
.yeni-kisi-btn-save i {
  flex-shrink: 0;
}

.tg-gelir-modal-box {
  display: flex;
  flex-direction: column;
  max-width: 37.5rem;
  border-radius: 8px;
  border: 1px solid #e5e7eb;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  overflow: hidden;
  max-height: 90vh;
  min-height: 0;
  font-family: var(--font-sans);
}
.tge-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 1rem;
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
  flex-shrink: 0;
}
.tge-modal-header-left {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.tge-modal-icon {
  width: 24px;
  height: 24px;
  border-radius: 8px;
  background: #3b7fb9;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}
.tge-modal-icon i {
  color: #fff;
  font-size: 0.625rem;
}
.tge-modal-title {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 700;
  color: #3b7fb9;
}
.tge-modal-close {
  width: 24px;
  height: 24px;
  border-radius: 4px;
  border: none;
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #6b7280;
  transition: background 0.2s, color 0.2s;
}
.tge-modal-close:hover {
  background: #f3f4f6;
  color: #374151;
}
.tge-modal-close i {
  font-size: 0.75rem;
}
.tge-kategori-selector {
  display: flex;
  align-items: center;
  gap: 0.5rem 0.75rem;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid #e5e7eb;
  background: #fff;
  flex-wrap: wrap;
  flex-shrink: 0;
}
.tge-kategori-selector > .tge-kategori-btn:not(.tge-kategori-btn--small) {
  flex-shrink: 0;
}
.tge-kategori-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.5rem 1rem;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s, color 0.2s, box-shadow 0.2s;
  border: none;
  background: #f3f4f6;
  color: #6b7280;
  font-family: var(--font-sans);
}
.tge-kategori-btn:hover {
  background: #e5e7eb;
}
.tge-kategori-btn.tge-is-active {
  background: #3b7fb9;
  color: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}
.tge-kategori-btn.tge-is-active i {
  color: #fff;
}
.tge-kategori-btn i {
  font-size: 0.625rem;
}
.tge-kategori-btn--small {
  padding: 0.25rem 0.625rem;
  font-size: 0.6875rem;
  background: #fff;
  border: 1px solid #e5e7eb;
  color: #374151;
}
.tge-kategori-btn--small:hover {
  background: #f9fafb;
}
.tge-kategori-btn--small.tge-is-active {
  background: #3b7fb9;
  color: #fff;
  border-color: #3b7fb9;
}
.tge-kategori-btn--small i {
  font-size: 0.5625rem;
}
.tge-faturalar-group {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.375rem 0.75rem;
  background: #f9fafb;
  border-radius: 6px;
  border: 1px solid #e5e7eb;
  flex-wrap: wrap;
  min-width: 0;
  justify-content: flex-start;
}
.tge-faturalar-label {
  font-size: 0.625rem;
  font-weight: 700;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.tge-form-body {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0.75rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  background: #fff;
  min-height: 0;
}
.tge-form-row-2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.625rem 1rem;
  align-items: start;
}
.tge-form-field {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
}
.tge-form-label {
  font-size: 0.625rem;
  font-weight: 500;
  color: #4b5563;
  line-height: 1.35;
}
.tge-required {
  color: #ef4444;
}
.tge-form-input {
  width: 100%;
  padding: 0.5rem 0;
  margin: 0;
  background: transparent;
  border: none;
  border-bottom: 2px solid #e5e7eb;
  font-size: 0.75rem;
  line-height: 1.35;
  color: #1f2937;
  transition: border-color 0.2s;
  outline: none;
  font-family: var(--font-sans);
  box-sizing: border-box;
  vertical-align: middle;
}
.tge-form-input[type="date"] {
  min-height: 2.125rem;
  padding: 0.45rem 0;
  color-scheme: light;
}
.tge-form-input::placeholder {
  color: #9ca3af;
}
.tge-form-input:focus {
  border-bottom-color: #3b7fb9;
}
.tge-form-input--disabled,
.tge-form-input.tge-form-input--disabled:disabled {
  border-bottom-color: #f3f4f6;
  color: #d1d5db;
  cursor: not-allowed;
}
.tge-form-select {
  width: 100%;
  padding: 0.5rem 1.25rem 0.5rem 0;
  margin: 0;
  min-height: 2.125rem;
  background-color: transparent;
  border: none;
  border-bottom: 2px solid #e5e7eb;
  font-size: 0.75rem;
  line-height: 1.35;
  color: #1f2937;
  cursor: pointer;
  transition: border-color 0.2s;
  outline: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M6 8L2 4h8z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0 center;
  font-family: var(--font-sans);
  box-sizing: border-box;
  vertical-align: middle;
}
.tge-form-select:focus {
  border-bottom-color: #3b7fb9;
}
.tge-input-wrapper {
  display: flex;
  align-items: flex-end;
  gap: 0.35rem;
  width: 100%;
  min-width: 0;
  border-bottom: 2px solid #e5e7eb;
  padding-bottom: 0;
  box-sizing: border-box;
}
.tge-input-wrapper .tge-form-input {
  flex: 1;
  min-width: 0;
  border-bottom: none;
  padding-right: 0;
}
.tge-input-wrapper:focus-within {
  border-bottom-color: #3b7fb9;
}
.tge-input-wrapper .tge-form-input:focus {
  border-bottom-color: transparent;
  outline: none;
}
.tge-amount-input {
  padding-right: 0;
}
.tge-amount-input::-webkit-outer-spin-button,
.tge-amount-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.tge-amount-input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}
.tge-currency-symbol {
  flex-shrink: 0;
  font-size: 0.75rem;
  font-weight: 600;
  color: #9ca3af;
  line-height: 1.35;
  padding-bottom: 0.5rem;
  align-self: flex-end;
}
.tge-error-message {
  font-size: 0.5625rem;
  color: #ef4444;
  margin-top: 0.125rem;
}
.tge-checkbox-label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  user-select: none;
  margin-bottom: 0.375rem;
}
.tge-checkbox-label input[type="checkbox"] {
  width: 14px;
  height: 14px;
  border-radius: 3px;
  border: 1px solid #d1d5db;
  accent-color: #3b7fb9;
  cursor: pointer;
}
.tge-checkbox-label span {
  font-size: 0.625rem;
  font-weight: 500;
  color: #4b5563;
}
.tge-modal-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
  padding: 0.75rem 1.25rem;
  border-top: 1px solid #e5e7eb;
  background: #fff;
  flex-shrink: 0;
}
.tge-submit-btn {
  padding: 0.375rem 1rem;
  background: #3b7fb9;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 0.75rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-family: var(--font-sans);
}
.tge-submit-btn:hover {
  background: #2e6a9d;
}
.tge-submit-btn i {
  font-size: 0.75rem;
}
.tge-hidden {
  display: none !important;
}
.yeni-kisi-btn-save i {
  font-size: 0.8125rem;
}

.atama-modal-box {
  max-width: 500px;
  overflow: visible;
}

.atama-modal-box .yeni-kisi-modal-title {
  font-size: 0.8125rem;
  line-height: 1.3;
  max-width: 17rem;
}

.atama-modal-form {
  padding-top: 0.45rem;
}

.atama-role-tabs {
  display: flex;
  gap: 0.35rem;
  margin-bottom: 0.65rem;
}

.atama-tab {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  padding: 0.38rem 0.35rem;
  font-size: 0.65rem;
  font-weight: 600;
  font-family: var(--font-sans);
  color: #6b7280;
  background: #f3f4f6;
  border: 1px solid #e5e7eb;
  border-radius: var(--radius);
  cursor: pointer;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.atama-tab i {
  font-size: 0.6rem;
  opacity: 0.95;
}

.atama-tab-active {
  background: #3B7FB9;
  color: #fff;
  border-color: #3B7FB9;
}

.atama-tab-active i {
  color: #fff;
}

.atama-unit-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin-bottom: 0.65rem;
  padding-bottom: 0.65rem;
  border-bottom: 1px solid var(--color-border);
}

.atama-unit-row-single {
  grid-template-columns: 1fr;
}

.atama-unit-value {
  font-size: 0.8125rem;
  font-weight: 700;
  color: #111827;
  margin-top: 0.15rem;
}

.atama-section {
  margin-bottom: 0.65rem;
}

.atama-mevcut-heading {
  display: block;
  margin-bottom: 0.3rem;
}

.atama-mevcut-list {
  min-height: 2.25rem;
  padding: 0.45rem 0.5rem;
  background: #fafafa;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
}

.atama-mevcut-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem;
  font-size: 0.6875rem;
}

.atama-mevcut-main {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem;
}

.atama-mevcut-name {
  font-weight: 700;
  color: #3B7FB9;
}

.atama-mevcut-meta {
  font-weight: 600;
  color: #4b5563;
}

.atama-mevcut-empty {
  text-align: center;
  font-size: 0.65rem;
  color: #9ca3af;
  padding: 0.35rem 0.25rem;
}

.atama-mevcut-row--sakin {
  justify-content: space-between;
  align-items: flex-start;
}

.atama-mevcut-row--sakin .atama-mevcut-main {
  flex-direction: column;
  align-items: flex-start;
}

.atama-mevcut-actions {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-shrink: 0;
}

.atama-mevcut-btn {
  border-radius: 999px;
  padding: 0.2rem 0.55rem;
  font-size: 0.65rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
  border: 1px solid transparent;
}

.atama-mevcut-btn-sakin {
  background: #3B7FB9;
  color: #ffffff;
  border-color: #3B7FB9;
}

.atama-mevcut-btn-cikar {
  background: transparent;
  color: #3B7FB9;
  border-color: #3B7FB9;
}

.atama-mevcut-giris {
  color: #4b5563;
  font-weight: 600;
}

.atama-mevcut-list-highlight {
  border-color: #22c55e;
  box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.18);
}

.atama-mevcut-list-highlight .atama-mevcut-row {
  background: rgba(34, 197, 94, 0.06);
  border-radius: 8px;
  padding: 0.28rem 0.34rem;
}

.atama-mevcut-list-highlight .atama-mevcut-row + .atama-mevcut-row {
  margin-top: 0.3rem;
}

.atama-add-block {
  margin-top: 0.1rem;
}

.atama-kisi-picker {
  position: relative;
}

.atama-kisi-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem;
  padding: 0.4rem 0.15rem 0.4rem 0;
  font-size: 0.74rem;
  border: none;
  border-bottom: 2px solid #e5e7eb;
  background: transparent;
  cursor: pointer;
  font-family: var(--font-sans);
  text-align: left;
  color: #6b7280;
  transition: border-color 0.2s ease, color 0.2s ease;
}

.atama-kisi-trigger:hover {
  border-bottom-color: #cbd5e1;
}

.atama-kisi-trigger-text {
  flex: 1;
  min-width: 0;
  color: #9ca3af;
  font-weight: 500;
}

.atama-kisi-trigger-filled .atama-kisi-trigger-text {
  color: #111827;
  font-weight: 600;
}

.atama-kisi-trigger-chevron {
  flex-shrink: 0;
  font-size: 0.5rem;
  color: #6b7280;
  transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

.atama-kisi-trigger[aria-expanded="true"] .atama-kisi-trigger-chevron {
  transform: rotate(180deg);
}

@keyframes atamaKisiPanelRevealUp {
  0% {
    opacity: 0;
    transform: translateY(22px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes atamaKisiChildFadeUp {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.atama-kisi-panel {
  position: absolute;
  left: 0;
  right: 0;
  top: auto;
  bottom: 100%;
  z-index: 10;
  margin-bottom: 0.35rem;
  margin-top: 0;
  padding: 0.5rem 0.55rem 0.55rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  background: #fff;
  box-shadow: 0 -10px 40px rgba(15, 23, 42, 0.14), 0 -2px 12px rgba(15, 23, 42, 0.08);
  transform-origin: bottom center;
}

.atama-kisi-panel:not([hidden]) {
  animation: atamaKisiPanelRevealUp 0.95s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.atama-kisi-panel:not([hidden]) .atama-kisi-arama {
  animation: atamaKisiChildFadeUp 0.85s cubic-bezier(0.22, 1, 0.36, 1) 0.12s both;
}

.atama-kisi-panel:not([hidden]) .atama-kisi-list-wrap {
  animation: atamaKisiChildFadeUp 0.85s cubic-bezier(0.22, 1, 0.36, 1) 0.28s both;
}

.atama-kisi-panel[hidden] {
  display: none !important;
}

.atama-kisi-arama {
  margin-bottom: 0.45rem;
}

.atama-kisi-list-wrap {
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  background: #fff;
  --atama-kisi-row-h: 2.05rem;
  max-height: calc(var(--atama-kisi-row-h) * 3 + 0.35rem);
  overflow-y: auto;
  overflow-x: hidden;
  margin-bottom: 0;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.04);
  scrollbar-width: thin;
}

.atama-kisi-list-wrap::-webkit-scrollbar {
  width: 6px;
}

.atama-kisi-list-wrap::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}

.atama-kisi-list {
  display: flex;
  flex-direction: column;
  padding: 0.15rem 0;
}

.atama-kisi-list-item {
  width: 100%;
  min-height: var(--atama-kisi-row-h);
  box-sizing: border-box;
  display: flex;
  align-items: center;
  text-align: left;
  padding: 0.35rem 0.65rem;
  font-size: 0.72rem;
  font-weight: 500;
  color: #374151;
  background: transparent;
  border: none;
  border-bottom: 1px solid #f3f4f6;
  cursor: pointer;
  font-family: var(--font-sans);
  transition: background 0.12s ease, color 0.12s ease;
  flex-shrink: 0;
}

.atama-kisi-list-item:last-child {
  border-bottom: none;
}

.atama-kisi-list-item:hover:not(.atama-kisi-list-item-active) {
  background: #f9fafb;
}

.atama-kisi-list-item-active {
  background: #3B7FB9 !important;
  color: #fff !important;
}

.atama-kisi-list-item-hidden {
  display: none !important;
}

.atama-modal-footer {
  justify-content: flex-end;
  gap: 0.45rem;
}

.atama-btn-ghost {
  background: #fff !important;
  color: #3B7FB9 !important;
  border: 1px solid #3B7FB9 !important;
  box-shadow: none;
}

.atama-btn-ghost:hover {
  background: #eff6ff !important;
}

.atama-modal-footer .yeni-kisi-btn-save i {
  font-size: 0.7rem;
}

@media (max-width: 1024px) {
  .comm-content,
  .banks-content {
    margin-left: 0;
  }
}

.prc-section {
  position: relative;
  z-index: 1;
  padding: 0;
  background: transparent;
  scroll-margin-top: 5.5rem; 
}

.prc-shell {
  position: relative;
  overflow: hidden;
  border-radius: 48px 48px 0 0;
  padding-bottom: 4.5rem; 
  background:
    radial-gradient(ellipse 900px 500px at 10% 10%, rgba(17,100,255,0.30) 0%, transparent 55%),
    radial-gradient(ellipse 700px 400px at 90% 90%, rgba(110,45,255,0.28) 0%, transparent 55%),
    linear-gradient(140deg, #030c1a 0%, #0a1532 45%, #0c0c2e 100%);
  
  border: 1px solid rgba(255,255,255,0.10);
  border-bottom: none;
  box-shadow: 0 20px 48px rgba(2, 6, 23, 0.38);
}

.prc-shell::before {
  content: "";
  pointer-events: none;
  position: absolute;
  top: -120px;
  left: -120px;
  width: 520px;
  height: 520px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(99,102,241,0.18) 0%, transparent 65%);
}

.prc-inner {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0;
  align-items: center;
  max-width: 80rem;
  margin: 0 auto;
  padding: 3rem 1.25rem 2.85rem 1.25rem;
  box-sizing: border-box;
}

.prc-copy {
  display: flex;
  flex-direction: column;
  gap: 1.4rem;
  min-width: 320px;
  padding-right: 2rem;
}

.prc-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.35rem 0.85rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #818cf8;
  background: rgba(79,70,229,0.16);
  border: 1px solid rgba(99,102,241,0.32);
  width: fit-content;
}

.prc-title {
  margin: 0;
  font-size: clamp(2rem, 3.5vw, 3.2rem);
  line-height: 1.12;
  font-weight: 800;
  letter-spacing: -0.025em;
  color: #e2e8f0;
}

.prc-title-gradient {
  display: block;
  background: linear-gradient(120deg, #818cf8 0%, #a5b4fc 45%, #7dd3fc 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.prc-desc {
  margin: 0;
  max-width: 34rem;
  font-size: 1.05rem;
  line-height: 1.7;
  color: rgba(203,213,225,0.82);
}

.prc-perks {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

.prc-perks li {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.975rem;
  font-weight: 500;
  color: rgba(226,232,240,0.88);
}

.prc-check {
  flex-shrink: 0;
  width: 1.55rem;
  height: 1.55rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 20%, rgba(224,231,255,0.95), rgba(238,242,255,0.78));
  box-shadow: 0 8px 20px rgba(79,70,229,0.28);
  color: #4f46e5;
}

.prc-check svg {
  width: 0.78rem;
  height: 0.78rem;
}

.prc-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.25rem;
}

.prc-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 46px;
  padding: 0 1.35rem;
  border-radius: 12px;
  background: linear-gradient(135deg, #4f46e5 0%, #6366f1 100%);
  color: #fff;
  font-size: 0.95rem;
  font-weight: 700;
  text-decoration: none;
  border: none;
  cursor: pointer;
  box-shadow: 0 10px 24px -12px rgba(79,70,229,0.65);
  transition: filter 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.prc-cta-btn:hover {
  filter: brightness(1.07);
  transform: translateY(-2px);
  box-shadow: 0 14px 28px -12px rgba(79,70,229,0.7);
}

.prc-cta-btn .fa-solid {
  font-size: 1rem;
  line-height: 1;
}

.prc-ghost-btn {
  display: inline-flex;
  align-items: center;
  min-height: 46px;
  padding: 0 1.2rem;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.28);
  color: rgba(226,232,240,0.92);
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  background: rgba(255,255,255,0.04);
  transition: background 0.18s ease, border-color 0.18s ease;
}

.prc-ghost-btn:hover {
  background: rgba(255,255,255,0.09);
  border-color: rgba(255,255,255,0.45);
}

.prc-widget-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2.5rem 2rem 2.5rem 0.5rem;
}

.prc-widget {
  width: 460px;
  border-radius: 20px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.06) inset,
    0 24px 60px rgba(0,0,0,0.45),
    0 4px 16px rgba(79,70,229,0.15);
  overflow: hidden;
  transition: box-shadow 0.3s ease;
}

.prc-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  background: #e8edf5;
  border-bottom: 1px solid #dce3ef;
}

.prc-tab {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 0.7rem 0.5rem;
  font-size: 0.78rem;
  font-weight: 700;
  color: #64748b;
  background: transparent;
  border: none;
  cursor: pointer;
  transition: background 0.18s ease, color 0.18s ease;
  white-space: nowrap;
}

.prc-tab:hover {
  color: #334155;
  background: rgba(255,255,255,0.5);
}

.prc-tab-active {
  background: #ffffff;
  color: #1e1b4b;
  box-shadow: 0 1px 4px rgba(15,23,42,0.08);
}

.prc-panel {
  
  display: block;
}

.prc-panel-cols {
  display: flex;
  flex-direction: column;
}

.prc-panel-inputs {
  flex: none;
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  padding: 1.1rem 1.25rem 1.25rem;
  box-sizing: border-box;
}

.prc-panel-plans-col {
  width: 100%;
  padding: 0.85rem 1.25rem 1rem;
  box-sizing: border-box;
  border-top: 1px solid #e8edf5;
}

.prc-panel-results-col {
  width: 100%;
  max-height: 0;
  overflow: hidden;
  background: linear-gradient(160deg, #f0eeff 0%, #eef2ff 50%, #f8f9ff 100%);
  border-top: 0 solid rgba(99,102,241,0.2);
  border-bottom: 0 solid rgba(99,102,241,0.12);
  margin: 0 -1.25rem;
  width: calc(100% + 2.5rem);
  transition: max-height 0.45s cubic-bezier(0.4, 0, 0.2, 1),
              border-top-width 0.45s ease,
              border-bottom-width 0.45s ease;
}

.prc-panel-results-col.prc-results-open {
  max-height: 260px;
  border-top-width: 1px;
  border-bottom-width: 1px;
}

.prc-results-inner {
  width: 100%;
  padding: 1rem 1.25rem;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 0.65rem;
  box-sizing: border-box;
}

.prc-res-total-block {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.15rem;
  padding-right: 1rem;
  border-right: 2px solid rgba(99,102,241,0.18);
  min-width: 130px;
}

.prc-res-label-row {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.1rem;
}

.prc-res-label {
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #6366f1;
}

.prc-panel-results-col .prc-result-total {
  font-size: 1.6rem;
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1.1;
  word-break: break-all;
  background: linear-gradient(135deg, #3730a3 0%, #4f46e5 60%, #6366f1 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.prc-res-period {
  font-size: 0.58rem;
  font-weight: 700;
  color: #94a3b8;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-top: 0.1rem;
}

.prc-res-mini-row {
  flex: 1;
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  align-items: stretch;
}

.prc-res-mini-card {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  padding: 0.55rem 0.65rem;
  border-radius: 10px;
  background: #ffffff;
  border: 1px solid rgba(99,102,241,0.14);
  box-shadow: 0 1px 4px rgba(99,102,241,0.08);
}

.prc-res-mini-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 6px;
  background: rgba(99,102,241,0.1);
  margin-bottom: 0.15rem;
  flex-shrink: 0;
}

.prc-res-mini-icon svg {
  color: #6366f1;
}

.prc-res-mini-label {
  font-size: 0.52rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #94a3b8;
}

.prc-res-mini-val {
  font-size: 0.88rem;
  font-weight: 800;
  color: #1e1b4b;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.prc-panel-results-col .prc-saving-band {
  flex: 0 0 100%;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
  background: linear-gradient(90deg, #ecfdf5 0%, #f0fdf4 100%);
  border: 1px solid #86efac;
  border-radius: 8px;
  color: #15803d;
  font-size: 0.8rem;
  font-weight: 700;
  margin-top: 0.1rem;
  box-shadow: 0 1px 4px rgba(22,163,74,0.1);
}

.prc-panel-results-col .prc-saving-band svg {
  flex-shrink: 0;
  color: #16a34a;
}

.prc-panel-sms {
  padding: 1.1rem 1.25rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.prc-panel-hidden {
  display: none !important;
}

.prc-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.6rem;
}

.prc-panel-label {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #334155;
}

.prc-panel-subtitle {
  margin: 0.28rem 0 0;
  font-size: 0.78rem;
  color: #64748b;
  line-height: 1.4;
}

.prc-badge {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.03em;
}

.prc-badge-blue {
  background: #eef2ff;
  color: #4338ca;
  border: 1px solid #c7d2fe;
}

.prc-badge-green {
  background: #ecfdf5;
  color: #065f46;
  border: 1px solid #6ee7b7;
}

.prc-field {
  display: flex;
  flex-direction: column;
  gap: 0.42rem;
}

.prc-field-label {
  margin: 0;
  font-size: 0.8rem;
  font-weight: 600;
  color: #475569;
}

.prc-input {
  width: 100%;
  height: 40px;
  border-radius: 10px;
  border: 1.5px solid #e2e8f0;
  background: #ffffff;
  color: #0f172a;
  font-size: 0.95rem;
  font-weight: 600;
  padding: 0 0.8rem;
  outline: none;
  box-sizing: border-box;
  box-shadow: 0 1px 2px rgba(15,23,42,0.04);
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.prc-input::placeholder {
  color: #94a3b8;
  font-weight: 400;
}

.prc-input:focus {
  border-color: #a5b4fc;
  box-shadow: 0 0 0 3px rgba(99,102,241,0.18);
}

.prc-plan-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.45rem;
}

.prc-plan-btn {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0.52rem 0.6rem;
  min-height: 56px;
  border-radius: 10px;
  border: 1.5px solid #dbe3ee;
  background: #ffffff;
  color: #0f172a;
  cursor: pointer;
  position: relative;
  text-align: left;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

.prc-plan-btn:hover {
  border-color: #a5b4fc;
  transform: translateY(-1px);
}

.prc-plan-btn.prc-plan-active,
.prc-plan-btn.is-active {
  border-color: #4f46e5;
  background: linear-gradient(175deg, #f5f7ff 0%, #eef2ff 100%);
  box-shadow: 0 0 0 1px rgba(79,70,229,0.22), 0 8px 16px -12px rgba(79,70,229,0.5);
  transform: translateY(-1px);
}

.prc-plan-btn.prc-plan-active::after,
.prc-plan-btn.is-active::after {
  content: "\f00c";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  top: 6px;
  right: 7px;
  font-size: 0.68rem;
  color: #4f46e5;
}

.prc-plan-name {
  display: block;
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1;
}

.prc-plan-note {
  display: block;
  margin-top: 0.22rem;
  font-size: 0.68rem;
  font-weight: 600;
  color: #64748b;
  line-height: 1;
}

.prc-plan-btn.prc-plan-active .prc-plan-note,
.prc-plan-btn.is-active .prc-plan-note {
  color: #4f46e5;
}

.prc-results {
  border-radius: 12px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  overflow: hidden;
}

.prc-result-main {
  padding: 0.7rem 0.9rem 0.65rem;
  border-bottom: 1px solid #e8edf5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  background: linear-gradient(150deg, #f5f3ff 0%, #ffffff 60%);
}

.prc-result-label {
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #4f46e5;
}

.prc-result-total {
  font-size: 1.6rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #1e1b4b;
  line-height: 1;
}

.prc-result-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.prc-result-card {
  padding: 0.6rem 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.22rem;
}

.prc-result-card:first-child {
  border-right: 1px solid #e8edf5;
}

.prc-result-card-label {
  font-size: 0.63rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #94a3b8;
}

.prc-result-card-val {
  font-size: 1.05rem;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.02em;
}

.prc-saving {
  margin: 0;
  padding: 0.45rem 0.9rem;
  font-size: 0.8rem;
  font-weight: 700;
  color: #065f46;
  background: #ecfdf5;
  border-top: 1px solid #a7f3d0;
  text-align: center;
}

.prc-panel-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 42px;
  border-radius: 10px;
  border: none;
  background: linear-gradient(135deg, #4f46e5 0%, #6366f1 100%);
  color: #ffffff;
  font-size: 0.88rem;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 8px 20px -10px rgba(79,70,229,0.65);
  transition: filter 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.prc-panel-cta:hover {
  filter: brightness(1.06);
  transform: translateY(-1px);
  box-shadow: 0 12px 24px -10px rgba(79,70,229,0.7);
}

.prc-panel-cta-sms {
  background: linear-gradient(135deg, #4338ca 0%, #6366f1 100%);
}

.prc-panel-sms .prc-field-label {
  color: #3730a3;
}

.prc-sms-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.42rem;
}

.prc-sms-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 0.4rem;
  border-radius: 10px;
  border: 1.5px solid #c7d2fe;
  background: #eef2ff;
  color: #3730a3;
  cursor: pointer;
  transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
  gap: 0.15rem;
}

.prc-sms-btn:hover {
  border-color: #818cf8;
  background: #e0e7ff;
  transform: translateY(-1px);
}

.prc-sms-btn.prc-plan-active,
.prc-sms-btn.is-active {
  border-color: #4338ca;
  background: linear-gradient(175deg, #e0e7ff 0%, #eef2ff 100%);
  box-shadow: 0 0 0 1px rgba(67,56,202,0.2);
  transform: translateY(-1px);
}

.prc-sms-count {
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1;
}

.prc-sms-price {
  font-size: 0.68rem;
  font-weight: 600;
  color: #4338ca;
  line-height: 1;
}

.prc-results-sms {
  background: linear-gradient(150deg, #eef2ff 0%, #ffffff 60%);
}

.prc-result-main-sms {
  border-bottom: none;
  background: transparent;
}

.prc-result-total-sms {
  color: #312e81;
}

@media (max-width: 1100px) {
  .prc-inner {
    padding: 3.5rem 1.25rem 3rem 1.25rem;
  }
}

@media (max-width: 880px) {
  .prc-inner {
    grid-template-columns: 1fr;
    padding: 3rem 1.25rem 0;
  }

  .prc-copy {
    min-width: 0;
    padding-right: 0;
  }

  .prc-widget-wrap {
    padding: 1.5rem 0 0;
    justify-content: center;
  }

  .prc-widget,
  .prc-widget,
  .prc-widget.prc-widget-open {
    width: 100%;
    max-width: none;
    border-radius: 20px 20px 0 0;
    border-bottom: none;
  }
}

@media (max-width: 480px) {
  .prc-shell {
    border-radius: 28px 28px 0 0;
  }

  .prc-inner {
    padding: 2.5rem 1rem 0 1rem;
  }

  .prc-plan-grid {
    grid-template-columns: 1fr;
    gap: 0.4rem;
  }

  .prc-plan-btn {
    flex-direction: row;
    align-items: center;
    min-height: auto;
    gap: 0.5rem;
  }

  .prc-plan-note {
    margin-top: 0;
  }
}

[data-price-view-btn].prc-tab.price-dark-switch-btn-active {
  background: #ffffff;
  color: #1e1b4b;
}

.prc-input-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.prc-input-row .prc-field-label {
  flex: 1;
}

.prc-input-compact {
  width: 90px !important;
  text-align: center;
}

.prc-slider-wrap {
  margin-top: 0.45rem;
}

.prc-slider {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 5px;
  border-radius: 999px;
  background: linear-gradient(to right, #4f46e5 0%, #4f46e5 var(--prc-slider-pct, 0%), #dbe3ee var(--prc-slider-pct, 0%), #dbe3ee 100%);
  outline: none;
  cursor: pointer;
  transition: background 0.1s ease;
}

.prc-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #ffffff;
  border: 2.5px solid #4f46e5;
  box-shadow: 0 2px 8px rgba(79,70,229,0.35);
  cursor: grab;
  transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.prc-slider::-webkit-slider-thumb:active {
  cursor: grabbing;
  transform: scale(1.2);
  box-shadow: 0 4px 14px rgba(79,70,229,0.45);
}

.prc-slider::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #ffffff;
  border: 2.5px solid #4f46e5;
  box-shadow: 0 2px 8px rgba(79,70,229,0.35);
  cursor: grab;
}

.prc-slider-ticks {
  display: flex;
  justify-content: space-between;
  margin-top: 0.25rem;
}

.prc-slider-ticks span {
  font-size: 0.63rem;
  color: #94a3b8;
  font-weight: 500;
}

.prc-plan-popular {
  position: relative;
  overflow: visible;
}

.prc-popular-badge {
  display: block;
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  padding: 0.12rem 0.5rem;
  border-radius: 999px;
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  white-space: nowrap;
  background: linear-gradient(135deg, #f59e0b 0%, #f97316 100%);
  color: #ffffff;
  box-shadow: 0 2px 8px rgba(245,158,11,0.45);
}

.prc-plan-discount {
  font-weight: 700 !important;
  color: #16a34a !important;
}

.prc-plan-btn.is-active .prc-plan-discount,
.prc-plan-btn.prc-plan-active .prc-plan-discount {
  color: #15803d !important;
}

.prc-animated-val {
  transition: color 0.15s ease;
}

.prc-animated-val.prc-val-flash {
  color: #4f46e5 !important;
}

.prc-saving-band {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.45rem 0.9rem;
  background: linear-gradient(90deg, #ecfdf5 0%, #f0fdf4 100%);
  border-top: 1px solid #bbf7d0;
  color: #15803d;
  font-size: 0.78rem;
  font-weight: 700;
}

.prc-saving-band svg {
  flex-shrink: 0;
  color: #16a34a;
}

.prc-panel {
  animation: prcPanelIn 0.22s ease forwards;
}

@keyframes prcPanelIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

.prc-trust {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.25rem 0.85rem;
  padding: 0.55rem 0 0.1rem;
}

.prc-trust span {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.68rem;
  font-weight: 600;
  color: #94a3b8;
  white-space: nowrap;
}

.prc-trust svg {
  flex-shrink: 0;
  color: #a5b4fc;
}

.prc-trust-sms svg {
  color: #6ee7b7;
}

.prc-trust-sms span {
  color: #7c3aed;
  opacity: 0.75;
}

.prc-result-card-sms {
  border-right: none !important;
}

.prc-result-row + .prc-result-row {
  border-top: 1px solid #e8edf5;
}

.prc-results-sms .prc-result-row {
  border-top: 1px solid #e8edf5;
}

@media (max-width: 480px) {
  .prc-popular-badge {
    font-size: 0.55rem;
    padding: 0.1rem 0.38rem;
    top: -8px;
  }

  .prc-trust {
    gap: 0.2rem 0.6rem;
  }

  .prc-slider-ticks span:not(:first-child):not(:last-child) {
    display: none;
  }
}

.prc-result-total,
.prc-result-card-val,
.prc-result-total-sms {
  transition: opacity 0.12s ease;
}

.prc-val-updating {
  opacity: 0.35;
}

.prc-suggestion {
  display: flex;
  align-items: center;
  gap: 0.42rem;
  padding: 0.48rem 0.85rem;
  border-radius: 10px;
  background: linear-gradient(135deg, #fffbeb 0%, #fef9c3 100%);
  border: 1px solid #fde68a;
  font-size: 0.76rem;
  font-weight: 700;
  color: #92400e;
  animation: prcSuggestionIn 0.3s ease forwards;
}

@keyframes prcSuggestionIn {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

.prc-suggestion svg {
  flex-shrink: 0;
  color: #f59e0b;
}

.prc-widget {
  transition: box-shadow 0.3s ease;
}

.prc-widget:hover {
  box-shadow:
    0 0 0 1px rgba(99,102,241,0.14) inset,
    0 28px 72px rgba(0,0,0,0.50),
    0 4px 20px rgba(79,70,229,0.22),
    0 0 40px -10px rgba(99,102,241,0.3);
}

.prc-widget::before {
  content: "";
  pointer-events: none;
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(99,102,241,0.04) 0%, transparent 50%);
  opacity: 0;
  transition: opacity 0.35s ease;
  z-index: 0;
}

.prc-widget:hover::before {
  opacity: 1;
}

.prc-widget {
  position: relative;
}

.prc-tabs,
.prc-panel {
  position: relative;
  z-index: 1;
}

.prc-particles-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
  opacity: 0.55;
}

.prc-live-info {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  animation: prcSuggestionIn 0.35s ease forwards;
}

.prc-daily-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.prc-daily-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.32rem 0.75rem;
  border-radius: 999px;
  background: rgba(99,102,241,0.18);
  border: 1px solid rgba(99,102,241,0.35);
  font-size: 0.72rem;
  font-weight: 600;
  color: #c7d2fe;
}

.prc-daily-pill svg {
  color: #818cf8;
  flex-shrink: 0;
}

.prc-daily-pill strong {
  font-weight: 800;
  color: #e0e7ff;
}

.prc-social-proof {
  display: flex;
  align-items: center;
  gap: 0.38rem;
  font-size: 0.68rem;
  color: #94a3b8;
  font-weight: 500;
}

.prc-social-proof strong {
  color: #e2e8f0;
  font-weight: 800;
}

.prc-social-avatars {
  display: flex;
  align-items: center;
}

.prc-avatar {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,0.15);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.55rem;
  font-weight: 800;
  color: #fff;
  margin-left: -5px;
  flex-shrink: 0;
}

.prc-avatar:first-child {
  margin-left: 0;
}

.prc-chart {
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.05);
  padding: 0.9rem 1rem 0.75rem;
  backdrop-filter: blur(4px);
}

.prc-chart-title {
  margin: 0 0 0.65rem;
  font-size: 0.67rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: #64748b;
}

.prc-chart-bars {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.prc-chart-row {
  display: grid;
  grid-template-columns: 34px 1fr 70px;
  align-items: center;
  gap: 0.6rem;
}

.prc-chart-label {
  font-size: 0.65rem;
  font-weight: 700;
  color: #94a3b8;
  text-align: right;
  white-space: nowrap;
}

.prc-chart-track {
  height: 9px;
  border-radius: 999px;
  background: rgba(255,255,255,0.08);
  overflow: hidden;
}

.prc-chart-bar {
  height: 100%;
  border-radius: 999px;
  transition: width 0.55s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.prc-chart-bar-6  { background: linear-gradient(90deg, #f87171, #ef4444); }
.prc-chart-bar-12 { background: linear-gradient(90deg, #818cf8, #6366f1); }
.prc-chart-bar-24 { background: linear-gradient(90deg, #34d399, #059669); }

.prc-chart-val {
  font-size: 0.66rem;
  font-weight: 800;
  color: #cbd5e1;
  text-align: right;
  white-space: nowrap;
}

.prc-chart-note {
  margin: 0.5rem 0 0;
  font-size: 0.6rem;
  color: #475569;
  font-style: italic;
}

.prc-widget {
  width: 460px;
}

.prc-slider-wrap {
  position: relative;
  padding-top: 22px;
}

.prc-slider-tooltip {
  position: absolute;
  top: 0;
  left: 0;
  transform: translateX(-50%);
  background: linear-gradient(135deg, #4f46e5 0%, #6366f1 100%);
  color: #ffffff;
  font-size: 0.7rem;
  font-weight: 800;
  padding: 0.18rem 0.55rem;
  border-radius: 8px;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s ease;
  letter-spacing: 0.02em;
  box-shadow: 0 4px 10px rgba(79, 70, 229, 0.4);
  z-index: 10;
}

.prc-slider-tooltip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 4px solid transparent;
  border-top-color: #6366f1;
}

.prc-slider-tooltip.prc-tooltip-visible {
  opacity: 1;
}

.prc-input-unit-wrap {
  position: relative;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.prc-input-unit-wrap .prc-input-compact {
  padding-right: 2.4rem;
}

.prc-input-unit {
  position: absolute;
  right: 0.55rem;
  font-size: 0.62rem;
  font-weight: 700;
  color: #94a3b8;
  letter-spacing: 0.03em;
  pointer-events: none;
  white-space: nowrap;
}

.prc-plan-total {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.67rem;
  font-weight: 700;
  color: #475569;
  line-height: 1;
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: opacity 0.3s ease, max-height 0.3s ease, margin-top 0.3s ease;
}

.prc-plan-total.prc-plan-total-visible {
  max-height: 20px;
  opacity: 1;
}

.prc-plan-btn.is-active .prc-plan-total,
.prc-plan-btn.prc-plan-active .prc-plan-total {
  color: #4338ca;
  font-weight: 800;
}

.prc-res-label-row {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.12rem;
}

.prc-res-saving-pct {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  background: rgba(52, 211, 153, 0.18);
  color: #34d399;
  border: 1px solid rgba(52, 211, 153, 0.32);
  white-space: nowrap;
  animation: prcSuggestionIn 0.3s ease forwards;
}

.prc-res-period {
  display: block;
  margin-top: 0.12rem;
  font-size: 0.6rem;
  font-weight: 600;
  color: rgba(148, 163, 184, 0.7);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  min-height: 0.85rem;
}

.prc-panel-results-col .prc-result-total {
  font-size: 1.65rem;
}

.prc-panel-results-col .prc-saving-band {
  font-size: 0.76rem;
}

@media (max-width: 880px) {
  .prc-widget {
    width: 100%;
    max-width: none;
  }
}

@media (max-width: 480px) {
  .prc-widget {
    width: 100%;
  }

  .prc-slider-wrap {
    padding-top: 20px;
  }
}

.alacak-intro-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 5rem;
  align-items: center;
}

#alacak-yonetimi .alacak-content {
  margin-left: 0;
  order: 1;
}

#bankalar-sms .alacak-content {
  margin-left: -8%;
  order: 1;
}

#bankalar-sms .alacak-intro-grid {
  gap: 4rem;
}

.alacak-dot {
  background: #2E6EEF !important;
  box-shadow: 0 0 0 4px rgba(46, 110, 239, 0.2) !important;
  animation: comm-dot-pulse 1.4s ease-out infinite !important;
}

.alacak-heading-highlight {
  display: inline-block;
  margin-top: 0.08em;
  background: linear-gradient(120deg, #2563eb 0%, #3b82f6 45%, #60a5fa 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.alacak-check {
  color: #4f46e5;
}

.alacak-check-red {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  min-width: 1.25rem;
  border-radius: 9999px;
  background: radial-gradient(circle at 30% 20%, #6366f1, #4f46e5);
  box-shadow: 0 12px 30px rgba(79, 70, 229, 0.45);
  color: #ffffff;
}

.alacak-check-red svg {
  width: 0.75rem;
  height: 0.75rem;
  stroke: #ffffff;
}

.alacak-badge {
  background: #eef2ff !important;
  color: #4338ca !important;
  border: 1px solid #c7d2fe !important;
}

.alacak-intro-mockup-wrap {
  position: relative;
  display: flex;
  justify-content: center;
  order: 0;
  align-items: center;
}

@media (max-width: 1023px) {
  .alacak-intro-mockup-wrap.banks-visual {
    display: flex !important;
    justify-content: center;
    width: fit-content;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    overflow: visible;
    min-height: 0;
  }

  #bankalar-sms .banks-hub {
    width: 300px;
    height: 300px;
    transform: none;
    flex-shrink: 0;
  }

  
  #bankalar-sms .banks-hub-center {
    width: 96px;
    height: 96px;
    padding: 14px;
    animation: none;
  }

  #bankalar-sms .banks-hub-item {
    width: 56px;
    height: 56px;
    margin: -28px 0 0 -28px;
  }

  #bankalar-sms .banks-hub-logo {
    padding: 5px;
  }

  #bankalar-sms .banks-visual {
    padding: 0;
    margin: 0;
    width: fit-content;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 480px) {
  #bankalar-sms .banks-hub {
    width: 260px;
    height: 260px;
  }

  #bankalar-sms .banks-hub-center {
    width: 80px;
    height: 80px;
    padding: 12px;
    animation: none;
  }

  #bankalar-sms .banks-hub-item {
    width: 46px;
    height: 46px;
    margin: -23px 0 0 -23px;
  }
}

[data-alacak-mockup-anim] {
  opacity: 0;
  transform: translateX(60px);
  transition: opacity 0.65s cubic-bezier(0.22,1,0.36,1), transform 0.65s cubic-bezier(0.22,1,0.36,1);
}

#alacak-yonetimi.comm-anim-visible [data-alacak-mockup-anim] {
  opacity: 1;
  transform: translateX(0);
  transition-delay: 0.25s;
}

[data-banka-mockup-anim] {
  opacity: 0;
  transform: translateX(60px);
  transition: opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1), transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}

#bankalar-sms.comm-anim-visible [data-banka-mockup-anim] {
  opacity: 1;
  transform: translateX(0);
  transition-delay: 0.25s;
}

.alacak-intro-glow {
  position: absolute;
  width: 340px;
  height: 340px;
  background: radial-gradient(ellipse at 50% 50%, rgba(46,110,239,0.13) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
  border-radius: 50%;
}

.alacak-intro-browser {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 560px;
  border-radius: 12px;
  background: #fff;
  box-shadow:
    0 4px 6px -1px rgba(0,0,0,0.07),
    0 10px 32px -4px rgba(46,110,239,0.12),
    0 0 0 1px rgba(0,0,0,0.06);
  overflow: hidden;
}

.alacak-intro-bar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 1rem;
  background: #f1f5f9;
  border-bottom: 1px solid #e2e8f0;
}

.alacak-intro-dots {
  display: flex;
  gap: 5px;
  flex-shrink: 0;
}

.alacak-bdot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}

.alacak-bdot-red    { background: #ff5f57; }
.alacak-bdot-yellow { background: #febc2e; }
.alacak-bdot-green  { background: #28c840; }

.alacak-intro-url {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.72rem;
  color: #64748b;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  padding: 0.3rem 0.75rem;
  flex: 1;
  max-width: 220px;
}

.alacak-intro-panel {
  padding: 1rem 1.1rem 0.6rem;
  background: #f8fafc;
}

.alacak-intro-header {
  background: #1e293b;
  border-radius: 8px 8px 0 0;
  padding: 0.7rem 1rem;
  margin: -1rem -1.1rem 0;
}

.alacak-intro-title-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.alacak-intro-icon {
  width: 34px;
  height: 34px;
  background: rgba(99, 102, 241, 0.2);
  color: #a5b4fc;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  flex-shrink: 0;
}

.alacak-intro-ptitle {
  font-size: 0.9rem;
  font-weight: 700;
  color: #f1f5f9;
  margin: 0;
}

.alacak-intro-psub {
  font-size: 0.7rem;
  color: #94a3b8;
  margin: 0.1rem 0 0;
}

.alacak-intro-back {
  margin-left: auto;
  background: #334155;
  border: none;
  color: #cbd5e1;
  font-size: 0.67rem;
  border-radius: 6px;
  padding: 0.35rem 0.7rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.3rem;
  white-space: nowrap;
}

.alacak-debtor-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 0 0 8px 8px;
  padding: 0.75rem 1rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 0.5rem;
}

@keyframes alacak-card-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.alacak-card-anim {
  animation: alacak-card-in 0.5s cubic-bezier(0.22,1,0.36,1) 0.4s both;
}

.alacak-debtor-left {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  flex-shrink: 0;
}

.alacak-daire-badge {
  background: #1e293b;
  color: #f1f5f9;
  font-size: 0.6rem;
  text-align: center;
  padding: 0.35rem 0.55rem;
  border-radius: 6px;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.alacak-daire-badge strong {
  display: block;
  font-size: 1rem;
  font-weight: 800;
}

.alacak-debtor-name {
  font-size: 0.82rem;
  font-weight: 700;
  color: #1e293b;
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.alacak-debtor-phone {
  font-size: 0.7rem;
  color: #64748b;
  margin-top: 0.15rem;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.alacak-debtor-center {
  flex: 1;
  text-align: center;
}

.alacak-amount {
  font-size: 1.05rem;
  font-weight: 800;
  color: #e74c3c;
  
}

.alacak-amount-label {
  font-size: 0.65rem;
  color: #94a3b8;
  margin-top: 0.1rem;
}

.alacak-debtor-right {
  flex-shrink: 0;
  text-align: right;
}

.alacak-last-contact {
  font-size: 0.67rem;
  color: #94a3b8;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.alacak-counters {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  padding: 0.5rem 0;
  border-bottom: 1px solid #e2e8f0;
  margin-bottom: 0.5rem;
}

@keyframes alacak-counters-in {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

.alacak-counters-anim {
  animation: alacak-counters-in 0.5s cubic-bezier(0.22,1,0.36,1) 0.55s both;
}

.alacak-counter {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.67rem;
  font-weight: 600;
  padding: 0.25rem 0.55rem;
  border-radius: 5px;
  border: 1px solid transparent;
}

.alacak-counter-green  { background: #f0fdf4; color: #16a34a; border-color: #bbf7d0; }
.alacak-counter-blue   { background: #eff6ff; color: #2563eb; border-color: #bfdbfe; }
.alacak-counter-red    { background: #fef2f2; color: #dc2626; border-color: #fecaca; }
.alacak-counter-gray   { background: #f8fafc; color: #475569; border-color: #e2e8f0; }

.alacak-action-btns {
  margin-left: auto;
  display: flex;
  gap: 0.35rem;
  flex-wrap: wrap;
}

.alacak-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.65rem;
  font-weight: 600;
  padding: 0.28rem 0.6rem;
  border-radius: 5px;
  border: none;
  cursor: pointer;
  color: #fff;
  white-space: nowrap;
}

.alacak-btn-green  { background: #16a34a; }
.alacak-btn-blue   { background: #2563eb; }
.alacak-btn-orange { background: #ea580c; }
.alacak-btn-yellow { background: #d97706; }

.alacak-timeline {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.alacak-timeline-item {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.42rem 0.5rem;
  border-radius: 6px;
  font-size: 0.67rem;
  color: #475569;
  transition: background 0.15s;
}

.alacak-timeline-item:hover {
  background: #f1f5f9;
}

@keyframes alacak-tl-in {
  from { opacity: 0; transform: translateX(12px); }
  to   { opacity: 1; transform: translateX(0); }
}

.alacak-tl-anim {
  animation: alacak-tl-in 0.4s cubic-bezier(0.22,1,0.36,1) var(--tl-delay, 0.1s) both;
}

.alacak-tl-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.alacak-tl-dot-blue   { background: #3b82f6; }
.alacak-tl-dot-purple { background: #8b5cf6; }
.alacak-tl-dot-green  { background: #22c55e; }

.alacak-tl-time {
  font-size: 0.6rem;
  color: #94a3b8;
  min-width: 36px;
  text-align: center;
  line-height: 1.3;
}

.alacak-tl-type {
  font-weight: 600;
  color: #334155;
  min-width: 60px;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.alacak-tl-desc {
  color: #64748b;
  font-size: 0.63rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
}

@media (max-width: 1024px) {
  
  #faiz-hesaplama.faiz-section {
    padding: 1.75rem 0 calc(1.8rem + clamp(0.35rem, 1.4vw, 0.7rem)) 0;
  }

  #sms.comm-section {
    padding: 1.65rem 0;
  }

  .alacak-section {
    padding: 1.65rem 1rem 1.85rem;
  }

  #alacak-yonetimi.alacak-section {
    padding-top: calc(1.65rem + 2px) !important;
    padding-bottom: 1.65rem !important;
  }

  #bankalar-sms.banks {
    padding: 1rem 0 1.65rem;
  }

  .alacak-intro-grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  #alacak-yonetimi .alacak-content,
  #bankalar-sms .alacak-content {
    margin-left: 0;
    order: -1;
  }

  .alacak-intro-mockup-wrap {
    order: 0;
  }

  .alacak-intro-browser {
    max-width: 100%;
  }
}

@media (max-width: 768px) {
  #bankalar-sms {
    overflow-x: hidden;
  }
}

@media (max-width: 768px) {
  #faiz-hesaplama.faiz-section {
    padding: 1.65rem 0 calc(1.7rem + clamp(0.3rem, 1.3vw, 0.65rem)) 0;
  }

  #bankalar-sms .comm-inner {
    padding: 0 1rem;
  }

  #bankalar-sms .comm-heading {
    font-size: 1.75rem;
    line-height: 1.2;
  }

  #bankalar-sms .comm-desc {
    font-size: 0.9375rem;
    max-width: 100%;
  }

  #bankalar-sms .comm-list {
    gap: 0.6rem;
  }

  #bankalar-sms .comm-list-item {
    font-size: 0.9rem;
    align-items: flex-start;
  }

  #bankalar-sms .comm-list-item-highlight {
    padding: 0.9rem 1rem 0.9rem 1rem;
    margin-left: 0;
    margin-right: 0;
  }

  #bankalar-sms .comm-feature-title-row {
    flex-wrap: wrap;
    gap: 0.4rem;
  }

  #bankalar-sms .comm-feature-desc {
    font-size: 0.8125rem;
  }

  
  #alacak-yonetimi .alacak-intro-grid,
  #bankalar-sms .alacak-intro-grid {
    gap: 1.125rem;
  }

  
  #alacak-yonetimi.alacak-section {
    padding-top: calc(1.05rem + 2px) !important;
    padding-bottom: 1.05rem !important;
  }

  #sms.comm-section {
    padding: 1.2rem 0;
  }

  #bankalar-sms.banks {
    padding: 0.85rem 0 1.45rem;
  }

  #alacak-yonetimi .comm-content.alacak-content,
  #bankalar-sms .comm-content.alacak-content {
    gap: 1.2rem;
  }
}

@media (max-width: 640px) {
  .alacak-counters {
    flex-direction: column;
    align-items: flex-start;
  }

  .alacak-action-btns {
    margin-left: 0;
  }

  .alacak-debtor-card {
    flex-wrap: wrap;
  }

  
  #alacak-yonetimi.alacak-section {
    padding-top: calc(0.95rem + 2px) !important;
    padding-bottom: 0.95rem !important;
  }

  #sms.comm-section {
    padding: 1.05rem 0;
  }

  #bankalar-sms.banks {
    padding: 0.65rem 0 1.25rem;
  }

  #alacak-yonetimi .alacak-intro-grid,
  #bankalar-sms .alacak-intro-grid {
    gap: 0.875rem;
  }
}

.alm-floating-badge {
  position: absolute;
  top: -20px;
  left: 18px;
  z-index: 20;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  background: #fff;
  border: 2px solid #c7d2fe;
  border-radius: 999px;
  padding: 0.55rem 1.2rem 0.55rem 0.8rem;
  box-shadow: 0 8px 28px rgba(46,110,239,0.18), 0 2px 8px rgba(0,0,0,0.07);
  font-size: 0.92rem;
  font-weight: 700;
  color: #3730a3;
  opacity: 0;
  transform: translateY(8px) scale(0.92);
  transition: none;
  pointer-events: none;
}

.alm-floating-badge.alm-badge-show {
  animation: alm-badge-in 3.2s cubic-bezier(0.22,1,0.36,1) forwards;
}

@keyframes alm-badge-in {
  0%   { opacity: 0; transform: translateY(8px) scale(0.92); }
  12%  { opacity: 1; transform: translateY(0) scale(1); }
  78%  { opacity: 1; transform: translateY(0) scale(1); }
  100% { opacity: 0; transform: translateY(-6px) scale(0.94); }
}

.alm-floating-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #4f46e5;
  box-shadow: 0 0 0 4px rgba(79,70,229,0.2);
  animation: alm-dot-ping 1.2s ease-out infinite;
  flex-shrink: 0;
}

@keyframes alm-dot-ping {
  0%   { box-shadow: 0 0 0 0 rgba(79,70,229,0.4); }
  70%  { box-shadow: 0 0 0 6px rgba(79,70,229,0); }
  100% { box-shadow: 0 0 0 0 rgba(79,70,229,0); }
}

.alm-counters-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.35rem;
  padding: 0.45rem 0;
  border-bottom: 1px solid #e2e8f0;
  margin-bottom: 0.35rem;
  flex-wrap: nowrap;
  overflow: hidden;
}

.alm-counters {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  flex-wrap: wrap;
}

.alm-counter {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.6rem;
  font-weight: 700;
  padding: 0.18rem 0.4rem;
  border-radius: 5px;
  border: 1.5px solid transparent;
  transition: transform 0.15s, box-shadow 0.15s;
  white-space: nowrap;
  flex-shrink: 0;
}

.alm-counter-green  { background: #f0fdf4; color: #16a34a; border-color: #bbf7d0; }
.alm-counter-blue   { background: #eff6ff; color: #2563eb; border-color: #bfdbfe; }
.alm-counter-purple { background: #f5f3ff; color: #7c3aed; border-color: #ddd6fe; }
.alm-counter-gray   { background: #f8fafc; color: #475569; border-color: #e2e8f0; }

@keyframes alm-counter-bump {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.22); box-shadow: 0 0 0 4px rgba(79,70,229,0.18); }
  100% { transform: scale(1); box-shadow: none; }
}

.alm-counter-bump {
  animation: alm-counter-bump 0.45s cubic-bezier(0.34,1.56,0.64,1) forwards;
}

.alm-action-btns {
  display: flex;
  gap: 0.28rem;
  flex-wrap: nowrap;
  flex-shrink: 0;
}

.alm-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.6rem;
  font-weight: 600;
  padding: 0.22rem 0.5rem;
  border-radius: 5px;
  border: none;
  cursor: pointer;
  color: #fff;
  white-space: nowrap;
  transition: transform 0.15s, filter 0.15s, box-shadow 0.15s;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}

.alm-btn::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0);
  transition: background 0.2s;
}

.alm-btn:hover { transform: translateY(-1px); filter: brightness(1.08); }
.alm-btn:active { transform: scale(0.96); }

.alm-btn-green  { background: #16a34a; box-shadow: 0 2px 8px rgba(22,163,74,0.3); }
.alm-btn-blue   { background: #2563eb; box-shadow: 0 2px 8px rgba(37,99,235,0.3); }
.alm-btn-orange { background: #ea580c; box-shadow: 0 2px 8px rgba(234,88,12,0.3); }
.alm-btn-yellow { background: #d97706; box-shadow: 0 2px 8px rgba(217,119,6,0.3); }

@keyframes alm-btn-flash {
  0%   { filter: brightness(1) }
  30%  { filter: brightness(1.35) }
  100% { filter: brightness(1) }
}

.alm-btn-active {
  animation: alm-btn-flash 0.55s ease forwards;
}

.alm-timeline {
  display: flex;
  flex-direction: column;
  gap: 0;
  overflow: hidden;
  max-height: 200px;
}

.alm-tl-item {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.38rem 0.45rem;
  border-radius: 6px;
  font-size: 0.66rem;
  color: #475569;
  transition: background 0.15s;
  opacity: 0;
  transform: translateX(16px);
}

.alm-tl-item.alm-tl-visible {
  animation: alm-tl-enter 0.42s cubic-bezier(0.22,1,0.36,1) forwards;
}

.alm-tl-item.alm-tl-new {
  animation: alm-tl-new-enter 0.5s cubic-bezier(0.22,1,0.36,1) forwards;
}

@keyframes alm-tl-enter {
  from { opacity: 0; transform: translateX(16px); }
  to   { opacity: 1; transform: translateX(0); }
}

@keyframes alm-tl-new-enter {
  0%   { opacity: 0; transform: translateY(-20px) scale(0.95); max-height: 0; }
  30%  { max-height: 40px; }
  100% { opacity: 1; transform: translateY(0) scale(1); max-height: 40px; }
}

.alm-tl-item:hover { background: #f1f5f9; }

.alm-tl-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
  position: relative;
}

.alm-tl-dot.alm-dot-live::after {
  content: '';
  position: absolute;
  inset: -3px;
  border-radius: 50%;
  border: 2px solid currentColor;
  opacity: 0;
  animation: alm-live-ring 1.2s ease-out 2;
}

@keyframes alm-live-ring {
  0%   { opacity: 0.7; transform: scale(0.6); }
  100% { opacity: 0;   transform: scale(2); }
}

.alm-dot-blue   { background: #3b82f6; color: #3b82f6; }
.alm-dot-purple { background: #8b5cf6; color: #8b5cf6; }
.alm-dot-green  { background: #22c55e; color: #22c55e; }
.alm-dot-orange { background: #f97316; color: #f97316; }

.alm-tl-time {
  font-size: 0.59rem;
  color: #94a3b8;
  min-width: 34px;
  text-align: center;
  line-height: 1.35;
  flex-shrink: 0;
}

.alm-tl-type {
  font-weight: 600;
  color: #334155;
  min-width: 62px;
  display: flex;
  align-items: center;
  gap: 0.3rem;
  flex-shrink: 0;
}

.alm-tl-desc {
  color: #64748b;
  font-size: 0.62rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
}

.alm-tl-typing {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.35rem 0.45rem;
  opacity: 0;
  transition: opacity 0.3s;
}

.alm-tl-typing.alm-typing-show {
  opacity: 1;
}

.alm-tl-typing-dots {
  display: flex;
  gap: 3px;
  align-items: center;
}

.alm-tl-typing-dots span {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #94a3b8;
  animation: alm-typing-bounce 1s ease-in-out infinite;
}

.alm-tl-typing-dots span:nth-child(2) { animation-delay: 0.15s; }
.alm-tl-typing-dots span:nth-child(3) { animation-delay: 0.3s; }

@keyframes alm-typing-bounce {
  0%, 60%, 100% { transform: translateY(0); opacity: 0.5; }
  30%           { transform: translateY(-4px); opacity: 1; }
}

@keyframes alm-contact-flash {
  0%   { background: rgba(79,70,229,0.08); }
  100% { background: transparent; }
}

.alm-contact-updated {
  animation: alm-contact-flash 1.2s ease-out forwards;
  border-radius: 4px;
}

@media (max-width: 768px) {
  .alm-floating-badge { left: 10px; font-size: 0.8rem; padding: 0.45rem 1rem 0.45rem 0.7rem; }
  .alm-action-btns { gap: 0.25rem; }
  .alm-btn { font-size: 0.6rem; padding: 0.25rem 0.5rem; }
}

.faiz-section {
  position: relative;
  padding: 2.25rem 0 2.5rem;
  width: 100%;
  box-sizing: border-box;
  
  background: transparent;
}

.faiz-inner {
  max-width: 80rem;
  margin: 0 auto;
  width: 100%;
  padding: 0 1.25rem;
  box-sizing: border-box;
}

.faiz-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 4rem;
  align-items: center;
}

.faiz-content {
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
  order: -1;
  max-width: 32rem;
  width: 100%;
}

#faiz-hesaplama .faiz-content .comm-list-item-highlight {
  margin-left: -1.25rem;
  margin-right: 0;
  width: calc(100% + 1.25rem);
  max-width: none;
  box-sizing: border-box;
  padding: 0.95rem 1.15rem 0.95rem 1.25rem;
  border-radius: 1.15rem;
}

#faiz-hesaplama .faiz-content .comm-list-item-highlight::before {
  border-radius: 1.15rem 0 0 1.15rem;
}

.faiz-heading-hl {
  display: inline-block;
  margin-top: 0.08em;
  background: linear-gradient(120deg, #2563eb 0%, #3b82f6 45%, #60a5fa 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.faiz-mockup-wrap {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.faiz-mockup-wrap[data-faiz-anim] {
  opacity: 0;
  transform: translateX(60px);
  transition: opacity 0.65s cubic-bezier(0.22,1,0.36,1), transform 0.65s cubic-bezier(0.22,1,0.36,1);
}
.faiz-section.comm-anim-visible .faiz-mockup-wrap[data-faiz-anim] {
  opacity: 1;
  transform: translateX(0);
  transition-delay: 0.2s;
}

.faiz-mockup-glow {
  position: absolute;
  width: 360px;
  height: 360px;
  background: radial-gradient(ellipse at 50% 50%, rgba(99,102,241,0.18) 0%, transparent 70%);
  pointer-events: none;
  border-radius: 50%;
  z-index: 0;
}

.faiz-mockup-card {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 500px;
  background: #0f172a;
  border-radius: 20px;
  padding: 1.9rem 1.9rem 1.6rem;
  box-shadow:
    0 0 0 1px rgba(99,102,241,0.18),
    0 8px 40px rgba(15,23,42,0.45),
    0 2px 8px rgba(0,0,0,0.2);
  overflow: hidden;
}

.faiz-mockup-card::before {
  content: '';
  position: absolute;
  top: -60px;
  left: 50%;
  transform: translateX(-50%);
  width: 280px;
  height: 180px;
  background: radial-gradient(ellipse, rgba(99,102,241,0.2) 0%, transparent 70%);
  pointer-events: none;
}

.faiz-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.65rem;
}

.faiz-card-title {
  font-size: 0.75rem;
  font-weight: 700;
  color: rgba(255,255,255,0.7);
  letter-spacing: 0.02em;
}

.faiz-pills {
  display: flex;
  gap: 5px;
  background: rgba(255,255,255,0.05);
  border-radius: 999px;
  padding: 3px;
  border: 1px solid rgba(255,255,255,0.08);
}

.faiz-pill {
  font-size: 0.69rem;
  font-weight: 600;
  padding: 0.22rem 0.75rem;
  border-radius: 999px;
  border: none;
  background: transparent;
  color: rgba(255,255,255,0.45);
  cursor: pointer;
  transition: background 0.25s, color 0.25s, box-shadow 0.25s;
}
.faiz-pill:hover { color: rgba(255,255,255,0.8); }

.faiz-pill-active {
  background: rgba(255,255,255,0.13) !important;
  color: #fff !important;
  box-shadow: 0 1px 6px rgba(0,0,0,0.3);
}

@keyframes faiz-pill-switch {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.07); }
  100% { transform: scale(1); }
}
.faiz-pill-switching {
  animation: faiz-pill-switch 0.3s cubic-bezier(0.34,1.56,0.64,1) forwards;
}

.faiz-mode-desc {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.75rem;
  min-height: 1.6rem;
}

.faiz-mode-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
  background: #a78bfa;
  box-shadow: 0 0 0 3px rgba(167,139,250,0.2);
  animation: faiz-mode-ping 1.6s ease-out infinite;
  transition: background 0.4s;
}
.faiz-mode-dot.basit-dot {
  background: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96,165,250,0.2);
}

@keyframes faiz-mode-ping {
  0%  { box-shadow: 0 0 0 0 rgba(167,139,250,0.4); }
  70% { box-shadow: 0 0 0 7px rgba(167,139,250,0); }
  100%{ box-shadow: 0 0 0 0 rgba(167,139,250,0); }
}

#faiz-mode-text {
  font-size: 0.67rem;
  color: rgba(255,255,255,0.45);
  font-style: italic;
  line-height: 1.4;
  transition: opacity 0.3s;
}

.faiz-chart-wrap {
  position: relative;
  height: 180px;
  margin-bottom: 0.65rem;
}

.faiz-svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.faiz-svg-label {
  font-size: 8px;
  fill: rgba(255,255,255,0.3);
  font-family: inherit;
}

.faiz-svg-diff-label {
  font-size: 7.5px;
  fill: rgba(167,139,250,0.75);
  font-family: inherit;
  font-weight: 600;
}

@keyframes faiz-clip-reveal {
  from { width: 0; }
  to   { width: 300px; }
}

.fgClipAnimating #fgClipRect {
  animation: faiz-clip-reveal 1.4s cubic-bezier(0.4,0,0.2,1) forwards;
}

@keyframes fg-draw-basit {
  to { stroke-dashoffset: 0; }
}
@keyframes fg-draw-bilesik {
  to { stroke-dashoffset: 0; }
}

@keyframes fg-area-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes fg-dot-appear {
  0%   { opacity: 0; r: 2; }
  60%  { opacity: 1; r: 6; }
  100% { opacity: 1; r: 4; }
}

@keyframes fg-dot-float {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-2.5px); }
}

@keyframes fg-ring-pulse {
  0%   { opacity: 0.7; r: 5; }
  100% { opacity: 0;   r: 14; }
}

@keyframes fg-diff-in {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes fg-vline-sweep {
  from { transform: translateX(0); opacity: 0.8; }
  to   { transform: translateX(300px); opacity: 0; }
}

.faiz-legend {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  margin-bottom: 0.75rem;
  flex-wrap: wrap;
}

.faiz-legend-item {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.66rem;
  color: rgba(255,255,255,0.55);
  font-weight: 500;
}

.faiz-legend-line {
  display: inline-block;
  width: 18px;
  height: 2px;
  border-radius: 1px;
  flex-shrink: 0;
}
.faiz-legend-line-blue   { background: linear-gradient(90deg,#38bdf8,#60a5fa); }
.faiz-legend-line-purple {
  background: linear-gradient(90deg,#818cf8,#a78bfa);
  height: 2.5px;
}
.faiz-legend-line-orange {
  background: linear-gradient(90deg,#f97316,#fbbf24);
  height: 2.8px;
}

.faiz-legend-diff {
  font-size: 0.64rem;
  color: rgba(167,139,250,0.75);
  margin-left: auto;
  font-weight: 500;
}
.faiz-legend-diff strong { color: #a78bfa; font-weight: 700; }

.faiz-tooltip { display: none; }

.faiz-summary {
  border-top: 1px solid rgba(255,255,255,0.08);
  padding-top: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.38rem;
}

.faiz-sum-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.7rem;
}

.faiz-sum-key { color: rgba(255,255,255,0.4); font-weight: 500; }
.faiz-sum-val { color: rgba(255,255,255,0.85); font-weight: 600; font-variant-numeric: tabular-nums; transition: color 0.4s; }
.faiz-sum-accent { color: #a78bfa !important; }

.faiz-sum-total {
  border-top: 1px solid rgba(255,255,255,0.08);
  padding-top: 0.38rem;
  margin-top: 0.1rem;
}
.faiz-sum-total .faiz-sum-key { color: rgba(255,255,255,0.65); font-weight: 700; }
.faiz-sum-total .faiz-sum-val { color: #fff; font-size: 0.8rem; }

@keyframes faiz-val-flash {
  0%   { color: rgba(255,255,255,0.85); }
  40%  { color: #a78bfa; }
  100% { color: rgba(255,255,255,0.85); }
}
.faiz-val-flash { animation: faiz-val-flash 0.55s ease forwards; }

@media (max-width: 1024px) {
  .faiz-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .faiz-content { order: 0; }
  .faiz-mockup-wrap { order: 1; }
  .faiz-mockup-card { max-width: 100%; }
}
@media (max-width: 640px) {
  .faiz-section { padding: 1.85rem 0 2.05rem; }
  #faiz-hesaplama.faiz-section {
    padding: 1.85rem 0 calc(2.05rem + clamp(0.45rem, 2vw, 0.75rem)) 0;
  }
  .faiz-mockup-card { padding: 1.1rem 1.1rem 1rem; }
  .faiz-chart-wrap { height: 110px; }
}

#bankalar-sms .banks-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
  padding: 58px;
  margin: -58px;
  z-index: 1;
  position: relative;
}

@media (max-width: 768px) {
  #bankalar-sms .banks-visual {
    
    padding: 0;
    margin: 0;
    max-width: 100%;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 480px) {
  #bankalar-sms .banks-visual {
    padding: 0;
    margin: 0;
  }
}

#bankalar-sms .banks-hub {
  max-width: min(100%, 523px) !important;
  margin: 0 auto !important;
  overflow: visible !important;
}

@media (min-width: 1025px) {
  
  #bankalar-sms .banks-hub {
    transform: translateX(-20%);
  }
}

@media (min-width: 1024px) {
  #bankalar-sms .banks-hub-center {
    width: 142px;
    height: 142px;
    padding: 22px;
  }

  #bankalar-sms .banks-hub-item {
    width: 81px;
    height: 81px;
    margin: -40.5px 0 0 -40.5px;
  }
}

#bankalar-sms .banks-hub-diagram,
#bankalar-sms .banks-hub-orbits {
  overflow: visible !important;
}

#bankalar-sms.banks {
  padding: 1.15rem 0 1.85rem;
  box-sizing: border-box;
}

#faiz-hesaplama .faiz-content [data-comm-anim],
#alacak-yonetimi .alacak-content [data-comm-anim],
#sms .comm-content [data-comm-anim],
#bankalar-sms .alacak-content [data-comm-anim] {
  opacity: 1;
  transform: none;
  transition: none;
}

#faiz-hesaplama.comm-anim-visible .faiz-content [data-comm-anim],
#alacak-yonetimi.comm-anim-visible .alacak-content [data-comm-anim],
#sms.comm-anim-visible .comm-content [data-comm-anim],
#bankalar-sms.comm-anim-visible .alacak-content [data-comm-anim] {
  transition-delay: 0s;
}

#faiz-hesaplama .comm-dot,
#alacak-yonetimi .comm-dot.alacak-dot,
#sms .comm-dot,
#bankalar-sms .comm-dot.alacak-dot {
  animation: none !important;
}

.tgv-bar-btn {
  animation: none;
}

.tgv-row--a,
.tgv-row--b,
.tgv-row--c {
  animation: none;
}

.bnk-row--1,
.bnk-row--2,
.bnk-row--3,
.bnk-row--4 {
  animation: none;
}

.plc-rapor-hub-row {
  animation: none !important;
  opacity: 1;
}

.tg-tablo tr.tg-row-demo-new td {
  animation: none;
}

.tg-tab-count--aidat.tg-tab-count--aidat-anim {
  animation: none;
  opacity: 1;
  transform: scale(1);
}

.setup-step-btn.setup-step-active:not(.setup-step-done) {
  animation: none;
}

.alm-tl-typing-dots span,
.alm-tl-typing-dots span:nth-child(2),
.alm-tl-typing-dots span:nth-child(3) {
  animation: none;
}

.alm-contact-updated {
  animation: none;
}

.alm-btn-active {
  animation: none;
  filter: none;
}

.alm-tl-item.alm-tl-visible,
.alm-tl-item.alm-tl-new {
  animation: none;
  opacity: 1;
  transform: none;
  max-height: none;
}

.alm-tl-dot.alm-dot-live::after {
  animation: none !important;
  opacity: 0;
}

.alm-floating-badge.alm-badge-show {
  animation: none;
  opacity: 1;
  transform: translateY(0) scale(1);
}

.alm-counter-bump {
  animation: none;
  transform: scale(1);
  box-shadow: none;
}

.faiz-val-flash {
  animation: none !important;
}

.atama-kisi-panel:not([hidden]),
.atama-kisi-panel:not([hidden]) .atama-kisi-arama,
.atama-kisi-panel:not([hidden]) .atama-kisi-list-wrap {
  animation: none;
  opacity: 1;
  transform: none;
}

.yeni-kisi-toast,
.yeni-kisi-success-overlay,
.yeni-kisi-success-icon {
  animation: none;
}

.yeni-kisi-fill-pop,
.yeni-kisi-kvkk-press-pop,
.yeni-kisi-kvkk-sent,
.yeni-kisi-kvkk-sending {
  animation: none;
}

.prc-panel,
.prc-suggestion,
.prc-live-info,
.prc-res-saving-pct {
  animation: none;
  opacity: 1;
  transform: none;
}

.alacak-card-anim,
.alacak-counters-anim,
.alacak-tl-anim {
  animation: none;
  opacity: 1;
  transform: none;
}

@media (max-width: 900px) {
  img {
    max-width: 100%;
    height: auto;
  }
}