/* ================================================================
   G8Tech — Dark Elite Luxury Theme Override
   Deep space dark + gold accent — enterprise/oracle-level aesthetic
================================================================ */

/* ---------------------------------------------------------------
   0. GLOBAL FONT — Quicksand Semi Bold
--------------------------------------------------------------- */
*,
body,
h1, h2, h3, h4, h5, h6,
p, a, span, li, button, input, textarea, select {
    font-family: "Quicksand", sans-serif !important;
    font-weight: 600;
}

/* keep icon fonts intact */
[class*="icon-"],
.icon-arrow-top-right,
.sw-button i,
.tf-btn i {
    font-family: "icomoon" !important;
    font-weight: normal !important;
}

/* ---------------------------------------------------------------
   1. ROOT VARIABLE OVERRIDES
--------------------------------------------------------------- */
:root {
    --primary:               #C9A84C;
    --secondary:             #080B18;
    --body-background-color: #04060F;
    --body-background-color2:#02040A;
    --four:                  #080B18;
    --five:                  #04060F;
    --six:                   #1C2540;
    --sub-color:             #1A1200;
    --sub-color2:            #C9A84C;
    --third:                 #0C1020;
    --dark-color:            #E8EAF6;
    --dark-color2:           #CBD0E6;
    --dark-color3:           #0C1020;
    --dark-color4:           #E8EAF6;
    --color-text:            #7A8499;
    --color-text2:           #5A6278;
    --color-text3:           #E8EAF6;
    --mono-gray:             #7A8499;
    --mono-gray2:            #5A6278;
    --mono-gray3:            #9AA0B8;
    --mono-gray4:            #7A8499;
    --mono-gray5:            #1C2540;
    --mono-gray6:            #E8EAF6;
    --mono-gray7:            #2A3050;
    --mono-gray8:            #9AA0B8;
    --mono-gray9:            #1C2540;
    --mono-gray10:           #E8EAF6;
    --mono-gray11:           #9AA0B8;
    --border:                #1C2540;
    --green:                 #00D4FF;
}

/* ---------------------------------------------------------------
   2. BODY & GLOBAL
--------------------------------------------------------------- */
body {
    background-color: #04060F !important;
    color: #E8EAF6 !important;
}

#wrapper {
    background-color: #04060F !important;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    color: #E8EAF6 !important;
}

/* ---------------------------------------------------------------
   3. BACKGROUND CLASS OVERRIDES
--------------------------------------------------------------- */
.bg-white,
.bg_white {
    background-color: #080B18 !important;
}

.bg_four {
    background-color: #04060F !important;
}

.bg_third {
    background-color: #0C1020 !important;
}

.bg_five {
    background-color: #04060F !important;
}

/* ---------------------------------------------------------------
   4. TEXT COLOR OVERRIDES
--------------------------------------------------------------- */
.text_dark-color,
.text_dark-color4,
.text_dark-color2 {
    color: #E8EAF6 !important;
}

.text-black,
.text_black {
    color: #E8EAF6 !important;
}

.text_primary {
    color: #C9A84C !important;
}

.text_color-text {
    color: #7A8499 !important;
}

.text_color-text2 {
    color: #5A6278 !important;
}

.text_mono-gray,
.text_mono-gray3,
.text_mono-gray4,
.text_mono-gray8,
.text_mono-gray11 {
    color: #7A8499 !important;
}

/* ---------------------------------------------------------------
   5. PRELOADER
--------------------------------------------------------------- */
#loading {
    background-color: #04060F !important;
}

.loader-container {
    background-color: #080B18 !important;
}

/* ---------------------------------------------------------------
   6. HEADER
--------------------------------------------------------------- */
.header.style-3,
header.header.style-3 {
    background: rgba(4, 6, 15, 0.92) !important;
    backdrop-filter: blur(24px) !important;
    -webkit-backdrop-filter: blur(24px) !important;
    border-bottom: 1px solid #1C2540 !important;
    box-shadow: 0 1px 40px rgba(0, 0, 0, 0.6) !important;
}

.header.style-3.is-fixed,
header.header.style-3.is-fixed {
    background: rgba(4, 6, 15, 0.98) !important;
}

