/*
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
*/


/* ================================
   IT-Trulla Farbvariablen
   ================================ */

:root{
    --ittrulla-red: #DE302F;
    --ittrulla-green: #4FAF73;
    --ittrulla-black: #111111;
    --ittrulla-white: #ffffff;
	--ittrulla-light:#f3f3f1;
	--ittrulla-green-soft:rgba(79,175,115,.08);
    --ittrulla-green-soft-2:rgba(79,175,115,.04);
}


/* ================================
   IT-Trulla Landingpage Grunddesign
   ================================ */

html,
body,
body.elementor-page,
.site,
.site-main,
#content {
    background: var(--ittrulla-black) !important;
}

.ittrulla-page {
    background: var(--ittrulla-black) !important;
    color: var(--ittrulla-white);
    overflow-x: hidden;
}
/* ================================
   Header
   ================================ */

.ittrulla-header{
    background:#111111 !important;
    max-width:1536px;
    margin:0 auto;
    padding:10px 70px 6px;
}



.ittrulla-header .elementor-nav-menu a {
    color: #ffffff !important;
    font-weight: 700;
}

.ittrulla-header .elementor-nav-menu a:hover {
    color: var(--ittrulla-red) !important;
}

/* ================================
   Hero Grundlayout
   ================================ */

.ittrulla-hero {
    background-color: var(--ittrulla-black) !important;
    color: var(--ittrulla-white);
    min-height: 930px;
    max-width: 1536px;
	margin: 0 auto; 
    padding: 10px 70px 0;
    overflow: visible !important; /* geändert */
    position: relative; /* NEU */
    z-index: 10; /* NEU */
	   padding-top:0 !important;
}


.ittrulla-hero{
    margin:0 auto;
    padding:0 70px 0;
}

.ittrulla-hero::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:260px;

    background:linear-gradient(
        to bottom,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,0) 45%,
        rgba(255,255,255,.22) 65%,
        rgba(255,255,255,.70) 86%,
        rgba(255,255,255,1) 100%
    );

    z-index:5;
    pointer-events:none;
    overflow:hidden;
}
.ittrulla-hero{
    overflow:hidden !important;
}


/* ================================
   Hero Headline
   ================================ */

.ittrulla-headline .elementor-heading-title,
.ittrulla-headline-custom {
    margin: 0;
    font-family: Arial, sans-serif !important;
    font-size: 70px !important;
    line-height: 0.95 !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: -1px !important;
    color: var(--ittrulla-white) !important;
}

.ittrulla-hero-copy .ittrulla-headline-custom {
    font-size: clamp(54px, 5.2vw, 92px) !important;
    line-height: 0.95 !important;
    margin-bottom: 22px !important;
}

.ittrulla-headline .white,
.ittrulla-headline-custom .white {
    color: var(--ittrulla-white) !important;
}

.ittrulla-headline .red,
.ittrulla-headline-custom .red {
    color: var(--ittrulla-red) !important;
}

.ittrulla-headline .green,
.ittrulla-headline-custom .green {
    color: var(--ittrulla-green) !important;
}

/* ================================
   Hero Copy / Unterzeile
   ================================ */

.ittrulla-hero-copy {
    max-width: 620px;
    z-index: 10;
	transform: translateY(-28px);
}

.ittrulla-hero-figure {
    transform: translateY(-24px);
}

.ittrulla-subline .green {
    color: var(--ittrulla-green) !important;
    font-weight: 800 !important;
}

.ittrulla-subline .red {
    color: var(--ittrulla-red) !important;
    font-weight: 800 !important;
}

/* ================================
   Button
   ================================ */

.ittrulla-button .elementor-button:hover,
.ittrulla-hero-copy .elementor-button:hover {
    background: var(--ittrulla-green) !important;
    color: var(--ittrulla-white) !important;
}


/* ================================
   Unterer Schriftzug auf grünem Streifen
   ================================ */

.ittrulla-strip-text .elementor-heading-title {
    font-family: "Kalam", cursive !important;
    color: var(--ittrulla-black) !important;
    font-size: 30px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    white-space: normal !important;
    transform: translate(-220px, -30px) rotate(-1deg);
	  position:relative;      /* NEU */
    z-index:10;             /* NEU */
}





/* ================================
   Hero Services
   ================================ */

.ittrulla-hero-services {
    margin-top: -60px;
    margin-bottom: 20px;
    width: 100%;
    max-width: 1180px;
    align-self: center;
    z-index: 20;
}

/* ================================
   Hero Services - Racing Separatoren
   ================================ */

.ittrulla-hero-services{
    position:relative;
}

/* alle alten Linien sicher aus */
.ittrulla-service::before,
.ittrulla-service::after{
    content:none !important;
}

.ittrulla-service{
    width:20%;
    text-align:center;
    padding:0 24px;
    position:relative;
    border:none !important;
}

/* linke Linie bei jedem Dienst */
.ittrulla-service::before{
    content:"" !important;
    position:absolute;
    left:0;
    top:35px;
    transform:translateX(-50%);

    width:2px;
    height:72px;

    background:linear-gradient(
        to bottom,
        transparent 0%,
        var(--ittrulla-green) 18%,
        var(--ittrulla-green) 82%,
        transparent 100%
    );

    opacity:.9;
    box-shadow:
        0 0 8px rgba(79,175,115,.7),
        0 0 16px rgba(79,175,115,.35);

    pointer-events:none;
}

/* rechte Abschlusslinie nach dem letzten Dienst */
.ittrulla-service:last-child::after{
    content:"" !important;
    position:absolute;
    right:0px;
    top:35px;
    transform:translateX(50%);
    width:2px;
    height:72px;
    background:linear-gradient(
        to bottom,
        transparent 0%,
        var(--ittrulla-green) 18%,
        var(--ittrulla-green) 82%,
        transparent 100%
    );
    opacity:.9;
    box-shadow:
        0 0 8px rgba(79,175,115,.7),
        0 0 16px rgba(79,175,115,.35);
    pointer-events:none;
}

/* ICONS */

/* ================================
   Hero Service Icons / Texte
   Thin-Line SVG Look
   ================================ */

.ittrulla-service .elementor-icon,
.ittrulla-service i,
.ittrulla-service svg,
.ittrulla-service img{
    width:56px !important;
    height:56px !important;
    font-size:56px !important;
    object-fit:contain !important;
}

/* SVG sauber über stroke/fill steuern */
.ittrulla-service svg,
.ittrulla-service svg *{
    fill:none !important;
    stroke:currentColor !important;
    stroke-width:12px !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;
}

/* JPG/PNG/SVG-Bildwidgets veredeln */
.ittrulla-service img{
    filter:drop-shadow(0 0 8px currentColor);
}

/* Rot */
.ittrulla-service.service-red,
.ittrulla-service.service-red .elementor-icon,
.ittrulla-service.service-red i,
.ittrulla-service.service-red svg{
    color:var(--ittrulla-red) !important;
}

/* Grün */
.ittrulla-service.service-green,
.ittrulla-service.service-green .elementor-icon,
.ittrulla-service.service-green i,
.ittrulla-service.service-green svg{
    color:var(--ittrulla-green) !important;
}

