@font-face {
    font-family: "Roboto";
    src: url("../../fonts/roboto/Roboto-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Roboto";
    src: url("../../fonts/roboto/Roboto-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Roboto";
    src: url("../../fonts/roboto/Roboto-Black.ttf") format("truetype");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

.journey-page {
    --journey-primary: #553596;
    --journey-accent: #f51467;
    --journey-heading-gradient: linear-gradient(90deg, #57349a 0%, #9c278d 46%, #f51467 100%);
    --journey-text: #4a5579;
    --journey-muted: #69718e;
    --journey-bg: #fff7fb;
    --journey-soft-blue: #eaf7ff;
    --journey-white: #fff;
    --journey-title-size: clamp(54px, 5.4vw, 96px);
    --journey-section-title-size: clamp(30px, 3vw, 44px);
    --journey-body-size: clamp(14px, 1.45vw, 17px);
    --journey-radius-lg: 28px;
    --journey-radius-md: 18px;
    --journey-shadow: 0 18px 45px rgba(246, 38, 116, 0.12), 0 16px 38px rgba(82, 73, 160, 0.10);
    --journey-page-padding-top: 0px;
    color: var(--journey-text);
    background:
        radial-gradient(circle at 0% 24%, rgba(174, 225, 255, 0.30), transparent 24%),
        radial-gradient(circle at 100% 88%, rgba(255, 184, 220, 0.48), transparent 30%),
        linear-gradient(135deg, #f6fbff 0%, #fff 44%, #fff5fa 100%);
    font-family: "Roboto", Arial, Helvetica, sans-serif;
    overflow: hidden;
}

.journey-page *,
.journey-page *::before,
.journey-page *::after {
    box-sizing: border-box;
}

.journey-page__inner {
    max-width: 1450px;
    padding-top: var(--journey-page-padding-top);
    padding-bottom: clamp(42px, 6vw, 76px);
    position: relative;
}

.journey-page img {
    display: block;
    max-width: 100%;
}

.journey-page p,
.journey-page li,
.journey-page span,
.journey-page strong {
    color: inherit !important;
}

.journey-section-title {
    margin: 0;
    padding-top: 0.08em;
    padding-bottom: 0.04em;
    color: transparent !important;
    background: var(--journey-heading-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: var(--journey-section-title-size);
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: 0;
    text-align: center;
    text-transform: uppercase;
}

.journey-section-title span,
.journey-section-title strong {
    color: transparent !important;
}

.journey-compare__title {
    color: var(--journey-accent) !important;
}

@media (max-width: 767px) {
    .journey-page__inner {
        padding-inline: 10px;
    }
}
