:root {
  --vl-ink: #062033;
  --vl-ink-soft: #17364a;
  --vl-teal: #2fb7b3;
  --vl-sea: #47bd98;
  --vl-steel: #5b8fa3;
  --vl-white: #f7fbfb;
  --vl-mist: #eef6f5;
  --vl-border: #d8e5e4;
  --vl-warm: #f3efe7;
  --vl-text: #203847;
  --vl-muted: #637987;
  --vl-shadow: 0 18px 50px rgba(6, 32, 51, .09);
  --vl-radius: 8px;
}

html {
  min-height: 100%;
  scroll-behavior: smooth;
}

body {
  min-height: 100%;
  color: var(--vl-text);
  background: var(--vl-white);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: 0;
}

a {
  color: var(--vl-ink);
  text-decoration-color: rgba(47, 183, 179, .45);
  text-underline-offset: .22rem;
}

a:hover {
  color: var(--vl-teal);
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(247, 251, 251, .93);
  border-bottom: 1px solid rgba(216, 229, 228, .85);
  backdrop-filter: blur(18px);
}

.navbar {
  min-height: 78px;
}

.brand-lockup img,
.footer-logo {
  height: auto;
  max-width: 100%;
}

.navbar-toggler {
  border-color: var(--vl-border);
  border-radius: var(--vl-radius);
}

.nav-link {
  color: var(--vl-ink);
  font-weight: 650;
}

.nav-link:hover,
.nav-link:focus {
  color: var(--vl-teal);
}

.btn {
  border-radius: var(--vl-radius);
  font-weight: 750;
}

.btn-brand {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--vl-ink);
  --bs-btn-border-color: var(--vl-ink);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #0e344c;
  --bs-btn-hover-border-color: #0e344c;
  --bs-btn-focus-shadow-rgb: 47, 183, 179;
}

.btn-soft {
  --bs-btn-color: var(--vl-ink);
  --bs-btn-bg: rgba(247, 251, 251, .92);
  --bs-btn-border-color: rgba(247, 251, 251, .92);
  --bs-btn-hover-color: var(--vl-ink);
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: #fff;
}

.btn-outline-brand {
  --bs-btn-color: var(--vl-ink);
  --bs-btn-border-color: var(--vl-ink);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--vl-ink);
  --bs-btn-hover-border-color: var(--vl-ink);
}

.btn:focus-visible,
.form-control:focus,
.form-select:focus {
  border-color: var(--vl-teal);
  box-shadow: 0 0 0 .22rem rgba(47, 183, 179, .2);
}

.hero-section {
  position: relative;
  overflow: hidden;
  color: #fff;
  isolation: isolate;
  background: var(--vl-ink);
}

.hero-section::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  background: linear-gradient(90deg, rgba(6, 32, 51, .96), rgba(6, 32, 51, .78) 54%, rgba(6, 32, 51, .48));
}

.hero-banner-layer {
  position: absolute;
  inset: 0;
  z-index: -2;
  background-position: center;
  background-size: cover;
  opacity: 0;
  transform: scale(1.02);
  transition: opacity 1.15s ease;
}

.hero-banner-layer.is-active {
  opacity: 1;
}

.min-vh-hero {
  min-height: calc(100vh - 78px);
  padding: 5rem 0;
}

.eyebrow {
  margin-bottom: .85rem;
  color: var(--vl-teal);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .12rem;
  text-transform: uppercase;
}

.hero-section h1 {
  max-width: 780px;
  margin: 0;
  color: #fff;
  font-size: clamp(2.6rem, 6vw, 5.8rem);
  line-height: .98;
  letter-spacing: 0;
}

.hero-lede {
  max-width: 670px;
  margin: 1.5rem 0 0;
  color: rgba(247, 251, 251, .86);
  font-size: 1.2rem;
  line-height: 1.7;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .85rem;
  margin-top: 2rem;
}

.trust-row {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 2.4rem;
  color: rgba(247, 251, 251, .78);
}

.trust-row span {
  padding: .5rem .7rem;
  border: 1px solid rgba(247, 251, 251, .18);
  border-radius: var(--vl-radius);
  background: rgba(247, 251, 251, .08);
}

