:root {
    /* Brand Palette */
    --jinn-dark-bg: #0A0E14;
    /* Primary Dark Background */
    --jinn-accent-green: #063630;
    /* Deep Emerald Accent */
    --jinn-gold: #D6B36A;
    /* Elegant Warm Gold Accent */
    --jinn-cream: #F7F4EF;
    /* Off-White / Soft Cream Text & Light Surfaces */
    --jinn-muted: #B6BDC8;
    /* Slate Grey Subtext & Borders */

    /* Override Bootstrap System Colors */
    --bs-body-bg: #0A0E14;
    --bs-body-color: #F7F4EF;
    --bs-heading-color: #F7F4EF;

    --bs-primary: #D6B36A;
    --bs-primary-rgb: 214, 179, 106;

    --bs-purple: #063630;
    --bs-purple-rgb: 6, 54, 48;
}

body {
    background-color: var(--jinn-dark-bg) !important;
    color: var(--jinn-cream) !important;
}

@media (min-width: 992px) {
    .py-lg-50 {
        padding-top: 50px !important;
        padding-bottom: 50px !important;
    }
}

/* Text Colors & Accent Gradients */
.text-purple-gradient,
.hero-outline-text {
    background: linear-gradient(135deg, #D6B36A 0%, #D6B36A 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.text-white-50,
.text-muted,
p {
    color: var(--jinn-muted) !important;
}

.text-white {
    color: var(--jinn-cream) !important;
}

/* Buttons - Solid Brand Colors (Gold #D6B36A -> Hover #E5C580) */
.btn-purple-gradient,
.btn-primary,
.bg-purple,
.btn-outline-gold,
.btn-outline-custom,
.btn-solid-jinn,
.btn-solid-brand,
.btn-emerald-submit,
.btn.btn-purple-gradient,
.btn.btn-primary,
.btn.btn-outline-gold,
.btn.btn-outline-custom,
.btn.btn-solid-jinn,
.btn.btn-solid-brand,
.btn.btn-emerald-submit {
    background: linear-gradient(135deg, #D6B36A 0%, #B8934A 100%) !important;
    background-color: #D6B36A !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    color: #0A0E14 !important;
    box-shadow: 0 4px 15px rgba(214, 179, 106, 0.35) !important;
    transition: all 0.3s ease !important;
}

.btn-purple-gradient *,
.btn-primary *,
.bg-purple *,
.btn-outline-gold *,
.btn-outline-custom *,
.btn-solid-jinn *,
.btn-solid-brand *,
.btn-emerald-submit *,
.btn.btn-purple-gradient *,
.btn.btn-primary *,
.btn.btn-outline-gold *,
.btn.btn-outline-custom *,
.btn.btn-solid-jinn *,
.btn.btn-solid-brand *,
.btn.btn-emerald-submit * {
    color: #0A0E14 !important;
}

.btn-purple-gradient:hover,
.btn-primary:hover,
.bg-purple:hover,
.btn-outline-gold:hover,
.btn-outline-custom:hover,
.btn-solid-jinn:hover,
.btn-solid-brand:hover,
.btn-emerald-submit:hover,
.btn.btn-purple-gradient:hover,
.btn.btn-primary:hover,
.btn.btn-outline-gold:hover,
.btn.btn-outline-custom:hover,
.btn.btn-solid-jinn:hover,
.btn.btn-solid-brand:hover,
.btn.btn-emerald-submit:hover {
    background: #E5C580 !important;
    background-color: #E5C580 !important;
    border-color: #E5C580 !important;
    color: #0A0E14 !important;
    box-shadow: 0 6px 22px rgba(214, 179, 106, 0.55) !important;
    transform: translateY(-2px) !important;
}

.btn-purple-gradient:hover *,
.btn-primary:hover *,
.bg-purple:hover *,
.btn-outline-gold:hover *,
.btn-outline-custom:hover *,
.btn-solid-jinn:hover *,
.btn-solid-brand:hover *,
.btn-emerald-submit:hover *,
.btn.btn-purple-gradient:hover *,
.btn.btn-primary:hover *,
.btn.btn-outline-gold:hover *,
.btn.btn-outline-custom:hover *,
.btn.btn-solid-jinn:hover *,
.btn.btn-solid-brand:hover *,
.btn.btn-emerald-submit:hover * {
    color: #0A0E14 !important;
}

/* Glass Badges & Cards */
.badge-glass {
    background: rgba(6, 54, 48, 0.15) !important;
    border: 1px solid rgba(214, 179, 106, 0.3) !important;
    color: #F7F4EF !important;
}

.badge.bg-purple {
    background-color: #063630 !important;
    color: #F7F4EF !important;
}

/* Cards */
.card-effect-one,
.card-purple,
.footer-premium {
    background: #0A0E14 !important;
    border-color: rgba(182, 189, 200, 0.15) !important;
}

/* Typing Cursor */
.typing-cursor {
    color: #D6B36A !important;
}

/* Global Canvas & Ambient Background Position */
#bg-stars,
#bg-blur,
#orb-bg {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    pointer-events: none !important;
}

#bg-stars {
    z-index: -3 !important;
}

#bg-blur {
    z-index: -2 !important;
}

