/* Variables — ensure modals render correctly on all pages */
:root {
  --navy-950:#0B1221;--navy-900:#0F1A2E;--navy-800:#152238;
  --teal-400:#2DD4A8;--teal-500:#10B981;--teal-300:#5EEAD4;
  --indigo-400:#818CF8;--indigo-500:#6366F1;--indigo-600:#4F46E5;
  --slate-50:#F8FAFC;--slate-100:#F1F5F9;--slate-200:#E2E8F0;--slate-300:#CBD5E1;
  --slate-400:#94A3B8;--slate-500:#64748B;--slate-600:#475569;
  --white:#FFFFFF;
  --red-500:#EF4444;
}

/* ===========================
   MODAL OVERLAY
   =========================== */
.cfr-modal-overlay{
  display:none;
  position:fixed;inset:0;z-index:10000;
  background:rgba(11,18,33,0.75);
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  align-items:center;justify-content:center;
  padding:24px;
  animation:cfr-fade-in 0.2s ease-out;
}
.cfr-modal-overlay.active{display:flex;}
@keyframes cfr-fade-in{from{opacity:0;}to{opacity:1;}}

/* ===========================
   MODAL CARD
   =========================== */
.cfr-modal{
  background:var(--white);
  border-radius:16px;
  max-width:440px;width:100%;
  overflow:hidden;
  box-shadow:0 25px 60px rgba(0,0,0,0.3),0 0 0 1px rgba(255,255,255,0.05);
  animation:cfr-modal-in 0.25s ease-out;
  position:relative;
}
@keyframes cfr-modal-in{from{opacity:0;transform:translateY(12px) scale(0.97);}to{opacity:1;transform:translateY(0) scale(1);}}

/* Close button */
.cfr-modal-close{
  position:absolute;top:16px;right:16px;
  width:32px;height:32px;border-radius:8px;
  border:none;background:transparent;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  color:var(--slate-400);transition:all 0.15s;z-index:1;
}
.cfr-modal-close:hover{background:var(--slate-100);color:var(--slate-600);}

/* Top accent bar */
.cfr-modal-accent{height:4px;width:100%;}
.cfr-modal-accent-teal{background:linear-gradient(90deg,var(--teal-400),var(--teal-300));}
.cfr-modal-accent-indigo{background:linear-gradient(90deg,var(--indigo-500),var(--indigo-400));}

/* Modal body */
.cfr-modal-body{padding:36px 32px 32px;}

/* Icon */
.cfr-modal-icon{
  width:52px;height:52px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:20px;
}
.cfr-modal-icon-teal{background:rgba(45,212,168,0.08);border:1px solid rgba(45,212,168,0.15);}
.cfr-modal-icon-indigo{background:rgba(99,102,241,0.06);border:1px solid rgba(99,102,241,0.12);}

/* Heading */
.cfr-modal h2{
  font-family:'Instrument Serif',serif;font-weight:400;
  font-size:26px;color:var(--navy-950);
  line-height:1.25;margin-bottom:8px;
}
.cfr-modal h2 em{font-style:italic;}
.cfr-modal-h2-teal em{color:var(--teal-500);}
.cfr-modal-h2-indigo em{color:var(--indigo-500);}

/* Description */
.cfr-modal-desc{
  font-size:14px;color:var(--slate-500);
  line-height:1.6;margin-bottom:24px;
}

/* Features */
.cfr-modal-features{
  display:flex;flex-direction:column;gap:8px;
  margin-bottom:24px;
}
.cfr-modal-feature{
  display:flex;align-items:center;gap:8px;
  font-size:13px;color:var(--slate-600);
}
.cfr-modal-feature svg{flex-shrink:0;}

/* Form */
.cfr-modal-form{display:flex;flex-direction:column;gap:10px;}
.cfr-modal-input{
  width:100%;padding:13px 16px;
  border-radius:10px;
  border:1.5px solid var(--slate-200);
  background:#FFFFFF !important;
  color:#0B1221 !important;
  font-size:15px;font-family:'DM Sans',sans-serif;
  outline:none;transition:border-color 0.2s;
}
.cfr-modal-input::placeholder{color:var(--slate-400);}
.cfr-modal-input:focus{border-color:var(--slate-400);}
.cfr-modal-input-teal:focus{border-color:var(--teal-400);}
.cfr-modal-input-indigo:focus{border-color:var(--indigo-500);}
.cfr-modal-input.error{border-color:var(--red-500);}

/* Error message */
.cfr-modal-error{
  font-size:12px;color:var(--red-500);
  display:none;margin-top:-4px;
}
.cfr-modal-error.show{display:block;}

/* Submit button */
.cfr-modal-submit{
  width:100%;padding:14px 24px;
  border-radius:10px;border:none;
  font-size:15px;font-weight:700;
  font-family:'DM Sans',sans-serif;
  cursor:pointer;transition:all 0.15s;
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.cfr-modal-submit:disabled{opacity:0.7;cursor:not-allowed;}
.cfr-modal-submit-teal{background:var(--teal-400);color:var(--navy-950);}
.cfr-modal-submit-teal:hover:not(:disabled){background:#5ee0c0;box-shadow:0 4px 20px rgba(45,212,168,0.25);}
.cfr-modal-submit-indigo{background:var(--indigo-500);color:var(--white);}
.cfr-modal-submit-indigo:hover:not(:disabled){background:var(--indigo-600);box-shadow:0 4px 20px rgba(99,102,241,0.25);}

/* Spinner */
.cfr-modal-spinner{display:none;width:18px;height:18px;border:2.5px solid transparent;border-top-color:currentColor;border-radius:50%;animation:cfr-spin 0.6s linear infinite;}
.cfr-modal-submit.loading .cfr-modal-spinner{display:block;}
.cfr-modal-submit.loading .cfr-modal-submit-text{display:none;}
@keyframes cfr-spin{to{transform:rotate(360deg);}}

/* Privacy note */
.cfr-modal-privacy{
  font-size:12px;color:var(--slate-400);
  text-align:center;margin-top:6px;line-height:1.5;
}
.cfr-modal-privacy a{color:var(--slate-500);text-decoration:underline;}

/* Trust signals */
.cfr-modal-trust{
  display:flex;align-items:center;justify-content:center;gap:16px;
  margin-top:20px;padding-top:20px;
  border-top:1px solid var(--slate-100);
}
.cfr-modal-trust-item{
  display:flex;align-items:center;gap:5px;
  font-size:11px;color:var(--slate-400);
  font-weight:500;
}
.cfr-modal-trust-item svg{flex-shrink:0;}

/* ===========================
   RESPONSIVE
   =========================== */
@media(max-width:480px){
  .cfr-modal-body{padding:28px 24px 24px;}
  .cfr-modal h2{font-size:22px;}
  .cfr-modal-trust{flex-direction:column;gap:8px;}
}
