.match-hero {
  overflow: hidden;
  padding: 32px 0 0;
  background:
    radial-gradient(circle at 82% 17%, rgba(127, 146, 127, .24), transparent 28%),
    radial-gradient(circle at 15% 85%, rgba(223, 173, 69, .14), transparent 30%),
    linear-gradient(142deg, #fffdf8, #f0ede4);
}

.match-hero__breadcrumbs { margin-bottom: 46px; }

.match-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .72fr);
  align-items: center;
  gap: 72px;
  padding-bottom: 64px;
}

.match-hero h1,
.match-heading h2,
.match-prepare h2,
.match-precision h2,
.match-checklist h2,
.match-request h2 {
  font-weight: 650;
  letter-spacing: -.045em;
}

.match-hero h1 { max-width: 780px; }

.match-hero__lead {
  max-width: 740px;
  margin-bottom: 30px;
  color: #4d5868;
  font-size: clamp(1.1rem, 1.8vw, 1.32rem);
}

.match-hero__note {
  max-width: 680px;
  margin: 22px 0 0;
  color: var(--muted);
  font-size: .88rem;
}

.match-max-cta { gap: 8px; }
.match-max-cta .max-icon { flex: 0 0 auto; }

.match-brief {
  position: relative;
  padding: 32px;
  overflow: hidden;
  border-radius: 30px;
  color: white;
  background: #1d2b2a;
  box-shadow: 0 28px 70px rgba(20, 28, 40, .18);
}

.match-brief::before {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,.05), transparent 45%);
  content: "";
  pointer-events: none;
}

.match-brief__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 22px;
  color: var(--gold-light);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.match-brief__top p { margin: 0; color: inherit; }

.match-brief__samples {
  display: flex;
  height: 105px;
  align-items: flex-end;
  margin-bottom: 12px;
}

.match-swatch {
  display: block;
  width: 112px;
  height: 82px;
  border: 5px solid rgba(255,255,255,.82);
  border-radius: 9px;
  box-shadow: 0 14px 26px rgba(0,0,0,.24);
  transform: rotate(-8deg);
}

