:root {
  --navy: #0b1d27;
  --navy-2: #12353d;
  --ink: #172d39;
  --muted: #647785;
  --cream: #f5f0e7;
  --paper: #fbfaf7;
  --mint: #a7d6c9;
  --teal: #367783;
  --line: #d6e0e1;
}

html,
body {
  background: var(--paper) !important;
  color: var(--ink) !important;
  overflow-x: hidden;
}

.site-pages,
.locale-page {
  background: var(--paper) !important;
}

.hero {
  color: #fff !important;
  background:
    linear-gradient(90deg, rgba(4, 16, 24, .9), rgba(4, 16, 24, .58) 55%, rgba(4, 16, 24, .18)),
    url("hero-background.png") center 54% / cover no-repeat !important;
}

.header {
  position: relative;
  z-index: 10;
  border-bottom: 1px solid rgba(255, 255, 255, .2) !important;
  background: rgba(5, 20, 28, .78) !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, .16);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

.header .brand,
.header .wordmark,
.header .brand-description,
.header .nav,
.header .nav a,
.header .language-control,
.header .language-trigger {
  color: #fff !important;
}

.header .brand-description {
  border-color: rgba(255, 255, 255, .5) !important;
}

.nav a:hover {
  color: var(--mint) !important;
}

.header .nav {
  align-items: center;
}

.header .nav a:not(.btn) {
  color: #f3fbf9 !important;
  opacity: .94;
  white-space: nowrap;
}

.header .nav .btn-light,
.hero .btn-light,
.cta .btn-light {
  background: var(--mint) !important;
  color: var(--navy) !important;
  border: 1px solid #e2faf2 !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, .3);
  font-weight: 700;
  text-shadow: none !important;
}

.header .nav .btn-light {
  min-height: 40px;
  padding: 10px 16px;
  margin: 0 !important;
}

.header .nav .btn-light:hover,
.hero .btn-light:hover,
.cta .btn-light:hover {
  background: #d9efe9 !important;
  color: #071c24 !important;
  transform: translateY(-1px);
}

.language-trigger {
  background: rgba(255, 255, 255, .1) !important;
  border-color: rgba(255, 255, 255, .42) !important;
  border-radius: 4px;
}

.language-menu {
  background: var(--navy-2) !important;
  border-color: rgba(255, 255, 255, .22) !important;
  color: #fff !important;
}

.language-option {
  color: #fff !important;
}

.language-option:hover,
.language-option[aria-current="page"] {
  background: rgba(167, 214, 201, .16) !important;
}

.hero .eyebrow {
  color: var(--mint) !important;
}

.hero h1,
.hero-copy > p,
.hero .text-link {
  color: #fff !important;
}

.hero-copy > p {
  color: #e9f0ef !important;
}

.hero .btn-light,
.cta .btn-light {
  background: var(--mint) !important;
  color: var(--navy) !important;
  border: 1px solid #e2faf2 !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, .3);
  font-weight: 700;
  text-shadow: none !important;
}

.hero .btn-light:hover,
.cta .btn-light:hover {
  background: #d9efe9 !important;
  color: #071c24 !important;
  transform: translateY(-1px);
}

.hero .stat strong {
  color: var(--mint) !important;
}

.section,
.disciplines-section,
.logo-section,
.portfolio-section,
.section-dark,
.process-section,
.contact-section {
  color: var(--ink) !important;
  background: var(--paper) !important;
}

.section-title,
.services-contrast .section-title,
.disciplines-section .section-title,
.logo-section .section-title,
.portfolio-section .section-title {
  color: var(--ink) !important;
}

.section-lead,
.card p,
.feature span {
  color: var(--muted) !important;
}

.industries-contrast {
  color: #fff !important;
  background: var(--navy-2) !important;
}

.industries-contrast .section-title,
.industries-contrast .section-lead,
.industries-contrast .industry h3,
.industries-contrast .industry p {
  color: #fff !important;
}

.industries-contrast .section-lead,
.industries-contrast .industry p {
  color: #d9e6e5 !important;
}

.services-contrast {
  background: #e8f0ed !important;
}

.services-contrast .card {
  border-color: rgba(23, 45, 57, .18) !important;
}

