:root {

    --primary-bg:       #eff4e8;
    --primary-light:    #dee9d1;
    --primary-mid:      #A2D3B9;
    --primary:          #00853E;
    --primary-dark:     #015F2D;
    --primary-neon:     #AAE773;

    --secondary-bg:     #FBF3EA;
    --secondary-light:  #ded6cf;
    --secondary-mid:    #aaa29b;
    --secondary:        #69635f;
    --secondary-dark:   #443f3b;

    --accent-bg:        #FFFBE9;
    --accent-light:     #FFEFBF;
    --accent-mid:       #FDE498;
    --accent:           #f3be22;
    --accent-dark:      #C68D00;

    --neutral-bg:       #F2F3F4;
    --neutral-light:    #E6E7EA;
    --neutral-mid:      #747C89;
    --neutral:          #515862;
    --neutral-dark:     #0C1015;

    --white:            #fff;

    /* @link https://utopia.fyi/clamp/calculator?a=448,1344,3—4|6—8|12—16|16—20|20—24|28—32|36—48|42—64|48—96|64—128&p=space */
    /* 448px --> 1344px */
    --space-tiny: clamp(0.1875rem, 0.1563rem + 0.1116vw, 0.25rem);  /* 3-4px */
    --space-xs: clamp(0.375rem, 0.3125rem + 0.2232vw, 0.5rem);      /* 6-8px */
    --space-sm: clamp(0.75rem, 0.625rem + 0.4464vw, 1rem);          /* 12-16px */
    --space-base: clamp(1rem, 0.875rem + 0.4464vw, 1.25rem);        /* 16-20px */
    --space-md: clamp(1.25rem, 1.125rem + 0.4464vw, 1.5rem);        /* 20-24px */
    --space-lg: clamp(1.75rem, 1.625rem + 0.4464vw, 2rem);          /* 28-32px */
    --space-xl: clamp(2.25rem, 1.875rem + 1.3393vw, 3rem);          /* 36-48px */
    --space-xxl: clamp(2.625rem, 1.9375rem + 2.4554vw, 4rem);       /* 42-64px */
    --space-huge: clamp(3rem, 1.5rem + 5.3571vw, 6rem);             /* 48-96px */
    --space-mega: clamp(4rem, 2rem + 7.1429vw, 8rem);               /* 64-128px */

    /* @link https://utopia.fyi/clamp/calculator?a=448,1344,8—12|12—16|16—20|20—24|24—30|30—40|36—54&p=text */
    /* 448px --> 1344px */
    --text-xs:     clamp(0.6875rem, 0.5938rem + 0.3348vw, 0.875rem);/* 11-14px */
    --text-sm:     clamp(0.9375rem, 0.875rem + 0.2232vw, 1.0625rem);/* 15-17px */
    --text-base:   clamp(1.0625rem, 1rem + 0.2232vw, 1.1875rem);    /* 17-19px */
    --text-md:     clamp(1.25rem, 1.125rem + 0.4464vw, 1.5rem);     /* 20-24px */
    --text-lg:     clamp(1.5rem, 1.3125rem + 0.6696vw, 1.875rem);   /* 24-30px */
    --text-xl:     clamp(1.875rem, 1.5625rem + 1.1161vw, 2.5rem);   /* 30-40px */
    --text-xxl:    clamp(2.25rem, 1.6875rem + 2.0089vw, 3.375rem);  /* 36-54px */

    --font-weight-thin: 300;
    --font-weight-regular: 400;
    --font-weight-semibold: 600;
    --font-weight-bold: 600;
    
    --max-narrow:   36rem; /* 576px */
    --max-content:  60rem; /* 960px */
    --max-wide:     84rem; /* 1344px */

    --shadow-sm: 0 var(--space-xs) var(--space-sm) rgba(0,0,0,0.06);
    --shadow-md: 0 var(--space-sm) var(--space-md) rgba(0,0,0,0.06);

    --radius-sm: var(--space-xs);
    --radius-base: var(--space-sm);
    --radius-md: var(--space-base);
    --radius-lg: var(--space-md);
    --radius-xl: var(--space-lg);

    --gutter: clamp(1rem, -1.5rem + 8.9286vw, 6rem); /* 16px->96px */


}



/*--------------------------------------------------------------------------- */
/* MARK: Fonts
*/