.search-panel {
  display: grid;
  gap: 1.2rem;
  padding: 1.35rem;
  color: var(--vl-ink);
  background: rgba(247, 251, 251, .96);
  border: 1px solid rgba(247, 251, 251, .6);
  border-radius: var(--vl-radius);
  box-shadow: var(--vl-shadow);
}

.search-panel h2 {
  margin: 0;
  color: var(--vl-ink);
  font-size: 1.6rem;
}

.panel-kicker,
.panel-note {
  margin: 0;
  color: var(--vl-muted);
}

.panel-kicker {
  font-weight: 750;
}

.panel-note {
  font-size: .94rem;
  line-height: 1.55;
}

.process-strip {
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: var(--vl-ink);
}

.process-strip img {
  display: block;
  width: 100%;
  height: auto;
}

.form-label {
  color: var(--vl-ink);
  font-weight: 720;
}

.form-control,
.form-select {
  border-color: var(--vl-border);
  border-radius: var(--vl-radius);
}

.section-band,
.content-section,
.quote-section,
.cta-section,
.page-hero {
  padding: 5.5rem 0;
}

.section-band {
  background: #fff;
}

.section-band.soft {
  background: var(--vl-mist);
}

.content-section {
  background: var(--vl-white);
}

.section-heading {
  max-width: 760px;
  margin-bottom: 2rem;
}

.section-heading h2,
.content-section h2,
.page-hero h1,
.cta-panel h2 {
  margin: 0;
  color: var(--vl-ink);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: 0;
}

.section-heading h2,
.page-hero h1,
.cta-panel h2 {
  font-size: clamp(2rem, 4vw, 3.4rem);
}

.split-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  max-width: none;
}

.text-link {
  font-weight: 800;
}

.category-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.category-card,
.supplier-card,
.job-card,
.steps-grid article,
.quote-card {
  border: 1px solid var(--vl-border);
  border-radius: var(--vl-radius);
  background: #fff;
}

.category-card {
  display: block;
  min-height: 210px;
  padding: 1.2rem;
  color: var(--vl-text);
  text-decoration: none;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.category-card:hover {
  border-color: rgba(47, 183, 179, .65);
  box-shadow: var(--vl-shadow);
  transform: translateY(-2px);
}

.category-count,
.job-category {
  display: inline-flex;
  margin-bottom: 1rem;
  color: var(--vl-teal);
  font-size: .83rem;
  font-weight: 800;
}

.category-card h3,
.supplier-card h3,
.job-card h3,
.steps-grid h3 {
  margin: 0 0 .65rem;
  color: var(--vl-ink);
  font-size: 1.18rem;
  line-height: 1.25;
}

.category-card p,
.supplier-card p,
.job-card p,
.steps-grid p,
.section-copy,
.quote-card blockquote,
.page-hero p,
.content-section p {
  color: var(--vl-muted);
  line-height: 1.65;
}

.supplier-card {
  display: flex;
  min-height: 310px;
  flex-direction: column;
  padding: 1.25rem;
  box-shadow: 0 12px 36px rgba(6, 32, 51, .05);
}

.supplier-card-top,
.supplier-card-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.supplier-card-top span,
.supplier-card-bottom span {
  color: var(--vl-steel);
  font-weight: 750;
}

.supplier-card-top strong {
  color: var(--vl-ink);
}

.supplier-card h3 {
  margin-top: 1.2rem;
  font-size: 1.35rem;
}

.supplier-area {
  margin-bottom: .75rem;
  color: var(--vl-ink-soft) !important;
  font-weight: 720;
}

.supplier-card-bottom {
  margin-top: auto;
  padding-top: 1rem;
}

.supplier-card-bottom a,
.job-card a {
  font-weight: 800;
}

.supplier-profile-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 1.25rem;
  align-items: start;
}

.supplier-profile-main,
.profile-summary-card {
  border: 1px solid var(--vl-border);
  border-radius: var(--vl-radius);
  background: #fff;
  box-shadow: 0 14px 38px rgba(6, 32, 51, .06);
}

.supplier-profile-main {
  padding: 1.6rem;
}

