:root {
        --jgt-primary: #f59314;
        --jgt-dark: #000000;
        --jgt-text: #333333;
        --jgt-bg: #ffffff;
        --jgt-font: "Inter", sans-serif;
        --jgt-font-heading: "Oswald", sans-serif;
        --jgt-ease: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
      }

      * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        
        -webkit-tap-highlight-color: transparent;
      }

      html, body {
  scroll-behavior: auto;
}

      body {
        font-family: var(--jgt-font);
        background-color: var(--jgt-bg);
        color: var(--jgt-dark);
        overflow-x: hidden;
      }

      /* --- Navbar --- */
      .jgt-nav {
        display: flex;
        align-items: center;
        height: 90px;
        padding: 0 6%;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1000;
        background: transparent;
        transition: var(--jgt-ease);
      }

      .jgt-nav.scrolled {
        background: #ffffff !important;
        height: 75px;
        box-shadow: 0 4px 30px rgba(0, 0, 0, 0.08);
      }

      .jgt-logo-area {
        display: flex;
        align-items: center;
        gap: 15px;
        height: 100%;
      }

      .jgt-logo-area img {
        max-height: 60px;
        transition: 0.3s;
      }

      .jgt-divider {
        width: 1px;
        height: 30px;
        background: rgba(0, 0, 0, 0.1);
        margin: 0 15px;
      }

      /* Creative Menu Button */
      .jgt-menu-btn {
        display: flex;
        align-items: center;
        gap: 12px;
        cursor: pointer;
        padding: 8px 15px;
        border-radius: 50px;
        transition: var(--jgt-ease);
        position: relative;
        background: rgba(0, 0, 0, 0.03);
        border: 1px solid transparent;
      }

      .jgt-menu-btn:hover {
        background: #fff;
        /* border-color: var(--jgt-primary); */
        box-shadow:
          rgba(60, 64, 67, 0.3) 0px 1px 2px 0px,
          rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
      }

      .jgt-menu-text {
        text-transform: uppercase;
        font-weight: 800;
        letter-spacing: 1.5px;
        font-size: 0.75rem;
        color: var(--jgt-dark);
      }

      .hamburger-box {
        width: 35px;
        height: 35px;
        background: var(--jgt-dark);
        border-radius: 50%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 4px;
        transition: var(--jgt-ease);
      }

      .jgt-menu-btn:hover .hamburger-box {
        background: var(--jgt-primary);
        transform: rotate(90deg);
      }

      .hamburger-box span {
        height: 2px;
        width: 16px;
        background: #fff;
        transition: var(--jgt-ease);
        display: block;
      }

      .hamburger-box span:nth-child(2) {
        width: 10px;
        margin-left: auto;
        margin-right: 4px;
      }

      .jgt-menu-btn:hover span:nth-child(2) {
        width: 16px;
        margin: 0;
      }

      .jgt-nav-right {
        margin-left: auto;
        display: flex;
        align-items: center;
      }

      /* Buttons Styling */
      .jgt-btn-premium {
        background: var(--jgt-dark);
        color: white;
        padding: 14px 28px;
        text-decoration: none;
        font-weight: 700;
        text-transform: uppercase;
        font-size: 0.8rem;
        letter-spacing: 1px;
        display: flex;
        align-items: center;
        gap: 12px;
        transition: 0.4s ease;
        position: relative;
        overflow: hidden;
        border: 1px solid var(--jgt-dark);
        width: fit-content;
      }

      .jgt-btn-premium:hover {
        background: var(--jgt-primary);
        border-color: var(--jgt-primary);
        color: white;
        transform: translateY(-2px);
      }

      .shine-effect::after {
        content: "";
        position: absolute;
        top: -50%;
        left: -100%;
        width: 50%;
        height: 200%;
        background: rgba(255, 255, 255, 0.2);
        transform: rotate(30deg);
        transition: none;
      }

      .shine-effect:hover::after {
        left: 150%;
        transition: 0.7s ease-in-out;
      }

      /* --- Sidebar & Dropdown Styling --- */
      .jgt-sidebar {
        position: fixed;
        top: 0;
        left: -100%;
        width: 350px;
        height: 100vh;
        background: var(--jgt-bg);
        z-index: 2000;
        transition: var(--jgt-ease);
        padding: 40px;
        box-shadow: 20px 0 60px rgba(0, 0, 0, 0.1);
        overflow-y: auto;
      }

      .jgt-sidebar.active {
        left: 0;
      }

      .jgt-close-sidebar {
        display: inline-block; /* Fix for rotation alignment */
        width: 40px;
        height: 40px;
        line-height: 40px;
        text-align: center;
        font-size: 1.5rem;
        cursor: pointer;
        margin-bottom: 30px;
        transition: var(--jgt-ease);
        float: right; /* Align to top right */
      }

      /* Rotation fix: ab icon apni jagah shift nahi karega */
      .jgt-close-sidebar:hover {
        color: var(--jgt-primary);
        transform: rotate(90deg);
      }

      .sidebar-menu {
        list-style: none;
        clear: both;
      }
      .sidebar-item {
        border-bottom: 1px solid #f0f0f0;
      }
      .sidebar-link {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 20px 0;
        text-decoration: none;
        color: var(--jgt-dark);
        font-weight: 700;
        font-size: 1rem;
        transition: color 0.3s;
      }
      .sidebar-link:hover {
        color: var(--jgt-primary);
      }

      .sidebar-dropdown {
        height: 0;
        overflow: hidden;
        transition: var(--jgt-ease);
        list-style: none;
        background: #f9f9f9;
      }

      .sidebar-dropdown.open {
        height: auto;
        padding: 5px 0 15px 20px;
      }

      .sidebar-dropdown li a {
        display: block;
        padding: 10px 0;
        text-decoration: none;
        color: #666;
        font-size: 0.9rem;
        font-weight: 500;
        transition: 0.3s;
      }
      .sidebar-dropdown li a:hover {
        color: var(--jgt-primary);
        padding-left: 5px;
      }

      .jgt-overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.4);
        display: none;
        z-index: 1500;
      }

      /* --- Hero Section --- */
      .jgt-hero {
        height: 100vh;
        display: flex;
        align-items: center;
        position: relative;
        background: white;
        overflow: hidden;
      }

      .jgt-hero-content {
        width: 45%;
        padding: 0 6%;
        z-index: 10;
        margin-top: 40px;
      }

      .jgt-hero-content h1 {
        font-family: var(--jgt-font-heading);
        font-size: 60px !important;
        line-height: 0.9;
        text-transform: uppercase;
        margin-bottom: 20px;
        color: var(--jgt-dark);
        letter-spacing: 2px;
      }

      .sl{
        font-size: 80px;
        margin-top:20px;
      }

      .jgt-hero-content h1 span {
        color: var(--jgt-primary);
        display: block;
      }

      .jgt-hero-content p {
        font-size: 1rem;
        color: #666;
        max-width: 400px;
        margin-bottom: 35px;
        line-height: 1.5;
      }

      /* --- Slider --- */
      .jgt-hero-image-wrap {
        position: absolute;
        top: 0;
        right: 0;
        width: 58%;
        height: 100%;
        z-index: 1;
        clip-path: polygon(20% 0%, 100% 0%, 100% 100%, 0% 100%);
        overflow: hidden;
      }

      .slider-container {
        width: 100%;
        height: 100%;
        position: relative;
      }

      .slide {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        transition: opacity 1.5s ease-in-out;
      }

      .slide.active {
        opacity: 1;
      }

      .slide img {
        width: 100%;
        height: 100vh;
        object-fit: cover;
        display: block;
      }

      .desktop-img {
        display: block;
      }
      .mobile-img {
        display: none;
      }

      /* Mobile Responsive */
      @media (max-width: 1024px) {
        .jgt-nav {
          justify-content: space-between;
          height: 80px;
          background: rgba(255, 255, 255, 0.1);
        }
        .jgt-nav-right {
          display: none;
        }

        .jgt-logo-area {
          width: 100%;
          justify-content: space-between;
          flex-direction: row-reverse;
        }
        .jgt-menu-btn {
          order: 1;
        }
        .jgt-logo-area img {
          order: 2;
          margin-right: auto;
        }
        .jgt-divider {
          display: none;
        }

        .jgt-hero {
          position: relative;
        }
        .jgt-hero-image-wrap {
          width: 100%;
          height: 100%;
          position: absolute;
          top: 0;
          left: 0;
          clip-path: none;
        }
        .desktop-img {
          display: none;
        }
        .mobile-img {
          display: block;
        }

        .jgt-hero-content {
          width: 100%;
          height: 100%;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          text-align: center;
          padding: 0 10%;
          background: rgba(255, 255, 255, 0.75);
          backdrop-filter: blur(3px);
          margin-top: 0;
        }

        .jgt-hero-content h1 {
          font-size: 3.2rem;
          color: #000;
        }
        .jgt-hero-content p {
          color: #222;
          font-weight: 600;
          margin: 0 auto 30px;
        }

        .jgt-sidebar {
          width: 100%;
        }
      }
  












