.elementor-53328 .elementor-element.elementor-element-47d0581 > .elementor-element-populated{margin:0px 0px 0px 020px;--e-column-margin-right:0px;--e-column-margin-left:020px;}.elementor-53328 .elementor-element.elementor-element-da46f6a{width:var( --container-widget-width, 105.475% );max-width:105.475%;--container-widget-width:105.475%;--container-widget-flex-grow:0;}.elementor-bc-flex-widget .elementor-53328 .elementor-element.elementor-element-cab2d24.elementor-column .elementor-widget-wrap{align-items:center;}.elementor-53328 .elementor-element.elementor-element-cab2d24.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:center;align-items:center;}.elementor-53328 .elementor-element.elementor-element-cab2d24 > .elementor-widget-wrap > .elementor-widget:not(.elementor-widget__width-auto):not(.elementor-widget__width-initial):not(:last-child):not(.elementor-absolute){margin-block-end:20px;}.elementor-53328 .elementor-element.elementor-element-2ce1036 > .elementor-widget-container{margin:0px 0px 0px -40px;}.elementor-bc-flex-widget .elementor-53328 .elementor-element.elementor-element-ba61372.elementor-column .elementor-widget-wrap{align-items:center;}.elementor-53328 .elementor-element.elementor-element-ba61372.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:center;align-items:center;}.elementor-53328 .elementor-element.elementor-element-7e05ecb{--e-image-carousel-slides-to-show:5;}.elementor-53328 .elementor-element.elementor-element-7e05ecb .swiper-wrapper{display:flex;align-items:center;}.elementor-53328 .elementor-element.elementor-element-4d00b6d{padding:0px 0px 2px 0px;}.elementor-53328 .elementor-element.elementor-element-2df767c{text-align:center;}.elementor-53328 .elementor-element.elementor-element-c029ff2 .swiper-pagination-bullet-active, .elementor-53328 .elementor-element.elementor-element-c029ff2 .swiper-pagination-progressbar-fill{background-color:#707070;}.elementor-53328 .elementor-element.elementor-element-c029ff2 .swiper-pagination-fraction{color:#707070;}.elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-arrows-yes .elementor-main-swiper{width:calc( 100% - 40px );}.elementor-53328 .elementor-element.elementor-element-c029ff2 .elementor-main-swiper{width:100%;}.elementor-53328 .elementor-element.elementor-element-c029ff2 .elementor-swiper-button{font-size:20px;color:#707070;}.elementor-53328 .elementor-element.elementor-element-c029ff2 .elementor-swiper-button svg{fill:#707070;}.elementor-53328 .elementor-element.elementor-element-c029ff2 .swiper-pagination-bullet{height:7px;width:7px;}.elementor-53328 .elementor-element.elementor-element-c029ff2 .swiper-horizontal .swiper-pagination-progressbar{height:7px;}.elementor-53328 .elementor-element.elementor-element-c029ff2 .elementor-testimonial__text{font-size:20px;font-weight:300;}.elementor-53328 .elementor-element.elementor-element-c029ff2 .elementor-testimonial__name{color:var( --e-global-color-primary );font-size:20px;text-transform:uppercase;letter-spacing:0.4px;}.elementor-53328 .elementor-element.elementor-element-c029ff2 .elementor-testimonial__title{color:#707070;}.elementor-53328 .elementor-element.elementor-element-c029ff2 .elementor-testimonial__image img{width:65px;height:65px;}.elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_left .elementor-testimonial__content:after,
					 .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_right .elementor-testimonial__content:after{top:calc( 20px + (65px / 2) - 8px );}body:not(.rtl) .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_stacked:not(.elementor-testimonial--align-center):not(.elementor-testimonial--align-right) .elementor-testimonial__content:after,
					 body:not(.rtl) .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_inline:not(.elementor-testimonial--align-center):not(.elementor-testimonial--align-right) .elementor-testimonial__content:after,
					 .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_stacked.elementor-testimonial--align-left .elementor-testimonial__content:after,
					 .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_inline.elementor-testimonial--align-left .elementor-testimonial__content:after{left:calc( 20px + (65px / 2) - 8px );right:auto;}body.rtl .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_stacked:not(.elementor-testimonial--align-center):not(.elementor-testimonial--align-left) .elementor-testimonial__content:after,
					 body.rtl .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_inline:not(.elementor-testimonial--align-center):not(.elementor-testimonial--align-left) .elementor-testimonial__content:after,
					 .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_stacked.elementor-testimonial--align-right .elementor-testimonial__content:after,
					 .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_inline.elementor-testimonial--align-right .elementor-testimonial__content:after{right:calc( 20px + (65px / 2) - 8px );left:auto;}body:not(.rtl) .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_above:not(.elementor-testimonial--align-center):not(.elementor-testimonial--align-right) .elementor-testimonial__content:after,
					 .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_above.elementor-testimonial--align-left .elementor-testimonial__content:after{left:calc( 20px + (65px / 2) - 8px );right:auto;}body.rtl .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_above:not(.elementor-testimonial--align-center):not(.elementor-testimonial--align-left) .elementor-testimonial__content:after,
					 .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_above.elementor-testimonial--align-right .elementor-testimonial__content:after{right:calc( 20px + (65px / 2) - 8px );left:auto;}body.rtl .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_inline.elementor-testimonial--align-left .elementor-testimonial__image + cite,
					 body.rtl .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_above.elementor-testimonial--align-left .elementor-testimonial__image + cite,
					 body:not(.rtl) .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_inline .elementor-testimonial__image + cite,
					 body:not(.rtl) .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_above .elementor-testimonial__image + cite{margin-left:22px;margin-right:0;}body:not(.rtl) .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_inline.elementor-testimonial--align-right .elementor-testimonial__image + cite,
					 body:not(.rtl) .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_above.elementor-testimonial--align-right .elementor-testimonial__image + cite,
					 body.rtl .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_inline .elementor-testimonial__image + cite,
					 body.rtl .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_above .elementor-testimonial__image + cite{margin-right:22px;margin-left:0;}.elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_stacked .elementor-testimonial__image + cite,
					 .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_left .elementor-testimonial__image + cite,
					 .elementor-53328 .elementor-element.elementor-element-c029ff2.elementor-testimonial--layout-image_right .elementor-testimonial__image + cite{margin-top:22px;}@media(min-width:577px){.elementor-53328 .elementor-element.elementor-element-d28d3b3{width:60.026%;}.elementor-53328 .elementor-element.elementor-element-cab2d24{width:39.872%;}}@media(max-width:991px){.elementor-53328 .elementor-element.elementor-element-7e05ecb{--e-image-carousel-slides-to-show:4;}.elementor-53328 .elementor-element.elementor-element-7e05ecb .swiper-wrapper{display:flex;align-items:center;}}@media(max-width:576px){.elementor-53328 .elementor-element.elementor-element-7e05ecb{--e-image-carousel-slides-to-show:1;}}/* Start custom CSS for image-carousel, class: .elementor-element-7e05ecb */.elementor-53328 .elementor-element.elementor-element-7e05ecb img { 
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
}/* End custom CSS */
/* Start custom CSS for testimonial-carousel, class: .elementor-element-c029ff2 */.elementor-53328 .elementor-element.elementor-element-c029ff2 .swiper-container-horizontal>.swiper-pagination-bullets {
    bottom: inherit;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-ae22649 */#hai_kundenerfolg {
    text-align: center! important;
}/* End custom CSS */
/* Start custom CSS *//* ============================================================
   functionHR | Lösungsseite: 360-Grad-Feedback
   Datei: fhr-360-feedback.css
   Einfügen: Elementor > Seiten-Einstellungen > Custom CSS
   Stand: Okt. 2026 | Version ohne Screenshots
   Feature-Bilder ersetzt durch schematische Funktionsgrafiken
   (.fhr-360-vis*), W6 als kostenloser Einstieg mit 2 gleich breiten Karten
   ============================================================ */

:root {
  --fhr-navy:       #0A1D5C;
  --fhr-black:      #262626;
  --fhr-grey:       #E5E5E5;
  --fhr-light-bg:   #f1f2f9;
  --fhr-aisblue:    #bbc2e4;
  --fhr-white:      #ffffff;
  --fhr-border:     #dddfe8;
  --fhr-muted:      #606060;
  --fhr-green:      #17a86b;
  --fhr-yellow-bg:  #fdf3d6;
  --fhr-yellow-txt: #7a5d00;
  --fhr-font-body:  'Roboto', 'Segoe UI', sans-serif;
  --fhr-font-head:  'Roboto Slab', Georgia, serif;
  --fhr-size-xs:    0.72rem;
  --fhr-size-sm:    0.82rem;
  --fhr-size-base:  0.9rem;
  --fhr-size-md:    1rem;
  --fhr-radius:     12px;
  --fhr-max-width:  1320px;
}

/* ════════════════════════════════════════
   SHARED UTILITIES
════════════════════════════════════════ */
.fhr-360-inner {
  max-width: var(--fhr-max-width);
  margin: 0 auto;
}
.fhr-360-eyebrow {
  font-family: var(--fhr-font-body);
  font-size: var(--fhr-size-xs);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--fhr-navy);
  display: block;
  margin-bottom: 0.5rem;
}
.fhr-360-eyebrow--light {
  color: rgba(255,255,255,0.6);
}
.fhr-360-h1 {
  font-family: var(--fhr-font-head);
  font-weight: 600;
  font-style: normal !important;
  color: var(--fhr-black);
  letter-spacing: -0.02em;
  margin: 0 0 1rem;
}
/* Hero-Bild: padding der rechten Spalte entfernen */
.elementor-page-49563 .elementor-top-section:first-of-type .elementor-column:last-child .elementor-widget-container {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.elementor-page-49563 .elementor-top-section:first-of-type .elementor-column:last-child img {
  width: 100% !important;
  max-width: 100% !important;
}
/* CM Tooltip: checklist-Icons schuetzen */
.fhr-360-checklist .cmtooltip_tooltip,
.fhr-360-checklist img.cmtooltip_image { display: none !important; }
.fhr-360-checklist li::before { display: block !important; }
.fhr-360-h2 {
  font-family: var(--fhr-font-head);
  font-size: clamp(1.25rem, 2.2vw, 1.7rem);
  font-weight: 600;
  font-style: normal !important;
  color: var(--fhr-black);
  line-height: 1.2;
  margin: 0 0 1rem;
}
.fhr-360-h2--white { color: var(--fhr-white) !important; }
.fhr-360-cta h2 { color: var(--fhr-white) !important; font-style: normal !important; }
.fhr-360-h3 {
  font-family: var(--fhr-font-head);
  font-size: 1rem;
  font-weight: 600;
  font-style: normal !important;
  color: var(--fhr-navy);
  line-height: 1.25;
  margin: 0 0 0.35rem;
}
.fhr-360-body {
  font-family: var(--fhr-font-body);
  font-size: var(--fhr-size-base);
  color: var(--fhr-muted);
  line-height: 1.65;
  margin: 0 0 1rem;
}
.fhr-360-body--dark { color: var(--fhr-black); }
.fhr-360-body--white { color: rgba(255,255,255,0.8); }

/* Checkmark bullet list */
.fhr-360-checklist {
  list-style: none;
  padding: 0;
  margin: 0 0 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.fhr-360-checklist li {
  font-family: var(--fhr-font-body);
  font-size: var(--fhr-size-base);
  color: var(--fhr-black);
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  line-height: 1.5;
}
.fhr-360-checklist li::before {
  content: '';
  width: 18px; height: 18px;
  min-width: 18px;
  margin-top: 2px;
  background: var(--fhr-navy);
  border-radius: 50%;
  flex-shrink: 0;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%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'%3E%3Cpath fill='white' d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Buttons */
.fhr-360-btn {
  display: inline-block;
  background: var(--fhr-black);
  color: var(--fhr-white) !important;
  font-family: var(--fhr-font-body);
  font-size: var(--fhr-size-base);
  font-weight: 600;
  padding: 0.8rem 1.8rem;
  border-radius: 6px;
  text-decoration: none !important;
  transition: opacity 0.2s;
  cursor: pointer;
}
.fhr-360-btn:hover { opacity: 0.85; }
.fhr-360-btn--light {
  background: var(--fhr-grey);
  color: var(--fhr-navy) !important;
}
.fhr-360-btn--light:hover { opacity: 0.9; }


/* ════════════════════════════════════════
   W1 | HERO
════════════════════════════════════════ */
.fhr-360-hero {
  padding: 60px 2rem 52px;
  background: transparent;
}
.fhr-360-hero .fhr-360-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--fhr-white);
  border: 1.5px solid var(--fhr-navy);
  color: var(--fhr-navy);
  font-family: var(--fhr-font-body);
  font-size: var(--fhr-size-xs);
  font-weight: 700;
  padding: 0.35rem 0.85rem;
  border-radius: 100px;
  margin-bottom: 1.4rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.fhr-360-hero .fhr-360-badge::before {
  content: '';
  width: 7px; height: 7px;
  background: var(--fhr-navy);
  border-radius: 50%;
  animation: fhr360pulse 2s infinite;
  flex-shrink: 0;
}
@keyframes fhr360pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: 0.35; transform: scale(1.5); }
}
.fhr-360-hero .fhr-360-h1 { max-width: 540px; }
.fhr-360-hero .fhr-360-body { max-width: 500px; margin-bottom: 1.6rem; }


