/*
Theme Name:   Kraken Framework Child
Theme URI:    https://www.splashmg.ca
Description:  Kraken Framework is a foundational theme designed to help create WordPress websites with a strong focus on speed, efficiency, and optimization.
Author:       Splash Media Group Inc.
Author URI:   https://www.splashmg.ca
Template:     kraken-framework
Version:      3.11.0
License URI: https://www.gnu.org/licenses/gpl-3.0.en.html
Copyright: (c) Splash Media Group
Tags: blog,accessibility-ready,custom-menu,featured-images,footer-widgets,theme-options,translation-ready
Text Domain: kraken-framework
*/

:root {
    /* -- Header -- */
    --kf-header-max-width: 100%;
    --kf-header-padding: 0;
    --kf-header-inner-max-width: 100%;
    --kf-header-inner-padding: 0;
    --kf-header-row-max-width: 100%;

    /* -- Main -- */
    --kf-main-inner-padding-top: var(--kf-page-padding-top);
    --kf-main-inner-padding-bottom: var(--kf-page-padding-bottom);
    --kf-main-inner-padding-left: var(--kf-global-padding-left);
    --kf-main-inner-padding-right: var(--kf-global-padding-right);
    --kf-entry-header-max-width: var(--kf-max-width);
    --kf-entry-content-max-width: var(--kf-max-width);
    --kf-entry-footer-max-width: var(--kf-max-width);

    /* -- Footer -- */
    --kf-footer-max-width: 100%;
    --kf-footer-padding: 0;
    --kf-footer-inner-max-width: 100%;
    --kf-footer-inner-padding: 0;
    --kf-footer-row-max-width: 100%;
    --kf-footer-row-top-gap-mobile: 3rem;
    --kf-footer-row-main-gap-mobile: 3rem;
    --kf-footer-row-bottom-gap-mobile: 3rem;
    --kf-footer-row-base-gap-mobile: 3rem;

    /* -- Card -- */
    --kf-post-padding: 1.5rem;
    --kf-post-border-radius: 0.5rem;

    /* - Post Image - */
    --kf-post-image-border-radius: 0.3rem;
    --kf-post-image-margin: 0 0 1.5rem 0;
    --kf-post-image-padding: 0;

    /* - Excerpt - */
    --kf-post-excerpt-margin: 0 0 1rem 0;
    --kf-post-excerpt-padding: 0;

    /* - Tags - */
    --kf-tag-label-font-size: 0.8rem;
    --kf-tag-label-font-weight: 700;
    --kf-tag-padding: 0.2rem 0.5rem;

    /* - Categories - */
    --kf-categories-padding: 0.2rem 0.5rem;
    --kf-categories-border: 1px solid var(--kf-border);
    --kf-categories-border-radius: 0.5rem;
    --kf-categories-font-size: 0.7rem;
    --kf-categories-line-height: 1.1;

    /* - Single Image - */
    --kf-single-post-image-aspect-ratio: 900 / 506;
    --kf-single-post-image-margin: 1.5rem 0 1.5rem 0;
    --kf-single-post-image-padding: 0;
    --kf-single-post-image-border-radius: 0.3rem;

    /* Post Navigation */
    --kf-post-navigation-padding: 0.3rem 0.9rem;
    --kf-post-navigation-border-radius: 0.3rem;

    /* Address */
    --kf-address-padding: 0.3rem 0;

    /* Phone */
    --kf-phone-padding: 0;

    /* Email */
    --kf-email-padding: 0;

    /* Splash Credit */
    --kf-splash-credit-font-size: 0.8rem;
}

