/* ==========================================================================
   Public pages: landing, category request form, thanks, info and legal pages.
   Builds on the tokens and components in site.css.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Landing page
   -------------------------------------------------------------------------- */
.hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
  align-items: center;
}

@media (min-width: 56rem) {
  .hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-7); }
}

.hero__points {
  margin: var(--space-5) 0 0;
  font-weight: 600;
  color: var(--color-heading);
}

.quickstart { padding: var(--space-5); }
.quickstart h2 { margin-bottom: var(--space-4); font-size: var(--text-xl); }
.quickstart .form-field { margin-bottom: var(--space-4); }
.quickstart .btn-block { margin-top: var(--space-1); }

.hero .quickstart__note {
  margin: var(--space-3) 0 0;
  color: var(--color-text-muted);
  font-size: var(--text-sm);
  text-align: center;
}

.hero.hero--compact { padding-block: var(--space-6); }
.hero--compact .actions { margin-top: var(--space-5); }

@media (min-width: 56rem) {
  .hero.hero--compact { padding-block: var(--space-8); }
}

.category-grid { margin-bottom: 0; }

.card-link__cta {
  margin-top: auto;
  padding-top: var(--space-2);
  color: var(--color-primary);
  font-weight: 700;
}

.card-link:hover .card-link__cta { text-decoration: underline; }

.trust-grid { margin-bottom: 0; }
.trust-grid h3 { color: var(--color-heading); }
.trust-grid p { color: var(--color-text-muted); }

.provider-cta {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-4) var(--space-6);
  align-items: center;
  padding: var(--space-5);
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}

@media (min-width: 56rem) {
  .provider-cta {
    grid-template-columns: minmax(0, 3fr) auto;
    padding: var(--space-6);
  }
}

.provider-cta__text > :last-child { margin-bottom: 0; }
.provider-cta__text p { color: var(--color-text-muted); }
.provider-cta .provider-cta__actions { margin: 0; }

.link-list {
  margin: 0 0 var(--space-4);
  padding: 0;
  list-style: none;
}

.link-list > li + li { margin-top: var(--space-2); }
.link-list a { font-weight: 600; }

/* --------------------------------------------------------------------------
   Category page and request form
   -------------------------------------------------------------------------- */
.breadcrumbs { margin-bottom: var(--space-4); }

.breadcrumbs__list {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--color-text-muted);
  font-size: var(--text-sm);
}

.breadcrumbs__list > li { margin: 0; }

.breadcrumbs__list > li + li::before {
  content: "/";
  margin: 0 .5rem;
  color: var(--color-border-strong);
}

.breadcrumbs__list [aria-current="page"] { color: var(--color-text); font-weight: 600; }

.category-header {
  display: flex;
  align-items: flex-start;
  gap: var(--space-4);
  margin: 0 0 var(--space-6);
}

.category-header__icon { width: 3.5rem; height: 3.5rem; margin-top: .25rem; }
.category-header__icon .icon { width: 2rem; height: 2rem; }
.category-header__text { min-width: 0; }
.category-header__text .eyebrow { margin-bottom: var(--space-2); }
.category-header__text .intro { margin-bottom: 0; }

@media (max-width: 39.99rem) {
  .category-header__icon { display: none; }
}

.form-intro {
  margin-bottom: var(--space-4);
  color: var(--color-text-muted);
  font-size: var(--text-sm);
}

.lead-form .form-section > h2 {
  display: flex;
  align-items: center;
  gap: .75rem;
}

.form-step {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: var(--color-primary);
  color: var(--color-on-primary);
  font-size: var(--text-md);
  font-weight: 800;
  line-height: 1;
}

.form-subsection {
  margin-top: var(--space-5);
  padding-top: var(--space-5);
  border-top: 1px solid var(--color-border);
}

.form-subsection__title {
  margin-bottom: var(--space-1);
  font-size: var(--text-lg);
}

.form-subsection > .field-help { margin-bottom: var(--space-4); }

.lead-form .form-section > .fieldset,
.lead-form .form-section > .form-field { margin-bottom: var(--space-5); }
.lead-form .form-section > :last-child { margin-bottom: 0; }

.input--short { max-width: 10rem; }
.input--orgnr { max-width: 16rem; }

