/*
Theme Name: Hufendiek KI Article Theme
Author: OpenAI
Version: 1.1
Description: KI- und SEO-optimiertes WordPress-Theme mit Fokus auf Artikelseiten für Kanzlei-Inhalte.
*/

:root{
  --ink:#0f0f0d;
  --ink-soft:#3a3a35;
  --ink-muted:#8a8a80;
  --paper:#f5f2eb;
  --paper-warm:#ede9df;
  --gold:#b8933e;
  --accent:#1a3a2e;
  --accent-light:#2d5c47;
  --rule:rgba(15,15,13,.12);
  --content:780px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:16px/1.8 Georgia, "Times New Roman", serif;
}

a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}

.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(245,242,235,.94);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--rule);
}

.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
.header-inner{
  min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px;
}

.brand{
  color:var(--ink);
  font-size:24px;
  font-weight:700;
  letter-spacing:.02em;
}
.brand span{color:var(--gold)}

.top-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:24px}
.top-nav a{
  color:var(--ink-soft);
  font:500 13px/1.2 Arial, Helvetica, sans-serif;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.article-hero{
  padding:70px 0 26px;
  border-bottom:1px solid var(--rule);
  background:linear-gradient(to bottom,var(--paper),var(--paper-warm));
}

.article-shell{max-width:var(--content);margin:0 auto;padding:0 24px}
.eyebrow{
  color:var(--gold);
  font:600 12px/1.2 Arial, Helvetica, sans-serif;
  letter-spacing:.18em;
  text-transform:uppercase;
  margin-bottom:18px;
}

.entry-title{
  margin:0 0 18px;
  font-size:clamp(38px,5vw,64px);
  line-height:1.05;
  font-weight:700;
  color:var(--ink);
}

.entry-meta{
  display:flex;flex-wrap:wrap;gap:14px 18px;
  color:var(--ink-muted);
  font:400 14px/1.5 Arial, Helvetica, sans-serif;
  padding-bottom:8px;
}

.article-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 290px;
  gap:56px;
  padding:48px 24px 96px;
  max-width:1160px;
  margin:0 auto;
}

.article-main{min-width:0}

.featured-image{
  margin:0 0 28px;
  border:1px solid var(--rule);
  background:#fff;
}
.featured-image img{display:block;width:100%;height:auto}

.entry-content{
  font-size:19px;
  color:var(--ink-soft);
}
.entry-content > *:first-child{margin-top:0}
.entry-content p{margin:0 0 1.25em}
.entry-content h2,
.entry-content h3,
.entry-content h4{
  color:var(--ink);
  line-height:1.2;
  margin:1.8em 0 .55em;
  font-weight:700;
}
.entry-content h2{font-size:34px}
.entry-content h3{font-size:28px}
.entry-content h4{font-size:22px}
.entry-content ul,
.entry-content ol{margin:0 0 1.5em 1.4em;padding:0}
.entry-content blockquote{
  margin:2em 0;
  padding:20px 24px;
  border-left:4px solid var(--gold);
  background:#fff;
  color:var(--ink);
  font-style:italic;
}
.entry-content .wp-block-image,
.entry-content figure{margin:2em 0}

.toc{
  margin:0 0 30px;
  padding:20px 22px;
  border:1px solid var(--rule);
  background:#fff;
  font:400 15px/1.7 Arial, Helvetica, sans-serif;
}
.toc h2{
  margin:0 0 12px;
  font-size:18px;
  color:var(--ink);
  font-family:Arial, Helvetica, sans-serif;
}
.toc ol{margin:0 0 0 18px;padding:0}

.faq-box{
  margin:42px 0 0;
  border-top:1px solid var(--rule);
  padding-top:28px;
}
.faq-box h2{margin-top:0}
.faq-item{
  border-bottom:1px solid var(--rule);
  padding:16px 0;
}
.faq-item strong{
  display:block;
  color:var(--ink);
  margin-bottom:6px;
  font-family:Arial, Helvetica, sans-serif;
}

.article-sidebar{
  font:400 15px/1.7 Arial, Helvetica, sans-serif;
}
.sidebar-card{
  background:#fff;
  border:1px solid var(--rule);
  padding:24px;
  margin-bottom:18px;
}
.sidebar-card h3{
  margin:0 0 12px;
  font-size:18px;
  color:var(--ink);
}
.sidebar-card ul{padding-left:18px;margin:0}
.sidebar-card p{margin:0}

.post-taxonomies{
  border-top:1px solid var(--rule);
  margin-top:40px;
  padding-top:22px;
  font:400 14px/1.7 Arial, Helvetica, sans-serif;
  color:var(--ink-muted);
}

.post-navigation{
  display:flex;justify-content:space-between;gap:18px;
  border-top:1px solid var(--rule);
  margin-top:40px;
  padding-top:28px;
  font:500 14px/1.6 Arial, Helvetica, sans-serif;
}
.post-navigation a{
  display:block;
  max-width:48%;
  color:var(--ink);
}

.related-posts{
  margin-top:48px;
  padding-top:32px;
  border-top:1px solid var(--rule);
}
.related-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.related-card{
  background:#fff;
  border:1px solid var(--rule);
  padding:18px;
}
.related-card h3{
  margin:0 0 8px;
  font-size:20px;
  line-height:1.25;
}
.related-card .meta{
  color:var(--ink-muted);
  font:400 13px/1.5 Arial, Helvetica, sans-serif;
  margin-bottom:8px;
}

.site-footer{
  border-top:1px solid var(--rule);
  padding:26px 0 40px;
  color:var(--ink-muted);
  font:400 13px/1.6 Arial, Helvetica, sans-serif;
}

.archive-list article{
  padding:24px 0;
  border-bottom:1px solid var(--rule);
}
.archive-list h2{margin:0 0 8px}
.archive-meta{
  color:var(--ink-muted);
  font:400 14px/1.5 Arial, Helvetica, sans-serif;
  margin-bottom:10px;
}

@media (max-width: 920px){
  .article-layout{grid-template-columns:1fr;gap:32px}
  .top-nav{display:none}
}

@media (max-width: 680px){
  .entry-title{font-size:clamp(32px,10vw,48px)}
  .entry-content{font-size:18px}
  .related-grid{grid-template-columns:1fr}
  .post-navigation{flex-direction:column}
  .post-navigation a{max-width:none}
}