.services-contrast .card svg {
  color: var(--teal) !important;
}

.disciplines-section {
  background: #fbfaf7 !important;
}

.logo-section[id$="-partners"] {
  background: #edf3f1 !important;
}

.logo-section[id$="-clients"] {
  background: #f5f1e9 !important;
}

.portfolio-section {
  background: #f0f4f2 !important;
}

.locale-page section[id$="-why"] {
  background: #fbfaf7 !important;
}

.contact-section {
  background: var(--navy) !important;
  color: #fff !important;
}

.contact-section .cta {
  background:
    linear-gradient(90deg, rgba(4, 16, 24, .96), rgba(4, 16, 24, .78) 58%, rgba(4, 16, 24, .28)),
    url("hero-background.png") center 50% / cover no-repeat !important;
}

.contact-section .cta h2,
.contact-section .cta p {
  color: #fff !important;
}

.footer {
  background: #06151e !important;
  color: #fff !important;
}

@media (max-width: 1200px) {
  .header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    height: auto !important;
    min-height: 0;
    padding: 15px 18px 12px;
  }

  .header .brand {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
  }

  .header .brand-description {
    max-width: 170px;
  }

  .header .language-control {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
  }

  .header .nav {
    grid-column: 1 / -1;
    grid-row: 2;
    position: static !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 2px 18px;
    width: 100%;
    padding: 10px 0 0;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .header .nav a:not(.btn) {
    padding: 8px 0;
    font-size: 13px;
    line-height: 1.25;
  }

  .header .nav .btn {
    grid-column: 1 / -1;
    justify-self: start;
    margin: 4px 0 0 !important;
  }
}

@media (max-width: 600px) {
  .container {
    width: calc(100% - 32px);
  }

  .header {
    padding: 13px 16px 11px;
    background: rgba(5, 20, 28, .9) !important;
  }

  .header .brand {
    gap: 9px;
  }

  .header .wordmark {
    font-size: 22px;
    letter-spacing: .16em;
  }

  .header .brand-description {
    max-width: 132px;
    padding-inline-start: 9px;
    font-size: 7px;
    line-height: 1.3;
  }

  .header .language-trigger {
    min-height: 40px;
    padding: 8px 9px;
    font-size: 12px;
  }

  .header .language-trigger svg {
    width: 15px;
    height: 15px;
  }

  .header .nav {
    gap: 1px 14px;
    padding: 8px 12px 10px;
    margin-top: 4px;
    border: 1px solid rgba(207, 235, 226, .18) !important;
    border-radius: 10px;
    background: rgba(7, 24, 31, .58) !important;
    box-shadow: 0 8px 18px rgba(0, 0, 0, .18);
  }

  .header .nav a:not(.btn) {
    padding: 7px 0;
    font-size: 12px;
    white-space: normal;
    min-width: 0;
    line-height: 1.2;
  }

  .header .nav .btn {
    min-height: 42px;
    padding: 11px 16px;
    font-size: 13px;
  }

  .hero {
    background-position: 64% center !important;
  }

  .hero-grid {
    display: block;
    min-height: 0;
    padding: 31px 0 35px;
  }

  .hero h1 {
    font-size: clamp(35px, 10.5vw, 43px);
    line-height: 1.03;
    margin-bottom: 18px;
  }

  .hero-copy > p {
    font-size: 15px;
    line-height: 1.55;
  }

  .hero .actions {
    gap: 16px;
  }

  .hero .stat-col {
    margin-top: 30px;
    padding-top: 20px;
  }

  .hero .stat strong {
    font-size: 24px;
  }

  .hero .stat span {
    font-size: 11px;
  }
}

@media (max-width: 370px) {
  .header .brand-description {
    display: none;
  }

  .header .nav {
    gap: 1px 10px;
  }

  .header .nav a:not(.btn) {
    font-size: 11px;
  }
}

/* v21 visual system: compact navigation, architectural blue, warm stone and editorial photo bands. */
:root {
  --navy: #081b27;
  --navy-2: #103540;
  --ink: #142b35;
  --muted: #667b81;
  --cream: #f4eee4;
  --paper: #f6f3ed;
  --sand: #e9dfd1;
  --mint: #b8d9d0;
  --teal: #4d8290;
  --warm: #d2a36b;
  --line: #d4dedc;
}