/* Public Sans Var */
@font-face {
    font-family: 'font-primary';
    src:    url('/assets/fonts/public-sans-var/public-sans-var.woff2') format('woff2-variations'),
            url('/assets/fonts/public-sans-var/public-sans-var.ttf') format('truetype-variations');
    font-weight: 100 900;
    font-display: swap;
        
}
.font-primary { font-family: 'font-primary', sans-serif; font-style: normal; }
.font-primary-100 { font-family: 'font-primary', sans-serif; font-style: normal; font-weight: 100; }
.font-primary-200 { font-family: 'font-primary', sans-serif; font-style: normal; font-weight: 200; }
.font-primary-300 { font-family: 'font-primary', sans-serif; font-style: normal; font-weight: 300; }
.font-primary-400 { font-family: 'font-primary', sans-serif; font-style: normal; font-weight: 400; }
.font-primary-500 { font-family: 'font-primary', sans-serif; font-style: normal; font-weight: 500; }
.font-primary-600 { font-family: 'font-primary', sans-serif; font-style: normal; font-weight: 600; }
.font-primary-700 { font-family: 'font-primary', sans-serif; font-style: normal; font-weight: 700; }
.font-primary-800 { font-family: 'font-primary', sans-serif; font-style: normal; font-weight: 800; }
.font-primary-900 { font-family: 'font-primary', sans-serif; font-style: normal; font-weight: 900; }

/* Public Sans Var Italic */
@font-face {
    font-family: 'font-primary';
    src:    url('/assets/fonts/public-sans-var/public-sans-var-italic.woff2') format('woff2-variations'),
            url('/assets/fonts/public-sans-var/public-sans-var-italic.ttf') format('truetype-variations');
    font-weight: 100 900;
    font-display: swap;
    font-style: italic; 
}
.font-primary-i { font-family: 'font-primary', sans-serif; font-style: italic; }
.font-primary-100i { font-family: 'font-primary', sans-serif; font-style: italic; font-weight: 100; font-style: italic; }
.font-primary-200i { font-family: 'font-primary', sans-serif; font-style: italic; font-weight: 200; font-style: italic; }
.font-primary-300i { font-family: 'font-primary', sans-serif; font-style: italic; font-weight: 300; font-style: italic; }
.font-primary-400i { font-family: 'font-primary', sans-serif; font-style: italic; font-weight: 400; font-style: italic; }
.font-primary-500i { font-family: 'font-primary', sans-serif; font-style: italic; font-weight: 500; font-style: italic; }
.font-primary-600i { font-family: 'font-primary', sans-serif; font-style: italic; font-weight: 600; font-style: italic; }
.font-primary-700i { font-family: 'font-primary', sans-serif; font-style: italic; font-weight: 700; font-style: italic; }
.font-primary-800i { font-family: 'font-primary', sans-serif; font-style: italic; font-weight: 800; font-style: italic; }
.font-primary-900i { font-family: 'font-primary', sans-serif; font-style: italic; font-weight: 900; font-style: italic; }


/* Oswald Var */
@font-face {
    font-family: 'font-secondary';
    src:    url('/assets/fonts/oswald-var/oswald-var.woff2') format('woff2-variations'),
            url('/assets/fonts/oswald-var/oswald-var.ttf') format('truetype-variations');
    font-weight: 200 700;
    font-display: swap;
        
}
.font-secondary { font-family: 'font-secondary', sans-serif; font-style: normal; }
.font-secondary-200 { font-family: 'font-secondary', sans-serif; font-style: normal; font-weight: 200; }
.font-secondary-300 { font-family: 'font-secondary', sans-serif; font-style: normal; font-weight: 300; }
.font-secondary-400 { font-family: 'font-secondary', sans-serif; font-style: normal; font-weight: 400; }
.font-secondary-500 { font-family: 'font-secondary', sans-serif; font-style: normal; font-weight: 500; }
.font-secondary-600 { font-family: 'font-secondary', sans-serif; font-style: normal; font-weight: 600; }
.font-secondary-700 { font-family: 'font-secondary', sans-serif; font-style: normal; font-weight: 700; }

/*--------------------------------------------------------------------------- */
/* MARK: RESET
*/

