.elementor-kit-6{--e-global-color-primary:#3B3B3B;--e-global-color-secondary:#707070;--e-global-color-text:#FFFFFF;--e-global-color-accent:#54FE35;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;background-color:var( --e-global-color-primary );color:var( --e-global-color-text );font-family:"avenir-lt-pro", Sans-serif;font-size:18px;font-weight:300;line-height:160%;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-kit-6 a{color:var( --e-global-color-text );}.elementor-kit-6 button,.elementor-kit-6 input[type="button"],.elementor-kit-6 input[type="submit"],.elementor-kit-6 .elementor-button{font-size:15px;font-weight:900;text-transform:uppercase;letter-spacing:2px;color:var( --e-global-color-text );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1500px;}.e-con{--container-max-width:1500px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */:root {
    --custom-margin: 150px;
    --custom-padding: 150px;
}

@media (width < 768px) {
    :root {
        --custom-padding: 40px;
        --custom-margin: 75px;
    }
}

body {
    overflow-x: hidden;
}

p {
    margin: 0;
}

p+*, *+p {
    margin-top: 15px !important;
}

.padding-0 {
    padding: 0 !important;
}

.text-dark {
    color: var(--e-global-color-primary);
}

.section-margin {
    margin-block: var(--custom-margin);
}

.section-padding {
    padding-block: var(--custom-padding);
}

.headline-accent {
    width: 100%;
    max-width: 700px !important;
    font-size: clamp(20px, 5vw, 50px);
    font-weight: 500;
    letter-spacing: 3px;
    padding-left: 60px;
}

.headline-accent::before {
    content: '';
    height: calc(100% - 20px);
    width: 2px;
    background-color: #fff;
    display: block;
    position: absolute;
    left: 10px;
    top: 10px;
    transform: skew(-13deg);
}

@media (width < 1200px) {
    .headline-accent {
        padding-left: 30px;
        letter-spacing: 1px;
    }
    
    .headline-accent::before {
        height: 100%;
        top: 0;
    }
}

.h2-top-accent h2 {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 300;
    letter-spacing: 1.5px;
    line-height: 1.3;
}

.fake-headline-small {
    font-size: 35px;
    font-weight: 600;
    letter-spacing: 1px;
}

.gradient-bottom,
.gradient-top {
    position: relative;
}

.gradient-bottom::after {
    content: '';
    display: block;
    position: absolute;
    bottom: -200px;
    left: 0;
    background: #242424;
    background: linear-gradient(180deg,rgba(36, 36, 36, 1) 0%, rgba(59, 59, 59, 1) 100%);
    width: 100%;
    height: 200px;
}

.gradient-top::before {
    content: '';
    display: block;
    position: absolute;
    top: -200px;
    left: 0;
    background: #242424;
    background: linear-gradient(180deg,rgba(59, 59, 59, 1) 0%, rgba(36, 36, 36, 1) 100%);
    width: 100%;
    height: 200px;
    z-index: -1;
}

/* Buttons */

.elementor-button, 
#hero .hero-text ul a {
    background-color: transparent;
    position: relative;
}

.elementor-button span {
    z-index: 9;
}

.elementor-button::after,
#hero .hero-text ul a::after {
    content: '';
    border: 2px solid #fff;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -ms-transform: skewX(-15deg);
    -webkit-transform: skewX(-15deg);
    transform: skewX(-15deg);
    z-index: 1;
    transition: 300ms;
}

.button-white-filled .elementor-button::after,
#hero .hero-text ul li:first-of-type a::after {
    background-color: #fff;
}

.button-white-filled a.elementor-button span,
.button-accent-filled a.elementor-button span,
#hero .hero-text ul li:first-of-type a {
    color: var(--e-global-color-primary);
    z-index: 9;
}

.button-accent-filled .elementor-button::after {
    background-color: var(--e-global-color-accent);
}

.button-accent-filled .elementor-button::after {
    border-color: var(--e-global-color-accent);
}

.button-dark .elementor-button::after {
    border-color: var(--e-global-color-primary);
}

.button-dark a.elementor-button span {
    color: var(--e-global-color-primary);
}

.elementor-button:hover::after,
#hero .hero-text ul a:hover::after {
    background-color: var(--e-global-color-accent) !important;
    border-color: var(--e-global-color-accent);
}

#hero .hero-text ul a:hover::after,
#hero .hero-text ul a::after {
    z-index: -1;
}

.elementor-button:hover,
#hero .hero-text ul a:hover {
    color: var(--e-global-color-primary) !important;
}