/* popup form css code  */


    
      :root {
        --tuition-primary-dark: #f59314; /* Deep Navy */
        --tuition-accent-blue: #f59314; /* Professional Blue */
        --tuition-text-main: #1e293b; /* Dark Slate */
        --tuition-text-muted: #64748b; /* Muted Gray */
        --tuition-bg-light: #f8fafc; /* Soft White */
        --tuition-border-color: #cbd5e1; /* Light Border */
        --tuition-overlay-bg: rgba(2, 6, 23, 0.85); /* Dark Overlay */
        --tuition-white: #ffffff;
        --tuition-close-bg: #f1f5f9; /* Light Gray for circle */
      }

      /* Premium Blur Overlay */
      .tuition-overlay-container {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: var(--tuition-overlay-bg);
        backdrop-filter: blur(12px);
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 9999;
        opacity: 0;
        visibility: hidden;
        transition: all 0.4s ease;
      }

      .tuition-overlay-active {
        opacity: 1;
        visibility: visible;
      }

      /* Compact & Sharp Modal Box */
      .tuition-modal-box {
        background-color: var(--tuition-white);
        width: 90%;
        max-width: 750px;
        display: flex;
        position: relative;
        box-shadow:
          0 0 40px rgba(0, 0, 0, 0.3),
          0 0 0 1px rgba(255, 255, 255, 0.1);
        transform: scale(0.95) translateY(10px);
        transition: all 0.5s cubic-bezier(0.2, 1, 0.3, 1);
        border: 1px solid var(--tuition-primary-dark);
        overflow: hidden;
      }

      .tuition-overlay-active .tuition-modal-box {
        transform: scale(1) translateY(0);
      }

      /* Form Section */
      .tuition-form-section {
        flex: 1.3;
        padding: 35px 40px;
        font-family: "Inter", system-ui, sans-serif;
        display: flex;
        flex-direction: column;
        justify-content: center;
      }

      /* Image Section with a sophisticated tint */
      .tuition-image-section {
        flex: 0.9;
        background-color: var(--tuition-primary-dark);
        position: relative;
        display: flex;
      }

      .tuition-image-section::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(45deg, rgba(15, 23, 42, 0.4), transparent);
      }

      .tuition-image-section img {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }

      /* Premium Circle Close Button */
      .tuition-close-btn {
        position: absolute;
        top: 12px;
        right: 12px;
        font-size: 20px;
        color: var(--tuition-primary-dark);
        cursor: pointer;
        border: 1px solid var(--tuition-border-color);
        background-color: var(--tuition-close-bg);
        width: 36px;
        height: 36px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%; /* Circle shape */
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        z-index: 100;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
      }

      .tuition-close-btn:hover {
        background-color: var(--tuition-primary-dark);
        color: var(--tuition-white);
        transform: rotate(90deg);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
      }

      /* Premium Headers */
      .tuition-header-title {
        color: var(--tuition-primary-dark);
        font-size: 26px;
        margin-bottom: 6px;
        font-weight: 800;
        letter-spacing: -0.5px;
        line-height: 1.2;
        text-transform: uppercase;
      }

      .tuition-sub-text {
        color: var(--tuition-text-muted);
        font-size: 13px;
        margin-bottom: 25px;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 1px;
        display: flex;
        align-items: center;
      }

      .tuition-sub-text::before {
        content: "";
        width: 20px;
        height: 2px;
        background: var(--tuition-accent-blue);
        margin-right: 8px;
      }

      /* Form Controls */
      .tuition-input-group {
        margin-bottom: 15px;
      }

      .tuition-field-label {
        display: block;
        font-size: 11px;
        font-weight: 700;
        color: #475569;
        margin-bottom: 6px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
      }

      .tuition-text-input,
      .tuition-select-field {
        width: 100%;
        padding: 12px 14px;
        border: 1px solid var(--tuition-border-color);
        border-radius: 0;
        font-size: 14px;
        font-weight: 500;
        box-sizing: border-box;
        transition: all 0.2s ease;
        color: var(--tuition-primary-dark);
        background: var(--tuition-bg-light);
      }

      .tuition-text-input:focus,
      .tuition-select-field:focus {
        outline: none;
        border-color: var(--tuition-primary-dark);
        background-color: var(--tuition-white);
        box-shadow: 4px 4px 0px rgba(15, 23, 42, 0.05);
      }

      /* Bold Luxury Button */
      .tuition-submit-button {
        width: 100%;
        background-color: var(--tuition-primary-dark);
        color: var(--tuition-white);
        padding: 15px;
        border: none;
        border-radius: 0;
        font-size: 13px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 1.5px;
        cursor: pointer;
        margin-top: 10px;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        position: relative;
        overflow: hidden;
      }

      .tuition-submit-button:hover {
        background-color: #1e293b;
        letter-spacing: 2px;
      }

      /* Success Message Overlay */
      .tuition-success-msg {
        display: none;
        text-align: center;
        padding: 20px;
        border: 1px solid var(--tuition-primary-dark);
        background: var(--tuition-bg-light);
        color: var(--tuition-primary-dark);
        font-weight: 700;
        font-size: 13px;
        letter-spacing: 1px;
      }

      /* Mobile Adjustments */
      @media (max-width: 640px) {
        .tuition-image-section {
          display: none;
        }
        .tuition-modal-box {
          max-width: 350px;
        }
        .tuition-form-section {
          padding: 30px 25px;
        }
        .tuition-header-title {
          font-size: 22px;
        }
        .tuition-close-btn {
          top: 10px;
          right: 10px;
        }
      }
    





















/* cursor section start  */



        :root {
            --edu-blue: #1d4ed8;
            --cap-color: #4b4b4b;
            --tassel-color: #f59e0b;
        }

        

        /* --- Education Cap Cursor Wrapper --- */
        #edu-cursor-container {
            position: fixed;
            top: 0;
            left: 0;
            pointer-events: none;
            z-index: 99999;
            display: flex;
            align-items: center;
            justify-content: center;
            /* Lerp smooth movement */
            transition: transform 0.1s ease-out; 
            will-change: transform;
        }

        .cap-svg {
            width: 40px;
            height: 40px;
            filter: drop-shadow(0 4px 6px rgba(0,0,0,0.1));
            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        }

        /* Tassel Animation */
        .tassel {
            transform-origin: top;
            transition: transform 0.3s ease;
        }

        /* Hover State: Graduation Toss Effect */
        body.is-hovering .cap-svg {
            transform: scale(1.5) rotate(-15deg) translateY(-10px);
            filter: drop-shadow(0 15px 20px rgba(29, 78, 216, 0.3));
        }

        body.is-hovering .tassel {
            animation: swingTassel 1s ease-in-out infinite;
        }

        @keyframes swingTassel {
            0%, 100% { transform: rotate(0deg); }
            50% { transform: rotate(30deg); }
        }

       

        .enroll-btn {
            margin-top: 30px;
            padding: 18px 45px;
            background-color: var(--edu-blue);
            color: white;
            border: none;
            border-radius: 12px;
            font-size: 1.1rem;
            font-weight: bold;
            box-shadow: 0 10px 20px rgba(29, 78, 216, 0.2);
        }

        /* Trailing Glow */
        #cursor-trail {
            position: fixed;
            width: 15px;
            height: 15px;
            background: rgba(245, 158, 11, 0.2);
            border-radius: 50%;
            pointer-events: none;
            z-index: 99998;
            filter: blur(5px);
        }




















        /* CSS Variables for unique naming and easy customization */
        :root {
            --brand-primary-cyan: #f59e0b;
            --brand-secondary-blue: #f59e0b;
            --brand-text-dark: #1f2937;
            --brand-glow-opacity: 0.5;
            --brand-font-main: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
            --draw-speed: 2s; /* Adjusted for a smoother infinite loop */
        }

       
        /* Container to hold the unique heading style */
        .unique-header-wrapper {
            text-align: center;
            padding: 20px;
            max-width: 90%;
            margin: auto;
        }

        /* The small uppercase text above the main heading */
        .unique-sub-label {
            display: block;
            color: var(--brand-secondary-blue);
            font-size: 14px;
            font-weight: 700;
            letter-spacing: 3px;
            margin-bottom: 8px;
            text-transform: uppercase;
            opacity: 0;
            animation: fadeIn 0.8s ease forwards 0.2s;
        }

        /* The main H2 heading with the glow effect */
        .unique-main-heading {
            position: relative;
            display: inline-block;
            font-size: clamp(2rem, 8vw, 3.5rem); /* Responsive font sizing */
            font-weight: 800;
            color: var(--brand-text-dark);
            margin: 0;
            padding: 0 15px;
            text-transform: uppercase;
            z-index: 1;
        }

        

        /* The stylized underline with Infinite Magnetic Drawing Effect */
        .unique-heading-underline {
            display: block;
            width: 100%;
            height: 4px;
            background: linear-gradient(90deg, transparent, var(--brand-secondary-blue) 15%, var(--brand-secondary-blue) 85%, transparent);
            margin-top: -5px;
            border-radius: 2px;
            transform: skewX(-15deg) scaleX(0); 
            transform-origin: center;
            /* Added infinite and alternate for continuous draw/erase effect */
            animation: magneticDraw var(--draw-speed) cubic-bezier(0.65, 0, 0.35, 1) infinite alternate;
        }

        /* Magnetic Draw Animation */
        @keyframes magneticDraw {
            0% {
                transform: skewX(-15deg) scaleX(0);
                filter: brightness(1.5);
                opacity: 0.5;
            }
            70% {
                transform: skewX(-15deg) scaleX(1.1); /* Magnetic overshoot */
                filter: brightness(1.2);
                opacity: 1;
            }
            100% {
                transform: skewX(-15deg) scaleX(1);
                filter: brightness(1);
                opacity: 1;
            }
        }

        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(5px); }
            to { opacity: 1; transform: translateY(0); }
        }

        @keyframes glowAppear {
            from { opacity: 0; transform: translate(-50%, -50%) scale(0.8); }
            to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
        }

        /* Responsive adjustments for smaller screens */
        @media (max-width: 480px) {
            .unique-sub-label {
                font-size: 11px;
                letter-spacing: 2px;
            }
            .unique-heading-underline {
                height: 3px;
            }
        }

























