/**
 * Health & Social Care visual system
 * Soft mint bands, brushed circular frames, green-bordered cards.
 * Link after portal-nav.css on HSC pages (also injected by portal-nav.js).
 */
:root{
  --hsc-band:#eef2f5;
  --hsc-green:#3F8F72;
  --hsc-brand-green:#3F8F72;
  --hsc-blue:#2FA3D4;
  --hsc-ink:#102136;
  --hsc-muted:#475569;
  --hsc-card-radius:14px;
  --hsc-dot:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'%3E%3Ccircle cx='1.5' cy='1.5' r='1.1' fill='%231a4d3c' fill-opacity='.055'/%3E%3C/svg%3E");
  --hsc-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.12 0 0 0 0 0.3 0 0 0 0 0.24 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ─── Full-bleed mint band ─────────────────────────────────────────────── */
.hsc-band{
  position:relative;
  max-width:none;
  width:100%;
  margin:0;
  padding:72px 0 80px;
  overflow:hidden;
  background:var(--hsc-band);
  border-top:1px solid rgba(15,23,42,.06);
  border-bottom:1px solid rgba(15,23,42,.06);
  box-sizing:border-box;
}
.hsc-band-inner{
  position:relative;
  z-index:1;
  max-width:none;
  margin:0 auto;
  padding:0 clamp(20px,4vw,56px);
  box-sizing:border-box;
}
@media(max-width:640px){
  .hsc-band{padding:48px 0 56px;}
}

/* ─── Brushed circular image frame ─────────────────────────────────────── */
.hsc-brush{
  position:relative;
  width:min(240px,48vw);
  aspect-ratio:1;
  flex-shrink:0;
}
.hsc-brush--lg{width:min(280px,56vw);}
.hsc-brush--fluid{
  width:min(280px,70vw);
  max-width:320px;
}
.hsc-brush img{
  position:relative;z-index:2;
  width:100%;height:100%;
  object-fit:cover;object-position:center 22%;
  border-radius:50%;
  display:block;
}
.hsc-brush::before{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius:50%;
  border:3px solid var(--hsc-green);
  z-index:1;
}
.hsc-brush::after{
  content:"";
  position:absolute;
  inset:-18px -22px -14px -6px;
  border-radius:50%;
  border:2.5px solid var(--hsc-green);
  z-index:0;
  clip-path:polygon(0 8%, 28% 0, 55% 4%, 62% 22%, 48% 48%, 52% 78%, 28% 100%, 0 72%);
  transform:rotate(-12deg);
  opacity:.95;
}

/* ─── Green-bordered white cards ───────────────────────────────────────── */
.hsc-card,
.portal-body--health .portal-card,
#page-health .health-hub-card,
#page-health .health-job-card,
#page-health .hrt-card,
#page-health .hrt-feat,
#page-health .hrt-entry,
#page-health .sc,
#page-health .fc{
  background:
    radial-gradient(140px 90px at 8% 0%, rgba(63,143,114,.08), transparent 70%),
    linear-gradient(165deg, #fff 0%, #f4faf7 100%) !important;
  border:1.5px solid var(--hsc-green) !important;
  border-radius:var(--hsc-card-radius);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85);
}
#page-health .health-hub-card:hover,
#page-health .health-job-card:hover,
#page-health .hrt-card:hover,
.portal-body--health .portal-card:hover{
  border-color:var(--hsc-green) !important;
  box-shadow:0 10px 24px rgba(15,23,42,.08);
  transform:translateY(-2px);
}

/* Portal hero / inline figures → brushed circle */
.portal-body--health .portal-hero-figure.hsc-brush,
.portal-body--health .portal-inline-figure.hsc-brush{
  width:min(280px,70vw);
  max-width:320px;
  aspect-ratio:1;
  margin:0 0 22px;
  padding:0;
  overflow:visible;
  border:none !important;
  box-shadow:none !important;
  background:transparent !important;
  border-radius:0;
}
.portal-body--health .portal-hero-figure.hsc-brush img,
.portal-body--health .portal-inline-figure.hsc-brush img{
  border-radius:50%;
  width:100%;
  height:100%;
  max-height:none;
  min-height:0;
  object-fit:cover;
  object-position:center 22%;
}
.portal-body--health .portal-hero-figure.hsc-brush figcaption,
.portal-body--health .portal-inline-figure.hsc-brush figcaption{
  display:none;
}

