/*
Theme Name: Christoph Alexander Verlag
Theme URI: https://christoph-alexander.com
Description: Child theme of GeneratePress for the Christoph Alexander Verlag shop. Layout grid, header/footer hooks, brand tokens, WooCommerce template overrides. All custom functionality lives in the cav-core plugin.
Author: Christoph Alexander Verlag
Template: generatepress
Version: 0.1.0
Text Domain: cav
*/

/* =====================================================================
   1. MARKENSYSTEM — Tokens (VERBINDLICH, Briefing §1)
   Single source of truth for colors, type, radius, shadow, spacing.
   ===================================================================== */
/* The [hidden] attribute must always win over component display rules
   (facet popups, overlays, search count, drawers all rely on it). */
[hidden]{ display: none !important; }

:root{
  /* --- Farben (§1.1) --- */
  --cav-navy:            #2A3A52; /* Primär: Headlines, Buttons, Nav, Footer-BG */
  --cav-navy-hover:      #22304a; /* Button-Hover */
  --cav-navy-grad-1:     #34465f; /* Hero-Verlauf hell */
  --cav-navy-grad-2:     #3E5C8A; /* Hero-Verlauf hell 2 */

  --cav-hafer:           #F4F1E9; /* Seiten-Hintergrund (NIE Weiß als Body) */
  --cav-hafer-2:         #F7F4EC; /* Input-Felder, leichte Flächen */

  --cav-ink:             #33322E; /* Anthrazit — Fließtext primär */
  --cav-ink-2:           #5C574F; /* Anthrazit-2 — Fließtext sekundär */
  --cav-warm:            #8C8882; /* Warmgrau — Meta, Labels, Platzhalter */
  --cav-warm-light:      #C9C4BB; /* Warmgrau-hell — Trenner, Breadcrumb-Slashes */

  --cav-honey:           #D9A441; /* Akzent — SPARSAM */
  --cav-honey-dark:      #B07D1E; /* Honig-Text auf hellem Grund */
  --cav-honey-dark-2:    #C89230;

  --cav-teal:            #2E8B86; /* Sekundär-Akzent: Sofort-PDF, Erfolg, Häkchen */
  --cav-berry:           #8C4A5C; /* Lieber gebunden, Abmelden, dezente Warnung */
  --cav-green:           #7E9070; /* vereinzelt Kategorie-Akzent */

  --cav-white:           #FFFFFF; /* NUR Karten/Objekte */
  --cav-card-border:     rgba(140,136,130,0.18); /* Standard-Border weißer Karten */

  /* --- Typografie (§1.2) --- */
  --cav-font-head: "Fredoka", "Nunito Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --cav-font-body: "Nunito Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Skalen Desktop (§1.2) */
  --cav-fs-h1-hero: 42px; /* 38–44 */
  --cav-fs-h1:      34px;
  --cav-fs-h2:      26px; /* 24–28 */
  --cav-fs-h3:      16px;
  --cav-fs-body:    16px; /* 15–17 */
  --cav-fs-meta:    13px; /* 12.5–13.5 */

  /* --- Form & Abstände (§1.3) --- */
  --cav-radius-card:  20px; /* 18–20 */
  --cav-radius-band:  22px; /* 20–24 */
  --cav-radius-pill:  999px;
  --cav-shadow-card:  0 16px 40px -30px rgba(42,58,82,0.35);
  --cav-shadow-band:  0 24px 54px -30px rgba(42,58,82,0.7);

  --cav-container:    1320px;
  --cav-gutter:       20px;
  --cav-section-gap:  64px;
  --cav-read-max:     820px; /* Lese-Sektionen */

  /* Motion */
  --cav-ease-bounce: cubic-bezier(.34,1.5,.5,1);
}

/* =====================================================================
   2. Oberflächen — nur drei: Hafer (Body), Weiß (Karten), Navy (Bänder)
   ===================================================================== */
html,
body,
body.generate-page{
  background: var(--cav-hafer);
  color: var(--cav-ink);
  font-family: var(--cav-font-body);
  font-size: var(--cav-fs-body);
  line-height: 1.6;
}

/* =====================================================================
   GeneratePress layout override — hand width/layout control to our
   custom templates. Without this GP squeezes content into a sidebar
   column + narrow container.
   ===================================================================== */
.site.grid-container,
.grid-container.container{ max-width:100%; padding-left:0; padding-right:0; width:100%; }
.site-content{ display:block; padding:0; }
#primary.content-area,
.content-area{ width:100% !important; max-width:100%; float:none; }
.widget-area, #right-sidebar, #left-sidebar{ display:none !important; }