/* Nav pill container — override white background */
.main-menu.style-2 .navigation {
    background-color: rgba(8, 11, 24, 0.85) !important;
    border-color: #2A3250 !important;
}

/* Nav links */
.main-menu .navigation > li > a,
.main-menu.style-2 .navigation > li > a {
    color: #C0C5DC !important;
    font-weight: 500 !important;
    letter-spacing: 0.02em !important;
}

.main-menu .navigation > li:hover > a,
.main-menu .navigation > li.current-menu > a,
.main-menu.style-2 .navigation > li:hover > a,
.main-menu.style-2 .navigation > li.current-menu > a {
    color: #C9A84C !important;
}

.main-menu.style-2 .navigation > li.current-menu > a {
    background-color: rgba(201,168,76,0.15) !important;
    color: #C9A84C !important;
}

/* Ensure header-right (Learn More btn) never gets pushed behind nav */
.header.style-3 .header-inner-wrap {
    flex-wrap: nowrap !important;
}

.header.style-3 .header-right {
    flex-shrink: 0 !important;
    margin-left: auto !important;
    padding-left: 12px !important;
}

/* Submenus & mega menu */
.submenu,
ul.submenu,
.mega-menu {
    background: #080B18 !important;
    border: 1px solid #1C2540 !important;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.8) !important;
}

.submenu .menu-item a,
.mega-menu .menu-item a {
    color: #C0C5DC !important;
}

.submenu .menu-item a:hover,
.mega-menu .menu-item a:hover {
    color: #C9A84C !important;
}

.demo-name {
    color: #7A8499 !important;
}

/* Header right button */
.header-right .tf-btn-effec-arrow {
    color: #E8EAF6 !important;
}

/* ---------------------------------------------------------------
   7. HERO / PAGE TITLE BANNER
--------------------------------------------------------------- */
.page-title.style-2 {
    background: linear-gradient(160deg, #04060F 0%, #08102A 55%, #04060F 100%) !important;
    position: relative;
    overflow: hidden;
}

/* Radial glow effects */
.page-title.style-2::before {
    content: '';
    position: absolute;
    top: -150px;
    right: -100px;
    width: 700px;
    height: 700px;
    background: radial-gradient(circle, rgba(201,168,76,0.07) 0%, transparent 65%);
    pointer-events: none;
    z-index: 0;
}

.page-title.style-2::after {
    content: '';
    position: absolute;
    bottom: -100px;
    left: -150px;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(0,207,255,0.04) 0%, transparent 65%);
    pointer-events: none;
    z-index: 0;
}

.page-title.style-2 .tf-container-inner,
.page-title.style-2 .banner-title {
    position: relative;
    z-index: 1;
}

.banner-title.style-3 .title {
    color: #E8EAF6 !important;
    text-shadow: 0 0 80px rgba(201,168,76,0.12);
    margin-bottom: 16px !important;
}

