/* Hallmark · pre-emit critique: P5 H5 E5 S5 R5 V5 · genre: editorial · macrostructure: Long Document · theme: Newsprint adapted to SolveNook · tone: friendly, practical, trustworthy · anchor hue: warm ochre with restrained teal · audience: first-time Fiverr buyers and small-business owners · use: move from project brief to a controlled Fiverr order · enrichment: privacy-enhanced video lesson and original SolveNook mascot · nav: N1b preserved · footer: Ft1 preserved · contrast: pass (40–41) · slop: pass (42–45) · honest: pass (46) · chrome: pass (47) · tokens: pass (48) · responsive: pass (49) · icons: pass (30) · mobile: pass (34, 49–57) */

html,
body {
  overflow-x: clip;
}

.hiring-tutorial {
  color: var(--hire-ink);
  background: var(--hire-paper);
  font-family: var(--hire-font-editorial);
  font-size: var(--hire-text-base);
  line-height: 1.7;
}

.hiring-tutorial h1,
.hiring-tutorial h2,
.hiring-tutorial h3 {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
  color: inherit;
  font-family: var(--hire-font-editorial);
  font-style: normal;
  line-height: 1.06;
}

.hiring-tutorial p {
  max-width: 65ch;
}

.hiring-tutorial a,
.hiring-tutorial button,
.hiring-tutorial input {
  font-family: var(--hire-font-ui);
}

.hiring-tutorial a:focus-visible,
.hiring-tutorial button:focus-visible,
.hiring-tutorial input:focus-visible {
  outline: 3px solid var(--hire-focus);
  outline-offset: 3px;
}

.hire-hero {
  color: var(--hire-ink);
  background: var(--hire-paper-warm);
  border-bottom: var(--hire-rule-width) solid var(--hire-rule);
}

.hire-hero__inner {
  padding-block: var(--hire-space-2xl) var(--hire-space-3xl);
}

.hire-breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--hire-space-2xs);
  color: var(--hire-muted);
  font-family: var(--hire-font-ui);
  font-size: var(--hire-text-small);
  font-weight: 700;
}

.hire-breadcrumbs a {
  display: inline-flex;
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  color: var(--hire-ink-soft);
  text-decoration-color: var(--hire-rule-strong);
  text-underline-offset: var(--hire-space-3xs);
  white-space: nowrap;
}

.hire-hero__mast {
  display: grid;
  min-width: 0;
  gap: var(--hire-space-3xl);
  margin-top: var(--hire-space-xl);
  align-items: end;
}

.hire-hero__copy {
  min-width: 0;
}

.hire-dateline {
  margin: 0 0 var(--hire-space-sm);
  color: var(--hire-ochre);
  font-family: var(--hire-font-ui);
  font-size: var(--hire-text-small);
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.hire-hero h1 {
  max-width: 12ch;
  font-size: var(--hire-text-display);
  font-weight: 800;
  letter-spacing: -0.045em;
}

.hire-hero__lede {
  margin: var(--hire-space-lg) 0 0;
  color: var(--hire-ink-soft);
  font-size: clamp(var(--hire-text-md), 2vw, var(--hire-text-lg));
  line-height: 1.55;
}

.hire-hero__links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--hire-space-xs);
  margin: var(--hire-space-xl) 0 0;
  font-family: var(--hire-font-ui);
  font-size: var(--hire-text-small);
  font-weight: 800;
}

.hire-hero__links a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  color: var(--hire-accent-hover);
  text-underline-offset: var(--hire-space-3xs);
  white-space: nowrap;
}

.hire-hero__note {
  display: grid;
  min-width: 0;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--hire-space-sm) var(--hire-space-lg);
  align-items: end;
  padding-block: var(--hire-space-lg);
  border-block: var(--hire-rule-width) solid var(--hire-rule-strong);
}

.hire-hero__note img {
  width: clamp(5.5rem, 18vw, 8rem);
  height: auto;
  grid-row: 1 / span 2;
}

.hire-hero__note h2 {
  font-size: var(--hire-text-lg);
}

.hire-hero__note p {
  margin: 0;
  color: var(--hire-ink-soft);
  font-size: var(--hire-text-base);
}

.hire-orientation {
  display: grid;
  min-width: 0;
  gap: 0;
  margin: var(--hire-space-3xl) 0 0;
  border-block: var(--hire-rule-width) solid var(--hire-rule-strong);
}

