/* Lose the Dent site components, 30 September 2026.
   Sits after brand/ltd.css. Holds what the base sheet does not: article text, the location suggestions, the map,
   pagination, notices, listing cards, badges and the signed-in helpers. Every value is a token from ltd.css. */

[x-cloak] { display: none !important; }
body { overflow-x: clip; }
/* Homepage: main wraps the stacking panels without a box of its own, so each panel still pins inside .co-page */
.co-main-flow { display: contents; }
.co-panel--last > main { display: block; min-width: 0; }
.co-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
button.co-label, button.co-linklike { background: transparent; border: 0; padding: 0; cursor: pointer; color: inherit; font-family: inherit; text-align: left; }
button.co-label { font-family: var(--co-font-display); }
button.co-label:hover, button.co-linklike:hover { color: var(--co-blue); }
.co-linklike { font-size: inherit; line-height: inherit; }
form.co-inline { display: contents; }

/* Section titles inside a page with the list rhythm above them */
.co-subsection { margin-top: var(--co-action); padding-left: var(--co-gutter); display: flex; flex-direction: column; gap: 40px; }
.co-subsection > .co-title { margin: 0; }
.co-subsection--flush { padding-left: 0; }
.co-title { margin: 0; }
.co-notice { font-weight: 700; max-width: var(--co-measure); }
.co-stack--tight { gap: var(--co-row); }
.co-gap-top { margin-top: 24px; }
.co-gap-top-lg { margin-top: 40px; }
.co-content--near { margin-top: var(--co-intro); }
.co-results .co-nav-list .co-small, .co-nav-list > .co-small { text-transform: none; font-weight: 400; }
.co-nav-list__head { margin-top: 24px; }
.co-nav-list form { display: contents; }

