/* Ergebnisköpfe, Bilanz und Teamfoto. Vor frontend.css laden.
   Die Kartenhülle und sämtliche Ergebnislisten bleiben unangetastet. */
@font-face {
    font-family: SportDisplay;
    src: url("fonts/barlow-condensed-black-italic.ttf") format("truetype");
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

.ssg-card .ssg-event-hero > .ssg-card-head {
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 0 0 16px;
    padding: 20px;
    min-width: 0;
    color: #fff;
    background: repeating-linear-gradient(125deg, transparent 0 58px, #ffffff0a 59px 60px),
        linear-gradient(120deg, #152a50 0%, #09598a 65%, #0870b0 100%);
    border-top: 4px solid #9ac9e8;
    border-radius: 0;
}
.ssg-card .ssg-event-hero > .ssg-card-head > .ssg-wk-logo-wrap {
    box-sizing: border-box;
    flex: 0 0 96px;
    width: 96px !important;
    height: 96px !important;
    padding: 10px;
    border: 1px solid #e7edf2;
    border-radius: 0;
    background: #fff;
    box-shadow: 4px 4px 0 #152a5080;
}
.ssg-card .ssg-event-hero > .ssg-card-head > .ssg-wk-logo-wrap > .ssg-wk-logo {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 0;
}
.ssg-card .ssg-event-hero > .ssg-card-head > .ssg-card-info { flex: 1; min-width: 0; }
.ssg-card .ssg-event-hero > .ssg-card-head > .ssg-card-info > h4 {
    margin: 0;
    font-family: SportDisplay, Impact, sans-serif;
    font-style: italic;
    font-weight: 900;
    font-size: clamp(28px, 3vw, 42px) !important;
    line-height: 1.02;
    color: #fff;
    overflow-wrap: anywhere;
}
.ssg-card .ssg-event-hero > .ssg-card-head > .ssg-card-info > .ssg-location {
    margin: 9px 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: #fff;
    overflow-wrap: anywhere;
}

.ssg-card .ssg-event-hero > .ssg-section:has(> .ssg-medal-spiegel) {
    margin: 0 0 16px;
    padding: 12px;
    background: #edf5fb;
    border: 1px solid #bed8ed;
    border-radius: 0;
    box-shadow: none;
}
.ssg-card .ssg-event-hero > .ssg-section:has(> .ssg-medal-spiegel) > .ssg-section-label {
    margin: 0 0 8px;
    font-size: 10px;
    letter-spacing: .12em;
    color: #152a50;
    opacity: 1;
}
.ssg-card .ssg-medal-spiegel {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
}
.ssg-card .ssg-medal-spiegel .ssg-mb-big {
    box-sizing: border-box;
    flex: 0 1 auto !important;
    min-width: 0;
    max-width: 100%;
    gap: 10px;
    padding: 7px 12px;
    border: 1px solid var(--result-badge-accent, #9ac9e8);
    border-left-width: 4px;
    border-radius: 0;
    background: var(--result-badge-bg, #fff);
    color: var(--result-badge-ink, #152a50);
    box-shadow: none;
}
.ssg-card .ssg-medal-spiegel .ssg-mb-big .ssg-mb-label {
    min-width: 0;
    font-size: 10px;
    line-height: 1.3;
    letter-spacing: .08em;
    overflow-wrap: anywhere;
    opacity: 1;
}
.ssg-card .ssg-medal-spiegel .ssg-mb-big .ssg-mb-count {
    flex-shrink: 0;
    font: italic 900 30px/1 SportDisplay, Impact, sans-serif;
    font-variant-numeric: tabular-nums;
}
.ssg-card .ssg-medal-spiegel .ssg-mb-big.ssg-mb-gold { --result-badge-bg: #f4dfaa; --result-badge-accent: #a97818; }
.ssg-card .ssg-medal-spiegel .ssg-mb-big.ssg-mb-silber { --result-badge-bg: #e7edf2; --result-badge-accent: #708398; }
.ssg-card .ssg-medal-spiegel .ssg-mb-big.ssg-mb-bronze { --result-badge-bg: #f3dfce; --result-badge-accent: #a26636; }
.ssg-card .ssg-medal-spiegel .ssg-mb-big.ssg-mb-djr { --result-badge-bg: #0870b0; --result-badge-accent: #9ac9e8; --result-badge-ink: #fff; }
.ssg-card .ssg-medal-spiegel .ssg-mb-big.ssg-mb-vr { --result-badge-bg: #152a50; --result-badge-accent: #9ac9e8; --result-badge-ink: #fff; }
.ssg-card .ssg-medal-spiegel .ssg-mb-big.ssg-mb-rekorde { --result-badge-bg: #dceefa; --result-badge-accent: #0870b0; }
.ssg-card .ssg-medal-spiegel .ssg-mb-big.ssg-mb-wa600 { --result-badge-bg: #fff; --result-badge-accent: #152a50; }

.ssg-card > .ssg-photo-trigger {
    box-sizing: border-box;
    display: block;
    width: calc(100% - 8px);
    max-width: calc(100% - 8px);
    margin: 16px 8px 24px 0;
    padding: 20px;
    aspect-ratio: auto;
    height: auto !important;
    border: 0;
    border-top: 5px solid #9ac9e8;
    border-radius: 0;
    background: linear-gradient(125deg, #0870b0, #152a50 80%);
    box-shadow: 8px 8px 0 #152a5080;
    text-decoration: none;
}
.ssg-card > .ssg-photo-trigger > img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto !important;
    max-height: none;
    aspect-ratio: auto;
    object-fit: contain;
    object-position: center;
    border-radius: 0;
}
.ssg-card > .ssg-photo-trigger::after {
    content: 'Unser Team. Unser Element.';
    display: block;
    padding: 12px 10px;
    background: #152a50;
    color: #fff;
    font: italic 900 clamp(20px, 2vw, 28px)/1.1 SportDisplay, Impact, sans-serif;
    overflow-wrap: anywhere;
}
.ssg-card > .ssg-photo-trigger:focus-visible { outline: 3px solid #0870b0; outline-offset: 4px; }

@media (max-width: 600px) {
    .ssg-card .ssg-event-hero > .ssg-card-head { gap: 12px; padding: 14px; }
    .ssg-card .ssg-event-hero > .ssg-card-head > .ssg-wk-logo-wrap {
        flex-basis: 72px;
        width: 72px !important;
        height: 72px !important;
        padding: 7px;
    }
    .ssg-card .ssg-medal-spiegel .ssg-mb-big { padding: 6px 9px; gap: 7px; }
    .ssg-card .ssg-medal-spiegel .ssg-mb-big .ssg-mb-count { font-size: 26px; }
    .ssg-card > .ssg-photo-trigger { padding: 12px; }
}
@container ssg-wettkampf (width < 480px) {
    .ssg-card .ssg-event-hero > .ssg-card-head { flex-wrap: wrap; gap: 12px; padding: 14px; }
    .ssg-card .ssg-event-hero > .ssg-card-head > .ssg-card-info { flex-basis: 100%; }
    .ssg-card .ssg-event-hero > .ssg-card-head > .ssg-wk-logo-wrap {
        flex-basis: 72px;
        width: 72px !important;
        height: 72px !important;
        padding: 7px;
    }
    .ssg-card .ssg-medal-spiegel .ssg-mb-big .ssg-mb-count { font-size: 26px; }
    .ssg-card > .ssg-photo-trigger { padding: 12px; }
}
.ssg-card .ssg-event-hero > .ssg-section > .ssg-medal-spiegel {gap:8px;}

/* Wettkampfname und Bilanz bilden eine gemeinsame Bühne. */
.ssg-card > .ssg-event-hero{position:relative;isolation:isolate;overflow:hidden;margin-bottom:18px;border-top:5px solid #9ac9e8;background:repeating-linear-gradient(125deg,transparent 0 58px,#ffffff0a 59px 60px),linear-gradient(120deg,#152a50,#09598a 65%,#0870b0);}
.ssg-card .ssg-event-hero > .ssg-card-head{margin:0;padding-bottom:14px;border:0;background:transparent;}
.ssg-card .ssg-event-hero > .ssg-section:has(> .ssg-medal-spiegel){margin:0;padding:0 20px 20px;border:0;background:transparent;}
.ssg-card .ssg-event-hero > .ssg-section:has(> .ssg-medal-spiegel)>.ssg-section-label{color:#fff;letter-spacing:.14em;}
.ssg-card .ssg-medal-spiegel .ssg-mb-big{padding:10px 14px;gap:12px;border-bottom-width:3px;}
.ssg-card .ssg-medal-spiegel .ssg-mb-big .ssg-mb-count{font-size:36px;}
.ssg-card .ssg-medal-spiegel .ssg-mb-big .ssg-mb-label{max-width:180px;line-height:1.4;}
.ssg-card .ssg-medal-spiegel .ssg-mb-big.ssg-mb-gold{background:linear-gradient(125deg,#c99a35 0%,#fff0ae 35%,#deb64f 62%,#f4d98b 100%);color:#3d2b09;border-color:#c49630;box-shadow:inset 0 1px 0 #fff4c9,0 3px 8px #152a5026;}
.ssg-card .ssg-medal-spiegel .ssg-mb-big.ssg-mb-silber{background:linear-gradient(125deg,#b0becc 0%,#fff 35%,#b7c7d6 65%,#edf3f8 100%);color:#152a50;border-color:#94a7b9;box-shadow:inset 0 1px 0 #fff,0 3px 8px #152a5026;}
.ssg-card .ssg-medal-spiegel .ssg-mb-big.ssg-mb-bronze{background:linear-gradient(125deg,#d39a6b 0%,#ffe1bc 35%,#d99d6c 65%,#efc199 100%);color:#3d210f;border-color:#bc7d48;box-shadow:inset 0 1px 0 #ffead3,0 3px 8px #152a5026;}
@media(max-width:600px){.ssg-card .ssg-event-hero > .ssg-section:has(> .ssg-medal-spiegel){padding:0 14px 14px;}.ssg-card .ssg-medal-spiegel .ssg-mb-big{padding:8px 10px;gap:9px;}.ssg-card .ssg-medal-spiegel .ssg-mb-big .ssg-mb-count{font-size:30px;}}