/* Contact page ([steel_contact]). Homepage colours and Montserrat, light (no dark sections):
   big heavy heading, the number and a real job photo on the left, the form on a white card on the right. */
.sc-page{--navy:#0d1b30;--b:#0b4a9e;--b2:#083a7e;--bolt:#377dee;--go:#22c55e;--line:#e3e7ed;--txt:#2e3b4e;--dim:#b8c3d3;font-family:Montserrat,"Helvetica Neue",Arial,sans-serif;color:var(--txt);font-size:16px;line-height:1.6}
.page:not(.home) [data-elementor-type=wp-post]>.elementor-top-section:has(.sc-page) .elementor-element-populated{padding:0!important;margin:0!important}
/* undo site.css's inner-page banner tint and boxed width: this page draws its own */
.page:not(.home) [data-elementor-type=wp-post]>.elementor-top-section:first-child:has(.sc-page){box-shadow:none!important;min-height:0!important;padding:0!important;margin:0!important}
.page:not(.home) [data-elementor-type=wp-post]>.elementor-top-section:has(.sc-page)>.elementor-container{max-width:none!important;padding:0!important}
.sc-page *{box-sizing:border-box}
.sc-page h1,.sc-page h2{font-family:inherit;letter-spacing:0;color:var(--navy);font-weight:600;margin:0}
.sc-page p{margin:0}
.sc-wrap{max-width:1140px;margin:0 auto;padding:0 20px}

/* ---------- top: light. Heading, number, photo on the left; the form on a white card on the right ---------- */
.sc-main{background:#f3f6fa;padding:56px 0 64px}
.sc-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,470px);grid-template-areas:"head form" "call form" "pic form";grid-template-rows:auto auto 1fr;gap:0 64px;align-items:start}
.sc-head{grid-area:head}
.sc-form{grid-area:form}
.sc-call{grid-area:call}
.sc-page .sc-pic{grid-area:pic;position:relative;margin:28px 0 0;align-self:stretch;min-height:200px}
/* the photo fills whatever height is left beside the form, so the two columns end level */
.sc-page .sc-pic img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;border-radius:4px}
@keyframes sp-open{from{clip-path:inset(0 50% 0 50%)}to{clip-path:inset(0 0 0 0)}} /* same opening as the other pages' headers */
.sc-main{animation:sp-open .6s cubic-bezier(.86,0,.07,1) both}
@keyframes sc-rise{from{opacity:0;transform:translateY(28px)}}
.sc-head,.sc-form,.sc-call,.sc-pic{animation:sc-rise .5s cubic-bezier(.2,.8,.2,1) both}
.sc-head{animation-delay:.22s}.sc-form{animation-delay:.3s}.sc-call{animation-delay:.38s}.sc-pic{animation-delay:.46s}
@keyframes sc-door-l{to{transform:translateX(-101%)}}
@keyframes sc-door-r{to{transform:translateX(101%)}}
@media (max-width:860px){ /* phones: blue panels slide apart instead of the clip (see pages.css) */
.sc-main{animation:none;position:relative;overflow:hidden}
.sc-main::before,.sc-main::after{content:"";position:absolute;top:0;bottom:0;width:50.5%;background:var(--b);z-index:5;pointer-events:none;animation:sc-door-l .6s cubic-bezier(.86,0,.07,1) .05s both}
.sc-main::before{left:0}
.sc-main::after{right:0;animation-name:sc-door-r}
}
.sc-page .sc-main h1{color:var(--navy);font-size:60px;line-height:1.02;font-weight:800;letter-spacing:-.02em;margin-bottom:14px}
.sc-head p{color:#4a5a70;font-size:18px;max-width:30em}
.sc-call{padding:28px 0}
.sc-call .sc-k{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--b)}
.sc-page .sc-num{display:block;color:var(--navy);font-size:48px;font-weight:800;line-height:1.1;letter-spacing:-.01em;text-decoration:none;font-variant-numeric:tabular-nums;white-space:nowrap;margin:2px 0 6px}
.sc-call p:not(.sc-k){color:#4a5a70}
.sc-page .sc-mail{color:var(--b);font-weight:600;overflow-wrap:anywhere}
.sc-page .sc-mail:hover,.sc-page .sc-num:hover{color:var(--b2)}

/* the form on a white card */
.sc-form{background:#fff;border-radius:4px;padding:32px;box-shadow:0 20px 50px rgba(13,27,48,.12);border:1px solid #e3e8ef}
.sc-form .wpforms-container{margin:0!important;max-width:none!important}
.sc-form .wpforms-field{padding:0 0 16px!important}
.sc-form .wpforms-field-label.wpforms-label-hide{position:static!important;clip:auto!important;width:auto!important;height:auto!important;overflow:visible!important;margin:0!important}
.sc-form .wpforms-field-label{display:block!important;font-size:14px!important;font-weight:600!important;color:var(--navy)!important;margin:0 0 6px!important;padding:0!important}
.sc-form .wpforms-required-label{display:none}
.sc-main .sc-form .wpforms-form input,.sc-main .sc-form .wpforms-form textarea{width:100%!important;max-width:100%!important;min-height:50px;background:#f7f9fc!important;border:1px solid #c9d2de!important;border-radius:4px!important;font-family:inherit!important;font-size:16px!important;color:var(--txt)!important;padding:12px 14px!important}
.sc-main .sc-form .wpforms-form ::placeholder{color:transparent!important}
.sc-main .sc-form .wpforms-form textarea{min-height:110px!important;height:110px!important}
.sc-main .sc-form .wpforms-form input:focus,.sc-main .sc-form .wpforms-form textarea:focus{background:#fff!important;border-color:var(--b)!important;box-shadow:0 0 0 3px rgba(11,74,158,.18)!important;outline:0}
.sc-form .wpforms-error{font-size:14px!important;font-weight:600!important;color:#b42318!important;margin-top:6px!important}
.sc-main .sc-form .wpforms-form input.wpforms-error,.sc-main .sc-form .wpforms-form textarea.wpforms-error{border:2px solid #b42318!important}
.sc-form .wpforms-submit-container{padding:6px 0 0!important}
.sc-form .wpforms-submit{width:100%!important;min-height:58px;font-size:18px!important;font-weight:800!important;border-radius:4px!important;border:0!important;background:var(--b)!important;color:#fff!important;text-transform:none!important;font-family:inherit!important;transition:background .2s,transform .2s}
.sc-form .wpforms-submit:hover{background:var(--b2)!important;transform:translateY(-1px)}
.sc-form .wpforms-confirmation-container-full{background:#f0fdf4!important;border:2px solid var(--go)!important;color:var(--navy)!important;border-radius:4px;font-size:18px;font-weight:600;padding:22px!important}

/* ---------- logos and reviews ---------- */
.sc-logos{border-bottom:1px solid var(--line);padding:30px 0}
.sc-logos .sc-wrap{display:flex;flex-wrap:wrap;justify-content:space-around;align-items:center;gap:24px}
.sc-logos img{max-height:64px;width:auto;mix-blend-mode:multiply}
/* its image has wide white margins: this makes its NICEIC wordmark the same size as the Approved Contractor one */
.sc-logos img[alt="NICEIC Domestic Installer"]{max-height:108px;margin:-22px 0}
.sc-reviews{padding:56px 0}
.sc-reviews h2{font-size:28px;margin-bottom:8px}
.sc-reviews .sb-feed-header-heading{display:none!important}
.sc-reviews .sb-feed-header{margin-bottom:10px!important}

.sc-gallery{background:#f3f6fa;padding:64px 0 72px}
.sc-gal-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:22px}
.sc-gallery h2{font-size:34px;font-weight:800;letter-spacing:-.01em}
.sc-gal-head a{color:var(--b);font-weight:700;text-decoration:none;white-space:nowrap}
.sc-gal-head a:hover{color:var(--b2)}

/* ---------- smaller screens: heading, form, then the number ---------- */
@media (max-width:1000px){.sc-grid{gap:0 40px;grid-template-columns:minmax(0,1fr) minmax(0,420px)}.sc-page .sc-main h1{font-size:48px}.sc-page .sc-num{font-size:40px}}
@media (max-width:820px){
.sc-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "form" "call" "pic";grid-template-rows:none}
.sc-head{margin-bottom:24px}
.sc-page .sc-pic{min-height:0}.sc-page .sc-pic img{position:static;aspect-ratio:16/9;height:auto}
}
@media (max-width:767px){
.sc-main{padding:28px 0 40px}
.sc-wrap{padding:0 16px}
.sc-form{padding:20px 16px;border-radius:4px}.sc-page .sc-pic img{border-radius:4px}
.sc-page .sc-main h1{font-size:38px;margin-bottom:10px}
.sc-head{margin-bottom:18px}.sc-head p{font-size:16px}
.sc-call{padding-top:32px}
.sc-page .sc-num{font-size:36px}
.sc-logos .sc-wrap{gap:18px;justify-content:center}.sc-logos img{max-height:40px}.sc-logos img[alt="NICEIC Domestic Installer"]{max-height:68px;margin:-14px 0}
.sc-reviews{padding:40px 0}
.sc-reviews h2{font-size:24px}
.sc-gallery{padding:40px 0 48px}.sc-gallery h2{font-size:26px}
.sc-gal-head{flex-direction:column;align-items:flex-start;gap:2px;margin-bottom:16px}
}
@media (prefers-reduced-motion:reduce){.sc-main,.sc-head,.sc-form,.sc-call,.sc-pic{animation:none}.sc-main::before,.sc-main::after{display:none}.sc-form .wpforms-submit,.sc-page .sc-gal img,.sc-gal span{transition:none}}

/* ======================================================================================================
   Prolec look (owner's pick, 2026-11-10): navy header area, caps title, form on a white card with a blue top
   edge, number in white, the blue arc underneath. The form still comes first (Google Ads traffic).
   ====================================================================================================== */
.sc-page{--navy:#040b18;--b:#1a8fe8;--b2:#0b5bd3;--sky:#29c5f6}
.sc-main{position:relative;overflow:hidden;background:var(--navy);padding:64px 0 150px;--arc-bg:#fff}
.sc-main .sc-wrap{position:relative;z-index:3}
.sc-page .sc-main h1{color:#fff;text-transform:uppercase;letter-spacing:.04em;font-size:52px}
.sc-head p,.sc-call p:not(.sc-k){color:#c9d3e2}
.sc-call .sc-k{color:var(--sky);font-weight:800}
.sc-page .sc-num{color:#fff}
.sc-page .sc-num:hover,.sc-page .sc-mail:hover{color:var(--sky)}
.sc-page .sc-mail{color:var(--sky)}
.sc-page .sc-pic img{border-radius:28px}
.sc-form{border-top:4px solid var(--b);border-radius:6px;box-shadow:0 24px 60px rgba(0,0,0,.4)}
.sc-form .wpforms-field-label{text-transform:uppercase!important;letter-spacing:.06em!important;font-size:12px!important;font-weight:800!important}
.sc-form .wpforms-submit{border-radius:99px!important;text-transform:uppercase!important;letter-spacing:.06em!important;font-size:16px!important}
.sc-page h2{text-transform:uppercase;letter-spacing:.04em;font-weight:800}
.sc-gallery{background:#eaf4fd}
.sc-gal-head a{color:var(--b2)}
@media (max-width:860px){.sc-main::before,.sc-main::after{z-index:6}}
@media (max-width:767px){.sc-main{padding:28px 0 120px}.sc-page .sc-main h1{font-size:34px}}