/* heavily based on https://www.joshwcomeau.com/css/custom-css-reset/ */
*, *::before, *::after {
    box-sizing: border-box;
}
* {
    margin: 0;
}
*:focus {
    outline: 4px solid var(--primary-neon);
    outline-offset: 2px;
}
@media (prefers-reduced-motion: no-preference) {
    html {
        interpolate-size: allow-keywords;
        scroll-behavior: smooth;
    }
}
img, picture, video, canvas, svg {
    display: block;
    max-width: 100%;
}
input, button, textarea, select {
    font: inherit;
}
p, h1, h2, h3, h4, h5, h6 {
    overflow-wrap: break-word;
}
h1, h2, h3, h4, h5, h6 {
    text-wrap: balance;
}
p {
    text-wrap: pretty;
}
strong {
    font-weight: var(--font-weight-bold);
}

/*--------------------------------------------------------------------------- */
/* MARK: HTML/BODY
*/

html {
    background-color: var(--secondary-bg);
    padding: 0;
}

body {
    color: var(--neutral);
    font-family: 'font-primary', system-ui, sans-serif;
    font-size: var(--text-base);
    font-weight: var(--font-weight-regular);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

/*--------------------------------------------------------------------------- */
/* MARK: Site HEADER
*/

.site-header {
    align-content: space-between;
    background-color: var(--secondary-dark);
    display: grid;
    min-height: 90vh;
    padding: var(--space-sm) var(--gutter);
    position: relative;
    text-align: center;
}
.site-header .page-img {
    height: 100%;
    inset: 0;
    object-fit: cover;
    position: absolute;
    filter: brightness(0.4) contrast(0.8);
    width: 100%;
    z-index: 1;
}
.masthead {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: var(--space-base);
    max-width: var(--max-wide);
    margin-inline: auto;
    position: relative;
    width: 100%;
    z-index: 5;
}
.masthead .logo {
    align-items: center;
    gap: var(--space-sm);
    display: flex;
    font-weight: var(--font-weight-bold);
    text-decoration: none;
}
.masthead .logo img {
    filter: saturate(0) brightness(4);
    transition: all 0.2s ease-out;
    width: 10rem;
}
.masthead .logo img:hover {
    opacity: 0.8;
}
@media screen and (min-width: 48rem) {
    .masthead {
        flex-direction: row;
        justify-content: space-between;
    }
    .masthead .logo img {
        width: 11.25rem;
    }
}

/*--------------------------------------------------------------------------- */
/* MARK: Site Nav
*/

.site-nav {
    display: none; /* for mobile */
    z-index: 5;
}
@media screen and (min-width: 36rem) {
    .site-nav {
        display: block;
    }
}

/* the parent menu and primary nav items */
.site-nav > .menu {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-xs) var(--space-sm);
    justify-content: center;
    list-style: none;
    padding: 0;
}
.site-nav > .menu.omega-btn > li:last-of-type {
    margin-left: var(--space-xs);
}
.site-nav > .menu.omega-btn > li:last-of-type a {
    background-color: var(--primary);
    border-radius: var(--radius-xl);
    padding: var(--space-sm);
}
.site-nav > .menu > li {
    display: flex;
}
.site-nav > .menu > li.has-submenu {
    position: relative;
}
.site-nav > .menu > li.has-submenu a {
    padding-right: var(--space-tiny);
}
.site-nav > .menu > li.has-submenu button {
    border: 0;
    background-color: transparent;
    cursor: pointer;
}
.site-nav > .menu > li.has-submenu button svg {
    stroke: white;
    height: var(--space-sm);
    width: var(--space-sm);
}
.site-nav > .menu > li.has-submenu button[aria-expanded="true"] svg {
    transform: scaleY(-1);
}
.site-nav > .menu > li > a {
    color: white;
    padding: var(--space-xs);
    text-decoration: none;
}

.site-nav .submenu {
    background-color: white;
    border: 0;
    border-radius: var(--radius-base);
    display: none;
    gap: 1px;
    left: 0;
    list-style: none;
    opacity: 0;
    padding: var(--space-xs);
    pointer-events: none;
    text-align: left;
    top: 100%;
    transition: opacity 1s ease-in-out;
    min-width: 20rem;
}
.site-nav .submenu[aria-hidden="false"] {
    display: grid;
    opacity: 1;
    pointer-events: auto; 
    position: absolute;
}
.site-nav .submenu a {
    background-color: var(--secondary-bg);
    border-radius: var(--radius-sm);
    color: var(--secondary-dark);
    display: block;
    padding: var(--space-xs);
    position: relative;
    text-decoration: none;
    z-index: 1;
}
.site-nav .submenu a:hover {
    background-color: var(--primary-light);
    z-index: 2;
}
.site-nav .submenu a:focus {
    z-index: 2;
}

