/*
Theme Name:   JKK Theme - GeneratePress Child
Theme URI:    https://generatepress.com
Description:  Theme für die Jungen Kreativen Köpfe
Author:       aditive
Author URI:   https://aditive.de
Template:     generatepress
Version:      0.1
*/

/* ========================= */
/* GENERAL STYLES */
/* ========================= */

/* Accessibility enhancements */
.skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    background: #000;
    color: #fff;
    padding: 0.5em 1em;
    z-index: 100;
}

.skip-link:focus,
.skip-link:focus-visible {
    top: 0;
}

:focus-visible {
    outline: 3px solid var(--accent);
    outline-offset: 3px;
}

* {
        box-sizing: border-box;
hyphens: auto;
  font-stretch: normal;
  font-optical-sizing: auto;
-webkit-font-smoothing: antialiased;   /* feineres Rendering, dünnere Striche */
    -moz-osx-font-smoothing: grayscale;
}

body, button, input, select, textarea {
    font-size: 1.2rem;
    line-height: 1.4;
}

h1, h2, h3, h4, 
.site-footer {
    font-family: var(--gp-font--milford-condensed);
text-transform: uppercase;
font-weight: bold;
}

button,
.button,
.header-desktop *,
.dashboard-menu * {
    font-family: var(--gp-font--milford-condensed);
}

 .box_with_shadow,
.regionen_uebersicht_container a {
    border-radius: .3rem;
    padding: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, .1);
}

.regionen_uebersicht_container a {
    display: block;
    padding: 1em;
    text-decoration: none;
}

.regionen_uebersicht_container p {
    margin:0;
}

 .box_with_shadow:hover,
.regionen_uebersicht_container a:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}



ol, ul {
    margin-left: 2em;
}

li {
    margin-bottom: .8em;
}



.wp-block-site-logo a, .wp-block-site-logo img {
    width: 100%;
}

.site-footer > div {
	width: 100%;
}

ul.wp-block-list {
	margin-left: 1em;
}

ul.wp-block-list li {
	list-style: none;
	display: flex;
	align-items: flex-start;
	gap: 0.6em;
	margin-bottom: .8em;
}

ul.wp-block-list li::before {
	content: '';
	flex-shrink: 0; 
	width: 0.8em;
	height: 0.8em;
	background-color: var(--gruen);
	border-radius: 50%;
	margin-top: 0.4em;
}

.template_container {
    width: 90% !important;
	margin: auto;
}

.page-id-34 #main,
.search #main,
.page-template-page-login .site-content,
#dashboard-wrap {
margin-left: auto;
  margin-right: auto;
  max-width: var(--gb-container-width);
  padding-bottom: 4rem;
  width: 90%;
}

.badge {
  color: orange;
  font-weight: bold;
  display: inline-block;
  padding: .5em 1em;
}

.hinweis {
    padding: 1em 1.5em;
    background-color: var(--gruen);
    color: #fff;
border-radius: .3em;
}

.hinweis:before {
    content: '!';
    font-weight: bold;
    margin-right: 1em;
    background-color:#fff;
    color: var(--gruen);
    border-radius: 50%;
    width: 1.5em;
height:1.5em;
display: inline-block;
text-align: center;
}

/* ========================= */
/* HEADER STYLES */
/* ========================= */

.header-desktop .wp-block-search__input {
    font-weight: normal;
    border: 0;
    border-bottom: 2px solid var(--gruen) !important;
}

.header-desktop .head-search {
    width: 25%;
    margin-left: .6em !important;
}

/* ========================= */
/* CUSTOM NAVIGATION DROPDOWN */
/* ========================= */

.custom-menu-wrapper {
    position: relative;
    display: inline-block;
}

.custom-menu {
    display: none;
    flex-direction: column;
    background-color: white;
    width: 550px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    position: absolute;
    top: 125%;
    left: -500px;
    z-index: 1000;
    padding: 20px 0 20px 20px;
}

.custom-menu a {
    color: #999999;
    padding: 10px;
    text-decoration: none;
    text-align: left;
    display: block;
    line-height: 40px;
}

.custom-menu a:hover {
    background-color: #e2017b;
    color: white;
}

/* Hamburger Menu */
.custom-hamburger {
    font-size: 20px;
    cursor: pointer;
    background: none;
    border: none;
    color: white;
    padding: 10px;
    border-radius: 5px;
}

/* ========================= */
/* NAVIGATION ITEM STYLES */
/* ========================= */

button,
a.button,
input.button  {
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: .4em;

cursor: pointer;
align-items: center;
text-decoration: none;
    padding: .7em 1.2em;
}

