/* =====================================================================================
   LOCATION PAGES — directory layout (15 Oct 2026)

   Follows the Findus directory pattern: tight 6px radii, a 1px near-white hairline, a
   soft diffuse shadow rather than a hard border, white cards on a light ground, and a
   filter bar above a card grid. Built from the LYD AssistOS palette; the accent is the
   site's own #D40F17, which already matches the red action button in that pattern.

   Scoped to main.loc-page and .loc-hub so the rest of the site is untouched.
   ===================================================================================== */

main.loc-page section[data-band] > .band-inner,
main.loc-hub section[data-band] > .band-inner {
  padding-block: clamp(0.9rem, 1.6vw, 1.4rem);
}

/* ---------------------------------------------------------------- panels and cards */
main.loc-page .loc-panel,
main.loc-hub .loc-panel {
  background: #fff;
  border: 1px solid #EAEFF5;
  border-radius: 6px !important;
  box-shadow: rgba(71, 85, 95, 0.08) 0 0 10px 1px;
  padding: clamp(1.4rem, 2.6vw, 2.1rem);
}

main.loc-page .loc-panel + .loc-panel {
  margin-top: clamp(0.85rem, 1.3vw, 1.15rem);
}

main.loc-page .loc-panel > :first-child { margin-top: 0; }

main.loc-page .loc-panel--tint { background: var(--color-lyd-surface); box-shadow: none; }

main.loc-page .loc-panel--dark {
  background: var(--color-lyd-ink);
  border-color: transparent;
  color: #fff;
}
main.loc-page .loc-panel--dark :is(h2, h3, strong) { color: #fff; }
main.loc-page .loc-panel--dark p { color: rgba(255, 255, 255, 0.78); }

main.loc-page .loc-card,
main.loc-hub .loc-card {
  background: #fff;
  border: 1px solid #EAEFF5;
  border-radius: 6px !important;
  box-shadow: rgba(71, 85, 95, 0.08) 0 0 10px 1px;
  padding: 1.25rem 1.35rem;
}

main.loc-page .loc-card h3 { margin: 0 0 0.45rem; font-size: 1.0625rem; line-height: 1.3; }
main.loc-page .loc-card p { margin: 0 0 0.45rem; font-size: 0.9375rem; line-height: 1.55; }
main.loc-page .loc-card p:last-child { margin-bottom: 0; }

/* the listing-card meta row: small, muted, separated by dots */
main.loc-page .loc-meta,
main.loc-hub .loc-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.9rem;
  margin-top: 0.8rem;
  padding-top: 0.7rem;
  border-top: 1px solid #EAEFF5;
  font-size: 0.8125rem;
  color: var(--color-lyd-muted);
}

main.loc-page .loc-meta span { display: inline-flex; align-items: center; gap: 0.3rem; }
main.loc-page .loc-meta strong { color: var(--color-lyd-ink); font-weight: 600; }

/* numbered index, as the directory cards number their listings */
main.loc-page .loc-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.6rem;
  height: 1.6rem;
  padding: 0 0.4rem;
  border-radius: 4px !important;
  background: var(--color-lyd-yellow);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  margin-bottom: 0.7rem;
}

/* offer tag, styled like a listing category chip */
main.loc-page .loc-tag {
  display: inline-block;
  padding: 0.2rem 0.6rem;
  border-radius: 4px !important;
  background: var(--color-lyd-cream);
  font-size: 0.78rem;
  font-weight: 600;
  text-decoration: none;
}
main.loc-page .loc-tag:hover { background: var(--color-lyd-line); }

/* ---------------------------------------------------------------- hub filter + grid */
main.loc-hub .loc-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
  background: #fff;
  border: 1px solid #EAEFF5;
  border-radius: 6px !important;
  box-shadow: rgba(71, 85, 95, 0.08) 0 0 10px 1px;
  padding: 0.7rem;
}

main.loc-hub .loc-filter input,
main.loc-hub .loc-filter select {
  flex: 1 1 12rem;
  min-width: 0;
  border: 1px solid var(--color-lyd-line);
  border-radius: 4px;
  padding: 0.65rem 0.8rem;
  font: inherit;
  font-size: 0.95rem;
  background: #fff;
  color: var(--color-lyd-ink);
}

main.loc-hub .loc-filter input:focus-visible,
main.loc-hub .loc-filter select:focus-visible {
  outline: 2px solid var(--color-lyd-yellow);
  outline-offset: 1px;
}

main.loc-hub .loc-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
  margin-top: 1.1rem;
}

main.loc-hub a.loc-card {
  display: block;
  text-decoration: none;
  color: inherit;
  transition: box-shadow .18s ease, transform .18s ease;
}
main.loc-hub a.loc-card:hover {
  box-shadow: rgba(71, 85, 95, 0.18) 0 2px 16px 1px;
  transform: translateY(-2px);
}
main.loc-hub a.loc-card h3 { margin: 0 0 0.3rem; font-size: 1.0625rem; }
main.loc-hub a.loc-card p { margin: 0; font-size: 0.875rem; color: var(--color-lyd-muted); }

main.loc-hub .loc-state {
  display: inline-block;
  padding: 0.15rem 0.5rem;
  border-radius: 4px !important;
  background: var(--color-lyd-cream);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  margin-bottom: 0.55rem;
}

main.loc-hub .loc-empty { margin-top: 1.2rem; color: var(--color-lyd-muted); }

/* ---------------------------------------------------------------- prices, sources, faq */
main.loc-page .loc-prices {
  width: 100%;
  max-width: 42rem;
  margin-top: 0.9rem;
  border-collapse: collapse;
  font-size: 0.9375rem;
  text-align: left;
}
main.loc-page .loc-prices td {
  padding: 0.5rem 0.9rem 0.5rem 0;
  border-bottom: 1px solid #EAEFF5;
  vertical-align: top;
}
main.loc-page .loc-prices td:last-child {
  white-space: nowrap;
  text-align: right;
  padding-right: 0;
  font-variant-numeric: tabular-nums;
}

main.loc-page .loc-sources { margin: 1.1rem 0 0; padding: 0; list-style: none; }
main.loc-page .loc-sources li {
  padding: 0.75rem 0;
  border-top: 1px solid #EAEFF5;
  font-size: 0.9375rem;
  line-height: 1.55;
}
main.loc-page .loc-sources li:first-child { border-top: 0; padding-top: 0; }

main.loc-page .loc-status {
  display: inline-block;
  margin-top: 0.3rem;
  padding: 0.12rem 0.5rem;
  border-radius: 4px;
  background: var(--color-lyd-cream);
  font-size: 0.75rem;
}

:is(main.loc-page, main.loc-hub) .loc-faq {
  border: 1px solid #EAEFF5;
  border-radius: 6px !important;
  padding: 0.85rem 1.1rem;
  background: #fff;
}
:is(main.loc-page, main.loc-hub) .loc-faq + .loc-faq { margin-top: 0.55rem; }
:is(main.loc-page, main.loc-hub) .loc-faq summary {
  cursor: pointer;
  font-weight: 600;
  font-size: 0.975rem;
  list-style: none;
}
:is(main.loc-page, main.loc-hub) .loc-faq summary::-webkit-details-marker { display: none; }
:is(main.loc-page, main.loc-hub) .loc-faq summary::after { content: " +"; float: right; opacity: .45; }
:is(main.loc-page, main.loc-hub) .loc-faq[open] summary::after { content: " –"; }
:is(main.loc-page, main.loc-hub) .loc-faq p { margin: 0.7rem 0 0.1rem; font-size: 0.9375rem; line-height: 1.6; }

@media (max-width: 640px) {
  main.loc-page .loc-prices td:last-child { white-space: normal; text-align: left; }
  main.loc-hub .loc-filter { padding: 0.6rem; }
}

/* =====================================================================================
   LOCATIONS HUB — "Find your state" flip cards
   Mirrors the LYD Solar Suite locations layout: a two-column intro above a grid of tall
   dark tiles, one per state, that flip to reveal the places inside them. Solar uses lime
   on near-black; this uses the LYD red, peach and black.
   ===================================================================================== */
