#benefits {
    --color-yellow: #fdc50e;
    --color-brown: #4a2e20;
    --color-dark-brown: #3a1c0e;
    --color-orange: #ff8400;

    font-family: "Roboto";
    color: #4a2e20;
}

#benefits .zajima-btn {
    background-color: var(--color-orange);
    color: var(--color-dark-brown);
    font-family: 'Knofedt', sans-serif;
    font-weight: bold;
    text-transform: uppercase;
    font-size: clamp(1rem, 5.5vw, 3rem);
    padding: 5px 45px;
    border: none;
    border-radius: 999px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}
#benefits .zajima-btn:hover {
    background-color: var(--color-orange);
}

#benefits h2.jakto-nadpis {
    font-family: 'Knofedt', sans-serif;
    font-size: 65px;
    color: var(--color-brown);
    text-transform: uppercase;
}

#benefits .jakto-blok .cislo {
    color: var(--color-yellow);
    min-width: 40px;
    height: 40px;
    padding: 5px;
}

#benefits .jakto-blok p {
    font-size: 18px;
    font-weight: 600;
}

#benefits .jak-to-funguje {
    padding: 10px 20px;
}

#benefits .jak-to-funguje .sales {
    margin-top: 0px;
    margin-bottom: 15px;
    padding-left: 15px;
    font-size: 14px;
    list-style-type: disc;
    list-style-position: outside;
    font-weight: 600;
}

#benefits .jak-to-funguje .sales li {
    margin: 0px;
}

#benefits .jak-to-funguje .sales li:before {
    content: "";
    margin: 0;
}

#benefits .jak-to-funguje .p-ul p {
    margin-bottom: 0;
}

#benefits .jakto-mala {
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
}

#benefits .jakto-box{
    position:relative;
    display:flex;
    flex-wrap:nowrap;
    justify-content:space-between;
    align-items:center;
    gap:40px;
    background:#47bfff;
    border-radius:28px;
    padding:40px;
    overflow:hidden;
    margin:60px 0 0 0;
    max-width:none;
    color:#fff;
    font-family:"Knofedt",sans-serif
}
#benefits .jakto-box::before{
    content:"";
    position:absolute;
    top:-450px;
    left:-450px;
    width:1000px;
    height:1000px;
    background-image:url('/user/documents/theme/benefits-blue-bg.png');
    background-size:cover;
    background-repeat:no-repeat;
    pointer-events:none
}

#benefits .jakto-box-levy,
#benefits .jakto-box-pravy{
    position:relative;
    z-index:1;
    color:#fff;
    flex:0 0 calc(50% - 20px);
    min-width:0;
    box-sizing:border-box;
    text-align:left
}
#benefits .jakto-box-levy{
    font-size:65px;
    line-height:1.05;
    text-shadow:none;
    font-weight: 300;
    padding-bottom: 20px;
}
#benefits .jakto-box-pravy{
    font-size:18px;
    line-height:1.5
}
#benefits .jakto-tlacitko{
    display:inline-block;
    margin-top:16px;
    padding:5px 45px;
    border-radius:999px;
    background: var(--color-orange);
    color:#fff;
    text-decoration:none;
    font-weight:700;
    font-size:22px;
}

#benefits .jakto-tlacitko:hover
{
    text-decoration: underline;
}

#benefits .jakto-box-levy span.yellow{
    color:var(--color-yellow);
    background-color: transparent;
}

#benefits .jakto-box-pravy span.big {
    text-transform: uppercase;
    font-size: 35px;
    line-height: 1;
}

#benefits .jakto-box-pravy div.small {
    margin-top: 10px;
    font-family: "Roboto";
    font-size: 16px;
    line-height: 1;
    font-weight: 500;
}

#benefits .faq-chat h2 {
    font-family: "Knofedt", sans-serif;
    font-size: 55px;
    color: var(--color-brown);
    text-transform: uppercase;
    line-height: 1;
    margin: 0;
}

#benefits .faq-chat {
    text-align: center;
    padding-top: 0;
}

#benefits .faq-chat .questions {
    display: inline-block;
    font-family: "Knofedt", sans-serif;
    font-size: 55px;
    color: #30a506;
    text-transform: uppercase;
    background-color: #ddf65c;
    padding: 0px 40px 15px;
    border-radius: 999px;
    margin: 10px auto;
    line-height: 1;
}

#benefits .faq-chat .message-row {
    text-align: left;
    font-family: "Roboto";
}

#benefits .faq-chat .message-row .message .bubble {
    font-weight: 600;
    max-width: 450px;
}

#benefits .faq-chat .message-row .message.user .bubble {
    font-size: 22px;
    color: #fff;
}

#benefits .faq-chat .message-row .message.bot .bubble {
    text-align: left;
}

#benefits .faq-chat .message-row .message.user img {
    margin-top: 20px;
}

#benefits .faq-chat .message-row .message.bot img {
    margin-top: 10px;
}

#benefits .faq-chat .message-row .message.user .bubble.purple { background-color: #caa7f9; }
#benefits .faq-chat .message-row .message.user .bubble.green { background-color: #ddf65c; color: #30a506; }
#benefits .faq-chat .message-row .message.user .bubble.blue { background-color: #0cb1d6; }
#benefits .faq-chat .message-row .message.user .bubble.brown { background-color: #a36643; }

#benefits .faq-footer h3 {
    font-family: "Knofedt", sans-serif;
    font-size: 50px;
    text-transform: uppercase;
}

#benefits .ask-field {
    max-width: 600px;
}

#benefits .ask-field input {
    font-size: 20px;
}

#benefits .ask-field input::placeholder {
    color: #fff;
}

#benefits .ask-field img {
    width: 40px;
    height: 40px;
}

@media (min-width: 768px) {
    body.in-vernostni-program #action-stripe {
        margin-top: 170px !important;
    }
}

@media (max-width:900px){
    #benefits .jakto-box{flex-wrap:wrap;gap:20px}
    #benefits .jakto-box-levy,
    #benefits .jakto-box-pravy{flex:0 0 100%}
    #benefits .jakto-box::before{top:-200px;left:-300px;width:700px;height:700px;opacity:.3}
}

@media (max-width: 768px) {
    #benefits .jakto-box-levy {
        font-size: 55px;
    }
}
