/* ----------------------------
   Accessibility-preserving resets
   ---------------------------- */

/* Headings should look exactly like your classes define, not UA defaults */
h1, h2, h3, h4, h5, h6 {
  font: inherit;
  font-weight: inherit;
  color: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  margin: 0;
}

/* Optional helper to re-apply zero margins to select H2 banners */
.h-reset { margin: 0; }

/* “Possible heading” elements now real headings; ensure spacing stays as before */
h3.vh1, h4.vh1, h3.wh3, h4.wh3 { margin: 0; }

/* Remove all justified text flags while keeping the same feel */
p, .vh6, .bullets, .grey {
  text-align: left; /* or 'start' if you prefer logical alignment */
}

/* Slightly increase readability to compensate for losing justification */
.vh6 { line-height: 1.55; }

/* Make all small pictograms that were inside links decorative by default */
.s_images[aria-hidden="true"],
.fancycardID[aria-hidden="true"] {
  /* no visual changes needed */
}

/* ---------------------------------
   Responsive duplicate control (screen/mobile)
   Only one is visible & announced
   --------------------------------- */
@media (min-width: 768px) {
  .screen[aria-hidden="false"] { display: block; }
  .mobile { display: none; }
}
@media (max-width: 767.98px) {
  .screen { display: none; }
  .mobile[aria-hidden="true"] { display: block; } /* shown visually, but ARIA-hidden removed via tabindex/attr in HTML for safety */
}

/* Ensure hidden duplicates don't trap pointer events when visually hidden */
.screen[style*="display:none"], .mobile[style*="display:none"] {
  pointer-events: none;
}

/* ---------------------------------
   Buttons/links nested structure normalization
   (prevent spacing shifts after heading changes)
   --------------------------------- */
.greenbutton p.vh5,
.whitebutton p.vh6,
.whitebuttoncenter p.vh6 {
  margin: 0;
}

.greenbutton, a.greenbutton { display:inline-block; }
.whitebutton, a.whitebutton { display:inline-block; }
.whitebuttoncenter, a.whitebuttoncenter { display:inline-block; }

/* if you had rules like div.greenbutton {...} add a.greenbutton to each */


/* Make sure card tiles don't shift due to heading default margins */
.cardiac .vh1, .cardiac .wh3,
.cardiac2 .vh1, .cardiac2 .wh3,
.fancycard .fancycardTitle {
  margin: 0;
}

/* A11y: avoid fully-justified paragraphs (improves readability) */
p,
.vh6,
.fancycardText,
.bullets,
.fancycardTitle,
.wh3,
.screen,
.mobile {
  text-align: left !important;
  text-justify: auto !important;
}

/* If any utility sets justify on containers, neutralize it for text nodes */
[class*="justify"] p,
[class*="justify"] .vh6,
[class*="justify"] .fancycardText {
  text-align: left !important;
}

/* ----------------------------
   WAVE: neutralize any justified text (hard override)
   ---------------------------- */

/* 1) Force typical text elements away from full justification */
p, li, dd, dt, blockquote, figcaption, address, caption,
.vh6, .fancycardText, .bullets, .grey, .fancycardTitle, .wh3,
.screen, .mobile {
  text-align: left !important;
  text-justify: auto !important;      /* ignore inter-word/ideograph/etc. */
  text-align-last: auto !important;   /* safety against last-line justify */
}

/* 2) Defeat inline styles and utility classes that set justify */
[style*="text-align:justify"],
[style*="text-align: justify"],
[style*="text-align-last:justify"],
[style*="text-align-last: justify"],
.justify,
.text-justify,
.is-justified,
[class*="justify"],
[class*="Justify"],
[class*="JUSTIFY"] {
  text-align: left !important;
  text-justify: auto !important;
  text-align-last: auto !important;
}

/* 3) If justification is applied on a container, neutralize descendants too */
.justify * ,
.text-justify * ,
.is-justified * ,
[class*="justify"] * {
  text-align: left !important;
  text-justify: auto !important;
  text-align-last: auto !important;
}

/* Style a plain <a> to look like your green button */
a.btn-as-button {
  display: inline-block;
  padding: 12px 20px;
  border-radius: 8px;
  background: #4E6C27;
  color: #fff !important;
  text-decoration: none;
  font-size: 1.125rem; /* matches vh5 size */
  font-weight: 600;
  line-height: 1.2;
}
a.btn-as-button:hover {
  filter: brightness(1.05);
}
a.btn-as-button:focus {
  outline: 2px solid #000; /* visible focus */
  outline-offset: 2px;
}


  /* 1) Let the main page area grow with content */
  .grid.topimgkursplan1,
  .grid.topimgkursplan1 > .wrapper,
  .grid.topimgkursplan1 section,
  #courseFilter {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  /* 2) Make sure the dynamically inserted rows/cards are not absolutely positioned */
  #courseFilter .filt,
  #courseFilter .linkedaus,
  #courseFilter .courseRow,
  #courseFilter .courseCard,
  #courseFilter .endform {
    position: static !important;   /* or relative; not absolute/fixed */
    float: none !important;
  }

  /* 3) Optional: proper sticky-footer pattern */
  html, body { height: 100%; }
  body { display: flex; flex-direction: column; min-height: 100%; }
  .grid.topimgkursplan1 { flex: 1 0 auto; }  /* your main content wrapper */
  footer { margin-top: auto; flex-shrink: 0; }