.kolumnyHeaderPionBlock {
display: flex;
padding-top: 100px;
padding-bottom: 100px;
flex-direction: column;
position: relative;
}
.kolumnyHeaderPionBlockItem .content {
display: flex;
flex-direction: column;
gap: 20px;
}
.kolumnyHeaderPionBlockItem {
display: flex;
flex-direction: column;
gap: 80px;
}
.kolumnyHeaderPionBlockItem .content h1 {
color: var(--Color-Base-Volt-Yellow, #FFF01A);
text-align: center;
leading-trim: both;
text-edge: cap;
font-family: Tomorrow;
font-size: 42px;
font-style: normal;
font-weight: 700;
line-height: normal;
margin-bottom: 0px;
margin-top: 0px;
}
.kolumnyHeaderPionBlockItem .content p {
color: var(--Color-Base-White, #FFF);
text-align: center;
leading-trim: both;
text-edge: cap;
font-family: Inter;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: normal;
margin-bottom: 0px;
margin-top: 0px;
}
.kolumnyHeaderPionBlockItem .kolumns-container {
display: flex;
gap: 80px;
}
.kolumnyHeaderPionBlockItem .kolumns-container .kolumnaItem {
position: relative;
}
.kolumnyHeaderPionBlock::after {
content: "";
width: 100%;
height: 19px;
background-size: contain;
content: "";
right: 0px;
bottom: -15px;
position: absolute;background-repeat: no-repeat;
background-image: url('data:image/svg+xml,');
}
.kolumnyHeaderPionBlockItem .kolumns-container .kolumnaItem:not(:last-of-type)::after {
height: 100%;
width: 19px;
background-size: contain;
content: "";
right: -50px;
top: 0px;
position: absolute;background-repeat: no-repeat;
background-image: url('data:image/svg+xml,');
}
/* .kolumnyHeaderPionBlockItem .kolumns-container .kolumnaItem::after {
content: "";
display: flex;
width: 44px;
height: 40px;
padding: var(--Spacing-4, 16px) var(--Spacing-System-spacing-16, 16px);
align-items: center;
gap: 8px;
aspect-ratio: 11/10;
background-repeat: no-repeat;
background-position: center;
position: absolute;
top: 10px;
right: 10px;
background-image: url('data:image/svg+xml,');
} */
/* .kolumnyHeaderPionBlockItem .kolumns-container .kolumnaItem:hover::after{
background-image: url('data:image/svg+xml,');
} */
.kolumnyHeaderPionBlockItem .kolumns-container .kolumnaItem {
display: flex;
/* padding: 28px; */
flex-direction: column;
justify-content: flex-start;
align-items: center;
text-align: center;
position: relative;
gap: 6px;
flex: 1 0 0;background: var(--Color-Base-Black, #090D08);
color: var(--Color-Base-White, #FFF);
leading-trim: both;
text-edge: cap;
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 150%; /* 24px */
text-decoration: none;
}
.kolumnyHeaderPionBlockItem .kolumns-container .kolumnaItem h3 {
color: var(--Color-Base-White, #FFF);
text-align: center;
font-family: Tomorrow;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 140%; /* 33.6px */
letter-spacing: 0.48px;
text-transform: uppercase;
}
.kolumnyHeaderPionBlockItem .kolumns-container .kolumnaItem span {
color: var(--Color-Base-Cool-Surface, #D8F2D9);
text-align: center;
leading-trim: both;
text-edge: cap;
font-family: Inter;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 27px */
}
.kolumnyHeaderPionBlockItem .btnPrimary {
margin: auto;
}
/* .kolumnyHeaderPionBlockItem .kolumns-container .kolumnaItem:hover {
color: var(--Color-Base-Cool-Surface, #D8F2D9);
leading-trim: both;
text-edge: cap;
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 150%; /* 24px */
@media (max-width: 781px) {
.kolumnyHeaderPionBlock {
display: flex
;
padding-top: 50px;
padding-bottom: 50px;
flex-direction: column;
position: relative;
}
.kolumnyHeaderPionBlock::after {
background-image: url('data:image/svg+xml,');
}
.kolumnyHeaderPionBlockItem .content h1 {
color: var(--Color-Base-Volt-Yellow, #FFF01A);
text-align: center;
leading-trim: both;
text-edge: cap;
font-family: Tomorrow;
font-size: 36px;
font-style: normal;
font-weight: 700;
line-height: normal;
}
.kolumnyHeaderPionBlockItem .content p {
color: var(--Color-Base-White, #FFF);
margin-top: 0px;
text-align: center;
leading-trim: both;
text-edge: cap;
font-family: Inter;
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: normal;
}
.kolumnyHeaderPionBlockItem .kolumns-container {
display: flex
;
gap: 40px;
flex-direction: column;
}
.kolumnyHeaderPionBlockItem .kolumns-container .kolumnaItem h3 {
color: var(--Color-Base-White, #FFF);
text-align: center;
font-family: Tomorrow;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: 140%; /* 33.6px */
letter-spacing: 0.48px;
text-transform: uppercase;
}
.kolumnyHeaderPionBlockItem .kolumns-container .kolumnaItem span {
color: var(--Color-Base-Cool-Surface, #D8F2D9);
text-align: center;
leading-trim: both;
text-edge: cap;
font-family: Inter;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 27px */
}
}