:root {
  /* ── Farben ── */
  --white:      #FFFFFF;
  --off-white:  #F5F2EE;
  --orange:     #ff6600;
  --dark:       #1A1A1A;
  --mid:        #888888;
  --border:     #E4E1DC;
  --info:       #006e51;

  /* ── Schriftarten ── */
  --font:       'Mont';      /* Fett  — Überschriften, Buttons   */
  --font-body:  'Mont-med';  /* Mittel — Fließtext, Absätze      */

  /* ── Schriftgrößen (größte Werte oben, skalieren per clamp) ── */
  --fs-lead:     clamp(15px, 2.5vw, 17px);   /* Haupttext / Lead               */
  --fs-body:     clamp(14px, 2vw,   16px);   /* Kartentext, Listentext          */
  --fs-small:    clamp(12px, 1.5vw, 14px);   /* Notizen, Hinweise               */
  --fs-question: clamp(16px, 3vw,   19px);   /* Pain-Fragen                     */
  --fs-srv:      clamp(18px, 3.5vw, 22px);   /* Service-Kartentitel             */
  --fs-button:   clamp(14px, 2vw,   15px);   /* Buttons / CTAs                  */

  /* ── Zeilenabstände ── */
  --lh-body:  1.8;
  --lh-tight: 1.65;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: var(--font);
  background: var(--off-white);
  color: var(--dark);
  -webkit-font-smoothing: antialiased;
}

a { text-decoration: none; color: inherit; }

/* ── Layout ── */
/*body{
    background-color: #F7FAFB !important;
}*/

.bigbub-two{
    width: 100%;
    /*background-color: #F7FAFB;*/
    background-color: var(--off-white);
    height: auto;
    display: flex;
    justify-content: right;
}
.header-wraper{
    width: 95%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    
    
}
.main-image{
    display: flex;
    width: auto;
    height: auto;
    -webkit-mask-image: linear-gradient(to left, rgba(0,0,0,1) 60%, rgba(0,0,0,0));
    mask-image: linear-gradient(to left, rgba(0,0,0,1) 60%, rgba(0,0,0,0));
}
.main-image img{
    object-fit: contain;
    width: auto;
    height: 100vh;
}
.test{
    display: flex;
    width: 50%;
    height: auto;
}
.test img{
    object-fit: cover;
    width: 100%;
    height: auto;
}
.title-sect-tab{
    display: none;
}
.my-dot{
    color: #ff6600;
}
.inner-wrapper {
    display: flex;
    width: 60%;
    flex-direction: column;
    align-items: flex-start;
    color: black;
    padding-top: 2rem;
    margin: 0;
    height: auto;
    align-self: flex-end;
    margin-bottom:7.9rem;
}
/* Typography */
h1 {
    display: block;
    font-family: 'Mont';
    font-weight: 700;
    font-size:  clamp(36px, 3.6vw, 54px);
    letter-spacing: 0px;
    margin: 0;
    color: black;
    line-height: 1.3;
}

.inner-par {
  width:90%;
    font-family: 'Mont-med';
    font-weight: 400;
    color: rgb(90, 89, 89);
    font-size: 1.3rem;
    line-height: 2.2rem;
    margin: 0;
    padding-top:2rem;
    padding-bottom: 2rem;
}


/* Links / Buttons 
*{border: solid black 2px}*/

.cta-termin {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem 0rem;
    width: 20rem;
    gap:1rem;
    margin: 0;
    margin-top:2rem;
    border: solid #ff6600 2px;
    border-radius: 10px;
    background-color: #ff6600;
    color: white;
    font-family: 'Mont-med';
    font-weight: 700;
    font-size: clamp(1rem, 0.824rem + 0.784vw, 1.2rem);
    text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease;
}
.big_oo{
    font-variation-settings: 
    'wght' 300 !important;
}

.inner-wrapper a:hover {
    background-color: white;
    color: black;
}
.inner-wrapper ul{
    list-style: none;
    justify-content: flex-start;
    margin:0;
    padding:0;
    font-family: "Mont-med";
    color: black;
    font-size: 1.3rem;
}

