@import url("https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap");
/*===========================
  COMMON css 
===========================*/
:root {
  --font-family: "Inter", sans-serif;
  --primary: #155bd5;
  --primary-dark: #1c3ab6;
  --primary-light: #e2f1ff;
  --accent: #00d4d7;
  --accent-dark: #00bac1;
  --accent-light: #dff9f8;
  --success: #13d527;
  --success-dark: #00ae11;
  --success-light: #eafbe7;
  --secondary: #8f15d5;
  --secondary-dark: #6013c7;
  --secondary-light: #f4e5fa;
  --info: #15b2d5;
  --info-dark: #0f8ca8;
  --info-light: #e0f5fa;
  --caution: #dbbb25;
  --caution-dark: #d58f15;
  --caution-light: #fbf9e4;
  --error: #e6185e;
  --error-dark: #bf1257;
  --error-light: #fce4eb;
  --black: #1d1d1d;
  --dark-1: #2d2d2d;
  --dark-2: #4d4d4d;
  --dark-3: #6d6d6d;
  --gray-1: #8d8d8d;
  --gray-2: #adadad;
  --gray-3: #cdcdcd;
  --gray-4: #e0e0e0;
  --light-1: #efefef;
  --light-2: #f5f5f5;
  --light-3: #fafafa;
  --white: #ffffff;
  --gradient-1: linear-gradient(180deg, #155bd5 0%, #1c3ab6 100%);
  --gradient-2: linear-gradient(180deg, #155bd5 13.02%, #00d4d7 85.42%);
  --gradient-3: linear-gradient(180deg, #155bd5 0%, #8f15d5 100%);
  --gradient-4: linear-gradient(180deg, #155bd5 0%, #13d527 100%);
  --gradient-5: linear-gradient(180deg, #155bd5 0%, #15bbd5 100%);
  --gradient-6: linear-gradient(180deg, #155bd5 0%, #dbbb25 100%);
  --gradient-7: linear-gradient(180deg, #155bd5 0%, #e6185e 100%);
  --gradient-8: linear-gradient(180deg, #1c3ab6 0%, #00bac1 100%);
  --gradient-9: linear-gradient(180deg, #00d4d7 13.02%, #155bd5 85.42%);
  --shadow-1: 0px 0px 1px rgba(40, 41, 61, 0.08),
    0px 0.5px 2px rgba(96, 97, 112, 0.16);
  --shadow-2: 0px 0px 1px rgba(40, 41, 61, 0.04),
    0px 2px 4px rgba(96, 97, 112, 0.16);
  --shadow-3: 0px 0px 2px rgba(40, 41, 61, 0.04),
    0px 4px 8px rgba(96, 97, 112, 0.16);
  --shadow-4: 0px 2px 4px rgba(40, 41, 61, 0.04),
    0px 8px 16px rgba(96, 97, 112, 0.16);
  --shadow-5: 0px 2px 8px rgba(40, 41, 61, 0.04),
    0px 16px 24px rgba(96, 97, 112, 0.16);
  --shadow-6: 0px 2px 8px rgba(40, 41, 61, 0.08),
    0px 20px 32px rgba(96, 97, 112, 0.24);
}

body {
  font-family: var(--font-family);
  color: var(--black);
  font-size: 16px;
}
@media (max-width: 991px) {
  body {
    font-size: 14px;
  }
}

img {
  max-width: 100%;
}

a {
  display: inline-block;
}

a,
button,
a:hover,
a:focus,
input:focus,
textarea:focus,
button:focus {
  text-decoration: none;
  outline: none;
}

ul,
ol {
  margin: 0px;
  padding: 0px;
  list-style-type: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 600;
  color: var(--black);
  margin: 0px;
}

h1,
.h1 {
  font-size: 2.75em;
  line-height: 1.25;
}

h2,
.h2 {
  font-size: 2.25em;
  line-height: 1.25;
}

h3,
.h3 {
  font-size: 1.75em;
  line-height: 1.25;
}

h4,
.h4 {
  font-size: 1.5em;
  line-height: 1.25;
}

h5,
.h5 {
  font-size: 1.25em;
  line-height: 1.25;
}

h6,
.h6 {
  font-size: 0.875em;
  line-height: 1.25;
}

.display-1 {
  font-size: 5.5em;
  line-height: 1.25;
}

.display-2 {
  font-size: 4.75em;
  line-height: 1.25;
}

.display-3 {
  font-size: 4em;
  line-height: 1.25;
}

.display-4 {
  font-size: 3.25em;
  line-height: 1.25;
}

p {
  font-size: 1em;
  font-weight: 400;
  line-height: 1.5;
  color: var(--dark-3);
  margin: 0px;
}

.text-small {
  font-size: 0.875em;
  line-height: 1.5;
}

.text-lg {
  font-size: 1.25em;
  line-height: 1.5;
}

.bg_cover {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

@media (max-width: 767px) {
  .container {
    padding-left: 20px;
    padding-right: 20px;
    margin-right: 0px ;
    margin-left: 0px !important;
  }
}

.btn {
  font-weight: bold;
  font-size: 16px;
  line-height: 20px;
  text-align: center;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 12px 24px;
  border-radius: 4px;
  border: 1px solid transparent;
}
.btn:hover {
  color: inherit;
}
.btn:focus {
  box-shadow: none;
  outline: none;
}
.btn.btn-lg {
  font-size: 1.15em;
  padding: 16px 24px;
}
.btn.btn-sm {
  padding: 8px 16px;
}
.btn.square {
  border-radius: 0px;
}
.btn.semi-rounded {
  border-radius: 12px;
}
.btn.rounded-full {
  border-radius: 50px;
}
.btn.icon-left span,
.btn.icon-left i {
  margin-right: 8px;
}
.btn.icon-right span,
.btn.icon-right i {
  margin-left: 8px;
}
.btn.icon-btn {
  width: 48px;
  height: 48px;
  padding: 0;
  line-height: 48px;
}
.btn.icon-btn.btn-lg {
  width: 56px;
  height: 56px;
  line-height: 56px;
}
.btn.icon-btn.btn-sm {
  width: 40px;
  height: 40px;
  line-height: 40px;
}


/* ===== Buttons Css ===== */
.primary-btn {
  background: var(--primary);
  color: var(--white);
  box-shadow: var(--shadow-2);
}
.active.primary-btn, .primary-btn:hover, .primary-btn:focus {
  background: var(--primary-dark);
  color: var(--white);
  box-shadow: var(--shadow-4);
}
.deactive.primary-btn {
  background: var(--gray-4);
  color: var(--dark-3);
  pointer-events: none;
}

.primary-btn-outline {
  border-color: var(--primary);
  color: var(--primary);
}
.active.primary-btn-outline, .primary-btn-outline:hover, .primary-btn-outline:focus {
  background: var(--primary-dark);
  color: var(--white);
}
.deactive.primary-btn-outline {
  color: var(--dark-3);
  border-color: var(--gray-4);
  pointer-events: none;
}


/* One Click Scrool Top Button*/
.scroll-top {
  width: 45px;
  height: 45px;
  line-height: 45px;
  background: var(--primary);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 14px;
  color: #fff !important;
  border-radius: 0;
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 9;
  cursor: pointer;
  -webkit-transition: all .3s ease-out 0s;
  transition: all .3s ease-out 0s;
  border-radius: 5px;
}

.scroll-top:hover {
  -webkit-box-shadow: 0 1rem 3rem rgba(35, 38, 45, 0.15) !important;
  box-shadow: 0 1rem 3rem rgba(35, 38, 45, 0.15) !important;
  -webkit-transform: translate3d(0, -5px, 0);
  transform: translate3d(0, -5px, 0);
  background-color: var(--dark-1);
}

/*===========================
  Section Title Five CSS
===========================*/
.section-title-five {
  text-align: center;
  max-width: 550px;
  margin: auto;
  margin-bottom: 50px;
  position: relative;
  z-index: 5;
}
.section-title-six {
  text-align: center;
  max-width: 550px;
  margin: auto;
  margin-bottom: 50px;
  position: relative;
  z-index: 5;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-title-five {
    margin-bottom: 45px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-title-six {
    margin-bottom: 45px;
  }
}  
@media (max-width: 767px) {
  .section-title-five {
    margin-bottom: 35px;
  }
}
@media (max-width: 767px) {
  .section-title-six {
    margin-bottom: 35px;
  }
}
.section-title-five h6 {
  font-weight: 600;
  display: inline-block;
  margin-bottom: 15px;
  color: var(--primary);
  border: 2px solid var(--primary);
  border-radius: 30px;
  padding: 8px 30px;
}

.section-title-six h6 {
  font-weight: 600;
  display: inline-block;
  margin-bottom: 15px;
  color: var(--primary);
  border: 2px solid var(--primary);
  border-radius: 30px;
  padding: 8px 30px;
}
.section-title-five h2 {
  margin-bottom: 15px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-title-five h2 {
    font-size: 2rem;
    line-height: 2.8rem;
  }
}
@media (max-width: 767px) {
  .section-title-five h2 {
    font-size: 1.5rem;
    line-height: 1.9rem;
  }
}
.section-title-five p {
  color: var(--dark-3);
}

.made-in-ayroui{
  position: fixed;
  left: 5px;
  bottom: 5px;
  z-index: 999;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.made-in-ayroui:hover{
  transform: translateY(-5px);
}


/*===========================
  NAVBAR css — MAESTRIA
===========================*/
.navbar-toggler:focus {
  box-shadow: none;
}

/* ===== NAVBAR NINE — MAESTRIA ===== */
.navbar-area.navbar-nine {
  background: rgba(14, 47, 40, 0.97);
  padding: 10px 0;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 9999;
  box-shadow: none;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.navbar-area.navbar-nine.sticky {
  position: fixed !important;
  top: 0;
  width: 100%;
  z-index: 9999 !important;
  background: rgba(14, 47, 40, 0.98);
  box-shadow: 0 8px 26px rgba(14, 47, 40, 0.13);
}

.navbar-area.navbar-nine .navbar {
  position: relative;
  min-height: 78px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.navbar-area.navbar-nine .navbar-brand {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  flex: 0 0 auto;
}

.navbar-area.navbar-nine .navbar-brand img {
  display: block;
  width: 210px;
  max-width: 210px;
  height: auto;
  object-fit: contain;
}

/* Hamburger */
.navbar-area.navbar-nine .navbar-toggler {
  border: 0;
  outline: none;
  box-shadow: none;
  padding: 6px;
  background: transparent;
}

.navbar-area.navbar-nine .navbar .navbar-toggler .toggler-icon {
  width: 30px;
  height: 2px;
  background-color: var(--maestria-white, #ffffff);
  margin: 5px 0;
  display: block;
  position: relative;
  border-radius: 2px;
  transition: all 0.3s ease-out;
}

.navbar-area.navbar-nine .navbar .navbar-toggler.active .toggler-icon:nth-of-type(1) {
  transform: rotate(45deg);
  top: 7px;
}

.navbar-area.navbar-nine .navbar .navbar-toggler.active .toggler-icon:nth-of-type(2) {
  opacity: 0;
}

.navbar-area.navbar-nine .navbar .navbar-toggler.active .toggler-icon:nth-of-type(3) {
  transform: rotate(135deg);
  top: -7px;
}

/* Desktop */
@media (min-width: 992px) {
  .navbar-area.navbar-nine .navbar-toggler {
    display: none;
  }

  .navbar-area.navbar-nine .navbar-collapse {
    position: static !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: auto !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible !important;
  }

  .navbar-area.navbar-nine .navbar .navbar-nav {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0 !important;
    padding: 0;
    list-style: none;
  }

  .navbar-area.navbar-nine .navbar .navbar-nav .nav-item {
    position: relative;
    margin: 0;
  }

  .navbar-area.navbar-nine .navbar .navbar-nav .nav-item a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 0 18px;
    color: rgba(255,255,255,.86);
    font-size: 16px;
    font-weight: 600;
    text-transform: none;
    position: relative;
    border-radius: 999px;
    margin: 0;
    opacity: 1;
    white-space: nowrap;
    transition: all 0.25s ease;
  }

  .navbar-area.navbar-nine .navbar .navbar-nav .nav-item a:hover,
  .navbar-area.navbar-nine .navbar .navbar-nav .nav-item a.active {
    color: #ffffff;
    background: rgba(255,255,255,.08);
  }

  .navbar-area.navbar-nine .navbar .navbar-nav .nav-item a i {
    font-size: 12px;
    padding-left: 7px;
  }

  .navbar-area.navbar-nine .navbar-whatsapp {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    margin-left: 20px;
  }

  .navbar-area.navbar-nine .navbar-whatsapp a {
    width: 58px;
    height: 58px;
    padding: 0;
    margin: 0;
    border-radius: 50%;
    background: #c9a45c;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    transition: all .25s ease;
  }

  .navbar-area.navbar-nine .navbar-whatsapp a:hover {
    background: #d3b16b;
    color: #ffffff;
    transform: translateY(-2px);
  }
}

/* Tablet + Mobile */
@media (max-width: 991.98px) {
  .navbar-area.navbar-nine {
    padding: 8px 0;
  }

  .navbar-area.navbar-nine .navbar {
    min-height: 68px;
    padding: 0 20px;
  }

  .navbar-area.navbar-nine .navbar-brand img {
    width: 175px;
    max-width: 175px;
  }

  .navbar-area.navbar-nine .navbar-toggler {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    margin-left: auto;
    flex: 0 0 auto;
  }

  .navbar-area.navbar-nine .navbar-collapse {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 12px 20px 18px !important;
    background: #0e2f28 !important;
    border-radius: 0 0 16px 16px;
    border-top: 1px solid rgba(255,255,255,.06);
    box-shadow: 0 15px 30px rgba(0,0,0,.20);
    transform: none !important;
    z-index: 99999 !important;
    overflow: hidden;
  }

  .navbar-area.navbar-nine .navbar .navbar-nav {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 3px;
    margin: 0 !important;
    padding: 0;
    list-style: none;
  }

  .navbar-area.navbar-nine .navbar .navbar-nav .nav-item {
    width: 100%;
    margin: 0;
  }

  .navbar-area.navbar-nine .navbar .navbar-nav .nav-item a {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 46px;
    padding: 11px 14px;
    margin: 0;
    border-radius: 8px;
    color: #ffffff;
    font-size: 15px;
    font-weight: 600;
    text-transform: none;
    opacity: 1;
    white-space: normal;
  }

  .navbar-area.navbar-nine .navbar .navbar-nav .nav-item a:hover,
  .navbar-area.navbar-nine .navbar .navbar-nav .nav-item a.active {
    color: #ffffff;
    background: rgba(255,255,255,.08);
  }

  .navbar-area.navbar-nine .navbar-whatsapp {
    display: none;
  }
}

@media (max-width: 767px) {
  .navbar-area.navbar-nine .navbar {
    min-height: 62px;
    padding: 0 16px;
  }

  .navbar-area.navbar-nine .navbar-brand img {
    width: 150px;
    max-width: 150px;
  }

  .navbar-area.navbar-nine .navbar-toggler {
    width: 42px;
    height: 42px;
    padding: 4px;
  }

  .navbar-area.navbar-nine .navbar .navbar-collapse {
    padding: 10px 16px 16px !important;
  }

  .navbar-area.navbar-nine .navbar .navbar-nav .nav-item a {
    min-height: 44px;
    font-size: 15px;
  }
}

@media (max-width: 380px) {
  .navbar-area.navbar-nine .navbar {
    padding-left: 12px;
    padding-right: 12px;
  }

  .navbar-area.navbar-nine .navbar-brand img {
    width: 135px;
    max-width: 135px;
  }

  .navbar-area.navbar-nine .navbar-toggler {
    width: 40px;
    height: 40px;
  }

  .navbar-area.navbar-nine .navbar .navbar-toggler .toggler-icon {
    width: 24px;
  }
}

/*===== SIDEBAR ONE =====*/
.sidebar-left {
  position: fixed;
  top: 0;
  right: 0;
  background-color: var(--white);
  height: 100%;
  width: 350px;
  padding-top: 80px;
  z-index: 999;
  -webkit-transform: translateX(100%);
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
  transform: translateX(100%);
  transition: all 0.4s ease-in-out;
  text-align: left;
}
.sidebar-left.open {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
}
@media (max-width: 767px) {
  .sidebar-left {
    width: 250px;
  }
}
.sidebar-left .sidebar-close {
  position: absolute;
  top: 30px;
  right: 30px;
}
.sidebar-left .sidebar-close .close {
  font-size: 18px;
  color: var(--black);
  -webkit-transition: all 0.2s ease-out 0s;
  -moz-transition: all 0.2s ease-out 0s;
  -ms-transition: all 0.2s ease-out 0s;
  -o-transition: all 0.2s ease-out 0s;
  transition: all 0.2s ease-out 0s;
}
.sidebar-left .sidebar-close .close:hover {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}
.sidebar-left .sidebar-content {
  padding: 0px 30px;
}
.sidebar-left .sidebar-content .sidebar-menu {
  margin-top: 30px;
}
.sidebar-left .sidebar-content .sidebar-menu .menu-title {
  font-size: 18px;
  font-weight: 600;
}
.sidebar-left .sidebar-content .sidebar-menu ul {
  margin-top: 15px;
}
.sidebar-left .sidebar-content .sidebar-menu ul li a {
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
  padding: 8px 0;
  color: var(--dark-3);
  text-transform: capitalize;
  position: relative;
  border-radius: 5px;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
  display: block;
}
.sidebar-left .sidebar-content .sidebar-menu ul li a:hover {
  color: var(--primary);
  padding-left: 5px;
}
.sidebar-left .sidebar-content .text {
  margin-top: 20px;
}
.sidebar-left .sidebar-content .sidebar-social {
  margin-top: 30px;
}
.sidebar-left .sidebar-content .sidebar-social .social-title {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 25px;
}
.sidebar-left .sidebar-content .sidebar-social ul li {
  display: inline-block;
  margin-right: 5px;
}
.sidebar-left .sidebar-content .sidebar-social ul li:last-child {
  margin: 0;
}
.sidebar-left .sidebar-content .sidebar-social ul li a {
  height: 38px;
  width: 38px;
  line-height: 38px;
  text-align: center;
  border: 1px solid #eee;
  border-radius: 50%;
  font-size: 18px;
  color: #666;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}
.sidebar-left .sidebar-content .sidebar-social ul li a:hover {
  color: var(--white);
  background-color: var(--primary);
  border-color: transparent;
}

.overlay-left {
  position: fixed;
  background-color: rgba(0, 0, 0, 0.6);
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
  z-index: 99;
}
.overlay-left.open {
  display: block;
}


/* ===== Buttons Css ===== */
.header-eight .primary-btn {
  background: var(--primary);
  color: var(--white);
  box-shadow: var(--shadow-2);
}
.header-eight .active.primary-btn, .header-eight .primary-btn:hover, .header-eight .primary-btn:focus {
  background: var(--primary-dark);
  color: var(--white);
  box-shadow: var(--shadow-4);
}
.header-eight .deactive.primary-btn {
  background: var(--gray-4);
  color: var(--dark-3);
  pointer-events: none;
}

/*======================================
    header Area CSS
========================================*/
.header-eight {
  position: relative;
  padding:160px 0 100px 0;
  background: var(--primary);
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-eight {
    padding: 130px 0 80px 0;
  }
}
@media (max-width: 767px) {
  .header-eight {
    padding: 100px 0 60px 0;
  }
}
.header-eight .header-image img {
  width: 100%;
  border-radius: 8px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .header-eight .header-image {
    margin-top: 40px;
  }
}
.header-eight .header-content {
  border-radius: 0;
  position: relative;
  z-index: 1;
  text-align: left;
}
.header-eight .header-content h1 {
  font-weight: 700;
  color: var(--white);
  text-shadow: 0px 3px 8px #00000017;
  text-transform: capitalize;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-eight .header-content h1  {
    font-size: 35px;
    line-height: 45px;
  }
}
@media (max-width: 767px) {
  .header-eight .header-content h1  {
    font-size: 30px;
    line-height: 42px;
  }
}
.header-eight .header-content h1 span {
  display: block;
}
.header-eight .header-content p {
  margin-top: 30px;
  color: var(--white);
  opacity: 0.7;
}
.header-eight .button {
  margin-top: 40px;
}
.header-eight .primary-btn {
  margin-right: 12px;
  background-color: var(--white);
  color: var(--primary);
  border: 1px solid transparent;
}
.header-eight .primary-btn:hover {
  background-color: transparent;
  color: var(--white);
  border-color: var(--white);
}
.header-eight .video-button {
  display: inline-flex;
  align-items: center;
}
@media (max-width: 767px) {
  .header-eight .video-button {
    margin-top: 20px;
  }
}
.header-eight .video-button .text {
  display: inline-block;
  margin-left: 15px;
  color: var(--white);
  font-weight: 600;
}
.header-eight .video-button .icon-btn {
  background: var(--white);
  color: var(--primary);
}

/*===========================
  about-05 css
===========================*/
.about-five {
  background-color: var(--light-3);
  padding-top: 120px;
  padding-bottom: 90px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-five {
    padding-top: 100px;
    padding-bottom:70px;
  }
}
@media (max-width: 767px) {
  .about-five {
    padding-top: 80px;
    padding-bottom:60px;
  }
}
.about-five-content{
  padding-left: 50px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-five-content {
    padding-left: 0;
  }
}
@media (max-width: 767px) {
  .about-five-content {
    padding-left: 0;
  }
}
.about-five-content .small-title {
  position: relative;
  padding-left: 30px;
}
.about-five-content .small-title::before {
  position: absolute;
  content: "";
  left: 0;
  top: 50%;
  background-color: var(--primary);
  height: 2px;
  width: 20px;
  margin-top: -1px;
}
.about-five-content .main-title {
  margin-top: 20px;
}
.about-five-content .about-five-tab {
  margin-top: 40px;
}
.about-five-content .about-five-tab nav {
  border: none;
  background-color: var(--light-1);
  padding: 15px;
  border-radius: 5px;
}
.about-five-content .about-five-tab nav .nav-tabs {
  border: none;
}
.about-five-content .about-five-tab nav button {
  border: none;
  color: var(--dark-1);
  font-weight: 600;
  padding: 0;
  margin-right: 20px;
  position: relative;
  background-color: var(--white);
  padding: 10px 18px;
  border-radius: 4px;
  text-transform: capitalize;
}
@media (max-width: 767px) {
  .about-five-content .about-five-tab nav button {
    margin: 0;
    margin-bottom: 10px;
    width: 100%;
  }
  .about-five-content .about-five-tab nav button:last-child {
    margin: 0;
  }
}
.about-five-content .about-five-tab nav button:hover {
  color: var(--primary);
}
.about-five-content .about-five-tab nav button.active {
  background-color: var(--primary);
  color: var(--white);
}
.about-five-content .about-five-tab nav button:last-child {
  margin-right: 0;
}
.about-five-content .about-five-tab .tab-content {
  border: none;
  padding-top: 10px;
}
.about-five-content .about-five-tab .tab-content p {
  margin-bottom: 20px;
}
.about-five-content .about-five-tab .tab-content p:last-child {
  margin: 0;
}

.about-image-five {
  padding-left: 60px;
  position: relative;
  z-index: 2;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-image-five {
    margin-bottom: 70px;
    padding-left: 30px;
  }
}
@media (max-width: 767px) {
  .about-image-five {
    margin-bottom: 60px;
    padding-left: 0;
  }
}
.about-image-five .shape {
  position: absolute;
  left: 30px;
  top: -30px;
  z-index: -1;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-image-five .shape {
    left: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .about-image-five::before {
    right: -15px;
    bottom: -15px;
  }
}
@media (max-width: 767px) {
  .about-image-five::before {
    display: none;
  }
}
.about-image-five img {
  width: 100%;
  z-index: 2;
}


/*===========================
  services css 
===========================*/
.services-eight {
  padding: 100px 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .services-eight {
    padding: 80px 0 50px 0;
  }
}
@media (max-width: 767px) {
  .services-eight {
    padding: 60px 0 30px 0;
  }
}
.services-eight .single-services {
  padding: 40px 60px;
  border: 1px solid var(--light-1);
  border-radius: 10px;
  margin-bottom: 30px;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}
.services-eight .single-services:hover {
  box-shadow: var(--shadow-4);
}
.services-eight .single-services:hover .service-icon {
  color: var(--white);
  border-color: transparent;
  background: var(--primary);
}
.services-eight .single-services:hover .service-icon::after {
  opacity: 1;
  visibility: visible;
}
.services-eight .single-services .service-icon {
  width: 78px;
  height: 78px;
  border-radius: 50%;
  margin-bottom: 25px;
  background: var(--white);
  border: 2px solid var(--primary);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
  font-size: 40px;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
  position: relative;
}
.services-eight .single-services .service-icon::after {
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
  opacity: 0;
  visibility: hidden;
  background: var(--primary);
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s; 
  z-index: -1;
  border-radius: 50%;
  border: 1px solid transparent;
}
.services-eight .single-services .service-content h4 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 20px;
}
.services-eight .single-services .service-content p {
  color: var(--dark-3);
}



/*===== VIDEO ONE =====*/
.video-one {
  background-color: var(--light-3);
  padding: 100px 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .video-one {
    padding: 80px;
  }
}
@media (max-width: 767px) {
  .video-one {
    padding: 60px 0;
  }
}
.video-one .video-title h5 {
  font-weight: 600;
  color: var(--primary);
}
.video-one .video-title h2 {
  font-weight: 700;
  color: var(--black);
  margin-top: 10px;
}
.video-one .video-title .text-lg {
  margin-top: 24px;
  color: var(--dark-3);
}
.video-one .video-content {
  position: relative;
  margin-top: 20px;
  border-radius: 8px;
  overflow: hidden;
}
.video-one .video-content img {
  border-radius: 8px;
}
.video-one .video-content a {
  width: 88px;
  height: 88px;
  line-height: 88px;
  text-align: center;
  border-radius: 50%;
  background-color: var(--primary);
  color: var(--white);
  font-size: 30px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
  padding-left: 3px;
}
@media (max-width: 767px) {
  .video-one .video-content a {
    width: 68px;
    height: 68px;
    line-height: 68px;
    font-size: 20px;
  }
}
.video-one .video-content a:hover {
  background-color: var(--white);
  color: var(--primary);
}


/*===== PRICING THIRTEEN =====*/
.pricing-fourteen {
  padding: 0px 0;
  background-color: var(--light-3);
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pricing-fourteen {
    padding: 80px;
  }
}
@media (max-width: 767px) {
  .pricing-fourteen {
    padding: 60px 0;
  }
}
.pricing-style-fourteen {
  border: 1px solid var(--light-1);
  border-radius: 10px;
  margin-top: 30px;
  background-color: var(--white);
  transition: all 0.4s ease;
  padding: 50px 35px;
  text-align: center;
  z-index: 0;
}
.pricing-style-fourteen:hover {
  box-shadow: var(--shadow-4);
}
.pricing-style-fourteen.middle {
  box-shadow: var(--shadow-4);
}
.pricing-style-fourteen.middle .title {
  border-color: var(--primary);
  background: var(--primary);
  color: var(--white);
}
.pricing-style-fourteen .title {
  font-weight: 500;
  margin-bottom: 25px;
  color: var(--primary);
  padding: 8px 20px;
  border: 2px solid var(--primary);
  display: inline-block;
  border-radius: 30px;
  font-size: 16px;
}
.pricing-style-fourteen .table-head p {
  color: var(--dark-3);
}
.pricing-style-fourteen .price {
  padding-top: 30px;
}
.pricing-style-fourteen .amount {
  font-weight: 600;
  display: inline-block;
  position: relative;
  padding-left: 15px;
  font-size: 55px;
}
.pricing-style-fourteen .currency {
  font-weight: 400;
  color: var(--dark-3);
  font-size: 20px;
  position: absolute;
  left: 0;
  top: 6px;
}
.pricing-style-fourteen .duration {
  display: inline-block;
  font-size: 18px;
  color: var(--dark-3);
  font-weight: 400;
}
.pricing-style-fourteen .light-rounded-buttons {
  margin: 0;
  margin-top: 30px;
  margin-bottom: 40px;
}
.pricing-style-fourteen .table-list li {
  position: relative;
  margin-bottom: 10px;
  color: var(--dark-3);
  text-align: left;
}
.pricing-style-fourteen .table-list li:last-child {
  margin: 0;
}
.pricing-style-fourteen .table-list li i {
  color: var(--primary);
  font-size: 16px;
  padding-right: 8px;
}
.pricing-style-fourteen .table-list li i.deactive {
  color: var(--dark-3);
}




/* ===== Buttons Css ===== */
.call-action .inner-content .light-rounded-buttons .primary-btn-outline {
  border-color: var(--primary);
  color: var(--primary);
}
.call-action .inner-content .light-rounded-buttons .active.primary-btn-outline, .call-action .inner-content .light-rounded-buttons .primary-btn-outline:hover, .call-action .inner-content .light-rounded-buttons .primary-btn-outline:focus {
  background: var(--white);
  color: var(--primary);
  border-color: transparent;
}
.call-action .inner-content .light-rounded-buttons .deactive.primary-btn-outline {
  color: var(--dark-3);
  border-color: var(--gray-4);
  pointer-events: none;
}

/*===== call action four =====*/
.call-action {
  z-index: 2;
  padding: 100px 0;
  background: linear-gradient(45deg, var(--primary), var(--primary-dark));
  position: relative;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .call-action {
    padding: 80px;
  }
}
@media (max-width: 767px) {
  .call-action {
    padding: 60px 0;
  }
}
.call-action:before {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  background-image: url("assets/images/call-action/overlay.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
  z-index: -1;
}
.call-action .inner-content {
  text-align: center;
}
.call-action .inner-content h2 {
  font-weight: 700;
  margin-bottom: 30px;
  color: var(--white);
}
.call-action .inner-content p {
  color: var(--white);
}
.call-action .inner-content .light-rounded-buttons {
  margin-top: 45px;
  display: block;
}
.call-action .inner-content .light-rounded-buttons .primary-btn-outline {
  border-color: var(--white);
  color: var(--white);
}



/*===== latest-news-area =====*/
.latest-news-area {
  background: var(--white);
  padding: 80px 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .latest-news-area {
    padding: 80px;
  }
}
@media (max-width: 767px) {
  .latest-news-area {
    padding: 60px 0;
  }
}
.latest-news-area .single-news {
  margin-top: 30px;
}
.latest-news-area .single-news .image {
  position: relative;
  border-radius: 4px;
  overflow: hidden;
}
.latest-news-area .single-news .image img {
  height: 100%;
  width: 100%;
  transition: all 0.4s ease;
}
.latest-news-area .single-news .image .meta-details {
  display: inline-block;
  padding: 6px 15px 6px 7px;
  border-radius: 30px;
  background-color: var(--primary);
  position: absolute;
  right: 20px;
  bottom: 20px;
}
.latest-news-area .single-news .image .meta-details img {
  height: 28px;
  width: 28px;
  border-radius: 50%;
  display: inline-block;
}
.latest-news-area .single-news .image .meta-details span {
  color: var(--white);
  display: inline-block;
  margin-left: 10px;
  font-size: 10px;
  font-weight: 500;
}
.latest-news-area .single-news .content-body .title {
  margin: 30px 0 20px 0;
}
.latest-news-area .single-news .content-body .title a {
  color: var(--black);
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}
.latest-news-area .single-news .content-body .title a:hover {
  color: var(--primary);
}
.latest-news-area .single-news .content-body p {
  color: var(--dark-3);
}
.latest-news-area .single-news:hover .image .thumb {
  transform: scale(1.1) rotate(1deg);
}


/*======================================
    Brand CSS
========================================*/
.brand-area {
  padding: 100px 0;
  background: var(--light-3);
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .brand-area {
    padding: 80px;
  }
}
@media (max-width: 767px) {
  .brand-area {
    padding: 60px 0;
  }
}
.brand-area .clients-logos {
  text-align: center;
  display: inline-block;
  margin-top: 20px;
}
.brand-area .clients-logos .single-image {
  display: inline-block;
  margin: 13px 10px;
  background-color: var(--white);
  line-height: 100px;
  padding: 8px 25px;
  border-radius: 8px;
  -webkit-transition: all 0.4s ease-out 0s;
  -moz-transition: all 0.4s ease-out 0s;
  -ms-transition: all 0.4s ease-out 0s;
  -o-transition: all 0.4s ease-out 0s;
  transition: all 0.4s ease-out 0s;
  border: 1px solid #eee;
}
.brand-area .clients-logos .single-image:hover {
  box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.096);
  -webkit-transform: translateY(-5px);
  -moz-transform: translateY(-5px);
  -ms-transform: translateY(-5px);
  -o-transform: translateY(-5px);
  transform: translateY(-5px);
}
.brand-area .clients-logos img {
  max-width: 170px;
  transition: all 0.4s ease-in-out;
  cursor: pointer;
}

/* ===== Buttons Css ===== */
.contact-form-wrapper .contact-form .primary-btn {
  background: var(--primary);
  color: var(--white);
  box-shadow: var(--shadow-2);
}
.contact-form-wrapper .contact-form .active.primary-btn, .contact-form-wrapper .contact-form .primary-btn:hover, .contact-form-wrapper .contact-form .primary-btn:focus {
  background: var(--primary-dark);
  color: var(--white);
  box-shadow: var(--shadow-4);
}
.contact-form-wrapper .contact-form .deactive.primary-btn {
  background: var(--gray-4);
  color: var(--dark-3);
  pointer-events: none;
}

/*======================================
	Contact CSS
========================================*/
.contact-section {
  position: relative;
  z-index: 3;
  padding-top: 100px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-section {
    padding-top: 80px;
  }
}
@media (max-width: 767px) {
  .contact-section {
    padding-top: 60px;
  }
}
.contact-section .contact-item-wrapper .contact-item {
  display: flex;
  border: 1px solid var(--gray-4);
  border-radius: 10px;
  background: var(--white);
  margin-bottom: 30px;
  padding: 20px 30px;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}
.contact-section .contact-item-wrapper .contact-item:hover {
  box-shadow: var(--shadow-4);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .contact-section .contact-item-wrapper .contact-item {
    padding: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-section .contact-item-wrapper .contact-item {
    flex-direction: column;
  }
}
@media (max-width: 767px) {
  .contact-section .contact-item-wrapper .contact-item {
    flex-direction: column;
  }
}
.contact-section .contact-item-wrapper .contact-item .contact-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 22px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: var(--primary);
  color: var(--white);
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}
.contact-section .contact-item-wrapper .contact-item .contact-content {
  margin-left: 25px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .contact-section .contact-item-wrapper .contact-item .contact-content {
    margin-left: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-section .contact-item-wrapper .contact-item .contact-content {
    margin-left: 0px;
    margin-top: 20px;
  }
}
@media (max-width: 767px) {
  .contact-section .contact-item-wrapper .contact-item .contact-content {
    margin-left: 0px;
    margin-top: 20px;
  }
}
.contact-section .contact-item-wrapper .contact-item .contact-content h4 {
  font-size: 20px;
  color: var(--primary);
  margin-bottom: 10px;
}

.contact-form-wrapper {
  padding: 50px 40px;
  background: var(--white);
  border: 1px solid var(--gray-4);
  margin-left: 0px;
  border-radius: 10px;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}
.contact-form-wrapper:hover {
  box-shadow: var(--shadow-4);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .contact-form-wrapper {
    margin-left: 30px;
  }
}
.contact-form-wrapper .section-title {
  margin-bottom: 30px;
}
.contact-form-wrapper .section-title span {
  font-size: 20px;
  color: var(--primary);
  font-weight: 700;
}
.contact-form-wrapper .section-title h2 {
  margin-bottom: 10px;
}
.contact-form-wrapper .section-title p {
  color: var(--dark-3);
}
.contact-form-wrapper .contact-form input,
.contact-form-wrapper .contact-form textarea {
  padding: 15px 25px;
  border-radius: 30px;
  border: 1px solid var(--gray-4);
  margin-bottom: 25px;
  width: 100%;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}
@media (max-width: 767px) {
  .contact-form-wrapper .contact-form input,
.contact-form-wrapper .contact-form textarea {
    padding: 12px 25px;
  }
}
.contact-form-wrapper .contact-form input:focus,
.contact-form-wrapper .contact-form textarea:focus {
  border-color: var(--primary);
}
.contact-form-wrapper .contact-form textarea {
  border-radius: 18px;
}
.map-style-9 {
  margin-top: -130px;
}


/* Footer eleven css */
.footer-eleven {
  padding-top: 100px;
  padding-bottom: 100px;
  background-color: var(--white);
  position: relative;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .footer-eleven {
    padding-top: 30px;
    padding-bottom: 70px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-eleven .footer-widget {
    margin-top: 40px;
  }
}
@media (max-width: 767px) {
  .footer-eleven .footer-widget {
    margin-top: 40px;
    text-align: center;
  }
}
.footer-eleven .footer-widget h5 {
  font-weight: 700;
  margin-bottom: 35px;
  color: var(--black);
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .footer-eleven .footer-widget h5 {
    margin-bottom: 25px;
  }
}
.footer-eleven .f-about {
  padding-right: 30px;
}
@media (max-width: 767px) {
  .footer-eleven .f-about {
    padding: 0;
  }
}
.footer-eleven .f-about p {
  color: var(--dark-3);
  margin-top: 20px;
}
.footer-eleven .f-about .copyright-text {
  color: var(--dark-3);
  margin-top: 40px;
}
.footer-eleven .f-about .copyright-text span {
  display: block;
}
@media (max-width: 767px) {
  .footer-eleven .f-about .copyright-text {
    margin-top: 20px;
  }
}
.footer-eleven .f-about .copyright-text a {
  color: var(--primary);
}
.footer-eleven .f-about .copyright-text a:hover {
  color: var(--primary-dark);
}
.footer-eleven .f-link li {
  display: block;
  margin-bottom: 12px;
}
.footer-eleven .f-link li:last-child {
  margin: 0;
}
.footer-eleven .f-link li a {
  color: var(--dark-3);
  -webkit-transition: all 0.4s ease-out 0s;
  -moz-transition: all 0.4s ease-out 0s;
  -ms-transition: all 0.4s ease-out 0s;
  -o-transition: all 0.4s ease-out 0s;
  transition: all 0.4s ease-out 0s;
}
.footer-eleven .f-link li a:hover {
  color: var(--primary);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 1400px) {
  .footer-eleven .newsletter {
    padding-left: 80px;
  }
}
.footer-eleven .newsletter p {
  color: var(--dark-3);
}
.footer-eleven .newsletter-form {
  margin-top: 30px;
  position: relative;
}
.footer-eleven .newsletter-form input {
  height: 55px;
  width: 100%;
  border-radius: 8px;
  border: 1px solid var(--gray-4);
  box-shadow: none;
  text-shadow: none;
  padding-left: 18px;
  padding-right: 65px;
  transition: all 0.4s ease;
}
.footer-eleven .newsletter-form input:focus {
  border-color: var(--primary);
}
.footer-eleven .newsletter-form .button {
  position: absolute;
  right: 7px;
  top: 50%;
  transform: translateY(-50%);
}
.footer-eleven .newsletter-form .sub-btn {
  height: 42px;
  width: 42px;
  border-radius: 6px;
  background-color: var(--primary);
  color: var(--white);
  text-align: center;
  line-height: 42px;
  border: none;
  box-shadow: none;
  text-shadow: none;
  font-size: 17px;
  transition: all 0.4s ease;
}
.footer-eleven .newsletter-form .sub-btn:hover {
  color: var(--white);
  background-color: var(--primary-dark);
}

/* ==========================================================================
   MAESTRIA — CONTROLADORIA & TREINAMENTOS
   Camada visual / UX sobre o template existente
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@500;600;700;800&display=swap");

:root {
  /* Brand */
  --maestria-green-900: #0E2F28;
  --maestria-green-800: #123C32;
  --maestria-green-700: #1B5143;
  --maestria-green-600: #236052;
  --maestria-green-100: #E8F0EC;
  --maestria-gold: #C9A45C;
  --maestria-gold-soft: #F2E6CF;

  /* Neutrals */
  --maestria-ink: #161B19;
  --maestria-text: #4F5A55;
  --maestria-muted: #6B7671;
  --maestria-line: #DCE3DF;
  --maestria-paper: #F7F5EF;
  --maestria-white: #FFFFFF;

  /* Shadows */
  --maestria-shadow-sm: 0 4px 16px rgba(14, 47, 40, 0.06);
  --maestria-shadow-md: 0 12px 32px rgba(14, 47, 40, 0.10);
  --maestria-shadow-lg: 0 24px 60px rgba(14, 47, 40, 0.14);

  /* Radius */
  --maestria-radius-sm: 10px;
  --maestria-radius-md: 16px;
  --maestria-radius-lg: 24px;
}

/* ---------- Base ---------- */

html {
  scroll-behavior: smooth;
}

body {
  font-family: "Inter", sans-serif;
  color: var(--maestria-ink);
  background: var(--maestria-white);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
h4,
h5,
h6,
.display-1,
.display-2,
.display-3,
.display-4 {
  font-family: "Manrope", sans-serif;
  color: var(--maestria-ink);
  letter-spacing: -0.025em;
}

h1 {
  font-size: clamp(2.75rem, 5vw, 5.2rem);
  line-height: 1.02;
  font-weight: 800;
}

h2 {
  font-size: clamp(2rem, 3.5vw, 3.35rem);
  line-height: 1.08;
  font-weight: 800;
}

h3 {
  font-size: clamp(1.5rem, 2vw, 2rem);
  line-height: 1.2;
  font-weight: 700;
}

p {
  color: var(--maestria-text);
  line-height: 1.7;
}

a {
  color: inherit;
  transition: color .25s ease, background-color .25s ease,
              border-color .25s ease, transform .25s ease,
              box-shadow .25s ease;
}

img {
  display: block;
}

/* ---------- Global buttons ---------- */

.btn {
  font-family: "Inter", sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
  padding: 15px 22px;
  border-radius: 999px;
  border: 1px solid transparent;
  transition: all .25s ease;
}

.btn.btn-lg {
  font-size: 15px;
  padding: 17px 26px;
}

.btn.rounded-full {
  border-radius: 999px;
}

.primary-btn {
  background: var(--maestria-green-800);
  color: var(--maestria-white);
  border-color: var(--maestria-green-800);
  box-shadow: none;
}

.active.primary-btn,
.primary-btn:hover,
.primary-btn:focus {
  background: var(--maestria-green-900);
  color: var(--maestria-white);
  border-color: var(--maestria-green-900);
  transform: translateY(-2px);
  box-shadow: var(--maestria-shadow-md);
}

.primary-btn-outline {
  color: var(--maestria-green-800);
  background: transparent;
  border-color: var(--maestria-green-800);
}

.active.primary-btn-outline,
.primary-btn-outline:hover,
.primary-btn-outline:focus {
  background: var(--maestria-green-800);
  color: var(--maestria-white);
  border-color: var(--maestria-green-800);
  transform: translateY(-2px);
}

/* ---------- Section titles ---------- */

.section-title-five {
  max-width: 760px;
  margin-bottom: 64px;
}

.section-title-six {
  max-width: 800px;
  margin-bottom: 40px;
}

.section-title-five h6 {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0;
  margin-bottom: 18px;
  border: 0;
  border-radius: 0;
  color: var(--maestria-green-700);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.section-title-six h6 {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0;
  margin-bottom: 18px;
  border: 0;
  border-radius: 0;
  color: var(--maestria-green-700);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.section-title-five h6::before {
  content: "";
  width: 22px;
  height: 2px;
  background: var(--maestria-gold);
  display: inline-block;
  border-radius: 999px;
}

.section-title-six h6::before {
  content: "";
  width: 22px;
  height: 2px;
  background: var(--maestria-gold);
  display: inline-block;
  border-radius: 999px;
}
.section-title-six h2 {
  margin-bottom: 18px;
}

.section-title-six p {
  max-width: 680px;
  margin: 0 auto;
  color: var(--maestria-muted);
}

@media (max-width: 767px) {
  h1 {
    font-size: 2.55rem;
  }

  h2 {
    font-size: 2rem;
  }

  .section-title-five {
    margin-bottom: 42px;
  }

  .section-title-six {
    margin-bottom: 25px;
  }
}


/* ==========================================================================
   HERO
   ========================================================================== */

.header-eight {
  position: relative;
  padding: 190px 0 105px;
  background:
    linear-gradient(100deg, rgba(14,47,40,.97) 0%, rgba(18,60,50,.88) 48%, rgba(18,60,50,.42) 100%),
    radial-gradient(circle at 78% 20%, rgba(201,164,92,.18), transparent 28%),
    var(--maestria-green-900);
  overflow: hidden;
}

.header-eight::after {
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  right: -180px;
  bottom: -250px;
  border-radius: 50%;
  border: 1px solid rgba(201,164,92,.18);
  box-shadow:
    0 0 0 55px rgba(201,164,92,.04),
    0 0 0 110px rgba(201,164,92,.025);
  pointer-events: none;
}

.header-eight .header-content {
  max-width: 700px;
}

.header-eight .header-content h1 {
  font-weight: 800;
  color: var(--maestria-white);
  text-transform: none;
  text-shadow: none;
}

.header-eight .header-content h1 span:last-child,
.header-eight .header-content h1 strong,
.header-eight .header-content h1 em {
  color: var(--maestria-gold);
  font-style: normal;
}

.header-eight .header-content p {
  max-width: 620px;
  margin-top: 26px;
  color: rgba(255,255,255,.80);
  opacity: 1;
  font-size: 1.08rem;
}

.header-eight .button {
  margin-top: 34px;
}

.header-eight .primary-btn {
  background: var(--maestria-gold);
  color: var(--maestria-green-900);
  border-color: var(--maestria-gold);
  margin-right: 10px;
  box-shadow: 0 12px 28px rgba(201,164,92,.20);
}

.header-eight .primary-btn:hover,
.header-eight .primary-btn:focus {
  background: #D7B876;
  color: var(--maestria-green-900);
  border-color: #D7B876;
}

.header-eight .video-button {
  margin-left: 6px;
}

.header-eight .video-button .icon-btn {
  background: rgba(255,255,255,.10);
  color: var(--maestria-white);
  border: 1px solid rgba(255,255,255,.22);
  box-shadow: none;
}

.header-eight .video-button .text {
  color: rgba(255,255,255,.84);
  font-weight: 600;
}

.header-eight .header-image {
  position: relative;
  z-index: 1;
}

.header-eight .header-image img {
  width: 100%;
  border-radius: var(--maestria-radius-lg);
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 30px 90px rgba(0,0,0,.24);
}

/* ==========================================================================
   ABOUT / PROBLEM
   ========================================================================== */

.about-five {
  background: var(--maestria-paper);
  padding: 115px 0 95px;
}

.about-five-content {
  padding-left: 30px;
}

.about-five-content .small-title {
  padding-left: 32px;
  color: var(--maestria-green-700);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.about-five-content .small-title::before {
  background: var(--maestria-gold);
  width: 22px;
  height: 2px;
}

.about-five-content .main-title {
  margin-top: 18px;
  margin-bottom: 20px;
}

.about-five-content p {
  margin-bottom: 16px;
}

.about-five-content .about-five-tab {
  margin-top: 30px;
}

.about-five-content .about-five-tab nav {
  background: transparent;
  padding: 0;
  border-radius: 0;
}

.about-five-content .about-five-tab nav button {
  color: var(--maestria-text);
  background: var(--maestria-white);
  border: 1px solid var(--maestria-line);
  border-radius: 999px;
  box-shadow: none;
}

.about-five-content .about-five-tab nav button:hover {
  color: var(--maestria-green-800);
  border-color: var(--maestria-green-600);
}

.about-five-content .about-five-tab nav button.active {
  background: var(--maestria-green-800);
  color: var(--maestria-white);
  border-color: var(--maestria-green-800);
}

.about-image-five {
  padding-left: 30px;
}

.about-image-five img {
  border-radius: var(--maestria-radius-lg);
  box-shadow: var(--maestria-shadow-lg);
}

.about-image-five .shape {
  opacity: .45;
}

/* ==========================================================================
   SERVICES
   ========================================================================== */

.services-eight {
  padding: 112px 0 90px;
  background: var(--maestria-white);
}

.services-eight .single-services {
  position: relative;
  height: 100%;
  padding: 0px 0px;
  border: 1px solid var(--maestria-line);
  border-radius: var(--maestria-radius-md);
  background: var(--maestria-white);
  margin-bottom: 30px;
  transition: transform .3s ease, box-shadow .3s ease,
              border-color .3s ease, background-color .3s ease;
}

.services-eight .single-services:hover {
  transform: translateY(-7px);
  border-color: rgba(35,96,82,.22);
  box-shadow: var(--maestria-shadow-lg);
}

.services-eight .single-services .service-icon {
  width: 60px;
  height: 80px;
  border-radius: 16px;
  margin-bottom: 24px;
  background: var(--maestria-green-100);
  border: 0;
  color: var(--maestria-green-700);
  font-size: 26px;
}

.services-eight .single-services:hover .service-icon {
  background: var(--maestria-green-800);
  color: var(--maestria-white);
}

.services-eight .single-services .service-icon::after {
  display: none;
}

.services-eight .single-services .service-content h4 {
  font-family: "Manrope", sans-serif;
  font-size: 23px;
  line-height: 1.25;
  font-weight: 800;
  margin-bottom: 14px;
  color: var(--maestria-ink);
}

.services-eight .single-services .service-content p {
  color: var(--maestria-text);
}

.services-eight .single-services ul li,
.services-eight .single-services .service-content li {
  position: relative;
  padding-left: 24px;
  margin-top: 10px;
  color: var(--maestria-text);
}

.services-eight .single-services ul li::before,
.services-eight .single-services .service-content li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--maestria-green-700);
  font-weight: 800;
}

/* ==========================================================================
   VIDEO / AUTHORITY / CONTENT BLOCK
   ========================================================================== */

.video-one {
  padding: 105px 0;
  background: var(--maestria-paper);
}

.video-one .video-title h5 {
  color: var(--maestria-green-700);
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.video-one .video-title h2 {
  color: var(--maestria-ink);
  margin-top: 10px;
}

.video-one .video-title .text-lg {
  color: var(--maestria-text);
}

.video-one .video-content {
  border-radius: var(--maestria-radius-lg);
  box-shadow: var(--maestria-shadow-lg);
}

.video-one .video-content a {
  background: var(--maestria-green-800);
  color: var(--maestria-white);
}

.video-one .video-content a:hover {
  background: var(--maestria-gold);
  color: var(--maestria-green-900);
}

/* ==========================================================================
   REMOVE TEMPLATE SECTIONS THAT DON'T MATCH MAESTRIA POSITIONING
   ========================================================================== */

.pricing-fourteen,
.latest-news-area,
.brand-area {
  background: var(--maestria-paper);
}

.pricing-fourteen {
  padding: 88px 0;
}

.pricing-style-fourteen {
  border: 1px solid var(--maestria-line);
  border-radius: var(--maestria-radius-md);
  background: var(--maestria-white);
  box-shadow: none;
}

.pricing-style-fourteen:hover,
.pricing-style-fourteen.middle {
  box-shadow: var(--maestria-shadow-lg);
}

.pricing-style-fourteen .title {
  color: var(--maestria-green-700);
  border-color: var(--maestria-green-600);
}

.pricing-style-fourteen.middle .title {
  background: var(--maestria-green-800);
  border-color: var(--maestria-green-800);
}

.latest-news-area .single-news .image {
  border-radius: var(--maestria-radius-md);
}

.brand-area .clients-logos .single-image {
  border: 1px solid var(--maestria-line);
  border-radius: 14px;
}

/* ==========================================================================
   CTA
   ========================================================================== */

.call-action {
  z-index: 2;
  padding: 105px 0;
  background:
    radial-gradient(circle at 82% 25%, rgba(201,164,92,.18), transparent 26%),
    linear-gradient(135deg, var(--maestria-green-900) 0%, var(--maestria-green-800) 100%);
}

.call-action:before {
  opacity: .08;
}

.call-action .inner-content {
  max-width: 900px;
  margin: 0 auto;
}

.call-action .inner-content h2 {
  max-width: 760px;
  margin: 0 auto 20px;
  color: var(--maestria-white);
}

.call-action .inner-content p {
  max-width: 720px;
  margin: 0 auto;
  color: rgba(255,255,255,.78);
}

.call-action .inner-content .light-rounded-buttons {
  margin-top: 34px;
}

.call-action .inner-content .light-rounded-buttons .primary-btn-outline {
  border-color: var(--maestria-gold);
  background: var(--maestria-gold);
  color: var(--maestria-green-900);
  box-shadow: 0 12px 28px rgba(201,164,92,.16);
}

.call-action .inner-content .light-rounded-buttons .primary-btn-outline:hover {
  background: #D7B876;
  border-color: #D7B876;
  color: var(--maestria-green-900);
}

/* ==========================================================================
   CONTACT / DIAGNOSTIC
   ========================================================================== */

.contact-section {
  padding: 104px 0 80px;
  background: var(--maestria-white);
}

.contact-section .contact-item-wrapper .contact-item {
  border: 1px solid var(--maestria-line);
  border-radius: var(--maestria-radius-md);
  background: var(--maestria-paper);
  margin-bottom: 18px;
  padding: 22px 24px;
  box-shadow: none;
}

.contact-section .contact-item-wrapper .contact-item:hover {
  box-shadow: var(--maestria-shadow-md);
}

.contact-section .contact-item-wrapper .contact-item .contact-icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: var(--maestria-green-100);
  color: var(--maestria-green-700);
}

.contact-section .contact-item-wrapper .contact-item .contact-content {
  margin-left: 18px;
}

.contact-section .contact-item-wrapper .contact-item .contact-content h4 {
  font-family: "Manrope", sans-serif;
  font-size: 18px;
  color: var(--maestria-ink);
  margin-bottom: 5px;
}

.contact-form-wrapper {
  padding: 42px 36px;
  background: var(--maestria-paper);
  border: 1px solid var(--maestria-line);
  border-radius: var(--maestria-radius-md);
  box-shadow: none;
}

.contact-form-wrapper:hover {
  box-shadow: var(--maestria-shadow-md);
}

.contact-form-wrapper .section-title span {
  font-size: 12px;
  color: var(--maestria-green-700);
  letter-spacing: .12em;
  text-transform: uppercase;
}

.contact-form-wrapper .section-title h2 {
  margin-bottom: 10px;
}

.contact-form-wrapper .contact-form input,
.contact-form-wrapper .contact-form textarea,
.contact-form-wrapper .contact-form select {
  padding: 14px 18px;
  border-radius: 12px;
  border: 1px solid var(--maestria-line);
  background: var(--maestria-white);
  color: var(--maestria-ink);
  margin-bottom: 18px;
  width: 100%;
  box-shadow: none;
}

.contact-form-wrapper .contact-form input::placeholder,
.contact-form-wrapper .contact-form textarea::placeholder,
.contact-form-wrapper .contact-form select::placeholder {
  color: #8A948F;
}

.contact-form-wrapper .contact-form input:focus,
.contact-form-wrapper .contact-form textarea:focus,
.contact-form-wrapper .contact-form select:focus {
  border-color: var(--maestria-green-700);
  box-shadow: 0 0 0 4px rgba(35,96,82,.08);
}

.contact-form-wrapper .contact-form textarea {
  min-height: 140px;
  border-radius: 12px;
}

.contact-form-wrapper .contact-form .primary-btn {
  background: var(--maestria-green-800);
  color: var(--maestria-white);
  border-color: var(--maestria-green-800);
  border-radius: 999px;
  box-shadow: none;
}

.contact-form-wrapper .contact-form .primary-btn:hover {
  background: var(--maestria-green-900);
  border-color: var(--maestria-green-900);
}

/* ==========================================================================
   FOOTER
   ========================================================================== */

.footer-eleven {
  padding-top: 72px;
  padding-bottom: 34px;
  background: var(--maestria-green-900);
}

.footer-eleven .footer-widget h5 {
  color: var(--maestria-white);
  margin-bottom: 22px;
}

.footer-eleven .f-about p,
.footer-eleven .newsletter p,
.footer-eleven .f-link li a,
.footer-eleven .f-about .copyright-text {
  color: rgba(255,255,255,.62);
}

.footer-eleven .f-link li a:hover {
  color: var(--maestria-gold);
}

.footer-eleven .f-about .copyright-text a {
  color: var(--maestria-gold);
}

.footer-eleven .newsletter-form input {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.12);
  color: var(--maestria-white);
}

.footer-eleven .newsletter-form input::placeholder {
  color: rgba(255,255,255,.42);
}

.footer-eleven .newsletter-form input:focus {
  border-color: var(--maestria-gold);
}

.footer-eleven .newsletter-form .sub-btn {
  background: var(--maestria-gold);
  color: var(--maestria-green-900);
  border-radius: 999px;
}

.footer-eleven .newsletter-form .sub-btn:hover {
  background: #D7B876;
  color: var(--maestria-green-900);
}

/* ==========================================================================
   MAESTRIA UTILITY COMPONENTS
   Add these classes to the HTML when using the new sections
   ========================================================================== */

.maestria-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--maestria-green-700);
  font-size: 12px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.maestria-eyebrow::before {
  content: "";
  width: 22px;
  height: 2px;
  background: var(--maestria-gold);
  border-radius: 999px;
}

.maestria-highlight {
  color: var(--maestria-green-700);
}

.maestria-highlight-gold {
  color: var(--maestria-gold);
}

.maestria-problem-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.maestria-problem-card {
  padding: 24px;
  border: 1px solid var(--maestria-line);
  border-radius: var(--maestria-radius-md);
  background: var(--maestria-white);
  transition: transform .25s ease, box-shadow .25s ease;
}

.maestria-problem-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--maestria-shadow-md);
}

.maestria-problem-card strong {
  display: block;
  margin-bottom: 8px;
  font-family: "Manrope", sans-serif;
  font-size: 17px;
  color: var(--maestria-ink);
}

.maestria-transform {
  padding: 80px 0;
  background: var(--maestria-green-900);
  color: var(--maestria-white);
}

.maestria-transform .step {
  color: rgba(255,255,255,.76);
}

.maestria-transform .step strong {
  color: var(--maestria-white);
  display: block;
  margin-bottom: 6px;
}

.maestria-process {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.maestria-process-card {
  position: relative;
  padding: 34px 28px;
  border-radius: var(--maestria-radius-md);
  background: var(--maestria-paper);
  border: 1px solid var(--maestria-line);
}

.maestria-process-number {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  margin-bottom: 22px;
  background: var(--maestria-green-800);
  color: var(--maestria-white);
  font-weight: 800;
}

.maestria-diagnostic-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 13px;
  border-radius: 999px;
  background: rgba(201,164,92,.14);
  color: var(--maestria-gold);
  font-size: 12px;
  font-weight: 800;
}

.maestria-faq-item {
  padding: 22px 0;
  border-bottom: 1px solid var(--maestria-line);
}

.maestria-faq-item h4 {
  font-size: 18px;
  margin-bottom: 8px;
}

.maestria-whatsapp-float {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 1000;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #25D366;
  color: #fff;
  box-shadow: 0 12px 28px rgba(0,0,0,.16);
  font-size: 24px;
}

.maestria-whatsapp-float:hover {
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 18px 34px rgba(0,0,0,.20);
}

@media (max-width: 991px) {
  .maestria-problem-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .maestria-process {
    grid-template-columns: 1fr;
  }

  .header-eight {
    padding: 155px 0 85px;
  }
}

@media (max-width: 767px) {
  .header-eight {
    padding: 125px 0 70px;
  }

  .header-eight .header-content h1 {
    font-size: 2.65rem;
    line-height: 1.03;
  }

  .header-eight .header-content p {
    font-size: 1rem;
  }

  .header-eight .button {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .header-eight .primary-btn {
    margin-right: 0;
  }

  .about-five,
  .services-eight,
  .video-one,
  .contact-section {
    padding-top: 78px;
    padding-bottom: 62px;
  }

  .about-five-content {
    padding-left: 0;
  }

  .about-image-five {
    padding-left: 0;
    margin-bottom: 42px;
  }

  .services-eight .single-services {
    padding: 30px 24px;
  }

  .contact-form-wrapper {
    padding: 28px 22px;
  }

  .maestria-problem-grid {
    grid-template-columns: 1fr;
  }

  .maestria-whatsapp-float {
    width: 52px;
    height: 52px;
    right: 16px;
    bottom: 16px;
  }
}

/* ---------- Template cleanup ---------- */

.made-in-ayroui {
  display: none !important;
}

.scroll-top {
  width: 44px;
  height: 44px;
  line-height: 44px;
  right: 22px;
  bottom: 88px;
  border-radius: 50%;
  background: var(--maestria-green-800);
  color: var(--maestria-white) !important;
  box-shadow: var(--maestria-shadow-md);
}

.scroll-top:hover {
  background: var(--maestria-gold);
  color: var(--maestria-green-900) !important;
}

.sidebar-left {
  background: var(--maestria-white);
  box-shadow: -20px 0 60px rgba(14,47,40,.12);
}

.sidebar-left .sidebar-content .sidebar-menu ul li a:hover {
  color: var(--maestria-green-700);
}

.sidebar-left .sidebar-content .sidebar-social ul li a:hover {
  background: var(--maestria-green-800);
  color: var(--maestria-white);
}

.overlay-left {
  background-color: rgba(14,47,40,.55);
}




/* ========================= Contact Section (Vamos Conversar) ========================= */
.contact-section {
  padding: 80px 0;
  background-color: #f7f4ef;
  width: 100%;
}

.contact-section .container {
  max-width: 1140px;
  width: 100%;
  margin: 0 auto;
  padding: 0 15px;
}

.contact-section .row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 0 -15px;
  width: 100%;
}

.contact-section .row > [class*="col-"] {
  padding: 0 15px;
  box-sizing: border-box;
}

.contact-section .col-xl-7 {
  flex: 0 0 60%;
  max-width: 60%;
}

.contact-section .col-xl-5 {
  flex: 0 0 40%;
  max-width: 40%;
}

.contact-section .contact-item-wrapper {
  padding-right: 30px;
}

.contact-section .small-title {
  display: inline-flex;
  align-items: center;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #1c3b32;
  margin-bottom: 15px;
  white-space: nowrap;
}

.contact-section .small-title::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 2px;
  background-color: #c9a24b;
  margin-right: 10px;
  flex-shrink: 0;
}

.contact-section h2.fw-bold {
  font-size: 32px;
  line-height: 1.3;
  color: #1c1c1c;
  margin-bottom: 20px;
}

.contact-section p {
  font-size: 16px;
  line-height: 1.7;
  color: #4a4a4a;
  margin-bottom: 18px;
}

.contact-section p strong {
  color: #1c1c1c;
  font-weight: 700;
}

.contact-section .btn.primary-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  padding: 16px 32px;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  border-radius: 30px;
  transition: all 0.3s ease;
  box-shadow: 0 4px 14px rgba(28, 59, 50, 0.25);
}

.contact-section .btn.primary-btn:hover {
  background-color: #14281f !important;
  border-color: #14281f !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(28, 59, 50, 0.35);
}

.contact-section .btn.primary-btn i {
  font-size: 18px;
}

.contact-section .contact-image {
  position: relative;
  width: 100%;
}

.contact-section .contact-image img {
  width: 100%;
  height: auto;
  min-height: 250px;
  object-fit: cover;
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
  background-color: #e8e4dc; /* aparece se a imagem não carregar */
}

/* Responsivo */
@media (max-width: 991px) {
  .contact-section .col-xl-7,
  .contact-section .col-xl-5 {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .contact-section .contact-item-wrapper {
    padding-right: 0;
    margin-bottom: 40px;
    text-align: center;
  }

  .contact-section .small-title {
    justify-content: center;
  }

  .contact-section .btn.primary-btn {
    white-space: normal;
  }
}

@media (max-width: 575px) {
  .contact-section {
    padding: 60px 0;
  }

  .contact-section h2.fw-bold {
    font-size: 26px;
  }
}

  .container-topo {
     display: flex;
    justify-content: space-between;
    align-items: center;
}

/* ========================= Latest News - tudo centralizado ========================= */
.latest-news-area .single-news {
  text-align: center;
}

.latest-news-area .single-news .image {
  display: flex;
  justify-content: center;
  margin-bottom: 20px;
}

.latest-news-area .single-news .image .thumb {
  display: block;
  margin: 0 auto;
}

/* ========================= Services - centralizar cards quando forem só 2 ========================= */
.services-eight .single-services .service-icon {
  display: flex;
  justify-content: center;
  margin: 0 auto 20px;
}



.semmargem {
    
    margin-right: 0px !important;
    margin-left: 72px !important;
  }

.compadding {
  padding-right: 20px !important;
  padding-left: 20px !important;
}  



.about-area-marcelo {
    padding: 100px 0;
    background: #f6f5ee;
    overflow: hidden;
}

.about-wrapper-marcelo {
    display: flex;
    align-items: center;
    min-height: 550px;
}

/* TEXTO */

.about-content-marcelo {
    width: 70%;
    padding: 10px 10px 0 0;
    position: relative;
    z-index: 2;
}

.about-label-marcelo {
    display: inline-block;
    margin-bottom: 15px;
    color: #d2a94e;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.about-content-marcelo h2 {
    margin-bottom: 25px;
    font-size: 42px;
    line-height: 1.15;
    font-weight: 700;
    color: #071c16;
}

.about-content-marcelo p {
    margin-bottom: 18px;
    font-size: 17px;
    line-height: 1.7;
    color: #42534e;
}

.about-button-marcelo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 15px;
    padding: 15px 28px;
    border-radius: 30px;
    background: #0d3b32;
    color: #fff !important;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
}

.about-button-marcelo:hover {
    background: #145447;
    transform: translateY(-2px);
}


/* IMAGEM */

.about-image-marcelo {
    width: 50%;
    height: 550px;
    position: relative;
    overflow: hidden;
}

.about-image-marcelo::before {
    content: "";
    position: absolute;
    z-index: 1;
    left: -1px;
    top: 0;
    width: 35%;
    height: 100%;

    background: linear-gradient(
        to right,
        #f6f5ee 0%,
        rgba(246, 245, 238, 0.9) 20%,
        rgba(246, 245, 238, 0.4) 55%,
        rgba(246, 245, 238, 0) 100%
    );
}

.about-image-marcelo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ========================================
   NOSSOS SERVIÇOS
======================================== */

.servicos-area {
    padding: 100px 0;
    background: #f6f5ee;
}

.servicos-header {
    text-align: center;
    margin-bottom: 55px;
}

.servicos-label {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    font-size: 14px;
    font-weight: 700;
    letter-spacing: 2px;
    color: #17483e;
    margin-bottom: 18px;
}

.servicos-label span {
    width: 18px;
    height: 1px;
    background: #c6a66b;
    display: inline-block;
}

.servicos-header h2 {
    margin: 0;

    font-size: 42px;
    line-height: 1.15;
    font-weight: 600;

    color: #102d27;
}


/* GRID */

.servicos-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;

    max-width: 1000px;
    margin: 0 auto;
}


/* CARD */

.servico-card {
    background: #ffffff;

    border-radius: 18px;
    overflow: hidden;

    border: 1px solid rgba(23, 72, 62, 0.08);

    box-shadow: 0 12px 35px rgba(25, 45, 40, 0.06);

    transition: all 0.3s ease;
}

.servico-card:hover {
    transform: translateY(-5px);

    box-shadow: 0 18px 45px rgba(25, 45, 40, 0.11);
}


/* IMAGEM */

.servico-imagem {
    height: 180px;
    position: relative;
    overflow: visible;
    z-index: 2;
}

.servico-imagem img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    display: block;

    transition: transform 0.5s ease;
}

.servico-card:hover .servico-imagem img {
    transform: scale(1.04);
}


/* ÍCONE */

.servico-icon {
    position: absolute;

    left: 24px;
    bottom: -25px;

    width: 62px;
    height: 62px;

    border-radius: 14px;

    background: #edf4f0;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #17483e;

    font-size: 25px;

    border: 5px solid #ffffff;
}


/* CONTEÚDO */

.servico-conteudo {
    padding: 42px 28px 30px;
}

.servico-conteudo h3 {
    margin: 0 0 5px;

    font-size: 22px;
    line-height: 1.3;

    color: #102d27;

    font-weight: 700;
}

.servico-tipo {
    display: block;

    font-size: 12px;
    color: #6b7773;

    margin-bottom: 20px;
}

.servico-conteudo p {
    font-size: 14px;
    line-height: 1.65;

    color: #52605c;

    margin: 0 0 20px;

    max-width: 430px;
}


/* LISTA */

.servico-conteudo ul {
    list-style: none;

    padding: 0;
    margin: 0 0 25px;
}

.servico-conteudo ul li {
    display: flex;
    align-items: center;
    gap: 9px;

    font-size: 13px;
    line-height: 1.5;

    color: #3e4e49;

    margin-bottom: 9px;
}

.servico-conteudo ul li span {
    width: 18px;
    height: 18px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #e5eee9;
    color: #17483e;

    font-size: 11px;
    font-weight: 700;

    flex-shrink: 0;
}


/* BOTÃO */

.servico-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;

    background: #17483e;
    color: #ffffff;

    padding: 13px 19px;

    border-radius: 30px;

    font-size: 12px;
    font-weight: 700;

    text-decoration: none;

    transition: all 0.3s ease;
}

.servico-btn span {
    font-size: 18px;
    line-height: 10px;

    transition: transform 0.3s ease;
}

.servico-btn:hover {
    background: #102f29;
    color: #ffffff;
}

.servico-btn:hover span {
    transform: translateX(4px);
}


/* ========================================
   RESPONSIVO
======================================== */

@media (max-width: 991px) {

    .servicos-area {
        padding: 20px 20px;
    }

    .servicos-header h2 {
        font-size: 34px;
    }

    .servicos-grid {
        gap: 20px;
    }

}


@media (max-width: 767px) {

    .servicos-area {
        padding: 65px 18px;
    }

    .servicos-header {
        margin-bottom: 35px;
    }

    .servicos-header h2 {
        font-size: 30px;
    }

    .servicos-grid {
        grid-template-columns: 1fr;
    }

    .servico-imagem {
        height: 190px;
    }

    .servico-conteudo {
        padding: 40px 23px 25px;
    }

}


@media (max-width: 480px) {

    .servicos-header h2 {
        font-size: 27px;
    }

    .servico-imagem {
        height: 170px;
    }

    .servico-conteudo h3 {
        font-size: 20px;
    }

    .servico-btn {
        width: 100%;
    }

}

.paddingvertical {
  padding: 50px 0px 0px 0px;
}
.paddingvertical2 {
  padding: 15px 0px !important;
}
.paddingvertical20 {
  padding: 60px 0px !important;
}
.paddingverticalaboutimg {
  padding-left: 50px !important;
}
.paddingbottom {
  padding-bottom: 30px !important;
  padding-top: 100px !important; 
}

.marginvertical10 {
  margin-bottom: 0px;
}

.alinhamentotop {
  display: flex;
  flex-direction: row; /* É o padrão, não precisa declarar obrigatoriamente */
  align-items: flex-start; /* Alinha os itens no topo */
}

.alinhamentotopimagem {
  padding: 0 !important;
}

.altura100 {
  height: 100% !important;
}



@media (max-width: 575px) {
.about-image {
    position: relative;

    top: 0;
    right: 0;
    bottom: 0;
    left: 110px; 
    width: 46%;

    z-index: 1;
}

.about-image img {
    width: 100%;
    height: 100%;

    display: block;
}
}
.hero {
    position: relative;
    background: #073b32;
    overflow: hidden;
}

.hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;

    background: linear-gradient(
        90deg,
        #073b32 0%,
        #073b32 28%,
        rgba(7, 59, 50, 0.98) 40%,
        rgba(7, 59, 50, 0.75) 52%,
        rgba(7, 59, 50, 0.25) 67%,
        rgba(7, 59, 50, 0) 82%
    );

    pointer-events: none;
}

.hero-content {
    position: relative;
    z-index: 2;
}

.hero-title {
    font-size: clamp(52px, 5vw, 76px);
    line-height: 0.98;
    max-width: 680px;
    letter-spacing: -2px;
}

/* ========================================
   HERO
======================================== */

#hero-area {
    position: relative;
    min-height: 620px;

    background: #073b32;

    overflow: hidden;

    display: flex;
    align-items: center;
}


/* ========================================
   IMAGEM DO HERO
======================================== */

#hero-area .hero-image {
    position: absolute;

    top: 0;
    right: 0;
    bottom: 0;

    width: 63%;

    z-index: 0;
}

#hero-area .hero-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    display: block;
}


/* ========================================
   FADE SOBRE A IMAGEM
======================================== */

#hero-area .hero-image::after {
    content: "";

    position: absolute;

    inset: 0;

    background: linear-gradient(
        90deg,
        #073b32 0%,
        #073b32 15%,
        rgba(7, 59, 50, 0.98) 30%,
        rgba(7, 59, 50, 0.80) 43%,
        rgba(7, 59, 50, 0.40) 58%,
        rgba(7, 59, 50, 0.10) 72%,
        rgba(7, 59, 50, 0) 100%
    );

    z-index: 1;

    pointer-events: none;
}


/* ========================================
   CONTEÚDO
======================================== */

#hero-area .container {
    position: relative;

    z-index: 3;

    width: 100%;
}

#hero-area .hero-content {
    max-width: 700px;

    padding: 80px 0;
}


/* ========================================
   EYEBROW
======================================== */

.hero-eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;

    margin-bottom: 22px;

    color: #d1ad62;

    font-size: 13px;
    font-weight: 700;

    letter-spacing: 3px;
    text-transform: uppercase;
}

.hero-line {
    width: 38px;
    height: 2px;

    background: #d1ad62;

    display: inline-block;
}


/* ========================================
   TÍTULO
======================================== */

.hero-title {
    margin: 0;

    max-width: 720px;

    color: #ffffff;

    font-size: clamp(52px, 5vw, 78px);

    line-height: 0.98;

    font-weight: 700;

    letter-spacing: -2.5px;
}


/* ========================================
   DESCRIÇÃO
======================================== */

.hero-description {
    max-width: 570px;

    margin: 30px 0 28px;

    color: rgba(255, 255, 255, 0.86);

    font-size: 19px;

    line-height: 1.55;
}


/* ========================================
   BOTÃO
======================================== */

.hero-actions {
    display: flex;
    align-items: center;
}

.hero-btn {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 10px;

    padding: 15px 25px;

    border-radius: 30px;

    background: #c9a45c;

    border: 1px solid #c9a45c;

    color: #ffffff;

    font-size: 15px;

    font-weight: 700;

    text-decoration: none;

    transition: all 0.3s ease;
}

.hero-btn:hover {
    background: #b8924c;

    border-color: #b8924c;

    color: #ffffff;

    transform: translateY(-2px);
}

.hero-btn i {
    font-size: 18px;
}

.hero-arrow {
    margin-left: 4px;

    font-size: 19px;

    transition: transform 0.3s ease;
}

.hero-btn:hover .hero-arrow {
    transform: translateX(4px);
}


/* ========================================
   TABLET
======================================== */

@media (max-width: 991px) {

    #hero-area {
        min-height: 600px;
    }

    #hero-area .hero-image {
        width: 70%;
    }

    #hero-area .hero-content {
        max-width: 650px;
    }

    .hero-title {
        font-size: 58px;
    }

}


