/* =========================================================
   AUTOLIST — RESET / BASE / UI
   ========================================================= */

/* ===== Reset / Base ===== */
* {
    box-sizing: border-box
}

html,
body {
    margin: 0;
    padding: 0
}

html {
    height: 100%;
}

body {
    font: 16px/1.5 system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, 'Helvetica Neue', Arial;
    color: #111;
    background: #fff;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.page {
    flex: 1 0 auto;
}

.footer {
    flex-shrink: 0;
}

img {
    max-width: 100%;
    height: auto;
    display: block
}

a {
    color: #2f6b3b;
    text-decoration: none;
    transition: color .2s ease;
}

a:hover {
    color: #16a34a;
}

.container {
    width: min(1200px, 100% - 32px);
    margin-inline: auto
}

/* ===== UI ===== */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    padding: .9rem 1.2rem;
    border-radius: 999px;
    border: 1px solid #22b653;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease
}

.btn--primary {
    background: #22b653;
    color: #fff
}

.btn--ghost {
    background: transparent;
    color: #22b653
}

.btn:hover {
    transform: translateY(-1px);
    box-shadow: rgba(34,182,83,.20)
}

.link-more {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-weight: 600
}


/* =========================================================
   AUTOLIST — UNIFIED HEADINGS
   ========================================================= */

/* H1 обычных страниц */
.entry-title {
    position: relative;

    margin: 0 0 24px;
    padding-left: 18px;

    color: #2f6b3b;

    font-size: clamp(30px, 3.5vw, 38px);
    font-weight: 750;
    line-height: 1.2;

    letter-spacing: -0.02em;
}

.entry-title::before {
    content: "";

    position: absolute;
    top: 0.12em;
    bottom: 0.12em;
    left: 0;

    width: 4px;
    border-radius: 4px;

    background: #2f6b3b;
}


/* H2 / заголовки секций / категории */
.section-title,
.popular-problems__title,
.materials-process__title,
.about-project__title,
.faq-block > h2,
.article h2 {
    position: relative;

    margin: 0 0 18px;
    padding-left: 16px;

    color: #2f6b3b;

    font-size: clamp(25px, 3vw, 32px);
    font-weight: 750;
    line-height: 1.3;

    letter-spacing: -0.015em;
}

.section-title::before,
.popular-problems__title::before,
.materials-process__title::before,
.about-project__title::before,
.faq-block > h2::before,
.article h2::before {
    content: "";

    position: absolute;
    top: 0.15em;
    bottom: 0.15em;
    left: 0;

    width: 4px;
    border-radius: 4px;

    background: #2f6b3b;
}


/* Внутри статьи сохраняем увеличенный верхний отступ */
.article h2 {
    margin-top: 48px;
}


/* MOBILE */
@media (max-width: 767px) {

    .entry-title {
        margin-bottom: 20px;
        padding-left: 14px;

        font-size: 30px;
        line-height: 1.2;
    }

    .entry-title::before {
        width: 3px;
    }

    .section-title,
    .popular-problems__title,
    .materials-process__title,
    .about-project__title,
    .article h2 {
        margin-bottom: 16px;
        padding-left: 13px;

        font-size: 25px;
    }

    .section-title::before,
    .popular-problems__title::before,
    .materials-process__title::before,
    .about-project__title::before,
    .article h2::before {
        width: 3px;
    }

    .article h2 {
        margin-top: 38px;
    }
}


/* =========================================================
   AUTOLIST — HEADER / NAVIGATION
   ========================================================= */

/* ===== Header ===== */
.header {
    position: sticky;
    top: 0;
    z-index: 40;
    backdrop-filter: saturate(180%) blur(6px);
    background: rgba(255, 255, 255, .7);
    border-bottom: 1px solid #eee
}

.header__container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .75rem 0
}

.header__logo-link {
    font-weight: 800;
    font-size: 22px;
    letter-spacing: .5px;
    color: #111
}

.header__logo-link span {
    color: #22b653
}

.header__burger {
    display: none;
    width: 42px;
    height: 42px;
    border: 1px solid #ddd;
    background: #fff;
    border-radius: 12px;
    position: relative
}

.header__burger span {
    position: absolute;
    left: 10px;
    right: 10px;
    height: 2px;
    background: #111;
    transition: .2s
}

.header__burger span:nth-child(1) {
    top: 12px
}

.header__burger span:nth-child(2) {
    top: 20px
}

.header__burger span:nth-child(3) {
    top: 28px
}

.header__nav {
    display: flex;
    align-items: center;
    gap: 14px
}

.header__menu {
    display: flex;
    list-style: none;
    gap: 14px;
    margin: 0;
    padding: 0;
    flex-direction: row;
    align-items: center;
}

.header__cta {
    margin-left: 8px;
}

.langsw__list {
    display: flex;
    gap: 6px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.langsw.pills .langsw__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid #e5e5e5;
    background: #fff;
    text-decoration: none;
    line-height: 1;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .04);
}

.langsw.inline .langsw__list {
    gap: 10px;
}

.langsw.inline .langsw__item:not(:last-child)::after {
    content: "/";
    margin-left: 10px;
    color: #999;
    font-weight: 400;
}

.langsw.inline .langsw__link {
    padding: 0;
    text-decoration: none;
    color: inherit;
}

.langsw__flag {
    width: 16px;
    height: 12px;
    object-fit: cover;
    border-radius: 2px
}

.header__logo-link img {
    width: 170px !important;
}


.header__menu .sub-menu,
.footer__menu .sub-menu {
    list-style: none;
    padding: 0;
}

.footer__phone {
    font-weight: 500;
    font-size: 18px;
}


.header__menu .menu-item {
    display: flex;
    gap: 14px;
    font-weight: 500;
}

/* ===== Dropdown под твою структуру (nav.header_nav) ===== */
.header__nav {
    --hn-bg: #ffffff;
    --hn-text: #2f6b3b;
    --hn-accent: #2f6b3b;
    --hn-accent-hover: #173b66;
    --hn-ring: rgba(16, 42, 76, .18);
    --hn-shadow:
        0 20px 40px rgba(16, 42, 76, .10),
        0 6px 16px rgba(16, 42, 76, .06);

    --hn-radius: 14px;
    --hn-gap: 18px;
    --hn-speed: .18s;
}

.header__nav>.menu.header__menu {
    display: flex;
    gap: var(--hn-gap);
    align-items: center;
}

.header__nav>.menu.header__menu>li>a {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    color: var(--hn-text);
    font-weight: 700;
    border-radius: 12px;
    transition: background-color var(--hn-speed), color var(--hn-speed), transform var(--hn-speed);
    font-size: 18px;
}

.header__nav>.menu.header__menu>li>a:hover {
    background: rgba(16, 42, 76, .06);
    color: var(--hn-accent);
}

/* подчёркивание у родителя */
.header__nav>.menu.header__menu>li.menu-item-has-children>a::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 6px;
    height: 2px;
    border-radius: 2px;
    background: transparent;
    transform: scaleX(0);
    transform-origin: 0 50%;
    transition: transform var(--hn-speed), background-color var(--hn-speed);
}

.header__nav>.menu.header__menu>li.menu-item-has-children:hover>a::after,
.header__nav>.menu.header__menu>li.menu-item-has-children:focus-within>a::after {
    background: var(--hn-accent);
    transform: scaleX(1);
}

/* позиционирование родителя */
.header__nav .menu-item-has-children {
    position: relative;
}

/* подменю */
.header__nav .sub-menu {
    list-style: none;
    margin: 0;
    padding: 8px;
    min-width: 240px;
    background: var(--hn-bg);
    border-radius: var(--hn-radius);
    box-shadow: var(--hn-shadow);
    position: absolute;
    top: calc(100% + 12px);
    left: 0;
    z-index: 50;

    opacity: 0;
    visibility: hidden;
    transform: translateY(8px) scale(.98);
    transition: opacity var(--hn-speed), transform var(--hn-speed), visibility var(--hn-speed) step-end;
}

/* показать */
.header__nav li.menu-item-has-children:hover>.sub-menu,
.header__nav li.menu-item-has-children:focus-within>.sub-menu,
.header__nav li.menu-item-has-children[aria-expanded="true"]>.sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
    transition: opacity var(--hn-speed), transform var(--hn-speed), visibility 0s;
}

/* стрелочка у подменю */
.header__nav li.menu-item-has-children>.sub-menu::before {
    content: "";
    position: absolute;
    top: -8px;
    left: 24px;
    width: 14px;
    height: 14px;
    background: var(--hn-bg);
    transform: rotate(45deg);
    box-shadow: -2px -2px 8px rgba(0, 0, 0, .04);
}

