/*
 * Summit: the frame (header, phone menu, footer, announcement, breadcrumbs, the page not found), the openings and the
 * article the theme draws itself, and how the Theme Kit's sections are laid on the page (by their type, from
 * includes/stitch.php). The look inside a kit block is in kit-theme.css.
 *
 * The idea: a good trail map and an outdoor brand's catalogue. Big landscape photographs that end in the jagged line of
 * a mountain ridge, quiet contour lines on the coloured bands, small labels set like a map's (spaced capitals, figures of
 * one width, a little triangle), each section's waypoint on the trail (a painted trail blaze and its number), badges
 * like embroidered patches (a fill with a stitched ring inside), sturdy heavy headings.
 *
 * Colours come only from the palette's twelve tokens (palettes/*.css, or a website's own colours): --background,
 * --surface, --surface-alt, --primary, --primary-alt, --accent, --accent-ink, --on-accent, --on-primary,
 * --text-primary, --text-secondary, --border. A text colour is only ever set on a fill its colour contract keeps
 * readable (cms/cms/core/data/theme-colour-tokens.json): text-primary, text-secondary and accent-ink on background,
 * surface and surface-alt; on-primary on primary and primary-alt; on-accent on accent. theme-colour-pairs.test.mjs
 * reads every rule here that sets both a background and a colour and fails for any other pair. White words stand only on
 * a photograph under the theme's own dark shade. A dark palette is just other values for the same tokens.
 *
 * Type comes from the layout: --font-heading, --font-body, --summit-heading-weight and --summit-body-strong (the
 * heaviest weights the font palette loads). Never write a font-weight number other than 400 here.
 */

/* ------------------------------------------------------------------ Tokens */

/* :where(:root) has no weight: the layout's inline values, the palette and a website's own colours always win over these
   defaults, wherever this file is linked. */
