/*
Theme Name: Twenty Twenty-Five Child
Theme URI: https://fewo-wutachtal.de
Description: Child Theme von Twenty Twenty-Five für Fewo Wutachtal. Anpassungen an Templates, Styles und theme.json gehören hierher, nicht ins Parent Theme.
Author: Fewo Wutachtal
Template: twentytwentyfive
Requires at least: 6.7
Tested up to: 7.0
Requires PHP: 7.2
Version: 1.3.5
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfive-child
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, wide-blocks, block-styles, style-variations, blog
*/

/*
 * Zusätzliche Frontend- und Editor-Styles.
 * Design-Tokens (Farben, Typo, Abstände) besser in theme.json pflegen.
 */

:root {
	--wp--preset--color--red: #ff4200;
}
:root :where(.wp-element-button, .wp-block-button__link), .wpcf7-submit {
    background-color: var(--wp--preset--color--red);
}
.hover-shadow:hover{
	box-shadow: 0 2px 5px 3px rgba(0, 0, 0, 0.07);
    transition-duration: 300ms;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.7, 1, 0.7, 1);
}
/* Contact Bar */
.site-contact-bar, .site-contact-bar a {
	color: #4d4d4d;
}
.site-contact-bar a {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	text-decoration: none;
}
.site-contact-bar a:hover,
.site-contact-bar a:focus-visible {
	text-decoration: underline;
}
.site-contact-bar__icon {
	width: 1em;
	height: 1em;
	flex: 0 0 auto;
	display: block;
}
.site-contact-bar__items {
	box-sizing: border-box;
	gap: 2rem;
}
.site-contact-bar p {
	position: relative;
	margin: 0;
	white-space: nowrap;
}
.site-contact-bar__items > p + p::before {
	content: "";
	position: absolute;
	left: -1rem;
	top: 0.15em;
	bottom: 0.15em;
	border-left: 1px solid currentColor;
	opacity: 0.45;
	pointer-events: none;
}
/* Header */	
.site-header-bar {
	background-color: var(--wp--preset--color--base, #f8f8f8);
}
.site-header-bar .wp-block-site-logo img {
	height: 80px;
	width: auto;
	max-width: none;
	transition: height 0.25s ease;
}
.site-header-bar.is-scrolled .wp-block-site-logo img {
	height: 45px;
}
.site-header-bar__row, .site-header-bar__row > .wp-block-group {
	align-items: stretch;
}
.site-header-bar .wp-block-navigation-item__content {
	display: flex;
	align-items: center;
	padding-inline: 0.65rem;
	text-transform: uppercase;
	text-decoration: none;
}

@media (min-width: 600px) {
	.site-header-bar .wp-block-navigation,
	.site-header-bar .wp-block-navigation__responsive-container:not(.is-menu-open),
	.site-header-bar .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-close,
	.site-header-bar .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-dialog {
		display: flex;
		align-items: stretch;
		height: 100%;
	}

	.site-header-bar .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-container-content,
	.site-header-bar .wp-block-navigation__container {
		display: flex;
		flex: 1 1 auto;
		align-items: stretch;
		align-self: stretch;
		height: auto;
	}

	.site-header-bar .wp-block-navigation__container {
		flex-wrap: nowrap;
		gap: 0;
	}

	.site-header-bar .wp-block-navigation-item {
		display: flex;
		align-items: stretch;
		align-self: stretch;
	}

	.site-header-bar .wp-block-navigation-item__content {
		align-self: stretch;
		height: auto;
	}
}

.site-header-bar .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
.site-header-bar .wp-block-navigation-item__content[aria-current="page"] {
	color: var(--wp--preset--color--red);
}

.site-header-bar .wp-block-navigation-item__content:hover,
.site-header-bar .wp-block-navigation-item__content:focus-visible,
.site-header-bar .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content:hover,
.site-header-bar .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content:focus-visible,
.site-header-bar .wp-block-navigation-item__content[aria-current="page"]:hover,
.site-header-bar .wp-block-navigation-item__content[aria-current="page"]:focus-visible {
	background-color: var(--wp--preset--color--red);
	color: #ffffff;
	text-decoration: none;
}

.site-header-bar .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	height: auto;
	padding: 0.75rem 1rem;
}

.site-header-bar .wp-block-navigation__responsive-container-open {
	align-self: center;
}

@media (prefers-reduced-motion: reduce) {
	.site-header-bar .wp-block-site-logo img {
		transition: none;
	}
}

