/* ═══════════════════════════════════════════════════════════
   RESPONSIVE · muss als LETZTE Stildatei geladen werden,
   sonst überschreiben die Seiten-CSS diese Anpassungen.
═══════════════════════════════════════════════════════════ */

@media(max-width:860px){
    .desktop { grid-template-columns:1fr; padding:48px 12px 92px; }
    .eb-wrap { grid-template-columns:1fr; padding:48px 12px 92px; }
    .eb-result { position:static; }
    .mac-tab { padding:3px 9px; font-size:0.7rem; }
    .widget-clock { flex-direction:column; gap:10px; padding:14px 18px; }
    .widget-ecowitt { grid-column:1; grid-row:auto; }
    .clock-right { text-align:left; }
    .clock-loc { justify-content:flex-start; }
    .eco-val { font-size:1.7rem; }
    .w-temp-big { font-size:2.6rem; }
    .w-icon-big, .w-icon-big .lucide { width:54px; height:54px; }
    .hourly-row { grid-template-columns:repeat(6, minmax(72px,1fr)); }
}
@media(max-width:500px){
    .links-grid { grid-template-columns:1fr 1fr; }
    .eb-fields, .eb-params { grid-template-columns:1fr; }
    .eb-amount { font-size:2.2rem; }
    .mac-tab span { display:none; }
    .mac-tab { padding:4px 8px; }
    .clock-time { font-size:2rem; }
    .eco-val { font-size:1.5rem; }
    .w-stats { grid-template-columns:1fr 1fr; }
    .forecast { grid-template-columns:1fr 1fr 1fr; }
    .wmodal-body { padding:14px 16px 22px; }
    .wmodal-header { padding:16px 18px 12px; }
    .wmodal-title { font-size:1.15rem; }
    .hourly-row { grid-template-columns:repeat(4, minmax(72px,1fr)); }
    .det-grid { grid-template-columns:1fr 1fr; }
}


/* ── Zusätzlich fürs Handy ── */
@media (max-width:860px) {
    .bv-wrap, .wx-wrap { padding:48px 12px 92px; }
    .bv-hero, .vz-split, .bv-grid2 { grid-template-columns:1fr; }
    .desktop > .widget, .desktop > div { min-width:0; }
}
@media (max-width:500px) {
    .links-grid { grid-template-columns:1fr 1fr; }
    .eco-grid { grid-template-columns:1fr 1fr; }
    .bv-kpis { grid-template-columns:1fr 1fr; }
    .wx-hero-stats { grid-template-columns:1fr 1fr; }
    .clock-time { font-size:1.9rem; }
}

/* ── Dashboard-Raster am Handy vollständig auflösen ──
   Die Kacheln setzen im Desktop-Layout feste grid-column/grid-row.
   Ohne diese Ausnahmen überlagern sie sich auf schmalen Schirmen. */
@media (max-width:860px) {
    .desktop { grid-template-columns:1fr !important; }
    .desktop > * { grid-column:1 !important; grid-row:auto !important; }
}