:root {
      --blue: #012767;
      --blue-dark: #001c4e;
      --gold: #ffbd59;
      --bg: #f5f7fb;
      --text: #273142;
      --muted: #687386;
      --border: #dce3ee;
      --white: #fff;
      --danger: #b42318;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      font-family: "Poppins", Arial, sans-serif;
      background: var(--bg);
      color: var(--text);
    }

    header {
      min-height: 74px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 10px clamp(18px, 5vw, 70px);
      background: var(--blue);
      box-shadow: 0 4px 18px rgba(0,0,0,.14);
    }

    .logo {
      width: 120px;
      max-height: 54px;
      object-fit: contain;
    }

    .home-link {
      color: var(--gold);
      text-decoration: none;
      font-weight: 600;
      border: 1px solid rgba(255,189,89,.55);
      padding: 9px 15px;
      border-radius: 9px;
    }

    .hero {
      background: linear-gradient(135deg, var(--blue), #063d91);
      color: white;
      text-align: center;
      padding: 58px 20px 78px;
    }

    .hero .eyebrow {
      display: inline-block;
      color: var(--gold);
      font-weight: 700;
      font-size: .82rem;
      letter-spacing: .08em;
      text-transform: uppercase;
      margin-bottom: 12px;
    }

    .hero h1 {
      max-width: 820px;
      margin: 0 auto 12px;
      font-size: clamp(2rem, 5vw, 3.25rem);
      line-height: 1.12;
    }

    .hero p {
      max-width: 700px;
      margin: 0 auto;
      color: rgba(255,255,255,.86);
      line-height: 1.65;
    }

    .shell {
      width: min(100% - 28px, 980px);
      margin: -42px auto 55px;
      position: relative;
    }

    .form-card {
      background: white;
      border-radius: 20px;
      box-shadow: 0 18px 55px rgba(1,39,103,.14);
      overflow: hidden;
      border: 1px solid rgba(1,39,103,.08);
    }

    .progress-wrap {
      padding: 26px 32px 18px;
      border-bottom: 1px solid #edf0f5;
    }

    .progress-meta {
      display: flex;
      justify-content: space-between;
      gap: 15px;
      color: var(--muted);
      font-size: .88rem;
      margin-bottom: 10px;
    }

    .progress-meta strong { color: var(--blue); }

    .progress {
      height: 8px;
      border-radius: 99px;
      background: #e9edf4;
      overflow: hidden;
    }

    .progress-bar {
      height: 100%;
      width: 16.666%;
      background: var(--gold);
      border-radius: inherit;
      transition: width .3s ease;
    }

    form { padding: 32px; }

    .step { display: none; animation: fade .25s ease; }
    .step.active { display: block; }

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

    .step-heading { margin-bottom: 25px; }
    .step-heading h2 {
      margin: 0 0 7px;
      color: var(--blue);
      font-size: clamp(1.35rem, 3vw, 1.8rem);
    }
    .step-heading p {
      margin: 0;
      color: var(--muted);
      font-size: .94rem;
    }

    .grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0,1fr));
      gap: 19px;
    }

    .field.full { grid-column: 1 / -1; }
    label, legend {
      display: block;
      font-weight: 600;
      color: #26354b;
      font-size: .9rem;
      margin-bottom: 7px;
    }

    .req { color: #b42318; }

    input, select, textarea {
      width: 100%;
      font: inherit;
      color: var(--text);
      background: #fff;
      border: 1.5px solid var(--border);
      border-radius: 10px;
      padding: 12px 13px;
      outline: none;
      transition: .2s;
    }

    input:focus, select:focus, textarea:focus {
      border-color: var(--blue);
      box-shadow: 0 0 0 3px rgba(1,39,103,.08);
    }

    textarea { min-height: 125px; resize: vertical; }
    .hint { color: var(--muted); font-size: .78rem; margin-top: 5px; }

    fieldset {
      border: 0;
      padding: 0;
      margin: 0;
      min-width: 0;
    }

    .choice-row {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
    }

    .choice {
      display: flex;
      align-items: center;
      gap: 8px;
      border: 1.5px solid var(--border);
      padding: 10px 13px;
      border-radius: 10px;
      cursor: pointer;
      font-weight: 500;
      background: white;
      margin: 0;
    }

    .choice input { width: auto; margin: 0; accent-color: var(--blue); }

    .conditional {
      display: none;
      grid-column: 1 / -1;
      padding: 17px;
      border-radius: 12px;
      background: #f7f9fc;
      border-left: 4px solid var(--gold);
    }
    .conditional.show { display: block; }

    .fees {
      grid-column: 1 / -1;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
      margin-top: 3px;
    }

    .fee {
      border: 1px solid #dce3ee;
      border-radius: 12px;
      padding: 16px;
      background: #f9fbff;
    }
    .fee span { display:block; color:var(--muted); font-size:.82rem; }
    .fee strong { color:var(--blue); font-size:1.25rem; }

    .experience {
      grid-column: 1 / -1;
      padding: 18px;
      border: 1px solid var(--border);
      border-radius: 13px;
      background: #fafbfc;
      margin-bottom: 10px;
    }

    .experience-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 15px;
    }

    .add-btn {
      margin-top: 10px;
      border: 1.5px dashed var(--blue);
      background: white;
      color: var(--blue);
      border-radius: 9px;
      padding: 10px 14px;
      font: inherit;
      font-weight: 600;
      cursor: pointer;
    }

    .review {
      background: #f8faff;
      border: 1px solid #e0e7f1;
      border-radius: 13px;
      padding: 18px;
      line-height: 1.7;
      color: #455267;
    }

    .consent {
      display:flex;
      gap:10px;
      align-items:flex-start;
      margin-top:18px;
      font-size:.86rem;
      color:#566174;
    }
    .consent input { width:auto; margin-top:4px; accent-color:var(--blue); }

    .actions {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      margin-top: 30px;
      padding-top: 22px;
      border-top: 1px solid #edf0f5;
    }

    .btn {
      border: 0;
      border-radius: 10px;
      padding: 12px 22px;
      font: inherit;
      font-weight: 700;
      cursor: pointer;
      transition: .2s;
    }
    .btn:hover { transform: translateY(-1px); }
    .btn-back { background:#eef2f7; color:var(--blue); }
    .btn-next, .btn-submit { background:var(--blue); color:var(--gold); margin-left:auto; }
    .btn-submit { display:none; }

    .error-box {
      display:none;
      color:var(--danger);
      background:#fff3f2;
      border:1px solid #fecdca;
      padding:11px 13px;
      border-radius:9px;
      margin-top:15px;
      font-size:.86rem;
    }

    footer {
      background: var(--blue);
      color: var(--gold);
      text-align: center;
      padding: 24px 18px;
      font-size: .86rem;
    }

    @media (max-width: 700px) {
      header { min-height:64px; padding:8px 16px; }
      .logo { width:100px; }
      .home-link { font-size:.8rem; padding:8px 10px; }
      .hero { padding:42px 18px 66px; }
      .shell { width:min(100% - 18px, 980px); margin-top:-32px; }
      .progress-wrap, form { padding:21px 17px; }
      .grid, .fees, .experience-grid { grid-template-columns:1fr; }
      .field.full, .fees { grid-column:auto; }
      .actions { position:sticky; bottom:0; background:white; padding-bottom:4px; }
      .btn { padding:11px 15px; }
    }
