*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

    :root {
      --bg:       #05050a;
      --card:     #0d0d16;
      --left:     #10101c;
      --orange:   #ff6b2b;
      --orange2:  #ffb347;
      --cyan:     #00e5c8;
      --white:    #f5f4ff;
      --muted:    #5a5a72;
      --border:   rgba(255,255,255,0.06);
      --r:        24px;
    }

    body {
      min-height: 100vh;
      background: var(--bg);
      display: flex;
      align-items: center;
      justify-content: center;
     /* padding: 2rem;*/
      font-family: 'Outfit', sans-serif;
      overflow: hidden;
    }

    /*  Mesh background  */
    .mesh {
      position: fixed;
      inset: 0;
      pointer-events: none;
      z-index: 0;
      overflow: hidden;
    }
    .mesh span {
      position: absolute;
      border-radius: 50%;
      filter: blur(110px);
      opacity: 0.13;
      animation: breathe 10s ease-in-out infinite alternate;
    }
    .mesh span:nth-child(1) { width:600px;height:600px;background:#ff6b2b;top:-200px;left:-200px; }
    .mesh span:nth-child(2) { width:500px;height:500px;background:#00e5c8;bottom:-180px;right:-180px;animation-delay:-5s; }
    .mesh span:nth-child(3) { width:300px;height:300px;background:#6f4cff;top:40%;left:40%;animation-delay:-2s; }
    @keyframes breathe {
      from { transform:scale(1) translate(0,0); }
      to   { transform:scale(1.15) translate(20px,15px); }
    }

    /*  Wrapper  */
    .wrapper {top:-30px;
      position: relative;
      z-index: 1;
      width: 100%;
      max-width: 1040px;
      animation: riseUp .9s cubic-bezier(.22,1,.36,1) both;
    }
    @keyframes riseUp {
      from { opacity:0; transform:translateY(56px) scale(.97); }
      to   { opacity:1; transform:translateY(0)    scale(1);   }
    }

    /*  Card shell  */
    .card {
      display: grid;
      grid-template-columns: 360px 1fr;
     /* border-radius: 32px;*/
      overflow: hidden;
     /* border: 1px solid var(--border);
      box-shadow: 0 40px 120px rgba(0,0,0,.7), 0 0 0 1px rgba(255,107,43,.08);*/
    }

    /*  LEFT PANEL */
    .left {
      background: var(--left);
     
      display: flex;
      flex-direction: column;
      position: relative;
      overflow: hidden;
      border-right: 1px solid var(--border);
    }

    .left::before {
      content:'';
      position:absolute;
      inset:0;
      background: repeating-linear-gradient(
        -55deg,
        rgba(255,107,43,.03) 0px,
        rgba(255,107,43,.03) 1px,
        transparent 1px,
        transparent 28px
      );
      pointer-events:none;
    }

    .left::after {
      content:'';
      position:absolute;
      bottom:-80px; right:-80px;
      width:280px; height:280px;
      background: radial-gradient(circle, rgba(255,107,43,.22) 0%, transparent 70%);
      pointer-events:none;
    }

    /* Badge */
    .badge-wrap {
      display:flex;
      align-items:center;
      gap:10px;
      margin-bottom: 30px;
      animation: riseUp .9s .1s cubic-bezier(.22,1,.36,1) both;
    }

    .badge {
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 86px;
      height: 86px;
      flex-shrink: 0;
    }

    .badge svg.ring {
      position:absolute;
      inset:0;
      width:100%; height:100%;
      animation: spin 8s linear infinite;
    }
    @keyframes spin { to { transform:rotate(360deg); } }

    .badge-inner {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      width: 66px;
      height: 66px;
      border-radius: 50%;
      background: linear-gradient(135deg, var(--orange), var(--orange2));
      box-shadow: 0 0 24px rgba(255,107,43,.5);
    }

    .badge-inner .pct { font-family:'Bebas Neue',sans-serif;font-size:22px;color:#111;line-height:1; }
    .badge-inner .off { font-size:9px;font-weight:700;letter-spacing:.1em;color:rgba(0,0,0,.85);text-transform:uppercase;margin-top:1px; }

    .badge-text .label { font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--orange); }
    .badge-text .desc  { font-size:13px;font-weight:400;color:var(--muted);margin-top:3px; }

    /* Heading */
    .left h1 {
      font-family: 'Bebas Neue', sans-serif;
      font-size: clamp(2.8rem,4vw,3.8rem);
      line-height: 1.05;
      color: var(--white);
      letter-spacing: .02em;
      margin-bottom: 14px;
      animation: riseUp .9s .15s cubic-bezier(.22,1,.36,1) both;
    }
    .left h1 .hi {
      display:block;
      background:linear-gradient(90deg,var(--orange),var(--orange2));
      -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
    }

    .left p {
      font-size:.88rem;color:var(--muted);line-height:1.7;
      animation: riseUp .9s .2s cubic-bezier(.22,1,.36,1) both;
    }

    .divider {
      width:48px;height:2px;
      background:linear-gradient(90deg,var(--orange),transparent);
      border-radius:99px;
      margin:22px 0;
      animation: riseUp .9s .22s cubic-bezier(.22,1,.36,1) both;
    }

    /* Features */
    .features {
      list-style:none;
      display:flex;flex-direction:column;gap:12px;
      animation: riseUp .9s .25s cubic-bezier(.22,1,.36,1) both;
    }
    .features li { display:flex;align-items:center;gap:10px;font-size:.86rem;color:rgba(245,244,255,.65); }
    .features li .dot {
      width:26px;height:26px;border-radius:50%;
      background:rgba(255,107,43,.1);border:1px solid rgba(255,107,43,.25);
      display:flex;align-items:center;justify-content:center;flex-shrink:0;
    }
    .features li .dot svg { width:12px;height:12px;color:var(--orange); }

    /* Timer */
    .timer-strip {
      margin-top: auto;
      padding-top: 28px;
      animation: riseUp .9s .3s cubic-bezier(.22,1,.36,1) both;
    }
    .timer-label { font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:10px; }
    .timer-boxes { display:flex;gap:8px; }
    .tbox {
      flex:1;background:rgba(255,107,43,.06);
      border:1px solid rgba(255,107,43,.14);border-radius:10px;
      padding:10px 6px 8px;text-align:center;
    }
    .tbox .num { font-family:'Bebas Neue',sans-serif;font-size:26px;color:var(--white);line-height:1; }
    .tbox .unit { font-size:9px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);display:block;margin-top:2px; }
    .tcolon { display:flex;align-items:center;padding-bottom:8px;color:var(--orange);font-family:'Bebas Neue',sans-serif;font-size:22px; }

    /*RIGHT PANEL*/
    .right {
     /* background: var(--card);*/
      padding: 52px 48px 48px;
      display: flex;
      flex-direction: column;
      position: relative;
      overflow: hidden;
    }

    .right::before {
      content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);
      width:55%;height:1px;
      background:linear-gradient(90deg,transparent,var(--cyan),transparent);
    }
    .right::after {
      content:'';position:absolute;top:-60px;right:-60px;
      width:220px;height:220px;
      background:radial-gradient(circle,rgba(0,229,200,.1) 0%,transparent 70%);
      pointer-events:none;
    }

    .right-header {
      margin-bottom: 30px;
      animation: riseUp .9s .2s cubic-bezier(.22,1,.36,1) both;
    }

    .step-tag {
      display:inline-flex;align-items:center;gap:6px;
      font-size:10px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;
      color:var(--cyan);background:rgba(0,229,200,.07);border:1px solid rgba(0,229,200,.18);
      padding:5px 12px;border-radius:999px;margin-bottom:14px;
    }
    .step-tag::before { content:'';width:6px;height:6px;background:var(--cyan);border-radius:50%;animation:pulse 2s infinite; }
    @keyframes pulse { 0%,100%{opacity:1;transform:scale(1);}50%{opacity:.4;transform:scale(.7);} }

    .right-header h2 {
      font-family:'Bebas Neue',sans-serif;
      font-size:clamp(1.8rem,3vw,2.4rem);
      color:var(--white);letter-spacing:.04em;line-height:1.1;
    }
    .right-header h2 em { font-style:normal;color:var(--cyan); }
    .right-header .sub { margin-top:8px;font-size:.85rem;color:var(--muted); }

    /* Fields */
    .form-fields {
      display:flex;flex-direction:column;gap:16px;flex:1;
      animation: riseUp .9s .28s cubic-bezier(.22,1,.36,1) both;
    }

    .field { display:flex;flex-direction:column;gap:7px; }

    label {
      font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
      color:var(--muted);transition:color .3s;
    }
    .field:focus-within label { color:var(--cyan); }

    .inp-wrap { position:relative; }
    .inp-wrap .ico {
      position:absolute;left:17px;top:50%;transform:translateY(-50%);
      width:17px;height:17px;color:var(--muted);pointer-events:none;transition:color .3s;
    }
    .field:focus-within .ico { color:var(--cyan); }

    input {
      width:100%;
      background:rgba(255,255,255,.035);
      border:1px solid rgba(255,255,255,.07);
      border-radius:14px;
      padding:15px 18px 15px 48px;
      font-family:'Outfit',sans-serif;font-size:.9rem;font-weight:400;
      color:var(--white);outline:none;transition:all .3s;-webkit-appearance:none;
    }
    input::placeholder { color:rgba(255,255,255,.18); }
    input:hover { background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.12); }
    input:focus { background:rgba(0,229,200,.04);border-color:var(--cyan);box-shadow:0 0 0 3px rgba(0,229,200,.1); }
    input.error { border-color:#ff5e5e !important;background:rgba(255,94,94,.05) !important; }

    .err { font-size:11px;color:#ff5e5e;display:none; }
    .err.show { display:block; }

    /* Promo note */
    .promo-note {
      display:flex;align-items:center;gap:10px;
      padding:13px 16px;
      background:linear-gradient(135deg,rgba(255,107,43,.08),rgba(255,179,71,.05));
      border:1px solid rgba(255,107,43,.2);border-radius:14px;
      font-size:.82rem;color:rgba(245,244,255,.7);
      margin-top: 18px;
      animation: riseUp .9s .3s cubic-bezier(.22,1,.36,1) both;
    }
    .promo-note .flash {
      width:32px;height:32px;background:linear-gradient(135deg,var(--orange),var(--orange2));
      border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;
      box-shadow:0 4px 14px rgba(255,107,43,.35);
    }
    .promo-note .flash svg { width:16px;height:16px;color:#fff; }
    .promo-note strong { color:var(--orange2); }

    /* Button */
    .btn-row {
      margin-top: 20px;
      animation: riseUp .9s .35s cubic-bezier(.22,1,.36,1) both;
    }

    .btn {
      width:100%;padding:17px 28px;border:none;border-radius:16px;cursor:pointer;
      font-family:'Bebas Neue',sans-serif;font-size:1.15rem;letter-spacing:.12em;
      color:#0a0a0f;position:relative;overflow:hidden;
      display:flex;align-items:center;justify-content:center;gap:10px;
      background:linear-gradient(110deg,var(--orange),var(--orange2),var(--orange));
      background-size:200% 100%;background-position:0% 50%;
      transition:background-position .5s,transform .25s,box-shadow .25s;
      box-shadow:0 8px 32px rgba(255,107,43,.3);
    }
    .btn::before {
      content:'';position:absolute;inset:0;
      background:linear-gradient(135deg,rgba(255,255,255,.22),transparent);
      opacity:0;transition:opacity .3s;
    }
    .btn:hover { background-position:100% 50%;transform:translateY(-3px);box-shadow:0 14px 44px rgba(255,107,43,.42); }
    .btn:hover::before { opacity:1; }
    .btn:active { transform:translateY(0); }
    .btn svg { width:18px;height:18px;transition:transform .3s; }
    .btn:hover svg { transform:translateX(4px); }

    /* Success */
    .success {
      display:none;align-items:center;gap:12px;
      margin-top:14px;padding:14px 18px;
      background:rgba(0,229,200,.06);border:1px solid rgba(0,229,200,.2);
      border-radius:14px;color:var(--cyan);font-size:.88rem;font-weight:500;
      animation:fadeSlide .4s ease;
    }
    .success.show { display:flex; }
    @keyframes fadeSlide { from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);} }

    /* RESPONSIVE */
    @media (max-width: 820px) {
      .card { grid-template-columns:1fr;border-radius:24px; }
      .left { border-right:none;border-bottom:1px solid var(--border);padding:40px 28px; }
      .right { padding:40px 28px 36px; }
      .timer-strip { padding-top:20px; }
    }
    @media (max-width: 480px) {
      body {  }
      .left,.right { padding:28px 18px; }
      .left h1 { font-size:2.5rem; }
      .badge { width:72px;height:72px; }
      .badge-inner { width:54px;height:54px; }
      .badge-inner .pct { font-size:18px; }
    }