/* Falls SVGs mit fill statt stroke gebaut sind */
.ittrulla-service.service-red svg [fill]:not([fill="none"]){
    fill:var(--ittrulla-red) !important;
}

.ittrulla-service.service-green svg [fill]:not([fill="none"]){
    fill:var(--ittrulla-green) !important;
}

.ittrulla-service .elementor-heading-title{
    font-family:"Oswald", Arial, sans-serif !important;
    color:var(--ittrulla-white) !important;
    font-size:18px !important;
    line-height:1.08 !important;
    font-weight:700 !important;
    text-transform:uppercase !important;
    letter-spacing:.3px !important;
    margin-top:10px !important;
    margin-bottom:6px !important;
}

.ittrulla-service .elementor-widget-text-editor,
.ittrulla-service .elementor-widget-text-editor p {
    color:rgba(255,255,255,.95) !important;
    font-size:13px !important;
    line-height:1.28 !important;
    font-weight:500 !important;
    text-shadow:0 2px 4px rgba(0,0,0,.9);
}


/* ================================
   Responsive Hero
   ================================ */

@media (max-width: 1024px) {
    .ittrulla-hero {
        padding: 50px 32px 0;
        min-height: auto;
    }

    .ittrulla-hero-services {
        margin-top: 20px;
        max-width: 100%;
    }

    .ittrulla-service {
        width: 50%;
        margin-bottom: 30px;
        border-right: none;
    }
}

@media (max-width: 767px) {
    .ittrulla-hero {
        padding: 36px 22px 0;
    }

    .ittrulla-hero-copy .ittrulla-headline-custom {
        font-size: clamp(38px, 3.7vw, 64px) !important;
    }

    .ittrulla-subline,
    .ittrulla-hero-copy .elementor-widget-text-editor,
    .ittrulla-hero-copy .elementor-widget-text-editor p {
        font-size: 20px !important;
		margin-bottom: 8px !important;
		line-height: 1.15 !important;
    }

    .ittrulla-service {
        width: 100%;
        padding: 0 10px 24px;
    }
}


/* ================================
   Hero Subline wie Plakat
   ================================ */

.ittrulla-subline {
    display: block;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 25px !important;
    line-height: 1.18 !important;
    font-weight: 600 !important;
    color: var(--ittrulla-white) !important;
    margin-top: 22px !important;
    margin-bottom: 24px !important;
    letter-spacing: -0.2px;
}

.ittrulla-subline .green {
    color: var(--ittrulla-green) !important;
    font-weight: 700 !important;
}

.ittrulla-subline .red {
    color: var(--ittrulla-red) !important;
    font-weight: 700 !important;
}

/* ================================
   Hero Button
   ================================ */

.ittrulla-button .elementor-button,
.ittrulla-hero-copy .elementor-button {
    background: var(--ittrulla-red) !important;
    color: var(--ittrulla-white) !important;
    border-radius: 4px !important;
    padding: 15px 32px !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
}

.ittrulla-button .elementor-button:hover,
.ittrulla-hero-copy .elementor-button:hover {
    background: var(--ittrulla-green) !important;
    color: var(--ittrulla-white) !important;
}

/* ================================
   Cockpit Header
   ================================ */