.li-wrapper{
    display: grid;
    grid-template-rows: 1;
    grid-template-columns: auto 1fr;
    align-items: center;
    padding-top: 0.8rem;
    padding-bottom: 0.8rem;
    margin: 0;
}
.li-wrapper span{
    padding-right: 0.5rem;
    font-size: 2rem;
    margin: 0;
    font-variation-settings: 
    'wght' 300 !important;
}
/* Material Icons */
.material-symbols-outlined {
    vertical-align: middle;
    font-variation-settings:
        'FILL' 0,
        'wght' 400,
        'GRAD' 0,
        'opsz' 24;
}
.image-wrapper{
    width:50%;
    height: auto;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;

}
.image-wrapper-mob{
    display: none;
}



.titl-decx{
        display: none;
}
.inner-par-mob{
    display: none;
}
.mobile-list{
    display: none;
}
.wrap {
  width: 90%;
}

/* ── Typography ── */
.eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--orange);
  display: block;
  margin-bottom: 16px;
}

.eyebrow-light { color: rgba(232, 96, 28, 0.85); }

h2 {
  font-size: clamp(36px, 3.6vw, 54px);
  font-weight: 800;
  line-height: 1.06;
  letter-spacing: -0.025em;
  color: var(--dark);
}

.lead {
  font-size: var(--fs-lead);
  line-height: var(--lh-body);
  color: var(--mid);
  font-weight: 400;
  font-family: var(--font-body);
}

.orange-dot { color: var(--orange);
font-style: normal; }

/* ── Links & Buttons ── */
.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 600;
  color: var(--dark);
  border-bottom: 1.5px solid var(--orange);
  padding-bottom: 2px;
  transition: gap .18s;
}
.link-arrow:hover { gap: 14px; }
.link-arrow-light { color: #fff; border-bottom-color: var(--orange); }

.btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  background: var(--orange);
  color: #fff;
  font-family: var(--font);
  font-size: 15px;
  font-weight: 600;
  padding: 15px 28px;
  border-radius: 8px;
  border: none;
  cursor: pointer;
  transition: background .15s;
}
.btn-primary:hover { background: #cd5419; }

/* ── Image Placeholder ── */



/* ════════════════════════════════════════════════════
   SECTION WILLKOMMEN
   ════════════════════════════════════════════════════ */
.s-welcome {
  display: flex;
  justify-content: center;
  background: var(--white);
  padding: 110px 0;
  border-bottom: 1px solid var(--border);
}

.sw-inner {
  display: grid;
  grid-template-columns: 4fr 5fr;
  gap: 80px;
  align-items: stretch;
}

.sw-img-wrap {
  position: relative;
  min-height: 480px;
  border-radius: 12px;
  overflow: hidden;
}

/* Right column content */
.sw-heading {
  font-size: clamp(36px, 4vw, 54px);
  font-weight: 800;
  line-height: 1.06;
  letter-spacing: -0.025em;
  color: var(--dark);
  margin-bottom: 24px;
}

.sw-divider {
  width: 40px;
  height: 2px;
  background: var(--orange);
  margin-bottom: 20px;
}

.sw-tagline {
  font-size: var(--fs-lead);
  line-height: var(--lh-body);
  color: var(--mid);
  font-weight: 400;
  font-family: var(--font-body);
}

.sw-right {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

/* Info note */
.sw-note {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 22px 24px;
}

.sw-note svg {
  flex-shrink: 0;
  color: var(--orange);
  margin-top: 2px;
}

.sw-note p {
  font-size: var(--fs-small);
  line-height: var(--lh-tight);
  color: var(--mid);
  font-family: var(--font-body);
}



/* ══════════════════════════════════════
   SECTION 2 – LEISTUNGEN
   ══════════════════════════════════════ */
.s2 {
  background: var(--white);
  padding: 110px 0;
  display: flex;
  justify-content: center;
}

.s2-header {
  margin-bottom: 60px;
}
.s2-header h2  { margin-bottom: 14px; }
.s2-header .lead { max-width: 580px; }

.s2-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
}

.srv {
  background: var(--white);
  padding: 52px 48px;
  display: flex;
  flex-direction: column;
}

.srv-num {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--orange);
  margin-bottom: 28px;
}

