/**
 * @file
 * Subtheme specific CSS.
 */
DIV[class^='headerimage-narrow_'] {
    height: 66.6vh;
    background: center center / cover no-repeat;
    z-index: 20 !important;
}

/*// Pageheader*/
.block-views-blockheaderimage-block-1 .headerimage-narrow {
    background: #303236;
    padding: 50px 0;
    color: #FFF;
    margin-top: -5px;
}

.view-headerimage.view-id-headerimage.view-display-id-block_1 H1 {
    color: #FFF;
    font-size: 24px;
    line-height: 25px;
    letter-spacing: 5px;
    font-weight: 700;
    text-transform: uppercase;
}

.node--type-article .view-headerimage.view-id-headerimage {
    margin-top: 80px;
}

/*// Headerimage Narrow*/
.view-headerimage.view-id-headerimage.view-display-id-block_headerimage_narrow {
    position: relative;
    height: 66vh;
    overflow: hidden;
}

.view-headerimage.view-id-headerimage.view-display-id-block_headerimage_narrow IMG {
    position: relative;
    height: calc(70vH + 80px);
    width: 100%;
    overflow: hidden;
    object-fit: cover;
}

/*.view-headerimage.view-id-headerimage.view-display-id-block_headerimage_narrow .particles-js
{
	position: absolute;
	right: 0;
	left: 0;
	top: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.4);
}*/
.view-headerimage.view-id-headerimage.view-display-id-block_headerimage_narrow .headerimage-narrow #particles-js {
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.2);
}

.view-headerimage.view-id-headerimage.view-display-id-block_headerimage_narrow .container {
    position: absolute;
    left: 5%;
    bottom: 10%;
    width: 100%;
    max-width: 515px;
}

.view-headerimage.view-id-headerimage.view-display-id-block_headerimage_narrow .container .headertext {
    position: absolute;
    bottom: 15%;
    left: 0;
    transform: translate(0%, 0%);
    color: #FFF;
    margin-bottom: 20px;
    font-size: 24px;
    line-height: 25px;
    letter-spacing: 5px;
    font-weight: 400;
    text-transform: uppercase;
}

.view-headerimage.view-id-headerimage.view-display-id-block_headerimage_narrow .container H1 {
    color: #FFF;
    margin-bottom: 20px;
    font-size: 24px;
    line-height: 25px;
    letter-spacing: 5px;
    font-weight: 700;
    text-transform: uppercase;
}

.view-headerimage.view-id-headerimage.view-display-id-block_headerimage_narrow .container P {
    color: #FFF;
    margin-bottom: 15px;
    letter-spacing: 3px;
    font-size: 14px;
    line-height: 15px;
    text-transform: uppercase;
}

@media screen and (max-width: 640px) {
    .view-headerimage.view-id-headerimage.view-display-id-block_headerimage_narrow .container {
        position: absolute;
        left: 15px;
        bottom: 10%;
        width: 100%;
        max-width: 515px;
    }
}

/*//*/
.headervideooverlay {
    position: relative;
    height: 100vh;
    width: 100%;
    overflow: hidden;
    object-fit: cover;
}

.headervideooverlay .frontheaderintrovideo VIDEO {
    position: relativ;
    top: 0;
    left: 0;
    width: 100%vW;
    height: 100%vH;
    object-fit: cover;
}

.headervideooverlay .frontheaderintrovideo .container {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 515px;
    margin: auto;
    text-align: center;
}

.headervideooverlay .frontheaderintrovideo .headerimage-narrow .headerimage-narrow-inner H1 {
    color: #FFF;
    font-size: 2.1em;
    padding: 0 0 10px 0;
    font-weight: 700;
}

.headervideooverlay .frontheaderintrovideo .headerimage-narrow .headerimage-narrow-inner P {
    color: #FFF;
    font-size: 20px;
    text-align: center;
    padding: 0 0 10px 0;
}

.headervideooverlay .frontheaderintrovideo .headerimage-narrow .headerimage-narrow-inner A BUTTON {
    text-transform: uppercase;
    position: relative;
    border: none;
    font-size: 18px;
    transition: color 0.5s, transform 0.3s ease, background-color 0.3s ease;
    border-radius: 3px;
    margin: 15px 10px;
    padding: 10px 20px;
    border: 3px solid transparent;
    letter-spacing: 2px;
    min-width: 250px;
    background-color: transparent;
    color: #FFF;
}

.headervideooverlay .frontheaderintrovideo .headerimage-narrow .headerimage-narrow-inner A BUTTON:active {
    transform: translateY(3px);
}

.headervideooverlay .frontheaderintrovideo .headerimage-narrow .headerimage-narrow-inner A BUTTON:after, .headervideooverlay .frontheaderintrovideo .headerimage-narrow .headerimage-narrow-inner A BUTTON:before {
    border-radius: 3px;
}