.mobile-nav {
    background-color: var(--primary);
    border-radius: var(--radius-sm);
    color: white;
    position: relative;
    width: 100%;
}
@media screen and (min-width: 36rem) {
    .mobile-nav {
        display: none;
    }
}
.mobile-nav summary {
    cursor: pointer;
    padding: var(--space-xs);
}
.mobile-nav .menu {
    background-color: var(--primary-dark);
    border: 1px solid var(--primary-neon);
    border-radius: var(--radius-sm);
    font-weight: var(--font-weight-semibold);
    list-style: none;
    padding: 0 0 var(--space-xs) 0;
    position: absolute;
    left: 0; top: 100%; right: 0;
    z-index: 10;
}
.mobile-nav .menu button {
    display: none;
}
.mobile-nav .menu a {
    display: block;
    color: white;
    text-decoration: none;
    padding: var(--space-xs);
}
.mobile-nav .menu .submenu {
    font-style: italic;
    list-style: none;
    padding: 0;
    font-weight: var(--font-weight-regular);
}

/*--------------------------------------------------------------------------- */
/* MARK: Page Title
*/

.page-title {
    align-self: flex-end;
    display: grid;
    position: relative;
    padding: var(--space-huge) 0 var(--space-xxl) 0;
    text-align: left;
}
.page-title > .wrapper {
    align-self: flex-end;
    max-width: var(--max-wide);
    margin-inline: auto;
    width: 100%;
}
.page-title > .wrapper > * {
    color: white;
    position: relative;
}
.page-title .text-group {
    display: flex;
    flex-direction: column;
    gap: var(--space-base);
    z-index: 2;
    max-width: 42rem;
    width: 100%;
}
.page-title .text-group > * {
    width: 100%;
}
.page-title h1 {
    border-left: var(--space-xs) dotted var(--primary);
    line-height: 1.1;
    padding-left: var(--text-base);
}
.page-title a {
    color: var(--primary-neon);
}
.page-title .btns {
    margin-top: var(--space-base);
}
.page-title .btns a {
    color: white;
}
.page-title.alt-layout {
    text-align: center;
}
.page-title.alt-layout .text-group {
    margin-inline: auto;
}
.page-title.alt-layout h1 {
    border: 0;
    border-bottom: var(--space-xs) dotted var(--primary);
    padding: 0 0 var(--space-md) 0;
}
.page-title.alt-layout .btns {
    justify-content: center;
}

/*--------------------------------------------------------------------------- */
/* MARK: Site MAIN
*/

main {
    display: flex;
    flex-direction: column;
}
main > * {
    margin-block: 0;
}

/*--------------------------------------------------------------------------- */
/* MARK: Site FOOTER
*/

.site-footer {
    background-color: var(--primary-dark);
    color: var(--secondary-light);
    font-size: var(--text-sm);
    padding: var(--space-xxl) var(--gutter) var(--space-base) var(--gutter);
    text-align: center;
}
.site-footer > .wrap {
    align-items: center;
    display: grid;
    gap: var(--space-xl) var(--space-md);
    max-width: var(--max-wide);
    margin-inline: auto;
}
.site-footer ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.site-footer a {
    color: white;
    text-decoration: none;
}
.site-footer .logo {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    font-size: var(--text-xs);
    font-style: italic;
    color: var(--primary);
    margin: auto;
    filter: saturate(0) brightness(100);
}
.site-footer .top-nav .btn {
    background-color: var(--secondary-bg);
    border-color: var(--secondary-bg);
    color: var(--secondary);
}
.site-footer .footer-nav:not(.tertiary-nav) ul {
    display: grid;
    gap: var(--space-tiny);
}
.site-footer .footer-nav:not(.tertiary-nav) a {
    display: inline-block;
    padding: var(--space-tiny) 0;
}
.site-footer .footer-nav.tertiary-nav ul {
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-xs) var(--space-sm);
}
.site-footer .list-heading {
    color: var(--secondary-bg);
    font-size: var(--text-md);
    margin-bottom: var(--space-xs);
}
.site-footer .list-heading a {
    color: inherit
}
.site-footer .rtb-meta {
    display: flex;
    flex-wrap: wrap;
    font-size: var(--text-xs);
    gap: var(--space-xs) var(--space-sm);
    text-align: center;
    justify-content: center;
}
.site-footer .contact-info .address {
    margin-top: var(--space-sm);
}
.site-footer .contact-info .address a {
    display: inline-block;
    padding: var(--space-tiny) 0;
}    
.site-footer .fb-review-link {
    display: flex;
    justify-content: center;
}
.site-footer .fb-review-link a {
    display: flex;
    flex-wrap: nowrap;
    gap: var(--space-tiny);
}
.site-footer .fb-review-link svg {
    height: var(--space-lg);
    width: var(--space-lg);            
}
.site-footer .social-links {
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    gap: var(--space-sm);
    justify-content: center;
}            
.site-footer .social-links svg {
    height: var(--space-lg);
    width: var(--space-lg);
}

