/*
Theme Name:   Calfrun Co.
Theme URI:    https://calfrun.dev
Description:  Astra child theme for Calfrun Co. Applies the Stitch "Modern Commerce UI" design system (colors, typography, spacing, radii) site-wide. Built as a WooCommerce sandbox baseline.
Author:       Calfrun
Author URI:   https://calfrun.dev
Template:     astra
Version:      1.0.0
Text Domain:  calfrun-co
*/

/* =============================================================
   DESIGN TOKENS — Stitch "Modern Commerce UI"
   Names preserved from the source DESIGN.md to maintain traceability.
   ============================================================= */
:root {
  /* ----- Surface palette ----- */
  --calfrun-surface:                   #f9f9ff;
  --calfrun-surface-dim:               #cfdaf2;
  --calfrun-surface-bright:            #f9f9ff;
  --calfrun-surface-container-lowest:  #ffffff;
  --calfrun-surface-container-low:     #f0f3ff;
  --calfrun-surface-container:         #e7eeff;
  --calfrun-surface-container-high:    #dee8ff;
  --calfrun-surface-container-highest: #d8e3fb;
  --calfrun-surface-variant:           #d8e3fb;

  /* ----- Text on surface ----- */
  --calfrun-on-surface:          #111c2d;
  --calfrun-on-surface-variant:  #43474f;
  --calfrun-inverse-surface:     #263143;
  --calfrun-inverse-on-surface:  #ecf1ff;

  /* ----- Outlines ----- */
  --calfrun-outline:          #737780;
  --calfrun-outline-variant:  #c3c6d1;

  /* ----- Primary — Midnight Navy ----- */
  --calfrun-primary:                    #001e40;
  --calfrun-on-primary:                 #ffffff;
  --calfrun-primary-container:          #003366;
  --calfrun-on-primary-container:       #799dd6;
  --calfrun-primary-fixed:              #d5e3ff;
  --calfrun-primary-fixed-dim:          #a7c8ff;
  --calfrun-on-primary-fixed:           #001b3c;
  --calfrun-on-primary-fixed-variant:   #1f477b;
  --calfrun-inverse-primary:            #a7c8ff;
  --calfrun-surface-tint:               #3a5f94;

  /* ----- Secondary — Growth Green (CTAs) ----- */
  --calfrun-secondary:                  #1b6d24;
  --calfrun-on-secondary:               #ffffff;
  --calfrun-secondary-container:        #a0f399;
  --calfrun-on-secondary-container:     #217128;
  --calfrun-secondary-fixed:            #a3f69c;
  --calfrun-secondary-fixed-dim:        #88d982;
  --calfrun-on-secondary-fixed:         #002204;
  --calfrun-on-secondary-fixed-variant: #005312;

  /* ----- Tertiary — Charcoal ----- */
  --calfrun-tertiary:                   #1b1f20;
  --calfrun-on-tertiary:                #ffffff;
  --calfrun-tertiary-container:         #303436;
  --calfrun-on-tertiary-container:      #999c9e;
  --calfrun-tertiary-fixed:             #e0e3e5;
  --calfrun-tertiary-fixed-dim:         #c4c7c9;
  --calfrun-on-tertiary-fixed:          #191c1e;
  --calfrun-on-tertiary-fixed-variant:  #444749;

  /* ----- Error ----- */
  --calfrun-error:               #ba1a1a;
  --calfrun-on-error:            #ffffff;
  --calfrun-error-container:     #ffdad6;
  --calfrun-on-error-container:  #93000a;

  /* ----- Background aliases ----- */
  --calfrun-background:     #f9f9ff;
  --calfrun-on-background:  #111c2d;

  /* ----- Typography ----- */
  --calfrun-font-headline: 'Work Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --calfrun-font-body:     'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* ----- Type scale ----- */
  --calfrun-headline-xl-size: 48px;
  --calfrun-headline-lg-size: 32px;
  --calfrun-headline-md-size: 24px;
  --calfrun-body-lg-size:     18px;
  --calfrun-body-md-size:     16px;
  --calfrun-label-md-size:    14px;
  --calfrun-caption-size:     12px;

  /* ----- Spacing (4px baseline grid) ----- */
  --calfrun-space-base: 4px;
  --calfrun-space-xs:   8px;
  --calfrun-space-sm:   16px;
  --calfrun-space-md:   24px;
  --calfrun-space-lg:   48px;
  --calfrun-space-xl:   80px;

  /* ----- Layout ----- */
  --calfrun-container-max: 1280px;
  --calfrun-gutter:        24px;

  /* ----- Radius ----- */
  --calfrun-radius-sm:   2px;
  --calfrun-radius:      4px;
  --calfrun-radius-md:   6px;
  --calfrun-radius-lg:   8px;
  --calfrun-radius-xl:   12px;
  --calfrun-radius-full: 9999px;

  /* ----- Shadow (Level 2: ambient hover; Level 3: modal) ----- */
  --calfrun-shadow-hover: 0 4px 20px rgba(0, 0, 0, 0.05);
  --calfrun-shadow-modal: 0 12px 40px rgba(0, 0, 0, 0.12);
}

