/* J&J Electrical Solutions (9 Nov 2026): the few things that differ from the JJC look (css/jjc.css), loaded last. */

/* logo: J&J's redrawn SVG lockup is wider than JJC's stacked logo (4.8:1 vs 2.5:1), so it sits a little lower */
.jj .logo img{height:34px;width:auto}
@media (max-width:440px){.jj .logo img{height:26px}}   /* phones: logo + call button + menu must fit 343px */
@media (max-width:359px){.jj .logo img{height:22px}}
.jj .foot-brand img{height:44px;width:auto}

/* footer: the old page's "multiple phone lines" note with the second number */
.jj .foot-lines{margin-top:10px;font-size:13px;line-height:1.5;color:rgba(255,255,255,.66);max-width:34ch}
.jj .foot-lines a{color:#fff;font-weight:700;white-space:nowrap;text-decoration:underline;text-underline-offset:3px}

/* hero: a photo instead of JJC's video (the <img> keeps the .hero-vid class, so the same crop, mask and shade apply) */
.jj .hero picture{display:contents}

/* service pages: phone hero backgrounds (JJC's rules point at its own video posters) and where each photo's subject sits */
@media (max-width:700px){
  .jj.pg-emergency-electrician .hero{background-image:url(../assets/img/jj-hero-m.jpg)}
  .jj.pg-switchboard-upgrades .hero{background-image:url(../assets/img/jj-sb-hero-m.jpg)}
  .jj.pg-lighting-fans-smoke-alarms .hero{background-image:url(../assets/img/jj-li-hero-m.jpg)}
  .jj.pg-rewiring-renovations .hero{background-image:url(../assets/img/jj-rw-hero-m.jpg)}
}
@media (min-width:701px){
  .jj.pg-switchboard-upgrades .hero-vid{object-position:88% 40%}   /* hands on the board, not Jarrod's arm */
  .jj.pg-lighting-fans-smoke-alarms .hero-vid{object-position:60% 30%}
}
