* {margin: 0;padding: 0;box-sizing: border-box;}
:root {--pa-midnight-navy: #00002A;--pa-emerald-green: #007F32;--pa-light-green: #00a651;--primary-color: #007F32;--secondary-color: #00a651;}
.container {max-width: 1200px;margin: 0 auto;padding: 0 20px;}
.login-logo .logo img {max-height: 50px;}
/* Header */
.header {padding: 20px 0;border-bottom: 1px solid rgba(0, 166, 81, 0.3);}
.nav {display: flex;justify-content: space-between;align-items: center;}
.logo {height: auto;max-width: 90%;max-height: 50px;}
.nav-links {display: flex;gap: 30px;list-style: none;}
.nav-links a {color: #00002A;text-decoration: none;font-weight: 500;transition: color 0.3s ease;}
.nav-links a:hover {color: #007F32;}
.nav-login-link {background: var(--primary-color) !important;color: #FFFFFF !important;padding: 8px 20px !important;border-radius: 25px !important;font-weight: 600 !important;transition: all 0.3s ease !important;}
label.consent-checkbox span a{color: var(--primary-color);}
.nav-login-link:hover {background: var(--primary-color) !important;transform: translateY(-2px) !important;box-shadow: 0 5px 15px rgba(0, 166, 81, 0.3) !important;}
/* Hero Section */
.hero {padding: 80px 0;text-align: center;}
.hero h1 {font-size: 3.5rem;color: #00002A;margin-bottom: 20px;font-weight: bold;}
.hero .subtitle {font-size: 1.5rem;color: #007F32;margin-bottom: 20px;font-weight: 600;}
.hero .description {font-size: 1.2rem;color: #4a5568;max-width: 600px;margin: 0 auto 40px auto;}
.cta-button {
    background: var(--primary-color);
    color: #FFFFFF;
    border: none;
    padding: 15px 20px;
    font-size: 1.1rem;
    font-weight: bold;
    border-radius: 50px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 10px 30px rgba(0, 166, 81, 0.3);
}
.cta-button:hover {transform: translateY(-3px);box-shadow: 0 15px 40px rgba(0, 166, 81, 0.4);}
.cta-container {display: flex;gap: 20px;align-items: center;justify-content: center;flex-wrap: wrap;}
.login-link {color: var(--primary-color);text-decoration: none;font-size: 1.1rem;font-weight: 600;padding: 10px 20px;border: 2px solid var(--primary-color);border-radius: 50px;transition: all 0.3s ease;}
.login-link:hover {background: var(--primary-color);color: #FFFFFF;transform: translateY(-2px);}
section.contact-form-section {padding: 50px 20px;}
/* Form Container */
.form-container {max-width: 600px;margin: 0 auto;background: #fff;border: 2px solid #007F32;border-radius: 20px;padding: 40px;box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);}
span.text-light {color: #aaa;font-weight: normal;}
#assessmentForm label.form-label{color: #000;font-weight: 600;}
.form-title {text-align: center;font-size: 2rem;color: #007F32;margin-bottom: 30px;font-weight: 600;font-family: 'Montserrat', sans-serif;}
.form-group {margin-bottom: 25px;}
.form-label {display: block;color: #007F32;font-weight: 500;margin-bottom: 8px;font-size: 1rem;}
.form-input, .form-select {width: 100%;padding: 15px;background: #f8f9fa;border: 2px solid #e0e0e0;border-radius: 10px;color: #00002A;font-size: 1rem;transition: all 0.3s ease;}
.form-input:focus, .form-select:focus {outline: none;border-color: #007F32;background: rgba(255, 255, 255, 0.15);}
.form-input::placeholder {color: #718096;}
.form-select option {background: #f7fafc;color: #00002A;}
.form-input.error {border-color: #ff6b6b;}
.error-message {color: #ff6b6b;font-size: 0.9rem;margin-top: 5px;display: none;}
.error-message.show {display: block;}
/* Consent Section */
.consent-section {background: #f8f9fa;border-radius: 10px;padding: 20px;margin-bottom: 25px;}
.char-count.text-end {color: #999;}
.consent-checkbox {display: flex;align-items: flex-start;gap: 12px;margin-bottom: 15px;cursor: pointer;}
.consent-checkbox:last-child {margin-bottom: 0;}
.consent-checkbox input[type="checkbox"] {width: 15px;height: 15px;margin-top: 2px;cursor: pointer;accent-color: #007F32;}
.consent-checkbox span {flex: 1;color: #4a5568;font-size: 0.75rem;line-height: 1.5;}
.consent-required {color: #ff6b6b;}
.form-submit {width: 100%;background:var(--primary-color);color: #FFFFFF;border: none;padding: 18px;font-size: 1.2rem;font-weight: bold;border-radius: 10px;cursor: pointer;transition: all 0.3s ease;}
.form-submit:hover:not(:disabled) {transform: translateY(-2px);box-shadow: 0 10px 25px rgba(0, 166, 81, 0.3);}
.form-submit:disabled {opacity: 0.6;cursor: not-allowed;}
.trust-indicators {display: flex;justify-content: center;gap: 30px;margin-top: 30px;flex-wrap: wrap;}
.trust-item {display: flex;align-items: center;gap: 10px;color: #4a5568;font-size: 0.9rem;}
.trust-icon {color: #007F32;font-size: 1.2rem;}
/* Loading State */
.loading {display: none;text-align: center;padding: 20px;}
.spinner {border: 3px solid rgba(255, 255, 255, 0.3);border-top: 3px solid #007F32;border-radius: 50%;width: 40px;height: 40px;
animation: spin 1s linear infinite;margin: 0 auto 15px auto;}
@keyframes spin {0% { transform: rotate(0deg); }100% { transform: rotate(360deg); }}
/* Developer Panel (Demo Only) */
.dev-panel {position: fixed;bottom: 20px;right: 20px;width: 350px;max-height: 400px;background: #ffffff;border: 2px solid #007F32;border-radius: 10px;padding: 15px;overflow-y: auto;font-family: 'Courier New', monospace;font-size: 0.85rem;z-index: 9999;display: none;}
.dev-panel.show {display: block;}
.dev-panel h4 {color: #007F32;margin-bottom: 10px;font-size: 1rem;}
.dev-panel pre {color: #007F32;white-space: pre-wrap;word-wrap: break-word;line-height: 1.4;}
.dev-toggle {position: fixed;bottom: 20px;right: 20px;background: #007F32;color: #FFFFFF;border: none;padding: 10px 15px;border-radius: 5px;cursor: pointer;font-size: 0.85rem;z-index: 10000;}
/* Features & Stats Sections (keeping from original) */
.features {padding: 80px 0;background: var(--secondary-color);}
.features h2 {text-align: center;font-size: 2.5rem;color: #007F32;margin-bottom: 50px;}
.features-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));gap: 40px;}
.feature-card {background: #fff;border: 2px solid rgba(0, 166, 81, 0.3);border-radius: 20px;padding: 40px;text-align: center;transition: all 0.3s ease;}
.feature-card:hover {transform: translateY(-5px);border-color: #007F32;box-shadow: 0 15px 40px rgba(0, 166, 81, 0.2);}
.feature-icon {font-size: 4rem;margin-bottom: 20px;}
.feature-title {font-size: 1.5rem;color: #007F32;margin-bottom: 15px;}
.feature-description {color: #4a5568;}
/* Responsive */
.navbar {display: flex;justify-content: space-between;align-items: center;padding: 15px 30px;position: relative;}
.nav-links {list-style: none;display: flex;gap: 25px;}
.menu-toggle {display: none;font-size: 26px;cursor: pointer;}
.otp-input-group {
  margin-bottom: 20px;
  margin-top: 10px;
}
.PhoneCode {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}
.PhoneCode button.verification-btn.secondary {
  width: 30%;
  padding: 0 0;
  padding: 0 15px;
  background: #f0fdf4;
  color: var(--g1);
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  border: 1.5px solid #bbf7d0;
  transition: background .2s, border-color .2s;
}



.secure-box-container {
  text-align: center;
  padding: 20px;
}

.otp-input-field-group {
  display: flex;
  gap: 10px;
  justify-content: start;
  margin: 15px 0;
}


.new-digit-input {
font-weight: bold;
  text-align: center;
  outline: none;
  transition: all 0.2s ease-in-out;
  border-color: #22c55e;
  width: 50px;
  height: 55px;
  border: 1px solid #007f3275;
  background: #f4fff9;
  border-radius: 5px;
  padding: 0;
  font-size: 24px;
}

.new-digit-input:focus {
  border-color: #10b981;
  /* Green border on focus */
  box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.1);
}

.new-submit-style {
  background-color: #047857;
  color: white;
  padding: 14px 40px;
  border: none;
  border-radius: 10px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  margin-top: 10px;
}





.PhoneCode .phone-display {
  width: 100%;
  margin: 0;
}
.PhoneCode button.verification-btn.secondary {
  width: auto;
  padding: 0 10px;
}
/* 🔹 Mobile View */
@media (max-width: 1199px) {
.nav-links {gap: 10px;}
}
@media (max-width: 767px) {
  .new-digit-input {width: 35px;height: 35px;}
    .header {position: sticky;top: 0;background: #fff;}
    .menu-toggle {display: block;border: 1px solid #ddd;border-radius: 5px;padding: 0px 7px;}
    section.contact-form-section {padding: 30px 10px;}
    .nav-links {position: absolute;top: 65px;left: 0;width: 100%;background: #fff;flex-direction: column;align-items: center;overflow: hidden;max-height: 0;opacity: 0;transition: max-height 0.4s ease, opacity 0.3s ease;}
    .nav-links.active {max-height: 400px;opacity: 1;margin-top: 15px;}
    .nav-links li {padding: 10px 0 10px 20px;border-bottom: 1px solid #e9e9e9;width: 100%;}
    .hero {padding: 10px 0 20px;}
    .hero h1 {font-size: 2rem;}
    .hero .subtitle {font-size: 1.2rem;}
    .nav-links {margin-top: 0px;justify-content: flex-start;align-items: self-start;padding: 0 0 10px 0px;background: #f9f9f9;border-bottom: 1px solid #999;gap: 0;}
    .nav-links li:last-child {border: 0;display: inline-block;}
    .nav-links a{display: inline-block;}
    .form-container {margin: 0 auto;padding: 20px;}
    /* .trust-indicators {flex-direction: column;align-items: center;gap: 15px;} */
    .trust-indicators {flex-direction: column;align-items: baseline;gap: 15px;}
    .dev-panel {width: 90%;right: 5%;}
    .features h2 {font-size: 2rem;}
    .features {padding: 80px 0 20px;}
    .container {
    padding: 0 10px;
}
.phone-verification-section {
  padding: 15px;
}
.otp-input-group label {
  margin-top: 8px;
}

.logo {
    max-width: 85%;
}
header.header img.logo {
  max-height: 50px;
}
.features-grid {
    gap: 15px;
}
.form-title {
  font-size: 1.6rem;
}

}
.wizard-modal {position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 10000;display: flex;align-items: center;justify-content: center;}
.wizard-modal-overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: #f7fafc;backdrop-filter: blur(5px);}
.wizard-modal-content {position: relative;background: white;padding: 40px;border-radius: 20px;max-width: 700px;width: 90%;max-height: 85vh;overflow-y: auto;box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);animation: modalSlideIn 0.3s ease-out;}
@keyframes modalSlideIn {
    from { opacity: 0; transform: translateY(-30px); }to { opacity: 1; transform: translateY(0); }
}
/* Progress Indicator */
.wizard-progress {display: flex;align-items: center;justify-content: center;margin-bottom: 40px;}
.wizard-progress-dot {width: 14px;height: 14px;border-radius: 50%;background: #ddd;border: 2px solid #ddd;transition: all 0.3s ease;}
.wizard-progress-dot.active {background:  var(--primary-color);border-color:  var(--primary-color);box-shadow: 0 0 0 4px rgba(var(--primary-color), 0.2);}
.wizard-progress-dot.completed {background:  var(--primary-color);border-color:  var(--primary-color);}
.wizard-progress-line {width: 60px;height: 2px;background: #ddd;margin: 0 5px;}
/* Wizard Steps */
.wizard-step {min-height: 300px;}
.wizard-step h2 {margin: 0 0 10px 0;color: #1a1a1a;font-size: 1.8rem;}
.wizard-subtitle {color: #666;margin-bottom: 30px;font-size: 1rem;}
/* Checkbox Cards */
.wizard-checkboxes {display: grid;grid-template-columns: 1fr 1fr;gap: 15px;}
.wizard-checkbox-card {position: relative;cursor: pointer;}
.wizard-checkbox-card input[type="checkbox"] {position: absolute;opacity: 0;}

.checkbox-content {
background: linear-gradient(135deg, #f8f9fa, #ffffff);
border: 2px solid #e0e0e0;
border-radius: 12px;
padding: 20px;
text-align: center;
transition: all 0.3s ease;
display: flex;
flex-direction: column;
gap: 5px;
height: 100%;
}

.wizard-checkbox-card input[type="checkbox"]:checked + .checkbox-content {
border-color: var(--primary-color);
background: linear-gradient(135deg, #e8f5e9, #ffffff);
box-shadow: 0 5px 15px rgba(0, 166, 81, 0.2);
}

.checkbox-icon {
font-size: 32px;
margin-bottom: 8px;
}

.checkbox-label {
font-weight: 600;
color: #1a1a1a;
font-size: 1rem;
}

.checkbox-desc {
font-size: 0.85rem;
color: #666;
}

/* Form Groups */
.wizard-form-group {
margin-bottom: 25px;
}

.wizard-label {
display: block;
color: #1a1a1a;
font-weight: 600;
margin-bottom: 8px;
font-size: 1rem;
}

.wizard-tooltip {
font-size: 0.85rem;
color: #666;
font-weight: 400;
}

.wizard-input, .wizard-textarea {
width: 100%;
padding: 12px 15px;
background: #f8f9fa;
border: 2px solid #e0e0e0;
border-radius: 8px;
color: #1a1a1a;
font-size: 1rem;
transition: all 0.3s ease;
}

.wizard-input:focus, .wizard-textarea:focus {
outline: none;
border-color: #007F32;
background: white;
}

.wizard-textarea {
resize: vertical;
font-family: inherit;
}

/* Interface Options (Step 4) */
.interface-options {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
margin-top: 20px;
}

.interface-option {
background: linear-gradient(135deg, #f8f9fa, #ffffff);
border: 2px solid #e0e0e0;
border-radius: 15px;
padding: 30px 20px;
cursor: pointer;
transition: all 0.3s ease;
text-align: center;
}

.interface-option:hover {
transform: translateY(-5px);
border-color: var(--primary-color);
box-shadow: 0 10px 30px rgba(0, 166, 81, 0.2);
}

.interface-icon {
font-size: 48px;
margin-bottom: 15px;
}

.interface-option h3 {
margin: 0 0 10px 0;
color: #1a1a1a;
font-size: 1.3rem;
}

.interface-option p {
color: #666;
font-size: 0.9rem;
margin: 0 0 15px 0;
line-height: 1.5;
}

.interface-badge {
display: inline-block;
background: var(--primary-color);
color: #FFFFFF;
padding: 6px 12px;
border-radius: 20px;
font-size: 0.75rem;
font-weight: 600;
}

/* Navigation Buttons */
.wizard-nav {
display: flex;
justify-content: space-between;
gap: 15px;
margin-top: 40px;
padding-top: 30px;
border-top: 1px solid #e0e0e0;
}

.wizard-btn {
padding: 14px 30px;
border-radius: 8px;
font-size: 1rem;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
border: none;
}

.wizard-btn-back {
background: #f8f9fa;
color: #666;
border: 2px solid #e0e0e0;
}

.wizard-btn-back:hover {
background: #e9ecef;
border-color: #ccc;
}

.wizard-btn-next {
background: var(--primary-color);
color: #FFFFFF;
flex: 1;
max-width: 200px;
margin-left: auto;
}

.wizard-btn-next:hover {
transform: translateY(-2px);
box-shadow: 0 8px 20px rgba(0, 166, 81, 0.3);
}

/* Responsive */
@media (max-width: 600px) {
  .wizard-modal-content {padding: 25px;}
  .wizard-checkboxes {grid-template-columns: 1fr;}
  .interface-options {grid-template-columns: 1fr;}
  .wizard-progress-line {width: 30px;}
  .wizard-step h2 {font-size: 1.5rem;}
}
/* Preview Footer */
.preview-footer {text-align: center;padding: 40px 20px;background: var(--pa-midnight-navy);color: white;}
.preview-footer p {opacity: 0.8;font-size: 14px; }
/* Banner container */
.advisor-notice-banner {
  position: fixed;
  top: -60px; /* start hidden above viewport */
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  max-width: 900px;
  background: linear-gradient(90deg, #ff9a9e, #fecfef); /* soft warning gradient */
  color: #000;
  font-weight: 600;
  font-size: 1rem;
  padding: 12px 20px;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  text-align: center;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 15px;
  opacity: 0;
  animation: slideDown 0.8s forwards, pulse 2s infinite alternate;
  font-family: 'Segoe UI', sans-serif;
}

/* Banner text */
.advisor-notice-banner p {
  margin: 0;
  line-height: 1.2;
}

/* Close button */
.advisor-notice-banner .close-banner {
  cursor: pointer;
  font-weight: bold;
  font-size: 1.2rem;
  color: #000;
  opacity: 0.7;
  transition: opacity 0.2s;
}

.advisor-notice-banner .close-banner:hover {
  opacity: 1;
}

/* Slide down animation */
@keyframes slideDown {
  0% {
    top: -60px;
    opacity: 0;
  }
  100% {
    top: 20px;
    opacity: 1;
  }
}

/* Subtle pulse animation */
@keyframes pulse {
  0% { transform: translateX(-50%) scale(1); }
  50% { transform: translateX(-50%) scale(1.02); }
  100% { transform: translateX(-50%) scale(1); }
}

/* Optional: add a small bouncing effect every few seconds */
.animated-banner {
  animation: slideDown 0.8s forwards, pulse 2s infinite alternate;
}

/* Mobile adjustments */
@media (max-width: 768px) {
  .advisor-notice-banner {
    font-size: 0.9rem;
    padding: 10px 15px;
  }
    .preview-footer{
      padding: 15px;
    }
}