:root {
  --accent-color: #0ee6b0;
  --kc-accent-2: #0b8f6a;
  --kc-accent-3: #2fd6a3;
  --kc-dark: #07101f;
  --kc-accent-soft: rgba(14, 230, 176, 0.16);
  --kc-card-border: rgba(255, 255, 255, 0.1);
}

.kellnercall-page .header .logo img,
.kellnercall-page .footer .logo img {
  object-fit: contain;
  border-radius: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
}

.kellnercall-page .header .header-container {
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.kellnercall-page .header .logo .sitename {
  font-size: 24px;
  margin: 0;
  font-weight: 700;
  color: var(--heading-color);
  font-family: var(--heading-font);
  line-height: 1;
}

/* KellnerCall Markenlogo – gemeinsame Detailseiten (8 Funktionen)
   Gleiche Dimensionen wie landing_home.php, ohne Template-Opacity */
.kellnercall-page .kc-brand-logo-link {
  position: relative;
  flex: 0 0 auto;
  overflow: hidden;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  line-height: 0;
}

.kellnercall-page .header .kc-brand-logo-link-header {
  width: 280px !important;
  min-width: 280px;
  height: 60px !important;
  min-height: 60px;
}

.kellnercall-page .header .kc-brand-logo-header {
  display: block;
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  object-fit: cover;
  object-position: center;
  transform: scale(2.62);
  transform-origin: center center;
  filter: none;
}

.kellnercall-page .kc-footer .kc-brand-logo-link-footer {
  width: 305px !important;
  min-width: 305px;
  height: 82px !important;
  min-height: 82px;
  margin-bottom: 18px;
}

.kellnercall-page .kc-footer .kc-brand-logo-footer {
  display: block;
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  object-fit: cover;
  object-position: center;
  transform: scale(2.52);
  transform-origin: center center;
  filter: none;
}

@media (max-width: 1199.98px) {
  .kellnercall-page .header .kc-brand-logo-link-header {
    width: 235px !important;
    min-width: 235px;
    height: 56px !important;
    min-height: 56px;
  }

  .kellnercall-page .header .kc-brand-logo-header {
    transform: scale(2.55);
  }
}

@media (max-width: 767.98px) {
  .kellnercall-page .header .kc-brand-logo-link-header {
    width: 190px !important;
    min-width: 190px;
    height: 50px !important;
    min-height: 50px;
  }

  .kellnercall-page .header .kc-brand-logo-header {
    transform: scale(2.45);
  }

  .kellnercall-page .kc-footer .kc-brand-logo-link-footer {
    width: 265px !important;
    min-width: 265px;
    height: 72px !important;
    min-height: 72px;
  }

  .kellnercall-page .kc-footer .kc-brand-logo-footer {
    transform: scale(2.42);
  }
}

@media (max-width: 420px) {
  .kellnercall-page .header .kc-brand-logo-link-header {
    width: 165px !important;
    min-width: 165px;
    height: 46px !important;
    min-height: 46px;
  }

  .kellnercall-page .header .kc-brand-logo-header {
    transform: scale(2.35);
  }
}

/* Landingpage Section 1: Navigation + Hero */
.kellnercall-page.scrolled .header {
  padding: 0;
  background: #060606;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .24);
}

.kellnercall-page.scrolled .header .header-container {
  border: 0;
  border-radius: 0;
  padding-top: 10px;
  padding-bottom: 10px;
  background: #060606;
  box-shadow: none;
}

@media (max-width: 575px) {
  .kellnercall-page.scrolled .header .header-container {
    border-radius: 0;
  }

  .kc-hero-metrics .kc-metric strong {
    font-size: 16px;
  }

  .kc-hero-metrics .kc-metric span {
    font-size: 12px;
  }
}

.kellnercall-page .badge-label,
.kellnercall-page .tag-label,
.kellnercall-page .featured-tag,
.kellnercall-page .banner-badge {
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.kellnercall-page .tag-label,
.kellnercall-page .badge-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-weight: 800;
  font-size: 12px;
  margin-bottom: 18px;
}

.kc-hero-section {
  position: relative;
  overflow: hidden;
}

.kc-hero-copy h1 {
  max-width: 760px;
  letter-spacing: -0.06em;
}

.kc-hero-copy p {
  max-width: 720px;
}

.kc-hero-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

.kc-hero-tags span {
  display: inline-flex;
  padding: 9px 13px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.13);
  background: rgba(255, 255, 255, 0.06);
  color: color-mix(in srgb, var(--default-color), transparent 12%);
  font-weight: 700;
  font-size: 13px;
}

.kc-product-visual {
  position: relative;
  width: 100%;
  max-width: 560px;
  min-height: 0;
  margin-inline: auto;
  border-radius: 34px;
  overflow: hidden;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.11);
  background: transparent !important;
  box-shadow: 0 38px 90px rgba(0,0,0,.28);
}

.kc-product-bg {
  position: relative;
  inset: auto;
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: contain;
  object-position: center;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}

/* Hero-Foto bewusst ohne Farb-/Dunkel-Overlay anzeigen. */
.kc-product-visual::before,
.kc-product-visual::after {
  content: none !important;
  display: none !important;
  background: none !important;
  opacity: 0 !important;
}

.kc-live-panel,
.kc-floating-card {
  position: relative;
  z-index: 2;
}

.kc-panel-main {
  max-width: 440px;
  margin: 82px auto 0;
  padding: 22px;
  border-radius: 26px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(10, 16, 32, .78);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow: 0 24px 60px rgba(0,0,0,.34);
}

.kc-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #fff;
  margin-bottom: 16px;
}

.kc-status-dot {
  width: 11px;
  height: 11px;
  border-radius: 999px;
  background: var(--kc-accent-3);
  box-shadow: 0 0 0 8px rgba(47, 214, 163, .12), 0 0 20px rgba(47,214,163,.7);
}

.kc-panel-header strong {
  margin-right: auto;
}

.kc-panel-header small {
  opacity: .62;
}

.kc-call-row {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.075);
  color: #fff;
  margin-top: 10px;
}

.kc-call-row.is-new {
  background: rgba(14, 230, 176, .20);
  border: 1px solid rgba(14, 230, 176, .24);
}

.kc-call-row i {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: rgba(255,255,255,.10);
  color: var(--accent-color);
  font-size: 20px;
}

.kc-call-row strong,
.kc-call-row span,
.kc-call-row em {
  display: block;
}

.kc-call-row span,
.kc-call-row em {
  color: rgba(255,255,255,.64);
  font-style: normal;
  font-size: 13px;
}

.kc-floating-card {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.11);
  color: #fff;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  font-weight: 800;
  line-height: 1.15;
}

.kc-floating-card i {
  font-size: 24px;
  color: var(--accent-color);
}

.kc-float-1 {
  left: 28px;
  bottom: 58px;
}

.kc-float-2 {
  right: 28px;
  top: 58px;
}

.kc-hero-metrics .kc-metric {
  height: 100%;
  padding: 22px 18px;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.055);
  text-align: center;
}

.kc-metric-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  margin: 0 auto 15px;
  border-radius: 18px;
  background: rgba(14, 230, 176, .12);
  color: var(--accent-color);
  font-size: 30px;
  line-height: 1;
}

.kc-metric strong,
.kc-metric span {
  display: block;
}

.kc-metric strong {
  color: var(--heading-color);
  font-size: clamp(18px, 1.7vw, 24px);
  line-height: 1.15;
  letter-spacing: -0.025em;
}

.kc-metric span {
  margin-top: 9px;
  color: color-mix(in srgb, var(--default-color), transparent 22%);
  font-weight: 600;
  font-size: 13px;
  line-height: 1.4;
}

.kc-problem-card,
.kc-module-card,
.kc-solution-item,
.kc-contact-panel,
.kc-dashboard-mockup,
.kc-photo-card,
.kc-step-card,
.kc-pricing-card {
  height: 100%;
  border-radius: 24px;
  border: 1px solid var(--kc-card-border);
  background: color-mix(in srgb, var(--surface-color), transparent 5%);
  box-shadow: 0 16px 40px rgba(0,0,0,.12);
}

.kc-problem-card,
.kc-module-card,
.kc-solution-item,
.kc-contact-panel {
  padding: 30px;
}

.kc-problem-card i,
.kc-module-card > i,
.kc-solution-item i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 18px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 25px;
  margin-bottom: 22px;
}

.kc-problem-card h3,
.kc-module-card h3,
.kc-solution-item h3 {
  font-size: 21px;
  letter-spacing: -0.03em;
  margin-bottom: 12px;
}

.kc-problem-card p,
.kc-module-card p,
.kc-solution-item p,
.kc-contact-panel p {
  color: color-mix(in srgb, var(--default-color), transparent 18%);
}

.kc-problem-card {
  position: relative;
  overflow: hidden;
  padding: 32px;
}

.kc-problem-card > i {
  width: 62px;
  height: 62px;
  border-radius: 20px;
  font-size: 29px;
  margin-bottom: 22px;
}

.kc-problem-index {
  position: absolute;
  top: 22px;
  right: 24px;
  color: color-mix(in srgb, var(--accent-color), transparent 46%);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .12em;
}

.kc-problem-card h3 {
  max-width: 88%;
  margin-bottom: 10px;
}

.kc-problem-card p {
  max-width: 94%;
  margin-bottom: 0;
  line-height: 1.6;
}

.kc-problem-bridge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  width: 100%;
  margin-top: 34px;
  color: color-mix(in srgb, var(--default-color), transparent 12%);
  font-weight: 700;
}

.kc-problem-bridge i {
  color: var(--accent-color);
  font-size: 24px;
  flex: 0 0 auto;
}

.kc-solution-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.kc-check-list {
  display: grid;
  gap: 12px;
  margin-top: 24px;
}

.kc-check-list span,
.kc-contact-points span {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-weight: 700;
  color: color-mix(in srgb, var(--default-color), transparent 12%);
}

.kc-check-list i,
.kc-contact-points i {
  color: var(--accent-color);
  font-size: 20px;
  flex: 0 0 auto;
}

.kc-module-card ul {
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}

.kc-module-card li {
  position: relative;
  padding-left: 24px;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
}

.kc-module-card li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--accent-color);
  font-weight: 900;
}

.kc-step-card {
  position: relative;
  padding: 34px 26px;
  overflow: hidden;
}

.kc-step-card::before {
  content: "";
  position: absolute;
  width: 160px;
  height: 160px;
  right: -88px;
  top: -88px;
  background: radial-gradient(circle, var(--kc-accent-soft), transparent 70%);
}

.kc-step-card span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 999px;
  color: #000;
  background: var(--accent-color);
  font-weight: 900;
  margin-bottom: 20px;
}

.kc-step-card i {
  display: block;
  color: var(--accent-color);
  font-size: 34px;
  margin-bottom: 20px;
}

.kc-step-card h4 {
  margin-bottom: 12px;
}

.kc-step-card p {
  margin-bottom: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
}

.kc-dashboard-mockup {
  overflow: hidden;
  background: #0b1325;
  color: #fff;
}

.kc-browser-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 16px 18px;
  border-bottom: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.05);
}

.kc-browser-bar span {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.30);
}

.kc-browser-bar strong {
  margin-left: 10px;
  font-size: 13px;
  color: rgba(255,255,255,.72);
}

.kc-mock-grid {
  display: grid;
  grid-template-columns: 170px 1fr;
  min-height: 420px;
}

.kc-mock-sidebar {
  padding: 24px;
  background: rgba(255,255,255,.045);
  border-right: 1px solid rgba(255,255,255,.10);
  display: grid;
  align-content: start;
  gap: 14px;
}

.kc-mock-sidebar b {
  color: #fff;
  margin-bottom: 12px;
}

.kc-mock-sidebar span {
  color: rgba(255,255,255,.66);
  font-size: 14px;
}

.kc-mock-content {
  padding: 24px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  align-content: start;
}

.kc-mock-card {
  min-height: 116px;
  padding: 20px;
  border-radius: 20px;
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.11);
}

.kc-mock-card.wide {
  grid-column: 1 / -1;
  background: linear-gradient(135deg, rgba(14,230,176,.28), rgba(9,151,113,.18));
}

.kc-mock-card strong,
.kc-mock-card span,
.kc-mock-card em {
  display: block;
}

.kc-mock-card span,
.kc-mock-card em {
  margin-top: 12px;
  color: rgba(255,255,255,.68);
  font-style: normal;
}

.kc-photo-card {
  overflow: hidden;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-photo-card img {
  width: 100%;
  height: 280px;
  object-fit: cover;
}

.kc-photo-caption {
  padding: 28px;
}

.kc-photo-caption p {
  margin-bottom: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
}

.kc-benefit-img {
  margin-top: 28px;
  border: 1px solid var(--kc-card-border);
  box-shadow: 0 20px 44px rgba(0,0,0,.18);
}

.kc-benefit-list {
  display: grid;
  gap: 16px;
}

.kc-benefit-list > div {
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 18px;
  padding: 24px;
  border-radius: 22px;
  border: 1px solid var(--kc-card-border);
  background: color-mix(in srgb, var(--surface-color), transparent 4%);
}

.kc-benefit-list i {
  width: 58px;
  height: 58px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 25px;
  grid-row: span 2;
}

.kc-benefit-list h3 {
  margin-bottom: 4px;
  font-size: 21px;
}

.kc-benefit-list p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
}

.kc-contact-points {
  display: grid;
  gap: 12px;
  margin-top: 24px;
}

.kc-contact-section .form-panel {
  border: 1px solid var(--kc-card-border);
}

.kc-faq-section .accordion-item {
  color: var(--default-color);
  background: var(--surface-color);
  border: 1px solid rgba(255, 255, 255, 0.09);
  margin-bottom: 14px;
  border-radius: 18px;
  overflow: hidden;
}

.kc-faq-section .accordion-button {
  color: var(--heading-color);
  background: color-mix(in srgb, var(--surface-color), #ffffff 4%);
  box-shadow: none;
  font-weight: 800;
  padding: 20px 24px;
}

.kc-faq-section .accordion-button:not(.collapsed) {
  color: var(--accent-color);
  background: color-mix(in srgb, var(--surface-color), #ffffff 7%);
}

.kc-faq-section .accordion-button::after {
  filter: invert(1);
}

.kc-faq-section .accordion-body {
  padding: 0 24px 22px;
  color: color-mix(in srgb, var(--default-color), transparent 12%);
}

.kc-honeypot {
  position: absolute !important;
  left: -9999px !important;
  opacity: 0 !important;
  width: 1px !important;
  height: 1px !important;
  pointer-events: none !important;
}

.kellnercall-page .footer .footer-contact p {
  margin-bottom: 6px;
}

.kc-login-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at 12% 8%, rgba(14,230,176,.15), transparent 31%),
    radial-gradient(circle at 91% 14%, rgba(9,151,113,.10), transparent 32%),
    var(--background-color);
  color: var(--default-color);
}

.kc-login-page::before {
  display: none;
}

.kc-login-page .login-shell {
  position: relative;
  z-index: 1;
  min-height: calc(100vh - 90px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 54px 16px 72px;
  background: transparent;
}

.kc-login-page .login-wrap {
  max-width: 560px;
  width: 100%;
  margin: 0 auto;
}

.kc-login-page .login-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.kc-login-page .kc-login-main-logo-link {
  display: block;
  width: min(360px, 84vw);
  height: 94px;
  overflow: visible;
  margin: 0 auto 12px;
  line-height: 0;
  background: transparent;
}

.kc-login-page .kc-login-main-logo {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  object-fit: contain;
  object-position: center;
  transform: scale(2.00);
  transform-origin: center center;
}

.kc-login-page .login-brand p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 34%);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.kc-login-page .login-card {
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 22px;
  box-shadow: 0 28px 80px rgba(0,0,0,.34);
  overflow: hidden;
  background: rgba(255,255,255,.96);
  color: #172033;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.kc-login-page .nav-tabs {
  border-bottom: 0;
  background: #f1f3f5;
  padding: 8px;
  gap: 8px;
}

.kc-login-page .nav-tabs .nav-link {
  border: 0;
  border-radius: 14px;
  color: #198754;
  font-weight: 850;
  width: 100%;
  min-height: 46px;
}

.kc-login-page .nav-tabs .nav-link.active {
  background: #198754;
  color: #fff;
  box-shadow: 0 3px 10px rgba(25,135,84,.25);
}

.kc-login-page .tab-pane {
  padding: 22px;
}

.kc-login-page .form-control {
  border-radius: 12px;
  min-height: 46px;
}

.kc-login-page .form-label {
  font-weight: 400;
}

.kc-login-page .btn {
  border-radius: 12px;
  font-weight: 850;
  min-height: 48px;
}

.kc-login-page .small-hint {
  font-size: 13px;
}




.kc-pricing-section .section-title p {
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}

.kc-pricing-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 32px;
  border-radius: 26px;
  border: 1px solid var(--kc-card-border);
  background: color-mix(in srgb, var(--surface-color), transparent 4%);
  box-shadow: 0 18px 46px rgba(0,0,0,.16);
  overflow: hidden;
}

.kc-pricing-card::before {
  content: "";
  position: absolute;
  width: 210px;
  height: 210px;
  right: -120px;
  top: -120px;
  background: radial-gradient(circle, var(--kc-accent-soft), transparent 70%);
  pointer-events: none;
}

.kc-pricing-card.featured {
  border-color: rgba(14, 230, 176, .46);
  box-shadow: 0 24px 70px rgba(14,230,176,.12), 0 18px 46px rgba(0,0,0,.16);
  transform: translateY(-8px);
}

.kc-price-badge {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-self: flex-start;
  padding: 8px 13px;
  border-radius: 999px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 18px;
}

.kc-pricing-card h3,
.kc-pricing-card p,
.kc-pricing-card .kc-price,
.kc-pricing-card ul,
.kc-pricing-card .btn {
  position: relative;
  z-index: 1;
}

.kc-pricing-card h3 {
  font-size: 28px;
  letter-spacing: -.04em;
  margin-bottom: 10px;
}

.kc-pricing-card p {
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  min-height: 74px;
}

.kc-price {
  display: flex;
  align-items: flex-end;
  gap: 7px;
  margin: 18px 0 24px;
}

.kc-price span {
  color: var(--accent-color);
  font-weight: 900;
  font-size: 24px;
  line-height: 1.8;
}

.kc-price strong {
  color: var(--heading-color);
  font-size: clamp(46px, 5vw, 66px);
  line-height: .9;
  letter-spacing: -.06em;
}

.kc-price em {
  font-style: normal;
  color: color-mix(in srgb, var(--default-color), transparent 26%);
  font-weight: 700;
  margin-bottom: 6px;
}

.kc-pricing-card ul {
  list-style: none;
  padding: 0;
  margin: 0 0 28px;
  display: grid;
  gap: 12px;
}

.kc-pricing-card li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: color-mix(in srgb, var(--default-color), transparent 12%);
  font-weight: 650;
}

.kc-pricing-card li i {
  color: var(--accent-color);
  font-size: 19px;
  flex: 0 0 auto;
  margin-top: 1px;
}

.kc-pricing-card .btn {
  margin-top: auto;
}

.kc-login-page .kc-login-shared-header {
  position: sticky !important;
  top: 0;
  z-index: 1050;
}

.kc-login-page .navmenu a,
.kc-login-page .navmenu a:focus {
  color: rgba(255,255,255,.78);
}

.kc-login-page .navmenu a:hover,
.kc-login-page .navmenu .active,
.kc-login-page .navmenu .active:focus {
  color: var(--accent-color);
}

.kc-login-page .btn-getstarted,
.kc-login-page .btn-getstarted:focus {
  background: var(--accent-color);
  color: #00130e;
}

.kc-login-page .btn-getstarted:hover,
.kc-login-page .btn-getstarted:focus:hover {
  background: color-mix(in srgb, var(--accent-color), transparent 18%);
  color: #00130e;
}

.kc-login-page.mobile-nav-active .navmenu {
  background: var(--nav-mobile-background-color);
}

@media (max-width: 991px) {
  .kc-pricing-card.featured {
    transform: none;
  }

  .kc-product-visual {
    min-height: 0;
  }

  .kc-solution-grid {
    grid-template-columns: 1fr;
  }

  .kc-mock-grid {
    grid-template-columns: 1fr;
  }

  .kc-mock-sidebar {
    border-right: 0;
    border-bottom: 1px solid rgba(255,255,255,.10);
  }
}

@media (max-width: 575px) {
  .kellnercall-page .hero-actions {
    display: grid;
    gap: 12px;
  }

  .kc-product-visual {
    min-height: 0;
    padding: 0;
    border-radius: 24px;
  }

  .kc-panel-main {
    margin-top: 70px;
    padding: 16px;
  }

  .kc-floating-card {
    font-size: 12px;
    padding: 10px 12px;
  }

  .kc-float-1 {
    left: 12px;
    bottom: 20px;
  }

  .kc-float-2 {
    right: 12px;
    top: 20px;
  }

  .kc-mock-content {
    grid-template-columns: 1fr;
  }

  .kc-benefit-list > div {
    grid-template-columns: 1fr;
  }
}


/* Module detail links and subpages */
.kc-module-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 22px;
  color: var(--accent-color);
  font-weight: 850;
  text-decoration: none;
}

.kc-module-link:hover {
  color: color-mix(in srgb, var(--accent-color), #ffffff 18%);
}

.kc-module-link i {
  font-size: 22px;
  transition: transform .2s ease;
}

.kc-module-link:hover i {
  transform: translateX(3px);
}

.kc-module-detail-page .header .logo img,
.kc-module-detail-page .footer .logo img {
  object-fit: contain;
  border-radius: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
}

.kc-module-detail-page .header .logo .sitename {
  font-size: 24px;
  margin: 0;
  font-weight: 800;
  color: var(--heading-color);
  font-family: var(--heading-font);
  line-height: 1;
}

.kc-module-hero {
  position: relative;
  padding-top: 170px;
  padding-bottom: 72px;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 10%, rgba(14,230,176,.18), transparent 34%),
    radial-gradient(circle at 90% 18%, rgba(9,151,113,.14), transparent 34%);
}

.kc-module-hero .badge-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-weight: 850;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 18px;
}

.kc-module-hero h1 {
  max-width: 920px;
  font-size: clamp(40px, 6vw, 78px);
  line-height: .98;
  letter-spacing: -.06em;
}

.kc-module-hero .lead {
  max-width: 820px;
  color: color-mix(in srgb, var(--default-color), transparent 12%);
}

.kc-module-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.kc-module-visual {
  border-radius: 32px;
  overflow: hidden;
  border: 1px solid var(--kc-card-border);
  box-shadow: 0 28px 70px rgba(0,0,0,.18);
  background: var(--surface-color);
}

.kc-module-visual img {
  width: 100%;
  height: 100%;
  min-height: 380px;
  object-fit: cover;
}

.kc-detail-card,
.kc-detail-step,
.kc-detail-note,
.kc-detail-feature-card,
.kc-detail-screenshot {
  border-radius: 24px;
  border: 1px solid var(--kc-card-border);
  background: color-mix(in srgb, var(--surface-color), transparent 4%);
  box-shadow: 0 16px 42px rgba(0,0,0,.12);
}

.kc-detail-card,
.kc-detail-step,
.kc-detail-note,
.kc-detail-feature-card {
  padding: 28px;
  height: 100%;
}

.kc-detail-card i,
.kc-detail-step i,
.kc-detail-feature-card i {
  width: 54px;
  height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 24px;
  margin-bottom: 18px;
}

.kc-detail-list {
  display: grid;
  gap: 12px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.kc-detail-list li {
  position: relative;
  padding-left: 28px;
  color: color-mix(in srgb, var(--default-color), transparent 12%);
}

.kc-detail-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--accent-color);
  font-weight: 900;
}

.kc-detail-step-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background: var(--accent-color);
  color: #00130e;
  font-weight: 900;
  margin-bottom: 18px;
}

.kc-detail-note {
  background:
    radial-gradient(circle at 0% 0%, var(--kc-accent-soft), transparent 42%),
    color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-detail-screenshot {
  overflow: hidden;
}

.kc-detail-screenshot img {
  width: 100%;
  height: 260px;
  object-fit: cover;
}

.kc-detail-screenshot div {
  padding: 24px;
}

.kc-detail-cta {
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  padding: clamp(34px, 5vw, 62px);
  background:
    radial-gradient(circle at 12% 18%, rgba(14,230,176,.25), transparent 34%),
    linear-gradient(135deg, #07101f, #0c1f29);
  color: #fff;
}

.kc-detail-cta h2,
.kc-detail-cta p {
  color: #fff;
}

.kc-detail-cta p {
  opacity: .76;
}

@media (max-width: 991px) {
  .kc-module-hero {
    padding-top: 140px;
  }
}

@media (max-width: 575px) {
  .kc-module-hero-actions {
    display: grid;
  }

  .kc-module-visual img {
    min-height: 260px;
  }
}


@media (max-width: 575.98px) {
  .kc-problem-card {
    padding: 26px 24px;
  }

  .kc-problem-card > i {
    width: 56px;
    height: 56px;
    font-size: 26px;
  }

  .kc-problem-index {
    top: 19px;
    right: 20px;
  }

  .kc-problem-card h3,
  .kc-problem-card p {
    max-width: 100%;
  }

  .kc-problem-bridge {
    align-items: flex-start;
    text-align: left;
    margin-top: 26px;
    font-size: 14px;
  }
}


/* Landingpage Section 4: Funktionen / Module */
.kc-modules-section .kc-module-card {
  padding: 26px;
}

.kc-modules-section .kc-module-card > i {
  width: 52px;
  height: 52px;
  margin-bottom: 19px;
}

.kc-modules-section .kc-module-card h3 {
  font-size: 19px;
  line-height: 1.18;
  margin-bottom: 10px;
}

.kc-modules-section .kc-module-card p {
  font-size: 14px;
  line-height: 1.55;
  margin-bottom: 0;
}

.kc-modules-section .kc-module-card ul {
  margin-top: 16px;
  gap: 7px;
}

.kc-modules-section .kc-module-card li {
  font-size: 13.5px;
  line-height: 1.45;
}

.kc-modules-section .kc-module-link {
  margin-top: 20px;
}

@media (max-width: 575.98px) {
  .kc-modules-section .kc-module-card {
    padding: 26px 24px;
  }

  .kc-modules-section .kc-module-card h3 {
    font-size: 20px;
  }

  .kc-modules-section .kc-module-card p,
  .kc-modules-section .kc-module-card li {
    font-size: 14px;
  }
}


/* Landingpage Section 5: Workflow */
.kc-step-card-visual {
  padding: 0 0 28px;
  overflow: hidden;
}

.kc-step-card-visual::before {
  width: 190px;
  height: 190px;
  right: -110px;
  top: 110px;
}

.kc-step-media {
  margin-bottom: 22px;
  border-bottom: 1px solid var(--kc-card-border);
  background: rgba(255,255,255,.02);
}

.kc-step-media img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.kc-step-card-visual > p,
.kc-step-heading {
  margin-left: 26px;
  margin-right: 26px;
}

.kc-step-heading {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.kc-step-heading i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
  margin: 0;
  border-radius: 15px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 23px;
}

.kc-step-heading h4 {
  margin: 0;
  font-size: 21px;
  line-height: 1.2;
}

.kc-step-card-visual > p {
  line-height: 1.65;
  margin-bottom: 0;
}

@media (max-width: 575.98px) {
  .kc-step-card-visual {
    padding-bottom: 24px;
  }

  .kc-step-card-visual > p,
  .kc-step-heading {
    margin-left: 22px;
    margin-right: 22px;
  }

  .kc-step-heading {
    gap: 10px;
  }

  .kc-step-heading i {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    font-size: 21px;
  }

  .kc-step-heading h4 {
    font-size: 19px;
  }
}


/* Landingpage Section 6: Einblicke ins System */
.kc-system-shot {
  overflow: hidden;
  border: 1px solid var(--kc-card-border);
  border-radius: 24px;
  background: color-mix(in srgb, var(--surface-color), transparent 4%);
  box-shadow: 0 18px 46px rgba(0,0,0,.14);
}

.kc-system-shot-main {
  display: flex;
  flex-direction: column;
}

.kc-system-shot-stack {
  display: grid;
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.kc-system-shot-frame {
  position: relative;
  overflow: hidden;
  min-height: 205px;
  background:
    radial-gradient(circle at 18% 18%, rgba(14,230,176,.16), transparent 32%),
    linear-gradient(145deg, #0b1420, #101d2a);
  border-bottom: 1px solid var(--kc-card-border);
}

.kc-system-shot-frame-main {
  flex: 1 1 auto;
  min-height: 470px;
}

.kc-system-shot-frame img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: inherit;
  object-fit: cover;
  object-position: top center;
}

.kc-system-shot-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 30px;
  text-align: center;
}

.kc-system-shot-placeholder i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  margin-bottom: 4px;
  border-radius: 22px;
  background: rgba(14,230,176,.12);
  color: var(--accent-color);
  font-size: 31px;
}

.kc-system-shot-placeholder strong {
  color: var(--heading-color);
  font-size: 23px;
  letter-spacing: -.025em;
}

.kc-system-shot-placeholder span {
  color: color-mix(in srgb, var(--default-color), transparent 42%);
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.kc-system-shot-caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 24px 26px;
}

.kc-system-shot-caption h3 {
  margin: 3px 0 0;
  font-size: 22px;
}

.kc-system-shot-caption p {
  max-width: 255px;
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  font-size: 14px;
  line-height: 1.45;
  text-align: right;
}

.kc-system-shot-label {
  display: block;
  color: var(--accent-color);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .1em;
}

.kc-system-shot-caption-compact {
  padding: 18px 20px;
}

.kc-system-shot-caption-compact h3 {
  font-size: 18px;
}

.kc-system-shot-caption-compact p {
  max-width: 190px;
  font-size: 13px;
}

@media (max-width: 991.98px) {
  .kc-system-shot-frame-main {
    min-height: 390px;
  }

  .kc-system-shot-stack {
    grid-template-rows: none;
  }

  .kc-system-shot-frame {
    min-height: 300px;
  }
}

@media (max-width: 575.98px) {
  .kc-system-shot-frame-main,
  .kc-system-shot-frame {
    min-height: 240px;
  }

  .kc-system-shot-caption,
  .kc-system-shot-caption-compact {
    display: block;
    padding: 20px 21px;
  }

  .kc-system-shot-caption p,
  .kc-system-shot-caption-compact p {
    max-width: none;
    margin-top: 8px;
    text-align: left;
  }
}


/* Landingpage Section 7: Warum es hilft */
.kc-benefits-section .kc-benefit-img {
  display: block;
  width: 100%;
  margin-top: 28px;
  aspect-ratio: 1.15 / 1;
  object-fit: cover;
  object-position: center;
  border: 1px solid var(--kc-card-border);
  box-shadow: 0 18px 46px rgba(0,0,0,.15);
}

.kc-benefit-list-results {
  gap: 0;
}

.kc-benefit-list-results > div {
  position: relative;
  min-height: 128px;
  padding: 24px 0 24px 78px;
  border-bottom: 1px solid var(--kc-card-border);
}

.kc-benefit-list-results > div:last-child {
  border-bottom: 0;
}

.kc-benefit-list-results > div > i {
  position: absolute;
  left: 0;
  top: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  border-radius: 18px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 26px;
}

.kc-benefit-list-results h3 {
  margin-bottom: 7px;
  font-size: 21px;
}

.kc-benefit-list-results p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  line-height: 1.55;
}