.supplier-profile-main .section-heading {
  margin-bottom: 1rem;
}

.supplier-profile-section {
  margin-top: 1.6rem;
  padding-top: 1.3rem;
  border-top: 1px solid var(--vl-border);
}

.supplier-profile-section h2 {
  margin: 0 0 .8rem;
  color: var(--vl-ink);
  font-size: 1.25rem;
}

.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
}

.tag-list span {
  padding: .45rem .65rem;
  color: var(--vl-ink);
  font-weight: 760;
  border: 1px solid rgba(47, 183, 179, .34);
  border-radius: var(--vl-radius);
  background: rgba(47, 183, 179, .1);
}

.supplier-profile-aside {
  position: sticky;
  top: 102px;
}

.profile-summary-card {
  display: grid;
  gap: 1rem;
  padding: 1.25rem;
}

.profile-summary-card dl {
  display: grid;
  gap: .85rem;
  margin: 0;
}

.profile-summary-card div {
  padding-bottom: .85rem;
  border-bottom: 1px solid var(--vl-border);
}

.profile-summary-card div:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.profile-summary-card dt {
  color: var(--vl-muted);
  font-size: .82rem;
  font-weight: 800;
  text-transform: uppercase;
}

.profile-summary-card dd {
  margin: .2rem 0 0;
  color: var(--vl-ink);
  font-size: 1.08rem;
  font-weight: 780;
}

.job-list {
  display: grid;
  gap: .9rem;
}

.job-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.1rem 1.2rem;
}

.job-card p,
.job-card h3 {
  margin-bottom: 0;
}

.steps-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.steps-grid article {
  padding: 1.2rem;
  background: linear-gradient(180deg, #fff, var(--vl-white));
}

.steps-grid span {
  display: inline-flex;
  margin-bottom: 1.1rem;
  color: var(--vl-sea);
  font-weight: 850;
}

.quote-section {
  background: var(--vl-warm);
}

.quote-card {
  height: 100%;
  margin: 0;
  padding: 1.5rem;
  border-color: rgba(91, 143, 163, .25);
}

.quote-card blockquote {
  margin: 0 0 1.2rem;
  color: var(--vl-ink);
  font-size: 1.24rem;
}

.quote-card figcaption {
  color: var(--vl-ink);
  font-weight: 800;
}

.quote-card figcaption span {
  display: block;
  margin-top: .2rem;
  color: var(--vl-muted);
  font-weight: 600;
}

.cta-section {
  background: #fff;
}

.cta-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding: 2rem;
  border: 1px solid var(--vl-border);
  border-radius: var(--vl-radius);
  background: var(--vl-mist);
}

.cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .85rem;
}

.page-hero {
  background: var(--vl-mist);
}

.page-hero.compact {
  padding: 4.5rem 0;
}

.page-hero p {
  max-width: 760px;
  margin: 1rem 0 0;
  font-size: 1.12rem;
}

.container.narrow {
  max-width: 820px;
}

.content-section .narrow h2 {
  margin-top: 2rem;
  margin-bottom: .65rem;
  font-size: 1.45rem;
}

.content-section .narrow h2:first-child {
  margin-top: 0;
}

.site-footer {
  padding: 4rem 0 2rem;
  color: rgba(247, 251, 251, .76);
  background: var(--vl-ink);
}

.footer-copy {
  max-width: 420px;
  margin: 1rem 0 0;
  color: rgba(247, 251, 251, .72);
  line-height: 1.65;
}

.footer-heading {
  margin: 0 0 1rem;
  color: #fff;
  font-size: .92rem;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .08rem;
}

.site-footer a {
  display: block;
  margin-bottom: .65rem;
  color: rgba(247, 251, 251, .78);
  text-decoration: none;
}

.site-footer a:hover {
  color: var(--vl-teal);
}

.nav-logout-form {
  margin: 0;
}

.nav-button {
  display: inline-flex;
  padding: .5rem 0;
  color: var(--vl-ink);
  font-weight: 650;
  background: transparent;
  border: 0;
}

.nav-button:hover,
.nav-button:focus {
  color: var(--vl-teal);
}

