/* AKA Digital: Topo & Elevation.
   Webflow-ready by construction: one class per styled element (combo classes start with is-), no descendant or
   state selectors, Client-First naming, tokens as plain custom properties. Breakpoints follow Webflow: base is
   desktop (992 and up), larger screens step up at min-width 1280 and 1440, smaller screens step down at
   max-width 991, 767 and 479. */

:root {
  --paper: #FCF9F1;
  --paper-deep: #F1EBDD;
  --slate: #09222E;
  --slate-soft: #33454F;
  --ink-muted: #56636A;
  --orange: #CC4813;
  --orange-deep: #A93A0F;
  --blue: #10728C;
  --blue-deep: #086888;
  --blue-soft: #B9D6DE;
  --sage: #617150;
  --contour: #C9C1AF;
  --rule: #E2DBCB;
  --white: #FFFFFF;

  --font-display: "Archivo", "Arial Black", "Helvetica Neue", Arial, sans-serif;
  --font-sans: "Fira Sans", "Segoe UI", Roboto, Arial, sans-serif;
  --font-label: "Fira Sans Condensed", "Arial Narrow", "Fira Sans", sans-serif;

  --radius-small: 4px;
  --radius-medium: 6px;
  --container-large: 1392px;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
}

/* Tag styles (Webflow "All" styles) */
html { scroll-behavior: smooth; }
body { margin: 0; background-color: var(--paper); color: var(--slate); font-family: var(--font-sans); font-size: 1.125rem; font-weight: 400; line-height: 1.55; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--blue-deep); }
h1, h2, h3, h4 { margin-top: 0; margin-bottom: 0; font-family: var(--font-display); font-weight: 700; color: var(--slate); text-wrap: balance; }
p { margin-top: 0; margin-bottom: 0; }
ul, ol { margin-top: 0; margin-bottom: 0; }
figure { margin: 0; }
::selection { background-color: var(--blue); color: var(--white); }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }

