@font-face  {
  font-family: "Poppins Fallback";
  src: local("Arial");
  ascent-override: 105%;
  descent-override: 35%;
  line-gap-override: 10%;
}

:root  {
  /* Colours: neutral greys with one muted navy accent */ --c-text: #1F2933;
  /* main body text */ --c-muted: #52606D;
  /* secondary / label text */ --c-border: #CBD2D9;
  /* box borders */ --c-page: #F5F7FA;
  /* page background */ --c-card: #FFFFFF;
  /* box background */ --c-slot: #EEF1F4;
  /* image placeholder tint */ --c-accent: #2F4B6E;
  /* accent: icons, rule, buttons */ --c-on-accent: #FFFFFF;
  /* text on the accent colour */ --c-forsale: #C80000;
  /* For Sale button (6:1 contrast) */ --c-forsale-dk: #A00000;
  /* For Sale button, hover */ /* Links */ --c-link: #798AA4;
  /* link colour (all states) */ --c-link-hover: #00AFC9;
  /* link colour on hover / press */ /* Shape */ --radius: 14px;
  /* main boxes */ --radius-sm: 10px;
  /* images, buttons, inner boxes */ /* Typography */ --font: Poppins, "Poppins Fallback", system-ui, sans-serif;
  /* Layout */ --wrap: 1080px;
  /* maximum content width */ --gap: 20px;
  /* gap between boxes */ --header-h: 64px;
  /* sticky header height */ /* Motion */ --ease: 0.2s ease;
}

*, *::before, *::after  {
  box-sizing: border-box;
}

