/* Disable MRP scroll/fade effects on full-HTML pages
   Pages: first-time-buyers.html, buying.html,
          downsizing-rightsizing.html, move-up-growing-families.html
*/

/* MAIN CONTAINER: stop fade/slide on these pages */
body.first-time-buyers .block-layout .fx.slide-in-up,
body.first-time-buyers .block-layout .fx.fade-in,
body.first-time-buyers .block-layout .fx.slide-in-up.fade-in,

body.buying .block-layout .fx.slide-in-up,
body.buying .block-layout .fx.fade-in,
body.buying .block-layout .fx.slide-in-up.fade-in,

body.downsizing-rightsizing .block-layout .fx.slide-in-up,
body.downsizing-rightsizing .block-layout .fx.fade-in,
body.downsizing-rightsizing .block-layout .fx.slide-in-up.fade-in,

body.move-up-growing-families .block-layout .fx.slide-in-up,
body.move-up-growing-families .block-layout .fx.fade-in,
body.move-up-growing-families .block-layout .fx.slide-in-up.fade-in
 {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  animation: none !important;
  transition: none !important;
}

/* CHILDREN: make sure nothing inside gets hidden either */
body.first-time-buyers .block-layout .fx.slide-in-up.fade-in *,
body.buying .block-layout .fx.slide-in-up.fade-in *,
body.downsizing-rightsizing .block-layout .fx.slide-in-up.fade-in *,
body.move-up-growing-families .block-layout .fx.slide-in-up.fade-in * {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  animation: none !important;
  transition: none !important;
}
/* Soft, predictable fade/slide for custom pages only */
body.first-time-buyers .ftb-full-page .soft-fade,
body.buying .buying-hub-page .soft-fade,
body.downsizing-rightsizing .soft-fade,
body.move-up-growing-families .soft-fade {
  opacity: 0;
  transform: translateY(10px);
  animation: softFadeIn 0.45s ease-out forwards;
}

/* optional stagger using data-delay="0.1", "0.2", etc. */
body.first-time-buyers .soft-fade,
body.buying .soft-fade,
body.downsizing-rightsizing .soft-fade,
body.move-up-growing-families .soft-fade {
  animation-delay: var(--delay, 0s);
}


@keyframes softFadeIn {
  to {
    opacity: 1;
    transform: none;
  }
} 
/* CORE muni cards: make each card visually distinct */
#bid_2847891 .content-container {
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(0,0,0,0.06);
}

/* Give the text area breathing room */
#bid_2847891 .content {
  padding: 18px 18px 14px;
}

/* Make sure images sit cleanly */
#bid_2847891 .image-container img {
  display: block;
  width: 100%;
  height: auto;
}

/* Optional: clearer tap feedback on mobile */
#bid_2847891 .content-container:active {
  transform: scale(0.99);
  filter: brightness(0.97);
} 
/* CORE muni cards: desktop alignment (image frame + consistent baselines) */
@media (min-width: 992px) {

  /* Make every card the same height */
  #bid_2847891 .content-container {
    display: flex;
    flex-direction: column;
    height: 100%;
  }

  /* Force a consistent image "frame" height */
  #bid_2847891 .image-container {
    aspect-ratio: 16 / 9;       /* tweak if you want taller: 4/3 */
    overflow: hidden;
    flex: 0 0 auto;
  }

  #bid_2847891 .image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;          /* crops to match frame */
    display: block;
  }

  /* Make the text area fill remaining space */
  #bid_2847891 .content {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
  }

  /* Push the button row to the bottom so all buttons align */
  #bid_2847891 .content .btn,
  #bid_2847891 .content a.btn,
  #bid_2847891 .content a.button {
    margin-top: auto;
    align-self: center;         /* optional: centre button */
  }
} 

/* HOMEPAGE top action cards (Search / Buyer Guide / Value Range) */
#bid_4036099 :is(.content-container, .card, .item, .grid-item){
  background:#fff;
  border:1px solid rgba(0,0,0,0.08);
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 10px 24px rgba(0,0,0,0.06);
}

#bid_4036099 :is(.image-container, .card-image, figure){
  aspect-ratio:16/9;
  overflow:hidden;
}
#bid_4036099 :is(.image-container img, .card-image img, figure img){
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

@media (min-width: 992px){
  #bid_4036099 :is(.content-container, .card, .item, .grid-item){
    display:flex;
    flex-direction:column;
    height:100%;
  }
  #bid_4036099 :is(.content, .card-body, .item-content){
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    padding:18px 18px 14px;
  }
  #bid_4036099 :is(.content, .card-body, .item-content) :is(.btn, a.btn, a.button, button){
    margin-top:auto;
  }
}
/* Global font override – match the softer HTML tone */
body, button, input, select, textarea {
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0;
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif !important;
  font-weight: 700;
  line-height: 1.2;
  color: inherit;
}

/* Buttons – keep strength without shouting */
button, .btn, a.btn, a.button, input[type="submit"] {
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.02em;
} 
/* Fix: Greater Victoria hero (#bid_5112708) must stay white on dark bg */
#bid_5112708.inverted {
  color: #fff !important;
}

#bid_5112708.inverted :is(h1,h2,h3,h4,h5,h6,p,li,span,a) {
  color: #fff !important;
}

/* Optional: readability if the photo is busy */
#bid_5112708 .title,
#bid_5112708 .subtitle {
  text-shadow: 0 2px 10px rgba(0,0,0,0.45);
} 
/* ==========================================================
   SITE-WIDE: fix “image inset + rounded card = corner gaps”
   Applies to MRP media cards (not buttons)
   ========================================================== */