.kf-navigation--mobile {
    /* Navigation */
    --kf-navigation-display: flex;
    --kf-navigation-flex-direction: column;
    --kf-navigation-flex-gap: 1rem;
    --kf-navigation-flex-justify: flex-start;
    --kf-navigation-link-align: flex-start;
    --kf-navigation-link-padding: 0.5rem 0.5rem;
    --kf-navigation-link-margin: 0;

    /* Sub Navigation */
    --kf-navigation-subnav-flex-direction: column;
    --kf-navigation-subnav-flex-justify: flex-start;
    --kf-navigation-subnav-link-align: flex-start;
    --kf-navigation-subnav-flex-gap: 1rem;
    --kf-navigation-subnav-position: relative;
    --kf-navigation-subnav-top: unset;
    --kf-navigation-subnav-left: unset;
    --kf-navigation-subnav-subnav-top: unset;
    --kf-navigation-subnav-subnav-left: unset;
    --kf-navigation-subnav-width: 100%;
    --kf-navigation-subnav-margin: 1rem 0 0 0;
    --kf-navigation-subnav-link-padding: 0.3rem 0.5rem;
    --kf-navigation-subnav-link-margin: 0;
    --kf-navigation-caret: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m8 10l4 4l4-4'/%3E%3C/svg%3E");
    --kf-navigation-caret-width: 25px;
    --kf-navigation-caret-height: 25px;
    --kf-navigation-caret-margin: auto;
}

.kf-navigation--hamburger {
    /* Navigation */
    --kf-navigation-display: flex;
    --kf-navigation-flex-direction: column;
    --kf-navigation-flex-gap: 1rem;
    --kf-navigation-flex-justify: flex-start;
    --kf-navigation-link-align: flex-start;
    --kf-navigation-link-padding: 0.5rem 0.5rem;
    --kf-navigation-link-margin: 0;

    /* Sub Navigation */
    --kf-navigation-subnav-flex-direction: column;
    --kf-navigation-subnav-flex-justify: flex-start;
    --kf-navigation-subnav-link-align: flex-start;
    --kf-navigation-subnav-flex-gap: 1rem;
    --kf-navigation-subnav-position: relative;
    --kf-navigation-subnav-top: unset;
    --kf-navigation-subnav-left: unset;
    --kf-navigation-subnav-subnav-top: unset;
    --kf-navigation-subnav-subnav-left: unset;
    --kf-navigation-subnav-width: 100%;
    --kf-navigation-subnav-margin: 1rem 0 0 0;
    --kf-navigation-subnav-link-padding: 0.3rem 0.5rem;
    --kf-navigation-subnav-link-margin: 0;
    --kf-navigation-caret: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m8 10l4 4l4-4'/%3E%3C/svg%3E");
    --kf-navigation-caret-width: 25px;
    --kf-navigation-caret-height: 25px;
    --kf-navigation-caret-margin: auto;
}

.kf-navigation--primary {
    /* Navigation */
    --kf-navigation-display: flex;
    --kf-navigation-flex-direction: row;
    --kf-navigation-flex-gap: 1rem;
    --kf-navigation-flex-justify: flex-start;
    --kf-navigation-link-align: center;
    --kf-navigation-link-padding: 0.5rem 0.5rem;
    --kf-navigation-link-margin: 0;

    /* Sub Navigation */
    --kf-navigation-subnav-flex-direction: column;
    --kf-navigation-subnav-flex-justify: flex-start;
    --kf-navigation-subnav-link-align: flex-start;
    --kf-navigation-subnav-flex-gap: 0.5rem;
    --kf-navigation-subnav-position: absolute;
    --kf-navigation-subnav-top: 100%;
    --kf-navigation-subnav-left: 0;
    --kf-navigation-subnav-subnav-top: 0;
    --kf-navigation-subnav-subnav-left: 100%;
    --kf-navigation-subnav-width: 200px;
    --kf-navigation-subnav-margin: 0;
    --kf-navigation-subnav-link-padding: 0.3rem 0.5rem;
    --kf-navigation-subnav-link-margin: 0;
    --kf-navigation-caret: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m8 10l4 4l4-4'/%3E%3C/svg%3E");
    --kf-navigation-caret-width: 16px;
    --kf-navigation-caret-height: 16px;
    --kf-navigation-caret-margin: auto;
}

