
/* Brand color only; template typography, geometry and spacing are retained. */
:root{--mcrae-green:#157d3e} html{scroll-behavior:smooth}
img{color:transparent} a[href^="tel:"],a[href^="https://wa.me/"]{cursor:pointer}
[data-mcrae-reveal]{transition:opacity .6s ease,transform .6s ease}
[data-mcrae-reveal].mcrae-wait{opacity:0;transform:translateY(18px)}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

.mcrae-detail{background:#f6f4ed;color:#14251a;padding:130px 28px 110px;font-family:"Plus Jakarta Sans",Inter,sans-serif}
.mcrae-detail-wrap{max-width:1320px;margin:auto}.mcrae-kicker{font:700 12px Inter,sans-serif;letter-spacing:.18em;color:#157d3e;text-transform:uppercase;margin-bottom:25px}
.mcrae-detail h1{font-family:"Plus Jakarta Sans",sans-serif;font-size:clamp(52px,7.5vw,116px);letter-spacing:-.075em;line-height:.98;max-width:1100px;margin:0 0 32px;color:#14251a}
.mcrae-detail h2{font-family:"Plus Jakarta Sans",sans-serif;font-size:clamp(38px,4vw,66px);letter-spacing:-.065em;line-height:1.05;margin:0 0 20px}
.mcrae-lead{font:400 clamp(20px,2vw,30px)/1.45 Inter,sans-serif;max-width:810px;color:#4f4f51;margin:0 0 34px}
.mcrae-detail-actions{display:flex;gap:12px;flex-wrap:wrap;margin:0 0 54px}.mcrae-detail-actions a,.mcrae-process a.mcrae-primary{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border-radius:100px;padding:17px 27px;font:600 15px Inter,sans-serif}
.mcrae-primary{background:#157d3e;color:#fff!important}.mcrae-secondary{border:1px solid #14251a;color:#14251a!important}
.mcrae-detail-image{height:min(68vw,680px);min-height:400px;position:relative;border-radius:26px;overflow:hidden;background:#d8e8d0}
.mcrae-detail-image img{width:100%;height:100%;object-fit:cover;object-position:center 38%}.mcrae-detail-image span{position:absolute;bottom:17px;left:18px;color:#14251a;background:#ffffffdf;padding:8px 12px;border-radius:40px;font:600 11px Inter,sans-serif}
.mcrae-detail-body{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(270px,.6fr);gap:80px;padding-top:90px}.mcrae-detail-body p{font:400 18px/1.8 Inter,sans-serif;color:#4f4f51;max-width:730px}
.mcrae-detail-points{border-top:1px solid #aab6ac;padding-top:20px}.mcrae-detail-points ul{padding:0;list-style:none}.mcrae-detail-points li{padding:17px 0;border-bottom:1px solid #bdc8bd;font:600 16px Inter,sans-serif}
.mcrae-project-meta{margin-top:30px}.mcrae-process{background:#fff}.mcrae-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:70px 0}.mcrae-steps article{padding:35px;background:#f6f4ed;border-radius:20px;min-height:300px}.mcrae-steps b{color:#157d3e;font-size:14px}.mcrae-steps h3{font-size:24px;line-height:1.2;margin:45px 0 12px}.mcrae-steps p{font:400 15px/1.6 Inter,sans-serif;color:#4f4f51}
@media(max-width:800px){.mcrae-detail{padding:80px 20px}.mcrae-detail-body{grid-template-columns:1fr;gap:35px;padding-top:55px}.mcrae-detail-image{min-height:390px;height:78vw}.mcrae-steps{grid-template-columns:1fr 1fr}.mcrae-steps article{min-height:230px}}
@media(max-width:520px){.mcrae-steps{grid-template-columns:1fr}.mcrae-detail h1{font-size:clamp(48px,13vw,72px)}}

.mcrae-ceo{background:#f6f4ed;color:#14251a;padding:110px 28px;font-family:"Plus Jakarta Sans",sans-serif}.mcrae-ceo-wrap{max-width:1320px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:center}.mcrae-ceo-photo{height:650px;border-radius:20px;overflow:hidden;position:relative}.mcrae-ceo-photo img{width:100%;height:100%;object-fit:cover}.mcrae-ceo-photo span{position:absolute;bottom:20px;left:20px;background:#fff;padding:8px 12px;border-radius:20px;font:600 11px Inter,sans-serif}.mcrae-ceo h2,.mcrae-faq h2{font-size:clamp(44px,5vw,82px);letter-spacing:-.07em;line-height:1.04;margin:0 0 30px}.mcrae-ceo p,.mcrae-faq p{font:400 18px/1.8 Inter,sans-serif;color:#505851}.mcrae-ceo a{color:#157d3e;font:600 15px Inter,sans-serif}.mcrae-faq{background:#fff;color:#14251a;padding:110px 28px;font-family:"Plus Jakarta Sans",sans-serif}.mcrae-faq-wrap{max-width:1320px;margin:auto}.mcrae-faq-list{margin:50px 0}.mcrae-faq details{border-top:1px solid #b8c2b9;padding:24px 0}.mcrae-faq details:last-child{border-bottom:1px solid #b8c2b9}.mcrae-faq summary{cursor:pointer;font-size:clamp(18px,2vw,26px);font-weight:600;letter-spacing:-.03em;list-style:none}.mcrae-faq summary:after{content:'+';float:right;color:#157d3e}.mcrae-faq details[open] summary:after{content:'−'}.mcrae-faq details p{max-width:760px}.mcrae-faq a.mcrae-primary{display:inline-block;text-decoration:none;border-radius:40px;padding:17px 27px;font:600 15px Inter,sans-serif}.mcrae-footer-cta{display:inline-flex;padding:14px 22px;border-radius:50px;background:#157d3e;color:#fff!important;text-decoration:none;font:600 14px Inter,sans-serif}@media(max-width:780px){.mcrae-ceo{padding:75px 20px}.mcrae-ceo-wrap{grid-template-columns:1fr}.mcrae-ceo-photo{height:480px}.mcrae-faq{padding:80px 20px}}
.mcrae-mobile-menu{position:absolute;z-index:999;top:100%;left:0;width:100%;padding:20px 24px 30px;background:#14251a;box-shadow:0 30px 45px #0004;display:flex;flex-direction:column;gap:4px}.mcrae-mobile-menu[hidden]{display:none}.mcrae-mobile-menu a{display:block;padding:13px 10px;color:#fff;text-decoration:none;font:600 18px Inter,sans-serif}.mcrae-mobile-menu a:last-child{margin-top:10px;color:#a9dfaf}.mcrae-mobile-menu a:focus-visible,.mcrae-footer-cta:focus-visible{outline:2px solid #a9dfaf;outline-offset:3px}
header:has(.mcrae-mobile-menu),nav:has(.mcrae-mobile-menu){overflow:visible!important}
.mcrae-source-link{display:inline-block;margin:8px 0 15px;color:#a9dfaf!important;text-decoration:underline;font:500 12px Inter,sans-serif}

/* Preserve the Securix masthead geometry while making McRae's exact mark legible. */
nav[data-framer-name="Phone Closed"] a[data-framer-name="Logo"]{position:relative;width:140px!important;height:48px!important}
nav[data-framer-name="Phone Closed"] [data-framer-name="Logo Wrapper"]{padding-top:12px!important;padding-bottom:12px!important}
nav[data-framer-name="Phone Closed"] a[data-framer-name="Logo"] img[src*="mcrae-logo-transparent"]{filter:brightness(0) invert(1)}
nav[data-framer-name="Phone Closed"] a[data-framer-name="Logo"]::after{content:"";position:absolute;z-index:1;top:0;left:0;width:45px;height:48px;background:url('/assets/mcrae-logo-transparent.png') left center/140px 48px no-repeat;pointer-events:none}
.mcrae-proof-strip{display:flex!important;align-items:center;overflow:visible!important}
.mcrae-proof-strip img{display:none!important}
.mcrae-proof-strip span{display:block;flex:none;width:35px;height:35px;margin-left:-12px;border:2px solid #f3e9d6;border-radius:50%;background-size:cover;background-position:center}
.mcrae-proof-strip span:first-of-type{margin-left:0}

/* Keep the real McRae solar work as a bright, correctly proportioned hero. */
div:has(>video[src*="DaALwxeNWZC.mp4"]){aspect-ratio:16/9!important;height:auto!important;min-height:0!important;background:url('/assets/home.webp') center 45%/cover no-repeat!important;overflow:hidden}
video[src*="DaALwxeNWZC.mp4"]{display:none!important}
@media(max-width:767px){div:has(>video[src*="DaALwxeNWZC.mp4"]){aspect-ratio:4/5!important}}

/* Sitewide heading scale: retain the template fonts and responsive hierarchy. */
h1.framer-styles-preset-5rusx0{font-size:56px!important}
h2.framer-styles-preset-imyvkv{font-size:44px!important}
h3.framer-styles-preset-ovvsv{font-size:34px!important}
h4.framer-styles-preset-7k4a6i{font-size:27px!important}
.mcrae-detail h1{font-size:clamp(46px,6.3vw,96px)}
.mcrae-detail h2{font-size:clamp(34px,3.4vw,55px)}
.mcrae-ceo h2,.mcrae-faq h2{font-size:clamp(38px,4.2vw,68px)}
.mcrae-steps h3{font-size:21px}
@media(max-width:1439px){
  h1.framer-styles-preset-5rusx0{font-size:42px!important}
  h2.framer-styles-preset-imyvkv{font-size:36px!important}
  h3.framer-styles-preset-ovvsv{font-size:29px!important}
  h4.framer-styles-preset-7k4a6i{font-size:24px!important}
}
@media(max-width:767px){
  h1.framer-styles-preset-5rusx0{font-size:34px!important}
  h2.framer-styles-preset-imyvkv{font-size:29px!important}
  h3.framer-styles-preset-ovvsv{font-size:24px!important}
  h4.framer-styles-preset-7k4a6i{font-size:21px!important}
  .mcrae-detail h1{font-size:clamp(40px,10.6vw,62px)}
  .mcrae-detail h2{font-size:clamp(32px,8vw,46px)}
  .mcrae-ceo h2,.mcrae-faq h2{font-size:clamp(36px,9vw,54px)}
}