/* Header */

header .elementor-sticky {
    background-color: rgba(50, 50, 50, 1);
    padding-inline: 20px !important;
}

header .elementor-sticky--effects {
    background-color: rgba(50, 50, 50, .9);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
}

#header-logo-wrapper .elementor-widget-image {
    text-align: left !important;
}

#header-logo-wrapper img {
    width: 100%;
    max-width: 250px;
}

#header-menu-wrapper .header-menus {
    gap: 15px;
}

#header-menu-wrapper .header-menu-top a,
#header-menu-wrapper .header-menu-bottom a {
    color: #fff;
    padding: 0;
}

#header-menu-wrapper .header-menu-top a {
    font-size: 14px;
    padding-left: 15px;
}

#header-menu-wrapper .header-menu-bottom a {
    text-transform: uppercase;
    letter-spacing: 1px;
}

@media (width < 1450px) {
    #header-menu-wrapper .header-menu-bottom .elementor-nav-menu {
        gap: 10px !important;
        font-size: 15px;
    }
}

#header-menu-wrapper .header-menu-top li::before {
    content: url(https://www.implantate-bochum.com/wp-content/uploads/2025/06/arrow.png);
    display: block;
    position: absolute;
    margin-left: -8px;
    margin-top: 1px;
}

#header-menu-wrapper .elementor-nav-menu {
    gap: 20px;
}

#header-menu-wrapper .current-menu-item a {
    font-weight: 700;
    color: var(--e-global-color-accent);
}

#header-menu-wrapper a:hover {
    color: var(--e-global-color-accent);
}

@media (width < 1024px) {
    #header-menu-wrapper .elementor-button-text {
        display: none;
    }
}

#header-menu-wrapper .button-accent-filled {
    margin-right: 20px !important;
}

@media (width < 1250px) {
    #header-menu-wrapper .button-accent-filled {
        display: contents;
    }
}

/* Hero */

@media (width > 1600px) {
    #hero {
        aaspect-ratio: 16/6;
    }
}

#hero h1 {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 400;
    letter-spacing: 1.5px;
}

#hero .fake-h1 {
    font-size: clamp(20px, 5vw, 80px);
    font-weight: 500;
}

#hero .soc-med {
    position: absolute;
    right: 30px;
    bottom: 30px;
}

@media (width < 768px) {
    #hero .soc-med {
        display: none;
    }
}

#hero .soc-med .elementor-social-icon {
    font-size: 35px;
    background-color: transparent;
    position: relative;
}

#hero .soc-med .elementor-social-icon:hover i {
    color: var(--e-global-color-accent);
}

#hero .soc-med .elementor-social-icon::before {
    content: '';
    height: calc(100% - 20px);
    width: 2px;
    background-color: #fff;
    display: block;
    position: absolute;
    left: -5px;
    top: 10px;
    transform: skew(-13deg);
}

.home #hero::before {
    content: '';
    background-image: url(https://www.implantate-bochum.com/wp-content/uploads/2025/09/dr-frederic-vom-orde.png);
    background-size: cover;
    background-repeat: no-repeat;
    display: block;
    position: absolute;
    width: 49%;
    height: 95%;
    left: auto;
    right: 0px;
    top: auto;
    bottom: 0px;
    filter: grayscale(100);
}

@media (width < 800px) {
    .home #hero::before {
        width: 100%;
        right: 0;
        opacity: .2;
        z-index: -1;
    }
}

#hero .hero-text ul {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    list-style-type: none;
    padding: 0;
}

#hero .hero-text ul a {
    display: block;
    line-height: 1;
    padding: 12px 24px;
    font-size: 15px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 2px;
}

/* Sections */

.section-text-media .e-con-inner {
    justify-content: space-between !important;
    align-items: center !important;
}

