/* =========================================================
   SSK Systems – Theme-CSS
   Ergänzt theme.json um Layout-Details, die dort nicht gehen.
   ========================================================= */

/* ---------- Grundlagen ---------- */
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
:focus-visible { outline: 2px solid var(--wp--preset--color--primary); outline-offset: 2px; }
.skip-link.screen-reader-text:focus { background: #fff; color: var(--wp--preset--color--primary); z-index: 1000; }
.wp-block-image img, .wp-block-gallery img { height: auto; }
.wp-block-image figcaption { text-align: center; }
p:empty { display: none; }

/* ---------- Kein Abstand zwischen Header, Inhalt und Footer ---------- */
.wp-site-blocks > main.ssk-main,
.wp-site-blocks > footer.wp-block-template-part { margin-block-start: 0; }

/* ---------- Header (klebt oben) ---------- */
header.wp-block-template-part {
  position: sticky;
  top: var(--wp-admin--admin-bar--height, 0px);
  z-index: 50;
}
.ssk-header { box-shadow: 0 1px 0 var(--wp--preset--color--line); }
.ssk-header__row { row-gap: 0.75rem; }
.ssk-header__nav { column-gap: 0.75rem; }
.ssk-logo img { display: block; height: auto; }
.ssk-nav .wp-block-navigation-item__content { padding: 0.55rem 0.85rem; border-radius: 10px; }
.ssk-nav .wp-block-navigation-item__content:hover { background: var(--wp--preset--color--ice); color: var(--wp--preset--color--primary); }
.ssk-nav .current-menu-item > .wp-block-navigation-item__content { color: var(--wp--preset--color--primary); }
.ssk-header__cta { margin: 0; }
.ssk-button-small .wp-block-button__link { padding: 0.7rem 1.2rem; font-size: 0.9rem; letter-spacing: 0.04em; }

/* Mobiles Overlay-Menü (Burger) */
.ssk-nav .wp-block-navigation__responsive-container.is-menu-open { padding: 4.5rem 1.5rem 1.5rem; }
.ssk-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 1.25rem; padding: 0.75rem 1rem; }
.ssk-nav .wp-block-navigation__responsive-container-open,
.ssk-nav .wp-block-navigation__responsive-container-close { padding: 0.5rem; border-radius: 10px; }

/* ---------- Top-Leiste ---------- */
.ssk-topbar a { color: inherit; font-weight: 600; text-decoration: none; }
.ssk-topbar a:hover { color: inherit; text-decoration: underline; }
.ssk-topbar__contact { margin: 0; }
.ssk-topbar__sep { opacity: 0.5; margin: 0 0.25rem; }
.ssk-topbar .wp-block-group { row-gap: 0.25rem; }

@media (max-width: 599px) {
  .ssk-topbar { display: none; }
  .ssk-header__row { flex-wrap: nowrap; }
  .wp-block-site-logo.ssk-logo img { width: 150px; }
  .ssk-header__nav { column-gap: 0.35rem; }
  .ssk-button-small .wp-block-button__link { padding: 0.6rem 0.8rem; font-size: 0.78rem; }
}


/* ---------- Hero als Vollbild-Cover ---------- */
.ssk-hero--cover {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 600px;
  background-color: var(--wp--preset--color--slate);
}
.ssk-hero--cover::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(34, 38, 45, 0) 55%, rgba(34, 38, 45, 0.55) 100%),
    linear-gradient(90deg, rgba(34, 38, 45, 0.9) 0%, rgba(34, 38, 45, 0.72) 38%, rgba(34, 38, 45, 0.25) 72%, rgba(34, 38, 45, 0.08) 100%);
}
.ssk-hero--cover > * { position: relative; z-index: 1; }
.ssk-hero__content > * { max-width: 620px; }
.ssk-hero__content h1 { color: #fff; margin-top: 0; }
.ssk-hero__lead { color: rgba(255, 255, 255, 0.88); font-size: var(--wp--preset--font-size--large); }
.ssk-chips--light .ssk-chip {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.35);
  color: #fff;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.ssk-chips--light .ssk-chip::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5L20 7'/%3E%3C/svg%3E");
}
.wp-block-button.is-style-outline.ssk-button-light .wp-block-button__link {
  background: transparent;
  color: #fff;
  border-color: rgba(255, 255, 255, 0.6);
}
.wp-block-button.is-style-outline.ssk-button-light .wp-block-button__link:hover,
.wp-block-button.is-style-outline.ssk-button-light .wp-block-button__link:focus {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
  border-color: #fff;
}
.ssk-hero-strip { position: relative; z-index: 2; margin-top: -3.5rem; gap: 1rem; }
.ssk-hero-strip .wp-block-image { margin: 0; }
.ssk-hero-strip .wp-block-image img {
  width: 100%;
  border-radius: 16px;
  box-shadow: 0 18px 40px rgba(18, 36, 52, 0.22);
  border: 3px solid #fff;
  box-sizing: border-box;
}

