/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("assets/08f9bba1.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("assets/ae8f83d7.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("assets/002dd55f.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("assets/0aaeed85.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("assets/ef067025.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("assets/8c445973.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("assets/ac89cdc9.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/08f9bba1.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/ae8f83d7.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/002dd55f.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/0aaeed85.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/ef067025.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/8c445973.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/ac89cdc9.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("assets/08f9bba1.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("assets/ae8f83d7.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("assets/002dd55f.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("assets/0aaeed85.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("assets/ef067025.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("assets/8c445973.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("assets/ac89cdc9.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("assets/08f9bba1.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("assets/ae8f83d7.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("assets/002dd55f.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("assets/0aaeed85.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("assets/ef067025.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("assets/8c445973.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("assets/ac89cdc9.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("assets/08f9bba1.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("assets/ae8f83d7.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("assets/002dd55f.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("assets/0aaeed85.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("assets/ef067025.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("assets/8c445973.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("assets/ac89cdc9.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}



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

    :root {
      --blue: #2055D4;
      --blue-light: #3A6EF0;
      --blue-dim: rgba(32,85,212,0.18);
      --navy: #07112A;
      --navy-mid: #0D1E40;
      --navy-card: #112252;
      --white: #FAFBFF;
      --gray: #8B96B0;
      --gray-light: #E8ECF6;
      --success: #22C55E;
      --font: 'Inter', sans-serif;
    }

    html, body {
      height: 100%;
      font-family: var(--font);
      background: var(--navy);
      color: var(--white);
      overflow-x: hidden;
    }

    /* ── LAYOUT ── */
    .page {
      display: grid;
      grid-template-columns: 1fr 1fr;
      min-height: 100vh;
    }

    /* ── LEFT PANEL ── */
    .left {
      background: var(--navy);
      padding: 52px 56px;
      display: flex;
      flex-direction: column;
      gap: 40px;
      position: sticky;
      top: 0;
      height: 100vh;
      overflow: hidden;
      justify-content: center;
    }

    .logo-wrap {
      display: flex;
      align-items: center;
      gap: 14px;
    }
    .logo-wrap img {
      width: 72px;
      height: 72px;
      object-fit: contain;
      border-radius: 12px;
    }
    .logo-name {
      font-size: 22px;
      font-weight: 700;
      letter-spacing: 0.08em;
      color: var(--white);
    }

    .hero-text {
      flex: none;
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 20px;
    }

    .badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: var(--blue-dim);
      border: 1px solid rgba(32,85,212,0.4);
      color: #7EB0FF;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      padding: 6px 14px;
      border-radius: 100px;
      width: fit-content;
    }
    .badge-dot {
      width: 7px; height: 7px;
      background: var(--blue-light);
      border-radius: 50%;
      animation: pulse 2s infinite;
    }
    @keyframes pulse {
      0%, 100% { opacity: 1; transform: scale(1); }
      50% { opacity: 0.4; transform: scale(0.7); }
    }

    h1 {
      font-size: clamp(28px, 3vw, 44px);
      font-weight: 700;
      line-height: 1.15;
      color: var(--white);
      text-wrap: pretty;
    }
    h1 span { color: var(--blue-light); }

    .sub {
      font-size: 15px;
      color: var(--gray);
      line-height: 1.65;
      max-width: 380px;
      text-wrap: pretty;
    }

    /* counter */
    .counter-card {
      background: var(--navy-card);
      border: 1px solid rgba(32,85,212,0.25);
      border-radius: 16px;
      padding: 18px 22px;
      display: flex;
      align-items: center;
      gap: 18px;
    }
    .counter-num {
      font-size: 40px;
      font-weight: 700;
      color: var(--blue-light);
      line-height: 1;
      min-width: 70px;
    }
    .counter-label { font-size: 13px; color: var(--gray); line-height: 1.5; }
    .counter-label strong { color: var(--white); display: block; font-size: 15px; margin-bottom: 2px; }

    /* benefits */
    .benefits { display: flex; flex-direction: column; gap: 12px; }
    .benefit {
      display: flex;
      align-items: flex-start;
      gap: 12px;
    }
    .benefit-icon {
      width: 34px; height: 34px;
      background: var(--blue-dim);
      border-radius: 8px;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .benefit-icon svg { width: 16px; height: 16px; }
    .benefit-text { font-size: 13px; color: var(--gray); line-height: 1.5; }
    .benefit-text strong { color: var(--white); display: block; font-size: 14px; }

    /* map */
    .map-card {
      background: var(--navy-card);
      border: 1px solid rgba(32,85,212,0.2);
      border-radius: 16px;
      overflow: hidden;
      position: relative;
      height: 190px;
    }
    .map-svg { width: 100%; height: 100%; display: block; }
    .map-label {
      position: absolute;
      bottom: 10px; left: 14px;
      font-size: 11px;
      color: var(--gray);
      letter-spacing: 0.06em;
    }
    .map-label strong { color: var(--white); }
    .map-badge {
      position: absolute;
      top: 10px; right: 10px;
      background: rgba(32,85,212,0.7);
      backdrop-filter: blur(6px);
      border: 1px solid rgba(58,110,240,0.5);
      border-radius: 6px;
      padding: 4px 8px;
      font-size: 10px;
      font-weight: 600;
      color: white;
      letter-spacing: 0.06em;
    }

    /* ── RIGHT PANEL ── */
    .right {
      background: var(--white);
      padding: 52px 56px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 32px;
      color: #111827;
    }

    .form-header h2 {
      font-size: 26px;
      font-weight: 700;
      color: #0D1E40;
      margin-bottom: 6px;
    }
    .form-header p { font-size: 14px; color: #6B7280; line-height: 1.6; }

    form { display: flex; flex-direction: column; gap: 20px; }

    .field { display: flex; flex-direction: column; gap: 6px; }
    .field label {
      font-size: 13px;
      font-weight: 600;
      color: #374151;
      letter-spacing: 0.02em;
    }
    .field label .req { color: var(--blue); margin-left: 2px; }

    .input-wrap { position: relative; }
    .input-wrap .icon {
      position: absolute;
      left: 14px;
      top: 50%;
      transform: translateY(-50%);
      color: #9CA3AF;
      display: flex;
      align-items: center;
    }
    .input-wrap .icon svg { width: 16px; height: 16px; }

    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="number"],
    select {
      width: 100%;
      padding: 12px 14px 12px 42px;
      border: 1.5px solid #E5E7EB;
      border-radius: 10px;
      font-family: var(--font);
      font-size: 14px;
      color: #111827;
      background: #fff;
      outline: none;
      transition: border-color 0.2s, box-shadow 0.2s;
      -webkit-appearance: none;
    }
    input:focus, select:focus {
      border-color: var(--blue);
      box-shadow: 0 0 0 3px rgba(32,85,212,0.1);
    }
    input.error { border-color: #EF4444; }
    input.valid { border-color: var(--success); }

    .field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

    /* GPS toggle */
    .gps-group {
      display: flex;
      gap: 12px;
    }
    .gps-option {
      flex: 1;
      position: relative;
    }
    .gps-option input[type="radio"] {
      position: absolute;
      opacity: 0;
      width: 0; height: 0;
    }
    .gps-option label {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 12px;
      border: 1.5px solid #E5E7EB;
      border-radius: 10px;
      cursor: pointer;
      font-size: 14px;
      font-weight: 500;
      color: #6B7280;
      transition: all 0.2s;
      background: #fff;
    }
    .gps-option input[type="radio"]:checked + label {
      border-color: var(--blue);
      background: rgba(32,85,212,0.06);
      color: var(--blue);
      font-weight: 600;
    }
    .gps-option label svg { width: 16px; height: 16px; }

    /* WhatsApp note */
    .wa-note {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 12px;
      color: #6B7280;
      margin-top: 4px;
    }
    .wa-dot { width: 8px; height: 8px; background: #22C55E; border-radius: 50%; flex-shrink: 0; }

    /* submit */
    .btn-submit {
      padding: 16px;
      background: var(--blue);
      color: #fff;
      font-family: var(--font);
      font-size: 15px;
      font-weight: 700;
      letter-spacing: 0.03em;
      border: none;
      border-radius: 12px;
      cursor: pointer;
      transition: background 0.2s, transform 0.1s, box-shadow 0.2s;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
    }
    .btn-submit:hover {
      background: var(--blue-light);
      box-shadow: 0 8px 24px rgba(32,85,212,0.35);
      transform: translateY(-1px);
    }
    .btn-submit:active { transform: translateY(0); }

    .privacy {
      text-align: center;
      font-size: 11.5px;
      color: #9CA3AF;
      line-height: 1.6;
    }
    .privacy a { color: var(--blue); text-decoration: none; }

    /* ── SUCCESS STATE ── */
    .success-panel {
      display: none;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 20px;
      text-align: center;
      padding: 40px 20px;
      flex: 1;
    }
    .success-icon {
      width: 72px; height: 72px;
      background: rgba(34,197,94,0.12);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
    }
    .success-icon svg { width: 36px; height: 36px; color: var(--success); }
    .success-panel h3 { font-size: 24px; font-weight: 700; color: #0D1E40; }
    .success-panel p { font-size: 14px; color: #6B7280; max-width: 320px; line-height: 1.7; }
    .success-credits {
      background: #F0F9FF;
      border: 1px solid #BAE6FD;
      border-radius: 12px;
      padding: 16px 24px;
      font-size: 14px;
      color: #0369A1;
    }
    .success-credits strong { display: block; font-size: 18px; margin-bottom: 4px; color: #0D1E40; }

    /* ── RESPONSIVE ── */
    @media (max-width: 860px) {
      .page { grid-template-columns: 1fr; }
      .left {
        position: static;
        height: auto;
        padding: 36px 28px;
        gap: 28px;
      }
      .map-card { height: 100px; }
      .right { padding: 36px 28px; }
      h1 { font-size: 28px; }
      .field-row { grid-template-columns: 1fr; }
    }
  


  @keyframes fadeIn {
    from { opacity: 0; transform: translateY(16px); }
    to { opacity: 1; transform: translateY(0); }
  }