/*
Theme Name: WEB-MASTER NEW DESIGN
Theme URI: https://web-master.kz/
Author: WEB-MASTER.KZ
Description: Блочная тема WordPress по референсу web-master.kz — создание и продвижение сайтов.
Version: 1.0.20
Requires at least: 6.5
Requires PHP: 7.4
Text Domain: webmaster
*/

:root{
	--color-accent: #e31e24;
	--color-accent-2: #FD7B2F;
	--color-text: #323232;
	--color-black: #000000;
	--color-border: #E5E5E5;
	--color-bg: #ffffff;

	--container-width: 1200px;
	--gap: 30px;
	--radius: 8px;

	--color-search-btn: #2f80ed;

	--header-topbar-padding: 14px 40px;
	--header-nav-padding: 10px 40px;
	--header-logo-width: 170px;
	--header-topbar-gap: 24px;
	--header-actions-gap: 28px;
	/* мобильное меню (бургер, ≤600px) */
	--header-menu-padding: 16px 24px 32px;
	--header-menu-content-top: 44px;
	--header-menu-item-size: 17px;
	--header-menu-item-padding: 14px 0;
	--header-menu-sub-size: 15px;
	--header-menu-sub-padding: 8px 0 8px 22px;

	--hero-height: 690px;
	--hero-padding-top: 285px;
	--hero-title-size: 55px;
	--hero-title-line: 67px;
	--hero-title-weight: 800;
	--hero-title-width: 700px;
	--hero-link-bottom: 115px;
	--hero-link-size: 20px;
	--hero-link-arrow: 138px;
	--hero-nav-offset: 90px;
	--hero-nav-display: block;
	--hero-dot-size: 20px;
	--hero-dot-gap: 20px;
	--hero-dots-bottom: 32px;
	--hero-dot-active: #0581fc;

	--section-gap: 60px;

	--adv-gap: 30px;
	--adv-justify: flex-start;
	--adv-item-width: calc(25% - 23px);
	--adv-item-max: none;
	--adv-icon-size: 55px;
	--adv-font-size: 18px;
	--adv-line-height: 22px;

	--catalog-accent: #0581fc;
	--catalog-accent-hover: #0468cc;
	--catalog-border: #d9d9d9;
	--catalog-image-bg: #f4f4f4;
	--catalog-btn-radius: 3px;
	--catalog-columns: 3;
	--catalog-gap-x: 30px;
	--catalog-gap-y: 24px;
	--catalog-card-ratio: 270 / 294;
	--catalog-card-title-gap: 16px;
	--catalog-card-title-size: 18px;
	--catalog-card-title-line: 22px;
	--catalog-card-btn-height: 40px;
	--catalog-card-btn-size: 18px;
	--catalog-ink: #000f23;
	--catalog-muted: #959595;
	--catalog-page-top: 40px;
	--catalog-page-bottom: 50px;
	--catalog-title-size: 32px;
	--catalog-head-gap: 16px;
	--catalog-body-top: 25px;
	--catalog-body-gap: 32px;
	--catalog-crumbs-size: 16px;
	--catalog-text-size: 18px;
	--catalog-sidebar-width: 270px;
	--catalog-sidebar-row: 60px;
	--catalog-sidebar-title-size: 24px;
	--catalog-sidebar-size: 16px;
	--catalog-sidebar-sub-size: 15px;
	--catalog-pagination-top: 50px;
	--catalog-pagination-arrow: 32px;
	--catalog-services-accent: var(--color-accent);
	--catalog-sidebar-box-gap: 16px;
	--catalog-switch-height: 55px;
	--catalog-switch-size: 20px;
	--catalog-switch-gap: 20px;

	--service-card-ratio: 1;
	--service-card-btn-size: 15px;
	--service-image-width: 370px;
	--service-image-ratio: 370 / 410;
	--service-image-gap: 30px;
	--service-image-bleed: 0px;
	--service-stack-gap: 24px;
	--service-order-width: 370px;
	--service-order-height: 60px;
	--service-order-size: 20px;
	--service-order-top: 30px;

	--home-services-cols: 4;
	--home-services-gap-x: 30px;
	--home-services-gap-y: 30px;
	--home-services-ratio: 270 / 380;
	--home-services-bar: 60px;
	--home-services-bar-bg: rgba(0, 0, 0, .7);
	--home-services-name-size: 18px;

	--news-card-gap: 16px;
	--news-card-height: 200px;
	--news-card-radius: 6px;
	--news-image-width: 270px;
	--news-image-ratio: auto;
	--news-text-gap: 50px;
	--news-text-pad-top: 18px;
	--news-text-pad-right: 30px;
	--news-text-pad-bottom: 18px;
	--news-text-size: 18px;
	--news-line-gap: 16px;
	--news-excerpt-lines: 3;
	--news-date-size: 18px;
	--news-date-gap: 20px;
	/* Акции: плашка срока рядом с датой (sales.css) */
	--sale-meta-gap-x: 16px;
	--sale-meta-gap-y: 6px;
	--sale-period-size: 14px;
	--sale-period-pad-x: 10px;
	--sale-period-pad-y: 3px;
	--sale-period-radius: 4px;

	--about-block-gap: 32px;
	--about-title-size: 32px;
	--about-title-gap: 16px;
	--about-text-size: 18px;
	--about-text-line: 1.25;
	--about-details-size: 16px;
	--about-intro-gap: 30px;
	--about-form-width: 370px;
	--about-form-pad: 30px 42px;
	--about-form-bg: #f3f3f3;
	--about-form-title-size: 24px;
	--about-photo-width: 670px;
	--about-photo-ratio: 670 / 350;
	--about-thumb-width: 153px;
	--about-thumb-ratio: 153 / 98;
	--about-thumb-gap: 8px;
	--about-thumbs-gap: 34px;
	--about-thumbs-pad: 19px;
	--about-thumbs-max: 310px;
	--about-arrow-size: 18px;
	--about-arrow-offset: 10px;

	--cert-gap: 30px;
	--cert-portrait-ratio: 270 / 353;
	--cert-wide-ratio: 420 / 260;
	--cert-caption-size: 18px;
	--cert-caption-gap: 16px;
	--cert-mobile-width: 230px;

	--gallery-cols: 3;
	--gallery-gap: 30px;
	--gallery-radius: var(--radius);
	--gallery-caption-size: 16px;
	--gallery-caption-gap: 12px;
	--gallery-zoom-size: 48px;

	--faq-q-size: 18px;
	--faq-q-pad: 14px 20px;
	--faq-a-size: 16px;
	--faq-a-pad: 20px;
	--faq-sign-size: 30px;
	--faq-sign-gap: 10px;
	--faq-line: #ddd;
	--faq-ask-top: 50px;
	--faq-ask-width: 600px;
	--faq-ask-pad: 30px 42px;
	--faq-ask-title-size: 24px;

	--contacts-map-height: 482px;
	--contacts-map-bleed: 0px;
	--contacts-top: 32px;
	--contacts-gap: 30px;
	--contacts-form-width: 370px;
	--contacts-form-pad: 30px 44px 19px;
	--contacts-form-bg: #f3f3f3;
	--contacts-form-title-size: 24px;
	--contacts-title-size: 16px;
	--contacts-text-size: 16px;
	--contacts-item-gap: 14px;
	--contacts-block-gap: 28px;
	--contacts-icon-size: 18px;
	--contacts-icon-gap: 8px;

	--e404-pad: 60px 0 40px;
	--e404-code-size: 180px;
	--e404-text-size: 20px;
	--e404-text-width: 640px;
	--e404-gap: 24px;
	--e404-buttons-top: 16px;
	--e404-btn-width: 270px;
	--e404-btn-height: 48px;

	--home-news-span-first: 6;
	--home-news-span: 3;
	--home-news-gap-x: 30px;
	--home-news-gap-y: 30px;
	--home-news-height: 400px;
	--home-news-ratio: 287 / 235;
	--home-news-bar: 75px;
	--home-news-bar-pad: 25px;
	--home-news-name-size: 18px;

	--home-cats-width: 1060px;
	--home-cats-gap: 25px;
	--home-cats-row-gap: 22px;
	--home-cats-row: 262px;
	--home-cats-row-2: 368px;
	--home-cats-label-height: 75px;
	--home-cats-label-pad: 30px;
	--home-cats-label-size: 18px;
	--home-cats-more-top: 32px;
	--home-more-width: 270px;
	--home-more-height: 48px;
	--home-title-gap: 40px;
	--carousel-cols: 4;
	--carousel-btn-height: 48px;
	--carousel-arrow-size: 44px;
	--carousel-arrow-offset: 74px;
	--carousel-chevron: 18px;

	--product-title-size: 32px;
	--product-title-gap: 16px;
	--product-photo-width: 670px;
	--product-photo-ratio: 670 / 494;
	--product-thumb-width: 170px;
	--product-thumb-ratio: 170 / 108.5;
	--product-thumb-gap: 10px;
	--product-thumbs-gap: 26px;
	--product-thumbs-pad: 26px;
	--product-thumbs-max: 442px;
	--product-arrow-size: 31px;
	--product-block-gap: 24px;
	--product-price-size: 28px;
	--product-order-width: 262px;
	--product-order-height: 60px;
	--product-order-size: 20px;
	--product-benefit-box: 80px;
	--product-benefit-icon: 55px;
	--product-tabs-top: 44px;
	--product-tab-gap: 48px;
	--product-tab-content-gap: 40px;
	--product-tab-muted: #767d84;
	--product-heading-size: 20px;

	--order-btn-height: 50px;
	--order-btn-size: 16px;
	--order-dialog-width: 480px;
	--order-dialog-padding: 32px;
	--order-title-size: 24px;

	--cta-min-height: 250px;
	--cta-padding-top: 50px;
	--cta-padding-bottom: 50px;
	--cta-text-width: 570px;
	--cta-title-size: 32px;
	--cta-title-line: 39px;
	--cta-title-width: 470px;
	--cta-title-gap: 24px;
	--cta-text-size: 18px;
	--cta-text-line: 22px;
	--cta-btn-width: 213px;
	--cta-btn-height: 48px;
	--cta-btn-size: 15px;
	--cta-btn-gap: 30px;
	--cta-align: left;
	--cta-direction: row;

	--footer-bg: #000000;
	--footer-text: #ffffff;
	--footer-muted: rgba(255, 255, 255, .7);
	--footer-padding: 40px 15px;
	--footer-bottom-padding: 14px 15px 40px;
	--footer-brand-width: 260px;
	--footer-brand-gap: 60px;
	--footer-col-gap: 40px;
	--footer-logo-width: 210px;
	--footer-font-size: 18px;
	--footer-title-size: 18px;
	--footer-icon-size: 17px;
	--footer-copyright-size: 16px;
	--footer-developer-width: 143px;

	--social-size: 48px;
	--social-gap: 10px;
	--social-right: 70px;
}