.headervideooverlay .frontheaderintrovideo .headerimage-narrow .headerimage-narrow-inner A BUTTON.shrink-border.webdesign-btn {
    --accent-color: #ff8c00;
}

.headervideooverlay .frontheaderintrovideo .headerimage-narrow .headerimage-narrow-inner A BUTTON.shrink-border.qa-btn {
    --accent-color: #008ecf;
}

.headervideooverlay .frontheaderintrovideo .headerimage-narrow .headerimage-narrow-inner A BUTTON.shrink-border:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 3px solid var(--accent-color, #fff);
    transition: opacity 0.5s ease, border 0.5s ease;
}

.headervideooverlay .frontheaderintrovideo .headerimage-narrow .headerimage-narrow-inner A BUTTON.shrink-border:hover:before {
    opacity: 0;
}

.headervideooverlay .frontheaderintrovideo .headerimage-narrow .headerimage-narrow-inner A BUTTON.shrink-border:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
    border: 3px solid var(--accent-color, #fff);
    opacity: 0;
    z-index: -1;
    transform: scaleX(1.1) scaleY(1.3);
    transition: transform 0.5s ease, opacity 0.5s ease;
}

.headervideooverlay .frontheaderintrovideo .headerimage-narrow .headerimage-narrow-inner A BUTTON.shrink-border:hover:after {
    opacity: 1;
    transform: scaleX(1) scaleY(1);
}

/* Webdesign (Orange) */
BUTTON.shrink-border.webdesign-btn {
    --accent-color: #ff8c00;
}

/* QA (Blau) */
BUTTON.shrink-border.qa-btn {
    --accent-color: #008ecf;
}

/* Cyber Security (Rot) */
BUTTON.shrink-border.cyber-btn {
    --accent-color: #c9302c;
}

/*// Blog Teaser View*/
.block-views-blocknews-block-3 {
    padding: 100px 0;
}

.view-news.view-id-news LI.grid.list-group-item {
    border: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: stretch;
}

.view-news.view-id-news {
    position: relative;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.view-news.view-id-news .newsgrid {
    padding: 0px 0px 15px 0px;
    margin: 15px;
    position: relative;
    /* Ensure consistent background */
    min-height: 300px;
    /* Enforce a minimum height */
}

.view-news.view-id-news .newsgrid IMG {
    width: 100%;
    height: auto;
    margin: 0;
    border-radius: 1.25rem;
}

.view-news.view-id-news .newsgridbody A {
    display: inline-block;
    color: #333;
    text-decoration: none;
    font-weight: 600;
    transition: background-color 0.3s ease, transform 0.2s ease;
    position: relative;
}

.view-news.view-id-news .newsgridbody A:after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: #333;
    transform-origin: bottom right;
    transition: transform 0.25s ease-out;
}

