







/* 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;
}

