
/*
 * AF Kameramann Designsystem 3.1.0
 * Nur visuelle Vereinheitlichung.
 * Keine Inhalte und keine Funktionen werden verändert.
 */

:root {
  --afds-font: Nunito, "Segoe UI", Arial, sans-serif;

  --afds-ink: #0b1521;
  --afds-night: #07121e;
  --afds-paper: #f4efe6;
  --afds-surface: #fffdf9;
  --afds-muted: #687381;
  --afds-line: rgba(11, 21, 33, .12);
  --afds-accent: #e85b66;
  --afds-white: #f8fafc;

  --afds-page-title: clamp(44px, 5.4vw, 74px);
  --afds-section-title: clamp(34px, 3.8vw, 50px);
  --afds-card-title: clamp(24px, 2.2vw, 31px);
  --afds-body: 17px;
  --afds-small: 14px;
  --afds-label: 12px;

  --afds-leading-tight: 1.04;
  --afds-leading-body: 1.66;

  --afds-space-1: 8px;
  --afds-space-2: 16px;
  --afds-space-3: 24px;
  --afds-space-4: 32px;
  --afds-space-5: 48px;
  --afds-space-6: 72px;
  --afds-space-7: 96px;

  --afds-radius: 20px;
  --afds-radius-small: 14px;
  --afds-shadow: 0 22px 58px rgba(20, 28, 37, .1);
  --afds-content: 1360px;
  --afds-reading: 68ch;
}

body.afkrs-site-chrome-enabled {
  color: var(--afds-ink);
  font-family: var(--afds-font);
  font-size: var(--afds-body);
  line-height: var(--afds-leading-body);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}

body.afkrs-site-chrome-enabled *,
body.afkrs-site-chrome-enabled *::before,
body.afkrs-site-chrome-enabled *::after {
  box-sizing: border-box;
}

body.afkrs-site-chrome-enabled :where(
  h1, h2, h3, h4,
  p, li, a, button, input, textarea, select
) {
  font-family: var(--afds-font);
}

body.afkrs-site-chrome-enabled :where(h1, h2, h3, h4) {
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
  text-wrap: balance;
}

body.afkrs-site-chrome-enabled :where(p, li) {
  overflow-wrap: break-word;
}

/* Navigation, klare Position und ruhiger Rhythmus */
.afkrs-site-header {
  min-height: 76px !important;
  border-bottom: 1px solid rgba(255, 255, 255, .08) !important;
  box-shadow: 0 12px 32px rgba(3, 9, 16, .12) !important;
}

.afkrs-site-header-inner {
  width: min(var(--afds-content), calc(100% - 40px)) !important;
  min-height: 76px !important;
}

.afkrs-site-brand-copy strong {
  font-size: 16px !important;
  line-height: 1.15 !important;
}

.afkrs-site-brand-copy small {
  font-size: 10px !important;
  line-height: 1.2 !important;
  letter-spacing: .12em !important;
}

.afkrs-site-nav {
  gap: 4px !important;
}

.afkrs-site-nav a {
  min-height: 44px !important;
  padding: 0 14px !important;
  border-radius: 12px !important;
  font-size: 14px !important;
  font-weight: 800 !important;
}

.afkrs-site-nav a.is-active {
  background: rgba(255, 255, 255, .07) !important;
}

.afkrs-menu-toggle {
  width: 50px !important;
  height: 50px !important;
  border-radius: 14px !important;
}

/* Einheitliche Kennzeichnungen */
body.afkrs-site-chrome-enabled :where(
  .afks-kicker,
  .afks-meta,
  .afks-backstage-eyebrow,
  .afkf-kicker,
  .afba-kicker,
  .afkrs-contact-kicker,
  .afkrs-legal-kicker,
  .afkrs-legal-section-number,
  .afgb5-kicker,
  .afeb2-kicker,
  .afeb2-heading > span,
  .afeb2-practice-mark span
) {
  font-size: var(--afds-label) !important;
  font-weight: 900 !important;
  line-height: 1.35 !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
}