.banner-title.style-3 .title .text-primary {
    color: transparent !important;
    background: linear-gradient(135deg, #C9A84C 0%, #E5C97E 60%, #C9A84C 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.banner-title.style-3 .description {
    color: #9AA0B8 !important;
}

/* Email form in hero */
.form.style-line-bot,
form.style-line-bot {
    border-color: #1C2540 !important;
}

form.style-line-bot input,
.send-mail input {
    background: transparent !important;
    color: #E8EAF6 !important;
    border-bottom-color: #1C2540 !important;
}

form.style-line-bot input::placeholder,
.send-mail input::placeholder {
    color: #5A6278 !important;
}

form.style-line-bot .submit,
.send-mail .submit {
    background: #C9A84C !important;
    color: #04060F !important;
    border-color: #C9A84C !important;
}

/* Hero facts/avatars */
.banner-title .facts .text-caption {
    color: #7A8499 !important;
}

/* ---------------------------------------------------------------
   8. MARQUEE / LOGO TICKER
--------------------------------------------------------------- */
.tf-marquee {
    background: #04060F !important;
    border-top: 1px solid #1C2540 !important;
    border-bottom: 1px solid #1C2540 !important;
}

.marquee-item.style-2 svg path {
    fill: #2A3250 !important;
    transition: fill 0.3s ease;
}

.marquee-item.style-2:hover svg path {
    fill: #C9A84C !important;
}

/* ---------------------------------------------------------------
   9. SUB-HEADING SECTION (numbered labels)
--------------------------------------------------------------- */
.sub-heading-section.style-2 {
    color: #C9A84C !important;
}

.sub-heading-section.style-2 span {
    color: #C9A84C !important;
}

.sub-heading-section.style-2 .line {
    background-color: #C9A84C !important;
    opacity: 0.6;
}

/* ---------------------------------------------------------------
   10. SERVICE SECTION
--------------------------------------------------------------- */
.section-service.style-2 {
    background: #04060F !important;
}

.tf-icon-box.style-4 {
    background: #080B18 !important;
    border: 1px solid #1C2540 !important;
    box-shadow: 0 4px 40px rgba(0, 0, 0, 0.5) !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
    padding: 18px 15px 18px 20px !important;
}

.tf-icon-box.style-4 .content {
    margin-bottom: 15px !important;
}

.tf-icon-box.style-4 .icon {
    margin-bottom: 10px !important;
}

.tf-icon-box.style-4:hover {
    border-color: rgba(201,168,76,0.5) !important;
    box-shadow: 0 8px 60px rgba(201,168,76,0.10) !important;
}

.tf-icon-box.style-4 .title a.link {
    color: #E8EAF6 !important;
}

.tf-icon-box.style-4 .title a.link:hover {
    color: #C9A84C !important;
}

.tf-icon-box.style-4 .description {
    color: #7A8499 !important;
}

/* ---------------------------------------------------------------
   11. COUNTER STATS
--------------------------------------------------------------- */
.wrap-counter {
    border-top: 1px solid #1C2540;
    border-bottom: 1px solid #1C2540;
    padding-top: 24px;
    padding-bottom: 24px;
}

.counter-item.style-1 {
    border-color: #1C2540 !important;
}

.counter-item .odometer,
.counter-item .count-2 {
    color: #C9A84C !important;
    font-weight: 700 !important;
}

.counter-item .sub.plus {
    color: #C9A84C !important;
}

/* ---------------------------------------------------------------
   12. ABOUT SECTION
--------------------------------------------------------------- */
.section-about.style-2 {
    background: #080B18 !important;
    border-top: 1px solid #1C2540 !important;
    border-bottom: 1px solid #1C2540 !important;
}

.section-about .heading-title span.text_primary {
    color: #C9A84C !important;
}

/* ---------------------------------------------------------------
   13. WORK SECTION (stack cards)
--------------------------------------------------------------- */
.section-wrap {
    background: #04060F !important;
}

.effect-stack {
    background: #04060F !important;
}

.work-item {
    border: 1px solid #1C2540 !important;
    overflow: hidden;
}

.work-item .content-inner {
    background: linear-gradient(0deg, rgba(4,6,15,0.95) 0%, rgba(4,6,15,0.4) 60%, transparent 100%) !important;
}

.work-item .number {
    color: rgba(201,168,76,0.15) !important;
}

/* ---------------------------------------------------------------
   14. TESTIMONIAL / FEEDBACK
--------------------------------------------------------------- */
.section-feedback {
    background: #04060F !important;
}

.testimonial.style-2 {
    background: #080B18 !important;
    border: 1px solid #1C2540 !important;
    box-shadow: 0 4px 30px rgba(0,0,0,0.4) !important;
}

.testimonial .box-user .name a {
    color: #E8EAF6 !important;
}

.testimonial .box-user .sub {
    color: #7A8499 !important;
}

.testimonial .text {
    color: #C0C5DC !important;
}

.testimonial .bot .text-body-3 {
    color: #5A6278 !important;
}

.testimonial .wrap-ratings span {
    color: #E8EAF6 !important;
}

.testimonial .ratings i {
    color: #C9A84C !important;
}

/* Pagination controls */
.sw-button.style-default {
    background: #0C1020 !important;
    border: 1px solid #1C2540 !important;
    color: #E8EAF6 !important;
}

.sw-button.style-default:hover {
    background: #C9A84C !important;
    border-color: #C9A84C !important;
    color: #04060F !important;
}

/* ---------------------------------------------------------------
   15. TEAM SECTION
--------------------------------------------------------------- */
.tecko-spacing-36 {
    background: #04060F !important;
}

.box-team.style-2 .content {
    background: linear-gradient(0deg, #04060F 0%, rgba(4,6,15,0) 100%) !important;
}

.box-team.style-2 .content .name a {
    color: #E8EAF6 !important;
}

.box-team.style-2 .content .sub {
    color: #C9A84C !important;
}

.box-team.style-2 .social a {
    color: #7A8499 !important;
}

.box-team.style-2 .social a:hover {
    color: #C9A84C !important;
}

/* ---------------------------------------------------------------
   16. FAQ SECTION
--------------------------------------------------------------- */
.section-faq {
    background: #04060F !important;
}

.section-faq .tf-container {
    background: #04060F !important;
}

.accordion-item.style-2 {
    background: transparent !important;
    border-bottom: 1px solid #1C2540 !important;
}

.accordion-item.style-2.active {
    background: #080B18 !important;
    border-color: rgba(201,168,76,0.3) !important;
}

.accordion-title .heading h6 {
    color: #E8EAF6 !important;
}

.accordion-faqs-content {
    background: transparent !important;
}

.accordion-faqs-content p {
    color: #9AA0B8 !important;
}

.accordion-item .icon {
    border-color: #1C2540 !important;
}

.accordion-item.active .icon {
    background: #C9A84C !important;
    border-color: #C9A84C !important;
}

/* ---------------------------------------------------------------
   17. PRICING SECTION
--------------------------------------------------------------- */
.tecko-spacing-19.bg-white,
.tecko-spacing-19 {
    background: #080B18 !important;
    border-top: 1px solid #1C2540 !important;
}

.pricing-table.style-1 {
    background: #0C1020 !important;
    border: 1px solid #1C2540 !important;
    box-shadow: 0 4px 40px rgba(0,0,0,0.4) !important;
}

.pricing-table.style-1.border_primary {
    border-color: rgba(201,168,76,0.6) !important;
    box-shadow: 0 0 60px rgba(201,168,76,0.08), 0 4px 40px rgba(0,0,0,0.5) !important;
    background: #0E1428 !important;
}

.pricing-table .heading .text-body-2 {
    color: #7A8499 !important;
    letter-spacing: 0.12em !important;
    font-weight: 600 !important;
}

.pricing-table .price {
    color: #E8EAF6 !important;
}

.pricing-table .text_primary {
    color: #C9A84C !important;
}

.pricing-table .tag.text_primary {
    color: #C9A84C !important;
    background: rgba(201,168,76,0.12) !important;
    border-radius: 4px;
    padding: 2px 8px;
}

.pricing-table p.text_color-text2 {
    color: #5A6278 !important;
}

.list-check li {
    color: #9AA0B8 !important;
}

.list-check li i.icon-checkmark {
    color: #C9A84C !important;
}

/* ---------------------------------------------------------------
   18. BLOG SECTION
--------------------------------------------------------------- */
.sectiom-blog.style-1 {
    background: #04060F !important;
}

.blog-article-item.style-2 {
    border-bottom: 1px solid #1C2540 !important;
}

.blog-article-item h5 a,
.blog-article-item .link.text-black {
    color: #E8EAF6 !important;
}

.blog-article-item h5 a:hover {
    color: #C9A84C !important;
}

.blog-article-item .description {
    color: #7A8499 !important;
}

.blog-article-item .tag {
    color: #5A6278 !important;
}

.blog-article-item .tag .text-black {
    color: #9AA0B8 !important;
}

.blog-article-item .meta-date span {
    color: #5A6278 !important;
}

/* ---------------------------------------------------------------
   19. FOOTER
--------------------------------------------------------------- */
#footer.style-3 {
    background: #020408 !important;
    border-top: 1px solid #1C2540 !important;
}

#footer h3 {
    color: #E8EAF6 !important;
}