.page-lede {
  max-width: 780px;
  margin: 1rem 0 0;
  color: var(--vl-muted);
  font-size: 1.12rem;
  line-height: 1.65;
}

.auth-section,
.form-section,
.dashboard-section {
  background: var(--vl-white);
}

.auth-section {
  padding: 5.5rem 0;
}

.auth-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 520px);
  gap: 3rem;
  align-items: center;
}

.auth-grid.compact {
  max-width: 1060px;
  margin: 0 auto;
}

.auth-copy h1,
.form-hero h1,
.dashboard-hero h1 {
  margin: 0;
  color: var(--vl-ink);
  font-size: clamp(2.4rem, 5vw, 4.8rem);
  font-weight: 850;
  line-height: 1;
  letter-spacing: 0;
}

.auth-copy p {
  max-width: 620px;
  margin: 1.2rem 0 0;
  color: var(--vl-muted);
  font-size: 1.12rem;
  line-height: 1.7;
}

.trust-list,
.mini-proof {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  margin-top: 1.6rem;
}

.trust-list span,
.mini-proof span {
  padding: .48rem .68rem;
  color: var(--vl-ink);
  font-size: .9rem;
  font-weight: 750;
  border: 1px solid var(--vl-border);
  border-radius: var(--vl-radius);
  background: #fff;
}

.auth-card,
.form-card,
.dashboard-panel,
.metric-card {
  border: 1px solid var(--vl-border);
  border-radius: var(--vl-radius);
  background: #fff;
  box-shadow: 0 14px 38px rgba(6, 32, 51, .07);
}

.auth-card {
  padding: 2rem;
}

.auth-switch {
  margin: 1.35rem 0 0;
  color: var(--vl-muted);
  text-align: center;
}

.form-hero,
.dashboard-hero {
  padding: 5rem 0 4rem;
  background: var(--vl-mist);
}

.form-hero-grid,
.dashboard-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
}

.form-section,
.dashboard-section {
  padding: 3rem 0 5rem;
}

.onboarding-form {
  display: grid;
  gap: 1.3rem;
}

.form-card {
  padding: 1.7rem;
}

.form-card-heading {
  margin-bottom: 1.3rem;
}

.form-card-heading h2,
.dashboard-panel h2,
.empty-state h2,
.empty-state h3,
.loop-row h3,
.admin-queue-grid h3 {
  margin: 0;
  color: var(--vl-ink);
  font-weight: 820;
  letter-spacing: 0;
}

.form-card-heading h2,
.dashboard-panel h2 {
  font-size: 1.45rem;
}

.form-card-heading p,
.empty-state p,
.admin-queue-grid p {
  margin: .45rem 0 0;
  color: var(--vl-muted);
  line-height: 1.6;
}

.label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
}

.info-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.35rem;
  height: 1.35rem;
  color: #fff;
  font-size: .78rem;
  font-weight: 850;
  line-height: 1;
  border: 0;
  border-radius: 50%;
  background: var(--vl-steel);
}

.attendance-slider {
  padding: 1rem;
  border: 1px solid var(--vl-border);
  border-radius: var(--vl-radius);
  background: var(--vl-white);
}

.attendance-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .8rem;
}

.attendance-heading .form-label {
  margin-bottom: 0;
}

.attendance-value {
  flex: 0 0 auto;
  padding: .42rem .64rem;
  color: #fff;
  font-weight: 850;
  line-height: 1;
  border-radius: var(--vl-radius);
  background: var(--vl-ink);
}

.attendance-range {
  accent-color: var(--vl-teal);
}

.attendance-range::-webkit-slider-thumb {
  background: var(--vl-teal);
}

.attendance-range::-moz-range-thumb {
  background: var(--vl-teal);
  border: 0;
}

.attendance-scale {
  display: flex;
  justify-content: space-between;
  margin-top: .35rem;
  color: var(--vl-muted);
  font-size: .82rem;
  font-weight: 750;
}

.field-note {
  margin: .65rem 0 0;
  color: var(--vl-muted);
  font-size: .9rem;
  line-height: 1.45;
}

.supplier-type-picker {
  min-width: 0;
  margin: 0;
  padding: 1rem;
  border: 1px solid var(--vl-border);
  border-radius: var(--vl-radius);
  background: var(--vl-white);
}