.srv-title {
  font-size: var(--fs-srv);
  font-weight: 700;
  line-height: 1.22;
  color: var(--dark);
  margin-bottom: 28px;
}

.srv-list {
  list-style: none;
  flex: 1;
  border-top: 1px solid var(--border);
}
.srv-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: var(--fs-body);
  font-family: var(--font-body);
  color: var(--dark);
  padding: 13px 0;
  border-bottom: 1px solid var(--border);
  line-height: 1.5;
}
.srv-list li::before {
  content: '';
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--orange);
  flex-shrink: 0;
  margin-top: 7px;
}
.btn-angebot{
  background-color: white;
  color: var(--dark);
  border: solid var(--dark) 1.5px;
  border-radius: 0px;
  margin-top: 2rem;
  width: 100%;
  padding:1rem;
  font-size: 0.8rem;
  font-family: "Mont";
}

.srv-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 24px;
  padding: 14px 20px;
  border: 1.5px solid var(--orange);
  border-radius: 8px;
  font-size: var(--fs-button);
  font-weight: 700;
  font-family: var(--font);
  color: var(--orange);
  background: transparent;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.srv-btn::after {
  content: '→';
  transition: transform 0.2s;
}
.srv-btn:hover {
  background: var(--orange);
  color: var(--white);
}
.srv-btn:hover::after {
  transform: translateX(5px);
}
.srv-desc {
  margin-top: 28px;
  font-size: var(--fs-body);
  font-style: italic;
  line-height: var(--lh-tight);
  color: var(--mid);
  font-family: var(--font-body);
}


/* ── Image Placeholder ── */
.img-ph {
  height: 100%;
}
.img-ph img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ══════════════════════════════════════
   SECTION 3 – LYOMOVE
   ══════════════════════════════════════ */
.s3 {
  background: linear-gradient(135deg, #1C3F91 0%, #2f6fe4 100%);
  display: flex;
  justify-content: center;
  padding: 90px 0;
  position: relative;
  overflow: hidden;
}

.s3::before {
  content: '';
  position: absolute;
  top: -60%;
  right: -8%;
  width: 480px;
  height: 480px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.05);
  pointer-events: none;
}

.s3::after {
  content: '';
  position: absolute;
  bottom: -40%;
  left: -5%;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  background: rgba(28, 63, 145, 0.4);
  pointer-events: none;
}

.s3-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  position: relative;
  z-index: 1;
}

