/*
 Theme Name:   CreaConnect Child
 Theme URI:    https://creaconnect.ch
 Description:  CreaConnect AG – GeneratePress child theme
 Author:       CreaConnect AG
 Author URI:   https://creaconnect.ch
 Template:     generatepress
 Version:      1.0
 Text Domain:  creaconnect-child
*/

html {
	scroll-behavior: auto !important;
}

body {
    background-color: #fff;
    margin-top: 78px;
    overflow-x: hidden;
}

a.btn.btn-primary {
	background-color: #ffffff;
	border-color: #21AB94;
	color: #21AB94;
	border-radius: 0;
	text-decoration: none;
}

a.btn.btn-primary:hover {
	background-color: #21AB94;
	color: #ffffff;
}

body,
body button,
body input,
body select,
body textarea,
body h1,
body h3,
body h4,
body h5,
body h6,
body p,
body li,
body a,
body span,
body div,
body label,
body td,
body th {
    font-family: "elza", sans-serif !important;
    font-weight: 400 !important;
    font-style: normal !important;
}

body h2 {
    font-family: "elza, bold", sans-serif !important;
    font-weight: 400 !important;
    font-style: normal !important;
}

.site-header {
    text-align: center;
	width: 100%;
	position: fixed;
	top: 0;
	z-index: 9999;
	-webkit-box-shadow: 0px 0px 50px rgba(34, 170, 147, 0.2);
	-moz-box-shadow: 0px 0px 50px rgba(34, 170, 147, 0.2);
	box-shadow: 0px 0px 50px rgba(34, 170, 147, 0.2);
}

div#content {
    min-height: calc(100vh - 111px);
}

.inside-header {
	padding: 5px 15px;
}

.inside-header.grid-container {
    max-width: 1200px;
}

.one-container .site-content {
    padding: 40px 0px !important;
}

.page-id-2 div#content,
.page-id-100 div#content {
	padding: 0px !important;
}

.headline-green {
    color: #21AB94;
}

.headline-blue {
    color: #043150;
}

.site-footer .site-info {
    border-top: 1px solid;
	-webkit-box-shadow: inset 0px -1px 20px 1px rgba(0, 0, 0, .05);
    box-shadow: inset 0px -1px 20px 1px rgba(0, 0, 0, .05);
}

.inside-site-info {
    padding: 10px 15px;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.inside-site-info a {
	color: #000000;
	text-decoration: none;
}

.inside-site-info a:hover {
	color: #21AB94;
}

.footer-content .copyright-bar {
    text-align: left;
    padding: 0;
}

.footer-content .legal-bar {
    text-align: right;
    padding: 0;
}

.footer-container {
    background: #043150;
}

.prefooter {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 50px;
    padding-bottom: 80px;
}

.prefooter p,
.prefooter a {
	color: #FFFFFF;
	text-decoration: none;
}

.prefooter p.footer-title {
	border-bottom: 2px solid #FFFFFF;
	margin-bottom: 10px;
}

.prefooter p {
    margin-bottom: 5px;
}

.footer-content {
    -webkit-box-shadow: inset 0px -1px 20px 1px rgba(0, 0, 0, .15);
    box-shadow: inset 0px -1px 20px 1px rgba(0, 0, 0, .15);
}

span.copyright, span.copyright a, span.legal {
    font-size: small;
    font-weight: 200;
}

h1.entry-title {
    color: #21AB94;
}

.tag-container p {
    display: inline-flex;
    border: 1px solid #ffffff;
    padding: 5px;
    margin-bottom: 10px;
    margin-right: 8px;
}

.tag-container.color p {
    border: 1px solid #22AA93;
}

.custom-arrow-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    white-space: nowrap;
    color: #ffffff;
}

.custom-arrow-link__text {
    line-height: 1;
}

.custom-arrow-link__icon {
    display: inline-flex;
    align-items: center;
}

.custom-arrow-link__icon svg {
    width: 48px;
    height: auto;
    display: block;
    overflow: visible;
}

.custom-arrow-link__icon line,
.custom-arrow-link__icon polyline {
    fill: none;
    stroke: #ffffff;
    stroke-miterlimit: 10;
    stroke-width: 2px;
    vector-effect: non-scaling-stroke;
}

.custom-arrow-link__icon #Back,
.custom-arrow-link__icon #Front {
    transform-box: fill-box;
    transform-origin: left center;
    transition: transform 0.25s ease, stroke 0.25s ease;
}

.custom-arrow-link__icon #Back {
    transform: scaleX(1);
}

.custom-arrow-link__icon #Front {
    transform: translateX(0);
}