html,
body {
  background: var(--paper) !important;
  color: var(--ink) !important;
}

.header {
  min-height: 72px !important;
  padding-block: 10px !important;
  background: rgba(5, 18, 27, .86) !important;
  border-bottom: 1px solid rgba(220, 238, 232, .22) !important;
  box-shadow: 0 12px 30px rgba(3, 14, 20, .18);
}

.header .wordmark {
  font-size: 28px !important;
  letter-spacing: .21em !important;
}

.header .brand-description {
  max-width: 150px !important;
  font-size: 8px !important;
  line-height: 1.25 !important;
  letter-spacing: .1em !important;
  opacity: .82;
}

.header .nav {
  flex-wrap: nowrap !important;
  gap: 4px 11px !important;
  min-width: 0;
}

.header .nav a:not(.btn) {
  padding: 7px 1px !important;
  color: #f3f8f6 !important;
  font-size: 11.5px !important;
  letter-spacing: -.01em;
  white-space: nowrap;
}

.header .nav .btn-light,
.hero .btn-light,
.cta .btn-light {
  background: var(--warm) !important;
  color: var(--navy) !important;
  border-color: #f0d8b4 !important;
  box-shadow: 0 8px 20px rgba(4, 13, 18, .28);
}

.header .nav .btn-light {
  min-height: 38px !important;
  padding: 9px 13px !important;
  border-radius: 5px;
  font-size: 11.5px !important;
  white-space: nowrap;
}

.language-trigger {
  min-width: 132px !important;
  min-height: 38px !important;
  padding: 9px 10px !important;
  border-radius: 5px !important;
  background: rgba(255, 255, 255, .1) !important;
  border-color: rgba(223, 239, 234, .4) !important;
  font-size: 12px !important;
}

.hero .btn-light:hover,
.cta .btn-light:hover,
.header .nav .btn-light:hover {
  background: #f0d8b4 !important;
  color: #071923 !important;
}

.hero .eyebrow,
.kicker {
  color: var(--warm) !important;
}

.hero .stat strong {
  color: var(--mint) !important;
}

.industries-contrast {
  background: #0d2a35 !important;
  color: #fff !important;
}

.industries-contrast .section-title,
.industries-contrast .section-lead {
  color: #fff !important;
}

.industries-contrast .section-lead {
  color: #c8d8d8 !important;
}

.industries-contrast .kicker {
  color: var(--mint) !important;
}

.industries-contrast .industry {
  border-color: rgba(231, 241, 237, .2) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .16) !important;
}

.services-contrast {
  position: relative;
  isolation: isolate;
  background:
    linear-gradient(90deg, rgba(7, 27, 37, .94), rgba(7, 27, 37, .82) 58%, rgba(7, 27, 37, .58)),
    url("project-new-02.webp") center 42% / cover no-repeat !important;
  color: #fff !important;
}

.services-contrast .section-title,
.services-contrast .section-lead {
  color: #fff !important;
}

.services-contrast .section-lead {
  color: #d8e3e1 !important;
}

.services-contrast .kicker {
  color: var(--warm) !important;
}

.services-contrast .card {
  background: rgba(247, 244, 237, .96) !important;
  border-color: rgba(225, 237, 231, .64) !important;
  box-shadow: 0 14px 34px rgba(2, 14, 20, .2) !important;
}

.services-contrast .card:hover {
  border-color: var(--warm) !important;
}

.services-contrast .card > .service-icon {
  background: #dcebe5 !important;
  color: var(--navy-2) !important;
}

.disciplines-section {
  background:
    linear-gradient(rgba(239, 231, 219, .94), rgba(239, 231, 219, .94)),
    url("discipline-preview-1.webp") center / cover no-repeat !important;
  color: var(--ink) !important;
}

.disciplines-section .kicker {
  color: var(--teal) !important;
}

.disciplines-section .discipline-item {
  background: rgba(255, 255, 255, .94) !important;
  border-color: rgba(19, 52, 62, .12) !important;
  box-shadow: 0 9px 24px rgba(18, 45, 54, .08);
}