.wp-block-navigation a.wp-block-navigation-item__content.wp-block-navigation-item__content,
.wp-block-navigation-item.open-on-click .wp-block-navigation-submenu__toggle {
    justify-content: flex-start;
    color: var(--navi-grau);
    align-items: center;
    cursor: pointer;
    display: inline-flex;
    margin-left: 1em;
    text-decoration: none;
    padding: .4em .8em;
    margin:0;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: .4em;
letter-spacing: .02em;
font-size: 1.2em;
}

/* Menüpunkt mit Submenu */
.wp-block-navigation .wp-block-navigation-item.has-child > a.wp-block-navigation-item__content.wp-block-navigation-item__content
 {
    border-radius: .4em .4em 0 0;
}

/* Submenu selbst */
.wp-block-navigation-item.has-child > .wp-block-navigation__submenu-container {
    border-radius: 0 .4em .4em .4em;
}

.wp-block-navigation .wp-block-navigation-item.has-child .wp-block-navigation__submenu-container a.wp-block-navigation-item__content.wp-block-navigation-item__content {
    border-radius: 0;
}

.wp-block-navigation .wp-block-navigation-item {
background-color: transparent;
}

.wp-block-navigation .wp-block-navigation-item.has-child .wp-block-navigation__submenu-container > li a.wp-block-navigation-item__content.wp-block-navigation-item__content { 
    min-width: 11em;
}

/* Erstes Element im Submenu */
.wp-block-navigation .wp-block-navigation-item.has-child .wp-block-navigation__submenu-container > li:first-child a.wp-block-navigation-item__content.wp-block-navigation-item__content {
    border-radius: 0 .4em 0 0;
}

/* Letztes Element im Submenu */
.wp-block-navigation .wp-block-navigation-item.has-child .wp-block-navigation__submenu-container > li:last-child a.wp-block-navigation-item__content.wp-block-navigation-item__content {
    border-radius: 0 0 .4em .4em;
}

/* Aktuelles Element */
.current-menu-item a.wp-block-navigation-item__content.wp-block-navigation-item__content,
.current-menu-ancestor > a.wp-block-navigation-item__content.wp-block-navigation-item__content {
    color: var(--accent);
}

.wp-block-navigation a.wp-block-navigation-item__content.wp-block-navigation-item__content:hover,
.wp-block-navigation-item.open-on-click .wp-block-navigation-submenu__toggle:hover {
    background-color: #e2017b;
    color: white;
}

.wp-block-navigation-item.open-on-click .wp-block-navigation-submenu__toggle {
    padding-right: 1.4em;
}

.wp-block-navigation-item.open-on-click {
    margin-right: 0;
}

.wp-block-navigation-item.open-on-click .wp-block-navigation-submenu__toggle + .wp-block-navigation__submenu-icon {
    margin-left: -1em;
}

span.wp-block-navigation-item__label:hover {
    color: white;
}

.wp-block-navigation .wp-block-navigation-item {
    margin-bottom: 0;
}

.wp-block-navigation__container {
gap: .5em;
}

/* ========================= */
/* SIGNUP BUTTON */
/* ========================= */

li.signup-button a {
    background-color: var(--gruen) !important;
    color:#fff !important;
text-transform: uppercase;
}

li.signup-button a:hover {
    background-color: var(--accent) !important;
}


/* PAGINATION */

/* Pagination Wrapper */
.pagination {
  text-align: center;
  margin: 2em 0;
  font-family: sans-serif;
}

/* Remove default list styling and center items */
.pagination ul.page-numbers {
  list-style: none;
  padding: 0;
  display: inline-flex;
  gap: 0.5em;
}

/* Common styles for links and spans */
.pagination .page-numbers a,
.pagination .page-numbers span {
  display: block;
  padding: 0.5em 0.75em;
  border: 1px solid #ddd;
  border-radius: 4px;
  text-decoration: none;
  color: var(--gruen);
  transition: background-color 0.2s, color 0.2s;
}

.pagination .page-numbers a {
	text-decoration: none;
}

/* Hover state */

.pagination .page-numbers a:hover {
	background-color: var(--gruen);
	color:#fff;
}

/* Current page */
.pagination .page-numbers.current {
  background-color: var(--gruen);
  color: #fff;
  cursor: default;
}

/* Ellipsis */
.pagination .page-numbers.dots {
  border: none;
  background: none;
  color: #999;
  cursor: default;
}

/* "Weiter" link styling */
.pagination .next.page-numbers {
  margin-left: 1em;
  font-weight: bold;
  color: var(--accent);
}

.pagination .next.page-numbers:hover {
  transition: background-color 0.2s, color 0.2s;
}

