.elementor-991565 .elementor-element.elementor-element-26952769{--display:flex;}/* Start custom CSS for html, class: .elementor-element-05d5882 *//* ==========================================================
ratio CRM Premium V5.04 – ZENTRALES CSS
Einfügen in: Design → Customizer → Zusätzliches CSS
Datum: 09.07.2026
============================================================ */

.page-title,.entry-title,h1.entry-title,.elementor-page-title,.elementor-widget-theme-post-title,.page-header{
display:none!important;visibility:hidden!important;height:0!important;margin:0!important;padding:0!important;overflow:hidden!important;
}

.ratio-v504,
.ratio-v504 *{box-sizing:border-box!important}

.ratio-v504{
--ratio-blue:#0b2a4a;
--ratio-deep:#07172e;
--ratio-pink:#ff2c8f;
--ratio-bg:#f5f7fb;
--ratio-text:#425066;
font-family:Arial,Helvetica,sans-serif!important;
Hintergrund:var(--ratio-bg)!important;
Farbe:var(--ratio-blue)!important;
overflow:hidden!important;
}

.ratio-v504 a{text-decoration:none!important}

/* 01 HELD */
.ratio-v504 .ratio-hero{
background:linear-gradient(135deg,var(--ratio-blue),#061a2e)!important;
padding:110px 22px 34px!important;
Farbe: #fff!important;
}
.ratio-v504 .ratio-hero-inner{
max-width:1280px!important;
margin:auto!important;
Anzeige: Raster!important;
grid-template-columns:1.05fr .95fr!important;
gap:60px!important;
align-items:center!important;
}
.ratio-v504 .ratio-hero h1{
Schriftgröße:62px!important;
Zeilenhöhe: 1,04!important;
Schriftstärke: 900!important;
margin:0 0 28px!important;
Farbe: #fff!important;
letter-spacing:-.035em!important;
}
.ratio-v504 .ratio-pink{color:var(--ratio-pink)!important}
.ratio-v504 .ratio-hero p{
Schriftgröße:22px!important;
Zeilenhöhe: 1,7!important;
margin:0 0 34px!important;
max-width:760px!important;
Farbe: #fff!important;
}
.ratio-v504 .ratio-btn{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
Hintergrund:var(--ratio-pink)!important;
Farbe: #fff!important;
padding:18px 34px!important;
border-radius:40px!important;
Schriftstärke: 900!important;
Übergang:.3s!important;
box-shadow:0 16px 34px rgba(255,44,143,.35)!important;
}
.ratio-v504 .ratio-btn:hover{
Hintergrund:#e91f7e!important;
transform:translateY(-2px)!important;
}
.ratio-v504 .ratio-hero-image img{
Breite: 100%!wichtig;
Höhe:560px!important;
object-fit:cover!important;
border-radius:34px!important;
Anzeige: Block!Wichtig;
box-shadow:0 28px 70px rgba(0,0,0,.28)!important;
}

/* 02 ICONLEISTE */
.ratio-v504 .ratio-hero-nav-wrap{
max-width:1280px!important;
margin:34px auto 0!important;
}
.ratio-v504 .ratio-hero-nav{
Anzeige: Raster!important;
grid-template-columns:repeat(10,1fr)!important;
gap:12px!important;
align-items:start!important;
}
.ratio-v504 .ratio-hero-nav-item{
Anzeige: Block!Wichtig;
text-align:center!important;
Farbe: #fff!important;
Position: relativ!wichtig;
z-index:20!important;
pointer-events:auto!important;
cursor:pointer!important;
}
.ratio-v504 .ratio-hero-nav-item *{pointer-events:none!important}
.ratio-v504 .ratio-hero-glass{
Position: relativ!wichtig;
Höhe:92px!important;
border-radius:20px!important;
overflow:hidden!important;
border:4px solid rgba(255,255,255,.72)!important;
background:linear-gradient(90deg,rgba(255,255,255,.34),rgba(255,255,255,.10) 22%,rgba(255,255,255,.42) 50%,rgba(255,255,255,.10) 78%,rgba(255,255,255,.34))!important;
backdrop-filter:blur(7px) saturate(1.22)!important;
-webkit-backdrop-filter:blur(7px) saturate(1.22)!important;
box-shadow:0 24px 52px rgba(0,0,0,.44),inset 0 4px 8px rgba(255,255,255,.92),inset 0 -24px 38px rgba(7,26,48,.42),inset 18px 0 28px rgba(255,255,255,.23),inset -18px 0 28px rgba(0,0,0,.25)!important;
Übergang: 0,28 Sekunden Leichtigkeit! Wichtig;
}
.ratio-v504 .ratio-hero-glass img{
Breite: 100%!wichtig;
Höhe: 100%!wichtig;
object-fit:cover!important;
Anzeige: Block!Wichtig;
Deckkraft: 0,40!wichtig;
filter:blur(1.35px) saturate(.84) contrast(.84)!important;
transform:scale(1.16)!important;
}
.ratio-v504 .ratio-hero-glass:before{
Inhalt:""!important;
Position: absolut!wichtig;
Top: -20%!wichtig;
unten: -20%!wichtig;
links: 33 %!wichtig;
Breite: 34%!wichtig;
z-index:5!important;
background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.74) 44%,rgba(255,255,255,.96) 50%,rgba(255,255,255,.74) 56%,rgba(255,255,255,0)),radial-gradient(ellipse at 50% 8%,rgba(255,255,255,.94),rgba(255,255,255,.30) 38%,rgba(255,255,255,0) 72%)!important;
mix-blend-mode:screen!important;
pointer-events:none!important;
}
.ratio-v504 .ratio-3d-icon{
Position: absolut!wichtig;
links: 50%!wichtig;
Top: 50%!wichtig;
Breite:62px!important;
Höhe:62px!important;
z-index:12!important;
transform:translate(-50%,-50%) perspective(700px) rotateX(12deg) rotateY(-10deg)!important;
border-radius:20px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,255,255,.18) 38%,rgba(7,26,48,.42) 100%)!important;
border:1px solid rgba(255,255,255,.88)!important;
box-shadow:0 18px 34px rgba(0,0,0,.48),inset 5px 5px 10px rgba(255,255,255,.78),inset -7px -9px 16px rgba(7,26,48,.42),inset 0 0 0 2px rgba(255,255,255,.20)!important;
Übergang: 0,28 Sekunden Leichtigkeit! Wichtig;
}
.ratio-v504 .ratio-3d-icon svg{
Breite:35px!important;
Höhe:35px!important;
fill:none!important;
stroke:var(--ratio-blue)!important;
Strichstärke: 4,6!important;
stroke-linecap:round!important;
stroke-linejoin:round!important;
}
.ratio-v504 .ratio-hero-nav-label{
Anzeige: Block!Wichtig;
margin-top:10px!important;
Schriftgröße:12px!important;
Zeilenhöhe: 1,15!important;
Schriftstärke: 900!important;
Farbe: #fff!important;
text-shadow:0 2px 10px rgba(0,0,0,.36)!important;
}
.ratio-v504 .ratio-hero-nav-item:hover .ratio-hero-glass{
border-color:var(--ratio-pink)!important;
transform:translateY(-4px)!important;
box-shadow:0 0 0 3px rgba(255,44,143,.28),0 28px 56px rgba(0,0,0,.48),inset 0 4px 8px rgba(255,255,255,.92)!important;
}
.ratio-v504 .ratio-hero-nav-item:hover .ratio-3d-icon{
transform:translate(-50%,-56%) perspective(700px) rotateX(10deg) rotateY(-8deg) scale(1.06)!important;
background:linear-gradient(145deg,rgba(255,255,255,.86),rgba(255,44,143,.50) 45%,rgba(7,26,48,.42) 100%)!important;
}
.ratio-v504 .ratio-hero-hint{
max-width:1280px!important;
margin:14px auto 0!important;
padding:10px 14px!important;
border-radius:14px!important;
background:rgba(255,255,255,.08)!important;
border:1px solid rgba(255,255,255,.14)!important;
Farbe:rgba(255,255,255,.88)!important;
Schriftgröße:14px!important;
Zeilenhöhe: 1,55!important;
text-align:center!important;
}
.ratio-v504 .ratio-hero-hint strong{color:var(--ratio-pink)!important}

@media(max-width:1100px){
.ratio-v504 .ratio-hero-inner{grid-template-columns:1fr!important}
.ratio-v504 .ratio-hero-nav{
display:flex!important;
overflow-x:auto!important;
padding-bottom:14px!important;
}
.ratio-v504 .ratio-hero-nav-item{min-width:128px!important}
.ratio-v504 .ratio-hero h1{font-size:38px!important}
.ratio-v504 .ratio-hero p{font-size:18px!important}
.ratio-v504 .ratio-hero-image img{height:340px!important}
}
@media(max-width:768px){
.ratio-v504 .ratio-hero{padding:80px 18px!important}
.ratio-v504 .ratio-btn{width:100%!important;text-align:center!important}
}/* End custom CSS */