.hire-orientation > div {
  padding-block: var(--hire-space-lg);
  border-bottom: var(--hire-rule-width) solid var(--hire-rule);
}

.hire-orientation > div:last-child {
  border-bottom: 0;
}

.hire-orientation dt {
  color: var(--hire-ochre);
  font-family: var(--hire-font-ui);
  font-size: var(--hire-text-small);
  font-weight: 800;
}

.hire-orientation dd {
  margin: var(--hire-space-2xs) 0 0;
  color: var(--hire-ink-soft);
  font-weight: 600;
}

.hire-ad-space {
  padding-block: var(--hire-space-lg);
}

.hire-ad-space:has(.ad-slot[hidden]) {
  display: none;
}

.hire-video {
  color: var(--hire-ink);
  background: var(--hire-paper-teal);
}

.hire-video__inner {
  display: grid;
  min-width: 0;
  gap: var(--hire-space-3xl);
  padding-block: var(--hire-space-4xl) var(--hire-space-5xl);
}

.hire-video__copy h2,
.hire-preparation h2,
.hire-index h2,
.hire-comparison h2,
.hire-message h2,
.hire-next h2,
.hire-partner h2,
.hire-sources h2 {
  font-size: clamp(var(--hire-text-xl), 4vw, var(--hire-text-2xl));
  letter-spacing: -0.035em;
}

.hire-video__copy > p,
.hire-preparation .hire-prose > p,
.hire-comparison .hire-prose > p,
.hire-message__inner > div > p,
.hire-next__inner > div > p,
.hire-partner__inner > div > p,
.hire-sources__inner > div > p {
  margin: var(--hire-space-md) 0 0;
  color: var(--hire-ink-soft);
}

.hire-video__chapters {
  display: grid;
  gap: 0;
  margin: var(--hire-space-xl) 0 0;
  padding: 0;
  list-style: none;
  border-top: var(--hire-rule-width) solid var(--hire-rule-strong);
}

.hire-video__chapters li {
  display: grid;
  min-width: 0;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--hire-space-sm);
  padding-block: var(--hire-space-xs);
  border-bottom: var(--hire-rule-width) solid var(--hire-rule);
  color: var(--hire-ink-soft);
}

.hire-video__chapters time {
  color: var(--hire-accent-hover);
  font-family: var(--hire-font-ui);
  font-size: var(--hire-text-small);
  font-variant-numeric: tabular-nums;
  font-weight: 800;
}

.hire-video__stage {
  min-width: 0;
  align-self: center;
}

.hire-video__embed {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  border: var(--hire-rule-width) solid var(--hire-rule-strong);
  background: var(--hire-dark);
}

.hire-video__embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.hire-video__placeholder {
  display: grid;
  min-height: clamp(18rem, 52vw, 30rem);
  align-content: end;
  gap: var(--hire-space-sm);
  padding: clamp(var(--hire-space-lg), 5vw, var(--hire-space-3xl));
  color: var(--hire-dark-text);
  background: var(--hire-dark);
  border: var(--hire-rule-width) solid var(--hire-dark-raised);
}

.hire-video__placeholder > span {
  display: grid;
  width: 3rem;
  height: 3rem;
  place-items: center;
  border: var(--hire-rule-width) solid var(--hire-dark-muted);
  border-radius: 50%;
  color: var(--hire-dark-text);
}

.hire-video__placeholder strong {
  color: var(--hire-dark-text);
  font-size: var(--hire-text-xl);
}

.hire-video__placeholder p {
  margin: 0;
  color: var(--hire-dark-muted);
}

.hire-preparation,
.hire-comparison,
.hire-next,
.hire-sources,
.hire-editor-notes {
  color: var(--hire-ink);
  background: var(--hire-paper);
}

.hire-prose {
  max-width: 65ch;
  padding-block: var(--hire-space-4xl) var(--hire-space-5xl);
}

.hire-preparation__list {
  display: grid;
  gap: 0;
  margin: var(--hire-space-2xl) 0 0;
  padding: 0;
  list-style: none;
  counter-reset: preparation;
  border-top: var(--hire-rule-width) solid var(--hire-rule-strong);
}

.hire-preparation__list li {
  position: relative;
  padding: var(--hire-space-lg) 0 var(--hire-space-lg) var(--hire-space-3xl);
  border-bottom: var(--hire-rule-width) solid var(--hire-rule);
  counter-increment: preparation;
}

