/* ============================
   FindMyFunding.ai - Stylesheet
   ============================ */
/* Fonts loaded via non-blocking <link> in each HTML page */

/* ── Variables ── */
:root {
  --bg:        #0a0a0a;
  --bg2:       #111111;
  --card:      #1a1a1a;
  --card2:     #222222;
  --input:     #252525;
  --border:    #2a2a2a;
  --border2:   #333333;
  --green:     #22c55e;
  --green-d:   #16a34a;
  --green-glow:rgba(34,197,94,.18);
  --red:       #ef4444;
  --orange:    #f97316;
  --yellow:    #eab308;
  --txt:       #ffffff;
  --txt2:      #9ca3af;
  --txt3:      #6b7280;
  --r:         12px;
  --r-sm:      8px;
  --r-lg:      18px;
  --shadow:    0 4px 24px rgba(0,0,0,.5);
  --t:         .2s ease;
}

/* ── Preloader ── */
/* ═══════════════════════════════════════════
   PREMIUM 3D PRELOADER
═══════════════════════════════════════════ */
#preloader {
  position: fixed; inset: 0; z-index: 99999; overflow: hidden;
  background: radial-gradient(ellipse at 50% 40%, #0b1120 0%, #060810 55%, #020408 100%);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  transition: opacity 0.8s ease, transform 0.9s cubic-bezier(0.76,0,0.24,1);
}
#preloader.hide { opacity: 0; transform: translateY(-6px); pointer-events: none; }

/* Dot-grid background */
.pre-grid {
  position: absolute; inset: 0; z-index: 0;
  background-image: radial-gradient(circle, rgba(34,197,94,.07) 1px, transparent 1px);
  background-size: 28px 28px;
  animation: preGridFade 1s ease forwards;
}
@keyframes preGridFade { from { opacity:0 } to { opacity:1 } }

/* Scanning light sweep */
.pre-scan {
  position: absolute; left: 0; right: 0; height: 1px; z-index: 1;
  background: linear-gradient(90deg, transparent 0%, rgba(34,197,94,.5) 40%, rgba(34,197,94,.9) 50%, rgba(34,197,94,.5) 60%, transparent 100%);
  animation: preScan 3s ease-in-out infinite;
  opacity: 0;
}
@keyframes preScan {
  0%   { top: -2px; opacity: 0; }
  5%   { opacity: 1; }
  95%  { opacity: .6; }
  100% { top: 100%; opacity: 0; }
}

/* Corner brackets */
.pre-corner {
  position: absolute; width: 28px; height: 28px; z-index: 2;
  animation: preCornerIn .6s cubic-bezier(0.34,1.56,0.64,1) .1s both;
}
.pre-corner-tl { top: 28px; left: 28px; border-top: 1.5px solid rgba(34,197,94,.55); border-left: 1.5px solid rgba(34,197,94,.55); }
.pre-corner-tr { top: 28px; right: 28px; border-top: 1.5px solid rgba(34,197,94,.55); border-right: 1.5px solid rgba(34,197,94,.55); }
.pre-corner-bl { bottom: 28px; left: 28px; border-bottom: 1.5px solid rgba(34,197,94,.55); border-left: 1.5px solid rgba(34,197,94,.55); }
.pre-corner-br { bottom: 28px; right: 28px; border-bottom: 1.5px solid rgba(34,197,94,.55); border-right: 1.5px solid rgba(34,197,94,.55); }
@keyframes preCornerIn { from { opacity:0; transform: scale(.5) } to { opacity:1; transform: scale(1) } }

/* Top counter bar */
.pre-counter-bar {
  position: absolute; top: 28px; left: 50%; transform: translateX(-50%);
  font-size: .65rem; font-weight: 700; letter-spacing: .18em; color: rgba(34,197,94,.5);
  z-index: 5; animation: preFadeUp .5s ease .3s both;
}

/* ── Center content ── */
.pre-center { position: relative; z-index: 3; display: flex; flex-direction: column; align-items: center; gap: 0; }

/* 3D logo scene */
.pre-3d-scene {
  perspective: 900px; perspective-origin: 50% 60%;
  width: 160px; height: 160px; display: flex; align-items: center; justify-content: center; position: relative;
}
.pre-logo-card {
  position: relative; display: flex; align-items: center; justify-content: center;
  animation: logo3DEnter 1.1s cubic-bezier(0.34,1.4,0.64,1) 0.15s both;
}
@keyframes logo3DEnter {
  0%   { opacity:0; transform: perspective(900px) rotateX(75deg) rotateY(-20deg) translateY(-80px) scale(.6); }
  65%  { opacity:1; transform: perspective(900px) rotateX(-4deg) rotateY(3deg) translateY(4px) scale(1.04); }
  100% { opacity:1; transform: perspective(900px) rotateX(0deg) rotateY(0deg) translateY(0) scale(1); }
}

/* Outer glow ring */
.pre-glow-ring {
  position: absolute; inset: -22px; border-radius: 50%;
  background: radial-gradient(circle, rgba(34,197,94,.16) 0%, transparent 68%);
  animation: preGlowPulse 2.2s ease-in-out infinite;
}
/* Spinning arc ring */
.pre-arc {
  position: absolute; inset: -18px; border-radius: 50%;
  border: 1px solid transparent;
  border-top-color: rgba(34,197,94,.7);
  border-right-color: rgba(34,197,94,.15);
  animation: preArcSpin 2s linear infinite;
}
.pre-arc-2 {
  position: absolute; inset: -10px; border-radius: 50%;
  border: 1px solid transparent;
  border-bottom-color: rgba(34,197,94,.4);
  border-left-color: transparent;
  animation: preArcSpin 1.3s linear infinite reverse;
}
@keyframes preArcSpin   { to { transform: rotate(360deg); } }
@keyframes preGlowPulse { 0%,100% { opacity:.7; transform:scale(1); } 50% { opacity:1; transform:scale(1.12); } }

/* Logo image */
.pre-logo {
  width: 92px; height: 92px; object-fit: contain; position: relative; z-index: 2;
  filter: drop-shadow(0 0 18px rgba(34,197,94,.55)) drop-shadow(0 8px 24px rgba(0,0,0,.8));
}

/* Shadow on "floor" under logo */
.pre-logo-shadow {
  width: 70px; height: 10px; margin-top: 2px;
  background: radial-gradient(ellipse, rgba(34,197,94,.35) 0%, transparent 70%);
  animation: shadowPulse 2.2s ease-in-out infinite;
}
@keyframes shadowPulse { 0%,100% { opacity:.6; transform:scaleX(1); } 50% { opacity:1; transform:scaleX(1.15); } }

