/**
 * Vitrin landing composite BEM — Next composites/* PHP portu.
 * Scope: .mup-wa-vitrin içinde önizleme + ileride sayfa partial'ları.
 */

/* ── HeroLive ─────────────────────────────────────────────── */

/* --- HeroLive — mark sembolü + iki sütun pitch --- */

.mup-kit__hero-live {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  isolation: isolate;
}

.mup-kit__hero-live__ambient {
  pointer-events: none;
  position: absolute;
  z-index: 0;
  inset: 0;
  overflow: hidden;
}

.mup-kit__hero-live__ambient-grid {
  position: absolute;
  inset: 0;
  opacity: 0.22;
  background-image:
    linear-gradient(color-mix(in srgb, var(--ao-border-subtle) 80%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--ao-border-subtle) 80%, transparent) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(120% 90% at 42% 38%, #000 30%, transparent 78%);
  mask-image: radial-gradient(120% 90% at 42% 38%, #000 30%, transparent 78%);
}

.mup-kit__hero-live__glow {
  position: absolute;
  left: -8%;
  top: -12%;
  height: 78%;
  width: min(760px, 88vw);
  border-radius: 50%;
  background: radial-gradient(
    ellipse 72% 68% at 38% 32%,
    color-mix(in srgb, var(--ao-brand) 11%, transparent) 0%,
    color-mix(in srgb, var(--ao-brand) 5%, transparent) 28%,
    color-mix(in srgb, var(--ao-brand) 2%, transparent) 52%,
    transparent 76%
  );
  filter: blur(42px);
  opacity: 0.92;
  -webkit-mask-image: radial-gradient(ellipse 88% 82% at 38% 34%, #000 18%, transparent 72%);
  mask-image: radial-gradient(ellipse 88% 82% at 38% 34%, #000 18%, transparent 72%);
}

@media (prefers-reduced-motion: no-preference) {
  .mup-kit__hero-live__glow {
    animation: mup-hero-breathe 8s ease-in-out infinite;
  }
}

@keyframes mup-hero-breathe {
  0%, 100% { opacity: 0.88; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.03); }
}

.mup-kit__hero-live__inner {
  position: relative;
  z-index: 10;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  padding: 4.5rem 0 2.5rem;
}

@media (min-width: 1024px) {
  .mup-kit__hero-live__inner {
    gap: 2.75rem;
    padding: 5.25rem 0 3rem;
  }
}

.mup-kit__hero-live__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 2rem;
  align-items: start;
}

@media (min-width: 1024px) {
  .mup-kit__hero-live__grid {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: clamp(2rem, 5vw, 4rem);
    align-items: center;
    max-width: 76rem;
    margin-inline: auto;
    width: 100%;
  }
}

.mup-kit__hero-live__brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  min-width: 0;
}

.mup-kit__hero-live__symbol-frame {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
  line-height: 0;
}

.mup-kit__hero-live__symbol {
  display: block;
  width: clamp(4.75rem, 14vw, 7.25rem);
  height: auto;
  aspect-ratio: 1;
  flex-shrink: 0;
}

.mup-kit__hero-live__symbol-fallback {
  margin-bottom: 0.15rem;
}

.mup-kit__hero-live__symbol-frame::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 0;
  width: 138%;
  height: 138%;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background: radial-gradient(
    circle at 50% 48%,
    color-mix(in srgb, var(--ao-brand) 12%, transparent) 0%,
    color-mix(in srgb, var(--ao-brand) 4%, transparent) 44%,
    transparent 68%
  );
  filter: blur(12px);
  opacity: 0.8;
  pointer-events: none;
}

.mup-kit__hero-live__symbol-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  border-radius: 26%;
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--ao-warm-white, #fff) 5%, transparent),
    0 0 0 1px color-mix(in srgb, var(--ao-brand) 12%, transparent);
  pointer-events: none;
}

.mup-kit__hero-live__symbol,
.mup-kit__hero-live__symbol-fallback {
  position: relative;
  z-index: 1;
  filter: drop-shadow(0 6px 16px color-mix(in srgb, #000 32%, transparent));
}

@media (min-width: 1024px) {
  .mup-kit__hero-live__symbol-frame::before {
    width: 150%;
    height: 150%;
    filter: blur(14px);
    opacity: 0.9;
  }

  .mup-kit__hero-live__symbol-frame::after {
    box-shadow:
      inset 0 1px 0 color-mix(in srgb, var(--ao-warm-white, #fff) 7%, transparent),
      0 0 0 1px color-mix(in srgb, var(--ao-brand) 15%, transparent);
  }

  .mup-kit__hero-live__symbol,
  .mup-kit__hero-live__symbol-fallback {
    filter:
      drop-shadow(0 8px 20px color-mix(in srgb, #000 36%, transparent))
      drop-shadow(0 0 18px color-mix(in srgb, var(--ao-brand) 8%, transparent));
  }
}

.mup-kit__hero-live__title {
  margin: 0;
  min-width: 0;
  max-width: 13ch;
  font-family: var(--ao-font-display);
  font-size: clamp(1.875rem, 5.8vw, 2.875rem);
  font-weight: 600;
  line-height: 1.06;
  letter-spacing: -0.035em;
  color: var(--ao-text-primary);
}

@media (min-width: 1024px) {
  .mup-kit__hero-live__title {
    max-width: 14ch;
    font-size: clamp(2.25rem, 3.2vw, 3rem);
  }
}

.mup-kit__hero-live__emphasis {
  color: var(--ao-brand);
}

.mup-kit__hero-live__subtitle {
  margin: 0;
  font-family: var(--ao-font-body);
  font-size: clamp(1rem, 2.4vw, 1.125rem);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: -0.01em;
  color: var(--ao-text-primary);
}

.mup-kit__hero-live__pitch {
  display: flex;
  flex-direction: column;
  gap: 1.15rem;
  min-width: 0;
}

@media (min-width: 1024px) {
  .mup-kit__hero-live__pitch {
    gap: 1.35rem;
    padding-top: 0.35rem;
  }
}

.mup-kit__hero-live__ritual {
  margin: 0;
  font-family: var(--ao-font-body);
  font-size: clamp(1rem, 2.2vw, 1.125rem);
  font-weight: 500;
  line-height: 1.45;
  color: var(--ao-text-primary);
}

.mup-kit__hero-live__benefits {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.mup-kit__hero-live__benefit {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  min-width: 0;
}

.mup-kit__hero-live__benefit-mark {
  flex-shrink: 0;
  margin-top: 0.2rem;
}

.mup-kit__hero-live__benefit-text {
  font-family: var(--ao-font-body);
  font-size: clamp(0.9375rem, 2vw, 1.0625rem);
  line-height: 1.5;
  color: var(--ao-text-secondary);
}

.mup-kit__hero-live__actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.55rem;
  padding-top: 0.35rem;
}

@media (min-width: 640px) {
  .mup-kit__hero-live__actions {
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
  }
}

.mup-kit__hero-live__actions .mup-kit__button {
  min-height: 2.75rem;
}

@media (min-width: 640px) {
  .mup-kit__hero-live__actions .mup-kit__button--primary {
    min-width: 11rem;
    min-height: 3rem;
  }
  .mup-kit__hero-live__actions .mup-kit__button {
    min-height: 3rem;
  }
}

.mup-kit__hero-live__stats {
  display: flex;
  align-items: stretch;
  gap: 1.25rem;
  margin: 0;
  padding: 1.35rem 0 0;
  border-top: 1px solid var(--ao-border-subtle);
}

@media (min-width: 640px) {
  .mup-kit__hero-live__stats {
    gap: 2rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__hero-live__stats {
    gap: 2.5rem;
    max-width: 76rem;
    margin-inline: auto;
    width: 100%;
    padding-top: 1.75rem;
  }
}

.mup-kit__hero-live__stats > div {
  margin: 0;
  min-width: 0;
}

.mup-kit__hero-live__stat-value {
  margin: 0;
  font-family: var(--ao-font-display);
  font-size: clamp(1.5rem, 4vw, 2rem);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
  color: var(--ao-text-primary);
}

.mup-kit__hero-live__stat-label {
  margin: 0.4rem 0 0;
  max-width: 12rem;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.4;
  color: var(--ao-text-muted);
}

@media (min-width: 640px) {
  .mup-kit__hero-live__stat-label {
    max-width: 14rem;
    font-size: 0.6875rem;
  }
}

.mup-kit__hero-live__stat-rule {
  width: 1px;
  align-self: stretch;
  background: var(--ao-border-strong);
}

.mup-kit__hero-live__headline-row,
.mup-kit__hero-live__stage,
.mup-kit__hero-live__copy,
.mup-kit__hero-live__lead,
.mup-kit__hero-live__stats-mobile,
.mup-kit__hero-live__stats-desktop,
.mup-kit__hero-live__aside {
  display: none !important;
}

.mup-kit__hero-slider {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 0.625rem;
}

@media (min-width: 640px) {
  .mup-kit__hero-slider {
    gap: 0.75rem;
  }
}

.mup-kit__hero-slider__viewport {
  overflow: hidden;
}

.mup-kit__hero-slider__track {
  display: flex;
  touch-action: pan-y;
  will-change: transform;
}

.mup-kit__hero-slider__slide {
  flex: 0 0 100%;
  min-width: 0;
}

.mup-kit__hero-slide {
  position: relative;
  display: block;
  width: 100%;
  height: 20rem;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ao-border-subtle) 80%, transparent);
}

@media (min-width: 640px) {
  .mup-kit__hero-slide {
    height: 22rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__hero-slide {
    height: 24rem;
  }
}

@media (min-width: 1280px) {
  .mup-kit__hero-slide {
    height: 25rem;
  }
}

.mup-kit__hero-slide:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--ao-brand) 50%, transparent);
  outline-offset: 2px;
}

.mup-kit__hero-slide__wash {
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, var(--ao-canvas, var(--ao-bg)) 40%, transparent);
}

.mup-kit__hero-slide__glow {
  pointer-events: none;
  position: absolute;
  inset: 0;
  background: radial-gradient(
    70% 60% at 78% 72%,
    color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 28%, transparent),
    transparent 70%
  );
}

.mup-kit__hero-slide__grid {
  pointer-events: none;
  position: absolute;
  inset: 0;
  opacity: 0.12;
  background-image:
    linear-gradient(color-mix(in srgb, var(--ao-border-subtle) 80%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--ao-border-subtle) 80%, transparent) 1px, transparent 1px);
  background-size: 40px 40px;
  -webkit-mask-image: radial-gradient(80% 70% at 72% 58%, #000 18%, transparent 72%);
  mask-image: radial-gradient(80% 70% at 72% 58%, #000 18%, transparent 72%);
}

.mup-kit__hero-slide__fade {
  pointer-events: none;
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 38%;
  background: linear-gradient(
    to top,
    var(--ao-canvas, var(--ao-bg)),
    color-mix(in srgb, var(--ao-canvas, var(--ao-bg)) 55%, transparent),
    transparent
  );
}

.mup-kit__hero-slide__mast {
  position: absolute;
  inset-inline: 0;
  top: 0;
  z-index: 30;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem 1.25rem;
  padding: 0.85rem 0.85rem 0;
}

@media (min-width: 640px) {
  .mup-kit__hero-slide__mast {
    gap: 1.25rem 1.75rem;
    padding: 1.1rem 1.1rem 0;
  }
}

@media (min-width: 1024px) {
  .mup-kit__hero-slide__mast {
    padding: 1.25rem 1.25rem 0;
  }
}

.mup-kit__hero-slide__package {
  max-width: min(40%, 15rem);
}

.mup-kit__hero-slide__package.mup-kit__package-kunye {
  max-width: min(40%, 15rem);
}

.mup-kit__hero-slide__package .mup-kit__package-kunye__package {
  font-family: var(--ao-font-body);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.1em;
}

@media (min-width: 640px) {
  .mup-kit__hero-slide__package,
  .mup-kit__hero-slide__package.mup-kit__package-kunye {
    max-width: min(38%, 17rem);
  }

  .mup-kit__hero-slide__package .mup-kit__package-kunye__package {
    font-size: 0.6875rem;
    letter-spacing: 0.12em;
  }
}

.mup-kit__hero-slide__badge {
  display: inline-flex;
  min-width: 0;
  max-width: 46%;
  align-items: center;
  gap: 0.375rem;
  font-family: var(--ao-font-body);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-cat-accent, var(--ao-brand));
}

@media (min-width: 640px) {
  .mup-kit__hero-slide__badge {
    max-width: 58%;
    font-size: 0.6875rem;
    letter-spacing: 0.12em;
  }
}

.mup-kit__hero-slide__badge-dot {
  flex-shrink: 0;
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 999px;
  background: var(--ao-cat-accent, var(--ao-brand));
}

.mup-kit__hero-slide__badge-text {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mup-kit__hero-slide__type {
  position: absolute;
  left: 0.75rem;
  /* Mast (paket/kategori + when) altında net nefes — % yerine rem */
  top: 4.85rem;
  z-index: 20;
  min-width: 0;
  max-width: min(62%, 22rem);
}

@media (min-width: 640px) {
  .mup-kit__hero-slide__type {
    left: 1rem;
    top: 5.5rem;
    max-width: min(56%, 28rem);
  }
}

@media (min-width: 1024px) {
  .mup-kit__hero-slide__type {
    left: 1.25rem;
    top: 5.85rem;
    max-width: min(52%, 32rem);
  }
}

.mup-kit__hero-slide .mup-kit__program-stage--hero.mup-kit__program-stage--short .mup-kit__program-stage__title {
  -webkit-line-clamp: 2;
  font-size: 1.875rem;
  line-height: 1.02;
  letter-spacing: -0.04em;
}

@media (min-width: 640px) {
  .mup-kit__hero-slide .mup-kit__program-stage--hero.mup-kit__program-stage--short .mup-kit__program-stage__title {
    font-size: 2.125rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__hero-slide .mup-kit__program-stage--hero.mup-kit__program-stage--short .mup-kit__program-stage__title {
    font-size: clamp(2rem, 2.6vw, 2.625rem);
  }
}

.mup-kit__hero-slide .mup-kit__program-stage--hero.mup-kit__program-stage--mid .mup-kit__program-stage__title {
  -webkit-line-clamp: 3;
  font-size: 1.5rem;
  line-height: 1.06;
  letter-spacing: -0.035em;
}

@media (min-width: 640px) {
  .mup-kit__hero-slide .mup-kit__program-stage--hero.mup-kit__program-stage--mid .mup-kit__program-stage__title {
    font-size: 1.75rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__hero-slide .mup-kit__program-stage--hero.mup-kit__program-stage--mid .mup-kit__program-stage__title {
    font-size: clamp(1.75rem, 2.2vw, 2.25rem);
  }
}

.mup-kit__hero-slide .mup-kit__program-stage--hero.mup-kit__program-stage--long .mup-kit__program-stage__title {
  -webkit-line-clamp: 4;
  font-size: 1.25rem;
  line-height: 1.1;
  letter-spacing: -0.03em;
}

@media (min-width: 640px) {
  .mup-kit__hero-slide .mup-kit__program-stage--hero.mup-kit__program-stage--long .mup-kit__program-stage__title {
    font-size: 1.4375rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__hero-slide .mup-kit__program-stage--hero.mup-kit__program-stage--long .mup-kit__program-stage__title {
    font-size: clamp(1.375rem, 1.8vw, 1.75rem);
  }
}

.mup-kit__hero-slide__cutout {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 10;
  height: 82%;
  width: min(58%, 19rem);
}

@media (min-width: 640px) {
  .mup-kit__hero-slide__cutout {
    width: min(54%, 21rem);
  }
}

.mup-kit__hero-slide__brand {
  position: absolute;
  left: 0.75rem;
  bottom: 0.75rem;
  z-index: 30;
  min-width: 0;
  max-width: 62%;
  transform-origin: bottom left;
  transform: scale(1.08);
}

@media (min-width: 640px) {
  .mup-kit__hero-slide__brand {
    left: 1rem;
    bottom: 1rem;
    max-width: 58%;
    transform: scale(1.1);
  }
}

.mup-kit__instructor-cutout {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}

.mup-kit__instructor-cutout__ring,
.mup-kit__instructor-cutout__ring-inset {
  pointer-events: none;
  position: absolute;
  border-radius: 50%;
}

.mup-kit__instructor-cutout--lg .mup-kit__instructor-cutout__ring,
.mup-kit__instructor-cutout--lg .mup-kit__instructor-cutout__ring-inset {
  left: 8%;
  bottom: 8%;
  width: 13rem;
  height: 13rem;
}

@media (min-width: 640px) {
  .mup-kit__instructor-cutout--lg .mup-kit__instructor-cutout__ring,
  .mup-kit__instructor-cutout--lg .mup-kit__instructor-cutout__ring-inset {
    left: 10%;
    bottom: 10%;
    width: 15rem;
    height: 15rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__instructor-cutout--lg .mup-kit__instructor-cutout__ring,
  .mup-kit__instructor-cutout--lg .mup-kit__instructor-cutout__ring-inset {
    left: 12%;
    bottom: 12%;
    width: 16.5rem;
    height: 16.5rem;
  }
}

.mup-kit__instructor-cutout__ring {
  border: 1.5px solid var(--ao-cat-accent, var(--ao-brand));
  background: color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 18%, transparent);
  box-shadow: 0 0 48px color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 40%, transparent);
}

.mup-kit__instructor-cutout__ring-inset {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 10%, transparent);
}

.mup-kit__instructor-cutout__figure {
  position: absolute;
  inset: 0;
}

.mup-kit__instructor-cutout__img,
.mup-kit__instructor-cutout__fallback {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: var(--mup-portrait-slot-cutout-position, center 85%);
  transform: scale(var(--mup-portrait-program-scale, 1.12)) translateY(var(--mup-portrait-program-translate-y, 12%));
  transform-origin: center bottom;
  filter: drop-shadow(0 16px 28px rgba(0, 0, 0, 0.5));
}

.mup-kit__instructor-cutout__fallback {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  padding: 1.25rem;
  font-family: var(--ao-font-display);
  font-size: 3rem;
  font-weight: 600;
  color: color-mix(in srgb, var(--ao-text-primary) 55%, transparent);
  transform: none;
  filter: none;
}

.mup-kit__instructor-cutout.is-interactive .mup-kit__instructor-cutout__img {
  transition: transform 500ms ease;
}

.mup-kit__hero-slide:hover .mup-kit__instructor-cutout.is-interactive .mup-kit__instructor-cutout__img {
  transform: scale(1.45) translate(-2%, 18%);
}

.mup-kit__hero-slider__controls {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

@media (max-width: 639px) {
  .mup-kit__hero-slider__bar,
  .mup-kit__hero-slider__arrow {
    min-height: 2.75rem;
    height: 2.75rem;
    min-width: 2.75rem;
  }
}

@media (min-width: 640px) {
  .mup-kit__hero-slider__bar,
  .mup-kit__hero-slider__arrow {
    min-height: var(--ao-touch-min, 3rem);
    height: var(--ao-touch-min, 3rem);
    min-width: var(--ao-touch-min, 3rem);
  }
}

@media (min-width: 640px) {
  .mup-kit__hero-slider__controls {
    gap: 0.75rem;
  }
}

.mup-kit__hero-slider__bars {
  display: flex;
  flex: 1;
  min-width: 0;
  align-items: center;
  gap: 0.375rem;
}

.mup-kit__hero-slider__bar {
  position: relative;
  flex: 1;
  min-width: 0;
  min-height: 2.75rem;
  height: 2.75rem;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: pointer;
}

.mup-kit__hero-slider__bar::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: 50%;
  height: 0.25rem;
  transform: translateY(-50%);
  border-radius: 999px;
  background: color-mix(in srgb, var(--ao-night-700, #1c1f2e) 90%, transparent);
  pointer-events: none;
}

.mup-kit__hero-slider__bar-fill {
  position: absolute;
  top: 50%;
  left: 0;
  width: 0;
  height: 0.25rem;
  transform: translateY(-50%);
  border-radius: 999px;
  background: var(--ao-cat-accent, var(--ao-brand));
  transition: width 500ms ease;
  pointer-events: none;
}

.mup-kit__hero-slider__bar.is-active .mup-kit__hero-slider__bar-fill,
.mup-kit__hero-slider__bar[aria-selected="true"] .mup-kit__hero-slider__bar-fill {
  width: 100%;
  opacity: 1;
}

.mup-kit__hero-slider__bar.is-past .mup-kit__hero-slider__bar-fill {
  width: 100%;
  opacity: 0.35;
}

.mup-kit__hero-slider__nav {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 0.15rem;
}

.mup-kit__hero-slider__counter {
  display: none;
  margin-right: 0.25rem;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-cat-accent, var(--ao-brand));
}

@media (min-width: 640px) {
  .mup-kit__hero-slider__counter {
    display: inline;
  }
}

.mup-kit__hero-slider__counter-sep,
.mup-kit__hero-slider__counter > span:last-child {
  color: var(--ao-text-muted);
}

.mup-kit__hero-slider__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  min-width: 2.75rem;
  min-height: 2.75rem;
  padding: 0;
  border: 0;
  border-radius: var(--ao-radius-md, 0.5rem);
  background: transparent;
  color: var(--ao-text-secondary);
  cursor: pointer;
}

@media (min-width: 640px) {
  .mup-kit__hero-slider__arrow {
    width: var(--ao-touch-min, 3rem);
    height: var(--ao-touch-min, 3rem);
    min-width: var(--ao-touch-min, 3rem);
    min-height: var(--ao-touch-min, 3rem);
  }
}

.mup-kit__hero-slider__arrow:hover {
  color: var(--ao-text-primary);
  background: color-mix(in srgb, var(--ao-text-primary) 6%, transparent);
}

.mup-kit__category-rail__head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.mup-kit__category-rail__title,
.mup-kit__category-rail__count {
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__category-rail__count {
  color: var(--ao-brand);
}

.mup-kit__category-rail__rule {
  flex: 1;
  height: 1px;
  background: var(--ao-border-strong);
}

.mup-kit__category-rail__list {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--ao-border-subtle);
}

@media (min-width: 640px) {
  .mup-kit__category-rail__list {
    flex-direction: row;
    flex-wrap: wrap;
  }
}

.mup-kit__category-rail__item {
  border-bottom: 1px solid var(--ao-border-subtle);
}

@media (min-width: 640px) {
  .mup-kit__category-rail__item {
    flex: 1 1 12rem;
    border-bottom: 0;
    border-right: 1px solid var(--ao-border-subtle);
  }

  .mup-kit__category-rail__item:last-child {
    border-right: 0;
  }
}

.mup-kit__category-rail__link {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-height: 3.5rem;
  padding: 1rem 0;
  text-decoration: none;
  color: inherit;
}

@media (min-width: 640px) {
  .mup-kit__category-rail__link {
    padding: 1.25rem 1rem;
  }
}

.mup-kit__category-rail__meta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.mup-kit__category-rail__index {
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.14em;
  color: var(--ao-text-muted);
}

.mup-kit__category-rail__dot {
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 50%;
  background: var(--ao-cat-accent, var(--ao-brand));
}

.mup-kit__category-rail__descriptor {
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ao-cat-accent, var(--ao-brand));
}

.mup-kit__category-rail__name {
  font-family: var(--ao-font-display);
  font-size: 1rem;
  font-weight: 600;
  color: var(--ao-text-primary);
}

.mup-kit__category-rail__link:hover .mup-kit__category-rail__name {
  color: var(--ao-brand);
}

/* ── CatalogHero ────────────────────────────────────────────── */

.mup-kit__catalog-hero {
  position: relative;
  min-width: 0;
  padding: 0.25rem 0 0.5rem;
}

.mup-kit__catalog-hero__clock {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  pointer-events: none;
  user-select: none;
}

@media (min-width: 768px) {
  .mup-kit__catalog-hero__clock {
    display: block;
  }
}

.mup-kit__catalog-hero__clock-time {
  font-size: clamp(2.75rem, 7vw, 4.75rem);
  font-weight: 600;
  letter-spacing: -0.03em;
}

.mup-kit__catalog-hero__clock-time.mup-kit__ritual-clock {
  color: color-mix(in srgb, var(--ao-text-primary) 7%, transparent);
}

.mup-kit__catalog-hero__clock-time.mup-kit__ritual-clock .mup-kit__ritual-clock__colon span {
  background: color-mix(in srgb, var(--ao-amber-400, #f5b94e) 35%, transparent);
}

@media (min-width: 1024px) {
  .mup-kit__catalog-hero__clock-time {
    font-size: clamp(3rem, 6vw, 5.25rem);
  }
}

.mup-kit__catalog-hero__body {
  position: relative;
  z-index: 1;
  min-width: 0;
}

@media (min-width: 768px) {
  .mup-kit__catalog-hero__body {
    padding-right: clamp(5rem, 12vw, 9rem);
  }

  .mup-kit__vitrin-page-hero--split .mup-kit__catalog-hero__body,
  .mup-kit__vitrin-page-hero--split .mup-kit__vitrin-page-hero__main {
    padding-right: 0;
  }
}

.mup-kit__catalog-hero__title {
  margin: 0;
  font-family: var(--ao-font-display);
  font-size: 1.375rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--ao-text-primary);
}

@media (min-width: 1024px) {
  .mup-kit__catalog-hero__title {
    font-size: 1.75rem;
  }
}

.mup-kit__catalog-hero__lead {
  margin: 0.25rem 0 0;
  max-width: 48ch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.875rem;
  color: var(--ao-text-muted);
}

/* ProgramFilterFab styles → kit/vitrin-filter-fab.css (site/WA only) */


/* ── CatalogProgramSection + ProgramShareCard ───────────────── */

.mup-kit__catalog-program__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.75rem;
}

@media (min-width: 640px) {
  .mup-kit__catalog-program__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__catalog-program__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1201px) {
  .mup-kit__catalog-program__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.mup-kit__catalog-program__sentinel {
  width: 100%;
  height: 1px;
  margin-top: 0.5rem;
  pointer-events: none;
}

.mup-kit__catalog-program.is-lazy-pages .mup-kit__program-section-kunye__nav {
  display: none;
}

.mup-kit__catalog-program__fallback-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1rem;
}

.mup-kit__catalog-program--carousel {
  padding-top: 1.5rem;
  border-top: 1px solid var(--ao-border-subtle);
}

@media (min-width: 1024px) {
  .mup-kit__catalog-program--carousel {
    padding-top: 3rem;
  }
}

.mup-kit__catalog-program__carousel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
  min-width: 0;
}

@media (min-width: 640px) {
  .mup-kit__catalog-program__carousel-head {
    margin-bottom: 1.5rem;
  }
}

.mup-kit__catalog-program__carousel-head .mup-kit__program-section-kunye {
  margin-bottom: 0;
  flex: 1 1 auto;
  min-width: 0;
}

.mup-kit__catalog-program--carousel .mup-kit__upcoming-broadcast__stage {
  margin-top: 0;
}

.mup-kit__program-section-kunye {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 0.75rem;
  margin-bottom: 1rem;
}

.mup-kit__program-section-kunye__count {
  margin: 0;
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__program-section-kunye__n {
  font-weight: 600;
  color: var(--ao-text-primary);
  font-variant-numeric: tabular-nums;
}

.mup-kit__program-section-kunye__pages {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.mup-kit__program-section-kunye__page-meta {
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
  font-variant-numeric: tabular-nums;
}

.mup-kit__program-section-kunye__nav {
  display: flex;
  gap: 0.25rem;
}

.mup-kit__program-section-kunye__page {
  display: inline-flex;
  min-width: 1.5rem;
  height: 1.5rem;
  align-items: center;
  justify-content: center;
  border-radius: 0.375rem;
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  text-decoration: none;
  color: var(--ao-text-muted);
}

.mup-kit__program-section-kunye__page.is-active {
  color: var(--ao-text-primary);
  background: var(--ao-bg-subtle);
}

.mup-kit__program-card {
  position: relative;
  display: block;
  height: 22rem;
  min-width: 0;
  overflow: hidden;
  border-radius: 1rem;
  background: var(--ao-canvas);
  text-decoration: none;
  color: inherit;
}

@media (min-width: 640px) {
  .mup-kit__program-card {
    height: auto;
    aspect-ratio: 4 / 5;
  }
}

.mup-kit__program-card__depth {
  pointer-events: none;
  position: absolute;
  inset: 0;
  background:
    radial-gradient(70% 55% at 78% 78%, color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 28%, transparent), transparent 70%),
    linear-gradient(165deg, color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 14%, var(--ao-night-900)) 0%, var(--ao-night-950) 55%, var(--ao-night-950) 100%);
}

.mup-kit__program-card__grid {
  pointer-events: none;
  position: absolute;
  inset: 0;
  opacity: 0.13;
  background-image:
    linear-gradient(color-mix(in srgb, var(--ao-warm-white) 8%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--ao-warm-white) 8%, transparent) 1px, transparent 1px);
  background-size: 1.25rem 1.25rem;
}