main.loc-hub {
  --loc-red: #D40F17;
  --loc-peach: #FFC7C2;
  --loc-black: #0C0F16;
}

main.loc-hub .loc-intro {
  display: grid;
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: start;
}
@media (min-width: 900px) {
  main.loc-hub .loc-intro { grid-template-columns: 1fr 1fr; }
}
main.loc-hub .loc-intro h2 {
  font-size: clamp(2rem, 4.2vw, 3rem);
  line-height: 1.04;
  letter-spacing: -0.02em;
  margin: 0.4rem 0 0;
}
main.loc-hub .loc-intro h2 em { font-style: normal; color: var(--loc-red); }
main.loc-hub .loc-intro p { line-height: 1.65; margin: 0 0 0.9rem; }
main.loc-hub .loc-pick {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
  font-weight: 600;
  color: var(--loc-black);
  background: var(--loc-peach);
  border-radius: 8px;
  padding: 0.75rem 0.95rem;
  margin-top: 0.4rem;
}

/* ---- the state grid ---- */
main.loc-hub .loc-states {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(16.5rem, 1fr));
  /* each tile sizes to its own list; without this a 17-place state stretches every
     other tile in its row to match */
  align-items: start;
  gap: 1.1rem;
  margin-top: clamp(1.75rem, 3.5vw, 3rem);
  list-style: none;
  padding: 0;
}
/* =====================================================================================
   Map of Australia + the network list, after the Transflash "our network" widget:
   a pin map over a white card grid, each card a bordered region heading above a
   bulleted list. Type is kept at the homepage scale rather than the theme's 28px.
   ===================================================================================== */
main.loc-hub .loc-mapwrap {
  background: #fff;
  border: 1px solid #EAEFF5;
  border-radius: 6px !important;
  box-shadow: rgba(71, 85, 95, .08) 0 0 10px 1px;
  padding: clamp(1rem, 2.4vw, 2rem);
}
main.loc-hub .loc-map { display: block; width: 100%; height: auto; max-height: 72vh; }
main.loc-hub .loc-land {
  fill: var(--color-lyd-cream);
  stroke: #D9D9DB;
  stroke-width: 2;
  stroke-linejoin: round;
}
main.loc-hub .loc-pin {
  fill: #fff;
  stroke: var(--loc-red);
  stroke-width: 3;
  transition: r .15s ease, fill .15s ease;
}
main.loc-hub .loc-pin--live { fill: var(--loc-red); stroke: var(--loc-red); }
main.loc-hub a:hover .loc-pin--live,
main.loc-hub a:focus-visible .loc-pin--live { fill: var(--loc-black); stroke: var(--loc-black); }

/* Pin tooltips. One at a time, on hover or keyboard focus, so the east coast cluster is
   readable instead of fifty labels stacked on top of each other. */
main.loc-hub .loc-tip { opacity: 0; pointer-events: none; transition: opacity .12s ease; }
main.loc-hub .loc-pg:hover .loc-tip,
main.loc-hub .loc-pg:focus-visible .loc-tip,
main.loc-hub a:hover .loc-tip,
main.loc-hub a:focus-visible .loc-tip { opacity: 1; }
main.loc-hub .loc-tip__bg {
  fill: var(--loc-black, #0C0F16);
  stroke: var(--loc-red, #D40F17);
  stroke-width: 1;
}
main.loc-hub .loc-tip__text {
  fill: #fff;
  font-family: "Inter Tight", system-ui, sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .02em;
}
/* the pin itself grows a little, so the hover target is obvious before the pill appears */
main.loc-hub .loc-pg:hover .loc-pin { r: 10; }

main.loc-hub .loc-maplegend {
  margin: .8rem 0 0;
  font-size: .8125rem;
  color: var(--color-lyd-muted);
}

main.loc-hub .loc-network {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
  align-items: start;
  gap: 1rem;
  margin-top: clamp(1.25rem, 2.4vw, 2rem);
}
main.loc-hub .ova-network {
  background: #fff;
  border: 1px solid #EAEFF5;
  border-radius: 6px !important;
  padding: 1.5rem;
  transition: box-shadow .2s ease;
}
main.loc-hub .ova-network:hover { box-shadow: 0 20px 60px rgba(0, 0, 0, .08); }
main.loc-hub .ova-network:hover .loc-continents { border-bottom-color: var(--loc-red); }

main.loc-hub .loc-continents {
  margin: 0 0 .7rem;
  padding-bottom: .6rem;
  font-size: 1.0625rem;      /* homepage card-heading scale, not the theme's 28px */
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
  border-bottom: 1px solid rgba(0, 0, 0, .55);
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: .5rem;
}
main.loc-hub .loc-abbr {
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .06em;
  background: var(--loc-peach);
  color: var(--loc-black);
  border-radius: 999px !important;
  padding: .12rem .5rem;
}
main.loc-hub .loc-note {
  margin: 0 0 .9rem;
  font-size: .8125rem;
  line-height: 1.55;
  color: var(--color-lyd-muted);
}
main.loc-hub .loc-country-list { margin: 0; padding-left: 1.1rem; }
main.loc-hub .loc-country {
  font-size: .875rem;
  line-height: 1.5;
  color: var(--color-lyd-ink);
}
main.loc-hub .loc-country::marker { color: var(--loc-red); }
main.loc-hub .loc-country:not(:last-child) {
  border-bottom: 1px solid #ededed;
  margin-bottom: .5rem;
  padding-bottom: .4rem;
}
main.loc-hub .loc-country a { color: inherit; text-decoration: none; font-weight: 600; }
main.loc-hub .loc-country a:hover,
main.loc-hub .loc-country a:focus-visible { color: var(--loc-red); }
main.loc-hub .loc-country a::after { content: " →"; opacity: .5; }
main.loc-hub .loc-livecount {
  margin: .9rem 0 0;
  font-size: .75rem;
  color: var(--color-lyd-muted);
}

main.loc-hub .loc-code {
  align-self: flex-start;
  background: var(--loc-peach);
  color: var(--loc-black);
  border-radius: 999px !important;
  padding: 0.25rem 0.75rem;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}
main.loc-hub .loc-name {
  margin: .9rem 0 0.3rem;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.15;
  color: #fff;
}
main.loc-hub .loc-count { margin: 0; font-size: 0.875rem; color: rgba(255,255,255,.82); }
main.loc-hub .loc-hint {
  margin: 0.75rem 0 0;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--loc-peach);
}

/* back face: the places in that state */


/* =====================================================================================
   Specificity backstop.
   premium-vcpility-site.css carries
     html.vc-site :is(.btn, a.btn, button, [data-slot="card"], .card, .card-lyd, ...)
     { border-radius: 0 !important; }
   which scores (0,2,2) because :is() takes its most specific argument (a.btn). The
   state tiles are <button> and the FAQ rows are <details>, so they were being squared
   off. These selectors score (0,3,2) and up, so the intended radii survive.
   ===================================================================================== */
html.vc-site main.loc-hub .loc-tile { border-radius: 24px !important; }
html.vc-site main.loc-hub .loc-code { border-radius: 999px !important; }
html.vc-site main.loc-hub .loc-filter { border-radius: 6px !important; }
html.vc-site main.loc-hub .loc-state { border-radius: 4px !important; }
html.vc-site :is(main.loc-page, main.loc-hub) :is(.loc-panel, .loc-card, .loc-faq) {
  border-radius: 6px !important;
}
html.vc-site :is(main.loc-page, main.loc-hub) :is(.loc-num, .loc-tag) {
  border-radius: 4px !important;
}


/* =====================================================================================
   PACEON LAYOUT SYSTEM (15 Oct 2026)

   Structure, spacing and typography follow the Paceon template kit: Archivo uppercase
   display headings with tight negative tracking, Inter Tight body at 16px/1.6, a
   full-bleed photographic hero carrying a large uppercase title, a two column intro,
   solid colour icon cards, and 8px buttons in small uppercase.

   The palette is not Paceon's. Its lime on navy is a sports identity; these pages keep
   the LYD red, peach and black so they still belong to lydassist.com.
   ===================================================================================== */
main.loc-page,
main.loc-hub {
  --pc-ink: #0C0F16;
  --pc-body: #434E4E;
  --pc-accent: #D40F17;
  --pc-peach: #FFC7C2;
  --pc-line: #E6E6E8;
  --pc-radius: 8px;
  font-family: "Inter Tight", "Plus Jakarta Sans", system-ui, sans-serif;
}

/* ---- display type ---- */
html.vc-site #main.loc-page :is(h1, h2, h3, .pc-display),
html.vc-site #main.loc-hub :is(h1, h2, h3, .pc-display) {
  font-family: "Archivo", "Plus Jakarta Sans", system-ui, sans-serif !important;
  text-transform: uppercase;
  font-weight: 700 !important;
  letter-spacing: -0.036em !important;
  color: var(--pc-ink);
}
html.vc-site #main.loc-page > section.inner-grad h1,
html.vc-site #main.loc-hub > section.inner-grad h1 {
  font-size: clamp(2.4rem, 5vw, 4.55rem) !important;   /* Paceon hero sits at 73px */
  line-height: 1.02 !important;
  color: #fff;
}
html.vc-site #main.loc-page section .loc-panel h2,
html.vc-site #main.loc-hub section .loc-panel h2,
html.vc-site #main.loc-hub section .loc-intro h2 {
  font-size: clamp(1.9rem, 3.4vw, 3.125rem) !important;  /* 50px */
  line-height: 1.1 !important;
}
html.vc-site #main.loc-page .loc-card h3,
html.vc-site #main.loc-hub .loc-card h3 {
  font-size: 1.125rem !important;
  line-height: 1.25 !important;
  letter-spacing: -0.02em !important;
}

