/* CFR 1.5.64 - premium Ontario roofing location index; exclusive to service-areas. */
#main-content.cfr-areas-page .cfr-areas-hero{padding-block:clamp(2rem,3.3vw,3.25rem)!important}
#main-content.cfr-areas-page .cfr-areas-hero .cfr-page-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.88fr);gap:clamp(1.5rem,4vw,4rem);align-items:center}
#main-content.cfr-areas-page .cfr-areas-hero .cfr-page-hero-copy{min-width:0;max-width:none;align-self:center}
#main-content.cfr-areas-page .cfr-areas-hero h1{font-size:clamp(2.15rem,3.2vw,3.55rem)!important;line-height:1.1;letter-spacing:-.035em;text-wrap:balance;max-width:760px}
#main-content.cfr-areas-page .cfr-areas-hero .cfr-section-intro{font-size:clamp(1rem,1.23vw,1.13rem);line-height:1.7;max-width:660px}
#main-content.cfr-areas-page .cfr-areas-hero .cfr-page-hero-visual{display:block;position:relative;max-width:560px;width:100%;min-height:0;height:auto;aspect-ratio:16/10;margin:0;justify-self:end;border-radius:16px;overflow:hidden}
#main-content.cfr-areas-page .cfr-areas-hero .cfr-page-hero-img{display:block;width:100%;height:100%;object-fit:cover;object-position:center center}
#main-content.cfr-areas-page .cfr-areas-directory-section{padding-block:clamp(3rem,5vw,5rem)!important;background:#fff}
#main-content.cfr-areas-page .cfr-areas-directory-section>.cfr-container{width:min(calc(100% - 2.5rem),1260px);max-width:1260px;margin-inline:auto}
#main-content.cfr-areas-page .cfr-areas-directory-intro{max-width:850px;margin:0 0 clamp(2rem,3.5vw,3.25rem);padding:0;text-align:left}
#main-content.cfr-areas-page .cfr-areas-index-eyebrow{display:block;margin:0 0 .72rem;color:#0b78ae;font-size:.72rem;font-weight:800;letter-spacing:.13em}
#main-content.cfr-areas-page .cfr-areas-directory-intro h2{margin:0 0 .7rem;text-align:left;font-size:clamp(2rem,2.9vw,2.75rem);line-height:1.15;letter-spacing:-.025em;color:#0b304d}
#main-content.cfr-areas-page .cfr-areas-directory-intro p{margin:0;color:#44627a;line-height:1.72;font-size:clamp(1rem,1.18vw,1.08rem);text-align:left;max-width:800px}
#main-content.cfr-areas-page .cfr-areas-index{display:block;margin:0;padding:0;overflow:visible}
#main-content.cfr-areas-page .cfr-areas-region{display:grid;grid-template-columns:minmax(190px,.3fr) minmax(0,1fr);align-items:start;gap:clamp(1.5rem,3.6vw,3.75rem);padding:clamp(1.6rem,2.5vw,2.6rem) 0;border-top:1px solid #d8e6ef;min-width:0;background:transparent}
#main-content.cfr-areas-page .cfr-areas-region-heading{min-width:0;padding-top:.35rem}
#main-content.cfr-areas-page .cfr-areas-region-heading h3{margin:0 0 .35rem;padding:0;position:static;transform:none;color:#0a3453;font-size:clamp(1.12rem,1.4vw,1.34rem);font-weight:760;letter-spacing:-.012em;line-height:1.3;overflow-wrap:normal}
#main-content.cfr-areas-page .cfr-areas-region-count{display:block;color:#67849a;font-size:.79rem;line-height:1.5}
#main-content.cfr-areas-page .cfr-areas-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.35rem 1rem;min-width:0;align-items:start}
#main-content.cfr-areas-page .cfr-areas-link{display:flex;justify-content:space-between;align-items:center;gap:1rem;min-width:0;min-height:48px;padding:.65rem .2rem .72rem;margin:0;background:transparent;border:0;border-bottom:1px solid #e2ecf3;border-radius:0;box-shadow:none;text-align:left;text-decoration:none;font-size:.98rem;font-weight:660;line-height:1.35;color:#163e5b;white-space:normal;overflow-wrap:normal;transition:color .16s,border-color .16s}
#main-content.cfr-areas-page a.cfr-areas-link:hover,#main-content.cfr-areas-page a.cfr-areas-link:focus-visible{color:#0678bc;border-bottom-color:#0b8ed0;background:transparent;outline-offset:3px}
#main-content.cfr-areas-page .cfr-areas-arrow{flex:none;color:#1389c1;font-size:1.13rem;font-weight:500}
#main-content.cfr-areas-page .cfr-areas-link.is-static{color:#6c8090}
#main-content.cfr-areas-page .cfr-areas-outro{display:flex;align-items:center;justify-content:space-between;gap:2rem;margin:clamp(1.6rem,3vw,2.75rem) 0 0;padding:clamp(1.5rem,3vw,2.3rem);border-radius:16px;background:#092840;color:#fff}
#main-content.cfr-areas-page .cfr-areas-outro h2{font-size:clamp(1.35rem,2vw,1.7rem);line-height:1.23;margin:0 0 .48rem;color:#fff}
#main-content.cfr-areas-page .cfr-areas-outro p{margin:0;color:#c6dfed;line-height:1.6}
#main-content.cfr-areas-page .cfr-areas-contact-cta{display:inline-flex;align-items:center;justify-content:center;gap:.7rem;flex:none;min-height:46px;padding:.75rem 1.15rem;background:#f4fbff;color:#0a3453;border-radius:10px;font-size:.93rem;font-weight:750;text-decoration:none;white-space:nowrap}
#main-content.cfr-areas-page .cfr-areas-contact-cta:hover{background:#d8f0ff;color:#0a3453}
@media(max-width:1100px){#main-content.cfr-areas-page .cfr-areas-region{grid-template-columns:minmax(180px,.32fr) minmax(0,1fr);gap:1.5rem}#main-content.cfr-areas-page .cfr-areas-links{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:850px){#main-content.cfr-areas-page .cfr-areas-hero .cfr-page-hero-grid{grid-template-columns:1fr;gap:1.6rem}#main-content.cfr-areas-page .cfr-areas-hero .cfr-page-hero-visual{max-width:none;justify-self:stretch;aspect-ratio:16/9}}
@media(max-width:680px){#main-content.cfr-areas-page .cfr-areas-region{grid-template-columns:1fr;gap:.7rem;padding:1.5rem 0}#main-content.cfr-areas-page .cfr-areas-region-heading{padding:0}#main-content.cfr-areas-page .cfr-areas-links{grid-template-columns:repeat(2,minmax(0,1fr))}#main-content.cfr-areas-page .cfr-areas-outro{flex-direction:column;align-items:stretch;gap:1rem}#main-content.cfr-areas-page .cfr-areas-contact-cta{align-self:flex-start}#main-content.cfr-areas-page .cfr-areas-directory-section>.cfr-container{width:min(calc(100% - 2rem),1260px)}}
@media(max-width:440px){#main-content.cfr-areas-page .cfr-areas-links{grid-template-columns:1fr}#main-content.cfr-areas-page .cfr-areas-link{min-height:44px}#main-content.cfr-areas-page .cfr-areas-hero .cfr-page-hero-visual{aspect-ratio:4/3}#main-content.cfr-areas-page .cfr-areas-hero h1{font-size:clamp(2rem,8vw,2.45rem)!important}}

/* v1.5.64 mobile image fill regression correction: no empty colored strip. */
#main-content.cfr-areas-page .cfr-areas-hero .cfr-page-hero-visual{position:relative!important}
#main-content.cfr-areas-page .cfr-areas-hero .cfr-page-hero-visual .cfr-page-hero-img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-height:none!important;object-fit:cover!important;object-position:center center!important}
/* CFR v1.5.70 - place city navigation arrows right beside each city name. */
#main-content.cfr-areas-page .cfr-areas-links > a.cfr-areas-link {
  justify-content:flex-start!important;
  gap:.48rem!important;
}
#main-content.cfr-areas-page .cfr-areas-links > a.cfr-areas-link > span:first-child {
  flex:0 1 auto!important;
  min-width:0!important;
  max-width:calc(100% - 1.6rem)!important;
}
#main-content.cfr-areas-page .cfr-areas-links > a.cfr-areas-link > .cfr-areas-arrow {
  flex:0 0 auto!important;
  margin:0!important;
  line-height:1!important;
}
/* CFR v1.5.71 - premium Ontario service-area directory.
   Dedicated page-only rules: no homepage, city template or global components. */