@media screen and (min-width: 36rem) {
    .site-footer > .wrap {
        grid-template-areas:
        "logo contact"
        "nav1 nav2"
        "social social"
        "top top"
        "copyright copyright"
        ;
        grid-template-columns: repeat(2, 1fr);
    }
    .site-footer .logo {
        grid-area: logo;
    }
    .site-footer .contact-info {
        grid-area: contact;
    }
    .site-footer .nav1 {
        grid-area: nav1;
    }
    .site-footer .nav2 {
        grid-area: nav2;
    }
    .site-footer .social-links {
        grid-area: social;
    }
    .site-footer .blurb {
        grid-area: blurb;
    }
    .site-footer .top-nav {
        grid-area: top;
    }
    .site-footer .rtb-meta {
        grid-area: copyright;
    }
}
@media screen and (min-width: 72rem) {
    .site-footer > .wrap {
        grid-template-columns: repeat(4, 1fr);
        grid-template-areas:
            "logo contact nav1 nav2"
            "social copyright copyright top"
        ;
        text-align: left;
    }
    .site-footer .logo {
        align-self: start;
        margin: 0;
    }
    .site-footer .social-links {
        justify-content: start;
    }
    .site-footer .contact-info {
        align-self: start;
    }
    .site-footer .top-nav {
        display: flex;
        justify-content: end;
    }
}

/*--------------------------------------------------------------------------- */
/* MARK: ROWS
*/

.row {
    --bg: transparent;
    background-color: var(--bg);
    /* border: 1px dashed salmon; */
    border-bottom: 1px solid var(--secondary-light);
    padding: var(--space-xxl) var(--gutter); /* top/bottom padding (xl) relates to the more/less classes below */
    position: relative;
}

.row.top-pad-none       { padding-top:      0; }
.row.bot-pad-none       { padding-bottom:   0; }
.row.top-pad-less       { padding-top:      var(--space-md); }
.row.bot-pad-less       { padding-bottom:   var(--space-md); }      /* md is half the xl size */
.row.top-pad-more       { padding-top:      var(--space-huge); }    /* huge is twice the xl size */
.row.bot-pad-more       { padding-bottom:   var(--space-huge); }

.row.has-bg-image       { color: white; }
.row.has-bg-image a     { color: inherit; }
.row > *                { margin-block: 0; }
.row:last-of-type       { border-bottom: 0; }

.row-bg-image {
    filter: opacity(1) brightness(0.25) contrast(0.9) saturate(1.2);
    height: 100%;
    left: 0; top: 0; bottom: 0; right: 0;
    object-fit: cover;
    position: absolute;
    width: 100%;
}

/*--------------------------------------------------------------------------- */
/* MARK: COLUMNS
*/

.columns {
    display: grid;
    gap: var(--space-xxl) var(--space-md);
    margin-inline: auto;
}
.columns .column {
    display: flex;
    gap: var(--space-base);
    flex-direction: column;
    position: relative;
    z-index: 2;
}    
.columns .column > * {
    margin-block: 0;
    max-width: 100%;
}
@media screen and (min-width: 48rem) {
    .columns {
        grid-template-columns: repeat(12, 1fr);
    }
    .columns .column {
        grid-column: span var(--span);
    }
}
.columns.text-center .column > :is(ul, ol) {
    text-align: left;
}

/*--------------------------------------------------------------------------- */
/* MARK: Auto-Grid
*/

