/** Shopify CDN: Minification failed

Line 226:0 Unexpected "}"
Line 245:0 Unexpected "}"
Line 264:0 Unexpected "}"
Line 274:0 Unexpected "}"
Line 285:0 Unexpected "}"
Line 299:0 Unexpected "}"

**/
/* ==========================================================================
   SkyClean Drones – Designsystem (hell)
   Eine Quelle für Farben, Rhythmus und Bauteile – für Startseite UND
   Unterseiten. Die Abschnitts-CSS, die vorher in jedem Liquid-Block
   einzeln stand, ist hier zusammengefasst; jede Regel existiert genau
   einmal.
   ========================================================================== */

:root {
  /* brand */
  --scd-blue-900: #06253f;
  --scd-blue-800: #0a3358;
  --scd-blue-700: #0f4674;
  --scd-blue-600: #1668b3;
  --scd-blue-500: #2e86d4;
  --scd-blue-300: #7fb6e6;
  --scd-blue-100: #d7e8f7;

  /* neutrals */
  --scd-ink: #0b1a28;
  --scd-ink-soft: #40566b;
  --scd-line: #d9e2ec;
  --scd-paper: #ffffff;
  --scd-paper-2: #f4f8fc;

  /* dark surface */
  --scd-dark: #071a2c;
  --scd-dark-2: #0c2740;
  --scd-dark-line: rgba(160, 200, 235, 0.18);
  --scd-dark-text: #e8f2fb;
  --scd-dark-text-soft: #a8c4dc;

  --scd-success: #1c7a4f;

  /* rhythm */
  --scd-section-y: clamp(56px, 7vw, 104px);
  --scd-gutter: clamp(18px, 5vw, 48px);
  --scd-max: 1200px;
  --scd-gap: clamp(16px, 2vw, 26px);

  /* type */
  --scd-font: "Sora", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  --scd-radius: 4px;
  --scd-shadow: 0 14px 34px rgba(9, 32, 54, 0.10), 0 2px 6px rgba(9, 32, 54, 0.06);
  --scd-shadow-lg: 0 26px 60px rgba(9, 32, 54, 0.16), 0 4px 10px rgba(9, 32, 54, 0.07);

  --scd-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

/* browser surfaces: these ship with defaults that belong to no design system */
.scd ::selection { background: var(--scd-blue-600); color: #fff; }
.scd :focus-visible {
  outline: 2px solid var(--scd-blue-600);
  outline-offset: 3px;
  border-radius: 2px;
}
.scd--dark :focus-visible { outline-color: var(--scd-blue-300); }

/* ------------------------------------------------------------------ layout */
.scd {
  font-family: var(--scd-font);
  color: var(--scd-ink);
  padding: var(--scd-section-y) var(--scd-gutter);
  background: var(--scd-paper);
}
.scd--tint { background: var(--scd-paper-2); }
.scd--dark {
  background: linear-gradient(180deg, var(--scd-dark) 0%, var(--scd-dark-2) 100%);
  color: var(--scd-dark-text);
}
.scd__inner { max-width: var(--scd-max); margin: 0 auto; }
.scd__inner--narrow { max-width: 860px; }

/* ---------------------------------------------------------------- headings */
.scd__head { max-width: 720px; margin: 0 0 clamp(32px, 4vw, 56px); }
.scd__head--center { margin-left: auto; margin-right: auto; text-align: center; }

.scd__title {
  margin: 0;
  font-weight: 800;
  font-size: clamp(28px, 3.6vw, 46px);
  line-height: 1.08;
  letter-spacing: -0.035em;
  text-wrap: balance;
  color: inherit;
}
.scd--dark .scd__title { color: var(--scd-dark-text); }

.scd__lead {
  margin: 16px 0 0;
  font-size: clamp(15px, 1.25vw, 18px);
  line-height: 1.65;
  color: var(--scd-ink-soft);
  max-width: 62ch;
}
.scd__head--center .scd__lead { margin-left: auto; margin-right: auto; }
.scd--dark .scd__lead { color: var(--scd-dark-text-soft); }

.scd__sub {
  margin: 0 0 14px;
  font-size: clamp(19px, 1.7vw, 23px);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: inherit;
}

/* ---------------------------------------------------------------- buttons */
.scd-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 16px 28px;
  font: 600 15px/1 var(--scd-font);
  text-decoration: none;
  border-radius: var(--scd-radius);
  border: 1px solid transparent;
  cursor: pointer;
  transition: background .25s var(--scd-ease), color .25s var(--scd-ease),
              border-color .25s var(--scd-ease), transform .25s var(--scd-ease);
}
.scd-btn svg { width: 18px; height: 18px; flex: none; }
.scd-btn--primary { background: var(--scd-blue-600); color: #fff; }
.scd-btn--primary:hover { background: var(--scd-blue-700); color: #fff; }
.scd-btn--ghost { background: transparent; color: var(--scd-blue-700); border-color: var(--scd-line); }
.scd-btn--ghost:hover { border-color: var(--scd-blue-600); color: var(--scd-blue-600); }
.scd--dark .scd-btn--primary { background: var(--scd-dark-text); color: var(--scd-blue-900); }
.scd--dark .scd-btn--primary:hover { background: var(--scd-blue-300); }
.scd--dark .scd-btn--ghost { color: var(--scd-dark-text); border-color: var(--scd-dark-line); }
.scd--dark .scd-btn--ghost:hover { border-color: var(--scd-blue-300); color: var(--scd-blue-300); }
.scd-btn:active { transform: translateY(1px); }

.scd-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }

/* ------------------------------------------------------------------ grids */
.scd-grid { display: grid; gap: var(--scd-gap); }
.scd-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.scd-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.scd-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 980px) {
  .scd-grid--3, .scd-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .scd-grid--2, .scd-grid--3, .scd-grid--4 { grid-template-columns: minmax(0, 1fr); }
}

/* ------------------------------------------------------------------ icons */
.scd-icon {
  width: 26px; height: 26px;
  stroke: var(--scd-blue-600);
  stroke-width: 1.6;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: none;
}
.scd--dark .scd-icon { stroke: var(--scd-blue-300); }

/* ------------------------------------------------------------------ media */
.scd-figure { position: relative; overflow: hidden; border-radius: var(--scd-radius); background: var(--scd-paper-2); }
.scd-figure img { display: block; width: 100%; height: 100%; object-fit: cover; }
.scd-figure--16x10 { aspect-ratio: 16 / 10; }
.scd-figure--4x3 { aspect-ratio: 4 / 3; }

/* ------------------------------------------------------------------ reveal */
/* Native scroll-driven animation where supported; the JS fallback in
   scd-reveal.js toggles .is-visible everywhere else. Content is visible by
   default so a failed script can never hide the page. */
/* WICHTIG, geändert gegenüber der vorigen Fassung:
   Der Ausgangszustand "unsichtbar" hängt jetzt an .scd-js. Vorher stand
   opacity:0 auf allen .scd-reveal, sobald der Browser keine
   scroll-gesteuerten Animationen kann (heute Safari und Firefox) – und
   sichtbar wurde der Inhalt erst, wenn ein Skript .is-visible setzte.
   Lud dieses Skript nicht, blieb die halbe Seite unsichtbar. Genau das
   darf nicht passieren: ohne JavaScript wird hier nichts mehr versteckt. */
@media (prefers-reduced-motion: no-preference) {
  @supports ((animation-timeline: view()) and (animation-range: entry)) {
    @keyframes scd-rise {
      from { opacity: 0; transform: translateY(18px); }
      to   { opacity: 1; transform: none; }
    }
    html:not(.scd-js-reveal) .scd-reveal {
      animation: scd-rise .7s var(--scd-ease) both;
      animation-timeline: view();
      animation-range: entry 0% entry 60%;
    }
  }
  html.scd-js-reveal .scd-reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .7s var(--scd-ease), transform .7s var(--scd-ease);
  }
  html.scd-js-reveal .scd-reveal.is-visible {
    opacity: 1;
    transform: none;
  }
}