.view-news.view-id-news .newsgridbody A:before {
    content: '';
    position: absolute;
    right: -25px;
    margin-top: -10px;
    height: 25px;
    width: 25px;
    background: url(/themes/custom/hetzenterprises/img//link_arrow.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.view-news.view-id-news.view-display-id-block_3 .newsgridbody A:hover:before.news-link {
    transform: scaleX(1);
    transform-origin: bottom left;
}

.view-news.view-id-news .newsgrid {
    transition: box-shadow 0.3s ease, transform 0.3s ease;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 350px;
    border: 1px solid #DDD;
    border-radius: 4px;
    overflow: hidden;
    padding: 1rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
    background-color: #FFF;
}

.view-news.view-id-news .newsgrid:hover {
    box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
    transform: scale(1.02);
}

.view-news.view-id-news .news-date {
    font-size: 0.9rem;
    color: #333;
    margin: 10px 0 0;
}

.view-news.view-id-news .news-link {
    display: inline-block;
    margin-top: 1rem;
    text-decoration: none;
    font-weight: bold;
    transition: color 0.3s ease;
}

.view-news.view-id-news .news-link:hover {
    outline: none;
}

.view-news.view-id-news .newsgrid .newsgridbody {
    padding: 0;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.view-news.view-id-news .newsgrid .newsgridbody H3 {
    font-size: 20px;
    margin: 0;
    padding-top: 15px;
    font-family: var(--font-heading);
    font-weight: 700;
    font-style: normal;
    min-height: 100px;
}

.view-news.view-id-news .newsgridbody P.news-teaser {
    min-height: 130px;
}

@media screen and (max-width: 767px) {
    .view-news.view-id-news {
        position: relative;
        padding: 15px;
    }
    
    .view-news.view-id-news.view-display-id-block_2 {
        padding: 0;
    }
}

.view-news.view-id-news.view-display-id-block_1 .views-exposed-form UL {
    list-style: none;
    padding: 0;
    display: inline;
}

.view-news.view-id-news.view-display-id-block_1 .views-exposed-form UL LI {
    list-style: none;
    display: inline-block;
    padding: 10px 10px 10px 0;
}

.view-news.view-id-news.view-display-id-block_1 .views-exposed-form UL LI A {
    padding: 5px 10px;
    color: #FFF;
    background-color: #535961;
    border: 1px solid #535961;
    text-transform: uppercase;
    transition: all 500ms ease-in-out;
    border-radius: 0;
    max-width: 175px;
    text-decoration: none;
}

.view-news.view-id-news.view-display-id-block_1 .views-exposed-form UL LI A:hover {
    padding: 5px 10px;
    color: #FFF;
    background-color: #000;
    border: 1px solid #000;
    text-transform: uppercase;
    transition: all 500ms ease-in-out;
    border-radius: 0;
    max-width: 175px;
    text-decoration: none;
}

.view-news.view-id-news.view-display-id-block_1 .views-exposed-form UL LI A.bef-link--selected {
    padding: 5px 10px;
    color: #FFF;
    background-color: #000;
    border: 1px solid #000;
    text-transform: uppercase;
    transition: all 500ms ease-in-out;
    border-radius: 0;
    max-width: 175px;
    text-decoration: none;
}

.news-teaser {
    margin-top: 0.5rem;
    color: #333;
}

/*// Blog Recent Posts View*/
.view-news.view-id-news.view-display-id-block_2 A {
    text-decoration: none !important;
    color: #333;
    border-radius: 0 !important;
}

.view-news.view-id-news.view-display-id-block_2 A:hover {
}

.view-news.view-id-news.view-display-id-block_2 A .newsgrid {
    padding: 0;
    margin: 20px;
    border: none;
    box-shadow: none;
    border-radius: 0 !important;
    border-bottom: medium dotted #333;
    text-decoration: none !important;
    min-height: auto !important;
}

.view-news.view-id-news.view-display-id-block_2 A:hover .newsgrid {
    transform: none !important;
    border-bottom: medium dotted #008ECF;
}

.view-news.view-id-news.view-display-id-block_2 A .newsgrid .newsgridbody {
    padding: 0 !important;
    flex-grow: 0 !important;
    display: compact !important;
    flex-direction: column;
}

.view-news.view-id-news.view-display-id-block_2 A .newsgrid .newsgridbody H3 {
    padding: 0 0 15px 0;
    margin: 0 !important;
    font-family: var(--font-heading);
    font-weight: normal;
    font-style: normal;
    text-transform: none;
    font-weight: 700;
    font-size: 18px;
    min-height: auto;
}

.view-news.view-id-news.view-display-id-block_2 A .newsgrid .newsgridbody P TIME {
    font-size: 16px;
    margin: 0;
    padding: 0;
}

.view-news.view-id-news.view-display-id-block_2 A .newsgrid .newsgridbody P {
    color: #333 !important;
    font-size: 16px;
}

.view-news.view-id-news.view-display-id-block_2 .view-footer {
    margin: auto;
}

.view-news.view-id-news.view-display-id-block_2 .view-footer A {
    display: inline-block;
    color: #333;
    padding: 12px 12px 0 0;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 600;
    text-align: center;
    transition: background-color 0.3s ease, transform 0.2s ease;
    position: relative;
}

.view-news.view-id-news.view-display-id-block_2 .view-footer A:after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: #333;
    transform-origin: bottom right;
    transition: transform 0.25s ease-out;
}

.view-news.view-id-news.view-display-id-block_2 .view-footer A:before {
    content: '';
    position: absolute;
    right: -20px;
    margin-top: -5px;
    height: 25px;
    width: 25px;
    background: url(/themes/custom/hetzenterprises/img//link_arrow.png);
    background-size: contain;
    background-repeat: no-repeat;
    filter: invert(0) !important;
}

/*// Node Teaser*/
.view-teaser.view-id-teaser.view-display-id-block_1 {
    padding: 100px 0 50px;
}

.view-teaser.view-id-teaser.view-display-id-block_1 .teaserbackground {
    position: relative;
}

.view-teaser.view-id-teaser.view-display-id-block_1 .teaserbackground .teaseroverlay {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 20%);
}

.view-teaser.view-id-teaser.view-display-id-block_1 .teaserbackground .teaseroverlay H2 {
    font-size: 32px;
    line-height: 45px;
    margin: 0 0 30px 0;
    font-weight: 700;
}

.view-teaser.view-id-teaser.view-display-id-block_1 .teaserbackground .teaseroverlay H3 {
    margin-bottom: 15px;
    letter-spacing: 3px;
    font-size: 18px;
    line-height: 22px;
    text-transform: uppercase;
    color: #4B4E53;
}

.view-teaser.view-id-teaser.view-display-id-block_1 .teaserbackground .teaseroverlay P {
    color: #4B4E53;
    font-weight: 400;
    padding-bottom: 15px;
}

.view-teaser.view-id-teaser .teaseroverlay A {
    display: inline-block;
    color: #333;
    text-decoration: none;
    font-weight: 600;
    transition: background-color 0.3s ease, transform 0.2s ease;
    position: relative;
}

.view-teaser.view-id-teaser .teaseroverlay A:after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: #333;
    transform-origin: bottom right;
    transition: transform 0.25s ease-out;
}

