/* Service-Seiten: Kontakt, FAQ, Unternehmen, Konfigurator (nach mockup-v2/css/content.css, nur Tokens) */

/* Kontakt */
.contact-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: var(--space-xl); align-items: start; }
.contact-direct { display: grid; gap: var(--space-m); }
.contact-channels { display: grid; gap: var(--space-xs); }
.contact-channel { display: flex; align-items: center; gap: var(--space-s); padding: var(--space-s) var(--space-m); border-radius: var(--radius-m); background: var(--color-bg); box-shadow: var(--shadow-ring); text-decoration: none; color: var(--color-ink); transition: box-shadow .16s ease; min-width: 0; }
.contact-channel:hover { box-shadow: inset 0 0 0 1.5px var(--color-primary); }
.contact-channel:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.contact-channel-icon { width: 2.75rem; height: 2.75rem; flex: none; border-radius: 50%; background: var(--color-surface-light); color: var(--color-primary); display: grid; place-items: center; }
.contact-channel-icon .icon { width: 1.25rem; height: 1.25rem; }
.contact-channel-text { display: grid; min-width: 0; }
.contact-channel-text small { font-size: var(--text-xs); color: var(--color-muted); }
.contact-channel-text b { font-family: var(--font-head); font-size: var(--text-md); color: var(--color-heading); overflow-wrap: anywhere; }
.contact-hours { display: flex; gap: var(--space-2xs); align-items: flex-start; font-size: var(--text-sm); color: var(--color-muted); margin: 0; }
.contact-hours .icon { width: 1.1rem; height: 1.1rem; flex: none; color: var(--color-primary); margin-top: .15em; }
.contact-langs { display: flex; flex-wrap: wrap; gap: var(--space-2xs); margin: 0; padding: 0; list-style: none; }
.contact-langs li { padding: .4em .85em; border-radius: var(--radius-pill); background: var(--color-surface-light); font-size: var(--text-sm); color: var(--color-primary-hover); }
.contact-site { display: grid; grid-template-columns: 1fr 1.3fr; gap: var(--space-xs); }
.contact-site-card { padding: var(--space-m); border-radius: var(--radius-m); background: var(--color-surface); font-size: var(--text-sm); line-height: var(--lh-body); }
.contact-site-card .overline { display: block; margin-bottom: var(--space-3xs); }
.contact-site-card p { margin: 0; }
.contact-site-map { min-height: 10rem; border-radius: var(--radius-m); background: var(--color-surface-light); display: grid; place-items: center; padding: var(--space-s); text-align: center; font-size: var(--text-xs); color: var(--color-muted); }
.contact-form-card { padding: var(--space-l); border-radius: var(--radius-m); background: var(--color-bg); box-shadow: var(--shadow-m), var(--shadow-ring); }
.contact-form-card h2 { font-size: var(--text-xl); margin: 0 0 var(--space-s); }

/* JetFormBuilder an Design anbinden */
.jet-form-builder { display: grid; gap: var(--space-s); }
.jet-form-builder-row { margin: 0; }
.jet-form-builder__label-text { font-size: var(--text-sm); font-weight: 600; color: var(--color-heading); margin-bottom: var(--space-3xs); }
.jet-form-builder__required { color: var(--color-primary); }
.jet-form-builder__field.text-field, .jet-form-builder__field.textarea-field, .jet-form-builder input[type=text], .jet-form-builder input[type=email], .jet-form-builder input[type=tel], .jet-form-builder textarea { width: 100%; padding: .75em .9em; border: 1.5px solid var(--color-border); border-radius: var(--radius-s); font: inherit; font-size: var(--text-base); color: var(--color-ink); background: var(--color-bg); }
.jet-form-builder input:focus-visible, .jet-form-builder textarea:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 1px; border-color: var(--color-primary); }
.jet-form-builder textarea { resize: vertical; min-height: 9rem; }
.jet-form-builder .checkradio-wrap, .jet-form-builder .jet-form-builder__field-wrap.checkradio-wrap { font-size: var(--text-sm); color: var(--color-ink); }
.jet-form-builder input[type=checkbox] { accent-color: var(--color-primary); width: 1.1rem; height: 1.1rem; }
.jet-form-builder__action-button, .jet-form-builder .jet-form-builder__submit { display: inline-flex; align-items: center; gap: .5em; padding: .8em 1.4em; border: 0; border-radius: var(--radius-s); background: var(--color-primary); color: var(--color-on-dark); font: inherit; font-weight: 700; cursor: pointer; transition: background-color .16s ease; }
.jet-form-builder__action-button:hover { background: var(--color-primary-hover); }
.jet-form-builder__action-button:focus-visible { outline: 2px solid var(--color-heading); outline-offset: 2px; }
.jet-form-builder__action-button:disabled { background: var(--color-border); color: var(--color-muted); cursor: not-allowed; }
.jet-form-builder__error, .jet-form-builder-messages-wrap .error-message { color: #B3261E; font-size: var(--text-sm); }

/* FAQ */
.help-chips { display: flex; flex-wrap: wrap; gap: var(--space-2xs); margin: 0; }
.help-grid { display: grid; grid-template-columns: minmax(0, 1fr) 20rem; gap: var(--space-xl); align-items: start; }
.help-grid .cb-faq, .help-grid section { padding-block: 0; }
.help-aside { position: sticky; top: 8.75rem; padding: var(--space-l); border-radius: var(--radius-m); background: var(--color-surface-light); display: grid; gap: var(--space-xs); justify-items: start; }
.help-aside h2 { font-size: var(--text-lg); margin: 0; }
.help-aside p { margin: 0; line-height: var(--lh-body); }
.help-aside a:not([class]) { color: var(--color-primary); font-weight: 600; }

/* Unternehmen */
.company-split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2xl); align-items: center; }
.company-text { display: grid; gap: var(--space-s); justify-items: start; }
.company-text h2 { margin: 0; }
.company-text p { margin: 0; line-height: var(--lh-body); }
.company-text a:not([class]) { color: var(--color-primary); }
.company-text ul { padding-left: 1.25rem; display: grid; gap: var(--space-3xs); margin: 0; }
.company-media { margin: 0; }
.company-media img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; border-radius: var(--radius-m); display: block; }
.company-media-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-s); }
.pillar-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-gap); }
.pillar { padding: var(--space-l); border-radius: var(--radius-m); background: var(--color-bg); box-shadow: var(--shadow-ring); }
.pillar h3 { font-size: var(--text-lg); margin: 0 0 var(--space-s); }
.pillar ul { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-2xs); font-size: var(--text-sm); }
.pillar li { padding-left: 1.1rem; position: relative; }
.pillar li::before { content: ""; position: absolute; left: 0; top: .6em; width: 7px; height: 7px; background: var(--color-primary); transform: rotate(45deg); border-radius: 1px; }
.group-grid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: var(--space-gap); }