.match-swatch + .match-swatch { margin-left: -28px; }
.match-swatch--rib { background: repeating-linear-gradient(90deg, #b8a27d 0 3px, #d4c5a7 3px 7px); }
.match-swatch--loop { background: radial-gradient(circle at 2px 2px, #6f7d74 1px, #91a094 2px, #91a094 4px); background-size: 6px 6px; transform: rotate(4deg); }
.match-swatch--plain { background: #c27059; transform: rotate(11deg); }

.match-brief ul { position: relative; margin: 0; padding: 0; list-style: none; }
.match-brief li { display: grid; grid-template-columns: 40px 1fr; gap: 14px; padding: 15px 0; border-top: 1px solid rgba(255,255,255,.13); }
.match-brief li > span { color: var(--gold-light); font-size: .75rem; font-weight: 800; }
.match-brief li p { margin: 0; color: rgba(255,255,255,.66); font-size: .86rem; }
.match-brief li strong { display: block; margin-bottom: 2px; color: white; font-size: .96rem; }

.match-hero__nav {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: 22px 22px 0 0;
  background: rgba(255,253,248,.82);
}

.match-hero__nav a { padding: 17px 13px; color: #4f5968; font-size: .78rem; font-weight: 700; text-align: center; text-decoration: none; }
.match-hero__nav a + a { border-left: 1px solid var(--line); }
.match-hero__nav a:hover { color: var(--ink-strong); background: rgba(138,155,141,.1); }

.match-situations,
.match-routes,
.match-resources,
.match-faq { padding: 96px 0; }

.match-heading { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(280px,.8fr); align-items: end; gap: 70px; margin-bottom: 48px; }
.match-heading > div { max-width: 740px; }
.match-heading h2 { margin-bottom: 0; }
.match-heading > p { margin: 0; color: var(--muted); }
.match-heading a { color: #755315; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.match-heading--compact { margin-bottom: 36px; }

.match-situations__grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }

.match-situations article { padding: 30px; border: 1px solid var(--line); border-radius: 22px; background: white; }
.match-situations article > span { display: block; margin-bottom: 48px; color: #7c6a3e; font-size: .76rem; font-weight: 800; }
.match-situations h3 { margin-bottom: 12px; font-size: 1.28rem; line-height: 1.15; }
.match-situations article p { margin: 0; color: var(--muted); }

.match-prepare { padding: 96px 0; color: white; background: #344154; }
.match-prepare__grid { display: grid; grid-template-columns: minmax(280px,.74fr) minmax(0,1.26fr); align-items: start; gap: 86px; }
.match-prepare__intro { position: sticky; top: 112px; }
.match-prepare h2 { color: white; }
.match-prepare__intro > p:not(.eyebrow) { margin-bottom: 28px; color: rgba(255,255,255,.68); }
.match-prepare__list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.match-prepare__list li { display: grid; grid-template-columns: 38px 1fr; gap: 12px; min-height: 150px; padding: 22px; border: 1px solid rgba(255,255,255,.15); border-radius: 18px; background: rgba(255,255,255,.045); }
.match-prepare__list li > span { color: var(--gold-light); font-size: .73rem; font-weight: 800; }
.match-prepare__list strong { display: block; margin-bottom: 8px; color: white; }
.match-prepare__list p { margin: 0; color: rgba(255,255,255,.65); font-size: .88rem; }

.match-process { padding: 96px 0; color: white; background: var(--ink-strong); }
.match-heading--light h2 { color: white; }
.match-heading--light > p { color: rgba(255,255,255,.64); }
.match-process__steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0 30px; margin: 0; padding: 0; list-style: none; }
.match-process__steps li { display: grid; grid-template-columns: 42px 1fr; gap: 14px; padding: 28px 0; border-top: 1px solid rgba(255,255,255,.14); }
.match-process__steps li > span { color: var(--gold-light); font-size: .75rem; font-weight: 800; }
.match-process__steps div > p { margin: 0 0 7px; color: var(--gold-light); font-size: .67rem; font-weight: 750; letter-spacing: .11em; text-transform: uppercase; }
.match-process__steps h3 { margin-bottom: 10px; color: white; font-size: 1.24rem; line-height: 1.15; }
.match-process__steps small { color: rgba(255,255,255,.62); font-size: .86rem; line-height: 1.55; }

.match-precision { padding: 96px 0; color: white; background: #263833; }
.match-precision__grid { display: grid; grid-template-columns: minmax(280px,.76fr) minmax(0,1.24fr); align-items: center; gap: 90px; }
.match-precision h2 { color: white; }
.match-precision__grid > div:first-child > p:last-child { color: rgba(255,255,255,.67); }
.match-precision__cards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.match-precision__card { min-height: 235px; padding: 28px; border: 1px solid rgba(255,255,255,.14); border-radius: 22px; }
.match-precision__card--photo { background: rgba(255,255,255,.04); }
.match-precision__card--sample { border-color: rgba(242,207,122,.38); background: rgba(242,207,122,.09); }
.match-precision__card p { margin-bottom: 70px; color: var(--gold-light); font-size: .7rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.match-precision__card strong { display: block; margin-bottom: 9px; color: white; font-size: 1.25rem; }
.match-precision__card span { color: rgba(255,255,255,.63); font-size: .86rem; }
.match-precision__cards aside { display: grid; grid-column: 1 / -1; grid-template-columns: 34px 1fr; gap: 15px; padding: 20px 22px; border-radius: 17px; background: rgba(0,0,0,.2); }
.match-precision__cards aside > span { display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; color: var(--gold-light); font-weight: 800; }
.match-precision__cards aside p { margin: 2px 0 0; color: rgba(255,255,255,.68); font-size: .86rem; }

.match-routes { background: var(--cream); }
.match-routes__grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.match-routes__grid article { min-height: 350px; padding: 34px; border: 1px solid var(--line); border-radius: 26px; background: var(--paper); }
.match-routes__grid article.match-routes__china { color: white; background: var(--ink-strong); }
.match-routes__grid article > div { display: flex; align-items: center; justify-content: space-between; margin-bottom: 70px; color: #8b651e; font-size: .73rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.match-routes__china > div { color: var(--gold-light) !important; }
.match-routes__grid article > div p { margin: 0; color: inherit; }
.match-routes__grid h3 { font-size: 1.65rem; }
.match-routes__china h3 { color: white; }
.match-routes__grid article > p { color: var(--muted); }
.match-routes__china > p { color: rgba(255,255,255,.65) !important; }
.match-routes__grid a { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; color: #755315; font-weight: 750; text-decoration: none; }
.match-routes__china a { color: var(--gold-light); }

.match-checklist { padding: 84px 0; background: var(--paper); }
.match-checklist__grid { display: grid; grid-template-columns: minmax(280px,.7fr) minmax(0,1.3fr); gap: 80px; }
.match-checklist__grid > div > p:last-child { color: var(--muted); }
.match-checklist ul { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.match-checklist li { display: grid; grid-template-columns: 38px 1fr; gap: 12px; padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: var(--cream); }
.match-checklist li span { color: #7d6b40; font-size: .73rem; font-weight: 800; }
.match-checklist li p { margin: 0; font-size: .9rem; }

.match-resources__grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.match-resources__grid a { display: grid; min-height: 210px; align-content: space-between; padding: 28px; border: 1px solid var(--line); border-radius: 22px; text-decoration: none; transition: border-color 160ms ease, transform 160ms ease; }
.match-resources__grid a:hover { border-color: var(--sage); transform: translateY(-3px); }
.match-resources__grid span { color: #697d70; font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.match-resources__grid strong { max-width: 270px; font-size: 1.15rem; }
.match-resources__grid i { color: #697d70; font-size: 1.4rem; font-style: normal; }

.match-faq { background: var(--cream); }
.match-faq__list details { border-top: 1px solid var(--line); }
.match-faq__list details:last-child { border-bottom: 1px solid var(--line); }
.match-faq__list summary { display: flex; min-height: 78px; align-items: center; justify-content: space-between; gap: 24px; padding: 20px 0; cursor: pointer; color: var(--ink-strong); font-size: 1.08rem; font-weight: 650; list-style: none; }
.match-faq__list summary::-webkit-details-marker { display: none; }
.match-faq__list summary span,
.match-faq__list summary span::after { display: block; width: 18px; height: 2px; flex: 0 0 auto; background: var(--ink); content: ""; }
.match-faq__list summary span { position: relative; }
.match-faq__list summary span::after { position: absolute; transform: rotate(90deg); transition: transform 160ms ease; }
.match-faq__list details[open] summary span::after { transform: rotate(0); }
.match-faq__list details > p { max-width: 830px; padding: 0 0 24px; color: var(--muted); }

.match-request { padding: 96px 0; color: white; background: var(--ink-strong); }
.match-request__grid { display: grid; grid-template-columns: minmax(280px,.72fr) minmax(0,1.28fr); align-items: start; gap: 76px; }
.match-request__copy { position: sticky; top: 112px; }
.match-request h2 { color: white; }
.match-request__copy > p:not(.eyebrow),
.match-request li { color: rgba(255,255,255,.7); }
.match-request ul { display: grid; gap: 10px; margin: 24px 0 0; padding: 0; list-style: none; }
.match-request li { position: relative; padding-left: 22px; }
.match-request li::before { position: absolute; top: .62em; left: 0; width: 7px; height: 7px; border-radius: 50%; background: var(--gold); content: ""; }
.match-request .lead-form { border: 0; }
.match-footnote { margin: 0 auto; padding-top: 24px; color: rgba(255,255,255,.58); font-size: .78rem; text-align: center; }

@media (max-width: 980px) {
  .match-hero__grid,
  .match-heading,
  .match-prepare__grid,
  .match-precision__grid,
  .match-checklist__grid,
  .match-request__grid { grid-template-columns: 1fr; gap: 38px; }
  .match-hero__nav { grid-template-columns: repeat(3,1fr); }
  .match-hero__nav a:nth-child(4) { border-left: 0; }
  .match-hero__nav a:nth-child(n + 4) { border-top: 1px solid var(--line); }
  .match-prepare__intro,
  .match-request__copy { position: static; }
  .match-process__steps { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 680px) {
  .match-hero { padding-top: 22px; }
  .match-hero__breadcrumbs { margin-bottom: 34px; }
  .match-hero__grid { padding-bottom: 40px; }
  .match-hero__copy .button { width: 100%; }
  .match-brief { padding: 24px; border-radius: 21px; }
  .match-hero__nav { display: flex; overflow-x: auto; border-radius: 16px 16px 0 0; scrollbar-width: none; }
  .match-hero__nav::-webkit-scrollbar { display: none; }
  .match-hero__nav a { min-width: max-content; padding-inline: 18px; border-top: 0 !important; border-left: 1px solid var(--line) !important; }
  .match-hero__nav a:first-child { border-left: 0 !important; }
  .match-situations,
  .match-routes,
  .match-resources,
  .match-faq,
  .match-prepare,
  .match-process,
  .match-precision,
  .match-request { padding: 70px 0; }
  .match-situations__grid,
  .match-prepare__list,
  .match-process__steps,
  .match-precision__cards,
  .match-routes__grid,
  .match-checklist ul,
  .match-resources__grid { grid-template-columns: 1fr; }
  .match-situations article,
  .match-routes__grid article { padding: 24px; }
  .match-situations article > span,
  .match-routes__grid article > div { margin-bottom: 28px; }
  .match-process__steps li { grid-template-columns: 36px 1fr; }
  .match-precision__cards aside { grid-column: auto; grid-template-columns: 1fr; }
  .match-resources__grid a { min-height: 170px; }
  .match-request .lead-form { padding: 22px 18px; }
  .match-request .lead-form .field input,
  .match-request .lead-form .field textarea,
  .match-request .lead-form .field select { min-width: 0; font-size: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .match-resources__grid a,
  .match-faq__list summary span::after { transition: none; }
}