/**
 * Theme main CSS.
 *
 * @since S 1.0.0
 */



/* ===== Buttons ===== */

.site .wp-block-button .wp-element-button,
.site .wp-block-button .wp-block-button__link {
	display: flex;
	align-items: center;
	gap: .4em;
}


.standout-button {
	display: inline-block;
	line-height: 1;
}

.standout-button a {
	display: inline-block;
}


.site form button[type="submit"],
.standout-button a,
.wp-block-button .wp-element-button,
.wp-block-button .wp-block-button__link,
form input[type="button"],
form input[type="reset"],
form input[type="submit"],
.gform_wrapper .gform_footer input[type=submit],
body .editor-styles-wrapper .wp-element-button,
body .editor-styles-wrapper .wp-block-button__link,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button,
.wc-block-mini-cart__footer-actions .wc-block-components-button:not(.is-link).wp-block-woocommerce-mini-cart-checkout-button-block,
.wc-block-mini-cart__footer-actions .wc-block-components-button:not(.is-link).wp-block-woocommerce-mini-cart-cart-button-block,
#page .woocommerce button.button.alt,
.woocommerce #page button.button.alt,
.standout-product-count-sorting-wrap .bapf_button.bapf_reset,
.wp-block-post-content .wc-block-components-button:not(.is-link) {
    padding: 0.5em 1em;
    color: var(--color-text-white);
    background-color: var(--color-1);
    border-radius: 0;
    box-shadow: none;
    border: 1px solid var(--color-1);
	text-decoration: none;
    font-family: var(--btn-fam);
	font-weight: 400;
	text-align: center;
    transition: background-color, border, color;
    transition-duration: var(--transition-duration);
    cursor: pointer;
}

.site form button[type="submit"]:hover,
.standout-button a:hover,
.wp-block-button .wp-element-button:hover,
.wp-block-button .wp-block-button__link:hover,
form input[type="button"]:hover,
form input[type="reset"]:hover,
form input[type="submit"]:hover,
.gform_wrapper .gform_footer input[type=submit]:hover,
body .editor-styles-wrapper .wp-element-button:hover,
body .editor-styles-wrapper .wp-block-button__link:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button:hover,
.wc-block-mini-cart__footer-actions .wc-block-components-button:not(.is-link).wp-block-woocommerce-mini-cart-checkout-button-block:hover,
#page .woocommerce button.button.alt:hover,
.woocommerce #page button.button.alt:hover,
.standout-product-count-sorting-wrap .bapf_button.bapf_reset:hover,
.wc-block-components-button:not(.is-link):hover {
	color: var(--color-text-white);
	background-color: var(--color-1-hover);
	border-color: var(--color-1-hover);
}


.btn-secondary a,
.standout-button.btn-secondary a,
.standout-button .btn-secondary a,
.wp-block-button.is-style-standout-secondary a,
.standout-product-count-sorting-wrap .bapf_button.bapf_reset,
.wp-block-button.is-style-standout-secondary .wp-element-button,
.wp-block-button.is-style-standout-secondary .wp-block-button__link {
	color: var(--color-text);
    background-color: var(--color-light-grey);
    border-color: var(--color-grey-border);
}

.btn-secondary a:hover,
.standout-button.btn-secondary a:hover,
.standout-button .btn-secondary a:hover,
.wp-block-button.is-style-standout-secondary a:hover,
.standout-product-count-sorting-wrap .bapf_button.bapf_reset:hover,
.wp-block-button.is-style-standout-secondary .wp-element-button:hover,
.wp-block-button.is-style-standout-secondary .wp-block-button__link:hover {
	color: var(--color-text);
	background-color: var(--color-light-grey-hover);
	border-color: var(--color-light-grey-hover);
}


.btn-border a,
.wp-block-button.is-style-standout-border a,
.standout-button.btn-border a,
.standout-button .btn-border a,
body .wc-block-components-button:not(.is-link).outlined,
body .wc-block-components-button:not(.is-link).outlined:not(:focus),
.wp-block-button.is-style-standout-border .wp-element-button,
.wp-block-button.is-style-standout-border .wp-block-button__link {
	color: var(--color-1);
	background-color: transparent;
	border: 1px solid currentColor;
	box-shadow: none;
}

.btn-border a:hover,
.wp-block-button.is-style-standout-border a:hover,
.standout-button.btn-border a:hover,
.standout-button .btn-border a:hover,
body .wc-block-components-button:not(.is-link).outlined:hover,
body .wc-block-components-button:not(.is-link).outlined:not(:focus):hover,
body .wc-block-components-button:not(.is-link).outlined:focus,
.wp-block-button.is-style-standout-border .wp-element-button:hover,
.wp-block-button.is-style-standout-border .wp-block-button__link:hover {
	color: var(--color-text-white);
	background-color: var(--color-1);
	border-color: var(--color-1);
	box-shadow: none;
}