/* --------------------------------------------------------------- utilities */
.scd-eyebrow-free { }
.scd-meta {
  display: flex; flex-wrap: wrap; gap: 10px 22px;
  margin: 0; padding: 0; list-style: none;
  font-size: 14px; color: var(--scd-ink-soft);
}
.scd--dark .scd-meta { color: var(--scd-dark-text-soft); }
.scd-meta li { display: flex; align-items: center; gap: 8px; }
.scd-meta .scd-icon { width: 18px; height: 18px; }


/* ==========================================================================
   Abschnitte der Startseite (vorher je Block inline)
   ========================================================================== */

/* ===== scd_area ===== */
}{content-visibility:auto;contain-intrinsic-size:auto 900px}
.are{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,4vw,56px);align-items:start}
  @media(max-width:900px){.are{grid-template-columns:1fr}}
  .are__map{border:1px solid var(--scd-dark-line);border-radius:var(--scd-radius);overflow:hidden;aspect-ratio:16/11;background:var(--scd-dark-2)}
  .are__map iframe{width:100%;height:100%;border:0;display:block;filter:grayscale(.25) contrast(1.05)}
  .are__radius{display:flex;gap:22px;flex-wrap:wrap;margin:18px 0 0;padding:0;list-style:none;font-size:13.5px;color:var(--scd-dark-text-soft)}
  .are__radius li{display:flex;align-items:center;gap:8px}
  .are__dot{width:9px;height:9px;border-radius:50%;background:var(--scd-blue-300);flex:none}
  .are__hours{margin:26px 0 0;border-top:1px solid var(--scd-dark-line)}
  .are__hours dl{display:grid;grid-template-columns:1fr auto;gap:0;margin:0}
  .are__hours dt,.are__hours dd{padding:13px 0;border-bottom:1px solid var(--scd-dark-line);margin:0;font-size:14.5px}
  .are__hours dt{color:var(--scd-dark-text-soft)}
  .are__hours dd{text-align:right;font-variant-numeric:tabular-nums;color:var(--scd-dark-text)}
  .are__contact{margin:26px 0 0;display:grid;gap:12px}
  .are__contact a{color:var(--scd-dark-text);text-decoration:none;display:flex;align-items:center;gap:10px;font-size:15px}
  .are__contact a:hover{color:var(--scd-blue-300)}
  .are__season{margin:22px 0 0;font-size:13px;line-height:1.6;color:var(--scd-dark-text-soft)}

