.quote-about-hero {
  background:
    radial-gradient(circle at 82% 22%, rgba(31, 167, 160, .24), transparent 26rem),
    linear-gradient(125deg, #0c2133 0%, var(--jdc-navy-deep) 54%, #173f54 100%);
  color: #fff;
  overflow: hidden;
  padding: clamp(5rem, 9vw, 8rem) 0;
}

.quote-about-display {
  font-size: clamp(3rem, 5.7vw, 5.25rem);
  font-weight: 800;
  letter-spacing: -.06em;
  line-height: .98;
  max-width: 13ch;
}

.quote-about-display span { display: block; }

.quote-about-hero__lead {
  color: rgba(255, 255, 255, .82);
  font-size: clamp(1.1rem, 2vw, 1.28rem);
  line-height: 1.65;
  max-width: 48rem;
}

.quote-about-micro {
  color: rgba(255, 255, 255, .62);
  font-size: .9rem;
}

.job-visual {
  margin: 2rem auto;
  max-width: 34rem;
  padding: 0 0 3rem 1rem;
  position: relative;
}

.job-visual__window {
  background: #fff;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 1rem;
  box-shadow: 0 32px 80px rgba(2, 14, 24, .38);
  color: var(--jdc-ink);
  overflow: hidden;
  transform: rotate(1.5deg);
}

.job-visual__bar {
  align-items: center;
  background: #f4f7fa;
  border-bottom: 1px solid var(--jdc-border);
  display: flex;
  gap: .35rem;
  padding: .75rem 1rem;
}

.job-visual__bar span {
  background: #c8d2da;
  border-radius: 50%;
  height: .52rem;
  width: .52rem;
}

.job-visual__bar strong {
  color: var(--jdc-slate);
  font-size: .67rem;
  letter-spacing: .03em;
  margin-left: auto;
}

.job-visual__body { padding: 1.35rem; }
.job-visual__label {
  color: var(--jdc-navy-deep);
  font-size: .72rem;
  font-weight: 800;
  margin: 0 0 .55rem;
}

.job-visual__field,
.job-visual__apparel {
  background: #f7f9fb;
  border: 1px solid var(--jdc-border);
  border-radius: .45rem;
}

.job-visual__field { height: 2rem; }
.job-visual__field-row {
  display: grid;
  gap: .6rem;
  grid-template-columns: 1fr 1fr;
  margin-top: .6rem;
}

.job-visual__apparel {
  align-items: center;
  display: grid;
  font-size: .58rem;
  gap: .3rem;
  grid-template-columns: 1.1fr 1fr 1fr auto;
  padding: .75rem;
}

.job-visual__apparel span { color: var(--jdc-slate); }
.job-visual__apparel strong { color: var(--jdc-navy); }

.job-visual__methods {
  align-items: center;
  display: grid;
  gap: .5rem;
  grid-template-columns: 1fr auto 1fr;
  margin-top: 1rem;
}

.job-visual__methods > div {
  border: 1px solid var(--jdc-border);
  border-radius: .55rem;
  padding: .65rem;
}

.job-visual__methods > div.is-selected {
  background: #edf9f8;
  border-color: rgba(31, 167, 160, .45);
}

.job-visual__methods small,
.job-visual__methods strong { display: block; }
.job-visual__methods small { color: var(--jdc-slate); font-size: .55rem; }
.job-visual__methods strong { color: var(--jdc-navy-deep); font-size: .84rem; }
.job-visual__methods > span { color: var(--jdc-slate); font-size: .5rem; text-transform: uppercase; }

.job-visual__documents {
  bottom: 0;
  display: flex;
  gap: .65rem;
  position: absolute;
  right: -1rem;
  transform: rotate(-3deg);
}

.document-card {
  background: #fff;
  border-radius: .55rem;
  box-shadow: 0 16px 35px rgba(2, 14, 24, .3);
  min-width: 7rem;
  padding: .9rem;
}

.document-card span,
.document-card strong { display: block; }
.document-card span { color: var(--jdc-slate); font-size: .55rem; }
.document-card strong { color: var(--jdc-navy-deep); font-size: .9rem; margin-top: .15rem; }
.document-card--quote { border-top: 3px solid var(--jdc-teal); }
.document-card--po { border-top: 3px solid var(--jdc-red); }

.quote-proof-strip {
  background: var(--jdc-navy);
  color: #fff;
}

.quote-proof-strip span {
  display: block;
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .08em;
  padding: 1.15rem .6rem;
  text-transform: uppercase;
}

.quote-proof-strip [class*="col-"]:not(:last-child) {
  border-right: 1px solid rgba(255, 255, 255, .13);
}

.double-quote-visual {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr 1fr;
  padding: 1rem;
  position: relative;
}

.estimate-card {
  background: #fff;
  border: 1px solid var(--jdc-border);
  border-radius: 1rem;
  box-shadow: 0 14px 36px rgba(23, 50, 77, .09);
  min-height: 12rem;
  padding: 1.4rem;
  position: relative;
}

.estimate-card small,
.estimate-card strong { display: block; }
.estimate-card small { color: var(--jdc-slate); font-size: .72rem; margin-top: 1.8rem; }
.estimate-card strong { color: var(--jdc-navy-deep); margin-top: .25rem; }
.estimate-card__number { color: var(--jdc-teal); font-size: .7rem; font-weight: 800; }
.estimate-card--muted { opacity: .58; }

.estimate-card--answer {
  background: var(--jdc-navy-deep);
  border: 0;
  bottom: 0;
  color: #fff;
  grid-column: 1 / -1;
  margin: -2.5rem auto 0;
  min-height: 9.5rem;
  width: 58%;
}

.estimate-card--answer small { color: rgba(255,255,255,.6); }
.estimate-card--answer strong { color: #fff; }
.estimate-check {
  align-items: center;
  background: var(--jdc-teal);
  border-radius: 50%;
  display: flex;
  font-weight: 900;
  height: 2rem;
  justify-content: center;
  position: absolute;
  right: 1rem;
  top: 1rem;
  width: 2rem;
}

.estimate-lines { margin-top: 1.25rem; }
.estimate-lines i {
  background: #e7edf1;
  border-radius: 1rem;
  display: block;
  height: .35rem;
  margin-top: .45rem;
}
.estimate-lines i:nth-child(2) { width: 74%; }
.estimate-lines i:nth-child(3) { width: 87%; }

.quote-workflow {
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(5, 1fr);
  overflow: hidden;
}

.quote-workflow article {
  background: #fff;
  border-top: 3px solid var(--jdc-teal);
  min-height: 17rem;
  padding: 1.6rem 1.25rem;
}

.quote-workflow article > span {
  color: var(--jdc-teal);
  display: block;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .1em;
  margin-bottom: 3.25rem;
}

.quote-workflow h3 {
  color: var(--jdc-navy-deep);
  font-size: 1.05rem;
  font-weight: 800;
}

.quote-workflow p {
  color: var(--jdc-slate);
  font-size: .88rem;
  line-height: 1.55;
  margin: 0;
}

.quote-check-list {
  list-style: none;
  padding: 0;
}

.quote-check-list li {
  border-bottom: 1px solid var(--jdc-border);
  color: var(--jdc-navy-deep);
  font-weight: 700;
  padding: .9rem 0 .9rem 2rem;
  position: relative;
}

.quote-check-list li::before {
  color: var(--jdc-teal);
  content: "✓";
  font-weight: 900;
  left: 0;
  position: absolute;
}

.settings-visual {
  background: #fff;
  border: 1px solid var(--jdc-border);
  border-radius: 1.2rem;
  box-shadow: 0 24px 60px rgba(23, 50, 77, .12);
  overflow: hidden;
}

.settings-visual__header {
  background:
    radial-gradient(circle at 90% 0, rgba(31,167,160,.25), transparent 13rem),
    var(--jdc-navy-deep);
  color: #fff;
  padding: 2rem;
}

.settings-visual__header span,
.settings-visual__header strong { display: block; }
.settings-visual__header span { color: #54d8cf; font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.settings-visual__header strong { font-size: 1.5rem; margin-top: .5rem; }

.settings-visual__row,
.settings-visual__footer {
  align-items: center;
  border-bottom: 1px solid var(--jdc-border);
  display: flex;
  justify-content: space-between;
  padding: 1rem 1.35rem;
}

.settings-visual__row span { color: var(--jdc-slate); }
.settings-visual__row strong { color: var(--jdc-navy-deep); font-size: .88rem; }
.settings-visual__footer { background: #f7f9fb; border-bottom: 0; font-size: .78rem; }
.settings-status { color: #12675f; font-weight: 800; }

.quote-documents-section {
  background:
    radial-gradient(circle at 12% 20%, rgba(31, 167, 160, .2), transparent 27rem),
    var(--jdc-navy-deep);
  color: #fff;
}

.quote-documents-title {
  font-size: clamp(2.25rem, 5vw, 4.3rem);
  font-weight: 800;
  letter-spacing: -.05em;
  line-height: 1;
}

.document-pair {
  align-items: center;
  display: grid;
  gap: .8rem;
  grid-template-columns: 1fr auto 1fr;
}

.paper-document {
  background: #fff;
  border-radius: .7rem;
  box-shadow: 0 24px 45px rgba(0,0,0,.25);
  color: var(--jdc-ink);
  min-height: 18rem;
  padding: 1.5rem;
}

.paper-document:first-child { transform: rotate(-2deg); }
.paper-document:last-child { transform: rotate(2deg); }
.paper-document__top { align-items: start; display: flex; justify-content: space-between; }
.paper-document__top span { color: var(--jdc-slate); font-size: .65rem; }
.paper-document__top strong { color: var(--jdc-navy-deep); font-size: 1.15rem; }
.paper-document__line { background: #e6ecf0; height: .38rem; margin-top: .85rem; width: 72%; }
.paper-document__line.is-wide { margin-top: 3rem; width: 100%; }
.paper-document__total { align-items: center; border-top: 1px solid var(--jdc-border); display: flex; justify-content: space-between; margin-top: 2.6rem; padding-top: 1rem; }
.paper-document__total span { color: var(--jdc-slate); font-size: .67rem; }
.paper-document__total strong { color: var(--jdc-navy-deep); }
.document-arrow { color: #54d8cf; font-size: 2rem; font-weight: 900; }

.saved-jobs-visual {
  background: #fff;
  border: 1px solid var(--jdc-border);
  border-radius: 1rem;
  box-shadow: 0 20px 50px rgba(23, 50, 77, .1);
  overflow: hidden;
}

.saved-jobs-visual article {
  align-items: center;
  border-bottom: 1px solid var(--jdc-border);
  display: grid;
  gap: 1rem;
  grid-template-columns: auto 1fr auto;
  padding: 1.1rem 1.25rem;
}

.saved-jobs-visual article:last-child { border-bottom: 0; }
.saved-jobs-visual strong,
.saved-jobs-visual small { display: block; }
.saved-jobs-visual strong { color: var(--jdc-navy-deep); }
.saved-jobs-visual small,
.saved-jobs-visual time { color: var(--jdc-slate); font-size: .72rem; }
.saved-job-icon {
  align-items: center;
  background: var(--jdc-navy);
  border-radius: .45rem;
  color: #fff;
  display: flex;
  font-size: .54rem;
  font-weight: 900;
  height: 2.5rem;
  justify-content: center;
  letter-spacing: .05em;
  width: 2.5rem;
}

.privacy-section {
  background:
    radial-gradient(circle at 80% 40%, rgba(31, 167, 160, .11), transparent 26rem),
    #edf6f6;
}

.privacy-points {
  background: #fff;
  border: 1px solid rgba(31, 167, 160, .25);
  border-radius: 1rem;
  padding: .7rem 1.5rem;
}

.privacy-points span {
  border-bottom: 1px solid var(--jdc-border);
  color: var(--jdc-slate);
  display: block;
  padding: 1rem 0;
}

.privacy-points span:last-child { border-bottom: 0; }
.privacy-points strong { color: var(--jdc-navy-deep); display: inline-block; min-width: 6rem; }

.quote-video {
  border-radius: 1rem;
  box-shadow: 0 24px 55px rgba(23, 50, 77, .16);
  overflow: hidden;
}

.quote-final-cta {
  background:
    radial-gradient(circle at 50% 0, rgba(31, 167, 160, .22), transparent 28rem),
    var(--jdc-navy-deep);
  color: #fff;
}

.quote-final-cta__title {
  font-size: clamp(2.4rem, 5vw, 4.7rem);
  font-weight: 800;
  letter-spacing: -.05em;
  line-height: 1;
  max-width: 15ch;
}

.quote-final-cta p { max-width: 42rem; }

@media (max-width: 991.98px) {
  .quote-workflow { grid-template-columns: repeat(2, 1fr); }
  .quote-workflow article:last-child { grid-column: 1 / -1; min-height: auto; }
  .quote-workflow article > span { margin-bottom: 2rem; }
}

@media (max-width: 575.98px) {
  .quote-about-display { font-size: clamp(2.65rem, 12vw, 4rem); }
  .quote-proof-strip [class*="col-"]:nth-child(2) { border-right: 0; }
  .quote-proof-strip [class*="col-"]:nth-child(-n+2) { border-bottom: 1px solid rgba(255, 255, 255, .13); }
  .job-visual { padding-left: 0; }
  .job-visual__documents { right: 0; }
  .double-quote-visual { padding: 0; }
  .estimate-card { padding: 1rem; }
  .estimate-card--answer { width: 78%; }
  .quote-workflow { grid-template-columns: 1fr; }
  .quote-workflow article,
  .quote-workflow article:last-child { grid-column: auto; min-height: auto; }
  .document-pair { grid-template-columns: 1fr; }
  .document-arrow { text-align: center; transform: rotate(90deg); }
  .paper-document { min-height: 15rem; }
}

@media (prefers-reduced-motion: reduce) {
  .job-visual__window,
  .job-visual__documents,
  .paper-document:first-child,
  .paper-document:last-child { transform: none; }
}