/* =========================================================
   HEIMDALL INTAKE V2 — wizard styles
   Reuses design tokens from site.css (--paper, --ink, --gold,
   --steel, --line, --bevel, --display, --body). Adds only
   what the V2 wizard needs; does not redefine or override
   any production selector.
========================================================= */

.v2-dev-banner{
  background:var(--ink);
  color:var(--gold-pale);
  font:600 12px/1.4 var(--body);
  letter-spacing:.04em;
  text-align:center;
  padding:8px 12px;
  text-transform:uppercase;
}

.v2-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:18px clamp(16px,4vw,40px);
  border-bottom:1px solid var(--line);
  background:var(--paper);
}

.v2-brand{
  display:flex;
  align-items:center;
  gap:10px;
  font:600 15px/1 var(--body);
  letter-spacing:.06em;
  color:var(--ink);
  text-decoration:none;
}
.v2-brand img{ width:28px; height:28px; border-radius:6px; }

.v2-header-tag{
  font:500 12px/1 var(--body);
  color:var(--ink-soft);
  border:1px solid var(--line);
  padding:6px 10px;
  border-radius:999px;
}

.v2-main{ background:var(--paper-dim); min-height:100vh; padding:32px 16px 80px; }

.v2-shell{
  max-width:720px;
  margin:0 auto;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--bevel);
  padding:clamp(20px,4vw,44px);
}

.v2-progress{ margin-bottom:28px; }
.v2-progress-meta{
  display:flex;
  justify-content:space-between;
  font:500 13px/1.4 var(--body);
  color:var(--ink-soft);
  margin-bottom:8px;
}
.v2-progress-track{
  height:6px;
  border-radius:999px;
  background:var(--steel);
  overflow:hidden;
}
.v2-progress-fill{
  height:100%;
  width:11.111%;
  background:var(--gold);
  transition:width .3s ease;
}

.v2-step{ display:none; }
.v2-step.is-active{ display:block; animation:v2fade .25s ease; }
@keyframes v2fade{ from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;} }

.v2-step h1{
  font:400 clamp(24px,3.4vw,32px)/1.25 var(--display);
  color:var(--ink);
  margin:6px 0 10px;
}
.v2-step .lede{ color:var(--ink-soft); margin-bottom:20px; }

.v2-subtle-label{
  display:block;
  font:600 13px/1.4 var(--body);
  color:var(--ink);
  margin:20px 0 10px;
}

/* Large single-select cards (Screens 1-3) */
.v2-card-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:12px;
  margin-bottom:8px;
}
.v2-card-grid-3{ grid-template-columns:repeat(3,1fr); }
@media (max-width:560px){ .v2-card-grid-3{ grid-template-columns:1fr; } }

.v2-card{
  text-align:left;
  border:1.5px solid var(--line);
  border-radius:10px;
  background:var(--paper);
  padding:16px;
  cursor:pointer;
  font:inherit;
  color:var(--ink);
  display:flex;
  flex-direction:column;
  gap:4px;
  transition:border-color .15s ease, box-shadow .15s ease, transform .1s ease;
}
.v2-card:hover{ border-color:var(--gold); }
.v2-card:focus-visible{ outline:2px solid var(--gold-deep); outline-offset:2px; }
.v2-card strong{ font:600 15px/1.3 var(--body); }
.v2-card span{ font:400 13px/1.4 var(--body); color:var(--ink-soft); }
.v2-card.is-selected{
  border-color:var(--gold-deep);
  background:var(--gold-pale);
  box-shadow:0 0 0 1px var(--gold-deep) inset;
}
.v2-card.is-selected strong{ color:var(--gold-deep); }

/* Chip multi-select (subtypes, org types, contact types, availability, radius) */
.v2-chip-grid, .v2-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:8px;
}
.v2-chip{
  border:1.5px solid var(--line);
  background:var(--paper);
  color:var(--ink);
  border-radius:999px;
  padding:8px 14px;
  font:500 13px/1 var(--body);
  cursor:pointer;
  transition:border-color .15s ease, background .15s ease;
}
.v2-chip:hover{ border-color:var(--gold); }
.v2-chip:focus-visible{ outline:2px solid var(--gold-deep); outline-offset:2px; }
.v2-chip.is-selected{
  border-color:var(--gold-deep);
  background:var(--gold-deep);
  color:#fff;
}