html  {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body  {
  margin: 0;
  font-family: var(--font);
  font-size: 15px;
  line-height: 1.65;
  color: var(--c-text);
  background: var(--c-page);
}

h1, h2, h3  {
  margin: 0 0 10px 0;
  line-height: 1.25;
  color: var(--c-text);
}

h1  {
  font-size: 2.4rem;
  font-weight: 700;
}

h2  {
  font-size: 1.3rem;
  font-weight: 600;
}

h3  {
  font-size: 1.15rem;
  font-weight: 600;
}

p  {
  margin: 0 0 10px 0;
}

ul  {
  margin: 0;
  padding-left: 20px;
}

li  {
  margin-bottom: 4px;
}

img  {
  display: block;
  max-width: 100%;
  height: auto;
}

figure  {
  margin: 0;
}

.card, .card-inner, .specs  {
  overflow-wrap: anywhere;
}

.nowrap  {
  white-space: nowrap;
}

a  {
  color: var(--c-link);
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: color var(--ease);
}

a:visited  {
  color: var(--c-link);
}

a:hover  {
  color: var(--c-link-hover);
  text-decoration: none;
}

a:active  {
  color: var(--c-link-hover);
  opacity: 0.85;
}

a:focus  {
  text-decoration: none;
}

a:focus-visible  {
  outline: 3px solid var(--c-accent);
  outline-offset: 3px;
  border-radius: 4px;
}

main a:not(.btn)  {
  position: relative;
  display: inline-block;
  max-width: 100%;
}

main a:not(.btn)::after  {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 2px;
  background: currentColor;
  border-radius: 2px;
  transition: width 0.25s ease;
}

main a:not(.btn):hover::after, main a:not(.btn):focus-visible::after  {
  width: 100%;
}

main a[target="_blank"]:not(.btn)::before  {
  content: "\2197";
  content: "\2197" / "";
  display: inline-block;
  margin-right: 0.25em;
  font-size: 0.85em;
  transition: transform var(--ease);
}

main a[target="_blank"]:not(.btn):hover::before, main a[target="_blank"]:not(.btn):focus-visible::before  {
  transform: translate(2px, -2px);
}

.btn  {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  padding: 0 22px;
  font-family: inherit;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  border: 2px solid var(--c-accent);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background-color var(--ease), color var(--ease), border-color var(--ease), transform var(--ease);
}

.btn::before, .btn::after  {
  content: none;
  display: none;
}

.btn:hover, .btn:focus, .btn:visited  {
  text-decoration: none;
}

.btn:active  {
  transform: translateY(0);
  opacity: 1;
}

.btn svg  {
  flex: none;
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.btn-primary, .btn-primary:visited  {
  color: var(--c-on-accent);
  background: var(--c-accent);
}

.btn-primary:hover  {
  color: var(--c-on-accent);
  background: var(--c-link-hover);
  border-color: var(--c-link-hover);
  transform: translateY(-1px);
}

.btn-outline, .btn-outline:visited  {
  color: var(--c-accent);
  background: var(--c-card);
}

.btn-outline:hover  {
  color: var(--c-on-accent);
  background: var(--c-accent);
  transform: translateY(-1px);
}

.btn-sm  {
  min-height: 40px;
  padding: 0 16px;
  font-size: 0.85rem;
}

.visually-hidden  {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link  {
  position: absolute;
  left: 12px;
  top: -60px;
  z-index: 30;
  padding: 8px 16px;
  color: var(--c-on-accent);
  background: var(--c-accent);
  border-radius: var(--radius-sm);
}

.skip-link:visited, .skip-link:hover  {
  color: var(--c-on-accent);
}

.skip-link:focus  {
  top: 12px;
}

.wrap  {
  max-width: var(--wrap);
  margin: 0 auto;
  padding-right: 24px;
  padding-left: 24px;
}

.section  {
  padding-top: var(--gap);
}

.section[id]  {
  scroll-margin-top: calc(var(--header-h) + 16px);
}

.defer  {
  content-visibility: auto;
  contain-intrinsic-size: auto 700px;
}

@media (prefers-reduced-motion: no-preference)  {
  html  {
    scroll-behavior: smooth;
  }

}

.site-header  {
  position: sticky;
  top: 0;
  z-index: 15;
  background: var(--c-card);
  border-bottom: 1px solid var(--c-border);
}

.header-inner  {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: var(--header-h);
  padding-top: 8px;
  padding-bottom: 8px;
}

.site-address  {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.35;
}

.badge, .badge:visited  {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  margin: 0;
  padding: 0 16px 0 18px;
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 2px;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--c-on-accent);
  background: var(--c-forsale);
  border-radius: 999px;
  transition: background-color var(--ease);
}

.badge:hover  {
  color: var(--c-on-accent);
  background: var(--c-forsale-dk);
}

.badge:focus-visible  {
  outline: 3px solid var(--c-forsale);
  outline-offset: 3px;
  border-radius: 999px;
}

.card  {
  min-width: 0;
  padding: 22px;
  background: var(--c-card);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
}

.card-inner  {
  min-width: 0;
  padding: 16px;
  background: var(--c-card);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
}

.card-inner p:last-child  {
  margin-bottom: 0;
}

.label  {
  margin: 0 0 4px 0;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--c-accent);
}

.hero  {
  padding-top: 36px;
}

.lead  {
  font-size: 1.05rem;
  color: var(--c-muted);
}

.hero-actions  {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 16px;
}

.chip  {
  display: inline-flex;
  align-items: center;
  min-height: 46px;
  margin: 0;
  padding: 0 18px;
  font-weight: 700;
  color: var(--c-text);
  background: var(--c-card);
  border: 2px solid var(--c-border);
  border-radius: var(--radius-sm);
}

.hero-photo  {
  margin-top: 18px;
}

.hero-photo img  {
  width: 100%;
  aspect-ratio: 1600 / 700;
  object-fit: cover;
  background: var(--c-slot);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
}

.gallery  {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 14px;
  margin: 14px 0 0 0;
  padding: 0;
  list-style: none;
}

.gallery li  {
  margin: 0;
}

.gallery img  {
  width: 100%;
  aspect-ratio: 480 / 290;
  object-fit: cover;
  background: var(--c-slot);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-sm);
}