/* Utilities */
.page-wrapper { overflow: clip; }
.padding-global { padding-left: 4.7%; padding-right: 4.7%; }
.container-large { max-width: var(--container-large); margin-left: auto; margin-right: auto; }
.padding-section-large { padding-top: 112px; padding-bottom: 112px; }
.padding-section-medium { padding-top: 80px; padding-bottom: 80px; }
.max-width-medium { max-width: 46rem; }
.skip-link { position: absolute; left: -999px; top: 8px; z-index: 100; padding: 10px 16px; background-color: var(--slate); color: var(--white); }
.skip-link:focus { left: 8px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.list-plain { padding-left: 0; list-style: none; }

/* Type */
.heading-style-h1 { font-family: var(--font-display); font-size: 5rem; font-weight: 800; line-height: 1.02; letter-spacing: -0.025em; color: var(--slate); }
.heading-style-h2 { font-family: var(--font-display); font-size: 3.5rem; font-weight: 700; line-height: 1.06; letter-spacing: -0.02em; color: var(--slate); }
.heading-style-h2.is-light { color: var(--paper); }
.heading-style-h3 { font-family: var(--font-display); font-size: 1.75rem; font-weight: 700; line-height: 1.2; letter-spacing: -0.01em; color: var(--slate); }
.text-size-large { font-size: 1.375rem; font-weight: 300; line-height: 1.55; color: var(--slate-soft); }
.text-size-large.is-light { color: #D6DDDF; }
.text-size-regular { font-size: 1.125rem; line-height: 1.6; color: var(--slate-soft); }
.text-size-small { font-size: 0.95rem; line-height: 1.55; color: var(--ink-muted); }
.text-style-label { font-family: var(--font-label); font-size: 1rem; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: var(--sage); }
.text-color-blue { color: var(--blue-deep); }
.text-link { color: var(--blue-deep); font-weight: 500; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.text-link:hover { color: var(--slate); }

/* Navbar */
.navbar_component { position: sticky; top: 0; z-index: 10; height: 116px; display: flex; align-items: center; border-bottom: 1px solid var(--rule); background-color: var(--paper); transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out); }
.navbar_component.is-hidden { transform: translateY(-100%); }
.navbar_component.is-scrolled { box-shadow: 0 10px 30px -18px rgba(9, 34, 46, 0.35); }
.navbar_container { width: 100%; display: flex; align-items: center; justify-content: space-between; padding-left: 2.3%; padding-right: 2.5%; }
.navbar_logo-link { display: block; width: 88px; height: 82px; flex: none; }
.navbar_logo { width: 100%; height: 100%; object-fit: contain; object-position: left center; }
.navbar_menu { display: flex; align-items: center; margin-left: 32px; margin-right: auto; }
.navbar_link { padding: 10px 0; margin-right: 18px; color: var(--slate); font-family: var(--font-sans); font-size: 1.1rem; font-weight: 500; text-decoration: none; transition: color .2s var(--ease-out); }
.navbar_link:hover { color: var(--blue-deep); }
.navbar_link.is-current { color: var(--blue-deep); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 8px; }
.navbar_phone { margin-right: 20px; color: var(--slate); font-size: 1.1rem; font-weight: 500; text-decoration: none; font-variant-numeric: tabular-nums; }
.navbar_phone:hover { color: var(--blue-deep); }
.navbar_menu-button { display: none; }
.navbar_menu-head { display: none; }
.navbar_menu-extras { display: none; }
.navbar_backdrop { display: none; }

/* Buttons */
.button { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; height: 58px; padding-left: 28px; padding-right: 28px; border: 2px solid var(--orange); border-radius: var(--radius-medium); background-color: var(--orange); color: var(--white); font-family: var(--font-sans); font-size: 1.25rem; font-weight: 500; text-decoration: none; white-space: nowrap; transition: background-color .2s var(--ease-out), border-color .2s var(--ease-out); }
.button:hover { background-color: var(--orange-deep); border-color: var(--orange-deep); }
.button.is-secondary { border-color: var(--slate-soft); background-color: var(--paper); color: var(--slate); font-weight: 400; font-variant-numeric: tabular-nums; border-radius: 8px; }
.button.is-secondary:hover { background-color: var(--white); }
.button.is-nav { height: 54px; font-size: 1.15rem; }

/* Hero */
.section_hero { box-sizing: border-box; position: relative; min-height: 560px; padding-bottom: 40px; }
.hero_map { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; z-index: 0; }
.hero_summit { position: absolute; left: 59%; top: 11vw; width: 10%; height: 13.35vw; object-fit: contain; object-position: center top; z-index: 1; }
.hero_content { position: relative; z-index: 2; max-width: 55%; padding-left: 4.7%; padding-top: 72px; }
.hero_subhead { max-width: 560px; margin-top: 10px; font-family: var(--font-sans); font-size: 1.375rem; font-weight: 300; line-height: 1.5; color: var(--slate); }
.hero_divider { display: flex; align-items: center; gap: 14px; width: 324px; margin-top: 14px; color: var(--sage); }
.hero_divider-line { flex: 1; height: 1px; background-color: var(--contour); }
.hero_divider-icon { width: 20px; height: 26px; }
.hero_trust { display: flex; align-items: center; gap: 14px; margin-top: 18px; font-size: 1.15rem; letter-spacing: -0.01em; color: var(--slate); }
.hero_trust-icon { width: 30px; height: 30px; flex: none; color: var(--ink-muted); }
.hero_actions { display: flex; gap: 22px; margin-top: 26px; }
.button.is-hero { min-width: 230px; }
.button.is-hero-phone { min-width: 205px; }

/* Map markers (hero): the legend's symbols pinned on the map, placed in map units (left %, top vw) so they ride with the plate */
.map-markers { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; }
.map-marker { position: absolute; display: grid; place-items: center; width: clamp(30px, 2.4vw, 44px); height: clamp(30px, 2.4vw, 44px); transform: translate(-50%, -50%); border: 1.5px solid var(--contour); border-radius: 50%; background-color: var(--paper); color: var(--slate); box-shadow: 0 2px 6px -2px rgba(9, 34, 46, 0.35); text-decoration: none; pointer-events: auto; }
.map-marker.is-1 { left: 58.75%; top: 25.9vw; }
.map-marker.is-2 { left: 62.75%; top: 20.55vw; }
.map-marker.is-3 { left: 82%; top: 10.5vw; }
.map-marker.is-4 { left: 75%; top: 3.6vw; }
.map-marker.is-5 { left: 74%; top: 26.3vw; }
.map-marker_symbol { width: 56%; height: 56%; transition: color .2s var(--ease-out), transform .3s var(--ease-out); }
.map-marker_symbol.is-active { color: var(--orange); transform: scale(1.15); }
.map-marker_label { position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translate(-50%, 4px); padding: 4px 10px; border: 1.5px solid var(--contour); border-radius: var(--radius-small); background-color: var(--paper); font-family: var(--font-label); font-size: 0.9rem; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--sage); white-space: nowrap; opacity: 0; visibility: hidden; transition: opacity .2s var(--ease-out), transform .2s var(--ease-out), visibility 0s linear .2s; }
.map-marker_label.is-active { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition: opacity .2s var(--ease-out), transform .2s var(--ease-out), visibility 0s; }
.map-marker_label.is-below { top: calc(100% + 8px); bottom: auto; transform: translate(-50%, -4px); }
.map-marker_label.is-below.is-active { transform: translate(-50%, 0); }
.map-marker_label.is-pinned { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.map-marker.is-here { color: var(--orange); border-color: var(--orange); }
.section_hero.is-lost { min-height: 720px; }

/* Map legend (hero) */
.legend_component { box-sizing: border-box; position: absolute; z-index: 2; right: 2.7vw; top: 210px; width: 220px; padding: 18px 18px 22px; border: 1.5px solid var(--contour); border-radius: var(--radius-medium); background-color: var(--paper); }
.legend_title { padding-bottom: 12px; margin-bottom: 8px; border-bottom: 1px solid var(--contour); font-family: var(--font-label); font-size: 0.95rem; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--sage); text-align: center; }
.legend_list { padding-left: 0; list-style: none; }
.legend_item { display: flex; align-items: center; gap: 14px; padding-top: 9px; padding-bottom: 9px; color: var(--slate); font-size: 1.1rem; white-space: nowrap; text-decoration: none; }
.legend_item:hover { color: var(--blue-deep); }
.legend_symbol { width: 26px; height: 26px; flex: none; color: var(--slate-soft); }

/* Elevation profile */
.section_elevation { position: relative; height: 150px; background-color: var(--slate); }
.elevation_chart { display: block; width: 100%; height: 100%; }
.elevation_svg { display: block; width: 100%; height: 100%; overflow: visible; }
.elevation_label { font-family: var(--font-sans); font-size: 14px; letter-spacing: 1.4px; fill: var(--blue-soft); }
.elevation_tick { font-family: var(--font-sans); font-size: 13px; fill: #9FB4BC; text-anchor: end; }
.elevation_grid { stroke: rgba(252, 249, 241, 0.14); stroke-dasharray: 4 4; }
.elevation_axis { stroke: rgba(252, 249, 241, 0.3); }
.elevation_fill { fill: #143442; }
.elevation_line { fill: none; stroke: #2F5F6F; stroke-width: 2.5; stroke-linejoin: round; }
.elevation_trace { fill: none; stroke: var(--blue-soft); stroke-width: 2.5; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.elevation_drop { stroke: rgba(252, 249, 241, 0.3); stroke-dasharray: 3 4; }
.elevation_waypoint { fill: var(--blue-soft); transform-box: fill-box; transform-origin: center; }
.section_stages { height: 88px; background-color: var(--slate); }
.stages_list { position: relative; height: 68px; padding-left: 0; list-style: none; }
.stages_item { position: absolute; top: 0; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; gap: 12px; height: 68px; white-space: nowrap; font-family: var(--font-label); font-size: 1.4rem; font-weight: 500; color: var(--paper); }
.stages_item.is-1 { left: 15%; }
.stages_item.is-2 { left: 37.6%; }
.stages_item.is-3 { left: 60.3%; }
.stages_item.is-4 { left: 89.6%; }
.stages_marker { position: relative; width: 38px; height: 38px; flex: none; }
.stages_number { position: absolute; inset: 0; display: grid; place-items: center; font-size: 1.1rem; color: var(--paper); }

/* Sections */
.section_band { border-top: 1px solid var(--rule); }
.section_band.is-texture { background-image: url("../assets/textures/contour-patch.webp"); background-size: 560px auto; }
.section_band.is-dark { border-top: 0; background-color: var(--slate); color: var(--paper); }
.section_band.is-sage { background-color: #E6EADA; }
.section-header { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; flex-wrap: wrap; margin-bottom: 56px; }
.section-header_intro { margin-top: 16px; }

/* Map key: services as a keyed legend */
.map-key { border-top: 1.5px solid var(--slate); }
.map-key_row { display: grid; grid-template-columns: 44px minmax(0, 1.1fr) minmax(0, 1.6fr) minmax(0, 0.9fr) 24px; gap: 24px; align-items: center; padding-top: 26px; padding-bottom: 26px; border-bottom: 1px solid var(--rule); color: var(--slate); text-decoration: none; transition: background-color .25s var(--ease-out); }
.map-key_row:hover { background-color: var(--white); }
.map-key_symbol { width: 34px; height: 34px; color: var(--blue-deep); }
.map-key_terms { font-family: var(--font-label); font-size: 1.05rem; font-weight: 500; color: var(--sage); }
.map-key_arrow { width: 22px; height: 22px; color: var(--blue-deep); }

/* Trade tiles: a map sheet index with a photo per sheet */
.sheet-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1.5px solid var(--contour); border-left: 1.5px solid var(--contour); }
.sheet-tile { box-sizing: border-box; display: flex; flex-direction: column; padding: 18px 18px 26px; border-right: 1.5px solid var(--contour); border-bottom: 1.5px solid var(--contour); background-color: var(--paper); color: var(--slate); text-decoration: none; transition: background-color .25s var(--ease-out); }
.sheet-tile:hover { background-color: var(--white); }
.sheet-tile_image { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--radius-small); margin-bottom: 20px; }
.sheet-tile_heading { padding-left: 8px; padding-right: 8px; }
.sheet-tile_season { margin-top: 6px; padding-left: 8px; padding-right: 8px; font-size: 1rem; color: var(--ink-muted); }
.sheet-tile_link { margin-top: 14px; padding-left: 8px; font-weight: 500; color: var(--blue-deep); }

/* Image band */
.image-band { position: relative; }
.image-band_image { width: 100%; height: clamp(320px, 34vw, 560px); object-fit: cover; }

/* Waypoint steps: the climb in four stages */
.waypoint-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; padding-left: 0; list-style: none; border-top: 1.5px dashed var(--contour); }
.waypoint-list.is-stacked { grid-template-columns: 1fr; gap: 20px; margin-top: 28px; }
.waypoint { position: relative; padding-top: 40px; }
.waypoint_marker { position: absolute; top: -15px; left: 0; width: 28px; height: 28px; color: var(--blue); }
.waypoint_title { margin-bottom: 10px; }

/* Proof slots: clearly marked until Kent's material arrives */
.slot-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.slot-grid.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.slot-card { box-sizing: border-box; display: flex; flex-direction: column; gap: 12px; min-height: 240px; padding: 28px; border: 2px dashed var(--contour); border-radius: var(--radius-medium); background-color: rgba(255, 255, 255, 0.55); }
.slot-card_tag { align-self: flex-start; padding: 4px 10px; border-radius: var(--radius-small); background-color: var(--paper-deep); font-family: var(--font-label); font-size: 0.9rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--sage); }
.slot-card_fields { display: flex; flex-direction: column; gap: 4px; margin-top: auto; padding: 14px 0 0; border-top: 1px solid var(--rule); list-style: none; font-size: 0.98rem; color: var(--ink-muted); }

/* Client logos */
.logo-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--rule); border-left: 1px solid var(--rule); }
.logo-row_item { display: grid; place-items: center; height: 120px; padding: 18px 28px; border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.logo-row_image { max-height: 60px; width: auto; filter: brightness(0.15) sepia(0.2); opacity: 0.8; }
.logo-row_label { margin-top: 56px; margin-bottom: 18px; }

/* Kent */
.kent_layout { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 72px; align-items: center; }
.kent_photo-slot { box-sizing: border-box; display: grid; place-items: center; aspect-ratio: 4 / 5; padding: 28px; border: 2px dashed var(--contour); border-radius: var(--radius-medium); background-color: rgba(255, 255, 255, 0.55); text-align: center; }
.kent_photo-note { margin-top: 12px; }
.kent_lede { margin-top: 18px; }
.kent_facts { display: flex; flex-wrap: wrap; gap: 10px 28px; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--rule); }
.kent_fact { font-family: var(--font-label); font-size: 1.1rem; font-weight: 500; color: var(--sage); }
.kent_link { display: inline-block; margin-top: 24px; }

