.navbar__logo img,
.mobile-menu__header .logo img,
.footer-two__left .logo img {
   width: auto;
   max-width: 340px;
   height: auto;
   max-height: 86px;
   object-fit: contain;
}

.footer-two__left .logo img {
   max-width: 460px;
   max-height: 124px;
}

.footer-two__left .section__content-cta h2 {
   font-size: 22px;
   line-height: 1.4;
   word-break: break-word;
}

.footer-two__left .section__content-cta h2 a {
   color: var(--white);
   transition: var(--transition);
}

.footer-two__left .section__content-cta h2 a:hover {
   color: var(--primary-color);
}

.footer-two__left .paragraph p {
   color: var(--quinary-color);
}

@media (max-width: 575px) {
   .navbar__logo img,
   .mobile-menu__header .logo img {
      max-width: 210px;
      max-height: 56px;
   }

   .footer-two__left .section__content-cta h2 {
      font-size: 18px;
   }
}

.skip-link {
   position: absolute;
   top: -100px;
   left: 16px;
   z-index: 9999;
   padding: 12px 20px;
   background-color: var(--primary-color);
   color: var(--black);
   font-weight: 600;
   border-radius: 4px;
   transition: var(--transition);
}

.skip-link:focus {
   top: 16px;
   color: var(--black);
}

.lang-switch {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   margin-right: 16px;
   padding: 10px 16px;
   border: 1px solid var(--octonary-color);
   border-radius: 40px;
   color: var(--white);
   font-size: 14px;
   font-weight: 600;
   letter-spacing: 0.06em;
   text-transform: uppercase;
   transition: var(--transition);
}

.lang-switch:hover,
.lang-switch:focus-visible {
   border-color: var(--primary-color);
   color: var(--primary-color);
}

.lang-switch i {
   font-size: 13px;
}

.navbar__item.active > a {
   color: var(--primary-color);
}

.lead-text {
   color: var(--white);
   font-size: 19px;
   line-height: 1.6;
}

.portfolio__single-cat {
   margin-top: 4px;
   color: var(--quinary-color);
   font-size: 14px;
   letter-spacing: 0.04em;
   text-transform: uppercase;
}

.process__single {
   height: 100%;
   padding: 32px 28px;
   background-color: var(--tertiary-color);
   border: 1px solid var(--octonary-color);
   border-radius: 8px;
   transition: var(--transition);
}

.process__single:hover {
   border-color: var(--primary-color);
   transform: translateY(-6px);
}

.process__single-num {
   display: inline-block;
   margin-bottom: 18px;
   color: var(--primary-color);
   font-size: 34px;
   font-weight: 700;
   line-height: 1;
}

.process__single h4 {
   margin-bottom: 12px;
   color: var(--white);
}

.process__single p {
   margin-bottom: 0;
   color: var(--quinary-color);
}

.stack__list {
   display: flex;
   flex-wrap: wrap;
   gap: 12px;
   margin: 0;
   padding: 0;
   list-style: none;
}

.stack__list li {
   padding: 14px 24px;
   background-color: var(--tertiary-color);
   border: 1px solid var(--octonary-color);
   border-radius: 40px;
   color: var(--white);
   font-size: 16px;
   font-weight: 500;
   transition: var(--transition);
}

.stack__list li:hover {
   border-color: var(--primary-color);
   color: var(--primary-color);
}

.cta-band {
   position: relative;
   background-color: var(--quaternary-color);
}

.cta-band__inner {
   padding: 20px 0;
}

.cta-band__inner p {
   max-width: 620px;
   margin: 0 auto 32px;
   color: var(--quinary-color);
}

.cta-band .section__content-cta {
   display: flex;
   flex-wrap: wrap;
   gap: 16px;
}

.service-card {
   height: 100%;
   padding: 36px 32px;
   background-color: var(--tertiary-color);
   border: 1px solid var(--octonary-color);
   border-radius: 8px;
   transition: var(--transition);
}

.service-card:hover {
   border-color: var(--primary-color);
   transform: translateY(-6px);
}

.service-card__num {
   display: block;
   margin-bottom: 20px;
   color: var(--primary-color);
   font-size: 15px;
   font-weight: 700;
   letter-spacing: 0.14em;
}