.facts  {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.fact  {
  margin: 0;
  padding: 16px 10px;
  text-align: center;
}

.icon  {
  width: 30px;
  height: 30px;
  fill: none;
  stroke: var(--c-accent);
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.fact strong  {
  display: block;
  margin-top: 6px;
  font-size: 1.45rem;
  font-weight: 700;
  line-height: 1.3;
}

.fact span  {
  display: block;
  font-size: 0.75rem;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--c-muted);
}

.grid-2  {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--gap);
}

.grid-3  {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 12px;
}

.feature img  {
  width: 100%;
  aspect-ratio: 800 / 420;
  margin-bottom: 14px;
  object-fit: cover;
  background: var(--c-slot);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-sm);
}

.solar-top  {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--gap);
  align-items: start;
}

.solar-photos  {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.solar-photos img  {
  width: 100%;
  aspect-ratio: 800 / 420;
  object-fit: cover;
  background: var(--c-slot);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-sm);
}

.specs  {
  margin-top: 18px;
  padding: 18px;
  background: var(--c-page);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
}

.spec-list  {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 8px 16px;
  margin: 0;
  font-size: 0.92rem;
}

.spec-list dt  {
  font-weight: 600;
}

.spec-list dd  {
  margin: 0;
}

.card-cta  {
  border-top: 4px solid var(--c-accent);
}

.cta-grid  {
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr) minmax(0, 1.5fr);
}

.price  {
  margin: 0;
}

.price span  {
  display: block;
  font-weight: 600;
  color: var(--c-muted);
}

.price strong  {
  display: block;
  font-size: 1.7rem;
  font-weight: 700;
  line-height: 1.25;
}

.cta-actions  {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 16px;
}

.share  {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--c-border);
}

.share .label  {
  margin: 0 6px 0 0;
}

.small-print  {
  margin: 14px 0 0 0;
  font-size: 0.8rem;
  color: var(--c-muted);
}

.site-footer  {
  padding: 20px 0 40px 0;
}

.action-bar  {
  display: none;
}