/* ссылки в подменю */
.header__nav .sub-menu>li>a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    color: var(--hn-text);
    white-space: nowrap;
    transition: background-color var(--hn-speed), transform var(--hn-speed);
}

.header__nav .sub-menu>li>a:hover,
.header__nav .sub-menu>li>a:focus-visible {
    background: #f4f7fa;
    color: var(--hn-accent-hover);
    outline: none;
}

/* вложенные уровни вправо */
.header__nav .sub-menu .menu-item-has-children {
    position: relative;
}

.header__nav .sub-menu .menu-item-has-children>.sub-menu {
    top: 0;
    left: calc(100% + 10px);
}

/* мобильные мелочи */
@media (max-width:980px) {
    .header__nav>.menu.header__menu {
        gap: 12px;
    }
}

/* аккуратный focus ring */
.header__nav a:focus-visible {
    box-shadow: 0 0 0 3px var(--hn-ring);
    border-radius: 12px;
    outline: none;
}

/* ===== Search icon in header ===== */

.header__search-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    padding: 0;

    border: 0;
    border-radius: 50%;

    background: transparent;
    color: #222;

    cursor: pointer;

    flex-shrink: 0;

    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease;
}

.header__search-toggle svg {
    display: block;

    width: 22px;
    height: 22px;

    flex-shrink: 0;
}

.header__search-toggle:hover {
    background: #f4f7fa;
    color: #173b66;
}

.header__search-toggle:active {
    transform: scale(.95);
}



/* ========================================
   AUTOLIST — HERO
======================================== */

.autolist-hero {
	position: relative;
	overflow: hidden;
	background: #FEFEFF;
}

.autolist-hero__container {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 0.95fr) minmax(420px, 1.05fr);
	align-items: center;
	min-height: 430px;
}

/* CONTENT */

.autolist-hero__content {
	position: relative;
	z-index: 3;
	padding: 58px 0 64px;
}

.autolist-hero__title {
	max-width: 620px;
	margin: 0;

	color: #2f6b3b;

	font-size: 45px;
	font-weight: 800;
	line-height: 1.08;

	letter-spacing: -0.035em;
}

.autolist-hero__text {
	max-width: 560px;
	margin: 22px 0 0;
	color: #516176;
	font-size: 17px;
	line-height: 1.65;
}

/* SEARCH */

.autolist-hero__search {
	position: relative;
	display: flex;
	width: min(100%, 610px);
	margin-top: 34px;
	background: #ffffff;
	border: 1px solid #dde4eb;
	border-radius: 8px;
	box-shadow:
		0 10px 30px rgba(16, 42, 76, 0.08),
		0 2px 6px rgba(16, 42, 76, 0.05);
}

.autolist-hero__search-input {
	width: 100%;
	height: 58px;
	padding: 0 74px 0 20px;
	border: 0;
	outline: 0;
	background: transparent;
	color: #2f6b3b;
	font-family: inherit;
	font-size: 15px;
}

.autolist-hero__search-input::placeholder {
	color: #8c98a8;
}

.autolist-hero__search-input:focus {
	box-shadow: none;
}

.autolist-hero__search:focus-within {
	border-color: #23b653;
	box-shadow:
		0 0 0 3px rgba(35, 182, 83, 0.10),
		0 10px 30px rgba(16, 42, 76, 0.08);
}

.autolist-hero__search-button {
	position: absolute;
	top: 6px;
	right: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	padding: 0;
	border: 0;
	border-radius: 6px;
	background: #22b653;
	color: #ffffff;
	cursor: pointer;
	transition:
		background-color 0.2s ease,
		transform 0.2s ease;
}

.autolist-hero__search-button:hover {
	background: #199b45;
}

.autolist-hero__search-button:active {
	transform: scale(0.96);
}

/* IMAGE */

.autolist-hero__media {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;

	width: 63%;

	overflow: hidden;
}

.autolist-hero__media::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: -160px;
	width: 280px;
	z-index: 1;
	background: linear-gradient(
		90deg,
		#ffffff 0%,
		rgba(255, 255, 255, 0.85) 28%,
		rgba(255, 255, 255, 0) 100%
	);
	pointer-events: none;
}

.autolist-hero__image {
	position: absolute;
	top: 50%;
	right: -20px;
	width: 115%;
	height: auto;
	max-width: none;
	transform: translateY(-50%);
}

/* ========================================
   TABLET
======================================== */

@media (max-width: 1024px) {

	.autolist-hero__container {
		grid-template-columns: 1fr 0.85fr;
		min-height: 390px;
	}

	.autolist-hero__content {
		padding: 48px 0 52px;
	}

	.autolist-hero__title {
		font-size: 42px;
	}

	.autolist-hero__image {
		right: -90px;
		width: 630px;
	}
}

/* ========================================
   MOBILE
======================================== */

@media (max-width: 767px) {

    .autolist-hero {
        background: linear-gradient(
            180deg,
            #ffffff 0%,
            #f7fafc 100%
        );
    }

    .autolist-hero__container {
        display: flex;
        flex-direction: column;

        min-height: 0;
    }

    .autolist-hero__content {
        position: relative;
        z-index: 2;

        width: 100%;
        padding: 30px 0 28px;
    }

    .autolist-hero__title {
        max-width: 100%;

        font-size: 30px;
        line-height: 1.12;
        letter-spacing: -0.025em;
    }

    .autolist-hero__text {
        max-width: 100%;

        margin-top: 16px;

        font-size: 15px;
        line-height: 1.55;
    }

    .autolist-hero__search {
        margin-top: 24px;
    }

    .autolist-hero__search-input {
        height: 54px;

        padding-left: 16px;
        padding-right: 66px;

        font-size: 14px;
    }

    .autolist-hero__search-button {
        top: 5px;
        right: 5px;

        width: 44px;
        height: 44px;
    }


    /* КАРТИНКА */

    .autolist-hero__media {
        position: relative;

        top: auto;
        right: auto;
        bottom: auto;

        width: 100%;
        height: 190px;

        margin-top: -8px;

        overflow: hidden;
    }

    .autolist-hero__media::before {
        display: none;
    }

    .autolist-hero__image {
        position: absolute;

        top: auto;
        right: 50%;
        bottom: 0;

        width: 360px;
        max-width: 115vw;

        transform: translateX(50%);
    }
}

/* ========================================
   SMALL MOBILE
======================================== */

@media (max-width: 420px) {

    .autolist-hero__content {
        padding-top: 26px;
    }

    .autolist-hero__title {
        font-size: 28px;
    }

    .autolist-hero__media {
        height: 170px;
    }

    .autolist-hero__image {
        width: 330px;
    }
}
/* ========================================
   POPULAR PROBLEMS
======================================== */

.popular-problems {
	padding: 26px 0 34px;
	background: #FEFEFF;
}
.popular-problems__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 10px 12px;
}

.popular-problems__item {
	display: flex;
	align-items: center;
	justify-content: space-between;

	min-height: 46px;
	padding: 0 14px 0 16px;

	border: 1px solid #e5eaf0;
	border-radius: 7px;

	background: #ffffff;

	color: #183659;
	text-decoration: none;

	box-shadow:
		0 2px 6px rgba(16, 42, 76, 0.03);

	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease,
		transform 0.2s ease,
		color 0.2s ease;
}

.popular-problems__item:hover {
	border-color: #cdd7e2;
	color: #16a34a;

	box-shadow:
		0 5px 14px rgba(16, 42, 76, 0.07);

	transform: translateY(-1px);
}

.popular-problems__text {
	min-width: 0;

	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
}

.popular-problems__arrow {
	flex: 0 0 auto;

	display: flex;
	align-items: center;
	justify-content: center;

	margin-left: 10px;

	color: #77889a;

	transition:
		transform 0.2s ease,
		color 0.2s ease;
}

.popular-problems__item:hover .popular-problems__arrow {
	color: #16a34a;
	transform: translateX(2px);
}

/* TABLET */

@media (max-width: 1024px) {

	.popular-problems__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}

/* MOBILE */

@media (max-width: 600px) {

	.popular-problems {
		padding: 22px 0 28px;
	}
.popular-problems__grid {
		grid-template-columns: 1fr;
		gap: 8px;
	}

	.popular-problems__item {
		min-height: 48px;
		padding-left: 14px;
		padding-right: 12px;
	}

	.popular-problems__text {
		font-size: 14px;
	}

}
/* ========================================
   ABOUT PROJECT
======================================== */

.about-project {
	padding: 34px 0;
	background: #FEFEFF;
}

.about-project__box {
	display: grid;
	grid-template-columns: 38% 62%;
	align-items: center;

	min-height: 230px;

	overflow: hidden;

	background:
		linear-gradient(
			110deg,
			#f5f9fc 0%,
			#edf5fb 55%,
			#e7f2fa 100%
		);

	border: 1px solid #e3ebf2;
	border-radius: 12px;
}

