/*********** Inner Banner ******************/ .innerBanner { position: relative; background-size: cover; background-repeat: no-repeat; background-position: center; width: 100%; display: flex; align-items: center; justify-content: center; z-index: 99; overflow: hidden; } .innerBanner:before { position: absolute; bottom: 0; left: 0; content: ''; background-image: url(../images/whitelabel.png); background-size: cover; background-position: top; background-repeat: no-repeat; width: 100%; height: 20%; z-index: 99; } .innerBanner:after { background-image: url(../images/headline-bg.png); background-size: 38%; background-repeat: no-repeat; position: absolute; content: ''; z-index: -2; left: -4%; bottom: 1%; content: ''; width: 50%; background-size: cover; background-position: top; height: 100%; overflow: clip; } .bannerheading { position: relative; padding: 15vw 0px 16vw 0px; display: flex; align-items: center; justify-content: center; } .bannerheading h2 { position: relative; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 4vw; line-height: 4.5vw; height: 100%; text-transform: uppercase; text-align: center; } .innerCircletop { position: absolute; bottom: -112%; right: -38%; width: 44%; z-index: 9; animation: smoothSwing 6s linear infinite; z-index: -1; opacity: 0.7; } @media only screen and (min-width: 320px) and (max-width: 768px) { .bannerheading h2 { font-size: 20px; line-height: 22px; } .bannerheading { padding: 70px 0px 100px 0px; } .innerCircletop { bottom: -70%; right: -38%; } } /******** Photo Gallery ***********/ .photogalleryWraper { position: relative; padding: 5vw 0; } .photogalleryWraper .uk-lightbox { z-index: 9999 !Important } .gallery-item { border-radius: 14px; overflow: hidden; position: relative; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15); transition: 0.3s ease; } .gallery-item img { width: 100%; display: block; } .gallery-item:hover { transform: translateY(-5px); box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25); } .getintouchWrap { position: relative; padding: 0px 0px 5vw 0; } .getintouchWrap .sectionheading p { font-size: 1.4vw; line-height: 1.6vw; width: 80%; margin: 0 auto; text-align: center; padding-top: 20px; } @media only screen and (min-width: 320px) and (max-width: 768px) { .getintouchWrap .sectionheading p { font-size: 14px; line-height: 20px; width: 100%; } .getintouchWrap { position: relative; padding: 30px 0px 50px 0; } } /**********.Plan Visit Page ************/ .easytravelWraper { position: relative; padding: 3vw 0; } .travelAIEContent { position: relative; text-align: center; width: 80%; margin: 0 auto; } .travelAIEContent h4 { font-size: 1.6vw; line-height: 2vw; text-align: center; padding-bottom: 20px; font-size: 600; ; } .travelAIEContent p { padding-bottom: 10px; text-align: center; } .visaAssitWraper { position: relative; padding: 3vw 0; } .visaenwwrap { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; width: 70%; margin: 0 auto; } .visaEnqItem { position: relative; overflow: hidden; padding: 24px 22px; border-radius: 18px; background: rgba(255, 255, 255, 0.55); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border: 1px solid rgba(255, 255, 255, 0.4); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.6); transition: all 0.3s ease; background: linear-gradient(135deg, #eef2ff, #eff0f5, #f5f3ff); } .visaEnqItem:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(0, 0, 0, 0.1); } .cardIcon { width: 52px; height: 52px; margin-bottom: 14px; border-radius: 50%; background: linear-gradient(135deg, #6366f1, #0130a5); color: #fff; display: flex; align-items: center; justify-content: center; } .cardIcon svg { width: 20px; height: 20px; } .visaEnqItem h3 { font-size: 1.6vw; line-height: 2vw; font-weight: 800; margin-bottom: 4px; text-transform: uppercase; } .visaEnqItem .descvis { font-size: 1.3vw; line-height: 1.4; margin-bottom: 12px; padding: 20px 0px; } .visaEnqItem .companyvis { font-size: 1.3vw; margin-bottom: 14px; } .visaEnqItem .infovis { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 10px; margin-bottom: 8px; background: rgba(255, 255, 255, 0.7); backdrop-filter: blur(8px); transition: 0.3s; } .visaEnqItem .infovis:hover { background: rgba(255, 255, 255, 0.95); } .visaEnqItem .mailIcon { width: 28px; height: 28px; border-radius: 50%; background: #e0ecff; display: flex; align-items: center; justify-content: center; } .visaEnqItem .mailIcon svg { width: 14px; height: 14px; } .visaEnqItem .infovis a { flex: 1; font-size: 1vw; line-height: 1.2vw; font-weight: 400; color: #111; text-decoration: none; } .visaEnqItem .arrow { font-size: 16px; color: #94a3b8; } .visaEnqItem .infovis.center { justify-content: center; } .visaEnqItem::before { content: ""; position: absolute; width: 160px; height: 160px; top: -40px; right: -40px; background: radial-gradient(circle, rgba(99, 102, 241, 0.25), transparent 70%); filter: blur(40px); z-index: 0; } .visaEnqItem::after { content: ""; position: absolute; width: 140px; height: 140px; bottom: -40px; left: -40px; background: radial-gradient(circle, rgba(168, 85, 247, 0.2), transparent 70%); filter: blur(45px); z-index: 0; } .visaEnqItem * { position: relative; z-index: 1; } .traveloartCode { position: relative; padding: 3vw 0; background-size: cover; background-repeat: no-repeat; width: 100%; } .officaltravelWrap { position: relative; padding: 2vw 0; } .officaltravelWrap figure { background-size: cover; background-position: center; background-repeat: no-repeat; width: 100%; height: 100%; border-radius: 20px; } .officaltravelWrap h3 { font-size: 2vw; line-height: 2.4vw; padding-bottom: 1vw; color: #000; } .officaltravelWrap p { padding-bottom: 20px; color: #000; } .couponcode { text-align: center; border: 1px solid #c9ff00; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; background: #1945be7d; } .couponcode:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #c9ff00; } .couponcode h3 { color: #fff; font-size: 1.6vw; line-height: 2.1vw; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; } .couponcode p { color: #fff; font-size: 1.4vw; line-height: 1.9vw; margin-bottom: 0px; } .couponcode p strong { color: #c9ff00; } .travelcareemWrap { position: relative; padding: 2vw 0; } .travelcareemWrap figure { background-size: cover; background-position: center; background-repeat: no-repeat; width: 100%; height: 100%; border-radius: 20px; min-height: 350px; } .travelcareemWrap h3 { font-size: 2vw; line-height: 2.4vw; padding-bottom: 1vw; text-transform: uppercase; /* color: #fff; */ color: #fff; text-align: center; } .travelcareemWrap p { padding-bottom: 20px; font-size: 1.3vw; line-height: 1.7vw; width: 90%; /* color: #fff; */ color: #ffffff; text-align: center; margin: 0 auto; } .travelcareemWrap .couponcode { padding: 20px 20px ! Important; background: #0e41bc; height: 100%; } .travelcareemWrap .couponcode h4 { font-size: 1.5vw; line-height: 2.4vw; padding-bottom: 1vw; text-transform: uppercase; /* color: #fff; */ color: #fff; text-align: center; } .travelcareemWrap .couponcode h4 strong { color: #c9ff00; } .travelcareemWrap .couponcode p { padding-bottom: 20px; font-size: 1.3vw; line-height: 1.7vw; width: 90%; color: #fff; text-align: left; } .travelcareemWrap .couponcode p strong { color: #fff; } .hotelaccommodationWrap { position: relative; } .planvitbanner01 { position: relative; } .preferredTravelWrap { position: relative; padding: 2vw 0; } .preftrevInner { position: relative; overflow: hidden; padding: 24px 22px; border-radius: 18px; background: rgba(255, 255, 255, 0.55); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border: 1px solid rgba(255, 255, 255, 0.4); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.6); transition: all 0.3s ease; background: linear-gradient(135deg, #bfc8e6, #f1f3ff, #eae9eb); } .preftrevInner:before { content: ""; position: absolute; width: 200px; height: 160px; top: -40px; right: -40px; background: radial-gradient(circle, rgb(59 189 202), transparent 90%); filter: blur(40px); z-index: 0; } .preftrevInner:after { content: ""; position: absolute; width: 140px; height: 140px; bottom: -40px; left: -40px; background: radial-gradient(circle, rgba(168, 85, 247, 0.2), transparent 70%); filter: blur(45px); z-index: 0; } .preftrevInner figure { background-size: cover; background-position: center; background-repeat: no-repeat; width: 100%; height: 100%; border-radius: 20px; margin: 0; } .preftrevInner p { font-size: 1.3vw; line-height: 1.7vw; color: #000; text-align: left; padding-bottom: 10px; } .boxspacetrt { padding: 0px 20px; } @media only screen and (min-width: 320px) and (max-width: 768px) { .travelAIEContent { width: 100%; } .travelAIEContent h4 { font-size: 18px; line-height: 20px; } .visaAssitWraper { padding: 30px 0px; } .visaenwwrap { width: 100%; } .visaEnqItem h3 { font-size: 20px; line-height: 22px; } .visaEnqItem .descvis { font-size: 15px; line-height: 18px; margin-bottom: 12px; padding: 10px 0px; } .visaEnqItem .companyvis { font-size: 16px; } .visaEnqItem .infovis a { font-size: 12px; line-height: 14px; } .officaltravelWrap p { font-size: 14px; line-height: 19px; } .couponcode { margin-top: 30px; } .couponcode h3 { font-size: 16px; line-height: 18px; } .couponcode p { font-size: 14px; line-height: 16px; } .officaltravelWrap p { padding-bottom: 20px; } .travelcareemWrap h3 { font-size: 20px; line-height: 22px; padding-bottom: 20px; padding-top: 20px; } .travelcareemWrap p { padding-bottom: 20px; font-size: 14px; line-height: 16px; width: 100%; } .travelcareemWrap .couponcode p { padding-bottom: 20px; font-size: 15px; line-height: 22px; width: 100%; } .travelcareemWrap .couponcode { height: auto; margin-bottom: 20px; } .preftrevInner p { font-size: 14px; line-height: 17px; } .boxspacetrt { padding: 20px 0; } .hotelaccommodationWrap .buttonWrap { margin-bottom: 20px; } .travelcareemWrap .couponcode h4 { font-size: 20px; line-height: 22px; padding-bottom: 20px; } } .hotelStatsSection { position: relative; background: url(../images/hotelaccoimg02.jpg) center / cover no-repeat; display: flex; align-items: center; color: #fff; background-position: center; background-attachment: fixed; } .hotelStatsSection .overlay22 { width: 100%; height: 100%; background: linear-gradient(90deg, rgb(14 65 188), rgb(1 2 2 / 3%)); display: flex; align-items: center; padding: 80px 0; position: relative; } /* TEXT */ .hotelText h2 { font-size: 3vw; font-weight: 800; line-height: 3.6vw; letter-spacing: -0.5px; margin-bottom: 20px; } .hotelText p { font-size: 1.3vw; /* max-width: 480px; */ /* opacity: 0.9; */ line-height: 1.7vw; color: #fff; width: 80%; padding-bottom: 2vw; } .hotelStats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 25px; } .hotelstatBox { padding: 25px; border-radius: 14px; /* 🔥 GLASS EFFECT */ background: rgba(255, 255, 255, 0.08); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, 0.15); transition: 0.3s ease; } .hotelstatBox:hover { transform: translateY(-5px); background: rgba(255, 255, 255, 0.12); } /* BIG NUMBERS */ .hotelstatBox h3 { font-size: 3.2vw; line-height: 4vw; background: linear-gradient(90deg, #ffffff, #c9ff00); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .hotelstatBox h3 span { font-size: 1.7vw; margin-left: 5px; line-height: 2vw; } .hotelstatBox p { font-size: 1.3vw; margin-top: 5px; /* opacity: 0.85; */ color: #fff; line-height: 1.6vw; } .hotelstatBox { opacity: 0; transform: translateY(20px); animation: fadeUp 0.8s ease forwards; } .hotelstatBox:nth-child(2) { animation-delay: 0.2s; } .hotelstatBox:nth-child(3) { animation-delay: 0.4s; } .hotelstatBox:nth-child(4) { animation-delay: 0.6s; } @keyframes fadeUp { to { opacity: 1; transform: translateY(0); } } @media only screen and (min-width: 320px) and (max-width: 768px) { .hotelText h2 { font-size: 30px; line-height: 35px; } .hotelText p { font-size: 14px; line-height: 19px; width: 100%; padding-bottom: 2vw; } .hotelstatBox { padding: 10px 15px; border-radius: 10px; } .hotelstatBox h3 { font-size: 25px; line-height: 30px; } .hotelstatBox h3 span { font-size: 16px; line-height: 18px; } .hotelstatBox p { font-size: 12px; margin-top: 5px; line-height: 15px; } } /********** Investor Page ***************/ .investrstatsinner .sectionheading p { width: 80%; margin: 0 auto; padding-top: 20px; } .investorContentArea01 { position: relative; padding: 4vw 0; } .investorContentArea01 h2 { width: 100%; font-weight: 900; font-size: 2.75vw; line-height: 3.2vw; color: #000; padding-bottom: 2vw; text-transform: uppercase; } .investorContentArea01 p { color: #000; font-size: 1.3vw; line-height: 1.8vw; } .investorContentArea01 figure { border-radius: 20px; background-size: cover; background-position: center; background-repeat: no-repeat; width: 100%; height: 100%; min-height: 25vw; } .investorContentArea01 figure img { border-radius: 20px; } @media only screen and (min-width: 320px) and (max-width: 768px) { .statsWrap.investrstatsinner .sectionheading h2 { font-size: 22px; line-height: 25px; } .investrstatsinner .sectionheading p { padding-top: 20px; font-size: 14px; line-height: 19px; width: 100%; } .investorContentArea01 h2 { font-size: 20px; line-height: 25px; padding-bottom: 20px; text-align: left; } .statsWrap.investrstatsinner .row.mt-5 { grid-template-columns: 1fr 1fr; } .investorContentArea01 p { font-size: 14px; line-height: 18px; text-align: left; } .investorContentArea01 figure { min-height: 250px; margin-top: 30px; } .investorContentArea01 { position: relative; padding: 50px 0px; } .partnersWraperFull.participateInvestor .col-md-3.col-lg-3 { flex: 0 0 auto; width: 32%; margin-bottom: 10px !important; } .partnersWraperFull.participateInvestor .logoWrap26 .innerlogoItem img { width: 100%; height: 80px; } .partnersWraperFull.participateInvestor .logoWrap26 .innerlogoItem { height: auto; padding: 0; } .partnersWraperFull.participateInvestor .sectionheading h2 span { font-size: 23px; } } /*********.Supernova Page ***************/ .pitchIntroWrap { position: relative; padding: 3vw 0; } .pitchNotebox { width: 80%; margin: 0 auto; position: relative; padding: 2vw 0px 2.5vw 0; background-size: cover; background-position: top; background-repeat: no-repeat; overflow: hidden; margin: 30px auto; margin-bottom: 50px; border-radius: 20px; border-radius: 20px; box-shadow: 0 20px 60px rgba(201, 255, 0, 0.4); clip-path: polygon(0 0, 100% 0, 100% 85%, 0 100%); transition: clip-path 0.5s ease, transform 0.5s ease; } .pitchNotebox h3 { font-weight: 900; font-size: 2.75vw; line-height: 3.6vw; color: #fff !important; text-align: center; padding-bottom: 0; margin: 0; text-transform: uppercase; } .pitchIntroWrap h2 { width: 100%; font-weight: 900; font-size: 2.75vw; line-height: 3.2vw; color: #000; padding-bottom: 2vw; text-transform: uppercase; } .pitchIntroWrap p { color: #000; font-size: 1.3vw; line-height: 1.8vw; padding-bottom: 10px; } .pitchIntroWrap figure { border-radius: 20px; background-size: cover; background-position: center; background-repeat: no-repeat; width: 100%; height: 100%; min-height: 25vw; } .supernova-modern { padding: 5vw 0px 5vw 0px; background-color: radial-gradient(circle at top, #0f172a, #020617); background-size: cover; background-position: top; background-repeat: no-repeat; color: #fff; position: relative; overflow: hidden; } .supernova-modern .title { text-align: center; font-size: 42px; font-weight: 700; margin-bottom: 80px; letter-spacing: 1px; } .pitchtime-line { position: absolute; top: 55%; left: 0; width: 100%; height: 2px; background: linear-gradient(90deg, transparent, #22d3ee, transparent); transform: translateY(-50%); opacity: 0.4; } .pitchtime-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; position: relative; } .pitchstep { text-align: center; position: relative; } .pitchstep::before { content: ""; position: absolute; top: calc(50% - 6px); left: 50%; transform: translateX(-50%); width: 12px; height: 12px; background: #22d3ee; border-radius: 50%; box-shadow: 0 0 15px #22d3ee; background: linear-gradient(135deg, #eef2ff, #eff0f5, #f5f3ff); } .pitchtime-card { backdrop-filter: blur(12px); background: rgba(255, 255, 255, 0.05); border-radius: 20px; padding: 30px 20px; transition: all 0.4s ease; border: 1px solid rgba(255, 255, 255, 0.08); position: relative; height: 100%; display: flex; align-items: center; justify-content: center; } .pitchtime-card::before { content: ""; position: absolute; inset: 0; border-radius: 20px; padding: 1px; background: linear-gradient(135deg, #0144ba, #46aac6); -webkit-mask-composite: xor; mask-composite: exclude; } /* HOVER */ .pitchtime-card:hover { transform: translateY(-10px) scale(1.03); background: rgba(255, 255, 255, 0.08); } /* TEXT */ .pitchtime-card h3 { font-size: 1.4vw; line-height: 1.8vw; font-weight: 600; color: #fff; z-index: 999; text-transform: uppercase; } /* DATE */ .pitchstep span { display: block; margin-top: 25px; font-size: 1.4vw; color: #c9ff00; letter-spacing: 1px; text-transform: uppercase; font-weight: 600; } /* RESPONSIVE */ @media (max-width: 992px) { .pitchtime-grid { grid-template-columns: repeat(2, 1fr); gap: 60px 20px; } .pitchtime-line { display: none; } .pitchstep::before { display: none; } } @media (max-width: 576px) { .pitchtime-grid { grid-template-columns: 1fr; } } .supernovaapplywrap { position: relative; padding: 3vw 0; } .supernovaapplywrap p { width: 80%; text-align: center; margin: 0 auto; margin-top: 30px; line-height: 1.6vw; } @media only screen and (min-width: 320px) and (max-width: 768px) { .pitchIntroWrap { padding: 40px 0px; } .pitchNotebox { width: 100%; padding: 30px 20px; margin: 0px auto; margin-bottom: 30px; } .pitchNotebox h3 { font-size: 18px; line-height: 24px; } .pitchIntroWrap figure { min-height: 250px; } .pitchIntroWrap p { font-size: 14px; line-height: 16px; padding-bottom: 10px; padding-top: 20px; } .pitchtime-card h3 { font-size: 20px; line-height: 22px; } .pitchstep span { display: block; margin-top: 20px; font-size: 14px; } .pitchtime-grid { grid-template-columns: 1fr 1fr; } .supernova-modern { padding: 30px 0px 70px 0px; background-position: center; } .supernovaapplywrap p { width: 100%; margin-top: 30px; line-height: 18px; font-size: 14px; } .ulstyle01 li { font-size: 10px; line-height: 12px; } .ulstyle01 { margin-top: 10px; } } /*********. Physical Ai Page ***************/ .physicalAIHero { position: relative; padding: 11vw 0px 7vw 0; background-color: #fefefe; width: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; z-index: 99; } .physicalAIHero:before { background: linear-gradient(90deg, #d3dafa 0%, rgb(248 249 255) 18%, #deebffe8 42%, #0d6efd94 68%, #9fbeec 100%); content: ''; width: 100%; height: 100%; position: absolute; top: 0; z-index: -1; } .airobotimg { position: absolute; bottom: 0; right: 12%; width: 50%; } .phyAIHerocontentLeft { width: 50%; display: flex; align-items: flex-start; justify-content: center; height: 100%; flex-direction: column; } .phyAIHerocontentLeft .colocLabel { display: inline-flex; align-items: center; justify-content: center; height: 42px; padding: 20px 20px; border-radius: 50px; border: 2px solid #dbe3ff; background: #fff; font-size: 1vw; line-height: 1.8vw; font-weight: 700; color: #2d56ff; margin-bottom: 10px; } .phyAIHerocontentLeft h1, .phyAIHerocontentLeft h2 { font-size: 4.7vw; line-height: 5vw; font-weight: 900; margin-bottom: 1.5vw; color: #000; } .phyAIHerocontentLeft h1 span, .phyAIHerocontentLeft h2 span { display: block; background: linear-gradient(180deg, #2864ff, #003cff); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .phyAIHerocontentLeft h4.phyAIsubtitle { font-size: 2.2vw; line-height: 2.4vw; font-weight: 900; letter-spacing: 0; margin-bottom: 1.2vw; color: #000; } .phyAIHerocontentLeft h4.phyAIsubtitle span { color: #2864ff; } .phyAIHerocontentLeft p { font-size: 1.2vw; line-height: 1.6vw; color: #000; margin-bottom: 1vw; font-weight: 500; width: 85%; } .phyAIHerocontentLeft .date-box { display: flex; align-items: center; gap: 18px; margin-top: 30px; } .phyAIHerocontentLeft .date-icon { width: 60px; height: 60px; border-radius: 14px; background: #fff; display: flex; align-items: center; justify-content: center; font-size: 28px; color: #2d56ff; box-shadow: 0 8px 20px rgba(0, 0, 0, .06); border: #d9d4d4 solid 1px; } .phyAIHerocontentLeft .date-icon em { color: #2d56ff; } .phyAIHerocontentLeft .date-content h4 { font-size: 1.5vw; font-weight: 900; line-height: 2.0vw; margin-bottom: 0; text-transform: uppercase; } .phyAIHerocontentLeft .date-content p { font-size: 1.1vw; color: #000; margin: 0; text-transform: uppercase; font-weight: 800; width: 100%; } .herofloating { position: absolute; right: 4%; bottom: 12%; z-index: 20; width: 250px; } .side-card { background: #fff; border-radius: 20px; padding: 1.5vw 1.3vw; box-shadow: 0 8px 20px rgba(0, 0, 0, .05), 0 20px 50px rgba(0, 0, 0, .08); margin-top: 30px; transition: .4s; } .side-card:hover { transform: translateY(-8px); } .sider-card-flex { display: flex; align-items: center; justify-content: center; } .side-card .play-circle { width: 50px; height: 50px; border-radius: 50%; border: 3px solid #dfe6ff; display: flex; align-items: center; justify-content: center; font-size: 28px; color: #2d56ff; margin-bottom: 0px; margin-right: 10px; } .side-card h3 { font-size: 1vw; line-height: 1.5vw; font-weight: 800; margin: 0; } .side-card p { font-size: 1.1vw; line-height: 1.3vw; color: #000; font-weight: 600; margin: 0; } .side-card .circle-number { width: 80px; height: 80px; border-radius: 50%; border: 2px dashed #2d56ff; display: flex; align-items: center; justify-content: center; font-size: 1.2vw; font-weight: 900; margin-bottom: 10px; color: #111; } .side-card .play-circle { width: 50px; height: 50px; border-radius: 50%; border: 3px solid #dfe6ff; display: flex; align-items: center; justify-content: center; font-size: 28px; color: #2d56ff; margin-bottom: 0px; margin-right: 10px; } .side-card .play-circle em { color: #2d56ff; width: 50px; } .phyAI-statswrap { position: relative; width: 100%; z-index: 99; margin-bottom: 3vw; } .phstats-strip { width: 100%; background: #fff; border-radius: 1.8vw; padding: 0vw 1vw; display: flex; align-items: center; justify-content: space-between; box-shadow: 0 .2vw .5vw rgba(0, 0, 0, .02), 0 1vw 2.5vw rgba(0, 0, 0, .05); overflow: hidden; margin-top: -5%; position: relative; isolation: isolate; transition: .5s; } .phstats-strip:before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(41, 93, 255, .04), rgba(0, 60, 255, .02), transparent); opacity: 0; transition: .6s; z-index: -1; } .phstats-strip:after { content: ''; position: absolute; top: 0; left: -120%; width: 40%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .9), transparent); transform: skewX(-25deg); transition: 1.2s; } .phystats-item { width: 25%; display: flex; align-items: center; gap: 20px; padding: 0 0.4vw; border-right: .08vw solid rgba(0, 0, 0, .08); transition: .4s; position: relative; overflow: hidden; transition: .45s cubic-bezier(.17, .67, .32, 1.3); cursor: pointer; padding-top: 2vw; padding-bottom: 2vw; min-height: 10vw; } .phystats-item:nth-child(1) { animation: floatCard 4s ease-in-out infinite; } .phystats-item:nth-child(2) { animation: floatCard 4s ease-in-out infinite .5s; } .phystats-item:nth-child(3) { animation: floatCard 4s ease-in-out infinite 1s; } .phystats-item:nth-child(4) { animation: floatCard 4s ease-in-out infinite 1.5s; } .phystats-item::before { content: ''; position: absolute; left: 50%; bottom: -100%; transform: translateX(-50%); width: 180%; height: 180%; background: radial-gradient(circle, rgba(41, 93, 255, .12), transparent 70%); transition: .7s; opacity: 0; } .phystats-item::after { content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 0%; height: .22vw; border-radius: 10vw; background: linear-gradient(90deg, #2d56ff, #00a6ff); transition: .5s; } .phystats-icon { width: 4vw; height: 4vw; display: flex; align-items: center; justify-content: center; font-size: 2.4vw; color: #2d56ff; flex-shrink: 0; } .phystats-icon { position: relative; transition: .5s; } .phystats-icon em { color: #2d56ff; font-size: 2.5vw; } .phystats-content h3 { font-size: 2.2vw; line-height: 1; font-weight: 900; margin-bottom: .65vw; background: linear-gradient(180deg, #2864ff, #003cff); -webkit-background-clip: text; -webkit-text-fill-color: transparent; position: relative; transition: .4s; } .phystats-content p { font-size: 1.0vw; line-height: 1.25; font-weight: 800; color: #111; margin: 0; transition: .4s; } .phystats-item:hover { background: linear-gradient(135deg, rgba(255, 255, 255, .9), rgba(241, 245, 255, .95)); backdrop-filter: blur(.6vw); } .phystats-item:hover:after { width: 75%; } .phystats-item:hover .phystats-content h3 { transform: translateY(-.15vw); letter-spacing: .04vw; /* filter: drop-shadow(0 .2vw .4vw rgba(41, 93, 255, .18)); */ } .phystats-item:hover .phystats-icon { transform: rotate(-8deg) scale(1.12); color: #003cff; } .phyaiMeetWrap { position: relative; padding: 5vw 0; } .phyaiMeetWrap h4 { font-size: 1vw; line-height: 1.3vw; font-weight: 800; color: #295dff; margin-bottom: 1.2vw; text-transform: uppercase; } .phyaiMeetWrap h2 { font-size: 2.4vw; line-height: 2.8vw; font-weight: 900; margin-bottom: 2vw; } .phyaiMeetWrap h2 span { color: #295dff; } .phyaiMeetWrap figure { height: 100%; width: 100%; position: relative; border-radius: 20px; background-size: cover; background-position: center; background-repeat: no-repeat; } .phyaiMeetWrap figure:before { content: ''; position: absolute; left: -10px; top: -10px; width: 8vw; height: 8vw; border-top: .9vw solid #1552ff; border-left: .9vw solid #1552ff; border-radius: 2.3vw 0 0 0; z-index: 20; pointer-events: none; } .phyaiMeetWrap figure:after { content: ''; position: absolute; right: -10px; bottom: -10px; width: 8vw; height: 8vw; border-bottom: .9vw solid #1552ff; border-right: .9vw solid #1552ff; border-radius: 0 0 2.3vw 0; z-index: 20; pointer-events: none; } .phyicon-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1vw; max-width: 44vw; } .phyicon-item { text-align: center; transition: .45s; cursor: pointer; position: relative; } .phyicon-item:hover { transform: translateY(-.4vw); } .phyicon-box { width: 4.6vw; height: 4.6vw; margin: auto auto 1vw; border-radius: 1.2vw; display: flex; align-items: center; justify-content: center; font-size: 2vw; color: #295dff; background: linear-gradient(135deg, rgba(41, 93, 255, .08), rgba(41, 93, 255, .02)); border: .08vw solid rgba(41, 93, 255, .10); transition: .45s; position: relative; overflow: hidden; } .phyicon-box::before { content: ''; position: absolute; inset: -30%; background: radial-gradient(circle, rgba(41, 93, 255, .18), transparent 70%); transform: scale(0); transition: .5s; } .phyicon-item:hover .phyicon-box::before { transform: scale(1); } .phyicon-item:hover .phyicon-box { background: linear-gradient(135deg, #295dff, #003cff); color: #fff; transform: rotate(-5deg) scale(1.08); box-shadow: 0 1vw 2vw rgba(41, 93, 255, .18); } .phyicon-item p { font-size: 1vw; line-height: 1.3vw; font-weight: 700; color: #000; margin: 0; } .phyicon-box em { color: #295dff; } .phyicon-item:hover .phyicon-box em { color: #fff; } .phyWhydubaiWrap { position: relative; padding: 4vw 0; } .launchcardInner { position: relative; overflow: hidden; border-radius: 20px; background: linear-gradient(135deg, #021b7c 0%, #00208f 40%, #001866 100%); box-shadow: 0 .4vw 1vw rgba(0, 0, 0, .05), 0 2vw 4vw rgba(0, 32, 143, .18); padding-right: 2vw; } .launchcardInner figure { height: 100%; width: 100%; position: relative; border-radius: 20px 0px 0px 20px; background-size: cover; background-position: 90% 6%; background-repeat: no-repeat; } .launchcardInner h4 { font-size: 1vw; line-height: 1.3vw; font-weight: 400; color: #fff; margin-bottom: 1.2vw; text-transform: uppercase; padding-top: 3vw; } .launchcardInner h2 { font-size: 2.4vw; line-height: 2.8vw; font-weight: 900; margin-bottom: 2vw; color: #fff; } .launchcardInner h2 span { color: #3baec1; } .feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; padding-bottom: 3vw; } .phyfeature-item { display: flex; align-items: flex-start; gap: 1vw; transition: .45s; cursor: pointer; } .phyfeature-item:hover { transform: translateY(-.35vw); } .phyfeature-icon { width: 3.5vw; height: 3.5vw; border-radius: 1vw; display: flex; align-items: center; justify-content: center; font-size: 1.7vw; color: #2d67ff; background: linear-gradient(135deg, rgba(45, 103, 255, .18), rgba(45, 103, 255, .05)); border: .08vw solid rgba(255, 255, 255, .08); flex-shrink: 0; transition: .45s; position: relative; overflow: hidden; } .phyfeature-icon::before { content: ''; position: absolute; inset: -40%; background: radial-gradient(circle, rgba(45, 103, 255, .25), transparent 70%); transform: scale(0); transition: .5s; } .phyfeature-item:hover .phyfeature-icon::before { transform: scale(1); } .phyfeature-item:hover .phyfeature-icon { background: linear-gradient(135deg, #2d67ff, #003cff); color: #fff; transform: rotate(-6deg) scale(1.08); box-shadow: 0 1vw 2vw rgba(45, 103, 255, .22); } .phyfeature-icon em { color: #fff; } .phyfeature-text { font-size: 1.1vw; line-height: 1.3vw; font-weight: 400; color: rgba(255, 255, 255, .88); } .phytestimonialWrap { padding: 5vw 0; position: relative; background: #f7f9fc; } .containerinnertest { display: flex; align-items: flex-start; justify-content: space-between; gap: 40px; } /* LEFT SIDE */ .phytest-left { width: 35%; } .phytest-left .tag { font-size: 1vw; line-height: 1.0vw; color: #0057ff; } .phytest-left h2 { font-size: 2.5vw; line-height: 2.9vw; margin-top: 10px; color: #000; } .phytest-left span { color: #0057ff; } /* RIGHT SIDE */ .phytestright-slider { width: 65%; } /* CARD */ .phyquotecard { background: #fff; padding: 25px 10px; border-radius: 16px; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08); height: 100%; } .quoticonphy { position: relative; } .quoticonphy img { width: 14%; margin-top: -18%; } .phyquotecard p { font-size: 1.1vw; line-height: 1.4vw; margin-bottom: 15px; position: relative; } .quoteMeta figure img { border-radius: 50%; width: 50px; height: 50px; object-fit: cover; object-position: center; margin-top: 15px; margin-bottom: 10px; display: none; } .quoteMeta h3.leader-name { font-size: 1.2vw; font-weight: 600; line-height: 1.4vw; padding-bottom: 0.2vw; text-transform: uppercase; } .quoteMeta p { font-size: 1vw; line-height: 1.6vw; position: relative; } .quoteMeta p.leader-designation span { font-size: 1.2vw; line-height: 1.4vw; font-weight: 600; color: #0057ff; text-transform: uppercase; } .phytestright-slider .swiper-button-prev {} .phytestright-slider .swiper-button-prev, .phytestright-slider .swiper-button-next { width: 45px; height: 45px; background: #fff; border-radius: 50%; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15); transition: all 0.3s ease; } /* Remove default arrow */ .phytestright-slider .swiper-button-prev::after, .phytestright-slider .swiper-button-next::after { font-size: 18px; font-weight: bold; color: #000; transition: transform 0.3s ease; } /* Hover effect */ .phytestright-slider .swiper-button-next:hover { transform: scale(1.1) translateX(5px); } .phytestright-slider .swiper-button-prev:hover { transform: scale(1.1) translateX(-5px); } /* RESPONSIVE */ @media (max-width: 991px) { .containerinnertest { flex-direction: column; } .phytest-left, .phytestright-slider { width: 100%; } .phytest-left { text-align: center; } } .phytest-arrows { display: flex; gap: 15px; margin-top: 10px; } .phytest-arrows .swiper-button-prev, .phytest-arrows .swiper-button-next { position: relative; /* IMPORTANT */ top: auto; left: auto; right: auto; width: 45px; height: 45px; background: #fff; border-radius: 50%; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15); margin-top: 1vw; } /* arrow icon */ .phytest-arrows .swiper-button-prev::after, .phytest-arrows .swiper-button-next::after { font-size: 16px; color: #000; } /* hover */ .phytest-arrows .swiper-button-next:hover { transform: translateX(5px) scale(1.1); } .phytest-arrows .swiper-button-prev:hover { transform: translateX(-5px) scale(1.1); } .phytest-arrows .swiper-button-next { display: none; } .testimonialSwiper .swiper-wrapper { align-items: stretch; } /* each slide full height */ .testimonialSwiper .swiper-slide { height: auto; display: flex; margin-bottom: 20px; } /* card takes full height */ .phyquotecard { display: flex; flex-direction: column; justify-content: space-between; height: 100%; } .phyadbanner { width: 100%; background: #0041DD; position: relative; } .phyadbanner h4 { font-size: 30px; line-height: 1.2; margin: 0 0 20px; padding: 0; } .phyadbanner:before { position: absolute; content: ""; width: 40vw; height: 128%; background: url(https://aieverythingabudhabi.com/images/robotic_hadn.png) no-repeat right center/contain; top: -13%; left: -9%; transform: scaleX(-1); animation: floatRobot2 5s ease-in-out infinite; } @keyframes floatRobot2 { 0% { transform: translateY(0) scaleX(-1); } 50% { transform: translateY(-15px) scaleX(-1); } 100% { transform: translateY(0) scaleX(-1); } } .app_card { border-radius: 20px; border-left: 1px solid #fff; padding: 20px 20px 0 20px; display: flex; justify-content: space-between; align-items: center; } .app_card .infoapp h5 { font-size: 26px; line-height: 1.2; margin: 0; padding: 0; } .app_card .infoapp figure { width: 120px; margin: 20px 0 0; } .mob_mockup { width: 60%; height: 200px; margin: 0; position: relative; right: 40px; } .mob_mockup img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 0%; } .app_card .infoapp figure img { width: 100%; height: 100%; object-fit: contain; } .app_card { border-radius: 20px; border-left: 1px solid #fff; padding: 20px 20px 0 20px; display: flex; justify-content: space-between; align-items: center; } .app_card .infoapp h5 { font-size: 26px; line-height: 1.2; margin: 0; padding: 0; } .app_card .infoapp figure { width: 120px; margin: 20px 0 0; } .app_card .infoapp figure img { width: 100%; height: 100%; object-fit: contain; } .mob_mockup { width: 60%; height: 200px; margin: 0; position: relative; right: 40px; } .mob_mockup img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 0%; } .ai-ultra { padding: 5vw 0; } .ai-ultra-wrap { display: flex; gap: 22px; justify-content: center; } .ai-ultra .phsector-card { position: relative; width: 30vw; height: 35vw; border-radius: 28px; overflow: hidden; background: #000; border: 1px solid rgba(255, 255, 255, 0.06); transition: 0.4s ease; } .ai-ultra .phsector-card::before { content: ""; position: absolute; top: 0; left: 0; height: 4px; width: 100%; background: currentColor; opacity: 0.8; z-index: 3; } .sect-blue { color: #3b82f6; background: radial-gradient(circle at bottom, rgba(59, 130, 246, 0.18), #000 60%); } .sect-cyan { color: #06b6d4; background: radial-gradient(circle at bottom, rgba(6, 182, 212, 0.18), #000 60%); } .sect-purple { color: #a855f7; background: radial-gradient(circle at bottom, rgba(168, 85, 247, 0.18), #000 60%); } .sect-orange { color: #f97316; background: radial-gradient(circle at bottom, rgba(249, 115, 22, 0.18), #000 60%); } .sect-green { color: #22c55e; background: radial-gradient(circle at bottom, rgba(34, 197, 94, 0.18), #000 60%); } /* IMAGE SECTION */ .phsector-card figure { position: absolute; bottom: 0; left: 0; width: 100%; height: 60%; z-index: 1; overflow: hidden; background-size: cover; background-position: center; background-repeat: no-repeat; transform: scale(1.05); transition: 0.6s ease; } .phsector-card:hover figure { transform: scale(1.12); } .phsector-card figure img { width: 100%; height: 100%; object-fit: cover; } /* IMAGE OVERLAY GRADIENT */ .phsector-card figure::after { content: ""; position: absolute; inset: 0; height: 30%; pointer-events: none; background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 40%, rgba(0, 0, 0, 0.75) 65%, rgba(0, 0, 0, 0.95) 85%, #000 100%); } /* BLUR EFFECT */ .phsector-card figure::before { content: ""; position: absolute; inset: 0; backdrop-filter: blur(6px); opacity: 0.15; } /* OVERLAY CONTENT */ .ph1sector-overlay { position: absolute; inset: 0; padding: 10px 20px; display: flex; flex-direction: column; justify-content: space-between; z-index: 2; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0.35) 40%, transparent 70%); } /* COLOR OVERLAY VARIANTS */ .sect-blue .ph1sector-overlay { background: linear-gradient(to bottom, rgba(59, 130, 246, 0.72), rgba(0, 0, 0, 0.4) 40%, transparent 65%); } .sect-cyan .ph1sector-overlay { background: linear-gradient(to bottom, rgba(6, 182, 212, 0.73), rgba(0, 0, 0, 0.4) 40%, transparent 65%); } .sect-purple .ph1sector-overlay { background: linear-gradient(to bottom, rgba(167, 85, 247, 0.43), rgba(0, 0, 0, 0.4) 40%, transparent 65%); } .sect-orange .ph1sector-overlay { background: linear-gradient(to bottom, rgb(112, 96, 77), rgba(0, 0, 0, 0.4) 40%, transparent 65%); } .sect-green .ph1sector-overlay { background: linear-gradient(to bottom, rgba(30, 180, 96, 0.49), rgba(0, 0, 0, 0.4) 40%, transparent 65%); } /* TOP CONTENT */ .top-content22 { position: absolute; top: 20px; left: 20px; right: 20px; z-index: 3; } .phstnum { font-size: 1.5vw; font-weight: 900; color: currentColor; padding: 20px 10px; opacity: 0.9; } .sector-icon { width: 58px; height: 58px; margin: 10px 0 14px; display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 24px; border: none; color: currentColor; background: rgba(255, 255, 255, 0.05); position: relative; } .sector-icon em, .sector-icon i { color: currentColor; } .sector-icon::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 1px solid currentColor; border-left: 3px solid currentColor; opacity: 0.9; } .sector-icon svg { width: 26px; height: 26px; stroke: #fff; } .ph1sector-overlay h3 { font-size: 1.5vw; line-height: 2vw; font-weight: 500; max-width: 90%; color: #fff; } .ph1sector-overlay h3::after { content: ""; display: block; width: 40px; height: 3px; margin-top: 1.1vw; border-radius: 2px; background: currentColor; } .phsector-card:hover { transform: scale(1.06); } .phsector-card:hover .sector-icon { transform: scale(1.1); transition: 0.3s ease; } .phsector-card.active { transform: scale(1.08); z-index: 3; } .phsector-card:nth-child(2), .phsector-card:nth-child(4) { transform: translateY(50px); } @media (max-width: 900px) { .ai-ultra-wrap { flex-direction: column; align-items: center; } .phsector-card { width: 90%; height: 420px; transform: none !important; } } .keytopics { padding: 4vw 0; background: #f7f9fc; } .keytopics .section-title { font-size: 2.4vw; line-height: 2.8vw; font-weight: 900; margin-bottom: 2vw; text-transform: uppercase; text-align: center; } .keytopics .section-title::after { content: ""; width: 60px; height: 4px; background: #2c4c7c; position: absolute; left: 0; bottom: -10px; border-radius: 10px; } /* GRID */ .topics-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; } /* CARD */ .topic-card { background: #fff; padding: 20px 20px 20px 60px; border-radius: 12px; position: relative; transition: 0.3s ease; box-shadow: 0 8px 25px rgba(0, 0, 0, 0.05); cursor: pointer; } /* LEFT phstnumBER */ .topic-card span { position: absolute; left: 15px; top: 20px; font-size: 22px; font-weight: bold; color: #0043ba; } /* TEXT */ .topic-card p { font-size: 1.4vw; margin: 0; color: #000; font-weight: 500; } /* HOVER EFFECT */ .topic-card:hover { transform: translateY(-5px); box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08); border-left: 5px solid #0043ba; } /* MOBILE */ @media(max-width: 768px) { .topics-grid { grid-template-columns: 1fr; } } .live-energy { position: relative; padding: 4vw 0; } .liveengeryItem { position: relative; width: 100%; height: 100%; padding: 3vw 2vw; display: flex; align-items: center; justify-content: center; background-color: #000; background-size: cover; background-repeat: no-repeat; background-position: center; border-radius: 20px; border: 10px solid #0057ffba; -webkit-border-radius: 34px; -moz-border-radius: 34px; -ms-border-radius: 34px; -o-border-radius: 34px; min-height: 15vw; z-index: 9; } .liveengeryItem:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(180deg, rgb(0 65 185 / 52%) 0%, rgb(0 65 185 / 64%) 0%, rgb(0 0 0 / 66%) 60%); -webkit-border-radius: 34px; -moz-border-radius: 34px; -ms-border-radius: 34px; -o-border-radius: 34px; z-index: -1; } .liveengeryItem h2 { color: #fff; font-size: 1.8vw; line-height: 2.5vw; text-transform: uppercase; text-align: center; } .liveengeryItem { transition: all 0.4s ease; overflow: hidden; } .liveengeryItem:hover { transform: translateY(-8px) scale(1.03); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.35); border-color: #00c2ff; } .liveengeryItem { background-size: 120%; transition: all 0.6s ease; } .liveengeryItem:hover { background-size: 135%; } .liveengeryItem:before { transition: all 0.4s ease; } .liveengeryItem:hover:before { background: linear-gradient(180deg, rgba(0, 87, 255, 0.35) 0%, rgba(0, 0, 0, 0.75) 70%); } .liveengeryItem h2 { transition: all 0.4s ease; transform: translateY(0); } .liveengeryItem:hover h2 { transform: translateY(-6px); letter-spacing: 1px; } .liveengeryItem:hover { box-shadow: 0 0 0 2px rgba(0, 183, 255, 0.3), 0 25px 60px rgba(0, 0, 0, 0.4); } .coloactedshoebtminner { position: relative; padding: 3vw 0; } .coloactedshoebtminner { position: relative; } .coshow02_card { position: relative; overflow: hidden; border-radius: 20px; width: 100%; height: 240px; } .coshow02_card::before { position: absolute; content: ""; width: 100%; height: 100%; background: linear-gradient(90deg, rgba(0, 0, 0, 1) 25%, rgba(0, 0, 0, 0.45) 50%, rgba(0, 0, 0, 0) 100%); top: 0; left: 0; position: relative; } .coshow02_card figure { width: 100%; height: 100%; background-size: cover; background-position: center; background-repeat: no-repeat; } .coshow02_card figure:before { position: absolute; content: ""; width: 100%; height: 100%; background: linear-gradient(90deg, rgba(0, 0, 0, 1) 25%, rgba(0, 0, 0, 0.45) 50%, rgba(0, 0, 0, 0) 100%); top: 0; left: 0; } .coshow02_card figure img { width: 100%; height: 100%; object-fit: cover; } .coshow02_card .show02content { position: absolute; top: 0; left: 0; padding: 20px; display: flex; flex-direction: column; justify-content: space-evenly; align-items: flex-start; width: 100%; height: 100%; } .coshow02_card .show02content h4 { color: #fff; font: 36px; margin: 0; padding: 0; } .coshow02_card .show02content h4 span { color: #17b9c0; display: block; } .coshow02_card .show02content a { font-size: 18px; color: #fff; text-decoration: none; margin: 0; padding: 0; } .coshow02_card .show02content em { color: #fff; } .coshow02_card, .coshow02_card * { transition: all 0.4s ease; } .coshow02_card figure { transform: scale(1); } .coshow02_card:hover figure { transform: scale(1.08); } .coshow02_card::before { opacity: 0.9; transition: all 0.4s ease; } .coshow02_card:hover::before { opacity: 1; background: linear-gradient(90deg, rgba(0, 0, 0, 0.9) 20%, rgba(0, 0, 0, 0.4) 60%, rgba(0, 0, 0, 0) 100%); } .coshow02_card .show02content { transform: translateY(10px); } .coshow02_card:hover .show02content { transform: translateY(-5px); } .coshow02_card h4 { transform: translateY(10px); opacity: 0.9; } .coshow02_card:hover h4 { transform: translateY(0); opacity: 1; } /* Button arrow slide */ .coshow02_card .viewbtn_wrap a { display: inline-flex; align-items: center; gap: 8px; } .coshow02_card .viewbtn_wrap em { transform: translateX(0); } .coshow02_card:hover .viewbtn_wrap em { transform: translateX(6px); } /* Optional glow effect */ .coshow02_card:hover { box-shadow: 0 15px 40px rgba(0, 0, 0, 0.25); } .btm-phystats02 { margin: 0 !important; margin-top: 4vw !important; padding-bottom: 4vw; } .btm-phystats02 .phystats-content h3 { font-size: 2.0vw; } .btm-phystats02 .phystats-content p { font-size: 1.3vw; line-height: 1.5vw; letter-spacing: unset; text-transform: uppercase; } .btm-phystats02 .phystats-item:nth-child(1) { width: 40%; } .side-card .circle-number { width: 80px; height: 80px; border-radius: 50%; border: 2px dashed #2d56ff; display: flex; align-items: center; justify-content: center; font-size: 1.2vw; font-weight: 900; margin-bottom: 10px; color: #111; } .circle-phstnumber { width: 80px; height: 80px; border-radius: 50%; border: 2px dashed #2d56ff; display: flex; align-items: center; justify-content: center; font-size: 1.2vw; font-weight: 900; margin-bottom: 10px; color: #111; } @media only screen and (min-width: 320px) and (max-width: 768px) { .phyaiMeetWrap { position: relative; padding: 30px 0px; } .phyaiMeetWrap h4 { font-size: 11px; line-height: 20px; margin-bottom: 10px; } .phyaiMeetWrap h2 { font-size: 25px; line-height: 26px; font-weight: 900; margin-bottom: 20px; } .phyicon-grid { gap: 10px; max-width: 100%; } .phyicon-box { width: 50px; height: 50px; margin: auto auto 5px; border-radius: 10px; font-size: 20px; } .phyicon-item p { font-size: 12px; line-height: 16px; } .phyaiMeetWrap figure { height: 350px; margin: 30px 0px; } .ai-ultra { padding: 20px 0px; position: relative; } .ai-ultra-wrap { display: block; } .ai-ultra .phsector-card { margin: 20px 0px; width: 100%; height: 400px; display: inline-block; } .ph1sector-overlay h3 { font-size: 16px; line-height: 20px; } .topic-card p { font-size: 14px; } .ph1sector-overlay { padding: 10px 10px; } .phstnum { font-size: 15px; padding: 10px 10px; display: none; } .sector-icon { width: 45px; height: 45px; font-size: 19px; } .ph1sector-overlay h3 { font-size: 20px; line-height: 25px; } .top-content22 { top: 20px; left: 10px; right: 10px; } .phsector-card figure { height: 66%; } .launchcardInner { position: relative; padding: 20px; } .launchcardInner h4 { font-size: 12px; line-height: 16px; margin-bottom: 10px; } .launchcardInner h2 { font-size: 20px; line-height: 25px; margin-bottom: 20px; } .feature-grid { padding-bottom: 20px; gap: 10px; } .phyfeature-icon { width: 30px; height: 30px; font-size: 16px; border-radius: 10px; margin-bottom: 10px; } .phyfeature-item { display: block; margin-bottom: 30px; } .phyfeature-text { font-size: 12px; line-height: 14px; } .launchcardInner figure { height: 300px; border-radius: 20px; } .phytest-left .tag { font-size: 14px; line-height: 17px; } .phytest-left h2 { font-size: 25px; line-height: 35px; } .phytestimonialWrap { padding: 30px 0px; } .phyquotecard { margin: 0 30px; } .phyquotecard p { font-size: 16px; line-height: 20px; } .quoteMeta h3.leader-name { font-size: 12px; font-weight: 600; line-height: 14px; padding-bottom: 5px; } .quoteMeta p { font-size: 12px; line-height: 17px; } .quoteMeta p.leader-designation span { font-size: 16px; line-height: 20px; padding-top: 10px; } .quoticonphy img { width: 19%; margin-top: -5%; margin-bottom: 10%; } .phytest-arrows { position: absolute; top: 53%; z-index: 99; left: 1%; } .phyadbanner { padding: 30px 10px; padding-bottom: 5px; } .phyadbanner h4 { font-size: 28px; line-height: 1.2; } .mob_mockup { width: 100%; height: 251px; margin: 0; right: 0; } .phyadbanner:before { display: none; } .app_card { margin-top: 30px; padding: 0px 10px; } .herofloating { display: none; } .app_card .infoapp h5 { font-size: 19px; line-height: 20px; } .app_card .infoapp h5 { font-size: 19px; line-height: 1.2; } .liveengeryItem { width: 100%; height: 250px; padding: 20px; } .liveengeryItem h2 { color: #fff; font-size: 17px; line-height: 20px; } .live-energy { position: relative; padding: 40px 0px; } .coshow02_card { position: relative; overflow: hidden; border-radius: 20px; width: 100%; height: 240px; margin-bottom: 30px; } .phstats-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; box-shadow: none; } .phstats-strip> :last-child:nth-child(3n + 2) { grid-column: span 2; } .phystats-item { width: auto; border-right: none; padding-top: 10px; padding-bottom: 10px; min-height: 90px; box-shadow: 0 .2vw .5vw rgba(0, 0, 0, .02), 0 1vw 2.5vw rgba(0, 0, 0, .05); height: 100%; padding-left: 10px; } .phystats-content h3 { font-size: 20px; line-height: 29px; margin-bottom: 16px; } .phystats-content p { font-size: 11px; line-height: 14px; } .phystats-icon { display: none; } .btm-phystats02 .phystats-item:nth-child(1) { width: 100%; grid-column: span 3; } .btm-phystats02 .phystats-content h3 { font-size: 18px; line-height: 22px; } .btm-phystats02 .phystats-content p { font-size: 12px; line-height: 17px; } .coloactedshoebtminner { position: relative; padding: 10px 0px; } .phyAIHerocontentLeft .colocLabel { padding: 10px 20px; font-size: 12px; line-height: 14px; } .phyAIHerocontentLeft h1, .phyAIHerocontentLeft h2 { font-size: 30px; line-height: 35px; margin-bottom: 10px; } .phyAIHerocontentLeft h4.phyAIsubtitle { font-size: 20px; line-height: 24px; letter-spacing: 0; margin-bottom: 10px; } .phyAIHerocontentLeft p { font-size: 14px; line-height: 20px; margin-bottom: 10px; width: 70%; } .phyAIHerocontentLeft { width: 100%; } .physicalAIHero:before { background: linear-gradient(90deg, #d3dafa 0%, rgb(248 249 255) 18%, #deebff 42%, #dfe1e2c2 68%, #d7ddfacc 100%); } .phyAIHerocontentLeft .date-content h4 { font-size: 16px; line-height: 20px; } .phyAIHerocontentLeft .date-content p { font-size: 14px; } .phyAIHerocontentLeft .date-icon { width: 45px; height: 45px; font-size: 20px; } .airobotimg { position: absolute; bottom: 0; right: -30%; width: 92%; opacity: 0.7; } .liveengeryItem { width: 100%; height: 100%; padding: 50px 20px; min-height: auto; -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; background-size: cover; } .liveengeryItem:before { -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; } } /************ AI STARTX *****************/ .startxherobanner { position: relative; padding: 11vw 0px 7vw 0; background-color: #fefefe; width: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; z-index: 99; margin-bottom: 40px; } .bannercontentstartx { position: relative; padding: 40px 0px; height: 100%; display: flex; align-items: center; justify-content: center; } .bannercontentstartx h2 { color: #fff; font-size: 3.6vw; line-height: 4.3vw; font-weight: 900; margin-bottom: 1.5vw; text-transform: uppercase; } .bannercontentstartx h4 { color: #ffc857; font-size: 1.6vw; line-height: 2vw; } .startxlogomain { width: 18vw; margin-bottom: 1.5vw; } .bannercontentstartx figure { transform: scale(1.2); position: relative; } .aistartxIntro { position: relative; padding: 4vw 0; } .aistartxIntro h2 { font-size: 4vw; line-height: 3.5vw; color: #000; position: relative; text-transform: uppercase; margin-bottom: 2vw; } .aistartxIntro p { font-size: 1.4vw; line-height: 2vw; color: #000; margin-bottom: 1.4vw; width: 90%; } .aistartxIntro figure { position: relative; height: 100%; width: 100%; border-radius: 20px; background-size: cover; background-position: bottom; background-repeat: no-repeat; } .aistartxIntro figure:before { content: ''; position: absolute; left: -10px; top: -10px; width: 8vw; height: 8vw; border-top: .9vw solid #4e05d7; border-left: .9vw solid #4e05d7; border-radius: 2.3vw 0 0 0; z-index: 20; pointer-events: none; } .aistartxIntro figure:after { content: ''; position: absolute; right: -10px; bottom: -10px; width: 8vw; height: 8vw; border-bottom: .9vw solid #4e05d7; border-right: .9vw solid #4e05d7; border-radius: 0 0 2.3vw 0; z-index: 20; pointer-events: none; } .pitchawrd-section { position: relative; padding: 4vw 0; background: radial-gradient(circle at 80% 15%, rgb(255 78 205 / 0%), transparent 35%), radial-gradient(circle at 50% 85%, rgba(0, 20, 170, 0.35), transparent 55%), linear-gradient(180deg, #ffffff 0%, #eef1ff 30%, #1a2cff00 70%, #0014aa 100%); overflow: hidden; } .pitchawrd-section::after { content: ""; position: absolute; right: 0; top: 0; width: 40%; height: 100%; background: radial-gradient(circle, rgba(255, 78, 205, 0.25), transparent 70%); filter: blur(100px); } .pitchawrd-section::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 20% 80%, rgba(106, 92, 255, 0.12), transparent 40%); z-index: -1; } .pitchawrd-container { display: flex; align-items: center; justify-content: space-between; gap: 60px; flex-wrap: wrap; } .pitchawrd-left { flex: 1; } .pitchawrd-tag { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 30px; background: #f3f3ff; color: #765bfb; font-size: 1.2vw; margin-bottom: 20px; font-weight: 600; border: #00000040 solid 1px; } .pitchawrd-tag i { background: linear-gradient(90deg, #6a5cff, #ff4ecd); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .pitchawrd-left h2 { font-size: 3.1vw; line-height: 3.9vw; margin-bottom: 2vw; text-transform: uppercase; color: #000; font-weight: 900; } .pitchawrd-left h2 span { background: linear-gradient(90deg, #6a5cff, #ff4ecd); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .pitchawrd-left p { font-size: 1.4vw; line-height: 1.8vw; color: #000; margin-bottom: 2vw; } .pitchawrd-right { position: relative; width: 34vw; } .pitchawrd-shape { width: 100%; padding: 6px; border-radius: 60% 40% 55% 45% / 55% 45% 60% 40%; background: linear-gradient(45deg, #ff00cc, #ff7a00, #3333ff); backdrop-filter: blur(10px); box-shadow: 0 0 40px rgba(255, 0, 204, 0.6), 0 0 80px rgba(51, 51, 255, 0.4); } .pitchawrd-img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3); } @keyframes pitchawrd-float { 0% { transform: translateY(0) rotate(0deg) scale(1); } 50% { transform: translateY(-15px) rotate(0.5deg) scale(1.02); } 100% { transform: translateY(0) rotate(0deg) scale(1); } } .pitchawrd-float { animation: pitchawrd-float 6s ease-in-out infinite; } @media (max-width: 768px) { .pitchawrd-container { flex-direction: column; text-align: center; } .pitchawrd-left h2 { font-size: 32px; line-height: 40px; } .pitchawrd-right { width: 280px; } } .startxInvestorWrap { position: relative; padding: 4vw 0px 5vw 0; background: #0014aa; z-index: 99; } .starxinvestorbackImg { position: absolute; top: -5%; left: -9%; width: 91%; height: 100%; background-size: 100% 100%; background-repeat: no-repeat; z-index: -1; } .startxinvtLogo { position: relative; background: #0014aa; padding: 0vw 0px 4vw 0; } .investor-flex-row { display: flex; gap: 15px; flex-wrap: wrap; align-items: center; } .investor-flex-row figure { width: 10vw; height: 100px; background: #fff; box-shadow: 0 0 14px rgba(0, 0, 0, 0.3); margin: 0; display: flex; align-items: center; justify-content: center; padding: 15px; border-radius: 10px; } .investor-flex-row span { color: #fff; font-weight: 400; font-size: 1.1vw; } .startxSpeakersWrap { position: relative; padding: 4vw 0; } .speaker-startx { width: 100%; position: relative; } .speaker-startx .speaker-img-wrap { position: relative; overflow: hidden; border-radius: 16px; } .speaker-startx .speaker-img-wrap img { width: 100%; display: block; } .speaker-startx .hover-info { position: absolute; inset: 0; background: rgba(10, 20, 80, 0.45); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: #fff; padding: 16px; font-size: 13px; line-height: 1.5; opacity: 0; transform: translateY(20px); transition: 0.35s ease; display: flex; align-items: center; justify-content: center; } .speaker-startx .hover-info p { color: #fff; font-size: 1.1vw; line-height: 1.6vw; text-align: center; } .speaker-startx .speaker-img-wrap:hover .hover-info { opacity: 1; transform: translateY(0); } .speaker-startx .speaker-info { margin-top: 12px; text-align: center; } .speaker-startx .speaker-info h4 { margin: 0; font-size: 1.45vw; line-height: 1.6vw; font-weight: 600; padding-bottom: 0.8vw; text-transform: uppercase; } .speaker-startx .speaker-info span { display: block; font-size: 1.2vw; line-height: 1.4vw; padding-top: 0.8vw; font-weight: 400; } .speaker-startx .speaker-info p { margin: 0px 0 0; font-size: 1.45vw; line-height: 1.6vw; color: #0066ff; font-weight: 600; text-transform: uppercase; } .startxAttendWrap { position: relative; padding: 4vw 0; background: linear-gradient(180deg, #ffffff, #eef1ff); } .startxattends-wrapper { display: grid; grid-template-columns: 1.2fr 1fr; gap: 60px; align-items: center; margin-top: 20px; } .strxattends-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; } .strxattend-card { position: relative; padding: 26px 18px; border-radius: 18px; text-align: center; cursor: pointer; background: rgba(255, 255, 255, 0.65); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border: 1px solid rgba(255, 255, 255, 0.4); box-shadow: 0 12px 30px rgba(0, 0, 0, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.5); transition: all 0.35s ease; overflow: hidden; } .strxattend-card::before { content: ""; position: absolute; inset: 0; border-radius: 18px; padding: 1px; background: linear-gradient(120deg, #1a2cff, #ff4ecd); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; opacity: 0; transition: 0.3s; } .strxattend-card:hover { transform: translateY(-8px) scale(1.03); box-shadow: 0 25px 60px rgba(26, 44, 255, 0.25), 0 0 30px rgba(255, 78, 205, 0.2); } .strxattend-card:hover::before { opacity: 1; } .strxicon-wrap { width: 56px; height: 56px; margin: 0 auto 16px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: rgba(255, 255, 255, 0.7); backdrop-filter: blur(12px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6), 0 10px 25px rgba(0, 0, 0, 0.08); transition: 0.3s ease; } .strxicon-wrap i, .strxicon-wrap em { font-size: 1.5vw; background: linear-gradient(120deg, #1a2cff, #ff4ecd); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .strxattend-card:hover .strxicon-wrap { transform: scale(1.08); box-shadow: 0 0 20px rgba(26, 44, 255, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.6); } .strxattend-card h4 { font-size: 1.2vw; line-height: 1.4vw; font-weight: 600; color: #000; margin: 0; text-transform: uppercase; } .attends-right { position: relative; } .attends-right img { width: 100%; border-radius: 22px; object-fit: cover; box-shadow: 0 25px 60px rgba(0, 0, 0, 0.18); transition: 0.4s ease; height: 100%; } .attends-right:hover img { transform: scale(1.03); } .attends-right::before { content: ""; position: absolute; width: 240px; height: 240px; background: #1a2cff; filter: blur(140px); top: 20%; left: 10%; z-index: -1; } @media (max-width: 992px) { .startxattends-wrapper { grid-template-columns: 1fr; gap: 40px; } .strxattends-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 576px) { .strxattends-grid { grid-template-columns: 1fr; } } .startx-split { padding: 4vw 0; position: relative; background: radial-gradient(circle at 20% 20%, #f5f7ff, #ffffff); } .split-cards { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; } .mini-card { position: relative; padding: 20px; border-radius: 16px; background: rgba(255, 255, 255, 0.75); backdrop-filter: blur(12px); border: 1px solid rgba(0, 0, 0, 0.05); transition: all 0.35s ease; overflow: hidden; z-index: 1; } .mini-card::after { content: ""; position: absolute; inset: 0; opacity: 0; transition: 0.4s ease; z-index: -1; border-radius: 16px; } .mini-card:hover { transform: translateY(-6px) scale(1.02); box-shadow: 0 15px 40px rgba(0, 0, 0, 0.08); } .mini-card:hover::after { opacity: 1; } .mini-card h3 { font-size: 1.2vw; line-height: 1.6vw; font-weight: 600; margin-bottom: 8px; text-transform: uppercase; color: #000; text-transform: uppercase; background: linear-gradient(90deg, #6a5cff, #ff4ecd); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .mini-card p { font-size: 1vw; line-height: 1.2vw; color: #000; } @media (max-width: 1200px) { .split-cards { grid-template-columns: repeat(3, 1fr); } } @media (max-width: 768px) { .split-cards { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 480px) { .split-cards { grid-template-columns: 1fr; } } .bg-blobs { position: absolute; inset: 0; overflow: hidden; z-index: 0; } .blob { position: absolute; width: 400px; height: 400px; border-radius: 50%; filter: blur(80px); opacity: 0.35; animation: floatBlob 18s ease-in-out infinite; } .blob1 { background: radial-gradient(circle, #6c63ff, transparent 70%); top: -100px; left: -100px; } .blob2 { background: radial-gradient(circle, #8f6bff, transparent 70%); bottom: -120px; right: -80px; animation-delay: 4s; } .blob3 { background: radial-gradient(circle, #4fd1c5, transparent 70%); top: 40%; left: 60%; animation-delay: 8s; } @keyframes floatBlob { 0% { transform: translate(0, 0) scale(1); } 50% { transform: translate(40px, -40px) scale(1.1); } 100% { transform: translate(0, 0) scale(1); } } .mini-card { position: relative; padding: 20px; border-radius: 18px; background: rgba(255, 255, 255, 0.75); backdrop-filter: blur(12px); border: 1px solid rgba(0, 0, 0, 0.06); transition: all 0.4s ease; overflow: hidden; z-index: 1; } .mini-card::before { content: ""; position: absolute; inset: -1px; border-radius: 18px; background: linear-gradient(120deg, #6c63ff, #00d4ff, #8f6bff); opacity: 0; transition: 0.4s ease; z-index: -1; } .mini-card::after { content: ""; position: absolute; inset: 1px; background: rgba(255, 255, 255, 0.85); border-radius: 16px; z-index: -1; } .mini-card:hover::before { opacity: 1; filter: blur(8px); } .mini-card:hover { transform: translateY(-8px) scale(1.02); box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1); } .card-circle { width: 52px; height: 52px; border-radius: 50%; margin-bottom: 14px; display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 15px; border: none; background: rgba(108, 99, 255, 0.1); color: #6c63ff; transition: all 0.35s ease; } .mini-card:nth-child(1) .card-circle { background: rgba(108, 99, 255, 0.12); color: #6c63ff; } .mini-card:nth-child(2) .card-circle { background: rgba(79, 172, 254, 0.12); color: #4facfe; } .mini-card:nth-child(3) .card-circle { background: rgba(255, 78, 205, 0.12); color: #ff4ecd; } .mini-card:nth-child(4) .card-circle { background: rgba(0, 201, 167, 0.12); color: #00c9a7; } .mini-card:nth-child(5) .card-circle { background: rgba(249, 168, 38, 0.12); color: #f9a826; } .mini-card:nth-child(6) .card-circle { background: rgba(0, 184, 255, 0.12); color: #00b8ff; } .mini-card:nth-child(7) .card-circle { background: rgba(255, 150, 113, 0.12); color: #ff9671; } .mini-card:nth-child(8) .card-circle { background: rgba(46, 204, 113, 0.12); color: #2ecc71; } .mini-card:nth-child(9) .card-circle { background: rgba(232, 67, 147, 0.12); color: #e84393; } .mini-card:nth-child(10) .card-circle { background: rgba(0, 206, 201, 0.12); color: #00cec9; } .mini-card:hover .card-circle { transform: scale(1.08); color: #fff; } .mini-card:nth-child(1):hover .card-circle { background: #6c63ff; } .mini-card:nth-child(2):hover .card-circle { background: #4facfe; } .mini-card:nth-child(3):hover .card-circle { background: #ff4ecd; } .mini-card:nth-child(4):hover .card-circle { background: #00c9a7; } .mini-card:nth-child(5):hover .card-circle { background: #f9a826; } .mini-card:nth-child(6):hover .card-circle { background: #00b8ff; } .mini-card:nth-child(7):hover .card-circle { background: #ff9671; } .mini-card:nth-child(8):hover .card-circle { background: #2ecc71; } .mini-card:nth-child(9):hover .card-circle { background: #e84393; } .mini-card:nth-child(10):hover .card-circle { background: #00cec9; } .startuplaunlogo { position: relative; padding: 4vw 0; } .startuplaunlogo .row .col-sm-3 { flex: 0 0 auto; width: 16.6666%; } .startuplaunlogo figure { width: 100%; height: 100px; background: #fff; margin: 0; display: flex; align-items: center; justify-content: center; border-radius: 10px; box-shadow: 0 4px 20px -8px rgba(0, 0, 0, 0.15); } .startuplaunlogo figure img { max-width: 100%; max-height: 100%; } /** Responsvie **/ @media only screen and (min-width: 320px) and (max-width: 768px) { .startxherobanner{ padding: 40px 20px; margin-bottom: 0; } .bannercontentstartx{ padding: 0; } .startxlogomain { width: 200px; margin-bottom: 20px; } .bannercontentstartx h2 { font-size: 30px; line-height: 34px; margin-bottom: 10px; } .bannercontentstartx h4 { font-size: 16px; line-height: 20px; } .bannercontentstartx figure{ margin-top: 30px; } .aistartxIntro { padding: 40px 0px; } .aistartxIntro h2{ font-size: 20px; line-height: 25px; margin-bottom: 10px; } .aistartxIntro p { font-size: 14px; line-height: 19px; margin-bottom: 10px; width: 100%; } .aistartxIntro figure{ height: 300px; width: 100%; margin-top: 30px; } .pitchawrd-section{ padding:0px 0px 30px 0px; } .pitchawrd-tag{ font-size: 13px; } .pitchawrd-left h2 { font-size: 19px; line-height: 29px; } .pitchawrd-left p { font-size: 14px; line-height: 19px; margin-bottom: 10px; } .pitchawrd-right { width: 100%; } .startxInvestorWrap{ padding: 30px 0px; } .starxinvestorbackImg{ height: 250px; position: relative; background-image: url(contents/theme-26/images/investormobile01.jpeg) !important; background-position: top !important; top: 0; left: 0; margin: 0 auto; margin-bottom: 30px; border-radius: 20px; } .startxInvestorWrap .inveatorContentH { width: 100%; margin-left: 0; } .startxInvestorWrap .inveatorContentH p { font-size: 14px; line-height: 19px; } .investor-flex-row figure { width: 112px; } .investor-flex-row span { font-size: 12px; } .startxSpeakersWrap .sectionheading h2{ font-size: 24px; line-height: 30px; } .startxSpeakersWrap { padding: 30px 0px; } .speaker-startx { width: 100%; position: relative; margin-bottom: 30px; } .speaker-startx .speaker-info h4{ font-size: 16px; line-height: 20px; padding-bottom: 10px; } .speaker-startx .speaker-info span { font-size: 12px; line-height: 16px; padding-top: 5px; } .speaker-startx .speaker-info p { font-size: 16px; line-height: 20px; } .strxicon-wrap i, .strxicon-wrap em { font-size: 16px; } .strxattend-card h4 { font-size: 13px; line-height: 18px; } .strxattend-card { padding: 10px 10px; } .startx-split { padding: 30px 0px; } .strxattends-grid { grid-template-columns: repeat(3, 1fr); gap: 10px; } .startxAttendWrap{ padding: 30px 0px; } .split-cards { grid-template-columns: 1fr; grid-template-columns: repeat(2, 1fr); } .mini-card h3 { font-size: 16px; line-height: 20px; } .mini-card p { font-size: 14px; line-height: 16px; } .startuplaunlogo { padding: 30px 0px; } .startuplaunlogo .sectionheading h2 { font-size: 27px; line-height: 31px; } .startuplaunlogo .row .col-sm-3 { flex: 0 0 auto; width: 24.6666%; } .startuplaunlogo figure{ height: 80px; } .startxSpeakersWrap .text-center.pt-5{ padding-top: 10px !important; } .speaker-startx .hover-info p { font-size: 10px; line-height: 12px; } } /********* Ai Government ******************/ .heroAiGovtWrap { position: relative; padding: 11vw 0px 2vw 0; background-color: #fefefe; width: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; z-index: 99; overflow: hidden; } .heroAiGovtWrap:before { content: ""; position: absolute; width: 100%; height: 100%; background-image: linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px), linear-gradient(90deg, rgb(255 255 255 / 16%) 1px, #0000001c 1px); background-size: 60px 60px; opacity: 0.3; z-index: -1; top: 0; left: 0; } .heroAiGovtWrap:after { content: ""; position: absolute; width: 100%; height: 100%; background-image: linear-gradient(to bottom, #060606cf, #11111247); z-index: -1; top: 0; left: 0; } .bannercontentsaigovt { position: relative; padding: 40px 0px; height: 100%; display: flex; align-items: center; justify-content: center; } .bannercontentsaigovt h2 { color: #fff; font-size: 3.3vw; line-height: 4vw; font-weight: 900; margin-bottom: 1.5vw; text-transform: uppercase; } .bannercontentsaigovt h2 span { background: linear-gradient(89deg, #0053ff, #7cfbff); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .bannercontentsaigovt p { color: #fff; font-size: 1.3vw; line-height: 2vw; } .aigovlogomain { width: 18vw; margin-bottom: 1.5vw; } .bannercontentsaigovt .rightimgaigovt02 { /* transform: scale(1.2); */ position: absolute; top: 0; right: 5%; width: 40vw; } .aigovtstats-two { padding: 3vw 0; background: #f8fafc; text-align: center; } .govvtstats-wrap { display: flex; align-items: center; justify-content: center; gap: 80px; } /* STAT BLOCK */ .aigovtstats-two .aigovtstatsItem { max-width: 340px; padding: 10px; transition: all 0.3s ease; } .aigovtstats-two .aigovtstatsItem:hover { transform: translateY(-6px); } /* NUMBER */ .aigovtstats-two .aigovtstatsItem h2 { font-size: 3.8vw; line-height: 4vw; font-weight: 800; letter-spacing: -1px; margin-bottom: 12px; background: linear-gradient(90deg, #2563eb, #06b6d4, #2563eb); background-size: 200% auto; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: shimmer 4s linear infinite; } @keyframes shimmer { 0% { background-position: 200% center; } 100% { background-position: 0% center; } } .aigovtstats-two .aigovtstatsItem p { color: #000; line-height: 1.6vw; font-size: 1.3vw; } .aigtdivider { width: 2px; height: 110px; border-radius: 2px; background: linear-gradient(to bottom, transparent, #2563eb, transparent); box-shadow: 0 0 12px rgba(37, 99, 235, 0.4); } .aigovtstatsItem:hover h2 { filter: drop-shadow(0 5px 15px rgba(37, 99, 235, 0.25)); } .aigovtnationwrap { position: relative; } .aigovtnationInner { position: relative; overflow: hidden; border-radius: 20px; background: linear-gradient(135deg, #021b7c 0%, #00208f 40%, #001866 100%); box-shadow: 0 .4vw 1vw rgba(0, 0, 0, .05), 0 2vw 4vw rgba(0, 32, 143, .18); padding-right: 2vw; } .aigovtnationInner figure { height: 100%; width: 100%; position: relative; border-radius: 20px 0px 0px 20px; background-size: cover; background-position: 90% 6%; background-repeat: no-repeat; } .aigovtnationInner h4 { font-size: 1.8vw; line-height: 2vw; font-weight: 600; color: #0fa6d8; margin-bottom: 1.2vw; text-transform: uppercase; padding-top: 6vw; } .aigovtnationInner h2 { font-size: 2.4vw; line-height: 2.8vw; font-weight: 900; margin-bottom: 2vw; color: #fff; } .aigovtnationInner p { font-size: 1.3vw; line-height: 2vw; margin-bottom: 6vw; color: #fff; } .aigovtspeaker { position: relative; padding: 4vw 0; } .speakergrid { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; } .speakergrid .speakers26Item { width: calc(20% - 16px); } @media (max-width: 1200px) { .speakergrid .speakers26Item { width: calc(25% - 16px); } } @media (max-width: 992px) { .speakergrid .speakers26Item { width: calc(33.33% - 16px); } } @media (max-width: 600px) { .speakergrid .speakers26Item { width: calc(50% - 16px); } } .techfocusWrap { position: relative; padding: 4vw 0; } .aigovtlogo { padding: 4vw 0; padding-top: 0; position: relative; } .aigovtlogo figure { border: #000 solid 1px; border: #0035e580 solid 1px; background: #fff; padding: 20px 10px; display: flex; align-items: center; justify-content: center; height: 100%; border-radius: 20px; box-shadow: 0 11.21px 33.64px rgb(195 209 200 / 23%); } .aigovtlogo figure img { width: 80%; } /*** Responsive ****/ @media only screen and (min-width: 320px) and (max-width: 768px) { .bannercontentsaigovt .rightimgaigovt02 { position: relative; top: 0; right: 0; width: 100%; } .heroAiGovtWrap{ padding: 20px 0px 0px 0px; } .bannercontentsaigovt { padding: 0px 0px; text-align: center; } .aigovlogomain { width: 200px; margin-bottom: 20px; } .bannercontentsaigovt h2 { font-size: 20px; line-height: 25px; margin-bottom: 20px; text-align: center; } .bannercontentsaigovt p { font-size: 14px; line-height: 19px; } .govvtstats-wrap{ gap: 10px; } .aigovtstats-two { padding: 30px 0px; } .aigovtstats-two .aigovtstatsItem h2 { font-size: 30px; line-height: 40px; margin-bottom: 8px; } .aigovtstats-two .aigovtstatsItem p { line-height: 13px; font-size: 12px; } .aigovtnationInner{ padding-right: 0; padding: 20px; } .aigovtnationInner figure { height: 250px; border-radius: 20px; } .aigovtnationInner h4 { font-size: 16px; line-height: 20px; margin-bottom: 10px; padding-top: 10px; } .aigovtnationInner h2 { font-size: 16px; line-height: 20px; margin-bottom: 10px; } .aigovtnationInner p { font-size: 12px; line-height: 18px; margin-bottom: 0; } .techfocusWrap { padding: 30px 0px; } } /*********** Ai Semicon ****************/ .semiconbannerWrap { position: relative; padding: 11vw 0px 7vw 0; background-color: #fefefe; width: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; z-index: 99; overflow: hidden; } .semiconbannerWrap:after { content: ""; position: absolute; width: 100%; height: 100%; background-image: linear-gradient(to bottom, #0606065e, #11111205); z-index: -1; top: 0; left: 0; } .bannercontentsemicon { position: relative; padding: 40px 0px; height: 100%; display: flex; align-items: center; justify-content: center; } .bannercontentsemicon h2 { color: #fff; font-size: 3.1vw; line-height: 3.6vw; font-weight: 900; margin-bottom: 1.5vw; text-transform: uppercase; } .bannercontentsemicon h2 span { background: linear-gradient(89deg, #ffa901, #ff00be); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .bannercontentsemicon p { color: #fff; font-size: 1.3vw; line-height: 2vw; } .semiconlogomain { width: 18vw; margin-bottom: 1.5vw; } .semiCostats-wrapper { position: relative; margin-top: -8%; display: flex; justify-content: center; padding: 0 16px; z-index: 99; margin-bottom: 30px; } .semiconStats { display: flex; align-items: center; gap: 30px; padding: 3vw 3vw; border-radius: 999px; background: linear-gradient(135deg, rgb(1 88 175), rgb(0 36 168)); backdrop-filter: blur(12px); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15), inset 0 0 10px rgba(255, 255, 255, 0.4); border: 1px solid rgba(255, 255, 255, 0.6); max-width: 73vw; width: 100%; display: flex; align-items: flex-start; } .semiconStatItem { flex: 1; } .semiconStatItem h2 { font-size: 2.6vw; font-weight: 700; margin-bottom: 1vw; color: #81deea; line-height: 3.2vw; } .semiconStatItem p { font-size: 1.2vw; line-height: 1.6vw; color: #fff; } .semicdivider { width: 2px; height: 100%; background: rgba(0, 0, 0, 0.08); background: linear-gradient(to bottom, transparent, #dedcde, transparent); box-shadow: 0 0 12px rgba(37, 99, 235, 0.4); } .semiconFeatWrap { padding: 4vw 0; position: relative; } .semicofeatCard { display: flex; gap: 25px; max-width: 1100px; margin: auto; } .semiconFeatItem { flex: 1; border-radius: 20px; overflow: hidden; background: #111; transition: 0.3s; } .semiconFeatItem:hover { transform: translateY(-6px); } .semicoimg-wrap { position: relative; height: 220px; overflow: hidden; } .semicoimg-wrap img { width: 100%; height: 100%; object-fit: cover; } .semicoimg-wrap::after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 120px; background: linear-gradient(to bottom, rgba(10, 10, 26, 0) 0%, rgba(10, 10, 26, 0.7) 50%, #0a0a1a 100%); } .semicontentItem { padding: 20px; margin-top: -40px; position: relative; z-index: 2; } .semicontentItem h3 { font-size: 2.1vw; line-height: 2.7vw; margin-bottom: 8px; text-transform: uppercase; color: #fff; } .semicontentItem p { font-size: 1.0vw; color: #fff; line-height: 1.3vw; } .semiconFeatItem::before { content: ""; position: absolute; inset: 0; border-radius: 20px; padding: 1px; background: linear-gradient(120deg, #00f0ff, #7c3aed, #00f0ff); opacity: 0; transition: 0.4s; -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; } .semiconFeatItem { flex: 1; border-radius: 20px; overflow: hidden; background: #111; transition: all 0.35s ease; position: relative; } .semiconFeatItem:hover::before { opacity: 1; } @media (max-width: 768px) { .semicofeatCard { flex-direction: column; } } .keytopicSemfocus-icons { position: relative; padding: 6vw 0 3vw 0; background-position: top; background-size: cover; background-repeat: no-repeat; } .keytopicSemfocus-icons figure { background-position: center; background-size: cover; background-repeat: no-repeat; width: 100%; height: 100%; border-radius: 20px; } .keytopicSemfocus-icons h4 { text-align: center; font-size: 2.3vw; line-height: 3vw; padding-top: 2vw; padding-bottom: 3vw; color: #fff; text-transform: uppercase; } .keytopicsList { display: flex; flex-direction: column; gap: 16px; padding-bottom: 1vw; } .focus-card, .topic-card { display: flex; align-items: center; gap: 14px; background: #ffffff; padding: 16px 18px; border-radius: 14px; border: 1px solid #e2e8f0; transition: all 0.3s ease; } .focus-card:hover, .topic-card:hover { transform: translateY(-5px); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08); border-color: #6366f1; } .focus-icon { min-width: 42px; height: 42px; border-radius: 10px; background: linear-gradient(135deg, #6366f1, #8b5cf6); display: flex; align-items: center; justify-content: center; color: #fff; font-size: 16px; flex-shrink: 0; box-shadow: 0 4px 12px rgba(99, 102, 241, 0.25); } .focus-icon i, .focus-icon em { color: #fff; } .focus-card h3, .topic-card h3 { font-size: 1.2vw; line-height: 1.4vw; font-weight: 500; color: #000; margin: 0; } .semiconmobileimg{ display: none; } /*** Responsive ****/ @media only screen and (min-width: 320px) and (max-width: 768px) { .semiconbannerWrap{ padding: 0px 0px; background-image: linear-gradient(to right, #390357, #01195c); background-image: none !important; } .semiconbannerWrap:after{ /* background-image: linear-gradient(to bottom, #0606064f, #111112b3); */ } .semiconlogomain { width: 300px; margin-bottom: 20px; margin-top: 30px; } .bannercontentsemicon{ flex-direction: column; padding: 0; text-align: center; background: linear-gradient(to right, #390357, #01195c) !important; } .bannercontentsemicon h2 { font-size: 34px; line-height: 40px; padding-bottom: 30px; width: 94%; margin: 0 auto; } .bannercontentsemicon p { font-size: 14px; line-height: 20px; } .semiconmobileimg{ display: block; width: 100%; background-size: cover; background-repeat: no-repeat; background-position: center right; height: 350px; margin-top: 20px; } .semiconStats{ gap: 10px; padding: 30px 20px; max-width: 100%; width: 100%; display: block; border-radius: 20px; } .semiconStatItem h2 { font-size: 30px; margin-bottom: 10px; line-height: 27px; padding: 10px 0px 0px 0px; } .semiconStatItem p { font-size: 14px; line-height: 18px; color: #fff; } .semicdivider{ width: 100%; height: 2px; margin: 20px 0px; } .semiCostats-wrapper { position: relative; margin-top: 0; display: flex; justify-content: center; padding: 30px 20px; z-index: 99; margin-bottom: 0; } .semicontentItem h3 { font-size: 20px; line-height: 25px; margin-bottom: 8px; } .semicontentItem p { font-size: 16px;; line-height: 20px; } .semicofeatCard { padding: 20px; } .focus-card h3, .topic-card h3 { font-size: 17px; line-height: 20px; } .keytopicSemfocus-icons h4 { font-size: 20px; line-height: 25px; padding-top: 20px; } .keytopicSemfocus-icons{ padding: 20px 10px 40px 10px; } .aigovtlogo .sectionheading h2{ font-size: 23px; line-height: 27px; } .speakersWraper .sectionheading h2 { font-size: 23px; line-height: 27px; } } /******** Ai cyber ****************/ .cyberbannernew26{ position: relative; padding: 12vw 0px 2vw 0; background-size: cover; background-position: center; background-repeat: no-repeat; } .bannercontentscyber{ position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column; } .cybberlogobanner{ width:25vw; padding-bottom: 1.2vw; } .bannercontentscyber h2{ font-size: 3vw; line-height: 3.4vw; color: #fff; padding-bottom: 0.2vw; } .bannercontentscyber h4{ font-size: 2.3vw; line-height: 3vw; color: #ffe819; text-transform: uppercase; } .bannercontentscyber p{ font-size: 1.4vw; line-height: 2vw; color: #fff; } .cyberstatstop{ margin-top: 2vw; width: 100%; display: flex; justify-content: center; } .cyberstatswrap{ display: flex; gap: 3vw; background: rgba(0,0,0,0.6); border: 1px solid rgba(255,0,0,0.3); padding: 2vw 3vw; border-radius: 12px; backdrop-filter: blur(10px); } .cyberstatitem{ max-width: 30vw; text-align: center; color: #fff; } .cyberstatitem h3{ font-size: 2.5vw; color: #ff2a2a; margin-bottom: 0.5vw; font-weight: 700; } .cyberstatitem p{ font-size: 1vw; line-height: 1.5vw; color: #fff; } .cyberstatitem:not(:last-child){ border-right: 1px solid rgba(255,255,255,0.2); padding-right: 2vw; } @media (max-width: 768px){ .cyberstatswrap{ flex-direction: column; gap: 20px; text-align: center; } .cyberstatitem{ max-width: 100%; border-right: none !important; padding-right: 0; } .cyberstatitem h3{ font-size: 24px; } .cyberstatitem p{ font-size: 14px; line-height: 20px; } } .cybercoresector12{ padding: 3vw 0; background: linear-gradient(180deg, #fafafa, #ffffff); } .cybercoresector12 p{ text-align: center; font-size: 1.2vw; line-height: 1.8vw; color: #000; width: 75%; margin: 0 auto; } .cybercoresector12 h2{ text-align: center; padding: 2.5vw 0; font-size: 2.4vw; color: #000; text-transform: uppercase; } /* ROW */ .cybersectors-row{ display: flex; gap: 1.5vw; justify-content: center; flex-wrap: wrap; } .cybersector-box{ width: 15vw; height: 15vw; background: #fff; border-radius: 16px; padding: 20px 12px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; position: relative; overflow: hidden; border:1px solid rgb(138 1 0 / 25%); transition: all 0.4s ease; } .cybersector-box::before{ content: ""; position: absolute; inset: -1px; border-radius: 16px; padding: 1px; background: linear-gradient(120deg, #000000, #ff0000, #000000); background-size: 200% 200%; -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; animation: borderMove 5s linear infinite; opacity: 0; transition: 0.4s; } .cybersector-box::after{ content: ""; position: absolute; width: 200%; height: 200%; background: radial-gradient(circle, rgba(255,0,0,0.12), transparent 60%); top: -50%; left: -50%; opacity: 0; transition: 0.4s; } .cybersector-box:hover{ transform: translateY(-10px); box-shadow: 0 20px 50px rgba(0,0,0,0.08); } .cybersector-box:hover::before, .cybersector-box:hover::after{ opacity: 1; } .cyber-icon{ width: 65px; height: 65px; border-radius: 14px; display: flex; align-items: center; justify-content: center; margin: 0 auto 1vw auto; background: rgba(255,255,255,0.7); backdrop-filter: blur(8px); border: 1px solid rgba(0,0,0,0.08); box-shadow: 0 6px 20px rgba(0,0,0,0.06); transition: all 0.35s ease; } .cyber-icon i, .cyber-icon em{ font-size: 2.2vw; line-height: 3vw; background: linear-gradient(135deg, #000000, #ff0000); -webkit-background-clip: text; -webkit-text-fill-color: transparent; transition: 0.35s; } .cybersector-box:hover .cyber-icon{ transform: scale(1.08); box-shadow: 0 0 0 3px rgba(255,0,0,0.08), 0 12px 35px rgba(255,0,0,0.2); } .cybersector-box:hover .cyber-icon i, .cybersector-box:hover .cyber-icon em{ transform: scale(1.15); } .cybersector-box p{ color: #000; font-size: 1.2vw; line-height: 1.8vw; margin: 0; width: 100%; } @keyframes borderMove{ 0% {background-position: 0% 50%;} 100% {background-position: 100% 50%;} } @media(max-width: 992px){ .cybersector-box{ width: 45%; height: auto; padding: 30px 15px; } .cyber-icon i, .cyber-icon em{ font-size: 24px; } .cybersector-box p{ font-size: 14px; line-height: 20px; } .cybercoresector12 p{ font-size: 14px; line-height: 22px; width: 90%; } .cybercoresector12 h2{ font-size: 26px; } } .cyberhottopics{ position: relative; padding: 4vw 0; background: linear-gradient(135deg, #490303, #c70000); } .cyberhottopics h4{ color: #fff; font-size: 2.3vw; line-height: 2.6vw; text-align: center; padding-bottom: 2vw; } .cyberhottopics figure{ background-repeat: no-repeat; background-position: center; background-size: cover; width: 100%; height: 100%; border-radius: 20px; } .cyberkeytopicsList { display: flex; flex-direction: column; gap: 16px; padding-bottom: 1vw; } .cybertopic-card{ display: flex; align-items: center; gap: 14px; background: #000; padding: 16px 18px; border-radius: 14px; border: 1px solid #000; transition: all 0.3s ease; } .cybertopic-card:hover { transform: translateY(-5px); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08); border-color: #6366f1; } .cbfocus-icon { min-width: 42px; height: 42px; border-radius: 10px; background: linear-gradient(135deg, #ce0202, #801a07); display: flex; align-items: center; justify-content: center; color: #fff; font-size: 16px; flex-shrink: 0; box-shadow: 0 4px 12px rgba(99, 102, 241, 0.25); } .cbfocus-icon i, .cbfocus-icon em{ color: #fff; } .cybertopic-card h3 { font-size: 1.2vw; line-height: 1.4vw; font-weight: 500; color: #fff; margin: 0; } .cyberfeatureWrap { padding:3vw 0; position: relative; } .cyberfeature-card { display: flex; gap: 25px; max-width: 1100px; margin: auto; } .cyberfeatureItem { flex: 1; border-radius: 20px; overflow: hidden; background: #111; transition: 0.3s; } .cyberfeatureItem:hover { transform: translateY(-6px); } .cyberfeatImg { position: relative; height: 220px; overflow: hidden; } .cyberfeatImg img { width: 100%; height: 100%; object-fit: cover; } .cyberfeatImg::after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 120px; background: linear-gradient(to bottom, rgba(10, 10, 26, 0) 0%, rgba(10, 10, 26, 0.7) 50%, #0a0a1a 100%); } .cyberfeatContent { padding: 20px; margin-top: -40px; position: relative; z-index: 2; } .cyberfeatContent h3 { font-size: 2.1vw; line-height: 2.7vw; margin-bottom: 8px; text-transform: uppercase; color: #fff; } .cyberfeatContent p { font-size: 1.0vw; color: #fff; line-height: 1.3vw; } .cyberfeatureItem::before { content: ""; position: absolute; inset: 0; border-radius: 20px; padding: 1px; background: linear-gradient(120deg, #00f0ff, #7c3aed, #00f0ff); opacity: 0; transition: 0.4s; -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; } .cyberfeatureItem { flex: 1; border-radius: 20px; overflow: hidden; background: #111; transition: all 0.35s ease; position: relative; } .cyberfeatureItem:hover::before { opacity: 1; } @media (max-width: 768px) { .cyberfeature-card { flex-direction: column; } } .cyberquote-authorsection { padding: 3vw 0; } .cyberquote-card { display: flex; align-items: center; gap: 3vw; width: 85%; margin: 0 auto; padding: 1vw 3vw 2vw 3vw; border-radius: 20px; background: linear-gradient(135deg, #8d0303, #1a0000 40%, #000); color: #fff; box-shadow: 0 20px 60px rgba(0,0,0,0.6); position: relative; overflow: hidden; transition: 0.4s ease; border: 1px solid rgba(255, 0, 0, 0.2); } .cyberquote-card::before { content: ""; position: absolute; width: 400px; height: 400px; background: radial-gradient(circle, rgba(255,0,0,0.3), transparent 70%); top: -120px; left: -120px; filter: blur(70px); } .cyberquote-card:hover { transform: translateY(-12px) scale(1.01); box-shadow: 0 40px 100px rgba(0,0,0,0.9); } .cyberquote-image { width: 30vw; z-index: 2; } .cyberquote-image img { width: 100%; border-radius: 16px; box-shadow: 0 20px 40px rgba(0,0,0,0.6); transition: 0.4s; border: #da2121 solid 2px; } .cyberquote-card:hover img { transform: scale(1.05); } .cyberquote-content { z-index: 2; position: relative; } .cyberquote-icon { position: relative; top: 0; left: 0; width: 4vw; height: 4vw; z-index: 3; } .cyberquote-icon svg { width: 100%; height: 100%; color: #ff2a2a; opacity: 0.8; filter: drop-shadow(0 0 10px rgba(255, 0, 0, 0.6)); } .cyberquote-text { font-size: 1.3vw; color: #fff; line-height: 1.7vw; color: #fff; margin-bottom: 1vw; } .cyberquote-author h3 { font-size: clamp(16px, 1.3vw, 20px); margin: 0; text-transform: uppercase; letter-spacing: 1px; } .cyberquote-author span { display: block; font-size: clamp(14px, 1.1vw, 18px); margin-top: 4px; color: #fff; } .cyberquote-author strong { display: block; margin-top: 6px; font-size: clamp(16px, 1.3vw, 20px); color: #ff2a2a; text-transform: uppercase; } @media (max-width: 991px) { .cyberquote-card { flex-direction: column; text-align: center; padding: 30px; } .cyberquote-content, .cyberquote-image { width: 100%; } .cyberquote-image img { max-width: 200px; margin: 0 auto; } .cyberquote-icon { font-size: 60px; right: 15px; } } /** Responsive **/ @media only screen and (min-width: 320px) and (max-width: 768px) { .cyberbannernew26{ padding: 50px 10px; } .cybberlogobanner { width: 50%; padding-bottom: 20px; } .bannercontentscyber h2 { font-size: 18px; line-height: 20px; padding-bottom: 10px; } .bannercontentscyber h4 { font-size: 17px; line-height: 19px; } .cyberstatstop { margin-top: 40px; } .cybercoresector12 { padding: 40px 0px; } .cybercoresector12 p { font-size: 14px; line-height: 22px; width: 100%; } .cybersector-box { width: 45%; height: auto; padding: 30px 10px; margin: 10px 5px; } .cyber-icon{ margin: 0 auto 20px auto; } .cyber-icon i, .cyber-icon em { font-size: 24px; line-height: 30px; } .cyberhottopics { padding: 30px 30px; } .cybertopic-card h3 { font-size: 15px; line-height: 19px; } .cyberhottopics h4 { font-size: 20px; line-height: 25px; padding-bottom: 20px; } .cyberfeatureWrap { padding: 30px; } .cyberfeatContent h3 { font-size: 16px; line-height: 19px; } .cyberfeatContent p { font-size: 14px; line-height: 18px; } .cyberquote-authorsection { padding: 20px 0px; } .cyberquote-text { font-size: 14px; line-height: 18px; margin-bottom: 10px; } .cyberquote-author span{ line-height: 18px; } .cyberquote-author strong{ line-height: 20px; } .cyberquote-author h3{ line-height: 20px; } } /***** CAIO PROGRAMME **********/ .caioherobanner { position: relative; padding: 9vw 0px 4vw 0; background-color: #fefefe; width: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; z-index: 99; background: linear-gradient(135deg, #020b1c, #031d3a); } .caioherobanner:after { content: ""; position: absolute; inset: 0; background: url("https://aieverythingabudhabi.com/contents/theme-26/images/caiobgbanner.jpeg") center/cover no-repeat; opacity: 0.12; mix-blend-mode: screen; top: 0; left: 0; width: 100%; height: 100%; z-index: -2; } /* GLOW EFFECT */ .caioherobanner:before { content: ""; position: absolute; width: 900px; height: 900px; top: -250px; right: -150px; background: radial-gradient(circle, rgba(0, 255, 255, 0.25), transparent 60%); filter: blur(120px); animation: floatGlow 10s ease-in-out infinite alternate; z-index: -1; } @keyframes floatGlow { from { transform: translateY(0); } to { transform: translateY(50px); } } .bannercontentCAIO { position: relative; padding: 40px 0px; height: 100%; display: flex; align-items: center; justify-content: center; } /* TAG */ .bannercontentCAIO h1 { display: inline-block; /* border: 1px solid rgba(0, 255, 200, 0.4); */ border-radius: 30px; font-size: 3.5vw; line-height: ; letter-spacing: 1.9px; color: #00e0c6; margin-bottom: 1.5vw; backdrop-filter: blur(8px); text-transform: uppercase; } /* HEADING */ .bannercontentCAIO h2 { font-size: 1.8vw; line-height: 2.4vw; font-weight: 500; margin-bottom: 30px; color: #fff; width: 80%; text-align: center; margin: 0 auto; padding-bottom: 20px; } /* FEATURE LIST */ .bannercontentCAIO .caiofeatList { list-style: none; margin-top: 20px; } .bannercontentCAIO .caiofeatList li { display: flex; align-items: center; gap: 14px; padding: 5px 16px; margin-bottom: 14px; /* background: rgba(255,255,255,0.04); border: 1px solid rgba(0,255,255,0.12); */ border-radius: 12px; backdrop-filter: blur(10px); font-size: 1.3vw; line-height: 1.5vw; color: #fff; margin: 10px 0px; transition: 0.3s ease; } /* HOVER */ .caiofeatList li:hover { transform: translateX(6px); background: rgba(0, 255, 200, 0.08); border-color: rgba(0, 255, 200, 0.4); } /* ICON */ .bannercontentCAIO .icon { width: 44px; height: 44px; min-width: 44px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: rgba(0, 255, 200, 0.06); border: 1px solid rgba(0, 255, 200, 0.4); color: #00e0c6; font-size: 16px; position: relative; transition: 0.3s; } .bannercontentCAIO .icon em { color: #00e0c6; } /* ICON GLOW */ .bannercontentCAIO .icon::before { content: ""; position: absolute; inset: 0; border-radius: 50%; background: rgba(0, 255, 200, 0.4); filter: blur(12px); opacity: 0; transition: 0.3s; } /* ICON HOVER */ .bannercontentCAIO .caiofeatList li:hover .icon { background: linear-gradient(135deg, #00e0c6, #00bfff); color: #001; transform: scale(1.1); } .bannercontentCAIO .caiofeatList li:hover .icon em{ color: #fff; } .bannercontentCAIO .caiofeatList li:hover .icon::before { opacity: 1; } .bannercontentCAIO figure { width: 100%; height: 100%; border-radius: 20px; border: 1px solid rgba(0, 255, 255, 0.2); box-shadow: 0 40px 100px rgba(0, 0, 0, 0.8); transition: 0.5s; background-size: cover; background-position: center; background-repeat: no-repeat; } .bannercontentCAIO figure:hover { transform: scale(1.04) rotate(-1deg); } .caioProIntro { padding: 3vw 0; position: relative; /* background: linear-gradient(180deg, #ffffff, #eef1ff); */ } .caioProIntro figure { width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; border-radius: 20px; position: relative; box-shadow: 0 25px 60px rgba(0, 0, 0, 0.18); } .caioProIntro p { font-size: 1.0vw; line-height: 1.4vw; padding-bottom: 1.4vw; color: #000; padding-left: 2vw; } .caioProIntro p:last-child { padding-bottom: 0vw; } .caioProIntro figure:before { content: ''; position: absolute; left: -10px; top: -10px; width: 8vw; height: 8vw; border-top: .9vw solid #0130ba; border-left: .9vw solid #0130ba; border-radius: 2.3vw 0 0 0; z-index: 20; pointer-events: none; } .caioProIntro figure:after { content: ''; position: absolute; right: -10px; bottom: -10px; width: 8vw; height: 8vw; border-bottom: .9vw solid #0130ba; border-right: .9vw solid #0130ba; border-radius: 0 0 2.3vw 0; z-index: 20; pointer-events: none; } /* SECTION */ .whoappltcaio { padding: 3vw 0; background: linear-gradient(to bottom, #f8fafc, #eef2ff); } /* WRAPPER */ .applycaio-card { border-radius: 24px; } /* GRID */ .caiowhoapply-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; } /* CARDS */ .whoapplycaioItem { position: relative; padding: 2.5vw 1vw; border-radius: 18px; background: rgba(255, 255, 255, 0.75); backdrop-filter: blur(14px); border: 1px solid rgba(15, 23, 42, 0.05); box-shadow: 0 10px 30px rgba(2, 6, 23, 0.06); transition: all 0.35s ease; } /* PREMIUM ACCENT LINE */ .whoapplycaioItem::before { content: ""; position: absolute; left: 0; top: 22%; height: 56%; width: 3px; border-radius: 3px; background: linear-gradient(180deg, #6366f1, #06b6d4); opacity: 0.8; transition: all 0.3s ease; } /* HOVER */ .whoapplycaioItem:hover { transform: translateY(-6px); box-shadow: 0 20px 50px rgba(2, 6, 23, 0.12); } .whoapplycaioItem:hover::before { height: 72%; top: 14%; opacity: 1; } /* TEXT */ .whoapplycaioItem p { margin: 0; color: #000; font-size: 1.0vw; line-height: 1.4vw; } .whoapplycaioItem strong { display: block; font-size: 1.2vw; line-height: 1.6vw; font-weight: 600; color: #000; margin-bottom: 20px; } /* NUMBER STYLE (BACKGROUND) */ .whoapplycaioItem::after { content: attr(data-num); position: absolute; top: 12px; right: 18px; font-size: 48px; font-weight: 700; color: rgba(15, 23, 42, 0.05); letter-spacing: 1px; transition: all 0.3s ease; } /* HOVER EFFECT */ .whoapplycaioItem:hover::after { color: rgba(99, 102, 241, 0.12); transform: scale(1.05); } /* REMOVE NUMBER FROM CENTER */ .whoapplycaioItem.highlight::after { display: none; } /* ===== CENTER CARD ===== */ .whoapplycaioItem.highlight { display: flex; align-items: center; justify-content: center; padding: 0; background: transparent; border: none; box-shadow: none; } /* CENTER BOX */ .whoapplycenter { width: 100%; padding: 50px 30px; border-radius: 20px; background: linear-gradient(135deg, #0033b9, #057482); color: #fff; text-align: center; position: relative; overflow: hidden; box-shadow: 0 30px 70px rgba(15, 23, 42, 0.18); } /* SOFT GLOW */ .whoapplycenter::before { content: ""; position: absolute; inset: -2px; border-radius: 20px; background: linear-gradient(120deg, #6366f1, #06b6d4, #9333ea); z-index: -1; filter: blur(14px); opacity: 0.6; } /* CENTER TEXT */ .whoapplycenter h2 { font-size: clamp(20px, 2vw, 30px); margin-bottom: 12px; text-transform: uppercase; letter-spacing: 1px; } .whoapplycenter p { font-size: 1.0vw; line-height: 1.4vw; color: #e2e8f0; } /* RESPONSIVE */ @media (max-width: 1024px) { .caiowhoapply-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 768px) { .caiowhoapply-grid { grid-template-columns: 1fr; } .applycaio-card { padding: 20px; } } .whyattendcaio { padding: 3vw 0; } /* GRID */ .whyattedcaio-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; background: #002fb9; border-radius: 20px; } /* IMAGE */ .whyattendcaio figure { width: 100%; height: 100%; background-size: cover; background-position: center; background-repeat: no-repeat; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08); border-radius: 20px 0px 0px 20px; } .whyattendcaio { padding: 40px; border-radius: 20px; } .whyattendcaio h2 { font-size: 2.4vw; line-height: 2.8vw; margin-bottom: 20px; color: #fff; text-transform: uppercase; } .whyattendcaio p { font-size: 1.2vw; line-height: 1.6vw; color: #fff; margin-bottom: 25px; } .whyattendcaio h3 { font-size: 1.2vw; line-height: 1.6vw; margin-bottom: 20px; color: #fff; } /* POINTS */ .whyattendcaio ul { list-style: none; padding: 0; } .whyattendcaio li { position: relative; padding-left: 35px; margin-bottom: 15px !important; font-size: 1.2vw; line-height: 1.6vw; color: #fff; } .whyattendcaio li:before { content: "✓"; position: absolute; left: 0; top: 0; background: #c9ff00; color: #0b0b0b; width: 22px; height: 22px; font-size: 12px; border-radius: 50%; display: flex; align-items: center; justify-content: center; } /* RESPONSIVE */ @media (max-width: 768px) { .why-grid { grid-template-columns: 1fr; } } .benefits-section { padding: 3vw 0; } /* GRID */ .caiobenefits-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; } /* caiobenfitsItem */ .caiobenfitsItem { border-radius: 18px; overflow: hidden; background: #fff; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08); transition: 0.3s; } .caiobenfitsItem:hover { transform: translateY(-6px); } /* TOP TEXT */ .caiobenfitsItem-top { padding: 18px; color: #fff; font-size: 1.3vw; line-height: 1.5vw; font-weight: 500; min-height: 110px; display: flex; align-items: flex-start; text-align: center; } /* IMAGE */ .caiobenfitsItem-img img { width: 100%; height: 170px; object-fit: cover; } /* GRADIENTS */ .gradient-green { background: linear-gradient(135deg, #1e293b, #0ea5a4); } .gradient-purple { background: linear-gradient(135deg, #6d28d9, #c026d3); } .gradient-red { background: linear-gradient(135deg, #7f1d1d, #dc2626); } .gradient-blue { background: linear-gradient(135deg, #1e3a8a, #38bdf8); } .gradient-darkblue { background: linear-gradient(135deg, #1e3a8a, #2563eb); } .gradient-pink { background: linear-gradient(135deg, #be185d, #ec4899); } .gradient-teal { background: linear-gradient(135deg, #0f766e, #14b8a6); } /* RESPONSIVE */ @media (max-width: 1024px) { .benefits-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 600px) { .benefits-grid { grid-template-columns: 1fr; } } .commitmentwrap22 { position: relative; padding: 2.5vw 0; } .commitmentitem { position: relative; padding: 1.25rem; background: #f2f2f2; width: 100%; height: 100%; border-radius: 1.25rem; -webkit-border-radius: 1.25rem; -moz-border-radius: 1.25rem; -ms-border-radius: 1.25rem; -o-border-radius: 1.25rem; background: linear-gradient(135deg, #0033b9, #057482); } .commitmentitem .fa-solid { font-size: 1.625rem; text-align: center; margin: 0 auto 1.25rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background: #c9ff00; padding: 1.625rem; width: 1.625rem; height: 1.625rem; border-radius: 100%; color: #000000; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; } .commitmentitem p { color: #fff !important; text-align: center; font-size: 1.2vw; line-height: 1.8vw; margin-bottom: 0; } .apply-applycaio-timeline { background: #f8fafc; padding: 3vw 0; text-align: center; } /* applycaio-timeline WRAPPER */ .applycaio-timeline { position: relative; display: flex; justify-content: space-between; align-items: flex-start; } /* CENTER LINE */ .applycaio-timeline::before { content: ""; position: absolute; top: 20px; left: 5%; width: 90%; height: 2px; background: #e5e7eb; } /* ITEM */ .caiotimeline-item { width: 30%; text-align: center; position: relative; } /* DOT */ .caiotimeline-dot { width: 40px; height: 40px; background: #0021a7; color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: auto; font-weight: 600; position: relative; z-index: 2; } /* CARD */ .caiotimeline-card { margin-top: 20px; background: #fff; padding: 20px; border-radius: 14px; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05); transition: 0.3s; min-height: 7vw; display: flex; align-items: center; } .caiotimeline-card p { font-size: 1.2vw; line-height: 1.3vw; color: #000; } .caiotimeline-card:hover { transform: translateY(-5px); } /* SUPPORT */ .caioapply-support { text-align: center; background: #c9ff00; padding: 18px; border-radius: 10px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05); display: inline-block; margin: 30px auto; position: relative; } .caioapply-support a { color: #ff3b3b; font-weight: 600; text-decoration: none; } /* MOBILE */ @media (max-width: 768px) { .applycaio-timeline { flex-direction: column; gap: 40px; } .applycaio-timeline::before { display: none; } .caiotimeline-item { width: 100%; } } @media only screen and (min-width: 320px) and (max-width: 768px) { .caioherobanner{ padding: 20px 0px; padding-bottom: 40px; } .bannercontentCAIO{ padding: 0; } .bannercontentCAIO h1{ font-size: 25px; margin-bottom: 10px; line-height: 30px; } .bannercontentCAIO h2 { font-size: 14px; line-height: 21px; padding-bottom: 20px; } .bannercontentCAIO .caiofeatList li{ gap: 14px; padding: 5px 16px; font-size: 14px; line-height: 16px; margin: 5px 0px; } .bannercontentCAIO .icon { width: 35px; height: 35px; min-width: 35px; font-size: 13px; } .bannercontentCAIO .caiofeatList { margin-top: 0px; margin-bottom: 20px !important; } .bannercontentCAIO figure { width: 100%; height: 250px; box-shadow: none; } .caioProIntro { padding: 50px 0px; } .caioProIntro p { font-size: 13px; line-height: 18px; padding-bottom: 20px; padding-left: 0; } .caioProIntro figure { width: 100%; height: 350px; margin-bottom: 40px; } .caiowhoapply-grid { display: flex; flex-direction: column; } .whoapplycaioItem.highlight { order: -1; /* brings 2nd card to top */ } .whoapplycaioItem strong { font-size: 14px; line-height: 16px; } .whoapplycaioItem p { margin: 0; font-size: 14px; line-height: 16px; } .whoapplycaioItem { padding: 20px 20px; } .whoapplycaioItem::after{ top: 25px; right: 18px; font-size: 34px; } .whoapplycenter p { font-size: 14px; line-height: 16px; } .whyattedcaio-grid{ grid-template-columns: 1fr; } .whyattendcaio figure { width: 100%; height: 250px; background-position: bottom; } .whyattendcaio { padding: 20px 10px; } .whyattendcaio h2 { font-size: 18px; line-height: 20px; margin-bottom: 20px; } .whyattendcaio h3 { font-size: 14px; line-height: 16px; margin-bottom: 20px; } .whyattendcaio p { font-size: 14px; line-height: 16px; } .whyattendcaio li { font-size: 14px; line-height: 16px; } .caiobenefits-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; } .caiobenfitsItem-top { padding: 10px 10px; font-size: 14px; line-height: 16px; min-height: 90px; align-items: center; text-align: center; } .commitmentwrap22 .sectionheading p{ font-size: 14px; line-height: 16px; } .commitmentitem p{ font-size: 14px; line-height: 16px; } .commitmentitem .fa-solid{ width: 25px; height: 25px; font-size: 14px; padding: 20px; margin: 10px auto; } .apply-applycaio-timeline{ padding: 40px 0px; } .caiotimeline-dot{ font-size: 16px; width: 40px; height: 40px; } .caiotimeline-card p { font-size: 14px; line-height: 16px; } }