/* Referenzgebundene Vorteile-Section: helle Buehne, gleichmaessiges Sechserraster. */
.advantages-reference{
    --advantages-gold:#f2ab00;
    --advantages-gold-bright:#ffbd12;
    --advantages-paper:#fbfaf7;
    --advantages-ink:#0a0d0e;
    --advantages-card:#111516;
    --advantages-card-text:#f7f6f1;
    --advantages-card-copy:#eef0ec;
    position:relative;
    isolation:isolate;
    width:100%;
    overflow:hidden;
    padding:var(--section-space-y) 0;
    background:
        radial-gradient(circle at 88% 14%,rgba(242,171,0,.045),transparent 25%),
        linear-gradient(180deg,#fff 0%,var(--advantages-paper) 100%);
    color:var(--advantages-ink);
}

.advantages-reference__inner{
    position:relative;
    z-index:2;
    width:min(calc(100% - 72px),1400px);
    margin-inline:auto;
}

.advantages-reference__header{max-width:1040px}

.advantages-reference__eyebrow{
    margin:0 0 16px;
    color:#dc9400;
    font-family:Poppins,Arial,sans-serif;
    font-size:16px;
    font-weight:700;
    line-height:1.25;
    letter-spacing:.35px;
    text-transform:uppercase;
}

.advantages-reference__header h2{
    max-width:900px;
    margin:0;
    color:#0b0e0f;
    font-family:Sora,Poppins,Arial,sans-serif;
    font-size:var(--type-section-title);
    font-weight:770;
    line-height:1.13;
    letter-spacing:-1.4px;
    text-transform:none;
    text-wrap:balance;
}

.advantages-reference__header h2 strong{
    color:var(--advantages-gold);
    font-weight:790;
}

.advantages-reference__lead{
    max-width:760px;
    margin:18px 0 0;
    color:#242725;
    font-size:var(--type-section-copy);
    font-weight:500;
    line-height:1.5;
}

.advantages-reference__grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    grid-auto-rows:1fr;
    gap:14px;
    margin-top:24px;
}