.s3-text {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.s3-aside {
  display: flex;
  flex-direction: column;
  gap: 28px;
  padding-left: 48px;
  border-left: 1px solid rgba(255, 255, 255, 0.15);
}

.s3-text h2     { color: #fff; }
.s3 .eyebrow-light { color: rgba(150, 195, 255, 0.9); letter-spacing: 0.18em; }
.s3-aside .lead { color: rgba(255, 255, 255, 0.6); }

.s3-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #FF5A3C;
  color: #fff;
  font-family: var(--font);
  font-size: var(--fs-button);
  font-weight: 700;
  padding: 14px 26px;
  border-radius: 8px;
  width: fit-content;
  transition: background 0.2s, gap 0.2s;
}
.s3-cta::after {
  content: '→';
  transition: transform 0.2s;
}
.s3-cta:hover { background: #e0482c; }
.s3-cta:hover::after { transform: translateX(4px); }



/* ══════════════════════════════════════
   SECTION 4 – WER BIN ICH
   ══════════════════════════════════════ */
.s4 {
  background: var(--off-white);
  padding: 110px 0;
  padding-bottom:0;
  display: flex;
  justify-content: center;
}

.s4-inner {
  display: grid;
  grid-template-columns: 5fr 4fr;
  gap: 80px;
  align-items: center;
}

.s4-imgs {
  display: grid;
  grid-template-columns: 3fr 2fr;
  grid-template-rows: 1fr 1fr;
  gap: 10px;
  height: 560px;
}

.s4-img-a {
  grid-row: 1 / span 2;
  border-radius: 10px;
  overflow: hidden;
}



.s4-img-b,
.s4-img-c {
  border-radius: 10px;
  overflow: hidden;
}

.s4-text {
  display: flex;
  flex-direction: column;
  gap: 22px;
  align-items: flex-start;
}
.no-after::after {
    content: none !important;
}
.s4-text h2    { margin-bottom: 4px; }
.s4-text p     { font-size: var(--fs-lead); line-height: var(--lh-body); color: var(--mid); font-family: var(--font-body); }


/* ════════════════════════════════════════════════════
   SECTION 4 – Liste
   ════════════════════════════════════════════════════ */


.lining{
  width: 100%;
  height:2px;
  margin-top:3rem;
  background-color: var(--border);
}
.s-list{
  display: flex;
  justify-content: center;
  background-color: var(--off-white);
  width: 100%;
  padding:60px 0px;
}
.wrap-con{
  width:90%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3rem;
}
.single-wrap{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-left: 2rem;
  border-left: solid var(--orange) 1.5px; 

}
h3 {
  font-size: clamp(20px, 2.6vw, 25px);
  font-weight: 800;
  line-height: 1.4;
  letter-spacing: -0.02em;
  color: var(--dark);
  padding-bottom: 1.3rem;
}
/* ══════════════════════════════════════
   SECTION REFERENZEN
   ══════════════════════════════════════ */
.s-ref {
  background: var(--off-white);
  padding: 110px 0;
  display: flex;
  justify-content: center;
}

.s-ref-header {
  margin-bottom: 56px;
}
.s-ref-header h2 { margin-bottom: 0; }

.ref-swiper .swiper-slide {
  height: auto;
  display: flex;
}

.ref-swiper .ref-card {
  min-height: 100%;
  width: 100%;
}

.ref-btn-prev,
.ref-btn-next {
  width: 44px !important;
  height: 44px !important;
  background: var(--white);
  border: 1.5px solid var(--border);
  border-radius: 50%;
  top: auto !important;
  bottom: 0 !important;
  transition: border-color 0.2s, background 0.2s;
}
.ref-btn-prev { left: auto !important; right: 60px !important; }
.ref-btn-next { right: 0 !important; }

.ref-btn-prev::after,
.ref-btn-next::after {
  font-size: 14px !important;
  color: var(--dark);
  font-weight: 700;
  transition: color 0.2s;
}
.ref-btn-prev:hover,
.ref-btn-next:hover {
  background: var(--orange);
  border-color: var(--orange);
}
.ref-btn-prev:hover::after,
.ref-btn-next:hover::after {
  color: var(--white);
}

.ref-swiper {
  padding-bottom: 64px !important;
}

.ref-pagination .swiper-pagination-bullet {
  background: var(--border);
  opacity: 1;
  width: 8px;
  height: 8px;
  transition: background 0.2s, transform 0.2s;
}
.ref-pagination .swiper-pagination-bullet-active {
  background: var(--orange);
  transform: scale(1.3);
}

.ref-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 36px 32px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  transition: box-shadow 0.2s;
}
.ref-card:hover {
  box-shadow: 0 4px 24px rgba(0,0,0,0.06);
}

.ref-text.is-clamped {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ref-read-more {
  display: inline-block;
  margin-top: 8px;
  font-size: 13px;
  font-weight: 700;
  color: var(--orange);
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  font-family: var(--font);
  transition: opacity 0.15s;
}
.ref-read-more:hover { opacity: 0.65; }

.ref-quote-mark {
  font-size: 52px;
  font-weight: 800;
  line-height: 1;
  color: var(--orange);
  font-family: Georgia, serif;
  margin-bottom: -8px;
}

.ref-text {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--mid);
  font-family: var(--font-body);
  flex: 1;
}

.ref-footer {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: auto;
}

.ref-divider {
  width: 100%;
  height: 1px;
  background: var(--border);
}

.ref-author {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ref-name {
  font-size: 15px;
  font-weight: 700;
  color: var(--dark);
}

.ref-type {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--orange);
}

/* ══════════════════════════════════════
   SECTION 5 – FÜR WEN
   ══════════════════════════════════════ */
.s5 {
  background: var(--white);
  padding: 110px 0;
  display: flex;
  justify-content: center;
}

.s5-inner {
  display: grid;
  grid-template-columns: 4fr 5fr;
  gap: 80px;
  align-items: center;
}

.s5-img-wrap { position: relative; }

.s5-float-badge {
  position: absolute;
  bottom: -1px;
  right: -1px;
  background: var(--orange);
  color: #fff;
  border-radius: 10px 0 0 0;
  padding: 20px 26px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
}

.s5-text {
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.s5-text h2  { margin-bottom: 4px; }
.s5-text > p { font-size: 15.5px; line-height: 1.8; color: var(--mid); }

.aud-cards {
  display: flex;
  flex-direction: column;
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}
.round-acc{
  border:solid var(--white) 1px;
  border-radius:10px;
}
.aud-card {
  background: var(--white);
  padding: 26px 30px;
  display: grid;
  grid-template-columns: 3px 1fr;
  gap: 22px;
  align-items: start;
}

.aud-stripe {
  width: 3px;
  height: 100%;
  background: var(--orange);
  border-radius: 2px;
  margin-top: 3px;
}

.aud-inner-title {
  font-size: 17px;
  font-weight: 700;
  color: var(--dark);
  margin-bottom: 6px;
}
.aud-inner-text {
  font-size: var(--fs-body);
  line-height: var(--lh-tight);
  color: var(--mid);
  font-family: var(--font-body);
}





/* ══════════════════════════════════════
   SECTION SCHMERZENSFRAGEN
   ══════════════════════════════════════ */
.s-pain {
  background: var(--white);
  padding: 100px 0;
  display: flex;
  justify-content: center;
  border-bottom: 1px solid var(--border);
}

.s-pain-header {
  margin-bottom: 60px;
}
.s-pain-header h2 {
  margin-top: 0;
  margin-bottom: 0;
}

.s-pain-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.pain-card {
  border: 1px solid var(--orange);
  border-radius: 14px;
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: box-shadow 0.2s, border-color 0.2s;
}
.pain-card:hover {
  box-shadow: 0 6px 24px rgba(0,0,0,0.07);
  border-color: var(--orange);
}

.pain-question {
  font-size: var(--fs-question);
  font-weight: 700;
  line-height: 1.35;
  color: var(--dark);
  margin: 0;
}

.pain-answer {
  font-size: var(--fs-body);
  line-height: var(--lh-tight);
  color: var(--mid);
  margin: 0;
  font-weight: 400;
  font-family: var(--font-body);
}

.pain-tag {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--orange);
  opacity: 0.8;
}


.s-contact {
  background: var(--dark);
  padding: 120px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}


.contact-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
  max-width: 580px;
  width: 90%;
}