/* ════════════════════════════════════════
   W2 PART 1 | TRUST BAR
════════════════════════════════════════ */
.fhr-360-trust {
  background: var(--fhr-navy);
  padding: 16px 2rem;
}
.fhr-360-trust .fhr-360-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: nowrap;
}
.fhr-360-trust-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  white-space: nowrap;
}
.fhr-360-trust-item svg {
  width: 18px; height: 18px;
  min-width: 18px;
  color: var(--fhr-grey);
  flex-shrink: 0;
}
.fhr-360-trust-item svg[viewBox="0 0 44 44"] {
  width: 22px; height: 22px;
  min-width: 22px;
}
.fhr-360-trust-item span {
  font-family: var(--fhr-font-body);
  font-size: var(--fhr-size-sm);
  font-weight: 500;
  color: var(--fhr-white);
}


/* ════════════════════════════════════════
   W2 PART 2 | VORTEILS-SECTION
════════════════════════════════════════ */
.fhr-360-vorteile {
  background: var(--fhr-light-bg);
  padding: 72px 2rem;
}
.fhr-360-vorteile-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 2rem;
}
.fhr-360-vorteil-card {
  background: var(--fhr-white);
  border-radius: var(--fhr-radius);
  border: 1px solid var(--fhr-border);
  padding: 1.5rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  transition: transform 0.2s, box-shadow 0.2s;
}
.fhr-360-vorteil-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(10,29,92,0.08);
}
.fhr-360-vorteil-icon {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  background: var(--fhr-white);
  border: 1px solid var(--fhr-border);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--fhr-navy);
  margin-bottom: 0.25rem;
  flex-shrink: 0;
}
.fhr-360-vorteil-icon svg {
  width: 20px;
  height: 20px;
}
.fhr-360-vorteil-title {
  font-family: var(--fhr-font-head);
  font-size: var(--fhr-size-md);
  font-weight: 600;
  font-style: normal !important;
  color: var(--fhr-black);
  margin: 0;
  line-height: 1.3;
}
.fhr-360-vorteil-text {
  font-family: var(--fhr-font-body);
  font-size: var(--fhr-size-sm);
  line-height: 1.55;
  color: var(--fhr-muted);
  margin: 0;
}

