/*
Theme Name: Pop The Heating On
Version: 1.0
Author: Pop The Heating On
Description: Custom WordPress theme for Pop The Heating On.
*/
:root{--ink:#17071f;--pink:#ff2d91;--soft:#f7f3f8;--muted:#6e6873;--border:#e4dfe7}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);line-height:1.55}a{color:inherit}img{max-width:100%;height:auto}.container{width:min(92%,1180px);margin:auto}
.site-header{background:var(--ink);color:#fff;position:sticky;top:0;z-index:10}.header-inner{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand img{width:210px;max-height:66px;object-fit:contain}.nav{display:flex;gap:20px}.nav a{text-decoration:none;font-weight:700}.actions{display:flex;gap:8px}.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:14px 22px;font-weight:800;text-decoration:none;border:0}.primary{background:var(--pink);color:#fff}.secondary{background:#fff;color:var(--ink)}
.hero{background:linear-gradient(135deg,#21082d,#4d0b5e,#24072f);color:#fff;padding:70px 0}.hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:38px;align-items:center}.eyebrow{display:inline-block;padding:6px 12px;border-radius:999px;background:#fff1f7;color:#b4005d;font-weight:800}.hero .eyebrow{background:#ffffff1c;color:#ffd7ec}.hero h1{font-size:clamp(2.5rem,6vw,4.7rem);line-height:1.03;margin:16px 0}.hero p{font-size:1.15rem;color:#f4eaf5}.buttons{display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}
.hero-card,.payment-card,.card,.service{background:#fff;color:var(--ink);border:1px solid var(--border);border-radius:28px;padding:30px;box-shadow:0 10px 35px #17071f12}.hero-card .price,.price{font-size:3.3rem;font-weight:900;line-height:1;color:var(--pink)}
.section{padding:72px 0}.soft{background:var(--soft)}h2{font-size:clamp(2rem,4vw,3.1rem);line-height:1.1;margin:0 0 16px}.lead{font-size:1.15rem;color:var(--muted);max-width:800px}
.repair{background:var(--ink);color:#fff;border-radius:30px;padding:44px}.repair p{color:#f4eaf5;font-size:1.08rem}
.payment-grid{display:grid;grid-template-columns:1fr .9fr;gap:28px}.steps{display:grid;gap:15px;margin-top:20px}.step{display:flex;gap:14px}.num{flex:0 0 38px;height:38px;border-radius:50%;background:var(--pink);color:#fff;display:grid;place-items:center;font-weight:900}.step strong{display:block}.step span{color:var(--muted)}.notice{background:#fff5fa;border:1px solid #ffd0e7;border-radius:15px;padding:15px;margin-top:18px}.services{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:28px}.service h3{margin-top:0}.service p{color:var(--muted)}.cta{background:var(--ink);color:#fff;border-radius:30px;padding:48px;text-align:center}.cta h2{color:#fff}
footer{background:#100512;color:#fff;padding:40px 0}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:25px}.footer-logo{width:210px}.footer-bottom{margin-top:25px;padding-top:18px;border-top:1px solid #ffffff1c;color:#b9aabd}
@media(max-width:850px){.nav{display:none}.header-inner{min-height:72px}.brand img{width:175px}.hero-grid,.payment-grid{grid-template-columns:1fr}.services{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.hero{padding:52px 0}.section{padding:55px 0}.repair,.cta{padding:30px 22px}}
@media(max-width:520px){.actions .secondary{display:none}.hero h1{font-size:2.75rem}.buttons .btn{width:100%}}

/* Readability fix for the £25 Diagnosis & Advice card */
.diagnosis-card p,
.diagnosis-card .lead,
.diagnosis-card .description,
.diagnosis-card .response-time,
.diagnosis-card .small-text {
    color: #24102f !important;
    opacity: 1 !important;
}
.diagnosis-card h3,
.diagnosis-card h4 {
    color: #24102f !important;
    opacity: 1 !important;
}

/* Final contrast fix: £25 advice cards */
.hero-card,
.hero-card p,
.hero-card strong,
.hero-card div,
.hero-card span,
.payment-card,
.payment-card p,
.payment-card strong,
.payment-card div,
.payment-card span,
.payment-card li {
    color: #17071f !important;
    opacity: 1 !important;
}
.hero-card .price,
.payment-card .price {
    color: #ff2d91 !important;
}
.hero-card .btn,
.payment-card .btn {
    color: #fff !important;
}