.ittrulla-header {
    max-width: 1536px;
    margin: 0 auto;
    padding: 6px 30px !important;
	min-height: 90px;
    background: rgba(17,17,17,.92) !important;
    border-top: 4px solid var(--ittrulla-red);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ittrulla-header-logo img {
    width: 300px !important;
    /* max-width: 260px !important; */
    height: auto !important;
	  transform: translateX(-80px) rotate(-5deg);
}

.ittrulla-header-nav {
    display: flex;
    flex-direction: row;
    gap: 34px;
    align-items: center;
    justify-content: flex-end;
}

.ittrulla-header-nav a {
    color: var(--ittrulla-white) !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

.ittrulla-header-nav a:hover,
.ittrulla-header-nav .current-menu-item a {
    color: var(--ittrulla-red) !important;
}

/* ===================================
   Über mich / Wer ist die IT-Trulla?
   =================================== */

.ittrulla-about{
    position:relative;
    background:transparent; 
	overflow:hidden;
    padding:140px 70px 0px;
    margin-top:-170px; 
	 background:#ffffff !important;
}



.ittrulla-about-left{
    position:relative;
    max-width:540px;
    background:#ffffff;
    padding:46px 52px 42px;
    border-left:6px solid var(--ittrulla-red);
    box-shadow:10px 10px 0 rgba(0,0,0,.12);
    transform:none;
    z-index:5;
	margin-left:20px;
} 


/* NEU */
.ittrulla-about > .e-con{
    position:relative;
    z-index:2;

}

.ittrulla-about-headline .elementor-heading-title{
    color: var(--ittrulla-green) !important;
    font-size: 44px !important;
    font-weight: 800 !important;
	margin-top:30px;
   margin-bottom:10px;
} 


.ittrulla-callout{
    display:block;
    background:#111111;
    padding:20px 30px;
    border-left:none;
    transform:rotate(-2deg);
    box-shadow:6px 6px 0 rgba(0,0,0,.15);
    margin:34px -18px 0;
}

.ittrulla-callout .elementor-heading-title{
    font-family:"Kalam", cursive;
    font-size:28px;
    line-height:1.05;
    color:#ffffff;
}

.ittrulla-callout .green {
    color: var(--ittrulla-green) !important;
}

.ittrulla-callout .white {
    color: var(--ittrulla-white) !important;
}

.ittrulla-callout .red {
    color: var(--ittrulla-red) !important;
}


.ittrulla-callout:before,
.ittrulla-callout:after {
    content: "";
    position: absolute;
    left: -10px;
    right: -10px;
    height: 3px;
    background: #ffffff;
    opacity: .85;
}

.ittrulla-callout:before {
    top: -7px;
    transform: rotate(-1deg);
}

.ittrulla-callout:after {
    bottom: -7px;
    transform: rotate(1deg);
}

.ittrulla-callout,
.ittrulla-callout p {
    color: #ffffff !important;
    font-family: "Kalam", cursive !important;
    font-size: 22px !important;
    line-height: 1.15 !important;
    font-weight: 700 !important;
    letter-spacing: .2px;
}

.ittrulla-slogan{
    font-family:"Oswald",sans-serif;
    font-size:24px;
    font-weight:700;
    line-height:1.15;
    letter-spacing:.02em;
    text-transform:uppercase;
}

.ittrulla-slogan .white{
    color:#ffffff;
}

.ittrulla-slogan .green{
    color:var(--ittrulla-green);
}

.ittrulla-slogan .red{
    color:var(--ittrulla-red);
}

/* GEÄNDERT */
/* About-Button */

.ittrulla-brush-button{
    margin-top:18px !important;
    margin-left:10px;
    transform:translateY(24px);
}

.ittrulla-brush-button .elementor-button{
    background:var(--ittrulla-red) !important;
    color:#ffffff !important;
    border-radius:4px !important;
    padding:15px 32px !important;
    font-family:Arial, Helvetica, sans-serif !important;
    font-size:16px !important;
    font-weight:800 !important;
    line-height:1 !important;
    text-transform:none !important;
    transform:none !important;
    font-style:normal !important;
}

.ittrulla-brush-button .elementor-button span{
    transform:none !important;
}

.ittrulla-brush-button .elementor-button:hover{
    background:var(--ittrulla-green) !important;
    color:#ffffff !important;
}

/* GEÄNDERT: kompakter quadratischer Rennrahmen */
/* ===================================
   About: Avatar / Rennrahmen
   =================================== */


.ittrulla-profile-frame{
    position:relative;
    width:470px;
    max-width:100%;
    aspect-ratio:1 / 1;
    background:#ffffff;
    padding:16px;
    transform:rotate(-3deg);
    box-shadow:0 22px 44px rgba(0,0,0,.22);
    z-index:5;
	
	    display:flex;
    align-items:center;
    justify-content:center;
}


/* NEU: Avatar-Bild im Rahmen mittig ausrichten */
.ittrulla-profile-frame img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
   /* object-position:center center !important; */
	object-position:95% center !important;
    display:block !important;
}




/* NEU: Karomuster hinter dem Bilderrahmen */
.ittrulla-profile-frame::before{
    content:"";
    position:absolute;
    left:-150px;
	top:-75px;
    
    width:420px;
    height:520px;
    background:
        repeating-conic-gradient(
            #ffffff 0 25%,
            #111111 0 50%
        );
    background-size:30px 30px;
    transform:rotate(-14deg);
    opacity:.85;
    z-index:-2;
}

/* GEÄNDERT: roter Versatz hinter dem Rahmen */
.ittrulla-profile-frame::after{
    content:"";
    position:absolute;
    inset:0;
    background:var(--ittrulla-red);
    transform:translate(18px,18px);
    z-index:-1;
}
/* GEÄNDERT */

.ittrulla-profile-wrapper{
	    position:relative !important;
    margin-left:140px !important;
    z-index:10 !important;
}

.ittrulla-avatar img{
    display:block;
    width:100%;
    transition:.45s ease;
}

.ittrulla-avatar{
    position:relative;
    z-index:2;
} 

.ittrulla-real-photo{
    position:absolute;
    inset:24px;
    opacity:0;
    transition:.45s ease;
    z-index:3;
}

.ittrulla-real-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.ittrulla-profile-frame:hover .ittrulla-avatar{
    opacity:0;
}

.ittrulla-profile-frame:hover .ittrulla-real-photo{
    opacity:1;
}
/* GEÄNDERT: schwarzes Innenfeld */
.ittrulla-profile-frame .elementor-widget-image{
    width:100%;
    height:100%;
    background:#111111;
    padding:18px;
    overflow:hidden;
}


.ittrulla-hover-tag{
    position:absolute;
    top:8px;
    right:8px;

    background:var(--ittrulla-red);
    color:#ffffff;

    padding:4px 8px;

    font-family:"Oswald", sans-serif;
    font-size:10px;
    font-weight:700;
    line-height:1;

    text-transform:uppercase;
    transform:rotate(6deg);

    box-shadow:3px 3px 0 rgba(0,0,0,.25);
    z-index:20;

    display:inline-flex;
    align-items:center;
    gap:3px;

    white-space:nowrap;
}


.ittrulla-profile-frame:hover .ittrulla-hover-tag{
    opacity:0;
    transform:rotate(6deg) translateY(-10px);
}

/* ===================================
   Seminare-Bereich / Motorsport-Startkarten
   =================================== */

.ittrulla-seminare{
    position:relative;
    background:#ffffff;
    max-width:1536px;
    margin:0 auto;
    padding:80px 70px 50px;
    overflow:hidden;
}


/* Überschrift */
.ittrulla-seminare-heading{
    width:100% !important;
    max-width:1100px !important;
    margin:0 auto !important;
    text-align:center !important;
}

.ittrulla-seminare-heading .elementor-heading-title{
    color:var(--ittrulla-green) !important;
    font-size:44px !important;
    line-height:1 !important;
    font-weight:900 !important;
    text-align:center !important;
    margin:0 0 24px !important;
}

/* Kartenraster */
.ittrulla-seminare-grid{
    display:grid !important;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:42px;
    margin-top:70px;
    position:relative;
    z-index:2;
}

/* Karte */
.ittrulla-seminar-card{
    position:relative;
    min-height:360px;
    padding:34px 26px 28px !important;
    background:var(--ittrulla-red) !important;
    border:1px solid rgba(17,17,17,.18);
    box-shadow:0 18px 35px rgba(0,0,0,.14);
    overflow:hidden !important;
    transform:rotate(-1deg);
    transition:transform .35s ease, box-shadow .35s ease;
}

.ittrulla-seminar-card:nth-child(even){
    transform:rotate(1deg);
}

.ittrulla-seminar-card:hover{
    transform:translateY(-8px) rotate(-1deg);
    box-shadow:0 28px 48px rgba(0,0,0,.20);
}

.ittrulla-seminar-card:nth-child(even):hover{
    transform:translateY(-8px) rotate(1deg);
}

.ittrulla-seminar-card.seminar-green{
    background:var(--ittrulla-green) !important;
}

/* Karo oben links */
.ittrulla-seminar-card::before{
    content:"";
    position:absolute;
    left:-6px;
    top:-6px;
    width:78px;
    height:64px;
    background:
        repeating-conic-gradient(
            #ffffff 0 25%,
            #111111 0 50%
        );
    background-size:16px 16px;
    z-index:4;
    pointer-events:none;
}

/* Startnummer */
.ittrulla-seminar-card::after{
    position:absolute;
    right:18px;
    top:18px;
    font-family:"Oswald", Arial, sans-serif;
    font-size:120px;
    line-height:1;
    font-weight:900;
    color:rgba(255,255,255,.10);
    z-index:0;
    pointer-events:none;
}

.ittrulla-seminar-card.seminar-01::after{ content:"#01"; }
.ittrulla-seminar-card.seminar-02::after{ content:"#02"; }
.ittrulla-seminar-card.seminar-03::after{ content:"#03"; }
.ittrulla-seminar-card.seminar-04::after{ content:"#04"; }

/* Inhaltsebenen */
.ittrulla-seminar-card .elementor-widget-heading,
.ittrulla-seminar-card .elementor-widget-text-editor,
.ittrulla-seminar-card .elementor-widget-button{
    position:relative;
    z-index:2;
}

/* Titel */
.ittrulla-seminar-card .elementor-heading-title{
    color:#ffffff !important;
    font-family:"Oswald", Arial, sans-serif !important;
    font-size:26px !important;
    line-height:.95 !important;
    letter-spacing:.02em;
    font-weight:900 !important;
    text-align:left !important;
    text-transform:uppercase !important;
    margin:120px 0 22px !important;
	cursor:pointer;
}

/* Trennlinie in der Karte */
.ittrulla-seminar-card .elementor-widget-heading{
    border-bottom:1px solid rgba(255,255,255,.65);
    width:72%;
    padding-bottom:18px;
    margin-bottom:20px;
}

/* Themenliste */
.ittrulla-seminar-card .elementor-widget-text-editor,
.ittrulla-seminar-card .elementor-widget-text-editor p{
    color:rgba(255,255,255,.92) !important;
    font-family:Arial, Helvetica, sans-serif !important;
    font-size:16px !important;
    line-height:1.55 !important;
    font-weight:500 !important;
    margin:0 !important;
}

/* CTA */
.ittrulla-seminar-card .elementor-widget-button{
    margin-top:32px !important;
}

.ittrulla-seminar-card .elementor-button-wrapper{
    text-align:left;
}

.ittrulla-seminar-card .elementor-button{
    background:transparent !important;
    color:#ffffff !important;
    padding:0 !important;
    font-family:"Oswald", Arial, sans-serif !important;
    font-size:18px !important;
    font-weight:900 !important;
    line-height:1 !important;
    text-transform:uppercase !important;
    letter-spacing:.04em;
}

.ittrulla-seminar-card .elementor-button:hover{
    color:#111111 !important;
}

/* Karo unten rechts */
.ittrulla-seminar-card .elementor-widget-button::after{
    content:"";
    position:absolute;
    right:-10px;
    bottom:-10px;
    width:72px;
    height:52px;
    background:
        repeating-conic-gradient(
            #ffffff 0 25%,
            #111111 0 50%
        );
    background-size:16px 16px;
    z-index:4;
    pointer-events:none;
}

/* Responsive */
@media (max-width:1024px){
    .ittrulla-seminare{
        padding:70px 32px 90px;
    }

    .ittrulla-seminare-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:34px;
    }
}

