/* ==========================================================================
   Nulectrics — Homepage sections (home_* layouts, added 2026-11-02)
   Layout and spacing only. Type sizes, weights, buttons and links all come from
   the theme. Offset sections share one 12 column grid, so 7/5, 5/7, 8/4 and 4/8
   land on the same column lines. A text column gets extra padding so its gap
   reads as 66px, which keeps those lines exact.
   ========================================================================== */

:root {
  --nu-home-star: #f5b800;
  --nu-home-gradient-x: linear-gradient(90deg, var(--nu-gradient-green-start) 0%, var(--nu-gradient-green-end) 100%);
  --nu-home-gradient-y: linear-gradient(135deg, var(--nu-gradient-green-start) 0%, var(--nu-gradient-green-end) 100%);
  --nu-home-rule: 4px;
  --nu-home-pair: 8px;
}

.nu-home { scroll-margin-top: var(--nu-header-h); }
.nu-home p { margin: 0; }
.nu-home h1, .nu-home h2, .nu-home h3 { margin: 0; text-wrap: balance; }
.nu-home ul { margin: 0; padding: 0; list-style: none; }
.nu-home figure { margin: 0; }
.nu-home blockquote { margin: 0; padding: 0; border: 0; }
.nu-home img { max-width: 100%; height: auto; }
.nu-home img:not(.nu-logo--light):not(.nu-logo--dark) { display: block; }
.nu-home-muted { color: var(--nu-theme-muted); }
.nu-home-small { font-size: var(--nu-fs-small); line-height: var(--nu-lh-snug); }
.nu-home-lead { font-size: var(--nu-fs-lead); }
.nu-home .nu-btn { min-height: 50px; padding: 12px 24px; font-weight: var(--nu-fw-bold); line-height: var(--nu-lh-snug); }
.nu-home .nu-cta-link { padding-block: 4px; font-weight: var(--nu-fw-bold); }

/* Links inside text stay underlined: link green against body text is under 3:1 */
.nu-home-hero__sub a, .nu-home-inline a, .nu-home-towns a, .nu-home-faq__list .nu-faq-accordion__answer a { text-decoration: underline; text-underline-offset: 3px; }

/* Cards: the heading is the link, stretched over the whole card */
.nu-home-card-link { color: inherit; }
.nu-home-card-link::after { content: ""; position: absolute; inset: 0; }
.nu-home-card-link:hover { color: inherit; text-decoration: none; }
.nu-home-card-link:focus-visible { outline: 0; }
.nu-home-card-link:focus-visible::after { outline: 2px solid var(--nu-theme-accent); outline-offset: 2px; }

/* Shared grid */
.nu-home-answer, .nu-home-reviews, .nu-home-work, .nu-home-areas, .nu-home-commercial, .nu-home-faq, .nu-home-estimate__grid, .nu-home-head { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--nu-gap); }
.nu-home-answer > :first-child { grid-column: span 7; padding-right: var(--nu-gap); }
.nu-home-answer > :last-child { grid-column: span 5; }
.nu-home-reviews > :first-child { grid-column: span 5; }
.nu-home-reviews > :last-child { grid-column: span 7; }
.nu-home-job--large { grid-column: span 7; grid-row: span 2; }
.nu-home-job:not(.nu-home-job--large) { grid-column: span 5; }
.nu-home-areas__map { grid-column: 6 / span 7; grid-row: 1; }
.nu-home-areas__lists { grid-column: 1 / span 5; grid-row: 1; padding-right: var(--nu-gap); }
.nu-home-commercial__text { grid-column: 1 / span 7; grid-row: 1; padding-right: var(--nu-gap); }
.nu-home-commercial > .nu-home-commercial__photo { grid-column: 8 / span 5; grid-row: 1; }
.nu-home-faq > :first-child { grid-column: span 4; padding-right: var(--nu-gap); }
.nu-home-faq > :last-child { grid-column: span 8; }
.nu-home-estimate__grid > :first-child { grid-column: span 5; padding-right: var(--nu-gap); }
.nu-home-estimate__grid > :last-child { grid-column: span 7; }

/* Section heading row */
.nu-home-head { row-gap: var(--nu-gap-sm); align-items: baseline; margin-bottom: var(--nu-gap); }
.nu-home-head > :first-child { grid-column: span 7; }
.nu-home-head > :last-child { grid-column: span 5; }
.nu-home-head--8-4 > :first-child { grid-column: span 8; }
.nu-home-head--8-4 > :last-child { grid-column: span 4; }
.nu-home-head--5-7 > :first-child { grid-column: span 5; }
.nu-home-head--5-7 > :last-child { grid-column: span 7; }