/* Brand name */
.pre-brand {
  margin-top: 28px;
  font-size: 1.55rem; font-weight: 800; letter-spacing: .04em; line-height: 1;
  animation: preFadeUp .7s cubic-bezier(0.34,1.4,0.64,1) .85s both;
}
.pre-brand-find    { color: #fff; }
.pre-brand-funding { color: #22c55e; }
.pre-brand-ai      { color: rgba(34,197,94,.6); font-size: 1.1rem; }

/* Tagline */
.pre-tagline {
  margin-top: 10px;
  font-size: .7rem; letter-spacing: .16em; text-transform: uppercase;
  color: rgba(255,255,255,.28); font-weight: 600;
  animation: preFadeUp .7s ease 1.2s both;
}

/* Thin divider line */
.pre-divider {
  width: 240px; height: 1px; background: rgba(255,255,255,.04); margin: 22px 0 16px;
  position: relative; overflow: hidden;
  animation: preFadeUp .5s ease 1.4s both;
}
.pre-divider-inner {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(34,197,94,.6), transparent);
  animation: preDivSweep 1.2s ease 1.5s both;
}
@keyframes preDivSweep { from { transform: translateX(-100%) } to { transform: translateX(100%) } }

/* Status row */
.pre-status-row {
  display: flex; align-items: center; justify-content: space-between;
  width: 240px; animation: preFadeUp .5s ease 1.5s both;
}
.pre-status-text {
  font-size: .64rem; letter-spacing: .1em; text-transform: uppercase;
  color: rgba(255,255,255,.25); font-weight: 600;
}
.pre-pct {
  font-size: .64rem; letter-spacing: .08em;
  color: rgba(34,197,94,.65); font-weight: 700; font-variant-numeric: tabular-nums;
}

/* Bottom progress bar */
.pre-prog-wrap {
  position: absolute; bottom: 0; left: 0; right: 0; height: 2px;
  background: rgba(255,255,255,.04);
}
.pre-prog-fill {
  height: 100%; width: 0;
  background: linear-gradient(90deg, #16a34a, #22c55e, #86efac);
  box-shadow: 0 0 12px rgba(34,197,94,.8);
  animation: preBarFill 3s cubic-bezier(0.4,0,0.2,1) forwards;
}
@keyframes preBarFill { 0%{width:0} 50%{width:65%} 80%{width:88%} 100%{width:100%} }

/* Particles canvas */
#pre-canvas { position:absolute; inset:0; z-index:1; pointer-events:none; }

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

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; scroll-behavior: smooth; }
body { background: var(--bg); color: var(--txt); font-family: 'DM Sans', sans-serif; line-height: 1.6; min-height: 100vh; -webkit-font-smoothing: antialiased; }
h1,h2,h3,h4,h5 { font-family: 'Space Grotesk', sans-serif; line-height: 1.25; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; }
button { font-family: inherit; cursor: pointer; border: none; outline: none; }
input, textarea, select { font-family: inherit; outline: none; }
ul { list-style: none; }

/* ── Scrollbar ── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--bg2); }
::-webkit-scrollbar-thumb { background: var(--border2); border-radius: 3px; }

/* ── Logo ── */
.logo { display: flex; align-items: center; gap: 10px; font-family: 'Space Grotesk', sans-serif; font-size: 1.15rem; font-weight: 700; color: var(--txt); cursor: pointer; }
.logo svg { flex-shrink: 0; }
.logo img { flex-shrink: 0; height: 28px; width: auto; object-fit: contain; }
.logo span em { font-style: normal; color: var(--green); }

/* ── Buttons ── */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 24px; border-radius: var(--r-sm); font-size: .95rem; font-weight: 600; transition: all var(--t); cursor: pointer; border: none; white-space: nowrap; }
.btn-primary { background: var(--green); color: #000; }
.btn-primary:hover { background: var(--green-d); }
.btn-secondary { background: var(--card2); color: var(--txt); border: 1px solid var(--border2); }
.btn-secondary:hover { background: var(--border2); }
.btn-outline { background: transparent; color: var(--txt); border: 1px solid var(--border2); }
.btn-outline:hover { background: var(--card); border-color: var(--green); color: var(--green); }
.btn-ghost { background: transparent; color: var(--txt2); padding: 8px 14px; font-size: .875rem; }
.btn-ghost:hover { color: var(--txt); background: var(--card); border-radius: var(--r-sm); }
.btn-sm { padding: 8px 16px; font-size: .85rem; }
.btn-lg { padding: 14px 32px; font-size: 1rem; }
.btn-full { width: 100%; }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn-danger { background: transparent; color: var(--red); border: 1px solid var(--red); }
.btn-danger:hover { background: rgba(239,68,68,.1); }

/* ── Forms ── */
.form-group { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
.form-label { font-size: .875rem; font-weight: 500; color: var(--txt2); }
.form-input { background: var(--input); border: 1px solid var(--border2); border-radius: var(--r-sm); padding: 12px 14px; color: var(--txt); font-size: .95rem; transition: border-color var(--t), box-shadow var(--t); width: 100%; }
.form-input::placeholder { color: var(--txt3); }
.form-input:focus { border-color: var(--green); box-shadow: 0 0 0 3px var(--green-glow); }
.form-input.error { border-color: var(--red); }
.form-input.error:focus { box-shadow: 0 0 0 3px rgba(239,68,68,.15); }
.form-error { font-size: .8rem; color: var(--red); display: flex; align-items: center; gap: 4px; }
.form-hint { font-size: .8rem; color: var(--txt3); }
textarea.form-input { resize: vertical; min-height: 120px; }
select.form-input { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; background-size: 16px; padding-right: 40px; cursor: pointer; }
select.form-input option { background: var(--card2); }

/* ── Checkbox ── */
.checkbox-wrap { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; }
.checkbox-wrap input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--green); margin-top: 2px; flex-shrink: 0; cursor: pointer; }
.checkbox-wrap span { font-size: .875rem; color: var(--txt2); }
.checkbox-wrap a { color: var(--green); }

/* ── Cards ── */
.card { background: var(--card); border: 1px solid var(--border); border-radius: var(--r); padding: 24px; }
.card-hover { transition: border-color var(--t), box-shadow var(--t); cursor: pointer; }
.card-hover:hover { border-color: var(--border2); box-shadow: var(--shadow); }

/* ── Badges ── */
.badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 100px; font-size: .75rem; font-weight: 600; }
.badge-green { background: rgba(34,197,94,.15); color: var(--green); }
.badge-red { background: rgba(239,68,68,.15); color: var(--red); }
.badge-orange { background: rgba(249,115,22,.15); color: var(--orange); }
.badge-yellow { background: rgba(234,179,8,.15); color: var(--yellow); }
.badge-gray { background: var(--card2); color: var(--txt2); }
.badge-blue { background: rgba(59,130,246,.15); color: #60a5fa; }

/* ── Chips (pill selectors) ── */
.chip-group { display: flex; flex-wrap: wrap; gap: 10px; }
.chip { padding: 8px 16px; border-radius: 100px; border: 1px solid var(--border2); background: var(--card2); color: var(--txt2); font-size: .875rem; cursor: pointer; transition: all var(--t); }
.chip:hover { border-color: var(--green); color: var(--green); }
.chip.active { background: var(--green-glow); border-color: var(--green); color: var(--green); font-weight: 600; }

/* ── Progress Bar ── */
.progress-track { height: 4px; background: var(--border2); border-radius: 2px; overflow: hidden; }
.progress-fill { height: 100%; background: var(--green); border-radius: 2px; transition: width .4s ease; }

/* ── Step indicator ── */
.step-label { font-size: .8rem; color: var(--txt3); margin-bottom: 8px; }

/* ── Divider ── */
.divider { border: none; border-top: 1px solid var(--border); margin: 20px 0; }

/* ── Split Layout (auth pages) ── */
.split { display: grid; grid-template-columns: 1fr 1fr; min-height: 100vh; }
.split-left { display: flex; flex-direction: column; padding: 40px 56px; }
.split-right { background: linear-gradient(135deg, #0a1a0f 0%, #0d2318 50%, #0a1510 100%); position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; padding: 56px; }
.split-right::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 80% 60% at 60% 40%, rgba(34,197,94,.12) 0%, transparent 70%); }
.split-right::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 30% 80%, rgba(34,197,94,.06) 0%, transparent 50%); }
.split-right-content { position: relative; z-index: 1; }
.split-right-tagline { font-family: 'Space Grotesk', sans-serif; font-size: 2.6rem; font-weight: 700; line-height: 1.2; color: var(--txt); }
.split-right-tagline em { font-style: normal; color: var(--green); }
.split-right-sub { font-size: 1rem; color: var(--txt2); margin-top: 16px; line-height: 1.7; max-width: 380px; }

/* Money graphic decoration */
.money-graphic { position: absolute; right: -40px; bottom: 60px; width: 320px; height: 320px; border-radius: 50%; background: radial-gradient(circle, rgba(34,197,94,.08) 0%, transparent 70%); border: 1px solid rgba(34,197,94,.1); }
.money-graphic::before { content: ''; position: absolute; inset: 30px; border-radius: 50%; background: radial-gradient(circle, rgba(34,197,94,.06) 0%, transparent 70%); border: 1px solid rgba(34,197,94,.08); }