#footer .footer-heading {
    color: #E8EAF6 !important;
    font-weight: 600 !important;
}

#footer .footer-menu-list li div,
#footer .footer-menu-listt li a {
    color: #7A8499 !important;
}

#footer .footer-menu-listt li a:hover {
    color: #C9A84C !important;
}

#footer .footer-menu-list li .text_mono-gray {
    color: #5A6278 !important;
}

#footer .footer-bottom {
    border-top: 1px solid #1C2540 !important;
}

#footer .footer-bottom p,
#footer .footer-bottom a {
    color: #5A6278 !important;
}

#footer .footer-bottom a:hover {
    color: #C9A84C !important;
}

.form-newsletter.style-2 .subscribe-email {
    background: #0C1020 !important;
    border-color: #1C2540 !important;
    color: #E8EAF6 !important;
}

.form-newsletter.style-2 .subscribe-email::placeholder {
    color: #5A6278 !important;
}

.form-newsletter.style-2 .subscribe-button {
    background: #C9A84C !important;
    color: #04060F !important;
}

.form-newsletter.style-2 .subscribe-button:hover {
    background: #E5C97E !important;
}

.tecko-social.style-2 a {
    color: #7A8499 !important;
    border-color: #1C2540 !important;
}

.tecko-social.style-2 a:hover {
    color: #C9A84C !important;
    border-color: #C9A84C !important;
}