/* Seitentitel */
body.afkrs-site-chrome-enabled :where(
  .afks-archive h1,
  .afks-single-hero-copy h1,
  .afks-single-modern .afks-single-hero h1,
  .afks-backstage-hero h1,
  .afkf-hero h1,
  #af-backstage-studio .afba-hero h1,
  .afkrs-contact-intro h1,
  .afkrs-legal-hero h1
) {
  max-width: 17ch !important;
  margin-top: var(--afds-space-2) !important;
  font-size: var(--afds-page-title) !important;
  font-weight: 900 !important;
  line-height: var(--afds-leading-tight) !important;
  letter-spacing: -.045em !important;
}

/* Abschnittstitel */
body.afkrs-site-chrome-enabled :where(
  .afks-section-head h2,
  .afks-single-section-head h2,
  .afks-prose h2,
  .afks-single-modern .afks-prose h2,
  .afks-archive-copy h2,
  .afkf-featured-head h2,
  .afkf-section-head h2,
  #af-backstage-studio .afba-intro h2,
  #af-backstage-studio .afba-results-head h2,
  .afkrs-contact-form-head h2,
  .afkrs-contact-routing-card h2,
  .afkrs-legal-section > h2,
  #af-ganzes-bild-v4 h2,
  #engagement-beratung h2
) {
  font-size: var(--afds-section-title) !important;
  font-weight: 900 !important;
  line-height: 1.08 !important;
  letter-spacing: -.04em !important;
}

/* Kartentitel und Dialogtitel */
body.afkrs-site-chrome-enabled :where(
  .afks-news-copy h3,
  .afks-backstage-overlay h3,
  .afks-reference-card h3,
  .afks-lightbox-panel strong,
  .afkf-card h3,
  .afkf-dialog-info h2,
  .afkf-detail-article > header h2,
  #af-backstage-studio .afba-card h3,
  #af-backstage-studio .afba-lightbox-copy h2,
  .afkrs-legal-contact-card h2,
  #engagement-beratung .afeb2-heading h3,
  #engagement-beratung .afeb2-practice-mark strong
) {
  font-size: var(--afds-card-title) !important;
  font-weight: 900 !important;
  line-height: 1.13 !important;
  letter-spacing: -.025em !important;
}

/* Fließtext, wenige Größen und gute Textbreite */
body.afkrs-site-chrome-enabled :where(
  .afks-section-head > p:last-child,
  .afks-single-hero-copy > p,
  .afks-single-modern .afks-single-hero-inner > p,
  .afks-backstage-summary,
  .afks-prose,
  .afks-prose p,
  .afkf-lead,
  .afkf-section-head p:last-child,
  .afkf-dialog-info h2 + p,
  #af-backstage-studio .afba-intro p,
  .afkrs-contact-lead,
  .afkrs-contact-copy,
  .afkrs-legal-lead,
  .afkrs-legal-intro,
  .afkrs-legal-block p,
  #af-ganzes-bild-v4 .afgb5-text,
  #engagement-beratung .afeb2-header > p,
  #engagement-beratung .afeb2-content > p
) {
  max-width: var(--afds-reading) !important;
  font-size: var(--afds-body) !important;
  line-height: var(--afds-leading-body) !important;
}

/* Auf der Startseite eine klare, wiederkehrende Hierarchie */
#af-ganzes-bild-v4,
#engagement-beratung {
  padding-top: var(--afds-space-7) !important;
  padding-bottom: var(--afds-space-7) !important;
}

#af-ganzes-bild-v4 .afgb5-inner,
#engagement-beratung .afeb2-inner {
  width: min(var(--afds-content), calc(100vw - 64px)) !important;
}

#af-ganzes-bild-v4 .afgb5-header,
#engagement-beratung .afeb2-header {
  margin-bottom: var(--afds-space-5) !important;
}

#af-ganzes-bild-v4 .afgb5-grid {
  gap: var(--afds-space-6) !important;
}

#af-ganzes-bild-v4 .afgb5-lead {
  font-size: 20px !important;
  line-height: 1.5 !important;
}

#af-ganzes-bild-v4 .afgb5-facts {
  margin-top: var(--afds-space-4) !important;
}

#af-ganzes-bild-v4 .afgb5-facts article {
  min-height: 76px !important;
  padding: var(--afds-space-2) 0 !important;
}

