diff --git a/wp-content/themes/hantico/assets/css/style.css b/wp-content/themes/hantico/assets/css/style.css
index 0ae78b8..5b6dde1 100644
--- a/wp-content/themes/hantico/assets/css/style.css
+++ b/wp-content/themes/hantico/assets/css/style.css
@@ -7468,3 +7468,382 @@ h4 {
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;
+ }
+}
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/style.scss b/wp-content/themes/hantico/assets/scss/style.scss
index a3ee788..78e51a3 100644
--- a/wp-content/themes/hantico/assets/scss/style.scss
+++ b/wp-content/themes/hantico/assets/scss/style.scss
@@ -1,5 +1,6 @@
@use "mixins" as *;
@use "config" as *;
+@use "courier-services";
*,
*::before,
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..fb9dd38
--- /dev/null
+++ b/wp-content/themes/hantico/template-parts/courier-services.php
@@ -0,0 +1,60 @@
+
+ aria-labelledby="courier-services-title">
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + +
+
+