:root { --shadow: 0 0.4rem 2rem rgba(0, 0, 0, 0.1); --primary-green: #5C7A2A; --border-green: #6CBF00; }
html { height: 100%; font-size: 10px; box-sizing: border-box; scroll-behavior: smooth; }
body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-size: 1.6rem; font-weight: 400; line-height: 1.5; color: #000000; text-align: left; background-color: #FDFCF8; min-height: 100%; overflow-x: hidden; }
hr { margin: 5rem 0; }
*, *::before, *::after { box-sizing: inherit; }
.green { color: #6CBF00; text-decoration: none; }
p { margin: 0; font-size: 1.6rem; }
h1 { color: #fff; max-width: 60rem; margin: 0 0 1.5rem 0; font-size: 3.2rem; line-height: 1.2; }
@media (max-width: 768px) { h1 { font-size: 2.4rem; } .content-part p { font-size: 1.4rem; } p { margin: 0; font-size: 1.4rem; } }
@media (max-width: 480px) { h1 { font-size: 2rem; } }
h2 {text-align: center; font-size: 2.4rem; margin-bottom: 3rem; margin-top: 0; }
@media (max-width: 768px) { h2 { font-size: 2rem; } }
h3 { margin: 0; }
a, .underline { text-decoration: none; color: #000000; }
.underline:hover{ text-decoration: underline;}
.container { width: 100%; padding: 0 1.5rem; margin: 0 auto; }
.grid-container { display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: auto; gap: 2rem; }
@media (max-width: 985px) { .grid-container { grid-template-columns: repeat(1, 1fr); } }
.main-link { text-decoration: none; color: #F48820; }
section { padding: 3rem 0; }
@media (max-width: 575.98px) { #header .container, .navigation .container, #hero-section .container, #footer .container { padding: 0 1rem; } }
@media (min-width: 768px) { .container { max-width: 90rem; } }
@media (min-width: 992px) { .container { max-width: 100rem; } }
@media (min-width: 1200px) { .container { max-width: 120rem; } }
.flex { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; }
.modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 1000; justify-content: center; align-items: center; }
.modal.active { display: flex; }
.modal-dialog { width: 100%; max-width: 40rem; }
.text-center { text-align: center; }
.modal-content { background: white; padding: 3rem; position: relative; box-shadow: 0 0.4rem 1.2rem rgba(0, 0, 0, 0.2); border-radius: 0.5rem;}
.modal-close { position: absolute; top: 1.5rem; right: 1.5rem; background: none; border: none; font-size: 2.4rem; cursor: pointer; color: #999; }
.modal-close:hover { color: #333; }
.modal h4 { margin-top: 0; margin-bottom: 1rem; color: #333; font-size: 1.8rem;}
.modal p { margin-bottom: 1rem; }
.form-group { margin-bottom: 1.5rem; }
.form-group label { display: block; margin-bottom: 0.5rem; font-weight: bold; color: #444; }
@media (max-width: 768px){.form-group label {font-size: 1.4rem;} .modal h4 {  font-size: 1.6rem;}}
.form-group input { width: 100%; padding: 1rem; border: 0.1rem solid #ccc; border-radius: 0.4rem; box-sizing: border-box; }
.btn-call { background-color: #6CBF00; color: white; border: none; padding: 1rem 2rem; font-size: 1.6rem; border-radius: 0.4rem; cursor: pointer; transition: background-color 0.3s; }
.btn-call:hover { background-color: #3a5530; }
.btn-submit { width: 100%; background-color: #6CBF00; color: white; border: none; padding: 1.2rem; font-size: 1.6rem; border-radius: 0.4rem; cursor: pointer; transition: background-color 0.3s; }
.btn-submit:hover { background: #5ea700; }
.btn { position: relative; font-size: 1.4rem; display: inline-block; color: #EFEFEF; cursor: pointer; padding: 0.2rem 3rem 0.2rem 1.5rem; line-height: 3.3rem; vertical-align: middle; margin: 0; background: #5F5F5F; text-shadow: none; border-radius: 0.4rem; text-transform: none; font-weight: normal; width: 19rem; overflow: hidden; z-index: 1; }
.btn::before { content: ''; position: absolute; top: 0; left: 0; width: 0; height: 100%; background: #5ea700; transition: width 0.4s ease-out; z-index: -1; border-radius: 0.4rem; }
.btn:hover::before { width: 100%; }
.btn:hover { color: #fff; }
.btn::after { content: ''; position: absolute; width: 2.3rem; height: 100%; top: 0; right: 0; background-color: #6CBF00; background-image: url(./img/arrow.png); background-repeat: no-repeat; background-position: 0.5rem center; border-bottom-right-radius: 0.4rem; border-top-right-radius: 0.4rem; }
@media (max-width: 480px) { .btn { padding: 0 2rem 0 0; font-size: 1.4rem; line-height: 3rem; } }
#header { padding-top: 0; }
.caption { background-color: #f8f9fa; padding: 1.5rem 0; border-bottom: 0.1rem solid #dee2e6; }
.logo img { max-height: 6rem; max-width: 20rem; width: auto; }
.logo a { display: inline-block; text-decoration: none; }
.contacts { text-align: right; }
@media (max-width: 768px) { .flex { justify-content: center; text-align: center; } .contacts { text-align: center; margin-top: 1.5rem; width: 100%; } .nav { flex-direction: column; } .logo img { max-width: 18rem; } }
@media (max-width: 480px) { .caption { padding: 1rem 0; } .logo img { max-width: 15rem; max-height: 5rem; } }
.phone { margin-bottom: 0.5rem; }
.phone a { font-size: 2rem; font-weight: 600; color: #000000; text-decoration: none; white-space: nowrap; }
.phone a:hover { color: #6CBF00; text-decoration: underline; }
.adress { font-size: 1.4rem; color: #666; line-height: 1.4; }
.nav { min-height: 4rem; color: white; text-align: center; padding: 1rem 0; }
.nav a { margin: 0 0.5rem; padding: 0.5rem 1rem; width: 19rem; }
.nav a:hover { color: #6CBF00; }
#hero-section { background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url(./img/hero-img.jpg); height: 50.7rem; background-size: cover; background-position: center center; background-repeat: no-repeat; position: relative; display: flex; align-items: center; padding: 0; }
#hero-section .container { padding: 0 1.5rem; }
@media (max-width: 575.98px) { #hero-section { height: 40rem; } #hero-section .container { padding: 0 1rem; } }
@media (max-width: 375px) { #hero-section { height: 35rem; } }
.content-part { position: relative; display: flex; flex-direction: column; justify-content: space-around; }
.description { background-color: rgba(0, 0, 0, 0.5); color: #ffffff; border-left: 0.5rem solid #6CBF00; max-width: 40rem; padding: 1rem; }
.advantages { gap: 2rem; display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; }
.advantage { display: flex; flex-direction: column; max-width: 19rem; align-items: center; justify-content: center; }
.advantage-number { color: #F48820; font-size: 3.2rem; display: flex; }
.advantage-description { text-align: center; }
@media (max-width: 768px) { .advantage-number { font-size: 2.4rem; } .advantage { max-width: 16rem; } .advantage-description { font-size: 1.4rem; } }
@media (max-width: 375px) { .advantages { justify-content: center; } }
.directions { display: grid; flex-wrap: wrap; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.about-direction { border: 0.5rem solid #f2f2f2; background-color: #f2f2f2; overflow: hidden; position: relative; padding: 1rem; display: flex; align-items: center; gap: 2rem; flex-direction: column; }
.content-direction { flex: 1; display: flex; flex-direction: column; }
.content-direction h3 { font-size: 1.8rem; margin-bottom: 1.5rem; color: #000000; line-height: 1.3; text-align: center; }
.content-direction p { color: #1a1a1a; line-height: 1.6; margin: 0; }
@media (max-width: 992px) { .directions-section { padding: 6rem 0; } }
@media (max-width: 768px) { .directions { gap: 2rem; margin: 0 auto; grid-template-columns: repeat(2, 1fr); } .about-direction { padding: 1.5rem; } .directions-section { padding: 5rem 0; } }
@media (max-width: 480px) { .directions { gap: 2rem; margin: 0 auto; grid-template-columns: repeat(1, 1fr); } .content-direction p { font-size: 1.4rem; } }
span { text-decoration: underline; }
.container-discription { text-align: center; }
.partner-card { border: 0.5rem solid #f2f2f2; border-right: 0.7rem solid #6CBF00; background-color: #f2f2f2; padding: 2rem; display: flex; gap: 2rem; line-height: 1.4; font-size: 1.6rem; align-items: center; transition: .3s; cursor: pointer; padding-left: 2rem; position: relative; }
.partner-card:hover { border: 0.5rem solid #e1f9c2; border-right: 0.7rem solid #6CBF00; background-color: #e1f9c2; transition: all 0.2s linear; }
.partner-card .img-partner { flex-basis: 20rem; flex-shrink: 0; text-align: center; font-size: 1.8rem; line-height: 1.2; border-right: 0.1rem solid #00000038; padding-right: 1rem; position: relative; z-index: 3; }
.partner-card .img-partner img { margin-bottom: 2rem; max-height: 8rem; }
.partner-card .title{font-size: 1.8rem;}
@media (max-width: 768px) {.partner-card .title{font-size: 1.6rem;}}
.partners-container { margin: 3rem 0; }
img { display: inline-block; max-width: 100%; height: auto; }
@media (max-width: 480px) { .partner-card { flex-direction: column; } .partner-card .img-partner { border-right: 0; flex-basis: 10rem; } .about-section ul.partner-links li { font-size: 1.4rem; } }
.about-company { align-items: center; }
.about-company img { width: 40rem; float: left; margin-right: 2rem; margin-bottom: 2rem; height: auto; border-radius: 0.8rem; box-shadow: 0 0.4rem 1.2rem rgba(0, 0, 0, 0.08); object-fit: cover; }
@media (max-width: 480px) {  .about-company img { width: 100%; margin-right: 0; } }
.about-company .left-img { max-width: 50%; margin-right: 2rem; margin-bottom: 2rem; height: auto; border-radius: 0.8rem; box-shadow: 0 0.4rem 1.2rem rgba(0, 0, 0, 0.08); object-fit: cover; }
.about-company p { flex: 2; min-width: 30rem; line-height: 1.6; margin: 0 0 2rem 0; }
.about-company a { color: #6CBF00; text-decoration: none; border-bottom: 0.1rem solid #6CBF00; transition: opacity 0.2s; }
.about-company a:hover { opacity: 0.8; }
@media (max-width: 1024px) { .about-company p { font-size: 1.6rem; } }
@media (max-width: 768px) { .about-company { flex-direction: column; text-align: center; } .about-company p { font-size: 1.4rem; text-align: left; } .about-company-section { padding: 4rem 0; } }
@media (max-width: 480px) { .about-company .left-img { max-width: 100%; margin-right: 0; } .nav a { font-size: 1.4rem; } }
.agro-map-container { position: relative; width: 100%; height: 50rem; overflow: hidden; box-shadow: var(--shadow); }
.grocontact-img { background: url(../agrotorgservice/img/cont02.png) no-repeat right bottom; width: 100%; height: 100%; }
.agromap { width: 100%; height: 100%; }
.agromap iframe { width: 100%; height: 100%; border: none; display: block; }
.agrocontact { background-color: white; border: 0.2rem solid var(--border-green); padding: 2rem; max-width: 30rem; text-align: center; z-index: 10; box-shadow: var(--shadow); display: flex; flex-direction: column; align-items: center; gap: 1.2rem; }
.agrocontact .logo img { max-width: 18rem; height: auto; }
.agrocontact .email, .agrocontact .adress { font-size: 1.8rem; line-height: 1.5; margin: 0; }
.agrocontact .tel { font-size: 2rem; }
@media (min-width: 769px) { .agrocontact { position: absolute; top: 17%; right: 2%; } }
@media (max-width: 768px) { .agro-map-container { height: auto; display: flex; flex-direction: column; gap: 1.5rem; padding: 1rem; } .agromap iframe { width: 100% !important; height: 30rem; } .agrocontact { position: static; max-width: 100%; padding: 1.5rem; gap: 1rem; } .agrocontact .email, .agrocontact .tel, .agrocontact .adress { font-size: 1.5rem; } }
@media (max-width: 480px) { .agro-map-container { gap: 1rem; } .agromap iframe { height: 25rem; } .agrocontact { padding: 1rem; } .agrocontact .email, .agrocontact .tel, .agrocontact .adress { font-size: 1.4rem; } }
#footer { background-color: #6CBF00; color: #fff; padding: 4rem 0; font-size: 1.4rem; line-height: 1.5; border-top: 0.1rem solid #e0dcd5; margin-top: 3rem; }
#footer .container { margin: 0 auto; padding: 0 2rem; display: flex; flex-direction: row; align-items: center; justify-content: space-between; }
.logo-footer { display: flex; align-items: center; gap: 2rem; max-width: 30rem; flex-wrap: wrap; }
.logo-footer img { height: 5rem; width: auto; object-fit: contain; }
.title-footer { font-size: 1.6rem; color: #ffffff; margin: 0; max-width: 60rem; }
.nav-footer { display: flex; flex-wrap: wrap; gap: 2rem 3rem; justify-content: center; }
.nav-footer a { text-decoration: none; color: #ffffff; font-size: 1.5rem; transition: color 0.2s ease; }
.nav-footer a:hover { color: #4a6b3f; }
#footer p { text-align: center; margin: 0; font-size: 1.3rem; }
@media (max-width: 1100px) { #footer .container { gap: 2.5rem; text-align: center; flex-direction: column; } .logo-footer { justify-content: center; flex-direction: column; gap: 1.2rem; } .title-footer { font-size: 1.4rem; text-align: center; } .nav-footer { justify-content: space-around; } .nav-footer a { font-size: 1.4rem; } }
.partners-section h3 { margin-top: 4rem; margin-bottom: 2rem; font-size: 2.2rem; color: #000000; font-weight: 600; text-align: center; }
h3 i { margin-right: 2rem; }
@media (max-width: 768px) { .partners-section h3 { font-size: 1.8rem; } .content-direction p, .container-discription { font-size: 1.4rem; } }
.about-section p { margin-bottom: 1.6rem; line-height: 1.6; color: #000000; }
.about-section ul.partner-links { margin: 2.4rem 0; padding-left: 2rem; }
.about-section ul.partner-links li { margin-bottom: 1.2rem; line-height: 1.5; text-align: left; }
.about-section a { color: #6CBF00; transition: opacity 0.2s; }
.about-section a:hover { opacity: 0.8; }
.contact-section h2, .contact-section h3 { margin-bottom: 2rem; }
.contact-section p { line-height: 1.6; margin-bottom: 1.6rem; font-size: 1.6rem; color: #333; }
.agro-contact { display: flex; gap: 3rem; align-items: center;}
.contact-info { background: #f8f9fa; border-radius: 0.8rem;  flex: 1; min-width: 0; }
.contact-item { display: flex; flex-wrap: wrap; justify-content: space-between; padding: 1.6rem 0; border-bottom: 0.1rem solid #bbc7ba; font-size: 1rem; }
.contact-item:last-child { border-bottom: none; }
.contact-name { flex: 0 0 45%; font-family: 'Roboto Condensed', sans-serif; font-weight: 600; font-size: 1.8rem; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0; }
.contact-item > div:last-child, .contact-item a { flex: 0 0 50%; text-align: right; text-decoration: none; font-weight: 500; font-size: 1.6rem; }
.contact-item a:hover { text-decoration: underline; }
.contact-img { flex: 0 0 50%; }
.contact-img img { max-width: 100%; height: auto; border-radius: 0.8rem; display: block; }
.partners-note { background: #efefef; padding: 2rem; }
.partners-note a { color: #6CBF00; text-decoration: underline; font-weight: 600; }
.partners-note a:hover { opacity: 0.8; }
.contact-container { width: 100%; height: 40rem; box-shadow: var(--shadow, 0 0.4rem 1.2rem rgba(0,0,0,0.1)); border-radius: 0.8rem; overflow: hidden; margin: 4rem 0; }
.agromap iframe { width: 100%; height: 100%; border: none; display: block; }
.cta-final { text-align: center; margin-top: 4rem; }
.cta-final p { font-size: 1.6rem; margin-bottom: 2rem; font-weight: 600; color: #000000; }
@media (max-width: 1024px) { .contact-item { font-size: 1rem; } }
@media (max-width: 768px) { .agro-contact { flex-direction: column; } .contact-img { display: none; } .contact-info { width: 100%; } .contact-item { flex-direction: column; align-items: flex-start; gap: 0.6rem; } .contact-name, .contact-item > div:last-child, .contact-item a { flex: 1 1 100%; text-align: left; } .contact-container { height: 30rem; } }
@media (max-width: 480px) { .contact-info { padding: 1.6rem 0; } .contact-name { font-size: 1.6rem; } .cta-final p { font-size: 1.1rem; } }