/* IMAGE */

.about-project__media {
	position: relative;
	height: 100%;
	min-height: 230px;

	display: flex;
	align-items: flex-end;
	justify-content: center;
}

.about-project__image {
	display: block;

	width: 92%;
	height: auto;

	max-width: 430px;

	object-fit: contain;
}

/* CONTENT */

.about-project__content {
	padding: 34px 48px 34px 24px;
}
.about-project__text {
	max-width: 720px;

	margin: 0 0 22px;

	color: #536579;

	font-size: 15px;
	line-height: 1.65;
}

/* BUTTON */

.about-project__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 46px;
	padding: 0 22px;

	border: 0;
	border-radius: 6px;

	background: #22b653;
	color: #ffffff;

	font-size: 14px;
	font-weight: 700;
	line-height: 1;

	text-decoration: none;
	cursor: pointer;

	transition:
		background-color 0.2s ease,
		transform 0.2s ease;
}

.about-project__button:hover {
	background: #199b45;
	color: #ffffff;
}

.about-project__button:active {
	transform: scale(0.96);
}


/* ========================================
   TABLET
======================================== */

@media (max-width: 900px) {

	.about-project__box {
		grid-template-columns: 42% 58%;
	}

	.about-project__content {
		padding:
			30px
			28px
			30px
			16px;
	}
}


/* ========================================
   MOBILE
======================================== */

@media (max-width: 650px) {

	.about-project {
		padding: 26px 0;
	}

	.about-project__box {
		display: flex;
		flex-direction: column;

		text-align: center;
	}

.about-project__media {
	position: relative;
	height: 100%;
	min-height: 230px;

	display: flex;
	align-items: flex-end;
	justify-content: flex-start;

	overflow: hidden;
}

.about-project__image {
	display: block;

	width: 100%;
	height: 100%;

	max-width: none;

	object-fit: contain;
	object-position: left center;
}

	.about-project__content {
		width: 100%;

		padding:
			10px
			20px
			26px;
	}
.about-project__text {
		font-size: 14px;
		line-height: 1.6;
	}

}
/* ========================================
   HOW WE PREPARE MATERIALS
======================================== */

.materials-process {
	padding: 6px 0 36px;
	background: #FEFEFF;
}
.materials-process__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
}

.materials-process__item {
	display: flex;
	align-items: flex-start;
	gap: 16px;

	min-height: 125px;

	padding: 22px 20px;

	background: #ffffff;

	border: 1px solid #e4eaf0;
	border-radius: 10px;

	box-shadow:
		0 2px 8px rgba(16, 42, 76, 0.035);

	transition:
		transform 0.2s ease,
		box-shadow 0.2s ease,
		border-color 0.2s ease;
}

.materials-process__item:hover {
	transform: translateY(-2px);

	border-color: #d6e0e9;

	box-shadow:
		0 7px 20px rgba(16, 42, 76, 0.07);
}

/* ICON */

.materials-process__icon {
	flex: 0 0 auto;

	display: flex;
	align-items: center;
	justify-content: center;

	width: 52px;
	height: 52px;

	border-radius: 9px;

	background: #f3f8fc;
	color: #143b68;
}

.materials-process__icon svg {
	width: 31px;
	height: 31px;
}

/* CONTENT */

.materials-process__content {
	min-width: 0;
}

.materials-process__item-title {
	margin: 1px 0 7px;

	color: #2f6b3b;

	font-size: 16px;
	font-weight: 800;
	line-height: 1.3;
}

.materials-process__text {
	margin: 0;

	color: #647386;

	font-size: 13px;
	line-height: 1.55;
}

/* TABLET */

@media (max-width: 900px) {

	.materials-process__grid {
		grid-template-columns: 1fr;
	}

	.materials-process__item {
		min-height: 0;
	}

}

/* MOBILE */

@media (max-width: 600px) {

	.materials-process {
		padding-bottom: 28px;
	}
.materials-process__item {
		gap: 13px;
		padding: 18px 16px;
	}

	.materials-process__icon {
		width: 46px;
		height: 46px;
	}

	.materials-process__icon svg {
		width: 27px;
		height: 27px;
	}

	.materials-process__item-title {
		font-size: 15px;
	}

	.materials-process__text {
		font-size: 13px;
	}

}
/* ========================================
   HOME FAQ
======================================== */

.home-faq {
	padding: 8px 0 42px;
	background: #FEFEFF;
}

.home-faq .faq-block {
	margin: 0;
}


/* =========================================================
   AUTOLIST — BLOG / CARDS / PAGINATION
   ========================================================= */

.section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px
}


/* ===== Blog ===== */
.blog {
    padding: 28px 0 0
}

.blog__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px
}

.post-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 18px;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease
}

.post-card:hover {
    transform: translateY(-4px);
    border-color: #c2cfdd;
    box-shadow: 0 12px 30px rgba(30, 42, 23, .11);
}

.post-card__body {
    padding: 12px
}

.post-card__title {
    margin: 0 0 6px;
min-height:85px;
}

.post-card__dates {
    display: flex;
    flex-wrap: wrap;
    gap: 2px 10px;
    margin: 0 0 8px;
    font-size: 12px;
    line-height: 1.4;
    color: #888;
}

.post-card__date {
    white-space: nowrap;
}

.post-card__thumb img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    transition: transform .3s ease;
}

.post-card:hover .post-card__thumb img {
    transform: scale(1.04);
}

.blog-pagination {
    display: flex;
    justify-content: center;
    margin-top: 16px;
	margin-bottom: 20px;
}

.blog-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid #eee;
    border-radius: 10px;
    margin: 0 4px
}

.blog-pagination .current {
    background: #f4f7fa;
    border-color: #c2cfdd
}

