
  .page-hero {
    background:
      radial-gradient(ellipse 900px 500px at 50% -120px, rgba(99,91,255,0.16) 0%, rgba(99,91,255,0) 60%),
      radial-gradient(ellipse 600px 320px at 15% 10%, rgba(199,210,254,0.35) 0%, rgba(199,210,254,0) 60%),
      #FFFFFF;
  }

  .contact-card {
    background: #fff;
    border: 1px solid var(--pf-border);
    border-radius: 22px;
    padding: 36px;
    box-shadow: 0 1px 2px rgba(15,23,42,0.04), 0 24px 48px rgba(15,23,42,0.06);
  }

  /* form */
  .field-label {
    display: block;
    font-size: 13px; font-weight: 600;
    color: var(--pf-text-deep);
    margin-bottom: 6px;
  }
  .field-label .optional { color: var(--pf-text-muted); font-weight: 400; margin-left: 4px; }
  .field-label .req { color: var(--pf-danger, #DC2626); margin-left: 4px; }
  .field {
    width: 100%;
    background: #fff;
    border: 1px solid var(--pf-border);
    border-radius: 12px;
    padding: 11px 14px;
    font-size: 15px;
    color: var(--pf-text);
    transition: border-color 150ms ease, box-shadow 150ms ease;
    font-family: inherit;
  }
  .field::placeholder { color: var(--pf-text-hint, #A0AEC0); }
  .field:focus {
    outline: none;
    border-color: #C7D2FE;
    box-shadow: 0 0 0 4px #E0E7FF;
  }
  textarea.field { min-height: 140px; resize: vertical; line-height: 1.55; }

  select.field {
    appearance: none; -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2364748B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    padding-right: 40px;
  }

  .checkbox {
    appearance: none;
    -webkit-appearance: none;
    width: 18px; height: 18px;
    border: 1.5px solid #CBD5E1;
    border-radius: 5px;
    cursor: pointer;
    position: relative;
    transition: border-color 150ms ease, background-color 150ms ease;
    flex-shrink: 0;
    margin-top: 2px;
  }
  .checkbox:hover { border-color: var(--pf-primary); }
  .checkbox:checked {
    background: var(--pf-primary);
    border-color: var(--pf-primary);
  }
  .checkbox:checked::after {
    content: "";
    position: absolute;
    top: 2px; left: 5px;
    width: 4px; height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
  }

  .info-row {
    display: flex; align-items: flex-start; gap: 14px;
    padding: 14px 0;
  }
  .info-icon {
    flex-shrink: 0;
    width: 44px; height: 44px; border-radius: 12px;
    display: inline-flex; align-items: center; justify-content: center;
  }
  .ii-1 { background: #F0EFFF; color: #635BFF; }
  .ii-2 { background: #F3E8FF; color: #7E22CE; }
  .ii-3 { background: #ECFDF5; color: #047857; }

  .note-callout {
    background: linear-gradient(180deg, #F6F7FF 0%, #F0EFFF 100%);
    border: 1px solid #E0DEFF;
    border-radius: 14px;
    padding: 16px 18px;
    font-size: 14px;
    line-height: 1.55;
    color: var(--pf-text-secondary);
  }
  .note-callout strong { color: var(--pf-text-deep); }

  /* submitted state */
  .form-success {
    display: none;
    padding: 32px;
    text-align: center;
    background: linear-gradient(180deg, #ECFDF5 0%, #fff 100%);
    border: 1px solid #A7F3D0;
    border-radius: 16px;
  }
  .form-success.show { display: block; }

  /* error + captcha */
  .form-error {
    margin: 0;
    padding: 11px 14px;
    border-radius: 12px;
    background: var(--pf-danger-bg, #FEF2F2);
    border: 1px solid var(--pf-danger-border, #FECACA);
    color: var(--pf-danger-fg, #B91C1C);
    font-size: 14px;
    font-weight: 500;
  }
  .h-captcha { min-height: 78px; }
  html[dir="rtl"] .h-captcha { display: flex; justify-content: flex-end; }
