/* A compact statement excerpt keeps the product destination ahead of editorial copy. */
.granularity-landing .product-hero{padding-top:24px;padding-bottom:16px}
.granularity-landing .product-hero h1{font-size:clamp(1.85rem,3.6vw,3rem);margin:0 0 12px;overflow-wrap:anywhere}
.granularity-landing .product-hero .lead{font-size:1rem;line-height:1.5;margin:0;max-width:850px}
.granularity-landing .product-preview-heading{padding:12px 14px;gap:6px}
.granularity-landing .product-preview-heading h2{font-size:.88rem}
.granularity-preview-dates{display:flex;flex-wrap:wrap;gap:6px 24px;padding:8px 14px;font-size:.75rem;line-height:1.5;border-bottom:1px solid var(--line);color:var(--muted)}
.granularity-preview-dates strong{color:var(--ink);margin-right:6px}
.granularity-landing .online-model-preview col:first-child{width:48%!important}
.granularity-landing .online-model-preview col:not(:first-child){width:26%!important}
.granularity-landing .online-model-preview table th,.granularity-landing .online-model-preview table td{font-size:.8rem;padding:7px 5px}
.granularity-landing .online-model-preview .statement-title{padding:5px 4px}
.granularity-landing .online-model-preview table caption{padding:2px 4px;font-size:.7rem}
.granularity-landing .online-model-action{margin-top:14px;gap:12px 20px}
.granularity-landing .product-explanation{padding-top:42px;gap:30px 50px}
.granularity-landing .product-faq{margin:0 5% 40px;max-width:1000px}
.granularity-landing .product-faq h2{font-size:1.45rem;margin-bottom:18px}
.granularity-landing .product-faq details{border-top:1px solid var(--line);padding:14px 0;line-height:1.6}
.granularity-landing .product-faq summary{font-weight:600;cursor:pointer}
.granularity-landing .product-faq p{color:var(--muted);margin-top:10px}
@media(max-width:1100px){
 .granularity-landing .online-model-preview .product-preview-panels{grid-template-columns:1fr;padding:8px 12px;gap:5px}
 .granularity-landing .online-model-preview .statement-panel+.statement-panel{padding-top:5px}
 .granularity-landing .online-model-preview .statement-title h3{font-size:.85rem}
 .granularity-landing .online-model-preview table th,.granularity-landing .online-model-preview table td{padding:4px 5px;font-size:.8rem}
}
@media(max-width:480px){
 .granularity-landing .product-hero{padding-top:18px;padding-bottom:12px}
 .granularity-landing .product-hero h1{font-size:1.75rem;line-height:1.12;margin-bottom:8px}
 .granularity-landing .product-hero .lead{font-size:.9rem;line-height:1.45}
 .granularity-landing .product-preview-heading{padding:8px 10px}
 .granularity-landing .product-preview-heading h2{font-size:.8rem}
 .granularity-landing .product-preview-heading>span{font-size:.7rem}
 .granularity-preview-dates{padding:6px 10px;font-size:.7rem;gap:2px}
 .granularity-preview-dates span{width:100%}
 .granularity-landing .online-model-preview .product-preview-panels{padding:6px 8px;gap:3px}
 .granularity-landing .online-model-preview table th,.granularity-landing .online-model-preview table td{font-size:.75rem;padding:3px 4px}
 /* The preview heading already shows the unit; retain table captions for screen readers. */
 .granularity-landing .online-model-preview table caption{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .granularity-landing .online-model-action{margin-top:10px;gap:6px}
 .granularity-landing .online-model-action .primary-link{min-height:48px;padding:10px 14px;font-size:1rem}
 .granularity-landing .online-model-action p{font-size:.72rem}
}