/* Brand tokens mapped to Kick theme (tweakcn theme-kick) */
:root {
  --brand-pine: oklch(0.2 0.04 128);
  --brand-pine-dark: oklch(0.12 0 0);
  --brand-cream: oklch(0.98 0 0);
  --brand-gold: oklch(0.75 0.28 128);
  --brand-gold-dark: oklch(0.62 0.24 128);
  --tour-primary: var(--primary, var(--brand-gold));
  --tour-primary-dark: var(--brand-gold-dark);
  --sp-btn-h: 2.75rem;
  --sp-btn-radius: var(--radius, 0.625rem);
  --sp-btn-pad-x: 1.25rem;
  --sp-btn-font: 0.8125rem;
  --sp-mobile-sticky-h: 0px;
  --sp-safe-bottom: env(safe-area-inset-bottom, 0px);
  --sp-card-radius: var(--radius, 0.625rem);
  --sp-border: color-mix(in oklch, var(--foreground, oklch(0.12 0 0)) 8%, transparent);
}

/* Shared mobile CTA system */
.sp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-height: var(--sp-btn-h);
  padding: 0 var(--sp-btn-pad-x);
  border-radius: var(--sp-btn-radius);
  border: 1px solid transparent;
  font-family: inherit;
  font-size: var(--sp-btn-font);
  font-weight: 650;
  letter-spacing: 0.04em;
  line-height: 1.2;
  text-decoration: none !important;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: color-mix(in oklch, var(--primary, var(--brand-gold)) 25%, transparent);
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.12s ease;
}
.sp-btn:active { transform: scale(0.985); }
.sp-btn svg { width: 1.05rem; height: 1.05rem; flex-shrink: 0; }
.sp-btn-block { width: 100%; }
.sp-btn-primary {
  background: var(--primary, var(--brand-gold));
  color: var(--primary-foreground, var(--brand-pine-dark)) !important;
  border-color: transparent;
  box-shadow: var(--shadow-md, 0 8px 20px -14px hsl(130 80% 15% / 0.45));
}
.sp-btn-primary:hover,
.sp-btn-primary:focus-visible {
  filter: brightness(1.04);
  outline: none;
}
.sp-btn-secondary {
  background: transparent;
  color: var(--foreground, var(--brand-pine)) !important;
  border-color: color-mix(in oklch, var(--foreground, var(--brand-pine)) 35%, transparent);
}
.sp-btn-secondary:hover,
.sp-btn-secondary:focus-visible {
  background: var(--secondary, var(--muted));
  border-color: var(--foreground, var(--brand-pine));
  outline: none;
}
.sp-btn-ghost {
  background: transparent;
  color: var(--brand-pine) !important;
  border-color: transparent;
  text-decoration: underline !important;
  text-underline-offset: 0.18em;
  box-shadow: none;
  min-height: 2.25rem;
  padding-left: 0.35rem;
  padding-right: 0.35rem;
}
.sp-btn-icon {
  width: 2.75rem;
  min-width: 2.75rem;
  padding: 0;
}
.touch-target {
  min-height: 2.75rem;
  min-width: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  touch-action: manipulation;
}

/* Sticky enquire bar clearance */
body.has-sp-sticky {
  --sp-mobile-sticky-h: 4.25rem;
}
@media (max-width: 767px) {
  body.has-sp-sticky main {
    padding-bottom: calc(var(--sp-mobile-sticky-h) + var(--sp-safe-bottom) + 1rem) !important;
  }
  body.has-sp-sticky .sp-ft {
    padding-bottom: calc(var(--sp-mobile-sticky-h) + var(--sp-safe-bottom) + 1.25rem);
  }
}

/* Soften primary CTAs (override common amber utilities where loaded) */
.nav-centered-cta,
#back-to-top {
  background: var(--primary, var(--brand-gold)) !important;
  color: var(--primary-foreground, var(--brand-pine-dark)) !important;
  box-shadow: var(--shadow-sm, 0 2px 10px hsl(130 80% 15% / 0.35)) !important;
}

.nav-centered-cta:hover,
#back-to-top:hover {
  background: var(--accent, var(--brand-gold-dark)) !important;
}

.page-home .hero-cta-primary,
.page-home a.bg-gradient-to-r.from-amber-500,
.quick-quote-submit,
.book-submit {
  background: var(--primary, var(--brand-gold)) !important;
  box-shadow: var(--shadow-md, 0 8px 24px hsl(130 80% 15% / 0.35)) !important;
  color: var(--primary-foreground, var(--brand-pine-dark)) !important;
}

.page-home a.border-amber-500,
.page-home button.border-amber-500 {
  border-color: var(--primary, var(--brand-gold)) !important;
  color: var(--foreground, var(--brand-pine)) !important;
}

.page-home a.border-amber-500:hover,
.page-home button.border-amber-500:hover {
  background: var(--secondary, var(--brand-cream)) !important;
}

/* Marquee strip: Kick primary */
.page-home section.py-5.bg-amber-500 {
  background: var(--primary, var(--brand-gold)) !important;
  color: var(--primary-foreground, var(--brand-pine-dark)) !important;
}

body {
  --tour-primary: var(--primary, var(--brand-gold));
  --tour-primary-dark: var(--brand-gold-dark);
  background: var(--background, #fff);
  color: var(--foreground, #111);
  letter-spacing: var(--letter-spacing, -0.01em);
}

/* Remap leftover amber utilities toward Kick primary */
.text-amber-400,
.text-amber-500,
.text-amber-600,
.text-amber-700,
.text-amber-800 {
  color: var(--primary, var(--brand-gold)) !important;
}
.bg-amber-100,
.bg-amber-50,
.from-amber-50 {
  --tw-gradient-from: var(--muted, var(--brand-cream)) !important;
}
.border-amber-100,
.border-amber-500\/30 {
  border-color: color-mix(in oklch, var(--primary, var(--brand-gold)) 35%, transparent) !important;
}
.hover\:text-amber-400:hover,
.hover\:text-amber-700:hover,
.group-hover\:text-amber-700:hover,
.group:hover .group-hover\:text-amber-700 {
  color: var(--accent, var(--brand-gold-dark)) !important;
}
.from-amber-500,
.to-amber-600,
.from-amber-600 {
  --tw-gradient-from: var(--primary, var(--brand-gold)) !important;
  --tw-gradient-to: var(--brand-gold-dark) !important;
}