.view-teaser.view-id-teaser .teaseroverlay A:before {
    content: '';
    position: absolute;
    right: -25px;
    margin-top: -10px;
    height: 25px;
    width: 25px;
    background: url(/themes/custom/hetzenterprises/img//link_arrow.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.view-teaser.view-id-teaser .teaseroverlay A:hover:after {
    transform: scaleX(1);
    transform-origin: bottom left;
}

.view-teaser.view-id-teaser.view-display-id-block_1 IMG {
    margin: 0;
    width: 100%;
    height: auto;
    min-height: 500px;
    object-fit: cover;
}

.view-teaser.view-id-teaser.view-display-id-block_1 .col-lg-7.col-md-7.col-sm-12.col-12 {
    padding: 0;
}

.view-teaser.view-id-teaser.view-display-id-block_1 .col-lg-5.col-md-5.col-sm-12.col-12 {
    padding: 0;
}

@media screen and (max-width: 991px) {
    .view-teaser.view-id-teaser.view-display-id-block_1 .teaserbackground .teaseroverlay {
        position: relative;
        top: 0;
        left: 0;
        transform: none;
        text-align: left;
        padding: 10% 5%;
        width: 100%;
    }
    
    .view-teaser.view-id-teaser.view-display-id-block_1 IMG {
        margin: auto !important;
        height: auto !important;
        min-height: 400px !important;
        object-fit: cover;
    }
    
    .view-teaser.view-id-teaser .views-field-nothing {
        text-align: center;
    }
    
    .view-teaser.view-id-teaser.view-display-id-block_1 .col-lg-7.col-md-7.col-sm-12.col-12 {
        padding: 0;
        width: 100%;
    }
    
    .view-teaser.view-id-teaser.view-display-id-block_1 .col-lg-5.col-md-5.col-sm-12.col-12 {
        padding: 0;
        width: 100%;
    }
}

.view-teaser.view-id-teaser.view-display-id-block_2 {
    padding: 50px 0 100px;
}

.view-teaser.view-id-teaser.view-display-id-block_2 .teaserbackground {
    position: relative;
}

.view-teaser.view-id-teaser.view-display-id-block_2 .teaserbackground .teaseroverlay {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 20%);
}

.view-teaser.view-id-teaser.view-display-id-block_2 .teaserbackground .teaseroverlay H2 {
    font-size: 32px;
    line-height: 45px;
    margin: 0 0 30px 0;
    font-weight: 700;
    hyphens: auto;
}

.view-teaser.view-id-teaser.view-display-id-block_2 .teaserbackground .teaseroverlay H3 {
    margin-bottom: 15px;
    letter-spacing: 3px;
    font-size: 18px;
    line-height: 22px;
    text-transform: uppercase;
    color: #4B4E53;
}

.view-teaser.view-id-teaser.view-display-id-block_2 .teaserbackground .teaseroverlay P {
    color: #4B4E53;
    font-weight: 400;
    padding-bottom: 15px;
}

.view-teaser.view-id-teaser.view-display-id-block_2 IMG {
    margin: 0;
    width: 100%;
    height: auto;
    min-height: 500px;
    object-fit: cover;
}

.view-teaser.view-id-teaser.view-display-id-block_2 .col-lg-7.col-md-7.col-sm-12.col-12 {
    padding: 0;
}

.view-teaser.view-id-teaser.view-display-id-block_2 .col-lg-5.col-md-5.col-sm-12.col-12 {
    padding: 0;
}

@media screen and (max-width: 991px) {
    .view-teaser.view-id-teaser.view-display-id-block_2 .teaserbackground .teaseroverlay {
        position: relative;
        top: 0;
        left: 0;
        transform: none;
        text-align: left;
        padding: 10% 5%;
        width: 100%;
    }
    
    .view-teaser.view-id-teaser.view-display-id-block_2 IMG {
        margin: auto !important;
        height: auto !important;
        min-height: 400px !important;
        object-fit: cover;
    }
    
    .view-teaser.view-id-teaser .views-field-nothing {
        text-align: center;
    }
    
    .view-teaser.view-id-teaser.view-display-id-block_2 .col-lg-7.col-md-7.col-sm-12.col-12 {
        padding: 0;
        width: 100%;
    }
    
    .view-teaser.view-id-teaser.view-display-id-block_2 .col-lg-5.col-md-5.col-sm-12.col-12 {
        padding: 0;
        width: 100%;
    }
}

/*// Kunden*/
#block-views-block-customers-block-1 {
    padding: 100px 0;
}

.view-customers.view-id-customers .view-header {
    text-align: left;
}