a.custom-arrow-link:hover .custom-arrow-link__icon #Back {
    transform: scaleX(1.25);
}

a.custom-arrow-link:hover .custom-arrow-link__icon #Front {
    transform: translateX(13px);
}

.error404 h1.entry-title {
	margin-bottom: 35px;
}

.page-id-100 span.custom-arrow-link__text {
    color: #000000;
}

.page-id-100 .custom-arrow-link__icon line, .page-id-100 .custom-arrow-link__icon polyline {
    stroke: #000000;
}

.same-height {
    align-items: stretch !important;
}

.same-height > .gb-grid-column {
    display: flex !important;
}

.same-height > .gb-grid-column > .gb-container,
.same-height > .gb-grid-column > .gb-container > .gb-inside-container {
    height: 100% !important;
}

.same-height > .gb-grid-column:first-child > .gb-container,
.same-height > .gb-grid-column:first-child > .gb-container > .gb-inside-container {
    display: flex !important;
    flex-direction: column !important;
}

.same-height > .gb-grid-column:first-child .custom-arrow-link {
    margin-top: auto !important;
}


.service-card__link {
	display: block;
	height: 100%;
	text-decoration: none;
	color: inherit;
}

.service-card {
	height: 100%;
	overflow: hidden;
}

.service-card__image {
	position: relative;
	overflow: hidden;
}

.service-card__image img {
	display: block;
	width: 100%;
	height: auto;
	transform: scale(1);
	transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.service-card__overlay {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: flex-end;
	padding: 24px;
	padding-bottom: 0;
	overflow: hidden;
}

.service-card__overlay::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
		10deg,
		rgba(var(--service-accent-rgb), 1) 0%,
		rgba(var(--service-accent-rgb), 1) 35%,
		rgba(var(--service-accent-rgb), 0.65) 60%,
		rgba(var(--service-accent-rgb), 0) 100%
	);
	opacity: 1;
	transition: opacity 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

.service-card__overlay-inner {
	position: relative;
	z-index: 2;
	width: 100%;
	color: var(--service-text);
}

.service-card__title {
	margin: 0;
	transform: translateY(0);
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
	font-size: 17px;
    font-weight: 600 !important;
}

.service-card__description {
	max-height: 0;
	margin-top: 0;
	overflow: hidden;
	opacity: 0;
	transform: translateY(24px);
	transition:
		max-height 0.55s cubic-bezier(0.22, 1, 0.36, 1),
		opacity 0.45s ease,
		transform 0.55s cubic-bezier(0.22, 1, 0.36, 1),
		margin-top 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

.service-card__description p:last-child {
	margin-bottom: 0;
}

.service-card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding: 20px 24px;
	background: var(--service-accent);
	color: var(--service-text);
}

.service-card__more {
	display: inline-block;
}

.service-card__icon {
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
	margin-right: 10px;
}

.service-card__icon svg {
	display: block;
	width: 48px;
	height: auto;
	overflow: visible;
}

.service-card__icon line,
.service-card__icon polyline {
	fill: none;
	stroke: currentColor;
	stroke-miterlimit: 10;
	stroke-width: 2px;
	vector-effect: non-scaling-stroke;
}

.service-card__icon #Back,
.service-card__icon #Front {
	transform-box: fill-box;
	transform-origin: left center;
	transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

.service-card__icon #Back {
	transform: scaleX(1);
}

.service-card__icon #Front {
	transform: translateX(0);
}

.service-card__link:hover .service-card__image img {
	transform: scale(1.08);
}

.service-card__link:hover .service-card__overlay::before {
	opacity: 1;
}

.service-card__link:hover .service-card__title {
	transform: translateY(-10px);
}

.service-card__link:hover .service-card__description {
	max-height: 220px;
	margin-top: 14px;
	opacity: 1;
	transform: translateY(0);
}

.service-card__link:hover .service-card__icon #Back {
	transform: scaleX(1.18);
}

.service-card__link:hover .service-card__icon #Front {
	transform: translateX(10px);
}

.service-card__link:hover {
	text-decoration: none;
}

/* Farben wiederholen sich alle 6 Elemente */
.services-archive .row > *:nth-child(6n + 1) {
	--service-accent: #000000;
	--service-accent-rgb: 0, 0, 0;
	--service-text: #ffffff;
}

.services-archive .row > *:nth-child(6n + 2) {
	--service-accent: #043150;
	--service-accent-rgb: 4, 49, 80;
	--service-text: #ffffff;
}

.services-archive .row > *:nth-child(6n + 3) {
	--service-accent: #22AA93;
	--service-accent-rgb: 34, 170, 147;
	--service-text: #ffffff;
}