/* =============================================================
   GLOBAL BASELINE — apply tokens site-wide
   ============================================================= */
body,
.ast-container,
.entry-content,
.site-content {
  font-family: var(--calfrun-font-body);
  font-size:   var(--calfrun-body-md-size);
  line-height: 1.6;
  color:       var(--calfrun-on-background);
  background:  var(--calfrun-background);
}

/* Headlines — Work Sans */
h1,
.site-title,
.entry-title {
  font-family:    var(--calfrun-font-headline);
  font-weight:    700;
  line-height:    1.2;
  letter-spacing: -0.02em;
  color:          var(--calfrun-on-surface);
}
h1, .entry-title { font-size: var(--calfrun-headline-xl-size); }

h2 {
  font-family:    var(--calfrun-font-headline);
  font-size:      var(--calfrun-headline-lg-size);
  font-weight:    600;
  line-height:    1.3;
  letter-spacing: -0.01em;
  color:          var(--calfrun-on-surface);
}

h3 {
  font-family: var(--calfrun-font-headline);
  font-size:   var(--calfrun-headline-md-size);
  font-weight: 600;
  line-height: 1.4;
  color:       var(--calfrun-on-surface);
}

h4, h5, h6 {
  font-family: var(--calfrun-font-headline);
  font-weight: 600;
  color:       var(--calfrun-on-surface);
}

/* Links */
a {
  color:       var(--calfrun-primary);
  transition:  color 0.15s ease;
}
a:hover,
a:focus {
  color: var(--calfrun-primary-container);
}

/* =============================================================
   SITE HEADER — match Stitch top nav
   Applies to both Astra's default header and block-theme headers.
   ============================================================= */
.site-header,
.ast-primary-header-bar,
header.site-header {
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--calfrun-outline-variant) !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}
.site-title a,
.site-title,
.ast-site-title-wrap .site-title a {
  font-family:    var(--calfrun-font-headline) !important;
  font-weight:    700 !important;
  font-size:      24px !important;
  letter-spacing: -0.02em !important;
  color:          var(--calfrun-on-surface) !important;
}

/* Primary menu */
.main-navigation a,
.main-header-menu a,
.ast-primary-header .main-header-menu a {
  font-family:  var(--calfrun-font-headline);
  font-size:    14px;
  font-weight:  500;
  color:        var(--calfrun-on-surface-variant);
  letter-spacing: -0.01em;
  transition:   color 0.15s ease;
}
.main-navigation a:hover,
.main-header-menu a:hover {
  color: var(--calfrun-on-surface);
}

/* Header utility icons container (cart, search, account) */
.ast-header-account-wrap,
.ast-header-woo-cart,
.ast-header-search {
  color: var(--calfrun-on-surface);
}

/* =============================================================
   SITE FOOTER — clean column layout
   ============================================================= */
.site-footer,
.site-below-footer-wrap,
.ast-small-footer {
  background: var(--calfrun-surface-container-low) !important;
  border-top: 1px solid var(--calfrun-outline-variant) !important;
  color:      var(--calfrun-on-surface-variant);
}
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer h5,
.site-footer h6 {
  font-family:    var(--calfrun-font-body);
  font-size:      14px;
  font-weight:    600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color:          var(--calfrun-on-surface);
}
.site-footer a {
  color:      var(--calfrun-on-surface-variant);
  font-family: var(--calfrun-font-headline);
  font-size:  14px;
}
.site-footer a:hover {
  color: var(--calfrun-on-surface);
}

