/* home.css — styles used only by the homepage (public/index.html).
   Loaded after components.css. Moved out of inline <style> blocks in Package B1 (2026-09-24);
   shared components belong in components.css, tokens in style.css. */

/* ---- from index.html <head> ---- */
/* ================================================================
   HIGHLIGHT + KI DIMENSION TOKENS
   ================================================================ */
:root, [data-theme="light"] {
  /* --color-highlight* and --color-copper-text come from style.css (#9C5A28, AA as text and with white) */

  /* Management Icon */
  --color-mgmt-bg:         #f0f4f0;
  --color-mgmt-text:       #3a5a3a;

  /* Erfolg / Buchung */
  --color-success:         #437a22;
  --color-success-hover:   #366119;
}
[data-theme="dark"] {
  /* --color-highlight* kommen zentral aus style.css */

  --color-mgmt-bg:         #1a2a1a;
  --color-mgmt-text:       #7ab87a;

  --color-success:         #5a9e2f;
  --color-success-hover:   #4a8626;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    /* --color-highlight* kommen zentral aus style.css */

    --color-mgmt-bg:         #1a2a1a;
    --color-mgmt-text:       #7ab87a;

    --color-success:         #5a9e2f;
    --color-success-hover:   #4a8626;
  }
}

/* About: the portrait now lives in the dial; without the grid the text needs a readable line length */
#about .about__text { max-width: 46em; }


/* Homepage-only: no hover shadow on sticky-bar buttons — the fixed bar
   already has its own border-top for separation, an added shadow looks
   busy there. Not moved into components.css because that rule also
   reaches the sticky bar on subpages, where the shadow is fine. */
.sticky-cta .ph-btn,
.sticky-cta .ph-btn--outline { box-shadow: none; }

/* ---- mini-case responsive (was inline after #story) ---- */
@media (max-width: 600px) { .mini-case__meta { grid-template-columns: 1fr !important; } .mini-case__meta span:nth-child(odd) { margin-top: var(--space-3); } }

/* ---- social wall (was inline in #references) ---- */
.social-wall { columns: 3; column-gap: var(--space-5); }
.sw-card {
  break-inside: avoid;
  margin-bottom: var(--space-5);
  padding: var(--space-6);
  border-radius: var(--radius-lg);
  transition: box-shadow 0.25s, border-color 0.25s, transform 0.25s;
}
.sw-card--article {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
}
.sw-card--article:hover {
  box-shadow: var(--shadow-md);
  border-color: rgba(200,121,65,0.4);
  transform: translateY(-2px);
}
.sw-card--article a {
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.sw-card__badge {
  font-size: var(--text-xs); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--color-copper-text); background: var(--color-highlight-tint);
  border: 1px solid var(--color-highlight);
  padding: 2px 8px; border-radius: 3px; align-self: flex-start;
}
.sw-card__title {
  font-size: var(--text-base); font-weight: 600; color: var(--color-text); line-height: 1.35;
}
.sw-card__excerpt {
  font-size: var(--text-base); color: var(--color-text-muted); line-height: 1.6;
}
.sw-card__link {
  font-size: var(--text-sm); font-weight: 600; color: var(--color-copper-text); letter-spacing: 0.02em;
}
.social-wall__footer {
  display: flex; justify-content: center; gap: var(--space-6);
  margin-top: var(--space-8); flex-wrap: wrap;
}
.social-wall__footer a {
  font-size: var(--text-sm); font-weight: 600; color: var(--color-copper-text);
  text-decoration: none; letter-spacing: 0.02em;
  display: inline-flex; align-items: center; gap: 6px; transition: color 0.2s;
}
.social-wall__footer a:hover { color: var(--color-highlight-hover); }
@media (max-width: 900px) { .social-wall { columns: 2; } }
@media (max-width: 550px) { .social-wall { columns: 1; } }

/* ---- former style="" attributes (Package B1) ---- */
#story { padding:var(--section-y) 0;background:var(--color-surface); }
#story .story__inner { max-width:800px;margin:0 auto; }
#story .story__head { display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-6); }
#story .story__label { color:var(--color-text-muted);margin:0; }
#story .story__tag { font-size:var(--text-xs);font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color: var(--color-copper-text);background:var(--color-highlight-tint);border:1px solid var(--color-highlight);padding:2px 8px;border-radius:3px; }
#story .story__title { margin-bottom:var(--space-8);color:var(--color-text); }
#story .mini-case__meta { display:grid;grid-template-columns:200px 1fr;gap:var(--space-3) var(--space-8);margin-bottom:var(--space-8);font-size:var(--text-sm); }
#story .mini-case__key { font-weight:700;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:0.06em;font-size:var(--text-xs); }
#story .mini-case__value { color:var(--color-text); }
#story .story__body { font-size:var(--text-lg);line-height:1.75;color:var(--color-text); }
#story .story__body-next { margin-top:var(--space-5); }
#story .story__impact { margin-top:var(--space-8);padding:var(--space-6);background:var(--color-surface-2);border-left:3px solid var(--color-highlight);border-radius:0 8px 8px 0; }
#story .story__impact-text { font-size:var(--text-base);color:var(--color-text);font-style:italic;line-height:1.7;margin:0; }
#story .story__note { margin-top:var(--space-6);font-size:var(--text-base);color:var(--color-text-muted);line-height:1.65;border-top:1px solid var(--color-border);padding-top:var(--space-5); }
.container.cta-riegel-wrap { padding-top:var(--space-8);padding-bottom:var(--space-8); }
#about .about__links { margin-top:var(--space-6);display:flex;gap:var(--space-4);flex-wrap:wrap;align-items:center; }
#references .ref-card__tag { display:inline-block;font-size:var(--text-xs);font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color: var(--color-copper-text);background:var(--color-highlight-tint);border:1px solid var(--color-highlight);padding:2px 8px;border-radius:3px;margin-bottom:var(--space-3); }
#insights { padding:var(--section-y) 0;background:var(--color-bg); }
#insights .insights__header { text-align:center;margin-bottom:var(--space-10);position:relative; }
#insights .insights__label { color:var(--color-text-muted);margin-bottom:var(--space-3); }
#insights .insights__title { color:var(--color-text); }
#insights .insights__intro { font-size:var(--text-base);color:var(--color-text-muted);line-height:1.6;max-width:560px;margin:var(--space-4) auto 0; }

/* ---- contact band: the homepage's link to /kontakt/ (Package C1) ---- */
.contact-band { padding-block: var(--section-y); background: var(--color-bg); }
.contact-band__inner { text-align: center; }
.contact-band .section-intro { max-width: 620px; margin-inline: auto; }
.contact-band__ctas { display: flex; gap: var(--space-6); justify-content: center; align-items: center; flex-wrap: wrap; margin-top: var(--space-8); }
