/*
Theme Name: Words Lite FNS
Template: the-words
Author: Michael Walter
Description: Child-Theme von Word Lite
Version: 1.0.0
Updated: 2024-10-08 11:00:00

*/

/* FONTS */
/* arsenal-regular - latin */
@font-face {
	font-display: swap;
	font-family: 'Arsenal-Regular';
	font-style: normal;
	font-weight: 400;
	src: url('/wp-content/themes/words-lite-fns/assets/fonts/arsenal-v12-latin/arsenal-v12-latin-regular.woff2') format('woff2');
}

/* arsenal-italic - latin */
@font-face {
	font-display: swap;
	font-family: 'Arsenal-Italic';
	font-style: italic;
	font-weight: 400;
	src: url('/wp-content/themes/words-lite-fns/assets/fonts/arsenal-v12-latin/arsenal-v12-latin-italic.woff2') format('woff2');
}

/* arsenal-700 - latin */
@font-face {
	font-display: swap;
	font-family: 'Arsenal-700';
	font-style: normal;
	font-weight: 700;
	src: url('/wp-content/themes/words-lite-fns/assets/fonts/arsenal-v12-latin/arsenal-v12-latin-700.woff2') format('woff2');
}

/* arsenal-700italic - latin */
@font-face {
	font-display: swap;
	font-family: 'Arsenal-Italic-700';
	font-style: italic;
	font-weight: 700;
	src: url('/wp-content/themes/words-lite-fns/assets/fonts/arsenal-v12-latin/arsenal-v12-latin-700italic.woff2') format('woff2');
}

:root {
	--black: #000000;
	--blue: #1375bc;
	--gray: #292b33;
	--green: #76b82a;
	--sand: #d9a943;
}

body {
	color: var(--black);
	font-family: 'Arsenal-Regular', sans-serif;
	font-size: 1.2rem;
}

.h3 {
	font-size: 1.17em;
}

a, a:visited {
	color: var(--blue);
}

/* CUSTOM LAYOUT CLASSES */

@media (max-width: 781px) {
	.mobile-display-none {
		display: none;
		height: 0 !important;
	}
}

.margin-top-none {
	margin-top: 0;
}

.margin-bottom-none {
	margin-bottom: 0;
}

.padding-bottom-none {
	padding-bottom: 0;
}

.box-shadow {
	box-shadow: 0 3px 5px #787878a6;
}

.widget-area .widget.widget_media_image {
	padding: 20px 20px;
	-webkit-box-shadow: 0 0 0 1px #ededed;
	box-shadow: 0 0 0 1px #ededed;
	background-color: #FFFFFF;
	margin-bottom: 50px;
	border-radius: 10px;
}

.widget-area .widget figure {
	margin: 0;
}

.widget-area .widget figure figcaption {
	margin-bottom: 0;
}