.hire-preparation__list li::before {
  position: absolute;
  inset: var(--hire-space-lg) auto auto 0;
  color: var(--hire-ochre);
  content: counter(preparation, decimal-leading-zero);
  font-family: var(--hire-font-ui);
  font-size: var(--hire-text-small);
  font-variant-numeric: tabular-nums;
  font-weight: 800;
}

.hire-preparation__list h3 {
  font-size: var(--hire-text-lg);
}

.hire-preparation__list p {
  margin: var(--hire-space-xs) 0 0;
  color: var(--hire-ink-soft);
}

.hire-walkthrough {
  color: var(--hire-ink);
  background: var(--hire-paper-raised);
  border-block: var(--hire-rule-width) solid var(--hire-rule);
}

.hire-document {
  display: grid;
  min-width: 0;
  gap: var(--hire-space-4xl);
  padding-block: var(--hire-space-4xl) var(--hire-space-5xl);
}

.hire-index {
  min-width: 0;
}

.hire-index > div {
  min-width: 0;
}

.hire-index h2 {
  max-width: 14ch;
}

.hire-index nav {
  display: grid;
  gap: 0;
  margin-top: var(--hire-space-xl);
  border-top: var(--hire-rule-width) solid var(--hire-rule-strong);
}

.hire-index nav a {
  display: grid;
  min-width: 0;
  min-height: 48px;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: var(--hire-space-sm);
  padding-block: var(--hire-space-xs);
  border-bottom: var(--hire-rule-width) solid var(--hire-rule);
  color: var(--hire-ink-soft);
  font-size: var(--hire-text-small);
  font-weight: 700;
  line-height: 1.35;
  text-decoration: none;
}

.hire-index nav a span {
  color: var(--hire-ochre);
  font-variant-numeric: tabular-nums;
}

.hire-chapters {
  display: grid;
  min-width: 0;
  gap: var(--hire-space-5xl);
}

.hire-chapter {
  min-width: 0;
  max-width: 65ch;
  scroll-margin-top: 7rem;
}

.hire-chapter h2 {
  font-size: clamp(var(--hire-text-xl), 4vw, var(--hire-text-2xl));
  letter-spacing: -0.035em;
}

.hire-chapter > p:not(.hire-chapter__source) {
  margin: var(--hire-space-lg) 0 0;
  color: var(--hire-ink-soft);
  font-size: var(--hire-text-md);
}

.hire-chapter blockquote {
  margin: var(--hire-space-2xl) 0;
  padding-block: var(--hire-space-lg);
  border-block: var(--hire-rule-width) solid var(--hire-rule-strong);
  color: var(--hire-ink);
}

.hire-chapter blockquote p {
  margin: 0;
  font-size: var(--hire-text-lg);
  line-height: 1.45;
}

.hire-chapter ul {
  display: grid;
  gap: var(--hire-space-sm);
  margin: 0;
  padding: 0;
  list-style: none;
}

.hire-chapter li {
  position: relative;
  padding-inline-start: var(--hire-space-xl);
  color: var(--hire-ink-soft);
}

.hire-chapter li::before {
  position: absolute;
  inset: 0 auto auto 0;
  color: var(--hire-accent-hover);
	content: "-";
  font-weight: 800;
}

.hire-chapter__source {
  margin: var(--hire-space-lg) 0 0;
  font-size: var(--hire-text-small);
}

.hire-chapter__source a,
.hire-sources a {
  color: var(--hire-accent-hover);
  font-weight: 800;
  text-underline-offset: var(--hire-space-3xs);
}

.hire-comparison {
  color: var(--hire-ink);
  background: var(--hire-paper-teal);
}

.hire-comparison fieldset {
  display: grid;
  gap: 0;
  margin: var(--hire-space-2xl) 0 0;
  padding: 0;
  border: 0;
  border-top: var(--hire-rule-width) solid var(--hire-rule-strong);
}

.hire-comparison label {
  display: grid;
  min-width: 0;
  min-height: 56px;
  grid-template-columns: auto auto minmax(0, 1fr);
  align-items: center;
  gap: var(--hire-space-sm);
  padding-block: var(--hire-space-sm);
  border-bottom: var(--hire-rule-width) solid var(--hire-rule);
  color: var(--hire-ink-soft);
  cursor: pointer;
}

.hire-comparison input {
  width: 1.25rem;
  height: 1.25rem;
  margin: 0;
  accent-color: var(--hire-accent);
}

