/* DTE Electrical – styles mirroring the original WordPress theme "Home Services Blocks" (palette/fonts from its theme.json + global styles) */
:root{--primary:#6FBE3D;--primary-light:#D4FBBD;--heading:#1D1D1D;--text:#1D1D1D;--base:#fbfbfb;--section-bg:#f7f7f2;--topbar:#222222;--border:#dfdfdf;--white:#fff;
--poppins:"Poppins",sans-serif;--script:"Cedarville Cursive",cursive}
*{box-sizing:border-box}
body{margin:0;background:var(--base);color:var(--text);font-family:var(--poppins);font-size:17px;font-weight:400;line-height:1.5rem}
img{max-width:100%;height:auto;vertical-align:middle}
a{color:var(--heading);transition:all .2s ease-in-out}a:hover,a:focus{color:var(--primary)}
h1,h2,h3,h4,h5,h6{color:var(--heading);font-family:var(--poppins);font-weight:700}
h1{font-size:50px;line-height:1.5}h2{font-size:44px;line-height:1.3}h3{font-size:28px}
.wrap{width:80%;max-width:1170px;margin:0 auto}
.skip{position:absolute;left:-999px}.skip:focus{left:10px;top:10px;background:#fff;padding:8px;z-index:99}
/* top bar */
.topbar{background:var(--topbar);color:#fff;padding:1rem 0}
.topbar .wrap{display:flex;align-items:center;gap:24px}
.topbar p{flex:1;margin:0 0 0 10%;text-align:center;font-size:12px;font-weight:500;line-height:1.5}
.topbar .fb,.site-footer .fb{color:#fff;display:inline-flex}.topbar .fb svg{width:16px;height:16px}
/* upper header: logo + green info box with arrow */
.upper{background:var(--section-bg);overflow:hidden}
.upper .wrap{display:flex;align-items:center;gap:24px}
.logo{flex:0 0 30%}.logo img{display:block;max-width:220px;padding:6px 0}
.infobox{flex:1;position:relative;background:var(--primary);box-shadow:300px 0 0 0 var(--primary);padding:.67rem 1.5rem;display:flex;justify-content:flex-end;gap:24px}
.infobox:before{content:"";position:absolute;border-style:solid;border-width:35px 35px 35px 0;left:-34px;top:50%;transform:translateY(-50%);border-color:transparent var(--primary) transparent transparent}
.info{display:flex;align-items:center;gap:14px;flex:1;justify-content:flex-end}
.info .b,.info .s{display:block;color:#fff;text-decoration:none;line-height:1.6}.info .b{font-size:14px;font-weight:700}.info .s{font-size:12px}
.info a:hover{color:var(--heading)}
/* menu */
.menubar{background:var(--base);padding:.44rem 0}
nav ul{list-style:none;display:flex;gap:24px;margin:0;padding:0}
nav a{position:relative;text-decoration:none;color:var(--text);font-size:16px;font-weight:500;text-transform:uppercase;letter-spacing:1.5px}
nav a:before{content:"";background:var(--primary);opacity:0;height:2px;width:0;left:0;right:0;margin:0 auto;bottom:-2px;position:absolute;transition:width .5s,opacity .5s}
nav a:hover,nav a:focus,nav a[aria-current]{color:var(--primary)}nav a:hover:before,nav a[aria-current]:before{opacity:1;width:calc(100% - 3px)}
.burger{display:none;cursor:pointer;padding:8px 0}.burger span{display:block;width:26px;height:3px;background:var(--heading);margin:5px 0}
/* buttons */
.btn,.form button{display:inline-block;background:var(--primary);color:#fff;border:0;padding:.44rem calc(1.333em + 2px);font:600 16px/1.5 var(--poppins);text-transform:uppercase;text-decoration:none;cursor:pointer;transition:all .3s}
.btn:hover,.btn:focus,.form button:hover{background:var(--heading);color:#fff}
/* hero */
.hero{position:relative;min-height:600px;display:flex;align-items:center;background:#000 center/cover no-repeat;color:#fff}
.hero:before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.7)}
.hero .wrap{position:relative;padding:60px 0}.hero .wrap>*{max-width:80%}
.heading-block{position:relative}
.script{font-family:var(--script);font-size:18px;color:#fff;margin:0 0 6px}.script.dark{color:var(--heading)}
.text-img{position:absolute;left:44px;top:23px;width:auto}.about-content .text-img{left:0}
.hero h1{color:#fff;font-size:22px;font-weight:600;line-height:1.5;margin:24px 0}
/* about */
.about-us{padding:5.06rem 0}
.about{display:flex;gap:2em;align-items:center}
.about-imgs{flex:0 0 50%;position:relative;padding-bottom:70px}
.about-imgs .a1{width:70%;border-radius:20px;transition:all .4s}
.about-imgs .a2{position:absolute;width:42%;right:0;bottom:0;border-radius:20px;box-shadow:-12px 12px 0 0 var(--primary);transition:all .4s;aspect-ratio:4/3;object-fit:cover}
.about-imgs img:hover{transform:scale(.9)}
.about-content{flex:1}.about-content h2{font-size:28px;line-height:1.5;margin:24px 0}.about-content>p{font-size:16px}
.about-info{display:grid;grid-template-columns:1fr 1fr;gap:0 2em}.about-info h3{font-size:28px;font-weight:600;line-height:1.1;margin:24px 0 .44rem}.about-info p{font-size:14px;margin:.44rem 0}
/* inner pages */
.pagehead{position:relative;background:#000 center/cover no-repeat;color:#fff;padding:80px 0}
.pagehead:before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.5)}
.pagehead .wrap{position:relative}.pagehead h1{color:#fff;margin:0;font-size:32px;text-transform:uppercase}
section.prose{padding:40px 0}.prose h2{font-size:28px;line-height:1.4}.prose li{margin:4px 0}.c{text-align:center}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-bottom:40px}.gallery img{width:100%;aspect-ratio:3/4;object-fit:cover}
section.wrap.c{padding-bottom:50px}
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.form label{display:block;margin:14px 0 8px;font-size:12px;font-weight:700;text-transform:uppercase}
.form input,.form textarea{width:100%;padding:10px 15px;border:1px solid var(--border);background:none;font:inherit;line-height:20px}
.form input:focus,.form textarea:focus{border-color:var(--primary);outline:0}.form button{margin-top:16px;letter-spacing:2px}
iframe{max-width:100%;border:0}
/* footer */
.site-footer{position:relative;background:#000 center/cover no-repeat;color:#fff;font-size:16px}
.site-footer:before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.8)}
.site-footer .wrap{position:relative}
.site-footer .cols{display:grid;grid-template-columns:repeat(3,1fr);gap:2em;padding:60px 0}
.site-footer a{color:#fff;text-decoration:none}.site-footer a:hover{color:var(--primary)}
.ft{font-size:22px;font-weight:700;margin:0 0 16px}.fh{font-size:22px;font-weight:700;letter-spacing:1px;margin:0 0 16px}
.sm{font-size:14px}.site-footer ul{margin:0;padding-left:18px}.site-footer li{margin-top:10px}
.site-footer .info{justify-content:flex-start;align-items:flex-start}.site-footer .info p{margin:0}
.rights{border-top:1px solid #fff;padding:1.5rem 0 20px;text-align:center}.rights p{margin:0}.rights a{color:var(--primary)}
/* responsive (breakpoints follow the theme) */
@media(max-width:1110px){.about-content h3,.about-info h3{font-size:20px}.about-us{padding:30px 0}}
@media(max-width:999px){.infobox:before{display:none}
 .burger{display:block}nav ul{display:none;flex-direction:column;gap:0;border:1px solid var(--border);border-top-color:var(--primary);border-bottom-color:var(--primary);background:#fff}
 #mt:checked~ul{display:flex}nav li a{display:block;padding:12px 24px;border-bottom:1px solid var(--border)}nav a:before{display:none}}
@media(max-width:781px){.wrap{width:90%}.upper{background:var(--primary);padding:20px 0}.upper .wrap{flex-direction:column}.logo{display:flex;justify-content:center;background:var(--section-bg);padding:6px 16px;border-radius:6px}
 .infobox{box-shadow:none;padding:0;justify-content:center;flex-wrap:wrap}.info{justify-content:center}
 .about{flex-direction:column}.about-imgs{width:100%}.site-footer .cols,.cols2{grid-template-columns:1fr 1fr}.hero{min-height:480px}.hero .wrap>*{max-width:100%}}
@media(max-width:600px){.topbar p{margin:0;font-size:10px}.text-img{display:none}.hero .wrap,.about-content{text-align:center}
 .about-info,.site-footer .cols,.cols2{grid-template-columns:1fr}.gallery{grid-template-columns:1fr 1fr}h1{font-size:34px}.about-content h2,.prose h2{font-size:22px}h2{font-size:28px}}