/* slider text section  */


    /* Unique CSS Variable Scope */
        #gt-edu-ticker-section {
            --gt-bg: #ffffff;
            --gt-text: #334155;
            --gt-primary: #f59e0b;
            --gt-accent: #ef4444;
            --gt-line: #f1eeee;
            --gt-speed: 40s;
        }

        #gt-edu-ticker-section {
            width: 100%;
            overflow: hidden;
            background: var(--gt-bg);
            padding: 25px 0;
            position: relative;
            border-top: 1px solid var(--gt-line);
            border-bottom: 1px solid var(--gt-line);
            display: flex;
            align-items: center;
            margin-top: 20px;
        }

        .gt-ticker-track {
            display: flex;
            align-items: center;
            width: max-content;
            animation: gt-scroll-anim var(--gt-speed) linear infinite;
        }

        .gt-ticker-track:hover {
            animation-play-state: paused;
        }

        .gt-ticker-item {
            display: flex;
            align-items: center;
            padding: 0 45px;
            white-space: nowrap;
            position: relative;
        }

        /* Unique Vertical Line Separator */
        .gt-ticker-item::after {
            content: "";
            position: absolute;
            right: 0;
            top: 50%;
            transform: translateY(-50%);
            height: 30px;
            width: 1px;
            background-color: var(--gt-line);
        }

        .gt-ticker-item i {
            font-size: 1.5rem;
            color: var(--gt-primary);
            margin-right: 15px;
        }

        /* Specific style for the 10 years highlight */
        .gt-ticker-item .gt-icon-highlight {
            color: var(--gt-accent);
        }

        .gt-ticker-item span {
            font-weight: 600;
            color: var(--gt-text);
            font-size: 1.15rem;
            letter-spacing: 0.2px;
        }

        .gt-ticker-item .gt-text-highlight {
            color: var(--gt-accent);
        }

        /* Unique Animation Name to avoid conflicts */
        @keyframes gt-scroll-anim {
            0% {
                transform: translateX(0);
            }
            100% {
                transform: translateX(-50%);
            }
        }

        /* Side Fades */
        .gt-fade-overlay-left,
        .gt-fade-overlay-right {
            content: "";
            height: 100%;
            position: absolute;
            width: 150px;
            z-index: 2;
            pointer-events: none;
            top: 0;
        }

        .gt-fade-overlay-left {
            left: 0;
            background: linear-gradient(to right, var(--gt-bg), transparent);
        }

        .gt-fade-overlay-right {
            right: 0;
            background: linear-gradient(to left, var(--gt-bg), transparent);
        }

        /* Responsive UI */
        @media (max-width: 768px) {
            .gt-ticker-item {
                padding: 0 30px;
            }
            .gt-ticker-item i {
                font-size: 1.3rem;
            }
            .gt-ticker-item span {
                font-size: 1rem;
            }
        }







        /* Scrollbar width */
::-webkit-scrollbar {
    width: 0px;
}






















/* about section start  */



        /* CSS Variables */
        :root {
            --ft-primary-orange: #f58220;
            --ft-text-black: #1a1a1a;
            --ft-text-gray: #555555;
            --ft-bg-white: #ffffff;
            --ft-ease-smooth: cubic-bezier(0.33, 1, 0.68, 1);
        }

       

        /* Main Section Wrapper */
        .ft-about-section {
            position: relative;
            width: 100%;
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 80px 0;
            background-color: var(--ft-bg-white);
            overflow: hidden;
        }

        /* Centered Container with Max Width */
        .ft-container {
            max-width: 1200px;
            width: 90%; /* For small padding on sides before breakpoint */
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1fr 1.1fr;
            gap: 60px;
            align-items: center;
            z-index: 5;
            position: relative;
        }

        /* Left Side: Image Content with Shine Animation */
        .ft-image-wrapper {
            position: relative;
            width: 100%;
            height: 550px;
            border-radius: 4px;
            overflow: hidden;
            box-shadow: 0 25px 50px rgba(0,0,0,0.1);
            background-color: #eee;
        }

        .ft-image-wrapper img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            transition: transform 0.8s var(--ft-ease-smooth);
        }

        /* Shine Effect Overlay */
        .ft-image-wrapper::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 50%;
            height: 100%;
            background: linear-gradient(
                to right, 
                rgba(255,255,255,0) 0%, 
                rgba(255,255,255,0.3) 50%, 
                rgba(255,255,255,0) 100%
            );
            transform: skewX(-25deg);
            z-index: 2;
            transition: none;
        }

        .ft-image-wrapper:hover img {
            transform: scale(1.08);
        }

        .ft-image-wrapper:hover::before {
            left: 150%;
            transition: all 0.7s var(--ft-ease-smooth);
        }

        /* Right Side: Text Content */
        .ft-content-box {
            position: relative;
        }

        .ft-subtitle {
            font-size: 13px;
            font-weight: 700;
            color: var(--ft-text-gray);
            margin-bottom: 12px;
            display: block;
            letter-spacing: 2px;
            text-transform: uppercase;
        }

        .ft-main-title {
            font-size: clamp(28px, 4vw, 42px);
            font-weight: 800;
            color: var(--ft-text-black);
            line-height: 1.1;
            margin-bottom: 25px;
            text-transform: uppercase;
        }

        .ft-highlight {
            color: var(--ft-primary-orange);
        }

        .ft-description {
            font-size: 15px;
            line-height: 1.8;
            color: var(--ft-text-gray);
            margin-bottom: 35px;
        }

        .ft-read-more {
            display: inline-flex;
            align-items: center;
            font-weight: 800;
            text-decoration: none;
            color: var(--ft-text-black);
            text-transform: uppercase;
            font-size: 13px;
            letter-spacing: 1px;
            gap: 12px;
            position: relative;
            padding-bottom: 8px;
            transition: color 0.3s ease;
        }

        .ft-read-more::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 40px;
            height: 2px;
            background-color: var(--ft-primary-orange);
            transition: width 0.3s ease;
        }

        .ft-read-more:hover {
            color: var(--ft-primary-orange);
        }

        .ft-read-more:hover::after {
            width: 100%;
        }

       

        /* Responsive Breakpoints */
        @media (max-width: 1024px) {
            .ft-container {
                grid-template-columns: 1fr;
                gap: 50px;
                text-align: left;
                width: 90%;

            }
            .ft-image-wrapper {
                height: 450px;
                max-width: 700px;
                margin: 0 auto;
            }
            .ft-read-more {
                justify-content: left;
            }
        }

        /* Mobile Version - Hide Watermark */
        @media (max-width: 768px) {
           
            .ft-about-section {
                padding: 60px 0;
            }
            .ft-image-wrapper {
                height: 350px;
            }
            .ft-main-title {
                font-size: 28px;
            }
        }






