/* ========================================
   MOBILE
======================================== */

@media (max-width: 767px) {

    #hero-area {
        min-height: auto;

        display: block;

        padding: 0;
    }


    /* imagem deixa de ser absoluta */

    #hero-area .hero-image {
        position: relative;

        width: 100%;

        height: 320px;

        top: auto;
        right: auto;
        bottom: auto;

        order: 2;
    }


    #hero-area .hero-image img {
        object-position: center;
    }


    /* fade vertical */

    #hero-area .hero-image::after {
        background: linear-gradient(
            to bottom,
            #073b32 0%,
            rgba(7, 59, 50, 0.75) 15%,
            rgba(7, 59, 50, 0.15) 45%,
            rgba(7, 59, 50, 0) 75%
        );
    }


    #hero-area .container {
        width: 100%;
    }


    #hero-area .hero-content {
        max-width: none;

        padding: 55px 24px 45px;
    }


    .hero-eyebrow {
        font-size: 10px;

        letter-spacing: 2px;

        gap: 9px;

        margin-bottom: 18px;
    }


    .hero-line {
        width: 25px;
    }


    .hero-title {
        font-size: clamp(40px, 11vw, 55px);

        line-height: 1;

        letter-spacing: -1.5px;
    }


    .hero-description {
        margin-top: 24px;

        font-size: 17px;

        line-height: 1.5;
    }


    .hero-btn {
        width: auto;

        padding: 14px 21px;

        font-size: 14px;
    }

}