/* ---- body copy ---- */
main.loc-page p, main.loc-hub p,
main.loc-page li, main.loc-hub li {
  font-family: "Inter Tight", "Plus Jakarta Sans", system-ui, sans-serif;
  color: var(--pc-body);
}
html.vc-site #main.loc-page > section.inner-grad .conv-lede,
html.vc-site #main.loc-hub > section.inner-grad .conv-lede {
  font-size: 1rem !important;
  line-height: 1.6 !important;
  color: rgba(255,255,255,.86) !important;
  max-width: 34rem;
}
main.loc-page .loc-panel > p { font-size: 1rem; line-height: 1.6; }

/* ---- eyebrow, as Paceon sets it above a heading ---- */
main.loc-page .td-kicker, main.loc-hub .td-kicker {
  font-family: "Inter Tight", system-ui, sans-serif !important;
  font-size: .7rem !important;
  font-weight: 700 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase;
  color: var(--pc-accent) !important;
}

/* ---- panels become plain stacked sections, as the kit uses ---- */
main.loc-page .loc-panel {
  background: #fff;
  border: 0;
  box-shadow: none;
  border-radius: 0 !important;
  padding: clamp(2.5rem, 5vw, 4.5rem) 0;
  border-top: 1px solid var(--pc-line);
}
main.loc-page .loc-panel + .loc-panel { margin-top: 0; }
main.loc-page .loc-panel--tint {
  background: #FAFAFA;
  padding-inline: clamp(1.25rem, 3vw, 2.5rem);
}
main.loc-page .loc-panel--dark {
  background: var(--pc-ink);
  border-top: 0;
  padding-inline: clamp(1.5rem, 4vw, 3.5rem);
  border-radius: var(--pc-radius) !important;
}
html.vc-site #main.loc-page .loc-panel--dark :is(h2, h3) { color: #fff !important; }
main.loc-page .loc-panel--dark p { color: rgba(255,255,255,.78); }

/* ---- solid colour cards, the kit's icon boxes ---- */
main.loc-page .loc-card {
  border: 0 !important;
  border-radius: var(--pc-radius) !important;
  box-shadow: none;
  padding: clamp(1.5rem, 2.4vw, 2rem);
  background: #F4F4F5;
}
main.loc-page .loc-card::before { display: none; }
main.loc-page .loc-card:nth-child(4n+1) { background: var(--pc-ink); }
main.loc-page .loc-card:nth-child(4n+1) :is(h3, strong) { color: #fff !important; }
main.loc-page .loc-card:nth-child(4n+1) p { color: rgba(255,255,255,.80); }
main.loc-page .loc-card:nth-child(4n+2) { background: var(--pc-peach); }
main.loc-page .loc-card:nth-child(4n+3) { background: #F4F4F5; }
main.loc-page .loc-card:nth-child(4n+4) { background: var(--pc-accent); }
main.loc-page .loc-card:nth-child(4n+4) :is(h3, strong) { color: #fff !important; }
main.loc-page .loc-card:nth-child(4n+4) p { color: rgba(255,255,255,.88); }
main.loc-page .loc-card:nth-child(4n+4) .loc-tag,
main.loc-page .loc-card:nth-child(4n+1) .loc-tag { background: rgba(255,255,255,.16); color: #fff; }

/* numbered chip becomes the kit's square icon tile */
main.loc-page .loc-num {
  width: 2.75rem; height: 2.75rem;
  border-radius: var(--pc-radius) !important;
  background: rgba(0,0,0,.08) !important;
  color: inherit;
  font-size: .8rem;
  margin-bottom: 1rem;
}
main.loc-page .loc-card:nth-child(4n+1) .loc-num,
main.loc-page .loc-card:nth-child(4n+4) .loc-num { background: rgba(255,255,255,.18) !important; }

/* ---- buttons ---- */
main.loc-page .td-cta, main.loc-hub .td-cta,
main.loc-page .loc-panel--dark a[href], main.loc-hub .loc-panel--dark a[href] {
  border-radius: var(--pc-radius) !important;
  font-size: .8125rem !important;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 1rem 1.625rem !important;
}
main.loc-page .loc-tag, main.loc-hub .loc-tag {
  border-radius: var(--pc-radius) !important;
  font-size: .7rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: .4rem .7rem;
}

/* =====================================================================================
   HERO PHOTOGRAPH, restored after the type rewrite (15 Oct 2026)
   The place's photograph sits behind the hero. Without these the <img> renders inline and
   pushes the page down, which is what happened when the earlier block was trimmed.
   ===================================================================================== */
main.loc-page .loc-hero { position: relative; isolation: isolate; overflow: hidden; }
main.loc-page .loc-hero__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 55%;
  z-index: -2;
}
main.loc-page .loc-hero__scrim {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(12,15,22,.93) 0%, rgba(12,15,22,.80) 42%,
                    rgba(12,15,22,.42) 74%, rgba(12,15,22,.28) 100%),
    linear-gradient(0deg, rgba(12,15,22,.62) 0%, rgba(12,15,22,0) 58%);
}
main.loc-page .loc-hero .loc-hero__inner { position: relative; z-index: 1; max-width: 46rem; }
main.loc-page .loc-hero h1 { text-shadow: 0 2px 18px rgba(0,0,0,.5); }
main.loc-page .loc-hero__credit {
  margin: 1.75rem 0 0;
  font-family: "Inter Tight", system-ui, sans-serif;
  font-size: .7rem;
  line-height: 1.5;
  color: rgba(255,255,255,.60);
}
main.loc-page .loc-hero__credit a { color: rgba(255,255,255,.8); text-decoration: underline; }
@media (max-width: 640px) {
  main.loc-page .loc-hero__scrim {
    background: linear-gradient(0deg, rgba(12,15,22,.93) 0%, rgba(12,15,22,.72) 55%,
                rgba(12,15,22,.54) 100%);
  }
}

/* The site forces border-radius:0 and its own body face through id-level and !important
   rules, so the Paceon button shape and body type need the same weight to land. */
html.vc-site #main.loc-page :is(.td-cta, .loc-tag, .loc-card, .loc-num),
html.vc-site #main.loc-hub :is(.td-cta, .loc-tag, .loc-card) {
  border-radius: 8px !important;
}
html.vc-site #main.loc-page .loc-num { border-radius: 8px !important; }
html.vc-site #main.loc-page :is(p, li, summary, figcaption, td),
html.vc-site #main.loc-hub :is(p, li, summary, figcaption, td) {
  font-family: "Inter Tight", "Plus Jakarta Sans", system-ui, sans-serif !important;
  font-size: 1rem !important;
  line-height: 1.6 !important;
}
html.vc-site #main.loc-page .loc-card p,
html.vc-site #main.loc-hub .loc-card p { font-size: .9375rem !important; }
html.vc-site #main.loc-page :is(.loc-sources li, .loc-livecount, .loc-note, .loc-meta,
                                .loc-hero__credit, .loc-maplegend),
