/* Qarhami · Phoenix (PHX lockbox rule) landing page — layered on site.css / v22–v25 */

/* ---------- hero ---------- */
.px-hero{padding:clamp(36px,5vw,72px) 0 clamp(48px,6vw,88px);overflow:hidden;background:#fff}
.px-hero__glow{position:absolute;inset:0;pointer-events:none;z-index:0}
.px-hero__glow::before{content:"";position:absolute;right:-12%;top:-28%;width:78%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(89,51,229,.13),rgba(89,51,229,0) 62%)}
.px-hero__glow::after{content:"";position:absolute;left:-14%;bottom:-40%;width:60%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(13,188,147,.10),rgba(13,188,147,0) 60%)}
.px-hero__in{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,54fr) minmax(0,46fr);gap:clamp(28px,4vw,64px);align-items:center}
.px-hero__copy{max-width:680px}
.px-hero .h-display{font-size:clamp(40px,5.2vw,78px);margin:0 0 22px}
.px-hero .h-display .lbl{margin-bottom:18px}
.px-hero .lede{margin-bottom:32px}
.px-chip{display:inline-flex;align-items:center;gap:10px;margin:0 0 22px;padding:8px 14px 8px 10px;border-radius:999px;background:var(--cr-50);border:1px solid rgba(255,87,90,.45);color:var(--cr-700);font-family:var(--arch);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.px-chip__dot{width:9px;height:9px;border-radius:50%;background:var(--cr);box-shadow:0 0 0 0 rgba(255,87,90,.6);animation:pxPulse 2s ease-out infinite}
@keyframes pxPulse{0%{box-shadow:0 0 0 0 rgba(255,87,90,.6)}100%{box-shadow:0 0 0 12px rgba(255,87,90,0)}}

.px-hero__stage{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;align-items:center;padding-right:28px}
.px-count{background:var(--deep);border:1px solid var(--deep);border-radius:24px;padding:24px 22px;color:#fff;box-shadow:var(--sh-win)}
.px-count__lbl{font-family:var(--arch);font-weight:700;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--mt);margin:0 0 14px}
.px-count__row{display:flex;gap:10px}
.px-count__row>div{flex:1;min-width:0;text-align:center;background:rgba(11,6,38,.55);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:14px 4px 10px}
.px-count__row b{display:block;font-family:var(--nexa);font-weight:900;font-size:clamp(34px,3.4vw,48px);line-height:1;color:#fff;font-variant-numeric:tabular-nums}
.px-count__row span{display:block;margin-top:6px;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.px-count__sub{margin:14px 0 0;font-size:13.5px;color:rgba(255,255,255,.75)}
.px-count.is-past .px-count__row{display:none}
.px-count.is-past .px-count__lbl{color:var(--cr)}

.px-hero__phone{position:relative;max-width:300px;margin:0 auto;width:100%}
.px-guest{display:block;width:100%;height:auto;filter:drop-shadow(0 30px 60px rgba(37,21,96,.28))}
.px-count__guest{margin:14px 0 0;padding-top:14px;border-top:1px solid rgba(255,255,255,.12);font-size:13.5px;line-height:1.5;color:rgba(255,255,255,.72)}
.px-count__guest b{color:#fff;font-weight:600}
.px-pop{position:absolute;z-index:4;width:min(78%,250px)}
.px-pop img{display:block;width:100%;height:auto}
.px-pop--lock{left:-12%;top:68%;width:min(74%,250px)}
.px-pop--entry{right:-12%;top:8%;width:min(62%,200px)}
.px-pop{animation:pxFloat 6s ease-in-out infinite}
.px-pop--entry{animation-delay:-3s}
@keyframes pxFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media (prefers-reduced-motion:reduce){.px-pop{animation:none}.px-chip__dot{animation:none}}

.px-strip{background:var(--paper)}

/* ---------- the rule ---------- */
.px-rule{display:grid;gap:clamp(22px,3vw,34px)}
.px-quote{margin:0;background:#fff;border:1px solid var(--hair);border-left:6px solid var(--in);border-radius:22px;padding:clamp(22px,3vw,36px) clamp(22px,3.4vw,40px);box-shadow:var(--sh-card)}
.px-quote p{font-size:clamp(16px,1.25vw,18.5px);line-height:1.65;color:var(--gun);margin:0 0 14px}
.px-quote p:last-of-type{margin-bottom:0}
.px-quote footer{margin-top:18px;font-size:13.5px;color:var(--legal)}
.px-quote footer a{color:var(--in);font-weight:500}
.px-rule__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.px-rc{background:#fff;border:1px solid var(--hair-2);border-radius:20px;padding:22px 24px;box-shadow:0 1px 2px rgba(37,21,96,.04);border-top:4px solid var(--grey)}
.px-rc--no{border-top-color:var(--cr)}.px-rc--ok{border-top-color:var(--or)}.px-rc--go{border-top-color:var(--mt)}
.px-rc__k{font-family:var(--arch);font-weight:700;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);margin:0 0 8px}
.px-rc--no .px-rc__k{color:var(--cr-700)}.px-rc--ok .px-rc__k{color:var(--or-700)}.px-rc--go .px-rc__k{color:var(--mt-700)}
.px-rc h3{font-family:var(--nexa);font-weight:900;font-size:19px;color:var(--ink);margin:0 0 8px}
.px-rc p:last-child{margin:0;font-size:14.5px;color:var(--muted);line-height:1.55}
.px-rule__note{margin:0;font-size:13px;color:var(--legal);max-width:860px}

/* ---------- two paths ---------- */
.px-paths{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.px-path{position:relative;background:#fff;border:1px solid var(--hair-2);border-radius:26px;padding:clamp(24px,3vw,36px);box-shadow:var(--sh-card);display:flex;flex-direction:column;gap:18px}
.px-path--a{background:linear-gradient(180deg,#fff,var(--paper))}
.px-path--b{background:linear-gradient(180deg,#fff,var(--or-50))}
.px-path__n{display:inline-block;font-family:var(--arch);font-weight:700;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:#fff;background:var(--in);border-radius:999px;padding:6px 12px;margin-bottom:12px}
.px-path--b .px-path__n{background:var(--or-700)}
.px-path h3{font-family:var(--nexa);font-weight:900;font-size:clamp(22px,2vw,28px);line-height:1.12;color:var(--ink);margin:0}
.px-path__lede{margin:0;font-size:16px;color:var(--muted);line-height:1.6}
.px-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.px-list li{display:flex;gap:12px;align-items:flex-start;font-size:15px;line-height:1.5;color:var(--muted)}
.px-list li b{color:var(--ink);font-weight:600}
.px-list svg{flex:none;width:24px;height:24px;color:var(--in);margin-top:2px}
.px-path--b .px-list svg{color:var(--or-700)}
.px-path__art{margin-top:auto;display:grid;gap:10px;padding-top:8px}
.px-path__art{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.px-path__art .pop{width:100%}.px-path__art .pop--toast{margin-top:14px}
.px-path__art--card{grid-template-columns:minmax(0,1fr)}.px-path__art--card img{display:block;width:100%;max-width:460px;height:auto;border-radius:18px;border:1px solid var(--hair);box-shadow:var(--sh-card);background:#fff}
.px-fine{margin:0;font-size:12.5px;color:var(--legal)}

/* ---------- the deal ---------- */
.px-deal__grid{display:grid;grid-template-columns:minmax(0,56fr) minmax(0,44fr);gap:clamp(28px,5vw,72px);align-items:center}
.px-deal .lede{margin-top:18px}
.px-incl{list-style:none;margin:28px 0 30px;padding:0;display:grid;gap:12px}
.px-incl li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;line-height:1.5;color:rgba(255,255,255,.78)}
.px-incl li b{color:#fff;font-weight:600}
.px-incl svg{flex:none;width:20px;height:20px;color:var(--mt);margin-top:3px}
.px-price{position:relative;background:#fff;color:var(--gun);border-radius:28px;padding:clamp(24px,3vw,34px);box-shadow:0 40px 90px rgba(11,6,38,.45),0 0 0 1px rgba(255,255,255,.08);overflow:hidden}
.px-price::before{content:"";position:absolute;inset:0 0 auto;height:6px;background:linear-gradient(90deg,var(--in),var(--mt))}
.px-price__k{font-family:var(--arch);font-weight:700;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--grey);margin:0 0 10px}
.px-price__two{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:end}
.px-price__two>div:last-child{border-left:1px solid var(--hair);padding-left:16px}
.px-price__lbl{margin:6px 0 0;font-size:13px;line-height:1.35;color:var(--muted)}
.px-price__star{color:var(--grey);font-size:13px}
.px-price__n{font-family:var(--nexa);font-weight:900;font-size:clamp(52px,4.4vw,72px);line-height:1;color:var(--ink);margin:0;letter-spacing:-.02em}
.px-price__n--b{color:var(--in-700)}
.px-price__n sup{font-size:.42em;vertical-align:top;margin-top:.3em;display:inline-block;color:var(--in)}
.px-price__then{margin:8px 0 18px;font-size:16px;color:var(--muted)}
.px-price__then b{color:var(--ink);font-weight:600}
.px-price__devwrap{border-radius:18px;background:radial-gradient(80% 70% at 50% 60%,#fff,var(--in-50));padding:12px 18px}
.px-price__dev{display:block;width:100%;height:auto;filter:drop-shadow(0 18px 30px rgba(37,21,96,.28))}
.px-price__list{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:8px;font-size:14.5px;color:var(--gun)}
.px-price__list li{display:flex;gap:10px;align-items:center}
.px-price__list li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--mt);flex:none}
.px-price__fleet{margin:18px 0 0;padding:14px 16px;border-radius:14px;background:var(--in-50);font-size:13.5px;color:var(--in-800);line-height:1.5}
.px-price__fleet b{color:var(--in-800)}

/* ---------- app window (3 features) ---------- */
.osx__grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}

/* ---------- install ---------- */
.px-install{display:grid;grid-template-columns:minmax(0,58fr) minmax(0,42fr);gap:clamp(28px,5vw,72px);align-items:start}
.px-install .lede{margin-top:18px}
.px-steps{margin:28px 0 0;padding:0 0 0 0;list-style:none;counter-reset:px;display:grid;gap:14px}
.px-steps li{counter-increment:px;position:relative;padding-left:52px;font-size:15.5px;line-height:1.55;color:var(--muted)}
.px-steps li b{color:var(--ink);font-weight:600}
.px-steps li::before{content:counter(px,decimal-leading-zero);position:absolute;left:0;top:0;width:38px;height:38px;border-radius:12px;background:var(--in-50);color:var(--in-700);font-family:var(--arch);font-weight:700;font-size:13px;display:grid;place-items:center}
.px-meet{background:var(--deep);color:#fff;border-radius:26px;padding:clamp(24px,3vw,34px);box-shadow:var(--sh-win);position:sticky;top:calc(var(--hdr) + 24px)}
.px-meet__k{font-family:var(--arch);font-weight:700;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--mt);margin:0 0 12px}
.px-meet h3{font-family:var(--nexa);font-weight:900;font-size:clamp(22px,2vw,27px);line-height:1.15;margin:0 0 12px;color:#fff}
.px-meet p{margin:0 0 14px;font-size:15px;line-height:1.55;color:rgba(255,255,255,.78)}
.px-meet__where{display:flex;align-items:center;gap:8px;color:#fff;font-weight:500}
.px-meet__where svg{width:18px;height:18px;color:var(--mt)}
.px-meet .btn{margin-top:6px}

/* ---------- sign-up ---------- */
.px-signup .sec-head{margin-bottom:clamp(28px,4vw,44px)}
.px-form{background:#fff;color:var(--gun);border-radius:28px;padding:clamp(22px,3vw,36px);box-shadow:0 40px 90px rgba(0,0,0,.45);display:grid;gap:18px}
.px-form__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.px-f{display:grid;gap:7px;font-size:14px;color:var(--ink);font-weight:500}
.px-f>span em{font-style:normal;font-weight:400;color:var(--grey)}
.px-f input:not([type=radio]):not([type=checkbox]),.px-f select,.px-f textarea{width:100%;height:50px;padding:0 14px;border:1px solid var(--hair);border-radius:12px;font:inherit;font-weight:400;font-size:15.5px;color:var(--ink);background:#fff;transition:border-color .2s,box-shadow .2s}
.px-f textarea{height:auto;padding:12px 14px;resize:vertical;line-height:1.5}
.px-f select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238A8FA3' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:38px}
.px-f input:focus,.px-f select:focus,.px-f textarea:focus{outline:0;border-color:var(--in);box-shadow:0 0 0 3px rgba(89,51,229,.16)}
.px-f.is-bad input,.px-f.is-bad select{border-color:var(--cr);box-shadow:0 0 0 3px rgba(255,87,90,.14)}
.px-f--radios{border:0;margin:0;padding:0;min-width:0}
.px-f--radios legend{font-weight:500;margin-bottom:10px;padding:0}
.px-f--radios label{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1px solid var(--hair);border-radius:12px;font-weight:400;font-size:14.5px;color:var(--muted);cursor:pointer;margin-bottom:8px;transition:border-color .2s,background .2s}
.px-f--radios label:has(input:checked){border-color:var(--in);background:var(--in-50)}
.px-f--radios label b{color:var(--ink);font-weight:600;margin-right:4px}
.px-f--radios input,.px-f--check input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--in);flex:none}
.px-f--check{display:flex;gap:12px;align-items:flex-start;font-weight:400;color:var(--muted);font-size:14.5px}
.px-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.px-form__foot{display:flex;flex-wrap:wrap;gap:18px;align-items:center;margin-top:4px}
.px-form__legal{margin:0;font-size:12.5px;color:var(--legal);max-width:420px;line-height:1.5}
.px-form__legal a{color:var(--in)}
.px-form__msg{margin:0;font-size:14px;color:var(--cr-700);min-height:1em}
.px-form__msg:empty{display:none}
.px-form.is-busy #pxSubmit{opacity:.6;pointer-events:none}
.px-done{text-align:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:28px;padding:clamp(28px,4vw,48px)}
.px-done svg{width:52px;height:52px;color:var(--mt);margin:0 auto 14px;display:block}
.px-done h3{font-family:var(--nexa);font-weight:900;font-size:clamp(26px,3vw,36px);margin:0 0 12px;color:#fff}
.px-done p{color:rgba(255,255,255,.8);max-width:560px;margin:0 auto 22px;line-height:1.6}
.px-done p a{color:var(--mt);font-weight:600}
.px-done .btn-row{justify-content:center}
.px-alt{margin:22px 0 0;text-align:center;font-size:14px;color:rgba(255,255,255,.7)}
.px-alt a{color:var(--mt);font-weight:500}

/* ---------- responsive ---------- */
@media (max-width:1040px){
  .px-hero__in{grid-template-columns:minmax(0,1fr)}
  .px-hero__stage{max-width:720px}
}
@media (max-width:900px){
  .px-rule__cols{grid-template-columns:minmax(0,1fr)}
  .px-paths{grid-template-columns:minmax(0,1fr)}
  .px-deal__grid{grid-template-columns:minmax(0,1fr)}
  .px-deal__card{max-width:520px}
  .px-install{grid-template-columns:minmax(0,1fr)}
  .px-meet{position:static;max-width:560px}
  .osx__grid--3{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  .px-hero{padding-top:28px}
  .px-hero__stage{grid-template-columns:minmax(0,1fr);gap:28px}
  .px-hero__phone{max-width:240px}
  .px-pop--lock{left:-18%;width:70%}
  .px-pop--entry{right:-14%;width:62%}
  .px-form__grid{grid-template-columns:minmax(0,1fr)}
  .px-path__art{grid-template-columns:minmax(0,1fr)}
  .px-path__art .pop--toast{margin-top:0}
  .px-form{border-radius:22px}
  .px-quote{border-radius:18px}
}

/* ---------- founder ---------- */
.px-founder__grid{display:grid;grid-template-columns:minmax(0,44fr) minmax(0,56fr);gap:clamp(28px,5vw,72px);align-items:center}
.px-founder__art{margin:0;position:relative;max-width:520px}
.px-founder__art img{display:block;width:100%;height:auto;border-radius:28px;box-shadow:var(--sh-win)}
.px-founder__art figcaption{position:absolute;left:18px;bottom:18px;background:#fff;border-radius:16px;padding:12px 18px;box-shadow:0 14px 30px rgba(37,21,96,.18);display:grid;gap:2px}
.px-founder__art figcaption b{font-family:var(--nexa);font-weight:900;font-size:17px;color:var(--ink)}
.px-founder__art figcaption span{font-size:13px;color:var(--muted)}
.px-founder__q{margin:24px 0 28px;padding-left:22px;border-left:4px solid var(--in)}
.px-founder__q p{font-size:clamp(17px,1.35vw,20px);line-height:1.6;color:var(--gun);margin:0 0 14px}
.px-founder__q p:last-child{margin-bottom:0}
@media (max-width:900px){.px-founder__grid{grid-template-columns:minmax(0,1fr)}.px-founder__art{max-width:460px}}

/* ---------- phoenix in november ---------- */
.px-timeline{list-style:none;margin:0 0 clamp(28px,4vw,44px);padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.px-timeline li{position:relative;background:#fff;border:1px solid var(--hair-2);border-radius:20px;padding:22px 22px 22px;box-shadow:0 1px 2px rgba(37,21,96,.04)}
.px-timeline li::before{content:"";position:absolute;left:22px;top:0;width:44px;height:4px;border-radius:0 0 4px 4px;background:var(--in)}
.px-timeline li:nth-child(3)::before{background:var(--cr)}
.px-timeline b{display:block;font-family:var(--nexa);font-weight:900;font-size:20px;color:var(--ink);margin:6px 0 8px}
.px-timeline span{font-size:14.5px;line-height:1.55;color:var(--muted)}
.px-nov__grid{display:grid;grid-template-columns:minmax(0,38fr) minmax(0,62fr);gap:22px;align-items:start}
.px-mini{background:#fff;border:1px solid var(--hair-2);border-radius:26px;padding:clamp(22px,3vw,32px);box-shadow:var(--sh-card);display:grid;gap:14px}
.px-mini--inst{background:linear-gradient(180deg,#fff,var(--paper))}
.px-mini__k{display:flex;align-items:center;gap:8px;margin:0;font-family:var(--arch);font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--in)}
.px-mini__k svg{width:18px;height:18px}
.px-mini h3{font-family:var(--nexa);font-weight:900;font-size:clamp(22px,2vw,26px);line-height:1.15;color:var(--ink);margin:0}
.px-mini>p{margin:0;font-size:15px;color:var(--muted);line-height:1.55}
.px-mini__row{display:grid;grid-template-columns:minmax(0,1fr) max-content;gap:10px;min-width:0}
.px-mini__row input{width:100%;min-width:0;height:52px;padding:0 14px;border:1px solid var(--hair);border-radius:12px;font:inherit;font-size:15.5px}
.px-mini__row input:focus{outline:0;border-color:var(--in);box-shadow:0 0 0 3px rgba(89,51,229,.16)}
.px-mini__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.px-mini__foot{display:flex;flex-wrap:wrap;gap:16px;align-items:center;font-size:14px;color:var(--muted)}
.px-mini__foot a{color:var(--in);font-weight:500}
.px-mini__msg{margin:0;font-size:14px;color:var(--cr-700)}
.px-mini__msg:empty{display:none}
.px-mini__done[hidden]{display:none}
.px-mini__done{display:flex;gap:10px;align-items:center;margin:0;padding:14px 16px;border-radius:14px;background:var(--mt-50);color:var(--mt-800);font-weight:500;font-size:15px}
.px-mini__done svg{width:22px;height:22px;flex:none}
.px-mini.is-busy button{opacity:.6;pointer-events:none}
.px-mini.is-bad input:invalid,.px-mini.is-bad select:invalid{border-color:var(--cr)}
@media (max-width:1040px){.px-timeline{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.px-nov__grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){.px-timeline{grid-template-columns:minmax(0,1fr)}.px-mini__grid{grid-template-columns:minmax(0,1fr)}.px-mini__row{grid-template-columns:minmax(0,1fr)}}

/* ---------- the revolving device on each path ---------- */
.px-turn{display:grid;gap:12px;margin:-6px 0 4px}
.px-turn__stage{position:relative;height:200px;border-radius:20px;background:radial-gradient(70% 80% at 50% 70%,#fff,var(--paper));overflow:hidden}
.px-path--b .px-turn__stage{background:radial-gradient(70% 80% at 50% 70%,#fff,var(--or-50))}
.px-turn__img{position:absolute;left:50%;top:50%;width:min(86%,360px);height:auto;transform:translate(-50%,-50%);filter:drop-shadow(0 18px 26px rgba(37,21,96,.22))}
.px-hw{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.px-hw li{font-family:var(--arch);font-weight:700;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;padding:7px 12px;border-radius:999px;background:var(--in-50);color:var(--in-700)}
.px-hw li.is-core{background:var(--in);color:#fff}
.px-hw li.is-off{background:#fff;border:1px dashed var(--hair);color:var(--grey);text-decoration:line-through;text-decoration-color:var(--grey)}
.px-path--b .px-hw li:not(.is-core):not(.is-off){background:var(--or-50);color:var(--or-700)}
@media (max-width:640px){.px-turn__stage{height:170px}}
.px-turn--price{margin:0}
.px-turn--price .px-turn__stage{height:230px;background:radial-gradient(70% 80% at 50% 70%,#fff,var(--in-50))}
.px-turn--price .px-turn__img{width:min(90%,420px)}

/* ---------- 1.0.1: hero fine print, how remote access works, single-price card ---------- */
.px-hero .ticks{margin-bottom:0}
.px-hero__fine{margin:16px 0 0;font-size:13px;line-height:1.5;color:var(--grey);max-width:560px}
.px-how{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;counter-reset:pxh}
.px-how__s{counter-increment:pxh;position:relative;background:#fff;border:1px solid var(--hair-2);border-radius:22px;padding:18px 18px 22px;box-shadow:var(--sh-card);display:flex;flex-direction:column}
.px-how__s::before{content:counter(pxh);position:absolute;top:14px;left:14px;z-index:2;width:30px;height:30px;border-radius:10px;background:var(--in);color:#fff;font-family:var(--arch);font-weight:700;font-size:14px;display:grid;place-items:center;box-shadow:0 6px 14px rgba(89,51,229,.32)}
.px-how__s:not(:last-child)::after{content:"";position:absolute;top:96px;right:-14px;width:10px;height:10px;border-top:2px solid var(--in);border-right:2px solid var(--in);transform:rotate(45deg);z-index:2;opacity:.55}
.px-how__art{height:176px;border-radius:16px;background:radial-gradient(80% 80% at 50% 55%,#fff,var(--in-50));display:grid;place-items:center;overflow:hidden;margin-bottom:16px;padding:14px}
.px-how__art img{display:block;max-width:100%;height:auto}
.px-how__art--dev img{width:88%;filter:drop-shadow(0 14px 22px rgba(37,21,96,.25))}
.px-how__art--phone{padding:14px 0 0;align-items:start}
.px-how__art--phone img{width:132px;border-radius:18px 18px 0 0;box-shadow:0 18px 40px rgba(37,21,96,.22)}
.px-how__pop{width:100%;border-radius:14px;box-shadow:0 14px 30px rgba(37,21,96,.16)}
.px-how__n{font-family:var(--arch);font-weight:700;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--in-700);margin:0 0 8px}
.px-how__s h3{font-family:var(--nexa);font-weight:900;font-size:19px;line-height:1.2;color:var(--ink);margin:0 0 8px}
.px-how__s p:last-child{margin:0;font-size:14.5px;line-height:1.55;color:var(--muted)}
.px-how__qs{margin-top:22px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;background:var(--deep);border-radius:22px;padding:clamp(20px,2.6vw,30px);color:#fff}
.px-how__qs h4{margin:0 0 6px;font-family:var(--nexa);font-weight:900;font-size:17px;color:#fff}
.px-how__qs p{margin:0;font-size:14.5px;line-height:1.55;color:rgba(255,255,255,.76)}
.px-how__qs>div{padding-left:16px;border-left:2px solid var(--mt)}
.px-price__one{display:flex;align-items:flex-end;gap:18px}
.px-price__one .px-price__n{font-size:clamp(64px,5.6vw,92px)}
.px-price__one .px-price__lbl{font-size:14.5px;margin:0 0 10px;color:var(--gun)}
.px-price__was{margin:12px 0 0;font-size:14px;color:var(--muted)}
.px-price__was s{color:var(--cr-700)}
@media (max-width:1040px){.px-how{grid-template-columns:repeat(2,minmax(0,1fr))}.px-how__s::after{display:none}}
@media (max-width:640px){.px-how,.px-how__qs{grid-template-columns:minmax(0,1fr)}.px-how__art{height:160px}}