/* ========================================
   HERO
======================================== */

#hero-area {
    position: relative;
    height: 650px;
    min-height: 650px;

    background: #073b32;

    overflow: hidden;

    display: flex;
    align-items: center;
}


/* ========================================
   IMAGEM
======================================== */

#hero-area .hero-image {
    position: absolute;

    top: 0;
    right: 0;
    bottom: 0;

    width: 53%;

    z-index: 0;
}

#hero-area .hero-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center center;

    display: block;
}


/* ========================================
   FADE DA IMAGEM
======================================== */

#hero-area .hero-image::after {
    content: "";

    position: absolute;
    inset: 0;

    background: linear-gradient(
        90deg,
        #073b32 0%,
        #073b32 12%,
        rgba(7, 59, 50, 0.96) 25%,
        rgba(7, 59, 50, 0.72) 40%,
        rgba(7, 59, 50, 0.35) 58%,
        rgba(7, 59, 50, 0.08) 78%,
        transparent 100%
    );

    z-index: 1;

    pointer-events: none;
}


/* ========================================
   CONTAINER
======================================== */

#hero-area .container {
    position: relative;

    z-index: 3;

    width: 100%;
}


/* ========================================
   CONTEÚDO
======================================== */

#hero-area .hero-content {
    max-width: 720px;

    padding: 0;

    position: relative;
    z-index: 3;
}