.mup-kit__program-card__fade {
  pointer-events: none;
  position: absolute;
  inset: auto 0 0;
  height: 34%;
  background: linear-gradient(to top, var(--ao-canvas), color-mix(in srgb, var(--ao-canvas) 45%, transparent), transparent);
}

.mup-kit__program-card__spine {
  pointer-events: none;
  position: absolute;
  top: 18%;
  bottom: 18%;
  left: 0;
  width: 1px;
  opacity: 0.4;
  background: linear-gradient(180deg, transparent, var(--ao-cat-accent, var(--ao-brand)), transparent);
}

.mup-kit__program-card__mast {
  position: absolute;
  inset: 0 0 auto;
  z-index: 3;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.85rem 0.9rem 0;
  pointer-events: none;
}

.mup-kit__program-card__mast .mup-kit__program-when {
  pointer-events: none;
}

.mup-kit__program-card__surface {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  text-decoration: none;
  color: inherit;
}

.mup-kit__package-kunye {
  display: flex;
  min-width: 0;
  max-width: 58%;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.2rem;
  pointer-events: none;
  text-decoration: none;
  color: inherit;
}

a.mup-kit__package-kunye {
  pointer-events: auto;
  position: relative;
  z-index: 4;
}

a.mup-kit__package-kunye:hover .mup-kit__package-kunye__package,
a.mup-kit__package-kunye:focus-visible .mup-kit__package-kunye__package,
a.mup-kit__package-kunye:hover .mup-kit__package-kunye__topic,
a.mup-kit__package-kunye:focus-visible .mup-kit__package-kunye__topic {
  text-decoration: underline;
}

.mup-kit__package-kunye__package {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-cat-accent, var(--ao-brand));
}

.mup-kit__package-kunye__spine {
  position: relative;
  display: flex;
  min-width: 0;
  max-width: 100%;
  align-items: center;
}

.mup-kit__package-kunye__spine-bar {
  pointer-events: none;
  position: absolute;
  top: 0.1em;
  bottom: 0.1em;
  left: 0.15em;
  width: 1px;
  opacity: 0.55;
  background: linear-gradient(
    180deg,
    var(--ao-cat-accent, var(--ao-brand)) 0%,
    color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 30%, transparent) 100%
  );
}

.mup-kit__package-kunye__topic {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-left: 0.85em;
  font-family: var(--ao-font-mono);
  font-size: 0.5625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 78%, var(--ao-warm-white));
}

.mup-kit__program-card__badge--link {
  pointer-events: auto;
  position: relative;
  z-index: 4;
  text-decoration: none;
}

.mup-kit__program-card__badge--link:hover,
.mup-kit__program-card__badge--link:focus-visible {
  text-decoration: underline;
}

.mup-kit__program-card__badge {
  max-width: 58%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-cat-accent, var(--ao-brand));
}

.mup-kit__program-when {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex-shrink: 0;
  white-space: nowrap;
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__program-when__label {
  color: var(--ao-brand);
}

.mup-kit__program-when.is-tone-live .mup-kit__program-when__label {
  color: var(--ao-live, #ef4444);
}

.mup-kit__program-when.is-tone-muted .mup-kit__program-when__label {
  color: var(--ao-text-secondary, var(--ao-text-muted));
}

.mup-kit__program-when__time {
  font-variant-numeric: tabular-nums;
  color: var(--ao-live, #ef4444);
}

@media (min-width: 640px) {
  .mup-kit__program-when {
    font-size: 0.75rem;
    letter-spacing: 0.1em;
  }
}

.mup-kit__program-card__type {
  position: absolute;
  top: 18%;
  left: 0.9rem;
  z-index: 2;
  max-width: 66%;
}

.mup-kit__program-stage__title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  font-family: var(--ao-font-display);
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.03em;
  color: var(--ao-text-primary);
}

.mup-kit__program-stage--short .mup-kit__program-stage__title {
  -webkit-line-clamp: 2;
  font-size: 1.5rem;
}

.mup-kit__program-stage--long .mup-kit__program-stage__title {
  font-size: 1.05rem;
}

.mup-kit__program-stage__instructor {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

@media (min-width: 640px) {
  .mup-kit__program-stage__instructor {
    gap: 0.375rem;
  }
}

.mup-kit__program-stage__hairline {
  display: block;
  width: 38%;
  max-width: 5.5rem;
  height: 1px;
  margin-top: 0.625rem;
  opacity: 0.7;
  background: linear-gradient(to right, var(--ao-cat-accent, var(--ao-brand)), transparent);
}

@media (min-width: 640px) {
  .mup-kit__program-stage__hairline {
    margin-top: 0.875rem;
  }
}

.mup-kit__program-stage--hero .mup-kit__program-stage__hairline {
  margin-top: 0.625rem;
}

@media (min-width: 640px) {
  .mup-kit__program-stage--hero .mup-kit__program-stage__hairline {
    margin-top: 0.875rem;
  }
}

.mup-kit__program-stage__spine {
  position: relative;
  display: flex;
  min-width: 0;
  margin-top: 0.625rem;
}

@media (min-width: 640px) {
  .mup-kit__program-stage__spine {
    margin-top: 0.75rem;
  }
}

.mup-kit__program-stage__spine-bar {
  pointer-events: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0.35em;
  width: 1px;
  opacity: 0.5;
  background: linear-gradient(
    180deg,
    var(--ao-cat-accent, var(--ao-brand)) 0%,
    color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 35%, transparent) 100%
  );
}

.mup-kit__program-stage__spine .mup-kit__program-stage__instructor {
  padding-left: 1.125em;
}

@media (min-width: 640px) {
  .mup-kit__program-stage__spine .mup-kit__program-stage__instructor {
    padding-left: 1.35em;
  }
}

.mup-kit__program-stage__name {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  min-width: 0;
  font-family: var(--ao-font-display);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: -0.02em;
  color: var(--ao-text-primary);
}

@media (min-width: 640px) {
  .mup-kit__program-stage__name {
    font-size: 1.125rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__program-stage__name {
    font-size: 1.1875rem;
  }
}

.mup-kit__program-stage--size-hero .mup-kit__program-stage__name,
.mup-kit__program-stage--hero .mup-kit__program-stage__name {
  font-family: var(--ao-font-logo, var(--ao-font-display));
  font-size: 0.9375rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

@media (min-width: 640px) {
  .mup-kit__program-stage--size-hero .mup-kit__program-stage__name,
  .mup-kit__program-stage--hero .mup-kit__program-stage__name {
    font-size: 1rem;
  }
}

.mup-kit__program-stage__role {
  display: flex;
  min-width: 0;
  align-items: baseline;
  gap: 0.375rem;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.35;
  color: var(--ao-cat-accent, var(--ao-brand));
}

@media (min-width: 640px) {
  .mup-kit__program-stage__role {
    font-size: 0.625rem;
    letter-spacing: 0.16em;
  }
}

.mup-kit__program-stage--size-hero .mup-kit__program-stage__role,
.mup-kit__program-stage--hero .mup-kit__program-stage__role {
  font-size: 0.5rem;
  letter-spacing: 0.08em;
}

@media (min-width: 640px) {
  .mup-kit__program-stage--size-hero .mup-kit__program-stage__role,
  .mup-kit__program-stage--hero .mup-kit__program-stage__role {
    font-size: 0.625rem;
    letter-spacing: 0.12em;
  }
}

@media (min-width: 1024px) {
  .mup-kit__program-stage--size-hero .mup-kit__program-stage__role,
  .mup-kit__program-stage--hero .mup-kit__program-stage__role {
    font-size: 0.6875rem;
    letter-spacing: 0.14em;
  }
}

.mup-kit__program-stage__role-dash {
  flex-shrink: 0;
  opacity: 0.55;
}

.mup-kit__program-stage__role-text {
  min-width: 0;
  opacity: 0.9;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.mup-kit__program-stage--size-hero .mup-kit__program-stage__role-text,
.mup-kit__program-stage--hero .mup-kit__program-stage__role-text {
  -webkit-line-clamp: 1;
}

@media (min-width: 640px) {
  .mup-kit__program-stage--size-hero .mup-kit__program-stage__role-text,
  .mup-kit__program-stage--hero .mup-kit__program-stage__role-text {
    -webkit-line-clamp: 2;
  }
}

.mup-kit__program-card__cutout {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 1;
  width: 62%;
  height: 72%;
  pointer-events: none;
}

.mup-kit__program-card__ring {
  position: absolute;
  left: 4%;
  bottom: 10%;
  z-index: 0;
  width: 12.5rem;
  height: 12.5rem;
  border-radius: 50%;
  border: 1.5px solid var(--ao-cat-accent, var(--ao-brand));
  background: color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 18%, transparent);
  box-shadow: 0 0 40px color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 32%, transparent);
}

.mup-kit__program-card__avatar,
.mup-kit__program-card__avatar-fallback {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: var(--mup-portrait-slot-program-position, center 88%);
  transform: scale(var(--mup-portrait-program-scale, 1.12)) translateY(var(--mup-portrait-program-translate-y, 12%));
  transform-origin: center bottom;
  filter: drop-shadow(0 16px 28px rgb(0 0 0 / 0.5));
  transition: transform 0.5s ease;
}

.mup-kit__program-card:hover .mup-kit__program-card__avatar {
  transform: scale(var(--mup-portrait-program-scale-hover, 1.16)) translate(var(--mup-portrait-program-translate-x-hover, -2%), var(--mup-portrait-program-translate-y, 12%));
}

.mup-kit__program-card__avatar-fallback {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  padding: 1rem;
  font-family: var(--ao-font-display);
  font-size: 2.5rem;
  font-weight: 700;
  color: color-mix(in srgb, var(--ao-text-primary) 35%, transparent);
  transform: none;
  filter: none;
}

.mup-kit__program-card__brand {
  position: absolute;
  left: 0.9rem;
  bottom: 0.9rem;
  z-index: 3;
  max-width: 68%;
}

.mup-kit__catalog-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding: 3.5rem 1rem;
  text-align: center;
}

.mup-kit__catalog-empty__title {
  margin: 0;
  font-family: var(--ao-font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__catalog-empty__lead {
  margin: 0;
  max-width: 36ch;
  font-size: 0.875rem;
  color: var(--ao-text-secondary);
}

/* legacy chip dock kept for older previews — unused on catalog */

.mup-kit__catalog-filter__chip-count {
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  color: var(--ao-text-muted);
}

/* ── CourseHero ─────────────────────────────────────────────── */

.mup-kit__course-hero {
  position: relative;
  min-height: 20rem;
  overflow: hidden;
  border-radius: var(--ao-radius-lg);
}

.mup-kit__course-hero__stage {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 22%, var(--ao-night-900)) 0%,
    var(--ao-night-900) 55%
  );
}

.mup-kit__course-hero__portrait {
  position: absolute;
  top: 0;
  right: -0.35rem;
  bottom: 0;
  z-index: 2;
  width: 54%;
  max-width: 28rem;
  padding: 0 0 0.35rem 0.75rem;
  box-sizing: border-box;
  pointer-events: none;
}

.mup-kit__course-hero__portrait .mup-kit__instructor-portrait {
  display: block;
  width: 100%;
  height: 100%;
}

.mup-kit__course-hero__portrait .mup-kit__instructor-portrait__media {
  border-radius: 0;
}

.mup-kit__course-hero__body {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 20rem;
  padding: 1.25rem 1.5rem 1.5rem;
  max-width: min(72%, 36rem);
}

.mup-kit__course-hero__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem 0.5rem;
  margin-bottom: 0.75rem;
}

.mup-kit__course-hero__category {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  text-decoration: none;
  color: var(--ao-cat-accent, var(--ao-brand));
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.mup-kit__course-hero__dot {
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 50%;
  background: currentColor;
}

.mup-kit__course-hero__when {
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-brand);
}

.mup-kit__course-hero__topic {
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__course-hero__sep {
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  color: var(--ao-text-muted);
  opacity: 0.55;
}

.mup-kit__course-hero__title {
  margin: 0;
  font-family: var(--ao-font-display);
  font-size: clamp(1.5rem, 4vw, 2.25rem);
  font-weight: 600;
  line-height: 1.08;
  color: var(--ao-text-primary);
}

.mup-kit__course-hero__excerpt {
  margin: 0.75rem 0 0;
  max-width: 36ch;
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--ao-text-secondary);
}

.mup-kit__course-hero__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-top: 1rem;
}

/* Course hero — portre slot (500×500 kare kaynak) */
.mup-kit__course-hero__portrait .mup-kit__instructor-portrait__slab {
  opacity: 0.5;
}

.mup-kit__course-hero__portrait .mup-kit__instructor-portrait__media {
  -webkit-mask-image: linear-gradient(to top, transparent 0%, rgb(0 0 0 / 0.12) 14%, #000 30%, #000 100%);
  mask-image: linear-gradient(to top, transparent 0%, rgb(0 0 0 / 0.12) 14%, #000 30%, #000 100%);
}

.mup-kit__course-hero__portrait .mup-kit__instructor-portrait__img {
  object-fit: contain;
  object-position: right bottom;
  width: auto;
  height: 100%;
  min-height: 18rem;
  max-width: 120%;
  transform: none;
  filter: drop-shadow(0 10px 20px rgb(0 0 0 / 0.35));
}

.mup-kit__course-hero__portrait .mup-kit__instructor-portrait__img.is-remote {
  transform: scale(1.1) translateY(5%);
  transform-origin: right bottom;
}

.mup-kit__course-hero__instructor {
  display: flex;
  min-width: 0;
  max-width: 28rem;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.2rem;
  font-family: var(--ao-font-body);
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--ao-text-primary);
  text-decoration: none;
}

.mup-kit__course-hero__instructor-name {
  color: inherit;
}

a.mup-kit__course-hero__instructor {
  text-decoration: none;
  color: inherit;
}

a.mup-kit__course-hero__instructor:hover .mup-kit__course-hero__instructor-name,
a.mup-kit__course-hero__instructor:focus-visible .mup-kit__course-hero__instructor-name {
  text-decoration: underline;
}

.mup-kit__course-hero__instructor-spine {
  position: relative;
  display: flex;
  min-width: 0;
  max-width: 100%;
  align-items: center;
}

.mup-kit__course-hero__instructor-spine-bar {
  pointer-events: none;
  position: absolute;
  top: 0.15em;
  bottom: 0.15em;
  left: 0.2em;
  width: 1px;
  opacity: 0.55;
  background: linear-gradient(
    180deg,
    var(--ao-cat-accent, var(--ao-brand)) 0%,
    color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 30%, transparent) 100%
  );
}

.mup-kit__course-hero__instructor-role {
  min-width: 0;
  padding-left: 0.95em;
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ao-text-secondary);
}

@media (max-width: 639px) {
  .mup-kit__course-hero {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto 1fr auto;
    grid-template-areas:
      "cat when"
      "title title"
      "excerpt excerpt"
      "foot foot";
    gap: 0.35rem 0.5rem;
    align-items: start;
    min-height: 22rem;
    padding: 0.95rem 0.85rem 0.85rem;
  }

  .mup-kit__course-hero__body {
    display: contents;
    min-height: 0;
    max-width: none;
    padding: 0;
  }

  .mup-kit__course-hero__meta {
    display: contents;
    margin: 0;
  }

  .mup-kit__course-hero__category {
    grid-area: cat;
    position: relative;
    z-index: 3;
    align-self: start;
    justify-self: start;
  }

  .mup-kit__course-hero__when {
    grid-area: when;
    position: relative;
    z-index: 3;
    align-self: start;
    justify-self: end;
    text-align: right;
  }

  .mup-kit__course-hero__title {
    grid-area: title;
    position: relative;
    z-index: 3;
    font-size: clamp(1.15rem, 5.2vw, 1.45rem);
    line-height: 1.12;
    max-width: 72%;
    margin: 0.15rem 0 0;
  }

  .mup-kit__course-hero__excerpt {
    grid-area: excerpt;
    position: relative;
    z-index: 3;
    margin: 0.35rem 0 0;
    font-size: 0.8125rem;
    line-height: 1.5;
    max-width: 72%;
    align-self: start;
  }

  .mup-kit__course-hero__foot {
    grid-area: foot;
    position: relative;
    z-index: 3;
    align-self: end;
    justify-self: start;
    margin: 0.5rem 0 0;
    gap: 0.5rem;
    max-width: 72%;
  }

  .mup-kit__course-hero__instructor {
    font-size: 0.8125rem;
  }

  .mup-kit__course-hero__portrait {
    position: absolute;
    top: 2.5rem;
    right: -1.25rem;
    bottom: -0.85rem;
    left: 30%;
    z-index: 2;
    width: auto;
    max-width: none;
    min-height: 0;
    height: auto;
    margin: 0;
    padding: 0;
    overflow: visible;
  }

  .mup-kit__course-hero__portrait .mup-kit__instructor-portrait {
    height: 100%;
    min-height: 15rem;
    overflow: visible;
  }

  .mup-kit__course-hero__portrait .mup-kit__instructor-portrait__slab {
    display: none;
  }

  .mup-kit__course-hero__portrait .mup-kit__instructor-portrait__glow {
    opacity: 0.32;
    right: -8%;
    bottom: 0;
    top: auto;
    left: 18%;
    width: auto;
    height: 82%;
  }

  .mup-kit__course-hero__portrait .mup-kit__instructor-portrait__media {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    overflow: visible;
    -webkit-mask-image: radial-gradient(
      ellipse 118% 96% at 86% 90%,
      #000 38%,
      rgb(0 0 0 / 0.82) 52%,
      rgb(0 0 0 / 0.35) 68%,
      transparent 82%
    );
    mask-image: radial-gradient(
      ellipse 118% 96% at 86% 90%,
      #000 38%,
      rgb(0 0 0 / 0.82) 52%,
      rgb(0 0 0 / 0.35) 68%,
      transparent 82%
    );
  }

  .mup-kit__course-hero__portrait .mup-kit__instructor-portrait__img,
  .mup-kit__course-hero__portrait .mup-kit__instructor-portrait__img.is-remote {
    position: relative;
    inset: auto;
    flex: 0 0 auto;
    width: auto;
    height: min(100%, 19rem);
    min-height: 15.5rem;
    max-width: 135%;
    max-height: none;
    object-fit: contain;
    object-position: right bottom;
    transform: translateX(6%) translateY(2%);
    transform-origin: right bottom;
  }
}