/* Responsive: wrap on small screens */
@media (max-width: 480px) {
  .pagination ul.page-numbers {
    flex-wrap: wrap;
    gap: 0.25em;
  }
  .pagination .page-numbers {
    padding: 0.4em 0.6em;
    font-size: 0.9em;
  }
}


/* Wetbewerbsseite 'Hacks' */
#grafik_wettbewerbsablauf .ablauf_punkte_container h2 .gb-text {
    display: inline-block; width: 100%;
font-size: .9em;
}

div#n2-ss-4 .n-uc-YZYf9fTSBuFV-inner,
.n2-ss-slider .n2-ss-section-main-content,
.n2-ss-layer-col {
    justify-content: flex-start !important;
}

/* Falls es um die Selbst-Ausrichtung des Layers geht */
.n-uc-1e113a7da39bb {
    align-self: flex-start !important;
}

.n2-ss-slider .n2-ss-item-image-content {
    height: 14rem;
    overflow:hidden;
}

.n2-ss-slider .n2-ss-item-image-content * {
    width:100% !important;
height:100% !important;
max-width:none !important;
max-height:none !important;
object-fit: cover;   
    object-position: center; 
}

/* ========================= */
/* TOOLTIP STYLES */
/* ========================= */

.tooltip {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background-color: rgba(0, 0, 0, 0.8);
    color: #fff;
    padding: 8px 12px;
    border-radius: 5px;
    font-size: 14px;
    width: 200px;
    max-width: 250px;
    white-space: normal;
    text-align: center;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}
@media (max-width: 1024px) {
	#ablauf_container .gb-shape {
			display: none;
	}
}

/* Show tooltip on hover */
.process-step:hover .tooltip {
    visibility: visible;
    opacity: 1;
}


/* ========================= */
/* LOGIN BEREICH */
/* ========================= */

/* Dashboard Layout */
#dashboard-wrap .wp-block-columns {
  display: flex;
  gap: 2rem;
  align-items: flex-start;
  margin: 0 -1rem;
}
@media (max-width: 73rem) {
  #dashboard-wrap .wp-block-columns {
    flex-direction: column;
    gap: 1rem;
  }
}

/* Zentriert das Formular auf der Seite */

#loginform {
  margin: 2rem auto 1rem auto;
  padding: 2.5rem 2rem 2rem 2rem;
  background: #fff;
  border-radius: 1rem;
  box-shadow: 0 2px 24px rgba(0,0,0,0.10), 0 1.5px 2.5px rgba(0,0,0,0.04);
}

/* Platz für die Felder */
#loginform p {
  margin-bottom: 1.4rem;
}

#loginform label {
  font-size: 1rem;
  margin-bottom: 0.45rem;
  display: block;
  color: #333;
  font-weight: 500;
  letter-spacing: 0.01em;
}

#loginform .input[type="text"],
#loginform .input[type="password"] {
  width: 100%;
  padding: 0.7rem 1rem;
  border: 1px solid #bdbdbd;
  border-radius: 0.6rem;
  background: #fafbfc;
  font-size: 1rem;
  transition: border 0.2s;
  margin-top: 0.3rem;
  box-sizing: border-box;
}

#loginform .input[type="text"]:focus,
#loginform .input[type="password"]:focus {
  border: 1.5px solid #289c4c;
  background: #fff;
  outline: none;
}

#loginform .login-remember label {
  display: flex;
  align-items: center;
  font-size: 0.97rem;
  color: #444;
  font-weight: 400;
}

#loginform #rememberme {
  accent-color: #289c4c;
  margin-right: 0.5em;
}

#loginform .login-submit {
  margin-top: 2.0rem;
  text-align: center;
}

/* Mobil: kleiner Abstand & keine zu große Box */
@media (max-width: 500px) {
  #loginform {
    max-width: 98vw;
    padding: 1.1rem 0.5rem 1.5rem 0.5rem;
  }
}

/* Bewerbungsformular */

.gform_wrapper.gravity-theme .gsection h3 {
    margin-bottom: 0;
margin-top: 1.5em;
}

.gpnf-add-entry-max {
  display: block;
  padding: 1em 2em 1em;
  background-color: #dbecdb;
  margin: 1em 0;
}

.gform_wrapper.gravity-theme .gf_progressbar_percentage.percentbar_blue,
.tingle-btn--default,
.tingle-btn--primary,
.gpnf-modal .gpnf-modal-header {
    background-color: var(--gruen) !important;
}

.tingle-btn--primary:hover {
    background-color: var(--accent) !important;
}

.tingle-btn--default {
    background-color: #ccc !important;
}

.tingle-btn--default:hover {
    background-color: #333 !important;
}

#field_2_31 ol {
margin-left: 1.5em;
}


