/*

Template 2098 Health

http://www.tooplate.com/view/2098-health

*/

  @import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600');

  body {
    background: #ffffff;
    font-family: 'Poppins', sans-serif;
    overflow-x: hidden;
  }


  /*---------------------------------------
     TYPOGRAPHY              
  -----------------------------------------*/

  h1,h2,h3,h4,h5,h6 {
    font-weight: 600;
    line-height: inherit;
  }

  h1,h2,h3,h4 {
    letter-spacing: -1px;
  }

  h5 {
    font-weight: 500;
  }

  h1 {
    color: #252525;
    font-size: 5em;
  }

  h2 {
    color: #272727;
    font-size: 3em;
    padding-bottom: 10px;
  }

  h3 {
    font-size: 1.8em;
    line-height: 1.2em;
    margin-bottom: 0;
  }

  h4 {
    color: #454545;
    font-size: 1.8em;
    padding-bottom: 2px;
  }

  h6 {
    letter-spacing: 0;
    font-weight: normal;
  }

  p {
    color: #757575;
    font-size: 14px;
    font-weight: normal;
    line-height: 24px;
  }


  /*---------------------------------------
     GENERAL               
  -----------------------------------------*/

  html{
    -webkit-font-smoothing: antialiased;
  }

  a {
    color: #252525;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    text-decoration: none !important;
  }

  a:hover, a:active, a:focus {
    color: #026760;
    outline: none;
  }

  ::-webkit-scrollbar{
    width: 8px;
    height: 8px;
  }

  ::-webkit-scrollbar-thumb {
    cursor: pointer;
    background: #000000;
  }

  .section-title {
    padding-bottom: 20px;
  }

  .section-title h2 {
    margin-top: 0;
  }

  .section-btn {
    background: #026760;
    border: 0;
    border-radius: 3px;
    color: #ffffff;
    font-size: inherit;
    font-weight: 500;
    padding: 14px 20px;
    transition: transform 0.1s ease-in;
    transform: translateX(0);
  }

  .section-btn:hover {
    transform: translateY(-5px);
  }

  .text-align-right {
    text-align: right;
  }

  .text-align-center {
    text-align: center;
  }

  .border-top {
    border-top: 1px solid #f2f2f2;
    margin-top: 4em;
    padding-top: 2.5em;
  }

  .btn-gray {
    background: #393939;
  }

  .btn-blue {
    background: #4267b2;
  }

  .news-thumb {
    background: #ffffff;
    border-radius: 10px;
  }
  .news-thumb img {
    border-radius: 10px 10px 0 0;
  }

  .news-info {
    padding: 30px;
    text-align: left;
  }
  .news-info span {
    display: block;
    letter-spacing: 0.5px;
  }
  .news-info h3 {
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .author {
    border-top: 1px solid #f0f0f0;
    padding-top: 1.5em;
    margin-top: 2em;
  }
  .author img,
  .author .author-info {
    display: inline-block;
    vertical-align: top;
  }
  .author-info h5 {
    margin-bottom: 0;
  }
  .author img {
    border-radius: 100%;
    width: 50px;
    height: 50px;
    margin-right: 10px;
  }


  #about, #team, #news,
  #news-detail {
    position: relative;
    padding-top: 100px;
    padding-bottom: 100px;
  }

  #news, #service {
    text-align: center;
  }

  #google-map {
    line-height: 0;
    margin: 0;
    padding: 0;
  }


  /*---------------------------------------
       PRE LOADER              
  -----------------------------------------*/

  .preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99999;
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    align-items: center;
    background: none repeat scroll 0 0 #ffffff;
  }

  .spinner {
    border: 1px solid transparent;
    border-radius: 3px;
    position: relative;
  }

  .spinner:before {
    content: '';
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 45px;
    height: 45px;
    margin-top: -10px;
    margin-left: -10px;
    border-radius: 50%;
    border: 1px solid #575757;
    border-top-color: #ffffff;
    animation: spinner .9s linear infinite;
  }

  @-webkit-@keyframes spinner {
    to {transform: rotate(360deg);}
  }

  @keyframes spinner {
    to {transform: rotate(360deg);}
  }



  /*---------------------------------------
      MENU              
  -----------------------------------------*/

  header {
    background: #077A71;
    border-bottom: 1px solid #f2f2f2;
    display: flex;
    height: 45px;
  }

  header .col-md-8 {
    padding-right: 0;
  }

  header p,
  header span {
    font-size: 12px;
    line-height: 24px;
    padding-top: 12px;
  }

  header a,
  header span {
    color: #747474;
  }

  header span {
    font-weight: 500;
    display: inline-block;
    padding: 11px 15px;
  }

  header span.date-icon {
    border-left: 1px solid #f2f2f2;
    border-right: 1px solid #f2f2f2;
    padding-right: 19px;
    padding-left: 19px;
  }

  header span i {
    color: #026760;
    margin-right: 5px;
  }



  /*---------------------------------------
      MENU              
  -----------------------------------------*/

  .navbar-default {
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,.075);
    border: none;
    margin-bottom: 0;
    padding: 10px;
  }

  .navbar-default .navbar-brand {
    color: #393939;
    font-weight: 500;
  }

  .navbar-default .navbar-brand .fa {
    color: #026760;
  }

  .navbar-default .navbar-nav li.appointment-btn {
    margin: 3px 0 0 20px;
  }

  .navbar-default .navbar-nav li.appointment-btn a {
    background: #026760;
    border-radius: 3px;
    color: #ffffff;
    font-weight: 600;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .navbar-default .navbar-nav li.appointment-btn a:hover {
    background: #4267b2;
    color: #ffffff !important;
  }

  .navbar-default .navbar-nav li a {
    color: #555555;
    font-size: 12px;
    font-weight: 500;
    padding-right: 20px;
    padding-left: 20px;
    -webkit-transition: all ease-in-out 0.4s;
    transition: all ease-in-out 0.4s;
  }

  .navbar-default .navbar-nav > li a:hover {
    color: #393939 !important;
  }

  .navbar-default .navbar-nav > li > a:hover,
  .navbar-default .navbar-nav > li > a:focus {
    color: #555555;
    background-color: transparent;
  }

  .navbar-default .navbar-nav > .active > a,
  .navbar-default .navbar-nav > .active > a:hover,
  .navbar-default .navbar-nav > .active > a:focus {
    color: #393939;
    background-color: transparent;
  }

  .navbar-default .navbar-toggle {
    border: none;
    padding-top: 10px;
  }

  .navbar-default .navbar-toggle .icon-bar {
    background: #393939;
    border-color: transparent;
  }

  .navbar-default .navbar-toggle:hover,
  .navbar-default .navbar-toggle:focus { 
    background-color: transparent;
  }



  /*---------------------------------------
      HOME              
  -----------------------------------------*/

  #home h1 {
    color: #ffffff;
    padding-bottom: 10px;
    margin-top: 0;
  }

  #home h3 {
    color: #ffffff;
    font-size: 14px;
    font-weight: normal;
    line-height: inherit;
    letter-spacing: 3px;
    text-transform: uppercase;
    margin: 0;
  }

  .slider .container {
    width: 100%;
  }

  .slider .owl-dots {
      position: absolute;
      top: 575px;
      width: 100%;
      justify-content: center;
  }

  .owl-theme .owl-dots .owl-dot span {
    width: 8px;
    height: 8px;
    margin: 5px 7px;
    border: 2px solid #d9d9d9;
    background: transparent;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity 200ms ease;
    border-radius: 30px;
  }

  .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background-color: #ffffff;
    border-color: transparent;
  }

  .slider .caption {
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    background-color: rgba(20,20,20,0.2);
    height: 100%;
    color: #fff;
    cursor: e-resize;
  }

  .slider .item {
    background-position: inherit;
    background-repeat: no-repeat;
    background-attachment: local;
    background-size: cover;
    height: 650px;
  }

  .slider .item-first {
    background-image: url(../images/s1.jpg);
  }

  .slider .item-second {
    background-image: url(../images/s2.jpg);
  }

  .slider .item-third {
    background-image: url(../images/s3.jpg);
  }


  /*---------------------------------------
      ABOUT              
  -----------------------------------------*/

  #about {
    background: url('../images/image.png') no-repeat top center;

  }

  .profile img,
  .profile figcaption {
    display: inline-block;
    vertical-align: top;
    margin-top: 1em;
  }
  .profile img {
    border-radius: 100%;
    width: 65px;
    height: 65px;
    margin-right: 1em;
  }
  .profile figcaption h3 {
    margin-top: 0;
  }

  #about h6 {
    color: #858585;
    margin: 0;
  }



  /*---------------------------------------
      TEAM MEMBERS              
  -----------------------------------------*/

  .team-thumb {
    background-color: #f9f9f9;
    border-radius: 0 0 10px 10px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
  }

  .team-info {
    padding: 20px 30px 0 30px;
  }

  .team-contact-info {
    border-top: 1px solid #e9e9e9;
    padding-top: 1.2em;
    margin-top: 1.5em;
  }

  .team-contact-info .fa {
    margin-right: 5px;
    display: inline-block;
  }

  .team-contact-info p {
    margin-bottom: 2px;
  }

  .team-contact-info a {
    color: #757575;
  }

  .team-thumb .social-icon li {
    font-weight: 500;
  }

  .team-thumb .social-icon li a {
    background: #ffffff;
    border-radius: 100%;
    font-size: 20px;
    width: 50px;
    height: 50px;
    line-height: 50px;
    margin: 0 2px 0 2px;
  }

  .team-thumb .social-icon {
    opacity: 0;
    transform: translateY(100%);
    transition: 0.5s 0.2s;
    text-align: center;
    position: relative;
    top: 0;
  }

  .team-thumb:hover .social-icon {
    opacity: 1;
    transition-delay: 0.3s;
    transform: translateY(0px);
    top: -22em;
  }



  /*---------------------------------------
     SERVICE              
  -----------------------------------------*/


  #service h2,
  #service h4 {
    color: #ffffff;
  }

  #service p {
    color: #d9d9d9;
  }

  #service .service-thumb {
    padding: 0 22px;
  }

  #service .fa {
    font-size: 50px;
    margin-bottom: 10px;
    background: #ffffff;
    color: #026760;
    width: 120px;
    height: 120px;
    line-height: 120px;
    border-radius: 100%;
  }


  /*---------------------------------------
      NEWS             
  -----------------------------------------*/

  #news, #news-detail {
    background: #f9f9f9;
  }

  #news-detail blockquote {
    margin: 30px 0;
  }

  .news-detail-thumb .news-image img {
    border-radius: 10px;
  }

  .news-detail-thumb h3 {
    margin-bottom: 8px;
  }

  .news-image {
    margin-bottom: 30px;
    position: relative;
  }

  .news-image img {
    width: 100%;
  }

  .news-detail-thumb ul {
    margin: 32px 12px 22px 0px;
  }

  .news-detail-thumb ul li {
    list-style: circle;
    font-weight: normal;
    padding: 6px 12px 6px 0px;
  }

  .news-sidebar {
    margin-top: 16px;
  }

  .news-social-share {
    text-align: center;
    padding-top: 22px;
  }

  .news-social-share .btn {
    border-radius: 100px;
    border: none;
    font-size: 10px;
    font-weight: 600;
    margin: 2px 6px;
    padding: 8px 14px;
  }

  .news-social-share .btn-primary {
    background: #3b5998;
  }

  .news-social-share .btn-success {
    background: #1da1f2;
  }

  .news-social-share .btn-danger {
    background: #dd4b39;
  }

  .news-social-share a .fa {
    padding-right: 4px;
  }

  .recent-post {
    padding-top: 2px;
    padding-bottom: 18px;
  }

  .recent-post .media img {
    border-radius: 100%;
    width: 80px;
    height: 80px;
    margin-right: 5px;
  }

  .recent-post .media-heading {
    font-size: 16px;
    font-weight: 500;
    line-height: inherit;
    margin-top: 5px;
  }

  .news-categories {
    margin-top: 8px;
  }

  .news-categories li a {
    color: #2b2b2b;
  }

  .news-ads {
    background: #ffffff;
    border-right: 4px solid #2b2b2b;
    padding: 42px;
    text-align: center;
    margin: 26px 0 26px 0;
  }

  .news-ads.sidebar-ads {
    border-left: 4px solid #2b2b2b;
    border-right: 0px;
  }

  .news-ads h4 {
    font-size: 18px;
  }

  .news-tags h4 {
    padding-bottom: 6px;
  }

  .news-categories li,
  .news-tags li {
    list-style: none;
    display: inline-block;
    margin: 4px;
  }

  .news-tags li a {
    background: #393939;
    border-radius: 50px;
    color: #ffffff;
    display: inline-block;
    font-size: 12px;
    font-weight: 500;
    text-decoration: none;
    float: left;
    min-width: 30px;
    padding: 6px 12px;
    -webkit-transition: all ease-in-out 0.4s;
    transition: all ease-in-out 0.4s;
  }

  .news-tags li a:hover {
    background: #4267b2;
  }



  /*---------------------------------------
      APPOINTMENT             
  -----------------------------------------*/

  #appointment {
    padding-top: 100px;
  }

  #appointment label {
    color: #393939;
    font-weight: 500;
  }

  #appointment .form-control {
    background: #f9f9f9;
    border: none;
    border-radius: 3px;
    box-shadow: none;
    font-size: 14px;
    font-weight: normal;
    margin-bottom: 15px;
    transition: all ease-in-out 0.4s;
  }

  #appointment input,
  #appointment select {
    height: 45px;
  }

  #appointment button#cf-submit {
    background: #026760;
    color: #ffffff;
    font-weight: 600;
    height: 55px;
  }

  #appointment button#cf-submit:hover {
    background: #393939;
    color: #ffffff;
  }


  /*---------------------------------------
     FOOTER              
  -----------------------------------------*/

  footer {
    padding-top: 80px;
    padding-bottom: 40px;
  }

  footer h4 {
    padding-bottom: 5px;
  }

  footer a {
    color: #757575;
  }

  footer a:hover {
    color: #4267b2;
  }

  .contact-info {
    padding-top: 10px;
  }

  .contact-info .fa {
    background: #393939;
    border-radius: 100%;
    color: #ffffff;
    font-size: 15px;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    margin-right: 5px;
    margin-bottom: 2px;
  }

  .latest-stories {
    margin-bottom: 20px;
  }

  .stories-image,
  .stories-info {
    display: inline-block;
    vertical-align: top;
  }

  .stories-image img {
    border-radius: 100%;
    width: 65px;
    height: 65px;
  }

  .stories-info {
    margin-left: 15px;
  }

  .stories-info h5 {
    margin-bottom: 2px;
  }

  .stories-info span {
    color: #858585;
    font-size: 12px;
  }

  .opening-hours p {
    line-height: 18px;
  }

  .opening-hours span {
    font-weight: 500;
    display: inline-block;
    padding-left: 10px;
  }

  .copyright-text p,
  .footer-link a {
    color: #858585;
    font-size: 12px;
    font-weight: 500;
  }

  .footer-link a {
    font-size: 12px;
    display: inline-block;
    padding: 0 10px;
    margin-top: 4px;
  }

  .angle-up-btn {
    position: relative;
    bottom: 4em;
    display: block;
  }

  .angle-up-btn a {
    background: #ffffff;
    border: 1px solid #f2f2f2;
    border-radius: 3px;
    font-size: 20px;
    color: #393939;
    display: inline-block;
    text-align: center;
    width: 40px;
    height: 40px;
    line-height: 38px;
    transition: transform 0.1s ease-in;
    transform: translateX(0);
  }

  .angle-up-btn a:hover {
    background: #4267b2;
    color: #ffffff;
    transform: translateY(-5px);
  }


  /*---------------------------------------
     SOCIAL ICON              
  -----------------------------------------*/

  .social-icon {
    position: relative;
    padding: 0;
    margin: 0;
  }

  .social-icon li {
    display: inline-block;
    list-style: none;
  }

  .social-icon li a {
    border-radius: 100px;
    color: #464646;
    font-size: 15px;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-decoration: none;
    text-align: center;
    transition: all 0.4s ease-in-out;
    position: relative;
  }

  .social-icon li a:hover {
    background: #4267b2;
    color: #ffffff;
  }


  /*---------------------------------------
     RESPONSIVE STYLES              
  -----------------------------------------*/

  @media only screen and (max-width: 1200px) {
    h1 {
      font-size: 4em;
    }
    h2 {
      font-size: 2.5em;
    }
    h3 {
      font-size: 1.5em;
    }

    header {
      height: inherit;
    }
    header span.date-icon {
      border: 0;
      padding-right: 0;
      padding-left: 0;
    }
    header span.email-icon {
      padding-top: 0;
    }

    .navbar-default .navbar-nav li a {
      padding-right: 15px;
      padding-left: 15px;
    }
  }

  @media only screen and (max-width: 992px) {
    .slider .item {
      background-position: center;
    }

    header {
      padding-bottom: 10px;
    }
    header .text-align-right {
      text-align: left;
    }
    header span {
      padding-top: 0;
      padding-left: 0;
      padding-bottom: 0;
    }
  }

  @media only screen and (max-width: 767px) {
    .navbar-default .navbar-collapse, .navbar-default .navbar-form {
      border-color: transparent;
    }
    .navbar-default .navbar-nav li.appointment-btn {
      margin-left: 15px;
    }
    .navbar-default .navbar-nav li a {
      display: inline-block;
      padding-top: 8px;
      padding-bottom: 8px;
    }

    .news-sidebar {
      margin-top: 2em;
    }

    #appointment-form {
      padding-top: 4em;
      padding-bottom: 4em;
    }

    footer {
      padding-top: 60px;
      padding-bottom: 0;
    }
    .footer-thumb {
      padding-bottom: 10px;
    }

    .border-top {
      text-align: center;
    }

    .copyright-text {
      margin-top: 10px;
    }

    .angle-up-btn {
      bottom: 10em;
    }
  }

  @media only screen and (max-width: 639px) {
    h1 {
      font-size: 3em;
      line-height: 1.2em;
    }
    h2 {
      font-size: 2.1em;
    }
    h4 {
      font-size: 1.4em;
    }

    #home h3 {
      font-size: 11px;
      letter-spacing: 1px;
    }

  }



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

          :root {
               --bs-blue: #034485;
               --bs-blue-deep: #02325f;
               --bs-green-1: #077a71;
               --bs-green-2: #026760;
               --bs-green-3: #c6eae4;
               --bs-text: #4f5b66;
               --bs-soft: #f4f8fb;
               --bs-line: rgba(3, 68, 133, 0.10);
               --bs-shadow: 0 18px 45px rgba(3, 68, 133, 0.08);
          }

          body {
               font-family: 'Arimo', sans-serif;
               color: var(--bs-text);
          }

          h1, h2, h3, h4, h5, h6,
          .navbar-default .navbar-nav>li>a,
          .navbar-default .navbar-brand,
          .section-title h2,
          .caption h1,
          .caption h3 {
               font-family: 'Arimo', sans-serif;
          }

          .navbar-brand {
               padding-top: 10px;
               padding-bottom: 10px;
          }

          .navbar-brand img {
               max-height: 52px;
               width: auto;
               display: block;
          }

          .hero-logo {
               margin-bottom: 25px;
          }

          .hero-logo img {
               max-width: 220px;
               width: 100%;
               height: auto;
               display: inline-block;
          }

          .section-soft {
               background: linear-gradient(180deg, #f5fbff 0%, #ffffff 100%);
          }

          .about-copy p,
          .purpose-box p,
          .contact-box p,
          .team-info p,
          .footer-thumb p {
               color: var(--bs-text);
               line-height: 1.95em;
          }

          .section-kicker {
               display: inline-block;
               font-size: 12px;
               text-transform: uppercase;
               letter-spacing: 1.7px;
               font-weight: 700;
               color: var(--bs-green-1);
               margin-bottom: 18px;
               position: relative;
               padding-left: 16px;
          }

          .section-kicker:before {
               content: '';
               position: absolute;
               left: 0;
               top: 6px;
               width: 8px;
               height: 8px;
               border-radius: 50%;
               background: linear-gradient(135deg, var(--bs-green-1), var(--bs-green-3));
          }

          .about-shell {
               background: #ffffff;
               border-radius: 22px;
               box-shadow: var(--bs-shadow);
               overflow: hidden;
               border: 1px solid rgba(3, 68, 133, 0.06);
          }

          .about-main {
               padding: 58px 54px 44px;
          }

          .about-main h2 {
               color: var(--bs-blue);
               font-size: 42px;
               line-height: 1.12em;
               margin-bottom: 22px;
          }

          .about-main .lead-statement {
               font-size: 21px;
               line-height: 1.75em;
               color: #30495f;
               font-weight: 500;
               margin-bottom: 28px;
               padding-bottom: 28px;
               border-bottom: 1px solid var(--bs-line);
          }

          .about-text-grid {
               margin-top: 10px;
          }

          .about-point {
               margin-bottom: 26px;
               padding-right: 18px;
          }

          .about-point h4 {
               color: var(--bs-blue);
               font-size: 20px;
               margin-bottom: 10px;
          }

          .about-point p {
               margin: 0;
          }

          .about-highlight {
               background: linear-gradient(145deg, var(--bs-blue) 0%, var(--bs-blue-deep) 100%);
               padding: 54px 42px;
               color: #fff;
               height: 100%;
               position: relative;
               overflow: hidden;
          }

          .about-highlight:before,
          .about-highlight:after {
               content: '';
               position: absolute;
               border-radius: 50%;
               background: rgba(255,255,255,0.08);
          }

          .about-highlight:before {
               width: 220px;
               height: 220px;
               right: -70px;
               top: -70px;
          }

          .about-highlight:after {
               width: 150px;
               height: 150px;
               left: -50px;
               bottom: -60px;
          }

          .about-highlight .mini-title {
               display: inline-block;
               color: rgba(255,255,255,0.78);
               text-transform: uppercase;
               letter-spacing: 1.6px;
               font-size: 11px;
               font-weight: 700;
               margin-bottom: 18px;
          }

          .about-highlight h3 {
               color: #fff;
               font-size: 32px;
               line-height: 1.2em;
               margin-bottom: 20px;
          }

          .about-highlight p {
               color: rgba(255,255,255,0.92);
               font-size: 17px;
               line-height: 1.9em;
               margin-bottom: 0;
          }

          .about-keyline {
               margin-top: 28px;
               padding-top: 24px;
               border-top: 1px solid rgba(255,255,255,0.18);
          }

          .about-keyline strong {
               display: block;
               font-size: 13px;
               text-transform: uppercase;
               letter-spacing: 1.5px;
               margin-bottom: 10px;
               color: #c6eae4;
          }

          .about-keyline span {
               display: block;
               font-size: 18px;
               line-height: 1.7em;
          }

          .essence-wrap {
               background: #ffffff;
               border-radius: 24px;
               box-shadow: var(--bs-shadow);
               overflow: hidden;
               border: 1px solid rgba(3, 68, 133, 0.06);
          }

          .essence-head {
               padding: 50px 55px 30px;
               border-bottom: 1px solid var(--bs-line);
          }

          .essence-head h2 {
               color: var(--bs-blue);
               margin-bottom: 14px;
               font-size: 38px;
          }

          .essence-head p {
               max-width: 760px;
               margin: 0;
               font-size: 18px;
               line-height: 1.9em;
          }

          .purpose-grid {
               padding: 15px 40px 42px;
          }

          .purpose-box {
               background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
               border-radius: 20px;
               padding: 36px 34px;
               box-shadow: 0 10px 30px rgba(0,0,0,0.04);
               border: 1px solid rgba(3, 68, 133, 0.08);
               height: 100%;
               position: relative;
               overflow: hidden;
          }

          .purpose-box:before {
               content: '';
               position: absolute;
               left: 0;
               top: 0;
               width: 100%;
               height: 5px;
               background: linear-gradient(90deg, var(--bs-blue), var(--bs-green-2), var(--bs-green-3));
          }

          .purpose-mark {
               font-size: 13px;
               text-transform: uppercase;
               letter-spacing: 1.3px;
               font-weight: 700;
               color: var(--bs-green-1);
               margin-bottom: 14px;
          }

          .purpose-box h3 {
               margin-top: 0;
               margin-bottom: 18px;
               font-size: 31px;
               line-height: 1.2em;
               color: var(--bs-blue);
          }

          .purpose-box ul {
               padding-left: 0;
               margin: 0;
               list-style: none;
          }

          .purpose-box ul li {
               color: var(--bs-text);
               margin-bottom: 12px;
               line-height: 1.8em;
               font-size: 17px;
               position: relative;
               padding-left: 26px;
          }

          .purpose-box ul li:before {
               content: "\f00c";
               font-family: FontAwesome;
               position: absolute;
               left: 0;
               top: 1px;
               color: var(--bs-green-2);
          }

          .values-panel {
               background: linear-gradient(145deg, rgba(3, 68, 133, 0.04), rgba(108, 183, 2, 0.07));
          }

          .values-list {
               display: flex;
               flex-wrap: wrap;
               gap: 12px;
               margin-top: 26px;
          }

          .values-list span {
               display: inline-flex;
               align-items: center;
               justify-content: center;
               min-height: 44px;
               padding: 10px 18px;
               background: #ffffff;
               border: 1px solid rgba(3, 68, 133, 0.09);
               border-radius: 999px;
               color: var(--bs-blue);
               font-weight: 700;
               box-shadow: 0 8px 20px rgba(3, 68, 133, 0.05);
          }

          .brand-note {
               margin-top: 26px;
               padding: 20px 22px;
               background: rgba(255,255,255,0.72);
               border-left: 4px solid var(--bs-green-2);
               border-radius: 14px;
               color: #35506a;
               font-size: 16px;
               line-height: 1.85em;
          }

          .service-tag {
               display: inline-block;
               margin-bottom: 10px;
               font-size: 12px;
               text-transform: uppercase;
               font-weight: 700;
               letter-spacing: .8px;
               color: var(--bs-green-1);
          }

          .team-contact-info p,
          .team-info .extra-info p {
               margin-bottom: 8px;
               font-size: 14px;
          }

          .team-info .extra-info {
               margin-top: 16px;
          }

          .contact-form-wrap .section-title,
          .contact-box .section-title {
               margin-bottom: 25px;
          }

          .contact-form-wrap,
          .contact-box {
               background: #ffffff;
               border-radius: 18px;
               padding: 38px 34px;
               box-shadow: var(--bs-shadow);
               height: 100%;
               border: 1px solid rgba(3, 68, 133, 0.06);
          }

          .contact-form-wrap label {
               font-weight: 700;
               color: var(--bs-blue);
          }

          .contact-form-wrap .form-control {
               border-radius: 10px;
               box-shadow: none;
               border: 1px solid #dbe5ef;
               margin-bottom: 18px;
               min-height: 48px;
          }

          .contact-form-wrap textarea.form-control {
               min-height: 160px;
          }

          .contact-box .quick-contact {
               margin-bottom: 14px;
          }

          .contact-box .quick-contact i {
               width: 24px;
               color: var(--bs-green-1);
          }

          .contact-box .btn {
               margin-right: 10px;
               margin-bottom: 10px;
          }

          .btn-whatsapp {
               background: #077A71;
               border-color: #077A71;
               color: #fff !important;
          }

          .btn-whatsapp:hover,
          .btn-whatsapp:focus {
               background: #077A71;
               border-color: #077A71;
               color: #fff !important;
          }

          .footer-brand {
               margin-bottom: 18px;
          }

          .footer-brand img {
               max-width: 180px;
               width: 100%;
               height: auto;
          }

          .copyright-text p {
               margin-bottom: 0;
          }

          @media (max-width: 1199px) {
               .about-main,
               .about-highlight,
               .essence-head {
                    padding-left: 38px;
                    padding-right: 38px;
               }

               .purpose-grid {
                    padding-left: 25px;
                    padding-right: 25px;
               }
          }

          @media (max-width: 991px) {
               .purpose-box,
               .contact-box,
               .contact-form-wrap {
                    margin-bottom: 30px;
               }

               .about-highlight {
                    min-height: auto;
               }

               .about-point {
                    padding-right: 0;
               }
          }

          @media (max-width: 767px) {
               .hero-logo img {
                    max-width: 170px;
               }

               .about-main,
               .about-highlight,
               .essence-head {
                    padding: 34px 24px;
               }

               .about-main h2,
               .essence-head h2 {
                    font-size: 30px;
               }

               .about-main .lead-statement {
                    font-size: 18px;
               }

               .purpose-grid {
                    padding: 8px 16px 28px;
               }

               .purpose-box h3 {
                    font-size: 27px;
               }

               .values-list span {
                    width: 100%;
                    justify-content: flex-start;
               }
          }

          /* CLEAN ABOUT + ESSENCE REWORK */
          .about-clean-section {
               background: #ffffff;
               position: relative;
          }

          .about-clean-header {
               margin-bottom: 34px;
          }

          .about-clean-header h2,
          .essence-clean-head h2 {
               color: var(--bs-blue);
               font-size: 42px;
               line-height: 1.15em;
               margin-bottom: 14px;
          }

          .about-clean-header p,
          .essence-clean-head p {
               font-size: 18px;
               line-height: 1.95em;
               max-width: 860px;
               margin: 0;
               color: #41576d;
          }

          .about-clean-copy {
               padding-right: 34px;
          }

          .about-clean-copy .brand-title {
               color: var(--bs-blue);
               font-size: 54px;
               line-height: 1.05em;
               margin: 0 0 18px;
               letter-spacing: -0.03em;
          }

          .about-clean-copy .about-intro {
               font-size: 23px;
               line-height: 1.8em;
               color: #2f4962;
               margin-bottom: 18px;
               max-width: 92%;
          }

          .about-clean-divider {
               width: 88px;
               height: 3px;
               margin: 28px 0 18px;
               background: linear-gradient(90deg, var(--bs-blue), var(--bs-green-2), var(--bs-green-3));
               border-radius: 999px;
          }

          .about-clean-item {
               padding: 22px 0;
               border-bottom: 1px solid var(--bs-line);
          }

          .about-clean-item:last-child {
               border-bottom: 0;
          }

          .about-clean-item .item-label {
               display: block;
               font-size: 12px;
               text-transform: uppercase;
               letter-spacing: 1.7px;
               font-weight: 700;
               color: var(--bs-green-1);
               margin-bottom: 10px;
          }

          .about-clean-item p {
               margin: 0;
               font-size: 17px;
               line-height: 1.95em;
          }

          .about-clean-visual {
               background: #eef5fa;
               border-radius: 26px;
               overflow: hidden;
               min-height: 520px;
          }

          .about-clean-visual img {
               width: 100%;
               height: 520px;
               object-fit: cover;
               display: block;
          }

          .about-story-clean {
               padding-top: 24px;
               margin-top: 24px;
               border-top: 1px solid var(--bs-line);
          }

          .about-story-clean .story-label,
          .purpose-clean-label {
               display: inline-block;
               font-size: 12px;
               text-transform: uppercase;
               letter-spacing: 1.6px;
               font-weight: 700;
               color: var(--bs-green-1);
               margin-bottom: 12px;
          }

          .about-story-clean h3,
          .purpose-clean-col h3 {
               color: var(--bs-blue);
               font-size: 30px;
               line-height: 1.2em;
               margin: 0 0 14px;
          }

          .about-story-clean p,
          .purpose-clean-col p {
               margin: 0;
               font-size: 17px;
               line-height: 1.95em;
               color: #466078;
          }

          .essence-clean-head {
               padding-bottom: 28px;
               margin-bottom: 10px;
               border-bottom: 1px solid var(--bs-line);
          }

          .essence-clean-line {
               margin-top: 20px;
          }

          .essence-clean-line > div {
               border-left: 1px solid var(--bs-line);
          }

          .essence-clean-line > div:first-child {
               border-left: 0;
          }

          .purpose-clean-col {
               padding: 18px 28px 18px 12px;
               min-height: 100%;
          }

          .values-clean-list {
               list-style: none;
               margin: 22px 0 0;
               padding: 0;
               columns: 2;
               column-gap: 24px;
          }

          .values-clean-list li {
               position: relative;
               margin-bottom: 14px;
               padding-left: 18px;
               color: var(--bs-blue);
               font-weight: 700;
               break-inside: avoid;
          }

          .values-clean-list li:before {
               content: '';
               position: absolute;
               left: 0;
               top: 9px;
               width: 7px;
               height: 7px;
               border-radius: 50%;
               background: var(--bs-green-2);
          }

          @media (max-width: 991px) {
               .about-clean-copy {
                    padding-right: 0;
                    margin-bottom: 34px;
               }

               .about-clean-copy .about-intro {
                    max-width: 100%;
               }

               .about-clean-visual,
               .about-clean-visual img {
                    height: 420px;
                    min-height: 420px;
               }

               .essence-clean-line > div {
                    border-left: 0;
                    border-top: 1px solid var(--bs-line);
               }

               .essence-clean-line > div:first-child {
                    border-top: 0;
               }

               .purpose-clean-col {
                    padding: 28px 0;
               }
          }

          @media (max-width: 767px) {
               .about-clean-header h2,
               .essence-clean-head h2,
               .about-clean-copy .brand-title {
                    font-size: 34px;
               }

               .about-clean-copy .about-intro {
                    font-size: 19px;
               }

               .about-story-clean h3,
               .purpose-clean-col h3 {
                    font-size: 26px;
               }

               .about-clean-visual,
               .about-clean-visual img {
                    height: 320px;
                    min-height: 320px;
               }

               .values-clean-list {
                    columns: 1;
               }
          }

     

          /* FINAL BIOSANARA REFINEMENT */
          body,
          p,
          li,
          label,
          input,
          select,
          textarea,
          .news-info p,
          .team-info p,
          .contact-box p,
          .footer-thumb p {
               color: rgba(3, 68, 133, 0.82);
          }

          body {
               background: #ffffff;
          }

          a {
               color: var(--bs-blue);
          }

          a:hover,
          a:focus {
               color: var(--bs-green-1);
          }

          header,
          .navbar {
               background: #ffffff;
          }

          header p,
          header span,
          header a,
          .navbar-default .navbar-nav>li>a,
          .footer-link a,
          .copyright-text p {
               color: var(--bs-blue) !important;
          }

          .navbar-default .navbar-nav>li>a:hover,
          .navbar-default .navbar-nav>li>a:focus,
          .navbar-default .navbar-nav>.active>a,
          .navbar-default .navbar-nav>.active>a:hover,
          .navbar-default .navbar-nav>.active>a:focus {
               color: var(--bs-green-1) !important;
          }

          .section-title h2,
          .news-info h3,
          .news-info h3 a,
          .team-info h3,
          .contact-form-wrap .section-title h2,
          .contact-box .section-title h2,
          .footer-thumb h4,
          .stories-info h5,
          .about-final-copy h2,
          .about-final-block h3,
          .essence-final-head h2,
          .purpose-final-col h3 {
               color: var(--bs-blue);
          }

          .section-btn.btn,
          #cf-submit,
          .contact-box .btn,
          .appointment-btn a {
               background: var(--bs-green-2) !important;
               border-color: var(--bs-green-2) !important;
               color: #ffffff !important;
               border-radius: 8px;
          }

          .section-btn.btn:hover,
          #cf-submit:hover,
          .contact-box .btn:hover,
          .appointment-btn a:hover {
               background: var(--bs-green-1) !important;
               border-color: var(--bs-green-1) !important;
               color: #ffffff !important;
          }

          .service-tag,
          .quick-contact i,
          .team-contact-info i,
          .footer-thumb i,
          .phone-icon i,
          .date-icon i,
          .email-icon i {
               color: var(--bs-green-1) !important;
          }

          .about-final-section {
               background: #ffffff;
               padding-top: 110px;
               padding-bottom: 90px;
          }

          .about-final-copy {
               padding-right: 34px;
          }

          .about-final-copy h2 {
               font-size: 48px;
               line-height: 1.12em;
               margin: 0 0 18px;
               letter-spacing: -0.03em;
          }

          .about-final-lead {
               font-size: 21px;
               line-height: 1.9em;
               margin-bottom: 24px;
               max-width: 92%;
               color: rgba(3, 68, 133, 0.86) !important;
          }

          .about-final-statement {
               position: relative;
               padding: 0 0 0 24px;
               margin: 0 0 28px;
               font-size: 18px;
               line-height: 1.95em;
               color: rgba(3, 68, 133, 0.9);
          }

          .about-final-statement:before {
               content: '';
               position: absolute;
               left: 0;
               top: 6px;
               bottom: 6px;
               width: 4px;
               border-radius: 999px;
               background: linear-gradient(180deg, var(--bs-green-1), var(--bs-green-3));
          }

          .about-final-block {
               padding-top: 20px;
               margin-top: 20px;
               border-top: 1px solid rgba(3, 68, 133, 0.12);
          }

          .about-final-block h3 {
               margin: 0 0 12px;
               font-size: 24px;
               line-height: 1.3em;
          }

          .about-final-block p {
               margin: 0;
               font-size: 17px;
               line-height: 1.95em;
          }

          .about-final-visual {
               padding-left: 20px;
          }

          .about-final-image-frame {
               position: relative;
               min-height: 650px;
               border-radius: 28px;
               overflow: hidden;
               background: linear-gradient(180deg, rgba(190, 233, 24, 0.16) 0%, rgba(49, 129, 0, 0.08) 100%);
          }

          .about-final-image-frame:before {
               content: '';
               position: absolute;
               inset: 24px 24px auto auto;
               width: 120px;
               height: 120px;
               border-radius: 24px;
               background: rgba(255, 255, 255, 0.28);
               backdrop-filter: blur(6px);
               z-index: 1;
          }

          .about-final-image-frame img {
               width: 100%;
               height: 650px;
               object-fit: cover;
               object-position: center top;
               display: block;
          }

          .purpose-final-section {
               padding-top: 88px;
               padding-bottom: 82px;
               background: linear-gradient(180deg, #f7fbff 0%, #ffffff 100%);
          }

          .essence-final-head {
               padding-bottom: 26px;
               margin-bottom: 14px;
               border-bottom: 1px solid rgba(3, 68, 133, 0.12);
          }

          .essence-final-head h2 {
               font-size: 40px;
               line-height: 1.18em;
               margin-bottom: 14px;
          }

          .essence-final-head p {
               margin: 0;
               font-size: 18px;
               line-height: 1.9em;
          }

          .essence-final-grid {
               margin-top: 8px;
          }

          .essence-final-grid > div {
               border-left: 1px solid rgba(3, 68, 133, 0.12);
          }

          .essence-final-grid > div:first-child {
               border-left: 0;
          }

          .purpose-final-col {
               padding: 20px 28px 8px 12px;
          }

          .purpose-final-label {
               display: inline-block;
               margin-bottom: 12px;
               font-size: 12px;
               letter-spacing: 1.8px;
               text-transform: uppercase;
               font-weight: 700;
               color: var(--bs-green-1);
          }

          .purpose-final-col h3 {
               margin: 0 0 14px;
               font-size: 30px;
               line-height: 1.25em;
          }

          .purpose-final-col p {
               margin: 0;
               font-size: 17px;
               line-height: 1.95em;
          }

          .values-final-list {
               list-style: none;
               padding: 0;
               margin: 20px 0 0;
               columns: 2;
               column-gap: 22px;
          }

          .values-final-list li {
               position: relative;
               padding-left: 16px;
               margin-bottom: 12px;
               break-inside: avoid;
               font-weight: 700;
               color: var(--bs-blue);
          }

          .values-final-list li:before {
               content: '';
               position: absolute;
               left: 0;
               top: 9px;
               width: 6px;
               height: 6px;
               border-radius: 50%;
               background: var(--bs-green-2);
          }

          #services,
          #team,
          #contact {
               padding-top: 88px;
               padding-bottom: 82px;
          }

          .news-thumb,
          .team-thumb,
          .contact-form-wrap,
          .contact-box {
               border-radius: 22px;
               overflow: hidden;
               background: #ffffff;
               box-shadow: 0 16px 40px rgba(3, 68, 133, 0.07);
               border: 1px solid rgba(3, 68, 133, 0.08);
          }

          .news-info {
               padding: 24px 26px 28px;
          }

         

          .service-link {
               display: inline-block;
               margin-top: 10px;
               font-weight: 700;
               color: var(--bs-green-1);
          }

          .team-info {
               padding: 28px 26px 26px;
          }

          .team-info > p {
               color: var(--bs-green-1) !important;
               font-weight: 700;
               letter-spacing: 0.06em;
          }

          .contact-form-wrap,
          .contact-box {
               padding: 40px 34px;
          }

          .contact-form-wrap label {
               color: var(--bs-blue);
               font-weight: 700;
          }

          .contact-form-wrap .form-control {
               color: var(--bs-blue);
               border-color: rgba(3, 68, 133, 0.12);
               border-radius: 8px;
          }

          .footer-brand img {
               max-width: 170px;
          }

          .footer-service-links {
               list-style: none;
               padding: 0;
               margin: 16px 0 0;
          }

          .footer-service-links li {
               margin-bottom: 12px;
          }

          .footer-service-links a,
          .footer-thumb a {
               color: var(--bs-blue);
          }

          .border-top {
               border-top-color: rgba(3, 68, 133, 0.10) !important;
          }

          @media (max-width: 991px) {
               .about-final-copy {
                    padding-right: 0;
                    margin-bottom: 34px;
               }

               .about-final-lead {
                    max-width: 100%;
               }

               .about-final-visual {
                    padding-left: 0;
               }

               .about-final-image-frame,
               .about-final-image-frame img {
                    min-height: 460px;
                    height: 460px;
               }

               .essence-final-grid > div {
                    border-left: 0;
                    border-top: 1px solid rgba(3, 68, 133, 0.12);
               }

               .essence-final-grid > div:first-child {
                    border-top: 0;
               }

               .purpose-final-col {
                    padding: 28px 0;
               }
          }

          @media (max-width: 767px) {
               .about-final-section,
               .purpose-final-section,
               #services,
               #team,
               #contact {
                    padding-top: 72px;
                    padding-bottom: 64px;
               }

               .about-final-copy h2,
               .essence-final-head h2 {
                    font-size: 34px;
               }

               .about-final-lead {
                    font-size: 19px;
               }

               .about-final-image-frame,
               .about-final-image-frame img {
                    min-height: 340px;
                    height: 340px;
               }

               .purpose-final-col h3 {
                    font-size: 25px;
               }

               .values-final-list {
                    columns: 1;
               }
          }


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

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