.services-archive .row > *:nth-child(6n + 4) {
	--service-accent: #22AA93;
	--service-accent-rgb: 34, 170, 147;
	--service-text: #ffffff;
}

.services-archive .row > *:nth-child(6n + 5) {
	--service-accent: #E5E5E5;
	--service-accent-rgb: 229, 229, 229;
	--service-text: #000000;
}

.services-archive .row > *:nth-child(6n + 6) {
	--service-accent: #043150;
	--service-accent-rgb: 4, 49, 80;
	--service-text: #ffffff;
}

.services-archive div.col-12 {
    margin-bottom: 30px;
}

.servygo-form-field {
    width: 100%;
    border: 1px solid #0431506b !important;
    background: transparent !important;
}

input.btn-primary {
	background-color: #ffffff;
	border-color: #21ab947d;
	color: #21ab947d;
	border-radius: 0;
	text-decoration: none;
}

input.btn-primary:hover {
	background-color: #21AB94;
	color: #ffffff;
	border-color: #21AB94;
}

input.btn-primary:focus {
	background-color: #21AB94;
	color: #ffffff;
	border-color: #21AB94;
	box-shadow: 0 0 0 .2rem rgba(34, 170, 147, .5)
}

.wpcf7 form .wpcf7-response-output {
	margin: 2em 0em 1em !important;
}

.wpcf7 form .wpcf7-response-output {
	border: 2px solid #21AB94 !important;
}

.job-box:first-child {
    border-top: 2px solid #21AB94;
    padding-top: 30px;
}

.job-box {
    border-bottom: 2px solid #21AB94;
    padding: 15px 0px;
}

.job-box a {
    text-decoration: none;
}

h2.job-title {
	color: #043150;
	width: fit-content;
}

.job-details {
    display: flex;
    gap: 30px;
    align-items: center;
}

.job-details p {
    color: #000000;
}


.service-single-intro__content,
.service-single-intro__media {
	height: 100%;
}

.service-single-intro__media {
	min-height: 420px;
	overflow: hidden;
}

.service-single-intro__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.service-single-brands {
	background: #22AA931A;
	padding-top: 0;
	padding-bottom: 0;
}

.service-single-brands.alignfull {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

.service-single-brands__inner {
	max-width: var(--gb-container-width);
	margin-left: auto;
	margin-right: auto;
	padding: 15px 15px 0;
}

.service-single-brands__title {
	color: var(--accent);
	margin: 0;
}

.service-single-brands__spacer--top,
.service-single-brands__spacer--middle,
.service-single-brands__spacer--bottom {
	height: 100px;
}

.service-single-intro {
    margin-bottom: 100px;
}

.single-service div#content {
	padding-bottom: 0 !important;
}

.content-divider {
	width: 100%;
	height: 2px;
	background: linear-gradient(
		to right,
		transparent 0%,
		#21AB94 80%,
		#21AB94 100%
	);
}

.custom-accordion {
    --accordion-border-color: #e5e7eb;
    --accordion-border-color-hover: #22AA93;
    --accordion-background-color: #ffffff;
    --accordion-background-color-open: #fafbfc;
    --accordion-title-color: #111827;
    --accordion-text-color: #000000;
    --accordion-shadow: 0 10px 30px rgba(15, 23, 42, 0.06);
    --accordion-shadow-open: 0 16px 38px rgba(15, 23, 42, 0.08);
    --accordion-radius: 0px;
    --accordion-gap: 14px;
    --accordion-padding-horizontal: 22px;
    --accordion-padding-vertical: 20px;
    --accordion-icon-size: 28px;
    --accordion-transition: 0.38s cubic-bezier(0.65, 0, 0.35, 1);

    display: grid;
    gap: var(--accordion-gap);
}

.custom-accordion__item {
    border: none;
    border-radius: var(--accordion-radius);
    background: var(--accordion-background-color);
    box-shadow: none;
    overflow: hidden;
    transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease, background-color 0.25s ease;
    border-bottom: 2px solid #22AA93;
}

.custom-accordion__item:hover {
    border-color: var(--accordion-border-color-hover);
    transform: translateY(-1px);
}

.custom-accordion__item.is-open {
    background: var(--accordion-background-color-open);
    border-color: var(--accordion-border-color-hover);
    box-shadow: none;
}

.custom-accordion__heading {
    margin: 0;
}

.custom-accordion__trigger {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border: 0;
    background: transparent;
    padding: 20px 0;
    text-align: left;
    font: inherit;
    color: var(--accordion-title-color);
    cursor: pointer;
}