.kf-navigation--secondary {
    /* Navigation */
    --kf-navigation-display: flex;
    --kf-navigation-flex-direction: row;
    --kf-navigation-flex-gap: 1rem;
    --kf-navigation-flex-justify: flex-start;
    --kf-navigation-link-align: center;
    --kf-navigation-link-padding: 0.5rem 0.5rem;
    --kf-navigation-link-margin: 0;

    /* Sub Navigation */
    --kf-navigation-subnav-flex-direction: column;
    --kf-navigation-subnav-flex-justify: flex-start;
    --kf-navigation-subnav-link-align: flex-start;
    --kf-navigation-subnav-flex-gap: 0.5rem;
    --kf-navigation-subnav-position: absolute;
    --kf-navigation-subnav-top: 100%;
    --kf-navigation-subnav-left: 0;
    --kf-navigation-subnav-subnav-top: 0;
    --kf-navigation-subnav-subnav-left: 100%;
    --kf-navigation-subnav-width: 200px;
    --kf-navigation-subnav-margin: 0;
    --kf-navigation-subnav-link-padding: 0.3rem 0.5rem;
    --kf-navigation-subnav-link-margin: 0;
    --kf-navigation-caret: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m8 10l4 4l4-4'/%3E%3C/svg%3E");
    --kf-navigation-caret-width: 16px;
    --kf-navigation-caret-height: 16px;
    --kf-navigation-caret-margin: auto;
}

.kf-navigation--footer {
    /* Navigation */
    --kf-navigation-display: flex;
    --kf-navigation-flex-direction: column;
    --kf-navigation-flex-gap: 0.5rem;
    --kf-navigation-flex-justify: center;
    --kf-navigation-link-align: center;
    --kf-navigation-link-padding: 0.3rem 0;
    --kf-navigation-link-margin: 0;

    /* Sub Navigation */
    --kf-navigation-subnav-flex-direction: column;
    --kf-navigation-subnav-flex-justify: flex-start;
    --kf-navigation-subnav-link-align: flex-start;
    --kf-navigation-subnav-flex-gap: 0.5rem;
    --kf-navigation-subnav-position: absolute;
    --kf-navigation-subnav-top: 100%;
    --kf-navigation-subnav-left: 0;
    --kf-navigation-subnav-subnav-top: 0;
    --kf-navigation-subnav-subnav-left: 100%;
    --kf-navigation-subnav-width: 200px;
    --kf-navigation-subnav-margin: 0;
    --kf-navigation-subnav-link-padding: 0.3rem 0.5rem;
    --kf-navigation-subnav-link-margin: 0;
    --kf-navigation-caret: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m8 10l4 4l4-4'/%3E%3C/svg%3E");
    --kf-navigation-caret-width: 16px;
    --kf-navigation-caret-height: 16px;
    --kf-navigation-caret-margin: auto;
}

.kf-navigation--legal {
    /* Navigation */
    --kf-navigation-display: flex;
    --kf-navigation-flex-direction: column;
    --kf-navigation-flex-gap: 0.5rem;
    --kf-navigation-flex-justify: center;
    --kf-navigation-link-align: center;
    --kf-navigation-link-padding: 0.3rem 0.5rem;
    --kf-navigation-link-margin: 0;

    /* Sub Navigation */
    --kf-navigation-subnav-flex-direction: column;
    --kf-navigation-subnav-flex-justify: flex-start;
    --kf-navigation-subnav-link-align: flex-start;
    --kf-navigation-subnav-flex-gap: 0.5rem;
    --kf-navigation-subnav-position: absolute;
    --kf-navigation-subnav-top: 100%;
    --kf-navigation-subnav-left: 0;
    --kf-navigation-subnav-subnav-top: 0;
    --kf-navigation-subnav-subnav-left: 100%;
    --kf-navigation-subnav-width: 200px;
    --kf-navigation-subnav-margin: 0;
    --kf-navigation-subnav-link-padding: 0.3rem 0.5rem;
    --kf-navigation-subnav-link-margin: 0;
    --kf-navigation-caret: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m8 10l4 4l4-4'/%3E%3C/svg%3E");
    --kf-navigation-caret-width: 16px;
    --kf-navigation-caret-height: 16px;
    --kf-navigation-caret-margin: auto;
}

.kf-header {
    /* Phone */
    --kf-phone-padding: 0 0.3rem 0 0;

    /* Email */
    --kf-email-padding: 0 0 0 0.3rem;
}

.kf-footer {
    /* Address */
    --kf-address-padding: 0.3rem 0;

    /* Phone */
    --kf-phone-padding: 0.3rem 0;

    /* Email */
    --kf-email-padding: 0.3rem 0;
}

