/* Assessments hub and assessment pages. Builds on ndr-base.css and
   relationships.css (moss / sand / lime earth palette). */

.as-site section[id] { scroll-margin-top: 6rem; }

/* Hero: dark moss field */

.as-hero {
  background:
    radial-gradient(40rem 26rem at 85% 0%, rgba(168, 212, 90, 0.14), transparent 65%),
    var(--forest-800);
  color: #fff;
  padding: clamp(3.5rem, 7vw, 6rem) 0 clamp(8rem, 12vw, 10rem);
}
.as-hero--page { padding-bottom: clamp(3.5rem, 7vw, 5.5rem); }
.as-hero .display { color: #fff; max-width: 20ch; }
.as-hero .lede { color: rgba(255, 255, 255, 0.86); margin-top: 1.25rem; max-width: 42rem; }
.as-hero .hero-actions { margin-top: 2rem; }

.as-badge {
  display: inline-block;
  background: rgba(212, 236, 154, 0.14);
  border: 1px solid rgba(212, 236, 154, 0.6);
  border-radius: 999px;
  color: #d4ec9a;
  font-size: 0.92rem;
  font-weight: 700;
  margin-bottom: 1.4rem;
  padding: 0.4rem 1.1rem;
}

.as-tagline { color: #d4ec9a; font-size: clamp(1.1rem, 1.8vw, 1.3rem); font-weight: 700; margin-top: 0.9rem; }

.as-crumbs { display: flex; flex-wrap: wrap; gap: 0.5rem; font-size: 0.92rem; font-weight: 700; margin-bottom: 1.25rem; color: rgba(255, 255, 255, 0.7); }
.as-crumbs a { color: #d4ec9a; }
.as-crumbs a:hover { color: #fff; }

.as-hero-tests { display: flex; flex-wrap: wrap; gap: 0.6rem; list-style: none; margin-top: 2rem; }
.as-hero-tests li {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 999px;
  font-size: 0.88rem;
  font-weight: 700;
  padding: 0.35rem 0.9rem;
}
.as-hero-tests .as-hero-cred { background: none; color: rgba(255, 255, 255, 0.75); font-weight: 600; padding-inline: 0.2rem; }

/* Assessment picker (overlaps the hero) */

.as-choose { margin-top: clamp(-7rem, -9vw, -5.5rem); position: relative; z-index: 2; }
.as-choose-panel {
  background: #fff;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  padding: clamp(1.5rem, 3vw, 2.25rem);
}
.as-choose-panel h2 { color: var(--ink); font-size: 1.2rem; font-weight: 800; margin-bottom: 1.25rem; }

.as-cards { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); }
@media (min-width: 75rem) {
  .as-choose .as-cards { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .as-choose .as-cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.as-card {
  background: var(--sage-100);
  border: 1px solid transparent;
  border-radius: var(--radius-md);
  color: var(--body);
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  padding: 1.25rem 1.2rem 1.1rem;
  transition: transform 0.2s var(--ease-out), box-shadow 0.2s var(--ease-out), border-color 0.2s;
}
.as-card:hover { border-color: rgba(52, 73, 58, 0.25); box-shadow: var(--shadow-md); color: var(--body); transform: translateY(-3px); }
.as-card strong { color: var(--ink); font-size: 1.08rem; line-height: 1.25; }
.as-card-audience { color: var(--forest-600); font-size: 0.78rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.as-card-blurb { font-size: 0.92rem; line-height: 1.5; }
.as-card-tests { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-top: 0.2rem; }
.as-card-tests span { background: #fff; border-radius: 999px; color: var(--forest-700); font-size: 0.75rem; font-weight: 700; padding: 0.15rem 0.6rem; }
.as-card-more { align-items: center; color: var(--forest-700); display: inline-flex; font-size: 0.9rem; font-weight: 800; gap: 0.45rem; margin-top: auto; padding-top: 0.5rem; }

/* Body: content column + sticky schedule card */

.as-body {
  align-items: start;
  display: grid;
  gap: clamp(2.5rem, 5vw, 4.5rem);
  grid-template-columns: minmax(0, 1fr) 21rem;
  padding-block: clamp(3.5rem, 7vw, 5.5rem);
}
.as-block + .as-block { margin-top: clamp(3rem, 6vw, 4.5rem); }
.as-block > .lede { margin-top: 0.75rem; max-width: 44rem; }

.as-reasons, .as-points { display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 1.75rem; }
.as-reason, .as-point {
  background: #fff;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  padding: 1.35rem 1.4rem;
}
.as-reason h3, .as-point h3, .as-step h3 { color: var(--ink); font-size: 1.05rem; font-weight: 800; margin-bottom: 0.35rem; }
.as-reason p, .as-point p, .as-step p { font-size: 0.95rem; line-height: 1.6; }

.as-steps { display: grid; gap: 1rem; list-style: none; margin-top: 1.75rem; }
.as-step { align-items: flex-start; background: #fff; border-radius: var(--radius-md); box-shadow: var(--shadow-sm); display: flex; gap: 1.1rem; padding: 1.25rem 1.4rem; }
.as-step-n {
  align-items: center;
  background: var(--clay);
  border-radius: 50%;
  color: var(--forest-900);
  display: inline-flex;
  flex: none;
  font-weight: 800;
  height: 2rem;
  justify-content: center;
  width: 2rem;
}

.as-optional { background: var(--sage-100); border-radius: var(--radius-md); margin-top: 1.25rem; padding: 1.35rem 1.4rem; }
.as-optional h3 { color: var(--ink); font-size: 1rem; font-weight: 800; }
.as-optional > p { font-size: 0.92rem; margin-top: 0.2rem; }
.as-optional ul { display: grid; gap: 0.55rem; list-style: none; margin-top: 0.9rem; }
.as-optional li { display: flex; flex-wrap: wrap; gap: 0.25rem 0.6rem; font-size: 0.92rem; }
.as-optional strong { color: var(--forest-800); min-width: 6.5rem; }

.as-receive { display: grid; gap: 0.9rem; list-style: none; margin-top: 1.5rem; }
.as-receive li { border-left: 3px solid var(--clay); display: grid; gap: 0.2rem; padding: 0.2rem 0 0.2rem 1.1rem; }
.as-receive strong { color: var(--ink); }

.as-approach p { margin-top: 0.9rem; max-width: 44rem; }

.as-cards--related { margin-top: 1.5rem; }

.as-body--single { display: block; }
.as-points--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.as-body--single + .as-body--single { padding-top: 0; }
.cta-band .cta-contact { color: inherit; }
.cta-band .cta-contact:hover span { color: #fff; }

/* What to expect timeline */
.as-timeline { counter-reset: none; display: grid; gap: 0; list-style: none; margin-top: 1.75rem; position: relative; }
.as-timeline::before { background: rgba(52, 73, 58, 0.18); bottom: 1.5rem; content: ""; left: 0.97rem; position: absolute; top: 1.5rem; width: 2px; }
.as-timeline li { display: flex; gap: 1.1rem; padding: 0.7rem 0; position: relative; }
.as-timeline h3 { color: var(--ink); font-size: 1.05rem; font-weight: 800; margin-bottom: 0.2rem; }
.as-timeline p { font-size: 0.95rem; line-height: 1.6; }
.as-timeline .as-step-n { position: relative; z-index: 1; }

/* Screeners */
.as-screener-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); margin-top: 1.5rem; }
.as-screener {
  background: #fff;
  border: 1px solid rgba(52, 73, 58, 0.14);
  border-radius: var(--radius-md);
  color: var(--body);
  display: flex;
  flex-direction: column;
  font-size: 0.92rem;
  gap: 0.4rem;
  line-height: 1.5;
  padding: 1.2rem;
  transition: box-shadow 0.2s, transform 0.2s var(--ease-out);
}
.as-screener:hover { box-shadow: var(--shadow-md); color: var(--body); transform: translateY(-2px); }
.as-screener strong { color: var(--ink); font-size: 1.15rem; }
.as-screener-note { background: var(--sage-100); border-radius: var(--radius-md); font-size: 0.92rem; margin-top: 1rem; padding: 0.9rem 1.1rem; }
.as-screener-note strong { color: var(--ink); }

/* Schedule card */

.as-schedule {
  background: var(--forest-800);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  color: rgba(255, 255, 255, 0.85);
  padding: 1.6rem 1.5rem;
  position: sticky;
  top: 6.5rem;
}
.as-schedule-eyebrow { color: #d4ec9a; font-size: 0.8rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.as-schedule h2 { color: #fff; font-size: 1.35rem; font-weight: 800; line-height: 1.2; margin-top: 0.4rem; }
.as-schedule-sub { font-size: 0.92rem; line-height: 1.55; margin: 0.6rem 0 1.1rem; }
.as-schedule .btn { justify-content: center; width: 100%; }
.as-schedule-benefits { display: grid; gap: 0.45rem; font-size: 0.88rem; list-style: none; margin-top: 1.2rem; }
.as-schedule-benefits li { padding-left: 1.4rem; position: relative; }
.as-schedule-benefits li::before { color: #d4ec9a; content: "✓"; font-weight: 800; left: 0; position: absolute; }
.as-schedule-nav { border-top: 1px solid rgba(255, 255, 255, 0.15); margin-top: 1.2rem; padding-top: 1rem; }
.as-schedule-nav p { color: #fff; font-size: 0.85rem; font-weight: 800; margin-bottom: 0.4rem; }
.as-schedule-nav ul { list-style: none; }
.as-schedule-nav a { color: rgba(255, 255, 255, 0.8); display: block; font-size: 0.9rem; padding: 0.2rem 0; }
.as-schedule-nav a:hover, .as-schedule-nav a[aria-current="page"] { color: #d4ec9a; }
.as-schedule-nav a[aria-current="page"] { font-weight: 800; }
.as-schedule-trust { border-top: 1px solid rgba(255, 255, 255, 0.15); font-size: 0.85rem; font-style: italic; line-height: 1.55; margin-top: 1rem; padding-top: 1rem; }

.as-mobile-bar { display: none; }

/* Assessment team */

.as-team { background: var(--sage-100); padding: clamp(4rem, 8vw, 6.5rem) 0; }
.as-team-grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); }
.as-clinician { align-items: flex-start; background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); display: flex; gap: 1.25rem; padding: 1.4rem; }
.as-clinician img { border-radius: 50%; flex: none; height: 6.5rem; object-fit: cover; width: 6.5rem; }
.as-clinician h3 { color: var(--ink); font-size: 1.15rem; font-weight: 800; }
.as-clinician-role { color: var(--forest-600); font-size: 0.85rem; font-weight: 800; margin-top: 0.15rem; }
.as-clinician-title { color: var(--ink); font-size: 0.88rem; font-weight: 700; margin: 0.3rem 0 0.5rem; }
.as-clinician-note { font-size: 0.82rem; font-style: italic; margin-bottom: 0.5rem; }
.as-clinician p:last-child { font-size: 0.92rem; line-height: 1.55; }

/* Responsive */

@media (max-width: 60rem) {
  .as-body { grid-template-columns: 1fr; }
  .as-points--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .as-schedule { display: none; }
  .as-mobile-bar:not(.is-dismissed) {
    align-items: center;
    background: var(--forest-900);
    bottom: 0;
    box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.18);
    color: #fff;
    display: flex;
    gap: 0.75rem;
    left: 0;
    padding: 0.7rem 1rem;
    position: fixed;
    right: 0;
    z-index: 40;
  }
  .as-mobile-bar span { flex: 1; font-size: 0.92rem; font-weight: 800; }
  .as-mobile-bar .btn { font-size: 0.9rem; padding: 0.6rem 1rem; }
  .as-mobile-bar-close { background: none; border: 0; color: rgba(255, 255, 255, 0.75); cursor: pointer; padding: 0.4rem; }
  .as-site:has(.as-mobile-bar:not(.is-dismissed)) .site-footer { padding-bottom: 5rem; }
}

@media (max-width: 44rem) {
  .as-reasons, .as-points, .as-points--3 { grid-template-columns: 1fr; }
  .as-clinician { flex-direction: column; }
  .as-mobile-bar span { display: none; }
  .as-mobile-bar .btn { flex: 1; justify-content: center; }
}

/* Resources page */
.as-screener--static:hover { box-shadow: none; transform: none; }
.res-actions { display: flex; flex-wrap: wrap; gap: 0.2rem 1.1rem; margin-top: auto; }
.res-controls { display: grid; gap: 1rem; margin: 1.5rem 0 2rem; }
.res-controls input {
  background: #fff;
  border: 1px solid rgba(52, 73, 58, 0.2);
  border-radius: 999px;
  font: inherit;
  max-width: 32rem;
  padding: 0.8rem 1.2rem;
  width: 100%;
}
.res-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.res-chip {
  background: #fff;
  border: 1px solid rgba(52, 73, 58, 0.2);
  border-radius: 999px;
  color: var(--ink);
  cursor: pointer;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 700;
  padding: 0.45rem 1rem;
}
.res-chip.is-active { background: var(--forest-800); border-color: var(--forest-800); color: #fff; }
.res-cat + .res-cat { margin-top: 2rem; }
.res-cat-title { color: var(--forest-600); font-size: 0.82rem; font-weight: 800; letter-spacing: 0.08em; margin-bottom: 0.6rem; text-transform: uppercase; }
.res-topic { background: #fff; border-radius: var(--radius-md); box-shadow: var(--shadow-sm); margin-bottom: 0.6rem; }
.res-topic summary { align-items: center; cursor: pointer; display: flex; font-weight: 800; gap: 1rem; justify-content: space-between; list-style: none; padding: 1rem 1.2rem; color: var(--ink); }
.res-topic summary::-webkit-details-marker { display: none; }
.res-topic summary::after { color: var(--forest-600); content: "+"; font-size: 1.3rem; font-weight: 700; }
.res-topic[open] summary::after { content: "–"; }
.res-topic summary small { color: var(--body); font-size: 0.82rem; font-weight: 600; margin-left: auto; }
.res-topic-body { border-top: 1px solid rgba(52, 73, 58, 0.1); display: grid; gap: 1.1rem; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); padding: 1.1rem 1.2rem 1.3rem; }
.res-topic-body blockquote { font-style: italic; grid-column: 1 / -1; white-space: pre-line; }
.res-group h4 { color: var(--ink); font-size: 0.9rem; font-weight: 800; margin-bottom: 0.35rem; }
.res-group ul { display: grid; gap: 0.3rem; list-style: none; }
.res-group li { font-size: 0.92rem; line-height: 1.45; }
.res-group a { color: var(--forest-700); text-decoration: underline; text-decoration-color: rgba(52, 73, 58, 0.3); text-underline-offset: 0.18em; }
.res-group a:hover { text-decoration-color: currentColor; }
.res-empty, .res-note { font-size: 0.9rem; margin-top: 1.25rem; }