@media (max-width: 992px) {

    .blog__grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (max-width: 600px) {
    .blog__grid {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   AUTOLIST — ARTICLE CONTENT
   ========================================================= */

/* Контейнер статьи */
.article {
    --article-accent: #2f6b3b;
    --article-text: #25282d;
    --article-muted: #5f666d;
    --article-border: #e5e7e9;

    max-width: 1040px;
    margin: 0 auto;
    color: var(--article-text);
    font-size: 17px;
    line-height: 1.75;
    word-break: break-word;
}

/* Абзацы */
.article p {
    margin: 0 0 20px;
}


/* Основные разделы */
/* Подразделы */
.article h3 {
    position: relative;
    margin: 34px 0 14px;
    padding-left: 13px;
    color: #2f6b3b;
    font-size: clamp(21px, 2.4vw, 25px);
    font-weight: 700;
    line-height: 1.35;
}

.article h3::before {
    content: "";
    position: absolute;
    top: 0.18em;
    bottom: 0.18em;
    left: 0;
    width: 3px;
    border-radius: 3px;
    background: var(--article-accent);
}

/* Заголовки четвёртого уровня */
.article h4 {
    margin: 28px 0 12px;
    color: #2f6b3b;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.4;
}

/* Списки */
.article ul,
.article ol {
    margin: 16px 0 24px;
    padding-left: 30px;
}

.article li {
    margin-bottom: 9px;
    padding-left: 5px;
}

.article li:last-child {
    margin-bottom: 0;
}

/* Зелёные маркеры */
.article ul li::marker {
    color: var(--article-accent);
    font-size: 0.85em;
}

/* Нумерованные списки */
.article ol li::marker {
    color: var(--article-accent);
    font-weight: 700;
}

/* Вложенные списки */
.article li ul,
.article li ol {
    margin-top: 10px;
    margin-bottom: 10px;
}

/* Выделение текста */
.article strong,
.article b {
    color: #202328;
    font-weight: 700;
}

/* Ссылки */
.article a {
    color: #2f6b3b;
    font-weight: 600;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    transition: color 0.2s ease;
}

.article a:hover {
    color: #16a34a;
}

/* Разделитель */
.article hr {
    margin: 42px 0;
    border: 0;
    border-top: 1px solid var(--article-border);
}

/* Цитаты и важные примечания */
.article blockquote {
    margin: 28px 0;
    padding: 18px 22px;
    border-left: 4px solid var(--article-accent);
    background: #f6f9fc;
    color: #3d4348;
    font-style: normal;
}

.article blockquote p:last-child {
    margin-bottom: 0;
}

/* Изображения */
.article img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 30px auto;
    border-radius: 10px;
}

/* Подписи под изображениями */
.article figure {
    margin: 30px 0;
}

.article figure img {
    margin: 0 auto;
}

.article figcaption {
    margin-top: 10px;
    color: var(--article-muted);
    font-size: 14px;
    line-height: 1.5;
    text-align: center;
}

/* =========================
   Таблицы
   ========================= */

.article table {
    width: 100%;
    margin: 28px 0;

    border-collapse: separate;
    border-spacing: 0;

    overflow: hidden;

    border: 1px solid #dbe3ec;
    border-radius: 10px;

    background: #ffffff;

    font-size: 16px;

    box-shadow:
        0 4px 16px rgba(16, 42, 76, 0.04);
}


/* Ячейки */
.article th,
.article td {
    padding: 13px 15px;

    border-right: 1px solid #e3e9f0;
    border-bottom: 1px solid #e3e9f0;

    text-align: left;
    vertical-align: top;
}


/* Убираем лишнюю правую границу */
.article th:last-child,
.article td:last-child {
    border-right: 0;
}


/* Убираем нижнюю границу последней строки */
.article tr:last-child td {
    border-bottom: 0;
}


/* Заголовки таблицы */
.article th {
    background: #f1f5f9;

    color: #2f6b3b;

    font-weight: 700;
}


/* Текст обычных ячеек */
.article td {
    color: #3f4f61;

    background: #ffffff;
}


/* Лёгкое чередование строк */
.article tbody tr:nth-child(even) td {
    background: #f9fbfd;
}


/* Hover строки */
.article tbody tr {
    transition: background-color 0.2s ease;
}

.article tbody tr:hover td {
    background: #f4f7fa;
}

/* Код и технические обозначения */
.article code {
    padding: 2px 6px;
    border-radius: 4px;
    background: #f1f3f4;
    font-size: 0.9em;
}

/* Адаптация для смартфонов */
@media (max-width: 767px) {
    .article {
        font-size: 16px;
        line-height: 1.7;
    }

    .article h1 {
        margin-bottom: 22px;
        font-size: 32px;
        line-height: 1.18;
    }
.article h3 {
        margin-top: 28px;
        padding-left: 11px;
        font-size: 21px;
    }

    .article p {
        margin-bottom: 18px;
    }

    .article ul,
    .article ol {
        padding-left: 24px;
    }

    .article li {
        margin-bottom: 8px;
        padding-left: 2px;
    }

    .article img {
        margin: 24px auto;
        border-radius: 7px;
    }

    .article table {
        display: block;
        overflow-x: auto;
        font-size: 14px;
        -webkit-overflow-scrolling: touch;
    }

    .article th,
    .article td {
        min-width: 145px;
        padding: 10px 12px;
    }
}


/* =========================================================
   AUTOLIST — CONTENT COMPATIBILITY HELPERS
   ========================================================= */

.wrap {
    position: relative;
    overflow-x: auto;
    width: 100%;
    max-width: 100%;
}

.table21 {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
}

.table21 th {
    color: #ffffff;
    background: #404040;
    padding: 1rem;
    border: 1px solid #eee;
}

.table21 th:nth-child(odd) {
    background: #2f6b3b;
    padding: 1rem;
    border: 1px solid #eee;
}

.table21 td {
    padding: 1rem;
    border: 1px solid #eee;
}

.blockquote-8 {
    position: relative;
    padding: 16px 24px;
    margin: 16px 46px;
    font-size: 16px;
    text-align: center;
}

.blockquote-8:before,
.blockquote-8:after {
    position: absolute;
    color: #2f6b3b;
    font-size: 100px;
    font-family: Times, sans-serif;
    line-height: 100px;
}

.blockquote-8:before {
    content: '“';
    left: -30px;
    top: -10px;
}

.blockquote-8:after {
    content: '”';
    right: -30px;
    bottom: -10px;
}

.blockquote-8 cite {
    color: #5f6f82;
    font-size: 15px;
    padding-top: 10px;
    display: block;
}



/* ===== Article Banner (single post) ===== */
/* Хлебные крошки — современный вариант */
.article-breadcrumbs {
    display: block;
    margin: 0 0 18px;
    font-size: 14px;
}

.article-breadcrumbs__inner {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 10px;

    width: 100%;
    box-sizing: border-box;

    padding: 13px 18px;

    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.04);
    border-radius: 22px;

    box-shadow:
        0 6px 18px rgba(0, 0, 0, 0.06),
        0 1px 3px rgba(0, 0, 0, 0.03);

    overflow: hidden;
}

/* Контейнер Yoast */
.article-breadcrumbs__inner > span:first-child {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;

    min-width: 0;
    width: 100%;
}

/* Ссылки */
.article-breadcrumbs a {
    color: #2f6b3b;
    font-weight: 600;
    text-decoration: none;

    white-space: nowrap;
    flex-shrink: 0;

    transition: color .2s ease;
}

.article-breadcrumbs a:hover {
    color: #16A34A;
    text-decoration: none;
}

/* Разделители */
.article-breadcrumbs__sep {
    display: inline-flex;
    align-items: center;

    color: #8b8b8b;
    opacity: .7;

    font-size: 16px;
    line-height: 1;

    flex-shrink: 0;
}

/* Текущая страница */
.article-breadcrumbs .breadcrumb_last {
    display: block;

    flex: 1 1 auto;
    min-width: 0;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

    color: #111;
    font-weight: 500;
}


/* Mobile */
@media (max-width: 600px) {

    .article-breadcrumbs {
        margin-bottom: 16px;
        font-size: 13px;
    }

    .article-breadcrumbs__inner {
        padding: 12px 14px;
        gap: 8px;

        border-radius: 18px;
    }

    .article-breadcrumbs__inner > span:first-child {
        gap: 8px !important;
    }

    .article-breadcrumbs__sep {
        font-size: 15px;
    }
}

.article-banner__media {
    position: relative;
    overflow: hidden;
    border-radius: 24px;
    margin-bottom: 24px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, .12), 0 6px 16px rgba(0, 0, 0, .08);
}

.article-banner__img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.article-banner__img--placeholder {
    aspect-ratio: 16 / 9;
    background: linear-gradient(135deg, #eaffea, #dbe3ec);
}

.article-banner__overlay {
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 24px;
    background: #fff;
    border-radius: 18px;
    padding: 18px 24px;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .18);
}

.article-banner__title {
    position: relative;
    margin: 0 0 24px;
    padding-left: 18px;
    color: #2f6b3b;
    font-size: clamp(30px, 3.5vw, 38px);
    font-weight: 750;
    line-height: 1.2;
    letter-spacing: -0.02em;
}

.article-banner__title::before {
    content: "";

    position: absolute;
    top: 0.12em;
    bottom: 0.12em;
    left: 0;

    width: 4px;
    border-radius: 4px;

    background: #2f6b3b;
}
.article-banner__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 20px;
    color: #555;
    font-size: 14px;
}

.article-banner__meta-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.article-banner__icon {
    width: 18px;
    height: 18px;
    fill: #2f6b3b;
    flex-shrink: 0;
}

@media (max-width: 600px) {
    .article-banner__meta {
        gap: 8px 16px;
        font-size: 13px;
    }

    .article-banner__overlay {
        left: 12px;
        right: 12px;
        bottom: 12px;
        padding: 14px 16px;
    }

    .article-banner__title {
        padding-left: 12px;
        margin-bottom: 8px;
        font-size: clamp(18px, 5vw, 24px);
    }
}



/* =========================================================
   EASY TABLE OF CONTENTS — AUTOLIST
   ========================================================= */

#ez-toc-container {
    --toc-accent: #2f6b3b;
    --toc-accent-dark: #16a34a;

    --toc-text: #24364c;
    --toc-muted: #617184;

    --toc-border: #dbe3ec;
    --toc-background: #fbfcfe;
    --toc-header-background: #f4f7fa;
    --toc-line: #e3e9f0;

    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;

    margin: 30px 0 38px !important;
    padding: 0 !important;
    overflow: hidden !important;

    border: 1px solid var(--toc-border) !important;
    border-radius: 12px !important;

    background: var(--toc-background) !important;

    box-shadow:
        0 4px 18px rgba(16, 42, 76, 0.04) !important;
}


/* Верхняя строка */
#ez-toc-container .ez-toc-title-container {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    min-height: 66px !important;
    box-sizing: border-box !important;

    margin: 0 !important;
    padding: 12px 16px 12px 20px !important;

    border-bottom: 1px solid var(--toc-border) !important;

    background: var(--toc-header-background) !important;
}


/* Заголовок */
#ez-toc-container .ez-toc-title {
    display: flex !important;
    align-items: center !important;

    margin: 0 !important;
    padding: 0 !important;

    color: var(--toc-accent) !important;

    font-size: 21px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
}