.btn-small a,
.standout-button.btn-small a,
.standout-button .btn-small a {
	padding: .4em .8em;
}


.btn-white a,
.wp-block-button.btn-white a,
.standout-button.btn-white a,
.standout-button .btn-white a,
.wp-block-button.btn-white .wp-element-button,
.wp-block-button.btn-white .wp-block-button__link {
	color: var(--color-text-white);
	border-color: currentColor;
}

.btn-white a:hover,
.wp-block-button.btn-white a:hover,
.standout-button.btn-white a:hover,
.standout-button .btn-white a:hover,
.wp-block-button.btn-white .wp-element-button:hover
.wp-block-button.btn-white .wp-block-button__link:hover {
	color: var(--color-dark);
	border-color: var(--color-text-white);
	background-color: var(--color-text-white);
}


.wp-block-button__link img[src*=".svg"] {
	filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(186deg) brightness(103%) contrast(103%);
	transition: filter var(--transition-duration);
}


.wp-block-buttons {
	gap: var(--gap-s);
}

/* ===== END Buttons ===== */



/* ===== General ===== */

body {
	background-color: var(--color-bg);
}


html,
body,
input,
button,
.standout-button a,
select,
optgroup,
textarea {
    line-height: var(--line-height);
    text-decoration: none;
}

html,
body,
input,
select,
optgroup,
textarea {
    font-family: var(--p-fam);
    font-size: var(--p);
    color: var(--color-text);
}

button,
.standout-button a,
input[type="button"] {
    font-family: var(--btn-fam);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    line-height: calc(.85 * var(--line-height));
}

h1:not(:last-child),
h2:not(:last-child),
h3:not(:last-child),
h4:not(:last-child),
h5:not(:last-child),
h6:not(:last-child) {
    margin-bottom: var(--h-gap);
}

h1,
h2,
h3,
h4,
h5,
h6,
.widget-title {
    color: var(--color-dark);
	font-family: var(--h-fam);
    font-weight: var(--h-weight);
}

*[style*="color:"] h1,
*[style*="color:"] h2,
*[style*="color:"] h3,
*[style*="color:"] h4,
*[style*="color:"] h5,
*[style*="color:"] h6,
*[style*="color:"] .widget-title,
*.has-text-color h1,
*.has-text-color h2,
*.has-text-color h3,
*.has-text-color h4,
*.has-text-color h5,
*.has-text-color h6,
*.has-text-color .widget-title {
	color: inherit;
}

h1.has-background,
h2.has-background,
h3.has-background,
h4.has-background,
h5.has-background,
h6.has-background {
	padding: 0;
}


h1 {
	font-size: var(--h1);
}

h2 {
	font-size: var(--h2);
}

h3 {
	font-size: var(--h3);
}

h4 {
	font-size: var(--h4);
}

h5 {
	font-size: var(--h5);
}

h6 {
	font-size: var(--h6);
}

/* :root p { */
p {
	margin: 0 0 var(--p-gap);
	/* font-size: var(--p); */
}

p.has-text-align-center {
	margin-inline: auto;
}

#page p,
.editor-styles-wrapper p {
	max-width: var(--content-width);
}

.wp-block-post-content p.is-style-align-wide,
#page .wp-block-post-content p.is-style-align-wide,
.editor-styles-wrapper .block-editor-block-list__layout.is-root-container .wp-block-paragraph.is-style-align-wide {
	max-width: var(--content-wide-width);
}

.wp-block-post-content p.is-style-align-full,
#page .wp-block-post-content p.is-style-align-full,
.editor-styles-wrapper .block-editor-block-list__layout.is-root-container .wp-block-paragraph.is-style-align-full {
	max-width: var(--content-max-size);
	margin-left: auto;
	margin-right: auto;
}

.wp-block-post-content p.has-text-align-center,
.wp-block-post-content p[style*="text-align: center"],
.wp-block-post-content p[style*="text-align:center"],
.editor-styles-wrapper .block-editor-block-list__layout.is-root-container .wp-block-paragraph.has-text-align-center,
.editor-styles-wrapper .block-editor-block-list__layout.is-root-container .wp-block-paragraph[style*="text-align: center"],
.editor-styles-wrapper .block-editor-block-list__layout.is-root-container .wp-block-paragraph[style*="text-align:center"] {
	margin-inline: auto;
}

p:last-child,
p:has(+ p:last-child:empty) {
    margin-bottom: 0;
}

p:empty {
	display: none;
}


figure:last-child {
	margin-bottom: 0;
}


.standout-custom-svg {
	display: inline-block;
	line-height: 0;
	vertical-align: middle;
}

