/* CSS Reset
   ========================================================================== */

*,
*::before,
*::after {
    box-sizing: inherit;
}

html {
    box-sizing: border-box;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
}

div[class*="wp-block-"] figcaption {
    color: var(--wp--preset--color--text-50);
    font-size: var(--wp--preset--font-size--x-small);
    margin-bottom: 0;
    margin-top: 20px;
}

img,
figure {
    max-width: 100%;
    height: auto;
}

/* HTML Elements Styling
   ========================================================================== */

select {
    border: 1px solid var(--wp--preset--color--text-50);
    border-radius: 5px;
    padding: 5px;
    color: var(--wp--preset--color--text-90);
    font-family: var(--wp--preset--font-family--body);
    background-color: transparent;

    & option {
        background-color: var(--wp--preset--color--primary);

        &:hover {
            background-color: var(--wp--preset--color--accent);
        }
    }
}

input {
    border: 1px solid var(--wp--preset--color--text-50);
    border-radius: 4px;
    background-color: transparent;
    color: var(--wp--preset--color--text-90);
    font-family: var(--wp--preset--font-family--body);
    font-size: var(--wp--preset--font-size--base);
}

/* Sections
   ========================================================================== */

:where(.wp-site-blocks)>footer,
:where(.wp-site-blocks)>main {
    margin-block-start: 0;
}

@media (prefers-reduced-motion: no-preference) {
    html {
        scroll-behavior: smooth;
    }
}

/* Text
   ========================================================================== */

:where(h1, h2, h3, h4, h5, h6) {
    text-wrap: balance;
}

:where(h5, h6, blockquote, caption, figcaption, p) {
    text-wrap: pretty;
}

/* Mobile / Desktop Hide
   ========================================================================== */

@media screen and (max-width: 599px) {
    .symcooblocs-mobile-hide {
        display: none !important;
    }
}

@media screen and (max-width: 781px) {
    .symcooblocs-tablet-hide {
        display: none !important;
    }
}

@media screen and (min-width: 600px) {
    .symcooblocs-desktop-hide {
        display: none !important;
    }
}

/* Link underline animation
   ========================================================================== */

/* Normal links, line disappears on hover */

a:where(:not(.wp-element-button)) {
    text-decoration: none;
}

:where(p:not(.wp-block-site-title))>:where(a, em>a, strong>a) {
    background: linear-gradient(0deg, currentColor, currentColor) no-repeat right bottom / 100% var(--bg-h);
    transition: background-size 300ms, color 300ms;
    --bg-h: round(0.07em, 1px);

    &:where(:hover, :focus-visible) {
        background-size: 0 var(--bg-h);
        background-position-x: right;
    }
}

/* Clean links, line appears on hover */

.wp-block-post-title :where(a) {
	display: inline;
}

:where(h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    footer p)>:where(a, em>a, strong>a),
:where(.wp-block-categories-list,
    .wp-block-file,
    .wp-block-footnotes,
    .wp-block-query-pagination,
    .wp-block-post-author,
    .wp-block-post-author-name,
    .wp-block-post-date,
    .wp-block-post-navigation-link,
    .wp-block-post-terms,
    .wp-block-post-title,
    .woocommerce-breadcrumb,
    .yoast-breadcrumbs) a:not(.wp-element-button),
ul.wp-block-navigation:not(.wp-block-navigation-submenu):not(.smbt-header-menu) .wp-block-navigation-item__content,
.wp-block-read-more,
.wp-block-tag-cloud a.tag-cloud-link {
    background: linear-gradient(0deg, currentColor, currentColor) no-repeat right bottom / 0 var(--bg-h);
    transition: background-size 300ms, color 300ms;
    --bg-h: round(0.07em, 1px);

    &:where(:hover, :focus-visible) {
        background-size: 100% var(--bg-h);
        background-position-x: left;
    }
}

ul.wp-block-navigation:not(.wp-block-navigation-submenu):not(.smbt-header-menu) .current-menu-item>.wp-block-navigation-item__content {
    background-size: 100% var(--bg-h);
    background-position-x: left;
}

/* Global block styles
   ========================================================================== */

.is-style-scale-hover {
    transition: scale 0.15s;
    &:hover:not([data-wp-bind--class="state.currentImage.figureClassNames"]) {
        scale: 1.0075;
    }
}

.is-style-scale-hover-2 {
    transition: scale 0.15s;
    &:hover:not([data-wp-bind--class="state.currentImage.figureClassNames"]) {
        scale: 1.02;
    }
}

.is-style-scale-hover-3 {
    transition: scale 0.15s;
    &:hover:not([data-wp-bind--class="state.currentImage.figureClassNames"]) {
        scale: 1.05;
    }
}

@keyframes --timeline-appear {
    0%, 25% {
        transform: translateY(60px);
        opacity: 0.2;
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

.is-style-scroll-appear {
    animation: --timeline-appear ease-out forwards;
    animation-timeline: view();
    animation-range-start: cover 0%;
    animation-range-end: cover 35%;
}

/* WooCommerce
   ========================================================================== */



/* Yoast
   ========================================================================== */

