.fr_img{width:66%}.dropdown-item{    border-left: 3px solid transparent;
    transition: border-color 0.15s ease, background-color 0.15s ease;
    padding-left: 1rem;font-family:var(--bs-body-font-family)!important}.nav-link{font-family:var(--bs-body-font-family)!important;font-size:1.3rem}.topper{background:#0389a5;background:linear-gradient(93deg,#0389a5 0%,#316e7a 100%)}.header-top-bar{background:var(--bs-primary);color:var(--bs-light);border-bottom:2px solid var(--bs-primary-border-subtle,#b6e0f7);font-size:.95rem}.header-top-bar a{color:var(--bs-light);text-decoration:none;transition:color 0.2s}.header-top-bar a:hover{color:var(--bs-primary-emphasis,#fff)}.header-top-bar .fa-whatsapp{color:#25d366}.header-top-bar .fa-envelope{color:var(--bs-primary)}.sls_logo{background-color:#fff;margin:5px auto 2px;padding:2px;width:355px;max-width:90vw;opacity:1;border:7px solid #009ab9;border-top-left-radius:80px;border-top-right-radius:80px;border-bottom-left-radius:80px;border-bottom-right-radius:80px;display:flex;justify-content:center;align-items:center}.sls_logo img{width:100%;height:auto;max-height:120px;-o-object-fit:contain;object-fit:contain;display:block}@media (max-width:991.98px){.sls_logo{margin-left:auto!important;margin-right:auto!important}}@media (max-width:575.98px){.sls_logo{width:98vw;max-width:98vw;border-width:4px;margin-left:auto!important;margin-right:auto!important}.sls_logo img{max-height:120px}}@media (min-width:992px){.sls_logo.ms-lg-3{margin-left:1rem!important}.me-lg-3{margin-right:1rem!important}}.navbar-nav{gap:.5rem}@media (max-width:9928px){.header-top-bar .col-md-6{justify-content:center!important;text-align:center!important}.navbar-nav{gap:0}}@media (max-width:575.98px){.header-top-bar{font-size:.85rem;padding:.3rem 0}.navbar-toggler{margin-left:auto;margin-right:auto;display:block;float:none}}.navbar.bg-white{box-shadow:0 2px 8px rgb(0 0 0 / .03);font-family:sans-serif;font-size:1.2em}.dropdown-menu{ border-top: 3px solid var(--bs-primary);
    border-radius: 0 0 0.5rem 0.5rem;min-width:180px}.gap-3>*{margin-right:1rem}.style1{margin-top:0;padding-top:0}.style2{margin-top:0}.style4{margin-top:0}body{background-size:auto 100vh;height:100%;margin:0;display:flex;flex-direction:column;min-height:100vh}main{flex:1}footer{background:#bebebe;color:#fff;padding:1rem;text-align:center}main.container{background:rgb(255 255 255 / .96) url(../images/background_content.jpg) no-repeat top center;background-size:cover;border-radius:1.5rem;box-shadow:0 .5rem 2rem rgb(0 0 0 / .07);padding-top:2rem;padding-bottom:2rem}@media (max-width:991.98px){main.container{background-size:auto 100%;border-radius:.5rem;padding-top:1rem;padding-bottom:1rem}.fr_img{width:80%}}.row.text-center.mb-5{background:url(../images/feature_bg.jpg) repeat-x top center;background-size:cover;border-radius:1rem;padding:2rem 1rem;margin-bottom:2rem}.row.align-items-center.mb-5{background:url(../images/mainfeature_bg.jpg) no-repeat center center;background-size:cover;border-radius:1rem;padding:2rem 1rem;margin-bottom:2rem}.row.text-center.mb-5+.row.text-center.mb-5{background:url(../images/statistics_bg.jpg) repeat-x top center;background-size:cover;border-radius:1rem;padding:2rem 1rem;margin-bottom:2rem}.mb-5>.row.g-4.justify-content-center{background:url(../images/clients_bg.jpg) repeat-x top center;background-size:cover;border-radius:1rem;padding:2rem 1rem;margin-bottom:2rem}footer.bg-dark{background:#1a232a url(../images/footer_bg.jpg) repeat-x top center!important;background-size:cover}.menu-1{color:#fff}.menu-1:hover{background-color:#116e81;color:#fff;transition-duration:1s;transition-property:background-color}.main_top{background-image:url(../images/slide1_bkg.jpg);background-size:cover;background-position:50%}.main_top_temp{background-image:url(../images/services_bkg.jpg);background-size:cover;min-height:500px;background-position:50%}.main_top_no_min{background-image:url(../images/services_bkg.jpg);background-size:cover;background-position:50%;height:auto}.main_1{background-size:cover;background-attachment:fixed;min-height:700px;background-position:50%;background-image:url(../images/image1.jpg)}.main_3{background-size:cover;background-attachment:fixed;min-height:700px;background-position:50%;background-image:url(../images/lift-and-shift-services.jpg)}.t_shad{text-shadow:2px 2px 12px #0000004a}.w_border{border:solid}.bg-90{opacity:.93;border-radius:0 0 2em 2em}.bg-90-non{opacity:.93}.bg-1{opacity:1!important}@media (max-width:768px){.bg_main_br2{border-radius:0em!important}.bg_main_br3{border-radius:0em!important}.bg_main_br4{border-radius:0em!important}.bg_main_br5{border-radius:0em!important}.bg_main_br6{border-radius:0em!important}}.bg_main_br2{background-color:rgb(10 98 117 / .85);border-radius:1em}.bg_main_br3{background-color:rgb(12 70 16 / .85);border-radius:1em}.bg_main_br4{background-color:rgb(191 135 79 / .85);border-radius:1em}.bg_main_br5{background-color:rgb(99 12 12 / .716);border-radius:1em}.bg_main_br6{background-color:rgb(40 40 40 / .716);border-radius:1em}.bg_main_white{background-color:rgba(255, 255, 255, 0.716);border-radius:1em}.bg_main_br7{background-color:rgb(40 40 40 / .416);border-radius:1em;backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px)}.bg_main_br8{background-color:rgb(40 40 40 / .616);border-radius:1em;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}.secFeatureTitle{text-align:center;font-size:44px;font-weight:300;line-height:100%;margin:10px 0 10px 0;color:#101010;text-shadow:2px 2px 5px rgb(51 51 51 / .5);-moz-text-shadow:2px 2px 5px rgb(51 51 51 / .5);-webkit-text-shadow:2px 2px 5px rgb(51 51 51 / .5)}.t_outline{-webkit-text-stroke:1px rgb(0 0 0 / .2);paint-order:stroke fill}.img_brd{z-index:1}.hnd_pos{position:absolute;top:20px;right:10px;z-index:999}.crs_pos{position:absolute;top:20px;right:20px;z-index:999}.flexy{align-items:center;display:flex;justify-content:center}.img-center{display:block;margin-left:auto;margin-right:auto}input[type="checkbox"]{transform:scale(2,2)}.t_shad_none{text-shadow:none}.floating_button{position:fixed;bottom:5px;right:25px;z-index:9999}.cookie_box{color:#000;padding:1em;text-align:left;border-radius:10px;position:fixed;width:18rem;background-color:rgb(255 255 255 / .871);bottom:8px;left:8px;z-index:9999;overflow:hidden}.fade-up{opacity:0;transform:translateY(30px);transition:opacity 0.8s ease,transform 0.8s ease}.fade-up.visible{opacity:1;transform:translateY(0)}
   /* ===== FLOATING CONTACT WIDGET ===== */
    .fc-widget {
        position: fixed;
        min-width: 360px;
        max-width:800px;
        bottom: 24px;
        right: 24px;
        z-index: 1050;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 0;
        font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    }

    /* --- Menu items container --- */
    .fc-menu {
        display: flex;
        width:100%;
        flex-direction: column;
        align-items: flex-end;
        gap: 2px;
        margin-bottom: 14px;
        background-color:rgb(196 196 196 / 63%);
        border-top-left-radius:80px; 
        border-bottom-left-radius: 50px;
        -webkit-backdrop-filter: blur(5px);
                backdrop-filter: blur(5px);
    }

    /* --- Individual action row --- */
    .fc-item {
        display: flex;
        margin-bottom: 2px;
        align-items: center;
        gap: 12px;
        text-decoration: none !important;
        cursor: pointer;
        opacity: 0;
        transform: translateY(12px) scale(0.9);
        animation: fc-fadeIn 0.25s ease forwards;
    }

    .fc-item:nth-child(1) { animation-delay: 0.03s; }
    .fc-item:nth-child(2) { animation-delay: 0.07s; }
    .fc-item:nth-child(3) { animation-delay: 0.11s; }
    .fc-item:nth-child(4) { animation-delay: 0.15s; }

    @keyframes fc-fadeIn {
        to {
            opacity: 1;
            transform: translateY(0) scale(1);
        }
    }

    /* --- Text label pill --- */
    .fc-label {
        background:rgb(53 53 53 / 92%);
        color: #fff;
        font-size: 1rem;
        font-weight: 600;
        letter-spacing: 0.2px;
        padding: 10px 16px;
        border-radius: 8px;
        white-space: nowrap;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
        transition: background 0.2s;
    }

    .fc-item:hover .fc-label {
        background: rgba(14, 132, 147, 0.95);
    }

    /* --- Icon circle --- */
    .fc-icon {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.15rem;
        color: #fff;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
        transition: transform 0.2s, box-shadow 0.2s;
        flex-shrink: 0;
    }

    .fc-item:hover .fc-icon {
        transform: scale(1.08);
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
    }

    .fc-icon--phone    { background: #0e8493; }
    .fc-icon--whatsapp  { background: #25d366; }
    .fc-icon--message   { background: #3b82f6; }
    .fc-icon--enquiry   { background: #f97316; }

    /* --- Close label (appears above toggle when open) --- */
    .fc-close-label {
        font-size: 0.78rem;
        font-weight: 600;
        color: rgba(255, 255, 255, 0.9);
        margin-bottom: 6px;
        letter-spacing: 0.3px;
        text-align: right;
        padding-right: 4px;
    }

    /* --- Main toggle button --- */
    .fc-toggle {
        width: 80px;
        height: 80px;
        border-radius: 50%;
        border: none;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.35rem;
        color: #fff;
        cursor: pointer;
        box-shadow: 0 4px 14px rgba(14, 132, 147, 0.35);
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        position: relative;
        align-self: flex-end;
        outline: none;
        z-index: 1000;
    }

    .fc-toggle--default {
        background: linear-gradient(135deg, #0e8493 0%, #09719d 100%);
    }

    .fc-toggle--default:hover {
        transform: scale(1.06);
        box-shadow: 0 6px 20px rgba(14, 132, 147, 0.45);
    }

    .fc-toggle--close {
        background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
        box-shadow: 0 4px 14px rgba(220, 38, 38, 0.3);
    }

    .fc-toggle--close:hover {
        transform: scale(1.06);
        box-shadow: 0 6px 20px rgba(220, 38, 38, 0.4);
    }

    /* Subtle pulse on default state to draw attention */
    .fc-toggle--default::after {
        content: '';
        position: absolute;
        inset: -4px;
        border-radius: 50%;
        border: 2px solid rgba(14, 132, 147, 0.3);
        animation: fc-pulse 2.5s ease-in-out infinite;
    }

    @keyframes fc-pulse {
        0%, 100% { transform: scale(1); opacity: 1; }
        50% { transform: scale(1.15); opacity: 0; }
    }

    /* Kill pulse when menu is open */
    .fc-toggle--close::after {
        display: none;
    }

    /* --- Responsive --- */
    @media (max-width: 575px) {
        .fc-widget {
            bottom: 16px;
            right: 16px;
        }

        .fc-icon {
            width: 60px;
            height: 60px;
            font-size: 1.05rem;
        }

        .fc-toggle {
            width: 70px;
            height: 70px;
            font-size: 1.2rem;
        }

        .fc-label {
            font-size: 1rem;
            padding: 10px 13px;
        }
    }

    .dropdown-menu.two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-width: 480px;
}
.dropdown-menu.two-col .dropdown-header,
.dropdown-menu.two-col .dropdown-divider {
    grid-column: 1 / -1; /* span full width */
}


.dropdown-item:hover {
    border-left-color: var(--bs-primary); /* or your SLS brand colour */
    background-color: #f8f9fa;
}

/* ============================================================
   SLS Chatbot Widget — /css/chatbot.css
   Integrates with existing fc-widget contact menu.
   Adjust CSS variables to match your brand.
   Add Google Font to layout: DM Sans (400,500,600,700)
   ============================================================ */

:root {
  --chat-primary: #0e6673;
  --chat-primary-light: #107785;
  --chat-accent: #d4a843;
  --chat-accent-hover: #e0ba5a;
  --chat-bg: #ffffff;
  --chat-bubble-bot: #f2f4f7;
  --chat-bubble-user: #0e8493;
  --chat-text: #1a1a2e;
  --chat-text-light: #6b7280;
  --chat-border: #e5e7eb;
  --chat-radius: 16px;
  --chat-font: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --chat-shadow: 0 12px 40px rgba(15, 43, 68, 0.18);
}

/* ---- Chat Window (inside fc-widget) ---- */
.chat-window {
  width: 390px;
  z-index: 1000;
  max-height: 80vh;
  background: var(--chat-bg);
  border-radius: var(--chat-radius);
  box-shadow: var(--chat-shadow);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  animation: chat-slide-in 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

@keyframes chat-slide-in {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* ---- Header ---- */
.chat-header {
  background: var(--chat-primary);
  padding: 16px 18px;
  display: flex;
  align-items: center;
  gap: 12px;
  position: relative;
}

.chat-header-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--chat-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 14px;
  color: var(--chat-primary);
  flex-shrink: 0;
}

.chat-header-name {
  color: #fff;
  font-weight: 600;
  font-size: 15px;
  font-family: var(--chat-font);
}

.chat-header-status {
  color: rgba(255, 255, 255, 0.6);
  font-size: 12px;
  font-family: var(--chat-font);
  display: flex;
  align-items: center;
  gap: 5px;
  margin-top: 2px;
}

.chat-header-status::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #4ade80;
  display: inline-block;
}

/* Back to menu button */
.chat-back-btn {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.15);
  border: none;
  color: #fff;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  transition: background 0.2s;
}

.chat-back-btn:hover {
  background: rgba(255, 255, 255, 0.25);
}

/* ---- Messages ---- */
.chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 18px 14px 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: 80vh;
  scroll-behavior: smooth;
}

.chat-messages::-webkit-scrollbar {
  width: 5px;
}

.chat-messages::-webkit-scrollbar-thumb {
  background: #d1d5db;
  border-radius: 10px;
}

/* ---- Message rows ---- */
.chat-row {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  max-width: 88%;
  animation: msg-in 0.35s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
  opacity: 0;
}

.chat-row.bot {
  align-self: flex-start;
}

.chat-row.user {
  align-self: flex-end;
  flex-direction: row-reverse;
}

@keyframes msg-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.chat-avatar-small {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--chat-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 11px;
  color: var(--chat-primary);
  flex-shrink: 0;
  font-family: var(--chat-font);
}

.chat-row.user .chat-avatar-small {
  background: #e0e4ea;
  color: var(--chat-text-light);
}

.chat-bubble {
  padding: 11px 15px;
  font-size: 14px;
  line-height: 1.5;
  border-radius: 14px;
  font-family: var(--chat-font);
}

.chat-row.bot .chat-bubble {
  background: var(--chat-bubble-bot);
  color: var(--chat-text);
  border-bottom-left-radius: 4px;
}

.chat-row.user .chat-bubble {
  background: var(--chat-bubble-user);
  color: #fff;
  border-bottom-right-radius: 4px;
}

/* ---- Typing indicator ---- */
.chat-typing {
  display: none;
  align-self: flex-start;
  padding: 0 14px 8px;
  align-items: center;
  gap: 8px;
}

.chat-typing.show {
  display: flex;
}

.chat-typing-dots {
  background: var(--chat-bubble-bot);
  padding: 10px 16px;
  border-radius: 14px;
  border-bottom-left-radius: 4px;
  display: flex;
  gap: 5px;
}

.chat-typing-dots span {
  width: 7px;
  height: 7px;
  background: #9ca3af;
  border-radius: 50%;
  animation: dot-bounce 1.3s ease-in-out infinite;
}

.chat-typing-dots span:nth-child(2) {
  animation-delay: 0.15s;
}

.chat-typing-dots span:nth-child(3) {
  animation-delay: 0.3s;
}

@keyframes dot-bounce {
  0%, 60%, 100% {
    transform: translateY(0);
    opacity: 0.4;
  }
  30% {
    transform: translateY(-5px);
    opacity: 1;
  }
}

/* ---- Option buttons ---- */
.chat-actions {
  padding: 12px 14px 14px;
  border-top: 1px solid var(--chat-border);
  background: #fafbfc;
  border-radius: 0 0 var(--chat-radius) var(--chat-radius);
}

.chat-options {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.chat-option-btn {
  font-family: var(--chat-font);
  background: var(--chat-bg);
  border: 1.5px solid #d1d5db;
  color: var(--chat-text);
  padding: 9px 16px;
  border-radius: 24px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
  transition: all 0.2s ease;
  line-height: 1.3;
}

.chat-option-btn:hover {
  border-color: var(--chat-primary);
  background: var(--chat-primary);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 3px 10px rgba(15, 43, 68, 0.15);
}

.chat-option-btn:active {
  transform: translateY(0);
}

/* ---- Text input ---- */
.chat-input-area {
  display: none;
  padding: 12px 14px 14px;
  border-top: 1px solid var(--chat-border);
  background: #fafbfc;
  border-radius: 0 0 var(--chat-radius) var(--chat-radius);
  gap: 8px;
  align-items: center;
}

.chat-input-area.show {
  display: flex;
}

.chat-input-area input {
  flex: 1;
  font-family: var(--chat-font);
  padding: 10px 14px;
  border: 1.5px solid #d1d5db;
  border-radius: 10px;
  font-size: 14px;
  outline: none;
  transition: border-color 0.2s;
  background: #fff;
  box-sizing: border-box;
}

.chat-input-area input:focus {
  border-color: var(--chat-primary);
}

.chat-input-area input::-moz-placeholder {
  color: #9ca3af;
}

.chat-input-area input::placeholder {
  color: #9ca3af;
}

.chat-send-btn {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--chat-primary);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
  flex-shrink: 0;
}

.chat-send-btn:hover {
  background: var(--chat-primary-light);
}

.chat-send-btn svg {
  width: 18px;
  height: 18px;
  fill: #fff;
}

/* ---- Contact form ---- */
.chat-form {
  display: none;
  padding: 14px 14px 14px;
  border-top: 1px solid var(--chat-border);
  background: #fafbfc;
  border-radius: 0 0 var(--chat-radius) var(--chat-radius);
  flex-direction: column;
  gap: 8px;
}

.chat-form.show {
  display: flex;
}

.chat-form input {
  font-family: var(--chat-font);
  width: 100%;
  padding: 10px 14px;
  border: 1.5px solid #d1d5db;
  border-radius: 10px;
  font-size: 14px;
  outline: none;
  transition: border-color 0.2s;
  background: #fff;
  box-sizing: border-box;
}

.chat-form input:focus {
  border-color: var(--chat-primary);
}

.chat-form input::-moz-placeholder {
  color: #9ca3af;
}

.chat-form input::placeholder {
  color: #9ca3af;
}

/* ---- Callback time picker ---- */
.callback-times {
  display: none;
}

.callback-times.show {
  display: block;
}

.callback-times-label {
  font-size: 12px;
  font-weight: 500;
  color: var(--chat-text-light);
  margin-bottom: 6px;
  font-family: var(--chat-font);
}

.callback-times-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.callback-time-btn {
  font-family: var(--chat-font);
  background: #fff;
  border: 1.5px solid #d1d5db;
  padding: 7px 14px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  color: var(--chat-text);
}

.callback-time-btn:hover {
  border-color: var(--chat-primary);
}

.callback-time-btn.selected {
  background: var(--chat-primary);
  color: #fff;
  border-color: var(--chat-primary);
}

/* ---- Submit button ---- */
.chat-submit-btn {
  font-family: var(--chat-font);
  width: 100%;
  background: var(--chat-accent);
  color: var(--chat-primary);
  border: none;
  padding: 11px;
  border-radius: 10px;
  cursor: pointer;
  font-weight: 600;
  font-size: 14px;
  transition: background 0.2s;
  margin-top: 2px;
}

.chat-submit-btn:hover {
  background: var(--chat-accent-hover);
}

/* ---- Mobile ---- */
@media (max-width: 480px) {
  .chat-window {
    width: calc(100vw - 32px);
    max-height: 80vh;
  }

  .chat-messages {
    max-height: 80vh;
  }
}

.chat-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(15, 43, 68, 0.4);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 100;
  animation: backdrop-in 0.3s ease forwards;
}

@keyframes backdrop-in {
  from { opacity: 0; }
  to { opacity: 1; }
}