.auto-grid {
    --max-column-width: 100% / var(--auto-grid-max-columns, infinity) - var(--auto-grid-gap);
    --column-width: max(var(--max-column-width), min(var(--auto-grid-min-size, 10rem), 100%));
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(var(--column-width), 1fr));
    gap: var(--auto-grid-gap-vertical, var(--auto-grid-gap, 1rem)) var(--auto-grid-gap, 1rem);

    /* defaults - override these as needed */
    --auto-grid-min-size: 16rem;
    --auto-grid-max-columns: 3;
    --auto-grid-gap: var(--space-md);
}


/*--------------------------------------------------------------------------- */
/* MARK: Headings
*/

h1 { font-size: var(--text-xxl); }
h2 { font-size: var(--text-xl); }
h3 { font-size: var(--text-lg); }
h4 { font-size: var(--text-md); }
h5 { font-size: var(--text-base); }
h6 { font-size: var(--text-sm); }

h1, h2, h3, h4, h5, h6 {
    font-family: 'font-secondary';
    font-weight: var(--font-weight-bold);
    line-height: 1.25;
}

/*--------------------------------------------------------------------------- */
/* MARK: Links
*/

a {
    color: var(--secondary);
    text-decoration-color: var(--primary-neon);
    text-decoration-thickness: 2px;
}

/*--------------------------------------------------------------------------- */
/* MARK: Paragraphs
*/

.lede {
    font-size: var(--text-md);
}

.callout {
    background-color: var(--primary-light);
    color: var(--primary-dark);
    padding: var(--space-base);
}

.kicker {
    font-weight: var(--font-weight-bold);
    text-transform: uppercase;
}

/*--------------------------------------------------------------------------- */
/* MARK: Lists
*/

ol, ul {
    padding-left: var(--space-lg);
}

/*--------------------------------------------------------------------------- */
/* MARK: Figures/Images
*/

figure figcaption {
    font-size: var(--space-sm);
    font-weight: var(--font-weight-semibold);
    padding: var(--space-xs);
}

img {
    height: auto;
}

/*--------------------------------------------------------------------------- */
/* MARK: HR
*/

hr {
    border: 0;
    padding: 0;
    height: 1px;
    background-color: var(--secondary-mid);
    width: 100%;
    display: block;
}

/*--------------------------------------------------------------------------- */
/* MARK: Blockquote
*/

blockquote footer {
    font-style: italic;
}
blockquote footer::before {
    content: ' — ';
}

/*--------------------------------------------------------------------------- */
/* MARK: Buttons
*/

*:is(p, ul, ol) + .btn-block {
    padding-top: var(--space-sm);
}

.btns {
    display: flex;
    gap: var(--space-sm) var(--space-base);
    flex-wrap: wrap;
}

.btn {
    --borderAndBackground: var(--primary);
    --btnRadius: var(--radius-xl);
    appearance: none;
    background-color: var(--borderAndBackground);
    border: 1px solid var(--borderAndBackground);
    border-radius: var(--btnRadius);
    color: var(--white);
    display: inline-block;
    line-height: 1;
    padding: var(--space-sm) var(--space-base);
    text-decoration: none;
}

.btn.outline {
    background-color: transparent;
}
.btn.simple {
    --borderAndBackground: transparent;
}
.btn.subtle {
    --borderAndBackground: var(--accent-bg);
}
.btn:hover {
    --borderAndBackground: var(--primary-dark);
}

/*--------------------------------------------------------------------------- */
/* MARK: Forms
*/