/* Hero: text on the page, photo running off the right edge */
.nu-home-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; }
.nu-home-hero__text { display: flex; flex-direction: column; justify-content: center; gap: var(--nu-gap-sm); padding: clamp(50px, 6vw, 99px) var(--nu-gap-lg) clamp(50px, 6vw, 99px) max(var(--nu-gutter), calc(100% - var(--nu-container) / 2 + var(--nu-gutter))); }
.nu-home-hero__ctas { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 26px; margin-top: 6px; }
.nu-home-hero__sub { display: flex; flex-direction: column; gap: 4px; }
.nu-home-hero__photo { position: relative; min-height: 560px; }
.nu-home .nu-home-hero__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 50%; }
.nu-home-hero__photo::before { content: ""; position: absolute; z-index: 1; inset: 0 auto 0 0; width: var(--nu-home-rule); background: var(--nu-home-gradient-y); }
.nu-home-hero__badge { position: absolute; z-index: 1; left: var(--nu-home-rule); bottom: 0; display: flex; align-items: center; gap: 14px; padding: 12px var(--nu-gap-sm); background: var(--nu-theme-bg); }
.nu-home-stars { color: var(--nu-home-star); letter-spacing: 3px; line-height: 1; white-space: nowrap; }

/* Accreditations bar */
.nu-home-trust { border-block: 1px solid var(--nu-theme-border); }
.nu-home-trust__list { display: flex; justify-content: space-between; }
.nu-home-trust__item { display: flex; align-items: center; gap: 12px; padding: var(--nu-gap-sm); border-left: 1px solid var(--nu-theme-border); min-width: 0; }
.nu-home-trust__item:first-child { border-left: 0; padding-left: 0; }
.nu-home-trust__item:last-child { padding-right: 0; }
.nu-home .nu-home-trust__logo { height: 36px; width: auto; max-width: 100px; object-fit: contain; flex: none; }
.nu-home-trust__item strong { display: block; color: var(--nu-theme-heading); line-height: var(--nu-lh-snug); }
.nu-home-trust__logo--mono { filter: brightness(0) invert(1); }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .nu-home-trust__logo--mono { filter: none; } }
[data-theme="light"] .nu-home-trust__logo--mono { filter: none; }

/* Answer + at a glance */
.nu-home-answer { align-items: start; }
.nu-home-answer__copy { display: flex; flex-direction: column; gap: var(--nu-gap-sm); }
.nu-home-plate { background: var(--nu-theme-bg-var-1); border-top: var(--nu-home-rule) solid; border-image: var(--nu-home-gradient-x) 1; }
.nu-home-plate__top { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px var(--nu-gap-sm); border-bottom: 1px solid var(--nu-theme-border); }
.nu-home .nu-home-plate__top img { height: 34px; width: auto; }
.nu-home-plate__top span { font-size: 0.75rem; font-weight: var(--nu-fw-bold); letter-spacing: var(--nu-ls-label); text-transform: uppercase; color: var(--nu-theme-heading); }
.nu-home-plate dl { margin: 0; padding: 4px var(--nu-gap-sm); }
.nu-home-plate dl div { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 12px; padding-block: 10px; border-bottom: 1px solid var(--nu-theme-border); }
.nu-home-plate dl div:last-child { border-bottom: 0; }
.nu-home-plate dt { font-weight: var(--nu-fw-bold); font-size: var(--nu-fs-small); line-height: var(--nu-lh-snug); color: var(--nu-theme-heading); }
.nu-home-plate dd { margin: 0; font-size: var(--nu-fs-small); line-height: var(--nu-lh-snug); }
.nu-home-plate__strip { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 4px var(--nu-gap-sm); padding: 12px var(--nu-gap-sm); background: var(--nu-theme-bg-var-2); }