:where(:root) {
  --summit-width: 75rem;
  --summit-gutter: clamp(1.125rem, 4vw, 2.5rem);
  --summit-bar: 4.5rem;
  --summit-head: var(--summit-bar);
  --summit-radius: 0.75rem;
  --summit-button-radius: 0.5rem;
  --summit-heading-weight: 800;
  --summit-body-strong: 600;
  --summit-speed: 180ms;
  --summit-line: var(--border, #d4cdb9);
  /* How tall the ridge at the foot of a photograph rises. */
  --summit-ridge: clamp(1.4rem, 4.2vw, 4.25rem);
  /* The contour lines: one tile of a map that repeats without a seam (made by .tmp/themes-157/summit/topo.mjs). Used as a
     mask over a layer of a palette colour, so the lines take any palette's colours. */
  --summit-topo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='900' viewBox='0 0 900 900'%3E%3Cg fill='none' stroke='black'%3E%3Cpath d='M256 99l0 0M240 80l0 0M744 512l0 0M173 0l-9 16-2 12 1 16 5 11 32 37 8 15 16 38 12 18 8 8 10 5 10 3 12 1 16-1 20-5 17-6 14-8 9-8 7-12 2-8-1-12-4-8-7-8-17-12-24-10-48-16-20-11-8-7-8-12-11-36M640 436l0 0M20 783l0 0M213 900l-6-12-6-4-5 0-12 5-11 11M38 0l-22 12-16 6M125 0l-1 28 2 20 4 16 7 12 7 8 28 22 12 12 12 17 20 36 12 14 9 7 11 4 12 3 12 1 24-3 92-14 16-4 12-5 17-14 15-22 8-22 1-20-3-16-6-12-8-8-9-4-15-1-36 10-24 2-36-5-32-11-16-9-10-10-7-16-1-16M870 0l3 8 7 8 8 3 12-1M900 585l-16-13-11-12-29-44-17-20-23-15-56-22-24-15-44-42-48-36-12-14-20-31-8-7-8-5-16-3-16 0-20 5-19 9-24 16-45 36-10 12-5 12 1 12 3 8 8 8 11 5 12 1 12 0 48-9 20-2 16 4 8 4 5 5 5 8 3 12 1 12-2 12-7 20-22 40-7 20 0 8 2 8 10 9 52 19 12 8 28 23 11 5 9 2 12 0 12-3 56-24 28-7 16-1 16 1 12 4 12 8 8 11 5 13 2 16 3 40 2 18 4 14 14 36 4 20 1 32-5 64 0 20M38 900l51-28 17-12 8-12 1-8 0-12-2-12-5-12-13-20-19-18-42-30-8-8-5-8-4-12-1-16 8-52-1-20-3-11-4-7-16-17M254 900l4-40-1-12-2-8-6-8-9-7-12-5-12-1-16 1-20 7-22 13-16 12-7 8-5 8-3 12-2 20M269 0l3 16 8 14 14 10 18 7 20 4 20-1 16-3 40-14 20-2 12 2 8 3 11 8 7 8 9 20 5 24-1 24-6 20-13 24-9 12-11 12-16 10-20 6-12 1-48-3-60 7-20 0-20-3-16-7-8-7-8-9-24-41-12-15-16-14-30-17-13-12-6-16-8-48-5-12-6-5-12-2-20 6-60 33M853 0l0 12 3 12 4 8 4 5 8 5 8 1 8 0 12-3M900 563l-20-19-30-40-18-18-23-14-57-24-13-8-15-12-32-32-44-40-12-16-20-36-8-8-8-4-16-4-16 1-24 4-20 7-24 13-56 38-42 21-4 4-2 4 2 16 10 24 12 16 12 8 12 3 16 1 52-9 20 0 8 1 8 3 8 9 3 8 1 8-2 16-7 16-22 44-7 20-1 8 1 8 5 8 5 4 12 5 36 9 16 6 16 9 28 23 8 5 12 3 12 0 16-3 60-26 24-6 16-1 12 2 12 6 8 7 6 9 5 16 4 52 4 20 18 48 6 24 1 16-1 20-10 64M328 324l0 0M269 900l5-40 0-16-7-16-11-12-16-8-20-3-20 0-40 5-16-2-12-8-32-32-42-32-12-12-9-16-3-16 0-16 7-48-1-12-2-12-6-12-7-8-25-21M286 0l3 12 5 8 10 8 12 5 16 2 16-1 52-16 16-3 16-1 16 3 15 7 13 12 8 12 9 24 4 28-2 24-7 24-16 29-20 25-20 16-20 7-12 2-12-1-36-8-16-2-20 0-52 4-16-2-12-3-16-8-11-11-27-44-14-16-8-6-12-7-12-4-16-3-23 0-13 4-8 9-20 34-12 15-12 9-4 1-4-2-4-6 0-8 2-12 6-12 8-11 8-7 28-17 7-9 4-12 2-16 1-16-2-12-3-8-5-6-8-3-8 0-12 5-32 20-16 7M839 0l-1 16 1 16 5 14 7 10 9 6 12 4 12 0 16-3M900 545l-16-17-28-36-16-15-20-12-60-25-16-10-16-14-55-56-14-16-9-16-13-36-7-12-10-7-12-4-12 0-20 3-24 5-24 8-28 13-52 33-12 5-12 3-12 0-12-5-28-26-12-7-16-3-16 3-8 4-8 7-12 16-7 16-13 36-8 16-12 12-28 20-9 8-7 9-5 11 0 12 2 4 6 4 13 2 16-3 16-7 12-8 25-32 15-11 12-5 12-3 12-1 12 2 8 4 8 7 24 33 8 6 8 3 12 2 12 0 52-7 16 0 12 2 6 4 4 4 3 12-3 16-8 20-22 44-6 20-1 8 3 8 8 8 16 5 44 7 20 7 16 9 32 28 8 4 8 2 12 0 16-3 64-27 20-5 20-1 8 2 9 4 8 8 8 16 10 72 5 17 14 35 5 20 1 16-1 20-12 60M286 900l3-40-1-20-4-12-4-7-12-12-16-9-20-6-20-2-44-2-20-5-16-9-47-36-23-20-9-16-5-20 1-20 7-48 0-12-3-12-4-8-9-10-40-29M656 819l0 0M487 0l9 7 8 9 7 12 7 16 7 32 1 16-1 20-4 28-8 24-17 36-34 60-1 4 2 4 9 0 50-12 90-27 20-2 16 4 11 9 6 12 5 16 9 40 9 24 17 24 28 32 23 22 23 14 21 8 52 15 16 8 12 12 20 33M605 0l2 16 3 12 6 11 7 9 9 8 12 7 12 4 12 1 8-1 8-6 24-37 22-24M810 0l-3 60-4 16-5 12-6 7-12 6-38 7-10 4-4 4-1 8 2 4 7 6 8 3 8 0 20-3 32-13 12-3 24 0 17 6 7 6 5 10 7 48 7 24 7 16 10 13M0 500l12 15 12 10 16 8 20 6 16 2 16-3 12-5 16-11 12-10 12-14 25-46 12-16 17-16 38-28 19-20 11-20 16-44 17-36 2-8-3-8-6-4-12-4-44-8-16-6-11-6-9-7-8-9-20-32-9-12-11-9-8-3-8-1-16 2-8 4-12 9-20 21-36 46-12 10-8 3-8 0-8-3-8-6M605 900l-1-40-5-48 1-25 4-19 8-19 12-19 4-6 3 0-1-4-2-3-13-29-14-24-7-8-10-8-20-9-28-3-52 2-16-1-15-5-8-8-6-12-3-12 0-12 1-12 7-12 20-20 9-12 3-8 1-8-2-4-3-3-4-1-8 0-8 3-8 5-11 12-13 24-8 7-12 4-16 1-16-2-16-7-13-11-19-25-7-7-13-6-12-1-16 2-20 3-36 12-20 11-36 27-40 19-12 8-8 9-8 12-8 18-6 18-3 16 0 12 1 12 4 12 8 13 16 15 24 17 24 14 16 6 16 4 72 13 19 6 14 8 11 10 8 11 7 19 11 44 6 10 8 5 8 2 12 1 52-6 32 0 24 4 19 8M810 900l3-24 10-44 1-12-2-16-13-48-10-60-5-20-6-9-8-7-8-3-12-1-16 2-16 5-45 21-20 12-17 12-13 12-1 4 14 28 9 12 9 9 23 15 53 24 11 8 9 12 3 8 1 8-1 8-3 8-10 16-20 20M522 0l9 12 8 16 4 16 2 24-3 32-5 32-5 24-15 52 0 12 3 6 4 2 8 2 16-1 60-17 28-4 16 0 12 5 8 9 4 10 5 16 11 56 6 16 9 16 18 24 27 29 19 15 17 9 16 5 20 4 16 0 16-3 12-6 8-7 24-29M578 0l0 16 2 12 5 12 9 12 7 8 15 11 42 25 11 8 10 12 17 31 10 9 14 5 16 0 20-2 48-9 16-1 12 1 12 7 6 7 6 10 24 62 8 14 12 15M757 0l-15 12-11 12-7 12-3 12 1 12 5 8 9 5 12 3 12-2 12-4 7-6 6-8 4-12 2-16-1-16-4-12M0 377l28-36 8-8 8-4 8 0 12 4 12 10 7 9 5 12 2 12-2 12-4 12-8 11-8 8-41 33-6 8-3 12 2 12 3 8 6 8 10 8 9 4 12 2 12 0 12-3 20-11 16-13 12-13 24-34 12-12 15-12 41-27 18-17 11-16 8-20 9-32 2-20-3-12-7-8-10-5-36-13-20-13-13-13-19-28-8-9-8-6-12-4-8 1-12 4-20 15-19 23-29 45-12 14-8 4-8-1-8-3-12-10M578 900l4-100 4-24 12-48 3-16-1-12-2-12-6-12-5-8-8-8-11-7-12-4-12-2-28 0-68 10-12 0-8-2-9-7-15-32-10-12-10-7-28-11-16-9-15-13-21-24-10-8-14-5-12-1-20 3-20 8-16 11-32 28-14 8-38 16-17 12-7 9-7 11-5 12-3 12-1 12 2 12 4 12 5 8 11 12 15 12 23 15 20 9 28 8 76 13 20 7 12 6 10 10 8 12 18 52 8 10 8 6 8 2 12 2 68-1 32 3 16 4 12 5 9 5 9 8M732 672l0 0M786 900l-6-7-4-1-8 2-11 6M576 87l0 0M900 302l-6-14-18-34-28-63-12-15-12-7-16-3-24 2-40 7-30 9-10 5-7 7-3 8-1 16 2 28 4 32 6 20 8 20 15 22 20 23 20 18 16 10 16 6 16 1 16-2 12-5 16-11 20-20 13-18 7-16M120 196l0 0M0 328l2-12-2-14M252 551l0 0M504 659l0 0M728 684l0 0M772 192l0 0M128 251l0 0M168 647l0 0M512 680l0 0M732 712l0 0M768 204l0 0M168 296l0 0M512 692l0 0M768 216l0 0M500 708l0 0' stroke-width='1.2'/%3E%3Cpath d='M147 0l-5 16-1 20 3 16 8 15 7 9 25 22 8 10 10 16 18 35 12 16 8 6 12 6 12 2 12 1 20-2 28-6 29-10 17-8 11-8 10-12 5-12 1-12-2-8-6-8-19-12-26-10-60-20-14-6-13-8-8-8-7-12-4-12-1-16M552 324l0 0M876 610l0 0M0 892l12 0 16-5 22-11 18-12 8-8 9-12 5-12 1-12-2-12-5-12-9-12-11-9-20-12-20-7-16-3-8 3M900 756l-5 8-4 16-5 76 0 12 2 12 5 8 7 4M237 900l1-32-2-13-4-7-4-4-8-3-8-1-16 4-20 14-10 10-9 12-10 20M308 0l4 7 6 5 10 4 8 0 16-1 40-11 20-3 24-1 20 4 16 6 12 10 12 16 8 20 7 32 0 16-1 16-6 28-16 33-20 29-20 21-20 13-40 16-7 4-1 4 5 12 11 16 10 12 6 4 10 4 10 0 8-1 16-7 44-26 40-15 64-18 20-1 12 3 8 6 7 11 4 12 9 36 12 24 15 20 37 40 20 18 20 14 18 8 46 17 19 11 17 16 32 41M628 0l5 16 7 11 8 6 12 2 8-1 8-5 32-29M825 0l-2 20 2 24 3 16 5 12 7 8 8 5 12 4 30 7 10 6M0 134l4-22-1-4-3-6M900 134l-6 26-2 16 2 20 6 15M825 900l13-60 1-16-1-16-3-16-18-52-11-68-6-14-10-10-9-4-9-1-20 2-24 8-60 25-12 4-12 0-12-5-32-32-12-9-9-4-23-6-52-3-20-4-8-5-5-6-2-8 0-8 5-16 22-37 11-23 4-16 0-8-3-6-8-6-8-1-12-1-20 3-40 11-17 8-19 12-8 1-4-3-2-6 2-28-4-16-3-8-5-6-11-6-9 0-10 4-34 31-12 7-16 7-32 9-28 4-16 0-8-6-3-8 1-16 5-16 7-12 14-16 36-28 16-16 12-20 20-48 12-18 8-8 12-9 35-17 4-4-1-4-2-4-9-8-14-8-16-4-65-1-16-2-16-6-12-8-11-11-25-40-10-12-14-10-16-5-12 0-8 2-16 9-16 16-36 44-16 14-8 3-8 0-8-4-8-10M308 900l-3-12-1-40-4-16-7-16-13-14-16-10-20-6-20-4-48-5-24-7-16-9-28-19-19-14-13-13-8-11-3-8-3-20 2-24 10-52 1-12-2-8-4-8-5-5-44-25-20-17M708 900l20-20 11-16 3-8 1-8-1-8-4-8-10-10-16-10-60-23-12-4-8 2-4 3-4 8-2 10 0 28 6 64M588 124l0 0M780 180l0 0M116 220l0 0M196 620l0 0M520 668l0 0M728 696l0 0M780 227l0 0M496 731l0 0' stroke-width='2.4'/%3E%3C/g%3E%3C/svg%3E");
  --summit-topo-size: 900px;
}

/* ------------------------------------------------------------------ Base */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-padding-top: calc(var(--summit-bar) + 1rem);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--background, #f2eee3);
  color: var(--text-primary, #1b241f);
  font-family: var(--font-body, system-ui, sans-serif);
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

img,
video {
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
}

:focus-visible {
  outline: 2px solid var(--accent-ink, #a5431a);
  outline-offset: 3px;
}

.summit-main {
  display: block;
  min-height: 40vh;
}

.summit-skip-link {
  position: absolute;
  top: -5rem;
  left: 1rem;
  z-index: 100;
  padding: 0.6rem 1rem;
  border-radius: var(--summit-button-radius);
  background: var(--primary, #1d3a2b);
  color: var(--on-primary, #f6f2e6);
  font-weight: var(--summit-body-strong);
  text-decoration: none;
}

.summit-skip-link:focus {
  top: 1rem;
}

.summit-icon {
  width: 1.15em;
  height: 1.15em;
  flex: none;
}

/* A map's small label: spaced capitals in the body face, figures of one width. Short words only stand here. */
.summit-label,
.summit-place,
.summit-breadcrumbs ol {
  font-family: var(--font-body, sans-serif);
  font-size: 0.75rem;
  font-weight: var(--summit-body-strong);
  font-variant-numeric: lining-nums tabular-nums;
  letter-spacing: 0.14em;
  line-height: 1.35;
  text-transform: uppercase;
}

/* ------------------------------------------------------------------ The contour lines */

/* A layer of quiet contour lines over a band: the band's own text colour, faint, through the map's mask. Behind the
   band's words (z-index -1 in a band that makes its own stacking context). */
.summit-topo-layer,
.summit-hero__topo,
.summit-footer__topo,
.summit-split__topo,
.summit-split__map::after,
.summit-not-found::before,
.summit-main .kit-section[data-block]:is(.kit-section--inverse, [data-block="stats_counter"])::before {
  -webkit-mask: var(--summit-topo) 0 0 / var(--summit-topo-size) repeat;
  mask: var(--summit-topo) 0 0 / var(--summit-topo-size) repeat;
  pointer-events: none;
}

/* ------------------------------------------------------------------ Buttons */

/* One shape for every button the theme draws itself: sturdy, square-shouldered, in spaced capitals. kit-theme.css gives
   the kit's buttons the same corner and case, and the line of this theme in resilience.css (--chrome-button-*) gives
   them to the cookie notice and the phone action bar: theme-chrome.test.mjs holds the three together. A label may take
   two lines; it never runs out of the button. */
.summit-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  max-width: 100%;
  padding: 0.7rem 1.4rem;
  border: 2px solid transparent;
  border-radius: var(--summit-button-radius);
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  font-weight: var(--summit-body-strong);
  letter-spacing: 0.08em;
  line-height: 1.3;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  overflow-wrap: break-word;
  transition: background-color var(--summit-speed) ease, border-color var(--summit-speed) ease, box-shadow var(--summit-speed) ease, transform var(--summit-speed) ease;
}

/* The label is a span that may shrink: a flex item's text otherwise keeps its longest word's width and runs out of the
   button and off a phone's screen. "anywhere" breaks only a word wider than the whole button, as the kit's buttons do. */
.summit-button > span {
  min-width: 0;
  overflow-wrap: anywhere;
}

/* The one action: the accent colour, the blaze of the trail. The hover is a stitched ring in the words' colour and a
   step up, not a lighter fill: a lighter fill would bring the words' contrast under what the contract promises. */
.summit-button--primary {
  background: var(--accent, #e8682a);
  color: var(--on-accent, #1c1209);
}

.summit-button--primary:hover {
  box-shadow: inset 0 0 0 2px var(--accent, #e8682a), inset 0 0 0 3.5px color-mix(in srgb, var(--on-accent, #1c1209) 55%, transparent);
  transform: translateY(-1px);
}

.summit-button--secondary {
  border-color: var(--text-primary, #1b241f);
  background: transparent;
  color: var(--text-primary, #1b241f);
}

.summit-button--secondary:hover {
  background: color-mix(in srgb, var(--text-primary, #1b241f) 8%, transparent);
}

/* On a photograph, under the theme's own shade: white words. */
.summit-button--photo {
  border-color: rgb(255 255 255 / 0.85);
  background: rgb(0 0 0 / 0.14);
  color: #fff;
}

.summit-button--photo:hover {
  background: rgb(255 255 255 / 0.14);
}

.summit-button--small {
  min-height: 2.5rem;
  padding: 0.45rem 1rem;
  font-size: 0.75rem;
}

.summit-button--block {
  width: 100%;
}

/* ------------------------------------------------------------------ Announcement */

/* A notice nailed to the trailhead: the accent colour with its own words. */
.summit-announcement {
  background: var(--accent, #e8682a);
  color: var(--on-accent, #1c1209);
  font-size: 0.875rem;
}

.summit-announcement[hidden] {
  display: none;
}

.summit-announcement__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.25rem 1rem;
  max-width: calc(var(--summit-width) + 2 * var(--summit-gutter));
  margin-inline: auto;
  padding: 0.5rem var(--summit-gutter);
  text-align: center;
}

.summit-announcement p {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
  margin: 0;
  font-weight: var(--summit-body-strong);
}

.summit-announcement__icon {
  width: 1em;
  height: 1em;
  flex: none;
}

.summit-announcement a {
  font-weight: var(--summit-body-strong);
  text-decoration-thickness: 2px;
  text-underline-offset: 0.25em;
}

.summit-announcement .announcement-dismiss {
  display: inline-grid;
  place-items: center;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: none;
  color: inherit;
  cursor: pointer;
}

.summit-announcement svg {
  width: 0.7rem;
  height: 0.7rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
}

/* ------------------------------------------------------------------ Header */

/* A bar of the page's paper that stays at the top. Over a full-width photograph it lies clear on the picture until the
   page moves (below). */
.summit-header {
  position: sticky;
  top: 0;
  z-index: 50;
  border-bottom: 1px solid var(--summit-line);
  background: var(--background, #f2eee3);
  color: var(--text-primary, #1b241f);
  transition: background-color var(--summit-speed) ease, border-color var(--summit-speed) ease;
}

.summit-header__inner {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2.5vw, 2rem);
  min-height: var(--summit-bar);
  max-width: calc(var(--summit-width) + 2 * var(--summit-gutter));
  margin-inline: auto;
  padding: 0.5rem var(--summit-gutter);
}

.summit-header__brand {
  display: inline-flex;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}

/* The centred kind: the name in the middle column, the actions in the right one, so a long name never runs under them. */
.summit-header--centered .summit-header__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, auto) minmax(0, 1fr);
}

.summit-header--centered .summit-header__brand {
  grid-column: 2;
  justify-self: center;
  text-align: center;
}

.summit-header--centered .summit-header__actions {
  grid-column: 3;
  justify-self: end;
}

.summit-header__rail {
  max-width: calc(var(--summit-width) + 2 * var(--summit-gutter));
  margin-inline: auto;
  padding: 0 var(--summit-gutter) 0.35rem;
}

.summit-header__rail .summit-nav {
  justify-content: center;
}

.summit-header__actions {
  display: flex;
  flex: none;
  align-items: center;
  gap: 1rem;
  margin-left: auto;
}

.summit-header__phone {
  color: inherit;
  font-size: 0.875rem;
  font-weight: var(--summit-body-strong);
  font-variant-numeric: lining-nums tabular-nums;
  letter-spacing: 0.02em;
  text-decoration: none;
  white-space: nowrap;
}

.summit-header__phone:hover {
  text-decoration: underline dashed;
  text-underline-offset: 0.3em;
}

.summit-header__slot {
  display: flex;
  align-items: center;
}

/* The website's name, in the heavy heading face. Its line height and the small padding leave room for what letters carry
   above and below (the caron of Š, the tail of Ų, the descender of g): a tighter line in a box that clips cuts them
   (theme-clipped-marks.test.mjs, with "Šilėnų Žirgynas"). The shared rule (resilience.css) keeps a long name to two
   balanced lines and the shared script sets it smaller before a word would break; this rule only sets its look. */
.summit-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  min-width: 0;
}

.summit-brand__name {
  min-width: 0;
  /* Wide enough for a name of eighty characters on two lines: a third line makes the bar taller than its controls
     (verify-theme-stress.mjs, header-rows). */
  max-width: min(27rem, 46vw);
  padding-block: 0.1em;
  font-family: var(--font-heading, sans-serif);
  font-size: 1.3rem;
  font-weight: var(--summit-heading-weight);
  letter-spacing: -0.015em;
  line-height: 1.3;
}

/* On a wide screen the name is never clipped: a very long one takes a third line rather than losing its end. */
.summit-header .summit-brand__name {
  display: block;
  overflow: visible;
}

/* On a phone the shared rule keeps the name to two lines (it wins there). The box clips a little past its edges, so a
   caron above the first line and a tail under the second stay whole, but not so far that the top of a third line
   shows under the second. */
@media (max-width: 39.99rem) {
  .summit-header .summit-brand__name {
    max-width: 100%;
    overflow: clip;
    overflow-clip-margin: 0.12em;
    font-size: 1.15rem;
  }
}

.summit-brand:has(.summit-brand__logo, .brand-logo-original, .logo-mask) .summit-brand__name {
  font-size: 1.0625rem;
}

.summit-header .summit-brand__logo,
.summit-header .brand-logo-original {
  max-height: 2.75rem;
  width: auto;
}

.summit-header .logo-mask {
  background-color: var(--text-primary, #1b241f) !important;
}

/* ------------------------------------------------------------------ The top line */

/* A slim line in the main colour with the website's place (its town and coordinates) at the left and the ways to reach
   it at the right, like the header of a map sheet. Wide screens only. */
.summit-topbar {
  background: var(--primary, #1d3a2b);
  color: var(--on-primary, #f6f2e6);
  font-size: 0.8125rem;
}

.summit-topbar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  max-width: calc(var(--summit-width) + 2 * var(--summit-gutter));
  min-height: 2.25rem;
  margin-inline: auto;
  padding: 0 var(--summit-gutter);
}

.summit-topbar__contact {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  min-width: 0;
  margin-left: auto;
}

.summit-topbar a {
  color: inherit;
  text-decoration: none;
}

.summit-topbar a:hover {
  text-decoration: underline;
}

.summit-topbar__social,
.summit-footer__social {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.summit-topbar__social svg,
.summit-footer__social svg {
  display: block;
  width: 1rem;
  height: 1rem;
  fill: currentColor;
}

@media (max-width: 63.99rem) {
  .summit-topbar {
    display: none;
  }
}

/* ------------------------------------------------------------------ The place */

/* The website's place as a map labels it: a small triangle, the town, the coordinates. */
.summit-place {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.2rem 0.75rem;
  min-width: 0;
  margin: 0;
}

.summit-place__mark {
  flex: none;
  width: 0.7rem;
  height: 0.6rem;
  background: currentColor;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}

.summit-place__town {
  min-width: 0;
}

.summit-place__coords {
  opacity: 0.82;
  white-space: nowrap;
  word-spacing: 0.15em;
}

.summit-topbar__place {
  font-size: 0.6875rem;
}

/* ------------------------------------------------------------------ Navigation */

.summit-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 0.15rem;
  min-width: 0;
}

.summit-header--simple .summit-nav,
.summit-header--topbar .summit-nav {
  margin-left: auto;
}

/* A label is allowed to wrap: resilience.js counts a wrapped label as a crowded menu and folds it into the menu button.
   Without scripts nothing folds, and a label kept on one line would run off the screen instead. */
.summit-nav__item {
  position: relative;
  min-width: 0;
}

.summit-nav__item > a {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.6rem 0.75rem;
  color: inherit;
  font-size: 0.8125rem;
  font-weight: var(--summit-body-strong);
  letter-spacing: 0.08em;
  line-height: 1.3;
  text-decoration: none;
  text-transform: uppercase;
}

.summit-nav__item > a:hover,
.summit-nav__item--parent:focus-within > a {
  text-decoration: underline dashed 1.5px;
  text-underline-offset: 0.45em;
}

/* The page being shown: a small triangle under its link, the "you are here" of a map. */
.summit-nav__item.is-current > a::after {
  content: "";
  position: absolute;
  bottom: -0.1rem;
  left: 50%;
  width: 0.7rem;
  height: 0.45rem;
  background: var(--accent, #e8682a);
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
  transform: translateX(-50%);
}

.summit-nav__caret {
  width: 0.6rem;
  height: 0.4rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
}

.summit-nav__children {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 60;
  display: grid;
  min-width: 14rem;
  max-width: calc(100vw - 2rem);
  padding: 0.4rem;
  border: 1px solid var(--summit-line);
  border-radius: var(--summit-radius);
  background: var(--surface, #fbf9f3);
  color: var(--text-primary, #1b241f);
  box-shadow: 0 14px 32px -16px color-mix(in srgb, var(--text-primary, #1b241f) 40%, transparent);
  visibility: hidden;
  opacity: 0;
}

.summit-nav__item--parent:is(:hover, :focus-within) > .summit-nav__children {
  visibility: visible;
  opacity: 1;
}

.summit-nav__children a {
  padding: 0.5rem 0.75rem;
  border-radius: calc(var(--summit-radius) - 0.3rem);
  font-size: 0.9375rem;
  line-height: 1.4;
  text-decoration: none;
}

.summit-nav__children a:hover {
  background: var(--surface-alt, #e7e1d0);
}

/* The menu button: three lines that turn into a cross. Hidden on a wide screen unless resilience.js folds the menu into
   it (theme-nav-compact on #site-header, whose shared rules show it). */
.summit-menu-button {
  display: none;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 2px solid currentColor;
  border-radius: var(--summit-button-radius);
  background: transparent;
  color: inherit;
  cursor: pointer;
}

.summit-menu-button:hover {
  background: color-mix(in srgb, currentColor 10%, transparent);
}

.summit-menu-button__lines {
  display: grid;
  gap: 0.28rem;
  width: 1.15rem;
}

.summit-menu-button__lines i {
  display: block;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  transition: transform var(--summit-speed) ease, opacity var(--summit-speed) ease;
}

.summit-menu-button[aria-expanded="true"] .summit-menu-button__lines i:nth-child(1) {
  transform: translateY(0.4rem) rotate(45deg);
}

.summit-menu-button[aria-expanded="true"] .summit-menu-button__lines i:nth-child(2) {
  opacity: 0;
}

.summit-menu-button[aria-expanded="true"] .summit-menu-button__lines i:nth-child(3) {
  transform: translateY(-0.4rem) rotate(-45deg);
}

/* ------------------------------------------------------------------ Phone menu */

/* A panel under the bar with every page as a large line on the trail. It scrolls inside itself when the pages are many,
   so the last one is always reachable. */
.summit-drawer {
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  /* Under the whole header, whatever its height (a top line, a name on two lines): theme.js measures it
     (--summit-head). With the bar's own height here, the foot of a long menu lay under the window's edge and its last
     link could not be reached (verify-theme-stress.mjs, menu-unreachable). */
  max-height: calc(100dvh - var(--summit-head, var(--summit-bar)));
  overflow-y: auto;
  overscroll-behavior: contain;
  border-bottom: 1px solid var(--summit-line);
  background: var(--background, #f2eee3);
  color: var(--text-primary, #1b241f);
  box-shadow: 0 24px 40px -24px color-mix(in srgb, var(--text-primary, #1b241f) 45%, transparent);
}

.summit-drawer[hidden] {
  display: none;
}

.summit-drawer__inner {
  display: grid;
  gap: 1.25rem;
  max-width: 40rem;
  margin-inline: auto;
  padding: 0.5rem var(--summit-gutter) 1.5rem;
}

.summit-drawer__slot {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.summit-drawer__item {
  border-bottom: 1.5px dashed var(--summit-line);
}

/* A page name in the heading face. data-fit-text (includes/chrome.php) lets the shared script set a long single word
   smaller instead of breaking it. */
.summit-drawer__link {
  display: block;
  padding: 0.85rem 0;
  font-family: var(--font-heading, sans-serif);
  font-size: 1.375rem;
  font-weight: var(--summit-heading-weight);
  letter-spacing: -0.01em;
  line-height: 1.3;
  text-decoration: none;
}

.summit-drawer__children {
  display: grid;
  gap: 0.15rem;
  padding: 0 0 0.85rem 0.75rem;
}

.summit-drawer__children a {
  padding: 0.3rem 0;
  color: var(--text-secondary, #4c5750);
  text-decoration: none;
}

.summit-drawer__footer {
  display: grid;
  gap: 0.6rem;
}

.summit-drawer__contact {
  width: fit-content;
  color: var(--text-secondary, #4c5750);
  font-variant-numeric: lining-nums tabular-nums;
  text-decoration: none;
}

/* Below the desktop width the menu, the phone, the button and the slot move into the phone menu. */
@media (max-width: 63.99rem) {
  .summit-nav,
  .summit-header__rail,
  .summit-header__phone,
  .summit-header__cta,
  .summit-header__slot {
    display: none;
  }

  .summit-menu-button {
    display: inline-flex;
  }

  .summit-header--centered .summit-header__inner {
    display: flex;
  }
}

/* A phone menu left open while the window grows to a desktop is put away, unless the bar is folded. */
@media (min-width: 64rem) {
  #site-header:not(.theme-nav-compact) .summit-drawer {
    display: none;
  }
}

@media (max-width: 79.99rem) {
  .summit-header--simple .summit-header__phone {
    display: none;
  }
}

/* ------------------------------------------------------------------ The header over a photograph */

/* When the page opens with a photograph across the window, the bar lies clear on it with white words until the page
   moves (theme.js sets is-scrolled) or the phone menu opens (is-open); the opening is pulled up under it (the opening's
   rules). Without scripts the bar is the plain paper (the end of this file). */
.summit-header:not(.is-scrolled, .is-open):has(~ .summit-main > .summit-hero--full:not(.summit-hero--words):first-child) {
  border-bottom-color: rgb(255 255 255 / 0.22);
  background: transparent;
  color: #fff;
}

.summit-header:not(.is-scrolled, .is-open):has(~ .summit-main > .summit-hero--full:not(.summit-hero--words):first-child) .logo-mask {
  background-color: #fff !important;
}

/* A logo in its own colours on the photograph, which lies under a dark shade with white words. The shared script says
   whether the logo is dark or light (data-logo-tone, from its pixels). A dark logo would vanish there and gets a small
   light plate, whatever the palette; a light logo needs nothing, and the plate the shared script chose for it against
   the solid bar comes off. */
.summit-header:not(.is-scrolled, .is-open):has(~ .summit-main > .summit-hero--full:not(.summit-hero--words):first-child) .brand-logo-original[data-logo-tone="dark"] {
  box-sizing: content-box;
  padding: 0.3rem 0.55rem;
  border-radius: 0.4rem;
  background: #f6f3ec;
  box-shadow: none;
}

.summit-header:not(.is-scrolled, .is-open):has(~ .summit-main > .summit-hero--full:not(.summit-hero--words):first-child) .brand-logo-original[data-logo-tone="light"] {
  padding: 0;
  background: none;
  box-shadow: none;
}

/* The header's height by its kind on a wide screen, where the centred kind has its row of menu and the top-bar kind its
   slim line: what the opening is pulled up by until the script has measured the header itself. */
@media (min-width: 64rem) {
  .summit-body--centered {
    --summit-head: calc(var(--summit-bar) + 2.9rem + 1px);
  }

  .summit-body--topbar {
    --summit-head: calc(var(--summit-bar) + 2.25rem + 1px);
  }
}

/* ------------------------------------------------------------------ Breadcrumbs */

/* The way here, as a map label: spaced capitals with a small chevron between the steps. */
.summit-breadcrumbs {
  max-width: calc(var(--summit-width) + 2 * var(--summit-gutter));
  margin-inline: auto;
  padding: 1.25rem var(--summit-gutter) 0;
}

.summit-breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.6rem;
  margin: 0;
  padding: 0;
  color: var(--text-secondary, #4c5750);
  font-size: 0.6875rem;
  list-style: none;
}

.summit-breadcrumbs li {
  min-width: 0;
}

.summit-breadcrumbs li + li::before {
  content: "\203A";
  margin-right: 0.6rem;
  color: var(--accent-ink, #a5431a);
}

.summit-breadcrumbs a {
  text-decoration: none;
}

.summit-breadcrumbs a:hover {
  text-decoration: underline;
}

.summit-breadcrumbs [aria-current="page"] {
  color: var(--text-primary, #1b241f);
}

/* ------------------------------------------------------------------ The full opening */

/* The photograph across the window, nearly as tall as the first screen, ending at its foot in the jagged line of a
   ridge cut against the page (clip-path: no box that hides what overflows, so no mark of a letter is ever cut). A
   fainter ridge stands behind it, the farther range. Words here are white on the theme's own shade, the one place the
   palette does not decide. */
.summit-hero--full {
  position: relative;
}

.summit-hero__stage {
  position: relative;
  isolation: isolate;
  display: grid;
  align-items: end;
  min-height: clamp(30rem, 88svh, 58rem);
  background: #18201b;
  color: #fff;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 0.5 * var(--summit-ridge)), 95% calc(100% - 0.7 * var(--summit-ridge)), 90% calc(100% - 0.6 * var(--summit-ridge)), 85% calc(100% - 0.92 * var(--summit-ridge)), 79% calc(100% - 0.56 * var(--summit-ridge)), 74% calc(100% - 0.7 * var(--summit-ridge)), 68% calc(100% - 0.36 * var(--summit-ridge)), 62% calc(100% - 0.64 * var(--summit-ridge)), 56% calc(100% - 0.46 * var(--summit-ridge)), 51% calc(100% - 0.82 * var(--summit-ridge)), 47% calc(100% - 0.72 * var(--summit-ridge)), 42% calc(100% - 1 * var(--summit-ridge)), 36% calc(100% - 0.5 * var(--summit-ridge)), 31% calc(100% - 0.66 * var(--summit-ridge)), 26% calc(100% - 0.4 * var(--summit-ridge)), 21% calc(100% - 0.74 * var(--summit-ridge)), 17% calc(100% - 0.62 * var(--summit-ridge)), 13% calc(100% - 0.88 * var(--summit-ridge)), 8% calc(100% - 0.5 * var(--summit-ridge)), 4% calc(100% - 0.62 * var(--summit-ridge)), 0 calc(100% - 0.42 * var(--summit-ridge)));
}

/* The ridge is cut against what follows: the page's paper, or the band that comes next. */
.summit-hero--full:has(+ .kit-root > .kit-section--muted) {
  background: var(--surface-alt, #e7e1d0);
}

.summit-hero--full:has(+ .kit-root > :is(.kit-section--inverse, [data-block="stats_counter"])) {
  background: var(--primary, #1d3a2b);
}

.summit-hero--full:has(+ .kit-root > .kit-section--accent) {
  background: var(--accent, #e8682a);
}

/* First on the page: under the header, which lies clear on it. */
.summit-main > .summit-hero--full:not(.summit-hero--words):first-child .summit-hero__stage {
  margin-top: calc(-1 * var(--summit-head));
  padding-top: var(--summit-head);
}

/* Under the breadcrumb (every page but the home page) the first screen is shorter by the header and the breadcrumb, so
   the opening takes what is left of it: its heading and its buttons end on the first screen, not under it. The script
   says where the opening really starts (--summit-opening-top); until then, the header, one breadcrumb line and the space
   around it. */
.summit-main > nav[aria-label]:first-child + .summit-hero--full {
  --summit-above: var(--summit-opening-top, calc(var(--summit-head) + 1.25rem + 0.6875rem * 1.35 + 1.5rem));
}

.summit-main > nav[aria-label]:first-child + .summit-hero--full .summit-hero__stage {
  min-height: clamp(22rem, calc(100svh - var(--summit-above)), 58rem);
}

.summit-hero__media {
  position: absolute;
  inset: 0;
  z-index: -1;
  margin: 0;
}

.summit-hero__image,
.summit-hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Deep under the header's words and under the heading, light between: the picture stays a picture. --pgs-tint is the
   block's own word on the shade (lighter, darker). */
.summit-hero__shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgb(0 0 0 / min(0.6, calc(0.34 * var(--pgs-tint, 1)))) 0%, rgb(0 0 0 / 0) 62%),
    linear-gradient(180deg,
      rgb(0 0 0 / min(0.9, calc(0.42 * var(--pgs-tint, 1)))) 0%,
      rgb(0 0 0 / min(0.9, calc(0.08 * var(--pgs-tint, 1)))) 24%,
      rgb(0 0 0 / min(0.9, calc(0.12 * var(--pgs-tint, 1)))) 46%,
      rgb(0 0 0 / min(0.92, calc(0.56 * var(--pgs-tint, 1)))) 78%,
      rgb(0 0 0 / min(0.94, calc(0.72 * var(--pgs-tint, 1)))) 100%);
}

/* The contour lines over the photograph, very faint: the ground read as a map. */
.summit-hero__topo {
  position: absolute;
  inset: 0;
  background: #fff;
  opacity: 0.1;
}

.summit-hero__inner {
  display: grid;
  justify-items: start;
  gap: clamp(1rem, 2vw, 1.5rem);
  width: 100%;
  max-width: calc(var(--summit-width) + 2 * var(--summit-gutter));
  margin-inline: auto;
  padding: clamp(6rem, 14vh, 9rem) var(--summit-gutter) calc(var(--summit-ridge) + clamp(2.25rem, 1.5rem + 3vw, 4.5rem));
}

/* The place, on the photograph: a stitched tag on a dark ground. */
.summit-hero__place {
  padding: 0.45rem 0.85rem;
  border-radius: 0.95rem;
  background: rgb(0 0 0 / 0.34);
  color: #fff;
  outline: 1px dashed rgb(255 255 255 / 0.55);
  outline-offset: -4px;
  font-size: 0.6875rem;
}

/* With the top line, the place already stands at the head of every page on a wide screen: the opening does not repeat it. */
@media (min-width: 64rem) {
  .summit-body--topbar .summit-hero__place {
    display: none;
  }
}

.summit-hero__place .summit-place__mark {
  background: var(--accent, #e8682a);
}

/* The page's heading: large, heavy and tight, in sentence case, never larger than a word of fourteen letters can stand
   at 320 px (the shared script is only the net for a longer one). */
.summit-hero__title {
  max-width: 16ch;
  margin: 0;
  color: #fff;
  font-family: var(--font-heading, sans-serif);
  font-size: clamp(2.25rem, 1rem + 5.6vw, 6.25rem);
  font-weight: var(--summit-heading-weight);
  letter-spacing: -0.03em;
  line-height: 1.04;
  text-wrap: balance;
  text-shadow: 0 2px 24px rgb(0 0 0 / 0.25);
}

.summit-hero__lead {
  max-width: 36rem;
  margin: 0;
  color: rgb(255 255 255 / 0.92);
  font-size: clamp(1.0625rem, 1rem + 0.35vw, 1.25rem);
  line-height: 1.55;
}

.summit-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 0.5rem;
}

/* Without a picture: the same words on the main colour under the contour lines. */
.summit-hero--words .summit-hero__stage {
  min-height: 0;
  background: var(--primary, #1d3a2b);
  color: var(--on-primary, #f6f2e6);
}

.summit-hero--words .summit-hero__shade {
  display: none;
}

.summit-hero--words .summit-hero__topo {
  background: var(--on-primary, #f6f2e6);
  opacity: 0.16;
}

.summit-hero--words .summit-hero__inner {
  padding-top: clamp(3.5rem, 8vw, 6.5rem);
}

.summit-hero--words .summit-hero__title,
.summit-hero--words .summit-hero__lead {
  color: inherit;
  text-shadow: none;
}

.summit-hero--words .summit-button--photo {
  border-color: currentColor;
  background: transparent;
  color: inherit;
}

/* ------------------------------------------------------------------ The split opening */

/* The words beside a photograph clipped to a map: the picture in a rounded frame on a sheet of contour lines that lies
   offset behind it. */
.summit-split {
  position: relative;
  isolation: isolate;
  padding: clamp(2.5rem, 6vw, 5.5rem) var(--summit-gutter) clamp(3rem, 7vw, 6rem);
}

.summit-split__inner {
  display: grid;
  align-items: center;
  gap: clamp(2.5rem, 5vw, 4.5rem);
  max-width: var(--summit-width);
  margin-inline: auto;
}

@media (min-width: 56rem) {
  .summit-split:not(.summit-split--words) .summit-split__inner {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  }
}

.summit-split__copy {
  display: grid;
  justify-items: start;
  gap: 1.25rem;
  min-width: 0;
}

.summit-split__title {
  margin: 0;
  font-family: var(--font-heading, sans-serif);
  font-size: clamp(2.1rem, 1.2rem + 3.4vw, 4.25rem);
  font-weight: var(--summit-heading-weight);
  letter-spacing: -0.03em;
  line-height: 1.06;
  text-wrap: balance;
}

.summit-split__lead {
  max-width: 34rem;
  margin: 0;
  color: var(--text-secondary, #4c5750);
  font-size: clamp(1.0625rem, 1rem + 0.35vw, 1.2rem);
}

.summit-split__points {
  display: grid;
  gap: 0.6rem;
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: left;
}

.summit-split__points li {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
}

/* A small round patch with a stitched ring for each point's mark. */
.summit-split__mark {
  display: inline-grid;
  flex: none;
  place-items: center;
  width: 1.75rem;
  height: 1.75rem;
  margin-top: -0.05rem;
  border-radius: 50%;
  background: var(--primary, #1d3a2b);
  color: var(--on-primary, #f6f2e6);
  outline: 1px dashed color-mix(in srgb, var(--on-primary, #f6f2e6) 55%, transparent);
  outline-offset: -3.5px;
}

.summit-split__icon {
  width: 0.95rem;
  height: 0.95rem;
}

.summit-split__actions,
.summit-split__badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1rem;
}

.summit-split__rating {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--text-secondary, #4c5750);
  font-size: 0.9375rem;
}

.summit-stars {
  display: inline-flex;
  gap: 0.1rem;
}

.summit-stars svg {
  width: 1rem;
  height: 1rem;
  fill: color-mix(in srgb, var(--text-primary, #1b241f) 20%, transparent);
}

.summit-stars svg.is-full {
  fill: var(--accent-ink, #a5431a);
}

.summit-split__trustpilot {
  color: var(--accent-ink, #a5431a);
  font-weight: var(--summit-body-strong);
}

.summit-split__media {
  position: relative;
  margin: 0 0 0 clamp(0rem, 2vw, 1.5rem);
}

/* The map behind the picture: the tinted surface with contour lines, offset down and to the left. */
.summit-split__map {
  position: absolute;
  inset: clamp(1rem, 2.5vw, 1.75rem) clamp(1rem, 2.5vw, 1.75rem) calc(-1 * clamp(1rem, 2.5vw, 1.75rem)) calc(-1 * clamp(1rem, 2.5vw, 1.75rem));
  z-index: -1;
  overflow: hidden;
  border-radius: var(--summit-radius);
  background: var(--surface-alt, #e7e1d0);
}

.summit-split__map::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--text-primary, #1b241f);
  opacity: 0.22;
}

.summit-split__image {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: var(--summit-radius);
  object-fit: cover;
}

/* Without a picture: the words, centred, on the main colour under the contour lines. */
.summit-split--words {
  background: var(--primary, #1d3a2b);
  color: var(--on-primary, #f6f2e6);
  text-align: center;
}

.summit-split__topo {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--on-primary, #f6f2e6);
  opacity: 0.15;
}

.summit-split--words .summit-split__copy {
  justify-items: center;
  max-width: 46rem;
  margin-inline: auto;
}

.summit-split--words :is(.summit-split__lead, .summit-split__rating, .summit-split__trustpilot) {
  color: inherit;
}

.summit-split--words :is(.summit-split__actions, .summit-split__badges) {
  justify-content: center;
}

.summit-split--words .summit-split__mark {
  background: var(--accent, #e8682a);
  color: var(--on-accent, #1c1209);
  outline-color: color-mix(in srgb, var(--on-accent, #1c1209) 50%, transparent);
}

.summit-split--words .summit-button--secondary {
  border-color: currentColor;
  color: inherit;
}

.summit-split--words .summit-stars svg {
  fill: color-mix(in srgb, currentColor 25%, transparent);
}

.summit-split--words .summit-stars svg.is-full {
  fill: currentColor;
}

/* ------------------------------------------------------------------ Waypoints */

/* A numbered section's waypoint, in front of its heading (includes/stitch.php writes it into the kit's heading group): a
   painted trail blaze (two stripes of the accent with the ground between, as a path is marked on a tree), the number
   in map figures, and a few dashes of trail. It stands on the heading's side, centred or at the left. */
.summit-waypoint {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 1rem;
  color: var(--kit-muted, var(--text-secondary, #4c5750));
  font-family: var(--font-body, sans-serif);
  font-size: 0.8125rem;
  font-weight: var(--summit-body-strong);
  font-variant-numeric: lining-nums tabular-nums;
  letter-spacing: 0.16em;
  line-height: 1;
}

.kit-text--center > .summit-waypoint {
  margin-inline: auto;
}

.summit-waypoint::before {
  content: "";
  flex: none;
  width: 1.875rem;
  height: 1.125rem;
  border-radius: 3px;
  background: linear-gradient(var(--kit-accent, var(--accent, #e8682a)) 0 30%, transparent 30% 70%, var(--kit-accent, var(--accent, #e8682a)) 70%);
  box-shadow: inset 0 0 0 2px var(--kit-accent, var(--accent, #e8682a));
}

.summit-waypoint::after {
  content: attr(data-wp);
  padding-right: 3.5rem;
  background: repeating-linear-gradient(90deg, currentColor 0 0.45rem, transparent 0.45rem 0.8rem) right center / 2.75rem 2px no-repeat;
}

/* ------------------------------------------------------------------ How the kit's sections lie on the trail */

/* The tinted bands: a faint sheet of contour lines that fades out from one corner, as if the map showed through. */
.summit-main .kit-section.kit-section--muted {
  position: relative;
  isolation: isolate;
}

.summit-main .kit-section.kit-section--muted::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--text-primary, #1b241f);
  opacity: 0.07;
  -webkit-mask: radial-gradient(ellipse 70% 90% at 100% 0, #000 0, transparent 75%), var(--summit-topo) 0 0 / var(--summit-topo-size) repeat;
  -webkit-mask-composite: source-in;
  mask: radial-gradient(ellipse 70% 90% at 100% 0, #000 0, transparent 75%), var(--summit-topo) 0 0 / var(--summit-topo-size) repeat;
  mask-composite: intersect;
  pointer-events: none;
}

/* The main-colour bands (a call to action, the statistics): the contour lines clear across, in the band's words' colour. */
.summit-main .kit-section[data-block]:is(.kit-section--inverse, [data-block="stats_counter"]) {
  position: relative;
  isolation: isolate;
}

.summit-main .kit-section[data-block]:is(.kit-section--inverse, [data-block="stats_counter"])::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--on-primary, #f6f2e6);
  opacity: 0.13;
}

/* The statistics stand on the main colour, like the readings on a map's margin: the kit's inverse band, by type. */
.summit-main .kit-section[data-block="stats_counter"] {
  --kit-section-bg: var(--primary, #1d3a2b);
  --kit-section-fg: var(--on-primary, #f6f2e6);
  --kit-text: var(--on-primary, #f6f2e6);
  --kit-muted: color-mix(in srgb, var(--on-primary, #f6f2e6) 80%, transparent);
  --kit-accent: var(--on-primary, #f6f2e6);
  --kit-accent-text: var(--on-primary, #f6f2e6);
  --kit-on-accent: var(--primary, #1d3a2b);
  --kit-line: color-mix(in srgb, var(--on-primary, #f6f2e6) 26%, transparent);
  --kit-line-strong: color-mix(in srgb, var(--on-primary, #f6f2e6) 52%, transparent);
  --kit-focus: var(--on-primary, #f6f2e6);
  background-color: var(--primary, #1d3a2b);
  color: var(--on-primary, #f6f2e6);
}

/* A call to action on the main colour: its heading a step larger than the kit's, the band's one line. */
.summit-main .kit-section[data-block="cta_banner"] .kit-heading--3 {
  font-size: clamp(1.35rem, 1.1rem + 1.1vw, 2rem);
  letter-spacing: -0.02em;
  line-height: 1.15;
}

/* The steps: stations on one route. On a wide screen a dashed trail runs through the row at the height of the stitched
   number patches (kit-theme.css draws the patches), from the first to the last. */
@media (min-width: 64rem) {
  .summit-main [data-block="process_steps"] .kit-grid.kit-steps {
    position: relative;
  }

  .summit-main [data-block="process_steps"] .kit-grid.kit-steps:not(:has(.kit-card__body > .kit-icon:first-child)) > .kit-card:not(:last-child)::after {
    content: "";
    position: absolute;
    top: calc(var(--kit-card-pad) + 1.375rem - 1px);
    left: 3.6rem;
    right: 0.6rem;
    height: 2px;
    background: repeating-linear-gradient(90deg, var(--kit-line-strong) 0 0.5rem, transparent 0.5rem 0.85rem);
    pointer-events: none;
  }
}

/* ------------------------------------------------------------------ Plans */

/* The recommended plan stands out on the main colour, its label a stitched patch of the accent. */
.summit-main [data-block="pricing_table"] .kit-grid > .kit-card--surface {
  --kit-text: var(--on-primary, #f6f2e6);
  --kit-muted: color-mix(in srgb, var(--on-primary, #f6f2e6) 82%, transparent);
  --kit-accent: var(--on-primary, #f6f2e6);
  --kit-accent-text: var(--on-primary, #f6f2e6);
  --kit-on-accent: var(--primary, #1d3a2b);
  --kit-line: color-mix(in srgb, var(--on-primary, #f6f2e6) 26%, transparent);
  --kit-line-strong: color-mix(in srgb, var(--on-primary, #f6f2e6) 52%, transparent);
  --kit-focus: var(--on-primary, #f6f2e6);
  border-color: var(--primary, #1d3a2b);
  background: var(--primary, #1d3a2b);
  color: var(--on-primary, #f6f2e6);
}

.summit-main [data-block="pricing_table"] .kit-grid > .kit-card--surface > .kit-card__content > .kit-card__eyebrow {
  align-self: flex-start;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  background: var(--accent, #e8682a);
  color: var(--on-accent, #1c1209);
  outline: 1px dashed color-mix(in srgb, var(--on-accent, #1c1209) 55%, transparent);
  outline-offset: -4px;
  font-size: 0.6875rem;
}

/* ------------------------------------------------------------------ Article body */

.summit-article {
  padding: clamp(2.5rem, 6vw, 4.5rem) var(--summit-gutter);
}

.summit-article__inner {
  max-width: 44rem;
  margin-inline: auto;
}

.summit-article__header {
  display: grid;
  gap: 0.85rem;
  margin-bottom: 2.25rem;
  padding-bottom: 1.75rem;
  border-bottom: 2px dashed var(--summit-line);
}

.summit-article__byline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem 0.6rem;
  margin: 0;
  color: var(--text-secondary, #4c5750);
  font-size: 0.75rem;
  font-weight: var(--summit-body-strong);
  font-variant-numeric: lining-nums tabular-nums;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.summit-article__byline::before {
  content: "";
  width: 0.7rem;
  height: 0.6rem;
  background: var(--accent, #e8682a);
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}

.summit-article__header h1 {
  margin: 0;
  font-family: var(--font-heading, sans-serif);
  font-size: clamp(2rem, 1.3rem + 2.6vw, 3.25rem);
  font-weight: var(--summit-heading-weight);
  letter-spacing: -0.025em;
  line-height: 1.1;
  text-wrap: balance;
}

.summit-prose > :first-child {
  margin-top: 0;
}

.summit-prose > :last-child {
  margin-bottom: 0;
}

.summit-prose :where(p, ul, ol, figure, table, blockquote, pre) {
  margin: 0 0 1.25em;
}

.summit-prose :where(h2, h3, h4) {
  margin: 1.8em 0 0.5em;
  font-family: var(--font-heading, sans-serif);
  font-weight: var(--summit-heading-weight);
  letter-spacing: -0.015em;
  line-height: 1.2;
}

.summit-prose h2 {
  font-size: 1.75rem;
}

.summit-prose h3 {
  font-size: 1.35rem;
}

.summit-prose h4 {
  font-size: 1.1rem;
}

.summit-prose a {
  color: var(--accent-ink, #a5431a);
  text-decoration-thickness: 1.5px;
  text-underline-offset: 0.2em;
}

.summit-prose ul {
  padding-left: 1.25em;
}

.summit-prose ul li::marker {
  color: var(--accent-ink, #a5431a);
}

.summit-prose blockquote {
  margin-inline: 0;
  padding: 0.25rem 0 0.25rem 1.25rem;
  border-left: 4px solid var(--accent, #e8682a);
  font-family: var(--font-heading, sans-serif);
  font-size: 1.25rem;
  font-weight: var(--summit-heading-weight);
  line-height: 1.4;
}

.summit-prose img {
  display: block;
  border-radius: var(--summit-radius);
}

.summit-prose figcaption {
  margin-top: 0.5rem;
  color: var(--text-secondary, #4c5750);
  font-size: 0.875rem;
}

.summit-prose :where(th, td) {
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid var(--summit-line);
  text-align: left;
}

/* A rule that sets figures to one width asks for lining figures again: font-variant-numeric replaces the inherited value. */
.summit-prose table {
  font-variant-numeric: lining-nums tabular-nums;
}

.summit-prose pre {
  overflow-x: auto;
  padding: 1rem;
  border-radius: var(--summit-radius);
  background: var(--surface-alt, #e7e1d0);
}

/* ------------------------------------------------------------------ Divider block */

/* line: a single contour line across the page; dashed: a stretch of trail with a waypoint triangle in its middle;
   dotted: three small peaks. */
.summit-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  max-width: calc(var(--summit-width) + 2 * var(--summit-gutter));
  margin-inline: auto;
  padding: clamp(1.5rem, 3vw, 2.5rem) var(--summit-gutter);
}

.summit-divider__line {
  flex: 1 1 auto;
  height: 12px;
  background: var(--summit-line);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='12' viewBox='0 0 240 12'%3E%3Cpath d='M0 6c20 0 25-4 45-4s28 7 52 7 30-6 52-6 33 5 52 5 25-2 39-2' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E") 0 50% / 240px 12px repeat-x;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='12' viewBox='0 0 240 12'%3E%3Cpath d='M0 6c20 0 25-4 45-4s28 7 52 7 30-6 52-6 33 5 52 5 25-2 39-2' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E") 0 50% / 240px 12px repeat-x;
}

.summit-divider--dashed .summit-divider__line {
  height: 2px;
  background: repeating-linear-gradient(90deg, var(--summit-line) 0 0.6rem, transparent 0.6rem 1rem);
  -webkit-mask: none;
  mask: none;
}

.summit-divider__peak {
  flex: none;
  width: 0.8rem;
  height: 0.65rem;
  background: var(--accent, #e8682a);
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}

.summit-divider--dotted .summit-divider__peak {
  background: var(--summit-line);
}

.summit-divider--dotted .summit-divider__peak:nth-child(2) {
  width: 1.1rem;
  height: 0.9rem;
}

/* ------------------------------------------------------------------ Footer */

/* The map's legend: the main colour under quiet contour lines, the pages, the contact details and the place. It reads in
   every palette and with a website's own colours (on-primary on primary is a pair of the contract). */
.summit-footer {
  position: relative;
  isolation: isolate;
  background: var(--primary, #1d3a2b);
  color: var(--on-primary, #f6f2e6);
}

.summit-footer__topo {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--on-primary, #f6f2e6);
  opacity: 0.1;
}

.summit-footer__inner {
  max-width: calc(var(--summit-width) + 2 * var(--summit-gutter));
  margin-inline: auto;
  padding: clamp(3rem, 6vw, 4.75rem) var(--summit-gutter) 1.5rem;
}

.summit-footer--minimal .summit-footer__inner {
  padding-block: 2rem 1.25rem;
}

.summit-footer__brand {
  display: inline-flex;
  max-width: 100%;
  color: inherit;
  text-decoration: none;
}

.summit-footer .summit-brand__name {
  max-width: 100%;
  font-size: 1.5rem;
}

.summit-footer .summit-brand__logo,
.summit-footer .brand-logo-original {
  max-height: 3rem;
  width: auto;
}

.summit-footer .logo-mask {
  background-color: var(--on-primary, #f6f2e6) !important;
}

.summit-footer__closing {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem 2rem;
  margin-bottom: clamp(2.25rem, 4vw, 3.25rem);
  padding-bottom: clamp(2.25rem, 4vw, 3.25rem);
  border-bottom: 2px dashed color-mix(in srgb, var(--on-primary, #f6f2e6) 28%, transparent);
}

.summit-footer__invite {
  max-width: 22ch;
  margin: 0;
  font-family: var(--font-heading, sans-serif);
  font-size: clamp(1.75rem, 1.2rem + 2vw, 2.75rem);
  font-weight: var(--summit-heading-weight);
  letter-spacing: -0.025em;
  line-height: 1.12;
  text-wrap: balance;
}

/* Two to six columns, each at least a readable width; more rows where the screen is narrow. */
.summit-footer__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr));
  gap: 2.25rem 2.5rem;
}

.summit-footer__about {
  display: grid;
  align-content: start;
  justify-items: start;
  gap: 0.9rem;
}

.summit-footer__tagline,
.summit-footer__contact p:not(.summit-footer__title, .summit-place),
.summit-footer__copyright {
  margin: 0;
  color: color-mix(in srgb, var(--on-primary, #f6f2e6) 82%, transparent);
  font-size: 0.9375rem;
}

.summit-footer__title {
  margin: 0 0 0.85rem;
  font-size: 0.75rem;
  font-weight: var(--summit-body-strong);
  letter-spacing: 0.14em;
  line-height: 1.4;
  text-transform: uppercase;
}

.summit-footer__links,
.summit-footer__contact {
  display: grid;
  align-content: start;
  gap: 0.45rem;
  font-style: normal;
}

.summit-footer__links a,
.summit-footer__contact a,
.summit-footer__legal a,
.summit-footer__inline a {
  width: fit-content;
  max-width: 100%;
  color: color-mix(in srgb, var(--on-primary, #f6f2e6) 82%, transparent);
  font-size: 0.9375rem;
  text-decoration: none;
  overflow-wrap: break-word;
}

.summit-footer__links a:hover,
.summit-footer__contact a:hover,
.summit-footer__legal a:hover,
.summit-footer__inline a:hover {
  color: var(--on-primary, #f6f2e6);
  text-decoration: underline dashed;
  text-underline-offset: 0.3em;
}

/* The place in the footer: the coordinates under the address, after a small north arrow. */
.summit-footer__place {
  margin-top: 0.5rem;
  padding-top: 0.75rem;
  border-top: 1.5px dashed color-mix(in srgb, var(--on-primary, #f6f2e6) 28%, transparent);
  font-size: 0.6875rem;
}

.summit-footer__place .summit-place__mark {
  width: 0.65rem;
  height: 0.75rem;
  clip-path: polygon(50% 0, 100% 100%, 50% 72%, 0 100%);
}

.summit-footer__social a {
  display: inline-grid;
  place-items: center;
  width: 2.25rem;
  height: 2.25rem;
  border: 1.5px dashed color-mix(in srgb, var(--on-primary, #f6f2e6) 45%, transparent);
  border-radius: 50%;
  color: inherit;
}

.summit-footer__social a:hover {
  border-style: solid;
  border-color: currentColor;
}

.summit-footer__bottom,
.summit-footer__line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 2rem;
}

.summit-footer__bottom {
  margin-top: clamp(2.25rem, 4vw, 3.25rem);
  padding-top: 1.25rem;
  border-top: 1px solid color-mix(in srgb, var(--on-primary, #f6f2e6) 22%, transparent);
}

.summit-footer--minimal .summit-footer__bottom {
  margin-top: 1.5rem;
}

.summit-footer--minimal .summit-footer__place {
  margin: 0;
  padding: 0;
  border: 0;
}

.summit-footer__legal,
.summit-footer__inline {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1.5rem;
}

.summit-footer__legal a {
  font-size: 0.875rem;
}

.summit-footer .theme-footer-wordmark {
  color: color-mix(in srgb, var(--on-primary, #f6f2e6) 16%, transparent);
}

/* ------------------------------------------------------------------ Page not found */

/* Off the map: the number large in the heading face over a sheet of contour lines. */
.summit-not-found {
  position: relative;
  isolation: isolate;
  padding: clamp(4rem, 9vw, 7rem) var(--summit-gutter);
  text-align: center;
}

.summit-not-found::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--text-primary, #1b241f);
  opacity: 0.08;
}

.summit-not-found__inner {
  display: grid;
  justify-items: center;
  gap: 1rem;
  max-width: 36rem;
  margin-inline: auto;
}

.summit-not-found__number {
  margin: 0;
  color: var(--accent-ink, #a5431a);
  font-family: var(--font-heading, sans-serif);
  font-size: clamp(4rem, 2rem + 8vw, 8rem);
  font-weight: var(--summit-heading-weight);
  letter-spacing: -0.04em;
  line-height: 1;
}

.summit-not-found h1 {
  margin: 0;
  font-family: var(--font-heading, sans-serif);
  font-size: clamp(1.9rem, 1.4rem + 2vw, 2.75rem);
  font-weight: var(--summit-heading-weight);
  letter-spacing: -0.02em;
  line-height: 1.15;
  text-wrap: balance;
}

.summit-not-found p {
  margin: 0;
  color: var(--text-secondary, #4c5750);
}

/* ------------------------------------------------------------------ Form thanks */

.summit-form-success {
  display: grid;
  gap: 0.5rem;
  padding: 1.5rem 0;
}

.summit-form-success h3 {
  margin: 0;
  font-family: var(--font-heading, sans-serif);
  font-size: 1.5rem;
  font-weight: var(--summit-heading-weight);
  line-height: 1.25;
}

.summit-form-success p {
  margin: 0;
  color: var(--text-secondary, #4c5750);
}

/* ------------------------------------------------------------------ The phone action bar */

/* The shared bar (resilience.css) on the theme's paper, with its button. */
body .theme-action-bar {
  border-top: 1px solid var(--summit-line);
  background: var(--background, #f2eee3);
}

/* ------------------------------------------------------------------ Without scripts, and with less motion */

/* Without scripts the menu button does nothing, so it is hidden and the phone menu is a plain list under the bar on a
   phone: every page stays reachable (verify-theme-browser.mjs --chrome --no-js). The header stays the plain paper over
   a photograph too, since nothing would turn it solid on scroll. */
@media (scripting: none) {
  .summit-menu-button {
    display: none !important;
  }

  .summit-drawer[hidden] {
    position: static;
    display: block;
    max-height: none;
    box-shadow: none;
  }

  .summit-header:has(~ .summit-main > .summit-hero--full:first-child) {
    border-bottom-color: var(--summit-line) !important;
    background: var(--background, #f2eee3) !important;
    color: var(--text-primary, #1b241f) !important;
  }

  .summit-header:has(~ .summit-main > .summit-hero--full:first-child) .logo-mask {
    background-color: var(--text-primary, #1b241f) !important;
  }

  .summit-main > .summit-hero--full:first-child .summit-hero__stage {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}

@media (scripting: none) and (min-width: 64rem) {
  .summit-drawer[hidden] {
    display: none;
  }
}

/* Nothing in this theme moves for a visitor who asks for less motion. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition: none !important;
    animation: none !important;
    scroll-behavior: auto !important;
  }
}