.flex-item-column-align-center {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.list-style {
	list-style-type: disc;
	padding-left: 32px;
}

.site-branding {
	width: 100%;
}

.site-branding .custom-logo {
	width: 150px;
	transition: all 0.3s ease 0s;
	margin: 15px 0 0 15px;
}

:where(.wp-block-column.has-background),
:where(.wp-block-group.has-background),
:where(.wp-block-latest-posts.has-background) {
	padding: 1.25em 2.375em !important;
}

.project-successfully-completed {
	position: relative;
}

.project-successfully-completed:after {
	content: 'erfolgreich abgeschlossen';
	display: block;
	position: absolute;
	top: 0;
	right: 25px;
	color: #ffffff;
	text-align: center;
	font-size: 16px;
	padding-top: 9px;
	background-color: var(--green);
	--c: 80px;
	height: 120px;
	aspect-ratio: 3 / 2;
	mask: radial-gradient(80% var(--c) at bottom, #0000 calc(100% - 2px), #000);
}

@media (min-width: 1025px) {
	.site-branding .custom-logo {
		width: 250px;
	}
}

.wp-block-image a img {
	transition: all 0.3s ease 0s;
}

.site-branding .custom-logo:focus,
.site-branding .custom-logo:hover,
.wp-block-image a img:focus,
.wp-block-image a img:hover {
	transform: scale(0.95);
	transition: all 0.4s ease 0s;
}

.site-footer .loop-posts-blog-recent {
	border-bottom: none;
}

.ta-top-notice-bar {
	justify-content: center;
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	padding: 7px 0;
}

span.ta-bar-sticker {
	background-color: #5ca595;
	margin-right: 15px;
	font-size: 15px;
	color: #fff;
	border-radius: 4px;
	padding: 2px 5px;
}

.ta-top-notice-bar h2 {
	margin: 0 15px 0 0;
	font-size: 17px;
	font-weight: 400;
	color: #535353;
}

.ta-top-notice-bar a {
	text-decoration: underline;
}

.ta-top-notice-bar-main {
	position: relative;
	z-index: 999;
	box-shadow: 0 1px 1px 0 #efefef;
}

.toggle-notice-bar {
	display: none;
}

@media (min-width: 768px) {
	.toggle-notice-bar {
		display: block;
	}
}

button.menu-toggle-close span {
	background-color: var(--blue);
}

.toggle-notice-bar button {
	border: none;
	background-repeat: no-repeat;
}

.toggle-notice-bar button:hover {
	cursor: pointer;
}

span.toggle-notice-bar-close svg {
	color: #000;
}

span.toggle-notice-bar-open svg {
	width: 25px;
	background-color: #fff;
	text-align: center;
	color: #000;
}

.ta-notice-button-active span.toggle-notice-bar-close {
	display: block;
}

.toggle-notice-bar {
	right: 100px;
	position: absolute;
	top: 50%;
	transform: translateY(-18px);
}

.toggle-notice-bar.ta-notice-button-active button {
	padding: 18px 3px 12px 10px;
}

.site-header.ta-header-1 a.ta-search-toggle {
	color: #494949;
}

.site-header.ta-header-1 .ta-header-search-main a {
	color: #000;
}

.title-banner-post a:hover, .title-recent-post a:hover {
	color: #afafaf;
}

/* HEADER */
.site-header.ta-header-2 {
	position: relative;
}

.site-header.ta-header-2 .header-2-mid {
	padding: 0;
}

.site-header.ta-header-2 .ta-header-main {
	padding: 16px 0;
	background-color: var(--blue);
}

@media (min-width: 1025px) {
	.site-header.ta-header-2 .ta-header-main {
		padding: 0;
	}
}

.site-header.ta-header-2 .site-branding {
	position: absolute;
	z-index: 100;
	top: 0;
	transform: translate(-50%, 0);
	text-align: left;
}

@media (min-width: 1025px) {
}

.site-header.ta-header-2 .header-image {
	position: relative;
	z-index: -100;
	height: 265px;
	background-image: url("/wp-content/uploads/2024/09/fns-bambinis.jpg");
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
	background-position: -310px -130px;
	transition: all 0.3s ease 0s;
}

@media (max-width: 320px) {
	.site-header.ta-header-2 .header-image {

	}
}

@media (min-width: 768px) {
	.site-header.ta-header-2 .header-image {
		background-position-x: center;
	}
}

@media (min-width: 1025px) {
	.site-header.ta-header-2 .header-image {
		background-position-y: -10vw;
		height: 400px;
	}
}


/* NAVIGATION */
.site-header.ta-header-2 .main-navigation {
	border: none;
}

.site-header.ta-header-2 .main-navigation ul ul a {
	color: var(--blue);
}

.site-header.ta-header-2 .main-navigation a {
	color: var(--blue);
	font-family: 'Arsenal-700', sans-serif;
}

.site-header.ta-header-2 .main-navigation button.menu-toggle span {
	background-color: #ffffff;
	height: 3px;
}

.main-navigation.toggled a.nav-focus-menu-last,
.main-navigation.toggled a.nav-focus-menu-close {
	display: none;
}

.main-navigation li {
	padding: 20px 0;
}

.main-navigation a {
	position: relative;
}

.main-navigation a::after {
	content: '';
	position: absolute;
	bottom: -3px;
	left: 0;
	right: 0;
	z-index: 1;
	width: 100%;
	height: 3px;
	background-color: var(--blue);
	transform: scale(0);
	transition: transform 0.3s ease-out;
}

.main-navigation a:focus::after,
.main-navigation a:hover::after,
.main-navigation .current-menu-item a::after {
	transform: scaleX(1);
}

li.trail-item:after {
	top: 8px;
}

button.child-menu-toggle {
	color: var(--blue);
}

button.child-menu-toggle svg {
	font-size: 18px;
}

.ta-footer-menu #footer-menu {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.ta-footer-menu #footer-menu li {
	display: inherit;
	padding-right: 0;
	margin-bottom: 10px;
}

.ta-footer-menu #footer-menu a:focus,
.ta-footer-menu #footer-menu a:hover {
	color: #ffffff;
	text-decoration: underline;
}