body {
  min-height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
}

/* HERO */
.dna-hero {
  position: relative;
  width: 100%;
  min-height: 100vh;
  padding: 120px 0 80px;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: #f3f3f3;
  isolation: isolate;
}

/* CANVAS COMO FONDO */
#dnaHeroCanvas {
  position: absolute;
  inset: -6%;
  width: 112% !important;
  height: 112% !important;
  display: block;
  z-index: 1;
  pointer-events: none;
  opacity: 0.35;
  filter: blur(10px);
  transform: scale(1.08);
}


/* CONTENIDO ENCIMA */
.dna-hero .container,
.dna-hero .row,
.dna-hero .col-md-10,
.dna-hero .dna-hero-panel,
.dna-hero .dna-hero-copy {
  position: relative;
  z-index: 3;
}

/* PANEL DEL TEXTO */
.dna-hero-panel {
  max-width: 1100px;
  padding: 40px 0;
}

/* TEXTOS */
.dna-hero-kicker {
  display: inline-block;
  margin-bottom: 14px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #077A71;
}

.dna-hero-copy h3 {
  margin: 0 0 18px;
  font-weight: 500;
  line-height: 1.4;
  color: #034485;
}

.dna-hero-copy h2 {
  margin: 0 0 24px;
  line-height: 0.95;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  color: #034485;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.08);
  max-width: 1000px;
}

