html {
  scroll-behavior: smooth;
}

/* Optional: Respect user system preferences for reduced motion */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}



.img-1
{
    border-radius:20px!important;
}


.tawk-min-container, .tawk-min-container .tawk-button {
  
    display:none!important;
}


.color1
{
    color:#f40103!important;
}

.color2
{
    color:#afa9a9!important;
}

.color2:hover
{
    color:#f40103!important;
}




a:hover {
    color:#f40103;
}



  /* ─────────────────────────────────────────
       CSS VARIABLES  (swap red shades here)
    ───────────────────────────────────────── */
    :root {
      --pf-red:        #f40103;
      --pf-red-dark:   #222934;
      --pf-red-light:  #fdf0f2;
      --pf-text:       #333333;
      --pf-subtext:    #777777;
      --pf-border:     #eeeeee;
      --pf-white:      #ffffff;
      --pf-shadow:     0 8px 32px rgba(0,0,0,0.18);
      --pf-radius:     14px;
      --pf-btn-size:   54px;
    }

    /* ─────────────────────────────────────────
       FLOATING TRIGGER BUTTON
    ───────────────────────────────────────── */
    #cta-trigger {
      position: fixed;
      bottom: 28px;
      right: 24px;
      width: var(--pf-btn-size);
      height: var(--pf-btn-size);
      border-radius: 50%;
      background: var(--pf-red);
      border: none;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 4px 18px rgba(232,23,58,0.45);
      z-index: 9999;
      transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
      outline: none;
    }
    #cta-trigger:hover {
      background: var(--pf-red-dark);
      transform: scale(1.08);
      box-shadow: 0 6px 24px rgba(232,23,58,0.55);
    }
    #cta-trigger i {
      color: var(--pf-white);
      font-size: 22px;
      transition: transform 0.35s cubic-bezier(.4,0,.2,1);
    }
    #cta-trigger.active i {
      transform: rotate(135deg);
    }

    /* Pulse ring */
    #cta-trigger::before {
      content: '';
      position: absolute;
      width: 100%;
      height: 100%;
      border-radius: 50%;
      border: 2px solid var(--pf-red);
      animation: pulse-ring 2s ease-out infinite;
    }
    @keyframes pulse-ring {
      0%   { transform: scale(1);   opacity: 0.7; }
      70%  { transform: scale(1.55); opacity: 0;   }
      100% { transform: scale(1.55); opacity: 0;   }
    }

    /* ─────────────────────────────────────────
       POPUP PANEL
    ───────────────────────────────────────── */
    #cta-panel {
      position: fixed;
      bottom: 94px;           /* sits just above the trigger */
      right: 24px;
      width: 310px;
      background: var(--pf-white);
      border-radius: var(--pf-radius);
      box-shadow: var(--pf-shadow);
      z-index: 9998;
      overflow: hidden;
      /* closed state */
      opacity: 0;
      transform: translateY(18px) scale(0.97);
      transform-origin: bottom right;
      pointer-events: none;
      transition:
        opacity     0.28s cubic-bezier(.4,0,.2,1),
        transform   0.28s cubic-bezier(.4,0,.2,1);
    }
    #cta-panel.open {
      opacity: 1;
      transform: translateY(0) scale(1);
      pointer-events: all;
    }

    /* Close (×) inside panel */
    #cta-close {
      position: absolute;
      top: 10px;
      right: 12px;
      background: none;
      border: none;
      font-size: 20px;
      color: #aaa;
      cursor: pointer;
      line-height: 1;
      padding: 0;
      z-index: 1;
      transition: color 0.15s;
    }
    #cta-close:hover { color: var(--pf-red); }

    /* ─────────────────────────────────────────
       OPTION ROWS
    ───────────────────────────────────────── */
    .cta-options {
      padding: 10px 0 4px;
    }

    .cta-option {
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 13px 20px;
      text-decoration: none;
      cursor: pointer;
      background: var(--pf-white);
      border: none;
      width: 100%;
      text-align: left;
      transition: background 0.18s;
    }
    .cta-option:hover {
      background: var(--pf-red-light);
    }
    .cta-option + .cta-option {
      border-top: 1px solid var(--pf-border);
    }

    /* Icon circle */
    .cta-icon {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      border: 1.5px solid var(--pf-border);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      background: var(--pf-white);
      transition: border-color 0.18s, background 0.18s;
    }
    .cta-option:hover .cta-icon {
      border-color: var(--pf-red);
      background: var(--pf-red-light);
    }
    .cta-icon i {
      font-size: 17px;
      color: var(--pf-text);
      transition: color 0.18s;
    }
    .cta-option:hover .cta-icon i {
      color: var(--pf-red);
    }

    /* Text */
    .cta-label {
      font-size: 13px;
      color: var(--pf-subtext);
      font-weight: 400;
      line-height: 1.2;
    }
    .cta-label span {
      font-size: 14.5px;
      font-weight: 600;
      color: var(--pf-red);
      display: block;
    }

    /* ─────────────────────────────────────────
       STILL NEED HELP  –  BOTTOM BANNER
    ───────────────────────────────────────── */
    .cta-help {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 14px 20px;
      background: var(--pf-red);
      cursor: pointer;
      text-decoration: none;
      transition: background 0.18s;
    }
    .cta-help:hover {
      background: var(--pf-red-dark);
    }
    .cta-help i {
      font-size: 22px;
      color: var(--pf-white);
      flex-shrink: 0;
    }
    .cta-help-text {
      line-height: 1.25;
    }
    .cta-help-text strong {
      display: block;
      font-size: 14.5px;
      font-weight: 700;
      color: var(--pf-white);
    }
    .cta-help-text small {
      font-size: 12px;
      color: rgba(255,255,255,0.82);
    }

    /* ─────────────────────────────────────────
       STAGGER ANIMATION for options
    ───────────────────────────────────────── */
    .cta-option,
    .cta-help {
      opacity: 0;
      transform: translateX(12px);
      transition:
        opacity   0.22s ease,
        transform 0.22s ease,
        background 0.18s;
    }
    #cta-panel.open .cta-option,
    #cta-panel.open .cta-help {
      opacity: 1;
      transform: translateX(0);
    }
    #cta-panel.open .cta-option:nth-child(1) { transition-delay: 0.07s; }
    #cta-panel.open .cta-option:nth-child(2) { transition-delay: 0.12s; }
    #cta-panel.open .cta-option:nth-child(3) { transition-delay: 0.17s; }
    #cta-panel.open .cta-help               { transition-delay: 0.22s; }




  :root {
            --primary-red: #F40103;
            --dark-base: #1C1C1C;
            --secondary-gray: #6E7074;
            --light-bg: #F2F2F2;
        }

    
        /* Animations */
        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(40px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeInLeft {
            from {
                opacity: 0;
                transform: translateX(-40px);
            }
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }

        @keyframes fadeInRight {
            from {
                opacity: 0;
                transform: translateX(40px);
            }
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }

        @keyframes float {
            0%, 100% {
                transform: translateY(0);
            }
            50% {
                transform: translateY(-15px);
            }
        }

        @keyframes shine {
            0% {
                transform: translateX(-100%);
            }
            100% {
                transform: translateX(100%);
            }
        }

        @keyframes gridMove {
            0% {
                transform: translate(0, 0);
            }
            100% {
                transform: translate(50px, 50px);
            }
        }

        /* Founder Section */
        .founder-section {
            background: #f5f7fa;
            padding: 100px 0;
            position: relative;
            overflow: hidden;
        }

      

        .bg-decoration {
            position: absolute;
            border-radius: 50%;
             
            filter: blur(60px);
        }

        .bg-decoration-1 {
            width: 400px;
            height: 400px;
            top: -100px;
            right: -100px;
            animation: float 8s ease-in-out infinite;
        }

        .bg-decoration-2 {
            width: 300px;
            height: 300px;
            bottom: -80px;
            left: -80px;
            animation: float 10s ease-in-out infinite 2s;
        }

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

        /* Section Header */
        .section-header {
            text-align: center;
            margin-bottom: 70px;
            animation: fadeInUp 0.8s ease-out;
        }

        .section-label {
            display: inline-block;
            background: var(--primary-red);
            color: white;
            padding: 8px 25px;
            border-radius: 50px;
            font-size: 0.85rem;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 1.5px;
            margin-bottom: 20px;
        }

        .section-title {
            font-size: 3rem;
            font-weight: 800;
            color: var(--dark-base);
            margin-bottom: 15px;
        }

        .section-subtitle {
            font-size: 1.1rem;
            color: var(--secondary-gray);
            max-width: 700px;
            margin: 0 auto;
        }

        /* Founder Bio Section */
        .founder-bio-wrapper {
            margin-bottom: 80px;
        }

        .founder-image-container {
            position: relative;
            animation: fadeInLeft 1s ease-out 0.3s backwards;
        }

        .founder-image-frame {
            position: relative;
            border-radius: 20px;
            overflow: hidden;
            
            border: 3px solid white;
        }

        .founder-image-frame::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
          
         
        }

        .founder-image-frame::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            height: 40%;
            background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
        }

        .founder-image {
            width: 100%;
            height: 550px;
            object-fit: cover;
            display: block;
        }

        .founder-name-overlay {
            position: absolute;
            bottom: 30px;
            left: 30px;
            right: 30px;
            z-index: 2;
            color: white;
        }

        .founder-name-overlay h3 {
            font-size: 2rem;
            font-weight: 700;
            margin-bottom: 5px;
        }

        .founder-name-overlay p {
            font-size: 1rem;
            color: var(--primary-red);
            margin: 0;
            font-weight: 600;
        }

        /* Achievement Badges */
        .achievement-badges {
            display: flex;
            gap: 15px;
            margin-top: 30px;
            flex-wrap: wrap;
        }

        .badge-item {
            background: white;
            border: 2px solid var(--primary-red);
            padding: 12px 20px;
            border-radius: 50px;
            color: var(--primary-red);
            font-size: 0.9rem;
            font-weight: 600;
            display: flex;
            align-items: center;
            gap: 8px;
            transition: all 0.3s ease;
        }

        .badge-item:hover {
            background: var(--primary-red);
            color: white;
            transform: translateY(-3px);
            box-shadow: 0 5px 15px rgba(244, 1, 3, 0.3);
        }

        /* Founder Content */
        .founder-content {
            animation: fadeInRight 1s ease-out 0.3s backwards;
        }

        .content-badge {
            display: inline-block;
            background: rgba(244, 1, 3, 0.1);
            color: var(--primary-red);
            padding: 6px 18px;
            border-radius: 50px;
            font-size: 0.8rem;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 1px;
            margin-bottom: 20px;
        }

        .founder-content h2 {
            font-size: 2.5rem;
            font-weight: 800;
            color: var(--dark-base);
            margin-bottom: 25px;
            line-height: 1.2;
        }

        .founder-content h2 span {
            color: var(--primary-red);
            position: relative;
        }

        .founder-content h2 span::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 10px;
            background: rgba(244, 1, 3, 0.2);
            z-index: -1;
        }

        .founder-bio-text {
            font-size: 1.05rem;
            line-height: 1.8;
          
            margin-bottom: 30px;
        }

        .founder-bio-text strong {
            color: var(--dark-base);
            font-weight: 600;
        }

        .highlight-box {
            background: white;
            border-left: 4px solid var(--primary-red);
            padding: 25px 30px;
            border-radius: 10px;
            margin-top: 30px;
             
        }

        .highlight-box p {
            color: var(--dark-base);
            margin: 0;
            font-size: 1rem;
            line-height: 1.6;
        }

        /* Founder Message Section */
        .founder-message-wrapper {
            background: white;
            border: 2px solid rgba(244, 1, 3, 0.2);
            border-radius: 30px;
            padding: 60px;
            position: relative;
            animation: fadeInUp 1s ease-out 0.6s backwards;
             
        }

        .quote-icon {
            position: absolute;
            top: 30px;
            left: 30px;
            font-size: 5rem;
            color: var(--primary-red);
            opacity: 0.15;
            font-family: Georgia, serif;
        }

        .message-header {
            margin-bottom: 35px;
            position: relative;
            z-index: 1;
        }

        .message-header h3 {
            font-size: 2rem;
            font-weight: 700;
            color: var(--dark-base);
            margin-bottom: 10px;
        }

        .message-label {
            color: var(--primary-red);
            font-size: 0.95rem;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        .message-content {
            position: relative;
            z-index: 1;
        }

        .message-content p {
            font-size: 1.1rem;
            line-height: 1.9;
            color: var(--secondary-gray);
            margin-bottom: 25px;
        }

        .message-signature {
            margin-top: 40px;
            padding-top: 30px;
            border-top: 2px solid var(--light-bg);
        }

        .signature-name {
            font-size: 1.4rem;
            font-weight: 700;
            color: var(--dark-base);
            margin-bottom: 5px;
        }

        .signature-title {
            font-size: 1rem;
            color: var(--primary-red);
            font-weight: 600;
            margin-bottom: 3px;
        }

        .signature-company {
            font-size: 0.95rem;
            color: var(--secondary-gray);
        }

        /* Decorative Elements */
        .decorative-line {
            width: 60px;
            height: 4px;
            background: var(--primary-red);
            margin-bottom: 20px;
        }

        /* Responsive */
        @media (max-width: 768px) {
            .section-title {
                font-size: 2.2rem;
            }

            .founder-content h2 {
                font-size: 2rem;
            }

            .founder-image {
                height: 400px;
            }

            .founder-name-overlay h3 {
                font-size: 1.5rem;
            }

            .founder-message-wrapper {
                padding: 40px 25px;
            }

            .quote-icon {
                font-size: 3rem;
            }

            .message-header h3 {
                font-size: 1.5rem;
            }

            .message-content p {
                font-size: 1rem;
            }

            .achievement-badges {
                justify-content: center;
            }
        }


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

.pt-150
{
    padding-top: 150PX;
}


::-webkit-scrollbar {
  background-color: #ccc;
  width: 8px;
}

::-webkit-scrollbar-thumb {
  background-color:#f40103;
}


.down_enquiry {

    background:#171e28;
    bottom: 0;
    position: fixed;
    width: 100%;
    z-index: 9999;
   
}



.down_enquiry ul {
    list-style-type: none;
    margin: 0;
    padding: 0
}

.down_enquiry ul li {
    float: left;
    text-align: center;
    width: 50%;
    border-right: 1px solid #fff;
}

.down_enquiry ul li:last-child {
    border-right: none
}

.down_enquiry ul li a {

    color: #fff;
    display: block;
    font-size: 14px;
    text-transform: uppercase;
    text-decoration: none;
    font-weight: 600;
    padding: 8px 0;
}

.down_enquiry ul li a:hover {
    color: #fff;
    background:#f40103;
}


#feedback {
    height: 0px;
    width: 65px;
    border-radius: 10px;
    position: fixed;
    right: 0;
    top: 70%;
    z-index: 1000;
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    text-transform: uppercase;

    -o-transform: rotate(-90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}


#feedback a {
    display: block;
    border: 1px solid white;
    border-radius: 10px;
    background:#171e28;
    height: 52px;
    padding-top: 4px;
    width: 150px;
    text-align: center;
    color: #fff;

    font-size: 16px;
     font-weight: 500!important;
 
    text-decoration: none;
    -webkit-animation: breathing 2s ease-out infinite normal;
    animation: breathing 2s ease-out infinite normal;
    -webkit-font-smoothing: antialiased
}

