/* ==========================================================================
   Dare Solutions IT – WordPress-Ergänzungen
   theme.css ist die unveränderte Gestaltung aus Designentwurf 03b. Hier stehen nur
   Anpassungen an WordPress: Admin-Leiste, hochgeladenes Logo, Blöcke aus dem Editor,
   Widgets, Kommentare, Formular-Meldungen und Hilfsklassen.
   ========================================================================== */

/* Obere Leiste ausgeblendet (Customizer) */
.no-topbar { --topbar-h: 0px; --hdr-gap: 0px; }
.no-topbar .topbar { display: none; }

/* Admin-Leiste (angemeldet): klebende Navigation darunter */
.admin-bar .site-header { top: calc(12px - var(--hdr-inset) - var(--topbar-h) - var(--hdr-gap) + 32px); }
.admin-bar .offcanvas__panel { top: calc(var(--frame) + 32px); }
.admin-bar .search-overlay__panel { margin-top: calc(var(--frame) + 32px); }
@media screen and (max-width: 782px) {
  .admin-bar .site-header { top: calc(12px - var(--hdr-inset) - var(--topbar-h) - var(--hdr-gap) + 46px); }
  .admin-bar .offcanvas__panel { top: calc(var(--frame) + 46px); }
  .admin-bar .search-overlay__panel { margin-top: calc(var(--frame) + 46px); }
}
@media screen and (max-width: 600px) {
  /* Die Admin-Leiste scrollt hier mit */
  .admin-bar .site-header { top: calc(12px - var(--hdr-inset) - var(--topbar-h) - var(--hdr-gap)); }
}

/* Hochgeladenes Logo (Design → Customizer → Website-Informationen) */
.custom-logo-link { display: inline-flex; flex: none; align-items: center; }
.custom-logo { width: auto; max-width: 240px; height: auto; max-height: 56px; }
@media (max-width: 767px) {
  .custom-logo { max-width: 180px; max-height: 44px; }
}

/* Seitenleiste läuft beim Scrollen mit (ab 961 px; Verankerung setzt theme.js) */
@media screen and (min-width: 961px) {
  .layout > .sidebar.is-sticky { position: sticky; }
}
@media print {
  .layout > .sidebar { position: static !important; top: auto !important; bottom: auto !important; margin-top: 0 !important; margin-bottom: 0 !important; align-self: auto !important; }
}