/* Footer CTA der Vorteils-Section */
.fhr-360-prob-footer {
  margin-top: 1.5rem;
  padding: 1rem 1.25rem;
  background: var(--fhr-navy);
  border-radius: var(--fhr-radius);
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.fhr-360-prob-footer svg {
  width: 20px; height: 20px;
  min-width: 20px;
  color: var(--fhr-grey);
  flex-shrink: 0;
}
.fhr-360-prob-footer-text {
  font-family: var(--fhr-font-body);
  font-size: var(--fhr-size-sm);
  font-weight: 500;
  color: var(--fhr-white);
  line-height: 1.4;
  margin: 0;
}
.fhr-360-prob-footer-text strong {
  color: var(--fhr-white);
  font-weight: 700;
}
.fhr-360-prob-footer-cta {
  margin-left: auto;
  flex-shrink: 0;
  background: var(--fhr-grey);
  color: var(--fhr-navy) !important;
  font-family: var(--fhr-font-body);
  font-size: var(--fhr-size-sm);
  font-weight: 700;
  padding: 0.45rem 1.1rem;
  border-radius: 5px;
  text-decoration: none !important;
  white-space: nowrap;
  transition: opacity 0.2s;
}
.fhr-360-prob-footer-cta:hover { opacity: 0.88; }


/* ════════════════════════════════════════
   W3 | PROZESS
════════════════════════════════════════ */
.fhr-360-prozess {
  background: var(--fhr-white);
  padding: 72px 2rem;
  border-top: 3px solid var(--fhr-navy);
}
.fhr-360-prozess-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin-top: 2rem;
  position: relative;
}
.fhr-360-prozess-grid::before {
  content: '';
  position: absolute;
  top: 20px;
  left: calc(12.5% + 20px);
  right: calc(12.5% + 20px);
  height: 2px;
  background: var(--fhr-border);
  z-index: 0;
}
.fhr-360-pstep {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 0 0.75rem;
  position: relative;
  z-index: 1;
}
.fhr-360-pstep-num {
  width: 40px; height: 40px;
  background: var(--fhr-grey);
  color: var(--fhr-navy);
  font-family: var(--fhr-font-head);
  font-size: 0.85rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.9rem;
  flex-shrink: 0;
  border: 2px solid var(--fhr-white);
  box-shadow: 0 0 0 2px var(--fhr-border);
}
.fhr-360-pstep-title {
  font-family: var(--fhr-font-head);
  font-size: 0.92rem;
  font-weight: 600;
  font-style: normal !important;
  color: var(--fhr-navy);
  margin-bottom: 0.4rem;
  line-height: 1.25;
}
.fhr-360-pstep-text {
  font-family: var(--fhr-font-body);
  font-size: var(--fhr-size-sm);
  color: var(--fhr-muted);
  line-height: 1.55;
}
.fhr-360-prozess-footer {
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--fhr-border);
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.fhr-360-prozess-footer-link {
  font-family: var(--fhr-font-body);
  font-size: var(--fhr-size-base);
  font-weight: 600;
  color: var(--fhr-navy) !important;
  text-decoration: none !important;
  white-space: nowrap;
  transition: opacity 0.2s;
}
.fhr-360-prozess-footer-link:hover { opacity: 0.7; }


