body,
 html {
     overflow-x: hidden;
 }

 html {
     font-size: 13px;
 }

 body {
     background-color: #ffffff;
     font-family: 'Open Sans', sans-serif;
     font-size: 13px;
     font-weight: 400;
     color: #999999;
     line-height: 1.5;
     margin: 0;
 }

 .wrapper {
     background-color: #f8f8f8;
 }

 * {
     outline: none;
 }

 ::-moz-selection {
     text-shadow: none;
 }

 ::selection {
     background-color: #3498db;
     color: #ffffff;
     text-shadow: none;
 }

 a {
     -webkit-transition: all 0.3s ease;
     -moz-transition: all 0.3s ease;
     -o-transition: all 0.3s ease;
     transition: all 0.3s ease;
     color: #3498db;
 }

 a:hover {
     color: #217dbb;
     text-decoration: none;
 }

 a:focus {
     color: #217dbb;
     outline: none;
     text-decoration: none;
 }

 a:active {
     color: #217dbb;
     outline: none;
     text-decoration: none;
 }

 textarea {
     resize: none;
 }

 button.btn {
     margin-bottom: 0;
 }

 .btn:focus,
 .btn:active:focus,
 .btn.active:focus,
 .btn.focus,
 .btn.focus:active,
 .btn.active.focus {
     outline: none;
 }

 .modal-backdrop {
     z-index: 1020;
     background-color: rgba(34, 34, 34, 0.95);
 }

 .fullscreen {
     height: 100vh !important;
 }

 @media only screen and (max-width:992px) {
     .fullscreen {
         height: auto !important;
     }
 }

 .h1,
 .h2,
 .h3,
 .h4,
 .h5,
 .h6,
 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
     color: #363636;
     font-family: 'Raleway', sans-serif;
     font-weight: 700;
     line-height: 1;
 }

 .h1,
 h1 {
     font-size: 52px;
 }

 .h2,
 h2 {
     font-size: 42px;
 }

 .h3,
 h3 {
     font-size: 38px;
 }

 .h4,
 h4 {
     font-size: 20px;
 }

 .h5,
 h5 {
     font-size: 24px;
 }

 .h6,
 h6 {
     font-size: 18px;
 }

 p {
     color: #999999;
     font-size: 13px;
     font-weight: 400;
     line-height: 22px;
 }

 .lead {
     font-size: 16px;
     line-height: 1.8;
 }

 .text--left {
     text-align: left !important;
 }

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

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

 .text--just {
     text-align: justify !important;
 }

 .align--top {
     vertical-align: top;
 }

 .align--bottom {
     vertical-align: bottom;
 }

 .align--middle {
     vertical-align: middle;
 }

 .align--baseline {
     vertical-align: baseline;
 }

 .bold {
     font-weight: bold;
 }

 .regular {
     font-weight: normal;
 }

 .italic {
     font-style: italic;
 }

 .break-word {
     word-wrap: break-word;
 }

 .no-wrap {
     white-space: nowrap;
 }

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

 .text-gray {
     color: #f9f9f9 !important;
 }

 .text-black {
     color: #363636;
 }

 .text-theme {
     color: #3498db;
 }

 .text--capitalize {
     text-transform: capitalize !important;
 }

 .text--uppercase {
     text-transform: uppercase !important;
 }

 .font-heading {
     font-family: 'Raleway', sans-serif;
 }

 .font-body {
     font-family: 'Open Sans', sans-serif;
 }

 .font-18 {
     font-size: 24px;
 }

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

 .font-20 {
     font-size: 20px;
 }

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

 @media only screen and (min-width:320px) and (max-width:767px) {
     text-center-xs {
         text-align: center !important;
     }
 }

 @media only screen and (min-width:768px) and (max-width:991px) {
     text-center-sm {
         text-align: center !important;
     }
 }

 @media (max-width:767px) {
     .custom-row {
         padding-top: 100px;
     }
 }

 @media (max-width:767px) {
     .img-col {
         padding-top: 20px;
         padding-bottom: 20px;
     }
 }

 .higlighted-style1 {
     background-color: #3498db;
     color: #fff;
     padding: 5px 0;
 }

 .higlighted-style2 {
     background-color: #363636;
     color: #fff;
     padding: 5px 0;
 }

 .higlighted-style3 {
     background-color: #f9f9f9;
     color: #3498db;
     padding: 5px 0;
 }

 .color-heading {
     color: #363636 !important;
 }

 .color-theme {
     color: #3498db !important;
 }

 .color-white {
     color: #ffffff !important;
 }

 .color-gray {
     color: #f9f9f9 !important;
 }

 address,
 blockquote,
 dd,
 dl,
 fieldset,
 form,
 ol,
 p,
 pre,
 table,
 ul {
     margin-bottom: 20px;
 }

 section {
     padding-top: 100px;
     padding-bottom: 100px;
     overflow: hidden;
 }

 .m-0 {
     margin: 0 !important;
 }

 .m-xs {
     margin: 10px;
 }

 .m-sm {
     margin: 20px;
 }

 .m-md {
     margin: 40px;
 }

 .m-lg {
     margin: 80px;
 }

 .mt-0 {
     margin-top: 0;
 }

 .mt-xs {
     margin-top: 10px;
 }

 .mt-10 {
     margin-top: 10px !important;
 }

 .mt-20 {
     margin-top: 20px !important;
 }

 .mt-30 {
     margin-top: 30px !important;
 }

 .mt-40 {
     margin-top: 40px !important;
 }

 .mt-50 {
     margin-top: 50px !important;
 }

 .mt-60 {
     margin-top: 60px;
 }

 .mt-70 {
     margin-top: 70px !important;
 }

 .mt-80 {
     margin-top: 80px !important;
 }

 .mt-90 {
     margin-top: 90px !important;
 }

 .mt-100 {
     margin-top: 100px !important;
 }

 .mt-150 {
     margin-top: 150px;
 }

 .mb-0 {
     margin-bottom: 0 !important;
 }

 .mb-15 {
     margin-bottom: 15px;
 }

 .mb-10 {
     margin-bottom: 10px !important;
 }

 .mb-20 {
     margin-bottom: 20px !important;
 }

 .mb-30 {
     margin-bottom: 30px !important;
 }

 .mb-50 {
     margin-bottom: 50px !important;
 }

 .mb-40 {
     margin-bottom: 40px !important;
 }

 .mb-60 {
     margin-bottom: 60px !important;
 }

 .mb-70 {
     margin-bottom: 70px !important;
 }

 .mb-80 {
     margin-bottom: 80px !important;
 }

 .mb-90 {
     margin-bottom: 90px !important;
 }

 .mb-100 {
     margin-bottom: 100px !important;
 }

 .mb-150 {
     margin-bottom: 150px !important;
 }

 .mr-0 {
     margin-right: 0;
 }

 .mr-30 {
     margin-right: 30px !important;
 }

 .mr-50 {
     margin-right: 50px;
 }

 .mr-60 {
     margin-right: 60px;
 }

 .mr-150 {
     margin-right: 150px;
 }

 .ml-0 {
     margin-left: 0;
 }

 .ml-xs {
     margin-left: 10px;
 }

 .ml-sm {
     margin-left: 20px;
 }

 .ml-md {
     margin-left: 40px;
 }

 .ml-lg {
     margin-left: 80px;
 }

 .ml-30 {
     margin-left: 30px !important;
 }

 .ml-50 {
     margin-left: 50px;
 }

 .ml-60 {
     margin-left: 60px;
 }

 .ml-150 {
     margin-left: 150px;
 }

 .p-0 {
     padding: 0 !important;
 }

 .p-xs {
     padding: 10px;
 }

 .p-sm {
     padding: 20px;
 }

 .p-md {
     padding: 40px;
 }

 .p-lg {
     padding: 80px;
 }

 .pt-0 {
     padding-top: 0 !important;
 }

 .pt-30 {
     padding-top: 30px !important;
 }

 .pt-40 {
     padding-top: 40px !important;
 }

 .pt-50 {
     padding-top: 50px;
 }

 .pt-60 {
     padding-top: 60px;
 }

 .pt-70 {
     padding-top: 70px !important;
 }

 .pt-80 {
     padding-top: 80px;
 }

 .pt-90 {
     padding-top: 90px;
 }

 .pt-100 {
     padding-top: 100px !important;
 }

 .pt-150 {
     padding-top: 150px !important;
 }

 .pb-0 {
     padding-bottom: 0 !important;
 }

 .pb-30 {
     padding-bottom: 30px;
 }

 .pb-50 {
     padding-bottom: 50px;
 }

 .pb-60 {
     padding-bottom: 60px;
 }

 .pb-70 {
     padding-bottom: 70px !important;
 }

 .pb-80 {
     padding-bottom: 80px;
 }

 .pb-90 {
     padding-bottom: 90px;
 }

 .pb-100 {
     padding-bottom: 100px !important;
 }

 .pr-0 {
     padding-right: 0;
 }

 .pr-xs {
     padding-right: 10px;
 }

 .pr-sm {
     padding-right: 20px;
 }

 .pr-md {
     padding-right: 40px;
 }

 .pr-lg {
     padding-right: 80px;
 }

 .pr-15 {
     padding-right: 15px !important;
 }

 .pr-30 {
     padding-right: 30px !important;
 }

 .pr-50 {
     padding-right: 50px;
 }

 .pr-60 {
     padding-right: 60px;
 }

 .pr-100 {
     padding-right: 100px !important;
 }

 .pr-150 {
     padding-right: 150px;
 }

 .pl-0 {
     padding-left: 0;
 }

 .pl-30 {
     padding-left: 30px;
 }

 .pl-50 {
     padding-left: 50px;
 }

 .pl-60 {
     padding-left: 60px;
 }

 .pl-100 {
     padding-left: 100px !important;
 }

 .pl-150 {
     padding-left: 150px;
 }

 .fixed {
     position: fixed;
 }

 .relative {
     position: relative;
 }

 .absolute {
     position: absolute;
 }

 .static {
     position: static;
 }

 .zindex-1 {
     z-index: 1;
 }

 .zindex-2 {
     z-index: 2;
 }

 .zindex-3 {
     z-index: 3;
 }

 .border-all {
     border: 1px solid #3498db;
 }

 .border-top {
     border-top: 1px solid #3498db;
 }

 .border-bottom {
     border-bottom: 1px solid #3498db;
 }

 .border-right {
     border-right: 1px solid #3498db;
 }

 .border-left {
     border-left: 1px solid #3498db;
 }

 .inline {
     display: inline;
 }

 .block {
     display: block;
 }

 .inline-block {
     display: inline-block;
 }

 .hide {
     display: none;
 }

 .flex {
     display: flex;
 }

 @media only screen and (max-width:767px) {
     section {
         padding-top: 60px;
         padding-bottom: 60px;
     }

     .text-center-xs {
         text-align: center !important;
     }

     .pull-none-xs {
         float: none !important;
         text-align: center !important;
     }

     .mb-15-xs {
         margin-bottom: 15px;
     }

     .mb-30-xs {
         margin-bottom: 30px !important;
     }

     .mb-50-xs {
         margin-bottom: 50px;
     }

     .mb-60-xs {
         margin-bottom: 60px !important;
     }

     .p-none-xs {
         padding-right: 0;
         padding-left: 0;
     }
 }

 @media only screen and (min-width:768px) and (max-width:991px) {
     .text-center-sm {
         text-align: center !important;
     }

     .mb-0-sm {
         margin-bottom: 0;
     }

     .mb-15-sm {
         margin-bottom: 15px;
     }

     .mb-30-sm {
         margin-bottom: 30px !important;
     }

     .mb-50-sm {
         margin-bottom: 50px;
     }

     .mb-60-sm {
         margin-bottom: 60px;
     }

     .pb-15-sm {
         padding-bottom: 15px;
     }

     .pb-30-sm {
         padding-bottom: 30px;
     }

     .pb-50-sm {
         padding-bottom: 50px;
     }

     .pb-60-sm {
         padding-bottom: 60px;
     }

     .p-none-sm {
         padding-right: 0;
         padding-left: 0;
     }

     .pull-none-sm {
         float: none !important;
         text-align: center !important;
     }
 }

 .border-b {
     border-bottom: 1px solid #f9f9f9;
 }

 .row-no-padding [class*="col-"] {
     padding-left: 0 !important;
     padding-right: 0 !important;
 }

 .col-lg-5ths,
 .col-md-5ths,
 .col-sm-5ths,
 .col-xs-5ths {
     position: relative;
     min-height: 1px;
     padding-right: 15px;
     padding-left: 15px;
 }

 .col-xs-5ths {
     width: 20%;
     float: left;
 }

 @media (min-width:768px) {
     .col-sm-5ths {
         width: 20%;
         float: left;
     }
 }

 @media (min-width:992px) {
     .col-md-5ths {
         width: 20%;
         float: left;
     }
 }

 @media (min-width:1200px) {
     .col-lg-5ths {
         width: 20%;
         float: left;
     }
 }

 .col-content {
     padding: 120px 100px 110px 120px;
 }

 @media only screen and (min-width:320px) and (max-width:767px) {
     .col-content {
         padding: 40px !important;
     }
 }

 .pos-fixed {
     position: fixed;
 }

 .pos-relative {
     position: relative;
 }

 .pos-absolute {
     position: absolute;
 }

 .pos-static {
     position: static;
 }

 .pos-top {
     top: 0;
 }

 .pos-bottom {
     bottom: 0;
 }

 .pos-right {
     right: 0;
 }

 .pos-left {
     left: 0;
 }

 .pos-vertical-center {
     position: relative;
     top: 50%;
     -webkit-transform: perspective(1px) translateY(-50%);
     -moz-transform: perspective(1px) translateY(-50%);
     -o-transform: perspective(1px) translateY(-50%);
     transform: perspective(1px) translateY(-50%);
 }

 .height-700 {
     height: 700px !important;
 }

 .height-500 {
     height: 500px !important;
 }

 .height-800 {
     height: 800px !important;
 }

 @media only screen and (min-width:992px) {

     .hidden-lg,
     .hidden-md {
         display: none;
     }
 }

 .bg-theme {
     background-color: #38B6FF !important;
 }

 .bg-gray {
     background-color: #f9f9f9 !important;
 }

 .bg-white {
     background-color: #ffffff !important;
 }

 .bg-dark {
     background-color: #363636 !important;
 }

 .bg-section {
     position: relative;
     overflow: hidden;
     z-index: 1;
     -webkit-background-size: cover;
     -moz-background-size: cover;
     -ms-background-size: cover;
     -o-background-size: cover;
     background-size: cover;
     background-repeat: no-repeat;
     background-position: center center;
     width: 100%;
     height: 100%;
 }

 .bg-overlay:before {
     content: "";
     display: inline-block;
     height: 100%;
     left: 0;
     position: absolute;
     top: 0;
     width: 100%;
     z-index: -1;
 }

 .bg-overlay-light:before {
     background-color: #ffffff;
     opacity: 0.8;
 }

 .bg-overlay-dark:before {
     background-color: #222222;
     opacity: 0.9;
 }

 .bg-overlay-theme:before {
     background-color: #3498db;
     opacity: 0.7;
 }

 .bg-parallex {
     background-attachment: fixed;
 }

 .bg-overlay-gradient:before {
     opacity: 0.85;
     background-color: rgba(27, 181, 128, 0.8);
     background-image: -webkit-gradient(linear, left top, right top, from(rgba(27, 181, 128, 0.8)), to(rgba(12, 109, 176, 0.8)));
     background-image: -webkit-linear-gradient(left, rgba(27, 181, 128, 0.8), rgba(12, 109, 176, 0.8));
     background-image: -moz-linear-gradient(left, rgba(27, 181, 128, 0.8), rgba(12, 109, 176, 0.8));
     background-image: -ms-linear-gradient(left, rgba(27, 181, 128, 0.8), rgba(12, 109, 176, 0.8));
     background-image: -o-linear-gradient(left, rgba(27, 181, 128, 0.8), rgba(12, 109, 176, 0.8));
     background-image: linear-gradient(left, rgba(27, 181, 128, 0.8), rgba(12, 109, 176, 0.8));
     filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='rgba(27, 181, 128, 0.8)', endColorStr='rgba(12, 109, 176, 0.8)', gradientType='1');
 }

 .bg-overlay-gradient2:before {
     background-color: rgba(27, 181, 128, 0.15);
     background-image: -webkit-linear-gradient(to top, rgba(27, 181, 128, 0.8) 0%, rgba(12, 109, 176, 0.8) 100%);
     background-image: -moz-linear-gradient(to top, rgba(27, 181, 128, 0.8) 0%, rgba(12, 109, 176, 0.8) 100%);
     background-image: -ms-linear-gradient(to top, rgba(27, 181, 128, 0.8) 0%, rgba(12, 109, 176, 0.8) 100%);
     background-image: -o-linear-gradient(to top, rgba(27, 181, 128, 0.8) 0%, rgba(12, 109, 176, 0.8) 100%);
     background-image: linear-gradient(to top, rgba(27, 181, 128, 0.8) 0%, rgba(12, 109, 176, 0.8) 100%);
     filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='rgba(27, 181, 128, 0.15)', endColorStr='rgba(27, 181, 128, 0.15)', gradientType='1');
 }

 .bg-purple {
     color: #ffffff;
     background-color: #cc66cc !important;
 }

 .bg-sun-flower {
     color: #ffffff;
     background-color: #f1c40f !important;
 }

 .bg-orange {
     color: #ffffff;
     background-color: #f39c12 !important;
 }

 .bg-carrot {
     color: #ffffff;
     background-color: #e67e22 !important;
 }

 .bg-pumpkin {
     color: #ffffff;
     background-color: #d35400 !important;
 }

 .bg-alizarin {
     color: #ffffff;
     background-color: #e74c3c !important;
 }

 .bg-pomegranate {
     color: #ffffff;
     background-color: #c0392b !important;
 }

 .bg-turquoise {
     color: #ffffff;
     background-color: #1abc9c !important;
 }

 .bg-green-sea {
     color: #ffffff;
     background-color: #16a085 !important;
 }

 .bg-emerald {
     color: #ffffff;
     background-color: #2ecc71 !important;
 }

 .bg-nephritis {
     color: #ffffff;
     background-color: #27ae60 !important;
 }

 .bg-peter-river {
     color: #ffffff;
     background-color: #3498db !important;
 }

 .bg-belize-hole {
     color: #ffffff;
     background-color: #2980b9 !important;
 }

 .bg-amethyst {
     color: #ffffff;
     background-color: #9b59b6 !important;
 }

 .bg-wisteria {
     color: #ffffff;
     background-color: #8e44ad !important;
 }

 .bg-wet-asphalt {
     color: #ffffff;
     background-color: #34495e !important;
 }

 .bg-wet-asphalt {
     color: #ffffff;
     background-color: #34495e !important;
 }

 .bg-midnight-blue {
     color: #ffffff;
     background-color: #2c3e50 !important;
 }

 .bg-clouds {
     color: #454545;
     background-color: #ecf0f1 !important;
 }

 .bg-silver {
     color: #ffffff;
     background-color: #bdc3c7 !important;
 }

 .bg-concrete {
     color: #ffffff;
     background-color: #859596 !important;
 }

 .bg-asbestos {
     color: #ffffff;
     background-color: #7f8c8d !important;
 }

 .bg-asbestos {
     color: #ffffff;
     background-color: #7f8c8d !important;
 }

 .bg-graphite {
     color: #ffffff;
     background-color: #454545 !important;
 }

 .bg-gray-0 {
     background-color: #EEEEEE !important;
     color: #454545;
 }

 .bg-gray-1 {
     background-color: #ECECEC !important;
     color: #454545;
 }

 .bg-gray-2 {
     background-color: #BDC3C7 !important;
     color: #454545;
 }

 .bg-gray-3 {
     backgrond-color: #DADFE1 !important;
     color: #454545;
 }

 .bg-gray-5 {
     background-color: #ECF0F1 !important;
     color: #454545;
 }

 .bg-gray-4 {
     backgrouund-color: #F2F1EF !important;
     color: #454545;
 }

 .bg-gray-6 {
     background-color: #D2D7D3 !important;
     color: #454545;
 }

 .bg-gray-7 {
     background-color: #E6E6E6 !important;
     color: #454545;
 }

 .bg-orange-1 {
     background-color: #F9690E !important;
     color: #ffffff;
 }

 .bg-orange-2 {
     background-color: #D35400 !important;
     color: #ffffff;
 }

 .bg-orange-3 {
     background-color: #F89406 !important;
     color: #ffffff;
 }

 .col-img {
     height: 720px;
     padding: 60px;
     overflow: hidden;
 }

 @media only screen and (min-width:320px) and (max-width:767px) {
     .col-img {
         height: auto;
         min-height: 600px;
     }
 }

 .btn {
     font-family: 'Open Sans', sans-serif;
     position: relative;
     z-index: 2;
     font-size: 12px;
     font-weight: 700;
     text-transform: uppercase;
     text-align: center;
     border-radius: 0;
     padding: 0;
     line-height: 45px;
     width: 170px;
     height: 45px;
 }

 .btn.active,
 .btn:active {
     -moz-box-shadow: none;
     -webkit-box-shadow: none;
     box-shadow: none;
 }

 .btn--primary {
     background-color: #3498db;
     color: #ffffff;
     border: none;
 }

 .btn--primary:active,
 .btn--primary:focus,
 .btn--primary:hover {
     background-color: #363636;
     color: #ffffff;
 }

 .btn--secondary {
     background-color: #363636;
     color: #ffffff;
     border: 2px solid #363636;
 }

 .btn--secondary:active,
 .btn--secondary:focus,
 .btn--secondary:hover {
     background-color: #3498db;
     color: #ffffff;
     border-color: #3498db;
 }

 .btn--white {
     background-color: #ffffff;
     color: #363636;
     border: 1px solid #ffffff;
     border-radius: 4px;
 }

 .btn--white:active,
 .btn--white:focus,
 .btn--white:hover {
     background-color: #3498db;
     color: #ffffff;
     border-color: #3498db;
 }

 .btn--block {
     width: 100%;
 }

 .btn--auto {
     width: auto;
 }

 .btn--rounded {
     border-radius: 50px;
 }

 .btn--bordered {
     background-color: transparent;
 }

 .btn--bordered.btn--primary {
     color: #3498db;
     border-color: #3498db;
 }

 .btn--bordered.btn--primary:active,
 .btn--bordered.btn--primary:focus,
 .btn--bordered.btn--primary:hover {
     color: #ffffff;
     background-color: #3498db;
     border-color: #3498db;
 }

 .btn--bordered.btn--secondary {
     color: #363636;
     border-color: #363636;
 }

 .btn--bordered.btn--secondary:active,
 .btn--bordered.btn--secondary:focus,
 .btn--bordered.btn--secondary:hover {
     color: #ffffff;
     background-color: #363636;
     border-color: #363636;
 }

 .btn--bordered.btn--white {
     color: #ffffff;
     border-color: #ffffff;
 }

 .btn--bordered.btn--white:active,
 .btn--bordered.btn--white:focus,
 .btn--bordered.btn--white:hover {
     color: #3498db;
     background-color: #ffffff;
     border-color: #ffffff;
 }

 .btn--white.btn--secondary {
     color: #363636;
     border-color: #ffffff;
     background-color: #ffffff;
 }

 .btn--white.btn--secondary:active,
 .btn--white.btn--secondary:focus,
 .btn--white.btn--secondary:hover {
     color: #ffffff;
     background-color: #3498db;
     border-color: #3498db;
 }

 .bg-overlay-theme .btn--primary,
 .bg-theme .btn--primary {
     background-color: #2ecc71;
     color: #ffffff;
     border: none;
 }

 .portfolio-filter li a.active-filter,
 .portfolio-filter li a:hover {
     color: #3498db;
 }

 .navbar-toggle {
     border-color: #3498db;
     -moz-border-radius: 0;
     -webkit-border-radius: 0;
     border-radius: 0;
     margin-top: 35px;
 }

 .form-control {
     color: #777777;
     font-family: 'Open Sans', sans-serif;
     font-size: 14px;
     font-weight: 400;
     line-height: 45px;
     height: 45px;
     text-transform: capitalize;
     border: none;
     background: #ffffff;
     padding-left: 24px;
     margin-bottom: 30px;
     position: relative;
     border-radius: 0;
     -moz-box-shadow: none;
     -webkit-box-shadow: none;
     box-shadow: none;
 }

 .form-control:focus {
     border-color: #3498db;
     -moz-box-shadow: none;
     -webkit-box-shadow: none;
     box-shadow: none;
 }

 .form-control::-webkit-input-placeholder {
     color: #777777;
 }

 .form-control:-moz-placeholder {
     color: #777777;
 }

 .form-control::-moz-placeholder {
     color: #777777;
 }

 .form-control:-ms-input-placeholder {
     color: #777777;
 }

 .input-group {
     border-radius: 4px;
     background-color: #ffffff;
     overflow: hidden;
 }

 .heading .heading--title {
     font-family: 'Raleway', sans-serif;
     color: #222222;
     font-size: 36px;
     font-weight: 700;
     line-height: 1;
     margin-bottom: 30px;
     text-transform: capitalize;
 }

 .heading .heading--desc {
     font-size: 14px;
     font-weight: 400;
     line-height: 24px;
     margin-bottom: 0;
     padding: 0 30px;
 }

 @media only screen and (min-width:320px) and (max-width:767px) {
     .heading .heading--title {
         font-size: 30px;
     }
 }

 .preloader {
     width: 100%;
     height: 100%;
     left: 0;
     top: 0;
     position: fixed;
     z-index: 99999;
     background-color: #ffffff;
     overflow: hidden;
 }

 .header {
     height: 100px;
 }

 .header-transparent {
     background-color: transparent;
 }

 .header-transparent+.mtop-100,
 .header-transparent+.page-title {
     position: relative;
     margin-top: -100px;
 }

 .header .navbar-collapse {
     padding-right: 0;
     padding-left: 0;
 }

 .header .navbar {
     margin-bottom: 0;
     border-radius: 0;
     min-height: 100px;
     border: none;
     top: -200px;
 }

 .header .navbar.affix {
     top: 0;
 }

 .header-bordered .navbar {
     border-bottom: 1px solid rgba(255, 255, 255, 0.15);
 }

 .header .navbar .logo {
     max-width: 100%;
     height: auto;
     line-height: 100px;
 }

 .navbar-nav:not(.nav-pos-right) {
     margin-right: 200px;
 }

 .nav-bordered-right {
     margin-right: 30px;
 }

 .nav-bordered-right+.module:first-of-type:before {
     position: relative;
     margin-left: 12px;
 }

 .nav-bordered-right+.module:first-of-type:before {
     position: absolute;
     top: 50%;
     margin-top: -13px;
     left: -46px;
     content: "";
     width: 2px;
     height: 26px;
     background-color: #c9c9c9;
 }

 .affix .nav-bordered-right+.module:first-of-type:before {
     background-color: #c9c9c9;
 }

 .navbar-nav>li {
     margin-right: 32px;
 }

 .navbar-nav>li>a {
     font-size: 13px;
     text-transform: uppercase;
     font-weight: 700;
     line-height: 100px;
     color: #ffffff;
     padding: 0;
 }

 .nav .open>a,
 .nav .open>a:focus,
 .nav .open>a:hover {
     background-color: transparent;
     border: none;
 }

 .navbar-nav>li.active>ul {
     margin-top: 0;
 }

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

 .navbar-nav>li>a:before {
     position: absolute;
     bottom: -1px;
     left: 0;
     right: 0;
     margin: auto;
     width: 0;
     height: 3px;
     background: transparent;
     content: '';
     -webkit-transition: all 0.4s;
     -moz-transition: all 0.4s;
     transition: all 0.4s;
 }

 .navbar-nav>li>a:hover::before,
 .navbar-nav>li.active>a:before {
     background-color: #ffffff;
     width: 100%;
 }

 .transparent-header .navbar {
     background-color: transparent;
     height: 101px;
 }

 .header-light {
     background-color: #ffffff;
 }

 .header-light .navbar .logo-dark {
     display: inline-block;
 }

 .header-light .navbar .logo-light {
     display: none;
 }

 .header-light .navbar .navbar-nav>li>a:hover::before,
 .header-light .navbar .navbar-nav>li.active>a:before {
     background-color: #222222;
 }

 .header-fixed .affix {
     background-color: #ffffff;
     -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.09);
     -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.09);
     -ms-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.09);
     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.09);
     display: block;
 }

 .header-fixed:not(.header-light) .navbar .logo-dark {
     display: none;
 }

 .header-fixed .navbar.affix .logo-dark {
     display: inline-block;
 }

 .header-fixed .navbar.affix .logo-light {
     display: none;
 }

 .header-fixed .navbar.affix .module .module-icon i,
 .header-fixed .navbar.affix .navbar-nav>li>a {
     color: #222222;
 }

 .header-fixed .navbar.affix .navbar-nav>li>a:hover::before,
 .header-fixed .navbar.affix .navbar-nav>li.active>a:before {
     background-color: #222222;
 }

 .header-centered {
     height: 255px;
 }

 .header-centered .navbar-collapse {
     padding-right: 260px;
     padding-left: 260px;
 }

 .header-centered .navbar {
     top: 155px;
 }

 .header-centered .navbar.affix {
     top: 0;
 }

 .header-centered .logo-centered {
     padding-top: 50px;
     padding-bottom: 25px;
 }

 .header-topbar {
     height: 155px;
 }

 .header-topbar .navbar {
     top: 55px;
 }

 .header-topbar .navbar.affix {
     top: 0;
 }

 .header-3 .navbar-nav {
     margin-right: 30px;
     border-right: 1px solid rgba(255, 255, 255, 0.25);
 }

 .header-3 .navbar+.module:first-of-type:before {
     position: relative;
     margin-left: 12px;
 }

 .header-5 .container-fluid {
     padding-right: 0;
 }

 .header-5 .module {
     position: relative;
     border-left: 1px solid rgba(255, 255, 255, 0.25);
 }

 .header-5 .module .module-icon {
     margin-left: 25px;
     margin-right: 25px;
 }

 .header-6 .container-fluid {
     padding-right: 0;
 }

 .header-6 .navbar {
     min-height: 79px;
 }

 .header-6 .navbar .logo {
     height: 79px;
     line-height: 79px;
 }

 .header-6 .module .module-icon {
     line-height: 79px;
 }

 .header-6 .module .module-label {
     top: 24px;
     right: 17px;
     left: auto;
 }

 .header-6 .navbar-nav>li {
     margin-right: 0;
 }

 .header-6 .navbar-nav>li>a {
     padding-right: 32px;
     padding-left: 32px;
     border-left: 1px solid rgba(255, 255, 255, 0.25);
     line-height: 79px;
 }

 .header-6 .navbar-nav>li>.menu-item:before {
     display: none;
 }

 .header-6 .navbar-nav>li.active,
 .header-6 .navbar-nav>li:hover {
     background-color: rgba(34, 34, 34, 0.5);
 }

 .header-6 .module {
     position: relative;
     border-left: 1px solid rgba(255, 255, 255, 0.25);
 }

 .header-6 .module .module-icon {
     margin-left: 32px;
     margin-right: 32px;
 }

 .header-7 {
     height: 305px;
 }

 .header-7 .navbar {
     top: 205px;
 }

 .header-7 .navbar.affix {
     top: 0;
 }

 .header-13 .logo {
     position: absolute;
     left: 50%;
     margin-left: -51px;
 }

 .header-10 .nav-bordered-right+.module:first-of-type:before {
     background-color: #464d52;
 }

 .header-16 .navbar {
     top: 30px;
 }

 .header-16 .navbar.affix {
     top: 0;
 }

 .header-centered.header-17 {
     height: 265px;
 }

 .header-centered.header-17 .navbar {
     top: 165px;
 }

 .header-17 .navbar.affix {
     top: 0;
 }

 .header-half .navbar-nav>li>.menu-item:before {
     bottom: 36px;
 }

 .container-bordered {
     border-bottom: 1px solid rgba(255, 255, 255, 0.15);
     height: 100px;
 }

 .header-transparent.header-light .navbar.affix {
     background-color: transparent;
 }

 .navbar.navbar--dark .logo-dark {
     display: inline-block !important;
 }

 .navbar.navbar--dark .logo-light {
     display: none;
 }

 .navbar.navbar--dark .module .module-icon,
 .navbar.navbar--dark .module .module-icon i,
 .navbar.navbar--dark .navbar-nav>li>a {
     color: #222222;
 }

 .header-8 .navbar.navbar--dark .module-menu .module-icon:after,
 .navbar.navbar--dark .navbar-nav>li>.menu-item:hover::before,
 .navbar.navbar--dark .navbar-nav>li.active>.menu-item:before {
     background-color: #222222;
 }

 .header-split .logo-dark {
     display: none;
 }

 .header-split .logo-light {
     display: inline-block;
 }

 .header-split .module .module-icon i,
 .header-split .navbar-nav>li>a {
     color: #222222;
 }

 .header-split .navbar-nav>li>.menu-item:hover::before,
 .header-split .navbar-nav>li.active>.menu-item:before {
     background-color: #222222;
 }

 @media only screen and (min-width:320px) and (max-width:479px) {
     .header .navbar {
         top: 0;
     }

     .navbar-toggle .icon-bar {
         background-color: #3498db;
     }

     .header-fixed .navbar.affix .navbar-nav>li>a {
         color: #ffffff;
     }
 }

 @media only screen and (min-width:320px) and (max-width:767px) {
     .header .container {
         padding-right: 0;
         padding-left: 0;
     }

     .navbar-nav {
         margin: 0;
         border-bottom: 1px solid rgba(255, 255, 255, 0.1);
     }

     .navbar-toggle {
         border-color: #3498db;
         -moz-border-radius: 0;
         -webkit-border-radius: 0;
         border-radius: 0;
         margin-top: 35px;
     }

     .container>.navbar-header {
         margin-left: 0;
         padding-right: 10px;
         padding-left: 10px;
     }

     .container>.navbar-collapse {
         width: 100%;
         background-color: #363636;
         margin-right: 0;
         margin-left: 0;
     }

     .navbar-nav>li {
         height: auto !important;
         margin-right: 0;
     }

     .navbar-nav>li.pull-left {
         float: none !important;
     }

     .navbar-nav li a {
         line-height: 36px;
         color: #ffffff;
         padding-right: 0;
         padding-left: 10px;
         padding-top: 0;
     }

     .navbar-nav>li>a:before {
         display: none;
     }

     .navbar-nav:not(.nav-pos-right) {
         margin-right: 0;
     }
 }

 @media only screen and (min-width:768px) and (max-width:991px) {
     .header .container {
         padding-right: 0;
         padding-left: 0;
     }

     .navbar-header {
         float: none !important;
         margin-right: auto;
         margin-left: auto;
         text-align: center;
     }

     .header .navbar .logo {
         float: left;
     }

     .navbar-toggle {
         border-color: #3498db;
         -moz-border-radius: 0;
         -webkit-border-radius: 0;
         border-radius: 0;
         margin-top: 35px;
         display: block;
     }

     .navbar-toggle .icon-bar {
         background-color: #3498db;
     }

     .navbar-fixed-top .navbar-collapse {
         overflow: scroll !important;
     }

     .navbar-collapse.collapse {
         display: none !important;
     }

     .collapse.in {
         display: block !important;
     }

     .navbar-nav {
         width: 100%;
         padding-right: 15px;
         padding-left: 15px;
     }

     .navbar-nav>li {
         float: none;
     }

     .container>.navbar-collapse {
         width: 100%;
         background-color: #363636;
         margin-right: 0;
     }

     .navbar-nav>li {
         height: auto !important;
         margin-right: 0;
     }

     .navbar-nav>li.pull-left {
         float: none !important;
     }

     .navbar-nav>li>a {
         line-height: 36px !important;
         color: #ffffff !important;
         padding-right: 0;
         padding-left: 0;
         padding-top: 0;
     }

     .navbar-toggle .icon-bar {
         background-color: #3498db;
     }

     .navbar-nav>li:after {
         display: none;
     }

     .navbar-nav>li.active {
         border-bottom: none;
     }

     li a:hover,
     li.open>a:focus {
         color: #ffffff;
     }

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

     .navbar-nav>li>a:before {
         display: none;
     }
 }

 @media only screen and (max-width:991px) {
     .navbar.navbar--dark .navbar-nav>li>a {
         color: #ffffff;
     }
 }

 @media only screen and (min-width:992px) and (max-width:1200px) {
     .navbar-nav>li {
         margin-right: 16px;
     }
 }

 .header-transparent+.slider {
     margin-top: -100px;
 }

 .slider {
     height: 800px;
     padding-top: 0;
     padding-bottom: 0;
 }

 .slider .slide--item {
     height: 800px;
 }

 .slider .slide--headline,
 .slider .slide--headline h1 {
     color: #ffffff;
     font-family: 'Raleway', sans-serif;
     font-size: 48px;
     font-weight: 400;
     line-height: 60px;
     margin-bottom: 27px;
     text-transform: capitalize;
 }

 .slider .slide--bio {
     color: #ffffff;
     font-family: 'Open Sans', sans-serif;
     font-size: 20px;
     font-weight: 400;
     line-height: 32px;
     margin-bottom: 29px;
 }

 .slider-2,
 .slider-2 .bg-section {
     overflow: visible;
 }

 .slider .slide--holder {
     position: relative;
 }

 .slider .slide--holder img {
     position: absolute;
     right: 0;
     bottom: -800px;
 }

 .slide--item .bg-ytvideo {
     height: 800px;
 }

 @media only screen and (min-width:320px) and (max-width:767px) {

     .slider .slide--headline,
     .slider .slide--headline h1 {
         margin-top: 50px;
         font-size: 30px;
         line-height: 1.2;
         text-align: center;
     }

     .slider .slide--bio {
         font-size: 14px;
         line-height: 1.5;
         padding: 0 10px;
         text-align: center;
     }

     .slider,
     .slider .slide--item {
         height: auto;
     }

     .slider .btn {
         width: 130px;
     }

     .slider form {
         margin-bottom: 30px !important;
     }

     .slider .slide--holder img {
         position: relative;
         right: 0;
         bottom: 0;
     }
 }

 @media only screen and (min-width:768px) and (max-width:991px) {

     .slider .slide--headline,
     .slider .slide--headline h1 {
         font-size: 30px;
         line-height: 1.2;
     }

     .slider .slide--bio {
         font-size: 14px;
         line-height: 1.5;
     }

     .slider .slide--holder img {
         max-width: 500px;
     }
 }

 .testimonial-panel {
     border-radius: 6px;
     background-color: #f8f8f8;
     padding: 40px;
     -webkit-transition: all 0.3s linear;
     -moz-transition: all 0.3s linear;
     -ms-transition: all 0.3s linear;
     transition: all 0.3s linear;
 }

 .testimonial-panel .testimonial--body {
     margin-bottom: 20px;
 }

 .testimonial-panel .testimonial--body p {
     color: #aaaaaa;
     font-size: 14px;
     font-weight: 400;
     line-height: 24px;
     margin-bottom: 0;
 }

 .testimonial-panel .testimonial--meta h5 {
     color: #222222;
     font-size: 12px;
     font-weight: 700;
     line-height: 18px;
     margin-bottom: 0;
     text-transform: capitalize;
 }

 .testimonial-panel .testimonial--rating i {
     color: #f3be3c;
     font-size: 12px;
     line-height: 18px;
     margin: 0 2px;
     -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
     -ms-transition: all 0.3s;
     transition: all 0.3s;
 }

 .testimonial-panel:hover {
     background-color: #3498db;
     cursor: pointer;
 }

 .testimonial-panel:hover .testimonial--body p,
 .testimonial-panel:hover .testimonial--meta h5 {
     color: #ffffff;
 }

 .testimonial-panel:hover .testimonial--rating i {
     font-size: 18px;
 }

 @media only screen and (min-width:320px) and (max-width:767px) {
     .testimonial-panel {
         padding: 20px;
         margin-bottom: 30px;
     }

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

     .testimonial--author,
     .testimonial--rating {
         float: none !important;
     }
 }

 @media only screen and (min-width:768px) and (max-width:991px) {
     .testimonial-panel {
         padding: 40px 10px;
     }
 }

 .feature-panel {
     position: relative;
 }

 .feature-panel .feature--icon {
     color: #38B6FF;
     font-size: 47px;
     line-height: 1;
     margin-bottom: 40px;
 }

 .feature-panel .feature--icon i {
     -webkit-transition: all 0.3s linear;
     -moz-transition: all 0.3s linear;
     -ms-transition: all 0.3s linear;
     transition: all 0.3s linear;
     display: inline-block;
 }

 .feature-panel .feature--icon:hover i {
     -webkit-animation: pulse 0.9s infinite;
     -moz-animation: pulse 0.9s infinite;
     -ms-animation: pulse 0.9s infinite;
     -o-animation: pulse 0.9s infinite;
     animation: pulse 0.9s infinite;
 }

 .feature-panel .feature--content h3 {
     font-family: 'Raleway', sans-serif;
     color: #222222;
     font-size: 20px;
     font-weight: 700;
     line-height: 1;
     margin-bottom: 19px;
     text-transform: capitalize;
 }

 .feature-panel .feature--content p {
     font-size: 14px;
     font-weight: 400;
     line-height: 24px;
     margin-bottom: 0;
     padding-right: 10px;
     padding-left: 10px;
 }

 .feature-left .feature-panel {
     -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
     -ms-transition: all 0.3s;
     -o-transition: all 0.3s;
     transition: all 0.3s;
 }

 .feature-left .feature-panel:hover {
     -webkit-transform: translateY(-4px);
     -moz-transform: translateY(-4px);
     transform: translateY(-4px);
 }

 .feature-left .feature-panel .feature--icon {
     position: absolute;
     left: 0;
     top: 0;
     margin-bottom: 0;
 }

 .feature-left .feature-panel .feature--content {
     padding-left: 75px;
 }

 .feature-left-circle .feature--content h3 {
     font-size: 22px;
     font-family: 'Raleway', sans-serif;
     font-weight: 400;
     line-height: 29px;
     margin-bottom: 15px;
 }

 .feature-left-circle .feature--content p {
     font-size: 14px;
     font-weight: 400;
     line-height: 23px;
     padding: 0;
 }

 .feature-left-circle .feature--icon {
     width: 45px;
     height: 45px;
     line-height: 42px;
     text-align: center;
     border-radius: 50%;
     color: #38B6FF;
     font-family: 'Open Sans', sans-serif;
     font-size: 24px;
     border: 2px solid #38B6FF;
     -webkit-transition: all 0.2s linear;
     -moz-transition: all 0.2s linear;
     transition: all 0.2s linear;
 }

 .feature-left-circle .feature-panel:hover .feature--icon {
     background: #38B6FF;
     border-color: #38B6FF;
     color: #ffffff;
 }

 @media only screen and (min-width:320px) and (max-width:767px) {
     .feature-panel {
         margin-bottom: 20px;
     }

     .feature-panel .feature--icon {
         margin-bottom: 10px;
     }

     .feature img {
         max-width: 100%;
         height: auto;
     }
 }

 @media only screen and (min-width:768px) and (max-width:991px) {
     .feature-panel {
         margin-bottom: 20px;
     }
 }

 .cta .btn-hover:first-of-type {
     margin-right: 15px;
 }

 .cta .btn-hover {
     position: relative;
     display: inline-block;
     overflow: hidden;
     z-index: 1;
     -webkit-transition: 0.4s ease-in-out;
     -moz-transition: 0.4s ease-in-out;
     -ms-transition: 0.4s ease-in-out;
     -o-transition: 0.4s ease-in-out;
     transition: 0.4s ease-in-out;
 }

 .cta .btn-hover img {
     -webkit-transition: all 0.5s ease-in-out;
     -moz-transition: all 0.5s ease-in-out;
     -ms-transition: all 0.5s ease-in-out;
     -o-transition: all 0.5s ease-in-out;
     transition: all 0.5s;
     -webkit-backface-visibility: hidden;
     -moz-backface-visibility: hidden;
     -ms-backface-visibility: hidden;
     -o-backface-visibility: hidden;
     backface-visibility: hidden;
 }

 .cta .btn-hover::before {
     position: absolute;
     top: 0;
     left: -75%;
     z-index: 2;
     display: block;
     content: '';
     width: 50%;
     height: 100%;
     background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
     background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
     -webkit-transform: skewX(-25deg);
     transform: skewX(-25deg);
 }

 .cta .btn-hover:hover::before {
     -webkit-animation: shine 0.75s;
     animation: shine 0.75s;
 }

 @-webkit-Keyframes shine {
     100% {
         left: 125%;
     }
 }

 @keyframes shine {
     100% {
         left: 125%;
     }
 }

 @media only screen and (min-width:320px) and (max-width:767px) {
     .cta .btn-hover:first-of-type {
         margin-right: 0;
     }

     .cta img {
         max-width: 100%;
         height: auto;
     }
 }

 .pricing-panel {
     border-radius: 6px;
     padding: 40px;
     -webkit-transition: all 0.35s;
     -moz-transition: all 0.35s;
     -o-transition: all 0.35s;
     transition: all 0.35s;
     position: relative;
 }

 .pricing-panel:hover {
     -webkit-transform: translateY(-4px);
     -moz-transform: translateY(-4px);
     -o-transform: translateY(-4px);
     transform: translateY(-4px);
 }

 .pricing-panel .pricing--heading h4 {
     color: #ffffff;
     font-family: 'Open Sans', sans-serif;
     font-size: 14px;
     font-weight: 400;
     line-height: 1;
     margin-bottom: 33px;
     text-transform: uppercase;
 }

 .pricing-panel .pricing--heading p {
     font-family: 'Raleway', sans-serif;
     color: #ffffff;
     font-size: 60px;
     font-weight: 400;
     line-height: 1;
     margin-bottom: 35px;
     text-transform: capitalize;
 }

 .pricing-panel .pricing--heading span.currency {
     font-size: 18px;
 }

 .pricing-panel .pricing--heading .pricing--desc {
     color: #e0e0e0;
     font-size: 14px;
     font-weight: 400;
     line-height: 24px;
     margin-bottom: 30px;
 }

 .pricing-panel .pricing--body {
     text-align: center;
 }

 .pricing-panel.pricing-active,
 .pricing-panel:hover {
     background-color: #ffffff;
 }

 .pricing-panel.pricing-active .pricing--heading .pricing--desc,
 .pricing-panel.pricing-active .pricing--heading h4,
 .pricing-panel:hover .pricing--heading .pricing--desc,
 .pricing-panel:hover .pricing--heading h4 {
     color: #999999;
 }

 .pricing-panel.pricing-active .pricing--heading p,
 .pricing-panel:hover .pricing--heading p {
     color: #222222;
 }

 .pricing-panel .btn {
     border-radius: 4px;
 }

 .pricing-panel:hover .btn--white {
     background-color: #363636;
     border-color: #363636;
     color: #ffffff;
 }

 @media only screen and (min-width:320px) and (max-width:767px) {
     .price-table {
         margin-bottom: 30px;
     }
 }

 @media only screen and (min-width:768px) and (max-width:991px) {
     .pricing-panel {
         padding: 20px;
     }
 }

 .footer {
     background-color: #ffffff;
     padding-top: 33px;
     padding-bottom: 33px;
 }

 .footer--copyright {
     color: #999999;
     font-family: 'Raleway', sans-serif;
     font-size: 14px;
     font-weight: 400;
     line-height: 1;
     text-transform: capitalize;
 }

 .footer--copyright i {
     color: red;
 }

 @media only screen and (min-width:320px) and (max-width:767px) {
     .footer--copyright {
         font-size: 12px;
     }
 }

 @media only screen and (min-width:320px) and (max-width:767px) {
 }

 .carousel-dots .owl-controls {
     margin-top: 50px;
 }

 .carousel-dots .owl-controls .owl-dots .owl-dot span {
     height: 11px;
     width: 11px;
     border-radius: 50%;
     background-color: transparent;
     border: 2px solid rgba(100, 100, 100, 0.5);
     margin: 0 4px;
 }

 .carousel-dots .owl-controls .owl-dots .owl-dot.active span {
     background-color: #646464;
     border-color: #646464;
 }

 .carousel-dots.carousel-white .owl-controls .owl-dots .owl-dot span {
     border-color: rgba(255, 255, 255, 0.5);
 }

 .carousel-dots.carousel-white .owl-controls .owl-dots .owl-dot.active span {
     background-color: #ffffff;
     border-color: #ffffff;
 }

 .carousel-navs .owl-controls .owl-nav {
     position: relative;
 }

 .carousel-navs .owl-controls .owl-nav [class*=owl-] {
     position: absolute;
     top: 50%;
     height: 60px;
     line-height: 60px;
     color: #363636;
     font-size: 0;
     font-weight: 400;
     text-align: center;
     background-color: transparent;
     padding: 0;
     border-radius: 0;
     -webkit-transition: all 0.35s;
     -moz-transition: all 0.35s;
     -o-transition: all 0.35s;
     transition: all 0.35s;
     margin-top: -250px;
 }

 .carousel-navs .owl-controls .owl-nav [class*=owl-]:hover {
     color: #3498db;
     background-color: transparent;
 }

 .carousel-navs .owl-controls .owl-nav .owl-prev {
     left: 0;
 }

 .carousel-navs .owl-controls .owl-nav .owl-prev:before {
     font-family: 'Linearicons-Free';
     content: "\e875";
     font-size: 40px;
 }

 .carousel-navs .owl-controls .owl-nav .owl-next {
     right: 0;
 }

 .carousel-navs .owl-controls .owl-nav .owl-next:before {
     font-family: 'Linearicons-Free';
     content: "\e876";
     font-size: 40px;
 }

 .carousel-navs .owl-dots {
     position: absolute;
     bottom: 20px;
     width: 100%;
 }

 .carousel-navs .owl-dots .owl-dot span {
     background-color: transparent;
     border: 1px solid #fff;
 }

 .carousel-navs .owl-dots .owl-dot.active span,
 .carousel-navs .owl-dots .owl-dot:hover span {
     background: #ffffff;
 }

 .slider-dots .owl-controls {
     margin-top: 0;
 }

 .slider-dots .owl-controls .owl-dots {
     position: absolute;
     bottom: 30px;
     width: 100%;
 }

 .slider-dots .owl-controls .owl-dots .owl-dot span {
     height: 11px;
     width: 11px;
     border-radius: 50%;
     background-color: #ffffff;
     border: 2px solid rgba(0, 0, 0, 0.6);
     margin: 0 4px;
 }

 .slider-dots .owl-controls .owl-dots .owl-dot.active span {
     -moz-box-shadow: 0 0 0 2px #3d3c3c;
     -webkit-box-shadow: 0 0 0 2px #3d3c3c;
     box-shadow: 0 0 0 2px #ffffff;
 }

 .slider-navs .owl-controls .owl-nav [class*=owl-] {
     position: absolute;
     top: 50%;
     height: 60px;
     width: 60px;
     line-height: 60px;
     margin-top: -30px;
     color: #ffffff;
     font-size: 0;
     font-weight: 400;
     background-color: rgba(27, 26, 26, 0.5);
     text-align: center;
     padding: 0;
     border-radius: 0;
     -webkit-transition: all 0.35s;
     -moz-transition: all 0.35s;
     -o-transition: all 0.35s;
     transition: all 0.35s;
 }

 .slider-navs .owl-controls .owl-nav [class*=owl-]:hover {
     color: #999999;
     background-color: #ffffff;
 }

 .slider-navs .owl-controls .owl-nav .owl-prev {
     left: 30px;
 }

 .slider-navs .owl-controls .owl-nav .owl-next:before,
 .slider-navs .owl-controls .owl-nav .owl-prev:before {
     font-family: fontawesome;
     font-size: 25px;
 }

 .slider-navs .owl-controls .owl-nav .owl-prev:before {
     content: "\f104";
 }

 .slider-navs .owl-controls .owl-nav .owl-next {
     right: 30px;
 }

 .slider-navs .owl-controls .owl-nav .owl-next:before {
     content: "\f105";
 }

 .slider-navs .owl-dots {
     position: absolute;
     bottom: 20px;
     width: 100%;
 }

 .slider-navs .owl-dots .owl-dot span {
     background-color: transparent;
     border: 1px solid #fff;
 }

 .slider-navs .owl-dots .owl-dot.active span,
 .slider-navs .owl-dots .owl-dot:hover span {
     background: #ffffff;
 }

 .slider-navs.slider-small .owl-controls .owl-nav .owl-next {
     right: 0;
 }

 .slider-navs.slider-small .owl-controls .owl-nav .owl-prev {
     left: 0;
 }

 .slider-navs.slider-shop .owl-controls .owl-dots .owl-dot span {
     background-color: #3d3c3c;
     border: 2px solid #ffffff;
 }

 .slider-navs.slider-shop .owl-controls .owl-dots .owl-dot.active span {
     -moz-box-shadow: 0 0 0 2px #3d3c3c;
     -webkit-box-shadow: 0 0 0 2px #3d3c3c;
     box-shadow: 0 0 0 2px #3d3c3c;
 }

 .slider-theme.slider-navs .owl-controls .owl-nav [class*=owl-]:hover {
     color: #363636;
 }

 .slider-theme.slider-dots .owl-controls .owl-dots .owl-dot span {
     border-color: #3498db;
 }

 @media only screen and (min-width:320px) and (max-width:767px) {
     .carousel-dots .owl-controls {
         margin-top: 20px;
     }

     .slider-navs .owl-controls .owl-nav .owl-prev {
         left: 0;
     }

     .slider-navs .owl-controls .owl-nav .owl-next {
         right: 0;
     }

     .slider-navs .owl-controls .owl-nav .owl-next:before,
     .slider-navs .owl-controls .owl-nav .owl-prev:before {
         font-size: 20px;
     }
 }

 @media only screen and (min-width:768px) and (max-width:991px) {

     .slider-navs .owl-controls .owl-nav .owl-next:before,
     .slider-navs .owl-controls .owl-nav .owl-prev:before {
         font-size: 30px;
     }
 }

 .landing-hero {
     height: 100vh;
     padding-top: 200px;
 }

 .landing-hero h1 {
     font-size: 65px;
     font-weight: 700;
     line-height: 70px;
     text-transform: capitalize;
 }

 .landing-hero p {
     font-family: 'Raleway', sans-serif;
     color: #f9f9f9;
     font-size: 18px;
     font-style: italic;
     line-height: 27px;
 }

 .landing-demos .portfolio-filter li a {
     font-weight: 600;
 }

 .landing-demos .portfolio-item {
     margin-bottom: 50px;
 }

 .landing-demos .portfolio-title h4 {
     color: #282828;
     text-align: center;
     font-size: 16px;
     font-weight: 600;
     text-transform: capitalize;
     margin-bottom: 0;
 }

 .landing-demos .portfolio-title:hover h4 {
     color: #3498db;
 }

 .landing-demos .portfolio-img {
     -moz-box-shadow: 0 2px 3px rgba(40, 40, 40, 0.1);
     -webkit-box-shadow: 0 2px 3px rgba(40, 40, 40, 0.1);
     box-shadow: 0 0 36px 4px rgba(0, 0, 0, 0.1);
     background-color: #c0c0c0;
     -webkit-transition: all 0.35s;
     -moz-transition: all 0.35s;
     -o-transition: all 0.35s;
     transition: all 0.35s;
 }

 .landing-demos .portfolio-img img {
     max-width: 100%;
     height: auto;
 }

 .landing-demos .portfolio-item:hover .portfolio-img {
     -webkit-transform: translateY(-6px);
     -moz-transform: translateY(-6px);
     -o-transform: translateY(-6px);
     transform: translateY(-6px);
 }

 .landing-demos .portfolio-item:hover img {
     -webkit-transform: scale(1);
     -moz-transform: scale(1);
     -o-transform: scale(1);
     transform: scale(1);
 }

 .landing-demos .portfolio-bio {
     padding-top: 23px;
 }

 .landing-action {
     padding-top: 200px;
 }

 .landing-action img {
     margin-bottom: 50px;
 }

 .landing-action h2 {
     font-size: 50px;
     line-height: 60px;
     margin-bottom: 50px;
 }

 .landing-featues {
     padding-bottom: 50px;
 }

 .landing-featues .feature-box {
     margin-bottom: 50px;
 }

 .portfolio-filter {
     text-align: center;
     margin-bottom: 36px;
 }

 .portfolio-filter li a {
     color: #363636;
     font-size: 13px;
     font-weight: 700;
     line-height: 1;
     margin-right: 29px;
     text-transform: capitalize;
 }

 .portfolio-filter li:last-child a {
     margin-right: 0;
 }

 .portfolio-filter li a.active-filter,
 .portfolio-filter li a:hover {
     color: #3498db;
 }

 .portfolio-item .portfolio--img {
     position: relative;
 }

 .portfolio-item .portfolio--img img {
     max-width: 100%;
     height: auto;
 }

 .switcher-box {
     background-color: #ffffff;
     border: 1px solid #dddddd;
     color: #222222;
     left: 0;
     overflow: inherit;
     padding: 0;
     position: fixed;
     text-align: center;
     top: 200px;
     z-index: 999;
 }

 .switcher-box .gear-check {
     background-color: #ffffff;
     border-radius: 0 5px 5px 0;
     border: 1px solid #dddddd;
     border-left-color: transparent;
     color: #222222;
     cursor: pointer;
     font-size: 20px;
     height: 40px;
     line-height: 40px;
     padding-top: 4px;
     position: absolute;
     right: -39px;
     text-align: center;
     top: -1px;
     width: 40px;
 }

 .switcher-box .gear-check i {
     font-size: 30px;
 }

 .switcher-box .color-options {
     display: none;
     float: left;
     padding: 5px 16px;
     width: 200px;
 }

 .switcher-box ul {
     margin-bottom: 0;
 }

 .switcher-box ul li {
     border-radius: 5px;
     cursor: pointer;
     height: 30px;
     margin: 0 10px 10px 0;
     width: 30px;
 }

 .color-options h4 {
     border-bottom: 3px solid #eeeeee;
     font-size: 18px;
     font-weight: 700;
     line-height: 46px;
 }

 .page-boxed {
     background: url(../images/background/patterns/wood-dark.jpg);
 }

 @media only screen and (min-width:1200px) {
     .page-boxed .wrapper {
         width: 1170px;
         margin: auto;
         -moz-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
         -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
         box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
     }

     .page-boxed .wrapper .container {
         padding-right: 30px;
         padding-left: 30px;
     }
 }

 @media only screen and (max-width:1200px) {
     .page-boxed .wrapper {
         width: auto;
         margin: auto;
         overflow-x: hidden;
     }
 }

 .page-boxed .header-fixed .affix {
     background-color: transparent;
 }

 .page-boxed .header-fixed .affix .container {
     background-color: #ffffff;
 }

 .page-boxed .col-content {
     padding: 90px;
 }

 .page-dark .wrapper,
 body.page-dark {
     background-color: #363636;
     color: #9b9b9b;
 }

 .page-dark .bg-white {
     background-color: #1d1d1d !important;
     color: #9b9b9b;
 }

 .page-dark .pricing-panel .pricing--heading p,
 .page-dark .portfolio-filter li a,
 .page-dark .landing-demos .portfolio-title h4 {
     color: #f9f9f9;
 }

 .page-dark .h1,
 .page-dark .h2,
 .page-dark .h3,
 .page-dark .h4,
 .page-dark .h5,
 .page-dark .h6,
 .page-dark .heading .heading--title,
 .page-dark h1,
 .page-dark h2,
 .page-dark h3,
 .page-dark h4,
 .page-dark h5,
 .page-dark h6,
 .page-dark .footer--copyright,
 .page-dark .testimonial-panel .testimonial--meta h5,
 .page-dark .feature-left-circle .feature--content h3,
 .page-dark .feature-panel .feature--content h3 {
     color: #ffffff;
 }

 .page-dark .pricing-panel.pricing-active,
 .page-dark .pricing-panel:hover {
     -moz-box-shadow: 0 2px 3px rgba(40, 40, 40, 0.1);
     -webkit-box-shadow: 0 2px 3px rgba(40, 40, 40, 0.1);
     box-shadow: 0 2px 3px rgba(40, 40, 40, 0.1);
     background-color: #1d1d1d;
 }

 .page-dark .form-control,
 .page-dark .footer,
 .page-dark .testimonial-panel {
     background-color: #363636;
 }

 .page-dark .btn--secondary {
     background-color: #f9f9f9;
     border-color: #f9f9f9;
     color: #363636;
 }

 .page-dark .btn--bordered.btn--secondary {
     color: #f9f9f9;
     border-color: #f9f9f9;
     background-color: transparent;
 }

 .page-dark .btn--bordered.btn--secondary:active,
 .page-dark .btn--bordered.btn--secondary:focus,
 .page-dark .btn--bordered.btn--secondary:hover {
     color: #363636;
     background-color: #f9f9f9;
     border-color: #f9f9f9;
 }

 .page-dark .btn--primary:active,
 .page-dark .btn--primary:focus,
 .page-dark .btn--primary:hover {
     background-color: #f9f9f9;
     border-color: #f9f9f9;
     color: #3498db;
 }

 .page-dark .testimonial-panel:hover {
     background-color: #3498db;
 }

 .body-bordered .bordered--line {
     position: fixed;
     display: block;
     background: #ffffff;
     z-index: 999999;
 }

 .body-bordered .bordered--line-top,
 .body-bordered .bordered--line-bottom {
     height: 20px;
     left: 0;
     right: 0;
 }

 .body-bordered .bordered--line-right,
 .body-bordered .bordered--line-left {
     width: 20px;
     top: 0;
     bottom: 0;
 }

 .body-bordered .bordered--line-top {
     top: 0;
 }

 .body-bordered .bordered--line-bottom {
     bottom: 0;
 }

 .body-bordered .bordered--line-right {
     right: 0;
 }

 .body-bordered .bordered--line-left {
     left: 0;
 }

 .body-bordered .navbar-fixed-top {
     top: -220px;
 }

 .body-bordered .navbar-fixed-top.affix {
     top: 0;
 }

 .feature--icon2 i {
     font-size: 2rem;
     color: #38B6FF;
 }

 html,
 body {
     margin: 0;
     padding: 0;
     font-family: "Raleway", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
     color: var(--dark);
     background: #fff;
 }

 #newsletter .nl-inputs {
     max-width: 640px;
     margin: 0 auto;
     display: flex;
     gap: 8px;
     background: #fff;
     border-radius: 9999px;
     padding: 6px;
     box-shadow: 0 12px 30px rgba(2, 8, 20, .15);
     border: 1px solid rgba(17, 24, 39, .06);
 }

 #newsletter .nl-inputs input {
     flex: 1;
     min-width: 0;
     background: transparent;
     border: none;
     outline: none;
     padding: 12px 14px;
     font-size: 16px;
     color: #0F1220;
 }

 #newsletter .nl-inputs input::placeholder {
     color: #9CA3AF;
 }

 #newsletter .nl-inputs button {
     height: 44px;
     padding: 0 20px;
     border: none;
     border-radius: 9999px;
     font-weight: 700;
     font-size: 15.5px;
     cursor: pointer;
     background: #0F1220;
     color: #fff;
     transition: transform .15s ease, box-shadow .15s ease, opacity .2s ease;
 }

 #newsletter .nl-inputs button:hover {
     transform: translateY(-1px);
     box-shadow: 0 10px 22px rgba(0, 0, 0, .18);
 }

 #newsletter .nl-inputs button:active {
     transform: translateY(0);
 }

 @media (max-width:480px) {
     #newsletter .nl-inputs {
         padding: 5px;
     }

     #newsletter .nl-inputs button {
         height: 42px;
         padding: 0 16px;
         font-size: 15px;
     }
 }

 #feature2 .icon-wrap {
     width: 72px;
     height: 72px;
     border-radius: 50%;
     position: relative;
     display: grid;
     place-items: center;
     margin-bottom: 14px;
 }

 #feature2 .icon-wrap .icon-ring {
     position: absolute;
     inset: 0;
     border-radius: 50%;
     padding: 2px;
     background: var(--ring);
     -webkit-mask: radial-gradient(#000 62%, transparent 63%) content-box, radial-gradient(#000 62%, transparent 63%);
     -webkit-mask-composite: xor;
     mask-composite: exclude;
 }

 #feature2 .icon-wrap i {
     font-size: 24px;
     color: #38B6FF;
     line-height: 1;
     z-index: 1;
 }

 :root {
     --primary: #7ed6df;
     --primary-2: #00c2ff;
     --ink: #111827;
     --muted: #6b7280;
     --card-bg: #ffffff;
     --ring: linear-gradient(135deg, var(--primary), var(--primary-2));
 }

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

 @media (max-width:991px) {
     #feature2 .feature-grid {
         grid-template-columns: repeat(2, 1fr);
     }
 }

 @media (max-width:640px) {
     #feature2 .feature-grid {
         grid-template-columns: 1fr;
     }
 }

 #feature2 .feature-card {
     background: var(--card-bg);
     border: 1px solid rgba(17, 24, 39, .06);
     border-radius: 18px;
     padding: 22px 20px;
     text-align: left;
     box-shadow: 0 8px 24px rgba(2, 8, 20, .06);
     transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
     position: relative;
     overflow: hidden;
 }

 #feature2 .feature-card:hover {
     transform: translateY(-3px);
     box-shadow: 0 14px 36px rgba(2, 8, 20, .10);
     border-color: rgba(17, 24, 39, .12);
 }

 #feature2 .icon-wrap {
     width: 64px;
     height: 64px;
     border-radius: 50%;
     position: relative;
     display: grid;
     place-items: center;
     margin-bottom: 14px;
 }

 #feature2 .icon-wrap .icon-ring {
     position: absolute;
     inset: 0;
     border-radius: 50%;
     padding: 2px;
     background: var(--ring);
     -webkit-mask: radial-gradient(#000 62%, transparent 63%) content-box, radial-gradient(#000 62%, transparent 63%);
     -webkit-mask-composite: xor;
     mask-composite: exclude;
 }

 #feature2 .icon-wrap img {
     width: 56px;
     height: 56px;
     display: block;
     filter: drop-shadow(0 1px 0 rgba(0, 0, 0, .04));
 }

 #feature2 .feature--content h3 {
     font-weight: 700;
     font-size: 18px;
     color: var(--ink);
     margin: 6px 0 6px;
 }

 #feature2 .feature--content p {
     color: var(--muted);
     line-height: 1.55;
     margin: 0;
 }

 #feature2 .heading--title {
     color: var(--ink);
     letter-spacing: -0.2px;
 }

 #feature2 .heading--desc {
     color: var(--muted);
 }

 #feature2 .price-inline {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     margin-right: 6px;
 }

 #feature2 .price-inline .old {
     color: #9ca3af;
     text-decoration: line-through;
     font-size: 14px;
 }

 #feature2 .price-inline .now {
     color: #059669;
     font-weight: 700;
     font-size: 15px;
 }

 #feature2 .feature-card::after {
     content: "";
     position: absolute;
     right: -40px;
     top: -40px;
     width: 160px;
     height: 160px;
     background: radial-gradient(closest-side, rgba(126, 214, 223, .12), transparent 70%);
     transform: rotate(12deg);
     pointer-events: none;
 }

 h1,
 h2,
 h3,
 h4,
 h5,
 h6,
 p,
 a,
 button {
     text-transform: none !important;
 }

 #reviews .testimonials-grid {
     display: grid;
     gap: 22px;
 }

 @media(min-width:768px) {
     #reviews .testimonials-grid {
         grid-template-columns: repeat(3, 1fr);
     }
 }

 #reviews .t-card {
     position: relative;
     background: #fff;
     border: 1px solid rgba(17, 24, 39, .08);
     border-radius: 18px;
     padding: 22px 18px 18px;
     box-shadow: 0 8px 22px rgba(2, 8, 20, .06);
     transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
     overflow: hidden;
 }

 #reviews .t-card:hover {
     transform: translateY(-3px);
     box-shadow: 0 14px 36px rgba(2, 8, 20, .10);
     border-color: rgba(17, 24, 39, .14);
 }

 #reviews .t-card::before {
     content: "";
     position: absolute;
     inset: 0 0 auto 0;
     height: 3px;
     background: linear-gradient(135deg, var(--brand, #38B6FF), #1E90FF);
 }

 #reviews .t-quote {
     position: absolute;
     top: 12px;
     left: 14px;
     font-size: 18px;
     color: rgba(56, 182, 255, .6);
 }

 #reviews .t-text p {
     margin: 8px 0 14px;
     color: #111827;
     line-height: 1.6;
     font-size: 15.5px;
 }

 #reviews .t-meta {
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: 10px;
     margin-top: 6px;
 }

 #reviews .t-author {
     font-weight: 700;
     color: #0F1220;
     font-size: 14px;
 }

 #reviews .t-stars {
     color: #F59E0B;
     font-size: 13px;
     white-space: nowrap;
 }

 #reviews h2 {
     font-size: 32px;
     margin: 0 0 10px;
 }

 #reviews .sub {
     color: var(--muted, #6B7280);
     margin: 0 0 22px;
 }

 :root {
     --brand: #38B6FF;
     --dark: #0F1220;
     --muted: #6B7280;
     --bg: #F8FAFC;
     --ok: #10B981;
     --warning: #F59E0B;
     --radius: 16px;
 }

 * {
     box-sizing: border-box
 }

 html,
 body {
     margin: 0;
     padding: 0;
     font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
     color: var(--dark);
     background: #fff;
 }

 a {
     color: var(--brand);
     text-decoration: none
 }

 img {
     max-width: 100%;
     display: block
 }

 .container {
     max-width: 1180px;
     margin: 0 auto;
     padding: 0 20px
 }

 .btn {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     height: 48px;
     padding: 0 20px;
     border-radius: 12px;
     font-weight: 600;
     border: 1px solid transparent;
     cursor: pointer
 }

 .btn.primary {
     background: var(--brand);
     color: #fff
 }

 .btn.secondary {
     background: #fff;
     color: var(--brand);
     border-color: var(--brand)
 }

 .btn.dark {
     background: var(--dark);
     color: #fff
 }

 .btn.ghost {
     background: transparent;
     color: #fff;
     border-color: rgba(255, 255, 255, .3)
 }

 .btn-lg {
     height: 56px;
     padding: 0 28px;
     border-radius: 14px;
     font-size: 16px
 }

 .chip {
     display: inline-block;
     padding: 6px 10px;
     border-radius: 999px;
     background: rgba(56, 182, 255, .12);
     color: var(--brand);
     font-weight: 600;
     font-size: 12px;
     letter-spacing: .02em
 }

 .hero {
     position: relative;
     background: radial-gradient(1200px 600px at 80% -20%, rgba(56, 182, 255, .25), transparent 60%), url('../images/bg.png') center/cover no-repeat;
 }

 .hero .row {
     display: flex;
     flex-wrap: wrap;
     align-items: center;
     gap: 40px;
     padding: 80px 0
 }

 .hero h1 {
     font-size: 44px;
     line-height: 1.05;
     margin: 10px 0 10px
 }

 .hero p.lead {
     font-size: 18px;
     color: #1f2937;
     max-width: 640px
 }

 .hero .store {
     display: flex;
     gap: 12px;
     flex-wrap: wrap;
     margin-top: 10px
 }

 .trust {
     background: var(--bg);
     border-top: 1px solid #eef2f7;
     border-bottom: 1px solid #eef2f7
 }

 .trust .row {
     display: flex;
     flex-wrap: wrap;
     gap: 16px;
     justify-content: center;
     align-items: center;
     padding: 14px 0;
     color: #111827
 }

 .section h2 {
     font-size: 32px;
     margin: 0 0 10px
 }

 .section p.sub {
     color: var(--muted);
     margin: 0
 }

 .grid {
     display: grid;
     gap: 20px
 }

 #video .video-wrapper {
     position: relative;
     width: 100%;
     max-width: 980px;
     margin: 0 auto;
     aspect-ratio: 16/9;
     border-radius: 18px;
     overflow: hidden;
 }

 #video .video-wrapper iframe {
     position: absolute;
     inset: 0;
     width: 100%;
     height: 100%;
     border: 0;
 }

 @media(max-width:768px) {
     #video {
         padding: 64px 0 !important;
     }
 }

 @media(min-width:768px) {
     .grid.cols-3 {
         grid-template-columns: repeat(3, 1fr)
     }

     .grid.cols-4 {
         grid-template-columns: repeat(4, 1fr)
     }
 }

 .card {
     border: 1px solid #eef2f7;
     border-radius: var(--radius);
     padding: 20px;
     background: #fff
 }

 .card h3 {
     margin: 6px 0 6px;
     font-size: 18px
 }

 .iconwrap {
     width: 56px;
     height: 56px;
     border: 2px solid var(--brand);
     border-radius: 50%;
     display: grid;
     place-items: center;
     margin-bottom: 12px
 }

 .two-col {
     display: grid;
     gap: 40px
 }

 @media(min-width:992px) {
     .two-col {
         grid-template-columns: 1.2fr .8fr
     }
 }

 .cta-band {
     background: linear-gradient(180deg, #38B6FF, #1E90FF);
     color: #fff;
     border-radius: 24px;
     padding: 32px
 }

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

 .list li {
     display: flex;
     gap: 10px;
     align-items: flex-start
 }

 .list .ok {
     color: var(--ok);
     font-weight: 800
 }

 .pill {
     padding: 6px 10px;
     border-radius: 999px;
     background: #EEF7FF;
     color: #0369A1;
     font-weight: 600;
     font-size: 12px;
     display: inline-flex;
     gap: 8px;
     align-items: center
 }

 .price {
     font-size: 28px;
     font-weight: 800
 }

 #hubs .card-actions {
     display: flex;
     gap: 8px;
     flex-wrap: nowrap;
 }

 #hubs .card-actions .btn {
     height: 42px;
     padding: 0 14px;
     font-size: 12px;
     border-radius: 10px;
 }

 @media (max-width:380px) {
     #hubs .card-actions {
         flex-wrap: wrap;
     }
 }

 .footer {
     background: #0B0F19;
     color: #cbd5e1
 }

 .footer a {
     color: #fff
 }

 .footer .cols {
     display: grid;
     gap: 24px
 }

 .card-actions {
     display: flex;
     gap: 10px;
     margin-top: 16px;
     flex-wrap: wrap;
 }

 .price {
     font-weight: 600;
 }

 @media(min-width:768px) {
     .footer .cols {
         grid-template-columns: 2fr 1fr 1fr
     }
 }

 @media(max-width:1024px) {
     .hero h1 {
         font-size: 36px
     }
 }

 @media(max-width:768px) {
     .hero .row {
         padding: 80px 0 56px 0
     }

     .hero h1 {
         font-size: 30px
     }

     .hero p.lead {
         font-size: 16px
     }

     .grid.cols-4 {
         grid-template-columns: 1fr
     }

     .grid.cols-3 {
         grid-template-columns: 1fr
     }

     .two-col {
         grid-template-columns: 1fr !important
     }

     .btn {
         height: 44px
     }

     .btn-lg {
         height: 50px
     }

     .store img {
         width: 140px;
         height: auto
     }
 }

 .nav-fixed {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     z-index: 9999;
     background: rgba(255, 255, 255, .78);
     backdrop-filter: saturate(180%) blur(10px);
     border-bottom: 1px solid rgba(17, 24, 39, .08);
 }

 .nav-inner {
     display: flex;
     align-items: center;
     justify-content: space-between;
     height: 64px;
 }

 .nav-logo img {
     height: 28px;
     width: auto;
     display: block;
 }

 .nav-links {
     display: flex;
     align-items: center;
     gap: 18px;
 }

 .nav-links a {
     font-weight: 600;
     font-size: 14.5px;
     color: #0F1220;
 }

 .nav-links a:hover {
     text-decoration: underline;
 }

 .nav-actions {
     display: flex;
     gap: 10px;
     margin-left: 8px;
 }

 .nav-actions .btn {
     height: 36px;
     padding: 0 14px;
     font-size: 14.5px;
     border-radius: 10px;
 }

 .nav-burger {
     display: none;
     font-size: 20px;
     color: #0F1220;
     cursor: pointer;
 }

 .nav-toggle {
     display: none;
 }

 @media (max-width:992px) {
     .nav-burger {
         display: block;
     }

     .nav-links {
         position: fixed;
         top: 64px;
         right: 0;
         left: 0;
         background: rgba(255, 255, 255, .98);
         backdrop-filter: saturate(180%) blur(8px);
         border-bottom: 1px solid rgba(17, 24, 39, .08);
         display: none;
         flex-direction: column;
         gap: 12px;
         padding: 14px 20px 16px;
     }

     .nav-actions {
         width: 100%;
         justify-content: stretch;
     }

     .nav-actions .btn {
         flex: 1;
         height: 40px;
         font-size: 15px;
     }

     .nav-toggle:checked~.nav-links {
         display: flex;
     }
 }

 #slider,
 .hero {
     margin-top: 64px;
 }

 #footer {
     background: #fff;
     color: #2c2c2c;
     padding: 36px 0 28px;
 }

 #footer .container {
     max-width: 1140px;
     margin: 0 auto;
     padding: 0 20px;
 }

 #footer .footer-top {
     display: grid;
     gap: 18px;
     align-items: center;
     grid-template-columns: 1fr;
 }

 @media(min-width:992px) {
     #footer .footer-top {
         grid-template-columns: 1.1fr 1fr auto;
     }
 }

 #footer .f-logo {
     height: 28px;
     width: auto;
     display: block;
 }

 #footer .f-tag {
     margin: 8px 0 0;
     color: #6B7280;
     font-size: 14px;
 }

 #footer .f-nav {
     display: flex;
     flex-wrap: wrap;
     gap: 12px 16px;
     justify-content: center;
 }

 @media(min-width:992px) {
     #footer .f-nav {
         justify-content: flex-start;
     }
 }

 #footer .f-nav a {
     font-weight: 600;
     font-size: 14.5px;
     color: #0F1220;
 }

 #footer .f-nav a:hover {
     text-decoration: underline;
 }

 #footer .f-social {
     display: flex;
     gap: 12px;
     justify-content: center;
 }

 #footer .f-social a {
     width: 36px;
     height: 36px;
     border-radius: 10px;
     display: grid;
     place-items: center;
     background: #F3F4F6;
     color: #0F1220;
     transition: transform .15s ease, background .15s ease, box-shadow .15s ease;
 }

 #footer .f-social a:hover {
     transform: translateY(-1px);
     background: #E5E7EB;
     box-shadow: 0 6px 14px rgba(2, 8, 20, .08);
 }

 #footer .f-sep {
     border: 0;
     border-top: 1px solid rgba(17, 24, 39, .08);
     margin: 18px 0;
 }

 #footer .footer-mid {
     display: flex;
     flex-direction: column;
     gap: 14px;
     align-items: center;
     text-align: center;
 }

 @media(min-width:768px) {
     #footer .footer-mid {
         flex-direction: row;
         justify-content: space-between;
         text-align: left;
         align-items: flex-start;
     }
 }

 #footer .f-address {
     font-style: normal;
     line-height: 1.6;
     color: #374151;
     font-size: 14px;
 }

 #footer .f-legal {
     display: flex;
     gap: 16px;
     flex-wrap: wrap;
 }

 #footer .f-legal a {
     color: #0F1220;
     font-size: 14px;
 }

 #footer .f-legal a:hover {
     text-decoration: underline;
 }

 #footer .footer-bottom {
     margin-top: 18px;
     text-align: center;
 }

 #footer .f-copy {
     margin: 0;
     font-size: 13.5px;
     color: #6B7280;
 }

 #footer .f-copy a {
     color: #38B6FF;
 }

 #footer .f-copy .fa-heart {
     color: #EF4444;
 }

 .feature--icon2 {
     width: 60px;
     height: 60px;
     border-radius: 50%;
     background-color: transparent;
     border: 2px solid #00bfff;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: background-color 0.3s ease, color 0.3s ease;
     color: #00bfff;
 }

 .feature--icon2 .icon-svg {
     width: 60px;
     height: 60px;
     fill: currentColor;
 }

 .feature--icon2:hover {
     background-color: #ffffff;
     color: #fff !important;
 }

 .pricing-grid {
     display: grid;
     gap: 18px;
     grid-template-columns: 1fr 1fr
 }

 .price-card {
     position: relative;
     border-radius: 18px;
     padding: 24px 20px;
     box-shadow: 0 8px 24px rgba(2, 8, 20, .06);
     border: 1px solid rgba(17, 24, 39, .08);
     background: #fff;
     display: flex;
     flex-direction: column;
     gap: 14px
 }

 .price-head h3 {
     font-weight: 800
 }

 .price-hero {
     display: flex;
     align-items: baseline;
     gap: 4px
 }

 .price-hero .currency {
     font-weight: 800;
     font-size: 18px;
     opacity: .9
 }

 .price-hero .value {
     font-weight: 900;
     font-size: 44px;
     line-height: 1
 }

 .price-hero .period {
     font-weight: 700;
     opacity: .8
 }

 .price-list {
     gap: 8px
 }

 .price-list i {
     margin-right: 6px
 }

 .price-card--plus {
     background: linear-gradient(180deg, var(--brand), var(--brand-2));
     color: #fff;
     border-color: transparent
 }

 .price-card--plus .sub {
     color: rgba(255, 255, 255, .92)
 }

 .price-card--plus .price-hero .currency,
 .price-card--plus .price-hero .value,
 .price-card--plus .price-hero .period {
     color: #fff
 }

 .price-card--plus .price-list i {
     color: #fff
 }

 .price-card--plus .btn.primary {
     background: #fff;
     color: #38B6FF;
     border-color: #fff
 }

 .badge-hot {
     position: absolute;
     top: 14px;
     right: 14px;
     background: #fff;
     color: #38B6FF;
     font-weight: 800;
     border-radius: 999px;
     padding: 6px 10px;
     font-size: 12px;
     box-shadow: 0 6px 16px rgba(0, 0, 0, .12)
 }

 .price-card--free .btn.secondary {
     color: var(--primary);
     border-color: var(--primary)
 }

 @media(max-width:992px) {
     .pricing-grid {
         grid-template-columns: 1fr
     }
 }

 #hero .container,
 #hero .row,
 #hero .col-lg-6 {
     position: relative;
     z-index: 1;
 }

 #hero h1 {
     font-size: 44px;
     font-weight: 900;
     line-height: 1.1;
     color: #fff;
 }

 #hero p {
     font-size: 18px;
     margin-top: 14px;
     max-width: 540px;
     color: #fff;
 }

 #site-nav.nav-fixed {
     position: fixed;
     inset: 0 0 auto 0;
     z-index: 10000;
     background: #fff !important;
     backdrop-filter: none !important;
     border-bottom: 1px solid rgba(17, 24, 39, .08);
 }

 @media(max-width:992px) {
     .nav-links {
         background: #fff !important;
     }
 }

 .pricing-grid {
     display: grid;
     gap: 24px;
     grid-template-columns: 1fr 1fr;
     max-width: 960px;
     margin: 0 auto;
 }

 .price-card {
     border-radius: 18px;
     padding: 28px 24px;
     box-shadow: 0 8px 24px rgba(2, 8, 20, .08);
     display: flex;
     flex-direction: column;
     gap: 18px;
     position: relative;
 }

 .price-head h3 {
     font-weight: 800;
     margin: 0
 }

 .price-head .sub {
     margin: 4px 0 0
 }

 .price-hero {
     display: flex;
     align-items: baseline;
     gap: 6px
 }

 .price-hero .currency {
     font-size: 22px;
     font-weight: 800;
     line-height: 1
 }

 .price-hero .value {
     font-size: 48px;
     font-weight: 900;
     line-height: 1
 }

 .price-hero .period {
     font-size: 16px;
     font-weight: 700;
     opacity: .9
 }

 .price-list {
     list-style: none;
     padding: 0;
     margin: 6px 0 0;
     display: grid;
     gap: 10px
 }

 .price-list li {
     display: flex;
     align-items: center;
     gap: 10px
 }

 .price-list i {
     font-size: 18px
 }

 .btn-pill {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     height: 44px;
     padding: 0 22px;
     border-radius: 999px;
     font-weight: 800;
     text-decoration: none;
     border: 1px solid transparent;
     margin-top: 10px;
 }

 .price-free {
     background: #fff;
     color: #0F1220;
     border: 1px solid rgba(17, 24, 39, .06);
 }

 .price-free .price-list i {
     color: var(--brand);
 }

 .btn-dark {
     background: #38B6FF;
     color: #fff;
 }

 .btn-dark:hover {
     opacity: .9
 }

 .price-plus {
     background: #38B6FF;
     color: #fff;
     border: 1px solid rgba(255, 255, 255, .08);
 }

 .price-plus .sub {
     color: rgba(255, 255, 255, .9)
 }

 .price-plus .price-list i {
     color: #fff;
 }

 .btn-light {
     background: #fff;
     color: #0F1220;
 }

 .btn-light:hover {
     opacity: .9
 }

 .price-note {
     margin-top: -6px
 }

 .price-note .was {
     text-decoration: line-through;
     opacity: .85;
 }

 .price-hero .currency {
     font-size: 22px;
     font-weight: 800;
 }

 .price-hero .value {
     font-size: 90px;
     font-weight: 900;
     line-height: 1;
 }

 .price-hero .period {
     font-size: 18px;
     font-weight: 700;
 }

 .price-note .was {
     text-decoration: line-through;
     opacity: .85;
 }

 .badge-hot {
     position: absolute;
     top: 16px;
     right: 16px;
     background: #fff;
     color: #0F1220;
     font-weight: 800;
     font-size: 12px;
     border-radius: 999px;
     padding: 6px 12px;
 }

 .price-card {
     box-shadow: 0 10px 24px rgba(31, 41, 55, .12);
 }

 @media(max-width:768px) {
     .pricing-grid {
         grid-template-columns: 1fr
     }

     .price-hero .value {
         font-size: 80px
     }
 }

 #hero-franquia {
     position: relative;
     background: url('../images/bg.png') center/cover no-repeat;
     color: #fff;
     margin-top: 64px;
 }

 #hero-franquia::before {
     content: "";
     position: absolute;
     inset: 0;
     background: linear-gradient(135deg, rgba(56, 182, 255, .92), rgba(30, 144, 255, .92));
 }

 #hero-franquia .container,
 #hero-franquia .row,
 #hero-franquia .col-lg-6 {
     position: relative;
     z-index: 1;
 }

 #como-funciona .section-header h2 {
     font-weight: 800;
     margin-bottom: 12px;
 }

 #como-funciona .section-header p {
     font-size: 16px;
     line-height: 1.6;
 }

 .feature-card .icon-wrap {
     width: 56px;
     height: 56px;
     border-radius: 14px;
     display: grid;
     place-items: center;
     background: #EEF7FF;
     border: 1px solid rgba(17, 24, 39, .08);
     color: var(--brand);
     box-shadow: 0 6px 16px rgba(2, 8, 20, .06);
     margin-bottom: 10px;
 }

 .feature-card .icon-wrap i {
     font-size: 24px;
     line-height: 1;
 }

 .feature-grid {
     display: grid;
     gap: 16px;
     grid-template-columns: repeat(3, 1fr);
 }

 .feature-card {
     background: #fff;
     border: 1px solid rgba(17, 24, 39, .08);
     border-radius: 16px;
     padding: 18px;
     box-shadow: 0 8px 22px rgba(2, 8, 20, .06);
 }

 @media(max-width:992px) {
     .feature-grid {
         grid-template-columns: 1fr 1fr;
     }
 }

 @media(max-width:600px) {
     .feature-grid {
         grid-template-columns: 1fr;
     }
 }

 #niveis .section-header {
     margin-bottom: 18px;
 }

 #niveis .section-header h2 {
     font-weight: 900;
     margin: 0 0 6px;
 }

 #niveis .section-header p {
     margin: 0 auto;
 }

 .levels-grid {
     display: grid;
     gap: 18px;
     grid-template-columns: repeat(3, 1fr);
     align-items: stretch;
 }

 .level-card {
     background: #fff;
     border: 1px solid rgba(17, 24, 39, .08);
     border-radius: 16px;
     padding: 18px;
     display: flex;
     flex-direction: column;
     box-shadow: 0 8px 20px rgba(2, 8, 20, .06);
 }

 .level-head {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 10px;
 }

 .level-title {
     display: flex;
     align-items: center;
     gap: 10px;
 }

 .level-title h3 {
     margin: 0;
     font-size: 20px;
     font-weight: 800;
 }

 .level-title .sub {
     margin: 0;
 }

 .level-icon {
     width: 42px;
     height: 42px;
     border-radius: 50%;
     display: grid;
     place-items: center;
     background: #EEF7FF;
     color: var(--brand);
     box-shadow: inset 0 0 0 2px rgba(56, 182, 255, .30);
 }

 .chip {
     border-radius: 999px;
     padding: 6px 10px;
     font-size: 12px;
     font-weight: 800;
     background: #F3F4F6;
 }

 .level-body {
     display: grid;
     gap: 12px;
     margin-top: 6px;
 }

 .metrics {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 10px;
 }

 .label {
     display: block;
     font-size: 12px;
     color: #6B7280;
     margin-bottom: 6px;
 }

 .pill-metric {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     min-width: 84px;
     height: 34px;
     padding: 0 10px;
     border-radius: 999px;
     background: #F9FAFB;
     border: 1px solid rgba(17, 24, 39, .08);
     font-weight: 800;
 }

 .range {
     display: grid;
     grid-template-columns: auto 1fr auto;
     gap: 8px;
     align-items: center;
 }

 .range-bar {
     height: 8px;
     border-radius: 999px;
     overflow: hidden;
     background: #E5E7EB;
     position: relative;
 }

 .range-fill {
     position: absolute;
     inset: 0 auto 0 0;
     width: 0;
     background: linear-gradient(90deg, var(--brand), var(--brand-2));
 }

 .hint {
     margin: 2px 0 0;
 }

 #niveis .rules.card {
     border: 1px solid rgba(17, 24, 39, .08);
     border-radius: 16px;
     padding: 16px 18px;
     box-shadow: 0 6px 16px rgba(2, 8, 20, .06);
 }

 #niveis .rules h3 {
     margin: 0 0 10px;
     font-weight: 800;
 }

 #niveis .rules .list {
     margin: 0;
 }

 #niveis .rules .list li {
     padding: 4px 0;
 }

 @media (max-width:992px) {
     .levels-grid {
         grid-template-columns: 1fr;
     }

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

 @media (max-width:540px) {
     .metrics {
         grid-template-columns: 1fr;
     }
 }

 .simu-grid {
     display: grid;
     gap: 18px;
     grid-template-columns: 1.1fr 1.4fr;
 }

 .simu-panel {
     background: #fff;
     border: 1px solid rgba(17, 24, 39, .08);
     border-radius: 16px;
     padding: 16px;
     box-shadow: 0 8px 20px rgba(2, 8, 20, .06);
 }

 .simu-results {
     display: grid;
     gap: 14px;
     align-content: start;
 }

 .kpi {
     background: #fff;
     border: 1px solid rgba(17, 24, 39, .08);
     border-radius: 16px;
     padding: 16px;
     box-shadow: 0 8px 20px rgba(2, 8, 20, .06);
     position: relative;
 }

 .kpi-label {
     display: block;
     font-size: 13px;
     color: #6B7280;
     margin-bottom: 6px;
 }

 .kpi-value {
     font-size: 28px;
     font-weight: 900;
 }

 .kpi-chip {
     position: absolute;
     top: 14px;
     right: 14px;
     background: #E6F4FF;
     color: #0F1220;
     border-radius: 999px;
     padding: 4px 10px;
     font-size: 12px;
     font-weight: 800;
 }

 .note.card {
     border: 1px solid rgba(17, 24, 39, .08);
     border-radius: 16px;
     padding: 14px;
     box-shadow: 0 8px 20px rgba(2, 8, 20, .06);
 }

 .range-scale {
     display: grid;
     grid-template-columns: auto 1fr auto;
     align-items: center;
     gap: 10px;
     margin-top: 4px;
 }

 .range-bar {
     position: relative;
     height: 8px;
     border-radius: 999px;
     background: #E5E7EB;
     overflow: hidden;
 }

 .range-bar #fill {
     position: absolute;
     inset: 0 auto 0 0;
     background: linear-gradient(90deg, var(--brand), var(--brand-2));
 }

 .prog-bar {
     position: relative;
     height: 8px;
     border-radius: 999px;
     background: #E5E7EB;
     flex: 1;
     overflow: hidden;
 }

 .prog-bar #progFill {
     position: absolute;
     inset: 0 auto 0 0;
     background: linear-gradient(90deg, var(--brand), var(--brand-2));
 }

 @media (max-width:992px) {
     .simu-grid {
         grid-template-columns: 1fr;
     }
 }

 .achad-card {
     background: #fff;
     border: 1px solid rgba(17, 24, 39, .08);
     border-radius: 20px;
     padding: 22px;
     box-shadow: 0 10px 26px rgba(2, 8, 20, .06);
     overflow: hidden;
 }

 .achad-eyebrow {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     font-weight: 800;
     font-size: 12px;
     padding: 6px 10px;
     border-radius: 999px;
     background: linear-gradient(135deg, var(--brand), var(--brand-2));
     color: #fff;
 }

 .achad-desc {
     max-width: 620px;
 }

 .achad-bullets {
     list-style: none;
     padding: 0;
     margin: 12px 0 0;
     display: grid;
     gap: 8px;
 }

 .achad-bullets li {
     display: flex;
     align-items: center;
     gap: 8px;
     color: #374151;
     font-size: 15px;
 }

 .achad-bullets i {
     color: var(--brand);
 }

 .achad-cta {
     display: flex;
     flex-wrap: wrap;
     gap: 10px;
 }

 .achad-trust {
     display: flex;
     flex-wrap: wrap;
     gap: 14px;
     margin-top: 14px;
     color: #6B7280;
     font-size: 13px;
 }

 .achad-trust i {
     color: var(--brand);
     margin-right: 6px;
 }

 .achad-image {
     position: relative;
     border-radius: 16px;
     padding: 12px;
 }

 .achad-image img {
     display: block;
     width: 100%;
     height: auto;
     border-radius: 12px;
     filter: drop-shadow(0 10px 24px rgba(0, 0, 0, .10));
 }

 @media (max-width:992px) {
     .achad-card {
         padding: 18px;
     }

     .achad-cta .btn {
         flex: 1;
     }
 }

 @media (max-width:600px) {
     .achad-trust {
         gap: 10px;
     }
 }

 .btn-big-text {
     font-size: 13px;
     font-weight: 700;
 }

 @media (max-width:768px) {
     #hero .row {
         flex-direction: column;
         text-align: center;
     }

     #hero .col-lg-6 {
         width: 100%;
     }

     #hero h1 {
         font-size: 32px;
         line-height: 1.2;
     }

     #hero p {
         font-size: 18px;
         margin-left: auto;
         margin-right: auto;
     }

     #hero .d-flex {
         justify-content: center;
         flex-wrap: wrap;
         gap: 12px;
     }

     #hero .btn {
         font-size: 18px;
         padding: 14px 28px;
     }

     #hero img {
         margin: 24px auto 0;
         max-width: 85%;
         display: block;
     }
 }

 .partners-wrap {
     background: #fff;
     border: 1px solid rgba(17, 24, 39, .08);
     border-radius: 16px;
     box-shadow: 0 10px 24px rgba(2, 8, 20, .06);
     overflow: hidden;
     padding: 0;
 }

 .partners-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
 }

 .partner {
     text-align: center;
     padding: 28px 16px;
     border: 1px solid rgba(17, 24, 39, .06);
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
 }

 .partner .logo {
     width: 64px;
     height: 64px;
     object-fit: contain;
     display: block;
     margin: 0 auto 12px;
     background: #fff;
     border-radius: 14px;
     padding: 8px;
     box-shadow: 0 6px 16px rgba(2, 8, 20, .06);
 }

 .partner .name {
     font-weight: 600;
     margin: 0 0 6px;
 }

 .partner .cashback {
     margin: 0;
     font-size: 16px;
     font-weight: 700;
     color: #0F1220;
 }

 .partners-sec .partners-cta {
     display: flex;
     justify-content: center;
     margin-top: 18px;
 }

 .partners-sec .partners-more {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     gap: 8px;
     padding: 14px 22px;
     border-radius: 999px;
     background: #fff;
     color: #0F1220;
     font-weight: 800;
     border: 1px solid rgba(17, 24, 39, .12);
     box-shadow: 0 10px 24px rgba(2, 8, 20, .08);
     text-decoration: none;
     transition: .2s ease;
 }

 .partners-sec .partners-more:hover {
     transform: translateY(-2px);
     box-shadow: 0 14px 30px rgba(2, 8, 20, .12);
 }

 @media (max-width:992px) {
     .partners-grid {
         grid-template-columns: repeat(2, 1fr);
     }
 }

 @media (max-width:540px) {
     .partners-grid {
         grid-template-columns: 1fr;
     }
 }

 /* ====== CSS MIGRADO DOS HTMLS (escopado por página) ====== */
 /* ==== MOVED FROM index.html ==== */
 .page-index .partners-grid {
     display: grid;
     grid-template-columns: repeat(2, 1fr);

 }

 @media (min-width: 768px) {
     .page-index .partners-grid {
         grid-template-columns: repeat(4, 1fr);
     }
 }

 /* ==== MOVED FROM index.html ==== */
 @media (max-width: 767px) {
     .page-index

     /* garante respiro lateral e evita clipping em aparelhos com notch */
     #hubs .container {
         padding-left: max(16px, env(safe-area-inset-left));
         padding-right: max(16px, env(safe-area-inset-right));
         overflow: visible;
     }

     .page-index

     /* força 1 coluna e espaçamento consistente */
     #hubs .grid.cols-3 {
         display: grid;
         grid-template-columns: 1fr;
         gap: 16px;
     }

     .page-index

     /* cada card ocupa 100% até um limite,.page-index sempre centralizado */
     #hubs .card {
         width: min(100%, 640px);
         /* limite opcional pra não “estourar” em phablets */
         margin-inline: auto;
         /* centraliza dentro da coluna */
         box-sizing: border-box;
         /* evita overflow por padding */
         overflow: visible;
         /* não corta sombra/borda arredondada */
         border-radius: 16px;
         box-shadow: 0 10px 24px rgba(16, 24, 40, .08);
     }

     .page-index

     /* textos mais uniformes e sem quebra estranha */
     #hubs .card h3 {
         font-size: 18px;
         line-height: 1.25;
         margin: 10px 0 6px;
         text-wrap: balance;
     }

     .page-index

     /* botões responsivos e centralizados */
     #hubs .card-actions {
         display: flex;
         gap: 10px;
         flex-wrap: wrap;
         justify-content: center;
     }

     .page-index #hubs .card-actions .btn {
         flex: 1 1 160px;
         /* cresce/encolhe e evita sair da margem */
         max-width: 220px;
         /* opcional pra não ficar gigante */
         text-align: center;
     }
 }

 /* ==== MOVED FROM index.html ==== */
 .page-index #footer .f-nav {
     width: 100%;
     display: flex;
     justify-content: flex-end;
     /* cola tudo à direita */
     align-items: center;
     gap: 28px;
     /* define o espaçamento entre links */
     flex-wrap: nowrap;
     /* impede quebra de linha */
 }

 @media (max-width: 767px) {
     .page-index #footer .footer-top {
         flex-direction: column;
         align-items: center;
         text-align: center;
     }

     .page-index #footer .f-brand {
         margin-bottom: 16px;
     }

     .page-index #footer .f-logo {
         height: 28px;
         margin: 0 auto 8px;
     }

     .page-index #footer .f-tag {
         font-size: 14px;
     }

     .page-index

     /* nav: 5 colunas em linha única,.page-index equidistantes */
     #footer .f-nav {
         width: 100%;
         display: flex;
         justify-content: space-between;
         /* distribui igualmente */
         align-items: right;
         gap: 0;
         /* sem gap extra */
         flex-wrap: nowrap;
         /* impede quebra de linha */
     }

     .page-index #footer .f-nav a {
         color: #0F1220;
         text-decoration: none;
         font-size: 14px;
         white-space: nowrap;
         /* impede quebra em "Criar conta" */
     }

     .page-index #footer .footer-mid {
         flex-direction: column;
         text-align: center;
         gap: 12px;
         margin-top: 12px;
     }

     .page-index #footer .f-legal {
         justify-content: center;
         gap: 12px;
         flex-wrap: wrap;
     }

     .page-index #footer .f-legal a {
         color: #0F1220;
         text-decoration: none;
         font-size: 14px;
         padding: 4px 0;
     }

     .page-index .f-sep {
         margin: 16px 0;
     }
 }

 

 .row-flex-center {
     display: flex;
     flex-wrap: wrap;
     align-items: center;
 }

 .cta-inline {
     margin-top: 30px;
     display: flex;
     justify-content: flex-start;
     gap: 20px;
 }

 .hero-image {
     display: block;
     width: 100%;
     max-width: 640px;
     height: auto;
     filter: drop-shadow(0 8px 20px rgba(0, 0, 0, .25));
     padding-top: 10px;
     margin: 0 auto;
 }

 /* ==== MOVED FROM dvolveplus.html ==== */
 @media (max-width: 767px) {
     
 }

 /* ==== MOVED FROM dvolveplus.html ==== */
 .page-dvolveplus

 /* ==== Acessibilidade para título oculto ==== */
 .visually-hidden {
     position: absolute !important;
     width: 1px;
     height: 1px;
     margin: -1px;
     padding: 0;
     border: 0;
     overflow: hidden;
     clip: rect(0 0 0 0);
     white-space: nowrap;
 }

 .page-dvolveplus

 /* ==== Cards (mantém teu visual) ==== */
 .payoff-card {
     background: #fff;
     color: #0F1220;
     border: 1px solid #E5E7EB;
     border-radius: 20px;
     padding: 22px 18px;
     text-align: center;
     box-shadow: 0 10px 24px rgba(16, 24, 40, .06);
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 10px;
 }

 .page-dvolveplus .brand-logo-wrap {
     width: 100%;
     max-width: 220px;
     border-radius: 16px;
     border: 2px dashed #E5E7EB;
     background: #fff;
     padding: 8px;
     box-shadow: 0 4px 12px rgba(56, 182, 255, .12);
 }

 .page-dvolveplus .brand-logo-list {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 10px 14px;
     flex-wrap: wrap;
 }

 .page-dvolveplus .brand-logo-list img {
     width: 56px;
     height: 56px;
     object-fit: contain;
     filter: saturate(.9);
 }

 .page-dvolveplus .benefit-title {
     font-size: 18px;
     font-weight: 800;
     margin: 6px 0 0;
     line-height: 1.3;
 }

 .page-dvolveplus .pc-number {
     font-size: 34px;
     font-weight: 800;
     color: #38B6FF;
     margin: 0 0 4px;
 }

 .page-dvolveplus .benefit-text {
     font-size: 14px;
     color: #374151;
     margin: 0;
 }

 .page-dvolveplus .save-inline strong {
     white-space: nowrap;
 }

 .page-dvolveplus .note {
     font-size: 12px;
     color: #6B7280;
     margin-top: 4px;
 }

 .page-dvolveplus

 /* ==== Grid desktop/tablet ==== */
 .payoff-grid {
     display: grid;
     gap: 20px;
     grid-template-columns: repeat(4, 1fr);
 }

 @media (max-width:1199px) {
     .page-dvolveplus .payoff-grid {
         grid-template-columns: repeat(2, 1fr);
     }
 }

 .page-dvolveplus

 /* ==== Mobile-only image ==== */
 .mobile-only-img {
     display: none;
     width: 100%;
     margin-top: 24px;
     text-align: center;
 }

 .page-dvolveplus .mobile-only-img img {
     max-width: 320px;
     width: 80%;
     height: auto;
     margin: 0 auto;
     display: block;
 }

 @media (max-width:767px) {
     .page-dvolveplus .mobile-only-img {
         display: block;
     }
 }

 @media (max-width:767px) {
     .page-dvolveplus .payoff-slider {
         position: relative;
     }

     .page-dvolveplus .payoff-grid {
         display: flex;
         gap: 12px;
         overflow-x: auto;
         overscroll-behavior-x: contain;
         scroll-snap-type: x mandatory;
         -webkit-overflow-scrolling: touch;
         padding: 4px 16px 8px;
         scrollbar-width: none;
         -ms-overflow-style: none;
         mask-image: linear-gradient(90deg, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%);
     }

     .page-dvolveplus .payoff-grid::-webkit-scrollbar {
         display: none;
     }

     .page-dvolveplus .payoff-card {
         scroll-snap-align: center;
         flex: 0 0 calc(100% - 48px);
         box-shadow: none;
         border-radius: 18px;
     }

     .page-dvolveplus .ps-arrow {
         position: absolute;
         top: 44%;
         transform: translateY(-50%);
         width: 36px;
         height: 36px;
         border-radius: 999px;
         border: 1px solid #E5E7EB;
         background: #fff;
         color: #0F1220;
         display: flex;
         align-items: center;
         justify-content: center;
         font-weight: 700;
         font-size: 18px;
         z-index: 3;
         box-shadow: 0 6px 16px rgba(0, 0, 0, .08);
     }

     .page-dvolveplus .ps-prev {
         left: 2px;
     }

     .page-dvolveplus .ps-next {
         right: 2px;
     }

     .page-dvolveplus .ps-dots {
         display: flex;
         gap: 6px;
         justify-content: center;
         margin-top: 10px;
     }

     .page-dvolveplus .ps-dots button {
         width: 8px;
         height: 8px;
         border-radius: 999px;
         border: 0;
         background: #D1D5DB;
         padding: 0;
     }

     .page-dvolveplus .ps-dots button[aria-current="true"] {
         background: #38B6FF;
         width: 22px;
         border-radius: 999px;
         transition: width .2s;
     }
 }

 @media (min-width:768px) {
     .page-dvolveplus .ps-arrow {
         display: none !important;
     }
 }

 .page-dvolveplus

 /* ==== Painel-equação (mesmo look dos cards) ==== */
 .payoff-equation {
     margin-top: 28px;
     background: #fff;
     color: #0F1220;
     border: 1px solid #E5E7EB;
     border-radius: 20px;
     padding: 22px 18px;
     box-shadow: 0 10px 24px rgba(16, 24, 40, .06);
 }

 .page-dvolveplus .eq-wrap {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 12px;
     flex-wrap: wrap;
     text-align: center;
 }

 .page-dvolveplus

 /* chips tipo “mini-card” */
 .eq-chip {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     background: #fff;
     color: #0F1220;
     border: 1px solid #E5E7EB;
     border-radius: 999px;
     padding: 10px 14px;
     font-size: 16px;
     line-height: 1;
     font-weight: 700;
     box-shadow: 0 4px 12px rgba(16, 24, 40, .04);
 }

 .page-dvolveplus .eq-chip b {
     font-weight: 800;
     color: #0F1220;
 }

 .page-dvolveplus .eq-chip i {
     font-style: normal;
     color: #38B6FF;
 }

 .page-dvolveplus

 /* valores em azul */
 .eq-sign {
     font-weight: 900;
     font-size: 20px;
     letter-spacing: .5px;
     color: #6B7280;
 }

 .page-dvolveplus

 /* total com borda azul e valor em azul */
 .eq-total {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     background: #fff;
     color: #0F1220;
     border: 2px solid #38B6FF;
     border-radius: 14px;
     padding: 12px 18px;
     font-size: 20px;
     font-weight: 900;
     box-shadow: 0 6px 16px rgba(56, 182, 255, .12);
 }

 .page-dvolveplus .eq-total .eq-value {
     color: #38B6FF;
 }

 .page-dvolveplus .eq-badge {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     background: #ECFDF5;
     color: #065F46;
     border: 1px solid #A7F3D0;
     font-weight: 800;
     padding: 6px 10px;
     border-radius: 999px;
     font-size: 13px;
 }

 .page-dvolveplus .eq-note {
     margin-top: 10px;
     font-size: 12px;
     color: #6B7280;
     text-align: center;
 }

 .page-dvolveplus .eq-note2 {
     margin-top: 10px;
     font-size: 16px;
     font-weight: bold;
     color: #000;
     text-align: center;
     margin-bottom: 0px !important;
 }

 @media (max-width: 767px) {
     .page-dvolveplus .payoff-equation {
         box-shadow: none;
         margin-left: 16px;
         margin-right: 16px;
         margin-top: 16px;
         padding: 18px 18px;
         border-radius: 16px;
         text-align: center;
         /* centraliza tudo */
     }

     .page-dvolveplus .eq-wrap {
         flex-direction: column;
         /* força quebra vertical */
         align-items: center;
         /* centraliza horizontalmente */
         justify-content: center;
         gap: 10px;
         /* mais respiro entre linhas */
     }

     .page-dvolveplus .eq-chip {
         font-size: 14px;
         padding: 12px 12px;
         flex-wrap: wrap;
         justify-content: center;
     }

     .page-dvolveplus .eq-sign {
         display: none;
         /* esconde os sinais no mobile para não poluir */
     }

     .page-dvolveplus .eq-total {
         font-size: 18px;
         padding: 14px 14px;
         margin-top: 4px;
         display: inline-flex;
         justify-content: center;
     }

     .page-dvolveplus .eq-note {
         margin-top: 24px !important;
         /* reduz o espaço acima */
         padding: 0 !important;
         /* remove qualquer padding herdado */
         line-height: 1.3;
         text-align: center;
         margin-bottom: 0px !important;
     }

     .page-dvolveplus .eq-note2 {
         margin-top: 24px !important;
         /* reduz o espaço acima */
         padding: 0 !important;
         /* remove qualquer padding herdado */
         line-height: 1.3;
         text-align: center;
         margin-bottom: 16px !important;
     }
 }

 /* ==== MOVED FROM dvolveplus.html ==== */
 .page-dvolveplus .partners-grid {
     display: grid;
     grid-template-columns: repeat(2, 1fr);

 }

 @media (min-width: 768px) {
     .page-dvolveplus .partners-grid {
         grid-template-columns: repeat(4, 1fr);
     }
 }

 /* ==== MOVED FROM dvolveplus.html ==== */
 .page-dvolveplus
 /* ===== Seção: Simplicidade ===== */

 .hiw-grid.simple {
     display: grid;
     grid-template-columns: 0.9fr 1fr;
     gap: 36px;
     align-items: center;
 }

 .page-dvolveplus .tutorialimg.no-bg {
     background: transparent;
     border: 0;
     box-shadow: none;
 }

 .page-dvolveplus .tutorialimg.no-bg img {
     display: block;
     width: 85%;
     /* imagem mais enxuta */
     height: auto;
     margin: 0 auto;
     max-width: 380px;
     /* trava pra não ficar gigante em telas largas */
 }

 .page-dvolveplus .hiw-content {
     display: flex;
     flex-direction: column;
     gap: 20px;
 }

 .page-dvolveplus .hiw-list {
     list-style: none;
     margin: 0;
     padding: 0;
     display: flex;
     flex-direction: column;
     gap: 18px;
 }

 .page-dvolveplus .hiw-list li {
     display: flex;
     align-items: flex-start;
     gap: 12px;
 }

 .page-dvolveplus .hiw-icon {
     font-size: 24px;
     flex-shrink: 0;
     width: 36px;
     height: 36px;
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .page-dvolveplus .hiw-title {
     margin: 0 0 2px;
     font-size: 20px;
     font-weight: 800;
     color: #0F1220;
     line-height: 1.3;
 }

 .page-dvolveplus .hiw-text {
     margin: 0;
     font-size: 15px;
     color: #374151;
     line-height: 1.5;
 }

 .page-dvolveplus

 /* CTA */
 .hiw-cta {
     margin-top: 8px;
     display: flex;
     flex-wrap: wrap;
     gap: 10px 12px;
     align-items: center;
 }

 .page-dvolveplus .hiw-cta .btn {
     border-radius: 12px;
     padding: 10px 14px;
 }

 .page-dvolveplus .hiw-cta .btn.btn--secondary {
     background: #fff;
     color: #0F1220;
     border: 1px solid #E5E7EB;
 }

 .page-dvolveplus .hiw-note {
     margin: 4px 0 0;
     font-size: 12px;
     color: #6B7280;
 }

 @media (max-width:991px) {
     .page-dvolveplus .hiw-grid.simple {
         grid-template-columns: 1fr;
         gap: 24px;
         text-align: center;
     }

     .page-dvolveplus .tutorialimg.no-bg img {
         max-width: 280px;
         margin-top: 24px;
         margin-bottom: 24px;

     }

     .page-dvolveplus .hiw-list li {
         justify-content: center;
         text-align: left;
         max-width: 400px;
         margin: 0 auto;
     }
 }

 @media (max-width:767px) {
     .page-dvolveplus .hiw-title {
         font-size: 18px;
     }

     .page-dvolveplus .hiw-text {
         font-size: 14px;
     }

     .page-dvolveplus .hiw-icon {
         font-size: 20px;
         width: 34px;
         height: 34px;
     }

     .page-dvolveplus .hiw-cta {
         justify-content: center;
     }

     .page-dvolveplus .hiw-note {
         text-align: center;
     }
 }

 /* ==== MOVED FROM dvolveplus.html ==== */
 .page-dvolveplus

 /* Comparativo: centralizar cards e ajustar no mobile */
 #comparativo-card .pricing-grid {
     display: grid;
     grid-template-columns: repeat(2, minmax(280px, 1fr));
     gap: 24px;
     justify-content: center;
     /* mantém a grade centralizada */
     align-items: stretch;
 }

 .page-dvolveplus #comparativo-card .price-card {
     width: 100%;
     max-width: 420px;
     /* evita card “largo demais” e ajuda a centralizar */
     margin-inline: auto;
     /* garante centralização mesmo se a grid virar 1 col */
     float: none;
     /* caso algum tema use float */
 }

 @media (max-width: 768px) {
     .page-dvolveplus #comparativo-card .pricing-grid {
         grid-template-columns: minmax(280px, 1fr);
         /* 1 coluna no mobile */
         justify-content: center;
         /* força centro */
     }
 }

 /* ==== MOVED FROM dvolveplus.html ==== */
 .page-dvolveplus #footer .f-nav {
     width: 100%;
     display: flex;
     justify-content: flex-end;
     /* cola tudo à direita */
     align-items: center;
     gap: 28px;
     /* define o espaçamento entre links */
     flex-wrap: nowrap;
     /* impede quebra de linha */
 }

 @media (max-width: 767px) {
     .page-dvolveplus #footer .footer-top {
         flex-direction: column;
         align-items: center;
         text-align: center;
     }

     .page-dvolveplus #footer .f-brand {
         margin-bottom: 16px;
     }

     .page-dvolveplus #footer .f-logo {
         height: 28px;
         margin: 0 auto 8px;
     }

     .page-dvolveplus #footer .f-tag {
         font-size: 14px;
     }

     .page-dvolveplus

     /* nav: 5 colunas em linha única,.page-dvolveplus equidistantes */
     #footer .f-nav {
         width: 100%;
         display: flex;
         justify-content: space-between;
         /* distribui igualmente */
         align-items: right;
         gap: 0;
         /* sem gap extra */
         flex-wrap: nowrap;
         /* impede quebra de linha */
     }

     .page-dvolveplus #footer .f-nav a {
         color: #0F1220;
         text-decoration: none;
         font-size: 14px;
         white-space: nowrap;
         /* impede quebra em "Criar conta" */
     }

     .page-dvolveplus #footer .footer-mid {
         flex-direction: column;
         text-align: center;
         gap: 12px;
         margin-top: 12px;
     }

     .page-dvolveplus #footer .f-legal {
         justify-content: center;
         gap: 12px;
         flex-wrap: wrap;
     }

     .page-dvolveplus #footer .f-legal a {
         color: #0F1220;
         text-decoration: none;
         font-size: 14px;
         padding: 4px 0;
     }

     .page-dvolveplus .f-sep {
         margin: 16px 0;
     }
 }

 

 .row-flex-center {
     display: flex;
     flex-wrap: wrap;
     align-items: center;
 }

 /* ==== MOVED FROM divulgador.html ==== */
 .page-divulgador

 /* ---- Divulgador: base ---- */
 .section-header h2 {
     font-weight: 800;
     letter-spacing: -0.02em;
 }

 .page-divulgador .section-header .sub {
     color: #6B7280;
 }

 .page-divulgador

 /* timeline / como-funciona */
 .how-steps {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 18px;
 }

 .page-divulgador .how-card {
     background: #fff;
     border: 1px solid #E5E7EB;
     border-radius: 16px;
     padding: 20px;
     box-shadow: 0 4px 16px rgba(0, 0, 0, .04);
     position: relative;
 }

 .page-divulgador .how-card .step {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     font-weight: 700;
     color: #111827;
 }

 .page-divulgador .how-card .step .dot {
     width: 10px;
     height: 10px;
     border-radius: 50%;
     background: var(--brand, #38B6FF);
     display: inline-block;
 }

 .page-divulgador .how-card h3 {
     font-size: 18px;
     margin: 14px 0 8px;
 }

 .page-divulgador .how-card p {
     color: #4B5563;
     margin: 0;
 }

 .page-divulgador

 /* levels grid */
 .levels-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 18px;
 }

 .page-divulgador .level-card {
     border: 1px solid #E5E7EB;
     border-radius: 18px;
     overflow: hidden;
     background: #fff;
     box-shadow: 0 6px 20px rgba(0, 0, 0, .05);
 }

 .page-divulgador .level-head {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 16px 18px;
     color: #fff;
 }

 .page-divulgador .level-title {
     display: flex;
     align-items: center;
     gap: 12px;
 }

 .page-divulgador .level-icon {
     width: 42px;
     height: 42px;
     border-radius: 12px;
     background: rgba(255, 255, 255, .09);
     display: grid;
     place-items: center;
     font-size: 18px;
 }

 .page-divulgador .level-head h3 {
     margin: 0;
     font-size: 18px;
 }

 .page-divulgador .level-head .sub {
     color: #D1D5DB;
     margin: 2px 0 0;
 }

 .page-divulgador .chip {
     font-size: 12px;
     padding: 6px 10px;
     background: #111827;
     border: 1px solid rgba(255, 255, 255, .12);
     border-radius: 999px;
 }

 .page-divulgador .level-body {
     padding: 18px;
 }

 .page-divulgador .metrics {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     gap: 12px;
     margin-bottom: 12px;
 }

 .page-divulgador .label {
     color: #6B7280;
 }

 .page-divulgador .pill-metric {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     padding: 8px 12px;
     border-radius: 999px;
     background: #F3F4F6;
     font-weight: 800;
 }

 .page-divulgador .range {
     display: flex;
     align-items: center;
     gap: 10px;
     margin: 12px 0 8px;
 }

 .page-divulgador .range-min,
 .page-divulgador .range-max {
     font-size: 12px;
     color: #6B7280;
 }

 .page-divulgador .range-bar {
     flex: 1;
     height: 8px;
     background: #F3F4F6;
     border-radius: 999px;
     overflow: hidden;
 }

 .page-divulgador .range-fill {
     display: block;
     height: 100%;
     background: linear-gradient(90deg, #38B6FF, #60a5fa);
 }

 .page-divulgador

 /* rules */
 .rules.card {
     border: 1px solid #E5E7EB;
     border-radius: 16px;
     padding: 16px;
     background: #fff;
 }

 .page-divulgador .rules .list {
     list-style: none;
     margin: 0;
     padding: 0;
     display: flex;
     flex-direction: column;
 }

 .page-divulgador

 /* ---- Simulador ---- */
 .simulator {
     border: 1px solid #E5E7EB;
     border-radius: 18px;
     padding: 20px;
     background: #fff;
     box-shadow: 0 8px 24px rgba(0, 0, 0, .06);
 }

 .page-divulgador .sim-grid {
     display: grid;
     grid-template-columns: 1.2fr .8fr;
     gap: 18px;
 }

 .page-divulgador .input-group {
     margin-bottom: 14px;
 }

 .page-divulgador .input-group label {
     display: flex;
     justify-content: space-between;
     font-weight: 600;
     margin-bottom: 6px;
 }

 .page-divulgador .input-group input[type="range"] {
     width: 100%;
 }

 .page-divulgador .input-inline {
     display: flex;
     gap: 10px;
     align-items: center;
     flex-wrap: wrap;
 }

 .page-divulgador .input-inline input[type="number"] {
     width: 140px;
     padding: 8px 10px;
     border: 1px solid #E5E7EB;
     border-radius: 10px;
 }

 .page-divulgador .tiny {
     font-size: 12px;
     color: #6B7280;
 }

 .page-divulgador .toggle {
     display: flex;
     gap: 10px;
     align-items: center;
     margin-top: 6px;
 }

 .page-divulgador .summary {
     border: 1px dashed #E5E7EB;
     border-radius: 14px;
     padding: 16px;
     background: #F9FAFB;
 }

 .page-divulgador .kpi {
     display: flex;
     flex-direction: column;
     gap: 6px;
 }

 .page-divulgador .kpi strong {
     font-size: 22px;
 }

 .page-divulgador .kpi .note {
     font-size: 12px;
     color: #6B7280;
 }

 .page-divulgador .badge-level {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     padding: 6px 10px;
     border-radius: 999px;
     background: #EEF2FF;
     color: #3730A3;
     font-weight: 700;
     font-size: 12px;
 }

 .page-divulgador .help {
     font-size: 12px;
     color: #6B7280;
     margin-top: 10px;
 }

 @media (max-width: 992px) {
     .page-divulgador .how-steps {
         grid-template-columns: 1fr;
     }

     .page-divulgador .levels-grid {
         grid-template-columns: 1fr;
     }

     .page-divulgador .sim-grid {
         grid-template-columns: 1fr;
     }
 }

 /* ==== MOVED FROM divulgador.html ==== */
 .page-divulgador

 /* ===== Tipografia consistente ===== */
 #como-funciona .feature-title {
     font-size: 18px;
     font-weight: 700;
     line-height: 1.25;
     margin: 0 0 6px;
     color: #0F1220;
 }

 .page-divulgador #como-funciona .feature-text {
     font-size: 14px;
     line-height: 1.45;
     color: #374151;
     margin: 0;
 }

 .page-divulgador

 /* ===== Card base ===== */
 #como-funciona .feature-card {
     background: #fff;
     border: 1px solid #E5E7EB;
     border-radius: 20px;
     box-shadow: 0 8px 20px rgba(16, 24, 40, .06);
     display: flex;
     flex-direction: column;
     overflow: hidden;
 }

 .page-divulgador #como-funciona .card-body {
     padding: 14px 16px 18px;
     text-align: center;
     display: flex;
     flex-direction: column;
     align-items: center;
 }

 .page-divulgador #como-funciona .icon-wrap {
     font-size: 24px;
     color: #38B6FF;
     margin-bottom: 8px;
 }

 .page-divulgador

 /* ===== Step Number ===== */
 #como-funciona .step-number {
     background: #38B6FF;
     color: #fff;
     font-weight: 700;
     font-size: 14px;
     padding: 6px 14px;
     border-radius: 999px;
     margin-bottom: 8px;
     box-shadow: 0 4px 10px rgba(56, 182, 255, .3);
 }

 @media (min-width: 992px) {
     .page-divulgador #como-funciona .hf-slider {
         position: relative;
     }

     .page-divulgador #como-funciona .hf-track {
         display: grid;
         gap: 20px;
         grid-template-columns: repeat(4, 1fr);
     }

     .page-divulgador #como-funciona .hf-arrow {
         display: none;
     }
 }

 @media (max-width: 991px) {
     .page-divulgador #como-funciona .hf-slider {
         position: relative;
     }

     .page-divulgador #como-funciona .hf-track {
         display: flex;
         overflow: hidden;
         scroll-behavior: smooth;
     }

     .page-divulgador #como-funciona .hf-slide {
         flex: 0 0 100%;
         padding: 0 4px;
     }

     .page-divulgador #como-funciona .hf-arrow {
         position: absolute;
         top: 40%;
         transform: translateY(-50%);
         width: 36px;
         height: 36px;
         border-radius: 999px;
         border: 1px solid #E5E7EB;
         background: #fff;
         color: #0F1220;
         box-shadow: 0 6px 16px rgba(0, 0, 0, .08);
         display: flex;
         align-items: center;
         justify-content: center;
         font-weight: 700;
         font-size: 20px;
         z-index: 2;
         cursor: pointer;
     }

     .page-divulgador #como-funciona .hf-prev {
         left: 4px;
     }

     .page-divulgador #como-funciona .hf-next {
         right: 4px;
     }

     .page-divulgador #como-funciona .feature-card {
         box-shadow: none !important;
         border: 1px solid #E5E7EB;
     }
 }

 /* ==== MOVED FROM divulgador.html ==== */
 .page-divulgador

 /* Grid garante simulador à esquerda e imagem à direita */
 .sim-wrap {
     display: grid;
     grid-template-columns: minmax(320px, 480px) 1fr;
     grid-template-areas: "sim img";
     gap: 40px;
     align-items: center;
 }

 .page-divulgador .area-sim {
     grid-area: sim;
 }

 .page-divulgador .area-img {
     grid-area: img;
 }

 @media (max-width: 992px) {
     .page-divulgador .sim-wrap {
         grid-template-columns: 1fr;
         grid-template-areas:
             "sim"
             "img";
     }
 }

 .page-divulgador

 /* Card moderno */
 .sim-card {
     --accent: #6B7280;
     /* atualizado via JS */
     background: linear-gradient(0deg, rgba(255, 255, 255, .92), rgba(255, 255, 255, .92));
     border: 1px solid rgba(17, 24, 39, .08);
     border-radius: 20px;
     padding: 24px;
     box-shadow: 0 10px 30px rgba(15, 18, 32, .08);
     position: relative;
     overflow: hidden;
 }

 .page-divulgador .sim-card::before {
     content: "";
     position: absolute;
     inset: -1px;
     border-radius: 20px;
     padding: 1px;
     background: linear-gradient(135deg, var(--accent), rgba(0, 0, 0, 0));
     -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
     -webkit-mask-composite: xor;
     mask-composite: exclude;
     pointer-events: none;
     /* impede bloquear o input */
 }

 .page-divulgador

 /* Tipografia */
 #simulador h2 {
     font-weight: 800;
     letter-spacing: -.02em;
     margin: 0 0 6px;
 }

 .page-divulgador #simulador .sub {
     color: #6B7280;
     margin: 0 0 16px;
 }

 .page-divulgador

 /* Input */
 .input-label {
     display: block;
     font-weight: 700;
     margin: 8px 0 6px;
 }

 .page-divulgador .input-row {
     display: flex;
     align-items: center;
     gap: 8px;
     background: #F9FAFB;
     border: 1px solid #E5E7EB;
     border-radius: 12px;
     padding: 10px 12px;
 }

 .page-divulgador .input-row .prefix {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     width: 36px;
     height: 36px;
     border-radius: 10px;
     background: rgba(17, 24, 39, .05);
 }

 .page-divulgador .input-row input {
     flex: 1;
     border: none;
     background: transparent;
     font-size: 16px;
     outline: none;
 }

 .page-divulgador .input-row:focus-within {
     border-color: var(--accent);
     box-shadow: 0 0 0 4px rgba(56, 182, 255, .12);
 }

 .page-divulgador .tiny {
     font-size: 12px;
     color: #6B7280;
     margin-top: 6px;
 }

 .page-divulgador

 /* Resultado */
 .result {
     margin-top: 16px;
 }

 .page-divulgador .level-badge {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     padding: 8px 12px;
     border-radius: 999px;
     background: color-mix(in srgb, var(--accent) 16%, white);
     color: color-mix(in srgb, var(--accent) 70%, #111827);
     font-weight: 800;
     font-size: 13px;
 }

 .page-divulgador .kpi-single {
     margin: 14px 0 10px;
     background: #F9FAFB;
     border: 1px solid #EEF2F7;
     border-radius: 12px;
     padding: 14px;
 }

 .page-divulgador .kpi-single small {
     color: #6B7280;
     display: block;
     margin-bottom: 4px;
 }

 .page-divulgador .kpi-single strong {
     color: #0F1220;
     font-weight: 900;
     font-size: 26px;
 }

 .page-divulgador

 /* Progresso */
 .progress {
     height: 10px;
     background: #F3F4F6;
     border-radius: 999px;
     overflow: hidden;
     border: 1px solid #EEF2F7;
 }

 .page-divulgador .progress-bar {
     width: 0%;
     height: 100%;
     background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 50%, #60a5fa));
     transition: width .25s ease;
 }

 .page-divulgador

 /* Imagem à direita */
 .sim-visual {
     text-align: center;
 }

 .page-divulgador .sim-visual img {
     max-width: 100%;
     height: auto;
     filter: drop-shadow(0 14px 30px rgba(0, 0, 0, .12));
     border-radius: 20px;
 }

 /* ==== MOVED FROM divulgador.html ==== */
 .page-divulgador .level-card .label {
     text-align: left;
 }

 /* ==== MOVED FROM divulgador.html ==== */
 .page-divulgador

 /* Fundo liso azul */
 .bonus-sec {
     background: #38B6FF;
     color: #fff;
     padding: 80px 20px;
     text-align: center;
 }

 .page-divulgador

 /* Conteúdo */
 .bonus-content h2 {
     font-size: 40px;
     font-weight: 900;
     margin-bottom: 20px;
     letter-spacing: -.02em;
 }

 .page-divulgador .bonus-content h2 span {
     color: #fff;
     /* mantém branco dentro do azul */
     padding: 6px 14px;
     border-radius: 8px;
 }

 .page-divulgador .bonus-content p {
     font-size: 18px;
     line-height: 1.6;
     margin-bottom: 32px;
     max-width: 700px;
     margin-left: auto;
     margin-right: auto;
     color: #fff;
 }

 .page-divulgador

 /* Botão CTA */
 .btn-bonus {
     display: inline-block;
     padding: 14px 28px;
     background: #fff;
     color: #38B6FF;
     font-weight: 800;
     border-radius: 999px;
     text-decoration: none;
     transition: .25s;
 }

 /* ==== MOVED FROM divulgador.html ==== */
 .page-divulgador #footer .f-nav {
     width: 100%;
     display: flex;
     justify-content: flex-end;
     /* cola tudo à direita */
     align-items: center;
     gap: 28px;
     /* define o espaçamento entre links */
     flex-wrap: nowrap;
     /* impede quebra de linha */
 }

 @media (max-width: 767px) {
     .page-divulgador #footer .footer-top {
         flex-direction: column;
         align-items: center;
         text-align: center;
     }

     .page-divulgador #footer .f-brand {
         margin-bottom: 16px;
     }

     .page-divulgador #footer .f-logo {
         height: 28px;
         margin: 0 auto 8px;
     }

     .page-divulgador #footer .f-tag {
         font-size: 14px;
     }

     .page-divulgador

     /* nav: 5 colunas em linha única,.page-divulgador equidistantes */
     #footer .f-nav {
         width: 100%;
         display: flex;
         justify-content: space-between;
         /* distribui igualmente */
         align-items: right;
         gap: 0;
         /* sem gap extra */
         flex-wrap: nowrap;
         /* impede quebra de linha */
     }

     .page-divulgador #footer .f-nav a {
         color: #0F1220;
         text-decoration: none;
         font-size: 14px;
         white-space: nowrap;
         /* impede quebra em "Criar conta" */
     }

     .page-divulgador #footer .footer-mid {
         flex-direction: column;
         text-align: center;
         gap: 12px;
         margin-top: 12px;
     }

     .page-divulgador #footer .f-legal {
         justify-content: center;
         gap: 12px;
         flex-wrap: wrap;
     }

     .page-divulgador #footer .f-legal a {
         color: #0F1220;
         text-decoration: none;
         font-size: 14px;
         padding: 4px 0;
     }

     .page-divulgador .f-sep {
         margin: 16px 0;
     }
 }

 .row-flex-center {
     display: flex;
     flex-wrap: wrap;
     align-items: center;
 }

 /* ==== MOVED FROM sobre.html ==== */
 .page-sobre

 /* ===== SOBRE NÓS (escopo da página) ===== */
 :root {
     --ink: #0F1220;
 }

 .page-sobre

 /* HERO SOBRE – full-bleed,.page-sobre imagem cobrindo tudo e overlay */
 #hero-sobre {
     position: relative;
     margin-top: 64px;
     /* altura do nav fixo */
     padding: clamp(48px, 6vw, 88px) 0;
     /* respiro vertical */
     min-height: 56vh;
     /* altura confortável */
     display: flex;
     align-items: center;
     color: #fff;

     /* imagem única (sem múltiplas camadas) */
     background-image: url('../images/cta-about-banner.jpg');
     background-size: cover;
     /* cobre toda a área */
     background-position: center 40%;
     /* ajuste o foco da foto aqui */
     background-repeat: no-repeat;
     background-attachment: scroll;
     /* evita bug de parallax em mobile */
 }

 .page-sobre

 /* overlay em camada separada (sem atrapalhar a imagem) */
 #hero-sobre::before {
     content: "";
     position: absolute;
     inset: 0;
     background: linear-gradient(135deg, rgba(10, 18, 33, .55), rgba(10, 18, 33, .25));
     pointer-events: none;
 }

 .page-sobre

 /* tipografia */
 #hero-sobre .pill {
     background: rgba(255, 255, 255, .18);
     border-radius: 999px;
     padding: .4rem .8rem;
     display: inline-flex;
     gap: .5rem;
 }

 .page-sobre #hero-sobre h1 {
     font-size: clamp(28px, 4.2vw, 44px);
     line-height: 1.15;
     font-weight: 900;
     margin: 12px 0 10px;
     max-width: 14ch;
 }

 .page-sobre #hero-sobre p {
     font-size: clamp(15px, 1.6vw, 18px);
     max-width: 620px;
     margin: 0;
 }

 @media (max-width: 992px) {
     .page-sobre #hero-sobre {
         text-align: center;
     }

     .page-sobre #hero-sobre h1,
     .page-sobre #hero-sobre p {
         margin-left: auto;
         margin-right: auto;
     }
 }

 .page-sobre

 /* seção base */
 .section .section-head {
     text-align: center;
     margin-bottom: 18px;
 }

 .page-sobre .section .section-head h2 {
     margin: 0;
     font-weight: 900;
 }

 .page-sobre .section .section-head .sub {
     max-width: 780px;
     margin: 10px auto 0;
     color: #6B7280;
 }

 .page-sobre

 /* grid 2 col */
 .grid-2 {
     display: grid;
     gap: 24px;
     grid-template-columns: 1.1fr 0.9fr;
     align-items: center;
 }

 .page-sobre

 /* cards + ícones */
 .card-clean {
     background: #fff;
     border: 1px solid rgba(17, 24, 39, .08);
     border-radius: 18px;
     padding: 20px;
     box-shadow: 0 8px 22px rgba(2, 8, 20, .06);
 }

 .page-sobre .icon-badge {
     display: inline-grid;
     place-items: center;
     width: 48px;
     height: 48px;
     border-radius: 14px;
     background: #EEF7FF;
     color: var(--brand);
     border: 1px solid rgba(17, 24, 39, .08);
 }

 .page-sobre

 /* lista com check */
 .list-check {
     list-style: none;
     padding: 0;
     margin: 12px 0 0;
     display: grid;
     gap: 8px;
 }

 .page-sobre .list-check li {
     display: flex;
     gap: 10px;
     align-items: flex-start;
 }

 .page-sobre .list-check i {
     color: var(--brand);
     margin-top: 2px;
 }

 .page-sobre

 /* benefícios (3 col) */
 .benefits-grid {
     display: grid;
     gap: 16px;
     grid-template-columns: repeat(3, 1fr);
 }

 .page-sobre .benefit {
     background: #fff;
     border: 1px solid rgba(17, 24, 39, .08);
     border-radius: 16px;
     padding: 18px;
     box-shadow: 0 8px 20px rgba(2, 8, 20, .06);
 }

 .page-sobre .benefit h3 {
     font-size: 18px;
     margin: 6px 0 6px;
     font-weight: 800;
 }

 .page-sobre .benefit p {
     margin: 0;
     color: #374151;
 }

 .page-sobre

 /* números (kpis) */
 .kpis {
     display: grid;
     gap: 16px;
     grid-template-columns: repeat(3, 1fr);
 }

 .page-sobre .kpi {
     background: #fff;
     border: 1px solid rgba(17, 24, 39, .08);
     border-radius: 16px;
     padding: 18px;
     text-align: center;
     box-shadow: 0 8px 20px rgba(2, 8, 20, .06);
 }

 .page-sobre .kpi .big {
     font-size: 28px;
     font-weight: 900;
     line-height: 1;
 }

 .page-sobre .kpi .label {
     margin-top: 6px;
     color: #6B7280;
 }

 .page-sobre

 /* bloco confiança */
 .trust-list {
     list-style: none;
     padding: 0;
     margin: 12px 0 0;
     display: grid;
     gap: 8px;
 }

 .page-sobre .trust-list li {
     display: flex;
     gap: 10px;
     align-items: flex-start;
 }

 .page-sobre .trust-list i {
     color: var(--brand);
     margin-top: 2px;
 }

 .page-sobre

 /* CTA final */
 .cta-band {
     background: linear-gradient(135deg, var(--brand), var(--brand-2));
     color: #fff;
     border-radius: 18px;
     padding: 26px;
     text-align: center;
     box-shadow: 0 10px 26px rgba(2, 8, 20, .10);
 }

 .page-sobre .cta-band .btn {
     background: #fff;
     color: var(--ink);
     font-weight: 800;
     border-radius: 999px;
 }

 @media(max-width:992px) {
     .page-sobre .grid-2 {
         grid-template-columns: 1fr;
     }

     .page-sobre .benefits-grid,
     .page-sobre .kpis {
         grid-template-columns: 1fr 1fr;
     }
 }

 @media(max-width:600px) {

     .page-sobre .benefits-grid,
     .page-sobre .kpis {
         grid-template-columns: 1fr;
     }
 }

 @media (max-width: 992px) {
     .page-sobre #quem-somos {
         text-align: center;
     }

     .page-sobre #quem-somos .section-head p {
         margin-left: auto;
         margin-right: auto;
     }
 }

 .page-sobre #quem-somos .row {
     display: flex;
     flex-wrap: wrap;
     align-items: center;
 }

 .page-sobre #quem-somos .section-head {
     text-align: left !important;
 }

 /* ==== MOVED FROM sobre.html ==== */
 .page-sobre #footer .f-nav {
     width: 100%;
     display: flex;
     justify-content: flex-end;
     /* cola tudo à direita */
     align-items: center;
     gap: 28px;
     /* define o espaçamento entre links */
     flex-wrap: nowrap;
     /* impede quebra de linha */
 }

 @media (max-width: 767px) {
     .page-sobre #footer .footer-top {
         flex-direction: column;
         align-items: center;
         text-align: center;
     }

     .page-sobre #footer .f-brand {
         margin-bottom: 16px;
     }

     .page-sobre #footer .f-logo {
         height: 28px;
         margin: 0 auto 8px;
     }

     .page-sobre #footer .f-tag {
         font-size: 14px;
     }

     .page-sobre

     /* nav: 5 colunas em linha única,.page-sobre equidistantes */
     #footer .f-nav {
         width: 100%;
         display: flex;
         justify-content: space-between;
         /* distribui igualmente */
         align-items: right;
         gap: 0;
         /* sem gap extra */
         flex-wrap: nowrap;
         /* impede quebra de linha */
     }

     .page-sobre #footer .f-nav a {
         color: #0F1220;
         text-decoration: none;
         font-size: 14px;
         white-space: nowrap;
         /* impede quebra em "Criar conta" */
     }

     .page-sobre #footer .footer-mid {
         flex-direction: column;
         text-align: center;
         gap: 12px;
         margin-top: 12px;
     }

     .page-sobre #footer .f-legal {
         justify-content: center;
         gap: 12px;
         flex-wrap: wrap;
     }

     .page-sobre #footer .f-legal a {
         color: #0F1220;
         text-decoration: none;
         font-size: 14px;
         padding: 4px 0;
     }

     .page-sobre .f-sep {
         margin: 16px 0;
     }
 }

 .row-flex-center {
     display: flex;
     flex-wrap: wrap;
     align-items: center;
 }

 /* ==== MOVED FROM achadinhos.html ==== */
 .page-achadinhos #footer .f-nav {
     width: 100%;
     display: flex;
     justify-content: flex-end;
     /* cola tudo à direita */
     align-items: center;
     gap: 28px;
     /* define o espaçamento entre links */
     flex-wrap: nowrap;
     /* impede quebra de linha */
 }

 @media (max-width: 767px) {
     .page-achadinhos #footer .footer-top {
         flex-direction: column;
         align-items: center;
         text-align: center;
     }

     .page-achadinhos #footer .f-brand {
         margin-bottom: 16px;
     }

     .page-achadinhos #footer .f-logo {
         height: 28px;
         margin: 0 auto 8px;
     }

     .page-achadinhos #footer .f-tag {
         font-size: 14px;
     }

     .page-achadinhos

     /* nav: 5 colunas em linha única,.page-achadinhos equidistantes */
     #footer .f-nav {
         width: 100%;
         display: flex;
         justify-content: space-between;
         /* distribui igualmente */
         align-items: right;
         gap: 0;
         /* sem gap extra */
         flex-wrap: nowrap;
         /* impede quebra de linha */
     }

     .page-achadinhos #footer .f-nav a {
         color: #0F1220;
         text-decoration: none;
         font-size: 14px;
         white-space: nowrap;
         /* impede quebra em "Criar conta" */
     }

     .page-achadinhos #footer .footer-mid {
         flex-direction: column;
         text-align: center;
         gap: 12px;
         margin-top: 12px;
     }

     .page-achadinhos #footer .f-legal {
         justify-content: center;
         gap: 12px;
         flex-wrap: wrap;
     }

     .page-achadinhos #footer .f-legal a {
         color: #0F1220;
         text-decoration: none;
         font-size: 14px;
         padding: 4px 0;
     }

     .page-achadinhos .f-sep {
         margin: 16px 0;
     }
 }

 

 .row-flex-center {
     display: flex;
     flex-wrap: wrap;
     align-items: center;
 }

 /* ==== MOVED FROM divulgador.html (hero inline) ==== */
 