#orb-bg {
    z-index: -1 !important;
    opacity: 0.9 !important;
}

/* Custom Jinnspire Brand Palette Ambient Blur Circles (#0A0E14, #063630, #D6B36A, #F7F4EF, #B6BDC8) */
.hero-2-section {
    position: relative !important;
    z-index: 2 !important;
}

.hero-2-title {
    font-size: clamp(2.1rem, 3.6vw, 3.35rem) !important;
    line-height: 1.2 !important;
    letter-spacing: -0.015em !important;
}

@media (min-width: 1200px) {
    .hero-2-title {
        font-size: 3.35rem !important;
        /* ~54px down from 80px */
        line-height: 1.18 !important;
    }
}

@media (min-width: 1400px) {
    .hero-2-title {
        font-size: 3.5rem !important;
        /* ~56px down from 80px */
        line-height: 1.18 !important;
    }
}

@media (max-width: 767.98px) {
    .hero-2-title {
        font-size: 2rem !important;
        line-height: 1.25 !important;
    }
}

.why-main-heading {
    font-size: clamp(2rem, 3.2vw, 3.25rem) !important;
    line-height: 1.2 !important;
    letter-spacing: -0.015em !important;
}

@media (min-width: 1200px) {
    .why-main-heading {
        font-size: clamp(2.35rem, 3vw, 3.15rem) !important;
        white-space: nowrap;
    }
}

@media (max-width: 1199.98px) {
    .why-main-heading {
        font-size: clamp(1.85rem, 4.5vw, 2.5rem) !important;
        white-space: normal;
    }
}

/* Site Brand Logo Sizing */
.page-hero-title {
    font-size: clamp(1.45rem, 5.8vw, 3.25rem) !important;
    line-height: 1.25 !important;
    letter-spacing: -0.02em !important;
}

.page-hero-title span {
    white-space: nowrap;
}

@media (max-width: 360px) {
    .page-hero-title {
        font-size: clamp(1.2rem, 5.2vw, 1.45rem) !important;
    }
}

/* Portfolio Filter Scrollbar & Container */
.portfolio-filter-scroll-wrapper {
    display: flex;
    justify-content: center;
    width: 100%;
}

@media (max-width: 991.98px) {
    .portfolio-filter-scroll-wrapper {
        justify-content: flex-start !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
        padding: 6px 16px 14px !important;
        mask-image: linear-gradient(to right, black 85%, transparent 100%);
        -webkit-mask-image: linear-gradient(to right, black 85%, transparent 100%);
    }

    .portfolio-filter-scroll-wrapper::-webkit-scrollbar {
        display: none !important;
    }

    .portfolio-filter-container {
        flex-wrap: nowrap !important;
        flex-shrink: 0 !important;
    }

    .portfolio-filter-container .filter-pill {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        padding: 7px 14px !important;
        font-size: 13px !important;
    }
}