/* slider course card  */



        :root {
            --eap-bg-white: #ffffff;
            --eap-primary-blue: #f58220;
            --eap-dark-navy: #0f172a;
            --eap-soft-gray: #f8fafc;
            --eap-accent-orange: #f59e0b;
            --eap-max-w: 1200px;
        }

        
        .eap-main-container {
            max-width: var(--eap-max-w);
            margin: 0 auto;
            padding: 80px 0;
        }

        /* Main Flex Grid */
        .eap-content-grid {
            display: flex;
            gap: 30px; 
            align-items: stretch; 
        }

        /* Left Banner with Image Background & Blur */
        .eap-side-banner {
            width: 260px; 
            position: relative;
            background: var(--eap-dark-navy);
            overflow: hidden;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            height: 500px !important;
            padding: 40px 20px;
            color: white;
            text-align: center;
            /* box-shadow: 0 20px 40px rgba(15, 23, 42, 0.15); */
            flex-shrink: 0;
            z-index: 5; 
        }

        /* Background Image */
        .eap-banner-bg {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: url('slider1.jpg');
            background-size: cover;
            background-position: center;
            filter: blur(1px) brightness(0.4); 
            z-index: 1;
        }

        .eap-banner-content {
            position: relative;
            z-index: 2;
        }

        .eap-side-banner .eap-num {
            font-size: 3.5rem;
            font-weight: 800;
            color: var(--eap-accent-orange);
            line-height: 1;
            text-shadow: 0 10px 20px rgba(0,0,0,0.5);
        }

        .eap-side-banner .eap-sub {
            text-transform: uppercase;
            letter-spacing: 2px;
            font-size: 0.75rem;
            font-weight: 700;
            margin-top: 12px;
            color: #fff;
        }

        .eap-side-banner .eap-divider {
            width: 40px;
            height: 3px;
            background: var(--eap-accent-orange);
            margin: 20px auto;
            border-radius: 10px;
        }

        /* Slider Wrapper */
        .eap-slider-wrap {
            flex: 1;
            display: flex;
            flex-direction: column;
            min-width: 0; 
            position: relative;
        }

        /* Badge Heading */
        .eap-badge-header {
            display: inline-flex;
            align-items: center;
            background: var(--eap-soft-gray);
            border: 1px solid #e2e8f0;
            padding: 10px 20px;
            border-radius: 100px;
            margin-bottom: 15px;
            width: fit-content;
        }

        .eap-badge-header .eap-tag {
            background: var(--eap-primary-blue);
            color: white;
            padding: 4px 10px;
            border-radius: 20px;
            font-size: 0.65rem;
            font-weight: 800;
            text-transform: uppercase;
            margin-right: 12px;
        }

        .eap-badge-header h1 {
            font-size: 1.1rem;
            font-weight: 700;
            color: var(--eap-dark-navy);
            margin: 0;
        }

        /* Viewport Fix */
        .eap-viewport {
            overflow: visible; 
            flex: 1;
            padding: 25px 5px 40px 5px; 
            margin-left: 0; 
            clip-path: inset(-50px -50px -50px 0px); 
        }

        .eap-slider-track {
            display: flex;
            gap: 20px;
            height: 100%;
            transition: transform 0.8s cubic-bezier(0.65, 0, 0.35, 1);
            will-change: transform;
        }

        /* Modern Cards */
        .eap-card {
            min-width: calc(33.333% - 13.5px); 
            background: white;
            padding: 35px 25px;
            border: 1px solid #f1f5f9;
            transition: all 0.4s ease;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
            min-height: 380px;
            position: relative;
        }

        .eap-card:hover {
            border-color: var(--eap-primary-blue);
           
            z-index: 20; 
        }

        .eap-card-icon {
            width: 45px;
            height: 45px;
            background: var(--eap-soft-gray);
            border-radius: 12px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.4rem;
            margin-bottom: 20px;
        }

        .eap-card h3 {
            font-size: 1.4rem;
            font-weight: 800;
            margin-bottom: 12px;
            letter-spacing: -0.5px;
        }

        .eap-card p {
            font-size: 0.9rem;
            color: #64748b;
            line-height: 1.5;
            margin-bottom: 20px;
        }

        
        /* Controls */
        .eap-nav-footer {
            margin-top: 5px;
            display: flex;
            justify-content: flex-end;
            gap: 10px;
        }

        .eap-nav-btn {
            width: 45px;
            height: 45px;
            border-radius: 50%;
            border: 1px solid #e2e8f0;
            background: white;
            cursor: pointer;
            transition: 0.3s;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1rem;
        }

        .eap-nav-btn:hover {
            background: var(--eap-primary-blue);
            color: white;
            border-color: var(--eap-primary-blue);
        }

        @media (max-width: 1100px) {
            .eap-card { min-width: calc(50% - 10px); }
        }

        @media (max-width: 850px) {

            .eap-main-container { padding: 0 15px; }
            .eap-content-grid { flex-direction: column; gap: 20px; }
            .eap-side-banner { width: 100%; flex-direction: row; height: auto; gap: 20px; padding: 25px; border-radius: 20px; }
            .eap-side-banner .eap-divider { width: 2px; height: 30px; margin: 0; }
            .eap-side-banner .eap-num { font-size: 2.5rem; }
            .eap-card { min-width: 100%; min-height: auto; border-radius: 20px; padding: 30px 20px; }
            .eap-viewport { 
                clip-path: none; 
                overflow: hidden; 
                padding: 10px 5px 20px 5px; 
                margin: 0;
            }
            .eap-slider-track { gap: 15px; }
            .eap-nav-footer { justify-content: center; margin-top: 20px !important; margin-bottom: 20px !important; }
        }














/* reslut sectionm start  */



        :root {
            --primary-color: #2c3e50;
            --bg-color: #f4f7f6;
            --white: #ffffff;
        }

        
       
        /* Gallery Grid Layout */
        .results-container {
            display: grid;
            grid-template-columns: repeat(3, 1fr); /* Ek row mein 3 items */
            gap: 25px;
            max-width: 1200px;
            width: 100%;
            margin: 0 auto;
        }

        /* Tablet View: 2 items per row */
        @media (max-width: 768px) {
            .results-container {
                grid-template-columns: repeat(2, 1fr);
            }
        }

        /* Mobile View: 1 item per row */
        @media (max-width: 480px) {
            .results-container {
                grid-template-columns: 1fr;
            }
        }

        /* Image Card Styling */
        .result-card {
            position: relative;
            padding: 10px;
            background: var(--white);
            /* border-radius: 12px; */
            overflow: hidden;
            box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
            cursor: pointer;
            transition: transform 0.3s ease;
            aspect-ratio: 3 / 4; /* Vertical size setting */
        }

        .result-card:hover {
            transform: translateY(-5px);
            border: 1px solid #f58220;
            transition: 0.5s;
        }

        .result-card img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

        /* Shine Effect Overlay */
        .result-card::after {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 50%;
            height: 100%;
            background: linear-gradient(
                to right, 
                rgba(255,255,255,0) 0%, 
                rgba(255,255,255,0.3) 50%, 
                rgba(255,255,255,0) 100%
            );
            transform: skewX(-25deg);
            transition: none;
        }

        .result-card:hover::after {
            left: 150%;
            transition: all 0.6s ease;
        }

        /* Modal / Popup Styling */
        .modal {
            display: none;
            position: fixed;
            z-index: 1000;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0,0,0,0.9);
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.3s ease;
        }

        .modal.show {
            display: flex;
            opacity: 1;
        }

        .modal-content {
            max-width: 90%;
            max-height: 90vh;
            border-radius: 8px;
            box-shadow: 0 0 30px rgba(255,255,255,0.2);
            transform: scale(0.7);
            transition: transform 0.3s ease;
        }

        .modal.show .modal-content {
            transform: scale(1);
        }

        .close-btn {
            position: absolute;
            top: 20px;
            right: 30px;
            color: #fff;
            font-size: 40px;
            font-weight: bold;
            cursor: pointer;
        }

        .caption {
            position: absolute;
            bottom: 20px;
            color: orange;
            font-size: 1.2rem;
            text-align: center;
            margin-top: 10px;
        }





        @media (max-width: 992px) {
  .results-container {
    padding: 20px !important;
  }
        }


















