/**
 * Frontend Global Styles
 * CSS Variables available globally in WordPress frontend
 */
:root {
  /* Color Palette - HSL values from mockups */
  --hr-bistre: hsl(18, 38%, 26%);
  --hr-bistre-hex: #5D372A;
  --hr-vanilla: hsl(48, 100%, 96%);
  --hr-vanilla-hex: #FDF8F3;
  --hr-cal-poly-green: hsl(130, 30%, 21%);
  --hr-cal-poly-green-hex: #26422A;
  --hr-flame: hsl(18, 85%, 55%);
  --hr-flame-hex: #D45A2A;
  --hr-columbia-blue: hsl(211, 100%, 91%);
  --hr-muted-foreground: hsl(18, 20%, 45%);
  --hr-background: hsl(0, 0%, 100%);
  --hr-background-hex: #FFFFFF;
  /* Typography */
  --hr-font-display: 'Bebas Neue', 'Impact', sans-serif;
  --hr-font-display-bold: 'Bebas Neue Bold', 'Impact', sans-serif;
  --hr-font-body: 'Inter', system-ui, sans-serif;
  /* Spacing */
  --hr-section-padding: 5rem 1.5rem;
  --hr-container-max-width: 1200px;
  /* Transitions */
  --hr-transition: all 0.3s ease;
}

/* Override WordPress core block layout margin */
:root :where(.is-layout-constrained) > * {
  margin-block-start: 0 !important;
}

/* Button styles - Verde con hover anaranjado - Aplicado globalmente */
a.hr-btn-primary,
button.hr-btn-primary,
.hr-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 2.5rem;
  background-color: var(--hr-cal-poly-green, #26422A);
  color: var(--hr-vanilla, #FDF8F3);
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-decoration: none;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s ease;
}
a.hr-btn-primary:hover, a.hr-btn-primary:focus,
button.hr-btn-primary:hover,
button.hr-btn-primary:focus,
.hr-btn-primary:hover,
.hr-btn-primary:focus {
  background-color: var(--hr-flame, #D45A2A);
  color: var(--hr-vanilla, #FDF8F3);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  transform: translateY(-2px);
}
a.hr-btn-primary svg,
button.hr-btn-primary svg,
.hr-btn-primary svg {
  transition: transform 0.3s ease;
}
a.hr-btn-primary:hover svg, a.hr-btn-primary:focus svg,
button.hr-btn-primary:hover svg,
button.hr-btn-primary:focus svg,
.hr-btn-primary:hover svg,
.hr-btn-primary:focus svg {
  transform: translateX(4px);
}

/*# sourceMappingURL=frontend.css.map */