html.vc-site #main.loc-hub :is(.loc-sources li, .loc-livecount, .loc-note, .loc-meta,
                               .loc-hero__credit, .loc-maplegend) {
  font-size: .8125rem !important;
}


/* =====================================================================================
   PACEON SECTION ARCHITECTURE (15 Oct 2026)

   The type system above was right but every section was still rendering as the same white
   box, which is why the pages did not read like the kit. Paceon's about page is six
   different section layouts; these are those six, measured from
   demo.zaderonstudio.com/paceon/template-kit/about/ :

     .pc-banner   full-bleed photographic page title, centred, with a breadcrumb   (518px)
     .pc-split    two columns, 632/744 of 1400, heading left and substance right
     .pc-slab     solid colour block held against the split, square on the inner edge
     .pc-grid--3  three columns at 24px gap, after a centred header
     .pc-cta      full width call to action band
     .pc-quote    three column cards

   Paceon's lime on navy is a sports identity. These keep LYD red, peach and black.
   ===================================================================================== */
main.pc-page {
  --pc-ink: #0C0F16;
  --pc-body: #434E4E;
  --pc-accent: #D40F17;
  --pc-peach: #FFC7C2;
  --pc-line: #E6E6E8;
  --pc-radius: 8px;
  --pc-max: 87.5rem;          /* Paceon's 1400px container */
  background: #fff;
}
main.pc-page .pc-inner {
  max-width: var(--pc-max);
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 4vw, 2.5rem);
}
main.pc-page .pc-sec { padding-block: clamp(3.5rem, 7vw, 6.25rem); }
main.pc-page .pc-sec[data-band="cream"] { background: #FAFAFA; }

/* ---------------------------------------------------------------- 0. page title band */
main.pc-page .pc-banner {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  place-items: center start;                  /* title left, so the photograph is visible */
  min-height: 32.375rem;                      /* Paceon's 518px */
  padding: clamp(8rem, 14vw, 10.5rem) clamp(1.25rem, 4vw, 2.5rem) clamp(3rem, 6vw, 4.5rem);
  background: var(--pc-ink);
  text-align: left;
}
main.pc-page .pc-banner--flat {
  background: linear-gradient(118deg, #0C0F16 0%, #3A0E12 58%, #D40F17 100%);
}
main.pc-page .pc-banner__img {
  position: absolute; inset: 0; z-index: -2;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 55%;
}
main.pc-page .pc-banner__scrim {
  position: absolute; inset: 0; z-index: -1;
  /* heavy under the copy on the left, clearing to the right so the city is actually
     visible; the bottom wash keeps the breadcrumb and credit legible */
  background:
    linear-gradient(90deg, rgba(12,15,22,.92) 0%, rgba(12,15,22,.80) 34%,
                    rgba(12,15,22,.34) 68%, rgba(12,15,22,.18) 100%),
    linear-gradient(0deg, rgba(12,15,22,.58) 0%, rgba(12,15,22,0) 48%);
}
@media (max-width: 48rem) {
  /* no room to clear a column on a phone, so the scrim goes back to a vertical wash */
  main.pc-page .pc-banner__scrim {
    background: linear-gradient(0deg, rgba(12,15,22,.92) 0%, rgba(12,15,22,.70) 55%,
                rgba(12,15,22,.58) 100%);
  }
}
main.pc-page .pc-banner__inner {
  position: relative; z-index: 1;
  width: 100%;
  max-width: var(--pc-max);
  margin-inline: auto;
}
main.pc-page .pc-banner__title { max-width: 40rem; }

/* breadcrumb, as the kit sets it under the title */
main.pc-page .pc-crumb { margin-top: 1.5rem; }
main.pc-page .pc-crumb ol {
  display: flex; flex-wrap: wrap;
  gap: .35rem .75rem; margin: 0; padding: 0; list-style: none;
}
main.pc-page .pc-crumb li { display: inline-flex; align-items: center; gap: .75rem; }
main.pc-page .pc-crumb li + li::before {
  content: "\27A4"; font-size: .6rem; color: var(--pc-peach);
}
main.pc-page .pc-crumb a { color: rgba(255,255,255,.80); text-decoration: none; }
main.pc-page .pc-crumb a:hover { color: #fff; }
main.pc-page .pc-crumb [aria-current] { color: var(--pc-peach); }

main.pc-page .pc-credit {
  margin: 1.6rem 0 0;
  color: rgba(255,255,255,.52);
}
main.pc-page .pc-credit a { color: rgba(255,255,255,.72); text-decoration: underline; }
main.pc-page .pc-credit__flag {
  display: inline-block;
  padding: .1rem .45rem;
  border: 1px solid rgba(255,199,194,.5);
  border-radius: 4px;
  color: var(--pc-peach);
}

/* ---------------------------------------------------------------- shared furniture */
main.pc-page .pc-eyebrow {
  display: inline-flex; align-items: center; gap: .5rem;
  margin-bottom: 1.1rem;
  color: var(--pc-accent);
}
main.pc-page .pc-eyebrow__chev { color: var(--pc-accent); opacity: .75; }
main.pc-page .pc-head { max-width: 46rem; margin: 0 auto clamp(2.25rem, 4vw, 3.25rem); text-align: center; }
main.pc-page .pc-head .pc-eyebrow { justify-content: center; }
main.pc-page .pc-sub { margin: 1rem 0 0; color: var(--pc-body); opacity: .82; }

main.pc-page .pc-btnrow { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.75rem; }
main.pc-page .pc-btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 1rem 1.625rem;                      /* Paceon's 16px 26px */
  text-decoration: none;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}
main.pc-page .pc-btn--solid { background: var(--pc-accent); color: #fff; }
main.pc-page .pc-btn--solid:hover { background: var(--pc-ink); }
main.pc-page .pc-btn--ghost { border: 1px solid var(--pc-line); color: var(--pc-ink); }
main.pc-page .pc-btn--ghost:hover { background: #F4F4F5; }
main.pc-page .pc-btn--light { background: var(--pc-peach); color: var(--pc-ink); }
main.pc-page .pc-btn--light:hover { background: #fff; }

main.pc-page .pc-tag {
  display: inline-flex; align-items: center;
  padding: .4rem .7rem;
  background: #F4F4F5; color: var(--pc-ink);
  text-decoration: none;
}
main.pc-page .pc-tag:hover { background: var(--pc-peach); }

/* ---------------------------------------------------------------- 1 & 2. two columns */
main.pc-page .pc-split { display: grid; gap: clamp(2rem, 4vw, 3.25rem); }
@media (min-width: 60rem) {
  main.pc-page .pc-split { grid-template-columns: 45% 1fr; align-items: start; }
  main.pc-page .pc-split--feat { grid-template-columns: 48% 1fr; }
  main.pc-page .pc-split__lead--sticky { position: sticky; top: 7rem; }
}
main.pc-page .pc-note {
  padding: clamp(1.75rem, 3vw, 2.5rem);
  background: var(--pc-peach);
  border-radius: var(--pc-radius);
}
main.pc-page .pc-note p + p { margin-top: .9rem; }
main.pc-page .pc-note p { color: #2A2020; }

/* the feature list */
main.pc-page .pc-feats { margin: 2.25rem 0 0; padding: 0; list-style: none; }
main.pc-page .pc-feat {
  display: flex; gap: 1.1rem;
  padding: 1.5rem 0;
  border-top: 1px solid var(--pc-line);
}
main.pc-page .pc-feat:last-child { padding-bottom: 0; }
main.pc-page .pc-feat__num {
  flex: none;
  display: grid; place-items: center;
  width: 2.75rem; height: 2.75rem;
  background: var(--pc-peach);
  border-radius: var(--pc-radius);
  color: var(--pc-ink);
}
main.pc-page .pc-feat__text > p { margin: .5rem 0 0; }
main.pc-page .pc-feat__meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.1rem;
  margin-top: .9rem !important;
}
main.pc-page .pc-feat__meta strong { color: var(--pc-ink); font-weight: 600; }

/* the solid block beside it: square on the inner edge, as the kit has it */
main.pc-page .pc-slab {
  padding: clamp(2rem, 3.4vw, 3.125rem);       /* Paceon's 50px */
  background: var(--pc-ink);
  border-radius: var(--pc-radius);
}
@media (min-width: 60rem) {
  main.pc-page .pc-slab { border-radius: 0 var(--pc-radius) var(--pc-radius) 0; }
}
main.pc-page .pc-slab .pc-eyebrow { color: var(--pc-peach); }
main.pc-page .pc-slab .pc-eyebrow__chev { color: var(--pc-peach); }
main.pc-page .pc-slab p { color: rgba(255,255,255,.76); }
main.pc-page .pc-facts { margin: 1.75rem 0 1.75rem; }
main.pc-page .pc-facts > div { padding: .9rem 0; border-top: 1px solid rgba(255,255,255,.14); }
main.pc-page .pc-facts dt {
  color: var(--pc-peach);
  margin-bottom: .25rem;
}
main.pc-page .pc-facts dd { margin: 0; color: rgba(255,255,255,.76); }

/* ---------------------------------------------------------------- 3. three column grid */
main.pc-page .pc-grid { display: grid; gap: 1.5rem; }       /* Paceon's 24px */
@media (min-width: 48rem) {
  main.pc-page :is(.pc-grid--2, .pc-grid--3) { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 64rem) {
  main.pc-page .pc-grid--3 { grid-template-columns: repeat(3, 1fr); }
}
main.pc-page .pc-card {
  padding: clamp(1.75rem, 2.6vw, 2.25rem);
  background: #F4F4F5;
  border-radius: var(--pc-radius);
}
main.pc-page .pc-card:nth-child(3n+1) { background: var(--pc-ink); }
main.pc-page .pc-card:nth-child(3n+1) p { color: rgba(255,255,255,.78); }
main.pc-page .pc-card:nth-child(3n+2) { background: var(--pc-peach); }
main.pc-page .pc-card:nth-child(3n+3) { background: var(--pc-accent); }
main.pc-page .pc-card:nth-child(3n+3) p { color: rgba(255,255,255,.88); }
main.pc-page .pc-card__num {
  display: inline-grid; place-items: center;
  width: 2.5rem; height: 2.5rem;
  margin-bottom: 1.1rem;
  background: rgba(0,0,0,.09);
  border-radius: var(--pc-radius);
}
main.pc-page .pc-card:nth-child(3n+1) .pc-card__num,
main.pc-page .pc-card:nth-child(3n+3) .pc-card__num { background: rgba(255,255,255,.18); }

main.pc-page .pc-pricewrap { margin-top: clamp(2.5rem, 4vw, 3.5rem); }
main.pc-page .pc-prices { width: 100%; margin-top: 1.1rem; border-collapse: collapse; }
main.pc-page .pc-prices td { padding: .85rem 0; border-top: 1px solid var(--pc-line); }
main.pc-page .pc-prices td:last-child { text-align: right; color: var(--pc-ink); font-weight: 600; }

/* ---------------------------------------------------------------- 5. quote cards */
main.pc-page .pc-quote {
  display: flex; flex-direction: column;
  padding: clamp(1.75rem, 2.6vw, 2.25rem);
  background: #fff;
  border: 1px solid var(--pc-line);
  border-radius: var(--pc-radius);
}
main.pc-page .pc-sec[data-band="cream"] .pc-quote { background: #fff; }
main.pc-page .pc-quote__claim { color: var(--pc-ink) !important; font-weight: 600; }
main.pc-page .pc-quote__detail { margin: .75rem 0 0; }
main.pc-page .pc-quote__foot {
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem;
  margin-top: auto; padding-top: 1.25rem;
}
main.pc-page .pc-quote__foot a { color: var(--pc-accent); }
main.pc-page .pc-quote__date { color: var(--pc-body); opacity: .6; }
main.pc-page .pc-status {
  padding: .22rem .5rem;
  background: var(--pc-peach);
  border-radius: 4px;
  color: #5A1014;
}

/* ---------------------------------------------------------------- faq accordion */
main.pc-page .pc-faq {
  padding: 1.15rem 0;
  border-top: 1px solid var(--pc-line);
}
main.pc-page .pc-faq:last-child { border-bottom: 1px solid var(--pc-line); }
main.pc-page .pc-faq summary {
  cursor: pointer; list-style: none;
  display: flex; justify-content: space-between; gap: 1rem;
  color: var(--pc-ink);
}
main.pc-page .pc-faq summary::-webkit-details-marker { display: none; }
main.pc-page .pc-faq summary::after { content: "+"; color: var(--pc-accent); }
main.pc-page .pc-faq[open] summary::after { content: "\2013"; }
main.pc-page .pc-faq p { margin: .8rem 0 0; }

/* ---------------------------------------------------------------- closing sources */
main.pc-page .pc-foot { max-width: 52rem; }
main.pc-page .pc-srclist {
  margin: 1.25rem 0 0; padding: 0; list-style: none;
  columns: 2; column-gap: 2.5rem;
}
@media (max-width: 48rem) { main.pc-page .pc-srclist { columns: 1; } }
main.pc-page .pc-srclist li {
  break-inside: avoid;
  padding: .5rem 0;
  border-top: 1px solid var(--pc-line);
}
main.pc-page .pc-srclist a { color: var(--pc-ink); }
main.pc-page .pc-srclist span { color: var(--pc-body); opacity: .6; }

/* ---------------------------------------------------------------- 4. cta band */
main.pc-page .pc-cta {
  padding-block: clamp(3.5rem, 7vw, 5.5rem);
  background: var(--pc-ink);
}
main.pc-page .pc-cta__row { display: grid; gap: 2rem; align-items: center; }
@media (min-width: 60rem) {
  main.pc-page .pc-cta__row { grid-template-columns: 1fr auto; }
}
main.pc-page .pc-cta__text { max-width: 44rem; }
main.pc-page .pc-cta .pc-eyebrow { color: var(--pc-peach); }
main.pc-page .pc-cta .pc-eyebrow__chev { color: var(--pc-peach); }
main.pc-page .pc-cta p { margin-top: 1rem; color: rgba(255,255,255,.76); }

/* =====================================================================================
   TYPE, at the weight the site's own id-level and !important rules require.
   Paceon: Archivo 73px/-2px titles, 50px/-1.8px section heads, 21px/-1px feature titles,
   Inter Tight 16px/25.6px body, 13px/3px-tracking eyebrows, 13px/1px buttons.
   ===================================================================================== */
html.vc-site #main.pc-page :is(h1, h2, h3, .pc-h2, .pc-banner__title, .pc-cta__h,
                               .pc-feat__title, .pc-card__h, .pc-slab__h, .pc-foot__h) {
  font-family: "Archivo", "Plus Jakarta Sans", system-ui, sans-serif !important;
  text-transform: uppercase;
  font-weight: 700 !important;
  letter-spacing: -0.036em !important;
  margin: 0;
}
html.vc-site #main.pc-page .pc-banner__title {
  font-size: clamp(2.1rem, 5vw, 3.6rem) !important;
  line-height: 1.04 !important;
  color: #fff !important;
}
html.vc-site #main.pc-page :is(.pc-h2, .pc-cta__h) {
  font-size: clamp(1.75rem, 3.5vw, 3.125rem) !important;   /* 50px */
  line-height: 1.08 !important;
  color: var(--pc-ink);
}
html.vc-site #main.pc-page .pc-cta__h { color: #fff !important; }
html.vc-site #main.pc-page :is(.pc-feat__title, .pc-card__h, .pc-slab__h, .pc-foot__h) {
  font-size: 1.3125rem !important;             /* 21px */
  line-height: 1.2 !important;
  letter-spacing: -0.048em !important;         /* Paceon's -1px at 21px */
}
html.vc-site #main.pc-page .pc-slab__h { color: #fff !important; }
html.vc-site #main.pc-page .pc-slab__h--ink { color: var(--pc-ink) !important; }
html.vc-site #main.pc-page .pc-card:nth-child(3n+1) .pc-card__h,
html.vc-site #main.pc-page .pc-card:nth-child(3n+3) .pc-card__h { color: #fff !important; }
html.vc-site #main.pc-page .pc-feat__title { color: var(--pc-ink) !important; }

html.vc-site #main.pc-page :is(p, li, dd, summary, td, figcaption, .pc-note__answer) {
  font-family: "Inter Tight", "Plus Jakarta Sans", system-ui, sans-serif !important;
  font-size: 1rem !important;
  line-height: 1.6 !important;                 /* 16px / 25.6px */
  color: var(--pc-body);
}
html.vc-site #main.pc-page .pc-note__answer { font-size: 1.0625rem !important; font-weight: 500; }
html.vc-site #main.pc-page :is(.pc-eyebrow, .pc-facts dt) {
  font-family: "Inter Tight", system-ui, sans-serif !important;
  font-size: .8125rem !important;              /* 13px */
  font-weight: 600 !important;
  letter-spacing: .23em !important;            /* Paceon's 3px */
  line-height: 1.4 !important;
  text-transform: uppercase;
}
html.vc-site #main.pc-page .pc-btn {
  font-family: "Archivo", system-ui, sans-serif !important;
  font-size: .8125rem !important;
  font-weight: 600 !important;
  letter-spacing: .077em !important;           /* Paceon's 1px */
  text-transform: uppercase;
  border-radius: var(--pc-radius) !important;
}
html.vc-site #main.pc-page :is(.pc-tag, .pc-status, .pc-credit, .pc-crumb a,
                               .pc-crumb li, .pc-quote__date, .pc-srclist span) {
  font-family: "Inter Tight", system-ui, sans-serif !important;
  font-size: .75rem !important;
  letter-spacing: .06em;
  text-transform: uppercase;
  line-height: 1.5 !important;
}
html.vc-site #main.pc-page .pc-credit { text-transform: none; letter-spacing: 0; }
html.vc-site #main.pc-page :is(.pc-feat__meta, .pc-quote__foot, .pc-srclist li) {
  font-size: .8125rem !important;
}
html.vc-site #main.pc-page :is(.pc-card, .pc-quote, .pc-note, .pc-slab, .pc-feat__num,
                               .pc-card__num, .pc-tag, .pc-banner__img) {
  border-radius: var(--pc-radius) !important;
}
@media (min-width: 60rem) {
  html.vc-site #main.pc-page .pc-slab {
    border-radius: 0 var(--pc-radius) var(--pc-radius) 0 !important;
  }
}

