.group_wrap{width: 100%;overflow: hidden;}
:root{
    --w1300:130.2rem;
}
.group_wrap .grup_grid{width: var(--w1300); margin-left: auto;display: grid;grid-template-columns: repeat(3, 1fr);}
.group_wrap .grup_box{position: relative;overflow: hidden;}
.group_wrap .grup_box>figure{display: grid;clip-path: polygon(100% 0, 100% 97.2%, 94.4% 100%, 0 100%, 0 0);}
.group_wrap .grup_box>figure>*{grid-area:1/1;}
.group_wrap .grup_box>figure>figcaption { display: flex; width: 100%; align-items: flex-end;padding: 4.1rem 3.9rem;}
.group_wrap .grup_box>figure>figcaption blockquote{font-size: var(--font-24);color: var(--white);font-weight: bold;font-family: var(--font-zalando);line-height: 1;}
/* .group_wrap .grup_box:hover blockquote{color: var(--color-e5);} */

.group_fact{margin-block:1.9rem 10.6rem;}
.group_fact .fact_grid{display: grid;grid-template-columns:auto var(--w1300);grid-gap: 6.5rem;align-items: flex-end;}
.group_fact .text_box{padding-left: var(--left100);}
.group_fact .text_box h1{font-size: var(--font-24);color: var(--black);font-weight: bold;font-family: var(--font-zalando);margin-bottom: 2.4rem;}
.group_fact .text_box h2{font-size: var(--font-30);font-family: var(--font-zalando); color: var(--black);font-weight: 500;margin: 0;}
.group_fact .text_box h2 span{color: var(--color-e5);}
.group_fact .fact_box{position: relative;}
.group_fact .fact_box .vhline{position: absolute;left: 0;top: 0;height: 100%;}
.group_fact .fact_box .vhline img{height: 100%;}
.group_fact ul{display: grid;grid-template-columns: repeat(4, 1fr);padding-inline:10.1rem 0;}
.group_fact ul li:not(:first-child){padding-inline: 4.5rem;position: relative;}
.group_fact ul li:not(:first-child)::before{width: .1rem; height:calc(100% - 1rem); background: rgb(0 0 0 / 12%); position: absolute; left: 0; top: 1rem; content: "";}
.group_fact ul li .counter, .group_fact ul li .counter sup{font-size: var(--font-42);font-family: var(--font-zalando); color: var(--color-e5);font-weight: bold;display: flex;align-items: center;line-height: 1;}
.group_fact ul li .counter sup{margin: 0;position: static;}
.group_fact ul li h3{font-size: var(--font-18);color: var(--black);font-family: var(--font-zalando); font-weight:300;margin-block: 1rem 0;line-height: 1.67;}
.group_fact ul li h3 span{display: block;}


/* new css starts here */
.group_wrap .grup_box>figure>figcaption {
    display: flex;
    width: 100%;
    align-items: flex-start;
    padding: 4.1rem 3.9rem;
    flex-direction: column;
    justify-content: flex-end;
        position: relative;
    z-index: 99;
}
.grup_box_content h3 {
    color: var(--white);
}
.grup_box_content {
    opacity: 0;
    visibility: hidden;
    max-height: 0;
    overflow: hidden;
    transform: translateY(30px);
    transition: opacity .8s ease, transform .8s ease, max-height .8s ease, visibility 0s linear .8s;
    padding: 0;
}

.group_wrap .grup_box:hover .grup_box_content {
    opacity: 1;
    visibility: visible;
    max-height: 40rem;
    transform: translateY(0);
    transition: opacity .8s ease, transform .8s ease, max-height .8s ease;
}
.grup_box_content h3 {
    padding: 5rem 0;
    margin: 0;
    font-size: var(--font-30);
    font-weight: 300;
}
.grup_box_content span{
    font-size: var(--font-16);
    color: var(--white);
    font-weight: 500;
    border-bottom: 2px dotted #FFDF01;
}
.group_wrap .grup_box figure:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #E50019;
    opacity: 0;
    visibility: hidden;
    z-index: -1;