/* Kontaktformular-Wrapper */
.hinweise .gform_wrapper {
  margin-top: 1rem;
}


/* Header und HAMBURGER MENU REGIONEN */

.region-header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  position: relative;
padding: 1em 0;
}

.region-header-title {
  margin: 0;
  font-size: 2.6rem;
  font-weight: bold;
  letter-spacing: .5px;
}

.region-hamburger {
  background: none;
  border: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
  cursor: pointer;
  width: 38px;
  height: 38px;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.hamburger-bar {
  width: 28px;
  height: 3px;
  background: #fff;
  border-radius: 2px;
  display: block;
  transition: all 0.2s;
}

.region-nav {
  position: absolute;
  right: 0;
  top: 100%;
  background: #232a34;
  border-radius: 0.6rem;
  min-width: 25em;
  box-shadow: 0 4px 24px rgba(0,0,0,0.10);
  padding: 0.7rem 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.2s;
  z-index: 999;
}
.region-nav.open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.region-nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.region-nav li {
  margin: 0;
}
.region-nav a {
  display: block;
  color: #fff;
  text-decoration: none;
  padding: 0.7rem 1.5rem;
  transition: background 0.2s;
  font-size: 1.1rem;
}
.region-nav a:hover,
.region-nav a:focus {
  background: #2d3748;
}

a.jkk-back-link.button {
	background-color: rgba(255,255,255,.3);
}

a.jkk-back-link.button:hover {
	background-color: var(--accent);
    color: #fff;
}


/* Responsive */
@media (max-width: 600px) {
  .region-header-title {
    font-size: 1.9rem;
  }
  .region-nav {
    min-width: 70vw;
    right: 50%;
    transform: translateX(50%);
  }
}



/* ========================= */
/* Regionen-Unterseiten */
/* ========================= */


.gruener_kasten > div {
    margin-left: auto;
  margin-right: auto;
  max-width: var(--gb-container-width);
  text-align: left;
  width: 90%;
}
.gruener_kasten > div > p {
    max-width: 45em;
}

.gruener_kasten a:hover {
    color: var(--accent);
}

.kk-section-wrapper,
.kalender-wrapper,
.experten-wrapper {
    width: 90%;
    margin: 4rem auto;
    max-width: var(--gb-container-width);
}

.kk-list {
    display: flex;
    flex-wrap: wrap;
    gap: .7rem;
}

.kk-box,
.news-dateien-item {
    background: #f3f3f3;
    border-radius: .3rem;
    overflow: hidden;
    transition: transform 0.18s;
    margin-bottom: 0;
}

.kk-image-square,
.experten-card-img {
    width: 100%;
    aspect-ratio: 1/1;
    background: #e4e7eb;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.kk-image-square img,
.experten-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.kk-img-placeholder {
    width: 100%;
max-height: 15rem;
    height: 100%;
    background: #d9d9d9;
    border-radius: .3rem;
}

/* ========================= */
/* KALENDER STYLES */
/* ========================= */

.kalender-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
	margin-left: 0;
}

.kalender-item {
    display: flex;
    flex-direction: row;
    gap: 2rem;
    /* inherits background and border-radius from .kk-box */
    padding: 1.2rem 1.5rem;
}

.kalender-date {
    min-width: 13em;
    flex-shrink: 0;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
	font-weight: bold;
}

.kalender-date-mobile {
    display: none;
}

.kalender-date-desktop > div {
    line-height: 1.2;
}

.kalender-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.kalender-title {
    font-size: 1.1rem;
    margin-bottom: .4rem;
}

.kalender-desc {
    font-size: 1rem;
    color: #404040;
}

@media (max-width: 40rem) {
    .kalender-item {
        flex-direction: column;
        gap: .7rem;
    }
    .kalender-date-desktop {
        display: none;
    }
    .kalender-date-mobile {
        display: block;
        margin-bottom: .5rem;
        font-size: 1.1rem;
        color: #2d3748;
    }
}
@media (min-width: 40.1rem) {
    .kalender-date-desktop {
        display: flex;
        flex-direction: column;
        gap: 0.1rem;
    }
    .kalender-date-mobile {
        display: none;
    }
}

/* ========================= */
/* EXPERTEN STYLES */
/* ========================= */

.experten-list {
    /* inherits from .kk-list */
}

.experten-card {
    display: flex;
    flex-direction: column;
    /* inherits background and border-radius from .kk-box */
    align-items: stretch;
    flex: 0 1 calc(25% - 1.5rem); /* 4 per row */
    min-width: 220px;
    max-width: 100%;
}

.experten-card-img {
    /* inherits from .kk-image-square */
}

.experten-card-content {
    padding: 1.4rem 1.2rem 1.3rem;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.experten-card-name {
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 0.7rem;
    color: #17365d;
}
.experten-card-details {
    font-size: 1.02rem;
    color: #283144;
    line-height: 1.3;
}
.experten-nothing {
    text-align: center;
    color: #888;
    margin-top: 3rem;
    font-size: 1.1rem;
}

.schulen-nothing {
    text-align: center;
    color: #888;
    margin-top: 3rem;
    font-size: 1.1rem;
}

/* Grid-Responsivität */
@media (max-width: 70rem) {
    .experten-card {
        flex: 0 1 calc(33.333% - 1.5rem);
    }
}
@media (max-width: 50rem) {
    .experten-card {
        flex: 0 1 calc(50% - 1rem);
    }
}
@media (max-width: 30rem) {
    .experten-card {
        flex: 0 1 100%;
    }
    .experten-list {
        gap: 1.2rem;
    }
}




/* ========================= */
/* FOOTER STYLES */
/* ========================= */

.site-footer .footer_navigation a {
    color: #fff !important;
    text-decoration: none;
    padding: 1em;
font-size: 1.4rem;

}


/* ========================= */
/* MOBILE STYLES */
/* ========================= */

@media only screen and (max-width: 600px) {
    .gb-element-806ff685,
    .head-search,
    .gb-element-a5e54ae5,
    .hide-on-mobile,
    .header-desktop,
    .hide-mobile {
        display: none;
    }

    .navigation-branding img,
    .site-logo.mobile-header-logo img {
        height: 90px;
        width: auto;
    }
}

@media only screen and (min-width: 600px) {
    .hide-on-mobile,
    .hide-des {
        display: none;
    }
}

@media (max-width: 768px) {
    #mobile-header.toggled .main-nav > ul,
    #mobile-header .menu-toggle,
    #mobile-header .mobile-bar-items {
        display: block;
        color: #74c415;
    }
}

@media (max-width: 1100px) {
    .header-desktop {
        display: none;
    }
}

/* ========================= */
/* SEARCH BAR STYLES */
/* ========================= */

input#wp-block-search__input-1 {
    border-bottom: 2px solid #74c415;
    border: none;
}