.portfolio-section {
  background:
    linear-gradient(rgba(246, 243, 237, .93), rgba(246, 243, 237, .93)),
    url("industry-commercial.webp") center / cover no-repeat !important;
}

.portfolio-card {
  padding: 0 0 18px;
  border: 1px solid rgba(19, 52, 62, .1);
  border-radius: 12px;
  overflow: hidden;
  background: rgba(255, 255, 255, .84);
  box-shadow: 0 12px 30px rgba(18, 45, 54, .08);
}

.portfolio-card figure,
.portfolio-card .portfolio-number,
.portfolio-card h3,
.portfolio-card p {
  margin-inline: 18px;
}

.portfolio-card figure {
  margin-top: 0;
  margin-inline: 0;
  border-radius: 0;
}

.portfolio-card h3,
.portfolio-card p,
.portfolio-card .portfolio-number {
  display: block;
}

.locale-page section[id$="-why"] {
  position: relative;
  isolation: isolate;
  background:
    linear-gradient(90deg, rgba(7, 27, 37, .96), rgba(7, 27, 37, .86) 55%, rgba(7, 27, 37, .62)),
    url("project-new-05.webp") center 42% / cover no-repeat !important;
  color: #fff !important;
}

.locale-page section[id$="-why"] .section-title,
.locale-page section[id$="-why"] .section-lead,
.locale-page section[id$="-why"] .feature strong {
  color: #fff !important;
}

.locale-page section[id$="-why"] .section-lead,
.locale-page section[id$="-why"] .feature span {
  color: #d5e2e0 !important;
}

.locale-page section[id$="-why"] .feature {
  border-color: rgba(224, 238, 233, .3) !important;
  padding: 18px 18px 18px 20px;
  border-radius: 10px;
  background: rgba(255, 255, 255, .08);
}

.logo-section[id$="-partners"] {
  background:
    linear-gradient(rgba(239, 239, 233, .94), rgba(239, 239, 233, .94)),
    url("project-new-01.webp") center / cover no-repeat !important;
}

.logo-section[id$="-clients"] {
  background:
    linear-gradient(rgba(235, 241, 239, .94), rgba(235, 241, 239, .94)),
    url("industry-hospitality.webp") center / cover no-repeat !important;
}

.contact-section .cta {
  background:
    linear-gradient(90deg, rgba(5, 19, 28, .96), rgba(5, 19, 28, .82) 58%, rgba(5, 19, 28, .46)),
    url("hero-background.png") center 50% / cover no-repeat !important;
}

@media (min-width: 1201px) {
  .header {
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    grid-template-rows: 1fr !important;
    gap: 14px !important;
  }

  .header .brand,
  .header .nav,
  .header .language-control {
    grid-row: 1 !important;
  }

  .header .language-control {
    grid-column: 3 !important;
    justify-self: end !important;
  }

  .header .nav {
    grid-column: 2 !important;
    justify-content: flex-end !important;
  }
}

@media (max-width: 1320px) and (min-width: 1201px) {
  .header .brand-description {
    display: none;
  }

  .header .wordmark {
    font-size: 26px !important;
  }
}

@media (max-width: 1200px) and (min-width: 601px) {
  .header {
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-rows: auto auto !important;
    gap: 5px 14px !important;
    padding-block: 9px 8px !important;
  }

  .header .brand-description {
    display: none;
  }

  .header .nav {
    display: flex !important;
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    justify-content: flex-start !important;
    overflow-x: auto;
    scrollbar-width: none;
    padding: 3px 0 1px !important;
    gap: 4px 16px !important;
  }

  .header .nav::-webkit-scrollbar {
    display: none;
  }

  .header .nav a:not(.btn) {
    flex: 0 0 auto;
  }

  .header .nav .btn {
    flex: 0 0 auto;
  }
}

