/* /vs/ story pages (layout 'story', scripts/vs-story.js): the premium comparison layout.
   Loaded after vs.css and reuses its tokens (--vsx-*), which are the homepage's: #0A0A0A,
   the pink accent #F4A0B0, Playfair Display for display type, Nunito for text.
   Motion only under html.vsx-motion (set in <head> only when prefers-reduced-motion is not
   "reduce"); without it every visual renders in its finished, static state. */

.vsx-story .vsx-hero{padding:96px 24px 88px}
.vsx-story .vsx-hero .vsx-eyebrow{margin-bottom:20px}
.vsx-story .vsx-hero h1{max-width:20ch;margin:0 auto 20px}
.vsx-story .vsx-hero .lead{font-family:var(--vsx-display);font-style:italic;font-size:clamp(20px,2.4vw,26px);line-height:1.4;color:var(--vsx-accent);max-width:36ch;margin:0 auto 28px}
.vsx-story .vsx-answer{text-align:left;margin-top:40px}
.vsx-story .vsx-pair figcaption{font-size:15px}

/* What the competitor offers: honest strengths, short */
.vsx-offer{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:40px auto 0;max-width:1000px;padding:0;list-style:none}
.vsx-offer li{border:1px solid var(--vsx-line);border-radius:16px;padding:22px 22px 20px;background:rgba(255,255,255,.02)}
.vsx-offer b{display:block;font-family:var(--vsx-display);font-weight:500;font-size:20px;line-height:1.3;color:var(--vsx-ink);margin-bottom:6px}
.vsx-offer span{display:block;font-size:16px;line-height:1.6;color:var(--vsx-sub)}

/* ── HOW IT WORKS ─────────────────────────────────────────────────────────────── */
.vsx-hiw-sec{background:radial-gradient(900px 480px at 30% 40%,rgba(244,160,176,.08),transparent 70%),var(--vsx-bg)}
.hiw{position:relative;margin:48px auto 0;max-width:1000px}
.hiw-phone,.hiw-now{display:none}
.hiw-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;counter-reset:none}
.hiw-step{margin:0}
.hiw-txt{all:unset;box-sizing:border-box;display:block;width:100%;margin-top:16px;color:var(--vsx-ink);font-family:var(--vsx-body);cursor:default}
.hiw-txt .n{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;border:1.5px solid var(--vsx-accent);font-weight:800;font-size:14px;margin-bottom:10px}
.hiw-txt b{display:block;font-family:var(--vsx-display);font-weight:500;font-size:20px;line-height:1.3}
.hiw-txt .d{display:block;font-size:15px;line-height:1.6;color:var(--vsx-sub);margin-top:6px}
.hiw-txt .bar{display:none}
.hiw-ctrl{display:none}
.hiw-label{font-size:14px!important;color:var(--vsx-mute)!important;text-align:center;margin-top:28px!important}