.split-left-inner { flex: 1; display: flex; flex-direction: column; justify-content: center; max-width: 420px; }
.split-nav { display: flex; align-items: center; justify-content: space-between; margin-bottom: 48px; }
.auth-title { font-size: 1.75rem; font-weight: 700; margin-bottom: 8px; }
.auth-sub { color: var(--txt2); font-size: .95rem; margin-bottom: 32px; }
.auth-footer { margin-top: 24px; text-align: center; font-size: .875rem; color: var(--txt3); }
.auth-footer a { color: var(--green); cursor: pointer; }
.auth-footer a:hover { text-decoration: underline; }
.auth-link { color: var(--green); font-size: .875rem; cursor: pointer; }
.auth-link:hover { text-decoration: underline; }
.terms-footer { margin-top: auto; padding-top: 24px; font-size: .75rem; color: var(--txt3); text-align: center; }
.terms-footer a { color: var(--txt2); }
.terms-footer a:hover { color: var(--green); }

/* ── OTP Inputs ── */
.otp-group { display: flex; gap: 10px; justify-content: center; margin: 24px 0; }
.otp-input { width: 52px; height: 56px; text-align: center; font-size: 1.4rem; font-weight: 700; background: var(--input); border: 1px solid var(--border2); border-radius: var(--r-sm); color: var(--txt); transition: border-color var(--t), box-shadow var(--t); }
.otp-input:focus { border-color: var(--green); box-shadow: 0 0 0 3px var(--green-glow); }
.otp-input.filled { border-color: var(--green); }
.otp-input.error { border-color: var(--red); }
.otp-separator { display: flex; align-items: center; color: var(--txt3); font-size: 1.2rem; }

/* ── Password rules ── */
.pw-rules { background: var(--card2); border: 1px solid var(--border); border-radius: var(--r-sm); padding: 14px 16px; margin: 8px 0; }
.pw-rule { display: flex; align-items: center; gap: 8px; font-size: .8rem; color: var(--txt3); padding: 2px 0; transition: color var(--t); }
.pw-rule.met { color: var(--green); }
.pw-rule-icon { width: 14px; height: 14px; flex-shrink: 0; }

/* ── Success modal ── */
.modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.7); display: flex; align-items: center; justify-content: center; z-index: 1000; opacity: 0; pointer-events: none; transition: opacity var(--t); }
.modal-overlay.show { opacity: 1; pointer-events: all; }
.modal { background: var(--card); border: 1px solid var(--border2); border-radius: var(--r-lg); padding: 40px; text-align: center; max-width: 420px; width: 90%; }
.modal-icon { width: 64px; height: 64px; border-radius: 50%; background: rgba(34,197,94,.15); display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; }
.modal-title { font-size: 1.4rem; font-weight: 700; margin-bottom: 8px; }
.modal-sub { color: var(--txt2); font-size: .9rem; margin-bottom: 24px; }

/* ── Onboarding ── */
.onboard-wrap { min-height: 100vh; display: flex; flex-direction: column; }
.onboard-header { padding: 24px 40px; border-bottom: 1px solid var(--border); display: flex; align-items: center; }
.onboard-body { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px 24px; }
.onboard-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 48px 56px; max-width: 640px; width: 100%; }
.onboard-step-q { font-size: 1.6rem; font-weight: 700; margin-bottom: 8px; }
.onboard-step-hint { color: var(--txt2); font-size: .9rem; margin-bottom: 28px; }
.why-matters { background: var(--card2); border-radius: var(--r-sm); padding: 12px 16px; margin-top: 20px; font-size: .82rem; color: var(--txt3); }
.why-matters strong { color: var(--txt2); }
.stage-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.stage-card { background: var(--card2); border: 2px solid var(--border2); border-radius: var(--r); padding: 20px; cursor: pointer; transition: all var(--t); }
.stage-card:hover { border-color: var(--green); }
.stage-card.active { border-color: var(--green); background: var(--green-glow); }
.stage-card-title { font-weight: 700; font-size: 1rem; margin-bottom: 4px; }
.stage-card-desc { font-size: .8rem; color: var(--txt3); }
.range-cards { display: flex; flex-direction: column; gap: 12px; }
.range-card { background: var(--card2); border: 2px solid var(--border2); border-radius: var(--r); padding: 18px 20px; cursor: pointer; transition: all var(--t); display: flex; justify-content: space-between; align-items: center; }
.range-card:hover { border-color: var(--green); }
.range-card.active { border-color: var(--green); background: var(--green-glow); }
.range-card-title { font-weight: 700; font-size: 1.05rem; }
.range-card-desc { font-size: .8rem; color: var(--txt3); margin-top: 2px; }
.onboard-nav { display: flex; align-items: center; justify-content: space-between; margin-top: 32px; }

/* ── Setup / Loading ── */
.setup-wrap { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 32px; }
.spinner { width: 56px; height: 56px; border: 3px solid var(--border2); border-top-color: var(--green); border-radius: 50%; animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.setup-steps { display: flex; flex-direction: column; gap: 12px; width: 320px; }
.setup-step { display: flex; align-items: center; gap: 12px; font-size: .9rem; color: var(--txt3); transition: color var(--t); }
.setup-step.active { color: var(--txt); }
.setup-step.done { color: var(--green); }
.setup-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--border2); flex-shrink: 0; transition: background var(--t); }
.setup-step.active .setup-dot { background: var(--green); box-shadow: 0 0 8px var(--green); animation: pulse 1s ease infinite; }
.setup-step.done .setup-dot { background: var(--green); }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .4; } }

