/* Dunkler Kopfbereich als "Bühne" auf Startseite, Unternehmen und Privat (Oktober 2026) */
.start.dunkel{background:radial-gradient(120% 90% at 78% 30%, #2a1c16 0%, #111 62%); color:var(--creme)}
.start.dunkel h1,.start.dunkel p,.start.dunkel .unterzeile,.start.dunkel .gross{color:var(--creme)}
.start.dunkel .schild,.start.dunkel .ritual,.start.dunkel .hero-weg .schild{color:var(--rot); font-weight:800}
.start.dunkel .schild .idx{color:var(--creme)}
.start.dunkel a:not(.knopf){color:var(--rot); font-weight:700}
.start.dunkel .datenzeile .marke,.start.dunkel .hero-archiv-label,.start.dunkel .hero-weg-mehr,.start.dunkel .hero-liebe-mehr{color:var(--creme)}
.start.dunkel .datenzeile{border-color:rgba(242,227,196,.28)}
.start.dunkel .geraet{box-shadow:0 0 0 1px rgba(242,227,196,.14), 0 30px 80px -20px rgba(227,69,84,.28)}
.start.dunkel .hero-weg{background:rgba(242,227,196,.07); border-color:rgba(242,227,196,.22); color:var(--creme)}
.start.dunkel .hero-archiv{background:rgba(242,227,196,.07); border-color:rgba(242,227,196,.22)}
.start.dunkel .teilen-knopf{color:var(--creme); border-color:rgba(242,227,196,.4)}
.start.dunkel .hero-liebe-text{color:var(--rot)}
.start.dunkel .hero-liebe-klein{border-top-color:rgba(242,227,196,.22)}
.start.dunkel .geraet .leiste{padding:13px 6px 15px; color:var(--creme); flex-wrap:nowrap; letter-spacing:.16em} .start.dunkel .geraet .leiste > span{white-space:nowrap; display:inline-flex; align-items:center} .start.dunkel .geraet .leiste{border-top:1px solid rgba(242,227,196,.16); margin-top:11px}
.start.dunkel .geraet .leiste > span:first-child{color:#ff4d5e; font-weight:800; text-shadow:0 0 6px rgba(255,60,80,.8)} .start.dunkel .geraet .leiste > span:last-child{color:rgba(242,227,196,.92)} .start.dunkel .geraet .leiste .lampe{width:9px;height:9px;background:radial-gradient(circle at 35% 35%,#ffb3ba,var(--rot) 45%,var(--rot-text)); box-shadow:0 0 10px 3px rgba(255,60,80,.75)}
.start.dunkel{margin:22px auto 0; width:calc(100% - 2*var(--rand)); max-width:calc(var(--breite) + 120px); border-radius:28px; box-shadow:0 30px 60px -30px rgba(17,17,17,.6)}
@media (max-width:699px){.start.dunkel{width:calc(100% - 20px); border-radius:20px; margin-top:14px} .start.dunkel .huelle{padding:0 16px}}
@media (max-width:420px){.start.dunkel .geraet .leiste{letter-spacing:.1em; font-size:9px}}
.start.dunkel h1{font-size:clamp(1.75rem,4.4vw,2.75rem)}
.start.dunkel .datenzeile li{border-right-color:rgba(242,227,196,.28)}
@media (min-width:520px){
  .start.dunkel .datenzeile{display:grid; grid-template-columns:repeat(3,auto); justify-content:start; gap:18px 0}
  .start.dunkel .datenzeile li{padding:0 clamp(20px,2.6vw,34px); border-right:1px solid rgba(242,227,196,.28)}
  .start.dunkel .datenzeile li:nth-child(3n+1){padding-left:0}
  .start.dunkel .datenzeile li:nth-child(3n),.start.dunkel .datenzeile li:last-child{border-right:none}
}
@media (max-width:699px){
  .start.dunkel .huelle{grid-template-columns:minmax(0,1fr)}
  .start.dunkel .huelle > *,.start.dunkel .start-kopf > *{min-width:0}
  .start.dunkel h1 span{white-space:normal !important}
  .start.dunkel .ritual{letter-spacing:.14em}
}
@media (max-width:699px){.schrift-gross .start.dunkel .geraet .leiste{flex-wrap:wrap; row-gap:6px}}
@media (max-width:699px){
  .start.dunkel h1{font-size:27px !important}
  main h2{font-size:23px}
}