/* ============================================
   ECX 20 - Layout
   Aus dem Entwurf der Grafikerin uebernommen,
   Werte und Media Queries unveraendert.
   Umbenennungen:
     .wrap         -> .ecx-wrap
     .section      -> .ecx-section
     .section--sm  -> .ecx-section--sm
     .tone-dark    -> .ecx-section--dark
     .tone-soft    -> .ecx-section--soft
   ============================================ */

.ecx-wrap { max-width: 1320px; margin: 0 auto; padding: 0 32px; }
@media (max-width: 720px) { .ecx-wrap { padding: 0 18px; } }

.ecx-section { padding: 80px 0; }
.ecx-section--sm { padding: 56px 0; }
@media (max-width: 720px) { .ecx-section { padding: 56px 0; } }

.ecx-section--dark {
  background: var(--ec-blue);
  color: #fff;
  position: relative;
  overflow: hidden;
}

.ecx-section--soft { background: var(--bg); }