@charset "utf-8";
/* CSS Document */
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video,input,select{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;color:unset}html{scroll-behavior:smooth}a{text-decoration:none;cursor:pointer}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}button{cursor:pointer;border:none;border-radius:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}img{max-width:100%;}
/*=== END RESET ===*/

/*=== CLEARFIX ===*/
.clear{clear:both}.cf:before,.cf:after{content:" ";display:table}.cf:after{clear:both}.cf{zoom:1}

/*=== GLOBAL ===*/
.flex-container{display:flex}.flex-vertical{flex-direction:column}.flex-horizontal{flex-direction:row}.flex-width{flex-grow:1;flex-shrink:1;flex-basis:100%}.flex-height{height:100%}.flex-wrap{flex-wrap:wrap}.set-width{flex-grow:0;flex-shrink:0;flex-basis:auto}.justify-center{justify-content:center}.justify-right{justify-content:flex-end}.justify-left{justify-content:flex-start}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.justify-evenly{justify-content:space-evenly}.align-center{align-items:center}.align-top{align-items:flex-start}.align-bottom{align-items:flex-end}.align-stretch{align-items:stretch}.align-all-center{align-items:center;justify-content:center}.align-self-center{align-self:center}.align-self-right{align-self:flex-end}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.mobile-only{display: none}.max-width{margin:0 var(--sm-padding)}.map{min-height:350px;line-height:0;}


*,
*::before,
*::after {
    transition: all 0.3s ease;
}
a:hover {cursor: pointer !important;}

/*=== SELECT STYLES ===*/
::selection, ::-moz-selection {
	background: var(--red);
	color: var(--white);
	text-shadow: none;
}

:root {
	/*=== Fonts ===*/
    --Libre: "Libre Baskerville", serif;

	/*=== Colors ===*/
	--black: #000000;
	--primary: #875923;
	--accent1: #B9A590;
	--accent2: #ECE4DA;
	--accent3: #F6F3EC;
    
    /*=== Font Sizes ===*/
    --p: clamp(16px, 5vw, 20px);

	/*=== Spacing ===*/
	--lg-padding: clamp(75px, 5vw, 100px);
	--sm-padding: clamp(25px, 2.5%, 2.5%);
}

    .black{color: var(--black)}
    .primary{color: var(--primary)}
    .accent1{color: var(--accent1)}
    .accent2{color: var(--accent2)}
    .accent3{color: var(--accent3)}

    .bg-black{background: var(--black)}
    .bg-primary{background: var(--primary)}
    .bg-accent1{background: var(--accent1)}
    .bg-accent2{background: var(--accent2)}
    .bg-accent3{background: var(--accent3)}


body {
    position: relative;
    overflow-x: hidden;
	font-family: var(--Libre), sans-serif !important;
	height: auto !important;
    background-color: var(--accent3);
    background-image:
        url("/siteart/logo-background.svg");
}

.page-shadow {
	max-width: 1920px!important;
    width: 100%!important;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 20px 0px!important;
    background-color: rgb(255, 255, 255)!important;
    margin: 0 auto!important;
	overflow-x: hidden;
}

p {
    font-size: clamp(16px, 5vw, 18px);
    line-height: 200%;
}

.thick {
    font-weight: 900 !important;
}
.ital {font-style: italic !important;}

.center {text-align: center;}

.xxl-heading, .xl-heading, .lg-heading, .md-heading, .sm-heading {
	font-family: var(--Libre);
	text-transform: uppercase;
}

.xl-heading-bold {
	font-family: var(--Libre);
	text-transform: uppercase;
    font-weight: 900 !important;
}


.xs-heading {
	font-family: var(--Libre);
	text-transform: uppercase;
    font-weight: 700;
	padding-top: 5px;
    letter-spacing: 50%;
    margin-bottom: 10px;
}
.xxl-heading {font-size: clamp(36px, 5vw, 96px);line-height: clamp(36px, 5vw, 96px);}
.xl-heading {font-size: clamp(36px, 5vw, 64px);line-height: clamp(36px, 5vw, 64px);}
.lg-heading {font-size: clamp(34px, 5vw, 42px);line-height: clamp(34px, 5vw, 42px);}
.md-heading {font-size: clamp(27px, 5vw, 35px);line-height: clamp(27px, 5vw, 35px);}
.sm-heading {font-size: clamp(18px, 5vw, 26px);line-height: clamp(18px, 5vw, 26px);}
.xs-heading {font-size: clamp(16px, 5vw, 18px);line-height: clamp(16px, 5vw, 18px);}

