/* Intake effects share the portal's silver / crimson artwork language.
   Everything decorative stays behind or outside the customer’s reading area. */
.hero-copy{isolation:isolate;position:relative}
.hero-copy>.signal-art{
  content:"";position:absolute;z-index:-1;pointer-events:none;
  width:min(72%,340px);height:310px;right:-28px;top:-20px;
  background:transparent;
  opacity:.3;mix-blend-mode:screen;
  -webkit-mask-image:radial-gradient(ellipse at 89% 27%,#000 8%,#0009 39%,transparent 72%);
  mask-image:radial-gradient(ellipse at 89% 27%,#000 8%,#0009 39%,transparent 72%);
}
.hero-copy h1{position:relative;text-shadow:0 2px 16px #070809c9}
.hero-copy h1::after{
  content:"";display:block;width:75px;height:5px;margin-top:21px;
  background:linear-gradient(90deg,var(--accent-bright) 0 34px,transparent 34px 40px,#777d84 40px 53px,transparent 53px 59px,#40444a 59px 65px,transparent 65px 71px,#30343a 71px);
}
.availability>span{position:relative;box-shadow:5px 5px 0 -2px #c69cff4d}
.device-platforms span{border-color:#444a52;background:#101216;border-left:2px solid #686e78;border-radius:0}

/* The six cells are cut from the parent, so the existing progress percentage
   still fills exactly one cell per step without new markup or script. */
.progress-track{
  height:6px;border-radius:0;background:#383d45;overflow:hidden;
  -webkit-mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 6px),transparent calc(100% - 6px),transparent 100%);
  mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 6px),transparent calc(100% - 6px),transparent 100%);
  -webkit-mask-size:calc(100% / 6) 100%;mask-size:calc(100% / 6) 100%;
  -webkit-mask-repeat:repeat-x;mask-repeat:repeat-x;
}
.progress-track>span{background:var(--accent-bright);transition:none}
.intake{position:relative;border-top-width:1px;border-color:#585e67;border-radius:0;background:linear-gradient(145deg,#16181b,#101113 35%);box-shadow:0 20px 65px #0005,inset 3px 0 0 #7835cf}
.intake::before{
  content:"";position:absolute;pointer-events:none;width:23px;height:23px;right:-1px;top:-1px;
  background:linear-gradient(45deg,transparent 0 47%,#8c929b 48% 51%,#070809 52%);
}
.intake-label{color:#e2e4e8;letter-spacing:1.8px}
#step-count{color:#c68dff}
.intake-title{max-width:100%;overflow-wrap:break-word}

.choice-card{position:relative;border-radius:0;background:#17191d;box-shadow:inset 0 -1px 0 #252a31;transition:border-color 140ms ease,background 140ms ease,transform 140ms ease}
.choice-card::before{
  content:"";position:absolute;inset:4px;pointer-events:none;opacity:.18;
  background:
    linear-gradient(var(--accent-bright),var(--accent-bright)) left top / 8px 2px no-repeat,
    linear-gradient(var(--accent-bright),var(--accent-bright)) left top / 2px 8px no-repeat,
    linear-gradient(var(--accent-bright),var(--accent-bright)) right bottom / 8px 2px no-repeat,
    linear-gradient(var(--accent-bright),var(--accent-bright)) right bottom / 2px 8px no-repeat;
  transition:opacity 140ms steps(2,end);
}
.choice-card::after{
  content:"";position:absolute;pointer-events:none;width:3px;height:3px;right:10px;top:9px;
  background:var(--accent-bright);box-shadow:-5px 0 0 #c69cff80,0 5px 0 #c69cff4d;
  opacity:0;transform:translateX(-4px);transition:opacity 140ms steps(2,end),transform 140ms steps(3,end);
}
.choice-icon{border-radius:0;background:linear-gradient(135deg,#21252c,#101216);border-color:#40464f;box-shadow:inset 2px 0 0 #5c626d}
.choice-card[aria-pressed=true],.choice-card.campaign-match{border-color:#c69cff;box-shadow:inset 3px 0 0 var(--accent-bright)}
.choice-card[aria-pressed=true]::before,.choice-card.campaign-match::before,.choice-card:focus-visible::before{opacity:1}
.choice-card[aria-pressed=true]::after,.choice-card.campaign-match::after,.choice-card:focus-visible::after{opacity:1;transform:none}
.choice-card:focus-visible{background:#1e1924;outline-offset:4px}
.choice-card:focus-visible .choice-icon{border-color:#7a599c;color:#cb98ff}
.button{position:relative;border-radius:0;box-shadow:inset -5px -5px 0 #c3c7ce}
.button:not(:disabled):active{transform:translateY(1px);box-shadow:inset -2px -2px 0 #bec3ca}
.forensics-art{border-radius:0;border-top-color:#626a76;border-bottom-color:#343b45}
.forensics-art figcaption{letter-spacing:1.6px}
.case-demo,.case-answer,.case-example,.chat-bubble,.fit-note,.send-status[data-state=success]{border-radius:0}
.event-dot{border-radius:0}

@media(hover:hover){
  .choice-card:hover{background:#1e1924;border-color:var(--accent-bright)}
  .choice-card:hover::before{opacity:1}
  .choice-card:hover::after{opacity:1;transform:none}
  .choice-card:hover .choice-icon{border-color:#7a599c;color:#cb98ff}
}
@media(min-width:1200px){.hero-copy{position:sticky;top:26px}}
@media(max-width:1100px){
  .hero-copy>.signal-art{width:78%;right:-20px;top:-15px;opacity:.26}
}
@media(max-width:760px){
  .hero-copy>.signal-art{width:72%;height:205px;right:0;top:-15px;opacity:.3;background-position:91% 43%;background-size:auto 130%}
  .hero-copy h1::after{height:4px;margin-top:15px}
  .intake::before{width:19px;height:19px}
  .intake-label{letter-spacing:1.25px}
  .progress-track{margin-top:15px;margin-bottom:21px;height:5px}
  .choice-card::after{right:8px;top:7px}
}
@media(max-width:370px){
  .hero-copy>.signal-art{width:69%;height:180px;opacity:.23}
  .hero-copy h1::after{margin-top:13px}
}

/* The visual-effects preference and OS preference both stop every movement
   introduced here. Selection borders and keyboard focus remain visible. */
html[data-fx=off] .choice-card,
html[data-fx=off] .choice-card::before,
html[data-fx=off] .choice-card::after,
html[data-fx=off] .button,
html[data-fx=off] .progress-track>span{transition:none!important;animation:none!important;transform:none!important}
@media(prefers-reduced-motion:reduce){
  .choice-card,.choice-card::before,.choice-card::after,.button,.progress-track>span{transition:none!important;animation:none!important;transform:none!important}
}

.signal-art .pixel-stage,.signal-art .pixel-stage>img{width:100%;height:100%;object-fit:cover;object-position:91% 43%}.signal-art .pixel-frame,.signal-art .pixel-replay{display:none}.signal-art .pixel-canvas{mix-blend-mode:screen}