@media (max-width: 781px) {
  .ssk-hero--cover {
    min-height: min(82svh, 760px);
    background-image: url("../img/hero-mitte-900.webp") !important;
    background-position: 58% 22% !important;
    padding-top: var(--wp--preset--spacing--80) !important;
    padding-bottom: var(--wp--preset--spacing--60) !important;
  }
  .ssk-hero--cover::before {
    background: linear-gradient(180deg, rgba(34, 38, 45, 0.05) 0%, rgba(34, 38, 45, 0.35) 38%, rgba(34, 38, 45, 0.88) 72%, rgba(34, 38, 45, 0.96) 100%);
  }
  .ssk-hero__content .ssk-eyebrow { font-size: 0.78rem; letter-spacing: 0.06em; }
  .ssk-hero__content h1.wp-block-heading { font-size: 1.9rem; line-height: 1.12; }
  .ssk-hero__lead { font-size: 1rem; color: rgba(255, 255, 255, 0.85); }
  .ssk-chips--light { gap: 0.4rem; }
  .ssk-chips--light .ssk-chip { font-size: 0.8rem; padding: 0.35rem 0.7rem; }
  .ssk-hero-strip { margin-top: -2rem; gap: 0.75rem; }
  .ssk-hero-strip .wp-block-image img { border-radius: 12px; border-width: 2px; }
}

/* ---------- Hero v3: Eye-Catcher (22,5 °C) ---------- */
.ssk-hero--v3 { justify-content: center; min-height: 680px; }
.ssk-hero--v3::before {
  background: linear-gradient(180deg, rgba(16, 20, 26, 0.38) 0%, rgba(16, 20, 26, 0.55) 45%, rgba(16, 20, 26, 0.88) 100%);
}
.ssk-hero__content--center { max-width: 780px; margin-left: auto !important; margin-right: auto !important; }
.ssk-hero__content--center > * { max-width: none; margin-left: auto; margin-right: auto; }
.ssk-hero__content--center .ssk-eyebrow { margin-bottom: 0.25rem; }
.ssk-temp {
  margin: 0;
  font-size: clamp(4.75rem, 13vw, 9.5rem);
  font-weight: 800;
  line-height: 0.95;
  letter-spacing: -0.05em;
  color: #4FD9FF;
  text-shadow: 0 8px 40px rgba(79, 217, 255, 0.25);
  font-variant-numeric: tabular-nums;
}
.ssk-temp sup { font-size: 0.34em; line-height: 1; vertical-align: top; position: relative; top: 0.5em; letter-spacing: 0; }
.ssk-temp-label {
  margin: 0.35rem 0 0;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.72);
}
.ssk-slogan {
  margin: 1.75rem 0 0;
  font-size: clamp(2rem, 4.6vw, 3.1rem);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: #fff;
}
.ssk-hero__content--center h1.ssk-hero__h1 {
  margin: 0.75rem auto 0;
  max-width: 640px;
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.82);
}
.ssk-hero__price { margin: 1.25rem 0 0; font-size: 1.1rem; color: rgba(255, 255, 255, 0.9); }
.ssk-hero__price strong { color: #fff; }
.ssk-hero__actions { margin-top: 1.5rem; gap: 1rem 1.75rem; }
.ssk-hero__actions .wp-block-buttons { margin: 0; }
.ssk-button-cta .wp-block-button__link {
  border-radius: 999px;
  font-size: 1.05rem;
  font-weight: 800;
  padding: 0.95rem 1.7rem;
  box-shadow: 0 10px 28px rgba(18, 112, 171, 0.45);
}
.ssk-button-cta .wp-block-button__link:hover,
.ssk-button-cta .wp-block-button__link:focus {
  background-color: var(--wp--preset--color--primary-dark) !important;
  color: #fff !important;
  box-shadow: 0 6px 18px rgba(18, 112, 171, 0.35);
}
.ssk-button-small.ssk-button-cta .wp-block-button__link { font-size: 0.95rem; padding: 0.7rem 1.25rem; box-shadow: none; }
.ssk-wa-link { margin: 0; }
.ssk-wa-link a {
  font-size: 1rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.45);
  padding-bottom: 0.2rem;
}
.ssk-wa-link a:hover { color: #fff; border-bottom-color: #fff; text-decoration: none; }
.ssk-wa-link a::before {
  content: "";
  width: 1.1rem;
  height: 1.1rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a8.5 8.5 0 0 1-12.5 7.5L3 21l1.5-5.5A8.5 8.5 0 1 1 21 12z'/%3E%3C/svg%3E") no-repeat center / contain;
}
.ssk-trust { margin: 1.5rem 0 0; font-size: 0.85rem; font-weight: 600; letter-spacing: 0.03em; color: rgba(255, 255, 255, 0.72); }

/* Partnerkarte, ragt in den Hero hinein */
.ssk-partner-card {
  position: relative;
  z-index: 2;
  margin-top: -3rem;
  border-radius: 20px;
  box-shadow: 0 18px 44px rgba(18, 36, 52, 0.18);
  row-gap: 1rem;
}
.ssk-partner-card .ssk-overline { margin: 0; white-space: nowrap; }
.ssk-partner-card .ssk-partner-logos { row-gap: 1rem; }
.ssk-partner-card .ssk-partner-logo img { filter: grayscale(1); opacity: 0.75; transition: 0.2s; }
.ssk-partner-card .ssk-partner-logo:hover img { filter: none; opacity: 1; }

/* Schwebender WhatsApp-Button */
.ssk-wa-float {
  position: fixed;
  right: 1rem;
  bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
  z-index: 60;
  margin: 0;
}
.ssk-wa-float .wp-block-social-link { box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28); }
.ssk-wa-float .wp-block-social-link:hover { transform: scale(1.05); }