.site-header-logo {
    height: 54px !important;
    width: auto !important;
    object-fit: contain;
    transition: transform 0.25s ease;
}

@media (max-width: 767.98px) {
    .site-header-logo {
        height: 46px !important;
    }
}

.site-footer-logo {
    height: 68px !important;
    width: auto !important;
    object-fit: contain;
}

@media (max-width: 767.98px) {
    .site-footer-logo {
        height: 58px !important;
    }
}

.hero-2-gradient-bg {
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none !important;
    z-index: 0 !important;
    overflow: hidden !important;
}

.gradients-container {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none !important;
    overflow: hidden !important;
}

.hero-2-gradient-bg div[class^="circle-blur"] {
    position: absolute !important;
    border-radius: 50% !important;
    pointer-events: none !important;
    opacity: 0.88 !important;
    z-index: 1 !important;
    will-change: transform !important;
}

/* Circle 1: Emerald Green (#063630) - Starts Top-Left, sweeps across full width to Top-Right */
.hero-2-gradient-bg .circle-blur1 {
    width: 620px !important;
    height: 620px !important;
    top: -60px !important;
    left: -40px !important;
    background: radial-gradient(circle, rgba(6, 54, 48, 0.95) 0%, rgba(6, 54, 48, 0.5) 45%, rgba(6, 54, 48, 0) 75%) !important;
    filter: blur(40px) !important;
    animation: sweepAcrossRight1 16s ease-in-out infinite alternate !important;
}

/* Circle 2: Warm Gold (#D6B36A) - Starts Upper-Right, sweeps across full width to Left */
.hero-2-gradient-bg .circle-blur2 {
    width: 650px !important;
    height: 650px !important;
    top: 5% !important;
    right: 5% !important;
    background: radial-gradient(circle, rgba(214, 179, 106, 0.9) 0%, rgba(214, 179, 106, 0.45) 45%, rgba(214, 179, 106, 0) 75%) !important;
    filter: blur(45px) !important;
    animation: sweepAcrossLeft2 18s ease-in-out infinite alternate !important;
}

/* Circle 3: Gold & Emerald Fusion Center (#D6B36A & #063630) - Sweeps from Left-Center across to Far Right */
.hero-2-gradient-bg .circle-blur3 {
    width: 580px !important;
    height: 580px !important;
    top: 25% !important;
    left: 20% !important;
    background: radial-gradient(circle, rgba(214, 179, 106, 0.85) 0%, rgba(6, 54, 48, 0.55) 50%, rgba(6, 54, 48, 0) 75%) !important;
    filter: blur(40px) !important;
    animation: sweepAcrossRight3 14s ease-in-out infinite alternate !important;
}

/* Circle 4: Warm Gold Accent (#D6B36A) - Starts Lower-Left, sweeps across to Mid-Right */
.hero-2-gradient-bg .circle-blur4 {
    width: 600px !important;
    height: 600px !important;
    bottom: -50px !important;
    left: 5% !important;
    background: radial-gradient(circle, rgba(214, 179, 106, 0.9) 0%, rgba(214, 179, 106, 0.4) 45%, rgba(214, 179, 106, 0) 75%) !important;
    filter: blur(40px) !important;
    animation: sweepAcrossRight4 20s ease-in-out infinite alternate !important;
}

/* Circle 5: Emerald Green Accent (#063630) - Starts Lower-Right, sweeps across full width to Left */
.hero-2-gradient-bg .circle-blur5 {
    width: 640px !important;
    height: 640px !important;
    bottom: -40px !important;
    right: 12% !important;
    background: radial-gradient(circle, rgba(6, 54, 48, 0.9) 0%, rgba(6, 54, 48, 0.45) 45%, rgba(6, 54, 48, 0) 75%) !important;
    filter: blur(40px) !important;
    animation: sweepAcrossLeft5 15s ease-in-out infinite alternate !important;
}

/* Full-width sweeping animations across left, center and right sides */
@keyframes sweepAcrossRight1 {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(35vw, 25vh, 0) scale(1.1);
    }

    100% {
        transform: translate3d(65vw, 10vh, 0) scale(0.95);
    }
}

