

.hero {
    position:            relative;
    min-height:          400px;
    background-image:    var(--hero-image, none);
    background-size:     cover;
    background-position: center;
    background-repeat:   no-repeat;
}

.hero__title {
    position:    absolute;
    top:         20px;
    right:       20px;
    max-width:   calc(100% - 40px);
    margin:      0;
    font-family: var(--font-heading);
    font-size:   var(--fs-h1);
    font-style:  italic;
    font-weight: var(--fw-semibold);
    line-height: 48px;
    color:       var(--color-green);
    text-align:  left;
    animation:   hero-title-in .6s ease both;
}

@keyframes hero-title-in {
    from { opacity: 0; transform: translateX(40px); }
    to   { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    .hero__title { animation: none; }
}

@media (max-width: 1024px) {
    .hero { min-height: 300px; }

    .hero__title {
        top:         15px;
        right:       15px;
        max-width:   calc(100% - 30px);
        font-size:   32px;
        line-height: 36px;
    }
}

@media (max-width: 767px) {
    .hero { min-height: 250px; }

    .hero__title {
        top:         10px;
        right:       10px;
        max-width:   calc(100% - 20px);
        font-size:   var(--fs-base);
        line-height: 24px;
    }
}

.about {
    padding: 40px 0 60px;
}

.about__wrp {
    display:     flex;
    align-items: center;
    gap:         20px;
}

.about__content,
.about__media {
    flex: 1 1 50%;
    min-width: 0;
}

.about__title {
    margin:         0;
    font-family:    var(--font-heading);
    font-size:      var(--fs-display);
    font-weight:    var(--fw-semibold);
    line-height:    62px;
    letter-spacing: 8.25px;
    color:          var(--color-black);
}

.about__subtitle {
    margin:         20px 0 0;
    font-family:    var(--font-heading);
    font-size:      var(--fs-base);
    font-weight:    var(--fw-semibold);
    line-height:    24px;
    letter-spacing: 3.6px;
    text-transform: uppercase;
    color:          var(--color-text-soft);
}

.about__tabs    { margin-top: 40px; }

.about__tablist {
    display:   flex;
    flex-wrap: wrap;
}

.about__tab {
    flex:           1 1 auto;
    padding:        15px 0;
    font-family:    var(--font-heading);
    font-size:      var(--fs-sm);
    font-weight:    var(--fw-semibold);
    line-height:    16px;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-align:     center;
    color:          var(--color-muted);
    background:     none;
    border-bottom:  3px solid #D7D7D7;
    cursor:         pointer;
    transition:     color var(--transition), border-color var(--transition);
}
.about__tab:hover      { color: var(--color-black); }
.about__tab.is-active  {
    color:        var(--color-yellow);
    border-color: var(--color-yellow);
}

.about__panels {
    display: grid;
}
.about__panel {
    grid-area:  1 / 1;
    opacity:    0;
    visibility: hidden;
    transition: opacity var(--transition);
    pointer-events: none;
}
.about__panel.is-active {
    opacity:    1;
    visibility: visible;
    pointer-events: auto;
}

.about__text {
    margin:      20px 0 0;
    font-size:   var(--fs-base);
    line-height: 32px;
    color:       var(--color-text-soft);
}
.about__text p { margin: 0; }

.about__btn {
    display:       inline-block;
    margin-top:    20px;
    padding:       10px 20px;
    font-family:   var(--font-heading);
    font-size:     var(--fs-lead);
    font-weight:   var(--fw-semibold);
    line-height:   24px;
    color:         var(--color-white);
    background:    var(--color-red-bright);
    border-radius: 10px;
    transition:    background-color var(--transition);
}
.about__btn:hover { background: var(--color-yellow); }

.about-slider__main { margin: 0; }

.about-slider__slide img,
.about-slider__img {
    width:      100%;
    height:     300px;
    object-fit: cover;
    border:     2px solid var(--color-yellow);
}

.about-slider__thumbs { margin-top: 4px; }

.about-slider__thumb {
    padding: 0 2px;
    cursor:  pointer;
}
.about-slider__thumb img {
    width:      100%;
    height:     80px;
    object-fit: cover;
    opacity:    .6;
    border:     2px solid var(--color-yellow);
    transition: opacity var(--transition);
}
.about-slider__thumb.slick-current img,
.about-slider__thumb:hover img { opacity: 1; }

.about-slider .slick-slide { height: auto; }
.about-slider .slick-list  { overflow: hidden; }

@media (max-width: 1024px) {
    .about__wrp   { flex-direction: column; align-items: stretch; }
    .about__title { font-size: 42px; line-height: 48px; letter-spacing: 6px; }
}

@media (max-width: 767px) {
    .about        { padding: 30px 0 40px; }
    .about__title { font-size: 32px; line-height: 38px; letter-spacing: 4px; }
    .about__subtitle { letter-spacing: 2px; }

    .about__media  { order: 1; }
    .about__content{ order: 2; }

    .about__tablist {
        flex-wrap:   nowrap;
        overflow-x:  auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .about__tablist::-webkit-scrollbar { display: none; }
    .about__tab {
        flex:        0 0 auto;
        padding:     15px 14px;
        white-space: nowrap;
    }

    .about-slider__slide img,
    .about-slider__img { height: 220px; }
}

.top-products { padding: 60px 0; }

.top-products__title {
    margin:      0 0 20px;
    font-family: var(--font-heading);
    font-size:   var(--fs-h1);
    font-weight: var(--fw-semibold);
    line-height: 48px;
    color:       var(--color-black);
    text-align:  center;
}

.product-cards {
    position:   relative;
    list-style: none;
    margin:     0;
    padding:    0;
}

.product-cards .slick-track { display: flex; }
.product-cards .slick-slide { height: auto; }

.product-cards__arrow {
    width:      24px;
    height:     24px;
    color:      var(--color-brown);
    z-index:    90;
    transition: opacity var(--transition);
}
.product-cards__arrow:hover  { opacity: .7; }
.product-cards__arrow.slick-disabled { opacity: .3; cursor: default; }
.product-cards__arrow--prev  { left:  -30px; }
.product-cards__arrow--next  { right: -30px; }

@media (max-width: 1300px) {
    .product-cards__arrow--prev { left:  0; }
    .product-cards__arrow--next { right: 0; }
}
@media (max-width: 1024px) {
    .product-cards__arrow--prev { left:  -20px; }
    .product-cards__arrow--next { right: -20px; }
}
@media (max-width: 767px) {
    .product-cards__arrow--prev { left:  -15px; }
    .product-cards__arrow--next { right: -15px; }
}

.product-cards__item { padding: 10px; }

.product-card {
    display:         flex;
    flex-direction:  column;
    height:          100%;
    padding:         17px 15px;
    border:          2px solid var(--color-yellow);
    border-radius:   16px;
    color:           inherit;
    text-decoration: none;
}

.product-card__media { display: block; }
.product-card__img {
    display:    block;
    width:      100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

.product-card__title {
    display:     -webkit-box;
    margin-top:  20px;
    font-family: var(--font-accent);
    font-size:   24px;
    font-weight: var(--fw-semibold);
    line-height: 32px;
    color:       var(--color-red-bright);
    text-align:  center;
    min-height:  64px;
    overflow:    hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.product-card__price {
    display:     block;
    margin-top:  20px;
    font-family: var(--font-heading);
    font-size:   var(--fs-lead);
    font-weight: var(--fw-semibold);
    line-height: 24px;
    color:       var(--color-brown);
    text-align:  center;
}

.product-card__btn {
    display:        inline-flex;
    align-items:    center;
    justify-content:center;
    align-self:     center;
    margin-top:     20px;
    padding:        10px 20px;
    font-family:    var(--font-heading);
    font-size:      var(--fs-lead);
    font-weight:    var(--fw-semibold);
    line-height:    24px;
    color:          var(--color-white);
    background:     var(--color-red-bright);
    border-radius:  10px;
    transition:     background-color var(--transition);
}
.product-card:hover .product-card__btn { background: var(--color-yellow); }

@media (max-width: 1024px) {
    .top-products { padding: 40px 0; }
}

@media (max-width: 767px) {
    .top-products { padding: 30px 0; }
    .top-products__title { font-size: 28px; line-height: 34px; }
}

.price__block { padding: 60px 0; }

.price__table {
    overflow-x:      auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.price__table::-webkit-scrollbar { display: none; }
.price__table table {
    width:           100%;
    border-collapse: collapse;
}
.price__table thead th {
    padding:     10px;
    background:  var(--color-border);
    color:       var(--color-text-soft);
    font-size:   var(--fs-base);
    font-weight: var(--fw-bold);
    text-align:  center;
    white-space: nowrap;
}
.price__table .jet-dynamic-table__col span {
    display:     block;
    font-size:   14px;
    font-weight: 400;
}
.price__table tbody td {
    padding:    5px;
    border:     1px solid var(--color-border);
    font-size:  var(--fs-base);
    color:      var(--color-black);
    text-align: center;
    white-space: nowrap;
}

.price__block tbody {
    position: relative;
}
.price__block tbody::after {
    content:        "";
    position:       absolute;
    bottom:         0;
    left:           0;
    width:          100%;
    height:         50px;
    background:     linear-gradient(to bottom, rgba(245, 243, 239, 0.2) 0%, rgba(245, 243, 239, 0.7) 60%, rgba(245, 243, 239, 1) 100%);
    pointer-events: none;
}

.price__cta { margin-top: 20px; text-align: center; }
.price__btn {
    display:        inline-block;
    padding:        10px 20px;
    font-family:    var(--font-heading);
    font-size:      var(--fs-lead);
    font-weight:    var(--fw-semibold);
    line-height:    24px;
    color:          var(--color-white);
    background:     var(--color-red-bright);
    border-radius:  10px;
    transition:     background-color var(--transition);
}
.price__btn:hover { background: var(--color-yellow); }

@media (max-width: 1024px) {
    .price__block { padding: 40px 0; }
}
@media (max-width: 767px) {
    .price__block { padding: 30px 0; }
    .price__table th,
    .price__table td { font-size: var(--fs-sm); }
}

.news { padding: 40px 0 60px; }

.news-cards { position: relative; list-style: none; margin: 0; padding: 0; }
.news-cards .slick-track { display: flex; }
.news-cards .slick-slide { height: auto; }
.news-cards__item { padding: 10px; }

.news-cards__arrow {
    width:      24px;
    height:     24px;
    color:      var(--color-brown);
    z-index:    90;
    transition: opacity var(--transition);
}
.news-cards__arrow:hover  { opacity: .7; }
.news-cards__arrow.slick-disabled { opacity: .3; cursor: default; }
.news-cards__arrow--prev  { left:  -30px; }
.news-cards__arrow--next  { right: -30px; }

@media (max-width: 1300px) {
    .news-cards__arrow--prev { left:  0; }
    .news-cards__arrow--next { right: 0; }
}
@media (max-width: 1024px) {
    .news-cards__arrow--prev { left:  -20px; }
    .news-cards__arrow--next { right: -20px; }
}
@media (max-width: 767px) {
    .news-cards__arrow--prev { left:  -15px; }
    .news-cards__arrow--next { right: -15px; }
}

@media (max-width: 1024px) {
    .news { padding-top: 20px; }
}
@media (max-width: 767px) {
    .news { padding-bottom: 40px; }
}