.supplier-type-picker .form-label {
  float: none;
  width: auto;
  margin-bottom: .8rem;
  font-size: 1rem;
}

.supplier-type-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .65rem;
}

.supplier-type-checkbox {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.supplier-type-card,
.budget-card {
  position: relative;
  color: var(--vl-ink);
  overflow: hidden;
  border: 1px solid rgba(216, 229, 228, .95);
  border-radius: var(--vl-radius);
  background: #fff;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(6, 32, 51, .04);
  transform: translateY(0) scale(1);
  transition:
    border-color .2s ease,
    box-shadow .2s ease,
    transform .16s ease,
    background .2s ease;
}

.supplier-type-card {
  display: grid;
  grid-template-columns: 2.6rem minmax(0, 1fr);
  column-gap: .72rem;
  align-items: center;
  min-height: 5.9rem;
  padding: .9rem;
}

.supplier-type-tick {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  color: #fff;
  border: 2px solid rgba(40, 120, 128, .28);
  border-radius: .65rem;
  background: rgba(255, 255, 255, .92);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .9),
    0 8px 16px rgba(6, 32, 51, .06);
  transform: scale(1);
  transition:
    border-color .2s ease,
    box-shadow .2s ease,
    transform .16s ease,
    background .2s ease;
}

.supplier-type-tick::before {
  width: .58rem;
  height: 1.05rem;
  content: "";
  border-right: .18rem solid #fff;
  border-bottom: .18rem solid #fff;
  opacity: 0;
  transform: translateY(-.08rem) rotate(42deg) scale(.45);
  transition: opacity .16s ease .04s, transform .22s cubic-bezier(.2, 1.65, .35, 1);
}

.supplier-type-card:hover,
.supplier-type-checkbox:focus-visible + .supplier-type-card,
.supplier-type-checkbox:checked + .supplier-type-card,
.budget-card:hover,
.budget-radio:focus-visible + .budget-card,
.budget-radio:checked + .budget-card {
  border-color: var(--vl-teal);
  box-shadow: 0 16px 34px rgba(47, 183, 179, .18);
  transform: translateY(-2px);
}

.supplier-type-card:active,
.budget-card:active {
  box-shadow: 0 9px 18px rgba(47, 183, 179, .13);
  transform: translateY(0) scale(.985);
}

.supplier-type-checkbox:checked + .supplier-type-card,
.budget-radio:checked + .budget-card {
  color: #fff;
  border-color: var(--vl-teal);
  background: var(--vl-ink);
  box-shadow: 0 16px 34px rgba(6, 32, 51, .22);
}

.supplier-type-checkbox:checked + .supplier-type-card .supplier-type-tick {
  border-color: rgba(40, 120, 128, .18);
  background: linear-gradient(145deg, var(--vl-sea), var(--vl-teal));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .35),
    0 10px 24px rgba(47, 183, 179, .34);
  transform: scale(1.08);
  animation: supplierTickPop .28s cubic-bezier(.2, 1.45, .35, 1);
}

.supplier-type-checkbox:checked + .supplier-type-card .supplier-type-tick::before {
  opacity: 1;
  transform: translateY(-.08rem) rotate(42deg) scale(1);
}

.supplier-type-card strong,
.budget-card strong {
  position: relative;
  z-index: 1;
  color: var(--vl-ink);
  line-height: 1.18;
}

.supplier-type-card strong {
  font-size: .95rem;
}

.supplier-type-checkbox:checked + .supplier-type-card strong,
.budget-radio:checked + .budget-card strong {
  color: #fff;
}

.supplier-type-card span {
  display: none;
}

.supplier-type-card .supplier-type-tick {
  display: inline-flex;
}

@keyframes supplierTickPop {
  0% {
    transform: scale(.78);
  }

  58% {
    transform: scale(1.18);
  }

  100% {
    transform: scale(1.08);
  }
}

@media (prefers-reduced-motion: reduce) {
  .supplier-type-card,
  .budget-card,
  .supplier-type-tick,
  .supplier-type-tick::before {
    animation: none;
    transition: none;
  }
}

