@import url('https://fonts.googleapis.com/css2?family=Golos+Text:wght@400..900&display=swap');

:root {
    --main: #FBE645;
    --text_001: #000;
    --text_002: #555555;
    --text_003: #A9A9A9;
    --border: #C4C2BC;
    --bg: #E9E8E4;
    --error: #C93C17;
}

img {
    vertical-align: middle;
}

button {
    cursor: pointer;
}

html, body {
    scrollbar-gutter: stable;
    scroll-behavior: smooth;
}

body {
    font-family: "Golos Text", sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 130%;
    background-color: var(--bg);
    color: var(--text_001);
}

/* container */
.container {
    max-width: 1920px;
    margin: 0 auto;
    padding: 0 32px;
}

@media (max-width: 1440px) {
    .container {
        padding: 0 20px;
    }
}

@media (max-width: 768px) {
    .container {
        padding: 0 20px;
    }
}

.container_padding_thin {
    padding: 0 8px;
}

.container_padding_thin-left {
    padding: 0 0 0 8px;
}

.container_full-height {
    height: 100%;
}

/******************************************************************************************/
.follow_black-btn,
.follow_white-btn {
    transition: all .3s;
    justify-content: center;
    border: 1px solid var(--text_001);
}

.follow_white-btn:hover {

    background-color: transparent;
    color: #000;
}

.follow_white-btn:hover path {
    fill: #000;
    stroke: #000;
}

.follow_black-btn:hover {
    background-color: #000;
    color: #fff;
}

.follow_black-btn:hover path {
    fill: #fff;
    stroke: #fff;
}