/* Seitenleiste: Ansprechpartner-Box (statt Schnellkontakt und Hinweiskarte) */
.sidebar-person { padding: 36px 30px 30px; border-radius: var(--r-card); background: var(--c-surface); }
.sidebar-person__head { display: flex; align-items: center; gap: 18px; margin-bottom: 18px; }
.sidebar-person__img { flex: none; width: 88px; height: 88px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 4px #fff, 0 0 0 6px var(--c-accent-light); }
.sidebar-person__name { margin: 0 0 4px; color: var(--c-heading); font-family: var(--font-head); font-size: 1.25rem; font-weight: 600; line-height: 1.25; }
.sidebar-person__role { margin: 0; color: var(--c-muted); font-size: .875rem; font-weight: 600; line-height: 1.45; }
.sidebar-person__role span { display: block; }
.sidebar-person__text { margin: 0 0 22px; font-size: .9375rem; line-height: 1.65; }
.sidebar-person__actions { display: grid; gap: 12px; }
@media (min-width: 961px) and (max-width: 1100px) {
  .sidebar-person { padding: 32px 24px 26px; }
  .sidebar-person__head { gap: 14px; }
  .sidebar-person__img { width: 68px; height: 68px; }
}
@media (max-width: 767px) {
  .sidebar-person { padding: 30px 22px 24px; }
}

/* Standardseite: eine lesefreundliche Spalte */
.layout--single { --container: 900px; grid-template-columns: minmax(0, 1fr); }
.entry--wide .entry-content { max-width: none; }
.archive-intro { margin-bottom: 40px; }
.contact-intro { margin-bottom: 0; }
.contact-intro > :last-child { margin-bottom: 0; }

/* Leere Übersicht, Suche ohne Treffer, 404 */
.empty-state { padding-block: 10px; }
.empty-state h2 { margin-bottom: 14px; }
.empty-state .search-form { max-width: 560px; margin: 28px 0; }
.empty-state__actions { display: flex; flex-wrap: wrap; gap: 14px; }

/* Kontaktformular */
.form-hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.contact-form .form-status { margin: 0 0 22px; }
.form-status--error { background: rgba(240, 88, 58, .1); color: #a3321c; }
.contact-form button[disabled] { opacity: .6; cursor: progress; }

/* WordPress-Standardklassen */
.screen-reader-text:focus {
  top: 16px;
  left: 16px;
  z-index: 1000;
  width: auto;
  height: auto;
  padding: 12px 18px;
  clip: auto !important;
  clip-path: none;
  border-radius: var(--r-btn);
  background: var(--c-dark);
  color: #fff;
  font-weight: 600;
}
.alignleft { float: left; margin: .3em 1.6em 1em 0; }
.alignright { float: right; margin: .3em 0 1em 1.6em; }
.aligncenter { display: block; margin-inline: auto; }
.wp-caption { max-width: 100%; }
.wp-caption-text,
.wp-element-caption,
.gallery-caption { margin-top: 10px; color: var(--c-muted); font-size: .875rem; }
.entry-content .alignwide,
.entry-content .alignfull { width: 100%; max-width: 100%; }
.entry-content::after { content: ""; display: table; clear: both; }
.page-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 32px; font-weight: 700; }
.page-links a,
.page-links > span:not(:first-child) { display: inline-grid; place-items: center; min-width: 40px; height: 40px; border: 1px solid var(--c-line); border-radius: var(--r-btn); }

/* Blöcke aus dem Editor ------------------------------------------------- */
.entry-content .is-style-lead { color: var(--c-heading); font-size: 1.1875rem; font-weight: 600; line-height: 1.6; }
.entry-content .wp-block-image,
.entry-content .wp-block-gallery,
.entry-content .wp-block-columns,
.entry-content .wp-block-group,
.entry-content .wp-block-buttons,
.entry-content .wp-block-embed,
.entry-content .wp-block-cover,
.entry-content .wp-block-file { margin-block: 1.8em; }
.entry-content .wp-block-image img { height: auto; }
.entry-content hr,
.entry-content .wp-block-separator { height: 1px; margin: 2.4em 0; border: 0; background: var(--c-line); }
.entry-content .wp-block-heading:first-child { margin-top: 0; }

/* Buttons im Stil der Pfeil-Buttons */
.entry-content .wp-block-button__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 52px;
  padding: 0 76px 0 24px;
  border: 1px solid var(--c-dark);
  border-radius: var(--r-btn);
  background: transparent;
  color: var(--c-heading);
  font: 600 .9375rem/1.2 var(--font-body);
  text-decoration: none;
  transition: background var(--dur), color var(--dur), border-color var(--dur);
}
.entry-content .wp-block-button__link::after {
  content: "";
  position: absolute;
  top: -1px;
  right: -1px;
  bottom: -1px;
  width: 52px;
  border-radius: var(--r-btn);
  background: var(--c-dark) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E") center / 20px no-repeat;
}
.entry-content .wp-block-button__link:hover,
.entry-content .wp-block-button__link:focus-visible { background: var(--c-dark); color: #fff; }
.entry-content .is-style-accent .wp-block-button__link { border-color: var(--c-accent); background: var(--c-accent); color: #fff; }
.entry-content .is-style-accent .wp-block-button__link::after { background-color: var(--c-accent-hover); }
.entry-content .is-style-accent .wp-block-button__link:hover { border-color: var(--c-accent-hover); background: var(--c-accent-hover); }

/* Gruppen-Stile „Box (hell)“ und „Box (dunkel)“ */
.entry-content .is-style-box,
.entry-content .is-style-box-dark { padding: clamp(26px, 4vw, 44px); border-radius: var(--r-card); }
.entry-content .is-style-box { background: var(--c-surface); }
.entry-content .is-style-box-dark { background: var(--circuit) 0 0 / 260px, var(--c-dark); color: rgba(255, 255, 255, .84); }
.entry-content .is-style-box-dark :is(h2, h3, h4, strong) { color: #fff; }
.entry-content .is-style-box-dark a:not(.wp-block-button__link):not(.btn) { color: var(--c-accent-light); }
/* Überschrift h2 in einer Box: so groß wie die übliche h3 der Boxen */
.entry-content :is(.is-style-box, .is-style-box-dark) > h2.wp-block-heading { margin: 0 0 .5em; font-size: 1.5rem; line-height: 1.2; letter-spacing: -.01em; }
.entry-content .is-style-box > :first-child,
.entry-content .is-style-box-dark > :first-child { margin-top: 0; }
.entry-content .is-style-box > :last-child,
.entry-content .is-style-box-dark > :last-child { margin-bottom: 0; }

/* Häkchen-Liste auch zweispaltig (Muster „Leistungen im Überblick“) */
.entry-content ul.is-style-checks.check-list--2col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 30px; }
.entry-content ul.is-style-checks.check-list--2col li { margin: 0; }
@media (max-width: 767px) {
  .entry-content ul.is-style-checks.check-list--2col { grid-template-columns: minmax(0, 1fr); }
}

/* Tabellen: nur Trennlinien zwischen den Zeilen wie im Editor (WordPress rahmt sonst jede Zelle) */
.entry-content .wp-block-table :is(th, td) { border-width: 0 0 1px; border-style: solid; border-color: var(--c-line); }
.entry-content .wp-block-table thead { border-bottom: 0; }

/* Blockstil „Auf dem Handy untereinander“ (Fristen-Tabellen der Leistungsseiten) */
@media (max-width: 600px) {
  .entry-content .wp-block-table.is-style-stacked thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .entry-content .wp-block-table.is-style-stacked :is(table, tbody, tr, td) { display: block; width: 100%; }
  .entry-content .wp-block-table.is-style-stacked tr { padding: 16px 18px; border-bottom: 1px solid var(--c-line); }
  .entry-content .wp-block-table.is-style-stacked tr:last-child { border-bottom: 0; }
  .entry-content .wp-block-table.is-style-stacked tbody tr:nth-child(even) { background: var(--c-surface); }
  .entry-content .wp-block-table.is-style-stacked td { padding: 0; border: 0; background: transparent; }
  .entry-content .wp-block-table.is-style-stacked td + td { margin-top: 6px; }
  .entry-content .wp-block-table.is-style-stacked td:nth-child(2) { color: var(--c-heading); font-weight: 600; }
  /* Spaltenname über der Zelle (data-label, ergänzt beim Ausgeben, siehe dare_table_stacked_labels) */
  .entry-content .wp-block-table.is-style-stacked td[data-label]::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 2px;
    color: var(--c-muted);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
  }
}
/* Schmale Spalten: lange Wörter trennen statt seitlich zu scrollen – ab vier Spalten immer,
   ab drei Spalten neben der Seitenleiste (961–1279 px); dort am engsten (bis 1100 px) auch weniger Innenabstand */
@media (min-width: 601px) {
  .entry-content .wp-block-table:has(thead th:nth-child(4)) :is(th, td) { hyphens: auto; hyphenate-limit-chars: 12 5 4; }
}
@media (min-width: 961px) and (max-width: 1279px) {
  .entry-content .wp-block-table:has(thead th:nth-child(3)) :is(th, td) { hyphens: auto; hyphenate-limit-chars: 12 5 4; }
}
@media (min-width: 961px) and (max-width: 1100px) {
  .entry-content .wp-block-table:has(thead th:nth-child(3)) :is(th, td) { padding-inline: 12px; }
}

/* Widgets (Design → Widgets, Blöcke) ---------------------------------- */
.widget ul:not([class]),
.widget .wp-block-categories-list,
.widget .wp-block-archives-list,
.widget .wp-block-page-list,
.widget .wp-block-latest-posts__list,
.widget .wp-block-latest-comments { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.widget li a { color: var(--c-heading); font-weight: 600; text-decoration: none; }
.widget li a:hover { color: var(--c-accent); }
.widget h2.wp-block-heading,
.widget .wp-block-search__label { display: block; margin: 0 0 22px; color: var(--c-heading); font-family: var(--font-head); font-size: 1.5rem; font-weight: 500; }
.widget .wp-block-search__inside-wrapper { position: relative; }
.widget .wp-block-search__input { padding-right: 64px; background: #fff; }
.widget .wp-block-search__button {
  position: absolute;
  top: 50%;
  right: 6px;
  min-height: 42px;
  padding: 0 14px;
  border: 0;
  border-radius: var(--r-btn);
  background: var(--c-dark);
  color: #fff;
  font-weight: 600;
  transform: translateY(-50%);
}
.widget .wp-block-tag-cloud,
.widget .tagcloud { display: flex; flex-wrap: wrap; gap: 8px; }
.widget .wp-block-tag-cloud a,
.widget .tagcloud a {
  display: inline-block;
  padding: 7px 14px;
  border: 1px solid var(--c-line);
  border-radius: 8px;
  background: #fff;
  color: var(--c-heading);
  font-size: .875rem !important;
  font-weight: 600;
  text-decoration: none;
}
.widget .wp-block-tag-cloud a:hover,
.widget .tagcloud a:hover { border-color: var(--c-accent); background: var(--c-accent); color: #fff; }

/* Kommentare ------------------------------------------------------------ */
.comments-area { margin-top: 48px; padding-top: 36px; border-top: 1px solid var(--c-line); }
.comment-list { margin: 0 0 36px; padding: 0; list-style: none; }
.comment-list .children { margin: 0; padding-left: clamp(16px, 4vw, 40px); list-style: none; }
.comment-body { padding: 22px 0; border-bottom: 1px solid var(--c-line); }
.comment-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin-bottom: 10px; font-size: .875rem; }
.comment-author { display: flex; align-items: center; gap: 12px; color: var(--c-heading); font-weight: 700; }
.comment-author .avatar { width: 48px; height: 48px; }
.comment-metadata a { color: var(--c-muted); text-decoration: none; }
.comment-content p { margin-bottom: .8em; }
.reply a,
.comment-reply-link { color: var(--c-accent); font-size: .875rem; font-weight: 700; }
.comment-respond { margin-top: 12px; }
.comment-reply-title { font-size: 1.5rem; }
.comment-form p { margin: 0 0 16px; }
.comment-form label { display: block; margin-bottom: 8px; color: var(--c-heading); font-size: .875rem; font-weight: 700; }
.comment-form .comment-form-cookies-consent { display: flex; align-items: flex-start; gap: 10px; }
.comment-form .comment-form-cookies-consent label { margin: 0; font-weight: 500; }
.comment-submit .btn__label { padding: 0 24px; }

/* Über uns: zweiter Absatz, Stichpunkte, Hinweis am Pfeil-Button ------- */
.about__lead:has(+ .about__text) { margin-bottom: 16px; }
.about__text { max-width: 540px; margin: 0 0 26px; }
.about__points { max-width: 560px; margin: 0 0 36px; color: var(--c-heading); font-size: .975rem; font-weight: 600; }
.about__points li { line-height: 1.45; }
@media (max-width: 600px) {
  .about__points.check-list--2col { grid-template-columns: minmax(0, 1fr); }
}
.notched__cta {
  position: absolute;
  right: 28px;
  bottom: 28px;
  left: 28px;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 18px;
  color: #fff;
  text-decoration: none;
}
.notched__cta .notched__badge { position: relative; right: auto; bottom: auto; flex: none; }
.notched__cta:hover .notched__badge { background: var(--c-accent-hover); transform: scale(1.06); }
.notched__note {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  padding: 14px 20px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 18px;
  background: rgba(17, 27, 34, .55);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .25);
  transition: background .3s, border-color .3s;
}
.notched__note strong { color: #fff; font-family: var(--font-head); font-size: 1.0625rem; font-weight: 600; line-height: 1.25; }
.notched__note span { color: rgba(255, 255, 255, .8); font-size: .875rem; line-height: 1.4; }
.notched__cta:hover .notched__note { border-color: rgba(76, 195, 238, .5); background: rgba(17, 27, 34, .72); }
.notched__cta:focus-visible { outline: none; }
.notched__cta:focus-visible .notched__note { outline: 3px solid var(--c-accent-light); outline-offset: 3px; }
@media (max-width: 767px) {
  .notched__cta { right: 18px; bottom: 18px; left: 18px; gap: 12px; }
  .notched__note { padding: 10px 14px; border-radius: 14px; }
  .notched__note strong { font-size: .95rem; }
}
@media (max-width: 480px) {
  .notched__note span { display: none; }
}

/* ------------------------------------------------------------------ */
/* Branchen: Kundenlogos über „Mehr erfahren“                          */
/* ------------------------------------------------------------------ */
.industry-card__clients { margin-top: auto; padding-bottom: 20px; }
.industry-card__clients + .industry-card__foot { margin-top: 0; }
.industry-card__clients-title { display: block; margin-bottom: 10px; color: var(--c-muted); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.industry-card__logos { display: flex; gap: 8px; margin: 0; padding: 0; list-style: none; }
.industry-card__logos li { display: flex; flex: none; align-items: center; justify-content: center; width: 116px; height: 56px; padding: 8px 10px; border-radius: 8px; background: #fff; }
.industry-card__logos li.is-dark { background: var(--c-dark); }
.industry-card__logos img { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; }

/* Branchen als Karussell wie die Leistungen: drei Karten je Ansicht (≤ 1100 px zwei, Handy eine), Pfeile mittig darunter */
.industries__carousel .carousel__controls { position: static; display: flex; justify-content: center; gap: 12px; margin-top: 28px; }
.industries__carousel .carousel__controls .icon-btn { position: static; transform: none; }
.industries__carousel .industry-card { height: 100%; }
/* Kundenlogos: bis drei stehen, ab vier laufen sie als Band (gleiches Tempo, Pause beim Zeigen auf die Karte) */
.logo-run { overflow: hidden; }
.logo-run__track { display: flex; width: max-content; }
.logo-run:not(.logo-run--moving) .logo-run__track { width: auto; }
.logo-run:not(.logo-run--moving) .industry-card__logos { flex-wrap: wrap; }
.logo-run--moving { -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.logo-run--moving .industry-card__logos { padding-right: 8px; }
.logo-run--moving .logo-run__track { animation: marquee calc(var(--n, 6) * 3s) linear infinite; }
.industry-card:hover .logo-run__track { animation-play-state: paused; }

/* Kundenlogos auf Seiten ([dare_kundenlogos]): weiße Kacheln mit Rand, Pause beim Zeigen auf das Band */
.logo-run--page { margin-block: 8px 36px; }
.logo-run--page .industry-card__logos li { width: 148px; height: 72px; border: 1px solid var(--c-line); }
.logo-run--page:hover .logo-run__track { animation-play-state: paused; }

/* ------------------------------------------------------------------ */
/* Über uns, breite Kacheln: oben eine Mini-Grafik wie in den schmalen */
/* Kacheln (Karte 196 px, Themen 158 px – minus 4 px mehr Innenabstand), */
/* damit die Überschriften je Reihe auf einer Linie stehen.             */
/* ------------------------------------------------------------------ */
.bento-tile--wide .bento-tile__body { align-self: start; }
.mini-versus,
.mini-alert { position: relative; display: flex; flex-direction: column; justify-content: center; margin-bottom: 28px; border-radius: 20px; }

.mini-versus { height: 192px; gap: 14px; padding: 18px 20px; border: 1px solid var(--c-line-dark); background: rgba(255, 255, 255, .05); }
.mini-versus__row { position: relative; display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: center; gap: 12px; }
.mini-versus__row + .mini-versus__row::before { content: ""; position: absolute; top: -14px; left: 14px; height: 14px; border-left: 2px dotted var(--c-line-dark); }
.mini-versus__icon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; }
.mini-versus__icon .icon { width: 15px; height: 15px; }
.mini-versus__row strong { display: block; font-family: var(--font-head); font-size: 1rem; font-weight: 600; line-height: 1.3; }
.mini-versus__row small { display: block; margin-top: 2px; font-size: .8125rem; line-height: 1.35; }
.mini-versus__row.is-off .mini-versus__icon { background: rgba(255, 255, 255, .08); color: rgba(255, 255, 255, .5); }
.mini-versus__row.is-off strong { color: rgba(255, 255, 255, .5); text-decoration: line-through; text-decoration-color: rgba(255, 255, 255, .45); }
.mini-versus__row.is-off small { color: rgba(255, 255, 255, .4); }
.mini-versus__row.is-on .mini-versus__icon { background: var(--c-accent); color: #fff; }
.mini-versus__row.is-on strong { color: #fff; }
.mini-versus__row.is-on small { color: rgba(255, 255, 255, .75); }

.mini-alert { height: 154px; gap: 14px; padding: 18px 20px; background: #fff; }
.mini-alert__row { position: relative; display: grid; grid-template-columns: 28px auto minmax(0, 1fr); align-items: center; gap: 10px; font-size: .875rem; }
.mini-alert__row + .mini-alert__row::before { content: ""; position: absolute; top: -14px; left: 13px; height: 14px; border-left: 2px dotted var(--c-line); }
.mini-alert__icon { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; }
.mini-alert__icon .icon { width: 15px; height: 15px; }
.mini-alert__row.is-warn .mini-alert__icon { background: #fff4dc; color: #b26a00; }
.mini-alert__row.is-ok .mini-alert__icon { background: var(--c-accent-soft); color: var(--c-accent); }
.mini-alert__time { color: var(--c-muted); font-weight: 700; font-variant-numeric: tabular-nums; }
.mini-alert__text { color: var(--c-heading); font-weight: 600; line-height: 1.35; }

.js .bento-tile.is-visible .mini-versus__row.is-off { animation: fade-in .5s var(--ease-out) .35s backwards; }
.js .bento-tile.is-visible .mini-versus__row.is-on { animation: fade-in .5s var(--ease-out) 1s backwards; }
.js .bento-tile.is-visible .mini-alert__row { animation: fade-in .5s var(--ease-out) calc(.4s + var(--r, 0) * .6s) backwards; }

/* ------------------------------------------------------------------ */
/* Seite „Pakete & Preise“: Paketkarten (dare_b_packages) im Stil der    */
/* Preiskarten, Garantie-Zeile, aufklappbare Bedingungen, feste Leiste  */
/* ------------------------------------------------------------------ */
.entry-content .pkg-grid { margin: 28px 0 36px; align-items: stretch; }
.pkg-grid--1 { grid-template-columns: minmax(0, 1fr); max-width: 760px; }
.pkg-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* Preiskarten mit Etikett: Platz für das Etikett oben rechts (Startseite) */
.price-card__badge + .price-card__name { padding-right: 96px; }
/* Paketseite: Etikett in eigener Zeile über dem Namen, der Name hat die volle Breite */
.pkg .price-card__badge { position: static; align-self: flex-start; margin: 0 0 14px; }
.pkg .price-card__badge + .price-card__name { padding-right: 0; }
.pkg .price-card__name { font-size: 1.5rem; line-height: 1.25; }
.pkg .price-card__lead { font-size: .9375rem; }
.pkg .price { margin-bottom: 20px; padding-bottom: 20px; }
.pkg__guarantee { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 22px; padding: 12px 14px; border-radius: 12px; background: var(--c-accent-soft); color: var(--c-heading); font-size: .9375rem; font-weight: 600; line-height: 1.45; }
.pkg__guarantee .icon { flex: none; width: 18px; height: 18px; margin-top: 2px; color: var(--c-accent); }
.pkg .check-list { margin: 0 0 22px; font-size: .9375rem; }
.pkg__more { margin: 0 0 20px; padding-top: 14px; border-top: 1px solid var(--c-line); }
.pkg__more summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--c-heading); font-weight: 700; cursor: pointer; list-style: none; }
.pkg__more summary::-webkit-details-marker { display: none; }
.pkg__more summary::after { content: "+"; flex: none; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--c-surface); font-size: 1rem; line-height: 1; }
.pkg__more[open] summary::after { content: "–"; }
.pkg__label { margin: 14px 0 6px; color: var(--c-muted); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.pkg__no { margin: 0; padding: 0; list-style: none; }
.pkg__no li { position: relative; margin: 6px 0; padding-left: 20px; font-size: .875rem; line-height: 1.5; }
.pkg__no li::before { content: "–"; position: absolute; left: 4px; color: var(--c-muted); }
.pkg__facts { margin: 6px 0 0; }
.pkg__facts dt { margin-top: 12px; color: var(--c-heading); font-size: .8125rem; font-weight: 700; }
.pkg__facts dd { margin: 2px 0 0; font-size: .875rem; line-height: 1.5; }
.pkg__note { margin: 0 0 20px; padding: 12px 14px; border: 1px dashed var(--c-line); border-radius: 12px; font-size: .875rem; line-height: 1.5; }
.pkg .btn { margin-top: auto; }
/* dunkle (hervorgehobene) Karte */
.price-card--featured .pkg__guarantee { background: rgba(255, 255, 255, .08); color: #fff; }
.price-card--featured .pkg__guarantee .icon { color: var(--c-accent-light); }
.price-card--featured .pkg__more { border-color: var(--c-line-dark); }
.price-card--featured .pkg__more summary,
.price-card--featured .pkg__facts dt { color: #fff; }
.price-card--featured .pkg__more summary::after { background: rgba(255, 255, 255, .1); }
.price-card--featured .pkg__label,
.price-card--featured .pkg__no li::before { color: rgba(255, 255, 255, .6); }
.price-card--featured .pkg__note { border-color: var(--c-line-dark); }
.price-card--featured a:not(.btn) { color: #fff; }
.pkg-terms { padding: 14px 18px; border-radius: 14px; background: var(--c-surface); }
.pkg-foot { margin-top: 28px; color: var(--c-muted); font-size: .875rem; }

/* Feste Leiste: steht am Ende des Inhalts und haftet beim Lesen am unteren Bildschirmrand */
.pkg-bar { position: sticky; bottom: 16px; z-index: 30; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin: 40px 0 0; padding: 12px 14px 12px 22px; border-radius: 18px; background: var(--c-dark); box-shadow: var(--shadow-lg); color: rgba(255, 255, 255, .85); }
.pkg-bar__text { flex: 1 1 240px; margin: 0; font-size: .9375rem; }
.pkg-bar__text strong { color: #fff; }
.pkg-bar__tel { display: inline-flex; align-items: center; gap: 8px; color: #fff; font-size: .875rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.pkg-bar__tel .icon { width: 16px; height: 16px; color: var(--c-accent-light); }
.pkg-bar__tel:hover { text-decoration: underline; }
.pkg-bar { transition: opacity .3s var(--ease), transform .3s var(--ease), visibility .3s; }
.pkg-bar.is-waiting { visibility: hidden; opacity: 0; transform: translateY(16px); pointer-events: none; }

/* Paketraster unter 1100 px: zwei Karten nebeneinander (bei drei steht die dritte mittig darunter), schmaler eine Spalte
   über die volle Breite. Hebt die Ein-Spalten-Regel (max. 580 px) von .pricing-grid aus theme.css auf. */
@media (max-width: 1100px) {
  .pkg-grid--1 { max-width: 760px; }
  .pkg-grid--2,
  .pkg-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: none; }
  .pkg-grid--3 > :last-child:nth-child(odd) { grid-column: 1 / -1; justify-self: center; width: calc((100% - 30px) / 2); }
}
@media (max-width: 820px) {
  .pkg-grid--2,
  .pkg-grid--3 { grid-template-columns: minmax(0, 1fr); }
  .pkg-grid--3 > :last-child:nth-child(odd) { grid-column: auto; justify-self: stretch; width: auto; }
}
@media (max-width: 600px) {
  /* Auf dem Handy nur der Button – die Leiste soll wenig Platz belegen */
  .pkg-bar { bottom: 10px; padding: 8px; }
  .pkg-bar__text,
  .pkg-bar__tel { display: none; }
  .pkg-bar .btn { flex: 1 1 auto; justify-content: space-between; }
}

/* ------------------------------------------------------------------ */
/* Warenkorb, Kasse, Bestellung, Kündigung (inc/shop.php)              */
/* ------------------------------------------------------------------ */
.header-cart { position: relative; }
.header-cart[hidden] { display: none; }
.header-cart__count { position: absolute; top: -5px; right: -5px; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 999px; background: var(--c-accent); color: #fff; font-size: .6875rem; font-weight: 700; line-height: 19px; text-align: center; }
.header-cart__count:empty { display: none; }
/* Schmale Handys: Mit Warenkorb-Symbol passt der Kopf nur ohne Telefon-Symbol (die Nummer steht im Menü).
   theme.css blendet es ≤ 360 px schon aus, die spätere Regel „max-width: 1320px“ zeigt es aber wieder. */
@media (max-width: 360px) {
  .header-actions:has(.header-cart:not([hidden])) .header-phone { display: none; }
}

/* Handy: „Alle … anzeigen“ unter gekürzten Listen, Tabellen und Kachel-Gruppen (theme.js) */
[data-folded] { display: none !important; }
.fold-toggle { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; margin: 4px 0 28px; padding: 12px 18px; border: 1px solid var(--c-line); border-radius: var(--r-btn); background: #fff; color: var(--c-heading); font: inherit; font-size: .9375rem; font-weight: 600; line-height: 1.3; cursor: pointer; transition: border-color .2s, color .2s; }
.fold-toggle:hover { border-color: var(--c-accent); color: var(--c-accent); }
.fold-toggle .icon { flex: none; width: 16px; height: 16px; transition: transform .3s var(--ease); }
.fold-toggle[aria-expanded="true"] .icon { transform: rotate(180deg); }
.fold-toggle[hidden] { display: none; }
.price-card .fold-toggle { margin: -6px 0 18px; }
.price-card--featured .fold-toggle { border-color: rgba(255, 255, 255, .28); background: transparent; color: #fff; }
.price-card--featured .fold-toggle:hover { border-color: #fff; color: #fff; }

/* Footer am Handy als Akkordeon (theme.js setzt .footer-cols--accordion und die Buttons in den Überschriften) */
@media (max-width: 767px) {
  .footer-cols--accordion { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .footer-cols--accordion > .footer-brand { margin-bottom: 30px; }
  .footer-cols--accordion > nav,
  .footer-cols--accordion > .footer-contact-col { border-top: 1px solid rgba(255, 255, 255, .14); }
  .footer-cols--accordion > :last-child { border-bottom: 1px solid rgba(255, 255, 255, .14); }
  .footer-cols--accordion .footer-title { margin: 0; }
  .footer-toggle { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; padding: 18px 0; border: 0; background: none; color: #fff; font: inherit; text-align: left; cursor: pointer; }
  .footer-toggle .icon { flex: none; width: 18px; height: 18px; color: var(--c-accent-light); transition: transform .3s var(--ease); }
  .footer-toggle[aria-expanded="true"] .icon { transform: rotate(180deg); }
  .footer-cols--accordion :is(.footer-menu, .footer-contact) { padding-bottom: 22px; }
}

/* Handy: Kontaktbox, Kennzahlen und Fußzeile des Footers */
@media (max-width: 767px) {
  /* Kontaktbox: Telefonnummer und Button immer in einer Reihe – je nach Platz kompakter (Container-Abfragen unten) */
  .cta-box { padding-inline: clamp(16px, 6vw, 28px); }
  .cta-box__actions { container-type: inline-size; flex-wrap: nowrap; gap: 10px; width: 100%; }
  .cta-box__phone { flex: none; gap: 10px; font-size: 1.0625rem; }
  .cta-box__phone .icon-box { width: 40px; height: 40px; }
  .cta-box .cta-box__actions .btn { flex: 1 1 0; width: auto; min-width: 0; justify-content: space-between; }
  .cta-box__actions .btn__label { padding: 6px 14px; font-size: .9375rem; line-height: 1.25; white-space: normal; }
  .cta-box__actions .btn__icon { flex: none; width: 44px; }

  /* Kennzahlen (Seit 2011, Bewertungen …) am Handy ausgeblendet (Wunsch des Inhabers); der Footer beginnt mit dem Logo */
  .footer-stats { display: none; }
  .footer-stats + .footer-cols { padding-top: 0; }

  /* Mehr Luft zum Rand der dunklen Fläche: 20–28 px statt 10 px (Gutter minus Frame) – wie die Kontaktbox darüber */
  .footer-inner { width: calc(100% - 2 * clamp(20px, 6vw, 28px)); }
  /* Akkordeon schließt direkt an die Fußzeile an: eine Trennlinie statt zwei mit Leerraum dazwischen */
  .footer-cols--accordion { padding-bottom: 0; }
  .footer-cols--accordion + .footer-bottom { border-top: 0; }

  /* Fußzeile: Rechtslinks als Chips linksbündig (an derselben Kante wie Logo, Text und Akkordeon), darunter das Copyright */
  .footer-bottom { flex-direction: column; align-items: stretch; gap: 20px; padding: 24px 0 30px; text-align: left; }
  .footer-legal { order: 1; justify-content: flex-start; gap: 8px; font-size: .875rem; }
  .footer-legal li + li { margin: 0; padding: 0; border: 0; }
  .footer-legal a { display: block; padding: 8px 14px; border: 1px solid var(--c-line-dark); border-radius: 999px; background: rgba(255, 255, 255, .04); color: rgba(255, 255, 255, .88); line-height: 1.3; white-space: nowrap; transition: border-color .2s, color .2s; }
  .footer-legal a:hover { border-color: var(--c-accent-light); text-decoration: none; }
  .footer-bottom > p { order: 2; padding-top: 18px; border-top: 1px solid var(--c-line-dark); color: rgba(255, 255, 255, .6); font-size: .8125rem; line-height: 1.5; }
}
/* Weniger Platz: Telefon ohne Kreis, Button ohne Pfeil-Feld – der Button-Text bricht höchstens zweizeilig um */
@container (max-width: 400px) {
  .cta-box__phone { gap: 6px; font-size: 1rem; }
  .cta-box__phone .icon-box { width: 18px; height: 18px; background: none; }
  .cta-box__phone .icon-box .icon { width: 18px; height: 18px; }
  .cta-box__actions .btn__icon { display: none; }
  .cta-box__actions .btn__label { justify-content: center; width: 100%; padding: 6px 12px; font-size: .875rem; text-align: center; }
}
@container (max-width: 300px) {
  .cta-box__phone { font-size: .9375rem; }
  .cta-box__phone .icon-box,
  .cta-box__phone .icon-box .icon { width: 16px; height: 16px; }
  .cta-box__actions .btn__label { padding: 6px 10px; font-size: .8125rem; }
}
@container (max-width: 260px) {
  .cta-box__phone .icon-box { display: none; }
  .cta-box__actions .btn__label { padding: 6px 8px; }
}

/* Hinweiskarte der Seitenleiste: kräftigere Abdunklung, damit Zeile, Titel und Text auch auf hellen Bildern
   (Leistungsbilder der Themen-Karten) lesbar bleiben */
.promo-card::after { background: linear-gradient(180deg, rgba(17, 27, 34, .5), rgba(17, 27, 34, .95) 55%); }

/* Cookie-Banner (Plugin Complianz) im Technik-Look der Seite: dunkle Karte mit Platinen-Muster und Leuchtkante,
   Schild-Symbol, Akzent-Verlauf. „Akzeptieren“ und „Ablehnen“ gleich gewichtet (keine Lenkung zur Zustimmung),
   „Einstellungen“ als Kontur-Button. Complianz setzt seine Variablen auf :root – hier gelten sie für Banner und Reiter. */
.cmplz-cookiebanner,
#cmplz-manage-consent {
  --cmplz_banner_width: 580px;
  --cmplz_banner_background_color: #0f1a21;
  --cmplz_banner_border_color: rgba(255, 255, 255, .1);
  --cmplz_banner_border_width: 1px;
  --cmplz_banner_border_radius: 24px;
  --cmplz_title_font_size: 1.375rem;
  --cmplz_text_color: rgba(255, 255, 255, .78);
  --cmplz_hyperlink_color: var(--c-accent-light);
  --cmplz_text_font_size: .9375rem;
  --cmplz_link_font_size: .875rem;
  --cmplz_category_body_font_size: .875rem;
  --cmplz_button_accept_background_color: var(--c-accent);
  --cmplz_button_accept_border_color: transparent;
  --cmplz_button_accept_text_color: #fff;
  --cmplz_button_deny_background_color: var(--c-accent);
  --cmplz_button_deny_border_color: transparent;
  --cmplz_button_deny_text_color: #fff;
  --cmplz_button_settings_background_color: transparent;
  --cmplz_button_settings_border_color: rgba(255, 255, 255, .28);
  --cmplz_button_settings_text_color: #fff;
  --cmplz_button_border_radius: 12px;
  --cmplz_button_font_size: .9375rem;
  --cmplz_category_header_always_active_color: var(--c-accent-light);
  --cmplz_category_header_title_font_size: .9375rem;
  --cmplz_category_header_active_font_size: .8125rem;
  --cmplz_slider_active_color: var(--c-accent);
  --cmplz_slider_inactive_color: rgba(255, 255, 255, .22);
  --cmplz_slider_bullet_color: #fff;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner {
  gap: 14px;
  max-width: calc(100vw - 24px);
  padding: 26px 28px 22px;
  overflow-x: hidden;
  background:
    linear-gradient(90deg, transparent, var(--c-accent-light) 30%, var(--c-accent) 70%, transparent) top center / 100% 1px no-repeat,
    radial-gradient(520px circle at 100% 0%, rgba(0, 153, 204, .22), transparent 60%),
    radial-gradient(420px circle at 0% 100%, rgba(0, 119, 159, .16), transparent 65%),
    var(--circuit) 0 0 / 260px,
    #0f1a21;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .5), 0 0 0 1px rgba(255, 255, 255, .04), 0 0 60px rgba(0, 153, 204, .12);
  color: rgba(255, 255, 255, .78);
  font-family: var(--font-body);
}
#cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-show { animation: dare-cookie-in .55s var(--ease-out) both; }
@keyframes dare-cookie-in {
  from { opacity: 0; filter: blur(6px); transform: translate(-50%, -46%) scale(.97); }
  to { opacity: 1; filter: none; transform: translate(-50%, -50%); }
}
#cmplz-cookiebanner-container .cmplz-cookiebanner > * { min-width: 0; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-header { display: flex; align-items: center; gap: 14px; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-logo {
  position: relative;
  display: block !important; /* Complianz blendet das Logo-Feld sonst mit !important aus */
  flex: none;
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--c-accent-light), var(--c-accent));
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .14) inset, 0 8px 26px rgba(0, 153, 204, .45);
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-logo::after {
  content: "";
  position: absolute;
  inset: 11px;
  background: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v5c0 4.6-3 8.6-7 10-4-1.4-7-5.4-7-10V6l7-3z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v5c0 4.6-3 8.6-7 10-4-1.4-7-5.4-7-10V6l7-3z'/%3E%3Cpath d='M9 12l2 2 4-4'/%3E%3C/svg%3E") center / contain no-repeat;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-title { flex: 1; justify-self: auto; color: #fff; font-family: var(--font-head); font-weight: 600; letter-spacing: -.01em; text-align: left; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-close { display: grid; flex: none; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: rgba(255, 255, 255, .06); color: rgba(255, 255, 255, .8); transition: background-color .2s, color .2s; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-close:hover { background: rgba(255, 255, 255, .14); color: #fff; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-close svg { width: 14px; height: 14px; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-divider { border-color: rgba(255, 255, 255, .08); }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-message { line-height: 1.65; overflow-wrap: anywhere; }
#cmplz-cookiebanner-container .cmplz-cookiebanner :is(.cmplz-links, .cmplz-documents) .cmplz-link { color: var(--c-accent-light); font-weight: 600; text-decoration: underline; text-decoration-color: rgba(83, 198, 236, .45); text-underline-offset: 3px; }
#cmplz-cookiebanner-container .cmplz-cookiebanner :is(.cmplz-links, .cmplz-documents) .cmplz-link:hover { color: #fff; text-decoration-color: currentColor; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-documents ul { flex-wrap: wrap; justify-content: center; gap: 6px 16px; max-width: 100%; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-documents li { margin: 0; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-documents .cmplz-link { white-space: nowrap; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons { gap: 10px; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn { min-height: 48px; border-width: 1px; font-family: var(--font-body); font-weight: 700; letter-spacing: .01em; transition: background-color .2s, border-color .2s, box-shadow .25s, transform .2s; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn:is(.cmplz-accept, .cmplz-deny) { background-image: linear-gradient(135deg, #0a93c4, var(--c-accent)); box-shadow: 0 6px 20px rgba(0, 119, 159, .35); }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn:is(.cmplz-accept, .cmplz-deny):hover { box-shadow: 0 8px 28px rgba(0, 153, 204, .55); transform: translateY(-1px); }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn:is(.cmplz-view-preferences, .cmplz-save-preferences):hover { border-color: var(--c-accent-light); background: rgba(83, 198, 236, .08); }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn:focus-visible { outline: 2px solid var(--c-accent-light); outline-offset: 3px; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-category { border: 1px solid rgba(255, 255, 255, .08); border-radius: 14px; background: rgba(255, 255, 255, .04); }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-category-title { color: #fff; font-weight: 700; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-category .cmplz-description,
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-category .cmplz-description * { color: rgba(255, 255, 255, .72); }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-category-toggle,
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-icon svg { color: #fff; fill: currentColor; }
.cmplz-soft-cookiewall { background-color: rgba(6, 12, 16, .62); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
/* „Cookie-Einstellungen“ (erscheint nach der Wahl): runder Knopf unten links mit Keks-Symbol, fährt beim Zeigen/Fokus
   seinen Text aus. Ohne Complianz-Animation (Reiter halb im Bildrand). Am Handy blendet Complianz ihn aus („hover-hide-mobile“). */
#cmplz-manage-consent button.cmplz-manage-consent,
#cmplz-manage-consent button.cmplz-manage-consent:hover,
#cmplz-manage-consent button.cmplz-manage-consent:focus {
  position: fixed;
  right: auto;
  bottom: 20px;
  left: 20px;
  box-sizing: border-box;
  width: auto;
  min-width: 0;
  max-width: 48px;
  height: 48px;
  margin: 0;
  padding: 0 0 0 46px; /* 48 px minus Rahmen: genau rund */
  overflow: hidden;
  border: 1px solid rgba(83, 198, 236, .35);
  border-radius: 999px;
  background: radial-gradient(circle at 30% 20%, rgba(0, 153, 204, .35), transparent 70%), #0f1a21;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .35), 0 0 24px rgba(0, 153, 204, .22);
  color: #fff;
  font: 600 .875rem/46px var(--font-body);
  white-space: nowrap;
  animation: none;
  transition: max-width .4s var(--ease-out), padding .4s var(--ease-out), border-color .2s, box-shadow .25s;
}
#cmplz-manage-consent button.cmplz-manage-consent::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 12px;
  width: 22px;
  height: 22px;
  margin-top: -11px;
  background: var(--c-accent-light);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2a10 10 0 1 0 10 10 4 4 0 0 1-5-5 4 4 0 0 1-5-5'/%3E%3Cpath d='M8.5 8.5v.01M16 15.5v.01M12 12v.01M11 17v.01M7 14v.01'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2a10 10 0 1 0 10 10 4 4 0 0 1-5-5 4 4 0 0 1-5-5'/%3E%3Cpath d='M8.5 8.5v.01M16 15.5v.01M12 12v.01M11 17v.01M7 14v.01'/%3E%3C/svg%3E") center / contain no-repeat;
}
#cmplz-manage-consent button.cmplz-manage-consent:hover,
#cmplz-manage-consent button.cmplz-manage-consent:focus-visible {
  max-width: 240px;
  padding-right: 20px;
  border-color: var(--c-accent-light);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .35), 0 0 32px rgba(0, 153, 204, .45);
}
#cmplz-manage-consent button.cmplz-manage-consent:focus-visible { outline: 2px solid var(--c-accent-light); outline-offset: 3px; }
@media (max-width: 767px) {
  /* Handy: Abstand zum Rand, Titel sichtbar (Complianz blendet ihn sonst aus und lässt eine leere Zeile) */
  #cmplz-cookiebanner-container .cmplz-cookiebanner { width: calc(100% - 24px); padding: 20px 18px 18px; }
  #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-header .cmplz-title { display: block; font-size: 1.1875rem; }
  #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-logo { width: 40px; height: 40px; border-radius: 12px; }
  #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-logo::after { inset: 9px; }
  #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-message { font-size: .875rem; }
  #cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn { min-height: 46px; }
}

/* Anfahrtskarte (Kontakt) ohne Button „Route planen“: Adresse ist die letzte Zeile */
.map-card p:last-child { margin-bottom: 0; }

/* Mini-Warenkorb: Schublade vom rechten Rand (Hülle wie das mobile Menü, template-parts/mini-cart.php) */
.mini-cart__head { margin-bottom: 4px; padding-bottom: 16px; border-bottom: 1px solid var(--c-line); }
.mini-cart__title { margin: 0; color: var(--c-heading); font-family: var(--font-head); font-size: 1.375rem; font-weight: 700; }
.mini-cart__count { color: var(--c-muted); font-weight: 500; }
.mini-cart__body { display: flex; flex: 1 0 auto; flex-direction: column; transition: opacity .2s; }
.mini-cart__body[aria-busy="true"] { opacity: .55; }
.mini-cart__loading { margin: 24px 0; color: var(--c-muted); }
.mini-cart__items { margin: 0; padding: 0; list-style: none; }
.mini-cart__item { display: flex; justify-content: space-between; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--c-line); }
.mini-cart__info { min-width: 0; }
.mini-cart__name { margin: 0 0 4px; color: var(--c-heading); font-weight: 700; line-height: 1.35; }
.mini-cart__meta { margin: 0 0 8px; color: var(--c-muted); font-size: .8125rem; line-height: 1.45; }
.mini-cart__badge { display: inline-flex; margin: 0 8px 8px 0; padding: 2px 10px; border-radius: 999px; background: var(--c-accent); color: #fff; font-size: .75rem; font-weight: 700; line-height: 1.4; }
.mini-cart__remove { display: block; font-size: .8125rem; }
.mini-cart__remove:disabled { opacity: .5; cursor: progress; }
.mini-cart__price { flex: none; margin: 0; text-align: right; }
.mini-cart__price strong { display: block; color: var(--c-heading); font-family: var(--font-head); font-size: 1.0625rem; white-space: nowrap; }
.mini-cart__price small { display: block; margin-top: 2px; color: var(--c-muted); font-size: .75rem; white-space: nowrap; }
.mini-cart__item--fee .mini-cart__name { font-weight: 600; }
.mini-cart__foot { margin-top: auto; padding-top: 20px; }
.mini-cart__totals { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 4px 12px; margin: 0 0 4px; }
.mini-cart__totals dt { color: var(--c-heading); font-weight: 700; }
.mini-cart__totals dd { margin: 0; color: var(--c-heading); font-family: var(--font-head); font-size: 1.25rem; font-weight: 700; text-align: right; }
.mini-cart__net { margin: 0 0 16px; color: var(--c-muted); font-size: .8125rem; }
.mini-cart__actions { display: grid; gap: 10px; }
.mini-cart .offcanvas__panel .btn { margin-top: 0; }
.mini-cart__note { margin: 12px 0 0; color: var(--c-muted); font-size: .8125rem; text-align: center; }
.mini-cart__empty { display: grid; justify-items: center; gap: 14px; margin: auto 0; padding: 32px 0; text-align: center; }
.mini-cart__empty-icon { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--c-surface); color: var(--c-accent); }
.mini-cart__empty-icon .icon { width: 28px; height: 28px; }
.mini-cart__empty p { margin: 0; color: var(--c-heading); font-weight: 600; }

/* Bestellformular an der Paketkarte */
.pkg .pkg-order { display: grid; gap: 14px; margin-top: auto; padding-top: 4px; }
.pkg .pkg-order .btn { margin-top: 2px; }
.pkg-order__choice { display: grid; gap: 8px; min-width: 0; margin: 0; padding: 0; border: 0; }
.pkg-order__choice legend { margin-bottom: 8px; padding: 0; color: var(--c-heading); font-size: .8125rem; font-weight: 700; }
.pkg-order__row { display: grid; grid-template-columns: minmax(0, 1fr) 104px; align-items: center; gap: 12px; }
.pkg-order__row label { color: var(--c-heading); font-size: .875rem; font-weight: 700; line-height: 1.35; }
.pkg-order__row small { display: block; color: var(--c-muted); font-size: .8125rem; font-weight: 500; }
.pkg-order input[type="number"],
.pkg-order select { min-height: 42px; padding: 8px 12px; border-radius: 10px; font-size: .9375rem; }
.pkg-order select { padding-right: 36px; background-position: right 10px center; background-size: 16px; }
.radio { display: flex; align-items: flex-start; gap: 10px; color: var(--c-text); font-size: .875rem; line-height: 1.45; cursor: pointer; }
.radio input { flex: none; width: 18px; height: 18px; min-height: 0; margin: 1px 0 0; padding: 0; accent-color: var(--c-accent); }
.pkg__ask { display: block; margin-top: 12px; color: var(--c-muted); font-size: .875rem; text-align: center; }
.pkg__ask:hover { color: var(--c-accent); }
.price-card--featured .pkg-order__choice legend,
.price-card--featured .pkg-order__row label { color: #fff; }
.price-card--featured .radio,
.price-card--featured .pkg-order__row small,
.price-card--featured .pkg__ask { color: rgba(255, 255, 255, .78); }
.price-card--featured .pkg__ask:hover { color: #fff; }
.pkg-bar .pkg-order { margin: 0; }

/* Warenkorb und Kasse */
.shop { max-width: 880px; }
.shop [hidden] { display: none !important; }
.shop .form-status { margin: 0 0 24px; }
.shop-empty { font-size: 1.0625rem; }
.shop-items { margin: 0 0 24px; border-top: 1px solid var(--c-line); }
.shop-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px; padding: 20px 0; border-bottom: 1px solid var(--c-line); }
.shop-item__name { margin: 0 0 6px; color: var(--c-heading); font-family: var(--font-head); font-size: 1.125rem; font-weight: 600; }
.shop-item__details { margin: 0; padding: 0; list-style: none; color: var(--c-text); font-size: .875rem; line-height: 1.5; }
.shop-item__details li + li { margin-top: 4px; }
.shop-item__price { margin: 0; color: var(--c-heading); font-weight: 700; text-align: right; white-space: nowrap; }
.shop-item__price small { display: block; color: var(--c-muted); font-size: .8125rem; font-weight: 500; }
.shop-item--fee .shop-item__name { font-size: 1rem; }
.shop-item__edit { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; margin-top: 12px; }
.shop-item__edit form { display: flex; align-items: center; gap: 8px; margin: 0; }
.shop-item__qty label { color: var(--c-muted); font-size: .8125rem; font-weight: 600; }
.shop-item__qty input { width: 76px; min-height: 38px; padding: 6px 10px; border-radius: 10px; font-size: .9375rem; }
.link-button { padding: 0; border: 0; background: none; color: var(--c-accent); font: inherit; font-size: .875rem; font-weight: 600; text-decoration: underline; cursor: pointer; }
.link-button:hover { color: var(--c-accent-hover); }
.shop-totals { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; margin: 0 0 24px; }
.shop-total { padding: 20px 22px; border-radius: 16px; background: var(--c-surface); }
.shop-total__title { margin: 0 0 10px; color: var(--c-heading); font-weight: 700; }
.shop-total dl { display: grid; grid-template-columns: 1fr auto; gap: 6px 0; margin: 0; font-size: .9375rem; }
.shop-total dt { padding-right: 16px; color: var(--c-text); }
.shop-total dd { margin: 0; color: var(--c-heading); text-align: right; }
.shop-total .shop-total__sum { padding-top: 8px; border-top: 1px solid var(--c-line); color: var(--c-heading); font-size: 1.0625rem; font-weight: 700; }
.shop-total__note { margin: 10px 0 0; color: var(--c-muted); font-size: .8125rem; }
.shop-hint { color: var(--c-muted); font-size: .875rem; }
.shop-step { display: flex; align-items: center; gap: 12px; margin: 40px 0 20px; font-size: clamp(1.35rem, 1.1rem + .8vw, 1.75rem); }
.shop-step:first-of-type { margin-top: 8px; }
.shop-step > span { display: inline-grid; flex: none; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--c-accent-soft); color: var(--c-accent); font-size: 1rem; }
.shop-step > span .icon { width: 18px; height: 18px; }
.shop-type { display: flex; flex-wrap: wrap; gap: 10px 28px; margin: 0 0 20px; padding: 0; border: 0; }
.shop-type legend { width: 100%; margin-bottom: 10px; padding: 0; color: var(--c-heading); font-size: .875rem; font-weight: 700; }
.shop-type .req { color: var(--c-accent); }
.shop-type .radio { font-size: 1rem; }
.shop .form-grid { margin-bottom: 8px; }
.shop textarea { min-height: 110px; }
.field__hint { color: var(--c-muted); font-size: .8125rem; }
.shop-terms { margin: 0 0 8px; padding: 18px 20px; border-left: 3px solid var(--c-accent); border-radius: 0 12px 12px 0; background: var(--c-surface); font-size: .9375rem; }
.shop-terms p { margin: 0; }
.shop-terms p + p { margin-top: 8px; }
.shop-terms__title { margin-bottom: 8px !important; color: var(--c-heading); font-weight: 700; }
.shop-checks { display: grid; gap: 14px; }
.shop-checks .checkbox .req { color: var(--c-accent); }
.shop-consumer { display: grid; gap: 10px; padding: 18px 20px; border: 1px solid var(--c-line); border-radius: 14px; }
.shop-consumer p { margin: 0; font-size: .9375rem; }
.shop-submit { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--c-line); }
.shop-submit .form-note { flex: 1 1 320px; }
.shop-next { margin: 0 0 8px; padding-left: 1.25em; }
.shop-next li + li { margin-top: 8px; }
@media (max-width: 600px) {
  .shop-item { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .shop-item__price { text-align: left; }
  .pkg-order__row { grid-template-columns: minmax(0, 1fr) 88px; }
}
.shop-hint--pay { margin: 0 0 20px; padding: 12px 16px; border-radius: 12px; background: var(--c-accent-soft); color: var(--c-heading); }
.shop-receipt { margin: 0 0 24px; padding: 18px 20px; border: 1px solid var(--c-line); border-radius: 14px; background: #fff; }
.shop-receipt__title { margin: 0 0 10px; color: var(--c-heading); font-weight: 700; }
.shop-receipt pre { margin: 0 0 12px; padding: 0; background: none; color: var(--c-text); font: inherit; font-size: .9375rem; white-space: pre-wrap; }
.legal-draft { margin: 0 0 24px; }
@media print {
  .site-header, .topbar, .site-footer, .page-hero, .pkg-bar, .shop--cancel .form-grid, .shop--cancel .form-foot, .shop--cancel .shop-type, .shop-receipt .link-button { display: none !important; }
}

/* Preisansicht: Privatpersonen (inkl. USt, Standard) oder Unternehmen (netto) – dare_price_switch() */
html[data-prices="netto"] .p-brutto,
html:not([data-prices="netto"]) .p-netto { display: none; }
.price-switch-row { display: flex; justify-content: center; margin: 0 0 28px; }
.price-switch-row--start { justify-content: flex-start; margin: 8px 0 4px; }
.price-switch { display: inline-flex; align-items: center; gap: 4px; padding: 4px; border: 1px solid var(--c-line); border-radius: 999px; background: #fff; box-shadow: var(--shadow-sm); }
.price-switch[hidden] { display: none; }
.price-switch__label { padding: 0 8px 0 12px; color: var(--c-muted); font-size: .8125rem; font-weight: 600; }
.price-switch button { padding: 8px 16px; border: 0; border-radius: 999px; background: transparent; color: var(--c-heading); font: inherit; font-size: .875rem; font-weight: 600; line-height: 1.3; cursor: pointer; transition: background-color .2s, color .2s; }
.price-switch button small { color: var(--c-muted); font-size: .75rem; font-weight: 500; }
.price-switch button[aria-pressed="true"] { background: var(--c-accent); color: #fff; }
.price-switch button[aria-pressed="true"] small { color: rgba(255, 255, 255, .82); }
.price-switch button:focus-visible { outline: 2px solid var(--c-accent); outline-offset: 2px; }
@media (max-width: 480px) {
  .price-switch__label { display: none; }
  .price-switch button { padding: 7px 16px; }
  .price-switch button small { display: block; }
}

/* Warenkorb und Kasse: zweispaltig mit mitlaufender Seitenleiste (.layout > .sidebar, theme.js) */
.shop--cart,
.shop--checkout { max-width: none; }
.shop-main { min-width: 0; }
.shop .entry-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 26px; margin: 28px 0 0; }
.shop-summary { padding: 30px 28px; }
.shop-summary .widget-title { margin-bottom: 14px; font-size: 1.375rem; }
.shop-summary__items { margin: 0 0 14px; padding: 0; list-style: none; font-size: .9375rem; }
.shop-summary__items li { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 9px 0; border-bottom: 1px solid var(--c-line); }
.shop-summary__items span { color: var(--c-text); line-height: 1.4; }
.shop-summary__items strong { flex: none; color: var(--c-heading); white-space: nowrap; }
.shop-summary__items small { color: var(--c-muted); font-weight: 500; }
.shop-summary__totals { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 4px 12px; margin: 0 0 4px; }
.shop-summary__totals dt { color: var(--c-heading); font-weight: 700; }
.shop-summary__totals dd { margin: 0; color: var(--c-heading); font-family: var(--font-head); font-size: 1.375rem; font-weight: 700; text-align: right; }
.shop-summary__net { margin: 0 0 18px; color: var(--c-muted); font-size: .8125rem; }
.shop-summary__actions { display: grid; gap: 10px; }
.shop-summary__actions .link-arrow { font-size: .9375rem; }
.shop-summary__trust { margin: 20px 0 0; padding-top: 18px; border-top: 1px solid var(--c-line); font-size: .875rem; }
.shop-summary__trust li + li { margin-top: 6px; }
.shop-contact { display: flex; align-items: center; gap: 14px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--c-line); }
.shop-contact__img { flex: none; width: 52px; height: 52px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--c-accent-light); }
.shop-contact__title { margin: 0 0 2px; color: var(--c-muted); font-size: .8125rem; font-weight: 600; }
.shop-contact__tel { display: inline-flex; align-items: center; gap: 8px; color: var(--c-heading); font-weight: 700; text-decoration: none; }
.shop-contact__tel .icon { width: 16px; height: 16px; color: var(--c-accent); }
.shop-contact__tel:hover { color: var(--c-accent); }
/* Schmal: Leiste unter dem Inhalt; die Zusammenfassung steht dort schon im Inhalt */
@media (max-width: 960px) {
  .shop-summary { display: none; }
}

/* Vertrag unterschreiben (Plugin „Dare Admin“, Shortcode [dare_vertrag]) */
.contract-sign { max-width: 880px; }
.contract-sign__intro { font-size: 1.0625rem; }
.contract-doc { margin: 28px 0 0; border: 1px solid var(--c-line); border-radius: 18px; background: #fff; overflow: hidden; }
.contract-doc__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 20px; padding: 18px 24px; border-bottom: 1px solid var(--c-line); background: var(--c-surface); }
.contract-doc__head h2 { margin: 0; font-size: 1.25rem; }
.contract-doc__body { max-height: 420px; padding: 8px 24px 20px; overflow-y: auto; font-size: .9375rem; line-height: 1.6; }
.contract-doc__body:focus-visible { outline: 2px solid var(--c-accent); outline-offset: -2px; }
.contract-doc__body h3 { margin: 22px 0 8px; font-size: 1.0625rem; }
.contract-doc__body h3.doc-small { font-size: .9375rem; }
.contract-doc__body p { margin: 0 0 8px; }
.contract-doc__body ul { margin: 0 0 10px; padding-left: 1.2em; }
.contract-doc__body li + li { margin-top: 4px; }
.contract-doc__body .doc-small { font-size: .8125rem; }
.contract-doc__body .doc-strong { margin-top: 14px; color: var(--c-heading); font-weight: 700; }
.contract-form { margin-top: 36px; }
.contract-form__company { margin: 0; padding: 14px 0; color: var(--c-heading); font-weight: 600; }
.field__label { color: var(--c-heading); font-size: .875rem; font-weight: 700; }
.field__label .req { color: var(--c-accent); }
.sign-pad { position: relative; height: 190px; border: 1px solid var(--c-line); border-radius: 12px; background: #fff; }
.sign-pad:focus-within, .sign-pad.is-signed { border-color: var(--c-accent); }
.sign-pad canvas { display: block; width: 100%; height: 100%; border-radius: 12px; touch-action: none; cursor: crosshair; }
.sign-pad__hint { position: absolute; left: 24px; right: 24px; bottom: 44px; padding-top: 6px; border-top: 1px dashed #c9d1d6; color: #9aa4ab; font-size: .875rem; pointer-events: none; }
.sign-pad.is-signed .sign-pad__hint { color: transparent; }
.sign-pad__clear { position: absolute; right: 14px; bottom: 10px; }
.sign-pad__error { margin: 8px 0 0; color: #a3321c; font-size: .875rem; font-weight: 600; }
.contract-downloads { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 20px; }
.shop-sign-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 28px; margin: 24px 0 8px; padding: 24px 26px; border-radius: 18px; background: var(--c-dark); color: rgba(255, 255, 255, .85); }
.shop-sign-cta > div { flex: 1 1 380px; }
.shop-sign-cta p { margin: 0; }
.shop-sign-cta__title { margin-bottom: 6px !important; color: #fff; font-family: var(--font-head); font-size: 1.25rem; font-weight: 600; }
@media (max-width: 600px) {
  .contract-doc__head, .contract-doc__body { padding-left: 18px; padding-right: 18px; }
  .sign-pad { height: 170px; }
}

/* Zahlweise der IT-Wartungsverträge: monatlich oder jährlich im Voraus (Auswahlfelder an der Paketkarte) */
.pay-option { position: relative; display: block; cursor: pointer; }
.pay-option input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.pay-option__body { position: relative; display: grid; gap: 2px; padding: 12px 14px 12px 42px; border: 1px solid var(--c-line); border-radius: 12px; background: #fff; transition: border-color .2s, box-shadow .2s; }
.pay-option__body::before { position: absolute; top: 14px; left: 14px; width: 18px; height: 18px; border: 2px solid #9aa4ab; border-radius: 50%; background: #fff; content: ""; box-sizing: border-box; }
.pay-option:hover .pay-option__body { border-color: #b7c1c7; }
.pay-option input:checked + .pay-option__body { border-color: var(--c-accent); box-shadow: 0 0 0 3px rgba(0, 119, 159, .14); }
.pay-option input:checked + .pay-option__body::before { border: 5px solid var(--c-accent); }
.pay-option input:focus-visible + .pay-option__body { outline: 2px solid var(--c-accent); outline-offset: 2px; }
.pay-option__title { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; color: var(--c-heading); font-size: .9375rem; font-weight: 700; line-height: 1.35; }
.pay-option--bonus { margin-top: 10px; }
.pay-option__badge { position: absolute; top: -11px; right: 12px; display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px; background: var(--c-accent); box-shadow: 0 4px 10px rgba(0, 119, 159, .28); color: #fff; font-size: .75rem; font-weight: 700; letter-spacing: .01em; line-height: 1.4; }
.price-card--featured .pay-option__badge { background: var(--c-accent-light); color: var(--c-dark); }
.pay-option__price { color: var(--c-heading); font-size: .9375rem; font-weight: 600; }
.pay-option__price small { color: var(--c-muted); font-size: .8125rem; font-weight: 500; }
.pay-option__note { color: var(--c-muted); font-size: .8125rem; line-height: 1.4; }
.price-card--featured .pay-option__body { border-color: rgba(255, 255, 255, .2); background: rgba(255, 255, 255, .06); }
.price-card--featured .pay-option__title,
.price-card--featured .pay-option__price { color: #fff; }
.price-card--featured .pay-option__note,
.price-card--featured .pay-option__price small { color: rgba(255, 255, 255, .72); }