/* ---------------------------------------------------------------------------
   Banner furniture, at id-level weight.

   `html.vc-site #main.pc-page :is(p, li, dd, …)` carries an id, so it was repainting
   the current breadcrumb item and the photo credit in the body grey — dark grey text
   on a dark photograph, i.e. invisible. Class-only rules cannot win against it.

   The credit also moves out of the centred stack: Paceon's banner is a title and a
   breadcrumb, and a centred attribution line underneath reads as clutter.
   --------------------------------------------------------------------------- */
html.vc-site #main.pc-page .pc-crumb li { color: rgba(255,255,255,.80) !important; }
html.vc-site #main.pc-page .pc-crumb [aria-current] { color: var(--pc-peach) !important; }
html.vc-site #main.pc-page .pc-credit {
  color: rgba(255,255,255,.50) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: .6875rem !important;
}
html.vc-site #main.pc-page .pc-credit a {
  color: rgba(255,255,255,.72) !important;
  text-transform: none !important;
}
html.vc-site #main.pc-page .pc-credit__flag {
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  color: var(--pc-peach) !important;
}
@media (min-width: 48rem) {
  main.pc-page .pc-banner { padding-bottom: clamp(3.5rem, 6vw, 5rem); }
  main.pc-page .pc-credit {
    position: absolute;
    right: clamp(1.25rem, 4vw, 2.5rem);
    bottom: 1rem;
    z-index: 2;
    margin: 0;
    max-width: 24rem;
    text-align: right;
  }
}