/* Иконка списка слева */
#ez-toc-container .ez-toc-title::before {
    content: "☷" !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 38px !important;

    width: 38px !important;
    height: 38px !important;

    margin-right: 12px !important;

    box-sizing: border-box !important;

    border: 3px solid #d4deea !important;
    border-radius: 50% !important;

    background: var(--toc-accent) !important;
    color: #ffffff !important;

    font-size: 19px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}


/* Область списка */
#ez-toc-container nav {
    display: block !important;

    margin: 0 !important;
    padding: 10px 28px 16px 24px !important;
}


/* Корневой список */
#ez-toc-container .ez-toc-list {
    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;

    counter-reset: autolist-toc !important;
}


/* Первый уровень */
#ez-toc-container .ez-toc-list > li {
    position: relative !important;

    display: block !important;

    margin: 0 !important;
    padding: 12px 0 12px 44px !important;

    border-bottom: 1px dashed var(--toc-line) !important;

    list-style: none !important;

    counter-increment: autolist-toc !important;
}


/* Последний пункт без линии */
#ez-toc-container .ez-toc-list > li:last-child {
    border-bottom: 0 !important;
}


/* Нумерация 1, 2, 3... */
#ez-toc-container .ez-toc-list > li::before {
    content: counter(autolist-toc) "." !important;

    position: absolute !important;

    top: 12px !important;
    left: 0 !important;

    display: block !important;

    width: 30px !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: none !important;

    color: var(--toc-accent) !important;

    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.55 !important;

    text-align: right !important;
}


/* Скрываем номера самого плагина */
#ez-toc-container .ez-toc-section-number {
    display: none !important;

    width: 0 !important;
    height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;
}


/* Ссылки первого уровня */
#ez-toc-container .ez-toc-list > li > a {
    display: block !important;

    margin: 0 !important;
    padding: 0 !important;

    color: var(--toc-text) !important;

    font-size: 17px !important;
    font-weight: 500 !important;
    line-height: 1.55 !important;

    text-decoration: none !important;

    box-shadow: none !important;

    transition:
        color 0.2s ease,
        transform 0.2s ease;
}


#ez-toc-container .ez-toc-list > li > a:hover {
    color: var(--toc-accent-dark) !important;

    transform: translateX(3px);
}


/* Вложенные списки */
#ez-toc-container .ez-toc-list ul,
#ez-toc-container .ez-toc-list ol {
    margin: 9px 0 0 !important;
    padding: 0 0 0 22px !important;

    list-style: none !important;

    counter-reset: none !important;
}


/* Вложенные пункты */
#ez-toc-container .ez-toc-list ul li,
#ez-toc-container .ez-toc-list ol li {
    position: relative !important;

    margin: 0 !important;
    padding: 7px 0 7px 18px !important;

    border: 0 !important;

    list-style: none !important;

    counter-increment: none !important;
}


/* Маркер вложенного пункта */
#ez-toc-container .ez-toc-list ul li::before,
#ez-toc-container .ez-toc-list ol li::before {
    content: "—" !important;

    position: absolute !important;

    top: 7px !important;
    left: 0 !important;

    display: block !important;

    width: auto !important;

    color: var(--toc-accent) !important;

    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
}


/* Ссылки вложенных пунктов */
#ez-toc-container .ez-toc-list ul a,
#ez-toc-container .ez-toc-list ol a {
    display: block !important;

    color: var(--toc-muted) !important;

    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;

    text-decoration: none !important;

    box-shadow: none !important;

    transition: color 0.2s ease;
}


#ez-toc-container .ez-toc-list ul a:hover,
#ez-toc-container .ez-toc-list ol a:hover {
    color: var(--toc-accent-dark) !important;
}


/* Фокус клавиатуры */
#ez-toc-container a:focus-visible,
#ez-toc-container button:focus-visible {
    outline: 3px solid rgba(16, 42, 76, 0.18) !important;
    outline-offset: 3px !important;
}


/* Убираем встроенную нумерацию Easy Table of Contents */
#ez-toc-container .ez-toc-list li > a::before {
    content: none !important;

    display: none !important;

    counter-increment: none !important;

    margin: 0 !important;
}


/* Полностью убираем кнопку сворачивания */
#ez-toc-container .ez-toc-title-toggle {
    display: none !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    #ez-toc-container {
        margin: 24px 0 30px !important;

        border-radius: 10px !important;
    }


    #ez-toc-container .ez-toc-title-container {
        min-height: 60px !important;

        padding: 10px 11px 10px 14px !important;
    }


    #ez-toc-container .ez-toc-title {
        font-size: 19px !important;
    }


    #ez-toc-container .ez-toc-title::before {
        flex-basis: 34px !important;

        width: 34px !important;
        height: 34px !important;

        margin-right: 9px !important;

        font-size: 17px !important;
    }


    #ez-toc-container nav {
        padding: 8px 15px 12px 16px !important;
    }


    #ez-toc-container .ez-toc-list > li {
        padding: 10px 0 10px 38px !important;
    }


    #ez-toc-container .ez-toc-list > li::before {
        top: 10px !important;

        width: 26px !important;

        font-size: 15px !important;
        line-height: 1.45 !important;
    }


    #ez-toc-container .ez-toc-list > li > a {
        font-size: 15px !important;
        line-height: 1.45 !important;
    }
}


/* =========================
   FAQ-блок
   ========================= */

.faq-block {
    --faq-accent: #2f6b3b;
    --faq-accent-hover: #173b66;

    --faq-text: #24364c;
    --faq-muted: #5f6f82;

    --faq-border: #dbe3ec;
    --faq-border-hover: #c2cfdd;

    --faq-hover: #f6f9fc;
    --faq-open: #f9fbfd;

    margin: 52px 0 40px;
    counter-reset: faq-counter;
}

/* Отдельный вопрос */
.faq-item {
    margin: 0 0 12px;
    overflow: hidden;

    border: 1px solid var(--faq-border);
    border-radius: 10px;

    background: #ffffff;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        background-color 0.2s ease;

    counter-increment: faq-counter;
}

.faq-item:hover {
    border-color: var(--faq-border-hover);

    box-shadow:
        0 4px 16px rgba(16, 42, 76, 0.06);
}

.faq-item[open] {
    border-color: #b9c8d8;
    background: var(--faq-open);

    box-shadow:
        0 5px 18px rgba(16, 42, 76, 0.07);
}

/* Вопрос */
.faq-item summary {
    position: relative;

    display: flex;
    align-items: center;

    min-height: 72px;

    padding: 18px 62px 18px 26px;

    color: var(--faq-text);

    font-size: 18px;
    font-weight: 700;
    line-height: 1.45;

    cursor: pointer;
    list-style: none;
    user-select: none;

    transition:
        color 0.2s ease,
        background-color 0.2s ease;
}

/* Убираем стандартный треугольник */
.faq-item summary::-webkit-details-marker {
    display: none;
}

.faq-item summary::marker {
    display: none;
    content: "";
}

.faq-item summary:hover {
    background: var(--faq-hover);
    color: var(--faq-accent);
}

/* Автоматическая нумерация вопросов */
.faq-item summary::before {
    content: counter(faq-counter) ".";

    flex: 0 0 auto;

    margin-right: 7px;

    color: var(--faq-accent);

    font-weight: 700;
}

/* Значок плюс */
.faq-item summary::after {
    content: "+";

    position: absolute;

    top: 50%;
    right: 25px;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 28px;
    height: 28px;

    color: var(--faq-accent);

    font-size: 27px;
    font-weight: 500;
    line-height: 1;

    transform: translateY(-50%);

    transition:
        color 0.2s ease,
        transform 0.2s ease;
}

.faq-item summary:hover::after {
    color: var(--faq-accent-hover);
}

/* Значок минус в открытом вопросе */
.faq-item[open] summary::after {
    content: "−";
    color: var(--faq-accent);
}

/* Акцентная линия под открытым вопросом */
.faq-item[open] summary {
    border-bottom: 2px solid var(--faq-accent);
}

/* Ответ */
.faq-answer {
    padding: 24px 28px 26px;

    color: var(--faq-muted);

    font-size: 17px;
    font-weight: 400;
    line-height: 1.75;
}

/* Абзацы */
.faq-answer p {
    margin: 0 0 16px;
}

.faq-answer p:last-child {
    margin-bottom: 0;
}

/* Списки */
.faq-answer ul,
.faq-answer ol {
    margin: 15px 0 0;
}

.faq-answer li {
    margin-bottom: 7px;
}

/* Фокус */
.faq-item summary:focus-visible {
    outline: 3px solid rgba(16, 42, 76, 0.18);
    outline-offset: -3px;
    border-radius: 9px;
}


/* =========================
   MOBILE
   ========================= */