.section-bg-videos {
    background-image: url(https://www.implantate-bochum.com/wp-content/uploads/2025/10/video-bg1.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.section-bg-videos .e-con-inner::before {
    content: '';
    background-color: #000;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .3;
}

.section-bg-videos .headline {
    font-size: clamp(30px, 3.5vw, 60px);
    font-weight: 700;
    position: relative;
    z-index: 9;
}

@media (width > 1400px) {
    .section-text-media_text {
        width: 35%;
    }
    
    .section-text-media_media {
        width: 55%;
    }
}

@media (width < 1400px) and (width > 1024px) {
    .section-text-media_text {
        width: 45%;
    }
    
    .section-text-media_media {
        width: 50%;
    }
}

@media (width < 1024px) {
    .section-text-media .e-con-inner {
        flex-direction: column !important;
    }
}

@media (width > 1024px) {
    .section-text-media_media::before {
        content: '';
        background-image: url(https://www.implantate-bochum.com/wp-content/uploads/2025/06/media-bg.svg);
        background-repeat: no-repeat;
        background-size: cover;
        position: absolute;
        width: 100%;
        height: 100%;
        top: -30px;
        left: -50px;
    }
    
    .section-text-media.media-left .section-text-media_media::before {
        transform: scaleX(-1);
        left: unset;
        right: -50px;
    }
}

@media (width < 768px) {
    .section-bg-videos .elementor-widget-button {
        text-align: center;
    }
    
    .section-bg-videos .headline {
        text-align: center;
    }
}

 /* Zitat */
 
.zitat .elementor-widget-blockquote {
    text-align: center !important;
}
 
.zitat .elementor-widget-blockquote p {
     color: #fff;
     font-size: clamp(20px, 3.5vw, 30px);
     font-style: italic;
     line-height: 130%;
}
 
 .zitat .e-q-footer {
     justify-content: center !important;
 }
 
 .zitat .e-q-footer .elementor-blockquote__author {
     color: #fff;
     font-weight: 400 !important;
 }
 
 /* Loops */
 
 @media (width > 1024px) {
     body.home .loop-leistungen {
         width: 95% !important;
         margin-left: auto;
     }
 }
 
 .loop-leistungen .e-loop-item .loop-content {
     width: 70%;
     right: 30px;
     margin: -80px 0 40px auto;
 }
 
  .loop-leistungen .e-loop-item img {
      aspect-ratio: 5/4.5;
      object-fit: cover;
  }
 
 .loop-leistungen .e-loop-item .loop-content::before {
     --extra-padding: 50px;
    content: '';
    background-color: #fff;
    padding: 40px;
    transform: skew(-5deg);
    height: calc(100% + var(--extra-padding));
    width: calc(100% + var(--extra-padding));
    top: calc(var(--extra-padding) / -2);
    left: calc(var(--extra-padding) / -2);
 }
 
@media (width < 1250px) {
 .loop-leistungen .e-loop-item .loop-content {
     width: 90%;
 }
 
 .loop-leistungen .e-loop-item .loop-content::before {
     --extra-padding: 25px;
     transform: skew(-2deg);
  }
}
 
.loop-leistungen.elementor-widget-loop-carousel.elementor-element :is(.swiper,.swiper-container)~.elementor-swiper-button-prev {
    left: calc(50% - 40px);
    top: -30px;
}

.loop-leistungen.elementor-widget-loop-carousel.elementor-element :is(.swiper,.swiper-container)~.elementor-swiper-button-next {
    right: calc(50% - 40px);
    top: -30px;
}

.loop-leistungen.elementor-widget-loop-carousel.elementor-element :is(.swiper,.swiper-container)~.elementor-swiper-button-next::before {
    --extra-padding: 20px;
    content: '';
    background-color: #fff;
    transform: skew(-5deg);
    height: calc(100% + var(--extra-padding));
    width: calc(100% + var(--extra-padding));
    top: calc(var(--extra-padding) / -2);
    left: calc(var(--extra-padding) / -2);
    position: absolute;
    z-index: -1;
}

.loop-leistungen.elementor-widget-loop-carousel.elementor-element :is(.swiper,.swiper-container)~.elementor-swiper-button-prev::before {
    --extra-padding: 20px;
    content: '';
    border: 2px solid #fff;
    transform: skew(-5deg);
    height: calc(100% + var(--extra-padding));
    width: calc(100% + var(--extra-padding));
    top: calc(var(--extra-padding) / -2);
    left: calc(var(--extra-padding) / -2);
    position: absolute;
}

.loop-excerpt {
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;  
    overflow: hidden;
}

/* Lists */

.custom-list_vorteile li .elementor-icon-list-text {
    font-size: 20px;
     font-weight: 600;
     margin-block: 4px;
}

.custom-list_vorteile li .elementor-icon-list-icon i {
    font-size: 20px;
}

@media (width > 1000px) {
    .custom-list-columns {
        column-count: 2;
    }
}

/* Akkordeon */

.elementor-widget-n-accordion .e-n-accordion-item .e-con,
.elementor-widget-n-accordion .e-n-accordion-item-title {
    border: 0 none !important;
    padding: 5px 0 !important;
}

.elementor-widget-n-accordion details:not(:last-of-type) {
    border-bottom: 1px solid rgba(255, 255, 255, .1);
}

.elementor-widget-n-accordion .e-n-accordion-item-title .e-n-accordion-item-title-text {
    font-size: 19px;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 1px;
    color: #fff;
    padding-top: 10px;
}

.elementor-widget-n-accordion details div:first-of-type {
    margin-bottom: 10px;
}

.elementor-widget-n-accordion .e-n-accordion-item-title-icon i {
    font-size: 20px !important;
    color: #fff !important;
}

.elementor-widget-n-accordion .e-n-accordion-item[open] .e-n-accordion-item-title-text,
.elementor-widget-n-accordion .e-n-accordion-item:hover .e-n-accordion-item-title-text, 
.elementor-widget-n-accordion .e-n-accordion-item[open] .e-n-accordion-item-title-icon i,
.elementor-widget-n-accordion .e-n-accordion-item:hover .e-n-accordion-item-title-icon i {
    color: var(--e-global-color-accent) !important;
}

@media (width > 1000px) {
    .elementor-widget-n-accordion .elementor-widget-text-editor {
        width: 80%;
    }
}
 
 /* Sections */
 
.section-media-text {
     margin: 50px 0 400px 0;
}
 
 .section-media-text_image img {
    width: 100%;
    height: auto;
    aspect-ratio: 16/9;
    object-fit: cover;
}

.section-image-text_text {
    width: 50%;
    position: absolute;
    bottom: -200px;
    right: 100px;
}

.section-image-text_text::before {
    --extra-padding: 100px;
    content: '';
    background-color: #fff;
    padding: 40px;
    transform: skew(-5deg);
    height: calc(100% + var(--extra-padding));
    width: calc(100% + var(--extra-padding));
    top: calc(var(--extra-padding) / -2);
    left: calc(var(--extra-padding) / -2);
}

.section-image-text_text h3 { 
    font-size: 25px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

.section-full-image-mask {
    padding: 150px 50px;
}

.section-full-image-mask::before {
    --extra-padding: 100px;
    content: '';
    background-color: #fff;
    padding: 40px;
    height: calc(100% + var(--extra-padding));
    width: calc(100% + var(--extra-padding));
    top: calc(var(--extra-padding) / -2);
    left: calc(var(--extra-padding) / -2);
    background-color: #ddd;
    background-image: url(https://www.implantate-bochum.com/wp-content/uploads/2025/08/dr-frederic-vom-orde-neu.png);
    background-position: right;
    background-repeat: no-repeat;
    background-size: cover;
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0% 100%);
}

.section-full-image-mask::after {
    --extra-padding: 100px;
    content: '';
    position: absolute;
    height: 100%;
    clip-path: polygon(10.2% 0, 100% 0, 85% 100%, 0% 100%);
    height: calc(100% + var(--extra-padding));
    width: calc(45% + var(--extra-padding));
    top: calc(var(--extra-padding) / -2);
    left: -50px;
    background-color: rgba(50, 50, 50, .85);
}

@media (width < 1200px) {
    .container-fixed-with {
        max-width: 100%;
    }
}

@media (width < 1024px) {
    .section-media-text {
         margin-bottom: 100px;
    }

    .section-media-text.large .section-image-text_text {
        position: relative;
        width: 85%;
        right: 0;
        bottom: 20px;
        margin: auto;
    }
    
    .section-media-text.large .section-image-text_text::before {
        --extra-padding: 50px;
        transform: skew(-2deg);
    }
}

/* Footer */

footer {
    margin-top: calc(var(--custom-margin) / 2);
}

.footer-contact-card .elementor-icon-box-title,
#footer-top h3 {
    font-size: 25px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin: 0;
}

.footer-contact-card .elementor-icon-box-description {
    font-weight: 500;
}

.footer-contact-card .elementor-icon-box-icon i {
    color: var(--e-global-color-primary);
}

.footer-contact-card .elementor-widget-icon-box {
    padding-left: 40px;
}

.footer-contact-card .elementor-widget-icon-box p {
    margin: 0 !important;
}

.footer-contact-card .elementor-widget-icon-box::before {
    content: '';
    height: calc(100% - 10px);
    width: 2px;
    background-color: var(--e-global-color-primary);
    display: block;
    position: absolute;
    left: 10px;
    top: 5px;
    transform: skew(-13deg);
}

@media (width < 768px) {
    .elementor-icon-box-wrapper {
        text-align: left !important;
    }
}

.footer-leistungen a {
    color: var(--e-global-color-primary);
    font-weight: 500;
}

.footer-leistungen a:hover {
    border-bottom: 1px solid var(--e-global-color-accent);
}

.footer-leistungen::before {
    content: '';
    height: 90px;
    width: 2px;
    background-color: var(--e-global-color-primary);
    display: block;
    position: absolute;
    left: -20px;
    top: -10px;
    transform: skew(-13deg);
}

.footer-contact-card .elementor-widget-icon-list li {
    display: inline-block;
    margin-block: 5px;
}

.footer-contact-card .elementor-widget-icon-list li a  {
    font-weight: 600;
    color: var(--e-global-color-primary);
    padding: 5px 15px;
}

.footer-contact-card .elementor-widget-icon-list li a::before {
    content: '';
    border: 2px solid var(--e-global-color-primary);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    -ms-transform: skewX(-15deg);
    -webkit-transform: skewX(-15deg);
    transform: skewX(-15deg);
    z-index: 1;
    transition: 300ms;
}

.footer-contact-card .elementor-widget-icon-list li:last-of-type a::before {
    background-color: var(--e-global-color-primary);
    z-index: 1;
}

.footer-contact-card .elementor-widget-icon-list li a:hover::before {
    background-color: var(--e-global-color-accent);
    border-color: var(--e-global-color-accent);
    z-index: 1;
}

.footer-contact-card .elementor-widget-icon-list li a span {
    z-index: 9;
}

.footer-contact-card .elementor-widget-icon-list li:last-of-type a span {
    color: #fff;
    z-index: 9;
}

.footer-contact-card .elementor-widget-icon-list li:last-of-type a:hover span {
    color: var(--e-global-color-primary);
}

.footer-logo .elementor-widget-image {
    text-align: left;
}

.footer-logo .elementor-widget-image img {
    width: 100% !important;
    max-width: 300px !important;
}

#footer-bottom .footer-impdat {
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

#footer-bottom .elementor-widget-social-icons .elementor-grid-item a {
    background-color: transparent;
    width: unset;
    height: unset;
}

@media (width > 1300px) {
    .footer-bg-wrapper {
        margin-bottom: 50px;
    }
    
    .footer-bg-wrapper::before {
        --extra-padding: 100px;
        content: '';
        background-color: #fff;
        padding: 40px;
        transform: skew(-5deg);
        height: calc(100% + var(--extra-padding));
        width: calc(100% + var(--extra-padding));
        top: calc(var(--extra-padding) / -2);
        left: calc(var(--extra-padding) / -2);
    }
}

@media (width < 1300px) {
    #footer-top {
        background-color: #fff;
    }
}