@media (max-width: 781px) {
  .ssk-hero--cover.ssk-hero--v3 {
    min-height: min(90svh, 820px);
    background-position: 50% 18% !important;
    padding-top: var(--wp--preset--spacing--70) !important;
    padding-bottom: var(--wp--preset--spacing--80) !important;
  }
  .ssk-hero--v3::before {
    background: linear-gradient(180deg, rgba(16, 20, 26, 0.3) 0%, rgba(16, 20, 26, 0.5) 35%, rgba(16, 20, 26, 0.9) 100%);
  }
  .ssk-temp { font-size: clamp(4.5rem, 24vw, 6.5rem); }
  .ssk-slogan { font-size: clamp(1.9rem, 8vw, 2.4rem); margin-top: 1.25rem; }
  .ssk-hero__content--center h1.ssk-hero__h1 { font-size: 0.95rem; }
  .ssk-hero__price { font-size: 1rem; }
  .ssk-hero__actions { flex-direction: column; gap: 0.9rem; }
  .ssk-hero__actions .wp-block-buttons,
  .ssk-hero__actions .wp-block-button,
  .ssk-hero__actions .wp-block-button__link { width: 100%; }
  .ssk-hero__actions .wp-block-button__link { text-align: center; }
  .ssk-trust { font-size: 0.78rem; }
  .ssk-partner-card { margin-top: -2.25rem; padding-left: 1.25rem !important; padding-right: 1.25rem !important; justify-content: center; }
  .ssk-partner-card .ssk-partner-logos { column-gap: 1.25rem; }
  .ssk-partner-card .ssk-partner-logo img { height: 22px !important; }
  .ssk-wa-float { right: 0.75rem; bottom: calc(0.9rem + env(safe-area-inset-bottom, 0px)); }
}

/* ---------- Text-Helfer ---------- */
.ssk-eyebrow {
  margin: 0 0 0.5rem;
  color: var(--wp--preset--color--primary);
  font-weight: 800;
  font-size: 0.9rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.ssk-eyebrow--light { color: var(--wp--preset--color--sky); }
.ssk-overline {
  font-size: 0.9rem !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wp--preset--color--muted);
  margin-bottom: 1.25rem;
}
.ssk-lead { font-size: var(--wp--preset--font-size--large); color: var(--wp--preset--color--gray); }
.ssk-section-head { max-width: 760px; }
.ssk-section-head h2 { margin-top: 0; }