.hire-comparison input:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.hire-comparison label:has(input:disabled) {
  color: var(--hire-muted);
  cursor: not-allowed;
  opacity: 0.55;
}

.hire-comparison label > span {
  color: var(--hire-ochre);
  font-size: var(--hire-text-small);
  font-variant-numeric: tabular-nums;
  font-weight: 800;
}

.hire-comparison label > strong {
  font-weight: 600;
}

.hire-comparison__progress {
  display: block;
  min-height: 1lh;
  margin-top: var(--hire-space-lg);
  color: var(--hire-accent-hover);
  font-family: var(--hire-font-ui);
  font-weight: 800;
}

.hiring-tutorial[data-comparison-state="complete"] .hire-comparison__progress {
  color: var(--hire-success);
}

.hire-comparison__privacy {
  margin: var(--hire-space-xs) 0 0;
  color: var(--hire-muted);
  font-family: var(--hire-font-ui);
  font-size: var(--hire-text-small);
}

.hire-message {
  color: var(--hire-ink);
  background: var(--hire-paper-warm);
}

.hire-message__inner {
  display: grid;
  min-width: 0;
  gap: var(--hire-space-3xl);
  padding-block: var(--hire-space-4xl) var(--hire-space-5xl);
}

.hire-message pre {
  min-width: 0;
  margin: 0;
  padding: var(--hire-space-xl);
  border-block: var(--hire-rule-width) solid var(--hire-rule-strong);
  color: var(--hire-ink-soft);
  background: var(--hire-paper);
  font-family: var(--hire-font-ui);
  font-size: var(--hire-text-small);
  line-height: 1.65;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.hire-action {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: var(--hire-space-2xs);
  margin-top: var(--hire-space-lg);
  padding: var(--hire-space-xs) var(--hire-space-md);
  border: var(--hire-rule-width) solid var(--hire-ink);
  border-radius: var(--hire-radius-control);
  color: var(--hire-ink);
  background: var(--hire-transparent);
  font-size: var(--hire-text-small);
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.hire-action:active {
  color: var(--hire-accent-ink);
  background: var(--hire-accent-hover);
}

.hire-action:disabled,
.hire-action[aria-disabled="true"] {
  color: var(--hire-muted);
  background: var(--hire-disabled);
  border-color: var(--hire-rule-strong);
  cursor: not-allowed;
  opacity: 0.55;
}

.hire-action[data-state="loading"] {
  color: var(--hire-ink-soft);
  background: var(--hire-paper-raised);
  cursor: progress;
}

.hire-action[data-state="success"] {
  color: var(--hire-accent-ink);
  background: var(--hire-success);
  border-color: var(--hire-success);
}

.hire-action[data-state="error"] {
  color: var(--hire-accent-ink);
  background: var(--hire-warning);
  border-color: var(--hire-warning);
}

.hire-copy-live {
  min-height: 1lh;
  margin: var(--hire-space-xs) 0 0;
  color: var(--hire-muted);
  font-family: var(--hire-font-ui);
  font-size: var(--hire-text-small);
}

.hire-next {
  border-bottom: var(--hire-rule-width) solid var(--hire-rule);
}

.hire-next__inner,
.hire-partner__inner,
.hire-sources__inner {
  display: grid;
  min-width: 0;
  gap: var(--hire-space-3xl);
  padding-block: var(--hire-space-4xl) var(--hire-space-5xl);
}

.hire-next__links {
  display: grid;
  gap: 0;
  border-top: var(--hire-rule-width) solid var(--hire-rule-strong);
}

.hire-next__links a {
  display: grid;
  min-height: 72px;
  gap: var(--hire-space-2xs);
  align-content: center;
  padding-block: var(--hire-space-sm);
  border-bottom: var(--hire-rule-width) solid var(--hire-rule);
  color: var(--hire-ink-soft);
  text-decoration: none;
}

.hire-next__links a > span {
  font-family: var(--hire-font-editorial);
  font-size: var(--hire-text-lg);
  font-weight: 700;
}

.hire-next__links a > strong {
  color: var(--hire-accent-hover);
  font-size: var(--hire-text-small);
  white-space: nowrap;
}

.hire-partner {
  color: var(--hire-dark-text);
  background: var(--hire-dark);
}

.hire-partner h2,
.hire-partner__inner > div > p {
  color: var(--hire-dark-text);
}

.hire-partner__action {
  align-self: end;
}

.hire-action--light {
  color: var(--hire-dark-text);
  border-color: var(--hire-dark-muted);
}

.hire-action--light:focus-visible {
  outline-color: var(--hire-focus-dark);
}

.hire-action--light:active {
  color: var(--hire-dark);
  background: var(--hire-dark-text);
}

.hire-partner__action p {
  margin: var(--hire-space-sm) 0 0;
  color: var(--hire-dark-muted);
  font-family: var(--hire-font-ui);
  font-size: var(--hire-text-small);
}

.hire-sources {
  border-bottom: var(--hire-rule-width) solid var(--hire-rule);
}

.hire-sources ol {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: sources;
  border-top: var(--hire-rule-width) solid var(--hire-rule-strong);
}

.hire-sources li {
  position: relative;
  min-width: 0;
  padding: var(--hire-space-sm) 0 var(--hire-space-sm) var(--hire-space-3xl);
  border-bottom: var(--hire-rule-width) solid var(--hire-rule);
  counter-increment: sources;
}

.hire-sources li::before {
  position: absolute;
  inset: var(--hire-space-sm) auto auto 0;
  color: var(--hire-muted);
  content: counter(sources, decimal-leading-zero);
  font-family: var(--hire-font-ui);
  font-size: var(--hire-text-small);
  font-variant-numeric: tabular-nums;
  font-weight: 800;
}

.hire-sources a {
  display: inline;
  line-height: 1.5;
}

.hire-breadcrumbs a:active,
.hire-hero__links a:active,
.hire-index nav a:active,
.hire-chapter__source a:active,
.hire-sources a:active {
  color: var(--hire-ochre);
}

.hire-next__links a:active > strong {
  color: var(--hire-ochre);
}

@media (hover: hover) and (pointer: fine) {
  .hire-breadcrumbs a:hover,
  .hire-hero__links a:hover,
  .hire-index nav a:hover,
  .hire-chapter__source a:hover,
  .hire-sources a:hover {
    color: var(--hire-accent-hover);
    text-decoration-color: currentColor;
  }

  .hire-action:hover {
    color: var(--hire-accent-ink);
    background: var(--hire-accent-hover);
  }

  .hire-action--light:hover {
    color: var(--hire-dark);
    background: var(--hire-dark-text);
  }

  .hire-comparison label:hover {
    color: var(--hire-ink);
    background: var(--hire-paper);
  }

  .hire-next__links a:hover > strong {
    color: var(--hire-ochre);
  }
}

@media (min-width: 40rem) {
  .hire-orientation {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .hire-orientation > div {
    padding-inline: var(--hire-space-lg);
    border-inline-end: var(--hire-rule-width) solid var(--hire-rule);
    border-bottom: 0;
  }

  .hire-orientation > div:first-child {
    padding-inline-start: 0;
  }

  .hire-orientation > div:last-child {
    padding-inline-end: 0;
    border-inline-end: 0;
  }
}

@media (min-width: 60rem) {
  .hire-hero__mast {
    grid-template-columns: minmax(0, 8fr) minmax(18rem, 4fr);
  }

  .hire-video__inner {
    grid-template-columns: minmax(18rem, 5fr) minmax(0, 7fr);
    align-items: center;
  }

  .hire-document {
    grid-template-columns: minmax(15rem, 4fr) minmax(0, 8fr);
  }

  .hire-index > div {
    position: sticky;
    top: 7rem;
  }

  .hire-message__inner,
  .hire-next__inner,
  .hire-partner__inner,
  .hire-sources__inner {
    grid-template-columns: minmax(0, 7fr) minmax(18rem, 5fr);
  }
}

@media (pointer: coarse) {
  .hire-action,
  .hire-breadcrumbs a,
  .hire-hero__links a,
  .hire-index nav a,
  .hire-next__links a {
    min-height: 48px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hiring-tutorial *,
  .hiring-tutorial *::before,
  .hiring-tutorial *::after {
    animation-duration: var(--hire-dur-instant) !important;
    transition-duration: var(--hire-dur-instant) !important;
  }
}

@media print {
  .hire-video,
  .hire-ad-space,
  .hire-index,
  .hire-comparison,
  .hire-message button,
  .hire-copy-live,
  .hire-next,
  .hire-partner,
  .site-header,
  .site-footer,
  .scroll-top {
    display: none !important;
  }

  .hire-document {
    display: block;
    padding: 0;
  }

  .hire-chapter {
    break-inside: avoid;
    margin-bottom: var(--hire-space-3xl);
  }
}