/* 1) Any MRP card/container that has media should not pad the media area */
#content-well .content-container.has-media {
  padding: 0 !important;
  overflow: hidden; /* ensures the card’s radius clips the image */
}

/* 2) Restore padding only to the text/content region (so you don’t lose spacing) */
#content-well .content-container.has-media > .content {
  padding: 18px 18px 14px !important; /* match your card standard */
}

/* 3) Ensure the media wrapper and image sit flush (no inner rounding/inset) */
#content-well .content-container.has-media :is(.image-container, figure, .card-image) {
  margin: 0 !important;
  border-radius: 0 !important;
}

#content-well .content-container.has-media :is(.image-container img, figure img, .card-image img) {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 0 !important;
  object-fit: cover;
} 
/* ===========================
   SITE-WIDE CARD ROUNDING FIX
   (no button styling)
   =========================== */

:root{
  --iv-card-radius: 14px; /* match your card look */
}

/* 1) "Boxes" style blocks (your region / hub cards etc.) */
.block-layout[class*="boxes-"] .block-column.has-bg,
.block-layout[class*="boxes-"] .block-column.has-bg-color,
.block-layout[class*="boxes-"] .block-column.has-bg-image{
  border-radius: var(--iv-card-radius) !important;
  overflow: hidden !important; /* key: clips squared overlays */
}

/* Make *all the inner layers* respect the same rounding */
.block-layout[class*="boxes-"] .block-column.has-bg::before,
.block-layout[class*="boxes-"] .block-column.has-bg::after,
.block-layout[class*="boxes-"] .block-column.has-bg :is(
  .with-smart-bg-outer,
  .with-smart-bg-inner,
  .bg,
  .content,
  .content-container,
  .bg-link
){
  border-radius: inherit !important;
}

/* 2) Generic "image + content" card pattern (MRP uses this a lot) */
.content-container.has-media.has-content{
  border-radius: var(--iv-card-radius) !important;
  overflow: hidden !important;
}

/* If MRP rounded the *image* instead of the *container*, it can create corner weirdness.
   Let the container do the clipping. */
.content-container.has-media.has-content > .image-container,
.content-container.has-media.has-content > .image-container img{
  border-radius: 0 !important;
}

/* Optional (only if your hover shadow is visibly square):
   force hover elevation onto the rounded wrapper */
.block-layout[class*="boxes-"] .block-column.has-bg:hover,
.content-container.has-media.has-content:hover{
  box-shadow: 0 10px 24px rgba(0,0,0,0.10) !important;
}

/* #bid_7402342 — Explore By Region tiles
   Goal: keep tile → hub, keep muni links → muni, reduce misclicks, make muni links usable on mobile (no hover)
*/

/* 1) Make muni links clearly “secondary” (smaller + cleaner) */
#bid_7402342 :is(ul, ol, [class*="muni"], [class*="sub"], [class*="child"], [class*="links"]) a{
  font-size: 0.95rem;
  line-height: 1.35;
  text-decoration: none;
  opacity: 0.92;
  display: inline-block;
  padding: 6px 10px;
  border-radius: 10px;
  touch-action: manipulation;
}

/* Hover/focus affordance */
#bid_7402342 :is(ul, ol, [class*="muni"], [class*="sub"], [class*="child"], [class*="links"]) a:hover,
#bid_7402342 :is(ul, ol, [class*="muni"], [class*="sub"], [class*="child"], [class*="links"]) a:focus-visible{
  opacity: 1;
  text-decoration: underline;
  outline: 2px solid rgba(64,134,185,0.55);
  outline-offset: 2px;
}

/* 2) Prevent “tile click overlay” from stealing muni clicks (raise z-index) */
#bid_7402342 :is(ul, ol, [class*="muni"], [class*="sub"], [class*="child"], [class*="links"]){
  position: relative;
  z-index: 10;
}

/* 3) Mobile: force the muni list visible (hover doesn’t exist on touch) */
@media (hover: none) and (pointer: coarse){
  #bid_7402342 :is(ul, ol, [class*="muni"], [class*="sub"], [class*="child"], [class*="links"]){
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    height: auto !important;
    max-height: none !important;
    pointer-events: auto !important;
  }
}

/* 4) Optional: slightly reduce “link-y” feel until interaction (keeps it quieter) */
#bid_7402342 :is(ul, ol, [class*="muni"], [class*="sub"], [class*="child"], [class*="links"]) a{
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
} 
/* ===== GV Map Cards: border + aligned CTAs (BID scoped) ===== */

/* 1) Make the 3 cards equal-height */
#bid_7253080 .block-row {
  align-items: stretch !important;
}

#bid_7253080 [data-list-item^="boxes["]{
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
}

/* 2) Give the media area a consistent height + add the silver border */
#bid_7253080 [data-list-item^="boxes["] .content-container.has-media{
  border: 1px solid rgba(192,192,192,0.9) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
}

/* If your “image” is actually a background (common in boxes layouts), make it behave */
#bid_7253080 [data-list-item^="boxes["].has-bg-image{
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  /* optional: gives the image area a consistent feel */
  background-color: rgba(64,134,185,0.10) !important;
}

/* 3) Pin the last button to the bottom of each card */
#bid_7253080 [data-list-item^="boxes["] .btn,
#bid_7253080 [data-list-item^="boxes["] a.btn,
#bid_7253080 [data-list-item^="boxes["] [class*="btn"]{
  margin-top: auto !important;
}

/* 4) Normalize spacing so one card doesn't “grow” from random margins */
#bid_7253080 [data-list-item^="boxes["] p{
  margin-bottom: 10px !important;
}