@media (max-width: 980px)  {
  .cta-grid  {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cta-grid > :last-child  {
    grid-column: 1 / -1;
  }

}

@media (max-width: 920px)  {
  .facts, .gallery  {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

}

@media (max-width: 860px)  {
  .grid-3  {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grid-3 > :last-child:nth-child(odd)  {
    grid-column: 1 / -1;
  }

}

@media (max-width: 780px)  {
  h1  {
    font-size: 1.8rem;
  }

  .grid-2, .solar-top  {
    grid-template-columns: minmax(0, 1fr);
  }

  .spec-list  {
    grid-template-columns: minmax(0, 1fr);
    gap: 2px;
  }

  .spec-list dd  {
    margin-bottom: 10px;
  }

  .action-bar  {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 20;
    display: flex;
    gap: 10px;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
    background: var(--c-card);
    border-top: 1px solid var(--c-border);
    box-shadow: 0 -4px 14px rgba(31, 41, 51, 0.10);
  }

  .action-bar .btn  {
    flex: 1 1 0;
    min-width: 0;
  }

  body  {
    padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px));
  }

}

@media (max-width: 560px)  {
  h1  {
    font-size: 1.6rem;
  }

  .wrap  {
    padding-right: 16px;
    padding-left: 16px;
  }

  .card  {
    padding: 18px;
  }

  .grid-3  {
    grid-template-columns: minmax(0, 1fr);
  }

  .grid-3 > :last-child:nth-child(odd), .cta-grid > :last-child  {
    grid-column: auto;
  }

  .facts  {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cta-grid  {
    grid-template-columns: minmax(0, 1fr);
  }

  .hero-actions .btn, .cta-actions .btn  {
    flex: 1 1 100%;
  }

}

@media (max-width: 480px)  {
  .gallery  {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .site-address  {
    font-size: 0.9rem;
  }

}

@media (prefers-reduced-motion: reduce)  {
  *, *::before, *::after  {
    transition: none !important;
    animation: none !important;
  }

}

@media print  {
  body  {
    padding-bottom: 0;
    background: #FFFFFF;
  }

  .skip-link, .action-bar, .share, .cta-actions, .hero-actions .btn  {
    display: none !important;
  }

  .site-header  {
    position: static;
  }

  .defer  {
    content-visibility: visible;
  }

  .card, .card-inner, .specs  {
    break-inside: avoid;
  }

}
/* FAQ enhancements (added 2026-10-21) */
#faq details {
  margin-bottom: 10px;
  border: 1px solid var(--c-border);
  border-radius: var(--radius-sm);
  padding: 12px 16px;
  background: var(--c-card);
}
#faq summary {
  cursor: pointer;
  font-weight: 600;
  list-style: none;
}
#faq summary::-webkit-details-marker { display: none; }
#faq details[open] summary { margin-bottom: 8px; }
#faq details p { margin: 0; color: var(--c-muted); }

/* ========== UPGRADES 2026-10-23 ========== */

/* Header listing logos */
.listing-logos {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: none;
}
.listing-logos a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  padding: 0 6px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid var(--c-border);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.listing-logos a:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.listing-logos img {
  height: 22px;
  width: auto;
  display: block;
}
.domain-badge {
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0 12px;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: -0.3px;
  color: #000;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.domain-badge:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  color: #000;
}
.domain-badge span {
  color: #e4002b;
  font-weight: 800;
}

/* Solar 2x2 grid */
.solar-photos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.solar-photos img,
.solar-photos .photo-placeholder {
  width: 100%;
  aspect-ratio: 800 / 420;
  object-fit: cover;
  background: var(--c-slot);
  border: 1px solid var(--c-border);
  border-radius: var(--radius-sm);
}
.photo-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  color: var(--c-muted);
  font-size: 0.85rem;
  text-align: center;
  padding: 12px;
  border-style: dashed;
}
.photo-placeholder strong {
  display: block;
  margin-bottom: 4px;
  color: var(--c-text);
}

/* More photos expandable strip */
.more-photos {
  margin-top: 12px;
  border: 1px solid var(--c-border);
  border-radius: var(--radius-sm);
  background: var(--c-page);
  overflow: hidden;
}
.more-photos > summary {
  list-style: none;
  cursor: pointer;
  padding: 10px 14px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--c-accent);
  display: flex;
  align-items: center;
  gap: 8px;
  user-select: none;
}
.more-photos > summary::-webkit-details-marker { display: none; }
.more-photos > summary::before {
  content: "▸";
  font-size: 0.85rem;
  transition: transform 0.2s ease;
}
.more-photos[open] > summary::before {
  transform: rotate(90deg);
}
.more-photos .photo-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
  padding: 0 12px 12px;
}
.more-photos .photo-strip img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid var(--c-border);
  background: var(--c-slot);
}

/* Michael avatar hover expand */
.michael-avatar {
  display: inline-block;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  vertical-align: middle;
  margin: 0 6px;
}
.michael-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.michael-avatar:hover {
  transform: scale(1.35);
  box-shadow: 0 8px 24px rgba(0,0,0,0.25);
  z-index: 5;
  position: relative;
}