@keyframes sweepAcrossLeft2 {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(-35vw, 25vh, 0) scale(1.12);
    }

    100% {
        transform: translate3d(-60vw, 10vh, 0) scale(0.92);
    }
}

@keyframes sweepAcrossRight3 {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(30vw, -15vh, 0) scale(1.15);
    }

    100% {
        transform: translate3d(58vw, -5vh, 0) scale(1.02);
    }
}

@keyframes sweepAcrossRight4 {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(32vw, -25vh, 0) scale(1.08);
    }

    100% {
        transform: translate3d(62vw, -15vh, 0) scale(0.92);
    }
}

@keyframes sweepAcrossLeft5 {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(-30vw, -20vh, 0) scale(1.1);
    }

    100% {
        transform: translate3d(-55vw, -5vh, 0) scale(0.95);
    }
}

/* Background Canvas & Ambient Watermark Glows */
.footer-ambient-glow {
    background: radial-gradient(circle, rgba(6, 54, 48, 0.3) 0%, rgba(10, 14, 20, 0) 70%) !important;
}

.footer-ambient-glow.glow-right {
    background: radial-gradient(circle, rgba(214, 179, 106, 0.2) 0%, rgba(10, 14, 20, 0) 70%) !important;
}

/* Service Card Hover Side Glow (#D6B36A) */
.service-card {
    transition: all 0.35s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

.service-card:hover {
    transform: translateY(-6px) scale(1.015) !important;
    border-color: #D6B36A !important;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.5), 0 0 35px rgba(214, 179, 106, 0.4), -8px 0 25px rgba(214, 179, 106, 0.35), 8px 0 25px rgba(214, 179, 106, 0.35) !important;
}

/* Subpage Wrapper: Spacing below fixed navbar when breadcrumbs are removed */
.subpage-wrapper {
    padding-top: 70px;
}

@media (min-width: 992px) {
    .subpage-wrapper {
        padding-top: 70px;
    }
}

/* Hover Accent Helpers */
.hover-text-gold {
    transition: color 0.3s ease !important;
}

.hover-text-gold:hover {
    color: var(--jinn-gold) !important;
}

.text-gold-accent {
    color: #D6B36A !important;
}

.border-gold-subtle {
    border: 1px solid rgba(214, 179, 106, 0.3) !important;
}

/* ==========================================================================
   Google Translate Custom Luxury Theme
   ========================================================================== */
.lang-toggle-btn {
    background: rgba(6, 54, 48, 0.25) !important;
    border: 1px solid rgba(214, 179, 106, 0.35) !important;
    color: #F7F4EF !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.lang-toggle-btn:hover,
.lang-toggle-btn:focus,
.custom-lang-dropdown.show .lang-toggle-btn {
    background: rgba(6, 54, 48, 0.45) !important;
    border-color: #D6B36A !important;
    box-shadow: 0 0 15px rgba(214, 179, 106, 0.3) !important;
}

.custom-lang-menu {
    background: #0A0E14 !important;
    border: 1px solid rgba(214, 179, 106, 0.3) !important;
    border-radius: 14px !important;
    min-width: 210px !important;
    max-height: 280px !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    pointer-events: auto !important;
    z-index: 1060 !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(214, 179, 106, 0.5) rgba(255, 255, 255, 0.05);
}

.custom-lang-menu::-webkit-scrollbar {
    width: 6px;
}

.custom-lang-menu::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.04);
    border-radius: 8px;
}

.custom-lang-menu::-webkit-scrollbar-thumb {
    background: rgba(214, 179, 106, 0.4);
    border-radius: 8px;
}

.custom-lang-menu::-webkit-scrollbar-thumb:hover {
    background: #D6B36A;
}

.custom-lang-menu .dropdown-item {
    transition: all 0.2s ease !important;
    color: #F7F4EF !important;
}

.custom-lang-menu .dropdown-item:hover,
.custom-lang-menu .dropdown-item:focus {
    background: rgba(6, 54, 48, 0.4) !important;
    color: #D6B36A !important;
}

