/* TG Vault v129 – Blog 30-Jahre Dark Elegant
   Ziel:
   - v128-Helligkeit zurücknehmen
   - alle Blogs näher an den edlen 30-Jahre-Look bringen
   - FAQ-Boxen wieder sauber, kompakt und gleichmäßig
   - Autorenprofil hochwertig/dunkel
   - CTA lesbar
*/

:root{
  --tgv-bg-0:#100508;
  --tgv-bg-1:#220911;
  --tgv-bg-2:#3d1020;
  --tgv-wine:#5d1729;
  --tgv-wine-2:#8f2b49;
  --tgv-cream:#fff3dd;
  --tgv-cream-soft:rgba(255,243,221,.78);
  --tgv-cream-muted:rgba(255,243,221,.62);
  --tgv-gold:#d8b15f;
  --tgv-gold-soft:rgba(216,177,95,.28);
  --tgv-line:rgba(216,177,95,.18);
}

/* Gesamte Blogseite wieder dunkel/premium */
html body{
  background:
    radial-gradient(circle at 14% 0%, rgba(216,177,95,.12), transparent 28%),
    radial-gradient(circle at 88% 8%, rgba(181,58,92,.16), transparent 32%),
    linear-gradient(180deg, var(--tgv-bg-1) 0%, var(--tgv-bg-0) 46%, #070304 100%) !important;
  color:var(--tgv-cream) !important;
}

/* Blogbereich zentrieren */
main,
.blog-main,
.blog-page,
.blog-article,
.blog-post,
article{
  color:var(--tgv-cream) !important;
  text-shadow:none !important;
}

main{
  position:relative !important;
  overflow:hidden !important;
}

/* große helle Blöcke entschärfen */
.blog-article,
.blog-post,
article,
.blog-card,
.blog-content,
.post-content,
.article-content,
.guide-content,
[class*="blog" i][class*="content" i],
[class*="article" i][class*="content" i]{
  background:
    radial-gradient(circle at 12% 0%, rgba(216,177,95,.09), transparent 28%),
    linear-gradient(135deg, rgba(255,243,221,.065), rgba(255,243,221,.025)) !important;
  border-color:var(--tgv-line) !important;
  color:var(--tgv-cream) !important;
  box-shadow:0 28px 90px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.055) !important;
}

/* Typografie wie 30-Jahre: edel, klar, nicht beige-verwaschen */
.blog-article h1,
.blog-post h1,
article h1,
.blog-hero h1,
.post-hero h1,
.blog-article-title{
  font-family:Georgia, "Times New Roman", serif !important;
  color:#fff7e8 !important;
  font-size:clamp(2.55rem, 7vw, 5.6rem) !important;
  line-height:.96 !important;
  letter-spacing:-.045em !important;
  text-shadow:0 5px 30px rgba(0,0,0,.30) !important;
  margin-bottom:.35em !important;
}

.blog-article h2,
.blog-post h2,
article h2{
  font-family:Georgia, "Times New Roman", serif !important;
  color:#fff3dd !important;
  font-size:clamp(1.75rem, 3.5vw, 2.85rem) !important;
  line-height:1.08 !important;
  letter-spacing:-.03em !important;
  margin-top:2em !important;
  margin-bottom:.7em !important;
  text-shadow:0 3px 24px rgba(0,0,0,.26) !important;
}

.blog-article h3,
.blog-post h3,
article h3{
  color:#f7dfaf !important;
  font-size:clamp(1.18rem,2vw,1.45rem) !important;
  line-height:1.25 !important;
  margin-top:1.45em !important;
}

.blog-article p,
.blog-post p,
article p,
.blog-article li,
.blog-post li,
article li,
.blog-article small,
.blog-post small,
article small{
  color:var(--tgv-cream-soft) !important;
  text-shadow:none !important;
  line-height:1.75 !important;
}

.blog-article strong,
.blog-post strong,
article strong,
.blog-article b,
.blog-post b,
article b{
  color:#fff7e8 !important;
}

.blog-article a,
.blog-post a,
article a{
  color:#f1d993 !important;
  font-weight:850 !important;
  text-decoration-color:rgba(241,217,147,.42) !important;
}

/* Hero / Introbereiche */
.blog-hero,
.post-hero,
.article-hero,
.guide-hero,
.blog-header,
.article-header,
.post-header{
  position:relative !important;
  overflow:hidden !important;
  border:1px solid var(--tgv-line) !important;
  border-radius:34px !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(216,177,95,.15), transparent 30%),
    radial-gradient(circle at 90% 14%, rgba(181,58,92,.18), transparent 34%),
    linear-gradient(135deg, rgba(93,23,41,.95), rgba(18,6,11,.98)) !important;
  box-shadow:0 34px 110px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.075) !important;
  color:var(--tgv-cream) !important;
}