/* ======================================================================================
   HUB HERO VIDEO, restored 15 Oct 2026.

   The Paceon rewrite trimmed this block out. Nothing else styles .loc-hero__video, so the
   <video> fell back to an inline, full-width element: it pushed the copy down the page and
   rendered as a wide band instead of sitting behind the headline. Restored verbatim.
   ====================================================================================== */

/* =====================================================================================
   LOCATIONS HERO VIDEO (15 Oct 2026)
   Replaces the gradient with footage. The scrim is doing real work: it keeps the
   headline legible over moving, variably lit frames rather than relying on the video
   staying dark. Falls back to the poster frame, and to a still frame under
   prefers-reduced-motion.
   ===================================================================================== */
main.loc-hub .loc-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--loc-black, #0C0F16);
  background-image: none !important;
  min-height: clamp(26rem, 46vw, 34rem);
  display: flex;
  align-items: flex-end;
}
main.loc-hub .loc-hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -2;
}
/* dark at the left where the copy sits, clearing toward the right */
main.loc-hub .loc-hero__scrim {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(12,15,22,.92) 0%, rgba(12,15,22,.78) 38%,
                    rgba(12,15,22,.38) 70%, rgba(12,15,22,.22) 100%),
    linear-gradient(0deg, rgba(12,15,22,.55) 0%, rgba(12,15,22,0) 55%),
    linear-gradient(120deg, rgba(212,15,23,.30) 0%, rgba(212,15,23,0) 55%);
}
main.loc-hub .loc-hero__inner { position: relative; z-index: 1; max-width: 46rem; }
main.loc-hub .loc-hero h1 {
  color: #fff;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .45);
}
main.loc-hub .loc-hero .loc-hero__lede {
  color: rgba(255, 255, 255, .88);
  text-shadow: 0 1px 12px rgba(0, 0, 0, .45);
}
main.loc-hub .loc-hero .td-kicker { color: var(--loc-peach, #FFC7C2); }
main.loc-hub .loc-hero .td-kicker::before { background: var(--loc-peach, #FFC7C2); }

@media (prefers-reduced-motion: reduce) {
  main.loc-hub .loc-hero__video { display: none; }
  main.loc-hub .loc-hero {
    background-image: url("/images/locations-hero-poster.jpg") !important;
    background-size: cover;
    background-position: center;
  }
}


/* Any .loc-pinlabel left in an older cached page stays hidden: labels are tooltips now. */
main.loc-hub .loc-pinlabel { display: none !important; }

/* ======================================================================================
   CONTRAST ON THE DARK AND RED PANELS (15 Oct 2026)

   Measured, not eyeballed. `html.vc-site #main.pc-page :is(p, li, dd, …)` carries an id,
   so it was repainting every paragraph the body grey #434E4E regardless of what it sat
   on. Against black that is 2.23:1 and against the red card 1.59:1, both well under the
   4.5:1 AA threshold; the card numbers were black on black at 1.00:1, i.e. invisible.
   These rules match that weight so the light text actually lands.
   ====================================================================================== */
html.vc-site #main.pc-page :is(.pc-slab, .pc-cta) :is(p, li, dd, span) {
  color: rgba(255,255,255,.80) !important;
}
html.vc-site #main.pc-page .pc-slab dt { color: var(--pc-peach) !important; }

html.vc-site #main.pc-page .pc-card:nth-child(3n+1) :is(p, li, span) {
  color: rgba(255,255,255,.82) !important;
}
html.vc-site #main.pc-page .pc-card:nth-child(3n+3) :is(p, li, span) {
  color: rgba(255,255,255,.92) !important;
}
/* the numbered tile: white on the dark and red cards, ink on the pale ones */
html.vc-site #main.pc-page :is(.pc-card:nth-child(3n+1), .pc-card:nth-child(3n+3)) .pc-card__num {
  color: #fff !important;
}
html.vc-site #main.pc-page .pc-card:nth-child(3n+2) .pc-card__num,
html.vc-site #main.pc-page .pc-card:nth-child(3n+3) .pc-card__num,
html.vc-site #main.pc-page .pc-card__num { font-weight: 600; }
html.vc-site #main.pc-page .pc-card:nth-child(3n+2) .pc-card__num { color: var(--pc-ink) !important; }