/* ── Pricing Page ── */
.pricing-wrap { min-height: 100vh; display: flex; flex-direction: column; padding: 40px; }
.pricing-header { text-align: center; margin-bottom: 48px; }
.pricing-title { font-size: 2rem; font-weight: 700; margin-bottom: 8px; }
.pricing-sub { color: var(--txt2); font-size: .95rem; }
.pricing-cards { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 24px; max-width: 1100px; margin: 0 auto; width: 100%; }
.plan-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 36px; position: relative; }
.plan-card.featured { border-color: var(--green); }
.plan-card.vip { border-color: #8b5cf6; }
.plan-badge { position: absolute; top: -13px; left: 50%; transform: translateX(-50%); background: var(--green); color: #000; font-size: .75rem; font-weight: 700; padding: 4px 14px; border-radius: 100px; }
.plan-badge.vip-badge { background: linear-gradient(90deg, #7c3aed, #8b5cf6); color: #fff; }
.plan-label { font-size: .75rem; font-weight: 700; letter-spacing: .08em; color: var(--txt3); margin-bottom: 12px; text-transform: uppercase; }
.plan-price { font-size: 2.5rem; font-weight: 700; margin-bottom: 4px; }
.plan-price sup { font-size: 1rem; vertical-align: top; margin-top: 8px; }
.plan-price-note { font-size: .85rem; color: var(--txt3); margin-bottom: 20px; }
.plan-divider { border: none; border-top: 1px solid var(--border); margin: 20px 0; }
.plan-features { display: flex; flex-direction: column; gap: 10px; margin-bottom: 28px; }
.plan-feature { display: flex; align-items: center; gap: 10px; font-size: .875rem; }
.plan-feature.locked { color: rgba(34,197,94,.55); }
.feat-icon { width: 18px; height: 18px; flex-shrink: 0; }
.pricing-footer { text-align: center; margin-top: 24px; font-size: .8rem; color: var(--txt3); }
.pricing-footer span { margin: 0 8px; }

/* ── Dashboard Layout ── */
.dash-layout { display: flex; flex-direction: column; height: 100vh; overflow: hidden; }
.dash-navbar { background: var(--bg2); border-bottom: 1px solid var(--border); padding: 0 24px; display: flex; align-items: center; gap: 4px; height: 60px; flex-shrink: 0; position: relative; z-index: 100; }
.dash-nav-logo { margin-right: 16px; }
.dash-nav-tabs { display: flex; align-items: center; gap: 2px; flex: 1; overflow-x: auto; }
.dash-nav-tabs::-webkit-scrollbar { display: none; }
.nav-tab { padding: 8px 14px; font-size: .85rem; font-weight: 500; color: var(--txt3); cursor: pointer; border-radius: var(--r-sm); transition: all var(--t); white-space: nowrap; border: none; background: none; }
.nav-tab:hover { color: var(--txt); background: var(--card); }
.nav-tab.active { color: var(--green); background: var(--green-glow); }
.dash-nav-right { margin-left: auto; display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.avatar-btn { width: 36px; height: 36px; border-radius: 50%; background: var(--green); color: #000; font-weight: 700; font-size: .9rem; display: flex; align-items: center; justify-content: center; cursor: pointer; border: none; flex-shrink: 0; }
.avatar-dropdown { position: absolute; top: 56px; right: 24px; background: var(--card); border: 1px solid var(--border2); border-radius: var(--r); padding: 8px; min-width: 220px; z-index: 200; box-shadow: var(--shadow); display: none; }
.avatar-dropdown.show { display: block; }
.dropdown-header { padding: 10px 12px; border-bottom: 1px solid var(--border); margin-bottom: 4px; }
.dropdown-name { font-weight: 700; font-size: .95rem; }
.dropdown-email { font-size: .8rem; color: var(--txt3); }
.dropdown-item { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: var(--r-sm); font-size: .875rem; color: var(--txt2); cursor: pointer; transition: all var(--t); }
.dropdown-item:hover { background: var(--card2); color: var(--txt); }
.dropdown-item.danger { color: var(--red); }
.dropdown-item.danger:hover { background: rgba(239,68,68,.1); }
.dropdown-sep { border: none; border-top: 1px solid var(--border); margin: 4px 0; }
.dash-body { flex: 1; overflow-y: auto; }
.tab-section { display: none; padding: 32px; }
.tab-section.active { display: block; }

/* ── Dashboard Home ── */
.dash-welcome { margin-bottom: 28px; }
.dash-welcome h2 { font-size: 1.6rem; font-weight: 700; }
.dash-welcome p { color: var(--txt2); font-size: .95rem; margin-top: 4px; }
.stat-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-bottom: 28px; }
.stat-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--r); padding: 24px; }
.stat-icon { width: 40px; height: 40px; border-radius: var(--r-sm); display: flex; align-items: center; justify-content: center; margin-bottom: 14px; }
.stat-icon.green { background: rgba(34,197,94,.15); }
.stat-icon.blue { background: rgba(59,130,246,.15); }
.stat-icon.purple { background: rgba(168,85,247,.15); }
.stat-value { font-size: 1.8rem; font-weight: 700; }
.stat-label { font-size: .85rem; color: var(--txt3); margin-top: 4px; }
.quick-actions { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.quick-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--r); padding: 24px; cursor: pointer; transition: all var(--t); display: flex; flex-direction: column; gap: 10px; }
.quick-card:hover { border-color: var(--green); box-shadow: 0 0 0 1px var(--green); }
.quick-card h4 { font-weight: 700; font-size: 1rem; }
.quick-card p { font-size: .85rem; color: var(--txt3); }

/* ── Grants Section ── */
.section-header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 24px; gap: 16px; }
.section-title { font-size: 1.4rem; font-weight: 700; }
.section-sub { color: var(--txt2); font-size: .875rem; margin-top: 4px; }
.search-bar { display: flex; align-items: center; gap: 10px; margin-bottom: 24px; }
.search-input-wrap { position: relative; flex: 1; }
.search-input-wrap svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--txt3); }
.search-input { background: var(--input); border: 1px solid var(--border2); border-radius: var(--r-sm); padding: 11px 14px 11px 42px; color: var(--txt); font-size: .9rem; width: 100%; transition: border-color var(--t); }
.search-input:focus { border-color: var(--green); outline: none; }
.search-input::placeholder { color: var(--txt3); }
.grants-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); gap: 16px; }
.grant-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--r); padding: 24px; transition: border-color var(--t); }
.grant-card:hover { border-color: var(--border2); }
.grant-card-top { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 10px; gap: 12px; }
.grant-org { font-size: .8rem; color: var(--txt3); margin-bottom: 4px; }
.grant-title { font-size: 1.05rem; font-weight: 700; }
.grant-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.grant-match { font-size: .8rem; color: var(--green); font-weight: 600; margin: 6px 0; }
.grant-desc { font-size: .875rem; color: var(--txt2); margin: 8px 0; line-height: 1.6; }
.grant-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 16px; flex-wrap: wrap; gap: 12px; }
.grant-amount { font-size: .875rem; font-weight: 700; color: var(--txt); }
.grant-actions { display: flex; gap: 8px; flex-wrap: wrap; }
/* ── Expert Modal ── */
.expert-overlay { position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:16px; }
.expert-modal { background:var(--card);border:1px solid var(--border);border-radius:16px;width:100%;max-width:580px;max-height:90vh;overflow-y:auto;padding:28px;position:relative;box-shadow:0 24px 64px rgba(0,0,0,.5); }
.expert-close-btn { position:absolute;top:16px;right:16px;background:var(--card2);border:1px solid var(--border);border-radius:8px;width:34px;height:34px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--txt2);transition:all .15s; }
.expert-close-btn:hover { background:var(--border);color:var(--txt); }
.expert-modal-header { display:flex;align-items:center;gap:14px;margin-bottom:20px; }
.expert-modal-icon { width:46px;height:46px;border-radius:12px;background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.25);display:flex;align-items:center;justify-content:center;flex-shrink:0; }
.expert-modal-title { font-size:1.15rem;font-weight:800; }
.expert-modal-sub { font-size:.8rem;color:var(--txt3);margin-top:2px; }
.expert-grant-info { margin-bottom:18px; }
.expert-grant-tag { display:flex;align-items:center;gap:6px;background:rgba(34,197,94,.07);border:1px solid rgba(34,197,94,.2);border-radius:8px;padding:10px 14px;font-size:.82rem;flex-wrap:wrap; }
.expert-form-grid { display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:20px; }
.expert-field { display:flex;flex-direction:column;gap:6px; }
.expert-field label { font-size:.75rem;font-weight:600;color:var(--txt3);text-transform:uppercase;letter-spacing:.04em; }
.expert-field input { background:var(--card2);border:1px solid var(--border);border-radius:8px;padding:10px 12px;font-size:.875rem;color:var(--txt);outline:none;transition:border-color .15s;font-family:inherit; }
.expert-field input:focus { border-color:var(--green); }
.expert-field input[readonly] { color:var(--txt2);cursor:default;opacity:.8; }
.expert-submit-btn { width:100%;padding:13px;font-size:.95rem;font-weight:700;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:10px; }
@media(max-width:520px){ .expert-form-grid{grid-template-columns:1fr;} }

