/*
Theme Name: Neue SA
Author: Simon Schuetz
Text Domain: neue-sa
Requires at least: 6.4
Requires PHP: 7.4
Version: 4.8.2025
*/

/* Reset
---------------------------------------------------------------------------- */

*,::after,::before{box-sizing:border-box}html{-moz-text-size-adjust:100%;-webkit-text-size-adjust:100%;text-size-adjust:100%}ol,ul{list-style:none;padding:0}:focus-visible{outline:2px solid currentcolor;outline-offset:2px}canvas,img,picture,video{display:block;max-width:100%;object-fit:cover;object-position:center center}button{cursor:pointer}button,input,select,textarea{font:inherit;color:inherit;border:0;padding:0;background:0 0;outline:2px solid transparent;outline-offset:2px;}h1,h2,h3,h4,h5,h6,p{text-wrap:pretty}

/* Base
---------------------------------------------------------------------------- */

:root {
	--safe-area-max-inset-bottom: env(safe-area-max-inset-bottom, 0px);
	--safe-area-inset-bottom: env(safe-area-inset-bottom,0px);
}
html {
	scroll-behavior: smooth;
}

@media screen and (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

body {
	-moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
	letter-spacing: -0.01em;
	overscroll-behavior: none;
}

/* Link & Focus Styles */
a {
	text-underline-offset: .25em;
	text-decoration-thickness: clamp(1px, 0.07em, 3px) !important;
	transition: all 200ms;
}
*:focus,
*:active {
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

/* Layout
---------------------------------------------------------------------------- */

body .wp-site-blocks {
	overflow-x: clip;
}
body.home .wp-site-blocks,
body.page-template-page-portfolio .wp-site-blocks {
	padding-top: 0;
}
body .wp-site-blocks > * {
	margin-block-start: 0;
}
body:not(.page-template-page-portfolio) .wp-site-blocks > footer {
	margin-block-start: var(--wp--preset--spacing--80);
}
/* Hides Breadcrumbs on First Level Pages */
body:not(.page-child,.archive,.single) .wp-site-blocks > footer > .wp-block-group:first-child {
	display: none;
}

/* Site Header */
.site-header {
	position: fixed;
	top: var(--wp-admin--admin-bar--height,0px);
	width: 100%;
	z-index: 99;
}
.site-header .wp-block-image {
	width: 60vw;
	max-width: 12rem;
}
/* Background Gradient */
/* .site-header::before,
/* .site-header::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 150%;
	pointer-events: none;
	user-select: none;
	z-index: -1;
	opacity: 0;
	transition: opacity 300ms linear;
}
.site-header::before {
	background: var(--wp--preset--gradient--to-bottom-light);
}
.site-header::after {
	background: var(--wp--preset--gradient--to-bottom-dark);
}
html.is-scrolling-down .site-header::before {
	opacity: 1; /* Shows Light Gradient */
/* }
html.is-dark-active .site-header::after,
html:not(.is-scrolling-down) body.home .site-header::after,
html.is-scrolling-down body.page-template-page-portfolio .site-header::after {
	opacity: 0.8; 
}
html.is-dark-active .site-header::before,
html body.page-template-page-portfolio .site-header::after {
	opacity: 0;
} */

/* Text Colors */
/* html.is-dark-active .site-header,
html:not(.is-scrolling-down) body.home .site-header, 
html:not(.is-scrolling-down) body.page-template-page-portfolio .site-header {
	color: var(--wp--preset--color--white); 
}
.site-header a:hover {
	color: var(--wp--preset--color--primary);
}
.site-header a:focus {
	color: currentcolor;
} */

/* Home */
/* .site-header .wp-block-tiptip-hyperlink-group-block {
	position: relative;
	z-index: 100001;
} */


/* Modules
---------------------------------------------------------------------------- */

/* Hyperlink Group */
.wp-block-tiptip-hyperlink-group-block .wp-block-cover {
    margin: 0;
    overflow: clip;
    -webkit-clip-path: inset(0 0 0 0 round var(--wp--custom--radius--small));
    clip-path: inset(0 0 0 0 round var(--wp--custom--radius--small));
    transition: 320ms;
}
.wp-block-tiptip-hyperlink-group-block:hover .wp-block-cover {
    -webkit-clip-path: inset(var(--wp--preset--spacing--4) var(--wp--preset--spacing--4) var(--wp--preset--spacing--4) var(--wp--preset--spacing--4) round var(--wp--custom--radius--small));
    clip-path: inset(var(--wp--preset--spacing--4) var(--wp--preset--spacing--4) var(--wp--preset--spacing--4) var(--wp--preset--spacing--4) round var(--wp--custom--radius--small));
}
.wp-block-tiptip-hyperlink-group-block .wp-block-cover img {
    transform: scale(1);
    transition: transform 320ms;
}
.wp-block-tiptip-hyperlink-group-block:hover .wp-block-cover img {
    transform: scale(1.05);
}
.wp-block-tiptip-hyperlink-group-block .wp-block-cover .wp-block-heading {
	font-weight: 600;
}


/* Icon Marquee */

.wp-block-neue-blocks-icon-marquee {
    user-select: none;
    overflow: hidden
	margin-right: calc(var(--wp--style--root--padding-right) * -1) !important;
    margin-left: calc(var(--wp--style--root--padding-left) * -1) !important;
}

.wp-block-neue-blocks-icon-marquee__track {
	display: flex;
	align-items: center;

}

.wp-block-neue-blocks-icon-marquee__track-items {
    padding-left: var(--wp--style--block-gap);
    gap: var(--wp--style--block-gap);
    animation-name: icon-marquee-move-left;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-play-state: running;
    animation-duration: 40s;
}

.wp-block-neue-blocks-icon-marquee.is-direction-right .wp-block-neue-blocks-icon-marquee__track {
    justify-content: flex-end
}

.wp-block-neue-blocks-icon-marquee.is-direction-right .wp-block-neue-blocks-icon-marquee__track-items {
    animation-name: icon-marquee-move-right;
    padding-left: 0;
    padding-right: var(--wp--style--block-gap);
}

.wp-block-neue-blocks-icon-marquee,
.wp-block-neue-blocks-icon-marquee__track-items,
.wp-block-neue-blocks-icon-marquee__track-item {
    white-space: nowrap
}

.wp-block-neue-blocks-icon-marquee__track-item {
	width: 160px;
	height: 160px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--preset--spacing--8);
	padding: var(--wp--style--block-gap);
}
.wp-block-neue-blocks-icon-marquee__track-item figure {
	height: fit-content;
}
.wp-block-neue-blocks-icon-marquee__track-item img {
	filter: grayscale(1);
}

@keyframes icon-marquee-move-left {
    from {
        transform: translateX(0)
    }

    to {
        transform: translateX(-100%)
    }
}

@keyframes icon-marquee-move-right {
    from {
        transform: translateX(0)
    }

    to {
        transform: translateX(100%)
    }
}


/* Utilities
---------------------------------------------------------------------------- */

/* Nav Buttons */
.wp-element-nav-button {
	border: 0;
	background: 0 0;
	padding: 0;
}
.wp-element-nav-button:active,
.wp-element-nav-button:focus-visible {
	outline: 0;
}
.wp-element-nav-button > *,
.wp-block-navigation__responsive-container-open svg,
.wp-block-navigation__responsive-container-close svg{
	z-index: 2;
	position: relative;
}
.wp-element-nav-button::after,
.wp-block-navigation__responsive-container-open::after,
.wp-block-navigation__responsive-container-close::after {
    content: "";
    display: block;
    position: absolute;
	z-index: 1;
    top: 50%;
    height: 38px;
    width: 38px;
    left: 50%;
    transform: translate(-50%, -50%);
	border-radius: 50%;
	color: var(--wp--preset--color--contrast);
	background-color: var(--wp--preset--color--border);
	opacity: 0;
	transition: opacity 200ms linear;
}
.wp-element-nav-button svg,
.wp-block-navigation__responsive-container-close svg {
	color: var(--wp--preset--color--contrast);
	transition: color 200ms linear;
}
.wp-element-nav-button:active svg,
.wp-block-navigation__responsive-container-open:active svg,
.wp-block-navigation__responsive-container-close:active svg {
	color: var(--wp--preset--color--contrast);
}
.wp-element-nav-button:active::after,
.wp-block-navigation__responsive-container-open:active::after,
.wp-block-navigation__responsive-container-close:active::after {
	opacity: 1;
}
@media (any-hover: hover) {
	.wp-element-nav-button:hover svg,
	.wp-block-navigation__responsive-container-open:hover svg,
	.wp-block-navigation__responsive-container-close:hover svg {
		color: var(--wp--preset--color--contrast);
	}
	.wp-element-nav-button:hover::after,
	.wp-block-navigation__responsive-container-open:hover::after,
	.wp-block-navigation__responsive-container-close:hover::after {
		opacity: 1;
	}
}

/* Admin Bar */
@media screen and (max-width: 600px) {
    .admin-bar #wpadminbar {
        position: fixed;
    }
}