/* Sales Valuation — claude-lane field pass, 18 August 2026 (v14).
   Served ONLY through scratchpad/claude-only/server.mjs on :4290 under
   /assets/css/sales-valuation-distilled.css; the public tree keeps its
   own copy. Base is the v13 state Aarav reviewed and partially approved
   (his screenshots), NOT the parallel session's v16 rewrite. Round-5
   verdicts built in:
   - APPROVED, do not restyle: the brown/umber colourway (umber visit
     panel, dark evidence cells), the split 2×2 FAQ, the blush reviews
     treatment;
   - FIELDS: the guide's flow grammar in this page's own colourway. The
     page ground is pale sage-olive (--svx-ground) and every major
     section sits on its own full-height colour field: forest hero →
     sand assurance field → cream human band → sage priority field →
     stone story field → clay evidence field → umber appointment panel
     → sage question field → blush proof → stone tools → forest close.
     Nothing sits directly on the ground; the guide's powder blue is
     deliberately absent;
   - the visit is a VERTICAL timeline: crown placeholder plate left
     (dark slot variant), dotted brass spine with separated 01/02/03
     nodes, step copy right, the action kept at the end;
   - the hero carries the townscape alone. STANDING RULE: Claude never
     adds or sources an image; a layout that wants one gets a labelled
     crown placeholder (ratio tagged) for Aarav's generated art;
   - the hero clears the shared site header with real breathing room;
   - ONE premium white token: every light plate and the cream action
     resolve to --svx-cream; standalone text actions meet 48px targets.
   LANE OWNER: session e435a4d8 (this file's name is versioned so the
   parallel session's stale rewrites of the old filename miss the lane). */

.page--sales-valuation {
  --svx-ink: #262019;
  --svx-ink-soft: #55493d;
  --svx-forest: #155443;
  --svx-forest-deep: #0f3028;
  --svx-paper: #f3eee5;
  --svx-cream: #fffdf8;
  --svx-parchment: #f8f2e6;
  --svx-sage: #d7e2da; /* top chrome only: the page-nav hover keeps it */
  --svx-clay: #a04a30;
  --svx-clay-deep: #7d3520;
  --svx-clay-tint: #eedbcf;
  --svx-umber: #2b211a;
  --svx-umber-soft: #6d5c4c;
  --svx-brass: #8a6423;
  --svx-focus: #c59743;
  --svx-blush: #ead5d2; /* the proof field stays pink — Aarav, 18 Aug round 3 */
  --svx-stone: #e7dcc8; /* story field + closing band */
  --svx-ground: #e9ece1; /* page ground — pale sage-olive; no content sits on it directly */
  --svx-field-sand: #ebdfc6; /* assurance field */
  --svx-field-sage: #dfe7d8; /* priority + questions fields */
  /* Grounding standard (Aarav, round 3): plates carry a visible hairline and
     a tight shadow, never a wide soft halo. */
  --svx-plate-line: 1px solid rgba(38, 32, 25, 0.16);
  --svx-plate-shadow: 0 6px 16px -10px rgba(43, 33, 26, 0.3);
  --svx-field-line: 1px solid rgba(38, 32, 25, 0.1);
  --svx-shell: min(94vw, 1640px);
  background: var(--svx-ground);
  color: var(--svx-ink);
  font-family: "Manrope", sans-serif;
  scrollbar-color: var(--svx-forest) var(--svx-ground);
  scrollbar-width: thin;
}

/* --------------------------------------------------------------------------
   Sticky "On this page" control, joined to the measured header seam.
   ----------------------------------------------------------------------- */

.page--sales-valuation .svx-nav {
  position: sticky;
  top: var(--sales-nav-seam, var(--head-h, 79px));
  z-index: 900;
  height: 0;
  width: max-content;
  max-width: calc(100vw - 2rem);
  margin: 0 0 0 clamp(1rem, 3vw, 2.5rem);
  overflow: visible;
  transition: top 240ms ease;
}

.site-head.head--hidden ~ .main .svx-nav { top: 0; }

@media (prefers-reduced-motion: reduce) {
  .page--sales-valuation .svx-nav { transition: none; }
}

.page--sales-valuation .svx-nav > summary {
  display: flex;
  align-items: center;
  min-height: 48px;
  gap: 0.8rem;
  padding: 0.65rem 1.1rem;
  border: 1px solid rgba(38, 32, 25, 0.2);
  border-radius: 999px;
  background: rgba(255, 253, 248, 0.94);
  box-shadow: 0 6px 16px -8px rgba(43, 33, 26, 0.35);
  transform: translateY(0.6rem);
  color: var(--svx-ink);
  cursor: pointer;
  list-style: none;
}

.page--sales-valuation .svx-nav > summary::-webkit-details-marker { display: none; }

.page--sales-valuation .svx-nav > summary span {
  color: var(--svx-brass);
  font-size: 0.875rem;
  font-weight: 800;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.page--sales-valuation .svx-nav > summary strong {
  font-size: 0.92rem;
  font-weight: 750;
}

.page--sales-valuation .svx-nav > summary::after {
  width: 0.5rem;
  height: 0.5rem;
  margin-left: 0.2rem;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  content: "";
  transform: rotate(45deg) translateY(-2px);
  transition: transform 180ms ease;
}

.page--sales-valuation .svx-nav[open] > summary::after {
  transform: rotate(225deg) translate(-2px, -2px);
}

.page--sales-valuation .svx-nav > summary:focus-visible {
  outline: 3px solid var(--svx-focus);
  outline-offset: 3px;
}

.page--sales-valuation .svx-nav:not([open]) nav { display: none; }

.page--sales-valuation .svx-nav[open] nav {
  position: fixed;
  top: var(--sales-nav-seam, var(--head-h, 79px));
  left: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: min(19rem, 86vw);
  max-height: calc(100vh - var(--sales-nav-seam, var(--head-h, 79px)) - 1rem);
  padding: 0.9rem 0.85rem 1rem;
  overflow-y: auto;
  border: 1px solid rgba(38, 32, 25, 0.14);
  border-left: 0;
  border-radius: 0 16px 16px 0;
  background: var(--svx-cream);
  box-shadow: 0 10px 28px -12px rgba(43, 33, 26, 0.4);
}

.page--sales-valuation .site-head.head--hidden ~ .main .svx-nav[open] nav { top: 0; }

.page--sales-valuation .svx-nav nav a {
  display: flex;
  align-items: center;
  min-height: 48px;
  padding: 0.35rem 0.85rem;
  border-radius: 8px;
  color: #23332c;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
}

@media (hover: hover) and (pointer: fine) {
  .page--sales-valuation .svx-nav nav a:hover { background: var(--svx-sage); }
}

.page--sales-valuation .svx-nav nav a:focus-visible {
  outline: 3px solid var(--svx-focus);
  outline-offset: 2px;
  background: var(--svx-sage);
}

.page--sales-valuation [data-sales-section],
.page--sales-valuation .svx-questions,
.page--sales-valuation .svx-contact {
  scroll-margin-top: calc(var(--sales-nav-seam, var(--head-h, 84px)) + 4.5rem);
}

/* --------------------------------------------------------------------------
   Branded image-slot standard: a tinted plate with a ghost crown watermark,
   one short label chip and a ratio tag. Every empty slot on the page uses
   this; Aarav fills them with generated art.
   ----------------------------------------------------------------------- */

.page--sales-valuation .svx-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1.5px dashed rgba(24, 32, 28, 0.3);
  border-radius: 12px;
  background: rgba(24, 32, 28, 0.04);
  color: rgba(24, 32, 28, 0.52);
  font-size: 0.875rem;
  font-weight: 650;
  letter-spacing: 0.02em;
  line-height: 1.45;
  text-align: center;
}