@media (max-width: 600px) {
  .header {
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-rows: auto auto !important;
    gap: 5px 10px !important;
    padding: 11px 16px 9px !important;
  }

  .header .wordmark {
    font-size: 22px !important;
  }

  .header .nav {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    overflow: visible;
    gap: 1px 14px !important;
    padding: 7px 12px 9px !important;
    border: 1px solid rgba(214, 236, 229, .2) !important;
    border-radius: 10px;
    background: rgba(5, 23, 31, .72) !important;
  }

  .header .nav a:not(.btn) {
    min-width: 0;
    padding: 5px 0 !important;
    font-size: 11.5px !important;
    line-height: 1.2;
    white-space: normal;
  }

  .header .nav .btn {
    grid-column: 1 / -1;
    justify-self: start;
    margin-top: 3px !important;
  }

  .services-contrast,
  .locale-page section[id$="-why"] {
    background-position: 62% center !important;
  }

  .locale-page section[id$="-why"] .feature {
    padding: 14px;
  }

  .portfolio-card {
    padding-bottom: 15px;
  }
}

/* v22 — unified dark blue visual system from Our Services onward */
.services-contrast,
.disciplines-section,
.logo-section[id$="-partners"],
.portfolio-section,
.logo-section[id$="-clients"],
.locale-page section[id$="-why"] {
  position: relative;
  isolation: isolate;
  color: #f5fbfa !important;
  background-color: #092b39 !important;
}

.services-contrast {
  background:
    linear-gradient(90deg, rgba(5, 22, 31, .96), rgba(7, 43, 55, .84) 58%, rgba(5, 25, 35, .68)),
    url("project-new-02.webp") center 42% / cover no-repeat !important;
}

.disciplines-section {
  background:
    linear-gradient(90deg, rgba(5, 25, 35, .96), rgba(8, 48, 60, .84) 58%, rgba(5, 25, 35, .72)),
    url("project-new-03.webp") center / cover no-repeat !important;
}

.logo-section[id$="-partners"] {
  background:
    linear-gradient(90deg, rgba(5, 24, 34, .96), rgba(8, 44, 56, .88) 58%, rgba(5, 26, 36, .75)),
    url("project-new-04.webp") center 45% / cover no-repeat !important;
}

.portfolio-section {
  background:
    linear-gradient(90deg, rgba(5, 24, 34, .96), rgba(8, 44, 56, .86) 58%, rgba(5, 26, 36, .72)),
    url("project-new-01.webp") center / cover no-repeat !important;
}

.logo-section[id$="-clients"] {
  background:
    linear-gradient(90deg, rgba(5, 24, 34, .96), rgba(8, 44, 56, .86) 58%, rgba(5, 26, 36, .72)),
    url("project-new-05.webp") center / cover no-repeat !important;
}

.locale-page section[id$="-why"] {
  background:
    linear-gradient(90deg, rgba(5, 24, 34, .97), rgba(8, 45, 57, .88) 58%, rgba(5, 26, 36, .72)),
    url("industry-development.webp") center / cover no-repeat !important;
}

.services-contrast .section-title,
.disciplines-section .section-title,
.logo-section .section-title,
.portfolio-section .section-title,
.locale-page section[id$="-why"] .section-title {
  color: #fff !important;
}

.services-contrast .kicker,
.disciplines-section .kicker,
.logo-section .kicker,
.portfolio-section .kicker,
.locale-page section[id$="-why"] .kicker {
  color: var(--warm) !important;
}

.services-contrast .section-lead,
.disciplines-section .section-lead,
.logo-section .section-lead,
.portfolio-section .section-lead,
.locale-page section[id$="-why"] .section-lead {
  color: #c9dedb !important;
}

/* Services: dark glass cards keep the light type and icons readable */
.services-contrast .card {
  min-height: 100%;
  padding: 18px 18px 20px;
  border: 1px solid rgba(184, 217, 208, .24) !important;
  border-radius: 10px;
  background: rgba(8, 44, 56, .84) !important;
  box-shadow: 0 16px 32px rgba(2, 15, 22, .25);
  backdrop-filter: blur(6px);
}

.services-contrast .card:first-child,
.services-contrast .card:last-child {
  padding-inline: 18px;
}

.services-contrast .card h3 {
  color: #fff !important;
}

.services-contrast .card p {
  color: #c9dedb !important;
}

.services-contrast .card .service-step {
  color: var(--warm) !important;
}

.services-contrast .card > .service-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  margin-bottom: 16px;
  border: 1px solid rgba(184, 217, 208, .34);
  border-radius: 8px;
  background: rgba(184, 217, 208, .15) !important;
  color: var(--mint) !important;
}

