/* banner-tools.css */
/* Banner Tools */
.bnr-tls {
	--bnr-tls-pd-v-tp: 165; /* { readonly: true } */
	--bnr-tls-pd-v-tp-mbl: 75; /* { readonly: true } */
	--bnr-tls-pd-v-bt: 165; /* { readonly: true } */
	--bnr-tls-pd-v-bt-mbl: 75; /* { readonly: true } */

	--bnr-tls-pd-v-tp-clc: calc((var(--bnr-tls-pd-v-tp-mbl) * 1px) + (var(--bnr-tls-pd-v-tp) - var(--bnr-tls-pd-v-tp-mbl)) * ((var(--vw_) - 320px) / (1920 - 320))); /* { readonly: true } */
	--bnr-tls-pd-v-bt-clc: calc((var(--bnr-tls-pd-v-bt-mbl) * 1px) + (var(--bnr-tls-pd-v-bt) - var(--bnr-tls-pd-v-bt-mbl)) * ((var(--vw_) - 320px) / (1920 - 320))); /* { readonly: true } */

	padding-top: var(--bnr-tls-pd-v-tp-clc);
	padding-bottom: var(--bnr-tls-pd-v-bt-clc);

	.cms-content & {
		[field="Title"] [data-sysheader] {
			display: none;
		}

		[field="Title"] if[p-hide='true'] {
			display: block;
		}
	}
}

.overlap {
	.bnr-tls [class*="mn_"],
	+ .bnr-tls [class*="mn_"] {
		padding-top: var(--bnr-tls-pd-v-tp-clc);
	}
}

/* When a banner is the first section under an overlap header, overlapping-header.js
   adds the measured header height to this section's own top padding. Banners route
   their headline's breathing room through their inner content (.bnr-*-cnt), so drop
   the section's own top padding here — otherwise it doubles up under the header. */
header:has(.overlap) + main > .bnr-tls:first-child {
	padding-top: 0;
}
/* 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;



    .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-v4.css */
.cnt.v4{
    .cnt-stl{
        @media screen and (min-width: 1280px) {
            ul{
                column-count: 3;
            }
        }

    }
}
/* reviews-v7.css */
/* Reviews V7 — Spotlight + Aggregate (single review + rating block) */
.rvw.v7 {

    /* Big heading (h4 → fnt_t-1) — Bayon 100px / lh 0.9 / mixed case */
    --fnt-t-1-tt: none;
    --fnt-t-1-lh: 0.9;

    /* Card title (fnt_qte from ReviewItem) — Figma 50px / lh 0.9 */
    --fnt-qte-s: 2.78rem;
    --fnt-qte-lh: 0.9;

    /* Card border-radius — Figma 20px */
    --bdr-rds-crd: 1.11rem;

    /* Heading accent — teal via theme-aware --callout */
    header h4 > strong {
        color: var(--callout);
        display: inline-block;
    }

    /* Big "4.9" number — teal, lh 1 */
    .rvw-v7-num {
        line-height: 1;
        color: var(--callout);
    }

    /* Rate row gap (24px) + caption color */
    .rvw-v7-rate {
        --grd-sp-dyn: 1.33rem;

        .fnt_t-k {
            color: var(--text-color);
        }
    }

    .rvw-v7-avg { gap: 0.44rem; }

    /* Star — Figma 56×56 yellow */
    .rvw-v7-str {
        font-size: 3.1rem;
        color: var(--rvw-str-clr);
    }

    .rvw-v7-cnt { line-height: 1.2; margin: 0; }
    .rvw-v7-srcs li { gap: 0.22rem; }

    /* Desktop card padding — Figma 48px top/bottom, 40px sides */
    @media screen and (min-width: 1280px) {
        .rvw-v7-list li .pd_v.pd_h {
            padding: 2.67rem 2.22rem;
        }
    }
}

/* contact-v4.css */
/* Contact V4 — Form + Locations Info Card */
.ctc.v4 {
    --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;
    }

    /* Bottom emergency CTA card */
    .cntc-v4-cta {
        --bdr-rds-crd: 1.11rem;            /* Figma 20px */

        /* Kicker font (fnt_t-k) — Figma 20px / 0.12em letter-spacing
           (default 1rem / 0.4em). Use .cstm scope so other fnt_t-k usages aren't affected. */
        .fnt_t-k.cstm {
            --fnt-t-k-s: 1.11rem;
            --fnt-t-k-ls: 0.12em;
        }

        @media screen and (min-width:1280px) {
           & > .pd_h.pd_v {
                padding: 1.78rem 12rem 1.78rem 1.78rem;
            }
        }
    }

    .cntc-v4-cta-dsc {
        font-weight: 500;
        line-height: 1.6;
        margin: 0;
    }

    .iso {
        position: absolute;
        bottom: 0;
        right: 0;
        max-width: 42%;
    }

    /* Values Stacked Single */
    .vls-stk-sgl {
        --fnt-t-co-s: 2.22rem;
    }
    .vls-stk-sgl-icn svg {
        font-size: 2rem;
    }

    &[data-colors$="-light"] {
        .ulk-bg {
            --inner-theme: var(--dk-bg);
        }
    }
    
}