@media (min-width: 640px) {
  .mup-kit__course-hero {
    min-height: 22rem;
  }

  .mup-kit__course-hero__portrait .mup-kit__instructor-portrait__img {
    min-height: 20rem;
    max-width: 125%;
  }

  .mup-kit__course-hero__portrait .mup-kit__instructor-portrait__img.is-remote {
    transform: scale(1.14) translateY(7%);
    transform-origin: right bottom;
  }
}

@media (min-width: 640px) and (max-width: 900px) {
  .mup-kit__course-hero__body {
    max-width: 54%;
  }

  .mup-kit__course-hero__portrait {
    width: 50%;
    max-width: 24rem;
  }
}

/* ── CourseEnrollPanel ──────────────────────────────────────── */

.mup-kit__course-enroll {
  padding-top: 1rem;
  border-top: 1px solid var(--ao-border-subtle);
}

@media (min-width: 1024px) {
  .mup-kit__course-enroll {
    position: sticky;
    top: 5.5rem;
    padding-top: 0;
    padding-left: 1.5rem;
    border-top: 0;
    border-left: 1px solid var(--ao-border-subtle);
  }
}

.mup-kit__course-enroll__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
}

.mup-kit__course-enroll__kicker {
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__course-enroll .mup-kit__price-tag {
  font-family: var(--ao-font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.mup-kit__course-enroll .mup-kit__btn {
  width: 100%;
  margin-top: 1rem;
}

.mup-kit__course-enroll__package-name {
  margin: 0.2rem 0 0;
  font-family: var(--ao-font-display, var(--ao-font-body));
  font-size: 1.05rem;
  line-height: 1.25;
  color: var(--ao-text-primary);
}

.mup-kit__course-enroll__lead {
  margin: 0.75rem 0 0;
  font-family: var(--ao-font-body);
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--ao-text-secondary);
}

.mup-kit__course-enroll__highlights {
  margin: 0.75rem 0 0;
  padding: 0;
  list-style: none;
}

.mup-kit__course-enroll__highlights li {
  position: relative;
  padding: 0.3rem 0 0.3rem 0.9rem;
  font-family: var(--ao-font-body);
  font-size: 0.8125rem;
  line-height: 1.4;
  color: var(--ao-text-secondary);
}

.mup-kit__course-enroll__highlights li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.7em;
  width: 0.35rem;
  height: 0.35rem;
  border-radius: 50%;
  background: var(--ao-brand);
}

.mup-kit__course-enroll__facts {
  margin: 1.25rem 0 0;
  padding: 1rem 0 0;
  border-top: 1px solid var(--ao-border-subtle);
  list-style: none;
}

.mup-kit__course-enroll__facts li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__course-enroll__facts li::before {
  content: "";
  width: 0.25rem;
  height: 0.25rem;
  border-radius: 50%;
  background: var(--ao-border-strong);
}

.mup-kit__course-enroll__students {
  margin: 1rem 0 0;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__course-enroll__students-count {
  color: var(--ao-text-secondary);
}

/* PricingSection — W3 süre + paket carousel */
.mup-kit__pricing {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  padding: 1.5rem 0;
}

.mup-kit__pricing .mup-kit__section-kunye__title {
  max-width: 18rem;
}

@media (min-width: 640px) {
  .mup-kit__pricing .mup-kit__section-kunye__title {
    max-width: none;
  }
}

.mup-kit__pricing .mup-kit__section-kunye__meta {
  max-width: 9rem;
}

.mup-kit__pricing .mup-kit__section-kunye__accent {
  color: var(--ao-text-on-amber, var(--ao-amber-900));
}

@media (min-width: 640px) {
  .mup-kit__pricing .mup-kit__section-kunye__meta {
    max-width: 12rem;
  }
}

.mup-kit__pricing__lead {
  margin: 0 0 1.25rem;
  max-width: 42rem;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--ao-text-secondary);
}

@media (min-width: 640px) {
  .mup-kit__pricing__lead {
    margin-bottom: 1.5rem;
    font-size: 1rem;
  }
}

.mup-kit__pricing__duration-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.625rem;
  margin-bottom: 1.5rem;
}

@media (min-width: 640px) {
  .mup-kit__pricing__duration-wrap {
    margin-bottom: 2rem;
  }
}

.mup-kit__pricing__duration-label {
  margin: 0;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__pricing__durations {
  display: inline-flex;
  max-width: 100%;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  padding: 0.25rem;
  border: 1px solid var(--ao-border-subtle);
  border-radius: 0.5rem;
}

.mup-kit__pricing__duration {
  min-width: 5.5rem;
  min-height: var(--ao-touch-min, 3rem);
  padding: 0.625rem 0.875rem;
  border: 0;
  border-radius: 0.375rem;
  background: transparent;
  color: var(--ao-text-muted);
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  cursor: pointer;
  transition: color 0.2s ease, background 0.2s ease;
}

@media (min-width: 640px) {
  .mup-kit__pricing__duration {
    min-width: 6.5rem;
    font-size: 0.6875rem;
  }
}

.mup-kit__pricing__duration:hover {
  color: var(--ao-text-secondary);
}

.mup-kit__pricing__duration.is-active {
  background: color-mix(in srgb, var(--ao-brand) 15%, transparent);
  color: var(--ao-brand);
}

.mup-kit__pricing__stage {
  position: relative;
  overflow: hidden;
  border-top: 1px solid var(--ao-border-subtle);
}

.mup-kit__pricing__depth,
.mup-kit__pricing__grid-wash,
.mup-kit__pricing__fade,
.mup-kit__pricing__orb {
  pointer-events: none;
  position: absolute;
}

.mup-kit__pricing__depth {
  inset: 0;
  background:
    radial-gradient(50% 48% at 18% 30%, color-mix(in srgb, var(--ao-brand) 10%, transparent), transparent 70%),
    radial-gradient(48% 44% at 92% 75%, color-mix(in srgb, var(--ao-night-600, #2a3348) 32%, transparent), transparent 68%);
}

.mup-kit__pricing__grid-wash {
  inset: 0;
  opacity: 0.06;
  background-image:
    linear-gradient(var(--ao-border-subtle) 1px, transparent 1px),
    linear-gradient(90deg, var(--ao-border-subtle) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(70% 65% at 75% 50%, #000 12%, transparent 72%);
}

.mup-kit__pricing__fade {
  inset-inline: 0;
  bottom: 0;
  height: 36%;
  background: linear-gradient(
    to top,
    var(--ao-canvas, var(--ao-night-950, #0a0e1a)),
    color-mix(in srgb, var(--ao-canvas, var(--ao-night-950, #0a0e1a)) 35%, transparent),
    transparent
  );
}

.mup-kit__pricing__orb {
  z-index: 1;
  top: 2%;
  right: -10%;
  width: 10rem;
  height: 10rem;
  opacity: 0.2;
  color: var(--ao-brand);
}

@media (min-width: 640px) {
  .mup-kit__pricing__orb {
    top: 4%;
    right: -6%;
    width: 13rem;
    height: 13rem;
    opacity: 0.22;
  }
}

@media (min-width: 1024px) {
  .mup-kit__pricing__orb {
    top: 7%;
    right: 1%;
    width: 15rem;
    height: 15rem;
    opacity: 0.24;
  }
}

.mup-kit__pricing__orb-ring {
  position: absolute;
  inset: 14%;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--ao-brand) 45%, transparent);
  box-shadow: 0 0 36px color-mix(in srgb, var(--ao-brand) 16%, transparent);
}

.mup-kit__pricing__orb-ring::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 10%, transparent);
}

.mup-kit__pricing__orb-mark {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 26%;
  height: 26%;
  transform: translate(-50%, -50%);
}

.mup-kit__pricing__carousel {
  position: relative;
  z-index: 10;
  padding: 0.5rem 0 0 0.75rem;
}

@media (min-width: 640px) {
  .mup-kit__pricing__carousel {
    padding: 0.75rem 0 0 1.25rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__pricing__carousel {
    padding: 1rem 1.5rem 0;
  }
}

.mup-kit__pricing__viewport {
  overflow: hidden;
}

.mup-kit__pricing__track {
  display: flex;
  align-items: stretch;
  gap: 1rem;
  touch-action: pan-y;
}

@media (min-width: 640px) {
  .mup-kit__pricing__track {
    gap: 1.25rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__pricing__track {
    gap: 2rem;
  }
}

@media (min-width: 1280px) {
  .mup-kit__pricing__track {
    gap: 2.5rem;
  }
}

.mup-kit__pricing__slide {
  flex: 0 0 88%;
  min-width: 0;
  display: flex;
}

@media (min-width: 640px) {
  .mup-kit__pricing__slide {
    flex-basis: 70%;
  }
}

@media (min-width: 1024px) {
  .mup-kit__pricing__slide {
    flex-basis: calc((100% - 4rem) / 3);
  }
}

@media (min-width: 1280px) {
  .mup-kit__pricing__slide {
    flex-basis: calc((100% - 5rem) / 3);
  }
}

/* Paket detay — tek kart, carousel yerleşimi tam genişlik */
.mup-kit__pricing--one-package .mup-kit__pricing__slide {
  flex-basis: 100%;
}

.mup-kit__pricing__controls {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 1.5rem;
  padding-right: 0.5rem;
}

@media (min-width: 640px) {
  .mup-kit__pricing__controls {
    gap: 1rem;
    margin-top: 2rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__pricing__controls {
    padding-right: 0;
  }
}

.mup-kit__pricing__tabs {
  display: flex;
  min-width: 0;
  flex: 1;
  align-items: center;
  gap: 0.375rem;
}

.mup-kit__pricing__tab {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  height: 0.25rem;
  overflow: hidden;
  border: 0;
  border-radius: 999px;
  padding: 0;
  background: color-mix(in srgb, var(--ao-night-700, #1c2438) 90%, transparent);
  cursor: pointer;
}

.mup-kit__pricing__tab-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: 0;
  border-radius: inherit;
  background: var(--ao-brand);
  transition: width 0.5s ease;
}

.mup-kit__pricing__tab.is-active .mup-kit__pricing__tab-fill,
.mup-kit__pricing__tab.is-passed .mup-kit__pricing__tab-fill {
  width: 100%;
}

.mup-kit__pricing__tab.is-passed .mup-kit__pricing__tab-fill {
  opacity: 0.35;
}

.mup-kit__pricing__nav {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 0.5rem;
}

.mup-kit__pricing__counter {
  display: none;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-brand);
}

@media (min-width: 640px) {
  .mup-kit__pricing__counter {
    display: inline;
  }
}

.mup-kit__pricing__counter-sep {
  color: var(--ao-text-muted);
}

.mup-kit__pricing__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border: 0;
  border-radius: 0.375rem;
  background: transparent;
  color: var(--ao-text-secondary);
  cursor: pointer;
}

.mup-kit__pricing__arrow:hover:not(:disabled) {
  color: var(--ao-text-primary);
  background: color-mix(in srgb, var(--ao-surface) 50%, transparent);
}

.mup-kit__pricing__arrow:disabled {
  opacity: 0.35;
  cursor: default;
}

.mup-kit__pricing__footer {
  position: relative;
  margin-top: 1.5rem;
  padding: 1.25rem 0.5rem 0 0;
  border-top: 1px solid var(--ao-border-subtle);
}

@media (min-width: 640px) {
  .mup-kit__pricing__footer {
    margin-top: 2rem;
    padding-top: 1.5rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__pricing__footer {
    margin-top: 2.5rem;
  }
}

/* Paket detay — 3/6/12 yan yana (desktop), mobil kaydırmalı satır */
.mup-kit__pricing--single-package .mup-kit__pricing__stage--tiers {
  padding-top: 0;
}

.mup-kit__pricing--single-package .mup-kit__pricing__tier-scroll {
  position: relative;
  z-index: 10;
  padding: 0.5rem 0 0 0.75rem;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  scroll-snap-type: x mandatory;
}

.mup-kit__pricing--single-package .mup-kit__pricing__tier-scroll::-webkit-scrollbar {
  display: none;
}

@media (min-width: 640px) {
  .mup-kit__pricing--single-package .mup-kit__pricing__tier-scroll {
    padding: 0.75rem 0 0 1.25rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__pricing--single-package .mup-kit__pricing__tier-scroll {
    padding: 1rem 1.5rem 0;
    overflow-x: visible;
    scroll-snap-type: none;
  }
}

.mup-kit__pricing__tier-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
  padding: 0.5rem 0.25rem 0;
}

.mup-kit__pricing--single-package .mup-kit__pricing__tier-grid {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 1rem;
  padding: 0 0.75rem 0.25rem 0;
  touch-action: pan-x;
}

.mup-kit__pricing--single-package .mup-kit__plan-tier {
  flex: 0 0 88%;
  min-width: 0;
  scroll-snap-align: start;
}

@media (min-width: 640px) {
  .mup-kit__pricing--single-package .mup-kit__plan-tier {
    flex-basis: 70%;
  }
}

@media (min-width: 768px) {
  .mup-kit__pricing--single-package .mup-kit__pricing__tier-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    padding: 0 0.5rem 0;
  }

  .mup-kit__pricing--single-package .mup-kit__plan-tier {
    flex: none;
    scroll-snap-align: none;
  }
}

@media (min-width: 1024px) {
  .mup-kit__pricing--single-package .mup-kit__pricing__tier-grid {
    gap: 1.25rem;
    padding: 0 0.75rem 0;
  }
}

@media (min-width: 768px) {
  .mup-kit__pricing__tier-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    padding: 0.75rem 0.5rem 0;
  }
}

@media (min-width: 1024px) {
  .mup-kit__pricing__tier-grid {
    gap: 1.25rem;
    padding: 1rem 0.75rem 0;
  }
}

.mup-kit__pricing--single-package .mup-kit__pricing__footer {
  z-index: 10;
  padding-left: 0.75rem;
}

@media (min-width: 640px) {
  .mup-kit__pricing--single-package .mup-kit__pricing__footer {
    padding-left: 1.25rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__pricing--single-package .mup-kit__pricing__footer {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

.mup-kit__plan-tier {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: 1.25rem 1.125rem 1.125rem;
  border: 1px solid var(--ao-border-subtle);
  border-radius: 0.75rem;
  background: color-mix(in srgb, var(--ao-surface, #0f1420) 88%, transparent);
}

.mup-kit__plan-tier.is-highlighted {
  border-color: color-mix(in srgb, var(--ao-brand) 45%, var(--ao-border-subtle));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--ao-brand) 18%, transparent);
}

.mup-kit__plan-tier__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.mup-kit__plan-tier__label {
  margin: 0;
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-secondary);
}

.mup-kit__plan-tier.is-highlighted .mup-kit__plan-tier__label {
  color: var(--ao-brand);
}

.mup-kit__plan-tier__badge {
  flex-shrink: 0;
  padding: 0.2rem 0.45rem;
  border-radius: 999px;
  font-family: var(--ao-font-mono);
  font-size: 0.5625rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ao-text-on-brand);
  background: var(--ao-brand);
}

.mup-kit__plan-tier__price {
  margin: 0;
  font-family: var(--ao-font-display);
  font-size: clamp(1.75rem, 4vw, 2.25rem);
  font-weight: 600;
  line-height: 1.05;
  color: var(--ao-text-primary);
}

.mup-kit__plan-tier__monthly {
  margin: 0.5rem 0 0;
  font-size: 0.875rem;
  color: var(--ao-text-secondary);
}

.mup-kit__plan-tier__features {
  display: grid;
  gap: 0.5rem;
  margin: 1rem 0 0;
  padding: 0;
  list-style: none;
}

.mup-kit__plan-tier__features li {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--ao-text-secondary);
}

.mup-kit__plan-tier__check {
  flex-shrink: 0;
  margin-top: 0.15rem;
  color: var(--ao-text-muted);
}

.mup-kit__plan-tier.is-highlighted .mup-kit__plan-tier__check {
  color: var(--ao-brand);
}

.mup-kit__plan-tier__cta {
  width: 100%;
  margin-top: auto;
  padding-top: 1.25rem;
}

.mup-kit__plan-tier.is-owned .mup-kit__plan-tier__price {
  opacity: 0.65;
}

/* PackageOfferCard */
.mup-kit__package-card {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: 100%;
  min-height: 22rem;
  overflow: hidden;
}

@media (min-width: 640px) {
  .mup-kit__package-card {
    min-height: 24rem;
  }
}

.mup-kit__package-card__spine {
  pointer-events: none;
  position: absolute;
  top: 10%;
  bottom: 12%;
  left: 0;
  width: 1px;
  opacity: 0.35;
  background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--ao-brand) 55%, transparent), transparent);
}

.mup-kit__package-card.is-highlighted .mup-kit__package-card__spine {
  background: linear-gradient(180deg, transparent, var(--ao-brand), transparent);
}

.mup-kit__package-card__kunye {
  position: relative;
  z-index: 10;
  display: flex;
  min-height: 1.125rem;
  align-items: center;
  gap: 0.5rem;
  padding-left: 0.25rem;
}

@media (min-width: 640px) {
  .mup-kit__package-card__kunye {
    min-height: 1.25rem;
    gap: 0.75rem;
  }
}

.mup-kit__package-card__index {
  flex-shrink: 0;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  font-variant-numeric: tabular-nums;
  color: var(--ao-text-muted);
}

@media (min-width: 640px) {
  .mup-kit__package-card__index {
    font-size: 0.6875rem;
  }
}

.mup-kit__package-card.is-highlighted .mup-kit__package-card__index {
  color: var(--ao-brand);
}

.mup-kit__package-card__rule {
  flex: 1 1 auto;
  min-width: 0.75rem;
  height: 1px;
  background: color-mix(in srgb, var(--ao-border-strong, var(--ao-border-subtle)) 80%, transparent);
}

.mup-kit__package-card__stamp {
  display: inline-flex;
  flex-shrink: 0;
  align-items: baseline;
  gap: 0.375rem;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

@media (min-width: 640px) {
  .mup-kit__package-card__stamp {
    font-size: 0.6875rem;
  }
}

.mup-kit__package-card__stamp.is-owned {
  color: var(--ao-brand);
}

.mup-kit__package-card__stamp.is-empty {
  visibility: hidden;
}

.mup-kit__package-card__stamp-lead {
  color: color-mix(in srgb, var(--ao-text-muted) 80%, transparent);
}

.mup-kit__package-card__stamp-date {
  color: var(--ao-text-secondary);
  font-variant-numeric: tabular-nums;
}

.mup-kit__package-card__type {
  position: relative;
  z-index: 10;
  display: flex;
  min-height: 0;
  flex-direction: column;
  margin-top: 0.75rem;
}

@media (min-width: 640px) {
  .mup-kit__package-card__type {
    margin-top: 1rem;
  }
}

.mup-kit__pricing-stage {
  display: flex;
  min-height: 0;
  flex: 1;
  flex-direction: column;
}

.mup-kit__pricing-stage__title {
  margin: 0;
  flex-shrink: 0;
  font-family: var(--ao-font-display);
  font-weight: 600;
  color: var(--ao-text-primary);
  text-shadow: 0 2px 12px rgb(0 0 0 / 0.28);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 2;
}

.mup-kit__pricing-stage--short .mup-kit__pricing-stage__title {
  font-size: 1.5rem;
  line-height: 1.02;
  letter-spacing: -0.04em;
}

.mup-kit__pricing-stage--mid .mup-kit__pricing-stage__title {
  font-size: 1.3125rem;
  line-height: 1.06;
  letter-spacing: -0.035em;
}

.mup-kit__pricing-stage--long .mup-kit__pricing-stage__title {
  font-size: 1.125rem;
  line-height: 1.1;
  letter-spacing: -0.03em;
}

@media (min-width: 640px) {
  .mup-kit__pricing-stage--short .mup-kit__pricing-stage__title { font-size: 1.75rem; }
  .mup-kit__pricing-stage--mid .mup-kit__pricing-stage__title { font-size: 1.5rem; }
  .mup-kit__pricing-stage--long .mup-kit__pricing-stage__title { font-size: 1.3125rem; }
}

.mup-kit__pricing-stage__hairline {
  display: block;
  flex-shrink: 0;
  width: 38%;
  max-width: 5.5rem;
  height: 1px;
  margin-top: 0.75rem;
  opacity: 0.7;
  background: linear-gradient(to right, color-mix(in srgb, var(--ao-brand) 55%, transparent), transparent);
}

.mup-kit__pricing-stage.is-highlighted .mup-kit__pricing-stage__hairline {
  background: linear-gradient(to right, var(--ao-brand), transparent);
}

.mup-kit__pricing-stage__spine {
  position: relative;
  display: flex;
  min-height: 0;
  min-width: 0;
  flex: 1;
  flex-direction: column;
  margin-top: 0.625rem;
}

@media (min-width: 640px) {
  .mup-kit__pricing-stage__spine {
    margin-top: 0.75rem;
  }
}

.mup-kit__pricing-stage__spine-bar {
  pointer-events: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0.35em;
  width: 1px;
  opacity: 0.5;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--ao-brand) 55%, transparent) 0%,
    color-mix(in srgb, var(--ao-brand) 20%, transparent) 100%
  );
}

.mup-kit__pricing-stage.is-highlighted .mup-kit__pricing-stage__spine-bar {
  background: linear-gradient(
    180deg,
    var(--ao-brand) 0%,
    color-mix(in srgb, var(--ao-brand) 35%, transparent) 100%
  );
}

.mup-kit__pricing-stage__body {
  display: flex;
  min-height: 0;
  flex: 1;
  flex-direction: column;
  padding-left: 1.125em;
}

@media (min-width: 640px) {
  .mup-kit__pricing-stage__body {
    padding-left: 1.35em;
  }
}

.mup-kit__package-card__offer {
  display: flex;
  min-height: 0;
  flex: 1;
  flex-direction: column;
}

.mup-kit__package-card__price {
  margin: 0;
  flex-shrink: 0;
  font-family: var(--ao-font-display);
  font-size: clamp(2rem, 5vw, 2.75rem);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--ao-text-primary);
  font-variant-numeric: tabular-nums;
}

.mup-kit__package-card__monthly {
  margin: 0.625rem 0 0;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

@media (min-width: 640px) {
  .mup-kit__package-card__monthly {
    font-size: 0.6875rem;
  }
}

.mup-kit__package-card__monthly-n {
  color: var(--ao-text-secondary);
  font-variant-numeric: tabular-nums;
}

.mup-kit__package-card__monthly-sep {
  margin: 0 0.5rem;
  opacity: 0.55;
}

.mup-kit__package-card__features {
  margin: 1.25rem 0 0;
  padding: 0;
  list-style: none;
  min-height: 0;
  flex: 1;
}

.mup-kit__package-card__features li {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin: 0 0 0.625rem;
  font-size: 0.75rem;
  line-height: 1.35;
  color: var(--ao-text-secondary);
}

@media (min-width: 640px) {
  .mup-kit__package-card__features li {
    font-size: 0.875rem;
  }
}

.mup-kit__package-card__check {
  flex-shrink: 0;
  margin-top: 0.125rem;
  color: var(--ao-text-muted);
}

.mup-kit__package-card.is-highlighted .mup-kit__package-card__check {
  color: var(--ao-brand);
}

.mup-kit__package-card__cta {
  position: relative;
  z-index: 10;
  width: 100%;
  margin-top: 1.25rem;
}

.mup-kit__package-card__cta.is-owned,
.mup-kit__package-card__cta:disabled {
  cursor: default;
  opacity: 0.78;
  pointer-events: none;
}

.mup-kit__package-card.is-owned .mup-kit__package-card__price {
  color: var(--ao-fg-muted, #9aa3b5);
}

@media (min-width: 640px) {
  .mup-kit__package-card__cta {
    margin-top: 1.5rem;
  }
}

/* Legacy studio fallback grid */
.mup-kit__pricing__grid {
  display: grid;
  gap: 1rem;
}

@media (min-width: 768px) {
  .mup-kit__pricing__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.mup-kit__pricing__card {
  padding: 1.25rem;
  border: 1px solid var(--ao-border-subtle);
  border-radius: var(--ao-radius-lg);
  background: color-mix(in srgb, var(--ao-surface) 90%, transparent);
}

.mup-kit__pricing__card.is-highlighted {
  border-color: var(--ao-brand);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--ao-brand) 35%, transparent);
}

.mup-kit__pricing__card-name {
  margin: 0;
  font-family: var(--ao-font-display);
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--ao-text-primary);
}

.mup-kit__pricing__card-price {
  margin: 0.75rem 0 0;
  font-family: var(--ao-font-display);
  font-size: 1.75rem;
  font-weight: 600;
  color: var(--ao-brand);
}

.mup-kit__pricing__card-period,
.mup-kit__pricing__card-meta {
  margin: 0.35rem 0 0;
  font-size: 0.8125rem;
  color: var(--ao-text-muted);
}

.mup-kit__pricing__card .mup-kit__btn {
  width: 100%;
  margin-top: 1rem;
}

/* ── FinalCta ───────────────────────────────────────────────── */

.mup-kit__final-cta {
  padding: 1.5rem 0;
}

.mup-kit__final-cta__panel {
  position: relative;
  overflow: hidden;
  border-radius: var(--ao-radius-lg);
  background: var(--ao-amber-500);
}

.mup-kit__final-cta__watermark {
  position: absolute;
  right: -0.25rem;
  bottom: -0.5rem;
  font-family: var(--ao-font-display);
  font-size: clamp(4.5rem, 18vw, 11rem);
  font-weight: 600;
  line-height: 1;
  color: color-mix(in srgb, var(--ao-amber-900) 8%, transparent);
  pointer-events: none;
  user-select: none;
}

.mup-kit__final-cta__grid {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 2rem;
  padding: 2rem 1.25rem;
}

@media (min-width: 1024px) {
  .mup-kit__final-cta__grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    align-items: end;
    padding: 2.5rem 2rem;
  }
}

.mup-kit__final-cta__kicker {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ao-text-on-amber);
}