/* peach panel: the ink is dark on purpose, keep it that way against the id rule */
html.vc-site #main.pc-page .pc-note :is(p, li) { color: #2A2020 !important; }
html.vc-site #main.pc-page .pc-feat__num { color: var(--pc-ink) !important; }

/* ======================================================================================
   PACEON SECTION 2, MATCHED (15 Oct 2026)

   The kit runs a photograph down the left of this band and a solid colour panel down the
   right, and the four points inside that panel are an accordion rather than a stacked
   list. Measured from the kit: items are transparent at a 10px gap, titles are Archivo
   19px/700 at -0.7px uppercase with 16px under them, an open title takes the accent
   colour and a closed one stays white, bodies run 16px/24px, and the chevron turns.
   They open independently, so <details> carries it and it works without JavaScript.
   ====================================================================================== */
main.pc-page .pc-shot { margin: 0; align-self: stretch; }
main.pc-page .pc-shot__img {
  display: block;
  width: 100%;
  height: clamp(18rem, 40vw, 34rem);
  object-fit: cover;
  object-position: center 35%;          /* a different crop from the banner's 55% */
  border-radius: var(--pc-radius) 0 0 var(--pc-radius);
}
@media (max-width: 59.99rem) {
  main.pc-page .pc-shot__img { border-radius: var(--pc-radius); min-height: 14rem; }
}

main.pc-page .pc-accs { margin-top: 1.75rem; }
main.pc-page .pc-acc { margin-bottom: 10px; }    /* the kit's gap */
main.pc-page .pc-acc__t {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 0 0 1rem;                             /* the kit's 16px under the title */
  border-bottom: 1px solid rgba(255, 255, 255, .22);
  cursor: pointer;
  list-style: none;
  color: #fff;
  transition: color .2s ease;
}
main.pc-page .pc-acc__t::-webkit-details-marker { display: none; }
main.pc-page .pc-acc[open] > .pc-acc__t { color: var(--pc-peach); }
main.pc-page .pc-acc__t:hover { color: var(--pc-peach); }

/* the chevron, turning to point up once the item is open */
main.pc-page .pc-acc__i {
  flex: none;
  width: .6rem; height: .6rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translate(-.1rem, -.1rem);
  transition: transform .3s ease;
}
main.pc-page .pc-acc[open]:not(.is-closing) > .pc-acc__t .pc-acc__i {
  transform: rotate(-135deg) translate(-.15rem, -.15rem);
}

/* 0fr to 1fr animates a height the browser works out for itself */
main.pc-page .pc-acc__w {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .32s cubic-bezier(.4, 0, .2, 1);
}
main.pc-page .pc-acc[open] > .pc-acc__w { grid-template-rows: 1fr; }
main.pc-page .pc-acc.is-closing > .pc-acc__w { grid-template-rows: 0fr; }
main.pc-page .pc-acc__c { overflow: hidden; min-height: 0; }
main.pc-page .pc-acc__c > :first-child { padding-top: 1rem; }
main.pc-page .pc-acc__c > p + p { margin-top: .75rem; }
main.pc-page .pc-acc__meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.1rem;
  margin-top: .9rem;
}
@media (prefers-reduced-motion: reduce) {
  main.pc-page :is(.pc-acc__w, .pc-acc__i) { transition: none; }
}

/* the band is now photograph and panel, so the panel is square on its inner edge only */
@media (min-width: 60rem) {
  main.pc-page .pc-split--feat { grid-template-columns: 48% 1fr; align-items: start; }
  main.pc-page .pc-shot { position: sticky; top: 7rem; }
  main.pc-page .pc-shot__img { height: clamp(26rem, 42vw, 38rem); }
}

/* --- type and colour, at the id-level weight the site's own rules require --- */
html.vc-site #main.pc-page .pc-acc__t {
  font-family: "Archivo", "Plus Jakarta Sans", system-ui, sans-serif !important;
  font-size: 1.1875rem !important;               /* the kit's 19px */
  font-weight: 700 !important;
  letter-spacing: -0.037em !important;           /* the kit's -0.7px at 19px */
  line-height: 1.25 !important;
  text-transform: uppercase;
  color: #fff !important;
}
html.vc-site #main.pc-page .pc-acc[open] > .pc-acc__t,
html.vc-site #main.pc-page .pc-acc__t:hover { color: var(--pc-peach) !important; }
html.vc-site #main.pc-page .pc-acc__c :is(p, dd, span) {
  font-size: 1rem !important;
  line-height: 1.5 !important;                   /* the kit's 16px/24px */
  color: rgba(255, 255, 255, .82) !important;
}
html.vc-site #main.pc-page .pc-acc__c strong { color: #fff !important; }
html.vc-site #main.pc-page .pc-acc__meta { font-size: .8125rem !important; }
html.vc-site #main.pc-page .pc-slab .pc-sub { color: rgba(255, 255, 255, .72) !important; }
html.vc-site #main.pc-page .pc-shot__img {
  border-radius: var(--pc-radius) 0 0 var(--pc-radius) !important;
}
@media (max-width: 59.99rem) {
  html.vc-site #main.pc-page .pc-shot__img { border-radius: var(--pc-radius) !important; }
}

/* ======================================================================================
   ALIGNMENT, taken back from the site's blanket centring (15 Oct 2026)

   about.6qAjRcHO.css centres every heading in the page and the paragraph after it:

     main h1:not([class*="text-left"]), main h2:not([class*="text-left"]),
     main h1:not([class*="text-left"]) + p, main h2:not([class*="text-left"]) + p
       { text-align: center }

   That is why the banner title stayed centred after the band was set to left, and why
   the section headings and their standfirsts were centred against left-aligned bodies.
   The kit centres a header only when it sits above a full width grid; everything in a
   two column block runs left. These rules say which is which, at id weight.
   ====================================================================================== */
html.vc-site #main.pc-page :is(.pc-banner__title, .pc-crumb, .pc-credit),
html.vc-site #main.pc-page :is(.pc-split__lead, .pc-split__body, .pc-slab, .pc-cta__text,
                               .pc-foot, .pc-card, .pc-quote, .pc-acc) :is(h1, h2, h3, p, li, dd, dt) {
  text-align: left !important;
}
/* ...and the centred header above a grid stays centred, as the kit has it */
html.vc-site #main.pc-page .pc-head :is(h2, .pc-h2, .pc-sub, .pc-eyebrow) {
  text-align: center !important;
}

/* ======================================================================================
   THE HUB, after the location pages moved to the pc-* classes (15 Oct 2026)

   The hub still builds on .loc-panel and .loc-card. The Paceon block above was written
   when the location pages used them too, and once those pages moved on it was landing
   only here: white panels with their horizontal padding stripped, running off the edge
   of the band, and a dark call to action whose heading computed ink-on-ink at 1:1.
   ====================================================================================== */