/* =============================================================
   BUTTONS — primary CTA (Growth Green), secondary (Navy outline)
   ============================================================= */

/* Primary / CTA (alt class, Add to Cart, Place Order, Gutenberg filled button) */
.wp-block-button__link,
.wp-block-button.is-style-fill .wp-block-button__link,
.woocommerce .button.alt,
.woocommerce button.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce .single_add_to_cart_button,
.woocommerce-page .single_add_to_cart_button,
.woocommerce #place_order,
.woocommerce-page #place_order,
.wpcf7-submit {
  background-color: var(--calfrun-secondary) !important;
  color:            var(--calfrun-on-secondary) !important;
  border:           none !important;
  border-radius:    var(--calfrun-radius-lg) !important;
  font-family:      var(--calfrun-font-body) !important;
  font-size:        var(--calfrun-label-md-size) !important;
  font-weight:      600 !important;
  letter-spacing:   0.05em !important;
  padding:          14px 28px !important;
  transition:       transform 0.1s ease, filter 0.15s ease !important;
  cursor:           pointer;
}
.wp-block-button__link:hover,
.woocommerce .button.alt:hover,
.woocommerce .single_add_to_cart_button:hover,
.woocommerce #place_order:hover,
.wpcf7-submit:hover {
  filter: brightness(1.1);
  color: var(--calfrun-on-secondary) !important;
}
.wp-block-button__link:active,
.woocommerce .button.alt:active,
.woocommerce .single_add_to_cart_button:active {
  transform: scale(0.96);
}

/* Secondary buttons (non-alt WooCommerce buttons, Gutenberg outline) */
.wp-block-button.is-style-outline .wp-block-button__link,
.woocommerce .button:not(.alt):not(.single_add_to_cart_button),
.woocommerce button.button:not(.alt),
.woocommerce a.button:not(.alt),
.woocommerce input.button:not(.alt) {
  background-color: transparent !important;
  color:            var(--calfrun-primary) !important;
  border:           1px solid var(--calfrun-primary) !important;
  border-radius:    var(--calfrun-radius-lg) !important;
  font-family:      var(--calfrun-font-body) !important;
  font-size:        var(--calfrun-label-md-size) !important;
  font-weight:      600 !important;
  letter-spacing:   0.05em !important;
  padding:          13px 27px !important;
  transition:       all 0.15s ease !important;
}
.woocommerce .button:not(.alt):hover {
  background-color: var(--calfrun-primary) !important;
  color:            var(--calfrun-on-primary) !important;
}

/* =============================================================
   FORMS
   ============================================================= */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="url"],
textarea,
select,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
  border:        1px solid var(--calfrun-outline-variant) !important;
  border-radius: var(--calfrun-radius) !important;
  padding:       12px 16px !important;
  font-family:   var(--calfrun-font-body) !important;
  font-size:     var(--calfrun-body-md-size) !important;
  color:         var(--calfrun-on-surface) !important;
  background:    var(--calfrun-surface-container-lowest) !important;
  transition:    border-color 0.15s ease !important;
  box-shadow:    none !important;
}
input:focus,
textarea:focus,
select:focus {
  outline:      none !important;
  border-color: var(--calfrun-primary) !important;
  border-width: 2px !important;
  padding:      11px 15px !important; /* compensate 1px border growth */
}

label {
  font-family:    var(--calfrun-font-body);
  font-size:      var(--calfrun-label-md-size);
  font-weight:    600;
  letter-spacing: 0.05em;
  color:          var(--calfrun-on-surface);
  display:        block;
  margin-bottom:  var(--calfrun-space-xs);
}

/* =============================================================
   WOOCOMMERCE PRODUCT CARDS — "Ghost" style
   ============================================================= */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  background:    var(--calfrun-surface-container-lowest);
  border:        1px solid var(--calfrun-outline-variant);
  border-radius: var(--calfrun-radius-lg);
  padding:       var(--calfrun-space-sm);
  transition:    box-shadow 0.25s ease, transform 0.25s ease;
}
.woocommerce ul.products li.product:hover {
  box-shadow: var(--calfrun-shadow-hover);
  transform:  translateY(-2px);
}