/* ---------------------------------------------------------------
   20. BUTTONS
--------------------------------------------------------------- */
form.style-line-bot button.submit,
form.style-line-bot button {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
    padding: 0 !important;
}

form.style-line-bot.send-mail fieldset input {
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    border-radius: 20px !important;
    padding: 8px 50px 8px 16px !important;
}

form.style-line-bot.send-mail button.submit,
form.style-line-bot.send-mail button {
    right: 5px !important;
}


.tf-btn.btn-dark {
    background: #0C1020 !important;
    color: #E8EAF6 !important;
    border: 1px solid #1C2540 !important;
}

.tf-btn.btn-dark:hover {
    background: #C9A84C !important;
    border-color: #C9A84C !important;
    color: #04060F !important;
}

.tf-btn.btn-primary2,
.tf-btn.btn-primary {
    background: #C9A84C !important;
    color: #04060F !important;
    border-color: #C9A84C !important;
    font-weight: 600 !important;
}

.tf-btn.btn-primary2:hover,
.tf-btn.btn-primary:hover {
    background: #E5C97E !important;
    border-color: #E5C97E !important;
}

/* Arrow effect buttons */
.tf-btn-effec-arrow {
    color: #E8EAF6 !important;
}

.tf-btn-effec-arrow .button-icon {
    background: #C9A84C !important;
    color: #04060F !important;
}

.tf-btn-effec-arrow:hover .button-icon {
    background: #E5C97E !important;
}

.tf-btn-effec-arrow.btn-white {
    color: #E8EAF6 !important;
}

.tf-btn-effec-arrow.btn-white .button-icon {
    background: #C9A84C !important;
    color: #04060F !important;
}

/* bg-effect hover fill for tf-btn */
.tf-btn .bg-effect {
    background: rgba(201,168,76,0.15) !important;
}

/* ---------------------------------------------------------------
   21. MOBILE MENU
--------------------------------------------------------------- */
.canvas-mb,
.offcanvas.canvas-mb {
    background: #080B18 !important;
}

.top-nav-mobile {
    background: #04060F !important;
    border-bottom: 1px solid #1C2540 !important;
}

.mb-menu-link {
    color: #C0C5DC !important;
    border-bottom-color: #1C2540 !important;
}

.mb-menu-link:hover,
.mb-menu-link.active {
    color: #C9A84C !important;
}

.sub-nav-menu {
    background: #0C1020 !important;
    border-color: #1C2540 !important;
}

.sub-nav-link {
    color: #7A8499 !important;
}

.sub-nav-link:hover,
.sub-nav-link.active {
    color: #C9A84C !important;
}

.mb-info a span {
    color: #E8EAF6 !important;
}

/* ---------------------------------------------------------------
   22. PROGRESS SCROLL BUTTON
--------------------------------------------------------------- */
.progress-wrap {
    background: #0C1020 !important;
    border: 1px solid #1C2540 !important;
}

.progress-wrap svg path {
    stroke: #C9A84C !important;
}

/* ---------------------------------------------------------------
   23. LUXURY GOLD GLOW ACCENTS
--------------------------------------------------------------- */

/* Subtle horizontal divider with gold center-glow */
.section-service.style-2,
.section-about.style-2,
.section-feedback,
.tecko-spacing-36 {
    position: relative;
}