.page--sales-valuation .svx-slot {
  position: relative;
  display: block;
  margin: 0;
  overflow: hidden;
  border: var(--svx-plate-line);
  border-radius: 12px;
  background: linear-gradient(150deg, rgba(160, 74, 48, 0.1), rgba(160, 74, 48, 0)), var(--svx-clay-tint);
}

.page--sales-valuation .svx-slot::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("/assets/brand/dukes-crown.png") center / clamp(3.5rem, 34%, 7rem) no-repeat;
  opacity: 0.14;
}

.page--sales-valuation .svx-slot__chip {
  position: absolute;
  left: 0.6rem;
  bottom: 0.6rem;
  padding: 0.3rem 0.65rem;
  border-radius: 999px;
  background: rgba(255, 253, 248, 0.92);
  color: #5f4c3f;
  font-size: 0.875rem;
  font-weight: 750;
  line-height: 1.2;
}

.page--sales-valuation .svx-slot__ratio {
  position: absolute;
  top: 0.6rem;
  right: 0.6rem;
  padding: 0.22rem 0.55rem;
  border-radius: 999px;
  background: rgba(43, 33, 26, 0.78);
  color: #f2ece2;
  font-size: 0.875rem;
  font-weight: 750;
  letter-spacing: 0.04em;
  line-height: 1.2;
}

/* Dark-field variant for slots seated on the umber panel. */
.page--sales-valuation .svx-slot--dark {
  border: 1px solid rgba(246, 239, 223, 0.22);
  background: linear-gradient(150deg, rgba(197, 151, 67, 0.16), rgba(197, 151, 67, 0)), #3a2d22;
}

.page--sales-valuation .svx-slot--dark::before { filter: invert(1); opacity: 0.1; }

.page--sales-valuation .svx-slot--dark .svx-slot__chip {
  background: rgba(38, 30, 22, 0.72);
  color: #f2e9d8;
}

.page--sales-valuation .svx-slot--dark .svx-slot__ratio {
  background: rgba(255, 253, 248, 0.16);
  color: #f2e9d8;
}

/* --------------------------------------------------------------------------
   Hero: deep-forest signature panel, stacked Gloock statement, the real
   townscape plate alone. Round 5: clear breathing room under the shared
   header; no second image and no companion tile (Aarav generates all art).
   ----------------------------------------------------------------------- */

.page--sales-valuation .svx-hero {
  display: grid;
  width: var(--svx-shell);
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.95fr);
  gap: clamp(2rem, 4vw, 4rem);
  align-items: center;
  min-height: clamp(540px, 64vh, 680px);
  margin: clamp(1.4rem, 2.6vw, 2.4rem) auto clamp(4rem, 7vw, 7rem);
  padding: clamp(2rem, 4.5vw, 4.5rem);
  border-radius: 18px 18px 72px 18px;
  background:
    radial-gradient(120% 140% at 88% 8%, rgba(21, 84, 67, 0.55) 0%, transparent 55%),
    var(--svx-forest-deep);
  box-shadow: 0 14px 30px -18px rgba(15, 48, 40, 0.55);
  color: #f2efe6;
}

.page--sales-valuation .svx-hero h1 {
  max-width: 12ch;
  margin: 0;
  color: #f7f3e9;
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(2.8rem, 4.6vw, 4.5rem);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 0.96;
  text-wrap: balance;
}

.page--sales-valuation .svx-hero h1 span,
.page--sales-valuation .svx-hero h1 em { display: block; }

.page--sales-valuation .svx-hero h1 em {
  color: #b9d4c3;
  font-style: normal;
}

.page--sales-valuation .svx-hero__lede {
  max-width: 46ch;
  margin: 1.3rem 0 0;
  color: #e4e0d4;
  font-size: clamp(0.98rem, 1.25vw, 1.12rem);
  line-height: 1.55;
}

.page--sales-valuation .svx-hero__edition {
  width: fit-content;
  margin: 1.1rem 0 0;
  color: #cbb98a;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.page--sales-valuation .svx-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.3rem;
  margin: 1.7rem 0 0;
}

.page--sales-valuation .svx-button {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 0.82rem 1.35rem;
  border: 0;
  border-radius: 10px;
  font: inherit;
  font-size: 0.92rem;
  font-weight: 750;
  text-decoration: none;
  transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1), background 180ms ease, color 180ms ease;
}

@media (hover: hover) and (pointer: fine) {
  .page--sales-valuation .svx-button:hover { transform: translateY(-2px); }
}

@media (prefers-reduced-motion: reduce) {
  .page--sales-valuation .svx-button,
  .page--sales-valuation .svx-button:hover { transform: none; transition: background 180ms ease, color 180ms ease; }
}

.page--sales-valuation .svx-button:focus-visible {
  outline: 3px solid var(--svx-focus);
  outline-offset: 3px;
}

/* One premium white: the cream action rests on the same token as the
   plates and presses one step warmer on hover. */
