/* ------------------------------- */
/* ------ CONTAINER -------------- */
/* ------------------------------- */
.y-main {
  padding-top: calc(var(--y-header-height) + var(--y-container-padding));
}

.y-section {
  position: relative;
  margin: 0 auto;
  padding-top: var(--y-container-padding);
  padding-bottom: var(--y-container-padding);
}
.y-container {
  position: relative;
  margin: 0 auto;
  width: 100%;
  max-width: var(--y-container-with);
}

/* Grid-Wrapper */
.y-grid {
  display: grid;
  gap: var(--yuhura-global-padding);
}
/* Modifiers für Column-Ratios */
.y-cols-7-3 {
  grid-template-columns: 7fr 3fr;
}

.y-cols-3-7 {
  grid-template-columns: 3fr 7fr;
}
.y-cols-8-2 {
  grid-template-columns: 8fr 2fr;
}
.y-cols-2-8 {
  grid-template-columns:  2fr 8fr;
}

.y-cols-1-1 {
  grid-template-columns: 1fr 1fr;
}
/* Image Grid */
.y-imagegrid {
  column-width: calc(var(--y-site-content-width) / 3); /* leicht größer für 27" */
  column-gap: var(--yuhura-global-padding);
}

.y-imagegrid-item {
  break-inside: avoid;
  margin-bottom: var(--yuhura-global-padding);
  display: inline-block; /* wichtig für sauberen Flow */
  width: 100%;
}