/*
Theme Name: Northfield Plumbing and Heating
Template: joydea-base
Description: Joydea child theme for northfield.joydea.com. Generated by provision.py; brand values live in the site config.
Version: 1.0.0
Text Domain: joydea-northfield
*/


:root { --nf-navy:#10263F; --nf-blue:#1C6FB0; --nf-orange:#F26B1D; --nf-orange-d:#D95A12; --nf-ink:#10263F; --nf-muted:#55657A; --nf-line:#E1E7EF; --nf-soft:#F5F9FD; --nf-green:#1E8A4C; }
body { background:#fff; color: var(--nf-ink); }
.nf-wrap { max-width: 1240px; margin: 0 auto; padding: 0 32px; }
.nf-narrow { max-width: 800px; margin: 0 auto; }
h1,h2,h3,.nf-h1,.nf-h2,.nf-h3 { font-family: var(--wp--preset--font-family--heading); font-weight: 900; letter-spacing:-.02em; line-height:1.04; color: var(--nf-ink); }
.nf-h1 { font-size: clamp(2.3rem, 4.4vw, 4rem); margin: .8rem 0 1rem; }
.nf-h2 { font-size: clamp(1.7rem, 2.8vw, 2.6rem); margin: 0 0 .8rem; }
.nf-h3 { font-size: 1.6rem; margin: 0 0 .4rem; }
.nf-lead { color: var(--nf-muted); font-size: 1.15rem; line-height: 1.6; margin: 0 0 1.5rem; max-width: 540px; }
.nf-sub { color: var(--nf-muted); font-size: 1rem; line-height: 1.6; margin: 0 0 1rem; }
.nf-fine { color: var(--nf-muted); font-size: .85rem; text-align:center; margin: .8rem 0 0; }
.nf-fine a { color: var(--nf-orange); font-weight: 700; text-decoration:none; }
.nf-section { padding: 5rem 0; }
.nf-head { display:flex; justify-content:space-between; align-items:flex-end; gap: 2rem; margin-bottom: 2rem; }
.nf-link { color: var(--nf-blue); font-weight:700; text-decoration:none; white-space:nowrap; }
.nf-note { color: rgba(255,255,255,.8); font-size:.95rem; white-space:nowrap; }
.nf-btns { display:flex; gap: .9rem; flex-wrap:wrap; align-items:center; }
.nf-btn { display:inline-flex; align-items:center; justify-content:center; gap:.6rem; padding: 1rem 1.6rem; border-radius: 10px; font-weight: 700; font-size: 1rem; text-decoration:none; transition: transform .15s, background .15s, color .15s; }
.nf-btn:hover { transform: translateY(-1px); }
.nf-btn-orange { background: var(--nf-orange); color:#fff; box-shadow: 0 8px 20px -10px rgba(242,107,29,.8); } .nf-btn-orange:hover { background: var(--nf-orange-d); color:#fff; }
.nf-btn-navy { background: var(--nf-navy); color:#fff; } .nf-btn-navy:hover { background: var(--nf-orange); color:#fff; }
.nf-btn-line { border: 2px solid var(--nf-navy); color: var(--nf-navy); } .nf-btn-line:hover { background: var(--nf-navy); color:#fff; }
.nf-btn-ic { width:20px; height:20px; display:inline-flex; } .nf-btn-ic svg { width:20px; height:20px; }
.nf-tag { display:inline-flex; align-items:center; gap:.5rem; background:#FFF1E8; color:#B7470B; font-weight:700; font-size:.85rem; padding:.5rem .8rem; border-radius:999px; }
.nf-check { width:20px; height:20px; flex:0 0 auto; color: var(--nf-green); }
.nf-tag .nf-check { color:#B7470B; width:16px; height:16px; }
.nf-stars { display:flex; align-items:center; gap:2px; margin-top:1rem; font-size:.95rem; } .nf-stars span { margin-left:.6rem; }
.nf-star { width:18px; height:18px; fill:#F5B400; }
.nf-card { background:#fff; border:1px solid var(--nf-line); border-radius:16px; box-shadow: 0 10px 30px -22px rgba(16,38,63,.4); }
.nf-ico { width:44px; height:44px; border-radius:12px; background:#EAF4FB; color: var(--nf-blue); display:grid; place-items:center; flex:0 0 auto; } .nf-ico svg { width:24px; height:24px; }
.nf-ico-green { background:#E8F8EE; color: var(--nf-green); }
.nf-grid-4 { display:grid; grid-template-columns: repeat(4,1fr); gap:1.1rem; }
.nf-grid-3 { display:grid; grid-template-columns: repeat(3,1fr); gap:1.1rem; }
.nf-two { display:grid; grid-template-columns: 1fr 1fr; gap: 3.5rem; align-items:center; }
.nf-two-top { align-items:start; }
.nf-flip img { order: 2; }
.nf-photo { width:100%; height: 440px; object-fit: cover; border-radius: 22px; }
/* topbar */
.nf-topbar { background: var(--nf-navy); color:#fff; font-size:.85rem; padding:.55rem 0; }
.nf-topbar .nf-wrap { display:flex; justify-content:space-between; gap:1rem; }
.nf-open { display:flex; align-items:center; gap:.6rem; } .nf-open i { width:8px; height:8px; border-radius:50%; background:#3DDC84; display:block; }
/* hero */
.nf-hero { background: linear-gradient(180deg, var(--nf-soft) 0%, #fff 100%); padding: 4rem 0 3.5rem; }
.nf-hero-grid { display:grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items:center; }
.nf-hero-art { position:relative; }
.nf-hero-img { width:100%; height: 520px; object-fit: cover; border-radius: 24px; display:block; }
.nf-page-img { width:100%; height: 340px; object-fit: cover; border-radius: 24px; display:block; }
.nf-hero-page { padding: 3rem 0 2.5rem; } .nf-hero-single .nf-hero-art { display:none; }
.nf-float { position:absolute; background:#fff; border:1px solid var(--nf-line); border-radius:16px; box-shadow: 0 14px 34px -18px rgba(16,38,63,.45); padding: 1rem 1.2rem; display:flex; gap:.9rem; align-items:center; }
.nf-float b { display:block; font-size:.95rem; } .nf-float small { display:block; color: var(--nf-muted); font-size:.8rem; }
.nf-float-a { left:-30px; bottom:30px; max-width:320px; } .nf-float-b { right:-20px; top:30px; flex-direction:column; align-items:flex-start; gap:.1rem; }
.nf-big { font-family: var(--wp--preset--font-family--heading); font-size: 1.8rem !important; color: var(--nf-orange); font-weight:900; }
/* services */
.nf-service { padding: 1.6rem; display:flex; flex-direction:column; gap:.7rem; text-decoration:none; color:inherit; transition: transform .15s, border-color .15s; }
.nf-service:hover { transform: translateY(-3px); border-color: var(--nf-blue); }
.nf-service b { font-size:1.1rem; } .nf-service p { margin:0; color: var(--nf-muted); font-size:.92rem; }
/* checks */
.nf-checks { list-style:none; margin:0 0 1.5rem; padding:0; display:flex; flex-direction:column; gap:.8rem; }
.nf-checks li { display:flex; gap:.7rem; align-items:flex-start; font-size:1rem; line-height:1.5; }
/* reviews */
.nf-dark { background: var(--nf-navy); color:#fff; } .nf-dark .nf-h2 { color:#fff; }
.nf-review { background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:16px; padding:1.6rem; display:flex; flex-direction:column; gap:.7rem; }
.nf-review .nf-stars { margin:0; } .nf-review p { margin:0; font-size:.98rem; line-height:1.55; } .nf-review span { font-size:.85rem; opacity:.7; }
/* map + booking */
.nf-map { height:260px; border-radius:16px; background:#EAF4FB; overflow:hidden; margin-top:1rem; } .nf-map-svg { width:100%; height:100%; display:block; }
.nf-book { padding: 2rem; }
.nf-book .ff-el-group { margin-bottom: .9rem; } .nf-book input, .nf-book textarea, .nf-book select { border:1px solid #C9D3DF !important; border-radius:10px !important; padding:.8rem 1rem !important; }
.nf-book .ff-btn-submit, .nf-book button[type=submit] { width:100%; background: var(--nf-orange) !important; color:#fff !important; border:0 !important; border-radius:10px !important; font-weight:700 !important; padding:1rem !important; font-size:1rem !important; }
/* band */
.nf-band { background: var(--nf-soft); border-top:1px solid var(--nf-line); border-bottom:1px solid var(--nf-line); padding: 3.5rem 0; }
.nf-band-inner { display:flex; justify-content:space-between; align-items:center; gap:2rem; } .nf-band .nf-sub { margin:0; }
/* faq */
.nf-faq { border-top:1px solid var(--nf-line); padding:1rem 0; } .nf-faq:last-of-type { border-bottom:1px solid var(--nf-line); }
.nf-faq summary { cursor:pointer; font-weight:700; list-style:none; display:flex; justify-content:space-between; }
.nf-faq summary::after { content:"+"; color: var(--nf-orange); font-size:1.3rem; } .nf-faq[open] summary::after { content:"–"; }
.nf-faq p { color: var(--nf-muted); margin:.6rem 0 0; }
/* header and footer */
.jd-header { border-bottom:1px solid var(--nf-line); }
.jd-header .wp-block-site-title a { font-family: var(--wp--preset--font-family--heading); font-weight:900; }
.jd-header .jd-header-cta .wp-block-button__link { background: var(--nf-orange); color:#fff; border-radius:10px; font-weight:700; }
.jd-footer { background: var(--nf-soft) !important; color: var(--nf-muted) !important; border-top:1px solid var(--nf-line); }
.jd-footer .has-base-color, .jd-footer a, .jd-footer h4, .jd-footer .wp-block-site-title a { color: var(--nf-ink) !important; }
.jd-footer .jd-eyebrow { color: var(--nf-blue) !important; } .jd-footer p, .jd-footer .wp-block-site-tagline { color: var(--nf-muted) !important; }
@media (max-width: 1000px) {
  .nf-hero-grid, .nf-two { grid-template-columns: 1fr; } .nf-grid-4 { grid-template-columns: repeat(2,1fr); } .nf-grid-3 { grid-template-columns: 1fr; }
  .nf-hero-img { height: 360px; } .nf-float-a { left: 10px; bottom: -20px; } .nf-float-b { right: 10px; top: 10px; }
  .nf-topbar-r { display:none; } .nf-band-inner { flex-direction:column; align-items:flex-start; } .nf-head { flex-direction:column; align-items:flex-start; }
  .nf-flip img { order: 0; }
}
@media (max-width: 600px) { .nf-grid-4 { grid-template-columns: 1fr; } .nf-section { padding: 3.5rem 0; } .nf-wrap { padding: 0 20px; } .nf-photo { height: 280px; } }

.nf-tight { padding-top: 3rem; }