.kc-benefit-note {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 34px;
  padding-top: 24px;
  border-top: 1px solid var(--kc-card-border);
  color: color-mix(in srgb, var(--default-color), transparent 12%);
  font-weight: 700;
}

.kc-benefit-note i {
  color: var(--accent-color);
  font-size: 22px;
  flex: 0 0 auto;
}

@media (max-width: 575.98px) {
  .kc-benefits-section .kc-benefit-img {
    margin-top: 22px;
    aspect-ratio: 1 / 1;
  }

  .kc-benefit-list-results > div {
    min-height: 0;
    padding: 20px 0 20px 66px;
  }

  .kc-benefit-list-results > div > i {
    top: 20px;
    width: 50px;
    height: 50px;
    font-size: 23px;
  }

  .kc-benefit-list-results h3 {
    font-size: 19px;
  }

  .kc-benefit-note {
    align-items: flex-start;
    font-size: 14px;
  }
}


/* Landingpage Section 7 V1c: CSS-Fix Nutzen-Sektion */
.kc-benefit-list-results {
  display: grid;
  gap: 14px;
}

.kc-benefit-list-results > div {
  display: block;
  position: relative;
  min-height: 132px;
  padding: 25px 28px 25px 104px;
  border: 1px solid var(--kc-card-border);
  border-radius: 22px;
  background: color-mix(in srgb, var(--surface-color), transparent 4%);
}

.kc-benefit-list-results > div:last-child {
  border-bottom: 1px solid var(--kc-card-border);
}

.kc-benefit-list-results > div > i {
  position: absolute;
  left: 27px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  margin: 0;
  border-radius: 18px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 25px;
  grid-row: auto;
}

.kc-benefit-list-results h3 {
  margin: 0 0 8px;
  font-size: 21px;
  line-height: 1.25;
}

.kc-benefit-list-results p {
  margin: 0;
  line-height: 1.55;
}

.kc-benefits-section .kc-benefit-img {
  width: 100%;
  aspect-ratio: 1.15 / 1;
  object-fit: cover;
  object-position: center;
  background: transparent;
}

@media (max-width: 575.98px) {
  .kc-benefit-list-results {
    gap: 12px;
  }

  .kc-benefit-list-results > div {
    padding: 21px 20px 21px 82px;
    min-height: 112px;
  }

  .kc-benefit-list-results > div > i {
    left: 20px;
    width: 48px;
    height: 48px;
    border-radius: 15px;
    font-size: 22px;
  }

  .kc-benefit-list-results h3 {
    font-size: 19px;
  }
}


/* Landingpage Section 8: Preise */
.kc-pricing-section .section-title {
  margin-bottom: 46px;
}

.kc-pricing-card {
  padding: 34px;
}

.kc-pricing-card.featured {
  border-color: color-mix(in srgb, var(--accent-color), transparent 48%);
}

.kc-pricing-heading {
  position: relative;
  z-index: 1;
  min-height: 68px;
}

.kc-pricing-heading h3 {
  margin-bottom: 7px;
}

.kc-pricing-recommended {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--accent-color);
  font-size: 12px;
  font-weight: 850;
}

.kc-pricing-description {
  min-height: 86px !important;
  margin-bottom: 0;
  line-height: 1.55;
}

.kc-pricing-divider {
  position: relative;
  z-index: 1;
  height: 1px;
  margin: 0 0 24px;
  background: var(--kc-card-border);
}

.kc-pricing-card ul {
  margin-bottom: 30px;
}

.kc-pricing-card li {
  line-height: 1.45;
}

.kc-pricing-cta {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  width: 100%;
  min-height: 54px;
  margin-top: auto;
  padding: 14px 18px;
  border: 1px solid color-mix(in srgb, var(--accent-color), transparent 34%);
  border-radius: 15px;
  background: var(--accent-color);
  color: #00130e;
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 12px 28px rgba(14,230,176,.12);
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.kc-pricing-cta:hover,
.kc-pricing-cta:focus {
  color: #00130e;
  background: color-mix(in srgb, var(--accent-color), white 10%);
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(14,230,176,.18);
}

.kc-pricing-cta i {
  font-size: 19px;
}

.kc-pricing-card.featured .kc-pricing-cta {
  box-shadow: 0 16px 36px rgba(14,230,176,.2);
}

.kc-pricing-cta-note {
  position: relative;
  z-index: 1;
  display: block;
  margin-top: 10px;
  color: color-mix(in srgb, var(--default-color), transparent 38%);
  font-size: 12px;
  font-weight: 650;
  text-align: center;
}

.kc-pricing-footnote {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 28px;
}

.kc-pricing-footnote > div {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 18px 20px;
  border: 1px solid var(--kc-card-border);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface-color), transparent 6%);
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  font-size: 13px;
  line-height: 1.5;
}

.kc-pricing-footnote i {
  flex: 0 0 auto;
  margin-top: 1px;
  color: var(--accent-color);
  font-size: 19px;
}

@media (max-width: 991.98px) {
  .kc-pricing-description,
  .kc-pricing-heading {
    min-height: 0 !important;
  }

  .kc-pricing-footnote {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 575.98px) {
  .kc-pricing-card {
    padding: 27px 24px;
  }

  .kc-pricing-section .section-title {
    margin-bottom: 34px;
  }

  .kc-pricing-cta {
    min-height: 52px;
  }
}


/* Landingpage Section 9: FAQ */
.kc-faq-section .section-title {
  max-width: 780px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 42px;
}

.kc-faq-accordion {
  max-width: 980px;
  margin: 0 auto;
}

.kc-faq-section .kc-faq-accordion .accordion-item {
  margin-bottom: 12px;
  border-color: var(--kc-card-border);
  box-shadow: 0 10px 28px rgba(0,0,0,.08);
}

.kc-faq-section .kc-faq-accordion .accordion-button {
  display: flex;
  align-items: center;
  gap: 15px;
  min-height: 68px;
  padding: 18px 22px;
  line-height: 1.35;
}

.kc-faq-section .kc-faq-accordion .accordion-button:not(.collapsed) {
  color: var(--heading-color);
  background: color-mix(in srgb, var(--surface-color), var(--accent-color) 5%);
}

.kc-faq-section .kc-faq-accordion .accordion-button:not(.collapsed) .kc-faq-question-index {
  background: var(--accent-color);
  color: #00130e;
}

.kc-faq-question-index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  border-radius: 11px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .04em;
  transition: background .2s ease, color .2s ease;
}

.kc-faq-section .kc-faq-accordion .accordion-body {
  padding: 18px 74px 26px;
  line-height: 1.7;
}

.kc-faq-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 34px;
  max-width: 980px;
  margin: 34px auto 0;
  padding: 28px 30px;
  border: 1px solid color-mix(in srgb, var(--accent-color), transparent 70%);
  border-radius: 22px;
  background:
    radial-gradient(circle at 7% 20%, rgba(14,230,176,.12), transparent 34%),
    color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-faq-cta-copy {
  max-width: 610px;
}

.kc-faq-cta-kicker {
  display: block;
  margin-bottom: 7px;
  color: var(--accent-color);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .11em;
}

.kc-faq-cta h3 {
  margin-bottom: 7px;
  font-size: 23px;
}

.kc-faq-cta p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  line-height: 1.55;
}

.kc-faq-cta-actions {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 10px;
}

.kc-faq-cta-actions .btn {
  white-space: nowrap;
}

@media (max-width: 767.98px) {
  .kc-faq-section .section-title {
    margin-bottom: 32px;
  }

  .kc-faq-section .kc-faq-accordion .accordion-button {
    gap: 11px;
    padding: 16px 17px;
  }

  .kc-faq-question-index {
    width: 32px;
    height: 32px;
    border-radius: 10px;
  }

  .kc-faq-section .kc-faq-accordion .accordion-body {
    padding: 16px 20px 22px 60px;
  }

  .kc-faq-cta {
    display: block;
    padding: 24px 22px;
  }

  .kc-faq-cta-actions {
    margin-top: 20px;
    flex-wrap: wrap;
  }
}

@media (max-width: 420px) {
  .kc-faq-section .kc-faq-accordion .accordion-body {
    padding-left: 18px;
  }

  .kc-faq-cta-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .kc-faq-cta-actions .btn {
    width: 100%;
  }
}


/* Landingpage Section 10: Kontakt */
.kc-contact-section .kc-contact-panel,
.kc-contact-section .kc-contact-form-panel {
  border-radius: 24px;
  border: 1px solid var(--kc-card-border);
  box-shadow: 0 16px 40px rgba(0,0,0,.12);
}

.kc-contact-info {
  position: relative;
  overflow: hidden;
  padding: 38px;
}

.kc-contact-info::after {
  content: "";
  position: absolute;
  width: 230px;
  height: 230px;
  right: -135px;
  bottom: -130px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(14,230,176,.13), transparent 68%);
  pointer-events: none;
}

.kc-contact-info h2 {
  max-width: 420px;
  margin: 12px 0 14px;
  font-size: clamp(30px, 3vw, 43px);
  letter-spacing: -.035em;
}

.kc-contact-lead {
  max-width: 520px;
  margin-bottom: 0;
  font-size: 16px;
  line-height: 1.7;
}

.kc-contact-help-list {
  display: grid;
  gap: 12px;
  margin-top: 30px;
}

.kc-contact-help-item {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 15px;
  align-items: start;
  padding: 17px 18px;
  border: 1px solid var(--kc-card-border);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface-color), #ffffff 2%);
}

.kc-contact-help-item > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  margin: 0;
  border-radius: 16px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 23px;
}

.kc-contact-help-item h3 {
  margin: 2px 0 5px;
  font-size: 17px;
}

.kc-contact-help-item p {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
}

.kc-contact-direct-note {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--kc-card-border);
  color: color-mix(in srgb, var(--default-color), transparent 20%);
  font-size: 13px;
  font-weight: 650;
}

.kc-contact-direct-note i {
  color: var(--accent-color);
  font-size: 20px;
}

.kc-contact-section .kc-contact-form-panel {
  padding: 38px;
  background: color-mix(in srgb, var(--surface-color), transparent 2%);
}

.kc-contact-form-intro {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 28px !important;
}

.kc-contact-form-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 58px;
  height: 58px;
  border-radius: 18px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
}

.kc-contact-form-icon i {
  margin: 0 !important;
  color: inherit !important;
  font-size: 25px !important;
}

.kc-contact-form-intro h3 {
  margin-bottom: 4px !important;
  font-size: 24px !important;
}

.kc-contact-form-intro p {
  margin: 0 !important;
}

.kc-contact-section .kc-contact-form .form-label {
  margin-bottom: 8px;
  color: color-mix(in srgb, var(--heading-color), transparent 5%);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: .055em;
}

.kc-contact-section .kc-contact-form .form-label span {
  color: var(--accent-color);
}

.kc-contact-section .kc-contact-form .form-control {
  min-height: 52px;
  padding: 13px 15px;
  border-radius: 13px;
  border-color: color-mix(in srgb, var(--default-color), transparent 82%);
  background: color-mix(in srgb, var(--background-color), #ffffff 2%);
}

.kc-contact-section .kc-contact-form textarea.form-control {
  min-height: 154px;
  line-height: 1.6;
}

.kc-contact-section .kc-contact-form .form-control:focus {
  border-color: color-mix(in srgb, var(--accent-color), transparent 20%);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent-color), transparent 89%);
}

.kc-contact-form-status .loading,
.kc-contact-form-status .error-message,
.kc-contact-form-status .sent-message {
  margin-bottom: 14px;
  border-radius: 13px;
}

.kc-contact-form-status .loading {
  align-items: center;
  justify-content: center;
  gap: 9px;
}

.kc-contact-form-status .loading.d-block {
  display: flex !important;
}

.kc-contact-form-status .sent-message.d-block {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.kc-contact-submit {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-width: 210px;
  min-height: 54px;
  margin-top: 0 !important;
  padding: 14px 24px !important;
  border-radius: 14px !important;
  color: #00130e !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  box-shadow: 0 12px 28px rgba(14,230,176,.14);
}

.kc-contact-submit:hover,
.kc-contact-submit:focus {
  color: #00130e !important;
  transform: translateY(-2px);
}

.kc-contact-submit i {
  margin: 0 !important;
}

.kc-contact-privacy {
  max-width: 620px;
  margin: 13px 0 0;
  color: color-mix(in srgb, var(--default-color), transparent 40%);
  font-size: 11px;
  line-height: 1.55;
}

.kc-contact-privacy a {
  color: color-mix(in srgb, var(--accent-color), white 8%);
  text-decoration: underline;
  text-underline-offset: 2px;
}

@media (max-width: 767.98px) {
  .kc-contact-info,
  .kc-contact-section .kc-contact-form-panel {
    padding: 28px 23px;
  }

  .kc-contact-help-item {
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 13px;
    padding: 15px;
  }

  .kc-contact-help-item > i {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    font-size: 21px;
  }

  .kc-contact-form-intro {
    align-items: flex-start;
  }

  .kc-contact-submit {
    width: 100%;
  }
}


/* Landingpage Section 11: Footer + Kontakt-Erfolgsmeldung */

/* Erfolgsmeldung exakt im selben Accent-Stil wie der Senden-Button */
.kc-contact-form-status .sent-message,
.kc-contact-form-status .sent-message.d-block {
  padding: 14px 18px !important;
  border: 1px solid color-mix(in srgb, var(--accent-color), transparent 34%) !important;
  background: var(--accent-color) !important;
  color: #00130e !important;
  font-weight: 850 !important;
  box-shadow: 0 12px 28px rgba(14,230,176,.14);
}

.kc-contact-form-status .sent-message i {
  color: #00130e !important;
}

/* Footer */
.kc-footer {
  position: relative;
  border-top: 1px solid var(--kc-card-border);
  background:
    radial-gradient(circle at 8% 0%, rgba(14,230,176,.07), transparent 30%),
    var(--background-color);
}

.kc-footer-main {
  padding-top: 58px !important;
  padding-bottom: 44px !important;
}

.kc-footer .footer-about .logo {
  margin-bottom: 18px;
  text-decoration: none;
}

.kc-footer .footer-about .logo img {
  object-fit: contain;
  border-radius: 12px;
  padding: 3px;
}

.kc-footer .footer-about .logo .sitename {
  margin: 0 0 0 9px;
  color: var(--heading-color);
  font-family: var(--heading-font);
  font-size: 24px;
  font-weight: 800;
  line-height: 1;
}

.kc-footer-brand > p {
  max-width: 390px;
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 24%);
  font-size: 14px;
  line-height: 1.7;
}

.kc-footer-auth-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 22px;
  color: var(--accent-color);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.kc-footer-auth-link:hover,
.kc-footer-auth-link:focus {
  color: color-mix(in srgb, var(--accent-color), white 14%);
}

.kc-footer-auth-link i {
  font-size: 18px;
}

.kc-footer-links h4 {
  margin-bottom: 18px;
  color: var(--heading-color);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .035em;
}

.kc-footer-links ul {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.kc-footer-links ul li {
  padding: 0 !important;
}

.kc-footer-links ul li::before {
  display: none !important;
}

.kc-footer-links ul a {
  display: inline-block;
  padding: 0 !important;
  color: color-mix(in srgb, var(--default-color), transparent 28%);
  font-size: 13px;
  line-height: 1.5;
  text-decoration: none;
  transition: color .2s ease, transform .2s ease;
}

.kc-footer-links ul a:hover,
.kc-footer-links ul a:focus {
  color: var(--accent-color);
  transform: translateX(2px);
}

.kc-footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-top: 22px !important;
  padding-bottom: 24px !important;
  border-top: 1px solid var(--kc-card-border);
}

.kc-footer-bottom p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 40%);
  font-size: 12px;
}

.kc-footer-bottom p strong {
  color: color-mix(in srgb, var(--heading-color), transparent 16%);
  font-weight: 700;
}

.kc-footer-bottom-links {
  display: flex;
  align-items: center;
  gap: 9px;
  flex: 0 0 auto;
  color: color-mix(in srgb, var(--default-color), transparent 58%);
  font-size: 12px;
}

.kc-footer-bottom-links a {
  color: color-mix(in srgb, var(--default-color), transparent 38%);
  text-decoration: none;
}

.kc-footer-bottom-links a:hover,
.kc-footer-bottom-links a:focus {
  color: var(--accent-color);
}

@media (max-width: 991.98px) {
  .kc-footer-legal {
    text-align: left !important;
  }
}

@media (max-width: 767.98px) {
  .kc-footer-main {
    padding-top: 44px !important;
    padding-bottom: 34px !important;
  }

  .kc-footer-brand {
    margin-bottom: 4px;
  }

  .kc-footer-bottom {
    display: block;
    padding-top: 20px !important;
    padding-bottom: 22px !important;
    text-align: center;
  }

  .kc-footer-bottom-links {
    justify-content: center;
    margin-top: 10px;
  }
}

@media (max-width: 420px) {
  .kc-footer .row > .col-6 {
    width: 100%;
  }

  .kc-footer-links {
    margin-top: 4px;
  }
}


/* =========================================================
   Detailseiten Master V1 – Kellnerruf & Zahlungswunsch
   ========================================================= */

.kc-feature-detail-page .header .logo img,
.kc-feature-detail-page .footer .logo img {
  object-fit: contain;
  border-radius: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
}

.kc-feature-detail-page .header .logo .sitename {
  margin: 0;
  color: var(--heading-color);
  font-family: var(--heading-font);
  font-size: 24px;
  font-weight: 800;
  line-height: 1;
}

.kc-feature-hero {
  position: relative;
  overflow: hidden;
  padding-top: 164px;
  padding-bottom: 76px;
  background:
    radial-gradient(circle at 12% 12%, rgba(14,230,176,.15), transparent 31%),
    radial-gradient(circle at 91% 18%, rgba(9,151,113,.10), transparent 32%);
}

.kc-feature-breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 19px;
  color: color-mix(in srgb, var(--default-color), transparent 46%);
  font-size: 12px;
  font-weight: 700;
}

.kc-feature-breadcrumb a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--accent-color);
  text-decoration: none;
}

.kc-feature-hero .badge-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 19px;
}

.kc-feature-hero h1 {
  max-width: 720px;
  margin-bottom: 22px;
  font-size: clamp(43px, 5.4vw, 72px);
  line-height: 1.01;
  letter-spacing: -.055em;
}

.kc-feature-hero .lead {
  max-width: 720px;
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 14%);
  font-size: 18px;
  line-height: 1.7;
}

.kc-feature-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.kc-feature-quickfacts {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 26px;
}

.kc-feature-quickfacts span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 11px;
  border: 1px solid var(--kc-card-border);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface-color), transparent 5%);
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  font-size: 12px;
  font-weight: 700;
}

.kc-feature-quickfacts i {
  color: var(--accent-color);
}

.kc-feature-hero-image {
  position: relative;
  overflow: hidden;
  margin: 0;
  border: 1px solid var(--kc-card-border);
  border-radius: 30px;
  background: var(--surface-color);
  box-shadow: 0 28px 72px rgba(0,0,0,.18);
}

.kc-feature-hero-image > img {
  display: block;
  width: 100%;
  aspect-ratio: 1.15 / 1;
  object-fit: cover;
}

.kc-feature-hero-image figcaption {
  position: absolute;
  right: 18px;
  bottom: 18px;
  left: 18px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  background: rgba(5,13,18,.86);
  color: #fff;
  backdrop-filter: blur(10px);
}

.kc-feature-hero-image figcaption > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 43px;
  height: 43px;
  border-radius: 14px;
  background: rgba(14,230,176,.14);
  color: var(--accent-color);
  font-size: 21px;
}

.kc-feature-hero-image figcaption strong,
.kc-feature-hero-image figcaption span {
  display: block;
}

.kc-feature-hero-image figcaption strong {
  font-size: 14px;
}

.kc-feature-hero-image figcaption span {
  margin-top: 2px;
  color: rgba(255,255,255,.68);
  font-size: 12px;
}

.kc-feature-problem-section .section-title,
.kc-feature-flow-section .section-title,
.kc-feature-capabilities-section .section-title,
.kc-feature-benefit-section .section-title {
  max-width: 820px;
  margin-right: auto;
  margin-left: auto;
}

.kc-feature-problem-card {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr);
  gap: 20px;
  height: 100%;
  padding: 28px;
  border: 1px solid var(--kc-card-border);
  border-radius: 22px;
  background: color-mix(in srgb, var(--surface-color), transparent 4%);
  box-shadow: 0 14px 36px rgba(0,0,0,.10);
}

.kc-feature-problem-card > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 62px;
  height: 62px;
  border-radius: 19px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 27px;
}

.kc-feature-problem-card h3 {
  margin: 2px 0 8px;
  font-size: 21px;
}

.kc-feature-problem-card p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  line-height: 1.6;
}

.kc-feature-bridge {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 28px;
  color: color-mix(in srgb, var(--default-color), transparent 16%);
  font-size: 14px;
  font-weight: 800;
}

.kc-feature-bridge i {
  color: var(--accent-color);
  font-size: 22px;
}

.kc-feature-flow-section {
  background: color-mix(in srgb, var(--surface-color), transparent 55%);
}

.kc-feature-flow-card {
  height: 100%;
  overflow: hidden;
  border: 1px solid var(--kc-card-border);
  border-radius: 24px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
  box-shadow: 0 16px 40px rgba(0,0,0,.11);
}

.kc-feature-flow-media {
  overflow: hidden;
  border-bottom: 1px solid var(--kc-card-border);
}

.kc-feature-flow-media img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.kc-feature-flow-copy {
  padding: 24px;
}

.kc-feature-flow-heading {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 10px;
}

.kc-feature-flow-heading > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 43px;
  height: 43px;
  border-radius: 14px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 20px;
}

.kc-feature-flow-heading h3 {
  margin: 0;
  font-size: 19px;
  line-height: 1.25;
}

.kc-feature-flow-copy p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  line-height: 1.6;
}

.kc-feature-live-demo {
  min-height: 305px;
  padding: 20px;
  border-bottom: 1px solid var(--kc-card-border);
  background:
    radial-gradient(circle at 90% 4%, rgba(14,230,176,.16), transparent 34%),
    #09131c;
  color: #fff;
}

.kc-feature-demo-top {
  display: flex;
  align-items: center;
  gap: 9px;
  padding-bottom: 15px;
  border-bottom: 1px solid rgba(255,255,255,.10);
}

.kc-feature-demo-top strong {
  font-size: 14px;
}

.kc-feature-demo-top small {
  margin-left: auto;
  color: rgba(255,255,255,.48);
}

.kc-feature-demo-call {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 11px;
  align-items: center;
  margin-top: 13px;
  padding: 13px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  background: rgba(255,255,255,.05);
}

.kc-feature-demo-call.is-new {
  border-color: rgba(14,230,176,.26);
  background: rgba(14,230,176,.08);
}

.kc-feature-demo-call > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 13px;
  background: rgba(14,230,176,.12);
  color: var(--accent-color);
}

.kc-feature-demo-call strong,
.kc-feature-demo-call span {
  display: block;
}

.kc-feature-demo-call strong {
  font-size: 14px;
}

.kc-feature-demo-call span {
  margin-top: 2px;
  color: rgba(255,255,255,.60);
  font-size: 11px;
}

.kc-feature-demo-call em {
  color: var(--accent-color);
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}

.kc-feature-system-section {
  overflow: hidden;
}

.kc-feature-system-window {
  overflow: hidden;
  border: 1px solid var(--kc-card-border);
  border-radius: 26px;
  background: #09131c;
  color: #fff;
  box-shadow: 0 22px 58px rgba(0,0,0,.18);
}

.kc-feature-system-browser {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 14px 17px;
  border-bottom: 1px solid rgba(255,255,255,.09);
  background: rgba(255,255,255,.04);
}

.kc-feature-system-browser > span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(255,255,255,.24);
}

.kc-feature-system-browser strong {
  margin-left: 7px;
  color: rgba(255,255,255,.62);
  font-size: 11px;
}

.kc-feature-system-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  padding: 19px 21px;
  border-bottom: 1px solid rgba(255,255,255,.09);
}

.kc-feature-system-toolbar small,
.kc-feature-system-toolbar strong {
  display: block;
}

.kc-feature-system-toolbar small {
  color: rgba(255,255,255,.48);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.kc-feature-system-toolbar strong {
  margin-top: 3px;
  font-size: 14px;
}

.kc-feature-system-sound {
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(14,230,176,.10);
  color: var(--accent-color);
  font-size: 11px;
  font-weight: 800;
}

.kc-feature-system-calls {
  display: grid;
  gap: 13px;
  padding: 21px;
}

.kc-feature-system-call {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 17px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  background: rgba(255,255,255,.05);
}

.kc-feature-system-call.urgent {
  border-color: rgba(14,230,176,.27);
  background: rgba(14,230,176,.075);
}

.kc-feature-system-call-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 16px;
  background: rgba(14,230,176,.11);
  color: var(--accent-color);
  font-size: 22px;
}

.kc-feature-system-call > div:nth-child(2) > span {
  color: rgba(255,255,255,.48);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.kc-feature-system-call h3 {
  margin: 3px 0 2px;
  color: #fff;
  font-size: 18px;
}

.kc-feature-system-call p {
  margin: 0;
  color: rgba(255,255,255,.58);
  font-size: 12px;
}

.kc-feature-system-call-state {
  text-align: right;
}

.kc-feature-system-call-state strong,
.kc-feature-system-call-state span {
  display: block;
}

.kc-feature-system-call-state strong {
  color: #fff;
  font-size: 14px;
}

.kc-feature-system-call-state span {
  margin-top: 4px;
  color: var(--accent-color);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.kc-feature-system-section h2 {
  margin: 12px 0 16px;
  font-size: clamp(34px, 4vw, 50px);
  letter-spacing: -.04em;
}

.kc-feature-system-section .lead {
  color: color-mix(in srgb, var(--default-color), transparent 13%);
  line-height: 1.7;
}

.kc-feature-checklist {
  display: grid;
  gap: 11px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.kc-feature-checklist li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: color-mix(in srgb, var(--default-color), transparent 12%);
}

.kc-feature-checklist i {
  flex: 0 0 auto;
  margin-top: 2px;
  color: var(--accent-color);
  font-size: 18px;
}

.kc-feature-info-note {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  margin-top: 24px;
  padding: 16px;
  border: 1px solid var(--kc-card-border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface-color), transparent 4%);
}

.kc-feature-info-note > i {
  flex: 0 0 auto;
  margin-top: 2px;
  color: var(--accent-color);
  font-size: 19px;
}

.kc-feature-info-note p {
  margin: 0;
  font-size: 12px;
  line-height: 1.55;
}

.kc-feature-capabilities-section {
  background: color-mix(in srgb, var(--surface-color), transparent 55%);
}

.kc-feature-capability-card,
.kc-feature-result-card {
  height: 100%;
  padding: 28px;
  border: 1px solid var(--kc-card-border);
  border-radius: 22px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
  box-shadow: 0 14px 34px rgba(0,0,0,.09);
}

.kc-feature-capability-card > i,
.kc-feature-result-card > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  margin-bottom: 18px;
  border-radius: 17px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 23px;
}