#main-content.cfr-areas-page .cfr-areas-directory-section {
  background:linear-gradient(180deg,#f4f8fb 0%,#f7fafd 38%,#fff 100%)!important;
  padding-block:clamp(3.25rem,5.5vw,5.6rem)!important;
}
#main-content.cfr-areas-page .cfr-areas-directory-section>.cfr-container {
  width:min(calc(100% - 3rem),1290px)!important;
  max-width:1290px!important;
}
#main-content.cfr-areas-page .cfr-areas-directory-intro {
  width:100%!important;
  max-width:none!important;
  margin:0 0 clamp(1.75rem,3vw,2.7rem)!important;
  padding:0 0 clamp(1.5rem,2.5vw,2.35rem)!important;
  border-bottom:1px solid #d6e5ee!important;
  text-align:left!important;
}
#main-content.cfr-areas-page .cfr-areas-index-eyebrow {
  margin-bottom:.85rem!important;
  color:#1179aa!important;
  letter-spacing:.15em!important;
  font-size:.74rem!important;
}
#main-content.cfr-areas-page .cfr-areas-directory-intro h2 {
  font-size:clamp(2.25rem,3.4vw,3.15rem)!important;
  line-height:1.12!important;
  letter-spacing:-.042em!important;
  margin:0 0 .75rem!important;
  text-wrap:normal!important;
}
#main-content.cfr-areas-page .cfr-areas-directory-intro p {
  width:100%!important;
  max-width:960px!important;
  font-size:clamp(1.03rem,1.2vw,1.15rem)!important;
  line-height:1.65!important;
  color:#48667e!important;
}
@media(min-width:981px) {
  #main-content.cfr-areas-page .cfr-areas-index {
    display:block!important;
    columns:2!important;
    column-gap:clamp(1rem,1.8vw,1.6rem)!important;
    column-fill:balance!important;
  }
}
#main-content.cfr-areas-page .cfr-areas-index {
  width:100%!important;
  min-width:0!important;
}
#main-content.cfr-areas-page .cfr-areas-region {
  display:block!important;
  position:relative!important;
  break-inside:avoid!important;
  -webkit-column-break-inside:avoid!important;
  page-break-inside:avoid!important;
  overflow:hidden!important;
  min-width:0!important;
  margin:0 0 clamp(1rem,1.8vw,1.45rem)!important;
  padding:clamp(1.3rem,2.15vw,1.9rem)!important;
  border:1px solid #d7e5ee!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 7px 25px rgba(6,41,65,.045)!important;
}
#main-content.cfr-areas-page .cfr-areas-region-heading {
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:wrap!important;
  align-items:baseline!important;
  justify-content:space-between!important;
  gap:.25rem 1rem!important;
  width:100%!important;
  min-width:0!important;
  padding:0 0 .9rem!important;
  margin:0 0 .15rem!important;
  border-bottom:1px solid #e1edf4!important;
}
#main-content.cfr-areas-page .cfr-areas-region-heading h3 {
  margin:0!important;
  padding:0!important;
  font-size:clamp(1.15rem,1.42vw,1.4rem)!important;
  letter-spacing:-.022em!important;
  font-weight:780!important;
  color:#092e4c!important;
  line-height:1.28!important;
  text-wrap:normal!important;
}
#main-content.cfr-areas-page .cfr-areas-region-count {
  display:inline-block!important;
  white-space:nowrap!important;
  font-size:.76rem!important;
  line-height:1.45!important;
  font-weight:650!important;
  letter-spacing:.018em!important;
  color:#69859a!important;
}
#main-content.cfr-areas-page .cfr-areas-links {
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:0 clamp(.7rem,1.5vw,1.3rem)!important;
  align-items:start!important;
  min-width:0!important;
}
#main-content.cfr-areas-page .cfr-areas-links > .cfr-areas-link {
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:.5rem!important;
  min-width:0!important;
  min-height:46px!important;
  padding:.69rem 0!important;
  border:0!important;
  border-bottom:1px solid #edf2f6!important;
  border-radius:0!important;
  background:none!important;
  box-shadow:none!important;
  color:#183f5b!important;
  font-size:1rem!important;
  font-weight:680!important;
  line-height:1.36!important;
  transition:color .15s ease,border-color .15s ease!important;
}
#main-content.cfr-areas-page .cfr-areas-links > a.cfr-areas-link:hover,
#main-content.cfr-areas-page .cfr-areas-links > a.cfr-areas-link:focus-visible {
  color:#087aae!important;
  border-bottom-color:#9ccce5!important;
  outline-offset:3px!important;
}
#main-content.cfr-areas-page .cfr-areas-links > a.cfr-areas-link .cfr-areas-arrow {
  flex:0 0 auto!important;
  margin:0!important;
  font-size:1.08rem!important;
  color:#087eb9!important;
  line-height:1!important;
}
#main-content.cfr-areas-page .cfr-areas-outro {
  margin-top:clamp(1.5rem,3vw,2.6rem)!important;
  padding:clamp(1.6rem,3vw,2.8rem)!important;
  border:1px solid #185375!important;
  border-radius:18px!important;
  background:linear-gradient(110deg,#0a2d49 0%,#0b4265 100%)!important;
  box-shadow:0 10px 28px rgba(5,43,68,.08)!important;
}
@media(max-width:980px) {
  #main-content.cfr-areas-page .cfr-areas-index {columns:1!important;}
  #main-content.cfr-areas-page .cfr-areas-directory-section>.cfr-container {width:min(calc(100% - 2.2rem),800px)!important}
  #main-content.cfr-areas-page .cfr-areas-region {padding:clamp(1.2rem,3vw,1.75rem)!important}
}
@media(max-width:560px) {
  #main-content.cfr-areas-page .cfr-areas-directory-section>.cfr-container {width:calc(100% - 2rem)!important}
  #main-content.cfr-areas-page .cfr-areas-region {border-radius:14px!important;padding:1.15rem!important}
  #main-content.cfr-areas-page .cfr-areas-region-heading {align-items:flex-start!important;flex-direction:column!important;gap:.35rem!important;padding-bottom:.7rem!important}
  #main-content.cfr-areas-page .cfr-areas-links {grid-template-columns:1fr!important}
  #main-content.cfr-areas-page .cfr-areas-links > .cfr-areas-link {min-height:44px!important}
  #main-content.cfr-areas-page .cfr-areas-outro {border-radius:14px!important}
}
/* CFR v1.5.78 - selected directory/gallery/guides editorial hero alignment.
 * Use the real page width for H1 and a balanced copy/photo grid beneath.
 */
