/* Home page polish, 2026-11-12. CSS only; no content or markup changes.
   yitm.css declares its cascade layers with the `tokens` layer first and sets several home rules with !important
   in the `reset` layer. For !important, the earlier layer wins, so these rules sit in `tokens`.
   1 labels  2 text measure  3 hero alignment  4 heading size */
@layer tokens{
/* 1. Pill labels: the Seniors and NDIS labels were teal text on a teal pill (1:1 contrast). */
:root:root body[data-yitm-design-mode="home"] #main .home-audience-detail .eyebrow{color:#fff!important;-webkit-text-fill-color:#fff!important}
/* The "Choose your next step" pill stretched to the column width; make it hug its text like the others. */
:root:root body[data-yitm-design-mode="home"] #main .home-support-paths .eyebrow{display:inline-flex!important;width:auto!important;max-width:100%!important}

/* 2. One reading width for lead paragraphs and the glance table, so text and the card below it share an edge. */
:root:root body[data-yitm-design-mode="home"] #main :is(.nextgen-lede,.home-glance__answer,.home-diff__lede,.home-ai-band__lead,.home-specialist .wrap>p,.home-specialist p:first-of-type){max-width:760px!important}
:root:root body[data-yitm-design-mode="home"] #main .home-glance :is(.home-glance__panel,.home-glance__table,dl,table){max-width:760px!important}

/* 3. Hero: the call line sat 60px right of the headline, while the review line and the links sat at a different edge again.
   Everything now shares the headline column (the QuoteMe card is 960px wide and centred, so these match it). */
:root:root body[data-yitm-design-mode="home"] #main .home-core-hero :is(.home-frontdesk-call,.home-neighbour-trust,.home-community-shortcuts){width:100%!important;max-width:960px!important;margin-left:auto!important;margin-right:auto!important;padding-left:0!important;justify-content:flex-start!important;text-align:left!important}

/* The shortcut links carry their own left padding; remove it so the first link starts on the headline edge. */
:root:root body[data-yitm-design-mode="home"] #main .home-core-hero .home-community-shortcuts a:first-child{padding-left:0!important;margin-left:0!important}

/* 4. One section heading size: three specialist blocks used 32px and the closing invitation 36px, the rest 38px. */
:root:root body[data-yitm-design-mode="home"] #main :is(.home-specialist,.yitm-home-invitation) h2{font-size:clamp(1.75rem,3vw,2.5rem)!important}
}