/* student review section  */

        :root {
            --primary-blue: #f58220;
            --bg-light: #f4f7fe;
            --card-white: #ffffff;
            --star-gold: #ffc107;
            --text-main: #333333;
            --transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
        }


        #dl-testimonial-container {
            max-width: 1200px;
            /* padding: 50px 20px; */
            margin: 0 auto;
            position: relative;
        }

        

        /* --- Slider Container & Track --- */
        .dl-slider-container {
            overflow: hidden;
            width: 100%;
            padding: 20px 0 40px 0;
        }

        .dl-slider-wrapper {
            display: flex;
            transition: var(--transition);
            gap: 25px;
        }

        /* --- Testimonial Card --- */
        .dl-card-unit {
            flex: 0 0 calc(33.333% - 17px); /* Desktop: 3 cards display */
            display: flex;
            flex-direction: column;
            align-items: center;
            margin-bottom: 20px;
        }

        .dl-review-box {
            background: var(--card-white);
            /* border-radius: 15px; */
            padding: 40px 25px 30px 25px;
            position: relative;
            box-shadow: 0 10px 20px rgba(0,0,0,0.05);
            text-align: center;
            margin-bottom: 25px;
            border: 1px solid #eee;
            width: 100%;
        }

        /* Top Star Badge */
        .dl-star-badge {
            position: absolute;
            top: -18px;
            left: 50%;
            transform: translateX(-50%);
            background: white;
            padding: 5px 20px;
            border-radius: 8px;
            box-shadow: 0 4px 10px rgba(0,0,0,0.1);
            display: flex;
            gap: 3px;
            border: 1px solid #f0f0f0;
        }

        .dl-star {
            color: var(--star-gold);
            font-size: 14px;
        }

        /* Bottom Pointer Arrow */
        .dl-review-box::after {
            content: '';
            position: absolute;
            bottom: -12px;
            left: 50%;
            transform: translateX(-50%);
            border-left: 15px solid transparent;
            border-right: 15px solid transparent;
            border-top: 15px solid var(--card-white);
        }

        .dl-comment-text {
            font-size: 0.95rem;
            line-height: 1.7;
            color: var(--text-main);
            font-weight: 400;
        }

        /* User Info Section */
        .dl-user-meta {
            text-align: center;
            position: relative;
        }

        .dl-avatar-wrapper {
            position: relative;
            width: 85px;
            height: 85px;
            margin: 0 auto 12px auto;
        }

        .dl-user-img {
            width: 100%;
            height: 100%;
            border-radius: 50%;
            object-fit: cover;
            border: 4px solid white;
            box-shadow: 0 5px 15px rgba(0,0,0,0.1);
            transition: var(--transition);
        }

        /* Video Play Button Overlay */
        .dl-video-trigger {
            position: absolute;
            bottom: 0;
            right: 0;
            background: var(--primary-blue);
            color: white;
            width: 30px;
            height: 30px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            font-size: 12px;
            border: 2px solid white;
            transition: var(--transition);
        }

        .dl-video-trigger:hover {
            transform: scale(1.1);
            background: #2a3a8c;
        }

        .dl-user-name {
            color: var(--primary-blue);
            font-weight: 700;
            font-size: 1.1rem;
            margin-top: 5px;
        }

        /* --- Slider Dots --- */
        .dl-dots-container {
            display: flex;
            justify-content: center;
            gap: 8px;
            margin-top: 20px;
        }

        .dl-dot {
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background: #ccc;
            cursor: pointer;
            transition: 0.3s;
        }

        .dl-dot.active {
            background: var(--primary-blue);
            width: 25px;
            border-radius: 10px;
        }

        /* --- Video Display Window (Popup) --- */
        #dl-video-display-window {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,0.85);
            display: none;
            justify-content: center;
            align-items: center;
            z-index: 9999;
            backdrop-filter: blur(5px);
        }

        .dl-window-content {
            width: 90%;
            max-width: 800px;
            background: #000;
            border-radius: 12px;
            position: relative;
            aspect-ratio: 16/9;
        }

        .dl-close-window {
            position: absolute;
            top: -40px;
            right: 0;
            color: white;
            font-size: 30px;
            cursor: pointer;
            font-weight: bold;
        }

        iframe {
            width: 100%;
            height: 100%;
            border-radius: 12px;
        }

        /* Responsive */
        @media (max-width: 992px) {
            .dl-card-unit {
                flex: 0 0 calc(50% - 13px); /* Tablet: 2 cards */
            }
        }

        @media (max-width: 768px) {
            .dl-card-unit {
                flex: 0 0 100%; /* Mobile: 1 card */
            }
           
        }















      
      /* Footer Main Styles */
      footer {
        background-color: #111111; /* Deep Academic Blue */
        color: #ffffff;
        position: relative;
        padding-top: 60px; /* Space for the slanted top */
        padding-bottom: 20px;
        width: 100%;
        overflow: hidden;
      }

      /* Slanted Top Shape */
      footer::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 80px;
        background-color: #fff; /* Match page background */
        clip-path: polygon(0 0, 100% 0, 100% 20%, 0 100%);
        border-top: 1px solid white;
      }

      .footer-container {
        max-width: 1200px;
        margin: 0 auto;
        /* padding: 0 0px; */
      }

      /* Top Bar Section */
      .footer-top-bar {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-bottom: 30px;
        border-bottom: 1px solid #34495e;
        margin-bottom: 40px;
        flex-wrap: wrap;
        gap: 20px;
      }

      /* White Logo Shape */
      .logo-wrapper {
        background: #ffffff;
        padding: 10px 25px;
        border-radius: 4px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 80px;
      }

      .logo-wrapper img {
        max-height: 45px;
        width: auto;
        display: block;
      }

      .tagline {
        color: #bdc3c7;
        font-size: 13px;
        text-transform: uppercase;
        letter-spacing: 1px;
        margin-left: 20px;
      }

      .social-icons {
        display: flex;
        gap: 15px;
      }

      .social-icons a {
        color: #ffffff;
        text-decoration: none;
        font-size: 20px;
        transition: all 0.3s;
        opacity: 0.7;
        width: 40px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.1);
      }

      .social-icons a:hover {
        color: #ffffff;
        background-color: #f58220; /* Education Blue */
        opacity: 1;
        transform: translateY(-3px);
      }

      /* Grid Section */
      .footer-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 30px;
        margin-bottom: 50px;
      }

      .footer-column h3 {
        font-size: 18px;
        margin-bottom: 25px;
        position: relative;
        padding-bottom: 10px;
      }

      /* Blue accent line under headers */
      .footer-column h3::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 40px;
        height: 2px;
        background-color: #f58220;
      }

      .footer-column ul {
        list-style: none;
      }

      .footer-column ul li {
        margin-bottom: 12px;
        display: flex;
        align-items: flex-start;
      }

      .footer-column ul li a {
        color: #bdc3c7;
        text-decoration: none;
        font-size: 14px;
        transition: color 0.3s;
        display: flex;
        align-items: center;
      }

      .footer-column ul li a::before {
        content: "\f19d"; /* FontAwesome Graduation Cap icon */
        font-family: "Font Awesome 6 Free";
        font-weight: 900;
        font-size: 10px;
        margin-right: 8px;
        color: #f58220;
      }

      .footer-column ul li a:hover {
        color: #f58220;
      }

      /* Contact Items */
      .contact-item {
        display: flex;
        gap: 12px;
        margin-bottom: 15px;
        font-size: 14px;
        color: #bdc3c7;
        line-height: 1.5;
      }

      .contact-icon {
        color: #f58220;
        flex-shrink: 0;
        font-size: 16px;
        width: 20px;
        text-align: center;
      }

      /* Call Button */
      .call-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #f58220;
        color: white;
        padding: 12px 25px;
        text-decoration: none;
        border-radius: 4px;
        font-weight: bold;
        margin-top: 20px;
        transition: background 0.3s;
        gap: 10px;
      }

      .call-btn:hover {
        background-color: #2980b9;
      }

      /* Bottom Copyright Section */
      .footer-bottom {
        border-top: 1px solid #34495e;
        padding-top: 20px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 13px;
        color: #7f8c8d;
        flex-wrap: wrap;
        gap: 15px;
      }

      .footer-bottom-links a {
        color: #7f8c8d;
        text-decoration: none;
        margin: 0 10px;
      }

      .footer-bottom-links a:hover {
        color: #ffffff;
      }

      .credits a {
        color: #f58220;
        text-decoration: none;
      }

      /* Responsive Breakpoints */
      @media (max-width: 1024px) {
        .footer-grid {
          grid-template-columns: repeat(2, 1fr);
        }
      }

      @media (max-width: 768px) {
        footer::before {
          height: 40px;
          clip-path: polygon(0 0, 100% 0, 100% 50%, 0 100%);
        }

        .footer-container{
          padding: 20px;
        }
        .footer-top-bar {
          flex-direction: column;
          align-items: flex-start;
        }

        .tagline {
          margin-left: 0;
          margin-top: 10px;
        }

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

        .footer-bottom {
          flex-direction: column;
          text-align: center;
        }
      }





























      /* direcotr desk start  */


      
        :root {
            --primary-color: #1a2a6c;
            --secondary-color: #f2a154;
            --text-dark: #333;
            --text-light: #666;
            --bg-light: #ffffff; /* Changed to white for seamless look */
        }

        body {
            margin: 0;
            /* font-family: 'Poppins', sans-serif; */
            background-color: #fff;
        }

        /* Main Section Container - No Outer Box */
        .dd-exclusive-section {
            padding: 60px 5%;
            background-color: var(--bg-light);
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .dd-container-wrapper {
            max-width: 1200px;
            width: 100%;
            display: flex;
            flex-wrap: wrap;
            gap: 60px;
            align-items: center;
            /* Box-shadow and Background removed as per request */
        }

        /* Left Side: Image Styling */
        .dd-image-column {
            flex: 1;
            min-width: 300px;
            position: relative;
        }

        .dd-image-frame {
            position: relative;
            z-index: 2;
            /* border-radius: 20px; */
            overflow: hidden;
            line-height: 0;
        }

        .dd-image-frame img {
            width: 100%;
            height: 580px !important;
            object-fit: cover;
            filter: grayscale(20%);
            transition: all 0.5s ease;
        }

        .dd-image-frame:hover img {
            transform: scale(1.03);
            filter: grayscale(0%);
        }

        /* Decorative Background Element */
        .dd-image-column::after {
            content: '';
            position: absolute;
            bottom: -15px;
            right: -15px;
            width: 70%;
            height: 70%;
            border: 10px solid var(--secondary-color);
            border-radius: 20px;
            z-index: 1;
            opacity: 0.3;
        }

        /* Right Side: Content Styling */
        .dd-content-column {
            flex: 1.5;
            min-width: 300px;
        }

        .dd-badge {
            display: inline-block;
            color: var(--secondary-color);
            font-size: 14px;
            font-weight: 700;
            margin-bottom: 10px;
            text-transform: uppercase;
            letter-spacing: 2px;
            position: relative;
        }

        .dd-badge::after {
            content: '';
            display: block;
            width: 40px;
            height: 2px;
            background: var(--secondary-color);
            margin-top: 5px;
        }

        .dd-main-heading {
            font-size: 42px;
            color: var(--primary-color);
            margin: 10px 0 25px 0;
            font-weight: 700;
            line-height: 1.1;
        }

        .dd-message-text {
            font-size: 18px;
            color: var(--text-light);
            line-height: 1.8;
            margin-bottom: 30px;
            position: relative;
            padding-left: 20px;
            border-left: 3px solid #eee;
        }

        .dd-director-info {
            padding-top: 10px;
        }

        .dd-director-name {
            font-size: 26px;
            font-weight: 700;
            color: var(--text-dark);
            margin: 0;
        }

        .dd-director-title {
            font-size: 16px;
            color: var(--text-light);
            font-weight: 400;
            margin: 5px 0 0 0;
        }

        /* Responsive Media Queries */
        @media (max-width: 992px) {
            .dd-container-wrapper {
                flex-direction: column;
                gap: 40px;
            }
            
            .dd-image-column {
                width: 100%;
                max-width: 450px;
            }

            .dd-content-column {
                text-align: left;
            }
            
            .dd-message-text {
                padding-left: 0;
                border-left: none;
            }

            .dd-badge::after {
                margin: 5px auto;
            }
            
            .dd-main-heading {
                font-size: 32px;
            }
        }

        @media (max-width: 480px) {
            .dd-exclusive-section {
                padding: 40px 20px;
            }
            
            .dd-main-heading {
                font-size: 28px;
            }
        }














/* strip banner css  */

      /* --- CSS Custom Variables --- */
      :root {
        --blade-bg-color: #fff; /* Matching the background color from your image */
        --blade-accent-color: #f58220; /* Red accent for badge */
        --blade-text-dark: #1a1a1a;
        --blade-height: 450px;
        --fade-intensity: 40px;
      }

     

      /* --- Main Container --- */
      .janavi-strip-container {
        display: flex;
        width: 100%;
        height: var(--blade-height);
        background-color: var(--blade-bg-color);
        overflow: hidden;
        position: relative;
        align-items: center;
        /* margin-top: 50px; */
      }

      /* --- Left Side (Content) --- */
      .janavi-content-side {
        flex: 1.1;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding-left: 6.5%;
        padding-right: 40px;
        z-index: 10;
      }

      .janavi-badge {
        background-color: var(--blade-accent-color);
        color: white;
        padding: 6px 16px;
        border-radius: 2px;
        font-size: 14px;
        font-weight: bold;
        text-transform: uppercase;
        width: fit-content;
        margin-bottom: 15px;
        box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.1);
      }

      .janavi-title {
        font-size: 1.2rem;
        color: rgba(0, 0, 0, 0.6);
        font-weight: 600;
        margin-bottom: 8px;
        text-transform: uppercase;
        letter-spacing: 1px;
      }

      .janavi-heading {
        font-size: clamp(28px, 5vw, 48px);
        color: var(--blade-text-dark);
        line-height: 1.1;
        font-weight: 900;
        text-transform: uppercase;
      }

      /* --- Right Side (Image with Faded Mask Effect) --- */
      .janavi-image-side {
        flex: 1.4;
        position: relative;
        height: 100%;
        display: flex;
        align-items: flex-end;
        justify-content: flex-end;
        
      }

      .janavi-image-wrapper {
        position: relative; 
        width: 100%;
        height: 100%;

        /* ONLY left fade */
        -webkit-mask-image: linear-gradient(
          to left,
          black 70%,
          transparent 100%
        );
        mask-image: linear-gradient(to left, black 70%, transparent 100%);
      }

      .janavi-image-side img {
        width: 150%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        display: block;
        filter: saturate(1.1);
      }

      /* Soft Glow/Blur Overlay on the left edge of image */
      .janavi-image-side::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 150px;
        height: 100%;
        background: linear-gradient(
          to right,
          var(--blade-bg-color),
          transparent
        );
        z-index: 5;
        pointer-events: none;
      }