.to-top {
    position: fixed;
    bottom: 30px;
    right: 50px;
    width: 65px;
    height: 65px;
    font-size: 40px;
    background-color: #fff;
    color: #fff;
    border: 1px solid #C4C2BC;
    border-radius: 50%;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transition: all 0.3s;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.to-top.show {
    opacity: 1;
    pointer-events: auto;
}

.to-top:hover {
    box-shadow:
        0px 0px 0px 10px rgba(0, 0, 0, 0.05),
        0px 0px 0px 20px rgba(0, 0, 0, 0.02);
}


/* #region header */
.header {
    position: relative;
    height: 92px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.header__logo {
    display: block;
}

.header__img {
    height: 100%;
}

.header__menu {
    display: flex;
    z-index: 3;
    gap: 5px;
}

.header__menu-item {
    position: relative;
    color: var(--text_001);
    padding: 8px 30px;
    font-weight: 500;
    font-size: 19px;
    line-height: 140%;
    text-decoration: none;
    border-radius: 40px;
    background-color: transparent;
    transition: all .3s;
}

.header__menu-item:hover {
    background-color: #fff;
}

.header__menu-item-label,
.header__login-label {
    position: absolute;
    display: flex;
    align-items: center;
    top: -20px;
    right: -10px;
    height: 28px;
    padding: 0 16px;
    border-radius: 60px;
    background-color: #fff;
    color: var(--text_001);
    font-weight: 500;
    font-size: 14px;
    line-height: 140%;
}

.header__menu-item_off {
    color: var(--text_003);
    cursor: default;
}

.header__login {
    position: relative;
    background-color: var(--text_003);
    color: #fff;
    border: 1px solid var(--text_003);
    border-radius: 40px;
    display: flex;
    align-items: center;
    height: 44px;
    padding: 0 30px;
    font-weight: 500;
    font-size: 19px;
    line-height: 140%;
    cursor: default;
    z-index: 4;
}

.header__burger {
    width: 32px;
    height: 32px;
    background: url(../img/burger_icon.svg) no-repeat center center;
    border: none;
    display: none;
}

@media (max-width: 1440px) {
    .header {
        height: 72px;
    }

    .header__logo {
        height: 40px;
    }

    .header__menu-item {
        font-size: 16px;
    }

    .header__menu-item-label,
    .header__login-label {
        top: -10px;
        right: -5px;
        height: 22px;
        padding: 0 8px;
        font-size: 12px;
    }

    .header__menu-item_off {
        color: var(--text_003);
        cursor: default;
    }
}

@media (max-width: 768px) {
    .header {
        height: 56px;
    }

    .header__logo {
        height: 31px;
    }

    .header__menu:not(.header__menu_open) {
        display: none;
    }

    .header__menu {
        position: absolute;
        top: 56px;
        left: -20px;
        right: -20px;
        background-color: var(--bg);
        flex-direction: column;
        align-items: center;
        gap: 16px;
        padding: 84px 32px 32px 32px;
        border-bottom-left-radius: 24px;
        border-bottom-right-radius: 24px;
    }

    .header__login {
        position: absolute;
        top: 71px;
        left: 20px;
        right: 20px;
        display: none;
    }

    .header__login_show {
        display: block;
    }

    .header__burger {
        display: block;
    }
	
	.to-top {
    
    width: 35px;
    height: 35px;
  
}
}

/* #endregion header */

/* #region section */
.section {
    margin-bottom: 88px;
}

.section__header {
        padding-bottom: 40px;
    }


.section__title {
    color: var(--text_001);
    font-weight: 500;
    font-size: 72px;
    line-height: 98%;
    margin-bottom: 16px;
}

.section__title span {
    color: var(--text_002);
}

.section__subtitle {
    font-weight: 400;
    font-size: 26px;
    line-height: 140%;
}

.section__footer {
    text-align: center;
    padding-top: 40px;
}

.section__link {
    background-color: var(--text_001);
    color: #fff;
    display: inline-flex;
    align-items: center;
    height: 72px;
    gap: 12px;
    font-weight: 500;
    font-size: 26px;
    line-height: 140%;
    padding: 0 40px;
    text-decoration: none;
    border-radius: 40px;
    white-space: nowrap;
}

@media (max-width: 1440px) {
    .section {
        margin-bottom: 56px;
    }

    .section__header {
        padding-bottom: 40px;
    }

    .section__title {
        font-size: 56px;
    }

    .section__subtitle {
        font-size: 20px;
    }

    .section__link {
        height: 56px;
        font-size: 20px;
    }
}



@media (max-width: 768px) {
    .section {
        margin-bottom: 32px;
    }

    .section__header {
        padding-bottom: 24px;
    }

    .section__title {
        font-size: 32px;
    }

    .section__subtitle {
        font-size: 16px;
    }

    .section__link {
        height: 44px;
        padding: 0 16px;
        font-size: 16px;
    }
}

/* #endregion section */

/* #region slider */
.slider-navigation {
    display: flex;
    align-items: center;
    gap: 8px;
}

.slider__prev,
.slider__next {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    cursor: pointer;
}

.slider__prev {
    background: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10 6L4 12M4 12L10 18M4 12H20" stroke="white" stroke-width="1.5" stroke-linejoin="round"/></svg>') no-repeat center center #000;
}

.slider__next {
    background: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14 6L20 12M20 12L14 18M20 12H4" stroke="white" stroke-width="1.5" stroke-linejoin="round"/></svg>') no-repeat center center #000;
}

@media (max-width: 1440px) {

    .slider__prev,
    .slider__next {
        width: 56px;
        height: 56px;
    }
}

@media (max-width: 768px) {

    .slider__prev,
    .slider__next {
        width: 44px;
        height: 44px;
    }
}

/* #endregion slider */

/* #region footer */
.footer {
    background: url(../img/footer_back.png) no-repeat right 245px bottom 0 #fff;
    padding: 88px 0;
    height: 752px;
}

.footer__wrapper {
    display: flex;
    gap: 8px;
    height: 100%;
}

.footer__first {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}


.contacts__person {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
}

.contacts__photo {
    width: 108px;
    height: 108px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    overflow: hidden;
    flex-shrink: 0;
}

.posts .contacts__photo {
	border-radius:50%;
}

.contacts__photo img {
    object-fit: cover;
    width: 100%;
}

.contacts__title {
    font-weight: 500;
    font-size: 26px;
    line-height: 140%;
    margin-bottom: 4px;
    max-width: 630px;
}

.contacts__name {
    color: var(--text_002);
    font-weight: 500;
    font-size: 16px;
    line-height: 140%;
}

.contacts__socials {
    display: flex;
    align-items: center;
    gap: 8px;
}

.contacts__link-tg {
    background-color: var(--text_001);
    color: #fff;
    display: inline-flex;
    align-items: center;
    height: 72px;
    gap: 12px;
    padding: 0 40px;
    text-decoration: none;
    border-radius: 40px;
    white-space: nowrap;
}

.contacts__link-vk {
    display: inline-flex;
    flex-shrink: 0;
    background: url('data:image/svg+xml,<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.7819 17.8943C5.94864 17.8943 2.05107 13.068 1.88867 5.03711H5.31153C5.42396 10.9316 7.94739 13.4284 9.94614 13.9432V5.03711H13.1691V10.1208C15.1429 9.90197 17.2166 7.58537 17.9162 5.03711H21.1391C20.8755 6.35871 20.3501 7.61006 19.5956 8.71288C18.8411 9.8157 17.8739 10.7463 16.7544 11.4464C18.004 12.0861 19.1077 12.9915 19.9928 14.103C20.8778 15.2144 21.524 16.5066 21.8887 17.8943H18.3409C18.0135 16.689 17.3481 15.6101 16.4281 14.7928C15.5081 13.9754 14.3744 13.456 13.1691 13.2997V17.8943H12.7819Z" fill="white"/></svg>') no-repeat center center var(--text_001);
    width: 72px;
    height: 72px;
    border-radius: 50%;
}

.contacts__link-dzen {
    display: inline-flex;
    flex-shrink: 0;
    background: url('data:image/svg+xml,<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.9286 13.9657C12.3571 15.5871 12.2429 17.6085 12.1071 22.0371C16.2357 22.0371 19.0857 22.0228 20.5571 20.5943C21.9857 19.1228 22 16.1371 22 12.1443C17.5714 12.2871 15.55 12.3943 13.9286 13.9657ZM2 12.1443C2 16.1371 2.01429 19.1228 3.44286 20.5943C4.91429 22.0228 7.76429 22.0371 11.8929 22.0371C11.75 17.6085 11.6429 15.5871 10.0714 13.9657C8.45 12.3943 6.42857 12.28 2 12.1443ZM11.8929 2.03711C7.77143 2.03711 4.91429 2.0514 3.44286 3.47997C2.01429 4.9514 2 7.93711 2 11.93C6.42857 11.7871 8.45 11.68 10.0714 10.1085C11.6429 8.48711 11.7571 6.46568 11.8929 2.03711ZM13.9286 10.1085C12.3571 8.48711 12.2429 6.46568 12.1071 2.03711C16.2357 2.03711 19.0857 2.0514 20.5571 3.47997C21.9857 4.9514 22 7.93711 22 11.93C17.5714 11.7871 15.55 11.68 13.9286 10.1085Z" fill="white"/></svg>') no-repeat center center var(--text_001);
    width: 72px;
    height: 72px;
    border-radius: 50%;
}

.footer .section__header {
    padding-bottom: 0;
}

.footer__second {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: end;
}

.footer__menu {
    display: flex;
    gap: 16px;
}

.footer__menu-item {
    position: relative;
    color: var(--text_001);
    padding: 18px 40px;
    font-weight: 500;
    font-size: 26px;
    line-height: 140%;
    letter-spacing: 0%;
    text-decoration: none;
    border-radius: 40px;
    transition: all .3s;
}

.footer__menu-item:hover {
    background-color: #e9e8e4;
}

.footer__menu-item-label {
    position: absolute;
    display: flex;
    align-items: center;
    top: -20px;
    right: -10px;
    height: 28px;
    padding: 0 16px;
    border-radius: 60px;
    background-color: #fff;
    color: var(--text_001);
    font-weight: 500;
    font-size: 14px;
    line-height: 140%;
}

.footer__menu-item_off {
    color: var(--text_003);
    cursor: default;
}

.footer__copyright {
    font-weight: 400;
    font-size: 19px;
    line-height: 140%;
    display: flex;
    gap: 24px;
}

.footer__copyright span {
    color: var(--text_003);
}

.footer__copyright a {
    color: var(--text_002);
    text-decoration: none;
}

@media (max-width: 1440px) {
    .footer {
        background: url(../img/footer_back_tablet.png) no-repeat right 188px bottom 0 #fff;
        padding: 56px 0;
        height: 593px;
    }

    .contacts__photo {
        width: 96px;
        height: 96px;
    }

    .contacts__title {
        font-size: 20px;
    }

    .contacts__name {
        font-size: 14px;
    }

    .contacts__link-tg {
        height: 56px;
        padding: 0 16px;
        gap: 12px;
    }

    .contacts__link-vk {
        width: 56px;
        height: 56px;
    }

    .contacts__link-dzen {
        width: 56px;
        height: 56px;
    }

    .footer__menu-item {
        font-size: 20px;
        padding: 11px 16px;
    }

    .footer__copyright {
        font-size: 16px;
    }

    .footer__copyright span {
        color: var(--text_003);
    }

    .footer__copyright a {
        color: var(--text_002);
        text-decoration: none;
    }
}




@media (max-width: 768px) {
    .footer {
        background: url(../img/footer_back_mob.png) no-repeat right bottom #fff;
        padding: 32px 0;
        height: fit-content;
    }

    .footer__wrapper {
        flex-direction: column;
        gap: 8px;
    }

    .footer__first {
        width: 100%;
    }

    .contacts {
        margin-bottom: 40px;
    }



    .contacts__title {
        font-size: 4vw;
        word-break: break-word;
    }

    .contacts__name {
        font-size: 4vw;

    }

    .contacts__link-tg {
        height: 44px;
    }

    .contacts__link-vk {
        width: 44px;
        height: 44px;
    }

    .contacts__link-dzen {
        width: 44px;
        height: 44px;
    }

    .footer .section__title {
        font-size: 40px;
    }

    .footer__second {
        width: 100%;
        align-items: flex-start;
    }

    .footer__menu {
        flex-direction: column;
        margin-bottom: 10px;
    }

    .footer__menu-item {
        font-size: 16px;
    }

    .footer__copyright {
        font-weight: 400;
        font-size: 14px;
        line-height: 140%;
        flex-direction: column;
        gap: 16px;
        padding: 16px;
    }
}

/* #endregion footer */

/* #region breadcrumbs */

.home .breadcrumb {
    display: none;
}

.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
	gap: 32px;
}

.breadcrumb a {
    color: var(--text_003);
    font-weight: 400;
    font-size: 19px;
    line-height: 140%;
    transition: all .3s;
	position:relative;
}


.breadcrumb a:hover {
    color: var(--text_001);
}

.breadcrumb a:after{
	    content: '';
    position: absolute;
    background: url(https://gro-digital.com/wp-content/uploads/2025/08/Vector.png) no-repeat;
    width: 7px;
    height: 14px;
    right: -20px;
    top: 6px;
}

.breadcrumb_last {
    font-weight: 400;
    font-size: 19px;
    line-height: 140%;
}

@media (max-width: 1440px) {

    .breadcrumb__link,
    .breadcrumb__item_current {
        font-size: 16px;
    }
}

@media (max-width: 768px) {
	
	.breadcrumb {
   
    gap:24px;
}
	
.breadcrumb a {
    font-size: 16px;
}
	
	.breadcrumb a:after {
    right: -14px;
}
	
    .breadcrumb__link,
    .breadcrumb__item_current {
        font-size: 14px;
    }
}

/* #endregion breadcrumbs */

/* #region modals */
.remove-scrolling {
    overflow: hidden;
    height: 100vh;
}

.offcanvas__overlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    opacity: 1;
    transition: opacity .25s ease;
    z-index: -1;
}

.offcanvas.is-opened .offcanvas__overlay {
    background-color: #000;
    opacity: 0.5;
}

.offcanvas {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    visibility: hidden;
    z-index: 9;
    opacity: 0;
}

.offcanvas.is-opened {
    visibility: visible;
    opacity: 1;
}

.offcanvas__wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 429px;
    height: 160px;
    padding: 32px;
    transition: .25s;
    background: #fff;
    z-index: 9;
    border-radius: 24px;
}


.offcanvas__close {
    position: absolute;
    background-color: #fff;
    border: none;
    right: 16px;
    top: 16px;
    z-index: 9;
}

.offcanvas__content {
    position: relative;
    height: 100%;
}

.offcanvas__title {
    font-weight: 500;
    font-size: 28px;
    line-height: 128%;
    margin-bottom: 16px;
}

.offcanvas__text {
    font-weight: 400;
    font-size: 16px;
    line-height: 140%;
}

@media (max-width: 1440px) {}

@media (max-width: 768px) {
    .offcanvas__wrapper {
        width: 100%;
    }
}

/* #endregion modals */