@media (max-width: 1200px){
	:root{
		--hero-height: 540px;
		--hero-padding-top: 218px;
		--hero-title-size: 32px;
		--hero-title-line: 39px;
		--hero-title-weight: 700;
		--hero-title-width: 440px;
		--hero-link-bottom: 52px;
		--hero-link-size: 18px;
		--hero-link-arrow: 130px;
		--hero-nav-display: none;
		--hero-dot-size: 12px;
		--hero-dots-bottom: 16px;

		--section-gap: 45px;

		--cta-padding-top: 29px;
		--cta-padding-bottom: 37px;
		--cta-title-gap: 16px;

		--adv-gap: 40px;
		--adv-justify: space-evenly;
		--adv-item-width: calc(50% - 120px);
		--adv-item-max: 300px;

		--catalog-columns: 2;
		--catalog-card-ratio: 350 / 380;
		--catalog-card-title-gap: 20px;
		--catalog-card-btn-height: 52px;
		--catalog-page-top: 30px;
		--catalog-body-top: 20px;
		--catalog-body-gap: 24px;

		--service-card-btn-size: 18px;
		--service-image-ratio: 740 / 546;

		--home-services-cols: 2;
		--home-services-gap-x: 40px;
		--home-services-gap-y: 23px;
		--home-services-ratio: 350 / 408;
		--home-services-bar: 48px;

		--news-card-gap: 17px;
		--news-card-height: 169px;
		--news-image-width: 228px;
		--news-text-gap: 43px;
		--news-text-pad-top: 14px;
		--news-text-pad-bottom: 14px;
		--news-text-size: 16px;
		--news-line-gap: 13px;

		--about-intro-gap: 40px;
		--about-form-width: 350px;
		--about-photo-width: 100%;
		--about-photo-ratio: 568 / 297;
		--about-thumb-width: 125px;
		--about-thumb-ratio: 125 / 81;
		--about-thumbs-max: 259px;

		--cert-gap: 24px;
		--cert-portrait-ratio: 229 / 299;
		--cert-wide-ratio: 357 / 220;

		--gallery-gap: 24px;

		--faq-ask-top: 40px;

		--contacts-map-height: 310px;

		--e404-pad: 40px 0 30px;
		--e404-code-size: 150px;
		--e404-text-size: 18px;

		--home-news-span-first: 12;
		--home-news-span: 6;
		--home-news-gap-x: 40px;
		--home-news-gap-y: 32px;

		--home-cats-row: 240px;
		--carousel-cols: 3;
		--carousel-chevron: 12px;

		--product-thumb-width: 140px;
		--product-thumbs-gap: 20px;
		--product-order-width: 220px;
		--product-tab-gap: 32px;
	}
}