button.custom-accordion__trigger {
    background: #ffffff;
    color: #000000;
}

.custom-accordion__trigger:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: -2px;
}

.custom-accordion__title {
    color: #043150;
}

.custom-accordion__icon {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    line-height: 1;
    transform: rotate(0deg);
    transform-origin: center;
    transition:
        transform 0.38s cubic-bezier(0.65, 0, 0.35, 1),
        background-color 0.25s ease,
        color 0.25s ease;
}

.custom-accordion__item.is-open .custom-accordion__icon {
    transform: rotate(90deg);
}

.custom-accordion__panel {
    height: 0;
    overflow: hidden;
    transition: height var(--accordion-transition);
}

.custom-accordion__content {
	padding: 22px 0px;
	color: var(--accordion-text-color);
	opacity: 0;
	transform: translateY(-8px);
	background: #ffffff;
	transition: opacity 0.25s ease, transform 0.25s ease;
}

.custom-accordion__item.is-open .custom-accordion__content {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.08s;
}

.custom-accordion__content > :first-child {
    margin-top: 0;
}

.custom-accordion__content > :last-child {
    margin-bottom: 0;
}

button.menu-toggle,
.main-navigation .main-nav ul li a {
    background: #ffffff !important;
}


.hero-video {
    position: relative;
    min-height: 20vh;
    overflow: hidden;
    border-radius: 0;
}

.hero-video__media {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    z-index: 1;
}

.hero-video__content h1,
.hero-video__content p {
    color: inherit;
}

.hero-video::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background: linear-gradient(
        to top,
        rgba(255, 255, 255, 1) 0%,
        rgba(255, 255, 255, 0.7) 35%,
        rgba(255, 255, 255, 0.25) 70%,
        rgba(255, 255, 255, 0.08) 100%
    );
}

.sgt-testimonials__stars {
	color: #21AB94;
}

.sgt-testimonials__control .carousel-control-prev-icon, 
.sgt-testimonials__control .carousel-control-next-icon {
    background-color: #22AA931A !important;
}

.sgt-testimonials__control .carousel-control-prev-icon:hover, 
.sgt-testimonials__control .carousel-control-next-icon:hover {
    background-color: #21AB94 !important;
}

button.sgt-testimonials__toggle {
    color: #21AB94;
    border: 1px solid #21AB94;
    padding: 3px 10px;
	text-decoration: none;
}

button.sgt-testimonials__toggle:hover, button.sgt-testimonials__toggle:focus {
    color: #ffffff;
    border: 1px solid #21AB94;
    padding: 3px 10px;
	background: #21AB94;
}

@media (max-width: 768px) {
    .hero-video,
    .hero-video__overlay {
        min-height: 20vh;
    }

    .hero-video__overlay {
        padding: 60px 20px;
    }
	
	.sgt-testimonials__control {
		width: 25px;
		opacity: 1;
	}
}

@media (max-width: 768px) {
    .custom-accordion {
        --accordion-radius: 16px;
        --accordion-gap: 12px;
        --accordion-padding-horizontal: 18px;
        --accordion-padding-vertical: 18px;
    }

    .custom-accordion__title {
        font-size: 17px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .custom-accordion__item,
    .custom-accordion__icon,
    .custom-accordion__panel,
    .custom-accordion__content {
        transition: none !important;
    }
}

@media (min-width: 992px) {
	h1.entry-title, h1.gb-text.gb-text-6ca9eda7 {
		font-size: 100px;
		margin-bottom: 100px;
	}
	
	.service-single-intro__content h1 {
		margin-bottom: 0;
	}
	
	h1.gb-headline.gb-headline-5fe0f97c.gb-headline-text {
		font-size: 70px;
	}
}

@media (max-width: 991px) {
	.service-single-intro__media {
		min-height: 320px;
	}
}

@media (max-width: 767px) {
	.service-single-intro__media {
		min-height: 280px;
		margin-top: 30px;
	}

	.service-single-brands__spacer--top,
	.service-single-brands__spacer--middle,
	.service-single-brands__spacer--bottom {
		height: 50px;
	}
}

@media only screen and (max-width: 768px) {
    .footer-content .copyright-bar {
        text-align: center;
        padding: 0;
    }

    .footer-content .legal-bar {
        text-align: center;
        padding: 0;
        margin-top: 15px;
    }
	
	.serge-burger-portrait {
		max-height: 400px;
		width: auto;
	}
}


.grecaptcha-badge {
    visibility: hidden !important;
}

p.servygo--google-notice {
    font-size: small;
    color: #000000;
    opacity: .6;
}