/* Call to action band */
.cta_layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr); gap: 56px; align-items: center; }
.cta_text { margin-top: 18px; }
.cta_actions { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.cta_phone { font-family: var(--font-display); font-size: 3rem; font-weight: 700; color: var(--paper); text-decoration: none; font-variant-numeric: tabular-nums; }
.cta_phone:hover { color: #FFD9C7; }
.cta_phone.is-dark { display: inline-block; margin-top: 12px; color: var(--slate); }
.cta_note { color: #C9D2D5; }

/* Page header (inner pages) */
.page-header { background-color: var(--slate); background-image: linear-gradient(180deg, #0B2733, #143442); color: var(--paper); }
.page-header_layout { display: grid; grid-template-columns: 1fr; gap: 56px; align-items: center; padding-top: 88px; padding-bottom: 80px; }
.page-header_layout.is-image { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); padding-top: 64px; padding-bottom: 64px; }
.page-header_heading { font-family: var(--font-display); font-size: 4.5rem; font-weight: 800; line-height: 1.02; letter-spacing: -0.025em; color: var(--paper); }
.page-header_intro { margin-top: 20px; color: #D6DDDF; }
.page-header_image { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--radius-medium); border: 1.5px solid rgba(252, 249, 241, 0.3); }
.breadcrumb { margin-bottom: 20px; font-size: 1rem; color: #9FB4BC; }
.breadcrumb_link { color: var(--blue-soft); }

/* Service detail */
.service_layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); gap: 64px; align-items: start; }
.service_head { display: flex; align-items: center; gap: 18px; }
.service_symbol { width: 40px; height: 40px; flex: none; color: var(--blue-deep); }
.service_lede { margin-top: 18px; }
.checklist { padding-left: 0; list-style: none; }
.checklist_item { padding: 12px 0 12px 34px; border-bottom: 1px solid var(--rule); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1.5 14.5 8 8 14.5 1.5 8z' fill='none' stroke='%2310728C' stroke-width='2'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: 2px 18px; background-size: 15px 15px; color: var(--slate); }
.terms-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.terms-pill { padding: 6px 14px; border: 1.5px solid var(--contour); border-radius: var(--radius-small); font-family: var(--font-label); font-size: 1rem; font-weight: 500; color: var(--sage); }
.more_text { margin-top: 12px; }

/* Season window (industry pages) */
.season_layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; align-items: start; }
.season_lede { margin-top: 18px; }
.season-bar_label { margin-top: 28px; }
.season-bar { display: grid; grid-template-columns: repeat(12, 1fr); gap: 4px; margin-top: 12px; }
.season-bar_month { padding-top: 46px; font-family: var(--font-label); font-size: 0.9rem; font-weight: 500; text-align: center; color: var(--ink-muted); background-image: linear-gradient(var(--paper-deep), var(--paper-deep)); background-size: 100% 36px; background-repeat: no-repeat; }
.season-bar_month.is-ramp { background-image: linear-gradient(var(--blue-soft), var(--blue-soft)); color: var(--slate); }
.season-bar_month.is-peak { background-image: linear-gradient(var(--blue), var(--blue)); color: var(--slate); font-weight: 600; }
.season-key { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 14px; font-size: 0.95rem; color: var(--ink-muted); }
.season-key_swatch { display: inline-block; width: 14px; height: 14px; margin-right: 8px; vertical-align: -2px; }
.season-key_swatch.is-peak { background-color: var(--blue); }
.season-key_swatch.is-ramp { background-color: var(--blue-soft); }
.source-list { display: flex; flex-direction: column; gap: 6px; margin-top: 20px; padding-left: 0; list-style: none; font-size: 0.92rem; color: var(--ink-muted); }
.source-list_link { color: var(--ink-muted); }

/* Contact form (Webflow form markup) */
.form_layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 72px; align-items: start; }
.form_component { box-sizing: border-box; padding: 36px; border: 1.5px solid var(--contour); border-radius: var(--radius-medium); background-color: var(--paper); }
.form_heading { margin-bottom: 24px; }
.form_field-wrapper { margin-bottom: 20px; }
.form_label { display: block; margin-bottom: 8px; font-weight: 500; color: var(--slate); }
.form_input { box-sizing: border-box; width: 100%; min-height: 52px; padding: 12px 14px; border: 1.5px solid var(--contour); border-radius: var(--radius-small); background-color: var(--white); font-family: var(--font-sans); font-size: 1.05rem; color: var(--slate); }
.form_input:focus { border-color: var(--blue); outline: 3px solid rgba(16, 114, 140, 0.25); outline-offset: 0; }
.form_input.is-textarea { min-height: 140px; resize: vertical; }
.form_note { margin-top: 14px; font-size: 0.95rem; color: var(--ink-muted); }
.form_message { display: none; margin-top: 16px; padding: 14px 16px; border-radius: var(--radius-small); background-color: var(--paper-deep); color: var(--slate); }
.form_message.is-visible { display: block; }
.contact_aside-heading { margin-top: 48px; }

/* Footer */
.footer_component { background-color: var(--slate); color: #C9D2D5; }
.footer_top { display: grid; grid-template-columns: minmax(0, 1.3fr) repeat(3, minmax(0, 1fr)); gap: 48px; padding-top: 80px; padding-bottom: 56px; }
.footer_logo { width: 120px; height: auto; }
.footer_tagline { margin-top: 18px; max-width: 22rem; color: #C9D2D5; }
.footer_heading { margin-bottom: 16px; font-family: var(--font-label); font-size: 1rem; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: #9FB3A0; }
.footer_list { display: flex; flex-direction: column; gap: 10px; padding-left: 0; list-style: none; }
.footer_link { color: var(--paper); text-decoration: none; }
.footer_link:hover { text-decoration: underline; text-underline-offset: 4px; }
.footer_bottom { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-top: 24px; padding-bottom: 32px; border-top: 1px solid rgba(252, 249, 241, 0.16); font-size: 0.95rem; }

/* Signature motion: the climb traces itself once, over a route that is already visible */
@media (prefers-reduced-motion: no-preference) {
  .elevation_trace.is-tracing { animation: climb 2.4s var(--ease-out) .3s both; }
  .elevation_waypoint.is-tracing { animation: waypoint .5s var(--ease-out) both; }
  .elevation_waypoint.is-tracing.is-1 { animation-delay: .5s; }
  .elevation_waypoint.is-tracing.is-2 { animation-delay: 1s; }
  .elevation_waypoint.is-tracing.is-3 { animation-delay: 1.5s; }
  .elevation_waypoint.is-tracing.is-4 { animation-delay: 2s; }
  @keyframes climb { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
  @keyframes waypoint { from { transform: scale(.4); opacity: .3; } to { transform: scale(1); opacity: 1; } }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .navbar_component { transition: none; }
  .navbar_menu { transition: none; }
  .navbar_backdrop { transition: none; }
  .button { transition: none; }
  .sheet-tile { transition: none; }
  .map-key_row { transition: none; }
  .map-marker_symbol { transition: none; }
  .map-marker_label { transition: none; }
}

/* ---------- Larger screens: the first viewport scales in the comp's proportions (1536 wide) ---------- */
@media (min-width: 1280px) {
  .navbar_component { height: clamp(116px, 8.92vw, 146px); }
  .navbar_logo-link { width: clamp(88px, 6.77vw, 112px); height: clamp(82px, 6.3vw, 104px); }
  .navbar_menu { margin-left: 48px; }
  .navbar_link { margin-right: 22px; font-size: clamp(1.1rem, 1.3vw, 1.35rem); }
  .navbar_phone { margin-right: 24px; font-size: clamp(1.1rem, 1.3vw, 1.35rem); }
  .button.is-nav { height: clamp(54px, 4.04vw, 66px); font-size: clamp(1.15rem, 1.35vw, 1.4rem); }
  .section_hero { min-height: clamp(560px, 39.9vw, 640px); padding-bottom: 0; }
  .hero_content { width: 44.9vw; max-width: none; padding-top: 6.05vw; padding-bottom: min(3.9vw, 60px); }
  .heading-style-h1 { font-size: clamp(4rem, 6.45vw, 6.2rem); }
  .hero_subhead { max-width: 36.4vw; margin-top: 0.4vw; font-size: clamp(1.25rem, 1.5625vw, 1.6rem); }
  .hero_divider { width: 21.1vw; margin-top: 0.85vw; }
  .hero_trust { margin-top: 1.17vw; font-size: clamp(1.05rem, 1.3vw, 1.35rem); }
  .hero_actions { gap: 1.43vw; margin-top: 1.7vw; }
  .button.is-hero { min-width: 16.5vw; height: clamp(54px, 4.17vw, 66px); font-size: clamp(1.15rem, 1.43vw, 1.45rem); }
  .button.is-hero-phone { min-width: 14.3vw; height: clamp(54px, 4.17vw, 66px); font-size: clamp(1.15rem, 1.43vw, 1.45rem); }
  .legend_component { top: min(17.1vw, 274px); width: clamp(220px, 14.5vw, 240px); padding: min(1.17vw, 19px) min(1.17vw, 19px) min(1.43vw, 23px); }
  .legend_item { padding-top: min(0.65vw, 10px); padding-bottom: min(0.65vw, 10px); font-size: clamp(1rem, 1.2vw, 1.2rem); }
  .section_elevation { height: 11.2vw; }
  .section_stages { height: 6.64vw; }
  .stages_list { height: 5.08vw; }
  .stages_item { height: 5.08vw; font-size: clamp(1.3rem, 1.56vw, 1.65rem); }
}
@media (min-width: 1440px) {
  .navbar_menu { margin-left: min(16.4vw, 252px); }
  .navbar_link { margin-right: 32px; padding-right: 26px; }
  .navbar_phone { margin-right: 44px; }
}

/* ---------- Smaller screens (Webflow: tablet 991, mobile landscape 767, mobile portrait 479) ---------- */
@media (max-width: 991px) {
  .navbar_component { height: 88px; }
  .navbar_logo-link { width: 72px; height: 67px; }
  .navbar_menu-button { display: grid; place-items: center; width: 48px; height: 48px; margin-left: auto; margin-right: 12px; border: 1.5px solid var(--contour); border-radius: var(--radius-medium); background-color: var(--paper); cursor: pointer; }
  .navbar_menu-icon { width: 22px; height: 2px; background-color: var(--slate); box-shadow: 0 -7px 0 var(--slate), 0 7px 0 var(--slate); }
  .navbar_menu { box-sizing: border-box; position: fixed; z-index: 60; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; align-items: stretch; width: min(86vw, 380px); margin: 0; padding: 20px 28px 32px; overflow-y: auto; background-color: var(--paper); background-image: url("../assets/textures/contour-patch.webp"); background-size: 520px auto; box-shadow: -18px 0 40px -24px rgba(9, 34, 46, 0.45); transform: translateX(104%); visibility: hidden; transition: transform .45s var(--ease-out), visibility 0s linear .45s; }
  .navbar_menu.is-open { transform: translateX(0); visibility: visible; transition: transform .45s var(--ease-out), visibility 0s; }
  .navbar_menu-head { display: flex; align-items: center; justify-content: space-between; padding-bottom: 18px; margin-bottom: 8px; border-bottom: 1.5px solid var(--contour); }
  .navbar_menu-logo { width: 64px; height: 60px; object-fit: contain; }
  .navbar_close { display: grid; place-items: center; width: 48px; height: 48px; border: 1.5px solid var(--contour); border-radius: var(--radius-medium); background-color: var(--paper); color: var(--slate); cursor: pointer; }
  .navbar_close-icon { width: 22px; height: 22px; }
  .navbar_link { margin: 0; padding: 16px 0; border-bottom: 1px solid var(--rule); font-family: var(--font-display); font-size: 1.6rem; font-weight: 600; }
  .navbar_link.is-current { text-decoration-thickness: 2px; text-underline-offset: 6px; }
  .navbar_menu-extras { display: flex; flex-direction: column; align-items: stretch; gap: 14px; margin-top: auto; padding-top: 28px; }
  .navbar_menu-phone { font-family: var(--font-display); font-size: 1.75rem; font-weight: 600; color: var(--slate); text-decoration: none; font-variant-numeric: tabular-nums; }
  .button.is-menu { width: 100%; }
  .navbar_menu-note { font-size: 0.95rem; color: var(--ink-muted); }
  .navbar_backdrop { position: fixed; z-index: 55; inset: 0; display: block; background-color: rgba(9, 34, 46, 0.45); opacity: 0; visibility: hidden; transition: opacity .35s var(--ease-out), visibility 0s linear .35s; }
  .navbar_backdrop.is-open { opacity: 1; visibility: visible; transition: opacity .35s var(--ease-out), visibility 0s; }
  .is-menu-locked { overflow: hidden; }
  .navbar_phone { display: none; }
  .button.is-nav { height: 48px; padding-left: 18px; padding-right: 18px; font-size: 1.05rem; }
  .section_hero { min-height: 0; padding-bottom: 72px; }
  .section_hero.is-lost { min-height: 0; }
  .hero_content { max-width: none; padding-right: 4.7%; padding-top: 64px; }
  .heading-style-h1 { font-size: 4rem; }
  .hero_summit { display: none; }
  .map-markers { display: none; }
  .legend_component { position: relative; right: auto; top: auto; width: auto; margin: 40px 4.7% 0; }
  .legend_list { display: grid; grid-template-columns: 1fr 1fr; column-gap: 20px; }
  .section_elevation { height: 140px; }
  .heading-style-h2 { font-size: 2.75rem; }
  .page-header_heading { font-size: 3.5rem; }
  .page-header_layout.is-image { grid-template-columns: 1fr; gap: 36px; }
  .map-key_row { grid-template-columns: 40px minmax(0, 1fr) 24px; gap: 8px 18px; }
  .map-key_text { grid-column: 2 / 3; }
  .map-key_terms { grid-column: 2 / 3; }
  .slot-grid { grid-template-columns: 1fr 1fr; }
  .slot-grid.is-two { grid-template-columns: 1fr 1fr; }
  .sheet-grid { grid-template-columns: 1fr 1fr; }
  .waypoint-list { grid-template-columns: 1fr 1fr; row-gap: 48px; }
  .kent_layout { grid-template-columns: 1fr; gap: 40px; }
  .cta_layout { grid-template-columns: 1fr; gap: 40px; }
  .service_layout { grid-template-columns: 1fr; gap: 40px; }
  .season_layout { grid-template-columns: 1fr; gap: 40px; }
  .form_layout { grid-template-columns: 1fr; gap: 40px; }
  .kent_photo-slot { max-width: 360px; }
  .kent_photo { max-width: 420px; }
  .footer_top { grid-template-columns: 1fr 1fr; }
  .logo-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  body { font-size: 1.0625rem; }
  .padding-section-large { padding-top: 72px; padding-bottom: 72px; }
  .padding-section-medium { padding-top: 56px; padding-bottom: 56px; }
  .heading-style-h1 { font-size: 3.1rem; }
  .hero_subhead { font-size: 1.25rem; }
  .hero_trust { align-items: flex-start; font-size: 1.05rem; }
  .hero_actions { flex-direction: column; align-items: stretch; }
  .button.is-hero { min-width: 0; }
  .button.is-hero-phone { min-width: 0; }
  .section_elevation { height: 110px; }
  .section_stages { height: auto; }
  .stages_list { display: grid; grid-template-columns: 1fr 1fr; height: auto; padding: 8px 4.7% 24px; }
  .stages_item { position: static; transform: none; justify-content: flex-start; height: 52px; font-size: 1.25rem; }
  .heading-style-h2 { font-size: 2.25rem; }
  .page-header_heading { font-size: 2.75rem; }
  .page-header_layout { padding-top: 56px; padding-bottom: 48px; }
  .page-header_layout.is-image { padding-top: 48px; padding-bottom: 48px; }
  .slot-grid { grid-template-columns: 1fr; }
  .slot-grid.is-two { grid-template-columns: 1fr; }
  .sheet-grid { grid-template-columns: 1fr; }
  .waypoint-list { grid-template-columns: 1fr; }
    .footer_top { grid-template-columns: 1fr; gap: 36px; }
  .cta_phone { font-size: 2.25rem; }
  .season-bar_month { font-size: 0.7rem; }
  .form_component { padding: 24px; }
}
@media (max-width: 479px) {
  .navbar_logo-link { width: 64px; height: 60px; }
  .button.is-nav { display: none; }
  .heading-style-h1 { font-size: 2.6rem; }
  .legend_list { grid-template-columns: 1fr; }
  .elevation_tick { display: none; }
  .elevation_label { display: none; }
}

/* Kent's photo */
.kent_photo { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--radius-medium); border: 1.5px solid var(--contour); }

/* ---------- Motion and interaction ---------- */
.heading-line { display: inline-block; }
.stages_button { display: flex; align-items: center; gap: 12px; padding: 6px 10px; border: 0; border-radius: var(--radius-small); background-color: transparent; font: inherit; color: inherit; cursor: pointer; transition: background-color .2s var(--ease-out), color .2s var(--ease-out); }
.stages_button:hover { background-color: rgba(252, 249, 241, 0.1); color: var(--white); }
.stages_button.is-active { background-color: rgba(252, 249, 241, 0.1); color: var(--blue-soft); }
.elevation_cursor { stroke: var(--paper); stroke-width: 1; stroke-dasharray: 2 3; opacity: 0; transition: opacity .2s var(--ease-out); }
.elevation_cursor.is-visible { opacity: 1; }
.elevation_dot { fill: var(--slate); stroke: var(--paper); stroke-width: 2; opacity: 0; transition: opacity .2s var(--ease-out); }
.elevation_dot.is-visible { opacity: 1; }
.elevation_tip { box-sizing: border-box; position: absolute; z-index: 3; bottom: calc(100% - 12px); left: 0; width: 300px; padding: 14px 16px; border: 1.5px solid var(--contour); border-radius: var(--radius-medium); background-color: var(--paper); box-shadow: 0 12px 28px -14px rgba(9, 34, 46, 0.35); opacity: 0; pointer-events: none; transform: translate(-50%, 6px); transition: opacity .2s var(--ease-out), transform .3s var(--ease-out); }
.elevation_tip.is-visible { opacity: 1; transform: translate(-50%, 0); }
.elevation_tip-stage { font-family: var(--font-display); font-size: 1.25rem; font-weight: 600; color: var(--slate); }
.elevation_tip-text { margin-top: 4px; font-size: 0.98rem; line-height: 1.5; color: var(--slate-soft); }
.sheet-tile_media { display: block; overflow: hidden; margin-bottom: 20px; border-radius: var(--radius-small); }
.sheet-tile_image { margin-bottom: 0; border-radius: 0; transition: transform .7s var(--ease-out); }
.sheet-tile_image.is-active { transform: scale(1.05); }
.sheet-tile_link { display: inline-flex; align-items: center; gap: 8px; }
.sheet-tile_arrow { width: 18px; height: 18px; transition: transform .3s var(--ease-out); }
.sheet-tile_arrow.is-active { transform: translateX(5px); }
.map-key_arrow { transition: transform .3s var(--ease-out); }
.map-key_arrow.is-active { transform: translateX(6px); }
.map-key_symbol { transition: color .25s var(--ease-out), transform .4s var(--ease-out); }
.map-key_symbol.is-active { color: var(--orange); transform: scale(1.12); }
.legend_symbol { transition: color .2s var(--ease-out), transform .3s var(--ease-out); }
.legend_symbol.is-active { color: var(--orange); transform: scale(1.15); }
.button:active { transform: translateY(1px); }
.image-band { overflow: hidden; }
.image-band_image { transform: scale(1.1); will-change: transform; }

/* Reveal states are added by script only, so content stays visible without it */
.reveal-item { transition: opacity .6s var(--ease-out), transform .8s var(--ease-out); }
.reveal-item.is-pending { opacity: 0; transform: translateY(18px); }
.season-bar_month.is-pending { background-size: 100% 0; color: transparent; }
.season-bar_month.is-filling { transition: background-size .45s var(--ease-out), color .3s var(--ease-out); }
.waypoint-list.is-pending { clip-path: inset(0 100% 0 0); }
.waypoint-list.is-drawing { transition: clip-path 1.4s var(--ease-out); }

@media (prefers-reduced-motion: no-preference) {
  .hero_map { animation: map-focus 1.6s var(--ease-out) both; }
  .heading-line.is-1 { animation: line-rise .9s var(--ease-out) .15s both; }
  .heading-line.is-2 { animation: line-rise .9s var(--ease-out) .3s both; }
  .hero_subhead { animation: fade-in .8s var(--ease-out) .55s both; }
  .hero_trust { animation: fade-in .8s var(--ease-out) .7s both; }
  .hero_actions { animation: fade-in .8s var(--ease-out) .8s both; }
  .legend_component { animation: legend-in .9s var(--ease-out) .6s both; }
  .hero_summit { animation: summit-drop .7s var(--ease-out) 2.6s both; }
  .map-marker { animation: marker-pin .6s var(--ease-out) both; }
  .map-marker.is-1 { animation-delay: 1.2s; }
  .map-marker.is-2 { animation-delay: 1.4s; }
  .map-marker.is-3 { animation-delay: 1.6s; }
  .map-marker.is-4 { animation-delay: 1.8s; }
  .map-marker.is-5 { animation-delay: 2s; }
  .stages_button.is-lighting { animation: stage-light .6s var(--ease-out) both; }
  @keyframes map-focus { from { filter: blur(6px); transform: scale(1.04); } to { filter: blur(0); transform: scale(1); } }
  @keyframes line-rise { from { opacity: 0; transform: translateY(0.35em); } to { opacity: 1; transform: none; } }
  @keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
  @keyframes legend-in { from { opacity: 0; transform: translateX(24px); } to { opacity: 1; transform: none; } }
  @keyframes marker-pin { from { opacity: 0; transform: translate(-50%, -50%) translateY(-14px) scale(.7); } to { opacity: 1; transform: translate(-50%, -50%); } }
  @keyframes summit-drop { from { opacity: 0; transform: translateY(-28px) scale(.85); } to { opacity: 1; transform: none; } }
  @keyframes stage-light { from { color: var(--paper); } 40% { color: var(--blue-soft); } to { color: var(--paper); } }
}
@media (prefers-reduced-motion: reduce) {
  .image-band_image { transform: none; }
  .reveal-item { transition: opacity .3s linear; }
  .sheet-tile_image { transition: none; }
}
@media (max-width: 767px) {
  .elevation_tip { position: static; display: none; width: auto; margin: 8px 4.7% 0; transform: none; }
  .elevation_tip.is-visible { display: block; transform: none; }
  .stages_button { padding: 6px 4px; }
}
@media (max-width: 767px) {
  .section_elevation { height: auto; }
  .elevation_chart { height: 110px; }
}