/* Counter number gold treatment */
.counter-number {
    color: #C9A84C !important;
}

/* ---------------------------------------------------------------
   24. LINK & GENERAL COLOR FIXES
--------------------------------------------------------------- */
a.link,
.link {
    color: inherit;
}

.link:hover {
    color: #C9A84C !important;
}

.link.style-2:hover {
    color: #C9A84C !important;
}

/* Icon colors */
.icon-star-solid {
    color: #C9A84C !important;
}

/* Swiper dots */
.sw-dots .swiper-pagination-bullet-active {
    background: #C9A84C !important;
}

.sw-dots .swiper-pagination-bullet {
    background: #1C2540 !important;
    opacity: 1 !important;
}

/* ---------------------------------------------------------------
   25. SCROLLBAR STYLING
--------------------------------------------------------------- */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-track {
    background: #04060F;
}

::-webkit-scrollbar-thumb {
    background: #1C2540;
    border-radius: 999px;
}

::-webkit-scrollbar-thumb:hover {
    background: #C9A84C;
}

/* ---------------------------------------------------------------
   26. BANNER IMAGE — dark-theme treatment + offset
--------------------------------------------------------------- */
.banner-title.style-3 .right {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
}

.banner-title.style-3 .right img {
    display: block;
    width: auto;
    height: auto;
    margin-top: 60px;
    margin-bottom: -50px;
    border-radius: 16px;
    filter: brightness(0.82) saturate(0.85) !important;
}

.banner-hero-swiper {
    border-radius: 16px;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    width: 100%;
    margin-top: 110px;
}

.banner-hero-swiper .swiper-slide img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    border-radius: 16px;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    filter: brightness(0.82) saturate(0.85) !important;
}

.banner-hero-swiper .swiper-pagination-bullet {
    background: rgba(255, 255, 255, 0.5);
    opacity: 1;
}

.banner-hero-swiper .swiper-pagination-bullet-active {
    background: #C9A84C;
}

/* Dark overlay on top of the banner image */
.banner-title.style-3 .right::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(4,6,15,0.18) 0%, rgba(8,11,24,0.10) 100%);
    border-radius: 16px;
    pointer-events: none;
    z-index: 1;
}

/* ---------------------------------------------------------------
   27. BANNER RIGHT IMAGE — hide on mobile
--------------------------------------------------------------- */
@media (max-width: 767px) {
    .banner-title.style-3 {
        margin-bottom: 0 !important;
    }
    
    .banner-title.style-3 .right {
        display: block !important;
        width: 100% !important;
        margin-top: 0px;
        margin-bottom: 20px !important;
    }
    
    .banner-title.style-3 .right::after {
        display: none !important;
    }
    
    .banner-hero-swiper {
        margin-top: 0px !important;
        margin-bottom: 0 !important;
    }
    
    .banner-hero-pagination {
        display: none !important;
    }
    
    .tf-marquee {
        border-top: none !important;
    }
}

/* ---------------------------------------------------------------
   29. MARQUEE — scale down 30% on mobile
--------------------------------------------------------------- */
@media (max-width: 767px) {
    .tf-container-inner .tf-marquee {
        transform: scale(0.7);
        transform-origin: left center;
        width: calc(100% / 0.7);
    }
}

/* ---------------------------------------------------------------
   30. CALENDLY BOOKING SECTION
--------------------------------------------------------------- */
.section-booking.style-2 {
    padding: 80px 0;
}

.section-booking .heading-section {
    margin-bottom: 40px;
}

.calendly-inline-widget {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

@media (max-width: 767px) {
    .section-booking.style-2 {
        padding: 40px 0;
    }
    
    .calendly-inline-widget {
        height: 600px !important;
    }
}

/* ---------------------------------------------------------------
   28. TESTIMONIAL GLOBE — invert globe so it's visible on dark bg
--------------------------------------------------------------- */
.section-testimonial.style-2 {
    background-image: none !important;
    position: relative;
}

.section-testimonial.style-2::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url(../images/backgroup/bg-testimonial-2.png);
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: auto;
    filter: invert(1) opacity(0.18);
    pointer-events: none;
    z-index: 0;
}

.section-testimonial.style-2 > * {
    position: relative;
    z-index: 1;
}