.sm-padding {padding: 20px 0;}
.md-padding {padding: 50px 0;}
.lg-padding {padding: 100px 0;}

.width90 {width: 90%; max-width: 1600px; margin: auto;}
.width975 {width: 97.5%; max-width: none; margin: auto;}

.round20 {border-radius: 20px; overflow: hidden;}

/*=== BODY STYLES 
============================================*/
.btn-primary {display: block; padding: 10px 25px; border-radius: 1000px; background: radial-gradient(circle at 0% 50%, var(--primary) 0%, var(--primary) 40%, var(--accent3) 70%); background-size: 300% 100%; background-position: left center; transition: .7s ease all; border: 1px solid var(--primary); color: var(--accent3); max-width: 220px; text-align: center; font-family: var(--Libre);}
.btn-primary:hover { background-position: right center; color: var(--black);}

.btn-secondary {display: block; padding: 10px 25px; border-radius: 1000px; background: radial-gradient(circle at 0% 50%, var(--accent3) 0%, var(--accent3) 40%, var(--primary) 70%); background-size: 300% 100%; background-position: left center; transition: .7s ease all; border: 1px solid var(--primary); color: var(--black); max-width: 220px; text-align: center; font-family: var(--Libre);}
.btn-secondary:hover {background-position: right center; color: var(--accent3);}

/*=== HEADER STYLES
==============================*/
.mobile-menu-callout {display: none; margin-top: 50px;}
.mobile-menu-callout a > div {display: flex;flex-direction: column; border-radius: 10px; border: 1px solid var(--primary); width: calc(100% - 20px); margin: auto; overflow: hidden;}
.mobile-menu-callout a > div > span {padding: 10px 10px 0 10px;}
.mobile-menu-callout a > div > .btn-primary {margin: 10px auto;}
.mobile-menu-callout a > div > .xs-heading {font-size: 14px !important; letter-spacing: 10% !important; color: var(--primary);}

.header-wrap {position: sticky; top: 0; z-index: 90; width: 100%;}
.header-color-wrap { background: var(--accent3);}
.header { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap;}
.header-right {display: flex; justify-content: flex-end; align-items: center; margin-left: auto; gap: 5px;}
.last-link {background: var(--primary); color: var(--accent3) !important; border-radius: 1000px;}
a:has(.header-logo) { flex: 1 0 0;}
.header-logo {width: auto; height: 100%; max-height: 80px; min-width: 0px; object-fit: contain;}

.viewport-mask-left {position: relative; top: 0; left: 0; width: calc(1.25vw + 20px); height: 20px; background: linear-gradient(to top, transparent, var(--accent3) 50%); z-index: 90; pointer-events: none; mask: radial-gradient(circle at right bottom, transparent 20px, black 21px);}
.viewport-mask-right {position: relative; top: 0; right: 0; width: calc(1.25vw + 20px); height: 20px; background: linear-gradient(to top, transparent, var(--accent3) 50%); z-index: 90; pointer-events: none; mask: radial-gradient(circle at left bottom, transparent 20px, black 21px);}

/*=== FOOTER STYLES
==============================*/
.footer-wrap {background: linear-gradient(to top, rgba(0,0,0,0.5) 300px, rgba(0,0,0,1) 500px), url("/siteart/aragon-logo-white.png"), url("/siteart/aragon-1.jpg"); background-size: cover; background-position: center center; padding: 50px 0 300px 0;}
.footer-wrap > div {display: flex; justify-content: space-between; align-items: flex-start; gap: 50px; flex-wrap: wrap;}
.footer-wrap > div > * {flex: 1 0 0;}
.footer-wrap .footer-logo {margin-right: 10vw; min-width: 200px;}
.footer-wrap div ul {margin-bottom: 20px; color: var(--accent3);}
.footer-wrap div ul li {margin-top: 10px; display: block;}
.footer-wrap div ul li a:not(.btn-primary)::after {content: ''; display: flex; width: 0px; max-width: 100px; height: 1px; background: var(--primary); transform: translateX(5px);}
.footer-wrap div ul li a:not(.btn-primary):hover {transform: translateX(-5px);}
.footer-wrap div ul li a:not(.btn-primary):hover i {color: var(--primary);}
.footer-wrap div ul li a:hover::after {width: 100%;}

