/* =========================================================
   Klivanta — Design System
   Misma paleta y tipografía que recetas-gratis.html/css:
   verde oliva + terracota + crema, Playfair Display + Inter.
   ========================================================= */

:root {
  --klv-primary: #4a5c3a;
  --klv-primary-dark: #3a4a2d;
  --klv-terracotta: #c4603a;
  --klv-terracotta-dark: #a84f2f;

  --klv-bg: #faf8f4;
  --klv-bg-soft: #eef0e3;
  --klv-bg-terracotta: #f8ebe3;
  --klv-text: #1a1a1a;
  --klv-text-secondary: #6b7280;
  --klv-border: #e5e0d8;
  --klv-white: #ffffff;

  --klv-font-heading: 'Playfair Display', Georgia, serif;
  --klv-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --klv-radius-card: 16px;
  --klv-radius-control: 8px;
  --klv-shadow-card: 0 2px 8px rgba(26, 26, 26, 0.06);
  --klv-shadow-button: 0 4px 12px rgba(74, 92, 58, 0.25);
}

body {
  font-family: var(--klv-font-body);
  color: var(--klv-text);
  background-color: var(--klv-bg);
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.site-title {
  font-family: var(--klv-font-heading);
  font-weight: 800;
  color: var(--klv-text);
}

a {
  color: var(--klv-primary);
}

a:hover {
  color: var(--klv-primary-dark);
}

/* ===================== HEADER ===================== */

.site-header {
  background-color: var(--klv-primary) !important;
  border-bottom: none;
}

.site-header .site-title a,
.site-header .site-title a:hover {
  font-family: var(--klv-font-heading);
  font-weight: 800;
  color: #ffffff;
}

.site-logo img,
.custom-logo-link img,
img.header-image {
  max-height: 48px;
  width: auto;
  height: auto;
}

.site-branding-container {
  display: flex;
  align-items: center;
}

/* El logo ya incluye el wordmark "Klivanta" — ocultamos el texto duplicado del título */
.wp-custom-logo .site-branding-container .main-title {
  display: none;
}

.site-header .site-description {
  color: rgba(255, 255, 255, 0.75);
}

.main-navigation,
.main-navigation .inside-navigation {
  background-color: transparent;
}

.main-navigation a {
  color: #ffffff;
  font-weight: 600;
  font-family: var(--klv-font-body);
}

.main-navigation a:hover {
  color: var(--klv-terracotta);
}

/* ===================== BOTONES ===================== */

.klv-button,
.wp-block-button__link,
button[type="submit"],
input[type="submit"] {
  display: inline-block;
  padding: 14px 28px;
  font-family: var(--klv-font-body);
  font-size: 15px;
  font-weight: 700;
  color: #ffffff;
  background-color: var(--klv-primary);
  border: none;
  border-radius: var(--klv-radius-control);
  box-shadow: var(--klv-shadow-button);
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.15s ease, transform 0.15s ease;
}

.klv-button:hover,
.wp-block-button__link:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
  background-color: var(--klv-primary-dark);
  color: #ffffff;
  transform: translateY(-1px);
}

.klv-button--secondary {
  background-color: var(--klv-terracotta);
  box-shadow: 0 4px 12px rgba(196, 96, 58, 0.28);
}

.klv-button--secondary:hover {
  background-color: var(--klv-terracotta-dark);
}

/* ===================== TARJETAS ===================== */

.klv-card {
  background-color: var(--klv-white);
  border: 1px solid var(--klv-border);
  border-radius: var(--klv-radius-card);
  box-shadow: var(--klv-shadow-card);
  padding: 24px;
}

/* ===================== BLOG / ENTRADAS ===================== */

.entry-content a {
  color: var(--klv-primary);
  font-weight: 600;
}

.entry-meta,
.entry-meta a {
  color: var(--klv-text-secondary);
}

/* ===================== FOOTER ===================== */

.site-footer,
.site-footer a {
  background-color: var(--klv-bg-soft);
  color: var(--klv-text-secondary);
}