.mup-kit__final-cta__title {
  margin: 1rem 0 0;
  max-width: 14ch;
  font-family: var(--ao-font-display);
  font-size: clamp(2rem, 5vw, 3.25rem);
  font-weight: 600;
  line-height: 1.08;
  color: var(--ao-text-on-brand);
}

.mup-kit__final-cta__lead {
  margin: 1rem 0 0;
  max-width: 28rem;
  font-size: 1rem;
  line-height: 1.55;
  color: var(--ao-text-on-amber);
}

.mup-kit__final-cta__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  margin-top: 1.5rem;
}

.mup-kit__final-cta__secondary {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--ao-text-on-amber);
  text-decoration: none;
}

.mup-kit__final-cta__secondary:hover {
  color: var(--ao-amber-900);
}

.mup-kit__final-cta__clock-label,
.mup-kit__final-cta__clock-note {
  margin: 0;
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-on-amber);
}

/* BroadcastTimeStack — FinalCta / PageHero ortak */
.mup-kit__broadcast-time {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
}

.mup-kit__broadcast-time__label,
.mup-kit__broadcast-time__note {
  margin: 0;
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-on-amber, #1a1204);
}

.mup-kit__broadcast-time--on-night .mup-kit__broadcast-time__label {
  color: var(--ao-text-secondary);
}