/* Radio-style choice list (paid-volunteering clarification) */
.v2-choice-list{ display:flex; flex-direction:column; gap:8px; margin-top:10px; }
.v2-choice-row{
  display:flex;
  align-items:flex-start;
  gap:10px;
  border:1.5px solid var(--line);
  border-radius:8px;
  padding:12px 14px;
  cursor:pointer;
  background:var(--paper);
}
.v2-choice-row:hover{ border-color:var(--gold); }
.v2-choice-row.is-selected{ border-color:var(--gold-deep); background:var(--gold-pale); }
.v2-choice-row input{ margin-top:3px; }

.v2-two-col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
@media (max-width:560px){ .v2-two-col{ grid-template-columns:1fr; } }

.v2-checkbox-row{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:10px 0;
  cursor:pointer;
  font:400 14px/1.5 var(--body);
  color:var(--ink);
}
.v2-checkbox-row input{ margin-top:3px; width:18px; height:18px; }
.v2-confirm-row{ border-top:1px solid var(--line); margin-top:16px; padding-top:16px; }

.v2-note{
  font:400 13px/1.5 var(--body);
  color:var(--ink-soft);
  background:var(--paper-dim);
  border:1px solid var(--line);
  border-radius:8px;
  padding:12px 14px;
  margin:10px 0 20px;
}

.v2-callout{
  border:1px solid var(--line);
  background:var(--paper-dim);
  border-radius:10px;
  padding:16px 18px;
  margin:18px 0;
  font:400 14px/1.55 var(--body);
  color:var(--ink);
}
.v2-callout-title{
  font:600 15px/1.4 var(--body);
  margin:0 0 4px;
}
.v2-callout p{ color:var(--ink-soft); margin:6px 0 0; }
.v2-callout-code{
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  font-size:12px;
  white-space:pre-wrap;
  word-break:break-word;
  max-height:340px;
  overflow:auto;
}

.v2-reveal{ margin-top:6px; }

.v2-error{
  color:#B4432A;
  font:500 13px/1.4 var(--body);
  min-height:1.2em;
  margin:4px 0 12px;
}

.v2-summary-card{
  display:flex;
  flex-direction:column;
  gap:14px;
  border:1px solid var(--line);
  border-radius:10px;
  padding:18px 20px;
  background:var(--paper-dim);
  margin-bottom:8px;
}
.v2-summary-row{ display:flex; flex-direction:column; gap:2px; }
.v2-summary-row span{ font:500 12px/1.3 var(--body); color:var(--ink-faint); text-transform:uppercase; letter-spacing:.04em; }
.v2-summary-row strong{ font:600 15px/1.4 var(--body); color:var(--ink); white-space:pre-wrap; }
.v2-summary-edit{
  align-self:flex-start;
  background:none;
  border:none;
  color:var(--gold-deep);
  font:600 12px/1 var(--body);
  cursor:pointer;
  padding:0;
  text-decoration:underline;
}

.v2-nav{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-top:28px;
  gap:12px;
}
.v2-nav-end{ justify-content:flex-end; }

.v2-visually-hidden{
  position:absolute;
  width:1px; height:1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
}

.v2-body :focus-visible{ outline:2px solid var(--gold-deep); outline-offset:2px; }