/* Popup */

.custom-popup .dialog-widget-content {
    clip-path: polygon(2% 0, 100% 0, 98% 100%, 0% 100%);
    padding: 50px;
}

.custom-popup .dialog-message {
    max-height: 80vh;
}

.custom-popup .eicon-close {
    color: #fff;
    font-size: 25px;
    background-color: var(--e-global-color-accent);
    padding: 3px;
}

.custom-popup .dialog-close-button {
    text-decoration: none;
}

/* Mobile Mneü */

.mobile-menu .elementor-nav-menu--dropdown {
    background-color: transparent;
    margin: 0 !important;
    font-size: 20px;
}

.mobile-menu .elementor-nav-menu--dropdown a,
.mobile-menu .elementor-nav-menu--dropdown a:hover {
    background-color: transparent !important;
    padding: 0;
    line-height: 1.7;
}

.mobile-menu .elementor-nav-menu--dropdown a:hover,
.mobile-menu .elementor-nav-menu--dropdown .elementor-item.elementor-item-active {
    color: var(--e-global-color-accent) !important;
}

.mobile-menu .dialog-close-button {
    text-decoration: none;
}

.mobile-menu .eicon-close {
    font-size: 20px;
    font-weight: 700;
}

.mobile-menu .elementor-grid-item .elementor-icon {
    background-color: transparent;
    width: auto;
    position: relative;
    margin-right: 15px;
    padding-left: 5px;
}

.mobile-menu .elementor-grid-item .elementor-icon::before {
    content: '';
    height: calc(100% - 20px);
    width: 2px;
    background-color: #fff;
    display: block;
    position: absolute;
    left: -5px;
    top: 10px;
    transform: skew(-13deg);
}

.section-videos .elementor-widget-video {
    box-shadow: 0px 0px 20px rgba(0,0,0,.2) !important;
}/* End custom CSS */