/* Babsi SOLL fidelity layer */
html,
body {
background: #0D0D0D !important;
}
@keyframes babsi-marquee {
from { transform: translate3d(0,0,0); }
to { transform: translate3d(-50%,0,0); }
}
/* Header */
.elementor-location-header .elementor-widget-theme-site-logo,
.elementor-location-header img[src*="placeholder.png"] {
display: none !important;
}
.babsi-site-header {
background: #0D0D0D !important;
min-height: 70px !important;
}
/*
* Elementor sticky clones the header: active (fixed) + spacer (in-flow).
* Never force the spacer visible — that paints two headers on top of each other.
*/
.babsi-site-header.elementor-sticky__spacer,
.elementor-element-216a2b6.elementor-sticky__spacer,
.elementor-location-header .elementor-sticky__spacer {
visibility: hidden !important;
opacity: 0 !important;
pointer-events: none !important;
}
.babsi-header-inner.e-con,
.babsi-header-inner > .e-con-inner {
max-width: 1400px !important;
margin-inline: auto !important;
width: 100% !important;
}
.babsi-header-logo {
flex: 0 0 auto !important;
}
.babsi-header-logo img,
.babsi-logo-mark img {
height: 42px !important;
width: auto !important;
max-width: none !important;
display: block !important;
}
.babsi-header-wordmark .elementor-heading-title {
line-height: 1 !important;
margin: 0 !important;
}
.babsi-header-right {
flex: 0 0 auto !important;
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: center !important;
gap: 30px !important;
max-width: none !important;
}
.babsi-header-nav {
flex: 0 0 auto !important;
width: auto !important;
max-width: none !important;
}
.babsi-header-nav .elementor-nav-menu--main,
.babsi-header-nav .elementor-nav-menu {
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: center !important;
gap: 30px !important;
margin: 0 !important;
}
.babsi-header-nav .elementor-nav-menu--main > .elementor-nav-menu > li,
.babsi-header-nav .elementor-nav-menu > li {
margin: 0 !important;
padding: 0 !important;
float: none !important;
display: flex !important;
align-items: center !important;
}
.elementor-location-header a:not(.elementor-sub-item):not(.elementor-item-active):not(.highlighted) {
text-decoration: none !important;
}
.elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu > li > a,
.elementor-location-header .babsi-header-brand a,
.elementor-location-header .babsi-header-cta a {
color: #F7F3EC !important;
}
/* Dropdown: cream panel + dark text — desktop nav only (never mobile overlay) */
.babsi-header-nav .elementor-nav-menu--dropdown,
.babsi-header-nav .elementor-nav-menu--dropdown .elementor-nav-menu,
.babsi-header-nav nav ul.sub-menu,
.babsi-header-nav .elementor-nav-menu--dropdown.elementor-nav-menu__container {
background: #FFFCFA !important;
background-color: #FFFCFA !important;
border: 1px solid #E8DFD2 !important;
box-shadow: 0 24px 60px rgba(61, 50, 43, .2) !important;
min-width: 230px !important;
padding: 10px 0 !important;
margin-top: 0 !important;
}
.babsi-header-nav .elementor-nav-menu--dropdown a,
.babsi-header-nav .elementor-nav-menu--dropdown .elementor-item,
.babsi-header-nav .elementor-nav-menu--dropdown .elementor-sub-item,
.babsi-header-nav nav ul.sub-menu a,
.babsi-header-nav .elementor-nav-menu--dropdown a.elementor-sub-item {
color: #3D322B !important;
background: transparent !important;
background-color: transparent !important;
font-family: Manrope, system-ui, sans-serif !important;
font-size: 14.5px !important;
font-weight: 400 !important;
letter-spacing: 0 !important;
text-transform: none !important;
padding: 10px 22px !important;
white-space: nowrap !important;
}
.babsi-header-nav .elementor-nav-menu--dropdown a:hover,
.babsi-header-nav .elementor-nav-menu--dropdown .elementor-item:hover,
.babsi-header-nav .elementor-nav-menu--dropdown .elementor-sub-item:hover,
.babsi-header-nav .elementor-nav-menu--dropdown .elementor-item.highlighted,
.babsi-header-nav .elementor-nav-menu--dropdown .current-menu-item > a,
.babsi-header-nav .elementor-nav-menu--dropdown .current-menu-item .elementor-sub-item,
.babsi-header-nav nav ul.sub-menu a:hover {
background: #F7F3EC !important;
background-color: #F7F3EC !important;
color: #8F6E3D !important;
}
.elementor-location-header .elementor-nav-menu--main .elementor-item {
color: #F7F3EC !important;
font-family: Manrope, system-ui, sans-serif !important;
font-size: 12.5px !important;
letter-spacing: .1em !important;
text-transform: uppercase !important;
font-weight: 500 !important;
padding: 10px 0 !important;
white-space: nowrap !important;
border: 0 !important;
background: transparent !important;
}
.elementor-location-header .elementor-nav-menu--main .elementor-item:hover,
.elementor-location-header .elementor-nav-menu--main .elementor-item.elementor-item-active,
.elementor-location-header .elementor-nav-menu--main .elementor-item.highlighted {
color: #D4B896 !important;
}
.elementor-location-header .elementor-nav-menu--main .sub-arrow {
color: #C4A574 !important;
font-size: 9px !important;
margin-left: 7px !important;
}
.babsi-header-cta .elementor-button {
background: linear-gradient(135deg, #D4B896, #B8956A) !important;
color: #2A211B !important;
border: 0 !important;
border-radius: 999px !important;
padding: 12px 22px !important;
font-family: Manrope, system-ui, sans-serif !important;
font-size: 12.5px !important;
font-weight: 600 !important;
letter-spacing: .12em !important;
text-transform: uppercase !important;
box-shadow: 0 10px 26px rgba(184,149,106,.28) !important;
white-space: nowrap !important;
}
.babsi-header-cta .elementor-button:hover {
transform: translateY(-2px);
box-shadow: 0 16px 36px rgba(184,149,106,.42) !important;
}
.babsi-header-mobile .elementor-menu-toggle {
border: 1px solid rgba(196,165,116,.55) !important;
border-radius: 999px !important;
padding: 10px 18px !important;
background: transparent !important;
color: #F7F3EC !important;
min-height: 44px !important;
}
/* Hero */
.babsi-hero {
position: relative !important;
overflow: hidden !important;
min-height: calc(100vh - 72px) !important;
background: #0D0D0D !important;
}
.babsi-hero::before,
.babsi-hero::after {
content: "";
position: absolute;
border-radius: 50%;
pointer-events: none;
z-index: 0;
aspect-ratio: 1;
}
.babsi-hero::before {
right: -12%;
top: -35%;
width: min(62%, 900px);
background: radial-gradient(circle, rgba(196,165,116,.38), rgba(196,165,116,0) 65%);
}
.babsi-hero::after {
left: -10%;
bottom: -40%;
width: min(45%, 640px);
background: radial-gradient(circle, rgba(232,223,210,.16), rgba(232,223,210,0) 65%);
}
.babsi-hero > .e-con,
.babsi-hero .e-con.e-child {
position: relative;
z-index: 1;
}
@media (min-width: 1025px) {
.babsi-hero.e-flex {
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: stretch !important;
}
.babsi-hero > .e-con.e-child {
width: 50% !important;
max-width: 50% !important;
flex: 0 0 50% !important;
}
/* Media column: full-bleed portrait, flush right + bottom */
.babsi-hero-media {
position: relative !important;
display: block !important;
overflow: hidden !important;
background: transparent !important;
padding: 0 !important;
min-height: 100% !important;
}
.babsi-hero-media .elementor-widget-image,
.babsi-hero-media .elementor-widget-container {
position: absolute !important;
inset: 0 !important;
width: 100% !important;
height: 100% !important;
margin: 0 !important;
padding: 0 !important;
display: block !important;
}
.babsi-hero-media img {
position: absolute !important;
top: 0 !important;
right: 0 !important;
bottom: 0 !important;
left: auto !important;
width: auto !important;
min-width: 140% !important;
max-width: none !important;
height: 100% !important;
margin: 0 !important;
margin-inline: 0 !important;
display: block !important;
object-fit: cover !important;
object-position: 52% center !important;
--babsi-hero-x: 0%;
/* Source has empty pad right of subject — crop past skin edge */
transform: translate3d(22%, var(--babsi-parallax-y, 0px), 0) !important;
}
}
.babsi-hero-copy .elementor-heading-title {
text-wrap: balance;
}
/* Marquee */
.babsi-marquee {
overflow: hidden;
border-top: 1px solid #E2D7C6;
border-bottom: 1px solid #E2D7C6;
background: #F7F3EC !important;
padding: 0 !important;
}
.babsi-marquee-track {
display: flex;
align-items: center;
width: max-content;
padding: 16px 0;
font-family: "Cormorant Garamond", Georgia, serif;
font-style: italic;
font-size: 28px;
color: #8F6E3D;
animation: babsi-marquee 70s linear infinite;
}
.babsi-marquee-track span.word { padding: 0 30px; white-space: nowrap; }
.babsi-marquee-track span.dot {
flex: none;
width: 7px;
height: 7px;
border: 1px solid #C4A574;
transform: rotate(45deg);
}
/* Values gold top rule */
.babsi-value-card {
border-top: 1px solid #C4A574 !important;
padding-top: 28px !important;
}
/* Behandlung overlap */
@media (min-width: 1025px) {
.babsi-behandlung.e-grid > .e-con-inner,
.babsi-behandlung.e-con.e-grid {
align-items: center !important;
}
.babsi-behandlung-card {
margin-left: -72px !important;
position: relative;
z-index: 2;
box-shadow: 0 30px 80px rgba(61,50,43,.14) !important;
}
}
.babsi-behandlung-media img {
width: 100% !important;
height: auto !important;
aspect-ratio: 4/3;
object-fit: cover;
}
/* Vorteile */
.babsi-figur img {
width: 100% !important;
aspect-ratio: 3/4;
object-fit: cover;
max-height: 720px;
}
/* Zones */
.babsi-zone-card {
background: #F7F3EC !important;
border: 1px solid #E8DFD2 !important;
transition: box-shadow .5s ease;
}
.babsi-zone-card:hover {
box-shadow: 0 26px 60px rgba(61,50,43,.16);
}
.babsi-zone-card .elementor-widget-image img {
width: 100% !important;
aspect-ratio: 4/5 !important;
object-fit: cover !important;
height: auto !important;
}
/* Price rows */
.babsi-price-row {
display: flex;
align-items: baseline;
gap: 12px;
padding: 13px 0;
border-bottom: 1px solid #EFE7DB;
font-size: 16px;
color: #3D322B;
font-family: Manrope, system-ui, sans-serif;
}
.babsi-price-row .dots {
flex: 1;
border-bottom: 1px dotted #C4A574;
transform: translateY(-5px);
}
.babsi-price-row .price {
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 23px;
font-weight: 600;
line-height: 1;
}
/* Floating WA: SOLL circular FAB bottom-right */
.babsi-wa-float {
position: fixed !important;
right: 18px !important;
bottom: calc(18px + env(safe-area-inset-bottom)) !important;
left: auto !important;
width: 58px !important;
min-width: 58px !important;
max-width: 58px !important;
z-index: 9999 !important;
padding: 0 !important;
margin: 0 !important;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
}
.babsi-wa-float .elementor-widget-container,
.babsi-wa-float .elementor-button-wrapper {
margin: 0 !important;
padding: 0 !important;
}
.babsi-wa-float .elementor-button {
width: 58px !important;
height: 58px !important;
min-width: 58px !important;
min-height: 58px !important;
padding: 0 !important;
border-radius: 999px !important;
background: #25D366 !important;
background-image: none !important;
border: 0 !important;
box-shadow: 0 10px 28px rgba(37, 211, 102, .45) !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
font-size: 0 !important;
letter-spacing: 0 !important;
color: transparent !important;
overflow: hidden !important;
}
.babsi-wa-float .elementor-button-content-wrapper,
.babsi-wa-float .elementor-button-text {
font-size: 0 !important;
line-height: 0 !important;
color: transparent !important;
width: 28px !important;
height: 28px !important;
padding: 0 !important;
margin: 0 !important;
display: block !important;
}
.babsi-wa-float .elementor-button-text::before,
.babsi-wa-float a.elementor-button[href*="wa.me"] .elementor-button-text::before {
content: "" !important;
display: block !important;
width: 28px !important;
height: 28px !important;
margin: 0 !important;
background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M12.04 2C6.58 2 2.15 6.4 2.15 11.84c0 1.99.58 3.84 1.59 5.42L2 22l4.9-1.58a9.86 9.86 0 0 0 5.14 1.42h.01c5.46 0 9.89-4.4 9.89-9.84C21.94 6.4 17.5 2 12.04 2zm5.76 13.99c-.24.68-1.4 1.25-1.94 1.33-.5.07-1.13.1-1.82-.11-.42-.13-.96-.31-1.65-.61-2.9-1.26-4.79-4.18-4.93-4.38-.14-.2-1.15-1.53-1.15-2.92 0-1.39.73-2.07.99-2.35.26-.28.57-.35.76-.35h.55c.17 0 .4-.06.63.48.24.56.81 1.97.88 2.11.07.14.12.31.02.5-.1.2-.15.32-.3.49-.14.17-.3.38-.43.51-.14.14-.29.29-.12.57.16.28.73 1.2 1.56 1.94 1.08.96 1.98 1.26 2.26 1.4.28.14.44.12.61-.07.16-.2.7-.81.89-1.09.19-.28.38-.23.63-.14.26.1 1.64.77 1.92.91.28.14.47.21.54.32.07.12.07.68-.17 1.36z'/%3E%3C/svg%3E") !important;
}
.babsi-wa-float .elementor-button:hover {
transform: translateY(-2px) scale(1.04);
box-shadow: 0 14px 34px rgba(37, 211, 102, .55) !important;
background: #25D366 !important;
color: transparent !important;
}
@media (max-width: 899px) {
.babsi-wa-float {
right: 16px !important;
left: auto !important;
bottom: calc(16px + env(safe-area-inset-bottom)) !important;
width: 56px !important;
max-width: 56px !important;
}
.babsi-wa-float .elementor-button-wrapper,
.babsi-wa-float .elementor-button {
width: 56px !important;
height: 56px !important;
}
}
/* Footer links */
.elementor-location-footer a {
color: rgba(247,243,236,.78) !important;
}
.elementor-location-footer a:hover {
color: #D4B896 !important;
}
/* Section rhythm */
.babsi-section-pad {
padding-block: clamp(72px, 9vw, 120px) !important;
}
/* Hero brand scale */
.babsi-hero-brand .elementor-heading-title {
font-size: clamp(54px, 7.4vw, 108px) !important;
line-height: .94 !important;
letter-spacing: -.015em !important;
font-weight: 500 !important;
color: #FFFCFA !important;
}
.babsi-hero-copy {
padding-left: clamp(20px, 4vw, 56px) !important;
padding-right: clamp(16px, 2vw, 40px) !important;
}
.babsi-hero-media { overflow: hidden !important; }
.babsi-hero-media img,
.babsi-hero-img img {
width: min(100%, 660px) !important;
max-width: 100% !important;
height: auto !important;
margin-inline: auto !important;
display: block !important;
object-fit: cover !important;
}
@media (min-width: 1025px) {
.babsi-hero-media img,
.babsi-hero-img img {
position: absolute !important;
top: 0 !important;
right: 0 !important;
bottom: 0 !important;
left: auto !important;
width: auto !important;
min-width: 140% !important;
max-width: none !important;
height: 100% !important;
margin: 0 !important;
margin-inline: 0 !important;
object-fit: cover !important;
object-position: 52% center !important;
--babsi-hero-x: 0%;
transform: translate3d(22%, var(--babsi-parallax-y, 0px), 0) !important;
}
}
@keyframes babsi-orbB {
from { transform: translate3d(0,0,0) scale(1); }
to { transform: translate3d(-140px,130px,0) scale(.82); }
}
@keyframes babsi-orbC {
from { transform: translate3d(0,0,0) scale(1); }
to { transform: translate3d(110px,140px,0) scale(1.2); }
}
.babsi-hero::before { animation: babsi-orbB 18s ease-in-out infinite alternate; }
.babsi-hero::after { animation: babsi-orbC 22s ease-in-out infinite alternate; }
@media (min-width: 1025px) {
.babsi-behandlung-grid.e-grid,
.babsi-behandlung.e-grid {
grid-template-columns: 1.15fr .95fr !important;
}
.babsi-behandlung-card {
margin-left: -96px !important;
margin-block: 36px !important;
background: #FFFCFA !important;
box-shadow: 0 30px 80px rgba(61,50,43,.14) !important;
}
.babsi-behandlung-media { min-height: 520px !important; }
.babsi-behandlung-media img {
height: 100% !important;
min-height: 520px !important;
object-fit: cover !important;
aspect-ratio: auto !important;
}
}
.babsi-preise .elementor-widget-html { width: 100%; }
/* Tablet/mobile hero: stack, no phantom media plate */
@media (max-width: 1024px) {
.babsi-hero.e-flex { flex-direction: column !important; min-height: auto !important; }
.babsi-hero > .e-con.e-child {
width: 100% !important; max-width: 100% !important; flex: 1 1 auto !important;
}
.babsi-hero-copy {
padding: 48px 20px 28px !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
text-align: center !important;
}
.babsi-hero-copy .elementor-heading-title,
.babsi-hero-copy .elementor-widget-text-editor,
.babsi-hero-copy .elementor-widget-text-editor p,
.babsi-hero-copy h1.elementor-heading-title,
.babsi-hero-brand .elementor-heading-title {
text-align: center !important;
}
.babsi-hero-copy .elementor-widget-button,
.babsi-hero-copy .elementor-button-wrapper {
width: 100% !important;
max-width: 340px !important;
margin-left: auto !important;
margin-right: auto !important;
margin-bottom: 10px !important;
text-align: center !important;
}
.babsi-hero-copy > .e-con:not(.babsi-hero-brand) {
width: 100% !important;
max-width: 340px !important;
margin-left: auto !important;
margin-right: auto !important;
align-items: stretch !important;
}
.babsi-hero-copy .elementor-button,
.babsi-hero-copy a.elementor-button {
width: 100% !important;
justify-content: center !important;
text-align: center !important;
}
.babsi-hero-brand .elementor-heading-title {
font-size: clamp(48px, 12vw, 72px) !important;
white-space: normal !important;
}
.babsi-hero-media {
min-height: 0 !important;
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
}
.babsi-behandlung-card { margin-left: 0 !important; margin-block: 0 !important; }
}
.babsi-hero-brand .elementor-heading-title { white-space: nowrap; }
@media (max-width: 1200px) {
.babsi-hero-brand .elementor-heading-title { white-space: normal !important; }
}
/* Header flex width fix — Elementor e-con-full was forcing 100% on logo+nav */
.babsi-header-inner.e-con,
.babsi-header-inner > .e-con-inner {
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: center !important;
justify-content: space-between !important;
width: 100% !important;
max-width: 1400px !important;
margin-inline: auto !important;
gap: 24px !important;
overflow: visible !important;
}
.babsi-header-logo.e-con,
.babsi-header-right.e-con,
.babsi-header-wordmark.e-con {
--width: auto !important;
width: auto !important;
max-width: max-content !important;
flex: 0 0 auto !important;
flex-grow: 0 !important;
flex-shrink: 0 !important;
flex-basis: auto !important;
min-width: 0 !important;
}
.babsi-header-logo {
margin-right: auto !important;
}
.babsi-header-right {
margin-left: auto !important;
gap: 30px !important;
}
.babsi-header-nav.elementor-widget,
.babsi-header-cta.elementor-widget {
width: auto !important;
max-width: none !important;
}
.elementor-location-header {
overflow-x: clip;
}
/* Final SOLL geometry: centered 1400px frame, not viewport-edge halves. */
@media (min-width: 1025px) {
.babsi-header-inner.e-con,
.babsi-header-inner > .e-con-inner {
padding-inline: 56px !important;
}
.babsi-hero-copy {
padding-left: max(56px, calc((100vw - 1400px) / 2 + 56px)) !important;
padding-right: 32px !important;
}
/* Portrait bleeds to viewport right — no inset gap */
.babsi-hero-media {
padding-right: 0 !important;
padding-left: 0 !important;
}
/*
* Boxed Elementor grids put their children in .e-con-inner. The previous
* outer-grid override compressed the whole treatment composition.
*/
.babsi-treatment-grid.e-grid {
grid-template-columns: 1fr !important;
}
.babsi-treatment-grid.e-grid > .e-con-inner {
--e-con-grid-template-columns: 1fr 1fr !important;
--e-con-grid-template-rows: 1fr !important;
grid-template-columns: 1fr 1fr !important;
grid-template-rows: 1fr !important;
align-items: center !important;
width: 1400px !important;
max-width: 1400px !important;
}
.babsi-treatment-grid .babsi-behandlung-card {
margin: 0 0 0 -72px !important;
padding: 44px 48px !important;
gap: 16px !important;
}
.babsi-treatment-grid .babsi-behandlung-media {
min-height: 0 !important;
padding: 0 !important;
}
.babsi-treatment-grid .babsi-behandlung-media img {
width: 100% !important;
min-height: 0 !important;
height: auto !important;
aspect-ratio: 4 / 3 !important;
object-fit: cover !important;
}
.babsi-treatment-grid .babsi-behandlung-card ul {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 12px 22px !important;
margin: 4px 0 !important;
padding: 0 !important;
}
}
.babsi-treatment-grid .babsi-behandlung-card ul {
list-style: none !important;
}
.babsi-treatment-grid .babsi-behandlung-card li {
position: relative;
padding-left: 20px;
}
.babsi-treatment-grid .babsi-behandlung-card li::before {
content: "";
position: absolute;
left: 2px;
top: .62em;
width: 7px;
height: 7px;
border: 1px solid #C4A574;
transform: rotate(45deg);
}
/* SOLL gallery: 2+1+1 / 1+1+2 masonry rhythm. */
.babsi-studio-gallery.e-grid > .e-con-inner {
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
grid-auto-rows: 190px !important;
}
.babsi-studio-gallery .babsi-gallery-item-1,
.babsi-studio-gallery .babsi-gallery-item-6 {
grid-column: span 2 !important;
}
.babsi-studio-gallery img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
}
/* Missing SOLL marks in closing CTA and footer. */
.babsi-cta-logo,
.babsi-footer-logo-row,
.babsi-footer-wordmark {
--width: auto !important;
width: auto !important;
max-width: max-content !important;
flex: 0 0 auto !important;
}
.babsi-cta-logo img {
display: block !important;
width: auto !important;
height: 72px !important;
}
.babsi-cta {
padding-block: clamp(110px, 10.5vw, 150px) !important;
}
.babsi-site-footer {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
gap: 36px !important;
}
.babsi-footer-logo-row img {
display: block !important;
width: auto !important;
height: 56px !important;
}
.babsi-footer-wordmark .elementor-heading-title {
margin: 0 !important;
line-height: 1 !important;
}
.babsi-footer-legal.e-con,
.babsi-footer-legal > .e-con-inner {
width: 1400px !important;
max-width: 1400px !important;
}
.babsi-footer-legal p {
margin: 0 !important;
}
@media (max-width: 1024px) {
.babsi-header-inner.e-con,
.babsi-header-inner > .e-con-inner {
min-height: 70px !important;
gap: 16px !important;
}
.babsi-header-inner.e-con {
padding: 0 !important;
}
.babsi-header-inner > .e-con-inner {
padding: 14px 20px !important;
}
.babsi-header-logo,
.babsi-header-wordmark {
padding: 0 !important;
}
.babsi-header-right,
.elementor-element-a77f98b,
/* Desktop-Nav darf auf Tablet/Mobile KEINEN zweiten Burger rendern */
.babsi-header-nav,
.elementor-element-b1b3722 {
display: none !important;
visibility: hidden !important;
pointer-events: none !important;
width: 0 !important;
height: 0 !important;
max-width: 0 !important;
max-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
.babsi-header-nav .elementor-menu-toggle,
.elementor-element-b1b3722 .elementor-menu-toggle,
.babsi-header-nav .elementor-nav-menu--dropdown,
.elementor-element-b1b3722 .elementor-nav-menu--dropdown {
display: none !important;
pointer-events: none !important;
visibility: hidden !important;
}
/* Toggle stays compact — panel is fixed full-bleed below header */
.babsi-header-mobile,
.elementor-element-4306390 {
display: block !important;
visibility: visible !important;
position: static !important;
width: auto !important;
max-width: none !important;
flex: 0 0 auto !important;
margin-left: auto !important;
overflow: visible !important;
}
.babsi-header-mobile .elementor-widget-container,
.elementor-element-4306390 .elementor-widget-container {
overflow: visible !important;
width: auto !important;
max-width: none !important;
}
.babsi-header-mobile .elementor-menu-toggle,
.elementor-element-4306390 .elementor-menu-toggle {
position: relative !important;
z-index: 10060 !important;
width: 44px !important;
height: 44px !important;
min-height: 44px !important;
padding: 10px !important;
margin-left: auto !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.elementor-location-header {
overflow: visible !important;
}
.babsi-site-header,
.babsi-header-inner.e-con,
.babsi-header-inner > .e-con-inner {
overflow: visible !important;
}
/*
* CLOSED mobile menu: display:none — never leave a fixed/scaleY(0)
* layer in the tree. iOS still hit-tests transformed zero-height nodes.
*/
.babsi-header-mobile .elementor-nav-menu--dropdown.elementor-nav-menu__container,
.elementor-element-4306390 .elementor-nav-menu--dropdown.elementor-nav-menu__container {
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
pointer-events: none !important;
transform: none !important;
position: static !important;
width: auto !important;
height: auto !important;
max-height: none !important;
overflow: hidden !important;
z-index: -1 !important;
}
/*
* OPEN only — full-bleed black panel under header
* (export/v1/pages/komponente-header.dc.html)
*/
body.babsi-mobile-nav-open .babsi-header-mobile .elementor-nav-menu--dropdown.elementor-nav-menu__container,
body.babsi-mobile-nav-open .elementor-element-4306390 .elementor-nav-menu--dropdown.elementor-nav-menu__container,
.babsi-header-mobile .elementor-nav-menu--dropdown.elementor-nav-menu__container[aria-hidden="false"],
.elementor-element-4306390 .elementor-nav-menu--dropdown.elementor-nav-menu__container[aria-hidden="false"],
.babsi-header-mobile .elementor-menu-toggle.elementor-active ~ .elementor-nav-menu--dropdown.elementor-nav-menu__container,
.elementor-element-4306390 .elementor-menu-toggle.elementor-active ~ .elementor-nav-menu--dropdown.elementor-nav-menu__container {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
pointer-events: auto !important;
transform: none !important;
position: fixed !important;
top: var(--babsi-header-offset, 70px) !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
width: 100vw !important;
min-width: 100vw !important;
max-width: 100vw !important;
height: auto !important;
min-height: calc(100dvh - var(--babsi-header-offset, 70px)) !important;
max-height: none !important;
margin: 0 !important;
padding: 10px clamp(20px, 5vw, 56px) 28px !important;
background: #0D0D0D !important;
background-color: #0D0D0D !important;
border: 0 !important;
border-top: 1px solid rgba(196, 165, 116, .25) !important;
border-radius: 0 !important;
box-shadow: none !important;
overflow-x: hidden !important;
overflow-y: auto !important;
z-index: 10070 !important;
box-sizing: border-box !important;
}
/* Keep sticky header visible — but never the spacer clone */
.elementor-location-header,
.elementor-location-header .elementor-element-216a2b6:not(.elementor-sticky__spacer),
.elementor-element-216a2b6:not(.elementor-sticky__spacer),
.babsi-site-header:not(.elementor-sticky__spacer) {
visibility: visible !important;
opacity: 1 !important;
pointer-events: auto !important;
}
.elementor-location-header .elementor-sticky__spacer,
.elementor-element-216a2b6.elementor-sticky__spacer,
.babsi-site-header.elementor-sticky__spacer {
visibility: hidden !important;
opacity: 0 !important;
pointer-events: none !important;
}
/* Kill Element Pack Lenis / UIKit fake document height (~15k px) */
html.lenis,
html.lenis body,
html,
body {
height: auto !important;
min-height: 0 !important;
overflow-x: hidden !important;
}
html {
--bdt-uik-root-scroll: auto !important;
}
/* Keep hamburger reachable — no hide-on-scroll on mobile/tablet */
html.babsi-nav-hidden .elementor-location-header {
transform: none !important;
}
.babsi-header-mobile .elementor-nav-menu--dropdown > .elementor-nav-menu,
.elementor-element-4306390 .elementor-nav-menu--dropdown > .elementor-nav-menu {
width: 100% !important;
max-width: 1400px !important;
margin: 0 auto !important;
display: flex !important;
flex-direction: column !important;
gap: 0 !important;
padding: 0 !important;
}
.babsi-header-mobile .elementor-nav-menu--dropdown > .elementor-nav-menu > li,
.elementor-element-4306390 .elementor-nav-menu--dropdown > .elementor-nav-menu > li {
display: block !important;
width: 100% !important;
float: none !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
}
.babsi-header-mobile .elementor-nav-menu--dropdown > .elementor-nav-menu > li > a.elementor-item,
.elementor-element-4306390 .elementor-nav-menu--dropdown > .elementor-nav-menu > li > a.elementor-item {
display: block !important;
width: 100% !important;
padding: 14px 0 !important;
border: 0 !important;
border-bottom: 1px solid rgba(247, 243, 236, .08) !important;
border-radius: 0 !important;
background: transparent !important;
color: #F7F3EC !important;
font-family: "Cormorant Garamond", Georgia, serif !important;
font-size: 24px !important;
font-weight: 400 !important;
letter-spacing: 0 !important;
text-transform: none !important;
line-height: 1.25 !important;
white-space: normal !important;
box-sizing: border-box !important;
}
.babsi-header-mobile .elementor-nav-menu--dropdown > .elementor-nav-menu > li > a.elementor-item:hover,
.elementor-element-4306390 .elementor-nav-menu--dropdown > .elementor-nav-menu > li > a.elementor-item:hover {
color: #D4B896 !important;
background: transparent !important;
}
/* Hide caret — zones are always shown inline */
.babsi-header-mobile .elementor-nav-menu--dropdown .sub-arrow,
.elementor-element-4306390 .elementor-nav-menu--dropdown .sub-arrow {
display: none !important;
}
/* Zone children: always visible, middot row under Laser */
.babsi-header-mobile .elementor-nav-menu--dropdown .menu-item-has-children > .sub-menu,
.babsi-header-mobile .elementor-nav-menu--dropdown .menu-item-has-children > .elementor-nav-menu--dropdown,
.elementor-element-4306390 .elementor-nav-menu--dropdown .menu-item-has-children > .sub-menu,
.elementor-element-4306390 .elementor-nav-menu--dropdown .menu-item-has-children > .elementor-nav-menu--dropdown {
display: flex !important;
flex-wrap: wrap !important;
align-items: center !important;
gap: 0 4px !important;
position: static !important;
width: 100% !important;
min-width: 0 !important;
max-width: none !important;
margin: 0 !important;
padding: 4px 0 12px !important;
background: transparent !important;
border: 0 !important;
border-bottom: 1px solid rgba(247, 243, 236, .08) !important;
box-shadow: none !important;
overflow: visible !important;
}
.babsi-header-mobile .elementor-nav-menu--dropdown .sub-menu > li,
.elementor-element-4306390 .elementor-nav-menu--dropdown .sub-menu > li {
display: inline-flex !important;
align-items: center !important;
width: auto !important;
float: none !important;
margin: 0 !important;
padding: 0 !important;
}
.babsi-header-mobile .elementor-nav-menu--dropdown .sub-menu > li:not(:last-child)::after,
.elementor-element-4306390 .elementor-nav-menu--dropdown .sub-menu > li:not(:last-child)::after {
content: "·" !important;
display: inline-block !important;
margin: 0 10px 0 8px !important;
color: rgba(247, 243, 236, .45) !important;
font-size: 14px !important;
line-height: 1 !important;
}
.babsi-header-mobile .elementor-nav-menu--dropdown .sub-menu a,
.babsi-header-mobile .elementor-nav-menu--dropdown .elementor-sub-item,
.elementor-element-4306390 .elementor-nav-menu--dropdown .sub-menu a,
.elementor-element-4306390 .elementor-nav-menu--dropdown .elementor-sub-item {
display: inline !important;
width: auto !important;
padding: 6px 0 !important;
border: 0 !important;
background: transparent !important;
color: rgba(247, 243, 236, .7) !important;
font-family: Manrope, system-ui, sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
letter-spacing: .06em !important;
text-transform: none !important;
white-space: nowrap !important;
}
.babsi-header-mobile .elementor-nav-menu--dropdown .sub-menu a:hover,
.elementor-element-4306390 .elementor-nav-menu--dropdown .sub-menu a:hover {
color: #D4B896 !important;
background: transparent !important;
}
/* Parent Laser item: no bottom border (submenu row carries it) */
.babsi-header-mobile .elementor-nav-menu--dropdown > .elementor-nav-menu > .menu-item-has-children > a.elementor-item,
.elementor-element-4306390 .elementor-nav-menu--dropdown > .elementor-nav-menu > .menu-item-has-children > a.elementor-item {
border-bottom: 0 !important;
padding-bottom: 6px !important;
}
/* Injected WA CTA */
.babsi-mobile-menu-wa {
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 9px !important;
margin-top: 20px !important;
padding: 16px 24px !important;
border-radius: 999px !important;
background: linear-gradient(135deg, #D4B896, #B8956A) !important;
color: #2A211B !important;
font-family: Manrope, system-ui, sans-serif !important;
font-size: 13px !important;
font-weight: 600 !important;
letter-spacing: .14em !important;
text-transform: uppercase !important;
text-decoration: none !important;
box-sizing: border-box !important;
width: 100% !important;
max-width: 1400px !important;
}
.babsi-mobile-menu-wa:hover {
color: #2A211B !important;
filter: brightness(1.04);
}
body.babsi-mobile-nav-open {
overflow: hidden !important;
}
.babsi-studio-gallery.e-grid > .e-con-inner {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
grid-template-rows: repeat(3, minmax(0, 1fr)) !important;
grid-auto-rows: auto !important;
}
.babsi-studio-gallery .babsi-gallery-item-1,
.babsi-studio-gallery .babsi-gallery-item-6 {
grid-column: span 2 !important;
}
}
@media (max-width: 767px) {
.babsi-treatment-grid .babsi-behandlung-card {
padding: 30px 24px !important;
gap: 14px !important;
}
.babsi-treatment-grid .babsi-behandlung-card ul {
display: grid !important;
grid-template-columns: 1fr !important;
gap: 10px !important;
}
.babsi-footer-legal.e-con,
.babsi-footer-legal > .e-con-inner {
width: 100% !important;
}
}
/*
* Full-page SOLL rhythm measured from the supplied equal-height captures.
* The content geometry stays native; only each section's vertical band is
* distributed to the same proportions as the approved screenshot.
*/
@media (min-width: 1025px) {
.babsi-werte {
padding-block: 157px !important;
}
.babsi-behandlung.babsi-section-pad {
padding-block: 84px !important;
}
.babsi-treatment-grid {
padding-block: 0 !important;
}
.babsi-vorteile {
padding-block: 99px !important;
}
.babsi-zonen {
padding-block: 109px !important;
}
.babsi-preise {
padding-block: 150px !important;
}
.babsi-fullbody {
padding-block: 173px !important;
}
.babsi-ablauf {
padding-block: 154px !important;
}
.babsi-studio {
padding-block: 120px !important;
}
.babsi-studio-gallery.e-grid {
grid-template-rows: repeat(2, 272px) !important;
}
.babsi-faq {
padding-block: 139px !important;
}
.babsi-cta {
padding-block: 175px !important;
}
.babsi-site-footer {
padding-top: 56px !important;
padding-bottom: 32px !important;
gap: 16px !important;
}
}
/* Unterseiten */
.babsi-page-hero {
position: relative;
overflow: hidden;
}
/* Zone hero — SOLL: glow, centered copy, large serif H1, eyebrow rule */
.babsi-zone-hero {
position: relative !important;
overflow: hidden !important;
padding: clamp(48px, 6vw, 88px) 0 !important;
}
.babsi-zone-hero::before {
content: "";
position: absolute;
left: -14%;
top: -40%;
width: min(52vw, 760px);
aspect-ratio: 1;
border-radius: 50%;
filter: blur(56px);
background: radial-gradient(circle, rgba(196, 165, 116, .55), rgba(196, 165, 116, 0) 62%);
pointer-events: none;
z-index: 0;
animation: babsi-zone-orb 14s ease-in-out infinite alternate;
}
@keyframes babsi-zone-orb {
from { transform: translate3d(0, 0, 0) scale(1); }
to { transform: translate3d(160px, -110px, 0) scale(1.3); }
}
.babsi-zone-hero::after {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 1px;
background: linear-gradient(90deg, rgba(196,165,116,0), rgba(196,165,116,.7), rgba(196,165,116,0));
z-index: 2;
pointer-events: none;
}
.babsi-zone-hero > .e-con,
.babsi-zone-hero > .e-con-inner {
position: relative;
z-index: 1;
}
.babsi-zone-hero-inner.e-con.e-grid,
.babsi-zone-hero-inner.e-grid > .e-con-inner,
.babsi-zone-hero .babsi-zone-hero-inner {
align-items: center !important;
}
.babsi-zone-hero-copy {
max-width: 560px;
padding-top: 0 !important;
padding-bottom: 0 !important;
justify-content: center !important;
align-self: center !important;
}
.babsi-zone-hero-media {
max-width: 480px;
margin-inline: auto;
width: 100%;
padding-top: 0 !important;
padding-bottom: 0 !important;
align-self: center !important;
}
/* Eyebrow: gold rule + uppercase tracking */
.babsi-zone-hero-copy > .elementor-element:first-child .elementor-heading-title {
display: flex !important;
align-items: center !important;
gap: 14px !important;
margin: 0 0 26px !important;
font-family: Manrope, system-ui, sans-serif !important;
font-size: 12px !important;
font-weight: 500 !important;
letter-spacing: .28em !important;
text-transform: uppercase !important;
color: #C4A574 !important;
line-height: 1.4 !important;
}
.babsi-zone-hero-copy > .elementor-element:first-child .elementor-heading-title::before {
content: "";
display: block;
width: 36px;
height: 1px;
background: #C4A574;
flex: 0 0 36px;
}
/* H1 larger / more elegant */
.babsi-zone-hero-copy > .elementor-element:nth-child(2) .elementor-heading-title,
.babsi-zone-hero-copy h1.elementor-heading-title {
margin: 0 !important;
font-family: "Cormorant Garamond", Georgia, serif !important;
font-weight: 500 !important;
font-size: clamp(54px, 7vw, 104px) !important;
line-height: .94 !important;
letter-spacing: -.015em !important;
color: #FFFCFA !important;
}
/* Claim italic gold */
.babsi-zone-hero-copy > .elementor-element:nth-child(3) .elementor-heading-title {
margin: 22px 0 0 !important;
font-family: "Cormorant Garamond", Georgia, serif !important;
font-style: italic !important;
font-weight: 400 !important;
font-size: clamp(26px, 3vw, 40px) !important;
line-height: 1.2 !important;
color: #D4B896 !important;
}
.babsi-zone-hero-copy .elementor-widget-text-editor {
margin-top: 24px !important;
max-width: 520px;
}
.babsi-zone-hero-copy .elementor-widget-text-editor p {
margin: 0 !important;
font-size: 16.5px !important;
line-height: 1.75 !important;
color: rgba(247, 243, 236, .78) !important;
}
.babsi-zone-hero-copy .elementor-widget-button,
.babsi-zone-hero-copy > .e-con {
margin-top: 40px !important;
}
.babsi-zone-hero-copy .babsi-btn-primary .elementor-button,
.babsi-zone-hero-copy .babsi-btn-wa .elementor-button,
.babsi-zone-hero-copy a.elementor-button[href*="wa.me"] {
box-shadow: 0 14px 34px rgba(184, 149, 106, .35), 0 0 48px rgba(196, 165, 116, .28) !important;
}
.babsi-zone-hero-copy .elementor-widget-heading .elementor-heading-title[class*="elementor-size"] {
margin: 0;
}
.babsi-zone-hero-media img,
.babsi-price-thumb img {
width: 100% !important;
aspect-ratio: 4 / 5;
object-fit: cover !important;
height: auto !important;
display: block !important;
max-height: 600px;
}
/* Dark hero: secondary CTA = gold ghost even without class */
.babsi-page-hero .elementor-widget-button:not(.babsi-btn-primary):not(.babsi-text-link):not(.babsi-btn-wa) .elementor-button:not([href*="wa.me"]) {
background: transparent !important;
background-image: none !important;
border: 1px solid rgba(196,165,116,.6) !important;
color: #F7F3EC !important;
box-shadow: none !important;
}
.babsi-zone-tips-card ul {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 12px;
}
.babsi-zone-tips-card ul li {
position: relative;
padding-left: 22px;
}
.babsi-zone-tips-card ul li::before {
content: "";
position: absolute;
left: 0;
top: 8px;
width: 8px;
height: 8px;
border: 1px solid #C4A574;
transform: rotate(45deg);
}
.babsi-zone-tips-card {
margin-top: -44px !important;
margin-inline: 24px !important;
position: relative;
z-index: 2;
}
.babsi-zone-tips .elementor-widget-image img {
width: 100% !important;
aspect-ratio: 4 / 3;
object-fit: cover !important;
}
.babsi-legal a {
color: #8F6E3D !important;
}
.babsi-legal a:hover {
color: #3D322B !important;
}
.babsi-termin-contact a {
color: #3D322B !important;
text-decoration: none !important;
}
.babsi-termin-contact a:hover {
color: #8F6E3D !important;
}
.babsi-price-list .babsi-price-row {
display: flex;
align-items: baseline;
gap: 12px;
padding: 14px 0;
border-bottom: 1px solid #EFE7DB;
font-size: 16px;
color: #3D322B;
font-family: Manrope, system-ui, sans-serif;
}
.babsi-price-list .babsi-price-row .dots {
flex: 1;
border-bottom: 1px dotted #C4A574;
transform: translateY(-5px);
}
.babsi-price-list .babsi-price-row .price {
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 24px;
font-weight: 600;
line-height: 1;
white-space: nowrap;
}
@media (max-width: 767px) {
.babsi-zone-tips-card {
margin-top: 0 !important;
margin-inline: 0 !important;
}
}
/* Preise page SOLL cards */
.babsi-preise-hero {
position: relative !important;
overflow: hidden !important;
}
.babsi-preise-hero::before {
content: "";
position: absolute;
left: -14%;
top: -40%;
width: min(52vw, 760px);
aspect-ratio: 1;
border-radius: 50%;
filter: blur(56px);
background: radial-gradient(circle, rgba(196,165,116,.55), rgba(196,165,116,0) 62%);
pointer-events: none;
z-index: 0;
}
.babsi-preise-hero > .e-con,
.babsi-preise-hero > .e-con-inner {
position: relative;
z-index: 1;
}
.babsi-preise-hero-copy > .elementor-element:first-child .elementor-heading-title {
display: flex !important;
align-items: center !important;
gap: 14px !important;
text-transform: uppercase !important;
letter-spacing: .28em !important;
margin: 0 0 26px !important;
}
.babsi-preise-hero-copy > .elementor-element:first-child .elementor-heading-title::before {
content: "";
display: block;
width: 36px;
height: 1px;
background: #C4A574;
flex: 0 0 auto;
}
.babsi-preise-hero-title {
margin: 0 !important;
font-family: "Cormorant Garamond", Georgia, serif !important;
font-weight: 500 !important;
font-size: clamp(46px, 6vw, 88px) !important;
line-height: .98 !important;
letter-spacing: -.015em !important;
color: #FFFCFA !important;
text-wrap: balance;
}
.babsi-preise-hero-title em {
font-style: italic !important;
color: #D4B896 !important;
font-weight: 400 !important;
}
.babsi-preise-stack {
gap: 24px !important;
}
.babsi-preise-card {
overflow: hidden !important;
background: #FFFCFA !important;
}
.babsi-preise-card.e-grid > .e-con-inner {
--e-con-grid-template-columns: 1fr 1fr !important;
grid-template-columns: 1fr 1fr !important;
align-items: stretch !important;
gap: 0 !important;
}
.babsi-preise-card-media {
min-height: 320px !important;
height: 100% !important;
padding: 0 !important;
overflow: hidden !important;
}
.babsi-preise-card-media .elementor-widget-image,
.babsi-preise-card-media .elementor-widget-container,
.babsi-preise-card-media img {
height: 100% !important;
width: 100% !important;
}
.babsi-preise-card-media img {
object-fit: cover !important;
display: block !important;
aspect-ratio: auto !important;
}
.babsi-preise-card-body {
padding: clamp(24px, 3vw, 40px) !important;
gap: 0 !important;
}
.babsi-preise-card-body .elementor-widget-heading + .elementor-widget-heading {
margin-top: 8px !important;
}
.babsi-preise-card-body .elementor-widget-html {
margin-top: 18px !important;
width: 100%;
}
.babsi-preise-card-body .babsi-text-link .elementor-button {
background: transparent !important;
border: 0 !important;
border-bottom: 1px solid #C4A574 !important;
border-radius: 0 !important;
padding: 6px 0 !important;
color: #3D322B !important;
box-shadow: none !important;
}
.babsi-preise-card-body .babsi-text-link .elementor-button:hover {
color: #8F6E3D !important;
}
@media (max-width: 1024px) {
.babsi-preise-card.e-grid > .e-con-inner {
--e-con-grid-template-columns: 1fr !important;
grid-template-columns: 1fr !important;
}
.babsi-preise-card-media {
min-height: 260px !important;
}
}
/* Full Body SOLL */
.babsi-fullbody {
position: relative !important;
overflow: hidden !important;
background: #3D322B !important;
}
.babsi-fullbody::before {
content: "";
position: absolute;
inset: -10% -5% -10% 40%;
background: radial-gradient(ellipse at 70% 45%, rgba(212,184,150,.18), transparent 58%);
pointer-events: none;
z-index: 0;
}
.babsi-fullbody > .e-con,
.babsi-fullbody > .e-con-inner,
.babsi-fullbody-inner {
position: relative;
z-index: 1;
}
.babsi-fullbody-copy > .elementor-element:first-child .elementor-heading-title,
.babsi-fullbody .elementor-element-df64193 .elementor-heading-title {
display: flex !important;
align-items: center !important;
gap: 14px !important;
margin: 0 0 20px !important;
text-transform: uppercase !important;
letter-spacing: .26em !important;
color: #C4A574 !important;
font-size: 12px !important;
font-family: Manrope, system-ui, sans-serif !important;
font-weight: 500 !important;
}
.babsi-fullbody-copy > .elementor-element:first-child .elementor-heading-title::before,
.babsi-fullbody .elementor-element-df64193 .elementor-heading-title::before {
content: "";
display: block;
width: 28px;
height: 1px;
background: #C4A574;
flex: 0 0 auto;
}
.babsi-fullbody-title-wrap {
margin: 0 !important;
}
.babsi-fullbody-title {
margin: 0 !important;
font-family: "Cormorant Garamond", Georgia, serif !important;
font-weight: 400 !important;
font-size: clamp(50px, 6.4vw, 92px) !important;
line-height: .96 !important;
letter-spacing: -.015em !important;
color: #FFFCFA !important;
text-wrap: balance;
}
.babsi-fullbody-title em {
font-style: italic !important;
color: #D4B896 !important;
font-weight: 400 !important;
}
.babsi-fullbody-lead {
margin-top: 26px !important;
max-width: 460px;
}
.babsi-fullbody-lead p {
margin: 0 !important;
}
.babsi-fullbody-card {
padding: clamp(28px, 3.5vw, 48px) !important;
}
.babsi-fb-card-inner {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 0;
}
.babsi-fb-price {
display: flex;
align-items: baseline;
flex-wrap: wrap;
gap: 6px 14px;
}
.babsi-fb-num {
font-family: "Cormorant Garamond", Georgia, serif;
font-size: clamp(72px, 8vw, 108px);
font-weight: 500;
line-height: .9;
color: #FFFCFA;
font-variant-numeric: tabular-nums;
}
.babsi-fb-eur {
font-family: "Cormorant Garamond", Georgia, serif;
font-size: clamp(36px, 4vw, 52px);
line-height: 1;
color: #D4B896;
}
.babsi-fb-per {
font-family: Manrope, system-ui, sans-serif;
font-size: 12px;
letter-spacing: .22em;
text-transform: uppercase;
color: rgba(247,243,236,.7);
}
.babsi-fb-rule {
width: 100%;
height: 1px;
margin: 26px 0;
background: linear-gradient(90deg, #C4A574, rgba(196,165,116,0));
}
.babsi-fb-zones {
display: flex;
flex-direction: column;
gap: 8px;
width: 100%;
}
.babsi-fb-zones p {
margin: 0;
display: flex;
flex-wrap: wrap;
gap: 8px 12px;
font-family: Manrope, system-ui, sans-serif;
font-size: 14px;
letter-spacing: .08em;
line-height: 1.6;
color: rgba(247,243,236,.88);
}
.babsi-fb-zones i {
font-style: normal;
color: #C4A574;
}
.babsi-fb-btn {
margin-top: 32px;
display: inline-flex;
align-items: center;
gap: 10px;
padding: 17px 30px;
border-radius: 999px;
background: linear-gradient(135deg, #D4B896, #B8956A);
color: #2A211B !important;
font-family: Manrope, system-ui, sans-serif;
font-size: 13px;
font-weight: 600;
letter-spacing: .14em;
text-transform: uppercase;
text-decoration: none !important;
box-shadow: 0 14px 34px rgba(13,13,13,.35);
transition: transform .3s ease, box-shadow .3s ease;
}
.babsi-fb-btn:hover {
transform: translateY(-2px);
box-shadow: 0 20px 44px rgba(13,13,13,.5);
color: #2A211B !important;
}
/* Button system SOLL */
.elementor-button {
border-radius: 999px !important;
font-family: Manrope, system-ui, sans-serif !important;
letter-spacing: .14em !important;
text-transform: uppercase !important;
}
a.elementor-button[href*="wa.me"],
.babsi-btn-primary .elementor-button,
.babsi-header-cta .elementor-button {
background-color: #D4B896 !important;
background-image: linear-gradient(135deg, #D4B896, #B8956A) !important;
color: #2A211B !important;
border: 0 !important;
box-shadow: 0 14px 34px rgba(184,149,106,.3) !important;
font-weight: 600 !important;
}
.babsi-wa-float a.elementor-button[href*="wa.me"],
.babsi-wa-float .elementor-button {
background-color: #25D366 !important;
background-image: none !important;
color: transparent !important;
box-shadow: 0 10px 28px rgba(37, 211, 102, .45) !important;
}
a.elementor-button[href*="wa.me"]:hover,
.babsi-btn-primary .elementor-button:hover,
.babsi-header-cta .elementor-button:hover {
background-image: linear-gradient(135deg, #D4B896, #B8956A) !important;
color: #2A211B !important;
transform: translateY(-2px);
box-shadow: 0 20px 44px rgba(184,149,106,.45) !important;
}
.babsi-btn-ghost-dark .elementor-button,
.babsi-page-hero a.elementor-button:not([href*="wa.me"]):not(.babsi-btn-primary .elementor-button) {
/* handled via explicit classes below */
}
.babsi-btn-ghost-dark .elementor-button {
background: transparent !important;
background-image: none !important;
border: 1px solid rgba(196,165,116,.6) !important;
color: #F7F3EC !important;
box-shadow: none !important;
font-weight: 500 !important;
}
.babsi-btn-ghost-dark .elementor-button:hover {
background: rgba(196,165,116,.14) !important;
border-color: #C4A574 !important;
color: #F7F3EC !important;
}
.babsi-btn-ghost-light .elementor-button {
background: transparent !important;
background-image: none !important;
border: 1px solid #C4A574 !important;
color: #3D322B !important;
box-shadow: none !important;
font-weight: 500 !important;
}
.babsi-btn-ghost-light .elementor-button:hover {
background: #3D322B !important;
color: #F7F3EC !important;
}
/* No chat/WhatsApp icons inside text buttons — only the green float FAB keeps its icon */
a.elementor-button[href*="wa.me"] .elementor-button-icon,
.babsi-btn-wa .elementor-button-icon,
a.elementor-button[href*="wa.me"] .elementor-button-text::before,
.babsi-btn-wa .elementor-button-text::before,
.elementor-location-header a.elementor-button[href*="wa.me"] .elementor-button-text::before,
.babsi-header-cta .elementor-button-text::before,
.babsi-mobile-menu-wa::before {
content: none !important;
display: none !important;
width: 0 !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
background: none !important;
}
a.elementor-button[href*="wa.me"] .elementor-button-content-wrapper,
.babsi-btn-wa .elementor-button-content-wrapper {
gap: 0 !important;
}
.babsi-text-link .elementor-button {
background: transparent !important;
background-image: none !important;
border: 0 !important;
border-bottom: 1px solid #C4A574 !important;
border-radius: 0 !important;
padding: 6px 0 !important;
color: #3D322B !important;
box-shadow: none !important;
font-size: 12.5px !important;
letter-spacing: .12em !important;
}
.babsi-text-link .elementor-button:hover {
color: #8F6E3D !important;
}
/* Enforce content frame */
.e-con-boxed > .e-con-inner {
max-width: 1400px !important;
}
/* =========================================================
TABLET + MOBILE — complete responsive pass
========================================================= */
html {
overflow-x: clip;
}
body {
overflow-x: clip;
}
/* —— Tablet (≤1024) —— */
@media (max-width: 1024px) {
/* Kill desktop equal-row / overlap gaps on ALL stacked grids */
.babsi-treatment-grid.e-grid,
.babsi-treatment-grid.e-grid > .e-con-inner,
.babsi-behandlung.e-grid > .e-con-inner,
.babsi-vorteile.e-grid > .e-con-inner,
.babsi-vorteile .e-grid > .e-con-inner,
.babsi-preise .e-grid > .e-con-inner,
.babsi-zone-prices .e-grid > .e-con-inner,
.babsi-fullbody-inner.e-grid > .e-con-inner,
.babsi-fullbody-inner > .e-con-inner {
--e-con-grid-template-columns: 1fr !important;
--e-con-grid-template-rows: none !important;
grid-template-columns: 1fr !important;
grid-template-rows: none !important;
grid-auto-rows: auto !important;
align-items: start !important;
justify-items: stretch !important;
width: 100% !important;
max-width: 100% !important;
gap: 24px !important;
row-gap: 24px !important;
}
/* Boxed grids add outer + inner padding — kill the double inset */
.babsi-treatment-grid.e-con-boxed,
.babsi-behandlung.e-con-boxed,
.babsi-vorteile .e-grid.e-con-boxed,
.babsi-vorteile.e-grid.e-con-boxed {
padding-inline: 18px !important;
}
.babsi-treatment-grid > .e-con-inner,
.babsi-behandlung.e-grid > .e-con-inner,
.babsi-vorteile .e-grid > .e-con-inner,
.babsi-vorteile.e-grid > .e-con-inner {
padding-inline: 0 !important;
}
.babsi-behandlung-media,
.babsi-behandlung-card,
.babsi-figur,
.babsi-treatment-grid > .e-con-inner > .e-con,
.babsi-vorteile .e-grid > .e-con-inner > .e-con {
width: 100% !important;
max-width: 100% !important;
min-height: 0 !important;
height: auto !important;
margin: 0 !important;
align-self: start !important;
flex: 0 0 auto !important;
overflow: visible !important;
}
.babsi-figur.e-con,
.babsi-figur.e-flex {
display: block !important;
height: auto !important;
min-height: 0 !important;
overflow: visible !important;
}
.babsi-figur .elementor-widget-image,
.babsi-figur .elementor-widget-container,
.babsi-behandlung-media .elementor-widget-image,
.babsi-behandlung-media .elementor-widget-container {
display: block !important;
width: 100% !important;
max-width: 100% !important;
height: auto !important;
min-height: 0 !important;
}
.babsi-behandlung-media img,
.babsi-treatment-grid .babsi-behandlung-media img,
.babsi-figur img {
width: 100% !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
aspect-ratio: 4 / 3 !important;
object-fit: cover !important;
display: block !important;
}
.babsi-figur img {
aspect-ratio: 3 / 4 !important;
}
.babsi-behandlung-card {
margin-left: 0 !important;
margin-block: 0 !important;
margin-inline: 0 !important;
position: relative !important;
left: auto !important;
box-shadow: 0 16px 40px rgba(61, 50, 43, .1) !important;
}
.e-con-boxed > .e-con-inner {
max-width: 100% !important;
padding-inline: 24px !important;
}
.babsi-section-pad {
padding-block: clamp(56px, 8vw, 88px) !important;
padding-inline: 0 !important;
}
.babsi-footer-legal.e-con,
.babsi-footer-legal > .e-con-inner {
width: 100% !important;
max-width: 100% !important;
}
/* Homepage grids → 2 cols */
.babsi-werte.e-grid > .e-con-inner,
.babsi-ablauf.e-grid > .e-con-inner,
.babsi-ablauf > .e-con-inner {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
grid-template-rows: none !important;
grid-auto-rows: auto !important;
gap: 28px 24px !important;
align-items: start !important;
}
.babsi-zonen.e-grid > .e-con-inner,
.babsi-zonen .e-grid > .e-con-inner,
.babsi-zone-others .e-grid > .e-con-inner {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
grid-template-rows: none !important;
grid-auto-rows: auto !important;
gap: 20px !important;
align-items: start !important;
}
.babsi-studio-gallery.e-grid > .e-con-inner {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
grid-template-rows: none !important;
grid-auto-rows: 180px !important;
}
.babsi-studio-gallery .babsi-gallery-item-1,
.babsi-studio-gallery .babsi-gallery-item-6 {
grid-column: span 2 !important;
}
/* Full body */
.babsi-fullbody {
padding: 72px 24px !important;
}
.babsi-fb-num {
font-size: clamp(64px, 14vw, 96px) !important;
}
/*
* Catch-all: Elementor often puts grid tracks on .e-con.e-grid.e-con-full
* itself (no .e-con-inner). Equal 1fr rows create huge empty gaps on mobile.
*/
.elementor .e-con.e-grid.e-con-full:not(.babsi-studio-gallery):not(.babsi-footer-grid) {
--e-con-grid-template-rows: none !important;
grid-template-rows: none !important;
grid-auto-rows: auto !important;
align-items: start !important;
justify-items: stretch !important;
}
.babsi-fullbody-inner.e-grid,
.babsi-fullbody-inner.e-con.e-grid,
.babsi-preise-card.e-grid,
.babsi-preise-card.e-con.e-grid,
.babsi-laser-how .e-grid,
.babsi-vorteile .e-grid.e-con-full {
--e-con-grid-template-columns: 1fr !important;
grid-template-columns: minmax(0, 1fr) !important;
width: 100% !important;
max-width: 100% !important;
gap: 24px !important;
padding: 0 !important;
}
.babsi-fullbody,
.babsi-preise-stack,
.babsi-section-pad.babsi-preise {
padding-inline: 18px !important;
}
.babsi-fullbody > .e-con-inner,
.babsi-preise-stack > .e-con-inner,
.babsi-section-pad.babsi-preise > .e-con-inner {
padding-inline: 0 !important;
}
.babsi-fullbody-copy,
.babsi-fullbody-card,
.babsi-preise-card {
width: 100% !important;
max-width: 100% !important;
min-height: 0 !important;
height: auto !important;
margin: 0 !important;
}
.babsi-zone-hero > .e-con-boxed,
.babsi-page-hero > .e-con-boxed,
.babsi-zone-hero .e-con-boxed {
padding-inline: 18px !important;
}
.babsi-zone-hero > .e-con-boxed > .e-con-inner,
.babsi-page-hero > .e-con-boxed > .e-con-inner,
.babsi-zone-hero .e-con-boxed > .e-con-inner {
padding-inline: 0 !important;
width: 100% !important;
max-width: 100% !important;
}
.babsi-zone-hero-inner.e-grid,
.babsi-zone-hero-inner.e-con.e-grid,
.babsi-zone-hero-inner.e-grid > .e-con-inner,
.babsi-zone-hero-inner > .e-con-inner,
.babsi-zone-prices .e-grid,
.babsi-zone-prices > .e-con-inner > .e-grid,
.babsi-zone-others .e-grid,
.babsi-zone-others > .e-con-inner > .e-grid,
.babsi-laser-how .e-grid,
.babsi-preise-stack .e-grid,
.babsi-preise-card.e-grid {
--e-con-grid-template-columns: 1fr !important;
--e-con-grid-template-rows: none !important;
grid-template-columns: minmax(0, 1fr) !important;
grid-template-rows: none !important;
grid-auto-rows: auto !important;
align-items: start !important;
justify-items: stretch !important;
width: 100% !important;
max-width: 100% !important;
gap: 28px !important;
row-gap: 28px !important;
padding: 0 !important;
}
.babsi-zone-others .e-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 20px !important;
}
.babsi-zone-hero-copy,
.babsi-zone-hero-media,
.babsi-zone-tips,
.babsi-zone-tips-card {
max-width: 100% !important;
width: 100% !important;
min-height: 0 !important;
height: auto !important;
margin: 0 !important;
align-self: start !important;
}
.babsi-zone-hero-media img,
.babsi-zone-tips img {
width: 100% !important;
height: auto !important;
max-height: 520px !important;
display: block !important;
}
.babsi-zone-hero-copy > .elementor-element:nth-child(2) .elementor-heading-title,
.babsi-zone-hero-copy h1.elementor-heading-title {
font-size: clamp(52px, 9vw, 80px) !important;
}
.babsi-zone-tips .elementor-widget-image,
.babsi-zone-hero-media .elementor-widget-image {
display: block !important;
height: auto !important;
width: 100% !important;
}
/* Preise cards */
.babsi-preise-card.e-grid > .e-con-inner {
grid-template-columns: 1fr !important;
grid-template-rows: none !important;
grid-auto-rows: auto !important;
align-items: start !important;
}
.babsi-preise-card-media {
min-height: 0 !important;
height: auto !important;
}
.babsi-preise-hero {
padding: 64px 24px !important;
}
.babsi-preise-hero-title {
font-size: clamp(40px, 7vw, 64px) !important;
}
/* CTA */
.babsi-cta {
padding-block: 88px !important;
padding-inline: 24px !important;
}
.babsi-cta-logo img {
height: 56px !important;
}
/* Footer */
.babsi-site-footer {
padding: 56px 24px 28px !important;
gap: 28px !important;
}
.babsi-site-footer .e-grid > .e-con-inner {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
grid-template-rows: none !important;
grid-auto-rows: auto !important;
gap: 28px 20px !important;
align-items: start !important;
}
/* Zone cards + gallery: no collapsed image widgets */
.babsi-zone-card.e-con,
.babsi-zone-card.e-flex {
display: flex !important;
flex-direction: column !important;
height: auto !important;
overflow: hidden !important;
}
.babsi-zone-card .elementor-widget-image {
display: block !important;
height: auto !important;
flex: 0 0 auto !important;
}
.babsi-zone-card .elementor-widget-image img {
display: block !important;
width: 100% !important;
height: auto !important;
aspect-ratio: 4 / 5 !important;
object-fit: cover !important;
}
.babsi-studio-gallery.e-con-boxed {
padding-inline: 24px !important;
}
.babsi-studio-gallery > .e-con-inner {
padding-inline: 0 !important;
width: 100% !important;
}
.babsi-studio-gallery .e-con.e-child,
.babsi-studio-gallery [class*="babsi-gallery-item"] {
position: relative !important;
min-height: 180px !important;
height: 180px !important;
overflow: hidden !important;
}
.babsi-studio-gallery .babsi-gallery-item-1,
.babsi-studio-gallery .babsi-gallery-item-6 {
height: 200px !important;
min-height: 200px !important;
}
.babsi-studio-gallery .elementor-widget-image,
.babsi-studio-gallery .elementor-widget-container,
.babsi-studio-gallery img {
position: absolute !important;
inset: 0 !important;
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
}
}
/* —— Mobile (≤767) —— */
@media (max-width: 767px) {
.e-con-boxed > .e-con-inner {
padding-inline: 18px !important;
}
.babsi-section-pad {
padding-block: 56px !important;
}
/* Header compact */
.babsi-site-header {
min-height: 64px !important;
}
.babsi-header-logo img,
.babsi-logo-mark img {
height: 34px !important;
}
.babsi-header-wordmark .elementor-heading-title {
font-size: 18px !important;
}
/* Homepage hero — SOLL mobile: tight stack, seamless portrait glow */
.babsi-hero.e-flex {
flex-direction: column !important;
min-height: auto !important;
align-items: stretch !important;
background: #0D0D0D !important;
}
/* Softer ambient orbs — glow lives behind the portrait */
.babsi-hero::before {
opacity: .55;
right: -20%;
top: 35%;
width: min(90%, 420px);
}
.babsi-hero::after {
opacity: .35;
left: 10%;
bottom: -10%;
width: min(70%, 320px);
}
.babsi-hero-copy.e-con,
.babsi-hero-copy {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: flex-start !important;
text-align: center !important;
gap: 8px !important;
padding: 24px 22px 4px !important;
width: 100% !important;
max-width: 100% !important;
--width: 100% !important;
background: transparent !important;
}
/* SOLL: no eyebrow — brand leads */
.babsi-hero-copy > .elementor-element:first-child {
display: none !important;
}
.babsi-hero-copy .elementor-element,
.babsi-hero-copy .elementor-widget,
.babsi-hero-copy .elementor-widget-container {
width: 100% !important;
max-width: 100% !important;
margin-block: 0 !important;
}
.babsi-hero-copy .elementor-heading-title,
.babsi-hero-copy .elementor-widget-text-editor,
.babsi-hero-copy .elementor-widget-text-editor p {
text-align: center !important;
margin: 0 !important;
}
.babsi-hero-brand .elementor-heading-title,
.babsi-hero-copy .babsi-hero-brand .elementor-heading-title {
font-size: clamp(48px, 13vw, 72px) !important;
line-height: .94 !important;
white-space: normal !important;
text-align: center !important;
}
.babsi-hero-copy h1.elementor-heading-title {
font-size: clamp(22px, 6vw, 28px) !important;
text-align: center !important;
color: #D4B896 !important;
}
.babsi-hero-copy .elementor-widget-text-editor {
margin-top: 2px !important;
}
.babsi-hero-copy .elementor-widget-text-editor p {
font-size: 12px !important;
letter-spacing: .2em !important;
text-transform: uppercase !important;
color: rgba(247, 243, 236, .74) !important;
}
/* Button stack: breathe after keywords, tight between CTAs */
.babsi-hero-copy > .e-con:not(.babsi-hero-brand) {
display: flex !important;
flex-direction: column !important;
align-items: stretch !important;
gap: 10px !important;
width: 100% !important;
max-width: 340px !important;
margin: 14px auto 0 !important;
padding: 0 !important;
}
.babsi-hero-brand {
margin: 0 !important;
padding: 0 !important;
gap: 0 !important;
width: 100% !important;
max-width: 100% !important;
}
.babsi-hero-copy .elementor-button,
.babsi-hero-copy a.elementor-button {
width: 100% !important;
justify-content: center !important;
text-align: center !important;
}
.babsi-hero-copy .elementor-widget-button,
.babsi-hero-copy .elementor-button-wrapper {
width: 100% !important;
margin: 0 !important;
}
/* Kill Elementor brown plate + copy padding bleed onto media */
.babsi-hero-media,
.babsi-hero-media.e-con,
.babsi-hero > .e-con.e-child.babsi-hero-media {
min-height: 0 !important;
padding: 0 !important;
margin: -4px 0 0 !important;
gap: 0 !important;
display: flex !important;
justify-content: flex-end !important;
align-items: flex-end !important;
position: relative !important;
width: 100% !important;
max-width: 100% !important;
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
overflow: hidden !important;
}
.babsi-hero-media::before {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 5%;
height: 95%;
background: radial-gradient(ellipse 70% 55% at 68% 48%, rgba(196, 165, 116, .5), rgba(196, 165, 116, .14) 40%, rgba(13, 13, 13, 0) 70%);
pointer-events: none;
z-index: 0;
}
.babsi-hero-media .elementor-widget-image,
.babsi-hero-media .elementor-widget-container {
position: relative;
z-index: 1;
width: 100% !important;
max-width: 100% !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
display: flex !important;
justify-content: flex-end !important;
}
.babsi-hero-media img {
position: relative;
z-index: 1;
width: 100% !important;
max-width: none !important;
height: auto !important;
margin: 0 0 -2px 0 !important;
display: block !important;
background: transparent !important;
object-fit: cover !important;
object-position: center !important;
/* Source has ~17% empty pad right of subject — shift so she sits on the right edge */
--babsi-hero-x: 20%;
transform: translate3d(var(--babsi-hero-x), var(--babsi-parallax-y, 0px), 0) !important;
/* Soft top fade into hero black — no hard seam */
-webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 8%, #000 100%);
mask-image: linear-gradient(to bottom, transparent 0%, #000 8%, #000 100%);
}
/* Section headers breathe */
.babsi-werte,
.babsi-vorteile,
.babsi-zonen,
.babsi-preise,
.babsi-ablauf,
.babsi-faq,
.babsi-studio {
padding-inline: 18px !important;
}
/* CTA centered */
.babsi-cta {
text-align: center !important;
}
.babsi-cta .elementor-heading-title,
.babsi-cta .elementor-widget-text-editor {
text-align: center !important;
}
.babsi-cta > .e-con-inner,
.babsi-cta .e-con {
align-items: center !important;
}
/* Grids → 1 col, auto height — no phantom row gaps */
.babsi-werte.e-grid > .e-con-inner,
.babsi-vorteile.e-grid > .e-con-inner,
.babsi-vorteile .e-grid > .e-con-inner,
.babsi-zonen.e-grid > .e-con-inner,
.babsi-zonen .e-grid > .e-con-inner,
.babsi-zone-others .e-grid,
.babsi-zone-others .e-grid > .e-con-inner,
.babsi-ablauf.e-grid > .e-con-inner,
.babsi-ablauf > .e-con-inner,
.babsi-treatment-grid.e-grid > .e-con-inner,
.babsi-behandlung.e-grid > .e-con-inner,
.babsi-zone-hero-inner.e-grid,
.babsi-zone-hero-inner.e-con.e-grid,
.babsi-zone-prices .e-grid,
.babsi-laser-how .e-grid,
.babsi-preise-card.e-grid,
.babsi-preise-stack .e-grid {
--e-con-grid-template-columns: 1fr !important;
--e-con-grid-template-rows: none !important;
grid-template-columns: minmax(0, 1fr) !important;
grid-template-rows: none !important;
grid-auto-rows: auto !important;
gap: 20px !important;
row-gap: 20px !important;
align-items: start !important;
width: 100% !important;
max-width: 100% !important;
padding: 0 !important;
}
.babsi-behandlung-media,
.babsi-behandlung-card,
.babsi-figur,
.babsi-zone-hero-copy,
.babsi-zone-hero-media,
.babsi-zone-tips,
.babsi-zone-tips-card {
width: 100% !important;
max-width: 100% !important;
min-height: 0 !important;
height: auto !important;
margin: 0 !important;
padding-inline: 0 !important;
align-self: start !important;
}
.babsi-behandlung-card {
padding: 28px 22px !important;
}
.babsi-behandlung-media img,
.babsi-figur img,
.babsi-zone-hero-media img,
.babsi-zone-tips img {
width: 100% !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
display: block !important;
}
.babsi-studio-gallery.e-grid > .e-con-inner {
grid-template-columns: 1fr 1fr !important;
grid-template-rows: none !important;
grid-auto-rows: 140px !important;
gap: 10px !important;
}
/* Zone hero — tight, no dead black space */
.babsi-zone-hero {
padding: 36px 0 32px !important;
}
.babsi-zone-hero::before {
left: -30%;
top: -20%;
width: min(90vw, 420px);
filter: blur(42px);
}
.babsi-zone-hero > .e-con-boxed,
.babsi-page-hero > .e-con-boxed {
padding-inline: 18px !important;
}
.babsi-zone-hero > .e-con-boxed > .e-con-inner,
.babsi-page-hero > .e-con-boxed > .e-con-inner {
padding-inline: 0 !important;
}
.babsi-zone-hero-inner.e-grid > .e-con-inner,
.babsi-zone-hero-inner > .e-con-inner {
gap: 28px !important;
}
.babsi-zone-hero-copy > .elementor-element:first-child .elementor-heading-title {
margin-bottom: 18px !important;
letter-spacing: .18em !important;
font-size: 11px !important;
gap: 10px !important;
}
.babsi-zone-hero-copy > .elementor-element:first-child .elementor-heading-title::before {
width: 24px;
flex-basis: 24px;
}
.babsi-zone-hero-copy > .elementor-element:nth-child(2) .elementor-heading-title,
.babsi-zone-hero-copy h1.elementor-heading-title {
font-size: clamp(48px, 14vw, 64px) !important;
}
.babsi-zone-hero-copy > .elementor-element:nth-child(3) .elementor-heading-title {
margin-top: 14px !important;
font-size: clamp(22px, 6vw, 28px) !important;
}
.babsi-zone-hero-copy .elementor-widget-text-editor {
margin-top: 16px !important;
}
.babsi-zone-hero-copy .elementor-widget-text-editor p {
font-size: 15.5px !important;
line-height: 1.65 !important;
}
.babsi-zone-hero-copy .elementor-widget-button,
.babsi-zone-hero-copy > .e-con {
margin-top: 24px !important;
width: 100% !important;
flex-direction: column !important;
align-items: stretch !important;
gap: 12px !important;
}
.babsi-zone-hero-copy .elementor-button,
.babsi-zone-hero-copy a.elementor-button,
.babsi-zone-prices .elementor-button,
.babsi-zone-prices a.elementor-button,
.babsi-cta .elementor-button,
.babsi-cta a.elementor-button,
.babsi-page-hero .elementor-button,
.babsi-page-hero a.elementor-button {
width: 100% !important;
justify-content: center !important;
text-align: center !important;
padding-left: 20px !important;
padding-right: 20px !important;
}
.babsi-zone-hero-media {
max-width: 100% !important;
}
.babsi-zone-hero-media img {
max-height: 420px !important;
aspect-ratio: 4 / 5 !important;
}
.babsi-zone-tips-card {
margin-top: 0 !important;
margin-inline: 0 !important;
}
/* Preise */
.babsi-preise-hero {
padding: 48px 18px !important;
}
.babsi-preise-hero-title {
font-size: clamp(36px, 10vw, 48px) !important;
}
.babsi-preise-card-body {
padding: 24px 20px !important;
}
.babsi-price-list .babsi-price-row {
font-size: 15px;
gap: 8px;
}
.babsi-price-list .babsi-price-row .price {
font-size: 20px;
}
/* Full body mobile */
.babsi-fullbody {
padding: 56px 18px !important;
}
.babsi-fullbody-title {
font-size: clamp(36px, 10vw, 48px) !important;
}
.babsi-fb-btn {
width: 100%;
justify-content: center;
box-sizing: border-box;
}
/* CTA */
.babsi-cta {
padding: 72px 18px !important;
}
.babsi-cta .e-con {
flex-direction: column !important;
align-items: stretch !important;
width: 100% !important;
}
.babsi-cta h2.elementor-heading-title,
.babsi-cta .elementor-heading-title {
font-size: clamp(36px, 9vw, 48px) !important;
}
/* Footer 1 col */
.babsi-site-footer {
padding: 48px 18px 24px !important;
align-items: flex-start !important;
}
.babsi-site-footer .e-grid > .e-con-inner {
grid-template-columns: 1fr !important;
gap: 28px !important;
}
.babsi-footer-logo-row img {
height: 44px !important;
}
.babsi-footer-legal,
.babsi-footer-legal > .e-con-inner {
flex-direction: column !important;
align-items: flex-start !important;
gap: 12px !important;
}
/* Zone cards — image widgets must contribute height (no flex collapse) */
.babsi-zone-card.e-con,
.babsi-zone-card.e-flex {
display: flex !important;
flex-direction: column !important;
height: auto !important;
min-height: 0 !important;
overflow: hidden !important;
width: 100% !important;
max-width: 100% !important;
}
.babsi-zone-card .elementor-widget-image,
.babsi-zone-card .elementor-widget-container {
display: block !important;
width: 100% !important;
height: auto !important;
min-height: 0 !important;
flex: 0 0 auto !important;
}
.babsi-zone-card .elementor-widget-image img {
display: block !important;
width: 100% !important;
height: auto !important;
aspect-ratio: 4 / 5 !important;
object-fit: cover !important;
}
/* Studio gallery — real cell height + full width */
.babsi-studio.e-con-boxed,
.babsi-studio .e-con-boxed,
.babsi-studio-gallery.e-con-boxed {
padding-inline: 18px !important;
}
.babsi-studio > .e-con-inner,
.babsi-studio-gallery > .e-con-inner {
padding-inline: 0 !important;
width: 100% !important;
max-width: 100% !important;
}
.babsi-studio-gallery.e-grid > .e-con-inner {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
grid-template-rows: none !important;
grid-auto-rows: minmax(140px, auto) !important;
gap: 10px !important;
width: 100% !important;
}
.babsi-studio-gallery .e-con.e-child,
.babsi-studio-gallery [class*="babsi-gallery-item"] {
position: relative !important;
min-height: 140px !important;
height: 140px !important;
overflow: hidden !important;
width: 100% !important;
max-width: 100% !important;
}
.babsi-studio-gallery .babsi-gallery-item-1,
.babsi-studio-gallery .babsi-gallery-item-6 {
grid-column: span 2 !important;
height: 160px !important;
min-height: 160px !important;
}
.babsi-studio-gallery .elementor-widget-image,
.babsi-studio-gallery .elementor-widget-container {
position: absolute !important;
inset: 0 !important;
width: 100% !important;
height: 100% !important;
margin: 0 !important;
}
.babsi-studio-gallery img {
position: absolute !important;
inset: 0 !important;
width: 100% !important;
height: 100% !important;
min-height: 100% !important;
object-fit: cover !important;
display: block !important;
}
/* Fullbody / vorteile — no nested inset */
.babsi-fullbody-inner > .e-con-inner,
.babsi-vorteile .e-grid > .e-con-inner {
padding-inline: 0 !important;
}
.babsi-fullbody {
padding-inline: 18px !important;
}
.babsi-vorteile {
padding-inline: 18px !important;
}
.babsi-figur {
width: 100% !important;
max-width: 100% !important;
}
}
/* —— Small phones (≤380) —— */
@media (max-width: 380px) {
.babsi-zone-hero-copy > .elementor-element:nth-child(2) .elementor-heading-title,
.babsi-zone-hero-copy h1.elementor-heading-title {
font-size: 44px !important;
}
.babsi-header-wordmark {
max-width: 140px !important;
}
}
/* —— Motion / parallax (SoT) —— */
/*
* Header must stay above hero. will-change:transform alone creates a
* stacking context with z-index:auto so later hero layers paint on top.
*/
.elementor-location-header {
position: relative !important;
z-index: 999 !important;
transition: transform .45s cubic-bezier(.2,.7,.2,1), background-color .35s ease, border-color .35s ease, box-shadow .35s ease !important;
}
.babsi-site-header,
.elementor-element-216a2b6,
.elementor-location-header.elementor-sticky--effects,
.elementor-location-header .elementor-sticky--active {
z-index: 999 !important;
}
html.babsi-nav-hidden .elementor-location-header {
transform: translate3d(0, -110%, 0) !important;
}
html.babsi-nav-scrolled .babsi-site-header {
background: rgba(13, 13, 13, .84) !important;
border-bottom: 1px solid rgba(196, 165, 116, .28) !important;
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
}
[data-hero-text] {
will-change: transform, opacity;
}
@media (max-width: 1024px) {
[data-hero-text] {
will-change: auto;
transform: none !important;
opacity: 1 !important;
}
}
[data-hero-img] {
will-change: transform;
}
[data-parallax] {
--babsi-py: 0px;
transform: translate3d(0, var(--babsi-py), 0) scale(1.06) !important;
transform-origin: center center;
will-change: transform;
}
.babsi-behandlung-media,
.babsi-figur,
.babsi-vorteile-media,
.babsi-studio-gallery .e-con.e-child,
.babsi-studio-gallery .elementor-widget-image,
.babsi-zone-hero-media,
.babsi-zone-treat {
overflow: hidden !important;
}
/* Reveal must never steal taps while waiting for IntersectionObserver */
[data-reveal][data-shown="0"]:not([data-reveal-img]) {
pointer-events: auto;
}
@media (prefers-reduced-motion: reduce) {
.elementor-location-header,
[data-hero-text],
[data-hero-img],
[data-parallax],
[data-reveal] {
transition: none !important;
transform: none !important;
animation: none !important;
}
html.babsi-nav-hidden .elementor-location-header {
transform: none !important;
}
[data-parallax] {
transform: none !important;
}
.babsi-hero-media img,
.babsi-hero-img img {
transform: translate3d(var(--babsi-hero-x, 0), 0, 0) !important;
}
}