.woocommerce ul.products li.product img,
.woocommerce ul.products li.product .wp-post-image {
  border-radius: var(--calfrun-radius-lg);
  background:    var(--calfrun-surface-container-low);
  aspect-ratio:  1 / 1;
  object-fit:    cover;
  margin-bottom: var(--calfrun-space-md) !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--calfrun-font-headline) !important;
  font-size:   16px !important;
  font-weight: 600 !important;
  color:       var(--calfrun-on-surface) !important;
  margin:      0 0 4px 0 !important;
  padding:     0 !important;
}

.woocommerce ul.products li.product .price {
  font-family: var(--calfrun-font-body) !important;
  font-size:   16px !important;
  font-weight: 700 !important;
  color:       var(--calfrun-on-surface) !important;
}
.woocommerce ul.products li.product .price del {
  color:      var(--calfrun-on-surface-variant) !important;
  opacity:    0.6;
  font-size:  12px !important;
  font-weight: 400 !important;
  display:    inline-block;
  margin-right: 6px;
}
.woocommerce ul.products li.product .price ins {
  background: transparent !important;
  text-decoration: none !important;
}

/* Sale badge */
.woocommerce span.onsale {
  background:       var(--calfrun-error) !important;
  color:            var(--calfrun-on-error) !important;
  border-radius:    var(--calfrun-radius) !important;
  padding:          4px 8px !important;
  font-family:      var(--calfrun-font-body) !important;
  font-size:        10px !important;
  font-weight:      700 !important;
  letter-spacing:   0.05em !important;
  text-transform:   uppercase !important;
  min-width:        0 !important;
  min-height:       0 !important;
  line-height:      1 !important;
  top:              12px !important;
  left:             12px !important;
  right:            auto !important;
}

/* =============================================================
   SINGLE PRODUCT PAGE
   ============================================================= */
.woocommerce div.product .product_title {
  font-family:    var(--calfrun-font-headline) !important;
  font-size:      32px !important;
  font-weight:    600 !important;
  letter-spacing: -0.01em !important;
  color:          var(--calfrun-on-surface) !important;
}

.woocommerce div.product .price,
.woocommerce div.product p.price {
  font-family: var(--calfrun-font-body) !important;
  font-size:   24px !important;
  font-weight: 700 !important;
  color:       var(--calfrun-on-surface) !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
  border-bottom-color: var(--calfrun-primary) !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  font-family:     var(--calfrun-font-body);
  font-weight:     600;
  color:           var(--calfrun-on-surface-variant);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--calfrun-on-surface);
}

/* =============================================================
   CART & CHECKOUT
   ============================================================= */
.woocommerce-cart table.cart,
.woocommerce-checkout table.shop_table,
.woocommerce table.shop_table {
  border-radius: var(--calfrun-radius-lg) !important;
  border:        1px solid var(--calfrun-outline-variant) !important;
  background:    var(--calfrun-surface-container-lowest) !important;
}
.woocommerce table.shop_table th {
  font-family:    var(--calfrun-font-body);
  font-size:      var(--calfrun-label-md-size);
  font-weight:    600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color:          var(--calfrun-on-surface);
  background:     var(--calfrun-surface-container-low) !important;
}

.woocommerce-info,
.woocommerce-message,
.woocommerce-notice {
  border-radius: var(--calfrun-radius-lg) !important;
  border-top:    3px solid var(--calfrun-primary) !important;
  background:    var(--calfrun-surface-container-low) !important;
  color:         var(--calfrun-on-surface) !important;
}
.woocommerce-error {
  border-radius: var(--calfrun-radius-lg) !important;
  border-top:    3px solid var(--calfrun-error) !important;
  background:    var(--calfrun-error-container) !important;
  color:         var(--calfrun-on-error-container) !important;
}

/* =============================================================
   BLOCKS — generic Gutenberg polish
   ============================================================= */
.wp-block-group {
  border-radius: var(--calfrun-radius-lg);
}

.wp-block-cover .wp-block-cover__inner-container h1,
.wp-block-cover .wp-block-cover__inner-container h2,
.wp-block-cover .wp-block-cover__inner-container h3 {
  color: #ffffff;
}