/* Soft textured page wash for all HSC shells (injected on healthSector pages) */
body.portal-body.portal-body--health{
  background:
    radial-gradient(980px 460px at 6% -8%, rgba(47,163,212,.2), transparent 62%),
    radial-gradient(820px 420px at 96% 4%, rgba(63,143,114,.22), transparent 60%),
    radial-gradient(640px 340px at 50% 70%, rgba(47,163,212,.08), transparent 70%),
    var(--hsc-dot),
    linear-gradient(180deg, #eef6f2 0%, #e8f1f6 38%, #f3f8f5 72%, #f7faf9 100%) !important;
  background-attachment:fixed !important;
}
/* Hub page: keep texture but slightly lighter so sector hero media still leads */
body.portal-body.portal-body--health:has(#page-health){
  background:
    radial-gradient(900px 420px at 8% -5%, rgba(47,163,212,.1), transparent 60%),
    radial-gradient(780px 380px at 92% 8%, rgba(63,143,114,.12), transparent 58%),
    var(--hsc-dot),
    linear-gradient(180deg, #eef6f2 0%, #eef2f5 40%, #f7faf9 100%) !important;
}
/* Ambient ribbon graphic creates a stray mid-page band through hero copy — hide it on HSC */
body.portal-body--health .bg-image-wrap{
  display:none !important;
}
/* Keep hero text readable with a clean wash (no mid-copy stripe) */
#page-health #hsp-home .sh-left{
  background:
    linear-gradient(180deg, rgba(247,250,249,.97) 0%, rgba(238,246,242,.98) 55%, rgba(247,250,249,.99) 100%);
}
.portal-body--health .portal-page-main,
#page-health{
  background:transparent !important;
}
.portal-body--health .portal-section,
.portal-body--health .gov-section,
.portal-body--health .sg-section,
.portal-body--health .ab-section,
.portal-body--health .ccc-section,
.portal-body--health .ccc-quote,
.portal-body--health .ccc-visual-copy,
.portal-body--health .lda-section,
.portal-body--health .lda-visual-copy,
.portal-body--health .ref-panel{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(160deg, rgba(255,255,255,.96) 0%, rgba(240,248,244,.9) 55%, rgba(236,246,250,.88) 100%),
    var(--hsc-dot) !important;
  border:1.5px solid rgba(63,143,114,.28) !important;
  border-radius:16px;
  box-shadow:
    0 8px 22px rgba(16,33,54,.04),
    inset 0 1px 0 rgba(255,255,255,.8);
}
.portal-body--health .portal-section::before,
.portal-body--health .gov-section::before,
.portal-body--health .sg-section::before,
.portal-body--health .ab-section::before,
.portal-body--health .ccc-section::before,
.portal-body--health .ccc-quote::before,
.portal-body--health .ccc-visual-copy::before,
.portal-body--health .lda-section::before,
.portal-body--health .lda-visual-copy::before,
.portal-body--health .ref-panel::before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg, var(--hsc-green), rgba(47,163,212,.85), transparent 85%);
  opacity:.85;
  pointer-events:none;
  z-index:0;
}
.portal-body--health .portal-section > *,
.portal-body--health .gov-section > *,
.portal-body--health .sg-section > *,
.portal-body--health .ab-section > *,
.portal-body--health .ccc-section > *,
.portal-body--health .ccc-quote > *,
.portal-body--health .ccc-visual-copy > *,
.portal-body--health .lda-section > *,
.portal-body--health .lda-visual-copy > *,
.portal-body--health .ref-panel > *{
  position:relative;
  z-index:1;
}
.portal-body--health .portal-section:nth-of-type(even),
.portal-body--health .gov-section:nth-of-type(even),
.portal-body--health .sg-section:nth-of-type(even),
.portal-body--health .ab-section:nth-of-type(even),
.portal-body--health .ccc-section:nth-of-type(even),
.portal-body--health .lda-section:nth-of-type(even){
  background:
    linear-gradient(160deg, rgba(255,255,255,.96) 0%, rgba(232,245,250,.9) 52%, rgba(236,246,241,.88) 100%),
    var(--hsc-dot) !important;
  border-color:rgba(47,163,212,.28) !important;
}
.portal-body--health .portal-section:nth-of-type(even)::before,
.portal-body--health .gov-section:nth-of-type(even)::before,
.portal-body--health .sg-section:nth-of-type(even)::before,
.portal-body--health .ab-section:nth-of-type(even)::before,
.portal-body--health .ccc-section:nth-of-type(even)::before,
.portal-body--health .lda-section:nth-of-type(even)::before{
  background:linear-gradient(90deg, var(--hsc-blue), rgba(63,143,114,.8), transparent 85%);
}
.portal-body--health .portal-section{
  padding:clamp(20px,3vw,28px);
  margin-bottom:18px;
}
.portal-body--health .portal-hero,
.portal-body--health .gov-hero,
.portal-body--health .sg-hero,
.portal-body--health .ab-hero,
.portal-body--health .ccc-hero,
.portal-body--health .lda-hero,
.portal-body--health .ref-hero,
.portal-body--health .team-masthead{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(125deg, rgba(255,255,255,.97) 0%, rgba(230,245,238,.94) 46%, rgba(224,242,249,.93) 100%),
    var(--hsc-grain) !important;
  border:1.5px solid rgba(63,143,114,.32) !important;
  border-radius:18px;
  box-shadow:
    0 12px 30px rgba(16,33,54,.06),
    inset 0 1px 0 rgba(255,255,255,.85);
}
.portal-body--health .portal-hero{
  padding:clamp(20px,3vw,32px);
}
.portal-body--health .portal-hero::before,
.portal-body--health .gov-hero::before,
.portal-body--health .sg-hero::before,
.portal-body--health .ab-hero::before,
.portal-body--health .ccc-hero::before,
.portal-body--health .lda-hero::before,
.portal-body--health .ref-hero::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(420px 220px at 92% 18%, rgba(47,163,212,.14), transparent 70%),
    radial-gradient(360px 200px at 12% 88%, rgba(63,143,114,.12), transparent 72%);
  z-index:0;
}
.portal-body--health .portal-hero > *,
.portal-body--health .gov-hero > *,
.portal-body--health .sg-hero > *,
.portal-body--health .ab-hero > *,
.portal-body--health .ccc-hero > *,
.portal-body--health .lda-hero > *,
.portal-body--health .ref-hero > *,
.portal-body--health .team-masthead > *{
  position:relative;
  z-index:1;
}
.portal-body--health .portal-card,
.portal-body--health .gov-pillar,
.portal-body--health .sg-pillar,
.portal-body--health .ccc-pillar,
.portal-body--health .ccc-why li,
.portal-body--health .ccc-steps li,
.portal-body--health .ccc-partners li,
.portal-body--health .lda-pillar,
.portal-body--health .lda-topic,
.portal-body--health .ab-value,
.portal-body--health .gov-topic,
.portal-body--health .team-person,
.portal-body--health .ref-note,
.portal-body--health .sg-contact-card,
.portal-body--health .ab-accred-item{
  background:
    radial-gradient(120px 80px at 12% 0%, rgba(63,143,114,.1), transparent 70%),
    radial-gradient(140px 90px at 100% 100%, rgba(47,163,212,.1), transparent 72%),
    linear-gradient(165deg, rgba(255,255,255,.98), rgba(236,246,241,.65)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}
.portal-body--health .ab-cta,
.portal-body--health .sg-cta,
.portal-body--health .ccc-cta,
.portal-body--health .lda-cta,
.portal-body--health .gov-cta-referral,
.portal-body--health .ccc-cta-referral,
.portal-body--health .lda-cta-referral{
  position:relative;
  overflow:hidden;
}
.portal-body--health .ab-cta,
.portal-body--health .sg-cta,
.portal-body--health .ccc-cta,
.portal-body--health .lda-cta{
  background:
    radial-gradient(420px 180px at 10% 0%, rgba(63,143,114,.2), transparent 70%),
    radial-gradient(380px 170px at 95% 100%, rgba(47,163,212,.2), transparent 70%),
    linear-gradient(135deg, rgba(63,143,114,.16) 0%, rgba(47,163,212,.14) 100%),
    var(--hsc-dot) !important;
  box-shadow:
    0 14px 30px rgba(16,33,54,.06),
    inset 0 1px 0 rgba(255,255,255,.55);
}

/* Vacancies / apply (fat sector pages) */
#page-vacancies .fc,
body.vacancies-hsc .fc,
#page-vacancies .vac-card,
.portal-body--health .vac-card{
  border:1.5px solid var(--hsc-green) !important;
  background:#fff !important;
  box-shadow:none;
}

/* ─── Section headers — livelier brand colour (HSC only) ───────────────── */
#page-health .sec-ey,
#page-health .hrt-kicker,
#page-health .health-hub-tag,
#page-health .accred-ey,
.portal-body--health .portal-section h2,
.portal-body--health .portal-bc .bc-link-a{
  color:var(--hsc-blue) !important;
}
#page-health .hrt-kicker::before{
  background:linear-gradient(90deg,var(--hsc-green),var(--hsc-blue));
}
#page-health #hsp-home .sh-h1{
  color:#16352c;
}
/* Two-tone brand in headings — name in HSC blue against forest-green titles */
.hsc-brand{
  color:var(--hsc-brand-green, #3F8F72);
}
#page-health .sh-h1 .hsc-brand,
#page-health .sec-t .hsc-brand,
#page-health .hrt-h2 .hsc-brand,
#page-health h1 .hsc-brand,
#page-health h2 .hsc-brand,
#page-health h3 .hsc-brand,
.portal-body--health h1 .hsc-brand,
.portal-body--health h2 .hsc-brand,
.portal-body--health h3 .hsc-brand,
.portal-body--health .sec-t .hsc-brand,
.portal-body--health .hrt-h2 .hsc-brand,
.portal-body--health .team-page-title .hsc-brand,
.portal-body--health [data-ab="title"] .hsc-brand,
.portal-body--health [data-sg="title"] .hsc-brand{
  color:var(--hsc-brand-green, #3F8F72) !important;
  background:none !important;
  -webkit-text-fill-color:unset !important;
}
/* Primary section titles — clear forest green */
#page-health .sec-t,
#page-health .hrt-h2,
#page-health .contact-bar-txt{
  color:var(--hsc-green) !important;
  background:none !important;
  -webkit-text-fill-color:unset !important;
}
/* Card / job titles — deep green ink */
#page-health .health-hub-h,
#page-health .health-job-title,
#page-health .hrt-feat h3,
#page-health .hrt-card h3,
#page-health .sc-t,
#page-health .cqc-body h4{
  color:#1a4d3c !important;
  background:none !important;
  -webkit-text-fill-color:unset !important;
}
.portal-body--health .portal-hero h1{
  color:var(--hsc-green) !important;
  background:none !important;
  -webkit-text-fill-color:unset !important;
}
.portal-body--health .portal-card strong{
  color:#1a4d3c !important;
}
#page-health .health-job-link,
#page-health .health-hub-more{
  color:var(--hsc-blue);
}
#page-health .stats-row--light .stat-val,
#page-health .stat-val{
  color:#2FA3D4 !important;
}