.service-card h4 {
   margin-bottom: 14px;
}

.service-card h4 a {
   color: var(--white);
   transition: var(--transition);
}

.service-card h4 a:hover {
   color: var(--primary-color);
}

.service-card p {
   margin-bottom: 22px;
   color: var(--quinary-color);
}

.service-card__link {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   color: var(--primary-color);
   font-weight: 600;
   transition: var(--transition);
}

.service-card__link:hover {
   color: var(--white);
}

.service-detail__points {
   margin: 28px 0;
   padding: 0;
   list-style: none;
}

.service-detail__points li {
   display: flex;
   align-items: flex-start;
   gap: 12px;
   margin-bottom: 14px;
   color: var(--quinary-color);
}

.service-detail__points li i {
   margin-top: 5px;
   color: var(--primary-color);
   font-size: 14px;
}

.service-detail__aside,
.project-detail__aside {
   position: sticky;
   top: 110px;
}

.service-detail__aside h5,
.project-detail__box h5 {
   margin-bottom: 18px;
   color: var(--white);
   font-size: 18px;
}

.service-detail__nav {
   margin: 0 0 40px;
   padding: 0;
   list-style: none;
}

.service-detail__nav li + li {
   border-top: 1px solid var(--octonary-color);
}

.service-detail__nav a {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 12px;
   padding: 16px 0;
   color: var(--quinary-color);
   transition: var(--transition);
}

.service-detail__nav a:hover {
   color: var(--primary-color);
}

.service-detail__contact {
   padding: 28px;
   background-color: var(--tertiary-color);
   border: 1px solid var(--octonary-color);
   border-radius: 8px;
}

.service-detail__contact a {
   display: flex;
   align-items: center;
   gap: 12px;
   margin-bottom: 14px;
   color: var(--quinary-color);
   word-break: break-word;
   transition: var(--transition);
}

.service-detail__contact a:last-child {
   margin-bottom: 0;
}

.service-detail__contact a:hover {
   color: var(--primary-color);
}

.service-detail__contact i {
   color: var(--primary-color);
}

.project-card {
   height: 100%;
   background-color: var(--tertiary-color);
   border: 1px solid var(--octonary-color);
   border-radius: 8px;
   overflow: hidden;
   transition: var(--transition);
}

.project-card:hover {
   border-color: var(--primary-color);
}

.project-card__thumb {
   overflow: hidden;
}

.project-card__thumb img {
   width: 100%;
   height: 280px;
   object-fit: cover;
   object-position: top center;
   transition: var(--transition);
}

.project-card:hover .project-card__thumb img {
   transform: scale(1.04);
}

.project-card__content {
   padding: 30px;
}

.project-card__cat {
   display: inline-block;
   margin-bottom: 12px;
   color: var(--primary-color);
   font-size: 13px;
   font-weight: 600;
   letter-spacing: 0.12em;
   text-transform: uppercase;
}

.project-card__content h4 {
   margin-bottom: 14px;
}

.project-card__content h4 a {
   color: var(--white);
   transition: var(--transition);
}

.project-card__content h4 a:hover {
   color: var(--primary-color);
}

.project-card__content p {
   margin-bottom: 22px;
   color: var(--quinary-color);
}

.project-card__meta {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   gap: 20px;
}

.project-card__link {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   color: var(--primary-color);
   font-weight: 600;
   transition: var(--transition);
}

.project-card__link:hover {
   color: var(--white);
}

.project-card__ext {
   color: var(--secondary-color);
   font-size: 15px;
   text-decoration: underline;
   transition: var(--transition);
}

.project-card__ext:hover {
   color: var(--white);
}

.project-detail__thumb {
   margin-bottom: 60px;
   border-radius: 8px;
   overflow: hidden;
}

.project-detail__thumb img {
   width: 100%;
   height: auto;
}

.project-detail__box {
   margin-bottom: 32px;
   padding-bottom: 32px;
   border-bottom: 1px solid var(--octonary-color);
}

.project-detail__box:last-child {
   margin-bottom: 0;
   padding-bottom: 0;
   border-bottom: 0;
}

.project-detail__box p {
   margin-bottom: 0;
   color: var(--quinary-color);
}

