/* МИДЯНА Консулт — шрифтове и дребни допълнения към темплейта.
   Темплейтът реферира Satoshi/Lato, които нямат кирилица — тук ги
   алиасваме към Sofia Sans (Fontfabric): шрифт, проектиран за български,
   с български форми на кирилицата. ВАЖНО: файлът е subset-нат ръчно от
   пълния SofiaSans[wght].ttf (github.com/google/fonts, OFL), където
   българските форми са по подразбиране; сервираните от Google Fonts
   woff2 са с руски форми по подразбиране и орязан locl — не ги ползвай. */

@font-face {
  font-family: 'Satoshi';
  font-style: normal;
  font-weight: 1 1000;
  font-display: swap;
  src: url('/fonts/sofia-sans-bg.woff2') format('woff2');
}

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 1 1000;
  font-display: swap;
  src: url('/fonts/sofia-sans-bg.woff2') format('woff2');
}

/* Фикс: IX2 анимацията „Slide in From Top“ (a-81) оставя навигацията
   скрита (translateY -121%) при зареждане на мобилно/таблет — поведение,
   възпроизводимо и на оригиналния темплейт. На тези ширини я фиксираме
   видима; на десктоп анимацията работи коректно и остава. */
@media (max-width: 991px) {
  .navbar nav.container {
    transform: none !important;
  }
}

/* Мобилни отстъпи за акордеона с въпросите (лентата вече е под херото,
   затова секцията получава естествения си въздух от долния отстъп на
   секцията с пакетите). */
@media screen and (max-width: 767px) {
  #vaprosi .faq-wrapper {
    padding-left: 24px;
    padding-right: 24px;
  }
  #vaprosi .contents-wrapper {
    grid-row-gap: 40px;
  }
}
@media screen and (max-width: 479px) {
  #vaprosi .faq-wrapper {
    padding-left: 18px;
    padding-right: 18px;
  }
}

/* ------------------------------------------------------------------
   Тъмна тема по желание на клиента: черен фон, бял текст.
   Неутралната палитра е обърната в fintechx.css (:root); тук се
   закърпват елементите, които ползваха същите променливи като ТЪМНИ
   фонове, плюс твърдо кодираните бели фонове. */

body {
  background-color: #0c0c0e;
}
.navbar {
  background-color: #0c0c0e;
}
/* елементи, които бяха тъмни чрез var(--neutral--500) и трябва да си останат тъмни */
.footer-section-top,
.footer-bottom {
  background-color: #131313;
}
.section-testimonial,
.slider-animation-wrapper-secondary {
  background-color: #151518;
}
/* пълнежът на тъмните бутони: тъмен в покой, при hover се открива светлата
   основа (#f9f9f9 от темплейта) — затова текстът при hover става тъмен */
.colour-change {
  background-color: #131313;
}
.secondary-button:hover {
  color: #131313;
  border-color: #f4f4f2;
}
/* мобилното меню беше светлолилаво (--primary--100) — тъмна повърхност */
@media (max-width: 991px) {
  .nav-menu-wrapper {
    background-color: #141418;
  }
}
/* кръгчетата с икони във футъра бяха сиви чрез var(--neutral--400) */
.footer-icon,
.footer-social-icon {
  background-color: #2b2b30;
}
/* белият панел на акордеона става тъмна повърхност */
.faq-wrapper {
  background-color: #17171a;
}
.dropdown-switch-white {
  color: #f4f4f2;
}
/* черните линейни SVG икони стават бели */
.icon-wrapper img.icon {
  filter: invert(1);
}
/* стрелките на слайдера при hover: светъл фон → тъмна стрелка */
.left-arrow--300:hover,
.right-arrow--300:hover {
  color: #131313;
}
/* копирайтът ползваше var(--neutral--100), който след обръщането на
   палитрата е почти черен — ставаше невидим върху тъмния футър */
.footer-copyright-text,
.footer-copyright-text.with-hover {
  color: #8b8b92;
}

/* Темплейтът клипва описанието на картата на 50px (английските текстове
   бяха по-къси). Българските се режеха — пускаме ги да се разгъват;
   картите остават еднакво високи заради .service-card { height: 100% }. */
.fixed-line-height {
  height: auto;
  min-height: 50px;
  overflow: visible;
}

/* ------------------------------------------------------------------
   Нови блокове по писмото на клиента */

/* блокът „Бизнес партньор“ следва лентата — собствен вертикален ритъм */
#partnyor {
  padding-top: 90px;
}
#partnyor .contents-wrapper {
  align-items: center;
}
@media screen and (max-width: 991px) {
  #partnyor {
    padding-top: 70px;
  }
}
@media screen and (max-width: 767px) {
  #partnyor {
    padding-top: 56px;
  }
}
@media screen and (max-width: 479px) {
  #partnyor {
    padding-top: 44px;
  }
}