.mup-kit__broadcast-time--on-night .mup-kit__broadcast-time__note {
  color: var(--ao-text-secondary, #c4cad6);
}

.mup-kit__broadcast-time__clock {
  margin: 0.35rem 0 0;
  font-size: clamp(2.75rem, 8vw, 4.25rem);
  font-weight: 600;
  letter-spacing: -0.03em;
  color: var(--ao-text-on-brand, #1a1204);
}

.mup-kit__broadcast-time--on-night .mup-kit__broadcast-time__clock {
  color: var(--ao-warm-white, #f5f3ee);
}

.mup-kit__broadcast-time--on-night .mup-kit__broadcast-time__clock.mup-kit__ritual-clock .mup-kit__ritual-clock__colon span {
  background: var(--ao-amber-400, #f5b94e);
}

.mup-kit__broadcast-time--lg .mup-kit__broadcast-time__clock {
  font-size: clamp(4.5rem, 14vw, 7.5rem);
}

.mup-kit__broadcast-time__clock.mup-kit__ritual-clock {
  font-family: var(--ao-font-mono);
}

.mup-kit__broadcast-time__note {
  margin-top: 0.75rem;
  max-width: 16rem;
  line-height: 1.5;
}

.mup-kit__final-cta__time-stack .mup-kit__broadcast-time__label,
.mup-kit__final-cta__time-stack .mup-kit__broadcast-time__note {
  color: var(--ao-text-on-amber);
}

.mup-kit__ritual-clock {
  display: inline-flex;
  align-items: center;
  margin: 0;
  font-family: var(--ao-font-mono);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  color: var(--ao-fg, var(--ao-warm-white));
}

.mup-kit__ritual-clock__hh,
.mup-kit__ritual-clock__mm {
  line-height: 1;
}

.mup-kit__ritual-clock__colon {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  align-self: center;
  gap: 0.125em;
  margin-inline: 0.12em;
}

.mup-kit__ritual-clock__colon span {
  display: block;
  width: 0.118em;
  height: 0.125em;
  border-radius: 20%;
  background: var(--ao-amber-400, #f5b94e);
}

.mup-kit__ritual-clock.is-mono {
  color: currentColor;
}

.mup-kit__ritual-clock.is-on-amber {
  color: var(--ao-text-on-brand, #1a1204);
}

.mup-kit__ritual-clock.is-on-amber .mup-kit__ritual-clock__colon span {
  background: var(--ao-amber-900, #4a3208);
}

.mup-kit__ritual-clock.is-on-night {
  color: var(--ao-warm-white, #f5f3ee);
}

.mup-kit__ritual-clock.is-watermark,
.mup-vitrin-site-footer__watermark-clock.mup-kit__ritual-clock {
  color: transparent;
}

.mup-kit__ritual-clock.is-watermark .mup-kit__ritual-clock__colon span,
.mup-vitrin-site-footer__watermark-clock.mup-kit__ritual-clock .mup-kit__ritual-clock__colon span {
  opacity: 0;
}

.mup-kit__ritual-clock.is-pulse-rec .mup-kit__ritual-clock__colon span {
  animation: mup-kit-rec-blink 1.2s ease-in-out infinite;
}

@keyframes mup-kit-rec-blink {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.35;
  }
}

.mup-kit__final-cta__clock-time {
  margin: 0.35rem 0 0;
  font-size: clamp(4.5rem, 14vw, 7.5rem);
  font-weight: 600;
  letter-spacing: -0.03em;
  color: var(--ao-text-on-brand);
}

.mup-kit__final-cta__clock-time.mup-kit__ritual-clock {
  font-family: var(--ao-font-mono);
}

.mup-kit__final-cta__clock-note {
  margin-top: 0.75rem;
  max-width: 16rem;
  line-height: 1.5;
}

.mup-kit__final-cta .mup-kit__btn--primary {
  background: var(--ao-night-950);
  color: var(--ao-warm-white);
}

.mup-kit__final-cta .mup-kit__btn--primary:hover {
  background: var(--ao-night-800);
}

/* --- UpcomingBroadcastSection (Next carousel + ProgramShareCard) --- */

.mup-kit__upcoming-broadcast-rails {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  min-width: 0;
  width: 100%;
}

@media (min-width: 1024px) {
  .mup-kit__upcoming-broadcast-rails {
    gap: 3.5rem;
  }
}

.mup-kit__upcoming-broadcast {
  position: relative;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  padding: 1.5rem 0;
}

.mup-kit__upcoming-broadcast__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
  min-width: 0;
}

@media (min-width: 640px) {
  .mup-kit__upcoming-broadcast__head {
    margin-bottom: 1.5rem;
  }
}

.mup-kit__upcoming-broadcast__head-main {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  min-width: 0;
}

@media (min-width: 640px) {
  .mup-kit__upcoming-broadcast__head-main {
    gap: 0.5rem;
  }
}

.mup-kit__upcoming-broadcast__title {
  margin: 0;
  min-width: 0;
  font-family: var(--ao-font-display);
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--ao-text-primary);
}

@media (min-width: 640px) {
  .mup-kit__upcoming-broadcast__title {
    font-size: 1.125rem;
  }
}

.mup-kit__upcoming-broadcast__nav {
  display: flex;
  flex-shrink: 0;
  align-items: center;
}

.mup-kit__upcoming-broadcast__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
  border: 0;
  border-radius: var(--ao-radius-md, 0.5rem);
  background: transparent;
  color: var(--ao-text-secondary);
  cursor: pointer;
}

@media (min-width: 640px) {
  .mup-kit__upcoming-broadcast__arrow {
    width: 2rem;
    height: 2rem;
  }
}

.mup-kit__upcoming-broadcast__arrow:hover:not(:disabled) {
  color: var(--ao-text-primary);
  background: color-mix(in srgb, var(--ao-text-primary) 6%, transparent);
}

.mup-kit__upcoming-broadcast__arrow:disabled {
  opacity: 0.35;
  cursor: default;
}

.mup-kit__upcoming-broadcast__head-aside {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
}

@media (min-width: 640px) {
  .mup-kit__upcoming-broadcast__head-aside {
    gap: 1rem;
  }
}

.mup-kit__upcoming-broadcast__kunye {
  display: none;
}

@media (min-width: 640px) {
  .mup-kit__upcoming-broadcast__kunye {
    display: flex;
  }
}

.mup-kit__upcoming-broadcast__link {
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-text-accent, var(--ao-brand));
  text-decoration: none;
  white-space: nowrap;
}

@media (min-width: 640px) {
  .mup-kit__upcoming-broadcast__link {
    font-size: 0.6875rem;
    letter-spacing: 0.12em;
  }
}

.mup-kit__upcoming-broadcast__link:hover {
  color: var(--ao-text-primary);
}

.mup-kit__upcoming-broadcast__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  padding: 3rem 0;
  text-align: center;
}

.mup-kit__upcoming-broadcast__empty-text {
  margin: 0;
  font-family: var(--ao-font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__upcoming-broadcast__stage {
  position: relative;
  min-width: 0;
}

.mup-kit__upcoming-broadcast__wash {
  pointer-events: none;
  position: absolute;
  left: -1rem;
  top: 50%;
  height: 70%;
  width: 10rem;
  transform: translateY(-50%);
  opacity: 0.7;
  background: radial-gradient(55% 60% at 20% 50%, color-mix(in srgb, var(--ao-brand) 8%, transparent), transparent 72%);
}

.mup-kit__upcoming-broadcast__viewport {
  position: relative;
  min-width: 0;
  overflow-x: hidden;
  overflow-y: visible;
  padding-block: 0.5rem;
}

.mup-kit__upcoming-broadcast__track {
  display: flex;
  gap: 0.75rem;
  touch-action: pan-y;
  will-change: transform;
}

@media (min-width: 640px) {
  .mup-kit__upcoming-broadcast__track {
    gap: 1rem;
  }
}

.mup-kit__upcoming-broadcast__slide {
  flex: 0 0 85%;
  min-width: 0;
}

@media (min-width: 640px) {
  .mup-kit__upcoming-broadcast__slide {
    flex-basis: 46%;
  }
}

@media (min-width: 1024px) {
  .mup-kit__upcoming-broadcast__slide {
    flex-basis: 31%;
  }
}

.mup-kit__upcoming-broadcast__card.mup-kit__program-card {
  width: 100%;
}

.mup-kit__how-it-works,
.mup-kit__category-program,
.mup-kit__category-instructors,
.mup-kit__curriculum {
  padding: 1.5rem 0;
}

.mup-kit__section-anchor {
  scroll-margin-top: 5.5rem;
}

@media (min-width: 1024px) {
  .mup-kit__section-anchor {
    scroll-margin-top: 6.5rem;
  }
}

.mup-kit__category-program__row,
.mup-kit__curriculum__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.mup-kit__category-program__time,
.mup-kit__broadcast-dock__time {
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__category-program__list,
.mup-kit__curriculum__list {
  display: grid;
  gap: 0.75rem;
  margin: 1rem 0 0;
  padding: 0;
  list-style: none;
}

.mup-kit__category-instructors__card,
.mup-kit__category-program__row {
  padding: 1rem;
  border: 1px solid var(--ao-border-subtle);
  border-radius: 0.875rem;
  background: var(--ao-bg-subtle);
}

/* HowItWorksSection — 3-step ritual dossier */
.mup-kit__how-it-works {
  min-width: 0;
  width: 100%;
  max-width: 100%;
}

.mup-kit__how-it-works__grid {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  min-width: 0;
  border-top: 1px solid var(--ao-border-subtle);
}

@media (min-width: 640px) {
  .mup-kit__how-it-works__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.mup-kit__how-it-works__step {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 15rem;
  overflow: hidden;
  padding: 1.25rem;
  border-bottom: 1px solid var(--ao-border-subtle);
}

@media (min-width: 640px) {
  .mup-kit__how-it-works__step {
    min-height: 17rem;
    padding: 1.5rem;
    border-bottom: 0;
    border-right: 1px solid var(--ao-border-subtle);
  }

  .mup-kit__how-it-works__step.is-last {
    border-right: 0;
  }
}

@media (min-width: 1024px) {
  .mup-kit__how-it-works__step {
    min-height: 18rem;
    padding: 1.75rem;
  }
}

.mup-kit__how-it-works__step.is-last {
  border-bottom: 0;
}

.mup-kit__how-it-works__depth,
.mup-kit__how-it-works__grid-wash,
.mup-kit__how-it-works__fade,
.mup-kit__how-it-works__spine {
  pointer-events: none;
  position: absolute;
}

.mup-kit__how-it-works__depth {
  inset: 0;
  background:
    radial-gradient(70% 80% at 88% 18%, color-mix(in srgb, var(--ao-brand) 12%, transparent), transparent 62%),
    radial-gradient(55% 55% at 10% 90%, color-mix(in srgb, var(--ao-night-600, #2a3348) 28%, transparent), transparent 65%),
    linear-gradient(120deg, color-mix(in srgb, var(--ao-night-800, #161e33) 40%, transparent) 0%, transparent 48%);
}

.mup-kit__how-it-works__grid-wash {
  inset: 0;
  opacity: 0.14;
  background-image:
    linear-gradient(var(--ao-border-subtle) 1px, transparent 1px),
    linear-gradient(90deg, var(--ao-border-subtle) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(75% 70% at 78% 42%, #000 14%, transparent 72%);
}

.mup-kit__how-it-works__fade {
  inset-inline: 0;
  bottom: 0;
  height: 30%;
  background: linear-gradient(
    to top,
    var(--ao-canvas, var(--ao-night-950, #0a0e1a)),
    color-mix(in srgb, var(--ao-canvas, var(--ao-night-950, #0a0e1a)) 40%, transparent),
    transparent
  );
}

.mup-kit__how-it-works__spine {
  top: 14%;
  bottom: 14%;
  left: 0;
  width: 1px;
  opacity: 0.35;
  background: linear-gradient(180deg, transparent, var(--ao-brand), transparent);
}

.mup-kit__how-it-works__watermark {
  pointer-events: none;
  position: absolute;
  right: -0.25rem;
  bottom: -0.5rem;
  z-index: 1;
  user-select: none;
  font-family: var(--ao-font-display);
  font-size: clamp(3rem, 10vw, 5rem);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.02em;
  color: color-mix(in srgb, var(--ao-brand) 12%, transparent);
}

@media (min-width: 640px) {
  .mup-kit__how-it-works__watermark {
    bottom: -0.75rem;
  }
}

.mup-kit__how-it-works__step.is-time .mup-kit__how-it-works__watermark {
  top: 0.5rem;
  bottom: auto;
}

@media (min-width: 640px) {
  .mup-kit__how-it-works__step.is-time .mup-kit__how-it-works__watermark {
    top: 0.75rem;
    right: -0.5rem;
  }
}

.mup-kit__how-it-works__kunye {
  position: relative;
  z-index: 10;
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0.5rem;
}

.mup-kit__how-it-works__dot {
  flex-shrink: 0;
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 999px;
  background: var(--ao-brand);
}

.mup-kit__how-it-works__index {
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ao-brand);
}

@media (min-width: 640px) {
  .mup-kit__how-it-works__index {
    font-size: 0.6875rem;
  }
}

.mup-kit__how-it-works__type {
  position: relative;
  z-index: 10;
  min-width: 0;
  max-width: 88%;
  margin-top: 1rem;
}

@media (min-width: 640px) {
  .mup-kit__how-it-works__type {
    margin-top: 1.25rem;
  }
}

.mup-kit__step-stage {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.mup-kit__step-stage__title {
  margin: 0;
  font-family: var(--ao-font-display);
  font-weight: 600;
  color: var(--ao-text-primary);
  text-shadow: 0 2px 12px rgb(0 0 0 / 0.3);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.mup-kit__step-stage--short .mup-kit__step-stage__title {
  font-size: 1.3125rem;
  line-height: 1.02;
  letter-spacing: -0.04em;
  -webkit-line-clamp: 2;
}

.mup-kit__step-stage--mid .mup-kit__step-stage__title {
  font-size: 1.1875rem;
  line-height: 1.06;
  letter-spacing: -0.035em;
  -webkit-line-clamp: 2;
}

.mup-kit__step-stage--long .mup-kit__step-stage__title {
  font-size: 1rem;
  line-height: 1.1;
  letter-spacing: -0.03em;
  -webkit-line-clamp: 3;
}

@media (min-width: 640px) {
  .mup-kit__step-stage--short .mup-kit__step-stage__title { font-size: 1.4375rem; }
  .mup-kit__step-stage--mid .mup-kit__step-stage__title { font-size: 1.3125rem; }
  .mup-kit__step-stage--long .mup-kit__step-stage__title { font-size: 1.1875rem; }
}

@media (min-width: 1024px) {
  .mup-kit__step-stage--short .mup-kit__step-stage__title { font-size: 1.5625rem; }
  .mup-kit__step-stage--mid .mup-kit__step-stage__title { font-size: 1.4375rem; }
  .mup-kit__step-stage--long .mup-kit__step-stage__title { font-size: 1.25rem; }
}

.mup-kit__step-stage__hairline {
  display: block;
  width: 38%;
  max-width: 5.5rem;
  height: 1px;
  margin-top: 0.75rem;
  opacity: 0.7;
  background: linear-gradient(to right, var(--ao-brand), transparent);
}

@media (min-width: 640px) {
  .mup-kit__step-stage__hairline {
    margin-top: 0.875rem;
  }
}

.mup-kit__step-stage__spine {
  position: relative;
  display: flex;
  min-width: 0;
  margin-top: 0.625rem;
}

@media (min-width: 640px) {
  .mup-kit__step-stage__spine {
    margin-top: 0.75rem;
  }
}

.mup-kit__step-stage__spine-bar {
  pointer-events: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0.35em;
  width: 1px;
  opacity: 0.5;
  background: linear-gradient(
    180deg,
    var(--ao-brand) 0%,
    color-mix(in srgb, var(--ao-brand) 35%, transparent) 100%
  );
}

.mup-kit__step-stage__desc {
  min-width: 0;
  max-width: 28ch;
  padding-left: 1.125em;
  font-size: 0.75rem;
  line-height: 1.55;
  color: var(--ao-text-secondary);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
}

@media (min-width: 640px) {
  .mup-kit__step-stage__desc {
    padding-left: 1.35em;
    font-size: 0.875rem;
  }
}

.mup-kit__how-it-works__foot {
  position: relative;
  z-index: 10;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.75rem;
  margin-top: auto;
  padding-top: 2rem;
}

.mup-kit__how-it-works__meta {
  position: relative;
  min-width: 0;
  padding-left: 1.125em;
}

@media (min-width: 640px) {
  .mup-kit__how-it-works__meta {
    padding-left: 1.35em;
  }
}

.mup-kit__how-it-works__meta::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0.35em;
  width: 1px;
  opacity: 0.35;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--ao-brand) 60%, transparent) 0%,
    transparent 100%
  );
}

.mup-kit__how-it-works__step-label {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

@media (min-width: 640px) {
  .mup-kit__how-it-works__step-label {
    font-size: 0.6875rem;
  }
}

.mup-kit__how-it-works__step-word {
  font-family: var(--ao-font-brand, var(--ao-font-display));
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
  color: var(--ao-brand);
}

@media (min-width: 640px) {
  .mup-kit__how-it-works__step-word {
    font-size: 0.875rem;
  }
}

.mup-kit__how-it-works__step-sep {
  margin: 0 0.5rem;
  color: var(--ao-border-strong, var(--ao-border-subtle));
}

.mup-kit__how-it-works__step-n {
  color: var(--ao-text-secondary);
  font-variant-numeric: tabular-nums;
}

.mup-kit__how-it-works__step-slash {
  color: var(--ao-text-muted);
}

.mup-kit__how-it-works__step-total {
  font-variant-numeric: tabular-nums;
}

/* BrandKunye — kit inline strip */
.mup-kit__brand-kunye {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0.375rem;
  font-family: var(--ao-font-mono);
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

@media (min-width: 640px) {
  .mup-kit__brand-kunye {
    gap: 0.5rem;
  }
}

.mup-kit__brand-kunye--inline {
  font-size: 0.625rem;
}

@media (min-width: 640px) {
  .mup-kit__brand-kunye--inline {
    font-size: 0.6875rem;
  }
}

.mup-kit__brand-kunye--footer {
  font-size: 0.6875rem;
  letter-spacing: 0.14em;
}

@media (min-width: 640px) {
  .mup-kit__brand-kunye--footer {
    font-size: 0.8125rem;
  }
}

.mup-kit__brand-kunye--slide {
  font-size: 0.5625rem;
  letter-spacing: 0.08em;
}

.mup-kit__brand-kunye--program {
  font-size: 0.625rem;
  letter-spacing: 0.1em;
}

.mup-kit__brand-kunye__lead {
  flex-shrink: 0;
  white-space: nowrap;
  font-family: var(--ao-font-brand, var(--ao-font-display));
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
  color: var(--ao-brand);
}

.mup-kit__brand-kunye--tone-live .mup-kit__brand-kunye__lead {
  color: var(--ao-live, var(--ao-coral-400, #f86a57));
}

.mup-kit__brand-kunye--tone-muted .mup-kit__brand-kunye__lead {
  color: var(--ao-text-secondary);
}

.mup-kit__brand-kunye__rule {
  flex: 1 1 auto;
  min-width: 1.25rem;
  height: 1px;
  background: var(--ao-border-strong, var(--ao-border-subtle));
}

.mup-kit__brand-kunye--slide .mup-kit__brand-kunye__rule,
.mup-kit__brand-kunye--program .mup-kit__brand-kunye__rule {
  flex: 0 0 auto;
  min-width: 0;
  width: 0.75rem;
}

.mup-kit__brand-kunye__time {
  flex-shrink: 0;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.06em;
  color: var(--ao-live, var(--ao-coral-400, #f86a57));
}

.mup-kit__brand-kunye__trail {
  flex-shrink: 0;
  white-space: nowrap;
  letter-spacing: 0.1em;
  color: var(--ao-text-primary);
}

.mup-kit__brand-kunye .mup-kit__live-dot {
  flex-shrink: 0;
}

.mup-kit__instructor-hero__descriptor,
.mup-kit__broadcast-dock__category {
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__instructor-hero {
  padding: 1.5rem;
  border: 1px solid var(--ao-border-subtle);
  border-radius: 1rem;
  background: linear-gradient(180deg, color-mix(in srgb, var(--ao-brand) 8%, transparent), transparent);
}

.mup-kit__instructor-hero__title {
  margin: 0.35rem 0 0;
  font-family: var(--ao-font-display);
  font-size: clamp(1.5rem, 4vw, 2.25rem);
  line-height: 1.1;
  color: var(--ao-text-primary);
  text-decoration: none;
}

/* CategoryHero — compact (Next parity) */
.mup-kit__category-hero--compact {
  position: relative;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: 0;
}

.mup-kit__category-hero--mobile {
  display: block;
  overflow: hidden;
  border-radius: 0.75rem;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ao-border-subtle) 30%, transparent);
}

@media (min-width: 768px) {
  .mup-kit__category-hero--mobile {
    display: none;
  }
}

.mup-kit__category-hero--desktop {
  display: none;
}

@media (min-width: 768px) {
  .mup-kit__category-hero--desktop {
    display: block;
  }

  .mup-kit__category-hero--desktop.mup-kit__vitrin-page-hero--split {
    display: flex;
  }
}

.mup-kit__category-hero__depth {
  pointer-events: none;
  position: absolute;
  inset: 0;
  opacity: 0.8;
  background:
    radial-gradient(
      70% 80% at 88% 20%,
      color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 22%, transparent),
      transparent 62%
    ),
    radial-gradient(
      55% 60% at 8% 90%,
      color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 14%, transparent),
      transparent 65%
    ),
    linear-gradient(
      120deg,
      color-mix(in srgb, var(--ao-night-800, #161e33) 50%, transparent) 0%,
      transparent 45%
    );
}

.mup-kit__category-hero__grid {
  pointer-events: none;
  position: absolute;
  inset: 0;
  opacity: 0.08;
  background-image:
    linear-gradient(color-mix(in srgb, var(--ao-border-subtle) 80%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--ao-border-subtle) 80%, transparent) 1px, transparent 1px);
  background-size: 2.75rem 2.75rem;
  -webkit-mask-image: radial-gradient(75% 70% at 75% 40%, #000 15%, transparent 72%);
  mask-image: radial-gradient(75% 70% at 75% 40%, #000 15%, transparent 72%);
}

.mup-kit__category-hero__mobile-body {
  position: relative;
  z-index: 10;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 0;
  padding: 0.875rem 1rem;
}

.mup-kit__category-hero__meta-row,
.mup-kit__category-hero__kunye {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.625rem;
  min-width: 0;
}

.mup-kit__category-hero__kunye {
  align-items: baseline;
}

.mup-kit__category-hero__index {
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
  font-variant-numeric: tabular-nums;
}

.mup-kit__category-hero__dot {
  width: 0.375rem;
  height: 0.375rem;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--ao-cat-accent, var(--ao-brand));
}

.mup-kit__category-hero__descriptor {
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ao-cat-accent, var(--ao-brand));
}

.mup-kit__category-hero__title {
  margin: 0;
  font-family: var(--ao-font-display);
  font-size: 1.125rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: var(--ao-text-primary);
}

.mup-kit__category-hero__title--inline {
  font-size: 1.25rem;
}

@media (min-width: 1024px) {
  .mup-kit__category-hero__title--inline {
    font-size: 1.5rem;
  }
}

.mup-kit__category-hero__lead {
  margin: 0;
  color: var(--ao-text-muted);
  font-family: var(--ao-font-body);
  font-size: 0.75rem;
  line-height: 1.625;
}

.mup-kit__category-hero__lead--clamp-2 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.mup-kit__category-hero__desktop-body {
  position: relative;
  z-index: 10;
  min-width: 0;
  padding-right: 0;
}

.mup-kit__category-hero__lead--clamp-1 {
  margin-top: 0.375rem;
  max-width: 52ch;
  font-size: 0.875rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mup-kit__category-hero__topic-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin: 0.65rem 0 0;
  padding: 0;
  list-style: none;
}

.mup-kit__category-hero__topic-chip {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.55rem;
  border: 1px solid var(--ao-border-subtle);
  border-radius: 999px;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ao-text-secondary);
  background: color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 8%, transparent);
}

.mup-kit__category-hero__topics {
  color: color-mix(in srgb, var(--ao-text-muted) 70%, transparent);
}

/* VitrinPageHero — sol künye + sağ yayın saati (şeffaf, koyu zemin) */
.mup-kit__vitrin-page-hero--split {
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem 1.75rem;
  min-width: 0;
}

/* split display:flex yalnızca masaüstünde — mobilde --desktop gizli kalsın */
.mup-kit__vitrin-page-hero--split:not(.mup-kit__category-hero--desktop) {
  display: flex;
}

.mup-kit__vitrin-page-hero__main {
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  min-width: 0;
}

.mup-kit__vitrin-page-hero__aside {
  flex: 0 0 auto;
  max-width: min(100%, 14rem);
}

.mup-kit__vitrin-page-hero__time-card {
  position: relative;
  background: transparent;
  padding: 0;
  border-radius: 0;
  min-width: 0;
  overflow: visible;
}

.mup-kit__vitrin-page-hero__time-watermark {
  display: none;
}

.mup-kit__vitrin-page-hero__time-stack {
  position: relative;
  z-index: 1;
}

.mup-kit__vitrin-page-hero__time-stack .mup-kit__broadcast-time__clock {
  font-size: clamp(2.25rem, 5.5vw, 3.5rem);
}

.mup-kit__vitrin-page-hero__time-stack .mup-kit__broadcast-time__note {
  margin-top: 0.45rem;
  max-width: 12rem;
  font-size: 0.625rem;
  letter-spacing: 0.1em;
}

.mup-kit__vitrin-page-hero--split .mup-kit__category-hero__desktop-body {
  padding-right: 0;
}

.mup-kit__vitrin-page-hero__mobile-time {
  margin-top: 0.85rem;
  padding-top: 0.75rem;
  border-top: 1px solid color-mix(in srgb, var(--ao-border-subtle) 55%, transparent);
}

.mup-kit__vitrin-page-hero__mobile-time .mup-kit__vitrin-page-hero__aside {
  max-width: none;
  width: 100%;
}

.mup-kit__vitrin-page-hero__mobile-time .mup-kit__broadcast-time {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.75rem;
}

.mup-kit__vitrin-page-hero__mobile-time .mup-kit__broadcast-time__label {
  flex: 0 0 auto;
  width: 100%;
  font-size: 0.625rem;
}

.mup-kit__vitrin-page-hero__mobile-time .mup-kit__broadcast-time__clock {
  margin: 0;
  font-size: clamp(1.75rem, 9vw, 2.35rem);
}

.mup-kit__vitrin-page-hero__mobile-time .mup-kit__broadcast-time__note {
  margin: 0;
  max-width: none;
  flex: 1 1 8rem;
  font-size: 0.5625rem;
  line-height: 1.4;
}

@media (min-width: 768px) {
  .mup-kit__vitrin-page-hero.mup-kit__category-hero--desktop {
    align-items: center;
  }

  .mup-kit__vitrin-page-hero__aside {
    margin-left: auto;
    text-align: right;
  }

  .mup-kit__vitrin-page-hero__aside .mup-kit__broadcast-time {
    align-items: flex-end;
  }

  .mup-kit__vitrin-page-hero__aside .mup-kit__broadcast-time__note {
    text-align: right;
  }
}

.mup-kit__month-schedule--no-header .mup-kit__month-schedule__wash {
  opacity: 0.35;
}

.mup-kit__month-schedule--no-header {
  padding-top: 0.25rem;
}

.mup-kit__category-program.mup-kit__catalog-program {
  margin: 0;
}

.mup-kit__broadcast-dock__panel {
  display: inline-flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.85rem 1rem;
  border-radius: 1rem;
  background: var(--ao-amber-600);
  color: var(--ao-text-on-brand);
}

.mup-kit__curriculum__section + .mup-kit__curriculum__section {
  margin-top: 2rem;
}

.mup-kit__course-detail .mup-kit__curriculum__head {
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--ao-border-subtle);
}

.mup-kit__course-detail .mup-kit__curriculum__title {
  font-family: var(--ao-font-display);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--ao-text-primary);
}

.mup-kit__course-detail .mup-kit__curriculum__count {
  font-family: var(--ao-font-body);
  font-size: 0.8125rem;
  color: var(--ao-text-muted);
}

.mup-kit__course-detail .mup-kit__curriculum__list {
  margin-top: 0;
  border-top: 1px solid var(--ao-border-subtle);
}

.mup-kit__lesson-row {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.4rem 0;
  border-bottom: 1px solid var(--ao-border-subtle);
}

.mup-kit__lesson-row:last-child {
  border-bottom: 0;
}

.mup-kit__lesson-row__icon {
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
  margin-top: 0.15rem;
  opacity: 0.85;
  background: currentColor;
  color: var(--ao-text-muted);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.mup-kit__lesson-row__icon.is-stream {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M4.9 19.1C1 15.2 1 8.8 4.9 4.9'/%3E%3Cpath d='M7.8 16.2c-2.3-2.3-2.3-6.1 0-8.5'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Cpath d='M16.2 7.8c2.3 2.3 2.3 6.1 0 8.5'/%3E%3Cpath d='M19.1 4.9C23 8.8 23 15.1 19.1 19.1'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M4.9 19.1C1 15.2 1 8.8 4.9 4.9'/%3E%3Cpath d='M7.8 16.2c-2.3-2.3-2.3-6.1 0-8.5'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Cpath d='M16.2 7.8c2.3 2.3 2.3 6.1 0 8.5'/%3E%3Cpath d='M19.1 4.9C23 8.8 23 15.1 19.1 19.1'/%3E%3C/svg%3E");
}

.mup-kit__lesson-row__icon.is-video {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E");
}

.mup-kit__lesson-row__icon.is-topic {
  width: 0.45rem;
  height: 0.45rem;
  margin-top: 0.45rem;
  border-radius: 999px;
  background: var(--ao-cat-accent, var(--ao-text-muted));
  -webkit-mask-image: none;
  mask-image: none;
  opacity: 1;
}

.mup-kit__lesson-row.is-status-live .mup-kit__lesson-row__icon.is-stream {
  color: var(--ao-live, #ef4444);
}

.mup-kit__lesson-row.is-status-replay_ready .mup-kit__lesson-row__icon.is-video {
  color: var(--ao-ok, #4ade80);
}

.mup-kit__lesson-row__body {
  min-width: 0;
  flex: 1 1 auto;
}

.mup-kit__lesson-row__title {
  margin: 0;
  font-family: var(--ao-font-body);
  font-size: 0.875rem;
  line-height: 1.35;
  color: var(--ao-text-body, var(--ao-text-secondary));
}

.mup-kit__lesson-row__meta {
  margin: 0.25rem 0 0;
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.06em;
  line-height: 1.4;
  color: var(--ao-text-muted);
}

.mup-kit__lesson-row.is-status-live .mup-kit__lesson-row__meta,
.mup-kit__lesson-row.is-status-tonight .mup-kit__lesson-row__meta {
  color: var(--ao-brand);
}

.mup-kit__lesson-row.is-status-live .mup-kit__lesson-row__meta {
  color: var(--ao-live, #ef4444);
}

.mup-kit__lesson-row__hint {
  margin: 0.35rem 0 0;
  font-family: var(--ao-font-body);
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--ao-text-secondary);
}

.mup-kit__lesson-row__action {
  flex-shrink: 0;
  align-self: center;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--ao-brand);
  white-space: nowrap;
}

.mup-kit__lesson-row__action:hover {
  color: var(--ao-brand-hover);
}

.mup-kit__curriculum__item {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  padding: 0.35rem 0;
  border-bottom: 1px solid var(--ao-border-subtle);
  color: var(--ao-text-secondary);
}

.mup-kit__curriculum__badge {
  flex: 0 0 auto;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
  border: 1px solid var(--ao-border-subtle);
  padding: 0.15rem 0.4rem;
  border-radius: 0.25rem;
}

.mup-kit__curriculum__item-title {
  min-width: 0;
}

/* CategoryShowcase — SectionKunye + 2×2 CategoryCard dossier */
.mup-kit__category-showcase {
  min-width: 0;
  width: 100%;
  max-width: 100%;
}

.mup-kit__category-showcase .mup-kit__section-kunye__title {
  max-width: 14rem;
}

@media (min-width: 640px) {
  .mup-kit__category-showcase .mup-kit__section-kunye__title {
    max-width: none;
  }
}

.mup-kit__category-showcase .mup-kit__section-kunye__meta {
  max-width: 8.5rem;
}

@media (min-width: 640px) {
  .mup-kit__category-showcase .mup-kit__section-kunye__meta {
    max-width: 14rem;
  }
}

.mup-kit__category-showcase__stage {
  position: relative;
  min-width: 0;
  overflow: hidden;
}

.mup-kit__category-showcase__grid {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 0;
  min-width: 0;
  border-top: 1px solid var(--ao-border-subtle);
}

@media (min-width: 640px) {
  .mup-kit__category-showcase__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* CategoryCard */
.mup-kit__category-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 16.5rem;
  overflow: hidden;
  border-bottom: 1px solid var(--ao-border-subtle);
  text-decoration: none;
  color: inherit;
  background: transparent;
  transition: z-index 0s;
}

@media (min-width: 640px) {
  .mup-kit__category-card {
    min-height: 20rem;
  }

  .mup-kit__category-card.is-left {
    border-right: 1px solid var(--ao-border-subtle);
  }

  .mup-kit__category-card.is-last-row {
    border-bottom: 0;
  }
}

@media (min-width: 1024px) {
  .mup-kit__category-card {
    min-height: 22rem;
  }
}

.mup-kit__category-card.is-last {
  border-bottom: 0;
}

.mup-kit__category-card:focus-visible {
  z-index: 10;
  outline: 2px solid color-mix(in srgb, var(--ao-brand) 50%, transparent);
  outline-offset: -2px;
}

.mup-kit__category-card:hover {
  z-index: 1;
}

.mup-kit__category-card__depth,
.mup-kit__category-card__grid,
.mup-kit__category-card__fade,
.mup-kit__category-card__spine {
  pointer-events: none;
  position: absolute;
}

.mup-kit__category-card__depth {
  inset: 0;
  background:
    radial-gradient(70% 80% at 88% 20%, color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 22%, transparent), transparent 62%),
    radial-gradient(55% 60% at 8% 90%, color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 14%, transparent), transparent 65%),
    linear-gradient(120deg, color-mix(in srgb, var(--ao-night-800, #161e33) 50%, transparent) 0%, transparent 45%);
  transition: opacity 0.5s ease;
}

.mup-kit__category-card__grid {
  inset: 0;
  opacity: 0.16;
  background-image:
    linear-gradient(var(--ao-border-subtle) 1px, transparent 1px),
    linear-gradient(90deg, var(--ao-border-subtle) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(75% 70% at 75% 40%, #000 15%, transparent 72%);
  transition: opacity 0.5s ease;
}

.mup-kit__category-card:hover .mup-kit__category-card__grid {
  opacity: 0.2;
}

.mup-kit__category-card__fade {
  inset-inline: 0;
  bottom: 0;
  height: 32%;
  background: linear-gradient(
    to top,
    var(--ao-canvas, var(--ao-night-950, #0a0e1a)),
    color-mix(in srgb, var(--ao-canvas, var(--ao-night-950, #0a0e1a)) 40%, transparent),
    transparent
  );
}

.mup-kit__category-card__spine {
  top: 16%;
  bottom: 16%;
  left: 0;
  width: 1px;
  opacity: 0.4;
  background: linear-gradient(180deg, transparent, var(--ao-cat-accent, var(--ao-brand)), transparent);
}

.mup-kit__category-card__watermark {
  pointer-events: none;
  position: absolute;
  right: -0.25rem;
  bottom: -0.75rem;
  z-index: 5;
  user-select: none;
  font-family: var(--ao-font-display);
  font-size: clamp(3.5rem, 12vw, 6.5rem);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--ao-cat-accent, var(--ao-brand));
  opacity: 0.13;
  transition: opacity 0.5s ease;
}

@media (min-width: 640px) {
  .mup-kit__category-card__watermark {
    right: -0.5rem;
    bottom: -1rem;
  }
}

.mup-kit__category-card:hover .mup-kit__category-card__watermark {
  opacity: 0.17;
}

.mup-kit__category-mark {
  pointer-events: none;
  position: absolute;
  right: -2%;
  bottom: -2%;
  z-index: 10;
  width: 54%;
  height: 72%;
  max-width: 16rem;
  color: var(--ao-cat-accent, var(--ao-brand));
  opacity: 0.58;
  transition: opacity 0.5s ease, transform 0.5s ease;
}

@media (min-width: 640px) {
  .mup-kit__category-mark {
    width: 56%;
    height: 76%;
    max-width: 17rem;
  }
}

.mup-kit__category-card:hover .mup-kit__category-mark {
  opacity: 0.78;
  transform: translateX(-1%) scale(1.02);
}

.mup-kit__category-mark svg {
  display: block;
  width: 100%;
  height: 100%;
}

.mup-kit__category-card__kunye {
  position: relative;
  z-index: 20;
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0.625rem;
  padding: 1.25rem 1rem 0;
}

@media (min-width: 640px) {
  .mup-kit__category-card__kunye {
    gap: 0.75rem;
    padding: 1.5rem 1.5rem 0;
  }
}

@media (min-width: 1024px) {
  .mup-kit__category-card__kunye {
    padding: 1.75rem 1.75rem 0;
  }
}

.mup-kit__category-card__index {
  flex-shrink: 0;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
  font-variant-numeric: tabular-nums;
  transition: color 0.3s ease;
}

@media (min-width: 640px) {
  .mup-kit__category-card__index {
    font-size: 0.6875rem;
  }
}

.mup-kit__category-card:hover .mup-kit__category-card__index {
  color: var(--ao-brand);
}

.mup-kit__category-card__dot {
  flex-shrink: 0;
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 999px;
  background: var(--ao-cat-accent, var(--ao-brand));
}

.mup-kit__category-card__descriptor {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-cat-accent, var(--ao-brand));
}

@media (min-width: 640px) {
  .mup-kit__category-card__descriptor {
    font-size: 0.6875rem;
  }
}

.mup-kit__category-card__type {
  position: relative;
  z-index: 20;
  min-width: 0;
  margin-top: 1rem;
  padding: 0 1rem;
}

@media (min-width: 640px) {
  .mup-kit__category-card__type {
    margin-top: 1.25rem;
    padding: 0 1.5rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__category-card__type {
    padding: 0 1.75rem;
  }
}

.mup-kit__category-card--tier-short .mup-kit__category-card__type { max-width: 72%; }
.mup-kit__category-card--tier-mid .mup-kit__category-card__type { max-width: 68%; }
.mup-kit__category-card--tier-long .mup-kit__category-card__type { max-width: 74%; }

@media (min-width: 640px) {
  .mup-kit__category-card--tier-short .mup-kit__category-card__type { max-width: 64%; }
  .mup-kit__category-card--tier-mid .mup-kit__category-card__type { max-width: 60%; }
  .mup-kit__category-card--tier-long .mup-kit__category-card__type { max-width: 66%; }
}

.mup-kit__category-stage {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.mup-kit__category-stage__title {
  margin: 0;
  font-family: var(--ao-font-display);
  font-weight: 600;
  color: var(--ao-text-primary);
  text-shadow: 0 2px 14px rgb(0 0 0 / 0.35);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.mup-kit__category-stage--card.mup-kit__category-stage--short .mup-kit__category-stage__title {
  font-size: 1.5rem;
  line-height: 1.02;
  letter-spacing: -0.04em;
  -webkit-line-clamp: 2;
}

.mup-kit__category-stage--card.mup-kit__category-stage--mid .mup-kit__category-stage__title {
  font-size: 1.3125rem;
  line-height: 1.06;
  letter-spacing: -0.035em;
  -webkit-line-clamp: 2;
}

.mup-kit__category-stage--card.mup-kit__category-stage--long .mup-kit__category-stage__title {
  font-size: 1.125rem;
  line-height: 1.1;
  letter-spacing: -0.03em;
  -webkit-line-clamp: 3;
}

@media (min-width: 640px) {
  .mup-kit__category-stage--card.mup-kit__category-stage--short .mup-kit__category-stage__title { font-size: 1.75rem; }
  .mup-kit__category-stage--card.mup-kit__category-stage--mid .mup-kit__category-stage__title { font-size: 1.5rem; }
  .mup-kit__category-stage--card.mup-kit__category-stage--long .mup-kit__category-stage__title { font-size: 1.25rem; }
}

@media (min-width: 1024px) {
  .mup-kit__category-stage--card.mup-kit__category-stage--short .mup-kit__category-stage__title { font-size: 2rem; }
  .mup-kit__category-stage--card.mup-kit__category-stage--mid .mup-kit__category-stage__title { font-size: 1.6875rem; }
  .mup-kit__category-stage--card.mup-kit__category-stage--long .mup-kit__category-stage__title { font-size: 1.4375rem; }
}

.mup-kit__category-stage__hairline {
  display: block;
  width: 38%;
  max-width: 5.5rem;
  height: 1px;
  margin-top: 0.75rem;
  opacity: 0.7;
  background: linear-gradient(to right, var(--ao-cat-accent, var(--ao-brand)), transparent);
}

@media (min-width: 640px) {
  .mup-kit__category-stage__hairline {
    margin-top: 0.875rem;
  }
}

.mup-kit__category-stage__spine {
  position: relative;
  display: flex;
  min-width: 0;
  margin-top: 0.625rem;
}

@media (min-width: 640px) {
  .mup-kit__category-stage__spine {
    margin-top: 0.75rem;
  }
}

.mup-kit__category-stage__spine-bar {
  pointer-events: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0.35em;
  width: 1px;
  opacity: 0.5;
  background: linear-gradient(
    180deg,
    var(--ao-cat-accent, var(--ao-brand)) 0%,
    color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 35%, transparent) 100%
  );
}

.mup-kit__category-stage__desc {
  min-width: 0;
  max-width: 28ch;
  padding-left: 1.125em;
  font-size: 0.75rem;
  line-height: 1.55;
  color: var(--ao-text-secondary);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

@media (min-width: 640px) {
  .mup-kit__category-stage__desc {
    padding-left: 1.35em;
    font-size: 0.875rem;
  }
}

.mup-kit__category-card__foot {
  position: relative;
  z-index: 20;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.75rem;
  margin-top: auto;
  padding: 2rem 1rem 1.25rem;
}

@media (min-width: 640px) {
  .mup-kit__category-card__foot {
    padding: 2rem 1.5rem 1.5rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__category-card__foot {
    padding: 2rem 1.75rem 1.75rem;
  }
}

.mup-kit__category-card__count {
  position: relative;
  min-width: 0;
  padding-left: 1.125em;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

@media (min-width: 640px) {
  .mup-kit__category-card__count {
    padding-left: 1.35em;
    font-size: 0.6875rem;
  }
}

.mup-kit__category-card__count::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0.35em;
  width: 1px;
  opacity: 0.35;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 60%, transparent) 0%,
    transparent 100%
  );
}

.mup-kit__category-card__count-n {
  margin-right: 0.2em;
  color: var(--ao-text-secondary);
  font-variant-numeric: tabular-nums;
}

.mup-kit__category-card__explore {
  font-family: var(--ao-font-brand, var(--ao-font-display));
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  line-height: 1;
  color: var(--ao-cat-accent, var(--ao-brand));
}

@media (min-width: 640px) {
  .mup-kit__category-card__explore {
    font-size: 0.875rem;
  }
}

.mup-kit__category-card__cta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--ao-cat-accent, var(--ao-brand));
}

.mup-kit__category-card__rule {
  display: none;
  width: 2rem;
  height: 1px;
  background: var(--ao-border-strong, var(--ao-border-subtle));
}

@media (min-width: 640px) {
  .mup-kit__category-card__rule {
    display: block;
  }
}

.mup-kit__category-card__arrow {
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
  transition: transform 0.2s ease;
}

.mup-kit__category-card:hover .mup-kit__category-card__arrow {
  transform: translate(2px, -2px);
}

/* TestimonialWall — stage carousel */
.mup-kit__testimonial-wall {
  min-width: 0;
  width: 100%;
  max-width: 100%;
}

.mup-kit__testimonial-wall .mup-kit__section-kunye__meta {
  max-width: 7.5rem;
}

@media (min-width: 640px) {
  .mup-kit__testimonial-wall .mup-kit__section-kunye__meta {
    max-width: 14rem;
  }
}

.mup-kit__testimonial-wall__stage {
  position: relative;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.mup-kit__testimonial-wall__depth,
.mup-kit__testimonial-wall__grid-wash,
.mup-kit__testimonial-wall__orb {
  pointer-events: none;
  position: absolute;
}

.mup-kit__testimonial-wall__depth {
  inset: 0;
  background:
    radial-gradient(55% 50% at 22% 35%, color-mix(in srgb, var(--ao-brand) 11%, transparent), transparent 70%),
    radial-gradient(50% 45% at 88% 70%, color-mix(in srgb, var(--ao-night-600, #2a3348) 35%, transparent), transparent 68%);
}

.mup-kit__testimonial-wall__grid-wash {
  inset: 0;
  opacity: 0.07;
  background-image:
    linear-gradient(var(--ao-border-subtle) 1px, transparent 1px),
    linear-gradient(90deg, var(--ao-border-subtle) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(75% 70% at 70% 55%, #000 15%, transparent 72%);
}

.mup-kit__testimonial-wall__orb {
  z-index: 1;
  right: -8%;
  bottom: -6%;
  width: 9rem;
  height: 9rem;
  opacity: 0.22;
  color: var(--ao-brand);
}

@media (min-width: 640px) {
  .mup-kit__testimonial-wall__orb {
    right: -4%;
    bottom: -8%;
    width: 17rem;
    height: 17rem;
    opacity: 0.32;
  }
}

@media (min-width: 1024px) {
  .mup-kit__testimonial-wall__orb {
    bottom: -10%;
    width: 20rem;
    height: 20rem;
  }
}

.mup-kit__testimonial-wall__orb-ring {
  position: absolute;
  inset: 12%;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--ao-brand) 50%, transparent);
  box-shadow: 0 0 40px color-mix(in srgb, var(--ao-brand) 18%, transparent);
}

.mup-kit__testimonial-wall__orb-ring::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 10%, transparent);
}

.mup-kit__testimonial-wall__orb-mark {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 28%;
  height: 28%;
  transform: translate(-50%, -50%);
}

.mup-kit__testimonial-wall__carousel {
  position: relative;
  z-index: 10;
  min-width: 0;
  padding: 0.5rem 0.25rem 0 0.75rem;
}

@media (min-width: 640px) {
  .mup-kit__testimonial-wall__carousel {
    padding: 0.75rem 0 0 1.25rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__testimonial-wall__carousel {
    padding: 1rem 0 0 1.5rem;
  }
}

.mup-kit__testimonial-wall__viewport {
  min-width: 0;
  overflow: hidden;
}

.mup-kit__testimonial-wall__track {
  display: flex;
  touch-action: pan-y;
}

.mup-kit__testimonial-wall__slide {
  flex: 0 0 100%;
  min-width: 0;
  padding-right: 0.5rem;
}

@media (min-width: 640px) {
  .mup-kit__testimonial-wall__slide {
    padding-right: 1rem;
  }
}

.mup-kit__testimonial-item {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 16rem;
  height: 100%;
}

@media (min-width: 640px) {
  .mup-kit__testimonial-item {
    min-height: 18rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__testimonial-item {
    min-height: 20rem;
  }
}

.mup-kit__testimonial-item__mark {
  font-family: var(--ao-font-display);
  font-size: 2.75rem;
  line-height: 1;
  color: color-mix(in srgb, var(--ao-brand) 40%, transparent);
}

@media (min-width: 640px) {
  .mup-kit__testimonial-item__mark {
    font-size: 3.25rem;
  }
}

.mup-kit__testimonial-item__quote {
  margin: 0.5rem 0 0;
  max-width: 36ch;
  overflow-wrap: anywhere;
  font-family: var(--ao-font-display);
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: var(--ao-text-primary);
}

@media (min-width: 640px) {
  .mup-kit__testimonial-item__quote {
    max-width: 42ch;
    font-size: 1.5rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__testimonial-item__quote {
    max-width: 48ch;
    font-size: 1.75rem;
  }
}

.mup-kit__testimonial-item__cap {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 2rem;
}

@media (min-width: 640px) {
  .mup-kit__testimonial-item__cap {
    margin-top: 2.5rem;
  }
}

.mup-kit__testimonial-item__avatar {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.375rem;
  background: var(--ao-canvas, var(--ao-night-950, #0a0e1a));
  box-shadow: inset 0 0 0 1px var(--ao-border-subtle);
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  color: var(--ao-brand);
}

@media (min-width: 640px) {
  .mup-kit__testimonial-item__avatar {
    width: 2.5rem;
    height: 2.5rem;
  }
}

.mup-kit__testimonial-item__who {
  min-width: 0;
}

.mup-kit__testimonial-item__author {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.25;
  color: var(--ao-text-primary);
}

@media (min-width: 640px) {
  .mup-kit__testimonial-item__author {
    font-size: 1rem;
  }
}

.mup-kit__testimonial-item__role {
  display: block;
  margin-top: 0.125rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--ao-font-mono);
  font-size: 0.5625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

@media (min-width: 640px) {
  .mup-kit__testimonial-item__role {
    font-size: 0.625rem;
  }
}

.mup-kit__testimonial-wall__controls {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 1.5rem;
}

@media (min-width: 640px) {
  .mup-kit__testimonial-wall__controls {
    gap: 1rem;
    margin-top: 2rem;
  }
}

.mup-kit__testimonial-wall__tabs {
  display: flex;
  min-width: 0;
  flex: 1;
  align-items: center;
  gap: 0.375rem;
}

.mup-kit__testimonial-wall__tab {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  height: 0.25rem;
  overflow: hidden;
  border: 0;
  border-radius: 999px;
  padding: 0;
  background: color-mix(in srgb, var(--ao-night-700, #1c2438) 90%, transparent);
  cursor: pointer;
}

.mup-kit__testimonial-wall__tab-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: 0;
  border-radius: inherit;
  background: var(--ao-brand);
  transition: width 0.5s ease;
}

.mup-kit__testimonial-wall__tab.is-active .mup-kit__testimonial-wall__tab-fill,
.mup-kit__testimonial-wall__tab.is-passed .mup-kit__testimonial-wall__tab-fill {
  width: 100%;
}

.mup-kit__testimonial-wall__tab.is-passed .mup-kit__testimonial-wall__tab-fill {
  opacity: 0.35;
}

.mup-kit__testimonial-wall__nav {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 0.5rem;
}

.mup-kit__testimonial-wall__counter {
  display: none;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-brand);
}

@media (min-width: 640px) {
  .mup-kit__testimonial-wall__counter {
    display: inline;
  }
}

.mup-kit__testimonial-wall__counter-sep {
  color: var(--ao-text-muted);
}

.mup-kit__testimonial-wall__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border: 0;
  border-radius: 0.375rem;
  background: transparent;
  color: var(--ao-text-secondary);
  cursor: pointer;
}

.mup-kit__testimonial-wall__arrow:hover {
  color: var(--ao-text-primary);
  background: color-mix(in srgb, var(--ao-surface) 50%, transparent);
}

/* FaqTeaser — editorial stage accordion */
.mup-kit__faq-teaser {
  position: relative;
  min-width: 0;
  width: 100%;
  max-width: 100%;
}

.mup-kit__faq-teaser__depth {
  pointer-events: none;
  position: absolute;
  top: 0;
  left: -1.5rem;
  width: 12rem;
  height: 10rem;
  opacity: 0.8;
  background: radial-gradient(55% 60% at 20% 30%, color-mix(in srgb, var(--ao-brand) 9%, transparent), transparent 72%);
}

.mup-kit__faq-teaser__spine {
  pointer-events: none;
  position: absolute;
  top: 6%;
  bottom: 8%;
  left: 0;
  width: 1px;
  opacity: 0.3;
  background: linear-gradient(180deg, transparent, var(--ao-brand), transparent);
}

.mup-kit__faq-teaser__kunye {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

@media (min-width: 640px) {
  .mup-kit__faq-teaser__kunye {
    margin-bottom: 1.25rem;
  }
}

.mup-kit__faq-teaser__count {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

@media (min-width: 640px) {
  .mup-kit__faq-teaser__count {
    font-size: 0.6875rem;
  }
}

.mup-kit__faq-teaser__dot {
  flex-shrink: 0;
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 999px;
  background: var(--ao-brand);
}

.mup-kit__faq-teaser__badge {
  flex-shrink: 0;
  font-family: var(--ao-font-brand, var(--ao-font-display));
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  line-height: 1;
  color: var(--ao-text-accent, var(--ao-brand));
}

@media (min-width: 640px) {
  .mup-kit__faq-teaser__badge {
    font-size: 0.8125rem;
  }
}

.mup-kit__faq-teaser__intro {
  position: relative;
  min-width: 0;
  max-width: 24rem;
}

.mup-kit__faq-teaser__title {
  margin: 0;
  font-family: var(--ao-font-display);
  font-weight: 600;
  color: var(--ao-text-primary);
}

.mup-kit__faq-teaser__intro--short .mup-kit__faq-teaser__title {
  font-size: 1.25rem;
  line-height: 1.02;
  letter-spacing: -0.04em;
}

.mup-kit__faq-teaser__intro--mid .mup-kit__faq-teaser__title {
  font-size: 1.125rem;
  line-height: 1.06;
  letter-spacing: -0.035em;
}

.mup-kit__faq-teaser__intro--long .mup-kit__faq-teaser__title {
  font-size: 1rem;
  line-height: 1.1;
  letter-spacing: -0.03em;
}

@media (min-width: 640px) {
  .mup-kit__faq-teaser__intro--short .mup-kit__faq-teaser__title { font-size: 1.4375rem; }
  .mup-kit__faq-teaser__intro--mid .mup-kit__faq-teaser__title { font-size: 1.3125rem; }
  .mup-kit__faq-teaser__intro--long .mup-kit__faq-teaser__title { font-size: 1.1875rem; }
}

.mup-kit__faq-teaser__hairline {
  display: block;
  width: 38%;
  max-width: 5.5rem;
  height: 1px;
  margin-top: 0.75rem;
  opacity: 0.7;
  background: linear-gradient(to right, var(--ao-brand), transparent);
}

@media (min-width: 640px) {
  .mup-kit__faq-teaser__hairline {
    margin-top: 0.875rem;
  }
}

.mup-kit__faq-teaser__lead-wrap {
  position: relative;
  display: flex;
  min-width: 0;
  margin-top: 0.625rem;
}

@media (min-width: 640px) {
  .mup-kit__faq-teaser__lead-wrap {
    margin-top: 0.75rem;
  }
}

.mup-kit__faq-teaser__lead-spine {
  pointer-events: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0.35em;
  width: 1px;
  opacity: 0.5;
  background: linear-gradient(
    180deg,
    var(--ao-brand) 0%,
    color-mix(in srgb, var(--ao-brand) 35%, transparent) 100%
  );
}

.mup-kit__faq-teaser__lead {
  margin: 0;
  max-width: 32ch;
  padding-left: 1.125em;
  font-size: 0.75rem;
  line-height: 1.55;
  color: var(--ao-text-secondary);
}

@media (min-width: 640px) {
  .mup-kit__faq-teaser__lead {
    padding-left: 1.35em;
    font-size: 0.875rem;
  }
}

.mup-kit__faq-teaser__list {
  position: relative;
  margin-top: 1.25rem;
  border-top: 1px solid var(--ao-border-subtle);
}

@media (min-width: 640px) {
  .mup-kit__faq-teaser__list {
    margin-top: 1.5rem;
  }
}

.mup-kit__faq-item {
  border-bottom: 1px solid var(--ao-border-subtle);
}

.mup-kit__faq-item__trigger {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 0.75rem;
  min-height: var(--ao-touch-min, 3rem);
  padding: 1rem 0;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
  color: inherit;
}

@media (min-width: 640px) {
  .mup-kit__faq-item__trigger {
    gap: 1rem;
    padding: 1.25rem 0;
  }
}

.mup-kit__faq-item--stage .mup-kit__faq-item__trigger {
  padding-left: 1.125rem;
}

@media (min-width: 640px) {
  .mup-kit__faq-item--stage .mup-kit__faq-item__trigger {
    padding-left: 1.35rem;
  }
}

.mup-kit__faq-item__index {
  flex-shrink: 0;
  margin-top: 0.125rem;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
  color: var(--ao-text-muted);
  transition: color 0.3s ease;
}

@media (min-width: 640px) {
  .mup-kit__faq-item__index {
    font-size: 0.6875rem;
  }
}

.mup-kit__faq-item.is-open .mup-kit__faq-item__index {
  color: var(--ao-brand);
}

.mup-kit__faq-item__question {
  min-width: 0;
  flex: 1;
  font-family: var(--ao-font-display);
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: -0.02em;
  color: var(--ao-text-primary);
}

@media (min-width: 640px) {
  .mup-kit__faq-item__question {
    font-size: 1rem;
  }
}

.mup-kit__faq-item.is-open.mup-kit__faq-item--stage .mup-kit__faq-item__question {
  font-weight: 600;
}

.mup-kit__faq-item__chevron {
  flex-shrink: 0;
  margin-top: 0.125rem;
  color: var(--ao-text-muted);
  transition: transform 0.3s ease, color 0.3s ease;
}

.mup-kit__faq-item.is-open .mup-kit__faq-item__chevron {
  transform: rotate(180deg);
  color: var(--ao-brand);
}

.mup-kit__faq-item__panel {
  position: relative;
  padding-bottom: 1rem;
}

@media (min-width: 640px) {
  .mup-kit__faq-item__panel {
    padding-bottom: 1.25rem;
  }
}

.mup-kit__faq-item--stage .mup-kit__faq-item__panel {
  display: flex;
  min-width: 0;
}

.mup-kit__faq-item--stage .mup-kit__faq-item__panel[hidden],
.mup-kit__faq-item__panel[hidden] {
  display: none !important;
}

.mup-kit__faq-item__spine {
  pointer-events: none;
  position: absolute;
  top: 0;
  bottom: 0;
  /* rem — cevap font-size em'i spine ile çakışmasın */
  left: 1.55rem;
  width: 1px;
  opacity: 0.45;
  background: linear-gradient(
    180deg,
    var(--ao-brand) 0%,
    color-mix(in srgb, var(--ao-brand) 35%, transparent) 100%
  );
}

@media (min-width: 640px) {
  .mup-kit__faq-item__spine {
    left: 1.8rem;
  }
}

.mup-kit__faq-item__answer {
  max-width: 36ch;
  font-size: 0.75rem;
  line-height: 1.55;
  color: var(--ao-text-secondary);
}

.mup-kit__faq-item--stage .mup-kit__faq-item__answer {
  padding-left: 2.65rem; /* spine + nefes payı */
}

@media (min-width: 640px) {
  .mup-kit__faq-item__answer {
    font-size: 0.875rem;
  }

  .mup-kit__faq-item--stage .mup-kit__faq-item__answer {
    padding-left: 3rem;
  }
}

.mup-kit__faq-teaser__foot {
  position: relative;
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--ao-border-subtle);
}

@media (min-width: 640px) {
  .mup-kit__faq-teaser__foot {
    margin-top: 1.5rem;
  }
}

.mup-kit__faq-teaser__cta-wrap {
  position: relative;
  display: flex;
  min-width: 0;
  align-items: center;
  padding-left: 1.125em;
}

@media (min-width: 640px) {
  .mup-kit__faq-teaser__cta-wrap {
    padding-left: 1.35em;
  }
}

.mup-kit__faq-teaser__cta-wrap::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0.35em;
  width: 1px;
  opacity: 0.35;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--ao-brand) 60%, transparent) 0%,
    transparent 100%
  );
}

.mup-kit__faq-teaser__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  text-decoration: none;
}

.mup-kit__faq-teaser__cta-label {
  font-family: var(--ao-font-brand, var(--ao-font-display));
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.mup-kit__faq-teaser__cta-icon {
  flex-shrink: 0;
}

.mup-kit__corporate-banner {
  min-width: 0;
  width: 100%;
  max-width: 100%;
}

.mup-kit__corporate-banner__shell {
  position: relative;
  overflow: hidden;
  border-radius: 0.875rem;
}

@media (min-width: 640px) {
  .mup-kit__corporate-banner__shell {
    border-radius: 1rem;
  }
}

.mup-kit__corporate-banner__depth,
.mup-kit__corporate-banner__divider,
.mup-kit__corporate-banner__grid {
  pointer-events: none;
  position: absolute;
}

.mup-kit__corporate-banner__depth {
  inset: 0;
  background:
    linear-gradient(105deg, color-mix(in srgb, var(--ao-night-800, #161e33) 88%, transparent) 0%, transparent 52%),
    radial-gradient(55% 70% at 0% 50%, color-mix(in srgb, var(--ao-brand) 14%, transparent), transparent 68%),
    radial-gradient(40% 55% at 100% 10%, color-mix(in srgb, var(--ao-night-600, #2a3348) 40%, transparent), transparent 70%);
}

/* Tek kolon mobilde dikey çizgi yanıltıcı — yalnız desktop */
.mup-kit__corporate-banner__divider {
  display: none;
  inset-block: 0;
  left: 48%;
  width: 1px;
  opacity: 0.7;
  background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--ao-brand) 35%, transparent), transparent);
}

@media (min-width: 1024px) {
  .mup-kit__corporate-banner__divider {
    display: block;
  }
}

.mup-kit__corporate-banner__grid {
  inset: 0;
  opacity: 0.055;
  background-image:
    linear-gradient(var(--ao-border-subtle) 1px, transparent 1px),
    linear-gradient(90deg, var(--ao-border-subtle) 1px, transparent 1px);
  background-size: 40px 40px;
  mask-image: linear-gradient(90deg, #000 0%, #000 45%, transparent 78%);
}

.mup-kit__corporate-banner__grid-layout {
  position: relative;
  z-index: 10;
  display: grid;
  align-items: center;
  gap: 1.5rem;
  padding: 1.5rem 1rem;
  min-width: 0;
}

@media (min-width: 480px) {
  .mup-kit__corporate-banner__grid-layout {
    gap: 1.75rem;
    padding: 1.75rem 1.25rem;
  }
}

@media (min-width: 640px) {
  .mup-kit__corporate-banner__grid-layout {
    gap: 2.5rem;
    padding: 2.5rem 2rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__corporate-banner__grid-layout {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: 3rem;
    padding: 3rem 2.5rem;
  }
}

.mup-kit__corporate-banner__copy {
  min-width: 0;
}

.mup-kit__corporate-banner__eyebrow {
  display: flex;
  max-width: 16rem;
  align-items: center;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

@media (min-width: 640px) {
  .mup-kit__corporate-banner__eyebrow {
    font-size: 0.75rem;
  }
}

.mup-kit__corporate-banner__eyebrow-muted {
  flex-shrink: 0;
  white-space: nowrap;
  color: var(--ao-text-muted);
}

.mup-kit__corporate-banner__eyebrow-rule {
  flex: 1 1 auto;
  min-width: 1.25rem;
  height: 1px;
  margin: 0 0.75rem;
  background: var(--ao-border-strong, var(--ao-border-subtle));
}

.mup-kit__corporate-banner__eyebrow-brand {
  flex-shrink: 0;
  white-space: nowrap;
  font-weight: 500;
  letter-spacing: 0.08em;
  color: var(--ao-brand);
}

.mup-kit__corporate-banner__title {
  margin: 1rem 0 0;
  max-width: 18ch;
  font-family: var(--ao-font-display);
  font-size: clamp(1.375rem, 5.5vw, 1.65rem);
  font-weight: 600;
  line-height: 1.12;
  letter-spacing: -0.02em;
  color: var(--ao-text-primary);
}

@media (min-width: 640px) {
  .mup-kit__corporate-banner__title {
    margin-top: 1.25rem;
    font-size: 2.125rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__corporate-banner__title {
    font-size: 2.375rem;
  }
}

.mup-kit__corporate-banner__lead {
  margin: 0.875rem 0 0;
  max-width: 28rem;
  font-size: 0.875rem;
  line-height: 1.55;
  color: var(--ao-text-secondary);
}

@media (min-width: 640px) {
  .mup-kit__corporate-banner__lead {
    margin-top: 1rem;
    font-size: 1rem;
  }
}

.mup-kit__corporate-banner__actions {
  margin-top: 1.35rem;
}

@media (min-width: 640px) {
  .mup-kit__corporate-banner__actions {
    margin-top: 1.75rem;
  }
}

.mup-kit__corporate-banner__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.75rem;
  text-decoration: none;
}

@media (min-width: 640px) {
  .mup-kit__corporate-banner__cta {
    min-height: 3rem;
  }
}

.mup-kit__corporate-banner__cta-icon {
  flex-shrink: 0;
}

.mup-kit__corporate-banner__mock {
  position: relative;
  width: 100%;
  max-width: min(22rem, 100%);
  margin: 0 auto;
  min-width: 0;
}

@media (min-width: 1024px) {
  .mup-kit__corporate-banner__mock {
    max-width: none;
    margin: 0;
    justify-self: end;
  }
}

.mup-kit__corporate-banner__mock-glow {
  position: absolute;
  inset: -0.5rem;
  border-radius: 1rem;
  background: color-mix(in srgb, var(--ao-brand) 7%, transparent);
  filter: blur(20px);
}

@media (min-width: 640px) {
  .mup-kit__corporate-banner__mock-glow {
    inset: -0.75rem;
    filter: blur(24px);
  }
}

.mup-kit__corporate-banner__mock-card {
  position: relative;
  overflow: hidden;
  border-radius: 0.75rem;
  border: 1px solid color-mix(in srgb, var(--ao-border-subtle) 80%, transparent);
  background: color-mix(in srgb, var(--ao-night-900, #101625) 90%, transparent);
  box-shadow:
    0 24px 48px -20px rgb(0 0 0 / 0.55),
    inset 0 0 0 1px color-mix(in srgb, #fff 4%, transparent);
}

@media (min-width: 1024px) {
  .mup-kit__corporate-banner__mock-card {
    transform: rotate(1deg);
  }
}

.mup-kit__corporate-banner__mock-chrome {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 0.875rem;
  border-bottom: 1px solid color-mix(in srgb, var(--ao-border-subtle) 70%, transparent);
}

.mup-kit__corporate-banner__mock-dots {
  display: inline-flex;
  gap: 0.375rem;
}

.mup-kit__corporate-banner__mock-dots span {
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 999px;
  background: var(--ao-night-500, #3a455c);
}

.mup-kit__corporate-banner__mock-url {
  margin-left: 0.25rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--ao-font-mono);
  font-size: 0.5625rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__corporate-banner__mock-body {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1rem;
}

@media (min-width: 640px) {
  .mup-kit__corporate-banner__mock-body {
    padding: 1.25rem;
  }
}

.mup-kit__corporate-banner__mock-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.mup-kit__corporate-banner__mock-org {
  min-width: 0;
}

.mup-kit__corporate-banner__mock-company {
  margin: 0;
  font-family: var(--ao-font-display);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--ao-text-primary);
}

.mup-kit__corporate-banner__mock-meta {
  margin: 0.125rem 0 0;
  font-family: var(--ao-font-mono);
  font-size: 0.5625rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__corporate-banner__mock-live {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  gap: 0.375rem;
  padding: 0.25rem 0.5rem;
  border-radius: 0.375rem;
  background: color-mix(in srgb, var(--ao-live, var(--ao-coral-400, #f86a57)) 10%, transparent);
  font-family: var(--ao-font-mono);
  font-size: 0.5625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-live, var(--ao-coral-400, #f86a57));
}

.mup-kit__corporate-banner__mock-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
}

.mup-kit__corporate-banner__mock-stat {
  padding: 0.5rem 0.625rem;
  border-radius: 0.5rem;
  background: color-mix(in srgb, var(--ao-night-950, #0a0e1a) 55%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ao-border-subtle) 50%, transparent);
}

.mup-kit__corporate-banner__mock-stat-v {
  margin: 0;
  font-family: var(--ao-font-display);
  font-size: 1.125rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  color: var(--ao-text-primary);
}

.mup-kit__corporate-banner__mock-stat-l {
  margin: 0.125rem 0 0;
  font-family: var(--ao-font-mono);
  font-size: 0.5625rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__corporate-banner__mock-tonight-label {
  margin: 0 0 0.5rem;
  font-family: var(--ao-font-mono);
  font-size: 0.5625rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-brand);
}

.mup-kit__corporate-banner__mock-sessions {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.mup-kit__corporate-banner__mock-session {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 0.625rem;
  border-radius: 0.5rem;
  background: color-mix(in srgb, var(--ao-night-950, #0a0e1a) 40%, transparent);
}

.mup-kit__corporate-banner__mock-session.is-live {
  background: color-mix(in srgb, var(--ao-brand) 8%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ao-brand) 25%, transparent);
}

.mup-kit__corporate-banner__mock-session-dot {
  flex-shrink: 0;
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 999px;
  background: var(--ao-night-500, #3a455c);
}

.mup-kit__corporate-banner__mock-session-title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.75rem;
  line-height: 1.35;
  color: var(--ao-text-secondary);
}

.mup-kit__corporate-banner__mock-session.is-live .mup-kit__corporate-banner__mock-session-title {
  font-weight: 500;
  color: var(--ao-text-primary);
}

.mup-kit__corporate-banner__marquee {
  position: relative;
  z-index: 10;
  border-top: 1px solid color-mix(in srgb, var(--ao-border-subtle) 70%, transparent);
  background: color-mix(in srgb, var(--ao-night-950, #0a0e1a) 35%, transparent);
}

.mup-kit__corporate-banner__marquee-mask {
  overflow: hidden;
  padding: 0.875rem 0;
  mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}

.mup-kit__corporate-banner__marquee-track {
  display: flex;
  width: max-content;
}

@media (prefers-reduced-motion: no-preference) {
  .mup-kit__corporate-banner__marquee-track {
    animation: mup-kit-logo-marquee 22s linear infinite;
  }
}

.mup-kit__corporate-banner__marquee-set {
  display: flex;
  flex-shrink: 0;
}

.mup-kit__corporate-banner__logo {
  display: inline-flex;
  align-items: center;
  gap: 0.875rem;
  padding: 0 1rem;
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

@media (min-width: 640px) {
  .mup-kit__corporate-banner__logo {
    gap: 1rem;
    padding: 0 1.25rem;
    font-size: 0.75rem;
  }
}

.mup-kit__corporate-banner__logo-dot {
  flex-shrink: 0;
  width: 0.25rem;
  height: 0.25rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--ao-brand) 70%, transparent);
}

.mup-kit__corporate-banner__logo-name {
  white-space: nowrap;
}

.mup-kit__corporate-banner__logo-img {
  height: 1rem;
  width: auto;
  opacity: 0.55;
  filter: grayscale(1);
}

@keyframes mup-kit-logo-marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

.mup-kit__page-intro__row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.75rem 1rem;
}

.mup-kit__page-intro__title {
  margin: 0;
  font-family: var(--ao-font-display);
  font-size: clamp(1.5rem, 4vw, 2rem);
  color: var(--ao-text-primary);
}

.mup-kit__page-intro__meta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__page-intro__meta-accent {
  color: var(--ao-brand);
  font-weight: 500;
}

.mup-kit__page-intro__meta-rule {
  width: 1rem;
  height: 1px;
  background: var(--ao-border-strong);
}

.mup-kit__page-intro__lead {
  margin: 0.5rem 0 0;
  max-width: 46ch;
  color: var(--ao-text-muted);
  line-height: 1.6;
}

/* About story — 012 editorial */
.mup-kit__about-story {
  min-width: 0;
  width: 100%;
  display: grid;
  gap: 2.75rem;
}

.mup-kit__about-story__section {
  min-width: 0;
  width: 100%;
  display: grid;
  gap: 1.25rem;
  padding-bottom: 2.75rem;
  border-bottom: 1px solid var(--ao-border-subtle);
}

.mup-kit__about-story__section:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.mup-kit__about-story__head {
  display: grid;
  gap: 0.65rem;
  min-width: 0;
}

.mup-kit__about-story__index {
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ao-brand);
}

.mup-kit__about-story__title {
  margin: 0;
  font-family: var(--ao-font-display);
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: var(--ao-text-primary);
}

.mup-kit__about-story__body {
  min-width: 0;
  width: 100%;
  max-width: none;
  display: grid;
  gap: 1rem;
}

.mup-kit__about-story__body p {
  margin: 0;
  max-width: 62ch;
  font-family: var(--ao-font-body);
  font-size: 1rem;
  line-height: 1.7;
  color: var(--ao-text-secondary);
}

.mup-kit__about-story__body-html {
  min-width: 0;
  max-width: 62ch;
  display: grid;
  gap: 1rem;
}

.mup-kit__about-story__body-html p {
  margin: 0;
  max-width: 62ch;
  font-family: var(--ao-font-body);
  font-size: 1rem;
  line-height: 1.7;
  color: var(--ao-text-secondary);
}

.mup-kit__about-story__body-html a {
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  display: inline;
  color: var(--ao-brand);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.mup-kit__about-story__body-html ul,
.mup-kit__about-story__body-html .mup-kit__about-story__manifest {
  margin: 0.25rem 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.65rem;
  border-left: 1px solid color-mix(in srgb, var(--ao-brand) 45%, transparent);
  padding-left: 1.1rem;
}

.mup-kit__about-story__manifest li {
  margin: 0;
  font-family: var(--ao-font-body);
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--ao-text-primary);
}

@media (min-width: 768px) {
  .mup-kit__about-story {
    gap: 3.25rem;
  }

  .mup-kit__about-story__section {
    grid-template-columns: minmax(14rem, 0.38fr) minmax(0, 1fr);
    gap: 2rem clamp(2rem, 4vw, 4rem);
    align-items: start;
    padding-bottom: 3.25rem;
  }

  .mup-kit__about-story__body {
    padding-top: 0.15rem;
  }

  .mup-kit__about-story__body p,
  .mup-kit__about-story__body-html p,
  .mup-kit__about-story__body-html,
  .mup-kit__about-story__html {
    max-width: min(68ch, 100%);
  }
}

@media (min-width: 1200px) {
  .mup-kit__about-story__section {
    grid-template-columns: minmax(16rem, 0.32fr) minmax(0, 1fr);
  }
}

/* About stats — Next hakkinda Kanıt şeridi */
.mup-kit__about-stats {
  min-width: 0;
}

.mup-kit__about-stats__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--ao-border-subtle);
  min-width: 0;
}

.mup-kit__about-stats__item {
  min-width: 0;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--ao-border-subtle);
}

.mup-kit__about-stats__item.is-last {
  border-bottom: 0;
}

.mup-kit__about-stats__value {
  margin: 0;
  font-family: var(--ao-font-display);
  font-size: 1.75rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--ao-text-primary);
  font-variant-numeric: tabular-nums;
}

.mup-kit__about-stats__label {
  margin: 0.25rem 0 0;
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

@media (min-width: 640px) {
  .mup-kit__about-stats__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .mup-kit__about-stats__item {
    border-bottom: 0;
    border-right: 1px solid var(--ao-border-subtle);
    padding: 1.5rem 1.25rem 1.5rem 0;
  }

  .mup-kit__about-stats__item.is-last {
    border-right: 0;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .mup-kit__about-stats__value {
    font-size: 2rem;
  }

  .mup-kit__about-stats__label {
    font-size: 0.75rem;
  }
}

.mup-kit__faq-list {
  margin-top: 0;
  padding-top: 0;
  border-top: 1px solid var(--ao-border-subtle);
  min-width: 0;
}

.mup-kit__faq-list .mup-kit__faq-item__panel {
  max-width: 65ch;
}

.mup-kit__faq-list .mup-kit__faq-item__answer {
  max-width: none;
}

.mup-kit__faq-list__item {
  border-top: 1px solid var(--ao-border-subtle);
  padding: 0.85rem 0;
}

.mup-kit__faq-list__question {
  cursor: pointer;
  font-weight: 600;
  color: var(--ao-text-primary);
  list-style: none;
}

.mup-kit__faq-list__question::-webkit-details-marker {
  display: none;
}

.mup-kit__faq-list__answer {
  margin-top: 0.5rem;
  color: var(--ao-text-secondary);
  line-height: 1.55;
}

.mup-kit__contact {
  display: block;
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.mup-kit__contact__form {
  min-width: 0;
  max-width: none;
}

.mup-kit__contact__field + .mup-kit__contact__field {
  margin-top: 1.5rem;
}

.mup-kit__contact__label {
  display: block;
  margin-bottom: 0.55rem;
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__contact__input,
.mup-kit__contact__textarea {
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  border: 0;
  border-radius: 0;
  border-bottom: 1px solid var(--ao-border-subtle);
  background: transparent;
  padding: 0.65rem 0;
  color: var(--ao-text-primary);
  font-family: var(--ao-font-body);
  font-size: 1rem;
  line-height: 1.45;
  box-shadow: none;
  transition: border-color var(--ao-duration-fast) var(--ao-ease-standard);
}

.mup-kit__contact__select-wrap {
  position: relative;
  display: block;
}

.mup-kit__contact__select {
  color-scheme: dark;
  cursor: pointer;
  appearance: none;
  padding-right: 1.75rem;
}

.mup-kit__contact__select option {
  background-color: var(--ao-night-800);
  color: var(--ao-text-primary);
}

.mup-kit__contact__select-chevron {
  pointer-events: none;
  position: absolute;
  right: 0.2rem;
  top: 50%;
  width: 0.5rem;
  height: 0.5rem;
  border-right: 1.5px solid var(--ao-text-muted);
  border-bottom: 1.5px solid var(--ao-text-muted);
  transform: translateY(-65%) rotate(45deg);
}

.mup-kit__contact__select:focus-visible {
  outline: 2px solid var(--ao-brand);
  outline-offset: 3px;
}

.mup-kit__contact__textarea {
  min-height: 8rem;
  resize: vertical;
}

.mup-kit__contact__input::placeholder,
.mup-kit__contact__textarea::placeholder {
  color: var(--ao-text-muted);
  opacity: 1;
}

.mup-kit__contact__input:focus,
.mup-kit__contact__textarea:focus {
  outline: none;
  border-bottom-color: var(--ao-brand);
  box-shadow: none;
}

.mup-kit__contact__submit {
  margin-top: 1.5rem;
}

.mup-kit__contact__aside-label {
  margin: 0;
  font-family: var(--ao-font-mono);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__contact__channels {
  margin: 1rem 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.65rem;
}

.mup-kit__contact__channel {
  font-family: var(--ao-font-body);
  font-size: 0.9375rem;
  letter-spacing: 0;
  text-transform: none;
  text-decoration: none;
  color: var(--ao-text-primary);
  transition: color var(--ao-duration-fast) var(--ao-ease-standard);
}

.mup-kit__contact__channel:hover {
  color: var(--ao-brand);
}

.mup-kit__contact__channel--muted {
  color: var(--ao-text-secondary);
}

.mup-kit__contact__aside-lead {
  margin: 1.5rem 0 0;
  max-width: 28ch;
  font-family: var(--ao-font-body);
  font-size: 0.875rem;
  line-height: 1.55;
  color: var(--ao-text-muted);
}

.mup-kit__instructor-aside__label {
  margin: 0;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ao-brand);
}

@media (min-width: 640px) {
  .mup-kit__instructor-aside__label {
    font-size: 0.6875rem;
  }
}

.mup-kit__instructor-aside__label--muted {
  color: var(--ao-text-muted);
}

.mup-kit__instructor-aside__education {
  position: relative;
  padding-left: 1rem;
}

.mup-kit__instructor-aside__education::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 1px;
  opacity: 0.5;
  background: linear-gradient(
    180deg,
    var(--ao-cat-accent, var(--ao-brand)) 0%,
    color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 30%, transparent) 100%
  );
}

.mup-kit__instructor-aside__text {
  margin: 0.5rem 0 0;
  font-family: var(--ao-font-body);
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.625;
  color: var(--ao-text-secondary);
}

@media (min-width: 640px) {
  .mup-kit__instructor-aside__text {
    font-size: 0.9375rem;
  }
}

.mup-kit__instructor-aside__list {
  margin: 0.75rem 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.mup-kit__instructor-aside__item {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  margin: 0;
  font-family: var(--ao-font-body);
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.35;
  color: var(--ao-text-secondary);
}

.mup-kit__instructor-aside__item-label {
  font: inherit;
  color: inherit;
}

.mup-kit__instructor-aside__dot {
  width: 0.375rem;
  height: 0.375rem;
  margin-top: 0.375rem;
  border-radius: 50%;
  background: var(--ao-cat-accent, var(--ao-brand));
  flex-shrink: 0;
}

.mup-kit__instructor-aside__specialty {
  margin-top: 0;
}

.mup-kit__instructor-aside > * + * {
  margin-top: 2rem;
}

@media (min-width: 1024px) {
  .mup-kit__instructor-aside > * + * {
    margin-top: 2.5rem;
  }
}

.mup-kit__instructor-bio {
  min-width: 0;
}

.mup-kit__instructor-bio__preview {
  position: relative;
}

.mup-kit__instructor-bio__body {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.mup-kit__instructor-bio__paragraph {
  margin: 0;
  max-width: 62ch;
  font-family: var(--ao-font-body);
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: 1.75;
  color: var(--ao-text-secondary);
}

@media (min-width: 640px) {
  .mup-kit__instructor-bio__paragraph {
    font-size: 1rem;
  }
}

.mup-kit__instructor-bio__body--collapsed {
  max-height: 11rem;
  overflow: hidden;
}

@media (min-width: 640px) {
  .mup-kit__instructor-bio__body--collapsed {
    max-height: 12rem;
  }
}

.mup-kit__instructor-bio__fade {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 6rem;
  pointer-events: none;
  background: linear-gradient(
    to top,
    var(--ao-canvas),
    color-mix(in srgb, var(--ao-canvas) 90%, transparent),
    transparent
  );
}

.mup-kit__instructor-bio__toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  margin: 1rem 0 0 -0.5rem;
  padding: 0.5rem;
  border: 0;
  background: transparent;
  cursor: pointer;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-brand);
}

.mup-kit__instructor-bio__toggle:hover,
.mup-kit__instructor-bio__toggle:focus-visible {
  color: var(--ao-text-primary);
  outline: none;
}

@media (min-width: 640px) {
  .mup-kit__instructor-bio__toggle {
    font-size: 0.6875rem;
  }
}

/* Fullscreen bio portal — Next InstructorBioPortal
 * body'ye taşındığında token için .mup-vitrin sınıfı şart (vitrin-tokens scope).
 */
.mup-kit__instructor-bio-portal {
  position: fixed;
  inset: 0;
  z-index: 1000003;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  isolation: isolate;
  background: #0a0e1a;
  background: var(--ao-canvas, #0a0e1a);
  color: #f5f3ee;
  color: var(--ao-text-primary, #f5f3ee);
  font-family: "Instrument Sans", system-ui, sans-serif;
  font-family: var(--ao-font-body, "Instrument Sans", system-ui, sans-serif);
  line-height: 1.5;
  box-sizing: border-box;
}

.mup-kit__instructor-bio-portal::backdrop {
  background: #0a0e1a;
  background: var(--ao-canvas, #0a0e1a);
}

.mup-kit__instructor-bio-portal *,
.mup-kit__instructor-bio-portal *::before,
.mup-kit__instructor-bio-portal *::after {
  box-sizing: border-box;
}

.mup-kit__instructor-bio-portal:not([open]) {
  display: none;
}

.mup-kit__instructor-bio-portal[hidden] {
  display: none !important;
}

.mup-kit__instructor-bio-portal[open],
.mup-kit__instructor-bio-portal.is-open,
.mup-kit__instructor-bio-portal[data-mup-open="1"] {
  display: block !important;
}

.mup-kit__instructor-bio-portal__dialog {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-height: 100%;
  min-height: 100dvh;
  margin: 0;
  padding: 0;
  background: #0a0e1a;
  background: var(--ao-canvas, #0a0e1a);
  outline: none;
  animation: mup-bio-portal-in 200ms var(--ao-ease-standard, ease) both;
}

@keyframes mup-bio-portal-in {
  from {
    opacity: 0;
    transform: scale(0.98);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.mup-kit__instructor-bio-portal__depth {
  pointer-events: none;
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(
      70% 80% at 88% 20%,
      color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand, #f5b94e)) 22%, transparent),
      transparent 62%
    ),
    radial-gradient(
      55% 60% at 8% 90%,
      color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand, #f5b94e)) 14%, transparent),
      transparent 65%
    ),
    linear-gradient(
      120deg,
      color-mix(in srgb, var(--ao-night-800, #161e33) 50%, transparent) 0%,
      transparent 45%
    );
}

.mup-kit__instructor-bio-portal__grid {
  pointer-events: none;
  position: absolute;
  inset: 0;
  z-index: 0;
  opacity: 0.1;
  background-image:
    linear-gradient(color-mix(in srgb, var(--ao-border-subtle, #2a3654) 80%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--ao-border-subtle, #2a3654) 80%, transparent) 1px, transparent 1px);
  background-size: 2.75rem 2.75rem;
  -webkit-mask-image: radial-gradient(75% 70% at 75% 40%, #000 15%, transparent 72%);
  mask-image: radial-gradient(75% 70% at 75% 40%, #000 15%, transparent 72%);
}

.mup-kit__instructor-bio-portal__header {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(4.5rem, auto) minmax(0, 1fr) 2.5rem;
  align-items: center;
  column-gap: 0.75rem;
  flex-shrink: 0;
  width: 100%;
  margin: 0;
  padding: 0.75rem 1rem;
  border: 0;
  border-bottom: 1px solid var(--ao-border-subtle, rgba(42, 54, 84, 0.6));
  background: color-mix(in srgb, var(--ao-canvas, #0a0e1a) 88%, transparent);
  backdrop-filter: blur(8px);
}

@media (min-width: 640px) {
  .mup-kit__instructor-bio-portal__header {
    grid-template-columns: minmax(5.5rem, auto) minmax(0, 1fr) 2.5rem;
    column-gap: 1rem;
    padding: 1rem 1.5rem;
  }
}

.mup-kit__instructor-bio-portal__back {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  gap: 0.375rem;
  margin: 0 0 0 -0.5rem;
  padding: 0.5rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  cursor: pointer;
  font-family: var(--ao-font-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-text-secondary, #8b97b5);
  line-height: 1.2;
}

.mup-kit__instructor-bio-portal__back:hover,
.mup-kit__instructor-bio-portal__back:focus-visible {
  color: var(--ao-text-primary, #f5f3ee);
  outline: none;
}

@media (min-width: 640px) {
  .mup-kit__instructor-bio-portal__back {
    font-size: 0.6875rem;
  }
}

.mup-kit__instructor-bio-portal__mast {
  min-width: 0;
  width: 100%;
  margin: 0;
  padding: 0;
  text-align: center;
}

.mup-kit__instructor-bio-portal__eyebrow {
  display: block;
  margin: 0;
  padding: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--ao-font-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ao-brand, #f5b94e);
  line-height: 1.3;
}

@media (min-width: 640px) {
  .mup-kit__instructor-bio-portal__eyebrow {
    font-size: 0.6875rem;
  }
}

.mup-kit__instructor-bio-portal__name {
  display: block;
  margin: 0.125rem 0 0;
  padding: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--ao-font-display, Gabarito, system-ui, sans-serif);
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--ao-text-primary, #f5f3ee);
  line-height: 1.3;
}

@media (min-width: 640px) {
  .mup-kit__instructor-bio-portal__name {
    font-size: 1rem;
  }
}

.mup-kit__instructor-bio-portal__x {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  justify-self: end;
  width: 2.5rem;
  height: 2.5rem;
  margin: 0;
  padding: 0;
  border: 1px solid var(--ao-border-subtle, rgba(42, 54, 84, 0.6));
  border-radius: 999px;
  background: color-mix(in srgb, var(--ao-surface, #101625) 80%, transparent);
  box-shadow: none;
  color: var(--ao-text-secondary, #8b97b5);
  cursor: pointer;
  line-height: 1;
}

.mup-kit__instructor-bio-portal__x:hover,
.mup-kit__instructor-bio-portal__x:focus-visible {
  background: color-mix(in srgb, var(--ao-text-muted, #5c6b8f) 12%, transparent);
  color: var(--ao-text-primary, #f5f3ee);
  outline: none;
}

.mup-kit__instructor-bio-portal__icon {
  display: block;
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
}

.mup-kit__instructor-bio-portal__scroll {
  position: relative;
  z-index: 2;
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.mup-kit__instructor-bio-portal__inner {
  position: relative;
  width: 100%;
  max-width: 42rem;
  margin: 0 auto;
  padding: 2rem 1.25rem 2.5rem;
}

@media (min-width: 640px) {
  .mup-kit__instructor-bio-portal__inner {
    padding: 3rem 2rem 3.5rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__instructor-bio-portal__inner {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
  }
}

.mup-kit__instructor-bio-portal__count {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
  font-family: var(--ao-font-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ao-text-muted, #5c6b8f);
  line-height: 1.4;
}

@media (min-width: 640px) {
  .mup-kit__instructor-bio-portal__count {
    font-size: 0.6875rem;
  }
}

.mup-kit__instructor-bio-portal__paras {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin: 1.5rem 0 0;
  padding: 0;
}

@media (min-width: 640px) {
  .mup-kit__instructor-bio-portal__paras {
    gap: 2rem;
  }
}

.mup-kit__instructor-bio-portal__para {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
  max-width: none;
  font-family: var(--ao-font-body, "Instrument Sans", system-ui, sans-serif);
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.8;
  color: var(--ao-text-secondary, #8b97b5);
}

@media (min-width: 640px) {
  .mup-kit__instructor-bio-portal__para {
    font-size: 1.125rem;
    line-height: 1.85;
  }
}

.mup-kit__instructor-bio-portal__education {
  position: relative;
  margin: 2.5rem 0 0;
  padding: 2rem 0 0;
  border-top: 1px solid var(--ao-border-subtle, rgba(42, 54, 84, 0.6));
}

@media (min-width: 640px) {
  .mup-kit__instructor-bio-portal__education {
    margin-top: 3rem;
    padding-top: 2.5rem;
  }
}

.mup-kit__instructor-bio-portal__edu-label {
  display: block;
  margin: 0;
  padding: 0;
  font-family: var(--ao-font-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-brand, #f5b94e);
  line-height: 1.4;
}

@media (min-width: 640px) {
  .mup-kit__instructor-bio-portal__edu-label {
    font-size: 0.75rem;
  }
}

.mup-kit__instructor-bio-portal__edu-text {
  display: block;
  margin: 0.75rem 0 0;
  padding: 0;
  font-family: var(--ao-font-body, "Instrument Sans", system-ui, sans-serif);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.625;
  color: var(--ao-text-secondary, #8b97b5);
}

@media (min-width: 640px) {
  .mup-kit__instructor-bio-portal__edu-text {
    font-size: 1.125rem;
  }
}

.mup-kit__instructor-bio-portal__footer {
  position: relative;
  z-index: 2;
  flex-shrink: 0;
  width: 100%;
  margin: 0;
  padding: 0.75rem 1rem;
  border: 0;
  border-top: 1px solid var(--ao-border-subtle, rgba(42, 54, 84, 0.6));
  background: color-mix(in srgb, var(--ao-canvas, #0a0e1a) 88%, transparent);
  backdrop-filter: blur(8px);
}

@media (min-width: 640px) {
  .mup-kit__instructor-bio-portal__footer {
    padding: 0.75rem 1.5rem;
  }
}

.mup-kit__instructor-bio-portal__footer-inner {
  display: flex;
  max-width: 42rem;
  margin: 0 auto;
  justify-content: flex-end;
}

.mup-kit__instructor-bio-portal__return {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0.625rem 1rem;
  border: 1px solid var(--ao-border-strong, #3d4a6b);
  border-radius: var(--ao-radius-md, 0.75rem);
  background: var(--ao-surface, #101625);
  box-shadow: none;
  cursor: pointer;
  font-family: var(--ao-font-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-text-primary, #f5f3ee);
  line-height: 1.2;
}

.mup-kit__instructor-bio-portal__return:hover,
.mup-kit__instructor-bio-portal__return:focus-visible {
  background: color-mix(in srgb, var(--ao-text-muted, #5c6b8f) 10%, transparent);
  outline: none;
}

body.mup-bio-portal-open {
  overflow: hidden;
}

.mup-kit__course-detail__nav {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--ao-border-subtle);
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

@media (min-width: 640px) {
  .mup-kit__course-detail__nav {
    font-size: 0.6875rem;
  }
}

.mup-kit__course-detail__nav-link {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0.375rem 0.75rem;
  border: 0;
  background: transparent;
  cursor: pointer;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  text-decoration: none;
  color: var(--ao-text-muted);
  transition: color var(--ao-duration-fast, 150ms) var(--ao-ease-standard, ease);
}

.mup-kit__course-detail__nav-link + .mup-kit__course-detail__nav-link {
  border-left: 1px solid var(--ao-border-subtle);
}

.mup-kit__course-detail__nav-link:hover {
  color: var(--ao-text-primary);
}

.mup-kit__course-detail__nav-link.is-active {
  color: var(--ao-brand);
  font-weight: 500;
}

.mup-kit__course-detail__panels {
  padding-top: 1.5rem;
}

@media (min-width: 640px) {
  .mup-kit__course-detail__panels {
    padding-top: 2rem;
  }
}

.mup-kit__course-detail__panel {
  padding: 0;
}

.mup-kit__course-detail__panel[hidden] {
  display: none !important;
}

.mup-kit__course-detail__panel-title {
  display: none;
}

.mup-kit__course-detail__text {
  max-width: 65ch;
  font-family: var(--ao-font-body);
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--ao-text-secondary);
}

.mup-kit__course-detail__text p {
  margin: 0 0 0.75rem;
}

.mup-kit__course-detail__text p:last-child {
  margin-bottom: 0;
}

@media (min-width: 640px) {
  .mup-kit__course-detail__text {
    font-size: 1rem;
  }
}

.mup-kit__course-detail__learn {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.625rem;
}

@media (min-width: 640px) {
  .mup-kit__course-detail__learn {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.mup-kit__course-detail__learn li {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-family: var(--ao-font-body);
  font-size: 0.875rem;
  line-height: 1.35;
  color: var(--ao-text-secondary);
}

.mup-kit__course-detail__learn li::before {
  content: "";
  flex-shrink: 0;
  width: 0.55rem;
  height: 0.3rem;
  margin-top: 0.35rem;
  border-left: 2px solid var(--ao-brand);
  border-bottom: 2px solid var(--ao-brand);
  transform: rotate(-45deg);
  transform-origin: center;
}

.mup-kit__course-detail__faq .mup-kit__faq-list__question {
  font-family: var(--ao-font-body);
  font-size: 0.9375rem;
  line-height: 1.45;
}

.mup-kit__course-detail__faq .mup-kit__faq-list__answer {
  font-family: var(--ao-font-body);
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--ao-text-secondary);
}

.mup-kit__course-detail__faq .mup-kit__faq-list__answer p {
  margin: 0 0 0.75rem;
}

.mup-kit__course-detail__faq .mup-kit__faq-list__answer p:last-child {
  margin-bottom: 0;
}

.mup-kit__course-detail__faq .mup-kit__faq-list__answer a {
  color: var(--ao-brand);
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

.mup-kit__course-detail__faq-more {
  margin: 1.25rem 0 0;
}

.mup-kit__course-detail__faq-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--ao-font-body);
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  color: var(--ao-text-primary);
  transition: color var(--ao-duration-fast) var(--ao-ease-standard);
}

.mup-kit__course-detail__faq-link:hover {
  color: var(--ao-brand);
}

.mup-kit__course-detail .mup-kit__curriculum {
  padding: 0;
}

.mup-kit__course-detail .mup-kit__curriculum__title,
.mup-kit__course-detail .mup-kit__curriculum__count,
.mup-kit__course-detail .mup-kit__curriculum__item-title {
  font-family: var(--ao-font-body);
}

.mup-kit__course-detail .mup-kit__curriculum__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--ao-text-primary);
}

.mup-kit__course-detail .mup-kit__curriculum__item-title {
  font-size: 0.875rem;
  line-height: 1.45;
}

/* -- Instructor roster / share card / page hero (Next parity) -- */

.mup-kit__category-instructors__grid {
  display: grid;
  gap: 0.75rem;
  margin: 1rem 0 0;
  padding: 0;
  list-style: none;
}

@media (min-width: 640px) {
  .mup-kit__category-instructors__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .mup-kit__category-instructors__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.25rem;
  }
}

/* About preview — 2 satır: mobil 2×2, desktop 4×2 */
.mup-kit__category-instructors__grid.is-preview-rows {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.mup-kit__category-instructors__grid.is-preview-rows > .mup-kit__category-instructors__item:nth-child(n+5) {
  display: none;
}

@media (min-width: 1024px) {
  .mup-kit__category-instructors__grid.is-preview-rows {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.25rem;
  }

  .mup-kit__category-instructors__grid.is-preview-rows > .mup-kit__category-instructors__item:nth-child(n+5) {
    display: list-item;
  }

  .mup-kit__category-instructors__grid.is-preview-rows > .mup-kit__category-instructors__item:nth-child(n+9) {
    display: none;
  }
}

.mup-kit__category-instructors__item {
  min-width: 0;
}

.mup-kit__instructor-card {
  position: relative;
  display: block;
  height: 22rem;
  min-width: 0;
  overflow: hidden;
  border-radius: var(--ao-radius-lg);
  background: var(--ao-canvas);
  text-decoration: none;
  color: inherit;
  container-type: inline-size;
}

@media (min-width: 640px) {
  .mup-kit__instructor-card {
    height: auto;
    aspect-ratio: 4 / 5;
  }
}

.mup-kit__instructor-card__depth,
.mup-kit__instructor-hero__depth {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    145deg,
    color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 18%, var(--ao-night-900)) 0%,
    var(--ao-night-900) 48%,
    var(--ao-night-950) 100%
  );
}

.mup-kit__instructor-card__grid,
.mup-kit__instructor-hero__grid {
  position: absolute;
  inset: 0;
  opacity: 0.13;
  background-image:
    linear-gradient(color-mix(in srgb, var(--ao-text-muted) 22%, transparent) 1px, transparent 1px),
    linear-gradient(90deg, color-mix(in srgb, var(--ao-text-muted) 22%, transparent) 1px, transparent 1px);
  background-size: 1.25rem 1.25rem;
  pointer-events: none;
}

.mup-kit__instructor-card:hover .mup-kit__instructor-card__grid {
  opacity: 0.17;
}

.mup-kit__instructor-card__fade,
.mup-kit__instructor-hero__fade {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 34%;
  background: linear-gradient(to top, var(--ao-canvas), color-mix(in srgb, var(--ao-canvas) 45%, transparent), transparent);
  pointer-events: none;
}

.mup-kit__instructor-card__spine,
.mup-kit__instructor-hero__spine {
  position: absolute;
  top: 18%;
  bottom: 18%;
  left: 0;
  width: 1px;
  opacity: 0.4;
  background: linear-gradient(180deg, transparent, var(--ao-cat-accent, var(--ao-brand)), transparent);
  pointer-events: none;
}

.mup-kit__instructor-card__mast,
.mup-kit__instructor-hero__mast {
  position: absolute;
  inset-inline: 0;
  top: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
}

.mup-kit__instructor-card__mast-left {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.mup-kit__instructor-card__index,
.mup-kit__instructor-card__count,
.mup-kit__instructor-hero__count {
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__instructor-card__count-n,
.mup-kit__instructor-hero__count-n,
.mup-kit__instructor-hero__stat-n {
  color: var(--ao-text-secondary);
  font-variant-numeric: tabular-nums;
}

.mup-kit__instructor-card__badge,
.mup-kit__instructor-hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ao-cat-accent, var(--ao-brand));
}

.mup-kit__instructor-card__dot,
.mup-kit__instructor-hero__dot {
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
}

.mup-kit__instructor-card__type {
  position: absolute;
  left: 1rem;
  top: 13%;
  z-index: 20;
  max-width: 66%;
}

.mup-kit__instructor-card__portrait {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 10;
  width: 62%;
  height: 72%;
}

.mup-kit__instructor-card__brand {
  position: absolute;
  left: 0.75rem;
  bottom: 0.75rem;
  z-index: 30;
  max-width: 58%;
}

.mup-kit__instructor-portrait {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}

.mup-kit__instructor-portrait__glow {
  position: absolute;
  right: -6%;
  bottom: 0;
  width: 92%;
  height: 78%;
  opacity: 0.95;
  background: radial-gradient(
    88% 92% at 82% 92%,
    color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 34%, transparent) 0%,
    color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 12%, transparent) 42%,
    transparent 72%
  );
  -webkit-mask-image: linear-gradient(128deg, transparent 8%, #000 48%, #000 100%);
  mask-image: linear-gradient(128deg, transparent 8%, #000 48%, #000 100%);
  pointer-events: none;
}

.mup-kit__instructor-portrait__slab {
  position: absolute;
  right: -10%;
  bottom: 0;
  width: 74%;
  height: 70%;
  transform: skewX(-7deg);
  background: linear-gradient(
    148deg,
    transparent 38%,
    color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 22%, transparent) 62%,
    color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 8%, transparent) 100%
  );
  pointer-events: none;
}

.mup-kit__instructor-portrait__media {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.mup-kit__instructor-portrait__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: var(--mup-portrait-slot-kit-position, center 22%);
  transform: translateY(8%);
  filter: drop-shadow(0 14px 24px rgba(0, 0, 0, 0.45));
}

.mup-kit__instructor-portrait__img.is-remote {
  transform-origin: center bottom;
  transform: scale(var(--mup-portrait-kit-remote-scale, 1.18)) translateY(var(--mup-portrait-kit-remote-translate-y, 12%));
}

.mup-kit__instructor-card.is-interactive:hover .mup-kit__instructor-portrait__img,
.mup-kit__instructor-portrait.is-interactive:hover .mup-kit__instructor-portrait__img {
  transform: scale(calc(var(--mup-portrait-kit-remote-scale, 1.18) * 1.03)) translate(-2%, 10%);
}

.mup-kit__instructor-portrait__fallback {
  position: absolute;
  right: 12%;
  bottom: 18%;
  display: grid;
  place-items: center;
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 50%;
  background: color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 18%, transparent);
  font-family: var(--ao-font-display);
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--ao-text-primary);
}

.mup-kit__instructor-stage {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.mup-kit__instructor-stage__title {
  margin: 0;
  font-family: var(--ao-font-display);
  font-weight: 600;
  color: var(--ao-text-primary);
  letter-spacing: -0.035em;
}

.mup-kit__instructor-stage--card .mup-kit__instructor-stage__title {
  filter: drop-shadow(0 2px 14px rgba(0, 0, 0, 0.5));
}

.mup-kit__instructor-stage--card.mup-kit__instructor-stage--short .mup-kit__instructor-stage__title {
  font-size: clamp(1.5625rem, 4cqi, 2.25rem);
  line-height: 1.02;
}

.mup-kit__instructor-stage--card.mup-kit__instructor-stage--mid .mup-kit__instructor-stage__title {
  font-size: clamp(1.25rem, 3.4cqi, 1.875rem);
  line-height: 1.06;
}

.mup-kit__instructor-stage--card.mup-kit__instructor-stage--long .mup-kit__instructor-stage__title {
  font-size: clamp(1rem, 2.8cqi, 1.4375rem);
  line-height: 1.1;
}

.mup-kit__instructor-stage--page.mup-kit__instructor-stage--short .mup-kit__instructor-stage__title {
  font-size: clamp(2rem, 4vw, 2.625rem);
  line-height: 1.04;
}

.mup-kit__instructor-stage--page.mup-kit__instructor-stage--mid .mup-kit__instructor-stage__title {
  font-size: clamp(1.625rem, 3.4vw, 2.125rem);
  line-height: 1.08;
}

.mup-kit__instructor-stage--page.mup-kit__instructor-stage--long .mup-kit__instructor-stage__title {
  font-size: clamp(1.375rem, 2.8vw, 1.875rem);
  line-height: 1.12;
}

.mup-kit__instructor-stage__hairline {
  display: block;
  width: 2.5rem;
  height: 1px;
  margin-top: 0.65rem;
  background: color-mix(in srgb, var(--ao-cat-accent, var(--ao-brand)) 55%, transparent);
}

.mup-kit__instructor-stage__spine {
  margin-top: 0.55rem;
}

.mup-kit__instructor-stage__role {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1.35;
  color: var(--ao-cat-accent, var(--ao-brand));
  opacity: 0.9;
}

.mup-kit__instructor-stage--page .mup-kit__instructor-stage__role {
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
}

.mup-kit__instructor-hero {
  position: relative;
  min-height: 22rem;
  overflow: hidden;
  border-radius: var(--ao-radius-lg);
}

@media (min-width: 640px) {
  .mup-kit__instructor-hero {
    min-height: 24rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__instructor-hero {
    min-height: 26rem;
  }
}

.mup-kit__instructor-hero__portrait {
  position: absolute;
  right: 0;
  bottom: 0;
  top: 10%;
  z-index: 10;
  width: 44%;
  max-width: 14rem;
}

@media (min-width: 640px) {
  .mup-kit__instructor-hero__portrait {
    top: 18%;
    width: 46%;
    max-width: 22rem;
  }
}

@media (min-width: 1024px) {
  .mup-kit__instructor-hero__portrait {
    top: 20%;
    max-width: 26rem;
  }
}

.mup-kit__instructor-hero__body {
  position: relative;
  z-index: 20;
  display: flex;
  flex-direction: column;
  min-height: inherit;
}

.mup-kit__instructor-hero__type {
  position: relative;
  z-index: 20;
  margin-top: 1.75rem;
  max-width: 64%;
  padding: 0 1rem;
}

@media (min-width: 640px) {
  .mup-kit__instructor-hero__type {
    max-width: min(34rem, 58%);
    padding: 0 1.75rem;
  }
}

.mup-kit__instructor-hero__bio {
  display: none;
  margin: 1rem 0 0;
  max-width: 42ch;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--ao-text-muted);
}

@media (min-width: 640px) {
  .mup-kit__instructor-hero__bio {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}

.mup-kit__instructor-hero__foot {
  position: relative;
  margin-top: auto;
  padding: 2rem 1rem 1rem;
}

@media (min-width: 640px) {
  .mup-kit__instructor-hero__foot {
    padding: 2rem 1.75rem 1.75rem;
  }
}

.mup-kit__instructor-hero__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.25rem;
  margin: 1rem 0 0;
  padding: 0;
  list-style: none;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__instructor-hero__stat--brand {
  color: var(--ao-brand);
}

.mup-kit__instructor-aside {
  position: relative;
}

@media (min-width: 1024px) {
  .mup-vitrin-page__split--instructor .mup-kit__instructor-aside,
  .mup-vitrin .mup-vitrin-page__split--instructor .mup-kit__instructor-aside {
    position: sticky;
    top: 5.5rem;
    padding-left: 1.5rem;
    border-left: 1px solid var(--ao-border-subtle);
  }
}

.mup-kit__instructor-aside__summary {
  min-width: 0;
}

.mup-kit__instructor-aside__name {
  margin: 0.35rem 0 0;
  font-family: var(--ao-font-display);
  font-size: 1.125rem;
  font-weight: 650;
  line-height: 1.2;
  color: var(--ao-text-primary);
}

.mup-kit__instructor-aside__position {
  margin: 0.35rem 0 0;
  font-family: var(--ao-font-body);
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--ao-text-muted);
}

.mup-kit__instructor-aside__stats {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 1.25rem 0 0;
  padding: 1rem 0 0;
  border-top: 1px solid var(--ao-border-subtle);
  list-style: none;
}

.mup-kit__instructor-aside__stats li {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-family: var(--ao-font-mono);
  font-size: 0.625rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ao-text-muted);
}

.mup-kit__instructor-aside__stat-n {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--ao-text-secondary);
}

.mup-kit__instructor-aside__stat--brand {
  color: var(--ao-brand);
}

.mup-kit__instructor-aside__stat--brand .mup-kit__instructor-aside__stat-n {
  color: var(--ao-brand);
}

.mup-kit__instructor-aside__actions {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 1.25rem;
}

.mup-kit__instructor-aside__actions .mup-kit__btn {
  width: 100%;
}

@media (min-width: 1024px) {
  .mup-vitrin-page__split--instructor .mup-vitrin-page__split-aside,
  .mup-vitrin .mup-vitrin-page__split--instructor .mup-wa-vitrin-page__split-aside {
    position: sticky;
    top: 5.5rem;
    align-self: start;
  }
}

.mup-kit__site-map {
  display: grid;
  gap: 2rem;
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 1px solid var(--ao-border-subtle);
}

@media (min-width: 768px) {
  .mup-kit__site-map {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2.5rem 3rem;
  }

  .mup-kit__site-map__xml {
    grid-column: 1 / -1;
  }
}

.mup-kit__site-map__section {
  min-width: 0;
}

.mup-kit__site-map__title {
  margin: 0 0 0.75rem;
  font-family: var(--ao-font-display);
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--ao-text-primary);
}

.mup-kit__site-map__links {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.35rem;
}

.mup-kit__site-map__links a {
  color: var(--ao-text-secondary);
  text-decoration: none;
  line-height: 1.45;
}

.mup-kit__site-map__links a:hover,
.mup-kit__site-map__links a:focus-visible {
  color: var(--ao-brand);
  text-decoration: underline;
}

.mup-kit__site-map__more {
  margin: 0.75rem 0 0;
  font-size: 0.875rem;
}

.mup-kit__site-map__more a {
  color: var(--ao-brand);
  font-weight: 600;
  text-decoration: none;
}

.mup-kit__site-map__more a:hover,
.mup-kit__site-map__more a:focus-visible {
  text-decoration: underline;
}

.mup-kit__site-map__xml {
  margin: 0;
  padding-top: 1.5rem;
  border-top: 1px solid var(--ao-border-subtle);
  font-size: 0.875rem;
  color: var(--ao-text-muted);
  line-height: 1.55;
}

.mup-kit__site-map__xml a {
  color: var(--ao-text-secondary);
  word-break: break-all;
}

/* Blog — yazılar listesi + detay */
.mup-kit__blog-list {
  margin-top: 2rem;
}

.mup-kit__blog-list__empty {
  margin: 0;
  color: var(--ao-text-muted);
  font-size: 1rem;
}

.mup-kit__blog-list__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

@media (min-width: 48rem) {
  .mup-kit__blog-list__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
  }
}

@media (min-width: 64rem) {
  .mup-kit__blog-list__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.mup-kit__blog-card {
  height: 100%;
}

.mup-kit__blog-card__link {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 1rem;
  border: 1px solid var(--ao-border-subtle);
  border-radius: 0.75rem;
  background: var(--ao-surface-raised, #fff);
  color: inherit;
  text-decoration: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.mup-kit__blog-card__link:hover,
.mup-kit__blog-card__link:focus-visible {
  border-color: var(--ao-border-strong, rgba(0, 0, 0, 0.12));
  box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.06);
}

.mup-kit__blog-card__media {
  display: block;
  margin-bottom: 0.875rem;
  overflow: hidden;
  border-radius: 0.5rem;
  aspect-ratio: 16 / 9;
  background: var(--ao-surface-muted, #f5f5f5);
}

.mup-kit__blog-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mup-kit__blog-card__cats {
  display: block;
  margin-bottom: 0.375rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ao-brand);
}

.mup-kit__blog-card__title {
  display: block;
  margin-bottom: 0.5rem;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.3;
}

.mup-kit__blog-card__excerpt {
  display: block;
  margin-bottom: 0.75rem;
  font-size: 0.9375rem;
  line-height: 1.55;
  color: var(--ao-text-muted);
}

.mup-kit__blog-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.75rem;
  margin-top: auto;
  font-size: 0.8125rem;
  color: var(--ao-text-secondary);
}

.mup-kit__blog-list__pager {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 2rem;
}

.mup-kit__blog-list__pager-link {
  font-weight: 600;
  color: var(--ao-brand);
  text-decoration: none;
}

.mup-kit__blog-list__pager-link:hover,
.mup-kit__blog-list__pager-link:focus-visible {
  text-decoration: underline;
}

.mup-kit__blog-post-hero {
  margin-bottom: 2rem;
}

.mup-kit__blog-post-hero__back {
  margin: 0 0 1rem;
  font-size: 0.875rem;
}

.mup-kit__blog-post-hero__back a {
  color: var(--ao-brand);
  text-decoration: none;
}

.mup-kit__blog-post-hero__back a:hover,
.mup-kit__blog-post-hero__back a:focus-visible {
  text-decoration: underline;
}

.mup-kit__blog-post-hero__grid {
  display: grid;
  gap: 1.5rem;
}

@media (min-width: 48rem) {
  .mup-kit__blog-post-hero__grid {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
    align-items: start;
  }
}

.mup-kit__blog-post-hero__cats {
  margin: 0 0 0.5rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ao-brand);
}

.mup-kit__blog-post-hero__title {
  margin: 0 0 0.75rem;
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  line-height: 1.15;
}

.mup-kit__blog-post-hero__lead {
  margin: 0 0 1rem;
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--ao-text-muted);
}

.mup-kit__blog-post-hero__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  margin: 0;
  font-size: 0.875rem;
  color: var(--ao-text-secondary);
}

.mup-kit__blog-post-hero__figure {
  margin: 0;
  overflow: hidden;
  border-radius: 0.75rem;
}

.mup-kit__blog-post-hero__image {
  display: block;
  width: 100%;
  height: auto;
}

.mup-kit__blog-post-content__body {
  max-width: 42rem;
  font-size: 1.0625rem;
  line-height: 1.7;
}

.mup-kit__blog-post-content__body > :first-child {
  margin-top: 0;
}

.mup-kit__blog-post-content__body > :last-child {
  margin-bottom: 0;
}

.mup-kit__blog-post-content__tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin: 2rem 0 0;
  padding-top: 1.5rem;
  border-top: 1px solid var(--ao-border-subtle);
  font-size: 0.875rem;
}

.mup-kit__blog-post-content__tags-label {
  font-weight: 600;
  color: var(--ao-text-secondary);
}

.mup-kit__blog-post-content__tag {
  padding: 0.25rem 0.625rem;
  border-radius: 999px;
  background: var(--ao-surface-muted, #f5f5f5);
  color: var(--ao-text-secondary);
}