/* Step1 v3: brand palette + hero CTA */
:root{
--mirza-green:#16a34a;
--mirza-blue:#1d4ed8;
}
.promo__btn{
background: var(--mirza-green) !important;
border-color: var(--mirza-green) !important;
color: #fff !important;
}
.promo__btn i{ color:#fff !important; }
.promo__btn:hover{
background: #15803d !important;
border-color: #15803d !important;
color:#fff !important;
}
/* ============================
Layout polish overrides (v2)
Goal: keep Superior-like light feel, fix sizing/spacing, keep mobile seamless.
No global dark theme overrides.
============================ */
:root{
--container: 1180px;
--gutter: 18px;
--section-y: 56px;
}
@media (min-width: 900px){
:root{ --gutter: 26px; --section-y: 84px; }
}
.container{
width: min(var(--container), calc(100% - (var(--gutter) * 2)));
margin-inline: auto;
}
.section{
padding-block: var(--section-y);
}
.section__head{
text-align: left;
max-width: 820px;
margin: 0 0 28px 0;
}
.section__title{
margin: 0 0 10px 0;
line-height: 1.1;
}
.section__sub{
margin: 0;
}
/* Buttons: keep it clean, not dark-mode */
.btn{
display:inline-flex;
align-items:center;
justify-content:center;
padding: 14px 18px;
border-radius: 999px;
font-weight: 700;
border: 1px solid rgba(0,0,0,.12);
background: #ffffff;
transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
box-shadow: 0 10px 25px rgba(0,0,0,.10);
}
.btn:hover{ transform: translateY(-1px); box-shadow: 0 16px 38px rgba(0,0,0,.14); }
.btn--primary{
border-color: rgba(0,0,0,.08);
background: linear-gradient(135deg, #ffb703, #fb8500);
color: #111;
}
/* HERO: keep image natural */
.hero__media img,
.hero img{
filter: none !important;
mix-blend-mode: normal !important;
opacity: 1 !important;
}
/* Trust strip: align nicely */
.truststrip{
display:grid;
gap: 14px;
margin-top: 18px;
}
@media (min-width: 760px){
.truststrip{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
.truststrip__item{
border: 1px solid rgba(0,0,0,.08);
background: #fff;
border-radius: 16px;
padding: 14px 16px;
box-shadow: 0 10px 25px rgba(0,0,0,.08);
}
.truststrip__icon{
width: 42px; height: 42px;
border-radius: 14px;
display:grid; place-items:center;
background: rgba(251,133,0,.10);
}
/* WHY HIRE: slideshow left, bubbles right, sane sizing */
.whyhire__wrap{
display:grid;
gap: 18px;
align-items: start;
}
@media (min-width: 980px){
.whyhire__wrap{
grid-template-columns: 1.05fr .95fr;
gap: 28px;
align-items: center;
}
}
/* Carousel container size */
.whyhire__slider{
border-radius: 18px;
overflow:hidden;
border: 1px solid rgba(0,0,0,.10);
box-shadow: 0 18px 55px rgba(0,0,0,.12);
background: #fff;
}
.whyhire__slider img{
width: 100%;
height: 280px;
object-fit: cover;
display:block;
}
@media (min-width: 980px){
.whyhire__slider img{ height: 420px; }
}
/* Bubbles: not a vertical ugly stack */
.bubbles{
display:grid;
gap: 12px;
}
@media (min-width: 700px){
.bubbles{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (min-width: 980px){
.bubbles{ grid-template-columns: 1fr; }
}
.bubble{
border: 1px solid rgba(0,0,0,.08);
background: #fff;
border-radius: 16px;
padding: 14px 16px;
box-shadow: 0 10px 25px rgba(0,0,0,.08);
}
.bubble__title{ margin:0 0 6px 0; font-weight:800; }
.bubble__text{ margin:0; color: rgba(0,0,0,.70); line-height:1.55; }
/* Reviews + Logos sliders: consistent card sizing */
.reviewcard, .logocard{
border: 1px solid rgba(0,0,0,.08);
background: #fff;
border-radius: 16px;
padding: 16px;
height: 100%;
box-shadow: 0 10px 25px rgba(0,0,0,.08);
}
.reviewcard__meta{
display:flex; align-items:center; gap:10px; margin-bottom:10px;
}
.reviewcard__source{
font-weight: 800;
}
.reviewcard__text{ margin:0; color: rgba(0,0,0,.70); line-height:1.55; }
.reviewcard__stars{ color: #fb8500; font-weight:800; }
.logocard{
display:grid; place-items:center;
padding: 18px;
}
.logocard img{ max-height: 44px; width:auto; opacity:.9; }
/* Services: clean grid */
.services__grid{
display:grid;
gap: 14px;
}
@media (min-width: 760px){
.services__grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (min-width: 1050px){
.services__grid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
.servicecard{
border: 1px solid rgba(0,0,0,.08);
background: #fff;
border-radius: 16px;
padding: 16px;
box-shadow: 0 10px 25px rgba(0,0,0,.08);
}
.servicecard__title{ margin:0 0 6px 0; font-weight:800; }
.servicecard__text{ margin:0; color: rgba(0,0,0,.70); line-height:1.55; }
/* CTA: similar to Superior vibe (light, bold, clean) */
.cta{
border-radius: 22px;
background: linear-gradient(135deg, rgba(255,183,3,.16), rgba(251,133,0,.10));
border: 1px solid rgba(0,0,0,.08);
box-shadow: 0 18px 55px rgba(0,0,0,.10);
overflow:hidden;
}
.cta__wrap{
display:grid;
gap: 18px;
align-items:center;
padding: 20px;
}
@media (min-width: 980px){
.cta__wrap{
grid-template-columns: 1.1fr .9fr;
padding: 28px;
}
}
/* Quote hero (split text + worker visual) */
.quote-hero{
display:grid;
grid-template-columns: 1.05fr .95fr;
gap: 26px;
align-items: center;
padding: 34px 34px;
border-radius: 26px;
background: #fff;
box-shadow: var(--card-shadow);
border: 1px solid rgba(0,0,0,.06);
}
.quote-hero__text p{
max-width: 62ch;
color: rgba(0,0,0,.75);
}
.quote-hero__actions{
margin-top: 22px;
}
.section-quote .btn-green{
background: #1faa62;
border-color: #1faa62;
color:#fff;
}
.section-quote .btn-green:hover{
filter: brightness(.95);
transform: translateY(-1px);
}
.quote-cta-buttons{
display:flex;
align-items:stretch;
gap:20px;
margin-top:25px;
flex-wrap:nowrap;
}
/* Two-column CTA blocks (equal height) */
.quote-cta-col{
display:flex;
flex-direction:column;
justify-content:flex-start;
gap:2px;
}
.quote-cta-primary{
font-size:24px;
font-weight:800;
color:#1c3faa;
text-decoration:none;
white-space:nowrap;
line-height:1.05;
}
.quote-phone-label, .quote-request-sub{
font-size:15px !important;
color:#6a6a6a !important;
font-weight:500 !important;
font-family:inherit !important;
line-height:1.2 !important;
margin:0 !important;
}
/* Keep the “We’ll get back to you” snug under the CTA */
.quote-request-sub{ margin-top:2px !important; }
.quote-phone-number::before, .quote-phone-number::after, .quote-request-link::before, .quote-request-link::after{
content:none !important;
}
.quote-phone-number, .quote-request-link{ background:none !important; padding-left:0 !important; }
.quote-phone-number{ }
.quote-or{
font-weight:600;
color:#666;
font-size:14px;
align-self:center;
}
.quote-request-link{ }
.quote-request-btn{
background:#21a366;
color:#fff;
padding:10px 22px;
border-radius:26px;
font-weight:700;
font-size:13px;
text-decoration:none;
display:inline-block;
transition:0.2s;
white-space:nowrap;
}
.quote-request-btn:hover{
background:#1b8a56;
transform:translateY(-2px);
}
/* On small screens, allow wrapping so it doesn't overflow */
@media (max-width: 640px){
.quote-cta-buttons{
flex-wrap:wrap;
gap:14px;
}
}
@media (max-width: 520px){
.quote-phone-number{ font-size: 28px; }
/* Ensure no icon/square appears before the phone number */
.quote-phone-number::before,
.quote-phone-number:before{
content: none !important;
display: none !important;
}
.quote-phone-number{
padding-left:0 !important;
background:none !important;
}
}
.quote-hero__visual{
position: relative;
height: 420px;
border-radius: 22px;
overflow: hidden;
background: transparent;
}
.quote-hero__rings{
position:absolute;
inset: -40px -40px -40px -40px;
}
.quote-hero__rings::before,
.quote-hero__rings::after{
content:"";
position:absolute;
right: -60px;
bottom: -80px;
width: 520px;
height: 520px;
border-radius: 999px;
background: rgba(0,0,0,.07);
}
.quote-hero__rings::after{
width: 620px;
height: 620px;
right: -110px;
bottom: -130px;
background: transparent;
border: 10px solid rgba(255,255,255,.85);
box-shadow: 0 0 0 4px rgba(0,0,0,.06) inset;
}
.quote-hero__worker{
position:absolute;
right: 70px;
bottom: 0;
width: 260px;
height: 380px;
background: #000;
border-radius: 14px;
}
@media (max-width: 900px){
.quote-hero{
grid-template-columns: 1fr;
padding: 26px 22px;
}
.quote-hero__visual{
height: 360px;
}
.quote-hero__worker{
right: 22px;
width: 220px;
height: 320px;
}
}
/* Map section spacing */
.map__wrap{
display:grid;
gap: 16px;
}
@media (min-width: 980px){
.map__wrap{ grid-template-columns: 1.1fr .9fr; gap: 24px; align-items: start; }
}
.map__embed{
border-radius: 18px;
overflow:hidden;
border: 1px solid rgba(0,0,0,.10);
box-shadow: 0 18px 55px rgba(0,0,0,.10);
}
/* FAQ */
.faq__item{
border: 1px solid rgba(0,0,0,.08);
background: #fff;
border-radius: 16px;
overflow:hidden;
box-shadow: 0 10px 25px rgba(0,0,0,.08);
}
.faq__q{
width:100%;
text-align:left;
padding: 14px 16px;
background: transparent;
border: 0;
font-weight: 800;
cursor:pointer;
display:flex;
justify-content:space-between;
gap: 12px;
}
.faq__a{
padding: 0 16px 14px 16px;
color: rgba(0,0,0,.70);
display:none;
line-height:1.55;
}
.faq__item.is-open .faq__a{ display:block; }
/* Before/After: keep it clean */
.ba{
border-radius: 18px;
overflow:hidden;
border: 1px solid rgba(0,0,0,.10);
box-shadow: 0 18px 55px rgba(0,0,0,.10);
}
/* Splide arrows/pagination (light) */
.splide__arrow{
background: rgba(255,255,255,.92) !important;
border: 1px solid rgba(0,0,0,.10) !important;
box-shadow: 0 10px 25px rgba(0,0,0,.10);
}
.splide__pagination__page{
background: rgba(0,0,0,.22) !important;
}
.splide__pagination__page.is-active{
background: rgba(0,0,0,.55) !important;
}
/* Custom layout overrides/additions for Grease Trap site.
Keep this file separate so edits are easy and mobile stays consistent. */
:root{
--section-pad: 56px;
--card-radius: 16px;
--card-shadow: 0 10px 30px rgba(0,0,0,.08);
--muted: rgba(0,0,0,.65);
--line: rgba(0,0,0,.12);
}
.section{
padding: var(--section-pad) 0;
}
.section__header{
margin-bottom: 22px;
}
.section__header--tight{
margin-bottom: 14px;
}
.section__sub{
margin-top: 8px;
color: var(--muted);
max-width: 72ch;
}
.section__divider{
height: 1px;
background: var(--line);
margin: 30px 0;
}
/* Two column layout (slideshow + bubbles) */
.two-col{
display: grid;
grid-template-columns: 1.1fr .9fr;
gap: 28px;
align-items: start;
}
.two-col__media .splide{
border-radius: var(--card-radius);
overflow: hidden;
box-shadow: var(--card-shadow);
background: #fff;
}
.media-placeholder{
height: 360px;
display: grid;
place-items: center;
background: linear-gradient(135deg, rgba(0,0,0,.04), rgba(0,0,0,.02));
border: 1px dashed var(--line);
color: rgba(0,0,0,.5);
font-weight: 600;
text-align: center;
padding: 18px;
}
.media-placeholder span{
max-width: 28ch;
}
.bubble{
background: #fff;
border-radius: var(--card-radius);
box-shadow: var(--card-shadow);
padding: 18px 18px;
border: 1px solid rgba(0,0,0,.06);
}
.bubble + .bubble{ margin-top: 14px; }
.bubble__title{
margin: 0 0 6px 0;
font-size: 18px;
line-height: 1.25;
}
.bubble__text{
margin: 0;
color: var(--muted);
}
.two-col__cta{
margin-top: 18px;
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 14px;
}
.fineprint{
margin: 0;
color: var(--muted);
font-size: 14px;
}
/* Reviews */
.review-card{
background: #fff;
border-radius: var(--card-radius);
box-shadow: var(--card-shadow);
padding: 18px;
border: 1px solid rgba(0,0,0,.06);
min-height: 190px;
display: flex;
flex-direction: column;
}
.review-card__top{
display:flex;
align-items:center;
justify-content: space-between;
gap: 10px;
margin-bottom: 10px;
}
.badge{
display:inline-flex;
align-items:center;
padding: 6px 10px;
border-radius: 999px;
background: rgba(0,0,0,.06);
font-weight: 700;
font-size: 12px;
}
.stars{
letter-spacing: 1px;
font-size: 14px;
}
.review-card__text{
color: var(--muted);
margin: 0 0 12px 0;
flex: 1;
}
.review-card__meta{
margin: 0;
font-weight: 700;
font-size: 14px;
}
/* Logo carousel */
.logos .splide__slide{
padding: 6px 0;
}
.logo-card{
background: #fff;
border-radius: 14px;
border: 1px solid rgba(0,0,0,.08);
height: 70px;
display: grid;
place-items: center;
color: rgba(0,0,0,.55);
font-weight: 700;
}
/* Services grid */
.services-grid{
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px;
}
@media (max-width: 680px){
.services-grid{ grid-template-columns: 1fr; }
}
.service-card{
background: #fff;
border-radius: var(--card-radius);
box-shadow: var(--card-shadow);
border: 1px solid rgba(0,0,0,.06);
overflow: hidden;
padding: 0;
transition: transform .18s ease, box-shadow .18s ease;
}
.service-card:hover{
transform: translateY(-6px) scale(1.02);
box-shadow: 0 16px 40px rgba(0,0,0,.14);
}
.service-card__title{
margin: 0;
font-size: 20px;
line-height: 1.2;
}
.service-card__text{
margin: 0;
color: var(--muted);
line-height: 1.6;
}
.service-card__media{
margin: 0;
border-radius: 0;
overflow: hidden;
}
.service-card__media .media-placeholder{
height: 190px;
}
.service-card__body{
padding: 18px;
display: flex;
flex-direction: column;
gap: 10px;
}
.service-card__scroll{
max-height: 110px;
overflow: auto;
padding-right: 6px;
}
.service-card__link{
margin-top: auto;
display: inline-flex;
align-items: center;
gap: 8px;
font-weight: 700;
text-decoration: none;
color: var(--mirza-blue);
}
.service-card__link:hover{
text-decoration: underline;
}
.service-card__arrow{
color: var(--mirza-green);
font-weight: 900;
}
/* Before/After component */
.ba{
position: relative;
border-radius: var(--card-radius);
overflow: hidden;
box-shadow: var(--card-shadow);
background: #fff;
min-height: 320px;
}
.ba__img{
position: absolute;
inset: 0;
}
.ba__img--before{
z-index: 1;
}
.ba__img--after{
z-index: 2;
clip-path: inset(0 0 0 50%);
}
.ba__img .media-placeholder{
height: 100%;
border: 0;
}
.ba__divider{
position: absolute;
top: 0;
bottom: 0;
left: 50%;
width: 3px;
background: rgba(255,255,255,.9);
box-shadow: 0 0 0 1px rgba(0,0,0,.18);
z-index: 3;
}
.ba__divider::after{
content:"";
position:absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
width: 44px;
height: 44px;
border-radius: 999px;
background: rgba(0,0,0,.65);
box-shadow: 0 8px 18px rgba(0,0,0,.25);
}
.ba__divider::before{
content:"↔";
position:absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
z-index: 2;
color: #fff;
font-weight: 900;
font-size: 18px;
}
.ba__range{
position: absolute;
inset: 0;
opacity: 0;
z-index: 4;
cursor: ew-resize;
}
.ba__labels{
position:absolute;
left: 12px;
right: 12px;
top: 12px;
z-index: 5;
display:flex;
justify-content: space-between;
pointer-events:none;
}
.ba__label{
background: rgba(0,0,0,.6);
color: #fff;
padding: 6px 10px;
border-radius: 999px;
font-size: 12px;
font-weight: 800;
}
/* Quote CTA */
.section-quote{
background: rgba(0,0,0,.03);
}
.quote-cta{
display:grid;
grid-template-columns: 1.2fr .8fr;
gap: 22px;
align-items: center;
padding: 26px;
border-radius: 22px;
background: #fff;
box-shadow: var(--card-shadow);
border: 1px solid rgba(0,0,0,.06);
}
.quote-cta__actions{
display:flex;
flex-wrap: wrap;
gap: 12px;
margin-top: 14px;
}
.btn-outline{
display:inline-flex;
align-items:center;
justify-content:center;
padding: 14px 18px;
border-radius: 12px;
border: 1px solid rgba(0,0,0,.18);
color: rgba(0,0,0,.85);
background: transparent;
font-weight: 800;
text-decoration: none;
}
.btn-outline:hover{
background: rgba(0,0,0,.04);
}
.quote-bullets{
display:grid;
gap: 10px;
}
.quote-bullet{
background: rgba(0,0,0,.04);
border: 1px solid rgba(0,0,0,.06);
border-radius: 14px;
padding: 12px 14px;
font-weight: 700;
}
/* Map + areas */
.map-grid{
display:grid;
grid-template-columns: .92fr 1.08fr;
gap: 18px;
align-items: stretch;
}
.map-embed{
border-radius: var(--card-radius);
overflow: hidden;
border: 1px solid rgba(0,0,0,.08);
box-shadow: var(--card-shadow);
background: #fff;
/* Compact height; users scroll inside the city list */
height: 390px;
min-height: 390px;
}
.map-embed iframe{
width: 100%;
height: 100%;
min-height: 390px;
border: 0;
}
/* Areas panel (left) */
.areas-panel{
background: #061b4b;
color: #fff;
border-radius: var(--card-radius);
box-shadow: var(--card-shadow);
border: 1px solid rgba(255,255,255,.08);
padding: 18px 18px 16px;
/* Compact height + internal scroll for long lists */
height: 390px;
min-height: 390px;
overflow: hidden;
position: relative;
}
.areas-panel__intro{
margin: 0 0 14px 0;
color: rgba(255,255,255,.88);
font-size: 16px;
line-height: 1.35;
}
.areas-panel__cols{
display:grid;
grid-template-columns: 1fr 1fr;
gap: 22px;
height: calc(100% - 36px);
overflow-y: auto;
padding-right: 8px;
}
/* Scrollbar (webkit) */
.areas-panel__cols::-webkit-scrollbar{ width: 10px; }
.areas-panel__cols::-webkit-scrollbar-track{ background: rgba(255,255,255,.10); border-radius: 99px; }
.areas-panel__cols::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.35); border-radius: 99px; }
.areas-panel__cols::-webkit-scrollbar-thumb:hover{ background: rgba(255,255,255,.48); }
.areas-group{ margin: 0 0 18px 0; }
.areas-group__title{
margin: 0 0 10px 0;
font-size: 16px;
font-weight: 800;
letter-spacing: .02em;
text-transform: none;
color: #fff;
}
.areas-items{
list-style: none;
margin: 0;
padding: 0;
}
.areas-items li{
display:flex;
align-items:center;
gap: 10px;
padding: 10px 0;
border-bottom: 1px solid rgba(255,255,255,.10);
color: rgba(255,255,255,.92);
font-size: 16px;
line-height: 1.2;
}
.areas-items li:last-child{ border-bottom: 0; }
.areas-pin{
width: 26px;
height: 26px;
border-radius: 999px;
background: rgba(255,255,255,.10);
display:inline-flex;
align-items:center;
justify-content:center;
flex: 0 0 26px;
position: relative;
}
.areas-pin:before{
content:"";
width: 13px;
height: 13px;
background: var(--mirza-green);
border-radius: 999px;
display:block;
box-shadow: 0 0 0 3px rgba(22,163,74,.22);
}
/* Responsive */
@media (max-width: 980px){
.map-grid{ grid-template-columns: 1fr; }
.areas-panel{ height: 390px; min-height: 390px; }
.map-embed{ height: 390px; min-height: 390px; }
.areas-panel__cols{ grid-template-columns: 1fr 1fr; height: auto; max-height: 360px; }
}
@media (max-width: 620px){
.areas-panel__cols{ grid-template-columns: 1fr; max-height: 420px; }
}
/* FAQ + blog */
.faq-blog-grid{
display:grid;
grid-template-columns: 1fr;
gap: 22px;
align-items: start;
}
.faq-item{
background:#fff;
border-radius: 14px;
border: 1px solid rgba(0,0,0,.08);
box-shadow: var(--card-shadow);
padding: 12px 14px;
}
.faq-item + .faq-item{ margin-top: 12px; }
.faq-item summary{
cursor: pointer;
font-weight: 800;
}
.faq-item p{
margin: 10px 0 0 0;
color: var(--muted);
}
.blog-cards{
display:grid;
gap: 12px;
}
.blog-card{
display:grid;
grid-template-columns: 120px 1fr;
gap: 14px;
align-items: center;
text-decoration: none;
background:#fff;
border-radius: var(--card-radius);
border: 1px solid rgba(0,0,0,.06);
box-shadow: var(--card-shadow);
overflow:hidden;
}
.blog-card__img.media-placeholder{ height: 96px; }
.blog-card__body{ padding: 12px 14px; }
.blog-card__title{
margin: 0 0 6px 0;
font-size: 16px;
color: rgba(0,0,0,.9);
}
.blog-card__meta{
margin: 0;
color: var(--muted);
font-size: 13px;
}
/* Mobile */
@media (max-width: 992px){
.two-col{ grid-template-columns: 1fr; }
.quote-cta{ grid-template-columns: 1fr; }
.map-grid{ grid-template-columns: 1fr; }
.faq-blog-grid{ grid-template-columns: 1fr; }
.services-grid{ grid-template-columns: repeat(2, 1fr); }
.media-placeholder{ height: 300px; }
.ba{ min-height: 360px; }
}
@media (max-width: 640px){
:root{ --section-pad: 44px; }
.services-grid{ grid-template-columns: 1fr; }
.areas-list ul{ columns: 1; }
.blog-card{ grid-template-columns: 1fr; }
.blog-card__img{ height: 160px !important; }
}
/* Step1 v3: facts icon tint consistency */
.facts__item-img img{ filter:none !important; }
/* Step2: Why Choose accordion (HVAC Ontario inspired) */
.whycare__grid{
display:grid;
gap: 18px;
margin-top: 26px;
}
@media (min-width: 980px){
.whycare__grid{
grid-template-columns: 1.15fr .85fr;
gap: 26px;
align-items: start;
}
}
.whycare__panel{
border: 1px solid rgba(0,0,0,.08);
background:#fff;
border-radius: 16px;
box-shadow: 0 10px 25px rgba(0,0,0,.08);
overflow:hidden;
}
.whycare__panel + .whycare__panel{ margin-top: 12px; }
.whycare__toggle{
width:100%;
text-align:left;
padding: 16px 16px;
background: transparent;
border: 0;
cursor:pointer;
display:flex;
align-items:center;
justify-content:space-between;
gap: 14px;
}
.whycare__title{
font-weight: 800;
}
.whycare__icon{
transition: transform .18s ease;
opacity:.7;
font-size: 18px;
}
.whycare__content{
padding: 0 16px 16px 16px;
color: rgba(0,0,0,.70);
line-height: 1.6;
display:none;
}
.whycare__panel.is-open .whycare__content{ display:block; }
.whycare__panel.is-open .whycare__icon{ transform: rotate(180deg); }
.whycare__card{
border: 1px solid rgba(0,0,0,.08);
background: linear-gradient(135deg, rgba(29,78,216,.08), rgba(22,163,74,.08));
border-radius: 18px;
box-shadow: 0 18px 55px rgba(0,0,0,.10);
padding: 18px;
}
@media (min-width: 980px){
.whycare__card{ position: sticky; top: 20px; padding: 22px; }
}
.whycare__badge{
display:inline-flex;
align-items:center;
gap: 8px;
padding: 8px 10px;
border-radius: 999px;
background: rgba(29,78,216,.12);
color: #1d4ed8;
font-weight: 800;
letter-spacing:.02em;
margin-bottom: 10px;
}
/* Step2 v2: HVAC Ontario "Because we care" style tabs + spacing */
.facts-with-form{
background: transparent !important;
}
.facts-with-form::before,
.facts-with-form::after{
content: none !important;
display: none !important;
}
/* container spacing */
.becausecare{
max-width: 980px;
margin: 0 auto;
}
.becausecare__title{
text-align:center;
margin-bottom: 14px;
}
.becausecare__copy{
text-align:left;
max-width: 86ch;
margin: 0 auto;
}
.becausecare__p{
margin: 0 0 12px 0;
color: rgba(0,0,0,.74);
line-height: 1.7;
}
.becausecare__readmore{
display:inline-flex;
align-items:center;
gap: 8px;
background: transparent;
border: 0;
padding: 0;
color: rgba(0,0,0,.75);
font-weight: 700;
cursor: pointer;
}
.becausecare__readmore span{ font-size: 14px; opacity: .75; }
.becausecare__tabs{
display:flex;
flex-wrap: wrap;
gap: 12px;
justify-content: space-between;
margin-top: 18px;
padding-top: 14px;
border-top: 1px solid rgba(0,0,0,.10);
}
@media (max-width: 720px){
.becausecare__tabs{ justify-content: flex-start; }
}
.becausecare__tab{
background: transparent;
border: 0;
padding: 10px 0;
cursor: pointer;
font-weight: 800;
color: rgba(0,0,0,.55);
position: relative;
letter-spacing: .01em;
}
.becausecare__tab::after{
content:"";
position:absolute;
left:0; right:0;
bottom:-6px;
height: 3px;
border-radius: 999px;
background: transparent;
transition: background .18s ease;
}
.becausecare__tab.is-active{
color: rgba(0,0,0,.92);
}
.becausecare__tab.is-active::after{
background: var(--mirza-blue, #1d4ed8);
}
.becausecare__panel{
margin-top: 18px;
padding-top: 14px;
border-top: 1px solid rgba(0,0,0,.10);
}
.becausecare__panelTitle{
margin: 0 0 10px 0;
font-weight: 900;
}
.becausecare__panelText{
margin: 0;
color: rgba(0,0,0,.74);
line-height: 1.75;
max-width: 90ch;
}
/* Step2 v3: HVAC Ontario style (big icon cards + green active) */
.facts-with-form{
background: transparent !important;
}
.facts-with-form::before,
.facts-with-form::after{
content: none !important;
display: none !important;
}
.becausecare2{
max-width: 1040px;
margin: 0 auto;
}
.becausecare2__title{
text-align:center;
margin: 0 0 12px 0;
}
.becausecare2__copy{
max-width: 92ch;
margin: 0 auto 18px auto;
}
.becausecare2__copy p{
margin: 0 0 12px 0;
color: rgba(0,0,0,.74);
line-height: 1.75;
}
/* Big clickable cards */
.becausecare2__cards{
display:grid;
grid-template-columns: repeat(4, 1fr);
gap: 16px;
margin-top: 10px;
}
@media (max-width: 980px){
.becausecare2__cards{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px){
.becausecare2__cards{ grid-template-columns: 1fr; }
}
.becausecare2__card{
border: 1px solid rgba(0,0,0,.10);
background: #fff;
border-radius: 18px;
padding: 18px 14px 16px;
cursor:pointer;
box-shadow: 0 14px 35px rgba(0,0,0,.08);
transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease;
display:flex;
flex-direction:column;
align-items:center;
text-align:center;
gap: 10px;
min-height: 140px;
}
.becausecare2__card:hover{
transform: translateY(-1px);
box-shadow: 0 18px 45px rgba(0,0,0,.10);
}
.becausecare2__icon{
width: 44px;
height: 44px;
display:grid;
place-items:center;
border-radius: 14px;
color: rgba(29,78,216,.95);
background: rgba(29,78,216,.08);
}
.becausecare2__icon svg{ width: 26px; height: 26px; }
.becausecare2__cardTitle{
font-weight: 900;
color: rgba(0,0,0,.78);
line-height: 1.2;
}
/* Active = green */
.becausecare2__card.is-active{
background: rgba(22,163,74,.10);
border-color: rgba(22,163,74,.35);
box-shadow: 0 18px 55px rgba(22,163,74,.18);
}
.becausecare2__card.is-active .becausecare2__icon{
color: #fff;
background: var(--mirza-green, #16a34a);
}
.becausecare2__card.is-active .becausecare2__cardTitle{
color: rgba(0,0,0,.92);
}
/* Panel content */
.becausecare2__panel{
margin-top: 18px;
padding-top: 18px;
border-top: 1px solid rgba(0,0,0,.12);
max-width: 980px;
margin-left:auto;
margin-right:auto;
}
.becausecare2__panelTitle{
margin: 0 0 8px 0;
font-weight: 950;
}
.becausecare2__panelLead{
margin: 0 0 10px 0;
font-weight: 800;
color: rgba(0,0,0,.72);
}
.becausecare2__panelText{
margin: 0;
color: rgba(0,0,0,.74);
line-height: 1.75;
max-width: 98ch;
}
/* Step2 v4: spacing tune */
#why-choose .becausecare2__title{ margin-bottom: 22px !important; }
#why-choose .becausecare2__copy{ margin-bottom: 28px !important; }
#why-choose .becausecare2__cards{ margin-top: 16px !important; }
#why-choose .becausecare2__panel{ margin-top: 26px !important; padding-top: 22px !important; }
#why-choose .becausecare2__copy p{ margin-bottom: 16px !important; }
/* Step2 v4: panel lead becomes the headline */
#why-choose .becausecare2__panelLead{
font-size: 1.15rem;
font-weight: 950;
color: rgba(0,0,0,.88);
margin-bottom: 10px !important;
}
/* Step2 v5: spacing + CTA */
#why-choose .becausecare2__title{ margin-bottom: 34px !important; }
#why-choose .becausecare2__copy{ margin-bottom: 44px !important; }
#why-choose .becausecare2__copy p{ margin-bottom: 18px !important; }
#why-choose .becausecare2__cards{ margin-top: 22px !important; }
#why-choose .becausecare2__panel{ margin-top: 30px !important; padding-top: 26px !important; }
/* Make the kept headline feel like the previous version */
#why-choose .becausecare2__panelLead{
font-size: 1.35rem !important; /* bigger */
font-weight: 950 !important;
color: rgba(0,0,0,.90) !important;
margin: 0 0 12px 0 !important;
}
/* CTA button inside expanded panel */
#why-choose .becausecare2__cta{
display: inline-flex;
align-items: center;
justify-content: center;
margin-top: 16px;
padding: 12px 18px;
border-radius: 999px;
background: var(--mirza-green, #16a34a);
color: #fff;
font-weight: 900;
text-decoration: none;
border: 2px solid var(--mirza-green, #16a34a);
box-shadow: 0 16px 40px rgba(22,163,74,.25);
}
#why-choose .becausecare2__cta:hover{
background: #15803d;
border-color: #15803d;
color:#fff;
}
/* Step2 v6: larger expanded titles + CTA alignment */
/* Dramatically increase expanded dropdown headline size */
#why-choose .becausecare2__panelLead{
font-size: 1.9rem !important;
line-height: 1.25 !important;
font-weight: 950 !important;
margin-bottom: 14px !important;
}
/* Align CTA button with text edge */
#why-choose .becausecare2__panel{
max-width: 760px !important;
}
#why-choose .becausecare2__panelText{
max-width: 760px !important;
}
#why-choose .becausecare2__cta{
margin-left: 0 !important;
}
/* Step2 v7: align CTA left edge with description start */
#why-choose .becausecare2__panelLead,
#why-choose .becausecare2__panelText{
max-width: none !important;
}
#why-choose .becausecare2__panel{
max-width: 760px !important; /* keep the centered content column */
}
/* Step2 v8: lock panel column so text + CTA share identical left edge */
#why-choose .becausecare2__panel{
max-width: none !important;
margin-left: auto;
margin-right: auto;
}
#why-choose .becausecare2__inner{
max-width: 760px;
margin-left: auto;
margin-right: auto;
}
#why-choose .becausecare2__cta{
display: inline-flex;
margin-left: 0;
}
/* === WHY HIRE (scroll) === */
.section__eyebrow{
margin: 0 0 10px 0;
font-size: 12px;
font-weight: 700;
letter-spacing: .08em;
text-transform: uppercase;
opacity: .75;
}
.section-whyhire{
padding-top: 36px;
padding-bottom: 36px;
}
.whyhire__grid{
display: grid;
grid-template-columns: 1fr 1fr;
gap: 26px;
align-items: start;
margin-top: 18px;
}
.whyhire__list{
max-height: 470px;
overflow-y: auto;
padding-right: 22px;
border-right: 2px solid rgba(0,0,0,.12);
}
.whyhire__list::-webkit-scrollbar{ width: 8px; }
.whyhire__list::-webkit-scrollbar-track{ background: rgba(0,0,0,.06); border-radius: 999px; }
.whyhire__list::-webkit-scrollbar-thumb{ background: rgba(0,0,0,.18); border-radius: 999px; }
.whyhire__row{
display: grid;
grid-template-columns: 64px 1fr;
gap: 18px;
padding: 18px 0;
}
.whyhire__row + .whyhire__row{
border-top: 1px solid rgba(0,0,0,.08);
}
.whyhire__icon{
width: 54px;
height: 54px;
border-radius: 999px;
display: grid;
place-items: center;
background: rgba(0,0,0,.04);
border: 1px solid rgba(0,0,0,.10);
color: rgba(17,24,39,.55);
}
.whyhire__title{
font-weight: 800;
font-size: 22px;
line-height: 1.1;
letter-spacing: -0.02em;
margin: 0 0 10px 0;
}
.whyhire__body{
color: rgba(17, 24, 39, .78);
line-height: 1.55;
font-size: 16px;
}
.whyhire__media{
border-radius: 22px;
overflow: hidden;
background: rgba(0,0,0,.06);
box-shadow: 0 10px 26px rgba(16, 24, 40, .08);
min-height: 470px;
}
.whyhire__imgph{
height: 100%;
min-height: 470px;
display: grid;
place-items: center;
font-weight: 700;
letter-spacing: .02em;
color: rgba(17, 24, 39, .55);
background:
linear-gradient(135deg, rgba(0,0,0,.04), rgba(0,0,0,.08));
}
@media (max-width: 900px){
.whyhire__grid{ grid-template-columns: 1fr; }
.whyhire__media{ min-height: 280px; }
.whyhire__imgph{ min-height: 280px; }
.whyhire__list{ max-height: none; overflow: visible; padding-right: 0; border-right: 0; }
}
/* Space between FAQ and Blog */
#blog{ margin-top: 0px; padding-top: 8px; }
/* Blog section (Latest From Our Blog) */
.blog-header{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap: 18px;
margin-bottom: 22px;
}
.blog-header__left .h2-t{ margin:0; }
.blog-header__left .section__sub{ margin:8px 0 0 0; color: var(--muted); }
.blog-header__link{
display:inline-flex;
align-items:center;
gap: 10px;
font-weight: 700;
text-decoration:none;
color: var(--mirza-blue);
white-space: nowrap;
margin-top: 10px;
}
.blog-header__link:hover{ text-decoration: underline; }
.blog-header__linkarrow{ color: var(--mirza-green); font-weight: 900; }
/* Blog cards */
.blog-grid{
display:grid;
gap: 22px;
}
@media (min-width: 900px){
.blog-grid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
.post-card{
display:block;
background:#fff;
border-radius: var(--card-radius);
box-shadow: var(--card-shadow);
border: 1px solid rgba(0,0,0,.06);
overflow:hidden;
text-decoration:none;
color: inherit;
transition: transform .18s ease, box-shadow .18s ease;
}
.post-card:hover{
transform: translateY(-6px) scale(1.01);
box-shadow: 0 16px 40px rgba(0,0,0,.14);
}
.post-card__img.media-placeholder{
height: 250px;
border: 0;
background: #111;
}
.post-card__body{
padding: 18px 18px 20px;
}
.post-card__title{
margin:0 0 14px 0;
font-size: 22px;
line-height: 1.25;
font-weight: 800;
}
.post-card__meta{
margin:0;
color: rgba(0,0,0,.55);
font-size: 14px;
}
/* Quote CTA request label/subtext */
.quote-request{ display:flex; flex-direction:column; align-items:center; justify-content:flex-start; }
.quote-request-label{ font-size:13px; color:#555; margin-bottom:4px; }
.quote-request-sub{ font-size:13px; color:#666; margin-top:4px; }
/* Make the two quote CTAs the same height */
.quote-phone,
.quote-request{
display:flex;
flex-direction:column;
justify-content:space-between;
height:82px;
}
.quote-phone-label,
.quote-request-label,
.quote-request-sub{
margin:0;
}
/* =============================
Section header centering (v22)
============================= */
.section__header{
text-align:left;
}
.section__header .section__sub{
margin-left:0;
margin-right:0;
max-width: 880px;
}
.section__header .h2-t{
margin-left:0;
margin-right:0;
}
/* Blog header: center title/subtitle, keep "View All Articles" in top-right */
.section-blog .blog-header{
position: relative;
justify-content: space-between;
}
.section-blog .blog-header__left{
width: 100%;
text-align: left;
}
.section-blog .blog-header__right{
position: absolute;
right: 0;
top: 6px;
}
@media (max-width: 720px){
.section-blog .blog-header{
display: flex;
flex-direction: column;
gap: 10px;
align-items: center;
}
.section-blog .blog-header__right{
position: static;
}
}
#why-choose .becausecare2__title,
#why-choose .becausecare2__copy{
text-align: left;
}
#why-choose .becausecare2__copy{
margin-left:0;
margin-right:0;
max-width: none;
width: 100%;
}
/* --- Fix: Why Choose panel width + CTA alignment --- */
#why-choose .becausecare2__panel{
max-width: none !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
#why-choose .becausecare2__inner,
#why-choose .becausecare2__panelText{
max-width: none !important;
}
#why-choose .becausecare2__panelText{
width: 100%;
}
#why-choose .becausecare2__cta{
padding: 10px 14px !important;
font-size: 14px !important;
font-weight: 800 !important;
margin-top: 14px !important;
}
/* --- Fix: Gallery layout like reference (center slide larger, controls only on center) --- */
.work-splide{
overflow: visible;
}
.work-splide .splide__track{
overflow: visible !important; /* allow scaled center card */
padding: 22px 0 34px; /* prevents top/bottom clipping */
}
.work-splide .splide__list{
align-items: stretch;
}
.work-splide .splide__slide{
opacity: .22;
transform: scale(.90);
transition: transform .25s ease, opacity .25s ease;
transform-origin: center center;
}
.work-splide .splide__slide.is-active{
opacity: 1;
transform: scale(1.14);
z-index: 3;
}
/* Only show before/after interaction on the active (center) card */
.work-splide .splide__slide:not(.is-active) .ba__range,
.work-splide .splide__slide:not(.is-active) .ba__divider,
.work-splide .splide__slide:not(.is-active) .ba__labels{
display: none !important;
}
.work-splide .splide__slide:not(.is-active) .ba__img--after{
display: none !important;
}
.work-splide .splide__slide:not(.is-active) .ba{
cursor: default;
}
/* Disable carousel drag behavior (arrows only) */
.work-splide .splide__track{
touch-action: pan-y;
cursor: default;
}
/* Gallery arrows + dots row */
.work-nav{
display:flex;
align-items:center;
justify-content:center;
gap: 16px;
margin: 14px auto 0;
max-width: 560px;
padding: 0 14px;
}
.work-arrow{
width: 44px;
height: 44px;
border-radius: 999px;
border: 1px solid rgba(0,0,0,.14);
background:#fff;
box-shadow: 0 12px 28px rgba(0,0,0,.08);
font-size: 28px;
line-height: 1;
color: rgba(0,0,0,.72);
cursor:pointer;
}
.work-arrow:hover{
transform: translateY(-1px);
box-shadow: 0 16px 34px rgba(0,0,0,.10);
}
/* Force pagination to sit inside the nav row (override Splide defaults) */
.work-nav .splide__pagination{
position: static !important;
left: auto !important;
bottom: auto !important;
transform: none !important;
margin: 0 !important;
width: auto !important;
pointer-events: auto !important;
display:flex !important;
gap: 10px;
justify-content:center !important;
align-items:center !important;
}
* Step1 v3: brand palette + hero CTA */
:root{
--mirza-green:#16a34a;
--mirza-blue:#1d4ed8;
}
.promo__btn{
background: var(--mirza-green) !important;
border-color: var(--mirza-green) !important;
color: #fff !important;
}
.promo__btn i{ color:#fff !important; }
.promo__btn:hover{
background: #15803d !important;
border-color: #15803d !important;
color:#fff !important;
}
/* ============================
Layout polish overrides (v2)
Goal: keep Superior-like light feel, fix sizing/spacing, keep mobile seamless.
No global dark theme overrides.
============================ */
:root{
--container: 1180px;
--gutter: 18px;
--section-y: 56px;
}
@media (min-width: 900px){
:root{ --gutter: 26px; --section-y: 84px; }
}
.container{
width: min(var(--container), calc(100% - (var(--gutter) * 2)));
margin-inline: auto;
}
.section{
padding-block: var(--section-y);
}
.section__head{
text-align: left;
max-width: 820px;
margin: 0 0 28px 0;
}
.section__title{
margin: 0 0 10px 0;
line-height: 1.1;
}
.section__sub{
margin: 0;
}
/* Buttons: keep it clean, not dark-mode */
.btn{
display:inline-flex;
align-items:center;
justify-content:center;
padding: 14px 18px;
border-radius: 999px;
font-weight: 700;
border: 1px solid rgba(0,0,0,.12);
background: #ffffff;
transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
box-shadow: 0 10px 25px rgba(0,0,0,.10);
}
.btn:hover{ transform: translateY(-1px); box-shadow: 0 16px 38px rgba(0,0,0,.14); }
.btn--primary{
border-color: rgba(0,0,0,.08);
background: linear-gradient(135deg, #ffb703, #fb8500);
color: #111;
}
/* HERO: keep image natural */
.hero__media img,
.hero img{
filter: none !important;
mix-blend-mode: normal !important;
opacity: 1 !important;
}
/* Trust strip: align nicely */
.truststrip{
display:grid;
gap: 14px;
margin-top: 18px;
}
@media (min-width: 760px){
.truststrip{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
.truststrip__item{
border: 1px solid rgba(0,0,0,.08);
background: #fff;
border-radius: 16px;
padding: 14px 16px;
box-shadow: 0 10px 25px rgba(0,0,0,.08);
}
.truststrip__icon{
width: 42px; height: 42px;
border-radius: 14px;
display:grid; place-items:center;
background: rgba(251,133,0,.10);
}
/* WHY HIRE: slideshow left, bubbles right, sane sizing */
.whyhire__wrap{
display:grid;
gap: 18px;
align-items: start;
}
@media (min-width: 980px){
.whyhire__wrap{
grid-template-columns: 1.05fr .95fr;
gap: 28px;
align-items: center;
}
}
/* Carousel container size */
.whyhire__slider{
border-radius: 18px;
overflow:hidden;
border: 1px solid rgba(0,0,0,.10);
box-shadow: 0 18px 55px rgba(0,0,0,.12);
background: #fff;
}
.whyhire__slider img{
width: 100%;
height: 280px;
object-fit: cover;
display:block;
}
@media (min-width: 980px){
.whyhire__slider img{ height: 420px; }
}
/* Bubbles: not a vertical ugly stack */
.bubbles{
display:grid;
gap: 12px;
}
@media (min-width: 700px){
.bubbles{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (min-width: 980px){
.bubbles{ grid-template-columns: 1fr; }
}
.bubble{
border: 1px solid rgba(0,0,0,.08);
background: #fff;
border-radius: 16px;
padding: 14px 16px;
box-shadow: 0 10px 25px rgba(0,0,0,.08);
}
.bubble__title{ margin:0 0 6px 0; font-weight:800; }
.bubble__text{ margin:0; color: rgba(0,0,0,.70); line-height:1.55; }
/* Reviews + Logos sliders: consistent card sizing */
.reviewcard, .logocard{
border: 1px solid rgba(0,0,0,.08);
background: #fff;
border-radius: 16px;
padding: 16px;
height: 100%;
box-shadow: 0 10px 25px rgba(0,0,0,.08);
}
.reviewcard__meta{
display:flex; align-items:center; gap:10px; margin-bottom:10px;
}
.reviewcard__source{
font-weight: 800;
}
.reviewcard__text{ margin:0; color: rgba(0,0,0,.70); line-height:1.55; }
.reviewcard__stars{ color: #fb8500; font-weight:800; }
.logocard{
display:grid; place-items:center;
padding: 18px;
}
.logocard img{ max-height: 44px; width:auto; opacity:.9; }
/* Services: clean grid */
.services__grid{
display:grid;
gap: 14px;
}
@media (min-width: 760px){
.services__grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (min-width: 1050px){
.services__grid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
.servicecard{
border: 1px solid rgba(0,0,0,.08);
background: #fff;
border-radius: 16px;
padding: 16px;
box-shadow: 0 10px 25px rgba(0,0,0,.08);
}
.servicecard__title{ margin:0 0 6px 0; font-weight:800; }
.servicecard__text{ margin:0; color: rgba(0,0,0,.70); line-height:1.55; }
/* CTA: similar to Superior vibe (light, bold, clean) */
.cta{
border-radius: 22px;
background: linear-gradient(135deg, rgba(255,183,3,.16), rgba(251,133,0,.10));
border: 1px solid rgba(0,0,0,.08);
box-shadow: 0 18px 55px rgba(0,0,0,.10);
overflow:hidden;
}
.cta__wrap{
display:grid;
gap: 18px;
align-items:center;
padding: 20px;
}
@media (min-width: 980px){
.cta__wrap{
grid-template-columns: 1.1fr .9fr;
padding: 28px;
}
}
/* Quote hero (split text + worker visual) */
.quote-hero{
display:grid;
grid-template-columns: 1.05fr .95fr;
gap: 26px;
align-items: center;
padding: 34px 34px;
border-radius: 26px;
background: #fff;
box-shadow: var(--card-shadow);
border: 1px solid rgba(0,0,0,.06);
}
.quote-hero__text p{
max-width: 62ch;
color: rgba(0,0,0,.75);
}
.quote-hero__actions{
margin-top: 22px;
}
.section-quote .btn-green{
background: #1faa62;
border-color: #1faa62;
color:#fff;
}
.section-quote .btn-green:hover{
filter: brightness(.95);
transform: translateY(-1px);
}
.quote-cta-buttons{
display:flex;
align-items:stretch;
gap:20px;
margin-top:25px;
flex-wrap:nowrap;
}
/* Two-column CTA blocks (equal height) */
.quote-cta-col{
display:flex;
flex-direction:column;
justify-content:flex-start;
gap:2px;
}
.quote-cta-primary{
font-size:24px;
font-weight:800;
color:#1c3faa;
text-decoration:none;
white-space:nowrap;
line-height:1.05;
}
.quote-phone-label, .quote-request-sub{
font-size:15px !important;
color:#6a6a6a !important;
font-weight:500 !important;
font-family:inherit !important;
line-height:1.2 !important;
margin:0 !important;
}
/* Keep the “We’ll get back to you” snug under the CTA */
.quote-request-sub{ margin-top:2px !important; }
.quote-phone-number::before, .quote-phone-number::after, .quote-request-link::before, .quote-request-link::after{
content:none !important;
}
.quote-phone-number, .quote-request-link{ background:none !important; padding-left:0 !important; }
.quote-phone-number{ }
.quote-or{
font-weight:600;
color:#666;
font-size:14px;
align-self:center;
}
.quote-request-link{ }
.quote-request-btn{
background:#21a366;
color:#fff;
padding:10px 22px;
border-radius:26px;
font-weight:700;
font-size:13px;
text-decoration:none;
display:inline-block;
transition:0.2s;
white-space:nowrap;
}
.quote-request-btn:hover{
background:#1b8a56;
transform:translateY(-2px);
}
/* On small screens, allow wrapping so it doesn't overflow */
@media (max-width: 640px){
.quote-cta-buttons{
flex-wrap:wrap;
gap:14px;
}
}
@media (max-width: 520px){
.quote-phone-number{ font-size: 28px; }
/* Ensure no icon/square appears before the phone number */
.quote-phone-number::before,
.quote-phone-number:before{
content: none !important;
display: none !important;
}
.quote-phone-number{
padding-left:0 !important;
background:none !important;
}
}
.quote-hero__visual{
position: relative;
height: 420px;
border-radius: 22px;
overflow: hidden;
background: transparent;
}
.quote-hero__rings{
position:absolute;
inset: -40px -40px -40px -40px;
}
.quote-hero__rings::before,
.quote-hero__rings::after{
content:"";
position:absolute;
right: -60px;
bottom: -80px;
width: 520px;
height: 520px;
border-radius: 999px;
background: rgba(0,0,0,.07);
}
.quote-hero__rings::after{
width: 620px;
height: 620px;
right: -110px;
bottom: -130px;
background: transparent;
border: 10px solid rgba(255,255,255,.85);
box-shadow: 0 0 0 4px rgba(0,0,0,.06) inset;
}
.quote-hero__worker{
position:absolute;
right: 70px;
bottom: 0;
width: 260px;
height: 380px;
background: #000;
border-radius: 14px;
}
@media (max-width: 900px){
.quote-hero{
grid-template-columns: 1fr;
padding: 26px 22px;
}
.quote-hero__visual{
height: 360px;
}
.quote-hero__worker{
right: 22px;
width: 220px;
height: 320px;
}
}
/* Map section spacing */
.map__wrap{
display:grid;
gap: 16px;
}
@media (min-width: 980px){
.map__wrap{ grid-template-columns: 1.1fr .9fr; gap: 24px; align-items: start; }
}
.map__embed{
border-radius: 18px;
overflow:hidden;
border: 1px solid rgba(0,0,0,.10);
box-shadow: 0 18px 55px rgba(0,0,0,.10);
}
/* FAQ */
.faq__item{
border: 1px solid rgba(0,0,0,.08);
background: #fff;
border-radius: 16px;
overflow:hidden;
box-shadow: 0 10px 25px rgba(0,0,0,.08);
}
.faq__q{
width:100%;
text-align:left;
padding: 14px 16px;
background: transparent;
border: 0;
font-weight: 800;
cursor:pointer;
display:flex;
justify-content:space-between;
gap: 12px;
}
.faq__a{
padding: 0 16px 14px 16px;
color: rgba(0,0,0,.70);
display:none;
line-height:1.55;
}
.faq__item.is-open .faq__a{ display:block; }
/* Before/After: keep it clean */
.ba{
border-radius: 18px;
overflow:hidden;
border: 1px solid rgba(0,0,0,.10);
box-shadow: 0 18px 55px rgba(0,0,0,.10);
}
/* Splide arrows/pagination (light) */
.splide__arrow{
background: rgba(255,255,255,.92) !important;
border: 1px solid rgba(0,0,0,.10) !important;
box-shadow: 0 10px 25px rgba(0,0,0,.10);
}
.splide__pagination__page{
background: rgba(0,0,0,.22) !important;
}
.splide__pagination__page.is-active{
background: rgba(0,0,0,.55) !important;
}
/* Custom layout overrides/additions for Grease Trap site.
Keep this file separate so edits are easy and mobile stays consistent. */
:root{
--section-pad: 56px;
--card-radius: 16px;
--card-shadow: 0 10px 30px rgba(0,0,0,.08);
--muted: rgba(0,0,0,.65);
--line: rgba(0,0,0,.12);
}
.section{
padding: var(--section-pad) 0;
}
.section__header{
margin-bottom: 22px;
}
.section__header--tight{
margin-bottom: 14px;
}
.section__sub{
margin-top: 8px;
color: var(--muted);
max-width: 72ch;
}
.section__divider{
height: 1px;
background: var(--line);
margin: 30px 0;
}
/* Two column layout (slideshow + bubbles) */
.two-col{
display: grid;
grid-template-columns: 1.1fr .9fr;
gap: 28px;
align-items: start;
}
.two-col__media .splide{
border-radius: var(--card-radius);
overflow: hidden;
box-shadow: var(--card-shadow);
background: #fff;
}
.media-placeholder{
height: 360px;
display: grid;
place-items: center;
background: linear-gradient(135deg, rgba(0,0,0,.04), rgba(0,0,0,.02));
border: 1px dashed var(--line);
color: rgba(0,0,0,.5);
font-weight: 600;
text-align: center;
padding: 18px;
}
.media-placeholder span{
max-width: 28ch;
}
.bubble{
background: #fff;
border-radius: var(--card-radius);
box-shadow: var(--card-shadow);
padding: 18px 18px;
border: 1px solid rgba(0,0,0,.06);
}
.bubble + .bubble{ margin-top: 14px; }
.bubble__title{
margin: 0 0 6px 0;
font-size: 18px;
line-height: 1.25;
}
.bubble__text{
margin: 0;
color: var(--muted);
}
.two-col__cta{
margin-top: 18px;
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 14px;
}
.fineprint{
margin: 0;
color: var(--muted);
font-size: 14px;
}
/* Reviews */
.review-card{
background: #fff;
border-radius: var(--card-radius);
box-shadow: var(--card-shadow);
padding: 18px;
border: 1px solid rgba(0,0,0,.06);
min-height: 190px;
display: flex;
flex-direction: column;
}
.review-card__top{
display:flex;
align-items:center;
justify-content: space-between;
gap: 10px;
margin-bottom: 10px;
}
.badge{
display:inline-flex;
align-items:center;
padding: 6px 10px;
border-radius: 999px;
background: rgba(0,0,0,.06);
font-weight: 700;
font-size: 12px;
}
.stars{
letter-spacing: 1px;
font-size: 14px;
}
.review-card__text{
color: var(--muted);
margin: 0 0 12px 0;
flex: 1;
}
.review-card__meta{
margin: 0;
font-weight: 700;
font-size: 14px;
}
/* Logo carousel */
.logos .splide__slide{
padding: 6px 0;
}
.logo-card{
background: #fff;
border-radius: 14px;
border: 1px solid rgba(0,0,0,.08);
height: 70px;
display: grid;
place-items: center;
color: rgba(0,0,0,.55);
font-weight: 700;
}
/* Services grid */
.services-grid{
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px;
}
@media (max-width: 680px){
.services-grid{ grid-template-columns: 1fr; }
}
.service-card{
background: #fff;
border-radius: var(--card-radius);
box-shadow: var(--card-shadow);
border: 1px solid rgba(0,0,0,.06);
overflow: hidden;
padding: 0;
transition: transform .18s ease, box-shadow .18s ease;
}
.service-card:hover{
transform: translateY(-6px) scale(1.02);
box-shadow: 0 16px 40px rgba(0,0,0,.14);
}
.service-card__title{
margin: 0;
font-size: 20px;
line-height: 1.2;
}
.service-card__text{
margin: 0;
color: var(--muted);
line-height: 1.6;
}
.service-card__media{
margin: 0;
border-radius: 0;
overflow: hidden;
}
.service-card__media .media-placeholder{
height: 190px;
}
.service-card__body{
padding: 18px;
display: flex;
flex-direction: column;
gap: 10px;
}
.service-card__scroll{
max-height: 110px;
overflow: auto;
padding-right: 6px;
}
.service-card__link{
margin-top: auto;
display: inline-flex;
align-items: center;
gap: 8px;
font-weight: 700;
text-decoration: none;
color: var(--mirza-blue);
}
.service-card__link:hover{
text-decoration: underline;
}
.service-card__arrow{
color: var(--mirza-green);
font-weight: 900;
}
/* Before/After component */
.ba{
position: relative;
border-radius: var(--card-radius);
overflow: hidden;
box-shadow: var(--card-shadow);
background: #fff;
min-height: 320px;
}
.ba__img{
position: absolute;
inset: 0;
}
.ba__img--before{
z-index: 1;
}
.ba__img--after{
z-index: 2;
clip-path: inset(0 0 0 50%);
}
.ba__img .media-placeholder{
height: 100%;
border: 0;
}
.ba__divider{
position: absolute;
top: 0;
bottom: 0;
left: 50%;
width: 3px;
background: rgba(255,255,255,.9);
box-shadow: 0 0 0 1px rgba(0,0,0,.18);
z-index: 3;
}
.ba__divider::after{
content:"";
position:absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
width: 44px;
height: 44px;
border-radius: 999px;
background: rgba(0,0,0,.65);
box-shadow: 0 8px 18px rgba(0,0,0,.25);
}
.ba__divider::before{
content:"↔";
position:absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
z-index: 2;
color: #fff;
font-weight: 900;
font-size: 18px;
}
.ba__range{
position: absolute;
inset: 0;
opacity: 0;
z-index: 4;
cursor: ew-resize;
}
.ba__labels{
position:absolute;
left: 12px;
right: 12px;
top: 12px;
z-index: 5;
display:flex;
justify-content: space-between;
pointer-events:none;
}
.ba__label{
background: rgba(0,0,0,.6);
color: #fff;
padding: 6px 10px;
border-radius: 999px;
font-size: 12px;
font-weight: 800;
}
/* Quote CTA */
.section-quote{
background: rgba(0,0,0,.03);
}
.quote-cta{
display:grid;
grid-template-columns: 1.2fr .8fr;
gap: 22px;
align-items: center;
padding: 26px;
border-radius: 22px;
background: #fff;
box-shadow: var(--card-shadow);
border: 1px solid rgba(0,0,0,.06);
}
.quote-cta__actions{
display:flex;
flex-wrap: wrap;
gap: 12px;
margin-top: 14px;
}
.btn-outline{
display:inline-flex;
align-items:center;
justify-content:center;
padding: 14px 18px;
border-radius: 12px;
border: 1px solid rgba(0,0,0,.18);
color: rgba(0,0,0,.85);
background: transparent;
font-weight: 800;
text-decoration: none;
}
.btn-outline:hover{
background: rgba(0,0,0,.04);
}
.quote-bullets{
display:grid;
gap: 10px;
}
.quote-bullet{
background: rgba(0,0,0,.04);
border: 1px solid rgba(0,0,0,.06);
border-radius: 14px;
padding: 12px 14px;
font-weight: 700;
}
/* Map + areas */
.map-grid{
display:grid;
grid-template-columns: .92fr 1.08fr;
gap: 18px;
align-items: stretch;
}
.map-embed{
border-radius: var(--card-radius);
overflow: hidden;
border: 1px solid rgba(0,0,0,.08);
box-shadow: var(--card-shadow);
background: #fff;
/* Compact height; users scroll inside the city list */
height: 390px;
min-height: 390px;
}
.map-embed iframe{
width: 100%;
height: 100%;
min-height: 390px;
border: 0;
}
/* Areas panel (left) */
.areas-panel{
background: #061b4b;
color: #fff;
border-radius: var(--card-radius);
box-shadow: var(--card-shadow);
border: 1px solid rgba(255,255,255,.08);
padding: 18px 18px 16px;
/* Compact height + internal scroll for long lists */
height: 390px;
min-height: 390px;
overflow: hidden;
position: relative;
}
.areas-panel__intro{
margin: 0 0 14px 0;
color: rgba(255,255,255,.88);
font-size: 16px;
line-height: 1.35;
}
.areas-panel__cols{
display:grid;
grid-template-columns: 1fr 1fr;
gap: 22px;
height: calc(100% - 36px);
overflow-y: auto;
padding-right: 8px;
}
/* Scrollbar (webkit) */
.areas-panel__cols::-webkit-scrollbar{ width: 10px; }
.areas-panel__cols::-webkit-scrollbar-track{ background: rgba(255,255,255,.10); border-radius: 99px; }
.areas-panel__cols::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.35); border-radius: 99px; }
.areas-panel__cols::-webkit-scrollbar-thumb:hover{ background: rgba(255,255,255,.48); }
.areas-group{ margin: 0 0 18px 0; }
.areas-group__title{
margin: 0 0 10px 0;
font-size: 16px;
font-weight: 800;
letter-spacing: .02em;
text-transform: none;
color: #fff;
}
.areas-items{
list-style: none;
margin: 0;
padding: 0;
}
.areas-items li{
display:flex;
align-items:center;
gap: 10px;
padding: 10px 0;
border-bottom: 1px solid rgba(255,255,255,.10);
color: rgba(255,255,255,.92);
font-size: 16px;
line-height: 1.2;
}
.areas-items li:last-child{ border-bottom: 0; }
.areas-pin{
width: 26px;
height: 26px;
border-radius: 999px;
background: rgba(255,255,255,.10);
display:inline-flex;
align-items:center;
justify-content:center;
flex: 0 0 26px;
position: relative;
}
.areas-pin:before{
content:"";
width: 13px;
height: 13px;
background: var(--mirza-green);
border-radius: 999px;
display:block;
box-shadow: 0 0 0 3px rgba(22,163,74,.22);
}
/* Responsive */
@media (max-width: 980px){
.map-grid{ grid-template-columns: 1fr; }
.areas-panel{ height: 390px; min-height: 390px; }
.map-embed{ height: 390px; min-height: 390px; }
.areas-panel__cols{ grid-template-columns: 1fr 1fr; height: auto; max-height: 360px; }
}
@media (max-width: 620px){
.areas-panel__cols{ grid-template-columns: 1fr; max-height: 420px; }
}
/* FAQ + blog */
.faq-blog-grid{
display:grid;
grid-template-columns: 1fr;
gap: 22px;
align-items: start;
}
.faq-item{
background:#fff;
border-radius: 14px;
border: 1px solid rgba(0,0,0,.08);
box-shadow: var(--card-shadow);
padding: 12px 14px;
}
.faq-item + .faq-item{ margin-top: 12px; }
.faq-item summary{
cursor: pointer;
font-weight: 800;
}
.faq-item p{
margin: 10px 0 0 0;
color: var(--muted);
}
.blog-cards{
display:grid;
gap: 12px;
}
.blog-card{
display:grid;
grid-template-columns: 120px 1fr;
gap: 14px;
align-items: center;
text-decoration: none;
background:#fff;
border-radius: var(--card-radius);
border: 1px solid rgba(0,0,0,.06);
box-shadow: var(--card-shadow);
overflow:hidden;
}
.blog-card__img.media-placeholder{ height: 96px; }
.blog-card__body{ padding: 12px 14px; }
.blog-card__title{
margin: 0 0 6px 0;
font-size: 16px;
color: rgba(0,0,0,.9);
}
.blog-card__meta{
margin: 0;
color: var(--muted);
font-size: 13px;
}
/* Mobile */
@media (max-width: 992px){
.two-col{ grid-template-columns: 1fr; }
.quote-cta{ grid-template-columns: 1fr; }
.map-grid{ grid-template-columns: 1fr; }
.faq-blog-grid{ grid-template-columns: 1fr; }
.services-grid{ grid-template-columns: repeat(2, 1fr); }
.media-placeholder{ height: 300px; }
.ba{ min-height: 360px; }
}
@media (max-width: 640px){
:root{ --section-pad: 44px; }
.services-grid{ grid-template-columns: 1fr; }
.areas-list ul{ columns: 1; }
.blog-card{ grid-template-columns: 1fr; }
.blog-card__img{ height: 160px !important; }
}
/* Step1 v3: facts icon tint consistency */
.facts__item-img img{ filter:none !important; }
/* Step2: Why Choose accordion (HVAC Ontario inspired) */
.whycare__grid{
display:grid;
gap: 18px;
margin-top: 26px;
}
@media (min-width: 980px){
.whycare__grid{
grid-template-columns: 1.15fr .85fr;
gap: 26px;
align-items: start;
}
}
.whycare__panel{
border: 1px solid rgba(0,0,0,.08);
background:#fff;
border-radius: 16px;
box-shadow: 0 10px 25px rgba(0,0,0,.08);
overflow:hidden;
}
.whycare__panel + .whycare__panel{ margin-top: 12px; }
.whycare__toggle{
width:100%;
text-align:left;
padding: 16px 16px;
background: transparent;
border: 0;
cursor:pointer;
display:flex;
align-items:center;
justify-content:space-between;
gap: 14px;
}
.whycare__title{
font-weight: 800;
}
.whycare__icon{
transition: transform .18s ease;
opacity:.7;
font-size: 18px;
}
.whycare__content{
padding: 0 16px 16px 16px;
color: rgba(0,0,0,.70);
line-height: 1.6;
display:none;
}
.whycare__panel.is-open .whycare__content{ display:block; }
.whycare__panel.is-open .whycare__icon{ transform: rotate(180deg); }
.whycare__card{
border: 1px solid rgba(0,0,0,.08);
background: linear-gradient(135deg, rgba(29,78,216,.08), rgba(22,163,74,.08));
border-radius: 18px;
box-shadow: 0 18px 55px rgba(0,0,0,.10);
padding: 18px;
}
@media (min-width: 980px){
.whycare__card{ position: sticky; top: 20px; padding: 22px; }
}
.whycare__badge{
display:inline-flex;
align-items:center;
gap: 8px;
padding: 8px 10px;
border-radius: 999px;
background: rgba(29,78,216,.12);
color: #1d4ed8;
font-weight: 800;
letter-spacing:.02em;
margin-bottom: 10px;
}
/* Step2 v2: HVAC Ontario "Because we care" style tabs + spacing */
.facts-with-form{
background: transparent !important;
}
.facts-with-form::before,
.facts-with-form::after{
content: none !important;
display: none !important;
}
/* container spacing */
.becausecare{
max-width: 980px;
margin: 0 auto;
}
.becausecare__title{
text-align:center;
margin-bottom: 14px;
}
.becausecare__copy{
text-align:left;
max-width: 86ch;
margin: 0 auto;
}
.becausecare__p{
margin: 0 0 12px 0;
color: rgba(0,0,0,.74);
line-height: 1.7;
}
.becausecare__readmore{
display:inline-flex;
align-items:center;
gap: 8px;
background: transparent;
border: 0;
padding: 0;
color: rgba(0,0,0,.75);
font-weight: 700;
cursor: pointer;
}
.becausecare__readmore span{ font-size: 14px; opacity: .75; }
.becausecare__tabs{
display:flex;
flex-wrap: wrap;
gap: 12px;
justify-content: space-between;
margin-top: 18px;
padding-top: 14px;
border-top: 1px solid rgba(0,0,0,.10);
}
@media (max-width: 720px){
.becausecare__tabs{ justify-content: flex-start; }
}
.becausecare__tab{
background: transparent;
border: 0;
padding: 10px 0;
cursor: pointer;
font-weight: 800;
color: rgba(0,0,0,.55);
position: relative;
letter-spacing: .01em;
}
.becausecare__tab::after{
content:"";
position:absolute;
left:0; right:0;
bottom:-6px;
height: 3px;
border-radius: 999px;
background: transparent;
transition: background .18s ease;
}
.becausecare__tab.is-active{
color: rgba(0,0,0,.92);
}
.becausecare__tab.is-active::after{
background: var(--mirza-blue, #1d4ed8);
}
.becausecare__panel{
margin-top: 18px;
padding-top: 14px;
border-top: 1px solid rgba(0,0,0,.10);
}
.becausecare__panelTitle{
margin: 0 0 10px 0;
font-weight: 900;
}
.becausecare__panelText{
margin: 0;
color: rgba(0,0,0,.74);
line-height: 1.75;
max-width: 90ch;
}
/* Step2 v3: HVAC Ontario style (big icon cards + green active) */
.facts-with-form{
background: transparent !important;
}
.facts-with-form::before,
.facts-with-form::after{
content: none !important;
display: none !important;
}
.becausecare2{
max-width: 1040px;
margin: 0 auto;
}
.becausecare2__title{
text-align:center;
margin: 0 0 12px 0;
}
.becausecare2__copy{
max-width: 92ch;
margin: 0 auto 18px auto;
}
.becausecare2__copy p{
margin: 0 0 12px 0;
color: rgba(0,0,0,.74);
line-height: 1.75;
}
/* Big clickable cards */
.becausecare2__cards{
display:grid;
grid-template-columns: repeat(4, 1fr);
gap: 16px;
margin-top: 10px;
}
@media (max-width: 980px){
.becausecare2__cards{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px){
.becausecare2__cards{ grid-template-columns: 1fr; }
}
.becausecare2__card{
border: 1px solid rgba(0,0,0,.10);
background: #fff;
border-radius: 18px;
padding: 18px 14px 16px;
cursor:pointer;
box-shadow: 0 14px 35px rgba(0,0,0,.08);
transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease;
display:flex;
flex-direction:column;
align-items:center;
text-align:center;
gap: 10px;
min-height: 140px;
}
.becausecare2__card:hover{
transform: translateY(-1px);
box-shadow: 0 18px 45px rgba(0,0,0,.10);
}
.becausecare2__icon{
width: 44px;
height: 44px;
display:grid;
place-items:center;
border-radius: 14px;
color: rgba(29,78,216,.95);
background: rgba(29,78,216,.08);
}
.becausecare2__icon svg{ width: 26px; height: 26px; }
.becausecare2__cardTitle{
font-weight: 900;
color: rgba(0,0,0,.78);
line-height: 1.2;
}
/* Active = green */
.becausecare2__card.is-active{
background: rgba(22,163,74,.10);
border-color: rgba(22,163,74,.35);
box-shadow: 0 18px 55px rgba(22,163,74,.18);
}
.becausecare2__card.is-active .becausecare2__icon{
color: #fff;
background: var(--mirza-green, #16a34a);
}
.becausecare2__card.is-active .becausecare2__cardTitle{
color: rgba(0,0,0,.92);
}
/* Panel content */
.becausecare2__panel{
margin-top: 18px;
padding-top: 18px;
border-top: 1px solid rgba(0,0,0,.12);
max-width: 980px;
margin-left:auto;
margin-right:auto;
}
.becausecare2__panelTitle{
margin: 0 0 8px 0;
font-weight: 950;
}
.becausecare2__panelLead{
margin: 0 0 10px 0;
font-weight: 800;
color: rgba(0,0,0,.72);
}
.becausecare2__panelText{
margin: 0;
color: rgba(0,0,0,.74);
line-height: 1.75;
max-width: 98ch;
}
/* Step2 v4: spacing tune */
#why-choose .becausecare2__title{ margin-bottom: 22px !important; }
#why-choose .becausecare2__copy{ margin-bottom: 28px !important; }
#why-choose .becausecare2__cards{ margin-top: 16px !important; }
#why-choose .becausecare2__panel{ margin-top: 26px !important; padding-top: 22px !important; }
#why-choose .becausecare2__copy p{ margin-bottom: 16px !important; }
/* Step2 v4: panel lead becomes the headline */
#why-choose .becausecare2__panelLead{
font-size: 1.15rem;
font-weight: 950;
color: rgba(0,0,0,.88);
margin-bottom: 10px !important;
}
/* Step2 v5: spacing + CTA */
#why-choose .becausecare2__title{ margin-bottom: 34px !important; }
#why-choose .becausecare2__copy{ margin-bottom: 44px !important; }
#why-choose .becausecare2__copy p{ margin-bottom: 18px !important; }
#why-choose .becausecare2__cards{ margin-top: 22px !important; }
#why-choose .becausecare2__panel{ margin-top: 30px !important; padding-top: 26px !important; }
/* Make the kept headline feel like the previous version */
#why-choose .becausecare2__panelLead{
font-size: 1.35rem !important; /* bigger */
font-weight: 950 !important;
color: rgba(0,0,0,.90) !important;
margin: 0 0 12px 0 !important;
}
/* CTA button inside expanded panel */
#why-choose .becausecare2__cta{
display: inline-flex;
align-items: center;
justify-content: center;
margin-top: 16px;
padding: 12px 18px;
border-radius: 999px;
background: var(--mirza-green, #16a34a);
color: #fff;
font-weight: 900;
text-decoration: none;
border: 2px solid var(--mirza-green, #16a34a);
box-shadow: 0 16px 40px rgba(22,163,74,.25);
}
#why-choose .becausecare2__cta:hover{
background: #15803d;
border-color: #15803d;
color:#fff;
}
/* Step2 v6: larger expanded titles + CTA alignment */
/* Dramatically increase expanded dropdown headline size */
#why-choose .becausecare2__panelLead{
font-size: 1.9rem !important;
line-height: 1.25 !important;
font-weight: 950 !important;
margin-bottom: 14px !important;
}
/* Align CTA button with text edge */
#why-choose .becausecare2__panel{
max-width: 760px !important;
}
#why-choose .becausecare2__panelText{
max-width: 760px !important;
}
#why-choose .becausecare2__cta{
margin-left: 0 !important;
}
/* Step2 v7: align CTA left edge with description start */
#why-choose .becausecare2__panelLead,
#why-choose .becausecare2__panelText{
max-width: none !important;
}
#why-choose .becausecare2__panel{
max-width: 760px !important; /* keep the centered content column */
}
/* Step2 v8: lock panel column so text + CTA share identical left edge */
#why-choose .becausecare2__panel{
max-width: none !important;
margin-left: auto;
margin-right: auto;
}
#why-choose .becausecare2__inner{
max-width: 760px;
margin-left: auto;
margin-right: auto;
}
#why-choose .becausecare2__cta{
display: inline-flex;
margin-left: 0;
}
/* === WHY HIRE (scroll) === */
.section__eyebrow{
margin: 0 0 10px 0;
font-size: 12px;
font-weight: 700;
letter-spacing: .08em;
text-transform: uppercase;
opacity: .75;
}
.section-whyhire{
padding-top: 36px;
padding-bottom: 36px;
}
.whyhire__grid{
display: grid;
grid-template-columns: 1fr 1fr;
gap: 26px;
align-items: start;
margin-top: 18px;
}
.whyhire__list{
max-height: 470px;
overflow-y: auto;
padding-right: 22px;
border-right: 2px solid rgba(0,0,0,.12);
}
.whyhire__list::-webkit-scrollbar{ width: 8px; }
.whyhire__list::-webkit-scrollbar-track{ background: rgba(0,0,0,.06); border-radius: 999px; }
.whyhire__list::-webkit-scrollbar-thumb{ background: rgba(0,0,0,.18); border-radius: 999px; }
.whyhire__row{
display: grid;
grid-template-columns: 64px 1fr;
gap: 18px;
padding: 18px 0;
}
.whyhire__row + .whyhire__row{
border-top: 1px solid rgba(0,0,0,.08);
}
.whyhire__icon{
width: 54px;
height: 54px;
border-radius: 999px;
display: grid;
place-items: center;
background: rgba(0,0,0,.04);
border: 1px solid rgba(0,0,0,.10);
color: rgba(17,24,39,.55);
}
.whyhire__title{
font-weight: 800;
font-size: 22px;
line-height: 1.1;
letter-spacing: -0.02em;
margin: 0 0 10px 0;
}
.whyhire__body{
color: rgba(17, 24, 39, .78);
line-height: 1.55;
font-size: 16px;
}
.whyhire__media{
border-radius: 22px;
overflow: hidden;
background: rgba(0,0,0,.06);
box-shadow: 0 10px 26px rgba(16, 24, 40, .08);
min-height: 470px;
}
.whyhire__imgph{
height: 100%;
min-height: 470px;
display: grid;
place-items: center;
font-weight: 700;
letter-spacing: .02em;
color: rgba(17, 24, 39, .55);
background:
linear-gradient(135deg, rgba(0,0,0,.04), rgba(0,0,0,.08));
}
@media (max-width: 900px){
.whyhire__grid{ grid-template-columns: 1fr; }
.whyhire__media{ min-height: 280px; }
.whyhire__imgph{ min-height: 280px; }
.whyhire__list{ max-height: none; overflow: visible; padding-right: 0; border-right: 0; }
}
/* Space between FAQ and Blog */
#blog{ margin-top: 0px; padding-top: 8px; }
/* Blog section (Latest From Our Blog) */
.blog-header{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap: 18px;
margin-bottom: 22px;
}
.blog-header__left .h2-t{ margin:0; }
.blog-header__left .section__sub{ margin:8px 0 0 0; color: var(--muted); }
.blog-header__link{
display:inline-flex;
align-items:center;
gap: 10px;
font-weight: 700;
text-decoration:none;
color: var(--mirza-blue);
white-space: nowrap;
margin-top: 10px;
}
.blog-header__link:hover{ text-decoration: underline; }
.blog-header__linkarrow{ color: var(--mirza-green); font-weight: 900; }
/* Blog cards */
.blog-grid{
display:grid;
gap: 22px;
}
@media (min-width: 900px){
.blog-grid{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
.post-card{
display:block;
background:#fff;
border-radius: var(--card-radius);
box-shadow: var(--card-shadow);
border: 1px solid rgba(0,0,0,.06);
overflow:hidden;
text-decoration:none;
color: inherit;
transition: transform .18s ease, box-shadow .18s ease;
}
.post-card:hover{
transform: translateY(-6px) scale(1.01);
box-shadow: 0 16px 40px rgba(0,0,0,.14);
}
.post-card__img.media-placeholder{
height: 250px;
border: 0;
background: #111;
}
.post-card__body{
padding: 18px 18px 20px;
}
.post-card__title{
margin:0 0 14px 0;
font-size: 22px;
line-height: 1.25;
font-weight: 800;
}
.post-card__meta{
margin:0;
color: rgba(0,0,0,.55);
font-size: 14px;
}
/* Quote CTA request label/subtext */
.quote-request{ display:flex; flex-direction:column; align-items:center; justify-content:flex-start; }
.quote-request-label{ font-size:13px; color:#555; margin-bottom:4px; }
.quote-request-sub{ font-size:13px; color:#666; margin-top:4px; }
/* Make the two quote CTAs the same height */
.quote-phone,
.quote-request{
display:flex;
flex-direction:column;
justify-content:space-between;
height:82px;
}
.quote-phone-label,
.quote-request-label,
.quote-request-sub{
margin:0;
}
/* =============================
Section header centering (v22)
============================= */
.section__header{
text-align:center;
}
.section__header .section__sub{
margin-left:auto;
margin-right:auto;
max-width: 880px;
}
.section__header .h2-t{
margin-left:auto;
margin-right:auto;
}
/* Blog header: center title/subtitle, keep "View All Articles" in top-right */
.section-blog .blog-header{
position: relative;
justify-content: center;
}
.section-blog .blog-header__left{
width: 100%;
text-align: center;
}
.section-blog .blog-header__right{
position: absolute;
right: 0;
top: 6px;
}
@media (max-width: 720px){
.section-blog .blog-header{
display: flex;
flex-direction: column;
gap: 10px;
align-items: center;
}
.section-blog .blog-header__right{
position: static;
}
}
#why-choose .becausecare2__title,
#why-choose .becausecare2__copy{
text-align: center;
}
#why-choose .becausecare2__copy{
margin-left:auto;
margin-right:auto;
max-width: none;
width: 100%;
}
/* --- Fix: Why Choose panel width + CTA alignment --- */
#why-choose .becausecare2__panel{
max-width: none !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
#why-choose .becausecare2__inner,
#why-choose .becausecare2__panelText{
max-width: none !important;
}
#why-choose .becausecare2__panelText{
width: 100%;
}
#why-choose .becausecare2__cta{
padding: 10px 14px !important;
font-size: 14px !important;
font-weight: 800 !important;
margin-top: 14px !important;
}
/* --- Fix: Gallery layout like reference (center slide larger, controls only on center) --- */
.work-splide .splide__track{
overflow: hidden;
}
.work-splide .splide__list{
align-items: stretch;
}
.work-splide .splide__slide{
opacity: .25;
transform: scale(.90);
transition: transform .25s ease, opacity .25s ease;
transform-origin: center center;
}
.work-splide .splide__slide.is-active{
opacity: 1;
transform: scale(1.14);
z-index: 3;
}
.work-splide .splide__slide:not(.is-active) .ba__range,
.work-splide .splide__slide:not(.is-active) .ba__divider,
.work-splide .splide__slide:not(.is-active) .ba__labels{
display: none !important;
}
.work-splide .splide__slide:not(.is-active) .ba__img--after{
display: none !important;
}
.work-splide .splide__slide:not(.is-active) .ba{
cursor: default;
}
/* Gallery arrows + dots row */
.work-nav{
display:flex;
align-items:center;
justify-content:center;
gap: 18px;
margin-top: 18px;
}
.work-arrow{
width: 44px;
height: 44px;
border-radius: 999px;
border: 1px solid rgba(0,0,0,.14);
background:#fff;
box-shadow: 0 12px 28px rgba(0,0,0,.08);
font-size: 28px;
line-height: 1;
color: rgba(0,0,0,.72);
cursor:pointer;
}
.work-arrow:hover{
transform: translateY(-1px);
box-shadow: 0 16px 34px rgba(0,0,0,.10);
}
.work-nav .splide__pagination{
position: static;
display:flex;
gap: 10px;
}
.work-nav .splide__pagination{pointer-events:auto !important;}
/* === HERO: floating request form over image (v29) === */
.promo__btn--call{
background: #16a34a !important;
border-color: #16a34a !important;
color: #fff !important;
}
.promo__btn--call:hover{ filter: brightness(.96); }
.promo__img--form{
/* override theme promo__img absolute positioning */
position: relative !important;
top: auto !important;
right: auto !important;
width: auto !important;
height: auto !important;
max-height: none !important;
z-index: 1 !important;
border-radius: 28px;
overflow: visible; /* allow the floating card shadow */
min-height: 520px;
display: flex;
align-items: center;
justify-content: center;
/* Blue gradient frame (the area AROUND the form) */
isolation: isolate;
background:
radial-gradient(900px 520px at 30% 18%, rgba(255,255,255,.18), rgba(255,255,255,0) 58%),
linear-gradient(145deg, #243a9a 0%, #152372 45%, #0b1c5a 100%);
padding: 18px;
}
/* Use the existing hero photo as a placeholder background. Replace this URL later. */
/* Disable old overlay layers that were tinting the form */
.promo__img--form .promo__img-bg{ display:none !important; }
.promo__img--form:after{ content:none !important; }
.promo__img--form::after{ content:none !important; }
.hero-form{
position: relative;
z-index: 2;
width: min(420px, 88%);
/* White card. The blue ring is drawn by ::before so there's no thin inner line. */
border-radius: 22px;
background: #ffffff;
border: none;
box-shadow: 0 18px 60px rgba(0,0,0,.22);
isolation: isolate;
padding: 18px 18px 16px;
}
/* Gradient ring around the hero form (navy → brand blue) */
.hero-form::before{
content: "";
position: absolute;
inset: -10px; /* ring thickness */
border-radius: calc(22px + 10px);
z-index: -1;
background: linear-gradient(135deg,
#061b4b 0%,
#1c3faa 35%,
#243c8f 70%,
#061b4b 100%
);
box-shadow: 0 18px 60px rgba(0,0,0,.18);
}
.hero-form__title{
margin: 0 0 12px 0;
font-size: 20px;
font-weight: 900;
letter-spacing: .01em;
color: #0b1320;
}
.hero-form__field{ display:block; margin: 0 0 10px 0; }
.hero-form__label{
display:block;
font-size: 12px;
font-weight: 800;
color: rgba(11,19,32,.70);
margin: 0 0 6px 2px;
text-transform: uppercase;
letter-spacing: .04em;
}
.hero-form__input,
.hero-form__select{
width: 100%;
height: 44px;
border-radius: 14px;
border: 1px solid rgba(0,0,0,.12);
padding: 0 14px;
font-size: 15px;
color: #0b1320;
background: #fff;
outline: none;
}
.hero-form__input:focus,
.hero-form__select:focus{
border-color: rgba(47,109,246,.55);
box-shadow: 0 0 0 4px rgba(47,109,246,.14);
}
.hero-form__submit{
width: 100%;
height: 46px;
border-radius: 999px;
border: 0;
background: #0b2a6a;
color: #fff;
font-weight: 900;
letter-spacing: .02em;
margin-top: 6px;
}
.hero-form__submit:hover{ filter: brightness(.98); }
.hero-form__call{
display:flex;
align-items:center;
justify-content:center;
width: 100%;
height: 46px;
border-radius: 999px;
margin-top: 10px;
background: #16a34a;
color: #fff;
font-weight: 900;
text-decoration: none;
}
.hero-form__call:hover{ filter: brightness(.96); }
/* HERO bullet list: match the tighter spacing/style you referenced (keep GREEN checks) */
.promo__text ul{
list-style: none !important;
margin: 18px 0 0 0 !important;
padding: 0 !important;
}
.promo__text ul li{
display: flex;
align-items: center;
gap: 14px;
margin: 0 0 18px 0 !important;
padding-left: 0 !important;
line-height: 1.35 !important;
}
.promo__text ul li:last-child{ margin-bottom: 0 !important; }
.promo__text ul li::before{
content: "✓";
position: absolute;
left: 0;
top: 2px;
width: 28px;
height: 28px;
border-radius: 9px; /* rounded-square like the reference */
display: grid;
place-items: center;
font-weight: 900;
font-size: 16px;
color: #ffffff;
background: #16a34a;
box-shadow: 0 10px 22px rgba(22,163,74,.22);
}
/* Mobile: stack hero so text is on top, form below */
@media (max-width: 980px){
.promo__img--form{ min-height: 420px; }
/* Ensure the visual/form block comes AFTER the text block */
.promo__img--form{ order: 2; }
.promo__main{ order: 1; }
}
/* HERO: keep text + floating form inline on desktop; stack only on mobile */
.promo__container{
flex-wrap: nowrap !important;
align-items: center !important;
gap: 28px !important;
}
.promo__info{
flex: 1 1 56% !important;
width: auto !important;
max-width: none !important;
}
.promo__img--form{
flex: 0 0 44% !important;
width: auto !important;
max-width: 560px !important;
}
/* Stack on mobile */
@media (max-width: 980px){
.promo__container{
flex-direction: column !important;
align-items: stretch !important;
gap: 18px !important;
}
.promo__img--form{
flex: none !important;
width: 100% !important;
max-width: none !important;
}
}
/* HERO FORM: ensure it is always interactive above any overlays */
.promo__img--form,
.promo__img--form *{
pointer-events: auto;
}
/* Hero title: multiline uppercase */
.promo__title{
text-transform: uppercase;
line-height: 1.05;
letter-spacing: .01em;
}
/* =============================
HERO FORM FIX (v41)
- Keep the FORM white
- Put the NAVY GRADIENT on the AREA AROUND the form (the visual block)
- Match the Superior-style bullet spacing, but with GREEN checks
============================= */
/* 1) The blue/gradient belongs on the container (around the form), not on the form */
.promo__img--form{
/* Your requested navy shade (base) + a subtle gradient like before */
background:
radial-gradient(900px 520px at 30% 18%, rgba(255,255,255,.18), rgba(255,255,255,0) 58%),
linear-gradient(145deg, #243a9a 0%, #152372 45%, #0b1c5a 100%) !important;
}
/* Kill any overlay layers that were tinting the form blue */
.promo__img--form::after{ content: none !important; }
.promo__img--form .promo__img-bg{ display: none !important; }
/* Ensure the form always sits above everything */
.promo__img--form{ position: relative !important; }
.promo__img--form > *{ position: relative; z-index: 2; }
/* 2) Form stays WHITE (never tinted) */
.hero-form{
background: #ffffff !important;
}
/* Remove any thin ring/border around the form itself */
.hero-form::before{ display:none !important; }
/* 3) Hero bullets: spacing + icon style like your reference (but green) */
.promo__text ul{
list-style: none !important;
margin: 18px 0 0 0 !important;
padding: 0 !important;
}
.promo__text ul li{
position: relative;
margin: 0 0 18px 0 !important;
padding-left: 46px !important;
line-height: 1.25 !important;
}
.promo__text ul li:last-child{ margin-bottom: 0 !important; }
.promo__text ul li::before{
content: "";
flex: 0 0 30px;
width: 30px;
height: 30px;
border-radius: 10px;
background: #16a34a; /* green */
box-shadow: 0 10px 22px rgba(22,163,74,.22);
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9.0 16.2l-3.5-3.5 1.4-1.4L9.0 13.4l7.1-7.1 1.4 1.4z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
background-size: 16px 16px;
}
/* HERO form container lift + lighter border */
.promo__img--form{
transform: translateY(-22px);
}
/* Gradient area around form */
.promo__img--form{
padding: 16px;
border-radius: 28px;
/* Requested navy shade + subtle gradient (like before, but darker) */
background:
radial-gradient(900px 520px at 32% 18%, rgba(255,255,255,.14), rgba(255,255,255,0) 60%),
linear-gradient(180deg, #243c8f 0%, #0b2a6a 55%, #061b4b 100%);
transform: translateY(-22px);
}
/* Remove any hero overlays that can tint the form */
.promo__img--form::after{ content:none !important; }
.promo__img--form .promo__img-bg{ display:none !important; }
/* =============================
Section headers: LEFT aligned
(override earlier centering rules)
============================= */
.section__header,
.section__head,
.becausecare2__title,
.becausecare2__copy{
text-align: left !important;
}
.section__header .h2-t,
.section__header .section__sub{
margin-left: 0 !important;
margin-right: 0 !important;
max-width: none !important;
}
/* Blog header: left title/subtitle, keep link on the right on desktop */
.section-blog .blog-header{
justify-content: space-between !important;
}
.section-blog .blog-header__left{
text-align: left !important;
}
@media (max-width: 720px){
.section-blog .blog-header{
align-items: flex-start !important;
}
}
/* Defensive: if any section utilities enforce centering */
.h2-t,
.section__sub{
text-align: left;
}
/* FINAL FIX: hero checklist alignment + smaller green checks */
.promo__text ul{
list-style: none !important;
margin: 20px 0 0 0 !important;
padding: 0 !important;
}
.promo__text ul li{
position: static !important;
display: flex !important;
align-items: flex-start !important;
gap: 12px !important;
margin: 0 0 14px 0 !important;
padding-left: 0 !important;
line-height: 1.35 !important;
}
.promo__text ul li:last-child{
margin-bottom: 0 !important;
}
.promo__text ul li::before{
content: "✓" !important;
position: static !important;
left: auto !important;
top: auto !important;
width: 20px !important;
height: 20px !important;
min-width: 20px !important;
border-radius: 5px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
font-size: 12px !important;
font-weight: 900 !important;
line-height: 1 !important;
color: #ffffff !important;
background: #16a34a !important;
box-shadow: none !important;
margin-top: 1px !important;
}
/* Header menu update: green Toronto button */
.header__find {
background: #08c814 !important;
color: #fff !important;
border-color: #08c814 !important;
}
.header__find:hover,
.header__find:focus-visible {
background: #07b312 !important;
border-color: #07b312 !important;
color: #fff !important;
}
.header__find .icon-location,
.header__find .icon-dropdown {
color: #fff !important;
}
/* Toronto section fix: make the full right section green without changing bar height */
.header__row{
overflow: visible;
}
.header__row .container{
position: relative;
display: flex;
align-items: stretch;
}
.header__row .header__menu.long{
flex: 1 1 auto;
}
.header__row .header__find{
position: relative;
z-index: 2;
margin-left: 0;
min-width: 272px;
padding: 0 34px;
border: 0;
border-radius: 0;
background: #09df00;
color: #fff !important;
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
line-height: 1;
box-shadow: none;
overflow: visible;
}
.header__row .header__find::before{
content: "";
position: absolute;
top: 0;
bottom: 0;
left: -72px;
width: 72px;
background: #09df00;
clip-path: polygon(100% 0, 0 100%, 100% 100%);
}
.header__row .header__find::after{
content: "";
position: absolute;
top: 0;
bottom: 0;
right: -100vw;
width: 100vw;
background: #09df00;
}
.header__row .header__find > *{
position: relative;
z-index: 1;
}
.header__row .header__find,
.header__row .header__find .icon-location,
.header__row .header__find .icon-dropdown{
color: #fff !important;
}
/* Toronto menu: unify all pieces to one lighter green */
.header__row .header__find{
background: #09df00 !important;
border-color: #09df00 !important;
}
.header__row .header__find::before,
.header__row .header__find::after{
background: #09df00 !important;
}
.header__row .header__find:hover,
.header__row .header__find:focus-visible{
background: #09df00 !important;
border-color: #09df00 !important;
}
/* Main menu arrows + large dropdown panels */
.header__row .menu-item-has-children{
position: relative;
}
.header__row .main-menu-item.menu-item-has-children > .menu-link,
.header__row .main-menu-item.menu-item-has-children > a.menu-link{
display: inline-flex;
align-items: center;
gap: 10px;
}
.header__row .main-menu-item.menu-item-has-children > .menu-link::after,
.header__row .main-menu-item.menu-item-has-children > a.menu-link::after,
.header__row .header__find .menu-arrow::before{
content: "▾";
display: inline-block;
font-size: 14px;
font-weight: 700;
line-height: 1;
color: currentColor;
}
.header__row .main-menu-item.menu-item-has-children > .menu-link .icon-dropdown,
.header__row .main-menu-item.menu-item-has-children > a.menu-link .icon-dropdown,
.header__row .header__find .icon-dropdown{
display: none !important;
}
.header__row .sub-menu-list{
display: block !important;
opacity: 0;
visibility: hidden;
pointer-events: none;
position: absolute;
top: calc(100% + 4px);
left: 0;
min-width: 640px;
padding: 0;
margin: 0;
list-style: none;
background: #f3f3f3;
border: 1px solid #d4d7de;
border-top: 4px solid #16a34a;
border-radius: 0 0 38px 38px;
box-shadow: none;
transform: translateY(6px);
transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
overflow: hidden;
z-index: 50;
}
.header__row .main-menu-item.menu-item-has-children:hover > .sub-menu-list,
.header__row .main-menu-item.menu-item-has-children:focus-within > .sub-menu-list,
.header__row .header__find-wrap:hover > .sub-menu-list,
.header__row .header__find-wrap:focus-within > .sub-menu-list{
opacity: 1;
visibility: visible;
pointer-events: auto;
transform: translateY(0);
}
.header__row .sub-menu-list .sub-menu-item1{
margin: 0;
border-bottom: 1px solid #d2d5dc;
}
.header__row .sub-menu-list .sub-menu-item1:last-child{
border-bottom: 0;
}
.header__row .sub-menu-list .sub-menu-link{
display: block;
padding: 34px 56px;
color: #1f3a93 !important;
font-size: 30px;
line-height: 1.1;
font-weight: 800;
text-decoration: none;
white-space: normal;
}
.header__row .sub-menu-list .sub-menu-link:hover{
background: #ececec;
}
.header__row .header__find-wrap{
position: relative;
flex: 0 0 auto;
}
.header__row .header__find{
position: relative;
}
.header__row .header__find .menu-arrow{
display: inline-flex;
align-items: center;
justify-content: center;
width: 14px;
height: 14px;
}
.header__row .header__find-wrap .toronto-dropdown{
left: auto;
right: 0;
min-width: 520px;
max-height: 80vh;
overflow-y: auto;
}
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
font-size: 26px;
padding: 28px 44px;
}
@media (max-width: 1200px){
.header__row .sub-menu-list{
min-width: 520px;
}
.header__row .sub-menu-list .sub-menu-link{
font-size: 24px;
padding: 28px 36px;
}
.header__row .header__find-wrap .toronto-dropdown{
min-width: 420px;
}
}
@media (max-width: 991px){
.header__row .sub-menu-list,
.header__row .header__find-wrap .toronto-dropdown{
min-width: 360px;
}
.header__row .sub-menu-list .sub-menu-link,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
font-size: 20px;
padding: 22px 28px;
}
}
/* Final header fix: restore Toronto wedge, exact green, proper chevrons, and reference-style dropdown cards */
.header__row{
overflow: visible !important;
}
.header__row .container{
position: relative;
display: flex;
align-items: stretch;
}
.header__row .header__menu.long{
flex: 1 1 auto;
}
.header__row .header__find-wrap{
position: relative;
flex: 0 0 auto;
display: flex;
align-items: stretch;
z-index: 3;
}
.header__row .header__find{
position: relative;
z-index: 2;
margin-left: 0;
min-width: 272px;
padding: 0 34px;
border: 0 !important;
border-radius: 0 !important;
background: #4ca154 !important;
color: #fff !important;
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
line-height: 1;
box-shadow: none !important;
overflow: visible;
}
.header__row .header__find::before{
content: "";
position: absolute;
top: 0;
bottom: 0;
left: -72px;
width: 72px;
background: #4ca154 !important;
clip-path: polygon(100% 0, 0 100%, 100% 100%);
}
.header__row .header__find::after{
content: "";
position: absolute;
top: 0;
bottom: 0;
right: -100vw;
width: 100vw;
background: #4ca154 !important;
}
.header__row .header__find > *{
position: relative;
z-index: 1;
}
.header__row .header__find:hover,
.header__row .header__find:focus-visible,
.header__row .header__find:active{
background: #4ca154 !important;
color: #fff !important;
border-color: #4ca154 !important;
}
.header__row .header__find .icon-location,
.header__row .header__find .icon-dropdown{
display: none !important;
}
.header__row .header__find .header__find-label{
color: #fff !important;
}
.header__row .menu-item-has-children{
position: relative;
}
.header__row .main-menu-item.menu-item-has-children > .menu-link,
.header__row .main-menu-item.menu-item-has-children > a.menu-link,
.header__row .header__find{
display: inline-flex;
align-items: center;
gap: 12px;
}
.header__row .main-menu-item.menu-item-has-children > .menu-link .icon-dropdown,
.header__row .main-menu-item.menu-item-has-children > a.menu-link .icon-dropdown{
display: none !important;
}
.header__row .main-menu-item.menu-item-has-children > .menu-link::after,
.header__row .main-menu-item.menu-item-has-children > a.menu-link::after,
.header__row .header__find .menu-arrow::before{
content: "";
display: inline-block;
width: 0;
height: 0;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
border-top: 9px solid currentColor;
transform: translateY(1px);
}
.header__row .sub-menu-list{
display: block !important;
position: absolute !important;
top: 100% !important;
left: 0 !important;
right: auto !important;
width: 640px !important;
min-width: 640px !important;
max-width: 640px !important;
padding: 0 !important;
margin: 0 !important;
list-style: none;
background: #f3f3f3 !important;
border-left: 1px solid #d3d7de !important;
border-right: 1px solid #d3d7de !important;
border-bottom: 1px solid #d3d7de !important;
border-top: 4px solid #4ca154 !important;
border-radius: 0 0 38px 38px !important;
box-shadow: none !important;
transform: translateY(0) !important;
opacity: 0;
visibility: hidden;
pointer-events: none;
overflow: hidden;
z-index: 80 !important;
}
.header__row .main-menu-item.menu-item-has-children:hover > .sub-menu-list,
.header__row .main-menu-item.menu-item-has-children:focus-within > .sub-menu-list,
.header__row .header__find-wrap:hover > .toronto-dropdown,
.header__row .header__find-wrap:focus-within > .toronto-dropdown{
opacity: 1;
visibility: visible;
pointer-events: auto;
}
.header__row .sub-menu-list .sub-menu-item1{
position: relative;
margin: 0;
border-bottom: 0 !important;
}
.header__row .sub-menu-list .sub-menu-item1::after{
content: "";
position: absolute;
left: 36px;
right: 36px;
bottom: 0;
height: 1px;
background: #d5d8de;
}
.header__row .sub-menu-list .sub-menu-item1:last-child::after{
display: none;
}
.header__row .sub-menu-list .sub-menu-link{
display: block;
padding: 42px 54px;
color: #1f3a93 !important;
font-size: 30px;
line-height: 1.06;
font-weight: 800;
text-decoration: none;
white-space: normal;
background: transparent !important;
}
.header__row .sub-menu-list .sub-menu-link:hover,
.header__row .sub-menu-list .sub-menu-link:focus-visible{
background: #ececec !important;
}
.header__row .header__find-wrap .toronto-dropdown{
left: auto !important;
right: 0 !important;
width: 520px !important;
min-width: 520px !important;
max-width: 520px !important;
max-height: 80vh;
overflow-y: auto;
}
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
padding: 30px 42px;
font-size: 26px;
}
@media (max-width: 1200px){
.header__row .sub-menu-list{
width: 520px !important;
min-width: 520px !important;
max-width: 520px !important;
}
.header__row .sub-menu-list .sub-menu-link{
font-size: 24px;
padding: 30px 40px;
}
.header__row .header__find-wrap .toronto-dropdown{
width: 420px !important;
min-width: 420px !important;
max-width: 420px !important;
}
}
@media (max-width: 991px){
.header__row .sub-menu-list,
.header__row .header__find-wrap .toronto-dropdown{
width: 360px !important;
min-width: 360px !important;
max-width: 360px !important;
}
.header__row .sub-menu-list .sub-menu-link,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
font-size: 20px;
padding: 22px 28px;
}
}
/* === Fix requested: Toronto color + smaller dropdowns === */
.header__row .header__find-wrap,
.header__row .header__find-wrap *{
--toronto-green:#1fa247;
}
.header__row .header__find-wrap{
background:#1fa247 !important;
}
.header__row .header__find-wrap .menu-link,
.header__row .header__find-wrap a{
background:#1fa247 !important;
color:#fff !important;
}
/* tighten dropdown size */
.sub-menu,
.toronto-dropdown{
max-width:340px !important;
padding:8px 0 !important;
}
.sub-menu li a,
.toronto-dropdown .sub-menu-link{
padding:12px 22px !important;
font-size:16px !important;
line-height:1.2 !important;
}
/* === Final override: lighter Toronto green + compact white dropdowns === */
.header__row .header__find-wrap,
.header__row .header__find-wrap *{
--toronto-green:#4ca154;
}
.header__row .header__find,
.header__row .header__find::before,
.header__row .header__find::after,
.header__row .header__find:hover,
.header__row .header__find:focus-visible,
.header__row .header__find:active,
.header__row .header__find .menu-link,
.header__row .header__find a{
background:#4ca154 !important;
border-color:#4ca154 !important;
}
/* Toronto dropdown should match the other white dropdowns, not green */
.header__row .header__find-wrap .toronto-dropdown,
.header__row .header__find-wrap:hover > .toronto-dropdown,
.header__row .header__find-wrap:focus-within > .toronto-dropdown{
background:#f3f3f3 !important;
border-left:1px solid #d3d7de !important;
border-right:1px solid #d3d7de !important;
border-bottom:1px solid #d3d7de !important;
border-top:4px solid #4ca154 !important;
border-radius:0 0 38px 38px !important;
box-shadow:none !important;
}
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
background:transparent !important;
color:#1f3a93 !important;
}
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link:hover,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link:focus-visible{
background:#ececec !important;
}
/* Compact dropdown size to match the reference more closely */
.header__row .sub-menu-list,
.header__row .header__find-wrap .toronto-dropdown{
width:420px !important;
min-width:420px !important;
max-width:420px !important;
padding:0 !important;
}
.header__row .sub-menu-list .sub-menu-link,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
padding:24px 30px !important;
font-size:17px !important;
line-height:1.1 !important;
font-weight:800 !important;
}
.header__row .sub-menu-list .sub-menu-item1::after,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-item1::after{
left:22px !important;
right:22px !important;
}
@media (max-width: 991px){
.header__row .sub-menu-list,
.header__row .header__find-wrap .toronto-dropdown{
width:380px !important;
min-width:380px !important;
max-width:380px !important;
}
.header__row .sub-menu-list .sub-menu-link,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
padding:20px 24px !important;
font-size:15px !important;
}
}
/* === Size + color normalization override === */
:root{
--mirza-green:#1fa247;
}
/* unify greens */
.promo__btn{background:var(--mirza-green)!important;border-color:var(--mirza-green)!important;}
.header__row .header__find-wrap{background:var(--mirza-green)!important;}
.header__row .header__find-wrap *{border-color:var(--mirza-green)!important;}
/* smaller dropdowns */
.header__row .sub-menu-list{
min-width:320px!important;
border-radius:0 0 18px 18px!important;
}
.header__row .sub-menu-list .sub-menu-link{
padding:14px 20px!important;
font-size:18px!important;
font-weight:700!important;
}
.header__row .sub-menu-list .sub-menu-item1{
border-bottom:1px solid #e2e5ea!important;
}
/* Toronto menu color + location pin */
.header__row .header__find,
.header__row .header__find::before,
.header__row .header__find::after{
background: #17A34A !important;
border-color: #17A34A !important;
}
.header__row .header__find:hover,
.header__row .header__find:focus-visible{
background: #17A34A !important;
border-color: #17A34A !important;
color: #fff !important;
}
.header__row .header__find,
.header__row .header__find .header__find-label,
.header__row .header__find .menu-arrow::before,
.header__row .header__find .location-pin{
color: #fff !important;
}
.header__row .header__find{
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 8px !important;
}
.header__row .header__find .location-pin{
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
font-size: 15px !important;
line-height: 1 !important;
margin-right: 2px !important;
}
.header__row .header__find .icon-location{
display: none !important;
}
/* === Top bar cleanup + Toronto icon update === */
.header .container{display:flex!important;align-items:stretch!important;}
.header__sticky{
margin-left:auto!important;
flex:1 1 auto!important;
display:flex!important;
justify-content:flex-end!important;
align-items:stretch!important;
background:#2849a2!important;
min-height:64px!important;
padding:0!important;
border-radius:0!important;
overflow:hidden!important;
}
.header__phone{
display:none!important;
}
.header__btn{
margin-left:auto!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
min-width:258px!important;
padding:0 44px!important;
background:#17A34A!important;
border:0!important;
color:#fff!important;
font-size:24px!important;
font-weight:800!important;
text-transform:none!important;
line-height:1!important;
border-radius:0 0 0 18px!important;
box-shadow:none!important;
}
.header__btn:hover,
.header__btn:focus-visible{
background:#17A34A!important;
color:#fff!important;
}
.header__find,
.header__find::before,
.header__find::after{
background:#17A34A!important;
border-color:#17A34A!important;
}
.header__find .location-pin{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
width:14px!important;
height:14px!important;
color:#fff!important;
line-height:1!important;
}
.header__find .location-pin svg{
display:block!important;
width:14px!important;
height:14px!important;
fill:currentColor!important;
}
/* === Final top header polish: remove Toronto icon, hide company menu, extend blue bar to button, refine CTA === */
.header > .container{
display:flex !important;
align-items:stretch !important;
}
.header__menu.short{
display:none !important;
}
.header__sticky{
margin-left:auto !important;
flex:1 1 auto !important;
display:flex !important;
align-items:stretch !important;
justify-content:flex-end !important;
min-height:66px !important;
background:#2849a2 !important;
padding:0 !important;
border-radius:0 !important;
overflow:visible !important;
}
.header__phone{
display:none !important;
}
.header__sticky::before{
content:"";
display:block;
flex:1 1 auto;
background:#2849a2;
}
.header__btn,
.header__btn.btn,
.header__btn.btn-t,
.header__btn.btn-transparent-dark{
position:relative !important;
z-index:2 !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
align-self:stretch !important;
margin:0 !important;
min-width:256px !important;
height:66px !important;
padding:0 34px !important;
background:#17A34A !important;
border:0 !important;
border-radius:0 0 16px 16px !important;
box-shadow:none !important;
color:#fff !important;
font-size:23px !important;
font-weight:800 !important;
line-height:1 !important;
text-transform:none !important;
}
.header__btn:hover,
.header__btn:focus-visible{
background:#17A34A !important;
color:#fff !important;
}
.header__find .location-pin{
display:none !important;
}
/* === Final top header match to reference === */
.header{background:#fff !important;}
.header > .container{position:relative !important; display:flex !important; align-items:flex-start !important; min-height:100px !important; overflow:visible !important;}
.header .custom-logo-link{position:relative !important; z-index:5 !important; display:flex !important; align-items:center !important; justify-content:center !important; flex:0 0 255px !important; width:255px !important; height:100px !important; margin:0 22px 0 0 !important; padding:0 0 10px !important; background:#fff !important;}
.header .custom-logo-link img{width:196px !important; height:auto !important;}
.header__sticky{position:relative !important; z-index:2 !important; flex:1 1 auto !important; min-width:0 !important; height:90px !important; min-height:90px !important; margin:0 !important; padding:0 !important; background:transparent !important; align-items:flex-start !important; justify-content:flex-end !important;}
.header__sticky::before{content:"" !important; display:block !important; flex:1 1 auto !important; height:90px !important; margin:0 !important; background:#2d4fa3 !important; border-radius:0 !important;}
.header__btn,
.header__btn.btn,
.header__btn.btn-t,
.header__btn.btn-transparent-dark{position:relative !important; z-index:3 !important; flex:0 0 auto !important; align-self:flex-start !important; min-width:364px !important; width:364px !important; height:90px !important; margin:0 0 0 24px !important; padding:0 26px !important; background:#1ea64a !important; border:0 !important; border-radius:0 0 22px 22px !important; box-shadow:none !important; color:#fff !important; font-size:34px !important; font-weight:800 !important; font-style:italic !important; line-height:1 !important; letter-spacing:0 !important; text-transform:none !important;}
.header__btn:hover,
.header__btn:focus-visible{background:#1ea64a !important; color:#fff !important;}
.header__hamburger{display:none !important;}
@media (max-width: 1100px){
.header .custom-logo-link{flex-basis:210px !important; width:210px !important; margin-right:14px !important;}
.header .custom-logo-link img{width:168px !important;}
.header__sticky, .header__sticky::before{height:72px !important; min-height:72px !important;}
.header__btn, .header__btn.btn, .header__btn.btn-t, .header__btn.btn-transparent-dark{width:auto !important; min-width:250px !important; height:72px !important; font-size:26px !important; margin-left:14px !important;}
}
/* === Top header rebuilt to match Superior layout more closely === */
.header{
background:#fff !important;
}
.header > .container{
position:relative !important;
display:block !important;
min-height:8.2rem !important;
height:8.2rem !important;
padding:0 !important;
overflow:visible !important;
}
.header > .container::before{
content:"" !important;
position:absolute !important;
top:0 !important;
left:0 !important;
right:20.8rem !important;
height:4.1rem !important;
background:#243a80 !important;
z-index:1 !important;
}
.header .custom-logo-link{
position:absolute !important;
left:0 !important;
top:-0.15rem !important;
z-index:4 !important;
width:17.2rem !important;
height:8.2rem !important;
margin:0 !important;
padding:0 !important;
background:transparent !important;
display:block !important;
}
.header .custom-logo-link img{
width:100% !important;
height:100% !important;
object-fit:contain !important;
}
.header__menu.short,
.header__phone,
.header__hamburger{
display:none !important;
}
.header__sticky{
position:absolute !important;
top:0 !important;
right:0 !important;
width:20.8rem !important;
height:8.2rem !important;
min-height:8.2rem !important;
margin:0 !important;
padding:0 !important;
display:block !important;
background:transparent !important;
overflow:visible !important;
z-index:3 !important;
}
.header__sticky::before,
.header__sticky::after{
content:none !important;
}
.header__btn,
.header__btn.btn,
.header__btn.btn-t,
.header__btn.btn-transparent-dark{
position:absolute !important;
top:0 !important;
right:0 !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
width:20.8rem !important;
min-width:20.8rem !important;
height:6.35rem !important;
margin:0 !important;
padding:0 1.8rem !important;
border:0 !important;
border-radius:0 0 1.25rem 1.25rem !important;
background:#17A34A !important;
color:#fff !important;
box-shadow:none !important;
font-size:2.25rem !important;
font-weight:800 !important;
font-style:italic !important;
line-height:1 !important;
text-transform:none !important;
}
.header__btn:hover,
.header__btn:focus-visible{
background:#17A34A !important;
color:#fff !important;
}
@media (max-width: 1100px){
.header > .container{
min-height:6.8rem !important;
height:6.8rem !important;
}
.header > .container::before{
right:16rem !important;
height:3.5rem !important;
}
.header .custom-logo-link{
width:14.4rem !important;
height:6.8rem !important;
}
.header__sticky{
width:16rem !important;
height:6.8rem !important;
min-height:6.8rem !important;
}
.header__btn,
.header__btn.btn,
.header__btn.btn-t,
.header__btn.btn-transparent-dark{
width:16rem !important;
min-width:16rem !important;
height:5.2rem !important;
font-size:1.8rem !important;
padding:0 1.2rem !important;
}
}
/* === Final top bar width/color/text alignment fix === */
.header{
position:relative !important;
background:#fff !important;
}
.header::before{
content:"" !important;
position:absolute !important;
left:0 !important;
right:0 !important;
top:0 !important;
height:4.1rem !important;
background:#243a80 !important;
z-index:0 !important;
}
.header > .container{
position:relative !important;
z-index:1 !important;
}
.header > .container::before{
left:0 !important;
right:20.8rem !important;
height:4.1rem !important;
background:#243a80 !important;
}
.header__sticky{
right:0 !important;
}
.header__btn,
.header__btn.btn,
.header__btn.btn-t,
.header__btn.btn-transparent-dark{
background:#17A34A !important;
}
@media (max-width: 1100px){
.header::before{
height:3.5rem !important;
}
.header > .container::before{
right:16rem !important;
height:3.5rem !important;
background:#243a80 !important;
}
}
.custom-order{
color:#fff;
font-weight:600;
margin-right:18px;
line-height:1.2;
}
.book-now-btn{
font-size:18px;
padding:16px 28px;
}
/* === Top bar specialist text next to Book Now === */
.top-specialist-callout{
position:absolute !important;
top:0 !important;
right:23.1rem !important;
height:4.1rem !important;
display:flex !important;
flex-direction:column !important;
justify-content:center !important;
align-items:flex-end !important;
gap:0.18rem !important;
padding:0 0.2rem !important;
color:#fff !important;
text-align:right !important;
white-space:nowrap !important;
z-index:4 !important;
}
.top-specialist-callout__label{
display:block !important;
font-size:0.82rem !important;
line-height:1 !important;
font-weight:600 !important;
letter-spacing:0.01em !important;
text-transform:none !important;
opacity:0.95 !important;
}
.top-specialist-callout__phone{
display:block !important;
font-size:1.06rem !important;
line-height:1 !important;
font-weight:800 !important;
letter-spacing:0.01em !important;
}
.book-now-btn{
font-size:20px !important;
padding:16px 30px !important;
}
@media (max-width: 1100px){
.top-specialist-callout{
right:17.7rem !important;
height:3.5rem !important;
}
.top-specialist-callout__label{
font-size:0.72rem !important;
}
.top-specialist-callout__phone{
font-size:0.94rem !important;
}
}
/* === Requested refinement: larger specialist text + much smaller dropdowns === */
.top-specialist-callout{
right:12.25rem !important;
height:4.1rem !important;
gap:0.1rem !important;
}
.top-specialist-callout__label{
font-size:1.02rem !important;
line-height:1 !important;
font-weight:700 !important;
letter-spacing:0 !important;
}
.top-specialist-callout__phone{
font-size:1.34rem !important;
line-height:1 !important;
font-weight:800 !important;
letter-spacing:0 !important;
}
.book-now-btn{
font-size:21px !important;
padding:16px 30px !important;
}
.header__row .sub-menu-list,
.header__row .header__find-wrap .toronto-dropdown{
width:300px !important;
min-width:300px !important;
max-width:300px !important;
border-radius:0 0 26px 26px !important;
}
.header__row .sub-menu-list .sub-menu-link,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
padding:15px 18px !important;
font-size:15px !important;
line-height:1.08 !important;
font-weight:800 !important;
}
.header__row .sub-menu-list .sub-menu-item1::after,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-item1::after{
left:16px !important;
right:16px !important;
}
@media (max-width: 1100px){
.top-specialist-callout{
right:10.9rem !important;
}
.top-specialist-callout__label{
font-size:0.88rem !important;
}
.top-specialist-callout__phone{
font-size:1.14rem !important;
}
}
@media (max-width: 991px){
.header__row .sub-menu-list,
.header__row .header__find-wrap .toronto-dropdown{
width:280px !important;
min-width:280px !important;
max-width:280px !important;
}
.header__row .sub-menu-list .sub-menu-link,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
padding:13px 16px !important;
font-size:14px !important;
}
}
/* === Fix: larger specialist text without overlap + much smaller dropdowns === */
.top-specialist-callout{
position:absolute !important;
top:0 !important;
right:22.4rem !important;
width:18.5rem !important;
height:4.1rem !important;
display:flex !important;
flex-direction:column !important;
justify-content:center !important;
align-items:flex-end !important;
text-align:right !important;
gap:0.12rem !important;
padding:0 !important;
white-space:nowrap !important;
z-index:4 !important;
}
.top-specialist-callout__label{
font-size:1.22rem !important;
line-height:1 !important;
font-weight:700 !important;
letter-spacing:0 !important;
}
.top-specialist-callout__phone{
font-size:1.58rem !important;
line-height:1 !important;
font-weight:800 !important;
letter-spacing:0 !important;
}
.book-now-btn,
.header__btn.book-now-btn{
font-size:22px !important;
padding:0 1.5rem !important;
}
.header__row .sub-menu-list,
.header__row .header__find-wrap .toronto-dropdown{
width:240px !important;
min-width:240px !important;
max-width:240px !important;
border-radius:0 0 22px 22px !important;
}
.header__row .sub-menu-list .sub-menu-link,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
padding:11px 14px !important;
font-size:12px !important;
line-height:1.15 !important;
font-weight:800 !important;
}
.header__row .sub-menu-list .sub-menu-item1::after,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-item1::after{
left:12px !important;
right:12px !important;
}
@media (max-width: 1100px){
.top-specialist-callout{
right:18rem !important;
width:14rem !important;
height:3.5rem !important;
}
.top-specialist-callout__label{
font-size:0.96rem !important;
}
.top-specialist-callout__phone{
font-size:1.18rem !important;
}
}
@media (max-width: 991px){
.header__row .sub-menu-list,
.header__row .header__find-wrap .toronto-dropdown{
width:220px !important;
min-width:220px !important;
max-width:220px !important;
}
.header__row .sub-menu-list .sub-menu-link,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
padding:10px 12px !important;
font-size:11px !important;
}
}
/* === Final requested fix: specialist text side-by-side + smaller dropdowns === */
.top-specialist-callout{
position:absolute !important;
top:0 !important;
right:22.2rem !important;
width:auto !important;
height:4.1rem !important;
display:flex !important;
flex-direction:row !important;
align-items:center !important;
justify-content:flex-end !important;
gap:0.45rem !important;
padding:0 !important;
margin:0 !important;
white-space:nowrap !important;
text-align:left !important;
z-index:5 !important;
}
.top-specialist-callout__label{
display:inline-block !important;
font-size:0.92rem !important;
line-height:1 !important;
font-weight:600 !important;
letter-spacing:0 !important;
opacity:0.98 !important;
}
.top-specialist-callout__phone{
display:inline-block !important;
font-size:1.34rem !important;
line-height:1 !important;
font-weight:800 !important;
letter-spacing:0 !important;
}
.header__row .sub-menu-list,
.header__row .header__find-wrap .toronto-dropdown{
width:205px !important;
min-width:205px !important;
max-width:205px !important;
border-radius:0 0 16px 16px !important;
}
.header__row .sub-menu-list .sub-menu-link,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
padding:8px 12px !important;
font-size:11px !important;
line-height:1.15 !important;
font-weight:700 !important;
}
.header__row .sub-menu-list .sub-menu-item1::after,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-item1::after{
left:10px !important;
right:10px !important;
}
@media (max-width: 1100px){
.top-specialist-callout{
right:17rem !important;
height:3.5rem !important;
gap:0.36rem !important;
}
.top-specialist-callout__label{
font-size:0.78rem !important;
}
.top-specialist-callout__phone{
font-size:1.1rem !important;
}
}
@media (max-width: 991px){
.header__row .sub-menu-list,
.header__row .header__find-wrap .toronto-dropdown{
width:190px !important;
min-width:190px !important;
max-width:190px !important;
}
.header__row .sub-menu-list .sub-menu-link,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
padding:7px 10px !important;
font-size:10px !important;
}
}
/* === Requested tweaks: larger specialist text, slightly smaller dropdowns, remove Home/Toronto only === */
.breadcrumbs-wrap,
.breadcrumbs,
.separator,
.last{
display:none !important;
}
.top-specialist-callout{
right:22.4rem !important;
gap:0.65rem !important;
}
.top-specialist-callout__label{
font-size:1.08rem !important;
line-height:1 !important;
font-weight:600 !important;
}
.top-specialist-callout__phone{
font-size:1.72rem !important;
line-height:1 !important;
font-weight:800 !important;
}
.header__row .sub-menu-list,
.header__row .header__find-wrap .toronto-dropdown{
width:188px !important;
min-width:188px !important;
max-width:188px !important;
}
.header__row .sub-menu-list .sub-menu-link,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
padding:7px 10px !important;
font-size:10px !important;
line-height:1.08 !important;
}
.header__row .sub-menu-list .sub-menu-item1::after,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-item1::after{
left:9px !important;
right:9px !important;
}
@media (max-width: 1100px){
.top-specialist-callout{
right:17rem !important;
gap:0.45rem !important;
}
.top-specialist-callout__label{font-size:0.9rem !important;}
.top-specialist-callout__phone{font-size:1.34rem !important;}
}
@media (max-width: 991px){
.header__row .sub-menu-list,
.header__row .header__find-wrap .toronto-dropdown{
width:176px !important;
min-width:176px !important;
max-width:176px !important;
}
.header__row .sub-menu-list .sub-menu-link,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
padding:6px 9px !important;
font-size:9px !important;
}
}
/* === Final tweaks: sticky top bar, click-to-call, larger specialist text, cleaner Toronto dropdown === */
.header > .container{position:sticky !important; top:0 !important; z-index:1200 !important;}
.top-specialist-callout{right:23.2rem !important; gap:0.75rem !important; text-decoration:none !important; color:#fff !important; align-items:center !important;}
.top-specialist-callout:hover,.top-specialist-callout:focus-visible{color:#fff !important; text-decoration:none !important; opacity:1 !important;}
.top-specialist-callout__label{font-size:1.28rem !important; font-weight:700 !important; line-height:1 !important;}
.top-specialist-callout__phone{font-size:2.08rem !important; font-weight:800 !important; line-height:1 !important;}
.header__row .header__find-wrap .toronto-dropdown{border-radius:0 0 10px 10px !important; overflow:visible !important; padding-bottom:6px !important;}
.header__row .header__find-wrap .toronto-dropdown .sub-menu-item1:last-child .sub-menu-link{padding-bottom:12px !important;}
@media (max-width: 1100px){.top-specialist-callout{right:17.8rem !important; gap:0.55rem !important;}.top-specialist-callout__label{font-size:1.02rem !important;}.top-specialist-callout__phone{font-size:1.55rem !important;}}
/* Compact footer matching reference layout */
.footer--custom{
background: linear-gradient(90deg,#303030 0%, #242424 50%, #303030 100%);
color:#243A80;
padding:48px 0 22px;
}
.footer--custom .container{
max-width:1460px;
}
.footer-custom__inner{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:52px;
}
.footer-custom__brand{
width:250px;
flex:0 0 250px;
}
.footer-custom__logo{
display:block;
width:180px;
margin-bottom:18px;
}
.footer-custom__logo img{
display:block;
width:100%;
height:auto;
}
.footer-custom__address{
margin:0 0 18px;
color:#f0f0f0;
font-size:16px;
font-weight:700;
line-height:1.35;
}
.footer-custom__phone{
display:inline-block;
margin:0 0 18px;
color:#fff;
font-size:20px;
font-weight:800;
text-decoration:none;
}
.footer-custom__phone:hover{color:#fff;text-decoration:none;}
.footer-custom__cta{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:160px;
height:50px;
padding:0 26px;
border-radius:14px;
background:#17A34A;
color:#fff;
font-size:18px;
font-weight:800;
text-decoration:none;
}
.footer-custom__cta:hover{color:#fff;text-decoration:none;opacity:.95;}
.footer-custom__menus{
flex:1 1 auto;
display:grid;
grid-template-columns:repeat(4,minmax(150px,1fr));
gap:32px;
align-items:start;
}
.footer-custom__col h3{
margin:0 0 18px;
color:#fff;
font-size:18px;
font-weight:800;
text-transform:uppercase;
line-height:1.15;
}
.footer-custom__col ul{
margin:0;
padding:0;
list-style:none;
}
.footer-custom__col li{
margin:0 0 14px;
}
.footer-custom__col a{
color:#fff;
font-size:16px;
line-height:1.25;
text-decoration:none;
opacity:.92;
}
.footer-custom__col a:hover{opacity:1;text-decoration:none;}
.footer-custom__bottom{
margin-top:34px;
padding-top:18px;
border-top:1px solid rgba(255,255,255,.28);
text-align:center;
}
.footer-custom__bottom small{
color:rgba(255,255,255,.72);
font-size:15px;
}
@media (max-width: 1100px){
.footer-custom__inner{flex-direction:column;gap:34px;}
.footer-custom__brand{width:auto;flex-basis:auto;}
.footer-custom__menus{grid-template-columns:repeat(2,minmax(180px,1fr));width:100%;}
}
@media (max-width: 640px){
.footer--custom{padding:36px 0 18px;}
.footer-custom__menus{grid-template-columns:1fr;gap:24px;}
.footer-custom__logo{width:150px;}
}
/* footer navy + divider + hover polish */
.footer--custom{
background:#243a80 !important;
border-top:1px solid rgba(255,255,255,.16);
box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}
.footer-custom__address,
.footer-custom__col a{
color:#eef3ff;
}
.footer-custom__phone{
transition:color .2s ease, opacity .2s ease;
}
.footer-custom__phone:hover{
color:#dff7e7;
opacity:1;
}
.footer-custom__cta{
transition:transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.footer-custom__cta:hover{
background:#1ab14f;
transform:translateY(-1px);
box-shadow:0 10px 22px rgba(0,0,0,.18);
}
.footer-custom__col a{
display:inline-block;
transition:color .18s ease, opacity .18s ease, transform .18s ease;
}
.footer-custom__col a:hover{
color:#ffffff;
opacity:1;
transform:translateX(2px);
}
.footer-custom__bottom{
border-top:1px solid rgba(255,255,255,.24);
}
.footer-custom__bottom small{
color:rgba(255,255,255,.8);
}
/* footer exact site navy override */
footer.footer--custom,
.footer.footer--custom,
.site-footer,
.footer--custom,
.footer--custom .container,
.footer-custom__inner,
.footer-custom__bottom{
background:#020E4E !important;
background-image:none !important;
}
.footer--custom{
border-top:1px solid rgba(255,255,255,.12) !important;
box-shadow:none !important;
}
/* Blank service page template */
.service-page-blank{background:#fff;}
.service-page-blank__section{background:#fff;}
.service-page-blank__spacer{min-height:520px;}
@media (max-width: 767px){.service-page-blank__spacer{min-height:420px;}}
/* Grease Trap Cleaning service hero */
.service-hero-template {
background: #f3f4f6;
padding: 56px 0 72px;
}
.service-hero-template .container {
max-width: 1320px;
}
.service-hero-template__grid {
display: grid;
grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
gap: 56px;
align-items: center;
}
.service-hero-template__content {
color: #22315f;
}
.service-hero-template__eyebrow {
margin: 0 0 14px;
font-size: 14px;
font-weight: 700;
letter-spacing: .08em;
text-transform: uppercase;
color: #06c11a;
}
.service-hero-template__title {
margin: 0 0 26px;
font-size: clamp(40px, 5vw, 70px);
line-height: 1.02;
font-weight: 800;
color: #234ea6;
}
.service-hero-template__text p {
margin: 0 0 24px;
font-size: 22px;
line-height: 1.72;
color: #4d5f8e;
}
.service-hero-template__actions {
display: flex;
flex-wrap: wrap;
gap: 18px;
margin-top: 38px;
}
.service-hero-template__btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 66px;
padding: 0 34px;
border-radius: 16px;
border: 2px solid #7fa0ee;
font-size: 18px;
font-weight: 700;
text-decoration: none;
transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}
.service-hero-template__btn:hover {
transform: translateY(-1px);
}
.service-hero-template__btn--primary {
background: #06c11a;
border-color: #06c11a;
color: #fff;
box-shadow: 0 12px 24px rgba(6, 193, 26, .18);
}
.service-hero-template__btn--secondary {
background: #fff;
color: #234ea6;
}
.service-hero-template__media img {
display: block;
width: 100%;
aspect-ratio: 1 / 1;
object-fit: cover;
border-radius: 28px;
box-shadow: 0 22px 40px rgba(19, 36, 82, .12);
}
@media (max-width: 1100px) {
.service-hero-template__grid {
grid-template-columns: 1fr;
gap: 34px;
}
.service-hero-template__title {
font-size: clamp(34px, 7vw, 54px);
}
.service-hero-template__text p {
font-size: 19px;
line-height: 1.65;
}
}
@media (max-width: 767px) {
.service-hero-template {
padding: 34px 0 48px;
}
.service-hero-template__actions {
flex-direction: column;
}
.service-hero-template__btn {
width: 100%;
}
.service-hero-template__media img {
aspect-ratio: 4 / 3;
border-radius: 22px;
}
}
/* Grease Trap Cleaning service page */
.service-page {
background: #fff;
}
.service-intro,
.service-info-block,
.service-process,
.service-industries,
.service-cta-block {
padding: 72px 0;
}
.service-intro {
background: #ffffff;
}
.service-intro__wrap {
display: grid;
grid-template-columns: minmax(0, 1.02fr) minmax(380px, 0.98fr);
gap: 56px;
align-items: center;
}
.service-intro__text {
max-width: 640px;
}
.service-intro__eyebrow,
.service-section-heading__eyebrow {
margin: 0 0 14px;
color: #214ba5;
font-size: 14px;
font-weight: 700;
line-height: 1.4;
letter-spacing: .08em;
text-transform: uppercase;
}
.service-intro__title,
.service-section-heading__title {
margin: 0;
color: #214ba5;
font-size: 42px;
font-weight: 700;
line-height: 1.12;
}
.service-intro__copy {
margin-top: 24px;
}
.service-intro__copy p,
.service-info-card p,
.service-process__item p,
.service-cta-block__content p,
.service-list li {
color: #000000;
font-size: 16px;
font-weight: 400;
line-height: 1.7;
}
.service-intro__copy p,
.service-info-card p,
.service-process__item p,
.service-cta-block__content p {
margin: 0 0 22px;
}
.service-intro__actions,
.service-cta-block__actions {
display: flex;
flex-wrap: wrap;
gap: 16px;
margin-top: 32px;
}
.service-intro__btn {
min-width: 188px;
justify-content: center;
}
.service-intro__btn--primary,
.service-cta-block__actions .service-intro__btn--primary {
background: #03c60f;
border-color: #03c60f;
color: #fff;
}
.service-intro__btn--primary:hover,
.service-cta-block__actions .service-intro__btn--primary:hover {
background: #02ad0d;
border-color: #02ad0d;
}
.service-intro__btn--secondary {
background: transparent;
border-color: #9bb6ff;
color: #214ba5;
}
.service-intro__media img {
display: block;
width: 100%;
aspect-ratio: 1 / 1;
object-fit: cover;
border-radius: 28px;
box-shadow: 0 24px 70px rgba(25, 49, 105, 0.14);
}
.service-section-heading {
max-width: 720px;
margin-bottom: 34px;
}
.service-info-block {
background: #fff;
}
.service-info-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 24px;
}
.service-info-card,
.service-process__item,
.service-cta-block__panel {
border-radius: 24px;
}
.service-info-card {
padding: 30px 28px;
background: #f7f9ff;
box-shadow: 0 10px 30px rgba(17, 43, 95, 0.06);
}
.service-info-card h3,
.service-process__item h3 {
margin: 0 0 14px;
color: #1d2f54;
font-size: 24px;
font-weight: 700;
line-height: 1.25;
}
.service-process {
background: #ffffff;
}
.service-process__grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 24px;
}
.service-process__item {
padding: 30px 28px;
background: #fff;
box-shadow: 0 10px 30px rgba(17, 43, 95, 0.07);
}
.service-process__step {
display: inline-flex;
align-items: center;
justify-content: center;
width: 52px;
height: 52px;
margin-bottom: 20px;
border-radius: 50%;
background: #214ba5;
color: #fff;
font-size: 18px;
font-weight: 700;
line-height: 1;
}
.service-industries__grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 28px;
}
.service-industries__column {
padding: 28px 30px;
border-radius: 24px;
background: #f7f9ff;
}
.service-list {
margin: 0;
padding: 0;
list-style: none;
}
.service-list li {
position: relative;
margin: 0;
padding: 0 0 0 30px;
}
.service-list li + li {
margin-top: 18px;
}
.service-list li::before {
content: "";
position: absolute;
top: 12px;
left: 0;
width: 12px;
height: 12px;
border-radius: 50%;
background: #03c60f;
}
.service-cta-block {
padding-top: 16px;
padding-bottom: 88px;
}
.service-cta-block__panel {
display: flex;
justify-content: space-between;
align-items: center;
gap: 32px;
padding: 42px 46px;
background: linear-gradient(135deg, #f1f5ff 0%, #ffffff 100%);
box-shadow: 0 18px 50px rgba(17, 43, 95, 0.08);
}
.service-cta-block__content {
max-width: 700px;
}
.service-cta-block__content p:last-child {
margin-bottom: 0;
}
@media (max-width: 1199px) {
.service-intro__wrap {
grid-template-columns: minmax(0, 1fr);
}
.service-intro__text {
max-width: none;
}
.service-intro__media {
max-width: 720px;
}
.service-info-grid,
.service-process__grid,
.service-industries__grid,
.service-cta-block__panel {
grid-template-columns: 1fr;
}
.service-cta-block__panel {
display: grid;
}
}
@media (max-width: 767px) {
.service-intro,
.service-info-block,
.service-process,
.service-industries,
.service-cta-block {
padding: 48px 0;
}
.service-intro__title,
.service-section-heading__title {
font-size: 32px;
}
.service-intro__copy p,
.service-info-card p,
.service-process__item p,
.service-cta-block__content p,
.service-list li {
font-size: 16px;
line-height: 1.65;
}
.service-info-grid,
.service-process__grid,
.service-industries__grid {
grid-template-columns: 1fr;
}
.service-intro__media img {
aspect-ratio: 4 / 3;
border-radius: 22px;
}
.service-cta-block__panel {
padding: 30px 24px;
}
}
/* Grease Trap page palette alignment */
.service-page,
.service-info-block,
.service-industries,
.service-cta-block {
background: #ffffff;
}
.service-intro__title,
.service-section-heading__title,
.service-info-card h3,
.service-process__item h3,
.service-list li::marker {
color: #214ba5;
}
.service-intro__eyebrow,
.service-section-heading__eyebrow,
.service-process__step {
color: #214ba5;
}
.service-intro__actions .service-intro__btn {
min-width: 188px;
}
/* --- Service page typography fix --- */
.service-intro h1{
font-family: inherit;
font-weight: 800;
font-size: 42px;
letter-spacing: .5px;
color:#1f2f44;
margin-bottom:18px;
}
.service-intro p{
font-size:18px;
line-height:1.65;
color:#555555;
max-width:680px;
}
/* Larger call button */
.service-intro .btn--green{
font-size:18px;
padding:16px 32px;
border-radius:6px;
}
/* Service estimate form */
.service-estimate{
padding: 12px 0 56px;
background:#fff;
}
.service-estimate__card{
background:#020e4e;
border-radius:28px;
padding:34px 36px 32px;
color:#fff;
box-shadow:0 18px 48px rgba(2,14,78,.12);
}
.service-estimate__badge{
display:inline-flex;
align-items:center;
justify-content:center;
margin:0 auto 26px;
padding:16px 28px;
background:#2148a6;
color:#fff;
border-radius:20px;
font-size:22px;
font-weight:800;
text-transform:uppercase;
letter-spacing:.02em;
}
.service-estimate__form{
width:100%;
}
.service-estimate__grid{
display:grid;
grid-template-columns:1.2fr 1.2fr 1.2fr auto;
gap:18px;
align-items:end;
}
.service-estimate__field{
display:block;
}
.service-estimate__field span{
display:block;
margin-bottom:10px;
font-size:16px;
font-weight:700;
color:#fff;
}
.service-estimate__field input{
width:100%;
height:58px;
border:2px solid rgba(255,255,255,.14);
border-radius:14px;
background:#fff;
color:#1f2f44;
padding:0 18px;
font-size:17px;
outline:none;
transition:border-color .2s ease, box-shadow .2s ease;
}
.service-estimate__field input::placeholder{
color:#6b7280;
}
.service-estimate__field input:focus{
border-color:#00c314;
box-shadow:0 0 0 3px rgba(0,195,20,.18);
}
.service-estimate__submit{
height:58px;
min-width:220px;
border:0;
border-radius:16px;
background:#00c314;
color:#fff;
font-size:20px;
font-weight:800;
text-transform:uppercase;
cursor:pointer;
padding:0 30px;
transition:transform .15s ease, box-shadow .2s ease, opacity .2s ease;
box-shadow:0 12px 28px rgba(0,195,20,.22);
}
.service-estimate__submit:hover{
transform:translateY(-1px);
}
.service-estimate__agree{
display:inline-flex;
align-items:center;
gap:12px;
margin-top:24px;
color:#fff;
font-size:16px;
cursor:pointer;
}
.service-estimate__agree input{
width:22px;
height:22px;
accent-color:#2a7fff;
}
@media (max-width: 1200px){
.service-estimate__grid{
grid-template-columns:1fr 1fr;
}
.service-estimate__submit{
width:100%;
}
}
@media (max-width: 767px){
.service-estimate{
padding: 8px 0 40px;
}
.service-estimate__card{
padding:24px 18px 22px;
border-radius:22px;
}
.service-estimate__badge{
width:100%;
font-size:18px;
padding:14px 18px;
margin-bottom:20px;
text-align:center;
}
.service-estimate__grid{
grid-template-columns:1fr;
gap:14px;
}
.service-estimate__field span,
.service-estimate__agree{
font-size:15px;
}
.service-estimate__field input,
.service-estimate__submit{
height:54px;
font-size:16px;
}
}
/* estimate form adjustments */
.estimate-section{
background:#0b1e4a;
padding:40px 0;
}
.estimate-section h2{
background:none;
padding:0;
margin-bottom:20px;
color:#fff;
font-weight:700;
}
.estimate-form{
max-width:1000px;
margin:auto;
}
.estimate-form input{
height:50px;
}
.btn--green, .estimate-form button{
background:#4CA154;
border:none;
font-size:18px;
padding:16px 34px;
border-radius:40px;
}
/* --- Final form + CTA fixes --- */
.service-intro__actions .service-intro__btn--primary,
.service-intro__btn--primary,
.service-intro .service-intro__btn--primary,
.service-intro a.service-intro__btn--primary{
background:#4CA154 !important;
color:#fff !important;
border-color:#4CA154 !important;
min-width:220px;
padding:18px 36px !important;
border-radius:999px !important;
font-size:18px !important;
font-weight:800 !important;
text-transform:uppercase;
letter-spacing:.02em;
display:inline-flex;
align-items:center;
justify-content:center;
}
.service-estimate{
padding:8px 0 24px !important;
background:#fff !important;
}
.service-estimate__card{
background:#020e4e !important;
border-radius:24px !important;
padding:20px 28px 18px !important;
color:#fff;
box-shadow:0 12px 32px rgba(2,14,78,.10) !important;
}
.service-estimate__title{
margin:0 0 14px !important;
padding:0 !important;
background:none !important;
color:#fff !important;
text-align:center;
font-size:28px !important;
font-weight:800 !important;
text-transform:uppercase;
letter-spacing:.02em;
}
.service-estimate__badge{
display:none !important;
}
.service-estimate__grid{
grid-template-columns:1.15fr 1.15fr 1.15fr auto !important;
gap:14px !important;
align-items:end;
}
.service-estimate__field span{
margin-bottom:8px !important;
font-size:15px !important;
}
.service-estimate__field input{
height:52px !important;
border-radius:12px !important;
font-size:16px !important;
}
.service-estimate__submit,
.service-estimate button[type="submit"]{
background:#4CA154 !important;
color:#fff !important;
border:none !important;
min-width:220px;
height:52px !important;
border-radius:999px !important;
font-size:17px !important;
font-weight:800 !important;
text-transform:uppercase;
letter-spacing:.02em;
box-shadow:none !important;
}
.service-estimate__agree{
display:none !important;
}
@media (max-width: 1100px){
.service-estimate__grid{
grid-template-columns:1fr 1fr !important;
}
.service-estimate__submit,
.service-estimate button[type="submit"]{
width:100%;
min-width:0;
}
}
@media (max-width: 767px){
.service-estimate{
padding:0 0 20px !important;
}
.service-estimate__card{
padding:18px 16px 16px !important;
border-radius:18px !important;
}
.service-estimate__title{
font-size:22px !important;
margin-bottom:12px !important;
}
.service-estimate__grid{
grid-template-columns:1fr !important;
gap:12px !important;
}
}
/* --- Adjust estimate title spacing and alignment --- */
.service-estimate__title{
text-align:left !important;
margin-bottom:22px !important;
}
/* ensure correct background color */
.service-estimate__card{
background:#020E4E !important;
}
/* Match form background to header navy */
.service-estimate__card{
background:#061b4b !important;
}
/* --- Force service estimate form to header navy --- */
.service-estimate .service-estimate__card,
section.service-estimate .service-estimate__card,
.service-estimate__card[style]{
background:#061B4B !important;
background-color:#061B4B !important;
}
/* Force correct form navy color */
.service-estimate__card{
background:#020E4E !important;
background-color:#020E4E !important;
}
/* FINAL override for form background */
section.service-estimate .service-estimate__card{
background:#020E4E !important;
background-color:#020E4E !important;
}
/* Force grease trap form background to header navy */
section.service-estimate .service-estimate__card,
.service-estimate__card{
background:#152372 !important;
background-color:#152372 !important;
}
/* Why Grease Trap Cleaning Matters cards */
.service-benefits-cards{
background:#ffffff;
padding:28px 0 36px;
}
.service-section-heading--cards{
margin-bottom:24px;
}
.service-section-heading--cards .service-section-heading__title{
color:#000000;
font-family:inherit;
font-size:40px;
line-height:1.15;
font-weight:800;
margin:0;
}
.service-benefits-cards__grid{
display:grid;
grid-template-columns:repeat(4, minmax(0, 1fr));
gap:24px;
align-items:stretch;
}
.service-benefit-card{
background:#ffffff;
border:1px solid #dbe5f5;
border-radius:18px;
padding:28px 24px 26px;
min-height:100%;
}
.service-benefit-card h3{
margin:0 0 14px;
color:#000000;
font-family:inherit;
font-size:20px;
line-height:1.25;
font-weight:800;
}
.service-benefit-card p{
margin:0;
color:#000000;
font-family:inherit;
font-size:17px;
line-height:1.65;
}
@media (max-width: 1200px){
.service-benefits-cards__grid{
grid-template-columns:repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 767px){
.service-benefits-cards{
padding:22px 0 28px;
}
.service-section-heading--cards .service-section-heading__title{
font-size:30px;
}
.service-benefits-cards__grid{
grid-template-columns:1fr;
gap:16px;
}
.service-benefit-card{
padding:22px 18px;
border-radius:16px;
}
.service-benefit-card h3{
font-size:18px;
}
.service-benefit-card p{
font-size:16px;
}
}
/* Smaller benefit cards with icons */
.service-benefits-cards{
background:#fff;
padding:26px 0 34px;
}
.service-section-heading--cards .service-section-heading__title{
font-size:32px;
color:#000;
}
.service-benefits-cards__grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:18px;
align-items:stretch;
}
.service-benefit-card{
background:#fff;
border:1px solid #d7e0ef;
border-radius:18px;
padding:20px 18px 18px;
}
.service-benefit-card__icon{
width:42px;
height:42px;
border-radius:12px;
background:#eef3ff;
color:#152372;
display:inline-flex;
align-items:center;
justify-content:center;
font-size:22px;
font-weight:800;
margin-bottom:14px;
}
.service-benefit-card h3{
margin:0 0 10px;
font-size:16px;
line-height:1.25;
font-weight:800;
color:#152372;
}
.service-benefit-card p{
margin:0;
font-size:14px;
line-height:1.55;
color:#000;
}
/* Choose us section */
.service-choose{
background:#fff;
padding:34px 0 38px;
}
.service-choose__intro{
max-width:1080px;
margin:0 0 28px;
}
.service-choose__title{
margin:0 0 20px;
color:#000;
font-size:40px;
line-height:1.05;
font-weight:800;
text-transform:uppercase;
}
.service-choose__intro p{
margin:0 0 18px;
color:#000;
font-size:18px;
line-height:1.7;
}
.service-choose__cards{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:22px;
margin:8px 0 30px;
}
.service-choose-card{
background:#fff;
border:1px solid #e0e4ea;
border-radius:22px;
padding:26px 22px;
min-height:162px;
box-shadow:0 10px 28px rgba(0,0,0,.05);
display:flex;
flex-direction:column;
justify-content:center;
align-items:flex-start;
}
.service-choose-card--active{
background:#edf5ef;
border-color:#a8d0b0;
}
.service-choose-card__icon{
width:48px;
height:48px;
border-radius:14px;
background:#eef2fb;
color:#2f57c4;
display:inline-flex;
align-items:center;
justify-content:center;
font-size:24px;
font-weight:800;
margin-bottom:16px;
margin-left:auto;
margin-right:auto;
}
.service-choose-card--active .service-choose-card__icon{
background:#1fa64a;
color:#fff;
}
.service-choose-card h3{
margin:0;
font-size:18px;
line-height:1.25;
font-weight:800;
color:#111;
}
.service-choose__detail{
border-top:1px solid #e4e4e4;
padding-top:28px;
}
.service-choose__detail h3{
margin:0 0 14px;
color:#000;
font-size:24px;
line-height:1.25;
font-weight:800;
}
.service-choose__detail p{
margin:0;
color:#000;
font-size:18px;
line-height:1.7;
}
@media (max-width: 1200px){
.service-benefits-cards__grid,
.service-choose__cards{
grid-template-columns:repeat(2,minmax(0,1fr));
}
}
@media (max-width: 767px){
.service-section-heading--cards .service-section-heading__title,
.service-choose__title{
font-size:28px;
}
.service-benefits-cards__grid,
.service-choose__cards{
grid-template-columns:1fr;
gap:16px;
}
.service-benefit-card{
padding:18px 16px;
}
.service-benefit-card h3{
font-size:15px;
}
.service-benefit-card p{
font-size:14px;
}
.service-choose__intro p,
.service-choose__detail p{
font-size:16px;
}
.service-choose__detail h3{
font-size:22px;
}
}
/* Smaller green icons + hover lift for benefit cards */
.service-benefit-card{
transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.service-benefit-card:hover{
transform: translateY(-6px) scale(1.02);
box-shadow: 0 18px 34px rgba(76,161,84,.18);
border-color: rgba(76,161,84,.45);
}
.service-benefit-card__icon{
width:34px;
height:34px;
border-radius:10px;
background:rgba(76,161,84,.10);
color:#4CA154;
font-size:16px;
margin-bottom:10px;
}
.service-benefit-card h3{
font-size:15px;
color:#152372;
}
.service-benefit-card p{
font-size:13px;
line-height:1.5;
}
/* Match main-page scale more closely for choose-us section */
.service-choose{
padding:26px 0 30px;
}
.service-choose__intro{
max-width:980px;
margin:0 0 20px;
}
.service-choose__title{
font-size:30px;
line-height:1.08;
margin:0 0 14px;
}
.service-choose__intro p{
font-size:16px;
line-height:1.65;
margin:0 0 14px;
max-width:920px;
}
.service-choose__cards{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:18px;
margin:6px 0 22px;
}
.service-choose-card{
appearance:none;
-webkit-appearance:none;
width:100%;
text-align:left;
cursor:pointer;
background:#fff;
border:1px solid #e0e4ea;
border-radius:18px;
padding:18px 18px;
min-height:120px;
box-shadow:0 8px 22px rgba(0,0,0,.04);
display:flex;
flex-direction:column;
justify-content:center;
align-items:flex-start;
transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, background-color .22s ease;
}
.service-choose-card:hover{
transform: translateY(-6px) scale(1.02);
box-shadow:0 18px 34px rgba(76,161,84,.18);
border-color:rgba(76,161,84,.4);
}
.service-choose-card--active{
background:#edf5ef;
border-color:#a8d0b0;
box-shadow:0 16px 30px rgba(76,161,84,.14);
}
.service-choose-card__icon{
width:42px;
height:42px;
border-radius:14px;
background:rgba(76,161,84,.10);
color:#4CA154;
display:inline-flex;
align-items:center;
justify-content:center;
font-size:18px;
font-weight:800;
margin-bottom:12px;
}
.service-choose-card--active .service-choose-card__icon{
background:#4CA154;
color:#fff;
}
.service-choose-card h3{
margin:0;
font-size:16px;
line-height:1.25;
font-weight:800;
color:#111;
}
.service-choose__detail-panels{
min-height:auto;
}
.service-choose__detail{
border-top:1px solid #e4e4e4;
padding-top:20px;
}
.service-choose__detail h3{
margin:0 0 12px;
font-size:20px;
line-height:1.25;
}
.service-choose__detail p{
font-size:16px;
line-height:1.65;
}
@media (max-width: 1200px){
.service-choose__cards{
grid-template-columns:repeat(2,minmax(0,1fr));
}
}
@media (max-width: 767px){
.service-choose__title{
font-size:24px;
}
.service-choose__intro p,
.service-choose__detail p{
font-size:15px;
}
.service-choose__cards{
grid-template-columns:1fr;
gap:14px;
}
.service-choose-card{
min-height:100px;
padding:16px;
}
.service-choose-card__icon{
width:38px;
height:38px;
font-size:16px;
}
}
/* Slightly larger benefit card typography */
.service-benefit-card h3{
font-size:17px !important;
}
.service-benefit-card p{
font-size:14px !important;
line-height:1.6 !important;
}
/* CTA inside choose-us descriptions */
.service-choose__cta{
display:inline-flex;
align-items:center;
justify-content:center;
margin-top:18px;
background:#4CA154;
color:#fff !important;
border:1px solid #4CA154;
border-radius:999px;
padding:14px 26px;
font-size:16px;
font-weight:800;
text-decoration:none;
box-shadow:0 10px 24px rgba(76,161,84,.18);
transition:transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.service-choose__cta:hover{
transform:translateY(-2px);
box-shadow:0 14px 28px rgba(76,161,84,.25);
}
/* New split process section */
.service-process--split{
background:#fff;
padding:28px 0 38px;
}
.service-process-split{
display:grid;
grid-template-columns:minmax(320px, 1.05fr) minmax(360px, 1fr);
gap:42px;
align-items:start;
}
.service-process-split__media{
position:relative;
}
.service-process-split__media img{
width:100%;
display:block;
border-radius:24px;
box-shadow:0 14px 34px rgba(0,0,0,.08);
object-fit:cover;
min-height:560px;
}
.service-process-split__badge{
position:absolute;
right:-18px;
bottom:-18px;
width:150px;
height:120px;
border-radius:20px;
background:#f2b524;
color:#111827;
display:flex;
flex-direction:column;
align-items:flex-start;
justify-content:center;
padding:20px 22px;
box-shadow:0 14px 28px rgba(0,0,0,.14);
}
.service-process-split__badge strong{
font-size:52px;
line-height:1;
font-weight:800;
}
.service-process-split__badge span{
font-size:18px;
line-height:1.2;
}
.service-process-split__steps{
display:flex;
flex-direction:column;
gap:26px;
}
.service-process-step{
display:grid;
grid-template-columns:68px 1fr;
gap:18px;
align-items:start;
position:relative;
}
.service-process-step:not(:last-child)::after{
content:"";
position:absolute;
left:33px;
top:70px;
width:3px;
height:62px;
background:#dbe5ff;
border-radius:3px;
}
.service-process-step__num{
width:68px;
height:68px;
border-radius:999px;
background:#214ba5;
color:#fff;
display:flex;
align-items:center;
justify-content:center;
font-size:22px;
font-weight:800;
line-height:1;
}
.service-process-step__content h3{
margin:4px 0 8px;
color:#111827;
font-size:24px;
line-height:1.2;
font-weight:800;
}
.service-process-step__content p{
margin:0;
color:#4b5563;
font-size:17px;
line-height:1.6;
}
@media (max-width: 1200px){
.service-process-split{
grid-template-columns:1fr;
}
.service-process-split__media img{
min-height:420px;
}
}
@media (max-width: 767px){
.service-process-split{
gap:24px;
}
.service-process-split__media img{
min-height:280px;
border-radius:18px;
}
.service-process-split__badge{
right:10px;
bottom:10px;
width:110px;
height:88px;
padding:14px 16px;
border-radius:16px;
}
.service-process-split__badge strong{
font-size:34px;
}
.service-process-split__badge span{
font-size:14px;
}
.service-process-step{
grid-template-columns:56px 1fr;
gap:14px;
}
.service-process-step__num{
width:56px;
height:56px;
font-size:18px;
}
.service-process-step:not(:last-child)::after{
left:27px;
top:58px;
height:54px;
}
.service-process-step__content h3{
font-size:20px;
}
.service-process-step__content p{
font-size:15px;
}
}
/* Refine process section heading and text */
.service-section-heading--process .service-section-heading__eyebrow{
color:#000 !important;
font-size:14px !important;
}
.service-section-heading--process .service-section-heading__title{
color:#000 !important;
font-size:30px !important;
line-height:1.12 !important;
font-weight:800 !important;
margin:0 !important;
}
/* Make process section more compact and text black */
.service-process--split{
padding:22px 0 28px !important;
}
.service-process-split{
align-items:start;
}
.service-process-split__media img{
min-height:520px !important;
max-height:520px !important;
}
.service-process-split__steps{
max-height:520px;
overflow-y:auto;
padding-right:10px;
scrollbar-width:thin;
scrollbar-color:#cfd7e7 transparent;
}
.service-process-split__steps::-webkit-scrollbar{
width:8px;
}
.service-process-split__steps::-webkit-scrollbar-track{
background:transparent;
}
.service-process-split__steps::-webkit-scrollbar-thumb{
background:#cfd7e7;
border-radius:999px;
}
.service-process-step{
gap:16px !important;
}
.service-process-step:not(:last-child)::after{
height:54px !important;
}
.service-process-step__content h3{
color:#000 !important;
font-size:20px !important;
line-height:1.2 !important;
margin:4px 0 8px !important;
}
.service-process-step__content p{
color:#000 !important;
font-size:15px !important;
line-height:1.6 !important;
}
/* Make Speak with a Pro buttons smaller to match main page scale */
.service-choose__cta{
margin-top:14px !important;
padding:10px 18px !important;
font-size:14px !important;
border-radius:999px !important;
box-shadow:0 8px 18px rgba(76,161,84,.14) !important;
}
@media (max-width: 1200px){
.service-process-split__media img{
min-height:420px !important;
max-height:none !important;
}
.service-process-split__steps{
max-height:420px;
}
}
@media (max-width: 767px){
.service-section-heading--process .service-section-heading__title{
font-size:24px !important;
}
.service-process-split__steps{
max-height:360px;
}
.service-process-step__content h3{
font-size:18px !important;
}
.service-process-step__content p{
font-size:14px !important;
}
.service-choose__cta{
padding:9px 16px !important;
font-size:13px !important;
}
}
/* Match main-page style section titles */
.service-section-heading__title{
text-transform:uppercase;
}
/* Add proper spacing between process and choose sections */
.service-process--split{
padding-bottom:60px !important;
}
/* Restore normal spacing for choose section */
.service-choose{
padding-top:70px !important;
padding-bottom:70px !important;
}
/* Increase spacing under process section */
.service-process--split + .service-choose{
margin-top:40px;
}
/* Remove badge spacing adjustments */
.service-process-split__media{
position:relative;
}
/* Add eyebrow to why-it-matters and tune heading spacing */
.service-section-heading--cards{
margin-bottom: 28px !important;
}
.service-section-heading--cards .service-section-heading__eyebrow{
display:block;
margin:0 0 10px !important;
color:#000 !important;
font-size:14px !important;
font-weight:800 !important;
text-transform:uppercase;
letter-spacing:.02em;
}
.service-section-heading--cards .service-section-heading__title{
text-transform:uppercase;
}
/* Reduce oversized gap between process and choose sections */
.service-process--split{
padding-bottom: 34px !important;
}
.service-process--split + .service-choose{
margin-top: 0 !important;
}
/* Loosen spacing inside choose-us section to match homepage better */
.service-choose{
padding-top: 42px !important;
padding-bottom: 48px !important;
}
.service-choose__intro{
margin:0 0 30px !important;
}
.service-choose__title{
margin:0 0 22px !important;
}
.service-choose__intro p{
margin:0 0 18px !important;
}
.service-choose__cards{
margin:14px 0 28px !important;
}
/* --- Unified section heading sizes on grease trap page --- */
.service-section-heading__title,
.service-gallery__title,
.service-choose__title,
.section-work .work-title{
font-size:40px !important;
line-height:1.08 !important;
font-weight:800 !important;
color:#000 !important;
text-transform:uppercase !important;
letter-spacing:0 !important;
}
.service-section-heading__eyebrow,
.service-section-heading--cards .service-section-heading__eyebrow,
.service-section-heading--process .service-section-heading__eyebrow{
color:#000 !important;
font-size:14px !important;
font-weight:800 !important;
text-transform:uppercase !important;
letter-spacing:.02em !important;
margin:0 0 10px !important;
}
.service-section-heading--process .service-section-heading__title{
font-size:40px !important;
color:#000 !important;
margin:0 !important;
}
.service-choose__title{
margin:0 0 22px !important;
}
.section-work .section__sub,
.service-gallery__sub{
font-size:16px !important;
line-height:1.6 !important;
}
/* ensure process/choose spacing feels normal */
.service-process--split{
padding-bottom:38px !important;
}
.service-process--split + .service-choose{
margin-top:0 !important;
}
.service-choose{
padding-top:38px !important;
padding-bottom:48px !important;
}
.service-choose__intro{
margin:0 0 34px !important;
}
.service-choose__cards{
margin:18px 0 30px !important;
}
@media (max-width: 767px){
.service-section-heading__title,
.service-gallery__title,
.service-choose__title,
.section-work .work-title,
.service-section-heading--process .service-section-heading__title{
font-size:30px !important;
}
}
/* Grease trap page: homepage gallery + quote section placement only */
.section.section-work.container{
margin-top: 8px;
margin-bottom: 34px;
}
.section.section-quote{
margin-top: 12px;
margin-bottom: 34px;
}
/* Reduce vertical padding for RELIABLE QUALITY EVERY TIME section */
.section.section-quote{
padding-top: 24px !important;
padding-bottom: 24px !important;
}
.quote-hero{
padding-top: 0 !important;
padding-bottom: 0 !important;
}
/* Apply same reduced padding to QUALITY / RELIABLE section on all pages */
.section-quote{
padding-top: 20px !important;
padding-bottom: 20px !important;
}
.section-quote .quote-hero{
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.section-quote .quote-hero__visual{
margin-top: 0 !important;
margin-bottom: 0 !important;
}
/* Main page: left-align Why Choose section */
#why-choose .becausecare2,
#why-choose .becausecare2__copy,
#why-choose .becausecare2__title,
#why-choose .becausecare2__copy p{
text-align:left !important;
margin-left:0 !important;
margin-right:auto !important;
}
#why-choose .becausecare2__copy{
max-width:900px !important;
}
#why-choose .becausecare2__title{
justify-content:flex-start !important;
align-items:flex-start !important;
}
/* Companies section on grease trap page */
.section.section-companies.container{
margin-top: 14px !important;
}
.section.section-companies.container .section__header.section__header--tight{
margin-bottom: 18px !important;
}
.section.section-companies.container .section__header.section__header--tight .h2-t{
font-size: 40px !important;
line-height: 1.08 !important;
font-weight: 800 !important;
color: #000 !important;
text-transform: uppercase !important;
}
/* Reduce spacing between gallery and companies section on grease page */
.section-work + .section-companies{
margin-top: 6px !important;
padding-top: 0 !important;
}
.section-companies.container{
margin-top: 8px !important;
}
/* Proper capitalization without breaking layout */
.service-hero__title{
text-transform: uppercase;
}
/* Ensure Grease Trap Cleaning hero title is capitalized */
.service-hero h1,
.service-hero__title,
.hero-title{
text-transform: uppercase !important;
}
/* Fix overlapping GREASE TRAP CLEANING hero title */
.service-intro h1,
.service-intro__text h1,
.service-intro .section-title,
.service-intro .title,
.service-intro h1.section-title,
.service-intro h1.title{
text-transform: uppercase !important;
font-size: 48px !important;
line-height: 1.02 !important;
letter-spacing: 0 !important;
word-break: normal !important;
overflow-wrap: normal !important;
white-space: normal !important;
max-width: 100% !important;
display: block !important;
margin: 0 0 22px !important;
}
.service-intro__text{
min-width: 0;
}
@media (max-width: 1200px){
.service-intro h1,
.service-intro__text h1,
.service-intro .section-title,
.service-intro .title,
.service-intro h1.section-title,
.service-intro h1.title{
font-size: 42px !important;
line-height: 1.04 !important;
}
}
@media (max-width: 900px){
.service-intro h1,
.service-intro__text h1,
.service-intro .section-title,
.service-intro .title,
.service-intro h1.section-title,
.service-intro h1.title{
font-size: 44px !important;
line-height: 1.08 !important;
}
}
@media (max-width: 640px){
.service-intro h1,
.service-intro__text h1,
.service-intro .section-title,
.service-intro .title,
.service-intro h1.section-title,
.service-intro h1.title{
font-size: 34px !important;
line-height: 1.08 !important;
}
}
/* Make main-page WHY CHOOSE section full width like other sections */
#why-choose .container,
#why-choose .becausecare2{
width: 100% !important;
max-width: 1200px !important;
}
#why-choose .becausecare2__copy{
max-width: none !important;
width: 100% !important;
}
/* FOG disposal process section */
.fog-process-steps{
background:#1f3f8f;
padding:70px 0;
border-radius:18px;
margin:80px auto;
color:#fff;
}
.fog-process-title{
font-size:38px;
font-weight:700;
margin-bottom:40px;
}
.fog-process-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:40px;
}
.fog-process-item{
display:flex;
gap:20px;
align-items:flex-start;
}
.fog-process-number{
background:#dfe5f3;
color:#1f3f8f;
font-weight:700;
border-radius:10px;
width:48px;
height:48px;
display:flex;
align-items:center;
justify-content:center;
font-size:20px;
flex-shrink:0;
}
@media (max-width:1000px){
.fog-process-grid{
grid-template-columns:1fr;
}
}
/* FOG disposal alternating process layout */
.fog-process-alt{
background:#fff;
padding:42px 0 54px;
}
.fog-process-alt__stack{
display:flex;
flex-direction:column;
gap:24px;
}
.fog-process-row{
display:grid;
grid-template-columns:1fr 1fr;
gap:24px;
align-items:stretch;
}
.fog-process-card{
border-radius:22px;
overflow:hidden;
min-height:220px;
}
.fog-process-card--text{
border:2px solid #1e3a8a;
background:#f7f8fb;
border:1px solid #e0e6f1;
padding:28px 30px;
}
.fog-process-card--text h3{
margin:0 0 12px;
color:#152372;
font-size:24px;
line-height:1.2;
font-weight:800;
}
.fog-process-card--text p{
margin:0;
color:#000;
font-size:17px;
line-height:1.65;
}
.fog-process-card__num{
display:inline-flex;
align-items:center;
justify-content:center;
width:48px;
height:48px;
border-radius:12px;
background:#152372;
color:#fff;
font-size:18px;
font-weight:800;
margin-bottom:18px;
}
.fog-process-card--image{
border:2px solid #2bb24c;
background:#eef1f6;
border:1px solid #e0e6f1;
}
.fog-process-card__placeholder{
width:100%;
height:100%;
min-height:220px;
display:flex;
align-items:center;
justify-content:center;
color:#8b94a7;
font-size:16px;
font-weight:700;
background:linear-gradient(180deg,#f5f7fb,#e9edf5);
}
@media (max-width: 900px){
.fog-process-row{
grid-template-columns:1fr;
gap:16px;
}
.fog-process-row--reverse .fog-process-card--image{
border:2px solid #2bb24c;
order:2;
}
.fog-process-row--reverse .fog-process-card--text{
border:2px solid #1e3a8a;
order:1;
}
.fog-process-card--text{
border:2px solid #1e3a8a;
padding:22px 20px;
}
.fog-process-card--text h3{
font-size:21px;
}
.fog-process-card--text p{
font-size:16px;
}
}
/* Footer CTA button color fix */
.footer .book-now-btn,
.footer .call-now-btn,
.footer .footer-cta-btn,
.footer .btn-green{
background:#1FA247 !important;
border-color:#1FA247 !important;
}
/* 24/7 emergency services mini cards */
.emergency-services-mini{
background:#fff;
padding:28px 0 36px;
}
.emergency-services-mini__grid{
display:grid;
grid-template-columns:repeat(4, minmax(0, 1fr));
gap:18px;
align-items:stretch;
}
.emergency-service-card{
background:#fff;
border:1px solid #d9e2f0;
border-radius:18px;
padding:20px 18px;
min-height:100%;
transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.emergency-service-card:hover{
transform:translateY(-4px);
box-shadow:0 16px 28px rgba(76,161,84,.14);
border-color:rgba(76,161,84,.38);
}
.emergency-service-card h3{
margin:0 0 10px;
color:#152372;
font-size:16px;
line-height:1.25;
font-weight:800;
}
.emergency-service-card p{
margin:0;
color:#000;
font-size:14px;
line-height:1.55;
}
@media (max-width: 1200px){
.emergency-services-mini__grid{
grid-template-columns:repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 767px){
.emergency-services-mini{
padding:24px 0 30px;
}
.emergency-services-mini__grid{
grid-template-columns:1fr;
gap:14px;
}
.emergency-service-card{
padding:18px 16px;
}
.emergency-service-card h3{
font-size:15px;
}
.emergency-service-card p{
font-size:14px;
}
}
/* smaller service cards for emergency page */
.services-mini-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
}
.service-card--mini{
border-radius:18px;
overflow:hidden;
border:1px solid #e2e6ef;
background:#fff;
}
.service-card--mini .service-card__image{
height:120px;
background:#f2f4f8;
border-bottom:none;
background-size:cover;
background-position:center;
background-repeat:no-repeat;
}
.service-card--mini .service-card__content{
padding:18px;
}
.service-card--mini h3{
font-size:18px;
margin-bottom:8px;
}
.service-card--mini p{
font-size:14px;
line-height:1.5;
margin-bottom:10px;
}
.service-card--mini .service-card__link{
color:#1e63d5;
font-weight:600;
text-decoration:none;
}
@media(max-width:1000px){
.services-mini-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:600px){
.services-mini-grid{grid-template-columns:1fr;}
}
/* About Us page hero */
.about-hero{
background:#f3f4f6;
padding:56px 0 30px;
}
.about-hero__wrap{
display:grid;
grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
gap:58px;
align-items:center;
}
.about-hero__text{
min-width:0;
}
.about-hero__title{
margin:0 0 20px;
max-width:19ch;
color:#363638;
font-size:clamp(36px,3.1vw,46px);
line-height:1.08;
font-weight:800;
letter-spacing:-0.03em;
text-transform:uppercase;
}
.about-hero__lead{
max-width:760px;
margin:0 0 24px;
}
.about-hero__lead p{
margin:0 0 16px;
color:#4d4d4f;
font-size:18px;
line-height:1.72;
}
.about-hero__lead p strong{
color:#363638;
font-weight:800;
}
.about-hero__actions{
margin:0;
display:flex;
gap:14px;
}
.about-hero__call,
.about-hero__actions .btn,
.about-hero__actions a.btn,
.about-hero__actions a.btn-green{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:320px;
min-height:86px;
padding:22px 54px;
border-radius:999px;
background:#4ea853;
border:none;
box-shadow:0 20px 42px rgba(78,168,83,.16);
color:#fff;
font-size:31px;
font-weight:800;
font-style:italic;
line-height:1;
letter-spacing:.01em;
text-transform:uppercase;
}
.about-hero__call:hover,
.about-hero__actions .btn:hover,
.about-hero__actions a.btn:hover,
.about-hero__actions a.btn-green:hover{
transform:translateY(-2px);
box-shadow:0 24px 44px rgba(78,168,83,.22);
}
.about-hero__visual{
position:relative;
min-height:520px;
display:flex;
align-items:flex-end;
justify-content:flex-end;
overflow:visible;
isolation:isolate;
}
.about-hero__graphic{
position:absolute;
inset:10px -8px 10px -6px;
z-index:-1;
pointer-events:none;
}
.about-hero__graphic::before,
.about-hero__graphic::after{
content:"";
position:absolute;
border-radius:50%;
}
.about-hero__graphic::before{
width:430px;
height:430px;
right:22px;
bottom:18px;
background:rgba(227,228,230,.62);
}
.about-hero__graphic::after{
width:520px;
height:520px;
right:-36px;
bottom:-34px;
border:7px solid rgba(224,225,227,.72);
}
.about-hero__worker{
position:relative;
z-index:1;
width:360px;
height:520px;
border-radius:28px;
background:#111;
box-shadow:0 14px 30px rgba(0,0,0,.08);
}
.about-highlights{
background:#f3f4f6;
padding:64px 0 84px;
}
.about-highlights__grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:24px;
align-items:stretch;
}
.about-highlights__card{
min-height:220px;
padding:28px 22px 26px;
border-radius:28px;
background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(246,247,249,.98) 100%);
box-shadow:0 4px 14px rgba(24,34,65,.07), inset 0 0 0 1px rgba(214,217,223,.92);
text-align:center;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
transition:transform .22s ease, box-shadow .22s ease;
}
.about-highlights__card:hover{
transform:translateY(-8px) scale(1.02);
box-shadow:0 16px 30px rgba(31,177,84,.16), 0 10px 22px rgba(35,78,166,.08), inset 0 0 0 1px rgba(31,177,84,.24);
}
.about-highlights__icon{
width:52px;
height:52px;
display:flex;
align-items:center;
justify-content:center;
color:#4ca154;
margin-bottom:18px;
}
.about-highlights__icon svg{
width:52px;
height:52px;
display:block;
}
.about-highlights__card strong{
display:block;
margin:0 0 10px;
color:#234ea6;
font-size:48px;
line-height:1;
font-weight:800;
letter-spacing:-0.04em;
}
.about-highlights__card span{
display:block;
color:#6a7386;
font-size:18px;
line-height:1.3;
font-weight:500;
}
@media (max-width: 1180px){
.about-hero__wrap{
grid-template-columns:1fr;
gap:44px;
}
.about-hero__visual{
justify-content:center;
min-height:480px;
}
.about-hero__graphic{
inset:-6px -12px 0 -12px;
}
.about-hero__graphic::before{
right:50%;
transform:translateX(50%);
bottom:24px;
}
.about-hero__graphic::after{
right:50%;
transform:translateX(50%);
bottom:-16px;
}
}
@media (max-width: 900px){
.about-highlights__grid{
grid-template-columns:1fr;
gap:18px;
}
}
@media (max-width: 767px){
.about-hero{
padding:34px 0 12px;
}
.about-hero__title{
font-size:32px;
line-height:1.12;
max-width:14ch;
}
.about-hero__lead p{
font-size:15px;
line-height:1.64;
}
.about-hero__call,
.about-hero__actions .btn,
.about-hero__actions a.btn,
.about-hero__actions a.btn-green{
min-width:148px;
min-height:50px;
padding:14px 22px;
font-size:14px;
}
.about-hero__visual{
min-height:340px;
}
.about-hero__graphic::before{
width:280px;
height:280px;
right:50%;
transform:translateX(50%);
bottom:16px;
}
.about-hero__graphic::after{
width:340px;
height:340px;
right:50%;
transform:translateX(50%);
bottom:-18px;
border-width:5px;
}
.about-hero__worker{
width:240px;
height:320px;
border-radius:22px;
}
.about-highlights{
padding:44px 0 52px;
}
.about-highlights__card{
min-height:0;
padding:24px 18px 22px;
border-radius:22px;
}
.about-highlights__icon,
.about-highlights__icon svg{
width:44px;
height:44px;
}
.about-highlights__icon{
margin-bottom:14px;
}
.about-highlights__card strong{
font-size:38px;
}
.about-highlights__card span{
font-size:16px;
}
}
/* --- About page refinements: highlights + experience section --- */
.about-highlights{
background:#f3f4f6;
padding:56px 0 78px;
}
.about-highlights__grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:20px;
align-items:stretch;
}
.about-highlights__card{
min-height:164px;
padding:20px 18px 18px;
border-radius:24px;
background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(246,247,249,.98) 100%);
box-shadow:0 4px 14px rgba(24,34,65,.07), inset 0 0 0 1px rgba(214,217,223,.92);
text-align:center;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
transition:transform .22s ease, box-shadow .22s ease;
}
.about-highlights__card:hover{
transform:translateY(-8px) scale(1.02);
box-shadow:0 16px 30px rgba(31,177,84,.16), 0 10px 22px rgba(35,78,166,.08), inset 0 0 0 1px rgba(31,177,84,.24);
}
.about-highlights__icon{
width:42px;
height:42px;
display:flex;
align-items:center;
justify-content:center;
color:#4ca154;
margin-bottom:14px;
}
.about-highlights__icon svg{
width:42px;
height:42px;
display:block;
}
.about-highlights__card strong{
display:block;
margin:0 0 8px;
color:#234ea6;
font-size:38px;
line-height:1;
font-weight:800;
letter-spacing:-0.04em;
}
.about-highlights__card span{
display:block;
color:#6a7386;
font-size:16px;
line-height:1.28;
font-weight:500;
}
.about-experience{padding-top:90px; padding-bottom:40px;}
.about-experience__wrap{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(360px,.92fr);
gap:56px;
align-items:center;
}
.about-experience__content{
min-width:0;
}
.about-experience__title{
margin:0 0 22px;
color:#234ea6;
font-size:clamp(32px,2.65vw,46px);
line-height:1.1;
font-weight:800;
letter-spacing:-0.03em;
}
.about-experience__scroll{
max-height:430px;
overflow-y:auto;
padding-right:16px;
}
.about-experience__scroll p{
margin:0 0 18px;
color:#4d4d4f;
font-size:18px;
line-height:1.76;
}
.about-experience__scroll::-webkit-scrollbar{
width:7px;
}
.about-experience__scroll::-webkit-scrollbar-track{
background:#eef0f3;
border-radius:999px;
}
.about-experience__scroll::-webkit-scrollbar-thumb{
background:#4ca154;
border-radius:999px;
}
.about-experience__media{
min-width:0;
}
.about-experience__image-frame{
position:relative;
border-radius:30px;
overflow:hidden;
box-shadow:0 18px 40px rgba(20,27,45,.08);
background:#e9edf3;
}
.about-experience__image-frame img{
width:100%;
height:100%;
min-height:460px;
object-fit:cover;
display:block;
}
@media (max-width: 1180px){
.about-experience__wrap{
grid-template-columns:1fr;
gap:34px;
}
}
@media (max-width: 900px){
.about-highlights__grid{
grid-template-columns:1fr;
gap:18px;
}
.about-experience__image-frame img{
min-height:360px;
}
}
@media (max-width: 767px){
.about-highlights{
padding:40px 0 52px;
}
.about-highlights__card{
min-height:0;
padding:18px 16px;
}
.about-highlights__icon,
.about-highlights__icon svg{
width:38px;
height:38px;
}
.about-highlights__card strong{
font-size:32px;
}
.about-highlights__card span{
font-size:15px;
}
.about-experience{padding-top:90px; padding-bottom:40px;}
.about-experience__title{
font-size:30px;
margin-bottom:18px;
}
.about-experience__scroll{
max-height:360px;
padding-right:10px;
}
.about-experience__scroll p{
font-size:16px;
line-height:1.7;
}
.about-experience__image-frame{
border-radius:24px;
}
.about-experience__image-frame img{
min-height:280px;
}
}
.about-experience__title{
color:#363638;
font-family:'Montserrat',sans-serif;
font-weight:800;
}
.about-mission{padding:24px 0 24px; background:#fff;}
.about-mission__wrap{
display:grid;
grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
gap:64px;
align-items:start;
}
.about-mission__media,
.about-mission__content{
min-width:0;
}
.about-mission__tools-stage{
position:relative;
min-height:260px;
overflow:visible !important;
}
.about-mission__title{
margin:0 0 32px;
color:#363638;
font-size:clamp(30px,2.8vw,52px);
line-height:1.06;
font-weight:800;
letter-spacing:-0.03em;
text-transform:uppercase;
}
.about-mission__scroll{
max-height:360px;
overflow-y:auto;
padding-right:14px;
}
.about-mission__scroll::-webkit-scrollbar{
width:8px;
}
.about-mission__scroll::-webkit-scrollbar-track{
background:#eef1f5;
border-radius:999px;
}
.about-mission__scroll::-webkit-scrollbar-thumb{
background:#19a957;
border-radius:999px;
}
.about-mission__item{
display:grid;
grid-template-columns:70px minmax(0,1fr);
gap:18px;
align-items:flex-start;
margin:0 0 30px;
}
.about-mission__item:last-child{
margin-bottom:0;
}
.about-mission__icon{
width:58px;
height:58px;
border-radius:50%;
background:rgba(255,255,255,.92);
box-shadow:inset 0 0 0 1px rgba(220,224,231,.95);
color:#234ea6;
display:flex;
align-items:center;
justify-content:center;
}
.about-mission__icon svg{
width:30px;
height:30px;
display:block;
}
.about-mission__text h3{
margin:2px 0 10px;
color:#363638;
font-size:clamp(22px,1.8vw,28px);
line-height:1.18;
font-weight:800;
letter-spacing:-0.02em;
text-transform:uppercase;
}
.about-mission__text p{
margin:0;
color:#4d4d4f;
font-size:18px;
line-height:1.72;
}
@media (max-width: 1180px){
.about-mission__wrap{
grid-template-columns:1fr;
gap:38px;
}
.about-mission__tools-stage{
position:relative;
min-height:260px;
overflow:visible !important;
}
.about-mission__scroll{
max-height:none;
overflow:visible;
padding-right:0;
}
}
@media (max-width: 767px){
.about-mission{
padding:18px 0 58px;
}
.about-mission__title{
margin-bottom:24px;
font-size:30px;
}
.about-mission__tools-stage{
position:relative;
min-height:260px;
overflow:visible !important;
}
.about-mission__item{
grid-template-columns:52px minmax(0,1fr);
gap:14px;
margin-bottom:22px;
}
.about-mission__icon{
width:46px;
height:46px;
}
.about-mission__icon svg{
width:24px;
height:24px;
}
.about-mission__text h3{
font-size:19px;
margin-bottom:8px;
}
.about-mission__text p{
font-size:15px;
line-height:1.65;
}
}
/* About Us page spacing + appended homepage sections */
.about-mission{
padding-bottom: 22px !important;
}
.about-mission + .section.section-reviews.container{
margin-top: 0 !important;
padding-top: 18px !important;
}
.about-mission__scroll{
max-height: 255px !important;
}
.about-us-page .section.section-reviews.container,
body .section.section-reviews.container{
margin-bottom: 0;
}
.about-us-page .section.section-quote,
body .section.section-quote{
padding-top: 72px;
padding-bottom: 72px;
}
.about-us-page .section.section-map.container,
body .section.section-map.container{
margin-top: 0;
padding-top: 72px;
padding-bottom: 72px;
}
@media (max-width: 767px){
.about-mission{
padding-bottom: 12px !important;
}
.about-mission + .section.section-reviews.container{
padding-top: 8px !important;
}
.about-us-page .section.section-quote,
body .section.section-quote,
.about-us-page .section.section-map.container,
body .section.section-map.container{
padding-top: 48px;
padding-bottom: 48px;
}
}
/* About Us page: tighten Mission -> Reviews spacing */
.about-mission__tools-stage{
position:relative;
min-height:260px;
overflow:visible !important;
}
.about-mission{
padding-bottom: 12px !important;
}
.about-mission + .section.section-reviews.container{
margin-top: 0 !important;
padding-top: 12px !important;
}
@media (max-width: 767px){
.about-mission{
padding-bottom: 8px !important;
}
.about-mission + .section.section-reviews.container{
padding-top: 8px !important;
}
}
/* Final spacing fixes requested */
/* About Us: slightly increase Mission -> Reviews gap */
.about-mission{
padding-bottom: 18px !important;
margin-bottom: 0 !important;
}
.about-mission + .section.section-reviews.container{
margin-top: 0 !important;
padding-top: 22px !important;
}
/* Homepage: reduce Why Choose -> Reviews gap */
#why-choose{
padding-bottom: 18px !important;
margin-bottom: 0 !important;
}
#why-choose + .section.section-reviews.container{
margin-top: 0 !important;
padding-top: 26px !important;
}
@media (max-width: 767px){
.about-mission{
padding-bottom: 12px !important;
}
.about-mission + .section.section-reviews.container{
padding-top: 16px !important;
}
#why-choose{
padding-bottom: 12px !important;
}
#why-choose + .section.section-reviews.container{
padding-top: 18px !important;
}
}
/* 2026-03-07 spacing corrections: homepage + about page review transitions */
#why-choose{
padding-bottom: 24px !important;
margin-bottom: 0 !important;
}
#why-choose + #reviews.section.section-reviews.container,
#why-choose + section.section.section-reviews.container{
padding-top: 24px !important;
margin-top: 0 !important;
}
.about-mission{
padding-bottom: 52px !important;
margin-bottom: 0 !important;
}
.about-mission + #reviews.section.section-reviews.container,
.about-mission + section.section.section-reviews.container{
padding-top: 52px !important;
margin-top: 0 !important;
}
/* --- spacing adjustment homepage --- */
section#why-choose, .why-choose-section{
padding-bottom:60px !important;
}
section#reviews, .reviews-section{
padding-top:60px !important;
}
/* --- about page scrollbar grey --- */
.scroll-box::-webkit-scrollbar-thumb{
background:#bfbfbf !important;
}
.scroll-box::-webkit-scrollbar-track{
background:#f0f0f0 !important;
}
/* 2026-03-07 final spacing + scrollbar corrections */
/* Homepage: slightly bigger than tight version, but much smaller than oversized gap */
body.home #why-choose,
body #why-choose{
padding-bottom: 34px !important;
margin-bottom: 0 !important;
}
body.home #why-choose + #reviews.section.section-reviews.container,
body.home #why-choose + section.section.section-reviews.container,
body #why-choose + #reviews.section.section-reviews.container,
body #why-choose + section.section.section-reviews.container{
padding-top: 34px !important;
margin-top: 0 !important;
}
@media (max-width: 767px){
body.home #why-choose,
body #why-choose{
padding-bottom: 24px !important;
}
body.home #why-choose + #reviews.section.section-reviews.container,
body.home #why-choose + section.section.section-reviews.container,
body #why-choose + #reviews.section.section-reviews.container,
body #why-choose + section.section.section-reviews.container{
padding-top: 24px !important;
}
}
/* About page: make both custom scroll areas use the same grey scrollbar style as the main page */
.about-experience__scroll,
.about-mission__scroll{
scrollbar-width: thin;
scrollbar-color: rgba(0,0,0,.18) rgba(0,0,0,.06);
}
.about-experience__scroll::-webkit-scrollbar,
.about-mission__scroll::-webkit-scrollbar{
width: 8px !important;
}
.about-experience__scroll::-webkit-scrollbar-track,
.about-mission__scroll::-webkit-scrollbar-track{
background: rgba(0,0,0,.06) !important;
border-radius: 999px !important;
}
.about-experience__scroll::-webkit-scrollbar-thumb,
.about-mission__scroll::-webkit-scrollbar-thumb{
background: rgba(0,0,0,.18) !important;
border-radius: 999px !important;
}
.about-experience__scroll::-webkit-scrollbar-thumb:hover,
.about-mission__scroll::-webkit-scrollbar-thumb:hover{
background: rgba(0,0,0,.28) !important;
}
/* 2026-03-07 FINAL homepage spacing trim: Why Choose -> Reviews */
body.home #why-choose,
body #why-choose{
padding-bottom: 8px !important;
margin-bottom: 0 !important;
}
body.home #why-choose + #reviews.section.section-reviews.container,
body.home #why-choose + section.section.section-reviews.container,
body #why-choose + #reviews.section.section-reviews.container,
body #why-choose + section.section.section-reviews.container{
padding-top: 10px !important;
margin-top: 0 !important;
}
@media (max-width: 767px){
body.home #why-choose,
body #why-choose{
padding-bottom: 8px !important;
}
body.home #why-choose + #reviews.section.section-reviews.container,
body.home #why-choose + section.section.section-reviews.container,
body #why-choose + #reviews.section.section-reviews.container,
body #why-choose + section.section.section-reviews.container{
padding-top: 10px !important;
}
}
/* 2026-03-07 targeted homepage spacing reduction: Why Choose -> Reviews */
body.home #why-choose .becausecare2__copy,
body #why-choose .becausecare2__copy{
margin-bottom: 20px !important;
}
body.home #why-choose .becausecare2__copy p:last-child,
body #why-choose .becausecare2__copy p:last-child{
margin-bottom: 0 !important;
}
body.home #why-choose .becausecare2__cards,
body #why-choose .becausecare2__cards{
margin-top: 10px !important;
}
body.home #why-choose .becausecare2__panel,
body #why-choose .becausecare2__panel{
margin-top: 16px !important;
padding-top: 16px !important;
margin-bottom: 0 !important;
}
body.home #why-choose .becausecare2__cta,
body #why-choose .becausecare2__cta{
margin-top: 12px !important;
margin-bottom: 0 !important;
}
body.home #why-choose,
body #why-choose{
padding-bottom: 0 !important;
}
body.home #why-choose + #reviews.section.section-reviews.container,
body.home #why-choose + section.section.section-reviews.container,
body #why-choose + #reviews.section.section-reviews.container,
body #why-choose + section.section.section-reviews.container{
padding-top: 18px !important;
margin-top: 0 !important;
}
@media (max-width: 767px){
body.home #why-choose .becausecare2__copy,
body #why-choose .becausecare2__copy{
margin-bottom: 16px !important;
}
body.home #why-choose .becausecare2__panel,
body #why-choose .becausecare2__panel{
margin-top: 14px !important;
padding-top: 14px !important;
}
body.home #why-choose + #reviews.section.section-reviews.container,
body.home #why-choose + section.section.section-reviews.container,
body #why-choose + #reviews.section.section-reviews.container,
body #why-choose + section.section.section-reviews.container{
padding-top: 16px !important;
}
}
/* 2026-03-07 direct homepage gap fix: pull reviews upward */
body.home #reviews.section.section-reviews.container,
body #reviews.section.section-reviews.container{
padding-top: 12px !important;
}
body.home #why-choose,
body #why-choose{
padding-bottom: 0 !important;
margin-bottom: 0 !important;
}
@media (max-width: 767px){
body.home #reviews.section.section-reviews.container,
body #reviews.section.section-reviews.container{
padding-top: 10px !important;
}
}
/* Reduce gap between Speak With a Pro button and Reviews section */
.why-choose-section .btn,
.why-choose-section .button,
.why-choose-section .cta-button{
margin-bottom:10px !important;
}
.why-choose-section p:last-of-type{
margin-bottom:12px !important;
}
.reviews-section{
margin-top:10px !important;
padding-top:25px !important;
}
/* Direct homepage spacing fix: shrink gap between Speak With a Pro and Reviews */
body.home #why-choose{padding-bottom:0 !important;margin-bottom:0 !important;}
body.home #reviews.section.section-reviews.container{padding-top:8px !important;}
@media (max-width: 767px){body.home #reviews.section.section-reviews.container{padding-top:8px !important;}}
/* 2026-03-07 aggressive homepage gap reduction for why-choose -> reviews */
body.home #why-choose{padding-bottom:0 !important;margin-bottom:0 !important;}
body.home #why-choose .becausecare2__panel{margin-bottom:0 !important;padding-bottom:0 !important;}
body.home #why-choose .becausecare2__inner{padding-bottom:0 !important;margin-bottom:0 !important;}
body.home #why-choose .becausecare2__cta{margin-bottom:0 !important;}
body.home #reviews.section.section-reviews.container{padding-top:0 !important;}
@media (max-width: 767px){body.home #reviews.section.section-reviews.container{padding-top:0 !important;}}
/* FINAL homepage gap fix: reduce space between Speak With a Pro and Reviews */
body.home #why-choose,
body #why-choose{
margin-bottom:-140px !important;
padding-bottom:0 !important;
}
body.home #reviews.section.section-reviews.container,
body #reviews.section.section-reviews.container{
margin-top:0 !important;
padding-top:40px !important;
}
@media (max-width: 767px){
body.home #why-choose,
body #why-choose{ margin-bottom:-70px !important; }
body.home #reviews.section.section-reviews.container,
body #reviews.section.section-reviews.container{ padding-top:18px !important; }
}
/* 2026-03-07 final homepage gap tune: add a bit more space between why-choose and reviews */
body.home #why-choose,
body #why-choose{
padding-bottom:24px !important;
margin-bottom:-104px !important;
}
body.home #reviews.section.section-reviews.container,
body #reviews.section.section-reviews.container{
margin-top:0 !important;
padding-top:40px !important;
}
@media (max-width: 767px){
body.home #why-choose,
body #why-choose{ padding-bottom:14px !important; margin-bottom:-52px !important; }
body.home #reviews.section.section-reviews.container,
body #reviews.section.section-reviews.container{ padding-top:20px !important; }
}
/* CONTACT PAGE */
.contact-hero {
padding-top: 56px;
padding-bottom: 72px;
}
.contact-hero__container {
display: grid;
grid-template-columns: minmax(0, 1.08fr) minmax(360px, 460px);
gap: 56px;
align-items: start;
}
.contact-hero__eyebrow {
display: none;
}
.contact-hero__title {
margin: 0 0 14px;
color: #3a3a3a;
font-size: clamp(28px, 2.6vw, 40px);
line-height: 1.12;
font-weight: 800;
text-transform: uppercase;
max-width: 680px;
}
.contact-hero__desc {
margin: 0 0 24px;
max-width: 680px;
color: #50555f;
font-size: 15px;
line-height: 1.65;
}
.contact-hero__grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 20px 28px;
}
.contact-card {
display: grid;
grid-template-columns: 30px 1fr;
gap: 12px;
align-items: start;
}
.contact-card__icon {
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
border-radius: 50%;
background: #f0f1f4;
color: #aeb3bb;
font-size: 15px;
line-height: 1;
}
.contact-card__icon--accent {
color: #2e66ff;
}
.contact-card h3 {
margin: 0 0 4px;
color: #3a3a3a;
font-size: 18px;
line-height: 1.1;
font-weight: 800;
text-transform: uppercase;
}
.contact-card p {
margin: 0 0 5px;
color: #4f535a;
font-size: 15px;
line-height: 1.45;
}
.contact-card a {
color: inherit;
text-decoration: none;
}
.contact-card a:hover {
color: #223f88;
}
.contact-hero__form-wrap {
min-height: 100%;
}
.contact-form {
position: relative;
z-index: 1;
}
@media (max-width: 1100px) {
.contact-hero__container {
grid-template-columns: 1fr;
}
.contact-hero__title,
.contact-hero__desc {
max-width: none;
}
.contact-hero__form-wrap {
max-width: 520px;
}
}
@media (max-width: 767px) {
.contact-hero {
padding-top: 28px;
padding-bottom: 44px;
}
.contact-hero__title {
font-size: 26px;
}
.contact-hero__desc {
font-size: 14px;
margin-bottom: 18px;
}
.contact-hero__grid {
grid-template-columns: 1fr;
gap: 16px;
}
.contact-card h3 {
font-size: 17px;
}
.contact-card p {
font-size: 17px;
}
}
/* CONTACT PAGE TIGHTER CONTACT INFO + ICON FONT */
.contact-hero__grid {
gap: 16px 24px;
max-width: 760px;
}
.contact-card {
grid-template-columns: 22px 1fr;
gap: 10px;
}
.contact-card__icon {
width: 22px;
height: 22px;
background: transparent;
border-radius: 0;
color: #c5c5c5;
font-size: 20px;
line-height: 1;
justify-content: flex-start;
align-items: flex-start;
}
.contact-card__icon i {
display: block;
font-size: 20px;
line-height: 1;
color: inherit;
}
.contact-card__icon--accent {
color: #c5c5c5;
}
.contact-card h3 {
margin: 0 0 6px;
color: #3f3f44;
font-size: 15px;
line-height: 1.05;
font-weight: 800;
text-transform: uppercase;
}
.contact-card p,
.contact-card a {
color: #4c5057;
font-size: 13px;
line-height: 1.45;
}
.contact-card p {
margin: 0 0 4px;
}
.contact-hero__desc {
font-size: 14px;
line-height: 1.6;
max-width: 610px;
}
@media (max-width: 767px) {
.contact-card {
grid-template-columns: 20px 1fr;
gap: 10px;
}
.contact-card__icon,
.contact-card__icon i {
width: 20px;
height: 20px;
font-size: 18px;
}
.contact-card h3 {
font-size: 14px;
}
.contact-card p,
.contact-card a {
font-size: 13px;
}
}
/* CONTACT PAGE HERO LEFT SIDE TWEAKS */
.contact-hero__title {
font-size: clamp(30px, 2.8vw, 44px);
margin-bottom: 16px;
}
.contact-hero__desc {
font-size: 15px;
line-height: 1.65;
max-width: 660px;
margin-bottom: 26px;
}
.contact-card h3 {
font-size: 14px;
}
.contact-card p,
.contact-card a {
font-size: 12px;
line-height: 1.45;
}
.contact-hero__call {
display: inline-flex;
align-items: center;
justify-content: center;
margin-top: 22px;
min-width: 320px;
min-height: 86px;
padding: 22px 54px;
border-radius: 999px;
background: #4ea853;
color: #fff;
text-decoration: none;
font-weight: 800;
font-style: italic;
font-size: 31px;
line-height: 1;
letter-spacing: .01em;
box-shadow: 0 20px 42px rgba(78,168,83,.16);
transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.contact-hero__call:hover {
transform: translateY(-2px);
box-shadow: 0 24px 44px rgba(78,168,83,.22);
filter: brightness(.98);
}
@media (max-width: 767px) {
.contact-hero__title { font-size: 28px; }
.contact-hero__desc { font-size: 14px; }
.contact-card h3 { font-size: 13px; }
.contact-card p, .contact-card a { font-size: 12px; }
.contact-hero__call, .about-hero__call { width: 100%; max-width: 320px; min-width: 0; min-height: 74px; padding: 18px 28px; font-size: 24px; }
}
/* Downsize About + Contact call buttons */
.about-hero__call,.about-hero__actions .btn,.about-hero__actions a.btn,.about-hero__actions a.btn-green,.contact-hero__call{min-width:198px !important;min-height:54px !important;padding:14px 30px !important;font-size:16px !important;box-shadow:0 12px 26px rgba(78,168,83,.14) !important;}
/* Contact icons refresh */
.contact-card__icon {
width: 24px;
height: 24px;
color: #8a9099;
}
.contact-card__icon svg {
width: 24px;
height: 24px;
display: block;
}
.contact-card__icon i { display:none; }
.contact-card__icon--hours { color: #7f8792; }
.contact-card__icon--phone { color: #4ea853; }
.contact-card__icon--location { color: #223f88; }
.contact-card__icon--email { color: #7f8792; }
/* Reviews page */
.reviews-page-hero {
padding-top: 48px;
padding-bottom: 36px;
}
.reviews-page-hero__inner {
max-width: 840px;
}
.reviews-page-hero__eyebrow {
margin: 0 0 10px;
color: #4ea853;
font-size: 13px;
font-weight: 700;
letter-spacing: .08em;
text-transform: uppercase;
}
.reviews-page-hero__title {
margin: 0 0 14px;
color: #2f3338;
font-size: clamp(30px, 4.2vw, 48px);
line-height: 1.06;
font-weight: 800;
text-transform: uppercase;
}
.reviews-page-hero__desc {
margin: 0 0 24px;
max-width: 700px;
color: #50555f;
font-size: 16px;
line-height: 1.65;
}
.reviews-page-hero__call {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 198px;
min-height: 54px;
padding: 14px 30px;
border-radius: 999px;
background: #4ea853;
color: #fff;
text-decoration: none;
font-size: 16px;
font-weight: 700;
font-style: italic;
letter-spacing: .04em;
box-shadow: 0 12px 26px rgba(78,168,83,.14);
transition: transform .2s ease, box-shadow .2s ease;
}
.reviews-page-hero__call:hover {
transform: translateY(-2px);
box-shadow: 0 16px 30px rgba(78,168,83,.18);
}
/* REVIEWS PAGE */
.reviews-page-main{background:#f5f5f5;}
.reviews-hero{padding:34px 0 46px;background:#f5f5f5;}
.reviews-hero__shell{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1.15fr .95fr;align-items:stretch;overflow:hidden;border-radius:30px;background:#0d237f;}
.reviews-hero__content{padding:44px 42px;background:#0d237f;color:#fff;position:relative;}
.reviews-hero__content:after{content:'';position:absolute;top:0;right:-70px;width:140px;height:100%;background:#0d237f;transform:skewX(-8deg);transform-origin:top;}
.reviews-hero__eyebrow{margin:0 0 14px;font-size:14px;font-weight:800;letter-spacing:.02em;color:#2f68ff;position:relative;z-index:1;text-transform:none;}
.reviews-hero__title{margin:0 0 16px;font-size:clamp(32px,4.1vw,44px);line-height:1.08;font-weight:800;color:#fff;position:relative;z-index:1;max-width:520px;}
.reviews-hero__desc{max-width:560px;margin:0 0 22px;font-size:16px;line-height:1.6;color:#eef3ff;position:relative;z-index:1;}
.reviews-hero__ratings{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-bottom:22px;position:relative;z-index:1;}
.reviews-hero__rating{display:flex;align-items:center;gap:10px;min-width:180px;}
.reviews-hero__rating img{height:32px;width:auto;display:block;}
.reviews-hero__rating strong{display:block;font-size:16px;line-height:1.1;color:#fff;font-weight:800;}
.reviews-hero__rating span{display:block;font-size:15px;color:#d3dbff;line-height:1.3;}
.reviews-hero__actions{display:flex;gap:20px;flex-wrap:wrap;position:relative;z-index:1;}
.reviews-hero__call,.reviews-hero__book{display:inline-flex;align-items:center;justify-content:center;min-height:74px;padding:14px 30px;border-radius:20px;font-weight:800;text-decoration:none;transition:.25s ease;}
.reviews-hero__call{background:#f3b62b;color:#111832;box-shadow:none;text-align:center;line-height:1.15;}
.reviews-hero__call span{display:block;font-size:20px;color:#111832;}
.reviews-hero__book{border:2px solid rgba(255,255,255,.35);color:#fff;background:rgba(255,255,255,.08);min-width:290px;}
.reviews-hero__call:hover,.reviews-hero__book:hover{transform:translateY(-2px);}
.reviews-hero__media{min-height:100%;position:relative;background:#15308f;}
.reviews-hero__media img{width:100%;height:100%;object-fit:cover;display:block;}
.reviews-grid-section{padding:36px 0 90px;background:#f5f5f5;}
.reviews-grid-section__header{margin-bottom:28px;}
.reviews-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;}
.review-grid-card{background:#fff;border-radius:26px;padding:28px 28px 24px;box-shadow:0 8px 20px rgba(23,37,84,.04);min-height:320px;display:flex;flex-direction:column;}
.review-grid-card__top{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:22px;}
.review-grid-card__source{display:block;font-size:26px;line-height:1;font-weight:700;background:linear-gradient(90deg,#4285F4 0 25%,#DB4437 25% 50%,#F4B400 50% 75%,#0F9D58 75% 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.review-grid-card__source-sub{display:block;font-size:13px;color:#666;line-height:1.25;margin-top:4px;}
.review-grid-card__person h3{margin:0 0 8px;font-size:18px;line-height:1.2;font-weight:700;color:#3f3f3f;}
.review-grid-card__stars{font-size:20px;line-height:1;color:#f3b62b;letter-spacing:3px;}
.review-grid-card__body{flex:1;max-height:120px;overflow:auto;padding-right:10px;}
.review-grid-card__body p{margin:0;font-size:16px;line-height:1.7;color:#444;}
.review-grid-card__body::-webkit-scrollbar{width:6px;}
.review-grid-card__body::-webkit-scrollbar-thumb{background:#d6d6d6;border-radius:999px;}
.review-grid-card__date{margin:22px 0 0;font-size:14px;line-height:1.2;font-weight:600;color:#8a8a8a;letter-spacing:.03em;}
@media (max-width: 1100px){
.reviews-hero__shell{grid-template-columns:1fr;}
.reviews-hero__content:after{display:none;}
.reviews-hero__media{min-height:420px;}
.reviews-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width: 767px){
.reviews-hero{padding:24px 0 48px;}
.reviews-hero__content{padding:42px 24px;}
.reviews-hero__eyebrow{font-size:16px;}
.reviews-hero__desc{font-size:17px;}
.reviews-hero__actions{flex-direction:column;}
.reviews-hero__book,.reviews-hero__call{width:100%;min-width:0;}
.reviews-hero__media{min-height:300px;}
.reviews-grid{grid-template-columns:1fr;gap:20px;}
.review-grid-card{min-height:0;}
}
/* Reviews hero downsized */
.reviews-hero__eyebrow{margin:0 0 14px !important;font-size:14px !important;text-transform:none !important;}
.reviews-hero__title{font-size:clamp(32px,4.1vw,44px) !important;line-height:1.08 !important;max-width:520px !important;margin-bottom:16px !important;}
.reviews-hero__desc{font-size:16px !important;line-height:1.6 !important;max-width:560px !important;margin-bottom:22px !important;}
.reviews-hero{padding:34px 0 46px !important;}
.reviews-hero__content{padding:44px 42px !important;}
.reviews-hero__ratings{gap:18px !important;margin-bottom:22px !important;}
.reviews-hero__rating{min-width:180px !important;gap:10px !important;}
.reviews-hero__rating img{height:32px !important;}
.reviews-hero__rating strong{font-size:16px !important;}
.reviews-hero__actions{gap:14px !important;}
.reviews-hero__call{min-width:240px !important;min-height:68px !important;padding:12px 22px !important;font-size:15px !important;border-radius:16px !important;}
.reviews-hero__call span{font-size:13px !important;margin-top:4px !important;}
.reviews-hero__book{min-width:210px !important;min-height:68px !important;padding:12px 22px !important;font-size:15px !important;border-radius:16px !important;}
@media (max-width: 900px){.reviews-hero__content{padding:34px 24px !important;}.reviews-hero__title{font-size:34px !important;}}
/* Reviews hero subtitle + call button refinement */
.reviews-hero__eyebrow{color:#fff !important;}
.reviews-hero__call{background:#28a745 !important;color:#fff !important;border:0 !important;
font-size:20px !important;font-style:italic !important;font-weight:800 !important;
letter-spacing:.02em !important;padding:0 40px !important;min-width:220px !important;}
.reviews-hero__call:hover{box-shadow:0 10px 22px rgba(40,167,69,.24) !important;}
.reviews-hero__call-icon{display:inline-flex;align-items:center;justify-content:center;font-size:18px;line-height:1;color:#fff;}
.reviews-hero__call-label{display:inline-block !important;color:#fff !important;font-size:20px !important;
line-height:1 !important;font-style:italic !important;font-weight:800 !important;letter-spacing:.02em !important;margin:0 !important;}
.reviews-hero__call span{margin:0 !important;}
@media (max-width: 900px){.reviews-hero__call{padding:14px 28px !important;font-size:16px !important;}.reviews-hero__call-label,.reviews-hero__call-icon{font-size:16px;}}
/* Reviews hero buttons refined */
.reviews-hero__actions{gap:18px !important;align-items:center !important;}
.reviews-hero__call,.reviews-hero__book{display:inline-flex !important;align-items:center !important;justify-content:center !important;min-width:0 !important;min-height:0 !important;height:88px !important;padding:0 34px !important;border-radius:999px !important;line-height:1 !important;text-decoration:none !important;box-shadow:none !important;}
.reviews-hero__call{background:#28a745 !important;color:#fff !important;gap:12px !important;font-size:18px !important;font-style:italic !important;font-weight:800 !important;letter-spacing:.02em !important;border:0 !important;}
.reviews-hero__call:hover,.reviews-hero__book:hover{transform:translateY(-2px) !important;}
.reviews-hero__call-icon{display:inline-flex !important;align-items:center !important;justify-content:center !important;width:22px !important;height:22px !important;color:#fff !important;flex:0 0 auto !important;}
.reviews-hero__call-icon svg{display:block;width:22px;height:22px;}
.reviews-hero__call-label{display:inline-block !important;color:#fff !important;font-size:18px !important;line-height:1 !important;font-style:italic !important;font-weight:800 !important;letter-spacing:.02em !important;}
.reviews-hero__book{background:rgba(255,255,255,.08) !important;border:2px solid rgba(255,255,255,.45) !important;color:#fff !important;font-size:18px !important;font-style:italic !important;font-weight:800 !important;padding:0 40px !important;}
@media (max-width:900px){.reviews-hero__call,.reviews-hero__book{height:72px !important;padding:0 28px !important;width:100% !important;}.reviews-hero__call-label,.reviews-hero__book{font-size:16px !important;}.reviews-hero__call-icon,.reviews-hero__call-icon svg{width:20px !important;height:20px !important;}}
.hero-btn-call{font-size:18px!important;}
/* Reviews hero button final correction */
.reviews-hero__actions{gap:14px !important;align-items:center !important;}
.reviews-hero__call,.reviews-hero__book{display:inline-flex !important;align-items:center !important;justify-content:center !important;height:56px !important;min-height:56px !important;min-width:0 !important;border-radius:999px !important;line-height:1 !important;text-decoration:none !important;box-shadow:none !important;padding:0 28px !important;}
.reviews-hero__call{background:#28a745 !important;color:#fff !important;border:0 !important;font-size:18px !important;font-style:italic !important;font-weight:800 !important;letter-spacing:.02em !important;}
.reviews-hero__call-label{display:inline-block !important;color:#fff !important;font-size:18px !important;line-height:1 !important;font-style:italic !important;font-weight:800 !important;letter-spacing:.02em !important;margin:0 !important;}
.reviews-hero__call-icon{display:none !important;}
.reviews-hero__book{background:rgba(255,255,255,.08) !important;border:2px solid rgba(255,255,255,.45) !important;color:#fff !important;font-size:18px !important;font-style:italic !important;font-weight:800 !important;padding:0 30px !important;}
@media (max-width:900px){.reviews-hero__call,.reviews-hero__book{height:50px !important;min-height:50px !important;padding:0 22px !important;width:auto !important;}.reviews-hero__call-label,.reviews-hero__book{font-size:16px !important;}}
/* Fix CALL NOW button size */
.reviews-hero__call{
padding:14px 42px !important;
min-width:220px !important;
}
.reviews-hero__call-label{
font-size:18px !important;
}
.reviews-hero .call-now-btn{
padding:14px 42px !important;
font-size:20px !important;
font-weight:700 !important;
min-width:200px !important;
border-radius:999px !important;
}
.hero-btn,
.hero-btn-call,
.hero-btn-book,
.call-now-btn{
font-size:20px !important;
}
/* FORCE larger CALL NOW button text */
.reviews-hero .hero-btn-call,
.reviews-hero .call-now-btn{
font-size:26px !important;
font-weight:700 !important;
}
/* Strong final override for reviews page CALL NOW text */
.reviews-hero__call > .reviews-hero__call-label{
font-size: 22px !important;
font-weight: 800 !important;
line-height: 1 !important;
}
/* Gallery + Blog pages */
.gallery-grid,
.blog-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:28px;
}
.gallery-card,
.blog-card{
background:#ffffff;
border-radius:28px;
overflow:hidden;
box-shadow:0 10px 30px rgba(15,23,42,0.08);
}
.gallery-card img,
.blog-card img{
display:block;
width:100%;
aspect-ratio: 1.15 / 1;
object-fit:cover;
}
.gallery-card__body,
.blog-card__body{
padding:22px 22px 24px;
}
.gallery-card__body h3,
.blog-card__body h3{
margin:0 0 10px;
font-size:24px;
line-height:1.2;
color:#242424;
font-weight:700;
}
.gallery-card__body p,
.blog-card__body p{
margin:0;
font-size:16px;
line-height:1.6;
color:#5b5b5b;
}
.blog-card__meta{
margin:0 0 12px !important;
font-size:13px !important;
line-height:1.4 !important;
text-transform:uppercase;
letter-spacing:.08em;
color:#1f3f95 !important;
font-weight:700;
}
.blog-card__link{
display:inline-block;
margin-top:18px;
color:#1f3f95;
font-weight:700;
text-decoration:none;
}
.gallery-grid-section .section__sub,
.blog-grid-section .section__sub{
margin-top:8px;
}
@media (max-width: 991px){
.gallery-grid,
.blog-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
}
}
@media (max-width: 767px){
.gallery-grid,
.blog-grid{
grid-template-columns:1fr;
}
}
/* Gallery page before/after grid */
.gallery-grid--sliders{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:28px;
}
.gallery-slider-card{
background:#ffffff;
border-radius:28px;
overflow:hidden;
box-shadow:0 10px 30px rgba(15,23,42,0.08);
}
.gallery-slider-card .ba{
min-height:420px;
border-radius:28px;
overflow:hidden;
}
.gallery-slider-card .ba__img img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}
.gallery-grid-section .section__header{
margin-bottom:28px;
}
.gallery-grid-section .section__sub{
display:none;
}
.gallery-hero .reviews-hero__eyebrow{
color:#fff;
}
.gallery-hero .reviews-hero__ratings{
display:none !important;
}
/* Blog page hero + cards */
.blog-hero .reviews-hero__ratings{
display:none !important;
}
.blog-hero__placeholder{
width:100%;
height:100%;
min-height:420px;
background:linear-gradient(135deg,#dbe6ff 0%,#f1f5ff 50%,#c8d7ff 100%);
border:none !important;
position:relative;
}
.blog-hero__placeholder::before{
content:"";
position:absolute;
inset:38px;
border:2px dashed rgba(31,63,149,0.28);
border-radius:24px;
}
.blog-grid--large{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:30px;
}
.post-card--large{
border-radius:28px;
box-shadow:0 10px 30px rgba(15,23,42,0.08);
}
.post-card--large .post-card__img.media-placeholder{
height:290px;
background:linear-gradient(180deg,#d7e4ff 0%,#b5cbff 100%);
}
.post-card--large .post-card__body{
padding:22px 22px 24px;
}
.post-card--large .post-card__title{
font-size:26px;
line-height:1.2;
margin:0 0 12px;
color:#242424;
}
.post-card--large .post-card__meta{
margin:0 0 14px !important;
font-size:13px !important;
line-height:1.4 !important;
text-transform:uppercase;
letter-spacing:.08em;
color:#1f3f95 !important;
font-weight:700;
}
.post-card__excerpt{
margin:0 0 18px;
font-size:16px;
line-height:1.6;
color:#5b5b5b;
}
.post-card--large .blog-card__link{
display:inline-block;
margin-top:auto;
color:#1f3f95;
font-weight:700;
text-decoration:none;
}
@media (max-width: 991px){
.gallery-grid--sliders,
.blog-grid--large{
grid-template-columns:repeat(2,minmax(0,1fr));
}
}
@media (max-width: 767px){
.gallery-grid--sliders,
.blog-grid--large{
grid-template-columns:1fr;
}
.gallery-slider-card .ba,
.blog-hero__placeholder{
min-height:320px;
}
}
/* BLOG HERO COPY UPDATE */
.blog-hero__desc{
max-width: 620px;
}
/* GET A QUOTE PAGE */
.quote-page-main{
background:#f5f5f5;
}
.quote-hero{
padding: 58px 0 76px;
}
.quote-hero__container{
display:grid;
grid-template-columns:minmax(0, 0.92fr) minmax(420px, 0.88fr);
gap:48px;
align-items:stretch;
}
.quote-hero__form-panel{
background:#f5f5f5;
padding:18px 0;
}
.quote-request-form{
max-width:430px;
}
.quote-request-form__title{
margin:0 0 12px;
color:#3a3a3a;
font-size:clamp(28px, 2.8vw, 38px);
line-height:1.08;
font-weight:800;
text-transform:uppercase;
}
.quote-request-form__desc{
margin:0 0 22px;
color:#616775;
font-size:15px;
line-height:1.65;
}
.quote-request-form__field{
display:block;
margin:0 0 16px;
}
.quote-request-form__label{
display:block;
margin:0 0 8px;
color:#727884;
font-size:13px;
font-weight:700;
letter-spacing:.01em;
}
.quote-request-form__input,
.quote-request-form__select,
.quote-request-form__textarea{
width:100%;
border:1px solid rgba(27,34,54,.14);
border-radius:14px;
background:#fff;
color:#141b2d;
font-size:15px;
outline:none;
box-shadow:none;
}
.quote-request-form__input,
.quote-request-form__select{
height:50px;
padding:0 16px;
}
.quote-request-form__textarea{
min-height:110px;
padding:14px 16px;
resize:vertical;
}
.quote-request-form__input:focus,
.quote-request-form__select:focus,
.quote-request-form__textarea:focus{
border-color:rgba(34,67,165,.45);
box-shadow:0 0 0 4px rgba(34,67,165,.08);
}
.quote-request-form__check{
display:flex;
align-items:flex-start;
gap:10px;
margin:8px 0 18px;
color:#6a707b;
font-size:14px;
line-height:1.45;
}
.quote-request-form__check input{
width:18px;
height:18px;
margin-top:2px;
accent-color:#2446a5;
}
.quote-request-form__submit{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:210px;
height:52px;
padding:0 30px;
border:none;
border-radius:999px;
background:#18a34a;
color:#fff;
font-size:18px;
font-weight:800;
letter-spacing:.01em;
text-decoration:none;
box-shadow:0 12px 28px rgba(24,163,74,.18);
}
.quote-request-form__submit:hover{
transform:translateY(-1px);
}
.quote-hero__media{
position:relative;
min-height:640px;
border-radius:28px;
overflow:hidden;
clip-path:polygon(9% 0,100% 0,100% 100%,0 100%);
background:#dde4f9;
}
.quote-hero__media-shape{
position:absolute;
inset:0;
background:linear-gradient(180deg, rgba(255,255,255,.25), rgba(255,255,255,.05));
z-index:1;
}
.quote-hero__media img{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
}
@media (max-width: 1024px){
.quote-hero__container{
grid-template-columns:1fr;
}
.quote-request-form{
max-width:none;
}
.quote-hero__media{
min-height:420px;
clip-path:none;
}
}
/* FIX quote page full width layout */
.quote-page-main{
width:100%;
}
.quote-page-main .quote-hero__container{
max-width:1400px;
margin:0 auto;
display:grid;
grid-template-columns:1fr 1fr;
gap:50px;
}
.quote-page-main .quote-hero__form-panel{
width:100%;
}
.quote-page-main .quote-request-form{
max-width:520px;
}
.quote-page-main .quote-hero__media{
width:100%;
min-height:650px;
}
/* FINAL QUOTE PAGE WIDTH FIX */
body .quote-page-main{
width:100% !important;
max-width:none !important;
}
body .quote-page-main .quote-hero.section{
width:100% !important;
max-width:none !important;
padding:36px 0 72px !important;
}
body .quote-page-main .quote-hero__container.container,
body .quote-page-main .quote-hero__container{
width:min(100vw - 48px, 1820px) !important;
max-width:1820px !important;
margin:0 auto !important;
padding-left:0 !important;
padding-right:0 !important;
display:grid !important;
grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
align-items:stretch !important;
gap:64px !important;
box-sizing:border-box !important;
}
body .quote-page-main .quote-hero__form-panel{
width:100% !important;
max-width:none !important;
padding:18px 12px 18px 0 !important;
background:transparent !important;
}
body .quote-page-main .quote-request-form{
width:100% !important;
max-width:none !important;
margin:0 !important;
}
body .quote-page-main .quote-request-form__field,
body .quote-page-main .quote-request-form__check,
body .quote-page-main .quote-request-form__submit{
max-width:760px !important;
}
body .quote-page-main .quote-request-form__input,
body .quote-page-main .quote-request-form__select,
body .quote-page-main .quote-request-form__textarea{
width:100% !important;
}
body .quote-page-main .quote-hero__media{
width:100% !important;
max-width:none !important;
min-height:820px !important;
display:block !important;
border-radius:32px !important;
overflow:hidden !important;
position:relative !important;
clip-path:polygon(8% 0,100% 0,100% 100%,0 100%) !important;
}
body .quote-page-main .quote-hero__media img{
width:100% !important;
height:100% !important;
object-fit:cover !important;
object-position:center center !important;
}
@media (max-width: 1200px){
body .quote-page-main .quote-hero__container.container,
body .quote-page-main .quote-hero__container{
width:min(100vw - 32px, 1180px) !important;
gap:36px !important;
}
body .quote-page-main .quote-hero__media{
min-height:620px !important;
}
}
@media (max-width: 980px){
body .quote-page-main .quote-hero__container.container,
body .quote-page-main .quote-hero__container{
grid-template-columns:1fr !important;
width:min(100vw - 24px, 860px) !important;
gap:24px !important;
}
body .quote-page-main .quote-hero__form-panel{
padding-right:0 !important;
}
body .quote-page-main .quote-page-main .quote-request-form__field,
body .quote-page-main .quote-request-form__check,
body .quote-page-main .quote-request-form__submit{
max-width:none !important;
}
body .quote-page-main .quote-hero__media{
min-height:420px !important;
clip-path:none !important;
}
}
/* Center quote form within left half */
.quote-page-main .quote-hero__form-panel{
display:flex !important;
justify-content:center !important;
}
.quote-page-main .quote-request-form{
max-width:720px !important;
width:100% !important;
margin:0 auto !important;
}
/* Stronger centering fix for quote form */
body .quote-page-main .quote-hero__form-panel{
display:block !important;
padding-left:0 !important;
padding-right:0 !important;
}
body .quote-page-main .quote-request-form{
width:78% !important;
max-width:760px !important;
margin:0 auto !important;
}
body .quote-page-main .quote-request-form__title,
body .quote-page-main .quote-request-form__desc,
body .quote-page-main .quote-request-form__field,
body .quote-page-main .quote-request-form__check,
body .quote-page-main .quote-request-form__submit{
max-width:none !important;
width:100% !important;
margin-left:0 !important;
margin-right:0 !important;
}
@media (max-width: 980px){
body .quote-page-main .quote-request-form{
width:100% !important;
max-width:none !important;
}
}
/* Restore right-column text positioning for quality sections */
.quality-section .container,
.reliable-quality-section .container,
.section-quality .container,
.section-reliable-quality .container{
align-items: center !important;
}
.quality-section__content,
.reliable-quality-section__content,
.quality-content,
.reliable-quality-content,
.section-quality .content,
.section-reliable-quality .content{
max-width: 620px !important;
margin-left: auto !important;
padding-left: 24px !important;
}
@media (max-width: 1024px){
.quality-section__content,
.reliable-quality-section__content,
.quality-content,
.reliable-quality-content,
.section-quality .content,
.section-reliable-quality .content{
margin-left: 0 !important;
padding-left: 0 !important;
max-width: none !important;
}
}
/* Fix section quote text positioning and CTA links */
.section-quote .quote-hero{
grid-template-columns:minmax(0,1.12fr) minmax(340px,.88fr) !important;
gap:40px !important;
padding:34px 40px 34px 56px !important;
align-items:center !important;
}
.section-quote .quote-hero__text{
max-width:860px !important;
padding-left:18px !important;
margin-left:0 !important;
}
.section-quote .quote-hero__text .h2-t,
.section-quote .quote-hero__text p,
.section-quote .quote-hero__actions{
max-width:760px !important;
}
.section-quote .quote-hero__visual{
justify-self:end !important;
}
@media (max-width: 1024px){
.section-quote .quote-hero{
grid-template-columns:1fr !important;
padding:26px 22px !important;
}
.section-quote .quote-hero__text{
padding-left:0 !important;
max-width:none !important;
}
}
/* Restore QUALITY / RELIABLE quote sections */
.section-quote .quote-hero{
display:grid !important;
grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr) !important;
gap:34px !important;
align-items:center !important;
padding:22px 18px 22px 18px !important;
}
.section-quote .quote-hero__text{
display:block !important;
max-width:720px !important;
width:100% !important;
padding-left:26px !important;
margin:0 !important;
justify-self:start !important;
}
.section-quote .quote-hero__text .h2-t{
max-width:700px !important;
margin:0 0 18px 0 !important;
}
.section-quote .quote-hero__text p{
max-width:700px !important;
margin:0 0 26px 0 !important;
}
.section-quote .quote-hero__actions{
margin-top:0 !important;
}
.section-quote .quote-hero__visual{
display:block !important;
position:relative !important;
justify-self:end !important;
width:100% !important;
min-height:420px !important;
height:420px !important;
border-radius:22px !important;
overflow:hidden !important;
background:transparent !important;
}
.section-quote .quote-hero__rings{
position:absolute !important;
inset:-40px !important;
display:block !important;
}
.section-quote .quote-hero__worker{
display:block !important;
position:absolute !important;
right:70px !important;
bottom:0 !important;
width:260px !important;
height:380px !important;
background:#000 !important;
border-radius:14px !important;
}
@media (max-width: 1024px){
.section-quote .quote-hero{
grid-template-columns:1fr !important;
padding:26px 22px !important;
}
.section-quote .quote-hero__text{
padding-left:0 !important;
max-width:none !important;
}
.section-quote .quote-hero__visual{
min-height:360px !important;
height:360px !important;
}
.section-quote .quote-hero__worker{
right:22px !important;
width:220px !important;
height:320px !important;
}
}
/* Final override: tighten QUALITY YOU CAN COUNT ON / RELIABLE SERVICE EVERY TIME panels */
.section.section-quote .quote-hero{
padding-top: 0 !important;
padding-bottom: 0 !important;
padding-left: 34px !important;
padding-right: 34px !important;
}
/* FINAL OVERRIDE — align quote card with grey circle edge */
.section.section-quote .quote-hero{
padding-top: 0 !important;
padding-bottom: 0 !important;
padding-left: 24px !important;
padding-right: 0 !important;
}
/* Restaurants page hero: full-height image on right with soft blend into left white panel */
.restaurants-page .restaurants-hero{
background:#fff;
padding:0 !important;
overflow:hidden;
}
.restaurants-page .restaurants-hero .service-intro__wrap{
max-width:none !important;
width:100% !important;
padding-top:0 !important;
padding-right:0 !important;
padding-bottom:0 !important;
padding-left:max(24px, calc((100vw - 1200px) / 2 + 24px)) !important;
display:grid !important;
grid-template-columns:minmax(0, 560px) minmax(0, 1fr) !important;
gap:0 !important;
align-items:stretch !important;
min-height:620px;
}
.restaurants-page .restaurants-hero .service-intro__text{
max-width:640px !important;
display:flex;
flex-direction:column;
justify-content:center;
padding:72px 56px 72px 0;
position:relative;
z-index:2;
}
.restaurants-page .restaurants-hero .service-intro__media,
.restaurants-page .restaurants-hero .restaurants-hero__media{
position:relative;
min-height:620px;
height:100%;
overflow:hidden;
}
.restaurants-page .restaurants-hero .service-intro__media::before,
.restaurants-page .restaurants-hero .restaurants-hero__media::before{
content:"";
position:absolute;
inset:0 auto 0 0;
width:32%;
min-width:180px;
background:linear-gradient(90deg, #ffffff 0%, rgba(255,255,255,.95) 18%, rgba(255,255,255,.72) 40%, rgba(255,255,255,.25) 68%, rgba(255,255,255,0) 100%);
z-index:2;
pointer-events:none;
}
.restaurants-page .restaurants-hero .service-intro__media img,
.restaurants-page .restaurants-hero .restaurants-hero__media img{
display:block;
width:100%;
height:100%;
min-height:620px;
object-fit:cover;
object-position:center;
border-radius:0 !important;
box-shadow:none !important;
aspect-ratio:auto !important;
}
@media (max-width: 1199px){
.restaurants-page .restaurants-hero{
padding:48px 0 0 !important;
}
.restaurants-page .restaurants-hero .service-intro__wrap{
grid-template-columns:minmax(0,1fr) !important;
min-height:auto;
padding-left:24px !important;
padding-right:24px !important;
gap:28px !important;
}
.restaurants-page .restaurants-hero .service-intro__text{
padding:0 !important;
max-width:none !important;
}
.restaurants-page .restaurants-hero .service-intro__media,
.restaurants-page .restaurants-hero .restaurants-hero__media,
.restaurants-page .restaurants-hero .service-intro__media img,
.restaurants-page .restaurants-hero .restaurants-hero__media img{
min-height:420px;
}
.restaurants-page .restaurants-hero .service-intro__media img,
.restaurants-page .restaurants-hero .restaurants-hero__media img{
border-radius:28px !important;
}
.restaurants-page .restaurants-hero .service-intro__media::before,
.restaurants-page .restaurants-hero .restaurants-hero__media::before{
width:100%;
height:120px;
inset:auto 0 0 0;
background:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.15) 35%, rgba(255,255,255,.65) 72%, #ffffff 100%);
}
}
@media (max-width: 767px){
.restaurants-page .restaurants-hero .service-intro__wrap{
padding-left:18px !important;
padding-right:18px !important;
}
.restaurants-page .restaurants-hero .service-intro__media,
.restaurants-page .restaurants-hero .restaurants-hero__media,
.restaurants-page .restaurants-hero .service-intro__media img,
.restaurants-page .restaurants-hero .restaurants-hero__media img{
min-height:320px;
}
}
/* Restaurants page: full-width estimate band connected to hero */
.restaurants-page .service-estimate{
margin-top: 0 !important;
padding-top: 0 !important;
}
.restaurants-page .service-estimate .container{
max-width: none !important;
width: 100% !important;
padding-left: 0 !important;
padding-right: 0 !important;
}
.restaurants-page .service-estimate__card{
width: 100% !important;
border-radius: 0 !important;
margin-top: 0 !important;
}
@media (min-width: 1200px){
.restaurants-page .service-estimate{
}
}
@media (max-width: 1199px){
.restaurants-page .service-estimate{
padding-top: 12px !important;
}
.restaurants-page .service-estimate .container{
padding-left: 24px !important;
padding-right: 24px !important;
}
.restaurants-page .service-estimate__card{
border-radius: 24px !important;
}
}
/* Restaurants page: center estimate heading */
.restaurants-page .service-estimate__title{
text-align:center !important;
width:100% !important;
display:block !important;
}
/* Restaurants page: image-left/text-right content section */
.restaurants-info-split{
padding:72px 0;
background:#fff;
}
.restaurants-info-split__wrap{
display:grid;
grid-template-columns:minmax(360px, .98fr) minmax(0, 1.02fr);
gap:56px;
align-items:center;
}
.restaurants-info-split__media img{
display:block;
width:100%;
aspect-ratio:1 / 1;
object-fit:cover;
border-radius:28px;
box-shadow:0 24px 70px rgba(25,49,105,.14);
}
.restaurants-info-split__content{
max-width:640px;
}
.restaurants-info-split__eyebrow{
margin:0 0 14px;
color:#4a4a4a;
font-size:14px;
font-weight:700;
line-height:1.4;
letter-spacing:.08em;
text-transform:uppercase;
}
.restaurants-info-split__title{
margin:0 0 24px;
color:#193169;
font-size:42px;
font-weight:700;
line-height:1.12;
}
.restaurants-info-split__lead,
.restaurants-info-split__content p{
color:#000;
font-size:16px;
font-weight:400;
line-height:1.7;
}
.restaurants-info-split__lead{
margin:0 0 18px;
}
.restaurants-info-split__content p{
margin:0 0 22px;
}
.restaurants-info-split__content p:last-child{
margin-bottom:0;
}
@media (max-width: 1199px){
.restaurants-info-split__wrap{
grid-template-columns:1fr;
gap:30px;
}
.restaurants-info-split__content{
max-width:none;
}
}
@media (max-width: 767px){
.restaurants-info-split{
padding:48px 0;
}
.restaurants-info-split__title{
font-size:32px;
}
}
/* Restaurants page title sizing fix */
.restaurants-page .restaurants-info-split__title{
color:#000 !important;
font-family:"Montserrat", sans-serif !important;
font-weight:800 !important;
text-transform:uppercase !important;
font-size:36px !important;
line-height:1.1 !important;
}
@media (max-width: 767px){
.restaurants-page .restaurants-info-split__title{
font-size:28px !important;
}
}
/* Restaurants page: standalone WHY CHOOSE section */
.restaurants-why-choose{
padding:72px 0 64px;
background:#fff;
}
.restaurants-why-choose .container{
max-width:1280px;
}
.restaurants-why-choose__intro{
max-width:1500px;
margin-bottom:28px;
}
.restaurants-why-choose__title{
margin:0 0 18px;
color:#333333;
font-family:"Montserrat", sans-serif;
font-size:40px;
font-weight:800;
line-height:1.1;
text-transform:uppercase;
}
.restaurants-why-choose__intro p{
margin:0 0 16px;
color:#444444;
font-size:17px;
line-height:1.7;
}
.restaurants-why-choose__grid{
display:grid;
grid-template-columns:repeat(4, minmax(0, 1fr));
gap:22px;
margin:24px 0 20px;
}
.restaurants-why-choose__card{
appearance:none;
width:100%;
min-height:130px;
text-align:center;
cursor:pointer;
background:#ffffff;
border:1px solid #e3e3e3;
border-radius:20px;
padding:16px 14px;
box-shadow:0 2px 8px rgba(0,0,0,.03);
transition:border-color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s ease;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
}
.restaurants-why-choose__card:hover{
transform:translateY(-1px);
border-color:#8fd39a;
box-shadow:0 8px 18px rgba(0,0,0,.05);
}
.restaurants-why-choose__card--active{
background:#eef4ef;
border-color:#9fd3a5;
box-shadow:none;
}
.restaurants-why-choose__icon{
width:42px;
height:42px;
display:flex;
align-items:center;
justify-content:center;
border-radius:14px;
background:#eef0fb;
color:#2c56d3;
margin:0 auto 12px;
position:relative;
}
.restaurants-why-choose__card--active
.restaurants-why-choose__icon{
width:42px;
height:42px;
display:flex;
align-items:center;
justify-content:center;
border-radius:14px;
background:#eef0fb;
color:#2c56d3;
margin:0 auto 12px;
position:relative;
}
.restaurants-why-choose__icon::before{
content:"";
width:24px;
height:24px;
display:block;
background:currentColor;
-webkit-mask-repeat:no-repeat;
mask-repeat:no-repeat;
-webkit-mask-position:center;
mask-position:center;
-webkit-mask-size:contain;
mask-size:contain;
}
.restaurants-why-choose__icon[data-icon="shield"]::before{
-webkit-mask-image:url('data:image/svg+xml;utf8,');
mask-image:url('data:image/svg+xml;utf8,');
}
.restaurants-why-choose__icon[data-icon="tag"]::before{
-webkit-mask-image:url('data:image/svg+xml;utf8,');
mask-image:url('data:image/svg+xml;utf8,');
}
.restaurants-why-choose__icon[data-icon="file"]::before{
-webkit-mask-image:url('data:image/svg+xml;utf8,');
mask-image:url('data:image/svg+xml;utf8,');
}
.restaurants-why-choose__icon[data-icon="map"]::before{
-webkit-mask-image:url('data:image/svg+xml;utf8,');
mask-image:url('data:image/svg+xml;utf8,');
}
.restaurants-why-choose__card h3{
margin:0;
color:#252525;
font-family:"Montserrat", sans-serif;
font-size:14px;
font-weight:800;
line-height:1.25;
}
.restaurants-why-choose__detail-panels{
border-top:1px solid #d5d5d5;
margin-top:8px;
padding-top:20px;
}
.restaurants-why-choose__detail{
background:transparent;
border:none;
border-radius:0;
padding:0;
box-shadow:none;
max-width:none;
}
.restaurants-why-choose__detail h3{
margin:0 0 14px;
color:#202020;
font-family:"Montserrat", sans-serif;
font-size:21px;
font-weight:800;
line-height:1.25;
}
.restaurants-why-choose__detail p{
margin:0 0 18px;
color:#444444;
font-size:15px;
line-height:1.65;
}
.restaurants-why-choose__cta{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:170px;
padding:12px 22px;
border-radius:999px;
background:#27ab46;
color:#fff;
text-decoration:none;
font-family:"Montserrat", sans-serif;
font-size:15px;
font-weight:800;
line-height:1;
}
.restaurants-why-choose__cta:hover{
color:#fff;
background:#21943c;
opacity:1;
}
.restaurants-page .restaurants-info-split__title{
font-size:44px !important;
line-height:1.08 !important;
}
@media (max-width: 991px){
.restaurants-why-choose__grid{
grid-template-columns:repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 767px){
.restaurants-why-choose{
padding:48px 0;
}
.restaurants-why-choose__title{
margin:0 0 18px;
color:#333333;
font-family:"Montserrat", sans-serif;
font-size:40px;
font-weight:800;
line-height:1.1;
text-transform:uppercase;
}
.restaurants-why-choose__grid{
grid-template-columns:1fr;
}
.restaurants-why-choose__card{
appearance:none;
width:100%;
min-height:130px;
text-align:center;
cursor:pointer;
background:#ffffff;
border:1px solid #e3e3e3;
border-radius:20px;
padding:16px 14px;
box-shadow:0 2px 8px rgba(0,0,0,.03);
transition:border-color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s ease;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
}
.restaurants-why-choose__detail h3{
margin:0 0 14px;
color:#202020;
font-family:"Montserrat", sans-serif;
font-size:21px;
font-weight:800;
line-height:1.25;
}
.restaurants-page .restaurants-info-split__title{
font-size:32px !important;
}
}
/* Restaurants WHY CHOOSE: final visual match override */
.restaurants-why-choose{
padding:64px 0 56px !important;
background:#fff !important;
}
.restaurants-why-choose .container{
max-width:1280px !important;
}
.restaurants-why-choose__intro{
max-width:1280px !important;
margin-bottom:28px !important;
}
.restaurants-why-choose__title{
margin:0 0 18px !important;
color:#000000 !important;
font-family:"Montserrat", sans-serif !important;
font-size:44px !important;
font-weight:800 !important;
line-height:1.03 !important;
letter-spacing:0 !important;
text-transform:uppercase !important;
max-width:1120px !important;
}
.restaurants-why-choose__intro p{
margin:0 0 22px !important;
color:#1f1f1f !important;
font-family:"Montserrat", sans-serif !important;
font-size:17px !important;
font-weight:400 !important;
line-height:1.62 !important;
max-width:1250px !important;
}
.restaurants-why-choose__grid{
display:grid !important;
grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
gap:24px !important;
margin:18px 0 22px !important;
}
.restaurants-why-choose__card{
appearance:none !important;
width:100% !important;
min-height:164px !important;
padding:18px 18px !important;
border-radius:24px !important;
border:1px solid #d8dce1 !important;
background:#ffffff !important;
box-shadow:none !important;
text-align:left !important;
display:flex !important;
flex-direction:column !important;
align-items:flex-start !important;
justify-content:center !important;
cursor:pointer !important;
}
.restaurants-why-choose__card:hover{
transform:none !important;
border-color:#b9d9bf !important;
box-shadow:none !important;
}
.restaurants-why-choose__card--active{
background:#eef4ef !important;
border-color:#9fcfa7 !important;
box-shadow:none !important;
}
.restaurants-why-choose__icon{
width:56px !important;
height:56px !important;
margin:0 0 18px 6px !important;
border-radius:18px !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
position:relative !important;
background:#e8eee8 !important;
color:#4aa656 !important;
}
.restaurants-why-choose__card--active .restaurants-why-choose__icon{
background:#4aa656 !important;
color:#ffffff !important;
}
.restaurants-why-choose__icon::before{
width:24px !important;
height:24px !important;
}
.restaurants-why-choose__card h3{
margin:0 0 0 6px !important;
color:#111111 !important;
font-family:"Montserrat", sans-serif !important;
font-size:16px !important;
font-weight:800 !important;
line-height:1.24 !important;
text-align:left !important;
}
.restaurants-why-choose__detail-panels{
border-top:1px solid #d7d7d7 !important;
margin-top:18px !important;
padding-top:22px !important;
}
.restaurants-why-choose__detail{
background:transparent !important;
border:none !important;
border-radius:0 !important;
padding:0 !important;
box-shadow:none !important;
max-width:none !important;
}
.restaurants-why-choose__detail h3{
margin:0 0 16px !important;
color:#111111 !important;
font-family:"Montserrat", sans-serif !important;
font-size:22px !important;
font-weight:800 !important;
line-height:1.22 !important;
}
.restaurants-why-choose__detail p{
margin:0 0 22px !important;
color:#222222 !important;
font-family:"Montserrat", sans-serif !important;
font-size:17px !important;
font-weight:400 !important;
line-height:1.62 !important;
max-width:1250px !important;
}
.restaurants-why-choose__cta{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-width:210px !important;
padding:17px 30px !important;
border-radius:999px !important;
background:#4aa656 !important;
color:#ffffff !important;
text-decoration:none !important;
font-family:"Montserrat", sans-serif !important;
font-size:16px !important;
font-weight:800 !important;
line-height:1 !important;
box-shadow:none !important;
}
.restaurants-why-choose__cta:hover{
background:#41974d !important;
color:#ffffff !important;
opacity:1 !important;
}
@media (max-width: 991px){
.restaurants-why-choose__grid{
grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
}
}
@media (max-width: 767px){
.restaurants-why-choose{
padding:46px 0 42px !important;
}
.restaurants-why-choose__title{
font-size:34px !important;
line-height:1.06 !important;
}
.restaurants-why-choose__intro p,
.restaurants-why-choose__detail p{
font-size:16px !important;
}
.restaurants-why-choose__grid{
grid-template-columns:1fr !important;
gap:16px !important;
}
.restaurants-why-choose__card{
min-height:138px !important;
}
}
/* Restaurants page: frequency guide section */
.restaurants-frequency-guide{
padding:72px 0;
background:#fff;
}
.restaurants-frequency-guide__intro{
max-width:900px;
margin-bottom:24px;
}
.restaurants-frequency-guide__title{
margin:0 0 14px;
color:#000;
font-family:"Montserrat", sans-serif;
font-size:40px;
font-weight:800;
line-height:1.08;
text-transform:uppercase;
}
.restaurants-frequency-guide__sub{
margin:0;
color:#333;
font-size:17px;
line-height:1.65;
}
.restaurants-frequency-guide__table{
border:1px solid #d9dde3;
border-radius:28px;
overflow:hidden;
box-shadow:0 18px 48px rgba(0,0,0,.08);
background:#fff;
}
.restaurants-frequency-guide__row{
display:grid;
grid-template-columns: 1.05fr .8fr 1.7fr 1.45fr;
}
.restaurants-frequency-guide__row--head{
background:#19285d;
color:#fff;
}
.restaurants-frequency-guide__row:not(.restaurants-frequency-guide__row--head){
border-top:1px solid #d9dde3;
}
.restaurants-frequency-guide__cell{
padding:34px 26px;
font-size:16px;
line-height:1.55;
color:#2a2a2a;
}
.restaurants-frequency-guide__row--head .restaurants-frequency-guide__cell{
color:#fff;
font-family:"Montserrat", sans-serif;
font-size:18px;
font-weight:800;
line-height:1.2;
}
.restaurants-frequency-guide__cell--label{
color:#171c3d;
font-family:"Montserrat", sans-serif;
font-size:18px;
font-weight:800;
line-height:1.35;
}
.restaurants-frequency-guide__pill{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:54px;
padding:0 22px;
border-radius:999px;
background:#eef4ef;
border:1px solid #c8ddcb;
color:#2f9d44;
font-family:"Montserrat", sans-serif;
font-size:16px;
font-weight:800;
line-height:1;
white-space:nowrap;
}
@media (max-width: 991px){
.restaurants-frequency-guide__table{
border:none;
box-shadow:none;
background:transparent;
}
.restaurants-frequency-guide__head{
display:none;
}
.restaurants-frequency-guide__body{
display:grid;
gap:18px;
}
.restaurants-frequency-guide__row{
grid-template-columns:1fr;
border:1px solid #d9dde3 !important;
border-radius:24px;
overflow:hidden;
background:#fff;
box-shadow:0 12px 32px rgba(0,0,0,.06);
}
.restaurants-frequency-guide__cell{
padding:18px 18px;
}
.restaurants-frequency-guide__cell::before{
content:attr(data-label);
display:block;
margin-bottom:8px;
color:#19285d;
font-family:"Montserrat", sans-serif;
font-size:12px;
font-weight:800;
letter-spacing:.04em;
text-transform:uppercase;
}
}
@media (max-width: 767px){
.restaurants-frequency-guide{
padding:48px 0;
}
.restaurants-frequency-guide__title{
font-size:32px;
}
.restaurants-frequency-guide__sub{
font-size:16px;
}
}
/* reduce restaurants hero vertical spacing */
.restaurants-hero,
.hero-restaurants,
.hero--restaurants{
padding-top:60px !important;
padding-bottom:60px !important;
}
@media (max-width: 768px){
.restaurants-hero,
.hero-restaurants,
.hero--restaurants{
padding-top:40px !important;
padding-bottom:40px !important;
}
}
/* Condense hero height on industry pages */
.service-intro.restaurants-hero,
.restaurants-page .restaurants-hero{
padding-top: 34px !important;
padding-bottom: 34px !important;
}
.restaurants-page .restaurants-hero .service-intro__wrap{
min-height: 500px !important;
}
.restaurants-page .restaurants-hero .service-intro__text{
padding-top: 44px !important;
padding-bottom: 44px !important;
}
.restaurants-page .restaurants-hero .service-intro__media,
.restaurants-page .restaurants-hero .restaurants-hero__media,
.restaurants-page .restaurants-hero .service-intro__media img,
.restaurants-page .restaurants-hero .restaurants-hero__media img{
min-height: 500px !important;
}
@media (max-width: 1199px){
.service-intro.restaurants-hero,
.restaurants-page .restaurants-hero{
padding-top: 28px !important;
padding-bottom: 20px !important;
}
.restaurants-page .restaurants-hero .service-intro__wrap{
min-height: auto !important;
}
.restaurants-page .restaurants-hero .service-intro__text{
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.restaurants-page .restaurants-hero .service-intro__media,
.restaurants-page .restaurants-hero .restaurants-hero__media,
.restaurants-page .restaurants-hero .service-intro__media img,
.restaurants-page .restaurants-hero .restaurants-hero__media img{
min-height: 340px !important;
}
}
@media (max-width: 767px){
.service-intro.restaurants-hero,
.restaurants-page .restaurants-hero{
padding-top: 22px !important;
padding-bottom: 12px !important;
}
.restaurants-page .restaurants-hero .service-intro__media,
.restaurants-page .restaurants-hero .restaurants-hero__media,
.restaurants-page .restaurants-hero .service-intro__media img,
.restaurants-page .restaurants-hero .restaurants-hero__media img{
min-height: 280px !important;
}
}
/* Final industry-page hero height reduction */
body .service-intro.restaurants-hero{
padding-top: 18px !important;
padding-bottom: 8px !important;
}
body .restaurants-hero .service-intro__wrap{
min-height: 430px !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
body .restaurants-hero .service-intro__text{
padding-top: 28px !important;
padding-bottom: 28px !important;
}
body .restaurants-hero .service-intro__media,
body .restaurants-hero .restaurants-hero__media,
body .restaurants-hero .service-intro__media img,
body .restaurants-hero .restaurants-hero__media img{
min-height: 430px !important;
height: 430px !important;
}
@media (max-width: 1199px){
body .service-intro.restaurants-hero{
padding-top: 12px !important;
padding-bottom: 4px !important;
}
body .restaurants-hero .service-intro__wrap{
min-height: auto !important;
}
body .restaurants-hero .service-intro__text{
padding-top: 0 !important;
padding-bottom: 0 !important;
}
body .restaurants-hero .service-intro__media,
body .restaurants-hero .restaurants-hero__media,
body .restaurants-hero .service-intro__media img,
body .restaurants-hero .restaurants-hero__media img{
min-height: 300px !important;
height: 300px !important;
}
}
@media (max-width: 767px){
body .restaurants-hero .service-intro__media,
body .restaurants-hero .restaurants-hero__media,
body .restaurants-hero .service-intro__media img,
body .restaurants-hero .restaurants-hero__media img{
min-height: 240px !important;
height: 240px !important;
}
}
/* HERO ALIGNMENT FIX: make image taller and text shorter so both end evenly */
.service-intro.restaurants-hero{
padding-top:10px !important;
padding-bottom:6px !important;
}
.restaurants-hero .service-intro__wrap{
min-height:520px !important;
align-items:stretch !important;
}
.restaurants-hero .service-intro__media,
.restaurants-hero .restaurants-hero__media,
.restaurants-hero .service-intro__media img,
.restaurants-hero .restaurants-hero__media img{
min-height:520px !important;
height:520px !important;
object-fit:cover !important;
}
.restaurants-hero .service-intro__text{
padding-top:18px !important;
padding-bottom:18px !important;
max-width:620px;
}
@media (max-width:1199px){
.restaurants-hero .service-intro__media,
.restaurants-hero .restaurants-hero__media,
.restaurants-hero .service-intro__media img,
.restaurants-hero .restaurants-hero__media img{
min-height:360px !important;
height:360px !important;
}
.restaurants-hero .service-intro__text{
padding-top:10px !important;
padding-bottom:10px !important;
}
}
@media (max-width:767px){
.restaurants-hero .service-intro__media,
.restaurants-hero .restaurants-hero__media,
.restaurants-hero .service-intro__media img,
.restaurants-hero .restaurants-hero__media img{
min-height:260px !important;
height:260px !important;
}
}
/* Final industry hero alignment fix: shorten text stack, keep image slightly taller, align bottoms */
body .service-intro.restaurants-hero{
padding-top: 8px !important;
padding-bottom: 0 !important;
}
body .restaurants-hero .service-intro__wrap{
min-height: 500px !important;
grid-template-columns: minmax(0, 560px) minmax(0, 1fr) !important;
align-items: stretch !important;
}
body .restaurants-hero .service-intro__text{
min-height: 500px !important;
max-width: 620px !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
padding-top: 10px !important;
padding-bottom: 10px !important;
}
body .restaurants-hero .service-intro__eyebrow{
margin: 0 0 8px !important;
}
body .restaurants-hero h1,
body .restaurants-hero .service-intro__text h1{
margin: 0 0 14px !important;
line-height: 1.02 !important;
}
body .restaurants-hero .service-intro__copy{
margin-top: 0 !important;
}
body .restaurants-hero .service-intro__copy p{
margin: 0 0 12px !important;
line-height: 1.55 !important;
}
body .restaurants-hero .service-intro__copy p:last-child{
margin-bottom: 0 !important;
}
body .restaurants-hero .service-intro__actions{
margin-top: 18px !important;
}
body .restaurants-hero .service-intro__btn{
min-width: 170px !important;
padding-top: 12px !important;
padding-bottom: 12px !important;
}
body .restaurants-hero .service-intro__media,
body .restaurants-hero .restaurants-hero__media{
min-height: 500px !important;
height: 500px !important;
align-self: stretch !important;
}
body .restaurants-hero .service-intro__media img,
body .restaurants-hero .restaurants-hero__media img{
min-height: 500px !important;
height: 500px !important;
width: 100% !important;
object-fit: cover !important;
object-position: center !important;
}
@media (max-width: 1199px){
body .service-intro.restaurants-hero{
padding-top: 8px !important;
padding-bottom: 0 !important;
}
body .restaurants-hero .service-intro__wrap{
min-height: auto !important;
grid-template-columns: minmax(0, 1fr) !important;
gap: 20px !important;
}
body .restaurants-hero .service-intro__text{
min-height: auto !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
body .restaurants-hero .service-intro__media,
body .restaurants-hero .restaurants-hero__media,
body .restaurants-hero .service-intro__media img,
body .restaurants-hero .restaurants-hero__media img{
min-height: 340px !important;
height: 340px !important;
}
}
@media (max-width: 767px){
body .restaurants-hero .service-intro__copy p{
margin: 0 0 10px !important;
}
body .restaurants-hero .service-intro__actions{
margin-top: 14px !important;
}
body .restaurants-hero .service-intro__media,
body .restaurants-hero .restaurants-hero__media,
body .restaurants-hero .service-intro__media img,
body .restaurants-hero .restaurants-hero__media img{
min-height: 260px !important;
height: 260px !important;
}
}
/* Extend hero image vertically so it matches text height */
.restaurants-hero .service-intro__media,
.restaurants-hero .restaurants-hero__media{
min-height: 560px !important;
height: 560px !important;
align-self: stretch !important;
}
.restaurants-hero .service-intro__media img,
.restaurants-hero .restaurants-hero__media img{
min-height: 560px !important;
height: 560px !important;
width: 100% !important;
object-fit: cover !important;
}
@media (max-width:1199px){
.restaurants-hero .service-intro__media,
.restaurants-hero .restaurants-hero__media,
.restaurants-hero .service-intro__media img,
.restaurants-hero .restaurants-hero__media img{
min-height: 380px !important;
height: 380px !important;
}
}
/* INDUSTRY HERO FIX: force image column to match text column height */
.service-intro.restaurants-hero .service-intro__wrap{
display:grid !important;
grid-template-columns: minmax(0,560px) minmax(0,1fr) !important;
align-items:stretch !important;
}
.service-intro.restaurants-hero .service-intro__text{
align-self:stretch !important;
}
.service-intro.restaurants-hero .service-intro__media,
.service-intro.restaurants-hero .restaurants-hero__media{
height:100% !important;
align-self:stretch !important;
display:flex !important;
}
.service-intro.restaurants-hero .service-intro__media img,
.service-intro.restaurants-hero .restaurants-hero__media img{
height:100% !important;
width:100% !important;
object-fit:cover !important;
}
/* Contact page: business contact hero icons green */
body.contact-us .contact-hero [class*="icon"],
body.page-contact .contact-hero [class*="icon"],
body .contact-hero .contact-card__icon,
body .contact-hero .contact-info__icon,
body .contact-hero .hero-contact__icon,
body .contact-hero i,
body .contact-hero svg{
color:#16a34a !important;
fill:#16a34a !important;
stroke:#16a34a !important;
border-color:#16a34a !important;
}
/* Gallery page: reduce hero vertical padding */
body.gallery-page .service-intro,
body.page-gallery .service-intro,
body .gallery-hero,
body .gallery-page .gallery-hero{
padding-top:32px !important;
padding-bottom:24px !important;
}
/* Gallery page: 3 cards per row */
body.gallery-page .gallery-grid,
body.page-gallery .gallery-grid,
body .section-gallery-grid .gallery-grid,
body .gallery__grid{
grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
}
@media (max-width: 991px){
body.gallery-page .gallery-grid,
body.page-gallery .gallery-grid,
body .section-gallery-grid .gallery-grid,
body .gallery__grid{
grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
}
}
@media (max-width: 640px){
body.gallery-page .gallery-grid,
body.page-gallery .gallery-grid,
body .section-gallery-grid .gallery-grid,
body .gallery__grid{
grid-template-columns:1fr !important;
}
}
/* Contact page icon color fix */
body .contact-hero .contact-card__icon,
body .contact-hero .contact-info__icon,
body .contact-hero .hero-contact__icon,
body .contact-hero i,
body .contact-hero svg{
color:#16a34a !important;
fill:#16a34a !important;
stroke:#16a34a !important;
}
/* Gallery page hero spacing reduction */
body .gallery-hero,
body .gallery-page-hero,
body.page-gallery .service-intro,
body .section-gallery-hero{
padding-top:24px !important;
padding-bottom:16px !important;
}
/* Gallery page 3-up grid */
body .gallery-grid,
body .gallery__grid,
body .gallery-cards,
body .gallery-list,
body .section-gallery .container > .grid{
grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
}
@media (max-width: 991px){
body .gallery-grid,
body .gallery__grid,
body .gallery-cards,
body .gallery-list,
body .section-gallery .container > .grid{
grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
}
}
@media (max-width: 640px){
body .gallery-grid,
body .gallery__grid,
body .gallery-cards,
body .gallery-list,
body .section-gallery .container > .grid{
grid-template-columns:1fr !important;
}
}
/* Final gallery fixes */
body .gallery-hero,
body .gallery-page-hero,
body.page-gallery .service-intro,
body .section-gallery-hero,
body.page-gallery .page-title-wrap,
body.page-gallery .hero,
body.page-gallery .section.hero{
padding-top: 14px !important;
padding-bottom: 8px !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
body.page-gallery .gallery-grid img,
body.page-gallery .gallery__grid img,
body.page-gallery .gallery-cards img,
body.page-gallery .gallery-list img,
body .gallery-grid img,
body .gallery__grid img,
body .gallery-cards img,
body .gallery-list img{
aspect-ratio: 1 / 1 !important;
width: 100% !important;
height: auto !important;
object-fit: cover !important;
}
body.page-gallery .gallery-grid .card,
body.page-gallery .gallery__grid .card,
body.page-gallery .gallery-cards .card,
body.page-gallery .gallery-list .card,
body .gallery-grid .card,
body .gallery__grid .card,
body .gallery-cards .card,
body .gallery-list .card{
overflow: hidden !important;
}
body.page-gallery .gallery-grid .card img,
body.page-gallery .gallery__grid .card img,
body.page-gallery .gallery-cards .card img,
body.page-gallery .gallery-list .card img,
body .gallery-grid .card img,
body .gallery__grid .card img,
body .gallery-cards .card img,
body .gallery-list .card img{
display: block !important;
}
/* Precise gallery hero padding reduction */
.reviews-hero.gallery-hero.section{
padding-top:12px !important;
padding-bottom:12px !important;
}
.reviews-hero.gallery-hero .reviews-hero__shell{
min-height:auto !important;
padding-top:0 !important;
padding-bottom:0 !important;
}
.reviews-hero.gallery-hero .reviews-hero__content{
padding-top:20px !important;
padding-bottom:20px !important;
}
/* Make gallery cards square instead of tall rectangles */
.gallery-grid.gallery-grid--sliders{
grid-template-columns:repeat(3, minmax(0,1fr)) !important;
}
.gallery-grid.gallery-grid--sliders .gallery-slider-card{
aspect-ratio:1 / 1 !important;
height:auto !important;
min-height:0 !important;
}
.gallery-grid.gallery-grid--sliders .ba{
height:100% !important;
min-height:0 !important;
}
.gallery-grid.gallery-grid--sliders .ba__img,
.gallery-grid.gallery-grid--sliders .ba__img img{
height:100% !important;
}
.gallery-grid.gallery-grid--sliders .ba__img img{
width:100% !important;
object-fit:cover !important;
}
@media (max-width: 991px){
.gallery-grid.gallery-grid--sliders{
grid-template-columns:repeat(2, minmax(0,1fr)) !important;
}
}
@media (max-width: 640px){
.gallery-grid.gallery-grid--sliders{
grid-template-columns:1fr !important;
}
}
/* Gallery hero: distribute text vertically better */
.reviews-hero.gallery-hero .reviews-hero__content{
display:flex !important;
flex-direction:column !important;
justify-content:center !important;
min-height:100% !important;
padding-top:34px !important;
padding-bottom:34px !important;
}
.reviews-hero.gallery-hero .reviews-hero__eyebrow{
margin-bottom:18px !important;
}
.reviews-hero.gallery-hero .reviews-hero__title{
margin-bottom:26px !important;
line-height:0.95 !important;
}
.reviews-hero.gallery-hero .reviews-hero__desc{
margin-bottom:32px !important;
line-height:1.45 !important;
}
.reviews-hero.gallery-hero .reviews-hero__actions{
margin-top:auto !important;
padding-top:4px !important;
}
@media (max-width: 767px){
.reviews-hero.gallery-hero .reviews-hero__content{
padding-top:24px !important;
padding-bottom:24px !important;
}
.reviews-hero.gallery-hero .reviews-hero__title{
margin-bottom:18px !important;
}
.reviews-hero.gallery-hero .reviews-hero__desc{
margin-bottom:24px !important;
}
}
/* Tighten gallery hero vertical spacing */
.reviews-hero.gallery-hero.section{
padding-top:8px !important;
padding-bottom:8px !important;
margin-top:0 !important;
margin-bottom:0 !important;
}
.reviews-hero.gallery-hero .reviews-hero__shell{
padding-top:0 !important;
padding-bottom:0 !important;
min-height:auto !important;
}
.reviews-hero.gallery-hero .reviews-hero__content{
padding-top:10px !important;
padding-bottom:10px !important;
margin-bottom:0 !important;
}
.reviews-hero.gallery-hero .reviews-hero__title{
margin-bottom:14px !important;
}
.reviews-hero.gallery-hero .reviews-hero__desc{
margin-bottom:18px !important;
}
/* Final gallery hero spacing correction */
.reviews-page-main .reviews-hero.gallery-hero.section{
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__shell{
min-height: 0 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__content{
padding-top: 6px !important;
padding-bottom: 6px !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__eyebrow{
margin-bottom: 10px !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__title{
margin-top: 0 !important;
margin-bottom: 12px !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__desc{
margin-top: 0 !important;
margin-bottom: 14px !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__actions{
margin-top: 0 !important;
padding-top: 0 !important;
}
/* Actual gallery hero reduction fix */
.reviews-page-main .reviews-hero.gallery-hero.section{
padding-top: 22px !important;
padding-bottom: 18px !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__shell{
min-height: 0 !important;
max-height: none !important;
align-items: stretch !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__content{
display: block !important;
min-height: 0 !important;
padding: 18px 34px 18px !important;
margin: 0 !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__eyebrow{
margin: 0 0 10px !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__title{
margin: 0 0 12px !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__desc{
margin: 0 0 16px !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__actions{
margin: 0 !important;
padding: 0 !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__media{
min-height: 0 !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__media img{
display: block !important;
width: 100% !important;
height: 100% !important;
max-height: 420px !important;
object-fit: cover !important;
object-position: center !important;
}
@media (max-width: 991px){
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__content{
padding: 16px 24px 16px !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__media img{
max-height: 340px !important;
}
}
@media (max-width: 767px){
.reviews-page-main .reviews-hero.gallery-hero.section{
padding-top: 16px !important;
padding-bottom: 12px !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__content{
padding: 14px 18px 14px !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__media img{
max-height: 260px !important;
}
}
/* Gallery hero text spacing adjustments */
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__eyebrow{
margin-bottom:18px !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__title{
margin-bottom:26px !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__desc{
margin-bottom:28px !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__actions{
margin-top:4px !important;
}
/* FINAL gallery hero spacing tuning */
.reviews-page-main .reviews-hero.gallery-hero.section{
padding-top:34px !important; /* space between navbar and section */
padding-bottom:22px !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__eyebrow{
margin-bottom:22px !important; /* space under eyebrow line */
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__title{
margin-bottom:32px !important; /* title -> body */
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__desc{
margin-bottom:36px !important; /* body -> buttons */
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__actions{
margin-top:6px !important;
}
/* Vertically center gallery hero text */
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__content{
display:flex !important;
flex-direction:column !important;
justify-content:center !important;
height:100% !important;
padding-top:30px !important;
padding-bottom:30px !important;
}
.reviews-page-main .reviews-hero.gallery-hero .reviews-hero__shell{
align-items:center !important;
}
/* Our Clients page */
.clients-page-main{
background:#f5f5f5;
}
.clients-hero.reviews-hero{
padding:28px 0 36px;
background:#f5f5f5;
}
.clients-testimonial{
padding:24px 0 34px;
background:#f5f5f5;
}
.clients-testimonial__card{
display:grid;
grid-template-columns:84px minmax(0,1fr);
gap:22px;
align-items:start;
background:#ffffff;
border-radius:30px;
padding:34px 34px 32px;
box-shadow:0 10px 30px rgba(23,37,84,.06);
}
.clients-testimonial__quote-mark{
width:84px;
height:84px;
border-radius:24px;
display:flex;
align-items:center;
justify-content:center;
background:#eaf7ee;
color:#16a34a;
font-family:"Montserrat", sans-serif;
font-size:56px;
font-weight:800;
line-height:1;
}
.clients-testimonial__eyebrow{
margin:0 0 10px;
color:#16a34a;
font-family:"Montserrat", sans-serif;
font-size:14px;
font-weight:800;
letter-spacing:.04em;
text-transform:uppercase;
}
.clients-testimonial__title{
margin:0 0 18px;
color:#111827;
font-family:"Montserrat", sans-serif;
font-size:clamp(28px,3vw,38px);
font-weight:800;
line-height:1.08;
}
.clients-testimonial__body{
margin:0 0 20px;
color:#374151;
font-size:17px;
line-height:1.7;
max-width:900px;
}
.clients-testimonial__meta{
display:flex;
flex-direction:column;
gap:4px;
color:#374151;
font-size:15px;
}
.clients-testimonial__meta strong{
color:#111827;
font-family:"Montserrat", sans-serif;
font-size:16px;
font-weight:800;
}
.clients-logos{
padding:12px 0 72px;
background:#f5f5f5;
}
.clients-logos__header{
margin-bottom:24px;
}
.clients-logos__grid{
display:grid;
grid-template-columns:repeat(4, minmax(0,1fr));
gap:22px;
}
.clients-logo-card{
min-height:132px;
border-radius:26px;
border:1px solid rgba(15,23,42,.08);
background:#fff;
box-shadow:0 8px 22px rgba(23,37,84,.05);
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:#7c8799;
font-family:"Montserrat", sans-serif;
font-size:16px;
font-weight:800;
letter-spacing:.04em;
}
@media (max-width: 991px){
.clients-testimonial__card{
grid-template-columns:1fr;
gap:18px;
}
.clients-logos__grid{
grid-template-columns:repeat(3, minmax(0,1fr));
}
}
@media (max-width: 767px){
.clients-hero.reviews-hero{
padding:20px 0 28px;
}
.clients-testimonial{
padding:18px 0 26px;
}
.clients-testimonial__card{
padding:24px 22px;
}
.clients-logos{
padding:10px 0 48px;
}
.clients-logos__grid{
grid-template-columns:repeat(2, minmax(0,1fr));
gap:16px;
}
.clients-logo-card{
min-height:104px;
border-radius:20px;
font-size:14px;
}
}
/* Our Clients page: make header/menu/fonts/buttons match the rest of the site */
body.clients-page,
body.clients-page *{
font-family: inherit;
}
.clients-page header,
.clients-page .header,
.clients-page .header *{
font-family: inherit !important;
}
.clients-page .reviews-hero__title,
.clients-page .clients-testimonial__title,
.clients-page .clients-testimonial__eyebrow,
.clients-page .clients-logo-card,
.clients-page .section__sub{
font-family:"Montserrat", sans-serif !important;
}
.clients-page .reviews-hero__title{
font-size:clamp(32px,4.1vw,44px) !important;
line-height:1.08 !important;
font-weight:800 !important;
}
.clients-page .reviews-hero__desc{
font-size:16px !important;
line-height:1.6 !important;
}
.clients-page .reviews-hero__actions{
gap:16px !important;
}
.clients-page .reviews-hero__call,
.clients-page .reviews-hero__book{
min-height:54px !important;
min-width:0 !important;
padding:12px 22px !important;
border-radius:16px !important;
font-size:15px !important;
line-height:1.1 !important;
}
.clients-page .reviews-hero__call span{
font-size:16px !important;
line-height:1.1 !important;
}
.clients-page .reviews-hero__book{
min-width:210px !important;
}
@media (max-width: 767px){
.clients-page .reviews-hero__call,
.clients-page .reviews-hero__book{
min-height:48px !important;
padding:10px 18px !important;
font-size:14px !important;
}
.clients-page .reviews-hero__call span{
font-size:15px !important;
}
}
/* Our Clients page rebuilt like site pages */
.clients-page-main{
background:#f5f5f5;
}
.clients-hero.reviews-hero{
padding:28px 0 36px;
background:#f5f5f5;
}
.clients-hero .reviews-hero__call,
.clients-hero .reviews-hero__book{
min-height:56px !important;
padding:12px 22px !important;
border-radius:16px !important;
}
.clients-hero .reviews-hero__call span{
font-size:16px !important;
}
.clients-hero .reviews-hero__book{
min-width:210px !important;
}
.clients-testimonial{
padding:24px 0 34px;
background:#f5f5f5;
}
.clients-testimonial__card{
display:grid;
grid-template-columns:84px minmax(0,1fr);
gap:22px;
align-items:start;
background:#ffffff;
border-radius:30px;
padding:34px 34px 32px;
box-shadow:0 10px 30px rgba(23,37,84,.06);
}
.clients-testimonial__quote-mark{
width:84px;
height:84px;
border-radius:24px;
display:flex;
align-items:center;
justify-content:center;
background:#eaf7ee;
color:#16a34a;
font-family:"Montserrat", sans-serif;
font-size:56px;
font-weight:800;
line-height:1;
}
.clients-testimonial__eyebrow{
margin:0 0 10px;
color:#16a34a;
font-family:"Montserrat", sans-serif;
font-size:14px;
font-weight:800;
letter-spacing:.04em;
text-transform:uppercase;
}
.clients-testimonial__title{
margin:0 0 18px;
color:#111827;
font-family:"Montserrat", sans-serif;
font-size:clamp(28px,3vw,38px);
font-weight:800;
line-height:1.08;
}
.clients-testimonial__body{
margin:0 0 20px;
color:#374151;
font-size:17px;
line-height:1.7;
max-width:900px;
}
.clients-testimonial__meta{
display:flex;
flex-direction:column;
gap:4px;
color:#374151;
font-size:15px;
}
.clients-testimonial__meta strong{
color:#111827;
font-family:"Montserrat", sans-serif;
font-size:16px;
font-weight:800;
}
.clients-logos{
padding:12px 0 72px;
background:#f5f5f5;
}
.clients-logos__header{
margin-bottom:24px;
}
.clients-logos__grid{
display:grid;
grid-template-columns:repeat(4, minmax(0,1fr));
gap:22px;
}
.clients-logo-card{
min-height:132px;
border-radius:26px;
border:1px solid rgba(15,23,42,.08);
background:#fff;
box-shadow:0 8px 22px rgba(23,37,84,.05);
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:#7c8799;
font-family:"Montserrat", sans-serif;
font-size:16px;
font-weight:800;
letter-spacing:.04em;
}
@media (max-width: 991px){
.clients-testimonial__card{
grid-template-columns:1fr;
gap:18px;
}
.clients-logos__grid{
grid-template-columns:repeat(3, minmax(0,1fr));
}
}
@media (max-width: 767px){
.clients-hero.reviews-hero{
padding:20px 0 28px;
}
.clients-testimonial{
padding:18px 0 26px;
}
.clients-testimonial__card{
padding:24px 22px;
}
.clients-logos{
padding:10px 0 48px;
}
.clients-logos__grid{
grid-template-columns:repeat(2, minmax(0,1fr));
gap:16px;
}
.clients-logo-card{
min-height:104px;
border-radius:20px;
font-size:14px;
}
}
/* Our Clients page: hero buttons match site style more closely */
.clients-hero .reviews-hero__actions{
gap:22px !important;
}
.clients-hero .reviews-hero__call,
.clients-hero .reviews-hero__book{
min-height:74px !important;
padding:14px 34px !important;
border-radius:999px !important;
font-weight:800 !important;
text-decoration:none !important;
transition:.25s ease !important;
}
.clients-hero .reviews-hero__call{
min-width:360px !important;
background:#29b043 !important;
color:#fff !important;
box-shadow:none !important;
}
.clients-hero .reviews-hero__call .reviews-hero__call-label,
.clients-hero .reviews-hero__call span{
color:#fff !important;
font-size:26px !important;
font-weight:800 !important;
line-height:1 !important;
font-style:italic !important;
}
.clients-hero .reviews-hero__book{
min-width:320px !important;
border:4px solid rgba(255,255,255,.35) !important;
background:rgba(255,255,255,.06) !important;
color:#fff !important;
font-size:24px !important;
line-height:1 !important;
font-style:italic !important;
}
.clients-hero .reviews-hero__book:hover,
.clients-hero .reviews-hero__call:hover{
transform:translateY(-2px);
}
/* Our Clients testimonial layout */
.clients-testimonial__card{
grid-template-columns:180px minmax(0, 760px) !important;
gap:34px !important;
align-items:start !important;
}
.clients-testimonial__media{
width:180px;
}
.clients-testimonial__media-inner{
display:flex;
flex-direction:column;
gap:18px;
}
.clients-testimonial__quote-mark{
width:110px !important;
height:110px !important;
border-radius:28px !important;
font-size:72px !important;
flex:0 0 auto;
}
.clients-testimonial__image{
width:100%;
aspect-ratio:1 / 1;
border-radius:26px;
background:
linear-gradient(135deg, rgba(22,163,74,.18), rgba(22,163,74,.05)),
url('./wp-content/webp-express/webp-images/doc-root/wp-content/uploads/2025/08/Superior-Plumbing-Heating-Local-Plumber-9-mob.png.webp') center/cover no-repeat;
box-shadow:0 8px 22px rgba(23,37,84,.05);
}
.clients-testimonial__content{
max-width:760px !important;
}
.clients-testimonial__body{
max-width:760px !important;
}
@media (max-width: 991px){
.clients-hero .reviews-hero__call{
min-width:280px !important;
}
.clients-hero .reviews-hero__book{
min-width:260px !important;
}
.clients-hero .reviews-hero__call .reviews-hero__call-label,
.clients-hero .reviews-hero__call span{
font-size:22px !important;
}
.clients-hero .reviews-hero__book{
font-size:20px !important;
}
.clients-testimonial__card{
grid-template-columns:1fr !important;
}
.clients-testimonial__media{
width:180px;
}
}
@media (max-width: 767px){
.clients-hero .reviews-hero__actions{
gap:14px !important;
}
.clients-hero .reviews-hero__call,
.clients-hero .reviews-hero__book{
min-height:58px !important;
min-width:0 !important;
width:100% !important;
padding:12px 20px !important;
}
.clients-hero .reviews-hero__call .reviews-hero__call-label,
.clients-hero .reviews-hero__call span{
font-size:20px !important;
}
.clients-hero .reviews-hero__book{
font-size:18px !important;
}
.clients-testimonial__media{
width:140px;
}
.clients-testimonial__quote-mark{
width:90px !important;
height:90px !important;
font-size:60px !important;
}
}
/* Our Clients: smaller hero buttons, full-height review image, shorter hero */
.clients-hero.reviews-hero{
padding:18px 0 24px !important;
}
.clients-hero .reviews-hero__content{
padding:28px 34px !important;
}
.clients-hero .reviews-hero__actions{
gap:16px !important;
}
.clients-hero .reviews-hero__call,
.clients-hero .reviews-hero__book{
min-height:56px !important;
padding:10px 22px !important;
border-radius:999px !important;
}
.clients-hero .reviews-hero__call{
min-width:240px !important;
}
.clients-hero .reviews-hero__book{
min-width:230px !important;
border-width:3px !important;
}
.clients-hero .reviews-hero__call .reviews-hero__call-label,
.clients-hero .reviews-hero__call span{
font-size:18px !important;
}
.clients-hero .reviews-hero__book{
font-size:18px !important;
}
.clients-testimonial__card{
grid-template-columns:180px minmax(0, 760px) !important;
align-items:stretch !important;
}
.clients-testimonial__media{
width:180px !important;
height:100% !important;
align-self:stretch !important;
}
.clients-testimonial__media-inner{
height:100% !important;
display:flex !important;
flex-direction:column !important;
}
.clients-testimonial__image{
flex:1 1 auto !important;
min-height:100% !important;
aspect-ratio:auto !important;
height:auto !important;
}
@media (max-width: 991px){
.clients-hero .reviews-hero__call{
min-width:210px !important;
}
.clients-hero .reviews-hero__book{
min-width:210px !important;
}
}
@media (max-width: 767px){
.clients-hero.reviews-hero{
padding:14px 0 18px !important;
}
.clients-hero .reviews-hero__content{
padding:22px 20px !important;
}
.clients-hero .reviews-hero__call,
.clients-hero .reviews-hero__book{
min-height:50px !important;
width:100% !important;
min-width:0 !important;
padding:10px 18px !important;
}
.clients-hero .reviews-hero__call .reviews-hero__call-label,
.clients-hero .reviews-hero__call span,
.clients-hero .reviews-hero__book{
font-size:16px !important;
}
.clients-testimonial__card{
grid-template-columns:1fr !important;
}
.clients-testimonial__media{
width:140px !important;
height:auto !important;
}
.clients-testimonial__image{
aspect-ratio:1 / 1 !important;
min-height:0 !important;
}
}
/* Our Clients: fix review image containment and shorten hero */
.clients-hero.reviews-hero{
padding: 12px 0 18px !important;
}
.clients-hero .reviews-hero__content{
padding: 22px 32px !important;
}
.clients-testimonial__card{
overflow: hidden !important;
grid-template-columns: 180px minmax(0, 760px) !important;
align-items: stretch !important;
}
.clients-testimonial__media{
width: 180px !important;
height: auto !important;
min-height: 100% !important;
align-self: stretch !important;
overflow: hidden !important;
}
.clients-testimonial__media-inner{
height: 100% !important;
display: flex !important;
flex-direction: column !important;
gap: 16px !important;
}
.clients-testimonial__quote-mark{
flex: 0 0 auto !important;
}
.clients-testimonial__image{
flex: 1 1 auto !important;
min-height: 260px !important;
height: auto !important;
max-height: 100% !important;
background-position: center top !important;
overflow: hidden !important;
border-radius: 26px !important;
}
.clients-testimonial__content{
min-width: 0 !important;
max-width: 760px !important;
padding-right: 6px !important;
}
@media (max-width: 991px){
.clients-testimonial__card{
grid-template-columns: 1fr !important;
}
.clients-testimonial__media{
width: 180px !important;
min-height: 0 !important;
height: auto !important;
}
.clients-testimonial__image{
min-height: 180px !important;
aspect-ratio: 1 / 1 !important;
}
}
@media (max-width: 767px){
.clients-hero.reviews-hero{
padding: 10px 0 14px !important;
}
.clients-hero .reviews-hero__content{
padding: 18px 20px !important;
}
.clients-testimonial__media{
width: 140px !important;
}
.clients-testimonial__image{
min-height: 140px !important;
}
}
/* Our Clients final review + hero corrections */
.clients-hero.reviews-hero{
padding: 6px 0 10px !important;
}
.clients-hero .reviews-hero__shell{
min-height: 0 !important;
}
.clients-hero .reviews-hero__content{
padding: 14px 28px !important;
}
.clients-hero .reviews-hero__eyebrow{
margin-bottom: 8px !important;
}
.clients-hero .reviews-hero__title{
margin-bottom: 12px !important;
}
.clients-hero .reviews-hero__desc{
margin-bottom: 14px !important;
}
.clients-hero .reviews-hero__actions{
margin-top: 0 !important;
}
.clients-testimonial__card{
grid-template-columns: 300px minmax(0, 1fr) !important;
align-items: stretch !important;
overflow: hidden !important;
}
.clients-testimonial__media{
width: 300px !important;
min-height: 100% !important;
height: auto !important;
align-self: stretch !important;
overflow: hidden !important;
}
.clients-testimonial__media-inner{
height: 100% !important;
min-height: 100% !important;
display: block !important;
}
.clients-testimonial__quote-mark{
display: none !important;
}
.clients-testimonial__image{
display: block !important;
width: 100% !important;
height: 100% !important;
min-height: 100% !important;
border-radius: 26px !important;
background-position: center center !important;
background-size: cover !important;
}
.clients-testimonial__content{
align-self: start !important;
}
@media (max-width: 991px){
.clients-testimonial__card{
grid-template-columns: 1fr !important;
}
.clients-testimonial__media{
width: 220px !important;
min-height: 220px !important;
}
.clients-testimonial__image{
height: 220px !important;
min-height: 220px !important;
}
}
@media (max-width: 767px){
.clients-hero.reviews-hero{
padding: 4px 0 8px !important;
}
.clients-hero .reviews-hero__content{
padding: 12px 18px !important;
}
.clients-testimonial__media{
width: 180px !important;
min-height: 180px !important;
}
.clients-testimonial__image{
height: 180px !important;
min-height: 180px !important;
}
}
/* FORCE smaller Our Clients hero */
.clients-hero,
.clients-hero.reviews-hero{
padding-top: 0px !important;
padding-bottom: 8px !important;
min-height: 0 !important;
}
.clients-hero .reviews-hero__shell{
min-height: 0 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.clients-hero .reviews-hero__content{
padding: 10px 24px !important;
}
.clients-hero .reviews-hero__title{
margin-bottom: 8px !important;
}
.clients-hero .reviews-hero__desc{
margin-bottom: 10px !important;
}
.clients-hero .reviews-hero__media img{
max-height: 320px !important;
}
@media (max-width: 991px){
.clients-hero .reviews-hero__media img{
max-height: 260px !important;
}
}
/* Fix overlap with main menu */
.clients-hero,
.clients-hero.reviews-hero{
margin-top: 22px !important;
}
/* Improve spacing inside Our Clients hero */
.clients-hero .reviews-hero__eyebrow{
margin-bottom: 12px !important;
}
.clients-hero .reviews-hero__title{
margin-bottom: 18px !important;
}
.clients-hero .reviews-hero__desc{
margin-bottom: 22px !important;
max-width: 620px !important;
}
/* Slightly larger CALL NOW text */
.clients-hero .reviews-hero__call span,
.clients-hero .reviews-hero__call .reviews-hero__call-label{
font-size: 20px !important;
}
/* Make green CALL NOW buttons thicker across services + industries */
.reviews-hero__call,
.hero__call,
.cta-call,
a.reviews-hero__call{
min-height:72px !important;
padding:18px 40px !important;
border-radius:999px !important;
}
.reviews-hero__call span,
.reviews-hero__call .reviews-hero__call-label{
font-size:22px !important;
line-height:1 !important;
}
.service-intro__btn--primary span,
.service-intro__btn--primary{
font-size: 22px !important;
font-weight: 800 !important;
}
@media (max-width: 991px){
.service-intro__btn--primary,
.service-intro__btn.service-intro__btn--primary,
.restaurants-hero .service-intro__btn--primary,
.service-intro .service-intro__btn--primary,
a.service-intro__btn--primary{
min-width: 280px !important;
min-height: 76px !important;
padding: 18px 34px !important;
}
}
@media (max-width: 767px){
.service-intro__btn--primary,
.service-intro__btn.service-intro__btn--primary,
.restaurants-hero .service-intro__btn--primary,
.service-intro .service-intro__btn--primary,
a.service-intro__btn--primary{
min-width: 240px !important;
min-height: 68px !important;
padding: 16px 28px !important;
}
}
/* Increase spacing between homepage hero text and CALL button */
.home-hero .about-hero__call,
.home-hero .btn-green{
margin-top: 26px !important;
}
/* Main page exact spacing under body copy before green CTA */
.about-hero__content .about-hero__actions,
.about-hero .about-hero__actions,
.hero .about-hero__actions{
margin-top: 34px !important;
}
/* Keep emergency button same sizing as about-us */
body a.btn.btn-green.about-hero__call{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
}
/* Fix homepage spacing between bullet text and CALL button */
.promo__info .promo__text{
margin-bottom:22px !important;
line-height:1.45 !important;
}
.promo__info .btn-green{
margin-top:18px !important;
}
/* Make green CTA same size as BOOK A SERVICE on gallery/blog/review pages */
.reviews-hero__call,
.gallery-hero .about-hero__call,
.blog-hero .about-hero__call{
padding:14px 34px !important;
min-height:52px !important;
font-size:16px !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
}
/* Ensure the book button keeps same vertical alignment */
.reviews-hero__actions a{
align-items:center !important;
}
/* Fix spacing in OUR CLIENTS hero to match gallery style */
.clients-hero,
.clients-hero .reviews-hero__content{
padding-top:70px !important;
padding-bottom:70px !important;
}
.clients-hero .reviews-hero__eyebrow{
margin-bottom:14px !important;
}
.clients-hero .reviews-hero__title{
margin-bottom:18px !important;
}
.clients-hero .reviews-hero__desc{
margin-bottom:26px !important;
}
.clients-hero .reviews-hero__actions{
margin-top:20px !important;
}
/* FINAL: make green CTA same size as BOOK A SERVICE on gallery/blog/reviews-style pages */
.reviews-hero .reviews-hero__actions{
gap: 20px !important;
}
.reviews-hero .reviews-hero__call,
.reviews-hero a.reviews-hero__call{
min-width: 340px !important;
min-height: 74px !important;
padding: 14px 30px !important;
border-radius: 20px !important;
box-sizing: border-box !important;
}
.reviews-hero .reviews-hero__book,
.reviews-hero a.reviews-hero__book{
min-width: 340px !important;
min-height: 74px !important;
padding: 14px 30px !important;
border-radius: 20px !important;
box-sizing: border-box !important;
}
.reviews-hero .reviews-hero__call .reviews-hero__call-label,
.reviews-hero .reviews-hero__call span{
font-size: 20px !important;
line-height: 1.1 !important;
}
.reviews-hero .reviews-hero__book{
font-size: 20px !important;
line-height: 1.1 !important;
}
/* Reduce Our Clients hero vertical padding */
.clients-hero.reviews-hero{
padding-top: 24px !important;
padding-bottom: 24px !important;
}
.clients-hero .reviews-hero__content{
padding-top: 26px !important;
padding-bottom: 26px !important;
}
.clients-hero .reviews-hero__eyebrow{
margin-bottom: 12px !important;
}
.clients-hero .reviews-hero__title{
margin-bottom: 16px !important;
}
.clients-hero .reviews-hero__desc{
margin-bottom: 20px !important;
}
.clients-hero .reviews-hero__actions{
margin-top: 0 !important;
}
@media (max-width: 991px){
.reviews-hero .reviews-hero__call,
.reviews-hero a.reviews-hero__call,
.reviews-hero .reviews-hero__book,
.reviews-hero a.reviews-hero__book{
min-width: 280px !important;
min-height: 66px !important;
padding: 12px 24px !important;
}
.reviews-hero .reviews-hero__call .reviews-hero__call-label,
.reviews-hero .reviews-hero__call span,
.reviews-hero .reviews-hero__book{
font-size: 18px !important;
}
.clients-hero.reviews-hero{
padding-top: 18px !important;
padding-bottom: 18px !important;
}
.clients-hero .reviews-hero__content{
padding-top: 22px !important;
padding-bottom: 22px !important;
}
}
@media (max-width: 767px){
.reviews-hero .reviews-hero__call,
.reviews-hero a.reviews-hero__call,
.reviews-hero .reviews-hero__book,
.reviews-hero a.reviews-hero__book{
min-width: 0 !important;
width: 100% !important;
min-height: 58px !important;
padding: 12px 18px !important;
}
.clients-hero.reviews-hero{
padding-top: 14px !important;
padding-bottom: 14px !important;
}
.clients-hero .reviews-hero__content{
padding-top: 18px !important;
padding-bottom: 18px !important;
}
}
/* Restore blog/gallery/reviews-style CTA sizing:
keep BOOK A SERVICE at prior size and make CALL US NOW match it */
.reviews-hero .reviews-hero__actions{
gap: 20px !important;
}
.reviews-hero .reviews-hero__book,
.reviews-hero a.reviews-hero__book{
min-width: 290px !important;
min-height: 74px !important;
padding: 14px 30px !important;
border-radius: 20px !important;
font-size: 20px !important;
line-height: 1.1 !important;
box-sizing: border-box !important;
}
.reviews-hero .reviews-hero__call,
.reviews-hero a.reviews-hero__call{
min-width: 290px !important;
min-height: 74px !important;
padding: 14px 30px !important;
border-radius: 20px !important;
box-sizing: border-box !important;
}
.reviews-hero .reviews-hero__call .reviews-hero__call-label,
.reviews-hero .reviews-hero__call span{
font-size: 20px !important;
line-height: 1.1 !important;
}
@media (max-width: 991px){
.reviews-hero .reviews-hero__book,
.reviews-hero a.reviews-hero__book,
.reviews-hero .reviews-hero__call,
.reviews-hero a.reviews-hero__call{
min-width: 250px !important;
min-height: 66px !important;
padding: 12px 24px !important;
}
.reviews-hero .reviews-hero__book,
.reviews-hero .reviews-hero__call .reviews-hero__call-label,
.reviews-hero .reviews-hero__call span{
font-size: 18px !important;
}
}
@media (max-width: 767px){
.reviews-hero .reviews-hero__book,
.reviews-hero a.reviews-hero__book,
.reviews-hero .reviews-hero__call,
.reviews-hero a.reviews-hero__call{
width: 100% !important;
min-width: 0 !important;
min-height: 58px !important;
padding: 12px 18px !important;
}
}
/* Actually reduce Our Clients hero vertical padding without inflating buttons */
.clients-hero.reviews-hero{
padding-top: 10px !important;
padding-bottom: 12px !important;
}
.clients-hero .reviews-hero__shell{
min-height: 0 !important;
}
.clients-hero .reviews-hero__content{
padding-top: 18px !important;
padding-bottom: 18px !important;
}
.clients-hero .reviews-hero__eyebrow{
margin-bottom: 10px !important;
}
.clients-hero .reviews-hero__title{
margin-bottom: 14px !important;
}
.clients-hero .reviews-hero__desc{
margin-bottom: 18px !important;
}
.clients-hero .reviews-hero__actions{
margin-top: 0 !important;
}
@media (max-width: 991px){
.clients-hero.reviews-hero{
padding-top: 8px !important;
padding-bottom: 10px !important;
}
.clients-hero .reviews-hero__content{
padding-top: 16px !important;
padding-bottom: 16px !important;
}
}
@media (max-width: 767px){
.clients-hero.reviews-hero{
padding-top: 6px !important;
padding-bottom: 8px !important;
}
.clients-hero .reviews-hero__content{
padding-top: 14px !important;
padding-bottom: 14px !important;
}
}
/* Make CTA buttons match pill shape from reference image (shape only, keep text) */
.reviews-hero__call,
.reviews-hero__book,
a.reviews-hero__call,
a.reviews-hero__book{
border-radius:999px !important;
height:64px !important;
padding-left:34px !important;
padding-right:34px !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
}
/* FINAL fix: review / gallery / blog hero CTA buttons
make both buttons smaller and true pill shape */
.reviews-page-main .reviews-hero .reviews-hero__actions .reviews-hero__call,
.reviews-page-main .reviews-hero .reviews-hero__actions a.reviews-hero__call,
.reviews-page-main .reviews-hero .reviews-hero__actions .reviews-hero__book,
.reviews-page-main .reviews-hero .reviews-hero__actions a.reviews-hero__book,
.clients-page-main .reviews-hero .reviews-hero__actions .reviews-hero__call,
.clients-page-main .reviews-hero .reviews-hero__actions a.reviews-hero__call,
.clients-page-main .reviews-hero .reviews-hero__actions .reviews-hero__book,
.clients-page-main .reviews-hero .reviews-hero__actions a.reviews-hero__book{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
width:auto !important;
min-width:260px !important;
max-width:none !important;
height:60px !important;
min-height:60px !important;
padding:0 28px !important;
border-radius:999px !important;
box-sizing:border-box !important;
}
.reviews-page-main .reviews-hero .reviews-hero__actions .reviews-hero__book,
.reviews-page-main .reviews-hero .reviews-hero__actions a.reviews-hero__book,
.clients-page-main .reviews-hero .reviews-hero__actions .reviews-hero__book,
.clients-page-main .reviews-hero .reviews-hero__actions a.reviews-hero__book{
border-width:3px !important;
}
.reviews-page-main .reviews-hero .reviews-hero__actions .reviews-hero__call .reviews-hero__call-label,
.reviews-page-main .reviews-hero .reviews-hero__actions .reviews-hero__call span,
.clients-page-main .reviews-hero .reviews-hero__actions .reviews-hero__call .reviews-hero__call-label,
.clients-page-main .reviews-hero .reviews-hero__actions .reviews-hero__call span{
font-size:18px !important;
line-height:1 !important;
}
.reviews-page-main .reviews-hero .reviews-hero__actions .reviews-hero__book,
.reviews-page-main .reviews-hero .reviews-hero__actions a.reviews-hero__book,
.clients-page-main .reviews-hero .reviews-hero__actions .reviews-hero__book,
.clients-page-main .reviews-hero .reviews-hero__actions a.reviews-hero__book{
font-size:18px !important;
line-height:1 !important;
}
@media (max-width: 767px){
.reviews-page-main .reviews-hero .reviews-hero__actions .reviews-hero__call,
.reviews-page-main .reviews-hero .reviews-hero__actions a.reviews-hero__call,
.reviews-page-main .reviews-hero .reviews-hero__actions .reviews-hero__book,
.reviews-page-main .reviews-hero .reviews-hero__actions a.reviews-hero__book,
.clients-page-main .reviews-hero .reviews-hero__actions .reviews-hero__call,
.clients-page-main .reviews-hero .reviews-hero__actions a.reviews-hero__call,
.clients-page-main .reviews-hero .reviews-hero__actions .reviews-hero__book,
.clients-page-main .reviews-hero .reviews-hero__actions a.reviews-hero__book{
width:100% !important;
min-width:0 !important;
height:56px !important;
min-height:56px !important;
padding:0 20px !important;
}
}
/* Make CALL US NOW text same size as BOOK A SERVICE */
.reviews-hero__call,
.reviews-hero__call span{
font-size:20px !important;
font-weight:700 !important;
}
/* Make CALL US NOW text same size as BOOK A SERVICE on Our Clients page */
.clients-page-main .reviews-hero__call,
.clients-page-main .reviews-hero__call span{
font-size:20px !important;
font-weight:700 !important;
}
/* Restore normal CTA size on Get a Quote page */
.quote-page-main .btn,
.quote-page-main .about-hero__call,
.quote-page-main a.btn{
width:auto !important;
min-width:0 !important;
max-width:none !important;
padding:14px 28px !important;
height:auto !important;
min-height:56px !important;
border-radius:999px !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
}
/* Force smaller button on Get a Quote hero */
.quote-page-main .promo__btn,
.quote-page-main .btn,
.quote-page-main a.btn{
padding:10px 20px !important;
min-height:48px !important;
height:48px !important;
width:auto !important;
min-width:0 !important;
border-radius:999px !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
}
/* FIX: prevent full-width button on Get a Quote page */
.get-quote-page .btn,
.quote-page-main .btn,
.get-a-quote .btn,
.page-template-quote .btn{
width:auto !important;
max-width:fit-content !important;
display:inline-flex !important;
padding:14px 34px !important;
height:56px !important;
border-radius:999px !important;
}
/* Fix actual Get a Quote submit button */
.quote-request-form__submit{
width:auto !important;
min-width:0 !important;
max-width:none !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
padding:12px 24px !important;
height:52px !important;
min-height:52px !important;
border-radius:999px !important;
white-space:nowrap !important;
align-self:flex-start !important;
}
/* ACTUAL fix for Get a Quote submit button */
.quote-request-form{
align-items: flex-start !important;
}
.quote-request-form__submit{
width: auto !important;
max-width: none !important;
min-width: 0 !important;
display: inline-flex !important;
flex: 0 0 auto !important;
align-items: center !important;
justify-content: center !important;
align-self: flex-start !important;
padding: 0 26px !important;
height: 56px !important;
min-height: 56px !important;
border-radius: 999px !important;
white-space: nowrap !important;
}
.quote-request-form button.quote-request-form__submit{
width: auto !important;
max-width: none !important;
min-width: 0 !important;
}
/* Footer CTA button only: keep pill shape on actual CTA */
.footer-custom__cta{
border-radius:999px !important;
min-height:60px !important;
padding:0 28px !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
font-style:italic !important;
}
/* Footer Customer Service menu link: Get a Quote should look like regular links */
.footer--custom .footer-custom__menus li a[href="get-a-quote.html"],
.footer--custom .footer-custom__menus li a[href*="get-a-quote"]{
display:inline !important;
min-height:0 !important;
height:auto !important;
padding:0 !important;
border-radius:0 !important;
background:none !important;
border:none !important;
font-style:normal !important;
font-weight:400 !important;
text-transform:none !important;
letter-spacing:0 !important;
}
/* Reduced city dropdown list links */
.toronto-dropdown .sub-menu-link{
white-space: nowrap;
}
/* Sticky top specialist bar */
.header__sticky{
position: sticky !important;
top: 0 !important;
z-index: 1000 !important;
width: 100% !important;
transition: transform .22s ease, box-shadow .22s ease, background-color .22s ease !important;
}
.header__sticky.is-scrolled{
box-shadow: 0 10px 24px rgba(0,0,0,.10) !important;
}
@media (max-width: 767px){
.header__sticky{
top: 0 !important;
}
}
/* Top specialist bar: fixed so it follows the user for the full page */
.header__sticky{
position: fixed !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
width: 100% !important;
z-index: 2000 !important;
transition: box-shadow .22s ease, background-color .22s ease, transform .22s ease !important;
}
.header__sticky.is-scrolled{
box-shadow: 0 10px 24px rgba(0,0,0,.10) !important;
}
body.has-sticky-specialist-bar{
padding-top: 0 !important;
}
/* Sticky specialist bar visual fix */
.header__sticky{
position: fixed !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
width: 100% !important;
z-index: 2000 !important;
display: flex !important;
align-items: center !important;
justify-content: flex-end !important;
gap: 18px !important;
padding: 10px 24px !important;
background: #1d3f95 !important;
background-color: #1d3f95 !important;
opacity: 1 !important;
visibility: visible !important;
box-sizing: border-box !important;
border-bottom: 1px solid rgba(255,255,255,.08) !important;
}
.header__sticky::before,
.header__sticky::after{
content: none !important;
}
.header__sticky a,
.header__sticky span{
opacity: 1 !important;
}
.header__sticky .top-specialist-callout{
display: inline-flex !important;
align-items: center !important;
gap: 10px !important;
color: #fff !important;
text-decoration: none !important;
white-space: nowrap !important;
}
.header__sticky .top-specialist-callout__label{
color: rgba(255,255,255,.9) !important;
}
.header__sticky .top-specialist-callout__phone{
color: #fff !important;
}
.header__sticky .header__btn,
.header__sticky .top-order-btn,
.header__sticky a.btn,
.header__sticky .btn{
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
}
body{
padding-top: 0 !important;
}
@media (max-width: 991px){
.header__sticky{
padding: 10px 16px !important;
gap: 12px !important;
}
}
@media (max-width: 767px){
.header__sticky{
flex-wrap: wrap !important;
justify-content: center !important;
padding: 10px 12px !important;
}
}
/* Restore original header/menu look while keeping sticky specialist bar */
:root{
--sticky-specialist-bar-height: 0px;
}
body.has-fixed-specialist-bar .header{
padding-top: var(--sticky-specialist-bar-height) !important;
}
.header__sticky{
position: fixed !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
width: 100% !important;
z-index: 2000 !important;
/* undo the heavy visual overrides from the previous patch */
display: block !important;
padding: 0 !important;
gap: 0 !important;
background: transparent !important;
background-color: transparent !important;
border-bottom: none !important;
box-shadow: none !important;
opacity: 1 !important;
visibility: visible !important;
}
.header__sticky::before,
.header__sticky::after{
content: none !important;
}
.header__sticky.is-scrolled{
box-shadow: 0 8px 18px rgba(0,0,0,.08) !important;
}
.header__sticky .top-specialist-callout{
display: inline-flex !important;
}
.header__sticky .header__btn,
.header__sticky .btn,
.header__sticky a.btn{
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
}
@media (max-width: 767px){
body.has-fixed-specialist-bar .header{
padding-top: var(--sticky-specialist-bar-height) !important;
}
}
/* Sticky specialist bar clone: keep original header/button styles intact */
.sticky-specialist-bar{
position: fixed !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
z-index: 3000 !important;
display: none !important;
background: #fff !important;
}
.sticky-specialist-bar::before{
content: "" !important;
position: absolute !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
height: 4.1rem !important;
background: #243a80 !important;
z-index: 0 !important;
}
.sticky-specialist-bar.is-visible{
display: block !important;
}
.sticky-specialist-bar .header__sticky{
position: relative !important;
z-index: 1 !important;
width: 100% !important;
margin: 0 !important;
}
.sticky-specialist-bar .top-specialist-callout{
text-decoration: none !important;
}
@media (max-width: 1100px){
.sticky-specialist-bar::before{
height: 3.5rem !important;
}
}
body.has-fixed-specialist-bar .header,
body.has-sticky-specialist-spacer,
body{
padding-top: 0 !important;
}
/* Keep the original in-page top bar looking normal */
.header > .container{
position: relative !important;
}
.header .header__sticky{
background: transparent !important;
box-shadow: none !important;
}
/* Remove white divider when header becomes sticky */
.is-sticky .main-header,
.is-sticky header,
.sticky-header,
.elementor-sticky--active {
border-bottom: none !important;
}
/* Sticky header cleanup: remove the white band from the sticky clone wrapper only */
.sticky-specialist-bar,
.sticky-specialist-bar .header__sticky{
background: transparent !important;
border-bottom: none !important;
box-shadow: none !important;
}
/* Move specialist text and Book Now button away from right edge */
.top-specialist-callout{ right:26rem !important; }
.header__btn,
.book-now-btn{ margin-right:40px !important; }
/* Move Book Now button slightly left without affecting layout */
.header__btn,
.header__btn.btn,
.header__btn.btn-t,
.header__btn.btn-transparent-dark,
.book-now-btn{
margin-right: 60px !important;
}
/* Move specialist text further left to avoid overlap with Book Now button */
.top-specialist-callout{
right: 30rem !important;
}
/* Final logo click fix: keep sticky header unchanged, raise the main header/logo above the menu row */
.header{
position: relative !important;
overflow: visible !important;
}
.header > .container{
position: relative !important;
z-index: 5000 !important;
overflow: visible !important;
}
.header__row{
position: relative !important;
z-index: 1 !important;
}
.header .custom-logo-link{
position: absolute !important;
z-index: 6000 !important;
pointer-events: auto !important;
cursor: pointer !important;
}
.header .custom-logo-link img{
pointer-events: auto !important;
}
.service-card__media img{
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
/* Restore centered service choose cards with working dropdown details */
.service-choose-card{
align-items:center !important;
text-align:center;
}
.service-choose-card__icon{
margin-left:auto;
margin-right:auto;
}
.service-choose-card__icon svg{width:16px;height:16px;display:block;}
.service-choose__detail-panels{
display:block;
}
.service-choose__detail[hidden]{
display:none !important;
}
/* Make FOG process images fill the card frame consistently */
.fog-process-card--image{
display:flex;
align-items:stretch;
justify-content:stretch;
min-height:220px;
}
.fog-process-card--image img{
width:100%;
height:100%;
min-height:220px;
display:block;
object-fit:cover;
object-position:center;
}
/* enforce consistent fog step image frames */
.fog-process-card--image{
aspect-ratio:16/9;
}
.fog-process-card--image img{
width:100%;
height:100%;
object-fit:cover;
}
/* Emergency mini service card images */
.service-card--mini .service-card__image{
background-size:cover;
background-position:center;
background-repeat:no-repeat;
}
/* Shift grease trap process truck photo slightly right so text isn't clipped */
.service-process-split__media img[src*="grease-trap-process-truck.webp"]{
object-position:42% center !important;
}
/* Move Grease Interceptor Pumping card image upward so hands and hose show */
.services-mini-grid article:nth-child(2) .service-card__image{
background-position:center 82% !important;
}
/* Company logos carousel */
.logo-card{
padding: 10px 14px;
}
.logo-card img{
display:block;
max-width:100%;
max-height:46px;
width:auto;
height:auto;
object-fit:contain;
margin:0 auto;
}
/* Floating company logos */
.logos .splide__slide{
padding: 10px 0;
}
.logo-card,
.logo-card.logo-card--floating{
background: transparent !important;
border: none !important;
box-shadow: none !important;
outline: none !important;
height: 84px;
display:flex;
align-items:center;
justify-content:center;
padding: 0 10px;
}
.logo-card img{
display:block;
width:auto;
height:auto;
max-width: 240px;
max-height: 62px;
object-fit: contain;
margin:0 auto;
filter:none;
opacity:1;
}
/* Upsize smaller logos while leaving larger ones visually balanced */
.logo-card img[src*="company-logo-mustafa"],
.logo-card img[src*="company-logo-galitos"],
.logo-card img[src*="company-logo-flaminggrill"],
.logo-card img[src*="company-logo-haritna"],
.logo-card img[src*="company-logo-crown"]{
max-height: 74px;
}
.logo-card img[src*="company-logo-omg"],
.logo-card img[src*="company-logo-mrzagros"],
.logo-card img[src*="company-logo-mado"],
.logo-card img[src*="company-logo-trc"],
.logo-card img[src*="company-logo-mn"]{
max-height: 62px;
}
/* Center company logos consistently in equal-width spaces */
.logos .splide__track{
overflow: hidden;
}
.logos .splide__list{
align-items: center;
}
.logos .splide__slide{
display:flex;
align-items:center;
justify-content:center;
}
.logo-card,
.logo-card.logo-card--floating{
width:100%;
min-height:84px;
display:flex !important;
align-items:center !important;
justify-content:center !important;
text-align:center;
}
.logo-card img{
display:block;
margin-left:auto !important;
margin-right:auto !important;
}
/* Main page companies section spacing */
#companies .logos .splide__slide{
padding-left: 8px;
padding-right: 8px;
}
/* Upsize smaller marks */
.logo-card img[src*="company-logo-crown"],
.logo-card img[src*="company-logo-mn"],
.logo-card img[src*="company-logo-mustafa"],
.logo-card img[src*="company-logo-galitos"],
.logo-card img[src*="company-logo-flaminggrill"],
.logo-card img[src*="company-logo-haritna"]{
max-height:72px !important;
}
/* Fine centering fixes for logos with uneven transparent padding */
.logo-card img[src*="company-logo-crown"]{
transform:translateX(8px);
}
.logo-card img[src*="company-logo-mn"]{
transform:translateX(4px);
}
.logo-card img[src*="company-logo-haritna"]{
transform:translateX(2px);
}
/* COMPANY LOGO SLIDER — visual centering fix */
.logos .splide__slide{
display:flex;
justify-content:center;
align-items:center;
}
/* uniform logo container */
.logo-card{
width:220px;
height:90px;
display:flex;
justify-content:center;
align-items:center;
}
/* normalize logo sizes */
.logo-card img{
max-height:70px;
max-width:180px;
width:auto;
height:auto;
object-fit:contain;
display:block;
}
/* precise logo centering/size corrections */
.logo-card img[src*="company-logo-crown.png"]{
transform: translateX(-18px) !important;
}
.logo-card img[src*="company-logo-haritna.png"]{
max-height: 88px !important;
max-width: 200px !important;
}
/* Fix: reduce oversized titles for companies + gallery to match other sections */
#companies
/* Fix: reduce gap between reviews and companies section */
#companies{
margin-top: 10px !important;
padding-top: 10px !important;
}
/* Match title size with other sections (services) */
/* Match title size with standard section titles */
#companies .h2-t,
#work .h2-t{
font-size:32px !important;
line-height:1.15 !important;
}
/* Remove white line above hero sections */
.hero,
.hero-section,
.page-hero,
.section:first-of-type{
margin-top:0 !important;
border-top:none !important;
padding-top:0 !important;
}
/* Industry page why-choose cards: match homepage card styling exactly */
.restaurants-why-choose__card{
appearance:none !important;
width:100% !important;
min-height:162px !important;
background:#fff !important;
border:1px solid #e0e4ea !important;
border-radius:22px !important;
padding:26px 22px !important;
box-shadow:0 10px 28px rgba(0,0,0,.05) !important;
display:flex !important;
flex-direction:column !important;
justify-content:center !important;
align-items:center !important;
text-align:center !important;
cursor:pointer !important;
transition:border-color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
}
.restaurants-why-choose__card:hover{
transform:translateY(-1px) !important;
border-color:#8fd39a !important;
box-shadow:0 8px 18px rgba(0,0,0,.05) !important;
}
.restaurants-why-choose__card--active{
background:#edf5ef !important;
border-color:#a8d0b0 !important;
box-shadow:none !important;
}
.restaurants-why-choose__icon{
width:48px !important;
height:48px !important;
border-radius:14px !important;
background:#eef2fb !important;
color:#2f57c4 !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
margin:0 auto 16px auto !important;
position:relative !important;
opacity:1 !important;
}
.restaurants-why-choose__card--active .restaurants-why-choose__icon{
background:#1fa64a !important;
color:#fff !important;
}
.restaurants-why-choose__icon::before{
width:24px !important;
height:24px !important;
}
.restaurants-why-choose__card h3{
margin:0 !important;
font-size:18px !important;
line-height:1.25 !important;
font-weight:800 !important;
color:#111 !important;
text-align:center !important;
}
/* Exact hero spacing to match gallery page */
.contact-hero.section{
margin-top:0 !important;
padding-top:34px !important;
padding-bottom:46px !important;
}
.reviews-hero.section:not(.gallery-hero){
margin-top:0 !important;
padding-top:34px !important;
padding-bottom:46px !important;
}
/* Undo older oversized/tiny spacing overrides on blog/clients content blocks */
.blog-hero .reviews-hero__content,
.clients-hero .reviews-hero__content{
padding:44px 42px !important;
}
.blog-hero .reviews-hero__shell,
.clients-hero .reviews-hero__shell{
padding-top:0 !important;
padding-bottom:0 !important;
min-height:0 !important;
}
.clients-hero,
.clients-hero.reviews-hero,
.blog-hero,
.blog-hero.reviews-hero{
min-height:0 !important;
}
/* Force green CALL US NOW buttons to hover navy on service + industry + location pages */
.btn.btn-green.about-hero__call:hover,
.btn.btn-green.about-hero__call:focus,
.about-hero__call:hover,
.about-hero__call:focus,
.about-hero__actions .btn:hover,
.about-hero__actions .btn:focus,
.about-hero__actions a.btn:hover,
.about-hero__actions a.btn:focus,
.about-hero__actions a.btn-green:hover,
.about-hero__actions a.btn-green:focus,
.contact-hero__call:hover,
.contact-hero__call:focus,
.reviews-hero__call:hover,
.reviews-hero__call:focus{
background:#152372 !important;
border-color:#152372 !important;
color:#ffffff !important;
filter:none !important;
}
/* --- HERO SPACING ADJUSTMENTS (contact + blog) --- */
/* Contact page: slightly more space above hero */
.contact-hero.section{
padding-top:48px !important; /* was smaller */
padding-bottom:32px !important; /* reduce space below hero */
}
/* Blog page: reduce space below hero */
.blog-hero.section{
padding-bottom:28px !important;
}
/* Reduce gap between hero and next section on blog */
.blog-hero.section + .section{
margin-top:0 !important;
padding-top:40px !important;
}
/* Blog hero image replacement */
.blog-hero .reviews-hero__media img{
width:100%;
height:100%;
display:block;
object-fit:cover;
}
/* HERO IMAGE CARD FIX — ensure images fully fill hero card */
.reviews-hero__media{
height:100%;
overflow:hidden;
}
.reviews-hero__media img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}
/* specifically reinforce for gallery + clients heroes */
.gallery-hero .reviews-hero__media img,
.clients-hero .reviews-hero__media img{
width:100%;
height:100%;
object-fit:cover;
}
/* Zoom clients hero image to remove bottom blue line */
.clients-hero .reviews-hero__media img{
width:100%;
height:100%;
object-fit:cover;
transform:scale(1.15);
transform-origin:center;
}
/* Show hose image in About mission left panel */
.about-mission__tools-stage{
position:relative;
min-height:260px;
overflow:visible !important;
}
.about-mission__tools-image{
position:absolute;
left:-22vw;
top:-80px;
width:50vw;
max-width:none;
height:auto;
display:block !important;
visibility:visible !important;
opacity:1 !important;
pointer-events:none;
z-index:1;
}
@media (max-width:1180px){
.about-mission__tools-stage{
position:relative;
min-height:260px;
overflow:visible !important;
}
.about-mission__tools-image{
position:absolute;
left:-22vw;
top:-80px;
width:50vw;
max-width:none;
height:auto;
display:block !important;
visibility:visible !important;
opacity:1 !important;
pointer-events:none;
z-index:1;
}
}
/* Tighten spacing between mission and reviews */
.about-mission{
padding-bottom:16px !important;
}
.about-mission + .section.section-reviews.container{
padding-top:16px !important;
margin-top:0 !important;
}
/* FORCE hose visible */
.about-mission__media{
position:relative;
z-index:1;
overflow:visible !important;
min-width:0;
}
.about-mission__tools-stage{
position:relative;
min-height:260px;
overflow:visible !important;
}
.about-mission__tools-image{
position:absolute;
left:-22vw;
top:-80px;
width:50vw;
max-width:none;
height:auto;
display:block !important;
visibility:visible !important;
opacity:1 !important;
pointer-events:none;
z-index:1;
}
/* Keep mission text clear and above hose */
.about-mission__content{
position:relative;
z-index:3;
}
.about-mission__media{
position:relative;
z-index:1;
overflow:visible !important;
min-width:0;
}
/* Keep mission text clear and hose fully visible */
.about-mission{
padding-bottom:16px !important;
margin-bottom:0 !important;
overflow:visible !important;
}
.about-mission__wrap{
position:relative;
overflow:visible !important;
align-items:start;
}
.about-mission__content{
position:relative;
z-index:3;
}
.about-mission + .section.section-reviews.container{
padding-top:16px !important;
margin-top:0 !important;
}
@media (max-width:1180px){
.about-mission__tools-stage{
min-height:210px;
}
.about-mission__tools-image{
position:absolute;
left:-22vw;
top:-80px;
width:50vw;
max-width:none;
height:auto;
display:block !important;
visibility:visible !important;
opacity:1 !important;
pointer-events:none;
z-index:1;
}
}
@media (max-width:767px){
.about-mission__tools-stage{
min-height:170px;
}
.about-mission__tools-image{
position:absolute;
left:-22vw;
top:-80px;
width:50vw;
max-width:none;
height:auto;
display:block !important;
visibility:visible !important;
opacity:1 !important;
pointer-events:none;
z-index:1;
}
}
/* spacing polish adjustments */
.about-experience{padding-top:90px; padding-bottom:40px;}
.areas, .areas-served, .service-areas{
margin-top:-40px;
padding-top:20px;
}
/* FINAL SPACING FIXES */
/* shrink gap above AREAS WE SERVE section */
.areas-served,
.service-areas,
.areas {
margin-top: -80px;
padding-top: 10px;
}
/* capitalize decade section title */
.about-experience__text h2,
.about-experience h2 {
text-transform: uppercase;
}
/* FINAL AREA SECTION SPACING FIX */
#areas-we-serve,
.areas-section,
.service-area-section {
padding-top: 0 !important;
}
/* --- FINAL GAP REDUCTION ABOVE AREAS SECTION --- */
/* reduce bottom space from the section above */
.request-section,
.contact-section,
.cta-section{
padding-bottom:20px !important;
margin-bottom:0 !important;
}
/* pull the areas section upward */
.areas-served,
.service-areas,
.areas,
#areas{
padding-top:10px !important;
}
/* --- Corrected spacing before AREAS section --- */
/* reduce space from section above */
.contact-section,
.request-section,
.cta-section{
padding-bottom:30px !important;
}
/* ensure Areas section has normal spacing */
.areas,
.service-areas,
.areas-served{
margin-top:0 !important;
padding-top:40px !important;
}
/* Actual spacing fix between service choose section and gallery section */
.service-choose{
margin-bottom: 28px !important;
padding-bottom: 20px !important;
}
.service-choose + .section.section-work.container{
margin-top: 28px !important;
padding-top: 12px !important;
}
/* Main page: add proper spacing between facts/icons row and Why Choose section */
#why-choose{
padding-top: 44px !important;
}
/* Ensure first service cards look identical to the rest */
#service-grease-trap-cleaning .service-card__media,
#service-grease-interceptor-pumping .service-card__media{
margin: 0;
border-radius: 0;
overflow: hidden;
}
#service-grease-trap-cleaning .service-card__media .media-placeholder,
#service-grease-interceptor-pumping .service-card__media .media-placeholder{
height: 190px;
display: grid !important;
place-items: center;
background: linear-gradient(135deg, rgba(0,0,0,.04), rgba(0,0,0,.02)) !important;
border: 1px dashed var(--line) !important;
color: rgba(0,0,0,.5);
}
/* Add spacing between CALL US NOW button and icon row */
.facts-with-form,
.facts{
margin-top: 35px !important;
}
/* Force service icons to white while keeping blue circle background */
.facts__item-img svg {
stroke:#ffffff !important;
fill:none !important;
}
.facts__item-img svg path,
.facts__item-img svg line,
.facts__item-img svg polyline,
.facts__item-img svg circle {
stroke:#ffffff !important;
fill:#ffffff !important;
}
/* Ensure blue circles remain blue and icon files render white */
.facts__item-img{
background:#3552d9 !important;
}
.facts__item-img img{
filter:none !important;
opacity:1 !important;
}
/* Larger Mirza logo in header and footer */
.custom-logo-link img{
height: 72px !important;
width: auto !important;
max-width: none !important;
}
.footer-custom__logo img{
height: 86px !important;
width: auto !important;
max-width: none !important;
}
/* Larger Mirza logos for header and footer */
.custom-logo-link img{
height:95px !important;
width:auto !important;
}
.footer-custom__logo img{
height:110px !important;
width:auto !important;
}
/* Further upsize Mirza logos */
.custom-logo-link img{
height: 112px !important;
width: auto !important;
max-width: none !important;
}
.footer-custom__logo img{
height: 128px !important;
width: auto !important;
max-width: none !important;
}
/* ===== Enlarge Mirza Logo (Header) ===== */
.header__logo img,
.custom-logo-link img {
height: 140px !important;
width: auto !important;
max-height: none !important;
}
/* ===== Enlarge Mirza Logo (Footer) ===== */
.footer-custom__logo img,
.footer-logo img {
height: 150px !important;
width: auto !important;
max-height: none !important;
}
/* Add breathing room for larger logo */
.header__logo {
padding-top: 10px;
padding-bottom: 10px;
}
/* ===== Final header logo upsize (actual selector) ===== */
.custom-logo-link{
flex: 0 0 330px !important;
width: 330px !important;
height: 126px !important;
margin: 0 26px 0 0 !important;
padding: 4px 0 10px !important;
}
.header .custom-logo-link img{
width: 285px !important;
height: auto !important;
max-width: none !important;
display: block !important;
}
/* ===== Footer logo centered with text below ===== */
.footer-custom__brand{
width: 320px !important;
flex: 0 0 320px !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
text-align: center !important;
}
.footer-custom__logo{
width: 260px !important;
margin: 0 auto 20px !important;
}
.footer-custom__logo img{
width: 100% !important;
height: auto !important;
display: block !important;
}
.footer-custom__address,
.footer-custom__phone,
.footer-custom__cta{
text-align: center !important;
margin-left: auto !important;
margin-right: auto !important;
}
/* ===== Service-page benefit icons: make them real, applicable, and clean ===== */
.service-benefit-card__icon{
font-size: 0 !important;
line-height: 0 !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
}
.service-benefit-card__icon svg{
width: 34px !important;
height: 34px !important;
display: block !important;
}
/* ===== More space between Speak with a Pro and the Service Gallery ===== */
.service-choose__detail .service-choose__cta{
margin-bottom: 18px !important;
}
.service-choose + .section.section-work.container{
margin-top: 46px !important;
padding-top: 24px !important;
}
.section-work .section__header{
padding-top: 4px !important;
}
/* ===== Final logo sizing and alignment tune ===== */
/* Header logo: reduce from oversized version */
.custom-logo-link{
flex: 0 0 250px !important;
width: 250px !important;
height: 96px !important;
margin: 0 18px 0 0 !important;
padding: 4px 0 6px !important;
display: flex !important;
align-items: center !important;
}
.header .custom-logo-link img,
.custom-logo-link img{
width: 220px !important;
height: auto !important;
max-width: none !important;
display: block !important;
}
/* Footer logo: restore previous overall look, shift slightly left */
.footer-custom__brand{
width: 300px !important;
flex: 0 0 300px !important;
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;
text-align: left !important;
}
.footer-custom__logo{
width: 245px !important;
margin: 0 0 18px -10px !important;
display: block !important;
}
.footer-custom__logo img{
width: 100% !important;
height: auto !important;
display: block !important;
}
.footer-custom__address,
.footer-custom__phone,
.footer-custom__cta{
text-align: left !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
/* ===== More space between Speak with a Pro and Service Gallery ===== */
.service-choose__cta,
.service-choose__detail .service-choose__cta,
.section-service-choose .service-choose__cta{
margin-bottom: 28px !important;
}
.service-choose + .section.section-work.container,
.section-service-choose + .section.section-work.container,
.service-choose + .section-work.container{
margin-top: 64px !important;
padding-top: 28px !important;
}
.section-work,
.section-work.container{
scroll-margin-top: 24px;
}
.section-work .section__header{
margin-top: 0 !important;
padding-top: 8px !important;
}
/* ===== Final positioning adjustments requested ===== */
/* Move top header logo upward a bit more and keep size balanced */
.custom-logo-link{
flex: 0 0 250px !important;
width: 250px !important;
height: 88px !important;
margin: -10px 18px 0 0 !important;
padding: 0 !important;
display: flex !important;
align-items: flex-start !important;
justify-content: flex-start !important;
}
.header .custom-logo-link img,
.custom-logo-link img{
width: 215px !important;
height: auto !important;
max-width: none !important;
display: block !important;
}
/* Footer logo: reduce empty space under logo and pull text closer */
.footer-custom__brand{
width: 300px !important;
flex: 0 0 300px !important;
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;
text-align: left !important;
}
.footer-custom__logo{
width: 245px !important;
margin: 0 0 6px -10px !important;
display: block !important;
}
.footer-custom__logo img{
width: 100% !important;
height: auto !important;
display: block !important;
}
.footer-custom__address{
margin-top: 0 !important;
}
.footer-custom__phone{
margin-top: 8px !important;
}
.footer-custom__cta{
margin-top: 14px !important;
}
/* Service pages: enlarge gap between Speak with a Pro and Service Gallery */
.service-choose__cta,
.service-choose__detail .service-choose__cta,
.section-service-choose .service-choose__cta{
margin-bottom: 40px !important;
}
.service-choose + .section.section-work.container,
.section-service-choose + .section.section-work.container,
.service-choose + .section-work.container{
margin-top: 86px !important;
padding-top: 38px !important;
}
.section-work .section__header{
margin-top: 0 !important;
padding-top: 16px !important;
}
/* FINAL ACTUAL HEADER LOGO POSITION */
.header .custom-logo-link,
.custom-logo-link{
position: relative !important;
top: -24px !important;
margin: 0 18px 0 0 !important;
padding: 0 !important;
height: 78px !important;
width: 240px !important;
flex: 0 0 240px !important;
display:flex !important;
align-items:flex-start !important;
justify-content:flex-start !important;
overflow: visible !important;
}
.header .custom-logo-link img,
.custom-logo-link img{
width: 208px !important;
height: auto !important;
display:block !important;
max-width:none !important;
}
/* FINAL FOOTER LOGO SPACING */
.footer-custom__brand{
width: 300px !important;
flex: 0 0 300px !important;
align-items: flex-start !important;
text-align: left !important;
}
.footer-custom__logo{
width: 236px !important;
margin: 0 0 2px -8px !important;
display:block !important;
}
.footer-custom__logo img{
width: 100% !important;
height: auto !important;
display:block !important;
}
.footer-custom__address{
margin: 0 0 10px !important;
}
.footer-custom__phone{
margin: 0 0 12px !important;
}
.footer-custom__cta{
margin-top: 0 !important;
}
/* FINAL BIGGER GAP: Speak with a Pro to Gallery */
.service-choose__cta,
.service-choose__detail .service-choose__cta,
.section-service-choose .service-choose__cta{
margin-bottom: 52px !important;
}
.service-choose + .section.section-work.container,
.section-service-choose + .section.section-work.container,
.service-choose + .section-work.container{
margin-top: 110px !important;
padding-top: 46px !important;
}
.section-work .section__header{
margin-top: 0 !important;
padding-top: 18px !important;
}
/* Force before/after gallery images to fully fill slider cards */
.ba__img,
.ba__img picture,
.ba__img source,
.ba__img img{
width:100%;
height:100%;
}
.ba__img{
overflow:hidden;
}
.ba__img img{
display:block;
object-fit:cover;
object-position:center;
}
/* Final fixes: Our Clients hero image fill + page-specific RELIABLE SERVICE workers */
.clients-hero .reviews-hero__media{
background: transparent !important;
display:block !important;
position:relative !important;
}
.clients-hero .reviews-hero__media img{
position:absolute !important;
inset:0 !important;
width:100% !important;
height:100% !important;
object-fit:cover !important;
display:block !important;
}
.section-quote .quote-hero__worker{
background: transparent !important;
background-repeat: no-repeat !important;
background-position: center bottom !important;
background-size: contain !important;
border-radius: 0 !important;
}
.section-quote .quote-hero__worker.quote-hero__worker--service{
background-image: url('./wp-content/uploads/hero-replacements/service-reliable-worker.png') !important;
}
.section-quote .quote-hero__worker.quote-hero__worker--industry{
background-image: url('./wp-content/uploads/hero-replacements/industry-reliable-worker.png') !important;
}
/* Final March 16 fixes: clients hero image + larger reliable service workers */
.clients-hero .reviews-hero__shell{
align-items:stretch !important;
}
.clients-hero .reviews-hero__media{
align-self:stretch !important;
min-height:100% !important;
height:100% !important;
overflow:hidden !important;
background:transparent !important;
line-height:0 !important;
}
.clients-hero .reviews-hero__media img{
position:absolute !important;
inset:0 !important;
width:100% !important;
height:100% !important;
min-height:100% !important;
max-height:none !important;
object-fit:cover !important;
object-position:center center !important;
display:block !important;
transform:none !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
}
.section-quote .quote-hero__visual{
min-height:460px !important;
height:460px !important;
}
.section-quote .quote-hero__worker{
right:-30px !important;
bottom:-8px !important;
width:420px !important;
height:500px !important;
background-color:transparent !important;
background-repeat:no-repeat !important;
background-position:center bottom !important;
background-size:contain !important;
border-radius:0 !important;
}
@media (max-width: 1024px){
.section-quote .quote-hero__visual{
min-height:400px !important;
height:400px !important;
}
.section-quote .quote-hero__worker{
right:-10px !important;
bottom:-6px !important;
width:320px !important;
height:390px !important;
}
}
@media (max-width: 767px){
.clients-hero .reviews-hero__media{
min-height:280px !important;
height:280px !important;
}
.section-quote .quote-hero__visual{
min-height:340px !important;
height:340px !important;
}
.section-quote .quote-hero__worker{
right:50% !important;
transform:translateX(50%) !important;
width:270px !important;
height:335px !important;
}
}
/* March 16 final requested sizing fixes */
.clients-hero .reviews-hero__shell{
overflow:hidden !important;
align-items:stretch !important;
}
.clients-hero .reviews-hero__media{
position:relative !important;
align-self:stretch !important;
height:auto !important;
min-height:100% !important;
overflow:hidden !important;
background:transparent !important;
line-height:0 !important;
}
.clients-hero .reviews-hero__media img{
position:absolute !important;
top:-8px !important;
bottom:-8px !important;
left:0 !important;
right:0 !important;
width:100% !important;
height:calc(100% + 16px) !important;
max-height:none !important;
object-fit:cover !important;
object-position:center center !important;
display:block !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
background:transparent !important;
}
.section-quote .quote-hero__visual{
min-height:580px !important;
height:580px !important;
display:flex !important;
align-items:flex-end !important;
justify-content:center !important;
overflow:hidden !important;
}
.section-quote .quote-hero__worker{
right:auto !important;
left:50% !important;
transform:translateX(-50%) !important;
bottom:-10px !important;
width:560px !important;
height:640px !important;
background-color:transparent !important;
background-repeat:no-repeat !important;
background-position:center bottom !important;
background-size:auto 98% !important;
border-radius:0 !important;
}
.section-quote .quote-hero__worker.quote-hero__worker--service{
background-image:url('./wp-content/uploads/hero-replacements/service-reliable-worker.png') !important;
}
.section-quote .quote-hero__worker.quote-hero__worker--industry{
background-image:url('./wp-content/uploads/hero-replacements/industry-reliable-worker.png') !important;
}
.about-us .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .quote-hero__worker.quote-hero__worker--about-quality{
background-image:url('./wp-content/uploads/hero-replacements/about-quality-worker.png') !important;
width:560px !important;
height:640px !important;
background-size:auto 98% !important;
}
.about-experience__image-frame{
overflow:hidden !important;
}
.about-experience__image-frame img{
width:100% !important;
height:100% !important;
object-fit:cover !important;
object-position:center center !important;
display:block !important;
}
@media (max-width: 1200px){
.section-quote .quote-hero__visual{
min-height:520px !important;
height:520px !important;
}
.section-quote .quote-hero__worker{
width:500px !important;
height:580px !important;
}
}
@media (max-width: 1024px){
.section-quote .quote-hero__visual{
min-height:460px !important;
height:460px !important;
}
.section-quote .quote-hero__worker{
width:420px !important;
height:500px !important;
}
}
@media (max-width: 767px){
.clients-hero .reviews-hero__media{
min-height:320px !important;
height:320px !important;
}
.clients-hero .reviews-hero__media img{
top:-6px !important;
bottom:-6px !important;
height:calc(100% + 12px) !important;
}
.section-quote .quote-hero__visual{
min-height:380px !important;
height:380px !important;
}
.section-quote .quote-hero__worker{
left:50% !important;
right:auto !important;
transform:translateX(-50%) !important;
width:320px !important;
height:390px !important;
background-size:auto 98% !important;
}
}
/* March 16 final tune-up: fix clients hero image edge + restore quote panel proportions */
.clients-hero .reviews-hero__shell{
overflow:hidden !important;
align-items:stretch !important;
}
.clients-hero .reviews-hero__media{
position:relative !important;
align-self:stretch !important;
min-height:100% !important;
height:100% !important;
overflow:hidden !important;
background:transparent !important;
line-height:0 !important;
border:0 !important;
}
.clients-hero .reviews-hero__media::before,
.clients-hero .reviews-hero__media::after{
content:none !important;
display:none !important;
}
.clients-hero .reviews-hero__media img{
position:absolute !important;
inset:0 !important;
width:100% !important;
height:100% !important;
min-height:100% !important;
max-height:none !important;
display:block !important;
object-fit:cover !important;
object-position:center center !important;
transform:none !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
background:transparent !important;
}
.section.section-quote .quote-hero{
grid-template-columns:minmax(0,1.06fr) minmax(320px,.94fr) !important;
gap:26px !important;
align-items:center !important;
padding:18px 22px !important;
}
.section.section-quote .quote-hero__text{
padding-left:8px !important;
max-width:680px !important;
}
.section.section-quote .quote-hero__text .h2-t{
margin-bottom:14px !important;
}
.section.section-quote .quote-hero__text p{
margin-bottom:18px !important;
}
.section.section-quote .quote-hero__visual{
min-height:430px !important;
height:430px !important;
display:flex !important;
align-items:flex-end !important;
justify-content:center !important;
overflow:hidden !important;
}
.section.section-quote .quote-hero__rings{
inset:-26px !important;
}
.section.section-quote .quote-hero__worker{
left:50% !important;
right:auto !important;
transform:translateX(-50%) !important;
bottom:0 !important;
width:430px !important;
height:405px !important;
background-size:auto 96% !important;
background-position:center bottom !important;
}
.about-us .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .quote-hero__worker.quote-hero__worker--about-quality{
width:430px !important;
height:405px !important;
background-size:auto 96% !important;
}
@media (max-width: 1200px){
.section.section-quote .quote-hero{
grid-template-columns:minmax(0,1fr) minmax(300px,.9fr) !important;
gap:22px !important;
}
.section.section-quote .quote-hero__visual{
min-height:400px !important;
height:400px !important;
}
.section.section-quote .quote-hero__worker,
.about-us .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .quote-hero__worker.quote-hero__worker--about-quality{
width:390px !important;
height:375px !important;
}
}
@media (max-width: 1024px){
.section.section-quote .quote-hero{
grid-template-columns:1fr !important;
padding:18px 20px !important;
}
.section.section-quote .quote-hero__text{
padding-left:0 !important;
max-width:none !important;
}
.section.section-quote .quote-hero__visual{
min-height:360px !important;
height:360px !important;
}
.section.section-quote .quote-hero__worker,
.about-us .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .quote-hero__worker.quote-hero__worker--about-quality{
width:340px !important;
height:330px !important;
}
}
@media (max-width: 767px){
.section.section-quote .quote-hero{
padding:16px 16px !important;
}
.section.section-quote .quote-hero__visual{
min-height:320px !important;
height:320px !important;
}
.section.section-quote .quote-hero__worker,
.about-us .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .quote-hero__worker.quote-hero__worker--about-quality{
width:285px !important;
height:278px !important;
}
}
/* March 16 shared circle-graphic section system: consistent quote/rings sizing across pages */
.circle-graphic-section .quote-hero{
grid-template-columns:minmax(0,1.06fr) minmax(320px,.94fr) !important;
gap:22px !important;
align-items:center !important;
padding:10px 22px !important;
}
.circle-graphic-section .quote-hero__text{
padding-left:8px !important;
max-width:680px !important;
}
.circle-graphic-section .quote-hero__text .h2-t{
margin-bottom:12px !important;
}
.circle-graphic-section .quote-hero__text p{
margin-bottom:16px !important;
}
.circle-graphic-section .quote-hero__visual{
min-height:396px !important;
height:396px !important;
display:flex !important;
align-items:flex-end !important;
justify-content:center !important;
overflow:hidden !important;
}
.circle-graphic-section .quote-hero__rings{
inset:-12px !important;
}
.circle-graphic-section .quote-hero__worker{
left:50% !important;
right:auto !important;
transform:translateX(-50%) !important;
bottom:0 !important;
width:420px !important;
height:390px !important;
background-size:auto 95% !important;
background-position:center bottom !important;
background-repeat:no-repeat !important;
border-radius:0 !important;
}
.about-us .circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:420px !important;
height:390px !important;
background-size:auto 95% !important;
}
@media (max-width: 1200px){
.circle-graphic-section .quote-hero{
grid-template-columns:minmax(0,1fr) minmax(300px,.9fr) !important;
gap:20px !important;
}
.circle-graphic-section .quote-hero__visual{
min-height:372px !important;
height:372px !important;
}
.circle-graphic-section .quote-hero__worker,
.about-us .circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:390px !important;
height:364px !important;
}
}
@media (max-width: 1024px){
.circle-graphic-section .quote-hero{
grid-template-columns:1fr !important;
padding:10px 18px !important;
}
.circle-graphic-section .quote-hero__text{
padding-left:0 !important;
max-width:none !important;
}
.circle-graphic-section .quote-hero__visual{
min-height:340px !important;
height:340px !important;
}
.circle-graphic-section .quote-hero__worker,
.about-us .circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:334px !important;
height:320px !important;
}
}
@media (max-width: 767px){
.circle-graphic-section .quote-hero{
padding:8px 14px !important;
}
.circle-graphic-section .quote-hero__visual{
min-height:300px !important;
height:300px !important;
}
.circle-graphic-section .quote-hero__worker,
.about-us .circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:282px !important;
height:270px !important;
}
}
/* Home / GTA page specific section images */
.whyhire__media{
position:relative !important;
}
.whyhire__photo{
width:100% !important;
height:100% !important;
min-height:470px !important;
display:block !important;
object-fit:cover !important;
object-position:center center !important;
}
@media (max-width: 900px){
.whyhire__photo{
min-height:280px !important;
}
}
body.postid-7 .quote-hero__worker.quote-hero__worker--index-quality{
background-image:url('./wp-content/uploads/hero-replacements/index-quality-worker.png') !important;
background-color:transparent !important;
background-repeat:no-repeat !important;
background-position:center bottom !important;
background-size:auto 95% !important;
}
body.postid-7 .whyhire__photo{
object-position:center center !important;
}
/* March 16 late fix: tighten circle graphic sections to grey ring edges + slightly larger workers */
.section.section-quote.circle-graphic-section{
padding-top:4px !important;
padding-bottom:4px !important;
margin-top:0 !important;
margin-bottom:18px !important;
}
.section.section-quote.circle-graphic-section .quote-hero{
padding-top:0 !important;
padding-bottom:0 !important;
padding-left:18px !important;
padding-right:14px !important;
gap:18px !important;
align-items:center !important;
}
.section.section-quote.circle-graphic-section .quote-hero__text{
padding-top:0 !important;
padding-bottom:0 !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:382px !important;
height:382px !important;
margin-top:0 !important;
margin-bottom:0 !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings{
inset:-6px 0 -6px -10px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:438px !important;
height:402px !important;
background-size:auto 97% !important;
background-position:center bottom !important;
}
@media (max-width: 1200px){
.section.section-quote.circle-graphic-section .quote-hero{
gap:16px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:360px !important;
height:360px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:410px !important;
height:376px !important;
}
}
@media (max-width: 1024px){
.section.section-quote.circle-graphic-section{
padding-top:6px !important;
padding-bottom:6px !important;
}
.section.section-quote.circle-graphic-section .quote-hero{
padding-left:14px !important;
padding-right:14px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:336px !important;
height:336px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:348px !important;
height:326px !important;
}
}
@media (max-width: 767px){
.section.section-quote.circle-graphic-section{
padding-top:8px !important;
padding-bottom:8px !important;
}
.section.section-quote.circle-graphic-section .quote-hero{
padding-left:12px !important;
padding-right:12px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:290px !important;
height:290px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:300px !important;
height:278px !important;
}
}
/* March 16 final tune: circle sections tighter, slightly smaller workers/rings, transparent page background */
.section.section-quote.circle-graphic-section{
background: transparent !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
margin-top: 0 !important;
margin-bottom: 18px !important;
}
.section.section-quote.circle-graphic-section .quote-hero{
background:#fff !important;
padding: 4px 10px !important;
gap: 14px !important;
border-radius: 28px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height: 352px !important;
height: 352px !important;
background: transparent !important;
overflow: hidden !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings{
inset: 0 !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width: 404px !important;
height: 368px !important;
background-size: auto 92% !important;
background-position: center bottom !important;
}
@media (max-width: 1200px){
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height: 332px !important;
height: 332px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width: 376px !important;
height: 344px !important;
}
}
@media (max-width: 1024px){
.section.section-quote.circle-graphic-section .quote-hero{
padding: 6px 12px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height: 314px !important;
height: 314px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width: 336px !important;
height: 306px !important;
}
}
@media (max-width: 767px){
.section.section-quote.circle-graphic-section .quote-hero{
padding: 8px 10px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height: 276px !important;
height: 276px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width: 286px !important;
height: 258px !important;
}
}
/* GTA homepage service cards: real photos instead of placeholders */
#service-grease-trap-cleaning .service-card__media img,
#service-grease-interceptor-pumping .service-card__media img,
#service-fog-disposal-recycling .service-card__media img,
#service-water-jetting-drain-snaking .service-card__media img,
#service-emergency-service .service-card__media img,
#service-maintenance-programs .service-card__media img{
width:100% !important;
height:190px !important;
object-fit:cover !important;
display:block !important;
}
/* March 17 quote card cleanup: remove card border and shift circle-card content right */
.circle-graphic-section .quote-hero{
border:none !important;
padding-left:46px !important;
padding-right:0 !important;
}
.circle-graphic-section .quote-hero__text{
padding-left:18px !important;
}
.circle-graphic-section .quote-hero__visual{
transform:translateX(18px) !important;
}
/* ===== March 16 requested fix: restore card edge, add lift, keep circle shape, shift quote-panel contents right ===== */
.section.section-quote.circle-graphic-section{
background: transparent !important;
}
.section.section-quote.circle-graphic-section .quote-hero{
background: #f7f7f7 !important;
border: 1px solid rgba(255,255,255,0.96) !important;
box-shadow: 0 10px 28px rgba(0,0,0,0.07), 0 2px 8px rgba(0,0,0,0.04) !important;
border-radius: 30px !important;
padding: 8px 22px 8px 44px !important;
gap: 18px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__text{
padding-left: 16px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height: 382px !important;
height: 382px !important;
margin-left: 18px !important;
border-radius: 26px !important;
overflow: hidden !important;
background: transparent !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings{
inset: 0 !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before,
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
border-radius: 50% !important;
right: auto !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width: 520px !important;
height: 520px !important;
left: 18px !important;
bottom: -82px !important;
background: rgba(0,0,0,0.06) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width: 620px !important;
height: 620px !important;
left: -16px !important;
bottom: -132px !important;
background: transparent !important;
border: 8px solid rgba(255,255,255,0.82) !important;
box-shadow: none !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width: 404px !important;
height: 368px !important;
left: 56% !important;
transform: translateX(-50%) !important;
bottom: -2px !important;
background-size: auto 93% !important;
background-position: center bottom !important;
}
@media (max-width: 1200px){
.section.section-quote.circle-graphic-section .quote-hero{
padding: 8px 18px 8px 34px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height: 356px !important;
height: 356px !important;
margin-left: 10px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width: 486px !important;
height: 486px !important;
left: 6px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width: 578px !important;
height: 578px !important;
left: -28px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width: 378px !important;
height: 344px !important;
}
}
@media (max-width: 1024px){
.section.section-quote.circle-graphic-section .quote-hero{
padding: 12px 16px 12px 20px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__text{
padding-left: 0 !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
margin-left: 0 !important;
min-height: 320px !important;
height: 320px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width: 430px !important;
height: 430px !important;
left: 50% !important;
transform: translateX(-50%) !important;
bottom: -64px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width: 516px !important;
height: 516px !important;
left: 50% !important;
transform: translateX(-50%) !important;
bottom: -108px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width: 320px !important;
height: 298px !important;
left: 54% !important;
}
}
@media (max-width: 767px){
.section.section-quote.circle-graphic-section .quote-hero{
padding: 14px 12px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height: 286px !important;
height: 286px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width: 360px !important;
height: 360px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width: 432px !important;
height: 432px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width: 286px !important;
height: 264px !important;
left: 50% !important;
}
}
/* March 16 final fix: restore white card, remove border, add soft lift, keep true circular graphic */
.section.section-quote.circle-graphic-section .quote-hero{
background:#ffffff !important;
border:none !important;
box-shadow:0 8px 24px rgba(0,0,0,.06) !important;
padding:12px 28px 12px 54px !important;
gap:22px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__text{
padding-left:8px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:388px !important;
height:388px !important;
margin-left:18px !important;
overflow:hidden !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings{
inset:0 !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before,
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
left:auto !important;
top:50% !important;
bottom:auto !important;
transform:translateY(-50%) !important;
border-radius:50% !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:540px !important;
height:540px !important;
right:-36px !important;
background:#f2f2f2 !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:640px !important;
height:640px !important;
right:-96px !important;
background:transparent !important;
border:12px solid rgba(255,255,255,.75) !important;
box-shadow:none !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
left:50% !important;
right:auto !important;
transform:translateX(-50%) !important;
width:420px !important;
height:390px !important;
background-size:auto 96% !important;
background-position:center bottom !important;
}
@media (max-width: 1200px){
.section.section-quote.circle-graphic-section .quote-hero{
padding:12px 24px 12px 44px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:364px !important;
height:364px !important;
margin-left:10px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:500px !important;
height:500px !important;
right:-28px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:590px !important;
height:590px !important;
right:-84px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:390px !important;
height:360px !important;
}
}
@media (max-width: 1024px){
.section.section-quote.circle-graphic-section .quote-hero{
padding:12px 16px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__text{
padding-left:0 !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
margin-left:0 !important;
min-height:320px !important;
height:320px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:430px !important;
height:430px !important;
right:50% !important;
transform:translate(50%,-50%) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:516px !important;
height:516px !important;
right:50% !important;
transform:translate(50%,-50%) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:320px !important;
height:298px !important;
left:54% !important;
}
}
@media (max-width: 767px){
.section.section-quote.circle-graphic-section .quote-hero{
padding:14px 12px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:286px !important;
height:286px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:360px !important;
height:360px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:432px !important;
height:432px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:286px !important;
height:264px !important;
left:50% !important;
}
}
/* March 16 final final fix: remove card border, keep white card, restore real circular graphic */
.section.section-quote.circle-graphic-section .quote-hero{
background:#ffffff !important;
border:none !important;
outline:none !important;
box-shadow:0 10px 26px rgba(0,0,0,.08) !important;
padding:12px 28px 12px 54px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
position:relative !important;
min-height:388px !important;
height:388px !important;
margin-left:18px !important;
overflow:hidden !important;
border-radius:22px !important;
background:transparent !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings{
position:absolute !important;
inset:-40px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before,
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
content:"" !important;
position:absolute !important;
top:50% !important;
bottom:auto !important;
left:auto !important;
transform:translateY(-50%) !important;
border-radius:50% !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:540px !important;
height:540px !important;
right:-12px !important;
background:#f2f2f2 !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:640px !important;
height:640px !important;
right:-82px !important;
background:transparent !important;
border:10px solid rgba(255,255,255,.85) !important;
box-shadow:0 0 0 4px rgba(0,0,0,.06) inset !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
left:52% !important;
right:auto !important;
transform:translateX(-50%) !important;
width:420px !important;
height:390px !important;
background-size:auto 96% !important;
background-position:center bottom !important;
}
@media (max-width: 1200px){
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:364px !important;
height:364px !important;
margin-left:10px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:500px !important;
height:500px !important;
right:-4px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:590px !important;
height:590px !important;
right:-66px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:390px !important;
height:360px !important;
}
}
@media (max-width: 1024px){
.section.section-quote.circle-graphic-section .quote-hero{
padding:12px 16px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
margin-left:0 !important;
min-height:320px !important;
height:320px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:430px !important;
height:430px !important;
right:50% !important;
transform:translate(50%,-50%) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:516px !important;
height:516px !important;
right:50% !important;
transform:translate(50%,-50%) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:320px !important;
height:298px !important;
left:54% !important;
}
}
@media (max-width: 767px){
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:286px !important;
height:286px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:360px !important;
height:360px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:432px !important;
height:432px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:286px !important;
height:264px !important;
left:50% !important;
}
}
/* March 17 FINAL OVERRIDE: quote circle sections only */
.section.section-quote.circle-graphic-section .quote-hero{
background:#ffffff !important;
border:none !important;
outline:none !important;
box-shadow:0 12px 28px rgba(0,0,0,.06) !important;
border-radius:32px !important;
padding:8px 22px 8px 54px !important;
gap:20px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__text{
padding-left:8px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
position:relative !important;
min-height:388px !important;
height:388px !important;
margin-left:18px !important;
background:transparent !important;
border-radius:0 !important;
overflow:hidden !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings{
position:absolute !important;
inset:0 !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before,
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
content:"" !important;
position:absolute !important;
top:50% !important;
left:auto !important;
bottom:auto !important;
transform:translateY(-50%) !important;
border-radius:50% !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:470px !important;
height:470px !important;
right:-76px !important;
background:#f2f2f2 !important;
border:none !important;
box-shadow:none !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:560px !important;
height:560px !important;
right:-126px !important;
background:transparent !important;
border:10px solid rgba(255,255,255,.88) !important;
box-shadow:none !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
left:54% !important;
right:auto !important;
transform:translateX(-50%) !important;
bottom:0 !important;
width:416px !important;
height:388px !important;
background-size:auto 96% !important;
background-position:center bottom !important;
background-repeat:no-repeat !important;
}
@media (max-width: 1200px){
.section.section-quote.circle-graphic-section .quote-hero{
padding:8px 18px 8px 42px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:364px !important;
height:364px !important;
margin-left:10px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:438px !important;
height:438px !important;
right:-66px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:520px !important;
height:520px !important;
right:-112px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:388px !important;
height:360px !important;
}
}
@media (max-width: 1024px){
.section.section-quote.circle-graphic-section .quote-hero{
padding:12px 16px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__text{
padding-left:0 !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
margin-left:0 !important;
min-height:320px !important;
height:320px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:400px !important;
height:400px !important;
right:50% !important;
transform:translate(50%,-50%) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:480px !important;
height:480px !important;
right:50% !important;
transform:translate(50%,-50%) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:320px !important;
height:298px !important;
left:54% !important;
}
}
@media (max-width: 767px){
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:286px !important;
height:286px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:350px !important;
height:350px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:420px !important;
height:420px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:286px !important;
height:264px !important;
left:50% !important;
}
}
/* March 17 final override: remove lingering white edge and use true grey concentric circle rings */
.section.section-quote.circle-graphic-section .quote-hero{
background:#ffffff !important;
border:none !important;
outline:none !important;
box-shadow:0 10px 26px rgba(0,0,0,.08) !important;
}
.section.section-quote.circle-graphic-section .quote-hero::before,
.section.section-quote.circle-graphic-section .quote-hero::after{
content:none !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
position:relative !important;
min-height:388px !important;
height:388px !important;
margin-left:18px !important;
overflow:hidden !important;
border-radius:22px !important;
background:transparent !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings{
position:absolute !important;
inset:-40px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before,
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
content:"" !important;
position:absolute !important;
top:50% !important;
left:auto !important;
bottom:auto !important;
border-radius:50% !important;
transform:translateY(-50%) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:540px !important;
height:540px !important;
right:-22px !important;
background:#f1f1f1 !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:604px !important;
height:604px !important;
right:-54px !important;
background:transparent !important;
border:8px solid rgba(0,0,0,.045) !important;
box-shadow:0 0 0 54px rgba(0,0,0,.032) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
left:52% !important;
right:auto !important;
transform:translateX(-50%) !important;
width:420px !important;
height:390px !important;
background-size:auto 96% !important;
background-position:center bottom !important;
}
@media (max-width: 1200px){
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:364px !important;
height:364px !important;
margin-left:10px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:500px !important;
height:500px !important;
right:-12px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:560px !important;
height:560px !important;
right:-42px !important;
box-shadow:0 0 0 46px rgba(0,0,0,.032) !important;
}
}
@media (max-width: 1024px){
.section.section-quote.circle-graphic-section .quote-hero{
padding:12px 16px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
margin-left:0 !important;
min-height:320px !important;
height:320px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:430px !important;
height:430px !important;
right:50% !important;
transform:translate(50%,-50%) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:482px !important;
height:482px !important;
right:50% !important;
transform:translate(50%,-50%) !important;
box-shadow:0 0 0 38px rgba(0,0,0,.032) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:320px !important;
height:298px !important;
left:54% !important;
}
}
@media (max-width: 767px){
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:286px !important;
height:286px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:360px !important;
height:360px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:404px !important;
height:404px !important;
box-shadow:0 0 0 30px rgba(0,0,0,.032) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:286px !important;
height:264px !important;
left:50% !important;
}
}
/* March 17 final fix: remove card border and restore proper circular rings */
.section.section-quote.circle-graphic-section .quote-hero{
background:#ffffff !important;
border:none !important;
outline:none !important;
box-shadow:0 12px 30px rgba(0,0,0,.06) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
position:relative !important;
overflow:hidden !important;
min-height:410px !important;
height:410px !important;
display:flex !important;
align-items:flex-end !important;
justify-content:center !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings{
position:absolute !important;
inset:0 !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before,
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
content:"" !important;
position:absolute !important;
border-radius:50% !important;
top:50% !important;
transform:translateY(-50%) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:660px !important;
height:660px !important;
right:-138px !important;
background:#efefef !important;
box-shadow:none !important;
border:none !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:760px !important;
height:760px !important;
right:-188px !important;
background:transparent !important;
border:8px solid rgba(0,0,0,.055) !important;
box-shadow:none !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
left:54% !important;
right:auto !important;
transform:translateX(-50%) !important;
width:420px !important;
height:390px !important;
background-size:auto 96% !important;
background-position:center bottom !important;
background-repeat:no-repeat !important;
border-radius:0 !important;
}
@media (max-width:1200px){
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:380px !important;
height:380px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:600px !important;
height:600px !important;
right:-130px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:692px !important;
height:692px !important;
right:-176px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:392px !important;
height:368px !important;
}
}
@media (max-width:1024px){
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:340px !important;
height:340px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:500px !important;
height:500px !important;
right:50% !important;
transform:translate(50%,-50%) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:580px !important;
height:580px !important;
right:50% !important;
transform:translate(50%,-50%) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:330px !important;
height:308px !important;
left:54% !important;
}
}
/* March 17 verified final override: quote circle cards */
.section.section-quote.circle-graphic-section .quote-hero{
position:relative !important;
z-index:0 !important;
background:#ffffff !important;
border:none !important;
outline:none !important;
box-shadow:none !important;
border-radius:32px !important;
isolation:isolate !important;
}
.section.section-quote.circle-graphic-section .quote-hero::before{
content:"" !important;
position:absolute !important;
inset:-10px !important;
border-radius:40px !important;
background:transparent !important;
box-shadow:0 12px 30px rgba(0,0,0,.08) !important;
z-index:-1 !important;
pointer-events:none !important;
}
.section.section-quote.circle-graphic-section .quote-hero::after{
content:none !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
position:relative !important;
min-height:388px !important;
height:388px !important;
margin-left:18px !important;
background:transparent !important;
border:none !important;
outline:none !important;
border-radius:0 !important;
overflow:hidden !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings{
position:absolute !important;
inset:0 !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before,
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
content:"" !important;
position:absolute !important;
top:50% !important;
border-radius:50% !important;
transform:translateY(-50%) !important;
left:auto !important;
bottom:auto !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:560px !important;
height:560px !important;
right:86px !important;
background:#efefef !important;
border:none !important;
box-shadow:0 0 0 12px rgba(0,0,0,.045) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:680px !important;
height:680px !important;
right:26px !important;
background:transparent !important;
border:10px solid rgba(0,0,0,.045) !important;
box-shadow:none !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
left:57% !important;
right:auto !important;
bottom:0 !important;
transform:translateX(-50%) !important;
width:420px !important;
height:390px !important;
background-size:auto 96% !important;
background-position:center bottom !important;
background-repeat:no-repeat !important;
border:none !important;
border-radius:0 !important;
}
@media (max-width: 1200px){
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:364px !important;
height:364px !important;
margin-left:10px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:510px !important;
height:510px !important;
right:70px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:620px !important;
height:620px !important;
right:18px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:388px !important;
height:360px !important;
}
}
@media (max-width: 1024px){
.section.section-quote.circle-graphic-section .quote-hero{
padding:12px 16px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
margin-left:0 !important;
min-height:320px !important;
height:320px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:430px !important;
height:430px !important;
right:50% !important;
transform:translate(50%,-50%) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:520px !important;
height:520px !important;
right:50% !important;
transform:translate(50%,-50%) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:320px !important;
height:298px !important;
left:54% !important;
}
}
@media (max-width: 767px){
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:286px !important;
height:286px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:350px !important;
height:350px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:420px !important;
height:420px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:286px !important;
height:264px !important;
left:50% !important;
}
}
/* March 17 verified override: remove white edge artifact and restore full concentric circle */
.section.section-quote.circle-graphic-section .quote-hero{
background:#ffffff !important;
border:0 !important;
outline:0 !important;
box-shadow:0 12px 28px rgba(0,0,0,.08) !important;
border-radius:34px !important;
background-clip:padding-box !important;
}
.section.section-quote.circle-graphic-section .quote-hero::before,
.section.section-quote.circle-graphic-section .quote-hero::after,
.section.section-quote.circle-graphic-section .quote-hero__visual::before,
.section.section-quote.circle-graphic-section .quote-hero__visual::after{
content:none !important;
display:none !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
position:relative !important;
min-height:388px !important;
height:388px !important;
margin-left:18px !important;
overflow:hidden !important;
border-radius:0 !important;
background:transparent !important;
border:0 !important;
outline:0 !important;
box-shadow:none !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings{
position:absolute !important;
inset:0 !important;
overflow:hidden !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before,
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
content:"" !important;
position:absolute !important;
top:50% !important;
border-radius:50% !important;
transform:translateY(-50%) !important;
left:auto !important;
bottom:auto !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:500px !important;
height:500px !important;
right:34px !important;
background:#efefef !important;
border:0 !important;
box-shadow:0 0 0 8px rgba(0,0,0,.045) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:620px !important;
height:620px !important;
right:-26px !important;
background:transparent !important;
border:8px solid rgba(0,0,0,.045) !important;
box-shadow:none !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
left:53% !important;
right:auto !important;
bottom:0 !important;
transform:translateX(-50%) !important;
width:420px !important;
height:390px !important;
background-size:auto 96% !important;
background-position:center bottom !important;
background-repeat:no-repeat !important;
border:0 !important;
outline:0 !important;
box-shadow:none !important;
border-radius:0 !important;
}
@media (max-width:1200px){
.section.section-quote.circle-graphic-section .quote-hero__visual{
min-height:364px !important;
height:364px !important;
margin-left:10px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:460px !important;
height:460px !important;
right:22px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:568px !important;
height:568px !important;
right:-20px !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
width:388px !important;
height:360px !important;
}
}
/* March 17 apply fix: remove card edge artifact and shift quote-circle left so left arc is visible */
.section.section-quote.circle-graphic-section .quote-hero{
background:#ffffff !important;
border:none !important;
outline:none !important;
box-shadow:0 10px 22px rgba(0,0,0,.06) !important;
border-radius:34px !important;
background-image:none !important;
}
.section.section-quote.circle-graphic-section,
.section.section-quote.circle-graphic-section .quote-hero,
.section.section-quote.circle-graphic-section .quote-hero__visual{
border-image:none !important;
}
.section.section-quote.circle-graphic-section .quote-hero::before,
.section.section-quote.circle-graphic-section .quote-hero::after,
.section.section-quote.circle-graphic-section .quote-hero__visual::before,
.section.section-quote.circle-graphic-section .quote-hero__visual::after{
content:none !important;
display:none !important;
}
.section.section-quote.circle-graphic-section .quote-hero__visual{
position:relative !important;
min-height:388px !important;
height:388px !important;
overflow:hidden !important;
border:none !important;
outline:none !important;
box-shadow:none !important;
background:transparent !important;
border-radius:0 !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings{
position:absolute !important;
inset:0 !important;
overflow:hidden !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before,
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
content:"" !important;
position:absolute !important;
top:50% !important;
transform:translateY(-50%) !important;
border-radius:50% !important;
right:auto !important;
bottom:auto !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::before{
width:500px !important;
height:500px !important;
left:6px !important;
background:#efefef !important;
border:none !important;
box-shadow:0 0 0 8px rgba(0,0,0,.04) !important;
}
.section.section-quote.circle-graphic-section .quote-hero__rings::after{
width:592px !important;
height:592px !important;
left:-38px !important;
background:transparent !important;
border:8px solid rgba(0,0,0,.04) !important;
box-shadow:none !important;
}
.section.section-quote.circle-graphic-section .quote-hero__worker,
.about-us .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality,
body:has(main.about-page) .section.section-quote.circle-graphic-section .quote-hero__worker.quote-hero__worker--about-quality{
left:49% !important;
right:auto !important;
bottom:0 !important;
transform:translateX(-50%) !important;
width:420px !important;
height:390px !important;
background-size:auto 96% !important;
background-position:center bottom !important;
background-repeat:no-repeat !important;
}
/* Mississauga page image swaps */
body.postid-7 .whyhire__media{
overflow:hidden !important;
}
body.postid-7 .whyhire__photo.whyhire__photo--mississauga{
display:block !important;
width:100% !important;
height:100% !important;
min-height:470px !important;
object-fit:cover !important;
object-position:center center !important;
border-radius:28px !important;
}
body.postid-7 .quote-hero__worker.quote-hero__worker--mississauga{
background-image:url('./wp-content/uploads/2026/03/mississauga-quality-worker.png') !important;
background-color:transparent !important;
background-repeat:no-repeat !important;
background-position:center bottom !important;
background-size:auto 95% !important;
}
@media (max-width: 900px){
body.postid-7 .whyhire__photo.whyhire__photo--mississauga{
min-height:280px !important;
}
}
/* Scarborough page image swaps */
.whyhire__photo.whyhire__photo--scarborough{
display:block !important;
width:100% !important;
height:100% !important;
min-height:470px !important;
object-fit:cover !important;
object-position:center center !important;
border-radius:28px !important;
}
.quote-hero__worker.quote-hero__worker--scarborough{
background-image:url('./wp-content/uploads/2026/03/scarborough-quality-worker.png') !important;
background-color:transparent !important;
background-repeat:no-repeat !important;
background-position:center bottom !important;
background-size:auto 95% !important;
}
@media (max-width: 900px){
.whyhire__photo.whyhire__photo--scarborough{
min-height:280px !important;
}
}
/* Toronto page image overrides */
.whyhire__photo.whyhire__photo--toronto{width:100%;height:100%;object-fit:cover;display:block;border-radius:28px;}
.circle-graphic-section .quote-hero__worker.quote-hero__worker--toronto{background-image:url("./wp-content/uploads/toronto-quality-worker.png");background-repeat:no-repeat;background-position:center bottom;background-size:contain;}
/* Toronto quote section worker image as actual img */
.circle-graphic-section .quote-hero__worker.quote-hero__worker--toronto{
background:none !important;
background-image:none !important;
object-fit:contain !important;
object-position:center bottom !important;
display:block !important;
}
/* March 17 city image card updates */
.quote-hero__worker.quote-hero__worker--toronto{
width: 520px !important;
height: 470px !important;
max-width: none !important;
object-fit: contain !important;
object-position: center bottom !important;
}
.quote-hero__worker.quote-hero__worker--vaughan{
width: 470px !important;
height: 420px !important;
max-width: none !important;
object-fit: contain !important;
object-position: center bottom !important;
}
@media (max-width: 1200px){
.quote-hero__worker.quote-hero__worker--toronto{ width: 460px !important; height: 420px !important; }
.quote-hero__worker.quote-hero__worker--vaughan{ width: 420px !important; height: 382px !important; }
}
@media (max-width: 1024px){
.quote-hero__worker.quote-hero__worker--toronto{ width: 380px !important; height: 350px !important; }
.quote-hero__worker.quote-hero__worker--vaughan{ width: 350px !important; height: 320px !important; }
}
@media (max-width: 767px){
.quote-hero__worker.quote-hero__worker--toronto{ width: 310px !important; height: 286px !important; }
.quote-hero__worker.quote-hero__worker--vaughan{ width: 300px !important; height: 276px !important; }
}
/* March 17 Toronto worker size increase */
.quote-hero__worker.quote-hero__worker--toronto{
width: 640px !important;
height: 580px !important;
max-width: none !important;
object-fit: contain !important;
object-position: center bottom !important;
}
@media (max-width: 1200px){
.quote-hero__worker.quote-hero__worker--toronto{ width: 560px !important; height: 510px !important; }
}
@media (max-width: 1024px){
.quote-hero__worker.quote-hero__worker--toronto{ width: 440px !important; height: 400px !important; }
}
@media (max-width: 767px){
.quote-hero__worker.quote-hero__worker--toronto{ width: 330px !important; height: 300px !important; }
}
/* March 17 final Toronto quality worker sizing fix */
.quote-hero__worker.quote-hero__worker--toronto{
width: 470px !important;
height: 420px !important;
max-width: none !important;
object-fit: contain !important;
object-position: center bottom !important;
}
@media (max-width: 1200px){
.quote-hero__worker.quote-hero__worker--toronto{
width: 420px !important;
height: 382px !important;
}
}
@media (max-width: 1024px){
.quote-hero__worker.quote-hero__worker--toronto{
width: 350px !important;
height: 320px !important;
}
}
@media (max-width: 767px){
.quote-hero__worker.quote-hero__worker--toronto{
width: 300px !important;
height: 276px !important;
}
}
/* Toronto service card media images */
.services-grid .service-card__media{
overflow:hidden;
}
.services-grid .service-card__media img{
width:100%;
height:100%;
display:block;
object-fit:cover;
}
/* Footer contact card refresh */
.footer--custom{background:#04175f;color:#fff;}
.footer-custom__inner{align-items:flex-start;}
.footer-contact-card{background:transparent;max-width:430px;}
.footer-custom__logo{display:block;width:320px;max-width:100%;margin-bottom:26px;}
.footer-custom__logo img{width:100%;height:auto;display:block;}
.footer-contact-card__item{display:flex;align-items:flex-start;gap:18px;margin-bottom:22px;}
.footer-contact-card__icon{width:44px;height:44px;min-width:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(18,73,219,.22);color:#4b7cff;font-size:22px;line-height:1;}
.footer-contact-card__text{min-width:0;}
.footer-custom__address,.footer-custom__hours,.footer-custom__hours-title,.footer-custom__email,.footer-custom__phone{color:#fff;margin:0;text-decoration:none;}
.footer-custom__phone{font-size:34px;font-weight:800;line-height:1.08;}
.footer-custom__address,.footer-custom__email,.footer-custom__hours{font-size:20px;line-height:1.45;opacity:.96;}
.footer-custom__hours-title{font-size:26px;font-weight:800;line-height:1.15;margin-bottom:8px;}
.footer-custom__email:hover,.footer-custom__phone:hover{color:#fff;opacity:.9;text-decoration:none;}
.footer-custom__cta{display:none;}
.footer-custom__menus{padding-top:10px;}
.footer-custom__col h3{color:#fff;}
.footer-custom__col a{color:rgba(255,255,255,.85);}
.footer-custom__col a:hover{color:#fff;}
@media (max-width: 767px){
.footer-custom__logo{width:250px;}
.footer-contact-card__item{gap:14px;margin-bottom:18px;}
.footer-contact-card__icon{width:40px;height:40px;min-width:40px;font-size:20px;}
.footer-custom__phone{font-size:28px;}
.footer-custom__address,.footer-custom__email,.footer-custom__hours{font-size:18px;}
.footer-custom__hours-title{font-size:22px;}
}
/* Footer contact card refinement */
.footer-contact-card{max-width:320px;}
.footer-custom__logo{width:230px;max-width:100%;margin-bottom:18px;}
.footer-contact-card__item{gap:12px;margin-bottom:16px;align-items:flex-start;}
.footer-contact-card__icon{width:20px;min-width:20px;height:auto;background:none;border-radius:0;color:#fff;font-size:18px;line-height:1.1;display:block;padding-top:2px;}
.footer-custom__phone{font-size:22px;font-weight:800;line-height:1.2;}
.footer-custom__address,.footer-custom__email,.footer-custom__hours{font-size:15px;line-height:1.55;opacity:.96;}
.footer-custom__hours-title{font-size:16px;font-weight:800;line-height:1.2;margin-bottom:4px;}
.footer-contact-card__text{flex:1;}
@media (max-width: 767px){
.footer-contact-card{max-width:100%;}
.footer-custom__logo{width:190px;margin-bottom:14px;}
.footer-custom__phone{font-size:18px;}
.footer-custom__address,.footer-custom__email,.footer-custom__hours{font-size:14px;}
.footer-custom__hours-title{font-size:15px;}
.footer-contact-card__item{gap:10px;margin-bottom:14px;}
.footer-contact-card__icon{font-size:16px;width:18px;min-width:18px;}
}
/* Footer contact icon cleanup + sizing */
.footer-contact-card__icon{position:relative;width:18px!important;min-width:18px!important;height:18px!important;background:none!important;border-radius:0!important;color:#fff!important;font-size:0!important;padding-top:0!important;display:inline-block!important;opacity:.95;}
.footer-contact-card__icon::before,.footer-contact-card__icon::after{content:"";position:absolute;box-sizing:border-box;}
.footer-contact-card__icon--phone::before{left:1px;top:3px;width:12px;height:12px;border:2px solid #fff;border-top-color:transparent;border-left-color:transparent;border-radius:3px;transform:rotate(45deg);}
.footer-contact-card__icon--location::before{left:4px;top:0;width:10px;height:14px;border:2px solid #fff;border-radius:8px 8px 8px 8px/10px 10px 8px 8px;transform:rotate(45deg);border-bottom-left-radius:0;}
.footer-contact-card__icon--location::after{left:7px;top:4px;width:4px;height:4px;background:#fff;border-radius:50%;}
.footer-contact-card__icon--email::before{left:1px;top:3px;width:16px;height:12px;border:2px solid #fff;border-radius:2px;}
.footer-contact-card__icon--email::after{left:3px;top:5px;width:10px;height:10px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg);}
.footer-contact-card__icon--hours::before{left:1px;top:1px;width:16px;height:16px;border:2px solid #fff;border-radius:50%;}
.footer-contact-card__icon--hours::after{left:8px;top:4px;width:2px;height:6px;background:#fff;box-shadow:3px 4px 0 0 #fff;transform-origin:bottom center;}
.footer-custom__phone{font-size:18px!important;line-height:1.15!important;font-weight:700!important;}
.footer-contact-card{max-width:270px!important;}
.footer-contact-card__item{gap:10px!important;margin-bottom:14px!important;}
.footer-custom__address,.footer-custom__email,.footer-custom__hours,.footer-custom__hours-title{font-size:15px!important;line-height:1.45!important;}
.footer-custom__hours-title{font-weight:800!important;}
@media (min-width: 992px){.footer-contact-card{max-width:300px!important;}.footer-custom__phone{font-size:20px!important;}}
/* Client logos */
.clients-logo-card img,.logo-card img{max-width:100%;max-height:70px;object-fit:contain;display:block;margin:0 auto;}
.clients-logo-card{display:flex;align-items:center;justify-content:center;padding:18px;background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:18px;min-height:120px;}
.clients-logos__grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;}
@media (max-width: 991px){.clients-logos__grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media (max-width: 640px){.clients-logos__grid{grid-template-columns:repeat(2,minmax(0,1fr));}.clients-logo-card{min-height:96px;padding:14px;}}
/* MIRZA FOOTER ICONS + LOGO SCALE FIX */
.footer-contact-card{max-width:250px!important;}
.footer-custom__phone{font-size:18px!important;line-height:1.15!important;display:inline-block!important;max-width:190px;}
.footer-contact-card__item{gap:10px!important;align-items:flex-start!important;}
.footer-contact-card__icon{position:relative!important;width:18px!important;min-width:18px!important;height:18px!important;background:none!important;border-radius:0!important;color:transparent!important;font-size:0!important;display:inline-block!important;opacity:1!important;}
.footer-contact-card__icon::before,.footer-contact-card__icon::after{content:'';position:absolute;box-sizing:border-box;}
.footer-contact-card__icon--phone::before{left:3px;top:2px;width:10px;height:14px;border:2px solid #fff;border-radius:5px;transform:rotate(40deg);border-top-color:transparent;border-left-color:transparent;}
.footer-contact-card__icon--location::before{left:3px;top:0;width:12px;height:16px;border:2px solid #fff;border-radius:8px 8px 8px 8px/10px 10px 12px 12px;transform:rotate(45deg);border-bottom-left-radius:0;}
.footer-contact-card__icon--location::after{left:7px;top:5px;width:4px;height:4px;background:#fff;border-radius:50%;}
.footer-contact-card__icon--email::before{left:1px;top:3px;width:16px;height:11px;border:2px solid #fff;border-radius:2px;}
.footer-contact-card__icon--email::after{left:4px;top:5px;width:8px;height:8px;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(45deg);}
.footer-contact-card__icon--hours::before{left:1px;top:1px;width:16px;height:16px;border:2px solid #fff;border-radius:50%;}
.footer-contact-card__icon--hours::after{left:8px;top:4px;width:2px;height:6px;background:#fff;box-shadow:3px 4px 0 0 #fff;transform-origin:bottom center;}
.logo-card img[src*='client-logo-timhortons'], .clients-logo-card img[src*='client-logo-timhortons']{max-height:90px!important; transform:scale(1.18);}
.logo-card img[src*='client-logo-banhmiboys'], .clients-logo-card img[src*='client-logo-banhmiboys']{max-height:95px!important; transform:scale(1.22);}
.logo-card img[src*='company-logo-crown'], .clients-logo-card img[src*='company-logo-crown']{max-height:90px!important; transform:scale(1.18);}
.logo-card img[src*='client-logo-euroshawarma'], .clients-logo-card img[src*='client-logo-euroshawarma']{max-height:88px!important; transform:scale(1.18);}
/* Final footer icon cleanup + footer sizing */
.footer-contact-card{max-width:260px!important;}
.footer-contact-card__item{display:flex!important;align-items:flex-start!important;gap:10px!important;margin-bottom:14px!important;}
.footer-contact-card__icon{position:relative!important;display:inline-block!important;width:18px!important;min-width:18px!important;height:18px!important;background:none!important;border-radius:0!important;color:transparent!important;font-size:0!important;overflow:visible!important;}
.footer-contact-card__icon::before,.footer-contact-card__icon::after{content:none!important;display:none!important;}
.footer-contact-card__icon--phone{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.79 19.79 0 0 1 2.08 4.18 2 2 0 0 1 4.06 2h3a2 2 0 0 1 2 1.72c.12.9.33 1.78.63 2.62a2 2 0 0 1-.45 2.11L8 9.91a16 16 0 0 0 6.09 6.09l1.46-1.24a2 2 0 0 1 2.11-.45c.84.3 1.72.51 2.62.63A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E") center/18px 18px no-repeat!important;}
.footer-contact-card__icon--location{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 10c0 6-9 13-9 13S3 16 3 10a9 9 0 1 1 18 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E") center/18px 18px no-repeat!important;}
.footer-contact-card__icon--email{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2' ry='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E") center/18px 18px no-repeat!important;}
.footer-contact-card__icon--hours{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E") center/18px 18px no-repeat!important;}
.footer-contact-card__text{flex:1;min-width:0;}
.footer-custom__phone{font-size:17px!important;line-height:1.15!important;display:inline-block!important;}
.footer-custom__address,.footer-custom__email,.footer-custom__hours,.footer-custom__hours-label{font-size:14px!important;line-height:1.5!important;}
@media (min-width: 992px){.footer-contact-card{max-width:280px!important;}.footer-custom__phone{font-size:18px!important;}}
/* About us hero image should display as actual image */
.about-hero__worker{object-fit:cover;display:block;background:none!important;}
/* Final footer icon + about us width fixes */
.footer-contact-card{max-width:240px!important;}
.footer-contact-card__item{gap:12px!important;margin-bottom:16px!important;align-items:flex-start!important;}
.footer-contact-card__icon{display:block!important;width:24px!important;min-width:24px!important;height:24px!important;background-position:center center!important;background-repeat:no-repeat!important;background-size:24px 24px!important;opacity:1!important;transform:none!important;}
.footer-contact-card__icon::before,.footer-contact-card__icon::after{content:none!important;display:none!important;}
.footer-contact-card__icon--phone{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.79 19.79 0 0 1 2.08 4.18 2 2 0 0 1 4.06 2h3a2 2 0 0 1 2 1.72c.12.9.33 1.78.63 2.62a2 2 0 0 1-.45 2.11L8 9.91a16 16 0 0 0 6.09 6.09l1.46-1.24a2 2 0 0 1 2.11-.45c.84.3 1.72.51 2.62.63A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E")!important;}
.footer-contact-card__icon--location{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-6.5-5.33-6.5-11A6.5 6.5 0 1 1 18.5 10C18.5 15.67 12 21 12 21Z'/%3E%3Ccircle cx='12' cy='10' r='2.6'/%3E%3C/svg%3E")!important;}
.footer-contact-card__icon--email{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M4 7l8 6 8-6'/%3E%3C/svg%3E")!important;}
.footer-contact-card__icon--hours{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E")!important;}
.footer-custom__phone{font-size:15px!important;line-height:1.15!important;font-weight:700!important;}
.footer-custom__address,.footer-custom__email,.footer-custom__hours,.footer-custom__hours-title{font-size:13px!important;line-height:1.55!important;}
.footer-custom__hours-title{font-size:15px!important;font-weight:800!important;margin-bottom:4px!important;}
.about-hero__wrap{grid-template-columns:minmax(0,1fr) minmax(500px,1fr)!important;gap:42px!important;}
.about-hero__visual{justify-content:center!important;min-height:540px!important;}
.about-hero__worker{width:500px!important;height:540px!important;object-fit:contain!important;background:transparent!important;box-shadow:none!important;}
@media (max-width: 991px){
.about-hero__wrap{grid-template-columns:1fr!important;}
.about-hero__worker{width:320px!important;height:360px!important;}
}
/* ===== Final requested fixes only ===== */
.header .custom-logo-link,
.custom-logo-link{
transform:translateY(6px) !important;
}
.header .custom-logo-link img,
.custom-logo-link img{
width:196px !important;
height:auto !important;
}
.about-hero__visual{
min-height:610px !important;
justify-content:flex-end !important;
align-items:flex-end !important;
}
.about-hero__worker{
width:470px !important;
height:auto !important;
max-height:none !important;
object-fit:contain !important;
background:transparent !important;
box-shadow:none !important;
border-radius:0 !important;
}
.footer-contact-card{
max-width:360px !important;
}
.footer-contact-card__item{
align-items:flex-start !important;
gap:16px !important;
margin-bottom:18px !important;
}
.footer-contact-card__text{
min-width:0 !important;
}
.footer-custom__phone{
font-size:20px !important;
line-height:1.2 !important;
font-weight:800 !important;
}
.footer-custom__address,
.footer-custom__email,
.footer-custom__hours{
font-size:16px !important;
line-height:1.45 !important;
margin:0 !important;
}
.footer-custom__hours-title{
font-size:18px !important;
line-height:1.2 !important;
margin:0 0 6px !important;
font-weight:800 !important;
}
.footer-address-line2{
white-space:nowrap !important;
}
.footer-contact-card__cta-wrap{
margin-top:8px !important;
}
.footer-custom__cta{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
min-width:190px !important;
height:56px !important;
padding:0 28px !important;
border-radius:999px !important;
background:#22a947 !important;
color:#fff !important;
font-size:18px !important;
font-weight:800 !important;
font-style:italic !important;
text-decoration:none !important;
}
.footer-custom__cta:hover{
color:#fff !important;
text-decoration:none !important;
}
/* Homepage section spacing from gallery onward */
#primary > .section.section-work.container,
#primary > .section.section-whyhire,
#primary > .section.section-faq.container{
margin-top:0 !important;
margin-bottom:0 !important;
padding-top:72px !important;
padding-bottom:72px !important;
}
#primary > .section.section-work.container + .section.section-whyhire,
#primary > .section.section-whyhire + .section.section-faq.container{
margin-top:0 !important;
}
@media (max-width: 991px){
.about-hero__visual{
min-height:480px !important;
justify-content:center !important;
}
.about-hero__worker{
width:min(82vw, 360px) !important;
}
}
/* ===== 2026-03-20 location main-page section spacing fix ===== */
/* Adjust the exact section sequence:
Services -> Gallery -> Why Hire -> Quality -> Areas */
.section.section-services.container{
padding-bottom: 34px !important;
}
.section.section-services.container + .section.section-work.container{
margin-top: 0 !important;
padding-top: 26px !important;
}
.section.section-work.container{
padding-bottom: 34px !important;
}
.section.section-work.container + .section.section-whyhire{
margin-top: 0 !important;
padding-top: 26px !important;
}
.section.section-whyhire{
padding-bottom: 72px !important;
}
.section.section-whyhire + .section.section-quote.circle-graphic-section,
.section.section-whyhire + .section.section-quote{
margin-top: 0 !important;
padding-top: 72px !important;
}
.section.section-quote.circle-graphic-section,
.section.section-quote{
padding-bottom: 72px !important;
}
.section.section-quote.circle-graphic-section + .section.section-map.container,
.section.section-quote + .section.section-map.container{
margin-top: 0 !important;
padding-top: 72px !important;
}
/* === 2026-03-20 REAL location-page spacing correction ===
Match Why Hire -> Quality, Quality -> Areas, and Areas -> FAQ
to the same tighter rhythm as FAQ -> Blog.
Previous overrides set both sides to 72px, which created the massive gaps. */
body.locations-template-default #why-hire.section.section-whyhire,
body.locations-template-default #quote.section.section-quote,
body.locations-template-default #quote.section.section-quote.circle-graphic-section,
body.locations-template-default #areas.section.section-map.container,
body.locations-template-default #faq.section.section-faq.container{
margin-top: 0 !important;
margin-bottom: 0 !important;
}
/* keep the lower section's top spacing tight, same idea as FAQ -> Blog */
body.locations-template-default #quote.section.section-quote,
body.locations-template-default #quote.section.section-quote.circle-graphic-section,
body.locations-template-default #areas.section.section-map.container,
body.locations-template-default #faq.section.section-faq.container{
padding-top: 8px !important;
}
/* keep normal breathing room below each preceding content block */
body.locations-template-default #why-hire.section.section-whyhire,
body.locations-template-default #quote.section.section-quote,
body.locations-template-default #quote.section.section-quote.circle-graphic-section,
body.locations-template-default #areas.section.section-map.container{
padding-bottom: 72px !important;
}
@media (max-width: 767px){
body.locations-template-default #quote.section.section-quote,
body.locations-template-default #quote.section.section-quote.circle-graphic-section,
body.locations-template-default #areas.section.section-map.container,
body.locations-template-default #faq.section.section-faq.container{
padding-top: 8px !important;
}
}
/* === Footer tightening pass: reduce blog-to-footer gap + compact footer contact block === */
body .section.section-blog.container{
padding-bottom: 22px !important;
margin-bottom: 0 !important;
}
body footer.footer.footer--custom{
margin-top: 0 !important;
padding-top: 20px !important;
}
body .footer-custom__inner.container{
padding-top: 0 !important;
}
body .footer-contact-card{
max-width: 235px !important;
}
body .footer-custom__logo{
width: 215px !important;
margin-bottom: 10px !important;
}
body .footer-contact-card__item{
gap: 8px !important;
margin-bottom: 10px !important;
}
body .footer-contact-card__icon,
body .footer-contact-card__icon--phone,
body .footer-contact-card__icon--location,
body .footer-contact-card__icon--email,
body .footer-contact-card__icon--hours{
width: 15px !important;
min-width: 15px !important;
height: 15px !important;
background-size: 15px 15px !important;
}
body .footer-custom__phone{
font-size: 15px !important;
line-height: 1.1 !important;
}
body .footer-custom__address,
body .footer-custom__email,
body .footer-custom__hours,
body .footer-custom__hours-label,
body .footer-custom__hours-title{
font-size: 12.5px !important;
line-height: 1.35 !important;
}
body .footer-custom__hours-title{
margin-bottom: 2px !important;
}
body .footer-contact-card__cta-wrap{
margin-top: 2px !important;
}
body .footer-custom__cta{
min-width: 175px !important;
height: 48px !important;
padding: 0 24px !important;
font-size: 16px !important;
}
/* === 2026-03-20 footer/header realignment fix === */
/* Move footer contact details and CTA upward so they sit tighter under the footer logo */
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card{
margin-top: 0 !important;
padding-top: 0 !important;
}
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card > .footer-custom__logo{
margin: 0 0 2px -8px !important;
}
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card > .footer-contact-card__item:first-of-type{
margin-top: -12px !important;
}
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card > .footer-contact-card__item{
margin-bottom: 9px !important;
}
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card > .footer-contact-card__cta-wrap{
margin-top: -2px !important;
padding-top: 0 !important;
}
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card > .footer-contact-card__cta-wrap .footer-custom__cta{
margin-top: 0 !important;
}
/* Move the header logo down so it sits inside the white strip */
body .header > .container .custom-logo-link{
top: -10px !important;
transform: none !important;
align-items: center !important;
padding-bottom: 0 !important;
}
body .header > .container .custom-logo-link img,
body .header .custom-logo-link img,
body .custom-logo-link img{
transform: none !important;
}
/* === 2026-03-20 footer/header adjustment pass: actual requested move-ups === */
/* Move only the footer contact rows + CTA closer to the logo */
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card{
padding-top: 0 !important;
}
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card > .footer-custom__logo{
margin-bottom: 4px !important;
}
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card > .footer-contact-card__item,
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card > .footer-contact-card__cta-wrap{
position: relative !important;
top: -28px !important;
}
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card > .footer-contact-card__item{
margin-bottom: 6px !important;
}
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card > .footer-contact-card__cta-wrap{
margin-top: -8px !important;
padding-top: 0 !important;
}
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card > .footer-contact-card__cta-wrap .footer-custom__cta{
min-width: 168px !important;
height: 42px !important;
padding: 0 22px !important;
font-size: 15px !important;
line-height: 1 !important;
}
/* Move the main header logo lower into the white strip */
body .header > .container .custom-logo-link,
body .header .custom-logo-link,
body .custom-logo-link{
top: -2px !important;
transform: none !important;
align-items: center !important;
}
body .header > .container .custom-logo-link img,
body .header .custom-logo-link img,
body .custom-logo-link img{
display: block !important;
}
/* === 2026-03-20 final footer/button/header tuning === */
/* Keep footer contact block high, but give the button proper breathing room and slimmer height */
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card > .footer-contact-card__cta-wrap{
position: relative !important;
top: -18px !important; /* slightly lower than contact rows so it no longer touches text */
margin-top: 6px !important;
padding-top: 0 !important;
}
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card > .footer-contact-card__cta-wrap .footer-custom__cta,
body .footer-custom__cta{
min-width: 168px !important;
height: 38px !important;
padding: 0 22px !important;
font-size: 15px !important;
line-height: 1 !important;
}
/* Move the main header logo a bit further down inside the white strip */
body .header > .container .custom-logo-link,
body .header .custom-logo-link,
body .custom-logo-link{
top: 6px !important;
}
/* === FINAL TUNING PASS === */
/* thinner footer button */
.footer .footer-column:first-child a,
.footer .footer-column:first-child .btn {
padding: 8px 26px !important; /* thinner */
margin-top: 20px !important;
line-height: 1.1 !important;
}
/* header logo lower again */
.site-header .logo img,
.header .logo img {
margin-top: 20px !important;
}
/* === EXTRA THIN BUTTON + LOWER LOGO === */
/* make button thinner */
.footer .footer-column:first-child a,
.footer .footer-column:first-child .btn {
padding: 6px 24px !important;
line-height: 1 !important;
}
/* push header logo further down */
.site-header .logo img,
.header .logo img {
margin-top: 26px !important;
}
/* === HARD OVERRIDE BUTTON + LOGO FIX === */
/* FORCE footer button thinner (override everything) */
.footer a,
.footer .btn,
.footer button {
padding-top: 6px !important;
padding-bottom: 6px !important;
height: auto !important;
min-height: unset !important;
line-height: 1 !important;
font-size: 16px !important;
}
/* tighten text inside button */
.footer a span,
.footer .btn span {
line-height: 1 !important;
}
/* push header logo further down (strong override) */
.site-header .logo img,
.header .logo img {
margin-top: 32px !important;
position: relative;
}
/* === FINAL ADJUSTMENT === */
/* make button slightly thicker (balanced) */
.footer a,
.footer .btn,
.footer button {
padding-top: 10px !important;
padding-bottom: 10px !important;
}
/* move header logo further down */
.site-header .logo img,
.header .logo img {
margin-top: 40px !important;
}
/* === 2026-03-20 precise footer/header correction === */
/* Slightly thicken ONLY the footer green CTA button */
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card > .footer-contact-card__cta-wrap .footer-custom__cta,
body footer.footer.footer--custom .footer-custom__cta {
height: 44px !important;
min-height: 44px !important;
padding: 0 22px !important;
line-height: 44px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 999px !important;
}
/* Move the top header logo slightly further down */
body .header > .container .custom-logo-link,
body .header .custom-logo-link {
position: relative !important;
top: 12px !important;
transform: none !important;
display: inline-flex !important;
align-items: center !important;
}
body .header > .container .custom-logo-link img,
body .header .custom-logo-link img {
margin-top: 0 !important;
position: relative !important;
top: 0 !important;
display: block !important;
}
/* === 2026-03-20 footer contact spacing + lower header logo === */
/* Make footer company-contact rows use consistent vertical spacing */
body footer.footer.footer--custom .footer-contact-card__info > * {
margin-top: 0 !important;
margin-bottom: 14px !important;
}
body footer.footer.footer--custom .footer-contact-card__info > *:last-child {
margin-bottom: 0 !important;
}
/* Normalize spacing on inner text blocks so phone/address aren't looser than others */
body footer.footer.footer--custom .footer-contact-card__info p,
body footer.footer.footer--custom .footer-contact-card__info li,
body footer.footer.footer--custom .footer-contact-card__info .footer-contact-card__row,
body footer.footer.footer--custom .footer-contact-card__info .footer-contact-card__item {
margin-top: 0 !important;
margin-bottom: 14px !important;
}
/* If rows are flex/grid items, keep icon/text vertically aligned and evenly spaced */
body footer.footer.footer--custom .footer-contact-card__info .footer-contact-card__row,
body footer.footer.footer--custom .footer-contact-card__info .footer-contact-card__item {
align-items: center !important;
gap: 14px !important;
}
/* Move top main header logo a bit lower again */
body .header > .container .custom-logo-link,
body .header .custom-logo-link,
body .site-header .custom-logo-link {
position: relative !important;
top: 18px !important;
transform: none !important;
display: inline-flex !important;
align-items: center !important;
}
body .header > .container .custom-logo-link img,
body .header .custom-logo-link img,
body .site-header .custom-logo-link img {
margin-top: 0 !important;
top: 0 !important;
position: relative !important;
display: block !important;
}
/* === 2026-03-20 exact footer contact/menu spacing + header logo fit === */
/* Make all footer contact rows use one consistent vertical rhythm */
body footer.footer.footer--custom .footer-custom__brand.footer-contact-card{
display:flex !important;
flex-direction:column !important;
}
body footer.footer.footer--custom .footer-contact-card__item{
margin:0 !important;
gap:10px !important;
align-items:flex-start !important;
}
body footer.footer.footer--custom .footer-contact-card__item + .footer-contact-card__item{
margin-top:12px !important;
}
body footer.footer.footer--custom .footer-contact-card__text,
body footer.footer.footer--custom .footer-contact-card__text > *,
body footer.footer.footer--custom .footer-contact-card__text a,
body footer.footer.footer--custom .footer-contact-card__text p{
margin-top:0 !important;
margin-bottom:0 !important;
}
body footer.footer.footer--custom .footer-contact-card__cta-wrap{
margin-top:14px !important;
}
/* Tighten footer menu columns and item spacing */
body footer.footer.footer--custom .footer-custom__menus{
gap:22px !important;
padding-top:4px !important;
}
body footer.footer.footer--custom .footer-custom__col h3{
margin:0 0 10px !important;
line-height:1.1 !important;
}
body footer.footer.footer--custom .footer-custom__col li{
margin:0 0 8px !important;
}
body footer.footer.footer--custom .footer-custom__col a{
line-height:1.15 !important;
}
/* Shrink header logo a touch and move it lower so it sits cleanly in the white strip */
body .header > .container{
min-height:8.2rem !important;
height:8.2rem !important;
}
body .header .custom-logo-link{
top:0.32rem !important;
width:16.6rem !important;
height:7.65rem !important;
}
body .header .custom-logo-link img{
width:100% !important;
height:100% !important;
object-fit:contain !important;
}
@media (max-width: 1100px){
body .header .custom-logo-link{
top:0.28rem !important;
width:14.4rem !important;
height:6.9rem !important;
}
}
/* === FINAL MICRO ADJUST === */
/* tighten footer menus more */
.footer .footer-custom__col h3{
margin-bottom:6px !important;
}
.footer .footer-custom__col li{
margin-bottom:5px !important;
}
.footer .footer-custom__col a{
line-height:1.05 !important;
}
/* move header logo slightly lower */
.header .custom-logo-link{
top:0.45rem !important;
}
/* === 2026-03-20 stronger footer menu tightening + tiny logo drop === */
/* Tighten footer menu block spacing */
body footer .footer-custom__menus,
body .footer .footer-custom__menus,
body footer .footer-menu-wrap,
body .footer .footer-menu-wrap {
row-gap: 12px !important;
column-gap: 18px !important;
}
/* Tighten footer headings */
body footer .footer-custom__col h3,
body .footer .footer-custom__col h3,
body footer .footer-widget-title,
body .footer .footer-widget-title,
body footer .widget-title,
body .footer .widget-title {
margin-top: 0 !important;
margin-bottom: 6px !important;
padding-bottom: 0 !important;
line-height: 1.05 !important;
}
/* Tighten footer menu lists and items */
body footer .footer-custom__col ul,
body .footer .footer-custom__col ul,
body footer .menu,
body .footer .menu,
body footer .widget_nav_menu ul,
body .footer .widget_nav_menu ul {
margin-top: 0 !important;
margin-bottom: 0 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
body footer .footer-custom__col li,
body .footer .footer-custom__col li,
body footer .menu li,
body .footer .menu li,
body footer .widget_nav_menu li,
body .footer .widget_nav_menu li {
margin-top: 0 !important;
margin-bottom: 4px !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
line-height: 1.05 !important;
}
body footer .footer-custom__col li:last-child,
body .footer .footer-custom__col li:last-child,
body footer .menu li:last-child,
body .footer .menu li:last-child,
body footer .widget_nav_menu li:last-child,
body .footer .widget_nav_menu li:last-child {
margin-bottom: 0 !important;
}
body footer .footer-custom__col a,
body .footer .footer-custom__col a,
body footer .menu a,
body .footer .menu a,
body footer .widget_nav_menu a,
body .footer .widget_nav_menu a {
line-height: 1.05 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
/* Move top header logo just a tiny bit lower */
body .header .custom-logo-link,
body .site-header .custom-logo-link,
body header .custom-logo-link {
top: 0.58rem !important;
}
/* === 2026-03-20 clean footer menu + header logo tune === */
/* Slightly more vertical spacing in footer menus */
body footer.footer.footer--custom .footer-custom__col h3{
margin: 0 0 8px !important;
}
body footer.footer.footer--custom .footer-custom__col li{
margin: 0 0 6px !important;
}
body footer.footer.footer--custom .footer-custom__col li:last-child{
margin-bottom: 0 !important;
}
body footer.footer.footer--custom .footer-custom__col a{
line-height: 1.12 !important;
}
/* Move top header logo down just a tiny bit more */
body .header .custom-logo-link,
body .site-header .custom-logo-link,
body header .custom-logo-link{
top: 0.68rem !important;
}
/* === 2026-03-20 targeted footer + header fixes from clean base === */
/* Footer menu columns: slightly more vertical spacing */
.footer-custom__col h3{
margin:0 0 12px !important;
}
.footer-custom__col li{
margin:0 0 10px !important;
}
.footer-custom__col li:last-child{
margin-bottom:0 !important;
}
.footer-custom__col a{
line-height:1.22 !important;
}
/* Phone icon/text alignment in footer */
.footer-contact-card__item{
align-items:center !important;
}
.footer-contact-card__icon{
align-self:center !important;
}
.footer-custom__phone{
display:inline-block !important;
line-height:1.08 !important;
}
/* Move top header logo down a tiny bit without changing its size */
.header .custom-logo-link{
transform:translateY(4px) !important;
}
.header .custom-logo-link img{
width:196px !important;
height:auto !important;
}
/* === 2026-03-20 actual footer menu spacing + logo drop fix === */
/* Footer menus: force slightly MORE vertical spacing between links */
.footer-custom__col ul{
display:flex !important;
flex-direction:column !important;
gap:18px !important;
}
.footer-custom__col li{
margin:0 !important;
}
.footer-custom__col h3{
margin:0 0 14px !important;
}
/* Top header logo: move the IMAGE down slightly without changing its size */
.header .custom-logo-link img{
width:196px !important;
height:auto !important;
transform:translateY(8px) !important;
}
.header .custom-logo-link{
padding-bottom:0 !important;
}
/* === micro logo adjustment === */
.header .custom-logo-link img{
transform: translateY(12px) !important; /* was 8px */
}
/* === final tiny logo drop === */
.header .custom-logo-link img{
transform: translateY(14px) !important; /* small extra drop */
}
/* === 2026-03-20 tiny extra logo drop === */
.header .custom-logo-link img{
transform: translateY(16px) !important;
}
/* === STRONG LOGO DROP === */
.header .custom-logo-link img{
transform: translateY(22px) !important;
}
/* === FIX TOP HEADER LOGO: MOVE LOWER FOR REAL === */
.header .custom-logo-link{
position: relative !important;
top: 14px !important;
transform: none !important;
}
.header .custom-logo-link img{
position: relative !important;
top: 0 !important;
transform: none !important;
}
/* === 2026-03-20 SAFE HEADER LOGO REPAIR === */
/* Reset broken logo movement rules without changing size */
html body .header .custom-logo-link,
html body header .custom-logo-link,
html body .site-header .custom-logo-link{
position: static !important;
top: auto !important;
left: auto !important;
transform: none !important;
margin: 0 !important;
padding: 0 !important;
display: flex !important;
align-items: center !important;
height: 100% !important;
}
html body .header .custom-logo-link img,
html body header .custom-logo-link img,
html body .site-header .custom-logo-link img{
position: static !important;
top: auto !important;
left: auto !important;
transform: none !important;
margin-top: 4px !important; /* safe small downward nudge */
margin-bottom: 0 !important;
width: auto !important;
height: auto !important;
max-width: 100% !important;
max-height: none !important;
object-fit: contain !important;
}
/* === REAL ABOUT HERO MEDIA FIX === */
.about-hero__art{
transform: translateY(-36px) !important;
}
.about-hero__circle,
.about-hero__ring{
transform: translateY(-36px) !important;
}
.about-hero__person{
transform: translateY(-36px) scale(1.18) !important;
transform-origin: center bottom !important;
}
.about-hero__image,
.about-hero__media img,
.about-hero__person img{
max-width: none !important;
}
/* keep media centered while upsizing */
.about-hero__media{
overflow: visible !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
}
/* === FINAL CLEAN FADE (PROPER BLEND) === */
.about-hero__visual{
position: relative !important;
overflow: hidden !important;
}
.about-hero__visual::after{
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 160px;
background: linear-gradient(
to bottom,
rgba(245,245,245,0) 0%,
rgba(245,245,245,0.3) 40%,
rgba(245,245,245,0.8) 70%,
#f5f5f5 100%
);
pointer-events: none;
z-index: 3;
}
.about-hero__worker{
position: relative !important;
z-index: 1;
}
/* === RESTORE LARGE WORKER SIZE (KEEP FADE) === */
.about-hero__worker{
width: 145% !important;
max-width: none !important;
transform: translateY(-10px) !important;
position: relative !important;
z-index: 1;
}
/* === CENTER WORKER IMAGE PROPERLY === */
.about-hero__visual{
display:flex !important;
justify-content:center !important;
align-items:flex-end !important;
}
.about-hero__worker{
width:145% !important;
max-width:none !important;
transform:translateY(-10px) !important;
left:0 !important;
right:0 !important;
margin:0 auto !important;
display:block !important;
}
/* prevent clipping */
.about-hero__visual{
overflow:visible !important;
}
/* === FINAL SIZE TWEAK === */
.about-hero__worker{
width:155% !important;
}
/* === service + industry pages: exact same sticky clone behavior as main pages === */
/* disable the global clone on these pages only */
body.service-industry-main-sticky .sticky-specialist-bar{
display: none !important;
}
/* page-specific clone using the same main-page styles */
body.service-industry-main-sticky .sticky-specialist-bar-copy{
position: fixed !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
z-index: 3000 !important;
display: none !important;
background: transparent !important;
overflow: hidden !important;
}
body.service-industry-main-sticky .sticky-specialist-bar-copy::before{
content: "" !important;
position: absolute !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
height: auto !important;
background: #243a80 !important;
z-index: 0 !important;
}
body.service-industry-main-sticky .sticky-specialist-bar-copy.is-visible{
display: block !important;
}
body.service-industry-main-sticky .sticky-specialist-bar-copy .header__sticky{
position: relative !important;
z-index: 1 !important;
width: 100% !important;
margin: 0 !important;
}
body.service-industry-main-sticky .sticky-specialist-bar-copy .top-specialist-callout{
text-decoration: none !important;
}
@media (max-width: 1100px){
body.service-industry-main-sticky .sticky-specialist-bar-copy::before{
top: 0 !important;
bottom: 0 !important;
height: auto !important;
}
}
/* keep original in-page top bar normal on these pages */
body.service-industry-main-sticky .header > .container{
position: relative !important;
}
body.service-industry-main-sticky .header .header__sticky{
background: transparent !important;
box-shadow: none !important;
}
/* Grease Trap Cleaning sticky header: keep only the original blue bar height */
body.grease-trap-sticky-trim .sticky-specialist-bar-copy{
height: 4.1rem !important;
min-height: 4.1rem !important;
max-height: 4.1rem !important;
overflow: hidden !important;
}
body.grease-trap-sticky-trim .sticky-specialist-bar-copy::before{
top: 0 !important;
bottom: auto !important;
height: 4.1rem !important;
}
body.grease-trap-sticky-trim .sticky-specialist-bar-copy .header__sticky{
height: 4.1rem !important;
min-height: 4.1rem !important;
max-height: 4.1rem !important;
overflow: hidden !important;
display: flex !important;
align-items: center !important;
}
@media (max-width: 1100px){
body.grease-trap-sticky-trim .sticky-specialist-bar-copy{
height: 3.5rem !important;
min-height: 3.5rem !important;
max-height: 3.5rem !important;
}
body.grease-trap-sticky-trim .sticky-specialist-bar-copy::before,
body.grease-trap-sticky-trim .sticky-specialist-bar-copy .header__sticky{
height: 3.5rem !important;
min-height: 3.5rem !important;
max-height: 3.5rem !important;
}
}
/* Blog Post Page */
.blog-post-hero-custom {
padding-top: 24px;
padding-bottom: 20px;
}
.blog-post-hero-custom__shell {
position: relative;
min-height: 360px;
border-radius: 24px;
overflow: hidden;
background: #d9d9d9;
}
.blog-post-hero-custom__media,
.blog-post-hero-custom__media img {
width: 100%;
height: 100%;
}
.blog-post-hero-custom__media {
position: absolute;
inset: 0;
}
.blog-post-hero-custom__media img {
object-fit: cover;
display: block;
}
.blog-post-hero-custom__overlay {
position: absolute;
left: 0;
right: 34%;
bottom: 24px;
background: rgba(255,255,255,0.82);
padding: 24px 34px;
backdrop-filter: blur(3px);
}
.blog-post-hero-custom__eyebrow {
margin: 0 0 10px;
color: #1e3a8a;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .08em;
font-size: 13px;
}
.blog-post-hero-custom__title {
margin: 0;
color: #3d3d3d;
font-size: clamp(28px, 4vw, 52px);
line-height: 1.02;
font-weight: 800;
max-width: 640px;
}
.blog-post-hero-custom__meta {
margin: 14px 0 0;
color: #555;
font-size: 15px;
}
.blog-post-article {
padding-top: 8px;
padding-bottom: 70px;
}
.blog-post-article__wrap {
display: block;
}
.blog-post-article__content {
background: #fff;
border-radius: 24px;
padding: 30px 34px;
box-shadow: 0 10px 30px rgba(0,0,0,.06);
max-width: none;
width: 100%;
}
.blog-post-article__content p {
margin: 0 0 16px;
font-size: 17px;
line-height: 1.65;
color: #474747;
}
.blog-post-article__content h2 {
margin: 28px 0 10px;
font-size: clamp(22px, 2.2vw, 30px);
line-height: 1.18;
color: #0f172a;
}
.blog-post-article__list {
margin: 0 0 18px 22px;
padding: 0;
color: #474747;
}
.blog-post-article__list li {
margin: 0 0 10px;
font-size: 17px;
line-height: 1.65;
}
.blog-post-article__sidebar,
.blog-post-cta-card {
display: none !important;
}
@media (max-width: 991px) {
.blog-post-hero-custom__shell { min-height: 320px; }
.blog-post-hero-custom__overlay { right: 12%; padding: 22px 22px; }
}
@media (max-width: 640px) {
.blog-post-hero-custom { padding-top: 18px; }
.blog-post-hero-custom__shell { min-height: 280px; border-radius: 18px; }
.blog-post-hero-custom__overlay { right: 0; bottom: 0; padding: 18px 16px; }
.blog-post-hero-custom__title { font-size: clamp(24px, 9vw, 38px); }
.blog-post-article__content { padding: 22px 18px; border-radius: 18px; }
.blog-post-article__content p { font-size: 16px; }
.blog-post-article__content h2 { font-size: 22px; }
.blog-post-article__list li { font-size: 16px; }
}
/* Deployment fixes: remove top notice bar, remove sticky white line, improve image rendering */
.notice-bar,
.notice-bar-placeholder,
.notice-bar__wrap {
display: none !important;
}
html,
body {
padding-top: 0 !important;
margin-top: 0 !important;
}
body.admin-bar .header,
.header,
.header__row,
.header__sticky,
.header__sticky.active {
border-top: 0 !important;
}
.header__row::before,
.header__row::after,
.header__sticky::before,
.header__sticky::after,
.header__sticky.active::before,
.header__sticky.active::after {
content: none !important;
display: none !important;
border: 0 !important;
box-shadow: none !important;
background: transparent !important;
}
.header,
.header__sticky.active {
box-shadow: none !important;
}
img {
height: auto;
}
/* Netlify top-bar/sticky-header hard fix */
.notice-bar, .notice-bar-placeholder, .notice-bar__wrap, .notice-bar__info, .notice-bar__close {
display: none !important;
visibility: hidden !important;
height: 0 !important;
min-height: 0 !important;
max-height: 0 !important;
overflow: hidden !important;
}
html.hide-notice-bar .header,
html:has(.notice-bar) .header,
body.admin-bar .header,
.header {
top: 0 !important;
margin-top: 0 !important;
}
html:has(.notice-bar) main,
html.hide-notice-bar main,
main {
padding-top: 0 !important;
}
.header__row, .header__sticky, .header__sticky.active {
border-top: 0 !important;
box-shadow: none !important;
}
.header__row::before,
.header__row::after,
.header__sticky::before,
.header__sticky::after,
.header__sticky.active::before,
.header__sticky.active::after {
content: none !important;
display: none !important;
border: 0 !important;
box-shadow: none !important;
background: transparent !important;
}
/* ===== 2026-03-24 mobile optimization pass ===== */
@media (max-width: 991px){
html, body{
overflow-x: hidden !important;
}
*, *::before, *::after{
box-sizing: border-box;
}
img, video, iframe{
max-width: 100% !important;
height: auto !important;
}
.container,
.header > .container,
.header__row .container,
.promo__container,
.service-intro .container,
.service-estimate .container,
.about-hero .container,
.footer--custom .container{
width: calc(100% - 24px) !important;
max-width: none !important;
margin-left: auto !important;
margin-right: auto !important;
}
.section,
.service-process,
.service-industries,
.service-cta-block,
.about-hero,
.service-intro,
.service-estimate,
.reviews-section,
.footer--custom{
padding-left: 0 !important;
padding-right: 0 !important;
}
.promo,
.service-intro,
.service-process,
.service-industries,
.service-cta-block,
.about-hero,
.gallery-page,
.reviews-section,
.footer--custom{
overflow: hidden !important;
}
.promo__title,
.about-hero__title,
.service-intro__title,
.service-section-heading__title,
.section__title,
h1{
font-size: clamp(28px, 8vw, 40px) !important;
line-height: 1.08 !important;
word-break: normal !important;
overflow-wrap: anywhere !important;
}
h2{
font-size: clamp(24px, 7vw, 34px) !important;
line-height: 1.12 !important;
overflow-wrap: anywhere !important;
}
h3{
font-size: clamp(20px, 6vw, 28px) !important;
line-height: 1.18 !important;
}
.promo__title br,
.about-hero__title br,
.service-intro__title br,
.service-section-heading__title br{
display: none !important;
}
.promo__container,
.service-intro__wrap,
.about-hero__wrap,
.footer-custom__inner,
.footer-custom__menus,
.footer-menu-wrap,
.blog-header,
.whyhire__grid,
.service-estimate__grid,
.gallery-grid,
.blog-grid{
display: grid !important;
grid-template-columns: 1fr !important;
gap: 18px !important;
}
.promo__info,
.promo__img--form,
.service-intro__text,
.service-intro__media,
.about-hero__text,
.about-hero__visual,
.footer-custom__brand,
.footer-contact-card,
.footer-custom__col,
.footer-menu-wrap > *,
.blog-header__left,
.blog-header__right{
width: 100% !important;
max-width: none !important;
min-width: 0 !important;
}
.promo__container{
gap: 20px !important;
}
.promo__img--form{
min-height: 0 !important;
max-width: none !important;
padding: 18px !important;
border-radius: 24px !important;
justify-content: stretch !important;
}
.hero-form,
.service-estimate__card,
.footer-contact-card{
width: 100% !important;
max-width: none !important;
}
.hero-form{
padding: 18px 16px 16px !important;
border-radius: 20px !important;
}
.hero-form__title,
.service-estimate__title{
font-size: clamp(24px, 7vw, 34px) !important;
line-height: 1.1 !important;
}
.hero-form__input,
.hero-form__select,
.service-estimate__field input,
.service-estimate__field select,
.service-estimate__field textarea,
.contact-form input,
.contact-form select,
.contact-form textarea{
width: 100% !important;
max-width: 100% !important;
min-width: 0 !important;
}
.hero-form__submit,
.service-estimate__submit,
.btn,
.about-hero__call,
.book-now-btn{
width: 100% !important;
min-width: 0 !important;
}
.service-estimate__card{
padding: 22px 18px !important;
border-radius: 22px !important;
}
.service-estimate__badge{
margin: 0 0 18px !important;
padding: 12px 18px !important;
font-size: 16px !important;
border-radius: 16px !important;
}
.service-estimate__grid{
align-items: stretch !important;
}
.service-estimate__field span{
margin-bottom: 8px !important;
}
.service-intro__wrap,
.about-hero__wrap{
gap: 24px !important;
}
.about-hero__visual,
.service-intro__media,
.whyhire__media{
min-height: 0 !important;
justify-content: center !important;
align-items: center !important;
}
.about-hero__worker,
.service-intro__media img,
.whyhire__media img,
.promo__img img{
width: min(100%, 420px) !important;
max-width: 100% !important;
height: auto !important;
margin-left: auto !important;
margin-right: auto !important;
}
.footer-custom__inner,
.footer-custom__menus{
gap: 24px !important;
}
.footer-custom__brand,
.footer-contact-card{
flex: none !important;
}
.gallery-grid,
.blog-grid,
.services-grid{
grid-template-columns: 1fr !important;
}
.gallery-card,
.blog-card,
.service-card,
.reviewcard,
.faq__item,
.logocard{
border-radius: 20px !important;
}
.header{
background: #fff !important;
}
.header > .container{
display: flex !important;
flex-direction: column !important;
align-items: stretch !important;
height: auto !important;
min-height: 0 !important;
padding: 12px 0 10px !important;
}
.header > .container::before{
left: 0 !important;
right: 0 !important;
height: 48px !important;
}
.header .custom-logo-link,
.custom-logo-link{
position: relative !important;
top: 0 !important;
left: 0 !important;
width: 172px !important;
height: auto !important;
margin: 0 auto 10px !important;
transform: none !important;
}
.header .custom-logo-link img,
.custom-logo-link img{
width: 172px !important;
height: auto !important;
}
.header__sticky{
position: relative !important;
top: auto !important;
left: auto !important;
right: auto !important;
width: 100% !important;
height: auto !important;
min-height: 0 !important;
display: flex !important;
flex-direction: column !important;
gap: 10px !important;
padding: 0 0 12px !important;
margin: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
.top-specialist-callout,
.header__sticky .top-specialist-callout{
position: relative !important;
right: auto !important;
top: auto !important;
width: 100% !important;
min-height: 48px !important;
padding: 12px 14px !important;
margin: 0 !important;
border-radius: 16px !important;
justify-content: center !important;
text-align: center !important;
}
.top-specialist-callout__label,
.top-specialist-callout__phone{
font-size: 14px !important;
line-height: 1.2 !important;
}
.header__btn,
.header__btn.btn,
.header__btn.btn-t,
.header__btn.btn-transparent-dark,
.book-now-btn{
position: relative !important;
right: auto !important;
top: auto !important;
width: 100% !important;
height: 50px !important;
min-width: 0 !important;
margin: 0 !important;
padding: 0 18px !important;
border-radius: 16px !important;
font-size: 16px !important;
}
.header__row{
overflow: visible !important;
}
.header__row .container{
display: block !important;
width: calc(100% - 24px) !important;
}
.header__row .header__menu.long{
width: 100% !important;
}
.header__row .main-menu-list{
display: flex !important;
flex-wrap: nowrap !important;
overflow-x: auto !important;
gap: 10px !important;
padding: 0 0 10px !important;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
}
.header__row .main-menu-list::-webkit-scrollbar{
display: none;
}
.header__row .main-menu-item,
.header__find-wrap{
flex: 0 0 auto !important;
}
.header__row .main-menu-link,
.header__row .header__find{
min-width: 0 !important;
min-height: 44px !important;
height: auto !important;
padding: 12px 16px !important;
border-radius: 999px !important;
white-space: nowrap !important;
font-size: 14px !important;
line-height: 1.2 !important;
}
.header__row .header__find-wrap{
display: block !important;
padding-bottom: 10px !important;
}
.header__row .sub-menu-list,
.header__row .header__find-wrap .toronto-dropdown{
position: static !important;
width: 100% !important;
min-width: 0 !important;
max-width: none !important;
margin-top: 10px !important;
border-radius: 18px !important;
}
.header__row .sub-menu-link,
.header__row .header__find-wrap .toronto-dropdown .sub-menu-link{
font-size: 16px !important;
padding: 14px 16px !important;
}
}
@media (max-width: 640px){
.container,
.header > .container,
.header__row .container{
width: calc(100% - 18px) !important;
}
.promo__title,
.about-hero__title,
.service-intro__title,
.service-section-heading__title,
h1{
font-size: clamp(26px, 9vw, 34px) !important;
}
h2,
.hero-form__title,
.service-estimate__title{
font-size: clamp(22px, 8vw, 30px) !important;
}
.promo__text ul li,
.service-intro__text,
.about-hero__lead p,
.section__sub,
.blog-card__body p,
.gallery-card__body p{
font-size: 15px !important;
line-height: 1.5 !important;
}
.hero-form,
.service-estimate__card{
padding: 16px 14px !important;
}
.header .custom-logo-link,
.custom-logo-link,
.header .custom-logo-link img,
.custom-logo-link img{
width: 150px !important;
}
}
/* ===== 2026-03-24 targeted mobile cleanup ===== */
@media (max-width: 767px){
html, body{
overflow-x:hidden !important;
}
img, svg, video{
max-width:100% !important;
height:auto !important;
}
body,
body.has-fixed-specialist-bar .header,
body.has-sticky-specialist-bar .header{
padding-top:0 !important;
}
.container{
width:min(100% - 24px, 1180px) !important;
margin-left:auto !important;
margin-right:auto !important;
}
.header{
background:#fff !important;
}
.header > .container{
display:flex !important;
flex-wrap:wrap !important;
align-items:center !important;
justify-content:center !important;
min-height:auto !important;
height:auto !important;
padding:0 !important;
overflow:visible !important;
}
.header > .container::before{
content:none !important;
}
.header .custom-logo-link{
position:relative !important;
left:auto !important;
top:auto !important;
flex:0 0 100% !important;
width:100% !important;
height:auto !important;
margin:0 auto 8px !important;
padding:10px 0 0 !important;
display:flex !important;
justify-content:center !important;
align-items:center !important;
background:#fff !important;
}
.header .custom-logo-link img{
width:160px !important;
max-width:70vw !important;
height:auto !important;
object-fit:contain !important;
}
.header__sticky{
position:relative !important;
top:auto !important;
right:auto !important;
left:auto !important;
width:100% !important;
min-height:auto !important;
height:auto !important;
margin:0 !important;
padding:10px 12px !important;
display:flex !important;
flex-wrap:wrap !important;
align-items:center !important;
justify-content:center !important;
gap:10px !important;
background:#2d4fa3 !important;
border-radius:0 0 18px 18px !important;
z-index:20 !important;
box-shadow:none !important;
}
.header__sticky::before,
.header__sticky::after{
content:none !important;
display:none !important;
}
.top-specialist-callout{
position:static !important;
right:auto !important;
left:auto !important;
display:flex !important;
flex-wrap:wrap !important;
justify-content:center !important;
align-items:center !important;
gap:6px !important;
width:100% !important;
text-align:center !important;
margin:0 !important;
color:#fff !important;
}
.top-specialist-callout__label{
font-size:14px !important;
line-height:1.2 !important;
}
.top-specialist-callout__phone{
font-size:24px !important;
line-height:1.1 !important;
}
.header__btn,
.header__btn.btn,
.header__btn.btn-t,
.header__btn.btn-transparent-dark,
.book-now-btn{
width:auto !important;
min-width:0 !important;
height:48px !important;
margin:0 auto !important;
padding:0 24px !important;
border-radius:999px !important;
font-size:20px !important;
font-style:normal !important;
}
.header__row{
padding:10px 0 0 !important;
}
.header__row .container{
display:block !important;
width:min(100% - 24px, 1180px) !important;
overflow-x:auto !important;
white-space:nowrap !important;
-webkit-overflow-scrolling:touch !important;
padding-bottom:8px !important;
}
.header__menu.long,
.header__menu.long .main-menu-list{
display:flex !important;
flex-wrap:nowrap !important;
gap:14px !important;
white-space:nowrap !important;
}
.header__menu.long .main-menu-list{
padding-right:12px !important;
}
.header__menu.long .main-menu-item{
flex:0 0 auto !important;
}
.header__find-wrap{
display:inline-flex !important;
vertical-align:top !important;
margin-left:12px !important;
}
.header__find{
min-height:42px !important;
padding:0 16px !important;
border-radius:999px !important;
}
.promo__container,
.service-intro__wrap,
.about-hero__wrap,
.footer-custom__inner,
.footer-custom__menus,
.footer-menu-wrap,
.whyhire__grid,
.blog-header,
.gallery-grid,
.blog-grid{
display:grid !important;
grid-template-columns:1fr !important;
gap:18px !important;
}
.promo__img--form,
.service-intro__media,
.about-hero__visual,
.whyhire__media{
min-height:0 !important;
padding:14px !important;
}
.promo__img--form{
border-radius:24px !important;
}
.promo__title,
.service-intro__title,
.about-hero__title,
h1{
font-size:34px !important;
line-height:1.08 !important;
}
.service-section-heading__title,
h2,
.section__title{
font-size:28px !important;
line-height:1.12 !important;
}
.promo__title br,
.service-intro__title br,
.about-hero__title br{
display:none !important;
}
.hero-form{
width:100% !important;
max-width:none !important;
padding:16px !important;
border-radius:20px !important;
}
.hero-form::before{
inset:-8px !important;
border-radius:28px !important;
}
.hero-form__title{
font-size:18px !important;
}
.hero-form__input,
.hero-form__select,
.service-estimate__field input,
.contact-form input,
.contact-form select,
.contact-form textarea{
width:100% !important;
font-size:16px !important;
}
.service-estimate{
padding:0 0 24px !important;
}
.service-estimate__card{
padding:18px 16px !important;
border-radius:20px !important;
}
.service-estimate__title{
font-size:22px !important;
margin-bottom:14px !important;
}
.service-estimate__grid{
grid-template-columns:1fr !important;
gap:12px !important;
}
.service-estimate__submit,
.service-estimate button[type="submit"]{
width:100% !important;
min-width:0 !important;
}
.footer--custom .container,
.footer-custom__brand,
.footer-contact-card,
.footer-custom__col{
width:100% !important;
max-width:none !important;
}
}