.page--sales-valuation .svx-button--cream { background: var(--svx-cream); color: var(--svx-forest-deep); }
.page--sales-valuation .svx-button--cream:hover { background: #efe6d2; }
.page--sales-valuation .svx-button--forest { background: var(--svx-forest); color: #f5f1e6; }
.page--sales-valuation .svx-button--forest:hover { background: var(--svx-forest-deep); }
.page--sales-valuation .svx-button--clay { background: var(--svx-clay); color: #fff7ef; }
.page--sales-valuation .svx-button--clay:hover { background: var(--svx-clay-deep); }

.page--sales-valuation .svx-text-action {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  padding: 0.35rem 0;
  border-bottom: 1px solid rgba(242, 239, 230, 0.55);
  color: #f2efe6;
  font-size: 0.92rem;
  font-weight: 700;
  text-decoration: none;
}

@media (hover: hover) and (pointer: fine) {
  .page--sales-valuation .svx-text-action:hover { color: #b9d4c3; border-bottom-color: currentColor; }
}

.page--sales-valuation .svx-hero__stage {
  position: relative;
  height: 100%;
  min-height: 24rem;
}

.page--sales-valuation .svx-hero__plate {
  height: 100%;
  margin: 0;
  overflow: hidden;
  border-radius: 14px 14px 44px 14px;
  box-shadow: 0 10px 22px -12px rgba(0, 0, 0, 0.45);
}

.page--sales-valuation .svx-hero__plate img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* --------------------------------------------------------------------------
   Assurance triptych on its sand field: three document cards, each led by
   a full-width 4:5 crown placeholder plate with number, title and line in
   one lockup beneath — nothing floats beside a stamp.
   ----------------------------------------------------------------------- */

.page--sales-valuation .svx-kicker {
  margin: 0 0 1.1rem;
  color: var(--svx-clay-deep);
  font-size: 0.875rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.page--sales-valuation .svx-kicker--dark { color: var(--svx-focus); }

.page--sales-valuation .svx-mark {
  width: min(92vw, 1440px);
  margin: 0 auto clamp(4rem, 7vw, 7rem);
  padding: clamp(2rem, 4vw, 3.5rem);
  border: var(--svx-field-line);
  border-radius: 16px 16px 52px 16px;
  background: var(--svx-field-sand);
}

.page--sales-valuation .svx-mark__band {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.25rem, 2.5vw, 2.25rem);
}

.page--sales-valuation .svx-mark__item {
  display: grid;
  grid-template-rows: auto 1fr;
  overflow: hidden;
  border: var(--svx-plate-line);
  border-radius: 14px 14px 36px 14px;
  background: var(--svx-cream);
  box-shadow: var(--svx-plate-shadow);
}

.page--sales-valuation .svx-mark__slot {
  margin: 0;
  aspect-ratio: 4 / 5;
  border: 0;
  border-bottom: var(--svx-plate-line);
  border-radius: 0;
}

.page--sales-valuation .svx-mark__copy {
  display: grid;
  gap: 0.5rem;
  align-content: start;
  padding: 1.15rem 1.25rem 1.5rem;
}

.page--sales-valuation .svx-mark__n {
  color: var(--svx-clay);
  font-size: 0.875rem;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.page--sales-valuation .svx-mark__copy strong {
  color: var(--svx-ink);
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(1.1rem, 1.5vw, 1.35rem);
  font-weight: 400;
  line-height: 1.15;
}

.page--sales-valuation .svx-mark__copy > span:last-child {
  max-width: 34ch;
  color: var(--svx-ink-soft);
  font-size: 1rem;
  line-height: 1.6;
}

/* --------------------------------------------------------------------------
   Human editorial row on its own cream band.
   ----------------------------------------------------------------------- */

.page--sales-valuation .svx-human {
  display: grid;
  width: min(92vw, 1440px);
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
  margin: 0 auto clamp(4rem, 7vw, 7rem);
  padding: clamp(2rem, 4vw, 3.5rem);
  border: var(--svx-field-line);
  border-radius: 16px 16px 52px 16px;
  background: var(--svx-cream);
}

/* No text overlays on photographs (Aarav, round 3, point 3). */
.page--sales-valuation .svx-human__media { margin: 0; }

.page--sales-valuation .svx-human__media img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  border: var(--svx-plate-line);
  border-radius: 14px 44px 14px 14px;
  box-shadow: var(--svx-plate-shadow);
}

.page--sales-valuation .svx-human__media figcaption {
  margin-top: 0.6rem;
  color: var(--svx-ink-soft);
  font-size: 0.875rem;
  line-height: 1.45;
}

.page--sales-valuation .svx-human__copy h2 {
  max-width: 17ch;
  margin: 0;
  color: var(--svx-ink);
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(2rem, 3.3vw, 3.4rem);
  font-weight: 400;
  letter-spacing: -0.03em;
  line-height: 1.04;
  text-wrap: balance;
}

.page--sales-valuation .svx-human__copy p {
  max-width: 56ch;
  margin: 1.1rem 0 0;
  color: var(--svx-ink-soft);
  font-size: 1.05rem;
  line-height: 1.68;
}

/* --------------------------------------------------------------------------
   Reading shell and chapter heads: a short clay keyline under each head.
   ----------------------------------------------------------------------- */

.page--sales-valuation .svx-shell {
  width: min(92vw, 1440px);
  margin: 0 auto;
}

.page--sales-valuation .svx-head {
  display: block;
  max-width: 64ch;
  padding-bottom: 1.5rem;
}

.page--sales-valuation .svx-head .svx-head__intro { margin-top: 1rem; }

.page--sales-valuation .svx-head h2::after {
  content: "";
  display: block;
  width: 3.25rem;
  height: 3px;
  margin-top: 1rem;
  border-radius: 2px;
  background: var(--svx-clay);
}

.page--sales-valuation .svx-head h2,
.page--sales-valuation .svx-evidence h2,
.page--sales-valuation .svx-visit h2,
.page--sales-valuation .svx-proof h2,
.page--sales-valuation .svx-contact h2 {
  margin: 0;
  color: var(--svx-ink);
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(2rem, 3.4vw, 3.6rem);
  font-weight: 400;
  letter-spacing: -0.03em;
  line-height: 1.02;
  text-wrap: balance;
}

.page--sales-valuation .svx-head__intro {
  max-width: 58ch;
  margin: 0;
  color: var(--svx-ink-soft);
  font-size: 1rem;
  line-height: 1.65;
}

/* --------------------------------------------------------------------------
   Priority chooser on its sage field: segment track, sliding cream pill,
   result plate with the labelled starting-point slot.
   ----------------------------------------------------------------------- */

.page--sales-valuation .svx-priority {
  margin: 0 0 clamp(4rem, 7vw, 7rem);
  padding: clamp(2rem, 4vw, 3.5rem);
  border: var(--svx-field-line);
  border-radius: 16px 16px 52px 16px;
  background: var(--svx-field-sage);
}

.page--sales-valuation .svx-priority__choice {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  min-height: 52px;
  padding: 0.7rem 1.25rem;
  border: 1px solid rgba(24, 32, 28, 0.28);
  border-radius: 999px;
  background: var(--svx-cream);
  color: var(--svx-ink);
  text-decoration: none;
  transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
}

.page--sales-valuation .svx-priority__choice:hover { border-color: var(--svx-clay); background: var(--svx-clay-tint); }

.page--sales-valuation .svx-priority__choice.is-active {
  border-color: var(--svx-forest);
  background: var(--svx-forest);
  color: #f2efe6;
}

.page--sales-valuation .svx-priority__choice:focus-visible {
  outline: 3px solid var(--svx-focus);
  outline-offset: 3px;
}

.page--sales-valuation .svx-priority__n {
  color: var(--svx-clay-deep);
  font-size: 0.875rem;
  font-weight: 800;
}

.page--sales-valuation .svx-priority__choice.is-active .svx-priority__n { color: #cbb98a; }

.page--sales-valuation .svx-priority__title {
  font-size: 0.95rem;
  font-weight: 750;
  line-height: 1.3;
}

.page--sales-valuation .svx-priority__results {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(200px, 0.42fr);
  gap: clamp(1.25rem, 2.5vw, 2.25rem);
  align-items: stretch;
  margin: 1.6rem 0 0;
  padding: clamp(1.5rem, 2.5vw, 2.25rem);
  border: var(--svx-plate-line);
  border-radius: 14px 14px 32px 14px;
  background: var(--svx-cream);
  box-shadow: var(--svx-plate-shadow);
}

.page--sales-valuation .svx-priority__slot { min-height: 13rem; }

.page--sales-valuation .svx-priority__result { display: none; max-width: 62ch; }
.page--sales-valuation .svx-priority__result[data-active] { display: block; }

.page--sales-valuation .svx-priority__result h3 {
  margin: 0;
  color: var(--svx-ink);
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(1.55rem, 2.4vw, 2.35rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.08;
}

.page--sales-valuation .svx-priority__result p {
  max-width: 62ch;
  margin: 0.8rem 0 1rem;
  color: var(--svx-ink-soft);
  font-size: 1.02rem;
  line-height: 1.65;
}

.page--sales-valuation .svx-priority__result a {
  color: var(--svx-clay-deep);
  font-size: 0.9rem;
  font-weight: 800;
  text-underline-offset: 0.24em;
}

/* --------------------------------------------------------------------------
   Takeaways on the stone story field: composed plates, each photograph
   with its copy card overlapping the plate edge; sides alternate.
   ----------------------------------------------------------------------- */

.page--sales-valuation .svx-takeaways {
  margin: 0 0 clamp(4rem, 7vw, 7rem);
  padding: clamp(2rem, 4vw, 3.5rem);
  border: var(--svx-field-line);
  border-radius: 16px 16px 52px 16px;
  background: var(--svx-stone);
}

.page--sales-valuation .svx-story {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: start;
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
}

.page--sales-valuation .svx-story + .svx-story {
  margin-top: clamp(2.75rem, 5vw, 4.5rem);
}

.page--sales-valuation .svx-story__media {
  grid-column: 1 / span 8;
  grid-row: 1;
  min-height: clamp(16rem, 30vw, 26rem);
  margin: 0;
  overflow: hidden;
  border-radius: 14px 14px 44px 14px;
  border: var(--svx-plate-line);
  box-shadow: var(--svx-plate-shadow);
}

.page--sales-valuation .svx-story__media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.page--sales-valuation .svx-story__card {
  z-index: 1;
  grid-column: 7 / -1;
  grid-row: 1;
  margin-top: clamp(2.25rem, 5vw, 4.25rem);
  padding: clamp(1.5rem, 2.6vw, 2.4rem);
  border: var(--svx-plate-line);
  border-radius: 14px 14px 36px 14px;
  background: var(--svx-cream);
  box-shadow: var(--svx-plate-shadow);
}

.page--sales-valuation .svx-story--flip .svx-story__media { grid-column: 5 / -1; }
.page--sales-valuation .svx-story--flip .svx-story__card { grid-column: 1 / span 6; }

.page--sales-valuation .svx-story__n {
  margin: 0 0 0.7rem;
  color: var(--svx-clay);
  font-size: 0.875rem;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.page--sales-valuation .svx-story__card h3 {
  max-width: 24ch;
  margin: 0;
  color: var(--svx-ink);
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(1.5rem, 2.2vw, 2.2rem);
  font-weight: 400;
  letter-spacing: -0.025em;
  line-height: 1.1;
}

.page--sales-valuation .svx-story__card p:not(.svx-story__n) {
  max-width: 52ch;
  margin: 0.9rem 0 1.1rem;
  color: var(--svx-ink-soft);
  font-size: 1.02rem;
  line-height: 1.68;
}

.page--sales-valuation .svx-story__card a {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  min-height: 48px;
  color: var(--svx-clay-deep);
  font-size: 0.92rem;
  font-weight: 800;
  text-underline-offset: 0.24em;
}

/* --------------------------------------------------------------------------
   Evidence: clay field, asymmetric bento — the opening cell in the
   bottom's espresso dark, the closing cell in deep clay, cream between.
   ----------------------------------------------------------------------- */

.page--sales-valuation .svx-evidence {
  margin: 0 0 clamp(4rem, 7vw, 7rem);
  padding: clamp(2.2rem, 5vw, 4.5rem);
  border: 1px solid rgba(125, 53, 32, 0.18);
  border-radius: 16px 16px 52px 16px;
  background: var(--svx-clay-tint);
  box-shadow: none;
}

.page--sales-valuation .svx-evidence h2::after {
  content: "";
  display: block;
  width: 3.25rem;
  height: 3px;
  margin-top: 1rem;
  border-radius: 2px;
  background: var(--svx-clay);
}

.page--sales-valuation .svx-evidence__intro {
  max-width: 52ch;
  margin: 1rem 0 0;
  color: var(--svx-umber-soft);
  font-size: 1rem;
  line-height: 1.65;
}

.page--sales-valuation .svx-evidence__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(0.9rem, 1.6vw, 1.4rem);
  margin-top: 2.25rem;
}

.page--sales-valuation .svx-evidence__grid > div {
  display: grid;
  gap: 0.45rem;
  align-content: start;
  padding: clamp(1.1rem, 1.9vw, 1.7rem);
  border: var(--svx-plate-line);
  border-radius: 12px 12px 26px 12px;
  background: var(--svx-cream);
}

.page--sales-valuation .svx-evidence__grid > div:nth-child(1),
.page--sales-valuation .svx-evidence__grid > div:nth-child(6) {
  grid-column: span 2;
}

.page--sales-valuation .svx-evidence__grid > div:nth-child(1) {
  border-color: transparent;
  background: var(--svx-umber);
}

.page--sales-valuation .svx-evidence__grid > div:nth-child(1) .svx-evidence__n { color: var(--svx-focus); }
.page--sales-valuation .svx-evidence__grid > div:nth-child(1) strong { color: #f4ecdd; }
.page--sales-valuation .svx-evidence__grid > div:nth-child(1) > span:last-child { color: #cfc2b1; }

.page--sales-valuation .svx-evidence__grid > div:nth-child(6) {
  border-color: transparent;
  background: var(--svx-clay-deep);
}

.page--sales-valuation .svx-evidence__grid > div:nth-child(6) .svx-evidence__n { color: #f0c9a8; }
.page--sales-valuation .svx-evidence__grid > div:nth-child(6) strong { color: #fff3e9; }
.page--sales-valuation .svx-evidence__grid > div:nth-child(6) > span:last-child { color: #f2d9c9; }

.page--sales-valuation .svx-evidence__n {
  color: var(--svx-clay-deep);
  font-size: 0.875rem;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.page--sales-valuation .svx-evidence__grid strong {
  color: var(--svx-umber);
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(1.1rem, 1.55vw, 1.4rem);
  font-weight: 400;
  line-height: 1.15;
}

.page--sales-valuation .svx-evidence__grid > div > span:last-child {
  max-width: 44ch;
  color: var(--svx-ink-soft);
  font-size: 1rem;
  line-height: 1.6;
}

/* Lane claude-4: the markup carries the stamped assessment note (crown in a
   brass ring beside the three standing disclosures); these are its styles —
   the old dot-separated footline rules matched markup that no longer exists. */
.page--sales-valuation .svx-evidence__note {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1.1rem;
  align-items: center;
  margin-top: 1.9rem;
  padding: 1.1rem 1.4rem;
  border: 1px solid rgba(138, 100, 35, 0.4);
  border-radius: 12px;
  background: var(--svx-cream);
}

.page--sales-valuation .svx-evidence__stamp {
  display: flex;
  width: 3.4rem;
  height: 3.4rem;
  align-items: center;
  justify-content: center;
  border: 1.5px solid rgba(138, 100, 35, 0.6);
  border-radius: 50%;
}

.page--sales-valuation .svx-evidence__stamp img {
  width: 2rem;
  height: auto;
  display: block;
  opacity: 0.9;
}

.page--sales-valuation .svx-evidence__note-lines { display: grid; gap: 0.25rem; }

.page--sales-valuation .svx-evidence__note p {
  margin: 0;
  color: #5f4c3f;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.5;
}

/* --------------------------------------------------------------------------
   Visit: the bottom's dark chapter as a VERTICAL timeline. Crown
   placeholder plate left, dotted brass spine with separated nodes,
   step copy right, the action at the end. (Round 5.)
   ----------------------------------------------------------------------- */

.page--sales-valuation .svx-visit {
  margin: 0 0 clamp(4rem, 7vw, 7rem);
  padding: clamp(2.2rem, 5vw, 4rem);
  border-radius: 16px 16px 52px 16px;
  background:
    radial-gradient(120% 150% at 92% 0%, rgba(160, 74, 48, 0.26) 0%, transparent 55%),
    var(--svx-umber);
  box-shadow: 0 14px 30px -18px rgba(43, 33, 26, 0.6);
}

.page--sales-valuation .svx-visit h2 { color: #f6efdf; }

.page--sales-valuation .svx-visit h2::after {
  content: "";
  display: block;
  width: 3.25rem;
  height: 3px;
  margin-top: 1rem;
  border-radius: 2px;
  background: var(--svx-focus);
}

.page--sales-valuation .svx-visit__head { display: block; max-width: 64ch; }

.page--sales-valuation .svx-visit__head p {
  max-width: 58ch;
  margin: 1rem 0 0;
  color: #cfc2b1;
  font-size: 1rem;
  line-height: 1.65;
}

.page--sales-valuation .svx-visit__body {
  display: grid;
  grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr);
  gap: clamp(1.75rem, 3.5vw, 3.25rem);
  align-items: start;
  margin-top: clamp(1.9rem, 3vw, 2.6rem);
}

.page--sales-valuation .svx-visit__slot {
  width: 100%;
  aspect-ratio: 4 / 5;
  align-self: center;
}

.page--sales-valuation .svx-visit__steps {
  display: flex;
  flex-direction: column;
  gap: clamp(2rem, 3.2vw, 2.8rem);
  margin: 0;
  padding: 0;
  list-style: none;
}

.page--sales-valuation .svx-visit__steps li {
  position: relative;
  display: grid;
  grid-template-columns: 2.6rem minmax(0, 1fr);
  column-gap: 1.25rem;
  row-gap: 0.55rem;
  align-items: start;
}

.page--sales-valuation .svx-visit__steps li > span {
  grid-row: 1 / 3;
  display: inline-flex;
  width: 2.6rem;
  height: 2.6rem;
  align-items: center;
  justify-content: center;
  border: 1.5px solid var(--svx-focus);
  border-radius: 50%;
  background: rgba(255, 253, 248, 0.07);
  color: #e8c98f;
  font-family: "Gloock", Georgia, serif;
  font-size: 1.15rem;
  line-height: 1;
}

/* The spine: a dotted brass thread running node to node, stopping clear
   of each medallion so the sequence reads as separated stations. */
.page--sales-valuation .svx-visit__steps li:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 3rem;
  bottom: calc(-1 * clamp(2rem, 3.2vw, 2.8rem) + 0.4rem);
  left: 1.3rem;
  border-left: 2px dotted rgba(197, 151, 67, 0.5);
}

.page--sales-valuation .svx-visit__steps h3 {
  grid-column: 2;
  margin: 0;
  padding-top: 0.45rem;
  color: #f6efdf;
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(1.2rem, 1.75vw, 1.6rem);
  font-weight: 400;
  line-height: 1.15;
}

.page--sales-valuation .svx-visit__steps p {
  grid-column: 2;
  max-width: 52ch;
  margin: 0;
  color: #c9bcab;
  font-size: 1rem;
  line-height: 1.6;
}

.page--sales-valuation .svx-visit__action { margin: clamp(2rem, 3vw, 2.5rem) 0 0; }

/* --------------------------------------------------------------------------
   Questions on the sage field: four cream documents in a two-across grid,
   separated by space alone. Plus signs kept. (Split FAQ approved.)
   ----------------------------------------------------------------------- */

.page--sales-valuation .svx-questions {
  margin: 0 0 clamp(4rem, 7vw, 7rem);
  padding: clamp(2rem, 4vw, 3.5rem);
  border: var(--svx-field-line);
  border-radius: 16px 16px 52px 16px;
  background: var(--svx-field-sage);
}

.page--sales-valuation .svx-questions__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(0.9rem, 1.6vw, 1.4rem);
  align-items: start;
  margin-top: 0.5rem;
}

.page--sales-valuation .svx-question {
  border: var(--svx-plate-line);
  border-radius: 12px 12px 26px 12px;
  background: var(--svx-cream);
  box-shadow: var(--svx-plate-shadow);
  transition: background 180ms ease, border-color 180ms ease;
}

.page--sales-valuation .svx-question[open] {
  border-color: rgba(160, 74, 48, 0.4);
  background: var(--svx-parchment);
}

.page--sales-valuation .svx-question summary {
  display: grid;
  min-height: 68px;
  grid-template-columns: 2.5rem 1fr 2rem;
  align-items: center;
  gap: 0.6rem;
  padding: 0.6rem 1.4rem;
  color: var(--svx-ink);
  cursor: pointer;
  list-style: none;
}

.page--sales-valuation .svx-question summary::-webkit-details-marker { display: none; }

.page--sales-valuation .svx-question summary:focus-visible {
  outline: 3px solid var(--svx-focus);
  outline-offset: 2px;
}

.page--sales-valuation .svx-question__n {
  color: var(--svx-clay-deep);
  font-size: 0.875rem;
  font-weight: 800;
}

.page--sales-valuation .svx-question__label {
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(1.05rem, 1.6vw, 1.32rem);
  line-height: 1.25;
}

.page--sales-valuation .svx-question__sign {
  position: relative;
  width: 0.8rem;
  height: 0.8rem;
  justify-self: end;
}

.page--sales-valuation .svx-question__sign::before,
.page--sales-valuation .svx-question__sign::after {
  content: "";
  position: absolute;
  inset: 50% auto auto 0;
  width: 100%;
  height: 1.5px;
  background: var(--svx-clay-deep);
  transition: transform 180ms ease;
}

.page--sales-valuation .svx-question__sign::after { transform: rotate(90deg); }
.page--sales-valuation .svx-question[open] .svx-question__sign::after { transform: rotate(0deg); }

@media (prefers-reduced-motion: reduce) {
  .page--sales-valuation .svx-question__sign::before,
  .page--sales-valuation .svx-question__sign::after { transition: none; }
}

.page--sales-valuation .svx-question__answer {
  max-width: 68ch;
  margin: 0;
  padding: 0 2rem 1.4rem 4.5rem;
  color: var(--svx-ink-soft);
  font-size: 1.02rem;
  line-height: 1.65;
}

/* --------------------------------------------------------------------------
   Proof: the blush field stays (approved). Star lockup, review-count
   link, monogram chips; the happy-clients slot pins to the column foot.
   ----------------------------------------------------------------------- */

.page--sales-valuation .svx-proof {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: clamp(2rem, 5vw, 5rem);
  margin: 0 0 clamp(4rem, 7vw, 7rem);
  padding: clamp(2rem, 5vw, 4.5rem);
  border: 1px solid rgba(94, 60, 54, 0.2);
  border-radius: 14px 14px 54px 14px;
  background: var(--svx-blush);
  color: #3c2a26;
}

.page--sales-valuation .svx-proof h2 { color: #3c2a26; }

.page--sales-valuation .svx-proof h2::after {
  content: "";
  display: block;
  width: 3.25rem;
  height: 3px;
  margin-top: 1rem;
  border-radius: 2px;
  background: var(--svx-focus);
}

.page--sales-valuation .svx-proof__lockup {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem 1rem;
  margin: 1.1rem 0 0;
}

.page--sales-valuation .svx-proof .sales-review__stars {
  width: 7.25rem;
  height: 1.45rem;
  fill: var(--svx-clay-deep);
}

.page--sales-valuation .svx-proof__count {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  gap: 0.4rem;
  padding: 0.45rem 1rem;
  border: 1px solid rgba(125, 53, 32, 0.4);
  border-radius: 999px;
  background: rgba(255, 253, 248, 0.85);
  color: var(--svx-clay-deep);
  font-size: 0.9rem;
  font-weight: 800;
  text-decoration: none;
}

@media (hover: hover) and (pointer: fine) {
  .page--sales-valuation .svx-proof__count:hover { background: var(--svx-cream); border-color: var(--svx-clay-deep); }
}

.page--sales-valuation .svx-proof__count:focus-visible {
  outline: 3px solid var(--svx-focus);
  outline-offset: 3px;
}

.page--sales-valuation .svx-proof__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.page--sales-valuation .svx-proof__slot { margin-top: auto; aspect-ratio: 4 / 3; align-self: stretch; }

.page--sales-valuation .svx-review__monogram {
  display: inline-flex;
  width: 48px;
  height: 48px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--svx-clay-deep);
  color: #f7ede5;
  font-family: "Gloock", Georgia, serif;
  font-size: 1rem;
  letter-spacing: 0.04em;
}

.page--sales-valuation .svx-proof__copy > p:not(.svx-proof__lockup) {
  max-width: 40ch;
  margin: 1rem 0 0;
  color: #59453f;
  font-size: 1rem;
  line-height: 1.65;
}

.page--sales-valuation .svx-proof__copy a.svx-proof__all {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  margin-top: 0.4rem;
  margin-bottom: 1.5rem;
  color: var(--svx-clay-deep);
  font-size: 0.9rem;
  font-weight: 800;
  text-underline-offset: 0.22em;
}

.page--sales-valuation .svx-proof__quotes { display: grid; gap: 1.8rem; align-self: center; }

.page--sales-valuation .svx-review { margin: 0; }

.page--sales-valuation .svx-review blockquote { margin: 0; }

.page--sales-valuation .svx-review blockquote p {
  margin: 0;
  color: #3c2a26;
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(1.3rem, 2vw, 1.85rem);
  line-height: 1.34;
}

.page--sales-valuation .svx-review--feature blockquote p {
  font-size: clamp(1.5rem, 2.5vw, 2.3rem);
  line-height: 1.3;
}

.page--sales-valuation .svx-review .sales-review__stars {
  width: 6.25rem;
  height: 1.25rem;
  margin-bottom: 0.6rem;
  fill: var(--svx-clay-deep);
}

.page--sales-valuation .svx-review figcaption {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.9rem;
  align-items: center;
  margin-top: 1rem;
  color: #6b544d;
  font-size: 0.875rem;
}

.page--sales-valuation .svx-review figcaption strong { display: block; color: var(--svx-ink); }
.page--sales-valuation .svx-review figcaption small { font-size: 0.875rem; }

.page--sales-valuation .svx-review figcaption a {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  color: var(--svx-clay-deep);
  font-weight: 800;
  text-underline-offset: 0.2em;
}

/* --------------------------------------------------------------------------
   Contact close: deep-forest bookend, cream action, route chips.
   ----------------------------------------------------------------------- */

.page--sales-valuation .svx-contact {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(320px, 0.75fr);
  gap: clamp(2rem, 7vw, 7rem);
  margin: 0 0 clamp(4rem, 7vw, 7rem);
  padding: clamp(2.2rem, 5vw, 5rem);
  border-radius: 14px 14px 54px 14px;
  background:
    radial-gradient(120% 140% at 90% 100%, rgba(21, 84, 67, 0.5) 0%, transparent 55%),
    var(--svx-forest-deep);
  color: #e9efe7;
}

.page--sales-valuation .svx-contact h2 { color: #f2f4ec; }

.page--sales-valuation .svx-contact__copy p {
  max-width: 54ch;
  margin: 1rem 0 1.5rem;
  color: #c3d0c6;
  font-size: 1.02rem;
  line-height: 1.68;
}

.page--sales-valuation .svx-contact__routes {
  display: grid;
  gap: 0.8rem;
  align-self: center;
}

.page--sales-valuation .svx-contact__routes a {
  display: grid;
  min-height: 64px;
  grid-template-columns: 1fr auto;
  gap: 1rem;
  align-items: center;
  padding: 0.7rem 1.2rem;
  border-radius: 12px;
  background: rgba(242, 239, 230, 0.08);
  color: #edf2ea;
  text-decoration: none;
  transition: background 150ms ease;
}

@media (hover: hover) and (pointer: fine) {
  .page--sales-valuation .svx-contact__routes a:hover { background: rgba(242, 239, 230, 0.16); }
}
.page--sales-valuation .svx-contact__routes span { font-size: 0.875rem; color: #b9c8bc; }
.page--sales-valuation .svx-contact__routes strong { font-size: 0.92rem; text-align: right; }

.page--sales-valuation .svx-contact__routes a:focus-visible {
  outline: 3px solid var(--svx-focus);
  outline-offset: 3px;
}

/* --------------------------------------------------------------------------
   Tools band on stone, kept before the forest close so the page ends on
   the booking panel. Three cream cards; thumbs ramp parchment → cream →
   clay-tint, each a named crown placeholder.
   ----------------------------------------------------------------------- */

.page--sales-valuation .svx-close {
  margin: 0 0 clamp(4rem, 7vw, 7rem);
  padding: clamp(1.8rem, 3.5vw, 3rem);
  border: 1px solid rgba(38, 32, 25, 0.12);
  border-radius: 16px 16px 44px 16px;
  background: var(--svx-stone);
}

.page--sales-valuation .svx-close > .svx-kicker { margin: 0 0 1.4rem; }

.page--sales-valuation .svx-next {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.75rem);
  margin: 0;
}

.page--sales-valuation .svx-next a {
  display: grid;
  gap: 0.5rem;
  align-content: start;
  padding: clamp(1.2rem, 2vw, 1.6rem);
  border: var(--svx-plate-line);
  border-radius: 14px 14px 28px 14px;
  background: var(--svx-cream);
  box-shadow: var(--svx-plate-shadow);
  color: var(--svx-ink);
  text-decoration: none;
  transition: box-shadow 180ms ease, transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

@media (hover: hover) and (pointer: fine) {
  .page--sales-valuation .svx-next a:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px -12px rgba(43, 33, 26, 0.45);
  }
}

.page--sales-valuation .svx-next a:hover em span { transform: translateX(4px); }

.page--sales-valuation .svx-next em span {
  display: inline-block;
  transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

@media (prefers-reduced-motion: reduce) {
  .page--sales-valuation .svx-next em span,
  .page--sales-valuation .svx-next a:hover em span { transform: none; transition: none; }
}

@media (prefers-reduced-motion: reduce) {
  .page--sales-valuation .svx-next a,
  .page--sales-valuation .svx-next a:hover { transform: none; transition: box-shadow 180ms ease; }
}

.page--sales-valuation .svx-next a:focus-visible {
  outline: 3px solid var(--svx-focus);
  outline-offset: 3px;
}

.page--sales-valuation .svx-next__thumb {
  height: 7.5rem;
  margin-bottom: 0.5rem;
}

.page--sales-valuation .svx-next a:nth-child(1) .svx-next__thumb {
  background: linear-gradient(150deg, rgba(138, 100, 35, 0.16), rgba(138, 100, 35, 0)), var(--svx-parchment);
}

.page--sales-valuation .svx-next a:nth-child(2) .svx-next__thumb {
  background: linear-gradient(150deg, rgba(160, 74, 48, 0.12), rgba(160, 74, 48, 0)), var(--svx-cream);
}

.page--sales-valuation .svx-next strong {
  font-family: "Gloock", Georgia, serif;
  font-size: clamp(1.1rem, 1.55vw, 1.4rem);
  font-weight: 400;
}

.page--sales-valuation .svx-next span:not(.svx-next__thumb) {
  max-width: 34ch;
  color: var(--svx-ink-soft);
  font-size: 1rem;
  line-height: 1.6;
}

.page--sales-valuation .svx-next em {
  color: var(--svx-clay-deep);
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 800;
}

.page--sales-valuation .svx-notes {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1.1rem;
  align-items: center;
  margin: clamp(1rem, 2vw, 1.75rem) 0 0;
  padding: 1.1rem 1.3rem;
  border: var(--svx-plate-line);
  border-left: 3px solid var(--svx-brass);
  border-radius: 10px;
  background: var(--svx-cream);
}

/* The crown stamp on the honesty note — the one brand mark allowed to
   repeat outside the shared shell. */
.page--sales-valuation .svx-notes__stamp img {
  display: block;
  width: 44px;
  height: auto;
  opacity: 0.75;
}

.page--sales-valuation .svx-notes p {
  max-width: 100ch;
  margin: 0;
  color: var(--svx-ink-soft);
  font-size: 0.875rem;
  line-height: 1.62;
}

/* Footer belongs to the same ground/forest world on this route. */
.page--sales-valuation .site-foot { border-top: 1px solid rgba(24, 32, 28, 0.14); background: #e9e3d7; }
.page--sales-valuation .legalstrip { background: var(--svx-forest-deep); }

/* --------------------------------------------------------------------------
   Tablet.
   ----------------------------------------------------------------------- */

@media (max-width: 68em) {
  .page--sales-valuation .svx-hero { grid-template-columns: 1fr; min-height: 0; }
  .page--sales-valuation .svx-hero__stage { min-height: 20rem; }
  .page--sales-valuation .svx-mark__band { grid-template-columns: 1fr; gap: 1rem; }
  .page--sales-valuation .svx-mark__item { grid-template-rows: none; grid-template-columns: minmax(0, 9rem) minmax(0, 1fr); }
  .page--sales-valuation .svx-mark__slot { border-bottom: 0; border-right: var(--svx-plate-line); }
  .page--sales-valuation .svx-mark__copy { padding: 1rem 1.15rem 1.2rem; }
  .page--sales-valuation .svx-evidence__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page--sales-valuation .svx-visit__body { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); }
  .page--sales-valuation .svx-visit__head { grid-template-columns: 1fr; align-items: start; gap: 1rem; }
  .page--sales-valuation .svx-proof { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   Mobile.
   ----------------------------------------------------------------------- */

@media (max-width: 47.9em) {
  .page--sales-valuation .svx-hero {
    width: calc(100vw - 1.25rem);
    padding: 1.6rem 1.2rem 2.4rem;
    border-radius: 14px 14px 44px 14px;
    margin-bottom: 4rem;
  }

  .page--sales-valuation .svx-hero h1 { font-size: clamp(2.4rem, 11vw, 3rem); }
  .page--sales-valuation .svx-hero__actions { align-items: stretch; flex-direction: column; }
  .page--sales-valuation .svx-hero__actions .svx-button { width: 100%; }
  .page--sales-valuation .svx-hero__stage { min-height: 15rem; }

  .page--sales-valuation .svx-mark { width: calc(100vw - 2.5rem); margin-bottom: 4rem; padding: 1.4rem 1.1rem 1.6rem; border-radius: 12px 12px 36px 12px; }
  .page--sales-valuation .svx-mark__band { gap: 0.9rem; }
  .page--sales-valuation .svx-mark__item { grid-template-rows: none; grid-template-columns: minmax(0, 7.5rem) minmax(0, 1fr); }
  .page--sales-valuation .svx-mark__slot { border-bottom: 0; border-right: var(--svx-plate-line); }
  .page--sales-valuation .svx-mark__copy { padding: 1rem 1.1rem 1.2rem; }

  .page--sales-valuation .svx-human { grid-template-columns: 1fr; width: calc(100vw - 2.5rem); margin-bottom: 4rem; padding: 1.4rem 1.1rem 1.6rem; border-radius: 12px 12px 36px 12px; }
  .page--sales-valuation .svx-human__media { min-height: 15rem; }

  .page--sales-valuation .svx-shell { width: calc(100vw - 2.5rem); }

  .page--sales-valuation .svx-head { grid-template-columns: 1fr; gap: 0.9rem; align-items: start; }

  .page--sales-valuation .svx-priority { padding: 1.4rem 1.1rem 1.6rem; border-radius: 12px 12px 36px 12px; }
  .page--sales-valuation .svx-priority__choice { width: 100%; }
  .page--sales-valuation .svx-priority__results { min-height: 0; }

  .page--sales-valuation .svx-takeaways { padding: 1.4rem 1.1rem 1.6rem; border-radius: 12px 12px 36px 12px; }
  .page--sales-valuation .svx-story { display: block; }
  .page--sales-valuation .svx-story__media { min-height: 13rem; }
  .page--sales-valuation .svx-story__card { position: relative; margin: -2.2rem 0.8rem 0; padding: 1.2rem 1.1rem 1.5rem; }

  .page--sales-valuation .svx-evidence { padding: 1.6rem 1.2rem 1.8rem; border-radius: 12px 12px 36px 12px; }
  .page--sales-valuation .svx-evidence__grid { grid-template-columns: 1fr; }
  .page--sales-valuation .svx-evidence__grid > div:nth-child(1),
  .page--sales-valuation .svx-evidence__grid > div:nth-child(6) { grid-column: auto; }
  .page--sales-valuation .svx-evidence__note { grid-template-columns: 1fr; gap: 0.8rem; }

  .page--sales-valuation .svx-visit { padding: 1.6rem 1.2rem 1.8rem; border-radius: 12px 12px 36px 12px; }
  .page--sales-valuation .svx-visit__body { grid-template-columns: 1fr; }
  .page--sales-valuation .svx-visit__slot { align-self: stretch; }
  .page--sales-valuation .svx-visit .svx-button { width: 100%; }

  .page--sales-valuation .svx-questions { padding: 1.4rem 1.1rem 1.6rem; border-radius: 12px 12px 36px 12px; }
  .page--sales-valuation .svx-questions__list { grid-template-columns: 1fr; }
  .page--sales-valuation .svx-question summary { grid-template-columns: 2rem 1fr 1.6rem; min-height: 60px; padding: 0.6rem 1rem; }
  .page--sales-valuation .svx-question__answer { padding: 0 1rem 1.2rem 3rem; }

  .page--sales-valuation .svx-proof { padding: 1.6rem 1.2rem 1.8rem; border-radius: 12px 12px 36px 12px; }

  .page--sales-valuation .svx-contact { grid-template-columns: 1fr; padding: 1.6rem 1.2rem; border-radius: 12px 12px 36px 12px; }
  .page--sales-valuation .svx-contact .svx-button { width: 100%; }

  .page--sales-valuation .svx-next { grid-template-columns: 1fr; }
  .page--sales-valuation .svx-close { padding: 1.1rem 1rem 1.3rem; border-radius: 12px 12px 32px 12px; }
  .page--sales-valuation .svx-priority__results { grid-template-columns: 1fr; }
  .page--sales-valuation .svx-priority__slot { min-height: 10rem; }
  .page--sales-valuation .svx-proof__slot { aspect-ratio: 16 / 10; }
  .page--sales-valuation .svx-nav { margin-left: 0.75rem; }
}

/* ==========================================================================
   Segment-group control (21st.dev conversion, vanilla): one clay-tint
   track, equal segments, and a cream indicator pill that slides behind
   the active choice (JS-measured; without JavaScript .is-active paints
   the same pill in place, so nothing depends on the script).
   ========================================================================== */

.page--sales-valuation .svx-priority__choices {
  position: relative;
  display: flex;
  flex-wrap: nowrap;
  gap: 2px;
  width: min(100%, 56rem);
  margin-top: 1rem;
  padding: 4px;
  border-radius: 12px;
  background: var(--svx-clay-tint);
}

.page--sales-valuation .svx-priority__indicator {
  position: absolute;
  top: 4px;
  left: 0;
  height: calc(100% - 8px);
  border-radius: 9px;
  background: var(--svx-cream);
  box-shadow: 0 1px 3px rgba(43, 33, 26, 0.2);
  transition: transform 200ms ease, width 200ms ease;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .page--sales-valuation .svx-priority__indicator { transition: none; }
}

.page--sales-valuation .svx-priority__choice {
  position: relative;
  z-index: 1;
  flex: 1 1 0;
  justify-content: center;
  min-height: 48px;
  padding: 0.65rem 1rem;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--svx-ink-soft);
  transition: color 200ms ease;
}

@media (hover: hover) and (pointer: fine) {
  .page--sales-valuation .svx-priority__choice:hover {
    border-color: transparent;
    background: transparent;
    color: var(--svx-ink);
  }
}

.page--sales-valuation .svx-priority__choice.is-active {
  border-color: transparent;
  background: var(--svx-cream);
  box-shadow: 0 1px 3px rgba(43, 33, 26, 0.2);
  color: var(--svx-ink);
}

/* once the JS indicator exists it paints the pill; the item goes quiet so
   the pill is never doubled */
.page--sales-valuation [data-svx-has-indicator] .svx-priority__choice.is-active {
  background: transparent;
  box-shadow: none;
}

.page--sales-valuation .svx-priority__choice.is-active .svx-priority__n { color: var(--svx-clay); }

.page--sales-valuation .svx-priority__choice:focus-visible {
  outline: 3px solid var(--svx-focus);
  outline-offset: -3px;
}

@media (max-width: 760px) {
  .page--sales-valuation .svx-priority__choices { flex-direction: column; gap: 4px; }
  .page--sales-valuation .svx-priority__indicator { display: none; }
  .page--sales-valuation [data-svx-has-indicator] .svx-priority__choice.is-active {
    background: var(--svx-cream);
    box-shadow: 0 1px 3px rgba(43, 33, 26, 0.2);
  }
  .page--sales-valuation .svx-priority__choice { justify-content: flex-start; }
}

/* --------------------------------------------------------------------------
   Round-5 target sizes: standalone text actions meet 48px without
   changing the reading flow (prose links inside sentences are exempt).
   ----------------------------------------------------------------------- */

.page--sales-valuation .svx-priority__result a {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
}