/* =====================================================================
   Myas Welt der Physik – style-mobile.css
   Wird nur auf schmalen Bildschirmen geladen:
   <link rel="stylesheet" href="css/style-mobile.css" media="(max-width: 760px)">
   Enthält deshalb nur Abweichungen von style.css.
   ===================================================================== */

body { font-size: 16px; }
h1 { font-size: 1.6rem; }
h2 { font-size: 1.28rem; }

/* Kopf: Marke oben, Suche darunter über die volle Breite */
.kopf-innen { flex-direction: column; align-items: stretch; gap: .7rem; padding: .8rem 1rem .5rem; }
.marke { font-size: 1.5rem; }
.marke img { width: 46px; height: 46px; }
.kopf-suche input { width: 100%; flex: 1; }
#hauptnavi { padding: 0 .6rem; gap: 0; }
#hauptnavi a { padding: .4rem .6rem .5rem; font-size: .9rem; }

#inhalt { padding: .25rem 1rem 2rem; }

/* Startseite */
.held { grid-template-columns: 1fr; padding: 1.1rem 1.1rem; gap: .5rem; }
.held-bild { order: -1; }
.held-bild img { width: 130px; }
.gebiete { grid-template-columns: 1fr; }
.stufen-erklaerung { grid-template-columns: 1fr; }

/* Stoffgebiete: Anfänger und Fortgeschrittene untereinander */
.stufen { grid-template-columns: 1fr; }
.thema { padding: .9rem 1rem; }

/* Suche */
.suchformular { grid-template-columns: 1fr 1fr; }
.suchformular .feld-q, .suchformular .feld-los { grid-column: 1 / -1; }

/* Fuß */
.fuss-innen { flex-direction: column; align-items: flex-start; }

/* Bausteine der Animationen */
#inhalt .sim { grid-template-columns: minmax(0,1fr); }
.wahl { grid-template-columns: 1fr; }
.wahl.drei { grid-template-columns: 1fr; }
@media (max-width: 620px) {
  .anzeige { grid-template-columns: repeat(2, minmax(0,1fr)); }
}