/*
Theme Name:   Happy Friday Child Theme
Theme URI:    https://happyfriday.geyer-marketing.de
Description:  Blanko-Child-Theme für die Happy Friday Förderpunkte-Aktion.
              Basiert auf Kadence (klassisches Theme, kein FSE/Block-Editor).
              Hintergrund, Menüs, Farben und Logo sind unabhängig vom Plugin
              über den WordPress-Customizer oder diese style.css anpassbar.
Author:       WIRmachenDRUCK GmbH
Author URI:   https://www.wir-machen-druck.de
Template:     kadence
Version:      1.1.0
Text Domain:  happyfriday-child
*/

/* ═══════════════════════════════════════════════════════════
   1. GLOBALE DESIGN-TOKENS – hier zentral anpassen
   ═══════════════════════════════════════════════════════════ */
:root {
  --hf-bg:           #ffffff;
  --hf-text:         #1a1a1a;
  --hf-accent:       #e8a33d;
  --hf-nav-bg:       #1a1a1a;
  --hf-nav-text:     #ffffff;
  --hf-header-bg:    #ffffff;
  --hf-font:         'Inter', Arial, sans-serif;
}

/* ═══════════════════════════════════════════════════════════
   2. SEITEN-LAYOUT
   ═══════════════════════════════════════════════════════════ */
html, body {
  margin: 0; padding: 0;
  background: var(--hf-bg);
  color: var(--hf-text);
  font-family: var(--hf-font);
}

/* Kadence-eigene Container zurücksetzen, damit Plugin-Content voll breitet */
.entry-content,
.wp-block-post-content,
.kadence-blocks-pro-container,
#content .entry-content {
  padding: 0 !important;
  margin: 0 !important;
  max-width: 100% !important;
}

/* Kadence: keine site-padding auf der Plugin-Seite */
.site-container,
.content-area,
.site-content {
  padding: 0 !important;
}

/* ═══════════════════════════════════════════════════════════
   3. HEADER – CMYK-Ecke + Logo-Bereich
   ═══════════════════════════════════════════════════════════ */
.hf-site-header {
  position: relative;
  background: var(--hf-header-bg);
  overflow: hidden;
}

.hf-cmyk-svg {
  position: absolute;
  top: 0; left: 0;
  width: 68px;
  height: auto;
  z-index: 10;
  pointer-events: none;
  display: block;
}

.hf-logo-area {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 10px 28px 10px 90px;
  min-height: 52px;
  background: var(--hf-header-bg);
}
.hf-logo-area img {
  max-height: 40px;
  width: auto;
  display: block;
}
.hf-logo-area .hf-site-title {
  font-family: var(--hf-font);
  font-size: 18px;
  font-weight: 800;
  color: var(--hf-text);
  text-decoration: none;
  letter-spacing: -0.3px;
}
.hf-logo-area .hf-site-title strong { color: var(--hf-accent); }

/* ═══════════════════════════════════════════════════════════
   4. NAVIGATION (klassisch, Customizer-gesteuert)
   ═══════════════════════════════════════════════════════════ */
.hf-nav {
  background: var(--hf-nav-bg);
  padding: 0 28px;
}
.hf-nav ul {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap;
}
.hf-nav ul li a {
  display: block;
  padding: 12px 16px;
  color: var(--hf-nav-text);
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  font-family: var(--hf-font);
  transition: background .15s;
}
.hf-nav ul li a:hover,
.hf-nav ul li.current-menu-item > a {
  background: rgba(255,255,255,.12);
}
@media (max-width: 640px) {
  .hf-logo-area { padding: 10px 16px 10px 80px; }
  .hf-nav { padding: 0 8px; }
  .hf-nav ul li a { padding: 10px; font-size: 12px; }
}

/* ═══════════════════════════════════════════════════════════
   5. Kadence-eigenen Header/Footer ausblenden
      (wir nutzen unseren eigenen, per functions.php)
   ═══════════════════════════════════════════════════════════ */
.site-header,
#masthead,
.kadence-site-header,
header.site-header { display: none !important; }

.site-footer,
#colophon,
.kadence-site-footer,
footer.site-footer { display: none !important; }

/* Tagline ausblenden */
.site-description { display: none !important; }