#af-ganzes-bild-v4 .afgb5-facts strong {
  font-size: 17px !important;
}

#af-ganzes-bild-v4 blockquote span {
  font-size: 18px !important;
  line-height: 1.45 !important;
}

/* Engagement und Beratung klar getrennt, ohne optische Überladung */
#engagement-beratung .afeb2-grid {
  gap: var(--afds-space-5) !important;
}

#engagement-beratung .afeb2-panel {
  border-radius: var(--afds-radius) !important;
  box-shadow: var(--afds-shadow) !important;
}

#engagement-beratung .afeb2-content {
  padding: var(--afds-space-5) !important;
}

#engagement-beratung .afeb2-content > p {
  margin-top: var(--afds-space-2) !important;
}

#engagement-beratung .afeb2-role-list {
  margin-top: var(--afds-space-3) !important;
}

#engagement-beratung .afeb2-role-list > div {
  padding: 14px 16px !important;
  border-radius: var(--afds-radius-small) !important;
}

#engagement-beratung .afeb2-groups {
  display: none !important;
}

#engagement-beratung .afeb2-button {
  min-height: 48px !important;
  margin-top: var(--afds-space-3) !important;
  padding: 0 20px !important;
  font-size: 14px !important;
}

#engagement-beratung .afeb2-practice-mark strong {
  font-size: 28px !important;
}

#engagement-beratung .afeb2-logo {
  box-shadow: none !important;
}

/* Ein gemeinsames Kartenbild */
body.afkrs-site-chrome-enabled :where(
  .afks-news-card,
  .afks-backstage-card,
  .afks-reference-card,
  .afkf-card,
  #af-backstage-studio .afba-card,
  .afkrs-contact-form-card,
  .afkrs-contact-routing-card,
  .afkrs-legal-block,
  .afkrs-legal-contact-card
) {
  border-radius: var(--afds-radius) !important;
  box-shadow: var(--afds-shadow) !important;
}

body.afkrs-site-chrome-enabled :where(
  .afks-news-copy,
  .afkf-card-copy,
  #af-backstage-studio .afba-card-copy
) {
  padding: var(--afds-space-3) !important;
}

/* Buttons und Chips */
body.afkrs-site-chrome-enabled :where(
  .afks-text-link,
  .afks-section-action,
  .afks-section-action-light,
  .afks-share-primary,
  .afks-share-options button,
  .afks-share-options a,
  .afkf-button,
  .afkf-reset,
  .afkf-pagination a,
  .afkf-pagination button,
  .afkf-detail-link,
  .afkf-external-link,
  #af-backstage-studio button,
  #af-backstage-studio .afba-button,
  .afkrs-contact-main button,
  .afkrs-contact-main input[type="submit"],
  .afkrs-legal-jump a,
  .afkrs-legal-link-row a
) {
  min-height: 46px !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
}

/* Formulare und Filter bleiben innerhalb der Seite */
body.afkrs-site-chrome-enabled :where(
  input[type="text"],
  input[type="email"],
  input[type="search"],
  input[type="tel"],
  input[type="url"],
  textarea,
  select
) {
  max-width: 100%;
  min-height: 48px;
  border-radius: 12px;
  font-size: 16px;
}

.afkf-filters,
#af-backstage-studio .afba-filters,
.afkrs-contact-form-wrap,
.afkrs-legal-content {
  min-width: 0 !important;
  max-width: 100% !important;
}

/* Subpage Heroes nicht unnötig hoch */
body.afkrs-chrome-subpage :where(
  .afks-single-hero,
  .afks-single-hero-copy,
  .afks-single-modern .afks-single-hero,
  .afks-single-modern .afks-single-hero-inner,
  .afks-backstage-hero,
  .afks-backstage-hero-inner,
  .afkf-hero,
  #af-backstage-studio .afba-hero,
  #af-backstage-studio .afba-hero-inner
) {
  min-height: min(66vh, 660px) !important;
}

/* Lightbox lesbar, ohne übergroße Titel */
.afkf-dialog-info h2,
#af-backstage-studio .afba-lightbox-copy h2,
.afks-lightbox-panel strong {
  max-width: 18ch !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
}