.site-header-bar::after {
	content: "";
	position: absolute;
	z-index: 1;
	left: 0;
	right: 0;
	bottom: 0;
	height: 15px;
	box-shadow: 0 0 15px rgba(0, 0, 50, 0.09);
	clip-path: inset(15px 0 -15px 0);
	pointer-events: none;
}
/* Gutenberg Akkordeon */
.wp-block-accordion .wp-block-accordion-heading:hover,
.wp-block-accordion .wp-block-accordion-heading:focus-visible,
.wp-block-accordion .is-open .wp-block-accordion-heading {
	background-color: var(--wp--preset--color--red);
	color: var(--wp--preset--color--white);
	text-decoration: none;
}
/* Carousel Slider Block for Gutenberg */
.wp-block-cb-carousel-v2 .cb-button-prev, .wp-block-cb-carousel-v2.cb-rtl .cb-button-next,
.wp-block-cb-carousel-v2 .cb-button-next, .wp-block-cb-carousel-v2.cb-rtl .cb-button-prev {
    color: var(--wp--preset--color--white);
    background: var(--wp--preset--color--red);
    padding: 10px;
}
/* Contact form 7 */
.wpcf7-text, .wpcf7-textarea {
    display: block;
    width: 100%;
    min-height: 34px;
    padding: 6px 12px;
    font-size: 13px;
    font-weight: 300;
    color: #34343c;
    border: 1px solid #ebeef6;
	background: #f7f8fa;
    border-radius: 4px;
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.wpcf7-text:focus, .wpcf7-textarea:focus {
	border-color: var(--wp--preset--color--red);
}
/*
 * Trennlinie: Baum-Icon (Font Awesome Free 7.3.1, tree) mittig,
 * dünne Linien links und rechts. Vorlage: divider-with-icon auf
 * fewo-wutachtal.de/umgebung/
 * Icons: CC BY 4.0 — https://fontawesome.com/license/free
 */
:root hr.wp-block-separator:not(.is-style-dots) {
	--fewo-separator-line: #c4c4c4;
	border: none !important;
	opacity: 1 !important;
	width: 100% !important;
	max-width: none;
	height: 34px !important;
	margin-block: 30px;
	background-color: transparent !important;
	background-image:
		linear-gradient(var(--fewo-separator-line), var(--fewo-separator-line)),
		linear-gradient(var(--fewo-separator-line), var(--fewo-separator-line)),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath fill='%23226700' d='M320 32C327 32 333.7 35.1 338.3 40.5L474.3 200.5C480.4 207.6 481.7 217.6 477.8 226.1C473.9 234.6 465.4 240 456 240L431.1 240L506.3 328.5C512.4 335.6 513.7 345.6 509.8 354.1C505.9 362.6 497.4 368 488 368L449.5 368L538.3 472.5C544.4 479.6 545.7 489.6 541.8 498.1C537.9 506.6 529.4 512 520 512L352 512L352 576C352 593.7 337.7 608 320 608C302.3 608 288 593.7 288 576L288 512L120 512C110.6 512 102.1 506.6 98.2 498.1C94.3 489.6 95.6 479.6 101.7 472.5L190.5 368L152 368C142.6 368 134.1 362.6 130.2 354.1C126.3 345.6 127.6 335.6 133.7 328.5L208.9 240L184 240C174.6 240 166.1 234.6 162.2 226.1C158.3 217.6 159.6 207.6 165.7 200.5L301.7 40.5C306.3 35.1 313 32 320 32z'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: left center, right center, center !important;
	background-size: calc(50% - 28px) 1px, calc(50% - 28px) 1px, 26px 30px !important;
}

/*
 * Zeilen im Hero: erst unsichtbar, dann per block-animate-text.js eingeblendet.
 * visibility wechselt am Animationsstart, opacity läuft über die volle Dauer.
 */
@keyframes fadeIn {
	0% {
		opacity: 0;
		visibility: hidden;
	}

	1% {
		visibility: visible;
	}

	100% {
		opacity: 1;
		visibility: visible;
	}
}

@keyframes fadeInUp {
	0% {
		opacity: 0;
		visibility: hidden;
		transform: translate3d(0, 100%, 0);
	}

	1% {
		visibility: visible;
	}

	100% {
		opacity: 1;
		visibility: visible;
		transform: none;
	}
}

.block-animate-text > * {
	visibility: hidden;
}

@media (prefers-reduced-motion: reduce) {
	.block-animate-text > * {
		visibility: visible;
		animation: none;
	}
}