.budget-scale {
  min-width: 0;
  margin: 0;
  padding: 1rem;
  border: 1px solid var(--vl-border);
  border-radius: var(--vl-radius);
  background: var(--vl-white);
}

.budget-scale .form-label {
  float: none;
  width: auto;
  margin-bottom: .8rem;
  font-size: 1rem;
}

.budget-scale-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .55rem;
}

.budget-radio {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.budget-card {
  display: grid;
  gap: .35rem;
  min-height: 8.4rem;
  padding: .85rem .7rem;
  text-align: center;
}

.budget-symbol {
  position: relative;
  z-index: 1;
  min-height: 1.55rem;
  color: #c79b28;
  font-size: 1.35rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: .04rem;
  white-space: nowrap;
}

.budget-card strong {
  font-size: .92rem;
}

.budget-card span:last-child {
  position: relative;
  z-index: 1;
  color: var(--vl-muted);
  font-size: .78rem;
  line-height: 1.3;
}

.budget-radio:checked + .budget-card .budget-symbol {
  color: #f0c85a;
  text-shadow: 0 1px 10px rgba(240, 200, 90, .25);
  animation: supplierTickPop .28s cubic-bezier(.2, 1.45, .35, 1);
}

.budget-radio:checked + .budget-card span:last-child {
  color: rgba(247, 251, 251, .78);
}

.form-actions {
  display: flex;
  justify-content: flex-end;
  gap: .8rem;
  margin-top: 1.5rem;
}

.form-actions.standalone {
  margin-top: 0;
}

.dashboard-alert {
  border-color: rgba(71, 189, 152, .35);
  color: var(--vl-ink);
  background: rgba(71, 189, 152, .14);
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1.25rem;
}

.metric-card {
  padding: 1.2rem;
}

.metric-card span {
  display: block;
  color: var(--vl-muted);
  font-weight: 750;
}

.metric-card strong {
  display: block;
  margin-top: .35rem;
  color: var(--vl-ink);
  font-size: clamp(1.8rem, 4vw, 2.6rem);
  line-height: 1;
}

.dashboard-panel {
  padding: 1.5rem;
}

.panel-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.empty-state {
  padding: 1.4rem;
  border: 1px dashed var(--vl-border);
  border-radius: var(--vl-radius);
  background: var(--vl-white);
}

.empty-state .btn {
  margin-top: 1rem;
}

.loop-list {
  display: grid;
  gap: .85rem;
}

.loop-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
  border: 1px solid var(--vl-border);
  border-radius: var(--vl-radius);
  background: var(--vl-white);
}

.loop-row h3 {
  margin-top: .45rem;
  font-size: 1.08rem;
}

.loop-row p,
.loop-meta span {
  margin: .25rem 0 0;
  color: var(--vl-muted);
}

.loop-meta {
  min-width: 150px;
  color: var(--vl-ink);
  text-align: right;
}

.loop-meta strong {
  display: block;
  margin-top: .25rem;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  padding: .28rem .52rem;
  color: var(--vl-ink);
  font-size: .78rem;
  font-weight: 820;
  line-height: 1;
  border: 1px solid rgba(47, 183, 179, .34);
  border-radius: 999px;
  background: rgba(47, 183, 179, .12);
}

.admin-queue-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.admin-queue-grid > div {
  padding: 1rem;
  border: 1px solid var(--vl-border);
  border-radius: var(--vl-radius);
  background: var(--vl-white);
}

.admin-nav {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin-top: 1.4rem;
}

.admin-nav a {
  padding: .55rem .85rem;
  color: var(--vl-ink);
  font-weight: 760;
  text-decoration: none;
  border: 1px solid rgba(47, 183, 179, .28);
  border-radius: 999px;
  background: rgba(255, 255, 255, .82);
}

.admin-nav a:hover {
  color: var(--vl-brand);
  background: rgba(47, 183, 179, .1);
}

.admin-stat-card {
  display: grid;
  gap: .2rem;
  min-height: 104px;
  padding: 1rem;
  border: 1px solid rgba(47, 183, 179, .24);
  border-radius: var(--vl-radius);
  background: var(--vl-white);
  box-shadow: var(--vl-shadow-soft);
}