.afkf-dialog-info p,
#af-backstage-studio .afba-lightbox-copy p,
.afks-lightbox-panel p {
  font-size: 16px !important;
  line-height: 1.62 !important;
}

/* Footer kurz und klar */
.afkrs-site-footer {
  font-size: 15px !important;
}

.afkrs-footer-statement {
  max-width: 46ch !important;
  font-size: 16px !important;
  line-height: 1.6 !important;
}

.afkrs-footer-nav a,
.afkrs-footer-more a,
.afkrs-social-links a {
  font-size: 14px !important;
}

/* Tastaturfokus */
body.afkrs-site-chrome-enabled :where(a, button, input, textarea, select):focus-visible {
  outline: 3px solid rgba(232, 91, 102, .45) !important;
  outline-offset: 3px !important;
}

/* Tablet */
@media (max-width: 1080px) {
  :root {
    --afds-page-title: clamp(42px, 7vw, 62px);
    --afds-section-title: clamp(33px, 5vw, 46px);
    --afds-card-title: clamp(23px, 3.4vw, 29px);
    --afds-space-7: 76px;
  }

  .afkrs-site-header-inner {
    width: min(var(--afds-content), calc(100% - 28px)) !important;
  }

  #af-ganzes-bild-v4 .afgb5-inner,
  #engagement-beratung .afeb2-inner {
    width: min(var(--afds-content), calc(100vw - 40px)) !important;
  }
}

/* Handy */
@media (max-width: 700px) {
  :root {
    --afds-page-title: clamp(38px, 10.8vw, 50px);
    --afds-section-title: clamp(31px, 8.8vw, 40px);
    --afds-card-title: clamp(22px, 6.6vw, 28px);
    --afds-body: 16px;
    --afds-small: 13px;
    --afds-space-5: 32px;
    --afds-space-6: 48px;
    --afds-space-7: 58px;
    --afds-radius: 17px;
  }

  .afkrs-site-header {
    min-height: 72px !important;
  }

  .afkrs-site-header-inner {
    width: calc(100% - 24px) !important;
    min-height: 72px !important;
  }

  .afkrs-site-brand-copy strong {
    font-size: 15px !important;
  }

  #af-ganzes-bild-v4,
  #engagement-beratung {
    padding-top: var(--afds-space-7) !important;
    padding-bottom: var(--afds-space-7) !important;
  }

  #af-ganzes-bild-v4 .afgb5-inner,
  #engagement-beratung .afeb2-inner {
    width: calc(100vw - 34px) !important;
  }

  #af-ganzes-bild-v4 .afgb5-header,
  #engagement-beratung .afeb2-header {
    margin-bottom: var(--afds-space-4) !important;
  }

  #af-ganzes-bild-v4 .afgb5-grid {
    gap: var(--afds-space-4) !important;
  }

  #af-ganzes-bild-v4 .afgb5-lead {
    font-size: 18px !important;
  }

  #engagement-beratung .afeb2-content {
    padding: 26px 20px 28px !important;
  }

  #engagement-beratung .afeb2-practice-mark strong {
    font-size: 25px !important;
  }

  body.afkrs-chrome-subpage :where(
    .afks-single-hero,
    .afks-single-hero-copy,
    .afks-single-modern .afks-single-hero,
    .afks-single-modern .afks-single-hero-inner,
    .afks-backstage-hero,
    .afks-backstage-hero-inner,
    .afkf-hero,
    #af-backstage-studio .afba-hero,
    #af-backstage-studio .afba-hero-inner
  ) {
    min-height: min(58vh, 540px) !important;
  }

  body.afkrs-site-chrome-enabled :where(
    .afks-section-head,
    .afkf-section-head,
    .afkf-featured-head,
    #af-backstage-studio .afba-results-head
  ) {
    margin-bottom: var(--afds-space-4) !important;
  }

  body.afkrs-site-chrome-enabled :where(
    .afks-share-options,
    .afkf-hero-actions
  ) {
    gap: 10px !important;
  }

  body.afkrs-site-chrome-enabled :where(
    .afks-share-options button,
    .afks-share-options a,
    .afkf-button,
    .afkrs-contact-main button,
    .afkrs-contact-main input[type="submit"]
  ) {
    width: 100% !important;
  }
}