/* ========================================
   EYEBROW
======================================== */

.hero-eyebrow {
    display: flex;
    align-items: center;

    gap: 14px;

    margin-bottom: 24px;

    color: #d1ad62;

    font-size: 13px;
    font-weight: 700;

    letter-spacing: 3px;
    text-transform: uppercase;
}

.hero-line {
    width: 38px;
    height: 2px;

    background: #d1ad62;

    display: inline-block;
}


/* ========================================
   TÍTULO
======================================== */

.hero-title {
    margin: 0;

    max-width: 720px;

    color: #ffffff;

    font-size: clamp(50px, 4.5vw, 72px);

    line-height: 1;

    font-weight: 700;

    letter-spacing: -2.5px;
}


/* ========================================
   DESCRIÇÃO
======================================== */

.hero-description {
    max-width: 570px;

    margin: 28px 0 28px;

    color: rgba(255, 255, 255, 0.88);

    font-size: 18px;

    line-height: 1.55;
}


/* ========================================
   BOTÃO
======================================== */

.hero-actions {
    display: flex;
    align-items: center;
}

.hero-btn {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 10px;

    padding: 14px 24px;

    border-radius: 30px;

    background: #c9a45c;

    border: 1px solid #c9a45c;

    color: #ffffff;

    font-size: 15px;
    font-weight: 700;

    text-decoration: none;

    transition: all 0.3s ease;
}

