body, html { height: 100%; margin: 0; font-family: "Barlow", sans-serif; color: #acacac; }
section { scroll-margin-top: 64px; }

.btn { border-width: 2px; }
.btn-primary { background-color: #f2a000; border-color: #f2a000; }
.btn-primary:hover { background-color: #f3a919; border-color: #f3a919; }

.navbar { z-index: 2; padding: 0; transition: background-color 0.3s ease; }
.navbar.scrolled { background-color: rgba(37, 37, 37, 0.85); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); }
.navbar .navbar-brand { padding: 0; margin: 0 0 0 -12px; display: flex; align-items: center; }
.navbar .container { border-bottom: 2px solid #FFF; padding-top: 15px; padding-bottom: 5px; }
.navbar .nav-item { display: flex; align-items: center; justify-content: center; }
.navbar .nav-link { color: #fff; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; }
.navbar .btn { font-size: 17px; font-weight: 700; text-transform: uppercase; }
.navbar-collapse { margin-right: -12px; }
.navbar-toggler { padding: 4px 6px; margin-top: -5px; }
.navbar-toggler-icon { width: 24px; height: 24px; }

.hero-section { background-size: cover; background-position: center; color: #fff; height: 610px; display: flex; flex-direction: column; }
.hero-content { z-index: 1; text-align: center; margin-top: auto; margin-bottom: auto; }
.hero-content p { font-size: 14px; letter-spacing: 4px; text-transform: uppercase; margin-bottom: 0; }
.hero-content h1 { font-size: 46px; }
.hero-content .btn { font-size: 16px; font-weight: 800; padding: 12px 20px; letter-spacing: 2px; text-transform: uppercase; }

.topic-section { padding: 25px 0; background: #f19f00; }
.topic-section p { margin: 0; color: #fff; }
.topic-section img { margin-right: 10px; }
.topic-section .topic-container { display: flex; justify-content: space-between; }
.topic-section .topic-item { display: flex; align-items: center; }

.section-tag { background: #f19f00; font-size: 14px; color: #fff; font-weight: 700; text-transform: uppercase; padding: 5px 10px; letter-spacing: 1px; border: 1px solid #acacac; }
.section-header { margin-top: 35px; }
.section-header h2 { font-size: 42px; font-weight: 500; color: #acacac; margin: 0 0 5px; }
.section-header p { font-size: 18px; font-weight: 300; }

.feature-section { padding: 70px 0; }
.feature-section .feature-item { border: 2px solid #acacac; padding: 40px 15px 10px; }
.feature-section .feature-item .feature-title { margin: 15px 0; padding-bottom: 15px; border-bottom: 2px solid #acacac; min-height: 78px; }
.feature-section .feature-item .feature-title h3 { font-size: 25px; font-weight: 400; margin: 0; }
.feature-section .feature-item:hover { background: #f2a000; color: #fff; border-color: #f2a000; }
.feature-section .feature-item:hover .feature-title { border-color: #fff; }
.feature-section .feature-item:hover .feature-title h3 { color: #fff; }
.feature-section .feature-item .feature-image { overflow: hidden; }
.feature-section .feature-item:hover .feature-image img { filter: drop-shadow(0 100px 0 #e66400); transform: translateY(-100px); }
.feature-section .feature-item ul { margin-bottom: 20px; }
.feature-section .feature-item .btn { border: none; background-color: #acacac; text-transform: uppercase; font-size: 17px; display: flex; justify-content: space-between; align-items: center; padding: 8px 20px; color: #fff; }
.feature-section .feature-item:hover .btn { border-color: #acacac; background-color: #e66400; }

.banner-section { background-size: cover; background-position: center; padding: 120px 0; }
.banner-section h3 { color: #fff; font-weight: 500; text-transform: uppercase; font-size: 54px; margin: 0; }
.banner-section p { font-size: 32px; font-weight: 500; color: #fff; }
.banner-section .btn { text-transform: uppercase; padding: 8px 20px; }

.about-section { padding: 70px 0; }
.about-section .section-header { margin-bottom: 70px; }
.about-section .icon-text { right: 15px; bottom: 60px; width: 75%; background-color: #252525; padding: 20px; }
.about-section .icon-text p { font-size: 12px; color: #fff; }
.about-section .icon-text .btn { background-color: #fff; text-transform: uppercase; font-size: 17px; font-weight: 500; }
.about-section .icon-text .btn i { color: #f2a000; }

.about-section .accordion-button { font-size: 25px; color: #acacac; }
.about-section .accordion-button::after { background-image: url('../images/accordion-more.png'); background-size: auto; background-position: center; }
.about-section .accordion-button:not(.collapsed)::after { background-image: url('../images/accordion-less.png'); }
.about-section .accordion-button:not(.collapsed) { background: none; box-shadow: none; }
.about-section .accordion-body { padding-top: 0; color: #acacac; }

.tabs-section { background-color: #ebebeb; }
.tabs-section .tabs-header { background-color: #555555; padding: 135px 0; text-align: center; }
.tabs-section .tabs-header h2 { font-size: 42px; color: #fff; font-weight: 400; }
.tabs-section .tabs-header h2 strong { text-transform: uppercase; color: #f2a000; }
.tabs-section .nav-tabs .nav-link { color: #acacac; font-size: 15px; padding: 20px 0; border: none; border-radius: 0; }
.tabs-section .nav-tabs .nav-link.active { border-bottom: 2px solid #f2a000; background: none; }
.tabs-section .tab-content { padding: 50px 0; }
.tabs-section .tab-pane h3 { font-size: 20px; font-weight: 500; }
.tabs-section .tab-pane .btn { border: none; background-color: #acacac; text-transform: uppercase; font-size: 17px; display: flex; justify-content: space-between; align-items: center; padding: 8px 20px; color: #fff; margin: 0 0 20px 20px; }

.projects-section { padding: 70px 0; }
.feature-section + .projects-section { padding-top: 0; }
.projects-section .section-filter  { margin: 10px 0 30px; }
.projects-section .section-filter .nav-item + .nav-item { border-left: 2px solid #f2a000; margin-left: 15px; padding-left: 15px; }
.projects-section .section-filter .nav-link { color: #acacac; font-size: 16px; text-transform: uppercase; font-weight: 300; padding: 0; line-height: 100%; }
.projects-section .card { border: none; }
.projects-section .card .btn { position: absolute; bottom: 10px; left: 0; margin-left: 10px; text-transform: uppercase; background-color: transparent; color: #fff; border-color: #fff; width: calc(100% - 20px); display: flex; align-items: center; justify-content: space-between; }
.projects-section .card-body h3 { color: #acacac; font-size: 25px; text-transform: uppercase; font-weight: 400; }
.projects-section .card-body p { color: #acacac; margin-bottom: 0; }
.projects-section .btn-outline { font-weight: 600; border-color: #acacac; color: #acacac; text-transform: uppercase; padding: 10px 50px; }

.contact-section { padding-bottom: 70px; }
.contact-section .form-section { background-position: top center; background-size: 100% auto; background-repeat: no-repeat; margin-top: 40px; }
.contact-section .form-section .form-container { background: #fff; border: 2px solid #acacac; margin-top: -90px; padding: 35px 20px 20px; }
.contact-section .form-section h3 { font-size: 25px; font-weight: 400; margin: 0; }
.contact-section .form-section hr { width: 45%; border-top: 2px solid #acacac; margin: 20px 0; }
.contact-section .form-section label { font-size: 14px; margin-bottom: 4px; }
.contact-section .form-section .btn { background-color: #e66400; border-color: #acacac; text-transform: uppercase; color: #fff; padding: 8px 50px; }

.project-about { margin-top: 36px; }
.project-about h3 { color: #f2a000; font-size: 20px; text-transform: uppercase; font-weight: 400; }
.project-gallery { margin-top: 20px; }
.project-gallery img { border: 1px solid #acacac; }
.project-blueprint { margin-top: 70px; }
.project-blueprint h3 { color: #f2a000; font-size: 20px; text-transform: uppercase; font-weight: 400; }
.project-blueprint .nav-link { font-size: 14px; color: #acacac; text-align: left; padding: 4px 0; }
.project-blueprint .nav-link.active { background-color: transparent; font-weight: bold; color: inherit; }

.text-section { padding: 70px 0; }
.text-section + .text-section { padding-top: 0; scroll-margin-top: 134px; }
.text-section h2 { color: #f2a000; font-weight: 400; text-transform: uppercase; font-size: 38px; margin-bottom: 20px; }
.text-section h3 { color: #333333; font-weight: 400; text-transform: uppercase; font-size: 16px; margin-bottom: 20px; }
.text-section ul { padding-left: 20px; }
.text-section ul li { font-style: italic; }
.text-section ul li::marker { color: #f2a000; }

footer { padding-top: 50px; background: #252525; }
footer ul { margin-bottom: 30px; }
footer a { color: #fff; text-transform: uppercase; text-decoration: none; }

.btn-whatsapp { position: fixed; bottom: 0; right: 0; margin: 30px; border-radius: 50%; background: #25d366; }
.btn-whatsapp i { font-size: 30px; line-height: 42px; color: #fff; }
.btn-whatsapp:hover { background: #25d366; }

.grecaptcha-badge { display: none !important; }

@media (max-width: 1199px) {
  .contact-section .form-section { background-size: auto; }

}

@media (max-width: 991px) {
  section { scroll-margin-top: 55px; }

  .navbar .navbar-brand { margin-left: 0; }
  .navbar-collapse { background-color: rgba(0, 0, 0, 0.85); padding: 1rem 0; text-align: center; margin-top: 1rem; margin-right: 0; }
  .navbar .container { padding-left: 12px; padding-right: 12px; border: none; padding-bottom: 10px; }

  .topic-section .topic-container { flex-direction: column; }
  .topic-section .topic-item { margin-bottom: 10px; }

  .projects-section { padding: 50px 0; }

  .feature-section .feature-item { padding: 15px; }

  .tabs-section .tabs-header { padding: 70px 0;}
  .tabs-section .tab-content { padding-top: 0; }

  .contact-section .form-section { background-position: center 90px; }
  .contact-section .form-section .form-container { margin-top: 0; }
}

@media (max-width: 767px) {
  .feature-section { padding: 50px 0;}
  .feature-section .feature-item .feature-title { min-height: inherit; }

  .banner-section { padding: 80px 0; }
  .banner-section h3 { font-size: 42px;}

  .about-section { padding: 50px 0; }

  .contact-section { padding-bottom: 50px; }

  .text-section { padding: 50px 0; }
}