/*Peer
Theme Name: Kadence Child
Theme URI: https://www.liquidweb.com/software/kadence/
Template: kadence
Author: Kadence WP
Author URI: https://www.liquidweb.com/
Description: Kadence Theme is a lightweight yet full featured WordPress theme for creating beautiful fast loading and accessible websites, easier than ever. It features an easy to use drag and drop header and footer builder to build any type of header in minutes. It features a full library of gorgeous starter templates that are easy to modify with our intelligent global font and color controls. With extensive integration with the most popular 3rd party plugins, you can quickly build impressive ecommerce websites, course websites, business websites, and more.
Tags: translation-ready,accessibility-ready,two-columns,right-sidebar,left-sidebar,footer-widgets,blog,custom-logo,custom-background,custom-menu,rtl-language-support,editor-style,threaded-comments,custom-colors,featured-images,wide-blocks,full-width-template,theme-options,e-commerce
Version: 1.5.2.1785710360
Updated: 2026-08-03 00:39:20

*/

/* =========================================================
   Safe Space 4 You – Standalone Layout CSS
   Version 1.1.0
   ========================================================= */

:root {
  --ss4y-teal: #2A6B6B;
  --ss4y-teal-dark: #1A4F4F;
  --ss4y-teal-deeper: #143D3D;
  --ss4y-coral: #F08060;
  --ss4y-coral-dark: #E06A4A;
  --ss4y-cream: #F9EFE6;
  --ss4y-text: #1A3A3A;
  --ss4y-muted: #4A6A6A;
  --ss4y-content: 1100px;
  --ss4y-radius: 14px;
}

html { scroll-behavior: smooth; }

/* Page title / theme chrome */
.page-id-5909 .entry-hero,
.page-id-5909 .entry-header,
.page .ss4y-page + *,
body.page .content-area .entry-content > .ss4y-page {
  /* keep */
}

main.content-area {
  margin-top: 0rem;
  margin-bottom: 5rem;
}

/* Vollbreite: Theme-Container nicht einengen */
body.page .entry-content:has(.ss4y-page),
body.page .content-container:has(.ss4y-page) {
  max-width: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.ss4y-page {
  width: 100%;
  overflow-x: clip;
  color: var(--ss4y-text);
  font-size: 16px;
  line-height: 1.6;
}

.ss4y-page *,
.ss4y-page *::before,
.ss4y-page *::after {
  box-sizing: border-box;
}

.ss4y-page h1,
.ss4y-page h2,
.ss4y-page h3,
.ss4y-page h4 {
  color: var(--ss4y-teal-dark);
  line-height: 1.2;
  margin: 0 0 0.75rem;
  font-weight: 700;
}

.ss4y-page p { margin: 0 0 1rem; }

.ss4y-wrap {
  width: min(var(--ss4y-content), calc(100% - 48px));
  margin: 0 auto;
}

/* Buttons */
.ss4y-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 22px;
  border-radius: 10px;
  font-weight: 700;
  text-decoration: none !important;
  border: 2px solid transparent;
  transition: background .2s ease, color .2s ease, border-color .2s ease;
  line-height: 1.2;
}