button.wp-block-search__button.has-icon.wp-element-button {
    background-color: transparent;
    color: #74c415;
}

/* Sliders */

@media (orientation: landscape) and (max-width: 1199px) and (min-width: 901px), (orientation: portrait) and (max-width: 1199px) and (min-width: 701px) {
  div .nextend-arrow img {
    width: 8rem !important;
  }
  
  .n2-ss-slider .n2-ss-slider-controls-absolute-left-center > *, .n2-ss-slider .n2-ss-slider-controls-absolute-right > * {
	  margin-left: 0 !important;
  }
  
  .n2-ss-slider .n2-ss-slider-controls-absolute-right-center > *, .n2-ss-slider .n2-ss-slider-controls-absolute-left > * {
	  margin-right: 0 !important;
  }
}

/* Formulare */

.gpnf-field img,
#gform_fields_2_4 img {
max-width: 8rem;
max-inline-size: 8rem !important;
  max-block-size: 8rem !important;
}

.gpnf-modal .tingle-modal-box {
    max-height: 90vh;
overflow: auto;

}/* ========================= */
/* BILDERGALERIE STYLES */
/* ========================= */

.bildergalerie-list .galerie-item {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: #17365d;
    flex: 0 1 calc(25% - 1.5rem);
    min-width: 220px;
    max-width: 100%;
}

.galerie-item-img {
    /* inherits from .kk-image-square */
}

.galerie-item-info {
    padding: 1.2rem 1rem 1.1rem;
}

.galerie-item-title {
    font-size: 1.1rem;
    margin-bottom: .4rem;
}

.galerie-item-date {
    font-size: .95rem;
    color: #404040;
}

@media (max-width: 70rem) {
    .bildergalerie-list .galerie-item {
        flex: 0 1 calc(33.333% - 1.5rem);
    }
}
@media (max-width: 50rem) {
    .bildergalerie-list .galerie-item {
        flex: 0 1 calc(50% - 1rem);
    }
}
@media (max-width: 30rem) {
    .bildergalerie-list .galerie-item {
        flex: 0 1 100%;
    }
    .bildergalerie-list {
        gap: 1.2rem;
    }
}

.jkk-gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: center;
}
.jkk-gallery a {
    display: block;
    width: calc(25% - 1rem);
    min-width: 180px;
}
.jkk-gallery img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 4/3;
    border-radius: .3rem;
}
@media (max-width: 50rem) {
    .jkk-gallery a { flex: 0 1 calc(50% - 1rem); }
}
@media (max-width: 30rem) {
    .jkk-gallery a { flex: 0 1 100%; }
}

