/* Reset & Base */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; color: #e0e4ea; background: #0d1520; line-height: 1.6; font-size: 15px; -webkit-font-smoothing: antialiased; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
input { font-family: inherit; }

.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* ===== SITE HEADER ===== */
.site-header {
    position: absolute; top: 0; left: 0; right: 0; z-index: 10;
    background: transparent; color: #fff; padding: 0;
}
.site-header__inner {
    display: flex; align-items: center; height: 70px; gap: 0;
}
.logo {
    display: flex; align-items: center;
    margin-right: 40px; flex-shrink: 0;
}
.logo-img {
    height: 70px; width: auto;
    mix-blend-mode: screen;
}

/* Site Nav */
.site-nav { display: flex; align-items: center; gap: 0; margin-right: auto; }
.site-nav__link {
    padding: 18px 22px; font-size: 17px; font-weight: 500; color: #ccc;
    transition: color 0.2s; white-space: nowrap; text-transform: uppercase;
    letter-spacing: 0.5px;
}
.site-nav__link:hover { color: #F5A623; }

/* Header Right */
.site-header__right { display: flex; align-items: center; gap: 16px; }
.site-header__phones { display: flex; flex-direction: column; gap: 2px; }
.site-header__phone {
    font-size: 18px; font-weight: 600; color: #fff; white-space: nowrap;
    transition: color 0.2s;
}
.site-header__phone:hover { color: #F5A623; }

/* Social Icons */
.site-header__social { display: flex; gap: 8px; align-items: center; }
.social-icon { display: flex; align-items: center; transition: opacity 0.2s; }
.social-icon:hover { opacity: 0.75; }
.social-icon img { height: 38px; width: auto; border-radius: 50%; }

/* ===== HERO SECTION ===== */
.hero {
    position: relative; min-height: 660px; display: flex; align-items: flex-start;
    background: url('фон.png') center/cover no-repeat;
    overflow: hidden;
}
.hero__overlay {
    position: absolute; inset: 0;
    background: linear-gradient(135deg, rgba(20,40,80,0.72) 0%, rgba(20,40,80,0.60) 50%, rgba(20,40,80,0.44) 100%);
}
.hero__inner { position: relative; z-index: 1; padding: 90px 0 80px; }
.hero__title {
    font-size: 42px; font-weight: 700; color: #fff; line-height: 1.2;
    max-width: 650px; margin-bottom: 40px;
}
.hero__features { display: flex; gap: 48px; margin-bottom: 40px; }
.hero__feature {
    display: flex; align-items: center; gap: 12px; color: #fff; font-size: 14px;
}
.hero__feature-icon {
    width: 56px; height: 56px; flex-shrink: 0;
    background-size: contain; background-repeat: no-repeat; background-position: center;
    opacity: 0.9;
}
.hero__feature-icon--fleet {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56' fill='none' stroke='%23fff' stroke-width='1.5'%3E%3Crect x='4' y='20' width='36' height='20' rx='2'/%3E%3Ccircle cx='14' cy='42' r='5'/%3E%3Ccircle cx='34' cy='42' r='5'/%3E%3Cpath d='M40 28h10a2 2 0 012 2v10h-12'/%3E%3Ccircle cx='46' cy='42' r='5'/%3E%3Cpath d='M12 20v-8a2 2 0 012-2h16a2 2 0 012 2v8'/%3E%3Ccircle cx='22' cy='8' r='3'/%3E%3Cpath d='M19 8h6'/%3E%3C/svg%3E");
}
.hero__feature-icon--quality {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56' fill='none' stroke='%23fff' stroke-width='1.5'%3E%3Crect x='10' y='4' width='36' height='48' rx='3'/%3E%3Cline x1='18' y1='16' x2='38' y2='16'/%3E%3Cline x1='18' y1='24' x2='38' y2='24'/%3E%3Cline x1='18' y1='32' x2='30' y2='32'/%3E%3Cpath d='M30 38l4 4 8-8' stroke-width='2'/%3E%3C/svg%3E");
}
.hero__feature-icon--reliable {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56' fill='none' stroke='%23fff' stroke-width='1.5'%3E%3Cpath d='M28 4L6 16v14c0 12.6 9.4 24.4 22 28 12.6-3.6 22-15.4 22-28V16L28 4z'/%3E%3Cpath d='M20 28l6 6 12-12' stroke-width='2.5'/%3E%3C/svg%3E");
}
/* Wholesale Badge */
.hero__wholesale {
    text-align: center; margin-bottom: 24px;
}
.hero__wholesale-badge {
    display: inline-block; background: rgba(245,166,35,0.15);
    border: 2px solid #F5A623; color: #F5A623;
    font-size: 20px; font-weight: 700; padding: 12px 32px;
    border-radius: 50px; letter-spacing: 0.5px;
    backdrop-filter: blur(4px);
}

.hero__phone {
    font-size: 20px; color: rgba(255,255,255,0.85); font-weight: 400;
    text-align: center;
}
.hero__phone a {
    color: #F5A623; font-weight: 700; font-size: 24px;
    transition: color 0.2s; text-decoration: none;
}
.hero__phone a:hover { color: #fff; }

/* ===== DELIVERY TYPES SECTION ===== */
.delivery-types { padding: 50px 0; background: #111d2e; }
.delivery-grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
}
.delivery-card {
    position: relative; border-radius: 16px; overflow: hidden;
    aspect-ratio: 4/3; cursor: pointer;
    box-shadow: 0 2px 12px rgba(0,0,0,0.1);
    transition: transform 0.3s, box-shadow 0.3s;
}
.delivery-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 30px rgba(0,0,0,0.18);
}
.delivery-card img {
    width: 100%; height: 100%; object-fit: cover;
    display: block;
}
.delivery-card__label {
    position: absolute; bottom: 0; left: 0; right: 0;
    padding: 16px 20px;
    background: linear-gradient(transparent, rgba(0,0,0,0.7));
    color: #fff; font-size: 18px; font-weight: 600;
}

/* ===== MAIN CONTENT ===== */
.content { padding: 40px 0 50px; background: #0d1520; }

.section-title { font-size: 34px; font-weight: 800; margin-bottom: 32px; color: #fff; letter-spacing: -0.5px; text-align: center; }

/* ===== CATEGORY CARDS ===== */
.categories { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 28px; }
.cat-card {
    display: flex; align-items: center; gap: 16px; padding: 22px 26px;
    border: 1px solid rgba(255,255,255,0.1); border-radius: 14px; transition: all 0.25s;
    background: rgba(255,255,255,0.05); box-shadow: 0 1px 4px rgba(0,0,0,0.2);
}
.cat-card:hover { border-color: #F5A623; box-shadow: 0 4px 20px rgba(245,166,35,0.2); transform: translateY(-2px); }
.cat-card span { font-size: 17px; font-weight: 600; color: #e0e4ea; }

/* Category Icons */
.cat-icon {
    width: 56px; height: 56px; flex-shrink: 0;
    background-size: contain; background-repeat: no-repeat; background-position: center;
}
.cat-icon--summer {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56' fill='none'%3E%3Ccircle cx='28' cy='28' r='9' stroke='%23F5A623' stroke-width='2'/%3E%3Cline x1='28' y1='5' x2='28' y2='13' stroke='%23F5A623' stroke-width='2'/%3E%3Cline x1='28' y1='43' x2='28' y2='51' stroke='%23F5A623' stroke-width='2'/%3E%3Cline x1='5' y1='28' x2='13' y2='28' stroke='%23F5A623' stroke-width='2'/%3E%3Cline x1='43' y1='28' x2='51' y2='28' stroke='%23F5A623' stroke-width='2'/%3E%3Cline x1='11.7' y1='11.7' x2='17.4' y2='17.4' stroke='%23F5A623' stroke-width='2'/%3E%3Cline x1='38.6' y1='38.6' x2='44.3' y2='44.3' stroke='%23F5A623' stroke-width='2'/%3E%3Cline x1='44.3' y1='11.7' x2='38.6' y2='17.4' stroke='%23F5A623' stroke-width='2'/%3E%3Cline x1='17.4' y1='38.6' x2='11.7' y2='44.3' stroke='%23F5A623' stroke-width='2'/%3E%3C/svg%3E");
}
.cat-icon--winter {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56' fill='none'%3E%3Cline x1='28' y1='4' x2='28' y2='52' stroke='%23F5A623' stroke-width='1.5'/%3E%3Cline x1='4' y1='28' x2='52' y2='28' stroke='%23F5A623' stroke-width='1.5'/%3E%3Cline x1='11' y1='11' x2='45' y2='45' stroke='%23F5A623' stroke-width='1.5'/%3E%3Cline x1='45' y1='11' x2='11' y2='45' stroke='%23F5A623' stroke-width='1.5'/%3E%3Ccircle cx='28' cy='4' r='2.5' fill='%23F5A623'/%3E%3Ccircle cx='28' cy='52' r='2.5' fill='%23F5A623'/%3E%3Ccircle cx='4' cy='28' r='2.5' fill='%23F5A623'/%3E%3Ccircle cx='52' cy='28' r='2.5' fill='%23F5A623'/%3E%3Ccircle cx='11' cy='11' r='2.5' fill='%23F5A623'/%3E%3Ccircle cx='45' cy='45' r='2.5' fill='%23F5A623'/%3E%3Ccircle cx='45' cy='11' r='2.5' fill='%23F5A623'/%3E%3Ccircle cx='11' cy='45' r='2.5' fill='%23F5A623'/%3E%3C/svg%3E");
}
.cat-icon--mid {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56' fill='none'%3E%3Ccircle cx='28' cy='28' r='9' stroke='%23F5A623' stroke-width='2'/%3E%3Cline x1='28' y1='5' x2='28' y2='13' stroke='%23F5A623' stroke-width='2'/%3E%3Cline x1='28' y1='43' x2='28' y2='51' stroke='%23F5A623' stroke-width='2'/%3E%3Cline x1='5' y1='28' x2='13' y2='28' stroke='%23F5A623' stroke-width='2'/%3E%3Cline x1='43' y1='28' x2='51' y2='28' stroke='%23F5A623' stroke-width='2'/%3E%3Cpath d='M23 5 Q28 12 33 5' stroke='%23F5A623' stroke-width='1.5' fill='none'/%3E%3Cpath d='M51 23 Q44 28 51 33' stroke='%23F5A623' stroke-width='1.5' fill='none'/%3E%3Cpath d='M33 51 Q28 44 23 51' stroke='%23F5A623' stroke-width='1.5' fill='none'/%3E%3Cpath d='M5 33 Q12 28 5 23' stroke='%23F5A623' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
}
.cat-icon--arctic {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56' fill='none'%3E%3Cpath d='M18 10 Q28 20 38 10' stroke='%23F5A623' stroke-width='2' fill='none'/%3E%3Cpath d='M18 22 Q28 32 38 22' stroke='%23F5A623' stroke-width='2' fill='none'/%3E%3Cpath d='M18 34 Q28 44 38 34' stroke='%23F5A623' stroke-width='2' fill='none'/%3E%3Cline x1='28' y1='10' x2='28' y2='48' stroke='%23F5A623' stroke-width='2'/%3E%3Ccircle cx='28' cy='48' r='3' fill='%23F5A623'/%3E%3C/svg%3E");
}

/* ===== SORT BAR ===== */
.sort-bar { display: flex; justify-content: flex-end; margin-bottom: 8px; }
.sort-btn {
    font-size: 14px; color: #8899aa; display: flex; align-items: center; gap: 6px;
    padding: 6px 0;
}
.sort-btn:hover { color: #F5A623; }

/* ===== PRODUCTS TABLE ===== */
.products { width: 100%; border-collapse: collapse; background: rgba(255,255,255,0.03); border-radius: 12px; overflow: hidden; }
.products thead th {
    text-align: left; font-size: 13px; font-weight: 700; color: rgba(255,255,255,0.6);
    text-transform: uppercase; letter-spacing: 0.5px; padding: 16px 14px 16px 0;
    border-bottom: 3px solid #F5A623; vertical-align: top;
    background: rgba(255,255,255,0.05);
}
.products thead th small { font-weight: 500; color: rgba(255,255,255,0.4); display: block; margin-top: 3px; font-size: 11px; }
.products tbody tr { border-bottom: 1px solid rgba(255,255,255,0.06); transition: background 0.15s; }
.products tbody tr:hover { background: rgba(245,166,35,0.06); }
.products tbody td {
    padding: 20px 14px 20px 0; font-size: 15px; color: #c0c8d4; vertical-align: middle;
}
.products tbody td:first-child { max-width: 260px; }
.products tbody td:first-child strong { color: #fff; font-weight: 600; font-size: 15px; }
.products tbody td:first-child small { color: rgba(255,255,255,0.45); font-size: 12px; }

.th-name { width: 22%; }
.th-filter { width: 14%; }
.th-cetane { width: 12%; }
.th-producer { width: 18%; }
.th-stock { width: 12%; }
.th-price { width: 12%; }

/* Stock Dot */
.dot {
    display: inline-block; width: 8px; height: 8px; border-radius: 50%;
    background: #4CAF50; margin-right: 4px; vertical-align: middle;
}
.dot--out {
    background: #e53935;
}

/* Price */
.price { font-size: 18px; font-weight: 700; color: #F5A623; white-space: nowrap; }

/* Order Button */
.btn-order {
    background: #F5A623; color: #111; font-weight: 600; font-size: 14px;
    padding: 12px 22px; border-radius: 10px; display: inline-flex;
    align-items: center; gap: 6px; transition: all 0.2s; white-space: nowrap;
    box-shadow: 0 2px 8px rgba(245,166,35,0.3);
}
.btn-order:hover { background: #e09500; box-shadow: 0 4px 14px rgba(245,166,35,0.4); transform: translateY(-1px); }

/* ===== MINI AZS SECTION ===== */
.mini-azs { padding: 60px 0; background: #111d2e; }
.mini-azs__inner {
    display: grid; grid-template-columns: 1fr 1fr; gap: 48px;
    align-items: center;
}
.mini-azs__image {
    border-radius: 16px; overflow: hidden;
    box-shadow: 0 8px 30px rgba(0,0,0,0.12);
}
.mini-azs__image img {
    width: 100%; height: auto; display: block;
}
.mini-azs__title {
    font-size: 32px; font-weight: 800; color: #fff;
    margin-bottom: 8px;
}
.mini-azs__subtitle {
    font-size: 17px; color: #F5A623; font-weight: 600;
    margin-bottom: 20px;
}
.mini-azs__text {
    font-size: 15px; color: #b0b8c4; line-height: 1.7;
    margin-bottom: 20px;
}
.mini-azs__features {
    list-style: none; padding: 0; margin-bottom: 28px;
}
.mini-azs__features li {
    font-size: 15px; color: #c8d0da; padding: 6px 0;
    line-height: 1.5;
}
.mini-azs__cta {
    display: inline-block; background: #F5A623; color: #111;
    font-weight: 700; font-size: 16px; padding: 14px 32px;
    border-radius: 12px; transition: all 0.2s;
    box-shadow: 0 4px 14px rgba(245,166,35,0.3);
}
.mini-azs__cta:hover {
    background: #e09500; transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(245,166,35,0.4);
}

/* ===== ABOUT COMPANY SECTION ===== */
.about-section {
    padding: 60px 0;
    background: #0d1520;
    color: #fff;
}
.about-inner { max-width: 800px; margin: 0 auto; }
.about-title {
    font-size: 32px; font-weight: 700;
    margin-bottom: 28px; color: #F5A623;
    text-align: center;
}
.about-text {
    font-size: 16px; line-height: 1.75;
    color: rgba(255,255,255,0.88);
    margin-bottom: 18px;
}
.about-text:last-child { margin-bottom: 0; }

/* ===== CONTACTS SECTION ===== */
.contacts-section { padding: 60px 0; background: #111d2e; border-top: 1px solid rgba(255,255,255,0.06); }
.contacts-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; }
.contacts-map { height: 400px; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 20px rgba(0,0,0,0.1); }
.contacts-map iframe { width: 100%; height: 100%; }
.contacts-info { padding: 10px 0; }
.contacts-title { font-size: 32px; font-weight: 800; color: #fff; margin-bottom: 24px; }
.contacts-phones { margin-bottom: 12px; }
.contacts-phones a {
    font-size: 28px; font-weight: 600; color: #fff; display: block;
    margin-bottom: 4px; transition: color 0.2s;
}
.contacts-phones a:hover { color: #F5A623; }
.contacts-social { display: flex; gap: 16px; margin-bottom: 16px; }
.contacts-social-icon { height: 56px; width: auto; border-radius: 50%; transition: opacity 0.2s; }
.contacts-email { font-size: 21px; color: #8899aa; margin-bottom: 16px; }
.contacts-address { font-size: 21px; color: #8899aa; margin-bottom: 24px; line-height: 1.5; }
.contacts-social-icon:hover { opacity: 0.75; }

/* ===== FOOTER ===== */
.footer { background: #0a1018; color: #ccc; padding: 40px 0 20px; }
.footer-bottom {
    display: grid; grid-template-columns: auto 1fr auto; gap: 40px;
    align-items: start; padding-bottom: 24px;
    border-bottom: 1px solid #333;
}
.footer-logo { flex-shrink: 0; }
.logo-img--footer {
    height: 70px; width: auto;
    mix-blend-mode: screen;
}
.footer-company { font-size: 13px; color: #888; line-height: 1.8; }
.footer-right-info { display: flex; flex-direction: column; gap: 6px; text-align: right; }
.footer-right-info a { font-size: 14px; color: #999; transition: color 0.2s; }
.footer-right-info a:hover { color: #F5A623; }
.footer-copy { padding-top: 16px; font-size: 12px; color: #666; }

/* ===== BURGER BUTTON (hidden on desktop) ===== */
.burger {
    display: none; flex-direction: column; justify-content: center;
    align-items: center;
    gap: 6px; width: 44px; height: 44px; padding: 10px;
    cursor: pointer; z-index: 20;
    background: rgba(255,255,255,0.08);
    border: 1.5px solid rgba(255,255,255,0.18);
    border-radius: 10px;
    transition: background 0.3s, border-color 0.3s;
}
.burger:active {
    background: rgba(255,255,255,0.18);
}
.burger__line {
    display: block; width: 22px; height: 2.5px; background: #fff;
    border-radius: 3px;
    transition: transform 0.35s cubic-bezier(.4,.2,.2,1), opacity 0.25s ease;
}
.burger--open {
    background: rgba(255,255,255,0.14);
    border-color: rgba(255,255,255,0.25);
}
.burger--open .burger__line:nth-child(1) { transform: translateY(8.5px) rotate(45deg); }
.burger--open .burger__line:nth-child(2) { opacity: 0; transform: scaleX(0); }
.burger--open .burger__line:nth-child(3) { transform: translateY(-8.5px) rotate(-45deg); }

/* ===== RESPONSIVE — TABLET (≤1024px) ===== */
@media (max-width: 1024px) {
    .categories { grid-template-columns: repeat(2, 1fr); }
    .delivery-grid { grid-template-columns: repeat(2, 1fr); }
    .mini-azs__inner { grid-template-columns: 1fr; }
    .contacts-inner { grid-template-columns: 1fr; }
    .contacts-map { height: 300px; }
    .footer-bottom { grid-template-columns: 1fr; gap: 20px; }
    .footer-right-info { text-align: left; }
}

/* ===== RESPONSIVE — MOBILE (≤768px) ===== */
@media (max-width: 768px) {
    /* --- Header --- */
    .site-header {
        position: relative;
        background: linear-gradient(135deg, rgba(20,40,80,0.95) 0%, rgba(20,40,80,0.85) 100%);
    }
    .site-header__inner {
        display: flex; flex-wrap: wrap;
        height: auto; padding: 12px 0;
        align-items: center;
        position: relative;
    }
    .logo { margin-right: auto; order: 1; }
    .logo-img { height: 44px; }
    .site-header__right { display: none; }
    .burger { display: flex; order: 2; }

    /* Nav — mobile dropdown */
    .site-nav {
        order: 10; width: auto;
        max-height: 0; overflow: hidden;
        transition: max-height 0.3s ease, opacity 0.3s ease;
        opacity: 0;
        display: flex; flex-direction: column;
        align-items: flex-end;
        background: rgba(15, 25, 50, 0.95);
        backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
        margin: 8px 0 0; padding: 0;
        border-radius: 12px;
        position: absolute; right: 20px; top: 100%;
        min-width: 180px;
        box-shadow: 0 8px 32px rgba(0,0,0,0.3);
        border: 1px solid rgba(255,255,255,0.1);
    }
    .site-nav--open { max-height: 300px; opacity: 1; padding: 6px 0; }
    .site-nav__link {
        padding: 10px 24px; font-size: 14px; color: rgba(255,255,255,0.9);
        border-bottom: none;
        text-align: right; width: 100%;
        letter-spacing: 0.3px;
        transition: background 0.2s;
    }
    .site-nav__link:hover,
    .site-nav__link:active {
        background: rgba(255,255,255,0.08);
    }
    .site-nav__link:last-child { border-bottom: none; }

    /* --- Hero --- */
    .hero { min-height: auto; display: block; }
    .hero__inner { padding: 32px 0 40px; }
    .hero__title { font-size: 24px; margin-bottom: 24px; }
    /* Features: 2 in a row, 3rd centered below */
    .hero__features {
        flex-direction: row; flex-wrap: wrap;
        justify-content: center; gap: 20px;
        margin-bottom: 24px;
        max-width: 300px;
        margin-left: auto; margin-right: auto;
    }
    .hero__feature {
        font-size: 13px; width: calc(50% - 10px);
        justify-content: center;
    }
    .hero__feature:last-child { width: auto; }
    .hero__feature-icon { width: 40px; height: 40px; }
    .hero__wholesale-badge { font-size: 15px; padding: 10px 20px; }
    /* Phone on its own line, no wrapping */
    .hero__phone { font-size: 16px; }
    .hero__phone a {
        font-size: 20px; display: block;
        margin-top: 4px; white-space: nowrap;
    }

    /* --- Delivery Types --- */
    .delivery-types { padding: 30px 0; }
    .delivery-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .delivery-card__label { font-size: 14px; padding: 10px 14px; }
    .section-title { font-size: 24px; margin-bottom: 20px; }

    /* --- Categories --- */
    .categories { grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 20px; }
    .cat-card { padding: 14px 12px; gap: 10px; }
    .cat-icon { width: 36px; height: 36px; }
    .cat-card span { font-size: 13px; }

    /* --- Products Table → Card Layout --- */
    .content { padding: 30px 0 40px; }
    .products thead { display: none; }
    .products,
    .products tbody { display: block; }
    .products tbody tr {
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 4px 12px;
        padding: 16px 0;
        border-bottom: 1px solid #eee;
    }
    .products tbody td { padding: 2px 0; font-size: 14px; }
    /* Name — full width */
    .products tbody td:nth-child(1) {
        grid-column: 1 / -1;
        padding-bottom: 6px;
    }
    /* Hide filter temp, cetane, producer on mobile */
    .products tbody td:nth-child(2),
    .products tbody td:nth-child(3),
    .products tbody td:nth-child(4) { display: none; }
    /* Stock — left */
    .products tbody td:nth-child(5) { grid-column: 1; }
    /* Price — right */
    .products tbody td:nth-child(6) {
        grid-column: 2; text-align: right;
    }
    .price { font-size: 16px; }

    /* --- Mini AZS --- */
    .mini-azs { padding: 40px 0; }
    .mini-azs__inner { grid-template-columns: 1fr; gap: 24px; }
    .mini-azs__title { font-size: 24px; }
    .mini-azs__subtitle { font-size: 15px; }
    .mini-azs__text { font-size: 14px; }
    .mini-azs__features li { font-size: 14px; }
    .mini-azs__cta { font-size: 14px; padding: 12px 24px; }

    /* --- About Company --- */
    .about-section { padding: 40px 0; }
    .about-title { font-size: 24px; margin-bottom: 20px; }
    .about-text { font-size: 14px; line-height: 1.7; }

    /* --- Contacts --- */
    .contacts-section { padding: 40px 0; }
    .contacts-inner { grid-template-columns: 1fr; gap: 24px; }
    .contacts-map { height: 250px; }
    .contacts-title { font-size: 24px; margin-bottom: 16px; }
    .contacts-phones a { font-size: 22px; }
    .contacts-social-icon { height: 44px; }
    .contacts-email { font-size: 17px; }
    .contacts-address { font-size: 16px; }

    /* --- Footer --- */
    .footer { padding: 30px 0 16px; }
    .footer-bottom {
        grid-template-columns: 1fr; gap: 16px;
        text-align: center;
    }
    .logo-img--footer { height: 50px; }
    .footer-company { font-size: 12px; }
    .footer-right-info { text-align: center; }
    .footer-right-info a { font-size: 13px; }
}

/* ===== RESPONSIVE — SMALL MOBILE (≤480px) ===== */
@media (max-width: 480px) {
    .container { padding: 0 16px; }
    .hero__title { font-size: 22px; }
    .delivery-grid { gap: 8px; }
    .delivery-card__label { font-size: 12px; padding: 8px 10px; }
    .categories { grid-template-columns: 1fr; gap: 8px; }
    .cat-card { padding: 12px; }
}