/* Nur die Startseite: aufklappbare Navigation und anklickbare Themenkarten. */
header{flex-wrap:nowrap;position:relative;z-index:10}header .brand{min-width:0;line-height:1.5}#home-navigation{position:relative;flex:0 0 auto;margin-left:auto}#home-navigation summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;padding:12px 16px;border:1px solid var(--line);border-radius:3px;background:var(--bg);color:var(--ink);font-size:13px;min-height:46px;user-select:none}#home-navigation summary::-webkit-details-marker{display:none}#home-navigation summary span{color:var(--lime);font-size:20px;line-height:1}#home-navigation[open] summary span{transform:rotate(180deg)}#home-navigation summary:focus-visible{outline:2px solid var(--lime);outline-offset:4px}header #home-navigation #main-menu{position:absolute;right:0;top:calc(100% + 10px);display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;flex-wrap:nowrap;gap:0;width:210px;max-width:calc(100vw - 32px);margin:0;padding:7px;background:var(--panel);border:1px solid var(--line);border-radius:3px;box-shadow:0 14px 35px #0009;font-size:14px}#home-navigation:not([open]) #main-menu{display:none}header #home-navigation #main-menu a{display:block;min-height:46px;padding:13px 15px;white-space:normal;overflow-wrap:anywhere}header #home-navigation #main-menu a:hover,header #home-navigation #main-menu a:focus-visible{background:#1c2a31;color:var(--lime)}.grid>a.card{display:block;cursor:pointer;color:inherit}.grid>a.card:focus-visible{outline:2px solid var(--lime);outline-offset:4px;border-color:var(--lime)}
@media(max-width:440px){header{gap:12px;padding-inline:20px}header .brand{font-size:10px;max-width:210px}#home-navigation summary{padding-inline:12px;gap:10px}}

/* Typografischer Schriftzug als eindeutiger Seitentitel, ohne zusätzliches Symbol. */
header .site-title{display:flex;flex-direction:column;align-items:flex-start;gap:3px;max-width:none;font-family:Manrope,'DM Sans',sans-serif;font-weight:600;line-height:1.12;letter-spacing:-.035em;padding:4px 0}header .site-title .title-top{font-size:clamp(19px,2.3vw,29px);color:var(--ink)}header .site-title .title-bottom{font-size:clamp(19px,2.3vw,29px);color:var(--lime)}
@media(max-width:440px){header .site-title{max-width:calc(100% - 100px);gap:4px}header .site-title .title-top,header .site-title .title-bottom{font-size:clamp(18px,5.1vw,22px);white-space:nowrap}}

/* Ausgewogene Abstände nur auf der Startseite; besonders für schmale Displays. */
#entdecken{padding-top:56px;padding-bottom:28px}.thought{margin:0;padding:26px 0}.thought p{margin-bottom:0}.footer{padding:24px 0}
@media(max-width:800px){.hero{padding-top:28px}.heroart{margin-bottom:8px}#entdecken{padding-top:24px;padding-bottom:24px}.thought{padding:24px 0}.footer{padding:24px 0}}

/* Gewünschte quadratische Menütaste mit abgerundeten Ecken und drei Linien. */
#home-navigation summary{width:48px;height:48px;min-height:48px;padding:0;border-radius:10px;justify-content:center;gap:0}#home-navigation .menu-bars{display:block;flex:none;color:var(--ink)}#home-navigation summary:hover,#home-navigation[open] summary{border-color:var(--lime);background:var(--panel)}

/* Kleineren Übergang zwischen Einführung und Themenkarten schaffen. */
#entdecken>.sectiontop{margin-bottom:20px}#entdecken>.sectiontop p{margin-bottom:0}