/* Labels/Pills */
.eyebrow,
.kicker,
.label,
.blog-kicker,
.article-kicker,
[class*="eyebrow" i],
[class*="kicker" i],
[class*="label" i]{
  display:inline-flex !important;
  align-items:center !important;
  gap:.45rem !important;
  min-height:34px !important;
  padding:0 14px !important;
  border-radius:999px !important;
  border:1px solid rgba(216,177,95,.25) !important;
  background:rgba(255,243,221,.075) !important;
  color:#f1d993 !important;
  font-size:.76rem !important;
  font-weight:950 !important;
  letter-spacing:.12em !important;
  text-transform:uppercase !important;
  text-shadow:none !important;
}

/* Tabellen, Listen, Info-Kästen */
.blog-article table,
.blog-post table,
article table{
  color:var(--tgv-cream) !important;
  background:rgba(255,243,221,.045) !important;
  border-color:var(--tgv-line) !important;
}

.blog-article th,
.blog-post th,
article th{
  color:#fff7e8 !important;
  background:rgba(216,177,95,.11) !important;
}

.blog-article td,
.blog-post td,
article td{
  color:var(--tgv-cream-soft) !important;
  border-color:rgba(216,177,95,.13) !important;
}

.info-box,
.callout,
.note,
.facts,
.stats,
.info-grid,
.blog-info,
.article-info,
[class*="info-box" i],
[class*="callout" i]{
  border:1px solid var(--tgv-line) !important;
  border-radius:24px !important;
  background:
    radial-gradient(circle at 92% 0%, rgba(216,177,95,.12), transparent 26%),
    linear-gradient(135deg, rgba(255,243,221,.07), rgba(255,243,221,.03)) !important;
  color:var(--tgv-cream) !important;
  box-shadow:0 18px 58px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.055) !important;
}

/* CTA zu Vault Drops sauber und lesbar */
.blog-vaultdrops-cta,
.tgv-vaultdrops-inline-cta{
  position:relative !important;
  overflow:hidden !important;
  width:min(100%, 980px) !important;
  margin:34px auto !important;
  padding:clamp(22px,3vw,34px) !important;
  border-radius:30px !important;
  border:1px solid rgba(216,177,95,.30) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(216,177,95,.14), transparent 28%),
    radial-gradient(circle at 92% 14%, rgba(181,58,92,.20), transparent 34%),
    linear-gradient(135deg, #521528 0%, #16070c 58%, #32101b 100%) !important;
  box-shadow:0 26px 78px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.075) !important;
  color:var(--tgv-cream) !important;
}

.blog-vaultdrops-cta::after,
.tgv-vaultdrops-inline-cta::after{
  content:"収 集" !important;
  position:absolute !important;
  right:12px !important;
  bottom:-18px !important;
  font-family:Georgia,serif !important;
  font-size:clamp(4rem,10vw,7.5rem) !important;
  line-height:.9 !important;
  color:rgba(255,243,221,.05) !important;
  pointer-events:none !important;
}

.blog-vaultdrops-cta > *,
.tgv-vaultdrops-inline-cta > *{
  position:relative !important;
  z-index:1 !important;
}

.blog-vaultdrops-cta strong,
.tgv-vaultdrops-inline-cta strong{
  display:block !important;
  margin:0 0 10px !important;
  color:#fff7e8 !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:clamp(1.32rem,2.4vw,1.9rem) !important;
  line-height:1.12 !important;
  text-shadow:0 2px 18px rgba(0,0,0,.26) !important;
}

.blog-vaultdrops-cta p,
.tgv-vaultdrops-inline-cta p{
  margin:0 0 18px !important;
  max-width:780px !important;
  color:var(--tgv-cream-soft) !important;
  font-size:1rem !important;
  line-height:1.62 !important;
  font-weight:650 !important;
}

.blog-vaultdrops-cta a,
.tgv-vaultdrops-inline-cta a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:46px !important;
  padding:0 20px !important;
  border-radius:999px !important;
  border:1px solid rgba(216,177,95,.26) !important;
  background:linear-gradient(135deg,#7b1d36,#b53a5c) !important;
  color:#fff8ec !important;
  text-decoration:none !important;
  font-weight:950 !important;
  box-shadow:0 14px 34px rgba(0,0,0,.26) !important;
}

/* FAQ: wieder kompakt, gleichmäßig, dunkel, nicht unförmig */
.tgv-faq-priority,
.faq,
.faq-section,
.blog-faq,
[id*="faq" i],
[class*="faq" i]{
  width:min(100%, 980px) !important;
  max-width:980px !important;
  margin:40px auto 34px !important;
  padding:clamp(22px,3vw,34px) !important;
  border-radius:30px !important;
  border:1px solid rgba(216,177,95,.24) !important;
  background:
    radial-gradient(circle at 92% 0%, rgba(216,177,95,.12), transparent 30%),
    linear-gradient(135deg, rgba(255,243,221,.075), rgba(255,243,221,.032)) !important;
  box-shadow:0 24px 76px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.06) !important;
  color:var(--tgv-cream) !important;
  box-sizing:border-box !important;
}