.view-customers.view-id-customers LI.grid.list-group-item {
    padding: 25px;
    margin: 0;
    border: none;
    border-left: 1px solid #EEE;
    border-radius: 0;
    height: 125px;
}

.view-customers.view-id-customers LI.grid.list-group-item:nth-child(1) {
    padding: 25px;
    margin: 0;
    border: none;
    border-left: none;
    border-radius: 0;
}

.view-customers.view-id-customers LI.grid.list-group-item:nth-child(6) {
    padding: 25px;
    margin: 0;
    border: none;
    border-left: none;
    border-radius: 0;
}

.view-customers.view-id-customers LI.grid.list-group-item:nth-child(11) {
    padding: 25px;
    margin: 0;
    border: none;
    border-left: none;
    border-radius: 0;
}

.view-customers.view-id-customers {
    text-align: center;
}

.view-customers.view-id-customers IMG {
    width: auto;
    max-height: 75px;
    filter: grayscale(100);
}

.paragraph.paragraph--type--viewsreference .viewsreference--view-title {
    display: none;
}

.view-customers.view-id-customers.view-display-id-block_2 LI.grid.list-group-item {
    padding: 0;
    margin: 0;
    border: none;
    border: 1px solid #EEE;
    border-radius: 0;
}

.view-customers.view-id-customers.view-display-id-block_2 LI.grid.list-group-item .clients-grid {
    position: relative;
    height: 250px;
    padding: 0;
}

.view-customers.view-id-customers.view-display-id-block_2 LI.grid.list-group-item .clients-grid .clients-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 0;
}

.view-customers.view-id-customers.view-display-id-block_2 LI.grid.list-group-item .clients-grid .clients-logo IMG {
    width: 100%;
    height: auto;
}

/*// View Projects*/
.view-projects.view-id-projects {
    padding: 0 20px;
    width: 100%;
    margin: auto;
}

.view-projects.view-id-projects IMG {
    width: 100%;
    height: auto;
    position: relative;
    transition: all 500ms ease-in-out;
}

.view-projects.view-id-projects LI.grid.list-group-item {
    border: none;
    background: transparent;
    border-radius: 0;
    transition: all 500ms ease-in-out;
    position: relative;
}

.view-projects.view-id-projects FIGURE H3 {
    padding: 0 15px;
    font-weight: 700;
    font-size: 20px;
    text-align: center;
    height: 50px;
    transition: all 500ms ease-in-out;
}

.view-projects.view-id-projects FIGURE P {
    padding: 0 15px;
    font-weight: 400;
    font-size: 16px;
    text-align: center;
}

@media screen and (max-width: 768px) {
    .view-projects.view-id-projects {
        padding: 100px 15px;
        width: 100%;
        margin: auto;
    }
}

/*---------------*/
/***** Julia *****/
/*---------------*/
FIGURE.effect-julia {
    background: #FFF;
    box-shadow: 0 0 8px 1px #B7B7B9;
    border-radius: 0;
    padding-bottom: 20px;
    transition: all 500ms ease-in-out;
}

FIGURE.effect-julia:hover {
    background: #B7B7B9;
    padding-bottom: 20px;
    transition: all 500ms ease-in-out;
}

FIGURE.effect-julia IMG {
    max-width: none;
    -webkit-transition: opacity 1s, -webkit-transform 1s;
    transition: opacity 1s, transform 1s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

FIGURE.effect-julia FIGCAPTION {
    text-align: center;
}

FIGURE.effect-julia H3 {
    position: relative;
    padding: 0.5em 0;
    color: #333;
}

FIGURE.effect-julia P {
    display: inline-block;
    margin: 0 0 0.25em;
    padding: 0.4em 1em;
    background: transparent;
    color: #333;
    text-transform: none;
    font-weight: 500;
    font-size: 75%;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
}

FIGURE.effect-julia P:first-child {
    -webkit-transition-delay: 0.15s;
    transition-delay: 0.15s;
}

FIGURE.effect-julia:hover P:first-child {
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
}

FIGURE.effect-julia:hover IMG {
    opacity: 1;
    -webkit-transform: scale3d(1.1,1.1,1);
    transform: scale3d(1.1, 1.1, 1);
}

FIGURE.effect-julia:hover P {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0, 0, 0);
}

/*// Discover*/
.block-views-blockdiscover-block-1 H2 {
    padding: 0 15px;
}

.view-discover.view-id-discover {
    padding: 0 15px;
}

.view-discover.view-id-discover LI.grid.list-group-item {
    padding: 0;
    margin: 0 0 30px 0;
    border-radius: 0;
    border: none;
}

.view-discover.view-id-discover .tns-item {
}

.view-discover.view-id-discover A {
    text-decoration: none;
}

.view-discover.view-id-discover A .discover-grid IMG {
    border-radius: 1.25rem 1.25rem 0 0;
    transition: all 500ms ease-in-out;
    filter: grayscale(0.0);
}

