/* Brand identity measured on https://farmsystems.pl/ on 2026-10-27.
 * Eurostile 800: headings. Nimbus Sans 300: body. Eurostile 600: navigation.
 * Brand green #057f2f, text #6d6d6d, secondary grey #9d9d9c,
 * white #fff, section grey #f7f7f7, contact grey #eaeaea, footer #0f2419.
 * Homepage only: keep the new layout and motion, apply the original identity.
 */
.homepage {
  --green: #057f2f;
  --forest: #0f2419;
  --brand-text: #6d6d6d;
  --ink: var(--brand-text);
  --muted: var(--brand-text);
  --gray: #9d9d9c;
  --surface: #f7f7f7;
  --border: #e0e0e0;
  --lime: #fff;
  --brand-white: #fff;
  --brand-contact: #eaeaea;
  --font-body: nimbus-sans, Arial, sans-serif;
  --font-heading: eurostile, nimbus-sans, Arial, sans-serif;
  font-family: var(--font-body);
  font-size: 19px;
  font-weight: 300;
  line-height: 1.5;
  letter-spacing: -.0125em;
  color: var(--ink);
  background: var(--brand-white);
}
.homepage ::selection { background: var(--green); color: var(--brand-white); }

/* Restore the original typefaces and weights over the layout's font shorthands. */
.homepage h1, .homepage h2, .homepage h3, .homepage h4,
.homepage .product-card:first-child h2,
.homepage .news-grid article:first-child h3,
.homepage .solution-grid article h3,
.homepage .needs .section-heading h2,
.homepage .proof .section-heading h2,
.homepage .news .section-title {
  font-family: var(--font-heading);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: normal;
  color: var(--green);
}
.homepage .hero-heading h1 { font-weight: 800; }
.homepage .hero-title-main {
  font-size: clamp(44px, 5.8vw, 108px);
  line-height: 1.12;
  letter-spacing: normal;
  white-space: normal;
  text-wrap: balance;
}
.homepage .hero-heading .hero-emphasis {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: clamp(26px, 2.6vw, 42px);
  line-height: 1.2;
  letter-spacing: normal;
  color: var(--ink);
}
.homepage .hero-copy p,
.homepage .card-content ul,
.homepage .section-lead,
.homepage .team-panel p,
.homepage .contact-intro p {
  font-family: var(--font-body);
  font-weight: 300;
  line-height: 1.5;
  color: var(--ink);
}
.homepage .card-content h3 {
  font-family: var(--font-heading);
  font-size: 22px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: normal;
  color: var(--green);
}
.homepage .card-content h2,
.homepage .product-card:first-child h2 { letter-spacing: normal; }
.homepage .eyebrow,
.homepage .gallery-index,
.homepage .need-number,
.homepage .product-card .card-content:before,
.homepage .solution-index a>span:first-child,
.homepage .solution-grid article:before {
  font-family: var(--font-heading);
  font-weight: 600;
  color: var(--green);
}
.homepage .hero-note,
.homepage .image-caption,
.homepage .need-card p { color: var(--ink); }

/* White and neutral grey surfaces replace the cream and yellow-green tint. */
.homepage .site-header,
.homepage .nav-dropdown>div,
.homepage .hero,
.homepage .products,
.homepage .brands,
.homepage .proof,
.homepage .team { background: var(--brand-white); }
.homepage .needs,
.homepage .news,
.homepage .gallery-controls { background: var(--surface); }
.homepage .site-header nav {
  font-family: var(--font-heading);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: .05em;
  color: var(--ink);
}
.homepage .nav-dropdown>div a {
  font-family: var(--font-heading);
  font-weight: 300;
  line-height: 1.5;
  letter-spacing: normal;
  color: var(--ink);
}
.homepage .nav-dropdown>div a:hover,
.homepage .site-header nav>a:hover,
.homepage .nav-dropdown summary:hover { color: var(--green); }
.homepage .phone,
.homepage .menu-toggle { font-family: var(--font-heading); color: var(--green); }
.homepage .gallery-choice { color: var(--ink); background: transparent; }
.homepage .gallery-choice:hover { background: var(--brand-contact); color: var(--green); }
.homepage .gallery-choice[aria-pressed=true],
.homepage .gallery-choice[aria-pressed=true]:hover { background: var(--green); color: var(--brand-white); }
.homepage .gallery-choice[aria-pressed=true] .gallery-index { color: var(--brand-white); }
.homepage .index-rule,
.homepage .product-scene-progress { background: var(--border); }
.homepage .card-content li { border-color: var(--border); }
.homepage .is-product-story .card-content li { color: var(--ink); }
.homepage .is-product-story .card-content li.is-feature-current { color: var(--green); }
.homepage .product-film-toggle {
  border-color: var(--border);
  color: var(--green);
  background: var(--brand-white);
}
.homepage .is-product-story .product-film-hint { color: var(--ink); }