/* ===== scd_compare ===== */
}{content-visibility:auto;contain-intrinsic-size:auto 900px}
.cmp{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--scd-line);border:1px solid var(--scd-line)}
  @media(max-width:820px){.cmp{grid-template-columns:1fr}}
  .cmp__col{background:var(--scd-paper);padding:clamp(24px,3vw,36px)}
  .cmp__col--ours{background:var(--scd-blue-900);color:var(--scd-dark-text)}
  .cmp__label{margin:0 0 6px;font-size:clamp(18px,1.8vw,22px);font-weight:700;letter-spacing:-0.02em}
  .cmp__price{margin:0 0 22px;font-size:14px;color:var(--scd-ink-soft)}
  .cmp__col--ours .cmp__price{color:var(--scd-dark-text-soft)}
  .cmp__price b{display:block;font-size:clamp(24px,2.6vw,32px);font-weight:800;letter-spacing:-0.03em;color:var(--scd-ink);margin-bottom:4px}
  .cmp__col--ours .cmp__price b{color:var(--scd-dark-text)}
  .cmp__list{margin:0;padding:0;list-style:none;display:grid;gap:13px}
  .cmp__list li{display:flex;gap:11px;align-items:flex-start;font-size:14.5px;line-height:1.6;color:var(--scd-ink-soft)}
  .cmp__col--ours .cmp__list li{color:var(--scd-dark-text-soft)}
  .cmp__list .scd-icon{width:19px;height:19px;margin-top:1px}
  .cmp__col--ours .cmp__list .scd-icon{stroke:var(--scd-blue-300)}
  .cmp__list--con .scd-icon{stroke:#9aa7b4}
  .cmp__foot{margin:26px 0 0;font-size:12.5px;line-height:1.6;color:var(--scd-ink-soft)}

/* ===== scd_cta ===== */
}{content-visibility:auto;contain-intrinsic-size:auto 900px}
.fin{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(24px,4vw,60px);align-items:center}
  @media(max-width:820px){.fin{grid-template-columns:1fr}}
  .fin__title{margin:0 0 14px;font-size:clamp(26px,3.4vw,42px);font-weight:800;letter-spacing:-0.035em;line-height:1.1;text-wrap:balance}
  .fin__text{margin:0;color:var(--scd-ink-soft);line-height:1.7;max-width:50ch}
  .fin__actions{display:grid;gap:12px}
  .fin__actions .scd-btn{justify-content:center}
  .fin__hint{margin:14px 0 0;font-size:13px;color:var(--scd-ink-soft);text-align:center}