@media (max-width: 767px) {

    .faq-block {
        margin: 40px 0 30px;
    }

    .faq-block > h2 {
        margin-bottom: 20px;
    }

    .faq-item {
        margin-bottom: 10px;
        border-radius: 9px;
    }

    .faq-item summary {
        min-height: 64px;

        padding:
            16px
            48px
            16px
            17px;

        font-size: 16px;
        line-height: 1.4;
    }

    .faq-item summary::before {
        margin-right: 5px;
    }

    .faq-item summary::after {
        right: 15px;

        width: 24px;
        height: 24px;

        font-size: 24px;
    }

    .faq-answer {
        padding:
            19px
            17px
            21px;

        font-size: 16px;
        line-height: 1.7;
    }
}



/* =========================================================
   AUTOLIST — НАВИГАЦИЯ МЕЖДУ СТАТЬЯМИ
   ========================================================= */

.autolist-post-navigation {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 28px;

    margin: 42px 0 28px;
    padding: 28px 0;

    border-top: 1px solid #dbe3ec;
    border-bottom: 1px solid #dbe3ec;
}

.autolist-post-nav {
    display: flex;
    flex-direction: column;
    justify-content: center;

    min-width: 0;

    color: #24364c;
    text-decoration: none !important;

    transition:
        color 0.2s ease,
        transform 0.2s ease;
}

.autolist-post-nav--next {
    align-items: flex-end;
    text-align: right;
}

.autolist-post-nav:hover {
    color: #173b66;
}

.autolist-post-nav--previous:hover {
    transform: translateX(-3px);
}

.autolist-post-nav--next:hover {
    transform: translateX(3px);
}

.autolist-post-nav__direction {
    display: block;
    margin-bottom: 7px;

    color: #16a34a;

    font-size: 13px;
    font-weight: 700;
    line-height: 1.3;

    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.autolist-post-nav__title {
    display: block;

    color: #24364c;

    font-size: 17px;
    font-weight: 700;
    line-height: 1.45;

    overflow-wrap: anywhere;

    transition: color 0.2s ease;
}

.autolist-post-nav:hover .autolist-post-nav__title {
    color: #2f6b3b;
}



/* =========================================================
   AUTOLIST — БЛОК АВТОРА
   ========================================================= */

.autolist-author-box {
    margin: 28px 0 42px;
    padding: 28px 32px;

    border: 1px solid #dbe3ec;
    border-left: 4px solid #2f6b3b;
    border-radius: 12px;

    background: #ffffff;

    box-shadow:
        0 8px 28px rgba(16, 42, 76, 0.06);
}

.autolist-author-box__title {
    margin: 0 0 10px !important;

    color: #2f6b3b;

    font-size: 22px !important;
    font-weight: 700;
    line-height: 1.3;
}

.autolist-author-box__description {
    color: #5f6f82;

    font-size: 16px;
    line-height: 1.75;
}

.autolist-author-box__description p {
    margin: 0;
}


/* =========================================================
   МОБИЛЬНАЯ ВЕРСИЯ
   ========================================================= */

@media (max-width: 767px) {

    .autolist-post-navigation {
        grid-template-columns: 1fr;
        gap: 0;

        margin: 32px 0 24px;
        padding: 0;

        border: 1px solid #dbe3ec;
        border-radius: 12px;
        overflow: hidden;

        background: #ffffff;
    }

    .autolist-post-nav {
        padding: 20px;
    }

    .autolist-post-nav + .autolist-post-nav {
        border-top: 1px solid #dbe3ec;
    }

    .autolist-post-nav--next {
        align-items: flex-start;
        text-align: left;
    }

    .autolist-post-nav--previous:hover,
    .autolist-post-nav--next:hover {
        transform: none;
    }

    .autolist-post-nav__title {
        font-size: 16px;
    }

    .autolist-post-nav--empty {
        display: none;
    }

    .autolist-author-box {
        margin: 24px 0 34px;
        padding: 22px 20px;

        border: 1px solid #dbe3ec;
        border-left: 3px solid #2f6b3b;
        border-radius: 10px;

        background: #ffffff;

        box-shadow:
            0 6px 20px rgba(16, 42, 76, 0.05);
    }

    .autolist-author-box__title {
        display: block;

        color: #2f6b3b;

        font-size: 20px !important;
    }

    .autolist-author-box__description {
        color: #5f6f82;

        font-size: 15px;
        line-height: 1.7;
    }
}



/* =========================================================
   AUTOLIST — РЕКОМЕНДУЕМЫЕ СТАТЬИ
   ========================================================= */

.autolist-recommended {
    margin: 42px 0 50px;
}

.autolist-recommended__heading {
    position: relative;

    margin: 0 0 24px !important;
    padding-left: 17px;

    color: #2f6b3b;

    font-size: 26px !important;
    font-weight: 700;
    line-height: 1.3;
}

.autolist-recommended__heading::before {
    content: "";

    position: absolute;
    top: 4px;
    bottom: 4px;
    left: 0;

    width: 4px;

    border-radius: 4px;
    background: #2f6b3b;
}

.autolist-recommended__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.autolist-recommended-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    overflow: hidden;

    border: 1px solid #dbe3ec;
    border-radius: 12px;

    background: #ffffff;

    box-shadow:
        0 6px 22px rgba(16, 42, 76, 0.06);

    transition:
        transform 0.22s ease,
        box-shadow 0.22s ease,
        border-color 0.22s ease;
}

.autolist-recommended-card:hover {
    transform: translateY(-4px);

    border-color: #c2cfdd;

    box-shadow:
        0 12px 30px rgba(16, 42, 76, 0.11);
}

.autolist-recommended-card__image-link {
    position: relative;

    display: block;
    overflow: hidden;

    aspect-ratio: 16 / 9;

    background: #f1f5f9;

    text-decoration: none !important;
}

.autolist-recommended-card__image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 0.35s ease;
}

.autolist-recommended-card:hover
.autolist-recommended-card__image {
    transform: scale(1.04);
}

.autolist-recommended-card__placeholder {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;

    color: #2f6b3b;

    font-size: 22px;
    font-weight: 700;

    background:
        linear-gradient(
            135deg,
            #f7f9fc 0%,
            #edf2f7 100%
        );
}

.autolist-recommended-card__content {
    display: flex;
    flex: 1;
    flex-direction: column;

    padding: 18px 19px 21px;
}

.autolist-recommended-card__title {
    margin: 0 !important;

    font-size: 18px !important;
    font-weight: 700;
    line-height: 1.42;
}

.autolist-recommended-card__title a {
    color: #24364c;

    text-decoration: none !important;

    transition: color 0.2s ease;
}

.autolist-recommended-card__title a:hover {
    color: #16a34a;
}


/* Даты публикации и обновления */

.autolist-recommended-card__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap: 4px 10px;

    margin-top: 10px;

    color: #7a8898;

    font-size: 12px;
    line-height: 1.4;
}

.autolist-recommended-card__date {
    display: inline-block;
}

.autolist-recommended-card__date--updated {
    color: #687789;
}


/* Планшеты */

@media (max-width: 1024px) {

    .autolist-recommended__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .autolist-recommended-card:last-child {
        display: none;
    }
}


/* Смартфоны */

@media (max-width: 767px) {

    .autolist-recommended {
        margin: 34px 0 40px;
    }

    .autolist-recommended__heading {
        margin-bottom: 19px !important;
        padding-left: 14px;

        font-size: 22px !important;
    }

    .autolist-recommended__heading::before {
        top: 3px;
        bottom: 3px;

        width: 3px;
    }

    .autolist-recommended__grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .autolist-recommended-card:last-child {
        display: flex;
    }

    .autolist-recommended-card {
        border-radius: 10px;
    }

    .autolist-recommended-card:hover {
        transform: none;
    }

    .autolist-recommended-card__content {
        padding: 16px 17px 19px;
    }

    .autolist-recommended-card__title {
        font-size: 17px !important;
    }
}


/* =========================================================
   AUTOLIST — SITE SEARCH
   ========================================================= */

/* ===== Modern Site Search ===== */

.site-search {
    position: fixed;
    inset: 0;
    z-index: 9999;

    display: flex;
    align-items: flex-start;
    justify-content: center;

    padding: 12vh 24px 40px;
}

.site-search[hidden] {
    display: none;
}

.site-search__backdrop {
    position: absolute;
    inset: 0;

    background: rgba(12, 18, 12, .68);

    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);

    opacity: 0;

    transition: opacity .25s ease;
}

.site-search__panel {
    position: relative;
    z-index: 1;

    width: min(900px, 100%);
    box-sizing: border-box;

    background: #fff;

    border: 1px solid rgba(0, 0, 0, .06);
    border-radius: 28px;

    padding: 68px 64px 64px;

    box-shadow:
        0 32px 85px rgba(0, 0, 0, .30),
        0 4px 18px rgba(0, 0, 0, .08);

    opacity: 0;

    transform: translateY(-22px) scale(.98);

    transition:
        opacity .25s ease,
        transform .25s ease;
}