.kc-feature-capability-card h3,
.kc-feature-result-card h3 {
  margin-bottom: 9px;
  font-size: 20px;
}

.kc-feature-capability-card p,
.kc-feature-result-card p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  line-height: 1.6;
}

.kc-feature-package-card {
  position: relative;
  overflow: hidden;
  padding: clamp(32px, 5vw, 54px);
  border: 1px solid color-mix(in srgb, var(--accent-color), transparent 68%);
  border-radius: 28px;
  background:
    radial-gradient(circle at 8% 8%, rgba(14,230,176,.15), transparent 34%),
    color-mix(in srgb, var(--surface-color), transparent 2%);
  box-shadow: 0 20px 55px rgba(0,0,0,.13);
}

.kc-feature-package-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  color: var(--accent-color);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .10em;
}

.kc-feature-package-card h2 {
  max-width: 780px;
  margin-bottom: 12px;
  font-size: clamp(30px, 4vw, 44px);
  letter-spacing: -.04em;
}

.kc-feature-package-card p {
  max-width: 780px;
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 16%);
  line-height: 1.65;
}

.kc-feature-package-price {
  text-align: center;
}

.kc-feature-package-price span,
.kc-feature-package-price strong,
.kc-feature-package-price small {
  display: block;
}

.kc-feature-package-price span {
  color: color-mix(in srgb, var(--default-color), transparent 48%);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.kc-feature-package-price strong {
  margin: 2px 0;
  color: var(--heading-color);
  font-size: clamp(42px, 5vw, 58px);
  line-height: 1;
  letter-spacing: -.05em;
}

.kc-feature-package-price small {
  color: color-mix(in srgb, var(--default-color), transparent 42%);
  font-size: 11px;
}

.kc-feature-package-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 11px;
  margin-top: 28px;
}

@media (max-width: 991.98px) {
  .kc-feature-hero {
    padding-top: 142px;
  }

  .kc-feature-hero h1 {
    max-width: none;
  }

  .kc-feature-package-price {
    text-align: left;
  }
}

@media (max-width: 767.98px) {
  .kc-feature-hero {
    padding-top: 126px;
    padding-bottom: 58px;
  }

  .kc-feature-hero h1 {
    font-size: clamp(38px, 11vw, 54px);
  }

  .kc-feature-hero .lead {
    font-size: 16px;
  }

  .kc-feature-hero-actions .btn,
  .kc-feature-package-actions .btn {
    width: 100%;
  }

  .kc-feature-problem-card {
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 15px;
    padding: 22px;
  }

  .kc-feature-problem-card > i {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    font-size: 23px;
  }

  .kc-feature-flow-copy,
  .kc-feature-capability-card,
  .kc-feature-result-card {
    padding: 22px;
  }

  .kc-feature-system-call {
    grid-template-columns: 48px minmax(0, 1fr);
  }

  .kc-feature-system-call-state {
    grid-column: 2;
    text-align: left;
  }

  .kc-feature-system-call-state strong,
  .kc-feature-system-call-state span {
    display: inline;
  }

  .kc-feature-system-call-state span {
    margin-left: 8px;
  }
}

@media (max-width: 420px) {
  .kc-feature-quickfacts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kc-feature-quickfacts span {
    justify-content: center;
    text-align: center;
  }

  .kc-feature-hero-image figcaption {
    right: 12px;
    bottom: 12px;
    left: 12px;
  }

  .kc-feature-flow-heading {
    align-items: flex-start;
  }
}


/* =========================================================
   Detailseite 1 V2 – Navigation, Funktionsswitcher & CTA-Fix
   ========================================================= */

/* Hauptnavigation: exakt an das Verhalten der Haupt-Landingpage angleichen */
.kc-feature-detail-page .header {
  flex-direction: column;
  align-items: stretch !important;
}

.kc-feature-detail-page .header > .header-container {
  width: calc(100% - 30px);
}

.kc-feature-detail-page.scrolled .header,
.kellnercall-page.kc-feature-detail-page.scrolled .header {
  padding: 0;
}

.kc-feature-detail-page.scrolled .header > .header-container,
.kellnercall-page.kc-feature-detail-page.scrolled .header > .header-container {
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

/* Zweite horizontale Navigation für alle 8 Funktionsseiten */
.kc-feature-switcher-shell {
  width: 100%;
  margin-top: 8px;
  border-top: 1px solid transparent;
  border-bottom: 1px solid var(--kc-card-border);
  background: rgba(5, 10, 13, .80);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.kc-feature-detail-page.scrolled .kc-feature-switcher-shell {
  margin-top: 0;
  border-top-color: rgba(255,255,255,.05);
  background: rgba(6, 6, 6, .94);
}

.kc-feature-switcher-inner {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 52px;
}

.kc-feature-switcher {
  display: flex;
  align-items: center;
  gap: 7px;
  width: 100%;
  padding: 7px 0;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}

.kc-feature-switcher::-webkit-scrollbar {
  display: none;
}

.kc-feature-switcher a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
  min-height: 36px;
  padding: 8px 12px;
  border: 1px solid transparent;
  border-radius: 11px;
  color: color-mix(in srgb, var(--default-color), transparent 28%);
  background: transparent;
  font-size: 11px;
  font-weight: 750;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  transition: color .2s ease, background .2s ease, border-color .2s ease;
}

.kc-feature-switcher a i {
  color: color-mix(in srgb, var(--accent-color), transparent 15%);
  font-size: 14px;
}

.kc-feature-switcher a:hover,
.kc-feature-switcher a:focus {
  color: var(--heading-color);
  border-color: var(--kc-card-border);
  background: rgba(255,255,255,.045);
}

.kc-feature-switcher a.active {
  border-color: color-mix(in srgb, var(--accent-color), transparent 62%);
  background: color-mix(in srgb, var(--accent-color), transparent 88%);
  color: var(--heading-color);
}

.kc-feature-switcher a.active i {
  color: var(--accent-color);
}

.kc-feature-switcher-arrow {
  display: none;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 1px solid var(--kc-card-border);
  border-radius: 10px;
  background: color-mix(in srgb, var(--surface-color), transparent 2%);
  color: var(--heading-color);
  box-shadow: 0 8px 20px rgba(0,0,0,.12);
  transition: opacity .2s ease, background .2s ease, color .2s ease;
}

.kc-feature-switcher-arrow.is-visible {
  display: inline-flex;
}

.kc-feature-switcher-arrow:hover:not(:disabled),
.kc-feature-switcher-arrow:focus:not(:disabled) {
  border-color: color-mix(in srgb, var(--accent-color), transparent 58%);
  background: var(--kc-accent-soft);
  color: var(--accent-color);
}

.kc-feature-switcher-arrow:disabled {
  opacity: .28;
  cursor: default;
}

/* Größere feste Headerhöhe durch die zweite Navigationszeile */
.kc-feature-detail-page .kc-feature-hero {
  padding-top: 218px;
}

/* Hero- und Paket-CTAs deutlich kontrastreicher */
.kc-feature-detail-page .kc-feature-hero-actions .btn,
.kc-feature-detail-page .kc-feature-package-actions .btn {
  min-height: 52px;
  padding: 13px 20px;
  border-radius: 14px;
  font-weight: 850;
  box-shadow: none;
}

.kc-feature-detail-page .kc-feature-hero-actions .btn-accent,
.kc-feature-detail-page .kc-feature-package-actions .btn-accent {
  border: 1px solid var(--accent-color) !important;
  background: var(--accent-color) !important;
  color: #00130e !important;
  box-shadow: 0 12px 28px rgba(14,230,176,.15);
}

.kc-feature-detail-page .kc-feature-hero-actions .btn-accent:hover,
.kc-feature-detail-page .kc-feature-package-actions .btn-accent:hover,
.kc-feature-detail-page .kc-feature-hero-actions .btn-accent:focus,
.kc-feature-detail-page .kc-feature-package-actions .btn-accent:focus {
  border-color: color-mix(in srgb, var(--accent-color), white 12%) !important;
  background: color-mix(in srgb, var(--accent-color), white 10%) !important;
  color: #00130e !important;
  transform: translateY(-2px);
}

.kc-feature-detail-page .kc-feature-hero-actions .btn-ghost,
.kc-feature-detail-page .kc-feature-package-actions .btn-ghost {
  border: 1px solid rgba(255,255,255,.18) !important;
  background: rgba(255,255,255,.075) !important;
  color: var(--heading-color) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.015);
}

.kc-feature-detail-page .kc-feature-hero-actions .btn-ghost:hover,
.kc-feature-detail-page .kc-feature-package-actions .btn-ghost:hover,
.kc-feature-detail-page .kc-feature-hero-actions .btn-ghost:focus,
.kc-feature-detail-page .kc-feature-package-actions .btn-ghost:focus {
  border-color: color-mix(in srgb, var(--accent-color), transparent 50%) !important;
  background: var(--kc-accent-soft) !important;
  color: var(--accent-color) !important;
  transform: translateY(-2px);
}

@media (max-width: 1199.98px) {
  .kc-feature-switcher-inner {
    padding-right: 10px;
    padding-left: 10px;
  }
}

@media (max-width: 991.98px) {
  .kc-feature-detail-page .kc-feature-hero {
    padding-top: 204px;
  }

  .kc-feature-switcher-shell {
    margin-top: 4px;
  }
}

@media (max-width: 767.98px) {
  .kc-feature-detail-page .kc-feature-hero {
    padding-top: 188px;
  }

  .kc-feature-switcher-inner {
    min-height: 48px;
  }

  .kc-feature-switcher {
    gap: 6px;
    padding-top: 6px;
    padding-bottom: 6px;
  }

  .kc-feature-switcher a {
    min-height: 34px;
    padding: 7px 10px;
    border-radius: 10px;
    font-size: 10.5px;
  }

  .kc-feature-switcher-arrow {
    width: 32px;
    height: 32px;
  }
}

@media (max-width: 420px) {
  .kc-feature-detail-page .kc-feature-hero {
    padding-top: 180px;
  }

  .kc-feature-switcher a span {
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}


/* =========================================================
   Detailseite 2 V1 – Tisch- & Stationszuständigkeit
   ========================================================= */

.kc-assignment-hero-board {
  position: relative;
  overflow: hidden;
  padding: 22px;
  border: 1px solid var(--kc-card-border);
  border-radius: 30px;
  background:
    radial-gradient(circle at 88% 7%, rgba(14,230,176,.17), transparent 32%),
    #09131c;
  color: #fff;
  box-shadow: 0 28px 72px rgba(0,0,0,.18);
}

.kc-assignment-board-top,
.kc-assignment-window-top {
  display: flex;
  align-items: center;
  gap: 9px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(255,255,255,.09);
}

.kc-assignment-board-top strong,
.kc-assignment-window-top strong {
  font-size: 14px;
}

.kc-assignment-board-top small,
.kc-assignment-window-top small {
  margin-left: auto;
  color: rgba(255,255,255,.48);
}

.kc-assignment-stations {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 17px 0;
}

.kc-assignment-stations span {
  padding: 7px 10px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  background: rgba(255,255,255,.045);
  color: rgba(255,255,255,.60);
  font-size: 10px;
  font-weight: 500;
}

.kc-assignment-stations span.active {
  border-color: rgba(14,230,176,.28);
  background: rgba(14,230,176,.10);
  color: var(--accent-color);
}

.kc-assignment-table-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.kc-assignment-table {
  min-width: 0;
  padding: 13px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 15px;
  background: rgba(255,255,255,.045);
}

.kc-assignment-table.is-broadcast {
  border-color: rgba(255,255,255,.16);
  background: rgba(255,255,255,.075);
}

.kc-assignment-table.is-highlighted {
  border-color: rgba(14,230,176,.30);
  background: rgba(14,230,176,.075);
}

.kc-assignment-table small,
.kc-assignment-table strong,
.kc-assignment-table span {
  display: block;
}

.kc-assignment-table small {
  color: rgba(255,255,255,.40);
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.kc-assignment-table strong {
  margin: 4px 0 5px;
  color: #fff;
  font-size: 17px;
}

.kc-assignment-table span {
  overflow: hidden;
  color: rgba(255,255,255,.62);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kc-assignment-table.is-broadcast span {
  color: rgba(255,255,255,.72);
}

.kc-assignment-board-note {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 15px;
  padding: 11px 13px;
  border-radius: 13px;
  background: rgba(14,230,176,.08);
  color: rgba(255,255,255,.70);
  font-size: 11px;
}

.kc-assignment-board-note i {
  color: var(--accent-color);
}

.kc-assignment-flow-card {
  height: 100%;
  padding: 27px;
  border: 1px solid var(--kc-card-border);
  border-radius: 23px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
  box-shadow: 0 14px 35px rgba(0,0,0,.09);
}

.kc-assignment-flow-card > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  margin-bottom: 19px;
  border-radius: 17px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 23px;
}

.kc-assignment-flow-card h3 {
  margin-bottom: 9px;
  font-size: 20px;
}

.kc-assignment-flow-card p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  line-height: 1.62;
}

.kc-assignment-system-window {
  overflow: hidden;
  border: 1px solid var(--kc-card-border);
  border-radius: 26px;
  background: #09131c;
  color: #fff;
  box-shadow: 0 22px 58px rgba(0,0,0,.18);
}

.kc-assignment-window-top {
  padding: 15px 18px;
  background: rgba(255,255,255,.035);
}

.kc-assignment-window-content {
  padding: 20px;
}

.kc-assignment-window-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.kc-assignment-window-toolbar > div small,
.kc-assignment-window-toolbar > div strong {
  display: block;
}

.kc-assignment-window-toolbar small {
  color: rgba(255,255,255,.44);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.kc-assignment-window-toolbar strong {
  margin-top: 3px;
  font-size: 13px;
}

.kc-assignment-window-action {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(14,230,176,.10);
  color: var(--accent-color);
  font-size: 10px;
  font-weight: 700;
}

.kc-assignment-window-tables {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px;
}

.kc-assignment-window-card {
  padding: 14px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  background: rgba(255,255,255,.045);
}

.kc-assignment-window-card.is-broadcast {
  border-color: rgba(255,255,255,.15);
  background: rgba(255,255,255,.075);
}

.kc-assignment-window-card.is-new-owner {
  border-color: rgba(14,230,176,.28);
  background: rgba(14,230,176,.075);
}

.kc-assignment-window-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.kc-assignment-window-card header strong {
  color: #fff;
  font-size: 15px;
}

.kc-assignment-window-card header span {
  color: rgba(255,255,255,.40);
  font-size: 9px;
}

.kc-assignment-owner {
  display: flex;
  align-items: center;
  gap: 9px;
}

.kc-assignment-owner-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 35px;
  height: 35px;
  border-radius: 12px;
  background: rgba(14,230,176,.10);
  color: var(--accent-color);
}

.kc-assignment-owner div strong,
.kc-assignment-owner div span {
  display: block;
}

.kc-assignment-owner div strong {
  color: rgba(255,255,255,.88);
  font-size: 11px;
}

.kc-assignment-owner div span {
  margin-top: 2px;
  color: rgba(255,255,255,.46);
  font-size: 9px;
}

.kc-assignment-window-card.is-broadcast .kc-assignment-owner-icon {
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.64);
}

.kc-assignment-handover {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-top: 14px;
  padding: 13px;
  border: 1px solid rgba(14,230,176,.18);
  border-radius: 14px;
  background: rgba(14,230,176,.06);
}

.kc-assignment-handover > i {
  color: var(--accent-color);
  font-size: 19px;
}

.kc-assignment-handover strong,
.kc-assignment-handover span {
  display: block;
}

.kc-assignment-handover strong {
  font-size: 11px;
}

.kc-assignment-handover span {
  margin-top: 2px;
  color: rgba(255,255,255,.50);
  font-size: 9px;
}

.kc-assignment-principles {
  display: grid;
  gap: 12px;
  margin-top: 23px;
}

.kc-assignment-principle {
  display: grid;
  grid-template-columns: 43px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 15px 16px;
  border: 1px solid var(--kc-card-border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface-color), transparent 4%);
}

.kc-assignment-principle > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 43px;
  height: 43px;
  border-radius: 14px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 19px;
}

.kc-assignment-principle h3 {
  margin: 1px 0 4px;
  font-size: 16px;
}

.kc-assignment-principle p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 20%);
  font-size: 12px;
  line-height: 1.55;
}

@media (max-width: 767.98px) {
  .kc-assignment-table-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kc-assignment-window-tables {
    grid-template-columns: 1fr;
  }

  .kc-assignment-flow-card {
    padding: 22px;
  }
}

@media (max-width: 420px) {
  .kc-assignment-hero-board {
    padding: 17px;
  }

  .kc-assignment-table-grid {
    grid-template-columns: 1fr;
  }
}


/* Detailseite 2 V2 – Sitzplatzkapazität & ADD */

.kc-assignment-capacity-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 14px;
}

.kc-assignment-capacity-row > div {
  padding: 10px 11px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  background: rgba(255,255,255,.035);
}

.kc-assignment-capacity-row small,
.kc-assignment-capacity-row strong {
  display: block;
}

.kc-assignment-capacity-row small {
  color: rgba(255,255,255,.42);
  font-size: 9px;
}

.kc-assignment-capacity-row strong {
  margin-top: 2px;
  color: rgba(255,255,255,.88);
  font-size: 11px;
  font-weight: 600;
}

.kc-assignment-capacity-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: -3px 0 15px;
}

.kc-assignment-capacity-summary span {
  padding: 7px 9px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.58);
  font-size: 9px;
}

.kc-assignment-capacity-summary strong {
  color: rgba(255,255,255,.84);
  font-weight: 600;
}

@media (max-width: 420px) {
  .kc-assignment-capacity-row {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   Detailseite 3 V1 – Kitchen Calls & interne Rufe
   ========================================================= */

.kc-comms-hero-board {
  overflow: hidden;
  padding: 22px;
  border: 1px solid var(--kc-card-border);
  border-radius: 30px;
  background:
    radial-gradient(circle at 90% 7%, rgba(255,193,7,.13), transparent 28%),
    radial-gradient(circle at 8% 94%, rgba(13,110,253,.14), transparent 31%),
    #09131c;
  color: #fff;
  box-shadow: 0 28px 72px rgba(0,0,0,.18);
}

.kc-comms-board-top {
  display: flex;
  align-items: center;
  gap: 9px;
  padding-bottom: 15px;
  border-bottom: 1px solid rgba(255,255,255,.09);
}

.kc-comms-board-top strong {
  font-size: 14px;
}

.kc-comms-board-top small {
  margin-left: auto;
  color: rgba(255,255,255,.45);
}

.kc-comms-kitchen-message,
.kc-comms-internal-message {
  display: grid;
  grid-template-columns: 48px minmax(0,1fr) auto;
  gap: 12px;
  align-items: center;
  margin-top: 14px;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 17px;
  background: rgba(255,255,255,.045);
}

.kc-comms-kitchen-message.is-team {
  border-color: rgba(255,193,7,.22);
  background: rgba(255,193,7,.065);
}

.kc-comms-internal-message {
  border-color: rgba(13,110,253,.20);
  background: rgba(13,110,253,.06);
}

.kc-comms-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 15px;
  background: rgba(255,193,7,.12);
  color: #ffd45b;
  font-size: 20px;
}

.kc-comms-avatar.is-internal {
  background: rgba(13,110,253,.13);
  color: #69a7ff;
}

.kc-comms-kitchen-message small,
.kc-comms-kitchen-message strong,
.kc-comms-kitchen-message span,
.kc-comms-internal-message small,
.kc-comms-internal-message strong,
.kc-comms-internal-message span {
  display: block;
}

.kc-comms-kitchen-message small,
.kc-comms-internal-message small {
  color: rgba(255,255,255,.40);
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.kc-comms-kitchen-message strong,
.kc-comms-internal-message strong {
  margin-top: 3px;
  color: #fff;
  font-size: 13px;
}

.kc-comms-kitchen-message span,
.kc-comms-internal-message span {
  margin-top: 3px;
  color: rgba(255,255,255,.56);
  font-size: 10px;
}

.kc-comms-kitchen-message em,
.kc-comms-internal-message em {
  color: var(--accent-color);
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
}

.kc-comms-divider {
  height: 1px;
  margin: 16px 0 2px;
  background: rgba(255,255,255,.08);
}

.kc-comms-board-note {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 15px;
  padding: 11px 13px;
  border-radius: 13px;
  background: rgba(14,230,176,.07);
  color: rgba(255,255,255,.66);
  font-size: 10px;
}

.kc-comms-board-note i {
  color: var(--accent-color);
}

.kc-comms-two-paths-section {
  background: color-mix(in srgb, var(--surface-color), transparent 55%);
}

.kc-comms-two-paths-section .section-title {
  max-width: 820px;
  margin-right: auto;
  margin-left: auto;
}

.kc-comms-path-card {
  position: relative;
  overflow: hidden;
  height: 100%;
  padding: 32px;
  border: 1px solid var(--kc-card-border);
  border-radius: 25px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
  box-shadow: 0 15px 38px rgba(0,0,0,.10);
}

.kc-comms-path-card::after {
  position: absolute;
  top: -70px;
  right: -70px;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  content: "";
  pointer-events: none;
}

.kc-comms-path-card.is-kitchen::after {
  background: rgba(255,193,7,.07);
}

.kc-comms-path-card.is-internal::after {
  background: rgba(13,110,253,.08);
}

.kc-comms-path-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  margin-bottom: 18px;
  border-radius: 19px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 25px;
}

.kc-comms-path-card.is-kitchen .kc-comms-path-icon {
  background: rgba(255,193,7,.10);
  color: #d9ad28;
}

.kc-comms-path-card.is-internal .kc-comms-path-icon {
  background: rgba(13,110,253,.10);
  color: #4b8ce8;
}

.kc-comms-path-kicker {
  display: block;
  margin-bottom: 5px;
  color: color-mix(in srgb, var(--default-color), transparent 43%);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .09em;
}

.kc-comms-path-card h3 {
  margin-bottom: 10px;
  font-size: 25px;
}

.kc-comms-path-card > p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  line-height: 1.65;
}

.kc-comms-path-card ul {
  display: grid;
  gap: 9px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}

.kc-comms-path-card li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: color-mix(in srgb, var(--default-color), transparent 15%);
  font-size: 13px;
}

.kc-comms-path-card li i {
  flex: 0 0 auto;
  margin-top: 2px;
  color: var(--accent-color);
}

.kc-comms-flow-card {
  height: 100%;
  overflow: hidden;
  border: 1px solid var(--kc-card-border);
  border-radius: 24px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
  box-shadow: 0 16px 40px rgba(0,0,0,.11);
}

.kc-comms-staff-mini,
.kc-comms-reasons,
.kc-comms-live-mini {
  min-height: 290px;
  padding: 21px;
  border-bottom: 1px solid var(--kc-card-border);
  background:
    radial-gradient(circle at 90% 4%, rgba(14,230,176,.11), transparent 35%),
    #09131c;
  color: #fff;
}

.kc-comms-staff-head {
  display: grid;
  grid-template-columns: 48px minmax(0,1fr) auto;
  gap: 11px;
  align-items: center;
}

.kc-comms-person-photo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(14,230,176,.20), rgba(14,230,176,.08));
  color: var(--accent-color);
  font-size: 16px;
  font-weight: 700;
}

.kc-comms-person-photo.is-blue {
  background: linear-gradient(135deg, rgba(13,110,253,.23), rgba(13,110,253,.08));
  color: #70aaff;
}

.kc-comms-staff-head strong,
.kc-comms-staff-head span {
  display: block;
}

.kc-comms-staff-head strong {
  font-size: 13px;
}

.kc-comms-staff-head span {
  margin-top: 2px;
  color: rgba(255,255,255,.48);
  font-size: 9px;
}

.kc-comms-staff-head em {
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(14,230,176,.10);
  color: var(--accent-color);
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
}

.kc-comms-staff-stats,
.kc-comms-staff-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 14px;
}

.kc-comms-staff-stats span,
.kc-comms-staff-meta span {
  padding: 7px 9px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.66);
  font-size: 9px;
}

.kc-comms-staff-meta span:last-child {
  color: #63db8f;
}

.kc-comms-staff-mini > small {
  display: block;
  margin-top: 14px;
  color: rgba(255,255,255,.42);
  font-size: 9px;
}

.kc-comms-reasons {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  align-content: center;
}

.kc-comms-reasons button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 91px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 15px;
  background: rgba(255,255,255,.045);
  color: rgba(255,255,255,.82);
  font-size: 10px;
  font-weight: 600;
}

.kc-comms-reasons button span {
  font-size: 21px;
}

.kc-comms-live-mini-top {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.kc-comms-live-mini-top strong {
  font-size: 12px;
}

.kc-comms-live-mini-top small {
  margin-left: auto;
  color: rgba(255,255,255,.42);
  font-size: 9px;
}

.kc-comms-live-call {
  display: grid;
  grid-template-columns: 44px minmax(0,1fr) auto;
  gap: 10px;
  align-items: center;
  margin-top: 16px;
  padding: 13px;
  border: 1px solid rgba(255,193,7,.18);
  border-radius: 15px;
  background: rgba(255,193,7,.055);
}

.kc-comms-live-call > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 13px;
  background: rgba(255,193,7,.10);
  color: #ffd45b;
}

.kc-comms-live-call strong,
.kc-comms-live-call span {
  display: block;
}

.kc-comms-live-call strong {
  font-size: 12px;
}

.kc-comms-live-call span {
  margin-top: 2px;
  color: rgba(255,255,255,.52);
  font-size: 9px;
}

.kc-comms-live-call em {
  color: var(--accent-color);
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
}

.kc-comms-wa-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 15px;
  padding: 10px 11px;
  border-radius: 13px;
  background: rgba(37,211,102,.07);
  color: rgba(255,255,255,.63);
  font-size: 9px;
}

.kc-comms-wa-row i {
  color: #4bd878;
  font-size: 15px;
}

.kc-comms-teamcall-section {
  overflow: hidden;
}

.kc-comms-team-window,
.kc-comms-internal-window {
  overflow: hidden;
  border: 1px solid var(--kc-card-border);
  border-radius: 26px;
  background: #09131c;
  color: #fff;
  box-shadow: 0 22px 58px rgba(0,0,0,.18);
}

.kc-comms-team-top,
.kc-comms-internal-window-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 13px;
  padding: 16px 19px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
}

.kc-comms-team-top > div {
  display: flex;
  align-items: center;
  gap: 9px;
}

.kc-comms-team-top i {
  color: #ffd45b;
}

.kc-comms-team-top strong,
.kc-comms-internal-window-top strong {
  font-size: 12px;
}

.kc-comms-team-top > span {
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(255,193,7,.09);
  color: #ffd45b;
  font-size: 9px;
}

.kc-comms-team-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  padding: 20px;
}

.kc-comms-team-options > div {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 55px;
  padding: 11px 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.67);
  font-size: 9px;
}

.kc-comms-team-options > div.is-active {
  border-color: rgba(255,193,7,.22);
  background: rgba(255,193,7,.07);
  color: rgba(255,255,255,.90);
}

.kc-comms-team-options i {
  flex: 0 0 auto;
  color: #ffd45b;
  font-size: 15px;
}

.kc-comms-team-preview {
  margin: 0 20px 20px;
  padding: 14px;
  border: 1px solid rgba(14,230,176,.15);
  border-radius: 15px;
  background: rgba(14,230,176,.05);
}

.kc-comms-team-preview small,
.kc-comms-team-preview strong,
.kc-comms-team-preview span {
  display: block;
}