.project-detail__box .service-detail__points {
   margin: 0;
}

.project-detail__url {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   color: var(--primary-color);
   font-weight: 600;
   word-break: break-all;
   transition: var(--transition);
}

.project-detail__url:hover {
   color: var(--white);
}

.tag-list {
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
   margin: 0;
   padding: 0;
   list-style: none;
}

.tag-list li {
   padding: 8px 18px;
   background-color: var(--senary-color);
   border-radius: 40px;
   color: var(--quinary-color);
   font-size: 14px;
}

.next-project__all {
   display: inline-flex;
   align-items: center;
   gap: 10px;
   color: var(--quinary-color);
   font-weight: 600;
   transition: var(--transition);
}

.next-project__all:hover {
   color: var(--primary-color);
}

.next-project__next {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   gap: 6px;
   transition: var(--transition);
}

.next-project__next span {
   color: var(--secondary-color);
   font-size: 14px;
   letter-spacing: 0.1em;
   text-transform: uppercase;
}

.next-project__next strong {
   display: inline-flex;
   align-items: center;
   gap: 10px;
   color: var(--white);
   font-size: 24px;
   transition: var(--transition);
}

.next-project__next:hover strong {
   color: var(--primary-color);
}

@media (min-width: 768px) {
   .next-project__next {
      align-items: flex-end;
   }
}

.about-intro__text p {
   margin-bottom: 20px;
   color: var(--quinary-color);
}

.about-intro__text p:last-child {
   margin-bottom: 0;
}

.about-stats {
   margin-top: 70px;
}

.about-stats__single {
   padding: 30px 24px;
   background-color: var(--tertiary-color);
   border: 1px solid var(--octonary-color);
   border-radius: 8px;
   text-align: center;
   transition: var(--transition);
}

.about-stats__single:hover {
   border-color: var(--primary-color);
}

.about-stats__single h3 {
   margin-bottom: 8px;
   color: var(--primary-color);
   font-size: 40px;
   line-height: 1;
}

.about-stats__single p {
   margin-bottom: 0;
   color: var(--quinary-color);
   font-size: 15px;
}

.value-card {
   height: 100%;
   padding: 34px 30px;
   background-color: var(--tertiary-color);
   border: 1px solid var(--octonary-color);
   border-radius: 8px;
   transition: var(--transition);
}

.value-card:hover {
   border-color: var(--primary-color);
}

.value-card h4 {
   margin-bottom: 14px;
   color: var(--white);
}

.value-card p {
   margin-bottom: 0;
   color: var(--quinary-color);
}

.faq .accordion-item {
   margin-bottom: 16px;
   background-color: var(--tertiary-color);
   border: 1px solid var(--octonary-color);
   border-radius: 8px;
   overflow: hidden;
}

.faq .accordion-button {
   padding: 24px 28px;
   background-color: transparent;
   color: var(--white);
   font-size: 19px;
   font-weight: 600;
   box-shadow: none;
}

.faq .accordion-button:not(.collapsed) {
   background-color: transparent;
   color: var(--primary-color);
   box-shadow: none;
}

.faq .accordion-button:focus {
   border-color: var(--primary-color);
   box-shadow: none;
}

.faq .accordion-button::after {
   filter: invert(1) grayscale(1);
}

.faq .accordion-body {
   padding: 0 28px 26px;
}

.faq .accordion-body p {
   margin-bottom: 0;
   color: var(--quinary-color);
}

.contact__info-list {
   margin: 36px 0 0;
   padding: 0;
   list-style: none;
}

.contact__info-list li {
   display: flex;
   flex-direction: column;
   gap: 6px;
   padding: 20px 0;
   border-bottom: 1px solid var(--octonary-color);
}

.contact__info-list .label {
   color: var(--secondary-color);
   font-size: 13px;
   letter-spacing: 0.12em;
   text-transform: uppercase;
}

.contact__info-list li a,
.contact__info-list li span:not(.label) {
   color: var(--white);
   font-size: 18px;
   word-break: break-word;
   transition: var(--transition);
}

.contact__info-list li a:hover {
   color: var(--primary-color);
}

