/* ============================================================ ELITE RENEWABLES Every rule is prefixed with `body.er-theme` on purpose. The class is added by the theme (see er_body_class in functions.php) and the prefix gives each rule one extra element + one extra class of specificity, so this stylesheet wins against CSS left behind by plugins on the existing site. When adding rules, keep the prefix. Deliberately unprefixed, because they must apply above or outside : :root, html, and the * box-sizing reset. ============================================================ */ /* ============================================================ TOKENS ============================================================ */ :root{ --green:#7fd858; --green-dark:#63bd3d; --green-soft:rgba(127,216,88,.12); --ink:#1b1709; --ink-soft:#282316; --grey:#8d8d8d; --white:#ffffff; --cream:#f6f5ef; --line:rgba(27,23,9,.10); --line-dark:rgba(255,255,255,.12); --font-title:"Montserrat",sans-serif; --font-body:"Muli","Mulish",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; --r-sm:10px; --r-md:18px; --r-lg:28px; --r-xl:40px; --shadow-sm:0 6px 24px rgba(27,23,9,.06); --shadow-md:0 18px 50px rgba(27,23,9,.10); --shadow-lg:0 30px 80px rgba(27,23,9,.16); --pad:clamp(64px,8vw,128px); --gutter:clamp(20px,4vw,64px); --max:1440px; --ease:cubic-bezier(.22,1,.36,1); } /* ============================================================ RESET / BASE ============================================================ */ *,*::before,*::after{box-sizing:border-box;} html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;} body.er-theme{ margin:0; background:var(--white); color:var(--ink); font-family:var(--font-body); font-size:17px; line-height:1.75; font-weight:400; overflow-x:hidden; -webkit-font-smoothing:antialiased; } body.er-theme.nav-open{overflow:hidden;} body.er-theme img{max-width:100%;display:block;height:auto;} body.er-theme a{color:inherit;text-decoration:none;} body.er-theme button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;} body.er-theme ul{margin:0;padding:0;list-style:none;} body.er-theme h1,body.er-theme h2,body.er-theme h3,body.er-theme h4,body.er-theme h5,body.er-theme h6{ font-family:var(--font-title); font-weight:700; line-height:1.1; letter-spacing:-.02em; margin:0 0 .5em; color:var(--ink); } body.er-theme p{margin:0 0 1.15em;} body.er-theme p:last-child{margin-bottom:0;} body.er-theme ::selection{background:var(--green);color:var(--ink);} body.er-theme .wrap{ width:100%; /* --max is the CONTENT width; the gutter sits outside it */ max-width:calc(var(--max) + var(--gutter) * 2); margin-inline:auto; padding-inline:var(--gutter); } body.er-theme .section{padding-block:var(--pad);} body.er-theme .section--tight{padding-block:clamp(48px,5vw,80px);} body.er-theme .section--snug{padding-block:clamp(48px,5.4vw,88px);} /* Typography helpers */ body.er-theme .eyebrow{ font-family:var(--font-title); font-size:13px; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--green-dark); display:inline-flex; align-items:center; gap:12px; margin:0 0 20px; } body.er-theme .eyebrow::before{ content:""; width:28px;height:2px; background:var(--green); border-radius:2px; } body.er-theme .on-dark .eyebrow{color:var(--green);} body.er-theme .h-xl{font-size:clamp(38px,5.4vw,74px);} body.er-theme .h-lg{font-size:clamp(32px,4vw,56px);} body.er-theme .h-md{font-size:clamp(24px,2.4vw,34px);} body.er-theme .h-sm{font-size:clamp(19px,1.6vw,23px);} body.er-theme .lead{font-size:clamp(17px,1.35vw,20px);color:#5b5647;line-height:1.8;} body.er-theme .on-dark,body.er-theme .on-dark h1,body.er-theme .on-dark h2,body.er-theme .on-dark h3,body.er-theme .on-dark h4{color:var(--white);} body.er-theme .on-dark .lead,body.er-theme .on-dark p{color:rgba(255,255,255,.72);} body.er-theme .accent{color:var(--green);} /* Buttons */ body.er-theme .btn{ display:inline-flex;align-items:center;justify-content:center;gap:10px; font-family:var(--font-title); font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase; padding:17px 32px; border-radius:999px; transition:transform .35s var(--ease),background .3s ease,color .3s ease,box-shadow .35s ease,border-color .3s ease; white-space:nowrap; border:2px solid transparent; } body.er-theme .btn svg{width:16px;height:16px;flex:none;transition:transform .35s var(--ease);} body.er-theme .btn:hover{transform:translateY(-3px);} body.er-theme .btn:hover svg{transform:translateX(4px);} body.er-theme .btn--primary{background:var(--green);color:var(--ink);box-shadow:0 12px 30px rgba(127,216,88,.35);} body.er-theme .btn--primary:hover{background:#8ee468;box-shadow:0 18px 40px rgba(127,216,88,.45);} body.er-theme .btn--dark{background:var(--ink);color:var(--white);} body.er-theme .btn--dark:hover{background:#2c2611;} body.er-theme .btn--ghost{border-color:rgba(255,255,255,.35);color:var(--white);} body.er-theme .btn--ghost:hover{border-color:var(--white);background:rgba(255,255,255,.08);} body.er-theme .btn--outline{border-color:var(--ink);color:var(--ink);} body.er-theme .btn--outline:hover{background:var(--ink);color:var(--white);} /* "Talk to us" phone block — shared by header, hero and body sections */ body.er-theme .phone-cta{ display:inline-flex;align-items:center;gap:11px; font-family:var(--font-title);font-weight:700;font-size:15px; transition:color .25s ease; } body.er-theme .phone-cta .ico{ width:40px;height:40px;border-radius:50%; background:var(--green-soft);color:var(--green-dark); display:grid;place-items:center;flex:none; transition:background .3s ease,color .3s ease,transform .35s var(--ease); } body.er-theme .phone-cta .ico svg{width:17px;height:17px;} body.er-theme .phone-cta:hover .ico{transform:scale(1.06);} body.er-theme .phone-cta small{ display:block;font-family:var(--font-body);font-size:11.5px;font-weight:400; color:var(--grey);letter-spacing:.06em;text-transform:uppercase;line-height:1.3; } /* Text link with arrow */ body.er-theme .tlink{ display:inline-flex;align-items:center;gap:9px; font-family:var(--font-title);font-size:13px;font-weight:700; letter-spacing:.14em;text-transform:uppercase;color:var(--ink); } body.er-theme .tlink svg{width:15px;height:15px;transition:transform .35s var(--ease);} body.er-theme .tlink:hover svg{transform:translateX(5px);} body.er-theme .tlink:hover{color:var(--green-dark);} /* Stars */ body.er-theme .stars{display:inline-flex;gap:3px;} body.er-theme .stars svg{width:17px;height:17px;color:var(--green);flex:none;} /* Tick list */ body.er-theme .tick-list{display:grid;gap:14px;margin:32px 0 38px;} body.er-theme .tick-list li{display:flex;gap:14px;align-items:flex-start;font-size:16.5px;color:#4a4536;} body.er-theme .tick-list .tick{ flex:none;width:24px;height:24px;border-radius:50%; background:var(--green-soft);color:var(--green-dark); display:grid;place-items:center;margin-top:3px; } body.er-theme .tick-list .tick svg{width:12px;height:12px;} body.er-theme .on-dark .tick-list li{color:rgba(255,255,255,.75);} body.er-theme .on-dark .tick-list .tick{background:rgba(127,216,88,.18);color:var(--green);} /* ============================================================ HEADER ============================================================ */ body.er-theme .topbar{ background:var(--ink); color:rgba(255,255,255,.7); font-size:13.5px; letter-spacing:.02em; } body.er-theme .topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:44px;} body.er-theme .topbar a{transition:color .25s ease;} body.er-theme .topbar a:hover{color:var(--green);} body.er-theme .topbar-left{display:flex;align-items:center;gap:10px;} body.er-theme .topbar-left svg{width:15px;height:15px;color:var(--green);} body.er-theme .topbar-right{display:flex;align-items:center;gap:26px;} body.er-theme .topbar-right span{display:inline-flex;align-items:center;gap:8px;} body.er-theme .topbar-right svg{width:14px;height:14px;color:var(--green);} body.er-theme .topbar .ig{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;border:1px solid rgba(255,255,255,.2);} body.er-theme .topbar .ig svg{width:14px;height:14px;color:inherit;} body.er-theme .topbar .ig:hover{background:var(--green);border-color:var(--green);color:var(--ink);} body.er-theme .er-site-header{position:sticky;top:0;z-index:90;background:var(--white);transition:box-shadow .3s ease,background .3s ease;} body.er-theme .er-site-header.stuck{box-shadow:0 8px 30px rgba(27,23,9,.09);} body.er-theme .header-inner{display:flex;align-items:center;gap:clamp(18px,3vw,48px);min-height:92px;transition:min-height .3s ease;} body.er-theme .er-site-header.stuck .header-inner{min-height:76px;} body.er-theme .brand{display:flex;align-items:center;flex:none;} body.er-theme .brand img{width:auto;height:68px;transition:height .3s ease;} body.er-theme .er-site-header.stuck .brand img{height:54px;} body.er-theme .nav{margin-left:auto;} body.er-theme .nav > ul{display:flex;align-items:center;gap:clamp(14px,1.8vw,32px);} body.er-theme .nav > ul > li{position:relative;} body.er-theme .nav > ul > li > a{ display:inline-flex;align-items:center;gap:6px; font-family:var(--font-title);font-size:14.5px;font-weight:600; letter-spacing:.01em;padding:12px 0;position:relative; transition:color .25s ease; } body.er-theme .nav > ul > li > a::after{ content:"";position:absolute;left:0;bottom:4px; width:100%;height:2px;background:var(--green); transform:scaleX(0);transform-origin:right; transition:transform .4s var(--ease); border-radius:2px; } body.er-theme .nav > ul > li:hover > a::after,body.er-theme .nav > ul > li.is-current > a::after{transform:scaleX(1);transform-origin:left;} body.er-theme .nav > ul > li:hover > a{color:var(--green-dark);} body.er-theme .nav .caret{width:10px;height:10px;opacity:.5;transition:transform .3s ease;} body.er-theme .nav > ul > li:hover .caret{transform:rotate(180deg);} body.er-theme .submenu{ position:absolute;top:calc(100% + 10px);left:-20px; min-width:262px;background:var(--white); border-radius:var(--r-md); box-shadow:var(--shadow-md); padding:12px; opacity:0;visibility:hidden;transform:translateY(12px); transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s; border:1px solid var(--line); } body.er-theme .nav li:hover > .submenu{opacity:1;visibility:visible;transform:translateY(0);} body.er-theme .submenu a{ display:block;padding:11px 16px;border-radius:10px; font-size:15px;color:#4a4536; transition:background .22s ease,color .22s ease,padding-left .25s ease; } body.er-theme .submenu a:hover{background:var(--green-soft);color:var(--ink);padding-left:22px;} body.er-theme .header-cta{display:flex;align-items:center;gap:16px;flex:none;} body.er-theme .er-call{display:none;} body.er-theme .burger{display:none;width:46px;height:46px;border-radius:12px;background:var(--ink);flex:none;position:relative;} body.er-theme .burger span{position:absolute;left:13px;width:20px;height:2px;background:var(--white);border-radius:2px;transition:transform .35s var(--ease),opacity .2s ease,width .3s ease;} body.er-theme .burger span:nth-child(1){top:17px;} body.er-theme .burger span:nth-child(2){top:23px;width:14px;} body.er-theme .burger span:nth-child(3){top:29px;} body.er-theme.nav-open .burger span:nth-child(1){transform:translateY(6px) rotate(45deg);} body.er-theme.nav-open .burger span:nth-child(2){opacity:0;} body.er-theme.nav-open .burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg);width:20px;} /* Mobile nav */ body.er-theme .mobile-nav{ position:fixed;inset:0;z-index:95; background:var(--ink); padding:100px var(--gutter) 40px; overflow-y:auto; opacity:0;visibility:hidden; transform:translateY(-2%); transition:opacity .4s var(--ease),transform .4s var(--ease),visibility .4s; } body.er-theme.nav-open .mobile-nav{opacity:1;visibility:visible;transform:none;} body.er-theme .mobile-nav .close{position:absolute;top:26px;right:var(--gutter);width:46px;height:46px;border-radius:12px;background:rgba(255,255,255,.1);color:#fff;display:grid;place-items:center;} body.er-theme .mobile-nav .close svg{width:18px;height:18px;} body.er-theme .mobile-nav > ul > li{border-bottom:1px solid var(--line-dark);} body.er-theme .mobile-nav > ul > li > a,body.er-theme .mobile-nav .m-toggle{ display:flex;align-items:center;justify-content:space-between;width:100%; padding:18px 0;font-family:var(--font-title);font-size:20px;font-weight:600;color:#fff;text-align:left; } body.er-theme .mobile-nav .m-toggle svg{width:14px;height:14px;color:var(--green);transition:transform .3s ease;} body.er-theme .mobile-nav .m-toggle.open svg{transform:rotate(45deg);} body.er-theme .mobile-nav .m-sub{max-height:0;overflow:hidden;transition:max-height .4s var(--ease);} body.er-theme .mobile-nav .m-sub a{display:block;padding:11px 0 11px 18px;color:rgba(255,255,255,.62);font-size:16px;border-left:1px solid var(--line-dark);} body.er-theme .mobile-nav .m-sub a:hover{color:var(--green);} body.er-theme .mobile-nav .m-sub li:last-child a{padding-bottom:20px;} body.er-theme .mnav-foot{margin-top:36px;display:grid;gap:14px;} body.er-theme .mnav-foot a.line{display:flex;align-items:center;gap:12px;color:rgba(255,255,255,.75);font-size:15px;} body.er-theme .mnav-foot a.line svg{width:16px;height:16px;color:var(--green);flex:none;} /* ============================================================ HERO ============================================================ */ body.er-theme .hero{position:relative;background:var(--ink);overflow:hidden;} body.er-theme .hero-stage{position:relative;display:flex;align-items:center;min-height:clamp(620px,84vh,880px);} body.er-theme .hero-bg{position:absolute;inset:0;opacity:0;transition:opacity 1.1s var(--ease);} body.er-theme .hero-bg.active{opacity:1;} body.er-theme .hero-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 8s linear;} body.er-theme .hero-bg.active img{transform:scale(1);} body.er-theme .hero-bg::after{ content:"";position:absolute;inset:0; background:linear-gradient(100deg,rgba(15,13,5,.92) 0%,rgba(15,13,5,.78) 40%,rgba(15,13,5,.45) 72%,rgba(15,13,5,.62) 100%); } body.er-theme .hero-content{position:relative;z-index:3;width:100%;padding-block:clamp(60px,8vh,104px) clamp(96px,12vh,132px);} body.er-theme .hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 500px;gap:clamp(30px,4vw,72px);align-items:center;} body.er-theme .hero h1{ display:flex;align-items:center;gap:12px; font-family:var(--font-title); font-size:clamp(13.5px,1.1vw,16.5px); font-weight:600;letter-spacing:.05em; line-height:1.45;color:rgba(255,255,255,.82); margin:0 0 18px; } body.er-theme .hero h1::before{ content:"";width:28px;height:2px;flex:none; background:var(--green);border-radius:2px; } body.er-theme .hero-display{ color:#fff;font-size:clamp(34px,4.2vw,60px); line-height:1.06;letter-spacing:-.03em;margin:0 0 22px; } body.er-theme .hero-display em{font-style:normal;color:var(--green);} body.er-theme .hero-copy p{color:rgba(255,255,255,.78);font-size:clamp(16.5px,1.3vw,19px);margin-bottom:34px;} body.er-theme .hero-actions{display:flex;flex-wrap:wrap;gap:18px 26px;align-items:center;} body.er-theme .hero-actions .phone-cta{color:#fff;} body.er-theme .hero-actions .phone-cta .ico{background:rgba(127,216,88,.16);color:var(--green);} body.er-theme .hero-actions .phone-cta small{color:rgba(255,255,255,.6);} body.er-theme .hero-actions .phone-cta:hover{color:var(--green);} body.er-theme .hero-copy > *{opacity:0;transform:translateY(24px);animation:heroIn .9s var(--ease) forwards;} body.er-theme .hero-copy > *:nth-child(1){animation-delay:.10s;} body.er-theme .hero-copy > *:nth-child(2){animation-delay:.22s;} body.er-theme .hero-copy > *:nth-child(3){animation-delay:.34s;} body.er-theme .hero-copy > *:nth-child(4){animation-delay:.46s;} body.er-theme .hero-copy > *:nth-child(5){animation-delay:.58s;} @keyframes heroIn{to{opacity:1;transform:none;}} /* Slider controls */ body.er-theme .hero-ui{position:absolute;left:0;right:0;bottom:clamp(26px,4vh,42px);z-index:5;} body.er-theme .hero-ui .wrap{display:flex;align-items:center;justify-content:flex-start;gap:clamp(18px,2vw,34px);} body.er-theme .hero-dots{display:flex;align-items:center;gap:14px;} body.er-theme .hero-dots button{ width:38px;height:3px;border-radius:3px;background:rgba(255,255,255,.28); position:relative;overflow:hidden;transition:background .3s ease; } body.er-theme .hero-dots button.active{background:rgba(255,255,255,.3);} body.er-theme .hero-dots button.active::after{ content:"";position:absolute;inset:0;background:var(--green); transform-origin:left;animation:dotFill 6s linear forwards; } @keyframes dotFill{from{transform:scaleX(0);}to{transform:scaleX(1);}} body.er-theme .hero-arrows{display:flex;gap:10px;} body.er-theme .hero-arrows button{ width:48px;height:48px;border-radius:50%; border:1px solid rgba(255,255,255,.28);color:#fff; display:grid;place-items:center; transition:background .3s ease,border-color .3s ease,color .3s ease,transform .3s var(--ease); } body.er-theme .hero-arrows button svg{width:16px;height:16px;} body.er-theme .hero-arrows button:hover{background:var(--green);border-color:var(--green);color:var(--ink);transform:translateY(-3px);} /* Hero lead form */ body.er-theme .hero-form{ width:100%; background:var(--white);color:var(--ink); border-radius:var(--r-lg); padding:clamp(26px,2.2vw,34px); box-shadow:var(--shadow-lg); border-top:5px solid var(--green); opacity:0;transform:translateY(24px); animation:heroIn .9s var(--ease) .4s forwards; } body.er-theme .hero-form .hf-title{font-size:clamp(21px,1.8vw,25px);margin-bottom:6px;color:var(--ink);} body.er-theme .hero-form .hf-sub{font-size:14.5px;color:var(--grey);line-height:1.6;margin-bottom:20px;} body.er-theme .hero-form .f-grid{gap:13px;} body.er-theme .hero-form .field label{font-size:11.5px;margin-bottom:6px;} body.er-theme .hero-form .field input,body.er-theme .hero-form .field select{padding:13px 15px;font-size:15px;border-radius:10px;} body.er-theme .hero-form .btn{width:100%;margin-top:18px;} body.er-theme .hero-form .form-note{margin-top:13px;font-size:12.5px;} /* ============================================================ REVIEWS MARQUEE ============================================================ */ body.er-theme .reviews{background:var(--cream);overflow:hidden;} body.er-theme .reviews-head{text-align:center;margin-bottom:clamp(28px,3vw,44px);} body.er-theme .reviews-head h2{margin-bottom:12px;} body.er-theme .reviews-head p{color:#5b5647;margin:0;font-size:17px;} body.er-theme .reviews-head .stars{margin-bottom:16px;} body.er-theme .reviews-head .stars svg{width:22px;height:22px;} body.er-theme .marquee{ overflow:hidden;position:relative; -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); } body.er-theme .marquee-track{display:flex;width:max-content;align-items:center;animation:slide 34s linear infinite;} body.er-theme .marquee:hover .marquee-track{animation-play-state:paused;} @keyframes slide{from{transform:translateX(0);}to{transform:translateX(-50%);}} body.er-theme .reviews .marquee-track{gap:clamp(16px,1.6vw,24px);animation-duration:205s;padding-inline:12px;} body.er-theme .review{ width:clamp(300px,26vw,380px);flex:none; background:var(--white);border:1px solid var(--line); border-radius:var(--r-lg);padding:clamp(24px,2vw,32px); display:flex;flex-direction:column;gap:16px; align-self:stretch; transition:box-shadow .4s var(--ease),transform .4s var(--ease); } body.er-theme .review:hover{box-shadow:var(--shadow-md);transform:translateY(-4px);} body.er-theme .review p{ font-size:15.5px;line-height:1.72;color:#4a4536;margin:0;flex:1; /* cap the longest reviews so one outlier can't stretch the whole row */ display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:8; overflow:hidden; } body.er-theme .review .who{display:flex;align-items:center;gap:13px;} body.er-theme .review .av{ width:42px;height:42px;border-radius:50%;flex:none; background:var(--ink);color:var(--green); display:grid;place-items:center; font-family:var(--font-title);font-weight:700;font-size:15px; } body.er-theme .review .who b{display:block;font-family:var(--font-title);font-size:15px;letter-spacing:-.01em;color:var(--ink);line-height:1.3;} body.er-theme .review .who span span{font-size:13px;color:var(--grey);} /* ============================================================ SPLIT LAYOUT ============================================================ */ body.er-theme .split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,90px);align-items:stretch;} body.er-theme .split--reverse .split-media{order:2;} body.er-theme .split--flip .split-media{order:-1;} body.er-theme .split-body{align-self:center;} body.er-theme .split-media{display:flex;} body.er-theme .media-frame{position:relative;flex:1;display:flex;} body.er-theme .media-frame img{border-radius:var(--r-lg);width:100%;height:100%;object-fit:cover;box-shadow:var(--shadow-md);} body.er-theme .media-frame::before{ content:"";position:absolute;inset:auto -22px -22px auto; width:58%;height:58%;border:2px solid var(--green);border-radius:var(--r-lg); z-index:-1; } body.er-theme .badge-float{ position:absolute;left:-24px;bottom:44px; background:var(--white);border-radius:var(--r-md); padding:22px 26px;box-shadow:var(--shadow-lg); display:flex;align-items:center;gap:16px;max-width:280px; } body.er-theme .badge-float .ico{width:52px;height:52px;flex:none;border-radius:14px;background:var(--green);display:grid;place-items:center;color:var(--ink);} body.er-theme .badge-float .ico svg{width:24px;height:24px;} body.er-theme .badge-float b{display:block;font-family:var(--font-title);font-size:26px;line-height:1;letter-spacing:-.02em;color:var(--ink);} body.er-theme .badge-float span{font-size:13.5px;color:var(--grey);line-height:1.4;display:block;margin-top:4px;} /* ============================================================ SECTION HEADS ============================================================ */ body.er-theme .sec-head{ display:flex;flex-direction:column;align-items:center;text-align:center; gap:26px;margin-bottom:clamp(38px,4vw,64px); } body.er-theme .sec-head .txt{max-width:760px;} body.er-theme .sec-head--wide .txt{max-width:none;} body.er-theme .sec-head h2{margin-bottom:0;} body.er-theme .sec-head p{margin-top:18px;} body.er-theme .sec-head .tabs{justify-content:center;} body.er-theme .sec-cta{ display:flex;flex-wrap:wrap;align-items:center;justify-content:center; gap:14px 22px;margin-top:clamp(38px,4vw,58px); } body.er-theme .sec-cta .muted{font-size:15px;color:var(--grey);margin:0;} body.er-theme .sec-cta .muted a{color:var(--ink);font-weight:700;border-bottom:1px solid rgba(27,23,9,.28);} body.er-theme .sec-cta .muted a:hover{color:var(--green-dark);border-bottom-color:transparent;} body.er-theme .on-dark .sec-cta .muted{color:rgba(255,255,255,.6);} body.er-theme .on-dark .sec-cta .muted a{color:#fff;border-bottom-color:rgba(255,255,255,.38);} body.er-theme .on-dark .sec-cta .muted a:hover{color:var(--green);} body.er-theme .tabs{display:flex;flex-wrap:wrap;gap:8px;} body.er-theme .tabs button{ font-family:var(--font-title);font-size:13px;font-weight:700; letter-spacing:.1em;text-transform:uppercase; padding:12px 22px;border-radius:999px; border:1px solid var(--line);color:#6a6555; transition:all .3s var(--ease); } body.er-theme .tabs button:hover{border-color:var(--ink);color:var(--ink);} body.er-theme .tabs button.active{background:var(--ink);border-color:var(--ink);color:var(--white);} /* ============================================================ SERVICES ============================================================ */ body.er-theme .svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2vw,28px);} body.er-theme .svc{ position:relative;border-radius:var(--r-lg);overflow:hidden; background:var(--white);border:1px solid var(--line); display:flex;flex-direction:column; transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .45s ease; } body.er-theme .svc:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);border-color:transparent;} body.er-theme .svc-img{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--cream);} body.er-theme .svc-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease);} body.er-theme .svc:hover .svc-img img{transform:scale(1.07);} body.er-theme .svc-tag{ position:absolute;top:14px;left:14px;z-index:2; background:rgba(255,255,255,.94);backdrop-filter:blur(6px); font-family:var(--font-title);font-size:11px;font-weight:700; letter-spacing:.12em;text-transform:uppercase; padding:7px 13px;border-radius:999px;color:var(--ink); } body.er-theme .svc-body{padding:26px 26px 28px;display:flex;flex-direction:column;flex:1;} body.er-theme .svc-body h3{font-size:20px;margin-bottom:10px;letter-spacing:-.01em;} body.er-theme .svc-body p{font-size:15.5px;color:#6a6555;line-height:1.7;margin-bottom:22px;} body.er-theme .svc-body .tlink{margin-top:auto;} body.er-theme .svc.hide{display:none;} /* ============================================================ PROJECTS ============================================================ */ body.er-theme .proj-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:230px;gap:clamp(14px,1.6vw,22px);} body.er-theme .proj{position:relative;border-radius:var(--r-md);overflow:hidden;background:var(--ink);} body.er-theme .proj:nth-child(1){grid-column:span 2;grid-row:span 2;} body.er-theme .proj:nth-child(4){grid-column:span 2;} body.er-theme .proj img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease);} body.er-theme .proj:hover img{transform:scale(1.06);} body.er-theme .proj::after{ content:"";position:absolute;inset:0; background:linear-gradient(to top,rgba(15,13,5,.9) 0%,rgba(15,13,5,.5) 34%,rgba(15,13,5,.1) 68%,transparent 88%); opacity:.85;transition:opacity .4s ease; } body.er-theme .proj-cap{position:absolute;left:0;bottom:0;z-index:2;padding:26px 28px;color:#fff;} body.er-theme .proj-cap span{ display:inline-block;font-family:var(--font-title);font-size:11px;font-weight:700; letter-spacing:.14em;text-transform:uppercase;color:var(--green);margin-bottom:7px; } body.er-theme .proj-cap h3{font-size:19px;color:#fff;margin:0;letter-spacing:-.01em;} /* ============================================================ POLICIES (dark) ============================================================ */ body.er-theme .dark-block{background:var(--ink);position:relative;overflow:hidden;} /* Contact sits directly above the footer; a green-black stops the two dark blocks reading as one. */ body.er-theme .dark-block--green{background:#24371a;} body.er-theme .dark-block--green .map-frame{background:rgba(0,0,0,.28);} body.er-theme .dark-block::before{ content:"";position:absolute;top:-180px;right:-140px; width:520px;height:520px;border-radius:50%; background:radial-gradient(circle,rgba(127,216,88,.16),transparent 66%); } body.er-theme .dark-block .wrap{position:relative;z-index:2;} body.er-theme .pol-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2vw,26px);} body.er-theme .pol{ background:rgba(255,255,255,.045); border:1px solid var(--line-dark); border-radius:var(--r-lg); padding:clamp(28px,3vw,40px); position:relative;overflow:hidden; transition:transform .45s var(--ease),background .4s ease,border-color .4s ease; } body.er-theme .pol:hover{transform:translateY(-8px);background:rgba(255,255,255,.075);border-color:rgba(127,216,88,.4);} body.er-theme .pol .num{ position:absolute;top:18px;right:26px; font-family:var(--font-title);font-size:64px;font-weight:800; color:rgba(255,255,255,.05);line-height:1;letter-spacing:-.04em; } body.er-theme .pol .ico{ width:62px;height:62px;border-radius:18px; background:var(--green);color:var(--ink); display:grid;place-items:center;margin-bottom:26px; transition:transform .45s var(--ease); } body.er-theme .pol:hover .ico{transform:rotate(-8deg) scale(1.05);} body.er-theme .pol .ico svg{width:28px;height:28px;} body.er-theme .pol h3{font-size:21px;color:#fff;margin-bottom:14px;} body.er-theme .pol p{font-size:15.5px;color:rgba(255,255,255,.66);line-height:1.75;margin:0;} /* ============================================================ CREDIBILITY / TRUST STRIP ============================================================ */ body.er-theme .cred-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,28px);align-items:center;} body.er-theme .cred{ background:var(--white);border:1px solid var(--line);border-radius:var(--r-md); padding:22px;display:grid;place-items:center;min-height:118px; transition:box-shadow .35s ease,transform .35s var(--ease); } body.er-theme .cred:hover{box-shadow:var(--shadow-sm);transform:translateY(-4px);} body.er-theme .cred img{max-height:66px;width:auto;object-fit:contain;} /* ============================================================ CONTACT ============================================================ */ body.er-theme .contact-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(36px,5vw,80px);align-items:start;} body.er-theme .contact-list{display:grid;gap:6px;margin-top:38px;} body.er-theme .contact-list li{display:flex;gap:18px;padding:20px 0;border-top:1px solid var(--line-dark);} body.er-theme .contact-list li:last-child{border-bottom:1px solid var(--line-dark);} body.er-theme .contact-list .ico{ width:46px;height:46px;flex:none;border-radius:14px; background:rgba(127,216,88,.14);color:var(--green); display:grid;place-items:center; } body.er-theme .contact-list .ico svg{width:19px;height:19px;} body.er-theme .contact-list small{display:block;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.42);margin-bottom:4px;font-family:var(--font-title);font-weight:600;} body.er-theme .contact-list a,body.er-theme .contact-list p{color:#fff;font-size:16.5px;margin:0;line-height:1.5;transition:color .25s ease;} body.er-theme .contact-list a:hover{color:var(--green);} body.er-theme .map-block{margin-top:30px;} body.er-theme .map-block h4{font-family:var(--font-title);font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:#fff;margin-bottom:16px;} body.er-theme .map-frame{ position:relative;border-radius:var(--r-md);overflow:hidden; border:1px solid var(--line-dark);background:var(--ink-soft); height:clamp(230px,24vw,300px); } body.er-theme .map-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;} body.er-theme .form-card{ background:var(--white);color:var(--ink);border-radius:var(--r-lg); padding:clamp(30px,3.4vw,48px);box-shadow:var(--shadow-lg); } body.er-theme .form-card h3{font-size:clamp(22px,2vw,28px);margin-bottom:8px;color:var(--ink);} body.er-theme .form-card > p{color:var(--grey);font-size:15.5px;margin-bottom:30px;} body.er-theme .f-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;} body.er-theme .field{position:relative;} body.er-theme .field.full{grid-column:1/-1;} body.er-theme .field label{ display:block;font-family:var(--font-title);font-size:12px;font-weight:600; letter-spacing:.1em;text-transform:uppercase;color:#6a6555;margin-bottom:8px; } body.er-theme .field input,body.er-theme .field textarea,body.er-theme .field select{ width:100%;font-family:var(--font-body);font-size:16px;color:var(--ink); background:var(--cream);border:1px solid transparent;border-radius:12px; padding:15px 18px;transition:border-color .25s ease,background .25s ease,box-shadow .25s ease; } body.er-theme .field textarea{min-height:130px;resize:vertical;} body.er-theme .field input::placeholder,body.er-theme .field textarea::placeholder{color:#a9a498;} body.er-theme .field input:focus,body.er-theme .field textarea:focus,body.er-theme .field select:focus{ outline:none;background:var(--white);border-color:var(--green); box-shadow:0 0 0 4px rgba(127,216,88,.16); } body.er-theme .form-note{font-size:13px;color:var(--grey);margin-top:16px;text-align:center;} body.er-theme .form-card .btn{width:100%;margin-top:22px;} /* ============================================================ CONTACT FORM 7 CF7 wraps every control in an inline span and appends its own response/validation nodes; these make that output sit inside the design. ============================================================ */ body.er-theme .wpcf7 form.wpcf7-form{margin:0;} /* CF7 keeps these in the DOM at all times; hide them here rather than relying on the plugin's own stylesheet still being enqueued. */ body.er-theme .screen-reader-response{ position:absolute;width:1px;height:1px;margin:0;padding:0;border:0; overflow:hidden;clip:rect(1px,1px,1px,1px); } body.er-theme .wpcf7 form.init .wpcf7-response-output, body.er-theme .wpcf7 form.resetting .wpcf7-response-output, body.er-theme .wpcf7 form.submitting .wpcf7-response-output{display:none;} body.er-theme .wpcf7-form-control-wrap{display:block;position:relative;} body.er-theme .wpcf7-not-valid-tip{ display:block;margin-top:7px; font-family:var(--font-title);font-size:12.5px;font-weight:600; letter-spacing:.02em;color:#c0392b; } body.er-theme .field input.wpcf7-not-valid, body.er-theme .field textarea.wpcf7-not-valid, body.er-theme .field select.wpcf7-not-valid{ border-color:#c0392b;background:rgba(192,57,43,.05); } body.er-theme .wpcf7 form .wpcf7-response-output{ margin:18px 0 0;padding:13px 18px;border-radius:12px; border:1px solid var(--line); font-size:14.5px;line-height:1.55;color:var(--ink); } body.er-theme .wpcf7 form.sent .wpcf7-response-output{ border-color:rgba(127,216,88,.55);background:var(--green-soft); } body.er-theme .wpcf7 form.invalid .wpcf7-response-output, body.er-theme .wpcf7 form.unaccepted .wpcf7-response-output, body.er-theme .wpcf7 form.payment-required .wpcf7-response-output{ border-color:rgba(192,57,43,.4);background:rgba(192,57,43,.06);color:#8e2b21; } body.er-theme .wpcf7 form.failed .wpcf7-response-output, body.er-theme .wpcf7 form.aborted .wpcf7-response-output, body.er-theme .wpcf7 form.spam .wpcf7-response-output{ border-color:rgba(192,57,43,.4);background:rgba(192,57,43,.06);color:#8e2b21; } body.er-theme .wpcf7-spinner{margin:14px auto 0;display:block;} /* CF7's rows attribute would otherwise set the height and defeat min-height. resize:vertical still lets the visitor drag it larger. */ body.er-theme .wpcf7 .field textarea{height:130px;} /* The banner card sits on the dark hero, so its messages need light text. */ body.er-theme .hero-form .wpcf7 form .wpcf7-response-output{ border-color:rgba(27,23,9,.12); } /* ============================================================ FAQ ============================================================ */ body.er-theme .faq{display:grid;gap:12px;} body.er-theme .faq-item{border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;transition:border-color .3s ease,box-shadow .3s ease,background .3s ease;} body.er-theme .faq-item.open{border-color:transparent;box-shadow:var(--shadow-md);background:var(--white);} body.er-theme .faq-q{ width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px; padding:22px 26px;text-align:left; font-family:var(--font-title);font-size:17px;font-weight:600;letter-spacing:-.01em; transition:color .25s ease; } body.er-theme .faq-q:hover{color:var(--green-dark);} body.er-theme .faq-item.open .faq-q{color:var(--ink);} body.er-theme .faq-ico{ flex:none;width:32px;height:32px;border-radius:50%; background:var(--cream);display:grid;place-items:center; transition:background .3s ease,color .3s ease,transform .35s var(--ease); } body.er-theme .faq-ico svg{width:13px;height:13px;} body.er-theme .faq-item.open .faq-ico{background:var(--green);color:var(--ink);transform:rotate(45deg);} body.er-theme .faq-a{max-height:0;overflow:hidden;transition:max-height .45s var(--ease);} body.er-theme .faq-a-inner{padding:0 26px 26px;font-size:16px;color:#6a6555;line-height:1.8;} body.er-theme .faq-a-inner ol{margin:12px 0 0;padding-left:0;counter-reset:step;display:grid;gap:9px;} body.er-theme .faq-a-inner ol li{display:flex;gap:12px;counter-increment:step;} body.er-theme .faq-a-inner ol li::before{ content:counter(step);flex:none; width:22px;height:22px;border-radius:50%;background:var(--green-soft);color:var(--green-dark); font-family:var(--font-title);font-size:11.5px;font-weight:700; display:grid;place-items:center;margin-top:4px; } /* Green question cards on the page background. Every hover/open state that normally resolves to green has to change, since green on green is invisible. */ body.er-theme .faq--green .faq-item{background:var(--green);border-color:transparent;} body.er-theme .faq--green .faq-item.open{background:var(--green);box-shadow:var(--shadow-md);} body.er-theme .faq--green .faq-q{color:var(--ink);} body.er-theme .faq--green .faq-q:hover{color:rgba(27,23,9,.62);} body.er-theme .faq--green .faq-ico{background:rgba(255,255,255,.62);color:var(--ink);} body.er-theme .faq--green .faq-item.open .faq-ico{background:var(--ink);color:var(--green);} body.er-theme .faq--green .faq-a-inner{color:rgba(27,23,9,.82);} body.er-theme .faq-cols{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(12px,1.4vw,22px);align-items:start;} /* ============================================================ BACKGROUND NOTES ============================================================ */ body.er-theme .note-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,1.8vw,26px);} body.er-theme .note{ background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg); padding:clamp(28px,3vw,44px); /* column so the Read more button can sit on the card's baseline, keeping the buttons in a row aligned even when the intro paragraphs differ in length */ display:flex;flex-direction:column;align-items:flex-start; transition:box-shadow .4s var(--ease),transform .4s var(--ease); } body.er-theme .note:hover{box-shadow:var(--shadow-md);transform:translateY(-4px);} body.er-theme .note .num{ display:grid;place-items:center;width:46px;height:46px;border-radius:var(--r-md); background:var(--green-soft);color:var(--green-dark); font-family:var(--font-title);font-size:14px;font-weight:800;letter-spacing:.02em; margin-bottom:22px; } body.er-theme .note h3{margin-bottom:14px;} body.er-theme .note p{font-size:16px;color:#6a6555;line-height:1.8;} body.er-theme .note-more{max-height:0;overflow:hidden;transition:max-height .5s var(--ease);align-self:stretch;} body.er-theme .note-more-inner{padding-top:1.15em;} body.er-theme .more-btn{margin-top:auto;padding-top:20px;letter-spacing:.12em;} body.er-theme .more-btn svg{transition:transform .35s var(--ease);} body.er-theme .more-btn:hover svg{transform:none;} body.er-theme .more-btn[aria-expanded="true"] svg{transform:rotate(180deg);} /* ============================================================ PARTNERS ============================================================ */ body.er-theme .partners .marquee-track{gap:clamp(28px,4vw,64px);} body.er-theme .partners .marquee img{height:clamp(44px,4vw,62px);width:auto;object-fit:contain;mix-blend-mode:multiply;transition:transform .35s var(--ease);} body.er-theme .partners .marquee img:hover{transform:scale(1.06);} /* ============================================================ FOOTER ============================================================ */ body.er-theme .er-site-footer{background:var(--ink);color:rgba(255,255,255,.6);padding-top:clamp(56px,6vw,90px);} body.er-theme .foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:clamp(28px,3.5vw,60px);padding-bottom:clamp(44px,5vw,70px);} body.er-theme .foot-brand img{height:84px;width:auto;margin-bottom:24px;} body.er-theme .foot-brand p{font-size:15px;line-height:1.8;color:rgba(255,255,255,.55);max-width:360px;} body.er-theme .socials{display:flex;gap:10px;margin-top:24px;} body.er-theme .socials a{ width:44px;height:44px;border-radius:50%;border:1px solid var(--line-dark); display:grid;place-items:center;color:rgba(255,255,255,.72); transition:all .3s var(--ease); } body.er-theme .socials a svg{width:17px;height:17px;} body.er-theme .socials a:hover{background:var(--green);border-color:var(--green);color:var(--ink);transform:translateY(-3px);} body.er-theme .er-site-footer h4{ font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:#fff; margin-bottom:24px;font-weight:700; } body.er-theme .foot-links{display:grid;gap:12px;} body.er-theme .foot-links a{font-size:15.5px;color:rgba(255,255,255,.58);transition:color .25s ease,padding-left .25s ease;display:inline-block;} body.er-theme .foot-links a:hover{color:var(--green);padding-left:6px;} body.er-theme .foot-contact{display:grid;gap:18px;} body.er-theme .foot-contact li{display:flex;gap:13px;font-size:15.5px;color:rgba(255,255,255,.58);} body.er-theme .foot-contact svg{width:17px;height:17px;color:var(--green);flex:none;margin-top:4px;} body.er-theme .foot-contact a:hover{color:var(--green);} body.er-theme .foot-bottom{ border-top:1px solid var(--line-dark); padding-block:26px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap; font-size:14px;color:rgba(255,255,255,.45); } body.er-theme .foot-bottom a{color:rgba(255,255,255,.62);} body.er-theme .foot-bottom a:hover{color:var(--green);} /* Floating actions */ body.er-theme .to-top{ /* Clear of the reCAPTCHA badge, which is fixed to the same corner. */ position:fixed;right:22px;bottom:92px;z-index:60; width:50px !important;height:50px !important;border-radius:50%; background:var(--ink);color:#fff;display:grid;place-items:center; box-shadow:var(--shadow-md); opacity:0;visibility:hidden;transform:translateY(14px); transition:opacity .35s ease,transform .35s var(--ease),visibility .35s,background .3s ease; } body.er-theme .to-top.show{opacity:1;visibility:visible;transform:none;} body.er-theme .to-top:hover{background:var(--green);color:var(--ink);} body.er-theme .to-top svg{width:17px;height:17px;} body.er-theme .call-fab{display:none;} /* Reveal */ body.er-theme .reveal{opacity:0;transform:translateY(34px);transition:opacity .8s var(--ease),transform .8s var(--ease);} body.er-theme .reveal.in{opacity:1;transform:none;} body.er-theme .reveal.d1{transition-delay:.09s;} body.er-theme .reveal.d2{transition-delay:.18s;} body.er-theme .reveal.d3{transition-delay:.27s;} /* ============================================================ ICON BUTTONS vs. THE THEME'S GENERIC button RULES SiteOrigin (and WPBakery) style every `button` on the page — padding, min-height, line-height, border. Our icon buttons size themselves, so those rules inflate the box: the burger grew to 64x52 and pushed itself into the call icon beside it, and the mobile close button's X landed 18px off centre. Reset the properties they set, on our buttons only. ============================================================ */ body.er-theme .burger, body.er-theme .mobile-nav .close, body.er-theme .to-top, body.er-theme .hero-dots button, body.er-theme .hero-arrows button{ box-sizing:border-box !important; padding:0 !important; margin:0 !important; min-width:0 !important; min-height:0 !important; border:0 !important; box-shadow:none !important; font-size:0 !important; line-height:0 !important; -webkit-appearance:none;appearance:none; } body.er-theme .burger, body.er-theme .mobile-nav .close{width:46px !important;height:46px !important;} body.er-theme .mobile-nav .close{display:grid !important;place-items:center !important;} body.er-theme .to-top{display:grid !important;place-items:center !important;} body.er-theme .mobile-nav .close svg, body.er-theme .to-top svg, body.er-theme .hero-arrows button svg{display:block;margin:0;} /* Same cause, on the banner slider controls. */ body.er-theme .hero-ui .hero-dots{align-items:center;gap:12px;} body.er-theme .hero-dots button{width:38px !important;height:4px !important;border-radius:4px !important;flex:none;} body.er-theme .hero-arrows button{ width:44px !important;height:44px !important;border-radius:50% !important; display:inline-flex !important;align-items:center !important;justify-content:center !important; } body.er-theme .hero-arrows button svg{width:16px;height:16px;} /* ============================================================ RESPONSIVE ============================================================ */ @media (max-width:1180px){ body.er-theme .hero-grid{grid-template-columns:1fr;gap:40px;} body.er-theme .hero-form{max-width:560px;} body.er-theme .hero-content{padding-block:clamp(56px,7vh,90px) clamp(90px,11vh,120px);} body.er-theme .nav{display:none;} body.er-theme .header-cta{margin-left:auto;gap:14px;} body.er-theme .header-cta .phone-cta{display:none;} /* the mobile nav carries its own Enquire Now */ body.er-theme .header-cta > .btn{display:none;} body.er-theme .er-call{ display:grid;place-items:center;width:46px;height:46px;flex:none; border-radius:12px;background:var(--ink);color:var(--green); transition:background .25s ease,color .25s ease; } body.er-theme .er-call svg{width:19px;height:19px;} body.er-theme .er-call:hover{background:var(--green);color:var(--ink);} body.er-theme .burger{display:block;} body.er-theme .svc-grid{grid-template-columns:repeat(2,1fr);} body.er-theme .foot-grid{grid-template-columns:1fr 1fr;}} @media (max-width:980px){ body.er-theme .split{grid-template-columns:1fr;} body.er-theme .split--reverse .split-media,body.er-theme .split--flip .split-media{order:0;} body.er-theme .media-frame img{height:auto;} body.er-theme .media-frame::before{display:none;} body.er-theme .badge-float{left:auto;right:16px;bottom:-24px;} body.er-theme .pol-grid{grid-template-columns:1fr;} body.er-theme .note-grid{grid-template-columns:1fr;} body.er-theme .faq-cols{grid-template-columns:1fr;} body.er-theme .contact-grid{grid-template-columns:1fr;} body.er-theme .proj-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:220px;} body.er-theme .proj:nth-child(1){grid-column:span 2;grid-row:span 1;} body.er-theme .proj:nth-child(4){grid-column:span 2;} body.er-theme .cred-strip{grid-template-columns:repeat(2,1fr);} body.er-theme .topbar-left{display:none;}} @media (max-width:680px){ body.er-theme{font-size:16px;} body.er-theme .svc-grid{grid-template-columns:1fr;} body.er-theme .f-grid{grid-template-columns:1fr;} body.er-theme .foot-grid{grid-template-columns:1fr;} body.er-theme .hero-ui .wrap{justify-content:center;} body.er-theme .hero-arrows{display:none;} body.er-theme .btn{padding:15px 26px;font-size:13px;} body.er-theme .call-fab{ display:inline-flex;align-items:center;gap:10px; position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:61; padding:14px 26px;border-radius:999px; background:var(--green);color:var(--ink); box-shadow:0 12px 32px rgba(27,23,9,.3); font-family:var(--font-title);font-size:13.5px;font-weight:700; letter-spacing:.1em;text-transform:uppercase;white-space:nowrap; } body.er-theme .call-fab svg{width:17px;height:17px;flex:none;} body.er-theme .to-top{right:16px;bottom:96px;width:44px !important;height:44px !important;} body.er-theme .topbar{display:none;} body.er-theme .badge-float{padding:16px 18px;gap:12px;}} @media (min-width:1800px){ :root{--max:1880px;}} @media (prefers-reduced-motion:reduce){ *,*::before,*::after{animation-duration:.001s !important;transition-duration:.001s !important;} html{scroll-behavior:auto;} body.er-theme .marquee-track{animation:none !important;}} /* ============================================================ WORDPRESS ============================================================ */ body.er-theme .screen-reader-text{ position:absolute;width:1px;height:1px;padding:0;margin:-1px; overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; } body.er-theme .skip-link:focus{ position:fixed;top:12px;left:12px;z-index:200; width:auto;height:auto;clip:auto;margin:0; padding:12px 20px;border-radius:12px; background:var(--ink);color:#fff; font-family:var(--font-title);font-size:14px;font-weight:600; } /* The sticky header has to clear the admin bar for logged-in editors. */ body.er-theme .admin-bar .er-site-header{top:32px;} @media (max-width:782px){ body.er-theme .admin-bar .er-site-header{top:46px;}} /* ============================================================ ROLLOUT: SUPPRESSING THE OLD THEME'S CHROME The page-setting filters did not fire on the live install, so the theme still draws its own header and footer. These hide them once the matching part is switched on. Unticking the switch removes the body class and the old chrome comes straight back. ============================================================ */ body.er-theme.er-header-on #masthead, body.er-theme.er-header-on .header-top, body.er-theme.er-header-on #topbar{display:none !important;} body.er-theme.er-footer-on #colophon, body.er-theme.er-footer-on #scroll-to-top{display:none !important;} /* SiteOrigin's own header, footer and header phone widget carry .site-header, .site-footer and .header-call, so every rule the theme writes for those was landing on ours too — its header background, its paddings, its widget margins. Ours are .er-site-header / .er-site-footer / .er-call instead, and the two sets no longer meet. Its scroll script also adds .fixed to anything matching .site-header, which no longer reaches us either. */ body.er-theme header.er-site-header#header.fixed{box-shadow:0 8px 30px rgba(27,23,9,.09);} /* CF7 runs the form template through wpautop, wrapping every field in

and adding a
after each label, which breaks the grid. The filter in inc/cf7.php turns that off for our forms; this covers any that slip through (a hand-edited template, autop re-enabled elsewhere). */ body.er-theme .f-grid .field > p{margin:0;} body.er-theme .f-grid .field > p > br{display:none;} body.er-theme .wpcf7 form.er-form > p:last-of-type{margin:0;} /* ============================================================ ROLLOUT: THE HOMEPAGE INSIDE THE OLD THEME'S SHELL The theme wraps content in a fixed-width .corp-container and prints its own page banner above it. The redesign is full-bleed and brings its own banner, so both stand down — on the front page only, and only while the Homepage switch is on. ============================================================ */ body.er-theme.er-home-on .banner.blog-post, body.er-theme.er-home-on #yoast-breadcrumbs, body.er-theme.er-home-on .breadcrumbs, body.er-theme.er-home-on .entry-thumbnail{display:none !important;} body.er-theme.er-home-on #content, body.er-theme.er-home-on #content > .corp-container, body.er-theme.er-home-on #primary, body.er-theme.er-home-on #main{ max-width:none !important; width:auto !important; margin:0 !important; padding:0 !important; float:none !important; } body.er-theme.er-home-on #er-home{display:block;} /* ============================================================ INNER PAGE BANNER Reuses the homepage hero markup, so the styling comes for free. Only what an interior page needs differs: the page title is the H1 and therefore has to carry the display size (the hero's own h1 is its small eyebrow line), and the banner stands shorter. ============================================================ */ body.er-theme .page-hero .hero-stage{min-height:clamp(380px,42vw,560px);} body.er-theme .page-hero h1.hero-display{ display:block; color:#fff; font-size:clamp(32px,3.8vw,56px); line-height:1.06;letter-spacing:-.03em; margin:0 0 18px; } body.er-theme .page-hero h1.hero-display::before{content:none;} /* The old theme kept breadcrumbs in banner_content, so they render as a row rather than as body copy. */ body.er-theme .page-hero-crumbs{margin:0 0 30px;} body.er-theme .page-hero-crumbs ul{ display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px; list-style:none;margin:0;padding:0; } body.er-theme .page-hero-crumbs li{ color:rgba(255,255,255,.62);font-size:14.5px; display:flex;align-items:center;gap:10px; } body.er-theme .page-hero-crumbs li + li::before{ content:"";width:4px;height:4px;border-radius:50%; background:rgba(255,255,255,.35);flex:none; } body.er-theme .page-hero-crumbs a{color:rgba(255,255,255,.82);transition:color .25s ease;} body.er-theme .page-hero-crumbs a:hover{color:var(--green);} body.er-theme .page-hero-crumbs p{margin:0;color:rgba(255,255,255,.72);} /* The theme prints its own banner; ours replaces it. */ body.er-theme.er-pagetop-on .banner.blog-post, body.er-theme.er-pagetop-on .entry-thumbnail, body.er-theme.er-pagetop-on #yoast-breadcrumbs, body.er-theme.er-pagetop-on .breadcrumbs{display:none !important;} @media (max-width:1180px){ body.er-theme .page-hero .hero-stage{min-height:0;} } /* Editor output inside page.php / single.php. */ body.er-theme .er-entry .er-content{max-width:860px;} body.er-theme .er-entry .er-content h2{font-size:clamp(24px,2.4vw,34px);margin:1.6em 0 .5em;} body.er-theme .er-entry .er-content h3{font-size:clamp(19px,1.6vw,23px);margin:1.4em 0 .5em;} body.er-theme .er-entry .er-content ul,body.er-theme .er-entry .er-content ol{margin:0 0 1.15em 1.2em;list-style:revert;} body.er-theme .er-entry .er-content li{margin-bottom:.4em;} body.er-theme .er-entry .er-content a{color:var(--green-dark);text-decoration:underline;} body.er-theme .er-entry .er-content img{max-width:100%;height:auto;border-radius:var(--r-md);} body.er-theme .er-entry .er-content blockquote{ margin:1.6em 0;padding:4px 0 4px 24px; border-left:3px solid var(--green);color:#4a4536; } body.er-theme .alignleft{float:left;margin:0 1.5em 1em 0;} body.er-theme .alignright{float:right;margin:0 0 1em 1.5em;} body.er-theme .aligncenter{display:block;margin-inline:auto;} body.er-theme .wp-caption{max-width:100%;} body.er-theme .wp-caption-text{font-size:14px;color:var(--grey);margin-top:8px;}