:root {
    --jt-cert-navy: #062f52;
    --jt-cert-blue: #075783;
    --jt-cert-red: #063f69;
    --jt-cert-red-dark: #062f52;
    --jt-cert-ink: #172837;
    --jt-cert-muted: #687987;
    --jt-cert-line: #dfe7ed;
    --jt-cert-soft: #f4f7f9;
    --jt-cert-white: #fff;
}

.jt-cert-page {
    margin: 0 -12px;
    overflow: hidden;
    background: #f5f8fa;
    color: var(--jt-cert-ink);
}

.jt-cert-container {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 20px;
}

.jt-cert-hero {
    position: relative;
    padding: 86px 0 68px;
    overflow: hidden;
    color: var(--jt-cert-white);
    text-align: center;
    background:
        radial-gradient(circle at 85% 12%, rgba(31, 132, 183, .30), transparent 31%),
        linear-gradient(125deg, #031d33, #063f69 58%, #075f91);
}

.jt-cert-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, .025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .025) 1px, transparent 1px);
    background-size: 44px 44px;
    pointer-events: none;
}

.jt-cert-hero__content {
    position: relative;
    z-index: 1;
    max-width: 860px;
}

.jt-cert-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #8cc9e8;
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .17em;
    text-transform: uppercase;
}

.jt-cert-kicker::before {
    content: "";
    width: 32px;
    height: 2px;
    background: currentColor;
}

.jt-cert-kicker--dark {
    color: var(--jt-cert-red);
}

.jt-cert-hero h1 {
    margin: 13px 0 16px;
    color: var(--jt-cert-white);
    font-size: clamp(2.35rem, 5vw, 4.4rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.045em;
}

.jt-cert-hero p {
    max-width: 760px;
    margin: 0 auto;
    color: rgba(255, 255, 255, .76);
    font-size: 1.08rem;
    line-height: 1.75;
}

.jt-cert-content {
    padding: 72px 0 92px;
}

.jt-cert-overview {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);
    gap: 28px;
    align-items: stretch;
}

.jt-cert-seal-card,
.jt-cert-download-card {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--jt-cert-line);
    border-radius: 22px;
    background: var(--jt-cert-white);
    box-shadow: 0 16px 50px rgba(19, 46, 67, .09);
}

.jt-cert-seal-card {
    display: grid;
    grid-template-columns: minmax(220px, 40%) 1fr;
    align-items: center;
    min-height: 430px;
    padding: 38px;
}

.jt-cert-seal-card__accent {
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: var(--jt-cert-red);
}

