diff --git a/wp-content/themes/hantico/assets/css/style.css b/wp-content/themes/hantico/assets/css/style.css
index 5e12633..3906cea 100644
--- a/wp-content/themes/hantico/assets/css/style.css
+++ b/wp-content/themes/hantico/assets/css/style.css
@@ -32,6 +32,7 @@
--color-red: #ae001b;
--color-red-dark: #9a081e;
--gradient-grey: linear-gradient(180deg, #f5f5f9 0%, #f9f9f9 100%);
+ --color-white: #fff;
}
:root {
@@ -481,14 +482,28 @@ h4 {
}
.breadcrumbs__list {
display: flex;
- width: max-content;
+ width: 100%;
+ flex-wrap: nowrap;
}
.breadcrumbs__item {
display: flex;
+ flex-shrink: 0;
align-items: center;
font-size: 14px;
line-height: 1.2;
}
+.breadcrumbs__item:last-child {
+ flex: 0 1 auto;
+ min-width: 0;
+ overflow: hidden;
+}
+.breadcrumbs__item:last-child .breadcrumbs__link {
+ display: block;
+ min-width: 0;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+}
.breadcrumbs__item::after {
content: "";
display: block;
@@ -2267,164 +2282,129 @@ h4 {
.socials {
margin-top: var(--space-section);
padding-top: clamp(40px, 23.4254px + 4.4199vw, 80px);
- background: var(--gradient-grey);
}
.socials-title {
- text-align: center;
+ /* text-align: center; */
}
-.socials-body {
- display: grid;
- grid-template-columns: 1.15fr 1fr;
- column-gap: clamp(40px, -72.5px + 14.6484vw, 115px);
- margin-top: clamp(25px, 14.6409px + 2.7624vw, 50px);
+.socials-main{
+ margin-top: 50px;
}
-.socials-grid {
+.socials-grid{
display: grid;
- grid-template-columns: 1fr 1fr;
- gap: 6px;
- margin-top: clamp(25px, -75px + 9.7656vw, 50px);
+ grid-template-columns: repeat(4, 1fr);
+ gap: 20px;
}
-.socials-item {
- display: grid;
+.socials-item{
+ padding: 19px 29px;
+
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
align-items: center;
- grid-template-columns: auto 1fr;
- column-gap: 25px;
- padding: 15px 30px;
- border-radius: 15px;
- color: var(--main-color);
- background-color: #fff;
- transition: color 0.25s ease, background-color 0.25s ease;
+ gap: 20px;
+
+ border-radius: 30px;
+ border: 1px solid #EDEDED;
+
+ transition: all .2s ease-out;
}
-.socials-item:hover {
- color: #fff;
- background-color: var(--main-color);
+.socials-item--vk .socials-item__icon{
+ border: 1px solid rgba(220, 232, 242, 0.50);
+ background: #F5F8FE;
}
-.socials-item:hover .socials-item__icon::before, .socials-item:hover .socials-item__icon::after {
- background-color: #fff;
+.socials-item--telegram .socials-item__icon{
+ border: 1px solid rgba(220, 232, 242, 0.50);
+ background: #F3FAFF;
}
-.socials-item__icon {
+.socials-item--youtube .socials-item__icon{
+ border: 1px solid rgba(220, 232, 242, 0.50);
+ background: #FCF3F5;
+}
+.socials-item--instagram {}
+.socials-item--tiktok {}
+.socials-item--threads {}
+.socials-item--dzen {}
+.socials-item--rutube .socials-item__icon{
+ border: 1px solid rgba(220, 232, 242, 0.50);
+ background: rgba(255, 173, 190, 0.08);
+}
+.socials-item__icon{
+ width: 63px;
+ height: 63px;
+
display: flex;
- align-items: flex-start;
+ justify-content: center;
+ align-items: center;
+
+ border-radius: 20px;
+ border: 1px solid rgba(220, 232, 242, 0.50);
+ background: rgba(212, 206, 210, 0.08);
+
+ transition: all .2s ease-out;
}
-.socials-item__icon::before {
- content: "";
- display: block;
- width: 32px;
- height: 32px;
- background-color: var(--icon-color);
- mask: var(--social-icon) center no-repeat;
- -webkit-mask: var(--social-icon) center no-repeat;
- mask-size: contain;
- -webkit-mask-size: contain;
- transition: background-color 0.25s ease;
+.socials-item__name{
+ text-align: center;
+ font-size: 20px;
+ line-height: 110%; /* 22px */
+ letter-spacing: -0.2px;
+ color: var(--color-text);
+
+ transition: all .2s ease-out;
}
-.socials-item__name {
- font-size: 18px;
- line-height: 1.2;
+.socials-item:hover{
+ background: var(--color-dark);
+ border-color: var(--color-dark);
}
-.socials-item--vk {
- --main-color: #366cfe;
- --icon-color: currentColor;
- --social-icon: url(../img/icons/vk.svg);
+.socials-item:hover .socials-item__icon{
+ transform: translateY(-5px);
+ background: var(--color-light);
}
-.socials-item--instagram {
- --main-color: #000;
- --icon-color: currentColor;
- --social-icon: url(../img/icons/instagram.svg);
+.socials-item:hover .socials-item__name{
+ color: var(--color-light);
+
+ transform: scale(1.05);
}
-.socials-item--youtube {
- --main-color: #e80b2e;
- --icon-color: currentColor;
- --social-icon: url(../img/icons/youtube.svg);
-}
-.socials-item--threads {
- --main-color: #000;
- --icon-color: currentColor;
- --social-icon: url(../img/icons/threads.svg);
-}
-.socials-item--tiktok {
- --main-color: #000;
- --icon-color: currentColor;
- --social-icon: url(../img/icons/tiktok.svg);
-}
-.socials-item--telegram {
- --main-color: #3292dd;
- --icon-color: currentColor;
- --social-icon: url(../img/icons/telegram.svg);
-}
-.socials-item--dzen {
- --main-color: #000;
- --icon-color: #2c3036;
- --social-icon: url(../img/icons/dzen.svg);
-}
-.socials-item--rutube {
- --main-color: #0e0333;
- --icon-color: currentColor;
- --social-icon: url(../img/icons/rutube.svg);
-}
-.socials-item--rutube .socials-item__icon::after {
- content: "";
- display: block;
- width: 8px;
- aspect-ratio: 1;
- border-radius: 50%;
- background-color: #ed143b;
- transition: background-color 0.25s ease;
-}
-.socials-footnote {
- margin-block: clamp(30px, -90px + 11.7188vw, 60px);
+.socials-footnote{
+ margin-top: 50px;
+
font-size: 11px;
- line-height: 1.2;
-}
-.socials-img {
- display: flex;
- align-items: flex-end;
-}
-.socials-img img {
- width: 100%;
+ line-height: 110%; /* 12.1px */
+ letter-spacing: -0.11px;
+ color: var(--color-text);
}
@media (max-width: 1023.98px) {
- .socials-grid {
- margin-top: 0;
- }
- .socials-item {
- column-gap: 15px;
- padding: 10px 15px;
- border-radius: 10px;
+ .socials-grid{
+ grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width: 767.98px) {
- .socials-body {
- grid-template-columns: 1fr;
+ .socials-grid{
+ grid-template-columns: repeat(2, 1fr);
}
- .socials-footnote {
- margin-bottom: 0;
+ .socials-item{
+ padding: 13.5px 10px 15.5;
+
+ border-radius: 10px;
+
+ gap: 14px;
}
- .socials-img {
- width: clamp(345px, 101.6794px + 64.8855vw, 600px);
- margin: 40px auto 0;
+ .socials-item__icon{
+ width: 50px;
+ height: 50px;
+
+ border-radius: 14px;
}
-}
-@media (max-width: 575.98px) {
- .socials-item {
- column-gap: 10px;
+ .socials-item__name{
+ font-size: 15px;
+ letter-spacing: -0.15px;
}
- .socials-item__icon::before {
- width: 28px;
- height: 28px;
- }
- .socials-item__name {
- font-size: 16px;
- }
- .socials-item--rutube .socials-item__icon::after {
- width: 6px;
- }
- .socials-footnote {
- margin-top: 20px;
- }
- .socials-img {
+ .socials-footnote{
margin-top: 30px;
+
+ font-size: 11px;
+ line-height: 120%; /* 13.2px */
+ letter-spacing: -0.11px;
}
}
.reviews--block {
@@ -2906,6 +2886,11 @@ h4 {
.articles--page {
margin-top: clamp(40px, 15.1381px + 6.6298vw, 100px);
}
+.articles--slider{
+ width: 100%;
+
+ overflow: hidden;
+}
.articles-title--sm {
margin-bottom: 40px;
font-size: var(--fs-h3-lg);
@@ -2914,6 +2899,9 @@ h4 {
margin-bottom: 45px;
text-align: center;
}
+.articles-title--lg span{
+ color: var(--color-red);
+}
.articles-filter {
margin-bottom: 30px;
overflow-x: auto;
@@ -2955,6 +2943,9 @@ h4 {
grid-template-columns: repeat(3, 1fr);
column-gap: 20px;
}
+.related-slider__container.swiper {
+ overflow: visible;
+}
.articles-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
@@ -3190,6 +3181,30 @@ h4 {
.getapp-title {
color: #fff;
}
+
+.getapp--custom-title .getapp-body__left {
+ min-width: 0;
+}
+.getapp--custom-title .getapp-title {
+ font-size: clamp(24px, 11.5691px + 3.3149vw, 54px);
+ font-weight: 700;
+ line-height: 1.1;
+ letter-spacing: -0.01em;
+ overflow-wrap: anywhere;
+}
+.getapp-title__ending {
+ display: block;
+}
+@media (min-width: 1280px) {
+ .getapp--custom-title .getapp-title {
+ width: 731px;
+ max-width: none;
+ }
+ .getapp--custom-title .getapp-stores {
+ margin-top: 55px;
+ }
+}
+
.getapp-descr {
margin-top: 25px;
font-size: 18px;
@@ -4070,7 +4085,7 @@ h4 {
.article-goback__btn::before {
margin-right: 10px;
border-color: #f0f0f0;
- background-color: #fff;
+ background-color: var(--color-white);
transition: background-color 0.25s ease;
}
.article-goback__btn::after {
@@ -4138,11 +4153,16 @@ h4 {
.article-main {
min-width: 0;
}
+.article-main .article-content:not(:first-child){
+ margin-top: clamp(30px, 17.5691px + 3.3149vw, 60px);
+}
.article-sidebar {
position: sticky;
top: 112px;
}
.article-toc {
+ height: 46vh;
+
padding: 25px 30px;
background-color: var(--color-light);
border-radius: var(--radius-sm);
@@ -4165,8 +4185,8 @@ h4 {
width: 0;
}
.article-toc__list.is-scrollable {
- padding-right: 10px;
scrollbar-width: auto;
+ height: 83%;
}
@-moz-document url-prefix() {
.article-toc__list.is-scrollable {
@@ -5943,4 +5963,2825 @@ h4 {
.specs-tabs__item:hover {
color: var(--color-red);
}
-}
\ No newline at end of file
+}
+
+/* новые */
+
+
+.h-article-hero {
+ --h-hero-accent: var(--color-red);
+ --h-hero-text: var(--color-dark);
+ --h-hero-muted: var(--color-grey-dark);
+ --h-hero-line: var(--color-grey);
+ --h-hero-bg: var(--color-light);
+ --h-hero-radius: 26px;
+ box-sizing: border-box;
+ width: 100%;
+ min-width: 1100px;
+ color: var(--h-hero-text);
+ font-family: inherit;
+}
+
+.h-article-hero *,
+.h-article-hero *::before,
+.h-article-hero *::after {
+ box-sizing: border-box;
+}
+
+.h-article-hero__container {
+ display: grid;
+ grid-template-columns: minmax(400px, 500px) minmax(0, 1fr);
+ align-items: stretch;
+ gap: 64px;
+ width: calc(100% - 80px);
+ max-width: 1360px;
+}
+
+.h-article-hero__picture {
+ min-height: 600px;
+ overflow: hidden;
+ border-radius: var(--h-hero-radius);
+ background: var(--color-grey);
+}
+
+.h-article-hero__image {
+ display: block;
+ width: 100%;
+ height: 100%;
+ min-height: 600px;
+ object-fit: cover;
+ object-position: center;
+}
+
+.h-article-hero__content {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ min-width: 0;
+ padding: 5px 0 4px;
+}
+
+.h-article-hero .breadcrumbs {
+ width: 100%;
+ min-width: 0;
+ margin: 0 0 24px;
+}
+
+.h-article-hero .breadcrumbs > .container {
+ width: 100%;
+ max-width: none;
+ padding: 0;
+}
+
+.h-article-hero .breadcrumbs__inner {
+ margin: 0;
+ padding: 0;
+}
+
+.h-article-hero__breadcrumb-divider {
+ flex: none;
+ color: var(--color-grey-light);
+}
+
+.h-article-hero__breadcrumb-current {
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: var(--h-hero-text);
+}
+
+.h-article-hero__categories {
+ display: flex;
+ gap: 8px;
+ margin-bottom: 19px;
+}
+
+.h-article-hero__category {
+ display: inline-flex;
+ align-items: center;
+ min-height: 29px;
+ padding: 5px 12px;
+ border: 1px solid color-mix(in srgb, var(--color-red) 17%, transparent);
+ border-radius: 100px;
+ background: color-mix(in srgb, var(--color-red) 8%, var(--color-light));
+ color: var(--h-hero-accent);
+ font-size: 12px;
+ font-weight: 600;
+ line-height: 1.3;
+}
+
+.h-article-hero__title {
+ width: 100%;
+ margin: 0;
+ color: var(--h-hero-text);
+ font-size: 44px;
+ font-weight: 700;
+ line-height: 1.12;
+ letter-spacing: -.035em;
+ text-wrap: balance;
+}
+
+.h-article-hero__title > span {
+ background: linear-gradient(
+ 98deg,
+ var(--color-red) 0%,
+ var(--color-red-dark) 100%
+ );
+ background-clip: text;
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent;
+}
+
+.h-article-hero__description {
+ max-width: 710px;
+ margin: 24px 0 34px;
+ color: var(--color-text);
+ font-size: 17px;
+ font-weight: 400;
+ line-height: 1.6;
+}
+
+.h-article-hero__meta {
+ display: flex;
+ align-items: center;
+ flex-wrap: nowrap;
+ width: 100%;
+ margin-top: auto;
+ padding-top: 25px;
+ border-top: 1px solid var(--h-hero-line);
+ color: var(--color-text);
+}
+
+.h-article-hero__meta-item {
+ display: inline-flex;
+ align-items: center;
+ gap: 10px;
+ flex: none;
+ min-height: 31px;
+ padding: 0 20px;
+ font-size: 14px;
+ line-height: 1.35;
+ white-space: nowrap;
+}
+
+.h-article-hero__meta-item:first-child {
+ padding-left: 0;
+}
+
+.h-article-hero__meta-item + .h-article-hero__meta-item {
+ border-left: 1px solid var(--color-grey);
+}
+
+.h-article-hero__meta-item svg {
+ display: block;
+ flex: none;
+ width: 22px;
+ height: 22px;
+ color: var(--h-hero-accent);
+}
+
+.h-article-hero__meta-item strong {
+ color: var(--h-hero-text);
+ font-weight: 600;
+}
+
+@media (max-width: 1279.98px) {
+ .h-article-hero{
+ min-width: 100%;
+ }
+
+ .h-article-hero__container{
+ width: 100%;
+
+ display: flex;
+ flex-direction: column;
+ gap: 20px;
+ }
+ .h-article-hero__image,
+ .h-article-hero__picture{
+ min-width: auto;
+ min-height: auto;
+
+ width: 100%;
+ }
+}
+
+@media (max-width: 550px) {
+ .h-article-hero__meta{
+ flex-direction: column;
+ align-items: start;
+ }
+ .h-article-hero__meta-item {
+ width: 300px;
+ }
+
+ .h-article-hero__meta-item:first-child {
+ padding-left: 20px;;
+ }
+
+ .h-article-hero__meta-item + .h-article-hero__meta-item {
+ border-left: none;
+ }
+
+ .h-article-hero__title{
+ font-size: 28px;
+ }
+ .h-article-hero__description{
+ font-size: 16px;
+ }
+}
+
+.h-attention {
+ margin: 24px 0;
+
+ padding: 32px 40px 32px 32px;
+
+ display: flex;
+ gap: 20px;
+
+ background: var(--attention-bg);
+
+ border-radius: 20px;
+}
+
+.h-attention--warning {
+ --attention-bg: rgba(226, 10, 23, 0.10);
+ --attention-icon-bg: rgba(226, 10, 23, 0.10);
+}
+
+.h-attention--info {
+ --attention-color: #a8740b;
+ --attention-bg: #fff8e8;
+ --attention-icon-bg: #f9ebc8;
+}
+
+.h-attention--success {
+ --attention-color: #277547;
+ --attention-bg: #eff8f2;
+ --attention-icon-bg: #dceee2;
+}
+
+.h-attention__icon {
+ flex-shrink: 0;
+
+ width: 40px;
+ height: 40px;
+
+ border-radius: 50%;
+
+ background: var(--attention-icon-bg);
+
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.h-attention__content {
+ font-size: 20px;
+ line-height: 150%; /* 30px */
+ letter-spacing: -0.2px;
+ color: var(--color-text);
+}
+
+@media (max-width: 767.98px) {
+ .h-attention{
+ padding: 16px 16px 16px 12px;
+
+ gap: 12px;
+ }
+
+ .h-attention__content{
+ font-size: 14px;
+ letter-spacing: -0.14px;
+ }
+}
+
+.h-article-quote {
+ overflow: hidden;
+ position: relative;
+
+ margin: 60px 0;
+
+ min-height: 216px;
+ padding: 40px 40px 40px 240px;
+
+ border-radius: 40px;
+ background: linear-gradient(148deg, #29292D 19.01%, #083743 100.4%)
+}
+.h-article-quote::before{
+ content: '';
+
+ position: absolute;
+ top: -36px;
+ right: 40px;
+
+ width: 174px;
+ height: 128px;
+
+ background-image: url(../img/bg/arrow-q.svg);
+ background-repeat: no-repeat;
+ background-position: bottom;
+}
+
+.h-article-quote__avatar {
+ position: absolute;
+ top: -17px;
+ left: -38px;
+
+ max-width: 250px;
+ max-height: 250px;
+
+ width: 250px;
+ height: 250px;
+ aspect-ratio: 1;
+
+ border-radius: 50%;
+
+ object-fit: cover;
+}
+
+.h-article-quote__body {
+
+}
+
+.h-article-quote__author {
+ font-size: 26px;
+ font-weight: 600;
+ line-height: 110%; /* 28.6px */
+ letter-spacing: -0.26px;
+ color: var(--color-white);
+}
+
+.h-article-quote__job{
+ margin-top: 8px;
+
+ font-size: 14px;
+ font-weight: 500;
+ line-height: 110%; /* 15.4px */
+ letter-spacing: -0.14px;
+ color: var(--color-white);
+}
+
+.h-article-quote__text {
+ margin-top: 24px;
+
+ font-size: 20px;
+ line-height: 150%; /* 30px */
+ letter-spacing: -0.2px;
+ color: var(--color-white);
+}
+
+@media (max-width: 767.98px) {
+ .h-article-quote{
+ min-height: auto;
+
+ padding: 180px 24px 20px 24px;
+ }
+ .h-article-quote::before{
+ top: 52px;
+ right: -22px;
+ }
+ .h-article-quote__avatar{
+ top: -25px;
+ left: -20px;
+
+ width: 189px;
+ height: 189px;
+ }
+ .h-article-quote__author {
+ font-size: 16px;
+ letter-spacing: -0.16px;
+ }
+
+ .h-article-quote__job{
+ margin-top: 6px;
+
+ font-size: 13px;
+ letter-spacing: -0.13px;
+ }
+
+ .h-article-quote__text {
+ margin-top: 16px;
+
+ font-size: 14px;
+ letter-spacing: -0.14px;
+ }
+}
+
+.h-article-cards {
+ display: grid;
+ grid-template-columns: repeat(2, 1fr);
+ gap: 20px;
+ margin: 60px 0;
+}
+
+.h-article-cards__item {
+ padding: 31px;
+
+ border-radius: 20px;
+ border: 1px solid #EDEDED;
+ background: rgba(255, 255, 255, 0.10);
+}
+.h-article-cards__item:last-child:nth-child(odd) {
+ grid-column: 1 / -1;
+}
+
+.h-article-cards__item p {
+ margin: 0;
+ padding: 0;
+ font-size: 20px;
+ line-height: 150%; /* 30px */
+ letter-spacing: -0.2px;
+ color: var(--color-text);
+}
+
+@media (max-width: 767.98px) {
+ .h-article-cards{
+ margin: 30px 0;
+
+ grid-template-columns: 1fr;
+ }
+
+ .h-article-cards__item{
+ padding: 15px;
+
+ border-radius: 10px;
+ }
+
+ .h-article-cards__item p {
+ font-size: 14px;
+ letter-spacing: -0.14px;
+ }
+}
+
+.h-article-cta {
+ overflow: hidden;
+ position: relative;
+
+ margin: 60px 0;
+
+ padding: 40px 64px 40px 40px;
+
+ border-radius: 40px;
+
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ flex-wrap: wrap;
+ gap: 10px;
+}
+.h-article-cta::after{
+ content: '';
+
+ z-index: -10;
+ position: absolute;
+ top: 0;
+ left: 0;
+
+ width: 100%;
+ height: 100%;
+
+ background: linear-gradient(135deg, #DF2935 0%, #C80E1B 56.25%, #B00012 102.27%);
+}
+.h-article-cta__vec{
+ z-index: -4;
+ position: absolute;
+ top: -6px;
+ left: 90px;
+
+ width: 121.215px;
+ height: 318.519px;
+
+ opacity: 0.1;
+ filter: blur(10px);
+}
+.h-article-cta__c{
+ z-index: -5;
+ position: absolute;
+ top: 0;
+ right: 190px;
+
+ opacity: 0.1;
+ filter: blur(10px);
+}
+.h-article-cta__content{
+ max-width: 300px;
+
+ display: flex;
+ flex-direction: column;
+ gap: 24px;
+}
+.h-article-cta__title{
+ font-size: 30px;
+ font-weight: 600;
+ line-height: 110%; /* 33px */
+ letter-spacing: -0.3px;
+ color: var(--color-white);
+}
+.h-article-cta__description{
+ font-size: 20px;
+ line-height: 150%; /* 30px */
+ letter-spacing: -0.2px;
+ color: var(--color-white);
+}
+
+.h-article-cta__img{
+ flex-shrink: 0;
+
+ margin-bottom: -142px;
+
+ width: 113px;
+ height: 240px;
+
+ object-fit: cover;
+ object-position: top;
+}
+.h-article-cta__link{
+ padding: 20px 24px;
+
+ border-radius: 60px;
+ background: var(--color-white);
+
+ font-size: 18px;
+ font-weight: 500;
+ line-height: 120%;
+ color: var(--color-dark);
+
+ transition: all .2s ease-out;
+}
+.h-article-cta__link:hover{
+ background: var(--color-dark);
+ color: var(--color-white);
+}
+
+@media (min-width: 1024px) and (max-width: 1204px) {
+ .h-article-cta__img{
+ width: 40%;
+ }
+}
+
+@media (max-width: 767.98px) {
+ .h-article-cta{
+ margin: 30px 0;
+
+ padding: 24px 26px 32px 24px;
+
+ border-radius: 20px;
+
+ gap: 24px;
+ }
+ .h-article-cta__content{
+ gap: 12px;
+ }
+ .h-article-cta__title{
+ font-size: 18px;
+ font-weight: 600;
+ line-height: 110%; /* 19.8px */
+ letter-spacing: -0.18px;
+ }
+ .h-article-cta__description{
+ font-size: 14px;
+ line-height: 150%; /* 21px */
+ letter-spacing: -0.14px;
+ }
+ .h-article-cta__c{
+ display: none;
+ }
+ .h-article-cta__vec{
+ left: auto;
+ right: 0;
+ }
+ .h-article-cta__img{
+ position: absolute;
+ right: 12px;
+ bottom: -40px;
+
+ margin-bottom: 0;
+
+ width: 30vw;
+ height: 146px;
+ }
+ .h-article-cta__link{
+ padding: 14px 18px;
+
+ font-size: 13px;
+ }
+}
+
+.h-article-app-cta{
+ overflow: hidden;
+ position: relative;
+
+ padding: 40px 64px 40px 40px;
+
+ border-radius: 40px;
+
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+}
+.h-article-app-cta::before{
+ content: '';
+
+ z-index: -10;
+ position: absolute;
+ top: 0;
+ left: 0;
+
+ width: 100%;
+ height: 100%;
+
+ background: linear-gradient(180deg, #F5F5F9 0%, #F9F9F9 100%);
+}
+.h-article-app-cta__content{
+ display: flex;
+ flex-direction: column;
+ gap: 24px;
+}
+.h-article-app-cta__title{
+ font-size: 30px;
+ font-weight: 600;
+ line-height: 110%; /* 33px */
+ letter-spacing: -0.3px;
+ color: var(--color-dark);
+}
+.h-article-app-cta__text{
+ max-width: 349px;
+
+ font-size: 20px;
+ line-height: 150%; /* 30px */
+ letter-spacing: -0.2px;
+ color: var(--color-text);
+}
+.h-article-app-cta__img{
+ z-index: -5;
+ position: absolute;
+ right: 0;
+ bottom: 0;
+}
+.h-article-app-cta__link{
+ padding: 18px 22px;
+
+ border-radius: 60px;
+ background: var(--color-red);
+ box-shadow: 20px 24px 44px 0 rgba(217, 217, 217, 0.25);
+
+ text-align: center;
+ font-size: 18px;
+ font-weight: 500;
+ line-height: 120%;
+ color: var(--color-white);
+
+ border: 2px solid var(--color-red);
+
+ transition: all .2s ease-out;
+}
+.h-article-app-cta__link:hover{
+ background: var(--color-white);
+ color: var(--color-red);
+}
+
+@media (max-width: 767.98px) {
+ .h-article-app-cta{
+ padding: 24px 26px 40px 24px;
+ }
+ .h-article-app-cta__content{
+ gap: 12px;
+ }
+ .h-article-app-cta__title{
+ font-size: 18px;
+ line-height: 110%; /* 19.8px */
+ letter-spacing: -0.18px;
+ }
+ .h-article-app-cta__text{
+ max-width: 100%;
+
+ font-size: 14px;
+ line-height: 150%; /* 21px */
+ letter-spacing: -0.14px;
+ }
+ .h-article-app-cta__img{
+ z-index: -5;
+ position: absolute;
+ left: 0;
+ right: auto;
+ bottom: 0;
+
+ -webkit-mask-image: linear-gradient(
+ to right,
+ #000 60%,
+ transparent 100%
+ );
+ mask-image: linear-gradient(
+ to right,
+ #000 60%,
+ transparent 100%
+ );
+ }
+ .h-article-app-cta__link{
+ padding: 14px 18px;
+
+ border-radius: 60px;
+
+ font-size: 13px;
+ }
+}
+@media (max-width: 670.98px) {
+ .h-article-app-cta{
+ flex-direction: column;
+ align-items: start;
+ gap: 24px;
+ }
+}
+
+.h-article-author {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ flex-wrap: wrap;
+ gap: 5px;
+ width: 100%;
+ box-sizing: border-box;
+ margin: 30px 0;
+ padding: 20px 24px;
+ border: 1px solid var(--color-grey);
+ border-radius: 14px;
+ background: var(--color-light);
+ font-family: inherit;
+}
+
+.h-article-author__text {
+ font-size: 15px;
+ line-height: 1.5;
+ color: var(--color-grey-dark);
+}
+
+.h-article-author__link {
+ font-size: 15px;
+ font-weight: 600;
+ line-height: 1.5;
+ color: var(--color-red);
+ text-decoration: none;
+ transition: color .2s ease;
+}
+
+.h-article-author__link:hover {
+ color: var(--color-red-dark);
+ text-decoration: underline;
+}
+
+.h-app-steps {
+ display: grid;
+ grid-template-columns: 39.29% 60.71%;
+ grid-template-rows: repeat(3, 1fr);
+ grid-template-areas: 'one two'
+ 'one three'
+ 'one four';
+ gap: 20px;
+}
+.h-app-steps__item{
+ position: relative;
+
+ padding: 40px;
+
+ border-radius: 40px;
+ background: linear-gradient(180deg, #F5F5F9 0%, #F9F9F9 100%);
+}
+.h-app-steps__item:nth-child(1){
+ grid-area: one;
+
+ display: flex;
+ flex-direction: column;
+ gap: 24px;
+}
+.h-app-steps__item:nth-child(2){
+ grid-area: two;
+}
+.h-app-steps__item:nth-child(3){
+ grid-area: three;
+}
+.h-app-steps__item:nth-child(4){
+ grid-area: four;
+}
+.h-app-steps__item:not(:first-child){
+ display: flex;
+ justify-content: space-between;
+}
+.h-app-steps__nomber{
+ width: 51px;
+ height: 51px;
+
+ display: flex;
+ justify-content: center;
+ align-items: center;
+
+ border-radius: 100px;
+ background: linear-gradient(0deg, #AE001B 0%, #AE001B 100%), linear-gradient(232deg, #771719 18.85%, #A53634 72.03%);
+
+ font-size: 18px;
+ font-weight: 700;
+ line-height: 140%; /* 25.2px */
+ letter-spacing: -0.18px;
+ color: var(--color-white);
+}
+.h-app-steps__main{
+ display: flex;
+ gap: 24px;
+}
+.h-app-steps__content{
+ display: flex;
+ flex-direction: column;
+ gap: 16px;
+}
+.h-app-steps__title{
+ font-size: 26px;
+ font-weight: 600;
+ line-height: 110%; /* 28.6px */
+ letter-spacing: -0.26px;
+ color: var(--color-dark);
+}
+.h-app-steps__title span{
+ color: var(--color-red);
+}
+.h-app-steps__text{
+ font-size: 18px;
+ line-height: 150%;
+ color: var(--color-text);
+}
+.h-app-steps__qr{
+ display: flex;
+ align-items: center;
+ gap: 24px;
+}
+.h-app-steps__qr-img{
+ width: 146px;
+ height: 146px;
+}
+.h-app-steps__qr-text{
+ font-size: 18px;
+ font-weight: 500;
+ line-height: 150%;
+ color: var(--color-text);
+}
+.h-app-steps__phone{
+ position: absolute;
+ bottom: 0;
+ left: 0;
+
+ width: 100%;
+ height: 242px;
+}
+.h-app-steps__item-img{
+ position: absolute;
+
+ right: 33px;
+ top: calc(50% - 77px);
+
+ width: 218.5px;
+ height: 154px;
+
+ object-fit: contain;
+ object-position: center;
+}
+.h-app-steps__item:nth-child(2) .h-app-steps__item-img{
+ right: 54px;
+
+ width: 177px;
+}
+.h-app-steps__item:nth-child(3) .h-app-steps__item-img{
+ right: 26px;
+
+ width: 251px;
+}
+.h-app-steps__social{
+ display: none;
+}
+
+@media (max-width: 1279.98px) {
+ .h-app-steps {
+ display: grid;
+ grid-template-columns: 100%;
+ grid-template-rows: repeat(4, auto);
+ grid-template-areas: 'one'
+ 'two'
+ 'three'
+ 'four';
+}
+
+ .h-app-steps__item:nth-child(1){
+ padding-bottom: 266px;
+ }
+ .h-app-steps__phone{
+ object-fit: contain;
+ }
+
+ .h-app-steps__item-img{
+ display: none;
+ }
+}
+
+@media (max-width: 767.98px) {
+ .h-app-steps__item{
+ overflow: hidden;
+
+ padding: 24px;
+
+ border-radius: 40px;
+ }
+ .h-app-steps__item:not(:first-child){
+ border-radius: 20px;
+ }
+ .h-app-steps__item:not(:first-child) .h-app-steps__content{
+ gap: 8px;
+ }
+ .h-app-steps__nomber{
+ width: 32px;
+ height: 32px;
+
+ font-size: 12px;
+ line-height: 140%; /* 16.8px */
+ letter-spacing: -0.12px;
+ }
+ .h-app-steps__content{
+ gap: 14px;
+ }
+ .h-app-steps__title{
+ font-size: 16px;
+ line-height: 110%; /* 17.6px */
+ letter-spacing: -0.16px;
+ }
+ .h-app-steps__text{
+ font-size: 13px;
+ line-height: 150%;
+ }
+ .h-app-steps__qr{
+ display: none;
+ }
+ .h-app-steps__social{
+ display: flex;
+ flex-wrap: wrap;
+ gap: 12px;
+ }
+ .h-app-steps__social a{
+ width: calc(50% - 6px);
+ height: 44px;
+
+ display: flex;
+ justify-content: center;
+ align-items: center;
+
+ border-radius: 10px;
+ border: 1px solid rgba(174, 0, 27, 0.50);
+
+ transition: all .2s ease-out;
+ }
+ .h-app-steps__social a span{
+ transition: all .2s ease-out;
+ }
+
+ .h-app-steps__social a:hover{
+ background: var(--color-red);
+ border-color: var(--color-red);
+ }
+ .h-app-steps__social a:hover span{
+ filter: grayscale(100%) brightness(1.5);
+ }
+ .h-app-steps__phone{
+ object-fit: cover;
+ }
+ .h-app-steps__main{
+ gap: 12px;
+ }
+}
+
+.article-social{
+ margin-top: 24px;
+
+ padding: 23px;
+
+ border-radius: 30px;
+ border: 1px solid #EDEDED;
+
+ display: flex;
+ flex-direction: column;
+ gap: 24px;
+}
+.article-social__title{
+ font-size: 26px;
+ font-weight: 700;
+ line-height: 110%; /* 28.6px */
+ letter-spacing: -0.26px;
+ color: var(--color-dark);
+}
+.article-social__title span{
+ color: var(--color-red);
+}
+.article-social__text{
+ font-size: 18px;
+ line-height: 150%; /* 27px */
+ letter-spacing: -0.18px;
+ color: var(--color-text);
+}
+.article-social__list{
+ padding: 6px;
+
+ border-radius: 12px;
+ background: linear-gradient(180deg, #F5F5F9 0%, #F9F9F9 100%), #F0F0F0;
+
+ display: flex;
+ align-items: center;
+ gap: 8px;
+}
+.article-social__list span{
+ width: 100%;
+
+ font-size: 16px;
+ font-weight: 500;
+ line-height: 150%; /* 24px */
+ letter-spacing: -0.16px;
+ color: var(--color-text);
+}
+.article-social__list a {
+ flex-shrink: 0;
+
+ width: 40px;
+ height: 40px;
+
+ transition: all .2s ease-out;
+}
+.article-social__list a:hover{
+ opacity: .8;
+}
+
+@media (max-width: 767.98px) {
+ .article-social{
+ border-radius: 20px;
+
+ gap: 12px;
+ }
+
+ .article-social__title{
+ font-size: 16px;
+ line-height: 110%; /* 17.6px */
+ letter-spacing: -0.16px;
+ }
+ .article-social__text{
+ font-size: 13px;
+ line-height: 150%; /* 19.5px */
+ letter-spacing: -0.13px;
+ }
+ .article-social__list span{
+ font-size: 13px;
+ line-height: 150%; /* 19.5px */
+ letter-spacing: -0.13px;
+ }
+}
+
+.blog-links{
+ margin-top: 20px;
+
+ display: flex;
+ justify-content: space-between;
+}
+.blog-links .btn--transp-red.active{
+ background: var(--color-red);
+ color: var(--color-light);
+}
+
+@media (max-width: 767.98px) {
+ .blog-links{
+ flex-direction: column;
+ gap: 12px;
+ }
+}
+
+.blog-header__action{
+ margin-top: 20px;
+
+ display: flex;
+}
+.blog-header__action .header-buttons__download-btn{
+ height: 62px;
+ min-width: 200px;
+}
+
+@media (max-width: 767.98px) {
+ .blog-header__action .header-buttons__download-btn{
+ height: 44px;
+ min-width: 140px;
+ }
+}
+/* Article intro adapted from the supplied layout. */
+.article-intro,
+.article-intro * {
+ box-sizing: border-box;
+}
+
+.article-intro {
+ --article-background: #f6f6f6;
+ --article-heading: #1b2d34;
+ --article-text: #5e5e5e;
+ --article-muted: #9e9e9e;
+ --article-icon: #d9dadd;
+ margin-top: 130px;
+ position: relative;
+ width: 100%;
+ padding: 16px 40px 24px;
+ border-radius: 40px;
+ background: var(--article-background);
+ color: var(--article-text);
+ font-size: 16px;
+ font-weight: 400;
+ line-height: 24px;
+}
+
+.article-intro__topline,
+.article-intro__author,
+.article-intro__stats,
+.article-intro__stat,
+.article-intro__meta,
+.article-intro__meta > span {
+ display: flex;
+ align-items: center;
+}
+
+.article-intro__topline {
+ justify-content: space-between;
+ margin-bottom: 16px;
+}
+
+.article-intro__author,
+.article-intro__stat,
+.article-intro__meta > span {
+ gap: 8px;
+}
+
+.article-intro__icon {
+ display: block;
+ flex: 0 0 20px;
+ color: var(--article-icon);
+}
+
+.article-intro__stats {
+ gap: 28px;
+}
+
+.article-intro__hero {
+ display: grid;
+ grid-template-columns: minmax(0, 524fr) minmax(0, 656fr);
+ column-gap: 20px;
+ align-items: start;
+}
+
+.article-intro__image {
+ display: block;
+ width: 100%;
+ height: 100%;
+ aspect-ratio: 131 / 85;
+ border-radius: 20px;
+ object-fit: cover;
+ object-position: center;
+}
+
+.article-intro__heading {
+ min-width: 0;
+ padding-top: 8px;
+}
+
+.article-intro .breadcrumbs {
+ margin-bottom: 12px;
+ font-size: 12px;
+ line-height: 16px;
+}
+
+.article-intro .breadcrumbs__list {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ margin: 0;
+ padding: 0;
+ list-style: none;
+ flex-wrap: wrap;
+}
+
+.article-intro .breadcrumbs__item {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ color: var(--article-muted);
+}
+
+.article-intro .breadcrumbs__item + .breadcrumbs__item::before {
+ width: 5px;
+ height: 5px;
+ border-top: 1px solid #c9c9c9;
+ border-right: 1px solid #c9c9c9;
+ content: "";
+ transform: rotate(45deg);
+}
+
+.article-intro .breadcrumbs__item.is-active {
+ color: var(--article-text);
+}
+
+.article-intro__tags {
+ display: flex;
+ gap: 8px;
+ margin: 0 0 16px;
+ padding: 0;
+ list-style: none;
+}
+
+.article-intro__tags li {
+ padding: 4px 10px;
+ border-radius: 8px;
+ background: var(--color-white);
+ color: #888;
+ font-size: 14px;
+ line-height: 20px;
+}
+
+.article-intro__title {
+ margin: 0;
+ color: var(--article-heading);
+ font-size: clamp(36px, 4.1vw, 56px);
+ font-weight: 700;
+ line-height: 1.107142857;
+ letter-spacing: -0.02em;
+}
+
+.article-intro__meta {
+ flex-wrap: wrap;
+ gap: 12px 32px;
+ margin-top: 40px;
+ white-space: nowrap;
+}
+
+.article-intro__summary {
+ margin-top: 24px;
+}
+
+.article-intro__summary h2 {
+ margin: 0 0 16px;
+ color: var(--article-heading);
+ font-size: 20px;
+ font-weight: 600;
+ line-height: 28px;
+}
+
+.article-intro__summary p {
+ margin: 0;
+ font-size: 20px;
+ line-height: 30px;
+}
+
+.article-intro__credit {
+ margin-top: 16px;
+ text-align: right;
+}
+
+.article-intro__credit a {
+ color: inherit;
+ text-decoration-line: underline;
+ text-decoration-style: dotted;
+ text-underline-offset: 3px;
+}
+
+.article-intro__credit a:hover {
+ color: var(--article-heading);
+}
+
+.article-intro__credit a:focus-visible {
+ border-radius: 2px;
+ outline: 2px solid var(--article-heading);
+ outline-offset: 4px;
+}
+
+.article-intro__breadcrumb{
+ display: none;
+}
+
+@media (max-width: 1199px) {
+ .article-intro__tags{
+ gap: 6px;
+ }
+ .article-intro__tags li{
+ background: none;
+ }
+
+ .article-intro__breadcrumb{
+ display: block;
+ }
+ .article-intro__heading .breadcrumbs{
+ display: none;
+ }
+ .article-intro {
+ margin-top: 20px;
+
+ padding-right: 32px;
+ padding-left: 32px;
+ }
+
+ .article-intro__meta {
+ gap: 12px 24px;
+ margin-top: 24px;
+ font-size: 14px;
+ }
+}
+
+/* На планшете заголовок и метаданные располагаются над фотографией. */
+@media (max-width: 1023px) {
+
+ .article-intro {
+ padding: 20px 24px 24px;
+ border-radius: 28px;
+ }
+
+ .article-intro__hero {
+ display: flex;
+ flex-direction: column;
+ gap: 16px;
+ }
+
+ .article-intro__heading {
+ order: -1;
+ width: 100%;
+ padding-top: 0;
+ }
+
+ .article-intro .breadcrumbs {
+ position: static;
+ margin: 0 0 12px;
+ font-size: 10px;
+ line-height: 14px;
+ }
+
+ .article-intro .breadcrumbs__list,
+ .article-intro .breadcrumbs__item {
+ gap: 6px;
+ }
+
+ .article-intro .breadcrumbs__item.is-active {
+ display: block;
+ min-width: 0;
+ max-width: 100%;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+
+ .article-intro .breadcrumbs__item.is-active::before {
+ display: inline-block;
+ margin-right: 6px;
+ vertical-align: 1px;
+ }
+
+ .article-intro__title {
+ font-size: clamp(28px, 4.5vw, 44px);
+ line-height: 1.1;
+ }
+
+ .article-intro__image {
+ max-height: 420px;
+ aspect-ratio: 77 / 50;
+ border-radius: 16px;
+ }
+
+ .article-intro__credit {
+ text-align: left;
+ }
+}
+
+/* Мобильный макет: Figma, узел 1:2011. */
+@media (max-width: 600px) {
+
+ .article-intro {
+ padding: 12px 16px 16px;
+ border-radius: 24px;
+ font-size: 12px;
+ line-height: 20px;
+ }
+
+ .article-intro__author,
+ .article-intro__stat,
+ .article-intro__meta > span {
+ gap: 4px;
+ }
+
+ .article-intro__icon {
+ flex-basis: 16px;
+ width: 16px;
+ height: 16px;
+ }
+
+ .article-intro__topline {
+ gap: 8px;
+ }
+
+ .article-intro__author {
+ min-width: 0;
+ }
+
+ .article-intro__stats {
+ flex-shrink: 0;
+ gap: 16px;
+ }
+
+ .article-intro__hero {
+ gap: 12px;
+ }
+
+ .article-intro .breadcrumbs {
+ font-size: 8px;
+ line-height: 12px;
+ }
+
+ .article-intro .breadcrumbs__list,
+ .article-intro .breadcrumbs__item {
+ gap: 4px;
+ }
+
+ .article-intro .breadcrumbs__item + .breadcrumbs__item::before {
+ width: 3px;
+ height: 3px;
+ }
+
+ .article-intro .breadcrumbs__item.is-active::before {
+ margin-right: 4px;
+ }
+
+ .article-intro__tags {
+ flex-wrap: wrap;
+ gap: 8px;
+ margin-bottom: 12px;
+ }
+
+ .article-intro__tags li {
+ padding: 4px 8px;
+ border-radius: 6px;
+ font-size: 12px;
+ line-height: 16px;
+ }
+
+ .article-intro__title {
+ font-size: 26px;
+ line-height: 28px;
+ letter-spacing: -0.01em;
+ }
+
+ .article-intro__title-ending {
+ display: block;
+ }
+
+ .article-intro__meta {
+ gap: 8px 24px;
+ margin-top: 28px;
+ font-size: 12px;
+ line-height: 20px;
+ }
+
+ .article-intro__image {
+ border-radius: 12px;
+ }
+
+ .article-intro__summary {
+ margin-top: 24px;
+ }
+
+ .article-intro__summary h2 {
+ margin-bottom: 12px;
+ font-size: 14px;
+ line-height: 20px;
+ }
+
+ .article-intro__summary p {
+ font-size: 14px;
+ line-height: 21px;
+ }
+
+ .article-intro__credit {
+ margin-top: 12px;
+ font-size: 10px;
+ line-height: 14px;
+ }
+}
+
+.article-intro .breadcrumbs {
+ width: 100%;
+ margin: 0 0 12px;
+}
+.article-intro .breadcrumbs > .container {
+ width: 100%;
+ max-width: none;
+ padding: 0;
+}
+.article-intro .breadcrumbs__inner { margin: 0; padding: 0; }
+.article-intro .breadcrumbs__item { font-size: inherit; line-height: inherit; }
+.article-intro .breadcrumbs__item::after { display: none; }
+.article-intro .breadcrumbs__link { padding: 0; white-space: normal; }
+.article-intro .breadcrumbs__item.is-active .breadcrumbs__link { color: var(--article-text); }
+.article-intro .breadcrumbs__list {
+ width: 100%;
+ flex-wrap: nowrap;
+}
+.article-intro .breadcrumbs__item {
+ flex-shrink: 0;
+}
+.article-intro .breadcrumbs__item.is-active {
+ display: flex;
+ flex: 0 1 auto;
+ min-width: 0;
+ overflow: hidden;
+}
+.article-intro .breadcrumbs__item + .breadcrumbs__item::before {
+ flex-shrink: 0;
+}
+.article-intro .breadcrumbs__item.is-active .breadcrumbs__link {
+ display: block;
+ min-width: 0;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+}
+
+.courier-services {
+ --services-heading: #172d38;
+ --services-text: #595757;
+ --services-accent: #ae001b;
+ --services-card: #f5f5f9;
+ --logo-size: 70px;
+ box-sizing: border-box;
+ width: min(1280px, calc(100% - 80px));
+ margin: 0 auto;
+ padding: 120px 0 40px;
+ color: var(--services-heading);
+ font-family: "Onest", sans-serif;
+ -webkit-font-smoothing: antialiased;
+}
+
+.courier-services *,
+.courier-services *::before,
+.courier-services *::after {
+ box-sizing: border-box;
+}
+
+.courier-services__header {
+ display: flex;
+ flex-direction: column;
+ gap: 40px;
+ text-align: center;
+}
+
+.courier-services__title {
+ margin: 0;
+ font-size: 56px;
+ font-weight: 700;
+ line-height: 1.1;
+ letter-spacing: -0.01em;
+}
+
+.courier-services__description {
+ margin: 0;
+ color: var(--services-text);
+ font-size: 20px;
+ line-height: 1.1;
+ letter-spacing: -0.01em;
+}
+
+.courier-services__content {
+ display: flex;
+ flex-direction: column;
+ gap: 32px;
+ margin-top: 60px;
+}
+
+.courier-services__navigation {
+ display: flex;
+ flex-wrap: wrap;
+ align-items: center;
+ justify-content: center;
+ gap: 12px 20px;
+}
+
+.courier-services__navigation-title {
+ margin: 0;
+ font-size: 26px;
+ font-weight: 600;
+ line-height: 1.1;
+ letter-spacing: -0.01em;
+}
+
+.courier-services__topics {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: center;
+ gap: 12px;
+}
+
+.courier-services__topic {
+ display: inline-block;
+ padding: 8px 12px;
+ border: 0;
+ border-radius: 10px;
+ background: #f6f6f6;
+ color: #798079;
+ font: 600 20px / 1.3 "Onest", sans-serif;
+ letter-spacing: -0.01em;
+ text-decoration: none;
+ cursor: pointer;
+}
+
+.courier-services__topic:hover {
+ color: var(--services-accent);
+ background: #fff0f2;
+}
+
+.courier-services__grid {
+ display: grid;
+ grid-template-columns: repeat(4, minmax(0, 1fr));
+ gap: 20px;
+ margin: 0;
+ padding: 0;
+ list-style: none;
+}
+
+.courier-services__card {
+ position: relative;
+ display: flex;
+ min-width: 0;
+ height: 100%;
+ flex-direction: column;
+ align-items: flex-start;
+ justify-content: center;
+ gap: 24px;
+ padding: 24px 32px;
+ border-radius: 20px;
+ background: var(--services-card);
+ box-shadow: inset 0 0 0 1px #ededed;
+ color: inherit;
+ text-decoration: none;
+}
+
+.courier-services__card:hover,
+.courier-services__card:active {
+ box-shadow: inset 0 0 0 1px rgb(174 0 27 / 20%);
+}
+
+.courier-services__name {
+ font-size: 20px;
+ font-weight: 600;
+ line-height: 1.1;
+ letter-spacing: -0.01em;
+}
+
+.courier-services__logo {
+ position: relative;
+ display: block;
+ flex: 0 0 var(--logo-size);
+ width: var(--logo-size);
+ height: var(--logo-size);
+ transition: transform 0.25s ease;
+}
+
+.courier-services__card:is(:hover, :focus-visible) .courier-services__logo {
+ transform: scale(1.05);
+}
+
+@media (prefers-reduced-motion: reduce) {
+ .courier-services__logo {
+ transition: none;
+ }
+}
+
+
+.courier-services picture,
+.courier-services picture img {
+ display: block;
+}
+
+.courier-services__logo > img {
+ display: block;
+ width: 100%;
+ height: 100%;
+ object-fit: contain;
+}
+
+.courier-services__logo--samokat {
+ overflow: hidden;
+ border-radius: 50%;
+ background: #ff335f;
+}
+
+.courier-services__samokat-symbol {
+ position: absolute;
+ top: 22.857143%;
+ left: calc(50% - 0.5px);
+ transform: translateX(-50%);
+}
+
+.courier-services__logo--eda {
+ overflow: hidden;
+}
+
+.courier-services__eda-clip {
+ position: absolute;
+ top: 0;
+ left: 0.101429%;
+ width: 99.898571%;
+ height: 100%;
+ mask: url("../img/aggregators/desktop-eda-mask.svg") 0 0 / 100% 100% no-repeat;
+}
+
+.courier-services__eda-symbol {
+ position: absolute;
+ top: 6.5%;
+ left: -3.5%;
+ width: 87.5%;
+ height: 87.5%;
+ mask: url("../img/aggregators/desktop-eda-symbol-mask.svg") 0 0 / 100% 100% no-repeat;
+}
+
+.courier-services__lavka-clip {
+ position: absolute;
+ top: 0.04%;
+ left: 0.05%;
+ width: 100%;
+ height: 100%;
+ mask: url("../img/aggregators/desktop-lavka-mask.svg") 0 0 / 100% 100% no-repeat;
+}
+
+.courier-services__arrow {
+ position: absolute;
+ top: 15px;
+ right: 21px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 51px;
+ height: 51px;
+ border-radius: 50%;
+ background: #fff;
+ color: var(--services-accent);
+ transition: background-color 0.2s ease, color 0.2s ease;
+}
+
+.courier-services__arrow svg {
+ display: block;
+ width: 25%;
+ height: 25%;
+}
+
+.courier-services__card:is(:hover, :active, :focus-visible) .courier-services__arrow {
+ background: var(--services-accent);
+ color: #fff;
+}
+
+.courier-services :is(a, button):focus-visible {
+ outline: 2px solid var(--services-accent);
+ outline-offset: 4px;
+}
+
+@media (max-width: 1199px) {
+ .courier-services__title {
+ font-size: 44px;
+ }
+
+ .courier-services__grid {
+ grid-template-columns: repeat(3, minmax(0, 1fr));
+ }
+
+ .courier-services__navigation-title {
+ font-size: 22px;
+ }
+
+ .courier-services__topic {
+ font-size: 18px;
+ }
+}
+
+@media (max-width: 899px) {
+ .courier-services {
+ width: calc(100% - 48px);
+ padding-top: 80px;
+ }
+
+ .courier-services__title {
+ font-size: 36px;
+ }
+
+ .courier-services__header {
+ gap: 24px;
+ }
+
+ .courier-services__description {
+ font-size: 18px;
+ line-height: 1.3;
+ }
+
+ .courier-services__content {
+ margin-top: 40px;
+ gap: 24px;
+ }
+
+ .courier-services__grid {
+ grid-template-columns: repeat(2, minmax(0, 1fr));
+ gap: 16px;
+ }
+
+ .courier-services__navigation {
+ flex-direction: column;
+ }
+}
+
+@media (max-width: 600px) {
+ .courier-services {
+ --logo-size: 32px;
+ width: calc(100% - 40px);
+ padding: 60px 0 40px;
+ }
+
+ .courier-services__header {
+ gap: 14px;
+ }
+
+ .courier-services__title {
+ font-size: 24px;
+ }
+
+ .courier-services__description {
+ font-size: 14px;
+ line-height: 1.1;
+ }
+
+ .courier-services__content {
+ gap: 14px;
+ margin-top: 30px;
+ }
+
+ .courier-services__navigation {
+ gap: 8px;
+ }
+
+ .courier-services__navigation-title {
+ font-size: 16px;
+ }
+
+ .courier-services__topics {
+ gap: 12px;
+ }
+
+ .courier-services__topic {
+ padding: 4px 8px;
+ font-size: 14px;
+ }
+
+ .courier-services__grid {
+ gap: 9px;
+ }
+
+ .courier-services__card {
+ gap: 16px;
+ padding: 20px;
+ }
+
+ .courier-services__name {
+ font-size: 14px;
+ }
+
+ .courier-services__arrow {
+ top: 11px;
+ right: 13px;
+ width: 24px;
+ height: 24px;
+ }
+
+ .courier-services__eda-clip {
+ mask-image: url("../img/aggregators/mobile-eda-mask.svg");
+ }
+
+ .courier-services__eda-symbol {
+ mask-image: url("../img/aggregators/mobile-eda-symbol-mask.svg");
+ }
+
+ .courier-services__lavka-clip {
+ mask-image: url("../img/aggregators/mobile-lavka-mask.svg");
+ }
+}
+
+@media (max-width: 359px) {
+ .courier-services__topics {
+ gap: 6px;
+ }
+
+ .courier-services__topic {
+ font-size: 12px;
+ }
+
+ .courier-services__card {
+ padding-right: 12px;
+ padding-left: 12px;
+ }
+}
+
+.delivery-orders {
+ --orders-heading: #172d38;
+ --orders-text: #595757;
+ --orders-accent: #ae001b;
+ box-sizing: border-box;
+ width: min(1280px, calc(100% - 40px));
+ margin: var(--space-section) auto 0;
+ color: var(--orders-heading);
+ font-family: "Onest", sans-serif;
+ -webkit-font-smoothing: antialiased;
+}
+
+.delivery-orders *,
+.delivery-orders *::before,
+.delivery-orders *::after {
+ box-sizing: border-box;
+}
+
+.delivery-orders__header {
+ display: flex;
+ flex-direction: column;
+ gap: 40px;
+ margin-bottom: 40px;
+ text-align: center;
+}
+
+.delivery-orders__title {
+ margin: 0;
+ font-size: 56px;
+ font-weight: 700;
+ line-height: 62px;
+ letter-spacing: -0.56px;
+}
+
+.delivery-orders__description {
+ margin: 0;
+ color: var(--orders-text);
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 30px;
+ letter-spacing: -0.2px;
+}
+
+.delivery-orders__grid {
+ display: grid;
+ grid-template-columns: repeat(3, minmax(0, 1fr));
+ grid-template-rows: 396px 285px;
+ grid-auto-rows: 396px;
+ gap: 20px;
+ margin: 0;
+ padding: 0;
+ list-style: none;
+}
+
+.delivery-orders__wide {
+ grid-column: 1 / -1;
+}
+
+.delivery-orders__card {
+ --blur-start: 229px;
+ --blur-end: 462px;
+ position: relative;
+ isolation: isolate;
+ display: block;
+ overflow: hidden;
+ width: 100%;
+ height: 100%;
+ padding: 0;
+ border: 0;
+ border-radius: 40px;
+ background: linear-gradient(#f5f5f9, #f9f9f9);
+ color: #fff;
+ font: inherit;
+ text-align: left;
+ cursor: pointer;
+ -webkit-tap-highlight-color: transparent;
+}
+
+.delivery-orders__card::after {
+ position: absolute;
+ z-index: 1;
+ inset: 0;
+ background: rgb(174 0 27 / 50%);
+ content: "";
+ opacity: 0;
+ transition: opacity 180ms ease;
+ pointer-events: none;
+}
+
+.delivery-orders__image {
+ position: absolute;
+ display: block;
+ max-width: none;
+ object-fit: cover;
+ pointer-events: none;
+}
+
+.delivery-orders__image--cover {
+ inset: 0;
+ width: 100%;
+ height: 100%;
+}
+
+.delivery-orders__card:not(a) {
+ cursor: default;
+}
+
+.delivery-orders__image--food {
+ bottom: 0;
+ left: 0;
+ width: 537px;
+ height: 732px;
+}
+
+.delivery-orders__image--groceries-backdrop {
+ bottom: 0;
+ left: 0;
+ width: 414px;
+ height: 421px;
+}
+
+.delivery-orders__image--groceries {
+ top: 0;
+ left: -118px;
+ width: 710px;
+ height: 396px;
+}
+
+.delivery-orders__image--parcels {
+ bottom: 0;
+ left: -403px;
+ width: 1409px;
+ height: 786px;
+}
+
+.delivery-orders__image--documents {
+ bottom: -229px;
+ left: -11px;
+ width: 1296px;
+ height: 723px;
+}
+
+.delivery-orders__blur,
+.delivery-orders__blur > span {
+ position: absolute;
+ inset: 0;
+ pointer-events: none;
+}
+
+.delivery-orders__blur > span {
+ --blur-step: calc((var(--blur-end) - var(--blur-start)) / 4);
+ -webkit-backdrop-filter: blur(var(--blur-radius));
+ backdrop-filter: blur(var(--blur-radius));
+ mask-image: linear-gradient(
+ transparent calc(var(--blur-start) + var(--blur-step) * var(--blur-index)),
+ #000 calc(var(--blur-start) + var(--blur-step) * (var(--blur-index) + 1))
+ );
+}
+
+.delivery-orders__blur > span:nth-child(1) {
+ --blur-index: 0;
+ --blur-radius: 1.8px;
+}
+
+.delivery-orders__blur > span:nth-child(2) {
+ --blur-index: 1;
+ --blur-radius: 3.6px;
+}
+
+.delivery-orders__blur > span:nth-child(3) {
+ --blur-index: 2;
+ --blur-radius: 5.4px;
+}
+
+.delivery-orders__blur > span:nth-child(4) {
+ --blur-index: 3;
+ --blur-radius: 7.2px;
+}
+
+.delivery-orders__card--groceries {
+ --blur-start: 233px;
+ --blur-end: 423px;
+}
+
+.delivery-orders__card--parcels {
+ --blur-start: 236px;
+ --blur-end: 428px;
+}
+
+.delivery-orders__card--documents {
+ --blur-start: 151px;
+ --blur-end: 364px;
+}
+
+.delivery-orders__shade {
+ position: absolute;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ height: 163px;
+ background: linear-gradient(transparent, #000);
+ opacity: 0.9;
+ pointer-events: none;
+}
+
+.delivery-orders__card--groceries .delivery-orders__shade {
+ height: 187px;
+ opacity: 0.8;
+}
+
+.delivery-orders__card--documents .delivery-orders__shade {
+ height: 138px;
+}
+
+.delivery-orders__copy {
+ position: absolute;
+ z-index: 2;
+ right: 95px;
+ bottom: 32px;
+ left: 40px;
+ display: flex;
+ flex-direction: column;
+ gap: 16px;
+ pointer-events: none;
+}
+
+.delivery-orders__card-title {
+ font-size: 26px;
+ font-weight: 600;
+ line-height: 29px;
+ letter-spacing: -0.26px;
+}
+
+.delivery-orders__card-description {
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 28px;
+ letter-spacing: -0.2px;
+}
+
+.delivery-orders__card--groceries .delivery-orders__copy {
+ right: 40px;
+}
+
+.delivery-orders__card--groceries .delivery-orders__card-description {
+ width: 213px;
+}
+
+.delivery-orders__card--parcels .delivery-orders__copy {
+ right: 50px;
+}
+
+.delivery-orders__card--documents .delivery-orders__copy {
+ right: 103px;
+}
+
+.delivery-orders__arrow {
+ position: absolute;
+ z-index: 2;
+ top: 32px;
+ right: 32px;
+ width: 51px;
+ height: 51px;
+ pointer-events: none;
+}
+
+.delivery-orders__card--documents .delivery-orders__arrow {
+ right: 33px;
+}
+
+.delivery-orders__arrow {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ border-radius: 50%;
+ background: #fff;
+ color: var(--orders-accent);
+ transition: color 180ms ease, background-color 180ms ease;
+}
+
+.delivery-orders__arrow svg {
+ width: 13px;
+ height: 13px;
+}
+
+.delivery-orders__card:is(:hover, :focus-visible, :active)::after {
+ opacity: 1;
+}
+
+.delivery-orders__card:is(:hover, :focus-visible, :active) .delivery-orders__arrow {
+ background: var(--orders-accent);
+ color: #fff;
+}
+
+.delivery-orders__card:focus-visible {
+ outline: 3px solid var(--orders-accent);
+ outline-offset: 5px;
+}
+
+@media (max-width: 1023.98px) {
+ .delivery-orders__title {
+ font-size: 40px;
+ line-height: 1.1;
+ }
+ .delivery-orders__slider {
+ overflow: visible;
+ }
+ .delivery-orders__grid {
+ display: flex;
+ gap: 0;
+ grid-template-rows: none;
+ }
+ .delivery-orders__grid > li {
+ flex-shrink: 0;
+ width: 340px;
+ height: 300px;
+ }
+ .delivery-orders__card {
+ --blur-start: 120px;
+ --blur-end: 300px;
+ border-radius: 24px;
+ }
+ .delivery-orders__card-title {
+ font-size: 22px;
+ line-height: 1.15;
+ overflow-wrap: anywhere;
+ }
+ .delivery-orders__card-description {
+ font-size: 16px;
+ line-height: 1.4;
+ overflow-wrap: anywhere;
+ }
+ .delivery-orders__grid.is-grid {
+ gap: 20px;
+ overflow-x: auto;
+ scroll-snap-type: x mandatory;
+ }
+ .delivery-orders__grid.is-grid > li {
+ scroll-snap-align: start;
+ }
+ .delivery-orders__wide {
+ grid-column: auto;
+ }
+ .delivery-orders__copy,
+ .delivery-orders__card--groceries .delivery-orders__copy,
+ .delivery-orders__card--parcels .delivery-orders__copy,
+ .delivery-orders__card--documents .delivery-orders__copy {
+ left: 24px;
+ right: 24px;
+ bottom: 24px;
+ }
+}
+
+@media (max-width: 575.98px) {
+ .delivery-orders {
+ width: calc(100% - 40px);
+ }
+ .delivery-orders__header {
+ gap: 14px;
+ margin-bottom: 32px;
+ }
+ .delivery-orders__title {
+ font-size: 24px;
+ line-height: 1.1;
+ letter-spacing: -0.24px;
+ }
+ .delivery-orders__description {
+ font-size: 14px;
+ line-height: 1.5;
+ letter-spacing: -0.14px;
+ }
+ .delivery-orders__slider {
+ overflow: visible;
+ }
+ .delivery-orders__grid {
+ display: flex;
+ gap: 0;
+ }
+ .delivery-orders__grid > li {
+ flex-shrink: 0;
+ width: 278px;
+ height: 218px;
+ }
+ .delivery-orders__card {
+ --blur-start: 90px;
+ --blur-end: 218px;
+ border-radius: 20px;
+ }
+ .delivery-orders__grid.is-grid {
+ gap: 10px;
+ }
+ .delivery-orders__copy {
+ gap: 8px;
+ }
+ .delivery-orders__card-title {
+ font-size: 16px;
+ line-height: 1.1;
+ letter-spacing: -0.16px;
+ }
+ .delivery-orders__card-description {
+ font-size: 14px;
+ line-height: 1.4;
+ letter-spacing: -0.14px;
+ }
+ .delivery-orders__shade {
+ height: 126px;
+ }
+ .delivery-orders__arrow,
+ .delivery-orders__card--documents .delivery-orders__arrow {
+ top: 12px;
+ right: 12px;
+ width: 24px;
+ height: 24px;
+ background: var(--orders-accent);
+ color: #fff;
+ }
+ .delivery-orders__arrow svg {
+ width: 7px;
+ height: 7px;
+ }
+}
+
+@media (prefers-reduced-motion: reduce) {
+ .delivery-orders__card::after,
+ .delivery-orders__arrow {
+ transition: none;
+ }
+}
+
+.work-formats {
+ --formats-heading: #172d38;
+ --formats-text: #595757;
+ --formats-border: #ededed;
+ --formats-accent: #ae001b;
+ box-sizing: border-box;
+ display: flex;
+ width: min(1280px, calc(100% - 80px));
+ margin: var(--space-section) auto 0;
+ flex-direction: column;
+ gap: 60px;
+ color: var(--formats-heading);
+ font-family: "Onest", sans-serif;
+ -webkit-font-smoothing: antialiased;
+}
+
+.work-formats *,
+.work-formats *::before,
+.work-formats *::after {
+ box-sizing: border-box;
+}
+
+.work-formats__header {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 40px;
+ text-align: center;
+}
+
+.work-formats__title {
+ width: 964px;
+ max-width: 100%;
+ margin: 0;
+ font-size: 56px;
+ font-weight: 700;
+ line-height: 62px;
+ letter-spacing: -0.56px;
+}
+
+.work-formats__description {
+ width: 100%;
+ margin: 0;
+ color: var(--formats-text);
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 22px;
+ letter-spacing: -0.2px;
+}
+
+.work-formats__groups {
+ display: flex;
+ flex-direction: column;
+ gap: 40px;
+}
+
+.work-formats__group {
+ display: flex;
+ flex-direction: column;
+ gap: 24px;
+}
+
+.work-formats__group-title {
+ margin: 0;
+ font-size: 26px;
+ font-weight: 600;
+ line-height: 29px;
+ letter-spacing: -0.26px;
+ text-align: center;
+}
+
+.work-formats__links {
+ display: flex;
+ flex-wrap: wrap;
+ align-items: flex-start;
+ justify-content: center;
+ gap: 12px;
+ margin: 0;
+ padding: 0;
+ list-style: none;
+}
+
+.work-formats__links > li {
+ max-width: 100%;
+}
+
+.work-formats__link {
+ display: flex;
+ width: auto;
+ max-width: 100%;
+ min-height: 54px;
+ align-items: center;
+ gap: 8px;
+ padding: 16px 16px 16px 24px;
+ border-radius: 100px;
+ box-shadow: inset 0 0 0 1px var(--formats-border);
+ color: inherit;
+ font-size: 18px;
+ font-weight: 600;
+ line-height: 20px;
+ letter-spacing: -0.18px;
+ text-decoration: none;
+ overflow-wrap: anywhere;
+}
+
+.work-formats__link:is(:hover, :focus-visible) {
+ background: #f5f5f9;
+ color: var(--formats-accent);
+}
+
+.work-formats__link:focus-visible {
+ outline: 2px solid var(--formats-accent);
+ outline-offset: 4px;
+}
+
+.work-formats__arrow {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex: 0 0 22px;
+ width: 22px;
+ height: 22px;
+ transition: transform 0.2s ease;
+}
+
+.work-formats__arrow svg {
+ display: block;
+ width: 100%;
+ height: 100%;
+}
+
+.work-formats__link {
+ transition: color 0.2s ease, background-color 0.2s ease;
+}
+
+.work-formats__link:is(:hover, :focus-visible) .work-formats__arrow {
+ transform: translateX(3px);
+}
+
+@media (prefers-reduced-motion: reduce) {
+ .work-formats__link,
+ .work-formats__arrow {
+ transition: none;
+ }
+ .work-formats__link:is(:hover, :focus-visible) .work-formats__arrow {
+ transform: none;
+ }
+}
+
+
+
+@media (max-width: 1199px) {
+ .work-formats__title {
+ font-size: 44px;
+ line-height: 1.1;
+ letter-spacing: -0.01em;
+ }
+}
+
+@media (max-width: 899px) {
+ .work-formats {
+ width: calc(100% - 48px);
+ gap: 40px;
+ }
+
+ .work-formats__header {
+ gap: 24px;
+ }
+
+ .work-formats__title {
+ font-size: 36px;
+ }
+}
+
+@media (max-width: 600px) {
+ .work-formats {
+ width: calc(100% - 40px);
+ gap: 30px;
+ }
+
+ .work-formats__header {
+ gap: 14px;
+ }
+
+ .work-formats__title {
+ font-size: 24px;
+ line-height: 26px;
+ letter-spacing: -0.24px;
+ }
+
+ .work-formats__description {
+ font-size: 14px;
+ line-height: 15px;
+ letter-spacing: -0.14px;
+ }
+
+ .work-formats__groups {
+ gap: 30px;
+ }
+
+ .work-formats__group {
+ gap: 16px;
+ }
+
+ .work-formats__group-title {
+ font-size: 16px;
+ line-height: 18px;
+ letter-spacing: -0.16px;
+ }
+
+ .work-formats__links {
+ gap: 4px;
+ }
+
+ .work-formats__link {
+ min-height: 36px;
+ gap: 4px;
+ padding: 11px 11px 11px 16px;
+ font-size: 13px;
+ line-height: 14px;
+ letter-spacing: -0.13px;
+ }
+
+ .work-formats__arrow {
+ flex-basis: 14px;
+ width: 14px;
+ height: 14px;
+ }
+
+
+
+}
+
+.work-directions {
+ --directions-background: #f5f5f9;
+ --directions-heading: #172d38;
+ --directions-accent: #ae001b;
+ width: 100%;
+ margin: 40px 0 40px;
+ color: var(--directions-heading);
+ font-family: "Onest", sans-serif;
+ -webkit-font-smoothing: antialiased;
+}
+
+.work-directions,
+.work-directions *,
+.work-directions *::before,
+.work-directions *::after {
+ box-sizing: border-box;
+}
+
+.work-directions__grid {
+ display: grid;
+ grid-template-columns: minmax(0, 413fr) minmax(0, 414fr) minmax(0, 413fr);
+ gap: 20px;
+ margin: 0;
+ padding: 0;
+ list-style: none;
+}
+
+.work-directions__card {
+ position: relative;
+ isolation: isolate;
+ display: flex;
+ width: 100%;
+ min-width: 0;
+ aspect-ratio: 413 / 290;
+ min-height: 200px;
+ align-items: flex-end;
+ justify-content: center;
+ overflow: hidden;
+ padding: 32px 16px;
+ border-radius: 20px;
+ background: var(--directions-background);
+ color: inherit;
+ text-align: center;
+ text-decoration: none;
+ -webkit-tap-highlight-color: transparent;
+}
+
+.work-directions__card--taxi {
+ aspect-ratio: 414 / 290;
+}
+
+.work-directions__label {
+ position: relative;
+ font-size: 20px;
+ font-weight: 600;
+ line-height: 1.1;
+ letter-spacing: -0.01em;
+}
+
+.work-directions__vehicle {
+ position: absolute;
+ display: block;
+ overflow: hidden;
+ background: var(--directions-background);
+ transform: translateX(-50%);
+ transition: transform 240ms ease;
+ pointer-events: none;
+}
+
+.work-directions__vehicle img {
+ display: block;
+ width: 100%;
+ height: 100%;
+ object-fit: contain;
+ mix-blend-mode: darken;
+}
+
+.work-directions__vehicle--scooter {
+ top: 20%;
+ left: calc(50% + 0.5px);
+ width: 55.205811%;
+ aspect-ratio: 228 / 152;
+}
+
+
+.work-directions__vehicle--taxi {
+ top: 20%;
+ left: calc(50% - 1px);
+ width: 83.091787%;
+ aspect-ratio: 344 / 151;
+}
+
+
+.work-directions__vehicle--van {
+ top: 13.448276%;
+ left: calc(50% - 6.5px);
+ width: 87.651332%;
+ aspect-ratio: 362 / 174;
+}
+
+
+.work-directions__arrow {
+ --arrow-scale: 1;
+ position: absolute;
+ z-index: 1;
+ top: 24px;
+ right: 24px;
+ display: block;
+ width: 51px;
+ height: 51px;
+}
+
+.work-directions__arrow {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ border-radius: 50%;
+ background: #fff;
+ color: var(--directions-accent);
+ transition: color 180ms ease, background-color 180ms ease;
+}
+.work-directions__arrow svg {
+ display: block;
+ width: 13px;
+ height: 13px;
+}
+.work-directions__card:is(:hover, :focus-visible, :active, .is-active) .work-directions__arrow {
+ background: var(--directions-accent);
+ color: #fff;
+}
+.work-directions__card.is-active {
+ box-shadow: inset 0 0 0 1px var(--directions-accent);
+}
+
+@media (hover: hover) {
+ .work-directions__card:hover {
+ box-shadow: inset 0 0 0 1px rgb(174 0 27 / 20%);
+ }
+
+
+ .work-directions__card:hover .work-directions__vehicle {
+ transform: translateX(-50%) scale(1.04);
+ }
+}
+
+.work-directions__card:active {
+ box-shadow: inset 0 0 0 1px rgb(174 0 27 / 20%);
+}
+
+.work-directions__card:focus-visible {
+ outline: 2px solid var(--directions-accent);
+ outline-offset: 4px;
+}
+
+
+.work-directions__card:is(:active, :focus-visible) .work-directions__vehicle {
+ transform: translateX(-50%) scale(1.04);
+}
+
+@media (min-width: 768px) and (max-width: 1199px) {
+
+ .work-directions__grid {
+ gap: 16px;
+ }
+
+ .work-directions__card {
+ padding-bottom: 24px;
+ }
+
+ .work-directions__label {
+ font-size: 18px;
+ }
+
+ .work-directions__arrow {
+ top: 16px;
+ right: 16px;
+ }
+}
+
+@media (prefers-reduced-motion: reduce) {
+ .work-directions__vehicle,
+ .work-directions__arrow {
+ transition: none;
+ }
+}
+
+@media (max-width: 767.98px) {
+ .work-directions {
+ margin-top: 20px;
+ }
+
+ .work-directions__grid {
+ grid-template-columns: minmax(0, 163fr) minmax(0, 162fr);
+ gap: 10px;
+ }
+
+ .work-directions__cargo {
+ grid-column: 1 / -1;
+ }
+
+ .work-directions__card {
+ height: 155px;
+ min-height: 0;
+ aspect-ratio: auto;
+ padding: 16px;
+ }
+
+ .work-directions__label {
+ font-size: 14px;
+ }
+
+ .work-directions__vehicle--scooter {
+ top: 36px;
+ left: calc(50% + 0.5px);
+ width: min(106px, 70%);
+ aspect-ratio: 106 / 70;
+ }
+
+ .work-directions__vehicle--taxi {
+ top: 39px;
+ left: 50%;
+ width: min(138px, 85.185185%);
+ aspect-ratio: 138 / 61;
+ }
+
+ .work-directions__vehicle--van {
+ top: 22px;
+ left: 50%;
+ width: min(181px, 80%);
+ aspect-ratio: 181 / 87;
+ }
+
+ .work-directions__arrow {
+ --arrow-scale: 0.5882352941;
+ top: 12px;
+ right: 12px;
+ width: 30px;
+ height: 30px;
+ }
+}
diff --git a/wp-content/themes/hantico/assets/img/bg/app-cta-phone.webp b/wp-content/themes/hantico/assets/img/bg/app-cta-phone.webp
new file mode 100644
index 0000000..6c78d15
Binary files /dev/null and b/wp-content/themes/hantico/assets/img/bg/app-cta-phone.webp differ
diff --git a/wp-content/themes/hantico/assets/img/bg/app-cta.webp b/wp-content/themes/hantico/assets/img/bg/app-cta.webp
new file mode 100644
index 0000000..3e730ab
Binary files /dev/null and b/wp-content/themes/hantico/assets/img/bg/app-cta.webp differ
diff --git a/wp-content/themes/hantico/assets/img/bg/arrow-q.svg b/wp-content/themes/hantico/assets/img/bg/arrow-q.svg
new file mode 100644
index 0000000..bfdfee7
--- /dev/null
+++ b/wp-content/themes/hantico/assets/img/bg/arrow-q.svg
@@ -0,0 +1,11 @@
+
+
+
+
+
+
+
+
+
+
+
diff --git a/wp-content/themes/hantico/assets/img/bg/cta-c.svg b/wp-content/themes/hantico/assets/img/bg/cta-c.svg
new file mode 100644
index 0000000..223ffca
--- /dev/null
+++ b/wp-content/themes/hantico/assets/img/bg/cta-c.svg
@@ -0,0 +1,3 @@
+
+
+
diff --git a/wp-content/themes/hantico/assets/img/bg/cta-img.webp b/wp-content/themes/hantico/assets/img/bg/cta-img.webp
new file mode 100644
index 0000000..683af37
Binary files /dev/null and b/wp-content/themes/hantico/assets/img/bg/cta-img.webp differ
diff --git a/wp-content/themes/hantico/assets/img/bg/cta-vec.svg b/wp-content/themes/hantico/assets/img/bg/cta-vec.svg
new file mode 100644
index 0000000..3e93188
--- /dev/null
+++ b/wp-content/themes/hantico/assets/img/bg/cta-vec.svg
@@ -0,0 +1,3 @@
+
+
+
diff --git a/wp-content/themes/hantico/assets/img/content/app-steps-1.webp b/wp-content/themes/hantico/assets/img/content/app-steps-1.webp
new file mode 100644
index 0000000..70a4bb2
Binary files /dev/null and b/wp-content/themes/hantico/assets/img/content/app-steps-1.webp differ
diff --git a/wp-content/themes/hantico/assets/img/content/app-steps-2.webp b/wp-content/themes/hantico/assets/img/content/app-steps-2.webp
new file mode 100644
index 0000000..dbaf274
Binary files /dev/null and b/wp-content/themes/hantico/assets/img/content/app-steps-2.webp differ
diff --git a/wp-content/themes/hantico/assets/img/content/app-steps-3.webp b/wp-content/themes/hantico/assets/img/content/app-steps-3.webp
new file mode 100644
index 0000000..fb4240b
Binary files /dev/null and b/wp-content/themes/hantico/assets/img/content/app-steps-3.webp differ
diff --git a/wp-content/themes/hantico/assets/img/content/app-steps-phone.webp b/wp-content/themes/hantico/assets/img/content/app-steps-phone.webp
new file mode 100644
index 0000000..1d3b169
Binary files /dev/null and b/wp-content/themes/hantico/assets/img/content/app-steps-phone.webp differ
diff --git a/wp-content/themes/hantico/assets/img/content/app-steps-qr.webp b/wp-content/themes/hantico/assets/img/content/app-steps-qr.webp
new file mode 100644
index 0000000..7cabf07
Binary files /dev/null and b/wp-content/themes/hantico/assets/img/content/app-steps-qr.webp differ
diff --git a/wp-content/themes/hantico/assets/img/social/AppGallery.svg b/wp-content/themes/hantico/assets/img/social/AppGallery.svg
new file mode 100644
index 0000000..316bc2d
--- /dev/null
+++ b/wp-content/themes/hantico/assets/img/social/AppGallery.svg
@@ -0,0 +1,17 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/wp-content/themes/hantico/assets/img/social/appstore.svg b/wp-content/themes/hantico/assets/img/social/appstore.svg
new file mode 100644
index 0000000..4a77ac3
--- /dev/null
+++ b/wp-content/themes/hantico/assets/img/social/appstore.svg
@@ -0,0 +1,4 @@
+
+
+
+
diff --git a/wp-content/themes/hantico/assets/img/social/google.svg b/wp-content/themes/hantico/assets/img/social/google.svg
new file mode 100644
index 0000000..3fac5dd
--- /dev/null
+++ b/wp-content/themes/hantico/assets/img/social/google.svg
@@ -0,0 +1,7 @@
+
+
+
+
+
+
+
diff --git a/wp-content/themes/hantico/assets/img/social/rustor.svg b/wp-content/themes/hantico/assets/img/social/rustor.svg
new file mode 100644
index 0000000..73652fb
--- /dev/null
+++ b/wp-content/themes/hantico/assets/img/social/rustor.svg
@@ -0,0 +1,9 @@
+
+
+
+
+
+
+
+
+
diff --git a/wp-content/themes/hantico/assets/img/work-directions/scooter.webp b/wp-content/themes/hantico/assets/img/work-directions/scooter.webp
new file mode 100644
index 0000000..037f6b8
Binary files /dev/null and b/wp-content/themes/hantico/assets/img/work-directions/scooter.webp differ
diff --git a/wp-content/themes/hantico/assets/img/work-directions/taxi.webp b/wp-content/themes/hantico/assets/img/work-directions/taxi.webp
new file mode 100644
index 0000000..276cbae
Binary files /dev/null and b/wp-content/themes/hantico/assets/img/work-directions/taxi.webp differ
diff --git a/wp-content/themes/hantico/assets/img/work-directions/van.webp b/wp-content/themes/hantico/assets/img/work-directions/van.webp
new file mode 100644
index 0000000..963b404
Binary files /dev/null and b/wp-content/themes/hantico/assets/img/work-directions/van.webp differ
diff --git a/wp-content/themes/hantico/assets/js/scripts.js b/wp-content/themes/hantico/assets/js/scripts.js
index 2e01e47..8f7dea5 100644
--- a/wp-content/themes/hantico/assets/js/scripts.js
+++ b/wp-content/themes/hantico/assets/js/scripts.js
@@ -544,6 +544,36 @@ document.addEventListener('DOMContentLoaded', () => {
}, sizeLG);
+ // Форматы доставки: слайдер на телефонах и планшетах.
+ document.querySelectorAll('.delivery-orders__slider').forEach(slider => {
+ new ResponsiveSwiper(slider, {
+ slidesPerView: 'auto',
+ spaceBetween: 10,
+ watchOverflow: true,
+ grabCursor: true,
+ breakpoints: {
+ 576: { spaceBetween: 20 }
+ }
+ }, sizeLG);
+ });
+
+
+ // Похожие статьи: слайдер на всех экранах
+ document.querySelectorAll('.related-slider').forEach(slider => {
+ new ResponsiveSwiper(slider.querySelector('.related-slider__container'), {
+ slidesPerView: 1.25,
+ spaceBetween: 15,
+ watchOverflow: true,
+ grabCursor: true,
+ breakpoints: {
+ 576: { slidesPerView: 1.25, spaceBetween: 20 },
+ 768: { slidesPerView: 2.25, spaceBetween: 20 },
+ 1024: { slidesPerView: 3, spaceBetween: 20 }
+ }
+ });
+ });
+
+
// Слайдер блога
const blogSlider = new ResponsiveSwiper('.blog-slider__container', {
loop: true,
@@ -600,23 +630,6 @@ document.addEventListener('DOMContentLoaded', () => {
});
- // Скролл длинного содержания статей
- function initScrollableToc() {
- const list = document.querySelector('.article-toc__list');
- if (!list) return;
- function updateScrollableState() {
- const isScrollable = list.scrollHeight > list.clientHeight;
- list.classList.toggle('is-scrollable', isScrollable);
- }
- updateScrollableState();
- window.addEventListener('resize', updateScrollableState);
- if (document.fonts) {
- document.fonts.ready.then(updateScrollableState);
- }
- }
- initScrollableToc();
-
-
// AJAX-фильтр статей
function initArticlesFilter() {
const filter = document.querySelector('.articles-filter');
@@ -674,6 +687,7 @@ document.addEventListener('DOMContentLoaded', () => {
currentRequest = new AbortController();
const formData = new FormData();
formData.append('action', 'theme_filter_articles');
+ formData.append('section', grid.dataset.section || '');
formData.append('nonce', window.themeAjax.nonces.articles);
formData.append('category', category);
formData.append('page', page);
diff --git a/wp-content/themes/hantico/assets/scss/_courier-services.scss b/wp-content/themes/hantico/assets/scss/_courier-services.scss
new file mode 100644
index 0000000..23e62f6
--- /dev/null
+++ b/wp-content/themes/hantico/assets/scss/_courier-services.scss
@@ -0,0 +1,378 @@
+.courier-services {
+ --services-heading: #172d38;
+ --services-text: #595757;
+ --services-accent: #ae001b;
+ --services-card: #f5f5f9;
+ --logo-size: 70px;
+ box-sizing: border-box;
+ width: min(1280px, calc(100% - 80px));
+ margin: 0 auto;
+ padding: 120px 0 40px;
+ color: var(--services-heading);
+ font-family: "Onest", sans-serif;
+ -webkit-font-smoothing: antialiased;
+}
+
+.courier-services *,
+.courier-services *::before,
+.courier-services *::after {
+ box-sizing: border-box;
+}
+
+.courier-services__header {
+ display: flex;
+ flex-direction: column;
+ gap: 40px;
+ text-align: center;
+}
+
+.courier-services__title {
+ margin: 0;
+ font-size: 56px;
+ font-weight: 700;
+ line-height: 1.1;
+ letter-spacing: -0.01em;
+}
+
+.courier-services__description {
+ margin: 0;
+ color: var(--services-text);
+ font-size: 20px;
+ line-height: 1.1;
+ letter-spacing: -0.01em;
+}
+
+.courier-services__content {
+ display: flex;
+ flex-direction: column;
+ gap: 32px;
+ margin-top: 60px;
+}
+
+.courier-services__navigation {
+ display: flex;
+ flex-wrap: wrap;
+ align-items: center;
+ justify-content: center;
+ gap: 12px 20px;
+}
+
+.courier-services__navigation-title {
+ margin: 0;
+ font-size: 26px;
+ font-weight: 600;
+ line-height: 1.1;
+ letter-spacing: -0.01em;
+}
+
+.courier-services__topics {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: center;
+ gap: 12px;
+}
+
+.courier-services__topic {
+ display: inline-block;
+ padding: 8px 12px;
+ border: 0;
+ border-radius: 10px;
+ background: #f6f6f6;
+ color: #798079;
+ font: 600 20px / 1.3 "Onest", sans-serif;
+ letter-spacing: -0.01em;
+ text-decoration: none;
+ cursor: pointer;
+}
+
+.courier-services__topic:hover {
+ color: var(--services-accent);
+ background: #fff0f2;
+}
+
+.courier-services__grid {
+ display: grid;
+ grid-template-columns: repeat(4, minmax(0, 1fr));
+ gap: 20px;
+ margin: 0;
+ padding: 0;
+ list-style: none;
+}
+
+.courier-services__card {
+ position: relative;
+ display: flex;
+ min-width: 0;
+ height: 100%;
+ flex-direction: column;
+ align-items: flex-start;
+ justify-content: center;
+ gap: 24px;
+ padding: 24px 32px;
+ border-radius: 20px;
+ background: var(--services-card);
+ box-shadow: inset 0 0 0 1px #ededed;
+ color: inherit;
+ text-decoration: none;
+}
+
+.courier-services__card:hover,
+.courier-services__card:active {
+ box-shadow: inset 0 0 0 1px rgb(174 0 27 / 20%);
+}
+
+.courier-services__name {
+ font-size: 20px;
+ font-weight: 600;
+ line-height: 1.1;
+ letter-spacing: -0.01em;
+}
+
+.courier-services__logo {
+ position: relative;
+ display: block;
+ flex: 0 0 var(--logo-size);
+ width: var(--logo-size);
+ height: var(--logo-size);
+ transition: transform 0.25s ease;
+}
+
+.courier-services__card:is(:hover, :focus-visible) .courier-services__logo {
+ transform: scale(1.05);
+}
+
+@media (prefers-reduced-motion: reduce) {
+ .courier-services__logo {
+ transition: none;
+ }
+}
+
+
+.courier-services picture,
+.courier-services picture img {
+ display: block;
+}
+
+.courier-services__logo > img {
+ display: block;
+ width: 100%;
+ height: 100%;
+ object-fit: contain;
+}
+
+.courier-services__logo--samokat {
+ overflow: hidden;
+ border-radius: 50%;
+ background: #ff335f;
+}
+
+.courier-services__samokat-symbol {
+ position: absolute;
+ top: 22.857143%;
+ left: calc(50% - 0.5px);
+ transform: translateX(-50%);
+}
+
+.courier-services__logo--eda {
+ overflow: hidden;
+}
+
+.courier-services__eda-clip {
+ position: absolute;
+ top: 0;
+ left: 0.101429%;
+ width: 99.898571%;
+ height: 100%;
+ mask: url("../img/aggregators/desktop-eda-mask.svg") 0 0 / 100% 100% no-repeat;
+}
+
+.courier-services__eda-symbol {
+ position: absolute;
+ top: 6.5%;
+ left: -3.5%;
+ width: 87.5%;
+ height: 87.5%;
+ mask: url("../img/aggregators/desktop-eda-symbol-mask.svg") 0 0 / 100% 100% no-repeat;
+}
+
+.courier-services__lavka-clip {
+ position: absolute;
+ top: 0.04%;
+ left: 0.05%;
+ width: 100%;
+ height: 100%;
+ mask: url("../img/aggregators/desktop-lavka-mask.svg") 0 0 / 100% 100% no-repeat;
+}
+
+.courier-services__arrow {
+ position: absolute;
+ top: 15px;
+ right: 21px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 51px;
+ height: 51px;
+ border-radius: 50%;
+ background: #fff;
+ color: var(--services-accent);
+ transition: background-color 0.2s ease, color 0.2s ease;
+}
+
+.courier-services__arrow svg {
+ display: block;
+ width: 25%;
+ height: 25%;
+}
+
+.courier-services__card:is(:hover, :active, :focus-visible) .courier-services__arrow {
+ background: var(--services-accent);
+ color: #fff;
+}
+
+.courier-services :is(a, button):focus-visible {
+ outline: 2px solid var(--services-accent);
+ outline-offset: 4px;
+}
+
+@media (max-width: 1199px) {
+ .courier-services__title {
+ font-size: 44px;
+ }
+
+ .courier-services__grid {
+ grid-template-columns: repeat(3, minmax(0, 1fr));
+ }
+
+ .courier-services__navigation-title {
+ font-size: 22px;
+ }
+
+ .courier-services__topic {
+ font-size: 18px;
+ }
+}
+
+@media (max-width: 899px) {
+ .courier-services {
+ width: calc(100% - 48px);
+ padding-top: 80px;
+ }
+
+ .courier-services__title {
+ font-size: 36px;
+ }
+
+ .courier-services__header {
+ gap: 24px;
+ }
+
+ .courier-services__description {
+ font-size: 18px;
+ line-height: 1.3;
+ }
+
+ .courier-services__content {
+ margin-top: 40px;
+ gap: 24px;
+ }
+
+ .courier-services__grid {
+ grid-template-columns: repeat(2, minmax(0, 1fr));
+ gap: 16px;
+ }
+
+ .courier-services__navigation {
+ flex-direction: column;
+ }
+}
+
+@media (max-width: 600px) {
+ .courier-services {
+ --logo-size: 32px;
+ width: calc(100% - 40px);
+ padding: 60px 0 40px;
+ }
+
+ .courier-services__header {
+ gap: 14px;
+ }
+
+ .courier-services__title {
+ font-size: 24px;
+ }
+
+ .courier-services__description {
+ font-size: 14px;
+ line-height: 1.1;
+ }
+
+ .courier-services__content {
+ gap: 14px;
+ margin-top: 30px;
+ }
+
+ .courier-services__navigation {
+ gap: 8px;
+ }
+
+ .courier-services__navigation-title {
+ font-size: 16px;
+ }
+
+ .courier-services__topics {
+ gap: 12px;
+ }
+
+ .courier-services__topic {
+ padding: 4px 8px;
+ font-size: 14px;
+ }
+
+ .courier-services__grid {
+ gap: 9px;
+ }
+
+ .courier-services__card {
+ gap: 16px;
+ padding: 20px;
+ }
+
+ .courier-services__name {
+ font-size: 14px;
+ }
+
+ .courier-services__arrow {
+ top: 11px;
+ right: 13px;
+ width: 24px;
+ height: 24px;
+ }
+
+ .courier-services__eda-clip {
+ mask-image: url("../img/aggregators/mobile-eda-mask.svg");
+ }
+
+ .courier-services__eda-symbol {
+ mask-image: url("../img/aggregators/mobile-eda-symbol-mask.svg");
+ }
+
+ .courier-services__lavka-clip {
+ mask-image: url("../img/aggregators/mobile-lavka-mask.svg");
+ }
+}
+
+@media (max-width: 359px) {
+ .courier-services__topics {
+ gap: 6px;
+ }
+
+ .courier-services__topic {
+ font-size: 12px;
+ }
+
+ .courier-services__card {
+ padding-right: 12px;
+ padding-left: 12px;
+ }
+}
diff --git a/wp-content/themes/hantico/assets/scss/_delivery-orders.scss b/wp-content/themes/hantico/assets/scss/_delivery-orders.scss
new file mode 100644
index 0000000..726dd4c
--- /dev/null
+++ b/wp-content/themes/hantico/assets/scss/_delivery-orders.scss
@@ -0,0 +1,428 @@
+.delivery-orders {
+ --orders-heading: #172d38;
+ --orders-text: #595757;
+ --orders-accent: #ae001b;
+ box-sizing: border-box;
+ width: min(1280px, calc(100% - 40px));
+ margin: var(--space-section) auto 0;
+ color: var(--orders-heading);
+ font-family: "Onest", sans-serif;
+ -webkit-font-smoothing: antialiased;
+}
+
+.delivery-orders *,
+.delivery-orders *::before,
+.delivery-orders *::after {
+ box-sizing: border-box;
+}
+
+.delivery-orders__header {
+ display: flex;
+ flex-direction: column;
+ gap: 40px;
+ margin-bottom: 40px;
+ text-align: center;
+}
+
+.delivery-orders__title {
+ margin: 0;
+ font-size: 56px;
+ font-weight: 700;
+ line-height: 62px;
+ letter-spacing: -0.56px;
+}
+
+.delivery-orders__description {
+ margin: 0;
+ color: var(--orders-text);
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 30px;
+ letter-spacing: -0.2px;
+}
+
+.delivery-orders__grid {
+ display: grid;
+ grid-template-columns: repeat(3, minmax(0, 1fr));
+ grid-template-rows: 396px 285px;
+ grid-auto-rows: 396px;
+ gap: 20px;
+ margin: 0;
+ padding: 0;
+ list-style: none;
+}
+
+.delivery-orders__wide {
+ grid-column: 1 / -1;
+}
+
+.delivery-orders__card {
+ --blur-start: 229px;
+ --blur-end: 462px;
+ position: relative;
+ isolation: isolate;
+ display: block;
+ overflow: hidden;
+ width: 100%;
+ height: 100%;
+ padding: 0;
+ border: 0;
+ border-radius: 40px;
+ background: linear-gradient(#f5f5f9, #f9f9f9);
+ color: #fff;
+ font: inherit;
+ text-align: left;
+ cursor: pointer;
+ -webkit-tap-highlight-color: transparent;
+}
+
+.delivery-orders__card::after {
+ position: absolute;
+ z-index: 1;
+ inset: 0;
+ background: rgb(174 0 27 / 50%);
+ content: "";
+ opacity: 0;
+ transition: opacity 180ms ease;
+ pointer-events: none;
+}
+
+.delivery-orders__image {
+ position: absolute;
+ display: block;
+ max-width: none;
+ object-fit: cover;
+ pointer-events: none;
+}
+
+.delivery-orders__image--cover {
+ inset: 0;
+ width: 100%;
+ height: 100%;
+}
+
+.delivery-orders__card:not(a) {
+ cursor: default;
+}
+
+.delivery-orders__image--food {
+ bottom: 0;
+ left: 0;
+ width: 537px;
+ height: 732px;
+}
+
+.delivery-orders__image--groceries-backdrop {
+ bottom: 0;
+ left: 0;
+ width: 414px;
+ height: 421px;
+}
+
+.delivery-orders__image--groceries {
+ top: 0;
+ left: -118px;
+ width: 710px;
+ height: 396px;
+}
+
+.delivery-orders__image--parcels {
+ bottom: 0;
+ left: -403px;
+ width: 1409px;
+ height: 786px;
+}
+
+.delivery-orders__image--documents {
+ bottom: -229px;
+ left: -11px;
+ width: 1296px;
+ height: 723px;
+}
+
+.delivery-orders__blur,
+.delivery-orders__blur > span {
+ position: absolute;
+ inset: 0;
+ pointer-events: none;
+}
+
+.delivery-orders__blur > span {
+ --blur-step: calc((var(--blur-end) - var(--blur-start)) / 4);
+ -webkit-backdrop-filter: blur(var(--blur-radius));
+ backdrop-filter: blur(var(--blur-radius));
+ mask-image: linear-gradient(
+ transparent calc(var(--blur-start) + var(--blur-step) * var(--blur-index)),
+ #000 calc(var(--blur-start) + var(--blur-step) * (var(--blur-index) + 1))
+ );
+}
+
+.delivery-orders__blur > span:nth-child(1) {
+ --blur-index: 0;
+ --blur-radius: 1.8px;
+}
+
+.delivery-orders__blur > span:nth-child(2) {
+ --blur-index: 1;
+ --blur-radius: 3.6px;
+}
+
+.delivery-orders__blur > span:nth-child(3) {
+ --blur-index: 2;
+ --blur-radius: 5.4px;
+}
+
+.delivery-orders__blur > span:nth-child(4) {
+ --blur-index: 3;
+ --blur-radius: 7.2px;
+}
+
+.delivery-orders__card--groceries {
+ --blur-start: 233px;
+ --blur-end: 423px;
+}
+
+.delivery-orders__card--parcels {
+ --blur-start: 236px;
+ --blur-end: 428px;
+}
+
+.delivery-orders__card--documents {
+ --blur-start: 151px;
+ --blur-end: 364px;
+}
+
+.delivery-orders__shade {
+ position: absolute;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ height: 163px;
+ background: linear-gradient(transparent, #000);
+ opacity: 0.9;
+ pointer-events: none;
+}
+
+.delivery-orders__card--groceries .delivery-orders__shade {
+ height: 187px;
+ opacity: 0.8;
+}
+
+.delivery-orders__card--documents .delivery-orders__shade {
+ height: 138px;
+}
+
+.delivery-orders__copy {
+ position: absolute;
+ z-index: 2;
+ right: 95px;
+ bottom: 32px;
+ left: 40px;
+ display: flex;
+ flex-direction: column;
+ gap: 16px;
+ pointer-events: none;
+}
+
+.delivery-orders__card-title {
+ font-size: 26px;
+ font-weight: 600;
+ line-height: 29px;
+ letter-spacing: -0.26px;
+}
+
+.delivery-orders__card-description {
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 28px;
+ letter-spacing: -0.2px;
+}
+
+.delivery-orders__card--groceries .delivery-orders__copy {
+ right: 40px;
+}
+
+.delivery-orders__card--groceries .delivery-orders__card-description {
+ width: 213px;
+}
+
+.delivery-orders__card--parcels .delivery-orders__copy {
+ right: 50px;
+}
+
+.delivery-orders__card--documents .delivery-orders__copy {
+ right: 103px;
+}
+
+.delivery-orders__arrow {
+ position: absolute;
+ z-index: 2;
+ top: 32px;
+ right: 32px;
+ width: 51px;
+ height: 51px;
+ pointer-events: none;
+}
+
+.delivery-orders__card--documents .delivery-orders__arrow {
+ right: 33px;
+}
+
+.delivery-orders__arrow {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ border-radius: 50%;
+ background: #fff;
+ color: var(--orders-accent);
+ transition: color 180ms ease, background-color 180ms ease;
+}
+
+.delivery-orders__arrow svg {
+ width: 13px;
+ height: 13px;
+}
+
+.delivery-orders__card:is(:hover, :focus-visible, :active)::after {
+ opacity: 1;
+}
+
+.delivery-orders__card:is(:hover, :focus-visible, :active) .delivery-orders__arrow {
+ background: var(--orders-accent);
+ color: #fff;
+}
+
+.delivery-orders__card:focus-visible {
+ outline: 3px solid var(--orders-accent);
+ outline-offset: 5px;
+}
+
+@media (max-width: 1023.98px) {
+ .delivery-orders__title {
+ font-size: 40px;
+ line-height: 1.1;
+ }
+ .delivery-orders__slider {
+ overflow: visible;
+ }
+ .delivery-orders__grid {
+ display: flex;
+ gap: 0;
+ grid-template-rows: none;
+ }
+ .delivery-orders__grid > li {
+ flex-shrink: 0;
+ width: 340px;
+ height: 300px;
+ }
+ .delivery-orders__card {
+ --blur-start: 120px;
+ --blur-end: 300px;
+ border-radius: 24px;
+ }
+ .delivery-orders__card-title {
+ font-size: 22px;
+ line-height: 1.15;
+ overflow-wrap: anywhere;
+ }
+ .delivery-orders__card-description {
+ font-size: 16px;
+ line-height: 1.4;
+ overflow-wrap: anywhere;
+ }
+ .delivery-orders__grid.is-grid {
+ gap: 20px;
+ overflow-x: auto;
+ scroll-snap-type: x mandatory;
+ }
+ .delivery-orders__grid.is-grid > li {
+ scroll-snap-align: start;
+ }
+ .delivery-orders__wide {
+ grid-column: auto;
+ }
+ .delivery-orders__copy,
+ .delivery-orders__card--groceries .delivery-orders__copy,
+ .delivery-orders__card--parcels .delivery-orders__copy,
+ .delivery-orders__card--documents .delivery-orders__copy {
+ left: 24px;
+ right: 24px;
+ bottom: 24px;
+ }
+}
+
+@media (max-width: 575.98px) {
+ .delivery-orders {
+ width: calc(100% - 40px);
+ }
+ .delivery-orders__header {
+ gap: 14px;
+ margin-bottom: 32px;
+ }
+ .delivery-orders__title {
+ font-size: 24px;
+ line-height: 1.1;
+ letter-spacing: -0.24px;
+ }
+ .delivery-orders__description {
+ font-size: 14px;
+ line-height: 1.5;
+ letter-spacing: -0.14px;
+ }
+ .delivery-orders__slider {
+ overflow: visible;
+ }
+ .delivery-orders__grid {
+ display: flex;
+ gap: 0;
+ }
+ .delivery-orders__grid > li {
+ flex-shrink: 0;
+ width: 278px;
+ height: 218px;
+ }
+ .delivery-orders__card {
+ --blur-start: 90px;
+ --blur-end: 218px;
+ border-radius: 20px;
+ }
+ .delivery-orders__grid.is-grid {
+ gap: 10px;
+ }
+ .delivery-orders__copy {
+ gap: 8px;
+ }
+ .delivery-orders__card-title {
+ font-size: 16px;
+ line-height: 1.1;
+ letter-spacing: -0.16px;
+ }
+ .delivery-orders__card-description {
+ font-size: 14px;
+ line-height: 1.4;
+ letter-spacing: -0.14px;
+ }
+ .delivery-orders__shade {
+ height: 126px;
+ }
+ .delivery-orders__arrow,
+ .delivery-orders__card--documents .delivery-orders__arrow {
+ top: 12px;
+ right: 12px;
+ width: 24px;
+ height: 24px;
+ background: var(--orders-accent);
+ color: #fff;
+ }
+ .delivery-orders__arrow svg {
+ width: 7px;
+ height: 7px;
+ }
+}
+
+@media (prefers-reduced-motion: reduce) {
+ .delivery-orders__card::after,
+ .delivery-orders__arrow {
+ transition: none;
+ }
+}
diff --git a/wp-content/themes/hantico/assets/scss/_formats.scss b/wp-content/themes/hantico/assets/scss/_formats.scss
new file mode 100644
index 0000000..b252cd9
--- /dev/null
+++ b/wp-content/themes/hantico/assets/scss/_formats.scss
@@ -0,0 +1,232 @@
+.work-formats {
+ --formats-heading: #172d38;
+ --formats-text: #595757;
+ --formats-border: #ededed;
+ --formats-accent: #ae001b;
+ box-sizing: border-box;
+ display: flex;
+ width: min(1280px, calc(100% - 80px));
+ margin: var(--space-section) auto 0;
+ flex-direction: column;
+ gap: 60px;
+ color: var(--formats-heading);
+ font-family: "Onest", sans-serif;
+ -webkit-font-smoothing: antialiased;
+}
+
+.work-formats *,
+.work-formats *::before,
+.work-formats *::after {
+ box-sizing: border-box;
+}
+
+.work-formats__header {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 40px;
+ text-align: center;
+}
+
+.work-formats__title {
+ width: 964px;
+ max-width: 100%;
+ margin: 0;
+ font-size: 56px;
+ font-weight: 700;
+ line-height: 62px;
+ letter-spacing: -0.56px;
+}
+
+.work-formats__description {
+ width: 100%;
+ margin: 0;
+ color: var(--formats-text);
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 22px;
+ letter-spacing: -0.2px;
+}
+
+.work-formats__groups {
+ display: flex;
+ flex-direction: column;
+ gap: 40px;
+}
+
+.work-formats__group {
+ display: flex;
+ flex-direction: column;
+ gap: 24px;
+}
+
+.work-formats__group-title {
+ margin: 0;
+ font-size: 26px;
+ font-weight: 600;
+ line-height: 29px;
+ letter-spacing: -0.26px;
+ text-align: center;
+}
+
+.work-formats__links {
+ display: flex;
+ flex-wrap: wrap;
+ align-items: flex-start;
+ justify-content: center;
+ gap: 12px;
+ margin: 0;
+ padding: 0;
+ list-style: none;
+}
+
+.work-formats__links > li {
+ max-width: 100%;
+}
+
+.work-formats__link {
+ display: flex;
+ width: auto;
+ max-width: 100%;
+ min-height: 54px;
+ align-items: center;
+ gap: 8px;
+ padding: 16px 16px 16px 24px;
+ border-radius: 100px;
+ box-shadow: inset 0 0 0 1px var(--formats-border);
+ color: inherit;
+ font-size: 18px;
+ font-weight: 600;
+ line-height: 20px;
+ letter-spacing: -0.18px;
+ text-decoration: none;
+ overflow-wrap: anywhere;
+}
+
+.work-formats__link:is(:hover, :focus-visible) {
+ background: #f5f5f9;
+ color: var(--formats-accent);
+}
+
+.work-formats__link:focus-visible {
+ outline: 2px solid var(--formats-accent);
+ outline-offset: 4px;
+}
+
+.work-formats__arrow {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex: 0 0 22px;
+ width: 22px;
+ height: 22px;
+ transition: transform 0.2s ease;
+}
+
+.work-formats__arrow svg {
+ display: block;
+ width: 100%;
+ height: 100%;
+}
+
+.work-formats__link {
+ transition: color 0.2s ease, background-color 0.2s ease;
+}
+
+.work-formats__link:is(:hover, :focus-visible) .work-formats__arrow {
+ transform: translateX(3px);
+}
+
+@media (prefers-reduced-motion: reduce) {
+ .work-formats__link,
+ .work-formats__arrow {
+ transition: none;
+ }
+ .work-formats__link:is(:hover, :focus-visible) .work-formats__arrow {
+ transform: none;
+ }
+}
+
+
+
+@media (max-width: 1199px) {
+ .work-formats__title {
+ font-size: 44px;
+ line-height: 1.1;
+ letter-spacing: -0.01em;
+ }
+}
+
+@media (max-width: 899px) {
+ .work-formats {
+ width: calc(100% - 48px);
+ gap: 40px;
+ }
+
+ .work-formats__header {
+ gap: 24px;
+ }
+
+ .work-formats__title {
+ font-size: 36px;
+ }
+}
+
+@media (max-width: 600px) {
+ .work-formats {
+ width: calc(100% - 40px);
+ gap: 30px;
+ }
+
+ .work-formats__header {
+ gap: 14px;
+ }
+
+ .work-formats__title {
+ font-size: 24px;
+ line-height: 26px;
+ letter-spacing: -0.24px;
+ }
+
+ .work-formats__description {
+ font-size: 14px;
+ line-height: 15px;
+ letter-spacing: -0.14px;
+ }
+
+ .work-formats__groups {
+ gap: 30px;
+ }
+
+ .work-formats__group {
+ gap: 16px;
+ }
+
+ .work-formats__group-title {
+ font-size: 16px;
+ line-height: 18px;
+ letter-spacing: -0.16px;
+ }
+
+ .work-formats__links {
+ gap: 4px;
+ }
+
+ .work-formats__link {
+ min-height: 36px;
+ gap: 4px;
+ padding: 11px 11px 11px 16px;
+ font-size: 13px;
+ line-height: 14px;
+ letter-spacing: -0.13px;
+ }
+
+ .work-formats__arrow {
+ flex-basis: 14px;
+ width: 14px;
+ height: 14px;
+ }
+
+
+
+}
diff --git a/wp-content/themes/hantico/assets/scss/_work-directions.scss b/wp-content/themes/hantico/assets/scss/_work-directions.scss
new file mode 100644
index 0000000..ee587f3
--- /dev/null
+++ b/wp-content/themes/hantico/assets/scss/_work-directions.scss
@@ -0,0 +1,237 @@
+.work-directions {
+ --directions-background: #f5f5f9;
+ --directions-heading: #172d38;
+ --directions-accent: #ae001b;
+ width: 100%;
+ margin: 0 0 40px;
+ color: var(--directions-heading);
+ font-family: "Onest", sans-serif;
+ -webkit-font-smoothing: antialiased;
+}
+
+.work-directions,
+.work-directions *,
+.work-directions *::before,
+.work-directions *::after {
+ box-sizing: border-box;
+}
+
+.work-directions__grid {
+ display: grid;
+ grid-template-columns: minmax(0, 413fr) minmax(0, 414fr) minmax(0, 413fr);
+ gap: 20px;
+ margin: 0;
+ padding: 0;
+ list-style: none;
+}
+
+.work-directions__card {
+ position: relative;
+ isolation: isolate;
+ display: flex;
+ width: 100%;
+ min-width: 0;
+ aspect-ratio: 413 / 290;
+ min-height: 200px;
+ align-items: flex-end;
+ justify-content: center;
+ overflow: hidden;
+ padding: 32px 16px;
+ border-radius: 20px;
+ background: var(--directions-background);
+ color: inherit;
+ text-align: center;
+ text-decoration: none;
+ -webkit-tap-highlight-color: transparent;
+}
+
+.work-directions__card--taxi {
+ aspect-ratio: 414 / 290;
+}
+
+.work-directions__label {
+ position: relative;
+ font-size: 20px;
+ font-weight: 600;
+ line-height: 1.1;
+ letter-spacing: -0.01em;
+}
+
+.work-directions__vehicle {
+ position: absolute;
+ display: block;
+ overflow: hidden;
+ background: var(--directions-background);
+ transform: translateX(-50%);
+ transition: transform 240ms ease;
+ pointer-events: none;
+}
+
+.work-directions__vehicle img {
+ display: block;
+ width: 100%;
+ height: 100%;
+ object-fit: contain;
+ mix-blend-mode: darken;
+}
+
+.work-directions__vehicle--scooter {
+ top: 20%;
+ left: calc(50% + 0.5px);
+ width: 55.205811%;
+ aspect-ratio: 228 / 152;
+}
+
+
+.work-directions__vehicle--taxi {
+ top: 20%;
+ left: calc(50% - 1px);
+ width: 83.091787%;
+ aspect-ratio: 344 / 151;
+}
+
+
+.work-directions__vehicle--van {
+ top: 13.448276%;
+ left: calc(50% - 6.5px);
+ width: 87.651332%;
+ aspect-ratio: 362 / 174;
+}
+
+
+.work-directions__arrow {
+ --arrow-scale: 1;
+ position: absolute;
+ z-index: 1;
+ top: 24px;
+ right: 24px;
+ display: block;
+ width: 51px;
+ height: 51px;
+}
+
+.work-directions__arrow {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ border-radius: 50%;
+ background: #fff;
+ color: var(--directions-accent);
+ transition: color 180ms ease, background-color 180ms ease;
+}
+.work-directions__arrow svg {
+ display: block;
+ width: 13px;
+ height: 13px;
+}
+.work-directions__card:is(:hover, :focus-visible, :active, .is-active) .work-directions__arrow {
+ background: var(--directions-accent);
+ color: #fff;
+}
+.work-directions__card.is-active {
+ box-shadow: inset 0 0 0 1px var(--directions-accent);
+}
+
+@media (hover: hover) {
+ .work-directions__card:hover {
+ box-shadow: inset 0 0 0 1px rgb(174 0 27 / 20%);
+ }
+
+
+ .work-directions__card:hover .work-directions__vehicle {
+ transform: translateX(-50%) scale(1.04);
+ }
+}
+
+.work-directions__card:active {
+ box-shadow: inset 0 0 0 1px rgb(174 0 27 / 20%);
+}
+
+.work-directions__card:focus-visible {
+ outline: 2px solid var(--directions-accent);
+ outline-offset: 4px;
+}
+
+
+.work-directions__card:is(:active, :focus-visible) .work-directions__vehicle {
+ transform: translateX(-50%) scale(1.04);
+}
+
+@media (min-width: 768px) and (max-width: 1199px) {
+
+ .work-directions__grid {
+ gap: 16px;
+ }
+
+ .work-directions__card {
+ padding-bottom: 24px;
+ }
+
+ .work-directions__label {
+ font-size: 18px;
+ }
+
+ .work-directions__arrow {
+ top: 16px;
+ right: 16px;
+ }
+}
+
+@media (prefers-reduced-motion: reduce) {
+ .work-directions__vehicle,
+ .work-directions__arrow {
+ transition: none;
+ }
+}
+
+@media (max-width: 767.98px) {
+
+ .work-directions__grid {
+ grid-template-columns: minmax(0, 163fr) minmax(0, 162fr);
+ gap: 10px;
+ }
+
+ .work-directions__cargo {
+ grid-column: 1 / -1;
+ }
+
+ .work-directions__card {
+ height: 155px;
+ min-height: 0;
+ aspect-ratio: auto;
+ padding: 16px;
+ }
+
+ .work-directions__label {
+ font-size: 14px;
+ }
+
+ .work-directions__vehicle--scooter {
+ top: 36px;
+ left: calc(50% + 0.5px);
+ width: min(106px, 70%);
+ aspect-ratio: 106 / 70;
+ }
+
+ .work-directions__vehicle--taxi {
+ top: 39px;
+ left: 50%;
+ width: min(138px, 85.185185%);
+ aspect-ratio: 138 / 61;
+ }
+
+ .work-directions__vehicle--van {
+ top: 22px;
+ left: 50%;
+ width: min(181px, 80%);
+ aspect-ratio: 181 / 87;
+ }
+
+ .work-directions__arrow {
+ --arrow-scale: 0.5882352941;
+ top: 12px;
+ right: 12px;
+ width: 30px;
+ height: 30px;
+ }
+}
diff --git a/wp-content/themes/hantico/assets/scss/style.scss b/wp-content/themes/hantico/assets/scss/style.scss
index a3ee788..2916046 100644
--- a/wp-content/themes/hantico/assets/scss/style.scss
+++ b/wp-content/themes/hantico/assets/scss/style.scss
@@ -1,5 +1,9 @@
@use "mixins" as *;
@use "config" as *;
+@use "courier-services";
+@use "delivery-orders";
+@use "formats";
+@use "work-directions";
*,
*::before,
@@ -4232,6 +4236,30 @@ h4 {
}
}
+
+.getapp--custom-title .getapp-body__left {
+ min-width: 0;
+}
+.getapp--custom-title .getapp-title {
+ font-size: clamp(24px, 11.5691px + 3.3149vw, 54px);
+ font-weight: 700;
+ line-height: 1.1;
+ letter-spacing: -0.01em;
+ overflow-wrap: anywhere;
+}
+.getapp-title__ending {
+ display: block;
+}
+@media (min-width: 1280px) {
+ .getapp--custom-title .getapp-title {
+ width: 731px;
+ max-width: none;
+ }
+ .getapp--custom-title .getapp-stores {
+ margin-top: 55px;
+ }
+}
+
@media (hover: hover) {
.blog-item__img-link:hover img {
transform: scale(1.15);
diff --git a/wp-content/themes/hantico/functions.php b/wp-content/themes/hantico/functions.php
index 8399332..5f860de 100644
--- a/wp-content/themes/hantico/functions.php
+++ b/wp-content/themes/hantico/functions.php
@@ -359,3 +359,5 @@ require_once get_template_directory() . '/inc/acf.php';
require_once get_template_directory() . '/inc/ajax.php';
require_once get_template_directory() . '/inc/menu.php';
require_once get_template_directory() . '/inc/breadcrumbs.php';
+require_once get_template_directory() . '/inc/article-urls.php';
+require_once get_template_directory() . '/inc/schema.php';
diff --git a/wp-content/themes/hantico/inc/acf.php b/wp-content/themes/hantico/inc/acf.php
index 72d0470..7002642 100644
--- a/wp-content/themes/hantico/inc/acf.php
+++ b/wp-content/themes/hantico/inc/acf.php
@@ -3,6 +3,14 @@
// Отключить табы в редакторе групп полей ACF
add_filter('acf/field_group/disable_field_settings_tabs', '__return_true');
+// Просмотры изменяются автоматически, поле в админке доступно только для просмотра.
+add_filter('acf/prepare_field/name=viewers', function ($field) {
+ if (is_admin()) {
+ $field['disabled'] = 1;
+ }
+ return $field;
+});
+
// Страница опций ACF
if (function_exists('acf_add_options_page')) {
diff --git a/wp-content/themes/hantico/inc/ajax.php b/wp-content/themes/hantico/inc/ajax.php
index 780123c..90c062d 100644
--- a/wp-content/themes/hantico/inc/ajax.php
+++ b/wp-content/themes/hantico/inc/ajax.php
@@ -12,15 +12,11 @@ function theme_filter_articles() {
'orderby' => 'date',
'order' => 'DESC',
];
- if (!empty($category)) {
- $args['tax_query'] = [
- [
- 'taxonomy' => 'article_category',
- 'field' => 'slug',
- 'terms' => $category,
- ]
- ];
+ $section = isset($_POST['section']) && is_string($_POST['section']) ? sanitize_key(wp_unslash($_POST['section'])) : '';
+ if ($section !== '' && !in_array($section, ['general', 'taxi', 'courier', 'cargo'], true)) {
+ wp_send_json_error(['message' => 'Неизвестный раздел'], 400);
}
+ $args['tax_query'] = hantico_blog_tax_query($section, $category);
$query = new WP_Query($args);
ob_start();
if ($query->have_posts()) {
@@ -30,6 +26,7 @@ function theme_filter_articles() {
}
wp_reset_postdata();
}
+ if (!$query->have_posts()) echo '
Статьи не найдены.
';
$html = ob_get_clean();
wp_send_json_success([
'html' => $html,
diff --git a/wp-content/themes/hantico/inc/article-urls.php b/wp-content/themes/hantico/inc/article-urls.php
new file mode 100644
index 0000000..f2e1653
--- /dev/null
+++ b/wp-content/themes/hantico/inc/article-urls.php
@@ -0,0 +1,94 @@
+ 'blog-taxi',
+ 'courier' => 'blog-courier',
+ 'cargo' => 'blog-cargo',
+ ];
+ $terms = get_the_terms($post_id, 'article_chapter');
+ if (!$terms || is_wp_error($terms)) {
+ return 'blog';
+ }
+ $slugs = wp_list_pluck($terms, 'slug');
+ foreach ($sections as $slug => $base) {
+ if (in_array($slug, $slugs, true)) {
+ return $base;
+ }
+ }
+ return 'blog';
+}
+
+add_filter('post_type_link', function ($url, $post, $leavename, $sample) {
+ if ($post->post_type !== 'article' || (!$post->post_name && !$leavename)) {
+ return $url;
+ }
+ $slug = $leavename ? '%article%' : $post->post_name;
+ return home_url(user_trailingslashit('/' . hantico_article_url_base($post->ID) . '/' . $slug, 'single'));
+}, 10, 4);
+
+add_action('init', function () {
+ add_rewrite_rule('^blog-(taxi|courier|cargo)/?$', 'index.php?pagename=blog&article_section_filter=$matches[1]', 'top');
+ // /blog/ продолжает обслуживаться существующими правилами типа article.
+ add_rewrite_rule(
+ '^(?:blog-taxi|blog-courier|blog-cargo)/([^/]+)/?$',
+ 'index.php?post_type=article&name=$matches[1]',
+ 'top'
+ );
+});
+
+add_filter('query_vars', function ($vars) {
+ $vars[] = 'article_section_filter';
+ return $vars;
+});
+
+function hantico_blog_section() {
+ $section = get_query_var('article_section_filter', '');
+ if (!$section && isset($_GET['section']) && is_string($_GET['section'])) {
+ $section = sanitize_key(wp_unslash($_GET['section']));
+ }
+ return in_array($section, ['general', 'taxi', 'courier', 'cargo'], true) ? $section : '';
+}
+
+function hantico_blog_tax_query($section, $category = '') {
+ $query = ['relation' => 'AND'];
+ if ($section !== '') {
+ $query[] = ['taxonomy' => 'article_chapter', 'field' => 'slug', 'terms' => $section];
+ }
+ if ($category !== '') {
+ $query[] = ['taxonomy' => 'article_category', 'field' => 'slug', 'terms' => $category];
+ }
+ return count($query) > 1 ? $query : [];
+}
+
+add_filter('redirect_canonical', function ($redirect) {
+ return is_page('blog') && get_query_var('article_section_filter') ? false : $redirect;
+});
+
+// Старый адрес и адрес с чужим разделом ведут на текущую ссылку статьи.
+add_action('template_redirect', function () {
+ if (!is_singular('article') || is_preview() || is_feed() || is_embed()
+ || !in_array($_SERVER['REQUEST_METHOD'] ?? '', ['GET', 'HEAD'], true)) {
+ return;
+ }
+ $request_path = wp_parse_url(wp_unslash($_SERVER['REQUEST_URI'] ?? ''), PHP_URL_PATH);
+ $home_path = wp_parse_url(home_url('/'), PHP_URL_PATH);
+ $relative_path = substr((string) $request_path, strlen((string) $home_path));
+ if (!preg_match('~^blog(?:-taxi|-courier|-cargo)?/[^/]+/?$~', $relative_path)) {
+ return;
+ }
+ $url = get_permalink(get_queried_object_id());
+ $canonical_path = wp_parse_url($url, PHP_URL_PATH);
+ if (rawurldecode((string) $request_path) === rawurldecode((string) $canonical_path)) {
+ return;
+ }
+ // Сохраняем параметры, например UTM-метки.
+ $query = wp_parse_url(wp_unslash($_SERVER['REQUEST_URI'] ?? ''), PHP_URL_QUERY);
+ if ($query) {
+ $url .= '?' . $query;
+ }
+ if (wp_safe_redirect($url, 301)) {
+ exit;
+ }
+}, 5);
diff --git a/wp-content/themes/hantico/inc/schema.php b/wp-content/themes/hantico/inc/schema.php
new file mode 100644
index 0000000..0b7ba55
--- /dev/null
+++ b/wp-content/themes/hantico/inc/schema.php
@@ -0,0 +1,233 @@
+ 'article',
+ 'posts_per_page' => $featured ? 6 : 12,
+ 'orderby' => 'date',
+ 'order' => 'DESC',
+ 'tax_query' => hantico_blog_tax_query(hantico_blog_section(), $category),
+ ]);
+ }
+ return $queries[$key];
+}
+
+function hantico_schema_url() {
+ if (is_singular('article')) {
+ return get_permalink(get_queried_object_id());
+ }
+ $section = hantico_blog_section();
+ $url = home_url(user_trailingslashit('/' . ($section && $section !== 'general' ? 'blog-' . $section : 'blog')));
+ return $section === 'general' ? add_query_arg('section', 'general', $url) : $url;
+}
+
+function hantico_schema_text($text) {
+ return trim(html_entity_decode(wp_strip_all_tags((string) $text), ENT_QUOTES | ENT_HTML5, 'UTF-8'));
+}
+
+function hantico_schema_section_name($section) {
+ $term = $section ? get_term_by('slug', $section, 'article_chapter') : false;
+ return $term && !is_wp_error($term) ? $term->name : get_the_title(get_queried_object_id());
+}
+
+// Yoast хранит прежний permalink в индексе: корректируем только вывод,
+// не меняя настройки плагина или сохранённые SEO-поля.
+add_filter('wpseo_canonical', function ($url) {
+ return hantico_schema_enabled() ? hantico_schema_url() : $url;
+});
+add_filter('wpseo_opengraph_url', function ($url) {
+ return hantico_schema_enabled() ? hantico_schema_url() : $url;
+});
+
+function hantico_schema_has_type($node, $types) {
+ return (bool) array_intersect((array) ($node['@type'] ?? []), (array) $types);
+}
+
+function hantico_schema_graph($graph) {
+ if (!hantico_schema_enabled()) {
+ return $graph;
+ }
+ $url = hantico_schema_url();
+ $post_id = get_queried_object_id();
+ $is_blog = hantico_schema_is_blog();
+ $page_index = null;
+ // Обновляем также связанные ID изображений, крошек и действий Yoast.
+ foreach ($graph as $node) {
+ if (hantico_schema_has_type($node, ['WebPage', 'CollectionPage', 'ItemPage']) && !empty($node['url'])) {
+ $old_url = $node['url'];
+ array_walk_recursive($graph, function (&$value) use ($old_url, $url) {
+ if (is_string($value) && ($value === $old_url || strpos($value, $old_url . '#') === 0)) {
+ $value = $url . substr($value, strlen($old_url));
+ }
+ });
+ break;
+ }
+ }
+ $website_id = home_url('/#website');
+ $organization_id = home_url('/#organization');
+ $organization_found = false;
+ foreach ($graph as $index => $node) {
+ if (hantico_schema_has_type($node, ['WebPage', 'CollectionPage', 'ItemPage'])) {
+ $page_index = $index;
+ }
+ if (hantico_schema_has_type($node, 'WebSite')) {
+ $website_id = $node['@id'];
+ }
+ if (hantico_schema_has_type($node, 'Organization')) {
+ $organization_id = $node['@id'];
+ $organization_found = true;
+ }
+ }
+ if (!$organization_found) {
+ $graph[] = [
+ '@type' => 'Organization', '@id' => $organization_id,
+ 'name' => 'Hantico', 'url' => home_url('/'),
+ 'logo' => ['@type' => 'ImageObject', 'url' => get_theme_file_uri('assets/img/icons/logo.svg')],
+ ];
+ }
+ $website_found = false;
+ foreach ($graph as &$node) {
+ if (hantico_schema_has_type($node, 'WebSite')) {
+ $node['publisher'] = ['@id' => $organization_id];
+ $website_found = true;
+ }
+ }
+ unset($node);
+ if (!$website_found) {
+ $graph[] = ['@type' => 'WebSite', '@id' => $website_id, 'url' => home_url('/'),
+ 'name' => get_bloginfo('name'), 'publisher' => ['@id' => $organization_id]];
+ }
+ if ($page_index === null) {
+ $graph[] = ['@type' => 'WebPage', '@id' => $url];
+ $page_index = array_key_last($graph);
+ }
+ $page = &$graph[$page_index];
+ $page['url'] = $url;
+ $page['isPartOf'] = ['@id' => $website_id];
+ $page['inLanguage'] = get_bloginfo('language');
+ $page['breadcrumb'] = ['@id' => $url . '#breadcrumb'];
+ $description = $page['description'] ?? '';
+ if ($is_blog) {
+ $section = hantico_blog_section();
+ $page['@type'] = 'CollectionPage';
+ $page['name'] = hantico_schema_text($section ? hantico_schema_section_name($section) : (get_field('blog_title', $post_id) ?: get_the_title($post_id)));
+ $term = $section ? get_term_by('slug', $section, 'article_chapter') : false;
+ $description = $term && !is_wp_error($term) && $term->description
+ ? $term->description : ($description ?: get_field('blog_descr', $post_id));
+ // Два списка соответствуют двум реальным блокам, без повторных запросов
+ // и без включения статей из следующих AJAX-порций.
+ $page['mainEntity'] = [];
+ foreach ([true, false] as $featured) {
+ $list_id = $url . ($featured ? '#featured-articles' : '#articles');
+ $items = [];
+ foreach (hantico_blog_query($featured)->posts as $post) {
+ $items[] = ['@type' => 'ListItem', 'position' => count($items) + 1,
+ 'url' => get_permalink($post), 'name' => hantico_schema_text(get_the_title($post))];
+ }
+ $graph[] = ['@type' => 'ItemList', '@id' => $list_id,
+ 'numberOfItems' => count($items), 'itemListElement' => $items];
+ $page['mainEntity'][] = ['@id' => $list_id];
+ }
+ $crumbs = [['name' => 'Главная', 'item' => home_url('/')], ['name' => $page['name'], 'item' => $url]];
+ } else {
+ $description = $description ?: (get_field('brief_description', $post_id) ?: get_field('article_descr', $post_id));
+ $article = [
+ '@type' => 'Article', '@id' => $url . '#article', 'url' => $url,
+ 'headline' => hantico_schema_text(get_the_title($post_id)),
+ 'datePublished' => get_post_time('c', true, $post_id),
+ 'dateModified' => get_post_modified_time('c', true, $post_id),
+ 'publisher' => ['@id' => $organization_id],
+ 'mainEntityOfPage' => ['@id' => $page['@id']],
+ 'inLanguage' => get_bloginfo('language'),
+ ];
+ $image = get_the_post_thumbnail_url($post_id, 'full');
+ if ($image) {
+ $article['image'] = $image;
+ }
+ $article['author'] = [
+ '@type' => 'Organization',
+ '@id' => home_url('/about/#editorial'),
+ 'name' => 'Редакция Hantico',
+ 'url' => home_url('/about/'),
+ ];
+ if ($description) {
+ $article['description'] = hantico_schema_text($description);
+ }
+ $article_index = null;
+ foreach ($graph as $index => $node) {
+ if (hantico_schema_has_type($node, ['Article', 'BlogPosting', 'NewsArticle'])) {
+ $article_index = $index;
+ $article['@id'] = $node['@id'];
+ break;
+ }
+ }
+ if ($article_index === null) {
+ $graph[] = $article;
+ } else {
+ $graph[$article_index] = array_merge($graph[$article_index], $article);
+ }
+ $page['mainEntity'] = ['@id' => $article['@id']];
+ $base = hantico_article_url_base($post_id);
+ $section = $base === 'blog' ? '' : substr($base, 5);
+ $blog_page = get_page_by_path('blog');
+ $crumbs = [
+ ['name' => 'Главная', 'item' => home_url('/')],
+ ['name' => $section ? hantico_schema_section_name($section) : ($blog_page ? get_the_title($blog_page) : 'Блог'),
+ 'item' => home_url(user_trailingslashit('/' . $base))],
+ ['name' => $article['headline'], 'item' => $url],
+ ];
+ }
+ if ($description) {
+ $page['description'] = hantico_schema_text($description);
+ }
+ unset($page);
+ $breadcrumb = ['@type' => 'BreadcrumbList', '@id' => $url . '#breadcrumb', 'itemListElement' => []];
+ foreach ($crumbs as $crumb) {
+ $breadcrumb['itemListElement'][] = array_merge(['@type' => 'ListItem', 'position' => count($breadcrumb['itemListElement']) + 1], $crumb);
+ }
+ $breadcrumb_index = null;
+ foreach ($graph as $index => $node) {
+ if (hantico_schema_has_type($node, 'BreadcrumbList')) {
+ $breadcrumb_index = $index;
+ break;
+ }
+ }
+ if ($breadcrumb_index === null) {
+ $graph[] = $breadcrumb;
+ } else {
+ $graph[$breadcrumb_index] = $breadcrumb;
+ }
+ return $graph;
+}
+
+// Yoast выводит граф в wp_head и безопасно кодирует JSON самостоятельно.
+add_filter('wpseo_schema_graph', 'hantico_schema_graph', 20);
+
+// Резервный вывод, если Yoast деактивирован. При активном плагине второй
+// script не создаётся, даже если его разметка отключена настройкой.
+add_action('wp_head', function () {
+ if (defined('WPSEO_VERSION') || !hantico_schema_enabled()) {
+ return;
+ }
+ $json = wp_json_encode(['@context' => 'https://schema.org', '@graph' => hantico_schema_graph([])],
+ JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX_APOS | JSON_HEX_QUOT | JSON_UNESCAPED_UNICODE);
+ if ($json) {
+ echo '' . "\n";
+ }
+}, 30);
diff --git a/wp-content/themes/hantico/single-article.php b/wp-content/themes/hantico/single-article.php
index 877ca3b..5d75153 100644
--- a/wp-content/themes/hantico/single-article.php
+++ b/wp-content/themes/hantico/single-article.php
@@ -2,47 +2,139 @@
-
-
]*>.*?\1>@si', ' ', $reading_text);
+ $reading_text = preg_replace('/<[^>]*>/', ' ', $reading_text);
+ $reading_text = html_entity_decode(wp_strip_all_tags($reading_text), ENT_QUOTES | ENT_HTML5, 'UTF-8');
+ $word_count = preg_match_all("/[\p{L}\p{N}]+(?:[’'\x{002D}][\p{L}\p{N}]+)*/u", $reading_text);
+ $reading_minutes = $word_count ? max(1, (int) ceil($word_count / 200)) : 0;
+ $generated = generate_toc($article_content, 'article-content');
$content = $generated['content'];
$toc_items = $generated['toc_items'];
+ $footer_socials = get_field('socials', 'option');
+ foreach ($article_blocks as $block_index => &$block) {
+ if (($block['acf_fc_layout'] ?? '') !== 'text') {
+ continue;
+ }
+ $generated = generate_toc($block['content'] ?? '', 'article-block-' . ($block_index + 1));
+ $block['content'] = $generated['content'];
+ $toc_items = array_merge($toc_items, $generated['toc_items']);
+ }
+ unset($block);
+ if ($article_content || $article_blocks) :
?>
-
-
-
-
-
+
+
+
+
+
+
+ 'article-intro__image', 'fetchpriority' => 'high', 'loading' => 'eager']); ?>
+
+
+
+
+
+
+
+
+
+
Время чтения мин
+
+
+
+
+
+
+
+
+ Материал подготовлен редакцией Hantico
+
+
-
+
+
+
+ $block,
+ ]
+ );
+ }
+ }
+ }
+ ?>
-
-
+
+
+
+
+
+
+ Работайте проще и зарабатывайте больше!
+
+
+
+ Лайфхаки, полезные инструкции, изменения в правилах и важные новости для водителей и курьеров — в каналах Hantico.
+
+
+
+
+ Подписаться
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
+
+
diff --git a/wp-content/themes/hantico/single-courier.php b/wp-content/themes/hantico/single-courier.php
index 3934748..e27439b 100644
--- a/wp-content/themes/hantico/single-courier.php
+++ b/wp-content/themes/hantico/single-courier.php
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/wp-content/themes/hantico/single-driver.php b/wp-content/themes/hantico/single-driver.php
index 216063e..e27439b 100644
--- a/wp-content/themes/hantico/single-driver.php
+++ b/wp-content/themes/hantico/single-driver.php
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/wp-content/themes/hantico/template-parts/app-steps.php b/wp-content/themes/hantico/template-parts/app-steps.php
new file mode 100644
index 0000000..b7419d5
--- /dev/null
+++ b/wp-content/themes/hantico/template-parts/app-steps.php
@@ -0,0 +1,130 @@
+
+
+
+
Начать работать — просто
+
+
+
+
+ 01
+
+
+
+
+ Скачайте приложение
+ в App Store или Google Play
+
+
+ Установите Hantico на смартфон
+
+
+
+
+
+
+
+ Наведите камеру
+ смартфона на QR код
+ чтобы скачать приложение
+
+
+
+
+
+
+
+
+
+
+ 02
+
+
+
+
+ Зарегистрируйтесь
+
+
+ Создайте аккаунт и заполните
+ необходимые данные
+
+
+
+
+
+
+
+
+
+ 03
+
+
+
+
+ Выберите подходящий
+ формат работы
+
+
+ Найдите доступные варианты и условия,
+ которые подходят именно вам
+
+
+
+
+
+
+
+
+
+ 04
+
+
+
+
+ Начинайте работать
+
+
+ Переходите к заказам и используйте
+ Hantico в работе
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/wp-content/themes/hantico/template-parts/article-blocks/attention_blocks.php b/wp-content/themes/hantico/template-parts/article-blocks/attention_blocks.php
new file mode 100644
index 0000000..08f6bd1
--- /dev/null
+++ b/wp-content/themes/hantico/template-parts/article-blocks/attention_blocks.php
@@ -0,0 +1,25 @@
+ ['class' => 'warning', 'icon' => '
', 'title' => 'Важно!'],
+ 'yellow' => ['class' => 'info', 'icon' => '
', 'title' => 'Полезная информация'],
+ 'green' => ['class' => 'success', 'icon' => '
', 'title' => 'Рекомендация'],
+];
+$variant = $variants[$attention] ?? $variants['red'];
+?>
+
+
+
+
diff --git a/wp-content/themes/hantico/template-parts/article-blocks/block_main.php b/wp-content/themes/hantico/template-parts/article-blocks/block_main.php
new file mode 100644
index 0000000..91c35c6
--- /dev/null
+++ b/wp-content/themes/hantico/template-parts/article-blocks/block_main.php
@@ -0,0 +1,14 @@
+
+
+
+
+
diff --git a/wp-content/themes/hantico/template-parts/article-blocks/cta_1.php b/wp-content/themes/hantico/template-parts/article-blocks/cta_1.php
new file mode 100644
index 0000000..e1ace1e
--- /dev/null
+++ b/wp-content/themes/hantico/template-parts/article-blocks/cta_1.php
@@ -0,0 +1,29 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/wp-content/themes/hantico/template-parts/article-blocks/cta_2.php b/wp-content/themes/hantico/template-parts/article-blocks/cta_2.php
new file mode 100644
index 0000000..777a881
--- /dev/null
+++ b/wp-content/themes/hantico/template-parts/article-blocks/cta_2.php
@@ -0,0 +1,32 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/wp-content/themes/hantico/template-parts/article-blocks/plaque_authorship.php b/wp-content/themes/hantico/template-parts/article-blocks/plaque_authorship.php
new file mode 100644
index 0000000..c7939e6
--- /dev/null
+++ b/wp-content/themes/hantico/template-parts/article-blocks/plaque_authorship.php
@@ -0,0 +1,17 @@
+
+
+
diff --git a/wp-content/themes/hantico/template-parts/article-blocks/quote.php b/wp-content/themes/hantico/template-parts/article-blocks/quote.php
new file mode 100644
index 0000000..46e22c9
--- /dev/null
+++ b/wp-content/themes/hantico/template-parts/article-blocks/quote.php
@@ -0,0 +1,39 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/wp-content/themes/hantico/template-parts/article-blocks/text.php b/wp-content/themes/hantico/template-parts/article-blocks/text.php
new file mode 100644
index 0000000..fe9439e
--- /dev/null
+++ b/wp-content/themes/hantico/template-parts/article-blocks/text.php
@@ -0,0 +1,9 @@
+
+
+
+
+
\ No newline at end of file
diff --git a/wp-content/themes/hantico/template-parts/audience/hero.php b/wp-content/themes/hantico/template-parts/audience/hero.php
new file mode 100644
index 0000000..227d859
--- /dev/null
+++ b/wp-content/themes/hantico/template-parts/audience/hero.php
@@ -0,0 +1,153 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Наведите камеру на QR-код
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/wp-content/themes/hantico/template-parts/courier-services.php b/wp-content/themes/hantico/template-parts/courier-services.php
new file mode 100644
index 0000000..b274834
--- /dev/null
+++ b/wp-content/themes/hantico/template-parts/courier-services.php
@@ -0,0 +1,65 @@
+
+
aria-labelledby="courier-services-title">
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/wp-content/themes/hantico/template-parts/delivery-orders.php b/wp-content/themes/hantico/template-parts/delivery-orders.php
new file mode 100644
index 0000000..5f57e87
--- /dev/null
+++ b/wp-content/themes/hantico/template-parts/delivery-orders.php
@@ -0,0 +1,59 @@
+
+
aria-labelledby="delivery-orders-title">
+
+
+
+
+
+
+
+
diff --git a/wp-content/themes/hantico/template-parts/formats.php b/wp-content/themes/hantico/template-parts/formats.php
new file mode 100644
index 0000000..14f1501
--- /dev/null
+++ b/wp-content/themes/hantico/template-parts/formats.php
@@ -0,0 +1,54 @@
+
+
diff --git a/wp-content/themes/hantico/template-parts/getapp.php b/wp-content/themes/hantico/template-parts/getapp.php
index 05d5e0f..de5d6cc 100644
--- a/wp-content/themes/hantico/template-parts/getapp.php
+++ b/wp-content/themes/hantico/template-parts/getapp.php
@@ -1,14 +1,17 @@
-
+
-
Скачай и начни уже сегодня
+
Скачай и начни получать заказы на уже завтра! Скачай и начни уже сегодня
+
Hantico есть на всех платформах. Установи приложение, пройди регистрацию — и через 15 минут ты готов к первому заказу
+