/* 首次到访页。沿用全站字体和按钮层级，内容用分隔线组织。 */
.visit-breadcrumbs,
.first-visit {
  --fv-gutter: clamp(20px, 5vw, 76px);
  max-width: 1360px;
  margin-inline: auto;
  padding-inline: var(--fv-gutter);
}

.visit-breadcrumbs {
  align-items: center;
}

.first-visit {
  --fv-line: #ddd7ce;
  --fv-ink: #302d27;
  --fv-muted: #625d52;
  padding-bottom: clamp(40px, 7vw, 100px);
  color: var(--fv-ink);
}

.first-visit :is(h1, h2, h3) {
  font-family: var(--site-serif, var(--serif));
}

.first-visit h1 {
  max-width: 14ch;
  font-size: clamp(46px, 5.3vw, 76px);
  line-height: 1.05;
  text-wrap: pretty;
}

.first-visit:lang(zh) h1 {
  max-width: 11em;
  font-size: clamp(32px, 4.35vw, 62px);
  line-height: 1.22;
  letter-spacing: -0.035em;
}

.first-visit h2 {
  font-size: clamp(32px, 3.1vw, 46px);
  line-height: 1.13;
}

.first-visit:lang(zh) h2 {
  font-size: clamp(27px, 2.65vw, 39px);
  line-height: 1.26;
}

.first-visit h3 {
  font: 500 16px/1.45 var(--sans);
}

.fv-intro {
  display: grid;
  grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr);
  align-items: center;
  gap: clamp(30px, 5.1vw, 74px);
  padding: clamp(20px, 3vw, 42px) 0 clamp(36px, 6vw, 76px);
}

.fv-intro img {
  width: 100%;
  aspect-ratio: 1.61;
  object-fit: cover;
}

.fv-intro figcaption,
.fv-note {
  color: var(--fv-muted);
  font-size: 12px;
  line-height: 1.6;
}

.fv-intro figcaption {
  margin-top: 8px;
}

.fv-lead {
  max-width: 37ch;
  margin-top: 17px;
  color: var(--fv-muted);
}

.fv-starting-price {
  margin-top: 12px;
  font-size: 14px;
  font-weight: 500;
}

.fv-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 20px;
  align-items: center;
  margin-top: 23px;
}

.fv-actions .button {
  gap: 10px;
  min-height: 48px;
  padding: 11px 16px;
  background: #3c362d;
}

.fv-actions .button:hover {
  background: #504638;
}

.fv-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 44px;
  font-size: 14px;
  font-weight: 500;
  text-decoration: underline;
  text-decoration-color: #aaa096;
  text-underline-offset: .3em;
}

.fv-link:hover {
  text-decoration-color: currentColor;
}

.first-visit .arrow {
  width: 18px;
  height: 18px;
  flex: none;
}

.fv-note {
  margin-top: 11px;
}

.fv-section {
  padding-block: clamp(32px, 4.4vw, 62px);
  border-top: 1px solid var(--fv-line);
}

.fv-split {
  display: grid;
  grid-template-columns: minmax(0, .68fr) minmax(0, 1.32fr);
  align-items: start;
  gap: clamp(24px, 6vw, 88px);
}

.fv-section-copy > p {
  margin-top: 11px;
  color: var(--fv-muted);
  font-size: 14px;
  line-height: 1.6;
}

.fv-section-copy > .fv-link {
  margin-top: 5px;
}

.fv-treatments,
.fv-store-list,
.fv-steps {
  margin: 0;
  padding: 0;
  list-style: none;
}

.fv-treatments a,
.fv-store-list a {
  display: grid;
  align-items: center;
  gap: 8px clamp(8px, 1.8vw, 24px);
  min-height: 57px;
  padding: 10px 0;
  border-bottom: 1px solid var(--fv-line);
}

.fv-treatments li:first-child a,
.fv-store-list li:first-child a,
.fv-questions {
  border-top: 1px solid var(--fv-line);
}

.fv-treatments a {
  grid-template-columns: minmax(0, 1fr) clamp(39px, 8vw, 62px) clamp(84px, 13vw, 126px) 18px;
}

.fv-treatments a:hover .fv-treatment-name,
.fv-store-list a:hover {
  text-decoration: underline;
  text-underline-offset: .25em;
}

.fv-treatment-name {
  font-weight: 500;
}

.fv-duration,
.fv-price {
  font-size: 14px;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.fv-duration {
  color: var(--fv-muted);
}

.fv-shortcuts {
  margin-top: 7px;
}

.fv-shortcuts p {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 12px;
  color: var(--fv-muted);
  font-size: 13px;
}

.fv-shortcuts a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--fv-ink);
  text-decoration: underline;
  text-underline-offset: .25em;
}

.fv-steps li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 17px;
  padding: 13px 0;
  border-bottom: 1px solid var(--fv-line);
}

.fv-steps li:first-child {
  padding-top: 0;
}

.fv-step-number {
  padding-top: 1px;
  color: var(--fv-muted);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.fv-steps p,
.fv-questions p {
  color: var(--fv-muted);
  font-size: 14px;
  line-height: 1.65;
}

.fv-steps p {
  margin-top: 3px;
}

.fv-questions details {
  border-bottom: 1px solid var(--fv-line);
}

.fv-questions summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 54px;
  padding: 10px 0;
  font-weight: 500;
  cursor: pointer;
  list-style: none;
}

.fv-questions summary::-webkit-details-marker {
  display: none;
}

.fv-questions summary span {
  font-size: 20px;
  font-weight: 400;
}

.fv-questions [open] summary span {
  transform: rotate(45deg);
}

.fv-questions p {
  padding: 0 30px 14px 0;
}

.fv-questions p:has(+ .fv-link) {
  padding-bottom: 0;
}

.fv-stores {
  padding-bottom: 0;
}

.fv-store-list a {
  grid-template-columns: minmax(0, 1fr) 18px;
  min-height: 48px;
}

@media (max-width: 800px) {
  .fv-intro,
  .fv-split {
    grid-template-columns: minmax(0, 1fr);
  }

  .fv-intro {
    gap: 22px;
    padding-top: 16px;
  }

  .fv-split {
    gap: 12px;
  }

  .first-visit h1 {
    max-width: 17ch;
  }

  .first-visit:lang(zh) h1 {
    max-width: none;
  }
}

@media (max-width: 400px) {
  .fv-treatments a {
    gap: 7px;
    font-size: 14px;
  }

  .fv-duration,
  .fv-price {
    font-size: 12px;
  }
}