/* =====================================================================
   Startseite
   Apotheke am Bürgerhaus
   =====================================================================

   Nur, was ausschließlich hier gebraucht wird. Alles, was ein zweites
   Mal vorkommen könnte, steht in komponenten.css.

   ===================================================================== */


/* ---------------------------------------------------------------------
   Der Kopfbereich
   ---------------------------------------------------------------------
   Es gibt keine freigegebenen Fotos, und der Auslieferungszustand
   dieses Tickets ist der fotolose. Wo im Entwurf eine Bildfläche stand,
   steht jetzt die Anschlagtafel "Heute": die Auskunft, die als erste
   gesucht wird — hat auf, wo, welche Nummer.

   Damit ist die zweite Spalte weder leer noch ein Platzhalter, und die
   Abfolge des Entwurfs bleibt erhalten. Auf schmalen Geräten steht die
   Tafel unter dem Text, genau wie im Entwurf der Abschnitt darunter.

   Die Begründung und die verworfene Alternative stehen im README.
   --------------------------------------------------------------------- */

.hero h1 {
  margin-bottom: 0.9rem;
}

/* ---------------------------------------------------------------------
   Abschluss des Rezept-Abschnitts
   ---------------------------------------------------------------------
   Die drei Wege selbst stehen seit Ticket 9 in komponenten.css: sie
   tragen jetzt auch die Seite "Rezept & Vorbestellung".
   --------------------------------------------------------------------- */

.abschluss {
  margin-top: 1.75rem;
}


/* ---------------------------------------------------------------------
   Notdienst
   ---------------------------------------------------------------------
   Ruhig gehalten, kein Alarmrot. Wer nachts sucht, braucht eine klare
   Auskunft und keinen Schreck. Die Auskunft selbst steht bewusst nicht
   hier, sondern in der offiziellen Suche: eine eigene Liste wäre am
   Tag nach der Pflege falsch.
   --------------------------------------------------------------------- */

.notdienst {
  border-top: 3px solid var(--petrol);
}


/* ---------------------------------------------------------------------
   Ab 768px
   --------------------------------------------------------------------- */

@media (min-width: 768px) {

  /* Das Raster des Entwurfs, unverändert. In der zweiten Spalte steht
     die Anschlagtafel statt einer Bildfläche. */
  .hero__raster {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    column-gap: 3rem;
    align-items: start;
  }

  .hero__raster > .kicker {
    grid-column: 1;
    grid-row: 1;
  }

  .hero__raster > h1 {
    grid-column: 1;
    grid-row: 2;
  }

  .hero__raster > .lead {
    grid-column: 1;
    grid-row: 3;
  }

  .hero__raster > .aktionen {
    grid-column: 1;
    grid-row: 4;
  }

  .hero__raster > .tafel {
    grid-column: 2;
    grid-row: 1 / span 4;
    margin-top: 0.4rem;
  }

  .kontakt__raster {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 3rem;
    align-items: start;
  }

  .kontakt__raster .tafel {
    margin-top: 0;
  }

  .kontakt__raster .bildplatz,
  .kontakt__raster .oeffnungszeiten {
    margin-top: 0;
  }
}