/* App templates (home/shop/product/cart/checkout/account): no GP article box. */
.cav-bleed .site-main{ margin:0; padding:0; }
.cav-bleed .inside-article,
.cav-bleed article.post,
.cav-bleed .entry-content{ background:transparent !important; border:0 !important; box-shadow:none !important; padding:0 !important; margin:0 !important; }
.cav-bleed .entry-header{ display:none; }

/* Reading pages (legal, über uns, kontakt, hilfe): our content has its own
   H1/eyebrow — hide GeneratePress's duplicate page-title header. */
body.page.cav-read-page .entry-header{ display:none; }
.cav-read-page .site-main{ max-width: var(--cav-container); margin:24px auto; padding:0 20px; }
.cav-read-page .inside-article{ background:#fff; border:1px solid var(--cav-card-border); border-radius: var(--cav-radius-card); box-shadow: var(--cav-shadow-card); padding:34px 38px; }
.cav-read-page .entry-content{ max-width: var(--cav-read); margin-inline:auto; }
.cav-read-page .entry-content :first-child{ margin-top:0; }

/* Container deckungsgleich mit Nav-Innenkante (§1.3) */
.cav-container{
  max-width: var(--cav-container);
  margin-inline: auto;
  padding-inline: var(--cav-gutter);
  width: 100%;
}
.cav-read{ max-width: var(--cav-read-max); margin-inline: auto; }

/* Headlines: Fredoka, immer einfarbig Navy (§1.2) */
h1,h2,h3,h4,h5,h6,
.cav-head{
  font-family: var(--cav-font-head);
  font-weight: 600;
  color: var(--cav-navy);
  line-height: 1.15;
}
h1{ font-size: var(--cav-fs-h1); }
h2{ font-size: var(--cav-fs-h2); }
h3{ font-size: var(--cav-fs-h3); }

/* Auf Navy-Bändern: Headlines weiß */
.cav-band h1, .cav-band h2, .cav-band h3,
.cav-on-navy h1, .cav-on-navy h2, .cav-on-navy h3,
.cav-on-navy{ color: var(--cav-white); }

/* --- Surfaces --- */
.cav-card{
  background: var(--cav-white);
  border: 1px solid var(--cav-card-border);
  border-radius: var(--cav-radius-card);
  box-shadow: var(--cav-shadow-card);
}
.cav-band{
  background: linear-gradient(135deg, var(--cav-navy), var(--cav-navy-grad-1) 55%, var(--cav-navy-grad-2));
  border-radius: var(--cav-radius-band);
  box-shadow: var(--cav-shadow-band);
  color: var(--cav-white);
}

/* Eyebrow (Honig, sparsam) */
.cav-eyebrow{
  font-family: var(--cav-font-body);
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: var(--cav-fs-meta);
  color: var(--cav-honey-dark);
}
.cav-band .cav-eyebrow{ color: var(--cav-honey); }

/* Meta / sekundär */
.cav-meta{ color: var(--cav-warm); font-size: var(--cav-fs-meta); }
.cav-sub{ color: var(--cav-ink-2); }

/* =====================================================================
   3. Akzent-Helfer (sparsam einsetzen)
   ===================================================================== */
.cav-pill-teal{ background: var(--cav-teal); color:#fff; border-radius: var(--cav-radius-pill); }
.cav-badge-new{ background: var(--cav-teal); color:#fff; }
.cav-badge-bestseller{ background: var(--cav-honey); color: var(--cav-navy); }
.cav-text-berry{ color: var(--cav-berry); }
.cav-text-teal{ color: var(--cav-teal); }

/* =====================================================================
   4. Page-Transition (§2.3) — nur Opacity, damit Sticky/Modal stabil
   ===================================================================== */
@keyframes cav-fade-in{ from{opacity:0;} to{opacity:1;} }
.cav-page-enter{ animation: cav-fade-in .4s ease both; }
@media (prefers-reduced-motion: reduce){
  .cav-page-enter{ animation: none; }
}

/* =====================================================================
   5. Globale Mobile-Regeln (§9, ≤560px) — Headlines runter, Paddings rein,
      kein horizontaler Overflow.
   ===================================================================== */
@media (max-width: 980px){
  :root{ --cav-fs-h1-hero: 34px; --cav-fs-h1: 28px; --cav-fs-h2: 22px; }
}
@media (max-width: 560px){
  :root{ --cav-fs-h1-hero: 28px; --cav-fs-h1: 24px; --cav-fs-h2: 20px; --cav-section-gap: 44px; }
  .cav-card{ padding: 16px !important; }
}
html, body{ overflow-x: clip; }