/* ════════════════════════════════════════
   W4 | FEATURE HIGHLIGHTS (ohne Screenshots)
   Hintergrund explizit per Modifier statt nth-child
════════════════════════════════════════ */
.fhr-360-feature {
  padding: 72px 2rem;
}
.fhr-360-feature--light {
  background: var(--fhr-light-bg);
}
.fhr-360-feature--white {
  background: var(--fhr-white);
}
.fhr-360-feature--white:has(+ .fhr-360-blindspot) {
  padding-bottom: 36px;
}
.fhr-360-feature-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 4rem;
  align-items: center;
}
.fhr-360-feature-grid--reverse .fhr-360-feature-visual {
  order: -1;
}
.fhr-360-feature-tag {
  font-family: var(--fhr-font-body);
  font-size: var(--fhr-size-xs);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--fhr-navy);
  margin-bottom: 0.6rem;
  display: block;
}
.fhr-360-feature-text .fhr-360-checklist {
  margin-bottom: 0;
}
.fhr-360-feature-visual {
  width: 100%;
  max-width: 540px;
  justify-self: center;
}


/* ────────────────────────────────────────
   W4 | FUNKTIONSGRAFIKEN (.fhr-360-vis)
   Rein dekorativ, Inhalte stehen im Text
──────────────────────────────────────── */
.fhr-360-vis {
  background: var(--fhr-white);
  border: 1px solid var(--fhr-border);
  border-radius: 16px;
  box-shadow: 0 8px 36px rgba(10,29,92,0.10);
  padding: 1.5rem;
  font-family: var(--fhr-font-body);
  color: var(--fhr-black);
}
.fhr-360-vis-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: 1rem;
  margin-bottom: 1.1rem;
  border-bottom: 1px solid var(--fhr-border);
}
.fhr-360-vis-title {
  font-family: var(--fhr-font-head);
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--fhr-navy);
  line-height: 1.3;
}
.fhr-360-vis-note {
  font-family: var(--fhr-font-body);
  font-size: 0.7rem;
  color: var(--fhr-muted);
  text-align: right;
  margin: 1rem 0 0;
  line-height: 1.4;
}