/* Services */
.nu-home-services { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--nu-gap); }
.nu-home-service { position: relative; display: flex; flex-direction: column; background: var(--nu-theme-bg); transition: box-shadow var(--nu-transition-fast); }
.nu-home-service:hover, .nu-home-job:hover { box-shadow: var(--nu-glow-hover); }
.nu-home-service:hover h3, .nu-home-mini:hover h3, .nu-home-job:hover h3 { color: var(--nu-theme-accent); }
.nu-home-service:hover .nu-home-service__go { animation: nu-link-hover 0.8s ease-in-out forwards; }
.nu-home .nu-home-service img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.nu-home-service__body { display: flex; flex-direction: column; gap: var(--nu-home-pair); padding: var(--nu-gap); flex: 1; border-top: var(--nu-home-rule) solid; border-image: var(--nu-home-gradient-x) 1; }
.nu-home-service__body p { margin-bottom: 12px; }
.nu-home-service__go { margin-top: auto; align-self: flex-start; }
.nu-home-minis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--nu-gap); margin-top: var(--nu-gap); }
.nu-home-mini { position: relative; display: flex; flex-direction: column; gap: var(--nu-home-pair); padding: var(--nu-gap-sm) 0; border-bottom: 1px solid var(--nu-theme-border); }
.nu-home-mini h3, .nu-home-job__text h3 { font-size: var(--nu-fs-lead); line-height: var(--nu-lh-tight); }

/* Reviews */
.nu-home-rating { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; }
.nu-home-reviews { align-items: stretch; }
.nu-home-review-lead { display: flex; flex-direction: column; gap: var(--nu-gap-sm); justify-content: center; padding: var(--nu-gap); background: var(--nu-theme-bg-var-1); border-top: var(--nu-home-rule) solid; border-image: var(--nu-home-gradient-x) 1; }
.nu-home-review-lead blockquote { font-size: var(--nu-fs-h3); font-weight: var(--nu-fw-bold); line-height: var(--nu-lh-snug); color: var(--nu-theme-heading); }
.nu-home-review-list { display: flex; flex-direction: column; justify-content: space-between; }
.nu-home-review { display: flex; flex-direction: column; gap: var(--nu-home-pair); padding-block: var(--nu-gap-sm); border-bottom: 1px solid var(--nu-theme-border); }
.nu-home-review:first-child { padding-top: 0; }
.nu-home-review:last-child { border-bottom: 0; padding-bottom: 0; }
.nu-home-who { font-weight: var(--nu-fw-bold); color: var(--nu-theme-heading); }
.nu-home-prompt { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--nu-gap-sm) var(--nu-gap); margin-top: var(--nu-gap); padding-top: var(--nu-gap); border-top: 1px solid var(--nu-theme-border); }
.nu-home-prompt__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--nu-gap-sm) 26px; }

/* Recent work */
.nu-home-work { grid-template-rows: 1fr 1fr; row-gap: var(--nu-gap); }
.nu-home-job { position: relative; display: flex; flex-direction: column; background: var(--nu-theme-bg); transition: box-shadow var(--nu-transition-fast); }
.nu-home .nu-home-job img { width: 100%; height: 100%; flex: 1 1 0; min-height: 170px; object-fit: cover; }
.nu-home .nu-home-job--large img { min-height: 380px; }
.nu-home-job__text { padding: var(--nu-gap-sm); display: flex; flex-direction: column; gap: var(--nu-home-pair); border-top: var(--nu-home-rule) solid; border-image: var(--nu-home-gradient-x) 1; }

/* Where we work */
.nu-home-areas { align-items: start; }
.nu-home-areas__map { display: flex; flex-direction: column; gap: var(--nu-home-pair); }
.nu-home-map { position: relative; aspect-ratio: 640 / 430; overflow: hidden; background: var(--nu-theme-bg-var-1); }
.nu-home-map svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.nu-home-map circle.ring { fill: var(--nu-theme-accent-subtle); stroke: var(--nu-theme-accent); stroke-width: 1; stroke-opacity: 0.5; }
.nu-home-map circle.ring--outer { fill: none; stroke-dasharray: 3 5; }
.nu-home-map circle.ring--mid { fill-opacity: 0.45; stroke-dasharray: 3 5; }
.nu-home-map text { font-family: var(--nu-font); font-size: 12px; fill: var(--nu-theme-muted); }
.nu-home-map__hex { fill: var(--nu-theme-accent); }
.nu-home-pin { display: none; position: absolute; transform: translate(-50%, -50%); width: 9px; height: 9px; background: var(--nu-theme-muted); }
.nu-home-map.is-ready .nu-home-pin { display: block; }
.nu-home-pin--main { width: 12px; height: 12px; background: var(--nu-theme-accent); }
.nu-home-pin > span { position: absolute; top: 50%; transform: translateY(-50%); left: calc(100% + 6px); font-size: var(--nu-fs-small); line-height: 1.2; white-space: nowrap; color: var(--nu-theme-text); }
.nu-home-pin--main > span { font-weight: var(--nu-fw-bold); color: var(--nu-theme-heading); }
.nu-home-pin--left > span { left: auto; right: calc(100% + 6px); }
.nu-home-areas__lists { display: flex; flex-direction: column; gap: var(--nu-gap-sm); }
.nu-home-areas__label { font-weight: var(--nu-fw-bold); color: var(--nu-theme-heading); margin-bottom: var(--nu-home-pair) !important; }
.nu-home-towns li { display: flex; justify-content: space-between; gap: 12px; padding-block: var(--nu-home-pair); border-bottom: 1px solid var(--nu-theme-border); }
.nu-home-towns a { font-weight: var(--nu-fw-bold); }

