html {
    scroll-behavior: smooth;
    transition: all 0.3s ease-in-out;
}

/* Snap full height sections to window top */
html, .scroll-container {
    scroll-snap-type: y proximity;
}

section:not(:first-child):not(:last-child), .snap-align {
    scroll-snap-align: start;
}

/* Subtle fade-in animation on page load */

.wp-site-blocks {
       -webkit-animation: fade-in 1.6s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.2s both;
	   animation: fade-in 1.6s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0.2s both;
    }
    
 @-webkit-keyframes fade-in {
        0% {
        opacity: 0;
        }
        100% {
        opacity: 1;
        }
    }
    @keyframes fade-in {
        0% {
        opacity: 0;
        }
        100% {
        opacity: 1;
        }
    }

/* Native input styles upon interaction */
input:focus, input:active, input:focus-visible {
    border-color: var(--wp--preset--color--tertiary)!important;
    outline: unset!important;
}

.is-grid-align-items-center {
    display: grid!important;
    align-items: center!important;
}

/* Custom text block with rounded square border */
.celine-special-text-block {
    max-width: 326px;
    min-height: 326px;
}


/* Custom list style with peri arch marker */
ul {
    list-style-image: url('../images/shapes/peri_arch_darker.svg'); 
    list-style-type:none;
}

ul li {
    padding-inline-start: var(--wp--preset--spacing--20);
}

ul li::marker {
    font-size: var(--wp--preset--font-size--medium-large);
}

/* Flex List style */

@media (min-width: 48rem) {
    ul.is-list-flex {
        padding-inline-start: 0;
        display: flex;
        gap: var(--wp--preset--spacing--30);
    }
    ul.is-list-flex li {
        padding-inline-end: var(--wp--preset--spacing--10);
    }
}

/* Override wp border style for blockquote */
.wp-block-quote {
    border-left: 0 none;
}

/* Padding for nav ul */
.wp-block-navigation ul {
    padding: var(--wp--preset--spacing--20);
}

/* Links and buttons styles upon user interaction */

.wp-block-navigation a:active, .wp-block-navigation a:hover, .wp-block-navigation a:focus, .wp-block-navigation .current-menu-item>a {
    text-decoration-line: underline;
    text-decoration-thickness: 3px;
    text-decoration-color: var(--wp--preset--color--tertiary);
}

.wp-block-navigation .wp-block-navigation-link.wp-element-button a {
    border: unset;
    padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--30-40)!important;
}

.wp-block-button.button-on-dark-background .wp-block-button__link {
    color: var(--wp--preset--color--base)!important;
    border-color: var(--wp--preset--color--base)!important;
}

.wp-block-button.button-on-dark-background .wp-block-button__link:hover, .wp-block-button.button-on-dark-background .wp-block-button__link:active, .wp-block-button.button-on-dark-background .wp-block-button__link:focus {
    color: var(--wp--preset--color--dark)!important;
    border-color: var(--wp--preset--color--dark)!important;
}


/* Custom social links have hidden tertiary background color and no underline */
p.custom-social-link>a {
    text-decoration: none!important;
    background: linear-gradient(var(--wp--preset--color--tertiary), var(--wp--preset--color--tertiary))!important;
    background-repeat: no-repeat!important;
    background-size: 100% 0!important;
    background-position: bottom!important;
    transition: background-size 0.3s ease-out!important;
}

/* Custom social links show background color on hover */
p.custom-social-link>a:hover, p.custom-social-link>a:active {
    background-size: 100% 50%!important;
}

/* Buttons have slight scale reduction on active*/
.wp-block-button__link:active, .wp-element-button:active {
    transform: scale(0.98);
}

/* Decorative shapes */
.shape-square, .shape-rounded-square {
    width: var(--wp--preset--spacing--80)!important;
}

.shape-arch {
    width: var(--wp--preset--spacing--90)!important;
}

.has-small-rounded-square-after::after {
    content:url('../images/shapes/yellow_rounded-square.svg');
    display: inline-block;
    width: 16px;
    height: auto;
}

.has-anchored-shape {
    position: relative;
    top: 0;
}

.anchored-shape-arch-top-left::before {
    content: url('../images/shapes/peri_arch.svg');
    display: block;
    width: var(--wp--preset--spacing--90);
    position: absolute;
    top: -10px;
    left: -50px;
}

.anchored-shape-arch-top-right::after {
    content: url('../images/shapes/peri_arch.svg');
    display: block;
    width: var(--wp--preset--spacing--90);
    position: absolute;
    top: -10px;
    right: -50px;
}

.anchored-shape-rounded-square-bottom-right::after {
    content: url('../images/shapes/yellow_rounded-square.svg');
    display: block;
    width: var(--wp--preset--spacing--80);
    position: absolute;
    bottom: -45px;
    right: -45px;
}

figure.anchored-shape-rounded-square-bottom-left::before {
    content: url('../images/shapes/yellow_rounded-square.svg');
    display: block;
    width: var(--wp--preset--spacing--80);
    position: absolute;
    bottom: -45px;
    left: -45px;
}

.has-rectangle-background {
    background: linear-gradient(var(--wp--preset--color--primary), var(--wp--preset--color--primary));
    background-size: 100% 50%;
    background-repeat: no-repeat;
    background-position: bottom;
}

/* Widget Polylang */
header ul.pll-switcher {
    display: flex;
    gap: var(--wp--preset--spacing--20);
    list-style-image: none!important;
    list-style-type: none!important;
    padding-inline-start: 0;
    padding-bottom: 0!important;
}

header ul.pll-switcher li.lang-item {
    padding-inline-start: 0;
}

header ul.pll-switcher li.lang-item a {
    color: var(--wp--preset--color--dark);
    text-transform: uppercase;
    text-decoration: none;
}

header ul.pll-switcher li.lang-item a:hover, header ul.pll-switcher li.lang-item a:active {
    color: var(--wp--preset--color--dark);
    text-decoration-line: underline;
    text-decoration-thickness: 3px;
    text-decoration-color: var(--wp--preset--color--tertiary);
    background: transparent!important;
}

@media (max-width:48rem) {
    .is-mobile-reverse {
        display: flex;
        flex-direction: column-reverse;
        gap: var(--wp--preset--spacing--30);
    }
}