/* Legende (Selbstbild / Fremdbild) */
.fhr-360-vis-legend,
.fhr-360-vis-foot {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  flex-wrap: wrap;
}
.fhr-360-vis-foot {
  justify-content: center;
  margin-top: 0.9rem;
}
.fhr-360-vis-key {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.78rem;
  font-weight: 500;
  color: var(--fhr-black);
}
.fhr-360-vis-key::before {
  content: '';
  width: 10px;
  height: 10px;
  border-radius: 3px;
  flex-shrink: 0;
}
.fhr-360-vis-key--self::before  { background: var(--fhr-navy); }
.fhr-360-vis-key--other::before { background: var(--fhr-aisblue); }

/* Grafik 1: Perspektiven-Orbit */
.fhr-360-vis-orbit svg {
  display: block;
  width: 100%;
  max-width: 440px;
  height: auto;
  margin: 0 auto;
}

/* Grafik 2: Selbstbild vs. Fremdbild */
.fhr-360-vis-rows {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 1rem;
}
.fhr-360-vis-row {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.65rem 0.8rem;
  border-radius: 10px;
}
.fhr-360-vis-row--flag {
  background: var(--fhr-light-bg);
  box-shadow: inset 3px 0 0 var(--fhr-navy);
}
.fhr-360-vis-row-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 0.1rem;
}
.fhr-360-vis-label {
  font-size: var(--fhr-size-sm);
  font-weight: 600;
  color: var(--fhr-black);
}
.fhr-360-vis-flag {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  background: var(--fhr-white);
  border: 1.5px dashed var(--fhr-navy);
  color: var(--fhr-navy);
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.15rem 0.55rem;
  border-radius: 100px;
  white-space: nowrap;
}
.fhr-360-vis-flag svg {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
}
.fhr-360-vis-bar,
.fhr-360-vis-progress {
  height: 8px;
  background: var(--fhr-light-bg);
  border-radius: 100px;
  overflow: hidden;
}
.fhr-360-vis-row--flag .fhr-360-vis-bar {
  background: var(--fhr-white);
}
.fhr-360-vis-bar span,
.fhr-360-vis-progress span {
  display: block;
  height: 100%;
  width: var(--w, 50%);
  border-radius: 100px;
}
.fhr-360-vis-bar--self span  { background: var(--fhr-navy); }
.fhr-360-vis-bar--other span { background: var(--fhr-aisblue); }