.ss4y-btn--coral { background: var(--ss4y-coral); color: #fff !important; }
.ss4y-btn--coral:hover { background: var(--ss4y-coral-dark); color: #fff !important; }

.ss4y-btn--outline {
  background: #fff;
  color: var(--ss4y-teal) !important;
  border-color: var(--ss4y-teal);
}
.ss4y-btn--outline:hover {
  background: var(--ss4y-teal);
  color: #fff !important;
}

.ss4y-btn--pill { border-radius: 999px; }
.ss4y-btn--red { background: #E8544F; color: #fff !important; }
.ss4y-btn--red:hover { background: #D4433E; }
.ss4y-btn--cyan { background: #2A9A9D; color: #fff !important; }
.ss4y-btn--cyan:hover { background: #238A8D; }
.ss4y-btn--white { background: #fff; color: var(--ss4y-teal-dark) !important; }
.ss4y-btn--white:hover { background: var(--ss4y-cream); }

/* Hero */
.ss4y-hero {
  background: var(--ss4y-cream);
  padding: 64px 0 72px;
  position: relative;
}

.ss4y-hero::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 40px;
  background: #fff;
  clip-path: ellipse(58% 100% at 50% 100%);
}

.ss4y-hero__grid {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 40px;
  align-items: center;
}

.ss4y-hero__title {
  font-size: clamp(2rem, 4vw, 2.75rem);
  margin-bottom: 14px;
}

.ss4y-hero__sub {
  font-size: 1.15rem;
  color: var(--ss4y-teal);
  margin-bottom: 24px;
}

.ss4y-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.ss4y-hero__media,
.ss4y-angebot__media {
  max-width: 420px;
  margin: 0 auto;
  width: 100%;
}

.ss4y-hero__media img,
.ss4y-angebot__media img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 20px;
  /* schwarzen Bildhintergrund etwas abmildern */
  box-shadow: 0 16px 40px rgba(26, 79, 79, 0.12);
}

/* Features */
.ss4y-features {
  background: #fff;
  padding: 64px 0;
}

.ss4y-features__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.ss4y-card {
  background: var(--ss4y-cream);
  border-radius: var(--ss4y-radius);
  padding: 28px 24px;
  text-align: center;
}

.ss4y-card__icon {
  width: 48px;
  height: 48px;
  margin: 0 auto 14px;
  color: var(--ss4y-teal);
}

.ss4y-card__icon svg {
  width: 36px !important;
  height: 36px !important;
  max-width: 36px !important;
  max-height: 36px !important;
  display: block;
  margin: 0 auto;
}

.ss4y-card h3 {
  font-size: 1.2rem;
  margin-bottom: 8px;
}

.ss4y-card p {
  color: var(--ss4y-muted);
  font-size: 0.98rem;
  margin: 0;
}

/* Angebot */
.ss4y-angebot {
  background: var(--ss4y-cream);
  padding: 64px 0;
}

.ss4y-angebot__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
}

.ss4y-angebot h2 {
  font-size: clamp(1.6rem, 3vw, 2.1rem);
  margin-bottom: 20px;
}

.ss4y-checklist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
}

.ss4y-checklist li {
  position: relative;
  padding-left: 28px;
  font-weight: 600;
  font-size: 1.05rem;
  color: var(--ss4y-teal-dark);
}

.ss4y-checklist li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--ss4y-coral);
  font-weight: 700;
}

/* CTA Row */
.ss4y-cta-row {
  padding: 64px 0;
}


.ss4y-cta-row__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.ss4y-cta-card {
  border-radius: 20px;
  padding: 36px 24px;
  text-align: center;
  color: #fff;
  min-height: 180px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
}

.ss4y-cta-card h3 {
  color: #fff;
  font-size: 1.4rem;
  margin: 0;
}

.ss4y-cta-card p {
  color: rgba(255,255,255,0.85);
  margin: 0;
  font-size: 0.95rem;
}

.ss4y-cta-card--teal { background: #1A5A5C; }
.ss4y-cta-card--slate { background: #2A4A5C; }
.ss4y-cta-card--coral { background: #C45A3A; }

/* Kontakt */
.ss4y-kontakt {
  background: #fff;
  padding: 64px 0;
}

.ss4y-kontakt__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: start;
}

.ss4y-kontakt h2 {
  font-size: 1.75rem;
  margin-bottom: 18px;
}

.ss4y-kontakt__form-title {
  margin-bottom: 8px;
}

.ss4y-kontakt__form-title::after {
  content: "";
  display: block;
  width: 72px;
  height: 3px;
  background: var(--ss4y-teal);
  margin-top: 10px;
  margin-bottom: 18px;
}

.ss4y-themen-list {
  display: flex;
  flex-direction: column;
  border-radius: 8px;
  overflow: hidden;
}

.ss4y-thema {
  display: block;
  padding: 12px 18px;
  background: #D4EDED;
  color: var(--ss4y-teal-dark) !important;
  font-weight: 700;
  text-decoration: none !important;
  transition: background .2s ease, color .2s ease;
}

.ss4y-thema--alt { background: #F0F7F7; }

.ss4y-thema:hover,
.ss4y-thema:focus {
  background: var(--ss4y-teal);
  color: #fff !important;
}

.ss4y-kontakt-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 520px;
}

.ss4y-kontakt-form input,
.ss4y-kontakt-form textarea {
  width: 100%;
  padding: 12px 14px;
  border: 2px solid #A8D4D4;
  border-radius: 8px;
  background: #fff;
  color: var(--ss4y-text);
  font: inherit;
}

.ss4y-kontakt-form input:focus,
.ss4y-kontakt-form textarea:focus {
  border-color: var(--ss4y-teal);
  outline: none;
  box-shadow: 0 0 0 3px rgba(42, 107, 107, 0.15);
}

.ss4y-kontakt-form button {
  padding: 12px 22px;
  background: var(--ss4y-teal-dark);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-weight: 700;
  font-size: 1rem;
  cursor: pointer;
}

.ss4y-kontakt-form button:hover { background: var(--ss4y-teal); }

.screen-reader-text {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}

/* Final CTA */
.ss4y-final {
  background: var(--ss4y-teal-dark);
  color: #fff;
  text-align: center;
  padding: 64px 0;
}

.ss4y-final h2 {
  color: #fff;
  font-size: clamp(1.7rem, 3vw, 2.3rem);
}

.ss4y-final p {
  color: rgba(255,255,255,0.92);
  font-size: 1.15rem;
  margin-bottom: 22px;
}

/* Footer */
.ss4y-footer {
  background: var(--ss4y-teal-deeper);
  color: #fff;
  padding: 40px 0;
}

.ss4y-footer__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.ss4y-footer h4 {
  color: #fff;
  font-size: 1rem;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255,255,255,0.25);
  display: inline-block;
}

.ss4y-footer p {
  color: #fff;
  margin: 0 0 6px;
  font-size: 0.95rem;
}

.wp-block-image.mach-mit {
  margin-bottom: -100px;
  position: relative;
  z-index: 1;
}

.header-navigation ul ul.sub-menu,
.header-navigation ul ul.submenu {
  border: solid 2px #fff;
}


.single-content ul.news{
  margin: 0 auto;
  max-width: 1020px;
}

.news .entry-content-wrap {
  border: solid #e06a4a;
  border-radius: 10px;
}


/* Mobile */
@media (max-width: 900px) {
  .ss4y-hero__grid,
  .ss4y-angebot__grid,
  .ss4y-kontakt__grid,
  .ss4y-features__grid,
  .ss4y-cta-row__grid,
  .ss4y-footer__grid {
    grid-template-columns: 1fr;
  }

  .ss4y-wrap {
    width: min(var(--ss4y-content), calc(100% - 32px));
  }

  .ss4y-hero,
  .ss4y-features,
  .ss4y-angebot,
  .ss4y-cta-row,
  .ss4y-kontakt,
  .ss4y-final {
    padding: 48px 0;
  }

  .ss4y-hero__media,
  .ss4y-angebot__media {
    max-width: 320px;
  }
}