.hero-btn:hover {
    background: #b8924c;

    border-color: #b8924c;

    color: #ffffff;

    transform: translateY(-2px);
}

.hero-btn i {
    font-size: 18px;
}

.hero-arrow {
    margin-left: 4px;

    font-size: 18px;

    transition: transform 0.3s ease;
}

.hero-btn:hover .hero-arrow {
    transform: translateX(4px);
}


/* ========================================
   DESKTOP MENOR
======================================== */

@media (max-width: 1200px) {

    #hero-area {
        height: 600px;
        min-height: 600px;
    }

    #hero-area .hero-image {
        width: 52%;
    }

    .hero-title {
        font-size: 62px;
    }

    .hero-description {
        font-size: 17px;
    }
}


/* ========================================
   TABLET
======================================== */

@media (max-width: 991px) {

    #hero-area {
        height: 580px;
        min-height: 580px;
    }

    #hero-area .hero-image {
        width: 55%;
    }

    #hero-area .hero-content {
        max-width: 620px;
    }

    .hero-title {
        font-size: 54px;
    }

    .hero-description {
        max-width: 500px;
        font-size: 17px;
    }

}


/* ========================================
   MOBILE
======================================== */

@media (max-width: 767px) {

    #hero-area {
        height: auto;
        min-height: auto;

        display: flex;
        flex-direction: column;

        align-items: stretch;
    }


    /* TEXTO */

    #hero-area .container {
        order: 1;
    }

    #hero-area .hero-content {
        max-width: none;

        padding: 55px 24px 45px;
    }


    .hero-eyebrow {
        font-size: 10px;
        letter-spacing: 2px;

        gap: 9px;

        margin-bottom: 18px;
    }

    .hero-line {
        width: 25px;
    }


    .hero-title {
        font-size: clamp(40px, 10vw, 52px);

        line-height: 1;

        letter-spacing: -1.5px;
    }


    .hero-description {
        margin-top: 22px;

        font-size: 16px;
        line-height: 1.5;
    }


    .hero-btn {
        padding: 14px 20px;

        font-size: 14px;
    }


    /* IMAGEM */

    #hero-area .hero-image {
        order: 2;

        position: relative;

        top: auto;
        right: auto;
        bottom: auto;

        width: 100%;

        height: 300px;
    }


    /* FADE VERTICAL */

    #hero-area .hero-image::after {
        background: linear-gradient(
            to bottom,
            #073b32 0%,
            rgba(7, 59, 50, 0.75) 12%,
            rgba(7, 59, 50, 0.20) 40%,
            transparent 70%
        );
    }

}


