.px-page { --px-navy: #003366; --px-ink: #1f3650; --px-mute: #5d7086; --px-pen: #1f5fa8; --px-aqua: #3fb6e8; --px-sky: #8fe0ff;
    --px-paper: #f3f6f9; --px-g: clamp(16px, 4vw, 4rem); --px-max: 1280px;
    --px-pad: max(var(--px-g), calc((100% - var(--px-max)) / 2));
    --px-padw: max(var(--px-g), calc((100% - 1520px) / 2)); }
.px-page main { font-family: Montserrat, sans-serif; color: var(--px-ink); overflow: hidden; }
.px-skip { position: absolute; left: 12px; top: -60px; z-index: 10000; padding: .6rem 1rem; border-radius: 10px; background: #003366; color: #fff; font: 600 .85rem Montserrat, sans-serif; text-decoration: none; }
.px-skip:focus { top: 12px; }

.px-hero { height: auto; min-height: clamp(340px, 56vh, 520px); display: flex; align-items: flex-end;
    padding: clamp(104px, 15vh, 158px) max(1rem, calc((100% - 1320px) / 2)) calc(clamp(44px, 4.6vw, 84px) + clamp(8px, 2vh, 22px)); }
.px-hero .hw-in { position: relative; left: auto; top: auto; transform: none; width: auto; max-width: 900px;
    display: grid; grid-template-columns: auto auto; justify-content: start; align-items: center; column-gap: clamp(1.4rem, 3vw, 2.6rem); }
.px-hero .hw-in > :not(.px-hstats):not(.hw-cta) { grid-column: 1 / -1; }
.px-hero .hw-kick { margin: 0 0 .6rem; font-size: clamp(.7rem, 1.1vw, .82rem); font-weight: 700; letter-spacing: .18em; }
.px-hero .hw-title { margin: 0 0 .5rem; font-size: clamp(2.4rem, 6vw, 4.1rem); line-height: 1.04; letter-spacing: -.02em; }
.px-hero .hw-title span, .px-hero .hw-title b { display: inline; }
.px-hero .hw-lead { margin: 0 0 1.4rem; max-width: 46ch; font-size: clamp(.96rem, 1.5vw, 1.16rem); line-height: 1.5; color: rgba(255, 255, 255, .92); }
.px-hero .hw-cta { margin-top: 0; }
.px-hero .hw-sw { top: auto; bottom: calc(clamp(44px, 4.6vw, 84px) + 26px); margin-top: 0; }
@media (min-width: 1025px) { .px-hero { padding-top: max(calc(15 * var(--vhz, 1vh)), 172px); } }
.px-hstats { display: flex; margin: 0; padding: 0; list-style: none; animation: hwIn 1.1s cubic-bezier(.3, .8, .3, 1) .4s both; }
.px-hstats li { padding: 0 clamp(.9rem, 2vw, 1.6rem); border-left: 1px solid rgba(255, 255, 255, .28); }
.px-hstats li:first-child { padding-left: 0; border-left: 0; }
.px-hstats b { display: block; font: 700 clamp(1.45rem, 2.8vw, 2rem)/1 Montserrat, sans-serif; letter-spacing: -.02em; color: #fff; text-shadow: 0 2px 14px rgba(0, 20, 40, .5); }
.px-hstats span { display: block; margin-top: .35rem; font: 600 .66rem Montserrat, sans-serif; letter-spacing: .15em; text-transform: uppercase; color: #cfe3f3; }
@media (max-width: 900px) { .px-hero .hw-in { grid-template-columns: minmax(0, 1fr); row-gap: 1.2rem; } }
@media (max-width: 760px) {
    .px-hero { display: flex; min-height: 0; padding: clamp(88px, 12vh, 122px) 20px calc(clamp(44px, 4.6vw, 84px) + 6px); }
    .px-hero .hw-sw { position: absolute; top: calc(var(--ph-bar-h, 68px) + 14px); right: 16px; bottom: auto; margin: 0; flex-direction: row; }
}
.px-k { display: flex; align-items: center; flex-wrap: wrap; gap: .7rem; margin: 0; font: 700 .7rem Montserrat, sans-serif; letter-spacing: .2em; text-transform: uppercase; color: #2f5f9e; }
.px-k::before { content: ''; width: 26px; height: 2px; border-radius: 2px; background: #668ECB; }
.px-k-light { color: var(--px-sky); }
.px-k-light::before { background: var(--px-aqua); }
.px-h2 { margin: .75rem 0 0; font: 300 clamp(2rem, 3.4vw, 3.5rem)/1.06 Montserrat, sans-serif; letter-spacing: -.03em; color: var(--px-navy); }
.px-h2 b { font-weight: 700; }
.px-h3 { margin: 1.8rem 0 .6rem; font: 700 1.2rem Montserrat, sans-serif; color: var(--px-navy); }
.px-sub { margin: .9rem 0 0; max-width: 46rem; font: 400 clamp(.95rem, 1.1vw, 1.08rem)/1.65 Montserrat, sans-serif; color: #4a5d70; }
.px-p { margin: 0; font: 400 clamp(.95rem, 1.05vw, 1.04rem)/1.78 Montserrat, sans-serif; color: #34495e; }
.px-p strong, .px-lede strong { color: var(--px-navy); font-weight: 700; }
.px-lede { margin: 1.6rem 0 .8rem; font: 300 clamp(1.15rem, 1.5vw, 1.45rem)/1.4 Montserrat, sans-serif; color: var(--px-navy); }

.px-btn { display: inline-flex; align-items: center; gap: .6rem; padding: .95rem 1.6rem; border-radius: 999px; font: 700 .92rem Montserrat, sans-serif; text-decoration: none; white-space: nowrap;
    transition: transform .3s cubic-bezier(.3, .8, .3, 1), background-color .3s, box-shadow .3s, color .3s; }
.px-btn svg { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .3s; }
.px-btn:hover { transform: translateY(-2px); }
.px-btn:hover svg:last-child { transform: translateX(3px); }
.px-btn:focus-visible { outline: 3px solid var(--px-aqua); outline-offset: 3px; }
.px-btn-navy { background: var(--px-navy); color: #fff; box-shadow: 0 14px 30px -12px rgba(0, 51, 102, .6); }
.px-btn-navy:hover { background: #0b4a8a; }
.px-btn-line { color: var(--px-navy); background: transparent; box-shadow: inset 0 0 0 1.5px rgba(0, 51, 102, .3); }
.px-btn-line:hover { box-shadow: inset 0 0 0 1.5px var(--px-navy); }

.px-sep { position: relative; z-index: 5; height: 64px; margin-top: -64px; margin-bottom: -4px; overflow: hidden; line-height: 0; pointer-events: none; }
.px-sep svg { position: absolute; left: 0; bottom: -4px; width: 100%; height: calc(100% + 4px); fill: var(--fill); display: block; }
@media (max-width: 768px) { .px-sep { height: 40px; margin-top: -40px; } }

.c-ba { position: relative; overflow: hidden; isolation: isolate; background: #0b2742; }
.ba-stage { position: absolute; inset: 0; cursor: ew-resize; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.ba-l { position: absolute; inset: 0; margin: 0; }
.ba-l img { width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; }
.ba-b { z-index: 2; clip-path: inset(0 50% 0 0); }
.ba-handle { position: absolute; z-index: 4; top: 0; bottom: 0; left: 50%; width: 0; }
.ba-handle::before { content: ''; position: absolute; top: 0; bottom: 0; left: -1px; width: 2px; background: rgba(255, 255, 255, .9); box-shadow: 0 0 12px rgba(0, 20, 40, .35); }
.ba-knob { position: absolute; left: 50%; top: 50%; width: 42px; height: 42px; margin: -21px 0 0 -21px; border-radius: 50%; color: #fff; display: grid; place-items: center;
    background: rgba(4, 25, 45, .3); box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .9); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); cursor: grab; transition: transform .25s, background-color .25s; }
.ba-knob svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ba-stage:hover .ba-knob { transform: scale(1.1); background: rgba(4, 25, 45, .45); }
.ba-handle:focus { outline: none; }
.ba-handle:focus-visible .ba-knob { box-shadow: inset 0 0 0 1.5px #fff, 0 0 0 3px var(--px-sky); }

.px-dry { display: grid; grid-template-columns: minmax(230px, .62fr) minmax(0, .8fr) minmax(0, 1.4222fr); gap: 16px; align-items: stretch;
    padding: clamp(3rem, 5.5vw, 5rem) var(--px-padw) calc(clamp(3rem, 5vw, 4.6rem) + 56px); background: #fff; }
.px-dry > * { min-width: 0; }
.px-dry-head { align-self: center; padding: 1rem clamp(1rem, 3vw, 2.6rem) 1rem 0; }
.px-ba { border-radius: 18px; }
.px-dry-head .px-h2 { font-size: clamp(1.8rem, 2.6vw, 2.7rem); }
.px-dry-head .px-p { margin-top: 1rem; color: var(--px-mute); }
.px-ba-tall { aspect-ratio: 3 / 4; }
.px-ba-wide { aspect-ratio: 4 / 3; }
.px-tag { position: absolute; z-index: 5; top: 14px; padding: .32rem .7rem; border-radius: 999px; font: 700 .62rem Montserrat, sans-serif; letter-spacing: .16em; text-transform: uppercase; color: #fff;
    background: rgba(4, 25, 45, .35); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .45); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); pointer-events: none; }
.px-tag-l { left: 14px; }
.px-tag-r { right: 14px; }
@media (max-width: 1150px) {
    .px-dry { grid-template-columns: minmax(0, .75fr) minmax(0, 1.3333fr); }
    .px-dry-head { grid-column: 1 / -1; padding: .5rem 0 1.4rem; }
}
@media (max-width: 640px) {
    .px-dry { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    .px-dry-head { padding: .5rem 0 1rem; }
    .px-ba { border-radius: 14px; }
}

.px-mat { position: relative; isolation: isolate; background: var(--px-paper); padding: clamp(3rem, calc(6 * var(--vhz, 1vh)), 4.6rem) var(--px-padw) calc(clamp(2.4rem, calc(5 * var(--vhz, 1vh)), 3.8rem) + 56px); }
.px-mat::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background-image: linear-gradient(rgba(0, 51, 102, .07) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 51, 102, .07) 1px, transparent 1px);
    background-size: 46px 46px; -webkit-mask-image: radial-gradient(80% 80% at 65% 40%, #000, transparent 90%); mask-image: radial-gradient(80% 80% at 65% 40%, #000, transparent 90%); }
.px-mat-in { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); grid-template-areas: "copy x" "copy aka" "assets assets"; gap: clamp(1.2rem, calc(2.4 * var(--vhz, 1vh)), 2rem) clamp(2.4rem, 5vw, 5rem); align-items: center; }
.px-mat-copy { grid-area: copy; max-width: 40rem; align-self: center; }
.px-mat-in > .px-x { grid-area: x; }
.px-mat-in > .px-aka { grid-area: aka; align-self: start; margin-top: 0; }
.px-mat-in > .px-assets { grid-area: assets; margin-top: 0; }
.px-mat .px-lede { margin: 1.1rem 0 .6rem; font-size: clamp(1.08rem, 1.3vw, 1.3rem); }
.px-mat .px-p { line-height: 1.7; }
.px-mat-in > * { min-width: 0; }

.px-x { position: relative; margin: 0; }
.px-x-stage { position: relative; height: clamp(250px, min(30vw, calc(36 * var(--vhz, 1vh))), 470px); perspective: 1400px; }
.px-x-stage::after { content: ''; position: absolute; left: 0; width: 58%; bottom: 6%; height: 16%; border-radius: 50%; z-index: -1;
    background: radial-gradient(closest-side, rgba(0, 30, 60, .22), rgba(0, 30, 60, 0)); filter: blur(6px); }
.px-x-lay { position: absolute; left: 2%; top: 31%; width: 50%; height: 40%; transform-style: preserve-3d; border-radius: 4px;
    transform: rotateX(58deg) rotateZ(-38deg) translateZ(calc(var(--i) * (10px + var(--px-sp, 54px) * var(--ex, 0))));
    box-shadow: 0 0 0 1px rgba(35, 56, 79, .35), 0 18px 30px -18px rgba(0, 30, 60, .35); }
.px-x-l1 { background: linear-gradient(135deg, rgba(190, 225, 245, .6), rgba(255, 255, 255, .25) 55%, rgba(190, 225, 245, .45)); box-shadow: 0 0 0 1px rgba(31, 95, 168, .45), inset 0 0 30px rgba(255, 255, 255, .5); }
.px-x-l2 { background: url("../images/membranes/mini/cgt-aquasense-granit-grey.webp") center / 150px; }
.px-x-l3 { background: repeating-linear-gradient(0deg, rgba(35, 56, 79, .6) 0 1.2px, transparent 1.2px 9px), repeating-linear-gradient(90deg, rgba(35, 56, 79, .6) 0 1.2px, transparent 1.2px 9px), rgba(255, 255, 255, .55); }
.px-x-l4 { background: linear-gradient(135deg, #5a6672, #39434d); }
.px-x-l5 { background: linear-gradient(135deg, rgba(150, 162, 175, .5), rgba(110, 122, 135, .32)); }
.px-x-weld { position: absolute; left: 0; right: 0; top: 48%; height: 3px; background: linear-gradient(90deg, transparent, #ffb36b, #fff3d6, #ffb36b, transparent); background-size: 200% 100%;
    box-shadow: 0 0 12px rgba(255, 160, 80, .9); animation: pxWeld 2.6s linear infinite; }
@keyframes pxWeld { from { background-position: 100% 0; } to { background-position: -100% 0; } }
.px-x-lbs { list-style: none; margin: 0; padding: 0; }
.px-x-lbs b { display: block; font: 700 .66rem/1.25 Montserrat, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #23384f; }
.px-x-lbs sup { font-size: .7em; }
.px-x-lbs small { display: block; margin-top: 2px; font: 500 .8rem/1.3 Montserrat, sans-serif; color: var(--px-mute); }
@media (min-width: 761px) {
    .px-x-lbs li { position: absolute; left: 60%; top: 0; white-space: nowrap; opacity: calc(var(--ex, 0) * 1.4 - .2); transition: opacity .2s; }
    .px-x-lbs li::before { content: ''; position: absolute; right: calc(100% + 7px); top: .45em; width: var(--lw, 20px); height: 1px; background: var(--px-pen); }
    .px-x-lbs li::after { content: ''; position: absolute; right: calc(100% + 4px + var(--lw, 20px)); top: calc(.45em - 2.5px); width: 6px; height: 6px; border-radius: 50%; background: var(--px-pen); }
}
.px-x-cap { margin: .6rem 0 0; font: 500 .85rem/1.5 Montserrat, sans-serif; color: var(--px-mute); }
.px-x-cap b { color: var(--px-navy); }
@media (max-width: 1100px) {
    .px-mat-in { grid-template-columns: minmax(0, 1fr); grid-template-areas: "copy" "x" "aka" "assets"; align-items: start; }
    .px-x { max-width: 760px; }
    .px-x-stage { height: clamp(300px, 46vw, 460px); }
}
@media (max-width: 760px) {
    .px-x-stage { height: 300px; --px-sp: 30px; }
    .px-x-lay { left: 14%; width: 66%; top: 30%; }
    .px-x-lbs { display: grid; gap: .55rem; counter-reset: l; margin-top: .4rem; }
    .px-x-lbs li { counter-increment: l; position: relative; padding-left: 2rem; }
    .px-x-lbs li::before { content: counter(l); position: absolute; left: 0; top: 0; width: 1.4rem; height: 1.4rem; border-radius: 50%; display: grid; place-items: center;
        font: 700 .7rem Montserrat, sans-serif; color: #fff; background: var(--px-pen); }
}

.px-aka { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1.6rem; align-items: center; margin-top: clamp(2.6rem, 4.5vw, 4rem); padding: 1.05rem 0;
    border-top: 1px solid rgba(0, 51, 102, .12); border-bottom: 1px solid rgba(0, 51, 102, .12); }
.px-aka-k { margin: 0; font: 700 .64rem Montserrat, sans-serif; letter-spacing: .2em; text-transform: uppercase; color: #2f5f9e; white-space: nowrap; }
.px-aka-run { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.px-aka-track { display: flex; width: max-content; animation: pxMarq 70s linear infinite; }
.px-aka-track span { display: flex; align-items: center; font: 500 .95rem Montserrat, sans-serif; color: #4a5d70; white-space: nowrap; }
.px-aka-track span::after { content: ''; width: 4px; height: 4px; margin: 0 1.3em; border-radius: 50%; background: #b9c9d9; }
.px-aka-run:hover .px-aka-track { animation-play-state: paused; }
@keyframes pxMarq { to { transform: translateX(-50%); } }
@media (max-width: 640px) { .px-aka { grid-template-columns: minmax(0, 1fr); gap: .6rem; } }

.px-assets { list-style: none; margin: 1.6rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 1100px) { .px-assets { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.px-assets li { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: .8rem; align-items: center; padding: .9rem 1.05rem; border-radius: 16px; background: #fff; border: 1px solid #e3eaf2; }
.px-ico { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: #e8f2fb; }
.px-ico svg { width: 19px; height: 19px; fill: none; stroke: var(--px-pen); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.px-assets h3 { margin: 0; font: 700 .95rem/1.3 Montserrat, sans-serif; color: var(--px-navy); }
.px-assets p { grid-column: 1 / -1; margin: .5rem 0 0; font: 400 .86rem/1.55 Montserrat, sans-serif; color: #4a5d70; }
@media (max-width: 520px) { .px-assets { grid-template-columns: minmax(0, 1fr); } }

.px-co { position: relative; background: #fff; padding: clamp(3rem, calc(6 * var(--vhz, 1vh)), 4.6rem) var(--px-padw) calc(clamp(2.4rem, calc(5 * var(--vhz, 1vh)), 3.8rem) + 56px); }
.px-co-in { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .9fr); grid-template-areas: "head side" "copy side"; gap: clamp(1.4rem, calc(3 * var(--vhz, 1vh)), 2.4rem) clamp(2.4rem, 4.5vw, 4.5rem); align-items: start; }
.px-co-in > * { min-width: 0; }
.px-co-head { grid-area: head; }
.px-co-head .px-h2 { font-size: clamp(1.9rem, 2.6vw, 2.9rem); }
.px-co-copy { grid-area: copy; column-count: 2; column-gap: clamp(1.6rem, 2.6vw, 2.8rem); }
.px-co-copy p { margin: 0 0 1rem; font: 400 clamp(.92rem, .98vw, 1rem)/1.68 Montserrat, sans-serif; color: #34495e; }
.px-co-copy strong { color: var(--px-navy); font-weight: 700; }
.px-co-copy .px-h3 { margin: 0 0 .5rem; break-after: avoid; }
.px-co-copy .px-btn { margin-top: .4rem; }
.px-co-side { grid-area: side; align-self: stretch; display: grid; grid-template-rows: auto minmax(0, 1fr); gap: 16px; }
.px-co-stats { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid #e3eaf2; border-bottom: 1px solid #e3eaf2; }
.px-co-stats li { padding: 1.05rem clamp(.6rem, 1.2vw, 1.1rem); border-left: 1px solid #e3eaf2; }
.px-co-stats li:first-child { border-left: 0; padding-left: 0; }
.px-co-stats b { display: block; font: 700 clamp(1.5rem, 2.2vw, 2.1rem)/1 Montserrat, sans-serif; letter-spacing: -.03em; color: var(--px-navy); white-space: nowrap; }
.px-co-stats li > span { display: block; margin-top: .45rem; font: 600 .62rem/1.4 Montserrat, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--px-mute); }
.px-co-photos { display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; gap: 8px; contain: size; }
.px-co-photos figure { margin: 0; overflow: hidden; border-radius: 14px; background: #e8eef4; }
.px-co-photos img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.1s cubic-bezier(.2, .8, .2, 1); }
.px-co-photos figure:hover img { transform: scale(1.04); }
@media (max-width: 1100px) {
    .px-co-in { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "side" "copy"; }
    .px-co-side { grid-template-rows: auto auto; }
    .px-co-photos { contain: none; grid-auto-rows: auto; max-width: 620px; }
    .px-co-photos figure { aspect-ratio: 1; }
}
@media (max-width: 760px) { .px-co-copy { column-count: 1; } }
@media (max-width: 560px) {
    .px-co-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .px-co-stats li:nth-child(3) { border-left: 0; padding-left: 0; }
    .px-co-stats li:nth-child(n+3) { border-top: 1px solid #e3eaf2; }
}

@media (min-width: 1101px) and (max-height: 800px) {
    .px-mat, .px-co { padding-top: 2.2rem; padding-bottom: calc(1.6rem + 56px); }
    .px-mat .px-lede { margin: .8rem 0 .4rem; }
    .px-mat .px-p, .px-co-copy p { font-size: .88rem; line-height: 1.58; }
    .px-assets li { padding: .7rem .9rem; }
    .px-assets p { font-size: .8rem; }
}
.px-pose { position: relative; color: #fff; padding: clamp(4rem, 7vw, 7rem) var(--px-padw);
    background: radial-gradient(90% 70% at 15% 40%, rgba(102, 142, 203, .2), transparent 62%), linear-gradient(180deg, #00457c 0%, #002f5c 45%, #001b33 100%); }
.px-pose-in { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(2.5rem, 7vw, 7rem); align-items: center; }
.px-pose .px-h2 { color: #fff; }
.px-pose .px-h2 b { background: linear-gradient(95deg, #fff 0%, #bfefff 55%, var(--px-aqua) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.px-pose .px-sub { color: rgba(214, 238, 251, .85); margin-bottom: 1.8rem; }
.pv-phone { position: relative; width: clamp(260px, 26vw, 380px); margin: 0; }
.pv-phone-screen { position: relative; aspect-ratio: 9 / 16; border-radius: 42px; overflow: hidden; background: #000; border: 10px solid #0a1a2c;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .12), 0 40px 80px rgba(0, 5, 15, .55), 0 0 120px rgba(102, 142, 203, .25); }
.pv-phone-video { width: 100%; height: 100%; object-fit: cover; display: block; }
.pv-phone-toggle { position: absolute; right: 12px; bottom: 12px; width: 40px; height: 40px; display: grid; place-items: center; border: 0; border-radius: 50%;
    background: rgba(0, 15, 30, .55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: #fff; cursor: pointer; }
.pv-phone-toggle svg { width: 16px; height: 16px; fill: currentColor; }
.pv-phone-toggle .i-play { display: none; margin-left: 2px; }
.pv-phone.is-paused .pv-phone-toggle .i-play { display: block; }
.pv-phone.is-paused .pv-phone-toggle .i-pause { display: none; }
.pv-phone-note { margin: 1.1rem 0 0; text-align: center; font: 600 1.5rem/1.1 Caveat, cursive; color: var(--px-sky); transform: rotate(-3deg); }
.pv-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.pv-step { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1.2rem; width: 100%; padding: 1.15rem 1.3rem 1.3rem; border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 18px; background: rgba(255, 255, 255, .03); color: #fff; text-align: left; font: inherit; cursor: pointer; overflow: hidden; transition: background-color .4s, border-color .4s; }
.pv-step:hover { background: rgba(255, 255, 255, .07); }
.pv-step:focus-visible { outline: 2px solid var(--px-sky); outline-offset: 2px; }
.pv-step.is-current { background: rgba(255, 255, 255, .1); border-color: rgba(159, 196, 242, .45); }
.pv-step-num { font: 700 1.05rem Montserrat, sans-serif; color: rgba(255, 255, 255, .4); font-variant-numeric: tabular-nums; padding-top: .1rem; transition: color .4s; }
.pv-step.is-current .pv-step-num { color: var(--px-sky); }
.pv-step-body strong { display: block; margin-bottom: .2rem; font: 600 1.08rem Montserrat, sans-serif; }
.pv-step-body span { display: block; font: 400 .93rem/1.6 Montserrat, sans-serif; color: rgba(255, 255, 255, .7); }
.pv-step-bar { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(255, 255, 255, .06); }
.pv-step-bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #668ECB, var(--px-aqua)); }
@media (max-width: 900px) {
    .px-pose-in { grid-template-columns: minmax(0, 1fr); }
    .px-pose .pv-phone { justify-self: center; }
}

.px-final { padding: clamp(4rem, 8vw, 7rem) var(--px-g); text-align: center; background: #fff; }
.px-final-in { max-width: 760px; margin: 0 auto; display: grid; justify-items: center; }
.px-final-sw { display: flex; margin-bottom: 1.6rem; }
.px-final-sw img { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 3px #fff, 0 6px 14px -4px rgba(0, 30, 60, .35); }
.px-final-sw img + img { margin-left: -10px; }
.px-final .px-k { justify-content: center; }
.px-final .px-k::after { content: ''; width: 26px; height: 2px; border-radius: 2px; background: #668ECB; }
.px-final-t { margin: .8rem 0 0; font: 300 clamp(2.1rem, 3.8vw, 3.6rem)/1.05 Montserrat, sans-serif; letter-spacing: -.03em; color: var(--px-navy); }
.px-final-t b { font-weight: 700; }
.px-final-in > p:not(.px-k) { margin: 1rem 0 0; max-width: 36rem; font: 400 clamp(.98rem, 1.1vw, 1.06rem)/1.65 Montserrat, sans-serif; color: #4a5d70; }
.px-final-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .8rem; margin-top: 1.8rem; }
@media (max-width: 480px) { .px-final .px-k { text-align: center; } .px-final .px-k::before, .px-final .px-k::after { display: none; } }

@media (prefers-reduced-motion: reduce) {
    .px-aka-track, .px-x-weld, .px-hstats { animation: none; }
    .px-co-photos img { transition: none; }
}