@media (max-width:767px){
    .ittrulla-seminare{
        padding:60px 22px 80px;
    }

    .ittrulla-seminare-heading .elementor-heading-title{
        font-size:36px !important;
    }

    .ittrulla-seminare-grid{
        grid-template-columns:1fr;
        gap:30px;
    }

    .ittrulla-seminar-card{
        min-height:330px;
    }
}

/* ===================================
   Kundenstimmen / Google Reviews
   Racing-Pitboard-Optik
   =================================== */

.ittrulla-testimonials{
    position:relative;
    background:#ffffff;
    max-width:1536px;
    margin:0 auto;
    padding:55px 70px 80px;
    overflow:hidden;
}

.ittrulla-testimonials-heading .elementor-heading-title{
    color:var(--ittrulla-green) !important;
    font-size:44px !important;
    line-height:1 !important;
    font-weight:900 !important;
    text-align:center !important;
    margin:0 0 24px !important;
}

.ittrulla-testimonials-carousel{
    max-width:1050px;
    margin:55px auto 0 !important;
    position:relative;
}

/* Trustindex Grundgerüst neutralisieren */
.ittrulla-testimonials .ti-widget{
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
}

.ittrulla-testimonials .ti-footer{
    display:none !important;
}

.ittrulla-testimonials .ti-reviews-container-wrapper,
.ittrulla-testimonials .ti-reviews-container,
.ittrulla-testimonials .ti-review-item{
    background:#ffffff !important;
}

/* Bewertungskarte */
.ittrulla-testimonials .ti-review-item > .ti-inner{
    position:relative !important;
    background:#ffffff !important;
    border:1px solid rgba(17,17,17,.16) !important;
    border-left:7px solid var(--ittrulla-red) !important;
    border-radius:0 !important;
    box-shadow:10px 14px 28px rgba(0,0,0,.13) !important;
    padding:48px 70px 44px !important;
    overflow:visible !important;
    transform:rotate(-1deg);
}