/* ========================================
   MOBILE PEQUENO
======================================== */

@media (max-width: 480px) {

    #hero-area .hero-content {
        padding: 45px 20px 40px;
    }

    .hero-title {
        font-size: 40px;
    }

    .hero-description {
        font-size: 16px;
    }

    .hero-btn {
        width: 100%;
    }

    #hero-area .hero-image {
        height: 270px;
    }
}

/* LOGO DO RODAPÉ */
.footer-logo img {
    width: 280px;
    max-width: 100%;
    height: auto;
   
   
}

/* DESKTOP */
@media (min-width: 992px) {
    .footer-logo {
        padding-top: 10px;
    }
}

/* TABLET */
@media (max-width: 991px) {
    .footer-logo img {
        width: 190px;
    }
}

/* CELULAR */
@media (max-width: 767px) {
    .footer-logo img {
        width: 170px;
    }
}

.text-footer {
  width: 290px;
}

#contato {
  scroll-margin-top: 110px; /* Ajuste para a altura do seu cabeçalho */
}

#sobre {
  scroll-margin-top: 118px; /* Ajuste para a altura do seu cabeçalho */
}

#services {
  scroll-margin-top: 90px; /* Ajuste para a altura do seu cabeçalho */
}
#diagnostico {
  scroll-margin-top: 90px; /* Ajuste para a altura do seu cabeçalho */
}