@media (max-width: 768px) {

  .janavi-strip-container {
    position: relative;
    height: 350px;
    flex-direction: unset;
  }

  /* IMAGE FULL BACKGROUND */
  .janavi-image-side {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .janavi-image-wrapper {
    width: 100%;
    height: 100%;

    /* REMOVE mask */
    -webkit-mask-image: none;
    mask-image: none;
  }

  .janavi-image-side img {
    width: 100%;
    height: 100%;
    object-fit: cover;

    /* BLUR EFFECT */
    filter: blur(7px) brightness(0.7);
  }

  /* TEXT ABOVE IMAGE */
  .janavi-content-side {
    position: relative;
    z-index: 10;
    padding: 20px;
    align-items: center;
    text-align: center;
    color: #fff;
  }

  .janavi-heading,
  .janavi-title {
    color: #fff;
  }

  /* OPTIONAL DARK OVERLAY (for better readability) */
  .janavi-image-side::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.4);
    z-index: 1;
  }
}












/* about misson and visson section  */


  
        /* Unique CSS Variables */
        :root {
            --mv-primary-clr: #f58220;
            --mv-secondary-clr: #f58220;
            --mv-text-dark: #1e293b;
            --mv-text-light: #64748b;
            --mv-white: #ffffff;
            --mv-section-bg: #ffffff;
        }

        #mv-premium-root {
            /* font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; */
            background-color: var(--mv-section-bg);
            padding: 20px 20px;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .mv-main-container {
            max-width: 1200px;
            width: 100%;
            display: grid;
            /* Ek hi row mein do columns */
            grid-template-columns: 1fr 1fr;
            gap: 30px;
        }

        .mv-card-item {
            background: var(--mv-white);
            padding: 50px 40px;
            /* border-radius: 24px; */
            border: 1px solid #f1f5f9;
            box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
            position: relative;
            z-index: 1;
            overflow: hidden;
            transition: transform 0.4s ease, border-color 0.4s ease;
            cursor: default;
            display: flex;
            flex-direction: column;
            align-items: flex-start;
        }

        /* Bottom to Top Background Animation */
        .mv-card-item::before {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 0;
            z-index: -1;
            transition: height 0.5s cubic-bezier(0.25, 1, 0.5, 1);
        }

        .mv-card-mission:hover::before {
            background: linear-gradient(to top, rgba(79, 70, 229, 0.06), #ffffff);
            height: 100%;
        }

        .mv-card-vision:hover::before {
            background: linear-gradient(to top, rgba(14, 165, 233, 0.06), #ffffff);
            height: 100%;
        }

        .mv-card-item:hover {
            /* transform: translateY(-10px); */
            border-color: #e2e8f0;
            box-shadow: 0 25px 50px rgba(0, 0, 0, 0.08);
        }

        /* Content Styling */
        .mv-icon-circle {
            width: 64px;
            height: 64px;
            border-radius: 18px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 28px;
            transition: transform 0.4s ease;
        }

        .mv-card-item:hover .mv-icon-circle {
            transform: scale(1.1) rotate(8deg);
        }

        .mv-mission-theme {
            background-color: rgba(79, 70, 229, 0.1);
            color: var(--mv-primary-clr);
        }

        .mv-vision-theme {
            background-color: rgba(14, 165, 233, 0.1);
            color: var(--mv-secondary-clr);
        }

        .mv-card-title {
            font-size: 28px;
            font-weight: 800;
            color: var(--mv-text-dark);
            text-transform: uppercase;
            margin: 0 0 18px 0;
            letter-spacing: -0.5px;
        }

        .mv-card-desc {
            font-size: 17px;
            line-height: 1.8;
            color: var(--mv-text-light);
            margin: 0;
        }

        /* SVG Icons */
        .mv-icon-svg {
            width: 32px;
            height: 32px;
            fill: currentColor;
        }

        /* Responsive - Mobile par ek ke neeche ek ho jayenge */
        @media (max-width: 992px) {
            .mv-main-container {
                grid-template-columns: 1fr;
                max-width: 600px;
            }
            #mv-premium-root {
                padding: 60px 20px;
            }
        }
    




















        /* why chooes us section degisne  */


                /* UNIQUE CSS VARIABLES */
        :root {
            --edu-qc-primary: #f58220;
            /* --edu-qc-accent: #06b6d4; */
            --edu-qc-secondary: #0f172a;
            --edu-qc-text-gray: #475569;
            --edu-qc-bg-light: #ffffff;
            --edu-qc-card-bg: #ffffff;
            --edu-qc-transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
            --edu-qc-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.05);
            --edu-qc-radius: 24px;
        }

        #edu-qc-section-wrapper {
            padding: 100px 20px;
            background-color: var(--edu-qc-bg-light);
            font-family: 'Inter', system-ui, sans-serif;
            color: var(--edu-qc-secondary);
        }

        .edu-qc-container {
            max-width: 1200px;
            margin: 0 auto;
        }

        .edu-qc-header {
            text-align: center;
            margin-bottom: 60px;
        }

        .edu-qc-badge {
            font-size: 0.8rem;
            font-weight: 700;
            color: var(--edu-qc-primary);
            text-transform: uppercase;
            letter-spacing: 2px;
            margin-bottom: 10px;
            display: inline-block;
        }

        .edu-qc-title {
            font-size: clamp(2rem, 5vw, 2.8rem);
            font-weight: 800;
            margin: 0;
        }

        /* MAIN FLEX/GRID LAYOUT */
        .edu-qc-main-grid {
            display: grid;
            grid-template-columns: 1fr 1fr 1fr; /* Left Cards | Center Image | Right Cards */
            gap: 40px;
            align-items: center;
        }

        .edu-qc-column {
            display: flex;
            flex-direction: column;
            gap: 30px;
        }

        /* CARD DESIGN */
        .edu-qc-card {
            background: var(--edu-qc-card-bg);
            padding: 30px;
            /* border-radius: var(--edu-qc-radius); */
            border: 1px solid #f1f5f9;
            box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
            transition: var(--edu-qc-transition);
        }

        .edu-qc-card:hover {
            
            border-color: #f58220;
            /* box-shadow: 0 20px 40px -15px rgba(99, 102, 241, 0.15); */
        }

        /* ALIGNMENT FOR CARDS */
        .edu-qc-left .edu-qc-card { text-align: right; }
        .edu-qc-right .edu-qc-card { text-align: left; }

        .edu-qc-icon-box {
            width: 54px;
            height: 54px;
            background: rgba(99, 102, 241, 0.08);
            color: var(--edu-qc-primary);
            border-radius: 14px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 20px;
        }

        .edu-qc-left .edu-qc-icon-box { margin-left: auto; }

        .edu-qc-card-title {
            font-size: 1.25rem;
            font-weight: 700;
            margin-bottom: 10px;
        }

        .edu-qc-card-text {
            font-size: 0.95rem;
            color: var(--edu-qc-text-gray);
            line-height: 1.6;
        }

        /* CENTER IMAGE STYLING (NO BACKGROUND/SHAPE) */
        .edu-qc-image-center {
            display: flex;
            align-items: center;
            justify-content: center;
            height: 100%;
        }

        .edu-qc-img-holder {
            width: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .edu-qc-img-holder img {
            max-width: 100%;
            height: 520px !important;
            object-fit: contain;
            /* Aapki image jis shape mein hogi, waisi hi dikhegi */
        }

        /* RESPONSIVE DESIGN */
        @media (max-width: 1024px) {
            .edu-qc-main-grid {
                grid-template-columns: 1fr 1fr;
                gap: 25px;
            }
            .edu-qc-image-center {
                grid-column: span 2;
                order: -1;
                margin-bottom: 30px;
            }
            .edu-qc-left .edu-qc-card, .edu-qc-right .edu-qc-card {
                text-align: center;
            }
            .edu-qc-left .edu-qc-icon-box, .edu-qc-right .edu-qc-icon-box {
                margin: 0 auto 20px;
            }
        }

        @media (max-width: 640px) {
            .edu-qc-main-grid {
                grid-template-columns: 1fr;
            }
            .edu-qc-image-center {
                grid-column: span 1;
            }
        }


























/* subject section start  */


        :root {
            --bg: #ffffff;
            --text-main: #111827;
            --text-muted: #6b7280;
            --border: #f1f5f9;
            --math-color: #6366f1;
            --eng-color: #f43f5e;
            --sci-color: #10b981;
            --evs-color: #f59e0b;
            --card-radius: 32px;
        }

      

        #elite-subjects {
            /* padding: 0px 5%; */
            max-width: 1200px;
            margin: 0 auto;
        }


        /* 3 Columns Grid */
        .bento-container {
            display: grid;
            grid-template-columns: repeat(3, 1fr); 
            gap: 30px;
        }

        .bento-card {
            position: relative;
            background: #ffffff;
            border: 1.5px solid var(--border);
            box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
            /* border-radius: var(--card-radius); */
            padding: 48px 40px;
            text-decoration: none;
            color: inherit;
            overflow: hidden;
            display: flex;
            flex-direction: column;
            min-height: 400px;
            transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
        }

        /* Card Hover Effects */
        .bento-card:hover {
            transform: translateY(-10px);
            border-color: var(--text-main);
            /* box-shadow: 0 40px 80px -20px rgba(0,0,0,0.08); */
        }

        /* Subject Specific Accents */
        .math:hover { background: #fafaff; }
        .english:hover { background: #fffafa; }
        .science:hover { background: #fafffa; }
        .evs:hover { background: #fffbf5; }

        /* Label/Tag */
        .card-tag {
            font-size: 0.75rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.12em;
            color: var(--text-muted);
            margin-bottom: 24px;
            display: flex;
            align-items: center;
            gap: 8px;
            position: relative;
            z-index: 2;
        }

        .card-tag::before {
            content: '';
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--border);
            transition: 0.4s;
        }

        .math:hover .card-tag::before { background: var(--math-color); }
        .english:hover .card-tag::before { background: var(--eng-color); }
        .science:hover .card-tag::before { background: var(--sci-color); }
        .evs:hover .card-tag::before { background: var(--evs-color); }

        /* Titles & Content */
        .bento-card h3 {
            font-size: 2.2rem;
            font-weight: 600;
            margin: 0 0 16px 0;
            letter-spacing: -0.02em;
            position: relative;
            z-index: 2;
        }

        .bento-card p {
            font-size: 1.1rem;
            line-height: 1.6;
            color: var(--text-muted);
            margin: 0;
            position: relative;
            z-index: 2;
        }

        /* Large Font Icon Watermark Style */
        .watermark-icon {
            position: absolute;
            bottom: -30px;
            right: -20px;
            font-size: 14rem; /* Massive watermark size */
            opacity: 0.03; 
            transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
            pointer-events: none;
            z-index: 1;
        }

        .bento-card:hover .watermark-icon {
            opacity: 0.08;
            transform: scale(1.15) rotate(-10deg) translate(-15px, -15px);
        }

        /* Subject Colors for Icons */
        .math .watermark-icon { color: var(--math-color); }
        .english .watermark-icon { color: var(--eng-color); }
        .science .watermark-icon { color: var(--sci-color); }
        .evs .watermark-icon { color: var(--evs-color); }

        /* Responsive */
        @media (max-width: 1100px) {
            .bento-container {
                grid-template-columns: repeat(2, 1fr); 
            }
        }

        @media (max-width: 768px) {
            .bento-container {
                grid-template-columns: 1fr; 
            }
           
            #elite-subjects{
              padding: 20px;
            }
            .bento-card { min-height: auto; padding: 40px; }
            .watermark-icon { font-size: 10rem; }
        }
























/* other gallery css code  */


        /* --- Unique CSS for Gallery Section --- */
        #nexus-alpha-gallery-wrapper {
            padding: 70px 0px;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            background-color: #f9f9f9;
        }

        .nexus-alpha-container {
            max-width: 1200px;
            margin: 0 auto;
        }

      

        /* Responsive Grid: 3 columns on desktop (2 rows with 6 items) */
        .nexus-alpha-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 25px;
        }

        .nexus-alpha-item {
            position: relative;
            overflow: hidden;
            cursor: pointer;
            box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
            transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
            background: #fff;
        }

        

        /* Square Image Logic */
        .nexus-alpha-img {
            width: 100%;
            aspect-ratio: 1 / 1; /* Perfect Square */
            object-fit: cover;
            display: block;
            transition: filter 0.3s ease;
        }

        .nexus-alpha-item:hover .nexus-alpha-img {
            filter: brightness(0.85);
        }

        /* --- Smooth Popup (Modal) Styling --- */
        #nexus-alpha-modal-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.9);
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 9999;
            opacity: 0;
            visibility: hidden;
            transition: opacity 0.4s ease, visibility 0.4s ease;
            backdrop-filter: blur(8px);
        }

        #nexus-alpha-modal-overlay.active {
            opacity: 1;
            visibility: visible;
        }

        .nexus-alpha-modal-content {
            max-width: 85%;
            max-height: 85%;
            transform: scale(0.8);
            transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
            position: relative;
        }

        #nexus-alpha-modal-overlay.active .nexus-alpha-modal-content {
            transform: scale(1);
        }

        .nexus-alpha-modal-img {
            width: 100%;
            max-height: 80vh;
            object-fit: contain;
            border-radius: 12px;
            box-shadow: 0 0 40px rgba(0,0,0,0.6);
        }

        .nexus-alpha-close-btn {
            position: absolute;
            top: -50px;
            right: 0;
            color: #fff;
            font-size: 40px;
            cursor: pointer;
            background: transparent;
            border: none;
            padding: 10px;
            line-height: 1;
        }

        /* --- Media Queries for Responsiveness --- */
        @media (max-width: 992px) {
            .nexus-alpha-grid {
                grid-template-columns: repeat(2, 1fr); /* 2 cols on tablets */
            }
        }

        @media (max-width: 600px) {
            .nexus-alpha-grid {
                grid-template-columns: 1fr; /* 1 col on mobile */
            }
            .nexus-alpha-heading {
                font-size: 1.5rem;
            }
            .nexus-alpha-modal-content {
                max-width: 95%;
            }

            #nexus-alpha-gallery-wrapper{
                padding: 20px;
            }
        }

