.dna-hero .typewriter-target {
  position: relative;
}

.dna-hero .typewriter-target.is-typing::after {
  content: '';
  display: inline-block;
  width: 2px;
  height: 0.95em;
  margin-left: 7px;
  vertical-align: -0.08em;
  background: #034485;
  animation: heroTypeCaret 0.9s steps(1, end) infinite;
}

.dna-hero-copy h2.typewriter-target {
  min-height: 1.95em;
}

.dna-hero-copy h5.typewriter-target {
  min-height: 3.6em;
}

@keyframes heroTypeCaret {
  0%, 48% { opacity: 1; }
  49%, 100% { opacity: 0; }
}

.dna-hero-copy p {
  margin: 0;
  max-width: 980px;
  line-height: 1.7;
  color: #034485;
}

/* BOTONES */
.dna-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 34px;
}

/* OPCIONAL: si quieres un mini efecto glass solo en el bloque */
.dna-hero-copy {
  padding: 26px 28px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

/* RESPONSIVE */
@media (max-width: 991px) {
  .dna-hero {
    padding: 110px 0 60px;
  }





  #dnaHeroCanvas {
    opacity: 0.28;
    filter: blur(12px);
  }
}

@media (max-width: 767px) {
  .dna-hero-copy {
    padding: 18px 16px;
  }



  .dna-hero-actions {
    flex-direction: column;
    align-items: flex-start;
  }
}

 :root{
               --fs-body: 18px;
               --fs-small: 16px;
               --fs-nav: 16px;
               --fs-btn: 16px;
               --fs-h1: clamp(2.7rem, 5vw, 4.4rem);
               --fs-h2: clamp(2.1rem, 3.6vw, 3rem);
               --fs-h3: clamp(1.6rem, 2.35vw, 2.1rem);
               --fs-h4: clamp(1.18rem, 1.9vw, 1.35rem);
               --fs-lead: clamp(1.14rem, 1.45vw, 1.3rem);
               --fs-kicker: 0.95rem;
               --lh-body: 1.75;
               --lh-tight: 1.2;
               --lh-title: 1.28;
          }

          html { font-size: 100%; }
          body{
               font-size: var(--fs-body);
               line-height: var(--lh-body);
               -webkit-font-smoothing: antialiased;
               text-rendering: optimizeLegibility;
          }

          .img-responsive{
               width: 100%;
          }

          p, li, a, label, input, select, textarea, button, span{
              
               line-height: var(--lh-body);
          }

          header p,
          header span,
          header a{
               font-size: 0.94rem;
               line-height: 1.6;
          }

          .navbar-default .navbar-nav > li > a,
          .navbar-default .navbar-nav > li > a:focus,
          .navbar-default .navbar-nav > li > a:hover{
               font-size: var(--fs-nav);
               font-weight: 600;
               letter-spacing: .02em;
          }

          .appointment-btn a,
          .section-btn,
          #cf-submit,
          .service-link{
               font-size: var(--fs-btn) !important;
               font-weight: 700;
               letter-spacing: .02em;
          }

          h1,h2,h3,h4,h5,h6{
               margin-top: 0;
               line-height: var(--lh-title);
               letter-spacing: -.01em;
          }

          h1{ font-size: var(--fs-h1); }
          h2{ font-size: var(--fs-h2); }
          h3{ font-size: var(--fs-h3); }
          h4{ font-size: var(--fs-h4); }
          h5{ font-size: var(--fs-lead); line-height: 1.7; }

          .section-title h2,
          .essence-final-head h2,
          .contact-form-wrap .section-title h2,
          .contact-box .section-title h2{
               font-size: var(--fs-h2);
          }

          .section-kicker,
          .purpose-final-label,
          .service-tag,
          .dna-hero-kicker{
               display: inline-block;
               font-size: var(--fs-kicker) !important;
               font-weight: 700;
               letter-spacing: .14em;
               text-transform: uppercase;
          }

          .dna-hero-copy h2{
               font-size: var(--fs-h1) !important;
               line-height: var(--lh-tight);
          }

          .dna-hero-copy h5{
               font-size: var(--fs-lead) !important;
               line-height: 1.75;
          }

          .about-final-copy h3,
          .about-final-block h3,
          .purpose-final-col h3,
          .news-info h3,
          .team-info h3,
          .footer-thumb h4{
               font-size: var(--fs-h3);
          }

          .about-final-copy p,
          .about-final-statement,
          .about-final-block p,
          .purpose-final-col p,
          .news-info p,
          .team-info p,
          .team-contact-info p,
          .extra-info p,
          .contact-box p,
          .footer-thumb p,
          .footer-service-links li a,
          .footer-link a{
               font-size: 1.07rem;
               line-height: var(--lh-body);
          }

          .quick-contact,
          .values-final-list li{
               font-size: 1.07rem;
          }

          input.form-control,
          select.form-control,
          textarea.form-control{
               font-size: 1.05rem;
          }

          /* CONTENT SIZE NORMALIZATION */
          #services .news-info h2 {
               line-height: 1.3;
          }

      

          #services .service-tag {
               letter-spacing: 0.08em;
          }

          #team .team-info p,
          #purpose .purpose-final-col p,
          #about .about-final-copy p,
          #about .about-final-statement,
          #about .about-final-block p,
          #contact .contact-box p,
          #contact .contact-form-wrap label {
               font-size: 1.08rem;
          }

          /* ABOUT 6/6 WITH VERTICAL DIVIDER */
          .about-dual-section {
               padding-top: 18px;
               padding-bottom: 12px;
          }

          .about-dual-col {
               position: relative;
          }

          .about-dual-col .about-final-block {
               margin-top: 0;
               padding-top: 6px;
               border-top: 0;
          }

          .about-dual-col-divider::after {
               content: '';
               position: absolute;
               top: 6px;
               right: 15px;
               bottom: 6px;
               width: 3px;
               border-radius: 999px;
               background: linear-gradient(180deg, #034485 0%, #6cb702 100%);
               opacity: 0.75;
          }

          @media (max-width: 991px){
               :root{
                    --fs-body: 17px;
                    --fs-nav: 15px;
               }

               .dna-hero-copy h2{
                    max-width: 100%;
               }

               .about-dual-col-divider::after {
                    display: none;
               }
          }

          @media (max-width: 767px){
               :root{
                    --fs-body: 16px;
                    --fs-nav: 15px;
                    --fs-btn: 14px;
                    --fs-kicker: .88rem;
               }

               header p,
               header span,
               header a{
                    font-size: .9rem;
               }

               .navbar-default .navbar-nav > li > a{
                    font-size: var(--fs-nav);
               }

               .dna-hero-copy h5{
                    font-size: 1.02rem !important;
               }
          }

          .text-withe{
               color: #ffffff !important;
          }

          /* MENU SCROLL EFFECT */
          .biosanara-menu {
               background: rgba(255, 255, 255, 0.96);
               padding: 12px 0;
               transition: background-color 0.35s ease, backdrop-filter 0.35s ease, box-shadow 0.35s ease, padding 0.35s ease;
          }

          .biosanara-menu .navbar-header {
               display: flex;
               align-items: center;
          }

          .biosanara-menu .menu-logo-link {
               display: block;
               padding: 0 !important;
               height: auto !important;
          }

          .biosanara-menu .menu-logo {
               width: 250px;
               max-width: 100%;
               max-height: none !important;
               height: auto !important;
               display: block;
               transition: width 0.35s ease;
          }

          /* TOP HEADER (BLUE + WHITE) */
          header {
               background: #077A71 !important;
               border-bottom: 0 !important;
          }

          header p,
          header span,
          header a {
               color: #ffffff !important;
          }

          header span.date-icon {
               border-left: 1px solid rgba(255, 255, 255, 0.25) !important;
               border-right: 1px solid rgba(255, 255, 255, 0.25) !important;
          }

          header span i {
               color: #ffffff !important;
          }

          /* Prevent first-paint text flash before typewriter starts */
          .dna-hero [data-typewriter] {
               visibility: hidden;
          }

          .biosanara-menu .navbar-nav {
               margin-top: 0;
               margin-bottom: 0;
          }

          @media (min-width: 768px) {
               .biosanara-menu .container {
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
               }

               .biosanara-menu .navbar-header {
                    float: none;
                    min-height: 0;
               }

               .biosanara-menu .navbar-collapse {
                    flex: 1;
                    padding-left: 20px;
               }

               .biosanara-menu .navbar-collapse.collapse {
                    display: flex !important;
                    align-items: center;
                    justify-content: flex-end;
               }

               .biosanara-menu .navbar-nav.navbar-right {
                    float: none !important;
                    display: flex;
                    align-items: center;
               }

               .biosanara-menu .navbar-nav > li {
                    float: none;
                    display: flex;
                    align-items: center;
               }

               .biosanara-menu .navbar-nav > li > a {
                    min-height: 54px;
                    display: flex;
                    align-items: center;
                    padding-top: 0;
                    padding-bottom: 0;
               }

               .biosanara-menu .navbar-nav li.appointment-btn {
                    margin-top: 0;
               }
          }

          .biosanara-menu.is-scrolled,
          .sticky-wrapper.is-sticky .biosanara-menu {
               background: rgba(255, 255, 255, 0.58) !important;
               -webkit-backdrop-filter: blur(14px);
               backdrop-filter: blur(14px);
               box-shadow: 0 10px 30px rgba(3, 68, 133, 0.12);
               padding: 8px 0;
          }

          .biosanara-menu.is-scrolled .menu-logo,
          .sticky-wrapper.is-sticky .biosanara-menu .menu-logo {
               width: 150px;
          }

          @media (max-width: 767px) {
               header {
                    display: none !important;
               }

               .biosanara-menu {
                    padding: 10px 0;
               }

               .biosanara-menu .menu-logo {
                    width: 190px;
               }

               .biosanara-menu.is-scrolled .menu-logo,
               .sticky-wrapper.is-sticky .biosanara-menu .menu-logo {
                    width: 150px;
               }

               .biosanara-menu .navbar-collapse.collapse {
                    display: none;
               }

               .biosanara-menu .navbar-collapse.collapse.in {
                    display: block;
               }
          }

          /* FOOTER BACKGROUND FROM LOGOS/fondo.png */
          footer {
               position: relative;
               background-image:
                    linear-gradient(180deg, rgba(3, 68, 133, 0.0), rgba(3, 68, 133, 0.0)),
                    url('/biosanara/public/images/logos/fondo.png'),
                    url('../../images/logos/fondo.png') !important;
               background-position: center center !important;
               background-size: cover !important;
               background-repeat: no-repeat !important;
          }

          footer .container {
               position: relative;
               z-index: 1;
          }

          footer h4,
          footer p,
          footer a,
          .footer-link a,
          .copyright-text p {
               color: #034485 !important;
          }

          footer a:hover,
          .footer-link a:hover {
               color: #077A71 !important;
          }

          footer .border-top {
               border-top-color: rgba(255, 255, 255, 0.28) !important;
          }

          /* FLOATING WHATSAPP BUTTON */
          .whatsapp-float-btn {
               position: fixed;
               right: 22px;
               bottom: 22px;
               width: 58px;
               height: 58px;
               border-radius: 50%;
               display: inline-flex;
               align-items: center;
               justify-content: center;
               background: #077A71;
               color: #ffffff !important;
               font-size: 34px;
               box-shadow: 0 12px 28px rgba(0, 0, 0, 0.25);
               z-index: 9999;
               transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
          }

          .whatsapp-float-btn:hover,
          .whatsapp-float-btn:focus {
               background: #077A71;
               color: #ffffff !important;
               transform: translateY(-2px);
               box-shadow: 0 16px 32px rgba(0, 0, 0, 0.28);
          }

          @media (max-width: 767px) {
               .whatsapp-float-btn {
                    right: 14px;
                    bottom: 14px;
                    width: 52px;
                    height: 52px;
                    font-size: 30px;
               }
          }