.kc-comms-team-preview small {
  color: rgba(255,255,255,.40);
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.kc-comms-team-preview strong {
  margin-top: 5px;
  font-size: 11px;
}

.kc-comms-team-preview span {
  margin-top: 4px;
  color: rgba(255,255,255,.48);
  font-size: 9px;
}

.kc-comms-teamcall-section h2,
.kc-comms-internal-section h2 {
  margin: 12px 0 16px;
  font-size: clamp(34px,4vw,50px);
  letter-spacing: -.04em;
}

.kc-comms-internal-section {
  background: color-mix(in srgb, var(--surface-color), transparent 55%);
}

.kc-comms-internal-section > .container > .section-title {
  max-width: 820px;
  margin-right: auto;
  margin-left: auto;
}

.kc-comms-internal-facts {
  display: grid;
  gap: 11px;
  margin-top: 24px;
}

.kc-comms-internal-facts article {
  display: grid;
  grid-template-columns: 43px minmax(0,1fr);
  gap: 12px;
  align-items: start;
  padding: 14px;
  border: 1px solid var(--kc-card-border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-comms-internal-facts article > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 43px;
  height: 43px;
  border-radius: 14px;
  background: rgba(13,110,253,.09);
  color: #4b8ce8;
  font-size: 18px;
}

.kc-comms-internal-facts h3 {
  margin: 1px 0 4px;
  font-size: 15px;
}

.kc-comms-internal-facts p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 20%);
  font-size: 11px;
  line-height: 1.55;
}

.kc-comms-internal-window-top small {
  margin-left: auto;
  color: rgba(255,255,255,.40);
  font-size: 9px;
}

.kc-comms-internal-target {
  display: grid;
  grid-template-columns: 48px minmax(0,1fr) auto;
  gap: 11px;
  align-items: center;
  margin: 19px 20px 0;
  padding: 13px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 15px;
  background: rgba(255,255,255,.04);
}

.kc-comms-internal-target strong,
.kc-comms-internal-target span {
  display: block;
}

.kc-comms-internal-target strong {
  font-size: 12px;
}

.kc-comms-internal-target span {
  margin-top: 2px;
  color: rgba(255,255,255,.48);
  font-size: 9px;
}

.kc-comms-internal-target em {
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(13,110,253,.10);
  color: #76adff;
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
}

.kc-comms-internal-form {
  padding: 18px 20px;
}

.kc-comms-internal-form label {
  display: block;
  margin: 0 0 7px;
  color: rgba(255,255,255,.44);
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.kc-comms-select {
  display: grid;
  grid-template-columns: 20px minmax(0,1fr) auto;
  gap: 7px;
  align-items: center;
  margin-bottom: 15px;
  padding: 11px 12px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 13px;
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.77);
  font-size: 10px;
}

.kc-comms-select i:first-child {
  color: #70aaff;
}

.kc-comms-select i:last-child {
  color: rgba(255,255,255,.32);
}

.kc-comms-option-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 7px;
}

.kc-comms-option-grid span {
  padding: 9px 10px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 11px;
  background: rgba(255,255,255,.035);
  color: rgba(255,255,255,.58);
  font-size: 8.5px;
}

.kc-comms-option-grid span.active {
  border-color: rgba(13,110,253,.25);
  background: rgba(13,110,253,.09);
  color: rgba(255,255,255,.88);
}

.kc-comms-internal-preview {
  display: grid;
  grid-template-columns: 40px minmax(0,1fr) auto;
  gap: 10px;
  align-items: center;
  margin: 0 20px 20px;
  padding: 13px;
  border: 1px solid rgba(13,110,253,.18);
  border-radius: 14px;
  background: rgba(13,110,253,.055);
}

.kc-comms-internal-preview > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: rgba(13,110,253,.11);
  color: #70aaff;
}

.kc-comms-internal-preview strong,
.kc-comms-internal-preview span {
  display: block;
}

.kc-comms-internal-preview strong {
  font-size: 9.5px;
}

.kc-comms-internal-preview span {
  margin-top: 2px;
  color: rgba(255,255,255,.46);
  font-size: 8px;
}

.kc-comms-internal-preview small {
  color: #58d782;
  font-size: 8px;
}

@media (max-width: 767.98px) {
  .kc-comms-path-card {
    padding: 24px;
  }

  .kc-comms-team-options,
  .kc-comms-option-grid {
    grid-template-columns: 1fr;
  }

  .kc-comms-kitchen-message,
  .kc-comms-internal-message {
    grid-template-columns: 44px minmax(0,1fr);
  }

  .kc-comms-kitchen-message em,
  .kc-comms-internal-message em {
    grid-column: 2;
  }
}

@media (max-width: 420px) {
  .kc-comms-hero-board {
    padding: 17px;
  }

  .kc-comms-reasons {
    grid-template-columns: 1fr;
  }

  .kc-comms-staff-mini,
  .kc-comms-reasons,
  .kc-comms-live-mini {
    min-height: auto;
  }

  .kc-comms-internal-target,
  .kc-comms-internal-preview {
    grid-template-columns: 42px minmax(0,1fr);
  }

  .kc-comms-internal-target em,
  .kc-comms-internal-preview small {
    grid-column: 2;
  }
}


/* =========================================================
   Detailseite 3 V2 – Überschriften, Rufpunkt-QR & Icon-Fix
   ========================================================= */

/*
 * Lange Hauptüberschriften auf Desktop kompakter halten.
 * Mobile darf weiterhin natürlich umbrechen.
 */
.kc-feature-detail-page .kc-comms-internal-section > .container > .section-title,
.kc-feature-detail-page .kc-feature-benefit-section .section-title {
  max-width: 1120px;
}

.kc-feature-detail-page .kc-comms-internal-section > .container > .section-title h2,
.kc-feature-detail-page .kc-feature-benefit-section .section-title h2 {
  font-size: clamp(30px, 3vw, 38px);
  line-height: 1.12;
  letter-spacing: -.035em;
}

@media (min-width: 1200px) {
  .kc-feature-detail-page .kc-comms-internal-section > .container > .section-title h2,
  .kc-feature-detail-page .kc-feature-benefit-section .section-title h2 {
    white-space: nowrap;
  }
}

/* Interner Ruf: QR-Vorauswahl sichtbar erklären */
.kc-comms-internal-form label {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
}

.kc-comms-qr-preselected {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 7px;
  border: 1px solid rgba(14,230,176,.16);
  border-radius: 999px;
  background: rgba(14,230,176,.06);
  color: var(--accent-color);
  font-size: 8px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
}

.kc-comms-point-hint {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  margin: -7px 0 15px;
  padding: 8px 10px;
  border-radius: 11px;
  background: rgba(13,110,253,.055);
  color: rgba(255,255,255,.52);
  font-size: 8px;
  line-height: 1.45;
}

.kc-comms-point-hint i {
  flex: 0 0 auto;
  margin-top: 1px;
  color: #70aaff;
}

/* Mehr interne Fakten nach QR-Ergänzung etwas kompakter halten */
.kc-comms-internal-facts article {
  padding-top: 12px;
  padding-bottom: 12px;
}

@media (max-width: 1199.98px) {
  .kc-feature-detail-page .kc-comms-internal-section > .container > .section-title,
  .kc-feature-detail-page .kc-feature-benefit-section .section-title {
    max-width: 880px;
  }
}

@media (max-width: 767.98px) {
  .kc-feature-detail-page .kc-comms-internal-section > .container > .section-title h2,
  .kc-feature-detail-page .kc-feature-benefit-section .section-title h2 {
    font-size: clamp(28px, 8.4vw, 36px);
    white-space: normal;
  }

  .kc-comms-qr-preselected {
    margin-top: 2px;
  }
}


/* =========================================================
   Detailseite 4 V1 – Betriebs-Cockpit
   ========================================================= */

.kc-cockpit-hero-board,
.kc-cockpit-live-window,
.kc-cockpit-attention-window,
.kc-cockpit-chart-window,
.kc-cockpit-week-window,
.kc-cockpit-team-window,
.kc-cockpit-open-window,
.kc-cockpit-response-window {
  overflow: hidden;
  border: 1px solid var(--kc-card-border);
  border-radius: 27px;
  background: #09131c;
  color: #fff;
  box-shadow: 0 24px 64px rgba(0,0,0,.18);
}

.kc-cockpit-hero-board {
  padding: 20px;
  background:
    radial-gradient(circle at 90% 4%, rgba(14,230,176,.13), transparent 30%),
    radial-gradient(circle at 8% 96%, rgba(13,110,253,.12), transparent 32%),
    #09131c;
}

.kc-cockpit-board-top,
.kc-cockpit-window-head,
.kc-cockpit-chart-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.kc-cockpit-board-top > div,
.kc-cockpit-window-head > div {
  display: flex;
  align-items: center;
  gap: 8px;
}

.kc-cockpit-board-top strong,
.kc-cockpit-window-head strong {
  font-size: 13px;
}

.kc-cockpit-state {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 9px;
  border-radius: 999px;
  background: rgba(255,193,7,.08);
  color: #ffd45b;
  font-size: 9px;
  font-weight: 700;
}

.kc-cockpit-state i {
  font-size: 7px;
}

.kc-cockpit-kpi-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 10px;
  margin-top: 17px;
}

.kc-cockpit-kpi-grid article {
  padding: 13px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 15px;
  background: rgba(255,255,255,.045);
}

.kc-cockpit-kpi-grid small,
.kc-cockpit-kpi-grid strong {
  display: block;
}

.kc-cockpit-kpi-grid small {
  color: rgba(255,255,255,.43);
  font-size: 8.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.kc-cockpit-kpi-grid > article > strong {
  margin-top: 3px;
  font-size: 22px;
  line-height: 1.05;
}

.kc-cockpit-kpi-grid article > div {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 8px;
}

.kc-cockpit-kpi-grid article span {
  padding: 4px 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  color: rgba(255,255,255,.58);
  font-size: 8px;
}

.kc-cockpit-kpi-grid article span.is-good,
.kc-cockpit-chip-row .is-good {
  background: rgba(14,230,176,.08);
  color: var(--accent-color);
}

.kc-cockpit-chart-mini {
  margin-top: 11px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  background: rgba(255,255,255,.035);
}

.kc-cockpit-mini-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.kc-cockpit-mini-head strong,
.kc-cockpit-mini-head span {
  display: block;
}

.kc-cockpit-mini-head strong {
  font-size: 10px;
}

.kc-cockpit-mini-head div span {
  margin-top: 2px;
  color: rgba(255,255,255,.40);
  font-size: 8px;
}

.kc-cockpit-mini-head > span {
  color: var(--accent-color);
  font-size: 9px;
  font-weight: 700;
}

.kc-cockpit-chart-mini svg {
  display: block;
  width: 100%;
  height: 112px;
  margin-top: 4px;
}

.kc-cockpit-mini-legend,
.kc-cockpit-week-legend,
.kc-cockpit-load-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  color: rgba(255,255,255,.46);
  font-size: 8px;
}

.kc-cockpit-mini-legend span,
.kc-cockpit-week-legend span,
.kc-cockpit-load-legend span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.kc-cockpit-mini-legend i,
.kc-cockpit-week-legend i,
.kc-cockpit-load-legend i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.kc-cockpit-mini-legend i.is-today {
  background: var(--accent-color);
}

.kc-cockpit-mini-legend i.is-yesterday {
  background: #8b96a4;
}

.kc-cockpit-hero-alert {
  display: grid;
  grid-template-columns: 38px minmax(0,1fr) auto;
  gap: 10px;
  align-items: center;
  margin-top: 11px;
  padding: 11px;
  border: 1px solid rgba(255,193,7,.17);
  border-radius: 14px;
  background: rgba(255,193,7,.055);
}

.kc-cockpit-hero-alert > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 12px;
  background: rgba(255,193,7,.09);
  color: #ffd45b;
}

.kc-cockpit-hero-alert strong,
.kc-cockpit-hero-alert span {
  display: block;
}

.kc-cockpit-hero-alert strong {
  font-size: 9.5px;
}

.kc-cockpit-hero-alert span {
  margin-top: 2px;
  color: rgba(255,255,255,.48);
  font-size: 8px;
}

.kc-cockpit-hero-alert em {
  color: #ffd45b;
  font-size: 8px;
  font-style: normal;
  font-weight: 700;
}

.kc-cockpit-live-section,
.kc-cockpit-history-section,
.kc-cockpit-response-section {
  background: color-mix(in srgb, var(--surface-color), transparent 55%);
}

.kc-cockpit-live-section .section-title,
.kc-cockpit-history-section .section-title,
.kc-cockpit-team-section .section-title,
.kc-cockpit-readiness-section .section-title {
  max-width: 900px;
  margin-right: auto;
  margin-left: auto;
}

.kc-cockpit-live-window {
  padding: 18px;
}

.kc-cockpit-window-head {
  padding-bottom: 15px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.kc-cockpit-window-head > span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(255,255,255,.45);
  font-size: 9px;
}

.kc-cockpit-live-cards {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 11px;
  margin-top: 16px;
}

.kc-cockpit-live-cards article {
  padding: 16px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  background: rgba(255,255,255,.04);
}

.kc-cockpit-live-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 39px;
  height: 39px;
  margin-bottom: 12px;
  border-radius: 13px;
  background: rgba(14,230,176,.08);
  color: var(--accent-color);
}

.kc-cockpit-live-cards article.is-danger .kc-cockpit-live-icon {
  background: rgba(220,53,69,.10);
  color: #ff7887;
}

.kc-cockpit-live-cards article.is-warning .kc-cockpit-live-icon {
  background: rgba(255,193,7,.10);
  color: #ffd45b;
}

.kc-cockpit-live-cards article.is-primary .kc-cockpit-live-icon {
  background: rgba(13,110,253,.10);
  color: #70aaff;
}

.kc-cockpit-live-cards small,
.kc-cockpit-live-cards strong {
  display: block;
}

.kc-cockpit-live-cards small {
  color: rgba(255,255,255,.45);
  font-size: 8.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.kc-cockpit-live-cards > article > strong {
  margin: 4px 0 8px;
  font-size: 27px;
}

.kc-cockpit-live-cards p {
  min-height: 45px;
  margin: 0;
  color: rgba(255,255,255,.52);
  font-size: 9px;
  line-height: 1.55;
}

.kc-cockpit-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 11px;
}

.kc-cockpit-chip-row span {
  padding: 5px 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  color: rgba(255,255,255,.60);
  font-size: 7.8px;
}

.kc-cockpit-progress,
.kc-cockpit-response-bar,
.kc-cockpit-readiness-progress,
.kc-cockpit-loadbar {
  overflow: hidden;
  height: 5px;
  margin-top: 13px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
}

.kc-cockpit-progress span,
.kc-cockpit-response-bar span,
.kc-cockpit-readiness-progress span,
.kc-cockpit-loadbar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--accent-color);
}

.kc-cockpit-explain-card {
  height: 100%;
  padding: 23px;
  border: 1px solid var(--kc-card-border);
  border-radius: 20px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-cockpit-explain-card > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 47px;
  height: 47px;
  margin-bottom: 15px;
  border-radius: 15px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 19px;
}

.kc-cockpit-explain-card h3 {
  margin-bottom: 7px;
  font-size: 17px;
}

.kc-cockpit-explain-card p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  font-size: 12px;
  line-height: 1.6;
}

.kc-cockpit-attention-window {
  padding: 18px;
}

.kc-cockpit-attention-window .kc-cockpit-window-head > div > i {
  color: #ffd45b;
}

.kc-cockpit-attention-list {
  display: grid;
  gap: 9px;
  margin-top: 15px;
}

.kc-cockpit-attention-list article {
  display: grid;
  grid-template-columns: 42px minmax(0,1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  background: rgba(255,255,255,.04);
}

.kc-cockpit-attention-list article > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 13px;
  background: rgba(13,110,253,.08);
  color: #70aaff;
}

.kc-cockpit-attention-list article.is-danger > i {
  background: rgba(220,53,69,.10);
  color: #ff7887;
}

.kc-cockpit-attention-list article.is-warning > i {
  background: rgba(255,193,7,.10);
  color: #ffd45b;
}

.kc-cockpit-attention-list strong,
.kc-cockpit-attention-list span {
  display: block;
}

.kc-cockpit-attention-list strong {
  font-size: 10px;
}

.kc-cockpit-attention-list span {
  margin-top: 2px;
  color: rgba(255,255,255,.48);
  font-size: 8.5px;
}

.kc-cockpit-attention-list em {
  color: var(--accent-color);
  font-size: 8px;
  font-style: normal;
  font-weight: 700;
}

.kc-cockpit-attention-section h2,
.kc-cockpit-response-section h2 {
  margin: 12px 0 16px;
  font-size: clamp(34px,4vw,50px);
  letter-spacing: -.04em;
}

.kc-cockpit-chart-window,
.kc-cockpit-week-window,
.kc-cockpit-team-window,
.kc-cockpit-open-window {
  height: 100%;
  padding: 18px;
}

.kc-cockpit-chart-head {
  align-items: flex-start;
}

.kc-cockpit-chart-head small,
.kc-cockpit-chart-head strong {
  display: block;
}

.kc-cockpit-chart-head small {
  color: rgba(255,255,255,.43);
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.kc-cockpit-chart-head strong {
  margin-top: 3px;
  font-size: 11px;
}

.kc-cockpit-chart-head > span {
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(14,230,176,.07);
  color: var(--accent-color);
  font-size: 8px;
  font-weight: 700;
}

.kc-cockpit-chart-head > span.is-danger {
  background: rgba(220,53,69,.08);
  color: #ff7887;
}

.kc-cockpit-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 16px;
}

.kc-cockpit-filter-row span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 9px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 999px;
  color: rgba(255,255,255,.48);
  font-size: 8px;
}

.kc-cockpit-filter-row span.is-active {
  background: rgba(255,255,255,.045);
  color: rgba(255,255,255,.78);
}

.kc-cockpit-filter-row i,
.kc-cockpit-week-legend i {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
}

.kc-cockpit-filter-row i.guest,
.kc-cockpit-week-legend i.guest,
.kc-cockpit-week-bar span.guest {
  background: #dc3545;
}

.kc-cockpit-filter-row i.kitchen,
.kc-cockpit-week-legend i.kitchen,
.kc-cockpit-week-bar span.kitchen {
  background: #ffc107;
}

.kc-cockpit-filter-row i.internal,
.kc-cockpit-week-legend i.internal,
.kc-cockpit-week-bar span.internal {
  background: #6f42c1;
}

.kc-cockpit-filter-row i.cleartalk,
.kc-cockpit-week-legend i.cleartalk,
.kc-cockpit-week-bar span.cleartalk {
  background: #0d6efd;
}

.kc-cockpit-chart {
  display: block;
  width: 100%;
  min-height: 260px;
  margin-top: 11px;
}

.kc-cockpit-chart-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: rgba(255,255,255,.46);
  font-size: 8px;
}

.kc-cockpit-chart-note i {
  flex: 0 0 auto;
  width: 18px;
  height: 2px;
  margin-top: 5px;
  border-top: 2px dashed #8994a1;
}

.kc-cockpit-week-bars {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px;
  height: 245px;
  margin: 20px 0 12px;
  padding: 0 5px;
}

.kc-cockpit-week-day {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  height: 100%;
}

.kc-cockpit-week-day small {
  margin-top: 7px;
  color: rgba(255,255,255,.43);
  font-size: 8px;
}

.kc-cockpit-week-bar {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: min(28px, 75%);
  overflow: hidden;
  border-radius: 7px 7px 2px 2px;
  background: rgba(255,255,255,.05);
}

.kc-cockpit-week-bar span {
  display: block;
  width: 100%;
}

.kc-cockpit-load-legend {
  margin-top: 16px;
}

.kc-cockpit-load-legend i.good {
  background: var(--accent-color);
}

.kc-cockpit-load-legend i.busy {
  background: #ffc107;
}

.kc-cockpit-load-legend i.swimming {
  background: #dc3545;
}

.kc-cockpit-waiter-list {
  display: grid;
  gap: 10px;
  margin-top: 15px;
}

.kc-cockpit-waiter-list article {
  display: grid;
  grid-template-columns: 45px minmax(0,1fr) auto;
  gap: 11px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 14px;
  background: rgba(255,255,255,.035);
}

.kc-cockpit-waiter-list article.is-busy {
  border-color: rgba(255,193,7,.16);
}

.kc-cockpit-waiter-list article.is-swimming {
  border-color: rgba(220,53,69,.18);
}

.kc-cockpit-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 45px;
  height: 45px;
  border-radius: 14px;
  background: rgba(14,230,176,.09);
  color: var(--accent-color);
  font-size: 13px;
  font-weight: 700;
}

.kc-cockpit-waiter-main > div:first-child {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.kc-cockpit-waiter-main strong {
  font-size: 10px;
}

.kc-cockpit-waiter-main span {
  color: rgba(255,255,255,.45);
  font-size: 8px;
}

.kc-cockpit-loadbar {
  margin-top: 8px;
}

.kc-cockpit-waiter-list article.is-busy .kc-cockpit-loadbar span {
  background: #ffc107;
}

.kc-cockpit-waiter-list article.is-swimming .kc-cockpit-loadbar span {
  background: #dc3545;
}

.kc-cockpit-waiter-score {
  text-align: right;
}

.kc-cockpit-waiter-score strong,
.kc-cockpit-waiter-score small,
.kc-cockpit-waiter-score em {
  display: block;
}

.kc-cockpit-waiter-score > strong {
  font-size: 17px;
}

.kc-cockpit-waiter-score small {
  color: rgba(255,255,255,.38);
  font-size: 7px;
}

.kc-cockpit-waiter-score em {
  margin-top: 4px;
  font-size: 7.5px;
  font-style: normal;
  font-weight: 700;
}

.kc-cockpit-waiter-score em.good {
  color: var(--accent-color);
}

.kc-cockpit-waiter-score em.busy {
  color: #ffd45b;
}

.kc-cockpit-waiter-score em.swimming {
  color: #ff7887;
}

.kc-cockpit-open-list {
  display: grid;
  gap: 9px;
  margin-top: 15px;
}

.kc-cockpit-open-list article {
  display: grid;
  grid-template-columns: 40px minmax(0,1fr) auto;
  gap: 9px;
  align-items: center;
  padding: 11px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 13px;
  background: rgba(255,255,255,.035);
}

.kc-cockpit-open-list article > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: rgba(14,230,176,.08);
  color: var(--accent-color);
}

.kc-cockpit-open-list article.is-danger > i {
  background: rgba(220,53,69,.10);
  color: #ff7887;
}

.kc-cockpit-open-list article.is-warning > i {
  background: rgba(255,193,7,.10);
  color: #ffd45b;
}

.kc-cockpit-open-list strong,
.kc-cockpit-open-list span,
.kc-cockpit-open-list small {
  display: block;
}

.kc-cockpit-open-list strong {
  font-size: 9.5px;
}

.kc-cockpit-open-list span {
  margin-top: 2px;
  color: rgba(255,255,255,.45);
  font-size: 8px;
}

.kc-cockpit-open-list small {
  margin-top: 4px;
  color: rgba(255,255,255,.36);
  font-size: 7px;
}

.kc-cockpit-open-list em {
  color: rgba(255,255,255,.62);
  font-size: 8px;
  font-style: normal;
  font-weight: 700;
}

.kc-cockpit-response-points {
  display: grid;
  gap: 11px;
  margin-top: 24px;
}

.kc-cockpit-response-points article {
  display: grid;
  grid-template-columns: 43px minmax(0,1fr);
  gap: 12px;
  align-items: start;
  padding: 14px;
  border: 1px solid var(--kc-card-border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-cockpit-response-points article > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 43px;
  height: 43px;
  border-radius: 14px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 18px;
}

.kc-cockpit-response-points h3 {
  margin: 1px 0 4px;
  font-size: 15px;
}

.kc-cockpit-response-points p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 20%);
  font-size: 11px;
  line-height: 1.55;
}

.kc-cockpit-response-window {
  padding: 23px;
  background:
    radial-gradient(circle at 87% 10%, rgba(14,230,176,.12), transparent 29%),
    #09131c;
}

.kc-cockpit-response-main {
  text-align: center;
}

.kc-cockpit-response-main small,
.kc-cockpit-response-main strong,
.kc-cockpit-response-main > span {
  display: block;
}

.kc-cockpit-response-main small {
  color: rgba(255,255,255,.43);
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.kc-cockpit-response-main strong {
  margin: 7px 0;
  font-size: clamp(48px,7vw,78px);
  line-height: 1;
  letter-spacing: -.05em;
}

.kc-cockpit-response-main > span {
  color: var(--accent-color);
  font-size: 10px;
  font-weight: 700;
}

.kc-cockpit-response-meter {
  margin-top: 27px;
  padding: 15px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 15px;
  background: rgba(255,255,255,.035);
}

.kc-cockpit-response-meter > div:first-child {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: rgba(255,255,255,.54);
  font-size: 9px;
}

.kc-cockpit-response-meter > div:first-child strong {
  color: rgba(255,255,255,.88);
}

.kc-cockpit-response-meta {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 9px;
  margin-top: 12px;
}

.kc-cockpit-response-meta article {
  display: grid;
  grid-template-columns: 32px minmax(0,1fr);
  gap: 8px;
  align-items: center;
  padding: 11px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 13px;
  background: rgba(255,255,255,.03);
}

.kc-cockpit-response-meta i {
  color: var(--accent-color);
}

.kc-cockpit-response-meta strong,
.kc-cockpit-response-meta span {
  display: block;
}

.kc-cockpit-response-meta strong {
  font-size: 13px;
}

.kc-cockpit-response-meta span {
  color: rgba(255,255,255,.42);
  font-size: 7.5px;
}

.kc-cockpit-readiness-card {
  height: 100%;
  padding: 25px;
  border: 1px solid var(--kc-card-border);
  border-radius: 21px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-cockpit-readiness-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.kc-cockpit-readiness-top > div {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 13px;
  font-weight: 700;
}

.kc-cockpit-readiness-top i {
  color: var(--accent-color);
}

.kc-cockpit-readiness-top > strong {
  font-size: 26px;
  letter-spacing: -.04em;
}

.kc-cockpit-readiness-progress {
  height: 7px;
  margin-top: 17px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--default-color), transparent 92%);
}

.kc-cockpit-readiness-progress.is-primary span {
  background: #0d6efd;
}

.kc-cockpit-readiness-card p {
  margin: 13px 0 0;
  color: color-mix(in srgb, var(--default-color), transparent 25%);
  font-size: 11px;
}

.kc-cockpit-status-row {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 11px;
  margin-top: 18px;
}