.site-search.is-open .site-search__backdrop {
    opacity: 1;
}

.site-search.is-open .site-search__panel {
    opacity: 1;
    transform: translateY(0) scale(1);
}


/* Header */

.site-search__header {
    margin-bottom: 32px;
}

.site-search__title {
    margin: 0 0 9px;

    font-size: clamp(32px, 4vw, 44px);
    line-height: 1.12;

    font-weight: 700;

    color: #2f6b3b;
}

.site-search__subtitle {
    margin: 0;

    font-size: 17px;
    line-height: 1.5;

    color: #777;
}


/* Close */

.site-search__close {
    position: absolute;

    top: 22px;
    right: 22px;

    width: 46px;
    height: 46px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0;

    border: 1px solid #e7e7e7;
    border-radius: 50%;

    background: #fff;
    color: #222;

    cursor: pointer;

    box-shadow:
        0 4px 14px rgba(0, 0, 0, .06);

    transition:
        background .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

.site-search__close:hover {
    background: #f6f6f6;

    transform: rotate(90deg);

    box-shadow:
        0 6px 18px rgba(0, 0, 0, .09);
}

.site-search__close svg {
    width: 20px;
    height: 20px;
}


/* Search form */

.site-search__form {
    display: flex;
    align-items: center;

    min-height: 76px;

    padding: 8px 10px 8px 20px;

    border: 1px solid #d8dee2;
    border-radius: 20px;

    background: #fff;

    box-shadow:
        0 8px 24px rgba(0, 0, 0, .04);

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.site-search__form:focus-within {
    border-color: #78b970;

    box-shadow:
        0 0 0 3px rgba(28, 114, 17, .08),
        0 12px 28px rgba(28, 114, 17, .08);
}


/* Left search icon */

.site-search__field-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 30px;

    flex: 0 0 auto;

    color: #7f8993;
}

.site-search__field-icon svg {
    width: 25px;
    height: 25px;
}


/* Input */

.site-search__input {
    flex: 1 1 auto;

    min-width: 0;
    height: 56px;

    padding: 0 16px;

    border: 0;
    outline: 0;

    background: transparent;

    color: #171717;

    font-size: 19px;
    line-height: 1;
}

.site-search__input::placeholder {
    color: #929ba5;
}

.site-search__input::-webkit-search-cancel-button,
.site-search__input::-webkit-search-decoration {
    -webkit-appearance: none;
    appearance: none;
}


/* Submit */

.site-search__submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 56px;
    height: 56px;

    flex: 0 0 auto;

    padding: 0;

    border: 0;
    border-radius: 16px;

    background: #22B653;
    color: #fff;

    cursor: pointer;

    box-shadow:
        0 8px 18px rgba(22, 132, 20, .22);

    transition:
        background .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}

.site-search__submit:hover {
    background: #199B45;

    transform: translateY(-1px);

    box-shadow:
        0 10px 22px rgba(22, 132, 20, .28);
}

.site-search__submit:active {
    transform: translateY(0);
}

.site-search__icon {
    width: 24px;
    height: 24px;
}


/* Disable body scroll */

body.search-open {
    overflow: hidden;
}


/* ===== Mobile ===== */

@media (max-width: 600px) {

    .site-search {
        padding:
            max(32px, env(safe-area-inset-top))
            14px
            20px;
    }

    .site-search__panel {
        width: 100%;

        padding: 64px 18px 26px;

        border-radius: 22px;
    }

    .site-search__close {
        top: 14px;
        right: 14px;

        width: 40px;
        height: 40px;
    }

    .site-search__close svg {
        width: 18px;
        height: 18px;
    }

    .site-search__header {
        margin-bottom: 22px;
    }

    .site-search__title {
        font-size: 28px;
    }

    .site-search__subtitle {
        font-size: 14px;
    }

    .site-search__form {
        min-height: 62px;

        padding: 5px 6px 5px 13px;

        border-radius: 16px;
    }

    .site-search__field-icon {
        width: 23px;
    }

    .site-search__field-icon svg {
        width: 20px;
        height: 20px;
    }

    .site-search__input {
        height: 48px;

        padding: 0 10px;

        font-size: 16px;
    }

    .site-search__submit {
        width: 48px;
        height: 48px;

        border-radius: 13px;
    }

    .site-search__icon {
        width: 21px;
        height: 21px;
    }
}


/* =========================================================
   AUTOLIST — BACK TO TOP
   ========================================================= */

/* ===== Back to top ===== */
.back-to-top {
    position: fixed;
    right: 24px;
    bottom: 24px;
    width: 48px;
    height: 48px;
    border: 0;
    border-radius: 50%;
    background: #2f6b3b;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .18);
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: opacity .25s ease, transform .25s ease, visibility .25s, background .2s ease;
    z-index: 60;
}

.back-to-top.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.back-to-top:hover {
    background: #16A34A;
}

.back-to-top svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
}

.single-post-page {
    margin-top: 30px;
}

@media (max-width: 600px) {
    .back-to-top {
        right: 16px;
        bottom: 16px;
        width: 42px;
        height: 42px;
    }
}


/* =========================================================
   AUTOLIST — FOOTER
   ========================================================= */

/* ===== Footer ===== */
.footer {
    padding: 24px 0 32px;
    background: #fff;
    border-top: 1px solid #eee
}

.footer__container {
    display: grid;
    grid-template-columns: 0.7fr 2fr 0.9fr;
    gap: 12px;
    align-items: center;
}

.footer__menu {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    list-style: none;
    margin: 0;
    padding: 0;
    justify-content: center;
}

.footer__brand img {
    width: 200px;
}

.footer__copy {
    text-align: center;
}

.footer__phone {
    font-weight: 500;
    font-size: 18px;
}

.footer__bottom {
    display: flex;
    justify-content: space-between;
    gap: 50px;
}


.desc-hidden {
    display: none;
}

