/**
 * LimoSphere accent overlay — dark theme kept.
 * Ensures Webflow --primary-color uses AppColors primary.
 */
:root {
  /* Warm-gold trial — champagne accent taken from /booking-widgets */
  --primary-color: #c9873f;
  --primary-color-light: #e2a866;
  --primary-ink: #20150c;
  --cream: #f3ede6;
  --espresso: #241a12;
}

/* Gold-filled Webflow button variant needs dark ink, not white —
   white on #c9873f is only ~2.6:1. */
.button:where(.w-variant-abe3b543-7cf0-e707-c135-40bf74b96a96) {
  color: var(--primary-ink) !important;
}
.button:where(.w-variant-abe3b543-7cf0-e707-c135-40bf74b96a96):hover {
  background-color: var(--primary-color-light) !important;
  border-color: var(--primary-color-light) !important;
  color: var(--primary-ink) !important;
}

.text-color-purple,
.text-color-purple *,
.w-embed .text-color-purple {
  color: var(--primary-color) !important;
}

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

/* Dense fat footer — overrides Webflow stretchy 3-col flex */
.footer {
  padding-top: 100px;
}

.footer-flex.footer-flex--dense {
  display: grid;
  grid-template-columns: minmax(220px, 1.35fr) repeat(3, minmax(140px, 1fr));
  gap: 2rem 1.75rem;
  justify-content: stretch;
  align-items: start;
  margin-bottom: 48px;
}

.footer-column--brand {
  max-width: 22rem;
}

.footer-brand-blurb {
  color: rgba(255, 255, 255, 0.55);
  font-size: 0.875rem;
  line-height: 1.55;
  margin: 0 0 1.25rem;
  letter-spacing: -0.01em;
}

.footer-contact-stack {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.35rem;
  margin-bottom: 1.25rem;
}

.footer-contact-line {
  color: rgba(255, 255, 255, 0.55);
  font-size: 0.875rem;
  line-height: 1.45;
  margin: 0;
}

.footer-contact-hours {
  margin-top: 0.35rem;
  color: rgba(255, 255, 255, 0.4);
  font-size: 0.8125rem;
}

.footer-column--brand .footer-social {
  margin: 0.5rem 0 0;
}

/* Footer social icons */
.footer-social {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin: 2.5rem 0 1.25rem;
}

.footer-social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.55);
  text-decoration: none;
  transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
}

.footer-social-link:hover {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.28);
  background-color: rgba(255, 255, 255, 0.06);
}

@media screen and (max-width: 991px) {
  .footer-flex.footer-flex--dense {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 40px;
  }

  .footer-column--brand {
    grid-column: 1 / -1;
    max-width: none;
  }
}

@media screen and (max-width: 767px) {
  .footer-flex.footer-flex--dense {
    grid-template-columns: 1fr;
  }

  .footer-social {
    justify-content: flex-start;
    margin-top: 0.5rem;
  }
}

/* ────────────────────────────────────────────────────────────────────
   The Webflow snapshot references "Space Grotesk" and "Inter" but never
   declared them, so every heading fell back to Verdana. The woff2 files
   already ship in /homepage/assets — declare them here so every page
   that loads this sheet (homepage, service pages, pricing, contact)
   gets the real faces.
   ──────────────────────────────────────────────────────────────────── */
@font-face {
  font-family: "Space Grotesk";
  src: url("assets/d4f6b8a0_6a60ea61e927309ec832acb7_space-grotesk-v22-latin-regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Space Grotesk";
  src: url("assets/03181f0c_6a60ea613b4a06b75a12c164_space-grotesk-v22-latin-500.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Space Grotesk";
  src: url("assets/1550a5d9_6a60ea61deb8ffc202dca303_space-grotesk-v22-latin-600.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Space Grotesk";
  src: url("assets/438b8fb3_6a60ea6138da86d3b87505de_space-grotesk-v22-latin-700.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("assets/3215e4f7_6a60e980b5be50bb72eb23a1_inter-v20-latin-300.woff2") format("woff2");
  font-weight: 300; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("assets/011f11ec_6a60e9803b4a06b75a129990_inter-v20-latin-regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("assets/290c2105_6a60e980e927309ec83290ee_inter-v20-latin-500.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("assets/a4eab093_6a60e980e927309ec83290f3_inter-v20-latin-600.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("assets/6f70cbae_6a60e98044ac19e61514d3c8_inter-v20-latin-700.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}
