/* B301: the HealthView case study (/customers/healthview/) and the hvhh.ai showcases on Home and Platform.
   HealthView's own colours inside CultureAI's chrome: home indigo #271D7A, hospice plum #6F2740 (hospice content only). */
.hv,.hvx{--hv-indigo:#271d7a;--hv-indigo-2:#1d155e;--hv-plum:#6f2740;--hv-tint:#f3f2fa;--hv-plum-tint:#f8eef1;--hv-bezel:#0d0b24;--hv-ink:#0a1633;--hv-slate:#425170}
.hv h1,.hv h2,.hv h3,.hvx h2,.hvx h3{text-wrap:balance}
.hv a:focus-visible,.hvx a:focus-visible{outline:3px solid #1559f5;outline-offset:3px;border-radius:6px}

/* buttons */
.hv-btn{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 22px;border-radius:999px;background:#fff;color:var(--hv-indigo);font:500 16px/1 var(--px-sans);text-decoration:none;transition:transform .2s,background .2s}
.hv-btn:hover{transform:translateY(-1px)}
.hv-btn.ghost{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5)}
.hv-btn.ghost:hover{box-shadow:inset 0 0 0 1.5px #fff}
.hv-btn.dark{background:var(--hv-ink);color:#fff}
.hv-btn.line{background:transparent;color:var(--hv-ink);box-shadow:inset 0 0 0 1.5px rgba(10,22,51,.22)}
.hv-hero a:focus-visible,.hv-close a:focus-visible,.hvx-band a:focus-visible{outline-color:#fff}
.hv-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}

/* devices, drawn in CSS around real screenshots */
.hv-laptop{position:relative}
.hv-screen{position:relative;border-radius:16px 16px 4px 4px;background:var(--hv-bezel);padding:2.2% 2.2% 3.2%;box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 40px 80px -30px rgba(5,3,30,.65)}
.hv-screen img{display:block;width:100%;height:auto;border-radius:4px}
.hv-screen::before{content:"";position:absolute;top:.9%;left:50%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:#2a2748}
.hv-lip{display:block;height:14px;margin:0 -7%;border-radius:0 0 18px 18px;background:#cfd0dc;box-shadow:inset 0 3px 2px -2px #fff,0 18px 30px -12px rgba(5,3,30,.6);position:relative}
.hv-lip::before{content:"";position:absolute;left:50%;top:0;width:16%;height:6px;margin-left:-8%;border-radius:0 0 8px 8px;background:#b4b5c5}
.hv-phone{position:relative;border-radius:16%/7.4%;background:var(--hv-bezel);padding:3.2%;box-shadow:0 0 0 1px rgba(255,255,255,.12) inset,0 30px 60px -20px rgba(5,3,30,.6)}
.hv-phone img{display:block;width:100%;height:auto;border-radius:13%/6%}
.hv-phone::after{content:"";position:absolute;top:4.6%;left:50%;width:30%;height:3.4%;transform:translateX(-50%);border-radius:999px;background:var(--hv-bezel)}
.hv-scr{border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px rgba(10,22,51,.08),0 24px 48px -24px rgba(10,22,51,.35)}
.hv-scr img{display:block;width:100%;height:auto}
.hv-card{border-radius:16px;overflow:hidden;box-shadow:0 0 0 1px rgba(10,22,51,.08),0 24px 48px -24px rgba(10,22,51,.35);background:#fff}
.hv-card img{display:block;width:100%;height:auto}
.hv-card.hv-ink{background:var(--hv-indigo);padding:22px}

/* hero: HealthView indigo, the work first */
.hv-hero{background:var(--hv-indigo);color:#fff;padding:clamp(40px,6vw,72px) 0 clamp(48px,6vw,80px);overflow:hidden}
.hv-hero-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.hv-kick{margin:0;display:flex;gap:10px;align-items:center;font:500 14px/1.4 var(--px-sans);color:#c9c4f2}
.hv-kick a{color:#fff;text-decoration:none;display:inline-flex;min-height:44px;align-items:center}
.hv-kick a:hover{text-decoration:underline}
.hv-hero .hv-logo{height:clamp(28px,3vw,38px);width:auto;display:block}
.hv-hero-g{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(24px,5vw,72px);align-items:end;margin-top:clamp(28px,4vw,48px)}
.hv-hero h1{margin:0;font:600 clamp(42px,6.2vw,84px)/1 var(--px-sans);letter-spacing:-.04em;color:#fff}
.hv-dek{margin:0;font:400 clamp(17px,1.4vw,20px)/1.55 var(--px-sans);color:#e3e0fa;max-width:520px}
.hv-stage{position:relative;margin:clamp(48px,6vw,80px) auto 0;max-width:1120px;padding:0 clamp(0px,9vw,130px) 0}
.hv-ph-l,.hv-ph-r{position:absolute;bottom:-7%;width:clamp(120px,23%,262px)}
.hv-ph-l{left:0}
.hv-ph-r{right:0}
.hv-count{margin:clamp(72px,9vw,112px) 0 0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.18)}
.hv-count div{display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:6px;padding:22px 18px 0 0}
.hv-count div+div{padding-left:18px;border-left:1px solid rgba(255,255,255,.18)}
.hv-count dd{margin:0;font:600 clamp(34px,3.6vw,52px)/1 var(--px-sans);letter-spacing:-.03em;color:#fff}
.hv-count dt{font:400 14px/1.4 var(--px-sans);color:#d2cdf4}
.hv-count-note{margin:20px 0 0;font:400 13px/1.4 var(--px-sans);color:#b9b3ea}

/* sections */
.hv-sec{padding:clamp(80px,10vw,128px) 0 0}
.hv-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 40px;align-items:end;margin-bottom:40px}
.hv-head h2,.hv-co h2,.hv-close h2{margin:0;font:600 clamp(32px,4vw,52px)/1.05 var(--px-sans);letter-spacing:-.032em;color:var(--hv-ink)}
.hv-head p{margin:0;font:400 18px/1.55 var(--px-sans);color:var(--hv-slate);max-width:520px}

/* the bento of what's live */
.hv-bento{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.hv-t{grid-column:span 6;display:flex;flex-direction:column;gap:24px;padding:clamp(22px,2.6vw,32px);border-radius:24px;background:var(--hv-tint);overflow:hidden;min-width:0}
.hv-t.w4{grid-column:span 4}.hv-t.w5{grid-column:span 5}.hv-t.w6{grid-column:span 6}.hv-t.w7{grid-column:span 7}.hv-t.w8{grid-column:span 8}
.hv-plum{background:var(--hv-plum-tint)}
.hv-tag{margin:0 0 10px;font:600 13px/1.3 var(--px-sans);letter-spacing:.02em;color:var(--hv-indigo)}
.hv-plum .hv-tag{color:var(--hv-plum)}
.hv-tx h3{margin:0;font:600 clamp(21px,1.8vw,26px)/1.2 var(--px-sans);letter-spacing:-.02em;color:var(--hv-ink)}
.hv-tx p:not(.hv-tag){margin:10px 0 0;font:400 16px/1.55 var(--px-sans);color:var(--hv-slate);max-width:52ch}
.hv-m{margin-top:auto}
.hv-mp{height:400px;overflow:hidden;display:flex;justify-content:center;margin-bottom:calc(-1 * clamp(22px,2.6vw,32px))}
.hv-mp .hv-phone{width:236px;align-self:flex-start;border-radius:36px 36px 0 0;padding:8px 8px 0;box-shadow:0 0 0 1px rgba(255,255,255,.1) inset}
.hv-mp .hv-phone img{border-radius:28px 28px 0 0}
.hv-mp .hv-phone::after{top:14px;height:22px;width:76px}
.hv-plum .hv-card{max-width:440px;margin:0 auto}
.hv-pair{display:grid;gap:16px;padding:0;background:none}
.hv-sub{display:flex;flex-direction:column;gap:18px;padding:clamp(22px,2.6vw,32px);border-radius:24px;background:var(--hv-tint)}
.hv-sub .hv-card{margin-top:auto}

/* how it runs: hvhh.ai standing on the platform */
.hv-draw{position:relative}
.hv-app{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 26px;border-radius:22px 22px 0 0;background:var(--hv-indigo);color:#d8d4f7;font:500 14px/1 var(--px-mono)}
.hv-app img{height:26px;width:auto}
.hv-stand{list-style:none;margin:0;padding:26px 26px 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;background:var(--hv-indigo)}
.hv-stand li{display:flex;flex-direction:column;min-width:0}
.hv-th{height:190px;border-radius:12px 12px 0 0;overflow:hidden;background:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.18)}
.hv-th img{display:block;width:100%;height:auto}
.hv-th-p{background:var(--hv-indigo-2);display:flex;justify-content:center;padding:10px 0 0}
.hv-th-p img{width:62%;border-radius:16px 16px 0 0}
.hv-stand p{margin:16px 0 0;display:grid;align-content:start;gap:4px;min-height:4.6em}
.hv-stand p b{font:600 16px/1.3 var(--px-sans);color:#fff}
.hv-stand p span{font:400 14px/1.45 var(--px-sans);color:#d2cdf4}
.hv-rail{display:block;width:2px;height:40px;margin:18px 0 0 18px;background:linear-gradient(#a59cf0,#5b8cfa)}
.hv-rail::after{content:"";display:block;width:8px;height:8px;margin:36px 0 0 -3px;border-radius:50%;background:#5b8cfa}
.hv-mod{position:relative;z-index:1;margin-bottom:-58px;display:grid;gap:6px;padding:16px;border-radius:14px;background:#163a9c;box-shadow:inset 0 0 0 1px #5b8cfa;min-height:118px}
.hv-mod b{font:600 15px/1.25 var(--px-sans);color:#fff}
.hv-mod span{font:400 13px/1.45 var(--px-sans);color:#d4dcf3}
.hv-run .hv-base{margin-top:0;border-radius:0 0 22px 22px;padding:84px 26px 26px}
.hv-base-p{position:relative;margin:0;max-width:760px;font:400 16px/1.55 var(--px-sans);color:#c9d3ec}
.hv-run .pf-base-top{margin-bottom:12px}
.hv-more{display:flex;flex-wrap:wrap;gap:8px 28px;margin:22px 0 0}
.hv-more a{display:inline-flex;align-items:center;gap:6px;min-height:44px;font:500 16px/1 var(--px-sans);color:#1559f5;text-decoration:none}
.hv-more a:hover{text-decoration:underline}

/* the company */
.hv-co{border-radius:28px;background:var(--hv-tint);padding:clamp(28px,4vw,56px);display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:32px 56px}
.hv-co-t img{height:34px;width:auto;display:block;margin-bottom:28px}
.hv-co-t p{margin:16px 0 0;font:400 18px/1.55 var(--px-sans);color:var(--hv-slate)}
.hv-facts{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0}
.hv-facts div{padding:22px 0 22px;border-top:1px solid rgba(39,29,122,.16);display:flex;flex-direction:column;gap:8px}
.hv-facts div:nth-child(odd){padding-right:24px}
.hv-facts dd{margin:0;font:600 clamp(36px,4vw,54px)/1 var(--px-sans);letter-spacing:-.03em;color:var(--hv-indigo)}
.hv-facts dt{font:400 15px/1.45 var(--px-sans);color:var(--hv-slate)}
.hv-src{grid-column:1/-1;margin:0;font:400 13px/1.6 var(--px-sans);color:var(--hv-slate)}
.hv-src a{color:var(--hv-ink)}

/* the people */
.hv-people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.hv-pp{margin:0;border-radius:24px;overflow:hidden;background:var(--hv-tint)}
.hv-pp img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.hv-pp figcaption{display:grid;gap:4px;padding:20px 24px 24px}
.hv-pp b{font:600 18px/1.3 var(--px-sans);color:var(--hv-ink)}
.hv-pp span{font:400 15px/1.45 var(--px-sans);color:var(--hv-slate)}
.hv-q{margin:16px 0 0;padding:clamp(28px,4vw,48px);border-radius:24px;background:var(--hv-indigo);color:#fff}
.hv-q blockquote{margin:0}
.hv-q p{margin:0;max-width:30ch;font:400 clamp(26px,3vw,40px)/1.25 var(--px-serif);letter-spacing:-.01em}
.hv-q figcaption{margin-top:20px;font:400 15px/1.5 var(--px-sans);color:#d2cdf4}
.hv-q a{color:#fff}

/* the close */
.hv-close{margin-top:clamp(80px,10vw,128px);padding:clamp(64px,8vw,104px) 0;background:var(--hv-indigo);color:#fff;text-align:center}
.hv-close h2{color:#fff}
.hv-close p{margin:16px auto 0;max-width:520px;font:400 18px/1.55 var(--px-sans);color:#e3e0fa}
.hv-close .hv-ctas{justify-content:center}

@media (max-width:980px){
  .hv-hero-g,.hv-head,.hv-co{grid-template-columns:1fr}
  .hv-count{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hv-count div:nth-child(4){padding-left:0;border-left:0}
  .hv-count div:nth-child(n+4){border-top:1px solid rgba(255,255,255,.18);margin-top:22px}
  .hv-t.w4,.hv-t.w5,.hv-t.w6,.hv-t.w7,.hv-t.w8{grid-column:span 12}
  .hv-stand{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:26px}
  .hv-mod{margin-bottom:0}
  .hv-run .hv-base{padding-top:26px;border-radius:0 0 22px 22px}
  .hv-stand{padding-bottom:26px}
}
@media (max-width:640px){
  .hv-stage{padding:0 0 18%}
  .hv-ph-l,.hv-ph-r{width:31%;bottom:0}
  .hv-ph-l{left:4%}.hv-ph-r{right:4%}
  .hv-count{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hv-count div:nth-child(n){padding-left:0;border-left:0;padding-right:12px}
  .hv-count div:nth-child(n+3){border-top:1px solid rgba(255,255,255,.18);margin-top:20px}
  .hv-count div:nth-child(even){padding-left:16px;border-left:1px solid rgba(255,255,255,.18)}
  .hv-stand{grid-template-columns:1fr;padding:20px 18px 22px}
  .hv-th{height:170px}
  .hv-rail{height:22px}.hv-rail::after{margin-top:18px}
  .hv-app{padding:16px 18px}
  .hv-run .hv-base{padding:20px 18px}
  .hv-facts{grid-template-columns:1fr}
  .hv-facts div:nth-child(odd){padding-right:0}
  .hv-people{grid-template-columns:1fr}
  .hv-mp{height:340px}
  .hv-mp .hv-phone{width:210px}
  .hv-ctas .hv-btn{flex:1 1 auto;justify-content:center}
}
@media (prefers-reduced-motion:reduce){.hv-btn{transition:none}.hv-btn:hover{transform:none}}

/* ---- showcases on Home and Platform (.hvx) ---- */
.hvx-band{background:var(--hv-indigo);color:#fff;border-radius:28px;padding:clamp(28px,4vw,56px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px clamp(28px,4vw,56px);align-items:center;overflow:hidden}
.hvx-kick{margin:0 0 18px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;font:500 14px/1.3 var(--px-sans);color:#c9c4f2}
.hvx-kick img{height:24px;width:auto}
.hvx-band h2{margin:0;font:600 clamp(32px,4vw,52px)/1.05 var(--px-sans);letter-spacing:-.032em;color:#fff}
.hvx-band .hv-ctas{gap:10px}
.hvx-band .hv-btn{padding:0 18px}
.hvx-band .hvx-p{margin:16px 0 0;font:400 18px/1.55 var(--px-sans);color:#e3e0fa;max-width:46ch}
.hvx-list{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:0}
.hvx-list li{display:grid;gap:2px;padding:12px 0;border-top:1px solid rgba(255,255,255,.16)}
.hvx-list b{font:600 16px/1.35 var(--px-sans);color:#fff}
.hvx-list span{font:400 14px/1.45 var(--px-sans);color:#d2cdf4}
.hvx-stage{position:relative;margin:0 calc(-1 * clamp(28px,4vw,56px) - 14%) 0 0;padding:0 0 10% 0}
.hvx-stage .hv-laptop{margin-left:16%}
.hvx-stage .hv-phone{position:absolute;left:0;bottom:0;width:24%}
.hvx-stage .hv-phone.p2{right:30%;bottom:-3%;width:22%;display:none}
.hvx-strip .hvx-band{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.hvx-shots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:end}
.hvx-shots .hv-phone{border-radius:28px;padding:6px}
.hvx-shots .hv-phone img{border-radius:22px}
.hvx-shots .hv-phone::after{top:12px;height:14px;width:34%}
.hvx-shots figure{margin:0}
.hvx-shots figcaption{margin-top:10px;font:500 13px/1.35 var(--px-sans);color:#d2cdf4;text-align:center}
@media (max-width:980px){.hvx-band,.hvx-strip .hvx-band{grid-template-columns:1fr}}
@media (max-width:980px){.hvx-stage{margin-right:calc(-1 * clamp(28px,4vw,56px) - 10%)}}
@media (max-width:640px){.hvx-band{border-radius:22px;padding:24px 18px}.hvx-stage{padding-bottom:16%;margin-right:-30%}.hvx-stage .hv-laptop{margin-left:14%}.hvx-stage .hv-phone{width:26%}.hvx-band .hv-btn{width:100%;justify-content:center}}
/* the page is complete at rest: no deferred painting of its sections */
.px-home.px-case main>section:nth-of-type(n){content-visibility:visible;contain-intrinsic-size:none}
.px-case .hv-hero h1,.px-case .hv-close h2,.hvx .hvx-band h2{color:#fff}
.px-case .hv-head h2,.px-case .hv-co h2{color:var(--hv-ink)}