/* ===== HERO FIX GLOBAL ===== */
#hero {
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin-top:64px;
    min-height:72vh;
    color:#fff;
}
#hero .row {
    width:100%;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
}
#hero h1,
#hero p {
    text-align:center;
    margin-left:auto;
    margin-right:auto;
}


/* ===== UNIFIED HERO SYSTEM (single source of truth) ===== */

/* Base hero styles (apply to all pages using #hero) */
#hero{
  position:relative;
  margin-top:64px;
  color:#fff;
  min-height:72vh;
  display:flex;
  align-items:center;
  justify-content:center;
  /* two layers: overlay + page image */
  background-image:
    linear-gradient(135deg, rgba(0,0,0,0), rgba(0,0,0,0)),
    var(--hero-bg, none);
  background-position: center center, center center;
  background-size: cover, cover;
  background-repeat: no-repeat, no-repeat;
  background-attachment: scroll, fixed;
}

/* Grid inside hero: center on both axes */
#hero .row{
  width:100%;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
}

/* Typography alignment for hero */
#hero h1,
#hero p{
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}

/* Mobile: disable fixed attachment for performance */
@media (max-width: 991px){
  #hero{
    background-attachment: scroll, scroll;
  }
}

/* ===== Per-page background mapping (only image changes) ===== */

