/*
Theme Name: Calminate
Theme URI: https://calminate.nl
Author: Withblocks
Author URI: https://withblocks.com
Description: Block theme for Calminate.
Version: 0.1.4
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: calminate
Tags: block-theme, full-site-editing
*/

*, ::before, ::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

/* WP global injects `a:where(...) { color: var(--wp--preset--color--ink) }` unlayered,
   which beats every Tailwind text-color utility (uno wraps them in @layer utilities,
   and unlayered author always wins layered author). Roll back to the layered author
   so text-[#xxxx] on <a> can apply, and add a base-layer fallback that makes plain
   anchors inherit from their parent. */
@layer base {
    a {
        color: inherit;
    }
}

a:where(:not(.wp-element-button)) {
    color: revert-layer;
}

/* Font family utility classes — used instead of inline font-family. */
.font-dm {
    font-family: 'DM Sans', sans-serif;
}

.font-inter-tight {
    font-family: 'Inter Tight', sans-serif;
}

.font-inter-serif {
    font-family: 'Inter', serif;
}

/* Fallback utilities Uno's Tailwind preset doesn't parse from arbitrary values. */
.blur-\[140px\] {
    filter: blur(140px);
}

.blur-\[230px\] {
    filter: blur(230px);
}

.shadow-\[0_0_9\.625px_\#9adf463d\] {
    box-shadow: 0 0 9.625px #9adf463d;
}

.shadow-\[0_8px_40px_rgba\(0\,0\,0\,0\.45\)\,inset_0_1px_0_rgba\(255\,255\,255\,0\.07\)\] {
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

body > .wp-site-blocks > header.wp-block-template-part {
    --header-top-start: 90px;
    --header-top-end: 16px;
    --header-pin-range: 74px;
    position: fixed;
    top: var(--header-top-start);
    left: 0;
    right: 0;
    z-index: 50;
    pointer-events: none;
    transition: top 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

@media (min-width: 640px) {
    body > .wp-site-blocks > header.wp-block-template-part {
        --header-top-start: 70px;
        --header-pin-range: 54px;
    }
}

body > .wp-site-blocks > header.wp-block-template-part > * {
    pointer-events: auto;
}

/* Pin to top once scrolled past threshold. JS toggles `.is-pinned`; modern
   browsers also handle this via scroll-driven animation below. */
body > .wp-site-blocks > header.wp-block-template-part.is-pinned {
    top: var(--header-top-end);
}

@supports (animation-timeline: scroll()) {
    body > .wp-site-blocks > header.wp-block-template-part {
        animation: uno-header-pin linear both;
        animation-timeline: scroll(root);
        animation-range: 0 var(--header-pin-range);
        transition: none;
    }

    @keyframes uno-header-pin {
        from {
            top: var(--header-top-start);
        }
        to {
            top: var(--header-top-end);
        }
    }
}