/* Advanced preferences (collapsed by default) */
.v2-advanced{
  border:1px solid var(--line);
  border-radius:10px;
  padding:4px 18px 18px;
  margin:24px 0 8px;
  background:var(--paper-dim);
}
.v2-advanced summary{
  cursor:pointer;
  font:600 14px/1 var(--body);
  color:var(--ink);
  padding:14px 0;
  display:flex;
  align-items:center;
  gap:8px;
  list-style:none;
}
.v2-advanced summary::-webkit-details-marker{ display:none; }
.v2-advanced summary::before{
  content:'▸';
  color:var(--gold-deep);
  transition:transform .15s ease;
}
.v2-advanced[open] summary::before{ transform:rotate(90deg); }
.v2-optional-tag{
  font:500 11px/1 var(--body);
  color:var(--ink-faint);
  border:1px solid var(--line);
  border-radius:999px;
  padding:3px 8px;
  text-transform:uppercase;
  letter-spacing:.03em;
}

/* Personal-profile step (Screen 2) */
.v2-heading-row{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin:6px 0 10px;
}
.v2-heading-row h1{ margin:0; }

.v2-badge-recommended{
  font:600 11px/1 var(--body);
  color:var(--gold-deep);
  background:var(--gold-pale);
  border:1px solid var(--gold-deep);
  border-radius:999px;
  padding:4px 10px;
  text-transform:uppercase;
  letter-spacing:.03em;
  white-space:nowrap;
}

.v2-personal-guidance{
  background:var(--paper-dim);
  border:1px solid var(--line);
  border-radius:10px;
  padding:12px 16px;
  margin:4px 0 18px;
  font:400 13px/1.5 var(--body);
  color:var(--ink-soft);
}
.v2-personal-guidance p{ margin:0 0 6px; font-weight:600; color:var(--ink); }
.v2-personal-guidance ul{ margin:0; padding-left:18px; }
.v2-personal-guidance li{ margin:2px 0; }

.v2-char-counter{
  font:500 12px/1.4 var(--body);
  color:var(--ink-faint);
  margin:6px 0 0;
  text-align:right;
}

.v2-personal-suggestion{
  font:400 13px/1.4 var(--body);
  color:var(--ink-soft);
  margin:4px 0 0;
}
.v2-personal-suggestion.is-positive{ color:var(--gold-deep); }

.v2-example-details{ margin:16px 0 8px; }
.v2-example-details summary{
  cursor:pointer;
  font:500 13px/1.4 var(--body);
  color:var(--ink-soft);
  text-decoration:underline;
  list-style:none;
}
.v2-example-details summary::-webkit-details-marker{ display:none; }
.v2-example-text{
  margin:8px 0 0;
  font:400 13px/1.5 var(--body);
  color:var(--ink-soft);
  background:var(--paper-dim);
  border:1px solid var(--line);
  border-radius:8px;
  padding:10px 14px;
}
.v2-advanced-intro{ margin:0 0 16px; }
.v2-advanced-group{ margin-bottom:20px; }
.v2-advanced-group:last-child{ margin-bottom:0; }
.v2-advanced-group h3{
  font:600 14px/1.3 var(--body);
  color:var(--ink);
  margin:0 0 8px;
}

/* Segmented single-select (restriction mode) */
.v2-segment{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-bottom:10px;
}
.v2-segment .v2-chip{ border-radius:8px; }

/* Review-screen edit links */
.v2-summary-row-header{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:8px;
}

/* Auth gate (hidden internal-test page) */
.v2-auth-gate{
  border:1px solid var(--line);
  background:var(--paper-dim);
  border-radius:12px;
  padding:32px 28px;
  margin:24px 0;
  text-align:center;
}
.v2-auth-gate h2{
  font:600 20px/1.3 var(--display,var(--body));
  color:var(--ink);
  margin:0 0 8px;
}
.v2-auth-gate p{
  color:var(--ink-soft);
  margin:0 0 18px;
  font:400 14px/1.55 var(--body);
}
.v2-google-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 22px;
  border-radius:8px;
  border:1px solid var(--line);
  background:var(--ink);
  color:var(--paper);
  font:600 14px/1 var(--body);
  cursor:pointer;
}
.v2-google-btn:disabled{ opacity:0.6; cursor:not-allowed; }
.v2-google-btn-secondary{
  background:transparent;
  color:var(--ink);
}
.v2-auth-message{
  margin-top:12px;
  font-size:13px;
  color:var(--ink-soft);
}