/* =======================================================================
   DIRECTION 6 — "Deck"
   The existing Technology & Product deck language: one continuous
   background windowed by scroll, the flowing-line hero, the dot rail,
   white product cards riding the blue.
   ======================================================================= */
:root{
  --blue:#0098FF; --blue-2:#7FD0FF;
  --ink:#0A0A11; --line:rgba(255,255,255,.22); --line-2:rgba(255,255,255,.38);
  --grey:rgba(255,255,255,.80); --grey-2:rgba(255,255,255,.62);
}
html{background:#0A0A11;}
body{background:transparent; color:#fff;}
.mono{color:var(--grey-2);}

.deckbg{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background:linear-gradient(180deg,#0A0A11 0%,#0E0F17 7%,#141C2E 15%,#0B4F87 42%,#0098FF 72%,#FFFFFF 88%,#FFFFFF 100%);
  background-repeat:no-repeat; z-index:-1;
}


.nav{position:fixed; top:0; left:0; right:0; z-index:60; display:flex; align-items:center;
  justify-content:space-between; padding:14px var(--pad); background:rgba(10,10,17,.55);
  backdrop-filter:blur(12px); border-bottom:1px solid rgba(255,255,255,.14); transition:background .4s ease, color .4s ease;}
.nav__mark{height:15px; filter:brightness(0) invert(1); transition:filter .4s ease;}
.nav__meta{color:rgba(255,255,255,.6); transition:color .4s ease;}
.nav.is-light{background:rgba(255,255,255,.72); border-bottom-color:rgba(10,10,17,.12);}
.nav.is-light .nav__mark{filter:none;}
.nav.is-light .nav__meta{color:#7A828C;}
.dots{position:fixed; left:calc(var(--pad) * .45); top:50%; transform:translateY(-50%); z-index:50;
  display:flex; flex-direction:column; gap:11px;}
.dots i{width:7px; height:7px; border-radius:6px; border:1px solid rgba(255,255,255,.5); display:block; transition:all .3s ease;}
.dots i.is-on{background:#fff; border-color:#fff; height:18px;}

/* --------------------------------------------------------------- hero */
.hero{position:relative; min-height:100svh; padding-top:80px; display:flex; flex-direction:column; justify-content:flex-end;
  padding:var(--pad) var(--pad) clamp(56px,9vh,96px); overflow:hidden;}
.waves{position:absolute; inset:0; width:100%; height:100%;}
.hero__inner{position:relative; z-index:2;}
.hero__h1{margin:0; font-weight:400; letter-spacing:-.025em; line-height:1.14; font-size:clamp(28px,3.9vw,56px);}
.hero__wordmark{height:clamp(28px,3.4vw,50px); width:auto; margin-top:22px; filter:brightness(0) invert(1);}
.hero__stats{display:grid; grid-template-columns:repeat(4,1fr); max-width:1080px;
  margin-top:clamp(26px,4vh,46px); border-top:1px solid rgba(255,255,255,.30);}
.hero__stats div{padding:15px 18px 0 0; display:flex; flex-direction:column;}
.hero__stats div+div{border-left:1px solid rgba(255,255,255,.30); padding-left:18px;}
.hero__stats span{display:block; color:rgba(255,255,255,.55);}
.hero__stats b{display:block; margin-top:auto; padding-top:8px; font-weight:400;
  font-size:clamp(19px,1.85vw,29px); letter-spacing:-.03em;}
.hero__stats div:first-child b{color:var(--blue-2);}
@media (max-width:900px){ .hero__stats{grid-template-columns:1fr 1fr;}
  .hero__stats div+div{border-left:none; padding-left:0;}
  .hero__stats div:nth-child(n+3){border-top:1px solid rgba(255,255,255,.20); margin-top:4px;} }
.hero__meta{position:absolute; right:var(--pad); bottom:var(--pad); text-align:right; color:var(--grey-2); z-index:2; line-height:1.7;}

/* ------------------------------------------------------------- headings */
.kicker{margin:0 0 20px; display:flex; align-items:center; color:var(--grey-2);}
.kicker .dotmark{color:var(--blue-2);}
.h2{margin:0; font-weight:400; letter-spacing:-.03em; line-height:1.04; font-size:clamp(30px,4.2vw,60px); max-width:19ch;}
.lede{margin:22px 0 0; max-width:62ch; font-size:clamp(14.5px,1.1vw,18px); line-height:1.6; color:var(--grey);}

/* ----------------------------------------------------------- eco / cards */
.eco{background:transparent;}
.eco__stage{--cmeta:150; --railh:88; --railw:0.245;}
.connlab{font-weight:400; font-size:clamp(15px,1.7vw,26px); letter-spacing:-.025em; color:#fff;}
.connlab b{font-weight:400; color:var(--blue-2);}
.conn{color:rgba(255,255,255,.55);}
.conn .spark{fill:#fff;}

.pcard{background:#fff; color:var(--ink); border:1px solid transparent; border-radius:6px;
  transition:background .35s ease, border-color .35s ease;}
.pcard__vis{border-radius:4px; outline:1px solid rgba(10,10,17,.10);}
.pcard__num{color:#0098FF;}
.pcard__aud{color:#9AA0AA; margin-top:11px;}
.pcard__name{color:var(--ink); font-weight:400;}
.pcard__line{color:#5A6068;}
.pcard__bar{background:#0098FF;}
.pcard.is-rail{background:transparent; border-color:transparent; border-radius:0;
  border-bottom:1px solid rgba(255,255,255,.16); color:#fff;}
.pcard.is-rail .pcard__name{color:rgba(255,255,255,.62);}
.pcard.is-rail .pcard__num{color:rgba(255,255,255,.42);}
.pcard.is-rail .pcard__vis{opacity:.45; filter:saturate(.2);}
.pcard.is-active{background:#fff; border-color:#fff; border-radius:6px;}
.pcard.is-active .pcard__name{color:var(--ink);}
.pcard.is-active .pcard__num{color:#0098FF;}
.pcard.is-active .pcard__vis{opacity:1; filter:none;}
/* the rail sets color:#fff on the card, so on the white active card the audience line
   (which inherits) and the hovered name (base.css sets color:inherit on hover) went white */
.pcard.is-rail.is-active{color:var(--ink);}
.pcard.is-rail.is-active .pcard__for{color:#5A6068; opacity:1;}
/* the white ground used to fade out over .35s while the text flipped to white at once,
   so a card leaving the active state showed white-on-white. Drop the ground immediately
   on the way out, and move the text colour on the same clock as the ground on the way in. */
.pcard, .pcard__name, .pcard__num{transition-property:background, border-color, color; transition-duration:.35s; transition-timing-function:ease;}
.pcard.is-rail:not(.is-active), .pcard.is-rail:not(.is-active) .pcard__name, .pcard.is-rail:not(.is-active) .pcard__num{transition:none;}

.panel__label{color:#fff;} .panel__label .dotmark{color:var(--blue-2);}
.panel__h{font-weight:400; color:#fff;}
.panel__p{color:var(--grey);}
.panel__p--mech{border-left:1px solid rgba(255,255,255,.5); padding-left:16px; color:rgba(255,255,255,.58);}
.panel__vis .mkwrap{border-radius:6px; overflow:hidden;}
.tiers{border:1px solid var(--line); background:rgba(255,255,255,.06); border-radius:5px; overflow:hidden;}
.tier{border-right:1px solid var(--line);}
.tier:last-child{border-right:none;}
.tier__lab{color:var(--grey-2);}
.tier__p{color:var(--grey);}
.tier.is-on{background:rgba(255,255,255,.14);}
.tier.is-on .tier__lab{color:#fff;}
.stats{border-top:1px solid var(--line);}
.stats li+li{border-left:1px solid var(--line);}
.stats b{font-weight:400; color:#fff;}
.stats span{color:var(--grey-2);}

/* --------------------------------------------------------------- hfpp */
.hfpp{background:transparent; padding:clamp(84px,13vh,160px) 0;}
.eq{display:flex; border:1px solid rgba(255,255,255,.32); border-radius:6px; overflow:hidden; margin-top:clamp(34px,5vw,58px); flex-wrap:wrap; background:rgba(4,26,48,.34);}
.eq__part{padding:22px 26px; flex:1 1 200px;}
.eq__part .mono{display:block; margin-bottom:10px; color:var(--grey-2);}
.eq__part b{font-weight:400; font-size:clamp(17px,1.6vw,26px); letter-spacing:-.03em; line-height:1.15; display:block;}
.eq__part--out{background:#fff; color:var(--ink);} .eq__part--out .mono{color:#9AA0AA;}
.eq__op{display:flex; align-items:center; padding:0 18px; color:var(--grey-2); border-left:1px solid var(--line-2); border-right:1px solid var(--line-2);}
.engines{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:clamp(34px,5vw,56px);}
.engine{background:rgba(4,26,48,.34); border:1px solid rgba(255,255,255,.28); border-radius:6px; padding:24px 22px 28px; backdrop-filter:blur(6px);}
.engine__num{color:#fff; display:block; opacity:.7;}
.engine h4{margin:26px 0 0; font-weight:400; font-size:clamp(22px,2.1vw,32px); letter-spacing:-.03em;}
.engine__sub{color:var(--grey-2); margin:8px 0 0;}
.engine p:last-child{margin:14px 0 0; font-size:13.5px; line-height:1.55; color:var(--grey);}
.pipe{position:relative; height:1px; background:var(--line-2); margin-top:42px;}
.pipe__node{position:absolute; left:var(--p); top:50%; width:6px; height:6px; background:#fff; border-radius:50%; transform:translate(-50%,-50%);}
.pipe__dot{position:absolute; top:50%; left:0; width:9px; height:9px; background:#fff; border-radius:50%; transform:translate(-50%,-50%);}

/* ---------------------------------------------------------------- cta */
.cta{background:transparent; color:var(--ink); padding:clamp(84px,13vh,150px) 0 0; position:relative;}
.cta__canvas{display:none;}
.cta .kicker{color:#7A828C;} .cta .kicker .dotmark{color:#0098FF;}
.cta__h{margin:0; display:flex; flex-wrap:wrap; align-items:center; gap:0 26px;}
.cta__big{font-weight:400; font-size:clamp(78px,14vw,210px); letter-spacing:-.05em; line-height:.86; color:#0098FF;}
.cta__h2{font-weight:400; font-size:clamp(16px,1.7vw,25px); letter-spacing:-.033em; line-height:1.06; max-width:16ch; color:var(--ink);}
.cta__p{margin:clamp(26px,3.4vw,40px) 0 0; max-width:56ch; font-size:clamp(14.5px,1.12vw,17.5px); line-height:1.6; color:#4A505A;}
.cta__acts{display:flex; gap:12px; flex-wrap:wrap; margin:clamp(26px,3.4vw,40px) 0 0;}
.btn{display:inline-block; background:var(--ink); color:#fff; text-decoration:none; padding:14px 28px; border-radius:76px; font-size:14.5px; border:1px solid var(--ink); transition:all .2s ease;}
.btn:hover{background:#0098FF; border-color:#0098FF;}
.btn--ghost{background:transparent; color:var(--ink); border-color:rgba(10,10,17,.25);}
.btn--ghost:hover{background:var(--ink); color:#fff; border-color:var(--ink);}
.logos{display:flex; align-items:center; gap:clamp(22px,3.4vw,52px); flex-wrap:wrap; margin:clamp(50px,8vh,88px) 0 0; padding-top:24px; border-top:1px solid rgba(10,10,17,.16);}
.logos img{height:21px; opacity:.75;}
.foot{display:flex; align-items:center; justify-content:space-between; margin-top:clamp(50px,8vh,84px); padding:20px var(--pad); border-top:1px solid rgba(10,10,17,.16);}
.foot__mark{height:14px; opacity:.6;}
.foot .mono{color:#7A828C;}

@media (max-width:900px){
  .dots{display:none;}
  .engines{grid-template-columns:1fr;}
  .eq{flex-direction:column;}
  .eq__op{border:none; border-top:1px solid var(--line-2); border-bottom:1px solid var(--line-2); padding:8px 24px;}
  .cards{grid-template-columns:1fr;} .cta__h{flex-direction:column; gap:12px;}
  .pcard.is-rail .pcard__vis{opacity:1; filter:none;}
}

.cta__lead{margin:clamp(22px,2.8vw,38px) 0 0; font-weight:400; letter-spacing:-.032em; line-height:1.06; font-size:clamp(24px,3vw,44px); max-width:20ch;}
.cta__p{margin-top:clamp(16px,1.8vw,24px);}
.eq__part{flex:1 1 210px; min-width:0;}


.engines.is-armed .engine.is-on{background:rgba(255,255,255,.18); border-color:rgba(255,255,255,.55);}
.pipe__node.is-on{transform:translate(-50%,-50%) scale(1.6);}

.econn{color:#7FD0FF;}

.eco__sub{color:var(--grey);}

/* three-word product names need more room in the rail than one-word ones did */
.pcard__for{font-size:11.5px; line-height:1.28;}
.pcard.is-rail .pcard__name{line-height:1.12;}

/* the Veradigm surfaces are wider compositions than the product mocks this deck was
   built for, but the text column carries the prose, so the split is close to even */
.panel{grid-template-columns:minmax(0,.96fr) minmax(0,1.24fr);}

/* three surfaces, not five: shorten the scroller so each one still gets about
   115vh of scroll, and give the rail cards the height the extra room allows */
.eco__scroll{height:520vh;}
.eco__stage{--railh:104; --railgap:10;}

/* ------------------------------------------------------------ the API section */
.sdk{position:relative; z-index:1; padding:14vh 0 22vh;}
.sdk__wrap{display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr); gap:clamp(28px,4vw,72px);
  align-items:center;}
.sdk .kicker{color:#BFDCFF;} .sdk .kicker .dotmark{color:#7FD0FF;}
.sdk .h2{color:#fff;}
.sdk .lede{color:rgba(255,255,255,.72); max-width:46ch;}
.sdk__stats{list-style:none; margin:34px 0 0; padding:0; display:grid; gap:20px; border-top:1px solid rgba(255,255,255,.28);
  padding-top:22px;}
.sdk__stats li{display:flex; align-items:baseline; gap:16px;}
.sdk__stats b{font-size:clamp(21px,2vw,30px); font-weight:600; letter-spacing:-.03em; color:#fff; min-width:5.6em;}
.sdk__stats span{font-size:14px; line-height:1.4; color:rgba(255,255,255,.7);}
.sdk__vis .mkwrap{border-radius:8px; overflow:hidden;}
@media (max-width:900px){
  .sdk__wrap{grid-template-columns:1fr !important; gap:26px !important;}
  .sdk__stats b{min-width:0;}
}

/* the source frame that rides with the athena numbers */
.panel__src{margin:12px 0 0; color:rgba(255,255,255,.42); font-size:9.5px; letter-spacing:-.02em;}

/* the API stats use the panel stat rhythm: number over label, three across */
.sdk__stats{grid-template-columns:1fr 1fr !important; border-top:1px solid rgba(255,255,255,.28);
  margin-top:34px !important; gap:0 !important;}
.sdk__stats li{display:flex !important; flex-direction:column; gap:6px; padding:16px 20px 0 0 !important;}
.sdk__stats li+li{padding-left:20px !important; border-left:1px solid rgba(255,255,255,.28);}
.sdk__stats b{font-weight:600; font-size:clamp(19px,1.7vw,27px); letter-spacing:-.03em; line-height:1; color:#fff; min-width:0;}
.sdk__stats span{font-size:12.5px; line-height:1.4; color:rgba(255,255,255,.7);}

/* live-customer marquee, lifted from superscript.nyc/partners */
.logo-marquee{overflow:hidden; padding:30px 0 6px; margin:clamp(50px,8vh,88px) 0 0;
  border-top:1px solid rgba(10,10,17,.16);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);}
.mq-track{display:flex; width:max-content; animation:ss-mq 45s linear infinite;}
.mq-set{display:flex; align-items:center; gap:64px; padding-right:64px;}
.logo-marquee img{max-height:32px; max-width:160px; width:auto; height:auto;
  filter:grayscale(1); opacity:.7; mix-blend-mode:multiply;}
/* a white-on-transparent mark would vanish under the multiply */
.logo-marquee img[alt="Extension Health"]{filter:grayscale(1) brightness(0); opacity:.92;}
.logo-marquee img[alt="Gramercy Surgery Center"]{max-height:42px;}
/* light-toned marks grey out too faint */
.logo-marquee img[alt="NextGen Urgent Care"],
.logo-marquee img[alt="Allied Physicians Group"],
.logo-marquee img[alt="Consensus Health"],
.logo-marquee img[alt="Orthopaedic Associates of Muskegon"]{filter:grayscale(1) brightness(.68);}
@keyframes ss-mq{from{transform:translateX(0);} to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){.mq-track{animation:none;}}
@media (max-width:900px){
  .sdk__stats{grid-template-columns:1fr !important;}
  .sdk__stats li+li{padding-left:0 !important; border-left:none !important;}
  .logo-marquee img{max-height:26px;}
  .mq-set{gap:44px; padding-right:44px;}
}

/* a long partner name means the nav label wraps into the wordmark on phones */
@media (max-width:520px){ .nav__meta{font-size:9px; letter-spacing:.06em; white-space:nowrap;} }

/* ------------------------------------------------ proof, from the athena data pack */
.proof{position:relative; z-index:1; padding:clamp(84px,12vh,150px) 0 4vh;}
.proof .kicker{color:#BFDCFF;} .proof .kicker .dotmark{color:#7FD0FF;}
.proof .h2{color:#fff;} .proof .lede{color:rgba(255,255,255,.74); max-width:62ch;}
.pv{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:clamp(30px,4vw,52px);}
.pv__c{border:1px solid rgba(255,255,255,.26); border-radius:6px; padding:24px 26px; background:rgba(4,26,48,.30);}
.pv__c span{display:block; font-size:11px; letter-spacing:.08em; color:rgba(255,255,255,.62);}
.pv__c b{display:block; margin-top:14px; font-size:clamp(44px,5vw,72px); font-weight:400; letter-spacing:-.04em; line-height:1; color:rgba(255,255,255,.62);}
.pv__c p{margin:12px 0 0; font-size:15px; line-height:1.45; color:rgba(255,255,255,.7);}
.pv__c--us{background:#fff; border-color:#fff;}
.pv__c--us span{color:#5C6672;} .pv__c--us b{color:#0A6FC4;} .pv__c--us p{color:#1B2430;}
.bands{list-style:none; margin:14px 0 0; padding:0; display:grid; grid-template-columns:repeat(4,1fr);
  border:1px solid rgba(255,255,255,.26); border-radius:6px; overflow:hidden;}
.bands li{padding:18px 22px; border-left:1px solid rgba(255,255,255,.2);}
.bands li:first-child{border-left:0;}
.bands span{display:block; font-size:10.5px; letter-spacing:.08em; color:rgba(255,255,255,.6);}
.bands b{display:block; margin-top:8px; font-size:clamp(22px,2.2vw,32px); font-weight:400; letter-spacing:-.03em; color:#fff;}
.bands em{display:block; margin-top:4px; font-style:normal; font-size:13px; color:#9FD6FF;}
.proof__note{margin:18px 0 0; max-width:74ch; font-size:15px; line-height:1.5; color:rgba(255,255,255,.74);}
.proof__src{margin:12px 0 0; font-size:10.5px; letter-spacing:.07em; line-height:1.6; color:rgba(255,255,255,.45); max-width:110ch;}
.roi{display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(24px,4vw,64px); margin-top:clamp(48px,6vw,84px);
  padding-top:clamp(28px,3vw,40px); border-top:1px solid rgba(255,255,255,.28); align-items:start;}
.roi__big b{display:block; font-size:clamp(56px,7vw,104px); font-weight:400; letter-spacing:-.045em; line-height:.95; color:#fff;}
.roi__big p{margin:16px 0 0; font-size:15px; line-height:1.5; color:rgba(255,255,255,.74); max-width:44ch;}
.roi__rows div{display:flex; align-items:baseline; gap:16px; padding:14px 0; border-bottom:1px solid rgba(255,255,255,.18); font-size:15px;
  color:rgba(255,255,255,.74);}
.roi__rows b{margin-left:auto; font-weight:500; color:#fff; white-space:nowrap; font-size:17px;}
.roi__rows .roi__vd{border-bottom:0; color:#fff;}
.roi__rows .roi__vd b{color:#9FD6FF;}
@media (max-width:760px){
  .pv{grid-template-columns:1fr;}
  .bands{grid-template-columns:1fr 1fr;}
  .bands li:nth-child(3){border-left:0;}
  .bands li:nth-child(n+3){border-top:1px solid rgba(255,255,255,.2);}
  .roi{grid-template-columns:1fr;}
  .roi__rows div{flex-wrap:wrap; gap:4px 16px;}
}

/* ---------------------------- mission: the price equation, ported from the tech deck */
.mission{position:relative; z-index:1; min-height:100vh; display:flex; align-items:center; padding:clamp(84px,12vh,140px) 0;}
.mission .wrap{width:100%;}
.mission__h{max-width:30ch; color:#fff;}
.mission__sub{margin:18px 0 0; max-width:60ch; font-size:clamp(15px,1.2vw,18px); line-height:1.5; color:var(--grey-2);}
.mission .corner{position:absolute; width:9px; height:9px;}
.mission .corner.tl{top:-1px; left:-1px; border-top:1.5px solid var(--blue); border-left:1.5px solid var(--blue);}
.mission .corner.tr{top:-1px; right:-1px; border-top:1.5px solid var(--blue); border-right:1.5px solid var(--blue);}
.mission .corner.bl{bottom:-1px; left:-1px; border-bottom:1.5px solid var(--blue); border-left:1.5px solid var(--blue);}
.mission .corner.br{bottom:-1px; right:-1px; border-bottom:1.5px solid var(--blue); border-right:1.5px solid var(--blue);}
.pcalc{display:flex; flex-direction:column; gap:clamp(20px,3vh,40px); margin-top:clamp(56px,9vh,110px);}
.pcalc__eq{display:flex; flex-direction:column; gap:clamp(8px,1.2vw,16px); position:relative;}
.pcalc__main{display:flex; flex-direction:column; gap:clamp(24px,4vh,48px);}
.pcalc__row{display:flex; align-items:center; gap:clamp(6px,1vw,20px); margin-top:clamp(14px,2vh,28px);}
.pcalc__field{position:relative; flex:1 1 0; min-width:0;}
.pcalc__label{position:absolute; left:0; top:-20px; display:flex; align-items:center; gap:6px; font-size:9px; letter-spacing:.14em;
  color:rgba(255,255,255,.55); white-space:nowrap;}
.pcalc__label i{display:inline-block; width:12px; height:1px; background:rgba(255,255,255,.3);}
.pcalc__box{position:relative; display:flex; align-items:center; height:clamp(56px,8vh,84px); border:1px dashed rgba(255,255,255,.35);
  padding:0 clamp(8px,1.2vw,18px); transition:border-color .3s ease;}
.pcalc__field--active .pcalc__box{border-color:rgba(255,255,255,.7);}
.pcalc__box span{display:block; width:100%; font-size:clamp(12px,1.25vw,17px); line-height:1.15; letter-spacing:-.01em; color:#fff;
  transition:opacity .3s ease, transform .3s ease, filter .3s ease;}
.pcalc__field--hidden .pcalc__box span{opacity:0; transform:translateY(-6px); filter:blur(3px);}
.pcalc__op{flex-shrink:0; align-self:center; font-family:var(--mono); font-weight:300; color:rgba(255,255,255,.5); font-size:clamp(13px,2vw,22px);}
.pcalc__amtrow{display:flex; align-items:center; gap:clamp(10px,1.5vw,22px);}
.pcalc__eqsign{font-family:var(--mono); font-weight:300; color:rgba(255,255,255,.5); font-size:clamp(26px,5vw,46px); flex-shrink:0;}
.pcalc__amtwrap{position:relative;}
.pcalc__reslabel{display:flex; align-items:center; gap:6px; font-size:9px; letter-spacing:.14em; color:rgba(255,255,255,.55);
  white-space:nowrap; margin-bottom:6px;}
.pcalc__reslabel i:not(.pcalc__dot){display:inline-block; width:12px; height:1px; background:rgba(255,255,255,.3);}
.pcalc__dot{width:6px; height:6px; border-radius:50%; background:#ffcf5c; animation:pcDotPulse 1s ease-in-out infinite;}
.pcalc__dot.resolved{background:#4ade80; animation:none;}
@keyframes pcDotPulse{0%,100%{opacity:1;}50%{opacity:.3;}}
.pcalc__amt{display:block; font-family:var(--mono); font-variant-numeric:tabular-nums; font-size:clamp(44px,7vw,96px); font-weight:400;
  line-height:.85; letter-spacing:-.02em; color:#fff; transition:color .3s ease;}
.pcalc__amt--obscured{color:rgba(255,255,255,.55);}
.pcalc__bracket, .pcalc__leader{display:none;}
.pcalc__tag{flex-shrink:0; max-width:10em; font-size:clamp(26px,3.3vw,48px); line-height:.9; letter-spacing:-.02em; color:#fff;
  font-weight:400; text-transform:lowercase;}
.pcalc__tag em{font-style:italic; color:#ffcf5c;}
@media (min-width:1100px){
  .pcalc{flex-direction:row; align-items:center; gap:0;}
  .pcalc__eq{flex-direction:row; align-items:stretch;}
  .pcalc__field{flex:0 0 auto; width:clamp(150px,13vw,210px);}
  .pcalc__bracket{display:block; align-self:stretch; width:15px; border:1px solid rgba(255,255,255,.45); border-left:0; margin-left:clamp(8px,1.2vw,16px);}
  .pcalc__leader{display:block; flex:1 1 auto; height:0; border-top:1px dashed rgba(255,255,255,.4); margin:0 clamp(16px,3vw,48px); min-width:24px;}
}
@media (max-width:700px){
  .pcalc__row{flex-direction:column; align-items:stretch; gap:30px;}
  .pcalc__op{align-self:flex-start; margin:-18px 0 -12px;}
}