[data-bs-theme=light] .banner { background: linear-gradient(180deg, #fff5f5, transparent); } [data-bs-theme=light] .header { background: linear-gradient(180deg, transparent, #fff5f5); } .h-400{ height: 400px; object-fit: cover; width: 100%; } /* timeline */ .timeline { position: relative; padding-left: 30px; } .timeline::before { content: ''; position: absolute; left: 15px; top: 0; bottom: 0; width: 2px; background: linear-gradient(to bottom, #e14242, #ce3131); } .timeline-item { position: relative; margin-bottom: 20px; background: white; border-radius: 8px; padding: 15px 20px; box-shadow: 0 2px 8px rgba(0,0,0,0.08); border-left: 3px solid #BE2727; transition: all 0.2s ease; } .timeline-item:hover { transform: translateX(3px); box-shadow: 0 4px 12px rgba(0,0,0,0.12); } .timeline-item::before { content: ''; position: absolute; left: -23px; top: 20px; width: 12px; height: 12px; background: #BE2727; border: 3px solid white; border-radius: 50%; box-shadow: 0 2px 4px rgba(0,0,0,0.1); } .timeline-content { margin-left: 0; } .year-title { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; } .year { font-size: 1.1rem; font-weight: 700; color: #2d3748; background: linear-gradient(45deg, #e14242, #ce3131); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } .title { font-size: 0.95rem; font-weight: 600; color: #4a5568; flex: 1; } .highlights { list-style: none; padding: 0; margin: 0; } .highlights li { position: relative; padding-left: 15px; margin-bottom: 6px; color: #718096; font-size: 0.85rem; line-height: 1.4; } .highlights li::before { content: '•'; position: absolute; left: 0; color: #BE2727; font-weight: bold; } .highlight-text { font-weight: 600; color: #2d3748; } .description { color: #718096; font-size: 0.85rem; line-height: 1.4; margin-top: 5px; } @media (max-width: 768px) { .timeline { padding-left: 25px; } .timeline::before { left: 12px; } .timeline-item::before { left: -18px; width: 10px; height: 10px; } .timeline-item { padding: 12px 15px; margin-bottom: 15px; } .timeline-header h1 { font-size: 1.5rem; } .year { font-size: 1rem; } .title { font-size: 0.9rem; } .highlights li { font-size: 0.8rem; } } /* Compact animation */ @keyframes slideIn { from { opacity: 0; transform: translateX(-20px); } to { opacity: 1; transform: translateX(0); } } .timeline-item { animation: slideIn 0.4s ease forwards; opacity: 0; } .timeline-item:nth-child(1) { animation-delay: 0.1s; } .timeline-item:nth-child(2) { animation-delay: 0.15s; } .timeline-item:nth-child(3) { animation-delay: 0.2s; } .timeline-item:nth-child(4) { animation-delay: 0.25s; } .timeline-item:nth-child(5) { animation-delay: 0.3s; } .timeline-item:nth-child(6) { animation-delay: 0.35s; } .timeline-item:nth-child(7) { animation-delay: 0.4s; } .team .grid-sizer { width: 25%; } .team .filter-item { width: 25%; /* match .grid-sizer */ } @media (max-width: 768px) { .team .grid-sizer, .team .filter-item { width: 50%; } } @media (max-width: 480px) { .team .grid-sizer, .team .filter-item { width: 100%; } } .filter-item{ margin-bottom: 20px; } @media (min-width:992px) and (max-width:1200px) { .service-process{ height: 730px; } .service-process img{ height: 100%; object-fit: cover; } } /* service */ .service.howitwork-2 .navigation-arrow-1 { left: 23%; } .service.howitwork-2 .navigation-arrow-2 { right: 45%; bottom: 45%; } .service.howitwork-2 .navigation-arrow-3 { right: 22%; bottom: 40%; } .service.howitwork-2 .navigation-arrow-1 img, .service.howitwork-2 .navigation-arrow-2 img, .service.howitwork-2 .navigation-arrow-3 img { width: 120px; } /* panch tatwa */ .flip-card { width: 100%; height: 400px; perspective: 1000px; } @media (min-width:540px) { .flip-card { width: 255px; height: 400px; perspective: 1000px; } } @media (min-width:992px) { .flip-card { width: 235px; height: 400px; perspective: 1000px; } } @media (min-width:1400px) { .flip-card { width: 280px; height: 400px; perspective: 1000px; } } .flip-card-inner { position: relative; width: 100%; height: 100%; transition: transform 0.8s; transform-style: preserve-3d; } .flip-card:hover .flip-card-inner { transform: rotateY(180deg); } .flip-card-front, .flip-card-back { position: absolute; width: 100%; height: 100%; backface-visibility: hidden; border-radius: 10px; overflow: hidden; } .flip-card-front img { width: 100%; height: 100%; object-fit: cover; } .flip-card-back { background-color: #222; color: white; display: flex; flex-direction: column; justify-content: center; align-items: center; transform: rotateY(180deg); padding: 20px; } .flip-card-back h5{ color: white; text-align: center; } .flip-card-back p{ color: white; text-align: center; } /* clients */ .clients-page{ width: 100%; } .clients-img{ height: 250px; width: 100%; padding: 20px 20px; /* border: 1px solid black; */ box-shadow: 0 5px 10px gray; border-radius: 10px; } .clients-img img{ height: 100%; object-fit: contain; } /* career */ .career-img{ width: 50px; height: 50px; border: 1px solid var(--color-brand); border-radius: 100%; } .career-img img{ width: 100%; height: 100%; padding: 5px; } .career-box{ background-color: #F3F4F6; box-shadow: 0 5px 10px var(--color-sec); border-radius: 10px; margin-bottom: 10px; } .career h3{ font-size: 20px; margin-bottom: 0; } .career p{ font-size: 12px; } .career h4{ font-size: 15px; font-weight: normal; } .career .content h6, .career .content li{ font-size: 13px; } .career ul{ padding-left: 0 !important; } .career ul li{ list-style-type: none; } .career-view{ background-color: gray; border-radius: 10px; color: white; padding: 5px 10px; } .career-view:hover{ color: white; box-shadow: 0 5px 10px gray; } .job-intro{ border-bottom: 1px solid gray; } .job-intro .text-title{ color: #BE2727; font-size: 14px; font-weight: 700; } .job-intro h4{ font-size: 12px; } .line-through{ width: 100%; border-bottom: 1px solid var(--color-sec); } /* footer */ .footer-logo img{ width: 125px; }