.filter-panel { position: relative; z-index: 50; margin-bottom: 16px; }
.filter-panel-inner { background: var(--card); border: 1px solid var(--border); border-radius: var(--r); padding: 20px; display: flex; flex-direction: column; gap: 16px; }
.filter-group { display: flex; flex-direction: column; gap: 8px; }
.filter-group-title { font-size: .75rem; font-weight: 700; color: var(--txt3); text-transform: uppercase; letter-spacing: .05em; }
.filter-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.fchip { font-size: .8rem; padding: 5px 12px; border-radius: 20px; border: 1px solid var(--border); background: var(--card2); color: var(--txt2); cursor: pointer; transition: all .15s; user-select: none; }
.fchip:hover { border-color: var(--green); color: var(--txt); }
.fchip.active { background: rgba(34,197,94,.12); border-color: var(--green); color: var(--green); font-weight: 600; }
.filter-actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: 8px; border-top: 1px solid var(--border); }
.filter-count { background: var(--green); color: #000; font-size: .7rem; font-weight: 700; border-radius: 99px; padding: 1px 6px; margin-left: 4px; }
.filter-active { border-color: var(--green) !important; color: var(--green) !important; }
.grant-timer { font-size: .78rem; font-weight: 700; padding: 5px 10px; border-radius: 6px; margin: 6px 0; display: inline-flex; align-items: center; gap: 5px; width: fit-content; }
.grant-timer.red { background: rgba(239,68,68,.12); color: #ef4444; border: 1px solid rgba(239,68,68,.25); }
.grant-timer.yellow { background: rgba(234,179,8,.12); color: #ca8a04; border: 1px solid rgba(234,179,8,.25); }
.grant-timer.gray { background: var(--card2); color: var(--txt3); border: 1px solid var(--border); }
.btn-notify { background: rgba(99,102,241,.12); color: #818cf8; border: 1px solid rgba(99,102,241,.3); display: inline-flex; align-items: center; gap: 5px; cursor: pointer; }
.btn-notify:hover { background: rgba(99,102,241,.22); }
.btn-notify.notified { background: rgba(34,197,94,.1); color: #22c55e; border-color: rgba(34,197,94,.3); }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.5} }
.save-btn { background: transparent; border: none; color: var(--txt3); cursor: pointer; padding: 4px; transition: color var(--t); }
.save-btn.saved { color: var(--green); }
.save-btn:hover { color: var(--green); }

/* ── Grant Detail ── */
.grant-detail-header { display: flex; align-items: center; gap: 16px; margin-bottom: 32px; }
.back-btn { display: flex; align-items: center; gap: 6px; color: var(--txt2); font-size: .875rem; cursor: pointer; transition: color var(--t); background: none; border: none; padding: 0; }
.back-btn:hover { color: var(--green); }
.detail-meta { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 8px; }
.detail-meta-item { font-size: .82rem; color: var(--txt3); }
.detail-meta-item strong { color: var(--txt2); }
.detail-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 24px; }
.detail-section { margin-bottom: 28px; }
.detail-section-title { font-size: 1rem; font-weight: 700; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.detail-text { font-size: .9rem; color: var(--txt2); line-height: 1.7; }
.eligibility-list { display: flex; flex-direction: column; gap: 8px; }
.eligibility-item { display: flex; align-items: center; gap: 8px; font-size: .875rem; }
.eligibility-item.met { color: var(--txt); }
.eligibility-item.warn { color: var(--orange); }
.req-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.deadline-card { background: rgba(234,179,8,.08); border: 1px solid rgba(234,179,8,.2); border-radius: var(--r-sm); padding: 14px 16px; }
.deadline-date { font-size: 1.1rem; font-weight: 700; margin-bottom: 4px; }
.issuer-card { background: var(--card2); border: 1px solid var(--border); border-radius: var(--r-sm); padding: 16px; text-align: center; }
.issuer-name { font-weight: 700; font-size: .95rem; margin-bottom: 4px; }
.issuer-link { font-size: .8rem; color: var(--green); }

/* ── AI Finder ── */
.ai-finder-wrap { max-width: 600px; margin: 0 auto; }
.ai-finder-step { display: none; }
.ai-finder-step.active { display: block; }
.ai-loading { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 48px 24px; }
.ai-loading-steps { display: flex; flex-direction: column; gap: 12px; max-width: 320px; margin: 24px auto 0; }
.ai-step-row { display: flex; align-items: center; gap: 12px; font-size: .875rem; color: var(--txt3); }
.ai-step-row.done { color: var(--green); }
.ai-step-row.active { color: var(--txt); }
.ai-step-check { width: 18px; height: 18px; border-radius: 50%; background: var(--border2); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.ai-step-row.done .ai-step-check { background: var(--green); }
.ai-step-row.active .ai-step-check { border: 2px solid var(--green); animation: pulse 1s ease infinite; }

/* ── Investor Chat ── */
.investor-layout { display: grid; grid-template-columns: 260px 1fr; height: 100%; overflow: hidden; }
.chat-sidebar { background: var(--bg2); border-right: 1px solid var(--border); padding: 20px 16px; display: flex; flex-direction: column; gap: 16px; overflow-y: auto; flex-shrink: 0; width: 260px; min-width: 260px; }
.chat-sidebar-title { font-weight: 700; font-size: .95rem; }
.chat-history-item { padding: 10px 12px; border-radius: var(--r-sm); font-size: .85rem; color: var(--txt2); cursor: pointer; transition: all var(--t); border: 1px solid transparent; }
.chat-history-item:hover { background: var(--card); }
.chat-history-item.active { background: var(--card); border-color: var(--border2); color: var(--txt); }
.chat-main { display: flex; flex-direction: column; overflow: hidden; min-width: 0; width: 100%; }
.chat-messages { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 24px; display: flex; flex-direction: column; gap: 16px; min-width: 0; box-sizing: border-box; }
.msg { display: flex; gap: 10px; min-width: 0; width: 100%; }
.msg.ai { align-self: flex-start; max-width: 90%; width: auto; }
.msg.user { align-self: flex-end; flex-direction: row-reverse; max-width: 70%; width: auto; }
.msg-avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--green-glow); border: 1px solid var(--green); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.msg-bubble { background: var(--card); border: 1px solid var(--border2); border-radius: var(--r); padding: 12px 16px; font-size: .9rem; line-height: 1.6; word-break: break-word; overflow-wrap: break-word; min-width: 0; }
.msg.user .msg-bubble { background: var(--green-glow); border-color: var(--green); }
.msg-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.chat-disclaimer { padding: 8px 24px 16px; font-size: .75rem; color: var(--txt3); text-align: center; border-top: 1px solid var(--border); flex-shrink: 0; }
.history-readonly .chat-chip { pointer-events: none; }
.history-readonly #chat-text-input, .history-readonly #chat-text-submit { pointer-events: none; opacity: .5; }
.chat-input-bar { padding: 12px 24px; border-top: 1px solid var(--border); }
.typing-indicator { display: flex; gap: 4px; padding: 8px 0; }
.typing-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--txt3); animation: typing 1.4s ease infinite; }
.typing-dot:nth-child(2) { animation-delay: .2s; }
.typing-dot:nth-child(3) { animation-delay: .4s; }
@keyframes typing { 0%,60%,100% { transform: translateY(0); opacity: .4; } 30% { transform: translateY(-6px); opacity: 1; } }

/* ── Investor Cards ── */
.investor-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.investor-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--r); padding: 20px; position: relative; }
.investor-card.locked { filter: blur(2px); pointer-events: none; }
.investor-card.locked-card { border-color: rgba(34,197,94,.35) !important; }
.investor-lock-overlay { position: absolute; inset: 0; background: rgba(10,10,10,.7); border-radius: var(--r); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; text-align: center; padding: 20px; backdrop-filter: blur(2px); }
.investor-avatar-wrap { position: relative; display: inline-block; margin-bottom: 12px; }
.investor-avatar { width: 48px; height: 48px; border-radius: 50%; background: var(--green-glow); border: 1px solid var(--green); display: flex; align-items: center; justify-content: center; font-weight: 700; color: var(--green); font-size: 1.1rem; }
.investor-name { font-weight: 700; font-size: 1rem; margin-bottom: 4px; }
.investor-stage { font-size: .8rem; color: var(--txt3); margin-bottom: 8px; }
.investor-location { font-size: .8rem; color: var(--txt3); display: flex; align-items: center; gap: 4px; margin-bottom: 12px; }
.match-badge { display: flex; align-items: center; gap: 6px; background: rgba(34,197,94,.1); border: 1px solid rgba(34,197,94,.2); border-radius: 6px; padding: 4px 10px; font-size: .8rem; color: var(--green); font-weight: 700; margin-bottom: 12px; }

/* ── Verified Badge ── */
.inv-verified-dot {
  position: absolute; bottom: -4px; right: -4px;
  width: 22px; height: 22px; border-radius: 50%;
  background: linear-gradient(145deg, #7c3aed 0%, #8b5cf6 60%, #a78bfa 100%);
  border: 2px solid var(--card);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 10px rgba(139,92,246,.7), 0 0 22px rgba(139,92,246,.3), 0 3px 8px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.15);
  overflow: hidden; cursor: default;
}
.inv-verified-dot::before {
  content: '';
  position: absolute; inset: 0;
  background: url('../preloder.png') center/65% no-repeat;
  opacity: 0.13;
  filter: brightness(0) invert(1);
}
.inv-verified-dot svg { position: relative; z-index: 1; }
.inv-verified-pill {
  display: inline-flex; align-items: center; gap: 5px;
  background: linear-gradient(135deg, rgba(124,58,237,.3) 0%, rgba(139,92,246,.1) 100%);
  border: 1px solid rgba(139,92,246,.45);
  border-radius: 20px; padding: 3px 10px 3px 6px;
  font-size: .72rem; font-weight: 700; color: #a78bfa;
  letter-spacing: .03em;
  box-shadow: 0 0 14px rgba(139,92,246,.18), 0 1px 3px rgba(0,0,0,.4), inset 0 1px 0 rgba(139,92,246,.12);
  position: relative; overflow: hidden; margin-bottom: 6px;
}
.inv-verified-pill::before {
  content: '';
  position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
  width: 22px; height: 22px;
  background: url('../preloder.png') center/contain no-repeat;
  opacity: 0.09;
  filter: brightness(0) invert(1);
}
.inv-verified-pill > * { position: relative; z-index: 1; }

/* ── Investor Detail ── */
.investor-detail-wrap { max-width: 720px; }
.investor-detail-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 32px; margin-bottom: 20px; }
.investor-profile-row { display: flex; align-items: flex-start; gap: 20px; margin-bottom: 24px; }
.investor-detail-avatar { width: 64px; height: 64px; border-radius: 50%; background: var(--green-glow); border: 1px solid var(--green); display: flex; align-items: center; justify-content: center; font-weight: 700; color: var(--green); font-size: 1.4rem; flex-shrink: 0; }
.investor-detail-info h3 { font-size: 1.3rem; font-weight: 700; margin-bottom: 4px; }
.detail-list { display: flex; flex-direction: column; gap: 8px; }
.detail-list li { display: flex; align-items: flex-start; gap: 8px; font-size: .875rem; color: var(--txt2); }
.detail-list li::before { content: '•'; color: var(--green); flex-shrink: 0; }
.ticket-card { background: var(--green-glow); border: 1px solid var(--green); border-radius: var(--r-sm); padding: 16px 20px; }
.ticket-amount { font-size: 1.4rem; font-weight: 700; color: var(--green); }