/* Article and legal text: body in the 65 character measure, paragraphs 16px apart, condensed caps section titles */
.co-prose__body > * + * { margin-top: 16px; }
.co-prose__body h2, .co-prose__body h3, .co-prose__body h4 { margin: 40px 0 16px; max-width: var(--co-measure); font-family: var(--co-font-display); font-size: 22px; line-height: 1.2; font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase; scroll-margin-top: calc(var(--co-pin) + 16px); }
.co-prose__body > :first-child { margin-top: 0; }
.co-prose__body ul, .co-prose__body ol { margin-bottom: 0; padding-left: 18px; max-width: var(--co-measure); }
.co-prose__body li + li { margin-top: 8px; }
.co-prose__body a { font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.co-prose__body em, .co-prose__body i { font-style: normal; }
.co-prose__body blockquote { margin-left: 0; margin-right: 0; padding: 0; }
.co-prose__body blockquote > * + * { margin-top: 16px; }
.co-prose__body figure { margin-left: 0; margin-right: 0; }
.co-prose__body figcaption { margin-top: 8px; font-size: var(--co-label-size); }
.co-prose__body img { width: 100%; max-width: var(--co-measure); }
.co-prose__body hr { display: none; }
.co-prose__body table { width: 100%; max-width: var(--co-measure); border-collapse: collapse; border: 0; }
.co-prose__body th { padding: 0 24px 12px 0; text-align: left; vertical-align: top; font-family: var(--co-font-display); font-size: var(--co-cap-size); letter-spacing: var(--co-cap-ls); font-weight: 700; text-transform: uppercase; border: 0; }
.co-prose__body td { padding: 0 24px 12px 0; vertical-align: top; border: 0; }
.co-prose__body .post-cta { display: flex; flex-wrap: wrap; gap: var(--co-gap-control); margin-top: 40px; }
.co-prose__body .post-cta a { display: inline-flex; align-items: center; justify-content: center; width: var(--co-control-w); max-width: 100%; height: var(--co-control-h); padding: 0 20px; background: var(--co-blue); color: var(--co-ground); border-radius: var(--co-radius); text-decoration: none; font: 700 var(--co-btn-size)/1 var(--co-font-display); letter-spacing: var(--co-cap-ls); text-transform: uppercase; text-align: center; transition: background var(--co-fast) var(--co-ease), color var(--co-fast) var(--co-ease), box-shadow var(--co-fast) var(--co-ease); }
.co-prose__body .post-cta a:hover { background: var(--co-ink); color: var(--co-ground); }
.co-prose__body .post-cta a + a { background: transparent; color: var(--co-ink); box-shadow: inset 0 0 0 1px var(--co-ink); }
.co-prose__body .post-cta a + a:hover { background: var(--co-ink); color: var(--co-ground); }

/* Suggestions under an input (city or ZIP code, blog search). The list is the input's own 1px ink line carried down */
.co-suggest-wrap { position: relative; width: var(--co-control-w); max-width: 100%; }
.co-suggest { position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 5; display: none; max-height: 280px; overflow: auto; background: var(--co-ground); border: var(--co-line); border-radius: var(--co-radius); }
.co-suggest.show { display: block; }
.co-suggest[hidden] { display: none; }
.co-suggest button, .co-suggest a, .co-suggest__empty { display: block; width: 100%; min-height: 44px; padding: 12px 16px; background: transparent; border: 0; text-align: left; font: 400 var(--co-body-size)/var(--co-body-lh) var(--co-font); color: var(--co-ink); cursor: pointer; }
.co-suggest button:hover, .co-suggest a:hover, .co-suggest .is-active { color: var(--co-blue); }
.co-suggest .co-suggest__near { font-family: var(--co-font-display); font-size: var(--co-cap-size); letter-spacing: var(--co-cap-ls); font-weight: 700; text-transform: uppercase; color: var(--co-blue); }
.co-suggest mark { background: transparent; color: inherit; font-weight: 700; }

/* Map: OpenStreetMap tiles. Solid pins are businesses with a street address; hollow pins are service-area businesses,
   whose point is approximate. The ink pin is the searched location */
.co-map { width: 100%; height: 380px; margin-top: 24px; background: var(--co-tint); border-radius: var(--co-radius); font-weight: 400; text-transform: none; letter-spacing: 0; z-index: 0; }
.co-map--wide { height: 340px; max-width: calc(var(--co-control-w) * 2 + var(--co-gap-control)); }
.co-map-toggle { display: none; margin-top: 24px; }
.co-map-note { display: block; margin-top: 8px; font-family: var(--co-font); font-size: var(--co-label-size); line-height: 1.4; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--co-ink-muted); }
.co-pin { width: 100%; height: 100%; border-radius: 50%; background: var(--co-blue); box-shadow: 0 0 0 2px var(--co-ground); }
.co-pin--area { background: var(--co-ground); box-shadow: inset 0 0 0 3px var(--co-blue); }
.co-pin--you { background: var(--co-ink); }
.leaflet-container { font: 400 var(--co-label-size)/var(--co-body-lh) var(--co-font) !important; color: var(--co-ink) !important; background: var(--co-ground) !important; }
.leaflet-container a { color: var(--co-ink) !important; }
.leaflet-container a:hover { color: var(--co-blue) !important; text-decoration: none !important; }
.leaflet-bar, .leaflet-touch .leaflet-bar { border: 0 !important; border-radius: var(--co-radius) !important; box-shadow: none !important; }
.leaflet-bar a, .leaflet-touch .leaflet-bar a { width: 44px !important; height: 44px !important; border: var(--co-line) !important; border-radius: var(--co-radius) !important; background: var(--co-ground) !important; color: var(--co-ink) !important; font: 700 16px/42px var(--co-font) !important; }
.leaflet-bar a + a { margin-top: 8px; }
.leaflet-bar a:hover { color: var(--co-blue) !important; }
.leaflet-popup-content-wrapper { border: var(--co-line); border-radius: var(--co-radius) !important; box-shadow: none !important; background: var(--co-ground) !important; color: var(--co-ink) !important; }
.leaflet-popup-content { margin: 12px 16px !important; font: 400 var(--co-label-size)/var(--co-body-lh) var(--co-font); }
.leaflet-popup-tip { border: var(--co-line); box-shadow: none !important; background: var(--co-ground) !important; }
.leaflet-container a.leaflet-popup-close-button { font: 700 15px/24px var(--co-font) !important; color: var(--co-ink) !important; }
.leaflet-control-attribution { background: var(--co-ground) !important; color: var(--co-ink) !important; font: 400 var(--co-label-size)/var(--co-body-lh) var(--co-font) !important; }
.leaflet-control-attribution svg { display: none !important; }

