/* ============================================================================
   manav.id - central brand tokens  (single source of truth)
   Link this on every manav surface so the palette stays consistent.
   Purple brand, warm-paper light theme. Includes BOTH naming schemes
   (--ac* and --accent*) so existing pages keep working unchanged.
   ============================================================================ */
:root{
  /* ── surfaces ── */
  --bg:#FBFAF6;
  --s1:#FFFFFF;   --surface:#FFFFFF;
  --s2:#F4F1EC;   --surface-2:#F4F1EC;   --surface-hover:#F5F2EC;
  --s3:#EBE6DB;
  --bdr:#E2DCCF;  --border:#E2DCCF;
  --divider:#F0EEEA;

  /* ── ink ── */
  --tx:#1F1D2C;  --tx2:#51536A;  --tx3:#8B8E9F;  --tx-inverse:#FFFFFF;

  /* ── accent (PURPLE - the brand) ── */
  --ac:#8B7DF5;  --ac2:#6E5CF7;  --ac3:#B0A6FB;
  --accent:#6E5CF7;  --accent-hover:#5A49E0;  --accent-2:#8B7DF5;  --accent-light:#F3EFFD;
  --violet:#C4B0F5;  --violet-light:#F3EFFD;

  /* ── status ── */
  --success:#3DA76D;  --success-light:#EDF8F0;  --mint:#6BC67E;  --mint-light:#E9F7ED;
  --warning:#E8C356;  --warning-light:#FDF8E8;
  --error:#E07070;    --error-light:#FDEDED;
  --peach:#F5B99B;    --sun:#F4D06F;

  /* ── type ── */
  --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --mono:'JetBrains Mono','SF Mono',monospace;

  /* ── radii ── */
  --r:12px;  --r-sm:8px;  --r-lg:18px;  --r-full:9999px;

  /* ── shadows ── */
  --sh-sm:0 1px 2px rgba(31,29,44,.05);
  --sh:0 1px 4px rgba(31,29,44,.07);
  --sh-lg:0 8px 28px rgba(31,29,44,.10);

  /* ── motion ── */
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  /* sampled damped spring (~8% overshoot); cubic-bezier fallback where unsupported */
  --spring:linear(0,0.004,0.016,0.036,0.063,0.098,0.141,0.191,0.25,0.316,0.39,0.47,0.557,0.649,0.747,0.849,0.954,1.04,1.067,1.08,1.082,1.075,1.062,1.046,1.029,1.014,1.002,0.995,0.991,0.991,0.994,0.997,1);
}

/* ============================================================================
   Shared component - Request-access lead-gen modal
   (markup is identical on every page; styles live here for consistency)
   ============================================================================ */
.modal{position:fixed;inset:0;z-index:50;display:none;align-items:center;justify-content:center;padding:20px}
.modal.open{display:flex}
.modal-backdrop{position:absolute;inset:0;background:rgba(31,29,44,.46);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:mfade .3s ease}
.modal-card{position:relative;z-index:1;width:min(540px,100%);max-height:92dvh;overflow:auto;
  background:var(--bg);border:1px solid var(--bdr);border-radius:20px;padding:clamp(24px,4vw,40px);
  box-shadow:0 40px 100px -30px rgba(31,29,44,.5);animation:mpop .4s var(--ease)}
@keyframes mfade{from{opacity:0}to{opacity:1}}
@keyframes mpop{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
.modal-x{position:absolute;top:16px;right:16px;width:34px;height:34px;border-radius:999px;
  border:1px solid var(--bdr);background:var(--s1);color:var(--tx2);cursor:pointer;font-size:14px;
  line-height:1;transition:border-color .2s,color .2s}
.modal-x:hover{border-color:var(--ac);color:var(--ac2)}
.m-eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--ac2)}
.modal-card h2{font-family:var(--font);font-size:clamp(1.5rem,1.3rem+1vw,2rem);font-weight:500;
  letter-spacing:-.02em;line-height:1.12;margin:10px 0 0}
.modal-sub{color:var(--tx2);font-size:15px;margin-top:8px;line-height:1.55}
.lead{margin-top:22px;display:flex;flex-direction:column;gap:14px}
.lead .frow{display:flex;flex-direction:column;gap:14px}
.lead .frow.two{flex-direction:row}
.lead label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--tx2);flex:1;min-width:0}
.lead .opt{color:var(--tx3)}
.lead input,.lead select,.lead textarea{width:100%;font-family:var(--font);font-size:15px;color:var(--tx);
  background:var(--s1);border:1px solid var(--bdr);border-radius:10px;padding:11px 13px;outline:none;
  transition:border-color .2s,box-shadow .2s}
.lead input:focus,.lead select:focus,.lead textarea:focus{border-color:var(--ac);box-shadow:0 0 0 3px rgba(139,125,245,.18)}
.lead input.bad,.lead select.bad{border-color:#e06a8b}
.lead textarea{resize:vertical}
.lead .btn{margin-top:6px;width:100%;justify-content:center}
.modal-fine{font-size:12px;color:var(--tx3);text-align:center;margin-top:2px;line-height:1.5}
.lead-done{text-align:center;padding:20px 0 8px}
.lead-done .big{font-size:46px;line-height:1}
.lead-done h3{font-family:var(--font);font-size:1.4rem;font-weight:500;margin-top:10px}
.lead-done p{color:var(--tx2);margin-top:8px;line-height:1.55}
@media(max-width:560px){.lead .frow.two{flex-direction:column}}

/* shared footer link treatment */
.footer a{color:var(--tx2);text-decoration:none;border-bottom:1px solid var(--bdr);transition:color .2s,border-color .2s}
.footer a:hover{color:var(--ac2);border-color:var(--ac)}