/* Contact Page Css Start  */


        :root {
            --wk-primary-color: #f59314;
            --wk-primary-dark: #000;
            --wk-bg-body: #f4f7f9;
            --wk-bg-card: #ffffff;
            --wk-bg-input: #f8faff;
            --wk-text-main: #1a1a1a;
            --wk-text-dim: #777777;
            --wk-border-light: #eeeeee;
            --wk-max-width: 1200px;
            --wk-gap: 24px;
        }

        

        /* Container & Layout */
        .wk-section-container {
            width: 100%;
            max-width: var(--wk-max-width);
            margin: 0 auto;
        }

        .wk-contact-grid {
            display: flex;
            flex-direction: row;
            gap: var(--wk-gap);
            align-items: stretch;
        }

        /* Shared Card Style (Sharp Borders) */
        .wk-card {
            background: var(--wk-bg-card);
            border: 1px solid var(--wk-border-light);
            border-radius: 0; /* Sharp Borders */
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
            flex: 1;
            position: relative;
            overflow: hidden;
        }

        /* LEFT COLUMN: MAP */
        .wk-map-container {
            min-height: 500px;
            position: relative;
            display: flex;
            flex-direction: column;
        }

        .wk-map-frame {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border: none;
            filter: grayscale(100%) contrast(1.1) opacity(0.9);
            z-index: 1;
        }

        /* Info Card Overlay */
        .wk-info-overlay {
            position: absolute;
            bottom: 25px;
            left: 25px;
            right: 25px;
            max-width: 400px;
            background: rgba(255, 255, 255, 0.95);
            backdrop-filter: blur(8px);
            padding: 30px;
            z-index: 10;
            border: 1px solid rgba(0,0,0,0.05);
            border-radius: 0; /* Sharp Borders */
        }

        .wk-info-row {
            display: flex;
            gap: 15px;
            margin-bottom: 25px;
        }

        .wk-info-row:last-child {
            margin-bottom: 0;
        }

        .wk-icon-box {
            width: 40px;
            height: 40px;
            background: var(--wk-primary-color);
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            color: white;
        }

        .wk-info-content h4 {
            color: var(--wk-primary-color);
            font-size: 11px;
            font-weight: 800;
            letter-spacing: 1.5px;
            margin-bottom: 5px;
            text-transform: uppercase;
        }

        .wk-info-content p {
            color: var(--wk-text-main);
            font-size: 13.5px;
            line-height: 1.6;
            font-weight: 500;
        }

        /* RIGHT COLUMN: FORM */
        .wk-form-container {
            padding: 50px 60px;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        .wk-bg-watermark {
            position: absolute;
            bottom: -20px;
            right: -10px;
            font-size: 110px;
            font-weight: 900;
            color: rgba(0, 0, 0, 0.02);
            pointer-events: none;
            user-select: none;
            z-index: 1;
        }

        .wk-form-inner {
            position: relative;
            z-index: 2;
        }

        .wk-title {
            font-size: 36px;
            font-weight: 900;
            color: var(--wk-text-main);
            margin-bottom: 35px;
            text-transform: uppercase;
            letter-spacing: -1px;
        }

        .wk-title span {
            color: var(--wk-primary-color);
        }

        /* Form Inputs */
        .wk-form-group {
            margin-bottom: 15px;
        }

        .wk-input {
            width: 100%;
            padding: 16px 20px;
            background: var(--wk-bg-input);
            border: 1px solid var(--wk-border-light);
            border-radius: 0; /* Sharp Borders */
            font-size: 14px;
            outline: none;
            transition: all 0.3s ease;
        }

        .wk-input:focus {
            border-color: var(--wk-primary-color);
            background: #fff;
        }

        .wk-textarea {
            resize: none;
            min-height: 120px;
        }

        .wk-submit-btn {
            width: 100%;
            padding: 16px;
            background: var(--wk-primary-color);
            color: #fff;
            border: none;
            border-radius: 0; /* Sharp Borders */
            font-size: 14px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 1px;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            transition: all 0.3s ease;
            margin-top: 10px;
        }

        .wk-submit-btn:hover {
            background: var(--wk-primary-dark);
            transform: translateY(-2px);
            box-shadow: 0 5px 15px rgba(0, 188, 212, 0.3);
        }

        /* Responsive Breakpoints */
        @media (max-width: 992px) {
            .wk-contact-grid {
                flex-direction: column;
            }
            .wk-map-container {
                min-height: 400px;
            }
            .wk-form-container {
                padding: 40px;
            }
        }

        @media (max-width: 600px) {
           
            .wk-contact-grid {
                gap: 20px;
            }
            .wk-map-container {
                min-height: auto; /* Collapse min-height for mobile */
                overflow: visible;
                border: none;
                box-shadow: none;
                background: transparent;
            }
            .wk-map-frame {
                position: relative;
                height: 300px; /* Fixed height for map on mobile */
                width: 100%;
                border: 1px solid var(--wk-border-light);
            }
            .wk-info-overlay {
                position: relative;
                bottom: 0;
                left: 0;
                right: 0;
                max-width: 100%;
                margin-top: 0; /* Remove negative margin for cleaner look */
                padding: 25px 20px;
                background: #ffffff;
                border: 1px solid var(--wk-border-light);
                box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
            }
            .wk-form-container {
                padding: 30px 20px;
            }
            .wk-title {
                font-size: 28px;
                margin-bottom: 25px;
            }
            .wk-bg-watermark {
                font-size: 60px;
                bottom: -10px;
            }
            .wk-info-row {
                margin-bottom: 20px;
            }
        }

























/* Blog Page Css  */


  :root {
            --bs-primary: orange;
            --bs-bg: #f8fafc;
            --bs-card-bg: #ffffff;
            --bs-text: #1e293b;
            --bs-text-light: #64748b;
            --bs-radius: 16px;
            --bs-gap: 30px;
            --bs-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
        }

      

        .bs-container { max-width: 1200px; margin: 40px auto; }

        .bs-blog-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: var(--bs-gap);
        }

        @media (max-width: 1024px) { .bs-blog-grid { grid-template-columns: repeat(2, 1fr); } }
        @media (max-width: 640px) { .bs-blog-grid { grid-template-columns: 1fr; padding: 20px !important; } }

        .bs-card {
            background: var(--bs-card-bg);
            border-radius: var(--bs-radius);
            box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
            display: none; /* JS handle karega */
            flex-direction: column;
            overflow: hidden;
            transition: 0.3s;
        }

        .bs-card img { width: 100%; height: 300px; object-fit: cover;  }
        .bs-card-content { padding: 20px; flex-grow: 1; }
        .bs-card-title { font-size: 1.25rem; margin-bottom: 10px; }
        .bs-card-desc { font-size: 0.95rem; color: var(--bs-text-light); margin-bottom: 15px; height: 3.5em; overflow: hidden; }

        /* Pagination Styles */
        .bs-pagination { display: flex; justify-content: center; align-items: center; gap: 10px; margin-top: 50px; flex-wrap: wrap; }
        .bs-page-btn {
            width: 45px; height: 45px; border: 1px solid #e2e8f0; background: white;
            cursor: pointer; border-radius: 8px; font-weight: 700; transition: 0.3s;
        }
        .bs-page-btn:hover { background: #f1f5f9; }
        .bs-page-btn.active { background: var(--bs-primary); color: white; border-color: var(--bs-primary); }
        
        
        
        
        
        
        
        
        
        
        
        /* reslut page new degsien git it  */


    
      /* --- Unique CSS Variables --- */
      :root {
        --rg-main-orange: #ff6b00;
        --rg-deep-black: #0a0a0a;
        --rg-soft-gray: #f4f4f4;
        --rg-glass-effect: rgba(255, 255, 255, 0.98);
        --rg-sharp-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
        --rg-transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
      }

    

      .rg-master-wrapper {
        max-width: 1200px;
        margin: 0 auto;
        margin-top: 50px;
        margin-bottom: 100px;
      }

      /* --- Unique Filter Section --- */
      .rg-filter-container {
        display: flex;
        justify-content: center;
        margin-bottom: 50px;
      }

      .rg-filter-box {
        display: inline-flex;
        background: var(--rg-glass-effect);
        padding: 6px;
        border: 1px solid #ddd;
        box-shadow:
          rgba(60, 64, 67, 0.3) 0px 1px 2px 0px,
          rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
        position: relative;
        z-index: 100;
      }

      /* Unique Sliding Background */
      .rg-slider-bg {
        position: absolute;
        background-color: var(--rg-main-orange);
        height: calc(100% - 12px);
        top: 6px;
        left: 6px;
        z-index: 1;
        transition: all 0.45s cubic-bezier(0.23, 1, 0.32, 1);
        box-shadow: 0 5px 15px rgba(255, 107, 0, 0.25);
      }

      .rg-filter-btn {
        padding: 14px 28px;
        border: none;
        background: transparent;
        color: #444;
        cursor: pointer;
        font-weight: 700;
        font-size: 0.85rem;
        text-transform: uppercase;
        letter-spacing: 1px;
        position: relative;
        z-index: 2;
        transition: color 0.3s ease;
        outline: none;
      }

      .rg-filter-btn:hover {
        color: var(--rg-main-orange);
      }

      .rg-filter-btn.rg-active {
        color: #ffffff !important;
      }

      /* --- Image Grid (3 per row) --- */
      .rg-gallery-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
      }

      .rg-item-card {
        position: relative;
        aspect-ratio: 1 / 1; /* Thumbnails are square */
        overflow: hidden;
        background-color: #fff;
        cursor: pointer;
        border: 1px solid #e0e0e0;
        transition: var(--rg-transition);
      }

      .rg-item-card:hover {
        transform: translateY(-8px);
        border-color: var(--rg-main-orange);
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
      }

      .rg-item-card img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 1s ease;
      }

      .rg-item-card:hover img {
        transform: scale(1.1);
      }

      /* Hover Overlay */
      .rg-overlay-layer {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(255, 107, 0, 0.9);
        display: flex;
        align-items: center;
        justify-content: center;
        opacity: 0;
        transition: opacity 0.3s ease;
      }

      .rg-item-card:hover .rg-overlay-layer {
        opacity: 1;
      }

      .rg-overlay-btn {
        color: white;
        font-weight: 800;
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 2px;
        border: 2px solid white;
        padding: 8px 16px;
      }

      /* --- Unique Modal (Real Size View) --- */
      .rg-modal-overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.98);
        display: none;
        z-index: 2000;
        justify-content: center;
        align-items: center;
        padding: 20px;
      }

      .rg-modal-wrap {
        position: relative;
        max-width: 95vw;
        max-height: 90vh;
        display: flex;
        justify-content: center;
        align-items: center;
      }

      .rg-modal-img {
        max-width: 100%;
        max-height: 90vh;
        display: block;
        border: 4px solid #fff;
        /* Yahan image ki asli shape dikhegi */
        object-fit: contain;
        box-shadow: 0 0 40px rgba(0, 0, 0, 0.6);
        animation: rg-zoom-in 0.3s ease-out;
      }

      .rg-modal-close {
        position: absolute;
        top: -50px;
        right: 0;
        color: #fff;
        font-size: 40px;
        background: none;
        border: none;
        cursor: pointer;
      }

      @keyframes rg-zoom-in {
        from {
          opacity: 0;
          transform: scale(0.9);
        }
        to {
          opacity: 1;
          transform: scale(1);
        }
      }

      /* --- Responsive Design --- */
      @media (max-width: 992px) {
        .rg-gallery-grid {
          grid-template-columns: repeat(2, 1fr);
        }
      }

      @media (max-width: 768px) {
        .rg-filter-box {
          flex-direction: column;
          width: 100%;
        }
        .rg-slider-bg {
          display: none;
        } /* Mobile par slider hidden, solid active use karenge */
        .rg-filter-btn {
          width: 100%;
          border-bottom: 1px solid #eee;
        }
        .rg-filter-btn.rg-active {
          background: var(--rg-main-orange);
        }
        .rg-master-wrapper{
            padding: 20px !important;
        }
      }

      @media (max-width: 480px) {
        .rg-gallery-grid {
          grid-template-columns: 1fr;
        }
      }