.contact-heading {
  color: #fff;
  font-size: clamp(36px, 4vw, 56px);
  margin: 0;
}

.contact-sub {
  font-size: var(--fs-lead);
  line-height: var(--lh-body);
  color: rgba(255,255,255,0.58);
  max-width: 460px;
  margin: 0;
  font-family: var(--font-body);
}

.contact-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--orange);
  color: #fff;
  font-family: var(--font);
  font-size: var(--fs-button);
  font-weight: 700;
  padding: 16px 34px;
  border-radius: 8px;
  transition: background 0.2s;
}
.contact-cta:hover {
  background: #cd5419;
}

.contact-note {
  font-size: 12px;
  color: rgba(255,255,255,0.28);
  letter-spacing: 0.04em;
  margin: 0;
}


@media(min-width: 1024px) and (max-width: 1366px){
    h1{
        font-size:3.5rem /*3.4remmax*/;

    }
    .inner-par{
        font-size: 1.3rem/*1.5remmax*/;
        line-height: 2rem /*2.4r*/;
    }
    

}
@media(max-width: 1200px){
    
    .header-wraper{
        position: relative;
        justify-content: flex-end;
        align-items: flex-start;

    }
    .inner-wrapper{
        position: absolute;
        bottom:0px;
        padding-bottom:0;
        left:0;
        margin-bottom: 0rem;
    }
    .bigbub-two{
        padding-bottom: 0;
        background-color: var(--off-white);
        height:auto;
        flex-direction: column;
        align-items: flex-end;
    }
    .main-image {
  -webkit-mask-image:
    linear-gradient(to left, rgba(0,0,0,1) 60%, rgba(0,0,0,0)),
    linear-gradient(to bottom, rgba(0,0,0,1) 10%, rgba(0,0,0,0)) !important;

  mask-image:
    linear-gradient(to left, rgba(0,0,0,1) 60%, rgba(0,0,0,0)),
    linear-gradient(to bottom, rgba(0,0,0,1) 40%, rgba(0,0,0,0)) !important;

  -webkit-mask-composite: source-in;
  mask-composite: intersect;
}
    .main-image img{
        height:85vh !important;
    }
    .list-wrapper {
        display: none;
    }
    .mobile-list {
        display: block;
        width: 100%;
        margin-top:3rem;
        border-top: 1px solid var(--border);
        border-bottom: 1px solid var(--border);
        background: var(--off-white);
    }
    .mob-list {
        width: 95%;
        margin: 0 auto;
        display: flex;
        flex-direction: row;
        list-style: none;
        padding: 0;
        gap: 0;
    }
    .mob-li {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 0.6rem;
        flex: 1;
        padding: 1rem 0rem 1rem 1rem  ;
        border-right: 1px solid var(--border);
    }
    .la-mob-li {
        border-right: none;
    }
    .icon-ch {
        color: var(--orange);
        font-size: 1.3rem;
        flex-shrink: 0;
        font-variation-settings: 'FILL' 0, 'wght' 300 !important;
    }
    .in-mob-list h6 {
        font-family: "Mont";
        font-size: 0.8rem;
        font-weight: 600;
        color: var(--dark);
        margin: 0;
        line-height: 1.35;
    }

    .inner-par{
        font-size: clamp(1rem, 0.376rem + 1.299vw, 1.35rem);
        line-height: clamp(1.8rem, 0.729rem + 2.227vw, 2.4rem);
        padding-top: clamp(1rem, -0.784rem + 3.712vw, 2rem);
        padding-bottom: clamp(1rem, -0.784rem + 3.712vw, 2rem);
    }
    h1{
        font-size: clamp(2.85rem, 1.869rem + 2.042vw, 3.4rem);

    }
    .cta-termin{
        width:100%;
    }


}

