/* ================================================================ Veyra inner pages, 3 Nov 2026
   The homepage's language carried to every page under it: the same framed hero, mono deck
   labels, serif heads and real app screens. Loaded after home.20261103.css and scoped to
   body.v4p, so nothing here reaches the homepage. The markup is the old pages' markup with the
   glass classes taken off, so every rule below draws its own surface. */

.v4p main{overflow-x:clip;counter-reset:v4s}
.v4p main>section:not(.v4p-hero):not(.v4-end){padding:clamp(64px,8vw,120px) 0}
.v4p main>section:not(.v4p-hero):not(.v4-end)+section:not(.v4-end){padding-top:clamp(20px,3vw,40px)}
.v4p .wrap{width:min(100%,1240px);padding-inline:clamp(18px,4vw,40px)}
.v4p a{text-underline-offset:3px}
.v4p .lede a,.v4p .q p a,.v4p .v4p-prose a,.v4p .v4p-doc a,.v4p .pair a,.v4p .cmp a{color:var(--ivory);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--gold) 60%,transparent)}
.v4p .lede a:hover,.v4p .q p a:hover,.v4p .v4p-prose a:hover,.v4p .v4p-doc a:hover,.v4p .pair a:hover{text-decoration-color:var(--gold)}
.v4p-k{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--tx3)}
.v4p-k.gold{color:var(--gold)}

/* -------------------------------------------------------------- HERO, the homepage frame */
.v4p-hero{position:relative;padding:86px 12px 0!important}
.v4p-frame{position:relative;display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);min-height:min(calc(100svh - 104px),820px);border:1px solid var(--l1);border-radius:34px;overflow:hidden;
  background:radial-gradient(ellipse 70% 60% at 0% 100%,color-mix(in srgb,var(--clay) 20%,transparent),transparent 60%),radial-gradient(ellipse 60% 50% at 40% 0%,var(--goldsoft),transparent 65%),var(--ink2)}
.v4p-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(36px,5vw,76px) clamp(22px,4.4vw,72px)}
.v4p-copy .eyebrow{display:inline-flex;align-items:center;gap:10px;width:max-content;max-width:100%;padding:8px 14px;border:1px solid var(--l2);border-radius:999px;font:400 11px/1.3 var(--mono);letter-spacing:.14em;color:var(--tx2)}
.v4p-copy .eyebrow::after{content:"";order:-1;flex:none;width:7px;height:7px;border-radius:50%;background:#7FD69A;animation:v4-ping 2.4s infinite}
.v4p-copy .h1{margin:26px 0 0;font-family:var(--ed);font-weight:400;font-size:clamp(42px,4.9vw,84px);line-height:.95;letter-spacing:-.035em;text-wrap:balance;max-width:16ch;animation:v4-up 1.1s var(--ease) both}
.v4p-compare .v4p-copy .h1{font-size:clamp(38px,4.1vw,70px);max-width:19ch}
.v4p-copy .lede{margin:24px 0 0;font-size:clamp(16px,1.25vw,18.5px);line-height:1.62;color:var(--tx2);max-width:52ch;animation:v4-up 1.1s .12s var(--ease) both}
.v4p-copy .lede+.lede{margin-top:14px}
.v4p-copy .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px;animation:v4-up 1.1s .2s var(--ease) both}
.v4p-copy .fine{margin:18px 0 0;padding-top:18px;border-top:1px solid var(--l1);font-size:13.5px;line-height:1.6;color:var(--tx3);max-width:56ch}
.v4p-copy .fine a{color:var(--tx2);text-decoration:underline}