/* Commercial band */
.nu-home-commercial { align-items: center; }
.nu-home .nu-home-commercial__photo { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-top: var(--nu-home-rule) solid; border-image: var(--nu-home-gradient-x) 1; }
.nu-home-commercial__text { display: flex; flex-direction: column; gap: var(--nu-gap-sm); }
.nu-home-clients { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 34px; }
.nu-home .nu-home-clients img { height: 30px; width: auto; max-width: 110px; }

/* FAQs */
.nu-home-faq { align-items: start; }
.nu-home-faq__side { position: sticky; top: calc(var(--nu-header-h) + 20px); display: flex; flex-direction: column; gap: var(--nu-gap-sm); }
.nu-home .nu-home-faq__photo { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: 50% 0; }
.nu-home-faq__list .nu-faq-accordion__answer p { margin-bottom: var(--nu-gap-sm); }

/* Estimate */
.nu-home-estimate__grid { align-items: start; }
.nu-home-estimate__intro { display: flex; flex-direction: column; gap: var(--nu-gap-sm); }
.nu-home-ticks { display: flex; flex-direction: column; gap: var(--nu-home-pair); }
.nu-home-ticks li { position: relative; padding-left: 22px; }
.nu-home-ticks li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 9px; height: 9px; background: var(--nu-home-gradient-y); }
.nu-home .nu-home-phone { font-size: var(--nu-fs-h3); line-height: var(--nu-lh-tight); }
.nu-home-estimate__call { display: flex; flex-direction: column; align-items: flex-start; gap: var(--nu-home-pair); }

/* Form: two columns, labels in sentence case. Optional fields say so in their label. */
.nu-home-estimate .gform_wrapper .gform_fields { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: var(--nu-gap-sm) !important; }
.nu-home-estimate .gform_wrapper .gfield--width-full { grid-column: 1 / -1 !important; }
.nu-home-estimate .gform_wrapper .gfield_label { color: var(--nu-theme-heading) !important; text-transform: none !important; letter-spacing: normal !important; margin-bottom: var(--nu-home-pair) !important; }
.nu-home-estimate .gform_wrapper .gfield_required { display: none; }
.nu-home-estimate .gform_wrapper .nu-choice-buttons .gchoice label.gform-field-label { min-height: 50px; padding: 12px 24px !important; line-height: var(--nu-lh-snug) !important; }
.nu-home-estimate .gform_wrapper .gform_footer { margin-top: var(--nu-gap-sm) !important; }

/* The estimate form submits with a real button, unlike the link-style submit elsewhere. */
.nu-home-estimate .gform_wrapper .gform_button,
.nu-home-estimate .gform_wrapper input[type="submit"].gform_button { min-height: 50px !important; padding: 12px 24px !important; font-size: var(--nu-fs-body) !important; font-weight: var(--nu-fw-bold) !important; color: var(--nu-bg-dark) !important; background-color: var(--nu-green) !important; background-image: none !important; border: 2px solid var(--nu-green) !important; transition: background-color var(--nu-transition-fast), border-color var(--nu-transition-fast); }
.nu-home-estimate .gform_wrapper .gform_button:hover,
.nu-home-estimate .gform_wrapper input[type="submit"].gform_button:hover { color: var(--nu-bg-dark) !important; background-color: var(--nu-blue) !important; border-color: var(--nu-blue) !important; text-decoration: underline !important; text-underline-offset: 3px; animation: none; }

@media (max-width: 1100px) {
  .nu-home-trust__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .nu-home-trust__item { padding: 16px; }
  .nu-home-trust__item:nth-child(4) { border-left: 0; padding-left: 0; }
  .nu-home-trust__item:nth-child(n+4) { border-top: 1px solid var(--nu-theme-border); }
  .nu-home-trust__item:last-child { grid-column: 2 / -1; }
}