@media(max-width: 1024px){
  .s-pain-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .s2-grid{
    grid-template-columns: 100%;
  }
  /* s-ref-grid → jetzt Swiper, keine Grid-Overrides nötig */
  .sw-inner {
    grid-template-columns: 1fr;
    gap: 48px;
  }
  .sw-img-wrap {
    display: none;
  }
  .s5-inner {
    grid-template-columns: 1fr;
  }
  .s5-img-wrap {
    display: none;
  }
  .wrap-con {
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }
}
@media(max-width: 768px){
  .mobile-list{
    background: transparent;
  }
    .header-wraper{
        flex-direction: column;
        width: 100%;
        position: relative;
    }
    .main-image{
        display: none;
    }
    .lining{
      display: none !important;
    }
    .pain-card{
      padding: clamp(1.25rem, 0.643rem + 2.696vw, 1.938rem) clamp(0.938rem, 0.221rem + 3.186vw, 1.75rem);
    }
    .image-wrapper-mob{
        display: block;
        width: 100%;
        height: auto;
        -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,0));
        mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,0));
    }
    .image-wrapper-mob img{
        object-fit: contain;
        width: 100%;
        height: auto;
    }
    .inner-wrapper {
        position: absolute;
        bottom:0px;
        left:50%;
        transform: translateX(-50%);
        justify-content: flex-end !important;
        width: 90%;
        padding-bottom:0;
        height: 100vh;
    }
    .aud-card{
      padding: 25px clamp(0.938rem, 0.221rem + 3.186vw, 1.75rem);
    }
    .sw-note{
      padding:22px clamp(0.625rem, -0.092rem + 3.186vw, 1.438rem);
    }
    .list-wrapper,
    .inner-par {
        display: none;
    }
    .mob-list {
        display: grid;
        grid-template-columns: 1fr 1fr;
        width: 92%;
    }
    .mob-li {
        padding: 1rem 1rem 1rem 0;
        gap: 0.5rem;
        min-width: 0;
        border-right: none;
        border-bottom: 1px solid var(--border);
    }
    .mob-li:nth-child(odd) {
        border-right: 1px solid var(--border);
    }
    .la-mob-li {
        grid-column: 1 / -1;
        border-bottom: none;
        border-right: none;
    }
    .in-mob-list h6 {
        font-size: 0.78rem;
        overflow-wrap: break-word;
        word-break: break-word;
    }
    .inner-par-mob{
        display: block;
        font-family: 'Mont-med';
        color: rgb(90, 89, 89);
        font-size: clamp(1.1rem, 0.747rem + 1.569vw, 1.5rem);
        line-height: 2.4rem;
        margin: 0;
        padding-top:clamp(0.5rem, 0.059rem + 1.961vw, 1rem);
        line-height: clamp(1.8rem, 1.271rem + 2.353vw, 2.4rem);
    }
    
    .bigbub-two{
        padding-bottom: 0;
        background-color: white;
    }
    .cta-termin{
        width:100%;
    }
    h1{
        font-size: clamp(1.7rem, 0.2rem + 6.667vw, 3.4rem);
        line-height: clamp(2.4rem, 0.459rem + 8.627vw, 4.6rem);
    }
    

    /* s-pain */
    .s-pain {
      padding: 64px 0;
    }
    .s-pain-grid {
      grid-template-columns: 1fr;
      gap: 12px;
    }

    .s3-inner {
      grid-template-columns: 1fr;
      gap: 36px;
    }
    .s3-aside {
      padding-left: 0;
      border-left: none;
      padding-top: 36px;
      border-top: 1px solid rgba(255, 255, 255, 0.15);
    }

    /* s-welcome */
    .sw-inner {
      grid-template-columns: 1fr;
      gap: 36px;
    }
    .sw-heading {
      font-size: clamp(36px, 9vw, 52px);
      margin-bottom: 24px;
    }
    .s-welcome {
      padding: 64px 0;
    }

    /* s2 cards */
    .srv {
      padding: 36px 24px;
    }

    /* s-list */
    .s-list {
      padding: 48px 0;
    }
    .wrap-con {
      grid-template-columns: 1fr;
      gap: 0;
    }
    .single-wrap {
      padding-left: 1.2rem;
      padding-top: 1.4rem;
      padding-bottom: 1.4rem;
      border-left: 2px solid var(--orange);
      border-bottom: 1px solid var(--border);
    }
    .single-wrap:last-child {
      border-bottom: none;
    }

    /* s-ref */
    .s-ref {
      padding: 64px 0;
    }

    /* s4 */
    .s4-inner {
      grid-template-columns: 1fr;
    }
    .s4-imgs {
      height: 340px;
    }
    .s4 {
      padding: 64px 0;
      padding-bottom: 0;
    }

    /* s5 */
    .s5 {
      padding: 64px 0;
    }
    .s5-inner {
      grid-template-columns: 1fr;
    }
    .s5-img-wrap {
      display: none;
    }
}