#feedback a:hover {
    background:#f40103;

    color: #fff;
    -webkit-animation: breathing 2s ease-out infinite normal;
    animation: breathing 2s ease-out infinite normal;
    -webkit-font-smoothing: antialiased
}


.float {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 40px;
    right: 15px;
    background-color: #318f31;
    color: #FFF !important;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    z-index: 100;

    border: 2px solid #fff;
}

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

.my-float {
    margin-top: 14px;
}
















/*============= COMMON CSS AREA ENDS===============*/
.image-anime {
  position: relative;
  overflow: hidden;
}

.image-anime:after {
  content: "";
  position: absolute;
  width: 200%;
  height: 0%;
  left: 50%;
  top: 50%;
  background-color: rgba(255, 255, 255, 0.3);
  transform: translate(-50%, -50%) rotate(-45deg);
  z-index: 1;
}

.image-anime:hover:after {
  height: 250%;
  transition: all 600ms linear;
  background-color: transparent;
}

.reveal {
  position: relative;
  display: -ms-inline-flexbox;
  visibility: hidden;
  overflow: hidden;
}

.reveal img {
  height: 100%;
  width: 100%;
  display: inline-block;
  -o-object-fit: cover;
  object-fit: cover;
  transform-origin: left;
}




/*======= keyframes & Animation =======*/
@-webkit-keyframes sticky {
    0% {
        top: -200px;
    }

    100% {
        top: 0;
    }
}

