/* Vistorio Interactive Demo Experience */
.xd-hero-title{margin:0 0 1rem;line-height:1.05;letter-spacing:-0.045em}
.xd-hero-title span{display:block;font-weight:800;color:var(--ink)}
.xd-hero-title span:nth-child(1){font-size:clamp(2.25rem,5vw,3.5rem)}
.xd-hero-title span:nth-child(2){font-size:clamp(1.15rem,2.5vw,1.65rem);color:var(--red);font-weight:700;margin-top:.35rem}
.xd-hero-tagline{font-size:.95rem;font-weight:600;color:var(--muted);margin:0 0 1.25rem;max-width:28rem;line-height:1.5}
.xd-hero-tagline em{font-style:normal;color:var(--ink);font-weight:700}
.xd-hero-scene{position:relative;min-height:420px}
.xd-devices{position:relative;width:min(100%,460px);margin:0 auto}
.xd-laptop{background:var(--ink);border-radius:16px 16px 0 0;padding:.65rem .65rem 0;box-shadow:var(--shadow-lg)}
.xd-laptop__screen{background:#0a0e12;border-radius:10px 10px 0 0;overflow:hidden;min-height:220px}
.xd-laptop__chrome{display:flex;gap:.35rem;padding:.5rem .65rem;background:rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.06)}
.xd-laptop__chrome span{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.15)}
.xd-laptop__body{padding:.85rem}
.xd-laptop__kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:.45rem;margin-bottom:.65rem}
.xd-laptop__kpi{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:.55rem}
.xd-laptop__kpi label{display:block;font-size:.48rem;font-weight:600;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:.1rem}
.xd-laptop__kpi b{font-size:.78rem;font-weight:800;color:#fff}
.xd-laptop__chart{height:56px;border-radius:8px;background:rgba(255,255,255,.03)}
.xd-laptop__chart svg{width:100%;height:100%}
.xd-laptop__base{height:12px;background:linear-gradient(180deg,#2a2f38,#1a1f26);border-radius:0 0 12px 12px;width:108%;margin-left:-4%}
.xd-phone-float{position:absolute;right:-8%;bottom:8%;width:120px;background:#0a0e12;border-radius:20px;padding:.4rem;box-shadow:0 20px 50px rgba(0,0,0,.35);border:2px solid rgba(255,255,255,.08);animation:hp-float-card 7s ease-in-out infinite}
.xd-phone-float__screen{background:var(--surface);border-radius:14px;padding:.55rem;min-height:140px}
.xd-phone-float__screen strong{display:block;font-size:.58rem;margin-bottom:.4rem}
.xd-phone-float__row{font-size:.55rem;font-weight:600;padding:.35rem;background:var(--page);border-radius:6px;margin-bottom:.3rem}
.xd-float-mod{position:absolute;font-size:.62rem;font-weight:700;padding:.35rem .65rem;border-radius:999px;background:rgba(255,255,255,.96);border:1px solid var(--line);box-shadow:var(--shadow-sm);animation:hp-float-card 6s ease-in-out infinite}
.xd-float-mod--1{top:5%;left:0;animation-delay:-1s}
.xd-float-mod--2{top:30%;left:-6%;animation-delay:-2s}
.xd-float-mod--3{bottom:25%;left:-4%;animation-delay:-3s}
@media(max-width:1023px){.xd-float-mod,.xd-phone-float{display:none}}
.xd-band--calm{background:var(--page-muted)}
.xd-band--dark{background:var(--ink);color:#fff}
.xd-band--dark .hp-eyebrow{color:rgba(255,255,255,.5)}
.xd-band--dark .hp-h2{color:#fff}
.xd-band--dark .hp-lede{color:rgba(255,255,255,.65)}
.xd-select-grid{display:grid;gap:.85rem;grid-template-columns:repeat(auto-fill,minmax(9.5rem,1fr))}
.xd-select-grid--roles{grid-template-columns:repeat(auto-fill,minmax(11rem,1fr))}
.xd-select-card{padding:1.15rem 1rem;background:var(--surface);border:2px solid var(--line);border-radius:16px;text-align:center;cursor:pointer;transition:transform .25s var(--ease),border-color .25s,box-shadow .25s;font-family:inherit;width:100%}
.xd-select-card:hover{transform:translateY(-3px);border-color:rgba(177,18,38,.25);box-shadow:var(--shadow-md)}
.xd-select-card.is-selected{border-color:var(--red);background:var(--red-soft);box-shadow:0 0 0 1px rgba(177,18,38,.15)}
.xd-select-card__icon{font-size:1.5rem;margin-bottom:.5rem}
.xd-select-card strong{display:block;font-size:.85rem;font-weight:800;color:var(--ink)}
.xd-select-hint{text-align:center;margin-top:1rem;font-size:.82rem;font-weight:600;color:var(--muted)}
.xd-select-hint b{color:var(--red)}
.xd-workspace{background:var(--ink);border-radius:24px;padding:clamp(1rem,3vw,1.5rem);box-shadow:var(--shadow-lg)}
.xd-workspace__bar{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.85rem;border-bottom:1px solid rgba(255,255,255,.08)}
.xd-workspace__bar h3{margin:0;font-size:.85rem;color:#fff}
.xd-workspace__meta{font-size:.68rem;color:rgba(255,255,255,.45)}
.xd-workspace__meta b{color:var(--success)}
.xd-kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;margin-bottom:1rem}
@media(max-width:768px){.xd-kpi-grid{grid-template-columns:repeat(2,1fr)}}
.xd-kpi{background:rgba(255,255,255,.05);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:.85rem;cursor:pointer;transition:transform .2s var(--ease),border-color .2s,background .2s;text-align:left;font-family:inherit;color:inherit;width:100%}
.xd-kpi:hover,.xd-kpi.is-active{transform:translateY(-2px);border-color:rgba(177,18,38,.45);background:rgba(177,18,38,.08)}
.xd-kpi label{display:block;font-size:.55rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:rgba(255,255,255,.42);margin-bottom:.25rem}
.xd-kpi strong{display:block;font-size:1rem;font-weight:800;color:#fff}
.xd-kpi strong.up{color:var(--success)}
.xd-kpi strong.warn{color:var(--warn)}
.xd-insight{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:1rem 1.15rem;min-height:4.5rem}
.xd-insight__label{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--red);margin-bottom:.35rem}
.xd-insight p{margin:0;font-size:.85rem;color:rgba(255,255,255,.75);line-height:1.5}
.xd-modules{display:grid;gap:.85rem;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr))}
.xd-module{padding:1.15rem;background:var(--surface);border:1px solid var(--line);border-radius:16px;cursor:pointer;transition:transform .25s var(--ease),border-color .25s;text-align:left;font-family:inherit;width:100%}
.xd-module:hover,.xd-module.is-active{transform:translateY(-3px);border-color:rgba(177,18,38,.3);box-shadow:var(--shadow-md)}
.xd-module.is-active{background:var(--red-soft)}
.xd-module__icon{font-size:1.35rem;margin-bottom:.5rem}
.xd-module strong{display:block;font-size:.82rem;font-weight:800;color:var(--ink)}
.xd-module-preview{margin-top:1.5rem;background:var(--ink);border-radius:18px;padding:1.25rem;min-height:160px}
.xd-module-preview h4{margin:0 0 .5rem;font-size:.78rem;color:#fff}
.xd-module-preview p{margin:0;font-size:.82rem;color:rgba(255,255,255,.65);line-height:1.55}
.xd-module-preview ul{margin:.75rem 0 0;padding:0;list-style:none;display:grid;gap:.35rem}
.xd-module-preview li{font-size:.75rem;color:rgba(255,255,255,.55);padding-left:1rem;position:relative}
.xd-module-preview li::before{content:'?';position:absolute;left:0;color:var(--red)}
.xd-scenario-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}
.xd-scenario-tab{font-size:.75rem;font-weight:700;padding:.5rem .9rem;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--muted);cursor:pointer;font-family:inherit}
.xd-scenario-tab.is-active{background:var(--ink);border-color:var(--ink);color:#fff}
.xd-scenario-panel{display:none;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:1.5rem;box-shadow:var(--shadow-md)}
.xd-scenario-panel.is-active{display:block}
.xd-scenario-panel h3{margin:0 0 .5rem;font-size:1.05rem;font-weight:800}
.xd-scenario-panel>p{margin:0 0 1.25rem;font-size:.88rem;color:var(--muted);line-height:1.5}
.xd-steps{display:grid;gap:.65rem}
.xd-step{display:grid;grid-template-columns:2rem 1fr;gap:.75rem;align-items:start;padding:.75rem;background:var(--page);border-radius:12px;opacity:.45;transition:opacity .35s var(--ease),background .35s}
.xd-step.is-visible{opacity:1;background:var(--red-soft)}
.xd-step__num{width:2rem;height:2rem;border-radius:50%;background:var(--ink);color:#fff;font-size:.72rem;font-weight:800;display:grid;place-items:center}
.xd-step.is-visible .xd-step__num{background:var(--red)}
.xd-step strong{display:block;font-size:.85rem;margin-bottom:.15rem}
.xd-step span{font-size:.78rem;color:var(--muted);line-height:1.45}
.xd-compare{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:700px){.xd-compare{grid-template-columns:1fr}}
.xd-compare-card{padding:1.5rem;border-radius:18px;border:1px solid var(--line)}
.xd-compare-card--before{background:#f1f3f6}
.xd-compare-card--after{background:var(--ink);color:#fff;border-color:var(--ink)}
.xd-compare-card h3{margin:0 0 1rem;font-size:.95rem;font-weight:800}
.xd-compare-card ul{margin:0;padding:0;list-style:none;display:grid;gap:.55rem}
.xd-compare-card li{font-size:.82rem;line-height:1.45;padding-left:1.25rem;position:relative}
.xd-compare-card--before li::before{content:'?';position:absolute;left:0;color:#94a3b8;font-weight:700}
.xd-compare-card--after li::before{content:'?';position:absolute;left:0;color:var(--success);font-weight:800}
.xd-mobile-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:2rem;align-items:center}
@media(max-width:900px){.xd-mobile-layout{grid-template-columns:1fr}}
.xd-phones{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.xd-phone{width:160px;background:#0a0e12;border-radius:24px;padding:.5rem;box-shadow:0 24px 60px rgba(0,0,0,.4);border:2px solid rgba(255,255,255,.08)}
.xd-phone--2{transform:translateY(1.5rem)}
.xd-phone__screen{background:var(--surface);border-radius:18px;overflow:hidden;min-height:260px}
.xd-phone__header{padding:.75rem;background:var(--ink);color:#fff}
.xd-phone__header strong{display:block;font-size:.72rem}
.xd-phone__header span{font-size:.58rem;color:rgba(255,255,255,.5)}
.xd-phone__body{padding:.65rem}
.xd-phone__row{padding:.5rem .6rem;margin-bottom:.4rem;background:var(--page);border:1px solid var(--line);border-radius:8px;font-size:.65rem;font-weight:600}
.xd-mobile-list{list-style:none;margin:1.25rem 0 0;padding:0;display:grid;gap:.5rem}
.xd-mobile-list li{font-size:.88rem;font-weight:600;color:rgba(255,255,255,.85);padding-left:1.25rem;position:relative}
.xd-mobile-list li::before{content:'?';position:absolute;left:0;color:var(--success);font-weight:800}
.xd-qa-grid{display:grid;gap:.75rem}
.xd-qa{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:center;padding:1rem 1.15rem;background:var(--surface);border:1px solid var(--line);border-radius:14px}
.xd-qa:hover{border-color:rgba(177,18,38,.2)}
@media(max-width:640px){.xd-qa{grid-template-columns:1fr}}
.xd-qa__q{font-size:.88rem;font-weight:700;color:var(--ink);line-height:1.45}
.xd-qa__a{font-size:.82rem;font-weight:600;color:var(--success);padding:.65rem .85rem;background:rgba(13,122,78,.08);border-radius:10px}
.xd-diff{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:700px){.xd-diff{grid-template-columns:1fr}}
.xd-diff-card{padding:1.5rem;border-radius:18px;border:1px solid var(--line)}
.xd-diff-card--vistorio{background:var(--ink);color:#fff;border-color:var(--ink)}
.xd-diff-card--old{background:var(--surface)}
.xd-diff-card h3{margin:0 0 1rem;font-size:.95rem;font-weight:800}
.xd-diff-card ul{margin:0;padding:0;list-style:none;display:grid;gap:.5rem}
.xd-diff-card li{font-size:.82rem;line-height:1.45;padding-left:1.15rem;position:relative}
.xd-diff-card--vistorio li::before{content:'?';position:absolute;left:0;color:var(--success);font-weight:800}
.xd-diff-card--old li::before{content:'�';position:absolute;left:0;color:var(--muted)}
.xd-final{padding:clamp(3rem,8vw,5rem) 0;background:var(--ink)}
.xd-final__layout{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:start}
@media(max-width:900px){.xd-final__layout{grid-template-columns:1fr}}
.xd-final .hp-h2{color:#fff}
.xd-final .hp-lede{color:rgba(255,255,255,.65)}
.xd-form-panel{background:rgba(255,255,255,.98);border-radius:20px;padding:1.5rem;box-shadow:var(--shadow-lg)}
.xd-form-panel h3{margin:0 0 .35rem;font-size:1.1rem;font-weight:800}
.xd-form-panel>p{margin:0 0 1.25rem;font-size:.82rem;color:var(--muted)}
.xd-form .mk-field{margin-bottom:.85rem}
.xd-form .mk-field label{display:block;font-size:.72rem;font-weight:700;margin-bottom:.3rem;color:var(--ink)}
.xd-form .mk-field input,.xd-form .mk-field select,.xd-form .mk-field textarea{width:100%;padding:.6rem .75rem;border:1px solid var(--line);border-radius:10px;font-family:inherit;font-size:.85rem}
.xd-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:.85rem}
@media(max-width:500px){.xd-form-grid{grid-template-columns:1fr}}
.xd-module-preview a.mk-btn-xl--outline {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.35);
  color: #fff;
}
.xd-module-preview a.mk-btn-xl--outline:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.85);
  color: #fff;
}
.xd-hero-scene{display:flex;align-items:center;justify-content:center}