.admin-stat-card span {
  color: var(--vl-muted);
  font-size: .88rem;
  font-weight: 740;
}

.admin-stat-card strong {
  color: var(--vl-ink);
  font-size: 2rem;
  line-height: 1;
}

.admin-discovery-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem;
}

.admin-discovery-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .85rem;
  border: 1px solid var(--vl-border);
  border-radius: var(--vl-radius-sm);
  background: rgba(255, 255, 255, .74);
}

.admin-discovery-card strong,
.admin-discovery-card span {
  display: block;
}

.admin-discovery-card span {
  color: var(--vl-muted);
  font-size: .9rem;
}

.admin-table table {
  min-width: 980px;
}

.admin-table .discovery-evidence-column {
  width: 38%;
  max-width: 34rem;
}

.discovery-evidence-text {
  display: -webkit-box;
  max-width: 34rem;
  margin-bottom: 0;
  overflow: hidden;
  color: var(--vl-ink);
  font-size: .92rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}

.admin-table td strong,
.admin-table td span,
.admin-table td a {
  display: block;
}

.admin-table td span,
.admin-list span {
  color: var(--vl-muted);
  font-size: .92rem;
}

.admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  min-width: 250px;
}

.admin-actions form {
  margin: 0;
}

.admin-stack {
  display: grid;
  gap: 1rem;
}

.admin-edit-panel {
  padding: 1rem;
}

.admin-list {
  display: grid;
  gap: .75rem;
  max-height: 36rem;
  overflow: auto;
}

.admin-list > div {
  padding: .8rem;
  border: 1px solid var(--vl-border);
  border-radius: 8px;
}

.admin-list strong,
.admin-list span {
  display: block;
}

.detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1rem;
}

.detail-grid > div {
  padding: 1rem;
  border: 1px solid var(--vl-border);
  border-radius: var(--vl-radius);
  background: #fff;
}

.detail-grid span {
  display: block;
  color: var(--vl-muted);
  font-weight: 750;
}

.detail-grid strong {
  display: block;
  margin-top: .25rem;
  color: var(--vl-ink);
}

.footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 3rem;
  padding-top: 1.3rem;
  border-top: 1px solid rgba(247, 251, 251, .12);
  color: rgba(247, 251, 251, .6);
  font-size: .92rem;
}

@media (max-width: 1199.98px) {
  .category-grid,
  .steps-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 991.98px) {
  .site-header {
    position: static;
  }

  .min-vh-hero {
    min-height: auto;
  }

  .split-heading,
  .cta-panel,
  .job-card,
  .form-hero-grid,
  .dashboard-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .auth-grid,
  .metric-grid,
  .admin-queue-grid,
  .admin-discovery-grid,
  .detail-grid,
  .budget-scale-grid,
  .supplier-type-grid,
  .supplier-profile-layout {
    grid-template-columns: 1fr;
  }

  .supplier-profile-aside {
    position: static;
  }

  .auth-grid {
    gap: 2rem;
  }
}

@media (max-width: 575.98px) {
  .brand-lockup img {
    width: 156px;
  }

  .hero-section h1 {
    font-size: 2.55rem;
  }

  .section-band,
  .content-section,
  .quote-section,
  .cta-section,
  .page-hero {
    padding: 4rem 0;
  }

  .category-grid,
  .steps-grid {
    grid-template-columns: 1fr;
  }

  .hero-actions,
  .cta-actions,
  .form-actions {
    display: grid;
  }

  .auth-section,
  .form-hero,
  .dashboard-hero {
    padding: 4rem 0 3rem;
  }

  .auth-card,
  .form-card,
  .dashboard-panel,
  .budget-scale,
  .supplier-type-picker {
    padding: 1.15rem;
  }

  .budget-card,
  .supplier-type-card {
    min-height: auto;
    text-align: left;
  }

  .loop-row,
  .panel-title-row {
    align-items: flex-start;
    flex-direction: column;
  }

  .loop-meta {
    min-width: 0;
    text-align: left;
  }

  .footer-bottom {
    flex-direction: column;
  }
}