@keyframes sticky {
    0% {
        top: -200px;
    }

    100% {
        top: 0;
    }
}

@-webkit-keyframes float-bob-x {
    0% {
        -webkit-transform: translateX(-20px);
        transform: translateX(-20px);
    }

    50% {
        -webkit-transform: translateX(-10px);
        transform: translateX(-10px);
    }

    100% {
        -webkit-transform: translateX(-20px);
        transform: translateX(-20px);
    }
}

@keyframes float-bob-x {
    0% {
        -webkit-transform: translateX(-20px);
        transform: translateX(-20px);
    }

    50% {
        -webkit-transform: translateX(-10px);
        transform: translateX(-10px);
    }

    100% {
        -webkit-transform: translateX(-20px);
        transform: translateX(-20px);
    }
}

@-webkit-keyframes float-bob-y {
    0% {
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px);
    }

    50% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }

    100% {
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px);
    }
}

@keyframes float-bob-y {
    0% {
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px);
    }

    50% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }

    100% {
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px);
    }
}

@-webkit-keyframes preloader {
    0% {
        transform: perspective(160px) rotateX(0deg) rotateY(0deg);
        -webkit-transform: perspective(160px) rotateX(0deg) rotateY(0deg);
    }

    50% {
        transform: perspective(160px) rotateX(-180deg) rotateY(0deg);
        -webkit-transform: perspective(160px) rotateX(-180deg) rotateY(0deg);
    }

    100% {
        transform: perspective(160px) rotateX(-180deg) rotateY(-180deg);
        -webkit-transform: perspective(160px) rotateX(-180deg) rotateY(-180deg);
    }
}

