/* Startseite v5: ruhiger Kopf ohne Kennzahlen-Felder, alles auf einer linken Kante.
   Kacheln: Bereichsname groß als Titel, darunter der aktuelle Stand. Wird als letzte Datei geladen. */

/* ---------- Kopf ---------- */
.home-hero.hv5{display:flex;flex-direction:column;justify-content:flex-end;gap:0;padding:4px 0 6px;min-height:0}
.hv5-date{margin:0;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan)}
.hv5-hello{margin:8px 0 0;font:750 clamp(30px,3.4vw,46px)/1.06 var(--font);letter-spacing:-.035em;color:var(--text);overflow-wrap:anywhere}
.hv5-hello span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hv5-quote{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:16px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.hv5-quote .home-thoughts{position:relative;min-height:2.7em;margin:0;font-size:clamp(20px,1.9vw,25px)}
.hv5-quote .home-thoughts .band-it{position:absolute;top:0;left:0;right:0;display:block;margin:0;padding:0;text-align:left;font-family:var(--serif);font-style:italic;font-weight:400;font-size:1em;line-height:1.3;letter-spacing:0;color:var(--text);opacity:0;transform:none;filter:none;text-wrap:balance;transition:opacity .9s var(--ease-out)}
.hv5-quote .home-thoughts .band-it.on{opacity:1}
.hv5-quote .quote-controls{display:flex;gap:4px;opacity:.6;transition:opacity .2s}
.hv5-quote:hover .quote-controls,.hv5-quote .quote-controls:focus-within{opacity:1}

/* ---------- Kacheln ---------- */
.home-dashboard .ht5 .ht-ey{font-size:10px;letter-spacing:.08em;text-transform:none;font-weight:700;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-dashboard .ht5 .ht-t{margin-top:4px;font-size:22px;font-weight:750;letter-spacing:-.02em;line-height:1.1}
.home-dashboard .ht5.big .ht-t{font-size:30px}
.home-dashboard .ht5 .ht-l{margin-top:6px;font-size:12.5px;line-height:1.35;color:#d7e2ec}
.home-dashboard .home-secondary .ht5 .ht-l{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

@media(max-width:760px){
 .home-hero.hv5{padding:0 0 4px}
 .hv5-date{font-size:10.5px;letter-spacing:.12em}
 .hv5-hello{margin-top:5px;font-size:clamp(25px,7vw,30px)}
 .hv5-quote{gap:10px;margin-top:12px;padding-top:10px}
 .hv5-quote .home-thoughts{font-size:17px;min-height:3.9em}
 .hv5-quote .quote-controls{opacity:1}
 .hv5-quote .quote-controls #quote-prev,.hv5-quote .quote-controls #quote-next{display:none}
 .home-dashboard .ht5 .ht-ey{font-size:8.5px}
 .home-dashboard .ht5 .ht-t,.home-dashboard .ht5.big .ht-t{font-size:clamp(17px,4.8vw,20px);margin-top:3px}
 .home-dashboard .ht5 .ht-l,.home-dashboard .home-secondary .ht5 .ht-l{display:-webkit-box;font-size:10.5px;line-height:1.3;margin-top:4px;-webkit-line-clamp:2}
}
@media(max-width:370px){
 .hv5-hello{font-size:23px}
 .hv5-quote .home-thoughts{font-size:15.5px}
}
@media(prefers-reduced-motion:reduce){.hv5-quote .home-thoughts .band-it{transition:none}}
/* Kurs-Kachel: Fortschrittsleiste nie abschneiden */
.home-dashboard .ht5.big .ht-l{display:block!important;-webkit-line-clamp:unset}
/* Kopf so hoch wie sein Inhalt, Rest bekommen die Kacheln */
.home-dashboard{grid-template-rows:auto auto minmax(225px,1fr) minmax(225px,1fr)}
@media(max-width:1150px) and (min-width:761px){.home-dashboard{grid-template-rows:auto auto minmax(190px,.85fr) minmax(270px,1.5fr)}}
@media(max-width:760px){.home-dashboard{grid-template-rows:auto auto minmax(124px,.76fr) minmax(252px,1.59fr)}}
@media(max-height:730px) and (max-width:760px){.home-dashboard{grid-template-rows:auto auto minmax(112px,.68fr) minmax(238px,1.7fr)}}
/* Spruch leiser als die Begrüßung: kleiner, gedämpft, feine Farbleiste statt Trennlinie */
.hv5-quote{margin-top:14px;padding:2px 0 2px 14px;border-top:0;position:relative;align-items:center}
.hv5-quote:before{content:'';position:absolute;left:0;top:4px;bottom:4px;width:2px;border-radius:2px;background:var(--grad);opacity:.7}
.hv5-quote .home-thoughts{font-size:clamp(15px,1.3vw,18px);min-height:2.8em}
.hv5-quote .home-thoughts .band-it{line-height:1.4;color:var(--text-2)}
.hv5-quote .home-thoughts .band-it.on{color:var(--text-2)}
.hv5-quote .quote-controls button{width:30px;height:30px}
.hv5-quote .quote-controls svg{width:13px;height:13px}
@media(max-width:760px){
 .hv5-quote{margin-top:10px;padding-left:12px}
 .hv5-quote .home-thoughts{font-size:14.5px;min-height:4.2em}
}
@media(max-width:370px){.hv5-quote .home-thoughts{font-size:13.5px}}
/* Neue Anordnung: Kurs | Coach · Routinen | Schlaf · Challenges | Zusatzlektionen (überall 2 Spalten) */
.home-primary{grid-template-columns:repeat(2,minmax(0,1fr))}
.home-secondary{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}
.home-dashboard{grid-template-rows:auto auto minmax(200px,1fr) minmax(400px,2fr)}
@media(max-width:1150px) and (min-width:761px){.home-dashboard{grid-template-rows:auto auto minmax(190px,1fr) minmax(380px,2fr)}}
@media(max-width:760px){.home-dashboard{grid-template-rows:auto auto minmax(124px,1fr) minmax(248px,2fr)}}
@media(max-height:730px) and (max-width:760px){.home-dashboard{grid-template-rows:auto auto minmax(112px,1fr) minmax(224px,2fr)}}
@media(min-width:761px){.home-dashboard .ht5.big .ht-t{font-size:26px}}

/* Soforthilfe-Leiste: Knopf links (öffnet das Menü), alle Zustände sauber daneben, zum Durchwischen */
.home-dashboard .home-now{justify-content:flex-start;align-items:center;gap:8px;min-height:0;margin:0}
.home-now .now-ask{flex:none;height:36px;padding:0 14px 0 12px;font-size:13px;background:linear-gradient(110deg,#7acac4,#5b7cff);color:#06101a;border:0}
.home-now .now-ask .now-dot{background:#06101a}.home-now .now-ask .now-dot:after{border-color:#06101a}
.home-now .now-chips{flex:1;min-width:0;gap:6px;padding-right:28px;scroll-snap-type:x proximity}
.home-now .now-chips a{height:36px;scroll-snap-align:start}
@media(max-width:760px){
 .home-now .now-ask,.home-now .now-chips a{height:32px;font-size:12px}
 .home-now .now-ask{padding:0 11px 0 10px}
}

/* Runde 3: Tablet und Desktop – Startseite passt immer auf einen Bildschirm, kein Scrollen */
@media(min-width:761px){
 .main:has(.home-dashboard){padding-top:22px;padding-bottom:16px}
 .home-dashboard{height:calc(100dvh - 38px);min-height:600px;grid-template-rows:auto auto minmax(0,1fr) minmax(0,2fr) auto!important;gap:12px}
 .home-dashboard .home-hero{min-height:0!important;height:auto;padding:0 0 2px}
 .home-dashboard .home-secondary .ht,.home-dashboard .home-primary .ht{min-height:0!important}
 .home-dashboard .home-custom{margin:0;justify-content:flex-end}
 .home-dashboard .home-custom button{padding:5px 10px;font-size:11.5px}
 .home-dashboard .home-custom span{font-size:11px}
}
@media(min-width:761px) and (max-width:860px){
 .main:has(.home-dashboard){padding-bottom:calc(var(--tabbar) + 14px + env(safe-area-inset-bottom))}
 .home-dashboard{height:calc(100dvh - var(--tabbar) - 36px - env(safe-area-inset-bottom))}
}
@media(min-width:761px) and (max-height:820px){
 .home-dashboard{gap:10px}
 .home-dashboard .hv5-hello{font-size:34px}
 .home-dashboard .ht5.big .ht-t{font-size:23px}
 .home-dashboard .ht5 .ht-t{font-size:20px}
}