.kc-cockpit-status-row > div {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 13px 15px;
  border: 1px solid var(--kc-card-border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
  font-size: 10px;
}

.kc-cockpit-status-row > div.is-success i {
  color: var(--accent-color);
}

.kc-cockpit-status-row > div.is-warning i {
  color: #d9ad28;
}

@media (max-width: 991.98px) {
  .kc-cockpit-live-cards {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .kc-cockpit-response-meta {
    grid-template-columns: 1fr;
  }

  .kc-cockpit-status-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767.98px) {
  .kc-cockpit-hero-board,
  .kc-cockpit-live-window,
  .kc-cockpit-attention-window,
  .kc-cockpit-chart-window,
  .kc-cockpit-week-window,
  .kc-cockpit-team-window,
  .kc-cockpit-open-window,
  .kc-cockpit-response-window {
    border-radius: 22px;
  }

  .kc-cockpit-chart {
    min-height: 220px;
  }

  .kc-cockpit-attention-section h2,
  .kc-cockpit-response-section h2 {
    font-size: clamp(30px,8vw,39px);
  }
}

@media (max-width: 520px) {
  .kc-cockpit-kpi-grid,
  .kc-cockpit-live-cards {
    grid-template-columns: 1fr;
  }

  .kc-cockpit-board-top,
  .kc-cockpit-window-head,
  .kc-cockpit-chart-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .kc-cockpit-hero-alert,
  .kc-cockpit-attention-list article,
  .kc-cockpit-open-list article {
    grid-template-columns: 38px minmax(0,1fr);
  }

  .kc-cockpit-hero-alert em,
  .kc-cockpit-attention-list em,
  .kc-cockpit-open-list em {
    grid-column: 2;
  }

  .kc-cockpit-waiter-list article {
    grid-template-columns: 42px minmax(0,1fr);
  }

  .kc-cockpit-waiter-score {
    grid-column: 2;
    text-align: left;
  }

  .kc-cockpit-waiter-score strong,
  .kc-cockpit-waiter-score small,
  .kc-cockpit-waiter-score em {
    display: inline-block;
    margin-right: 6px;
  }

  .kc-cockpit-week-bars {
    height: 200px;
    gap: 5px;
  }
}


/* =========================================================
   Detailseite 5 V1 – Speisekarte & 35 Sprachen
   ========================================================= */

.kc-menu-detail-page .section-title {
  max-width: 980px;
  margin-right: auto;
  margin-left: auto;
}

.kc-menu-detail-page .section-title h2 {
  font-size: clamp(31px, 3.15vw, 42px);
  line-height: 1.12;
  letter-spacing: -.035em;
}

.kc-menu-hero-device,
.kc-menu-admin-window,
.kc-menu-translate-window,
.kc-menu-guest-window,
.kc-menu-special-window {
  overflow: hidden;
  border: 1px solid var(--kc-card-border);
  border-radius: 28px;
  background: #09131c;
  color: #fff;
  box-shadow: 0 26px 68px rgba(0,0,0,.18);
}

.kc-menu-hero-device {
  padding: 20px;
  background:
    radial-gradient(circle at 91% 5%, rgba(14,230,176,.13), transparent 29%),
    radial-gradient(circle at 5% 98%, rgba(13,110,253,.10), transparent 31%),
    #09131c;
}

.kc-menu-device-top,
.kc-menu-window-head,
.kc-menu-guest-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.kc-menu-device-top > div,
.kc-menu-window-head > div {
  display: flex;
  align-items: center;
  gap: 8px;
}

.kc-menu-device-top strong,
.kc-menu-window-head strong {
  font-size: 12px;
}

.kc-menu-device-language,
.kc-menu-guest-lang {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 9px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  background: rgba(255,255,255,.045);
  color: rgba(255,255,255,.78);
  font-size: 9px;
}

.kc-menu-device-language img,
.kc-menu-device-langbar img,
.kc-menu-guest-lang img,
.kc-menu-language-chip img,
.kc-menu-source-language img,
.kc-menu-translate-status img {
  display: block;
  flex: 0 0 auto;
  object-fit: cover;
  border-radius: 3px;
  box-shadow: 0 0 0 1px rgba(255,255,255,.10);
}

.kc-menu-device-search {
  display: grid;
  grid-template-columns: 18px minmax(0,1fr) 18px;
  gap: 8px;
  align-items: center;
  margin-top: 16px;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 13px;
  background: rgba(255,255,255,.035);
  color: rgba(255,255,255,.38);
  font-size: 9px;
}

.kc-menu-device-search i:last-child {
  color: var(--accent-color);
}

.kc-menu-device-categories {
  display: flex;
  gap: 7px;
  overflow: hidden;
  margin-top: 12px;
}

.kc-menu-device-categories span {
  flex: 0 0 auto;
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.50);
  font-size: 8px;
}

.kc-menu-device-categories span.active {
  background: rgba(14,230,176,.09);
  color: var(--accent-color);
}

.kc-menu-device-item {
  display: grid;
  grid-template-columns: 64px minmax(0,1fr) auto;
  gap: 11px;
  align-items: start;
  margin-top: 11px;
  padding: 11px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 15px;
  background: rgba(255,255,255,.035);
}

.kc-menu-device-photo,
.kc-menu-admin-thumb,
.kc-menu-guest-photo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 13px;
  background: rgba(255,255,255,.055);
  color: rgba(255,255,255,.32);
  font-size: 19px;
}

.kc-menu-device-photo.is-special,
.kc-menu-guest-photo.is-special {
  background: rgba(255,193,7,.08);
  color: #ffd45b;
}

.kc-menu-device-item small,
.kc-menu-device-item strong,
.kc-menu-device-item p {
  display: block;
}

.kc-menu-device-item small {
  color: var(--accent-color);
  font-size: 7.5px;
  font-weight: 700;
}

.kc-menu-device-item strong {
  margin-top: 2px;
  font-size: 10.5px;
}

.kc-menu-device-item p {
  margin: 3px 0 0;
  color: rgba(255,255,255,.45);
  font-size: 8px;
  line-height: 1.45;
}

.kc-menu-device-item > em {
  color: var(--accent-color);
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}

.kc-menu-device-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 6px;
}

.kc-menu-device-tags span {
  padding: 3px 5px;
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  color: rgba(255,255,255,.43);
  font-size: 6.7px;
}

.kc-menu-device-langbar {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 13px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.07);
}

.kc-menu-device-langbar span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.45);
  font-size: 7px;
}

.kc-menu-device-langbar span.active {
  background: rgba(14,230,176,.09);
  color: var(--accent-color);
}

.kc-menu-admin-section,
.kc-menu-translate-section,
.kc-menu-special-section {
  overflow: hidden;
}

.kc-menu-import-section,
.kc-menu-languages-section,
.kc-menu-guest-section,
.kc-menu-packages-section {
  background: color-mix(in srgb, var(--surface-color), transparent 55%);
}

.kc-menu-admin-window,
.kc-menu-translate-window,
.kc-menu-special-window {
  padding: 18px;
}

.kc-menu-window-head {
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.kc-menu-window-head > div > i {
  color: var(--accent-color);
}

.kc-menu-window-head > span {
  color: rgba(255,255,255,.43);
  font-size: 8.5px;
}

.kc-menu-admin-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 14px;
}

.kc-menu-admin-toolbar button,
.kc-menu-admin-toolbar > span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  padding: 7px 9px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 10px;
  background: rgba(255,255,255,.035);
  color: rgba(255,255,255,.58);
  font-size: 8px;
}

.kc-menu-admin-toolbar button:first-child {
  border-color: rgba(14,230,176,.16);
  background: rgba(14,230,176,.06);
  color: var(--accent-color);
}

.kc-menu-admin-list {
  display: grid;
  gap: 9px;
  margin-top: 13px;
}

.kc-menu-admin-list article {
  display: grid;
  grid-template-columns: 58px minmax(0,1fr) auto;
  gap: 11px;
  align-items: center;
  padding: 11px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 14px;
  background: rgba(255,255,255,.035);
}

.kc-menu-admin-list article.is-muted {
  opacity: .62;
}

.kc-menu-admin-thumb {
  width: 58px;
  height: 58px;
}

.kc-menu-admin-thumb.is-photo {
  background: rgba(13,110,253,.08);
  color: #70aaff;
}

.kc-menu-admin-copy small,
.kc-menu-admin-copy strong,
.kc-menu-admin-copy p {
  display: block;
}

.kc-menu-admin-copy small {
  color: rgba(255,255,255,.38);
  font-size: 7px;
  text-transform: uppercase;
}

.kc-menu-admin-copy strong {
  margin-top: 2px;
  font-size: 10px;
}

.kc-menu-admin-copy p {
  margin: 2px 0 0;
  color: rgba(255,255,255,.43);
  font-size: 7.5px;
}

.kc-menu-admin-copy > div {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 6px;
}

.kc-menu-admin-copy > div span {
  padding: 3px 5px;
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  color: rgba(255,255,255,.42);
  font-size: 6.5px;
}

.kc-menu-admin-copy > div span.price {
  color: var(--accent-color);
}

.kc-menu-admin-copy > div span.category {
  color: #70aaff;
}

.kc-menu-admin-list article > em {
  color: rgba(255,255,255,.45);
  font-size: 7.5px;
  font-style: normal;
}

.kc-menu-admin-list article > em.is-active {
  color: var(--accent-color);
}

.kc-menu-admin-section h2,
.kc-menu-translate-section h2,
.kc-menu-special-section h2 {
  margin: 12px 0 16px;
  font-size: clamp(32px, 3.6vw, 46px);
  line-height: 1.13;
  letter-spacing: -.04em;
}

.kc-menu-admin-points,
.kc-menu-translate-points,
.kc-menu-special-points,
.kc-menu-guest-benefits {
  display: grid;
  gap: 10px;
  margin-top: 23px;
}

.kc-menu-admin-points article,
.kc-menu-translate-points article,
.kc-menu-special-points article,
.kc-menu-guest-benefits article {
  display: grid;
  grid-template-columns: 43px minmax(0,1fr);
  gap: 11px;
  align-items: start;
  padding: 13px;
  border: 1px solid var(--kc-card-border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-menu-admin-points article > i,
.kc-menu-translate-points article > i,
.kc-menu-special-points article > i,
.kc-menu-guest-benefits article > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 43px;
  height: 43px;
  border-radius: 14px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 18px;
}

.kc-menu-admin-points h3,
.kc-menu-translate-points h3,
.kc-menu-special-points h3,
.kc-menu-guest-benefits h3 {
  margin: 1px 0 4px;
  font-size: 15px;
}

.kc-menu-admin-points p,
.kc-menu-translate-points p,
.kc-menu-special-points p,
.kc-menu-guest-benefits p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 20%);
  font-size: 11px;
  line-height: 1.55;
}

.kc-menu-import-step {
  height: 100%;
  overflow: hidden;
  border: 1px solid var(--kc-card-border);
  border-radius: 22px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
  box-shadow: 0 15px 38px rgba(0,0,0,.09);
}

.kc-menu-import-step > div:last-child {
  padding: 22px;
}

.kc-menu-import-visual {
  display: flex;
  min-height: 190px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 22px;
  border-bottom: 1px solid var(--kc-card-border);
  background:
    radial-gradient(circle at 88% 4%, rgba(14,230,176,.10), transparent 35%),
    #09131c;
  color: #fff;
  text-align: center;
}

.kc-menu-import-visual > i {
  color: var(--accent-color);
  font-size: 36px;
}

.kc-menu-import-visual strong {
  font-size: 12px;
}

.kc-menu-import-visual > span {
  color: rgba(255,255,255,.47);
  font-size: 8px;
}

.kc-menu-import-visual.is-review {
  display: flex;
  flex-flow: row wrap;
  align-content: center;
  align-items: center;
  gap: 7px;
}

.kc-menu-import-visual.is-review span {
  padding: 8px 10px;
  border: 1px solid rgba(255,193,7,.13);
  border-radius: 999px;
  background: rgba(255,193,7,.06);
  color: #ffd45b;
  font-size: 8px;
}

.kc-menu-import-visual.is-accept > i {
  font-size: 40px;
}

.kc-menu-step-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  margin-bottom: 13px;
  border-radius: 11px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 10px;
  font-weight: 700;
}

.kc-menu-import-step h3 {
  margin-bottom: 8px;
  font-size: 18px;
}

.kc-menu-import-step p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 19%);
  font-size: 12px;
  line-height: 1.62;
}

.kc-menu-source-language {
  display: grid;
  grid-template-columns: 50px minmax(0,1fr) auto;
  gap: 14px;
  align-items: center;
  max-width: 720px;
  margin: 0 auto;
  padding: 16px 18px;
  border: 1px solid rgba(14,230,176,.20);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
  box-shadow: 0 12px 32px rgba(0,0,0,.08);
}

.kc-menu-source-language small,
.kc-menu-source-language strong,
.kc-menu-source-language span {
  display: block;
}

.kc-menu-source-language small {
  color: color-mix(in srgb, var(--default-color), transparent 46%);
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.kc-menu-source-language strong {
  margin-top: 2px;
  font-size: 17px;
}

.kc-menu-source-language span {
  margin-top: 2px;
  color: color-mix(in srgb, var(--default-color), transparent 28%);
  font-size: 10px;
}

.kc-menu-source-language em {
  padding: 7px 9px;
  border-radius: 999px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 8px;
  font-style: normal;
  font-weight: 700;
}

.kc-menu-language-intro {
  display: flex;
  justify-content: center;
  margin: 18px 0 13px;
}

.kc-menu-language-intro span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: color-mix(in srgb, var(--default-color), transparent 25%);
  font-size: 11px;
  font-weight: 600;
}

.kc-menu-language-intro i {
  color: var(--accent-color);
}

.kc-menu-language-cloud {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
}

.kc-menu-language-chip {
  display: inline-grid;
  grid-template-columns: 24px auto;
  gap: 8px;
  align-items: center;
  min-width: 150px;
  padding: 8px 10px;
  border: 1px solid var(--kc-card-border);
  border-radius: 13px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-menu-language-chip strong,
.kc-menu-language-chip span {
  display: block;
}

.kc-menu-language-chip strong {
  font-size: 9px;
}

.kc-menu-language-chip span {
  margin-top: 1px;
  color: color-mix(in srgb, var(--default-color), transparent 42%);
  font-size: 7.5px;
}

.kc-menu-language-total {
  display: grid;
  grid-template-columns: 48px minmax(0,1fr);
  gap: 13px;
  align-items: center;
  max-width: 880px;
  margin: 20px auto 0;
  padding: 16px;
  border: 1px solid var(--kc-card-border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-menu-language-total > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 15px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 20px;
}

.kc-menu-language-total p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  font-size: 11px;
  line-height: 1.58;
}

.kc-menu-translate-status {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.kc-menu-translate-status article {
  display: grid;
  grid-template-columns: 30px minmax(0,1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 13px;
  background: rgba(255,255,255,.035);
}

.kc-menu-translate-status article.is-complete {
  border-color: rgba(14,230,176,.15);
  background: rgba(14,230,176,.045);
}

.kc-menu-translate-status article.is-partial {
  border-color: rgba(255,193,7,.15);
  background: rgba(255,193,7,.045);
}

.kc-menu-translate-status strong,
.kc-menu-translate-status span {
  display: block;
}

.kc-menu-translate-status strong {
  font-size: 9px;
}

.kc-menu-translate-status span {
  margin-top: 2px;
  color: rgba(255,255,255,.43);
  font-size: 7.5px;
}

.kc-menu-translate-status em {
  color: rgba(255,255,255,.50);
  font-size: 8.5px;
  font-style: normal;
  font-weight: 700;
}

.kc-menu-translate-status article.is-complete em {
  color: var(--accent-color);
}

.kc-menu-translate-status article.is-partial em {
  color: #ffd45b;
}

.kc-menu-translate-editor {
  display: grid;
  grid-template-columns: minmax(0,1fr) 20px minmax(0,1fr);
  gap: 8px;
  align-items: center;
  margin-top: 14px;
  padding: 12px;
  border: 1px solid rgba(13,110,253,.13);
  border-radius: 14px;
  background: rgba(13,110,253,.045);
}

.kc-menu-translate-editor > small,
.kc-menu-translate-editor > button {
  grid-column: 1 / -1;
}

.kc-menu-translate-editor > small {
  color: rgba(255,255,255,.38);
  font-size: 7.5px;
  text-transform: uppercase;
}

.kc-menu-translate-editor > div {
  padding: 9px;
  border-radius: 11px;
  background: rgba(255,255,255,.04);
}

.kc-menu-translate-editor > div span,
.kc-menu-translate-editor > div strong {
  display: block;
}

.kc-menu-translate-editor > div span {
  color: rgba(255,255,255,.38);
  font-size: 7px;
}

.kc-menu-translate-editor > div strong {
  margin-top: 2px;
  font-size: 8.5px;
}

.kc-menu-translate-editor > i {
  color: #70aaff;
  text-align: center;
}

.kc-menu-translate-editor > button {
  justify-self: start;
  padding: 7px 9px;
  border: 0;
  border-radius: 999px;
  background: rgba(14,230,176,.08);
  color: var(--accent-color);
  font-size: 7.5px;
  font-weight: 700;
}

.kc-menu-publish-rule {
  display: grid;
  grid-template-columns: 58px minmax(0,1fr);
  gap: 15px;
  align-items: start;
  margin-top: 28px;
  padding: 21px;
  border: 1px solid rgba(14,230,176,.18);
  border-radius: 20px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-menu-publish-rule-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  border-radius: 18px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 24px;
}

.kc-menu-publish-rule span {
  color: var(--accent-color);
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.kc-menu-publish-rule h3 {
  margin: 5px 0 7px;
  font-size: 21px;
}

.kc-menu-publish-rule p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 21%);
  font-size: 12px;
  line-height: 1.62;
}

.kc-menu-guest-window {
  padding: 19px;
  background:
    radial-gradient(circle at 91% 4%, rgba(13,110,253,.10), transparent 30%),
    #09131c;
}

.kc-menu-guest-top > div:first-child strong,
.kc-menu-guest-top > div:first-child span {
  display: block;
}

.kc-menu-guest-top > div:first-child strong {
  font-size: 13px;
}

.kc-menu-guest-top > div:first-child span {
  margin-top: 2px;
  color: rgba(255,255,255,.38);
  font-size: 8px;
}

.kc-menu-guest-controls {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 8px;
  margin-top: 14px;
}

.kc-menu-guest-controls > span,
.kc-menu-guest-controls button {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 36px;
  padding: 8px 10px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 11px;
  background: rgba(255,255,255,.035);
  color: rgba(255,255,255,.48);
  font-size: 8px;
}

.kc-menu-guest-controls button {
  color: #70aaff;
}

.kc-menu-guest-grid {
  display: grid;
  gap: 9px;
  margin-top: 12px;
}

.kc-menu-guest-grid article {
  display: grid;
  grid-template-columns: 62px minmax(0,1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 13px;
  background: rgba(255,255,255,.035);
}

.kc-menu-guest-photo {
  width: 62px;
  height: 62px;
}

.kc-menu-guest-grid small,
.kc-menu-guest-grid strong,
.kc-menu-guest-grid p {
  display: block;
}

.kc-menu-guest-grid small {
  color: #70aaff;
  font-size: 7px;
  font-weight: 700;
}

.kc-menu-guest-grid strong {
  margin-top: 2px;
  font-size: 9.5px;
}

.kc-menu-guest-grid p {
  margin: 2px 0 0;
  color: rgba(255,255,255,.43);
  font-size: 7.5px;
}

.kc-menu-guest-grid em {
  color: var(--accent-color);
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
}

.kc-menu-guest-filterbar {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 12px;
  padding-top: 11px;
  border-top: 1px solid rgba(255,255,255,.07);
}

.kc-menu-guest-filterbar span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.45);
  font-size: 7px;
}

.kc-menu-special-group {
  margin-top: 14px;
  padding: 13px;
  border: 1px solid rgba(255,193,7,.15);
  border-radius: 15px;
  background: rgba(255,193,7,.035);
}

.kc-menu-special-group header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.kc-menu-special-group header small,
.kc-menu-special-group header strong {
  display: block;
}

.kc-menu-special-group header small {
  color: rgba(255,255,255,.38);
  font-size: 7px;
  text-transform: uppercase;
}

.kc-menu-special-group header strong {
  margin-top: 2px;
  font-size: 12px;
}

.kc-menu-special-group header em {
  color: var(--accent-color);
  font-size: 8px;
  font-style: normal;
  font-weight: 700;
}

.kc-menu-special-rule-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 11px;
}

.kc-menu-special-rule-row span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  color: rgba(255,255,255,.52);
  font-size: 7px;
}

.kc-menu-special-items {
  display: grid;
  gap: 7px;
  margin-top: 11px;
}

.kc-menu-special-items > div {
  display: grid;
  grid-template-columns: 36px minmax(0,1fr) auto;
  gap: 9px;
  align-items: center;
  padding: 9px;
  border-radius: 11px;
  background: rgba(255,255,255,.035);
}

.kc-menu-special-items > div > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: rgba(255,255,255,.05);
  color: rgba(255,255,255,.32);
}

.kc-menu-special-items strong,
.kc-menu-special-items small {
  display: block;
}

.kc-menu-special-items strong {
  font-size: 8.5px;
}

.kc-menu-special-items small {
  margin-top: 2px;
  color: rgba(255,255,255,.38);
  font-size: 6.8px;
}

.kc-menu-special-items em {
  color: var(--accent-color);
  font-size: 8px;
  font-style: normal;
  font-weight: 700;
}

.kc-menu-special-preview {
  display: grid;
  grid-template-columns: 40px minmax(0,1fr);
  gap: 10px;
  align-items: center;
  margin-top: 11px;
  padding: 11px;
  border-radius: 13px;
  background: rgba(14,230,176,.055);
}

.kc-menu-special-preview > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: rgba(14,230,176,.08);
  color: var(--accent-color);
}

.kc-menu-special-preview strong,
.kc-menu-special-preview span {
  display: block;
}

.kc-menu-special-preview strong {
  font-size: 8.5px;
}

.kc-menu-special-preview span {
  margin-top: 2px;
  color: rgba(255,255,255,.42);
  font-size: 7px;
}

.kc-menu-package-card {
  height: 100%;
  padding: 29px;
  border: 1px solid var(--kc-card-border);
  border-radius: 24px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
  box-shadow: 0 16px 42px rgba(0,0,0,.09);
}

.kc-menu-package-card.is-premium {
  border-color: color-mix(in srgb, var(--accent-color), transparent 68%);
  box-shadow: 0 18px 48px rgba(14,230,176,.08);
}

.kc-menu-package-label {
  display: inline-flex;
  padding: 7px 9px;
  border-radius: 999px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 9px;
  font-weight: 700;
}

.kc-menu-package-price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-top: 18px;
}

.kc-menu-package-price strong {
  font-size: 38px;
  line-height: 1;
  letter-spacing: -.05em;
}

.kc-menu-package-price span {
  color: color-mix(in srgb, var(--default-color), transparent 40%);
  font-size: 10px;
}

.kc-menu-package-card h3 {
  margin: 17px 0;
  font-size: 21px;
}

.kc-menu-package-card ul {
  display: grid;
  gap: 9px;
  margin: 0 0 22px;
  padding: 0;
  list-style: none;
}

.kc-menu-package-card li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: color-mix(in srgb, var(--default-color), transparent 17%);
  font-size: 12px;
}

.kc-menu-package-card li i {
  flex: 0 0 auto;
  margin-top: 2px;
  color: var(--accent-color);
}

.kc-menu-package-note {
  display: grid;
  grid-template-columns: 42px minmax(0,1fr);
  gap: 11px;
  align-items: center;
  max-width: 900px;
  margin: 20px auto 0;
  padding: 14px 16px;
  border: 1px solid var(--kc-card-border);
  border-radius: 15px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-menu-package-note > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 13px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
}

.kc-menu-package-note p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 22%);
  font-size: 11px;
  line-height: 1.55;
}

@media (min-width: 1200px) {
  .kc-menu-detail-page .kc-menu-languages-section .section-title h2 {
    white-space: nowrap;
  }
}

@media (max-width: 991.98px) {
  .kc-menu-language-chip {
    min-width: 145px;
  }
}

@media (max-width: 767.98px) {
  .kc-menu-detail-page .section-title h2 {
    font-size: clamp(28px, 8vw, 37px);
  }

  .kc-menu-admin-section h2,
  .kc-menu-translate-section h2,
  .kc-menu-special-section h2 {
    font-size: clamp(29px, 8vw, 38px);
  }

  .kc-menu-source-language {
    grid-template-columns: 45px minmax(0,1fr);
  }

  .kc-menu-source-language em {
    grid-column: 2;
    justify-self: start;
  }

  .kc-menu-language-chip {
    min-width: calc(50% - 5px);
  }

  .kc-menu-translate-editor {
    grid-template-columns: 1fr;
  }

  .kc-menu-translate-editor > i {
    transform: rotate(90deg);
  }
}

@media (max-width: 520px) {
  .kc-menu-device-top,
  .kc-menu-guest-top,
  .kc-menu-window-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .kc-menu-device-item,
  .kc-menu-admin-list article,
  .kc-menu-guest-grid article {
    grid-template-columns: 58px minmax(0,1fr);
  }

  .kc-menu-device-item > em,
  .kc-menu-admin-list article > em,
  .kc-menu-guest-grid em {
    grid-column: 2;
  }

  .kc-menu-guest-controls {
    grid-template-columns: 1fr;
  }

  .kc-menu-language-chip {
    min-width: 100%;
  }

  .kc-menu-publish-rule,
  .kc-menu-language-total,
  .kc-menu-package-note {
    grid-template-columns: 1fr;
  }

  .kc-menu-special-items > div {
    grid-template-columns: 34px minmax(0,1fr);
  }

  .kc-menu-special-items em {
    grid-column: 2;
  }
}


/* =========================================================
   Detailseite 5 V2 – Sprachraster, Paket-CTA, Batch-Übersetzung
   ========================================================= */

/* Premium-Mehrsprachigkeit: Titel wirklich mittig halten */
.kc-menu-detail-page .kc-menu-languages-section .section-title {
  width: 100%;
  max-width: 1180px;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-right: 12px;
  padding-left: 12px;
  text-align: center !important;
}

.kc-menu-detail-page .kc-menu-languages-section .section-title h2,
.kc-menu-detail-page .kc-menu-languages-section .section-title p,
.kc-menu-detail-page .kc-menu-languages-section .section-title .description-title {
  margin-right: auto;
  margin-left: auto;
  text-align: center !important;
}

.kc-menu-detail-page .kc-menu-languages-section .section-title h2 {
  max-width: 1100px;
  font-size: clamp(31px, 3vw, 40px);
  white-space: normal !important;
}

/* 35 Zusatzsprachen: 5 Spalten x 7 Reihen auf großen Desktops */
.kc-menu-language-cloud {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 11px;
  width: 100%;
  max-width: 1180px;
  margin-right: auto;
  margin-left: auto;
}

.kc-menu-language-chip {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 11px;
  align-items: center;
  min-width: 0;
  min-height: 70px;
  padding: 12px 13px;
  border-radius: 15px;
}

.kc-menu-language-chip img {
  width: 38px;
  height: 29px;
  border-radius: 4px;
}

.kc-menu-language-chip strong {
  font-size: 13px;
  line-height: 1.15;
}

.kc-menu-language-chip span {
  margin-top: 3px;
  font-size: 10px;
  line-height: 1.2;
}

/* Batch-Nachziehen: bis zu 5 bereits begonnene Sprachen */
.kc-menu-batch-translate {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(420px, 1.08fr);
  gap: 28px;
  align-items: center;
  margin-top: 30px;
  padding: 26px;
  border: 1px solid var(--kc-card-border);
  border-radius: 24px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
  box-shadow: 0 16px 42px rgba(0,0,0,.08);
}

.kc-menu-batch-copy h3 {
  margin: 12px 0 10px;
  font-size: clamp(25px, 2.5vw, 34px);
  line-height: 1.15;
  letter-spacing: -.035em;
}

.kc-menu-batch-copy > p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  font-size: 12px;
  line-height: 1.65;
}

.kc-menu-batch-benefits {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 17px;
}

.kc-menu-batch-benefits span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 9px;
  border: 1px solid var(--kc-card-border);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface-color), transparent 2%);
  color: color-mix(in srgb, var(--default-color), transparent 20%);
  font-size: 9px;
  font-weight: 600;
}

.kc-menu-batch-benefits i {
  color: var(--accent-color);
}

.kc-menu-batch-change-note {
  display: grid;
  grid-template-columns: 37px minmax(0,1fr);
  gap: 10px;
  align-items: start;
  margin-top: 16px;
  padding: 12px;
  border: 1px solid color-mix(in srgb, var(--accent-color), transparent 82%);
  border-radius: 14px;
  background: var(--kc-accent-soft);
}

.kc-menu-batch-change-note > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 37px;
  height: 37px;
  border-radius: 11px;
  background: color-mix(in srgb, var(--accent-color), transparent 87%);
  color: var(--accent-color);
}

.kc-menu-batch-change-note p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  font-size: 10px;
  line-height: 1.58;
}

.kc-menu-batch-window {
  overflow: hidden;
  padding: 18px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 21px;
  background:
    radial-gradient(circle at 90% 5%, rgba(14,230,176,.11), transparent 32%),
    #09131c;
  color: #fff;
  box-shadow: 0 18px 48px rgba(0,0,0,.17);
}

.kc-menu-batch-window-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 13px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.kc-menu-batch-window-top > div {
  display: flex;
  align-items: center;
  gap: 8px;
}

.kc-menu-batch-window-top i {
  color: var(--accent-color);
}

.kc-menu-batch-window-top strong {
  font-size: 12px;
}

.kc-menu-batch-window-top > span {
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(14,230,176,.08);
  color: var(--accent-color);
  font-size: 8px;
  font-weight: 700;
}

.kc-menu-batch-list {
  display: grid;
  gap: 7px;
  margin-top: 13px;
}

.kc-menu-batch-list article {
  display: grid;
  grid-template-columns: 42px minmax(0,1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 12px;
  background: rgba(255,255,255,.035);
}

.kc-menu-batch-list img {
  width: 38px;
  height: 29px;
  object-fit: cover;
  border-radius: 4px;
  box-shadow: 0 0 0 1px rgba(255,255,255,.10);
}

.kc-menu-batch-list strong,
.kc-menu-batch-list span {
  display: block;
}

.kc-menu-batch-list strong {
  font-size: 9.5px;
}

.kc-menu-batch-list span {
  margin-top: 2px;
  color: rgba(255,255,255,.44);
  font-size: 7.5px;
}

.kc-menu-batch-list em {
  color: #ffd45b;
  font-size: 8.5px;
  font-style: normal;
  font-weight: 700;
}

.kc-menu-batch-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-top: 13px;
  padding: 9px 12px;
  border: 0;
  border-radius: 999px;
  background: var(--accent-color);
  color: #061711;
  font-size: 9px;
  font-weight: 800;
}

/* Paket-Buttons sichtbar wie auf der Haupt-Landingpage */
.kc-menu-package-actions {
  display: flex;
  align-items: center;
  margin-top: 2px;
}