/* ── Funding Readiness ── */
.readiness-landing { text-align: center; padding: 48px 24px; max-width: 500px; margin: 0 auto; }
.readiness-icon { width: 72px; height: 72px; border-radius: 50%; background: var(--green-glow); border: 1px solid rgba(34,197,94,.3); display: flex; align-items: center; justify-content: center; margin: 0 auto 24px; }
.qa-wrap { max-width: 560px; margin: 0 auto; }
.qa-step { display: none; }
.qa-step.active { display: block; }
.radio-group { display: flex; flex-direction: column; gap: 10px; }
.radio-option { display: flex; align-items: center; gap: 12px; background: var(--card2); border: 2px solid var(--border2); border-radius: var(--r-sm); padding: 14px 16px; cursor: pointer; transition: all var(--t); }
.radio-option:hover { border-color: var(--green); }
.radio-option.selected { border-color: var(--green); background: var(--green-glow); }
.radio-option input { accent-color: var(--green); width: 16px; height: 16px; }
.range-slider-wrap { padding: 12px 0; }
.range-slider { width: 100%; -webkit-appearance: none; height: 6px; border-radius: 3px; background: var(--border2); outline: none; cursor: pointer; }
.range-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 20px; height: 20px; border-radius: 50%; background: var(--green); cursor: pointer; box-shadow: 0 0 0 3px var(--green-glow); }
.range-value { text-align: center; font-weight: 700; font-size: 1.1rem; color: var(--green); margin-top: 8px; }

/* Readiness Result Layout */
.score-result-wrap { max-width: 900px; }
.score-hero { display: grid; grid-template-columns: auto 1fr; gap: 40px; align-items: center; background: var(--card); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 36px; margin-bottom: 20px; }
.score-gauge-wrap { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.gauge-outer { position: relative; width: 200px; height: 110px; }
.gauge-outer svg { width: 200px; height: 110px; }
.gauge-center { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); text-align: center; }
.gauge-num { font-size: 2.8rem; font-weight: 800; line-height: 1; }
.gauge-denom { font-size: .9rem; color: var(--txt3); }
.score-label-pill { display: inline-flex; align-items: center; gap: 6px; padding: 5px 16px; border-radius: 100px; background: rgba(34,197,94,.15); color: var(--green); font-weight: 700; font-size: .875rem; }
.score-hero-right { display: flex; flex-direction: column; gap: 16px; }
.score-summary-title { font-size: 1.5rem; font-weight: 800; margin-bottom: 4px; }
.score-summary-desc { font-size: .9rem; color: var(--txt2); line-height: 1.7; }
.score-quick-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.score-quick-stat { background: var(--card2); border: 1px solid var(--border2); border-radius: var(--r-sm); padding: 14px; text-align: center; }
.score-quick-stat-val { font-size: 1.2rem; font-weight: 700; color: var(--green); }
.score-quick-stat-label { font-size: .75rem; color: var(--txt3); margin-top: 2px; }

.score-breakdown { background: var(--card); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 28px; margin-bottom: 20px; }
.score-breakdown-title { font-size: 1.1rem; font-weight: 700; margin-bottom: 20px; padding-bottom: 12px; border-bottom: 1px solid var(--border); }
.sub-scores { display: flex; flex-direction: column; gap: 16px; }
.sub-score-row { display: flex; align-items: center; gap: 14px; }
.sub-score-icon { width: 32px; height: 32px; border-radius: var(--r-sm); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.sub-score-label { width: 160px; font-size: .875rem; font-weight: 500; color: var(--txt2); flex-shrink: 0; }
.sub-score-bar { flex: 1; height: 8px; background: var(--border2); border-radius: 4px; overflow: hidden; }
.sub-score-fill { height: 100%; border-radius: 4px; transition: width 1.2s cubic-bezier(.4,0,.2,1); }
.sub-score-val { width: 36px; text-align: right; font-size: .9rem; font-weight: 700; flex-shrink: 0; }

.score-findings { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
.findings-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 24px; }
.findings-title { font-size: 1rem; font-weight: 700; margin-bottom: 16px; display: flex; align-items: center; gap: 8px; }
.strengths-list, .gaps-list { display: flex; flex-direction: column; gap: 10px; }
.strength-item, .gap-item { display: flex; align-items: flex-start; gap: 10px; font-size: .875rem; color: var(--txt2); line-height: 1.5; }
.strength-dot { width: 20px; height: 20px; border-radius: 50%; background: rgba(34,197,94,.15); display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; }
.gap-dot { width: 20px; height: 20px; border-radius: 50%; background: rgba(249,115,22,.15); display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; }

.score-recommendations { background: var(--card); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 28px; margin-bottom: 20px; }
.recommendations-title { font-size: 1.1rem; font-weight: 700; margin-bottom: 20px; padding-bottom: 12px; border-bottom: 1px solid var(--border); }
.rec-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.rec-card { background: var(--card2); border: 1px solid var(--border2); border-radius: var(--r); padding: 18px; }
.rec-card-icon { width: 36px; height: 36px; border-radius: var(--r-sm); display: flex; align-items: center; justify-content: center; margin-bottom: 12px; }
.rec-card-title { font-size: .875rem; font-weight: 700; margin-bottom: 4px; }
.rec-card-val { font-size: 1.1rem; font-weight: 800; color: var(--green); }
.rec-card-desc { font-size: .8rem; color: var(--txt3); margin-top: 4px; }

/* Keep old score-card for backward compat */
.score-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 36px; }
.score-gauge { display: flex; flex-direction: column; align-items: center; margin-bottom: 28px; }
.gauge-wrap { position: relative; width: 160px; height: 80px; overflow: hidden; margin-bottom: 16px; }
.gauge-bg { stroke: var(--border2); }
.gauge-fill { stroke: var(--green); stroke-linecap: round; transition: stroke-dashoffset 1s ease; }
.gauge-label { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); text-align: center; }
.gauge-score { font-size: 2.2rem; font-weight: 700; }
.gauge-max { font-size: .85rem; color: var(--txt3); }
.score-badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 14px; border-radius: 100px; background: rgba(34,197,94,.15); color: var(--green); font-weight: 700; font-size: .85rem; margin-top: 4px; }
.insight-card { background: var(--card2); border: 1px solid var(--border); border-radius: var(--r); padding: 20px; }
.insight-row { display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--border); }
.insight-row:last-child { border: none; }
.insight-label { font-size: .85rem; color: var(--txt3); }
.insight-value { font-size: .9rem; font-weight: 700; }