/* Grafik 3: KI-Maßnahmen */
.fhr-360-vis-field {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  background: var(--fhr-light-bg);
  border-left: 3px solid var(--fhr-navy);
  border-radius: 0 12px 12px 0;
  padding: 0.85rem 1rem;
}
.fhr-360-vis-field-label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--fhr-muted);
}
.fhr-360-vis-field-name {
  font-family: var(--fhr-font-head);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--fhr-navy);
}
.fhr-360-vis-ai {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0.4rem 0 0.4rem 1.1rem;
  padding: 0.7rem 0 0.7rem 1.1rem;
  border-left: 2px dashed var(--fhr-aisblue);
  color: var(--fhr-navy);
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.35;
}
.fhr-360-vis-ai svg {
  width: 30px;
  height: 30px;
  flex-shrink: 0;
}
.fhr-360-vis-measures {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
.fhr-360-vis-measure {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  background: var(--fhr-white);
  border: 1px solid var(--fhr-border);
  border-radius: 10px;
  padding: 0.65rem 0.8rem;
}
.fhr-360-vis-measure--active {
  border-color: var(--fhr-navy);
  box-shadow: 0 4px 14px rgba(10,29,92,0.08);
}
.fhr-360-vis-measure-icon {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--fhr-light-bg);
  color: var(--fhr-navy);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.fhr-360-vis-measure--active .fhr-360-vis-measure-icon {
  background: var(--fhr-green);
  color: var(--fhr-white);
}
.fhr-360-vis-measure-icon svg {
  width: 14px;
  height: 14px;
}
.fhr-360-vis-measure-text {
  flex: 1;
  min-width: 0;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--fhr-black);
}
.fhr-360-vis-pill {
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.2rem 0.55rem;
  border-radius: 100px;
  background: var(--fhr-light-bg);
  color: var(--fhr-muted);
  white-space: nowrap;
}
.fhr-360-vis-pill--active {
  background: rgba(23,168,107,0.12);
  color: var(--fhr-green);
}
.fhr-360-vis-loop {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin-top: 0.9rem;
  padding: 0.7rem 0.85rem;
  border: 1px dashed var(--fhr-border);
  border-radius: 10px;
  color: var(--fhr-navy);
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.35;
}
.fhr-360-vis-loop svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

/* Grafik 4: Feedbackcenter */
.fhr-360-vis-roles {
  display: inline-flex;
  background: var(--fhr-light-bg);
  border-radius: 100px;
  padding: 3px;
  flex-shrink: 0;
}
.fhr-360-vis-role {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--fhr-muted);
  padding: 0.25rem 0.75rem;
  border-radius: 100px;
  white-space: nowrap;
}
.fhr-360-vis-role--active {
  background: var(--fhr-navy);
  color: var(--fhr-white);
}
.fhr-360-vis-cycles {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.fhr-360-vis-cycle {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  border: 1px solid var(--fhr-border);
  border-radius: 12px;
  padding: 0.85rem 1rem;
}
.fhr-360-vis-cycle-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.fhr-360-vis-cycle-name {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--fhr-black);
}
.fhr-360-vis-cycle-meta {
  font-size: 0.7rem;
  color: var(--fhr-muted);
}
.fhr-360-vis-status {
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 0.2rem 0.6rem;
  border-radius: 100px;
  white-space: nowrap;
}
.fhr-360-vis-status--run {
  background: rgba(10,29,92,0.08);
  color: var(--fhr-navy);
}
.fhr-360-vis-status--remind {
  background: var(--fhr-yellow-bg);
  color: var(--fhr-yellow-txt);
}
.fhr-360-vis-status--done {
  background: rgba(23,168,107,0.12);
  color: var(--fhr-green);
}
.fhr-360-vis-progress {
  height: 6px;
}
.fhr-360-vis-progress span {
  background: var(--fhr-navy);
}
.fhr-360-vis-progress--done span {
  background: var(--fhr-green);
}
.fhr-360-vis-new {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 0.9rem;
  padding: 0.7rem;
  border: 1.5px dashed var(--fhr-aisblue);
  border-radius: 10px;
  color: var(--fhr-navy);
  font-size: 0.82rem;
  font-weight: 600;
}
.fhr-360-vis-new svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

