:root {
      --cyan: #00d5ff;
      --green: #00ff9c;
      --blue: #006bff;
      --bg: #02040a;
      --glass: rgba(5, 18, 31, .78);
      --border: rgba(0, 213, 255, .2);
      --text: #e8fbff;
      --muted: rgba(232, 251, 255, .65);
      --ease-out-expo: cubic-bezier(.16, 1, .3, 1);
      --ease-in-out-back: cubic-bezier(.68, -.55, .265, 1.55);
    }
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; }
    body {
      font-family: 'Vazirmatn', system-ui, sans-serif;
      background: var(--bg);
      color: var(--text);
      min-height: 100vh;
      overflow-x: hidden;
      line-height: 1.75;
    }
    .ltr { direction: ltr; text-align: left; }

    /* ── Background layers ── */
    #binBg { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
    .grid-bg {
      position: fixed; inset: 0; z-index: 1; pointer-events: none; opacity: .35;
      background-image:
        linear-gradient(rgba(0,213,255,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0,213,255,.05) 1px, transparent 1px);
      background-size: 48px 48px;
      mask-image: linear-gradient(to bottom, black 40%, transparent 95%);
    }
    .scanline {
      position: fixed; inset: 0; z-index: 2; pointer-events: none;
      background: linear-gradient(to bottom, transparent, rgba(0,213,255,.04), transparent);
      animation: scan 8s linear infinite;
    }
    @keyframes scan { 0% { transform: translateY(-120%); } 100% { transform: translateY(120%); } }
    .orb { position: fixed; border-radius: 50%; filter: blur(100px); z-index: 0; pointer-events: none; }
    .orb--cyan { top: -20%; left: -15%; width: 32rem; height: 32rem; background: rgba(0,213,255,.15); }
    .orb--blue { bottom: -10%; right: -15%; width: 38rem; height: 38rem; background: rgba(0,107,255,.12); }
    .noise::before {
      content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 50;
      background-image: url('data:image/svg+xml,%3Csvg viewBox="0 0 160 160" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="n"%3E%3CfeTurbulence type="fractalNoise" baseFrequency=".9" numOctaves="4" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23n)" opacity=".35"/%3E%3C/svg%3E');
      opacity: .04; mix-blend-mode: screen;
    }

    /* ── Shell ── */
    .shell { position: relative; z-index: 10; max-width: 52rem; margin: 0 auto; padding: 1.25rem 1rem 3rem; }
    @media (min-width: 640px) { .shell { padding: 2rem 1.5rem 4rem; } }

    /* ── Header ── */
    .header { text-align: center; margin-bottom: 2rem; }

    .header__brand {
      display: flex; justify-content: center;
      animation: fadeSlideDown .8s var(--ease-out-expo) both;
    }
    .header__logo-wrap {
      display: inline-flex; align-items: center; justify-content: center;
      padding: .7rem 1.35rem; border-radius: 1.1rem;
      background: linear-gradient(160deg, rgba(255,255,255,.95) 0%, rgba(228,245,255,.9) 55%, rgba(200,235,255,.85) 100%);
      border: 1px solid rgba(0,213,255,.28);
      box-shadow:
        0 0 0 1px rgba(255,255,255,.15) inset,
        0 0 35px rgba(0,213,255,.22),
        0 0 70px rgba(0,107,255,.14),
        0 8px 32px rgba(0,0,0,.35);
      position: relative;
    }
    .header__logo-wrap::before {
      content: ""; position: absolute; inset: -2px; border-radius: inherit; z-index: -1;
      background: linear-gradient(135deg, rgba(0,213,255,.45), rgba(0,255,156,.25), rgba(0,107,255,.35));
      filter: blur(10px); opacity: .65;
    }
    .header__logo {
      height: clamp(2.1rem, 7vw, 2.85rem); width: auto; display: block;
    }
    .header__sub {
      color: var(--muted); font-size: .92rem; margin-top: 1rem; line-height: 1.85;
      animation: fadeSlideDown .8s .12s var(--ease-out-expo) both;
    }
    .header__intro {
      margin-top: 1.15rem; padding: 1rem 1.15rem; border-radius: 1rem;
      text-align: right; line-height: 1.9;
      animation: fadeSlideDown .8s .22s var(--ease-out-expo) both;
    }
    .header__intro p {
      font-size: .88rem; color: rgba(232,251,255,.82); margin: 0;
    }
    .header__pills {
      display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .85rem;
      justify-content: center;
    }
    .header__pill {
      padding: .35rem .75rem; border-radius: 999px;
      font-size: .72rem; font-weight: 600; color: rgba(232,251,255,.78);
      background: rgba(0,213,255,.07); border: 1px solid rgba(0,213,255,.16);
    }

    @keyframes fadeSlideDown {
      from { opacity: 0; transform: translateY(-20px) scale(.96); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }

    /* ── Glass card ── */
    .glass {
      background: linear-gradient(135deg, rgba(5,18,31,.93), rgba(4,8,15,.96));
      border: 1px solid var(--border);
      backdrop-filter: blur(20px);
      border-radius: 1.25rem;
      box-shadow: 0 0 40px rgba(0,195,255,.08), inset 0 1px 0 rgba(255,255,255,.04);
    }
    @media (max-width: 639px) {
      .grid-bg { opacity: .16; }
      .scanline { opacity: .45; }
      .orb--cyan { opacity: .55; }
      .orb--blue { opacity: .45; }
      .shell .glass,
      .qa-item.glass {
        background: linear-gradient(135deg, rgba(5,18,31,.72), rgba(4,8,15,.78));
        backdrop-filter: blur(10px);
        box-shadow: 0 0 28px rgba(0,195,255,.1), inset 0 1px 0 rgba(255,255,255,.05);
      }
      .qa-item.is-open {
        box-shadow: 0 0 24px rgba(0,213,255,.16), 0 8px 28px rgba(0,0,0,.28);
      }
      .wizard-panel.glass {
        background: linear-gradient(135deg, rgba(5,18,31,.92), rgba(4,8,15,.95));
        backdrop-filter: blur(18px);
      }
    }

    /* ── Q&A Accordion ── */
    .qa-list { display: flex; flex-direction: column; gap: .75rem; }
    .qa-item {
      overflow: hidden;
      transition: border-color .3s, box-shadow .3s;
      animation: cardIn .6s var(--ease-out-expo) both;
    }
    .qa-item.qa-entered { animation: none; opacity: 1; transform: none; filter: none; }
    .qa-item:nth-child(1) { animation-delay: .15s; }
    .qa-item:nth-child(2) { animation-delay: .25s; }
    .qa-item:nth-child(3) { animation-delay: .35s; }
    .qa-item:nth-child(4) { animation-delay: .45s; }
    @keyframes cardIn {
      from { opacity: 0; transform: translateX(30px) rotateY(-8deg); filter: blur(4px); }
      to { opacity: 1; transform: translateX(0) rotateY(0); filter: blur(0); }
    }
    .qa-item.is-open {
      border-color: rgba(0,213,255,.45);
      box-shadow: 0 0 30px rgba(0,213,255,.12), 0 8px 32px rgba(0,0,0,.3);
    }
    .qa-trigger {
      width: 100%; display: flex; align-items: center; gap: .75rem;
      padding: 1rem 1.15rem; background: none; border: none; cursor: pointer;
      color: var(--text); font-family: inherit; font-size: .95rem; font-weight: 600;
      text-align: right; transition: color .2s;
    }
    .qa-trigger:hover { color: var(--cyan); }
    .qa-trigger__icon {
      flex-shrink: 0; width: 2rem; height: 2rem; border-radius: .5rem;
      display: flex; align-items: center; justify-content: center;
      background: rgba(0,213,255,.1); border: 1px solid rgba(0,213,255,.2);
      font-family: 'JetBrains Mono', monospace; font-size: .7rem; color: var(--cyan);
      transition: transform .5s var(--ease-in-out-back), background .3s;
    }
    .qa-item.is-open .qa-trigger__icon {
      transform: rotate(90deg) scale(1.1);
      background: rgba(0,255,156,.15); color: var(--green); border-color: rgba(0,255,156,.3);
    }
    .qa-trigger__chevron {
      margin-right: auto; transition: transform .5s var(--ease-in-out-back);
      color: var(--muted); font-size: .8rem;
    }
    .qa-item.is-open .qa-trigger__chevron { transform: rotate(180deg); color: var(--cyan); }
    .qa-body {
      display: grid; grid-template-rows: 0fr;
      transition: grid-template-rows .55s var(--ease-out-expo);
    }
    .qa-item.is-open .qa-body { grid-template-rows: 1fr; }
    .qa-body__inner {
      overflow: hidden;
      min-height: 0;
      opacity: 0;
      transform: translateY(-6px);
      transition: opacity .35s ease, transform .35s var(--ease-out-expo);
    }
    .qa-item.is-open .qa-body__inner {
      opacity: 1;
      transform: translateY(0);
      transition: opacity .35s .08s ease, transform .35s .08s var(--ease-out-expo);
    }
    .qa-content {
      padding: 0 1.15rem 1.15rem;
      color: var(--muted); font-size: .88rem; line-height: 1.9;
    }
    .qa-content p + p { margin-top: .6rem; }
    .qa-content ul { margin: .5rem 1.2rem 0 0; }
    .qa-content li { margin-bottom: .35rem; }
    .qa-content .highlight {
      color: var(--cyan); font-weight: 600;
      padding: .6rem .8rem; border-radius: .6rem;
      background: rgba(0,213,255,.06); border: 1px solid rgba(0,213,255,.15);
      margin-top: .75rem;
    }

    /* ── CTA ── */
    .cta-section {
      margin-top: 2rem; text-align: center;
      animation: cardIn .6s .55s var(--ease-out-expo) both;
    }
    .cta-btn {
      display: inline-flex; align-items: center; gap: .7rem;
      padding: .8rem 1.35rem; border-radius: .7rem; cursor: pointer;
      font-family: inherit; font-size: .88rem; font-weight: 600;
      color: rgba(232, 251, 255, .92);
      background: rgba(4, 12, 22, .94);
      border: 1px solid rgba(0, 213, 255, .28);
      box-shadow: 0 0 0 1px rgba(0, 213, 255, .06) inset, 0 8px 28px rgba(0, 0, 0, .4);
      transition: border-color .25s, box-shadow .25s, transform .25s;
      position: relative;
    }
    .cta-btn__prefix {
      font-family: "JetBrains Mono", monospace;
      font-size: .68rem; font-weight: 600; letter-spacing: .08em;
      color: rgba(0, 213, 255, .85);
      padding: .22rem .5rem; border-radius: .35rem;
      border: 1px solid rgba(0, 213, 255, .22);
      background: rgba(0, 213, 255, .05);
    }
    .cta-btn:hover {
      border-color: rgba(0, 213, 255, .48);
      box-shadow: 0 0 18px rgba(0, 107, 255, .12), 0 0 0 1px rgba(0, 213, 255, .1) inset;
      transform: translateY(-1px);
    }
    .cta-btn:active { transform: translateY(0); }

    /* ── Wizard overlay ── */
    .wizard-overlay {
      position: fixed; inset: 0; z-index: 200;
      background: rgba(2,4,10,.85); backdrop-filter: blur(12px);
      display: flex; align-items: flex-end; justify-content: center;
      opacity: 0; visibility: hidden;
      transition: opacity .4s, visibility .4s;
    }
    .wizard-overlay.is-active { opacity: 1; visibility: visible; }
    @media (min-width: 640px) {
      .wizard-overlay { align-items: center; padding: 1.5rem; }
    }
    .wizard-panel {
      width: 100%; max-width: 32rem; max-height: 92vh; overflow-y: auto;
      border-radius: 1.5rem 1.5rem 0 0;
      transform: translateY(100%) scale(.92);
      transition: transform .6s var(--ease-out-expo);
      position: relative;
    }
    @media (min-width: 640px) {
      .wizard-panel { border-radius: 1.5rem; transform: translateY(40px) scale(.92); }
    }
    .wizard-overlay.is-active .wizard-panel { transform: translateY(0) scale(1); }
    .wizard-panel__head {
      display: flex; align-items: center; justify-content: space-between;
      padding: 1.15rem 1.25rem; border-bottom: 1px solid var(--border);
      position: sticky; top: 0; background: inherit; z-index: 5;
      border-radius: 1.5rem 1.5rem 0 0;
    }
    .wizard-panel__title { font-weight: 800; font-size: 1.05rem; }
    .wizard-close {
      width: 2.2rem; height: 2.2rem; border-radius: .6rem; border: 1px solid var(--border);
      background: rgba(0,0,0,.3); color: var(--muted); cursor: pointer; font-size: 1.1rem;
      transition: background .2s, color .2s, transform .3s var(--ease-in-out-back);
    }
    .wizard-close:hover { background: rgba(255,60,60,.15); color: #ff6b6b; transform: rotate(90deg); }
    .wizard-panel__body {
      padding: 1.25rem;
      perspective: 1400px;
      position: relative;
      min-height: 10rem;
      overflow: hidden;
    }
    .wizard-stage {
      position: relative;
      transform-style: preserve-3d;
      min-height: 6rem;
    }

    /* ── Step transitions (directional 3D) ── */
    .wizard-step {
      display: none;
      transform-origin: 50% 50%;
      backface-visibility: hidden;
      will-change: transform, opacity, filter;
    }
    .wizard-step.is-visible { display: block; }

    .wizard-step.is-entering-forward {
      display: block;
      animation: wizEnterFwd .7s cubic-bezier(.16, 1, .3, 1) both;
    }
    .wizard-step.is-exiting-forward {
      display: block; position: absolute; inset: 0; width: 100%;
      pointer-events: none; z-index: 1;
      animation: wizExitFwd .55s cubic-bezier(.4, 0, .2, 1) both;
    }
    .wizard-step.is-entering-back {
      display: block;
      animation: wizEnterBack .7s cubic-bezier(.16, 1, .3, 1) both;
    }
    .wizard-step.is-exiting-back {
      display: block; position: absolute; inset: 0; width: 100%;
      pointer-events: none; z-index: 1;
      animation: wizExitBack .55s cubic-bezier(.4, 0, .2, 1) both;
    }

    @keyframes wizEnterFwd {
      0% {
        opacity: 0;
        transform: translateX(60%) scale(.82) rotateY(-28deg) rotateX(6deg);
        filter: blur(14px) brightness(1.5) saturate(1.3);
      }
      35% { filter: blur(5px) brightness(1.15); }
      65% { transform: translateX(-3%) scale(1.02) rotateY(3deg) rotateX(0); }
      100% {
        opacity: 1;
        transform: translateX(0) scale(1) rotateY(0) rotateX(0);
        filter: blur(0) brightness(1) saturate(1);
      }
    }
    @keyframes wizExitFwd {
      0% { opacity: 1; transform: translateX(0) scale(1) rotateY(0); filter: blur(0); }
      100% {
        opacity: 0;
        transform: translateX(-50%) scale(.85) rotateY(22deg) rotateX(-4deg);
        filter: blur(12px) brightness(.7);
      }
    }
    @keyframes wizEnterBack {
      0% {
        opacity: 0;
        transform: translateX(-60%) scale(.82) rotateY(28deg) rotateX(6deg);
        filter: blur(14px) brightness(1.5) saturate(1.3);
      }
      35% { filter: blur(5px) brightness(1.15); }
      65% { transform: translateX(3%) scale(1.02) rotateY(-3deg); }
      100% {
        opacity: 1;
        transform: translateX(0) scale(1) rotateY(0) rotateX(0);
        filter: blur(0) brightness(1);
      }
    }
    @keyframes wizExitBack {
      0% { opacity: 1; transform: translateX(0) scale(1) rotateY(0); filter: blur(0); }
      100% {
        opacity: 0;
        transform: translateX(50%) scale(.85) rotateY(-22deg) rotateX(-4deg);
        filter: blur(12px) brightness(.7);
      }
    }

    /* flash on step change */
    .wizard-panel.is-stepping::after {
      content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 20;
      background: radial-gradient(circle at 50% 40%, rgba(0,213,255,.12), transparent 65%);
      animation: stepFlash .5s ease both;
    }
    .wizard-progress {
      height: 3px; background: rgba(0,213,255,.1); border-radius: 2px;
      margin: 0 1.25rem .5rem; overflow: hidden;
    }
    .wizard-progress__bar {
      height: 100%; width: 0; border-radius: 2px;
      background: linear-gradient(90deg, var(--cyan), var(--green));
      transition: width .55s var(--ease-out-expo);
      box-shadow: 0 0 10px var(--cyan);
    }
    .wizard-progress__bar.is-pulse {
      animation: progPulse .55s ease;
    }
    @keyframes progPulse {
      0%,100% { box-shadow: 0 0 10px var(--cyan); }
      50% { box-shadow: 0 0 22px var(--green), 0 0 40px rgba(0,213,255,.3); }
    }

    /* ── Form elements ── */
    .field { margin-bottom: 1rem; }
    .field label {
      display: block; font-size: .82rem; font-weight: 600;
      color: rgba(232,251,255,.85); margin-bottom: .4rem;
    }
    .field .hint { font-size: .75rem; color: var(--muted); font-weight: 400; }
    .field--error label { color: #ff8a8a; }
    .field__error {
      display: block; margin-top: .35rem; font-size: .75rem; font-weight: 500;
      color: #ff6b6b; animation: fieldErrIn .3s var(--ease-out-expo) both;
    }
    @keyframes fieldErrIn {
      from { opacity: 0; transform: translateY(-4px); }
      to { opacity: 1; transform: translateY(0); }
    }
    .form-error-banner {
      padding: .65rem .85rem; border-radius: .65rem; margin-bottom: 1rem;
      font-size: .8rem; font-weight: 600; color: #ff8a8a;
      background: rgba(255,80,80,.08); border: 1px solid rgba(255,100,100,.25);
      animation: fieldErrIn .3s var(--ease-out-expo) both;
    }
    .input.is-invalid, .textarea.is-invalid, .select.is-invalid {
      border-color: rgba(255,100,100,.65);
      box-shadow: 0 0 0 3px rgba(255,80,80,.1), 0 0 16px rgba(255,80,80,.12);
    }
    .check-group.is-invalid, .chip-grid.is-invalid, .opt-grid.is-invalid, .yesno-row.is-invalid,
    .wiz-toggle-group.is-invalid {
      padding: .5rem; border-radius: .75rem;
      border: 1px solid rgba(255,100,100,.4);
      background: rgba(255,80,80,.04);
    }
    .yesno-row { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
    @media (max-width: 420px) { .yesno-row { grid-template-columns: 1fr; } }
    .yesno-btn {
      padding: .85rem 1rem; border-radius: .85rem; cursor: pointer;
      border: 1px solid var(--border); background: rgba(0,0,0,.25);
      font-family: inherit; font-size: .9rem; font-weight: 700; color: var(--text);
      transition: border-color .25s, background .25s, transform .25s var(--ease-in-out-back);
    }
    .yesno-btn:hover { border-color: rgba(0,213,255,.4); transform: scale(1.02); }
    .yesno-btn--yes.is-selected { border-color: var(--green); background: rgba(0,255,156,.1); color: var(--green); }
    .yesno-btn--no.is-selected { border-color: #ff9f43; background: rgba(255,159,67,.08); color: #ffcc80; }
    .input, .textarea, .select {
      width: 100%; padding: .75rem 1rem; border-radius: .75rem;
      background: rgba(1,9,18,.8); border: 1px solid rgba(0,213,255,.2);
      color: var(--text); font-family: inherit; font-size: .88rem;
      transition: border-color .2s, box-shadow .2s;
    }
    .input:focus, .textarea:focus, .select:focus {
      outline: none; border-color: rgba(0,213,255,.7);
      box-shadow: 0 0 0 3px rgba(0,213,255,.08), 0 0 20px rgba(0,213,255,.12);
    }
    .textarea { min-height: 5.5rem; resize: vertical; line-height: 1.8; }
    .select { cursor: pointer; }

    /* ── Option cards ── */
    .opt-grid { display: flex; flex-direction: column; gap: .55rem; }
    .opt-card {
      display: flex; align-items: center; gap: .75rem;
      padding: .85rem 1rem; border-radius: .85rem; cursor: pointer;
      border: 1px solid var(--border); background: rgba(0,0,0,.25);
      transition: border-color .25s, background .25s, transform .3s var(--ease-in-out-back), box-shadow .25s;
      font-size: .88rem; font-weight: 500;
    }
    .opt-card:hover { border-color: rgba(0,213,255,.4); transform: translateX(-4px); }
    .opt-card.is-selected {
      border-color: var(--cyan); background: rgba(0,213,255,.08);
      box-shadow: 0 0 20px rgba(0,213,255,.1);
      transform: translateX(-6px) scale(1.01);
    }
    .opt-card__num {
      flex-shrink: 0; width: 1.8rem; height: 1.8rem; border-radius: .45rem;
      display: flex; align-items: center; justify-content: center;
      font-family: 'JetBrains Mono', monospace; font-size: .72rem; font-weight: 700;
      background: rgba(0,213,255,.1); color: var(--cyan); border: 1px solid rgba(0,213,255,.2);
      transition: background .25s, color .25s;
    }
    .opt-card.is-selected .opt-card__num {
      background: var(--cyan); color: #02040a;
    }
    .opt-card input { display: none; }

    /* ── Multi-select chips (languages) ── */
    .chip-grid { display: flex; flex-wrap: wrap; gap: .45rem; }
    .chip {
      padding: .45rem .85rem; border-radius: 999px; cursor: pointer;
      border: 1px solid var(--border); background: rgba(0,0,0,.3);
      font-size: .8rem; font-weight: 500; transition: all .25s var(--ease-in-out-back);
      user-select: none;
    }
    .chip:hover { border-color: rgba(0,213,255,.4); }
    .chip.is-selected {
      border-color: var(--green); background: rgba(0,255,156,.12);
      color: var(--green); transform: scale(1.06);
      box-shadow: 0 0 15px rgba(0,255,156,.15);
    }

    /* ── Service toggles ── */
    .wiz-toggle-group {
      display: flex; flex-direction: column; gap: .65rem;
    }
    .wiz-toggle-row {
      display: flex; align-items: center; justify-content: space-between; gap: 1rem;
      padding: .95rem 1.05rem; min-height: 3.5rem;
      border-radius: .9rem; cursor: pointer;
      border: 1px solid var(--border); background: rgba(0, 0, 0, .22);
      -webkit-tap-highlight-color: transparent;
      touch-action: manipulation;
      transition: border-color .25s, background .25s, box-shadow .25s, transform .15s;
      user-select: none;
    }
    .wiz-toggle-row:active { transform: scale(0.985); }
    .wiz-toggle-row.is-on {
      border-color: rgba(0, 213, 255, .45);
      background: rgba(0, 213, 255, .07);
      box-shadow: 0 0 20px rgba(0, 213, 255, .08);
    }
    .wiz-toggle-group.is-invalid .wiz-toggle-row {
      border-color: rgba(255, 100, 100, .35);
    }
    .wiz-toggle-row__text { flex: 1; min-width: 0; text-align: right; }
    .wiz-toggle-row__title {
      display: block; font-size: .92rem; font-weight: 600; color: var(--text);
      line-height: 1.4;
    }
    .wiz-toggle-row__hint {
      display: block; font-size: .74rem; color: var(--muted);
      margin-top: .2rem; line-height: 1.45;
    }
    .wiz-toggle {
      position: relative; flex-shrink: 0;
      width: 3.35rem; height: 1.95rem;
    }
    .wiz-toggle input {
      position: absolute; inset: 0; width: 100%; height: 100%;
      margin: 0; opacity: 0; cursor: pointer; z-index: 2;
    }
    .wiz-toggle__track {
      position: absolute; inset: 0; border-radius: 999px;
      background: rgba(90, 118, 148, .35);
      border: 1px solid rgba(90, 118, 148, .3);
      transition: background .25s, border-color .25s, box-shadow .25s;
      pointer-events: none;
    }
    .wiz-toggle__thumb {
      position: absolute; top: 2px; right: 2px;
      width: 1.5rem; height: 1.5rem; border-radius: 50%;
      background: #e8f4ff;
      box-shadow: 0 2px 8px rgba(0, 0, 0, .28);
      transition: transform .28s var(--ease-out-expo), background .25s, box-shadow .25s;
      pointer-events: none;
    }
    .wiz-toggle-row.is-on .wiz-toggle__track {
      background: rgba(0, 213, 255, .32);
      border-color: rgba(0, 213, 255, .55);
      box-shadow: inset 0 0 14px rgba(0, 213, 255, .12);
    }
    .wiz-toggle-row.is-on .wiz-toggle__thumb {
      transform: translateX(-1.4rem);
      background: var(--cyan);
      box-shadow: 0 0 14px rgba(0, 213, 255, .5);
    }

    /* ── Buttons ── */
    .btn-row { display: flex; gap: .6rem; margin-top: 1.25rem; flex-wrap: wrap; }
    .btn {
      flex: 1; min-width: 7rem; padding: .75rem 1.2rem; border-radius: .75rem;
      border: none; cursor: pointer; font-family: inherit;
      font-size: .88rem; font-weight: 700; transition: all .25s var(--ease-in-out-back);
    }
    .btn--primary {
      background: linear-gradient(135deg, var(--cyan), var(--blue));
      color: #02040a; box-shadow: 0 0 20px rgba(0,213,255,.2);
    }
    .btn--primary:hover { transform: scale(1.03); box-shadow: 0 0 30px rgba(0,213,255,.35); }
    .btn--ghost {
      background: rgba(0,0,0,.3); color: var(--muted);
      border: 1px solid var(--border);
    }
    .btn--ghost:hover { color: var(--text); border-color: rgba(0,213,255,.3); }
    .btn--link {
      background: none; border: none; color: var(--cyan); cursor: pointer;
      font-family: inherit; font-size: .85rem; font-weight: 600;
      text-decoration: underline; text-underline-offset: 3px;
      padding: .5rem 0; transition: color .2s;
    }
    .btn--link:hover { color: var(--green); }

    /* ── Message box ── */
    .msg-box {
      padding: 1rem 1.1rem; border-radius: .85rem; font-size: .88rem; line-height: 1.85;
      animation: msgPop .5s var(--ease-in-out-back) both;
    }
    @keyframes msgPop {
      from { opacity: 0; transform: scale(.85); }
      to { opacity: 1; transform: scale(1); }
    }
    .msg-box--info {
      background: rgba(0,213,255,.06); border: 1px solid rgba(0,213,255,.2); color: var(--muted);
    }
    .msg-box--warm {
      background: rgba(255,180,50,.06); border: 1px solid rgba(255,180,50,.2); color: rgba(255,220,150,.9);
    }
    .msg-box--fun {
      background: rgba(0,255,156,.06); border: 1px solid rgba(0,255,156,.2); color: rgba(180,255,220,.9);
    }

    /* ── Loading ── */
    .loader-wrap {
      display: none; flex-direction: column; align-items: center; justify-content: center;
      padding: 3rem 1rem; gap: 1rem;
    }
    .loader-wrap.is-visible { display: flex; }
    .loader-ring {
      width: 3rem; height: 3rem; border-radius: 50%;
      border: 3px solid rgba(0,213,255,.15);
      border-top-color: var(--cyan);
      animation: spin .8s linear infinite;
    }
    @keyframes spin { to { transform: rotate(360deg); } }
    .loader-text {
      font-family: 'JetBrains Mono', monospace; font-size: .75rem; color: var(--muted);
    }

    /* ── Success ── */
    .success-screen {
      text-align: center; padding: 2rem 1rem;
      animation: msgPop .6s var(--ease-in-out-back) both;
    }
    .success-screen__icon {
      width: 4rem; height: 4rem; border-radius: 50%; margin: 0 auto 1rem;
      display: flex; align-items: center; justify-content: center;
      font-size: 1.8rem; font-weight: 900;
      background: rgba(0,255,156,.1); border: 2px solid rgba(0,255,156,.3);
      color: var(--green); box-shadow: 0 0 30px rgba(0,255,156,.2);
      animation: successPulse 2s ease infinite;
    }
    @keyframes successPulse {
      0%,100% { box-shadow: 0 0 30px rgba(0,255,156,.2); }
      50% { box-shadow: 0 0 50px rgba(0,255,156,.4); }
    }
    .success-screen h3 { font-size: 1.15rem; margin-bottom: .5rem; }
    .success-screen p { color: var(--muted); font-size: .85rem; }

    /* ── Open pulse (border only — never replace card animation on .qa-item) ── */
    .qa-item.is-opening {
      animation: qaOpenGlow .45s var(--ease-out-expo);
    }
    .qa-item.qa-entered.is-opening { animation: qaOpenGlow .45s var(--ease-out-expo); }
    @keyframes qaOpenGlow {
      0% { box-shadow: 0 0 40px rgba(0,195,255,.08), inset 0 1px 0 rgba(255,255,255,.04); }
      40% { box-shadow: 0 0 35px rgba(0,213,255,.28), 0 0 60px rgba(0,255,156,.1), inset 0 1px 0 rgba(255,255,255,.06); }
      100% { box-shadow: 0 0 30px rgba(0,213,255,.12), 0 8px 32px rgba(0,0,0,.3); }
    }

    /* ── Shake on error ── */
    .shake { animation: shake .45s var(--ease-out-expo); }
    @keyframes shake {
      0%,100% { transform: translateX(0); }
      20% { transform: translateX(-8px); }
      40% { transform: translateX(8px); }
      60% { transform: translateX(-4px); }
      80% { transform: translateX(4px); }
    }

    /* ── Footer ── */
    .footer {
      text-align: center; margin-top: 2.5rem; padding-top: 1.5rem;
      border-top: 1px solid rgba(0,213,255,.08);
      font-size: .72rem; color: rgba(232,251,255,.35);
      font-family: 'JetBrains Mono', monospace;
    }

    .wizard-turnstile-field { margin-bottom: 1rem; }
    .wizard-turnstile-field label {
      display: block; font-size: .82rem; font-weight: 600;
      color: rgba(232,251,255,.85); margin-bottom: .4rem;
    }
    .wizard-turnstile-host {
      display: flex; justify-content: center; align-items: center;
      min-height: 4rem; padding: .5rem;
      border-radius: .65rem;
      background: rgba(0, 0, 0, .22);
      border: 1px solid rgba(0, 213, 255, .12);
    }