/* ===== scd_eco ===== */
}{content-visibility:auto;contain-intrinsic-size:auto 900px}
.eco{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px);align-items:center}
  @media(max-width:900px){.eco{grid-template-columns:1fr}}
  .eco__list{margin:0;padding:0;list-style:none;display:grid;gap:22px}
  .eco__item{display:grid;grid-template-columns:auto 1fr;gap:14px}
  .eco__item h3{margin:0 0 5px;font-size:16.5px;font-weight:700;letter-spacing:-0.015em}
  .eco__item p{margin:0;font-size:14.5px;line-height:1.65;color:var(--scd-ink-soft);max-width:46ch}
  .eco__figure{aspect-ratio:4/3}
  .eco__note{margin:24px 0 0;font-size:12.5px;line-height:1.6;color:var(--scd-ink-soft)}

/* ===== scd_process ===== */
}{content-visibility:auto;contain-intrinsic-size:auto 900px}
.stp{counter-reset:step;display:grid;gap:0;border-top:1px solid var(--scd-line)}
  .stp__row{display:grid;grid-template-columns:auto 1fr 1fr;gap:clamp(16px,3vw,44px);padding:clamp(24px,3vw,34px) 0;border-bottom:1px solid var(--scd-line);align-items:start}
  @media(max-width:820px){.stp__row{grid-template-columns:auto 1fr;gap:16px}}
  .stp__num{counter-increment:step;font-size:14px;font-weight:700;color:var(--scd-blue-600);font-variant-numeric:tabular-nums;padding-top:4px;min-width:2.5rem}
  .stp__num::before{content:counter(step,decimal-leading-zero)}
  .stp__title{margin:0 0 8px;font-size:clamp(19px,1.9vw,23px);font-weight:700;letter-spacing:-0.025em}
  .stp__text{margin:0;color:var(--scd-ink-soft);line-height:1.7;font-size:15px;max-width:48ch}
  .stp__aside{font-size:14px;line-height:1.65;color:var(--scd-ink-soft)}
  @media(max-width:820px){.stp__aside{grid-column:2}}
  .stp__aside strong{color:var(--scd-ink);font-weight:600}
  .stp__cta{margin-top:clamp(28px,3vw,40px)}

/* ===== scd_proof ===== */
}{content-visibility:auto;contain-intrinsic-size:auto 900px}
.prf{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,60px);align-items:center}
  @media(max-width:900px){.prf{grid-template-columns:1fr}}
  .prf__video{position:relative;border-radius:var(--scd-radius);overflow:hidden;background:#03121f;aspect-ratio:16/10}
  .prf__video video{width:100%;height:100%;object-fit:cover;display:block}
  .prf__numbers{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--scd-dark-line);border:1px solid var(--scd-dark-line);margin:0 0 26px}
  .prf__cell{background:var(--scd-dark);padding:20px 22px}
  .prf__cell strong{display:block;font-size:clamp(26px,3vw,36px);font-weight:800;letter-spacing:-0.035em;line-height:1.05;color:var(--scd-dark-text)}
  .prf__cell span{display:block;margin-top:6px;font-size:13.5px;line-height:1.5;color:var(--scd-dark-text-soft)}
  .prf__list{margin:0;padding:0;list-style:none;display:grid;gap:14px}
  .prf__list li{display:flex;gap:12px;align-items:flex-start;font-size:15px;line-height:1.6;color:var(--scd-dark-text-soft)}
  .prf__list .scd-icon{margin-top:2px;width:20px;height:20px}
  .prf__note{margin:22px 0 0;font-size:12.5px;line-height:1.6;color:var(--scd-dark-text-soft);opacity:.85}

