/* coupon-tools.css */
/* Coupon Tools */
main {
	--cpn-ttl-w: 3rem; /* { min: 0, max: 10, step: 1, friendly: 'Coupon Title Width' } */

	--cpn-bdr-pd: 0rem; /* { min: 0.25, max: 2, step: 0.001, friendly: 'Coupon Border Padding' } */
	--cpn-bdr-w: 2px; /* { min: 1, max: 5, step: 1, friendly: 'Coupon Border Width' } */
	--cpn-bdr-s: none; /* { friendly: 'Coupon Border Style' } */

	--cpn-act-icn-s: .89rem; /* { min: .8, max: 3, step: 0.001, friendly: 'Action Icon Size' } */

	--cpn-lg-mx-wd: 265; /* { min: 50, max: 500, step: 10, friendly: 'Coupon Logo Max Width Desktop' } */
	--cpn-lg-mx-wd-mbl: 170; /* { min: 10, max: 300, step: 1, friendly: 'Coupon Logo Max Width Mobile' } */
	--cpn-lg-mx-wd-clc: calc((var(--cpn-lg-mx-wd-mbl) * 1px) + (var(--cpn-lg-mx-wd) - var(--cpn-lg-mx-wd-mbl)) * ((var(--vw_) - 320px) / (1920 - 320))); /* { readonly: true } */

	--cpn-lg-dsp: flex;  /* {friendly: 'Coupon Logo Display'} */

	--cpn-ntch-r: 1.667rem;  /* { min: 10, max: 40, step: 1, friendly: 'Coupon Notch Radius' } */
	--cpn-ntch-y: 78%;   /* { min: 50, max: 95, step: 1, friendly: 'Coupon Notch Position' } */

	--cpn-udr-clr: #ffce34;  /* { friendly: 'Coupon Underlay Color' } */
	--cpn-udr-s: 12px;   /* { min: 0, max: 50, step: 1, friendly: 'Coupon Underlay Side Inset' } */
	--cpn-udr-o: 14px;   /* { min: 0, max: 30, step: 1, friendly: 'Coupon Underlay Overflow' } */
}

/* reviews-tools.css */
/* Reviews panel tools */
.svg-con {
    line-height: 1;
    svg {
        font-size: 1.33rem;
    }
}
/* banner-v1.css */
.bnr.v1 {
    --bnr-tls-pd-v-tp: 90;
    --bnr-tls-pd-v-tp-mbl: 50;
    --bnr-tls-pd-v-bt: 40;
    --bnr-tls-pd-v-bt-mbl: 30;
    --bnr-img-bg-o: .2;
    background: linear-gradient(180deg, hsl(from var(--black) h s l / .8) 11.54%, hsl(from var(--background) h s l / .8) 100%);

    /* Default flair color (used when there's no next panel or its theme isn't matched) */
    --bnr-v1-flair-clr: var(--accent);

    /* Match flair color to the bg of the next panel so the strip blends into it */
    &:has(+ section[data-colors="primary-light"])   { --bnr-v1-flair-clr: var(--lt-bg); }
    &:has(+ section[data-colors="alternate-light"]) { --bnr-v1-flair-clr: var(--lt-alt-bg); }
    &:has(+ section[data-colors="primary-dark"])    { --bnr-v1-flair-clr: var(--dk-bg); }
    &:has(+ section[data-colors="alternate-dark"])  { --bnr-v1-flair-clr: var(--dk-alt-bg); }

    position: relative;


    .btm-deco {
        bottom: -120px;
        /* Always render the faceted decoration textured (accent-colored) beneath
           the hero, regardless of the next section's background. Without this it
           inherits --shape-clr-1-dyn matched to the next panel's bg, so a light
           next section turns the white-on-white facets flat white. Set on
           .btm-deco (not the section) so it shadows the theme's section-level
           value via proximity. Above-footer decorations aren't .bnr.v1, so they
           keep their white blend. */
        --shape-clr-1-dyn: var(--accent);
    }
    .bnr-v1-cnt {
        position: relative;
        z-index: 1;
        padding-top: var(--bnr-tls-pd-v-tp-clc);
    }

    .wv-bnr {
        --shape-clr-1-dyn: var(--dk-bg);
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;

        svg {
            width: 100%;
            height: 17rem;
        }
    }

    .bnr-v1-flair {
        width: 100%;
        height: .78rem;
        background-color: var(--bnr-v1-flair-clr);
        mask-image: var(--flr-img);
        mask-repeat: repeat-x;
        mask-size: auto 100%;
        mask-position: center;
        position: absolute;
        bottom: -1px;
        left: 0;
        z-index: 1;
    }
}