/* Coloured share buttons */
.share {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
}
.share .label {
  width: 100%;
  margin-bottom: 4px;
}
.share-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
  border: none;
  color: #fff !important;
  transition: transform 0.15s ease, filter 0.15s ease;
}
.share-btn:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
  color: #fff !important;
}
.share-btn svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
}
.share-facebook { background: #1877F2; }
.share-whatsapp { background: #25D366; }
.share-x        { background: #000000; }
.share-email    { background: #5f6368; }
.share-sms      { background: #34B7F1; }

/* Agent highlight strip */
.agent-strip {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px;
  margin-top: 16px;
  background: linear-gradient(135deg, #f8fafc 0%, #eef2f7 100%);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
}
.agent-strip .michael-avatar {
  width: 72px;
  height: 72px;
  flex: none;
}

/* Energy callout */
.energy-callout {
  margin-top: 14px;
  padding: 12px 16px;
  background: #ecfdf5;
  border-left: 4px solid #10b981;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  font-size: 0.95rem;
}
.energy-callout strong {
  color: #047857;
}

/* Also listed on */
.also-listed {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--c-border);
  font-size: 0.9rem;
  color: var(--c-muted);
}
.also-listed a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  text-decoration: none;
  color: var(--c-text);
  font-weight: 600;
  transition: box-shadow 0.2s ease;
}
.also-listed a:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

@media (max-width: 700px) {
  .solar-photos {
    grid-template-columns: 1fr 1fr;
  }
  .agent-strip {
    flex-direction: column;
    text-align: center;
  }
  .listing-logos {
    gap: 6px;
  }
}

/* Domain logo sizing (official assets) */
.listing-logos img.domain-logo {
  height: 22px;
  width: auto;
  max-width: 110px;
}
.also-listed img.domain-logo {
  height: 16px;
  width: auto;
}

/* Location section images – match other image radius */
#location .card-inner img,
.location-photos img {
  width: 100%;
  aspect-ratio: 400 / 210;
  object-fit: cover;
  border-radius: var(--radius-sm);
  border: 1px solid var(--c-border);
  background: var(--c-slot);
  display: block;
}

/* Ensure all content images have consistent radius */
.card img:not(.michael-avatar img):not(.listing-logos img):not(.also-listed img) {
  border-radius: var(--radius-sm);
}

/* Accessibility: visible focus for interactive elements */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
summary:focus-visible,
.share-btn:focus-visible {
  outline: 3px solid var(--c-accent);
  outline-offset: 2px;
}

/* Ensure details/summary is keyboard accessible */
.more-photos > summary:focus-visible,
#faq summary:focus-visible {
  outline: 3px solid var(--c-accent);
  outline-offset: 2px;
}

/* Reduce motion preference */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .michael-avatar:hover {
    transform: none;
  }
}


/* ==========================================================================
   OPEN HOUSE, LINK FIXES AND ACCESSIBILITY  (added 2026-10-31)
   Everything above this line is your existing CSS, unchanged.
   Everything below overrides or adds to it, so you can delete any block you
   do not want and the rest of the page keeps working.
   ========================================================================== */

/* --------------------------------------------------------------------------
   A. TOKENS: accessible link colours + open house colours
   Your link colours (#798AA4 / #00AFC9) are 3.5:1 and 2.6:1 on white; the
   accessibility checks in Lighthouse / PageSpeed need 4.5:1. These keep the
   same slate-blue and teal feel, just darker. Delete this :root block to go
   back to your originals. *Changed to greens to match solar section.
   -------------------------------------------------------------------------- */
:root {
  --c-link:        #4A5F80;   /* 6.5:1 on white */
  --c-link-hover:  #007A8F;   /* 5.0:1 on white */
  --c-open:        #10b981;   /* open house green            */
  --c-open-dk:     #047857;   /* open house green, dark text */
  --c-open-bg:     #ecfdf5;   /* open house tint             */
  --c-open-bd:     #10b981;   /* open house border           */
}


/* --------------------------------------------------------------------------
   B. HELPERS
   -------------------------------------------------------------------------- */

/* Elements hidden by the script after the open house ends */
[hidden] {
  display: none !important;
}

/* Used by the screen reader announcer in the HTML */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}


/* --------------------------------------------------------------------------
   C. LINK FIXES
   The text-link rules (display, underline wipe, new-tab arrow) were also
   catching the share pills, the agent photo and the "also listed" logos.
   -------------------------------------------------------------------------- */
main a.share-btn,
main a.michael-avatar,
main .also-listed a {
  max-width: none;
}

main a.share-btn {
  display: inline-flex;
}

main a.michael-avatar {
  display: inline-block;
}

main .also-listed a {
  display: inline-flex;
}

main a.share-btn::before,
main a.share-btn::after,
main a.share-btn[target="_blank"]::before,
main a.michael-avatar::before,
main a.michael-avatar::after,
main .also-listed a::before,
main .also-listed a::after,
main .also-listed a[target="_blank"]::before {
  content: none;
  display: none;
}


/* Very small phones: slightly smaller email so it breaks after the @ only */
@media (max-width: 360px) {

  .card-inner a[href^="mailto:"] {
    font-size: 0.85rem;
  }
}


/* --------------------------------------------------------------------------
   D. SHARE BUTTON COLOURS (white text now passes 4.5:1)
   -------------------------------------------------------------------------- */
.share-facebook { background: #1465D8; }
.share-whatsapp { background: #0B7A43; }
.share-sms      { background: #0B6FA8; }


/* --------------------------------------------------------------------------
   E. OPEN HOUSE: header line, banner, calendar buttons and the box in the
      enquiry section
   -------------------------------------------------------------------------- */

/* Second line under the address in the sticky header */
.site-open {
  display: block;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.3px;
  color: var(--c-open-dk);
}

/* Banner under the header */
.open-house {
  background: var(--c-open-bg);
  border-top: 4px solid var(--c-open);
  border-bottom: 1px solid var(--c-open-bd);
}

.open-house-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 24px;
  padding-top: 16px;
  padding-bottom: 16px;
}

.open-house-text {
  flex: 1 1 320px;
  min-width: 0;
}

.open-house-tag {
  display: inline-block;
  margin: 0 0 6px 0;
  padding: 3px 12px;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 1.5px;
  line-height: 1.5;
  text-transform: uppercase;
  color: var(--c-on-accent);
  background: var(--c-open);
  border-radius: 999px;
}

.open-house-status {
  letter-spacing: 0.5px;
  text-transform: none;
}

.open-house-status:empty {
  display: none;
}

.open-house-when {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--c-text);
}

.open-house-where {
  margin: 2px 0 0 0;
  font-size: 0.95rem;
  color: var(--c-muted);
}

.open-house-actions {
  flex: 0 1 auto;
  min-width: 0;
}

.open-house-actions .label,
.open-house-box .label {
  color: var(--c-open-dk);
}

/* Row of calendar buttons (used in the banner and in the enquiry box) */
.calendar-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* Open house box inside the enquiry section */
.open-house-box {
  margin-top: 14px;
  padding: 12px 14px;
  background: var(--c-open-bg);
  border: 1px solid var(--c-open-bd);
  border-left: 4px solid var(--c-open);
  border-radius: var(--radius-sm);
}

.open-house-box .price strong {
  font-size: 1.2rem;
}

.open-house-box .calendar-links {
  margin-top: 10px;
}

@media (max-width: 560px) {

  .open-house-when {
    font-size: 1.15rem;
  }

  .open-house-actions {
    width: 100%;
  }

  /* Calendar buttons: two per row on phones */
  .calendar-links .btn {
    flex: 1 1 calc(50% - 8px);
    min-width: 0;
  }
}


/* --------------------------------------------------------------------------
   F. HEADER ON PHONES
   The two portal logos, the address and the For Sale button cannot fit side
   by side on a narrow screen (the page scrolled sideways below about 470px).
   On phones the logos are hidden here; the same links are in the
   "Also listed on" section further down the page.
   -------------------------------------------------------------------------- */
@media (max-width: 560px) {

  .listing-logos {
    display: none;
  }
}


/* --------------------------------------------------------------------------
   G. PRINT: do not print the open house buttons
   -------------------------------------------------------------------------- */
@media print {

  .calendar-links,
  .open-house-actions {
    display: none !important;
  }
}