/* ── Pitch Deck ── */
.filter-bar { display: flex; gap: 12px; margin-bottom: 24px; }
.filter-bar select { background: var(--card2); border: 1px solid var(--border2); border-radius: var(--r-sm); padding: 9px 36px 9px 14px; color: var(--txt2); font-size: .875rem; cursor: pointer; }
.template-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.template-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--r); overflow: hidden; }
.template-preview { height: 140px; background: linear-gradient(135deg, #1a2a1a, #0f1f0f); display: flex; align-items: center; justify-content: center; position: relative; }
.template-preview-inner { width: 80%; height: 80%; background: var(--card2); border-radius: 6px; border: 1px solid var(--border2); display: flex; align-items: center; justify-content: center; }
.template-preview svg { color: var(--txt3); }
.template-body { padding: 16px; }
.template-title { font-weight: 700; font-size: .9rem; margin-bottom: 6px; }
.template-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 12px; }
.template-actions { display: flex; gap: 8px; }
.pagination { display: flex; align-items: center; gap: 6px; margin-top: 24px; }
.page-btn { width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; border-radius: var(--r-sm); font-size: .85rem; cursor: pointer; border: 1px solid var(--border2); background: var(--card2); color: var(--txt2); transition: all var(--t); }
.page-btn:hover { border-color: var(--green); color: var(--green); }
.page-btn.active { background: var(--green); border-color: var(--green); color: #000; font-weight: 700; }
.page-btn.disabled { opacity: .35; cursor: not-allowed; pointer-events: none; }
.page-btn.disabled:hover { border-color: var(--border2); color: var(--txt2); }
.template-detail-wrap { max-width: 680px; }
.template-detail-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 32px; }
.template-preview-lg { height: 200px; background: linear-gradient(135deg, #1a2a1a, #0f1f0f); border-radius: var(--r); display: flex; align-items: center; justify-content: center; margin-bottom: 24px; }
.what-youll-get { display: flex; flex-direction: column; gap: 8px; margin: 16px 0; }
.what-item { display: flex; align-items: center; gap: 8px; font-size: .875rem; color: var(--txt2); }

/* ── Saved ── */
.inner-tabs { display: flex; gap: 4px; margin-bottom: 24px; border-bottom: 1px solid var(--border); }
.inner-tab { padding: 10px 16px; font-size: .9rem; color: var(--txt3); cursor: pointer; border-bottom: 2px solid transparent; transition: all var(--t); margin-bottom: -1px; background: none; border-top: none; border-left: none; border-right: none; }
.inner-tab:hover { color: var(--txt); }
.inner-tab.active { color: var(--green); border-bottom-color: var(--green); }

/* ── Profile Modal ── */
.profile-modal { position: fixed; inset: 0; background: rgba(0,0,0,.7); display: none; align-items: center; justify-content: center; z-index: 300; }
.profile-modal.show { display: flex; }
.profile-modal-inner { background: var(--card); border: 1px solid var(--border2); border-radius: var(--r-lg); width: 520px; max-width: 95vw; max-height: 90vh; overflow-y: auto; }
.profile-modal-header { padding: 20px 24px; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; }
.profile-modal-body { padding: 24px; }
.profile-avatar-row { display: flex; align-items: center; gap: 16px; margin-bottom: 24px; }
.profile-avatar-lg { width: 60px; height: 60px; border-radius: 50%; background: var(--green); color: #000; font-weight: 700; font-size: 1.3rem; display: flex; align-items: center; justify-content: center; }
.profile-section-title { font-weight: 700; font-size: .9rem; color: var(--txt2); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 14px; margin-top: 20px; }
.billing-info-row { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--border); font-size: .875rem; }
.billing-info-row:last-child { border: none; }
.invoice-row { display: grid; grid-template-columns: 1fr 1fr 1fr auto; align-items: center; gap: 8px; padding: 10px 0; border-bottom: 1px solid var(--border); font-size: .85rem; }
.invoice-row:last-child { border: none; }
.close-btn { background: none; border: none; color: var(--txt3); cursor: pointer; padding: 4px; border-radius: 4px; transition: color var(--t); }
.close-btn:hover { color: var(--txt); }

/* ── Empty states ── */
.empty-state { text-align: center; padding: 64px 24px; }
.empty-icon { width: 64px; height: 64px; border-radius: 50%; background: var(--card2); display: flex; align-items: center; justify-content: center; margin: 0 auto 16px; color: var(--txt3); }
.empty-title { font-size: 1.1rem; font-weight: 700; margin-bottom: 8px; }
.empty-sub { font-size: .875rem; color: var(--txt3); margin-bottom: 20px; }

/* ── Error state ── */
.error-state { text-align: center; padding: 48px 24px; }
.error-icon { width: 56px; height: 56px; border-radius: 50%; background: rgba(239,68,68,.1); display: flex; align-items: center; justify-content: center; margin: 0 auto 16px; color: var(--red); }

/* ── Utility ── */
.hidden { display: none !important; }
.flex { display: flex; }
.items-center { align-items: center; }
.gap-2 { gap: 8px; }
.gap-3 { gap: 12px; }
.mt-4 { margin-top: 16px; }
.mt-6 { margin-top: 24px; }
.text-green { color: var(--green); }
.text-muted { color: var(--txt3); }
.text-sm { font-size: .875rem; }
.font-bold { font-weight: 700; }
.text-center { text-align: center; }
.section-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.sub-heading { font-size: 1rem; font-weight: 700; margin-bottom: 12px; }

/* ── Animations ── */
@keyframes fadeIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.fade-in { animation: fadeIn .3s ease forwards; }
@keyframes slideUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
.slide-up { animation: slideUp .4s ease forwards; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }

/* ============================================================
   MOBILE RESPONSIVENESS
   ============================================================ */

/* ── iPad & Tablet (769px – 1024px) ── */
@media (max-width: 1024px) {

  /* ── Search bar: wrap on tablet too ── */
  .search-bar { flex-wrap: wrap; gap: 8px; align-items: center; }
  .search-input-wrap { flex: 1 1 100%; order: -1; }
  #sort-wrap { flex: 1; }
  #sort-wrap > button { width: 100%; justify-content: center; }
  #sort-dropdown { left: 0 !important; right: auto !important; }

  /* ── Dashboard navbar tabs: more compact ── */
  .nav-tab { padding: 7px 10px; font-size: .82rem; }
  .tab-section { padding: 24px 20px; }

  /* ── Dashboard home ── */
  .quick-actions { grid-template-columns: 1fr 1fr; gap: 14px; }
  .quick-card { padding: 20px; }

  /* ── Grants ── */
  .grants-grid { grid-template-columns: 1fr; gap: 14px; }
  .section-header { flex-wrap: wrap; gap: 12px; }

  /* ── Investors: 2 columns ── */
  .investor-grid { grid-template-columns: 1fr 1fr; gap: 14px; }

  /* ── Investor Chat layout on iPad (scoped to ID) ── */
  #investor-chat-view .investor-layout {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
  }
  #investor-chat-view .chat-sidebar {
    flex-direction: row !important;
    flex-shrink: 0 !important;
    width: 100% !important; min-width: unset !important;
    height: auto !important; max-height: 84px !important;
    border-right: none !important; border-bottom: 1px solid var(--border) !important;
    overflow-x: auto !important; overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    padding: 10px 14px !important; gap: 8px !important;
  }
  #investor-chat-view .chat-sidebar-title { display: none !important; }
  #investor-chat-view .chat-history-item { white-space: nowrap !important; }
  #investor-chat-view .chat-main {
    flex: 1 !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }
  #investor-chat-view .chat-messages {
    flex: 1 !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  #investor-chat-view .chat-input-bar { flex-shrink: 0 !important; }

  /* ── Templates: 2 columns ── */
  .template-grid { grid-template-columns: 1fr 1fr; gap: 14px; }

  /* ── Pricing: 2 columns ── */
  .pricing-cards { grid-template-columns: 1fr 1fr; }
  .plan-card { padding: 28px; }

  /* ── Readiness: 2 columns ── */
  .rec-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
  .score-findings { grid-template-columns: 1fr; }
  .score-hero { gap: 24px; }

  /* ── Onboarding card ── */
  .onboard-card { padding: 36px 40px; }

  /* ── Section grid ── */
  .section-grid { grid-template-columns: 1fr 1fr; gap: 20px; }

  /* ── Detail grid ── */
  .detail-grid { grid-template-columns: 1fr; }
}