@keyframes preloader {
    0% {
        transform: perspective(160px) rotateX(0deg) rotateY(0deg);
        -webkit-transform: perspective(160px) rotateX(0deg) rotateY(0deg);
    }

    50% {
        transform: perspective(160px) rotateX(-180deg) rotateY(0deg);
        -webkit-transform: perspective(160px) rotateX(-180deg) rotateY(0deg);
    }

    100% {
        transform: perspective(160px) rotateX(-180deg) rotateY(-180deg);
        -webkit-transform: perspective(160px) rotateX(-180deg) rotateY(-180deg);
    }
}

@-webkit-keyframes pulse-border {
    0% {
        -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
        opacity: 0;
    }
}

@keyframes pulse-border {
    0% {
        -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
        opacity: 0;
    }
}

.animate-float-bob-x {
    -webkit-animation-name: float-bob-x;
    animation-name: float-bob-x;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
}

.animate-float-bob-y {
    -webkit-animation-name: float-bob-y;
    animation-name: float-bob-y;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
}






.whatsapp-btn {
      position: fixed;
   left: 21px;
    bottom: 55px;
    width: 51px;
    height: 51px;
    cursor: pointer;
    text-align: center;
    z-index: 100;
    color: #fff;
    background: #4bc75a;
    font-size: 25px;
    padding-top: 5px;
    border-radius: 50%;
    text-align: center;
    line-height: 30px;
    padding-left: 0px;
    border: 2px solid #fff;
    padding-top: 9px;
}


.what {
   
   font-size: 16px;
    font-weight: 400;
    color: #fff;
    text-align: center;
    display: inline-block;
    min-width: 150px;
    min-height: 50px;
    line-height: 50px;
    -webkit-border-radius: 0;
    border-radius: 0;
    padding: 0 20px;
    background: #32b72b;
    color: #fff!important;
    text-transform: capitalize;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    font-family: 'Open Sans', sans-serif;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    
}




.whatsapp-btn::after{ z-index:-1; content:""; position:absolute; left:0px; top:0px; width:45px; height:45px; animation:ripple 1.6s ease-out infinite; opacity:1; background:#4bc75a; border-radius: 50%; -webkit-animation:ripple 1.6s ease-out infinite; }
    .whatsapp-btn a{color:#fff !important}
    .whatsapp-btn span{font-size:18px;position: relative;top: -8px;}
    @keyframes ripple {
    0%{transform:scale(0);opacity:1}
    100%{transform:scale(2.5);opacity:0}
    }



















































@media (min-width: 100px) and (max-width: 775px) {
    


.col-xs-6 {width: 50%!important}


    }







@media (min-width: 775px) and (max-width: 2820px) {
    .dontdisplaylg {
        display: none !important;
    }