/* банерът „More Than Accountant“ е с бял фон — показва се върху бяла плочка */
.partner-banner-tile {
  background-color: #ffffff;
  border-radius: 24px;
  padding: 34px 38px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.partner-banner-tile img {
  width: 100%;
  max-width: 560px;
  height: auto;
}

/* решетка „Какво получават нашите клиенти?“ */
.benefits-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  width: 100%;
  margin-top: 20px;
}
.benefit-card {
  background-color: #141416;
  border: 1px solid #232327;
  border-radius: 20px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.benefit-icon {
  font-family: 'Material Icons';
  font-size: 30px;
  line-height: 1;
  color: #5ce1e6;
  font-weight: 400;
}
@media screen and (max-width: 991px) {
  .benefits-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 639px) {
  .benefits-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .benefit-card {
    padding: 22px;
  }
}

/* по-голямо кръгло лого в контактната карта */
.contact-card .card-logo {
  width: 150px;
  height: 150px;
  margin-top: 10px;
}

/* ------------------------------------------------------------------
   Мобилна оптимизация */

@media screen and (max-width: 767px) {
  /* iOS Safari увеличава страницата при фокус в поле под 16px — това
     разваля оформлението на формата, затова полетата остават 16px. */
  .input-border-bottom,
  .input-border-bottom.name,
  .input-border-bottom.email,
  .input-border-bottom.phone,
  .input-border-bottom.subject,
  .input-border-bottom.text-area,
  .send-button {
    font-size: 16px;
  }

  /* по-удобни за пръст цели: линковете във футъра и в контактната карта */
  .footer-link,
  .footer-block .list-block a {
    padding-top: 7px;
    padding-bottom: 7px;
  }
  .footer-icon-wrapper a,
  .contact-card a {
    display: inline-block;
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .social-share-icon-container .footer-social-icon {
    min-width: 44px;
    min-height: 44px;
  }

  /* бялата плочка с банера заема по-малко от екрана */
  .partner-banner-tile {
    padding: 20px 18px;
    border-radius: 18px;
  }

  .contact-card .card-logo {
    width: 120px;
    height: 120px;
  }
}

@media screen and (max-width: 479px) {
  /* иконата-стрелка в картите заема място от текста на тесен екран */
  .service-card .texts-icon {
    grid-column-gap: 14px;
  }
}

/* Въпрос и стрелка да не се допират при пренасяне на тесни екрани */
.dropdown-switch-white {
  grid-column-gap: 14px;
}

/* Котвите се скролират от скрипт в index.html с фиксирана продължителност —
   нативният `scroll-behavior: smooth` отнемаше секунди при дълга страница.
   scroll-margin-top остава за скокове без скрипт (напр. зареждане с #хеш). */
section[id] {
  scroll-margin-top: 96px;
}

/* Логата на МИДЯНА са квадратни растерни плочки — фиксиран размер и леко
   заобляне (оригиналното SVG лого на темплейта е било широко, до 240px) */
.site-logo {
  width: 64px;
  height: 64px;
  max-width: 64px;
  border-radius: 14px;
}
.footer-logo .logo {
  width: 70px;
  height: 70px;
  max-width: 70px;
  border-radius: 14px;
}

/* ------------------------------------------------------------------
   Типографска скала — всички текстове с една идея по-малки (~12 %).
   Темплейтът задава размерите и line-height в px на всяка breakpoint,
   затова тук се предефинира всяка стойност; late-file правилата биха
   иначе надделели и над неговите media queries. */

body {
  font-size: 15px;
}

.hero-heading { font-size: 72px; line-height: 82px; }
.section-title { font-size: 42px; line-height: 52px; }
.hero-sub-heading { font-size: 19px; line-height: 29px; }
.sub-title { font-size: 17px; line-height: 25px; }
.title { font-size: 19px; }
.service-title { font-size: 21px; line-height: 31px; }
.service-summary { font-size: 15px; }
._22px-text { font-size: 19px; line-height: 28px; }
._22px-500-text { font-size: 21px; line-height: 30px; }
._18-px-title--500 { font-size: 16px; }
._32px-infinity-slide-text { font-size: 30px; line-height: 42px; }
.dropdown-switch-white { font-size: 19px; line-height: 26px; }
.contact-support-link { font-size: 19px; line-height: 26px; }
.footer-title { font-size: 21px; line-height: 30px; }
.footer-link { font-size: 16px; }
.footer-paragraph { font-size: 16px; }
._18px-white { font-size: 17px; }
.nav-link { font-size: 16px; }
.field-label { font-size: 16px; }
.input-border-bottom,
.input-border-bottom.name,
.input-border-bottom.email,
.input-border-bottom.phone,
.input-border-bottom.subject,
.input-border-bottom.text-area { font-size: 16px; }
.primary-button,
.secondary-button,
.tertiary-button,
.send-button { font-size: 16px; }

@media screen and (max-width: 991px) {
  .hero-heading { font-size: 50px; line-height: 58px; }
  ._32px-infinity-slide-text { font-size: 24px; line-height: 34px; }
  .dropdown-switch-white { font-size: 18px; line-height: 24px; }
}

@media screen and (max-width: 767px) {
  .hero-heading { font-size: 42px; line-height: 50px; }
  .section-title { font-size: 29px; line-height: 38px; }
  .hero-sub-heading { font-size: 18px; line-height: 27px; }
  .sub-title { font-size: 16px; line-height: 24px; }
  ._22px-text { font-size: 17px; line-height: 26px; }
  ._32px-infinity-slide-text { font-size: 18px; line-height: 27px; }
  ._18-px-title--500 { font-size: 15px; }
}

@media screen and (max-width: 479px) {
  .hero-heading { font-size: 31px; line-height: 40px; }
  .section-title { font-size: 26px; line-height: 34px; }
  .hero-sub-heading { font-size: 15px; line-height: 24px; }
  .sub-title { font-size: 15px; line-height: 22px; }
  ._22px-text { font-size: 15px; line-height: 22px; }
  .dropdown-switch-white { font-size: 16px; line-height: 22px; }
  .footer-title { font-size: 20px; line-height: 28px; }
  .footer-link { font-size: 15px; }
  ._18px-white { font-size: 15px; }
  /* полетата на формата умишлено НЕ слизат под 16px — виж мобилния блок
     по-горе (под 16px iOS Safari зумира при фокус) */
}