/* Blinde Flecken: Insight-Box direkt nach Feature 2 */
.fhr-360-blindspot {
  background: var(--fhr-white);
  padding: 0 2rem 72px;
}
.fhr-360-blindspot-box {
  background: var(--fhr-light-bg);
  border-left: 3px solid var(--fhr-navy);
  border-radius: 0 16px 16px 0;
  padding: 2rem 2.25rem;
  display: flex;
  align-items: flex-start;
  gap: 1.5rem;
}
.fhr-360-blindspot-icon {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  border-radius: 14px;
  background: var(--fhr-white);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--fhr-navy);
}
.fhr-360-blindspot-icon svg {
  width: 28px;
  height: 28px;
}
.fhr-360-blindspot-content .fhr-360-h2 {
  margin-top: 0;
  margin-bottom: 0.5rem;
}
.fhr-360-blindspot-content .fhr-360-body {
  margin-bottom: 0;
}


/* ════════════════════════════════════════
   W5b | DATENSCHUTZ / SICHERHEIT
   Identisches Layout wie fhr-mb-security
════════════════════════════════════════ */
.fhr-360-security {
  background: var(--fhr-light-bg);
  padding: 4rem 1.5rem;
}
.fhr-360-security-inner {
  max-width: 1320px;
  margin: 0 auto;
}
.fhr-360-security-inner > .fhr-360-h2 {
  margin-bottom: 2.4rem !important;
}
.fhr-360-security-layout {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 2rem;
  align-items: stretch;
}
.fhr-360-iso-card {
  background: var(--fhr-white);
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(10,29,92,0.08);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 1.8rem 1.2rem;
  gap: 0.9rem;
}
.fhr-360-iso-card img {
  width: 88px;
  height: auto;
  display: block;
}
.fhr-360-iso-caption {
  font-family: var(--fhr-font-head);
  font-weight: 600;
  font-size: 0.85rem;
  line-height: 1.35;
  color: var(--fhr-navy);
}
.fhr-360-security-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.1rem;
}
.fhr-360-security-item {
  background: var(--fhr-white);
  border-radius: 14px;
  box-shadow: 0 4px 16px rgba(10,29,92,0.06);
  padding: 1.3rem 1.4rem;
  display: flex;
  align-items: flex-start;
  gap: 0.9rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.fhr-360-security-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(10,29,92,0.1);
}
.fhr-360-security-icon {
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--fhr-green);
  display: flex;
  align-items: center;
  justify-content: center;
}
.fhr-360-security-item p {
  font-family: var(--fhr-font-body);
  font-size: 0.92rem;
  line-height: 1.5;
  color: var(--fhr-black);
  margin: 0;
}


/* ════════════════════════════════════════
   W5 | CTA
════════════════════════════════════════ */
.fhr-360-cta {
  background: var(--fhr-navy);
  padding: 80px 2rem;
  text-align: center;
}
.fhr-360-cta .fhr-360-h2--white {
  max-width: 580px;
  margin: 0 auto 0.75rem;
}
.fhr-360-cta .fhr-360-body--white {
  max-width: 520px;
  margin: 0 auto 2rem;
}
.fhr-360-cta-buttons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
}
.fhr-360-btn--outline-light {
  display: inline-block;
  background: transparent;
  color: var(--fhr-white) !important;
  border: 1.5px solid rgba(255,255,255,0.5);
  font-family: var(--fhr-font-body);
  font-size: var(--fhr-size-base);
  font-weight: 600;
  padding: 0.8rem 1.8rem;
  border-radius: 6px;
  text-decoration: none !important;
  transition: border-color 0.2s, opacity 0.2s;
}
.fhr-360-btn--outline-light:hover {
  border-color: rgba(255,255,255,0.9);
  opacity: 0.9;
}