@media (min-width: 992px) {
    :root {
        /* -- Footer -- */
        --kf-footer-row-top-gap-desktop: 0.5rem;
        --kf-footer-row-main-gap-desktop: 0.5rem;
        --kf-footer-row-bottom-gap-desktop: 0.5rem;
        --kf-footer-row-base-gap-desktop: 0.5rem;

        /* Splash Credit */
        --kf-splash-credit-font-size: 0.8rem;
    }

    .kf-navigation--footer {
        /* Navigation */
        --kf-navigation-flex-justify: flex-start;
        --kf-navigation-flex-gap: 0;
    }

    .kf-navigation--legal {
        /* Navigation */
        --kf-navigation-display: flex;
        --kf-navigation-flex-direction: row;
        --kf-navigation-flex-justify: flex-start;
        --kf-navigation-flex-gap: 1rem;
        --kf-navigation-link-padding: 0.5rem 0.5rem;
    }
}






/* ////////////////////////////////////////// */
/*                                            */
/*                  TYPOGRAPHY                */
/*                                            */
/* ////////////////////////////////////////// */

/* ===================================== */
/*        WP Font Preset Overrides       */
/* ===================================== */
:root {
    /* --font-size-small:;
    --font-size-medium:;
    --font-size-large:;
    --font-size-xlarge:; */

    /* --lh-small:;
    --lh-medium:;
    --lh-large:;
    --lh-xlarge:; */
}

/* Matches Gutenberg’s .has-small-font-size, etc., to Kraken scale variables. */
.has-small-font-size {
    font-size: var(--font-size-small);
    line-height: var(--lh-small);
}

.has-medium-font-size {
    font-size: var(--font-size-medium);
    line-height: var(--lh-medium);
}

.has-large-font-size {
    font-size: var(--font-size-large);
    line-height: var(--lh-large);
}

.has-xlarge-font-size {
    font-size: var(--font-size-xlarge);
    line-height: var(--lh-xlarge);
}



/* h2 + p, h3 + p, h4 + p, h5 + p, h6 + p {} */



/* ==================================== */
/*             Web Fonts             */
/* ==================================== */







/* ////////////////////////////////////////// */
/*                                            */
/*                    LAYOUT                  */
/*                                            */
/* ////////////////////////////////////////// */

/* ==================================== */
/*             Notification             */
/* ==================================== */

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

    /* ----------------------------------------------------------
    1) Top Row
    ---------------------------------------------------------- */

    /* ----------------------------------------------------------
    2) Main Row
    ---------------------------------------------------------- */
    .header-reservations-wrap {
        display: flex;
        align-items: center;
    }

    .header-reservations-title {
        font-family: 'RF Rufo', sans-serif;
        color: #fff;
        font-size: 1.4rem;
    }

    /* ----------------------------------------------------------
    3) Bottom Row
    ---------------------------------------------------------- */



/* ==================================== */
/*                 Main                 */
/* ==================================== */

/* ==================================== */
/*                Sidebar               */
/* ==================================== */

/* ==================================== */
/*                Footer                */
/* ==================================== */

    /* ----------------------------------------------------------
    1) Top Row
    ---------------------------------------------------------- */

    /* ----------------------------------------------------------
    2) Main Row
    ---------------------------------------------------------- */

    /* ----------------------------------------------------------
    3) Bottom Row
    ---------------------------------------------------------- */

    /* ----------------------------------------------------------
    4) Base Row
    ---------------------------------------------------------- */







/* ////////////////////////////////////////// */
/*                                            */
/*                  NAVIGATION                */
/*                                            */
/* ////////////////////////////////////////// */

/* ==================================== */
/*              Secondary               */
/* ==================================== */

/* ==================================== */
/*                Primary               */
/* ==================================== */






/* ////////////////////////////////////////// */
/*                                            */
/*              PAGE / POST SPECIFIC          */
/*                                            */
/* ////////////////////////////////////////// */

