/* Cover Customs – Zentrale Design-Tokens
   Einzeländerungen bitte hier vornehmen, nicht in Komponenten hart kodieren. */
:root {
  /* Farben – abgeleitet aus dem Cover-Customs-Logo (Navy + Silber/Chrom) */
  --cc-ink: #131A26;            /* dunkles Navy-Anthrazit, Haupttext */
  --cc-graphite: #35414F;
  --cc-slate: #5A6675;
  --cc-line: #E3E7ED;
  --cc-mist: #F2F5F9;           /* zarter kühler Grundton */
  --cc-paper: #FFFFFF;
  --cc-navy: #14294A;           /* Markenfarbe (Logo-Navy) */
  --cc-toolbar-bg: #101820;     /* gemeinsame CMS-/Vorschau-Leiste */
  --cc-navy-deep: #0E1E38;      /* dunkleres Navy für Verläufe/Hover */
  --cc-accent: #14294A;         /* Akzent = Navy: Buttons, aktive Zustände */
  --cc-accent-strong: #0E1E38;  /* Links/Hover/Text-Akzent (AA-sicher auf Weiß) */
  --cc-accent-soft: #E7ECF4;    /* zarte Navy-Fläche, Badges */
  --cc-steel: #8A98A7;          /* Silber/Chrom-Sekundärton (nur dekorativ/groß) */
  --cc-steel-soft: #C7CFD9;
  --cc-ink-invert: #F4F7FB;
  --cc-overlay: rgba(9,16,30,.58);
  --cc-danger: #B42318;
  --cc-danger-soft: #FDECEA;
  --cc-success: #116149;
  --cc-success-soft: #E6F4EE;
  --cc-focus: #14294A;

  /* Typografie */
  --cc-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --cc-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --cc-fs-display: clamp(2.4rem, 1.2rem + 4.6vw, 4.2rem);
  --cc-fs-h1: clamp(2rem, 1.3rem + 2.6vw, 3rem);
  --cc-fs-h2: clamp(1.5rem, 1.15rem + 1.4vw, 2.1rem);
  --cc-fs-h3: clamp(1.2rem, 1.05rem + .7vw, 1.5rem);
  --cc-fs-body: clamp(1rem, .97rem + .18vw, 1.075rem);
  --cc-fs-small: .85rem;
  --cc-lh-body: 1.65;
  --cc-lh-head: 1.12;
  --cc-measure: 68ch;

  /* Abstände */
  --cc-sp-1: .5rem; --cc-sp-2: 1rem; --cc-sp-3: 1.5rem; --cc-sp-4: 2rem;
  --cc-sp-5: 3rem; --cc-sp-6: 4rem; --cc-sp-7: 6rem; --cc-sp-8: 8rem;
  --cc-section: clamp(4rem, 9vw, 8rem);
  --cc-container: 1200px;
  --cc-container-wide: 1400px;
  --cc-gutter: clamp(1.25rem, 5vw, 3rem);

  /* Radien */
  --cc-radius-sm: 8px; --cc-radius-md: 14px; --cc-radius-lg: 22px; --cc-radius-pill: 999px;

  /* Schatten */
  --cc-shadow-sm: 0 1px 2px rgba(20,24,27,.06);
  --cc-shadow-md: 0 8px 24px rgba(20,24,27,.08);
  --cc-shadow-lg: 0 24px 60px rgba(20,24,27,.12);

  /* Motion */
  --cc-ease: cubic-bezier(.22,.61,.36,1);
  --cc-dur: .5s;

  --cc-header-h: 80px;
}

/* Shared local image treatment: the image's alpha channel supplies the icon shape. */
.profile-icon{display:inline-block;vertical-align:middle;flex:0 0 auto;width:var(--profile-icon-size,28px);height:var(--profile-icon-size,28px)}
.profile-icon[hidden],.profile-icon>img[hidden]{display:none}
.profile-icon>img{display:block;width:100%;height:100%;object-fit:contain}
@supports ((mask-image:url("")) or (-webkit-mask-image:url(""))){
  .profile-icon--colored,.site-footer .profile-icon,.profile-icon-surface--dark .profile-icon{background-color:var(--profile-icon-color,#fff);mask-image:var(--profile-icon-image);mask-size:contain;mask-position:center;mask-repeat:no-repeat;mask-mode:alpha;-webkit-mask-image:var(--profile-icon-image);-webkit-mask-size:contain;-webkit-mask-position:center;-webkit-mask-repeat:no-repeat}
  .profile-icon--colored>img,.site-footer .profile-icon>img,.profile-icon-surface--dark .profile-icon>img{opacity:0}
}
@supports not ((mask-image:url("")) or (-webkit-mask-image:url(""))){
  .site-footer .profile-icon>img,.profile-icon-surface--dark .profile-icon>img{filter:brightness(0) invert(1)}
}