/* ════════════════════════════════════════
   W6 | KOSTENLOSER EINSTIEG (Alternative zur Demo)
   2 gleich breite Karten: Musterfragebogen + Leitfaden
════════════════════════════════════════ */
.fhr-360-ressourcen {
  background: var(--fhr-light-bg);
  padding: 72px 2rem;
}
.fhr-360-ressourcen-intro {
  margin-bottom: 0;
}
.fhr-360-ressourcen-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 1.5rem;
  margin-top: 2rem;
  align-items: stretch;
}
.fhr-360-ressource-card {
  background: var(--fhr-white);
  border-radius: var(--fhr-radius);
  border: 1px solid var(--fhr-border);
  padding: 1.8rem 1.8rem 1.6rem;
  text-decoration: none !important;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
}
.fhr-360-ressource-card:hover {
  transform: translateY(-3px);
  border-color: var(--fhr-aisblue);
  box-shadow: 0 8px 24px rgba(10,29,92,0.1);
}
.fhr-360-ressource-card--featured {
  border-color: var(--fhr-navy);
}
.fhr-360-ressource-card--featured:hover {
  border-color: var(--fhr-navy);
}
.fhr-360-ressource-top {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.fhr-360-ressource-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--fhr-light-bg);
  color: var(--fhr-navy);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.fhr-360-ressource-card--featured .fhr-360-ressource-icon {
  background: var(--fhr-navy);
  color: var(--fhr-white);
}
.fhr-360-ressource-icon svg {
  width: 20px;
  height: 20px;
}
.fhr-360-ressource-type {
  font-family: var(--fhr-font-body);
  font-size: var(--fhr-size-xs);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--fhr-navy);
}
.fhr-360-ressource-body {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.fhr-360-ressource-title {
  font-family: var(--fhr-font-head);
  font-size: 1.1rem;
  font-weight: 600;
  font-style: normal !important;
  color: var(--fhr-black);
  margin: 0 0 0.5rem;
  line-height: 1.3;
}
.fhr-360-ressource-text {
  font-family: var(--fhr-font-body);
  font-size: var(--fhr-size-base);
  color: var(--fhr-muted);
  line-height: 1.6;
  margin: 0 0 1.1rem;
  flex: 1;
}
/* CTA-Link: identisch in beiden Karten, gegen Theme-Linkstile abgesichert */
.fhr-360-ressource-card .fhr-360-ressource-link {
  font-family: var(--fhr-font-body) !important;
  font-size: var(--fhr-size-base) !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  color: var(--fhr-navy) !important;
  margin-top: auto;
}
.fhr-360-ressource-card:hover .fhr-360-ressource-link {
  text-decoration: underline;
}


/* ════════════════════════════════════════
   RESPONSIVE
════════════════════════════════════════ */
@media (max-width: 1100px) {
  .fhr-360-vorteile-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 1024px) {
  .fhr-360-feature-grid,
  .fhr-360-feature-grid--reverse {
    grid-template-columns: minmax(0, 1fr);
    gap: 2.25rem;
  }
  .fhr-360-feature-grid--reverse .fhr-360-feature-visual {
    order: 0;
  }
  .fhr-360-feature-visual {
    justify-self: start;
  }
  .fhr-360-prozess-grid::before { display: none; }
  .fhr-360-prozess-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
  }
}

@media (max-width: 900px) {
  .fhr-360-security-layout {
    grid-template-columns: 1fr;
  }
  .fhr-360-iso-card {
    flex-direction: row;
    justify-content: center;
    padding: 1.2rem;
  }
}

@media (max-width: 768px) {
  .fhr-360-trust .fhr-360-inner {
    flex-direction: column;
    align-items: flex-start;
    width: fit-content;
    margin: 0 auto;
    gap: 0.75rem;
  }
  .fhr-360-security-grid { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
  .fhr-360-vorteile-grid,
  .fhr-360-prozess-grid,
  .fhr-360-ressourcen-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .fhr-360-blindspot-box {
    flex-direction: column;
    align-items: flex-start;
    padding: 1.5rem;
  }
  .fhr-360-vis {
    padding: 1.1rem;
  }
  .fhr-360-vis-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.6rem;
  }
  .fhr-360-vis-ai {
    margin-left: 0.6rem;
  }
  .fhr-360-hero,
  .fhr-360-vorteile,
  .fhr-360-prozess,
  .fhr-360-feature,
  .fhr-360-blindspot,
  .fhr-360-cta,
  .fhr-360-ressourcen {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}/* End custom CSS */