/* Proofline Mediation: "Clear terms". Teal means settled, amber means open; nothing else wears them. */
:root {
  --paper: #ffffff;
  --panel: #f4f4f0;
  --panel-2: #e9e9e3;
  --ink: #15181e;
  --ink-2: #262b33;
  --graphite: #555b65;
  --rule: #d6d7d1;
  --rule-soft: #e8e8e3;
  --settled: #0b7a70;
  --settled-mark: #0e8f82;
  --settled-wash: #e4f3f0;
  --open: #8a5300;
  --open-mark: #c07f00;
  --open-wash: #fbf0d9;
  --open-bar: repeating-linear-gradient(180deg, var(--open-mark) 0 5px, transparent 5px 8px) 0 0 / 3px 100% no-repeat;
  --settled-lt: #5ccfc0;
  --display: "Source Serif 4", Charter, "Bitstream Charter", "Sitka Banner", "Iowan Old Style", Cambria, Georgia, serif;
  --serif: "Source Serif 4", Charter, "Bitstream Charter", "Sitka Text", "Iowan Old Style", Cambria, Georgia, serif;
  --sans: "Inter", "Segoe UI", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", "Cascadia Mono", Consolas, monospace;
  --ease: cubic-bezier(.2, .7, .2, 1);
  --gut: clamp(20px, 4vw, 56px);
  --max: 1240px;
  --gap: clamp(48px, 6vw, 96px);
  --rail: 50%;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font: 400 1.0625rem/1.6 var(--sans);
  font-kerning: normal;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, p, ol, ul, dl, dd, figure, fieldset, blockquote { margin: 0; }
p, dd, li { text-wrap: pretty; }
ol, ul { padding: 0; list-style: none; }
img, svg { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }
::selection { background: var(--ink); color: #fff; }

a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .22em; text-decoration-color: #9a9fa6; transition: text-decoration-color .2s, text-decoration-thickness .2s; }
a:hover { text-decoration-color: currentColor; text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; border-radius: 2px; }

.vh { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: 12px; top: -80px; z-index: 60; padding: 10px 14px; background: var(--ink); color: #fff; text-decoration: none; font-weight: 600; }
.skip:focus { top: 12px; }

.eyebrow { font: 600 .75rem/1.4 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--graphite); }
.doc__head, .stmt__head, .cmp__table thead .cmp__corner, .grid .grid__corner, .facts dt, .hours__cap { font: 600 .72rem/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--graphite); }

/* header */
.top { position: sticky; top: 0; z-index: 40; background: rgba(255, 255, 255, .94); border-bottom: 1px solid var(--rule); backdrop-filter: saturate(1.2) blur(10px); }
.top__in { max-width: var(--max); margin: 0 auto; padding: 12px var(--gut); display: flex; align-items: center; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 11px; text-decoration: none; flex: none; }
.brand__mark { width: 34px; height: 34px; }
.brand__mark path { fill: none; stroke-linecap: round; }
.brand__axis { stroke: var(--ink); stroke-width: 1.6; }
.brand__a, .brand__b { stroke: var(--ink); stroke-width: 3.4; }
.brand__c { stroke: var(--settled-mark); stroke-width: 3.4; }
.brand__word { font: 400 1.45rem/1 var(--display); letter-spacing: -.01em; }
.brand__word span { display: block; margin-top: 3px; font: 600 .62rem/1 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: var(--graphite); }
.nav { margin-left: auto; }
.nav ul { display: flex; gap: 4px; }
.nav a { display: block; padding: 8px 10px; font-size: .9rem; text-decoration: none; color: var(--ink-2); background: linear-gradient(var(--ink), var(--ink)) 10px calc(100% - 4px) / 0 1px no-repeat; transition: background-size .3s var(--ease); }
.nav a:hover { background-size: calc(100% - 20px) 1px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .6em; min-height: 48px; padding: .7em 1.25em; border: 1px solid var(--ink); border-radius: 3px; font: 600 .95rem/1.2 var(--sans); letter-spacing: .005em; text-decoration: none; cursor: pointer; transition: background-color .2s, color .2s, transform .2s var(--ease); }
.btn--ink { background: var(--ink); color: #fff; }
.btn--ink::after { content: "\2192"; display: inline-block; transition: transform .25s var(--ease); }
.btn--ink:hover { background: #000; }
.btn--ink:hover::after { transform: translateX(4px); }
.btn--line { background: var(--paper); color: var(--ink); }
.btn--line:hover { background: var(--panel); }
.top__cta { min-height: 42px; padding: .55em 1em; font-size: .88rem; }

/* the axis: every section hangs off one center line */
.hero, .sec { position: relative; background: linear-gradient(var(--rule), var(--rule)) var(--rail) 0 / 1px 100% no-repeat; }
.sec { padding: clamp(64px, 8vw, 116px) var(--gut) 0; }
.sec > * { max-width: var(--max); margin-left: auto; margin-right: auto; }

.sec__head { display: grid; grid-template-columns: 1fr var(--gap) 1fr; align-items: start; margin-bottom: clamp(48px, 6vw, 88px); }
.sec__no { grid-column: 2; grid-row: 1; justify-self: center; display: grid; place-items: center; width: 46px; height: 46px; margin-top: .35rem; border: 1px solid var(--ink); border-radius: 50%; background: var(--paper); font: 400 1rem/1 var(--serif); font-variant-numeric: lining-nums tabular-nums; }
.sec__title { grid-column: 1; grid-row: 1; justify-self: end; max-width: 15em; text-align: right; font: 400 clamp(2.05rem, 1.25rem + 2.4vw, 3.5rem)/1.06 var(--display); letter-spacing: -.018em; text-wrap: balance; }
.sec__intro { grid-column: 3; grid-row: 1; max-width: 30rem; padding-top: .6rem; font-size: 1.12rem; line-height: 1.6; color: var(--ink-2); text-wrap: pretty; }

.fn { display: inline-block; min-width: 1.45em; margin-left: .25em; padding: 0 .32em; border: 1px solid var(--rule); border-radius: 3px; background: var(--paper); color: var(--graphite); font: 600 .66rem/1.55 var(--sans); font-variant-numeric: tabular-nums; text-align: center; text-decoration: none; vertical-align: .5em; transition: border-color .2s, color .2s; }
.fn:hover { border-color: var(--ink); color: var(--ink); }
.fn--dark { border-color: rgba(255, 255, 255, .3); background: transparent; color: #c9cdd3; }
.fn--dark:hover { border-color: #fff; color: #fff; }

/* semantic tags: solid bar = settled, dashed bar = open */
.cl__tag { display: inline-flex; align-items: center; gap: 6px; font: 700 .66rem/1 var(--sans); letter-spacing: .13em; text-transform: uppercase; }
.cl__tag::before { content: ""; width: 14px; height: 3px; background: currentColor; }
.is-settled .cl__tag { color: var(--settled); }
.is-open .cl__tag { color: var(--open); }
.is-open .cl__tag::before { background: repeating-linear-gradient(90deg, currentColor 0 4px, transparent 4px 6.5px); }
.t-settled { color: var(--settled); font-weight: 600; box-shadow: inset 0 -2px var(--settled-mark); }
.t-open { color: var(--open); font-weight: 600; background: repeating-linear-gradient(90deg, var(--open-mark) 0 4px, transparent 4px 7px) 0 100% / 100% 2px no-repeat; }

/* hero */
.hero { display: grid; grid-template-columns: minmax(0, 1fr) var(--gap) minmax(0, 1fr); max-width: calc(var(--max) + 2 * var(--gut)); margin: 0 auto; padding: clamp(40px, 5vw, 72px) var(--gut) 24px; background-size: 1px calc(100% - 20px); background-position: var(--rail) 20px; }
.hero__text { grid-column: 1; align-self: start; padding-top: clamp(8px, 2vw, 36px); }
.hero__eyebrow span { margin: 0 .35em; color: var(--rule); }
.hero__title { margin: 22px 0 28px; font: 400 clamp(3rem, 1.5rem + 4.4vw, 5.25rem)/.98 var(--display); letter-spacing: -.028em; }
.hero__line { display: block; }
.hero__line--b { margin-top: .1em; }
.hero__title em { font-style: italic; letter-spacing: -.02em; }
.mark { padding-bottom: .02em; background-repeat: no-repeat; background-position: 0 88%; background-size: 100% .075em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.mark--settled { background-image: linear-gradient(var(--settled-mark), var(--settled-mark)); }
.mark--open { background-image: repeating-linear-gradient(90deg, var(--open-mark) 0 .2em, transparent .2em .32em); }
.hero__lede { max-width: 31rem; font-size: 1.16rem; line-height: 1.6; color: var(--ink-2); text-wrap: pretty; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 30px 0 38px; }
.key { padding-top: 16px; border-top: 1px solid var(--rule); font-size: .86rem; color: var(--graphite); }
.key__label { margin-bottom: 10px; font: italic 400 .98rem/1.3 var(--serif); color: var(--ink); }
.key__list { display: flex; flex-wrap: wrap; gap: 10px 22px; }
.key__row { display: flex; align-items: center; gap: 9px; }
.key dd { margin: 0; }
.chip-s { display: inline-flex; align-items: center; min-height: 24px; padding: 2px 9px 2px 8px; font: 700 .66rem/1 var(--sans); letter-spacing: .13em; text-transform: uppercase; }
.chip-s--settled { background: var(--settled-wash); color: var(--settled); box-shadow: inset 3px 0 var(--settled-mark); }
.chip-s--open { background: var(--open-wash) repeating-linear-gradient(180deg, var(--open-mark) 0 4px, transparent 4px 7px) 0 0 / 3px 100% no-repeat; color: var(--open); }
.chip-s--src { min-width: 24px; justify-content: center; padding: 2px 6px; border: 1px solid var(--rule); border-radius: 3px; color: var(--graphite); letter-spacing: 0; }

.plan { grid-column: 3; margin: 0; }
.plan__svg { width: 100%; max-width: 560px; height: auto; padding: 14px 14px 10px; border: 1px solid var(--rule); background: var(--paper); box-shadow: 0 1px 0 var(--rule-soft), 0 22px 44px -30px rgba(21, 24, 30, .4); }
.nw { white-space: nowrap; }
.pl-road { fill: var(--panel); }
.pl-kerb { fill: none; stroke: var(--rule); stroke-width: 1; }
.pl-street { font: 700 11px var(--sans); letter-spacing: .32em; fill: var(--graphite); }
.pl-floorline { fill: none; stroke: #ededE8; stroke-width: 1; }
.pl-wall, .pl-back, .pl-dot, .pl-scale-a { fill: var(--ink); }
.pl-gap { fill: var(--paper); }
.pl-thin { fill: none; stroke: var(--ink); stroke-width: 1; }
.pl-line { fill: none; stroke: var(--ink); stroke-width: 2.4; stroke-linecap: square; }
.pl-swing { fill: none; stroke: var(--graphite); stroke-width: 1; stroke-dasharray: 3 4; }
.pl-furn { fill: var(--panel); stroke: var(--ink); stroke-width: 1.4; }
.pl-table { fill: var(--paper); stroke: var(--ink); stroke-width: 2.2; }
.pl-seat { fill: var(--paper); stroke: var(--ink); stroke-width: 1.6; }
.pl-sheet { fill: var(--paper); stroke: var(--ink); stroke-width: 1.2; }
.pl-obj { fill: var(--paper); stroke: var(--ink); stroke-width: 1.3; }
.pl-agreed { fill: none; stroke: var(--settled-mark); stroke-width: 2.8; stroke-linecap: round; }
.pl-open { fill: none; stroke: var(--open-mark); stroke-width: 2.8; stroke-dasharray: 3.5 2.5; }
.pl-faint { fill: none; stroke: var(--rule); stroke-width: 2.8; stroke-linecap: round; }
.pl-pencil { fill: none; stroke: var(--ink); stroke-width: 3.6; stroke-linecap: round; }
.pl-leaves path { fill: var(--panel-2); stroke: var(--ink); stroke-width: 1; }
.pl-seat-open { fill: none; stroke: var(--open-mark); stroke-width: 1.8; stroke-dasharray: 4 3; }
.pl-axis { fill: none; stroke: var(--ink); stroke-width: 1; stroke-dasharray: 18 5 3 5; }
.pl-dim { font: 500 12px var(--sans); fill: var(--ink); text-anchor: middle; }
.pl-label { font: 600 12px var(--sans); fill: var(--ink); text-anchor: middle; }
.pl-small { font: 500 10.5px var(--sans); letter-spacing: .05em; fill: var(--graphite); }
.pl-scale-b, .pl-block { fill: var(--paper); stroke: var(--ink); stroke-width: 1; }
.pl-title { font: 700 11px var(--sans); letter-spacing: .14em; fill: var(--ink); }
.pl-mark circle { fill: var(--ink); }
.pl-mark text { font: 700 13px var(--sans); fill: #fff; text-anchor: middle; }
.pl-mark .pl-ring { fill: none; stroke: var(--ink); stroke-width: 1.6; opacity: 0; transform-box: fill-box; transform-origin: center; transform: scale(.55); transition: opacity .3s, transform .45s var(--ease); }
.pl-mark--open circle { fill: var(--paper); stroke: var(--open-mark); stroke-width: 2; stroke-dasharray: 3.5 2.5; }
.pl-mark--open text { fill: var(--open); }
.pl-mark--open .pl-ring { stroke: var(--open-mark); stroke-dasharray: none; }
.pl-mark > * { transition: opacity .3s; }
.plan.has-lit .pl-mark:not(.is-lit) > * { opacity: .25; }
.pl-mark.is-lit .pl-ring { opacity: 1; transform: none; }

.plan__key { margin-top: 14px; }
.plan__cap { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; margin-bottom: 10px; font-size: .85rem; color: var(--graphite); }
.plan__list { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--rule); }
.pk { display: flex; align-items: flex-start; gap: 10px; width: 100%; min-height: 44px; padding: 10px 8px 10px 0; border: 0; border-bottom: 1px solid var(--rule-soft); background: none; font-size: .84rem; line-height: 1.4; text-align: left; color: var(--ink-2); cursor: pointer; transition: background-color .2s; }
.plan__list li:nth-child(odd) .pk { padding-right: 14px; }
.plan__list li:nth-child(even) .pk { padding-left: 14px; border-left: 1px solid var(--rule-soft); }
.pk strong { color: var(--ink); font-weight: 600; }
.pk__n { flex: none; display: grid; place-items: center; width: 22px; height: 22px; margin-top: -1px; border-radius: 50%; background: var(--ink); color: #fff; font: 700 .72rem/1 var(--sans); transition: box-shadow .25s; }
.pk--open .pk__n { background: var(--paper); color: var(--open); box-shadow: inset 0 0 0 1.5px var(--open-mark); }
.pk:hover { background: var(--panel); }
.pk[aria-pressed="true"] { background: var(--panel); }
.pk[aria-pressed="true"] .pk__n { box-shadow: 0 0 0 3px var(--paper), 0 0 0 4.5px var(--ink); }
.pk--open[aria-pressed="true"] .pk__n { box-shadow: inset 0 0 0 1.5px var(--open-mark), 0 0 0 3px var(--paper), 0 0 0 4.5px var(--open-mark); }

/* 01 disputes */
.case { display: grid; grid-template-columns: minmax(0, 1fr) var(--gap) minmax(0, 1fr); align-items: center; padding: clamp(36px, 4vw, 56px) 0; border-top: 1px solid var(--rule-soft); }
.case:first-of-type { border-top: 0; padding-top: 0; }
.case__about { grid-column: 1; display: grid; justify-items: end; text-align: right; }
.case__about p { max-width: 27rem; color: var(--ink-2); }
.vig { width: 100%; max-width: 340px; height: auto; margin-bottom: 22px; }
.case__title { margin-bottom: 8px; font: 400 clamp(1.6rem, 1.2rem + 1vw, 2.1rem)/1.1 var(--display); letter-spacing: -.01em; }
.case__about .case__not { margin-top: 10px; font-size: .9rem; color: var(--graphite); }
.case__not strong { color: var(--ink); font-weight: 600; }
.doc { grid-column: 3; max-width: 34rem; padding: 26px 28px 12px; border: 1px solid var(--rule); background: var(--paper); box-shadow: 0 1px 0 var(--rule-soft), 0 18px 40px -26px rgba(21, 24, 30, .35); }
.doc__head, .stmt__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 16px; padding-bottom: 13px; border-bottom: 2px solid var(--ink); }
.doc__head span:first-child, .stmt__head span:first-child { color: var(--ink); }
.clauses { counter-reset: cl; }
.cl { counter-increment: cl; position: relative; display: grid; grid-template-columns: 2rem 1fr; column-gap: 4px; padding: 16px 12px 16px 0; border-bottom: 1px solid var(--rule-soft); }
.cl:last-child { border-bottom: 0; }
.cl::before { content: counter(cl) "."; grid-row: 1 / span 3; padding-top: 1.35rem; font: 400 1.05rem/1 var(--serif); font-variant-numeric: oldstyle-nums; color: var(--graphite); }
.cl .cl__tag { margin-bottom: 7px; }
.cl p { grid-column: 2; font-size: 1rem; line-height: 1.5; }
.cl.is-settled p:not(.cl__next) { box-shadow: inset 3px 0 var(--settled-mark); padding-left: 12px; }
.cl.is-open p:not(.cl__next) { padding-left: 12px; background: var(--open-bar); }
.cl p.cl__next { margin-top: 8px; padding: 7px 10px; background: var(--settled-wash); color: var(--settled); font-size: .88rem; }
.cl.is-open { background: linear-gradient(90deg, var(--open-wash), rgba(251, 240, 217, 0) 85%); margin: 0 -28px 0 -28px; padding-left: 28px; padding-right: 28px; }

.v-wall, .v-house { fill: var(--ink); }
.v-gap { fill: var(--paper); }
.v-thin { fill: none; stroke: var(--ink); stroke-width: 1; }
.v-furn { fill: var(--panel); stroke: var(--ink); stroke-width: 1.2; }
.v-damp { fill: var(--open-wash); stroke: var(--open-mark); stroke-width: 1.3; stroke-dasharray: 3 2; }
.v-carpet { fill: var(--settled-wash); stroke: var(--settled-mark); stroke-width: 1.2; }
.v-label { font: 600 9.5px var(--sans); letter-spacing: .06em; fill: var(--graphite); }
.v-inv { font: 600 11px var(--sans); fill: #fff; text-anchor: middle; }
.v-fence { fill: none; stroke: var(--ink); stroke-width: 1.2; }
.v-hedge circle { fill: var(--paper); stroke: var(--ink); stroke-width: 1.1; }
.v-bound { fill: none; stroke: var(--open-mark); stroke-width: 2; stroke-dasharray: 5 4; }
.v-shed { fill: var(--paper); stroke: var(--ink); stroke-width: 1.4; }
.v-dot { fill: #c9cbc3; }
.v-shelf { fill: var(--settled-wash); stroke: var(--settled-mark); stroke-width: 1.6; }
.v-pavers rect { fill: var(--paper); stroke: var(--ink); stroke-width: .9; }
.v-sheet { fill: var(--paper); stroke: var(--ink); stroke-width: 1; }
.v-van { fill: none; stroke: var(--open-mark); stroke-width: 1.6; stroke-dasharray: 4 3; }
.v-m text { font: 700 10px var(--sans); text-anchor: middle; fill: #fff; }
.v-m--settled circle { fill: var(--settled); }
.v-m--open circle { fill: var(--paper); stroke: var(--open-mark); stroke-width: 1.8; stroke-dasharray: 3 2; }
.v-m--open text { fill: var(--open); }

/* 02 how it works */
.steps { counter-reset: step; }
.step { display: grid; grid-template-columns: minmax(0, 1fr) var(--gap) minmax(0, 1fr); row-gap: 10px; padding-bottom: clamp(36px, 4vw, 52px); }
.step__mid { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) var(--gap) minmax(0, 1fr); align-items: center; }
.step__n { grid-column: 2; grid-row: 1; justify-self: center; display: grid; place-items: center; width: 50px; height: 50px; border-radius: 50%; background: var(--ink); color: #fff; font: 400 1.3rem/1 var(--serif); font-variant-numeric: lining-nums; box-shadow: 0 0 0 8px var(--paper); }
.step__title { grid-column: 1; grid-row: 1; justify-self: end; text-align: right; font: 400 clamp(1.55rem, 1.2rem + 1vw, 2.15rem)/1.15 var(--display); letter-spacing: -.01em; }
.step__when { grid-column: 3; grid-row: 1; font: 600 .74rem/1.4 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--graphite); }
.step__you { grid-column: 1; justify-self: end; max-width: 26rem; text-align: right; }
.step__we { grid-column: 3; max-width: 26rem; }
.step__who { margin-bottom: 4px; font: italic 400 1.05rem/1.2 var(--serif); color: var(--graphite); }
.step__you p:last-child, .step__we p:last-child { color: var(--ink-2); }
.step:last-child .step__n { background: var(--paper); color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--ink), 0 0 0 8px var(--paper); }

/* 03 compare */
.see { display: none; }
.cmp { position: relative; }
.weigh { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; padding: 6px 0 18px; background: var(--paper); }
.weigh[hidden] { display: none; }
.weigh__label { font: italic 400 1.15rem/1.3 var(--serif); }
.weigh__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.wchip { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 6px 14px 6px 11px; border: 1px solid var(--rule); border-radius: 999px; background: var(--paper); font-size: .88rem; font-weight: 600; cursor: pointer; transition: background-color .2s, border-color .2s, color .2s; }
.wchip::before { content: ""; width: 12px; height: 12px; border: 1.5px solid currentColor; border-radius: 3px; transition: background-color .2s, box-shadow .2s; }
.wchip:hover { border-color: var(--ink); }
.wchip[aria-pressed="true"] { border-color: var(--ink); background: var(--ink); color: #fff; }
.wchip[aria-pressed="true"]::before { background: #fff; box-shadow: inset 0 0 0 2.5px var(--ink); }

.cmp__table { width: 100%; border-collapse: collapse; background: var(--paper); font-size: .95rem; line-height: 1.5; font-variant-numeric: lining-nums; }
.cmp__table thead th { position: sticky; top: 67px; z-index: 2; padding: 16px 16px 14px; border-bottom: 2px solid var(--ink); background: var(--paper); font: 400 1.22rem/1.2 var(--display); text-align: left; vertical-align: bottom; }
.cmp__table thead .cmp__us { box-shadow: inset 0 3px var(--ink); }
.cmp__table tbody th { width: 19%; padding: 16px 18px 18px 0; border-bottom: 1px solid var(--rule); font: 400 1.22rem/1.25 var(--display); text-align: left; vertical-align: top; }
.cmp__table td { width: 27%; padding: 16px 16px 18px 18px; border-bottom: 1px solid var(--rule); vertical-align: top; transition: background-color .25s, color .25s; }
.cmp__table td .cl__tag { display: flex; margin-bottom: 8px; }
.cmp__table td.is-settled { background: linear-gradient(var(--settled-mark), var(--settled-mark)) 0 0 / 3px 100% no-repeat, #f3faf8; }
.cmp__table td.is-open { background: repeating-linear-gradient(180deg, var(--open-mark) 0 6px, transparent 6px 10px) 0 0 / 3px 100% no-repeat, #fdf8ee; }
.cmp__table tbody tr { transition: box-shadow .2s; }
.cmp__table tbody tr:hover > * { box-shadow: inset 0 -2px var(--ink); }
.cmp.has-weight tbody tr:not(.is-weighed) > * { color: var(--graphite); }
.cmp.has-weight tbody tr:not(.is-weighed) td { background: var(--paper); }
.cmp.has-weight tbody tr:not(.is-weighed) .cl__tag { color: var(--graphite); }
.cmp__table tbody tr.is-weighed th { font-style: italic; }
.cmp__table tbody tr.is-weighed th::before { content: ""; display: block; width: 26px; height: 3px; margin-bottom: 10px; background: var(--ink); }
.cmp__table tbody tr.is-weighed > * { box-shadow: inset 0 2px var(--ink), inset 0 -2px var(--ink); }

.shortlist { margin-bottom: 22px; padding: 20px 24px 22px; border: 1px solid var(--ink); background: var(--paper); box-shadow: 8px 8px 0 -1px var(--panel), 8px 8px 0 0 var(--rule); }
.shortlist[hidden] { display: none; }
.shortlist__head { font: italic 400 1.2rem/1.35 var(--serif); }
.shortlist__cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 14px; }
.shortlist__cols:empty { display: none; }
.sl__name { padding-bottom: 8px; margin-bottom: 8px; border-bottom: 1px solid var(--rule); font: 400 1.15rem/1.2 var(--display); }
.sl__row { padding: 6px 0 6px 12px; font-size: .92rem; line-height: 1.4; }
.sl__row.is-settled, .terms li.is-settled { box-shadow: inset 3px 0 var(--settled-mark); }
.sl__row.is-open, .terms li.is-open { background: var(--open-bar); }
.sl__k { display: block; font: 700 .64rem/1.4 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--graphite); }
.sl__row.is-settled .sl__v { color: var(--settled); }
.sl__row.is-open .sl__v { color: var(--open); }

.better { display: grid; grid-template-columns: minmax(0, 1fr) var(--gap) minmax(0, 1fr); margin-top: clamp(40px, 5vw, 64px); }
.better__title { grid-column: 1; grid-row: 1 / span 2; justify-self: end; max-width: 12em; text-align: right; font: italic 400 clamp(1.5rem, 1.2rem + .9vw, 2rem)/1.15 var(--display); }
.better p { grid-column: 3; max-width: 30rem; color: var(--ink-2); }
.better p + p { margin-top: 12px; }

/* 04 fees */
.fee { display: grid; grid-template-columns: minmax(0, 1fr) var(--gap) minmax(0, 1fr); grid-template-rows: auto 1fr; align-items: start; }
.fee__inputs { grid-column: 1; grid-row: 1; justify-self: end; width: 100%; max-width: 36rem; display: grid; grid-template-columns: 1.25fr 1fr; gap: 24px; }
.fee__live { display: none; }
.opt { padding: 0; border: 0; min-width: 0; }
.opt__legend { margin-bottom: 12px; padding: 0; font: italic 400 1.2rem/1.3 var(--serif); }
.opt__item { position: relative; display: flex; align-items: center; gap: 14px; min-height: 52px; padding: 8px 14px; border: 1px solid var(--rule); border-bottom-width: 0; background: var(--paper); cursor: pointer; transition: background-color .2s; }
.opt__item:last-of-type { border-bottom-width: 1px; }
.opt__item input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.opt__item:hover { background: var(--panel); }
.opt__item:has(input:checked) { z-index: 1; background: var(--ink); color: #fff; border-color: var(--ink); }
.opt__item:has(input:focus-visible) { outline: 2px solid var(--ink); outline-offset: 3px; z-index: 2; }
.opt__k { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid currentColor; border-radius: 50%; font: 400 1rem/1 var(--serif); }
.opt__v { font-variant-numeric: lining-nums tabular-nums; }
.opt--type .opt__item::before { content: ""; width: 14px; height: 14px; border: 1.5px solid currentColor; border-radius: 50%; }
.opt--type .opt__item:has(input:checked)::before { background: #fff; box-shadow: inset 0 0 0 3px var(--ink); }

.stmt { grid-column: 3; grid-row: 1 / span 2; position: sticky; top: 96px; max-width: 34rem; padding: 26px 30px 16px; border: 1px solid var(--ink); background: var(--paper); box-shadow: 10px 10px 0 -1px var(--panel), 10px 10px 0 0 var(--rule); }
.stmt__total { display: flex; align-items: flex-start; margin-top: 18px; font: 400 clamp(4.2rem, 3rem + 4vw, 6.6rem)/.9 var(--display); letter-spacing: -.03em; color: var(--settled); font-variant-numeric: lining-nums tabular-nums; }
.stmt__cur { margin: .1em .04em 0 0; font-size: .5em; }
.stmt__total.is-tick [data-out="total"] { animation: tick .45s var(--ease); }
.stmt__sum { margin-top: 10px; font: italic 400 1.1rem/1.4 var(--serif); }
.stmt__working { margin: 14px 0 6px; padding: 10px 12px; background: var(--panel); font: 400 .88rem/1.4 var(--mono); font-variant-numeric: tabular-nums; }
.terms li { display: grid; grid-template-columns: 5.4rem 1fr; align-items: baseline; padding: 9px 0 9px 14px; border-bottom: 1px solid var(--rule-soft); font-size: .92rem; line-height: 1.45; }
.terms li:last-child { border-bottom: 0; }
.terms .cl__tag { display: flex; }

.grid-wrap { grid-column: 1; grid-row: 2; justify-self: end; width: 100%; max-width: 36rem; margin-top: 40px; }
.fold { list-style: none; cursor: pointer; }
.fold::-webkit-details-marker { display: none; }
.fold::after { content: "+"; float: right; font: 400 1.4rem/1 var(--sans); }
[open] > .fold::after { content: "\2212"; }
.grid-wrap > .fold { display: none; padding: 14px 2px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--rule); font: italic 400 1.1rem/1.3 var(--serif); }
.grid-wrap[open] > .fold { margin-bottom: 14px; }
.grid { width: 100%; table-layout: fixed; border-collapse: collapse; background: var(--paper); font-variant-numeric: lining-nums tabular-nums; }
.grid__cap { caption-side: top; margin: 0 0 12px; font: italic 400 1.02rem/1.45 var(--serif); text-align: left; color: var(--ink-2); }
.grid th, .grid td { padding: 12px 12px; border: 1px solid var(--rule); transition: background-color .25s, color .25s, box-shadow .25s; }
.grid thead th { font: 400 1rem/1.2 var(--display); text-align: left; vertical-align: bottom; border-bottom: 2px solid var(--ink); }
.grid thead th span { display: block; margin-top: 3px; font: 600 .7rem/1.3 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--graphite); }
.grid .grid__corner { width: 30%; }
.grid tbody th { text-align: left; font-weight: 400; }
.grid tbody th b { float: left; display: grid; place-items: center; width: 28px; height: 28px; margin: 2px 10px 0 0; border: 1px solid currentColor; border-radius: 50%; font: 400 .95rem/1 var(--serif); }
.grid tbody th span { display: block; font-size: .8rem; line-height: 1.3; color: var(--ink-2); }
.grid tbody th i { display: block; font-style: normal; color: var(--graphite); }
.grid td { font: 400 1.35rem/1 var(--display); font-variant-numeric: lining-nums tabular-nums; text-align: right; }
.grid .is-row, .grid .is-col { background: var(--panel); }
.grid td.is-hit { background: var(--settled-wash); color: var(--settled); box-shadow: inset 0 0 0 2px var(--settled-mark); }
.grid thead th.is-col { box-shadow: inset 0 -4px var(--ink); }
.grid tbody th.is-row { box-shadow: inset 4px 0 var(--ink); }

/* 05 ground rules */
.sec--fees { padding-bottom: clamp(72px, 9vw, 124px); }
.rules { position: relative; padding: clamp(72px, 9vw, 120px) var(--gut); background: linear-gradient(rgba(255, 255, 255, .16), rgba(255, 255, 255, .16)) 50% 0 / 1px 100% no-repeat, var(--ink); color: #eceee9; }
.rules__in { max-width: var(--max); margin: 0 auto; }
.sec__head--dark .sec__no { border-color: rgba(255, 255, 255, .5); background: var(--ink); color: #fff; }
.sec__head--dark .sec__intro { color: #c3c8cf; }
.rules :focus-visible { outline-color: #fff; }
.rules__list { display: grid; grid-template-columns: minmax(0, 1fr) var(--gap) minmax(0, 1fr); grid-auto-flow: column; counter-reset: rule; }
.rules__list li { counter-increment: rule; position: relative; display: grid; align-content: start; grid-template-columns: 1fr auto; column-gap: 22px; padding: 26px 0; border-top: 1px solid rgba(255, 255, 255, .14); }
.rules__list li::before { content: counter(rule); grid-column: 2; grid-row: 1 / span 2; font: 400 2.6rem/.9 var(--display); color: var(--settled-lt); font-variant-numeric: lining-nums; }
.rules__list li:nth-child(-n+4) { grid-column: 1; text-align: right; }
.rules__list li:nth-child(n+5) { grid-column: 3; grid-template-columns: auto 1fr; }
.rules__list li:nth-child(n+5)::before { grid-column: 1; }
.rules__list h3 { font: 400 1.4rem/1.2 var(--display); color: #fff; }
.rules__list p { margin-top: 6px; color: #c3c8cf; }
.rules__list li:nth-child(-n+4) h3, .rules__list li:nth-child(-n+4) p { grid-column: 1; }
.rules__list li:nth-child(n+5) h3, .rules__list li:nth-child(n+5) p { grid-column: 2; }

/* 06 visit */
.visit { display: grid; grid-template-columns: minmax(0, 1fr) var(--gap) minmax(0, 1fr); align-items: start; }
.visit__left { grid-column: 1; justify-self: end; width: 100%; max-width: 560px; }
.map { width: 100%; margin: 0; padding: 10px; border: 1px solid var(--rule); background: var(--paper); }
.map__svg { width: 100%; height: auto; }
.map-p { font: 700 18px var(--sans); fill: var(--ink); text-anchor: middle; }
.map-stop-t { font: 700 10px var(--sans); fill: #fff; text-anchor: middle; }
.map-t { font: 500 11px var(--sans); fill: var(--ink); paint-order: stroke; stroke: var(--paper); stroke-width: 3px; stroke-linejoin: round; }
.map-t--road { font-size: 9.5px; font-weight: 700; letter-spacing: .16em; fill: var(--graphite); stroke: none; }
.map-t--water { font: italic 400 12px var(--serif); fill: #3f4a47; stroke: #e7ecea; }
.map-t--strong { font-weight: 700; }
.map-t--mid { text-anchor: middle; }
.map-t--n { font-weight: 700; text-anchor: middle; }
.visit__facts { grid-column: 3; max-width: 32rem; }
.facts > div { padding: 14px 0; border-top: 1px solid var(--rule); }
.facts > div:first-child { border-top: 2px solid var(--ink); }
.facts dd { margin: 4px 0 0; }
.facts > div:first-child dd { font: 400 1.35rem/1.3 var(--display); }
.hours { width: 100%; margin-top: 18px; border-collapse: collapse; font-variant-numeric: lining-nums tabular-nums; }
.hours__cap { padding-bottom: 8px; text-align: left; }
.hours th, .hours td { padding: 8px 0; border-top: 1px solid var(--rule); font-size: .95rem; text-align: left; vertical-align: top; }
.hours th { font-weight: 400; color: var(--ink-2); }
.hours td { text-align: right; }
.people { margin-top: 26px; padding: 20px 22px; background: var(--panel); }
.people__head { font: italic 400 1.15rem/1.3 var(--serif); }
.people[open] .people__head { margin-bottom: 8px; }
.people p + p { margin-top: 8px; }
.people p:not(.people__head) { font-size: .95rem; color: var(--ink-2); }
.people strong { color: var(--ink); font-weight: 600; }

/* 07 questions */
.faq, .book { position: relative; }
.faq { display: grid; grid-template-columns: minmax(0, 1fr) var(--gap) minmax(0, 1fr); align-items: start; }
.faq__head { grid-column: 1; grid-row: 1; position: sticky; top: 110px; display: grid; justify-items: end; text-align: right; }
.faq__head .sec__title { max-width: 11em; }
.faq__note { max-width: 20rem; margin-top: 18px; color: var(--graphite); }
.faq__list { grid-column: 3; grid-row: 1; max-width: 34rem; border-top: 2px solid var(--ink); }
.qa { border-bottom: 1px solid var(--rule); }
.qa summary { position: relative; display: block; padding: 20px 44px 20px 0; font: 400 1.25rem/1.3 var(--display); cursor: pointer; list-style: none; transition: color .2s; }
.qa summary::-webkit-details-marker { display: none; }
.qa summary::before, .qa summary::after { content: ""; position: absolute; right: 8px; top: 50%; width: 16px; height: 1.5px; background: var(--ink); transition: transform .3s var(--ease); }
.qa summary::after { transform: rotate(90deg); }
.qa[open] summary::after { transform: rotate(0deg); }
.qa summary:hover { color: var(--ink-2); }
.qa p { padding: 0 44px 22px 0; color: var(--ink-2); }

/* 08 book */
.sec--book { padding-bottom: clamp(72px, 9vw, 132px); }
.book { display: grid; grid-template-columns: minmax(0, 1fr) var(--gap) minmax(0, 1fr); align-items: start; }
.book__side { grid-column: 1; grid-row: 1; justify-self: end; display: grid; justify-items: end; max-width: 30rem; text-align: right; }
.book__side > p:not(.sec__no) { margin-top: 18px; color: var(--ink-2); }
.next { counter-reset: nx; margin-top: 24px; border-top: 1px solid var(--rule); }
.next li { counter-increment: nx; padding: 12px 0; border-bottom: 1px solid var(--rule); }
.next li::after { content: counter(nx); display: inline-grid; place-items: center; width: 24px; height: 24px; margin-left: 12px; border: 1px solid var(--ink); border-radius: 50%; font: 400 .85rem/1 var(--serif); vertical-align: 1px; }
.book__direct { font-weight: 600; }
.book__direct span { color: var(--rule); margin: 0 .3em; }
.form { grid-column: 3; grid-row: 1; display: grid; gap: 18px; max-width: 34rem; padding: 28px; border: 1px solid var(--ink); background: var(--paper); }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.field { display: grid; gap: 6px; min-width: 0; }
.field__l { font: 600 .82rem/1.3 var(--sans); color: var(--ink-2); }
.field__l em { font-weight: 400; color: var(--graphite); }
.field input, .field select, .field textarea { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid #9a9fa6; border-radius: 2px; background: var(--paper); font-size: 1rem; transition: border-color .2s, box-shadow .2s; }
.field textarea { resize: vertical; min-height: 92px; }
.field input:hover, .field select:hover, .field textarea:hover { border-color: var(--ink); }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible { outline: none; border-color: var(--ink); box-shadow: 0 0 0 3px var(--paper), 0 0 0 5px var(--ink); }
.field--set { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; border: 0; }
.field--set legend { width: 100%; margin-bottom: 6px; padding: 0; }
.pill { position: relative; }
.pill input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pill span { display: inline-flex; align-items: center; min-height: 40px; padding: 6px 16px; border: 1px solid #9a9fa6; border-radius: 999px; font-size: .92rem; cursor: pointer; transition: background-color .2s, color .2s; }
.pill input:checked + span { border-color: var(--ink); background: var(--ink); color: #fff; }
.pill input:focus-visible + span { outline: 2px solid var(--ink); outline-offset: 3px; }
.form__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; margin-top: 4px; }
.form__note { flex: 1 1 14rem; font-size: .82rem; color: var(--graphite); }

/* sources + footer */
.sources { padding: clamp(48px, 6vw, 72px) var(--gut); border-top: 1px solid var(--rule); background: var(--panel); }
.sources__in { max-width: var(--max); margin: 0 auto; }
.sources__title { font: 600 .78rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ink); }
.sources__list { counter-reset: src; columns: 2 22rem; column-gap: var(--gap); margin-top: 20px; }
.sources__list li { counter-increment: src; position: relative; break-inside: avoid; padding: 0 0 14px 40px; font-size: .9rem; line-height: 1.5; color: var(--ink-2); }
.sources__list li::before { content: counter(src); position: absolute; left: 0; top: .1em; display: grid; place-items: center; min-width: 26px; height: 22px; border: 1px solid #b4b7b0; border-radius: 3px; background: var(--paper); font: 600 .72rem/1 var(--sans); color: var(--ink); }
.sources__list li:target { color: var(--ink); }
.sources__list li:target::before { border-color: var(--ink); background: var(--ink); color: #fff; }
.sources__list cite { font-style: italic; font-family: var(--serif); }
.sources__checked { margin-top: 10px; font: italic 400 .95rem/1.4 var(--serif); color: var(--graphite); }

.foot { padding: 64px var(--gut) 28px; background: var(--ink); color: #c3c8cf; font-size: .95rem; }
.foot a { color: #fff; text-decoration-color: rgba(255, 255, 255, .4); }
.foot :focus-visible { outline-color: #fff; }
.foot__in { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 32px; }
.brand__mark--foot { width: 44px; height: 44px; }
.brand__mark--foot .brand__axis, .brand__mark--foot .brand__a, .brand__mark--foot .brand__b { stroke: #fff; }
.brand__mark--foot .brand__c { stroke: var(--settled-lt); }
.foot__name { margin-top: 14px; font: 400 1.5rem/1.2 var(--display); color: #fff; }
.foot__line { margin-top: 6px; font: italic 400 1rem/1.4 var(--serif); }
.foot__h { margin-bottom: 8px; font: 600 .72rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: #fff; }
.foot__base { max-width: var(--max); margin: 48px auto 0; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .16); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 20px; font-size: .84rem; }

/* motion */
@keyframes rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes underline { from { background-size: 0 .075em; } to { background-size: 100% .075em; } }
@keyframes draw { from { stroke-dasharray: 1; stroke-dashoffset: 1; fill-opacity: 0; } 70% { fill-opacity: 0; } to { stroke-dasharray: 1; stroke-dashoffset: 0; fill-opacity: 1; } }
@keyframes fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes pop { from { opacity: 0; transform: scale(.4); } to { opacity: 1; transform: none; } }
@keyframes tick { from { opacity: .2; transform: translateY(-.12em); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: no-preference) {
  .hero__eyebrow, .hero__line, .hero__lede, .hero__actions, .key { animation: rise .9s var(--ease) both; }
  .hero__line { animation-delay: .08s; }
  .hero__line--b { animation-delay: .2s; }
  .hero__lede { animation-delay: .34s; }
  .hero__actions { animation-delay: .44s; }
  .key { animation-delay: .56s; }
  .mark { animation: underline .9s var(--ease) both; }
  .mark--settled { animation-delay: 1s; }
  .mark--open { animation-delay: 1.5s; }
  .pl-ground, .pl-walls { animation: fade .8s ease both; }
  .pl-draws .d { animation: draw 1.5s var(--ease) both; animation-delay: .3s; }
  .pl-details { animation: fade 1s ease both; animation-delay: 1.1s; }
  .pl-mark { transform-box: fill-box; transform-origin: center; animation: pop .5s var(--ease) both; animation-delay: calc(1.5s + var(--i, 0) * 80ms); }

  [data-reveal], [data-reveal] .sec__title, [data-reveal] .sec__intro, [data-reveal] .sec__no, .case[data-reveal] .case__about, .case[data-reveal] .doc, .step[data-reveal] .step__you, .step[data-reveal] .step__we { transition: opacity .8s var(--ease), transform .9s var(--ease); }
  .js-reveal [data-reveal]:not(.is-in) { opacity: 0; transform: translateY(22px); }
  .js-reveal .sec__head[data-reveal]:not(.is-in), .js-reveal .case[data-reveal]:not(.is-in), .js-reveal .step[data-reveal]:not(.is-in) { opacity: 1; transform: none; }
  .js-reveal .sec__head[data-reveal]:not(.is-in) .sec__title { opacity: 0; transform: translateX(-36px); }
  .js-reveal .sec__head[data-reveal]:not(.is-in) .sec__intro { opacity: 0; transform: translateX(36px); }
  .js-reveal .sec__head[data-reveal]:not(.is-in) .sec__no { opacity: 0; transform: scale(.6); }
  .js-reveal .case[data-reveal]:not(.is-in) .case__about, .js-reveal .step[data-reveal]:not(.is-in) .step__you { opacity: 0; transform: translateX(-32px); }
  .js-reveal .case[data-reveal]:not(.is-in) .doc, .js-reveal .step[data-reveal]:not(.is-in) .step__we { opacity: 0; transform: translateX(32px); }
  .step[data-reveal] .step__we, .case[data-reveal] .doc { transition-delay: .12s; }
}

/* narrower screens: the axis becomes a left rail */
@media (max-width: 1080px) {
  .nav { display: none; }
  .top__cta { margin-left: auto; }
  .fee__inputs { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
  :root { --rail: 20px; --padl: 54px; --gap: 0px; }
  .top { position: relative; }
  .top__in { padding-top: 10px; padding-bottom: 10px; }
  .hero, .sec, .rules { padding-left: var(--padl); padding-right: 20px; }
  .hero { display: block; padding-top: 26px; background-position: var(--rail) 0; background-size: 1px 100%; }
  .hero__title { margin-top: 16px; font-size: clamp(2.05rem, 14.3vw - 12.7px, 4.4rem); }
  .plan { margin-top: 32px; }
  .plan__svg { max-width: 100%; padding: 8px 8px 6px; }
  .sec__head, .case, .step, .step__mid, .better, .fee, .visit, .faq, .book, .rules__list { display: block; }
  .sec__head { position: relative; }
  .sec__no { position: absolute; left: calc(var(--rail) - var(--padl) - 19px); top: -2px; width: 38px; height: 38px; margin: 0; font-size: .9rem; }
  .sec__title, .case__about, .step__you, .better__title, .faq__head, .book__side { text-align: left; justify-self: start; justify-items: start; }
  .sec__title { max-width: none; }
  .sec__intro { margin-top: 14px; padding-top: 0; }
  .case { padding: 28px 0; }
  .case__about { display: block; }
  .vig { max-width: 260px; margin-bottom: 14px; }
  .doc { margin-top: 20px; padding: 16px 16px 4px; }
  .cl.is-open { margin: 0 -16px; padding-left: 16px; padding-right: 16px; }
  .step { position: relative; padding-bottom: 24px; }
  .step__n { position: absolute; left: calc(var(--rail) - var(--padl) - 20px); top: -4px; width: 40px; height: 40px; font-size: 1.05rem; box-shadow: 0 0 0 6px var(--paper); }
  .step__title { text-align: left; justify-self: start; }
  .fee__inputs, .grid-wrap, .visit__left, .map, .faq__list, .form, .stmt, .doc, .vig { justify-self: stretch; }
  .step__when { margin-top: 2px; }
  .step__you, .step__we { max-width: none; margin-top: 8px; }
  .step__you { padding-top: 8px; border-top: 1px solid var(--rule-soft); }
  .step__who { display: inline; margin-right: .4em; }
  .step__who + p { display: inline; }
  .better__title { margin-bottom: 12px; }
  .fee__inputs { max-width: none; grid-template-columns: 1.25fr 1fr; }
  .fee__live { grid-column: 1 / -1; }
  .fee.is-near .fee__live { position: sticky; }
  .fee__live { position: relative; bottom: 12px; z-index: 3; display: flex; align-items: baseline; gap: 10px; margin: 4px 0 0; padding: 10px 16px; background: var(--ink); color: #fff; font-size: .82rem; box-shadow: 0 10px 30px -12px rgba(21, 24, 30, .6); }
  .fee__live b { font: 400 1.6rem/1 var(--display); color: var(--settled-lt); font-variant-numeric: lining-nums tabular-nums; }
  .fee__live span:last-child { margin-left: auto; color: #c3c8cf; }
  .stmt { position: static; margin-top: 28px; max-width: none; padding: 18px 16px 8px; box-shadow: 6px 6px 0 -1px var(--panel), 6px 6px 0 0 var(--rule); }
  .grid-wrap { max-width: none; }
  .rules { background-position: var(--rail) 0, 0 0; }
  .rules__list li:nth-child(n) { display: grid; grid-template-columns: 2.2rem 1fr; column-gap: 12px; padding: 14px 0; text-align: left; }
  .rules__list li:nth-child(n)::before { grid-column: 1; font-size: 2rem; }
  .rules__list li:nth-child(n) h3, .rules__list li:nth-child(n) p { grid-column: 2; }
  .visit__left { max-width: none; }
  .map { padding: 6px; }
  .map-t { font-size: 13.5px; }
  .map-t--water { font-size: 14px; }
  .map-t--road { font-size: 10.5px; }
  .visit__facts { margin-top: 24px; max-width: none; }
  .faq__head { position: static; display: block; margin-bottom: 22px; }
  .faq__list { max-width: none; }
  .faq .sec__no, .book .sec__no { top: 0; }
  .book__side { display: block; max-width: none; }
  .next li::after { content: none; }
  .next li { display: grid; grid-template-columns: 24px 1fr; column-gap: 12px; align-items: start; }
  .next li::before { content: counter(nx); display: grid; place-items: center; width: 24px; height: 24px; margin-top: 1px; border: 1px solid var(--ink); border-radius: 50%; font: 400 .85rem/1 var(--serif); }
  .form { margin-top: 26px; max-width: none; padding: 20px 18px; }
  .foot__in { grid-template-columns: 1fr 1fr; }
  .foot__brand { grid-column: 1 / -1; }
  .cmp__table thead th { top: 0; }
}
@media (max-width: 760px) {
  .cmp__table, .cmp__table thead, .cmp__table tbody, .cmp__table tr, .cmp__table th, .cmp__table td, .cmp__table tbody th { display: block; width: auto; }
  .cmp__table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .cmp__table tbody tr { padding: 12px 0 4px; border-top: 2px solid var(--ink); }
  .cmp__table tbody th { padding: 0 0 6px; border: 0; font-size: 1.18rem; }
  .cmp__table td { position: relative; margin-bottom: 6px; padding: 9px 12px 10px 16px; border: 0; }
  .cmp__table td::before { content: attr(data-label); display: block; margin: 0 5.5rem 4px 0; font: 400 1.02rem/1.25 var(--display); color: var(--ink); }
  .cmp__table td .cl__tag { position: absolute; top: 14px; right: 12px; margin: 0; }
  .cmp__table tbody tr:hover > * { box-shadow: none; }
  .cmp__table tbody tr.is-weighed > * { box-shadow: none; }
  .cmp__table tbody tr.is-weighed { box-shadow: inset 0 3px var(--ink); }
  .cmp__table tbody tr.is-weighed th::before { display: none; }
  .shortlist { padding: 16px 16px 18px; box-shadow: none; }
  .shortlist__cols { grid-template-columns: 1fr; gap: 14px; }
  .grid .grid__corner { width: 26%; }
  .grid th, .grid td { padding: 10px 7px; }
  .grid thead th { font-size: .9rem; }
  .grid thead th span { font-size: .6rem; letter-spacing: .06em; }
  .grid tbody th b { float: none; width: 24px; height: 24px; margin: 0 0 4px; }
  .grid tbody th span { font-size: .72rem; }
  .grid td { font-size: 1.12rem; }
  .form__row { grid-template-columns: 1fr; }
  .grid-wrap > .fold { display: block; }
}
@supports selector(:has(a)) {
@media (max-width: 760px) {
  .see { position: sticky; top: 0; z-index: 3; display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 4px; padding: 10px 0 12px; border: 0; border-bottom: 1px solid var(--rule); background: var(--paper); }
  .see legend { float: left; width: 100%; padding: 0; }
  #disputes .case { display: none; padding: 20px 0 0; border: 0; }
  #disputes:has([value=housing]:checked) [data-case=housing], #disputes:has([value=neighbors]:checked) [data-case=neighbors], #disputes:has([value=business]:checked) [data-case=business],
  .cmp:has([value=Mediation]:checked) [data-label=Mediation], .cmp:has([value=Court]:checked) [data-label=Court], .cmp:has([value=Waiting]:checked) [data-label=Waiting] { display: block; }
  .cmp__table td { display: none; }
  .cmp__table td::before { content: none; }
  .cmp__table td .cl__tag { position: static; margin-bottom: 6px; }
}
}
@media (max-width: 560px) {
  body { font-size: 1rem; line-height: 1.5; }
  .sec { padding-top: 44px; }
  .sec__head { margin-bottom: 22px; }
  .sec__title { font-size: 1.9rem; }
  .sec__intro, .hero__lede { font-size: 1.02rem; line-height: 1.5; }
  .hero__actions { margin: 24px 0 26px; }
  .fee__inputs { grid-template-columns: 1fr; }
  .terms li { display: block; padding: 6px 0 6px 12px; }
  .terms .cl__tag { display: inline-flex; margin-right: 8px; }
  .plan__list { grid-template-columns: 1fr; }
  .plan__list li:nth-child(even) .pk { padding-left: 0; border-left: 0; }
  .key__list { gap: 8px 16px; }
  .cl { padding: 12px 0; }
  .rules { padding-top: 48px; padding-bottom: 48px; }
  .opt__item { min-height: 44px; }
  .pk { padding: 8px 0; font-size: .8rem; }
  .facts > div { padding: 10px 0; }
  .next li { padding: 9px 0; }
  .sources__list li { padding-bottom: 10px; font-size: .86rem; }
  .form { gap: 14px; }
  .qa summary { padding: 13px 36px 13px 0; font-size: 1.15rem; }
  .sources { padding: 40px 20px 30px; }
  .foot { padding-top: 44px; }
  .foot__col:last-child { grid-column: 1 / -1; }
}
@media (max-width: 420px) {
  .brand__word { font-size: 1.25rem; }
  .brand__word span { letter-spacing: .18em; }
  .top__cta { padding: .5em .8em; font-size: .82rem; }
  .top__cta::after { content: none; }
  .hero__actions .btn { flex: 1 1 100%; }
  .grid .grid__corner { font-size: .6rem; letter-spacing: .06em; }
  .grid thead th { font-size: .8rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}