/*=== HOME PAGE 
==============================*/
/*OLD VERSION*/
/*
.home-hero {position: relative; background: linear-gradient(rgba(0,0,0,0.5)), url("../siteart/Aragon-main-hero.webp"); background-position: center center; background-size: cover; min-height: calc(100vh - 200px); overflow: hidden !important;}
.home-hero-content {position: relative; z-index: 2; display: flex; flex-direction: column; height: 100%; justify-content: center; gap: 50px; color: var(--accent3);}
.home-hero-content h1 {max-width: 1000px;}
.home-hero-content hr {height: 2px; width: 100%; background: var(--accent3); max-width: 500px; margin: 0 !important;}
.home-hero-content p {max-width: 500px;}
.hero-badge {position: absolute; z-index: 1; bottom: 0; right: 0; height: auto; width: clamp(300px, 40vw, 100%); opacity: 0.15; transform: translateY(50%) rotate(-20deg);}
*/

.home-hero {position: relative; min-height: calc(100vh - 200px); overflow: hidden !important; display: flex; align-items: center;}
.hero-video {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0;}
.hero-overlay {position: absolute; inset: 0; background: rgba(0,0,0,0.5); z-index: 1;}
.home-hero-content {position: relative; z-index: 3; display: flex; flex-direction: column; height: 100%; justify-content: center; gap: 20px; color: var(--accent3); background: linear-gradient(rgba(0,0,0,0));}
.home-hero-content h1 {max-width: 1000px;}
.home-hero-content hr {height: 2px; width: 100%; background: var(--accent3); max-width: 500px; margin: 0 !important;}
.home-hero-content p {max-width: 500px;}
.hero-badge {position: absolute; z-index: 2; bottom: 0; right: 0; height: auto; width: clamp(300px, 40vw, 100%); opacity: 0.15; transform: translateY(40%) rotate(-20deg);}

section:has(.thin-banner) {margin: 20px 0;}
.thin-banner {display: flex; justify-content: center; align-items: center; gap: 20px; flex-wrap: wrap; padding: 20px 0; text-align: center; background: linear-gradient(rgba(0,0,0,0));}

/* CARDS */

.card-container{
    --gap: 5px;
    --active-ratio: 0.6;
    --desc-max-height: 200px;
}

.card-container{display: flex; gap: var(--gap);}