.v4p-visual{position:relative;display:grid;place-items:center;margin:12px;border-radius:26px;overflow:hidden;isolation:isolate;padding:clamp(24px,3.5vw,54px);
  background:radial-gradient(circle at 30% 30%,rgba(181,143,131,.3),transparent 52%),radial-gradient(circle at 78% 78%,rgba(201,168,76,.2),transparent 48%),#100d0b}
.v4p-visual::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(rgba(247,243,236,.11) 1px,transparent 1.3px) 0 0/22px 22px;-webkit-mask:radial-gradient(circle at 50% 50%,#000 20%,transparent 75%);mask:radial-gradient(circle at 50% 50%,#000 20%,transparent 75%)}
/* the deck corner marks, as on the homepage viewfinder */
.v4p-visual::after{content:"";position:absolute;inset:16px;pointer-events:none;
  background:linear-gradient(rgba(247,243,236,.4),rgba(247,243,236,.4)) 0 0/18px 1px no-repeat,linear-gradient(rgba(247,243,236,.4),rgba(247,243,236,.4)) 0 0/1px 18px no-repeat,
  linear-gradient(rgba(247,243,236,.4),rgba(247,243,236,.4)) 100% 0/18px 1px no-repeat,linear-gradient(rgba(247,243,236,.4),rgba(247,243,236,.4)) 100% 0/1px 18px no-repeat,
  linear-gradient(rgba(247,243,236,.4),rgba(247,243,236,.4)) 0 100%/18px 1px no-repeat,linear-gradient(rgba(247,243,236,.4),rgba(247,243,236,.4)) 0 100%/1px 18px no-repeat,
  linear-gradient(rgba(247,243,236,.4),rgba(247,243,236,.4)) 100% 100%/18px 1px no-repeat,linear-gradient(rgba(247,243,236,.4),rgba(247,243,236,.4)) 100% 100%/1px 18px no-repeat}

/* the real screens: a Mac or an iPad with a phone in front */
.v4p-rig{position:relative;width:100%;max-width:640px;aspect-ratio:640/520;perspective:1800px;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transform-style:preserve-3d;transition:transform .8s var(--ease)}
.v4p-rig figure{position:absolute;inset:auto;margin:0}
.v4p-rig .v4-mac{left:0;top:9%;width:88%;animation:v4p-in 1.2s .15s var(--ease) both}
.v4p-rig .v4-ipad{left:4%;top:2%;width:58%;animation:v4p-in 1.2s .15s var(--ease) both}
.v4p-rig .v4-iphone{right:2%;bottom:0;width:25%;animation:v4p-side 1.2s .35s var(--ease) both}
.v4p-rig-pad .v4-iphone{right:8%;width:30%}
.v4p-rig .v4-dev-note{inset:auto;animation:v4p-note .8s var(--ease) both}
.v4p-rig .v4-dev-note.n1{left:-2%;top:0;animation-delay:.9s}
.v4p-rig .v4-dev-note.n2{left:6%;bottom:4%;animation-delay:1.15s}
.v4p-rig-pad .v4-dev-note.n1{left:auto;right:0;top:6%}
.v4p-lt{display:none!important}
html[data-site-theme="light"] .v4p .v4p-lt{display:block!important}
html[data-site-theme="light"] .v4p .v4p-dk:has(+.v4p-lt){display:none!important}
@keyframes v4p-in{from{opacity:0;transform:translateY(46px) scale(.97)}to{opacity:1;transform:none}}
@keyframes v4p-side{from{opacity:0;transform:translateX(60px) rotate(5deg)}to{opacity:1;transform:none}}
@keyframes v4p-note{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* marketing: three drafted things, never sent on their own */
.v4p-stack{position:relative;width:100%;max-width:470px;display:grid;gap:14px;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .8s var(--ease)}
.v4p-card{display:grid;gap:10px;padding:20px 22px;border-radius:20px;color:#F7F3EC;background:rgba(30,25,22,.66);border:1px solid rgba(255,252,247,.16);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 30px 60px -30px rgba(0,0,0,.8);animation:v4p-in 1s var(--ease) both}
.v4p-card .v4p-k{color:rgba(247,243,236,.6)}
.v4p-card b{font-family:var(--ed);font-weight:400;font-size:clamp(21px,1.8vw,26px);line-height:1.1}
.v4p-card p{margin:0;font-size:14px;line-height:1.55;color:rgba(247,243,236,.74)}
.v4p-card.c1{margin-right:12%}
.v4p-card.c2{margin-left:14%;animation-delay:.18s}
.v4p-card.c3{margin-right:4%;margin-left:5%;animation-delay:.36s}
.v4p-stars{color:#E2C47E;letter-spacing:.12em}
.v4p-row{display:flex;gap:8px;margin-top:4px}
.v4p-btn{padding:8px 14px;border-radius:999px;border:1px solid rgba(247,243,236,.24);font-size:12.5px;font-weight:600}
.v4p-btn.on{background:#F7F3EC;color:#14100E;border-color:#F7F3EC;animation:v4p-did 6s 1.6s var(--ease) infinite}
@keyframes v4p-did{0%,40%{box-shadow:0 0 0 0 rgba(201,168,76,.5)}55%{box-shadow:0 0 0 10px rgba(201,168,76,0)}100%{box-shadow:0 0 0 0 rgba(201,168,76,0)}}

/* pricing and switching: one instrument panel each */
.v4p-meter,.v4p-import{width:100%;max-width:480px;padding:26px;border-radius:24px;color:#F7F3EC;background:rgba(30,25,22,.62);border:1px solid rgba(255,252,247,.16);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 40px 80px -40px rgba(0,0,0,.85);transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .8s var(--ease);animation:v4p-in 1.1s .1s var(--ease) both}
.v4p-meter-top{display:flex;justify-content:space-between;gap:12px;padding-bottom:16px;border-bottom:1px solid rgba(247,243,236,.12)}
.v4p-meter .v4p-k,.v4p-import .v4p-k{color:rgba(247,243,236,.6)}
.v4p-meter .v4p-k.gold,.v4p-import .v4p-k.gold{color:#E2C47E}
.v4p-meter ol{list-style:none;margin:0;padding:8px 0 0}
.v4p-meter li{display:grid;grid-template-columns:62px minmax(0,1fr) 58px 40px;align-items:center;gap:12px;padding:13px 0;font-size:14px}
.v4p-meter li+li{border-top:1px solid rgba(247,243,236,.07)}
.v4p-meter li span{font-weight:600}
.v4p-meter li i{height:8px;border-radius:99px;background:rgba(247,243,236,.08);overflow:hidden}
.v4p-meter li s{display:block;height:100%;width:var(--w);border-radius:inherit;background:linear-gradient(90deg,#B58F83,#E2C47E);transform-origin:0 50%;animation:v4p-fill 1.4s .5s var(--ease) both}
.v4p-meter li:nth-child(2) s{animation-delay:.62s}.v4p-meter li:nth-child(3) s{animation-delay:.74s}.v4p-meter li:nth-child(4) s{animation-delay:.86s}
.v4p-meter li b{font:400 12px var(--mono);text-align:right;color:rgba(247,243,236,.8)}
.v4p-meter li em{font-family:var(--ed);font-style:normal;font-size:20px;text-align:right;color:#F7F3EC}
.v4p-meter-foot,.v4p-import>p{margin:16px 0 0;padding-top:16px;border-top:1px solid rgba(247,243,236,.12);font-size:13px;line-height:1.55;color:rgba(247,243,236,.64)}
@keyframes v4p-fill{from{transform:scaleX(0)}to{transform:none}}
.v4p-import ul{list-style:none;margin:0;padding:6px 0 0}
.v4p-import li{display:grid;grid-template-columns:20px minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 0;font-size:14px}
.v4p-import li+li{border-top:1px solid rgba(247,243,236,.07)}
.v4p-import li b{font:400 13px var(--mono);color:#F7F3EC}
.v4p-import li span{font-size:12px;color:rgba(247,243,236,.55)}
.v4p-import li i{width:18px;height:18px;border-radius:6px;border:1.5px solid rgba(247,243,236,.3)}
.v4p-import li i.ok{border-color:#7FB08C;background:#7FB08C;box-shadow:inset 0 0 0 3px #1e1916;animation:v4p-note .5s 1s both}
.v4p-import li:nth-child(2) i.ok{animation-delay:1.3s}
.v4p-import-bar{height:6px;margin-top:10px;border-radius:99px;background:rgba(247,243,236,.08);overflow:hidden}
.v4p-import-bar span{display:block;width:100%;height:100%;background:linear-gradient(90deg,#7FB08C,#E2C47E);transform-origin:0 50%;animation:v4p-fill 2.6s .6s var(--ease) both}

/* compare: the icon against a plain name, never a borrowed logo */
.v4p-vs{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:clamp(14px,2.4vw,30px);width:100%;max-width:520px;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .8s var(--ease)}
.v4p-vs>div{display:grid;justify-items:center;gap:16px;color:#F7F3EC;animation:v4p-in 1.1s var(--ease) both}
.v4p-vs-b{animation-delay:.2s!important}
.v4p-vs b{font-size:15px;font-weight:600;letter-spacing:.01em;text-align:center}
.v4p-vs-icon{display:block;width:clamp(110px,12vw,170px);aspect-ratio:1;border-radius:22.4%;overflow:hidden;box-shadow:0 0 0 1px rgba(255,252,247,.12),0 40px 70px -30px rgba(0,0,0,.9),0 0 90px -20px rgba(201,168,76,.4)}
.v4p-vs-icon img{display:block;width:100%;height:100%;animation:v4-bob 7s ease-in-out infinite}
.v4p-vs-mono{display:grid;place-items:center;width:clamp(110px,12vw,170px);aspect-ratio:1;border-radius:22.4%;border:1px dashed rgba(247,243,236,.3);font-family:var(--ed);font-size:clamp(54px,6vw,84px);color:rgba(247,243,236,.5);background:rgba(247,243,236,.03)}
.v4p-vs-x{font:400 12px var(--mono);letter-spacing:.2em;text-transform:uppercase;color:#E2C47E}
.v4p-orbit{position:relative;display:grid;place-items:center;width:min(100%,480px);aspect-ratio:1;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .8s var(--ease)}
.v4p-orbit::before,.v4p-orbit::after{content:"";position:absolute;inset:7%;border:1px dashed rgba(247,243,236,.18);border-radius:50%}
.v4p-orbit::after{inset:24%;border-style:solid;border-color:rgba(201,168,76,.28)}
.v4p-orbit-ring{position:absolute;inset:0;animation:v4p-spin 60s linear infinite}
.v4p-orbit-ring span{position:absolute;left:50%;top:50%;padding:8px 14px;border-radius:999px;font-size:12.5px;font-weight:600;white-space:nowrap;color:#F7F3EC;background:rgba(30,25,22,.72);border:1px solid rgba(255,252,247,.18);
  --a:calc(var(--i) * 360deg / var(--n) - 90deg);transform:translate(-50%,-50%) rotate(var(--a)) translateX(min(43cqw,206px)) rotate(calc(var(--a) * -1));animation:v4p-counter 60s linear infinite}
.v4p-orbit{container-type:inline-size}
.v4p-orbit .v4p-vs-icon{position:relative;z-index:2}
@keyframes v4p-spin{to{rotate:360deg}}
@keyframes v4p-counter{to{rotate:-360deg}}

/* legal, support, 404: a document hero with a large mark instead of a picture */
.v4p-frame-doc{min-height:min(62svh,560px);grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr)}
.v4p-docmark{position:relative;display:grid;place-items:center;overflow:hidden}
.v4p-docmark span{font-family:var(--ed);font-size:clamp(220px,26vw,420px);line-height:.8;letter-spacing:-.06em;background:linear-gradient(160deg,var(--ivory),var(--gold) 70%);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:.85;animation:v4p-in 1.4s var(--ease) both}
.v4p-lost .v4p-frame-doc{min-height:min(calc(100svh - 104px),760px)}
.v4p-lost .v4p-copy .h1{font-size:clamp(64px,9vw,150px);max-width:none}
.v4p-lost .v4p-docmark span{font-size:clamp(150px,18vw,300px)}
.v4p-lost .v4p-docmark span::after{content:"404";display:block;margin-top:-.08em;font-size:.3em;letter-spacing:.06em;text-align:center}

/* -------------------------------------------------------------- section heads, numbered like the deck */
.v4p .head{display:grid;grid-template-columns:max-content minmax(0,1fr);align-items:baseline;column-gap:14px;row-gap:18px;margin:0 0 clamp(32px,4.4vw,56px);max-width:62rem;counter-increment:v4s}
.v4p .head::before{content:"[ " counter(v4s,decimal-leading-zero) " ]";font:400 11px var(--mono);letter-spacing:.14em;color:var(--gold)}
.v4p .head>*:not(.eyebrow){grid-column:1/-1}
.v4p .head .eyebrow{font:400 11px var(--mono);letter-spacing:.14em;color:var(--tx3)}
.v4p .head .h2,.v4p .head h2{margin:0;font-family:var(--ed);font-weight:400;font-size:clamp(36px,4.6vw,70px);line-height:.98;letter-spacing:-.03em;text-wrap:balance;max-width:20ch}
.v4p .head p{margin:0}

/* -------------------------------------------------------------- feature pages */
.v4p .landing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;counter-reset:v4c}
.v4p .landing-card{position:relative;display:flex;flex-direction:column;gap:14px;min-height:260px;padding:28px;border:1px solid var(--l1);border-radius:26px;background:var(--pane);counter-increment:v4c;transition:border-color .35s,transform .5s var(--ease)}
.v4p .landing-card:hover{border-color:var(--l2);transform:translateY(-4px)}
.v4p .landing-card::before{content:"0" counter(v4c) " / 03";font:400 10.5px var(--mono);letter-spacing:.14em;color:var(--gold);padding-bottom:16px;margin-bottom:auto;border-bottom:1px solid var(--l1)}
.v4p .landing-card h3{margin:0;font-family:var(--ed);font-weight:400;font-size:clamp(26px,2.3vw,36px);line-height:1.02;letter-spacing:-.02em;text-wrap:balance}
.v4p .landing-card p{margin:0;font-size:15px;line-height:1.62;color:var(--tx2)}

.v4p .feature-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--l2);counter-reset:v4f}
.v4p .feature-list li{position:relative;display:grid;grid-template-columns:64px minmax(0,.8fr) minmax(0,1.2fr) 28px;gap:clamp(14px,2.4vw,34px);align-items:baseline;padding:24px 8px;border-bottom:1px solid var(--l1);counter-increment:v4f;transition:background .35s,padding .45s var(--ease)}
.v4p .feature-list li::before{content:"V/" counter(v4f,decimal-leading-zero);font:400 10.5px var(--mono);letter-spacing:.14em;color:var(--gold)}
.v4p .feature-list li::after{content:"→";justify-self:end;color:var(--tx3);transition:transform .35s var(--ease),color .35s}
.v4p .feature-list li:hover{background:var(--pane);padding-inline:18px}
.v4p .feature-list li:hover::after{color:var(--gold);transform:translateX(4px)}
.v4p .feature-list strong{font-family:var(--ed);font-weight:400;font-size:clamp(22px,1.9vw,28px);line-height:1.1;letter-spacing:-.01em}
.v4p .feature-list span{font-size:15px;line-height:1.62;color:var(--tx2)}

/* the callout is a cinematic band and stays dark in both themes */
.v4p .stack-callout{position:relative;display:grid;grid-template-columns:minmax(0,1.5fr) auto;gap:30px;align-items:end;margin-top:clamp(40px,5vw,64px);padding:clamp(30px,5vw,64px);border-radius:30px;overflow:hidden;isolation:isolate;color:#F7F3EC;
  background:radial-gradient(ellipse 60% 90% at 100% 100%,rgba(201,168,76,.28),transparent 60%),radial-gradient(ellipse 50% 80% at 0% 0%,rgba(181,143,131,.3),transparent 60%),#100d0b}
.v4p .stack-callout::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(rgba(247,243,236,.1) 1px,transparent 1.3px) 0 0/22px 22px;-webkit-mask:linear-gradient(100deg,transparent 30%,#000);mask:linear-gradient(100deg,transparent 30%,#000)}
.v4p .stack-callout .eyebrow{font:400 11px var(--mono);letter-spacing:.14em;color:#E2C47E}
.v4p .stack-callout h3{margin:14px 0 0;font-family:var(--ed);font-weight:400;font-size:clamp(34px,4.4vw,64px);line-height:.98;letter-spacing:-.03em;max-width:18ch;text-wrap:balance}
.v4p .stack-callout p{margin:18px 0 0;max-width:54ch;font-size:16px;line-height:1.62;color:rgba(247,243,236,.76)}
.v4p .stack-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.v4p .stack-callout .btn-gold{background:#C9A84C;color:#1A1408}
.v4p .stack-callout .btn-ghost{color:#F7F3EC;border-color:rgba(247,243,236,.35);background:transparent}

/* -------------------------------------------------------------- FAQ, the homepage's numbered list */
.v4p .v4p-faq{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(30px,6vw,96px);align-items:start}
.v4p .v4p-faq>.head{position:sticky;top:110px;margin:0}
.v4p .v4p-faq>.head .h2{font-size:clamp(34px,3.8vw,58px)}
.v4p .qs{display:block;border-top:1px solid var(--l1);counter-reset:q}
.v4p .q{border:0;border-bottom:1px solid var(--l1);border-radius:0;background:none;padding:0;counter-increment:q;overflow:visible}
.v4p .q summary{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr) 28px;align-items:baseline;gap:0;list-style:none;cursor:pointer;padding:22px 0;font-family:var(--ed);font-weight:400;font-size:clamp(20px,1.8vw,26px);line-height:1.22;letter-spacing:-.005em}
.v4p .q summary::before{content:counter(q,decimal-leading-zero);font:400 11px var(--mono);color:var(--gold)}
.v4p .q summary::after{content:"+";width:auto;height:auto;margin:0;border:0;transform:none;justify-self:end;font:400 22px var(--sans4);color:var(--gold);transition:transform .3s var(--ease)}
.v4p .q[open] summary::after{transform:rotate(45deg)}
.v4p .q summary:focus-visible{outline:2px solid var(--gold);outline-offset:4px;border-radius:6px}
.v4p .q p{margin:0;padding:0 28px 24px 44px;max-width:none;font-size:16px;line-height:1.65;color:var(--tx2)}

/* -------------------------------------------------------------- prose sections: an editorial spread */
.v4p .v4p-prose{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(30px,6vw,96px);align-items:start}
.v4p .v4p-prose>.head{position:sticky;top:110px;margin:0}
.v4p .v4p-prose>.head .h2{font-size:clamp(32px,3.6vw,54px)}
.v4p .v4p-prose>.head .lede{font-size:16px;color:var(--tx2)}
.v4p .v4p-prose>:not(.head){max-width:68ch;padding-top:6px;border-top:1px solid var(--l1)}
.v4p .v4p-prose .lede{max-width:none;margin:20px 0 0;font-size:clamp(16.5px,1.3vw,19px);line-height:1.7;color:var(--tx2)}
.v4p .v4p-prose p.lede:first-child{color:var(--ivory)}
.v4p .v4p-prose h3{margin:30px 0 0;font-family:var(--ed);font-weight:400;font-size:clamp(24px,2vw,30px);line-height:1.15}
.v4p .v4p-prose p:not(.lede){margin:14px 0 0;font-size:16px;line-height:1.7;color:var(--tx2)}
.v4p ul.lede{list-style:none;margin:0;padding:6px 0 0;counter-reset:v4l}
.v4p ul.lede li{position:relative;padding:16px 0 16px 46px;border-bottom:1px solid var(--l1);font-size:clamp(15.5px,1.2vw,17.5px);line-height:1.65;color:var(--tx2);counter-increment:v4l}
.v4p ul.lede li::before{content:counter(v4l,decimal-leading-zero);position:absolute;left:0;top:20px;font:400 11px var(--mono);color:var(--gold)}
.v4p ul.lede li strong,.v4p ul.lede li b{color:var(--ivory);font-weight:600}
.v4p .v4p-prose ol{margin:18px 0 0;padding-left:22px;color:var(--tx2);font-size:16px;line-height:1.7}
.v4p .v4p-prose ol li::marker{color:var(--gold);font-family:var(--mono);font-size:12px}

/* -------------------------------------------------------------- compare: the instrument table */
.v4p .cmp-table{margin-top:0;border:1px solid var(--l2);border-radius:26px;background:var(--pane);overflow-x:auto;-webkit-overflow-scrolling:touch}
.v4p .cmp-table+.cmp-table,.v4p .cmp-table+p,.v4p .v4p-tables>.rise:not(.head)+.rise{margin-top:22px}
.v4p .cmp-table table{width:100%;min-width:640px;border-collapse:collapse;font-size:14.5px;line-height:1.55}
.v4p .cmp-table caption{caption-side:top;text-align:left;padding:18px 22px 14px;font:400 10.5px/1.5 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--tx3);border-bottom:1px solid var(--l1)}
.v4p .cmp-table th,.v4p .cmp-table td{padding:16px 22px;text-align:left;vertical-align:top;border-top:1px solid var(--l1)}
.v4p .cmp-table thead th{border-top:0;padding-top:18px;font:400 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--tx3)}
.v4p .cmp-table tbody th{font-weight:600;color:var(--ivory);width:22%}
.v4p .cmp-table td{color:var(--tx2)}
.v4p .cmp-table tbody tr{transition:background .25s}
.v4p .cmp-table tbody tr:hover{background:var(--pane)}
.v4p .cmp-table table[data-veyra-col="2"] :is(td,th):nth-child(2){background:linear-gradient(color-mix(in srgb,var(--gold) 7%,transparent),color-mix(in srgb,var(--gold) 7%,transparent));color:var(--ivory)}
.v4p .cmp-table table[data-veyra-col="2"] thead th:nth-child(2){color:var(--gold);box-shadow:inset 0 2px 0 var(--gold)}
.v4p .cmp-table a{color:var(--ivory);text-decoration:underline;text-decoration-color:var(--l2)}
.v4p .v4p-tables>.rise:not(.head):not(.cmp-table) p{margin:16px 0 0;font-size:14px;line-height:1.65;color:var(--tx3);max-width:80ch}

.v4p .pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.v4p .pair>div{position:relative;padding:clamp(26px,3vw,40px);border:1px solid var(--l1);border-radius:26px;background:var(--pane)}
.v4p .pair>div:last-child{border-color:color-mix(in srgb,var(--gold) 55%,transparent);background:radial-gradient(ellipse 80% 70% at 100% 0%,var(--goldsoft),transparent 70%),var(--pane)}
.v4p .pair>div::before{content:"Option A";display:block;margin-bottom:18px;font:400 10.5px var(--mono);letter-spacing:.14em;color:var(--tx3)}
.v4p .pair>div:last-child::before{content:"Option B · Veyra";color:var(--gold)}
.v4p .pair h3{margin:0;font-family:var(--ed);font-weight:400;font-size:clamp(28px,2.6vw,40px);line-height:1.02;letter-spacing:-.02em}
.v4p .pair p{margin:16px 0 0;font-size:16px;line-height:1.68;color:var(--tx2)}

.v4p .cmps{display:grid;gap:0;border-top:1px solid var(--l2)}
.v4p .cmp{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr) minmax(0,1fr);gap:clamp(16px,3vw,44px);align-items:start;padding:28px 6px;border:0;border-bottom:1px solid var(--l1);border-radius:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;transition:background .3s,padding .45s var(--ease)}
.v4p .cmp:hover{background:var(--pane);padding-inline:18px}
.v4p .cmp h3{align-self:start;margin:0;font-family:var(--ed);font-weight:400;font-size:clamp(24px,2.2vw,32px);line-height:1.08}
.v4p .cmp .mono{font:400 10.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--tx3)}
.v4p .cmp .mono.gold{color:var(--gold)}
.v4p .cmp .six p{margin:10px 0 0;font-size:15px;line-height:1.6;color:var(--tx3);text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--clay) 55%,transparent);text-decoration-thickness:1px}
.v4p .cmp .one{padding-left:18px;border-left:2px solid var(--gold)}
.v4p .cmp .one p{margin:10px 0 0;font-size:15px;line-height:1.6;color:var(--ivory)}

/* -------------------------------------------------------------- pricing */
.v4p .plans{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.v4p .plan{position:relative;display:flex;flex-direction:column;gap:10px;padding:26px;border:1px solid var(--l2);border-radius:26px;background:color-mix(in srgb,var(--ink2) 62%,transparent);transition:transform .5s var(--ease),border-color .3s}
.v4p .plan:hover{transform:translateY(-6px)}
.v4p .plan.is-pick{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold),0 40px 80px -40px color-mix(in srgb,var(--gold) 60%,transparent)}
.v4p .plan .name{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.v4p .plan .name em{margin-left:auto;padding:4px 10px;border-radius:999px;background:var(--gold);color:#1A1408;font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:.08em}
.v4p .plan .fee{margin:8px 0 0;font-family:var(--ed);font-size:clamp(56px,5vw,76px);line-height:.9;letter-spacing:-.03em}
.v4p .plan .fee small{margin-left:6px;font-family:var(--sans4);font-size:14px;letter-spacing:0;color:var(--tx3)}
.v4p .plan .fee+div:not(.cap){font-size:13px;color:var(--tx2)}
.v4p .plan .cap{margin:6px 0 0;padding-top:12px;border-top:1px solid var(--l1);font:400 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.v4p .plan p{flex:1;margin:0;font-size:14.5px;line-height:1.6;color:var(--tx2)}
.v4p .plan .go{margin-top:8px;padding:0}
.v4p .plan .go .btn{width:100%}
.v4p #pricing .mono{margin-top:26px;text-align:center;font:400 11px/1.7 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--tx3)}
.v4p .pricing-detail{padding-top:clamp(64px,8vw,120px)!important}
.v4p .plan-detail-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:0;border:1px solid var(--l2);border-radius:26px;overflow:hidden;background:var(--pane)}
.v4p .plan-detail{padding:26px;border-left:1px solid var(--l1)}
.v4p .plan-detail:first-child{border-left:0}
.v4p .plan-detail.is-pick{background:linear-gradient(var(--goldsoft),transparent 70%);box-shadow:inset 0 2px 0 var(--gold)}
.v4p .plan-detail h3{margin:0;font-family:var(--ed);font-weight:400;font-size:clamp(24px,2vw,30px);line-height:1.08}
.v4p .plan-detail p{margin:10px 0 0;font-size:14px;line-height:1.55;color:var(--tx2)}
.v4p .plan-detail ul{list-style:none;margin:20px 0 0;padding:16px 0 0;border-top:1px solid var(--l1);display:grid;gap:10px}
.v4p .plan-detail li{position:relative;padding-left:24px;font-size:13.5px;line-height:1.45;color:var(--tx2)}
.v4p .plan-detail li::before{content:"";position:absolute;left:2px;top:.32em;width:9px;height:5px;border-left:1.5px solid var(--gold);border-bottom:1.5px solid var(--gold);transform:rotate(-45deg)}
.v4p .pricing-note{margin:20px 0 0;text-align:center;font-size:13px;color:var(--tx3)}

/* -------------------------------------------------------------- legal and support: a document with a rail */
.v4p .v4p-docs{display:grid;grid-template-columns:minmax(0,3.2fr) minmax(0,8.8fr);gap:clamp(30px,5vw,80px);align-items:start}
.v4p .v4p-docs>:not(.v4p-toc){grid-column:2}
.v4p-toc{grid-column:1;grid-row:1 / span 9;position:sticky;top:110px;display:grid;gap:14px}
.v4p-toc ol{list-style:none;margin:0;padding:0;border-left:1px solid var(--l1)}
.v4p-toc a{display:flex;gap:12px;padding:8px 0 8px 16px;margin-left:-1px;border-left:1px solid transparent;font-size:14px;line-height:1.35;color:var(--tx3);transition:color .25s,border-color .25s}
.v4p-toc a i{font:400 10.5px/1.9 var(--mono);font-style:normal;color:var(--gold)}
.v4p-toc a:hover,.v4p-toc a.is-on{color:var(--ivory);border-left-color:var(--gold)}
.v4p .v4p-docs .qs{border:0;display:grid;gap:0}
.v4p .v4p-doc,.v4p .v4p-docs>.rise{scroll-margin-top:100px;padding:30px 0 34px;border-top:1px solid var(--l1);background:none;border-radius:0}
.v4p .v4p-docs .qs>.v4p-doc:first-child{border-top-color:var(--l2)}
.v4p .v4p-doc h3,.v4p .v4p-docs>.rise h3{margin:0;font-family:var(--ed);font-weight:400;font-size:clamp(26px,2.4vw,36px);line-height:1.08;letter-spacing:-.015em}
.v4p .v4p-doc p,.v4p .v4p-docs>.rise p{margin:14px 0 0;max-width:66ch;font-size:16.5px;line-height:1.72;color:var(--tx2)}
.v4p-support .v4p-docs>.rise{margin-top:20px;padding:30px;border:1px solid var(--l2);border-radius:26px;background:var(--pane)}

/* -------------------------------------------------------------- related reading */
.v4p .seo-rel{max-width:1240px;margin:0 auto clamp(40px,5vw,70px);padding:0 clamp(18px,4vw,40px);border:0;border-radius:0;background:none}
.v4p .seo-rel h2{margin:0 0 18px;padding-top:28px;border-top:1px solid var(--l1);font:400 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--tx3)}
.v4p .seo-rel ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:12px}
.v4p .seo-rel a{display:flex;align-items:center;justify-content:space-between;gap:16px;height:100%;padding:20px 22px;border:1px solid var(--l1);border-radius:18px;background:var(--pane);font:400 clamp(19px,1.6vw,23px)/1.2 var(--ed);color:var(--ivory);transition:border-color .3s,transform .4s var(--ease)}
.v4p .seo-rel a:hover{opacity:1;border-color:var(--gold);transform:translateY(-3px)}

/* -------------------------------------------------------------- the closing frame */
.v4p .v4p-end{padding:clamp(40px,5vw,70px) 0 clamp(60px,7vw,100px)!important}
.v4p .v4p-endwrap{width:100%;padding-inline:12px}
.v4p .v4-end-frame{min-height:min(80svh,760px)}
.v4p .v4-end-copy .eyebrow{font:400 11px var(--mono);letter-spacing:.14em;color:rgba(247,243,236,.6)}
.v4p .v4-end-copy .h2{margin:0;font-family:var(--ed);font-weight:400;font-size:clamp(46px,5.6vw,96px);line-height:.92;letter-spacing:-.04em;color:#F7F3EC;text-wrap:balance}
.v4p .v4-end-copy>p,.v4p .v4-end-copy .lede{margin:0;max-width:46ch;font-size:17px;line-height:1.62;color:rgba(247,243,236,.78)}
.v4p .v4-end-copy .cta{display:flex;flex-wrap:wrap;gap:12px}
.v4p .v4-end-copy .btn-solid{background:#F7F3EC;color:#14100E}
.v4p .v4-end-copy form{display:grid;gap:9px;max-width:440px;margin-top:6px}
.v4p .v4-end-copy label{font-size:12.5px;font-weight:600;color:rgba(247,243,236,.72)}
.v4p .v4-end-copy input[type=text]:not([name=website]),.v4p .v4-end-copy input[type=email]{height:52px;padding:0 18px;border:1px solid rgba(247,243,236,.24);border-radius:14px;background:rgba(247,243,236,.07);color:#F7F3EC;font:500 16px var(--sans4);outline:none;transition:border-color .25s}
.v4p .v4-end-copy input::placeholder{color:rgba(247,243,236,.45)}
.v4p .v4-end-copy input:focus{border-color:#C9A84C}
.v4p .v4-end-copy form .btn{margin-top:8px}
.v4p .v4-end-copy .msg{min-height:1.3em;margin:0;font-size:13.5px;color:rgba(247,243,236,.8)}
.v4p .v4-end-copy form+p{color:rgba(247,243,236,.55)!important}
.v4p .v4-end-copy form+p a{color:rgba(247,243,236,.8)}

/* -------------------------------------------------------------- the standalone account page */
.v4p-account{min-height:100svh;padding:clamp(40px,8vw,100px) 16px}
.v4p-account main{max-width:760px;margin:0 auto;padding:clamp(28px,5vw,56px);border:1px solid var(--l1);border-radius:30px;background:var(--ink2)}

/* -------------------------------------------------------------- light theme: the homepage's glass */
html[data-site-theme="light"] .v4p :is(.landing-card,.pair>div,.plan,.plan-detail-grid,.cmp-table,.seo-rel a,.v4p-support .v4p-docs>.rise){background:var(--lg-body);border-color:var(--lg-rim);box-shadow:var(--lg-shadow);-webkit-backdrop-filter:var(--lg-blur);backdrop-filter:var(--lg-blur)}
html[data-site-theme="light"] .v4p .pair>div:last-child{background:radial-gradient(ellipse 80% 70% at 100% 0%,color-mix(in srgb,var(--gold) 14%,transparent),transparent 70%),var(--lg-body);border-color:color-mix(in srgb,var(--gold) 45%,#fff)}
html[data-site-theme="light"] .v4p .plan.is-pick{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold),var(--lg-shadow)}
html[data-site-theme="light"] .v4p .v4p-frame{background:radial-gradient(ellipse 70% 60% at 0% 100%,color-mix(in srgb,var(--clay) 13%,transparent),transparent 60%),radial-gradient(ellipse 60% 50% at 40% 0%,color-mix(in srgb,var(--gold) 12%,transparent),transparent 65%),linear-gradient(155deg,#FFFDF9,#F6EFE5);border-color:var(--lg-rim);box-shadow:var(--lg-shadow)}
html[data-site-theme="light"] .v4p .v4p-copy .eyebrow{background:var(--lg-body);border-color:var(--lg-rim);box-shadow:var(--lg-shadow)}
html[data-site-theme="light"] .v4p .cmp-table tbody tr:hover,html[data-site-theme="light"] .v4p .feature-list li:hover,html[data-site-theme="light"] .v4p .cmp:hover{background:rgba(255,255,255,.55)}
html[data-site-theme="light"] .v4p main{background:radial-gradient(ellipse 50% 30% at 100% 30%,color-mix(in srgb,var(--gold) 8%,transparent),transparent 70%),radial-gradient(ellipse 50% 30% at 0% 70%,color-mix(in srgb,var(--clay) 8%,transparent),transparent 70%)}
html[data-site-theme="light"] .v4p .btn-gold{background:#C9A84C;color:#1A1408}
html[data-site-theme="light"] .v4p .btn-gold:hover{background:#D9B85C}
html[data-site-theme="light"] .v4p-account main{background:var(--lg-body);border-color:var(--lg-rim);box-shadow:var(--lg-shadow)}

/* -------------------------------------------------------------- tablet */
@media(max-width:1100px){
  .v4p .plans{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v4p .plan-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v4p .plan-detail:nth-child(3){border-left:0}
  .v4p .plan-detail:nth-child(n+3){border-top:1px solid var(--l1)}
}
@media(max-width:900px){
  .v4p-hero{padding:76px 8px 0!important}
  .v4p-frame,.v4p-frame-doc{grid-template-columns:minmax(0,1fr);min-height:0;border-radius:28px}
  .v4p-copy{padding:40px 22px 34px}
  .v4p-visual{margin:0 8px 8px;min-height:0;padding:30px 18px}
  .v4p-docmark{display:none}
  .v4p-lost .v4p-frame-doc{min-height:min(calc(100svh - 92px),640px);align-content:center}
  .v4p .landing-grid{grid-template-columns:minmax(0,1fr)}
  .v4p .landing-card{min-height:0}
  .v4p .feature-list li{grid-template-columns:52px minmax(0,1fr);row-gap:8px;padding:20px 4px}
  .v4p .feature-list li span{grid-column:2}
  .v4p .feature-list li::after{display:none}
  .v4p .stack-callout{grid-template-columns:minmax(0,1fr);align-items:start}
  .v4p .stack-actions{justify-content:flex-start}
  .v4p .v4p-faq,.v4p .v4p-prose,.v4p .v4p-docs{grid-template-columns:minmax(0,1fr);gap:28px}
  .v4p .v4p-faq>.head,.v4p .v4p-prose>.head{position:static}
  .v4p .v4p-docs>:not(.v4p-toc){grid-column:1}
  .v4p-toc{position:static;grid-row:auto}
  .v4p .pair{grid-template-columns:minmax(0,1fr)}
  .v4p .cmp{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:16px}
  .v4p .cmp h3{grid-column:1/-1}
  .v4p .v4-end-frame{grid-template-columns:minmax(0,1fr)!important;min-height:0}
  .v4p .v4-end-art{grid-column:1!important;grid-row:2!important;min-height:400px}
  .v4p .v4-end-copy{padding:40px 24px 24px}
}
/* -------------------------------------------------------------- phone */
@media(max-width:600px){
  .v4p .wrap{padding-inline:18px}
  .v4p-copy .h1{font-size:clamp(38px,10.4vw,52px);max-width:none}
  .v4p-compare .v4p-copy .h1{font-size:clamp(32px,8.6vw,44px)}
  .v4p-copy .cta .btn{flex:1 1 100%}
  .v4p .head{grid-template-columns:max-content minmax(0,1fr)}
  .v4p .head .h2,.v4p .head h2{font-size:clamp(32px,9vw,44px)}
  .v4p .q summary{grid-template-columns:34px minmax(0,1fr) 22px;font-size:20px}
  .v4p .q p{padding:0 0 22px 34px;font-size:15.5px}
  .v4p .plans,.v4p .plan-detail-grid{grid-template-columns:minmax(0,1fr)}
  .v4p .plan-detail{border-left:0;border-top:1px solid var(--l1)}
  .v4p .plan-detail:first-child{border-top:0}
  .v4p .cmp{grid-template-columns:minmax(0,1fr);padding:24px 0}
  .v4p .cmp:hover{padding-inline:0}
  .v4p ul.lede li{padding-left:36px}
  .v4p .stack-actions{display:grid}
  .v4p .stack-actions .btn{width:100%}
  .v4p-rig .v4-dev-note{font-size:11px;padding:7px 11px}
  .v4p-meter,.v4p-import{padding:20px}
  .v4p-meter li{grid-template-columns:52px minmax(0,1fr) 48px 34px;gap:9px;font-size:13px}
  .v4p-card{padding:16px 18px}
  .v4p-card.c1,.v4p-card.c2,.v4p-card.c3{margin-inline:0}
  .v4p-orbit-ring span{font-size:11px;padding:6px 10px}
  .v4p .v4-ping{font-size:11px}
  .v4p .v4-ping.p1{left:4%;top:4%}.v4p .v4-ping.p2{right:4%;top:14%}.v4p .v4-ping.p3{left:4%;bottom:17%}.v4p .v4-ping.p4{right:4%;bottom:4%}
}
@media(prefers-reduced-motion:reduce){
  .v4p *,.v4p *::before,.v4p *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important;transition-duration:.01ms!important}
}