/* ─── Larger type across Health & Social Care ──────────────────────────── */
#page-health,
.portal-body--health{
  font-size:19px;
  line-height:1.7;
}
#page-health .sec-ey,
#page-health .hrt-kicker,
#page-health .health-hub-tag{
  font-size:12px !important;
  letter-spacing:.14em;
}
#page-health .sec-t{
  font-size:clamp(28px,3.5vw,40px) !important;
}
#page-health .hrt-h2{
  font-size:clamp(28px,3.5vw,40px) !important;
}
#page-health .sec-s,
#page-health .hrt-p,
#page-health #hsp-home .sh-sub,
#page-health #hsp-home .sh-sub p,
#page-health #hsp-home .sh-sub ul,
#page-health .sh-sub{
  font-size:19px !important;
  line-height:1.75 !important;
  max-width:62ch;
}
#page-health #hsp-home .sh-h1{
  font-size:clamp(28px,3.6vw,42px) !important;
}
#page-health .health-hub-h,
#page-health .health-staff-box h3,
#page-health .hrt-card h3,
#page-health .hrt-feat h3{
  font-size:clamp(18px,1.6vw,22px) !important;
}
#page-health .health-hub-card > p,
#page-health .hrt-card p,
#page-health .hrt-feat p,
#page-health .hrt-panel p{
  font-size:18px !important;
  line-height:1.7 !important;
}
#page-health .health-job-title{font-size:20px !important;}
#page-health .health-job-meta{font-size:15px !important;}
#page-health .health-job-summary{font-size:18px !important;}
#page-health .health-job-link{font-size:12.5px !important;}
#page-health .btn-lg{
  font-size:13px !important;
  min-height:54px;
  padding:15px 28px;
}
#page-health .contact-bar-txt{
  font-size:clamp(24px,2.8vw,32px) !important;
}
#page-health .contact-bar-sub{
  font-size:18px !important;
}
.portal-body--health .portal-hero h1{
  font-size:clamp(28px,3.6vw,42px) !important;
}
.portal-body--health .portal-hero-lead,
.portal-body--health .portal-lead,
.portal-body--health .portal-section p,
.portal-body--health .portal-section li,
.portal-body--health .portal-card span{
  font-size:18px !important;
  line-height:1.7 !important;
}
.portal-body--health .portal-card strong{
  font-size:17px !important;
}