.card-container .card{flex: 0 0 calc((100% - ((var(--count) - 1) * var(--gap))) * (1 - var(--active-ratio)) / (var(--count) - 1)); background: #000; position: relative; height: 500px; font-size: 14px; text-align: left; line-height: 1.5; color: #fff; border-radius: 10px; overflow: hidden; cursor: pointer; transition: transform .25s ease, flex-basis .5s ease; will-change: flex-basis, transform; box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.05);}
.card-container .card:before{content: ""; position: absolute; inset: 0; background: linear-gradient(180deg,rgba(0, 0, 0, 0) 0%,rgba(0, 0, 0, 0.25) 50%,rgba(0, 0, 0, 1) 100%); opacity: 1; transition: opacity .25s ease; z-index: 9;}
.card-container .card:after{position: absolute; top: 8px; right: 8px; font-family: "Font Awesome 6 Free"; font-size: 20px; font-weight: 900; line-height: 1; text-shadow: 0px 0px 20px rgba(0,0,0,0.25); content: "\f055"; z-index: 999;}
.card-container .card img{position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform .25s ease; transform: translateZ(0); will-change: transform; z-index: 0;}
.card-container .card:hover img{transform: scale(1.03);}

.card-container .card .card-content{position: absolute; left: 0; right: 0; bottom: 0; display: grid; grid-template-rows: auto 0fr; gap: 3px; align-content: end; transition: grid-template-rows .25s ease; padding: 15px; z-index: 9;}
.card-container .card .card-content h3{display: block; transition: transform .2s ease; color: #fff;}
.card-container .card .card-content .card-details{max-height: 0; opacity: 0; overflow: hidden; transition: opacity 1s ease, max-height 1s ease; max-width: 500px;}
.card-container .card .card-content .card-details ul{display: flex; flex-wrap: wrap; margin-top: -2px; font-weight: 600; font-style: italic;}
.card-container .card .card-content .card-details ul li:after{position: relative; top: -3px; font-family: "Font Awesome 6 Free"; font-size: 4px; font-weight: 900; content: "\f111"; padding: 0 8px;}
.card-container .card .card-content .card-details ul li:last-child:after{content: ""; padding: 0;}
.card-container .card .card-content .card-details p {margin: 10px 0; line-height: 120%;}
.card-container .card .card-content .card-details p a{margin-left: 3px; white-space: nowrap; font-weight: 700; text-decoration: underline;}
.card-container .card .card-content .card-details p a:hover{text-decoration: none;}

.card-container .card:not(.active):hover:before{opacity: .5;}
.card-container .card:not(.active):hover .card-content strong{transform: translateY(-2px);}

.card-container .card.active{flex-basis: calc((100% - ((var(--count) - 1) * var(--gap))) * var(--active-ratio)); cursor: default;}
.card-container .card.active:after{display: none;}
.card-container .card.active img{transform: scale(1.02);}
.card-container .card.active .card-content{grid-template-rows: auto 1fr;}
.card-container .card.active .card-content .card-details{max-height: none; opacity: 1;}

@media screen and (max-width: 768px){
    .card-container{flex-wrap: wrap;}
    .card-container .card{flex: none; width: 100%; height: 75px; transition: height .5s ease; will-change: height;}
    .card-container .card:before{background: linear-gradient(180deg,rgba(0, 0, 0, 0.35) 0%,rgba(0, 0, 0, 0.65) 50%,rgba(0, 0, 0, 0.85) 100%);}
    .card-container .card.active{flex: none; width: 100%; height: 350px;}
    .card-container .card.active:before{background: linear-gradient(180deg,rgba(0, 0, 0, 0.65) 0%,rgba(0, 0, 0, 0.65) 50%,rgba(0, 0, 0, 0.85) 100%);}
}

.half-photo-right {display: flex; justify-content: space-between; align-items: stretch; gap: 50px;}
.half-photo-right .half-photo-text {flex: 1 1 0; display: flex; flex-direction: column; justify-content: center; align-items: stretch; padding: 20px 5%;}
.half-photo-right .half-photo-img {flex: 2 1 0; display: flex; align-items: stretch; height: auto; overflow: hidden; border-radius: 20px 0 0 20px;}
.half-photo-right .half-photo-img img {display: block; height: auto; object-fit: cover; width: 100%;}

.half-photo-left {display: flex; justify-content: space-between; align-items: stretch; gap: 50px;}
.half-photo-left .half-photo-text {flex: 1 1 0; display: flex; flex-direction: column; justify-content: center; align-items: stretch; padding: 20px 5%;}
.half-photo-left .half-photo-img {flex: 2 1 0; display: flex; align-items: stretch; height: auto; overflow: hidden; border-radius: 0 20px 20px 0;}
.half-photo-right .half-photo-img img {display: block; height: auto; object-fit: cover; width: 100%;}

.half-grid {position: relative; display: flex; justify-content: space-between; gap: 0;}
.half-grid > .space-holder {flex: 1 1 0; padding-left: calc(10% + 0px);}
.half-grid > .grid-square-wrapper {flex: 2 1 0; position: relative; z-index: 2;}
.half-grid .grid-square-wrapper {display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px;}
.text-square {border-radius: 0px; padding-bottom: 50px;}
.grid-square{height: auto; width: 100%; border-radius: 20px; overflow: hidden; background-size: cover !important; background-position: center center !important; padding-top: 200px;}
.grid-square > div {display: flex; flex-direction: column; height: 100%; width: 100%; justify-content: flex-end; padding: 20px 5%; background: linear-gradient(to top, rgba(0,0,0,0.75) 30%, rgba(0,0,0,0)); color: var(--accent3);}
.half-grid-badge {position: absolute; left: 0; bottom: 50%; height: 80%; transform:translate(calc(-150% + 40vw), 50%) rotate(-20deg); opacity: 0.15; z-index: 1;}
.grid-square:not(.text-square):hover {transform: rotate(-2deg) scale(1.025);}

.promo-banner {margin: 20px auto;}
.promo-banner > div {display: flex; justify-content: space-between; align-items: stretch; gap: 50px;}
.promo-banner > div > div {flex: 1 1 0 ;display: flex; flex-direction: column; height; 100%; justify-content: center;}
.promo-banner-img img {display: block; height: 100%; width: auto; object-fit: cover;}
.promo-banner-text {padding: 50px 5%;}
.promo-banner-text > h1,
.promo-banner-text > h2,
.promo-banner-text > h3,
.promo-banner-text > p {max-width: 500px;}

#toast-booking-widget.toast-button .toast-booking-widget {padding: 0 !important; border-radius: 1000px; max-width: none; background: transparent; width: auto;}
#toast-booking-widget.toast-button .toast-booking-widget > *:not(button) {display: none !important;}
#toast-booking-widget.toast-button .toast-booking-widget > button {display: block; padding: 10px 25px; border-radius: 1000px; background: radial-gradient(circle at 0% 50%, var(--primary) 0%, var(--primary) 40%, var(--accent3) 70%); background-size: 300% 100%; background-position: left center; transition: .7s ease all; border: 1px solid var(--primary); color: var(--accent3); max-width: 220px; text-align: center; font-family: var(--Libre) !important;}
#toast-booking-widget.toast-button .toast-booking-widget > button svg {display: none !important;}
#toast-booking-widget.toast-button .toast-booking-widget > button:hover {background-position: right center; color: var(--black);}

/*=== ABOUT PAGE
==============================*/
.subpage-hero {background-position: center center !important; background-size: cover !important; padding: 100px 0;}
.subpage-hero.about {background: linear-gradient(rgba(0,0,0,0.5)), url("../siteart/aragon-sign-indoors.webp");}

/*=== PRIVATE DINING PAGE
==============================*/
.subpage-hero.private-dining {background: linear-gradient(rgba(0,0,0,0.5)), url("../siteart/private-dining-executive.jpg");}

/*=== MENU PAGE
==============================*/
.subpage-hero.menu {background: linear-gradient(rgba(0,0,0,0.5)), url("../siteart/1U2A1353.jpg");}

.menu-columns {column-count: 2; column-gap: 2.5vw;}
.menu-section:not(:first-of-type) {margin-top: 50px;}
.menu-section {break-inside: avoid;}
.menu-section > h3 {position: relative; margin-bottom: 20px;}
.menu-section > h3::after {content: ''; display: flex; position: relative; bottom: -10px; height: 1px; width: 100%; background: var(--primary);}
.menu-item {position: relative; margin: 20px 0 10px;}
.menu-item::after {content: ''; display: flex; position: relative; bottom: -5px; height: 1px; width: 100%; background: var(--accent2);}
.menu-item h4 {text-transform: uppercase; font-weight: 700; letter-spacing: 10%;}
.menu-item p {font-style: italic;}
.menu-item span {font-weight: 900;}
.disclaimers {font-style: italic; padding: 20px 2.5vw; border-radius: 20px; border: 1px solid var(--accent2); background: var(--accent2);}
.disclaimers p {font-size: 14px !important; }

.lightbox-col a {position: relative;}
.lightbox-col a::after {display: none; content: 'view'; position: absolute; width: 100%; height: 100%; background: rgba(0,0,0,0.25); justify-content: center; align-items: center; text-align: center; color: var(--white); font-size: 24px; font-family: var(--Mont); text-transform: uppercase;}
.lightbox-col a:hover::after{display: flex;}

.menuSwiper {position: relative; padding-top: 40px;}
.menuSwiperButtons {position: absolute; top: 40px; width: 100%;}
.menuSwiperButtons .swiper-button-prev,
.menuSwiperButtons .swiper-button-next {color: var(--primary); height: 20px;}
.menuSwiper .swiper-pagination {bottom: 0;}

/*=== PRIVATE DINING SUBPAGES
==============================*/
.private-subpage-hero {background-position: center center !important; background-size: cover !important; padding: 100px 0; min-height: calc(100vh - 200px);}
.private-subpage-hero p {max-width: 700px;}
.private-subpage-hero .quickstats {display: flex; align-items: center; gap: 30px; font-style: italic;}
.private-subpage-hero .quickstats li {position: relative;}
.private-subpage-hero .quickstats li:not(:first-of-type)::before {position: absolute; content: '•'; display: flex; align-items: center; height: 100%; left: -20px; font-size: 12px;}

.private-subpage-hero.tavern-takeover {background: linear-gradient(to bottom, rgba(0,0,0,0.75) 50%, rgba(0,0,0,0)), url("../siteart/Aragon-main-hero.webp");}
.private-subpage-hero.encore {background: linear-gradient(to bottom, rgba(0,0,0,0.75) 50%, rgba(0,0,0,0)), url("../siteart/spaces/Encore/encore-room.jpg");}
.private-subpage-hero.club1890 {background: linear-gradient(to bottom, rgba(0,0,0,0.75) 50%, rgba(0,0,0,0)), url("../siteart/spaces/1890/1U2A1270.jpg");}
.private-subpage-hero.vesper {background: linear-gradient(to bottom, rgba(0,0,0,0.75) 50%, rgba(0,0,0,0)), url("../siteart/amaro-and-oak-interior-edited-moody.jpg");}

.breadcrumbs {background: var(--accent2); margin-bottom: 10px;}
.breadcrumbs a {color: var(--primary); text-decoration: underline;}
.breadcrumbs i {font-size: 12px; padding: 0 10px;}

.gallerySwiper {position: relative; padding-top: 40px;}
.gallerySwiperButtons {position: absolute; top: 40px; width: 100%;}
.gallerySwiperButtons .swiper-button-prev,
.gallerySwiperButtons .swiper-button-next {color: var(--primary); height: 20px;}
.gallerySwiper .swiper-pagination {bottom: 0; transform: translateY(100%); z-index: 99;}

#iframeOverlay {position: fixed; inset: 0; background: rgba(0,0,0,.35); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); display: flex; justify-content: center; align-items: center; opacity: 0; visibility: hidden; transition: .3s ease; z-index: 99999;}
#iframeOverlay.active {opacity: 1; visibility: visible;}
.iframeModal {position: relative; width: min(1400px, 90vw); height: min(900px, 90vh); background: #fff; border-radius: 20px; overflow: hidden; box-shadow: 0 25px 80px rgba(0,0,0,.35);}
#popupIframe {width: 100%; height: 100%; border: 0; display: block; padding: 50px 20px;}
.closeIframe {position: absolute; top: 15px; right: 15px; width: 40px; height: 40px; border: 0; border-radius: 50%; background: rgba(0,0,0,.65); color: #fff; cursor: pointer; z-index: 10; display: flex; align-items: center; justify-content: center; font-size: 18px; transition: .2s ease;}
.closeIframe:hover {background: rgba(0,0,0,.85);}
body.iframe-open {overflow: hidden;}



/*=== MEDIA BREAKS
==============================*/
@media screen and (max-width: 1200px) {
    .half-grid > .space-holder {width: 0px; padding-left: 0px; flex: 0 0 0 ;}
    .half-grid .half-grid-badge {opacity: 0.05;}
}
@media screen and (max-width: 1000px) {
    .mobile-menu-callout {display: flex;}
    
    .half-photo-right,
    .half-photo-left {flex-direction: column;}
    .half-photo-right .half-photo-img {margin-left: 5%;}
    .half-photo-left .half-photo-img {margin-right: 5%;}
    .half-photo-text {order: 1 !important;}
    .half-photo-img {min-height: 300px; order: 2 !important;}
    
    .menu-columns {column-count: 1;}
}

@media screen and (max-width: 800px) {
    .promo-banner > div {flex-direction: column;}
    
    .private-subpage-hero .quickstats {flex-direction: column; align-items: flex-start; gap: 15px;}
    .private-subpage-hero .quickstats li:not(:first-of-type)::before {display: none;}
}

@media screen and (max-width: 600px) {
    .half-grid .grid-square-wrapper {grid-template-columns: repeat(1, 1fr);}
}