main#main-content .cfr-index-editorial-hero .cfr-index-editorial-grid{
 display:grid!important;
 grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr)!important;
 grid-template-areas:"heading heading" "copy visual"!important;
 gap:clamp(1.2rem,2vw,1.9rem) clamp(1.5rem,3.3vw,3.3rem)!important;
 align-items:start!important;
}
main#main-content .cfr-index-editorial-hero .cfr-index-hero-heading{
 grid-area:heading!important;
 width:100%!important;
 max-width:none!important;
 min-width:0!important;
 text-align:left!important;
}
main#main-content .cfr-index-editorial-hero .cfr-index-hero-heading .cfr-breadcrumbs{
 margin:0 0 clamp(.85rem,1.3vw,1.15rem)!important;
}
main#main-content .cfr-index-editorial-hero .cfr-index-hero-heading .cfr-eyebrow{
 display:block!important;
 margin:0 0 .6rem!important;
}
main#main-content .cfr-index-editorial-hero .cfr-index-hero-heading h1{
 display:block!important;
 width:100%!important;
 max-width:none!important;
 font-size:clamp(2.05rem,3.06vw,3.25rem)!important;
 line-height:1.13!important;
 letter-spacing:-.036em!important;
 text-align:left!important;
 text-wrap:pretty!important;
 word-break:normal!important;
 overflow-wrap:break-word!important;
 margin:0!important;
 color:#fff!important;
}
main#main-content .cfr-index-editorial-hero .cfr-index-editorial-grid > .cfr-page-hero-copy{
 grid-area:copy!important;
 min-width:0!important;
 max-width:none!important;
 width:100%!important;
 padding:0!important;
 margin:0!important;
 align-self:start!important;
 text-align:left!important;
}
main#main-content .cfr-index-editorial-hero .cfr-index-editorial-grid > .cfr-page-hero-copy .cfr-section-intro{
 display:block!important;
 width:100%!important;
 max-width:76ch!important;
 font-size:clamp(1.04rem,1.2vw,1.15rem)!important;
 font-weight:430!important;
 line-height:1.67!important;
 margin:0 0 clamp(.75rem,1vw,1rem)!important;
 text-wrap:pretty!important;
}
main#main-content .cfr-index-editorial-hero .cfr-index-editorial-grid > .cfr-page-hero-visual{
 grid-area:visual!important;
 width:100%!important;
 min-width:0!important;
 max-width:none!important;
 height:auto!important;
 aspect-ratio:16/10!important;
 margin:0!important;
 padding:0!important;
 align-self:start!important;
 overflow:hidden!important;
 border-radius:15px!important;
}
main#main-content .cfr-index-editorial-hero .cfr-index-editorial-grid > .cfr-page-hero-visual img{
 display:block!important;
 width:100%!important;
 height:100%!important;
 max-height:none!important;
 aspect-ratio:16/10!important;
 object-fit:cover!important;
}
/* Preserve original data-backed gallery counts and buttons, but don't trap summaries. */
main#main-content .cfr-index-editorial-hero .cfr-index-editorial-grid .cfr-project-gallery-summary{
 display:flex!important;
 flex-wrap:wrap!important;
 align-items:center!important;
 justify-content:flex-start!important;
 gap:.65rem 1rem!important;
 width:100%!important;
 max-width:none!important;
 margin:1.05rem 0 0!important;
}
@media(max-width:980px){
 main#main-content .cfr-index-editorial-hero .cfr-index-editorial-grid{
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-areas:"heading" "copy" "visual"!important;
  gap:clamp(1.1rem,2.6vw,1.55rem)!important;
 }
 main#main-content .cfr-index-editorial-hero .cfr-index-hero-heading h1{
  font-size:clamp(1.95rem,4.6vw,2.72rem)!important;
  line-height:1.14!important;
 }
 main#main-content .cfr-index-editorial-hero .cfr-index-editorial-grid > .cfr-page-hero-visual,
 main#main-content .cfr-index-editorial-hero .cfr-index-editorial-grid > .cfr-page-hero-visual img{
  aspect-ratio:16/9!important;
 }
}
@media(max-width:580px){
 main#main-content .cfr-index-editorial-hero .cfr-index-editorial-grid{gap:1.1rem!important}
 main#main-content .cfr-index-editorial-hero .cfr-index-hero-heading h1{
  font-size:clamp(1.83rem,7.4vw,2.25rem)!important;
  line-height:1.15!important;
 }
 main#main-content .cfr-index-editorial-hero .cfr-index-editorial-grid > .cfr-page-hero-visual,
 main#main-content .cfr-index-editorial-hero .cfr-index-editorial-grid > .cfr-page-hero-visual img{
  aspect-ratio:4/3!important;
 }
}
/* CFR v1.5.78 contrast QA - projects gallery is light, unlike the dark gallery and directory heroes. */
main#main-content.cfr-projects-page:not(.cfr-solar-gallery-page) .cfr-index-editorial-hero .cfr-index-hero-heading h1 {
 color:#0b2d48!important;
}