/* ===== scd_services ===== */
.svc-lead{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(20px,3vw,44px);align-items:center;margin-bottom:var(--scd-gap)}
  @media(max-width:900px){.svc-lead{grid-template-columns:1fr}}
  .svc-lead__figure{aspect-ratio:4/3}
  .svc-lead__title{font-size:clamp(22px,2.4vw,30px);font-weight:700;letter-spacing:-0.025em;margin:0 0 12px}
  .svc-lead__text{color:var(--scd-ink-soft);line-height:1.7;margin:0 0 22px;max-width:52ch}
  .svc-facts{display:flex;gap:28px;flex-wrap:wrap;margin:0 0 24px;padding:0;list-style:none}
  .svc-facts strong{display:block;font-size:26px;font-weight:800;letter-spacing:-0.03em;color:var(--scd-blue-700);line-height:1.1}
  .svc-facts span{font-size:13px;color:var(--scd-ink-soft)}
  .svc-item{display:flex;flex-direction:column;background:var(--scd-paper);border:1px solid var(--scd-line);border-radius:var(--scd-radius);overflow:hidden}
  .svc-item__figure{aspect-ratio:16/10;background:var(--scd-paper-2)}
  .svc-item__figure img{width:100%;height:100%;object-fit:cover;display:block}
  .svc-item__body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
  .svc-item__title{margin:0;font-size:18px;font-weight:700;letter-spacing:-0.02em;display:flex;align-items:center;gap:10px}
  .svc-item__text{margin:0;font-size:14.5px;line-height:1.65;color:var(--scd-ink-soft)}
  .svc-item--plain .svc-item__body{padding-top:26px}

/* ==========================================================================
   Neue Bauteile für die Unterseiten
   Dieselben Tokens wie die Startseite, damit Unterseiten nicht wie eine
   zweite Firma aussehen. Nichts hiervon überschreibt Dawn.
   ========================================================================== */

/* ------------------------------------------------------------- Seitenkopf */
.scd-pagehead { padding-top: clamp(40px, 5vw, 72px); }
.scd-pagehead__in { max-width: var(--scd-max); margin: 0 auto; }
.scd-pagehead__title {
  margin: 0;
  font-weight: 800;
  font-size: clamp(30px, 4.4vw, 56px);
  line-height: 1.06;
  letter-spacing: -0.035em;
  text-wrap: balance;
}
.scd-pagehead__lead {
  margin: 18px 0 0;
  font-size: clamp(16px, 1.3vw, 19px);
  line-height: 1.65;
  color: var(--scd-ink-soft);
  max-width: 62ch;
}
.scd--dark .scd-pagehead__lead { color: var(--scd-dark-text-soft); }
.scd-pagehead .scd-actions { margin-top: clamp(22px, 2.6vw, 32px); }

/* Brotkrumen: sichtbar, weil sie auf Unterseiten die Orientierung geben –
   und weil Google denselben Pfad dann im Treffer anzeigt. */
.scd-crumbs {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  margin: 0 0 18px; padding: 0; list-style: none;
  font-size: 13.5px; color: var(--scd-ink-soft);
}
.scd-crumbs li { display: flex; align-items: center; gap: 8px; }
.scd-crumbs li + li::before { content: "›"; color: var(--scd-line); }
.scd-crumbs a { color: var(--scd-ink-soft); text-decoration: none; border-bottom: 1px solid transparent; }
.scd-crumbs a:hover { color: var(--scd-blue-700); border-bottom-color: var(--scd-blue-300); }
.scd-crumbs [aria-current="page"] { color: var(--scd-ink); }
.scd--dark .scd-crumbs, .scd--dark .scd-crumbs a { color: var(--scd-dark-text-soft); }