@media(max-width: 480px) {
    .mob-list {
        display: flex;
        flex-direction: column;
        width: 90%;
        gap: 0;
    }
    .mob-li {
        flex-direction: row;
        align-items: center;
        text-align: left;
        border-right: none !important;
        border-bottom: 1px solid var(--border);
        padding: 0.8rem 0;
        gap: 0.75rem;
    }
    .la-mob-li {
        border-bottom: none;
        grid-column: auto;
    }
    .in-mob-list h6 {
        font-size: 0.8rem;
    }
}


/* ══ Touch-Geräte: Hover-Effekte via JS-Klasse deaktivieren ══ */
html.touch-device .pain-card:hover       { box-shadow: none; border-color: var(--border); }
html.touch-device .ref-card:hover        { box-shadow: none; }
html.touch-device .srv-btn:hover         { background: transparent; color: var(--orange); }
html.touch-device .srv-btn:hover::after  { transform: none; }
html.touch-device .link-arrow:hover      { gap: 8px; }
html.touch-device .contact-cta:hover,
html.touch-device .s3-cta:hover,
html.touch-device .btn-primary:hover     { background: var(--orange); }
html.touch-device .ft-cta:hover          { border-color: rgba(255,255,255,0.15); color: rgba(255,255,255,0.7); background: transparent; }
html.touch-device .ft-col ul li a:hover  { color: rgba(255,255,255,0.48); }
html.touch-device .ft-legal a:hover      { color: rgba(255,255,255,0.22); }
html.touch-device .ft-contact-link:hover { color: rgba(255,255,255,0.38); }