.kc-menu-package-card .kc-menu-package-actions .btn-accent {
  width: auto !important;
  min-width: 0;
  padding: 11px 18px;
  border-color: var(--accent-color) !important;
  background: var(--accent-color) !important;
  color: #061711 !important;
  font-weight: 700;
  box-shadow: 0 10px 26px rgba(14,230,176,.16);
}

.kc-menu-package-card .kc-menu-package-actions .btn-accent:hover {
  transform: translateY(-1px);
  filter: brightness(.96);
}

/* Unterer Hinweis so breit wie die beiden Paketkarten zusammen */
.kc-menu-packages-section .kc-menu-package-note {
  width: 83.333333%;
  max-width: none;
  margin-top: 22px;
}

@media (max-width: 1199.98px) {
  .kc-menu-language-cloud {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .kc-menu-batch-translate {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 991.98px) {
  .kc-menu-language-cloud {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .kc-menu-batch-translate {
    grid-template-columns: 1fr;
  }

  .kc-menu-packages-section .kc-menu-package-note {
    width: 100%;
  }
}

@media (max-width: 767.98px) {
  .kc-menu-language-cloud {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kc-menu-language-chip {
    min-height: 66px;
  }
}

@media (max-width: 520px) {
  .kc-menu-language-cloud {
    grid-template-columns: 1fr;
  }

  .kc-menu-batch-translate {
    padding: 19px;
  }

  .kc-menu-batch-change-note {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   Detailseite 6 V1 – ClearTalk / Quick Talk
   ========================================================= */

.kc-cleartalk-detail-page .section-title {
  max-width: 980px;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

.kc-cleartalk-detail-page .section-title h2 {
  font-size: clamp(31px, 3.05vw, 42px);
  line-height: 1.12;
  letter-spacing: -.035em;
}

.kc-ct-hero-window,
.kc-ct-dialog-window,
.kc-ct-voice-window,
.kc-ct-quick-window {
  overflow: hidden;
  border: 1px solid var(--kc-card-border);
  border-radius: 28px;
  background: #09131c;
  color: #fff;
  box-shadow: 0 26px 68px rgba(0,0,0,.18);
}

.kc-ct-hero-window {
  padding: 19px;
  background:
    radial-gradient(circle at 92% 4%, rgba(75,123,236,.14), transparent 31%),
    radial-gradient(circle at 4% 97%, rgba(99,184,134,.12), transparent 31%),
    #09131c;
}

.kc-ct-window-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 13px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.kc-ct-window-head > div {
  display: flex;
  align-items: center;
  gap: 8px;
}

.kc-ct-window-head strong {
  font-size: 12px;
}

.kc-ct-window-head > div > i {
  color: var(--accent-color);
}

.kc-ct-window-head > span,
.kc-ct-connected {
  color: rgba(255,255,255,.44);
  font-size: 8px;
}

.kc-ct-connected {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(99,184,134,.09);
  color: #7cd19d;
  font-weight: 700;
}

.kc-ct-connected i {
  font-size: 6px;
}

.kc-ct-table-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  margin-top: 11px;
  color: rgba(255,255,255,.42);
  font-size: 8px;
}

.kc-ct-lang-pill,
.kc-ct-speaker-switch span,
.kc-ct-speaker-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.kc-ct-lang-pill {
  padding: 5px 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.045);
  color: rgba(255,255,255,.68);
}

.kc-ct-lang-pill img,
.kc-ct-speaker-switch img,
.kc-ct-text-line img,
.kc-ct-dialog-card img,
.kc-ct-quick-result img,
.kc-ct-speaker-badge img,
.kc-ct-language-chip img,
.kc-ct-staff-language img,
.kc-ct-flow-visual img,
.kc-ct-transcript-result img {
  display: block;
  flex: 0 0 auto;
  object-fit: cover;
  border-radius: 4px;
  box-shadow: 0 0 0 1px rgba(255,255,255,.10);
}

.kc-ct-speaker-switch {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 7px;
  margin-top: 11px;
}

.kc-ct-speaker-switch span {
  justify-content: center;
  padding: 7px 9px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  color: rgba(255,255,255,.51);
  font-size: 8px;
  font-weight: 700;
}

.kc-ct-speaker-switch span.is-guest {
  border-color: rgba(99,184,134,.19);
  background: rgba(99,184,134,.09);
  color: #8bd8a8;
}

.kc-ct-chat-preview {
  display: grid;
  gap: 9px;
  margin-top: 12px;
}

.kc-ct-chat-preview article {
  max-width: 91%;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 15px;
}

.kc-ct-chat-preview article.guest {
  justify-self: start;
  background: rgba(255,255,255,.045);
}

.kc-ct-chat-preview article.staff {
  justify-self: end;
  background: rgba(75,123,236,.18);
  border-color: rgba(75,123,236,.22);
}

.kc-ct-chat-preview article > small {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 6px;
  color: rgba(255,255,255,.42);
  font-size: 7px;
  font-weight: 700;
}

.kc-ct-text-line,
.kc-ct-dialog-card > div,
.kc-ct-transcript-result > div {
  display: grid;
  grid-template-columns: 24px minmax(0,1fr) 24px;
  gap: 7px;
  align-items: start;
}

.kc-ct-text-line {
  padding: 6px 0;
  color: rgba(255,255,255,.80);
  font-size: 8px;
  line-height: 1.45;
}

.kc-ct-text-line + .kc-ct-text-line {
  border-top: 1px solid rgba(255,255,255,.07);
}

.kc-ct-text-line.is-translation {
  color: rgba(255,255,255,.58);
}

.kc-ct-text-line > i,
.kc-ct-dialog-card > div > i,
.kc-ct-transcript-result > div > i,
.kc-ct-quick-result > i {
  color: rgba(255,255,255,.48);
  text-align: center;
}

.kc-ct-composer-preview {
  display: grid;
  grid-template-columns: 38px minmax(0,1fr) 38px;
  gap: 0;
  align-items: stretch;
  margin-top: 11px;
}

.kc-ct-composer-preview button,
.kc-ct-composer-preview > span {
  min-height: 38px;
  border: 0;
}

.kc-ct-composer-preview button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #4b7bec;
  color: #fff;
}

.kc-ct-composer-preview button:first-child {
  border-radius: 10px 0 0 10px;
}

.kc-ct-composer-preview button.is-send {
  border-radius: 0 10px 10px 0;
}

.kc-ct-composer-preview > span {
  display: flex;
  align-items: center;
  padding: 0 10px;
  background: rgba(75,123,236,.84);
  color: rgba(255,255,255,.82);
  font-size: 8px;
}

.kc-ct-situation-card,
.kc-ct-session-card {
  height: 100%;
  padding: 22px;
  border: 1px solid var(--kc-card-border);
  border-radius: 20px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-ct-situation-card > i,
.kc-ct-session-card > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 47px;
  height: 47px;
  margin-bottom: 15px;
  border-radius: 15px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 19px;
}

.kc-ct-situation-card h3,
.kc-ct-session-card h3 {
  margin-bottom: 7px;
  font-size: 17px;
}

.kc-ct-situation-card p,
.kc-ct-session-card p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 18%);
  font-size: 12px;
  line-height: 1.6;
}

.kc-ct-flow-section,
.kc-ct-languages-section,
.kc-ct-voice-section,
.kc-ct-session-section {
  background: color-mix(in srgb, var(--surface-color), transparent 55%);
}

.kc-ct-flow-card {
  height: 100%;
  overflow: hidden;
  border: 1px solid var(--kc-card-border);
  border-radius: 21px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
  box-shadow: 0 15px 38px rgba(0,0,0,.08);
}

.kc-ct-flow-card > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  margin: 20px 20px 0;
  border-radius: 11px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 10px;
  font-weight: 700;
}

.kc-ct-flow-visual {
  display: flex;
  min-height: 165px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin: 12px 20px 0;
  border-radius: 17px;
  background:
    radial-gradient(circle at 86% 8%, rgba(14,230,176,.10), transparent 37%),
    #09131c;
  color: #fff;
  text-align: center;
}

.kc-ct-flow-visual > i {
  color: var(--accent-color);
  font-size: 31px;
}

.kc-ct-flow-visual strong {
  font-size: 11px;
}

.kc-ct-flow-visual small {
  color: rgba(255,255,255,.44);
  font-size: 8px;
}

.kc-ct-flow-visual.is-language img {
  width: 38px;
  height: 29px;
}

.kc-ct-flow-visual.is-speaker {
  flex-direction: row;
}

.kc-ct-flow-visual.is-speaker span {
  padding: 8px 10px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 700;
}

.kc-ct-flow-visual.is-speaker span.guest {
  background: rgba(99,184,134,.14);
  color: #8bd8a8;
}

.kc-ct-flow-visual.is-speaker span.staff {
  background: rgba(75,123,236,.18);
  color: #8fafff;
}

.kc-ct-flow-card h3 {
  margin: 17px 20px 7px;
  font-size: 17px;
}

.kc-ct-flow-card > p {
  margin: 0;
  padding: 0 20px 22px;
  color: color-mix(in srgb, var(--default-color), transparent 20%);
  font-size: 11px;
  line-height: 1.62;
}

.kc-ct-staff-language {
  display: grid;
  grid-template-columns: 50px minmax(0,1fr) auto;
  gap: 14px;
  align-items: center;
  max-width: 720px;
  margin: 0 auto;
  padding: 16px 18px;
  border: 1px solid rgba(14,230,176,.20);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
  box-shadow: 0 12px 32px rgba(0,0,0,.08);
}

.kc-ct-staff-language small,
.kc-ct-staff-language strong,
.kc-ct-staff-language span {
  display: block;
}

.kc-ct-staff-language small {
  color: color-mix(in srgb, var(--default-color), transparent 46%);
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.kc-ct-staff-language strong {
  margin-top: 2px;
  font-size: 17px;
}

.kc-ct-staff-language span {
  margin-top: 2px;
  color: color-mix(in srgb, var(--default-color), transparent 28%);
  font-size: 10px;
}

.kc-ct-staff-language em {
  padding: 7px 9px;
  border-radius: 999px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 8px;
  font-style: normal;
  font-weight: 700;
}

.kc-ct-language-intro {
  display: flex;
  justify-content: center;
  margin: 18px 0 13px;
}

.kc-ct-language-intro span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: color-mix(in srgb, var(--default-color), transparent 25%);
  font-size: 11px;
  font-weight: 600;
}

.kc-ct-language-intro i {
  color: var(--accent-color);
}

.kc-ct-language-grid {
  display: grid;
  grid-template-columns: repeat(5,minmax(0,1fr));
  gap: 11px;
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
}

.kc-ct-language-chip {
  display: grid;
  grid-template-columns: 42px minmax(0,1fr);
  gap: 11px;
  align-items: center;
  min-height: 70px;
  padding: 12px 13px;
  border: 1px solid var(--kc-card-border);
  border-radius: 15px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-ct-language-chip img {
  width: 38px;
  height: 29px;
}

.kc-ct-language-chip strong,
.kc-ct-language-chip span {
  display: block;
}

.kc-ct-language-chip strong {
  font-size: 13px;
  line-height: 1.15;
}

.kc-ct-language-chip span {
  margin-top: 3px;
  color: color-mix(in srgb, var(--default-color), transparent 42%);
  font-size: 10px;
  line-height: 1.2;
}

.kc-ct-language-note {
  display: grid;
  grid-template-columns: 46px minmax(0,1fr);
  gap: 12px;
  align-items: center;
  max-width: 940px;
  margin: 20px auto 0;
  padding: 15px 17px;
  border: 1px solid var(--kc-card-border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-ct-language-note > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 19px;
}

.kc-ct-language-note p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 20%);
  font-size: 11px;
  line-height: 1.6;
}

.kc-ct-dialog-window,
.kc-ct-voice-window,
.kc-ct-quick-window {
  padding: 18px;
}

.kc-ct-dialog-card {
  margin-top: 13px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 15px;
}

.kc-ct-dialog-card.guest {
  background: rgba(99,184,134,.07);
  border-color: rgba(99,184,134,.13);
}

.kc-ct-dialog-card.staff {
  background: rgba(75,123,236,.12);
  border-color: rgba(75,123,236,.17);
}

.kc-ct-dialog-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 8px;
  color: rgba(255,255,255,.65);
  font-size: 8px;
  font-weight: 700;
}

.kc-ct-dialog-card > div {
  padding: 8px 0;
  color: rgba(255,255,255,.78);
  font-size: 8.5px;
  line-height: 1.45;
}

.kc-ct-dialog-card > div.translated {
  border-top: 1px solid rgba(255,255,255,.07);
  color: rgba(255,255,255,.56);
}

.kc-ct-direction-arrow {
  display: flex;
  justify-content: center;
  margin: 6px 0 -5px;
  color: rgba(255,255,255,.34);
}

.kc-ct-bidirectional-section h2,
.kc-ct-quick-section h2 {
  margin: 12px 0 16px;
  font-size: clamp(32px,3.55vw,46px);
  line-height: 1.13;
  letter-spacing: -.04em;
}

.kc-ct-feature-points {
  display: grid;
  gap: 10px;
  margin-top: 23px;
}

.kc-ct-feature-points article {
  display: grid;
  grid-template-columns: 43px minmax(0,1fr);
  gap: 11px;
  align-items: start;
  padding: 13px;
  border: 1px solid var(--kc-card-border);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-ct-feature-points article > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 43px;
  height: 43px;
  border-radius: 14px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 18px;
}

.kc-ct-feature-points h3 {
  margin: 1px 0 4px;
  font-size: 15px;
}

.kc-ct-feature-points p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 20%);
  font-size: 11px;
  line-height: 1.55;
}

.kc-ct-waveform {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  height: 105px;
  margin-top: 13px;
  border-radius: 15px;
  background: rgba(255,255,255,.035);
}

.kc-ct-waveform span {
  width: 4px;
  border-radius: 999px;
  background: #63b886;
}

.kc-ct-waveform span:nth-child(1), .kc-ct-waveform span:nth-child(17) { height: 18px; }
.kc-ct-waveform span:nth-child(2), .kc-ct-waveform span:nth-child(16) { height: 31px; }
.kc-ct-waveform span:nth-child(3), .kc-ct-waveform span:nth-child(15) { height: 44px; }
.kc-ct-waveform span:nth-child(4), .kc-ct-waveform span:nth-child(14) { height: 24px; }
.kc-ct-waveform span:nth-child(5), .kc-ct-waveform span:nth-child(13) { height: 55px; }
.kc-ct-waveform span:nth-child(6), .kc-ct-waveform span:nth-child(12) { height: 38px; }
.kc-ct-waveform span:nth-child(7), .kc-ct-waveform span:nth-child(11) { height: 67px; }
.kc-ct-waveform span:nth-child(8), .kc-ct-waveform span:nth-child(10) { height: 47px; }
.kc-ct-waveform span:nth-child(9) { height: 76px; }

.kc-ct-audio-player {
  display: grid;
  grid-template-columns: 38px minmax(0,1fr) auto;
  gap: 10px;
  align-items: center;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 13px;
  background: rgba(255,255,255,.035);
}

.kc-ct-audio-player button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 50%;
  background: rgba(99,184,134,.14);
  color: #8bd8a8;
}

.kc-ct-audio-player strong,
.kc-ct-audio-player span {
  display: block;
}

.kc-ct-audio-player strong {
  font-size: 9px;
}

.kc-ct-audio-player span {
  margin-top: 2px;
  color: rgba(255,255,255,.41);
  font-size: 7px;
}

.kc-ct-audio-player em {
  color: rgba(255,255,255,.34);
  font-size: 7px;
  font-style: normal;
}

.kc-ct-transcribe-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 11px;
  padding: 8px 10px;
  border: 1px solid rgba(14,230,176,.18);
  border-radius: 999px;
  background: rgba(14,230,176,.07);
  color: var(--accent-color);
  font-size: 8px;
  font-weight: 700;
}

.kc-ct-transcript-result {
  display: grid;
  gap: 0;
  margin-top: 11px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 13px;
}

.kc-ct-transcript-result > div {
  padding: 10px;
  background: rgba(255,255,255,.03);
  color: rgba(255,255,255,.72);
  font-size: 8px;
}

.kc-ct-transcript-result > div + div {
  border-top: 1px solid rgba(255,255,255,.07);
  color: rgba(255,255,255,.53);
}

.kc-ct-voice-steps {
  display: grid;
  gap: 10px;
}

.kc-ct-voice-steps article {
  display: grid;
  grid-template-columns: 37px minmax(0,1fr);
  gap: 11px;
  align-items: start;
  padding: 13px;
  border: 1px solid var(--kc-card-border);
  border-radius: 15px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-ct-voice-steps article > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 37px;
  height: 37px;
  border-radius: 12px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 10px;
  font-weight: 700;
}

.kc-ct-voice-steps h3 {
  margin: 1px 0 3px;
  font-size: 14px;
}

.kc-ct-voice-steps p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 20%);
  font-size: 10px;
  line-height: 1.55;
}

.kc-ct-quick-list {
  display: grid;
  gap: 7px;
  margin-top: 13px;
}

.kc-ct-quick-list button {
  display: grid;
  grid-template-columns: 31px minmax(0,1fr) 20px;
  gap: 8px;
  align-items: center;
  width: 100%;
  padding: 9px 10px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 12px;
  background: rgba(255,255,255,.035);
  color: rgba(255,255,255,.74);
  text-align: left;
  font-size: 8.5px;
}

.kc-ct-quick-list button > i:first-child {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 31px;
  height: 31px;
  border-radius: 10px;
  background: rgba(75,123,236,.13);
  color: #8fafff;
}

.kc-ct-quick-list button > i:last-child {
  color: rgba(255,255,255,.29);
  text-align: right;
}

.kc-ct-quick-composer {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) 36px;
  gap: 8px;
  align-items: center;
  margin-top: 13px;
  padding: 9px;
  border: 1px solid rgba(75,123,236,.17);
  border-radius: 13px;
  background: rgba(75,123,236,.09);
}

.kc-ct-speaker-badge {
  padding: 6px 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  color: rgba(255,255,255,.66);
  font-size: 7px;
  font-weight: 700;
}

.kc-ct-quick-composer > span {
  color: rgba(255,255,255,.73);
  font-size: 8px;
}

.kc-ct-quick-composer > button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 11px;
  background: #4b7bec;
  color: #fff;
}

.kc-ct-quick-result {
  display: grid;
  grid-template-columns: 28px minmax(0,1fr) 26px;
  gap: 8px;
  align-items: center;
  margin-top: 9px;
  padding: 10px;
  border-radius: 13px;
  background: rgba(99,184,134,.065);
}

.kc-ct-quick-result small,
.kc-ct-quick-result strong {
  display: block;
}

.kc-ct-quick-result small {
  color: rgba(255,255,255,.38);
  font-size: 6.8px;
}

.kc-ct-quick-result strong {
  margin-top: 2px;
  color: rgba(255,255,255,.72);
  font-size: 8.5px;
}

.kc-ct-cockpit-note {
  display: grid;
  grid-template-columns: 58px minmax(0,1fr);
  gap: 15px;
  align-items: start;
  margin-top: 25px;
  padding: 20px;
  border: 1px solid rgba(14,230,176,.17);
  border-radius: 20px;
  background: color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-ct-cockpit-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  border-radius: 18px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 23px;
}