/* ------------------------------------------------------------- Fließtext */
.scd-prose__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(24px, 3.4vw, 56px);
  align-items: start;
}
@media (max-width: 900px) { .scd-prose__grid { grid-template-columns: minmax(0, 1fr); } }
.scd-prose__part h3 {
  margin: 0 0 10px;
  font-size: clamp(18px, 1.6vw, 21px);
  font-weight: 700;
  letter-spacing: -0.02em;
}
.scd-prose__part :is(p, ul, ol) {
  margin: 0 0 14px;
  color: var(--scd-ink-soft);
  line-height: 1.72;
  font-size: 15.5px;
}
.scd-prose__part ul { padding-left: 1.15em; }
.scd-prose__part li { margin-bottom: 8px; }
.scd-prose__part strong { color: var(--scd-ink); font-weight: 600; }
.scd-prose__part a { color: var(--scd-blue-700); }
.scd--dark .scd-prose__part :is(p, ul, ol) { color: var(--scd-dark-text-soft); }
.scd--dark .scd-prose__part strong { color: var(--scd-dark-text); }

/* ------------------------------------------------------------------- FAQ */
.scd-faq { display: grid; gap: 10px; }
.scd-faq__item {
  border: 1px solid var(--scd-line);
  border-radius: var(--scd-radius);
  background: var(--scd-paper);
  overflow: hidden;
}
.scd--tint .scd-faq__item { background: var(--scd-paper); }
.scd--dark .scd-faq__item { background: rgba(255,255,255,.04); border-color: var(--scd-dark-line); }
.scd-faq__q {
  width: 100%;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  margin: 0; padding: 18px 20px;
  background: none; border: 0; cursor: pointer;
  font: 600 16px/1.4 var(--scd-font);
  color: inherit; text-align: left;
}
.scd-faq__q::after {
  content: ""; flex: none; width: 12px; height: 12px;
  border-right: 2px solid var(--scd-blue-600);
  border-bottom: 2px solid var(--scd-blue-600);
  transform: rotate(45deg) translate(-2px, -2px);
  transition: transform .25s var(--scd-ease);
}
.scd--dark .scd-faq__q::after { border-color: var(--scd-blue-300); }
.scd-faq__q[aria-expanded="true"]::after { transform: rotate(225deg) translate(-2px, -2px); }
.scd-faq__a { padding: 0 20px; max-height: 0; overflow: hidden; transition: max-height .3s var(--scd-ease); }
.scd-faq__a[data-open="true"] { max-height: 60em; padding-bottom: 20px; }
.scd-faq__a :is(p, ul) { margin: 0 0 12px; color: var(--scd-ink-soft); line-height: 1.7; font-size: 15px; }
.scd--dark .scd-faq__a :is(p, ul) { color: var(--scd-dark-text-soft); }
/* Ohne JavaScript sind alle Antworten offen: lieber alles lesbar als eine
   Liste von Fragen, die sich nicht öffnen lässt. */
html:not(.scd-js) .scd-faq__a { max-height: none; padding-bottom: 20px; }
html:not(.scd-js) .scd-faq__q { cursor: default; }

/* -------------------------------------------------------------- Medienband
   Video oder Bild über die volle Breite des Inhaltsbereichs. Ohne Datei
   bleibt der Abschnitt leer und wird gar nicht erst ausgegeben. */
