/* ROUND 76 — doc "Sentinel QC 28-09-2026 NEW". Loaded after r75.css. */

/* ------------------------------------------------------------ 1. Blog post (single.php) */
/* Headings are no longer split into one <span> per word (home.js skips .bp). The settle the
   words used to make is kept on the heading as a whole: same distance, duration and easing. */
.js .bp .sh-r76-rise{transition:transform .95s var(--ease-lux,cubic-bezier(.22,1,.36,1))}
.js .bp .sh-r76-rise.is-held{transform:translateY(.5em)}
@media (prefers-reduced-motion:reduce){.js .bp .sh-r76-rise,.js .bp .sh-r76-rise.is-held{transform:none;transition:none}}

/* Links in the article: underline kept, with hover and visited states from the palette. */
.sh-r63 .bp__content a{transition:color .25s var(--ease-soft,ease),border-color .25s var(--ease-soft,ease)}
.sh-r63 .bp__content a:visited{color:var(--terracotta)}
.sh-r63 .bp__content a:hover,.sh-r63 .bp__content a:focus-visible{color:var(--slate-green);border-bottom-color:var(--slate-green)}
.sh-r63 .bp__content a:focus-visible{outline:2px solid var(--sage);outline-offset:2px;border-radius:2px}

/* ------------------------------------------------------------ 2. Plan page: the travelling name */
/* The hero was its own stacking context (isolation from the base .pd__hero), so the name's z-index
   could never lift it above the white content card (.pd__body, z 3) and it was cut off as it slid
   down. Without the isolation the name (z 4) travels over the card and lands on its heading. */
.sh-r63.sh-r76 .pd--r63 .pd__hero{isolation:auto}

/* ------------------------------------------------------------ 3. Saved buttons: hover */
/* Saved pills are slate green with off-white text, but they kept the white pill's cream hover sweep,
   so on hover the label turned white on cream and disappeared. Like the sage buttons (sage to slate
   green), the saved pill now deepens one step on hover and keeps its off-white label and icon. */
.pd__save.is-saved,.hld__save.is-saved,.pc-map__save.is-saved{--sweep:color-mix(in srgb,var(--slate-green) 80%,#1f2622);color:var(--off-white);border-color:transparent}
.pd__save.is-saved:hover,.pd__save.is-saved:focus-visible,
.hld__save.is-saved:hover,.hld__save.is-saved:focus-visible,
.pc-map__save.is-saved:hover,.pc-map__save.is-saved:focus-visible{color:var(--off-white);box-shadow:var(--lift-shadow-dark)}

/* ------------------------------------------------------------ 4. Gallery: "No results" + Reset filters */
/* Centred in the grid area; the reset is the site's outline pill (same type, height and hover sweep as the
   other buttons) with the filter panel's reset icon, which turns cream with the label on hover. */
.gal__empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;text-align:center;margin:96px auto;max-width:520px;color:var(--mid-grey)}
.gal__empty[hidden]{display:none}
.gal__empty p{margin:0}
.gal__empty .gal__empty-reset{margin:0}
.gal__empty .gal__empty-reset img{width:16px;height:16px;transition:transform .5s var(--ease-fluid),filter .45s var(--ease-soft)}
.gal__empty .gal__empty-reset:hover img,.gal__empty .gal__empty-reset:focus-visible img{transform:rotate(180deg);filter:brightness(0) invert(.95) sepia(.1)}

/* ------------------------------------------------------------ 5. Home testimonials without a photo */
/* The live site's testimonial photos are 250 to 400px squares, too small for the 480px card, so the cards
   render without the photo block. The location pill keeps its style and sits at the top of the card. */
.review-card--noimg .review-card__body{padding:20px 16px 16px}
.review-card__tag--inline{position:static;align-self:flex-start}

/* ------------------------------------------------------------ 6. Display / Charity Home map card: live map */
/* The map fills the card's picture area exactly as the static image did (same size, radius and crop),
   with the home's pin in the middle as in the Figma card. */
.bo-card__media--map{background:#e8e4da;min-height:220px}
.bo-card__media--map .sh-r76-map{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.dd__map .bo-card__media--map{min-height:260px}
@media (max-width:767px){.dd__map .bo-card__media--map{min-height:0}}

/* 7. AddressFinder suggestions (round76-af.php): the widget's list in the site's type and colours */
ul.af_list.sh-af-list{margin:6px 0 0;padding:6px 0;list-style:none;background:var(--off-white,#fdfbf9);border:1px solid rgba(66,64,64,.14);border-radius:12px;box-shadow:0 12px 32px rgba(38,36,36,.16);font-family:var(--font-body,'Montserrat',sans-serif);font-size:14px;line-height:1.35;color:var(--charcoal,#424040);z-index:100000;overflow:hidden;box-sizing:border-box;max-width:calc(100vw - 32px)}
ul.af_list.sh-af-list li.af_item{padding:10px 16px;border:0;background:transparent;color:inherit;font:inherit;cursor:pointer;white-space:normal}
ul.af_list.sh-af-list li.af_item.af_hover,ul.af_list.sh-af-list li.af_item:hover{background:color-mix(in srgb,var(--sage,#7a917f) 16%,transparent)}
ul.af_list.sh-af-list li.af_item .af_hl{font-weight:600}
ul.af_list.sh-af-list li.af_empty{padding:10px 16px;border:0;color:rgba(66,64,64,.6)}
ul.af_list.sh-af-list li.af_footer{padding:8px 16px 4px;border:0;border-top:1px solid rgba(66,64,64,.08);background:transparent;font-size:11px;color:rgba(66,64,64,.6)}

/* 8. Phones: a long office email in the footer contact column wraps instead of widening the page (blog at 402px) */
@media (max-width:768px){.footer__contact-item{min-width:0}.footer__contact-item .val{overflow-wrap:anywhere;min-width:0}}