/* Karo oben links */
.ittrulla-testimonials .ti-review-item > .ti-inner::before{
    content:"";
    position:absolute;
    left:-10px;
    top:-10px;
    width:78px;
    height:58px;
    background:repeating-conic-gradient(#ffffff 0 25%, #111111 0 50%);
    background-size:16px 16px;
    z-index:5;
    pointer-events:none;
}

/* Karo unten rechts */
.ittrulla-testimonials .ti-review-item > .ti-inner::after{
    content:"";
    position:absolute;
    right:-10px;
    bottom:-10px;
    width:78px;
    height:58px;
    background:repeating-conic-gradient(#ffffff 0 25%, #111111 0 50%);
    background-size:16px 16px;
    z-index:5;
    pointer-events:none;
}

.ittrulla-testimonials .ti-name{
    color:#0f6f6d !important;
    font-family:Arial, Helvetica, sans-serif !important;
    font-size:21px !important;
    font-weight:900 !important;
    text-align:center !important;
}

.ittrulla-testimonials .ti-date{
    display:none !important;
}

.ittrulla-testimonials .ti-stars{
    margin:14px auto 24px !important;
    text-align:center !important;
    transform:scale(1.15);
}

.ittrulla-testimonials .ti-review-content,
.ittrulla-testimonials .ti-review-text-container{
    background:transparent !important;
    color:#222222 !important;
    font-family:Arial, Helvetica, sans-serif !important;
    font-size:22px !important;
    line-height:1.55 !important;
    font-weight:500 !important;
    text-align:center !important;
    font-style:italic !important;
    max-width:900px !important;
    margin:0 auto !important;
}

.ittrulla-testimonials .ti-read-more{
    color:#777777 !important;
    font-size:13px !important;
    margin-top:12px !important;
}

/* Pfeile */
.ittrulla-testimonials .ti-controls-line button,
.ittrulla-testimonials .ti-prev,
.ittrulla-testimonials .ti-next{
    width:50px !important;
    height:50px !important;
    line-height:50px !important;
    color:#ffffff !important;
    background:#111111 !important;
    border:3px solid var(--ittrulla-red) !important;
    border-radius:0 !important;
    box-shadow:5px 5px 0 var(--ittrulla-green), 0 10px 20px rgba(0,0,0,.22) !important;
    font-size:30px !important;
    font-weight:900 !important;
    transform:rotate(-4deg);
    transition:.25s ease;
}

.ittrulla-testimonials .ti-controls-line button:hover,
.ittrulla-testimonials .ti-prev:hover,
.ittrulla-testimonials .ti-next:hover{
    background:var(--ittrulla-red) !important;
    color:#ffffff !important;
    transform:translateY(-4px) rotate(-4deg);
    box-shadow:5px 5px 0 #111111, 0 12px 22px rgba(0,0,0,.25) !important;
}

/* Punkte */
.ittrulla-testimonials .ti-dot,
.ittrulla-testimonials .swiper-pagination-bullet{
    background:#cfdede !important;
}

.ittrulla-testimonials .ti-dot.active,
.ittrulla-testimonials .swiper-pagination-bullet-active{
    background:var(--ittrulla-red) !important;
}

/* Elementor-Button unter den Bewertungen */
.ittrulla-testimonials .elementor-widget-button .elementor-button{
    background-color:var(--ittrulla-red) !important;
    color:#ffffff !important;
    font-family:Arial, Helvetica, sans-serif !important;
    font-size:16px !important;
    font-weight:900 !important;
    line-height:1 !important;
    padding:15px 34px !important;
    border-radius:4px !important;
    border:none !important;
    box-shadow:none !important;
    transition:all .25s ease !important;
}

.ittrulla-testimonials .elementor-widget-button .elementor-button:hover{
    background-color:var(--ittrulla-green) !important;
    color:#ffffff !important;
    transform:translateY(-2px);
}

/* Mobile */
@media (max-width:767px){
    .ittrulla-testimonials{
        padding:45px 22px 70px;
    }

    .ittrulla-testimonials-heading .elementor-heading-title{
        font-size:36px !important;
    }

    .ittrulla-testimonials-carousel{
        margin-top:42px !important;
    }

    .ittrulla-testimonials .ti-review-item > .ti-inner{
        padding:38px 26px 36px !important;
    }

    .ittrulla-testimonials .ti-review-content,
    .ittrulla-testimonials .ti-review-text-container{
        font-size:19px !important;
        line-height:1.5 !important;
    }
}



/* ===================================
   Blogbereich / Cheyenne Blog
   =================================== */

.ittrulla-blog{
    position:relative;
    background:#ffffff;
    max-width:1536px;
    margin:0 auto;
    padding:70px 70px 110px;
    overflow:hidden;
}

.ittrulla-blog-heading .elementor-heading-title{
    color:var(--ittrulla-green) !important;
    font-size:46px !important;
    line-height:1 !important;
    font-weight:900 !important;
    text-align:center;
    margin:0 0 24px !important;
}
.ittrulla-blog-feed{
    margin-top:55px;
}

/* Kartenraster */
.cheyenne-blog-posts{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:42px;
}

/* Einzelkarte */
.cheyenne-blog-card{
    background:#ffffff;
    border:1px solid rgba(17,17,17,.16);
    box-shadow:10px 10px 0 rgba(0,0,0,.10);
    overflow:hidden;
    transform:rotate(-1deg);
}

.cheyenne-blog-card:nth-child(even){
    transform:rotate(1deg);
}

/* Beitragsbild immer gleich groß */
.cheyenne-blog-image-link{
    display:block;
    width:100%;
    height:210px;
    background:#111111;
    overflow:hidden;
}

.cheyenne-blog-image{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* Inhalt */
.cheyenne-blog-content{
    padding:26px 26px 30px;
}

.cheyenne-blog-meta{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-bottom:14px;
    font-size:13px;
    font-weight:800;
    color:#0f6f6d;
}

.cheyenne-blog-title{
    margin:0 0 14px;
    font-size:23px;
    line-height:1.15;
    font-weight:900;
}

.cheyenne-blog-title a{
    color:#111111;
    text-decoration:none;
}

.cheyenne-blog-title a:hover{
    color:var(--ittrulla-red);
}

/* Teaser ca. 5 Zeilen */
.cheyenne-blog-excerpt{
    color:#222;
    font-size:16px;
    line-height:1.45;
    margin:0 0 22px;

    display:-webkit-box;
    -webkit-line-clamp:5;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

/* Weiterlesen */
.cheyenne-blog-more{
    display:inline-block;
    background:var(--ittrulla-red);
    color:#ffffff !important;
    border-radius:4px;
    padding:13px 24px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:15px;
    font-weight:800;
    line-height:1;
    text-decoration:none !important;
}

.cheyenne-blog-more:hover{
    background:var(--ittrulla-green);
}

/* Responsive */
@media (max-width:1024px){
    .cheyenne-blog-posts{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }
}

@media (max-width:767px){
    .ittrulla-blog{
        padding:60px 22px 80px;
    }

    .ittrulla-blog-heading .elementor-heading-title{
        font-size:36px !important;
    }

    .cheyenne-blog-posts{
        grid-template-columns:1fr;
        gap:32px;
    }
}
/* ===================================
   Newsletter / Seitenabschluss
   =================================== */

.ittrulla-newsletter{
    position:relative;
    max-width:1536px;
    margin:0 auto;
    padding:90px 70px 95px;
    background:#111111;
    color:#ffffff;
    overflow:hidden;
}

.ittrulla-newsletter-heading .elementor-heading-title{
    color:#ffffff !important;
    font-family:Arial, Helvetica, sans-serif !important;
    font-size:52px !important;
    line-height:1 !important;
    font-weight:900 !important;
    text-align:center !important;
    margin:0 0 24px !important;
}

.ittrulla-newsletter-divider .elementor-divider-separator{
    width:100% !important;
    max-width:1100px !important;
    border-color:var(--ittrulla-green) !important;
    opacity:.65;
}

.ittrulla-newsletter-layout{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:70px;
    margin-top:60px;
    position:relative;
    z-index:2;
}

.ittrulla-newsletter-figure{
    flex:0 0 40%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    position:relative;
    overflow:visible;
}

.ittrulla-newsletter-avatar img{
    width:440px !important;
    max-width:100% !important;
    height:auto !important;
    display:block !important;
}

/* Stay Smart */
.ittrulla-newsletter-signature{
    position:relative !important;
    margin-top:-28px !important;
    z-index:20 !important;
    transform:rotate(-7deg);
    text-align:center !important;
}

.ittrulla-newsletter-signature .elementor-heading-title,
.ittrulla-newsletter-signature p,
.ittrulla-newsletter-signature{
    font-family:"Kalam", cursive !important;
    color:#ffffff !important;
    font-size:34px !important;
    line-height:1 !important;
    font-weight:700 !important;
    text-shadow:2px 2px 8px rgba(0,0,0,.85);
    margin:0 !important;
}

.ittrulla-newsletter-content{
    flex:0 0 60%;
    max-width:620px;
}

.ittrulla-newsletter-content h3,
.ittrulla-newsletter-content .elementor-heading-title{
    color:#ffffff !important;
    font-family:Arial, Helvetica, sans-serif !important;
    font-size:34px !important;
    line-height:1.08 !important;
    font-weight:900 !important;
    margin:0 0 22px !important;
}

.ittrulla-newsletter-content,
.ittrulla-newsletter-content p{
    color:rgba(255,255,255,.92) !important;
    font-size:19px !important;
    line-height:1.45 !important;
}

.ittrulla-newsletter-content a{
    color:var(--ittrulla-green) !important;
}

.ittrulla-newsletter-content a:hover{
    color:var(--ittrulla-red) !important;
}

.ittrulla-newsletter-form{
    margin-top:28px;
}

/* MailPoet Formular */
.ittrulla-newsletter-form .mailpoet_form{
    padding:0 !important;
}

.ittrulla-newsletter-form input[type="email"],
.ittrulla-newsletter-form input.mailpoet_text{
    width:100% !important;
    height:54px !important;
    border:2px solid rgba(255,255,255,.22) !important;
    border-radius:4px !important;
    background:#ffffff !important;
    color:#111111 !important;
    padding:0 18px !important;
    font-size:17px !important;
    font-weight:600 !important;
}

.ittrulla-newsletter-form input[type="email"]::placeholder{
    color:#777777 !important;
}

.ittrulla-newsletter-form input[type="email"]:focus{
    outline:none !important;
    border-color:var(--ittrulla-green) !important;
}

.ittrulla-newsletter-form .mailpoet_submit,
.ittrulla-newsletter-form input[type="submit"],
.ittrulla-newsletter-form button[type="submit"]{
    width:100% !important;
    background:var(--ittrulla-red) !important;
    color:#ffffff !important;
    border:none !important;
    border-radius:4px !important;
    padding:17px 34px !important;
    font-family:Arial, Helvetica, sans-serif !important;
    font-size:16px !important;
    font-weight:800 !important;
    line-height:1 !important;
    cursor:pointer !important;
    margin-top:14px !important;
}

.ittrulla-newsletter-form .mailpoet_submit:hover,
.ittrulla-newsletter-form input[type="submit"]:hover,
.ittrulla-newsletter-form button[type="submit"]:hover{
    background:var(--ittrulla-green) !important;
}

/* Checkbox / Einwilligung */
.ittrulla-newsletter-form .mailpoet_checkbox_label,
.ittrulla-newsletter-form label{
    color:rgba(255,255,255,.78) !important;
    font-size:13px !important;
    line-height:1.45 !important;
}

.ittrulla-newsletter-form input[type="checkbox"]{
    accent-color:var(--ittrulla-green);
}

.ittrulla-newsletter-form a{
    color:var(--ittrulla-green) !important;
}

.ittrulla-newsletter-form a:hover{
    color:var(--ittrulla-red) !important;
}

.ittrulla-newsletter-privacy,
.ittrulla-newsletter-privacy p{
    color:rgba(255,255,255,.72) !important;
    font-size:13px !important;
    line-height:1.45 !important;
    margin-top:16px !important;
}

.ittrulla-newsletter-privacy a{
    color:var(--ittrulla-green) !important;
}

.ittrulla-newsletter-privacy a:hover{
    color:var(--ittrulla-red) !important;
}

@media (max-width:1024px){
    .ittrulla-newsletter{
        padding:75px 32px 85px;
    }

    .ittrulla-newsletter-layout{
        gap:40px;
    }

    .ittrulla-newsletter-avatar img{
        width:360px !important;
    }
}

@media (max-width:767px){
    .ittrulla-newsletter{
        padding:65px 22px 75px;
    }

    .ittrulla-newsletter-heading .elementor-heading-title{
        font-size:38px !important;
    }

    .ittrulla-newsletter-layout{
        flex-direction:column;
        gap:35px;
        margin-top:45px;
    }

    .ittrulla-newsletter-figure,
    .ittrulla-newsletter-content{
        flex:0 0 auto;
        width:100%;
        max-width:100%;
    }

    .ittrulla-newsletter-signature{
        margin-top:-18px !important;
    }
}
/* Globaler Trenner für alle Inhaltsbereiche */
.ittrulla-section-divider{
    width:100% !important;
    max-width:1100px !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

.ittrulla-section-divider .elementor-widget-container{
    width:100% !important;
}

.ittrulla-section-divider .elementor-divider{
    width:100% !important;
    padding:0 !important;
}

.ittrulla-section-divider .elementor-divider-separator{
    width:100% !important;
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    border-color:#0f6f6d !important;
    opacity:.55 !important;
}


/* FIX NUR About-Trenner */
.ittrulla-about-divider{
    width:100% !important;
    max-width:1100px !important;
    margin:0 auto 65px !important;
    position:relative !important;
    z-index:50 !important;
    clear:both !important;
}

.ittrulla-about-dividerdivider .elementor-divider{
    padding:0 !important;
}

.ittrulla-about-divider .elementor-divider-separator{
    display:block !important;
    width:100% !important;
    border-top:1px solid #0f6f6d !important;
    opacity:.55 !important;
}

/* Newsletter: Divider in Hero-Grün */
.ittrulla-newsletter .ittrulla-section-divider{
    --divider-color: var(--ittrulla-green);
}

.ittrulla-newsletter .ittrulla-section-divider .elementor-divider-separator{
    border-color: var(--ittrulla-green) !important;
}

/* ================================
   Footer
   ================================ */
/* ================================
   Footer
   ================================ */

.ittrulla-footer{
    position:relative;
    background:var(--ittrulla-black) !important;
    max-width:1536px;
    margin:0 auto;
    padding:45px 70px 28px !important;
    text-align:center;
    overflow:hidden;
}

/* grüner Abschluss-Divider */
.ittrulla-footer-divider{
    width:82%;
    max-width:1100px;
    margin:0 auto 26px !important;
}

.ittrulla-footer-divider .elementor-divider{
    padding:0 !important;
}

.ittrulla-footer-divider .elementor-divider-separator{
    border-color:var(--ittrulla-green) !important;
    border-width:1px !important;
    opacity:.75;
}

/* Logo */
.ittrulla-footer-logo img{
    width:300px !important;
    max-width:100%;
    height:auto;
    margin:0 auto 24px;
    display:block;
}

/* Slogan */
.ittrulla-footer-slogan .elementor-heading-title{
    font-family:Arial, Helvetica, sans-serif !important;
    font-size:30px !important;
    font-weight:900 !important;
    line-height:1 !important;
    letter-spacing:.02em;
    text-transform:uppercase;
    margin:0 0 24px !important;
}

.ittrulla-footer-slogan .white{ color:#ffffff !important; }
.ittrulla-footer-slogan .red{ color:var(--ittrulla-red) !important; }
.ittrulla-footer-slogan .green{ color:var(--ittrulla-green) !important; }

/* Adresse */
.ittrulla-footer-address,
.ittrulla-footer-address p{
    color:rgba(255,255,255,.86) !important;
    font-family:Arial, Helvetica, sans-serif !important;
    font-size:15px !important;
    line-height:1.55 !important;
    font-weight:500;
    margin:0 !important;
}

.ittrulla-footer-address strong{
    color:#ffffff !important;
    font-weight:700;
}

.ittrulla-footer-address a{
    color:var(--ittrulla-green) !important;
    text-decoration:none !important;
}

.ittrulla-footer-address a:hover{
    color:var(--ittrulla-red) !important;
}

/* Impressum Datenschutz */
.ittrulla-footer-links{
    margin-top:24px;
}

.ittrulla-footer-links a,
.ittrulla-footer-links span{
    font-family:Arial, Helvetica, sans-serif;
    color:var(--ittrulla-red) !important;
    font-size:14px;
    font-weight:700;
    text-decoration:none;
}

.ittrulla-footer-links a:hover{
    color:var(--ittrulla-green) !important;
}

/* Copyright */
.ittrulla-footer-copy,
.ittrulla-footer-copy p{
    margin-top:18px !important;
    color:rgba(255,255,255,.45) !important;
    font-size:12px !important;
    line-height:1.4 !important;
}

/* dezenter grüner Glow */
.ittrulla-footer::before{
    content:"";
    position:absolute;
    left:50%;
    bottom:-120px;
    width:520px;
    height:160px;
    background:var(--ittrulla-green);
    opacity:.10;
    transform:translateX(-50%) rotate(-8deg);
    filter:blur(45px);
    pointer-events:none;
}

@media(max-width:767px){
    .ittrulla-footer{
        padding:38px 24px 28px !important;
    }

    .ittrulla-footer-logo img{
        width:210px !important;
    }

    .ittrulla-footer-slogan .elementor-heading-title{
        font-size:22px !important;
    }

    .ittrulla-footer-divider{
        width:92%;
    }
}

.site-footer,
footer.site-footer,
#site-footer,
.elementor-location-footer{
    display:none !important;
}


.elementor-kit-6 a {
  color: var(--ittrulla-red);
}


/* Mobile-Servicebox standardmäßig ausblenden */
.ittrulla-mobile-services{
    display:none !important;
}
/*-------------------------------- BIS hier, alles top --------------------------*/



/* ================================
   FIX: Hero 1024px - Services unten halten
   ================================ */

@media (max-width:1024px) and (min-width:768px){

    .ittrulla-hero{
        position:relative !important;
        min-height:600px !important;
        padding:0 40px !important;
        overflow:hidden !important;
    }

    .ittrulla-hero-services{
        position:absolute !important;
        left:40px !important;
        right:40px !important;
        bottom:105px !important;

        width:auto !important;
        max-width:none !important;
        margin:0 !important;

        display:flex !important;
        flex-wrap:nowrap !important;
        justify-content:space-between !important;
        align-items:flex-start !important;
        z-index:30 !important;
    }

    .ittrulla-service{
        width:20% !important;
        padding:0 10px !important;
        margin:0 !important;
    }

    .ittrulla-service .elementor-icon,
    .ittrulla-service i,
    .ittrulla-service svg,
    .ittrulla-service img{
        width:44px !important;
        height:44px !important;
        font-size:44px !important;
    }

    .ittrulla-service .elementor-heading-title{
        font-size:15px !important;
        line-height:1.05 !important;
    }

    .ittrulla-service .elementor-widget-text-editor,
    .ittrulla-service .elementor-widget-text-editor p{
        font-size:11px !important;
        line-height:1.15 !important;
    }

    .ittrulla-hero-copy{
        max-width:390px !important;
        transform:none !important;
        margin-top:-300px !important;
    }

    .ittrulla-hero-copy .ittrulla-headline-custom{
        font-size:52px !important;
        line-height:.92 !important;
    }

    .ittrulla-subline{
        font-size:21px !important;
        line-height:1.15 !important;
    }

   .ittrulla-strip-text{
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    bottom:45px !important;
    width:100% !important;
    z-index:80 !important;
    text-align:center !important;
}

.ittrulla-strip-text .elementor-heading-title{
    transform:none !important;
    text-align:center !important;
    font-size:28px !important;
    color:#111111 !important;
}
	
	/* Trulla-Bild Tablet quer */

.ittrulla-hero .elementor-widget-image img{
    width:500px !important;
    max-width:none !important;
	transform:translateY(-90px) !important;
}
	
	
}



/* ================================
   Header responsive ohne Elementor Pro
   ================================ */

/* Tablet */
@media(max-width:1024px){

    .ittrulla-header{
        min-height:80px !important;
        padding:10px 28px !important;
    }

    .ittrulla-header-logo img{
        width:220px !important;
        transform:none !important;
    }

    .ittrulla-header-nav{
        gap:24px !important;
    }

    .ittrulla-header-nav a{
        font-size:18px !important;
        white-space:nowrap !important;
    }
}


/* Handy */
@media(max-width:767px){

    .ittrulla-header{
        justify-content:space-between !important;
    }

    .ittrulla-header-logo img{
        width:180px !important;
    }

    .ittrulla-header-nav{
        display:none !important;
    }
}

/* ----------------------------ABOUT --------------------*/

/* ================================
   FIX: Über mich Tablet quer 1024px
   ================================ */

@media (max-width:1024px) and (min-width:768px){

    .ittrulla-about{
        padding:120px 40px 40px !important;
    }


   .ittrulla-about-left{
    max-width:720px !important;
    width:68% !important;
    padding:42px 44px 38px !important;
    margin-left:0 !important;
}

.ittrulla-profile-wrapper{
    margin-left:0 !important;
    width:32% !important;
    display:flex !important;
    justify-content:flex-end !important;
}

.ittrulla-profile-frame{
    width:390px !important;
    height:320px !important;
    aspect-ratio:auto !important;
    padding:12px !important;
    transform:translate(80px, 70px) rotate(-3deg) !important;
}

}


/* ================================
   FIX: Hero Tablet hoch 768px
   ================================ */

@media (max-width:850px) and (min-width:768px){

    .ittrulla-hero{
        min-height:500px !important;
        padding:0 35px !important;
		  background-position:center -10px !important;
    }


    /* Textbereich */
    .ittrulla-hero-copy{
        max-width:360px !important;
        margin-top:-230px !important;
    }

    .ittrulla-hero-copy .ittrulla-headline-custom{
        font-size:50px !important;
        line-height:.9 !important;
    }


    /* Trulla-Bildbereich */
  .ittrulla-hero .elementor-widget-image img{
    width:420px !important;
    max-width:none !important;
    transform:translate(-30px, -110px) !important;
}

    /* Services */
    .ittrulla-hero-services{
         left:25px !important;
		right:25px !important;
		bottom:70px !important;
    }

    .ittrulla-service{
        padding:0 6px !important;
    }

    .ittrulla-service .elementor-heading-title{
        font-size:14px !important;
    }

    .ittrulla-service .elementor-widget-text-editor p{
        font-size:10px !important;
    }


    /* Slogan unten */
    .ittrulla-strip-text{
        bottom:30px !important;
    }
	
	/* ================================
   Über mich Tablet hoch 768px
   ================================ */
/* About Überschrift weiter runter */
.ittrulla-about-headline{
    margin-top:45px !important;
    margin-bottom:12px !important;
}

.ittrulla-about-headline .elementor-heading-title{
    font-size:44px !important;
    line-height:1 !important;
}


/* About Trenner wieder sichtbar */
.ittrulla-about-divider{
    display:block !important;
    max-width:620px !important;
    margin:0 auto 45px !important;
    position:relative !important;
    z-index:60 !important;
}

.ittrulla-about-divider .elementor-divider-separator{
    display:block !important;
    width:100% !important;
    border-top:1px solid #0f6f6d !important;
    opacity:.55 !important;
}


/* Trulla-Frame etwas nach links */
.ittrulla-profile-frame{
    transform:translate(20px, 70px) rotate(-3deg) !important;
}
	
	/* ================================
   Seminare Tablet hoch 768px
   ================================ */

.ittrulla-seminare{
    padding-top:20px !important;
	padding-bottom:20px !important;
}


/* Überschrift kompakter */
.ittrulla-seminare .elementor-widget-heading{
    margin-bottom:15px !important;
}


/* Trenner näher an Überschrift */
.ittrulla-seminare .elementor-widget-divider{
    margin-bottom:40px !important;
}
	
	/* ================================
   Testimonials Tablet hoch 768px
   ================================ */

.ittrulla-testimonials{
    padding-top:5px !important;
}


/* Abstand Überschrift zum Trenner */
.ittrulla-testimonials-heading{
    margin-bottom:15px !important;
}


/* Abstand Trenner zum Slider */
.ittrulla-testimonials-carousel{
    margin-top:35px !important;
}
	/* Testimonials unten kürzen */
.ittrulla-testimonials{
    padding-bottom:25px !important;
}


/* Blog weiter hochziehen */
.ittrulla-blog{
    padding-top:35px !important;
	padding-bottom:20px !important;
}

}

/* ================================
   Burger Menü ohne Elementor Pro
   ================================ */

.ittrulla-mobile-menu{
    display:none;
}

@media(max-width:1024px){

    .ittrulla-header-nav{
        display:none !important;
    }

    .ittrulla-mobile-menu{
        display:block;
        position:relative;
        z-index:9999;
    }

    #ittrulla-menu-toggle{
        display:none;
    }

    .ittrulla-burger{
        display:flex;
        align-items:center;
        justify-content:center;
        width:48px;
        height:48px;
        background:#111111;
        color:#ffffff;
        border:3px solid var(--ittrulla-red);
        box-shadow:4px 4px 0 var(--ittrulla-green);
        font-size:24px;
        font-weight:700;
        line-height:1;
        cursor:pointer;
        transform:rotate(-3deg);
    }

    .ittrulla-mobile-nav{
        display:none;
        position:absolute;
        right:0;
        top:62px;
        min-width:260px;
        background:#111111;
        border:3px solid var(--ittrulla-red);
        box-shadow:6px 6px 0 var(--ittrulla-green);
        padding:18px 20px;
        transform:rotate(-1deg);
    }

    .ittrulla-mobile-nav a{
        display:block;
        color:#ffffff !important;
        font-family:"Oswald", Arial, sans-serif !important;
        font-size:14px;
        font-weight:700;
        line-height:1.15;
        text-decoration:none !important;
        padding:12px 0;
        border-bottom:1px solid rgba(255,255,255,.16);
    }

    .ittrulla-mobile-nav a:last-child{
        border-bottom:none;
    }

    .ittrulla-mobile-nav a:hover{
        color:var(--ittrulla-red) !important;
    }

    #ittrulla-menu-toggle:checked ~ .ittrulla-mobile-nav{
        display:block;
    }
}

/* ================================
   Mobile Hero bis 767px
   ================================ */

@media(max-width:767px){

	 .ittrulla-hero{
        padding-top:75px !important;
    }

	/* Header mobil sichtbar halten */
    .ittrulla-header{
        min-height:105px !important;
        padding:18px 24px !important;
        align-items:center !important;
    }

    .ittrulla-header-logo img{
        width:170px !important;
        display:block !important;
    }

    .ittrulla-mobile-menu{
        display:block !important;
        position:absolute !important;
        right:24px !important;
        top:28px !important;
        z-index:9999 !important;
    }

	
	.ittrulla-hero-services{
    display:none !important;
}
    .ittrulla-mobile-services{
        display:flex !important;
        flex-direction:column !important;
        gap:22px !important;
        margin:35px 0 20px !important;
        text-align:center !important;
        position:relative !important;
        z-index:80 !important;
    }

    .ittrulla-mobile-services div{
        position:relative;
        padding-left:18px;
    }

    .ittrulla-mobile-services div::before{
        content:"";
        position:absolute;
        left:0;
        top:10px;
        width:2px;
        height:44px;
        background:var(--ittrulla-green);
        box-shadow:0 0 10px var(--ittrulla-green);
    }

    .ittrulla-mobile-services strong{
        display:block;
        color:#ffffff;
        font-family:"Oswald", Arial, sans-serif;
        font-size:18px;
        line-height:1.05;
        font-weight:900;
    }

    .ittrulla-mobile-services span{
        display:block;
        color:#ffffff;
        font-size:12px;
        line-height:1.25;
        margin-top:5px;
    }

	  /* Smart. Einfach. Effektiv. mobil ausblenden */
    .ittrulla-strip-text{
        display:none !important;
    }
	
	/* über mich Handy */
	

	@media(max-width:767px){

			/* Hero Übergang mobil entschärfen */
	.ittrulla-hero .elementor-shape-bottom{
		display:none !important;
	}
		
		.ittrulla-about > .elementor-shape-top{
        display:none !important;
    }

		
    .ittrulla-hero .elementor-shape,
    .ittrulla-hero .elementor-shape-bottom,
    .ittrulla-hero .elementor-shape-fill{
        display:none !important;
    }

}
	
  .ittrulla-about{
        margin-top:0 !important;
        padding-top:45px !important;
        overflow:visible !important;
	   padding-left:14px !important;
    padding-right:14px !important;
    overflow:visible !important;
	  padding-bottom:10px !important;
    }

    .ittrulla-about-headline{
        display:block !important;
        position:relative !important;
        z-index:100 !important;
        margin:0 auto 18px !important;
        text-align:center !important;
    }

    .ittrulla-about-headline .elementor-heading-title{
        color:var(--ittrulla-green) !important;
        font-size:38px !important;
        line-height:1.05 !important;
        margin:0 !important;
    }

    .ittrulla-about-divider{
        margin:0 auto 35px !important;
        max-width:260px !important;
        position:relative !important;
        z-index:100 !important;
    }
	
	
 .ittrulla-about-left{
    width:100% !important;
    max-width:390px !important;
    padding:35px 24px !important;
    margin:0 auto !important;
        border-left:6px solid var(--ittrulla-red) !important;
}



    /* Claim Bild */
    .ittrulla-about-claim img{
        max-width:230px !important;
        margin:20px auto !important;
        display:block !important;
    }


    /* Button */
    .ittrulla-about .elementor-button{
        width:100% !important;
        max-width:260px !important;
        margin:0 auto !important;
        display:block !important;
    }


    /* rechter Trulla Bereich */
    .ittrulla-profile-wrapper{
        width:100% !important;
        margin:20px auto 0 !important;
        transform:none !important;
    }


    .ittrulla-profile-frame{
        width:300px !important;
        max-width:90% !important;
        margin:0 auto !important;
    }

	.ittrulla-seminare{
    padding-top:20px !important;
	padding-bottom: 20px !important;
}
	
 .ittrulla-testimonials{
    
	 padding-bottom: 20px !important;
    }
	
	  .ittrulla-blog{
        padding-top:20px !important;
    }
	
	.ittrulla-newsletter .mailpoet_form_paragraph{
        margin-top:60px !important;
    }
}






/* ================================
   Burger Menü Hover FINAL
   ================================ */

.ittrulla-mobile-menu .ittrulla-mobile-nav a:hover{

    background:#ffffff !important;
    padding-left:20px !important;

    box-shadow:
        inset 6px 0 0 var(--ittrulla-green) !important;
}

.ittrulla-mobile-menu .ittrulla-mobile-nav a:hover,
.ittrulla-mobile-menu .ittrulla-mobile-nav a:focus,
.ittrulla-mobile-menu .ittrulla-mobile-nav a:active{
    color:var(--ittrulla-red) !important;
    background:#ffffff !important;
    padding-left:20px !important;
    box-shadow:inset 6px 0 0 var(--ittrulla-green) !important;
}

.ittrulla-mobile-menu .ittrulla-mobile-nav a:hover *,
.ittrulla-mobile-menu .ittrulla-mobile-nav a:focus *,
.ittrulla-mobile-menu .ittrulla-mobile-nav a:active *{
    color:var(--ittrulla-red) !important;
}