:root{--ink:#0b1118;--navy:#111c28;--yellow:#ffc400;--white:#fff;--muted:#9aa6b2;--line:#293440;--max:1180px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--white);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.55}
a{color:inherit;text-decoration:none}
.site-header{height:84px;display:flex;align-items:center;gap:36px;padding:0 max(24px,calc((100vw - var(--max))/2));background:#0a1016;border-bottom:1px solid var(--line);position:relative;z-index:5}
.brand{display:flex;align-items:center;gap:12px;margin-right:auto}
.brand-mark{display:grid;place-items:center;width:43px;height:43px;background:var(--yellow);color:#0b1118;font-size:29px;font-weight:900;transform:skew(-8deg)}
.brand strong{display:block;font-size:24px;line-height:1;letter-spacing:.04em}
.brand small{display:block;color:#c5ccd3;font-size:11px;letter-spacing:.07em;margin-top:5px;text-transform:uppercase}
.site-header nav{display:flex;gap:28px;color:#dce1e6;font-weight:700;font-size:14px}
.site-header nav a:hover{color:var(--yellow)}
.header-call{border:1px solid #44515e;padding:11px 16px;font-weight:800}
.hero{min-height:680px;position:relative;display:flex;align-items:center;overflow:hidden}
.hero-photo{position:absolute;inset:0;background:url('assets/electrician-at-work.jpeg') center 47%/cover no-repeat}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,8,12,.96) 0%,rgba(4,8,12,.82) 43%,rgba(4,8,12,.2) 75%),linear-gradient(0deg,rgba(4,8,12,.75),transparent 55%)}
.hero-content{position:relative;width:min(var(--max),calc(100% - 48px));margin:auto;padding:86px 0 110px}
.eyebrow,.kicker{color:var(--yellow);font-size:13px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.eyebrow{display:flex;align-items:center;gap:10px}
.eyebrow span{width:30px;height:3px;background:var(--yellow)}
h1{font-size:clamp(45px,6.2vw,84px);line-height:.98;letter-spacing:-.045em;max-width:850px;margin:24px 0}
h1 em{color:var(--yellow);font-style:normal}
.hero-content p{font-size:20px;color:#d6dce1;max-width:610px}
.hero-actions{display:flex;gap:12px;margin-top:38px}
.btn{padding:16px 22px;font-weight:900;text-transform:uppercase;letter-spacing:.05em;font-size:14px}
.btn.primary{background:var(--yellow);color:var(--ink)}
.btn.ghost{border:1px solid #75808b}
.hero-badge{position:absolute;right:max(24px,calc((100vw - var(--max))/2));bottom:0;display:flex;align-items:center;gap:14px;background:var(--yellow);color:var(--ink);padding:20px 28px;text-transform:uppercase;letter-spacing:.08em}
.hero-badge span{font-size:24px}
.trust{display:grid;grid-template-columns:repeat(4,1fr);max-width:var(--max);margin:auto;border-left:1px solid var(--line)}
.trust div{padding:30px 25px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.trust strong,.trust span{display:block}
.trust strong{font-size:20px}
.trust span{color:var(--muted);font-size:14px}
.section{max-width:var(--max);margin:auto;padding:110px 24px}
.section-heading{max-width:760px}
.section-heading.row{max-width:none;display:flex;justify-content:space-between;align-items:end;gap:60px}
.section-heading.row>p{max-width:430px;color:var(--muted)}
h2{font-size:clamp(36px,4.5vw,62px);line-height:1.05;letter-spacing:-.04em;margin:13px 0 18px}
.section-heading>p{color:var(--muted);font-size:18px}
.service-grid{display:grid;grid-template-columns:repeat(2,1fr);margin-top:55px;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.service-grid article{padding:38px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--navy);position:relative}
.service-grid article:hover{background:#172635}
.service-grid .num{color:var(--yellow);font-weight:900;font-size:13px}
.service-grid h3{font-size:27px;margin:30px 0 10px}
.service-grid p{color:var(--muted);margin:0;max-width:450px}
.work{padding-top:70px}
.gallery{display:grid;grid-template-columns:1.2fr .8fr;grid-template-rows:380px 380px;gap:14px;margin-top:48px}
.gallery figure{margin:0;position:relative;overflow:hidden;background:#18232e}
.gallery figure.wide{grid-row:span 1}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease}
.gallery figure:hover img{transform:scale(1.025)}
.gallery figcaption{position:absolute;left:0;right:0;bottom:0;padding:50px 24px 20px;background:linear-gradient(transparent,rgba(2,6,9,.92));display:flex;justify-content:space-between;align-items:end}
.gallery figcaption b{font-size:19px}
.gallery figcaption span{color:var(--yellow);font-size:13px;text-transform:uppercase;font-weight:800}
.reviews{border-top:1px solid var(--line)}
.reviews-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:46px}
.reviews-heading h2{max-width:740px}
.google-rating{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:14px;min-width:220px;padding:18px 20px;border:1px solid var(--line);background:var(--navy)}
.google-rating strong{grid-row:1/3;font-size:45px;line-height:1;color:var(--white)}
.review-stars,.card-stars{color:var(--yellow);letter-spacing:.1em}
.review-stars{font-size:18px}
.google-rating small{color:var(--muted);font-size:13px}
.review-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.review-card{display:flex;flex-direction:column;min-height:285px;padding:30px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--navy)}
.card-stars{font-size:17px}
.review-card blockquote{margin:24px 0 30px;color:#e8edf1;font-size:17px;line-height:1.65}
.review-card p{margin:auto 0 0}
.review-card strong,.review-card span{display:block}
.review-card strong{font-size:16px;color:var(--white)}
.review-card span{margin-top:3px;color:var(--muted);font-size:13px}
.review-actions{display:flex;gap:12px;margin-top:30px}
.review-btn{background:var(--yellow);color:var(--ink);display:flex;align-items:center;gap:18px;white-space:nowrap}
.review-btn span{font-size:25px;line-height:1}
.review-btn:hover{background:#ffda45}
.review-link{border:1px solid #75808b}
.contact{max-width:none;background:var(--yellow);color:var(--ink);display:grid;grid-template-columns:1fr 1fr;gap:80px;padding-left:max(24px,calc((100vw - var(--max))/2));padding-right:max(24px,calc((100vw - var(--max))/2))}
.contact .kicker{color:#3b3000}
.contact p{max-width:540px}
.contact-links{display:flex;flex-direction:column;justify-content:center}
.contact-links a{display:grid;grid-template-columns:1fr auto;align-items:center;border-top:2px solid rgba(0,0,0,.3);padding:20px 0}
.contact-links a:last-child{border-bottom:2px solid rgba(0,0,0,.3)}
.contact-links small{grid-column:1;text-transform:uppercase;font-weight:800;letter-spacing:.1em}
.contact-links strong{grid-column:1;font-size:clamp(17px,2vw,24px);word-break:break-word}
.contact-links span{grid-column:2;grid-row:1/3;font-size:30px}
footer{max-width:var(--max);margin:auto;padding:48px 24px;display:grid;grid-template-columns:1fr auto;gap:12px 30px;align-items:center;color:var(--muted);font-size:13px}
.footer-brand{grid-row:span 4}
.footer-brand strong{color:#fff}
.footer-links a{color:var(--white);text-decoration:underline;text-underline-offset:3px}
.footer-links a:hover{color:var(--yellow)}
@media(max-width:820px){.site-header{height:74px;padding:0 18px}
.site-header nav,.header-call{display:none}
.brand small{font-size:9px}
.hero{min-height:670px}
.hero-photo{background-position:60% center}
.hero-shade{background:linear-gradient(90deg,rgba(4,8,12,.95),rgba(4,8,12,.56)),linear-gradient(0deg,rgba(4,8,12,.8),transparent)}
.hero-content{width:calc(100% - 36px);padding-top:55px}
.hero-actions{flex-direction:column;align-items:stretch;max-width:330px;text-align:center}
.hero-badge{right:0;padding:15px 18px}
.trust{grid-template-columns:1fr 1fr}
.section{padding:78px 18px}
.section-heading.row{display:block}
.service-grid{grid-template-columns:1fr}
.service-grid article{padding:28px}
.gallery{grid-template-columns:1fr;grid-template-rows:repeat(4,310px)}
.gallery figure.wide{grid-row:auto}
.reviews-heading{display:block}
.google-rating{margin-top:25px;width:max-content}
.review-grid{grid-template-columns:1fr}
.review-card{min-height:0}
.review-actions{flex-direction:column}
.review-btn{justify-content:space-between;white-space:normal}
.contact{grid-template-columns:1fr;gap:35px;padding:75px 18px}
footer{display:block;padding:40px 18px}
footer p{margin-top:22px}
}
@media(max-width:440px){h1{font-size:44px}
.hero-content p{font-size:18px}
.trust div{padding:22px 16px}
.trust strong{font-size:16px}
.gallery{grid-template-rows:repeat(4,270px)}
}