/*
 * AI Chatbot ROI Calculator - page styles.
 *
 * Ported from the approved design with every selector scoped under .pxroi,
 * so nothing leaks into the parent theme. Page chrome (top bar, footer) and
 * the shared FAQ accordion / related-tools grid are deliberately NOT styled
 * here: the theme and arolax_render_tool_extras() still own those.
 * Keyframes are prefixed pxroi- to avoid colliding with theme animations.
 */
.pxroi{--ink:#1a1512; --ink-2:#3d352f; --muted:#6f655e; --line:#ece6e1; --line-2:#d9d0c9;
  --paper:#ffffff; --mist:#f7f5f3;
  --volt:#f4531f; --navy:#1a1512; --blue:#c0370b;
  --t-yellow:#fef1ed; --t-blue:#fde7e0; --t-mint:#fef6f4; --t-lilac:#f6ece8; --t-rose:#fdddd2;
  --ok:#f4531f; --mid:#f88f6d; --bad:#b5aaa2;
  --font-head:"Bricolage Grotesque","Figtree",system-ui,sans-serif;
  --font-body:"Figtree",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;}
.pxroi *,.pxroi *::before,.pxroi *::after{box-sizing:border-box}
.pxroi{font-family:var(--font-body);font-size:17px;line-height:1.6;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
.pxroi img,.pxroi svg{max-width:100%}
.pxroi a{color:var(--blue)}
.pxroi strong{font-weight:600}
.pxroi :focus-visible{outline:3px solid var(--blue);outline-offset:2px;border-radius:6px}
.pxroi [hidden]{display:none!important}
.pxroi .sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.pxroi h1,.pxroi h2,.pxroi h3{font-family:var(--font-head);letter-spacing:-.02em;color:var(--ink)}
.pxroi h1{font-size:clamp(2.3rem,5vw,3.6rem);line-height:1.05;font-weight:800;margin:.25em 0 .3em}
.pxroi h2{font-size:clamp(1.8rem,3.3vw,2.6rem);line-height:1.1;font-weight:800;margin:0 0 .45em}
.pxroi h3{font-size:1.2rem;line-height:1.25;font-weight:800;margin:0 0 .35em}
.pxroi p{margin:0 0 1em}
.pxroi .container{max-width:1120px;margin:0 auto;padding:0 24px}
.pxroi .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border-radius:999px;font:600 15px/1.2 var(--font-body);border:0;cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s,opacity .15s}
.pxroi .btn-primary{background:var(--ink);color:#fff}
.pxroi .btn-primary:hover{background:#2e2620}
.pxroi .btn-primary:disabled{opacity:.35;cursor:not-allowed}
.pxroi .btn-volt{background:var(--volt);color:var(--ink)}
.pxroi .btn-volt:hover{background:#dc4516}
.pxroi .btn-ghost{background:#fff;color:var(--ink);border:1px solid var(--line-2)}
.pxroi .btn-ghost:hover{border-color:var(--ink)}
.pxroi .btn-sm{padding:8px 14px;font-size:14px}
.pxroi .btn-link{background:none;border:0;color:var(--blue);font:600 15px/1.2 var(--font-body);cursor:pointer;padding:12px 6px;text-decoration:underline;text-underline-offset:3px}
.pxroi .hero{padding:34px 0 72px;text-align:center;background:linear-gradient(180deg,var(--mist) 0,#fff 420px)}
.pxroi .hero .sub{font-size:1.15rem;color:var(--muted);max-width:640px;margin:0 auto}
.pxroi .hero-pills{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:18px 0 0;padding:0;list-style:none}
.pxroi .hero-pills li{font-size:14px;font-weight:600;border-radius:999px;padding:6px 14px;background:#fff;border:1px solid var(--line);color:var(--ink-2)}
.pxroi .tool{max-width:1040px;margin:28px auto 0;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);text-align:left;background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:0 1px 2px rgba(26,21,18,.05),0 24px 48px -28px rgba(26,21,18,.35)}
.pxroi .tool-left{padding:22px;border-right:1px solid var(--line);min-width:0;display:flex;flex-direction:column}
.pxroi .tool-right{padding:22px;background:var(--mist);min-width:0}
.pxroi .ta-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}
.pxroi .ta-head label{font-weight:700;font-size:15px}
.pxroi .count{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.pxroi #prompt{width:100%;flex:1;min-height:240px;resize:vertical;padding:14px 16px;border:1px solid var(--line-2);border-radius:14px;font:16px/1.55 var(--font-body);color:var(--ink);background:#fdfcfb}
.pxroi #prompt:focus{outline:2px solid var(--blue);outline-offset:0;border-color:var(--blue);background:#fff}
.pxroi .ta-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:12px}
.pxroi .kbd-hint{font-size:13px;color:var(--muted);margin:10px 0 0}
.pxroi #tool,.pxroi .tool-right{scroll-margin-top:72px}
.pxroi kbd{font:600 12px/1 var(--font-body);border:1px solid var(--line-2);border-bottom-width:2px;border-radius:5px;padding:2px 5px;background:#fff}
.pxroi .empty{height:100%;min-height:340px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:10px;gap:4px}
.pxroi .empty h3{margin-top:12px}
.pxroi .empty p{color:var(--muted);font-size:15px;margin:0;max-width:310px}
.pxroi .empty .pending{font-size:13px;font-weight:600;color:var(--muted);margin-top:6px}
.pxroi .ring{width:132px;height:132px;flex:0 0 auto;display:block}
.pxroi .ring .track{fill:none;stroke:#ebe4de;stroke-width:11}
.pxroi .ring .val{fill:none;stroke:var(--ring,#d9d0c9);stroke-width:11;stroke-linecap:round;transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dashoffset .7s ease,stroke .3s}
.pxroi .ring text{font-family:var(--font-head);font-weight:800;fill:var(--ink)}
.pxroi .score-top{display:flex;gap:18px;align-items:center}
.pxroi .grade{display:inline-block;font-weight:700;font-size:14px;border-radius:999px;padding:4px 12px;background:var(--g-bg,#fff);color:var(--g-ink,var(--ink))}
.pxroi .verdict{margin:8px 0 2px;font-weight:600;line-height:1.4;font-size:15.5px}
.pxroi .passed{font-size:14px;color:var(--muted);margin:0}
.pxroi .g-excellent{--g-bg:var(--t-mint);--g-ink:#9e2d08;--ring:var(--ok)}
.pxroi .g-good{--g-bg:var(--t-blue);--g-ink:#c0370b;--ring:var(--blue)}
.pxroi .g-decent{--g-bg:var(--t-yellow);--g-ink:#9e2d08;--ring:var(--mid)}
.pxroi .g-needs{--g-bg:#fde4db;--g-ink:#9e2d08;--ring:#f9a98f}
.pxroi .g-poor{--g-bg:var(--t-rose);--g-ink:#9e2d08;--ring:var(--bad)}
.pxroi .rh{font:700 15px/1.3 var(--font-body);letter-spacing:0;margin:22px 0 10px}
.pxroi .breakdown{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.pxroi .breakdown li{display:grid;grid-template-columns:132px 1fr 60px;gap:10px;align-items:center;font-size:14px}
.pxroi .breakdown .bar{height:8px;background:#ebe4de;border-radius:99px;overflow:hidden}
.pxroi .breakdown .bar i{display:block;height:100%;width:0;border-radius:99px;transition:width .6s ease}
.pxroi .bar i.full{background:var(--ok)}
.pxroi .bar i.part{background:var(--mid)}
.pxroi .breakdown .bv{text-align:right;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.pxroi .breakdown .bv.zero{color:#9e2d08}
.pxroi .fixes{margin:0;padding-left:20px;display:grid;gap:8px;font-size:14.5px;color:var(--ink-2)}
.pxroi .fixes b{color:var(--ink)}
.pxroi .all-good{font-size:14.5px;color:var(--ink-2);margin:16px 0 0}
.pxroi .after-tool{max-width:1040px;margin:14px auto 0;text-align:left}
.pxroi .gate{display:grid;grid-template-columns:1.25fr 1fr;gap:26px;align-items:center;background:var(--volt);border-radius:22px;padding:26px 28px}
.pxroi .gate h3{font-size:1.35rem}
.pxroi .gate p{font-size:15px;margin:0}
.pxroi .gate form{display:grid;gap:10px}
.pxroi .gate label{font-weight:700;font-size:14px}
.pxroi .gate input[type=email]{width:100%;padding:12px 14px;border:1px solid rgba(26,21,18,.25);border-radius:12px;font:inherit;font-size:15px;background:#fff}
.pxroi .gate .fine{font-size:12.5px;color:#1a1512;line-height:1.45;margin:0}
.pxroi .gate .skip{background:none;border:0;padding:0;font:600 14px var(--font-body);color:var(--ink);text-decoration:underline;cursor:pointer;justify-self:start}
.pxroi .gate .err{font-size:13px;font-weight:600;color:#9e2d08;margin:0}
.pxroi .rewrite{background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px 26px}
.pxroi .rewrite-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px}
.pxroi .rewrite-head h3{margin:0}
.pxroi .rewrite pre{white-space:pre-wrap;font:15px/1.65 var(--font-body);background:var(--mist);border-radius:14px;padding:16px 18px;margin:0 0 10px}
.pxroi .rewrite .note{font-size:13.5px;color:var(--muted);margin:0}
.pxroi .rewrite code{background:var(--t-yellow);padding:1px 5px;border-radius:5px;font-size:.92em}
.pxroi .demo-note{font-size:12.5px;color:var(--muted);margin:8px 0 0}
.pxroi .chips{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin:20px auto 0;max-width:1040px}
.pxroi .chips span{font-size:14px;font-weight:600;color:var(--muted);margin-right:2px}
.pxroi .chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 14px;font:500 14px/1.2 var(--font-body);color:var(--ink);cursor:pointer}
.pxroi .chip:hover{border-color:var(--ink)}
.pxroi .tips{max-width:1040px;margin:30px auto 0;text-align:left}
.pxroi .tips h2{font-size:1.3rem;text-align:center;margin-bottom:14px}
.pxroi .tips ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pxroi .tips li{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px;font-size:14.5px;color:var(--ink-2);line-height:1.45}
.pxroi .tips li strong{display:block;color:var(--ink);font-size:15px;font-weight:700;margin-bottom:2px}
.pxroi .section{padding:88px 0}
.pxroi .section.tint{background:var(--mist)}
.pxroi .section.flush-top{padding-top:0}
.pxroi .section-head{text-align:center;max-width:780px;margin:0 auto 40px}
.pxroi .section-head p{color:var(--ink-2)}
.pxroi .bg-yellow{background:var(--t-yellow)}
.pxroi .bg-blue{background:var(--t-blue)}
.pxroi .bg-mint{background:var(--t-mint)}
.pxroi .bg-lilac{background:var(--t-lilac)}
.pxroi .bg-rose{background:var(--t-rose)}
.pxroi .feature{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;padding:48px 0}
.pxroi .feature.first{padding-top:0}
.pxroi .feature.reverse .feature-art{order:-1}
.pxroi .feature-art{border-radius:26px;padding:36px;display:grid;place-items:center;min-height:360px}
.pxroi .feature-copy h2{font-size:clamp(1.7rem,2.8vw,2.2rem)}
.pxroi .feature-copy p{color:var(--ink-2)}
.pxroi .feature-copy .btn{margin-top:6px}
.pxroi .chat{width:min(100%,400px);display:grid;gap:10px}
.pxroi .msg{max-width:88%;border-radius:16px;padding:10px 14px;font-size:14.5px;line-height:1.45}
.pxroi .msg.you{justify-self:end;background:var(--ink);color:#fff;border-bottom-right-radius:4px}
.pxroi .msg.ai{justify-self:start;background:#fff;border:1px solid var(--line);border-bottom-left-radius:4px;display:grid;gap:7px;width:78%}
.pxroi .msg .line{display:block;height:8px;border-radius:99px;background:#e6ded7}
.pxroi .msg .tag{justify-self:start;font-size:12px;font-weight:700;border-radius:999px;padding:2px 10px;margin-top:2px}
.pxroi .tag.bad{background:var(--t-rose);color:#9e2d08}
.pxroi .tag.good{background:var(--t-mint);color:#9e2d08}
.pxroi .weights{width:min(100%,430px);background:#fff;border-radius:18px;padding:20px 22px;border:1px solid rgba(26,21,18,.08)}
.pxroi .weights .wt{font-weight:700;font-size:15px;margin:0 0 12px}
.pxroi .w-row{display:grid;grid-template-columns:120px 1fr 26px;gap:10px;align-items:center;font-size:13.5px;margin-bottom:9px;color:var(--ink-2)}
.pxroi .w-row i{display:block;height:10px;border-radius:99px;background:var(--blue);width:var(--w)}
.pxroi .w-row b{text-align:right;color:var(--ink)}
.pxroi .w-total{margin:12px 0 0;padding-top:10px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-weight:700;font-size:14px}
.pxroi .ba{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pxroi .ba-card{border-radius:22px;padding:26px;display:flex;flex-direction:column;gap:14px}
.pxroi .ba-card h3{margin:0}
.pxroi .ba-card .quote{font:600 1.05rem/1.5 var(--font-body);background:#fff;border-radius:14px;padding:14px 16px;margin:0}
.pxroi .ba-card ul{margin:0;padding-left:18px;color:var(--ink-2);font-size:15px;display:grid;gap:4px}
.pxroi .ba-score{display:flex;align-items:center;gap:14px}
.pxroi .ba-score .ring{width:74px;height:74px}
.pxroi .ba-card .btn{align-self:flex-start;margin-top:auto}
.pxroi .ba-after{margin:24px auto 0;max-width:800px;text-align:center;color:var(--ink-2)}
.pxroi .ptypes{width:min(100%,470px);display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pxroi .ptype{background:#fff;border-radius:14px;padding:12px 14px;border:1px solid rgba(26,21,18,.08)}
.pxroi .ptype b{display:block;font-size:14px;margin-bottom:4px}
.pxroi .ptype span{font-size:14px;color:var(--ink-2);line-height:1.4;display:block}
.pxroi .accent{display:grid;grid-template-columns:1fr 1fr;border-radius:26px;overflow:hidden;background:var(--volt)}
.pxroi .accent-art{background:var(--navy);display:grid;place-items:center;padding:24px;min-height:360px}
.pxroi .accent-art svg{width:min(100%,440px);height:auto}
.pxroi .accent-body{padding:52px 48px;display:flex;flex-direction:column;justify-content:center}
.pxroi .accent-body h2{font-size:clamp(2rem,3.6vw,2.8rem)}
.pxroi .accent-body p{color:var(--ink);font-size:1.05rem}
.pxroi .accent-body p a{color:var(--ink);font-weight:600}
.pxroi .accent-body .btn{align-self:flex-start}
.pxroi .duo{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pxroi .card{border:1px solid var(--line);border-radius:22px;padding:30px;background:#fff;display:flex;flex-direction:column}
.pxroi .card p{color:var(--ink-2)}
.pxroi .card .tag{align-self:flex-start;font-size:13px;font-weight:600;border-radius:999px;padding:4px 12px;margin-bottom:14px}
.pxroi .card .btn{align-self:flex-start;margin-top:auto}
.pxroi .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.pxroi .stat{border:1px solid var(--line);border-radius:22px;padding:30px 18px;text-align:center;background:#fff}
.pxroi .stat b{display:block;font:800 clamp(2.4rem,4vw,3.2rem)/1 var(--font-head);letter-spacing:-.03em;margin-bottom:10px}
.pxroi .stat span{font-size:14.5px;color:var(--muted)}
.pxroi .worked{max-width:1000px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:22px;padding:28px}
.pxroi .worked h3{text-align:center;margin-bottom:20px}
.pxroi .worked-grid{display:grid;grid-template-columns:1fr 44px 1.7fr;gap:12px;align-items:stretch}
.pxroi .worked-grid .box{border-radius:16px;padding:18px 20px;margin:0}
.pxroi .worked-grid .lbl{font-size:13px;font-weight:700;color:var(--muted);display:block;margin-bottom:6px}
.pxroi .worked-grid .in{font:600 1.1rem/1.4 var(--font-body)}
.pxroi .worked-grid .arrow{display:grid;place-items:center;color:var(--ink)}
.pxroi .worked-grid .arrow svg{width:28px;height:28px}
.pxroi .worked-foot{text-align:center;margin-top:20px}
.pxroi .final{display:grid;grid-template-columns:1fr 1fr;border-radius:26px;overflow:hidden;background:var(--volt)}
.pxroi .final-art{background:var(--navy);padding:44px 36px;display:grid;place-items:center}
.pxroi .scorecard{background:#fff;border-radius:20px;padding:22px;width:min(100%,340px);display:grid;gap:14px}
.pxroi .scorecard .top{display:flex;align-items:center;gap:16px}
.pxroi .scorecard .ring{width:96px;height:96px}
.pxroi .scorecard .rows{display:grid;gap:8px}
.pxroi .scorecard .r{display:grid;grid-template-columns:100px 1fr;gap:10px;align-items:center;font-size:13px;color:var(--ink-2)}
.pxroi .scorecard .r i{display:block;height:7px;border-radius:99px;background:var(--ok)}
.pxroi .final-body{padding:52px 48px;display:flex;flex-direction:column;justify-content:center}
.pxroi .final-body h2{font-size:clamp(2.1rem,3.8vw,3rem)}
.pxroi .final-body p a{color:var(--ink);font-weight:600}
.pxroi .final-body .btn{align-self:flex-start;margin-top:6px}
@media (max-width:900px){
.pxroi .tool{grid-template-columns:1fr}
.pxroi .tool-left{border-right:0;border-bottom:1px solid var(--line)}
.pxroi .gate{grid-template-columns:1fr}
.pxroi .tips ul{grid-template-columns:1fr 1fr}
.pxroi .duo,.pxroi .accent,.pxroi .final,.pxroi .ba{grid-template-columns:1fr}
.pxroi .feature{grid-template-columns:1fr;gap:28px;padding:36px 0}
.pxroi .feature.reverse .feature-art{order:0}
.pxroi .feature-art{min-height:0;padding:28px}
.pxroi .stats{grid-template-columns:1fr 1fr}
.pxroi .accent-art,.pxroi .final-art{min-height:0}
.pxroi .accent-body,.pxroi .final-body{padding:36px 28px}
.pxroi .worked-grid{grid-template-columns:1fr}
.pxroi .worked-grid .arrow svg{transform:rotate(90deg)}
.pxroi .kbd-hint{display:none}
}
@media (max-width:600px){
.pxroi{font-size:16px}
.pxroi .container{padding:0 16px}
.pxroi .section{padding:64px 0}
.pxroi .tips ul{grid-template-columns:1fr}
.pxroi .breakdown li{grid-template-columns:108px 1fr 54px;font-size:13.5px}
.pxroi .ptypes{grid-template-columns:1fr}
.pxroi .score-top{gap:14px}
.pxroi .score-top .ring{width:108px;height:108px}
}
@media (prefers-reduced-motion:reduce){
.pxroi .ring .val,.pxroi .breakdown .bar i{transition:none}
}
.pxroi .form-h{font:800 1.35rem/1.2 var(--font-head);letter-spacing:-.02em;margin:0 0 4px}
.pxroi .form-sub{color:var(--muted);font-size:14.5px;margin:0 0 16px}
.pxroi .field{margin:0 0 14px;border:0;padding:0;min-width:0}
.pxroi .field>label{display:block;font-weight:700;font-size:14px;margin-bottom:6px}
.pxroi .field input[type=number],.pxroi .field input[type=text],.pxroi .field input[type=url],.pxroi .field select{width:100%;padding:11px 12px;border:1px solid var(--line-2);border-radius:10px;background:#fff;font:inherit;font-size:15px;color:var(--ink)}
.pxroi .field input:focus,.pxroi .field select:focus{outline:2px solid var(--blue);outline-offset:0;border-color:var(--blue)}
.pxroi .field .hint{font-size:12.5px;color:var(--muted);margin:5px 0 0}
.pxroi .row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pxroi .money{position:relative}
.pxroi .money>span{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--muted);font-weight:600;pointer-events:none}
.pxroi .money input{padding-left:26px!important}
.pxroi .range-row{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.pxroi .range-row output{font:800 1.15rem/1 var(--font-head);font-variant-numeric:tabular-nums}
.pxroi input[type=range]{width:100%;accent-color:var(--ink);margin:6px 0 0}
.pxroi .btn-block{width:100%}
.pxroi .form-note{font-size:12.5px;color:var(--muted);margin:10px 0 0}
.pxroi .kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pxroi .kpi{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.pxroi .kpi .k{font-size:12.5px;font-weight:700;color:var(--muted);display:block}
.pxroi .kpi .v{font:800 1.55rem/1.15 var(--font-head);letter-spacing:-.02em;display:block;margin-top:4px;font-variant-numeric:tabular-nums;color:var(--ink)}
.pxroi .kpi .s{font-size:12.5px;color:var(--muted);display:block}
.pxroi .kpi.big{grid-column:1/-1;background:var(--ink);border-color:var(--ink)}
.pxroi .kpi.big .k,.pxroi .kpi.big .s{color:#d8cfc8}
.pxroi .kpi.big .v{color:var(--volt);font-size:2.3rem}
.pxroi .res-note{font-size:13px;color:var(--muted);margin:12px 0 0}
.pxroi .list-check{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.pxroi .list-check li{padding-left:26px;position:relative;color:var(--ink-2)}
.pxroi .list-check li::before{content:"";position:absolute;left:2px;top:.42em;width:13px;height:7px;border-left:2.5px solid var(--ok);border-bottom:2.5px solid var(--ok);transform:rotate(-45deg)}
.pxroi .list-dot li::before{width:8px;height:8px;border:0;border-radius:50%;background:var(--muted);transform:none;top:.62em;left:4px}
.pxroi .tiles4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.pxroi .tile4{border-radius:20px;padding:22px}
.pxroi .tile4 p{font-size:15px;color:var(--ink-2);margin:0}
.pxroi .tiles3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.pxroi .h2-like{font-size:clamp(1.7rem,2.8vw,2.2rem);line-height:1.12;font-weight:800;margin:0 0 .45em}
.pxroi .center-copy{max-width:780px;margin:0 auto;text-align:center;color:var(--ink-2)}
.pxroi .badge{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;border-radius:999px;padding:4px 10px}
.pxroi .badge.live{background:var(--t-mint);color:#9e2d08}
.pxroi .badge.cat{background:var(--t-yellow);color:#9e2d08}
.pxroi .report{max-width:1040px;margin:14px auto 0;text-align:left;background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px}
.pxroi .report h3{margin-top:0}
.pxroi .report-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:20px}
.pxroi .report .sub-h{font:700 15px/1.3 var(--font-body);letter-spacing:0;margin:20px 0 8px}
.pxroi .scale{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin:10px 0 6px}
.pxroi .scale span{height:10px;border-radius:99px;background:#ebe4de}
.pxroi .scale span.on{background:var(--blue)}
.pxroi .scale-l{display:grid;grid-template-columns:repeat(4,1fr);font-size:12.5px;color:var(--muted)}
.pxroi .years{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.pxroi .quote-box{margin-top:18px;background:var(--mist);border-radius:18px;padding:22px}
.pxroi .quote-box h3{margin:0 0 6px}
.pxroi ol.steps{list-style:none;counter-reset:step;margin:0 0 18px;padding:0}
.pxroi ol.steps li{counter-increment:step;position:relative;padding:12px 0 12px 50px;border-bottom:1px solid var(--line);color:var(--ink-2)}
.pxroi ol.steps li:last-child{border-bottom:0}
.pxroi ol.steps li::before{content:counter(step);position:absolute;left:0;top:10px;width:34px;height:34px;border-radius:50%;background:var(--volt);color:var(--ink);font:800 16px/34px var(--font-head);text-align:center}
.pxroi .demo-shell{width:min(100%,430px)}
.pxroi .demo-ui{background:#fff;border-radius:18px;border:1px solid rgba(26,21,18,.08);box-shadow:0 22px 44px -28px rgba(26,21,18,.5);padding:18px;display:grid;gap:10px;text-align:left}
.pxroi .demo-bar{display:flex;align-items:center;justify-content:space-between;margin-top:12px}
.pxroi .demo-live{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;color:var(--ink-2)}
.pxroi .demo-live::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--bad);animation:pxroi-dblink 1.4s infinite}
@keyframes pxroi-dblink{50%{opacity:.25}}
.pxroi .demo-toggle{background:#fff;border:1px solid var(--line-2);border-radius:999px;padding:5px 12px;font:600 12.5px/1.2 var(--font-body);color:var(--ink);cursor:pointer}
.pxroi .d-label{font-size:12px;font-weight:700;color:var(--muted);display:block;margin-bottom:4px}
.pxroi .d-field{border:1px solid var(--line-2);border-radius:10px;padding:8px 12px;font-size:14px;min-height:38px;background:#fdfcfb;color:var(--ink);transition:border-color .2s,box-shadow .2s,background .2s}
.pxroi .d-field.is-focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(244,83,31,.18);background:#fff}
.pxroi .d-field.is-focus .typed::after{content:"";display:inline-block;width:1.5px;height:1em;background:var(--ink);margin-left:1px;vertical-align:-2px;animation:pxroi-dblink 1s steps(1) infinite}
.pxroi .d-btn{background:var(--ink);color:#fff;border-radius:999px;padding:10px;text-align:center;font-weight:600;font-size:14.5px;transition:transform .15s,background .15s}
.pxroi .d-btn.is-pressed{transform:scale(.95);background:#2e2620}
.pxroi .d-grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pxroi .d-kpi{border-radius:12px;padding:10px 12px;background:var(--mist)}
.pxroi .d-kpi b{display:block;font:800 1.2rem/1.2 var(--font-head);font-variant-numeric:tabular-nums}
.pxroi .d-kpi span{font-size:11.5px;font-weight:700;color:var(--muted)}
.pxroi .fade-in{opacity:0;transform:translateY(6px);transition:opacity .35s ease,transform .35s ease}
.pxroi .fade-in.show{opacity:1;transform:none}
.pxroi ol.steps li{transition:color .25s}
.pxroi ol.steps li::before{transition:background .25s,color .25s}
.pxroi ol.steps li.is-on{color:var(--ink)}
.pxroi ol.steps li.is-on::before{background:var(--ink);color:var(--volt)}
@media (max-width:900px){
.pxroi .report-grid,.pxroi .years{grid-template-columns:1fr 1fr}
.pxroi .tiles4{grid-template-columns:1fr 1fr}
.pxroi .tiles3{grid-template-columns:1fr}
}
@media (max-width:600px){
.pxroi .tiles4,.pxroi .row2{grid-template-columns:1fr}
.pxroi .kpis{grid-template-columns:1fr 1fr}
}
@media (prefers-reduced-motion:reduce){
.pxroi .demo-live::before{animation:none}
.pxroi .d-field.is-focus .typed::after{display:none}
.pxroi .fade-in{transition:none}
}
.pxroi{--brand:#f4531f;--brand-strong:#d63d0c;--brand-deep:#c0370b}
.pxroi a{color:var(--brand-deep)}
.pxroi :focus-visible{outline-color:var(--brand-strong)}
.pxroi .btn-primary{background:var(--brand-strong);color:#fff}
.pxroi .btn-primary:hover{background:#b8330a}
.pxroi .btn-volt{background:var(--brand-strong);color:#fff}
.pxroi .btn-volt:hover{background:#b8330a}
.pxroi .accent .btn-primary,.pxroi .final .btn-primary,.pxroi .gate .btn-primary{background:var(--ink);color:#fff}
.pxroi .accent .btn-primary:hover,.pxroi .final .btn-primary:hover,.pxroi .gate .btn-primary:hover{background:#2e2620}
.pxroi .demo-live::before{background:var(--brand)}
.pxroi .d-btn{background:var(--brand-strong)}
.pxroi .d-btn.is-pressed{background:#b8330a}
.pxroi input[type=range],.pxroi .toggle input{accent-color:var(--brand-strong)}
.pxroi .d-track i{background:var(--brand-strong)}
.pxroi .d-thumb{border-color:var(--brand-strong)}
.pxroi .mail-row{display:flex;gap:8px}
.pxroi .mail-row input{flex:1;min-width:0;padding:10px 12px;border:1px solid var(--line-2);border-radius:10px;font:inherit;font-size:15px}
.pxroi .counted{margin-top:0}
.pxroi .counted .card h3{font-size:1.1rem}
.pxroi .consult{margin-top:14px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;background:var(--navy);color:#fff;border-radius:18px;padding:18px 22px}
.pxroi .consult p{margin:0;font-weight:600}
.pxroi .inputs-art{width:min(100%,380px);display:grid;gap:10px}
.pxroi .inputs-art div{background:#fff;border-radius:14px;padding:12px 14px;display:flex;align-items:center;gap:12px;font-weight:600;font-size:15px;border:1px solid rgba(26,21,18,.08)}
.pxroi .inputs-art span{flex:0 0 28px;height:28px;border-radius:50%;background:var(--volt);display:grid;place-items:center;font:800 14px var(--font-head)}
.pxroi .inputs-art b{margin-left:auto;font:800 1rem var(--font-head);color:var(--blue)}
.pxroi .four-out{margin:0 auto;max-width:1000px;align-items:stretch}
.pxroi .four-out .sep{display:none}
.pxroi .four-out .tile4,.pxroi .who-tiles .tile4{display:flex;align-items:center;font:800 1.15rem/1.3 var(--font-head);letter-spacing:-.01em;min-height:110px}
.pxroi .four-out .tile4:last-of-type{outline:3px solid var(--ink);outline-offset:-3px}
.pxroi .who-tiles{max-width:1000px;margin:0 auto}
.pxroi .who-tiles .tile4{font:600 1.05rem/1.4 var(--font-body);color:var(--ink)}
.pxroi .d-track{position:relative;height:8px;border-radius:99px;background:#ebe4de;margin-top:10px}
.pxroi .d-track i{position:absolute;left:0;top:0;bottom:0;background:var(--ink);border-radius:99px;width:45%}
.pxroi .d-thumb{position:absolute;top:50%;left:45%;width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid var(--ink);transform:translate(-50%,-50%)}
.pxroi .d-run{font-size:13px;font-weight:700;color:var(--blue)}
.pxroi .d-verdict{background:var(--t-mint);color:#9e2d08;border-radius:10px;padding:8px 12px;font-weight:700;font-size:14px;text-align:center}
.pxroi .d-kpi.d-dark{background:var(--ink)}
.pxroi .d-kpi.d-dark span{color:#d8cfc8}
.pxroi .d-kpi.d-dark b{color:var(--volt);font-size:1.45rem}
.pxroi .backlog{background:#fff;border-radius:20px;padding:22px;width:min(100%,360px);display:grid;gap:10px}
.pxroi .bl-h{margin:0 0 4px;font:800 1.2rem/1.2 var(--font-head)}
.pxroi .bl-row{display:flex;align-items:center;gap:12px;font-weight:600;font-size:15px;background:var(--mist);border-radius:12px;padding:12px 14px}
.pxroi .bl-row i{flex:0 0 22px;height:22px;border-radius:50%;background:var(--ok);position:relative}
.pxroi .bl-row i::after{content:"";position:absolute;left:6px;top:6px;width:9px;height:5px;border-left:2.5px solid #fff;border-bottom:2.5px solid #fff;transform:rotate(-45deg)}
.pxroi .flow{margin-top:12px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 14px}
.pxroi .flow-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.pxroi .flow-head .k{font-size:12.5px;font-weight:700;color:var(--muted)}
.pxroi .flow-live{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--blue)}
.pxroi .flow-live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--volt);animation:pxroi-dblink 1.4s infinite}
.pxroi #flowCv{display:block;width:100%;height:140px}
.pxroi .flow-legend{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 14px;font-size:13px;color:var(--ink-2);margin-top:6px}
.pxroi .flow-legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:-1px}
.pxroi .fl-bot i{background:var(--volt)}
.pxroi .fl-agent i{background:var(--ink)}
.pxroi .flow-legend b{color:var(--ink);font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){
.pxroi .flow-live::before{animation:none}
}
.pxroi .range-row label{font-weight:700;font-size:14px}
.pxroi .section{content-visibility:auto;contain-intrinsic-size:auto 640px}
.pxroi #tool,.pxroi .hero{content-visibility:visible}
.pxroi .tool-right .kpi .v,.pxroi .flow-legend b{contain:layout style}
.pxroi #flowCv{contain:layout paint}
@media (prefers-reduced-motion: no-preference){
.pxroi .rv{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--rd,0) * 1ms)}
.pxroi .rv.is-in{opacity:1;transform:none}
.pxroi .rv-zoom{opacity:0;transform:translateY(28px) scale(.985);transition:opacity .9s ease,transform 1.1s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--rd,0) * 1ms)}
.pxroi .rv-zoom.is-in{opacity:1;transform:none}
.pxroi .kpi .v{transition:color .3s ease}
.pxroi .kpi.is-tick{animation:pxroi-kpi-tick .5s cubic-bezier(.34,1.56,.64,1)}
@keyframes pxroi-kpi-tick{0%{transform:scale(1)}35%{transform:scale(1.035)}100%{transform:scale(1)}}
.pxroi .flow-live{position:relative}
.pxroi .flow-live::after{content:"";display:inline-block;width:6px;height:6px;margin-left:6px;border-radius:50%;background:currentColor;animation:pxroi-live-pulse 1.8s ease-in-out infinite;vertical-align:1px}
@keyframes pxroi-live-pulse{0%,100%{opacity:.35}50%{opacity:1}}
}
.pxroi .kpi .v{font-variant-numeric:tabular-nums}
.pxroi .flow-legend b{font-variant-numeric:tabular-nums}