.rtbform {
    background-color: var(--secondary-light);
    border-radius: var(--radius-sm);
    display: grid;
    padding: var(--space-md);
    container-type: inline-size;
}
.rtbform .logo {
    margin-bottom: var(--space-sm);
    margin-inline: auto;
    width: 12.5rem;
}
.rtbform .heading {
    color: var(--secondary);
    font-size: var(--text-xl);
    margin-bottom: var(--space-sm);
    text-align: center;
}
.rtbform > * {
    width: 100%;
}
.rtbform .form-row {
    border: 1px solid var(--secondary-light);
    border-bottom: 0;
}
.rtbform .form-row:last-child {
    border: 0;
    border-top: 1px solid var(--secondary-light);
    justify-content: center;
    padding-top: var(--space-base);
}
@container (min-width: 24rem) {
    .rtbform .form-row {
        display: flex;
    }
    .rtbform label {
        padding: 0 var(--space-sm);
        width: 14rem;
    }
}
.rtbform label {
    align-content: center;
    background-color: var(--white);
    border: 0;
    color: var(--secondary);
    display: block;
    font-size: var(--text-sm);
    font-weight: var(--font-weight-semibold);
    display: block;
    padding: var(--space-xs) var(--space-sm) 0 var(--space-sm);
    text-align: left;
}
.rtbform input:is( [type=text], [type=search], [type=email], [type=number] ),
.rtbform textarea {
    background-color: var(--white);
    border: 0;
    border-radius: 0;
    box-shadow: none;
    display: block;
    font-size: 1.125rem;
    line-height: 1.1;
    padding: var(--space-sm);
    position: relative;
    resize: vertical;
    width: 100%;
    z-index: 1;
}
.rtbform input:is( [type=text], [type=search], [type=email], [type=number] ):focus,
.rtbform textarea:focus {
    z-index: 2;
}
.rtbform textarea {
    min-height: 12rem;
}
.rtbform input::placeholder, textarea::placeholder {
    color: var(--secondary-mid)
}
.uniform-potty {
    position: absolute;
    left: -9999px;
}

/*--------------------------------------------------------------------------- */
/* MARK: BLOCKS
*/

/* leave a gap here to make the sidebar nav useful */





/*--------------------------------------------------------------------------- */
/* MARK: Portal Block
*/

.portal {
    gap: var(--space-lg);
    list-style: none;
    padding: 0;
}
.portal > .item {
    background-color: white;
    border-radius: var(--radius-lg);
    display: flex;
    flex-direction: column;
}
.portal > .item .copy {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    padding: var(--space-md);
}
.portal > .item .img-link {
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    display: block;
    overflow: hidden;
}
.portal > .item .img-link > img {
    width: 100%;
}
.portal > .item .link {
    align-items: center;
    background-color: var(--secondary-light);
    border-radius: 0 0 var(--radius-lg) var(--radius-lg);
    display: flex;
    flex-wrap: nowrap;
    font-size: var(--text-sm);
    font-weight: var(--font-weight-bold);
    justify-content: space-between;
    margin-top: auto;
    padding: var(--space-base);
    text-decoration-color: var(--accent);
}
* + .portal {
    padding-top: var(--space-md);
}

/*--------------------------------------------------------------------------- */
/* MARK: Accordions Block / FAQs
*/

summary {
    cursor: pointer;
}
.accordions {
    display: grid;
    gap: var(--space-xs);
}
.accordions > .accordion {
    background-color: var(--secondary-light);
    border-radius: var(--radius-sm);
}
.accordions > .accordion[open=""] {
    background-color: white;
}
.accordions > .accordion > .question {
    font-weight: var(--font-weight-semibold);
    padding: var(--space-base);
}
.accordions > .accordion > .answer {
    padding: var(--space-base);
}

/*--------------------------------------------------------------------------- */
/* MARK: Map Block
*/

.map-block {
    background-color: var(--secondary-light);
    border-radius: var(--radius-sm);
    height: 100%;
    overflow: hidden;
}
.map-block iframe {
    height: 100%;
    width: 100%;
    min-width: 100%;
    min-height: 24rem;
}

/*--------------------------------------------------------------------------- */
/* MARK: Reviews Block
*/

.reviews-block {
    --auto-grid-max-columns: 2;
    display: grid;
}
.reviews-block .review {
    background-color: var(--secondary-light);
    border-radius: var(--radius-sm);
    display: flex;
    flex-direction: column;
    font-style: italic;
    gap: var(--space-sm);
    padding: var(--space-base);
    padding-top: var(--space-huge);
    position: relative;
    overflow: hidden;
}
.reviews-block .review:before {
    color: var(--secondary-bg);
    content: '“';
    font-style: normal;
    font-family: 'Georgia', serif;
    font-size: 800%;
    line-height: 1;
    position: absolute;
    top: var(--space-sm); left: 0; right: 0;
    text-align: center;
    z-index: 1;
}
.reviews-block .review > * {
    position: relative;
    z-index: 2;
}
.reviews-block .review .author {
    font-style: normal;
    margin-top: auto;
    padding-top: var(--space-base);
}

/*--------------------------------------------------------------------------- */
/* MARK: Image Block
*/

