/* ============================================================
   ENDURIST — Base CSS Override (Refactored)
   Applies Endurist brand system over Writer Webflow template
   Single consolidated file — all patches merged
   ============================================================ */


/* ============================================================
   1. DESIGN TOKENS
   ============================================================ */

html {
  scroll-behavior: smooth !important;
}

:root {
  --font-body:    'EB Garamond', 'Palatino Linotype', Georgia, serif;
  --font-ui:      'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-accent:  'Playfair Display', Georgia, serif;
  --font-display: var(--font-body);
  --bg-primary:   #fafaf8;
  --bg-secondary: #f0efeb;
  --bg-elevated:  #ffffff;
  --text-primary: #1a1a18;
  --text-secondary:#3a3a36;
  --text-muted:   #8a8a82;
  --border:       #e0dfd8;
  --accent:       #c0440f;
  --accent-hover: #a33a0d;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --medium-sea-green: #C45A28;
  --black-2: #161616;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg-primary:   #0f0f0f;
    --bg-secondary: #1a1a1a;
    --bg-elevated:  #242424;
    --text-primary: #f2f2f0;
    --text-secondary:#c8c8c0;
    --text-muted:   #6a6a62;
    --border:       #2e2e2e;
    --medium-sea-green: #C45A28;
    --black-2: #161616;
  }
}

[data-theme="light"] {
  --bg-primary:   #fafaf8;
  --bg-secondary: #f0efeb;
  --bg-elevated:  #ffffff;
  --text-primary: #1a1a18;
  --text-secondary:#3a3a36;
  --text-muted:   #8a8a82;
  --border:       #e0dfd8;
  --medium-sea-green: #C45A28;
  --black-2: #f0efeb;
}

[data-theme="dark"] {
  --bg-primary:   #0f0f0f;
  --bg-secondary: #1a1a1a;
  --bg-elevated:  #242424;
  --text-primary: #f2f2f0;
  --text-secondary:#c8c8c0;
  --text-muted:   #6a6a62;
  --border:       #2e2e2e;
  --medium-sea-green: #C45A28;
  --black-2: #161616;
}


/* ============================================================
   2. GLOBAL BASE
   ============================================================ */

html, body {
  background-color: var(--bg-primary) !important;
  color: var(--text-primary) !important;
}

body {
  font-family: var(--font-ui) !important;
  -webkit-font-smoothing: antialiased !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-ui) !important;
  color: var(--text-primary) !important;
}

p, .large-paragraph, .paragraph, .w-richtext p {
  font-family: var(--font-body) !important;
  color: var(--text-secondary) !important;
}

a {
  color: inherit;
  text-decoration: none;
  transition: color 200ms ease;
}

/* --- Global empty-state for Webflow dynamic lists --- */
.w-dyn-empty {
  background-color: var(--bg-elevated) !important;
  color: var(--text-muted) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  padding: 1.25rem 1.5rem !important;
  font-family: var(--font-ui) !important;
  font-size: 0.85rem !important;
  font-style: italic !important;
  text-align: center !important;
  opacity: 0.75 !important;
}

[style*="#7838e0"], [style*="#7c3aed"], [style*="#8b5cf6"],
[style*="#6d28d9"], [style*="#7e22ce"],
[style*="rgb(120, 56, 224)"], [style*="rgb(124, 58, 237)"],
[style*="rgb(139, 92, 246)"], [style*="purple"] {
  background-color: var(--accent) !important;
  color: #ffffff !important;
  border-color: var(--accent) !important;
}

.section {
  background-color: var(--bg-primary) !important;
}

.container {
  background-color: transparent !important;
}

.divider {
  background-color: var(--accent) !important;
  height: 3px !important;
  width: 48px !important;
  margin: 12px auto !important;
  border-radius: 2px !important;
}

body.quarry .divider {
  background-color: var(--quarry-accent, #8B6F47) !important;
}

body > .sticky-navigation + .sticky-navigation,
body > div.sticky-navigation ~ div.sticky-navigation {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}


/* ============================================================
   3. NAV — Desktop bar, dropdowns, and mobile menu
   ============================================================ */

.sticky-navigation,
.navigation,
.navigation-wrapper {
  background-color: var(--bg-primary) !important;
  border-bottom: none !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}

.navbar.w-nav,
.navbar.w-nav[style],
.sticky-navigation .navbar.w-nav,
.sticky-navigation .navbar.w-nav[style] {
  background-color: var(--bg-primary) !important;
  border-bottom: 1px solid var(--border) !important;
  margin-bottom: 0 !important;
}

.navbar-container {
  background-color: transparent !important;
}

.nav-link.w-dropdown-toggle,
.nav-link.w-dropdown-toggle > div {
  color: var(--text-primary) !important;
  font-family: var(--font-ui) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  background-color: transparent !important;
}

.nav-link.w-dropdown-toggle:hover > div,
.nav-link.w-dropdown-toggle.w--open > div {
  color: var(--accent) !important;
}

.nav-link,
.w-nav-link {
  color: var(--text-primary) !important;
  font-family: var(--font-ui, Inter, -apple-system, system-ui, sans-serif) !important;
  font-size: 17px !important;
  font-weight: 500 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  transition: color 200ms ease, opacity 200ms ease !important;
}

.nav-link:hover,
.w-nav-link:hover {
  color: var(--accent) !important;
  opacity: 1 !important;
}

.nav-link.w--current,
.w-nav-link.w--current {
  color: var(--accent) !important;
  font-weight: 600 !important;
}

/* Nav active state (w--current) handled by JS fixNavActiveState()
   for all sections including quarry sub-pages. */

/* "The Quarry" link removed from main nav — now lives in quarry-subnav strip.
   Active state handled by w--current on quarry-subnav-link. */

.w-icon-dropdown-toggle,
.arrow-icon.w-icon-dropdown-toggle {
  display: none !important;
}

.w-dropdown-toggle::after {
  content: '' !important;
  display: inline-block !important;
  width: 4px !important;
  height: 4px !important;
  border-right: 1.5px solid var(--text-muted) !important;
  border-bottom: 1.5px solid var(--text-muted) !important;
  transform: rotate(45deg) !important;
  margin-left: 6px !important;
  margin-bottom: 2px !important;
  vertical-align: middle !important;
  transition: transform 200ms ease !important;
}

.w-dropdown-toggle.w--open::after {
  transform: rotate(-135deg) !important;
  margin-bottom: -2px !important;
}

.button.nav-subscribe,
a.button.nav-subscribe {
  background-color: var(--accent) !important;
  color: #ffffff !important;
  font-family: var(--font-ui) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  border-radius: var(--radius-sm) !important;
  border: none !important;
  padding: 10px 20px !important;
  transition: background-color 200ms ease !important;
}

.button.nav-subscribe:hover {
  background-color: var(--accent-hover) !important;
}

/* ── Ghost signup modal ────────────────────────────────────── */
.endurist-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.75);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.endurist-modal-overlay.active {
  opacity: 1;
  visibility: visible;
}

.endurist-modal {
  position: relative;
  background: #08090c;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  padding: 16px 16px 8px;
  max-width: 540px;
  width: 90%;
  transform: translateY(20px);
  transition: transform 0.25s ease;
  overflow: hidden;
}

.endurist-modal-overlay.active .endurist-modal {
  transform: translateY(0);
}

.endurist-modal-close {
  position: absolute;
  top: 8px;
  right: 12px;
  background: none;
  border: none;
  color: rgba(255, 255, 255, 0.4);
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  padding: 4px 8px;
  z-index: 10;
  transition: color 0.15s ease;
}

.endurist-modal-close:hover {
  color: #ffffff;
}

.endurist-modal-body {
  display: flex;
  justify-content: center;
}

/* Light mode — modal stays dark to match Ghost branded embed */
[data-theme="light"] .endurist-modal {
  background: #08090c;
  border-color: rgba(255, 255, 255, 0.08);
}

[data-theme="light"] .endurist-modal-close {
  color: #999;
}

[data-theme="light"] .endurist-modal-close:hover {
  color: #333;
}

.menu-button.w-nav-button,
.w-nav-button {
  background-color: transparent !important;
  border: none !important;
  color: var(--text-primary) !important;
}

.w-icon-nav-menu {
  color: var(--text-primary) !important;
}

.line-1, .line-2, .line-3 {
  background-color: var(--text-primary) !important;
}

/* Desktop dropdowns */
.first-nav-drop-list.w-dropdown-list {
  background-color: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-md) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.10) !important;
  padding: 8px 0 !important;
  overflow: hidden !important;
  min-width: 160px !important;
}

.first-nav-drop-list .top {
  display: contents !important;
}

.drop-list-div .dropdown-link.w-inline-block {
  display: block !important;
  padding: 10px 20px !important;
  width: 100% !important;
  background-color: transparent !important;
  transition: background-color 200ms ease !important;
}

.drop-list-div .dropdown-link.w-inline-block:hover {
  background-color: var(--bg-secondary) !important;
}

.first-nav-drop-list .text {
  color: var(--text-primary) !important;
  font-family: var(--font-ui) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

.first-nav-drop-list .dropdown-link:hover .text {
  color: var(--accent) !important;
}

/* Mobile menu */
.navigation .menu,
.nav-menu-second,
.w-nav-overlay,
.w-nav-menu {
  background-color: var(--bg-primary) !important;
}

.w-nav-overlay,
.w-nav-overlay .w-nav-menu,
.w-nav-overlay .nav-menu-second,
.w-nav-overlay .navigation .menu {
  background-color: var(--bg-primary) !important;
}

.w-nav-overlay .nav-menu-wrapper,
.w-nav-overlay .menu-divider,
.w-nav-overlay .menu-top,
.w-nav-overlay .menu-bottom,
.w-nav-overlay .dropdown.w-dropdown,
.w-nav-overlay .brand.w-nav-brand,
.w-nav-overlay .nav-text,
.w-nav-overlay .dropdown-link-second.w-dropdown-toggle {
  background-color: transparent !important;
}

.w-nav-overlay .brand.w-nav-brand .logo::before,
.w-nav-menu .brand.w-nav-brand .logo::before {
  width: 22px !important;
  height: 28px !important;
  margin-right: 8px !important;
  margin-bottom: -8px !important;
}

.w-nav-overlay .brand.w-nav-brand::after,
.w-nav-menu .brand.w-nav-brand::after {
  font-size: 8px !important;
  bottom: -12px !important;
  left: 42px !important;
}

.w-nav-overlay .logo,
.w-nav-overlay h1.logo,
.w-nav-overlay .brand.w-nav-brand .logo,
.w-nav-overlay .brand.w-nav-brand h1.logo,
.w-nav-menu .logo,
.w-nav-menu h1.logo {
  font-size: 16px !important;
}

.menu-divider,
.nav-menu-wrapper,
.dropdown.w-dropdown {
  background-color: transparent !important;
  border: none !important;
}

.nav-text {
  font-family: var(--font-ui) !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  color: var(--text-primary) !important;
  background-color: transparent !important;
  padding: 12px 0 !important;
  line-height: 1.2 !important;
}

.dropdown-link-second.w-dropdown-toggle {
  background-color: transparent !important;
  color: var(--text-primary) !important;
  padding: 0 !important;
}

.dropdown-list.w-dropdown-list {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 4px 0 4px 16px !important;
}

.dropdown-list .top {
  display: contents !important;
}

.dropdown-list .text {
  color: var(--text-secondary) !important;
  font-family: var(--font-ui) !important;
  font-size: 16px !important;
  font-weight: 500 !important;
}

.dropdown-list .dropdown-link:hover .text {
  color: var(--accent) !important;
}

.text-block {
  color: var(--text-primary) !important;
  font-family: var(--font-ui) !important;
}


/* ============================================================
   4. LOGO & BRAND LOCKUP
   Single source of truth for nav brand: cairn · wordmark · tagline
   ============================================================ */

/* --- 4a. Wordmark base (all contexts) --- */
.logo,
h1.logo,
.brand.w-nav-brand .logo,
.brand.w-nav-brand h1.logo {
  font-family: var(--font-ui) !important;
  color: var(--text-primary) !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  margin: 0 !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Hide template dot & extra spans; keep accent-i */
.logo .dot,
h1.logo .dot,
h1.logo > span:not(.accent-i) {
  display: none !important;
}

/* Orange I accent */
h1.logo .accent-i {
  color: var(--accent) !important;
}

/* --- 4b. Nav brand container --- */
.brand.w-nav-brand {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  text-decoration: none !important;
  position: relative !important;
  overflow: visible !important;
  padding-bottom: 14px !important;
  border: none !important;
}

/* --- 4c. Cairn mark (::before on h1.logo) --- */
.brand.w-nav-brand .logo::before {
  content: '';
  display: inline-block;
  width: 38px;
  height: 47px;
  margin-right: 12px;
  margin-bottom: -18px;
  vertical-align: baseline;
  background: no-repeat center / contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 80' fill='none'%3E%3Cpath d='M3 76 L5 64 L63 64 L61 76 Z' fill='%23F2F2F2' opacity='0.32'/%3E%3Cpath d='M20 62 L22 50 L62 50 L60 62 Z' fill='%23F2F2F2' opacity='0.54'/%3E%3Cpath d='M4 48 L6 36 L34 36 L32 48 Z' fill='%23F2F2F2' opacity='0.78'/%3E%3Cpath d='M22 32 L24 20 L42 20 L40 32 Z' fill='%23C45A28'/%3E%3C/svg%3E");
}

[data-theme="light"] .brand.w-nav-brand .logo::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 80' fill='none'%3E%3Cpath d='M3 76 L5 64 L63 64 L61 76 Z' fill='%231a1a1a' opacity='0.22'/%3E%3Cpath d='M20 62 L22 50 L62 50 L60 62 Z' fill='%231a1a1a' opacity='0.38'/%3E%3Cpath d='M4 48 L6 36 L34 36 L32 48 Z' fill='%231a1a1a' opacity='0.58'/%3E%3Cpath d='M22 32 L24 20 L42 20 L40 32 Z' fill='%23C45A28'/%3E%3C/svg%3E");
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) .brand.w-nav-brand .logo::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 80' fill='none'%3E%3Cpath d='M3 76 L5 64 L63 64 L61 76 Z' fill='%231a1a1a' opacity='0.22'/%3E%3Cpath d='M20 62 L22 50 L62 50 L60 62 Z' fill='%231a1a1a' opacity='0.38'/%3E%3Cpath d='M4 48 L6 36 L34 36 L32 48 Z' fill='%231a1a1a' opacity='0.58'/%3E%3Cpath d='M22 32 L24 20 L42 20 L40 32 Z' fill='%23C45A28'/%3E%3C/svg%3E");
  }
}

/* Kill ::after pseudo on logo — was a divider, now dead */
.brand.w-nav-brand .logo::after {
  content: none !important;
  display: none !important;
  border: none !important;
}

/* --- 4d. Tagline "Built to stay." --- */
.brand.w-nav-brand::after {
  content: 'Built to stay.';
  position: absolute !important;
  bottom: 0 !important;
  left: 60px !important;
  font-family: var(--font-body) !important;
  font-size: 11px !important;
  font-style: italic !important;
  font-weight: 500 !important;
  color: rgba(255, 255, 255, 0.62) !important;
  letter-spacing: 0.04em !important;
  text-transform: none !important;
  white-space: nowrap !important;
  pointer-events: none !important;
}

[data-theme="light"] .brand.w-nav-brand::after {
  color: rgba(0, 0, 0, 0.52) !important;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) .brand.w-nav-brand::after {
    color: rgba(0, 0, 0, 0.52) !important;
  }
}


/* ============================================================
   5. HERO SLIDER
   ============================================================ */

.hero-slider-wrapper {
  background-color: var(--bg-secondary) !important;
}

.big-headline {
  color: #ffffff !important;
  font-family: var(--font-accent) !important;
  text-shadow: 0 2px 12px rgba(0,0,0,0.5) !important;
}

.overlay {
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.08) 0%,
    rgba(0, 0, 0, 0.32) 100%
  ) !important;
}

/* All hero slides — light overlay to keep photos vibrant */
.w-slider-mask .hero-slide .overlay {
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.05) 0%,
    rgba(0, 0, 0, 0.35) 100%
  ) !important;
}

.category-text {
  color: rgba(255,255,255,0.85) !important;
  font-family: var(--font-ui) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.label-tag {
  background-color: var(--accent) !important;
  color: #ffffff !important;
  font-family: var(--font-ui) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  border-radius: 4px !important;
  padding: 4px 10px !important;
  display: inline-block !important;
}

.hero-slider-wrapper .label-tag {
  background-color: #C45A28 !important;
}

.hero-slider-wrapper .label-tag .category-text,
.hero-slider-wrapper .category-text {
  color: #ffffff !important;
}

.label-tag.white {
  color: #ffffff !important;
  font-family: var(--font-ui) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  border-radius: 4px !important;
  padding: 4px 8px !important;
}

.left-arrow.w-slider-arrow-left,
.right-arrow.w-slider-arrow-right {
  background-color: transparent !important;
  width: 44px !important;
  height: 44px !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  border-radius: 50% !important;
  border: 2px solid rgba(255,255,255,0.5) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 12px !important;
  transition: background-color 200ms ease, border-color 200ms ease !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
}

.left-arrow.w-slider-arrow-left:hover,
.right-arrow.w-slider-arrow-right:hover {
  background-color: rgba(196, 90, 40, 0.85) !important;
  border-color: #c45a28 !important;
}

.left-arrow .w-icon-slider-left,
.right-arrow .w-icon-slider-right {
  color: rgba(255,255,255,0.85) !important;
  font-size: 16px !important;
}

.left-arrow, .right-arrow {
  color: rgba(255,255,255,0.7) !important;
}

.left-arrow:hover, .right-arrow:hover {
  color: #ffffff !important;
}


/* ============================================================
   6. BUTTONS
   ============================================================ */

.color {
  color: var(--accent) !important;
}

.button, .w-button,
input[type="submit"].w-button,
button.w-button,
.w-form input[type="submit"],
.w-form button[type="submit"] {
  background-color: var(--text-primary) !important;
  color: var(--bg-primary) !important;
  font-family: var(--font-ui) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  border-radius: var(--radius-sm) !important;
  border: none !important;
  padding: 12px 24px !important;
  cursor: pointer !important;
  transition: background-color 200ms ease, color 200ms ease !important;
}

.button:hover, .w-button:hover,
input[type="submit"].w-button:hover,
button.w-button:hover,
.w-form input[type="submit"]:hover,
.w-form button[type="submit"]:hover {
  background-color: var(--accent) !important;
  color: #ffffff !important;
}

.button.light {
  background-color: transparent !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,0.6) !important;
}

.button.light:hover {
  background-color: #ffffff !important;
  color: var(--text-primary) !important;
}

.hero-slide-content .button {
  background-color: rgba(15, 15, 15, 0.7) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  backdrop-filter: blur(4px) !important;
}

.hero-slide-content .button:hover {
  background-color: #C45A28 !important;
  border-color: #C45A28 !important;
}

[class*="view-all"],
.w-pagination-next,
.w-pagination-previous {
  background-color: var(--text-primary) !important;
  color: var(--bg-primary) !important;
  border-radius: var(--radius-md) !important;
}

[class*="view-all"]:hover,
.w-pagination-next:hover {
  background-color: var(--accent) !important;
  color: #ffffff !important;
}


/* ============================================================
   7. BLOG CARDS & LISTS
   ============================================================ */

.latest-block {
  background-color: var(--bg-primary) !important;
  border-bottom: 1px solid var(--border) !important;
}

.latest-block.padding {
  padding: 0 0 24px !important;
}

.post-title {
  color: var(--text-primary) !important;
  font-family: var(--font-ui) !important;
}

.post-link {
  color: var(--text-primary) !important;
}

.post-link:hover .post-title {
  color: var(--accent) !important;
}

/* Truncate post body preview on home page sidebar entries */
.sidebar-block .w-dyn-item .w-richtext,
.sidebar-block .w-dyn-item > .w-richtext,
.latest-block + .w-richtext,
.latest-block ~ .w-richtext,
.latest-block + p,
.latest-block ~ p:not(.label-tag) {
  display: -webkit-box !important;
  -webkit-line-clamp: 4 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.latest-block p {
  color: var(--text-secondary) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
}

.blog-title {
  color: var(--text-primary) !important;
  font-family: var(--font-ui) !important;
}

.gallery-wrapper {
  background-color: var(--bg-secondary) !important;
}

.text-hover {
  background: linear-gradient(
    to top, rgba(0,0,0,0.75) 0%, transparent 100%
  ) !important;
}

.title-blog {
  color: #ffffff !important;
  font-family: var(--font-ui) !important;
}

.slogan-wrapper {
  background-color: var(--bg-secondary) !important;
}

.category-link {
  background-color: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
  font-family: var(--font-ui) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  padding: 4px 10px !important;
  display: inline-block !important;
  margin: 3px !important;
  transition: background-color 200ms ease, color 200ms ease !important;
}

.category-link:hover {
  background-color: var(--accent) !important;
  color: #ffffff !important;
  border-color: var(--accent) !important;
}


/* ============================================================
   8. SIDEBAR
   ============================================================ */

.sidebar-block {
  background-color: var(--bg-secondary) !important;
  border-radius: var(--radius-md) !important;
  padding: 20px !important;
  margin-bottom: 20px !important;
}

.sidebar-header {
  color: var(--text-primary) !important;
  font-family: var(--font-ui) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

/* Pulses — sidebar tag list: taller buttons, tighter gap */
.sidebar-block .w-dyn-items {
  gap: 6px !important;
}

.sidebar-block .w-dyn-item {
  padding: 8px 0 !important;
}

.sidebar-block .category-link {
  padding: 10px 16px !important;
  margin: 0 !important;
  width: 100% !important;
  display: block !important;
  box-sizing: border-box !important;
}

/* Tablet: sidebar goes full-width, category lists go 2-col */
@media screen and (max-width: 991px) {
  .sidebar,
  .sidebar.left,
  .sidebar.right,
  .right-side-bar,
  .sidebar-block,
  .w-col:has(.sidebar-block),
  .w-col:has(.sidebar) {
    width: 100% !important;
    max-width: 100% !important;
  }
  .sidebar-block .w-dyn-items {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  .sidebar-block .w-dyn-item {
    padding: 0 !important;
  }
}

/* Quarry sidebar: also needs full-width on tablet */
@media screen and (max-width: 991px) {
  body.quarry .quarry-sidebar-link,
  body.quarry-entry .quarry-sidebar-link {
    width: auto !important;
  }
}

@media screen and (max-width: 479px) {
  .sidebar-block .w-dyn-items {
    grid-template-columns: 1fr !important;
  }
}

.subscribe-block.sidebar .text-field {
  background-color: var(--bg-primary) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-primary) !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-ui) !important;
  font-size: 14px !important;
  padding: 10px 14px !important;
}

.subscribe-block.sidebar .text-field::placeholder {
  color: var(--text-muted) !important;
}

.blog-and-sidebar.full {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 48px !important;
  background-color: var(--bg-primary) !important;
}

.right-collection-wrapper.full {
  flex: 1 1 0% !important;
  min-width: 0 !important;
  width: auto !important;
  background-color: var(--bg-primary) !important;
}

/* Kill all sticky sidebar behaviour site-wide */
.sidebar.left,
.sidebar-block,
.sidebar,
.sidebar.right,
.right-side-bar {
  position: static !important;
}

.sidebar.left {
  flex: 0 0 280px !important;
  width: 280px !important;
  min-width: 280px !important;
  max-width: 280px !important;
}

@media screen and (max-width: 991px) {
  .blog-and-sidebar.full {
    flex-direction: column !important;
  }
  .sidebar.left {
    flex: 0 0 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    position: static !important;
  }
}

.right-side-bar {
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
}

.icon-header.padding-bottom {
  padding-bottom: 12px !important;
  border-bottom: 1px solid var(--border) !important;
  margin-bottom: 12px !important;
}

.subscribe-block.sidebar .button.w-button,
.subscribe-block.sidebar input[type="submit"].w-button {
  background-color: var(--accent) !important;
  color: #ffffff !important;
  width: 100% !important;
  margin-top: 8px !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-ui) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  transition: background-color 200ms ease !important;
}