@media (max-width: 781px){
	:root{
		--gallery-cols: 2;
		--gallery-gap: 16px;

		--faq-q-size: 16px;
		--faq-a-size: 15px;
		--faq-sign-size: 26px;
		--faq-ask-width: 100%;

		--contacts-map-height: 236px;
		--contacts-map-bleed: 15px;
		--contacts-top: 24px;
		--contacts-gap: 16px;
		--contacts-form-width: 100%;
		--contacts-form-pad: 24px 30px 15px;
		--contacts-text-size: 15px;
		--contacts-block-gap: 20px;

		--m-gap: 16px;
		--header-topbar-padding: 12px var(--m-gap);
		--header-nav-padding: 12px var(--m-gap);
		--header-logo-width: 120px;
		--header-topbar-gap: 12px;
		--header-actions-gap: 14px;

		--hero-height: 250px;
		--hero-padding-top: 42px;
		--hero-title-size: 20px;
		--hero-title-line: 24px;
		--hero-title-width: 240px;
		--hero-link-bottom: 24px;
		--hero-link-size: 14px;
		--hero-link-arrow: 96px;
		--hero-dot-size: 7px;
		--hero-dot-gap: 12px;
		--hero-dots-bottom: 8px;

		--section-gap: 32px;

		--cta-padding-top: 25px;
		--cta-padding-bottom: 24px;
		--cta-title-size: 28px;
		--cta-title-line: 34px;
		--cta-title-width: none;
		--cta-text-width: none;
		--cta-text-size: 16px;
		--cta-text-line: 20px;
		--cta-btn-width: 290px;
		--cta-btn-size: 18px;
		--cta-btn-gap: 24px;
		--cta-align: center;
		--cta-direction: column;

		--adv-gap: 20px;
		--adv-justify: flex-start;
		--adv-item-width: calc(100vw - 30px);
		--adv-item-max: none;
		--adv-font-size: 16px;
		--adv-line-height: 20px;

		--catalog-gap-x: 20px;
		--catalog-gap-y: 32px;
		--catalog-card-btn-height: 45px;
		--catalog-page-top: 20px;
		--catalog-page-bottom: 32px;
		--catalog-title-size: 24px;
		--catalog-head-gap: 10px;
		--catalog-crumbs-size: 15px;
		--catalog-text-size: 16px;
		--catalog-sidebar-size: 15px;
		--catalog-pagination-top: 32px;

		--home-cats-row: 200px;
		--home-cats-row-gap: 16px;
		--home-cats-label-height: 56px;
		--home-cats-label-size: 15px;
		--home-cats-label-pad: 16px;
		--home-cats-more-top: 24px;
		--home-title-gap: 20px;
		--carousel-cols: 2;
		--carousel-btn-height: 45px;
		--carousel-arrow-size: 36px;

		--product-title-size: 20px;
		--product-photo-ratio: 320 / 236;
		--product-thumb-ratio: 66 / 41;
		--product-thumb-gap: 8px;
		--product-thumbs-gap: 16px;
		--product-price-size: 20px;
		--product-order-height: 45px;
		--product-order-size: 18px;
		--product-tab-content-gap: 24px;

		--about-block-gap: 24px;
		--about-title-size: 24px;
		--about-title-gap: 12px;
		--about-text-size: 16px;

		--order-dialog-padding: 24px 20px;
		--order-title-size: 20px;

		--footer-padding: 30px var(--m-gap) 26px;
		--footer-bottom-padding: 14px var(--m-gap) 20px;
		--footer-logo-width: 170px;
		--footer-font-size: 13px;
		--footer-title-size: 13px;
		--footer-icon-size: 13px;
		--footer-copyright-size: 11px;
		--footer-developer-width: 108px;

		--social-size: 44px;
	}
}