/* ══════════════════════════════════════
   FOOTER
   ══════════════════════════════════════ */

/* Override altes footer-Element-Styling aus common.css */
footer.site-footer {
  background: #0D0D0D;
  padding: 0;
  display: block;
  border-top: 1px solid rgba(255, 102, 0, 0.25);
  user-select: none;
}

.ft-inner {
  width: 90%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 5fr 7fr;
  gap: 80px;
  padding: 80px 0 72px;
}

/* ── Brand-Spalte ── */
.ft-brand {
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.ft-logo {
  width: 110px;
  height: auto;
  filter: brightness(0) invert(1);
  opacity: 0.9;
}

.ft-tagline {
  font-size: 14.5px;
  line-height: 1.75;
  color: rgba(255,255,255,0.42);
  font-family: "Mont-med";
  margin: 0;
}

.ft-contact-block {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.ft-contact-link {
  font-size: 13.5px;
  color: rgba(255,255,255,0.38);
  text-decoration: none;
  font-family: "Mont-med";
  transition: color 0.18s;
  cursor: text;
}
a.ft-contact-link { cursor: pointer; }
a.ft-contact-link:hover { color: var(--orange, #ff6600); }

.ft-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  padding: 13px 26px;
  background: transparent;
  border: 1.5px solid rgba(255,255,255,0.15);
  border-radius: 8px;
  font-size: 13.5px;
  font-weight: 700;
  color: rgba(255,255,255,0.7);
  font-family: var(--font, 'Mont');
  text-decoration: none;
  transition: border-color 0.2s, color 0.2s, background 0.2s;
}
.ft-cta:hover {
  border-color: var(--orange, #ff6600);
  color: var(--orange, #ff6600);
  background: rgba(255,102,0,0.06);
}

/* ── Nav-Spalten ── */
.ft-nav {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  padding-top: 4px;
}

.ft-col-head {
  display: block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--orange, #ff6600);
  margin-bottom: 22px;
  font-family: "Mont";
}

.ft-col ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 13px;
}

.ft-col ul li a {
  font-size: 14px;
  color: rgba(255,255,255,0.48);
  text-decoration: none;
  font-family: "Mont-med";
  transition: color 0.18s;
  line-height: 1.4;
}
.ft-col ul li a:hover { color: rgba(255,255,255,0.95); }

/* ── Bottom Bar ── */
.ft-bottom {
  border-top: 1px solid rgba(255,255,255,0.06);
}

.ft-bottom-inner {
  width: 90%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 22px 0;
}

.ft-copy {
  font-size: 12px;
  color: rgba(255,255,255,0.22);
  font-family: "Mont-med";
  margin: 0;
}

.ft-legal {
  display: flex;
  gap: 28px;
}

.ft-legal a {
  font-size: 12px;
  color: rgba(255,255,255,0.22);
  text-decoration: none;
  font-family: "Mont-med";
  transition: color 0.18s;
}
.ft-legal a:hover { color: rgba(255,255,255,0.6); }

/* ── Responsive ── */
@media (max-width: 1024px) {
  .ft-inner {
    grid-template-columns: 1fr 1fr;
    gap: 56px;
  }
  .ft-nav {
    grid-template-columns: 1fr 1fr;
    gap: 32px;
  }
}

@media (max-width: 768px) {
  .ft-inner {
    grid-template-columns: 1fr;
    gap: 44px;
    padding: 56px 0 48px;
  }
  .ft-nav {
    grid-template-columns: 1fr 1fr;
    gap: 28px;
  }
  .ft-bottom-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding: 20px 0;
  }
}

@media (max-width: 480px) {
  .ft-nav {
    grid-template-columns: 1fr;
  }
}