/* Utility: large section padding (Stitch 80px) */
.calfrun-section-xl { padding-top: var(--calfrun-space-xl); padding-bottom: var(--calfrun-space-xl); }
.calfrun-section-lg { padding-top: var(--calfrun-space-lg); padding-bottom: var(--calfrun-space-lg); }

/* Utility: container */
.calfrun-container {
  max-width:      var(--calfrun-container-max);
  margin-left:    auto;
  margin-right:   auto;
  padding-left:   var(--calfrun-space-md);
  padding-right:  var(--calfrun-space-md);
}

/* Utility: uppercase eyebrow label (Stitch "Curation" / "Curated Selection") */
.calfrun-eyebrow {
  font-family:    var(--calfrun-font-body);
  font-size:      var(--calfrun-label-md-size);
  font-weight:    600;
  color:          var(--calfrun-secondary);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  display:        block;
  margin-bottom:  var(--calfrun-space-xs);
}

/* Material Symbols rendering defaults */
.material-symbols-outlined {
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  vertical-align: middle;
}

/* =============================================================
   HOMEPAGE SPECIFIC
   ============================================================= */
.home .entry-title,
.home .ast-archive-title,
.home .ast-page-header,
.home .entry-header {
  display: none !important;
}
.home .entry-content {
  margin-top: 0 !important;
}
.home .site-content > .ast-container {
  padding: 0 !important;
  max-width: none !important;
}
.home .ast-container {
  padding: 0 !important;
}
.home article {
  padding: 0 !important;
}

/* Fix columns wrap issue on the category section's heading row */
.home .wp-block-columns {
  flex-wrap: nowrap !important;
  gap: 24px;
}
@media (max-width: 768px) {
  .home .wp-block-columns {
    flex-wrap: wrap !important;
  }
}
/* === CALFRUN-OVERRIDES START === */