.tgv-faq-priority > section,
.tgv-faq-priority > div{
  margin:0 !important;
  padding:0 !important;
  width:100% !important;
  max-width:none !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

.tgv-faq-priority h2,
.faq h2,
.faq-section h2,
.blog-faq h2,
[id*="faq" i] h2,
[class*="faq" i] h2{
  margin-top:0 !important;
  color:#fff7e8 !important;
}

details,
.faq-item,
.accordion-item,
[class*="faq" i] article,
[class*="faq" i] li{
  display:block !important;
  width:100% !important;
  box-sizing:border-box !important;
  margin:12px 0 !important;
  padding:16px 18px !important;
  border-radius:20px !important;
  border:1px solid rgba(216,177,95,.16) !important;
  background:rgba(255,243,221,.055) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04) !important;
}

summary,
.faq-question,
[class*="question" i]{
  color:#fff7e8 !important;
  font-weight:950 !important;
  cursor:pointer !important;
}

details p,
.faq-answer,
[class*="answer" i]{
  color:var(--tgv-cream-soft) !important;
  margin-bottom:0 !important;
}

/* Autorenprofil – edel, nicht hell */
.tgv-author-box{
  display:grid !important;
  grid-template-columns:auto 1fr !important;
  gap:18px !important;
  align-items:center !important;
  width:min(100%, 980px) !important;
  margin:34px auto !important;
  padding:24px !important;
  border-radius:28px !important;
  border:1px solid rgba(216,177,95,.24) !important;
  background:
    radial-gradient(circle at 92% 0%, rgba(216,177,95,.12), transparent 28%),
    linear-gradient(135deg, rgba(255,243,221,.07), rgba(255,243,221,.032)) !important;
  box-shadow:0 22px 70px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.06) !important;
  color:var(--tgv-cream) !important;
}

.tgv-author-avatar{
  width:72px !important;
  height:72px !important;
  border-radius:22px !important;
  display:grid !important;
  place-items:center !important;
  background:linear-gradient(135deg,#5d1729,#9b3454) !important;
  color:#fff4df !important;
  font-family:Georgia,serif !important;
  font-size:1.45rem !important;
  font-weight:900 !important;
  box-shadow:0 14px 32px rgba(0,0,0,.24) !important;
}

.tgv-author-box strong{
  display:block !important;
  color:#fff7e8 !important;
  font-size:1.12rem !important;
  margin-bottom:4px !important;
}

.tgv-author-box p{
  margin:.25rem 0 !important;
  color:var(--tgv-cream-soft) !important;
  line-height:1.55 !important;
}

.tgv-author-links{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin-top:10px !important;
}

.tgv-author-links a{
  display:inline-flex !important;
  align-items:center !important;
  min-height:34px !important;
  padding:0 12px !important;
  border-radius:999px !important;
  background:rgba(216,177,95,.10) !important;
  color:#f1d993 !important;
  text-decoration:none !important;
  font-weight:900 !important;
}

/* Sidebar/Related nicht beige ausbrechen lassen */
aside,
.sidebar,
.blog-sidebar,
.related-posts,
.blog-related,
.internal-links,
[class*="related" i],
[class*="sidebar" i]{
  color:var(--tgv-cream) !important;
}

aside > *,
.sidebar > *,
.blog-sidebar > *,
.related-posts > *,
.blog-related > *,
.internal-links > *{
  background:
    linear-gradient(135deg, rgba(255,243,221,.07), rgba(255,243,221,.03)) !important;
  border-color:rgba(216,177,95,.18) !important;
  color:var(--tgv-cream-soft) !important;
}

/* harte Notbremse gegen v128 Hell-CSS */
[style*="background:rgba(255,255,255"],
[style*="background: rgba(255,255,255"],
[style*="background-color:#fff"],
[style*="background-color: #fff"]{
  background:rgba(255,243,221,.055) !important;
  color:var(--tgv-cream) !important;
}

/* Mobile */
@media(max-width:760px){
  .blog-article h1,
  .blog-post h1,
  article h1{
    font-size:clamp(2.2rem,12vw,3.5rem) !important;
  }

  .tgv-author-box{
    grid-template-columns:1fr !important;
  }

  .blog-vaultdrops-cta,
  .tgv-vaultdrops-inline-cta,
  .tgv-faq-priority,
  .faq,
  .faq-section,
  .blog-faq{
    padding:20px !important;
    border-radius:22px !important;
  }

  .blog-vaultdrops-cta a,
  .tgv-vaultdrops-inline-cta a{
    width:100% !important;
  }
}