/* ---------- Chips (Hero) ---------- */
.ssk-chips { gap: 0.6rem; margin-top: 0.5rem; }
.ssk-chip {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: #fff;
  border: 1px solid var(--wp--preset--color--line);
  border-radius: 999px;
  padding: 0.45rem 0.9rem;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--wp--preset--color--slate);
}
.ssk-chip::before,
.ssk-check li::before {
  content: "";
  display: inline-block;
  width: 1.05rem;
  height: 1.05rem;
  flex: 0 0 1.05rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231270AB' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5L20 7'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* ---------- Bilder ---------- */
.ssk-foto img { border-radius: 16px; width: 100%; }
.ssk-foto-fill { height: 100%; margin: 0; }
.ssk-foto-fill img { height: 100%; object-fit: cover; min-height: 320px; }
.ssk-hero-grid { gap: 1rem; }
.ssk-hero-grid .wp-block-image { margin: 0; }
.ssk-hero-grid .wp-block-image img { border-radius: 16px; width: 100%; }
.ssk-banner img { width: 100%; height: auto; border-radius: 20px; display: block; }
.ssk-portrait img { border-radius: 16px; }

/* ---------- Karten ---------- */
.ssk-card { border: 1px solid #E3EBF2; border-radius: 16px; }
.ssk-card h3 { margin-top: 0; }
.ssk-card--row { gap: 1.25rem; align-items: flex-start; }
.ssk-card--row > .wp-block-group { min-width: 0; flex: 1 1 0; }
.ssk-card--dark { border-color: transparent; }
.ssk-card--dark h3 { color: #fff; }
.ssk-card--dark p { color: #C9D1DB; }
@media (max-width: 480px) {
  .ssk-card--row.ssk-card--row { flex-direction: column; }
}
.ssk-icon {
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: var(--wp--preset--color--primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ssk-icon svg { width: 24px; height: 24px; display: block; }
.ssk-icon--round { flex-basis: 44px; width: 44px; height: 44px; border-radius: 999px; margin-bottom: 0.25rem; }
.ssk-icon--round svg { width: 22px; height: 22px; }
.ssk-check { padding-left: 0 !important; margin-top: 0.75rem; }
.ssk-check li { list-style: none; display: flex; gap: 0.6rem; align-items: flex-start; font-weight: 600; color: var(--wp--preset--color--slate); }
.ssk-check li::before { margin-top: 0.2rem; }
.ssk-step-num {
  margin: 0;
  font-size: 2.5rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--wp--preset--color--primary);
}
.ssk-cta-box { border: 1px solid #E3EBF2; border-radius: 16px; background: #fff; row-gap: 1rem; }
.ssk-cta-box p { margin: 0; }
.ssk-cta-box .wp-block-buttons { margin: 0; }
.ssk-dark h2 { color: #fff; }
.ssk-partner { border-bottom: 1px solid #EDF2F6; }
.ssk-partner-logos { row-gap: 1.5rem; }
.ssk-partner-logo { margin: 0; }
.ssk-partner-logo img { width: auto; }

/* ---------- Kontakt-Karte & Formular ---------- */
.ssk-contact-card { border-radius: 16px; }
.ssk-contact-card p { margin: 0; }
.ssk-form-card {
  border: 1px solid var(--wp--preset--color--line);
  border-radius: 20px;
  background: #fff;
  box-shadow: var(--wp--preset--shadow--card);
}
.ssk-form-card h2, .ssk-form-card h3 { margin-top: 0; }

.wpcf7 form { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem 1.25rem; }
.wpcf7 form > p { margin: 0; }
.wpcf7 form > p:has(textarea),
.wpcf7 form > p:has(.wpcf7-submit),
.wpcf7 form > p:last-of-type,
.wpcf7 form > .wpcf7-response-output { grid-column: 1 / -1; }
.wpcf7 form label { display: block; font-size: 0.9rem; font-weight: 700; color: var(--wp--preset--color--slate); }
.wpcf7 form label br { display: none; }
.wpcf7-form-control-wrap { display: block; margin-top: 0.35rem; }
.wpcf7 .wpcf7-form-control:not(.wpcf7-submit):not(.wpcf7-acceptance):not(.wpcf7-checkbox):not(.wpcf7-radio) {
  width: 100%;
  box-sizing: border-box;
  font: inherit;
  font-size: 1rem;
  padding: 0.75rem 0.9rem;
  border: 1.5px solid #C7D5E1;
  border-radius: 10px;
  background: #fff;
  color: var(--wp--preset--color--contrast);
}
.wpcf7 .wpcf7-form-control:focus { outline: 2px solid var(--wp--preset--color--primary); outline-offset: 1px; border-color: var(--wp--preset--color--primary); }
.wpcf7 textarea.wpcf7-form-control { min-height: 9rem; resize: vertical; }
.wpcf7 .wpcf7-submit {
  font: inherit;
  font-weight: 800;
  font-size: 1rem;
  background: var(--wp--preset--color--primary);
  color: #fff;
  border: 0;
  border-radius: 10px;
  padding: 0.9rem 1.75rem;
  cursor: pointer;
}
.wpcf7 .wpcf7-submit:hover, .wpcf7 .wpcf7-submit:focus { background: var(--wp--preset--color--primary-dark); }
.wpcf7 .wpcf7-spinner { margin: 0 0 0 0.75rem; }
.wpcf7 form .wpcf7-response-output { margin: 0; border-radius: 10px; padding: 0.75rem 1rem; border: 2px solid var(--wp--preset--color--primary); }
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.failed .wpcf7-response-output { border-color: #c0392b; }
.wpcf7 form.sent .wpcf7-response-output { border-color: #1e8a4c; }
.wpcf7-not-valid-tip { font-size: 0.85rem; color: #c0392b; margin-top: 0.25rem; }

/* ---------- Produktübersicht (Innengeräte) ---------- */
.ssk-series { border-radius: 20px; }
.ssk-series h2 { margin-top: 0; }
.ssk-brand-logo { margin: 0 0 0.5rem; }
.ssk-brand-logo img { height: 40px; width: auto; }
.ssk-products { gap: 1.25rem; }
.ssk-product { margin: 0; background: #fff; border: 1px solid #E3EBF2; border-radius: 16px; padding: 1rem; }
.ssk-product img { width: 100%; height: auto; }
.ssk-product figcaption { margin: 0.75rem 0 0; font-size: 0.9rem; font-weight: 800; letter-spacing: 0.02em; color: var(--wp--preset--color--slate); }
.ssk-series .wp-block-buttons { margin-top: 0.5rem; }

/* ---------- Seitenkopf & Footer ---------- */
.ssk-page-header h1 { margin: 0; }
.ssk-page-header .wp-block-post-date { margin-top: 0.75rem; }
.ssk-footer p { margin: 0; }
.ssk-footer .wp-block-navigation-item__content { padding: 0.5rem 0.75rem; }
.ssk-footer .wp-block-separator { margin: 1.5rem 0; }

/* Handy: Logo, Burger und Button in einer Zeile */
@media (max-width: 599px) {
  .ssk-header__nav { flex-wrap: nowrap !important; }
  .ssk-header .ssk-button-small.ssk-button-cta .wp-block-button__link {
    font-size: 0.82rem;
    padding: 0.62rem 0.95rem;
    white-space: nowrap;
    letter-spacing: 0;
  }
}
@media (max-width: 359px) {
  .wp-block-site-logo.ssk-logo img { width: 128px; }
  .ssk-header .ssk-button-small.ssk-button-cta .wp-block-button__link { font-size: 0.76rem; padding: 0.55rem 0.75rem; }
}

/* ---------- Icons per CSS (überleben jeden Editor-Filter) ---------- */
.ssk-icon:empty::before {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: var(--ssk-icon) no-repeat center / contain;
  mask: var(--ssk-icon) no-repeat center / contain;
}
.ssk-icon--round:empty::before { width: 22px; height: 22px; }
.ssk-icon--klima { --ssk-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='9' rx='2'/%3E%3Cpath d='M6 14v2M12 14v3M18 14v2M6 9h12'/%3E%3C/svg%3E"); }
.ssk-icon--waerme { --ssk-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 3c0 3-3 4-3 8a7 7 0 0 0 14 0c0-4-3-5-3-8'/%3E%3Cpath d='M12 21v-4M9 13a3 3 0 0 0 6 0'/%3E%3C/svg%3E"); }
.ssk-icon--kaelte { --ssk-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2v20M4 6l16 12M4 18 20 6M9 4l3 2 3-2M9 20l3-2 3 2'/%3E%3C/svg%3E"); }
.ssk-icon--check { --ssk-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5L20 7'/%3E%3C/svg%3E"); }

/* Handy: große Einleitungstexte etwas zurücknehmen, Footer-Links linksbündig */
@media (max-width: 599px) {
  .ssk-main p.has-large-font-size { font-size: 1.0625rem !important; line-height: 1.55; }
  .ssk-footer .ssk-footer-nav,
  .ssk-footer .ssk-footer-nav .wp-block-navigation__container { justify-content: flex-start; --navigation-layout-justify: flex-start; }
  .ssk-footer .ssk-footer-nav .wp-block-navigation-item__content { padding-left: 0; }
}

/* Kartenüberschriften: lange Wörter (Komplettservice, Kontaktaufnahme) nie abschneiden */
.ssk-card h3.wp-block-heading {
  font-size: 1.125rem !important;
  line-height: 1.25;
  hyphens: auto;
  -webkit-hyphens: auto;
  overflow-wrap: break-word;
}
.ssk-card--row h3.wp-block-heading { font-size: 1.25rem !important; }

/* ---------- Landingpages (1.4) ---------- */
.ssk-lp-intro { margin-bottom: var(--wp--preset--spacing--50); }
.ssk-lp-intro .ssk-lead { max-width: 780px; margin-top: 0; }
.ssk-main .wp-block-column > h2 { margin-top: 2.25rem; }
.ssk-main .wp-block-column > h2:first-child { margin-top: 0; }
.ssk-lp-section { margin-top: var(--wp--preset--spacing--70) !important; }
.ssk-lp-section > h2:first-child { margin-top: 0; }
.ssk-lp-side { position: sticky; top: 8rem; }
.ssk-lp-side h3 { margin-top: 0; }
.ssk-lp-photos { gap: 1rem; }
.ssk-lp-photos .wp-block-image { margin: 0; }
.ssk-lp-photos img { width: 100%; border-radius: 14px; }
.ssk-steps { counter-reset: ssk-step; list-style: none; padding-left: 0 !important; }
.ssk-steps li { counter-increment: ssk-step; display: flex; gap: 0.85rem; align-items: center; margin: 0.65rem 0; font-weight: 600; }
.ssk-steps li::before {
  content: counter(ssk-step);
  flex: 0 0 2rem; height: 2rem; border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--wp--preset--color--primary); color: #fff; font-weight: 800; font-size: 0.95rem;
}
.ssk-hero__price a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.ssk-hero__price a:hover { color: #fff; }
.ssk-footer-links { margin-top: 1.25rem !important; margin-bottom: 0 !important; color: var(--wp--preset--color--gray); }
.ssk-footer-links a { color: var(--wp--preset--color--slate); font-weight: 700; }
@media (max-width: 781px) {
  .ssk-lp-side { position: static; }
  .ssk-lp-photos { gap: 0.6rem; }
}

/* Handy: Header-Button auch in Großbuchstaben einzeilig */
@media (max-width: 599px) {
  .ssk-header .ssk-button-small .wp-block-button__link { font-size: 0.74rem; padding: 0.6rem 0.8rem; white-space: nowrap; letter-spacing: 0.02em; }
}
@media (max-width: 359px) {
  .ssk-header .ssk-button-small .wp-block-button__link { font-size: 0.68rem; padding: 0.55rem 0.65rem; }
}

/* ---------- Angebots-Pop-up (1.5) ---------- */
.ssk-popup[hidden] { display: none; }
.ssk-popup {
  position: fixed; inset: 0; z-index: 100;
  display: flex; align-items: center; justify-content: center;
  padding: 1rem; opacity: 0; transition: opacity 0.25s ease;
}
.ssk-popup.is-open { opacity: 1; }
.ssk-popup__backdrop { position: absolute; inset: 0; background: rgba(16, 20, 26, 0.62); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
.ssk-popup__box { position: relative; transform: translateY(14px) scale(0.98); transition: transform 0.25s ease; }
.ssk-popup.is-open .ssk-popup__box { transform: none; }
.ssk-popup__link { display: block; border-radius: 18px; overflow: hidden; box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45); }
.ssk-popup__link img { display: block; width: auto; height: auto; max-width: min(92vw, 480px); max-height: calc(100vh - 4rem); max-height: calc(100svh - 4rem); }
.ssk-popup__close {
  position: absolute; top: -0.9rem; right: -0.9rem; z-index: 1;
  width: 2.75rem; height: 2.75rem; border: 0; border-radius: 999px;
  background: #fff; color: #1A1A1A; font: 400 1.75rem/1 system-ui, sans-serif; cursor: pointer;
  display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3);
}
.ssk-popup__close:focus-visible { outline: 3px solid var(--wp--preset--color--sky); outline-offset: 2px; }
html.ssk-popup-lock { overflow: hidden; }
@media (max-width: 599px) { .ssk-popup__close { top: 0.6rem; right: 0.6rem; } }
@media (prefers-reduced-motion: reduce) { .ssk-popup, .ssk-popup__box { transition: none; } }

/* ---------- Preisrechner (1.6) ---------- */
.ssk-calc { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 2.5rem; align-items: start; margin-top: var(--wp--preset--spacing--50) !important; }
.ssk-calc__label { margin: 0 0 0.6rem; font-size: 0.82rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.ssk-calc__tiers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.6rem; margin-bottom: 1.75rem; }
.ssk-calc__tiers button { font: inherit; text-align: left; cursor: pointer; padding: 0.85rem 0.95rem; border-radius: 12px; border: 1.5px solid var(--wp--preset--color--line); background: #fff; color: var(--wp--preset--color--contrast); display: flex; flex-direction: column; gap: 0.15rem; }
.ssk-calc__tiers button strong { font-size: 1.05rem; font-weight: 800; }
.ssk-calc__tiers button span { font-size: 0.85rem; color: var(--wp--preset--color--muted); }
.ssk-calc__tiers button[aria-checked="true"] { border-color: var(--wp--preset--color--primary); background: var(--wp--preset--color--ice); box-shadow: inset 0 0 0 1px var(--wp--preset--color--primary); }
.ssk-calc__tiers button[aria-checked="true"] strong { color: var(--wp--preset--color--primary); }
.ssk-calc__count { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 1.75rem; }
.ssk-calc__count button { font: inherit; font-size: 1.35rem; line-height: 1; width: 2.75rem; height: 2.75rem; border-radius: 999px; border: 1.5px solid var(--wp--preset--color--line); background: #fff; color: var(--wp--preset--color--contrast); cursor: pointer; }
.ssk-calc__count button:hover { border-color: var(--wp--preset--color--primary); color: var(--wp--preset--color--primary); }
.ssk-calc__count output { font-size: 1.3rem; font-weight: 800; min-width: 1.5rem; text-align: center; }
.ssk-calc__count label { margin-left: auto; display: flex; align-items: center; gap: 0.5rem; font-size: 0.95rem; color: var(--wp--preset--color--gray); cursor: pointer; }
.ssk-calc__count input { width: 1.15rem; height: 1.15rem; accent-color: var(--wp--preset--color--primary); }
.ssk-calc__room { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr) 4.5rem; align-items: center; gap: 0.75rem; margin: 0.4rem 0; }
.ssk-calc__room label { font-weight: 700; font-size: 0.95rem; }
.ssk-calc__room input[type=range] { width: 100%; height: 2.25rem; accent-color: var(--wp--preset--color--primary); cursor: pointer; }
.ssk-calc__room output { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.ssk-calc__result { background: var(--wp--preset--color--ice); border-radius: 20px; padding: 1.75rem; position: sticky; top: 8rem; }
.ssk-calc__result ul { list-style: none; margin: 0; padding: 0; }
.ssk-calc__result li { display: flex; justify-content: space-between; gap: 1rem; padding: 0.55rem 0; border-bottom: 1px solid rgba(18, 112, 171, 0.15); font-size: 0.95rem; }
.ssk-calc__result li span:last-child { font-weight: 700; white-space: nowrap; }
.ssk-calc__ab { margin: 1.25rem 0 0; color: var(--wp--preset--color--gray); }
.ssk-calc__ab[hidden] { display: none; }
.ssk-calc__total { margin: 0; font-size: clamp(2.2rem, 5vw, 3rem); font-weight: 800; line-height: 1.05; letter-spacing: -0.02em; color: var(--wp--preset--color--primary); font-variant-numeric: tabular-nums; }
.ssk-calc__note { margin: 0.4rem 0 0.9rem; font-weight: 600; }
.ssk-calc__small { margin: 0 0 1.25rem; font-size: 0.85rem; color: var(--wp--preset--color--gray); }
.ssk-calc__cta { width: 100%; cursor: pointer; }
.wpcf7, .wpcf7 form { scroll-margin-top: 8rem; }
@media (max-width: 781px) {
  .ssk-calc { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .ssk-calc__result { position: static; padding: 1.4rem; }
  .ssk-calc__tiers { gap: 0.45rem; }
  .ssk-calc__tiers button { padding: 0.7rem 0.6rem; }
  .ssk-calc__tiers button span { font-size: 0.75rem; }
  .ssk-calc__count label { margin-left: 0; width: 100%; }
}


/* ---------- 1.6.8 ---------- */
/* Tablet und kleine Laptops (600–1279 px): Menü-Button statt mehrerer Zeilen Navigation */
@media (min-width: 600px) and (max-width: 1279px) {
  .ssk-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
  .ssk-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
  .ssk-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { align-items: flex-start; }
}
/* Impressum und Datenschutz: angenehme Zeilenlänge */
.ssk-legal .wp-block-post-content > .alignfull { max-width: 880px; margin-left: auto !important; margin-right: auto !important; }
/* Innengeräte: Serien-Überschrift und zwei Karten pro Zeile am Handy */
.ssk-series-title { margin: 0.9rem 0 1.25rem !important; font-size: clamp(1.15rem, 2.2vw, 1.4rem); }
@media (max-width: 599px) {
  .ssk-products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 0.6rem !important; }
  .ssk-product { padding: 0.6rem !important; border-radius: 12px; }
  .ssk-product figcaption { font-size: 0.72rem; letter-spacing: 0; }
  .ssk-product .wp-block-button__link { font-size: 0.7rem; padding: 0.4rem 0.6rem; }
  .ssk-series { padding: 1.25rem 0.9rem !important; }
}

/* ---------- Über uns (1.6.9) ---------- */
.ssk-about-intro { margin-top: var(--wp--preset--spacing--40) !important; }
.ssk-portrait img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 20px; box-shadow: 0 18px 40px rgba(15, 23, 42, 0.14); }
.ssk-portrait figcaption { text-align: left; margin-top: 0.9rem; font-size: 0.95rem; color: var(--wp--preset--color--gray); }
.ssk-portrait figcaption strong { color: var(--wp--preset--color--contrast); font-size: 1.08rem; }
.ssk-placeholder { background: #FFF4C2; border: 1px dashed #D9A900; border-radius: 10px; padding: 0.75rem 1rem; font-size: 0.95rem; }
.ssk-fact { border-left: 3px solid var(--wp--preset--color--primary); padding: 0.15rem 0 0.15rem 1rem; }
.ssk-fact__title { margin: 0 !important; font-weight: 800; font-size: 1.12rem; color: var(--wp--preset--color--contrast); }
.ssk-fact__text { margin: 0.35rem 0 0 !important; font-size: 0.95rem; color: var(--wp--preset--color--gray); }
.ssk-about-gallery img { border-radius: 12px; }
.ssk-about-partners .ssk-partner-logos { margin-top: 1rem; }
.ssk-about-partners .ssk-partner-logo img { width: auto; opacity: 0.85; transition: opacity .2s; }
.ssk-about-partners .ssk-partner-logo img:hover { opacity: 1; }
@media (max-width: 781px) { .ssk-portrait { max-width: 420px; } }

/* ---------- Cookie-Banner (iubenda) im SSK-Design ----------
   Hintergrund- und Textfarbe setzt iubenda selbst (Dashboard) – hier nur Form, Schrift und Buttons,
   alles so, dass es auf dunklem und hellem Banner funktioniert. */
#iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-container { max-width: 1000px !important; margin: 0 auto 18px !important; padding: 0 16px !important; }
#iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-content {
  border: 1px solid rgba(127, 127, 127, 0.18) !important; border-radius: 20px !important;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.22) !important;
  font-family: var(--wp--preset--font-family--manrope, system-ui), system-ui, sans-serif !important;
}
#iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-rationale { padding: 1.4rem 1.6rem 1.25rem !important; max-width: none !important; }
#iubenda-cs-banner#iubenda-cs-banner .iubenda-banner-content::before {
  content: "Cookies & Datenschutz"; display: block; margin-bottom: 0.5rem; font-weight: 800; font-size: 1.05rem; color: inherit;
}
#iubenda-cs-banner#iubenda-cs-banner .iubenda-banner-content,
#iubenda-cs-banner#iubenda-cs-banner #iubenda-cs-paragraph,
#iubenda-cs-banner#iubenda-cs-banner .iub-p { font-family: inherit !important; font-size: 0.86rem !important; line-height: 1.55 !important; }
#iubenda-cs-banner#iubenda-cs-banner .iubenda-banner-content a { color: inherit !important; text-decoration: underline !important; opacity: 1 !important; }
#iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-opt-group { margin-top: 1rem !important; }
#iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-opt-group button {
  font-family: inherit !important; font-weight: 700 !important; font-size: 0.9rem !important; letter-spacing: 0 !important;
  border-radius: 999px !important; padding: 0.7rem 1.4rem !important; box-shadow: none !important;
}
/* Ablehnen und Zustimmen absichtlich gleich gestaltet (gleichwertige Wahl) */
#iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-opt-group .iubenda-cs-btn-primary {
  background-color: #1270AB !important; color: #fff !important; border: 1.5px solid #1270AB !important;
}
#iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-opt-group .iubenda-cs-btn-primary:hover { background-color: #0E5A8A !important; border-color: #0E5A8A !important; }
/* „Mehr erfahren": iubenda färbt die Button-Zeile fest ein – daher hell auf dunklem und dunkel auf weißem Banner */
#iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-opt-group .iubenda-cs-customize-btn {
  background-color: transparent !important; color: #fff !important; border: 1.5px solid rgba(255, 255, 255, 0.85) !important;
}
#iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-opt-group .iubenda-cs-customize-btn:hover { border-color: #fff !important; }
#iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-content[style*="background-color: #fff" i] .iubenda-cs-customize-btn,
#iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-content[style*="background-color:#fff" i] .iubenda-cs-customize-btn {
  background-color: transparent !important; color: #1270AB !important; border-color: #1270AB !important;
}
#iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-content[style*="background-color: #fff" i] .iubenda-cs-customize-btn:hover,
#iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-content[style*="background-color:#fff" i] .iubenda-cs-customize-btn:hover {
  background-color: #EAF3FA !important; color: #0E5A8A !important; border-color: #0E5A8A !important;
}
#iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-close-btn { background-color: transparent !important; color: inherit !important; opacity: 0.6 !important; }
#iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-close-btn:hover { opacity: 1 !important; }
/* Der WhatsApp-Button würde den Banner überdecken – solange der Banner offen ist, ausblenden */
body:has(#iubenda-cs-banner.iubenda-cs-visible) .ssk-wa-float { opacity: 0 !important; pointer-events: none !important; }
@media (max-width: 639px) {
  #iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-container { margin: 0 !important; padding: 0 !important; }
  #iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-content { border-radius: 20px 20px 0 0 !important; border-bottom: 0 !important; }
  #iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-rationale { padding: 1.2rem 1.1rem 1rem !important; }
  #iubenda-cs-banner#iubenda-cs-banner .iubenda-cs-opt-group button { width: 100% !important; margin: 0.25rem 0 !important; }
}

/* ---------- Seite im iubenda-Fenster (Cookie-Richtlinie aus dem Banner) ----------
   iubenda öffnet die Cookie-Richtlinie in einem eigenen Fenster mit IFrame. Dort soll nur der Text stehen:
   kein zweiter Cookie-Banner, kein Header/Footer, kein WhatsApp-Button. */
.ssk-in-frame #iubenda-cs-banner,
.ssk-in-frame .iubenda-tp-btn,
.ssk-in-frame .ssk-wa-float,
.ssk-in-frame #ssk-popup,
.ssk-in-frame .wp-site-blocks > header,
.ssk-in-frame .wp-site-blocks > footer { display: none !important; }