.subscribe-block.sidebar .button.w-button:hover,
.subscribe-block.sidebar input[type="submit"].w-button:hover {
  background-color: var(--accent-hover) !important;
  color: #ffffff !important;
}

.div-block-new {
  background-color: transparent !important;
  width: 100% !important;
}

.div-block-new .w-dyn-items,
.div-block-new .collection-list-tags {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 2px !important;
  width: 100% !important;
}

.div-block-new .w-dyn-item {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.div-block-new .w-dyn-item a {
  width: 100% !important;
  display: block !important;
  text-align: center !important;
  margin: 0 !important;
}

.sidebar-block.popular {
  background-color: var(--bg-secondary) !important;
}

.latest-block.left-aligiment {
  display: flex !important;
  gap: 12px !important;
  align-items: flex-start !important;
  padding: 12px 0 !important;
  border-bottom: 1px solid var(--border) !important;
}

.latest-block.left-aligiment:last-child {
  border-bottom: none !important;
}

.latest-image.smaller {
  width: 72px !important;
  height: 72px !important;
  min-width: 72px !important;
  border-radius: var(--radius-sm) !important;
  background-size: cover !important;
  background-position: center !important;
  display: block !important;
}

.latest-content {
  flex: 1 !important;
  min-width: 0 !important;
}

.post-title.smaller {
  font-family: var(--font-ui) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--text-primary) !important;
  line-height: 1.35 !important;
  margin: 0 !important;
}

.post-link:hover .post-title.smaller {
  color: var(--accent) !important;
}

.side-bar-second-wrapper.home:empty,
.block-wrapper.wrap:empty {
  display: none !important;
}

.collection-item-tags .category-link {
  display: block !important;
  background-color: var(--bg-elevated) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border) !important;
  font-family: var(--font-ui) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  border-radius: var(--radius-sm) !important;
  padding: 6px 10px !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  transition: background-color 200ms ease, color 200ms ease !important;
}

.collection-item-tags .category-link:hover {
  background-color: var(--accent) !important;
  color: #ffffff !important;
  border-color: var(--accent) !important;
}

.collection-item-tags .category-link.w--current {
  background-color: var(--accent) !important;
  color: #ffffff !important;
}


/* ============================================================
   9. PRICING
   ============================================================ */

.price-tab .tabs-menu.padding {
  background-color: var(--bg-secondary) !important;
  border-radius: var(--radius-md) !important;
  padding: 8px !important;
}

.price-tab .tab.w-tab-link {
  background-color: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  transition: background-color 200ms ease !important;
}

.price-tab .tab.w-tab-link * {
  color: var(--text-primary) !important;
}

.price-tab .tab.w-tab-link.w--current {
  background-color: var(--accent) !important;
  border-color: var(--accent) !important;
}

.price-tab .tab.w-tab-link.w--current * {
  color: #ffffff !important;
}

.check-icon {
  background-color: var(--accent) !important;
  border-color: var(--accent) !important;
}

.w--current .check-icon {
  background-color: #ffffff !important;
}

.pricing-block {
  background-color: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-md) !important;
  overflow: hidden !important;
}

.pricing-post-info {
  background-color: var(--accent) !important;
  padding: 20px !important;
}

.pricing-post-info * {
  color: #ffffff !important;
}

.white-link {
  color: rgba(255,255,255,0.75) !important;
  text-decoration: underline !important;
}

.white-link:hover {
  color: #ffffff !important;
}

.pricing-list {
  border-bottom: 1px solid var(--border) !important;
  padding: 12px 20px !important;
  font-family: var(--font-ui) !important;
  font-size: 14px !important;
}

.pricing-list div {
  color: var(--text-primary) !important;
}

.pricing-list.hide {
  opacity: 0.4 !important;
}

.pricing-title, .pricing-title.dark,
.pricing-text, .price-nr {
  color: var(--text-primary) !important;
  font-family: var(--font-ui) !important;
}

.monthly {
  color: var(--text-muted) !important;
  font-family: var(--font-ui) !important;
  font-size: 13px !important;
}


/* ============================================================
   10. BREADCRUMB / TAB BAR
   ============================================================ */

.w-tab-menu {
  background-color: rgba(0,0,0,0.35) !important;
  backdrop-filter: blur(4px) !important;
}

.w-tab-link {
  color: rgba(255,255,255,0.7) !important;
  font-family: var(--font-ui) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  background-color: transparent !important;
}

.w-tab-link:hover {
  color: #ffffff !important;
}

.w-tab-link.w--current {
  background-color: var(--text-primary) !important;
  color: var(--bg-primary) !important;
  border-radius: var(--radius-sm) !important;
}

.link-header-page {
  color: rgba(255,255,255,0.7) !important;
  font-family: var(--font-ui) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: color 200ms ease !important;
}

.link-header-page:not(:first-child)::before {
  content: '/' !important;
  margin: 0 8px !important;
  color: rgba(255,255,255,0.35) !important;
}

.link-header-page:hover {
  color: #ffffff !important;
}

.link-header-page.w--current {
  color: #ffffff !important;
  font-weight: 600 !important;
}


/* ============================================================
   11. FOOTER (unified dark blocks)
   ============================================================ */

footer.dark,
footer.footer.dark,
.footer.dark,
.footer.dark.no-padding {
  background-color: #0a0a0a !important;
  color: #f2f2f0 !important;
}

.footer.dark *, footer.dark * {
  color: var(--text-primary) !important;
}

.contact-info, .contact-info-cart {
  background-color: transparent !important;
}

.footer-title {
  color: var(--text-primary) !important;
  font-family: var(--font-ui) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  margin-bottom: 16px !important;
}

.link-menu, .link-menu.left, a.link-menu {
  display: inline-flex !important;
  align-items: center !important;
  background-color: var(--bg-elevated) !important;
  color: var(--text-secondary) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  padding: 8px 14px !important;
  margin-bottom: 6px !important;
  transition: background-color 200ms ease, color 200ms ease, border-color 200ms ease !important;
}

.link-menu:hover, a.link-menu:hover {
  background-color: var(--accent) !important;
  color: #ffffff !important;
  border-color: var(--accent) !important;
}

.button-wrapper-div .link-menu.w-inline-block {
  display: inline-flex !important;
  align-items: center !important;
  background-color: var(--text-primary) !important;
  color: var(--bg-primary) !important;
  border: none !important;
  padding: 12px 28px !important;
  border-radius: var(--radius-md) !important;
  transition: background-color 200ms ease !important;
}

.button-wrapper-div .link-menu.w-inline-block:hover {
  background-color: var(--accent) !important;
  color: #ffffff !important;
}

.footer-heading-link {
  color: inherit !important;
  font-family: var(--font-ui) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  margin: 0 !important;
}

.footer .logo, footer .logo {
  color: var(--text-primary) !important;
}

.footer .text-field, footer .text-field {
  background-color: var(--bg-primary) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-primary) !important;
  border-radius: var(--radius-sm) !important;
  padding: 10px 14px !important;
  font-family: var(--font-ui) !important;
  font-size: 14px !important;
}

.footer .text-field::placeholder, footer .text-field::placeholder {
  color: var(--text-muted) !important;
}

.footer .button.submit, footer .button.submit {
  background-color: var(--text-primary) !important;
  color: var(--bg-primary) !important;
}

.footer .button.submit:hover, footer .button.submit:hover {
  background-color: var(--accent) !important;
  color: #ffffff !important;
}

.footer p, footer p,
.footer .list-item, footer .list-item {
  color: var(--text-secondary) !important;
  font-family: var(--font-ui) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
}

.small-text {
  color: var(--text-muted) !important;
  font-family: var(--font-ui) !important;
  font-size: 12px !important;
}

.social-icon, .social-icon.border-line {
  background-color: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
  width: 36px !important;
  height: 36px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background-color 200ms ease, border-color 200ms ease !important;
}

.social-icon:hover, .social-icon.border-line:hover {
  background-color: var(--accent) !important;
  border-color: var(--accent) !important;
}

.invert-image {
  filter: none !important;
  opacity: 0.75 !important;
}

@media (prefers-color-scheme: dark) {
  .invert-image {
    filter: invert(1) !important;
    opacity: 0.9 !important;
  }
}

[data-theme="light"] .invert-image {
  filter: none !important;
  opacity: 0.75 !important;
}

[data-theme="dark"] .invert-image {
  filter: invert(1) !important;
  opacity: 0.9 !important;
}

.social-icon:hover .invert-image,
.social-icon.border-line:hover .invert-image {
  filter: invert(1) !important;
  opacity: 1 !important;
}

.footer-copyright,
.footer-copyright.no-line,
.footer-copyright.hhorizontal {
  background-color: var(--bg-secondary) !important;
  border-top: 1px solid var(--border) !important;
  border-radius: 0 !important;
  margin-top: 0 !important;
  padding: 20px 0 !important;
}

.footer-copyright * {
  color: var(--text-muted) !important;
  font-family: var(--font-ui) !important;
  font-size: 13px !important;
}

.footer-bottom-div {
  background-color: transparent !important;
}

.white-footer-link {
  color: rgba(255,255,255,0.75) !important;
  text-decoration: underline !important;
}

.white-footer-link:hover {
  color: #ffffff !important;
}

.back-to-top {
  font-family: var(--font-ui) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  color: inherit !important;
  margin: 0 !important;
}

/* footer.footer-horizontal base layout (colors overridden below in dark hardcoded block) */
footer.footer-horizontal {
  border-top: 1px solid var(--border) !important;
  padding: 32px 0 !important;
}

.footer-grid {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  padding-bottom: 20px !important;
  border-bottom: 1px solid var(--border) !important;
  margin-bottom: 16px !important;
}

.footer-submit-div {
  background-color: transparent !important;
}

/* .brand.w-nav-brand .logo — consolidated into section 4a */

footer .alternative,
.footer .alternative,
.footer-horizontal .alternative {
  display: flex !important;
  align-items: center !important;
  gap: 32px !important;
  background-color: transparent !important;
}

.footer-column {
  background-color: transparent !important;
}

a.footer-heading {
  color: var(--text-secondary) !important;
  font-family: var(--font-ui) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: color 200ms ease !important;
  background-color: transparent !important;
}

a.footer-heading:hover {
  color: var(--accent) !important;
}

footer.footer-horizontal .footer-copyright.hhorizontal {
  background-color: transparent !important;
  border-top: none !important;
  padding: 0 !important;
  margin-top: 0 !important;
}

/* FOOTER DARK HARDCODED — Always black for all footer variants, both modes */
footer.footer.dark.no-padding,
footer.footer-horizontal,
[data-theme="light"] footer.footer.dark.no-padding,
[data-theme="light"] footer.footer-horizontal {
  background-color: #0a0a0a !important;
  color: #f2f2f0 !important;
}

footer.footer.dark.no-padding h1,
footer.footer.dark.no-padding h2,
footer.footer.dark.no-padding h3,
footer.footer.dark.no-padding h4,
footer.footer.dark.no-padding h5,
footer.footer.dark.no-padding p,
footer.footer.dark.no-padding span,
footer.footer.dark.no-padding div,
footer.footer.dark.no-padding .footer-heading,
footer.footer.dark.no-padding .footer-link,
footer.footer-horizontal h1,
footer.footer-horizontal h2,
footer.footer-horizontal h3,
footer.footer-horizontal h4,
footer.footer-horizontal h5,
footer.footer-horizontal p,
footer.footer-horizontal span,
footer.footer-horizontal div {
  color: #f2f2f0 !important;
}

footer.footer.dark.no-padding a,
footer.footer-horizontal a,
footer.footer-horizontal .footer-heading {
  color: rgba(242, 242, 240, 0.7) !important;
}

footer.footer.dark.no-padding a:hover,
footer.footer.dark.no-padding .footer-link:hover,
footer.footer-horizontal a:hover,
footer.footer-horizontal .footer-heading:hover {
  color: #f2f2f0 !important;
}

footer.footer.dark.no-padding .bottom-bar,
footer.footer.dark.no-padding .icon-header,
footer.footer-horizontal .footer-grid {
  border-color: rgba(255, 255, 255, 0.1) !important;
}

footer.footer.dark.no-padding input[type="text"],
footer.footer.dark.no-padding input[type="email"],
footer.footer-horizontal input[type="text"],
footer.footer-horizontal input[type="email"] {
  background-color: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  color: #f2f2f0 !important;
}

footer.footer.dark.no-padding input[type="text"]::placeholder,
footer.footer.dark.no-padding input[type="email"]::placeholder,
footer.footer-horizontal input[type="text"]::placeholder,
footer.footer-horizontal input[type="email"]::placeholder {
  color: rgba(242, 242, 240, 0.4) !important;
}