/* Каталог: 2 колонки на планшете (макет 768), одна — на телефоне (макет 320). Страница услуги: фото в край, «Заказать» во всю ширину. */
@media (max-width: 600px){
	:root{
		--home-more-width: 100%;
		--catalog-columns: 1;
		--catalog-card-ratio: 288 / 290;
		--service-image-ratio: 320 / 236;
		--home-services-cols: 1;
		--home-services-gap-y: 16px;
		--home-services-ratio: 288 / 336;
		--home-services-bar: 40px;
		--news-card-gap: 16px;
		--news-card-height: 0px;
		--news-image-ratio: 288 / 214;
		--news-text-gap: 12px;
		--news-text-pad-top: 20px;
		--news-text-pad-right: 12px;
		--news-text-pad-bottom: 20px;
		--news-text-size: 15px;
		--news-line-gap: 10px;
		--news-excerpt-lines: 5;
		--news-date-size: 15px;
		--sale-meta-gap-x: 10px;
		--sale-period-size: 13px;
		--sale-period-pad-x: 8px;
		--about-text-size: 15px;
		--about-details-size: 15px;
		--about-intro-gap: 24px;
		--about-form-width: 100%;
		--about-form-pad: 25px 34px;
		--about-photo-ratio: 288 / 200;
		--about-arrow-size: 24px;
		--cert-wide-ratio: 230 / 137;
		--gallery-cols: 1;
		--gallery-gap: 16px;
		--gallery-caption-size: 14px;
		--faq-q-pad: 12px 12px;
		--faq-a-pad: 12px;
		--faq-sign-size: 24px;
		--faq-sign-gap: 8px;
		--faq-ask-top: 32px;
		--faq-ask-pad: 25px 20px;
		--faq-ask-title-size: 20px;
		--e404-pad: 24px 0 8px;
		--e404-code-size: 96px;
		--e404-text-size: 16px;
		--e404-gap: 16px;
		--e404-buttons-top: 8px;
		--e404-btn-width: 100%;
		--e404-btn-height: 45px;
		--home-news-gap-x: 16px;
		--home-news-bar: 45px;
		--home-news-bar-pad: 17px;
		--home-news-name-size: 16px;
		--service-image-bleed: 15px;
		--service-order-width: 100%;
		--service-order-height: 45px;
		--service-order-size: 18px;
		--carousel-cols: 1;
	}
}

body{
	color: var(--color-text);
	background: var(--color-bg);
}

a{
	color: inherit;
}

.nav p,
figure{
	margin: 0;
}

.wp-site-blocks > main,
.wp-site-blocks > footer{
	margin-block-start: 0;
}

/* Отступ между секциями главной (как .block + .block в референсе) и перед футером. */
.wp-block-post-content.wp-block-post-content > * + *{
	margin-block-start: var(--section-gap);
}

.wp-block-post-content.wp-block-post-content > :last-child{
	margin-block-end: var(--section-gap);
}

/* Секции — в отдельных файлах (подключены в functions.php, на сайте и в редакторе):
   assets/css/header.css, assets/css/slider.css, assets/css/footer.css */