/* Home, Divulgador, Achadinhos -> bg.png */
.page-index #hero,
.page-divulgador #hero,
.page-achadinhos #hero{
  --hero-bg: url('../images/bg.png');
}

/* Dvolve Plus -> bg2.png and hero is a bit taller */
.page-dvolveplus #hero{
  --hero-bg: url('../images/bg2.png');
  min-height:90vh;
  background-position: center top, center center;
  background-size: 100% auto, cover;
}

/* Sobre usa #hero-sobre próprio (mantido em blocos existentes) */


/* ==== HERO TEXT LEFT ALIGN ==== */
#hero h1,
#hero p{
  text-align:left!important;
  margin-left:0!important;
  margin-right:0!important;
}
#hero .row{
  justify-content:flex-start!important;
}


/* ==== HERO MOBILE CENTER ALIGN ==== */
@media (max-width: 767px){
  #hero h1,
  #hero p{
    text-align:center!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  #hero .row{
    justify-content:center!important;
  }
}


/* ==== DIVULGADOR MOBILE PADDING ==== */
.page-divulgador #hero .container{
    padding-left:24px!important;
    padding-right:24px!important;
}

/* ==== PLUS DARKER OVERLAY ==== */
.page-dvolveplus #hero{
    background-image:
        linear-gradient(135deg, rgba(0,0,0,.55), rgba(0,0,0,.35)),
        url('../images/bg2.png')!important;
}