.jkk-lightbox-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.85);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 10000;
}
.jkk-lightbox-overlay.open { display: flex; }
.jkk-lightbox-content { position: relative; max-width: 90%; max-height: 90%; }
.jkk-lightbox-content img { width: 100%; height: auto; max-height: 80vh; display: block; }
.jkk-lightbox-prev,
.jkk-lightbox-next,
.jkk-lightbox-close {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0,0,0,0.5);
    color: #fff;
    border: none;
    padding: .5rem .7rem;
    cursor: pointer;
}
.jkk-lightbox-prev { left: 0; }
.jkk-lightbox-next { right: 0; }
.jkk-lightbox-close { top: 0; right: 0; transform: none; }

.jkk-lightbox-caption {
    background: #fff;
    color: #283144;
    padding: 1.1rem 1.5rem;
    margin-top: 1.3rem;
    border-radius: .3rem;
    box-shadow: 0 2px 8px rgba(30,40,80,0.08);
    font-size: 1.04em;
    text-align: center;
    min-width: 200px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}


/* ========================= */
/* NEWS & PRESSE STYLES */
/* ========================= */

.news-presse-list {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}
.news-presse-entry {
    display: flex;
    flex-direction: column;
    flex: 0 1 calc(50% - 1rem);
    min-width: 220px;
    max-width: 100%;
}


.news-presse-item {
    display: flex;
    flex-direction: row;
    gap: 2rem;
    padding: 1.2rem 1.5rem;
}

.news-presse-date {
    min-width: 6rem;
    flex-shrink: 0;
}

.news-presse-date strong {
    font-size: 1.4em;
}

.news-presse-info {
    flex: 1;
}

.news-presse-item-title {
    font-size: 1.1rem;
    margin-bottom: 0.4rem;
}

.news-presse-item-text {
    font-size: 1rem;
    color: #404040;
}

.news-presse-image {
    width: 7rem;
    flex-shrink: 0;
}
.news-presse-image img {
max-height: 15em;
  object-fit: cover;
}

.news-presse-image .kk-image-square {
    width: 100%;
}

@media (max-width: 40rem) {
    .news-presse-item {
        flex-direction: column;
        gap: 0.7rem;
    }
    .news-presse-image {
        width: 100%;
    }
}

@media (max-width: 80rem) {
    .news-presse-entry {
        flex: 0 1 100%;
    }
    .news-presse-list {
        gap: 1.2rem;
    }
}


/* ========================= */
/* NEWS & PRESSE: DOWNLOADS */
/* ========================= */

.news-dateien-list {
    grid-column: 1 / -1;
    margin-top: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.news-dateien-item {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 1rem 1.3rem;
    border-radius: 0.4rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.news-dateien-ext {
    flex-shrink: 0;
    width: 3.5rem;
    text-align: center;
    font-weight: 700;
    color: #2d4672;
}

.news-dateien-info {
    flex: 1;
}

.news-dateien-title {
    font-size: 1.09rem;
    font-weight: 600;
    margin-bottom: 0.3rem;
	word-break: break-all; 
}

.news-dateien-desc {
    font-size: 0.96rem;
    color: #445;
}

.news-dateien-size {
    font-size: 0.9rem;
    color: #666;
    margin-left: 0.3rem;
}

.news-dateien-download {
    flex-shrink: 0;
    background: #17365d;
    color: #ffffff;
    padding: 0.5rem 1.2rem;
    border-radius: 0.3rem;
    font-size: 0.99rem;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.2s ease;
}

.news-dateien-download:hover {
    background: #0f2645;
}

/* Responsive: Bei sehr schmalen Bildschirmen flex auf Column setzen */
@media (max-width: 40rem) {
    .news-dateien-item {
        flex-direction: column;
        align-items: stretch;
        gap: 0.7rem;
    }
    .news-dateien-ext {
        width: auto;
        text-align: left;
    }
    .news-dateien-download {
        text-align: center;
    }
}



/* ========================= */
/* PREISTRÄGER STYLES */
/* ========================= */

.preistraeger-list {
    /* inherits from .kk-list */
	margin-bottom: 2rem;
}

.preistraeger-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding: 1.1rem 1.6rem 1.4rem;
    /* inherits background and border-radius from .kk-box */
    flex: 0 1 calc(33% - 1.5rem); /* 4 per row */
    min-width: 220px;
    max-width: 100%;
}

.preistraeger-card-title {
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 0.7rem;
    color: #17365d;
}

.preistraeger-card-meta {
    font-size: 1.03rem;
    line-height: 1.5;
    gap: 0.7rem 0.6rem;
display: flex;
  flex-direction: column;
}

.preistraeger-label {
    font-weight: 600;
    color: #17365d;
min-width: 5em;
}

.preistraeger-field {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 0.95em;
}

.preistraeger-value p {
    margin: 0;
}

@media (max-width: 70rem) {
    .preistraeger-card {
        flex: 0 1 calc(33.333% - 1.5rem);
    }
}

@media (max-width: 50rem) {
    .preistraeger-card {
        flex: 0 1 calc(50% - 1rem);
    }
}

@media (max-width: 30rem) {
    .preistraeger-card {
        flex: 0 1 100%;
    }
    .preistraeger-list {
        gap: 1.2rem;
    }
}

/* ========================= */
/* REGIONALE FOERDERER STYLES */
/* ========================= */

.foerderer-list {
    /* inherits from .kk-list */
}

.foerderer-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    flex: 0 1 calc(25% - 1.5rem);
    min-width: 220px;
    max-width: 100%;
}