header:has(.hdr.v1) + main .bnr.v1 {
    --bnr-tls-pd-v-tp: 127;
    --bnr-tls-pd-v-bt: 64;
}


/* content-v2.css */
.cnt.v2 {
    aside > * + * {
        margin-top: var(--sp-vm-clc);
    }
}

/* side-nav.css */
.sdnv {
    --sdnv-lnk-pd: 1.125rem;
    --sdnv-lnk-rds: 0.625rem;
    --sdnv-hvr-bg: rgba(255, 255, 255, 0.12);
    --sdnv-hvr-bdr: rgba(237, 237, 237, 0.08);
    --sdnv-cpn-gap: 8rem;


    .sdnv-link {
        padding: var(--sdnv-lnk-pd);
        border: 1.5px solid transparent;
        border-radius: var(--sdnv-lnk-rds);
        color: hsl(from var(--text-color) h s l / 0.8);
        text-decoration: none;
        transition: background-color 0.2s, border-color 0.2s, color 0.2s;

        .sdnv-arr {
            color: var(--accent);
            width: 1em;
            height: 1em;
            opacity: 0;
            transition: opacity 0.2s;
        }

        &.active,
        &:hover,
        &:focus-visible {
            background-color: var(--sdnv-hvr-bg);
            border-color: var(--sdnv-hvr-bdr);
            color: var(--text-color);

            .sdnv-arr {
                opacity: 1;
            }
        }
    }

    .sdnv-cpn {
        margin-top: var(--sdnv-cpn-gap);
    }
}

/* reviews-v1.css */
/* Reviews V1 */
.rvw.v1 {
	--rvw-str-s: 1.33rem;

	.rvw-v1-lft {
		gap: 3.125rem;
	}

	.rvw-v1-icn img {
		width: 3.938rem;
		height: auto;
	}

	.rvw-v1-ttl {
		font-family: var(--font-accent, sans-serif);
		font-size: clamp(3rem, 5.2vw, 6.25rem);
		line-height: 0.9;
		text-transform: uppercase;
	}

	.rvw-v1-accnt {
		color: var(--primary);
		display: block;
	}

	.rvw-v1-cols {
		--flx-gap: 1.5rem;
		height: 34rem;
	}

	.rvw-v1-col {
		height: 100%;
		mask-image: linear-gradient(to bottom, transparent 0%, black 18%, black 82%, transparent 100%);
	}

	.rvw-v1-track {
		gap: 1.5rem;

		[aria-hidden] {
			visibility: visible;
		}

		&.ready[data-dir="up"] {
			animation: rvw-scroll-up var(--rvw-scroll-duration, 90s) linear infinite;
		}

		&.ready[data-dir="down"] {
			animation: rvw-scroll-down var(--rvw-scroll-duration, 110s) linear infinite;
		}
	}

	@media screen and (max-width: 1279px) {
		.rvw-v1-cols {
			height: 28rem;
		}
	}

	@media screen and (max-width: 699px) {
		.rvw-v1-cols {
			height: 22rem;
		}
	}

	@media (prefers-reduced-motion: reduce) {
		.rvw-v1-track.ready {
			animation: none !important;
		}
	}
}

@keyframes rvw-scroll-up {
	from { transform: translateY(0); }
	to   { transform: translateY(calc(-1 * var(--rvw-cycle-height))); }
}

@keyframes rvw-scroll-down {
	from { transform: translateY(calc(-1 * var(--rvw-cycle-height))); }
	to   { transform: translateY(0); }
}

[data-colors="primary-light"]{
	&.rvw.v1{
		background: linear-gradient(0deg, #FAF6EE 41.21%, #FAF6EE 70.16%, #FFF 99.1%);
	}
}
/* contact-v3.css */
.ctc.v3 {
    --flx-gap: 2.78rem;
    background: linear-gradient(to bottom, var(--background), var(--inner-theme) 82.258%);

    .frst-bg {
        --frst-blur: 4px;
        background-color: hsl(from var(--frst-bg-clr) h s l / .9);
        border: none;
        
        @media screen and (min-width:1280px) {
            & {
                box-shadow: 0 14px 24px 0 rgba(0, 0, 0, 0.20);
            }
        }
    }

    .frm {
        padding: 1.78rem;
    }

    @media screen and (min-width: 700px) {
        & {
            .grd.mx-2 {
                --itm-val: 50;
            }
        }  

    }

}