@media (max-width: 900px) {
  .nu-home.nu-pad-top--lg { padding-top: var(--nu-pad-md); }
  .nu-home.nu-pad-bottom--lg { padding-bottom: var(--nu-pad-md); }
  .nu-home-answer, .nu-home-reviews, .nu-home-areas, .nu-home-faq, .nu-home-estimate__grid, .nu-home-commercial { row-gap: var(--nu-gap); }
  .nu-home-answer > *, .nu-home-reviews > *, .nu-home-faq > *, .nu-home-estimate__grid > *, .nu-home-head > *, .nu-home-head--5-7 > *, .nu-home-head--8-4 > *, .nu-home-areas__map, .nu-home-areas__lists, .nu-home-commercial__text, .nu-home-commercial > .nu-home-commercial__photo { grid-column: 1 / -1 !important; grid-row: auto !important; padding-inline: 0 !important; }
  .nu-home-faq__side { position: static; }
  .nu-home .nu-home-faq__photo { display: none; }
  .nu-home-minis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nu-home-services { grid-template-columns: minmax(0, 1fr); }
  .nu-home-service { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
  .nu-home .nu-home-service img { height: auto; }
}

@media (max-width: 767px) {
  .nu-home.nu-pad-top--lg { padding-top: var(--nu-gap-lg); }
  .nu-home.nu-pad-bottom--lg { padding-bottom: var(--nu-gap-lg); }
  .nu-home-answer, .nu-home-reviews, .nu-home-work, .nu-home-areas, .nu-home-commercial, .nu-home-faq, .nu-home-estimate__grid, .nu-home-head { grid-template-columns: minmax(0, 1fr); column-gap: 0; }
  .nu-home-hero { grid-template-columns: minmax(0, 1fr); }
  .nu-home-hero__text { padding: 33px var(--nu-gutter); gap: 16px; }
  .nu-home-hero__ctas { display: none; }
  .nu-home-hero__photo { min-height: 0; aspect-ratio: 16 / 10; }
  .nu-home-hero__photo::before { inset: 0 0 auto 0; width: auto; height: var(--nu-home-rule); background: var(--nu-home-gradient-x); }
  .nu-home-hero__badge { left: 0; padding: 10px 14px; }
  .nu-home-trust__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nu-home-trust__item, .nu-home-trust__item:first-child { flex-direction: column; align-items: flex-start; gap: 6px; padding: 12px 8px; border-left: 0; border-top: 1px solid var(--nu-theme-border); }
  .nu-home-trust__item:nth-child(-n+2) { border-top: 0; }
  .nu-home-trust__item:nth-child(4) { padding-left: 8px; }
  .nu-home-trust__item:last-child { grid-column: 1 / -1; }
  .nu-home .nu-home-trust__logo { height: 30px; }
  .nu-home-plate dl div { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .nu-home-service { display: flex; }
  .nu-home .nu-home-service img { aspect-ratio: 16 / 9; }
  .nu-home-service__body, .nu-home-review-lead { padding: var(--nu-gap-sm); }
  .nu-home-minis { grid-template-columns: minmax(0, 1fr); }
  .nu-home-work { grid-template-rows: none; }
  .nu-home-job--large, .nu-home-job:not(.nu-home-job--large) { grid-column: 1 / -1; grid-row: auto; }
  .nu-home .nu-home-job img, .nu-home .nu-home-job--large img { flex: none; height: auto; min-height: 0; aspect-ratio: 16 / 10; }
  .nu-home-pin--wide { display: none !important; }
  .nu-home-pin--up > span { left: 50%; top: auto; bottom: calc(100% + 3px); transform: translateX(-30%); }
  .nu-home-pin--down > span { left: 50%; top: calc(100% + 3px); bottom: auto; transform: translateX(-50%); }
  .nu-home-map text { font-size: 20px; }
  .nu-home-map text.ring-5 { display: none; }
  .nu-home .nu-home-commercial__photo { aspect-ratio: 16 / 9; }
  .nu-home-review-lead blockquote { font-size: var(--nu-fs-lead); }
  .nu-home-estimate .gform_wrapper .gform_fields { grid-template-columns: minmax(0, 1fr) !important; }
  .nu-home-estimate .gform_wrapper .nu-choice-buttons .gchoice { flex: 1 1 auto; }
  .nu-home-estimate .gform_wrapper .nu-choice-buttons .gchoice label.gform-field-label { display: flex !important; justify-content: center; padding-inline: 14px !important; }
  .nu-home-estimate .gform_wrapper .gform_button,
  .nu-home-estimate .gform_wrapper input[type="submit"].gform_button { width: 100% !important; }
}