@import url(../css/basis.css);:root{--image-border-color:#e9ecef;--image-border-hover:var(--color-primary-light);--source-info-color:#ffffff;--article-date-color:#495057;--article-content-bg:#f8f9fa;--article-excerpt-bg:rgba(255, 255, 255, 0.95);--tag-bg:rgba(205, 0, 11, 0.1);--tag-color:#fff;--filter-bg:rgba(255, 255, 255, 0.9);--category-erfolge:#ffd700;--category-verein:#28a745;--category-nachwuchs:#007bff;--media-grid-gap:var(--spacing-lg);--article-border-radius:var(--border-radius-lg);--image-aspect-ratio:4 / 3;--max-article-width:1200px;--hover-scale:1.02;--transition-smooth:all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);--fade-duration:0.6s}.skip-links{position:absolute;top:-50px;left:var(--spacing-sm);z-index:calc(var(--z-preloader) + 1);display:flex;flex-direction:column;gap:var(--spacing-xs)}.skip-link{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden;background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-dark) 100%);color:var(--color-white);padding:var(--spacing-sm) var(--spacing-md);text-decoration:none;border-radius:var(--border-radius);font-weight:600;font-size:var(--font-size-sm);transition:var(--transition-standard);box-shadow:var(--shadow-lg);border:2px solid var(--color-white);min-height:var(--min-touch-target,44px);display:flex;align-items:center}.skip-link:focus{position:static;width:auto;height:auto;overflow:visible;left:auto;top:auto;z-index:calc(var(--z-preloader) + 2);animation:skipLinkFadeIn 0.3s ease-out}@keyframes skipLinkFadeIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.tagline{font-size:var(--font-size-lg);font-style:italic;color:var(--color-text);text-align:center;margin-top:-.5rem;margin-bottom:1.5rem;font-weight:400;letter-spacing:1px}.media-controls{margin-bottom:var(--spacing-xl);padding:var(--spacing-lg);background:var(--filter-bg);border-radius:var(--article-border-radius);box-shadow:var(--shadow-sm);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.filter-bar{display:flex;gap:var(--spacing-lg);flex-wrap:wrap;justify-content:center;align-items:end}.filter-group{display:flex;flex-direction:column;gap:var(--spacing-xs);min-width:200px}.filter-label{font-weight:600;color:var(--color-gray-dark);font-size:var(--font-size-sm);margin-bottom:var(--spacing-xs)}.filter-select{padding:var(--spacing-sm) var(--spacing-md);border:2px solid var(--image-border-color);border-radius:var(--border-radius);font-size:var(--font-size-base);background-color:var(--color-white);color:var(--color-gray-dark);cursor:pointer;transition:var(--transition-standard);min-height:var(--min-touch-target,44px)}.filter-select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.filter-select:hover{border-color:var(--color-primary-light)}.featured-section{margin-bottom:var(--spacing-xl);display:none}.section-title{display:flex;align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-lg);font-size:var(--font-size-xl);color:var(--color-primary);font-weight:700}.section-title i{font-size:1.2em;color:var(--color-primary)}.featured-article{background:linear-gradient(135deg,rgb(255 255 255 / .95) 0%,rgb(248 249 250 / .95) 100%);border:2px solid var(--color-primary-light);box-shadow:var(--shadow-lg);position:relative;overflow:visible;max-width:var(--max-article-width);margin:0 auto}.featured-article::before{content:'';position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:linear-gradient(135deg,var(--color-primary),var(--color-primary-dark));border-radius:var(--article-border-radius);z-index:-1;opacity:.1}.featured-article:hover{transform:translateY(-8px);box-shadow:var(--shadow-xl)}.media-section{margin-top:var(--spacing-xl)}.media-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:var(--spacing-xl);margin-bottom:var(--spacing-xl);align-items:stretch;container-type:inline-size}.media-item.card,.card.media-item{display:flex!important;flex-direction:column!important;height:100%!important;min-height:450px!important}.media-item .card-body,.card.media-item .card-body{flex:1!important;display:flex!important;flex-direction:column!important;padding:var(--spacing-md)}.media-item .card-footer,.card.media-item .card-footer{margin-top:auto!important;background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-dark) 100%);color:var(--color-white);padding:var(--spacing-md);border-radius:0 0 var(--border-radius-lg) var(--border-radius-lg);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--spacing-sm);flex-shrink:0!important}.media-item{transition:var(--transition-smooth);contain:layout style;position:relative;background:var(--color-white);border-radius:var(--article-border-radius);overflow:hidden;cursor:pointer}.media-item:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}.media-item:focus{outline:3px solid var(--color-primary);outline-offset:2px;transform:translateY(-3px)}.media-item .article-meta{margin-bottom:var(--spacing-md);flex-shrink:0}.media-item .article-images{margin-bottom:var(--spacing-md);flex-shrink:0}.media-item .article-summary,.media-item .article-content{flex-grow:1;display:flex;flex-direction:column;justify-content:flex-start}.fade-in-delayed{opacity:0;transform:translateY(20px);transition:opacity 0.6s ease-out,transform 0.6s ease-out}.fade-in-delayed.loaded{opacity:1;transform:translateY(0)}@keyframes fadeInUp{to{opacity:1;transform:translateY(0)}}.article-meta{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);margin-bottom:var(--spacing-md);align-items:center}.article-date{color:var(--article-date-color);font-size:var(--font-size-sm);font-weight:500;display:flex;align-items:center;gap:var(--spacing-xs)}.article-date i{color:var(--color-primary);font-weight:500}.article-category{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);background-color:var(--tag-bg);color:var(--tag-color);border-radius:var(--border-radius);font-size:var(--font-size-xs);font-weight:600;text-transform:uppercase;letter-spacing:.5px;max-height:none!important;overflow:visible!important;opacity:1!important;transition:all 0.3s ease;margin-top:var(--spacing-sm)}.article-date,.article-category{display:inline-flex;align-items:center;gap:var(--spacing-xs);font-size:var(--font-size-sm);white-space:nowrap;flex-shrink:0}.article-category[data-category="erfolge"]{background-color:rgb(255 215 0 / .2);color:#b8860b}.article-category[data-category="verein"]{background-color:rgb(40 167 69 / .2);color:#1e7e34}.article-category[data-category="nachwuchs"]{background-color:rgb(0 123 255 / .2);color:#0056b3}.article-images{display:flex;gap:var(--spacing-md);flex-wrap:wrap;margin-bottom:var(--spacing-md);justify-content:center}.article-images.single-image{justify-content:center}.image-container{flex:1;min-width:200px;max-width:100%;border:2px solid var(--image-border-color);border-radius:var(--border-radius);overflow:hidden;transition:var(--transition-smooth);position:relative;aspect-ratio:var(--image-aspect-ratio);background-color:var(--color-gray-light)}.image-container:hover{border-color:var(--image-border-hover);box-shadow:var(--shadow-md);transform:scale(var(--hover-scale))}.image-container img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:var(--transition-smooth);cursor:pointer}.image-container:hover img{filter:brightness(1.05)}.article-content{position:relative;margin:var(--spacing-md) 0}.article-excerpt{background:var(--article-excerpt-bg);padding:var(--spacing-md);border-radius:var(--border-radius);border-left:4px solid var(--color-primary)}.article-full-content{background:var(--article-content-bg);padding:var(--spacing-md);border-radius:var(--border-radius);margin-top:var(--spacing-sm);transition:max-height 0.5s ease,opacity 0.3s ease,padding 0.3s ease;max-height:none!important;overflow:visible!important;opacity:1!important;transition:all 0.3s ease}.article-content.expanded .article-full-content{max-height:1000px;opacity:1}.article-full-content[aria-expanded="false"]{display:none;max-height:0;opacity:0;padding-top:0;padding-bottom:0}.article-full-content[aria-expanded="true"]{display:block;max-height:1800px;opacity:1}.article-summary{padding:var(--spacing-sm) 0;line-height:var(--line-height-relaxed,1.75)}.article-summary p{margin-bottom:var(--spacing-sm)}.article-summary,.article-content{margin-top:auto}.read-more-toggle{display:inline-flex;align-items:center;gap:var(--spacing-xs);color:var(--color-primary);font-weight:600;font-size:var(--font-size-sm);text-decoration:none;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--border-radius);background:linear-gradient(135deg,rgb(255 255 255 / .9),rgb(248 249 250 / .9));border:2px solid var(--color-primary-light);transition:var(--transition-standard);cursor:pointer;min-height:var(--min-touch-target,44px);margin-top:var(--spacing-sm)}.read-more-toggle:hover{background:linear-gradient(135deg,var(--color-primary),var(--color-primary-dark));color:var(--color-white);transform:translateY(-2px);box-shadow:var(--shadow-md)}.read-more-toggle:focus{outline:3px solid var(--color-primary);outline-offset:2px}.read-more-toggle i{transition:transform 0.3s ease;font-size:.9em}.read-more-toggle:hover i{transform:translateY(1px)}.card-footer{margin-top:auto;background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-dark) 100%);color:var(--color-white);padding:var(--spacing-md);border-radius:0 0 var(--border-radius-lg) var(--border-radius-lg);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--spacing-sm)}.source-info{font-size:var(--font-size-sm);color:var(--color-white);font-weight:500;display:flex;align-items:center;gap:var(--spacing-xs)}.source-info i{color:var(--color-white);font-size:1em}.article-tags{display:flex;gap:var(--spacing-xs);flex-wrap:nowrap}.tag{padding:var(--spacing-xs) var(--spacing-sm);background-color:rgb(255 255 255 / .2);color:var(--color-white);border-radius:var(--border-radius-sm);font-size:var(--font-size-xs);font-weight:500;transition:var(--transition-standard);border:1px solid rgb(255 255 255 / .3);cursor:pointer;white-space:nowrap;flex-shrink:0}.tag:hover{background-color:rgb(255 255 255 / .3);transform:translateY(-1px)}.tag:focus{outline:2px solid var(--color-white);outline-offset:1px}.load-more-section{display:flex;justify-content:center;align-items:center;margin-top:var(--spacing-xxl,3rem);margin-bottom:var(--spacing-xl,2rem);padding:var(--spacing-lg,1.5rem) 0;width:100%}.load-more-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-xl);background:var(--color-primary);color:var(--color-white);border:2px solid var(--color-primary-dark);border-radius:var(--border-radius-lg);font-size:var(--font-size-base);font-weight:600;cursor:pointer;transition:var(--transition-standard);min-height:var(--min-touch-target,44px);box-shadow:0 4px 12px rgb(205 0 11 / .3);text-decoration:none;min-width:200px}.load-more-button:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgb(205 0 11 / .4);background:var(--color-primary-dark);border-color:var(--color-primary)}.load-more-button:focus{outline:3px solid var(--color-white);outline-offset:2px}.load-more-button i{transition:transform 0.3s ease;font-size:1.1em}.load-more-button:hover i{transform:rotate(90deg)}@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInFromLeft{from{opacity:0;transform:translateX(-50px)}to{opacity:1;transform:translateX(0)}}@keyframes slideInFromRight{from{opacity:0;transform:translateX(50px)}to{opacity:1;transform:translateX(0)}}.media-item:nth-child(odd){animation:slideInFromLeft var(--fade-duration) ease-out}.media-item:nth-child(even){animation:slideInFromRight var(--fade-duration) ease-out}.card{transition:var(--transition-smooth);will-change:transform,box-shadow}.card{display:flex;flex-direction:column;height:100%;min-height:400px}.card-body{flex:1;display:flex;flex-direction:column;padding:var(--spacing-md)}.card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}html{scroll-behavior:smooth}@keyframes focusPulse{0%{box-shadow:0 0 0 0 var(--color-primary)}70%{box-shadow:0 0 0 10px #fff0}100%{box-shadow:0 0 0 0 #fff0}}*:focus{animation:focusPulse 1.5s infinite}@media (min-width:576px){.filter-bar{justify-content:flex-start}.filter-group{min-width:220px}.article-images{justify-content:flex-start}}@media (min-width:768px){:root{--media-grid-gap:var(--spacing-xl)}.media-grid{grid-template-columns:repeat(1,1fr)}.filter-bar{justify-content:center}.article-meta{flex-wrap:nowrap}}@media (min-width:992px){.media-grid{grid-template-columns:repeat(1,1fr)}.featured-article{padding:var(--spacing-xl)}.filter-group{min-width:250px}}@media (min-width:1200px){.media-grid{grid-template-columns:repeat(2,1fr)}.container{max-width:1500px}}@media (min-width:1650px){.media-grid{grid-template-columns:repeat(3,1fr);max-width:1800px;margin:0 auto}}@media (max-width:1024px) and (min-width:768px){.media-controls{padding:var(--spacing-md)}.filter-bar{gap:var(--spacing-md)}.filter-group{min-width:180px}.article-images{gap:var(--spacing-sm)}.featured-article{margin:0 var(--spacing-md)}}@media (max-width:768px){:root{--media-grid-gap:var(--spacing-md);--article-border-radius:var(--border-radius)}.skip-links{top:-40px;left:var(--spacing-xs)}.skip-link{font-size:var(--font-size-xs);padding:var(--spacing-xs) var(--spacing-sm);min-height:var(--min-touch-target)}.media-controls{margin-bottom:var(--spacing-lg);padding:var(--spacing-md)}.filter-bar{flex-direction:column;gap:var(--spacing-md)}.filter-group{min-width:unset;width:100%}.filter-select{width:100%;font-size:var(--font-size-base)}.media-grid{grid-template-columns:1fr;gap:var(--spacing-md)}.article-meta{flex-direction:column;align-items:flex-start;gap:var(--spacing-xs)}.card{min-height:350px}.card-footer{flex-direction:column;align-items:flex-start;gap:var(--spacing-sm)}.article-tags{width:100%}.article-images{flex-direction:column;align-items:center;gap:var(--spacing-sm)}.image-container{max-width:100%;min-width:unset}.article-tags{justify-content:flex-start;width:100%}.featured-article{margin:0 var(--spacing-sm);max-width:calc(100% - var(--spacing-md))}.article-content{margin:var(--spacing-sm) 0}.article-excerpt,.article-full-content{padding:var(--spacing-sm)}.read-more-toggle{font-size:var(--font-size-xs);padding:var(--spacing-sm);width:100%;justify-content:center}.load-more-button{width:100%;max-width:300px;font-size:var(--font-size-sm)}.media-item.card,.card.media-item{min-height:400px!important}.media-item .card-footer,.card.media-item .card-footer{flex-direction:column;align-items:flex-start;gap:var(--spacing-sm)}}@media (max-width:480px){:root{--media-grid-gap:var(--spacing-sm)}.container{padding:0 var(--spacing-sm)}.media-controls{padding:var(--spacing-sm);margin-bottom:var(--spacing-md)}.filter-label{font-size:var(--font-size-xs)}.filter-select{padding:var(--spacing-sm);font-size:var(--font-size-sm)}.section-title{font-size:var(--font-size-lg);gap:var(--spacing-xs)}.article-date,.article-category{font-size:var(--font-size-xs)}.source-info{font-size:var(--font-size-xxs)}.tag{font-size:10px;padding:2px var(--spacing-xs)}.featured-article{margin:0;max-width:100%}.media-grid{gap:var(--spacing-md)}.card{min-height:300px}.media-item.card,.card.media-item{min-height:350px!important}}@media (max-width:360px){.media-controls{margin:var(--spacing-sm) 0;padding:var(--spacing-xs)}.filter-bar{gap:var(--spacing-sm)}.card{box-shadow:var(--shadow-sm);border:1px solid var(--image-border-color)}.read-more-toggle{font-size:12px;padding:var(--spacing-xs)}.load-more-button{font-size:var(--font-size-xs);padding:var(--spacing-sm) var(--spacing-md)}}.media-item,.card,.read-more-toggle,.load-more-button,.image-container{will-change:transform}.media-item,.card{contain:layout style}.image-container{contain:layout}.media-item:not(:hover):not(:focus),.card:not(:hover),.read-more-toggle:not(:hover):not(:focus),.load-more-button:not(:hover):not(:focus),.image-container:not(:hover){will-change:auto}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important;scroll-behavior:auto!important}.media-item:hover,.card:hover,.image-container:hover{transform:none}.read-more-toggle:hover i,.load-more-button:hover i{transform:none}}@media (prefers-contrast:high){.image-container{border-width:3px}.card{border:2px solid var(--color-gray-dark)}.read-more-toggle,.load-more-button{border:2px solid var(--color-primary)}.filter-select{border-width:3px}}@media (hover:none) and (pointer:coarse){.filter-select{padding:var(--spacing-md);font-size:16px}.read-more-toggle,.load-more-button{min-height:var(--preferred-touch-target,48px);padding:var(--spacing-md)}.media-item:active{transform:scale(.98);transition-duration:0.1s}.read-more-toggle:active,.load-more-button:active{transform:scale(.96);transition-duration:0.1s}.media-item:hover{transform:none}.image-container:hover{transform:none;border-color:var(--image-border-color)}}@media print{.skip-links,.media-controls,.load-more-section{display:none!important}.media-grid{display:block}.media-item{break-inside:avoid;margin-bottom:var(--spacing-lg);box-shadow:none;border:1px solid #000}.image-container{border:1px solid #000}.read-more-toggle,.article-tags{display:none}.article-full-content{max-height:none!important;opacity:1!important;display:block!important}}.media-item[style*="display: none"]{display:none!important;visibility:hidden!important;opacity:0!important;height:0!important;margin:0!important;padding:0!important;border:none!important;overflow:hidden!important}.media-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:var(--spacing-xl);align-items:stretch}.media-item{transition:opacity 0.3s ease,transform 0.3s ease}.media-item[aria-hidden="true"]{opacity:0;transform:scale(.95);pointer-events:none}.media-item[aria-hidden="false"]{opacity:1;transform:scale(1);pointer-events:auto}.filter-select{cursor:pointer;transition:all 0.3s ease}.filter-select:focus,.filter-select:active{border-color:var(--color-primary);box-shadow:0 0 0 3px rgb(205 0 11 / .2);outline:none}.debug-mode .media-item{border:2px solid #fff0}.debug-mode .media-item[aria-hidden="false"]{border-color:green}.debug-mode .media-item[aria-hidden="true"]{border-color:red}@media (max-width:768px){.media-grid{grid-template-columns:1fr;gap:var(--spacing-md)}}