@charset "utf-8";
/* CSS Document */

.modal-footer{display: none;}
/* Hero overlay text (hidden on mobile via d-none d-md-block in markup) */

/* Fullscreen cap */
.rev_slider_wrapper, .rev_slider, .fullscreenbanner { max-height: 90vh; overflow: hidden; }

/* Big icon stats */
.spec-stats i { font-size: clamp(25px, 6vw, 25px); color:#002d62; line-height:1; }
.spec-stats .value { font-weight:800; font-size: 20pt; color:#002d62; line-height:1.1; margin-top:6px; }
.spec-stats .label { font-weight:600; color:#002d62; opacity:.9; font-size: 0.80rem; }

/* Description */
.spec-desc p { margin: 0 0 0.9rem 0; }

/* Floorplan thumbs */
.fp-thumb { cursor:pointer; border:2px solid transparent; border-radius:8px; overflow:hidden; }
.fp-thumb.active, .fp-thumb:hover { border-color:#002d62; }

/* Photogallery: grid + filter buttons */
#photogallery-border .pg-filter { margin: 0 0 16px; text-align:center; }
#photogallery-border .pg-filter .btn { margin: 0 6px 6px; }
#photogallery-border .photogallery-masonry {
display: grid;
grid-template-columns: 1fr;
gap: 12px;
}
@media (min-width: 576px){
#photogallery-border .photogallery-masonry { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 992px){
#photogallery-border .photogallery-masonry { grid-template-columns: repeat(3, 1fr); }
}
.photogallery-item { display:block; border:1px solid #ddd; border-radius:8px; overflow:hidden; cursor:pointer; }
.photogallery-item img { display:block; width:100%; height:auto; }

	
.photogallery-item.is-hidden { display: none !important; }
	
	
/* About gallery: keep your masonry columns */
.aboutgallery-masonry { column-count: 1; column-gap: 12px; }
@media (min-width: 576px){ .aboutgallery-masonry { column-count: 2; } }
@media (min-width: 992px){ .aboutgallery-masonry { column-count: 3; } }
.aboutgallery-item { margin: 0 0 12px; display: inline-block; width: 100%; border-radius:8px; overflow:hidden; cursor:pointer; border:1px solid #ddd; }
.aboutgallery-item img { width:100%; height:auto; display:block; }

/* About tab cards polish */
#about-border .card { border-radius: 10px; }
#about-border .card-body { padding: 16px 18px; }
	
	iframe.video-100 {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  border: 0;
}
 
	
	/* Gallery filter via container class */
#photogallery-border.filter-elev .photogallery-item[data-type="int"]  { display:none !important; }
#photogallery-border.filter-int  .photogallery-item[data-type="elev"] { display:none !important; }
/* Lightbox controls: side-centered arrows */
.lb-modal .modal-body{ position:relative; min-height:70vh; }
.lb-modal .lightbox-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:48px; height:48px; border-radius:50%;
  background:#000a; color:#fff; border:0;
  display:flex; align-items:center; justify-content:center;
  z-index:1056; cursor:pointer;
}
.lb-modal .lightbox-prev{ left:10px; }
.lb-modal .lightbox-next{ right:10px; }
.lb-modal .lightbox-nav:hover{ background:#000d; }
.lb-modal .btn-close{ z-index:1062; }
 


	
	/* Fix: modal video on mobile (Bootstrap .ratio + our .video-100) */
#aboutVideoModal .ratio { --bs-aspect-ratio: 56.25%; }               /* 16:9 */
#aboutVideoModal .ratio > * { position:absolute; inset:0; width:100%; height:100%; }
#aboutVideoModal .video-100 {
  width:100% !important;
  height:100% !important;     /* override height:auto */
  aspect-ratio:auto !important;
  margin:0 !important;
}
	
 
	
	/* Modal video sizing: keep a clean 16:9 and no extra blank space */
#aboutVideoModal .ratio { --bs-aspect-ratio:56.25%; }           /* 16:9 */
#aboutVideoModal .ratio > * { position:absolute; inset:0; width:100%; height:100%; }
#aboutVideoModal .video-100 { width:100%!important; height:100%!important; aspect-ratio:auto!important; margin:0!important; }

	
/* About media grid */
.media-tile{
  position:relative; display:block; width:100%;
  aspect-ratio:1/1; background-size:cover; background-position:center;
  border-radius:10px; overflow:hidden; border:1px solid #e3e3e3;
}
.media-tile::after{
  content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 60%, rgba(0,0,0,.25));
}
.media-tile .tile-badge{
  position:absolute; left:12px; top:12px;
  background:#fff; color:#002d62; font-weight:700; font-size:.9rem;
  padding:.3rem .5rem; border-radius:6px; z-index:1;
}
.media-tile .tile-play{
  position:absolute; left:12px; bottom:12px; z-index:1;
  background:#ffffff; color:#003366; font-weight:900; line-height:1;
  width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center;
   font-size:.9rem; box-shadow:0 2px 8px rgba(0,0,0,.2);
}
.media-tile .tile-count{
  position:absolute; right:12px; bottom:12px; z-index:1;
  background:#fff; color:#002d62; font-weight:700; font-size:.9rem;
  padding:.3rem .5rem; border-radius:6px;
}
 
/* Darken video tile and show a big play icon */
.media-tile.is-video::before{
  content:"";
  position:absolute; inset:0;
  background:#002d62;        /* navy */
  opacity:.75;               /* ~75% */
  z-index:1;
  pointer-events:none;
}
.media-tile .tile-play-icon{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  z-index:2; color:#fff; pointer-events:none;
  /* Big, responsive-ish size; ~40% of common tile sizes */
  font-size: clamp(30px, 12vw, 90px);
}
	
	/* Reuse the same dark overlay for Lot Map and the "+N" tile */
.media-tile.is-lotmap::before,
.media-tile.is-more::before{
  content:"";
  position:absolute; inset:0;
  background:#002d62;      /* navy */
  opacity:.75;             /* ~75% */
  z-index:1; pointer-events:none;
}

/* Center icon helper (for Lot Map + "+N") */
.media-tile .tile-center-icon{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  z-index:2; color:#fff; pointer-events:none;
  font-size:clamp(30px, 12vw, 90px); /* ~40% of tile */
}
	
	
	
	/* Darken the video tile & show big play icon */
.media-tile.is-video::before{
  content:""; position:absolute; inset:0;
  background:#002d62; opacity:.75; z-index:1; pointer-events:none;
}
.media-tile .tile-play-icon{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  z-index:2; pointer-events:none; color: #fff ;}
	
	.media-tile.is-video:hover .tile-play-icon {
  color: #fff;            /* brighter red on hover */
  transform: scale(1.04);
}
	
.media-tile .tile-play-icon svg{
  width:25%; height:25%;    /* ~40% of the tile */
}
	
 /* Address + price tag layout */
.address-price-wrap{
  display:flex;
  align-items:center;              /* <-- center against the two-line address */
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}

.address-price-wrap h2{
  margin:0;                        /* remove bottom gap that throws centering off */
  line-height:1.1;                 /* consistent line height */
}

.price-tag{
  background:#002d62; color:#fff;
  padding:12px 16px;
  border-radius:12px;
  font-weight:700;
  line-height:1.15;
  text-align:center;
  min-width:180px;
  margin-left:auto;                /* <-- push to far right */
  box-shadow:0 4px 14px rgba(0,0,0,.12);
}
.price-tag .was,
.price-tag .now{ font-size:1rem; letter-spacing:.2px; }
.price-tag .now{ font-size:1.25rem; font-weight:800 }
 
.price-tag .moneyicon{
  height:50px;  float: left;
}
	
.price-tag .was .num{ text-decoration:line-through; }

/* Mobile: drop below the address cleanly */
@media (max-width: 575.98px){
  .price-tag{ min-width:unset; width:100%; }
}

/* OPTIONAL: make the tag EXACTLY the same height as the address block */
.address-price-wrap.price-stretch{ align-items:stretch; }   /* match tallest item */
.address-price-wrap.price-stretch .price-tag{
  display:flex; flex-direction:column; justify-content:center; /* center contents inside the taller tag */
}


/* --- Photogallery: mobile carousel vs desktop grid --- */

/* --- Photogallery: mobile carousel vs desktop grid --- */
/* ≥ sm (tablet/desktop): show grid (default), hide the mobile carousels */
@media (min-width: 576px){
  #photogallery-border .pg-mobile{ display:none !important; }
}

/* < sm (phones): hide the grid; show exactly ONE carousel based on the filter */
@media (max-width: 575.98px){
  /* hide the desktop grid on phones */
  #photogallery-border .photogallery-masonry{ display:none !important; }

  /* both mobile carousels are hidden by default... */
  #photogallery-border .pg-mobile{ display:none !important; }

  /* ...then we show ONE based on the container filter class set by JS */
  #photogallery-border.filter-elev .pg-mobile-elev { display:block !important; }
  #photogallery-border.filter-int  .pg-mobile-int  { display:block !important; }
}

/* --- About tab: mobile actions + carousel vs desktop grid --- */

/* ≥ sm (tablet/desktop): keep the grid, hide the mobile layout */
@media (min-width: 576px){
  #about-mobile { display:none !important; }
}

/* < sm (phones): hide desktop grid; show mobile layout */
@media (max-width: 575.98px){
  #about-media-grid { display:none !important; }
  #about-mobile     { display:block !important; }
}

/* Pretty blue action buttons for mobile */
.btn-fth {
  background:#002d62; color:#fff; border:0; font-weight:700;
  padding:.7rem 1rem; border-radius:.5rem;
}
.btn-fth:hover, .btn-fth:focus { background:#083b7f; color:#fff; }