.foerderer-card-img {
    /* inherits from .kk-image-square */
    padding: 1em;
background-color:#fff;
border: 1px solid rgba(0,0,0,.05);
}

.foerderer-card-img img {
    object-fit: contain;
}

.foerderer-card-info {
    padding: 1.2rem 1rem 1.1rem;
    flex: 1;
}

.foerderer-card-title {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: #17365d;
}

.foerderer-card-address {
    font-size: 1rem;
    line-height: 1.5;
}

.foerderer-card-address p {
    margin-bottom: 0;
}

@media (max-width: 70rem) {
    .foerderer-card {
        flex: 0 1 calc(33.333% - 1.5rem);
    }
}

@media (max-width: 50rem) {
    .foerderer-card {
        flex: 0 1 calc(50% - 1rem);
    }
}

@media (max-width: 30rem) {
    .foerderer-card {
        flex: 0 1 100%;
    }
    .foerderer-list {
        gap: 1.2rem;
    }
}

/* ========================= */
/* FÖRDERER LOGOS RASTER */
/* ========================= */

.foerderer-logos-raster {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: .7rem;
    width: 100%;
    margin: 2rem 0;
}

.foerderer-logo-item {
    background: #ffffff;
    border-radius: 0.3rem;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    overflow: hidden;
}

.foerderer-logo-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.foerderer-logo-image {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.foerderer-logo-image img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}

.foerderer-logo-title {
    margin-top: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    text-align: center;
    color: #333;
    line-height: 1.2;
}

.foerderer-logo-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8f9fa;
    border: 2px dashed #dee2e6;
    border-radius: 0.25rem;
}

.foerderer-logo-placeholder span {
    font-size: 0.875rem;
    color: #6c757d;
    text-align: center;
    font-weight: 500;
}

.foerderer-logos-empty {
    text-align: center;
    color: #6c757d;
    font-style: italic;
    margin: 2rem 0;
}

/* Responsive breakpoints */
@media (max-width: 1200px) {
    .foerderer-logos-raster {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
        gap: 1.25rem;
    }
}

@media (max-width: 768px) {
    .foerderer-logos-raster {
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
        gap: 1rem;
    }
    
    .foerderer-logo-item {
        padding: 0.75rem;
    }
}

@media (max-width: 480px) {
    .foerderer-logos-raster {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.75rem;
    }
    
    .foerderer-logo-item {
        padding: 0.5rem;
    }
    
    .foerderer-logo-title {
        font-size: 0.75rem;
    }
}

/* ========================= */
/* SCHULEN STYLES (analog Experten) */
/* ========================= */

.schulen-list {
    /* inherits from .kk-list */
}

.schulen-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    flex: 0 1 calc(25% - 1.5rem);
    min-width: 220px;
    max-width: 100%;
}

.schulen-card-img {
    /* inherits from .kk-image-square */
    padding: 1em;
    background-color: #fff;
    border: 1px solid rgba(0,0,0,.05);
}

.schulen-card-img img {
    object-fit: contain;
}

.schulen-card-info {
    padding: 1.2rem 1rem 1.1rem;
    flex: 1;
}

.schulen-card-title {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: #17365d;
}

.schulen-card-address {
    font-size: 1rem;
    line-height: 1.5;
}

.schulen-card-address p {
    margin-bottom: 0;
}

@media (max-width: 70rem) {
    .schulen-card {
        flex: 0 1 calc(33.333% - 1.5rem);
    }
}

@media (max-width: 50rem) {
    .schulen-card {
        flex: 0 1 calc(50% - 1rem);
    }
}

@media (max-width: 30rem) {
    .schulen-card {
        flex: 0 1 100%;
    }
    .schulen-list {
        gap: 1.2rem;
    }
}