.standout-custom-svg svg,
.standout-custom-svg svg * {
	fill: currentColor;
}


.standout-max-container {
	max-width: var(--content-max-size);
	margin-left: auto;
	margin-right: auto;
}


img {
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 100%;
}


video {
	max-width: 100%;
	height: auto;
}


a {
    color: currentColor;
}

a:focus {
    outline: thin dotted;
}

a:hover,
a:active {
    outline: 0;
}


table {
	border-spacing: 0;
}


#main-content:not(:has(> .wp-block-post-content:first-child)) {
	padding-top: var(--gap-m);
}


.standout-block:not(.standout-media-text).has-bg-color,
.standout-block:not(.standout-media-text).has-color-bg-color {
	padding: var(--gap-m) var(--content-margin);
}


.standout-block:not(.is-aligned) {
	max-width: var(--wp--style--global--content-size);
	margin-left: auto;
	margin-right: auto;
}


.standout-section:not(.has-bg):not(.standout-section .standout-section) {
	padding-inline: var(--content-margin);
}


.block-editor-block-list__layout.is-root-container > .alignwide[data-type*="standout/"],
.wp-block-post-content > .standout-block.alignwide,
.standout-block.alignwide {
	max-width: 100%;
}

.standout-block.alignwide > * > * > .acf-innerblocks-container {
	width: 100%;
	max-width: var(--content-wide-width);
	margin-right: auto;
	margin-left: auto;
}

/* ===== END General ===== */



/* ===== Header ===== */

#masthead {
    color: var(--color-dark);
}

#masthead .header-outer {
	padding-inline: var(--gap-m);
}

#masthead .header-wrapper {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--gap-s);
}


/*
 * Top bar
 */

.top-bar > * > * > .acf-innerblocks-container {
	display: flex;
	align-items: center;
	gap: 20px;
}


/*
 * Logo
 */

header .site-branding {
	min-width: 50px;
	padding: 20px 0;
}

header #logo {
	max-width: 100%;
	max-height: calc(1px * var(--logo-height));
	aspect-ratio: var(--logo-width) / var(--logo-height);
	line-height: 0;
}

.custom-logo-link {
	display: inline-block;
}

.custom-logo-link svg,
.custom-logo-link img {
	width: 100%;
	height: 100%;
}


/*
 * Scroll
 */

#masthead {
	transition: box-shadow var(--transition-duration), background-color var(--transition-duration), transform calc(2 * var(--transition-duration));
	box-shadow: 0px -6px 12px 5px rgba(0, 0, 0, 0);
}

body.scrolled:not([data-header-position="static"]) #masthead {
	box-shadow: 0px -6px 12px 5px rgba(0, 0, 0, .3);
}

body.scrolled[data-header-position="fixed"] #masthead {
	background-color: var(--color-header-bg);
}


header #logo {
	transition: var(--transition);
	transition-property: max-height;
}

body.scrolled header #logo {
	max-height: calc((var(--logo-height) * .7) * 1px);
}


body.hide-header[data-header-scroll-hide="1"]:not([data-header-position="static"]) #masthead {
	transform: translateY(calc(-100% - 25px));
}

/* ===== END Header ===== */



/* ===== Menus ===== */

/*
 * #Primary menu
 */

#primary-menu {
	display: none;
}


/*
 * Top bar
 */

.top-bar {
	display: none;
}


/*
 * Shortcode menu
 */

.standout-menu-container .standout-inline-menu {
	position: relative;
	display: flex;
	align-items: center;
}


/*
 * Mobile menu
 */

.standout-mobile-menu-toggle {
	height: auto;
	padding: .2em;
	font-size: 32px;
	line-height: 0;
	color: currentColor;
	border: none;
	background-color: transparent;
	cursor: pointer;
}

.standout-mobile-menu-toggle .standout-custom-svg svg {
	width: 1em;
}


header .standout-mobile-menu-content {
	position: fixed;
	top: 100%;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: transparent;
	transition: background-color calc(2 * var(--transition-duration)), top 0s calc(2 * var(--transition-duration));
	overflow: hidden;
	z-index: 100;
}

.admin-bar header .standout-mobile-menu-content {
	padding-top: var(--wp-admin--admin-bar--height, 0px);
}

header .standout-mobile-menu-content.active {
	top: 0;
	background-color: rgba(0, 0, 0, .6);
	transition: background-color calc(2 * var(--transition-duration)), top 0s 0s;
}


header .standout-mobile-menu-content .mobile-menu-content-inner {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 450px;
    height: 100%;
    margin-left: auto;
    padding: 30px 0 0;
    background-color: #fff;
    overflow: hidden;
    transform: translateX(calc(100% + 20px));
    transition: transform var(--transition-duration);
}

