
:root{
  --bg:#F2F5FA;
  --white:#FFFFFF;
  --blue:#2457E6;
  --blue-dark:#1A3FB8;
  --blue-light:#E6ECFE;
  --ink:#0A1020;
  --ink-soft:#46536D;
  --ink-faint:#5F6C86;      
  --border:#E3E8F0;
  --border-strong:#79839A;  
  --radius:16px;
  --radius-sm:10px;
  --shadow-sm:0 1px 2px rgba(10,16,32,.05), 0 1px 1px rgba(10,16,32,.03);
  --shadow-md:0 2px 4px rgba(10,16,32,.05), 0 12px 28px -10px rgba(10,16,32,.18);
  --shadow-lg:0 2px 6px rgba(10,16,32,.06), 0 28px 60px -22px rgba(10,16,32,.28);
  --stage-out:190ms;
  --stage-in:420ms;
  --ease-out:cubic-bezier(.22,.80,.28,1);
  --ease-in:cubic-bezier(.40,0,1,1);
  --ease-spring:cubic-bezier(.34,1.32,.44,1);
}
body.shell-stages h1,
body.shell-stages h2,
body.shell-stages h3{ letter-spacing:-0.022em; }
body.shell-stages .hero-copy h1{
  font-size:clamp(33px,4.6vw,52px);
  line-height:1.04;
  letter-spacing:-0.032em;
  font-weight:800;
  max-width:17ch;
  text-wrap:balance;
}
body.shell-stages .hero-copy p.lead{
  font-size:17.5px;
  line-height:1.62;
  max-width:52ch;
  color:var(--ink-soft);
  margin-bottom:26px;
}
body.shell-stages .readiness-pct,
body.shell-stages .tab-count,
body.shell-stages .sm-label,
body.shell-stages .rail-dot{ font-variant-numeric:tabular-nums; }
body.shell-stages .stage{ display:none; }
body.shell-stages .stage.is-current,
body.shell-stages .stage.is-entering,
body.shell-stages .stage.is-leaving{ display:block; }
body.shell-stages .stage.is-current{
  opacity:1;
  transform:none;
  transition:opacity var(--stage-in) var(--ease-out),
             transform var(--stage-in) var(--ease-out);
}
body.shell-stages .stage.is-entering{
  opacity:0;
  transform:translate3d(var(--stage-dx,32px),14px,0);
  transition:none;
}
body.shell-stages .stage.is-leaving{
  opacity:0;
  transform:translate3d(var(--stage-dx,-32px),0,0);
  transition:opacity var(--stage-out) var(--ease-in),
             transform var(--stage-out) var(--ease-in);
  pointer-events:none;
}
body.shell-stages[data-stage="case"] #hero,
body.shell-stages[data-stage="next"] #hero{ display:none; }
body.shell-stages #hero{
  padding:clamp(28px,5vw,72px) 20px clamp(32px,4vw,56px);
  min-height:calc(100svh - var(--chrome-top, 64px) - 52px);
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.stage-rail{
  position:sticky;
  top:var(--chrome-top,0px);
  z-index:120;
  background:color-mix(in srgb, var(--white) 92%, transparent);
  backdrop-filter:blur(10px) saturate(1.4);
  -webkit-backdrop-filter:blur(10px) saturate(1.4);
  border-bottom:1px solid var(--border);
  box-shadow:0 1px 2px rgba(15,23,42,.04), 0 6px 16px -12px rgba(15,23,42,.18);
}
.stage-rail ol{
  list-style:none;
  margin:0 auto;
  padding:9px 20px;
  max-width:1240px;
  display:flex;
  align-items:center;
  gap:6px;
}
.stage-rail li{ display:flex; align-items:center; min-width:0; }
.stage-rail li + li::before{
  content:"";
  flex:1 1 14px;
  min-width:10px;
  height:2px;
  border-radius:2px;
  background:var(--border);
  margin:0 4px;
  transition:background var(--stage-in) var(--ease-out);
}
.stage-rail li:has(.rail-step.is-current)::before,
.stage-rail li:has(.rail-step.is-done)::before{ background:var(--blue); }
.rail-step{
  display:flex;
  align-items:center;
  gap:8px;
  background:transparent;
  border:none;
  padding:5px 10px 5px 5px;
  border-radius:var(--radius-pill);
  font-size:13px;
  font-weight:650;
  color:var(--ink-faint);
  cursor:pointer;
  transition:color .2s var(--ease-out), background .2s var(--ease-out);
}
.rail-step:disabled{ cursor:default; opacity:.55; }
.rail-step:not(:disabled):hover{ background:var(--blue-light); color:var(--blue-dark); }
.rail-dot{
  width:23px;height:23px;flex:0 0 23px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:11.5px;font-weight:700;
  background:var(--white);
  border:1.5px solid var(--border-strong);
  color:var(--ink-faint);
  transition:background .26s var(--ease-out), border-color .26s var(--ease-out),
             color .26s var(--ease-out), transform .26s var(--ease-spring);
}
.rail-step.is-current .rail-dot{
  background:var(--blue); border-color:var(--blue); color:#fff;
  transform:scale(1.14);
}
.rail-step.is-current{ color:var(--ink); }
.rail-label{ white-space:nowrap; }
.rail-step.is-done .rail-dot{
  background:var(--blue-light); border-color:var(--blue); color:var(--blue-dark);
}
.rail-step.is-done .rail-dot{ font-size:0; }
.rail-step.is-done .rail-dot::after{
  content:"✓"; font-size:12px; line-height:1;
}
@media (max-width:560px){
  .stage-rail ol{ padding:6px 12px; gap:0; justify-content:space-between; }
  .stage-rail li{ align-items:flex-start; }
  .stage-rail li + li{ flex:1 1 0; }
  .stage-rail li + li::before{ margin:14px 2px 0; min-width:6px; }
  .rail-step{
    flex-direction:column; gap:3px;
    padding:4px 3px;
    font-size:10.5px; line-height:1.15;
    border-radius:10px;
  }
  .rail-dot{ width:21px; height:21px; flex:0 0 21px; }
  .rail-step.is-current .rail-dot{ transform:scale(1.08); }
}
@media (max-width:340px){
  .rail-step:not(.is-current) .rail-label{
    position:absolute;width:1px;height:1px;padding:0;margin:-1px;
    overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
  }
}
body.shell-stages .hero-inner{ gap:clamp(28px,4vw,56px); align-items:center; }
body.shell-stages .hero-visual{ justify-content:center; }
body.shell-stages .parallax-card{
  box-shadow:var(--shadow-lg);
  animation:shellFloat 14s ease-in-out infinite;
}
body.shell-stages #card2{ animation-delay:-2.4s; }
body.shell-stages #card3{ animation-delay:-5.8s; }
body.shell-stages #card4{ animation-delay:-8.6s; }
@keyframes shellFloat{
  0%,100%{ transform:translate3d(0,0,0); }
  50%    { transform:translate3d(0,-6px,0); }
}
body.shell-stages .hero-cta{
  border-radius:var(--radius-sm);
  padding:15px 26px;
  font-size:16px;
  letter-spacing:-0.01em;
  box-shadow:0 2px 4px rgba(36,87,230,.18), 0 14px 30px -10px rgba(36,87,230,.5);
  transition:background .18s var(--ease-out), transform .18s var(--ease-spring),
             box-shadow .18s var(--ease-out);
}
body.shell-stages .hero-cta:hover{
  transform:translateY(-2px);
  box-shadow:0 3px 6px rgba(36,87,230,.2), 0 20px 40px -12px rgba(36,87,230,.55);
}
body.shell-stages .hero-cta:active{ transform:translateY(0); }
.stage-reassure{
  margin-top:14px;
  font-size:13.5px;
  line-height:1.5;
  color:var(--ink-faint);
  max-width:44ch;
}
body.shell-stages .stage.is-current .hero-copy h1{ animation:stageRise .52s var(--ease-out) .02s both; }
body.shell-stages .stage.is-current .hero-copy p.lead{ animation:stageRise .52s var(--ease-out) .09s both; }
body.shell-stages .stage.is-current .hero-badges{ animation:stageRise .52s var(--ease-out) .15s both; }
body.shell-stages .stage.is-current .hero-cta{ animation:stageRise .52s var(--ease-out) .21s both; }
body.shell-stages .stage.is-current .stage-reassure{ animation:stageRise .52s var(--ease-out) .26s both; }
body.shell-stages .stage.is-current .hero-visual{ animation:stageFade .7s var(--ease-out) .16s both; }
@keyframes stageRise{
  from{ opacity:0; transform:translate3d(0,14px,0); }
  to  { opacity:1; transform:none; }
}
@keyframes stageFade{
  from{ opacity:0; transform:scale(.975); }
  to  { opacity:1; transform:none; }
}
body.shell-stages [data-stage="locate"] .map-wrap{
  max-width:1040px;
  margin:0 auto;
  padding:clamp(18px,3vw,30px);
  border-radius:var(--radius);
  box-shadow:var(--shadow-md);
  animation:stageFade .5s var(--ease-out) both;
}
body.shell-stages [data-stage="locate"] .map-wrap h2{
  font-size:clamp(21px,2.6vw,28px);
  margin-bottom:6px;
}
body.shell-stages [data-stage="locate"] .map-sub{ max-width:74ch; font-size:14px; line-height:1.55; }
body.shell-stages [data-stage="locate"] #usMap{ max-height:min(430px,46vh); }
body.shell-stages #usMap path{
  transition:fill .16s var(--ease-out), opacity .35s var(--ease-out);
}
body.shell-stages #usMap path.selected{ fill:var(--blue); }
body.shell-stages .map-selection{
  transition:background .3s var(--ease-out), border-color .3s var(--ease-out);
}
body.shell-stages .map-selection:has(strong){
  background:var(--blue-light);
  border-color:var(--blue);
}
.stage-nav{
  max-width:1040px;
  margin:18px auto 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.stage-nav-fwd{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.stage-hint{
  max-width:1040px;
  margin:14px auto 0;
  font-size:13px;
  color:var(--ink-faint);
  text-align:right;
}
.stage-back{
  background:transparent;
  border:1px solid var(--border-strong);
  border-radius:var(--radius-sm);
  padding:11px 17px;
  font-size:14px;font-weight:650;
  color:var(--ink-soft);
  transition:border-color .18s var(--ease-out), color .18s var(--ease-out),
             background .18s var(--ease-out);
}
.stage-back:hover{ border-color:var(--blue); color:var(--blue); background:var(--blue-light); }
.stage-next{
  background:var(--blue);color:#fff;border:none;
  border-radius:var(--radius-sm);
  padding:13px 26px;
  font-size:15.5px;font-weight:700;
  letter-spacing:-0.01em;
  box-shadow:0 2px 4px rgba(36,87,230,.18), 0 12px 26px -10px rgba(36,87,230,.45);
  transition:background .18s var(--ease-out), transform .18s var(--ease-spring),
             box-shadow .18s var(--ease-out), opacity .18s linear;
}
.stage-next:hover:not(:disabled){ transform:translateY(-2px); background:var(--blue-dark); }
.stage-next:active:not(:disabled){ transform:translateY(0); }
.stage-next:disabled{
  background:var(--border);
  color:var(--ink-soft);
  box-shadow:none;
  cursor:not-allowed;
}
.stage-next.is-ready{ animation:stagePop .42s var(--ease-spring) both; }
@keyframes stagePop{
  0%  { transform:scale(.94); }
  60% { transform:scale(1.035); }
  100%{ transform:scale(1); }
}
.stage-skip{
  background:none;border:none;
  padding:6px 2px;
  font-size:13.5px;font-weight:600;
  color:var(--ink-faint);
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-thickness:1px;
  text-decoration-color:var(--border-strong);
  transition:color .18s var(--ease-out), text-decoration-color .18s var(--ease-out);
}
.stage-skip:hover{ color:var(--ink); text-decoration-color:var(--ink); }
body.shell-stages[data-stage="case"] #workspace{ margin-top:22px; }
body.shell-stages[data-stage="case"] .chat-panel{ box-shadow:var(--shadow-md); }
body.shell-stages:not([data-stage="case"]):not([data-stage="next"]) #caseDock{ display:none; }
body.shell-stages[data-stage="next"] #mobileTabs{ display:none; }
body.shell-stages #chatMessages > .msg,
body.shell-stages #chatMessages > .quick-replies{
  animation:msgIn .24s var(--ease-out) both;
}
@keyframes msgIn{
  from{ opacity:0; transform:translate3d(0,8px,0); }
  to  { opacity:1; transform:none; }
}
body.shell-stages .quick-replies button{
  transition:background .16s var(--ease-out), color .16s var(--ease-out),
             border-color .16s var(--ease-out), transform .16s var(--ease-spring);
}
body.shell-stages .quick-replies button:hover{ transform:translateY(-1px); }
body.shell-stages .quick-replies button:active{ transform:translateY(0); }
body.shell-stages .btn{
  transition:background .18s var(--ease-out), color .18s var(--ease-out),
             border-color .18s var(--ease-out), transform .16s var(--ease-spring),
             box-shadow .18s var(--ease-out);
}
body.shell-stages .btn:hover{ transform:translateY(-1px); }
body.shell-stages .btn:active{ transform:translateY(0); }
body.shell-stages .stage.is-current .dashboard > .cf-card{
  animation:stageRise .46s var(--ease-out) .06s both;
}
.resume-card{
  background:var(--white);
  border:1px solid var(--blue-light);
  border-left:4px solid var(--blue);
  border-radius:14px;
  padding:18px 20px 16px;
  margin:0 0 26px;
  box-shadow:0 1px 2px rgba(10,16,32,.05), 0 14px 34px -26px rgba(10,16,32,.4);
  max-width:520px;
}
.resume-title{
  margin:0 0 6px;
  font-size:16.5px; font-weight:700; letter-spacing:-0.018em; color:var(--ink);
}
.resume-facts{
  margin:0 0 12px;
  font-size:13.5px; color:var(--ink-soft);
  font-variant-numeric:tabular-nums;
}
.resume-meter{
  height:6px; border-radius:var(--radius-pill);
  background:var(--border); overflow:hidden;
}
.resume-fill{
  height:100%; border-radius:var(--radius-pill);
  background:linear-gradient(90deg,var(--blue) 0%,var(--green-strong) 100%);
  transition:width .45s var(--ease-out);
}
.resume-next{
  margin:10px 0 0;
  font-size:13px; color:var(--ink-faint);
  font-variant-numeric:tabular-nums;
}
.resume-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:15px; }
.resume-actions .btn{ padding:11px 18px; font-size:14.5px; }
.resume-fresh{ color:var(--ink-soft); }
@media (max-width:560px){
  .resume-card{ padding:16px 16px 14px; margin-bottom:20px; border-radius:12px; }
  .resume-title{ font-size:15.5px; }
  .resume-actions{ flex-direction:column; }
  .resume-actions .btn{ width:100%; flex:0 0 auto; }
}
body.shell-stages .stage:focus,
body.shell-stages #workspace:focus,
body.shell-stages #nextPage:focus,
body.shell-stages .stage h1:focus,
body.shell-stages .stage h2:focus,
body.shell-stages .legal-page-title:focus,
body.shell-stages .legal-page-title:focus-visible,
body.shell-stages .legal-page:focus,
body.shell-stages .legal-page:focus-visible{ outline:none; }
body.shell-stages :focus-visible{ outline:2.5px solid var(--blue); outline-offset:2px; }
@media (prefers-reduced-motion: reduce){
  body.shell-stages .stage,
  body.shell-stages .stage.is-current,
  body.shell-stages .stage.is-entering,
  body.shell-stages .stage.is-leaving{
    transition:none !important;
    transform:none !important;
  }
  body.shell-stages .stage.is-leaving{ display:none !important; }
  body.shell-stages *,
  body.shell-stages *::before,
  body.shell-stages *::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
}
.stage-nav-case{
  max-width:1240px;
  margin:0 auto 34px;
  padding:0 20px;
}
body.shell-stages[data-stage="case"] #workspace{ margin-bottom:22px; }
@media (max-width:560px){
  .stage-nav-case{ padding:0 14px 8px; }
}
