/* FIA sp. z o.o. — statyczna wersja strony (v2)
   Wartości odwzorowane 1:1 z oryginału (WordPress + Elementor). */

/* ---------- Fonty ---------- */
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 300; font-display: swap; src: url(../fonts/poppins-300-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 300; font-display: swap; src: url(../fonts/poppins-300-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/poppins-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/poppins-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/poppins-600-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/poppins-600-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/montserrat-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 100 900; font-display: swap; src: url(../fonts/montserrat-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'FA Solid'; font-style: normal; font-weight: 900; font-display: block; src: url(../fonts/fa-solid-900.woff2) format('woff2'); }

/* ---------- Zmienne ---------- */
:root {
  --navy: #1C4050;
  --green: #1DAF8E;
  --grey: #F3F5F8;
  --white: #FFFFFF;
  --font: 'Poppins', sans-serif;
  --font-alt: 'Montserrat', sans-serif;
  --font-system: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --h-size: 40px;
  --h-lh: 1.2em;
  --text-size: 16px;
  --sub-size: 22px;
  --btn-size: 16px;
  --pad-y: 4%;
  --pad-x: 8%;
  --gap: 20px;
}
@media (max-width: 1024px) {
  :root { --h-size: 45px; --text-size: 14px; --sub-size: 14px; --btn-size: 14px; }
}
@media (max-width: 767px) {
  :root { --h-size: 28px; --h-lh: 1.1em; }
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--white); color: #333; font-family: var(--font-system); font-size: 16px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; border: 0; vertical-align: middle; }
a { color: inherit; text-decoration: none; }
p { margin: 0 0 0.9rem; }
h1, h2, h3, h4, h5, h6 { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: -9999px; top: -9999px; }
.skip-link:focus { left: 8px; top: 8px; padding: 8px 12px; background: var(--white); color: var(--navy); z-index: 10000; }

/* Ikony Font Awesome (podzbiór) */
.icon::before { font-family: 'FA Solid'; font-weight: 900; font-style: normal; display: inline-block; line-height: 1; -webkit-font-smoothing: antialiased; }
.fa-map-marker-alt::before { content: "\f3c5"; }
.fa-mail-bulk::before { content: "\f674"; }
.fa-phone-alt::before { content: "\f879"; }

/* ---------- Typografia wspólna ---------- */
.h1, .h2 { color: var(--navy); font-family: var(--font); font-size: var(--h-size); font-weight: 600; line-height: var(--h-lh); margin-bottom: var(--gap); }
.h2--center { text-align: center; }
.h2--inset { margin: 15px 15px 35px; }
.h6 { color: var(--navy); font-family: var(--font); font-size: var(--sub-size); font-weight: 300; line-height: 1.5em; margin-bottom: var(--gap); }
.text { display: flow-root; color: var(--navy); font-family: var(--font); font-size: var(--text-size); font-weight: 300; line-height: 1.5em; }
.text--justify { text-align: justify; }
.text:not(:last-child) { margin-bottom: var(--gap); }

/* ---------- Przyciski ---------- */
.btn { display: inline-block; background: var(--green); color: var(--white); font-family: var(--font); font-size: var(--btn-size); font-weight: 400; line-height: 1; text-align: center; padding: 12px 24px; border-radius: 3px; transition: all .3s; }
.btn--outline { background: transparent; border: 2px solid var(--white); }
.btn-row { text-align: right; }

/* ---------- Nagłówek ---------- */
.site-header { position: sticky; top: 0; z-index: 100; background: rgba(255, 255, 255, .95); padding: 5px 4px; }
.site-header__inner { max-width: 1140px; margin: 0 auto; display: flex; align-items: center; }
.site-header__logo { width: 3.35%; min-width: 46px; padding: 5px; line-height: 0; text-align: center; }
.site-header__logo img { width: 35px; height: 35px; }
.site-header__title { padding: 5px 5px 5px 0; flex: 0 0 auto; font-size: 24px; line-height: 1.1em; }
.site-header__title a { color: var(--navy); font-family: var(--font); font-size: 24px; font-weight: 600; line-height: 1.1em; }
.site-nav { margin-left: auto; position: relative; }
.site-nav__list { display: flex; justify-content: flex-end; }
.site-nav__list a { display: flex; align-items: center; position: relative; color: var(--navy); font-family: var(--font); font-size: 22px; font-weight: 600; line-height: 1.2em; padding: 13px 20px; }
.site-nav__list a::after { content: ""; position: absolute; left: 20px; right: 20px; bottom: 10px; height: 3px; background: var(--green); transform: scaleX(0); transform-origin: left; transition: transform .3s; }
.site-nav__list a:hover::after, .site-nav__list a:focus-visible::after { transform: scaleX(1); }
.site-nav__toggle { display: none; align-items: center; justify-content: center; width: 33px; height: 33px; padding: 5.5px; border-radius: 3px; background: rgba(0, 0, 0, .05); color: #33373d; }
.site-nav__toggle-icon { position: relative; display: block; width: 22px; height: 22px; }
.site-nav__toggle-icon::before { content: ""; position: absolute; left: 1px; right: 1px; top: 4px; height: 3px; background: currentColor; border-radius: 1px; box-shadow: 0 7px 0 currentColor, 0 14px 0 currentColor; transition: .2s; }
.site-nav__toggle[aria-expanded="true"] .site-nav__toggle-icon::before { box-shadow: none; top: 9.5px; transform: rotate(45deg); }
.site-nav__toggle[aria-expanded="true"] .site-nav__toggle-icon::after { content: ""; position: absolute; left: 1px; right: 1px; top: 9.5px; height: 3px; background: currentColor; border-radius: 1px; transform: rotate(-45deg); }
.site-nav__dropdown { display: none; }

@media (max-width: 1024px) {
  .site-header__inner { max-width: 1024px; }
  .site-nav__list { display: none; }
  .site-nav__toggle { display: flex; }
  .site-nav__dropdown { display: block; position: absolute; left: 0; right: 0; top: 100%; margin-top: 10px; background: var(--white); box-shadow: 0 3px 10px rgba(0, 0, 0, .1); max-height: 0; overflow: hidden; transform: scaleY(0); transform-origin: top; transition: max-height .3s, transform .3s; }
  .site-nav__dropdown.is-open { max-height: 600px; transform: scaleY(1); }
  .site-nav__dropdown-list a { display: flex; align-items: center; justify-content: center; padding: 10px 20px; border-inline-start: 8px solid transparent; color: #33373d; font-family: var(--font); font-size: 45px; font-weight: 600; line-height: 1.1em; }
  .site-header__title, .site-header__title a { font-size: 25px; }
  .site-nav__dropdown-list a:hover, .site-nav__dropdown-list a:focus { background: #3f444b; color: var(--white); }
  .site-nav__dropdown-list li:not(:last-child) { border-bottom: 1px solid rgba(0, 0, 0, .1); }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .site-header__inner { flex-wrap: nowrap; }
  .site-nav { flex: 1 1 auto; display: flex; justify-content: center; }
  .site-nav__dropdown { left: 0; right: 0; }
  .site-header { position: relative; }
}
@media (max-width: 767px) {
  .site-header { padding: 0; }
  .site-header__inner { flex-direction: column; align-items: stretch; }
  .site-header__logo { width: 100%; padding: 0; }
  .site-header__logo img { width: 25%; height: 35px; max-width: 94px; }
  .site-header__title { padding: 0; text-align: center; font-size: 20px; }
  .site-header__title a { font-size: 20px; line-height: 1.1em; }
  .site-nav { margin: 10px auto; }
  .site-nav__dropdown-list a { font-size: 28px; }
  .site-nav__dropdown { position: fixed; left: 6px; right: 6px; top: 110px; }
  .site-nav__toggle { margin: 0 auto; }
}

/* ---------- Slider ---------- */
.slider { position: relative; height: 40vh; overflow: hidden; color: var(--white); }
.slider__track { display: flex; height: 100%; transition: transform .5s ease; will-change: transform; }
.slider__track.no-transition { transition: none; }
.slide { flex: 0 0 100%; height: 100%; display: flex; align-items: center; justify-content: center; text-align: center; padding: 50px; }
.slide--navy { background: var(--navy); }
.slide--green { background: var(--green); }
.slide__inner { max-width: 50%; }
.slide__heading { font-family: var(--font); font-size: 40px; font-weight: 600; line-height: 1.2em; margin-bottom: 30px; }
.slide__desc { font-family: var(--font); font-size: 16px; font-weight: 600; line-height: 2em; margin-bottom: 30px; }
.slider__dots { position: absolute; left: 0; right: 0; bottom: 5px; text-align: center; line-height: 24px; z-index: 5; }
.slider__dots button { display: inline-block; width: 6px; height: 6px; margin: 0 6px; border-radius: 50%; background: #000; opacity: .2; vertical-align: middle; transition: opacity .3s; }
.slider__dots button[aria-selected="true"] { opacity: 1; }
.slider__arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 25px; height: 25px; z-index: 5; color: rgba(238, 238, 238, .9); background: center / 100% no-repeat; }
.slider__arrow--prev { left: 10px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1000'%3E%3Cpath fill='%23eeeeee' fill-opacity='.9' d='M646 125c14 0 28 5 39 16 22 22 22 57 0 79L406 500l279 280c22 22 22 57 0 79s-57 22-79 0L287 540c-22-22-22-57 0-79l319-320c11-11 26-16 40-16z'/%3E%3C/svg%3E"); }
.slider__arrow--next { right: 10px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 1000'%3E%3Cpath fill='%23eeeeee' fill-opacity='.9' d='M354 875c-14 0-28-5-39-16-22-22-22-57 0-79l279-280-279-280c-22-22-22-57 0-79s57-22 79 0l319 320c22 22 22 57 0 79L393 859c-11 11-25 16-39 16z'/%3E%3C/svg%3E"); }
@media (max-width: 1024px) {
  .slide__heading { font-size: 45px; }
  .slide__desc { font-size: 25px; line-height: 1.1em; }
}
@media (max-width: 767px) {
  .slide { padding: 30px; }
  .slide__inner { max-width: 85%; }
  .slide__heading { font-size: 27.3px; line-height: 1.1em; }
  .slide__desc { font-size: 11.7px; line-height: 2em; }
}

/* ---------- Sekcje ---------- */
.sec { position: relative; display: flow-root; }
.sec--grey { background: var(--grey); }
.sec--pad { padding: var(--pad-y) var(--pad-x); }

/* Jak możemy pomóc */
.sec--intro { display: flex; align-items: stretch; min-height: 760px; padding-left: var(--pad-x); }
.intro__text { flex: 0 0 43%; display: flex; flex-direction: column; justify-content: center; padding-right: 2.15%; /* 5% szerokości kolumny */ }
.intro__media { flex: 1 1 57%; display: flex; flex-direction: column; justify-content: center; padding: 20px; text-align: center; }
.intro__media img { width: 99.5%; }
.spacer { height: 50px; }

/* O nas */
.sec--about { display: flex; align-items: center; min-height: 400px; }
.about__inner { width: 100%; padding: var(--pad-y) var(--pad-x); }
.about__inner .text { margin-bottom: 0; }

/* Dwie kolumny */
.two-col { display: flex; }
.two-col__text, .two-col__media, .two-col__side { flex: 0 0 50%; min-width: 0; padding: 10px; }
.two-col__text { margin-right: 80px; flex-basis: calc(50% - 80px); }
.two-col--media-left .two-col__media { margin-right: 80px; flex-basis: calc(50% - 80px); text-align: center; }
.two-col--media-left .two-col__text { margin-right: 0; flex-basis: 50%; }
.two-col__text--center { display: flex; flex-direction: column; justify-content: center; }
.two-col__media { text-align: center; }
.two-col__media--narrow img { max-width: 82.18%; }
.two-col__text img { width: 100%; }
.two-col__side .text:last-child { margin-bottom: 0; }

/* Trzy kolumny */
.three-col { display: flex; padding: 10px; padding-top: calc(var(--pad-y) + 10px); }
.three-col__item { flex: 0 0 33.333%; min-width: 0; }
/* procenty liczone od szerokości kolumny (jak w Elementorze): 20% i 10% z 33,33% */
.three-col__item:nth-child(1) { padding-right: 6.667%; }
.three-col__item:nth-child(2) { padding: 0 3.333%; }
.three-col__item:nth-child(3) { padding-left: 6.667%; }
.three-col .text { margin-bottom: 0; }

/* Toggle (Sprzedaż gazów, Regulacja F-Gas) */
.toggle__item { margin-bottom: -15px; }
.toggle--tight .toggle__item { margin-bottom: -20px; }
.toggle:not(:last-child) { margin-bottom: var(--gap); }
.toggle--tight { margin-top: -25px; margin-bottom: 20px; }
.toggle__title { display: block; padding: 15px; cursor: pointer; list-style: none; color: var(--navy); font-family: var(--font); font-size: var(--text-size); font-weight: 300; line-height: 1.5em; outline: none; }
.toggle__title::-webkit-details-marker { display: none; }
.toggle__icon { display: inline-block; width: 16px; text-align: left; font-family: 'FA Solid'; font-weight: 900; font-size: 16px; line-height: 1; vertical-align: middle; }
.toggle__icon::before { content: "\f0d7"; }
.toggle__item[open] .toggle__icon::before { content: "\f0d8"; }
.toggle__item[open] .toggle__title { color: var(--green); }
.toggle__content { display: flow-root; padding: 0 0 15px 30px; color: var(--navy); font-family: var(--font); font-size: var(--text-size); font-weight: 300; line-height: 1.5em; }
.toggle--tight .toggle__content { padding: 15px; }

/* Akordeon (FAQ) */
.accordion__item { border: 1px solid #d5d8dc; }
.accordion__item + .accordion__item { border-top: 0; }
.accordion__title { display: flex; align-items: center; padding: 15px 20px; cursor: pointer; list-style: none; color: var(--green); font-family: var(--font); font-size: var(--text-size); font-weight: 300; line-height: 1.5em; outline: none; }
.accordion__title::-webkit-details-marker { display: none; }
.accordion__text { flex: 1 1 auto; }
.accordion__icon { order: 2; flex: 0 0 auto; width: 24px; text-align: right; font-family: 'FA Solid'; font-weight: 900; font-size: 16px; line-height: 1; }
.accordion__icon::before { content: "\f067"; }
.accordion__item[open] .accordion__icon::before { content: "\f068"; }
.accordion__content { display: flow-root; padding: 15px 20px; border-top: 1px solid #d5d8dc; color: var(--navy); font-family: var(--font); font-size: var(--text-size); font-weight: 300; line-height: 1.5em; }

/* Kalkulator (celowo w foncie systemowym, jak w oryginale) */
.calc { max-width: 429px; margin: 50px auto 0; padding: 20px; border: 1px solid var(--navy); border-radius: 5px; background: #E0E0E0; color: var(--navy); font-family: var(--font-system); }
.calc__title { margin: 8px 0 10px; color: var(--navy); font-size: 32px; font-weight: 500; line-height: 1.2; }
.calc__label { display: block; margin-bottom: 5px; color: var(--navy); font-size: 16px; line-height: 1; }
.calc__field { width: 100%; padding: 10px; margin-bottom: 10px; border: 1px solid var(--navy); border-radius: 5px; background: var(--white); color: var(--green); font: inherit; font-size: 16px; }
.calc__result { margin-top: 10px; font-weight: bold; color: var(--navy); }
.calc__note { margin-top: 5px; font-size: 12px; color: var(--navy); }

/* Kontakt */
.contact { max-width: 740px; margin: 0 auto; padding-top: 15px; text-align: center; }
.contact .h2 { margin-bottom: 15px; }
.contact__name { color: var(--navy); font-family: var(--font); font-size: 26px; font-weight: 600; line-height: 1.2em; margin-bottom: 15px; }
.contact__line { color: var(--navy); font-family: var(--font); font-size: var(--text-size); font-weight: 300; line-height: 1.5em; margin-bottom: 15px; }
.contact__small { display: flow-root; color: var(--navy); font-family: var(--font); font-size: 11px; font-weight: 300; line-height: 1.5em; }

/* ---------- Stopka ---------- */
.site-footer { margin: 50px 0; padding: 0 5%; }
.site-footer__top { display: flex; align-items: center; }
.site-footer__logo { flex: 0 0 18.45%; line-height: 0; }
.site-footer__logo img { width: 48px; height: 48px; }
.site-footer__nav { flex: 1 1 auto; }
.site-footer__list { display: flex; justify-content: flex-end; }
.site-footer__list a { display: flex; align-items: center; margin-right: 25px; color: #000; font-family: var(--font-alt); font-size: 16px; font-weight: 300; line-height: 1.2em; }
.site-footer__list li:last-child a { margin-right: 0; }
.site-footer__divider { padding: 35px 0; }
.site-footer__divider span { display: block; height: 1px; }
.site-footer__bottom { display: flex; color: var(--navy); }
.site-footer__mail, .site-footer__copy { flex: 0 0 50%; }
.site-footer__mail, .site-footer__copy { display: flow-root; }
.site-footer__mail { font-family: var(--font-alt); font-size: 15px; font-weight: 300; line-height: 1.5em; }
.site-footer__copy { font-family: var(--font-alt); font-size: 14px; font-weight: 200; line-height: 1.5em; text-align: right; }

/* ---------- Tablet ---------- */
@media (max-width: 1024px) {
  .sec--intro { flex-direction: column; min-height: 70vh; margin-top: 8%; padding-left: 0; }
  .intro__text { flex-basis: auto; padding: 0 15% 10% 15%; }
  .intro__media { flex-basis: auto; }
  .sec--about { margin-top: 25%; padding: 0 5%; }
  .spacer { height: 50vh; }
  .two-col__text, .two-col--media-left .two-col__media { margin-right: 0; flex-basis: 50%; }
  .two-col:has(.two-col__side) .two-col__text { margin-right: 80px; flex-basis: calc(50% - 80px); }
  .three-col { flex-direction: column; }
  .three-col__item { flex-basis: auto; padding: 0 15% !important; }
  .three-col__item + .three-col__item { margin-top: 10%; }
  .sec--contact { margin-bottom: 25%; }
  .site-footer { margin: 100px 0 50px; }
  .contact { max-width: 410px; }
  .sec--pad { padding: 0 5%; }
  #import { margin-top: 15%; }
  #gases, .sec--pad:has(.calc) { margin-top: 25%; }
  .sec--pad:not(#import):not(#gases):not(:has(.calc)) { margin-top: 15%; }
  .sec--contact { margin-top: 25%; }
}

/* ---------- Mobile ---------- */
@media (max-width: 767px) {
  .slider { height: 70vh; }
  .sec--intro { flex-direction: column; min-height: 85vh; margin-top: 8%; }
  .intro__text { flex-basis: auto; padding: 0 5% 10%; }
  .intro__media { flex-basis: auto; }
  .spacer { height: 10px; }
  .sec--about { margin-top: 5vw; min-height: 300px; padding: 0 5%; }
  .about__inner { padding: 4% 8%; }
  .sec--pad { padding: 0 5%; margin-top: 5%; }
  #import, .sec--pad:has(.two-col__media--narrow) { margin-top: 15%; }
  #gases { margin-top: 5vw; }
  .sec--contact { margin-top: 5%; margin-bottom: 5%; }
  .two-col { flex-direction: column; }
  .two-col__text, .two-col__media, .two-col__side { flex-basis: auto; }
  .two-col--media-left .two-col__media { flex-basis: auto; width: calc(100% - 80px); }
  .two-col__text { width: calc(100% - 80px); }
  .two-col--media-left .two-col__text { width: 100%; }
  .three-col { padding: 0; }
  .three-col__item { padding: 0 !important; }
  .three-col__item + .three-col__item { margin-top: 20%; }
  .h2--inset { margin: 0 0 20px; }
  .accordion__title, .accordion__content { padding: 15px; }
  .contact__name { font-size: 28px; line-height: 1.1em; }
  .site-footer { margin: 0; padding: 0 5%; }
  .site-footer__top { flex-direction: column; align-items: flex-start; }
  .site-footer__logo { flex-basis: auto; align-self: center; }
  .site-footer__logo img { width: 75px; height: 75px; }
  .site-footer__nav { width: 100%; padding-top: 35px; }
  .site-footer__list { flex-wrap: wrap; justify-content: flex-end; }
  .site-footer__list a { margin: 0 10px; padding: 10px 0; }
  .site-footer__divider { padding: 30px 0; }
  .site-footer__bottom { flex-direction: column; }
  .site-footer__mail, .site-footer__copy { flex-basis: auto; text-align: center; }
  .site-footer__copy { margin-top: 20px; font-size: 12px; }
}