*{box-sizing:border-box}body{margin:0;font:17px/1.6 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#1d2a33;background:#fff}
a{color:#0e5a8a}.w{max-width:960px;margin:0 auto;padding:0 22px}
header{padding:18px 0;border-bottom:1px solid #eef1f3}.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:19px;color:#12324a;text-decoration:none}
.hero{padding:56px 0 44px;background:linear-gradient(180deg,#f3f8fb,#fff)}h1{font-size:clamp(30px,5vw,46px);line-height:1.15;margin:0 0 18px;color:#0f2b40;max-width:820px}
.sub{font-size:19px;max-width:700px;color:#3b4b57}form.su{display:flex;gap:10px;flex-wrap:wrap;margin:26px 0 8px;max-width:600px}
form.su input[type=email]{flex:1 1 260px;padding:15px 16px;font-size:17px;border:1.5px solid #c9d4dc;border-radius:10px}
button{background:#e2702a;color:#fff;border:0;border-radius:10px;padding:15px 22px;font-size:17px;font-weight:700;cursor:pointer}
.micro{font-size:14px;color:#5d6d78;max-width:600px}section{padding:44px 0}h2{font-size:27px;line-height:1.25;color:#0f2b40;margin:0 0 16px}
.body p{max-width:700px}ol.q{padding-left:22px;max-width:720px}ol.q li{margin:10px 0}
.cards{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.card{border:1px solid #e3e9ee;border-radius:12px;padding:16px 18px;background:#fff}
.tag{display:inline-block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:3px 9px;border-radius:20px;margin-right:6px}
.heating{background:#fde9dc;color:#a4460f}.cooling{background:#dcefff;color:#0e5a8a}.heatpump{background:#e1f5e8;color:#1d7a43}
.meta{font-size:13px;color:#6b7a85}.work{margin:8px 0;font-weight:600}.tip{font-size:14px;background:#f6f9fb;border-left:3px solid #e2702a;padding:8px 10px;border-radius:6px}
.alt{background:#f7fafc}footer{padding:34px 0;font-size:14px;color:#5d6d78;border-top:1px solid #eef1f3}
.hp{position:absolute;left:-9999px}.filt button{background:#eef3f7;color:#12324a;padding:8px 14px;font-size:14px;margin:0 6px 8px 0}.filt button.on{background:#12324a;color:#fff}
.hfig{margin:30px 0 0;border-radius:16px;overflow:hidden;background:#d9dde3}.hfig img{display:block;width:100%;height:300px;object-fit:cover;object-position:50% 35%}
@media(max-width:600px){.hfig{margin-top:24px}.hfig img{height:200px}}
.card{box-shadow:0 1px 2px rgba(15,43,64,.05),0 4px 14px rgba(15,43,64,.06);border-radius:14px;padding:18px 20px;display:flex;flex-direction:column;gap:6px;transition:box-shadow .15s}
.card:hover{box-shadow:0 2px 4px rgba(15,43,64,.06),0 8px 22px rgba(15,43,64,.09)}
.card .meta{display:inline-block;margin-top:2px}.card .tip{margin-top:auto}
#sample .cards{margin-top:20px}
.card .tag{align-self:flex-start}
img{max-width:100%}
@media(max-width:600px){
.hero{padding:40px 0 32px}section{padding:36px 0}
form.su{flex-direction:column;gap:12px}form.su input[type=email],form.su button{width:100%;flex:none}
.hfig{margin-top:28px;border-radius:14px}.hfig img{height:220px;object-position:50% 30%}
.cards{grid-template-columns:1fr;gap:16px}
.card{padding:16px 18px;gap:8px;box-shadow:0 1px 2px rgba(15,43,64,.05),0 2px 8px rgba(15,43,64,.05)}
.card .work{margin:2px 0;overflow-wrap:anywhere}.tip{padding:10px 12px}
.filt{display:flex;flex-wrap:wrap;gap:8px}.filt button{margin:0}
}
/* ATP editorial LAYOUT layer 2026-10-26 (colors reverted to brand per Luke) */
.w{max-width:1040px;padding:0 28px}
header{position:sticky;top:0;z-index:50;padding:16px 0;background:rgba(255,255,255,.86);-webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px)}
.brand{letter-spacing:-.01em}
.hero{padding:88px 0 64px}
h1{font-size:clamp(34px,6vw,60px);line-height:1.05;letter-spacing:-.03em;font-weight:800}
h2{font-size:clamp(26px,3.4vw,38px);line-height:1.12;letter-spacing:-.022em;margin-bottom:20px}
.sub{font-size:20px}
section{padding:88px 0}
form.su input[type=email]{border-radius:999px;padding:15px 20px}
button{border-radius:999px;padding:15px 26px;transition:background .15s}button:hover{background:#c75d1c}
.card{border-radius:18px;padding:22px 24px;transition:border-color .2s,transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-2px)}
.hfig{border-radius:22px}img{border-radius:inherit}
@media(max-width:600px){.w{padding:0 20px}.hero{padding:52px 0 40px}section{padding:56px 0}.card{padding:18px 20px}.card:hover{transform:none}.hfig{border-radius:16px}}