@layer General {

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

    p {
        text-wrap: pretty;
    }

    p:not(:last-of-type) {
        margin-block-end: 1em;
    }

    :where(ul[class], ol[class]) {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    body {
        font-family: var(--font-body);
        font-weight: 400;
        color: light-dark(var(--clr-text-light), var(--clr-text-dark));
        background-color: light-dark(var(--clr-body-light), var(--clr-body-dark));
        letter-spacing: 0.15px;
        line-height: 1.5;
    }


    .Paper-root {
        background-color: light-dark(var(--clr-paper-light), var(--clr-paper-dark));
        border-radius: 0.5rem;
        padding: 0.75rem;
    }

    .Paper-elevation {
        background-image: var(--paper-overlay);
        box-shadow: var(--elevation);
    }

    .Paper-elevation-1 {
        background-image: var(--paper-overlay-1);
        box-shadow: var(--elevation-1);
    }

    .Paper-elevation-2 {
        background-image: var(--paper-overlay-2);
        box-shadow: var(--elevation-2);
    }

    .Paper-elevation-3 {
        background-image: var(--paper-overlay-3);
        box-shadow: var(--elevation-3);
    }

    .Paper-elevation-4 {
        background-image: var(--paper-overlay-4);
        box-shadow: var(--elevation-4);
    }

    .Paper-elevation-5 {
        background-image: var(--paper-overlay-5);
        box-shadow: var(--elevation-5);
    }

    .Paper-elevation-6 {
        background-image: var(--paper-overlay-6);
        box-shadow: var(--elevation-6);
    }

    .Paper-elevation-7 {
        background-image: var(--paper-overlay-7);
        box-shadow: var(--elevation-7);
    }

    .Paper-elevation-8 {
        background-image: var(--paper-overlay-8);
        box-shadow: var(--elevation-8);
    }

    :is(h1, h2, h3, h4, h5, h6) {
        font-family: var(--font-title);
        line-height: 1.25;
        font-weight: 400;
        /* color: light-dark(var(--clr-heading-light), var(--clr-heading-dark)); */
    }

    a:any-link.Link-root {
        color: inherit;
        text-decoration: none;
        background: linear-gradient(to right, var(--clr-link) 50%, currentColor 50%) no-repeat center bottom / 200% 1px;
        background-position-x: 100%;
        transition: background-position-x 400ms cubic-bezier(0.175, 0.82, 0.165, 1);
    }

    a[class*="Mui"] {
        background-image: unset !important;
    }

    a:any-link.Link-root {
        color: var(--clr-link);
    }

    a:any-link.Link-root:is(:focus, :hover) {
        color: var(--clr-link-hover);
    }

    a:any-link:is(:focus, :hover) {
        text-decoration: none;
        background-position-x: 0%;
    }

    a:is(.Button-root, .elementor-button) {
        background-image: unset;
    }

    img {
        max-width: 100%;
        height: auto;
        vertical-align: middle;
        font-style: italic;
        font-weight: 300;
        background-repeat: no-repeat;
        background-size: cover;
        shape-margin: 1rem;
        user-select: none;
    }
}

@layer Presets {

    input[type='number']::-webkit-inner-spin-button,
    input[type='number']::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    input[type='number'] {
        appearance: none;
        -moz-appearance: textfield;
    }

    :is(a, button, [tabindex="0"], .form-control):is(:focus-visible) {
        outline: auto !important;
        outline: -webkit-focus-ring-color auto 1px !important;
    }

    @-moz-document url-prefix() {
        :is(a, button, [tabindex="0"], .form-control):is(:focus-visible) {
            outline: 2px solid #000 !important;
            box-shadow: 0 0 0 4px #fff !important;
            outline-offset: 1px
        }
    }
}

@layer Utils {
    .t-c {
        text-align: center;
    }

    .t-r {
        text-align: right;
    }

    .t-l {
        text-align: left;
    }
}

@layer Block {
    .Block-root {
        padding-block: var(--block-spacing);
    }

    .Block-root.Block-gray {
        background-color: var(--clr-gray-200) !important;
    }

    .Block-root.Block-primary {
        background-color: var(--clr-primary-main) !important;
        color: var(--clr-primary-light);
    }

    .Block-root.Block-secondary {
        background-color: var(--clr-secondary-light) !important;
        color: var(--clr-secondary-text);
    }

    .Heading-root {
        font-family: var(--font-title);
    }

    .Heading-root:not(:only-child, :last-child):not([aria-level="2"]) {
        margin-block-end: 2rem;
    }

    .Heading-root:not(:only-child, :last-child)[aria-level="2"] {
        margin-block-end: 0.5rem;
    }

    .Heading-root~.Heading-root {
        margin-block-start: 1.5rem;
    }

    .Heading-root [aria-level] {
        display: block;
        letter-spacing: 0;
        line-height: 1.25;
        color: var(--clr-primary-text);
    }

    .Heading-root [aria-level="1"] {
        font-size: var(--fz-1);
        text-wrap: balance;
    }

    .Heading-root [aria-level="2"] {
        font-size: var(--fz-2);
    }

    .Heading-root [aria-level="3"] {
        font-size: var(--fz-3);
    }

    .Heading-root [aria-level="4"] {
        font-size: var(--fz-4);
        font-family: var(--font-script);
        text-transform: uppercase;
        color: var(--clr-primary-main);
    }

    .Heading-root [aria-level="4"]::before {
        content: "";
        display: inline-block;
        width: 0.725em;
        aspect-ratio: 1;
        margin-right: 0.5em;
        background-color: var(--clr-primary-main);
    }

    @keyframes Gradient {
        to {
            background-position-x: 400%;
        }
    }

    .Heading-root> :not(:last-child) {
        margin-bottom: 0.25em;
    }

    .Heading-root:not(:last-child) {
        margin-bottom: 2rem;
    }

    .Heading-root> :not(p, span) b {
        font-weight: 700;
    }

    .Heading-root.t-c>span {
        justify-content: center;
    }

    .Heading-root .Heading-desc {
        margin-top: 1.5rem;
        font-size: 1.275rem;
        font-family: var(--font-body);
        font-weight: 400;
    }

    .Heading-root.t-c>span {
        justify-content: center;
    }

    .Block-root.BlockNote-root :where(.Note-wrapper, .Note-content) {
        max-width: 60ch;
        margin-inline: auto;
        text-align: center;
        text-wrap-style: pretty;
    }

    /* Parallax */
    .Block-root.BlockParallax-root {
        position: relative;
        isolation: isolate;
        clip-path: inset(0);
        overflow: hidden;
    }

    .Block-root.BlockParallax-root .Parallax-object>* {
        inset: 0;
        z-index: -2;
        width: 100%;
        height: calc(100vh + 50px);
        height: calc(100dvh + 50px);
        object-fit: cover;
        object-position: center;
    }

    .Block-root.BlockParallax-root:not(.Block-fluid) .Parallax-object>* {
        position: fixed;
    }

    /* Static */
    .Block-root.Block-static .Block-object>* {
        border-radius: 1rem;
        width: 100%;
        object-fit: cover;
    }

    .Block-root.Block-root .Block-row~.Block-row {
        margin-block-start: 3rem;
    }

    .Block-object picture img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    @media (min-width: 992px) {

        /* Static */
        .Block-static.Block-static {
            --_gap: 5rem;
        }

        .Block-root.Block-static.Block-offset-y {
            margin-top: 100px;
        }

        .Block-root.Block-static.Block-offset-y .Block-object>* {
            translate: 0 -100px;
        }

        .Block-static.Block-static:not(.Block-offset-y) .Block-object>* {
            aspect-ratio: 1 / 0.725;
            min-height: 100%;
        }

        .Block-static.Block-static flex-root::part(root) {
            --gap: var(--_gap) !important;
            column-gap: var(--_gap) !important;
        }

        .Block-static.Block-static:not(.Block-offset-y) flex-item:not(.Block-object)::part(root) {
            align-self: center;
        }


        /* Fluid */
        .Block-root.Block-fluid.Block-offset-y {
            margin-top: 100px;
        }

        .Block-root.Block-fluid {
            --_gap: 5rem;
            position: relative;
            isolation: isolate;
        }

        .Block-root.Block-fluid .Block-row {
            gap: 1.5rem var(--_gap);
        }

        .Block-root.Block-fluid:not(.BlockParallax-root) .Block-object>* {
            position: absolute;
            inset: 0;
            z-index: -2;
            width: 50%;
            height: 100%;
            object-fit: cover;
        }

        .Block-root.Block-fluid.Block-offset-y .Block-object {
            aspect-ratio: 1;
        }

        .Block-root.Block-fluid.Block-offset-y .Block-object>* {
            translate: 0 -100px;
        }

        .Block-root.Block-fluid.Block-fluid-100 {
            min-height: 100vh;
            min-height: 100dvh;
            align-content: center;
        }

        .Block-root.Block-fluid.Block-fluid-100 .Block-object>* {
            width: 100%;
        }

        .Block-root.Block-fluid .Block-object:last-child>* {
            margin-left: auto;
        }

        /* Parallax */
        .Block-root.BlockParallax-root.Block-fluid .Block-object>* {
            width: 50%;
            position: fixed;
        }
    }

    @media (max-width: 991.98px) {
        .Block-row {
            row-gap: 1.5rem;
        }

        .Block-root.Block-fluid .Block-row>:not(.Block-object) {
            order: 2;
        }

        .Block-root.Block-fluid .Block-object:last-child {
            order: 1;
        }

        .Block-root.Block-fluid .Block-object>* {
            border-radius: 1rem;
            aspect-ratio: 16 / 10;
            height: auto;
            width: 100%;
        }
    }
}

@layer Scroller {
    [data-scroll="lenis"] {
        height: 100vh;
        overflow: auto;
    }
}