.input-unit {
  display: flex;
  align-items: stretch;
  max-width: 16rem;
}

.input-unit .input {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.input-unit__suffix {
  display: inline-flex;
  align-items: center;
  padding: 0 .75rem;
  border: 1px solid var(--color-border-strong);
  border-left: 0;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  background: var(--color-bg-muted);
  color: var(--color-text-muted);
  font-weight: 600;
  white-space: nowrap;
}

.form-submit {
  background: var(--color-primary-tint);
  border-color: var(--color-primary-soft);
}

.consent-label { color: var(--color-heading); font-weight: 600; }

.form-submit .form-submit__actions { margin-top: var(--space-5); }
.form-submit__button { min-width: 14rem; font-size: var(--text-lg); }

@media (max-width: 39.99rem) {
  .form-submit__button { width: 100%; }
}

.lead-aside .card h2 { font-size: var(--text-lg); }

.mini-steps {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: mini-step;
}

.mini-steps > li {
  position: relative;
  padding-left: 2.25rem;
  counter-increment: mini-step;
  color: var(--color-text-muted);
}

.mini-steps > li + li { margin-top: var(--space-3); }

.mini-steps > li::before {
  content: counter(mini-step);
  position: absolute;
  left: 0;
  top: .05rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  background: var(--color-primary-soft);
  color: var(--color-primary-active);
  font-size: var(--text-xs);
  font-weight: 800;
}

.lead-aside .checklist { margin-bottom: 0; }

/* --------------------------------------------------------------------------
   Thanks page
   -------------------------------------------------------------------------- */
.thanks { margin-bottom: var(--space-6); }

.thanks__icon {
  display: block;
  width: 3.5rem;
  height: 3.5rem;
  margin-bottom: var(--space-4);
  border-radius: 50%;
  background: var(--color-success) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 60% no-repeat;
}

.ref-box {
  display: inline-block;
  margin-top: var(--space-2);
  padding: var(--space-4) var(--space-5);
  background: var(--color-primary-tint);
  border: 1px solid var(--color-primary-soft);
  border-radius: var(--radius);
}

.ref-box p { margin: 0; }

.ref-box__label {
  color: var(--color-text-muted);
  font-size: var(--text-sm);
  font-weight: 700;
}

.ref-box__value {
  color: var(--color-heading);
  font-family: var(--font-mono);
  font-size: 1.75rem;
  font-weight: 700;
  letter-spacing: .06em;
}

.ref-box .ref-box__help {
  margin-top: var(--space-1);
  color: var(--color-text-muted);
  font-size: var(--text-sm);
}

.section-block { margin-top: var(--space-6); }
.section-block > h2 { margin-bottom: var(--space-4); }

.steps.steps--stacked { grid-template-columns: minmax(0, 1fr); }

.steps--stacked > li {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr);
  column-gap: var(--space-4);
  align-items: start;
}

.steps--stacked > li::before {
  grid-row: span 2;
  margin: 0;
}

.steps--stacked > li > * { grid-column: 2; }

.thanks__contact { margin-top: var(--space-5); }

/* --------------------------------------------------------------------------
   Legal and information pages
   -------------------------------------------------------------------------- */
.prose { max-width: calc(var(--container-narrow) + 2 * var(--gutter)); }
.prose__header { margin-bottom: var(--space-5); }
.prose__header .intro { margin-bottom: 0; }

.prose section > h2 {
  margin-top: var(--space-6);
  font-size: var(--text-xl);
}

.prose h3 {
  margin-top: var(--space-5);
  font-size: var(--text-lg);
}

.prose .dl-grid { margin-bottom: var(--space-4); }
.prose .callout { margin-top: var(--space-5); }

.toc {
  margin: 0 0 var(--space-5);
  padding: var(--space-4) var(--space-5);
  background: var(--color-bg-muted);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
}

.toc__title {
  margin: 0 0 var(--space-2);
  font-size: var(--text-base);
}

.toc ol { margin: 0; }

@media (min-width: 40rem) {
  .toc ol { columns: 2; column-gap: var(--space-6); }
  .toc li { break-inside: avoid; }
}

@media print {
  .toc,
  .breadcrumbs,
  .lead-aside { display: none !important; }
}
