/* ==========================================================================
   Farbschema "Pfotenhilfe" – Blau/Grün der bisherigen Website,
   modernisiert. Überschreibt die Variablen aus herzpfote.css.
   ========================================================================== */
:root {
  /* Primär – Pfotenhilfe-Blau (#42b0e2, leicht vertieft für Kontrast) */
  --terracotta: #2b9fd9;
  --terracotta-dark: #1d7fb3;
  --terracotta-light: #6cc6ee;

  /* Sekundär – Pfotenhilfe-Grün (#a3d256) */
  --honey: #8fc33f;
  --honey-dark: #6fa12b;
  --honey-light: #bfe08a;

  /* Akzent – sattes Grün für "ja"/Glückspilz */
  --sage: #3aa66b;
  --sage-dark: #2d8454;
  --sage-light: #7fcba0;

  /* Neutrals – kühles Dunkelblau statt Braun */
  --charcoal: #22304a;
  --warm-gray: #5f6b7a;
  --soft-gray: #9aa5b1;
  --sand: #eef3f7;
  --cream: #f6f9fb;
  --white: #ffffff;

  /* Akzentfarben */
  --rose: #e05a6d;
  --lavender: #6b7fd0;
  --sky: #42b0e2;

  /* Gradienten */
  --gradient-warmth: linear-gradient(135deg, #2b9fd9 0%, #8fc33f 100%);
  --gradient-sunset: linear-gradient(135deg, #6cc6ee 0%, #bfe08a 50%, #7fcba0 100%);
  --gradient-memorial: linear-gradient(135deg, #6b7fd0 0%, #6cc6ee 100%);

  /* Typografie – Fira Sans (bisherige Headline-Schrift) + Inter */
  --font-display: 'Fira Sans', 'Segoe UI', Arial, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --shadow-sm: 0 1px 3px rgba(34, 48, 74, 0.06);
  --shadow: 0 4px 16px rgba(34, 48, 74, 0.08);
  --shadow-lg: 0 12px 40px rgba(34, 48, 74, 0.12);
  --shadow-xl: 0 20px 50px rgba(34, 48, 74, 0.15);
}

/* Fira Sans ist eine Sans – Headlines brauchen Gewicht */
h1, h2, h3, h4, h5, h6,
.hero-small__title, .hero-split__title, .hero-fullwidth__title,
.section-title h2, .cinema-hero__title, .cinema-section-title,
.sidebar-widget__title, .pillar-card__title, .footer-col h4,
.animal-card__name, .news-card__title, .news-portrait-card__title,
.team-member__name, .partner-card__name {
  font-weight: 600;
  letter-spacing: -0.01em;
}
body { background-image: none; }
::selection { background: var(--terracotta-light); color: var(--white); }

/* Reveal-Animationen nur mit JS; ohne JS (oder ?ph_noanim=1) ist alles sofort sichtbar */
html:not(.js) [data-reveal], html.no-anim [data-reveal] { opacity: 1 !important; transform: none !important; transition: none !important; }
html.no-anim * { animation: none !important; transition: none !important; }