.image-block img {
    aspect-ratio: var(--ratio);
    background-color: var(--secondary-light);
    border-radius: var(--radius-sm);
    height: auto;
    object-fit: contain;
    width: 100%;
}
.image-block img[data-crop=""] {
    object-fit: cover;
}

.op-right-top          { object-position: right top;       }
.op-right-center       { object-position: right center;    }    
.op-right-bottom       { object-position: right bottom;    }
.op-center-top         { object-position: center top;      }
.op-center-center      { object-position: center center;   }
.op-center-bottom      { object-position: center bottom;   }
.op-left-top           { object-position: left top;        }
.op-left-center        { object-position: left center;     }
.op-left-bottom        { object-position: left bottom;     }

/*--------------------------------------------------------------------------- */
/* MARK: Text Block
*/

/* note: text blocks only get a wrapper if they have a max-width set */
.text-block {
    display: flex;
    flex-direction: column;
    gap: var(--space-base);
}

/*--------------------------------------------------------------------------- */
/* MARK: Gallery Block
*/

.gallery-block .gallery {
    --auto-grid-min-size: 8rem;
    --auto-grid-max-columns: 4;
    --auto-grid-gap: var(--space-base);
    align-items: center;
    list-style: none;
    padding: 0;
}

.gallery-block .gallery img {
    aspect-ratio: var(--ratio);
    border-radius: var(--radius-sm);
    height: auto;
    object-fit: contain;
    width: 100%;
}
.gallery-block .gallery img[data-crop=""] {
    object-fit: cover;
}
* + .gallery-block {
    padding-top: var(--space-md);
}
.gallery-block + * {
    padding-top: var(--space-md);
}

/*--------------------------------------------------------------------------- */
/* MARK: Blurbs Block
*/

.blurbs-block {
    --auto-grid-gap: var(--space-xl);
}
.blurbs-block.padded-blurbs {
    --auto-grid-gap: var(--space-xs);
}
.blurbs-block.padded-blurbs .blurb {
    background-color: var(--primary);
    border-radius: var(--radius-sm);
    color: white;
    padding: var(--space-base);
}
.blurbs-block.padded-blurbs .blurb a {
    color: var(--white)
}
    
.blurbs-block .blurb {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
}

.blurbs-block .blurb .img {
    border-radius: var(--radius-md);
    margin-inline: auto;
    max-width: 24rem;
    width: 75%;
}
.blurbs-block .blurb .icon {
    display: block;
}
.blurbs-block .blurb .icon svg {
    height: var(--space-xl);
    width: var(--space-xl);
}
* + .blurbs-block {
    padding-top: var(--space-md);
}
.columns.text-center .blurbs-block svg {
    margin-inline: auto;
}

/*--------------------------------------------------------------------------- */
/* MARK: Utility Classes
*/

.skiplink {
	position: absolute;
	transform: translateX(-100%);
	background-color: white;
	z-index: 3;
	left: 0;
	top: 0;
	padding: var(--space-base);
}    
.skiplink:focus {
    transform: translateX(0);
}

.trim > :first-child    { margin-top: 0; }
.trim > :last-child     { margin-bottom: 0; }

.screen-reader-text     { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; }

.text-left                      { text-align: left; }
.text-right                     { text-align: right; }
.text-center                    { text-align: center; }

.text-xxl                       { font-size: var(--text-xxl); }
.text-xl                        { font-size: var(--text-xl); }
.text-lg                        { font-size: var(--text-lg); }
.text-md                        { font-size: var(--text-md); }
.text-base                      { font-size: var(--text-base); }
.text-sm                        { font-size: var(--text-sm); }
.text-xs                        { font-size: var(--text-xs); }

.list-none                      { list-style: none; padding-left: 0; }

.justify-content-start          { justify-content: start; }
.justify-content-center         { justify-content: center; }
.justify-content-end            { justify-content: end; }

.justify-items-start            { justify-items: start; }
.justify-items-center           { justify-items: center; }
.justify-items-end              { justify-items: end; }

.align-items-center             { align-items: center; }
.align-items-end                { align-items: end; }
.align-items-start              { align-items: start; }

.max-narrow                     { max-width: var(--max-narrow); }
.max-content                    { max-width: var(--max-content); }
.max-wide                       { max-width: var(--max-wide); }

.mauto {
    margin-inline: auto;
}