@media (max-width: 600px) {
    .footer__bottom {
        gap: 0;
        flex-direction: column;
    }

    .desc-hidden {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
}
@media (max-width: 550px) {
    .footer__menu {
        margin: 0 auto;
        padding: 0 0 10px;
        flex-direction: column;
        border-bottom: 1px solid #0000005c;
        width: 80%;
    }

    .footer__col {
        width: 100%;
    }

    .footer__container {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .footer__contacts {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .footer__brand img {
        margin: 0 auto;
    }
}


/* =========================================================
   AUTOLIST — HEADER RESPONSIVE
   ========================================================= */

.header__lang_mob,
.header__search-toggle_mob,
.headder__mob_btns {
    display: none;
}

@media (max-width: 980px) {
    .header__nav > .menu.header__menu {
        gap: 12px;
    }
}

@media (max-width: 600px) {
    .header__burger {
        display: inline-block;
    }

    .header__nav {
        position: fixed;
        inset: 64px 12px auto 12px;
        background: #fff;
        border: 1px solid #eee;
        padding: 12px;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        transform: translateY(-10px);
        opacity: 0;
        pointer-events: none;
        transition: .2s;
    }

    .header__nav.is-open {
    transform: none;
    opacity: 1;
    pointer-events: auto;
    top: 80px;
    left: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-top: 90px;
}

    .header__cta {
        display: none;
    }

    .header__nav.is-open .btn {
        max-width: 300px;
        margin: 0 auto 150px;
        border: none;
        font-weight: 500;
        font-size: 20px;
    }

    .langsw {
        display: inline-block;
        font-weight: 600;
    }

    .langsw.pills .langsw__link {
        padding: 4px 8px;
        font-size: 13px;
    }

    .header__menu {
        flex-direction: column;
        border-bottom: 1px solid #b3b3b3;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }

    .header__menu .menu-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-transform: uppercase;
        font-size: 18px;
        line-height: 1.7;
        gap: 14px;
    }

    .headder__mob_btns,
    .header__lang_mob,
    .header__search-toggle_mob {
        display: flex;
        align-items: center;
    }

    .header__lang_desk,
    .header__search-toggle_desk {
        display: none;
    }
}

@media (max-width: 550px) {
    .header__nav .sub-menu {
        background: transparent;
        border-radius: 0;
        box-shadow: none;
        position: relative;
        top: -20px;
        opacity: 1;
        visibility: visible;
    }
}
/* =========================================================
   AUTOLIST — PREMIUM 404
   ========================================================= */

.autolist-404 {
    background: #FEFEFF;
}


/* HERO */

.autolist-404__hero {
    padding: 54px 0 30px;
}

.autolist-404__box {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(380px, .95fr);
    align-items: center;

    min-height: 500px;

    overflow: hidden;

    border: 1px solid #e3eaf1;
    border-radius: 22px;

    background:
        linear-gradient(
            115deg,
            #ffffff 0%,
            #ffffff 44%,
            #f6f9fc 100%
        );

    box-shadow:
        0 20px 50px rgba(16, 42, 76, .07),
        0 3px 10px rgba(16, 42, 76, .03);
}


/* CONTENT */

.autolist-404__content {
    position: relative;
    z-index: 2;

    padding: 52px 24px 52px 54px;
}

.autolist-404__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    margin-bottom: 10px;

    color: #526579;

    font-size: 14px;
    font-weight: 700;

    letter-spacing: .04em;
    text-transform: uppercase;
}

.autolist-404__eyebrow-dot {
    display: block;

    width: 8px;
    height: 8px;

    border-radius: 50%;

    background: #22b653;

    box-shadow:
        0 0 0 5px rgba(34, 182, 83, .10);
}


.autolist-404__number {
    margin: 0 0 -8px;

    color: #2f6b3b;

    font-size: clamp(82px, 9vw, 132px);
    font-weight: 900;
    line-height: .95;

    letter-spacing: -.075em;

    opacity: .08;

    user-select: none;
}


.autolist-404__title {
    max-width: 650px;

    margin: 0 0 17px;

    color: #2f6b3b;

    font-size: clamp(32px, 3.6vw, 46px);
    font-weight: 800;
    line-height: 1.12;

    letter-spacing: -.035em;
}


.autolist-404__text {
    max-width: 660px;

    margin: 0 0 28px;

    color: #5d6d80;

    font-size: 16px;
    line-height: 1.7;
}


/* SEARCH */

.autolist-404__search {
    position: relative;

    display: flex;
    align-items: center;

    width: min(100%, 650px);

    margin-bottom: 22px;

    padding: 6px;

    border: 1px solid #dce5ed;
    border-radius: 10px;

    background: #ffffff;

    box-shadow:
        0 8px 24px rgba(16, 42, 76, .055);
}

.autolist-404__search:focus-within {
    border-color: #22b653;

    box-shadow:
        0 0 0 3px rgba(34, 182, 83, .10),
        0 8px 24px rgba(16, 42, 76, .06);
}

.autolist-404__search-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 auto;

    width: 42px;
    height: 42px;

    color: #7b8998;
}

.autolist-404__search-icon svg {
    width: 21px;
    height: 21px;
}

.autolist-404__search-input {
    flex: 1 1 auto;

    min-width: 0;
    height: 48px;

    padding: 0 12px 0 4px;

    border: 0;
    outline: 0;

    background: transparent;

    color: #2f6b3b;

    font-family: inherit;
    font-size: 14px;
}

.autolist-404__search-input::placeholder {
    color: #8e9aa8;
}

.autolist-404__search-button {
    flex: 0 0 auto;

    height: 46px;

    padding: 0 22px;

    border: 0;
    border-radius: 7px;

    background: #22b653;
    color: #ffffff;

    font-family: inherit;
    font-size: 14px;
    font-weight: 700;

    cursor: pointer;

    transition:
        background-color .2s ease,
        transform .2s ease;
}

.autolist-404__search-button:hover {
    background: #199b45;
}

.autolist-404__search-button:active {
    transform: scale(.97);
}


/* ACTIONS */

.autolist-404__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.autolist-404__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    min-height: 46px;

    padding: 0 19px;

    border-radius: 8px;

    font-size: 14px;
    font-weight: 700;

    text-decoration: none;

    transition:
        color .2s ease,
        background-color .2s ease,
        border-color .2s ease,
        transform .2s ease;
}

.autolist-404__button svg {
    width: 18px;
    height: 18px;
}

.autolist-404__button:hover {
    transform: translateY(-1px);
}

.autolist-404__button--primary {
    border: 1px solid #2f6b3b;

    background: #2f6b3b;
    color: #ffffff;
}

.autolist-404__button--primary:hover {
    background: #173b66;
    border-color: #173b66;

    color: #ffffff;
}

.autolist-404__button--secondary {
    border: 1px solid #d9e3ec;

    background: #ffffff;
    color: #2f6b3b;
}

.autolist-404__button--secondary:hover {
    border-color: #c3d0dc;

    background: #f4f7fa;
    color: #2f6b3b;
}


/* VISUAL */

.autolist-404__visual {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 500px;

    overflow: hidden;
}

.autolist-404__visual::before {
    content: "";

    position: absolute;

    width: 390px;
    height: 390px;

    border: 1px solid rgba(16, 42, 76, .05);
    border-radius: 50%;
}

.autolist-404__visual::after {
    content: "";

    position: absolute;

    width: 300px;
    height: 300px;

    border: 1px solid rgba(16, 42, 76, .04);
    border-radius: 50%;
}

.autolist-404__visual-glow {
    position: absolute;

    width: 360px;
    height: 360px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(34, 182, 83, .11) 0%,
            rgba(34, 182, 83, .035) 44%,
            rgba(34, 182, 83, 0) 72%
        );
}

.autolist-404__car {
    position: relative;
    z-index: 2;

    width: min(100%, 560px);
    height: auto;

    transform: translateX(-5px);
}


/* QUICK */

.autolist-404__quick {
    padding: 30px 0 36px;
}

.autolist-404__section-title {
    margin: 0 0 18px;

    color: #2f6b3b;

    font-size: 24px;
    font-weight: 800;
    line-height: 1.3;
}

.autolist-404__quick-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);

    gap: 12px;
}

.autolist-404__quick-item {
    display: flex;
    align-items: flex-start;

    gap: 14px;

    padding: 19px;

    border: 1px solid #e3e9ef;
    border-radius: 10px;

    background: #ffffff;

    box-shadow:
        0 3px 10px rgba(16, 42, 76, .025);
}

.autolist-404__quick-number {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 36px;

    width: 36px;
    height: 36px;

    border-radius: 8px;

    background: #f0f8f3;

    color: #22b653;

    font-size: 14px;
    font-weight: 800;
}

.autolist-404__quick-item h3 {
    margin: 0 0 5px;

    color: #2f6b3b;

    font-size: 15px;
    font-weight: 800;
}

.autolist-404__quick-item p {
    margin: 0;

    color: #6a7888;

    font-size: 13px;
    line-height: 1.55;
}


/* ARTICLES */

.autolist-404__articles {
    padding: 10px 0 54px;
}


/* TABLET */

@media (max-width: 1000px) {

    .autolist-404__box {
        grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
    }

    .autolist-404__content {
        padding-left: 36px;
    }

}


/* MOBILE */

@media (max-width: 767px) {

    .autolist-404__hero {
        padding: 26px 0 18px;
    }

    .autolist-404__box {
        display: flex;
        flex-direction: column;

        min-height: 0;

        border-radius: 16px;
    }

    .autolist-404__content {
        width: 100%;

        padding: 28px 18px 12px;
    }

    .autolist-404__number {
        font-size: 84px;
    }

    .autolist-404__title {
        font-size: 29px;
        line-height: 1.16;
    }

    .autolist-404__text {
        margin-bottom: 22px;

        font-size: 14px;
        line-height: 1.6;
    }


    /* SEARCH */

    .autolist-404__search {
        padding: 5px;
    }

    .autolist-404__search-icon {
        width: 36px;
    }

    .autolist-404__search-input {
        font-size: 13px;
    }

    .autolist-404__search-button {
        padding: 0 15px;
    }


    /* BUTTONS */

    .autolist-404__actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .autolist-404__button {
        padding: 0 12px;
    }


    /* IMAGE */

    .autolist-404__visual {
        width: 100%;
        min-height: 250px;
    }

    .autolist-404__visual::before {
        width: 270px;
        height: 270px;
    }

    .autolist-404__visual::after {
        width: 210px;
        height: 210px;
    }

    .autolist-404__visual-glow {
        width: 270px;
        height: 270px;
    }

    .autolist-404__car {
        width: 350px;
        max-width: 105%;
    }


    /* QUICK */

    .autolist-404__quick {
        padding: 20px 0 30px;
    }

    .autolist-404__section-title {
        font-size: 21px;
    }

    .autolist-404__quick-grid {
        grid-template-columns: 1fr;

        gap: 8px;
    }

    .autolist-404__quick-item {
        padding: 16px;
    }

    .autolist-404__articles {
        padding-bottom: 38px;
    }

}


/* SMALL MOBILE */

@media (max-width: 430px) {

    .autolist-404__actions {
        grid-template-columns: 1fr;
    }

    .autolist-404__search-icon {
        display: none;
    }

    .autolist-404__search-input {
        padding-left: 10px;
    }

}