.view-discover.view-id-discover A:hover .discover-grid IMG {
    border-radius: 1.25rem 1.25rem 0 0 !important;
    transform: scale(1.1);
    transition: all 500ms ease-in-out;
    filter: grayscale(0);
}

.view-discover.view-id-discover A .discover-grid {
    border-radius: 1.25rem;
    transition: all 500ms ease-in-out;
    margin: 0 15px;
    overflow: hidden;
}

.view-discover.view-id-discover A .discover-grid .discover-grid-body {
    background: #EEE;
    border-radius: 0 0 1.25rem 1.25rem;
    position: relative;
    transition: all 500ms ease-in-out;
}

.view-discover.view-id-discover A:hover .discover-grid .discover-grid-body {
    background: #333;
    border-radius: 0 0 1.25rem 1.25rem;
    position: relative;
    transition: all 500ms ease-in-out;
}

.view-discover.view-id-discover A .discover-grid H3 {
    padding: 10px 15px;
    text-align: left;
    font-size: 22px;
    transition: all 500ms ease-in-out;
    color: #333;
    font-weight: 700;
    height: 75px;
}

.view-discover.view-id-discover A .discover-grid P {
    padding: 0 15px 10px;
    text-align: left;
    font-size: 16px;
    height: 75px;
    transition: all 500ms ease-in-out;
}

.view-discover.view-id-discover A:hover .discover-grid H3 {
    padding: 10px 15px;
    text-align: left;
    font-size: 22px;
    transition: all 500ms ease-in-out;
    color: #FFF;
}

.view-discover.view-id-discover A:hover .discover-grid P {
    padding: 0 15px 10px;
    text-align: left;
    font-size: 16px;
    height: 75px;
    transition: all 500ms ease-in-out;
    color: #FFF;
}

@media screen and (min-width: 768px) {
    .view-discover.view-id-discover .tns-item {
        width: 300px !important;
    }
}

@media screen and (min-width: 991px) {
    .view-discover.view-id-discover .tns-item {
        width: 100%;
    }
}

.view-discover.view-id-discover .tns-controls BUTTON {
    border-radius: 50%;
    width: 50px;
    height: 50px;
    background: #EEE;
    transition: all 300ms ease-in-out;
}

.view-discover.view-id-discover .tns-controls BUTTON:hover {
    border-radius: 50%;
    width: 50px;
    height: 50px;
    background: #333;
    transition: all 300ms ease-in-out;
}

.view-discover.view-id-discover .tns-controls BUTTON:focus {
    border-radius: 50%;
    width: 50px;
    height: 50px;
    background: #EEE;
    transition: all 300ms ease-in-out;
}

/*// Discover solutions*/
.block-views-blocksolutions-block-1 {
    padding: 75px 15px;
}

.block-views-blocksolutions-block-1 H2 {
    padding: 0 15px;
}

.view-solutions.view-id-solutions {
    padding: 0 15px;
}

.view-solutions.view-id-solutions LI.grid.list-group-item {
    padding: 0;
    margin: 0 0 30px 0;
    border-radius: 0;
    border: none;
}

.view-solutions.view-id-solutions .tns-item {
}

.view-solutions.view-id-solutions A {
    text-decoration: none;
}

.view-solutions.view-id-solutions A .discover-grid IMG {
    border-radius: 1.25rem 1.25rem 0 0;
    transition: all 500ms ease-in-out;
    filter: grayscale(0.0);
}

.view-solutions.view-id-solutions A:hover .discover-grid IMG {
    border-radius: 1.25rem 1.25rem 0 0 !important;
    transform: scale(1.1);
    transition: all 500ms ease-in-out;
    filter: grayscale(0);
}

.view-solutions.view-id-solutions A .discover-grid {
    border-radius: 1.25rem;
    transition: all 500ms ease-in-out;
    margin: 0 15px;
    overflow: hidden;
}

.view-solutions.view-id-solutions A .discover-grid .discover-grid-body {
    background: #EEE;
    border-radius: 0 0 1.25rem 1.25rem;
    position: relative;
    transition: all 500ms ease-in-out;
}

.view-solutions.view-id-solutions A:hover .discover-grid .discover-grid-body {
    background: #333;
    border-radius: 0 0 1.25rem 1.25rem;
    position: relative;
    transition: all 500ms ease-in-out;
}

.view-solutions.view-id-solutions A .discover-grid H3 {
    padding: 10px 15px;
    text-align: left;
    font-size: 22px;
    transition: all 500ms ease-in-out;
    color: #333;
    font-weight: 700;
    height: 50px;
}

.view-solutions.view-id-solutions A .discover-grid P {
    padding: 0 15px 10px;
    text-align: left;
    font-size: 16px;
    height: 75px;
    transition: all 500ms ease-in-out;
}

.view-solutions.view-id-solutions A:hover .discover-grid H3 {
    padding: 10px 15px;
    text-align: left;
    font-size: 22px;
    transition: all 500ms ease-in-out;
    color: #FFF;
}