#desafio {
  scroll-margin-top: 118px; /* Ajuste para a altura do seu cabeçalho */
}

.paddingprimeiro{
  padding-top: 50px !important;
}

/* ==========================================
   PRESENÇA NACIONAL
========================================== */

.brasil-presence {
    display: inline-flex;
    align-items: center;
    gap: 12px;

    margin-top: 24px;

    color: #ffffff;
}


/* ==========================================
   ÍCONE DO BRASIL
========================================== */

.brasil-icon-wrapper {
    position: relative;

    width: 38px;
    height: 38px;

    min-width: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: rgba(201, 164, 92, 0.10);

    border: 1px solid rgba(201, 164, 92, 0.45);
}


/* ÍCONE */

.brasil-icon {
    width: 21px !important;
    height: 21px !important;

    max-width: 21px !important;

    object-fit: contain;

    position: relative;

    z-index: 2;

    display: block;

    margin: 0 !important;

    /* se o ícone for escuro, transforma em dourado */
    filter: brightness(0) saturate(100%)
            invert(70%)
            sepia(30%)
            saturate(600%)
            hue-rotate(355deg)
            brightness(90%);
}


/* ==========================================
   PULSO
========================================== */

.pulse-ring {
    position: absolute;

    width: 100%;
    height: 100%;

    border-radius: 50%;

    border: 1px solid #c9a45c;

    opacity: 0;

    animation: brasilPulse 2.8s ease-out infinite;
}