/* Beside the filter column two cards only fit their 280px buttons from about 1200px up */
@media (max-width: 1200px) {
  .co-results .co-cards { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
  .co-map-toggle { display: inline-flex; }
  .co-map.is-collapsed { display: none; }
  .co-map.is-collapsed + .co-map-note { display: none; }
  .co-subsection { margin-top: var(--co-row); }
}
@media (max-width: 600px) {
  .co-form-row > .co-field { width: 100%; }
  .co-suggest-wrap { width: 100%; }
  .co-map--wide { max-width: 100%; }
}

/* File inputs: the input block, the browser's own button restyled as a caps label */
.co-input[type="file"] { padding: 12px 16px; font-size: var(--co-body-size); line-height: 1.35; cursor: pointer; }
.co-input[type="file"]::file-selector-button { margin: 0 12px 0 0; padding: 0; border: 0; background: transparent; color: var(--co-ink); font: 700 var(--co-cap-size)/1.35 var(--co-font-display); letter-spacing: var(--co-cap-ls); text-transform: uppercase; cursor: pointer; }
.co-input[type="number"] { -moz-appearance: textfield; appearance: textfield; }
.co-input[type="number"]::-webkit-outer-spin-button, .co-input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.co-form .co-form { gap: var(--co-row); }

/* Signed-in pages (dashboard, listing form, compare). Same components as the public site; these few helpers cover
   what an account area adds: an aligned list of rows in place of a table, a row of text actions, a read-only code
   box and headline figures. */
.co-rows { display: grid; grid-template-columns: repeat(var(--co-cols, 3), minmax(0, 1fr)); gap: 12px 24px; align-items: start; max-width: 100%; }
.co-rows > * { min-width: 0; overflow-wrap: anywhere; }
.co-rows__head { font-family: var(--co-font-display); font-size: var(--co-cap-size); letter-spacing: var(--co-cap-ls); line-height: 1.3; font-weight: 700; text-transform: uppercase; }
.co-links { display: flex; flex-wrap: wrap; gap: 8px 24px; align-items: center; }
.co-figure { font-family: var(--co-font-display); font-size: 32px; font-weight: 700; line-height: 1; }
.co-code { width: calc(var(--co-control-w) * 2 + var(--co-gap-control)); max-width: 100%; min-height: calc(var(--co-control-h) * 2); padding: 12px 16px; font: 400 var(--co-label-size)/1.35 var(--co-font); color: var(--co-ink); background: var(--co-ground); border: var(--co-line); border-radius: var(--co-radius); resize: vertical; }
.co-fieldset + .co-fieldset, .co-form > .co-fieldset + .co-fieldset { margin-top: 0; }
.co-form--wide { padding-left: 0; }
@media (max-width: 900px) { .co-rows { grid-template-columns: repeat(min(var(--co-cols, 3), 2), minmax(0, 1fr)); } }
@media (max-width: 600px) { .co-rows { grid-template-columns: minmax(0, 1fr); gap: 4px; } .co-rows__head { display: none; } .co-rows > .co-rows__gap { margin-bottom: 16px; } .co-code { width: 100%; } }
.co-links .is-active { color: var(--co-blue); }
[hidden] { display: none !important; }
.co-field__help, .co-block > span, .co-entry > span { overflow-wrap: anywhere; }

/* Show / Hide password toggle (ltd-password.js): sits inside the right edge of the field */
.co-pw { position: relative; display: block; width: 100%; }   /* .co-field sizes its inputs to 100% (journey.css); the wrapper takes that place */
.co-field .co-pw > .co-input { width: 100%; max-width: none; padding-right: 72px; }
.co-pw__toggle { position: absolute; top: 0; right: 0; bottom: 0; min-width: 64px; padding: 0 14px; background: none; border: 0; color: var(--co-ink); font: 700 var(--co-cap-size)/1 var(--co-font-display); letter-spacing: var(--co-cap-ls); text-transform: uppercase; cursor: pointer; }
.co-pw__toggle:hover { color: var(--co-blue); }
.co-pw__toggle:focus-visible { outline: 2px solid var(--co-blue); outline-offset: -4px; }

/* ---- Lose the Dent components ------------------------------------------------------------------------ */
/* Skip link: first focusable element on every page */
.co-skip { position: absolute; left: 8px; top: -64px; z-index: 50; padding: 12px 16px; background: var(--co-ink); color: var(--co-ground); font-weight: 700; border-radius: var(--co-radius); }
.co-skip:focus { top: 8px; color: var(--co-ground); }

/* Links inside running text are underlined: color alone is not a link cue (WCAG 1.4.1) */
p a:not(.co-btn):not(.co-label), .co-block > span a:not(.co-label), .co-helper a:not(.co-label), .co-field__help a { text-decoration: underline; text-underline-offset: 2px; }
a.co-label, button.co-label { display: inline-flex; align-items: center; min-height: 24px; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.cx-nav a, .cx-header a.co-label, .co-footer a.co-label, .co-footer__links a, .co-nav-list a, .co-nav-list button { text-decoration: none; }

/* Notices: a quiet tinted box with an accent edge. Draft banners on the legal pages use it too */
.co-notice { padding: 12px 16px; background: var(--co-tint); border-left: 4px solid var(--co-blue); border-radius: var(--co-radius); font-weight: 600; }
.co-notice--draft { font-weight: 400; }

/* Listing cards: a hairline frame, the website screenshot, badges, facts, one button at the foot */
.co-cards { align-items: stretch; }
.co-card { padding: 20px; border: 1px solid var(--co-rule); border-radius: calc(var(--co-radius) * 2); background: var(--co-ground); }
.co-card__shot { display: block; width: calc(100% + 40px); max-width: none; margin: -20px -20px 0; aspect-ratio: 16 / 9; object-fit: cover; object-position: top center; background: var(--co-tint); border-bottom: 1px solid var(--co-rule); border-radius: calc(var(--co-radius) * 2) calc(var(--co-radius) * 2) 0 0; }
.co-card__place { color: var(--co-ink-muted); }
.co-card__rating { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; }
.co-card__rating strong { font-family: var(--co-font-display); font-size: 22px; line-height: 1; }
.co-card__price { font-weight: 700; }
.co-card > .co-btn { width: 100%; }

/* Badges: plain facts about a business. Text and a hairline, never color alone */
.co-badges { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.co-badge { display: inline-flex; align-items: center; min-height: 28px; padding: 3px 10px; background: var(--co-tint); border: 1px solid var(--co-rule); border-radius: 999px; font-size: var(--co-label-size); line-height: 1.2; font-weight: 600; color: var(--co-ink); }
.co-badge--accent { background: var(--co-ground); border-color: var(--co-blue); color: var(--co-blue); }

/* Filter toggles in the results column: a tick box drawn in CSS before the label */
.co-nav-list a.co-toggle { display: flex; align-items: center; gap: 10px; }
.co-toggle::before { content: ""; flex: none; width: 18px; height: 18px; border: 1.5px solid var(--co-ink); border-radius: 3px; background: var(--co-ground); }
.co-toggle.is-active::before { background: var(--co-blue); border-color: var(--co-blue); box-shadow: inset 0 0 0 3px var(--co-ground); }

/* Opening hours and other two-column facts */
.co-hours { display: grid; grid-template-columns: max-content 1fr; gap: 4px 20px; margin: 0; }
.co-hours dt { font-weight: 600; }
.co-hours dd { margin: 0; }
.co-hours .is-today { color: var(--co-blue); font-weight: 700; }

/* Website screenshot on the detail page */
.co-shot { width: 100%; border: 1px solid var(--co-rule); border-radius: calc(var(--co-radius) * 2); background: var(--co-tint); }

/* Footer: brand, link columns, the marketplace disclaimer */
.co-footer { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 32px var(--co-gutter); align-items: start; padding-top: 32px; border-top: 1px solid var(--co-rule); }
.co-footer__about { gap: 12px; max-width: 40ch; }
.co-footer__cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.co-footer__links { display: flex; flex-direction: column; gap: 10px; font-family: var(--co-font); font-size: 15px; font-weight: 400; letter-spacing: 0; text-transform: none; }
.co-footer__links > .co-label { margin-bottom: 4px; }
.co-footer__legal { grid-column: 1 / -1; color: var(--co-ink-muted); font-size: var(--co-label-size); line-height: 1.5; max-width: 90ch; }
@media (max-width: 900px) { .co-footer { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 600px) { .co-footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Home: the numbers strip and the ZIP code entry */
.cx-stats { display: flex; flex-wrap: wrap; gap: 12px 40px; margin-top: 40px; padding-left: var(--co-gutter); }
.cx-stat { display: flex; flex-direction: column; gap: 2px; }
.cx-stat strong { font-family: var(--co-font-display); font-size: 34px; line-height: 1; font-weight: 700; }
.cx-stat span { font-size: var(--co-label-size); color: var(--co-ink-muted); }

/* Results: the left column holds the filters and, under them, the map */
.co-results__side { display: flex; flex-direction: column; gap: 28px; min-width: 0; }
.co-mapbox { display: flex; flex-direction: column; }
.co-mapbox .co-nav-list__head { margin-top: 0; }
.co-nav-list button.co-toggle { display: flex; align-items: center; gap: 10px; width: 100%; padding: 0; background: transparent; border: 0; color: inherit; font: inherit; letter-spacing: inherit; text-transform: inherit; text-align: left; cursor: pointer; }
.co-nav-list button.co-toggle:hover, .co-nav-list a:hover { color: var(--co-blue); }
.co-nav-list select.co-input { font-family: var(--co-font); font-weight: 400; letter-spacing: 0; text-transform: none; }
.co-nav-list .co-small { font-family: var(--co-font); letter-spacing: 0; }
.co-plain { margin: 0; padding-left: 18px; }
.co-plain li + li { margin-top: 4px; }
ul.co-badges.co-intro { max-width: none; }
ul.co-badges.co-intro { margin-top: 20px; padding-left: var(--co-gutter); }
.co-grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 600px) { .co-grid--two { grid-template-columns: minmax(0, 1fr); } }