.google-translate-box {
    background: rgba(6, 54, 48, 0.25);
    border: 1px solid rgba(214, 179, 106, 0.35);
    border-radius: 50px;
    padding: 3px 12px;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transition: all 0.3s ease;
}

.google-translate-box:hover {
    border-color: #D6B36A;
    background: rgba(6, 54, 48, 0.4);
    box-shadow: 0 0 15px rgba(214, 179, 106, 0.25);
}

.goog-te-gadget {
    font-family: inherit !important;
    font-size: 0 !important;
    color: transparent !important;
    display: inline-flex !important;
    align-items: center !important;
    line-height: 1 !important;
}

.goog-te-gadget .goog-te-combo {
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #F7F4EF !important;
    background: transparent !important;
    border: none !important;
    outline: none !important;
    cursor: pointer !important;
    padding: 4px 6px !important;
    line-height: 1.4 !important;
}

.goog-te-gadget .goog-te-combo option {
    background: #0A0E14 !important;
    color: #F7F4EF !important;
    padding: 8px !important;
}

.goog-te-gadget span,
.goog-te-gadget img {
    display: none !important;
}

/* Prevent Google Translate banner from shifting fixed navbar */
body {
    top: 0px !important;
    position: static !important;
}

.goog-te-banner-frame.skiptranslate,
iframe.goog-te-banner-frame,
.VIpgJd-ZVi9od-ORHb-OEVmcd,
.VIpgJd-ZVi9od-aZ2wEe-wOHMyf {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
}

#goog-gt-tt,
.goog-te-balloon-frame {
    display: none !important;
}

.goog-text-highlight {
    background: none !important;
    box-shadow: none !important;
}

/* ==========================================================================
   Luxury Floating Action Buttons (WhatsApp, Direct Call, Back to Top)
   ========================================================================== */
.floating-contact-actions {
    position: fixed;
    bottom: 28px;
    left: 28px;
    z-index: 1040;
    display: flex;
    flex-direction: column;
    gap: 14px;
    pointer-events: none;
}

.floating-nav-actions {
    position: fixed;
    bottom: 28px;
    right: 28px;
    z-index: 1040;
    pointer-events: none;
}

.floating-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    text-decoration: none !important;
    pointer-events: auto;
    cursor: pointer;
    border: none;
    outline: none;
    padding: 0;
    transition: transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1),
        box-shadow 0.35s cubic-bezier(0.165, 0.84, 0.44, 1),
        background 0.3s ease,
        border-color 0.3s ease;
}