.jt-cert-card-label {
    display: inline-flex;
    position: absolute;
    z-index: 2;
    top: 24px;
    left: 28px;
    align-items: center;
    padding: 7px 11px;
    border-radius: 999px;
    background: #edf3f6;
    color: var(--jt-cert-navy);
    font-size: .69rem;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.jt-cert-seal-card__media {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 280px;
    padding: 40px 24px 10px 0;
}

.jt-cert-seal-card__media img {
    display: block;
    width: 100%;
    max-width: 270px;
    height: auto;
    object-fit: contain;
    filter: drop-shadow(0 14px 18px rgba(6, 47, 82, .12));
}

.jt-cert-seal-card__text {
    padding: 48px 0 0 30px;
    border-left: 1px solid var(--jt-cert-line);
}

.jt-cert-seal-card__text h2,
.jt-cert-download-card h2,
.jt-cert-text h2 {
    margin: 0;
    color: var(--jt-cert-navy);
    font-weight: 800;
    letter-spacing: -.028em;
}

.jt-cert-seal-card__text h2 {
    font-size: 1.65rem;
}

.jt-cert-seal-card__text p {
    margin: 14px 0 0;
    color: var(--jt-cert-muted);
    line-height: 1.72;
}

.jt-cert-download-card {
    padding: 72px 34px 34px;
    background:
        radial-gradient(circle at 100% 0, rgba(7, 87, 131, .10), transparent 37%),
        var(--jt-cert-white);
}

.jt-cert-download-card h2 {
    font-size: 1.75rem;
}

.jt-cert-download-card > p {
    margin: 11px 0 24px;
    color: var(--jt-cert-muted);
    line-height: 1.65;
}

.jt-cert-downloads {
    display: flex;
    flex-direction: column;
    gap: 13px;
}

.jt-cert-download {
    display: grid;
    grid-template-columns: 52px 1fr 20px;
    gap: 14px;
    align-items: center;
    min-height: 92px;
    padding: 14px 16px;
    border: 1px solid var(--jt-cert-line);
    border-radius: 15px;
    background: var(--jt-cert-white);
    color: var(--jt-cert-ink);
    text-decoration: none;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.jt-cert-download:hover,
.jt-cert-download:focus-visible {
    border-color: rgba(6, 63, 105, .38);
    color: var(--jt-cert-ink);
    text-decoration: none;
    box-shadow: 0 12px 28px rgba(19, 46, 67, .10);
    transform: translateY(-3px);
}

.jt-cert-download:focus-visible {
    outline: 3px solid rgba(6, 63, 105, .20);
    outline-offset: 3px;
}

.jt-cert-download__icon {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    border-radius: 12px;
    background: #f2f6f8;
    color: var(--jt-cert-red);
    font-size: 1.35rem;
}

.jt-cert-download__content small,
.jt-cert-download__content strong,
.jt-cert-download__content span {
    display: block;
}

.jt-cert-download__content small {
    margin-bottom: 2px;
    color: var(--jt-cert-red);
    font-size: .67rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.jt-cert-download__content strong {
    color: var(--jt-cert-navy);
    font-size: 1rem;
}

.jt-cert-download__content span {
    margin-top: 3px;
    color: var(--jt-cert-muted);
    font-size: .78rem;
}

.jt-cert-download__arrow {
    color: var(--jt-cert-red);
    transition: transform .2s ease;
}

.jt-cert-download:hover .jt-cert-download__arrow {
    transform: translateX(4px);
}

.jt-cert-text {
    display: grid;
    grid-template-columns: minmax(280px, .75fr) minmax(0, 1.25fr);
    gap: 70px;
    margin-top: 72px;
    padding: 54px;
    border: 1px solid var(--jt-cert-line);
    border-radius: 22px;
    background: var(--jt-cert-white);
    box-shadow: 0 12px 38px rgba(18, 52, 75, .06);
}

.jt-cert-text h2 {
    margin-top: 12px;
    font-size: clamp(1.8rem, 3vw, 2.55rem);
    line-height: 1.15;
}

.jt-cert-text__body {
    padding-left: 38px;
    border-left: 1px solid var(--jt-cert-line);
}

.jt-cert-text__body p {
    margin: 0 0 19px;
    color: var(--jt-cert-muted);
    line-height: 1.78;
}

.jt-cert-text__body p:last-child {
    margin-bottom: 0;
}

.jt-cert-text__body .jt-cert-lead {
    color: var(--jt-cert-ink);
    font-size: 1.08rem;
    font-weight: 700;
}

.jt-cert-trust {
    position: relative;
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 22px;
    align-items: center;
    margin-top: 30px;
    padding: 26px 32px;
    overflow: hidden;
    border: 0;
    border-radius: 18px;
    background:
        radial-gradient(circle at 92% 15%, rgba(40, 132, 183, .22), transparent 34%),
        linear-gradient(125deg, #031d33 0%, #063f69 58%, #075f91 100%);
    box-shadow:
        0 16px 38px rgba(3, 29, 51, .18),
        inset 0 1px 0 rgba(255, 255, 255, .08);
}

.jt-cert-trust::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    left: 0;
    height: 4px;
    background: linear-gradient(90deg, #063f69, #8cc9e8 42%, rgba(6, 63, 105, 0));
}

.jt-cert-trust::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, .025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .025) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
}

.jt-cert-trust__icon {
    position: relative;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 64px;
    height: 64px;
    border: 1px solid rgba(255, 255, 255, .20);
    border-radius: 15px;
    background: linear-gradient(145deg, #063f69, #062f52);
    color: #fff !important;
    font-size: 1.2rem;
    box-shadow:
        0 10px 24px rgba(6, 63, 105, .30),
        inset 0 1px 0 rgba(255, 255, 255, .22);
}

.jt-cert-trust__icon i,
.jt-cert-trust__icon svg {
    color: #fff !important;
    fill: currentColor;
}

.jt-cert-trust > div {
    position: relative;
    z-index: 2;
    min-width: 0;
}

.jt-cert-trust strong,
.jt-cert-trust span {
    display: block;
}

.jt-cert-trust strong {
    margin: 0;
    color: #fff;
    font-size: 1.08rem;
    font-weight: 800;
    line-height: 1.35;
    letter-spacing: -.01em;
}

.jt-cert-trust span {
    margin-top: 6px;
    color: rgba(255, 255, 255, .74);
    font-size: .95rem;
    line-height: 1.55;
}

.jt-cert-trust strong {
    color: var(--jt-cert-navy);
    font-size: 1.05rem;
}

.jt-cert-trust span {
    margin-top: 4px;
    color: var(--jt-cert-muted);
    line-height: 1.55;
}

@media (max-width: 991px) {
    .jt-cert-overview {
        grid-template-columns: 1fr;
    }

    .jt-cert-text {
        grid-template-columns: 1fr;
        gap: 30px;
        padding: 40px;
    }

    .jt-cert-text__body {
        padding: 30px 0 0;
        border-top: 1px solid var(--jt-cert-line);
        border-left: 0;
    }
}

@media (max-width: 700px) {
    .jt-cert-hero {
        padding: 64px 0 52px;
    }

    .jt-cert-content {
        padding: 50px 0 68px;
    }

    .jt-cert-seal-card {
        grid-template-columns: 1fr;
        padding: 66px 24px 28px;
    }

    .jt-cert-seal-card__media {
        min-height: 220px;
        padding: 8px;
    }

    .jt-cert-seal-card__media img {
        max-width: 230px;
    }

    .jt-cert-seal-card__text {
        padding: 27px 0 0;
        border-top: 1px solid var(--jt-cert-line);
        border-left: 0;
        text-align: center;
    }

    .jt-cert-download-card {
        padding: 70px 22px 24px;
    }

    .jt-cert-text {
        margin-top: 45px;
        padding: 31px 24px;
    }
}

@media (max-width: 575px) {
    .jt-cert-page {
        margin: 0;
    }

    .jt-cert-container {
        padding: 0 15px;
    }

    .jt-cert-hero h1 {
        font-size: 2.35rem;
    }

    .jt-cert-download {
        grid-template-columns: 48px 1fr;
        padding: 13px;
    }

    .jt-cert-download__icon {
        width: 48px;
        height: 48px;
    }

    .jt-cert-download__arrow {
        display: none;
    }

    .jt-cert-trust {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 28px 22px;
        text-align: center;
    }

    .jt-cert-trust__icon {
        width: 58px;
        height: 58px;
        margin: 0 auto;
    }

    .jt-cert-trust strong {
        font-size: 1rem;
    }

    .jt-cert-trust span {
        font-size: .9rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .jt-cert-download,
    .jt-cert-download__arrow {
        transition: none;
    }
}

/* FINAL: EINHEITLICHES JONGEN-BLAU */
.jt-cert-page {
    --jg-accent: #063f69;
    --jg-accent-hover: #062f52;
    --jg-accent-active: #031d33;
    --jg-accent-light: #8cc9e8;
}

.jt-cert-seal-card, .jt-cert-download-card, .jt-cert-text, .jt-cert-trust { border-radius: 8px !important; box-shadow: none !important; }
.jt-cert-seal-card, .jt-cert-download-card, .jt-cert-text { border: 1px solid #d7e4e7 !important; border-left: 4px solid #063f69 !important; }
.jt-cert-seal-card__accent { display: none !important; }
.jt-cert-download { border-radius: 8px !important; border-left: 4px solid #063f69 !important; }
.jt-cert-download:hover { transform: none !important; border-color: #c2d4de !important; border-left-color: #062f52 !important; box-shadow: none !important; }
.jt-cert-download__icon { background: #f2f6f8 !important; color: #063f69 !important; border-radius: 8px !important; }
.jt-cert-trust::before { background: #063f69 !important; }
.jt-cert-trust__icon { background: #063f69 !important; background-image: none !important; box-shadow: none !important; border-radius: 8px !important; }


/* =========================================================
   PATCH 2026-10-26
   Verhindert abgeschnittene Ueberschriften in der Siegelkarte
   und verbessert die responsive Aufteilung.
   ========================================================= */

/* Alle Grid-Kinder duerfen innerhalb ihrer Spalte schrumpfen. */
.jt-cert-overview,
.jt-cert-seal-card,
.jt-cert-download-card,
.jt-cert-seal-card__media,
.jt-cert-seal-card__text {
    min-width: 0;
    box-sizing: border-box;
}

/* Der Zertifikatskarte etwas mehr Platz als der Downloadkarte geben. */
.jt-cert-overview {
    grid-template-columns: minmax(0, 1.16fr) minmax(340px, .84fr);
}

/* Fixe Prozentbreiten vermeiden, weil Padding sonst die Karte verbreitert. */
.jt-cert-seal-card {
    grid-template-columns: minmax(190px, .88fr) minmax(245px, 1.12fr);
    width: 100%;
    max-width: 100%;
    padding: 38px 34px;
}

.jt-cert-seal-card__media {
    padding: 42px 28px 12px 0;
}

.jt-cert-seal-card__media img {
    max-width: 245px;
}

.jt-cert-seal-card__text {
    width: 100%;
    max-width: 100%;
    padding: 44px 0 0 28px;
    overflow: visible;
}

/* Lange deutsche und franzoesische Begriffe bleiben in der Textspalte. */
.jt-cert-seal-card__text h2 {
    max-width: 100%;
    font-size: clamp(1.35rem, 1.7vw, 1.65rem);
    line-height: 1.18;
    overflow-wrap: anywhere;
    word-break: normal;
    hyphens: auto;
}

.jt-cert-seal-card__text p {
    max-width: 100%;
    overflow-wrap: break-word;
}

/* Trust-Text wieder hell darstellen. Die vorherigen doppelten Regeln
   am Dateiende hatten die weisse Schrift ueberschrieben. */
.jt-cert-trust strong {
    color: #fff;
    font-size: 1.08rem;
}

.jt-cert-trust span {
    margin-top: 6px;
    color: rgba(255, 255, 255, .74);
}

@media (max-width: 1100px) and (min-width: 992px) {
    .jt-cert-overview {
        grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
        gap: 20px;
    }

    .jt-cert-seal-card {
        grid-template-columns: minmax(170px, .8fr) minmax(220px, 1.2fr);
        padding: 34px 26px;
    }

    .jt-cert-seal-card__media {
        padding-right: 22px;
    }

    .jt-cert-seal-card__text {
        padding-left: 22px;
    }

    .jt-cert-seal-card__text h2 {
        font-size: 1.4rem;
    }
}

@media (max-width: 991px) {
    .jt-cert-overview {
        grid-template-columns: minmax(0, 1fr);
    }

    .jt-cert-seal-card {
        grid-template-columns: minmax(210px, .8fr) minmax(0, 1.2fr);
    }

    .jt-cert-seal-card__text h2 {
        font-size: clamp(1.45rem, 3vw, 1.7rem);
    }
}

@media (max-width: 700px) {
    .jt-cert-seal-card {
        grid-template-columns: minmax(0, 1fr);
        padding: 66px 24px 28px;
    }

    .jt-cert-seal-card__media {
        padding: 8px;
    }

    .jt-cert-seal-card__text {
        padding: 27px 0 0;
        overflow: visible;
    }

    .jt-cert-seal-card__text h2 {
        font-size: clamp(1.4rem, 6vw, 1.7rem);
        overflow-wrap: normal;
        hyphens: manual;
    }
}