.contact__form-wrap {
   padding: 44px 40px;
   background-color: var(--tertiary-color);
   border: 1px solid var(--octonary-color);
   border-radius: 8px;
}

.contact__form-wrap h3 {
   margin-bottom: 32px;
   color: var(--white);
}

.contact__form .form-group {
   margin-bottom: 22px;
}

.contact__form label {
   display: block;
   margin-bottom: 10px;
   color: var(--quinary-color);
   font-size: 15px;
}

.contact__form input,
.contact__form textarea {
   width: 100%;
   padding: 16px 20px;
   background-color: var(--quaternary-color);
   border: 1px solid var(--octonary-color);
   border-radius: 6px;
   color: var(--white);
   font-family: var(--theme-font);
   font-size: 16px;
   transition: var(--transition);
}

.contact__form input:focus,
.contact__form textarea:focus {
   border-color: var(--primary-color);
   outline: none;
}

.contact__form textarea {
   resize: vertical;
   min-height: 150px;
}

.form-honeypot {
   position: absolute;
   left: -9999px;
   width: 1px;
   height: 1px;
   overflow: hidden;
}

.contact__feedback {
   margin-top: 20px;
   margin-bottom: 0;
   font-size: 16px;
}

.contact__feedback.is-error {
   color: #ff6b6b;
}

.contact__feedback.is-success {
   color: #4ade80;
}

.error-page {
   padding-top: 180px;
}

.error-page__code {
   margin-bottom: 20px;
   color: var(--primary-color);
   font-size: 140px;
   font-weight: 800;
   line-height: 1;
}

.error-page__content p {
   max-width: 560px;
   margin: 0 auto 36px;
   color: var(--quinary-color);
}

.error-page .section__content-cta {
   display: flex;
   flex-wrap: wrap;
   gap: 16px;
}

.footer-nav-grid {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: 30px;
   margin-bottom: 40px;
}

.footer-nav-col h5 {
   margin-bottom: 18px;
   color: var(--white);
   font-size: 17px;
}

.footer-nav-col ul {
   margin: 0;
   padding: 0;
   list-style: none;
}

.footer-nav-col ul li {
   margin-bottom: 10px;
}

.footer-nav-col ul li a {
   color: var(--quinary-color);
   font-size: 15px;
   transition: var(--transition);
}

.footer-nav-col ul li a:hover {
   color: var(--primary-color);
}

.footer-location {
   display: flex;
   align-items: center;
   gap: 12px;
   color: var(--quinary-color);
}

.footer-location i {
   color: var(--primary-color);
}

.agency .agency__thumb {
   position: relative;
   min-height: 420px;
}

.agency .agency__thumb img {
   border-radius: 8px;
}

.agency .agency__thumb .thumb-one {
   position: absolute;
   top: 0;
   left: 0;
   width: 72%;
   max-width: 380px;
   height: auto;
   box-shadow: 0 18px 40px rgba(0, 0, 0, 0.55);
}

.agency .agency__thumb .thumb-two {
   position: absolute;
   right: 0;
   bottom: 0;
   top: auto;
   width: 58%;
   max-width: 300px;
   height: auto;
   border: 4px solid var(--theme-bg);
   box-shadow: 0 18px 40px rgba(0, 0, 0, 0.55);
}

@media (max-width: 991px) {
   .agency .agency__thumb {
      min-height: 340px;
   }
}

@media (max-width: 575px) {
   .agency .agency__thumb {
      min-height: 260px;
   }

   .agency .agency__thumb .thumb-one {
      width: 78%;
   }

   .agency .agency__thumb .thumb-two {
      width: 62%;
   }
}

@media (max-width: 575px) {
   .lang-switch {
      margin-right: 10px;
      padding: 8px 12px;
      font-size: 13px;
   }

   .contact__form-wrap {
      padding: 30px 22px;
   }

   .error-page__code {
      font-size: 90px;
   }

   .footer-nav-grid {
      grid-template-columns: 1fr;
   }
}

.header .primary-navbar .navbar {
   min-height: 104px;
}

.header .navbar__logo {
   flex-shrink: 0;
}

@media (max-width: 575px) {
   .header .primary-navbar .navbar {
      min-height: 76px;
   }
}