/* WhatsApp Floating Button */
.floating-btn-whatsapp {
    background: linear-gradient(135deg, #25D366 0%, #128C7E 100%) !important;
    color: #FFFFFF !important;
    border: 1.5px solid rgba(255, 255, 255, 0.35) !important;
    box-shadow: 0 6px 20px rgba(37, 211, 102, 0.4), 0 2px 6px rgba(0, 0, 0, 0.25);
    font-size: 26px;
}

.floating-btn-whatsapp:hover {
    transform: translateY(-4px) scale(1.08);
    box-shadow: 0 12px 28px rgba(37, 211, 102, 0.55), 0 0 20px rgba(214, 179, 106, 0.4);
    color: #FFFFFF !important;
}

/* Radiating Pulse Ring for WhatsApp */
.floating-pulse-ring {
    position: absolute;
    top: -4px;
    left: -4px;
    right: -4px;
    bottom: -4px;
    border-radius: 50%;
    border: 2px solid #25D366;
    animation: floatingPulse 2.4s cubic-bezier(0.24, 0, 0.38, 1) infinite;
    pointer-events: none;
}

@keyframes floatingPulse {
    0% {
        transform: scale(0.95);
        opacity: 0.85;
    }

    50% {
        opacity: 0.4;
    }

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

/* Direct Call Floating Button */
.floating-btn-call {
    background: linear-gradient(135deg, #063630 0%, #06382C 100%) !important;
    color: #D6B36A !important;
    border: 1.5px solid #D6B36A !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4), 0 0 14px rgba(214, 179, 106, 0.3);
    font-size: 22px;
}

.floating-btn-call:hover {
    transform: translateY(-4px) scale(1.08);
    background: linear-gradient(135deg, #14755e 0%, #063630 100%) !important;
    box-shadow: 0 12px 28px rgba(6, 54, 48, 0.6), 0 0 22px rgba(214, 179, 106, 0.5);
    color: #F7F4EF !important;
}

/* Direct Email Floating Button */
.floating-btn-email {
    background: linear-gradient(135deg, #0A1118 0%, #063630 100%) !important;
    color: #D6B36A !important;
    border: 1.5px solid #D6B36A !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4), 0 0 14px rgba(214, 179, 106, 0.25);
    font-size: 22px;
}

.floating-btn-email:hover {
    transform: translateY(-4px) scale(1.08);
    background: linear-gradient(135deg, #D6B36A 0%, #B8934A 100%) !important;
    color: #0A0E14 !important;
    border-color: #D6B36A !important;
    box-shadow: 0 12px 28px rgba(214, 179, 106, 0.55), 0 0 22px rgba(214, 179, 106, 0.45);
}

.floating-btn-email:hover svg {
    transform: translateY(-2px);
}

.floating-btn svg {
    display: block;
    flex-shrink: 0;
    transition: transform 0.25s ease, color 0.25s ease, fill 0.25s ease;
}

.floating-btn-call:hover svg,
.floating-btn-call:hover i {
    animation: phoneShake 0.55s ease infinite;
}

@keyframes phoneShake {

    0%,
    100% {
        transform: rotate(0deg);
    }

    20% {
        transform: rotate(-15deg);
    }

    40% {
        transform: rotate(12deg);
    }

    60% {
        transform: rotate(-10deg);
    }

    80% {
        transform: rotate(8deg);
    }
}

/* Back to Top Floating Button */
.floating-btn-top {
    background: rgba(10, 14, 20, 0.88) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    color: #D6B36A !important;
    border: 1.5px solid rgba(214, 179, 106, 0.45) !important;
    font-size: 22px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4), 0 0 10px rgba(214, 179, 106, 0.2);
    opacity: 0;
    visibility: hidden;
    transform: translateY(18px) scale(0.85);
    transition: opacity 0.35s ease,
        visibility 0.35s ease,
        transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1),
        background 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        color 0.3s ease;
}

.floating-btn-top.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
}

.floating-btn-top:hover {
    background: rgba(6, 54, 48, 0.85) !important;
    border-color: #D6B36A !important;
    color: #F7F4EF !important;
    transform: translateY(-5px) scale(1.08);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5), 0 0 25px rgba(214, 179, 106, 0.5);
}

.floating-btn-top:hover svg,
.floating-btn-top:hover i {
    transform: translateY(-2px);
    transition: transform 0.25s ease;
}

/* Luxury Frosted Tooltips */
.floating-tooltip {
    position: absolute;
    left: calc(100% + 12px);
    top: 50%;
    transform: translateY(-50%) translateX(-8px);
    background: rgba(10, 14, 20, 0.94);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(214, 179, 106, 0.4);
    color: #F7F4EF;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.3px;
    padding: 6px 14px;
    border-radius: 20px;
    white-space: nowrap;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.45);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.floating-contact-actions .floating-btn:hover .floating-tooltip {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

.floating-nav-actions .floating-tooltip {
    left: auto;
    right: calc(100% + 12px);
    transform: translateY(-50%) translateX(8px);
}

.floating-nav-actions .floating-btn:hover .floating-tooltip {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
    .floating-contact-actions {
        bottom: 18px;
        left: 16px;
        gap: 10px;
    }

    .floating-nav-actions {
        bottom: 18px;
        right: 16px;
    }

    .floating-btn {
        width: 46px;
        height: 46px;
        font-size: 20px;
    }

    .floating-btn-whatsapp {
        font-size: 23px;
    }

    .floating-tooltip {
        display: none !important;
    }
}