/* ----- Stretched links: make whole category tile clickable ----- */
.wp-block-cover {
  position: relative;
}
.wp-block-cover .calfrun-stretched-link {
  position: static;
}
.wp-block-cover .calfrun-stretched-link::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 5;
}
/* And give the cover a hover state to signal interactivity */
.wp-block-cover:has(.calfrun-stretched-link) {
  cursor: pointer;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.wp-block-cover:has(.calfrun-stretched-link):hover .wp-block-cover__image-background {
  transform: scale(1.05);
  transition: transform 0.5s ease;
}
.wp-block-cover .wp-block-cover__image-background {
  transition: transform 0.5s ease;
}

/* ----- Brand wordmark: ensure it's linked + styled ----- */
.site-title a,
.site-title {
  font-family: 'Work Sans', sans-serif;
  font-weight: 700;
  font-size: 22px;
  letter-spacing: -0.01em;
  color: var(--calfrun-on-surface, #111c2d);
  text-decoration: none;
}
.site-title a:hover {
  color: var(--calfrun-primary, #001e40);
}

/* ----- Header utility icons (cart/account/search) ----- */
.calfrun-header-utility {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  margin-left: 24px;
}
.calfrun-header-utility a {
  color: var(--calfrun-on-surface, #111c2d);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 8px;
  border-radius: 6px;
  transition: opacity 0.2s, background 0.2s;
  text-decoration: none;
}
.calfrun-header-utility a:hover {
  background: var(--calfrun-surface-container, #e7eeff);
  opacity: 1;
}
.calfrun-header-utility .material-symbols-outlined {
  font-size: 22px;
}
.calfrun-cart-count {
  position: absolute;
  top: 0;
  right: 0;
  background: var(--calfrun-secondary, #1b6d24);
  color: #ffffff;
  font-family: 'Inter', sans-serif;
  font-size: 10px;
  font-weight: 700;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

/* ----- Footer: build a proper 4-column footer with brand+columns ----- */
.calfrun-footer {
  background: var(--calfrun-surface-container-low, #f0f3ff);
  border-top: 1px solid var(--calfrun-outline-variant, #c3c6d1);
  padding: 64px 0 32px;
}
.calfrun-footer-inner {
  max-width: var(--calfrun-container-max, 1280px);
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 48px;
}
@media (max-width: 768px) {
  .calfrun-footer-inner {
    grid-template-columns: 1fr 1fr;
  }
}
.calfrun-footer-brand {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 360px;
}
.calfrun-footer-brand-name {
  font-family: 'Work Sans', sans-serif;
  font-weight: 700;
  font-size: 20px;
  letter-spacing: -0.01em;
  color: var(--calfrun-on-surface, #111c2d);
}
.calfrun-footer-brand p {
  color: var(--calfrun-on-surface-variant, #43474f);
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  line-height: 1.6;
  margin: 0;
}
.calfrun-footer-socials {
  display: flex;
  gap: 12px;
  margin-top: 8px;
}
.calfrun-footer-socials a {
  color: var(--calfrun-on-surface-variant, #43474f);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  border-radius: 6px;
  text-decoration: none;
  transition: background 0.2s, color 0.2s;
}
.calfrun-footer-socials a:hover {
  background: var(--calfrun-surface-container, #e7eeff);
  color: var(--calfrun-primary, #001e40);
}
.calfrun-footer-col h5 {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--calfrun-on-surface, #111c2d);
  margin: 0 0 16px 0;
}
.calfrun-footer-col ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.calfrun-footer-col ul li a {
  color: var(--calfrun-on-surface-variant, #43474f);
  font-family: 'Work Sans', sans-serif;
  font-size: 14px;
  text-decoration: none;
  transition: color 0.2s;
}
.calfrun-footer-col ul li a:hover {
  color: var(--calfrun-primary, #001e40);
}
.calfrun-footer-bottom {
  max-width: var(--calfrun-container-max, 1280px);
  margin: 32px auto 0;
  padding: 24px 24px 0;
  border-top: 1px solid var(--calfrun-outline-variant, #c3c6d1);
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
}
.calfrun-footer-bottom p {
  color: var(--calfrun-on-surface-variant, #43474f);
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  margin: 0;
}
.calfrun-footer-bottom nav {
  display: flex;
  gap: 24px;
}
.calfrun-footer-bottom nav a {
  color: var(--calfrun-on-surface-variant, #43474f);
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  text-decoration: none;
}
.calfrun-footer-bottom nav a:hover {
  color: var(--calfrun-primary, #001e40);
}
/* Hide Astra's default below-footer that just shows "Powered by..." */


/* === CALFRUN-OVERRIDES END === */
/* CALFRUN-HEADER-BG START */
/* Match header (and footer) container backgrounds to the body paper colour
   so the constrained-width header bar visually blends with the surrounding
   viewport area. No more visible "menu break". */
.site-header,
.ast-primary-header-bar,
header.site-header,
.site-below-footer-wrap,
.site-footer {
  background: #f9f9ff !important;
  background-color: #f9f9ff !important;
}
/* CALFRUN-HEADER-BG END */

/* CALFRUN-FOOTER START */
.cf-foot-brand-name {
  font-family: 'Work Sans', sans-serif;
  font-weight: 700;
  font-size: 20px;
  color: var(--calfrun-on-surface, #111c2d);
  margin-bottom: 12px;
}
.cf-foot-brand p {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  line-height: 1.6;
  color: var(--calfrun-on-surface-variant, #43474f);
  margin: 0 0 16px;
  max-width: 320px;
}
.cf-foot-socials a {
  color: var(--calfrun-on-surface-variant, #43474f);
  text-decoration: none;
  font-size: 13px;
}
.cf-foot-socials a:hover {
  color: var(--calfrun-primary, #001e40);
}
.footer-widget-area .widget-title {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--calfrun-on-surface, #111c2d);
  margin-bottom: 16px;
}
.cf-foot-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.cf-foot-list li {
  margin-bottom: 10px;
}
.cf-foot-list li a {
  color: var(--calfrun-on-surface-variant, #43474f);
  font-family: 'Work Sans', sans-serif;
  font-size: 14px;
  text-decoration: none;
  transition: color 0.2s;
}
.cf-foot-list li a:hover {
  color: var(--calfrun-primary, #001e40);
  text-decoration: none;
}
/* Footer copyright styling — sit it inside the same paper colour and add a top border */
.ast-footer-copyright {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  color: var(--calfrun-on-surface-variant, #43474f);
}
.site-primary-footer-wrap {
  padding-top: 56px !important;
  padding-bottom: 32px !important;
}
.site-below-footer-wrap {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
  border-top: 1px solid var(--calfrun-outline-variant, #c3c6d1);
}
/* CALFRUN-FOOTER END */