:root{--j-navy:#062f52;--j-blue:#075783;--j-red:#063f69;--j-ink:#172837;--j-muted:#687987;--j-line:#dfe7ed;--j-soft:#f4f7f9;--j-white:#fff;--j-radius:22px;--j-shadow:0 18px 48px rgba(16,52,76,.10)}*,*::before,*::after{box-sizing:border-box}.j-company-page{overflow:hidden}.j-container{width:min(1180px,calc(100% - 32px));margin-inline:auto}.j-company-intro{position:relative;padding:88px 0 78px;color:#fff;background:radial-gradient(circle at 85% 12%,rgba(31,132,183,.30),transparent 31%),linear-gradient(125deg,#031d33,#063f69 58%,#075f91)}.j-company-intro::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}.j-company-intro .j-container{position:relative}.j-hero-box{max-width:880px;margin:0 auto 42px;text-align:center}.j-eyebrow{display:inline-flex;align-items:center;gap:10px;color:#8cc9e8;font-size:.76rem;font-weight:800;letter-spacing:.17em;text-transform:uppercase}.j-eyebrow::before{content:"";width:34px;height:2px;background:currentColor}.j-hero-box h1{margin:14px 0 22px;color:#fff;font-size:clamp(2.45rem,5vw,4.65rem);font-weight:800;letter-spacing:-.045em;line-height:1.04}.j-hero-box .lead{margin:0 auto 18px;color:rgba(255,255,255,.90);font-size:clamp(1.06rem,2vw,1.25rem)}.j-hero-box p:not(.lead){max-width:740px;margin-inline:auto;color:rgba(255,255,255,.72)}
.j-sales-panel{max-width:1040px;margin:0 auto;padding:34px;border:1px solid rgba(255,255,255,.20);border-radius:22px;background:rgba(255,255,255,.10);box-shadow:0 25px 60px rgba(0,0,0,.20);backdrop-filter:blur(14px)}.j-sales-copy{max-width:800px;margin:0 auto 27px;text-align:center}.j-sales-copy__eyebrow{display:inline-block;margin-bottom:8px;color:#8cc9e8;font-size:.72rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.j-sales-copy h2{margin:0 0 11px;color:#fff;font-size:clamp(1.5rem,3vw,2.25rem);font-weight:800}.j-sales-copy p{margin:0;color:rgba(255,255,255,.76);line-height:1.72}.j-country-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}.j-country-card{overflow:hidden;text-align:center;transition:.2s}.j-country-card:hover{transform:translateY(-3px)}.j-country-card__flag{display:grid;place-items:center;height:120px;}.j-country-card__flag img{display:block;width:100%;height:100%;object-fit:contain}.j-country-card strong{display:block;padding:9px 5px 10px;color:#fff;font-size:.78rem}.j-sales-action{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:29px}.j-button{display:inline-flex;align-items:center;justify-content:center;gap:11px;min-height:52px;padding:0 22px;border:1px solid var(--j-red);border-radius:11px;background:var(--j-red);color:#fff;font-weight:800;text-decoration:none;transition:.2s}.j-button:hover{color:#fff;background:#062f52;transform:translateY(-2px)}.j-button--secondary{border-color:rgba(255,255,255,.42);background:transparent}.j-button--secondary:hover{border-color:#fff;background:#fff;color:var(--j-navy)}
.j-values{padding:76px 0;background:#fff}.j-value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.j-value-card{position:relative;height:100%;padding:34px;overflow:hidden;border:1px solid var(--j-line);border-radius:18px;background:#fff;box-shadow:0 10px 30px rgba(16,52,76,.06);transition:.25s}.j-value-card::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--j-red)}.j-value-card:hover{transform:translateY(-5px);box-shadow:var(--j-shadow)}.j-value-card small{color:var(--j-red);font-weight:900}.j-value-card h2{margin:8px 0 12px;color:var(--j-navy);font-size:1.5rem}.j-value-card p{margin:0;color:var(--j-muted)}.j-company-text{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:52px;padding-top:42px;border-top:1px solid var(--j-line)}.j-company-text p{margin:0;color:#536573}.j-sites{padding:78px 0 96px;background:var(--j-soft)}.j-section-header{max-width:780px;margin:0 auto 46px;text-align:center}.j-section-header .j-eyebrow{color:var(--j-red)}.j-section-header h2{margin:12px 0;color:var(--j-navy);font-size:clamp(2rem,4vw,3.15rem);font-weight:800}.j-section-header p{color:var(--j-muted)}.j-site-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.j-site-card{position:relative;min-height:390px;overflow:hidden;border-radius:var(--j-radius);background:var(--j-navy);box-shadow:var(--j-shadow)}.j-site-card img{display:block;width:100%;height:100%;min-height:390px;object-fit:cover;transition:.6s}.j-site-card::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(3,29,51,.94),rgba(3,29,51,.46) 42%,transparent 72%)}.j-site-card:hover img{transform:scale(1.035)}.j-site-content{position:absolute;z-index:2;inset:auto 0 0;padding:34px;color:#fff}.j-site-content span{color:#8cc9e8;font-size:.7rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.j-site-content h3{margin:7px 0;color:#fff;font-size:1.55rem}.j-site-content p{margin:0;color:rgba(255,255,255,.76)}@media(max-width:991px){.j-country-grid{grid-template-columns:repeat(4,1fr)}}@media(max-width:900px){.j-value-grid,.j-company-text,.j-site-grid{grid-template-columns:1fr}}@media(max-width:575px){.j-company-intro{padding:60px 0 52px}.j-values,.j-sites{padding:55px 0 65px}.j-sales-panel{padding:22px 15px}.j-country-grid{grid-template-columns:repeat(2,1fr)}.j-sales-action{flex-direction:column}.j-button{width:100%}.j-site-card,.j-site-card img{min-height:330px}.j-site-content{padding:24px}}

/* ==========================================================
   Responsive Korrekturen fuer Tablet und Smartphone
   ========================================================== */
@media (max-width: 991px) {
    .j-company-intro {
        padding: 64px 0 58px;
    }

    .j-sales-panel {
        width: 100%;
    }

    .j-country-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 18px 12px;
    }

    .j-country-card__flag {
        width: 100%;
        height: auto;
        aspect-ratio: 1 / 1;
        max-width: 112px;
        margin-inline: auto;
    }

    .j-country-card__flag img {
        width: 100%;
        height: 100%;
        max-width: 112px;
        max-height: 112px;
        object-fit: contain;
    }
}

@media (max-width: 767px) {
    .j-container {
        width: min(100% - 24px, 1180px);
    }

    .j-company-intro {
        padding: 34px 0 42px;
    }

    .j-hero-box {
        margin-bottom: 28px;
    }

    .j-hero-box h1 {
        margin: 10px 0 14px;
        font-size: clamp(2rem, 9vw, 2.65rem);
        line-height: 1.08;
    }

    .j-hero-box .lead {
        margin-bottom: 12px;
        font-size: 1rem;
        line-height: 1.6;
    }

    .j-hero-box p:not(.lead) {
        font-size: .94rem;
        line-height: 1.6;
    }

    .j-sales-panel {
        padding: 24px 16px 20px;
        border-radius: 18px;
        backdrop-filter: none;
    }

    .j-sales-copy {
        margin-bottom: 24px;
    }

    .j-sales-copy h2 {
        font-size: clamp(1.55rem, 7vw, 2rem);
        line-height: 1.15;
    }

    .j-sales-copy p {
        font-size: .94rem;
        line-height: 1.6;
    }

    .j-country-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px 14px;
        align-items: start;
    }

    .j-country-card {
        min-width: 0;
    }

    .j-country-card__flag {
        width: min(100%, 128px);
        max-width: 128px;
        height: auto;
        aspect-ratio: 1 / 1;
        margin-inline: auto;
    }

    .j-country-card__flag img {
        display: block;
        width: 100% !important;
        height: 100% !important;
        max-width: 128px;
        max-height: 128px;
        object-fit: contain;
    }

    .j-country-card strong {
        padding: 7px 3px 0;
        font-size: .78rem;
        line-height: 1.25;
    }

    .j-sales-action {
        flex-direction: column;
        gap: 11px;
        margin-top: 28px;
    }

    .j-button {
        width: 100%;
        min-height: 52px;
        padding: 10px 16px;
        text-align: center;
        line-height: 1.25;
    }

    .j-values,
    .j-sites {
        padding: 52px 0 64px;
    }

    .j-value-card {
        padding: 26px 24px;
    }

    .j-company-text {
        margin-top: 36px;
        padding-top: 32px;
    }
}

@media (max-width: 479px) {
    .j-container {
        width: calc(100% - 16px);
    }

    .j-company-page {
        /* Platz fuer die mobile, feststehende Shop-Navigation */
        padding-bottom: 72px;
    }

    .j-company-intro {
        padding-top: 20px;
    }

    .j-eyebrow {
        gap: 7px;
        font-size: .68rem;
        letter-spacing: .13em;
    }

    .j-eyebrow::before {
        width: 22px;
    }

    .j-hero-box h1 {
        font-size: clamp(1.75rem, 8.5vw, 2.15rem);
    }

    .j-sales-panel {
        padding: 22px 12px 18px;
    }

    .j-sales-copy__eyebrow {
        font-size: .66rem;
        letter-spacing: .12em;
    }

    .j-country-grid {
        gap: 18px 10px;
    }

    .j-country-card__flag {
        width: min(100%, 112px);
        max-width: 112px;
    }

    .j-country-card__flag img {
        max-width: 112px;
        max-height: 112px;
    }

    .j-site-card,
    .j-site-card img {
        min-height: 310px;
    }

    .j-site-content {
        padding: 22px 20px;
    }
}

/* FINAL: EINHEITLICHES JONGEN-BLAU */
:root {
    --j-red: #063f69;
    --j-accent: #063f69;
    --j-accent-hover: #062f52;
    --j-accent-active: #031d33;
    --j-accent-light: #8cc9e8;
}

/* Helle Akzente auf dem dunklen Hero fuer ausreichend Kontrast */
.j-company-intro .j-eyebrow,
.j-sales-copy__eyebrow {
    color: var(--j-accent-light);
}

/* Einheitliche Karten im Inhaltsbereich */
.j-value-card {
    border: 1px solid var(--j-line);
    border-left: 4px solid var(--j-accent);
    border-radius: 8px;
    box-shadow: none;
}
.j-value-card::before {
    display: none;
}
.j-value-card small,
.j-section-header .j-eyebrow {
    color: var(--j-accent);
}
.j-value-card:hover {
    border-color: #c2d4de;
    border-left-color: var(--j-accent-hover);
    box-shadow: 0 10px 28px rgba(6, 63, 105, .10);
}

/* Primaerbutton im gleichen Dunkelblau */
.j-button {
    border-color: var(--j-accent);
    background: var(--j-accent);
    border-radius: 8px;
    box-shadow: none;
}
.j-button:hover,
.j-button:focus-visible {
    border-color: var(--j-accent-hover);
    background: var(--j-accent-hover);
    transform: none;
}
.j-button:active {
    border-color: var(--j-accent-active);
    background: var(--j-accent-active);
}

/* Sekundaerbutton bleibt auf dem Hero transparent */
.j-button--secondary {
    border-color: rgba(255,255,255,.42);
    background: transparent;
}
.j-button--secondary:hover,
.j-button--secondary:focus-visible {
    border-color: #fff;
    background: #fff;
    color: var(--j-navy);
}

/* Standortkarten: Akzent ebenfalls blau statt rot/pink */
.j-site-content span {
    color: var(--j-accent-light);
}