/* The source uses green headings on light sections and white type on green. */
.homepage .solutions { background: var(--surface); color: var(--ink); }
.homepage .solutions-intro .section-lead,
.homepage .solution-grid p { color: var(--ink); }
.homepage .solution-index,
.homepage .solution-index a { border-color: var(--border); }
.homepage .solution-index a { color: var(--ink); }
.homepage .solution-index a:hover,
.homepage .solution-index a[aria-current=true] { color: var(--green); }
.homepage .solution-progress { background: var(--border); }
.homepage .solution-progress span { background: var(--green); }
.homepage .solution-grid article:before { background: var(--brand-white); }
.homepage .team-panel {
  background: var(--green);
  color: var(--brand-white);
  padding: clamp(28px, 3.5vw, 56px);
}
.homepage .team-panel h2,
.homepage .team-panel p { color: var(--brand-white); }
.homepage .team-panel hr { background: var(--brand-white); }

.homepage .contact {
  --ink: #626262;
  --muted: #626262;
  background: var(--brand-contact);
  color: var(--ink);
}
.homepage .contact-intro .eyebrow { color: var(--ink); }
.homepage .contact-phone { color: var(--green); }
.homepage .contact-phone { font-family: var(--font-heading); font-weight: 600; letter-spacing: normal; }
.homepage .contact-intro .contact-note,
.homepage .contact-form,
.homepage .contact-form label,
.homepage .contact-form .privacy { color: var(--ink); }
.homepage .contact-form input:not([type=checkbox]),
.homepage .contact-form textarea {
  font-family: var(--font-body);
  font-weight: 300;
  border-color: var(--gray);
  background: var(--brand-white);
  color: var(--brand-text);
  padding-inline: 14px;
}
.homepage .contact-form input::placeholder,
.homepage .contact-form textarea::placeholder { color: var(--ink); }
.homepage .contact-form input[type=checkbox] { accent-color: var(--green); }
.homepage .contact-form input:focus-visible,
.homepage .contact-form textarea:focus-visible { outline-color: var(--green); }

/* Button lettering follows the source; component dimensions stay responsive. */
.homepage .button,
.homepage .text-link,
.homepage .contact-form button {
  font-family: var(--font-body);
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: .1em;
}
.homepage .button,
.homepage .contact-form button { background: var(--green); color: var(--brand-white); }
.homepage .button:hover,
.homepage .contact-form button:hover { background: var(--forest); color: var(--brand-white); }
.homepage .button.outline {
  background: transparent;
  border-color: var(--green);
  color: var(--green);
}
.homepage .button.outline:hover { background: var(--green); color: var(--brand-white); }
.homepage .header-actions .consult {
  font-family: var(--font-heading);
  font-weight: 600;
  letter-spacing: normal;
  background: var(--green);
  color: var(--brand-white);
  border-color: var(--green);
}
.homepage .card-content .button,
.homepage .solution-grid .button {
  background: transparent;
  color: var(--green);
  border-color: var(--green);
}
.homepage .card-content .button:hover,
.homepage .solution-grid .button:hover { background: transparent; color: var(--forest); }
.homepage .team-panel .button { background: var(--brand-white); color: var(--green); border-color: var(--brand-white); }
.homepage .team-panel .button:hover { background: var(--surface); color: var(--green); }
.homepage .team-panel .button:focus-visible {
  outline-color: var(--brand-white);
  box-shadow: 0 0 0 2px var(--green);
}
.homepage .gallery-playback { color: var(--green); border-color: var(--border); }
.homepage .back-top { background: var(--green); color: var(--brand-white); }

.homepage footer { background: var(--forest); color: var(--brand-white); border-top-color: var(--green); }
.homepage .footer-grid h3 { color: var(--brand-white); }
.homepage .footer-grid a:hover,
.homepage .footer-bottom a:hover { color: var(--brand-white); text-decoration: underline; }
.homepage .footer-grid .logo { background: var(--brand-white); padding: 12px; }
.homepage .footer-bottom { border-color: #ffffff40; }

@media (max-width: 1250px) {
  .homepage .hero-actions .button { font-size: 15px; }
}
@media (max-width: 767px) {
  .homepage { font-size: 17px; }
  .homepage .hero-title-main { font-size: clamp(36px, 9vw, 64px); }
  .homepage .hero-heading .hero-emphasis { font-size: 26px; }
  .homepage .card-content h3 { font-size: 21px; }
  .homepage .hero-actions .button { font-size: 16px; }
  .homepage .contact-phone { font-size: clamp(28px, 8.6vw, 39px); }
}
@media print {
  .homepage .contact,
  .homepage .team-panel,
  .homepage footer { background: var(--brand-white); color: #000; }
  .homepage .team-panel h2,
  .homepage .team-panel p,
  .homepage .footer-grid h3 { color: #000; }
}