.advantages-reference__card{
    position:relative;
    box-sizing:border-box;
    display:flex;
    min-width:0;
    min-height:260px;
    flex-direction:column;
    overflow:hidden;
    padding:27px 30px 28px;
    border:1px solid rgba(255,255,255,.13);
    border-radius:var(--radius-ui);
    background:
        radial-gradient(circle at 92% 6%,rgba(242,171,0,.055),transparent 37%),
        linear-gradient(142deg,#191d1e 0%,var(--advantages-card) 66%,#0a0d0e 100%);
    color:var(--advantages-card-text);
    box-shadow:0 8px 20px rgba(16,18,15,.13);
}

.advantages-reference__card-heading{
    display:flex;
    min-width:0;
    align-items:flex-start;
    gap:24px;
}

.advantages-reference__icon-wrap{
    --advantages-icon-size:48px;
    --advantages-icon-scale:1;
    display:grid;
    width:72px;
    height:72px;
    flex:0 0 72px;
    place-items:center;
    color:var(--advantages-gold);
}

.advantages-reference__icon{
    display:block;
    width:var(--advantages-icon-size);
    height:var(--advantages-icon-size);
    max-width:100%;
    max-height:100%;
    overflow:visible;
    transform:scale(var(--advantages-icon-scale));
    transform-origin:center;
}

.advantages-reference__icon--systems{--advantages-icon-scale:.94}
.advantages-reference__icon--planning{--advantages-icon-scale:.9}
.advantages-reference__icon--communication{--advantages-icon-scale:.92}
.advantages-reference__icon--execution{--advantages-icon-scale:.88}
.advantages-reference__icon--handover{--advantages-icon-scale:.92}
.advantages-reference__icon--residential-commercial{--advantages-icon-scale:.9}

.advantages-reference__icon [style*="stroke:#000000"],
.advantages-reference__icon [stroke="#000000"],
.advantages-reference__icon [stroke="#000"]{
    stroke:currentColor!important;
}

.advantages-reference__icon [fill="#000000"],
.advantages-reference__icon [fill="#000"]{
    fill:currentColor!important;
}

.advantages-reference__title-group{
    display:flex;
    min-width:0;
    flex-direction:column;
    align-items:flex-start;
    padding-top:1px;
}

.advantages-reference__number{
    color:var(--advantages-gold);
    font-family:Sora,Poppins,Arial,sans-serif;
    font-size:17px;
    font-weight:720;
    line-height:1.2;
    letter-spacing:.15px;
}

.advantages-reference__card h3{
    margin:5px 0 0;
    color:#fff;
    font-family:Sora,Poppins,Arial,sans-serif;
    font-size:21px;
    font-weight:720;
    line-height:1.18;
    letter-spacing:-.35px;
    text-transform:none;
    text-wrap:balance;
}

.advantages-reference__card p{
    margin:17px 0 0;
    color:var(--advantages-card-copy);
    font-size:16px;
    font-weight:450;
    line-height:1.42;
}

.advantages-reference__cta{
    position:relative;
    box-sizing:border-box;
    display:grid;
    grid-template-columns:240px minmax(0,1fr) 310px;
    align-items:center;
    min-height:var(--section-cta-height);
    margin-top:18px;
    padding:0;
    overflow:hidden;
    border:0;
    border-radius:var(--radius-ui);
    background:linear-gradient(105deg,#121617 0%,#080b0c 100%);
    box-shadow:0 9px 20px rgba(44,34,8,.08);
}

.advantages-reference__cta-symbol,
.advantages-reference__cta p,
.advantages-reference__cta-divider,
.advantages-reference__cta-button{
    position:relative;
    z-index:1;
}

.advantages-reference__cta-symbol{
    position:relative;
    display:grid;
    align-self:stretch;
    min-height:var(--section-cta-height);
    overflow:hidden;
    place-items:center;
    color:#fff;
}

.advantages-reference__cta-symbol::before{
    content:"";
    position:absolute;
    inset:0 auto 0 0;
    width:128px;
    background:linear-gradient(135deg,var(--advantages-gold-bright),var(--advantages-gold));
    clip-path:polygon(0 0,100% 0,48% 100%,0 100%);
}

.advantages-reference__cta-symbol::after{
    content:"";
    position:absolute;
    top:-43px;
    right:26px;
    width:2px;
    height:190px;
    background:var(--advantages-gold);
    transform:rotate(31deg);
    transform-origin:center;
}

.advantages-reference__cta-zap{
    position:absolute;
    z-index:1;
    top:50%;
    left:64px;
    display:block;
    width:36px;
    height:36px;
    color:#111516;
    transform:translate(-50%,-50%);
}

.advantages-reference__cta p{
    max-width:780px;
    margin:0;
    padding:18px 34px;
    color:#f2f2ed;
    font-size:16px;
    font-weight:500;
    line-height:1.45;
}

.advantages-reference__cta-divider{display:none}

.advantages-reference__cta-button{
    display:flex;
    min-width:0;
    min-height:54px;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin:16px 20px 16px 0;
    padding:10px 21px 10px 29px;
    overflow:hidden;
    border:0;
    border-radius:var(--radius-ui);
    background:linear-gradient(135deg,var(--advantages-gold-bright),var(--advantages-gold));
    color:#0d1010;
    font-family:Poppins,Arial,sans-serif;
    font-size:16px;
    font-weight:760;
    line-height:1.2;
    transition:background .22s ease,color .22s ease;
}

.advantages-reference__cta-button::before{
    content:"";
    position:absolute;
    z-index:0;
    top:-55%;
    bottom:-55%;
    left:-55%;
    width:34%;
    opacity:0;
    background:linear-gradient(105deg,transparent,rgba(255,255,255,.82),transparent);
    filter:blur(4px);
    transform:translateX(-210%) skewX(-18deg);
    pointer-events:none;
}

.advantages-reference__cta-button span,
.advantages-reference__cta-arrow{position:relative;z-index:1}
.advantages-reference__cta-arrow{display:block;width:18px;height:18px;transition:transform .22s ease}
.advantages-reference__cta-button:hover{background:linear-gradient(135deg,#ffd158,var(--advantages-gold-bright))}
.advantages-reference__cta-button:hover::before{animation:advantages-reference-light-sweep 1.15s cubic-bezier(.35,0,.2,1) 1}
.advantages-reference__cta-button:hover .advantages-reference__cta-arrow{transform:translateX(4px)}

.advantages-reference__ornament{
    position:absolute;
    z-index:0;
    overflow:visible;
    fill:none;
    stroke:var(--advantages-gold);
    stroke-width:1.2;
    stroke-linecap:square;
    stroke-linejoin:miter;
    opacity:.62;
    pointer-events:none;
}

.advantages-reference__ornament-soft{opacity:.38}
.advantages-reference__ornament--top{top:-2px;right:4%;width:320px;height:300px}
.advantages-reference__ornament--bottom{right:0;bottom:16px;width:300px;height:210px;opacity:.28}

@keyframes advantages-reference-light-sweep{
    0%{left:-55%;opacity:0;transform:translateX(-210%) skewX(-18deg)}
    20%{opacity:.75}
    100%{left:145%;opacity:0;transform:translateX(210%) skewX(-18deg)}
}

@media (max-width:1280px){
    .advantages-reference{padding-block:var(--section-space-y)}
    .advantages-reference__inner{width:min(calc(100% - 56px),1400px)}
    .advantages-reference__header h2{font-size:var(--type-section-title);letter-spacing:-1px}
    .advantages-reference__grid{gap:12px}
    .advantages-reference__card{padding:25px 26px 26px}
    .advantages-reference__card-heading{gap:18px}
    .advantages-reference__icon-wrap{--advantages-icon-size:44px;width:64px;height:64px;flex-basis:64px}
    .advantages-reference__card h3{font-size:20px}
    .advantages-reference__card p{font-size:16px}
    .advantages-reference__cta{grid-template-columns:205px minmax(0,1fr) 280px}
    .advantages-reference__cta p{font-size:16px}
}

@media (max-width:1100px){
    .advantages-reference__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
    .advantages-reference__card{grid-column:auto;min-height:260px}
    .advantages-reference__cta{grid-template-columns:165px minmax(0,1fr) 245px}
    .advantages-reference__cta-symbol::before{width:82px}
    .advantages-reference__cta-symbol::after{right:24px}
    .advantages-reference__cta-zap{left:calc(50% + 18px)}
    .advantages-reference__cta p{padding-inline:24px;font-size:16px}
    .advantages-reference__cta-button{margin-right:14px;padding-inline:20px;font-size:15px}
}

@media (max-width:760px){
    .advantages-reference{padding:var(--section-space-y) 0}
    .advantages-reference__inner{width:min(calc(100% - 40px),1400px)}
    .advantages-reference__header{text-align:center}
    .advantages-reference__header h2{max-width:none;font-size:var(--type-section-title);line-height:1.17;letter-spacing:-.75px}
    .advantages-reference__lead{margin-inline:auto;font-size:var(--type-section-copy)}
    .advantages-reference__ornament{display:none}
    .advantages-reference__grid{grid-template-columns:1fr;max-width:620px;margin:30px auto 0}
    .advantages-reference__card{
        grid-column:auto;
        min-height:0;
        padding:26px 26px 28px;
        text-align:left;
    }
    .advantages-reference__cta{
        grid-template-columns:82px minmax(0,1fr);
        grid-template-areas:"symbol copy" "button button";
        margin-top:18px;
    }
    .advantages-reference__cta-symbol{grid-area:symbol;min-height:var(--section-cta-height)}
    .advantages-reference__cta-symbol::before{width:47px}
    .advantages-reference__cta-symbol::after{top:-28px;right:2px;height:150px}
    .advantages-reference__cta-zap{left:calc(50% + 16px);width:30px;height:30px}
    .advantages-reference__cta p{grid-area:copy;padding:18px;text-align:left}
    .advantages-reference__cta-divider{display:none}
    .advantages-reference__cta-button{grid-area:button;width:calc(100% - 28px);min-height:52px;margin:0 14px 14px;padding:14px 22px;font-size:16px}
}

@media (max-width:480px){
    .advantages-reference__inner{width:min(calc(100% - 32px),1400px)}
    .advantages-reference__eyebrow{font-size:14px}
    .advantages-reference__header h2{font-size:var(--type-section-title);line-height:1.18;letter-spacing:-.5px}
    .advantages-reference__header h2 br{display:block}
    .advantages-reference__lead{font-size:var(--type-section-copy);line-height:1.5}
    .advantages-reference__card{padding:24px 22px 26px;border:1px solid rgba(255,255,255,.13);border-radius:var(--radius-ui)}
    .advantages-reference__card-heading{gap:18px}
    .advantages-reference__icon-wrap{--advantages-icon-size:40px;width:58px;height:58px;flex-basis:58px}
    .advantages-reference__number{font-size:16px}
    .advantages-reference__card h3{font-size:21px}
    .advantages-reference__card p{font-size:16px}
    .advantages-reference__cta{grid-template-columns:82px minmax(0,1fr)}
    .advantages-reference__cta-symbol{min-height:72px}
    .advantages-reference__cta-zap{width:30px;height:30px}
    .advantages-reference__cta p{padding:18px;font-size:16px}
}

@media print{
    .advantages-reference__ornament{display:none}
    .advantages-reference__card,
    .advantages-reference__cta{break-inside:avoid;box-shadow:none}
}