/* Konfigurator-Seite */
.config-page { padding-block: var(--space-xl) var(--space-section); }
.config-page-foot { margin-top: var(--space-l); color: var(--color-muted); font-size: var(--text-sm); }
.config-page-foot a { color: var(--color-primary); }

@media (max-width: 1024px) {
  .help-grid, .contact-wrap { grid-template-columns: 1fr; }
  .help-aside { position: static; }
  .pillar-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 767px) {
  .company-split { grid-template-columns: 1fr; }
  .company-split-rev .company-media { order: 2; }
  .pillar-grid, .contact-site { grid-template-columns: 1fr; }
}
.contact-form-card .jet-form-builder-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-3xs); width: 100%; }
.contact-form-card .jet-form-builder__label, .contact-form-card .jet-form-builder__field-wrap { width: 100%; max-width: none; min-width: 0; flex: none; }
.contact-form-card .checkradio-wrap label, .contact-form-card .jet-form-builder__field-label { display: flex; gap: var(--space-2xs); align-items: flex-start; }
.help-chips { margin-bottom: var(--space-l); }
.help-grid .cb-faq { padding: 0; background: none; max-width: none; margin: 0; }
.help-grid .cb-faq__list { max-width: none; margin: 0; padding: 0; width: 100%; }

/* Ratgeber-Übersicht (mockup-v2/wissen.html: Suchfeld + Themen-Spalte) */
.ratgeber-search { position: relative; display: flex; align-items: center; max-width: 47.5rem; margin-bottom: var(--space-xl); }
.ratgeber-search > .icon { position: absolute; left: 1rem; width: 1.25rem; height: 1.25rem; color: var(--color-muted); pointer-events: none; }
.ratgeber-search input[type=search] { width: 100%; height: 3.4rem; border: 1.5px solid var(--color-border); border-radius: var(--radius-m); padding: 0 7.5rem 0 3rem; font: inherit; font-size: var(--text-base); background: var(--color-bg); color: var(--color-heading); }
.ratgeber-search input[type=search]:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 1px; border-color: var(--color-primary); }
.ratgeber-search-count { position: absolute; right: 1rem; font-size: var(--text-xs); color: var(--color-muted); }
.ratgeber-layout { display: grid; grid-template-columns: 15.5rem minmax(0, 1fr); gap: var(--space-2xl); align-items: start; }
.ratgeber-nav { position: sticky; top: 8.5rem; }
.ratgeber-nav-label { display: block; font-size: var(--text-xs); font-weight: 700; letter-spacing: var(--ls-overline); text-transform: uppercase; color: var(--color-muted); margin: 0 0 var(--space-2xs) var(--space-xs); }
.ratgeber-nav ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.ratgeber-tab { display: flex; align-items: center; gap: var(--space-2xs); padding: .7em .75em; border-radius: var(--radius-s); color: var(--color-heading); text-decoration: none; font-weight: 500; font-size: var(--text-sm); border-left: 3px solid transparent; }
.ratgeber-tab span { flex: 1; min-width: 0; }
.ratgeber-tab em { font-style: normal; font-size: var(--text-xs); font-weight: 600; color: var(--color-muted); }
.ratgeber-tab:hover { background: var(--color-surface); color: var(--color-primary); }
.ratgeber-tab.is-active { background: var(--color-surface-light); color: var(--color-primary-hover); border-left-color: var(--color-primary); font-weight: 700; }
.ratgeber-tab.is-active em { color: var(--color-primary-hover); }
@media (max-width: 1024px) {
  .ratgeber-layout { grid-template-columns: minmax(0, 1fr); gap: var(--space-l); }
  .ratgeber-nav { position: static; border-bottom: 1px solid var(--color-border); padding-bottom: var(--space-2xs); }
  .ratgeber-nav-label { display: none; }
  .ratgeber-nav ul { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
  .ratgeber-nav ul::-webkit-scrollbar { display: none; }
  .ratgeber-tab { white-space: nowrap; border-left: 0; border-radius: var(--radius-pill); box-shadow: var(--shadow-ring); padding: .5em .95em; }
  .ratgeber-tab.is-active { box-shadow: none; background: var(--color-primary); color: var(--color-on-dark); }
  .ratgeber-tab.is-active em { color: var(--color-on-dark); }
}
@media (max-width: 767px) { .ratgeber-search-count { display: none; } .ratgeber-search input[type=search] { padding-right: 1rem; } }