.view-solutions.view-id-solutions A:hover .discover-grid P {
    padding: 0 15px 10px;
    text-align: left;
    font-size: 16px;
    height: 75px;
    transition: all 500ms ease-in-out;
    color: #FFF;
}

@media screen and (min-width: 768px) {
    .view-solutions.view-id-solutions .tns-item {
        width: 300px !important;
    }
}

@media screen and (min-width: 991px) {
    .view-solutions.view-id-solutions .tns-item {
        width: 100%;
    }
}

/*// Key Facts - Case Study*/
.block-views-blockcase-stuy-block-1 {
    border-radius: 1.25rem;
    padding: 15px;
    box-shadow: 0 0 8px 1px #B7B7B9;
    background: #F9D84B;
    text-align: center;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_1 .views-field-field-projecttags FIGURE {
    display: flex;
    flex-wrap: wrap;
    /* Erlaubt den Umbruch */
    gap: 0px;
    /* Abstand zwischen den Elementen */
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_1 .views-field-field-projecttags FIGURE > * {
    flex: 11 calc(33% - 10px);
    max-width: calc(33% - 10px);
    margin: 0 auto;
}

@media (max-width: 1024px) {
    .view-case-stuy.view-id-case_stuy.view-display-id-block_1 .views-field-field-projecttags FIGURE > * {
        flex: 1 1 calc(33.33% - 10px);
        /* 3 Elemente pro Reihe auf kleineren Screens */
        max-width: calc(33.33% - 10px);
    }
}

@media (max-width: 768px) {
    .view-case-stuy.view-id-case_stuy.view-display-id-block_1 .views-field-field-projecttags FIGURE > * {
        flex: 1 1 calc(50% - 10px);
        /* 2 Elemente pro Reihe auf noch kleineren Screens */
        max-width: calc(50% - 10px);
    }
}

@media (max-width: 480px) {
    .view-case-stuy.view-id-case_stuy.view-display-id-block_1 .views-field-field-projecttags FIGURE > * {
        flex: 1 1 100%;
        /* 1 Element pro Reihe auf sehr kleinen Screens */
        max-width: 100%;
    }
}

.block-views-blockcase-stuy-block-1 H2 {
    font-weight: 700 !important;
    letter-spacing: 4px;
}

.block-views-blockcase-stuy-block-1 P {
    color: #333333;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_1 .taxonomy-term P {
    font-size: 14px;
}

.block-views-blockcase-stuy-block-1 HR {
    color: #333333;
    width: 100px;
    height: 1px;
    margin: 30px auto;
}

.view-case-stuy.view-id-case_stuy IMG {
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_1 IMG {
    width: 100%;
    max-width: 50px;
    margin: 20px auto 0;
}

.view-case-stuy.view-id-case_stuy .views-field-nothing {
    margin: auto;
    text-align: center;
}

@media screen and (max-width: 959px) {
    .block-views-blockcase-stuy-block-1 {
        border-radius: 1.25rem;
        padding: 15px;
        box-shadow: 0 0 8px 1px #B7B7B9;
        background: #F9D84B;
        text-align: center;
        max-width: 515px;
        margin: auto;
    }
}

/*// Case Study - List*/
.view-case-stuy.view-id-case_stuy.view-display-id-block_2 {
    padding: 0;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_2 IMG {
    width: 100% !important;
    height: auto;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_2 .views-field-nothing {
    text-align: left;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_2 LI.grid.list-group-item {
    border: none;
    padding: 0;
    margin: 15px;
    display: flex;
    align-items: stretch;
    transition: box-shadow 0.3s ease, transform 0.3s ease;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 350px;
    border: 1px solid #DDD;
    border-radius: 4px;
    overflow: hidden;
    padding: 1rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
    background-color: #FFF;
    width: calc(33% - 30px);
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_2 LI.grid.list-group-item:hover {
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
    background-color: #F9D84B;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_2 .project-detail {
    position: relative;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_2 .project-detail .project-detail-inner {
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_2 .project-detail .project-detail-inner P {
    min-height: 235px;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_2 .project-detail .project-detail-inner A {
    display: inline-block;
    color: #333333;
    text-decoration: none;
    font-weight: 600;
    transition: background-color 0.3s ease, transform 0.2s ease;
    position: relative;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_2 .project-detail-inner .project-detail-inner-link P {
    min-height: 1px;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_2 .project-detail .project-detail-inner A:after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: #333;
    transform-origin: bottom right;
    transition: transform 0.25s ease-out;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_2 .project-detail .project-detail-inner A:before {
    content: '';
    position: absolute;
    right: -25px;
    margin-top: -10px;
    height: 25px;
    width: 25px;
    background: url(/themes/custom/hetzenterprises/img//link_arrow.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_2 .project-detail .project-detail-inner A:hover:after {
    transform: scaleX(1);
    transform-origin: bottom left;
}

@media screen and (max-width: 960px) {
    .view-case-stuy.view-id-case_stuy.view-display-id-block_2 LI.grid.list-group-item {
        border: none;
        padding: 0;
        margin: 15px;
        display: flex;
        align-items: stretch;
        transition: box-shadow 0.3s ease, transform 0.3s ease;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        min-height: 350px;
        border: 1px solid #DDD;
        border-radius: 4px;
        overflow: hidden;
        padding: 1rem;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        transition: box-shadow 0.3s ease, transform 0.3s ease;
        background-color: #FFF;
        width: calc(100% - 30px);
    }
}

/*// Case Study*/
.view-case-stuy.view-id-case_stuy.view-display-id-block_3 {
    overflow: hidden;
    position: relative;
    height: 70vh;
    padding: 0;
    margin: 50px 0 100px;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 IMG {
    width: 100%;
    height: auto;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 .nodeteaserbody {
    padding: 5%;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 P A {
    display: inline-block;
    color: #333;
    padding: 12px 12px 0 0;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 600;
    text-align: center;
    transition: background-color 0.3s ease, transform 0.2s ease;
    position: relative;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 P A:after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: #333;
    transform-origin: bottom right;
    transition: transform 0.25s ease-out;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 P A:before {
    content: '';
    position: absolute;
    right: -20px;
    margin-top: -5px;
    height: 25px;
    width: 25px;
    background: url(/themes/custom/hetzenterprises/img//link_arrow.png);
    background-size: contain;
    background-repeat: no-repeat;
    filter: invert(0) !important;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 P A:hover:after {
    transform: scaleX(1);
    transform-origin: bottom left;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 .field-content .projectteaser .container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    /* Use Flexbox */
    justify-content: center;
    /* Center columns horizontally */
    align-items: center;
    /* Center columns vertically */
    gap: 20px;
    /* Add spacing between columns */
    padding: 20px !important;
    background: rgba(0, 0, 0, 0.5);
    height: 80%;
    width: 100%;
    color: #FFF;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 H2 {
    border-bottom: 1px solid #FFF;
    padding: 0 0 10px 0;
    text-align: left;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 H3 {
    text-align: left;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 .field-content .projectteaser .container P {
    color: #FFF;
    text-align: left;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 .field-content .projectteaser .container A {
    display: inline-block;
    color: #FFF;
    padding: 12px 12px 0 0;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 600;
    text-align: center;
    transition: background-color 0.3s ease, transform 0.2s ease;
    position: relative;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 .field-content .projectteaser .container A:after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: #FFF;
    transform-origin: bottom right;
    transition: transform 0.25s ease-out;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 .field-content .projectteaser .container A:before {
    content: '';
    position: absolute;
    right: -20px;
    margin-top: -5px;
    height: 25px;
    width: 25px;
    background: url(/themes/custom/hetzenterprises/img//link_arrow.png);
    background-size: contain;
    background-repeat: no-repeat;
    filter: invert(1) !important;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 .field-content .projectteaser .container A:hover:after {
    transform: scaleX(1);
    transform-origin: bottom left;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 .projectteaser .container .col-md-4 P {
    text-align: center;
    letter-spacing: 2px;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 .container .icons P {
    text-align: center !important;
    letter-spacing: 0 !important;
}

.view-case-stuy.view-id-case_stuy.view-display-id-block_3 .container .icons IMG {
    width: 100%;
    max-width: 80px;
    margin: 15px auto;
}

@media screen and (max-width: 959px) {
    .view-case-stuy.view-id-case_stuy.view-display-id-block_3 .field-content .projectteaser .container {
        position: relative;
        top: 0;
        left: 0;
        transform: none;
        transform: none;
        left: 0;
        display: flex;
        /* Use Flexbox */
        justify-content: center;
        gap: 0;
        /* Add spacing between columns */
        padding: 20px;
        background: rgba(0, 0, 0, 0.8);
        height: auto;
        width: 90%;
        color: #FFF;
        margin-top: -30%;
    }
    
    .view-case-stuy.view-id-case_stuy.view-display-id-block_3 {
        overflow: visible;
        position: relative;
        height: auto;
        padding: 0;
        margin: 50px 0 100px;
    }
}

/* Karte */
.view-certificates.view-id-certificates {
    max-width: 991px;
    margin: auto;
}

.view-certificates.view-id-certificates .list-group LI.grid.list-group-item {
    padding: 10px;
    margin: 0 0 30px 0;
    border: none;
}

.view-certificates.view-id-certificates .list-group LI.grid.list-group-item H3 {
    font-size: 18px;
    padding-top: 15px;
    text-align: center;
    font-weight: 700;
    margin: auto;
}

.view-certificates.view-id-certificates LI.grid.list-group-item .certificate-logo IMG {
    max-width: 200px;
    margin: auto;
}

/* Titel */
.certificate-title {
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
    margin: 0;
}