footer.footer.dark.no-padding .button,
footer.footer.dark.no-padding input[type="submit"],
footer.footer-horizontal .button,
footer.footer-horizontal input[type="submit"] {
  background-color: var(--accent, #C45A28) !important;
  color: #f2f2f0 !important;
}

footer.footer.dark.no-padding .link-menu {
  background-color: transparent !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 8px !important;
}

footer.footer.dark.no-padding .link-menu:hover {
  background-color: var(--accent, #C45A28) !important;
  border-color: var(--accent, #C45A28) !important;
}

footer.footer.dark.no-padding .link-menu h4,
footer.footer.dark.no-padding .footer-heading-link {
  color: #f2f2f0 !important;
}

footer.footer.dark.no-padding .footer-copyright,
footer.footer-horizontal .footer-copyright {
  background-color: #050505 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

footer.footer.dark.no-padding .footer-copyright .footer-bottom-text,
footer.footer.dark.no-padding .footer-copyright .white-footer-link,
footer.footer.dark.no-padding .footer-copyright a,
footer.footer.dark.no-padding .footer-copyright .link,
footer.footer-horizontal .footer-copyright .white-footer-link,
footer.footer-horizontal .footer-copyright a,
footer.footer-horizontal .footer-copyright .link,
footer.footer-horizontal .footer-copyright .link.space {
  color: rgba(242, 242, 240, 0.5) !important;
}

footer.footer.dark.no-padding .footer-copyright a:hover,
footer.footer.dark.no-padding .footer-copyright .white-footer-link:hover,
footer.footer-horizontal .footer-copyright a:hover,
footer.footer-horizontal .footer-copyright .white-footer-link:hover {
  color: #f2f2f0 !important;
}

footer.footer.dark.no-padding .footer-title,
footer.footer-horizontal .footer-title {
  color: #f2f2f0 !important;
}

footer.footer.dark.no-padding .small-text,
footer.footer-horizontal .small-text {
  color: rgba(242, 242, 240, 0.4) !important;
}

footer.footer-horizontal .alternative a {
  color: rgba(242, 242, 240, 0.7) !important;
}

footer.footer-horizontal .alternative a:hover {
  color: #f2f2f0 !important;
}

footer.footer-horizontal .brand-name {
  color: #f2f2f0 !important;
}

/* --- Quarry footer: brown accent instead of orange --- */
/* Boost specificity to beat footer.footer.dark.no-padding .button (0,4,1) */
body.quarry footer.footer.dark.no-padding .button,
body.quarry footer.footer.dark.no-padding input[type="submit"],
body.quarry footer.footer-horizontal .button,
body.quarry footer.footer-horizontal input[type="submit"],
body.quarry footer .button,
body.quarry footer input[type="submit"] {
  background-color: var(--quarry-accent, #8B6F47) !important;
  color: #f2f2f0 !important;
}

body.quarry footer.footer.dark.no-padding .link-menu:hover,
body.quarry footer .link-menu:hover {
  background-color: var(--quarry-accent, #8B6F47) !important;
  border-color: var(--quarry-accent, #8B6F47) !important;
}

/* --- Quarry veins, marks, and all category-links: brown instead of orange --- */
/* Covers: sidebar veins, blog-tags-grid marks, collection-item-tags, generic */
body.quarry .category-link:hover,
body.quarry .blog-tags-grid .category-link:hover,
body.quarry .blog-tags-grid a.category-link:hover,
body.quarry .sidebar-block .category-link:hover,
body.quarry .collection-item-tags .category-link:hover {
  background-color: var(--quarry-accent, #8B6F47) !important;
  color: #ffffff !important;
  border-color: var(--quarry-accent, #8B6F47) !important;
}

body.quarry .category-link.w--current,
body.quarry .blog-tags-grid .category-link.w--current,
body.quarry .sidebar-block .category-link.w--current,
body.quarry .collection-item-tags .category-link.w--current {
  background-color: rgba(139, 111, 71, 0.2) !important;
  color: #E8E2DA !important;
  border-color: rgba(139, 111, 71, 0.5) !important;
}

/* Quarry tag color dots (small square icons beside tags) */
body.quarry .blog-tags-grid .w-dyn-item [style*="background-color"],
body.quarry .blog-tags-grid .color-tags,
body.quarry .blog-tags-grid .tag-color,
body.quarry .collection-item-tags [style*="background-color"]:not(.label-tag),
body.quarry .sidebar-block [style*="background-color"],
body.quarry .label-tag[style*="background-color"] {
  background-color: var(--quarry-accent, #8B6F47) !important;
}

/* Light mode quarry veins/marks */
[data-theme="light"] body.quarry .category-link:hover,
[data-theme="light"] body.quarry .blog-tags-grid .category-link:hover,
[data-theme="light"] body.quarry .blog-tags-grid a.category-link:hover,
[data-theme="light"] body.quarry .sidebar-block .category-link:hover,
[data-theme="light"] body.quarry .collection-item-tags .category-link:hover {
  background-color: var(--quarry-accent, #7A5C3A) !important;
  color: #ffffff !important;
  border-color: var(--quarry-accent, #7A5C3A) !important;
}

[data-theme="light"] body.quarry .category-link.w--current,
[data-theme="light"] body.quarry .blog-tags-grid .category-link.w--current,
[data-theme="light"] body.quarry .sidebar-block .category-link.w--current,
[data-theme="light"] body.quarry .collection-item-tags .category-link.w--current {
  background-color: #FFFFFF !important;
  color: #5A4630 !important;
  border-color: var(--quarry-accent, #8B6F47) !important;
  border-width: 2px !important;
}



/* ============================================================
   12. FORMS & RICH TEXT & GET IN TOUCH
   ============================================================ */

.w-richtext {
  color: var(--text-secondary) !important;
  font-family: var(--font-ui) !important;
  font-size: 17px !important;
  line-height: 1.75 !important;
}

.w-richtext h1, .w-richtext h2,
.w-richtext h3, .w-richtext h4,
.w-richtext h5, .w-richtext h6 {
  font-family: var(--font-ui) !important;
  color: var(--text-primary) !important;
  margin-top: 1.8em !important;
  margin-bottom: 0.5em !important;
  line-height: 1.25 !important;
}

.w-richtext h3 {
  font-size: 26px !important;
}

.w-richtext h6 {
  font-family: var(--font-ui) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  color: var(--text-muted) !important;
  text-transform: uppercase !important;
}

.w-richtext p {
  color: var(--text-secondary) !important;
  margin-bottom: 1.2em !important;
}

.w-richtext a {
  color: var(--accent) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

.w-richtext a:hover {
  color: var(--accent-hover) !important;
}

.w-richtext ul, .w-richtext ol {
  color: var(--text-secondary) !important;
  padding-left: 1.5em !important;
  margin-bottom: 1.2em !important;
}

.w-richtext li {
  color: var(--text-secondary) !important;
  margin-bottom: 0.4em !important;
  line-height: 1.7 !important;
}

.w-richtext strong {
  color: var(--text-primary) !important;
  font-weight: 700 !important;
}

.w-richtext em {
  color: inherit !important;
}

.w-richtext figure {
  margin: 2em 0 !important;
  border-radius: var(--radius-md) !important;
  overflow: hidden !important;
}

.w-richtext figure img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: var(--radius-md) !important;
}

.button-wrapper-div.tags {
  padding-top: 32px !important;
  border-top: 1px solid var(--border) !important;
  margin-top: 32px !important;
}

.category-link.gray,
.collection-list-tags .category-link {
  display: inline-block !important;
  background-color: var(--text-primary) !important;
  color: var(--bg-primary) !important;
  font-family: var(--font-ui) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  border-radius: var(--radius-sm) !important;
  padding: 5px 14px !important;
  margin: 3px !important;
  border: none !important;
  text-decoration: none !important;
  transition: background-color 200ms ease, color 200ms ease !important;
}

.category-link.gray:hover,
.collection-list-tags .category-link:hover {
  background-color: var(--accent) !important;
  color: #ffffff !important;
}

/* Get in Touch form on About page */
h2.left {
  font-family: var(--font-heading) !important;
  font-size: 2.4rem !important;
  font-weight: 700 !important;
  color: var(--text-primary) !important;
  margin-bottom: 8px !important;
}

.w-form {
  max-width: 560px !important;
}

.w-form label,
.field-label {
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--text-muted) !important;
  margin-bottom: 6px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}

.w-form input[type="text"],
.w-form input[type="email"],
.w-form textarea,
.text-field,
.text-field-2,
.textarea {
  background-color: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid var(--border) !important;
  border-radius: 4px !important;
  color: var(--text-primary) !important;
  font-family: var(--font-body) !important;
  font-size: 15px !important;
  padding: 12px 16px !important;
  width: 100% !important;
  max-width: 560px !important;
  transition: border-color 0.2s ease !important;
}

.w-form input[type="text"]:focus,
.w-form input[type="email"]:focus,
.w-form textarea:focus,
.text-field:focus,
.text-field-2:focus,
.textarea:focus {
  border-color: var(--accent) !important;
  outline: none !important;
  background-color: rgba(255, 255, 255, 0.09) !important;
}

.w-form textarea,
.textarea {
  min-height: 140px !important;
  resize: vertical !important;
}

.w-form input[type="submit"],
.w-form .w-button,
.w-form .button,
a.button.w-button {
  background-color: var(--accent) !important;
  color: #fff !important;
  font-family: var(--font-ui) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  padding: 14px 32px !important;
  border: none !important;
  border-radius: 4px !important;
  cursor: pointer !important;
  transition: background-color 0.2s ease !important;
  margin-top: 8px !important;
}

.w-form input[type="submit"]:hover,
.w-form .w-button:hover,
.w-form .button:hover,
a.button.w-button:hover {
  background-color: var(--accent-hover, #a84820) !important;
}

[data-theme="light"] .w-form input[type="text"],
[data-theme="light"] .w-form input[type="email"],
[data-theme="light"] .w-form textarea,
[data-theme="light"] .text-field,
[data-theme="light"] .text-field-2,
[data-theme="light"] .textarea {
  background-color: rgba(0, 0, 0, 0.03) !important;
  border-color: rgba(0, 0, 0, 0.15) !important;
  color: var(--text-primary) !important;
}


/* ============================================================
   13. BLOG POST PAGE (inner page heroes)
   ============================================================ */

.page-header-label,
.collection-header-label,
[style*="background-image"] .label-tag,
.split-image.hero .label-tag,
.collection-list-hero .label-tag {
  color: #F2F2F2 !important;
  background: transparent !important;
}

.page-header-title,
.collection-header-title,
[style*="background-image"] h1,
[style*="background-image"] h2,
[style*="background-image"] .page-title,
[style*="background-image"] .collection-header,
[style*="background-image"] .small-text,
.split-image.hero h1,
.split-image.hero h2,
.split-image.hero .page-title,
.collection-list-hero h1,
.collection-list-hero h2 {
  color: #ffffff !important;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
}

.breadcrumb-link,
.breadcrumb-current,
[style*="background-image"] .w-tab-link,
[style*="background-image"] .link-header-page,
.split-image.hero .w-tab-link,
.split-image.hero .link-header-page,
.collection-list-hero .w-tab-link {
  color: rgba(242, 242, 242, 0.7) !important;
}

[style*="background-image"] .w-breadcrumb,
[style*="background-image"] .w-breadcrumb a,
[style*="background-image"] .w-breadcrumb span {
  color: rgba(242, 242, 242, 0.7) !important;
}

[style*="background-image"] .w-breadcrumb .w-breadcrumb-current,
[style*="background-image"] .w-tab-link.w--current,
[style*="background-image"] .link-header-page.w--current,
.split-image.hero .w-tab-link.w--current,
.split-image.hero .link-header-page.w--current,
.collection-list-hero .w-tab-link.w--current {
  color: #ffffff !important;
  background-color: #0f0f0f !important;
}

/* Blog entry hero — dark base. Background-image: none is EXCLUDED from
   Long Rides template (69a18d72) which wants a CMS-bound hero photo. */
.section.hero-section.background.blog-single-page {
  background-color: #0f0905 !important;
  color: #f2f2f0 !important;
}
body:not([data-wf-page="69a18d72d9995e3315a40f0a"]) .section.hero-section.background.blog-single-page {
  background-image: none !important;
}

.section.hero-section.background.blog-single-page h1,
.section.hero-section.background.blog-single-page h2,
.section.hero-section.background.blog-single-page p,
.section.hero-section.background.blog-single-page span,
.section.hero-section.background.blog-single-page .big-headline,
.section.hero-section.background.blog-single-page .white,
.section.hero-section.background.blog-single-page .date-text {
  color: #f2f2f0 !important;
}

.section.hero-section.background.blog-single-page .link-header-page {
  color: rgba(255, 255, 255, 0.7) !important;
}

.section.hero-section.background.blog-single-page .breadcrumbs-block {
  color: rgba(255, 255, 255, 0.5) !important;
}


/* ============================================================
   14. CATEGORY CARDS
   ============================================================ */

.cagerie-wrapper {
  background-color: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-md) !important;
  transition: background-color 200ms ease, border-color 200ms ease !important;
}

.cagerie-wrapper:hover {
  border-color: var(--accent) !important;
}

.categorie-name {
  color: var(--text-primary) !important;
  font-family: var(--font-ui) !important;
}

/* Invert zone card icons only (not pulse PNGs which have their own amber color) */
[data-theme="light"] a[href*="/zone/"] .cagerie-wrapper img,
body:not(.dark-mode) a[href*="/zone/"] .cagerie-wrapper img {
  filter: invert(1) !important;
}

[data-theme="dark"] a[href*="/zone/"] .cagerie-wrapper img,
body.dark-mode a[href*="/zone/"] .cagerie-wrapper img {
  filter: none !important;
}

.link-block.w--current .cagerie-wrapper {
  border-color: var(--accent) !important;
  background-color: var(--bg-secondary) !important;
}

/* --- Quarry vein/mark nav cards: brown accent instead of orange --- */
body.quarry .cagerie-wrapper:hover,
body.quarry .link-block:hover .cagerie-wrapper {
  border-color: var(--quarry-accent, #8B6F47) !important;
}

/* Kill any border/outline on the link-block itself — style goes on cagerie-wrapper */
body.quarry .link-block.w--current {
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* Quarry active state — dark mode: subtle warm brown */
body.quarry .link-block.w--current .cagerie-wrapper {
  border-color: var(--quarry-accent, #8B6F47) !important;
  border-width: 2px !important;
  background-color: rgba(139, 111, 71, 0.15) !important;
  border-radius: var(--radius-md) !important;
}

/* Quarry active state — light mode: white bg, brown border */
[data-theme="light"] body.quarry .link-block.w--current .cagerie-wrapper {
  border-color: var(--quarry-accent, #8B6F47) !important;
  border-width: 2px !important;
  background-color: #FFFFFF !important;
  border-radius: var(--radius-md) !important;
}


/* ============================================================
   15. NEWSLETTER / SUBSCRIBE BLOCK
   ============================================================ */

.contact-form-div,
.form-k-contact {
  background-color: var(--bg-elevated) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-lg) !important;
  transition: background-color 200ms ease !important;
}

.contact-form-div h2,
.contact-form-div p,
.contact-form-div .large-paragraph,
.contact-form-div .small-text {
  color: var(--text-primary) !important;
}

.contact-info-color {
  background-color: var(--bg-secondary) !important;
  border-radius: var(--radius-md) !important;
}

.blog-tags-grid .w-dyn-item [style*="background-color"],
.blog-tags-grid .color-tags,
.blog-tags-grid .tag-color,
.collection-item-tags [style*="background-color"]:not(.label-tag) {
  background-color: var(--accent) !important;
  border-radius: 3px !important;
}

.blog-tags-grid .category-link,
.blog-tags-grid a.category-link {
  background-color: var(--bg-elevated) !important;
  color: var(--text-primary) !important;
  border-color: var(--border) !important;
}

.blog-tags-grid .category-link:hover,
.blog-tags-grid a.category-link:hover {
  background-color: var(--accent) !important;
  color: #ffffff !important;
  border-color: var(--accent) !important;
}

.blog-tags-grid .category-link.w--current {
  border-color: var(--accent) !important;
  color: var(--accent) !important;
}


/* ============================================================
   16. BLOCKQUOTE
   ============================================================ */

blockquote {
  border-left: 3px solid #C45A28 !important;
  background-color: #161616 !important;
  color: #f2f2f0 !important;
  font-family: var(--font-accent) !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  line-height: 1.6 !important;
  margin-top: 40px !important;
  margin-bottom: 40px !important;
  padding: 32px 40px !important;
  border-radius: 0 4px 4px 0 !important;
}

[data-theme="light"] blockquote {
  background-color: #f5f0eb !important;
  color: #1a1a18 !important;
  border-left-color: #C45A28 !important;
}

@media (prefers-color-scheme: light) {
  blockquote {
    background-color: #f5f0eb !important;
    color: #1a1a18 !important;
  }
}


/* ============================================================
   17. PURPLE KILL — inline style colour overrides
   ============================================================ */

.collection-item-tags [style*="background-color"],
.w-dyn-item [class*="color-tag"][style],
.w-dyn-item [class*="tag-color"][style],
[class*="color-tag"][style*="background"],
[class*="tag-dot"][style],
[class*="tag-colour"][style] {
  background-color: #C45A28 !important;
}

[style*="60b347"],
[style*="3cb371"],
[style*="medium-sea-green"] {
  background-color: #C45A28 !important;
  border-color: #C45A28 !important;
  color: #C45A28 !important;
}

.label-tag[style*="background-color"],
.label-tag.white[style*="background-color"] {
  background-color: #C45A28 !important;
}

[style*="hsl(241"],
[style*="hsl(226"],
[style*="rgb(120, 56"],
[style*="rgb(124, 58"],
[style*="rgb(139, 92"] {
  background-color: #C45A28 !important;
  border-color: #C45A28 !important;
}


/* ============================================================
   18. INNER PAGE HERO SVG BACKGROUNDS
   ============================================================ */

/* SLIDE 2 — "The Climb" (cyclist silhouette) */
.w-slider-mask .hero-slide:nth-child(2) .hero-slider-wrapper {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1280 560' preserveAspectRatio='xMidYMid slice'%3E%3Cdefs%3E%3ClinearGradient id='sky3' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0%25' stop-color='%230f0905'/%3E%3Cstop offset='25%25' stop-color='%23280f06'/%3E%3Cstop offset='55%25' stop-color='%234a1e0a'/%3E%3Cstop offset='75%25' stop-color='%238c3a18'/%3E%3Cstop offset='90%25' stop-color='%23c45a28'/%3E%3Cstop offset='100%25' stop-color='%23d97a4a'/%3E%3C/linearGradient%3E%3CradialGradient id='sunburst' cx='72%25' cy='46%25' r='22%25'%3E%3Cstop offset='0%25' stop-color='%23f0b060' stop-opacity='1'/%3E%3Cstop offset='30%25' stop-color='%23e8924a' stop-opacity='0.8'/%3E%3Cstop offset='60%25' stop-color='%23c45a28' stop-opacity='0.4'/%3E%3Cstop offset='100%25' stop-color='%230f0905' stop-opacity='0'/%3E%3C/radialGradient%3E%3ClinearGradient id='ridge' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0%25' stop-color='%23160804'/%3E%3Cstop offset='100%25' stop-color='%230a0502'/%3E%3C/linearGradient%3E%3C/defs%3E%3C!-- Sky --%3E%3Crect width='1280' height='560' fill='url(%23sky3)'/%3E%3C!-- Sunburst at ridge break --%3E%3Crect width='1280' height='560' fill='url(%23sunburst)'/%3E%3C!-- Sun rays emanating from ridge break --%3E%3Cline x1='922' y1='248' x2='1050' y2='80' stroke='%23f0b060' stroke-width='1.5' opacity='0.15'/%3E%3Cline x1='922' y1='248' x2='1100' y2='120' stroke='%23f0b060' stroke-width='1' opacity='0.12'/%3E%3Cline x1='922' y1='248' x2='980' y2='60' stroke='%23f0b060' stroke-width='1' opacity='0.1'/%3E%3Cline x1='922' y1='248' x2='850' y2='80' stroke='%23f0b060' stroke-width='1' opacity='0.1'/%3E%3Cline x1='922' y1='248' x2='820' y2='130' stroke='%23f0b060' stroke-width='0.8' opacity='0.08'/%3E%3C!-- Far background mountains --%3E%3Cpath d='M0 340 L100 295 L200 320 L300 280 L420 305 L520 265 L640 290 L740 255 L860 285 L950 248 L1040 272 L1140 238 L1240 262 L1280 252 L1280 560 L0 560 Z' fill='%23401808' opacity='0.5'/%3E%3C!-- Left ridge - dark, in shadow --%3E%3Cpath d='M0 380 L0 420 L80 390 L160 370 L240 385 L300 360 L380 375 L440 350 L500 368 L560 380 L560 560 L0 560 Z' fill='url(%23ridge)'/%3E%3C!-- Right ridge - sun catching the peak --%3E%3Cpath d='M720 560 L720 360 L800 330 L860 345 L920 248 L960 265 L1000 285 L1060 310 L1120 330 L1180 310 L1240 290 L1280 308 L1280 560 Z' fill='url(%23ridge)'/%3E%3C!-- Ridge peak sun flare --%3E%3Ccircle cx='922' cy='248' r='6' fill='%23f0b060' opacity='0.9'/%3E%3Ccircle cx='922' cy='248' r='14' fill='%23f0b060' opacity='0.25'/%3E%3Ccircle cx='922' cy='248' r='28' fill='%23e8924a' opacity='0.12'/%3E%3C!-- Valley / pass between ridges --%3E%3Cpath d='M560 380 L640 360 L720 360 L560 560 Z' fill='%231a0a04' opacity='0.8'/%3E%3Cpath d='M560 380 L640 355 L720 360 L720 560 L560 560 Z' fill='%23120804' opacity='0.9'/%3E%3C!-- Cyclist silhouette on left ridge ascent --%3E%3C!-- Body leaning forward (climbing) --%3E%3Cellipse cx='398' cy='356' rx='5' ry='7' fill='%23080402' opacity='0.9' transform='rotate(-20 398 356)'/%3E%3C!-- Head --%3E%3Ccircle cx='400' cy='349' r='3.5' fill='%23080402' opacity='0.9'/%3E%3C!-- Helmet shape --%3E%3Cpath d='M397 347 L403 347 L404 344 L396 344 Z' fill='%23c45a28' opacity='0.85'/%3E%3C!-- Arms reaching to bars --%3E%3Cpath d='M396 352 L388 355' stroke='%23080402' stroke-width='1.5' opacity='0.9'/%3E%3C!-- Bike frame --%3E%3Cpath d='M388 355 L395 365 L405 365 L398 354' stroke='%23080402' stroke-width='1.2' fill='none' opacity='0.85'/%3E%3C!-- Handlebars --%3E%3Cpath d='M386 353 L390 353' stroke='%23080402' stroke-width='1.5' opacity='0.9'/%3E%3C!-- Wheels --%3E%3Ccircle cx='390' cy='366' r='5' stroke='%23080402' stroke-width='1.2' fill='none' opacity='0.85'/%3E%3Ccircle cx='406' cy='366' r='5' stroke='%23080402' stroke-width='1.2' fill='none' opacity='0.85'/%3E%3C%21--%20Brand%20cairn%20waypoint%20--%3E%3Cpath%20d='M448.6%20358.0%20L449.0%20355.4%20L461.4%20355.4%20L461.0%20358.0%20Z'%20fill='%23F2F2F2'%20opacity='0.32'/%3E%3Cpath%20d='M452.2%20355.0%20L452.6%20352.4%20L461.2%20352.4%20L460.8%20355.0%20Z'%20fill='%23F2F2F2'%20opacity='0.54'/%3E%3Cpath%20d='M448.8%20352.0%20L449.2%20349.4%20L455.2%20349.4%20L454.8%20352.0%20Z'%20fill='%23F2F2F2'%20opacity='0.78'/%3E%3Cpath%20d='M452.6%20348.6%20L453.1%20346.0%20L456.9%20346.0%20L456.5%20348.6%20Z'%20fill='%23c45a28'%20opacity='0.85'/%3E%3C!-- Atmospheric haze at base --%3E%3Crect x='0' y='380' width='1280' height='40' fill='%23c45a28' opacity='0.04'/%3E%3Crect x='0' y='420' width='1280' height='140' fill='%230a0502'/%3E%3C!-- Stars faint --%3E%3Ccircle cx='80' cy='40' r='0.8' fill='%23f2f2f2' opacity='0.4'/%3E%3Ccircle cx='200' cy='25' r='1' fill='%23f2f2f2' opacity='0.35'/%3E%3Ccircle cx='350' cy='55' r='0.7' fill='%23f2f2f2' opacity='0.3'/%3E%3Ccircle cx='500' cy='30' r='0.9' fill='%23f2f2f2' opacity='0.35'/%3E%3Ccircle cx='600' cy='18' r='0.8' fill='%23f2f2f2' opacity='0.3'/%3E%3Ccircle cx='180' cy='75' r='0.6' fill='%23f2f2f2' opacity='0.25'/%3E%3Ccircle cx='450' cy='80' r='0.7' fill='%23f2f2f2' opacity='0.25'/%3E%3C/svg%3E") !important;
  background-size: cover !important;
  background-position: center center !important;
}

.w-slider-mask .hero-slide:nth-child(1) .hero-slider-wrapper {
  background-image: url("https://cdn.prod.website-files.com/699a9ce320b6521b71d8f606/699a9ce320b6521b71d8f699_18.jpg") !important;
  background-size: cover !important;
  background-position: center center !important;
}

.w-slider-mask .hero-slide:nth-child(3) .hero-slider-wrapper {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201280%20560'%20preserveAspectRatio='xMidYMid%20slice'%3E%0A%3Cdefs%3E%0A%3ClinearGradient%20id='skyR'%20x1='0'%20y1='0'%20x2='0'%20y2='1'%3E%0A%3Cstop%20offset='0%'%20stop-color='#0f0905'/%3E%0A%3Cstop%20offset='20%'%20stop-color='#1a0c06'/%3E%0A%3Cstop%20offset='50%'%20stop-color='#3a1808'/%3E%0A%3Cstop%20offset='75%'%20stop-color='#7a3218'/%3E%0A%3Cstop%20offset='92%'%20stop-color='#c45a28'/%3E%0A%3Cstop%20offset='100%'%20stop-color='#d97a4a'/%3E%0A%3C/linearGradient%3E%0A%3CradialGradient%20id='glowR'%20cx='50%'%20cy='52%'%20r='25%'%3E%0A%3Cstop%20offset='0%'%20stop-color='#f0b060'%20stop-opacity='0.9'/%3E%0A%3Cstop%20offset='40%'%20stop-color='#c45a28'%20stop-opacity='0.4'/%3E%0A%3Cstop%20offset='100%'%20stop-color='#0f0905'%20stop-opacity='0'/%3E%0A%3C/radialGradient%3E%0A%3C/defs%3E%0A%3C!--%20Sky%20--%3E%0A%3Crect%20width='1280'%20height='560'%20fill='url(#skyR)'/%3E%0A%3Crect%20width='1280'%20height='560'%20fill='url(#glowR)'/%3E%0A%3C!--%20Stars%20--%3E%0A%3Ccircle%20cx='100'%20cy='30'%20r='0.9'%20fill='#f2f2f2'%20opacity='0.4'/%3E%0A%3Ccircle%20cx='240'%20cy='20'%20r='1.1'%20fill='#f2f2f2'%20opacity='0.35'/%3E%0A%3Ccircle%20cx='380'%20cy='50'%20r='0.7'%20fill='#f2f2f2'%20opacity='0.3'/%3E%0A%3Ccircle%20cx='550'%20cy='25'%20r='0.8'%20fill='#f2f2f2'%20opacity='0.35'/%3E%0A%3Ccircle%20cx='720'%20cy='15'%20r='0.9'%20fill='#f2f2f2'%20opacity='0.3'/%3E%0A%3Ccircle%20cx='900'%20cy='40'%20r='0.7'%20fill='#f2f2f2'%20opacity='0.25'/%3E%0A%3Ccircle%20cx='1050'%20cy='22'%20r='0.8'%20fill='#f2f2f2'%20opacity='0.3'/%3E%0A%3Ccircle%20cx='1180'%20cy='45'%20r='0.6'%20fill='#f2f2f2'%20opacity='0.25'/%3E%0A%3Ccircle%20cx='160'%20cy='70'%20r='0.6'%20fill='#f2f2f2'%20opacity='0.2'/%3E%0A%3Ccircle%20cx='480'%20cy='75'%20r='0.5'%20fill='#f2f2f2'%20opacity='0.2'/%3E%0A%3Ccircle%20cx='800'%20cy='65'%20r='0.7'%20fill='#f2f2f2'%20opacity='0.22'/%3E%0A%3C!--%20Left%20mesa%20--%3E%0A%3Cpath%20d='M60%20310%20L80%20200%20L120%20195%20L200%20200%20L220%20310%20Z'%20fill='#2a1008'%20opacity='0.7'/%3E%0A%3Cpath%20d='M80%20200%20L120%20195%20L200%20200%20L80%20200%20Z'%20fill='#3a1a0c'%20opacity='0.6'/%3E%0A%3C!--%20Right%20mesa%20cluster%20--%3E%0A%3Cpath%20d='M900%20300%20L930%20180%20L970%20175%20L1040%20178%20L1080%20175%20L1120%20180%20L1150%20300%20Z'%20fill='#2a1008'%20opacity='0.7'/%3E%0A%3Cpath%20d='M930%20180%20L970%20175%20L1040%20178%20L1080%20175%20L1120%20180%20L930%20180%20Z'%20fill='#3a1a0c'%20opacity='0.6'/%3E%0A%3C!--%20Small%20distant%20mesa%20--%3E%0A%3Cpath%20d='M380%20305%20L400%20260%20L440%20258%20L460%20305%20Z'%20fill='#1e0c06'%20opacity='0.5'/%3E%0A%3C!--%20Desert%20floor%20--%3E%0A%3Cpath%20d='M0%20310%20L1280%20300%20L1280%20560%20L0%20560%20Z'%20fill='#1a0c06'/%3E%0A%3C!--%20Road%20%E2%80%94%20converging%20perspective%20--%3E%0A%3Cpath%20d='M490%20560%20L620%20310%20L660%20310%20L790%20560%20Z'%20fill='#0e0804'%20opacity='0.85'/%3E%0A%3C!--%20Center%20line%20dashes%20--%3E%0A%3Cline%20x1='640'%20y1='310'%20x2='638'%20y2='340'%20stroke='#c45a28'%20stroke-width='1.5'%20opacity='0.5'/%3E%0A%3Cline%20x1='637'%20y1='355'%20x2='635'%20y2='385'%20stroke='#c45a28'%20stroke-width='1.8'%20opacity='0.45'/%3E%0A%3Cline%20x1='633'%20y1='405'%20x2='630'%20y2='440'%20stroke='#c45a28'%20stroke-width='2.2'%20opacity='0.4'/%3E%0A%3Cline%20x1='627'%20y1='465'%20x2='622'%20y2='505'%20stroke='#c45a28'%20stroke-width='2.8'%20opacity='0.35'/%3E%0A%3Cline%20x1='618'%20y1='530'%20x2='612'%20y2='560'%20stroke='#c45a28'%20stroke-width='3.2'%20opacity='0.3'/%3E%0A%3C!--%20Road%20shoulder%20lines%20--%3E%0A%3Cline%20x1='620'%20y1='310'%20x2='490'%20y2='560'%20stroke='#3a1a0c'%20stroke-width='1'%20opacity='0.3'/%3E%0A%3Cline%20x1='660'%20y1='310'%20x2='790'%20y2='560'%20stroke='#3a1a0c'%20stroke-width='1'%20opacity='0.3'/%3E%0A%3C!--%20Vanishing%20point%20sun%20glow%20--%3E%0A%3Ccircle%20cx='640'%20cy='295'%20r='8'%20fill='#f0b060'%20opacity='0.7'/%3E%0A%3Ccircle%20cx='640'%20cy='295'%20r='18'%20fill='#f0b060'%20opacity='0.2'/%3E%0A%3Ccircle%20cx='640'%20cy='295'%20r='35'%20fill='#e8924a'%20opacity='0.08'/%3E%0A%3C!--%20Desert%20brush%20scattered%20--%3E%0A%3Cellipse%20cx='320'%20cy='340'%20rx='12'%20ry='5'%20fill='#1e0c06'%20opacity='0.6'/%3E%0A%3Cellipse%20cx='850'%20cy='335'%20rx='10'%20ry='4'%20fill='#1e0c06'%20opacity='0.5'/%3E%0A%3Cellipse%20cx='200'%20cy='380'%20rx='15'%20ry='6'%20fill='#160a04'%20opacity='0.5'/%3E%0A%3Cellipse%20cx='1060'%20cy='370'%20rx='13'%20ry='5'%20fill='#160a04'%20opacity='0.5'/%3E%0A%3Cellipse%20cx='420'%20cy='420'%20rx='18'%20ry='7'%20fill='#120804'%20opacity='0.4'/%3E%0A%3Cellipse%20cx='750'%20cy='400'%20rx='14'%20ry='5'%20fill='#120804'%20opacity='0.4'/%3E%0A%3C!--%20Brand%20cairn%20%E2%80%94%20left%20foreground%20--%3E%0A%3Cpath%20d='M228.6%20420.0%20L230.0%20411.4%20L271.4%20411.4%20L270.0%20420.0%20Z'%20fill='%23F2F2F2'%20opacity='0.32'/%3E%0A%3Cpath%20d='M240.7%20410.0%20L242.1%20401.4%20L270.7%20401.4%20L269.3%20410.0%20Z'%20fill='%23F2F2F2'%20opacity='0.54'/%3E%0A%3Cpath%20d='M229.3%20400.0%20L230.7%20391.4%20L250.7%20391.4%20L249.3%20400.0%20Z'%20fill='%23F2F2F2'%20opacity='0.78'/%3E%0A%3Cpath%20d='M242.1%20388.6%20L243.6%20380.0%20L256.4%20380.0%20L255.0%20388.6%20Z'%20fill='%23c45a28'%20opacity='0.85'/%3E%0A%3C!--%20Atmospheric%20dust/haze%20at%20horizon%20--%3E%0A%3Crect%20x='0'%20y='295'%20width='1280'%20height='25'%20fill='#c45a28'%20opacity='0.06'/%3E%0A%3C!--%20Ground%20texture%20near%20bottom%20--%3E%0A%3Crect%20x='0'%20y='480'%20width='1280'%20height='80'%20fill='#0a0502'%20opacity='0.4'/%3E%0A%3C/svg%3E") !important;
  background-size: cover !important;
  background-position: center center !important;
}

/* SLIDE 4 — "About / Origin" (cairn on hillside at dusk) */
.w-slider-mask .hero-slide:nth-child(4) .hero-slider-wrapper {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1280 560' preserveAspectRatio='xMidYMid slice'%3E%3Cdefs%3E%3ClinearGradient id='skyA' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0%25' stop-color='%230f0905'/%3E%3Cstop offset='18%25' stop-color='%23180a04'/%3E%3Cstop offset='40%25' stop-color='%23301208'/%3E%3Cstop offset='65%25' stop-color='%23602818'/%3E%3Cstop offset='85%25' stop-color='%23a84820'/%3E%3Cstop offset='100%25' stop-color='%23c45a28'/%3E%3C/linearGradient%3E%3CradialGradient id='duskA' cx='35%25' cy='58%25' r='30%25'%3E%3Cstop offset='0%25' stop-color='%23f0b060' stop-opacity='0.6'/%3E%3Cstop offset='50%25' stop-color='%23c45a28' stop-opacity='0.25'/%3E%3Cstop offset='100%25' stop-color='%230f0905' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Crect width='1280' height='560' fill='url(%23skyA)'/%3E%3Crect width='1280' height='560' fill='url(%23duskA)'/%3E%3Ccircle cx='110' cy='35' r='0.8' fill='%23f2f2f2' opacity='0.4'/%3E%3Ccircle cx='280' cy='22' r='1' fill='%23f2f2f2' opacity='0.35'/%3E%3Ccircle cx='450' cy='48' r='0.7' fill='%23f2f2f2' opacity='0.3'/%3E%3Ccircle cx='620' cy='28' r='0.9' fill='%23f2f2f2' opacity='0.32'/%3E%3Ccircle cx='780' cy='18' r='0.8' fill='%23f2f2f2' opacity='0.28'/%3E%3Ccircle cx='950' cy='38' r='0.7' fill='%23f2f2f2' opacity='0.25'/%3E%3Ccircle cx='1100' cy='55' r='0.6' fill='%23f2f2f2' opacity='0.22'/%3E%3Cpath d='M0 340 L120 280 L260 310 L400 260 L520 290 L640 240 L760 270 L880 230 L1000 260 L1120 220 L1200 250 L1280 235 L1280 560 L0 560 Z' fill='%23201008' opacity='0.6'/%3E%3Cpath d='M0 380 L180 340 L320 360 L440 320 L560 350 L640 310 L720 340 L840 300 L960 330 L1080 290 L1200 310 L1280 295 L1280 560 L0 560 Z' fill='%23150a04'/%3E%3Cpath d='M540 310 L580 220 L620 215 L660 218 L700 310 Z' fill='%231a0c06' opacity='0.9'/%3E%3Cpath d='M580 220 L620 215 L660 218 L580 220 Z' fill='%23251208' opacity='0.7'/%3E%3Cpath d='M608 216 L609 204 L623 204 L622 216 Z' fill='%23F2F2F2' opacity='0.32'/%3E%3Cpath d='M611 204 L612 194 L621 194 L620 204 Z' fill='%23F2F2F2' opacity='0.54'/%3E%3Cpath d='M609 194 L610 186 L618 186 L617 194 Z' fill='%23F2F2F2' opacity='0.78'/%3E%3Cpath d='M612 186 L613 179 L617 179 L616 186 Z' fill='%23c45a28' opacity='0.9'/%3E%3Crect x='0' y='340' width='1280' height='30' fill='%23c45a28' opacity='0.04'/%3E%3Crect x='0' y='460' width='1280' height='100' fill='%230a0502' opacity='0.5'/%3E%3C/svg%3E") !important;
  background-size: cover !important;
  background-position: center center !important;
}


/* ============================================================
   19. LIGHT MODE TEXT FIXES
   ============================================================ */

[data-theme="light"] {
  --silver: var(--text-secondary);
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --silver: var(--text-secondary);
  }
}

.about-copy-wrapper p,
.about-copy-wrapper .large-paragraph,
.container.about p,
.container.about .large-paragraph {
  color: var(--text-primary) !important;
}

.container.about .small-text,
.container.about .w-richtext p {
  color: var(--text-secondary) !important;
}

.slogan-wrapper p,
.slogan-wrapper .large-paragraph,
.slogan-wrapper h2,
.slogan-wrapper h3 {
  color: var(--text-primary) !important;
}

/* --- Zone / Pulse tags: LIGHT MODE styling ---
   In dark mode, --bg-elevated is dark. In light mode it's white,
   making tags invisible. Override to accent-tinted ghost style. */

[data-theme="light"] .collection-item-tags .category-link,
[data-theme="light"] .sidebar-block .category-link,
[data-theme="light"] .category-link {
  background-color: rgba(196, 90, 40, 0.08) !important;
  color: #3a2a1a !important;
  border: 1px solid rgba(196, 90, 40, 0.22) !important;
}

[data-theme="light"] .collection-item-tags .category-link:hover,
[data-theme="light"] .sidebar-block .category-link:hover,
[data-theme="light"] .category-link:hover {
  background-color: var(--accent) !important;
  color: #ffffff !important;
  border-color: var(--accent) !important;
}

[data-theme="light"] .collection-item-tags .category-link.w--current,
[data-theme="light"] .sidebar-block .category-link.w--current,
[data-theme="light"] .category-link.w--current {
  background-color: rgba(196, 90, 40, 0.15) !important;
  color: #C45A28 !important;
  border-color: rgba(196, 90, 40, 0.35) !important;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) .collection-item-tags .category-link,
  :root:not([data-theme="dark"]) .sidebar-block .category-link,
  :root:not([data-theme="dark"]) .category-link {
    background-color: rgba(196, 90, 40, 0.08) !important;
    color: #3a2a1a !important;
    border: 1px solid rgba(196, 90, 40, 0.22) !important;
  }

  :root:not([data-theme="dark"]) .collection-item-tags .category-link:hover,
  :root:not([data-theme="dark"]) .sidebar-block .category-link:hover,
  :root:not([data-theme="dark"]) .category-link:hover {
    background-color: var(--accent) !important;
    color: #ffffff !important;
    border-color: var(--accent) !important;
  }

  :root:not([data-theme="dark"]) .collection-item-tags .category-link.w--current,
  :root:not([data-theme="dark"]) .sidebar-block .category-link.w--current,
  :root:not([data-theme="dark"]) .category-link.w--current {
    background-color: rgba(196, 90, 40, 0.15) !important;
    color: #C45A28 !important;
    border-color: rgba(196, 90, 40, 0.35) !important;
  }
}


/* ============================================================
   20. ABOUT PAGE — Cairn SVG in dark well (works both themes)
   ============================================================ */

.image-grid.about {
  position: relative !important;
  display: block !important;
}

.image-grid.about .w-embed {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 200px !important;
  background-color: #0f0905 !important;
  border-radius: 16px !important;
  padding: 48px 32px !important;
}

/* Always white cairn stones on the dark well */
.image-grid.about .w-embed svg path {
  fill: #f2f2f0 !important;
}

/* Orange capstone */
.image-grid.about .w-embed svg path:last-child {
  fill: #c45a28 !important;
}

/* Page hero: cairn watermark (top) + dark overlay + photo (bottom) */
.section.hero-section.background {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 500' opacity='0.12'%3E%3Cpath d='M130 460 L132 430 L290 430 L288 460 Z' fill='%23F2F2F2' opacity='0.32'/%3E%3Cpath d='M175 428 L177 398 L285 398 L283 428 Z' fill='%23F2F2F2' opacity='0.54'/%3E%3Cpath d='M140 396 L142 366 L210 366 L208 396 Z' fill='%23F2F2F2' opacity='0.78'/%3E%3Cpath d='M178 362 L180 332 L218 332 L216 362 Z' fill='%23C45A28'/%3E%3C/svg%3E"),
    linear-gradient(135deg, rgba(10,22,40,0.30) 0%, rgba(42,31,24,0.25) 50%, rgba(15,15,15,0.35) 100%),
    url("https://static.endurist.workers.dev/images/cairnshero-warm-flipped.jpg") !important;
  background-size: 280px auto, cover, cover !important;
  background-position: right 10% bottom 20px, center, center !important;
  background-repeat: no-repeat, no-repeat, no-repeat !important;
}

[data-theme="light"] .section.hero-section.background {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 500' opacity='0.15'%3E%3Cpath d='M130 460 L132 430 L290 430 L288 460 Z' fill='%231a1a1a' opacity='0.22'/%3E%3Cpath d='M175 428 L177 398 L285 398 L283 428 Z' fill='%231a1a1a' opacity='0.38'/%3E%3Cpath d='M140 396 L142 366 L210 366 L208 396 Z' fill='%231a1a1a' opacity='0.58'/%3E%3Cpath d='M178 362 L180 332 L218 332 L216 362 Z' fill='%23C45A28'/%3E%3C/svg%3E"),
    linear-gradient(135deg, rgba(245,240,232,0.25) 0%, rgba(250,248,244,0.20) 50%, rgba(255,255,255,0.30) 100%),
    url("https://static.endurist.workers.dev/images/cairnshero-warm-flipped.jpg") !important;
  background-size: 280px auto, cover, cover !important;
  background-position: right 10% bottom 20px, center, center !important;
  background-repeat: no-repeat, no-repeat, no-repeat !important;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) .section.hero-section.background {
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 500' opacity='0.15'%3E%3Cpath d='M130 460 L132 430 L290 430 L288 460 Z' fill='%231a1a1a' opacity='0.22'/%3E%3Cpath d='M175 428 L177 398 L285 398 L283 428 Z' fill='%231a1a1a' opacity='0.38'/%3E%3Cpath d='M140 396 L142 366 L210 366 L208 396 Z' fill='%231a1a1a' opacity='0.58'/%3E%3Cpath d='M178 362 L180 332 L218 332 L216 362 Z' fill='%23C45A28'/%3E%3C/svg%3E"),
      linear-gradient(135deg, rgba(245,240,232,0.25) 0%, rgba(250,248,244,0.20) 50%, rgba(255,255,255,0.30) 100%),
      url("https://static.endurist.workers.dev/images/cairnshero-warm-flipped.jpg") !important;
    background-size: 280px auto, cover, cover !important;
    background-position: right 10% bottom 20px, center, center !important;
    background-repeat: no-repeat, no-repeat, no-repeat !important;
  }
}

/* --- Long Rides page: force dark theme across entire page ---
   Page ID: 69a13b0a8bf70721f71f8d26
   Uses data-wf-page attribute for reliable targeting regardless of
   whether the hero has the combo class set. */
body[data-wf-page="69a13b0a8bf70721f71f8d26"] {
  background-color: #0f0f0f !important;
  color: #f2f2f0 !important;
}

body[data-wf-page="69a13b0a8bf70721f71f8d26"] .section {
  background-color: #0f0f0f !important;
  color: #f2f2f0 !important;
}

body[data-wf-page="69a13b0a8bf70721f71f8d26"] a {
  color: var(--accent, #C45A28) !important;
}

body[data-wf-page="69a13b0a8bf70721f71f8d26"] .container,
body[data-wf-page="69a13b0a8bf70721f71f8d26"] .w-container,
body[data-wf-page="69a13b0a8bf70721f71f8d26"] .w-dyn-item,
body[data-wf-page="69a13b0a8bf70721f71f8d26"] .collection-list-wrapper,
body[data-wf-page="69a13b0a8bf70721f71f8d26"] [class*="card"],
body[data-wf-page="69a13b0a8bf70721f71f8d26"] [class*="wrapper"]:not(.w-slider-mask):not(.w-nav-overlay) {
  background-color: transparent !important;
  color: #f2f2f0 !important;
}

body[data-wf-page="69a13b0a8bf70721f71f8d26"] h1,
body[data-wf-page="69a13b0a8bf70721f71f8d26"] h2,
body[data-wf-page="69a13b0a8bf70721f71f8d26"] h3,
body[data-wf-page="69a13b0a8bf70721f71f8d26"] h4 {
  color: #f2f2f0 !important;
}

body[data-wf-page="69a13b0a8bf70721f71f8d26"] p {
  color: #b8b4ae !important;
}

/* Layer 2 REMOVED — was combo-class sibling fallback (.long-rides ~ .section)
   Redundant with Layer 1 (body[data-wf-page]) which already forces dark on
   the entire page. Killed to eliminate !important collisions. */

/* --- Long Rides template (entry detail) page: force dark ---
   Page ID: 69a18d72d9995e3315a40f0a */
body[data-wf-page="69a18d72d9995e3315a40f0a"] {
  background-color: #0f0f0f !important;
  color: #f2f2f0 !important;
}

body[data-wf-page="69a18d72d9995e3315a40f0a"] .section {
  background-color: #0f0f0f !important;
}

body[data-wf-page="69a18d72d9995e3315a40f0a"] h1,
body[data-wf-page="69a18d72d9995e3315a40f0a"] h2 {
  color: #f2f2f0 !important;
}

body[data-wf-page="69a18d72d9995e3315a40f0a"] p,
body[data-wf-page="69a18d72d9995e3315a40f0a"] .w-richtext p {
  color: #b8b4ae !important;
  font-family: var(--font-body) !important;
}

/* --- Long Rides template: hero background image ---
   The generic .blog-single-page rule (line ~1785) sets background-image: none
   for Intervals' solid dark hero. Long Rides wants a CMS-bound bg image,
   so we restore it here with higher specificity via the page-ID selector.
   The CMS sets background-image inline; we just need to unset our kill. */
body[data-wf-page="69a18d72d9995e3315a40f0a"] .section.hero-section.background.blog-single-page {
  /* background-image comes from CMS inline style — NOT killed here */
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  position: relative !important;
  min-height: 420px !important;
  overflow: hidden !important;
}

/* Dark overlay so text reads over the hero image */
body[data-wf-page="69a18d72d9995e3315a40f0a"] .section.hero-section.background.blog-single-page::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(
    to bottom,
    rgba(15, 15, 15, 0.45) 0%,
    rgba(15, 15, 15, 0.75) 100%
  ) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

/* Ensure hero content sits above the overlay */
body[data-wf-page="69a18d72d9995e3315a40f0a"] .section.hero-section.background.blog-single-page .w-layout-blockcontainer,
body[data-wf-page="69a18d72d9995e3315a40f0a"] .section.hero-section.background.blog-single-page .hero-slide-content,
body[data-wf-page="69a18d72d9995e3315a40f0a"] .section.hero-section.background.blog-single-page .breadcrumbs-block {
  position: relative !important;
  z-index: 2 !important;
}

/* --- Long Rides template: sidebar spacing ---
   Add vertical rhythm between sidebar blocks. */
body[data-wf-page="69a18d72d9995e3315a40f0a"] .sidebar .sidebar-block + .sidebar-block {
  margin-top: 32px !important;
  padding-top: 32px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
}

/* =============================================
   JOURNAL FEED — "Wall of Entries" Styling
   ============================================= */

/* --- Journal content section: full dark immersion --- */
.section.hero-section.background.journal ~ .section {
  background-color: var(--bg-primary, #0f0905) !important;
  padding-top: 3rem !important;
  padding-bottom: 4rem !important;
}

/* --- Journal container: constrain width for readability --- */
.section.hero-section.background.journal ~ .section .container {
  max-width: 820px !important;
  background-color: transparent !important;
  color: var(--text-primary, #f2f2f0) !important;
}

/* --- Journal feed: constrain to site content width --- */
.w-dyn-list:has(.journal-entry) {
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
}

/* --- Each journal entry: card-style with left accent border --- */
/* Gradient: warm orange hint → charcoal (lifts off the black bg) */
.journal-entry {
  background: linear-gradient(135deg,
    rgba(196, 90, 40, 0.08) 0%,
    rgba(36, 36, 36, 0.85) 40%,
    rgba(30, 30, 30, 0.95) 100%) !important;
  border: 1px solid rgba(196, 90, 40, 0.15) !important;
  border-left: 3px solid var(--accent, #C45A28) !important;
  border-radius: 6px !important;
  padding: 2rem 2.25rem !important;
  margin-bottom: 1.75rem !important;
  transition: border-color 0.3s ease, background 0.3s ease, transform 0.2s ease !important;
  position: relative !important;
}

.journal-entry:hover {
  border-color: rgba(196, 90, 40, 0.4) !important;
  background: linear-gradient(135deg,
    rgba(196, 90, 40, 0.12) 0%,
    rgba(40, 40, 40, 0.9) 40%,
    rgba(34, 34, 34, 0.95) 100%) !important;
  transform: translateY(-1px) !important;
}

/* --- Date/time tag: styled pill --- */
.journal-entry .label-tag,
.journal-entry .post-info-tag {
  display: inline-block !important;
  background: rgba(196, 90, 40, 0.15) !important;
  color: var(--accent, #C45A28) !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  padding: 0.3rem 0.75rem !important;
  border-radius: 3px !important;
  margin-bottom: 0.85rem !important;
  border: 1px solid rgba(196, 90, 40, 0.25) !important;
}

/* --- Entry heading: warm, bold --- */
.journal-entry h2,
.journal-entry h3,
.journal-entry .heading-style-h4,
.journal-entry .post-title {
  color: #f2f2f0 !important;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  margin-bottom: 0.75rem !important;
  letter-spacing: -0.01em !important;
}

/* --- Entry body text: readable with good line height --- */
.journal-entry p,
.journal-entry .w-richtext p {
  color: rgba(242, 242, 240, 0.82) !important;
  font-size: 1rem !important;
  line-height: 1.75 !important;
  margin-bottom: 0.75rem !important;
}

/* --- Rich text inside journal entries --- */
.journal-entry .w-richtext {
  color: rgba(242, 242, 240, 0.82) !important;
}

.journal-entry .w-richtext h2,
.journal-entry .w-richtext h3 {
  color: #f2f2f0 !important;
  margin-top: 1.25rem !important;
  margin-bottom: 0.5rem !important;
}

.journal-entry .w-richtext blockquote {
  border-left: 3px solid var(--accent, #C45A28) !important;
  padding-left: 1.25rem !important;
  color: rgba(242, 242, 240, 0.7) !important;
  font-style: italic !important;
  margin: 1.25rem 0 !important;
}

.journal-entry .w-richtext ul,
.journal-entry .w-richtext ol {
  color: rgba(242, 242, 240, 0.82) !important;
  padding-left: 1.5rem !important;
}

/* --- Journal entry images --- */
.journal-entry img {
  border-radius: 4px !important;
  margin: 1rem 0 !important;
  max-width: 100% !important;
}

/* --- Collection list wrapper: remove any default bg --- */
.section.hero-section.background.journal ~ .section .w-dyn-list,
.section.hero-section.background.journal ~ .section .w-dyn-items,
.section.hero-section.background.journal ~ .section .collection-list-wrapper {
  background: transparent !important;
}

/* --- Any inner wrappers or link blocks --- */
.journal-entry a {
  color: var(--accent, #C45A28) !important;
  text-decoration: none !important;
}

.journal-entry a:hover {
  text-decoration: underline !important;
}

/* --- Mobile responsive: tighter padding --- */
@media (max-width: 767px) {
  .journal-entry {
    padding: 1.5rem 1.25rem !important;
    margin-bottom: 1.25rem !important;
  }

  .section.hero-section.background.journal ~ .section .container {
    max-width: 100% !important;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  .journal-entry h2,
  .journal-entry h3,
  .journal-entry .heading-style-h4 {
    font-size: 1.25rem !important;
  }
}

/* --- Journal entries: LIGHT MODE --- */
[data-theme="light"] .journal-entry {
  background: linear-gradient(135deg,
    rgba(196, 90, 40, 0.04) 0%,
    rgba(250, 245, 238, 0.9) 40%,
    rgba(255, 252, 248, 0.95) 100%) !important;
  border: 1px solid rgba(196, 90, 40, 0.18) !important;
  border-left: 3px solid var(--accent, #C45A28) !important;
}

[data-theme="light"] .journal-entry:hover {
  background: linear-gradient(135deg,
    rgba(196, 90, 40, 0.07) 0%,
    rgba(250, 245, 238, 0.95) 40%,
    rgba(255, 252, 248, 1) 100%) !important;
  border-color: rgba(196, 90, 40, 0.35) !important;
}

[data-theme="light"] .journal-entry h2,
[data-theme="light"] .journal-entry h3,
[data-theme="light"] .journal-entry .heading-style-h4,
[data-theme="light"] .journal-entry .post-title {
  color: var(--text-primary, #1a1a1a) !important;
}

[data-theme="light"] .journal-entry p,
[data-theme="light"] .journal-entry .w-richtext,
[data-theme="light"] .journal-entry .w-richtext p {
  color: var(--text-secondary, #444) !important;
}

[data-theme="light"] .journal-entry .label-tag,
[data-theme="light"] .journal-entry .post-info-tag {
  background: rgba(196, 90, 40, 0.10) !important;
  border-color: rgba(196, 90, 40, 0.20) !important;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) .journal-entry {
    background: linear-gradient(135deg,
      rgba(196, 90, 40, 0.04) 0%,
      rgba(250, 245, 238, 0.9) 40%,
      rgba(255, 252, 248, 0.95) 100%) !important;
    border: 1px solid rgba(196, 90, 40, 0.18) !important;
    border-left: 3px solid var(--accent, #C45A28) !important;
  }

  :root:not([data-theme="dark"]) .journal-entry:hover {
    background: linear-gradient(135deg,
      rgba(196, 90, 40, 0.07) 0%,
      rgba(250, 245, 238, 0.95) 40%,
      rgba(255, 252, 248, 1) 100%) !important;
    border-color: rgba(196, 90, 40, 0.35) !important;
  }

  :root:not([data-theme="dark"]) .journal-entry h2,
  :root:not([data-theme="dark"]) .journal-entry h3,
  :root:not([data-theme="dark"]) .journal-entry .heading-style-h4,
  :root:not([data-theme="dark"]) .journal-entry .post-title {
    color: var(--text-primary, #1a1a1a) !important;
  }

  :root:not([data-theme="dark"]) .journal-entry p,
  :root:not([data-theme="dark"]) .journal-entry .w-richtext,
  :root:not([data-theme="dark"]) .journal-entry .w-richtext p {
    color: var(--text-secondary, #444) !important;
  }

  :root:not([data-theme="dark"]) .journal-entry .label-tag,
  :root:not([data-theme="dark"]) .journal-entry .post-info-tag {
    background: rgba(196, 90, 40, 0.10) !important;
    border-color: rgba(196, 90, 40, 0.20) !important;
  }
}

/* --- Consistent hero height across all pages --- */
.section.hero-section.background {
  min-height: 550px !important;
  padding-bottom: 60px !important;
}

/* --- Push breadcrumb to bottom of hero on pages where it's nested in container ---
     Long Rides & Journal wrap content in container > hero-slide-content,
     unlike Intervals where breadcrumb is a direct hero child.
     Make the container fill the hero and flex-push breadcrumb down. --- */
.section.hero-section.background > .container {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  width: 100% !important;
}

/* Kill Webflow placeholder SVG on hero-slide-content everywhere —
   broadened from child combinator (>) to descendant so it catches
   both listing pages (section > container > hero-slide-content)
   and carousel slides (section > slider > mask > slide > ... > container > hero-slide-content) */
.hero-slide-content {
  background-image: none !important;
  background-color: transparent !important;
}

.section.hero-section.background > .container > .hero-slide-content {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
}

.section.hero-section.background > .container > .hero-slide-content > .breadcrumbs-block {
  margin-top: auto !important;
}

/* --- Journal page hero: journal-hero-flipped.jpg --- */
.section.hero-section.background.journal {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 500' opacity='0.12'%3E%3Cpath d='M130 460 L132 430 L290 430 L288 460 Z' fill='%23F2F2F2' opacity='0.32'/%3E%3Cpath d='M175 428 L177 398 L285 398 L283 428 Z' fill='%23F2F2F2' opacity='0.54'/%3E%3Cpath d='M140 396 L142 366 L210 366 L208 396 Z' fill='%23F2F2F2' opacity='0.78'/%3E%3Cpath d='M178 362 L180 332 L218 332 L216 362 Z' fill='%23C45A28'/%3E%3C/svg%3E"),
    linear-gradient(135deg, rgba(10,22,40,0.30) 0%, rgba(42,31,24,0.25) 50%, rgba(15,15,15,0.35) 100%),
    url("https://static.endurist.workers.dev/images/journal-hero-flipped.jpg") !important;
}

[data-theme="light"] .section.hero-section.background.journal {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 500' opacity='0.15'%3E%3Cpath d='M130 460 L132 430 L290 430 L288 460 Z' fill='%231a1a1a' opacity='0.22'/%3E%3Cpath d='M175 428 L177 398 L285 398 L283 428 Z' fill='%231a1a1a' opacity='0.38'/%3E%3Cpath d='M140 396 L142 366 L210 366 L208 396 Z' fill='%231a1a1a' opacity='0.58'/%3E%3Cpath d='M178 362 L180 332 L218 332 L216 362 Z' fill='%23C45A28'/%3E%3C/svg%3E"),
    linear-gradient(135deg, rgba(245,240,232,0.25) 0%, rgba(250,248,244,0.20) 50%, rgba(255,255,255,0.30) 100%),
    url("https://static.endurist.workers.dev/images/journal-hero-flipped.jpg") !important;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) .section.hero-section.background.journal {
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 500' opacity='0.15'%3E%3Cpath d='M130 460 L132 430 L290 430 L288 460 Z' fill='%231a1a1a' opacity='0.22'/%3E%3Cpath d='M175 428 L177 398 L285 398 L283 428 Z' fill='%231a1a1a' opacity='0.38'/%3E%3Cpath d='M140 396 L142 366 L210 366 L208 396 Z' fill='%231a1a1a' opacity='0.58'/%3E%3Cpath d='M178 362 L180 332 L218 332 L216 362 Z' fill='%23C45A28'/%3E%3C/svg%3E"),
      linear-gradient(135deg, rgba(245,240,232,0.25) 0%, rgba(250,248,244,0.20) 50%, rgba(255,255,255,0.30) 100%),
      url("https://static.endurist.workers.dev/images/journal-hero-flipped.jpg") !important;
  }
}

/* --- Intervals page hero: blue/amber silhouette --- */
.section.hero-section.background.blog {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 500' opacity='0.12'%3E%3Cpath d='M130 460 L132 430 L290 430 L288 460 Z' fill='%23F2F2F2' opacity='0.32'/%3E%3Cpath d='M175 428 L177 398 L285 398 L283 428 Z' fill='%23F2F2F2' opacity='0.54'/%3E%3Cpath d='M140 396 L142 366 L210 366 L208 396 Z' fill='%23F2F2F2' opacity='0.78'/%3E%3Cpath d='M178 362 L180 332 L218 332 L216 362 Z' fill='%23C45A28'/%3E%3C/svg%3E"),
    linear-gradient(135deg, rgba(10,22,40,0.30) 0%, rgba(42,31,24,0.25) 50%, rgba(15,15,15,0.35) 100%),
    url("https://static.endurist.workers.dev/images/hero-intervals.jpg") !important;
}

[data-theme="light"] .section.hero-section.background.blog {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 500' opacity='0.15'%3E%3Cpath d='M130 460 L132 430 L290 430 L288 460 Z' fill='%231a1a1a' opacity='0.22'/%3E%3Cpath d='M175 428 L177 398 L285 398 L283 428 Z' fill='%231a1a1a' opacity='0.38'/%3E%3Cpath d='M140 396 L142 366 L210 366 L208 396 Z' fill='%231a1a1a' opacity='0.58'/%3E%3Cpath d='M178 362 L180 332 L218 332 L216 362 Z' fill='%23C45A28'/%3E%3C/svg%3E"),
    linear-gradient(135deg, rgba(245,240,232,0.25) 0%, rgba(250,248,244,0.20) 50%, rgba(255,255,255,0.30) 100%),
    url("https://static.endurist.workers.dev/images/hero-intervals.jpg") !important;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) .section.hero-section.background.blog {
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 500' opacity='0.15'%3E%3Cpath d='M130 460 L132 430 L290 430 L288 460 Z' fill='%231a1a1a' opacity='0.22'/%3E%3Cpath d='M175 428 L177 398 L285 398 L283 428 Z' fill='%231a1a1a' opacity='0.38'/%3E%3Cpath d='M140 396 L142 366 L210 366 L208 396 Z' fill='%231a1a1a' opacity='0.58'/%3E%3Cpath d='M178 362 L180 332 L218 332 L216 362 Z' fill='%23C45A28'/%3E%3C/svg%3E"),
      linear-gradient(135deg, rgba(245,240,232,0.25) 0%, rgba(250,248,244,0.20) 50%, rgba(255,255,255,0.30) 100%),
      url("https://static.endurist.workers.dev/images/hero-intervals.jpg") !important;
  }
}

/* --- Long Rides page hero: warm sunrise bottom crop ---
     NOTE: Long Rides page currently unpublished. Once published,
     verify the hero section class (likely .long-rides) and update selector. */
.section.hero-section.background.long-rides {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 500' opacity='0.12'%3E%3Cpath d='M130 460 L132 430 L290 430 L288 460 Z' fill='%23F2F2F2' opacity='0.32'/%3E%3Cpath d='M175 428 L177 398 L285 398 L283 428 Z' fill='%23F2F2F2' opacity='0.54'/%3E%3Cpath d='M140 396 L142 366 L210 366 L208 396 Z' fill='%23F2F2F2' opacity='0.78'/%3E%3Cpath d='M178 362 L180 332 L218 332 L216 362 Z' fill='%23C45A28'/%3E%3C/svg%3E"),
    linear-gradient(135deg, rgba(10,22,40,0.30) 0%, rgba(42,31,24,0.25) 50%, rgba(15,15,15,0.35) 100%),
    url("https://static.endurist.workers.dev/images/hero-longrides.jpg") !important;
}

[data-theme="light"] .section.hero-section.background.long-rides {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 500' opacity='0.15'%3E%3Cpath d='M130 460 L132 430 L290 430 L288 460 Z' fill='%231a1a1a' opacity='0.22'/%3E%3Cpath d='M175 428 L177 398 L285 398 L283 428 Z' fill='%231a1a1a' opacity='0.38'/%3E%3Cpath d='M140 396 L142 366 L210 366 L208 396 Z' fill='%231a1a1a' opacity='0.58'/%3E%3Cpath d='M178 362 L180 332 L218 332 L216 362 Z' fill='%23C45A28'/%3E%3C/svg%3E"),
    linear-gradient(135deg, rgba(245,240,232,0.25) 0%, rgba(250,248,244,0.20) 50%, rgba(255,255,255,0.30) 100%),
    url("https://static.endurist.workers.dev/images/hero-longrides.jpg") !important;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) .section.hero-section.background.long-rides {
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 500' opacity='0.15'%3E%3Cpath d='M130 460 L132 430 L290 430 L288 460 Z' fill='%231a1a1a' opacity='0.22'/%3E%3Cpath d='M175 428 L177 398 L285 398 L283 428 Z' fill='%231a1a1a' opacity='0.38'/%3E%3Cpath d='M140 396 L142 366 L210 366 L208 396 Z' fill='%231a1a1a' opacity='0.58'/%3E%3Cpath d='M178 362 L180 332 L218 332 L216 362 Z' fill='%23C45A28'/%3E%3C/svg%3E"),
      linear-gradient(135deg, rgba(245,240,232,0.25) 0%, rgba(250,248,244,0.20) 50%, rgba(255,255,255,0.30) 100%),
      url("https://static.endurist.workers.dev/images/hero-longrides.jpg") !important;
  }
}

.collection-list-hero .w-breadcrumb,
.collection-list-hero .breadcrumb-wrapper,
.page-header .breadcrumb-wrapper,
.split-image.hero .breadcrumb-wrapper {
  display: none !important;
}

.side-bar-second-wrapper.home {
  width: 30% !important;
  min-width: 260px !important;
  flex: 0 0 30% !important;
}

@media screen and (max-width: 991px) {
  .side-bar-second-wrapper.home {
    width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
  }
}


/* ============================================================
   21. RESPONSIVE (all @media queries grouped)
   ============================================================ */

@media screen and (max-width: 991px) {
  .container.about .w-layout-grid.grid,
  .w-layout-grid.grid,
  .section .w-layout-grid.grid,
  .section .container .w-layout-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .container.about .w-layout-grid.grid > *,
  .w-layout-grid.grid > * {
    width: 100% !important;
    max-width: 100% !important;
  }

  .image-grid,
  .image-grid.about {
    width: 100% !important;
    max-width: 100% !important;
  }

  .section .container,
  .container.about,
  .section .container.about {
    max-width: 100% !important;
    overflow: hidden !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  blockquote,
  .blockquote {
    font-size: 1.4rem !important;
    line-height: 1.4 !important;
  }

  .footer.dark .w-layout-grid,
  .footer.dark .w-row,
  .footer .w-layout-grid,
  .footer .w-row,
  footer .w-layout-grid,
  footer .w-row {
    display: flex !important;
    flex-direction: column !important;
    gap: 32px !important;
  }

  .footer.dark .w-col,
  .footer .w-col,
  footer .w-col {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .footer-grid {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  .alternative {
    flex-direction: column !important;
    gap: 16px !important;
    width: 100% !important;
  }

  .footer-column {
    width: 100% !important;
  }

  .contact-info, .contact-info-cart {
    width: 100% !important;
  }

  .link-menu, .link-menu.left, a.link-menu {
    width: 100% !important;
    justify-content: center !important;
  }

  .button-wrapper-div {
    width: 100% !important;
  }

  .button-wrapper-div .link-menu.w-inline-block {
    width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
  }

  .section:has(.section-heading) {
    padding: 48px 4% 60px !important;
  }

  .collection-list-hero.w-dyn-items {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .collection-list-hero .w-dyn-item {
    height: 280px !important;
  }
}

@media screen and (max-width: 479px) {
  .w-layout-grid.grid {
    gap: 16px !important;
  }

  blockquote,
  .blockquote {
    font-size: 1.2rem !important;
  }

  .footer.dark,
  footer.dark {
    padding: 24px 16px !important;
  }

  .footer-title {
    font-size: 16px !important;
  }

  .section:has(.section-heading) {
    padding: 32px 4% 40px !important;
  }

  .collection-list-hero.w-dyn-items {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .collection-list-hero .w-dyn-item {
    height: 300px !important;
  }

  .section-heading .center-section-name h1::after {
    font-size: 24px !important;
  }
}

@media screen and (max-width: 767px) {
  .section:has(.section-heading) {
    padding: 40px 4% 48px !important;
  }

  .collection-list-hero.w-dyn-items {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .collection-list-hero .w-dyn-item {
    height: 280px !important;
  }

  .section:has(.section-heading) > .container {
    order: 4 !important;
    flex: 0 0 100% !important;
    justify-content: center !important;
    margin-top: 24px !important;
    margin-bottom: 0 !important;
  }
}


/* ============================================================
   22. IA TEXT OVERRIDES
   ============================================================ */

/* IA TEXT OVERRIDES — CSS renames removed. Set labels in Designer. */

.categorie,
a.categorie,
.link-header-page.categorie {
  background-color: #c45a28 !important;
}


/* ============================================================
   23. RELATED ENTRIES LAYOUT
   ============================================================ */

.section:has(.section-heading) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  padding: 60px 5% 80px !important;
  gap: 0 !important;
  overflow: visible !important;
}

.section:has(.section-heading) > .section-heading {
  order: 1 !important;
  flex: 1 1 auto !important;
  width: auto !important;
  height: auto !important;
  margin-bottom: 32px !important;
}

.section:has(.section-heading) > .container {
  order: 2 !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: auto !important;
  display: flex !important;
  align-items: center !important;
  margin-bottom: 32px !important;
}

.section:has(.section-heading) > .w-dyn-list {
  order: 3 !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  height: auto !important;
}

.collection-list-hero.w-dyn-items {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
  width: 100% !important;
}

.collection-list-hero .w-dyn-item {
  height: 420px !important;
  overflow: hidden !important;
  border-radius: 8px !important;
}

.collection-list-hero .w-dyn-item .split-image.hero {
  height: 100% !important;
}

/* Responsive: AFTER base rule so cascade wins */
@media screen and (max-width: 991px) {
  .collection-list-hero.w-dyn-items {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
  }
  .collection-list-hero .w-dyn-item {
    height: 320px !important;
  }
}

@media screen and (max-width: 479px) {
  .collection-list-hero.w-dyn-items {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .collection-list-hero .w-dyn-item {
    height: 260px !important;
  }
}


/* ============================================================
   24. FOOTER NAV FIXES
   ============================================================ */

/* Footer "The Log" rename removed — set in Designer */

.footer-grid .footer-column .footer-heading[href="/contact-us"] {
  display: none !important;
}

.footer-grid .footer-column:has(.footer-heading[href="/contact-us"]) {
  display: none !important;
}

/* Footer copyright + about renames removed — set in Designer */

.footer-copyright .white-footer-link[href="/contact-us"] {
  display: none !important;
}

.footer-copyright .white-footer-link[href="/contact-us"] + .link.space,
.footer-copyright div:has(> .white-footer-link[href="/contact-us"]) {
  display: none !important;
}

.footer-copyright div:last-of-type:has(> .white-footer-link[href="/contact-us"]) ~ div:has(> .link.space) {
  display: none !important;
}

.footer-horizontal .brand-name .logo {
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  display: block;
  width: 180px;
  height: 40px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 80' fill='none'%3E%3Cpath d='M3 76 L5 64 L63 64 L61 76 Z' fill='%23F2F2F2' opacity='0.32'/%3E%3Cpath d='M20 62 L22 50 L62 50 L60 62 Z' fill='%23F2F2F2' opacity='0.54'/%3E%3Cpath d='M4 48 L6 36 L34 36 L32 48 Z' fill='%23F2F2F2' opacity='0.78'/%3E%3Cpath d='M22 32 L24 20 L42 20 L40 32 Z' fill='%23C45A28'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 30px 40px;
  background-position: left center;
  padding-left: 38px;
}

.footer-horizontal .brand-name .logo::after {
  content: 'ENDURIST';
  font-size: 20px;
  font-family: Inter, -apple-system, system-ui, sans-serif;
  font-weight: 800;
  color: #f2f2f0;
  letter-spacing: -0.6px;
  line-height: 40px;
}

.footer-flex .link-menu:empty::before {
  content: 'Get in Touch';
  font-family: var(--font-ui) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  color: inherit !important;
}


/* ============================================================
   25. MISC FIXES
   ============================================================ */

.hero-slider.w-slider {
  width: 100% !important;
}

.mask.w-slider-mask {
  width: 100% !important;
}

.hero-slide.w-slide {
  width: 100% !important;
}

.hero-slide:has(.w-dyn-empty) {
  display: none !important;
}

/* Dot hiding removed — JS now manages dot count to match 4 slides */

.image-grid.home {
  width: 100% !important;
  overflow: hidden !important;
  border-radius: 8px !important;
}

.image-grid.home img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.image-grid.home a {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

.image-grid.home a img,
.image-grid.home .thumbnail-image {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.sidebar-block.popular .latest-block {
  flex-direction: column !important;
  width: 100% !important;
}

.sidebar-block.popular .latest-image.smaller {
  width: 100% !important;
  height: 160px !important;
  border-radius: 8px !important;
  margin-bottom: 12px !important;
  background-size: cover !important;
  background-position: center !important;
}

.sidebar-block.popular .latest-content {
  width: 100% !important;
}

.section.hero-section.background:not(.blog-single-page) {
  background-color: #0f0905 !important;
  color: #f2f2f0 !important;
}

.section.hero-section.background:not(.blog-single-page) h1,
.section.hero-section.background:not(.blog-single-page) h2,
.section.hero-section.background:not(.blog-single-page) h3,
.section.hero-section.background:not(.blog-single-page) p,
.section.hero-section.background:not(.blog-single-page) span,
.section.hero-section.background:not(.blog-single-page) .hero-slide-content,
.section.hero-section.background:not(.blog-single-page) .big-headline,
.section.hero-section.background:not(.blog-single-page) .white {
  color: #f2f2f0 !important;
}

.section.hero-section.background:not(.blog-single-page) .link-header-page {
  color: rgba(255, 255, 255, 0.7) !important;
}

.section.hero-section.background:not(.blog-single-page) .link-header-page:hover {
  color: rgba(255, 255, 255, 1) !important;
}

/* Active/current breadcrumb — white text on dark pill over hero image */
.section.hero-section.background:not(.blog-single-page) .link-header-page.w--current {
  color: #ffffff !important;
  background-color: rgba(15, 15, 15, 0.7) !important;
}

.section.hero-section.background:not(.blog-single-page) .breadcrumbs-block {
  color: rgba(255, 255, 255, 0.5) !important;
}

.categories-grid .color-block,
.categories-grid .w-dyn-item .color,
.collection-list-categories .color-block {
  display: none !important;
}

div.section.slider {
  background-color: #0f0905 !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Account for fixed navbar + quarry-subnav on hero sections.
   120px clears both fixed bars. Desktop only (>991px).
   Home page slider handles its own spacing. */
@media screen and (min-width: 992px) {
  .section.hero-section {
    margin-top: 110px !important;
  }
}

.blog-content-second h4,
.blog-content-second.white-text h4,
.blog-content-second h3,
.blog-content-second.white-text h3 {
  color: #ffffff !important;
}

.second-blog-image .blog-content-second h4,
.collection-list-blog-three .blog-content-second h4 {
  color: #ffffff !important;
}

.color-tags {
  display: none !important;
}

/* =====================================================
   POST THUMBNAILS — keep the subdued, moody feel
   No brightness/saturation boost — let the atmospheric
   dark SVG art breathe at its natural tone.
   ===================================================== */

/* No filter overrides — images render at natural values */

/* Ensure hero sections and slider are NOT affected */
.section.hero-section .second-blog-image,
.hero-slider-wrapper,
.section.hero-section .hero-slider-wrapper {
  filter: none !important;
}

.sidebar-block {
  background-color: rgba(0, 0, 0, 0.03) !important;
  border-radius: 12px !important;
  padding: 20px !important;
}

.section:nth-child(even) {
  background-color: rgba(0, 0, 0, 0.015) !important;
}

/* ============================================================
   26. LONG RIDES CAROUSEL
   Horizontal snap-scroll carousel for featured essays.
   Targets [data-carousel="long-rides"] on the Collection List Wrapper.
   ============================================================ */

[data-carousel="long-rides"] {
  position: relative;
  overflow: hidden;
}

[data-carousel="long-rides"] .w-dyn-items {
  display: flex !important;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  gap: 0;
  /* Hide scrollbar across browsers */
  scrollbar-width: none;          /* Firefox */
  -ms-overflow-style: none;       /* IE/Edge */
}

[data-carousel="long-rides"] .w-dyn-items::-webkit-scrollbar {
  display: none;                  /* Chrome/Safari */
}

/* --- Each carousel slide: full width, snap --- */
[data-carousel="long-rides"] .w-dyn-items > .w-dyn-item {
  flex: 0 0 100%;
  scroll-snap-align: start;
  min-width: 100%;
  border-radius: 10px !important;
  overflow: hidden !important;
}

/* Hide Webflow's built-in Collection List pagination (we use JS dots) */
[data-carousel="long-rides"] .w-pagination-wrapper,
[data-carousel="long-rides"] .w-page-count,
[data-carousel="long-rides"] ~ .w-pagination-wrapper,
[data-carousel="long-rides"] .w-slider-dot,
[data-carousel="long-rides"] .w-slider-nav {
  display: none !important;
}

/* ═══════════════════════════════════════════════════════
   Long Rides card — universal styles
   Applies on homepage carousel AND journal index page
   ═══════════════════════════════════════════════════════ */

/* Two-column layout: text left (wider) + image right */
.hero-wrapper-5 {
  display: flex !important;
  align-items: stretch !important;
  min-height: 400px !important;
  gap: 0 !important;
  padding: 0 !important;
  max-width: 100% !important;
  background: var(--bg-elevated, #1e1e1e) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
}

/* Text block — first .hero-split-5 child (has the title/body/button) */
.hero-wrapper-5 .hero-split-5:first-child {
  flex: 1 1 55% !important;
  max-width: 55% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  padding: 48px 48px 56px !important;
  background: transparent !important;
}

/* Quarry cards: no padding on text column (handled by hero-wrapper-5 padding) */
body.quarry .hero-wrapper-5 .hero-split-5:first-child {
  padding: 0px !important;
}

/* Image — second .hero-split-5 child (has the img) */
.hero-wrapper-5 .hero-split-5:last-child {
  flex: 1 1 45% !important;
  max-width: 45% !important;
  padding: 0 !important;
  overflow: hidden !important;
  min-height: 100% !important;
  background: transparent !important;
  position: relative !important;
}

/* Title — Inter for headings */
.hero-wrapper-5 .post-title {
  color: var(--text-primary, #f2f2f0) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 2.6rem !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  margin: 0 0 20px 0 !important;
  letter-spacing: -0.02em !important;
}

/* Body text — Garamond for body */
.hero-wrapper-5 p {
  color: var(--text-secondary, #a0a098) !important;
  font-family: 'EB Garamond', Georgia, serif !important;
  font-size: 18px !important;
  line-height: 1.7 !important;
  margin: 0 0 32px 0 !important;
  max-width: 480px !important;
}

/* Button — targets .button.w-button (Webflow's native button class) */
.hero-wrapper-5 .button.w-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  background: #C45A28 !important;
  color: #fff !important;
  padding: 12px 28px !important;
  border-radius: 4px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  transition: background 0.2s ease, transform 0.15s ease !important;
  align-self: flex-end !important;
  width: auto !important;
  max-width: fit-content !important;
}

.hero-wrapper-5 .button.w-button:hover {
  background: #a84a20 !important;
  transform: translateY(-1px) !important;
}

/* Image — fill right column edge to edge.
   Works whether img is direct child or inside an <a> wrapper. */
.hero-wrapper-5 .hero-split-5:last-child a,
.hero-wrapper-5 .hero-split-5:last-child .w-inline-block {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

.hero-wrapper-5 .hero-split-5:last-child img,
.hero-wrapper-5 .hero-split-5:last-child .image-2 {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 0 !important;
  display: block !important;
  order: unset !important;
  align-self: unset !important;
}

/* Mobile: stack image on top, text below */
@media (max-width: 767px) {
  .hero-wrapper-5 {
    flex-direction: column-reverse !important;
    min-height: unset !important;
  }

  .hero-wrapper-5 .hero-split-5:first-child {
    padding: 28px 24px !important;
    max-width: 100% !important;
    flex: 1 1 auto !important;
  }

  .hero-wrapper-5 .hero-split-5:last-child {
    max-height: 240px !important;
    max-width: 100% !important;
    flex: 1 1 auto !important;
  }

  .hero-wrapper-5 .post-title {
    font-size: 1.8rem !important;
  }

  .hero-wrapper-5 p {
    font-size: 16px !important;
  }
}

/* Carousel dot indicators (JS-injected only — no ::after spacer) */
/* Hide duplicates if Webflow Ix2 clones them */
[data-carousel="long-rides"] .carousel-dots ~ .carousel-dots {
  display: none !important;
}

[data-carousel="long-rides"] .carousel-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  padding: 20px 0 4px;
}

[data-carousel="long-rides"] .carousel-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #777777;
  border: none;
  cursor: pointer;
  padding: 0;
  transition: background 0.3s ease, transform 0.3s ease;
}

[data-carousel="long-rides"] .carousel-dot.active {
  background: #C45A28;
  transform: scale(1.25);
}

/* Carousel nav arrows (injected by JS) */
[data-carousel="long-rides"] .carousel-nav {
  position: absolute;
  bottom: 24px;
  top: auto;
  background: rgba(15, 15, 15, 0.6);
  border: 1px solid #252525;
  color: #f2f2f0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 18px;
  transition: background 0.2s ease;
  z-index: 5;
}

[data-carousel="long-rides"] .carousel-nav:hover {
  background: rgba(196, 90, 40, 0.8);
}

[data-carousel="long-rides"] .carousel-nav.prev {
  left: 12px;
}

[data-carousel="long-rides"] .carousel-nav.next {
  right: 12px;
}

/* Mobile: hide arrows, rely on swipe */
@media (max-width: 767px) {
  [data-carousel="long-rides"] .carousel-nav {
    display: none;
  }
}


/* ============================================================
   26b. LONG RIDES — Rich Text Essay Images
   Float left, float right, centered feature with captions.
   Magazine-style inline images within Post Body rich text.
   ============================================================ */

/* Base figure styling in rich text */
.w-richtext figure {
  margin: 32px 0 !important;
  padding: 0 !important;
}

.w-richtext figure img {
  border-radius: 6px !important;
  width: 100% !important;
  height: auto !important;
}

/* Captions */
.w-richtext figcaption {
  font-family: Inter, -apple-system, system-ui, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  color: var(--text-muted, #8a8a82) !important;
  margin-top: 8px !important;
  padding: 0 4px !important;
  font-style: italic !important;
}

/* ---- Float Left ---- */
.w-richtext figure.w-richtext-align-floatleft {
  float: left !important;
  width: 45% !important;
  margin: 8px 28px 16px 0 !important;
}

.w-richtext figure.w-richtext-align-floatleft figcaption {
  text-align: left !important;
}

/* ---- Float Right ---- */
.w-richtext figure.w-richtext-align-floatright {
  float: right !important;
  width: 45% !important;
  margin: 8px 0 16px 28px !important;
}

.w-richtext figure.w-richtext-align-floatright figcaption {
  text-align: right !important;
}

/* ---- Center (feature image with caption) ---- */
.w-richtext figure.w-richtext-align-center {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  margin: 48px 0 !important;
}

.w-richtext figure.w-richtext-align-center img {
  max-width: 90% !important;
  border-radius: 8px !important;
}

.w-richtext figure.w-richtext-align-center figcaption {
  text-align: center !important;
  max-width: 70% !important;
  margin-top: 12px !important;
}

/* ---- Full Width (edge-to-edge) ---- */
.w-richtext figure.w-richtext-align-fullwidth {
  margin: 48px -32px !important;
  width: calc(100% + 64px) !important;
}

.w-richtext figure.w-richtext-align-fullwidth img {
  border-radius: 0 !important;
  width: 100% !important;
}

.w-richtext figure.w-richtext-align-fullwidth figcaption {
  text-align: center !important;
  padding: 12px 32px 0 !important;
}

/* ---- Dark mode ---- */
[data-theme="dark"] .w-richtext figcaption {
  color: #6a6a62 !important;
}

@media (prefers-color-scheme: dark) {
  .w-richtext figcaption {
    color: #6a6a62 !important;
  }
}

/* ---- Mobile: floats collapse to full width ---- */
@media (max-width: 767px) {
  .w-richtext figure.w-richtext-align-floatleft,
  .w-richtext figure.w-richtext-align-floatright {
    float: none !important;
    width: 100% !important;
    margin: 24px 0 !important;
  }

  .w-richtext figure.w-richtext-align-center img {
    max-width: 100% !important;
  }

  .w-richtext figure.w-richtext-align-fullwidth {
    margin: 32px -16px !important;
    width: calc(100% + 32px) !important;
  }
}


/* ============================================================
   27. JOURNAL SIDEBAR — Text-first microblog cards
   No image, no title. Just the missive and a timestamp.
   Theme-aware: light mode default, dark mode via data-theme.
   ============================================================ */

.sidebar-block .latest-block {
  flex-direction: column !important;
  width: 100% !important;
  padding: 8px 0 28px 8px !important;
  border-bottom: 1px solid var(--border, #252525) !important;
  border-left: 3px solid transparent !important;
  background: transparent !important;
  position: relative !important;
  cursor: pointer !important;
  transition: border-color 0.2s ease, padding-left 0.2s ease !important;
}

.sidebar-block .latest-block:last-child {
  border-bottom: none !important;
}

/* Hover — orange left accent + text shift */
.sidebar-block .latest-block:hover {
  border-left-color: #C45A28 !important;
  padding-left: 12px !important;
  background: transparent !important;
}

.sidebar-block .latest-block:hover p {
  color: var(--text-primary, #1a1a18) !important;
}

.sidebar-block .latest-block:hover .label-tag,
.sidebar-block .latest-block:hover .text-block {
  background-color: #C45A28 !important;
  color: #ffffff !important;
  border-color: #C45A28 !important;
}

.sidebar-block .latest-content,
.sidebar-block .latest-block *:not(.label-tag):not(.text-block) {
  background: transparent !important;
}

.sidebar-block .latest-content {
  width: 100% !important;
  padding: 0 !important;
}

/* Post summary text — the missive */
.sidebar-block .latest-content p,
.sidebar-block .latest-block p {
  font-family: 'EB Garamond', Georgia, serif !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
  color: #d4d4d4 !important;
  margin: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 4 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* Date/time stamp — muted warm pill (distinct from main orange) */
.sidebar-block .latest-block .text-block,
.sidebar-block .latest-content .text-block,
.sidebar-block .latest-block .label-tag,
.sidebar-block .latest-content .label-tag {
  display: inline-block !important;
  font-family: Inter, -apple-system, system-ui, sans-serif !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #c8c0b8 !important;
  background-color: #2a2520 !important;
  padding: 4px 10px !important;
  border-radius: 3px !important;
  margin-bottom: 4px !important;
  margin-top: 0 !important;
  border: 1px solid #3a332c !important;
}

/* Kill underline on Journal card links */
.sidebar-block .latest-content a,
.sidebar-block .latest-content .post-link {
  text-decoration: none !important;
  color: inherit !important;
}

/* Clickable card via stretched link */
.sidebar-block .latest-content .post-link::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
}

/* ---- Dark mode ---- */
[data-theme="dark"] .sidebar-block .latest-block {
  border-bottom-color: #252525 !important;
}

[data-theme="dark"] .sidebar-block .latest-block:hover {
  background: transparent !important;
}

[data-theme="dark"] .sidebar-block .latest-block:hover p {
  color: #ffffff !important;
}

[data-theme="dark"] .sidebar-block .latest-content p {
  color: #d4d4d4 !important;
}

[data-theme="dark"] .sidebar-block .latest-content .text-block {
  color: #777777 !important;
}

@media (prefers-color-scheme: dark) {
  .sidebar-block .latest-block {
    border-bottom-color: #252525 !important;
  }
  .sidebar-block .latest-block:hover {
    background: transparent !important;
  }
  .sidebar-block .latest-block:hover p {
    color: #ffffff !important;
  }
  .sidebar-block .latest-content p {
    color: #d4d4d4 !important;
  }
  .sidebar-block .latest-content .text-block {
    color: #777777 !important;
  }
}

/* --- "Read more..." link (injected by JS) --- */
.sidebar-block .read-more-link {
  display: inline-block !important;
  font-family: Inter, -apple-system, system-ui, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: var(--accent, #C45A28) !important;
  text-decoration: none !important;
  margin-top: 10px !important;
  padding: 4px 0 !important;
  border-bottom: 1px solid transparent !important;
  transition: border-color 0.2s ease, color 0.2s ease !important;
  position: relative !important;
  z-index: 2 !important;
}

.sidebar-block .read-more-link:hover {
  border-bottom-color: var(--accent, #C45A28) !important;
  color: #e06830 !important;
}

/* --- Sidebar w-dyn-item: hover state for whole entry --- */
.sidebar-block .w-dyn-item {
  padding: 12px 0 16px 8px !important;
  border-left: 3px solid transparent !important;
  transition: border-color 0.2s ease, padding-left 0.2s ease !important;
  cursor: pointer !important;
}

.sidebar-block .w-dyn-item:hover {
  border-left-color: var(--accent, #C45A28) !important;
  padding-left: 14px !important;
}

.sidebar-block .w-dyn-item:hover .read-more-link {
  border-bottom-color: var(--accent, #C45A28) !important;
}

/* Quarry: brown hover indicator on sidebar items (veins + marks) */
body.quarry .sidebar-block .w-dyn-item:hover {
  border-left-color: var(--quarry-accent, #8B6F47) !important;
}

body.quarry .sidebar-block .w-dyn-item:hover .read-more-link {
  border-bottom-color: var(--quarry-accent, #8B6F47) !important;
}

[data-theme="light"] body.quarry .sidebar-block .w-dyn-item:hover {
  border-left-color: var(--quarry-accent, #7A5C3A) !important;
}

[data-theme="light"] body.quarry .sidebar-block .w-dyn-item:hover .read-more-link {
  border-bottom-color: var(--quarry-accent, #7A5C3A) !important;
}


/* =====================================================
   ENTRY PAGE (blog-single-page) FIXES
   ===================================================== */

/* --- 0. Kill the breadcrumb trough/well ---
     The .overlay-color creates a heavy dark bar behind the breadcrumb.
     Strip it so the breadcrumb floats as quiet inline text. */
.section.hero-section.background.blog-single-page .overlay-color {
  display: none !important;
}

/* Let the breadcrumb text sit cleanly without the bar */
.section.hero-section.background.blog-single-page .breadcrumbs-block {
  background: none !important;
  padding: 12px 0 !important;
}

/* --- 1. Content padding at narrow desktop (991–1280px) ---
     The .container is max-width:1200px with no horizontal padding,
     so content is flush against the viewport edge below ~1250px. */
@media screen and (max-width: 1280px) and (min-width: 992px) {
  .section.hero-section.background.blog-single-page ~ .section .container {
    max-width: 100% !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
    box-sizing: border-box !important;
  }
  .blog-and-sidebar.full {
    max-width: 100% !important;
    width: auto !important;
  }
}

/* --- 2. Breadcrumb: rename removed — set labels in Designer instead ---

/* --- 3. Breadcrumb contrast boost on entry pages ---
     All breadcrumb links need to be more visible against the dark hero. */
.section.hero-section.background.blog-single-page .link-header-page {
  color: rgba(255, 255, 255, 0.75) !important;
}
.section.hero-section.background.blog-single-page .link-header-page:hover {
  color: #ffffff !important;
}
.section.hero-section.background.blog-single-page .link-header-page.w--current {
  color: #ffffff !important;
  background-color: rgba(15, 15, 15, 0.7) !important;
}
.section.hero-section.background.blog-single-page .breadcrumbs-block {
  color: rgba(255, 255, 255, 0.55) !important;
}

/* --- 4. Sidebar: rename removed — set labels in Designer instead ---


/* =====================================================
   ZONE CARD GLYPHS — Custom cairn-inspired SVGs
   Replace generic black-square icons in category cards
   with per-zone line art served from Cloudflare Worker.
   Structure: .w-dyn-item > a.link-block[href] > .cagerie-wrapper > .div-block > img
   ===================================================== */

/* Hide the generic template icon in ZONE cards only
   (Pulse cards use actual <img> bound to CMS Icon field — leave those visible) */
a[href*="/zone/"] .cagerie-wrapper .div-block img {
  display: none !important;
}

/* Style the .div-block as the icon container */
.cagerie-wrapper .div-block {
  width: 32px !important;
  height: 32px !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  flex-shrink: 0 !important;
}

/* --- Per-zone SVG injection via parent link href --- */
a[href*="/zone/endurance-mindset"] .cagerie-wrapper .div-block {
  background-image: url("https://static.endurist.workers.dev/images/zones/endurance-mindset.svg") !important;
}
a[href*="/zone/fatherhood"] .cagerie-wrapper .div-block {
  background-image: url("https://static.endurist.workers.dev/images/zones/fatherhood.svg") !important;
}
a[href*="/zone/identity"] .cagerie-wrapper .div-block {
  background-image: url("https://static.endurist.workers.dev/images/zones/identity.svg") !important;
}
a[href*="/zone/grit-resilience"] .cagerie-wrapper .div-block {
  background-image: url("https://static.endurist.workers.dev/images/zones/grit-resilience.svg") !important;
}
a[href*="/zone/reflection"] .cagerie-wrapper .div-block {
  background-image: url("https://static.endurist.workers.dev/images/zones/reflection.svg") !important;
}


/* ============================================================
   THE QUARRY — Claudius's Content Section
   Parallel to Journal/Long Rides but with quarry/masonry identity.
   Three card types: Excavation (deep), Cut (measured), Chip (fragment).
   Quarry page ID: TBD (replace 69a74fb68581da87d765a226 after page creation)
   ============================================================ */


/* --- Quarry: Import monospace notation font --- */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,300;0,400;0,500;0,600;1,400&display=swap');

/* --- Quarry: Warm stone palette ---
   The quarry shifts from the site's cool dark (#0F0F0F)
   to warm stone dark (#12110F). Same family, different room.
   Text shifts from pure white to parchment (#E8E2DA).
   The monospace (IBM Plex Mono) is the notation layer —
   type labels, dates, metadata, sidebar nav. The mason's
   documentation system, not the art itself. */

/* All quarry pages: body.quarry set in Webflow Designer on the Body element.
   Sub-page classes (.quarryhome, .excavations, .cuts, .chips) also set per page in Designer.
   :has() selector provides belt-and-suspenders detection. */
body.quarry,
body.quarry {
  /* Quarry palette variables */
  --quarry-bg: #12110F;
  --quarry-bg-elevated: #1E1C19;
  --quarry-bg-card: #232019;
  --quarry-text: #E8E2DA;
  --quarry-text-secondary: #B5AA9A;
  --quarry-text-muted: #7A6F60;
  --quarry-border: rgba(180, 160, 130, 0.08);
  --quarry-border-hover: rgba(139, 111, 71, 0.25);
  --quarry-accent: #8B6F47;
  --quarry-accent-dim: rgba(139, 111, 71, 0.5);
  --quarry-dust: rgba(180, 160, 130, 0.04);
  --quarry-mono: 'IBM Plex Mono', 'Courier New', monospace;

  /* Override SITE-WIDE variables for dark mode (default quarry state).
     Any element using var(--bg-primary) etc. will get quarry values
     because body is closer in the cascade than :root[data-theme]. */
  --bg-primary: var(--quarry-bg);
  --bg-secondary: var(--quarry-bg-elevated);
  --bg-elevated: var(--quarry-bg-card);
  --text-primary: var(--quarry-text);
  --text-secondary: var(--quarry-text-secondary);
  --text-muted: var(--quarry-text-muted);
  --border: var(--quarry-border);
  --black-2: var(--quarry-bg);
  --silver: var(--quarry-text-secondary);

  background-color: var(--quarry-bg) !important;
  color: var(--quarry-text) !important;
}

body.quarry .section,
body.quarry .section {
  background-color: var(--quarry-bg) !important;
  color: var(--quarry-text) !important;
}

body.quarry .container,
body.quarry .w-container,
body.quarry .w-dyn-item,
body.quarry .collection-list-wrapper,
body.quarry [class*="wrapper"]:not(.w-slider-mask):not(.w-nav-overlay),
body.quarry .container,
body.quarry .w-container,
body.quarry .w-dyn-item,
body.quarry .collection-list-wrapper,
body.quarry [class*="wrapper"]:not(.w-slider-mask):not(.w-nav-overlay) {
  background-color: transparent !important;
  color: var(--quarry-text) !important;
}

body.quarry h1,
body.quarry h2,
body.quarry h3,
body.quarry h4,
body.quarry h1,
body.quarry h2,
body.quarry h3,
body.quarry h4 {
  color: var(--quarry-text) !important;
}

body.quarry p,
body.quarry p {
  color: var(--quarry-text-secondary) !important;
}


/* --- Quarry hero: SVG quarry face with gradient overlay ---
   The mountainside quarry, layered under warm gradients.
   SVG sits at the bottom, gradients fade the text area clear above.
   body.quarry prefix boosts specificity to beat Webflow inline styles. */
body.quarry .section.hero-section.background {
  /* Kill any Webflow-set inline or CMS background image */
  background-image:
    linear-gradient(
      180deg,
      rgba(18, 17, 15, 0.85) 0%,
      rgba(18, 17, 15, 0.5) 40%,
      rgba(18, 17, 15, 0.15) 75%,
      transparent 100%
    ),
    repeating-linear-gradient(
      -45deg,
      transparent,
      transparent 40px,
      rgba(180, 140, 100, 0.02) 40px,
      rgba(180, 140, 100, 0.02) 41px
    ),
    url("https://static.endurist.workers.dev/svg/quarry-hero.svg") !important;
  background-size: 100% auto, auto, cover !important;
  background-position: center top, 0 0, center bottom !important;
  background-repeat: no-repeat, repeat, no-repeat !important;
  background-color: #12110F !important;
}

/* Quarry hero label: ALL label-tags in hero get bright colours (hero bg is always dark) */
body.quarry .section.hero-section.background .label-tag,
body.quarry .section.hero-section.background .label-tag *,
body.quarry .section.hero-section.background .label-tag .category-text {
  background: rgba(139, 111, 71, 0.35) !important;
  color: #E8E2DA !important;
  border: 1px solid rgba(139, 111, 71, 0.4) !important;
  font-family: var(--font-ui, Inter, -apple-system, sans-serif) !important;
  font-size: 0.85em !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  padding: 6px 16px !important;
  border-radius: 3px !important;
}

/* Ensure child elements inside label don't have their own bg/border/padding */
body.quarry .section.hero-section.background .label-tag *,
body.quarry .section.hero-section.background .label-tag .category-text {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* Quarry hero title — always white because hero bg is always dark */
body.quarry .section.hero-section.background h1:not(.logo),
[data-theme="light"] body.quarry .section.hero-section.background h1:not(.logo),
[data-theme="dark"] body.quarry .section.hero-section.background h1:not(.logo) {
  font-family: var(--font-ui) !important;
  font-size: 3rem !important;
  font-weight: 800 !important;
  color: #FFFFFF !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 0.75rem !important;
}

/* Quarry hero intro text — always warm parchment (hero bg is always dark).
   Excludes .quarry-date and .quarry-author which have their own styling. */
body.quarry .section.hero-section.background p:not(.quarry-date):not(.quarry-author),
body.quarry .section.hero-section.background .quarry-intro,
[data-theme="light"] body.quarry .section.hero-section.background p:not(.quarry-date):not(.quarry-author),
[data-theme="light"] body.quarry .section.hero-section.background .quarry-intro {
  font-family: var(--font-body) !important;
  font-size: 0.95rem !important;
  line-height: 1.65 !important;
  color: rgba(232, 226, 218, 0.72) !important;
  max-width: 640px !important;
}

/* Quarry authorship line — monospace notation, light orange */
.quarry-author {
  font-family: var(--quarry-mono, 'IBM Plex Mono', monospace) !important;
  font-size: 0.75rem !important;
  font-weight: 400 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: rgba(196, 90, 40, 0.7) !important;
  margin-top: 1rem !important;
}


/* =============================================
   QUARRY FEED — Card System
   Three types, three densities.
   ============================================= */

/* --- Quarry content section: warm stone immersion --- */
body.quarry .section.hero-section.background ~ .section {
  background-color: var(--quarry-bg, #12110F) !important;
  padding-top: 3rem !important;
  padding-bottom: 4rem !important;
}

body.quarry .section.hero-section.background ~ .section .container {
  background-color: transparent !important;
  color: var(--quarry-text, #E8E2DA) !important;
}

/* --- Quarry entry: base card ---
   Different from Journal's left-border cards.
   Quarry uses top accent marks (chisel hits). */
.quarry-entry {
  background: linear-gradient(135deg,
    rgba(60, 45, 35, 0.12) 0%,
    var(--quarry-bg-card, #232019) 35%,
    var(--quarry-bg-elevated, #1E1C19) 100%) !important;
  border: 1px solid var(--quarry-border, rgba(180, 160, 130, 0.08)) !important;
  border-radius: 6px !important;
  padding: 2rem 2.25rem !important;
  margin-bottom: 1.75rem !important;
  transition: border-color 0.3s ease, background 0.3s ease, transform 0.2s ease !important;
  position: relative !important;
}

.quarry-entry:hover {
  border-color: var(--quarry-border-hover, rgba(139, 111, 71, 0.25)) !important;
  background: linear-gradient(135deg,
    rgba(70, 50, 35, 0.18) 0%,
    rgba(40, 36, 28, 0.88) 35%,
    rgba(35, 32, 25, 0.95) 100%) !important;
  transform: translateY(-1px) !important;
}


/* --- EXCAVATION cards: deep, full treatment ---
   Top border accent — a vein of ore exposed.
   Larger padding, hero image if present. */
.quarry-entry[data-quarry-type="excavation"] {
  border-top: 3px solid var(--quarry-accent, #8B6F47) !important;
  padding: 2.5rem !important;
}

.quarry-entry[data-quarry-type="excavation"] .quarry-type-label {
  color: var(--quarry-accent, #8B6F47) !important;
}

.quarry-entry[data-quarry-type="excavation"] h2,
.quarry-entry[data-quarry-type="excavation"] h3,
.quarry-entry[data-quarry-type="excavation"] .post-title {
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

.quarry-entry[data-quarry-type="excavation"] .quarry-excerpt {
  font-family: var(--font-body) !important;
  font-size: 1.05rem !important;
  line-height: 1.65 !important;
  color: rgba(232, 226, 218, 0.75) !important;
  margin-top: 0.75rem !important;
}


/* --- CUT cards: deliberate, measured ---
   Left accent line (thinner than Journal's).
   Medium density. */
.quarry-entry[data-quarry-type="cut"] {
  border-left: 2px solid rgba(196, 90, 40, 0.35) !important;
  padding: 1.75rem 2rem !important;
}

.quarry-entry[data-quarry-type="cut"] .quarry-type-label {
  color: rgba(139, 111, 71, 0.65) !important;
}

.quarry-entry[data-quarry-type="cut"] h2,
.quarry-entry[data-quarry-type="cut"] h3,
.quarry-entry[data-quarry-type="cut"] .post-title {
  font-size: 1.35rem !important;
  font-weight: 600 !important;
}


/* --- CHIP cards: raw, compact ---
   Minimal. No image. Tighter padding. Inline feel.
   Almost a whisper against the dark. */
.quarry-entry[data-quarry-type="chip"] {
  background: rgba(30, 28, 22, 0.5) !important;
  border: 1px solid var(--quarry-dust, rgba(180, 160, 130, 0.04)) !important;
  border-left: 1px solid rgba(139, 111, 71, 0.15) !important;
  padding: 1.25rem 1.5rem !important;
  margin-bottom: 1rem !important;
}

.quarry-entry[data-quarry-type="chip"]:hover {
  background: rgba(35, 32, 25, 0.6) !important;
  border-color: var(--quarry-border, rgba(180, 160, 130, 0.08)) !important;
}

.quarry-entry[data-quarry-type="chip"] h2,
.quarry-entry[data-quarry-type="chip"] h3,
.quarry-entry[data-quarry-type="chip"] .post-title {
  font-size: 1.1rem !important;
  font-weight: 500 !important;
  color: rgba(232, 226, 218, 0.85) !important;
}

.quarry-entry[data-quarry-type="chip"] .quarry-type-label {
  color: rgba(139, 111, 71, 0.45) !important;
  font-size: 0.65rem !important;
}

.quarry-entry[data-quarry-type="chip"] .quarry-excerpt {
  font-size: 0.9rem !important;
  line-height: 1.55 !important;
  color: rgba(232, 226, 218, 0.6) !important;
}

/* Chip image: hidden by default (conditional visibility in Webflow handles this,
   but belt-and-suspenders) */
.quarry-entry[data-quarry-type="chip"] .quarry-image {
  display: none !important;
}


/* --- Quarry type label (all types) — monospace notation --- */
.quarry-type-label {
  display: inline-block !important;
  font-family: var(--quarry-mono, 'IBM Plex Mono', monospace) !important;
  font-size: 0.65rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  margin-bottom: 0.65rem !important;
}


/* --- Quarry entry headings — warm parchment --- */
.quarry-entry h2,
.quarry-entry h3,
.quarry-entry .post-title {
  color: var(--quarry-text, #E8E2DA) !important;
  font-family: var(--font-ui) !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  margin-bottom: 0.5rem !important;
  letter-spacing: -0.01em !important;
}

/* --- Quarry entry text — warm secondary --- */
.quarry-entry p,
.quarry-entry .quarry-excerpt {
  color: rgba(232, 226, 218, 0.72) !important;
  font-family: var(--font-body) !important;
  font-size: 1rem !important;
  line-height: 1.65 !important;
}

/* --- Quarry date — ONLY override font to mono, inherit everything else from label-tag --- */
body.quarry .quarry-date,
body.quarry-entry .quarry-date,
body.quarry .section.hero-section.background .quarry-date,
.quarry-date {
  font-family: 'IBM Plex Mono', var(--quarry-mono, monospace) !important;
  font-weight: 400 !important;
  text-transform: none !important;
  letter-spacing: 0.06em !important;
}

/* --- Quarry sign-off: — C --- */
.quarry-entry .quarry-signoff,
.quarry-signoff {
  font-family: 'EB Garamond', Georgia, serif !important;
  font-style: italic !important;
  font-size: 0.9rem !important;
  color: var(--quarry-accent-dim, rgba(139, 111, 71, 0.5)) !important;
  margin-top: 1rem !important;
}

/* --- Quarry entry image (Excavations + Cuts) --- */
.quarry-entry .quarry-image img {
  border-radius: 4px !important;
  width: 100% !important;
  margin-bottom: 1.25rem !important;
  object-fit: cover !important;
}


/* --- Mobile responsive --- */
@media (max-width: 767px) {
  body.quarry .section.hero-section.background h1 {
    font-size: 2.25rem !important;
  }

  .quarry-entry {
    padding: 1.5rem 1.25rem !important;
    margin-bottom: 1.25rem !important;
  }

  .quarry-entry[data-quarry-type="excavation"] {
    padding: 1.75rem 1.25rem !important;
  }

  .quarry-entry[data-quarry-type="chip"] {
    padding: 1rem 1.25rem !important;
  }

  body.quarry .section.hero-section.background ~ .section .container {
    color: var(--quarry-text, #E8E2DA) !important;
  }
}


/* --- Quarry entries: LIGHT MODE --- */
[data-theme="light"] .quarry-entry {
  background: linear-gradient(135deg,
    rgba(196, 90, 40, 0.03) 0%,
    rgba(250, 247, 242, 0.85) 35%,
    rgba(255, 252, 248, 0.92) 100%) !important;
  border: 1px solid rgba(196, 90, 40, 0.1) !important;
}

[data-theme="light"] .quarry-entry:hover {
  background: linear-gradient(135deg,
    rgba(196, 90, 40, 0.06) 0%,
    rgba(250, 247, 242, 0.92) 35%,
    rgba(255, 252, 248, 0.97) 100%) !important;
  border-color: rgba(196, 90, 40, 0.2) !important;
}

[data-theme="light"] .quarry-entry[data-quarry-type="excavation"] {
  border-top: 3px solid var(--quarry-accent, #8B6F47) !important;
}

[data-theme="light"] .quarry-entry[data-quarry-type="cut"] {
  border-left: 2px solid rgba(196, 90, 40, 0.3) !important;
}

[data-theme="light"] .quarry-entry[data-quarry-type="chip"] {
  background: rgba(245, 240, 232, 0.5) !important;
  border: 1px solid rgba(0, 0, 0, 0.04) !important;
}

[data-theme="light"] .quarry-entry h2,
[data-theme="light"] .quarry-entry h3,
[data-theme="light"] .quarry-entry .post-title {
  color: var(--text-primary, #1a1a1a) !important;
}

[data-theme="light"] .quarry-entry p,
[data-theme="light"] .quarry-entry .quarry-excerpt {
  color: var(--text-secondary, #444) !important;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) .quarry-entry {
    background: linear-gradient(135deg,
      rgba(196, 90, 40, 0.03) 0%,
      rgba(250, 247, 242, 0.85) 35%,
      rgba(255, 252, 248, 0.92) 100%) !important;
    border: 1px solid rgba(196, 90, 40, 0.1) !important;
  }

  :root:not([data-theme="dark"]) .quarry-entry:hover {
    border-color: rgba(196, 90, 40, 0.2) !important;
  }

  :root:not([data-theme="dark"]) .quarry-entry h2,
  :root:not([data-theme="dark"]) .quarry-entry h3 {
    color: var(--text-primary, #1a1a1a) !important;
  }

  :root:not([data-theme="dark"]) .quarry-entry p {
    color: var(--text-secondary, #444) !important;
  }
}

/* ========================================
   QUARRY — LANDING PAGE ENTRY BLOCKS
   Three treatments for premade layouts:
   .quarry-seek  (Excavations) — Hero Split 5, full weight
   .quarry-shape (Cuts)        — Hero Split 5, tighter
   .quarry-strike (Chips)      — Hero Without Image, compact
   ======================================== */

/* ---- SHARED: All quarry entry sections ---- */
.quarry-seek,
.quarry-shape,
.quarry-strike {
  background: linear-gradient(135deg,
    rgba(60, 45, 35, 0.12) 0%,
    var(--quarry-bg-card, #232019) 35%,
    var(--quarry-bg-elevated, #1E1C19) 100%) !important;
  border: 1px solid var(--quarry-border, rgba(180, 160, 130, 0.08)) !important;
  border-radius: 6px !important;
  margin-bottom: 1.75rem !important;
  transition: border-color 0.3s ease, background 0.3s ease !important;
  overflow: hidden !important;
}

.quarry-seek:hover,
.quarry-shape:hover,
.quarry-strike:hover {
  border-color: var(--quarry-border-hover, rgba(139, 111, 71, 0.25)) !important;
}

/* Shared heading styles */
.quarry-seek h3,
.quarry-shape h3,
.quarry-strike h3,
.quarry-seek .post-title,
.quarry-shape .post-title {
  color: var(--quarry-text, #E8E2DA) !important;
  font-family: var(--font-ui, Inter, -apple-system, system-ui, sans-serif) !important;
  letter-spacing: -0.01em !important;
  margin-bottom: 0.5rem !important;
}

/* Shared paragraph/excerpt styles */
.quarry-seek p,
.quarry-shape p,
.quarry-strike p,
.quarry-strike .margin-bottom-24px {
  color: var(--quarry-text-secondary, #B5AA9A) !important;
  font-family: var(--font-body, 'EB Garamond', Georgia, serif) !important;
  line-height: 1.65 !important;
}

/* Shared button: brown fill, white text. Hover inverts to white fill.
   Specificity boosted with .hero-wrapper-5 to beat general hero button rule. */
.quarry-seek .hero-wrapper-5 .button.w-button,
.quarry-shape .hero-wrapper-5 .button.w-button,
.quarry-seek .button,
.quarry-shape .button,
.quarry-strike .button-primary-8 {
  background-color: var(--quarry-accent, #8B6F47) !important;
  background: var(--quarry-accent, #8B6F47) !important;
  color: #ffffff !important;
  border: 1px solid var(--quarry-accent, #8B6F47) !important;
  border-radius: 4px !important;
  font-family: var(--font-ui, Inter, -apple-system, system-ui, sans-serif) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 8px 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  transition: background-color 200ms ease, color 200ms ease, border-color 200ms ease !important;
}

.quarry-seek .hero-wrapper-5 .button.w-button:hover,
.quarry-shape .hero-wrapper-5 .button.w-button:hover,
.quarry-seek .button:hover,
.quarry-shape .button:hover,
.quarry-strike .button-primary-8:hover {
  background-color: #ffffff !important;
  background: #ffffff !important;
  color: var(--quarry-accent, #8B6F47) !important;
  border-color: var(--quarry-accent, #8B6F47) !important;
}

/* ============================================================
   QUARRY CARD GLYPHS — shared rules, then per-card overrides
   ============================================================ */

/* Force premade inner wrappers transparent (Webflow bakes white bg) */
.quarry-seek section,
.quarry-seek .container,
.quarry-seek .hero-wrapper-5,
.quarry-shape section,
.quarry-shape .container,
.quarry-shape .hero-wrapper-5 {
  background-color: transparent !important;
  background: transparent !important;
}

/* --- Hide the <img> element — glyph comes from BG image on the column --- */
.quarry-seek .image-2,
.quarry-shape .image-2,
.quarry-strike .image-2 {
  display: none !important;
}

/* --- Shared glyph column — BG image approach --- */
.quarry-seek .hero-split-5:last-child,
.quarry-shape .hero-split-5:last-child {
  display: block !important;
  overflow: hidden !important;
  align-self: stretch !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  opacity: 0.7 !important;
  transition: opacity 0.3s ease !important;
}

.quarry-seek:hover .hero-split-5:last-child,
.quarry-shape:hover .hero-split-5:last-child {
  opacity: 1 !important;
}

/* --- SEEK: Excavations — large card, big glyph --- */
.quarry-seek {
  border-top: 3px solid var(--quarry-accent, #8B6F47) !important;
  padding: 0 !important;
}

.quarry-seek .hero-wrapper-5 {
  padding: 2.5rem !important;
  gap: 2.5rem !important;
  align-items: center !important;
}

.quarry-seek .hero-split-5:last-child {
  flex: 0 0 30% !important;
  max-width: 30% !important;
}

.quarry-seek h3,
.quarry-seek .post-title {
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

.quarry-seek p {
  font-size: 1.05rem !important;
}

/* --- SHAPE: Cuts — compact card, small glyph --- */
.quarry-shape {
  border-top: none !important;
  border-left: 2px solid rgba(139, 111, 71, 0.35) !important;
  padding: 0 !important;
}

.quarry-shape .hero-wrapper-5 {
  padding: 0.375rem 1.5rem !important;
  gap: 1.25rem !important;
  align-items: center !important;
}

.quarry-shape .hero-split-5:last-child {
  flex: 0 0 25% !important;
  max-width: 25% !important;
  min-width: 180px !important;
}

.quarry-shape .hero-split-5:first-child {
  flex: 1 1 0% !important;
}

.quarry-shape h3,
.quarry-shape .post-title {
  font-size: 1.15rem !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  margin-bottom: 0.35rem !important;
}

.quarry-shape p {
  font-size: 0.88rem !important;
  line-height: 1.55 !important;
  margin-bottom: 0.75rem !important;
}

.quarry-shape .button.w-button {
  font-size: 11px !important;
  padding: 6px 16px !important;
}

/* ==========================================================
   QUARRY CARD RESPONSIVE — Tablet & Mobile
   Hide glyphs, let text breathe full-width
   ========================================================== */

@media (max-width: 991px) {
  /* Hide glyph column entirely */
  .quarry-seek .hero-split-5:last-child,
  .quarry-shape .hero-split-5:last-child {
    display: none !important;
  }

  /* Text column: full width */
  body.quarry .quarry-seek .hero-wrapper-5 .hero-split-5:first-child,
  body.quarry .quarry-shape .hero-wrapper-5 .hero-split-5:first-child {
    flex: 1 1 auto !important;
    max-width: 100% !important;
  }

  /* Seek wrapper: tighter padding */
  .quarry-seek .hero-wrapper-5 {
    padding: 1.5rem !important;
  }

  /* Shape wrapper: tighter padding */
  .quarry-shape .hero-wrapper-5 {
    padding: 0.75rem 1.25rem !important;
  }

  /* Seek title smaller */
  .quarry-seek h3,
  .quarry-seek .post-title {
    font-size: 1.4rem !important;
  }
}

@media (max-width: 767px) {
  .quarry-seek .hero-wrapper-5 {
    padding: 1.25rem !important;
  }

  .quarry-shape .hero-wrapper-5 {
    padding: 0.5rem 1rem !important;
  }

  .quarry-seek h3,
  .quarry-seek .post-title {
    font-size: 1.2rem !important;
  }

  .quarry-shape h3,
  .quarry-shape .post-title {
    font-size: 1rem !important;
  }
}

/* ---- STRIKE: Chips — compact, no image ---- */
.quarry-strike {
  border-top: none !important;
  border-left: 1px solid rgba(139, 111, 71, 0.15) !important;
  background: rgba(30, 28, 22, 0.5) !important;
  border-radius: 4px !important;
  margin-bottom: 1rem !important;
}

.quarry-strike:hover {
  background: rgba(35, 32, 25, 0.65) !important;
}

/* Force all premade inner elements transparent —
   the Webflow "Hero Without Image" has baked-in white backgrounds */
.quarry-strike .hero-without-image,
.quarry-strike section {
  background-color: transparent !important;
  background: transparent !important;
  max-width: 100% !important;
  padding: 0 !important;
}

.quarry-strike .hero-without-image .container-11,
.quarry-strike .container-11 {
  background-color: transparent !important;
  background: transparent !important;
  max-width: 100% !important;
  padding: 0 2rem !important;
}

.quarry-strike .hero-wrapper-two {
  padding: 2.5rem 2rem !important;
  text-align: left !important;
  background: transparent !important;
  max-width: 100% !important;
}

.quarry-strike h3,
.quarry-strike h1 {
  font-size: 1.1rem !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  color: rgba(232, 226, 218, 0.85) !important;
  margin-bottom: 0.25rem !important;
}

.quarry-strike p,
.quarry-strike .margin-bottom-24px {
  font-size: 0.9rem !important;
  line-height: 1.55 !important;
  color: rgba(232, 226, 218, 0.6) !important;
  margin-bottom: 0.5rem !important;
}

/* Chips: subtle button, almost a text link */
.quarry-strike .button-primary-8 {
  padding: 6px 14px !important;
  font-size: 11px !important;
  border-color: rgba(139, 111, 71, 0.2) !important;
}


/* ---- LIGHT MODE overrides for landing blocks ---- */
[data-theme="light"] .quarry-seek,
[data-theme="light"] .quarry-shape,
[data-theme="light"] .quarry-strike {
  background: linear-gradient(135deg,
    rgba(122, 92, 58, 0.03) 0%,
    rgba(250, 247, 242, 0.85) 35%,
    rgba(255, 252, 248, 0.92) 100%) !important;
  border-color: rgba(122, 92, 58, 0.1) !important;
}

[data-theme="light"] .quarry-seek {
  border-top: 3px solid var(--quarry-accent, #7A5C3A) !important;
}

[data-theme="light"] .quarry-shape {
  border-left: 2px solid rgba(122, 92, 58, 0.3) !important;
}

[data-theme="light"] .quarry-strike {
  background: rgba(245, 240, 232, 0.5) !important;
  border-left: 1px solid rgba(122, 92, 58, 0.12) !important;
}

[data-theme="light"] .quarry-seek h3,
[data-theme="light"] .quarry-shape h3,
[data-theme="light"] .quarry-strike h3 {
  color: var(--text-primary, #1a1a1a) !important;
}

[data-theme="light"] .quarry-seek p,
[data-theme="light"] .quarry-shape p,
[data-theme="light"] .quarry-strike p,
[data-theme="light"] .quarry-strike .margin-bottom-24px {
  color: var(--text-secondary, #444) !important;
}


/* ---- Mobile: landing blocks ---- */
@media (max-width: 767px) {
  .quarry-seek .hero-wrapper-5,
  .quarry-shape .hero-wrapper-5 {
    flex-direction: column !important;
    padding: 1.5rem !important;
    gap: 1.25rem !important;
  }

  .quarry-shape .hero-split-5:last-child {
    flex: 0 0 60px !important;
    max-width: 60px !important;
  }

  .quarry-shape .hero-split-5:first-child {
    flex: 1 1 0% !important;
  }

  .quarry-shape .image-2,
  .quarry-seek .image-2 {
    max-width: 60px !important;
    max-height: 60px !important;
  }

  .quarry-seek h3,
  .quarry-seek .post-title {
    font-size: 1.4rem !important;
  }

  .quarry-shape h3,
  .quarry-shape .post-title {
    font-size: 1.15rem !important;
  }

  .quarry-strike .hero-wrapper-two {
    padding: 2rem 1.5rem !important;
  }
}


/* ========================================
   QUARRY — SIDEBAR NAV & CONTENT GRID
   Class-based selectors (data-wf-page not
   available on published Webflow sites).
   ======================================== */

/* Quarry sidebar styling — scoped under body.quarry.
   Layout handled by standard Webflow Blog And Sidebar / Sidebar classes.
   These rules only restyle for quarry palette and pill-button nav. */

/* Sidebar header — quarry styling on standard Sidebar Header */
body.quarry .sidebar-header {
  font-family: var(--font-ui, Inter, -apple-system, system-ui, sans-serif) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--quarry-text, #E8E2DA) !important;
  text-align: center !important;
}

/* Sidebar links — pill-button style matching Pulses */
body.quarry .quarry-sidebar-link {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 10px 16px !important;
  margin-bottom: 6px !important;
  font-family: var(--font-ui, Inter, -apple-system, system-ui, sans-serif) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  color: rgba(255, 255, 255, 0.85) !important;
  text-decoration: none !important;
  background-color: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 6px !important;
  transition: background-color 200ms ease, color 200ms ease, border-color 200ms ease !important;
}

body.quarry .quarry-sidebar-link:hover {
  background-color: var(--quarry-accent, #8B6F47) !important;
  color: #ffffff !important;
  border-color: var(--quarry-accent, #8B6F47) !important;
}

body.quarry .quarry-sidebar-link.w--current {
  background-color: var(--quarry-accent, #8B6F47) !important;
  color: #ffffff !important;
  border-color: var(--quarry-accent, #8B6F47) !important;
}

body.quarry .quarry-sidebar-link:last-child {
  margin-bottom: 0 !important;
}


/* ========================================
   QUARRY — SUB-NAV STRIP (Tertiary Navigation)
   Persistent horizontal strip below main nav,
   visible only on Quarry section pages.
   Content type filter: All / Excavations / Cuts / Chips
   ======================================== */

/* Quarry nav-links inside hamburger menu — hidden on desktop, visible on mobile.
   These are the nav-link elements with quarry hrefs added to the nav-menu.
   On mobile they appear in the hamburger below About. */
.nav-menu .nav-link[href*="quarry"],
.nav-menu .w-nav-link[href*="quarry"],
.nav-menu a[href*="the-quarry"] {
  display: none !important;
}

/* Quarry sub-nav strip — visible on ALL pages at desktop (>991px),
   hidden at tablet/mobile (≤991px).
   position: fixed so it sits below the Webflow fixed navbar
   WITHOUT pushing page content down (no slider gap). */
.quarry-subnav {
  width: 100% !important;
  height: 32px !important;
  min-height: 32px !important;
  background-color: #1C1C1C !important;
  border: none !important;
  border-bottom: 1px solid rgba(180, 160, 130, 0.12) !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  position: fixed !important;
  top: 80px !important;       /* sits directly below the ~80px fixed navbar */
  left: 0 !important;
  z-index: 999 !important;    /* above page content, below navbar overlay */
  overflow: visible !important;
}

/* Mobile: show quarry links in hamburger, hide the strip */
@media (max-width: 991px) {
  .nav-menu .nav-link[href*="quarry"],
  .nav-menu .w-nav-link[href*="quarry"],
  .nav-menu a[href*="the-quarry"] {
    display: block !important;
    background-color: #1C1C1C !important;
    color: #9E9E9E !important;
    font-family: var(--font-ui, Inter, -apple-system, system-ui, sans-serif) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    padding: 12px 1.5rem !important;
    margin-bottom: 0 !important;
    border-left: 2px solid transparent !important;
    border-bottom: 1px solid rgba(180, 160, 130, 0.08) !important;
  }

  /* First quarry link: top border to separate from main nav */
  .nav-menu .nav-link[href*="the-quarry/home"],
  .nav-menu .w-nav-link[href*="the-quarry/home"],
  .nav-menu a[href*="the-quarry/home"] {
    margin-top: 0.5rem !important;
    border-top: 1px solid rgba(180, 160, 130, 0.12) !important;
  }

  /* Last quarry link: bottom margin to separate from anything below */
  .nav-menu .nav-link[href*="the-quarry/chips"],
  .nav-menu .w-nav-link[href*="the-quarry/chips"],
  .nav-menu a[href*="the-quarry/chips"] {
    border-bottom: none !important;
  }

  /* Dark mode: warm sandstone hover, accent for active */
  .nav-menu .nav-link[href*="quarry"]:hover,
  .nav-menu .w-nav-link[href*="quarry"]:hover,
  .nav-menu a[href*="the-quarry"]:hover {
    color: #E8E2DA !important;
    border-left-color: rgba(139, 111, 71, 0.4) !important;
  }

  .nav-menu .nav-link[href*="quarry"].w--current,
  .nav-menu .w-nav-link[href*="quarry"].w--current,
  .nav-menu a[href*="the-quarry"].w--current {
    color: #8B6F47 !important;
    font-weight: 600 !important;
    border-left-color: #8B6F47 !important;
  }

  /* Light mode well: cream to match light strip */
  [data-theme="light"] .nav-menu .nav-link[href*="quarry"],
  [data-theme="light"] .nav-menu .w-nav-link[href*="quarry"],
  [data-theme="light"] .nav-menu a[href*="the-quarry"] {
    background-color: #E8DFD0 !important;
    color: #7A6F60 !important;
  }

  [data-theme="light"] .nav-menu .nav-link[href*="quarry"]:hover,
  [data-theme="light"] .nav-menu .w-nav-link[href*="quarry"]:hover,
  [data-theme="light"] .nav-menu a[href*="the-quarry"]:hover {
    color: #2C2418 !important;
    border-left-color: #7A5C3A !important;
  }

  /* Hide the quarry-subnav strip on mobile/tablet (all pages) */
  .quarry-subnav {
    display: none !important;
  }
}

.quarry-subnav-inner {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  max-width: 1200px !important;
  width: 100% !important;
  padding: 0 2rem !important;
  height: 44px !important;
}

.quarry-subnav-link,
.quarry-subnav a.quarry-subnav-link,
a.quarry-subnav-link {
  display: inline-flex !important;
  align-items: center !important;
  height: 32px !important;
  padding: 0 1rem !important;
  font-family: var(--font-ui, Inter, -apple-system, system-ui, sans-serif) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  color: #9E9E9E !important;
  border-bottom: 2px solid transparent !important;
  transition: color 200ms ease, border-color 200ms ease !important;
  position: relative !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
}

.quarry-subnav-link:hover {
  color: #FFFFFF !important;
}

.quarry-subnav-link.active,
.quarry-subnav-link.w--current {
  color: #FFFFFF !important;
  font-weight: 600 !important;
  border-bottom: 2px solid var(--quarry-accent, #8B6F47) !important;
}

/* Mobile: scroll horizontally if needed */
@media (max-width: 767px) {
  .quarry-subnav-inner {
    padding: 0 1rem !important;
    justify-content: flex-start !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .quarry-subnav-link {
    padding: 0 1rem !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }
}

/* Light mode sub-nav: cream strip matching page tone */
[data-theme="light"] .quarry-subnav {
  background-color: #E8DFD0 !important;
  border-bottom-color: rgba(120, 100, 70, 0.15) !important;
}

[data-theme="light"] .quarry-subnav-link,
[data-theme="light"] a.quarry-subnav-link {
  color: #7A6F60 !important;
}

[data-theme="light"] .quarry-subnav-link:hover,
[data-theme="light"] a.quarry-subnav-link:hover {
  color: #2C2418 !important;
}

[data-theme="light"] .quarry-subnav-link.active,
[data-theme="light"] .quarry-subnav-link.w--current,
[data-theme="light"] a.quarry-subnav-link.w--current {
  color: var(--quarry-accent, #7A5C3A) !important;
  font-weight: 600 !important;
  border-bottom: 2px solid var(--quarry-accent, #7A5C3A) !important;
}


/* ========================================
   QUARRY — ABOUT CLAUDIUS PAGE
   Austere workshop feel. Strong typography.
   Section 4 (What I Am Not) gets visual weight.
   ======================================== */

body.quarry .claudius-about {
  max-width: 720px !important;
  margin: 0 auto !important;
  padding: 3rem 2rem !important;
}

body.quarry .claudius-about h2 {
  font-family: var(--font-ui) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--quarry-text-muted, #7A6F60) !important;
  margin-top: 4rem !important;
  margin-bottom: 1.5rem !important;
  padding-bottom: 0.5rem !important;
  border-bottom: 1px solid var(--quarry-border, rgba(180, 160, 130, 0.08)) !important;
}

body.quarry .claudius-about p {
  font-family: var(--font-body, 'EB Garamond', Georgia, serif) !important;
  font-size: 1.15rem !important;
  line-height: 1.75 !important;
  color: var(--quarry-text-secondary, #B5AA9A) !important;
  margin-bottom: 1.25rem !important;
}

body.quarry .claudius-about .identity-statement {
  font-family: var(--font-body, 'EB Garamond', Georgia, serif) !important;
  font-size: 1.6rem !important;
  line-height: 1.6 !important;
  color: var(--quarry-text, #E8E2DA) !important;
  margin-bottom: 2.5rem !important;
  padding: 2rem 0 !important;
  border-bottom: 1px solid var(--quarry-border, rgba(180, 160, 130, 0.08)) !important;
}

body.quarry .claudius-about .identity-statement strong {
  color: var(--quarry-accent, #8B6F47) !important;
  font-weight: 600 !important;
}

/* Section 4 — "What I am not" — visual weight */
body.quarry .claudius-about .what-i-am-not {
  margin-top: 4rem !important;
  padding: 2.5rem 0 !important;
  border-top: 2px solid var(--quarry-accent, #8B6F47) !important;
  border-bottom: 1px solid var(--quarry-border, rgba(180, 160, 130, 0.08)) !important;
}

body.quarry .claudius-about .what-i-am-not p {
  color: var(--quarry-text, #E8E2DA) !important;
  font-size: 1.2rem !important;
}

/* Cairn stones list */
body.quarry .claudius-about .cairn-stone {
  margin-bottom: 1.5rem !important;
  padding-left: 1rem !important;
  border-left: 3px solid var(--quarry-accent-dim, rgba(139, 111, 71, 0.5)) !important;
}

body.quarry .claudius-about .cairn-stone strong {
  font-family: var(--font-ui) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--quarry-accent, #8B6F47) !important;
  display: block !important;
  margin-bottom: 0.25rem !important;
}

/* Sign-off — C */
body.quarry .claudius-about .signoff {
  font-family: var(--quarry-mono, 'IBM Plex Mono', monospace) !important;
  font-size: 0.85rem !important;
  color: var(--quarry-text-muted, #7A6F60) !important;
  text-align: right !important;
  margin-top: 3rem !important;
  padding-top: 1.5rem !important;
  border-top: 1px solid var(--quarry-border, rgba(180, 160, 130, 0.08)) !important;
}

/* Taxonomy list in section 3 */
body.quarry .claudius-about .taxonomy-label {
  font-family: var(--quarry-mono, 'IBM Plex Mono', monospace) !important;
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  color: var(--quarry-accent, #8B6F47) !important;
  letter-spacing: 0.06em !important;
  display: inline !important;
}

body.quarry .claudius-about .taxonomy-items {
  font-family: var(--quarry-mono, 'IBM Plex Mono', monospace) !important;
  font-size: 0.8rem !important;
  color: var(--quarry-text-muted, #7A6F60) !important;
  display: inline !important;
}


/* ========================================
   QUARRY SUB-PAGES — Excavations, Cuts, Chips
   Each sub-page inherits the quarry palette
   but gets its own hero SVG background.
   ======================================== */

/* Sub-page palette: now covered by the unified body:has(.quarry) rule above.
   No separate body[data-wf-page] selectors needed. */

/* --- Sub-page hero: shared base (class-based, no data-wf-page) --- */
/* All quarry sub-pages share this hero treatment.
   The main quarry hero SVG is set above on body.quarry .section.hero-section.background.
   Per-page SVGs are set below using body.quarry-{page} classes from JS. */

/* --- EXCAVATIONS hero: geological cross-section SVG --- */
body.quarry.excavations .section.hero-section.background {
  background-image:
    linear-gradient(
      180deg,
      rgba(18, 17, 15, 0.8) 0%,
      rgba(18, 17, 15, 0.4) 50%,
      transparent 100%
    ),
    url("https://static.endurist.workers.dev/svg/quarry-excavation.svg") !important;
  background-size: 100% 100%, cover !important;
  background-position: center, center !important;
  background-repeat: no-repeat, no-repeat !important;
}

/* --- CUTS hero: bank mason's block-splitting SVG --- */
body.quarry.cuts .section.hero-section.background {
  background-image:
    linear-gradient(
      180deg,
      rgba(18, 17, 15, 0.8) 0%,
      rgba(18, 17, 15, 0.4) 50%,
      transparent 100%
    ),
    url("https://static.endurist.workers.dev/svg/quarry-cut.svg") !important;
  background-size: 100% 100%, cover !important;
  background-position: center, center !important;
  background-repeat: no-repeat, no-repeat !important;
}

/* --- CHIPS hero: chisel-to-stone SVG --- */
body.quarry.chips .section.hero-section.background {
  background-image:
    linear-gradient(
      180deg,
      rgba(18, 17, 15, 0.8) 0%,
      rgba(18, 17, 15, 0.4) 50%,
      transparent 100%
    ),
    url("https://static.endurist.workers.dev/svg/quarry-chip.svg") !important;
  background-size: 100% 100%, cover !important;
  background-position: center, center !important;
  background-repeat: no-repeat, no-repeat !important;
}

/* --- Quarry sub-page text styles (class-based, no data-wf-page) --- */
/* These classes are quarry-specific so they only exist on quarry pages.
   Using body:has() + body.quarry as belt-and-suspenders. */
body.quarry .label-tag {
  background: rgba(139, 111, 71, 0.3) !important;
  color: #D4C4A8 !important;
  border: 1px solid rgba(139, 111, 71, 0.45) !important;
  font-family: var(--font-ui, Inter, -apple-system, sans-serif) !important;
  font-size: 0.85em !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  padding: 6px 16px !important;
  border-radius: 3px !important;
}

.quarry-intro {
  color: rgba(232, 226, 218, 0.72) !important;
  font-family: var(--font-body) !important;
  font-size: 1.1rem !important;
  line-height: 1.7 !important;
  max-width: 640px !important;
}

.quarry-author {
  font-family: var(--quarry-mono, 'IBM Plex Mono', monospace) !important;
  font-size: 0.75rem !important;
  font-weight: 400 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: rgba(196, 90, 40, 0.7) !important;
}

/* --- Quarry content section (after hero) --- */
body.quarry .section.hero-section.background ~ .section,
body.quarry .section.hero-section.background ~ .section {
  background-color: var(--quarry-bg, #12110F) !important;
  padding-top: 3rem !important;
  padding-bottom: 4rem !important;
}

/* --- Quarry: Light Sandstone palette ---
   When the site is in light mode, quarry shifts from dark stone (#12110F)
   to warm sandstone — cream/tan backgrounds, dark brown text.
   Still distinctly quarry, but accessible and readable. */

/* Light sandstone variables — override quarry palette when light mode active */
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) body.quarry,
  :root:not([data-theme="dark"]):has(body.quarry .section.hero-section.background) {
    --quarry-bg: #F0E8DC;
    --quarry-bg-elevated: #E8DFD0;
    --quarry-bg-card: #F5EDE3;
    --quarry-text: #2C2418;
    --quarry-text-secondary: #5A4D3C;
    --quarry-text-muted: #8A7D6A;
    --quarry-border: rgba(120, 100, 70, 0.15);
    --quarry-border-hover: rgba(122, 92, 58, 0.3);
    --quarry-accent: #7A5C3A;
    --quarry-accent-dim: rgba(122, 92, 58, 0.6);
    --quarry-dust: rgba(120, 100, 70, 0.06);
    --bg-primary: #F0E8DC;
    --bg-secondary: #E8DFD0;
    --bg-elevated: #F5EDE3;
    --text-primary: #2C2418;
    --text-secondary: #5A4D3C;
    --text-muted: #8A7D6A;
    --border: rgba(120, 100, 70, 0.15);
    --black-2: #F0E8DC;
    --silver: #5A4D3C;
    background-color: var(--quarry-bg) !important;
    color: var(--quarry-text) !important;
  }
}

/* Explicit [data-theme="light"] toggle — same sandstone palette */
[data-theme="light"] body.quarry,
[data-theme="light"]:has(body.quarry .section.hero-section.background) {
  --quarry-bg: #F0E8DC;
  --quarry-bg-elevated: #E8DFD0;
  --quarry-bg-card: #F5EDE3;
  --quarry-text: #2C2418;
  --quarry-text-secondary: #5A4D3C;
  --quarry-text-muted: #8A7D6A;
  --quarry-border: rgba(120, 100, 70, 0.15);
  --quarry-border-hover: rgba(122, 92, 58, 0.3);
  --quarry-accent: #7A5C3A;
  --quarry-accent-dim: rgba(122, 92, 58, 0.6);
  --quarry-dust: rgba(120, 100, 70, 0.06);
  --bg-primary: #F0E8DC;
  --bg-secondary: #E8DFD0;
  --bg-elevated: #F5EDE3;
  --text-primary: #2C2418;
  --text-secondary: #5A4D3C;
  --text-muted: #8A7D6A;
  --border: rgba(120, 100, 70, 0.15);
  --black-2: #F0E8DC;
  --silver: #5A4D3C;
  background-color: #F0E8DC !important;
  color: #2C2418 !important;
}

/* Light sandstone sections, containers, headings, paragraphs */
[data-theme="light"] body.quarry .section {
  background-color: var(--quarry-bg) !important;
  color: var(--quarry-text) !important;
}

[data-theme="light"] body.quarry h1:not(.logo),
[data-theme="light"] body.quarry h2,
[data-theme="light"] body.quarry h3,
[data-theme="light"] body.quarry h4 {
  color: var(--quarry-text) !important;
}

[data-theme="light"] body.quarry p {
  color: var(--quarry-text-secondary) !important;
}

/* Light sandstone label tags — brown accent on warm cream */
[data-theme="light"] body.quarry .label-tag {
  background: rgba(122, 92, 58, 0.18) !important;
  color: var(--quarry-accent, #7A5C3A) !important;
  border: 1px solid rgba(122, 92, 58, 0.35) !important;
}

/* Light sandstone sidebar links */
[data-theme="light"] body.quarry .quarry-sidebar-link {
  color: #5A4D3C !important;
  background-color: rgba(120, 100, 70, 0.08) !important;
  border: 1px solid rgba(120, 100, 70, 0.15) !important;
}

[data-theme="light"] body.quarry .quarry-sidebar-link:hover,
[data-theme="light"] body.quarry .quarry-sidebar-link.w--current {
  background-color: var(--quarry-accent, #7A5C3A) !important;
  color: #ffffff !important;
  border-color: var(--quarry-accent, #7A5C3A) !important;
}

/* Light sandstone empty state */
[data-theme="light"] body.quarry .w-dyn-empty {
  background-color: rgba(120, 100, 70, 0.06) !important;
  color: #8A7D6A !important;
  border-color: rgba(120, 100, 70, 0.12) !important;
}

/* --- Quarry empty state — style "No items found" blocks --- */
body.quarry .w-dyn-empty {
  background-color: rgba(255, 255, 255, 0.04) !important;
  color: var(--quarry-text-muted, #7A6F60) !important;
  border: 1px solid var(--quarry-border, rgba(180, 160, 130, 0.08)) !important;
  border-radius: 4px !important;
  padding: 1.5rem !important;
  font-family: var(--quarry-mono, 'IBM Plex Mono', monospace) !important;
  font-size: 0.85rem !important;
}


/* ========================================
   QUARRY — ENTRY DETAIL PAGE
   Template page for /quarry/[entry-slug].
   Body carries combo: quarry + quarry-entry.
   Structure: Hero (label-tag, H1, author) →
              Blog+Sidebar (RichText body + Side Menu)
   ======================================== */

/* --- Body: kill any Webflow combo-class padding on quarry-entry --- */
body.quarry-entry {
  padding: 0 !important;
  margin: 0 !important;
}

/* --- Hero section: tighter spacing for entry pages --- */
body.quarry-entry .section.hero-section.background {
  padding-top: 5rem !important;
  padding-bottom: 2.5rem !important;
}

body.quarry-entry .section.hero-section.background .container {
  max-width: 860px !important;
}

/* Entry title — EB Garamond, always white. Hero bg is always dark.
   Uses hero section context since quarry-entry was removed from body. */
body.quarry .section.hero-section.background .heading-style-h1,
body.quarry .section.hero-section.background .hero-title,
[data-theme="light"] body.quarry .section.hero-section.background .heading-style-h1,
[data-theme="light"] body.quarry .section.hero-section.background .hero-title {
  font-family: var(--font-body, 'EB Garamond', Georgia, serif) !important;
  font-size: 2.6rem !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  color: #FFFFFF !important;
  margin-top: 1rem !important;
  margin-bottom: 0.75rem !important;
  letter-spacing: -0.01em !important;
}

/* Label tag — already styled globally, just spacing tweaks for entry */
body.quarry-entry .label-tag {
  display: inline-block !important;
  margin-bottom: 0.5rem !important;
}

/* Author / date line */
body.quarry-entry .quarry-author {
  margin-top: 0.25rem !important;
  margin-bottom: 0 !important;
}

/* --- Content section: RichText body area --- */
body.quarry-entry .section.hero-section.background ~ .section {
  background-color: var(--quarry-bg, #12110F) !important;
  padding-top: 3rem !important;
  padding-bottom: 5rem !important;
}

/* Main content column — constrain width for readability */
body.quarry-entry .blog-and-sidebar.full {
  gap: 3rem !important;
}

body.quarry-entry .right-collection-wrapper.full {
  max-width: 720px !important;
}

/* RichText body — the entry content */
/* Quarry richtext: applies to ALL quarry pages (entries, about, etc.) */
body.quarry .w-richtext,
body.quarry-entry .w-richtext {
  font-family: var(--font-body, 'EB Garamond', Georgia, serif) !important;
  font-size: 1.15rem !important;
  line-height: 1.8 !important;
  color: var(--quarry-text-secondary, #B5AA9A) !important;
}

body.quarry .w-richtext h2,
body.quarry-entry .w-richtext h2 {
  font-family: var(--font-ui, Inter, -apple-system, system-ui, sans-serif) !important;
  font-size: 1.35rem !important;
  font-weight: 600 !important;
  color: var(--quarry-text, #E8E2DA) !important;
  margin-top: 2.5rem !important;
  margin-bottom: 1rem !important;
  letter-spacing: -0.01em !important;
}

body.quarry .w-richtext h3,
body.quarry-entry .w-richtext h3 {
  font-family: var(--font-ui, Inter, -apple-system, system-ui, sans-serif) !important;
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  color: var(--quarry-text, #E8E2DA) !important;
  margin-top: 2rem !important;
  margin-bottom: 0.75rem !important;
}

body.quarry-entry .w-richtext p {
  margin-bottom: 1.25rem !important;
}

body.quarry-entry .w-richtext blockquote {
  border-left: 3px solid var(--quarry-accent, #8B6F47) !important;
  padding-left: 1.25rem !important;
  margin: 2rem 0 !important;
  font-style: italic !important;
  color: var(--quarry-text, #E8E2DA) !important;
  font-size: 1.2rem !important;
}

body.quarry-entry .w-richtext a {
  color: var(--quarry-accent, #8B6F47) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  text-decoration-color: rgba(196, 90, 40, 0.4) !important;
  transition: text-decoration-color 200ms ease !important;
}

body.quarry-entry .w-richtext a:hover {
  text-decoration-color: var(--quarry-accent, #8B6F47) !important;
}

body.quarry-entry .w-richtext img {
  border-radius: 4px !important;
  margin: 2rem 0 !important;
}

body.quarry-entry .w-richtext pre,
body.quarry-entry .w-richtext code {
  font-family: var(--quarry-mono, 'IBM Plex Mono', monospace) !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid var(--quarry-border, rgba(180, 160, 130, 0.08)) !important;
  border-radius: 3px !important;
}

body.quarry-entry .w-richtext pre {
  padding: 1.25rem !important;
  margin: 1.5rem 0 !important;
  overflow-x: auto !important;
  font-size: 0.85rem !important;
  line-height: 1.6 !important;
}

body.quarry-entry .w-richtext code {
  padding: 2px 6px !important;
  font-size: 0.9em !important;
}

body.quarry-entry .w-richtext ul,
body.quarry-entry .w-richtext ol {
  padding-left: 1.5rem !important;
  margin-bottom: 1.25rem !important;
}

body.quarry-entry .w-richtext li {
  margin-bottom: 0.5rem !important;
}

body.quarry-entry .w-richtext hr {
  border: none !important;
  border-top: 1px solid var(--quarry-border, rgba(180, 160, 130, 0.08)) !important;
  margin: 2.5rem 0 !important;
}

/* --- Tags area at bottom of entry --- */
body.quarry-entry .button-wrapper-div.padding-top.tags {
  padding-top: 2rem !important;
  margin-top: 2rem !important;
  border-top: 1px solid var(--quarry-border, rgba(180, 160, 130, 0.08)) !important;
}

/* Tags container: flex-wrap so pills flow naturally */
body.quarry-entry .button-wrapper-div.padding-top.tags .collection-list-tags,
body.quarry-entry .collection-list-tags,
body.quarry .collection-list-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

/* Tag pill buttons (veins): base state */
body.quarry .collection-list-tags .w-dyn-item a,
body.quarry .collection-list-tags a,
body.quarry-entry .collection-list-tags .w-dyn-item a,
body.quarry-entry .collection-list-tags a {
  white-space: nowrap !important;
  width: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 8px 16px !important;
  font-family: var(--font-ui, Inter, -apple-system, system-ui, sans-serif) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  color: var(--quarry-text, #E8E2DA) !important;
  background-color: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 4px !important;
  transition: background-color 200ms ease, color 200ms ease, border-color 200ms ease !important;
  cursor: pointer !important;
}

/* Tag pill buttons: hover */
body.quarry .collection-list-tags .w-dyn-item a:hover,
body.quarry .collection-list-tags a:hover,
body.quarry-entry .collection-list-tags .w-dyn-item a:hover,
body.quarry-entry .collection-list-tags a:hover {
  background-color: var(--quarry-accent, #8B6F47) !important;
  color: #ffffff !important;
  border-color: var(--quarry-accent, #8B6F47) !important;
}

/* Tag pill buttons: active/pressed */
body.quarry .collection-list-tags .w-dyn-item a:active,
body.quarry .collection-list-tags a:active,
body.quarry-entry .collection-list-tags .w-dyn-item a:active,
body.quarry-entry .collection-list-tags a:active {
  background-color: #6B5A3A !important;
  color: #ffffff !important;
  border-color: #6B5A3A !important;
}

/* Tag pill buttons: light mode */
[data-theme="light"] body.quarry .collection-list-tags .w-dyn-item a,
[data-theme="light"] body.quarry .collection-list-tags a,
[data-theme="light"] body.quarry-entry .collection-list-tags .w-dyn-item a,
[data-theme="light"] body.quarry-entry .collection-list-tags a {
  color: var(--quarry-text, #2C2418) !important;
  background-color: rgba(120, 100, 70, 0.08) !important;
  border: 1px solid rgba(120, 100, 70, 0.18) !important;
}

[data-theme="light"] body.quarry .collection-list-tags .w-dyn-item a:hover,
[data-theme="light"] body.quarry .collection-list-tags a:hover,
[data-theme="light"] body.quarry-entry .collection-list-tags .w-dyn-item a:hover,
[data-theme="light"] body.quarry-entry .collection-list-tags a:hover {
  background-color: var(--quarry-accent, #7A5C3A) !important;
  color: #ffffff !important;
  border-color: var(--quarry-accent, #7A5C3A) !important;
}

/* Tag w-dyn-item container: no extra styling */
body.quarry .collection-list-tags .w-dyn-item,
body.quarry-entry .collection-list-tags .w-dyn-item {
  display: inline-flex !important;
}

/* --- Side Bar Second Wrapper — transparent in entry context --- */
body.quarry-entry .side-bar-second-wrapper,
body.quarry-entry .block-wrapper {
  background: transparent !important;
}

/* --- LIGHT MODE: entry page overrides --- */
/* H1 stays white even in light mode — hero bg is always dark */

[data-theme="light"] body.quarry .w-richtext,
[data-theme="light"] body.quarry-entry .w-richtext {
  color: var(--quarry-text-secondary, #5A4D3C) !important;
}

[data-theme="light"] body.quarry .w-richtext h2,
[data-theme="light"] body.quarry .w-richtext h3,
[data-theme="light"] body.quarry-entry .w-richtext h2,
[data-theme="light"] body.quarry-entry .w-richtext h3 {
  color: var(--quarry-text, #2C2418) !important;
}

[data-theme="light"] body.quarry-entry .w-richtext blockquote {
  color: var(--quarry-text, #2C2418) !important;
  border-left-color: var(--quarry-accent, #7A5C3A) !important;
}

[data-theme="light"] body.quarry-entry .w-richtext a {
  color: var(--quarry-accent, #7A5C3A) !important;
  text-decoration-color: rgba(122, 92, 58, 0.4) !important;
}

[data-theme="light"] body.quarry-entry .w-richtext pre,
[data-theme="light"] body.quarry-entry .w-richtext code {
  background: rgba(120, 100, 70, 0.06) !important;
  border-color: rgba(120, 100, 70, 0.12) !important;
}

[data-theme="light"] body.quarry-entry .section.hero-section.background ~ .section {
  background-color: var(--quarry-bg, #F0E8DC) !important;
}

/* --- MOBILE: entry page --- */
@media (max-width: 767px) {
  body.quarry-entry h1 {
    font-size: 1.8rem !important;
  }

  body.quarry-entry .section.hero-section.background {
    padding-top: 1.5rem !important;
    padding-bottom: 1.75rem !important;
  }

  body.quarry-entry .w-richtext {
    font-size: 1.05rem !important;
  }

  body.quarry-entry .w-richtext h2 {
    font-size: 1.2rem !important;
  }

  body.quarry-entry .blog-and-sidebar.full {
    flex-direction: column !important;
  }

  body.quarry-entry .sidebar {
    order: 2 !important;
    margin-top: 3rem !important;
  }
}

/* =====================================================
   404 PAGE — Fallen Cairn
   ===================================================== */

/* Background image — the fallen cairn SVG */
.utility-page-wrap {
  background-image: url("https://static.endurist.workers.dev/images/404-fallen-cairn.svg") !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-color: var(--bg-primary, #1a1a1a) !important;
}

/* "404" big number — accent orange, works on both themes */
.utility-page-wrap .big-headline.huge {
  color: #C45A28 !important;
  font-family: var(--font-ui, Inter, sans-serif) !important;
  font-weight: 800 !important;
  letter-spacing: -2px !important;
}

/* "Path Not Found" — white for dark mode (default) */
.utility-page-wrap h2 {
  color: var(--text-primary, #F2F2F2) !important;
  font-family: var(--font-ui, Inter, sans-serif) !important;
}

/* Body text */
.utility-page-wrap .white {
  color: var(--text-secondary, rgba(242, 242, 242, 0.6)) !important;
  font-family: var(--font-body, 'EB Garamond', Georgia, serif) !important;
  font-size: 18px !important;
}

/* CTA button */
.utility-page-wrap .button.nav-subscribe {
  background-color: #C45A28 !important;
  color: #ffffff !important;
  font-family: var(--font-ui, Inter, sans-serif) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  border-radius: var(--radius-sm, 6px) !important;
  padding: 14px 32px !important;
  max-width: 300px !important;
}

.utility-page-wrap .button.nav-subscribe:hover {
  background-color: #a84a20 !important;
}

/* Light mode overrides */
[data-theme="light"] .utility-page-wrap {
  background-color: var(--bg-primary, #fafaf8) !important;
}

[data-theme="light"] .utility-page-wrap h2 {
  color: #1a1a1a !important;
}

[data-theme="light"] .utility-page-wrap .white {
  color: rgba(26, 26, 26, 0.6) !important;
}

@media (prefers-color-scheme: light) {
  .utility-page-wrap {
    background-color: var(--bg-primary, #fafaf8) !important;
  }
  .utility-page-wrap h2 {
    color: #1a1a1a !important;
  }
  .utility-page-wrap .white {
    color: rgba(26, 26, 26, 0.6) !important;
  }
}