.scd-media__frame {
  position: relative;
  border-radius: var(--scd-radius);
  overflow: hidden;
  background: var(--scd-paper-2);
  box-shadow: var(--scd-shadow);
}
.scd-media__frame--16x9 { aspect-ratio: 16 / 9; }
.scd-media__frame--21x9 { aspect-ratio: 21 / 9; }
.scd-media__frame > :is(video, img) {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.scd-media__cap {
  margin: 14px 0 0;
  font-size: 14px;
  color: var(--scd-ink-soft);
}
.scd--dark .scd-media__cap { color: var(--scd-dark-text-soft); }
/* Abspiel-Schalter: sichtbar, weil ein Video, das sich nicht anhalten lässt,
   eine Barriere ist. */
.scd-media__toggle {
  position: absolute; right: 12px; bottom: 12px; z-index: 2;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 14px; border: 0; border-radius: 999px; cursor: pointer;
  background: rgba(7, 26, 44, .78); color: #fff;
  font: 600 13px/1 var(--scd-font);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.scd-media__toggle:hover { background: rgba(7, 26, 44, .92); }

/* ----------------------------------------------------------- Kachelraster
   Für Unterseiten dieselbe Kachel wie die Leistungen auf der Startseite. */
.scd-tile {
  display: flex; flex-direction: column;
  background: var(--scd-paper);
  border: 1px solid var(--scd-line);
  border-radius: var(--scd-radius);
  overflow: hidden;
  color: inherit; text-decoration: none;
}
.scd--dark .scd-tile { background: rgba(255,255,255,.04); border-color: var(--scd-dark-line); }
a.scd-tile { transition: border-color .25s var(--scd-ease), transform .25s var(--scd-ease); }
a.scd-tile:hover { border-color: var(--scd-blue-600); transform: translateY(-2px); }
.scd-tile__figure { aspect-ratio: 16 / 10; background: var(--scd-paper-2); overflow: hidden; }
.scd-tile__figure img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s var(--scd-ease); }
a.scd-tile:hover .scd-tile__figure img { transform: scale(1.04); }
.scd-tile__body { padding: 20px 20px 22px; display: flex; flex-direction: column; gap: 9px; flex: 1; }
.scd-tile__title {
  margin: 0; font-size: 17.5px; font-weight: 700; letter-spacing: -0.02em;
  display: flex; align-items: center; gap: 10px;
}
.scd-tile__text { margin: 0; font-size: 14.5px; line-height: 1.65; color: var(--scd-ink-soft); }
.scd--dark .scd-tile__text { color: var(--scd-dark-text-soft); }
.scd-tile__more {
  margin-top: auto; padding-top: 12px;
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 14px; font-weight: 600; color: var(--scd-blue-700);
}
.scd--dark .scd-tile__more { color: var(--scd-blue-300); }
.scd-tile__more svg { width: 16px; height: 16px; }

/* ------------------------------------------------------- Kennwerte (ehrlich)
   Wert über Beschriftung, durch Linien getrennt. Bewusst ohne erfundene
   Kundenzahlen oder Bewertungen. */
.scd-keyfacts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 1px;
  background: var(--scd-line);
  border-block: 1px solid var(--scd-line);
}
.scd--dark .scd-keyfacts { background: var(--scd-dark-line); border-color: var(--scd-dark-line); }
.scd-keyfacts__cell { background: var(--scd-paper); padding: 18px 18px 18px 0; }
.scd--tint .scd-keyfacts__cell { background: var(--scd-paper-2); }
.scd--dark .scd-keyfacts__cell { background: var(--scd-dark); }
.scd-keyfacts__cell:not(:first-child) { padding-left: 18px; }
.scd-keyfacts__cell strong {
  display: block; font-size: clamp(20px, 2.1vw, 28px); font-weight: 800;
  letter-spacing: -0.03em; line-height: 1.1; color: var(--scd-blue-700);
}
.scd--dark .scd-keyfacts__cell strong { color: var(--scd-dark-text); }
.scd-keyfacts__cell span { display: block; margin-top: 5px; font-size: 13.5px; color: var(--scd-ink-soft); line-height: 1.4; }
.scd--dark .scd-keyfacts__cell span { color: var(--scd-dark-text-soft); }

/* ------------------------------------------------------------- Blogkacheln */
.scd-post__meta { font-size: 13px; color: var(--scd-ink-soft); }
.scd-post__excerpt { margin: 0; font-size: 14.5px; line-height: 1.65; color: var(--scd-ink-soft); }
