/* premium-svc638.css  loaded last
   Job: collapse invented per widget amber glows onto two shared tokens.
   Two jobs exist on this site: a primary call to action, and a selected control.
   Nine glow values were doing those two jobs. Reference values kept are the two
   most used ones already in the build, so nothing new is introduced.
   Rest state only. Hover and focus rules have higher specificity and still win. */
:root{
  --rdn-glow-cta: 0 8px 24px -6px rgba(245,165,36,.45);
  --rdn-glow-sel: 0 10px 26px -14px rgba(245,165,36,.6);
}
/* primary call to action */
a.ledc__btn,
button.ledc__btn,
a.bpick__btn--primary,
span.bpick__rec{ box-shadow: var(--rdn-glow-cta); }
/* selected control: tabs, toggles, state chips */
button.bfact__tab[aria-selected="true"],
button.bfact__tab.is-active,
button.bflow__mode[aria-selected="true"],
button.bflow__mode.is-active,
button.saft__tab[aria-selected="true"],
button.saft__tab.is-active,
div.rdnpb__zone--fair{ box-shadow: var(--rdn-glow-sel); }

/* svc639 addition: dark elevation.
   Seven distinct dark drop shadows were doing four jobs, and four of the seven
   used pure black on a navy site, which reads muddy rather than deep. Collapsed
   onto four navy tinted tiers, one per real job. Every tier value already
   existed in the build, so no new geometry or colour is introduced. Each
   reassigned element keeps the character of the shadow it had: the wide soft
   panel stays wide, the tight floating panel keeps its negative spread. */
:root{
  --rdn-elev-1: 0 2px 8px rgba(8,17,39,.18);
  --rdn-elev-2: 0 8px 24px rgba(8,17,39,.26);
  --rdn-elev-3: 0 16px 44px rgba(8,17,39,.34);
  --rdn-elev-4: 0 18px 42px -26px rgba(8,17,39,.78);
}
/* tier 1, small raised chip or badge */
span.bproc__n{ box-shadow: var(--rdn-elev-1); }
/* tier 2, mid lift under a drag handle */
div.ba-slider__handle{ box-shadow: var(--rdn-elev-2); }
/* tier 3, wide ambient card lift. Same value the founder portrait and the
   lightbox image already use, so this joins an existing tier rather than
   inventing a fourth. Keeps the wide soft character the panel had. */
div.ledc__result{ box-shadow: var(--rdn-elev-3); }
/* tier 4, deep floating panel, tight negative spread */
figure.ledc-rail__c,
div.ledc-bars{ box-shadow: var(--rdn-elev-4); }

/* svc639: hero internal alignment.
   .jn-trust and .jn-cta are centred with !important in the bundles. That is
   correct on our-story.html, whose whole hero is centred. On the four pages
   whose h1 is left aligned it left a hero that started left and finished
   centred. Opt in class, so our-story keeps the centred treatment. */
ul.jn-trust.jn--left{ justify-content: flex-start !important; margin-left: 0 !important; margin-right: auto !important; }
div.jn-cta.jn--left{ text-align: left !important; margin-left: 0 !important; margin-right: auto !important; }

/* svc640 fix 1: hero eyebrow shared a container with h1 but sat 4px right of it.
   Measured on 43 of 44 pages: eyebrow text x minus h1 text x = +4.0px.
   Source is .hero__eyebrow{padding-inline:.25rem}. roofing-partnership is a real
   amber pill where the padding does work, so it opts out with .eb--pill. */
.hero__eyebrow:not(.eb--pill){padding-inline:0}

/* svc640 fix 2: .bflow__mode used flex:0 1 auto, so segments sized to their own
   text (measured 100/137/103px on solar, 122/95/123px on the RV pages) and the
   segmented control read ragged. Equal widths need the longest single word
   ("December", 82px at 15px) to fit inside one segment, which it cannot beside
   an inline icon. Stacking the icon above the label frees the full segment
   width, so widths equalise with no font-size change and no copy change. */
.bflow__modes{display:flex;width:100%}
.bflow__modes .bflow__mode{flex:1 1 0;min-width:0;flex-direction:column;
  gap:.25rem;padding-left:.5rem;padding-right:.5rem;text-align:center}
.bflow__modes .bflow__mode svg{flex:none}