/* Sehr schmale Geräte */
@media (max-width: 390px) {
  :root {
    --afds-page-title: 38px;
    --afds-section-title: 31px;
    --afds-card-title: 22px;
  }

  .afkrs-site-header-inner {
    width: calc(100% - 18px) !important;
  }
}

/* Contact Form 7: gut sichtbare Rückmeldungen */
body.afkrs-site-chrome-enabled .wpcf7 form .wpcf7-response-output {
  width: 100% !important;
  margin: 24px 0 0 !important;
  padding: 16px 18px !important;

  border: 1px solid rgba(11, 21, 33, .16) !important;
  border-left: 5px solid #687381 !important;
  border-radius: 14px !important;

  color: var(--afds-ink) !important;
  background: #f7f4ef !important;

  font-family: var(--afds-font) !important;
  font-size: 16px !important;
  font-weight: 750 !important;
  line-height: 1.55 !important;

  box-shadow: 0 12px 30px rgba(20, 28, 37, .08) !important;
}

body.afkrs-site-chrome-enabled .wpcf7 form.sent .wpcf7-response-output {
  border-color: #b9d9c2 !important;
  border-left-color: #2f8a4c !important;
  color: #174c29 !important;
  background: #edf8f0 !important;
}

body.afkrs-site-chrome-enabled .wpcf7 form.invalid .wpcf7-response-output,
body.afkrs-site-chrome-enabled .wpcf7 form.unaccepted .wpcf7-response-output {
  border-color: #ead39b !important;
  border-left-color: #b47a00 !important;
  color: #664600 !important;
  background: #fff8e8 !important;
}

body.afkrs-site-chrome-enabled .wpcf7 form.failed .wpcf7-response-output,
body.afkrs-site-chrome-enabled .wpcf7 form.aborted .wpcf7-response-output {
  border-color: #e7b8b8 !important;
  border-left-color: #c43a3a !important;
  color: #792525 !important;
  background: #fff0f0 !important;
}

body.afkrs-site-chrome-enabled .wpcf7 form.spam .wpcf7-response-output {
  border-color: #efc9a7 !important;
  border-left-color: #d36f1e !important;
  color: #784018 !important;
  background: #fff4ea !important;
}

/* Fehler direkt unter einem Eingabefeld */
body.afkrs-site-chrome-enabled .wpcf7 .wpcf7-not-valid-tip {
  display: block !important;
  margin: 8px 0 0 !important;
  padding: 10px 12px !important;

  border-left: 4px solid #c43a3a !important;
  border-radius: 9px !important;

  color: #842b2b !important;
  background: #fff0f0 !important;

  font-family: var(--afds-font) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1.45 !important;
}

/* Ungültige Felder selbst klar kennzeichnen */
body.afkrs-site-chrome-enabled .wpcf7 .wpcf7-not-valid {
  border-color: #c43a3a !important;
  box-shadow: 0 0 0 3px rgba(196, 58, 58, .12) !important;
}

/* Datenschutzhinweis */
body.afkrs-site-chrome-enabled .wpcf7 .wpcf7-acceptance .wpcf7-list-item {
  margin: 0 !important;
}

body.afkrs-site-chrome-enabled .wpcf7 .wpcf7-acceptance label {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: start !important;

  font-size: 15px !important;
  line-height: 1.55 !important;
}

body.afkrs-site-chrome-enabled .wpcf7 .wpcf7-acceptance input[type="checkbox"] {
  width: 19px !important;
  height: 19px !important;
  min-height: 0 !important;
  margin: 3px 0 0 !important;
}

@media (max-width: 700px) {
  body.afkrs-site-chrome-enabled .wpcf7 form .wpcf7-response-output {
    margin-top: 20px !important;
    padding: 15px 16px !important;
    font-size: 15px !important;
  }

  body.afkrs-site-chrome-enabled .wpcf7 .wpcf7-not-valid-tip {
    font-size: 14px !important;
  }

  body.afkrs-site-chrome-enabled .wpcf7 .wpcf7-acceptance label {
    font-size: 14px !important;
  }
}