main.loc-hub .loc-panel {
  background: #fff;
  border: 1px solid #EAEFF5;
  box-shadow: rgba(71, 85, 95, .08) 0 0 10px 1px;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  border-radius: 6px !important;
}
main.loc-hub .loc-panel + .loc-panel { margin-top: clamp(.85rem, 1.3vw, 1.15rem); }
main.loc-hub .loc-panel > :first-child { margin-top: 0; }
main.loc-hub .loc-panel--tint { background: var(--color-lyd-surface); box-shadow: none; }
main.loc-hub .loc-panel--dark {
  background: var(--loc-black, #0C0F16);
  border-color: transparent;
}
/* the heading was black on black; the site's id-level rules need matching to fix it */
html.vc-site #main.loc-hub .loc-panel--dark :is(h1, h2, h3, strong) { color: #fff !important; }
html.vc-site #main.loc-hub .loc-panel--dark :is(p, li, dd, span) {
  color: rgba(255, 255, 255, .80) !important;
}
html.vc-site #main.loc-hub .loc-panel--dark .td-kicker { color: var(--loc-peach, #FFC7C2) !important; }
html.vc-site #main.loc-hub .loc-panel--dark a[href]:not(.td-cta) { color: #fff !important; }

/* ======================================================================================
   THE OFFERS SECTION, on the kit's about-intro layout (15 Oct 2026)

   Measured from Paceon's about page: a narrow left column holding the eyebrow and the
   heading, and a wider right column holding the standfirst, a button, a grid of solid
   colour cards with an accent icon, a hairline rule, then a row of large figures over
   small uppercase labels. The kit uses one colour for every card rather than cycling.
   ====================================================================================== */
@media (min-width: 60rem) {
  main.pc-page .pc-split--offers { grid-template-columns: 42% 1fr; align-items: start; }
}
main.pc-page .pc-stand { max-width: 40rem; }
main.pc-page .pc-split--offers .pc-btnrow { margin-top: 1.5rem; }

main.pc-page .pc-ogrid { display: grid; gap: 1.25rem; margin-top: 2.25rem; }
@media (min-width: 40rem) { main.pc-page .pc-ogrid { grid-template-columns: repeat(2, 1fr); } }
main.pc-page .pc-ogrid > :last-child:nth-child(odd) { grid-column: 1 / -1; }

main.pc-page .pc-ocard {
  padding: clamp(1.5rem, 2.4vw, 2rem);
  background: var(--pc-accent);
  border-radius: var(--pc-radius);
}
main.pc-page .pc-ocard__i {
  display: inline-grid; place-items: center;
  width: 2.5rem; height: 2.5rem;
  margin-bottom: .9rem;
  color: var(--pc-peach);                    /* the kit's accent on a solid card */
}
main.pc-page .pc-ocard__i svg { width: 1.6rem; height: 1.6rem; }
main.pc-page .pc-ocard__k { display: block; margin-bottom: .2rem; }
main.pc-page .pc-ocard p { margin: .5rem 0 0; }

main.pc-page .pc-rule {
  height: 0; margin: 2.25rem 0 1.75rem;
  border-top: 1px solid var(--pc-line);
}
main.pc-page .pc-figs { display: grid; gap: 1.25rem; }
@media (min-width: 40rem) { main.pc-page .pc-figs { grid-template-columns: repeat(3, 1fr); } }
main.pc-page .pc-fig__n { display: block; }
main.pc-page .pc-fig__l { display: block; margin-top: .25rem; }

/* --- type and colour, at the weight this site's id-level rules require --- */
html.vc-site #main.pc-page .pc-ocard__h {
  font-family: "Archivo", "Plus Jakarta Sans", system-ui, sans-serif !important;
  font-size: 1.3125rem !important;
  line-height: 1.2 !important;
  letter-spacing: -0.048em !important;
  text-transform: uppercase;
  color: #fff !important;
  margin: 0;
}
html.vc-site #main.pc-page .pc-ocard p { color: rgba(255, 255, 255, .90) !important; }
html.vc-site #main.pc-page .pc-ocard__k {
  font-family: "Inter Tight", system-ui, sans-serif !important;
  font-size: .75rem !important;
  font-weight: 600 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase;
  color: var(--pc-peach) !important;
}
html.vc-site #main.pc-page .pc-stand {
  font-size: 1.0625rem !important;
  line-height: 1.6 !important;
}
html.vc-site #main.pc-page .pc-fig__n {
  font-family: "Archivo", "Plus Jakarta Sans", system-ui, sans-serif !important;
  font-size: clamp(2rem, 3.4vw, 2.75rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.04em !important;
  line-height: 1.05 !important;
  color: var(--pc-ink) !important;
}
html.vc-site #main.pc-page .pc-fig__l {
  font-family: "Inter Tight", system-ui, sans-serif !important;
  font-size: .75rem !important;
  font-weight: 600 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase;
  color: var(--pc-accent) !important;
}
html.vc-site #main.pc-page :is(.pc-ocard, .pc-ocard__i) { border-radius: 8px !important; }
html.vc-site #main.pc-page :is(.pc-split--offers, .pc-ocard, .pc-figs) :is(h2, h3, p, span) {
  text-align: left !important;
}

/* Peach on the red card is 3.66:1, under AA for a 12px kicker, and it is the same pair
   that failed on the aged care banner. White on the same red is 5.41:1. The icon keeps
   the peach: at 3.66:1 it clears the 3:1 that non-text graphics need. */
html.vc-site #main.pc-page .pc-ocard__k { color: rgba(255, 255, 255, .92) !important; }

/* ======================================================================================
   EMPHASIS INSIDE HEADINGS (15 Oct 2026)

   Archivo is loaded upright only, so an <em> in a heading was being synthesised as a
   slanted face. Uppercased and slanted, the last letter overhangs its own box and the
   browser clips it, which is why the T in "KEPT" rendered as a 7.

   The hub's intro already handled this by setting the emphasis upright and red. Every
   heading does it now, so emphasis reads in the same face as the rest of the page.
   ====================================================================================== */
html.vc-site #main.loc-hub :is(h1, h2, h3) em,
html.vc-site #main.loc-page :is(h1, h2, h3) em,
html.vc-site #main.pc-page :is(h1, h2, h3, .pc-h2) em {
  /* the bundle lists `em` alongside body copy and forces the body face on it with
     !important, so emphasis inside a heading was set in a different family from the
     words either side of it. It takes the heading's face. */
  font-family: inherit !important;
  font-weight: inherit !important;
  letter-spacing: inherit !important;
  font-style: normal !important;
  font-synthesis: none;
  color: var(--loc-red, #D40F17);
}

/* The state cards open on click now, so the summary needs to look like a control. */
main.loc-hub .loc-sum-meta { display: inline-flex; align-items: center; gap: .6rem; }
main.loc-hub .loc-caret {
  width: .5rem; height: .5rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translate(-.08rem, -.08rem);
  transition: transform .25s ease;
  opacity: .65;
}
main.loc-hub .ova-network[open] .loc-caret {
  transform: rotate(-135deg) translate(-.12rem, -.12rem);
}
main.loc-hub .ova-network > summary { cursor: pointer; list-style: none; }
main.loc-hub .ova-network > summary::-webkit-details-marker { display: none; }
@media (prefers-reduced-motion: reduce) { main.loc-hub .loc-caret { transition: none; } }

/* The hub's panel headings ran to 50px, the size the kit uses for a section head above a
   full width grid. On a panel, over a short line like "Coverage, explained", that read as
   shouting. They come down to 36px; the hub intro keeps the larger size. */
html.vc-site #main.loc-hub section .loc-panel h2 {
  font-size: clamp(1.5rem, 2.6vw, 2.25rem) !important;
  line-height: 1.12 !important;
}