/* Centre visible content in the space below each heading, not the whole card. */
.bfeels,.bhours{padding-bottom:0}
.bfeels .feels-reading{margin:0;padding:24px 0;flex:1;min-height:0;gap:12px}
.bfeels .feels-value{line-height:.78;margin:0;padding:0}
.bfeels .feels-reading p{margin:0;line-height:1.15}
.hours-region{flex:1;display:flex;align-items:center;padding:24px 0}
.bhours .hours{width:100%;flex:1 1 auto;margin:0;min-height:0;gap:clamp(8px,1vw,16px)}
.hour{aspect-ratio:146/256;padding:clamp(12px,1.2vw,22px) 4px;justify-content:space-between;gap:5px;border-radius:clamp(28px,3vw,44px)}
.hour>span,.hour small{font-size:clamp(14px,1.1vw,22px);line-height:1.08;margin:0}
.hour strong{font-size:clamp(24px,1.65vw,30px);line-height:1.08}
.hour .weather-icon{width:75%;height:auto;aspect-ratio:1;margin:0}
.hour .weather-icon img{width:100%;height:100%;object-fit:contain;padding:0}
.bplans{align-items:center;column-gap:24px}
.bplans p{margin-top:22px;line-height:1.35}
.bplans .phone{align-self:center;margin:0;max-width:230px;justify-self:center}
.bcard.bradar h2,.bcard.bappearance h2{font-size:clamp(21px,1.65vw,28px);line-height:1.12;font-weight:600}
/* Use a roomier two-column composition before desktop cards become cramped. */
@media(min-width:1400px){
 /* Half-sized tracks let the nine-track hero split into two equal columns. */
 .feature-bento{grid-template-columns:repeat(40,minmax(0,1fr))}
 .bcomfort,.bfeels,.bhours{grid-column:1/11}
 .bhero{grid-column:11/29}
 .bplans,.bmetrics{grid-column:29/41}
 .bstorm{grid-column:11/20}
 .bhaptics,.balerts{grid-column:20/29}
 .bradar{grid-column:29/35}
 .bappearance{grid-column:35/41}
}
@media(min-width:601px) and (max-width:1399px){
 .feature-bento{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;gap:16px;padding:0 20px 20px}
 .bcard{grid-column:auto;grid-row:auto;padding:28px;min-height:0}
 .bcard h2{font-size:28px}
 .bhero{grid-column:1/-1;grid-row:1;min-height:650px}
 .hero-copy{width:50%}.hero-copy h1{font-size:48px}.hero-copy p{font-size:24px}
 .bhero>.phone{width:280px;right:8%;top:50px}
 .bcomfort{grid-row:2;grid-column:1;min-height:300px}
 .bfeels{grid-row:2;grid-column:2;padding-bottom:0;min-height:300px}
 .bhours{grid-row:3;grid-column:1;padding-bottom:0;min-height:350px}
 .bstorm{grid-row:3;grid-column:2;min-height:350px}
 .bplans{grid-column:1/-1;grid-row:4;display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,230px);align-items:center;gap:48px;padding:36px;min-height:0}
 .bplans h2{font-size:clamp(28px,3vw,38px)}
 .bplans p{font-size:20px;max-width:420px;margin-top:24px}
 .bplans .phone{width:100%;max-width:230px}
 .bmetrics{grid-column:1/-1;min-height:230px}
 .bhaptics,.balerts{min-height:190px}
 .bradar,.bappearance{min-height:285px}
 .bradar>img{width:140px;height:135px}
 .appearance-art{height:125px;min-height:125px;max-width:270px;width:100%;align-self:center}
 .bappearance h2{margin-top:25px}
 .hour{padding:18px 4px;max-height:256px}
 .hour>span,.hour small{font-size:18px}.hour strong{font-size:28px}
 .hour .weather-icon{max-width:88px}
}
@media(min-width:601px) and (max-width:740px){
 .feature-bento{grid-template-columns:minmax(0,1fr)}
 .bcard{grid-column:1;grid-row:auto}
 .bhero{min-height:760px}.hero-copy{width:100%}.hero-copy h1{font-size:40px}
 .bhero>.phone{width:245px;top:230px;right:calc(50% - 122.5px)}
 .bplans{display:flex;flex-direction:column;align-items:stretch;gap:28px}
 .bplans .phone{width:225px;align-self:center}
 .bhours .hours{max-width:450px;margin:auto}.hour{max-height:256px}
}
@media(max-width:600px){
 .bfeels,.bhours{padding-bottom:0}
 .bfeels{min-height:300px}
 .bhours{min-height:350px}
 .hour{padding:18px 4px;gap:8px}
 .hour>span,.hour small{font-size:16px}.hour strong{font-size:26px}
 .bplans{display:flex;flex-direction:column;align-items:stretch;gap:28px;min-height:0}
 .bplans p{font-size:18px;line-height:1.35;margin-top:18px}
 .bplans .phone{width:min(225px,100%);align-self:center;margin:0}
}
/* Shared illustration and copy rows keep these paired feature cards aligned. */
.bcard.bradar,.bcard.bappearance{display:grid;grid-template-rows:minmax(60px,1fr) 106px;row-gap:16px;align-content:stretch;justify-content:stretch}
.feature-art{min-height:0;display:flex;align-items:center;justify-content:center}
.feature-art>img{width:100%;max-width:120px;height:100%;max-height:90px;object-fit:contain}
.bappearance .appearance-art{width:100%;max-width:270px;height:70px;min-height:0;margin:0;align-self:auto}
.feature-copy{min-width:0}
.bcard .feature-copy h2{margin:0}
.bcard .feature-copy p{margin:12px 0 0;font-size:15px;line-height:1.2}
.animated-logo{display:flex;align-items:center;gap:8px;width:124px;height:32px}
.animated-logo img{display:block;max-width:none}
.logo-spin{display:block;width:30px;height:30px;flex:none;background:url('/assets/fairday-mark.png') center/contain no-repeat;transform-origin:50% 50%}
.logo-spin img{display:none}
.logo-word{display:flex;align-items:center;width:86px;height:32px;overflow:visible;clip-path:none;padding-top:0}
.logo-word img{content:url('/assets/fairday-wordmark.png');width:86px;height:auto;transform:translateY(3.327px)}
@media(max-width:1399px){
 .bcard.bradar,.bcard.bappearance{grid-template-rows:140px auto;align-content:start;min-height:300px;row-gap:20px}
 .feature-art>img{width:140px;max-width:none;height:140px;max-height:none}
 .bappearance .appearance-art{height:125px}
}