/* ============================================================
   Penta Tech — common.css
   Shared: tokens, reset, scaling system, header, side buttons,
   footer (Let's Talk card + branches + bottom bar)
   Design source: Figma "Penta-Tech" (1920px desktop frames)
   Unit system: 1rem = 16px at 1920px viewport. For laptops
   (1025–1919px) the root font-size scales with the viewport so
   the desktop layout renders as an exact proportional replica.
   ============================================================ */

:root {
  --green: #05735b;
  --green-panel: #07725b;
  --green-mid: #19967a;
  --green-border: #168c72;
  --green-icon-bg: #188970;
  --green-light: #4aad97;
  --navy: #0a1821;
  --navy-card: #1f3a4b;
  --text-dark: #252525;
  --grey-text: #ccc;
  --font-main: 'Montserrat', sans-serif;
  --font-alt: 'Noto Sans', sans-serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { font-size: 16px; overflow-x: hidden; }
/* Desktop proportional scaling. The whole layout is authored in rem against the
   1920px Figma (1rem = 16px @ 1920). Scaling the root font-size with the viewport
   width (0.8333333vw = 16px at 1920) makes it a pixel-perfect proportional replica
   at EVERY width >=1025px — including screens and zoom-out levels wider than 1920 —
   so the design always fills the viewport with no white gutters. */
@media (min-width: 1025px) {
  html { font-size: 0.8333333vw; }
}
@media (max-width: 1024px) {
  html { font-size: 16px; }
}

body {
  font-family: var(--font-main);
  background: #fff;
  color: var(--text-dark);
  width: 100%;
  overflow-x: hidden;
}

img { display: block; max-width: 100%; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }
button, input, textarea { font-family: inherit; background: none; border: none; outline: none; }

.container {
  width: 102.5rem; /* 1640 */
  margin: 0 auto;
}

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 4.375rem;              /* 70 */
  border-radius: 1.25rem;        /* 20 */
  border: 1px solid var(--green-border);
  font-family: var(--font-main);
  font-weight: 500;
  font-size: 1.25rem;            /* 20 */
  line-height: 2.5rem;
  cursor: pointer;
  white-space: nowrap;
  transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease, color 0.3s ease;
}
.btn--white { background: #fff; color: var(--green); }
.btn--green { background: var(--green-mid); color: #fff; }
.btn--white:hover {
  background: var(--green);
  color: #fff;
  transform: translateY(-0.1875rem);
  box-shadow: 0 0.9375rem 1.5625rem 0 rgba(5, 115, 91, 0.25);
}
.btn--green:hover {
  background: var(--green-panel);
  transform: translateY(-0.1875rem);
  box-shadow: 0 0.9375rem 1.5625rem 0 rgba(7, 114, 91, 0.3);
}

/* ---------- Header ---------- */
.site-header {
  position: relative;
  z-index: 20;
  background: #fff;
  height: 7.5rem;                /* 120 */
}
.site-header .container {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.logo {
  position: relative;
  width: 18.75rem;               /* 300 */
  height: 3.334rem;              /* 53.34 */
  flex-shrink: 0;
}
.logo__img {
  position: absolute; left: 0; top: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: left center;
}
.main-nav {
  display: flex;
  align-items: center;
}
.main-nav__list {
  display: flex;
  align-items: center;
  gap: 3.4375rem;                /* 55 */
  margin-right: 5.125rem;        /* 82 */
}
.main-nav__item a {
  display: flex;
  align-items: center;
  gap: 0.625rem;                 /* 10 */
  font-weight: 500;
  font-size: 1.25rem;            /* 20 */
  line-height: 1.25rem;
  color: var(--text-dark);
  transition: color 0.3s ease;
}
.main-nav__item a:hover { color: var(--green-mid); }
.main-nav__item img { width: 1.5625rem; height: 1.5625rem; }        /* 25 */
.main-nav__item--services img { width: 1.875rem; height: 1.875rem; } /* 30 */
.main-nav__item--contact img { width: 1.8125rem; height: 1.5625rem; } /* 29x25 */
.main-nav .btn { width: 12.5625rem; }  /* 201 */

.nav-toggle {
  display: none;
  flex-direction: column;
  gap: 6px;
  cursor: pointer;
  padding: 6px;
}
.nav-toggle span {
  display: block;
  width: 30px; height: 3px;
  background: var(--green);
  border-radius: 2px;
  transition: 0.3s;
}
.nav-toggle:hover span { background: var(--green-mid); }

/* Drawer-only elements — hidden on desktop, revealed inside the mobile drawer */
.main-nav__brand { display: none; }
.main-nav__sub-toggle { display: none; }
.main-nav__submenu { display: none; }

/* ---------- Get a Quote modal ---------- */
body.quote-modal-open { overflow: hidden; }
.quote-modal { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 2rem; opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s; }
.quote-modal.is-open { opacity: 1; visibility: visible; }
.quote-modal__backdrop { position: absolute; inset: 0; background: rgba(5, 17, 24, .78); backdrop-filter: blur(7px); }
.quote-modal__dialog { position: relative; width: min(56rem, 100%); max-height: calc(100vh - 4rem); overflow-y: auto; padding: 3.25rem; background: #fff; border-radius: 2rem; box-shadow: 0 2rem 5rem rgba(0,0,0,.32); transform: translateY(1.5rem) scale(.98); transition: transform .3s ease; }
.quote-modal.is-open .quote-modal__dialog { transform: translateY(0) scale(1); }
.quote-modal__dialog h2 { margin-bottom: 2.25rem; font-size: 3.5rem; line-height: 1.1; font-weight: 400; color: var(--text-dark); }
.quote-modal__close { position: absolute; right: 2rem; top: 1.5rem; width: 3rem; height: 3rem; font-size: 2.5rem; line-height: 1; cursor: pointer; color: #111; transition: transform .2s ease, color .2s ease; }
.quote-modal__close:hover { color: var(--green); transform: rotate(90deg); }
.quote-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem 1.5rem; }
.quote-form__field { display: flex; flex-direction: column; gap: .5rem; }
.quote-form__field--full { grid-column: 1 / -1; }
.quote-form__field label { font-size: 1rem; font-weight: 500; color: #272727; }
.quote-form__field input, .quote-form__field select, .quote-form__field textarea { width: 100%; border: 1px solid #bbb; border-radius: .625rem; background: #fff; color: #222; font-size: 1rem; padding: 1rem 1.125rem; transition: border-color .2s, box-shadow .2s; }
.quote-form__field input, .quote-form__field select { height: 3.75rem; }
.quote-form__field textarea { min-height: 9rem; resize: vertical; }
.quote-form__field input:focus, .quote-form__field select:focus, .quote-form__field textarea:focus { border-color: var(--green-mid); box-shadow: 0 0 0 3px rgba(25,150,122,.15); }
.quote-form__error { min-height: 1rem; color: #c62828; font-size: .75rem; }
.quote-form__footer { margin-top: 1.5rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.quote-form__footer .form-feedback { flex: 1; font-size: .875rem; }
.quote-form__footer .form-feedback[data-state="success"] { color: var(--green); }
.quote-form__footer .form-feedback[data-state="error"] { color: #c62828; }
.quote-form__footer button { min-width: 13rem; padding: 1rem 1.5rem; background: var(--green); color: #fff; border-radius: .625rem; font-size: 1rem; font-weight: 600; cursor: pointer; transition: background .2s, transform .2s; }
.quote-form__footer button:hover { background: var(--green-mid); transform: translateY(-2px); }
.quote-form__footer button:disabled { opacity: .65; cursor: wait; }
@media (max-width: 767px) {
  .quote-modal { padding: 1rem; align-items: end; }
  .quote-modal__dialog { width: 100%; max-height: 92vh; padding: 2.25rem 1.25rem 1.5rem; border-radius: 1.5rem 1.5rem 0 0; }
  .quote-modal__dialog h2 { font-size: 2.25rem; margin-bottom: 1.5rem; }
  .quote-modal__close { right: 1rem; top: .75rem; }
  .quote-form__grid { grid-template-columns: 1fr; gap: .75rem; }
  .quote-form__field--full { grid-column: auto; }
  .quote-form__field textarea { min-height: 7rem; }
  .quote-form__footer { align-items: stretch; flex-direction: column; }
  .quote-form__footer button { width: 100%; }
}

/* ---------- Footer ---------- */
.site-footer {
  position: relative;
  margin-top: 6.25rem; /* page sections control their own spacing; overridden per page */
}

/* Let's Talk card */
.footer-cta {
  position: relative;
  z-index: 2;
  width: 85.125rem;              /* 1362 */
  height: 33.4375rem;            /* 535 */
  margin: 0 auto -14.375rem;     /* overlaps black area by 230 */
  background: #fff;
  border-radius: 1.875rem;       /* 30 */
  overflow: hidden;
}
.footer-cta__blob {
  position: absolute;
  left: 0; top: 0;
  width: 19.5667rem;             /* 313 */
  height: 18.75rem;              /* 300 */
  opacity: 0.08;                 /* a faint tint on the white card, matching Figma */
}
.footer-cta__inner {
  position: relative;
  display: flex;
  justify-content: space-between;
  padding: 3.75rem 6.25rem 0 6.25rem;  /* 60 100 */
}
.footer-cta__left { width: 33.0625rem; /* 529 */ position: relative; padding-left: 0.25rem; }
.footer-cta__kicker {
  font-size: 1.25rem;            /* 20 */
  font-weight: 400;
  color: var(--text-dark);
}
.footer-cta__title {
  font-size: 1.875rem;           /* 30 */
  font-weight: 400;
  color: var(--text-dark);
  margin-top: 1.5rem;            /* 5683-5639-20 ≈ 24 */
}
.footer-form { margin-top: 3.5625rem; /* 5780-5683-30+... = 57 */ }
.footer-form input,
.footer-form textarea {
  display: block;
  width: 32.8125rem;             /* 525 */
  color: var(--text-dark);
  font-size: 1.125rem;           /* 18 */
  font-weight: 400;
  padding-bottom: 0.375rem;
  border-bottom: 1px solid #ccc;
  border-radius: 0;
  resize: none;
}
.footer-form input::placeholder,
.footer-form textarea::placeholder { color: var(--text-dark); opacity: 0.5; }
.footer-form .btn--green { color: var(--text-dark); }
.footer-form__row {
  display: flex;
  gap: 1.9375rem;                /* 31 */
  margin-top: 2.5rem;            /* 40 */
}

/* ---------- lead-capture forms: honeypot + submit feedback ---------- */
.hp-field {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.form-feedback {
  margin-top: 0.75rem;
  font-size: 1rem;
  font-weight: 500;
  min-height: 1.25em;
}
.form-feedback[data-state="success"] { color: var(--green-light); }
.form-feedback[data-state="error"] { color: #ff8a80; }
button[disabled] { opacity: 0.6; cursor: not-allowed; }
.footer-form__row input { width: 15.4375rem; }  /* 247 */
.footer-form textarea { margin-top: 2.5rem; height: 2.5rem; }
.footer-form .btn {
  margin-top: 2.5rem;
  width: 8.8125rem;              /* 141 */
}
.footer-cta__right { width: 29rem; /* 464 */ padding-top: 0; }
.footer-cta__person {
  display: flex;
  align-items: flex-start;
  gap: 2.375rem;                 /* 38 */
}
.footer-cta__photo {
  width: 6.25rem; height: 6.25rem;    /* 100 */
  border: 1px solid var(--green-light);
  border-radius: 1.25rem;
  object-fit: cover;
}
.footer-cta__name {
  font-size: 1.875rem;           /* 30 */
  font-weight: 700;
  color: var(--text-dark);
  margin-top: 0.9375rem;         /* 15 */
}
.footer-cta__role {
  font-size: 1.25rem;            /* 20 */
  font-weight: 400;
  color: var(--text-dark);
  margin-top: 0.625rem;
}
.footer-cta__desc {
  margin-top: 2.375rem;          /* 5777-5739+... = 38 */
  font-size: 1.25rem;            /* 20 */
  line-height: 2.5rem;           /* 40 */
  color: var(--text-dark);
  font-weight: 400;
}
.footer-cta__call { display: block; cursor: pointer; }
.footer-cta__callnow {
  margin-top: 2.75rem;           /* 44 */
  font-size: 1.25rem;
  font-weight: 500;
  color: var(--green-light);
  transition: color 0.3s ease;
}
.footer-cta__phone {
  display: flex;
  align-items: center;
  gap: 1.9375rem;                /* 31 */
  margin-top: 1.1875rem;         /* 19 */
  font-size: 1.25rem;
  color: var(--text-dark);
  transition: transform 0.3s ease;
}
.footer-cta__phone img { width: 1.7rem; height: 1.66rem; transition: transform 0.3s ease; }
.footer-cta__call:hover .footer-cta__callnow { color: var(--green-mid); }
.footer-cta__call:hover .footer-cta__phone { transform: translateX(0.3125rem); }
.footer-cta__call:hover .footer-cta__phone img { transform: scale(1.15); }

/* Black footer body */
.footer-black {
  background: #000;
  color: #fff;
  padding-top: 16.5625rem;       /* 265: across-borders logo offset from black top */
}
.footer-ab-logo {
  position: relative;
  margin: 0 auto;
  width: 15.625rem;              /* 250 */
  height: 6.2908rem;             /* 100.65 */
  overflow: hidden;
}
.footer-ab-logo img {
  position: absolute;
  max-width: none;
  width: 148.3%;                 /* Figma image crop transform */
  height: 460.43%;
  left: -24.48%;
  top: -181.65%;
}
.footer-ab-logo--custom {
  width: 15rem;
  height: auto;
  min-height: 5rem;
  overflow: visible;
  text-align: center;
}
.footer-ab-logo--custom img {
  position: static;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 6.25rem;
  margin: 0 auto;
}
.footer-ab-logo__description {
  margin-top: 1rem;
  color: #aaa;
  font-size: 0.875rem;
  line-height: 1.5;
}
.footer-divider {
  border: none;
  border-top: 1px solid rgba(255, 255, 255, 0.23);
  margin-top: 2.6875rem;         /* 6293-6249.7 = 43 */
}
.footer-main {
  position: relative;
  width: 98.75rem;               /* 1580 (170 margins) */
  margin: 2.9375rem auto 0;      /* 6340-6293 = 47 */
  min-height: 28.75rem;          /* 460 — matches Figma gap between branches & the bottom divider (was 428, ran cramped) */
}
.footer-main__heading {
  font-family: var(--font-alt);
  font-size: 1.625rem;           /* 26 */
  font-weight: 400;
  line-height: 1.625rem;
}
.footer-main__heading b { font-weight: 700; }

.footer-branches {
  position: relative;
  width: 71.9375rem;             /* 1151: 170 -> 1321 */
  display: flow-root;            /* keep row margins inside so divider offsets stay anchored */
}
.footer-branches__row {
  display: flex;
  margin-top: 3.875rem;          /* rows at y6428; branches div starts at heading bottom (6366) */
}
.footer-branches__row + .footer-branches__row {
  margin-top: 4rem;              /* row2 at y6594; row1 bottom ≈ 6530 */
}
.footer-branch { font-family: var(--font-alt); }
.footer-branch:nth-child(1) { width: 26.9375rem; }  /* col2 starts at 431 */
.footer-branch:nth-child(2) { width: 20.5625rem; }  /* col3 starts at 760 (930-170) */
.footer-branch:nth-child(3) { flex: 1; }
.footer-branch__head {
  display: flex;
  align-items: center;
  gap: 0.5rem;                   /* 8 */
}
.footer-branch__head img {
  width: 1.875rem; height: 1.875rem;   /* 30 */
  border-radius: 50%;                  /* clip export canvas to the circular flag */
  object-fit: cover;
}
.footer-branch__head span {
  font-size: 1.25rem;            /* 20 */
  font-weight: 700;
  line-height: 1.25rem;
}
.footer-branch__addr {
  margin: 0.75rem 0 0 2.4375rem; /* text starts 39px right of col */
  font-size: 1.125rem;           /* 18 */
  font-weight: 400;
  line-height: 1.25rem;          /* 20 */
}
.footer-branch--poland .footer-branch__addr { line-height: 1.625rem; } /* 26 */
/* exact Figma text-block widths so addresses wrap inside their grid cells */
.footer-branches__row:nth-child(1) .footer-branch:nth-child(1) .footer-branch__addr { max-width: 18.625rem; }  /* 298 */
.footer-branches__row:nth-child(1) .footer-branch:nth-child(2) .footer-branch__addr { max-width: 12.0225rem; } /* 192.4 */
.footer-branches__row:nth-child(1) .footer-branch:nth-child(3) .footer-branch__addr { max-width: 22rem; }      /* 352 */
.footer-branches__row:nth-child(2) .footer-branch:nth-child(1) .footer-branch__addr { max-width: 18.3335rem; } /* 293.3 */
.footer-branches__row:nth-child(2) .footer-branch:nth-child(2) .footer-branch__addr { max-width: 12.25rem; }   /* 196 */
.footer-branches__row:nth-child(2) .footer-branch:nth-child(3) .footer-branch__addr { max-width: 24.4375rem; } /* 391 */

/* vertical dividers between branch columns (x 554 & 883 abs => 384 & 713 in container) */
.footer-branches::before,
.footer-branches::after {
  content: "";
  position: absolute;
  top: 3.25rem;                  /* lines y6418..6696; branches div top = 6366 */
  height: 17.375rem;             /* 278 */
  width: 0;
  border-left: 1px solid #2c2c2c;
}
.footer-branches::before { left: 24rem; }      /* 554-170 = 384 */
.footer-branches::after { left: 44.5625rem; }  /* 883-170 = 713 */
/* horizontal divider between rows (y 6547) */
.footer-branches .footer-branches__hr {
  position: absolute;
  left: 0;
  top: 11.3125rem;               /* 6547; branches div top = 6366 */
  width: 100%;
  border: none;
  border-top: 1px solid #2c2c2c;
}

/* Right: talk to expert */
.footer-expert {
  position: absolute;
  right: 0;
  top: 3.875rem;                 /* 6402-6340 = 62 */
  width: 19.5625rem;             /* 313 */
  font-family: var(--font-alt);
}
.footer-expert__title {
  font-size: 1.625rem;           /* 26 */
  font-weight: 400;
  line-height: 1.625rem;
  white-space: nowrap;
}
.footer-expert__title b { font-weight: 700; }
.footer-expert__btn {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  border: 1px solid #fff;
  border-radius: 0.625rem;       /* 10 */
  color: #fff;
  font-family: var(--font-alt);
  white-space: nowrap;
  transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease;
}
.footer-expert__btn:hover {
  background: #fff;
  color: var(--green-panel);
  transform: translateY(-0.1875rem);
}
.footer-expert__ico {
  width: 1.5rem;
  height: 1.5rem;
  flex: none;
  background-color: #fff;
  -webkit-mask: var(--ico) center / contain no-repeat;
  mask: var(--ico) center / contain no-repeat;
  transition: background-color 0.3s ease;
}
.footer-expert__ico--call { --ico: url('../assets/icons/icon-call.svg'); }
.footer-expert__ico--wa { --ico: url('../assets/icons/icon-whatsapp-round.svg'); }
.footer-expert__btn:hover .footer-expert__ico { background-color: var(--green-panel); }
.footer-expert__btn--call {
  margin-top: 1.8125rem;         /* 6457-6402-26 = 29 */
  width: 19.5rem;                /* 312 */
  height: 4rem;                  /* 64 */
  padding: 0 1.25rem;
}
.footer-expert__btn--call .label { font-size: 1.25rem; font-weight: 500; }
.footer-expert__btn--call .number { font-size: 1.5rem; font-weight: 600; }
.footer-expert__btn--wa {
  margin-top: 1rem;              /* 6537-6457-64 = 16 */
  width: 19.5625rem;             /* 313 */
  height: 3.625rem;              /* 58 */
  justify-content: center;
  font-size: 1.25rem;
  font-weight: 600;
}
.footer-policy-links {
  margin-top: 1.5rem;
  color: #fff;
  font-size: 0.875rem;
  line-height: 1.6;
}
.footer-policy-links a {
  color: inherit;
  white-space: nowrap;
}
.footer-policy-links a:hover {
  text-decoration: underline;
}

/* social row */
.footer-divider--bottom { margin-top: 0; }
.footer-social-row {
  width: 98.75rem;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 2rem 0 3.3125rem;     /* 6832-6800 = 32 top; 6909-6856 = 53 bottom */
}
.footer-socials {
  display: flex;
  align-items: center;
  gap: 1.3125rem;                /* 21 */
}
.footer-socials a {
  display: flex; align-items: center; justify-content: center;
  width: 1.5rem; height: 1.5rem;
  transition: transform 0.3s ease, opacity 0.3s ease;
}
.footer-socials a:hover { transform: translateY(-0.25rem) scale(1.15); opacity: 0.85; }
.footer-socials img { max-width: 100%; max-height: 100%; width: auto; height: auto; }
.footer-copy {
  font-family: var(--font-alt);
  font-size: 1.25rem;            /* 20 */
  font-weight: 500;
  line-height: 1.25rem;
}

/* bottom white bar */
.footer-bottombar {
  background: #fff;
  height: 4.375rem;             /* 70 — Figma ~81, trimmed slightly per design review */
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6875rem;                /* 11 */
}
.footer-bottombar img {
  width: 2.75rem;                /* 44 */
  height: 1.5613rem;             /* 25 */
  object-fit: contain;
}
.footer-bottombar span {
  font-size: 1rem;               /* 16 */
  color: #000;
  font-weight: 400;
}

/* ---------- shared section headings ---------- */
.section-kicker {
  font-size: 1.25rem;            /* 20 */
  line-height: 1.25rem;
  font-weight: 500;
  color: var(--green-light);
}
.section-title {
  font-size: 2.125rem;           /* 34 */
  line-height: 2.5rem;           /* 40 */
  font-weight: 500;
  color: var(--text-dark);
  margin-top: 1.25rem;           /* 20 */
}
.section-title--white { color: #fff; }

/* ---------- slider dots ---------- */
.dot {
  width: 0.625rem; height: 0.625rem;   /* 10 */
  border-radius: 0.625rem;
  background: var(--green-light);
  cursor: pointer;
  transition: transform 0.3s ease, background-color 0.3s ease, width 0.3s ease;
}
.dot--active {
  width: 1.875rem;               /* 30 */
  background: var(--green-panel);
}
.dot--white { background: #fff; }
.dot:hover { transform: scale(1.3); background: var(--green-panel); }
.dot--white:hover { background: #fff; opacity: 0.8; }
.dot--active:hover { transform: none; }

/* ---------- company stat cards (Home / About / Service Details) ---------- */
.hc-cards {
  position: absolute;
  left: 8.8125rem;               /* 141 */
  top: 18.125rem;                /* 290 from section top */
  display: flex;
  gap: 1.578rem;                 /* 25.24 */
  z-index: 2;
}
.hc-card {
  position: relative;
  width: 24.4375rem;             /* 391 */
  height: 19.375rem;             /* 310 */
  background: var(--green-panel);
  border-radius: 1.875rem;       /* 30 */
  box-shadow: 0 2.5rem 2.5rem 0 rgba(0, 0, 0, 0.15);
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}
.hc-card:hover {
  transform: translateY(-0.625rem);
  background: var(--green-mid);
  box-shadow: 0 2.5rem 3.125rem 0 rgba(0, 0, 0, 0.25);
}
.hc-card__blob {
  position: absolute;
  left: 0; top: 0;
  /* sized as a proportion of the card (313/391 ≈ 80%, 300/310 ≈ 96.8%) so the
     blob shrinks with the card on tablet/phone instead of keeping its fixed
     desktop height and overflowing the shorter mobile card (it was clipped
     because a global img{max-width:100%} pinned the width but not the height) */
  width: 80%;                    /* 313 of 391 */
  height: 96.8%;                 /* 300 of 310 */
}
.hc-card__icon {
  position: absolute;
  left: 2.125rem;                /* 34 */
  top: 6.25rem;                  /* 100 */
  width: 6.25rem; height: 6.25rem;
}
.hc-card__icon span {
  position: absolute; inset: 0;
  border-radius: 50%;
  background: var(--green-light);
}
.hc-card__icon img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
}
.hc-card__text {
  position: absolute;
  left: 11.625rem;               /* 186 */
  /* Figma centers the number+label block vertically in the card, so a 2-line
     label (Years Of Experience) sits higher and a 1-line label (Projects) sits
     lower — both keep the group's midpoint at the card centre. Centering here
     reproduces that for any label length instead of pinning a fixed top. */
  top: 50%;
  transform: translateY(-50%);
  color: #fff;
  font-weight: 500;
}
.hc-card__num {
  font-size: 4.375rem;           /* 70 */
  line-height: 2.5rem;           /* 40 (Figma leading-40) */
}
.hc-card__label {
  font-size: 1.875rem;           /* 30 */
  line-height: 2.5rem;           /* 40 */
  margin-top: 2.5rem;            /* 40 — num-top → label-top = 40+40 = 80 (Figma) */
}

/* ---------- dark services bar pieces (Home banner / Service Details) ---------- */
/* interactive service items: flat by default, green raised card when highlighted.
   240-wide blocks centered on each column; position (left) set per bar in its own CSS. */
.bs-item {
  position: absolute;
  top: 3.125rem;                 /* flat: 50 */
  width: 15rem;                  /* 240 */
  text-align: center;
  border-radius: 1.25rem;        /* 20 */
  cursor: pointer;
  z-index: 2;
  transition: top 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
}
.bs-item .bs-icon { margin: 0 auto; transition: margin-top 0.3s ease; }
.bs-item p {
  margin-top: 1.25rem;
  font-size: 1.25rem;            /* 20 */
  line-height: 2.5rem;           /* 40 */
  font-weight: 500;
  color: #fff;
  transition: margin-top 0.3s ease;
}
.bs-item.is-highlight {
  top: -2.125rem;                /* raised 34 above the bar */
  height: 19.3125rem;            /* 309 */
  background: var(--green-mid);
  box-shadow: 0 2.5rem 2.5rem 0 rgba(0, 0, 0, 0.1);
}
.bs-item.is-highlight .bs-icon { margin-top: 3.4375rem; }   /* 55 */
.bs-item.is-highlight .bs-icon__circle { background: var(--green-icon-bg); }
.bs-item.is-highlight p { margin-top: 2.8125rem; }          /* 45 */

/* vertical "Enquire Now" column, shown beside whichever item is highlighted */
.bs-item__enquire {
  position: absolute;
  left: 100%;
  margin-left: 0.625rem;         /* 10px gap (Figma: card edge → icon group) */
  top: 4rem;                     /* bar-rel y30 − card top −34 = 64 */
  width: 3.125rem;
  height: 12.5rem;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.bs-item.is-highlight .bs-item__enquire { opacity: 1; visibility: visible; }
.bs-item__enquire img {
  position: absolute;
  left: 0; top: 0;
  width: 1.5613rem;              /* 25 */
  height: 1.5625rem;
  transform: scaleX(-1);
}
.bs-item__enquire span {
  position: absolute;
  left: 0.3125rem;               /* +5 (Figma text col offset) */
  top: 2.8125rem;                /* 45 */
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-size: 1rem;               /* 16 */
  letter-spacing: 0.3rem;        /* 4.8 */
  color: var(--green-light);
  white-space: nowrap;
  height: 9.5625rem;             /* 153 */
}

.bs-icon {
  position: relative;
  width: 8.875rem;               /* icon 100 + circle offset 42 */
  height: 6.875rem;              /* 110 */
}
.bs-icon__circle {
  position: absolute;
  left: 2.625rem;                /* +42 */
  top: 0;
  width: 6.25rem; height: 6.25rem;
  border-radius: 50%;
  background: var(--navy-card);
}
.bs-icon__circle--card { background: var(--green-icon-bg); }
.bs-icon img,
.bs-icon__qb {
  position: absolute;
  left: 0;
  top: 0.625rem;                 /* 10 */
  width: 6.25rem; height: 6.25rem;
  filter: brightness(0) invert(1); /* normalize uploaded icon colours to white */
}
/* QuickBooks icon: black source png inverted to white (robust everywhere) */
.bs-icon__qb {
  background: url("../assets/icons/service-quickbooks-mask.png") 0 0 / 6.25rem 6.25rem no-repeat;
}
.bs-divider {
  position: absolute;
  top: 1.5625rem;                /* 25 */
  height: 15.625rem;             /* 250 */
  width: 0;
  border-left: 1px solid #395d74;
}

/* ---------- inner-page header & banner ---------- */
.site-header--inner { height: 8.75rem; }   /* 140 */

.inner-banner {
  position: relative;
}
.inner-banner__band {
  position: relative;
  height: 27.75rem;              /* 444 */
  border-radius: 6.25rem 6.25rem 0 0;   /* 100 top corners */
  overflow: hidden;
}
.inner-banner__band > img {
  position: absolute;
  left: 0; top: -0.14rem;
  width: 100%;
  height: 43.2406rem;            /* 691.85 */
  object-fit: cover;
  filter: grayscale(1);
}
.inner-banner__band::before {
  content: "";
  position: absolute; inset: 0;
  background: rgba(7, 114, 91, 0.8);
  z-index: 1;
}
.inner-banner__band::after {
  content: "";
  position: absolute; inset: 0;
  background: url("../assets/images/banner-texture.png") center / cover no-repeat;
  mix-blend-mode: soft-light;
  opacity: 0.2;
  z-index: 2;
}
.inner-banner__title {
  position: absolute;
  left: 0;
  top: 11.375rem;                /* 322-140 = 182 */
  width: 100%;
  text-align: center;
  font-size: 5rem;               /* 80 */
  line-height: 5rem;
  font-weight: 400;              /* Figma: Montserrat Regular */
  color: #fff;
  z-index: 3;
}
.inner-banner__crumb {
  height: 3.125rem;              /* 50 */
  background: var(--green-light);
  display: flex;
  align-items: center;
  justify-content: center;
}
.inner-banner__crumb p {
  font-size: 1.5rem;             /* 24 */
  line-height: 2.5rem;
  font-weight: 400;
  color: #fff;
  white-space: pre;
}
.inner-banner__crumb b { font-weight: 500; }

/* ---------- white texture strip (behind footer on inner pages) ---------- */
.texture-strip {
  position: relative;
  background: #fff;
  overflow: hidden;
}
.texture-strip::after {
  content: "";
  position: absolute; inset: 0;
  background: url("../assets/images/servicesbar-texture.png") center / cover no-repeat;
  mix-blend-mode: difference;
  opacity: 0.6;
  pointer-events: none;
}

/* ============================================================
   RESPONSIVE — tablet & mobile only (desktop/laptop untouched)
   ============================================================ */
@media (max-width: 1024px) {
  body { max-width: 100%; }
  .container { width: 100%; padding: 0 24px; }

  /* header — off-canvas drawer (slides in from the right) */
  .site-header { height: 80px; z-index: 60; }
  .logo { transform-origin: left center; transform: scale(0.85); }
  .main-nav {
    position: fixed;
    top: 0; right: 0; bottom: 0;
    width: min(328px, 84vw);
    height: 100%;
    background: linear-gradient(180deg, #ffffff 0%, #f4f8f6 100%);
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    padding: 0 0 28px;
    box-shadow: -12px 0 40px rgba(0, 0, 0, 0.18);
    transform: translateX(100%);
    visibility: hidden;
    transition: transform 0.35s ease, visibility 0s linear 0.35s;
    z-index: 40;
    overflow-y: auto;
  }
  .main-nav.is-open { transform: translateX(0); visibility: visible; transition: transform 0.35s ease; }

  /* drawer brand header (logo) */
  .main-nav__brand {
    display: flex;
    align-items: center;
    height: 72px;
    padding: 0 24px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
    background: #fff;
    flex-shrink: 0;
  }
  .main-nav__brand img { height: 32px; width: auto; max-width: 78%; object-fit: contain; }

  .main-nav__list {
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    margin: 0;
    padding: 18px 14px 10px;
    width: 100%;
  }
  .main-nav__item { width: 100%; }
  .main-nav__head { display: flex; align-items: center; }
  .main-nav__item a {
    flex: 1;
    font-size: 16px;
    font-weight: 600;
    padding: 13px 14px;
    border-radius: 12px;
    text-transform: none;
    transition: background-color 0.2s ease, color 0.2s ease;
  }
  .main-nav__item > a,
  .main-nav__head > a { color: var(--text-dark); }
  .main-nav__item > a:hover,
  .main-nav__head > a:hover,
  .main-nav__head > a:active { background: rgba(28, 138, 106, 0.09); color: var(--green-mid); }
  .main-nav__item img { width: 22px; height: 22px; flex-shrink: 0; }
  .main-nav__item--services img { width: 24px; height: 24px; }
  .main-nav__item--contact img { width: 24px; height: 22px; }

  /* services accordion */
  .main-nav__sub-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 44px;
    margin-right: 6px;
    border: 0;
    background: transparent;
    color: var(--green-mid);
    cursor: pointer;
    flex-shrink: 0;
  }
  .main-nav__chevron { width: 13px; height: 9px; transition: transform 0.3s ease; }
  .main-nav__item--has-sub.is-open .main-nav__chevron { transform: rotate(180deg); }
  .main-nav__submenu {
    display: block;
    list-style: none;
    margin: 0;
    padding: 0 0 0 40px;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.35s ease, opacity 0.3s ease;
  }
  .main-nav__item--has-sub.is-open .main-nav__submenu {
    max-height: 340px;
    opacity: 1;
    margin: 2px 0 6px;
  }
  .main-nav__subitem a {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #4a5560;
    padding: 10px 14px;
    border-left: 2px solid rgba(28, 138, 106, 0.25);
    border-radius: 0 8px 8px 0;
  }
  .main-nav__subitem a:hover { background: rgba(28, 138, 106, 0.08); color: var(--green-mid); border-left-color: var(--green-mid); }

  .main-nav .btn {
    width: auto;
    height: 50px;
    margin: 12px 24px 0;
    font-size: 15px;
    border-radius: 12px;
  }

  .nav-toggle { display: flex; position: relative; z-index: 50; }  /* stays above the drawer as the close (X) */
  .nav-toggle span { transition: transform 0.3s ease, opacity 0.3s ease, background-color 0.3s ease; }
  .nav-toggle.is-active span:nth-child(1) { transform: translateY(9px) rotate(45deg); }
  .nav-toggle.is-active span:nth-child(2) { opacity: 0; }
  .nav-toggle.is-active span:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }

  /* dimmed backdrop behind the drawer (pointer-events, not visibility, so the
     opacity fade fires reliably) */
  .nav-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.35s ease;
    z-index: 30;
  }
  .nav-backdrop.is-open { opacity: 1; pointer-events: auto; }

  body.nav-open { overflow: hidden; }   /* lock page scroll while the drawer is open */

  /* dark services bar items (shared: Home banner + Service Details bar) → slider cards */
  .bs-item {
    position: static;
    flex: 0 0 200px;
    width: 200px;
    height: auto;
    padding: 18px 10px 14px;
    text-align: center;
    border-radius: 16px;
    scroll-snap-align: center;
  }
  .bs-item.is-highlight { top: 0; height: auto; }
  .bs-item.is-highlight .bs-icon { margin-top: 0; }
  .bs-item p, .bs-item.is-highlight p { margin-top: 8px; font-size: 16px; line-height: 24px; }
  .bs-item__enquire, .bs-divider, .sd-bar__arrow { display: none; }
  .bs-icon { width: 106px; height: 96px; }
  .bs-icon__circle { left: 36px; width: 84px; height: 84px; }
  .bs-icon img, .bs-icon__qb { top: 8px; width: 84px; height: 84px; background-size: 84px 84px; }

  /* inner banner */
  .inner-banner__band { height: 260px; border-radius: 32px 32px 0 0; }
  .inner-banner__band > img { height: 100%; }
  .inner-banner__title { font-size: 40px; line-height: 44px; top: 105px; }
  .inner-banner__crumb { height: 44px; }
  .inner-banner__crumb p { font-size: 16px; }

  /* company stat cards → swipeable slider */
  .hc-cards {
    position: static;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 16px;
    padding: 4px 4px 44px;         /* room for the card shadow */
    transform: translateY(60px);
  }
  .hc-cards::-webkit-scrollbar { display: none; }
  /* once JS upgrades the strip to an infinite Slick carousel, hand layout to
     Slick (variableWidth keeps each 230/250px card) and pad the list so the
     card drop-shadow isn't clipped */
  .hc-cards.slick-initialized { display: block; overflow: visible; gap: 0; }
  .hc-cards.slick-initialized .slick-list { overflow: hidden; padding: 8px 0 44px; }
  .hc-cards.slick-initialized .slick-slide { margin: 0 16px 0 0; }
  .hc-card { flex: 0 0 250px; width: 250px; height: 210px; scroll-snap-align: center; }
  .hc-card__icon { left: 20px; top: 62px; width: 68px; height: 68px; }
  .hc-card__text { left: 104px; top: 42px; transform: none; }
  .hc-card__num { font-size: 38px; line-height: 50px; }
  .hc-card__label { font-size: 17px; line-height: 24px; }

  /* footer */
  .footer-cta {
    width: calc(100% - 48px);
    height: auto;
    margin: 0 auto -120px;
    padding-bottom: 40px;
  }
  .footer-cta__inner {
    flex-direction: column;
    padding: 40px 32px 0;
    gap: 40px;
  }
  .footer-cta__left, .footer-cta__right { width: 100%; }
  .footer-form input, .footer-form textarea, .footer-form__row input { width: 100%; }
  .footer-form__row { flex-direction: row; gap: 24px; }
  .footer-cta__blob { display: none; }
  .footer-black { padding-top: 180px; }
  .footer-ab-logo { width: 200px; height: 81px; }
  .footer-divider { margin-top: 32px; }
  .footer-main { width: 100%; padding: 0 24px; min-height: 0; }
  .footer-main__heading {
    text-align: center;
    font-size: 24px;
    line-height: 30px;
  }
  .footer-branches {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px 24px;
    margin-top: 32px;
  }
  .footer-branches::before, .footer-branches::after, .footer-branches .footer-branches__hr { display: none; }
  .footer-branches__row { display: contents; margin-top: 0; }
  .footer-branches__row + .footer-branches__row { margin-top: 0; }
  .footer-branch:nth-child(1), .footer-branch:nth-child(2), .footer-branch:nth-child(3) {
    width: auto;
    flex: none;
  }
  .footer-branch__head { justify-content: center; }
  .footer-branch__head span { line-height: 24px; }
  .footer-branch__addr {
    margin: 10px auto 0;
    max-width: 100% !important;
    text-align: center;
    font-size: 15px;
    line-height: 22px;
    overflow-wrap: anywhere;
  }
  .footer-branch--poland .footer-branch__addr {
    line-height: 22px;
  }
  .footer-expert {
    position: static;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 14px;
    margin: 40px auto 0;
    width: min(100%, 520px);
  }
  .footer-expert__title {
    flex: 0 0 100%;
    text-align: center;
    white-space: normal;
  }
  .footer-expert__btn {
    margin-top: 0;
    flex: 1 1 calc(50% - 7px);
    min-width: 0;
    justify-content: center;
    text-align: center;
  }
  .footer-expert__btn--call,
  .footer-expert__btn--wa {
    width: auto;
    height: 54px;
    border-radius: 10px;
    padding: 0 12px;
    gap: 6px;
  }
  .footer-expert__ico { width: 20px; height: 20px; }
  .footer-expert__btn--call .label { font-size: 13px; }
  .footer-expert__btn--call .number { font-size: 15px; }
  .footer-expert__btn--wa { font-size: 14px; }
  .footer-policy-links {
    flex: 0 0 100%;
    margin-top: 0.75rem;
    text-align: center;
  }
  .footer-social-row {
    width: 100%;
    justify-content: center;
    padding: 24px 24px 24px;
  }
  .footer-bottombar { height: 46px; }
}

@media (max-width: 767px) {
  .container { padding: 0 16px; }
  /* shorter header bar + smaller logo on phones */
  .site-header { height: 58px; }
  .logo { width: 158px; height: 28px; transform: none; }
  .nav-toggle { padding: 4px; }
  .nav-toggle span { width: 26px; }
  .main-nav {
    width: min(300px, 86vw);
    padding: 0 0 24px;
  }
  .main-nav__brand { height: 58px; }
  .main-nav__brand img { height: 26px; }
  .main-nav__list {
    gap: 3px;
    padding: 14px 12px 8px;
    margin: 0;
  }
  .main-nav__item a {
    font-size: 15px;
    line-height: 18px;
    padding: 12px 12px;
  }
  .main-nav__subitem a { font-size: 13px; padding: 9px 12px; }
  .main-nav .btn {
    width: auto;
    height: 46px;
    margin: 10px 20px 0;
    border-radius: 11px;
    font-size: 13px;
    line-height: 16px;
  }
  .btn {
    height: 38px;
    border-radius: 9px;
    font-size: 11px;
    line-height: 14px;
    padding: 0 16px;
  }
  .section-kicker {
    font-size: 13px;
    line-height: 17px;
  }
  .section-title {
    font-size: 22px;
    line-height: 28px;
    margin-top: 10px;
  }
  .hc-card { flex-basis: 230px; width: 230px; }
  .inner-banner__band { height: 170px; border-radius: 20px 20px 0 0; }
  .inner-banner__title { font-size: 24px; line-height: 30px; top: 76px; }
  .inner-banner__crumb { height: 36px; }
  .inner-banner__crumb p { font-size: 12px; line-height: 18px; }
  .footer-cta {
    width: calc(100% - 48px);
    max-width: 360px;
    margin-bottom: -86px;
    border-radius: 16px;
    padding-bottom: 28px;
  }
  .footer-cta__inner { padding: 26px 18px 0; gap: 26px; }
  .footer-cta__kicker { font-size: 13px; }
  .footer-cta__title { font-size: 20px; margin-top: 12px; }
  .footer-form { margin-top: 24px; }
  .footer-form__row { flex-direction: column; gap: 18px; margin-top: 18px; }
  .footer-form input,
  .footer-form textarea {
    font-size: 13px;
    padding-bottom: 6px;
  }
  .footer-form textarea { margin-top: 18px; }
  .footer-form .btn {
    width: 110px;
    height: 36px;
    margin-top: 20px;
    font-size: 12px;
  }
  .footer-cta__person { gap: 18px; }
  .footer-cta__photo { width: 64px; height: 64px; border-radius: 12px; }
  .footer-cta__name { font-size: 18px; margin-top: 4px; }
  .footer-cta__role { font-size: 13px; }
  .footer-cta__desc { font-size: 13px; line-height: 22px; margin-top: 18px; }
  .footer-cta__callnow,
  .footer-cta__phone { font-size: 13px; }
  .footer-black { padding-top: 128px; }
  .footer-main { padding: 0 18px; }
  .footer-main__heading { font-size: 20px; line-height: 26px; }
  .footer-branches {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px 16px;
    margin-top: 24px;
  }
  .footer-branch:nth-child(1), .footer-branch:nth-child(2), .footer-branch:nth-child(3) { width: auto; }
  .footer-branch__head { gap: 6px; }
  .footer-branch__head img { width: 24px; height: 24px; }
  .footer-branch__head span { font-size: 14px; line-height: 18px; }
  .footer-branch__addr {
    font-size: 11px;
    line-height: 16px;
    overflow-wrap: anywhere;
  }
  .footer-branch--poland .footer-branch__addr {
    line-height: 16px;
  }
  .footer-branches__row { gap: 0; }
  .footer-expert { width: 100%; gap: 10px; }
  .footer-expert__title { font-size: 20px; line-height: 24px; }
  .footer-expert__btn {
    flex: 0 0 calc(50% - 5px);
    width: calc(50% - 5px);
    white-space: normal;
  }
  .footer-expert__btn--call, .footer-expert__btn--wa {
    flex: 0 0 calc(50% - 5px);
    max-width: none;
    border-radius: 10px;
  }
  .footer-expert__btn--call {
    min-height: 48px;
    height: auto;
    padding: 6px;
    gap: 4px;
    flex-wrap: wrap;
    line-height: 15px;
  }
  .footer-expert__ico { width: 18px; height: 18px; }
  .footer-expert__btn--call .label { font-size: 12px; }
  .footer-expert__btn--call .number { font-size: 13px; }
  .footer-expert__btn--wa {
    min-height: 48px;
    height: auto;
    font-size: 12px;
    padding: 6px;
    gap: 4px;
    line-height: 15px;
  }
  .footer-social-row {
    flex-direction: row;
    justify-content: center;
    gap: 0;
    align-items: center;
    padding: 22px 18px 22px;
  }
  .footer-bottombar span { font-size: 12px; }

}

/* Responsive type and spacing polish */
@media (max-width: 1024px) {
  body {
    font-size: 15px;
    line-height: 1.45;
  }
  p {
    font-weight: 400;
  }
  .section-kicker {
    font-size: 15px;
    line-height: 20px;
    font-weight: 400;
  }
  .section-title {
    font-size: 28px;
    line-height: 36px;
    font-weight: 500;
  }
  .btn {
    min-height: 44px;
    font-size: 14px;
    line-height: 18px;
    font-weight: 500;
  }
  .main-nav__item a {
    font-size: 16px;
    line-height: 20px;
  }
  .main-nav__subitem a { font-size: 14px; line-height: 18px; }
  .main-nav .btn {
    width: auto;
    height: 48px;
    margin: 12px 24px 0;
    font-size: 14px;
    border-radius: 12px;
  }
  .bs-item p,
  .bs-item.is-highlight p {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
  }
  .inner-banner__title {
    font-size: 34px;
    line-height: 40px;
    font-weight: 500;
  }
  .inner-banner__crumb p {
    font-size: 14px;
    line-height: 20px;
  }
  .hc-card__num {
    font-size: 34px;
    line-height: 42px;
  }
  .hc-card__label {
    font-size: 15px;
    line-height: 21px;
    font-weight: 500;
  }
  .footer-cta {
    max-width: 760px;
  }
  .footer-cta__kicker {
    font-size: 15px;
    line-height: 20px;
  }
  .footer-cta__title {
    font-size: 24px;
    line-height: 32px;
  }
  .footer-cta__desc {
    font-size: 14px;
    line-height: 23px;
  }
  .footer-form input,
  .footer-form textarea {
    font-size: 14px;
    line-height: 20px;
  }
  .footer-main__heading {
    font-size: 22px;
    line-height: 28px;
  }
  .footer-branch__addr {
    font-size: 13px;
    line-height: 19px;
    font-weight: 400;
  }
  .footer-branch--poland .footer-branch__addr {
    line-height: 19px;
  }
  .footer-expert__title {
    font-size: 22px;
    line-height: 28px;
  }
}

@media (max-width: 767px) {
  body {
    font-size: 12px;
    line-height: 1.55;
  }
  .section-kicker {
    font-size: 12px;
    line-height: 16px;
  }
  .section-title {
    font-size: 21px;
    line-height: 27px;
  }
  .btn {
    min-height: 36px;
    font-size: 12px;
    line-height: 16px;
    font-weight: 500;
  }
  .main-nav .btn {
    width: auto;
    height: 44px;
    margin: 10px 20px 0;
    font-size: 13px;
    line-height: 16px;
    border-radius: 11px;
  }
  .inner-banner__title {
    font-size: 23px;
    line-height: 29px;
  }
  .inner-banner__crumb p {
    font-size: 12px;
    line-height: 17px;
  }
  .bs-item p,
  .bs-item.is-highlight p {
    font-size: 12px;
    line-height: 17px;
  }
  .hc-card__num {
    font-size: 30px;
    line-height: 36px;
  }
  .hc-card__label {
    font-size: 13px;
    line-height: 18px;
  }
  .footer-cta__title {
    font-size: 18px;
    line-height: 24px;
  }
  .footer-cta__desc {
    font-size: 12px;
    line-height: 20px;
  }
  .footer-form input,
  .footer-form textarea {
    font-size: 12px;
    line-height: 18px;
  }
  .footer-main__heading {
    font-size: 18px;
    line-height: 24px;
  }
  .footer-branch__addr,
  .footer-branch--poland .footer-branch__addr {
    font-size: 12px;
    line-height: 18px;
  }
  .footer-expert__title {
    font-size: 18px;
    line-height: 23px;
  }
  .footer-copy {
    font-size: 12px;
    line-height: 16px;
  }
  .footer-bottombar span {
    font-size: 12px;
    line-height: 16px;
  }
}