.services-contrast .card svg {
  width: 30px;
  height: 30px;
  margin: 0;
  color: inherit !important;
}

/* Technical disciplines */
.disciplines-section .discipline-item {
  border: 1px solid rgba(184, 217, 208, .22) !important;
  border-radius: 10px;
  background: rgba(8, 44, 56, .84) !important;
  box-shadow: 0 14px 30px rgba(2, 15, 22, .24);
}

.disciplines-section .discipline-item h3 {
  color: #fff !important;
}

.disciplines-section .discipline-number {
  color: var(--warm) !important;
}

.disciplines-section .discipline-photo {
  filter: saturate(.82) contrast(1.02);
}

/* Logos remain on light tiles so the original brand marks stay crisp */
.logo-section .manufacturer-logo,
.logo-section .client-logo-tile {
  border-color: rgba(184, 217, 208, .38) !important;
  background: rgba(248, 251, 250, .96) !important;
  box-shadow: 0 12px 26px rgba(2, 15, 22, .18);
}

/* Portfolio cards */
.portfolio-section .portfolio-card {
  border-color: rgba(184, 217, 208, .24) !important;
  background: rgba(8, 44, 56, .86) !important;
  color: #fff !important;
  box-shadow: 0 14px 30px rgba(2, 15, 22, .24);
}

.portfolio-section .portfolio-card h3 {
  color: #fff !important;
}

.portfolio-section .portfolio-card p {
  color: #c9dedb !important;
}

.portfolio-section .portfolio-card .portfolio-number {
  color: var(--warm) !important;
}

.portfolio-section .portfolio-card figure {
  border-bottom: 1px solid rgba(184, 217, 208, .24);
}

/* Why RØBIN */
.locale-page section[id$="-why"] .feature {
  border-color: rgba(184, 217, 208, .28) !important;
  background: rgba(8, 44, 56, .78) !important;
  box-shadow: 0 14px 30px rgba(2, 15, 22, .2);
}

.locale-page section[id$="-why"] .feature strong {
  color: #fff !important;
}

.locale-page section[id$="-why"] .feature span {
  color: #c9dedb !important;
}

/* Keep the contact call-to-action in the same visual family */
.contact-section {
  background: #092b39 !important;
}

.contact-section .robin-contact-methods {
  color: #e4f1ee;
}

@media (max-width: 1200px) {
  .services-contrast .cards {
    gap: 12px;
  }
}

@media (max-width: 600px) {
  html,
  body {
    overflow-x: hidden;
  }

  .services-contrast,
  .disciplines-section,
  .logo-section[id$="-partners"],
  .portfolio-section,
  .logo-section[id$="-clients"],
  .locale-page section[id$="-why"] {
    background-position: 62% center !important;
  }

  .services-contrast .card {
    min-height: 0;
  }
}

/* Equipment Manufacturers — compact logo-only treatment on the dark section */
.logo-section .manufacturer-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 14px 24px !important;
  margin-top: 26px !important;
  align-items: center;
}

.logo-section .manufacturer-grid .manufacturer-logo {
  min-height: 70px;
  padding: 2px 5px;
  border: 0 !important;
  border-radius: 0;
  outline-offset: 4px;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

.logo-section .manufacturer-grid .manufacturer-logo img {
  width: 100%;
  height: 58px;
  object-fit: contain;
  filter: grayscale(1) invert(1);
  mix-blend-mode: screen;
  opacity: .86;
  transition: opacity .2s ease, transform .2s ease;
}

.logo-section .manufacturer-grid .manufacturer-logo:hover img,
.logo-section .manufacturer-grid .manufacturer-logo:focus-visible img {
  opacity: 1;
  transform: scale(1.04);
}

@media (max-width: 1000px) {
  .logo-section .manufacturer-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 620px) {
  .logo-section .manufacturer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px 14px !important;
    margin-top: 22px !important;
  }

  .logo-section .manufacturer-grid .manufacturer-logo {
    min-height: 58px;
    padding: 1px 4px;
  }

  .logo-section .manufacturer-grid .manufacturer-logo img {
    height: 46px;
  }
}