/* Общие стили */
*{margin:0;padding:0;box-sizing:border-box;}
body{
    font-family:'Inter',sans-serif;
    background:#ffffff;
    color:#0f172a;
    line-height:1.6;
}
.container{
    max-width:1000px;
    margin:0 auto;
    padding:20px;
}

/* Hero Image */
.hero-img{
    border-radius:26px;
    overflow:hidden;
    margin-bottom:25px;
    box-shadow:0 15px 40px rgba(0,0,0,0.08);
}
.hero-img img{
    width:100%;
    height:500px; /* увеличиваем высоту */
    object-fit:cover;
    object-position:center top;
    display:block;
}

/* Hero Text */
.hero-text{
    max-width:90%;
    margin:0 auto 35px auto;
    text-align:center;
}
.hero-title{
    font-size:28px;
    font-weight:800;
    line-height:1.4;
    word-wrap:break-word;
    margin-bottom:16px;
    text-align:center;
}
.highlight{
    color:#25D366;
}
.sub{
    font-size:16px;
    margin-bottom:28px;
    color:#1e293b;
    line-height:1.5;
    text-align:center;
}

/* CTA */
.cta{
    display:inline-block;
    padding:16px 40px;
    border-radius:50px;
    background:#25D366;
    color:#fff;
    text-decoration:none;
    font-weight:700;
    font-size:16px;
    box-shadow:0 10px 30px rgba(37,211,102,0.35);
    transition:.3s;
}
.cta:active{
    transform:scale(0.97);
}

/* Section */
.section{
    margin-top:50px;
}
.section-title{
    font-size:20px;
    font-weight:700;
    margin-bottom:20px;
    text-align:center;
}
.blocks{
    display:flex;
    flex-direction:column;
    gap:18px;
}
.block{
    display:flex;
    gap:14px;
    padding:18px;
    border-radius:20px;
    background:#E6F4EA;
    transition:.2s;
}
.block:hover{
    transform:translateY(-2px);
    background:#D4F1D2;
}
.block i{
    font-size:20px;
    color:#25D366;
    min-width:24px;
    margin-top:3px;
}
.block h3{
    font-size:15px;
    font-weight:700;
    margin-bottom:4px;
}
.block p{
    font-size:14px;
    color:#334155;
}

/* Online Counter */
.online{
    margin:50px 0;
    text-align:center;
    font-size:14px;
    font-weight:600;
    color:#128C7E;
}

/* Desktop */
@media(min-width:768px){
    .hero-img img{
        height:650px; /* ещё больше для десктопа */
    }
    .hero-title{
        font-size:44px;
        line-height:1.3;
    }
    .sub{
        font-size:18px;
    }
    .section-title{
        font-size:22px;
    }
    .blocks{
        max-width:800px;
        margin:0 auto;
        gap:20px;
    }
    .block{
        padding:22px;
        gap:16px;
        border-radius:22px;
    }
    .block i{
        font-size:22px;
    }
    .block h3{
        font-size:16px;
    }
    .block p{
        font-size:15px;
    }
    .cta{
        font-size:18px;
        padding:18px 50px;
    }
}