.kc-ct-cockpit-note span {
  color: var(--accent-color);
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.kc-ct-cockpit-note h3 {
  margin: 5px 0 7px;
  font-size: 20px;
}

.kc-ct-cockpit-note p {
  margin: 0;
  color: color-mix(in srgb, var(--default-color), transparent 20%);
  font-size: 11px;
  line-height: 1.6;
}

.kc-ct-package-card .kc-feature-package-price span {
  display: none;
}

@media (max-width: 1199.98px) {
  .kc-ct-language-grid {
    grid-template-columns: repeat(4,minmax(0,1fr));
  }
}

@media (max-width: 991.98px) {
  .kc-ct-language-grid {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }
}

@media (max-width: 767.98px) {
  .kc-cleartalk-detail-page .section-title h2 {
    font-size: clamp(28px,8vw,37px);
  }

  .kc-ct-bidirectional-section h2,
  .kc-ct-quick-section h2 {
    font-size: clamp(29px,8vw,38px);
  }

  .kc-ct-language-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .kc-ct-staff-language {
    grid-template-columns: 45px minmax(0,1fr);
  }

  .kc-ct-staff-language em {
    grid-column: 2;
    justify-self: start;
  }
}

@media (max-width: 520px) {
  .kc-ct-window-head,
  .kc-ct-table-line {
    align-items: flex-start;
    flex-direction: column;
  }

  .kc-ct-speaker-switch {
    grid-template-columns: 1fr;
  }

  .kc-ct-language-grid {
    grid-template-columns: 1fr;
  }

  .kc-ct-language-note,
  .kc-ct-cockpit-note {
    grid-template-columns: 1fr;
  }

  .kc-ct-quick-composer {
    grid-template-columns: 1fr;
  }

  .kc-ct-quick-composer > button {
    justify-self: end;
  }
}


/* =========================================================
   Detailseite 7 V1 – Bewertungen am Tisch
   ========================================================= */

.kc-reviews-detail-page .section-title {
  max-width: 990px;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

.kc-reviews-detail-page .section-title h2 {
  font-size: clamp(31px, 3.05vw, 42px);
  line-height: 1.12;
  letter-spacing: -.035em;
}

.kc-rev-hero-board,
.kc-rev-guest-window,
.kc-rev-context-window,
.kc-rev-admin-window,
.kc-rev-detail-window,
.kc-rev-cockpit-window,
.kc-rev-settings-window {
  overflow: hidden;
  border: 1px solid var(--kc-card-border);
  border-radius: 28px;
  background: #09131c;
  color: #fff;
  box-shadow: 0 26px 68px rgba(0,0,0,.18);
}

.kc-rev-hero-board {
  padding: 19px;
  background:
    radial-gradient(circle at 91% 6%, rgba(255,193,7,.13), transparent 31%),
    radial-gradient(circle at 4% 97%, rgba(14,230,176,.10), transparent 31%),
    #09131c;
}

.kc-rev-board-head,
.kc-rev-admin-head,
.kc-rev-context-head,
.kc-rev-detail-title,
.kc-rev-cockpit-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.kc-rev-board-head > div {
  display:flex;
  align-items:center;
  gap:8px;
}

.kc-rev-board-head strong {
  font-size:12px;
}

.kc-rev-new-pill {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 8px;
  border-radius:999px;
  background:rgba(255,193,7,.09);
  color:#ffd45b;
  font-size:8px;
  font-weight:700;
}

.kc-rev-kpi-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin-top:14px;
}

.kc-rev-kpi-grid article,
.kc-rev-admin-kpis article {
  padding:11px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:14px;
  background:rgba(255,255,255,.035);
}

.kc-rev-kpi-grid small,
.kc-rev-kpi-grid strong,
.kc-rev-kpi-grid span,
.kc-rev-admin-kpis small,
.kc-rev-admin-kpis strong,
.kc-rev-admin-kpis span {
  display:block;
}

.kc-rev-kpi-grid small,
.kc-rev-admin-kpis small {
  color:rgba(255,255,255,.40);
  font-size:7px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.kc-rev-kpi-grid strong,
.kc-rev-admin-kpis strong {
  margin-top:3px;
  font-size:20px;
  line-height:1.05;
}

.kc-rev-kpi-grid strong em,
.kc-rev-admin-kpis strong em {
  color:#ffc107;
  font-size:.72em;
  font-style:normal;
}

.kc-rev-kpi-grid span,
.kc-rev-admin-kpis span {
  margin-top:4px;
  color:rgba(255,255,255,.37);
  font-size:7px;
}

.kc-rev-preview-card {
  margin-top:10px;
  padding:12px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:15px;
  background:rgba(255,255,255,.04);
}

.kc-rev-preview-card.is-unread {
  border-color:rgba(255,193,7,.20);
  background:rgba(255,193,7,.045);
}

.kc-rev-preview-card header {
  display:grid;
  grid-template-columns:43px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
}

.kc-rev-avatar {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:43px;
  height:43px;
  border-radius:50%;
  background:rgba(14,230,176,.10);
  color:var(--accent-color);
  font-size:12px;
  font-weight:800;
  box-shadow:inset 0 0 0 1px rgba(14,230,176,.15);
}

.kc-rev-rating-line {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
}

.kc-rev-rating-line span {
  padding:4px 6px;
  border-radius:999px;
  background:rgba(14,230,176,.08);
  color:var(--accent-color);
  font-size:7px;
  font-weight:800;
}

.kc-rev-rating-line strong {
  color:#ffc107;
  font-size:10px;
  letter-spacing:1px;
}

.kc-rev-rating-line em {
  padding:4px 6px;
  border-radius:999px;
  background:rgba(255,193,7,.09);
  color:#ffd45b;
  font-size:6.5px;
  font-style:normal;
  font-weight:800;
}

.kc-rev-preview-card h3 {
  margin:3px 0 0;
  font-size:10px;
}

.kc-rev-preview-card header small,
.kc-rev-preview-card time {
  color:rgba(255,255,255,.38);
  font-size:7px;
}

.kc-rev-preview-card p {
  margin:10px 0 0;
  color:rgba(255,255,255,.68);
  font-size:8.5px;
  line-height:1.5;
}

.kc-rev-meta-row {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:9px;
}

.kc-rev-meta-row span {
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:5px 7px;
  border-radius:999px;
  background:rgba(255,255,255,.04);
  color:rgba(255,255,255,.42);
  font-size:7px;
}

.kc-rev-hero-insights {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:9px;
}

.kc-rev-hero-insights > div {
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  gap:7px;
  align-items:center;
  padding:9px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:12px;
  background:rgba(255,255,255,.03);
}

.kc-rev-hero-insights i {
  grid-row:1 / span 2;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  border-radius:9px;
  background:rgba(255,193,7,.07);
  color:#ffd45b;
}

.kc-rev-hero-insights span {
  color:rgba(255,255,255,.36);
  font-size:6.5px;
}

.kc-rev-hero-insights strong {
  font-size:7.5px;
}

.kc-rev-guest-section,
.kc-rev-admin-section,
.kc-rev-cockpit-section,
.kc-rev-settings-section {
  background:color-mix(in srgb, var(--surface-color), transparent 55%);
}

.kc-rev-guest-window {
  padding:18px;
  background:
    radial-gradient(circle at 90% 4%, rgba(14,230,176,.10), transparent 31%),
    #09131c;
}

.kc-rev-guest-top {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  padding-bottom:13px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.kc-rev-guest-top strong,
.kc-rev-guest-top span {
  display:block;
}

.kc-rev-guest-top strong {
  font-size:12px;
}

.kc-rev-guest-top span {
  margin-top:2px;
  color:rgba(255,255,255,.39);
  font-size:7.5px;
}

.kc-rev-guest-top button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  border:0;
  border-radius:9px;
  background:rgba(255,255,255,.045);
  color:rgba(255,255,255,.48);
}

.kc-rev-responsible-box {
  display:grid;
  grid-template-columns:43px minmax(0,1fr);
  gap:10px;
  align-items:center;
  margin-top:13px;
  padding:10px;
  border:1px solid rgba(14,230,176,.14);
  border-radius:13px;
  background:rgba(14,230,176,.045);
}

.kc-rev-responsible-box small,
.kc-rev-responsible-box strong {
  display:block;
}

.kc-rev-responsible-box small {
  color:rgba(255,255,255,.40);
  font-size:7px;
}

.kc-rev-responsible-box strong {
  margin-top:2px;
  font-size:9px;
}

.kc-rev-stars {
  display:flex;
  justify-content:center;
  gap:7px;
  margin:18px 0;
  color:#ffc107;
  font-size:29px;
}

.kc-rev-guest-window label {
  display:flex;
  justify-content:space-between;
  gap:8px;
  margin:10px 0 5px;
  color:rgba(255,255,255,.54);
  font-size:7.5px;
  font-weight:700;
}

.kc-rev-guest-window label span {
  color:rgba(255,255,255,.30);
  font-weight:500;
}

.kc-rev-input {
  min-height:37px;
  padding:10px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:10px;
  background:rgba(255,255,255,.035);
  color:rgba(255,255,255,.73);
  font-size:8px;
}

.kc-rev-input.kc-rev-textarea {
  min-height:70px;
}

.kc-rev-submit {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  width:100%;
  margin-top:13px;
  padding:10px 13px;
  border:0;
  border-radius:11px;
  background:var(--accent-color);
  color:#061711;
  font-size:9px;
  font-weight:800;
}

.kc-rev-guest-points,
.kc-rev-context-points,
.kc-rev-detail-points,
.kc-rev-settings-points {
  display:grid;
  gap:10px;
}

.kc-rev-guest-points article {
  display:grid;
  grid-template-columns:40px minmax(0,1fr);
  gap:11px;
  align-items:start;
  padding:14px;
  border:1px solid var(--kc-card-border);
  border-radius:16px;
  background:color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-rev-guest-points article > span {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:13px;
  background:var(--kc-accent-soft);
  color:var(--accent-color);
  font-size:10px;
  font-weight:800;
}

.kc-rev-guest-points h3,
.kc-rev-context-points h3,
.kc-rev-detail-points h3,
.kc-rev-settings-points h3 {
  margin:1px 0 4px;
  font-size:15px;
}

.kc-rev-guest-points p,
.kc-rev-context-points p,
.kc-rev-detail-points p,
.kc-rev-settings-points p {
  margin:0;
  color:color-mix(in srgb, var(--default-color), transparent 20%);
  font-size:11px;
  line-height:1.55;
}

.kc-rev-context-section h2,
.kc-rev-detail-section h2,
.kc-rev-cockpit-section h2,
.kc-rev-settings-section h2 {
  margin:12px 0 16px;
  font-size:clamp(32px,3.55vw,46px);
  line-height:1.13;
  letter-spacing:-.04em;
}

.kc-rev-context-points article,
.kc-rev-detail-points article,
.kc-rev-settings-points article {
  display:grid;
  grid-template-columns:43px minmax(0,1fr);
  gap:11px;
  align-items:start;
  padding:13px;
  border:1px solid var(--kc-card-border);
  border-radius:16px;
  background:color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-rev-context-points article > i,
.kc-rev-detail-points article > i,
.kc-rev-settings-points article > i {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:43px;
  height:43px;
  border-radius:14px;
  background:var(--kc-accent-soft);
  color:var(--accent-color);
  font-size:18px;
}

.kc-rev-context-window {
  padding:18px;
}

.kc-rev-context-head span {
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-size:10px;
  font-weight:700;
}

.kc-rev-context-head span i {
  color:var(--accent-color);
}

.kc-rev-context-head em {
  color:rgba(255,255,255,.40);
  font-size:8px;
  font-style:normal;
}

.kc-rev-context-flow {
  display:grid;
  grid-template-columns:minmax(0,1fr) 22px minmax(0,1fr) 22px minmax(0,1fr);
  gap:6px;
  align-items:center;
  margin-top:15px;
}

.kc-rev-context-flow > i {
  color:rgba(255,255,255,.28);
  text-align:center;
}

.kc-rev-context-flow article {
  display:flex;
  min-height:130px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:12px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:15px;
  background:rgba(255,255,255,.035);
  text-align:center;
}

.kc-rev-context-flow article > i {
  margin-bottom:8px;
  color:#ffc107;
  font-size:24px;
}

.kc-rev-context-flow article > .kc-rev-avatar {
  margin-bottom:8px;
}

.kc-rev-context-flow article small,
.kc-rev-context-flow article strong,
.kc-rev-context-flow article span {
  display:block;
}

.kc-rev-context-flow article small {
  color:rgba(255,255,255,.35);
  font-size:6.5px;
  text-transform:uppercase;
}

.kc-rev-context-flow article strong {
  margin-top:3px;
  font-size:10px;
}

.kc-rev-context-flow article span {
  margin-top:2px;
  color:rgba(255,255,255,.39);
  font-size:7px;
}

.kc-rev-context-note {
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  gap:9px;
  align-items:start;
  margin-top:12px;
  padding:10px;
  border-radius:12px;
  background:rgba(13,110,253,.055);
}

.kc-rev-context-note > i {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:10px;
  background:rgba(13,110,253,.08);
  color:#70aaff;
}

.kc-rev-context-note p {
  margin:0;
  color:rgba(255,255,255,.43);
  font-size:7.5px;
  line-height:1.5;
}

.kc-rev-admin-window {
  padding:18px;
  background:
    radial-gradient(circle at 92% 4%, rgba(255,193,7,.09), transparent 28%),
    #09131c;
}

.kc-rev-admin-head > div {
  display:grid;
  grid-template-columns:28px auto;
  gap:3px 8px;
  align-items:center;
}

.kc-rev-admin-head > div > i {
  grid-row:1 / span 2;
  color:#ffd45b;
  font-size:18px;
}

.kc-rev-admin-head strong {
  font-size:11px;
}

.kc-rev-admin-head span {
  color:rgba(255,255,255,.38);
  font-size:7px;
}

.kc-rev-admin-head button {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 9px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:9px;
  background:rgba(255,255,255,.035);
  color:rgba(255,255,255,.50);
  font-size:7.5px;
}

.kc-rev-admin-kpis {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:8px;
  margin-top:15px;
}

.kc-rev-admin-kpis article.is-unread {
  border-color:rgba(255,193,7,.18);
  background:rgba(255,193,7,.045);
}

.kc-rev-filterbar {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  margin-top:11px;
}

.kc-rev-filterbar > span {
  min-height:48px;
  padding:8px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:11px;
  background:rgba(255,255,255,.03);
}

.kc-rev-filterbar small,
.kc-rev-filterbar strong {
  display:block;
}

.kc-rev-filterbar small {
  color:rgba(255,255,255,.32);
  font-size:6.5px;
}

.kc-rev-filterbar strong {
  margin-top:2px;
  font-size:7.5px;
}

.kc-rev-filterbar span.is-search {
  display:flex;
  align-items:center;
  gap:7px;
  color:rgba(255,255,255,.38);
  font-size:7.5px;
}

.kc-rev-insight-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
  margin-top:11px;
}

.kc-rev-insight-grid article {
  padding:11px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:13px;
  background:rgba(255,255,255,.03);
}

.kc-rev-insight-grid header,
.kc-rev-insight-grid article > div {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  gap:8px;
  align-items:center;
}

.kc-rev-insight-grid header {
  padding-bottom:7px;
  border-bottom:1px solid rgba(255,255,255,.065);
}

.kc-rev-insight-grid header span {
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:7.5px;
  font-weight:700;
}

.kc-rev-insight-grid header i {
  color:#ffd45b;
}

.kc-rev-insight-grid header small {
  grid-column:3;
  color:rgba(255,255,255,.32);
  font-size:6px;
}

.kc-rev-insight-grid article > div {
  padding:7px 0;
  border-bottom:1px solid rgba(255,255,255,.045);
}

.kc-rev-insight-grid article > div:last-child {
  border-bottom:0;
}

.kc-rev-insight-grid article > div strong {
  font-size:7.5px;
}

.kc-rev-insight-grid article > div span {
  color:rgba(255,255,255,.35);
  font-size:6.7px;
}

.kc-rev-insight-grid article > div em {
  color:#ffd45b;
  font-size:7px;
  font-style:normal;
}

.kc-rev-admin-point {
  height:100%;
  padding:22px;
  border:1px solid var(--kc-card-border);
  border-radius:20px;
  background:color-mix(in srgb, var(--surface-color), transparent 3%);
}

.kc-rev-admin-point > i {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:47px;
  height:47px;
  margin-bottom:14px;
  border-radius:15px;
  background:var(--kc-accent-soft);
  color:var(--accent-color);
  font-size:19px;
}

.kc-rev-admin-point h3 {
  margin-bottom:7px;
  font-size:17px;
}

.kc-rev-admin-point p {
  margin:0;
  color:color-mix(in srgb, var(--default-color), transparent 19%);
  font-size:12px;
  line-height:1.6;
}

.kc-rev-detail-window {
  padding:18px;
}

.kc-rev-detail-title {
  padding-bottom:12px;
  border-bottom:1px solid rgba(255,255,255,.07);
}

.kc-rev-detail-title span {
  font-size:10px;
  font-weight:700;
}

.kc-rev-detail-title small {
  color:rgba(255,255,255,.35);
  font-size:7px;
}

.kc-rev-detail-card {
  margin-top:10px;
  padding:11px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:14px;
  background:rgba(255,255,255,.035);
}

.kc-rev-detail-card.is-unread {
  border-color:rgba(255,193,7,.18);
  background:rgba(255,193,7,.04);
}

.kc-rev-detail-card header {
  display:grid;
  grid-template-columns:43px minmax(0,1fr) auto;
  gap:10px;
  align-items:start;
}

.kc-rev-detail-card header > div:nth-child(2) {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:5px;
}

.kc-rev-detail-card h3,
.kc-rev-detail-card header small {
  flex-basis:100%;
  margin:0;
}

.kc-rev-detail-card h3 {
  margin-top:2px;
  font-size:9.5px;
}

.kc-rev-detail-card header small,
.kc-rev-detail-card time {
  color:rgba(255,255,255,.36);
  font-size:6.8px;
}

.kc-rev-badge {
  padding:4px 6px;
  border-radius:999px;
  background:rgba(220,53,69,.10);
  color:#ff7887;
  font-size:7px;
  font-weight:800;
}

.kc-rev-badge.is-good {
  background:rgba(14,230,176,.08);
  color:var(--accent-color);
}

.kc-rev-startext {
  color:#ffc107;
  font-size:8.5px;
  letter-spacing:.7px;
}

.kc-rev-detail-card header em {
  padding:4px 6px;
  border-radius:999px;
  background:rgba(255,193,7,.09);
  color:#ffd45b;
  font-size:6.5px;
  font-style:normal;
  font-weight:800;
}

.kc-rev-detail-meta {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:9px;
}

.kc-rev-detail-meta span {
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:5px 7px;
  border-radius:999px;
  background:rgba(255,255,255,.04);
  color:rgba(255,255,255,.41);
  font-size:6.8px;
}

.kc-rev-detail-card > p {
  margin:9px 0 0;
  color:rgba(255,255,255,.66);
  font-size:8px;
  line-height:1.5;
}

.kc-rev-detail-actions {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:9px;
}

.kc-rev-detail-actions button {
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:6px 8px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:999px;
  background:rgba(255,255,255,.035);
  color:rgba(255,255,255,.52);
  font-size:6.8px;
}

.kc-rev-cockpit-window {
  padding:18px;
  background:
    radial-gradient(circle at 90% 4%, rgba(255,193,7,.10), transparent 30%),
    #09131c;
}

.kc-rev-cockpit-head span {
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-size:10px;
  font-weight:700;
}

.kc-rev-cockpit-head span i {
  color:var(--accent-color);
}

.kc-rev-cockpit-head em {
  padding:5px 7px;
  border-radius:999px;
  background:rgba(14,230,176,.07);
  color:var(--accent-color);
  font-size:7px;
  font-style:normal;
  font-weight:700;
}

.kc-rev-cockpit-status {
  display:grid;
  grid-template-columns:47px minmax(0,1fr) auto;
  gap:11px;
  align-items:center;
  margin-top:14px;
  padding:13px;
  border:1px solid rgba(255,193,7,.18);
  border-radius:14px;
  background:rgba(255,193,7,.045);
}

.kc-rev-cockpit-status > i {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:47px;
  height:47px;
  border-radius:14px;
  background:rgba(255,193,7,.09);
  color:#ffd45b;
  font-size:19px;
}

.kc-rev-cockpit-status strong,
.kc-rev-cockpit-status span {
  display:block;
}

.kc-rev-cockpit-status strong {
  font-size:10px;
}

.kc-rev-cockpit-status span {
  margin-top:2px;
  color:rgba(255,255,255,.42);
  font-size:7.5px;
}

.kc-rev-cockpit-status button {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 9px;
  border:0;
  border-radius:999px;
  background:rgba(255,193,7,.09);
  color:#ffd45b;
  font-size:7px;
  font-weight:700;
}

.kc-rev-cockpit-neutral {
  display:flex;
  align-items:flex-start;
  gap:8px;
  margin-top:9px;
  padding:9px;
  border-radius:11px;
  background:rgba(255,255,255,.03);
  color:rgba(255,255,255,.39);
  font-size:7px;
  line-height:1.5;
}

.kc-rev-google-section {
  background:color-mix(in srgb, var(--surface-color), transparent 55%);
}

.kc-rev-channel-card {
  height:100%;
  padding:27px;
  border:1px solid var(--kc-card-border);
  border-radius:22px;
  background:color-mix(in srgb, var(--surface-color), transparent 3%);
  box-shadow:0 14px 36px rgba(0,0,0,.08);
}

.kc-rev-channel-card.is-internal {
  border-color:color-mix(in srgb,var(--accent-color),transparent 75%);
}

.kc-rev-channel-card.is-google {
  border-color:color-mix(in srgb,#4285f4,transparent 78%);
}

.kc-rev-channel-icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:52px;
  height:52px;
  margin-bottom:15px;
  border-radius:16px;
  background:var(--kc-accent-soft);
  color:var(--accent-color);
  font-size:21px;
}

.kc-rev-channel-card.is-google .kc-rev-channel-icon {
  background:rgba(66,133,244,.08);
  color:#4285f4;
}

.kc-rev-channel-card > span {
  color:color-mix(in srgb,var(--default-color),transparent 42%);
  font-size:9px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.kc-rev-channel-card h3 {
  margin:7px 0 9px;
  font-size:20px;
}

.kc-rev-channel-card p {
  margin:0;
  color:color-mix(in srgb,var(--default-color),transparent 20%);
  font-size:12px;
  line-height:1.62;
}

.kc-rev-channel-card > div:last-child {
  display:flex;
  align-items:flex-start;
  gap:7px;
  margin-top:15px;
  color:color-mix(in srgb,var(--default-color),transparent 17%);
  font-size:10px;
  font-weight:600;
}

.kc-rev-channel-card > div:last-child i {
  color:var(--accent-color);
}

.kc-rev-settings-window {
  padding:18px;
}

.kc-rev-settings-head {
  display:grid;
  grid-template-columns:43px minmax(0,1fr);
  gap:10px;
  align-items:center;
  padding-bottom:13px;
  border-bottom:1px solid rgba(255,255,255,.07);
}

.kc-rev-settings-head > i {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:43px;
  height:43px;
  border-radius:13px;
  background:rgba(14,230,176,.08);
  color:var(--accent-color);
}

.kc-rev-settings-head strong,
.kc-rev-settings-head span {
  display:block;
}

.kc-rev-settings-head strong {
  font-size:10px;
}

.kc-rev-settings-head span {
  margin-top:2px;
  color:rgba(255,255,255,.36);
  font-size:7px;
}

.kc-rev-settings-window > article {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  margin-top:9px;
  padding:11px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:12px;
  background:rgba(255,255,255,.03);
}

.kc-rev-settings-window article strong,
.kc-rev-settings-window article span {
  display:block;
}

.kc-rev-settings-window article strong {
  font-size:8.5px;
}

.kc-rev-settings-window article span {
  margin-top:2px;
  color:rgba(255,255,255,.39);
  font-size:7px;
}

.kc-rev-settings-window article > i {
  color:var(--accent-color);
  font-size:22px;
}

.kc-rev-settings-window article.is-input {
  grid-template-columns:minmax(0,1fr);
}

.kc-rev-settings-window article.is-input em {
  display:block;
  margin-top:7px;
  padding:8px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:9px;
  background:rgba(255,255,255,.035);
  color:rgba(255,255,255,.45);
  font-size:7px;
  font-style:normal;
}

.kc-rev-package-card .kc-feature-package-price span {
  display:none;
}

@media (max-width:1199.98px) {
  .kc-rev-admin-kpis {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (max-width:991.98px) {
  .kc-rev-kpi-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .kc-rev-admin-kpis,
  .kc-rev-filterbar {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:767.98px) {
  .kc-reviews-detail-page .section-title h2 {
    font-size:clamp(28px,8vw,37px);
  }

  .kc-rev-context-section h2,
  .kc-rev-detail-section h2,
  .kc-rev-cockpit-section h2,
  .kc-rev-settings-section h2 {
    font-size:clamp(29px,8vw,38px);
  }

  .kc-rev-insight-grid {
    grid-template-columns:1fr;
  }

  .kc-rev-context-flow {
    grid-template-columns:1fr;
  }

  .kc-rev-context-flow > i {
    transform:rotate(90deg);
  }
}

@media (max-width:520px) {
  .kc-rev-kpi-grid,
  .kc-rev-admin-kpis,
  .kc-rev-filterbar,
  .kc-rev-hero-insights {
    grid-template-columns:1fr;
  }

  .kc-rev-preview-card header,
  .kc-rev-detail-card header {
    grid-template-columns:43px minmax(0,1fr);
  }

  .kc-rev-preview-card time,
  .kc-rev-detail-card time {
    grid-column:2;
  }

  .kc-rev-cockpit-status {
    grid-template-columns:47px minmax(0,1fr);
  }

  .kc-rev-cockpit-status button {
    grid-column:2;
    justify-self:start;
  }
}


/* =========================================================
   Detailseite 8 V1 – Einrichtung & QR-Codes
   ========================================================= */

.kc-setup-qr-detail-page .section-title {
  max-width: 1000px;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

.kc-setup-qr-detail-page .section-title h2 {
  font-size: clamp(31px, 3.05vw, 42px);
  line-height: 1.12;
  letter-spacing: -.035em;
}

.kc-setup-hero-window,
.kc-setup-structure-window,
.kc-setup-qr-admin-window,
.kc-setup-pdf-window,
.kc-setup-security-window,
.kc-rev-settings-window {
  overflow: hidden;
  border: 1px solid var(--kc-card-border);
  border-radius: 28px;
  background: #09131c;
  color: #fff;
  box-shadow: 0 26px 68px rgba(0,0,0,.18);
}

.kc-setup-hero-window {
  padding: 19px;
  background:
    radial-gradient(circle at 92% 5%, rgba(14,230,176,.12), transparent 30%),
    radial-gradient(circle at 3% 98%, rgba(13,110,253,.10), transparent 31%),
    #09131c;
}

.kc-setup-window-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 13px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.kc-setup-window-head > div {
  display: flex;
  align-items: center;
  gap: 8px;
}

.kc-setup-window-head strong {
  font-size: 12px;
}

.kc-setup-window-head > div > i {
  color: var(--accent-color);
}

.kc-setup-window-head > span {
  color: rgba(255,255,255,.41);
  font-size: 8px;
}

.kc-setup-hero-stats {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 8px;
  margin-top: 13px;
}

.kc-setup-hero-stats article {
  padding: 10px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 13px;
  background: rgba(255,255,255,.035);
}

.kc-setup-hero-stats small,
.kc-setup-hero-stats strong,
.kc-setup-hero-stats span {
  display: block;
}

.kc-setup-hero-stats small {
  color: rgba(255,255,255,.36);
  font-size: 6.5px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.kc-setup-hero-stats strong {
  margin-top: 3px;
  font-size: 18px;
}

.kc-setup-hero-stats span {
  margin-top: 2px;
  color: rgba(255,255,255,.33);
  font-size: 6.5px;
}

.kc-setup-hero-body {
  display: grid;
  grid-template-columns: minmax(0,.9fr) minmax(150px,1.1fr);
  gap: 10px;
  margin-top: 10px;
}

.kc-setup-structure-preview {
  padding: 11px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 14px;
  background: rgba(255,255,255,.03);
}

.kc-setup-structure-title {
  display: flex;
  align-items: center;
  gap: 6px;
  color: rgba(255,255,255,.66);
  font-size: 8px;
  font-weight: 700;
}

.kc-setup-structure-title i {
  color: var(--accent-color);
}

.kc-setup-table-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

.kc-setup-table-pills span {
  padding: 6px 7px;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  color: rgba(255,255,255,.48);
  font-size: 7px;
}

.kc-setup-qr-preview {
  display: flex;
  min-height: 232px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 12px;
  border: 1px solid rgba(14,230,176,.13);
  border-radius: 14px;
  background: #fff;
  color: #111827;
  text-align: center;
}

.kc-setup-logo-demo {
  color: #4b5563;
  font-size: 6.5px;
  line-height: 1.15;
  letter-spacing: .08em;
}

.kc-setup-logo-demo strong {
  color: #198754;
  font-size: 8px;
}

.kc-setup-table-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  margin-top: 6px;
  border: 2px solid #198754;
  border-radius: 50%;
  color: #198754;
  font-size: 15px;
  font-weight: 900;
}

.kc-setup-qr-square {
  position: relative;
  width: 68px;
  height: 68px;
  margin-top: 7px;
  padding: 5px;
  background: #fff;
  border: 2px solid #111827;
}

.kc-setup-qr-pattern {
  display: grid;
  grid-template-columns: repeat(5,1fr);
  gap: 2px;
  width: 100%;
  height: 100%;
}

.kc-setup-qr-pattern span {
  background: #111827;
}

.kc-setup-qr-pattern span:nth-child(2n) {
  background: transparent;
}

.kc-setup-qr-pattern span:nth-child(3n+1) {
  background: #111827;
}

.kc-setup-qr-square em {
  position: absolute;
  left: 50%;
  top: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 23px;
  height: 23px;
  transform: translate(-50%,-50%);
  border: 2px solid #fff;
  border-radius: 50%;
  background: #fff;
  color: #188bb5;
  font-size: 7px;
  font-style: normal;
  font-weight: 900;
  box-shadow: 0 0 0 1px #4b5563;
}

.kc-setup-qr-preview > strong {
  margin-top: 7px;
  font-size: 8.5px;
}

.kc-setup-qr-preview > span {
  margin-top: 2px;
  color: #6b7280;
  font-size: 6.8px;
}

.kc-setup-qr-preview > small {
  margin-top: 7px;
  color: #6b7280;
  font-size: 6px;
}

.kc-setup-hero-actions-demo {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}

.kc-setup-hero-actions-demo span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.45);
  font-size: 7px;
}

.kc-setup-hero-actions-demo span.is-primary {
  background: rgba(14,230,176,.08);
  color: var(--accent-color);
}

.kc-setup-structure-section,
.kc-setup-formats-section,
.kc-setup-special-qr-section,
.kc-setup-flow-section,
.kc-setup-package-section {
  background: color-mix(in srgb, var(--surface-color), transparent 55%);
}

.kc-setup-structure-window,
.kc-setup-qr-admin-window,
.kc-setup-pdf-window,
.kc-setup-security-window {
  padding: 18px;
}

.kc-setup-structure-kpis {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 13px;
}

.kc-setup-structure-kpis span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.045);
  color: rgba(255,255,255,.43);
  font-size: 7px;
}

.kc-setup-structure-kpis strong {
  color: var(--accent-color);
}

.kc-setup-structure-grid {
  display: grid;
  grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr);
  gap: 10px;
  margin-top: 11px;
}

.kc-setup-stations-panel,
.kc-setup-table-panel {
  padding: 11px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 14px;
  background: rgba(255,255,255,.03);
}

.kc-setup-stations-panel header,
.kc-setup-table-panel header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

.kc-setup-stations-panel header strong,
.kc-setup-table-panel header strong {
  font-size: 8px;
}

.kc-setup-stations-panel header button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  border: 0;
  border-radius: 8px;
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.43);
}

.kc-setup-table-panel header span {
  color: rgba(255,255,255,.34);
  font-size: 6.5px;
}

.kc-setup-add-row {
  display: grid;
  grid-template-columns: 23px minmax(0,1fr) auto;
  gap: 6px;
  align-items: center;
  margin-top: 9px;
  padding: 7px;
  border-radius: 9px;
  background: rgba(255,255,255,.035);
  color: rgba(255,255,255,.40);
  font-size: 6.8px;
}

.kc-setup-add-row i {
  color: var(--accent-color);
}

.kc-setup-add-row button,
.kc-setup-create-btn {
  border: 0;
  border-radius: 8px;
  background: rgba(14,230,176,.10);
  color: var(--accent-color);
  font-size: 6.5px;
  font-weight: 700;
}

.kc-setup-add-row button {
  padding: 5px 7px;
}

.kc-setup-stations-panel > article {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto auto;
  gap: 7px;
  align-items: center;
  padding: 8px 3px;
  border-bottom: 1px solid rgba(255,255,255,.045);
}

.kc-setup-stations-panel > article:last-child {
  border-bottom: 0;
}

.kc-setup-stations-panel > article strong {
  font-size: 7.5px;
}

.kc-setup-stations-panel > article span,
.kc-setup-stations-panel > article em {
  color: rgba(255,255,255,.36);
  font-size: 6.5px;
  font-style: normal;
}

.kc-setup-table-panel label {
  display: block;
  margin: 8px 0 4px;
  color: rgba(255,255,255,.38);
  font-size: 6.5px;
  font-weight: 700;
}

.kc-setup-field {
  display: grid;
  grid-template-columns: 20px minmax(0,1fr) auto;
  gap: 6px;
  align-items: center;
  padding: 7px;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 9px;
  background: rgba(255,255,255,.035);
  color: rgba(255,255,255,.61);
  font-size: 7px;
}

.kc-setup-field i {
  color: rgba(255,255,255,.36);
}

.kc-setup-create-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 100%;
  margin-top: 10px;
  padding: 8px;
}

.kc-setup-table-list-preview {
  display: grid;
  gap: 6px;
  margin-top: 10px;
}

.kc-setup-table-list-preview > div {
  display: grid;
  grid-template-columns: minmax(80px,.6fr) minmax(70px,.8fr) minmax(60px,.6fr) minmax(90px,1fr);
  gap: 8px;
  align-items: center;
  padding: 8px 9px;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 10px;
  background: rgba(255,255,255,.025);
}

.kc-setup-table-list-preview strong {
  font-size: 7.5px;
}

.kc-setup-table-list-preview span,
.kc-setup-table-list-preview em,
.kc-setup-table-list-preview small {
  color: rgba(255,255,255,.35);
  font-size: 6.5px;
  font-style: normal;
}

.kc-setup-structure-section h2,
.kc-setup-formats-section h2,
.kc-setup-security-section h2 {
  margin: 12px 0 16px;
  font-size: clamp(32px,3.55vw,46px);
  line-height: 1.13;
  letter-spacing: -.04em;
}

.kc-setup-feature-points,
.kc-setup-security-points {
  display: grid;
  gap: 10px;
  margin-top: 23px;
}

.kc-setup-feature-points article,
.kc-setup-security-points article {
  display: grid;
  grid-template-columns: 43px minmax(0,1fr);
  gap: 11px;
  align-items: start;
  padding: 13px;
  border: 1px solid var(--kc-card-border);
  border-radius: 16px;
  background: color-mix(in srgb,var(--surface-color),transparent 3%);
}

.kc-setup-feature-points article > i,
.kc-setup-security-points article > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 43px;
  height: 43px;
  border-radius: 14px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 18px;
}

.kc-setup-feature-points h3,
.kc-setup-security-points h3 {
  margin: 1px 0 4px;
  font-size: 15px;
}

.kc-setup-feature-points p,
.kc-setup-security-points p {
  margin: 0;
  color: color-mix(in srgb,var(--default-color),transparent 20%);
  font-size: 11px;
  line-height: 1.55;
}

.kc-setup-qr-admin-window {
  background:
    radial-gradient(circle at 91% 5%, rgba(14,230,176,.09), transparent 27%),
    #09131c;
}

.kc-setup-qr-admin-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 13px;
}

.kc-setup-qr-admin-head > div:first-child {
  display: grid;
  grid-template-columns: 28px auto;
  gap: 2px 8px;
  align-items: center;
}

.kc-setup-qr-admin-head > div:first-child > i {
  grid-row: 1 / span 2;
  color: var(--accent-color);
  font-size: 18px;
}

.kc-setup-qr-admin-head strong {
  font-size: 10px;
}

.kc-setup-qr-admin-head > div:first-child span {
  color: rgba(255,255,255,.36);
  font-size: 7px;
}

.kc-setup-qr-stats {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 5px;
}

.kc-setup-qr-stats span {
  padding: 5px 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.045);
  color: rgba(255,255,255,.38);
  font-size: 6.5px;
}

.kc-setup-qr-stats strong {
  color: rgba(255,255,255,.76);
}

.kc-setup-filter-row {
  display: grid;
  grid-template-columns: minmax(150px,1.6fr) repeat(3,minmax(90px,.8fr)) auto;
  gap: 6px;
  margin-top: 13px;
}

.kc-setup-filter-row > span,
.kc-setup-filter-row button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  min-height: 34px;
  padding: 7px 8px;
  border: 1px solid rgba(255,255,255,.065);
  border-radius: 9px;
  background: rgba(255,255,255,.03);
  color: rgba(255,255,255,.41);
  font-size: 6.8px;
}

.kc-setup-filter-row > span.is-search {
  justify-content: flex-start;
}

.kc-setup-filter-row button {
  border: 1px solid rgba(255,255,255,.065);
}

.kc-setup-action-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
}

.kc-setup-action-row button,
.kc-setup-action-row > span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 31px;
  padding: 6px 8px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 9px;
  background: rgba(255,255,255,.035);
  color: rgba(255,255,255,.47);
  font-size: 6.8px;
}

.kc-setup-action-row button.is-green {
  border-color: rgba(25,135,84,.26);
  color: #79d39e;
}

.kc-setup-action-row button.is-red {
  border-color: rgba(220,53,69,.25);
  color: #ff7e8b;
}