@media (min-width: 1001px) {
	.ta-footer-menu #footer-menu {
		margin-left: 2.7rem;
		flex-direction: row;
		justify-content: center;
	}

	.ta-footer-menu #footer-menu li {
		margin-bottom: 0;
	}

	.ta-footer-menu #footer-menu li#menu-item-347 {
		margin-left: 3rem;
		margin-right: 3rem;
	}
}

@media (min-width: 1025px) {
	.site-header.ta-header-2 .main-navigation a {
		color: #ffffff;
	}

	.main-navigation ul {
		display: flex;
		justify-content: space-evenly;
		box-shadow: none;
	}

	.main-navigation a::after {
		background-color: #ffffff;
	}

	button.child-menu-toggle {
		right: -35px;
		top: 48%;
		color: #ffffff;
	}

	.main-navigation.toggled ul {
		box-shadow: 5px 0 10px 0 #494949;
	}

	.site-header.ta-header-2 .main-navigation ul ul {
		background: var(--blue);
	}

	.main-navigation ul.sub-menu {
		display: block;
		box-shadow: 1px 5px 5px rgba(0, 0, 0, 0.5);
	}

	.site-header.ta-header-2 .main-navigation ul ul a {
		color: #ffffff;
		min-width: 290px;
	}

	.main-navigation #primary-menu #menu-item-699, /* LINK KONTAKT */
	.main-navigation #primary-menu #menu-item-700, /* LINK IMPRESSUM */
	.main-navigation #primary-menu #menu-item-701 /* LINK DATENSCHUTZ */
	{
		display: none;
	}
}

/* ELEMENTS */
.home h1.entry-title,
.page-id-28 h1.entry-title {
	margin-bottom: 0;
}

h1.entry-title {
	position: relative;
	margin-bottom: 50px;
	hyphens: auto;
}

h1.entry-title::after {
	position: absolute;
	bottom: -5px;
	left: 0;
	width: 100%;
	height: 2px;
	background-image: linear-gradient(to right, var(--gray), transparent, transparent);
	content: '';
}

#secondary {
	position: sticky;
	top: 2rem;
}

#secondary h2.wp-block-heading,
#secondary h2.wp-block-heading a {
	position: relative;
	color: var(--green);
}

#secondary h2.wp-block-heading a:focus,
#secondary h2.wp-block-heading a:hover {
	color: var(--blue);
}

#secondary h2.wp-block-heading::after {
	position: absolute;
	bottom: -5px;
	left: 0;
	width: 100%;
	height: 2px;
	background-image: linear-gradient(to right, var(--green), transparent);
	content: '';
}

.wp-block-button__link {
	transition: background-color 200ms ease-in-out;
}

.wp-block-button__link:focus,
.wp-block-button__link:hover {
	background-color: var(--blue) !important;
}

div.wpforms-container-full button[type=submit]:not(:hover):not(:active) {
	background-color: #555555;
}

.wp-block-separator {
	position: relative;
	height: 2px;
	margin: 4rem 0;
	border: none;
	background-color: transparent;
}

.wp-block-separator::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 2px;
	background-image: linear-gradient(to right, transparent, var(--sand), transparent);
	content: '';
}

.wp-block-separator::after {
	position: absolute;
	top: -7px;
	left: calc(50% - 7px);
	z-index: 1;
	width: 14px;
	height: 14px;
	border: 1px solid var(--sand);
	background-color: var(--sand);
	border-radius: 7px 0 7px 0;
	content: '';
}

.widget-area li {
	border-bottom: none;
}

.wp-block-latest-posts__post-date::before,
.wp-block-post-date::before {
	display: inline-block;
	margin-right: 5px;
	content: 'veröffentlicht am';
}

.wp-block-post-date {
	text-align: right;
}

.post .entry-content-wrap {
	box-shadow: 0 3px 5px #787878a6;
}

.wp-block-latest-posts__post-title {
	font-weight: 600;
	color: var(--blue);
}

.wp-block-latest-posts__read-more {
	font-style: italic;
	color: var(--blue);
}

.theiaStickySidebar {
	position: static !important;
	transform: none !important;
}

.ta-single-nav .ta-prev-post,
.ta-single-nav .ta-next-post {
	width: 100%;
}

.ta-single-nav .ta-prev-post a,
.ta-single-nav .ta-next-post a {
	color: var(--black) !important;
}