transition: opacity .8s ease, transform .8s ease, max-height .8s ease, visibility 0s linear .8s;
}
.group_wrap .grup_box:hover figure:after{
    opacity: 1;
    visibility: visible;
    z-index: 1;
    transition: opacity .8s ease, transform .8s ease, max-height .8s ease;
}

/* new css ends here */


@media (max-width:2150px) {
    :root { --w1300: 121.2rem; }
}/*-----2150px-end----------*/

@media (max-width:1950px) {
    :root { --w1300: 107.2rem; }
    .group_fact ul { padding-inline: 7.1rem 0; }
}/*-----1950px-end----------*/

@media (max-width:1760px) {
    :root { --w1300:97rem; }
    .group_fact ul li:not(:first-child) { padding-inline: 3.5rem; }
}/*-----1760px-end----------*/

@media (max-width:1649px) {
    .group_fact .text_box { padding-right:3rem; }
   .group_fact { margin-block:0rem 6rem; }
}/*-----1649px-end----------*/

@media (max-width:1450px) {
    .group_fact .text_box { padding-right: 4rem; }
}/*-----1450px-end----------*/

@media (max-width:1399px) {
    :root { --w1300: 102rem; }
    .group_fact ul { padding-inline: 5.1rem 0; }
    .group_fact .text_box { padding-right: 1rem; }
    .group_fact { margin-block: 0rem 4rem; }
}/*-----1399px-end----------*/
@media (max-width:1280px) {
    :root { --w1300:100rem; }
    .group_fact .text_box { padding-right: 0rem; }
    .group_fact .text_box h2 span br{display: none;}
}/*-----1280px-end----------*/
@media (max-width:1199px) {
    .group_fact .fact_grid {grid-gap: 3.5rem;}
    :root { --w1300: 91rem; }
   .group_fact ul li:not(:first-child) { padding-inline: 2.5rem; }
}/*-----1199px-end----------*/
@media (max-width:991px) {
    .group_wrap { width: 100%; overflow: hidden; padding-top: 9.6rem; }
    :root { --w1300:100%; }
    .group_wrap .grup_grid{width: 100%;grid-template-columns: repeat(3, 1fr);}
    .group_fact .fact_grid{grid-template-columns: repeat(1, 1fr);padding-block: 3rem; grid-gap: 2.5rem;}
    .group_fact .text_box h1{margin-bottom: 1.5rem;}
    .group_fact .text_box h2 br{display: none;}
    .group_fact ul { padding-inline: 0; grid-template-columns: repeat(2, 1fr); gap: 2rem; grid-auto-rows: 1fr;}
    .group_fact .fact_box .vhline{display: none;}
    .group_fact .fact_box ul li{border: .1rem solid rgb(0 0 0 / 12%);padding:2rem;text-align: center;}
    .group_fact ul li .counter, .group_fact ul li .counter sup{justify-content: center;}
    .group_fact ul li:not(:first-child)::before{display: none;}
    .group_fact .text_box { padding-right: 0rem; text-align: center; }
    .group_fact .text_box h2{line-height: 1.5;}
    footer .right, footer .ftr_grid{justify-content: center;}
    footer .social-icons { gap: 0.5rem; order: 2; }
    footer .ftr_grid { gap: 1rem; padding-block: 2rem; }
    .group_fact { margin-block: 0rem 1rem; }
    .group_wrap .grup_box>figure>figcaption { padding:2.5rem 2rem; }
    .group_fact ul li h3 span{display: inline;}
}/*-----991px-end----------*/
@media (max-width:767px) {
    .group_wrap .grup_grid{width: 100%;grid-template-columns: repeat(1, 1fr);grid-gap:1.5rem;}
    .group_fact ul { gap: 1.5rem; }
    .group_wrap .grup_box>figure>figcaption {justify-content: center;}
}/*-----767px-end----------*/
@media (max-width:575px) {
    .group_fact ul {grid-template-columns: repeat(1, 1fr);}
    .group_fact .fact_grid { grid-template-columns: repeat(1, 1fr); padding-block: 2rem 3rem; grid-gap: 2rem; }
    .group_fact { margin-block:0rem; }
}/*-----575px-end----------*/
@media (max-width:350px) {
}/*-----350px-end----------*/