.kc-setup-action-row button.is-yellow {
  border-color: rgba(255,193,7,.23);
  color: #ffd45b;
}

.kc-setup-action-row button.is-pdf {
  margin-left: auto;
  border-color: rgba(220,53,69,.24);
  background: rgba(220,53,69,.08);
  color: #ff8995;
}

.kc-setup-action-row > span {
  background: rgba(14,230,176,.055);
  color: var(--accent-color);
}

.kc-setup-station-group {
  margin-top: 11px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.065);
  border-radius: 13px;
  background: rgba(255,255,255,.025);
}

.kc-setup-station-group header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
}

.kc-setup-station-group header > div {
  display: flex;
  align-items: center;
  gap: 6px;
}

.kc-setup-station-group header i {
  color: var(--accent-color);
}

.kc-setup-station-group header strong {
  font-size: 8px;
}

.kc-setup-station-group header span {
  padding: 4px 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.37);
  font-size: 6px;
}

.kc-setup-station-group header button {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 7px;
  border: 1px solid rgba(25,135,84,.24);
  border-radius: 8px;
  background: rgba(25,135,84,.06);
  color: #79d39e;
  font-size: 6.5px;
}

.kc-setup-qr-table-grid {
  display: grid;
  grid-template-columns: repeat(6,minmax(0,1fr));
  gap: 6px;
  margin-top: 9px;
}

.kc-setup-qr-table-grid article {
  position: relative;
  min-width: 0;
  padding: 9px 7px;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 10px;
  background: rgba(255,255,255,.025);
}

.kc-setup-qr-table-grid article.selected {
  border-color: rgba(25,135,84,.25);
  background: rgba(25,135,84,.06);
}

.kc-setup-qr-table-grid article.is-disabled {
  opacity: .46;
}

.kc-setup-qr-table-grid article > i {
  display: block;
  margin-bottom: 6px;
  color: rgba(255,255,255,.30);
  font-size: 10px;
}

.kc-setup-qr-table-grid article.selected > i {
  color: #79d39e;
}

.kc-setup-qr-table-grid strong,
.kc-setup-qr-table-grid small {
  display: block;
}

.kc-setup-qr-table-grid strong {
  font-size: 7px;
}

.kc-setup-qr-table-grid small {
  margin-top: 3px;
  overflow: hidden;
  color: rgba(255,255,255,.30);
  font-family: ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size: 5.8px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kc-setup-admin-point {
  height: 100%;
  padding: 21px;
  border: 1px solid var(--kc-card-border);
  border-radius: 20px;
  background: color-mix(in srgb,var(--surface-color),transparent 3%);
}

.kc-setup-admin-point > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 47px;
  height: 47px;
  margin-bottom: 14px;
  border-radius: 15px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 19px;
}

.kc-setup-admin-point h3 {
  margin-bottom: 7px;
  font-size: 16px;
}

.kc-setup-admin-point p {
  margin: 0;
  color: color-mix(in srgb,var(--default-color),transparent 19%);
  font-size: 11.5px;
  line-height: 1.6;
}

.kc-setup-format-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 12px;
}

.kc-setup-format-grid article {
  display: grid;
  grid-template-columns: 80px minmax(0,1fr);
  gap: 15px;
  align-items: center;
  padding: 17px;
  border: 1px solid var(--kc-card-border);
  border-radius: 18px;
  background: color-mix(in srgb,var(--surface-color),transparent 3%);
  box-shadow: 0 12px 30px rgba(0,0,0,.06);
}

.kc-setup-format-paper {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  border: 2px solid color-mix(in srgb,var(--accent-color),transparent 58%);
  border-radius: 5px;
  background: #fff;
  color: var(--accent-color);
  box-shadow: 0 5px 14px rgba(0,0,0,.08);
}

.kc-setup-format-paper.portrait {
  width: 48px;
  height: 68px;
}

.kc-setup-format-paper.landscape {
  width: 68px;
  height: 48px;
}

.kc-setup-format-paper.is-a6.portrait {
  width: 43px;
  height: 60px;
}

.kc-setup-format-paper.is-a6.landscape {
  width: 60px;
  height: 43px;
}

.kc-setup-format-paper.is-a7.portrait {
  width: 36px;
  height: 50px;
}

.kc-setup-format-paper.is-a7.landscape {
  width: 50px;
  height: 36px;
}

.kc-setup-format-paper i {
  font-size: 19px;
}

.kc-setup-format-grid small,
.kc-setup-format-grid strong,
.kc-setup-format-grid span {
  display: block;
}

.kc-setup-format-grid small {
  color: var(--accent-color);
  font-size: 9px;
  font-weight: 700;
}

.kc-setup-format-grid strong {
  margin-top: 3px;
  font-size: 15px;
}

.kc-setup-format-grid span {
  margin-top: 3px;
  color: color-mix(in srgb,var(--default-color),transparent 38%);
  font-size: 9px;
}

.kc-setup-pdf-window {
  background:
    radial-gradient(circle at 92% 4%, rgba(220,53,69,.08), transparent 30%),
    #09131c;
}

.kc-setup-pdf-config {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 8px;
  margin-top: 13px;
}

.kc-setup-pdf-config > div {
  padding: 9px;
  border: 1px solid rgba(255,255,255,.065);
  border-radius: 11px;
  background: rgba(255,255,255,.03);
}

.kc-setup-pdf-config label,
.kc-setup-pdf-config span {
  display: block;
}

.kc-setup-pdf-config label {
  color: rgba(255,255,255,.33);
  font-size: 6.5px;
}

.kc-setup-pdf-config span {
  margin-top: 3px;
  color: rgba(255,255,255,.67);
  font-size: 8px;
}

.kc-setup-pdf-preview {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 8px;
  margin-top: 10px;
}

.kc-setup-pdf-preview article {
  display: flex;
  min-height: 214px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 9px;
  border-radius: 12px;
  background: #fff;
  color: #111827;
  text-align: center;
}

.kc-setup-pdf-table {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  margin-top: 6px;
  border: 2px solid #198754;
  border-radius: 50%;
  color: #198754;
  font-size: 12px;
  font-weight: 900;
}

.kc-setup-pdf-preview article > strong {
  margin-top: 6px;
  font-size: 7.5px;
}

.kc-setup-pdf-preview article > small {
  color: #6b7280;
  font-size: 6px;
}

.kc-setup-mini-qr {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 55px;
  height: 55px;
  margin-top: 6px;
  color: #111827;
  font-size: 49px;
  line-height: 1;
}

.kc-setup-mini-qr em {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 19px;
  height: 19px;
  border: 1px solid #4b5563;
  border-radius: 50%;
  background: #fff;
  color: #188bb5;
  font-size: 6px;
  font-style: normal;
  font-weight: 900;
}

.kc-setup-pdf-preview footer {
  margin-top: 5px;
  color: #6b7280;
  font-size: 5.6px;
}

.kc-setup-pdf-preview footer b {
  color: #188bb5;
}

.kc-setup-pdf-preview footer small {
  color: #6b7280;
  font-size: 4.7px;
}

.kc-setup-pdf-actions {
  display: flex;
  justify-content: flex-end;
  gap: 7px;
  margin-top: 10px;
}

.kc-setup-pdf-actions button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 9px;
  border: 1px solid rgba(25,135,84,.20);
  border-radius: 9px;
  background: rgba(25,135,84,.06);
  color: #79d39e;
  font-size: 7px;
  font-weight: 700;
}

.kc-setup-pdf-actions button.is-download {
  border-color: rgba(13,110,253,.20);
  background: rgba(13,110,253,.07);
  color: #80afff;
}

.kc-setup-special-card {
  height: 100%;
  padding: 27px;
  border: 1px solid color-mix(in srgb,var(--accent-color),transparent 76%);
  border-radius: 23px;
  background: color-mix(in srgb,var(--surface-color),transparent 3%);
  box-shadow: 0 15px 39px rgba(0,0,0,.08);
}

.kc-setup-special-card.is-pro {
  border-color: color-mix(in srgb,#0d6efd,transparent 78%);
}

.kc-setup-special-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.kc-setup-special-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 16px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 21px;
}

.kc-setup-special-card.is-pro .kc-setup-special-icon {
  background: rgba(13,110,253,.08);
  color: #70aaff;
}

.kc-setup-package-chip,
.kc-setup-package-label {
  display: inline-flex;
  padding: 7px 9px;
  border-radius: 999px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 8px;
  font-weight: 800;
}

.kc-setup-special-card.is-pro .kc-setup-package-chip {
  background: rgba(13,110,253,.08);
  color: #70aaff;
}

.kc-setup-special-card h3 {
  margin: 18px 0 9px;
  font-size: 21px;
}

.kc-setup-special-card > p {
  margin: 0;
  color: color-mix(in srgb,var(--default-color),transparent 19%);
  font-size: 12px;
  line-height: 1.62;
}

.kc-setup-special-visual {
  display: grid;
  grid-template-columns: 62px minmax(0,1fr);
  gap: 12px;
  align-items: center;
  margin-top: 18px;
  padding: 13px;
  border: 1px solid var(--kc-card-border);
  border-radius: 15px;
  background: color-mix(in srgb,var(--surface-color),transparent 2%);
}

.kc-setup-special-qr {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 62px;
  height: 62px;
  color: var(--heading-color);
  font-size: 57px;
}

.kc-setup-special-qr em {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 21px;
  height: 21px;
  border: 1px solid color-mix(in srgb,var(--default-color),transparent 50%);
  border-radius: 50%;
  background: var(--surface-color);
  color: #188bb5;
  font-size: 6px;
  font-style: normal;
  font-weight: 900;
}

.kc-setup-special-visual small,
.kc-setup-special-visual strong,
.kc-setup-special-visual span {
  display: block;
}

.kc-setup-special-visual small {
  color: var(--accent-color);
  font-size: 8px;
  font-weight: 700;
}

.kc-setup-special-visual strong {
  margin-top: 3px;
  font-size: 12px;
}

.kc-setup-special-visual span {
  margin-top: 3px;
  color: color-mix(in srgb,var(--default-color),transparent 38%);
  font-size: 8px;
}

.kc-setup-special-visual.is-points {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.kc-setup-special-visual.is-points span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 7px 9px;
  border-radius: 999px;
  background: color-mix(in srgb,var(--surface-color),transparent 3%);
  color: color-mix(in srgb,var(--default-color),transparent 18%);
  font-size: 9px;
  font-weight: 600;
}

.kc-setup-special-visual.is-points i {
  color: #70aaff;
}

.kc-setup-special-card ul {
  display: grid;
  gap: 8px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.kc-setup-special-card li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: color-mix(in srgb,var(--default-color),transparent 18%);
  font-size: 11px;
}

.kc-setup-special-card li > i {
  flex: 0 0 auto;
  margin-top: 2px;
  color: var(--accent-color);
}

.kc-setup-special-card.is-pro li > i {
  color: #70aaff;
}

.kc-setup-security-window {
  background:
    radial-gradient(circle at 91% 5%, rgba(255,193,7,.10), transparent 29%),
    #09131c;
}

.kc-setup-security-alert {
  display: grid;
  grid-template-columns: 52px minmax(0,1fr);
  gap: 11px;
  align-items: center;
  padding-bottom: 13px;
  border-bottom: 1px solid rgba(255,255,255,.07);
}

.kc-setup-security-alert > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 16px;
  background: rgba(255,193,7,.08);
  color: #ffd45b;
  font-size: 21px;
}

.kc-setup-security-alert small,
.kc-setup-security-alert strong,
.kc-setup-security-alert span {
  display: block;
}

.kc-setup-security-alert small {
  color: rgba(255,255,255,.35);
  font-size: 7px;
  text-transform: uppercase;
}

.kc-setup-security-alert strong {
  margin-top: 2px;
  font-size: 12px;
}

.kc-setup-security-alert span {
  margin-top: 3px;
  color: rgba(255,255,255,.42);
  font-size: 7.5px;
}

.kc-setup-security-table {
  display: grid;
  gap: 6px;
  margin-top: 11px;
}

.kc-setup-security-table > div {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px 9px;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 10px;
  background: rgba(255,255,255,.025);
}

.kc-setup-security-table strong {
  font-size: 7.5px;
}

.kc-setup-security-table span {
  color: rgba(255,255,255,.35);
  font-size: 6.8px;
}

.kc-setup-security-table em {
  color: #79d39e;
  font-size: 6.8px;
  font-style: normal;
  font-weight: 700;
}

.kc-setup-security-warning {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  margin-top: 11px;
  padding: 9px;
  border-radius: 10px;
  background: rgba(255,193,7,.05);
  color: rgba(255,255,255,.46);
  font-size: 7px;
  line-height: 1.5;
}

.kc-setup-security-warning i {
  color: #ffd45b;
}

.kc-setup-security-actions {
  display: flex;
  justify-content: flex-end;
  gap: 7px;
  margin-top: 11px;
}

.kc-setup-security-actions button {
  padding: 7px 9px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 9px;
  background: rgba(255,255,255,.035);
  color: rgba(255,255,255,.48);
  font-size: 7px;
}

.kc-setup-security-actions button.is-confirm {
  border-color: rgba(255,193,7,.17);
  background: rgba(255,193,7,.07);
  color: #ffd45b;
}

.kc-setup-flow-line {
  display: grid;
  grid-template-columns: minmax(0,1fr) 30px minmax(0,1fr) 30px minmax(0,1fr) 30px minmax(0,1fr) 30px minmax(0,1fr);
  gap: 5px;
  align-items: center;
}

.kc-setup-flow-line > i {
  color: color-mix(in srgb,var(--default-color),transparent 65%);
  text-align: center;
}

.kc-setup-flow-line article {
  position: relative;
  height: 100%;
  padding: 21px 16px;
  border: 1px solid var(--kc-card-border);
  border-radius: 19px;
  background: color-mix(in srgb,var(--surface-color),transparent 3%);
  text-align: center;
}

.kc-setup-flow-line article > span {
  position: absolute;
  top: 9px;
  right: 10px;
  color: color-mix(in srgb,var(--default-color),transparent 67%);
  font-size: 8px;
  font-weight: 800;
}

.kc-setup-flow-line article > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 47px;
  height: 47px;
  margin-bottom: 13px;
  border-radius: 15px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 19px;
}

.kc-setup-flow-line h3 {
  margin-bottom: 7px;
  font-size: 15px;
}

.kc-setup-flow-line p {
  margin: 0;
  color: color-mix(in srgb,var(--default-color),transparent 20%);
  font-size: 10px;
  line-height: 1.58;
}

.kc-setup-package-card {
  height: 100%;
  padding: 29px;
  border: 1px solid var(--kc-card-border);
  border-radius: 24px;
  background: color-mix(in srgb,var(--surface-color),transparent 3%);
  box-shadow: 0 16px 42px rgba(0,0,0,.09);
}

.kc-setup-package-card.is-start {
  border-color: color-mix(in srgb,var(--accent-color),transparent 68%);
  box-shadow: 0 18px 48px rgba(14,230,176,.08);
}

.kc-setup-package-card.is-pro {
  border-color: color-mix(in srgb,#0d6efd,transparent 76%);
}

.kc-setup-package-card.is-pro .kc-setup-package-label {
  background: rgba(13,110,253,.08);
  color: #70aaff;
}

.kc-setup-package-price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-top: 18px;
}

.kc-setup-package-price strong {
  font-size: 38px;
  line-height: 1;
  letter-spacing: -.05em;
}

.kc-setup-package-price span {
  color: color-mix(in srgb,var(--default-color),transparent 40%);
  font-size: 10px;
}

.kc-setup-package-card h3 {
  margin: 17px 0;
  font-size: 21px;
}

.kc-setup-package-card ul {
  display: grid;
  gap: 9px;
  margin: 0 0 22px;
  padding: 0;
  list-style: none;
}

.kc-setup-package-card li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: color-mix(in srgb,var(--default-color),transparent 17%);
  font-size: 12px;
}

.kc-setup-package-card li > i {
  flex: 0 0 auto;
  margin-top: 2px;
  color: var(--accent-color);
}

.kc-setup-package-card.is-pro li > i {
  color: #70aaff;
}

.kc-setup-package-actions {
  display: flex;
  align-items: center;
}

.kc-setup-package-card .kc-setup-package-actions .btn-accent {
  width: auto !important;
  padding: 11px 18px;
  border-color: var(--accent-color) !important;
  background: var(--accent-color) !important;
  color: #061711 !important;
  font-weight: 700;
  box-shadow: 0 10px 26px rgba(14,230,176,.16);
}

.kc-setup-package-note {
  display: grid;
  grid-template-columns: 44px minmax(0,1fr);
  gap: 11px;
  align-items: center;
  width: 83.333333%;
  margin: 22px auto 0;
  padding: 15px 17px;
  border: 1px solid var(--kc-card-border);
  border-radius: 16px;
  background: color-mix(in srgb,var(--surface-color),transparent 3%);
}

.kc-setup-package-note > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
}

.kc-setup-package-note p {
  margin: 0;
  color: color-mix(in srgb,var(--default-color),transparent 20%);
  font-size: 11px;
  line-height: 1.58;
}

@media (max-width: 1199.98px) {
  .kc-setup-qr-table-grid {
    grid-template-columns: repeat(4,minmax(0,1fr));
  }

  .kc-setup-flow-line {
    grid-template-columns: repeat(5,minmax(0,1fr));
    gap: 10px;
  }

  .kc-setup-flow-line > i {
    display: none;
  }
}

@media (max-width: 991.98px) {
  .kc-setup-hero-stats {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .kc-setup-structure-grid {
    grid-template-columns: 1fr;
  }

  .kc-setup-filter-row {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .kc-setup-filter-row > span.is-search {
    grid-column: 1 / -1;
  }

  .kc-setup-qr-admin-head {
    flex-direction: column;
  }

  .kc-setup-qr-stats {
    justify-content: flex-start;
  }

  .kc-setup-format-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .kc-setup-flow-line {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .kc-setup-package-note {
    width: 100%;
  }
}

@media (max-width: 767.98px) {
  .kc-setup-qr-detail-page .section-title h2 {
    font-size: clamp(28px,8vw,37px);
  }

  .kc-setup-structure-section h2,
  .kc-setup-formats-section h2,
  .kc-setup-security-section h2 {
    font-size: clamp(29px,8vw,38px);
  }

  .kc-setup-hero-body {
    grid-template-columns: 1fr;
  }

  .kc-setup-qr-table-grid {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }

  .kc-setup-pdf-preview {
    grid-template-columns: 1fr 1fr;
  }

  .kc-setup-flow-line {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 520px) {
  .kc-setup-window-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .kc-setup-hero-stats,
  .kc-setup-filter-row,
  .kc-setup-format-grid,
  .kc-setup-pdf-config,
  .kc-setup-pdf-preview {
    grid-template-columns: 1fr;
  }

  .kc-setup-table-list-preview > div {
    grid-template-columns: 1fr 1fr;
  }

  .kc-setup-qr-table-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .kc-setup-action-row button.is-pdf {
    margin-left: 0;
  }

  .kc-setup-special-visual {
    grid-template-columns: 1fr;
  }

  .kc-setup-security-table > div {
    grid-template-columns: 1fr 1fr;
  }

  .kc-setup-security-table em {
    grid-column: 2;
  }

  .kc-setup-package-note {
    grid-template-columns: 1fr;
  }
}


/* =========================================================
   Funktionsreihenfolge V1 – Paket-Hinweise auf Landingpage
   ========================================================= */

.kc-modules-section .kc-module-package {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  margin-bottom: 14px;
  padding: 5px 9px;
  border: 1px solid color-mix(in srgb, var(--accent-color), transparent 72%);
  border-radius: 999px;
  background: var(--kc-accent-soft);
  color: var(--accent-color);
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .02em;
}

.kc-modules-section .kc-module-package + i {
  margin-top: 0;
}

@media (max-width: 575.98px) {
  .kc-modules-section .kc-module-package {
    margin-bottom: 13px;
    font-size: 10.5px;
  }
}


/* =========================================================
   Detailseiten Logo Safety Override V2
   Verhindert 42/36px-Template-Limits und halbtransparente Hintergründe.
   ========================================================= */
.kellnercall-page.kc-feature-detail-page .header .logo.kc-brand-logo-link-header,
.kellnercall-page.kc-module-detail-page .header .logo.kc-brand-logo-link-header {
  width: 280px !important;
  min-width: 280px !important;
  height: 60px !important;
  min-height: 60px !important;
  background: transparent !important;
}

.kellnercall-page.kc-feature-detail-page .header .logo.kc-brand-logo-link-header img.kc-brand-logo-header,
.kellnercall-page.kc-module-detail-page .header .logo.kc-brand-logo-link-header img.kc-brand-logo-header {
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.kellnercall-page.kc-feature-detail-page .kc-footer .logo.kc-brand-logo-link-footer,
.kellnercall-page.kc-module-detail-page .kc-footer .logo.kc-brand-logo-link-footer {
  width: 305px !important;
  min-width: 305px !important;
  height: 82px !important;
  min-height: 82px !important;
  background: transparent !important;
}

.kellnercall-page.kc-feature-detail-page .kc-footer .logo.kc-brand-logo-link-footer img.kc-brand-logo-footer,
.kellnercall-page.kc-module-detail-page .kc-footer .logo.kc-brand-logo-link-footer img.kc-brand-logo-footer {
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

@media (max-width: 1199.98px) {
  .kellnercall-page.kc-feature-detail-page .header .logo.kc-brand-logo-link-header,
  .kellnercall-page.kc-module-detail-page .header .logo.kc-brand-logo-link-header {
    width: 235px !important;
    min-width: 235px !important;
    height: 56px !important;
    min-height: 56px !important;
  }
}

@media (max-width: 767.98px) {
  .kellnercall-page.kc-feature-detail-page .header .logo.kc-brand-logo-link-header,
  .kellnercall-page.kc-module-detail-page .header .logo.kc-brand-logo-link-header {
    width: 190px !important;
    min-width: 190px !important;
    height: 50px !important;
    min-height: 50px !important;
  }

  .kellnercall-page.kc-feature-detail-page .kc-footer .logo.kc-brand-logo-link-footer,
  .kellnercall-page.kc-module-detail-page .kc-footer .logo.kc-brand-logo-link-footer {
    width: 265px !important;
    min-width: 265px !important;
    height: 72px !important;
    min-height: 72px !important;
  }
}

@media (max-width: 420px) {
  .kellnercall-page.kc-feature-detail-page .header .logo.kc-brand-logo-link-header,
  .kellnercall-page.kc-module-detail-page .header .logo.kc-brand-logo-link-header {
    width: 165px !important;
    min-width: 165px !important;
    height: 46px !important;
    min-height: 46px !important;
  }
}


/* =========================================================
   Staff Login V4 – stabiler Shared Header/Footer
   ========================================================= */

/* Oben: transparenter Header über demselben Grün/Schwarz-Hintergrund
   wie der Login-Bereich. Dadurch gibt es hinter der Pill-Navigation
   keinen separaten hellschwarzen Vollbreiten-Streifen mehr. */
.kellnercall-page.kc-login-page .header {
  flex-direction: row;
  align-items: center !important;
  padding-top: 12px !important;
  padding-bottom: 12px !important;
  background: transparent !important;
  box-shadow: none !important;
}

.kellnercall-page.kc-login-page .header > .header-container {
  width: calc(100% - 30px);
  min-height: 66px;
}

/* Sticky bleibt permanent aktiv, damit kein Content überlagert wird. */
.kellnercall-page.kc-login-page .kc-login-shared-header {
  position: sticky !important;
  top: 0;
  z-index: 1050;
}

/* Gescrollt: nur der ÄUSSERE Header wird zur vollen schwarzen Leiste.
   Der innere Container behält dieselbe horizontale Ausrichtung und Höhe.
   Dadurch gibt es weder seitliches Springen noch vertikales Wackeln. */
.kellnercall-page.kc-login-page.scrolled .header {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
  background: #060606 !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.24) !important;
}

.kellnercall-page.kc-login-page.scrolled .header > .header-container {
  width: calc(100% - 30px) !important;
  max-width: var(--bs-breakpoint-xl, 1320px);
  min-height: 66px;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Header-Logo bleibt exakt im bereits akzeptierten Navigationsformat. */
.kellnercall-page.kc-login-page .kc-brand-logo-link-header {
  width: 280px !important;
  min-width: 280px !important;
  height: 60px !important;
  min-height: 60px !important;
}

.kellnercall-page.kc-login-page .kc-brand-logo-header {
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  object-fit: cover;
  object-position: center;
  transform: scale(2.62);
  transform-origin: center center;
}

/* Footer-Struktur bleibt identisch zur Funktionsseite.
   Auf der Loginseite zeigen wir das Logo vollständig und kompakt,
   ohne künstliches 2.5x-Cropping. */
.kellnercall-page.kc-login-page .kc-footer .kc-brand-logo-link-footer {
  width: 330px !important;
  min-width: 330px !important;
  height: 88px !important;
  min-height: 88px !important;
  margin-bottom: 16px;
  overflow: visible;
}

.kellnercall-page.kc-login-page .kc-footer .kc-brand-logo-footer {
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  object-fit: contain !important;
  object-position: left center;
  transform: scale(2.00) !important;
  transform-origin: left center;
}

/* Das alte Footer-Template darf dem Bild keinen Hintergrund hinzufügen. */
.kellnercall-page.kc-login-page .kc-footer .footer-about .logo img {
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

@media (max-width: 1199.98px) {
  .kellnercall-page.kc-login-page .kc-brand-logo-link-header {
    width: 235px !important;
    min-width: 235px !important;
    height: 56px !important;
    min-height: 56px !important;
  }

  .kellnercall-page.kc-login-page .kc-brand-logo-header {
    transform: scale(2.55);
  }
}

@media (max-width: 767.98px) {
  .kc-login-page .login-shell {
    padding: 36px 12px 52px;
  }

  .kc-login-page .kc-login-main-logo-link {
    width: min(315px, 82vw);
    height: 84px;
  }

  .kc-login-page .kc-login-main-logo {
    transform: scale(2.00);
  }

  .kellnercall-page.kc-login-page .kc-brand-logo-link-header {
    width: 190px !important;
    min-width: 190px !important;
    height: 50px !important;
    min-height: 50px !important;
  }

  .kellnercall-page.kc-login-page .kc-brand-logo-header {
    transform: scale(2.45);
  }

  .kellnercall-page.kc-login-page .kc-footer .kc-brand-logo-link-footer {
    width: 285px !important;
    min-width: 285px !important;
    height: 78px !important;
    min-height: 78px !important;
  }

  .kellnercall-page.kc-login-page .kc-footer .kc-brand-logo-footer {
    transform: scale(2.00) !important;
  }
}

@media (max-width: 420px) {
  .kc-login-page .kc-login-main-logo-link {
    width: min(270px, 80vw);
    height: 74px;
  }

  .kc-login-page .kc-login-main-logo {
    transform: scale(2.00);
  }

  .kellnercall-page.kc-login-page .kc-brand-logo-link-header {
    width: 165px !important;
    min-width: 165px !important;
    height: 46px !important;
    min-height: 46px !important;
  }

  .kellnercall-page.kc-login-page .kc-brand-logo-header {
    transform: scale(2.35);
  }

  .kellnercall-page.kc-login-page .kc-footer .kc-brand-logo-link-footer {
    width: 250px !important;
    min-width: 250px !important;
    height: 70px !important;
    min-height: 70px !important;
  }

  .kellnercall-page.kc-login-page .kc-footer .kc-brand-logo-footer {
    transform: scale(2.00) !important;
  }
}


/* =========================================================
   Public Navigation Auth CTA – Desktop / Mobile V1
   ========================================================= */

/* Mobile-Auth-Eintrag ist auf Desktop unsichtbar. */
.kellnercall-page .navmenu .kc-mobile-auth-item {
  display: none;
}

@media (max-width: 1199.98px) {
  /* Auf Handy/Tablet verschwindet der separate CTA neben dem Hamburger. */
  .kellnercall-page .header .kc-desktop-auth-cta {
    display: none !important;
  }

  /* Dafür erscheint Login/Registrieren als normaler Menüpunkt im Hamburger-Menü. */
  .kellnercall-page .navmenu .kc-mobile-auth-item {
    display: list-item;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid color-mix(in srgb, var(--default-color), transparent 88%);
  }

  .kellnercall-page .navmenu .kc-mobile-auth-link,
  .kellnercall-page .navmenu .kc-mobile-auth-link:focus {
    color: var(--accent-color) !important;
    font-weight: 800;
  }

  .kellnercall-page .navmenu .kc-mobile-auth-link:hover,
  .kellnercall-page .navmenu .kc-mobile-auth-link:focus:hover {
    color: color-mix(in srgb, var(--accent-color), white 16%) !important;
  }
}

@media (min-width: 1200px) {
  .kellnercall-page .header .kc-desktop-auth-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}