/* ==================================== */
/*               Homepage               */
/* ==================================== */

    /* --------------- */
    /*       Hero      */
    /* --------------- */
    .homepage-hero {
        position: relative;
        height: 100vh;
        max-height:400px;

        @media (min-width: 992px) {
            max-height:900px;
        }

        &::after {
            position: absolute;
            right:-1px;
            bottom:-1px;
            content: "";
            display: block;
            width: 15%;
            height: 100%;
            background-image: url("https://www.monkmanrv.ca/wp-content/uploads/2026/05/hero-right-curve.svg");
            background-repeat: no-repeat;
            background-position: right bottom;
            background-size: contain;
            z-index: 300;

        }

        .homepage-hero_image {
            position: absolute;
            top:0;
            right:0;
            bottom:0;
            left:0;
            max-width:100%!important;

            figure {
                max-width: 100%;
                height: 100%;

                &.image-overlay-wrap::after {
                    content: "";
                    position: absolute;
                    inset: 0;
                    background: linear-gradient(180deg, rgba(0,0,0,0.45) 0%, rgba(0,0,0,0.15) 100%);
                    pointer-events: none;
                }

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

        .homepage-hero_content {
            display: flex;
            justify-content: flex-start;
            align-items: center;
            position: relative;
            max-width: 1880px;
            height: 100%;
            z-index: 3;
            margin: 0 auto;
            padding: 3rem;

            .homepage-hero_content--message {
                display: inline-block;
                transform: translateY(-.5rem);
                font-size: clamp(2rem, 4.3636vw + 1.0182rem, 8rem);
                color: #fff;
                font-weight: 900;
                line-height: 1;

                span {
                    background-color: #282828;
                    padding: 0 10px 4px 10px;
                    color: #61a60d;
                }
            }
        }
    }

	.caption {
		padding-top: 38px;
		max-width: 1140px!important;

		h1 {
			font-size: clamp(2.5rem, 2.5455vw + 1.9273rem, 6rem);
            color:#fff;

			@include breakpoint(sm) {
				margin-bottom: 18px;
				font-size: 3rem;
			}

			@include breakpoint(md) {
				margin-bottom: 18px;
				font-size: 4rem;
			}

			@include breakpoint(lg) {
				margin-bottom: 18px;
				font-size: 5.5rem;
			}

			@include breakpoint(xl) {
				margin-bottom: 18px;
				font-size: 7rem;
			}

			.top {
				display: block;
				background-color: rgba(255,255,255, 0.4);
				padding: 0px 15px;
				width: 100%;

				@include breakpoint(md) {
					padding: 0px 30px;
				}
			}

			.bottom {
				display: block;
				background-color: #628e63;
				padding: 0px 15px;
				
				@include breakpoint(md) {
					padding: 0px 30px;
				}
			}
		}
		
	}


    /* --------------------- */
    /*       Photo Grid      */
    /* --------------------- */
    /* .photo-grid-container {
        display:grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(1, 1fr);
        grid-gap: 1rem;

        width: fit-content;
        transform: translateY(-15%);

        .photo-grid-pic {
            margin-block-start: auto;
            


            &.photo-grid-pic-01 {
                grid-column: 1 / 2;
                grid-row: 1 / 2;

                img {
                    width: 100%;
                    max-width: 400px;

                    transform: translateX(-300px);
                    opacity: 0;
                    animation: photo-grid-pic1-slide-in linear forwards;
                    animation-timeline: view();
                    animation-range: 250px 550px;

                    display: block;
                    border:15px solid #fff;
                    box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 10px;
                    rotate: 4deg;
                }

            }

            &.photo-grid-pic-02 {
                grid-column: 2 / 3;
                grid-row: 1 / 2;

                position: relative;
                top: 15%;
                left: -15%;

                img {
                    width: 100%;
                    max-width: 400px;

                    transform: translateX(100px);
                    opacity: 0;
                    animation: photo-grid-pic2-slide-in linear forwards;
                    animation-timeline: view();
                    animation-range: 150px 550px;

                    display: block;
                    border:15px solid #fff;
                    box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 10px;
                    rotate: -5deg;
                }

            }

        }
    }


    @keyframes photo-grid-pic1-slide-in {
        to { 
            transform: translateX(0px); 
            rotate: -4deg;
            opacity: 1; 
        }
    }

    @keyframes photo-grid-pic2-slide-in {
        to { 
            transform: translateY(0px); 
            rotate: 5deg;
            opacity: 1; }
    } */



















.photo-grid-container {
        display:grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(1, 1fr);
        grid-gap: 1rem;

        width: fit-content;
        transform: translateY(-15%);

        .photo-grid-pic {
            margin-block-start: auto;

            &.photo-grid-pic-01 {
                grid-column: 1 / 2;
                grid-row: 1 / 2;

                img {
                    width: 100%;
                    max-width: 400px;

                    display: block;
                    border:15px solid #fff;
                    box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 10px;
                    rotate: -4deg;
                }

            }

            &.photo-grid-pic-02 {
                grid-column: 2 / 3;
                grid-row: 1 / 2;

                position: relative;
                top: 15%;
                left: -15%;

                img {
                    width: 100%;
                    max-width: 400px;

                    display: block;
                    border:15px solid #fff;
                    box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 10px;
                    transform: translateY(15%);
                    rotate: 5deg;
                }

            }

        }
    }


/* =========================================================
   991px and Above Only
========================================================= */
@media (min-width: 991px) {

    .photo-grid-container {
        display:grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(1, 1fr);
        grid-gap: 1rem;

        width: fit-content;
        transform: translateY(-15%);

        .photo-grid-pic {
            margin-block-start: auto;

            &.photo-grid-pic-01 {
                grid-column: 1 / 2;
                grid-row: 1 / 2;

                img {
                    width: 100%;
                    max-width: 400px;

                    transform: translateX(-300px);
                    opacity: 0;

                    animation: photo-grid-pic1-slide-in linear forwards;
                    animation-timeline: view();
                    animation-range: 250px 550px;

                    display: block;
                    border:15px solid #fff;
                    box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 10px;
                    rotate: 4deg;
                }

            }

            &.photo-grid-pic-02 {
                grid-column: 2 / 3;
                grid-row: 1 / 2;

                position: relative;
                top: 15%;
                left: -15%;

                img {
                    width: 100%;
                    max-width: 400px;

                    transform: translateX(100px);
                    opacity: 0;

                    animation: photo-grid-pic2-slide-in linear forwards;
                    animation-timeline: view();
                    animation-range: 150px 550px;

                    display: block;
                    border:15px solid #fff;
                    box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 10px;
                    rotate: -5deg;
                }

            }

        }
    }

    @keyframes photo-grid-pic1-slide-in {
        to { 
            transform: translateX(0px); 
            rotate: -4deg;
            opacity: 1; 
        }
    }

    @keyframes photo-grid-pic2-slide-in {
        to { 
            transform: translateY(0px); 
            rotate: 5deg;
            opacity: 1;
        }
    }

}


































/* ////////////////////////////////////////// */
/*                                            */
/*             BLOCK CUSTOMIZATION            */
/*                                            */
/* ////////////////////////////////////////// */

    /* ========================================== */
    /*                Buttons Block               */
    /* ========================================== */
    /*
        Solid button with small radius, uppercase text,
        and fixed text color (no hover change)
    */
    .wp-block-button__link {
    /* Layout */
    display: inline-block;

    /* Typography */
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.1;
    text-transform: uppercase;
    color: #fff;

    /* Visual */
    background-color: #003d52;
    border-radius: 50px;
    border: none;

    /* Spacing (adjust if needed) */
    padding: 0.75em 1em;

    /* Smooth hover */
    transition: background-color 0.25s ease;
    }

    /* Hover / Focus */
    .wp-block-button__link:hover,
    .wp-block-button__link:focus {
    background-color: #282828;
    color: #fff; /* stays constant */
    }

    /* Optional: remove default WP outline styles (if present) */
    .wp-block-button__link:focus-visible {
    outline: none;
    }



    /* ==================================== */
    /*            Columns Block             */
    /* ==================================== */

        /* ---------------------------------------------- */
        /* Column gap control for WordPress Columns block */
        /* ---------------------------------------------- */
        /*
            Apply appropriate custom 
            class to the Columns block
            (ie: columns-gap-md)
        */
        .wp-block-columns.columns-gap-none {
            gap: 0;
        }

        .wp-block-columns.columns-gap-xs {
            gap: 0.5rem;
        }

        .wp-block-columns.columns-gap-sm {
            gap: 1rem;
        }

        .wp-block-columns.columns-gap-md {
            gap: 1.5rem;
        }

        .wp-block-columns.columns-gap-lg {
            gap: 2rem;
        }

        .wp-block-columns.columns-gap-xl {
            gap: 3rem;
        }

        .wp-block-columns.columns-gap-xxl {
            gap: 4rem;
        }

        .wp-block-columns.columns-gap-xxxl {
            gap: 5rem;
        }

        .wp-block-columns.columns-gap-xxxxl {
            gap: 6rem;
        }


        /* --------------------------------------- */
        /* Change Column Breakpoint and remove gap */
        /* --------------------------------------- */
        /*
            Apply appropriate custom 
            class to the Columns block
            (ie: columns-stack-1000)
        */
        @media (max-width: 1000px) {
            .wp-block-columns.columns-stack-1000 {
                flex-wrap: wrap !important;
                gap: var(--wp--style--block-gap, 1.5rem);
            }

            .wp-block-columns.columns-stack-1000 > .wp-block-column {
                flex-basis: 100% !important;
                flex-grow: 0;
            }
        }
        
        @media (max-width: 1100px) {
            .wp-block-columns.columns-stack-1100 {
                flex-wrap: wrap !important;
                gap: var(--wp--style--block-gap, 1.5rem);
            }

            .wp-block-columns.columns-stack-1100 > .wp-block-column {
                flex-basis: 100% !important;
                flex-grow: 0;
            }
        }

        @media (max-width: 1200px) {
            .wp-block-columns.columns-stack-1200 {
                flex-wrap: wrap !important;
                gap: var(--wp--style--block-gap, 1.5rem);
            }

            .wp-block-columns.columns-stack-1200 > .wp-block-column {
                flex-basis: 100% !important;
                flex-grow: 0;
            }
        }

        @media (max-width: 1300px) {
            .wp-block-columns.columns-stack-1300 {
                flex-wrap: wrap !important;
                gap: var(--wp--style--block-gap, 1.5rem);
            }

            .wp-block-columns.columns-stack-1300 > .wp-block-column {
                flex-basis: 100% !important;
                flex-grow: 0;
            }
        }

        @media (max-width: 1400px) {
            .wp-block-columns.columns-stack-1400 {
                flex-wrap: wrap !important;
                gap: var(--wp--style--block-gap, 1.5rem);
            }

            .wp-block-columns.columns-stack-1400 > .wp-block-column {
                flex-basis: 100% !important;
                flex-grow: 0;
            }
        }



        /* ----------------------------------------------------------
        Breakout Content: Base breakout variables + grid definition
        ---------------------------------------------------------- */
        /*
            Apply appropriate class for either left or
            right breakout content to the Columns block
        */
        .wp-block-columns.breakout-content-left,
        .wp-block-columns.breakout-content-right {
            /* Breakout variables */
            --breakout-content-gap: var(--wp--style--block-gap);
            --breakout-content-split-left: 50;

            /* Inner usable width minus paddings and middle gap */
            --breakout-content-inner-width: calc(var(--kf-max-width) - var(--kf-global-padding-left) - var(--kf-global-padding-right) - var(--breakout-content-gap));

            /* Derived left/right inner tracks */
            --breakout-content-inner-left: calc(var(--breakout-content-inner-width) * (var(--breakout-content-split-left) / 100));
            --breakout-content-inner-right: calc(var(--breakout-content-inner-width) * ((100 - var(--breakout-content-split-left)) / 100));

            padding-left: var(--kf-global-padding-left);
            padding-right: var(--kf-global-padding-right);

            display: grid;

            /* IMPORTANT:
            No gap on desktop grid.
            The gap is now its own middle track.
            */
            gap: 0;

            /* 5-track grid:
                [1] left bleed track
                [2] inner left
                [3] middle gap only
                [4] inner right
                [5] right bleed track
            */
            grid-template-columns:
                1fr
                minmax(0, var(--breakout-content-inner-left))
                var(--breakout-content-gap)
                minmax(0, var(--breakout-content-inner-right))
                1fr;

            max-width: none;
            margin: 0;
            box-sizing: border-box;
        }

        /* Split helper classes */
        /*
            Apply appropriate class to modify the 
            width of the breakout content columns
        */
        .wp-block-columns.breakout-content-split-30-70 { --breakout-content-split-left: 30; }
        .wp-block-columns.breakout-content-split-35-65 { --breakout-content-split-left: 35; }
        .wp-block-columns.breakout-content-split-40-60 { --breakout-content-split-left: 40; }
        .wp-block-columns.breakout-content-split-50-50 { --breakout-content-split-left: 50; }
        .wp-block-columns.breakout-content-split-60-40 { --breakout-content-split-left: 60; }
        .wp-block-columns.breakout-content-split-65-35 { --breakout-content-split-left: 65; }
        .wp-block-columns.breakout-content-split-70-30 { --breakout-content-split-left: 70; }

        /* Gap helper classes */
        /*
            Apply appropriate class to modify the width of 
            the gap between the breakout content columns
        */
        .wp-block-columns.breakout-content-gap-none { --breakout-content-gap: 0; }
        .wp-block-columns.breakout-content-gap-xs   { --breakout-content-gap: 0.5rem; }
        .wp-block-columns.breakout-content-gap-sm   { --breakout-content-gap: 1rem; }
        .wp-block-columns.breakout-content-gap-md   { --breakout-content-gap: 1.5rem; }
        .wp-block-columns.breakout-content-gap-lg   { --breakout-content-gap: 2rem; }
        .wp-block-columns.breakout-content-gap-xl   { --breakout-content-gap: 3rem; }
        .wp-block-columns.breakout-content-gap-xxl  { --breakout-content-gap: 4rem; }
        .wp-block-columns.breakout-content-gap-xxxl  { --breakout-content-gap: 5rem; }
        .wp-block-columns.breakout-content-gap-xxxxl  { --breakout-content-gap: 6rem; }

        /* Neutralize core Columns flex sizing */
        .wp-block-columns.breakout-content-left > .wp-block-column,
        .wp-block-columns.breakout-content-right > .wp-block-column {
            width: auto;
            flex: initial;
            min-width: 0;
        }

        /* LEFT breakout: image first, content second */
        .wp-block-columns.breakout-content-left > .wp-block-column:first-child {
            grid-column: 1 / 3;
        }

        .wp-block-columns.breakout-content-left > .wp-block-column:last-child {
            grid-column: 4 / 5;
        }

        /* RIGHT breakout: content first, image second */
        .wp-block-columns.breakout-content-right > .wp-block-column:first-child {
            grid-column: 2 / 3;
        }

        .wp-block-columns.breakout-content-right > .wp-block-column:last-child {
            grid-column: 4 / 6;
        }

        /* Image */
        .wp-block-columns.breakout-content-left .wp-block-image,
        .wp-block-columns.breakout-content-right .wp-block-image {
            margin: 0;
        }

        .wp-block-columns.breakout-content-left .wp-block-image img,
        .wp-block-columns.breakout-content-right .wp-block-image img {
            display: block;
            height: auto;
        }

        /* Mobile stack */
        @media (max-width: 781px) {
            .wp-block-columns.breakout-content-left,
            .wp-block-columns.breakout-content-right {
                display: flex;
                flex-direction: column;
                gap: var(--breakout-content-gap);
            }

            .wp-block-columns.breakout-content-left > .wp-block-column,
            .wp-block-columns.breakout-content-right > .wp-block-column {
                width: 100%;
                margin: 0;
            }

            .wp-block-columns.breakout-content-left.breakout-content-mobile-reverse > .wp-block-column:first-child,
            .wp-block-columns.breakout-content-right.breakout-content-mobile-reverse > .wp-block-column:first-child {
                order: 2;
            }

            .wp-block-columns.breakout-content-left.breakout-content-mobile-reverse > .wp-block-column:last-child,
            .wp-block-columns.breakout-content-right.breakout-content-mobile-reverse > .wp-block-column:last-child {
                order: 1;
            }
        }









/* ////////////////////////////////////////// */
/*                                            */
/*                  CUSTOM CLASSES            */
/*                                            */
/* ////////////////////////////////////////// */






/* ////////////////////////////////////////// */
/*                                            */
/*                    PLUGINS                 */
/*                                            */
/* ////////////////////////////////////////// */

    /* ========================================== */
    /*                Gravity Forms               */
    /* ========================================== */

    /* ========================================== */
    /*               Kadence Blocks               */
    /* ========================================== */






/* ////////////////////////////////////////// */
/*                                            */
/*            3RD-PARTY FUNCTIONALITY         */
/*                                            */
/* ////////////////////////////////////////// */