/* one screen: 9:16, finished state by default */
.hiw-shot{position:relative;aspect-ratio:9/16;border-radius:22px;overflow:hidden;background:#111;color:#fff;font-family:var(--vsx-body);box-shadow:0 0 0 6px #050505,0 24px 60px rgba(0,0,0,.5),0 0 0 7px rgba(244,160,176,.22);container-type:inline-size}
.hiw-shot img{display:block;width:100%;height:100%;object-fit:cover}
.hiw-shot .hdr{position:absolute;left:0;right:0;top:0;z-index:3;padding:7cqw 6cqw 5cqw;font-size:max(9px,6.2cqw);font-weight:800;line-height:1.2;background:linear-gradient(rgba(0,0,0,.92),rgba(0,0,0,0))}
.hiw-shot .hdr small{display:block;font-weight:600;font-size:max(8px,4.6cqw);color:rgba(255,255,255,.78);margin-top:1.5cqw}
.hiw-shot .grid{position:absolute;left:2.5cqw;right:2.5cqw;top:25cqw;display:grid;gap:1.5cqw}
.hiw-shot .g3{grid-template-columns:repeat(3,1fr)}
.hiw-shot .grid .t{position:relative;aspect-ratio:1;border-radius:2.5cqw;overflow:hidden;background:#222}
.hiw-shot .pill{position:absolute;left:6cqw;right:6cqw;bottom:6cqw;z-index:3;text-align:center;font-weight:800;font-size:max(8px,5cqw);padding:4cqw;border-radius:99px;background:var(--vsx-accent);color:var(--vsx-accent-ink)}
.hiw-shot .pill.soft{background:rgba(0,0,0,.78);color:#fff;box-shadow:inset 0 0 0 1px rgba(244,160,176,.5)}
/* 1 reference */
.hiw-reference .t.ref{box-shadow:0 0 0 1.2cqw var(--vsx-accent);z-index:1}
.hiw-reference .tick{position:absolute;right:3cqw;top:3cqw;width:9cqw;height:9cqw;border-radius:50%;background:var(--vsx-accent)}
.hiw-reference .tick::after{content:'';position:absolute;left:31%;top:22%;width:28%;height:44%;border:solid var(--vsx-accent-ink);border-width:0 .9cqw .9cqw 0;transform:rotate(45deg)}
.hiw-reference .t:not(.ref) img{filter:brightness(.55)}
/* 2 discover */
.hiw-discover .t.miss img{filter:brightness(.28) saturate(.4)}
.hiw-discover .t.hit{box-shadow:0 0 0 1cqw var(--vsx-accent)}
.hiw-discover .sweep{display:none}
/* 3 choose */
.hiw-choose .t b{position:absolute;left:2cqw;top:2cqw;min-width:8cqw;height:8cqw;padding:0 1.5cqw;border-radius:99px;background:rgba(0,0,0,.72);font-size:max(8px,4.6cqw);display:flex;align-items:center;justify-content:center}
.hiw-choose .t:first-child{box-shadow:0 0 0 1cqw var(--vsx-accent)}
/* 4 personal */
.hiw-personal .form{position:absolute;left:5cqw;right:5cqw;top:26cqw;bottom:5cqw;display:flex;flex-direction:column;gap:4cqw}
.hiw-personal .fld{background:rgba(255,255,255,.06);border-radius:4cqw;padding:4cqw}
.hiw-personal .lbl{display:block;font-size:max(7px,3.8cqw);font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--vsx-accent);margin-bottom:2cqw}
.hiw-personal .msg{font-family:var(--vsx-display)!important;font-style:italic;font-size:max(9px,5.6cqw)!important;line-height:1.35!important;color:#fff!important;margin:0!important}
.hiw-personal .seg{display:grid;grid-template-columns:1fr 1fr;gap:2cqw;margin-bottom:3cqw}
.hiw-personal .seg span{text-align:center;font-size:max(8px,4.4cqw);font-weight:700;padding:2.4cqw 0;border-radius:2.5cqw;border:.4cqw solid rgba(255,255,255,.14);color:rgba(255,255,255,.6)}
.hiw-personal .seg .b{border-color:var(--vsx-accent);background:rgba(244,160,176,.16);color:#fff}
.hiw-personal .track{display:none;font-size:max(8px,4.6cqw);padding:2cqw 0;color:rgba(255,255,255,.85)}
.hiw-personal .rec{display:flex;align-items:center;gap:3cqw;background:#0a0a0a;border-radius:3cqw;padding:3cqw}
.hiw-personal .mic{flex:none;width:9cqw;height:9cqw;border-radius:50%;background:radial-gradient(circle,rgba(244,160,176,.55),rgba(244,160,176,0) 70%);position:relative}
.hiw-personal .mic::after{content:'';position:absolute;left:36%;top:18%;width:28%;height:46%;border-radius:99px;background:var(--vsx-accent)}
.hiw-personal .wave{flex:1;display:flex;align-items:center;gap:.8cqw;height:10cqw}
.hiw-personal .wave i{flex:1;height:100%;border-radius:1cqw;background:linear-gradient(var(--vsx-accent),rgba(244,160,176,.45));transform:scaleY(var(--h));opacity:.8}
.hiw-personal .time{font-size:max(8px,4.2cqw);font-weight:700;font-variant-numeric:tabular-nums}
.hiw-personal .note{display:block;font-size:max(7px,3.8cqw);color:rgba(255,255,255,.6);margin-top:2.5cqw}
/* 5 play */
.hiw-play{background:#000}
.hiw-play .film,.hiw-play .s{position:absolute;inset:0}
.hiw-play .s{opacity:0}
.hiw-play .s:last-child{opacity:1}
.hiw-play .s img{transform:scale(1.06)}
.hiw-play .cap{position:absolute;left:0;right:0;bottom:0;padding:30cqw 6cqw 7cqw;text-align:center;background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.88));display:flex;flex-direction:column;align-items:center}
.hiw-play .ttl{font-family:var(--vsx-display);font-style:italic;font-size:max(12px,9.5cqw);line-height:1.15}
.hiw-play .sub{font-size:max(8px,4.4cqw);color:rgba(255,255,255,.85);margin-top:2.5cqw}
.hiw-play .chips{display:flex;flex-wrap:wrap;justify-content:center;gap:2cqw;margin-top:4cqw}
.hiw-play .chips span{font-size:max(7px,4cqw);font-weight:700;padding:1.6cqw 3.2cqw;border-radius:99px;background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 .3cqw rgba(244,160,176,.45)}

/* static storyboard on phones / narrow screens: one step per row */
@media (max-width:900px){
  .hiw-steps{grid-template-columns:1fr;gap:28px;max-width:520px;margin:0 auto}
  .hiw-step{display:grid;grid-template-columns:132px minmax(0,1fr);gap:18px;align-items:center}
  .hiw-txt{margin-top:0}
  .hiw-txt b{font-size:19px}
}

/* ── MOTION: one phone, five screens in turn ───────────────────────────────── */
html.vsx-motion .hiw{display:grid;grid-template-columns:300px minmax(0,1fr);column-gap:64px;align-items:center}
html.vsx-motion .hiw-phone{display:block;grid-column:1;grid-row:1 / span 2;width:300px;height:calc(280px * 16 / 9 + 20px);border-radius:40px;background:#050505;box-shadow:0 30px 80px rgba(0,0,0,.45),0 0 0 1px rgba(244,160,176,.3)}
html.vsx-motion .hiw-steps{grid-column:2;grid-row:1;display:block;max-width:none;margin:0}
html.vsx-motion .hiw-step{display:block}
html.vsx-motion .hiw-shot{position:absolute;left:10px;top:var(--phone-top,0px);width:280px;margin-top:10px;border-radius:31px;box-shadow:none;opacity:0;visibility:hidden;transition:opacity .5s ease,visibility 0s linear .5s}
html.vsx-motion .hiw-step.on .hiw-shot{opacity:1;visibility:visible;transition:opacity .5s ease}
html.vsx-motion .hiw-txt{cursor:pointer;display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:16px;padding:14px 0;margin:0;border-top:1px solid var(--vsx-line)}
html.vsx-motion .hiw-step:last-child .hiw-txt{border-bottom:1px solid var(--vsx-line)}
html.vsx-motion .hiw-txt .n{grid-row:1 / span 3;margin:0;border-color:rgba(255,255,255,.28);color:var(--vsx-mute)}
html.vsx-motion .hiw-txt b{color:var(--vsx-mute);transition:color .3s}
html.vsx-motion .hiw-txt .d{color:var(--vsx-mute);font-size:15px}
html.vsx-motion .hiw-step.on .hiw-txt b{color:var(--vsx-ink)}
html.vsx-motion .hiw-step.on .hiw-txt .d{color:var(--vsx-sub)}
html.vsx-motion .hiw-step.on .hiw-txt .n{background:var(--vsx-accent);border-color:var(--vsx-accent);color:var(--vsx-accent-ink)}
html.vsx-motion .hiw-txt:focus-visible{outline:2px solid var(--vsx-accent);outline-offset:4px;border-radius:6px}
html.vsx-motion .hiw-txt .bar{display:block;grid-column:2;height:2px;margin-top:10px;background:rgba(255,255,255,.1);border-radius:2px;overflow:hidden;visibility:hidden}
html.vsx-motion .hiw-step.on .hiw-txt .bar{visibility:visible}
html.vsx-motion .hiw-txt .bar i{display:block;height:100%;width:0;background:var(--vsx-accent)}
html.vsx-motion .hiw-step.on .hiw-txt .bar i{animation:hiwBar var(--dur,4s) linear forwards}
html.vsx-motion .hiw.done .hiw-txt .bar i,html.vsx-motion .hiw.manual .hiw-txt .bar i{animation:none;width:100%}
html.vsx-motion .hiw-ctrl{display:flex;gap:12px;grid-column:2;grid-row:2;align-self:start;margin-top:20px}
.hiw-ctrl button{min-height:44px;padding:0 20px;border-radius:99px;border:1px solid rgba(255,255,255,.3);background:transparent;color:#fff;font:700 14px var(--vsx-body);cursor:pointer}
.hiw-ctrl button:hover{border-color:#fff}
.hiw-ctrl button:focus-visible{outline:2px solid var(--vsx-accent);outline-offset:3px}
html.vsx-motion .hiw-label{grid-column:1 / -1;grid-row:3}
html.vsx-motion .hiw.paused *{animation-play-state:paused!important}
body.vsx-hiw-inview #cc-compare-widget{opacity:0;pointer-events:none;transition:opacity .25s ease}
@keyframes hiwBar{to{width:100%}}

/* screen animations (they restart each time a screen becomes .on) */
html.vsx-motion .hiw-step.on .hiw-reference .grid{animation:hiwRoll 2.4s cubic-bezier(.2,.7,.2,1) both}
html.vsx-motion .hiw-step.on .hiw-reference .t:not(.ref) img{animation:hiwDim .6s ease 1.7s both}
html.vsx-motion .hiw-step.on .hiw-reference .t.ref{animation:hiwPick .6s ease 1.7s both}
html.vsx-motion .hiw-step.on .hiw-reference .tick,html.vsx-motion .hiw-step.on .hiw-reference .pill{animation:hiwIn .45s ease 2.1s both}
@keyframes hiwRoll{from{transform:translateY(38%)}}
@keyframes hiwDim{from{filter:none}}
@keyframes hiwPick{from{box-shadow:0 0 0 0 var(--vsx-accent);transform:scale(1)}60%{transform:scale(1.06)}}
@keyframes hiwIn{from{opacity:0;transform:translateY(8px)}}
html.vsx-motion .hiw-discover .sweep{display:block;position:absolute;left:-3%;right:-3%;height:22%;top:-22%;background:linear-gradient(rgba(244,160,176,0),rgba(244,160,176,.45),rgba(244,160,176,0));pointer-events:none}
html.vsx-motion .hiw-step.on .hiw-discover .sweep{animation:hiwSweep 2.2s linear .3s both}
html.vsx-motion .hiw-step.on .hiw-discover .t.miss img{animation:hiwMiss .4s ease both;animation-delay:calc(.45s + var(--i) * .17s)}
html.vsx-motion .hiw-step.on .hiw-discover .t.hit{animation:hiwHit .5s ease both;animation-delay:calc(.45s + var(--i) * .17s)}
html.vsx-motion .hiw-step.on .hiw-discover .pill{animation:hiwIn .45s ease 2.7s both}
@keyframes hiwSweep{to{top:100%}}
@keyframes hiwMiss{from{filter:none}}
@keyframes hiwHit{from{box-shadow:0 0 0 0 var(--vsx-accent);transform:scale(.96)}}
html.vsx-motion .hiw-step.on .hiw-choose .t{animation:hiwPop .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(.2s + var(--i) * .22s)}
html.vsx-motion .hiw-step.on .hiw-choose .pill{animation:hiwIn .45s ease 2.2s both}
@keyframes hiwPop{from{opacity:0;transform:translateY(30%) scale(.8)}}
html.vsx-motion .hiw-step.on .hiw-personal .msg{animation:hiwType 1.6s steps(24) .2s both}
html.vsx-motion .hiw-step.on .hiw-personal .seg .b{animation:hiwSeg .4s ease 1.9s both}
html.vsx-motion .hiw-step.on .hiw-personal .rec{animation:hiwIn .4s ease 2.1s both}
html.vsx-motion .hiw-step.on .hiw-personal .wave i{animation:hiwWave .9s ease-in-out calc(2.3s + var(--i) * -.07s) infinite alternate}
@keyframes hiwType{from{clip-path:inset(0 100% 0 0)}}
@keyframes hiwSeg{from{border-color:rgba(255,255,255,.14);background:transparent;color:rgba(255,255,255,.6)}}
@keyframes hiwWave{from{transform:scaleY(calc(var(--h) * .35))}to{transform:scaleY(var(--h))}}
html.vsx-motion .hiw-play .s{opacity:0}
html.vsx-motion .hiw-step.on .hiw-play .s{animation:hiwSlide 6s ease both;animation-delay:calc(var(--i) * 1.9s)}
html.vsx-motion .hiw-step.on .hiw-play .s:last-child{animation-name:hiwSlideLast}
html.vsx-motion .hiw-step.on .hiw-play .s img{animation:hiwKen 6s ease-out both;animation-delay:calc(var(--i) * 1.9s)}
html.vsx-motion .hiw-step.on .hiw-play .chips{animation:hiwIn .5s ease 4.4s both}
@keyframes hiwSlide{0%{opacity:0}10%{opacity:1}32%{opacity:1}42%{opacity:0}100%{opacity:0}}
@keyframes hiwSlideLast{0%{opacity:0}10%{opacity:1}100%{opacity:1}}
@keyframes hiwKen{from{transform:scale(1)}to{transform:scale(1.12)}}

@media (max-width:900px){
  html.vsx-motion .hiw{grid-template-columns:1fr;max-width:520px}
  html.vsx-motion .hiw-phone{grid-column:1;grid-row:1;width:260px;height:calc(240px * 16 / 9 + 18px);margin:0 auto 20px}
  html.vsx-motion .hiw-now{display:block;grid-column:1;grid-row:2;min-height:10.5em;margin:0 0 8px!important;text-align:center;font-size:16px!important;line-height:1.5!important}
  html.vsx-motion .hiw-now b{display:block;font-family:var(--vsx-display);font-weight:500;font-size:21px;line-height:1.3;color:var(--vsx-ink)}
  html.vsx-motion .hiw-now span{display:block;margin-top:4px;color:var(--vsx-sub)}
  html.vsx-motion .hiw-shot{left:calc(50% - 120px);width:240px;margin-top:9px;border-radius:27px}
  html.vsx-motion .hiw-steps{grid-column:1;grid-row:3}
  html.vsx-motion .hiw-ctrl{grid-column:1;grid-row:4;justify-content:center}
  html.vsx-motion .hiw-label{grid-row:5}
  html.vsx-motion .hiw-txt{padding:10px 0}
  html.vsx-motion .hiw-txt b{font-size:18px}
  /* the explanation is shown in .hiw-now above; kept here for screen readers */
  html.vsx-motion .hiw-txt .d{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  html.vsx-motion .hiw-txt .bar{margin-top:6px}
}

/* ── MEMORIES: the emotional core ──────────────────────────────────────────── */
.vsx-mem{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:72px;align-items:center;max-width:1040px;margin:0 auto}
.vsx-mem h2{font-size:clamp(34px,4.6vw,52px)!important;line-height:1.08!important}
.vsx-mem .copy p+p{margin-top:16px}
.vsx-voice{display:flex;align-items:center;gap:14px;margin-top:28px;padding:16px 18px;background:#0a0a0a;border-radius:18px;box-shadow:0 18px 44px rgba(0,0,0,.3),0 0 0 1px rgba(244,160,176,.22)}
.vsx-voice .ppl{display:flex;gap:8px;flex:none}
.vsx-voice .ppl img{width:44px;height:78px;object-fit:cover;border-radius:10px}
.vsx-voice .wv{flex:1;display:flex;align-items:center;gap:3px;height:40px}
.vsx-voice .wv i{flex:1;height:100%;border-radius:2px;background:linear-gradient(var(--vsx-accent),rgba(244,160,176,.45));transform:scaleY(var(--h));opacity:.75}
html.vsx-motion .vsx-voice .wv i{animation:hiwWave .8s ease-in-out calc(var(--i) * -.06s) infinite alternate}
.vsx-voice-lab{font-size:16px!important;margin-top:14px!important}
.vsx-voice-lab b{color:var(--vsx-ink)}
.vsx-illus{font-size:15px!important;font-weight:700;color:var(--vsx-ink)!important;margin-top:10px!important}

/* The whole flow, as one line (not a checklist) */
.vsx-flow{list-style:none;margin:72px auto 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;max-width:1120px;position:relative}
.vsx-flow::before{content:'';position:absolute;left:10%;right:10%;top:23px;height:1px;background:linear-gradient(90deg,rgba(244,160,176,0),rgba(244,160,176,.6),rgba(244,160,176,0))}
.vsx-flow li{position:relative;text-align:center;padding:0 12px}
.vsx-flow .dot{position:relative;display:flex;align-items:center;justify-content:center;width:46px;height:46px;margin:0 auto 16px;border-radius:50%;background:var(--vsx-bg2);border:1.5px solid var(--vsx-accent);color:var(--vsx-accent);font-weight:800}
.vsx-flow b{display:block;font-family:var(--vsx-display);font-weight:500;font-size:20px;line-height:1.3;color:var(--vsx-ink)}
.vsx-flow span{display:block;font-size:15px;line-height:1.55;color:var(--vsx-sub);margin-top:6px}

/* ── PRICING ───────────────────────────────────────────────────────────────── */
.vsx-prices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:48px}
.vsx-price{border:1px solid var(--vsx-line);border-radius:20px;padding:28px 26px;background:rgba(255,255,255,.02);display:flex;flex-direction:column}
.vsx-price.ours{border-color:rgba(244,160,176,.45);background:linear-gradient(160deg,rgba(244,160,176,.10),rgba(244,160,176,.02));box-shadow:0 0 60px rgba(244,160,176,.08)}
.vsx-price .who{font-size:12px;font-weight:800;letter-spacing:2.5px;text-transform:uppercase;color:var(--vsx-mute)}
.vsx-price.ours .who{color:var(--vsx-accent)}
.vsx-price h3{margin:10px 0 4px!important}
.vsx-price .big{font-family:var(--vsx-display);font-size:40px;line-height:1.1;color:var(--vsx-ink);margin:8px 0 2px}
.vsx-price .per{font-size:15px;color:var(--vsx-mute)}
.vsx-price ul{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:10px}
.vsx-price li{position:relative;padding-left:20px;font-size:16px;line-height:1.55;color:var(--vsx-sub)}
.vsx-price li::before{content:'';position:absolute;left:2px;top:10px;width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.35)}
.vsx-price.ours li::before{background:var(--vsx-accent)}
.vsx-price .kind{margin-top:auto!important;padding-top:18px;font-size:14px!important;color:var(--vsx-mute)!important}

/* chart status chips */
.vsx-chip{display:inline-block;margin:0 6px 4px 0;padding:2px 9px;border-radius:99px;font-size:12px;font-weight:800;letter-spacing:.3px;vertical-align:1px;white-space:nowrap}
.vsx-chip.yes{background:rgba(255,255,255,.12);color:#fff}
.vsx-chip.diff{background:rgba(255,255,255,.07);color:var(--vsx-sub);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.vsx-chip.nd{background:transparent;color:var(--vsx-mute);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.vsx-chip.ours{background:rgba(244,160,176,.18);color:var(--vsx-accent)}
.vsx-chart tbody.grp th[colspan]{font-size:12px;letter-spacing:2.5px;text-transform:uppercase;color:var(--vsx-accent);padding-top:28px}
.vsx-legend{display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:center;max-width:860px;margin:24px auto 0;font-size:14px!important;color:var(--vsx-mute)!important}
.vsx-legend>span{white-space:nowrap}
@media (max-width:600px){.vsx-legend{display:grid;grid-template-columns:1fr;justify-items:start;gap:8px;max-width:340px}.vsx-legend>span{white-space:normal}}

/* digital by choice */
.vsx-digital{max-width:860px;margin:40px auto 0;border-radius:20px;padding:28px 30px;background:linear-gradient(160deg,rgba(244,160,176,.08),rgba(255,255,255,.02));border:1px solid rgba(244,160,176,.25)}
.vsx-digital h3{margin-bottom:10px!important}
.vsx-digital p+p{margin-top:12px}

/* safety: short, warm */
.vsx-safe{max-width:760px;margin:0 auto;text-align:center}
.vsx-safe p+p{margin-top:14px}
.vsx-safe a{color:var(--vsx-accent)}

@media (max-width:900px){
  .vsx-mem{grid-template-columns:1fr;gap:48px}
  .vsx-flow{grid-template-columns:1fr;gap:22px;max-width:520px}
  .vsx-flow::before{left:23px;right:auto;top:10px;bottom:10px;width:1px;height:auto;background:linear-gradient(rgba(244,160,176,0),rgba(244,160,176,.6),rgba(244,160,176,0))}
  .vsx-flow li{display:grid;grid-template-columns:46px minmax(0,1fr);column-gap:18px;text-align:left;padding:0}
  .vsx-flow .dot{grid-row:1 / span 2;margin:0}
  .vsx-flow span{margin-top:2px}
  .vsx-prices{grid-template-columns:1fr}
}
@media (max-width:600px){
  .vsx-story .vsx-hero{padding:64px 16px 64px}
  .vsx-story .vsx-sec{padding:72px 16px}
  .vsx-digital{padding:22px 20px}
  .hiw-step{grid-template-columns:112px minmax(0,1fr);gap:16px}
}
@media (prefers-reduced-motion:reduce){
  html.vsx-motion *{animation:none!important;transition:none!important}
}

/* the competitor-specific argument */
#the-argument .vsx-compare{margin-top:40px}
.vsx-real{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:14px 0 6px}
.vsx-real img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;box-shadow:0 0 0 1px rgba(244,160,176,.35)}
.vsx-sample{text-align:center;font-size:15px!important;font-weight:700;color:var(--vsx-ink)!important;margin-top:18px!important}

/* the hero screenshot's photo is a sample: say so, visibly (large on the real-vs-AI page) */
.vsx-hero-sample{display:inline-block;margin-left:6px;padding:2px 10px;border-radius:99px;background:rgba(255,255,255,.1);color:var(--vsx-ink);font-size:13px;font-weight:700;letter-spacing:.2px}
.vsx-hero-sample.lg{font-size:16px;padding:4px 14px;background:rgba(244,160,176,.18);box-shadow:inset 0 0 0 1px rgba(244,160,176,.45)}