/*
 * Subcolumns (yaml3) – originalgetreue Spalten-CSS aus felixpfeiffer/subcolumns.
 * Klassennamen und exakte Breiten 1:1 übernommen (z. B. c66l = 66.666 %, c62l = 61.8 %,
 * c38r = 38.2 % – Goldener Schnitt). Die Prozente stehen bewusst so, nicht "66/33".
 *
 * Aufbau des Markups:
 *   <section class="subcolumns …">
 *     <div class="c66l …"><div class="subcl"> … </div></div>
 *     <div class="c33r …"><div class="subcr"> … </div></div>
 *   </section>
 * Breite sitzt auf der Spalte (c…), der Gutter (Abstand) auf dem inneren subc*-Container.
 */

.subcolumns { width: 100%; overflow: hidden; }

/* Spaltenbreiten -------------------------------------------------------- */
.c15l, .c15r { width: 15%; }
.c16l, .c16r { width: 16.666%; }
.c20l, .c20r { width: 20%; }
.c25l, .c25r { width: 25%; }
.c30l, .c30r { width: 30%; }
.c33l, .c33r { width: 33.333%; }
.c38l, .c38r { width: 38.2%; }
.c40l, .c40r { width: 40%; }
.c45l, .c45r { width: 45%; }
.c50l, .c50r { width: 50%; }
.c55l, .c55r { width: 55%; }
.c60l, .c60r { width: 60%; }
.c62l, .c62r { width: 61.8%; }
.c66l, .c66r { width: 66.666%; }
.c70l, .c70r { width: 70%; }
.c75l, .c75r { width: 75%; }
.c80l, .c80r { width: 80%; }
.c85l, .c85r { width: 85%; }

/* Floats ---------------------------------------------------------------- */
.c15l, .c16l, .c20l, .c25l, .c30l, .c33l, .c38l, .c40l, .c45l,
.c50l, .c55l, .c60l, .c62l, .c66l, .c70l, .c75l, .c80l, .c85l { float: left; }

.c15r, .c16r, .c20r, .c25r, .c30r, .c33r, .c38r, .c40r, .c45r,
.c50r, .c55r, .c60r, .c62r, .c66r, .c70r, .c75r, .c80r, .c85r { float: right; margin-left: -5px; }

/* Gutter über die inneren Container -------------------------------------- */
.subc  { padding: 0 .5em; }
.subcl { padding: 0 1em 0 0; }
.subcr { padding: 0 0 0 1em; }

/*
 * OPTIONAL: responsives Stapeln auf kleinen Viewports.
 * Das Originalmodul war NICHT responsiv (feste Prozentspalten auch auf Mobil).
 * Diesen Block entfernen, wenn du die exakte Alt-Optik auch auf dem Handy willst.
 */
@media (max-width: 767px) {
    .subcolumns > div { float: none; width: 100%; }
    .subcl, .subc, .subcr { padding: 0; }
    .subcolumns > div + div { margin-top: 1em; }
}