/* ===== GLOBAL MOBILE HERO NORMALIZATION ===== */
@media (max-width: 767px){
  /* padding consistente em todas as páginas */
  #hero .container{
    padding-left:24px!important;
    padding-right:24px!important;
  }
  /* centraliza o grid e evita desalinhamento lateral */
  #hero .row{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
  }
  /* colunas ocupam 100% e limitamos a largura de leitura */
  #hero .row > [class*="col-"]{
    width:100%!important;
    max-width:680px!important;
  }
  /* tipografia centralizada no mobile */
  #hero h1,
  #hero p{
    text-align:center!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  /* botão/cta centralizado */
  #hero .d-flex,
  #hero .cta,
  #hero .cta-inline{
    justify-content:center!important;
  }
  /* imagem do hero no centro */
  .hero-image{ margin-left:auto!important; margin-right:auto!important; }
  /* reforço específico do Divulgador para manter equilíbrio lateral */
  .page-divulgador #hero .container{
    padding-left:24px!important;
    padding-right:24px!important;
  }
}


/* ===== MOBILE HERO ABSOLUTE CENTER (all pages) ===== */
@media (max-width: 767px){
  /* remove efeito “puxado” pelas margens negativas do .row do Bootstrap */
  #hero .row{
    margin-left:0!important;
    margin-right:0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
  }
  /* garantir que a(s) coluna(s) do hero ocupem 100% e fiquem centralizadas */
  #hero .row > [class*="col-"]{
    padding-left:0!important;
    padding-right:0!important;
    width:100%!important;
    max-width:680px!important; /* largura confortável de leitura */
    float:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  /* padding horizontal consistente em todo hero */
  #hero .container{
    padding-left:24px!important;
    padding-right:24px!important;
  }
  /* tipografia e CTAs centralizados */
  #hero h1,
  #hero p{
    text-align:center!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  #hero .cta-inline,
  #hero .d-flex{
    justify-content:center!important;
  }
  .hero-image{ margin-left:auto!important; margin-right:auto!important; }
}

/* === Responsive video wrapper (final) === */
#video .video-wrapper{
  position:relative;
  width:100%;
  max-width:980px;
  margin:0 auto;
  aspect-ratio:16/9;
  border-radius:18px;
  overflow:hidden;
}
#video .video-wrapper iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  display:block;
}