/* ========================= */
/* Wettbewerbsleitung */
/* ========================= */

.wettbewerbsleitung-content {
display: flex;
  gap: 2rem;
max-width: 66rem;
}

.wettbewerbsleitung-image {
min-width: 15em;
width: 100%;
}

.wettbewerbsleitung-image img {
width: 100%;

object-fit: cover;
}

@media (max-width: 50rem) {
    .wettbewerbsleitung-content {
        display: block;
    }
    .wettbewerbsleitung-image img {
    max-height: 25rem;
    object-position: center 30%; 
    }
}

/* GRAVITY FORMS */

/* Gesamtvorschau Zusammenfassung Bewerbung */
.jkk-preview-card {
  background: #fdfdfd;
  border: 1px solid #ddd;
  padding: 2rem;
  border-radius: 10px;
  font-family: "Segoe UI", sans-serif;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

.jkk-preview-card h2 {
  font-size: 2rem;
  color: #2c3e50;
  margin-bottom: 1rem;
}

.jkk-preview-group {
  margin-bottom: 2.5rem;
}

.jkk-preview-group h3 {
  font-size: 1.6rem;
  margin-bottom: 0.5rem;
  color: #333;
  border-bottom: 1px solid #eee;
  padding-bottom: 0.3rem;
}

.jkk-preview-group p {
  margin: 0.3em 0;
  line-height: 1.5;
}

/* Teammitglieder: Flex statt Tabelle */
.jkk-team-wrapper,
.jkk-ideen-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: space-between;
  align-items: stretch;
    border: 0 !important;
}

/* Äußere Tabellen = Flex-Items */
.jkk-team-wrapper > table,
.jkk-ideen-wrapper > table {
  flex: 0 1 calc(50% - 1rem);
  box-sizing: border-box;
  border-radius: 8px;
  overflow: hidden;
 border: 1px solid rgba(0,0,0,.2) !important;
background-color: rgba(0,0,0,.02) !important;
padding: .5em 1em 1em 1em;
}

.jkk-ideen-wrapper table table tr:nth-child(1),
.jkk-ideen-wrapper table table tr:nth-child(2) {
  display: none;
}

/* Innere Formatierung entfernen, um modernes Aussehen zu erreichen */
.jkk-team-wrapper font,
.jkk-ideen-wrapper font {
  all: unset;
}

.jkk-team-wrapper td,
.jkk-ideen-wrapper td {
  padding: .2em .8em .6em .8em;
  vertical-align: top;
border: 0 !important;
}

.jkk-team-wrapper table,
.jkk-ideen-wrapper table  {
 border: 0;
margin-bottom: 0;
}

.jkk-team-wrapper tr[bgcolor="#EAF2FA"],
.jkk-ideen-wrapper tr[bgcolor="#EAF2FA"] {
  background-color: rgba(0,0,0,.02) !important;
}

.jkk-team-wrapper tr[bgcolor="#FFFFFF"],
.jkk-ideen-wrapper tr[bgcolor="#FFFFFF"] {
  background-color: #fff !important;
}

.jkk-team-wrapper tr[bgcolor="#FFFFFF"] td font,
.jkk-ideen-wrapper tr[bgcolor="#FFFFFF"] td font{
  font-size: 1rem !important;
}

.jkk-team-wrapper td[width="20"],
.jkk-ideen-wrapper td[width="20"]  {
  padding:0;
width: 5px !important;
} 

.jkk-team-wrapper td[colspan="2"],
.jkk-ideen-wrapper td[colspan="2"] {
  padding: .5em 0 0 0;
}

.map-it-link {
    display: none;
}

/* Optional: "Label-Zellen" fett machen */
.jkk-team-wrapper td[colspan="2"] strong,
.jkk-ideen-wrapper td[colspan="2"] strong {
  display: block;
  margin: 0.3em 0 0 0;
  font-weight: 600;
  color: #333;
font-size: 1.2rem;
}

/* Responsiv: 1 Spalte auf kleinen Screens */
@media (max-width: 55rem) {
  .jkk-team-wrapper > table[width="99%"],
.jkk-ideen-wrapper > table[width="99%"]  {
    flex: 0 1 100%;
	margin-bottom: 0;
	margin-top: .5rem;
  }
}

.jkk-team-wrapper hr.gpnf-nested-entries-hr,
.jkk-ideen-wrapper hr.gpnf-nested-entries-hr {
  display: none !important;
}

#school-apps-table td:has(.school-ideas-table) {
  background-color: 
}

.dataTable {
	background-color:#fafafa;
}

.dataTable .odd,
tr.odd + tr:not([class]) {
	background-color:#fff;
}

.dataTable tr:hover {
	background-color: rgba(0,0,0,.05)
}