/* segundo pulso, mais discreto */

.pulse-ring::after {
    content: "";

    position: absolute;

    inset: -5px;

    border-radius: 50%;

    border: 1px solid rgba(201, 164, 92, 0.35);

    opacity: 0;

    animation: brasilPulse 2.8s ease-out infinite;
    animation-delay: 1.4s;
}


@keyframes brasilPulse {

    0% {
        transform: scale(0.8);
        opacity: 0.65;
    }

    70% {
        transform: scale(1.7);
        opacity: 0;
    }

    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}


/* ==========================================
   TEXTO
========================================== */

.brasil-presence-text {
    display: flex;

    flex-direction: column;

    gap: 3px;
}


.brasil-presence-text span {
    color: #c9a45c;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 1.8px;

    line-height: 1.2;
}


.brasil-presence-text small {
    color: rgba(255, 255, 255, 0.65);

    font-size: 12px;

    line-height: 1.4;
}


/* ==========================================
   HOVER — TOQUE INTERATIVO
========================================== */

.brasil-presence {
    transition: transform 0.3s ease;


}

.brasil-presence span{
    font-size: 0.6em ;


}


.brasil-presence small{
    font-size: 0.53em ;


}


.brasil-presence:hover {
    transform: translateX(3px);
}

.brasil-presence:hover .brasil-icon-wrapper {
    background: rgba(201, 164, 92, 0.18);

    border-color: #c9a45c;
}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 767px) {

    .brasil-presence {
        gap: 10px;
        margin-top: 20px;
    }

    .brasil-icon-wrapper {
        width: 34px;
        height: 34px;

        min-width: 34px;
    }

    .brasil-icon {
        width: 18px !important;
        height: 18px !important;

        max-width: 18px !important;
    }

    
}

/* ==========================================================================
   AJUSTES MOBILE / RESPONSIVO — MAESTRIA
   (bloco final: sobrescreve regras antigas do template sem alterar o desktop)
   ========================================================================== */

/* ---------- 1. HERO: conteúdo não pode ficar atrás do header ----------
   O header é position:absolute (78px no mobile), então o hero precisa
   reservar esse espaço. Antes o eyebrow ficava escondido atrás do menu. */
@media (max-width: 767px) {
  #hero-area .hero-content.paddingprimeiro {
    padding-top: 112px !important;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  #hero-area .hero-content.paddingprimeiro {
    padding-top: 100px !important;
  }
}

/* Logo do header sempre visível e sem distorcer */
.navbar-area.navbar-nine .navbar-brand img {
  height: auto;
  object-fit: contain;
}


/* ---------- 2. EYEBROW "O DESAFIO DE QUEM FAZ O NEGÓCIO ACONTECER" ----------
   O span era inline: ao quebrar linha, a 2ª linha perdia o recuo do traço.
   Agora é block, então as duas linhas ficam alinhadas ao texto. */
.about-five-content .small-title {
  display: block;
  position: relative;
  padding-left: 32px;
  line-height: 1.5;
  text-wrap: balance;
}

.about-five-content .small-title::before {
  top: 0.75em;
  margin-top: 0;
}

@media (max-width: 767px) {
  .about-five-content .small-title {
    font-size: 12.5px;
    letter-spacing: .1em;
    padding-left: 30px;
  }

  .about-five-content .main-title {
    margin-top: 14px;
    line-height: 1.2;
  }
}


/* ---------- 3. SEÇÃO SOBRE: empilhar texto + foto no mobile ---------- */
@media (max-width: 991.98px) {
  .about-area-marcelo {
    padding: 70px 0;
  }

  .about-wrapper-marcelo {
    flex-direction: column;
    align-items: stretch;
    min-height: 0;
  }

  .about-content-marcelo {
    width: 100%;
    padding: 0;
  }

  .about-content-marcelo h2 {
    font-size: 34px;
    margin-bottom: 20px;
  }

  .about-content-marcelo p {
    font-size: 16px;
    line-height: 1.65;
  }

  .about-image-marcelo {
    width: 100%;
    height: 340px;
    margin-top: 36px;
    border-radius: 20px;
    box-shadow: 0 14px 34px rgba(14, 47, 40, .14);
  }

  /* o degradê lateral só faz sentido no desktop */
  .about-image-marcelo::before {
    display: none;
  }

  .about-image-marcelo img {
    object-position: center top;
  }
}

/* Mobile: esconde a foto da seção Sobre (texto em largura total) */
@media (max-width: 767.98px) {
  .about-image-marcelo {
    display: none !important;
  }
}

/* Botão "Falar com o Especialista": nunca quebra em 2 linhas */
.about-button-marcelo {
  white-space: nowrap;
}

@media (max-width: 575.98px) {
  .about-button-marcelo {
    display: flex;
    width: 100%;
    padding: 16px 20px;
  }
}


/* ---------- 4. FOTO DA EQUIPE (CONTATO) ----------
   Causa do desalinhamento: .row com width:100% + margem negativa
   deslocava a coluna ~15px para a esquerda e encolhia a direita. */
.contact-section .row {
  width: auto;
  max-width: none;
  margin-left: -15px;
  margin-right: -15px;
}

section#contato.contact-section {
  padding-bottom: 64px;
}

.contact-section .contact-image {
  width: 100%;
}

.contact-section .contact-image img,
.contact-section .contact-image img.rounded {
  display: block;
  width: 100%;
  border-radius: 16px !important; /* a classe .rounded do Bootstrap usa !important */
}

@media (max-width: 991.98px) {
  .contact-section .contact-item-wrapper {
    margin-bottom: 32px;
  }

  .contact-section .contact-image img {
    min-height: 0;
    aspect-ratio: 4 / 3;
    object-fit: cover;
  }
}

@media (max-width: 575.98px) {
  section#contato.contact-section {
    padding-top: 60px;
    padding-bottom: 56px;
  }

  /* botão "Agendar conversa gratuita" em largura total, 1 linha só */
  .contact-section .btn.primary-btn {
    width: 100%;
    justify-content: center;
    padding: 16px 20px;
    white-space: nowrap;
  }
}


/* ---------- 5. FOOTER: alinhamento consistente no mobile/tablet ----------
   Antes: logo/texto/Brasil alinhados à esquerda e "Links" centralizado.
   Agora tudo centralizado. */
@media (max-width: 991.98px) {
  .footer-eleven .footer-top .row > [class*="col-"] {
    text-align: center;
  }

  .footer-eleven .footer-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0;
  }

  .footer-eleven .footer-logo img {
    margin: 0 auto;
  }

  .footer-eleven .text-footer {
    width: auto;
    max-width: 320px;
    margin: 18px auto 0;
  }

  .footer-eleven .brasil-presence {
    display: flex;
    width: fit-content;
    max-width: 100%;
    margin: 24px auto 0;
    justify-content: center;
    text-align: left;
  }

  /* texto estava em ~9px (0.6em / 0.53em) — ilegível no celular */
  .footer-eleven .brasil-presence .brasil-presence-text span {
    font-size: 11px;
    letter-spacing: 1.4px;
  }

  .footer-eleven .brasil-presence .brasil-presence-text small {
    font-size: 12px;
  }

  .footer-eleven .footer-widget {
    margin-top: 36px;
  }

  .footer-eleven .footer-widget h5 {
    margin-bottom: 18px;
  }

  .footer-eleven .f-link li a {
    overflow-wrap: anywhere;
  }
}


/* ---------- FOOTER DESKTOP: espaço entre "Onde estamos?", "E-mail" e "WhatsApp" ---------- */
@media (min-width: 992px) {
  .footer-eleven .footer-widget + .footer-widget {
    margin-top: 34px;
  }

  .footer-eleven .footer-widget h5 {
    margin-bottom: 16px;
  }

  .footer-eleven .footer-widget p {
    margin-bottom: 0;
    line-height: 1.6;
  }
}