/* Heat Beads Fuel Finder - product page profile parts. Scoped to .hbfp; colours/fonts follow the Elementor kit with fallbacks. */
.hbfp{--hbfp-card:#1b1b1b;--hbfp-card2:#2e2e2e;--hbfp-line:#3a3a3a;--hbfp-muted:#cfcfcf;--hbfp-accent:var(--e-global-color-primary,#FFEF00);--hbfp-slab:var(--e-global-typography-primary-font-family,"Hepta Slab"),serif;--hbfp-sans:var(--e-global-typography-text-font-family,Montserrat),sans-serif;color:#fff;font-family:var(--hbfp-sans)}
.hbfp *{box-sizing:border-box}
.hbfp .hbff-c-orange{--c:#F26B21}.hbfp .hbff-c-red{--c:#E8322B}.hbfp .hbff-c-grey{--c:#6b6b6b}.hbfp .hbff-c-yellow{--c:#F5C400}.hbfp .hbff-c-green{--c:#2E8B3E}

/* Shared */
.hbfp-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:0 0 24px;padding-bottom:16px;border-bottom:1px solid var(--hbfp-line)}
.hbfp .hbfp-h2{margin:0;color:#fff;font:700 36px/1.1 var(--hbfp-slab)}
.hbfp .hbfp-sub{margin:6px 0 0;color:var(--hbfp-muted);font-size:16px;line-height:1.5}
.hbfp .hbfp-more{color:var(--hbfp-accent);font:700 16px/1.3 var(--hbfp-slab);text-decoration:none;white-space:nowrap}
.hbfp .hbfp-btn{display:inline-block;padding:14px 24px;border-radius:999px;font:700 17px/1.2 var(--hbfp-slab);text-decoration:none}
.hbfp .hbfp-btn.is-y{background:var(--hbfp-accent);color:#111}
.hbfp .hbfp-btn.is-o{border:2px solid #fff;color:#fff}
.hbfp .hbfp-btn:focus-visible,.hbfp .hbfp-more:focus-visible{outline:3px solid var(--hbfp-accent);outline-offset:3px}

/* Hero */
.hbfp .hbfp-chips{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 26px;padding:0;list-style:none}
.hbfp .hbfp-chips li{margin:0;padding:7px 13px;border:1px solid rgba(255,255,255,.25);border-radius:999px;background:rgba(0,0,0,.55);color:#fff;font-size:14px;font-weight:600;line-height:1.2}
.hbfp-ctas{display:flex;flex-wrap:wrap;gap:12px}

/* Glance */
.hbfp-glance{position:relative;z-index:2}
.hbfp-strip{display:flex;flex-wrap:wrap;overflow:hidden;border-radius:26px;background:var(--hbfp-card);box-shadow:0 20px 40px rgba(0,0,0,.35)}
.hbfp-cell{flex:1 1 160px;padding:22px 24px;box-shadow:inset -1px 0 0 var(--hbfp-line)}
.hbfp-cell:last-child{box-shadow:none}
.hbfp-cell.is-wide{flex:1.25 1 250px}
.hbfp .hbfp-k{display:block;color:var(--hbfp-muted);font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.hbfp .hbfp-cell b{color:#fff;font:700 20px/1.2 var(--hbfp-slab)}
.hbfp .hbfp-cell>b{display:block;margin-top:10px}
.hbfp-ic{display:flex;align-items:center;gap:12px;margin-top:10px}
.hbfp .hbfp-ic img,.hbfp .hbfp-ics img{width:48px;height:48px;margin:0}
.hbfp-ics{display:flex;flex-wrap:wrap;gap:18px;margin-top:10px}
.hbfp-ics span{display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--hbfp-muted);font-size:13px;white-space:nowrap}

/* Why */
.hbfp-why{display:grid;gap:14px}
.hbfp-why-item{padding:18px 22px;border-radius:20px;background:var(--hbfp-card)}
.hbfp .hbfp-why-item b{display:block;margin-bottom:4px;color:#fff;font:700 19px/1.3 var(--hbfp-slab)}
.hbfp-why-item span{color:var(--hbfp-muted);font-size:15px;line-height:1.5}

/* Best for */
.hbfp-styles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.hbfp .hbfp-style{display:flex;flex-direction:column;gap:10px;padding:20px;border:2px solid transparent;border-radius:20px;background:var(--hbfp-card);color:#fff;text-decoration:none;transition:border-color .2s}
.hbfp .hbfp-style:hover{border-color:#5a5a5a;color:#fff}
.hbfp .hbfp-style:focus-visible{outline:3px solid var(--hbfp-accent);outline-offset:3px}
.hbfp .hbfp-style h3{margin:0;color:#fff;font:700 20px/1.2 var(--hbfp-slab)}
.hbfp .hbfp-style p{margin:0;color:var(--hbfp-muted);font-size:14px;line-height:1.5}
.hbfp-lab{align-self:flex-start;padding:5px 11px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.04em;line-height:1.2;text-transform:uppercase}
.hbfp-lab.is-best{background:var(--hbfp-accent);color:#111}
.hbfp-lab.is-great{background:#2f4a2a;color:#cdeec4}
.hbfp-lab.is-can{background:#4a3d1c;color:#f2dca0}

/* In the bag */
.hbfp-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.hbfp .hbfp-dl{margin:0;padding:8px 24px;border-radius:20px;background:var(--hbfp-card)}
.hbfp-row{display:grid;grid-template-columns:160px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--hbfp-line);font-size:15px;line-height:1.5}
.hbfp-row:last-child{border-bottom:0}
.hbfp .hbfp-row dt{margin:0;color:var(--hbfp-muted);font-weight:600}
.hbfp .hbfp-row dd{margin:0;color:#fff}
.hbfp .hbfp-row a{color:var(--hbfp-accent);text-decoration:underline;text-underline-offset:3px}
.hbfp .hbff-note{display:block;margin-top:4px;color:var(--hbfp-muted);font-size:13px}

/* Sizes */
.hbfp .hbfp-pills{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 12px;padding:0;list-style:none}
.hbfp .hbfp-pills li{margin:0;padding:8px 16px;border-radius:999px;background:var(--hbfp-card2);color:#fff;font-weight:700}
.hbfp .hbfp-where{margin:0 0 22px;color:var(--hbfp-muted);font-size:15px}

/* Recipes */
.hbfp-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.hbfp .hbfp-rc{position:relative;display:block;height:300px;overflow:hidden;border-radius:26px;background:#111;color:#fff;text-decoration:none}
.hbfp .hbfp-rc img{display:block;width:100%;height:100%;margin:0;object-fit:cover;transition:transform .3s}
.hbfp .hbfp-rc:hover img{transform:scale(1.04)}
.hbfp .hbfp-rc:focus-visible{outline:3px solid var(--hbfp-accent);outline-offset:3px}
.hbfp-rc::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.85))}
.hbfp-rc-txt{position:absolute;left:20px;right:20px;bottom:18px;z-index:1}
.hbfp .hbfp-rc small{display:block;color:var(--hbfp-accent);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.hbfp-rc-t{display:block;margin-top:4px;font:700 22px/1.2 var(--hbfp-slab)}

/* Compare */
.hbfp-band{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 36px;border-radius:26px;background:#2b2a1a}
.hbfp .hbfp-band .hbfp-h2{font-size:28px}
.hbfp .hbfp-band .hbfp-btn{flex:0 0 auto}
.hbfp .hbfp-sibs{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 0;padding:0;list-style:none}
.hbfp .hbfp-sibs li{margin:0}
.hbfp .hbfp-sibs a{display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:#1b1b1b;color:#fff;font-size:14px;font-weight:600;text-decoration:none}
.hbfp .hbfp-sibs i{width:10px;height:10px;border-radius:50%;background:var(--c,#888)}

.hbfp a.hbfp-more:hover,.hbfp a.hbfp-more:focus{color:var(--hbfp-accent)}
.hbfp .hbfp-row a:hover,.hbfp .hbfp-row a:focus{color:var(--hbfp-accent)}
.hbfp .hbfp-sibs a:hover,.hbfp .hbfp-sibs a:focus{color:#fff;background:#2e2e2e}
.hbfp a.hbfp-rc:hover,.hbfp a.hbfp-rc:focus{color:#fff}
.hbfp a.hbfp-btn.is-y:hover,.hbfp a.hbfp-btn.is-y:focus{color:#111}.hbfp a.hbfp-btn.is-o:hover,.hbfp a.hbfp-btn.is-o:focus{color:#fff}
.hbfp a.hbfp-style:hover,.hbfp a.hbfp-style:focus{color:#fff}
.hbfp .hbfp-h2,.hbfp .hbfp-style h3,.hbfp .hbfp-excl-body b,.hbfp .hbfp-cell b,.hbfp .hbfp-why-item b,.hbfp .hbfp-rc-t,.hbfp .hbfp-btn,.hbfp .hbfp-more{letter-spacing:normal;text-transform:none;word-spacing:normal;font-style:normal}

/* Retailer-exclusive bag strip (1.3.21): slim, below the stockist logos. */
.hbfp-excl{display:flex;align-items:center;gap:18px;margin:8px 0 0;padding:14px 22px;border:1px solid var(--hbfp-line);border-radius:18px;scroll-margin-top:120px}
.hbfp .hbfp-excl-img{flex:0 0 auto;display:block;width:auto;height:72px;aspect-ratio:819/900}
.hbfp-excl-body{flex:1 1 auto;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;font-size:15px;line-height:1.5}
.hbfp .hbfp-excl-k{flex-basis:100%;color:var(--hbfp-muted);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.hbfp .hbfp-excl-body b{color:#fff;font:700 18px/1.3 var(--hbfp-slab)}
.hbfp .hbfp-excl-t{color:var(--hbfp-muted)}
.hbfp a.hbfp-excl-a{flex:0 0 auto;color:#fff;font-size:15px;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.hbfp a.hbfp-excl-a:hover,.hbfp a.hbfp-excl-a:focus{color:var(--hbfp-accent)}
.hbfp a.hbfp-excl-link{display:block;margin-top:6px;color:var(--hbfp-muted);font-size:14px;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.hbfp a.hbfp-excl-link:hover,.hbfp a.hbfp-excl-link:focus{color:#fff}
@media (min-width:1025px){
	.hbfp .hbfp-cell b{white-space:nowrap}
}
@media (max-width:1024px){
	.hbfp-styles{grid-template-columns:1fr 1fr}
	.hbfp-cols{grid-template-columns:1fr}
	.hbfp-cell,.hbfp-cell:last-child{box-shadow:inset -1px -1px 0 var(--hbfp-line)}
}
@media (max-width:767px){
	.hbfp .hbfp-h2{font-size:28px}
	.hbfp-head{flex-direction:column;align-items:flex-start;gap:8px}
	.hbfp .hbfp-btn{padding:12px 18px;font-size:15px}
	.hbfp-cell,.hbfp-cell:last-child{flex:1 1 50%;padding:16px;box-shadow:inset -1px -1px 0 var(--hbfp-line)}
	.hbfp-cell.is-wide{flex-basis:100%}
	.hbfp .hbfp-cell b{font-size:18px}
	.hbfp-ic{gap:8px;white-space:nowrap}
	.hbfp .hbfp-ic img,.hbfp .hbfp-ics img{width:40px;height:40px}
	.hbfp-styles{grid-template-columns:1fr;gap:10px}
	.hbfp-row{grid-template-columns:1fr;gap:2px}
	.hbfp-cards{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory}
	.hbfp .hbfp-rc{flex:0 0 78%;scroll-snap-align:start}
	.hbfp-band{flex-direction:column;align-items:flex-start;padding:22px}
	.hbfp .hbfp-style{padding:14px}.hbfp .hbfp-style h3{font-size:17px}.hbfp .hbfp-style p{font-size:13px}
	.hbfp-excl{flex-wrap:wrap;gap:12px 14px;padding:14px 16px}
	.hbfp .hbfp-excl-img{height:60px}
	.hbfp-excl-body{flex:1 1 60%}
	.hbfp a.hbfp-excl-a{flex-basis:100%;padding-left:69px}
}