header .standout-mobile-menu-content.active .mobile-menu-content-inner {
    transform: translateX(0);
}


header .standout-mobile-menu-content .mobile-menu-close {
	position: absolute;
	top: 0;
	right: 0;
	padding: 10px;
	font-size: 28px;
	line-height: 0;
	transition: background-color, color;
	transition-duration: var(--transition-duration);
	cursor: pointer;
}
header .standout-mobile-menu-content .mobile-menu-close:hover {
	background-color: var(--color-1);
	color: var(--color-text-white);
}

header .standout-mobile-menu-content .mobile-menu-close svg {
	width: 1em;
}


header .standout-mobile-menu-content .standout-theme-logo {
	max-height: 100px;
	margin-bottom: 30px;
	padding: 0 80px;
}


header .standout-mobile-menu-content .standout-mobile-menu-container {
	flex-grow: 1;
	position: relative;
}


header .standout-mobile-menu-container ul li a {
	padding: 12px 20px;
	border-top: 1px solid var(--color-grey-border);
	transition: background-color, color, border-color;
	transition-duration: var(--transition-duration);
}
header .standout-mobile-menu-container ul li:last-child > a {
	border-bottom: 1px solid var(--color-grey-border);
}
header .standout-mobile-menu-container ul li.sub-menu-active > a,
header .standout-mobile-menu-container ul li.current-menu-ancestor > a,
header .standout-mobile-menu-container ul li.current-menu-parent > a {
	background-color: var(--color-light-grey);
	border-color: var(--color-light-grey);
}
header .standout-mobile-menu-container ul li:hover > a {
	background-color: var(--color-light-grey-hover);
	border-color: var(--color-light-grey-hover);
}
header .standout-mobile-menu-container ul li.current-menu-item > a {
	background-color: var(--color-1);
	color: var(--color-text-white);
	border-color: var(--color-1);
}

header .standout-mobile-menu-container ul li a .menu-item-text {
	display: flex;
	justify-content: space-between;
}

header .standout-mobile-menu-container ul li a .menu-item-children-icon {
	transform: rotateZ(-90deg);
}


header .standout-mobile-menu-container ul li a .menu-item-type-up-one-level-text {
	display: flex;
	align-items: center;
	gap: 1em;
}

header .standout-mobile-menu-content ul ul {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: #fff;
	transition: transform var(--transition-duration);
	transform: translateX(calc(100% + 20px));
	z-index: 10;
}

header .standout-mobile-menu-content li.sub-menu-active > ul {
	transform: translateX(0);
}



/*
 * Main menu
 */

.standout-menu-container ul,
.widget_nav_menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.standout-menu-container ul li a,
.widget_nav_menu ul li a {
	display: block;
	padding: 12px 16px;
	text-decoration: none;
	color: currentColor;
}

.standout-menu-container ul li a .menu-item-hidden-buffer,
.widget_nav_menu ul li a .menu-item-hidden-buffer {
    display: block;
    height: 0;
    overflow: hidden;
    visibility: hidden;
}

.standout-menu-container ul li a .menu-item-text,
.widget_nav_menu ul li a .menu-item-text {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .3em;
}

.standout-menu-container ul li a .menu-item-hidden-buffer,
.widget_nav_menu ul li a .menu-item-hidden-buffer {
	display: flex;
}

/* ===== END Menus ===== */



.standout-theme-logo {
	font-size: 0;
}



/* ===== Block generel ===== */

:where(body .is-layout-constrained) > .standout-block,
.is-layout-constrained > .standout-block,
:root :where(.is-layout-constrained:not(:first-child)) > .standout-block:first-child,
:root :where(.is-layout-constrained) > .standout-block:first-child:not(.has-bg) {
	margin-block-start: var(--standout-block-gap, var(--gap-default, 0));
}

:where(body .is-layout-constrained) > .standout-section .standout-section:not(:first-child) {
	margin-block-start: var(--gap-m);
}

:where(body .is-layout-constrained) > .standout-section .standout-section:not(:last-child) {
	margin-block-end: var(--gap-m);
}

:root :where(.is-layout-constrained) > .standout-block:not(.has-bg):last-child {
	margin-bottom: var(--gap-default, 0);
}

:root :where(.is-layout-constrained) > .standout-block:first-child {
	margin-block-start: 0;
}


:root :where(.is-layout-flow) > *:not(:first-child):not(p) {
	margin-block-start: var(--gap-s);
}


.standout-block {
	background-color: var(--block-background-color, transparent);
	color: var(--block-text-color, var(--color-text));
}

/* ===== END Block generel ===== */



/* ===== WP Gallery Block Images ===== */

.wp-block-gallery.has-nested-images figure.wp-block-image img {
	cursor: pointer;
}

/* ===== END WP Gallery Block Images ===== */