/* ── Tablet & Mobile (≤ 768px) ── */
@media (max-width: 768px) {

  /* ── Grants search bar: full-width search + compact second row ── */
  .search-bar { flex-wrap: wrap; gap: 8px; align-items: center; }
  .search-input-wrap { flex: 1 1 100%; order: -1; } /* search takes its own full row */
  #sort-wrap { flex: 1; }
  #sort-wrap > button { width: 100%; justify-content: center; }
  /* Sort dropdown: anchor left so it doesn't escape viewport */
  #sort-dropdown { left: 0 !important; right: auto !important; }

  /* ── Split layout (signin, signup, forgot, reset, verify) ── */
  .split { grid-template-columns: 1fr; }
  .split-right { display: none; }
  .split-left { padding: 28px 24px; }
  .split-left-inner { max-width: 100%; }
  .split-nav { margin-bottom: 28px; }

  /* ── Onboarding ── */
  .onboard-header { padding: 16px 20px; }
  .onboard-body { padding: 24px 16px; }
  .onboard-card { padding: 28px 20px; }
  .onboard-step-q { font-size: 1.3rem; }
  .stage-cards { grid-template-columns: 1fr; }
  .onboard-nav { flex-direction: column-reverse; gap: 10px; }
  .onboard-nav > * { width: 100%; }

  /* ── Pricing ── */
  .pricing-wrap { padding: 24px 16px; }
  .pricing-title { font-size: 1.5rem; }
  .pricing-cards { grid-template-columns: 1fr; max-width: 440px; }
  .plan-card { padding: 28px 24px; }

  /* ── Dashboard Navbar ── */
  .dash-navbar { padding: 0 10px; gap: 2px; }
  .nav-tab { padding: 6px 10px; font-size: .78rem; }

  /* ── Dashboard Body ── */
  .tab-section { padding: 16px; }
  .dash-welcome h2 { font-size: 1.3rem; }

  /* ── Dashboard Home: stats & quick actions ── */
  .stat-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .stat-card { text-align: center; display: flex; flex-direction: column; align-items: center; }
  .stat-icon { margin: 0 auto 14px; }
  .quick-actions { grid-template-columns: 1fr 1fr; gap: 12px; }
  .quick-card { padding: 18px; text-align: center; align-items: center; }
  .quick-card .badge { margin: 0 auto; }

  /* ── Grants ── */
  .grants-grid { grid-template-columns: 1fr; gap: 12px; }
  .section-header { flex-direction: column; align-items: flex-start; gap: 12px; }
  .search-bar { flex-wrap: wrap; gap: 8px; }
  .grant-footer { flex-direction: column; align-items: flex-start; gap: 8px; }
  .grant-actions { width: 100%; flex-wrap: wrap; }

  /* ── Grant Detail ── */
  .detail-grid { grid-template-columns: 1fr; }
  .detail-meta { gap: 10px; }

  /* ── Investor Chat (phone — same scoped rules, just tighter sidebar) ── */
  #investor-chat-view .chat-sidebar { max-height: 80px !important; padding: 8px 12px !important; }

  /* ── Investor Cards ── */
  .investor-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .investor-card { padding: 16px; }

  /* ── Templates / Pitch Deck ── */
  .template-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .filter-bar { flex-wrap: wrap; gap: 8px; }
  .filter-bar select { min-width: 120px; flex: 1; }

  /* ── Funding Readiness Score ── */
  .score-hero { grid-template-columns: 1fr; gap: 20px; padding: 24px; }
  .score-gauge-wrap { order: -1; }
  .gauge-outer { width: 160px; height: 88px; }
  .gauge-outer svg { width: 160px; height: 88px; }
  .gauge-num { font-size: 2rem; }
  .score-summary-title { font-size: 1.2rem; }
  .score-quick-stats { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .score-quick-stat { padding: 10px; }
  .score-findings { grid-template-columns: 1fr; }
  .rec-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .score-breakdown { padding: 20px; }
  .sub-score-row { flex-wrap: wrap; gap: 8px; }
  .sub-score-label { width: auto !important; flex: 1; min-width: 100px; font-size: .8rem; }
  .sub-score-bar { min-width: 80px; }

  /* ── Generic 2-col section grid ── */
  .section-grid { grid-template-columns: 1fr; }

  /* ── Saved page inner tabs ── */
  .inner-tabs { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .inner-tab { white-space: nowrap; flex-shrink: 0; padding: 10px 12px; }

  /* ── Profile Modal ── */
  .profile-modal-inner { width: 95vw; max-height: 85vh; }
  .invoice-row { grid-template-columns: 1fr 1fr auto; font-size: .78rem; gap: 6px; }
  .billing-info-row { flex-direction: column; align-items: flex-start; gap: 4px; }

  /* ── Modals ── */
  .modal { padding: 28px 20px; }

  /* ── Expert Apply Modal ── */
  .expert-form-grid { grid-template-columns: 1fr; }
}

/* ── Small phones (≤ 480px) ── */
@media (max-width: 480px) {

  /* ── Split (auth pages) ── */
  .split-left { padding: 20px 16px; }
  .auth-title { font-size: 1.35rem; }

  /* ── Pricing ── */
  .pricing-wrap { padding: 20px 12px; }
  .pricing-cards { grid-template-columns: 1fr; }
  .plan-price { font-size: 2rem; }
  .plan-card { padding: 22px 16px; }

  /* ── Dashboard ── */
  .tab-section { padding: 12px 10px; }
  .stat-grid { grid-template-columns: 1fr; }
  .stat-card { padding: 16px; }
  .quick-actions { grid-template-columns: 1fr; }
  .quick-card { padding: 16px; }

  /* ── Dashboard Navbar ── */
  .dash-navbar { padding: 0 8px; }
  .nav-tab { padding: 5px 8px; font-size: .72rem; }
  .dash-nav-logo { margin-right: 4px; }

  /* ── Grants ── */
  .grant-card { padding: 14px; }
  .grant-title { font-size: .95rem; }

  /* ── Investors ── */
  .investor-grid { grid-template-columns: 1fr; }

  /* ── Templates ── */
  .template-grid { grid-template-columns: 1fr; }

  /* ── Readiness ── */
  .rec-grid { grid-template-columns: 1fr; }
  .score-quick-stats { grid-template-columns: 1fr; }
  .score-quick-stat-val { font-size: 1rem; }

  /* ── Onboarding ── */
  .onboard-card { padding: 20px 14px; }
  .onboard-step-q { font-size: 1.1rem; }

  /* ── OTP Inputs ── */
  .otp-input { width: 44px; height: 48px; font-size: 1.15rem; }
  .otp-group { gap: 7px; }

  /* ── Chat sidebar ── */
  .chat-sidebar { max-height: 78px; padding: 8px 10px !important; }
}