@import url('https://fonts.googleapis.com/css2?family=Cedarville+Cursive&family=Figtree:ital,wght@0,300..900;1,300..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

body{background-color:#FAFBFD;font-family:"Figtree",sans-serif;}
.hero-sec{margin-top:100px;}
@media(max-width:576px){.hero-sec{height:auto;margin-top:100px;}}
.linear-gradient{opacity:0;transition:opacity 0.5s ease-in-out;}
.linear-gradient-top{background-image:url(/images/design/gradient.png);background-size:cover;position:absolute;width:100%;height:100%;background-repeat:no-repeat;right:0;top:-4px;z-index:-1;opacity:1;}
.curve-shape{background-image:url(/images/design/shape-curve.png);background-size:cover;position:absolute;width:100%;height:100%;background-repeat:no-repeat;right:0;top:-4px;z-index:-1;opacity:1;}
.cloud-sm{background-image:url(/images/design/cloud-sm.png);background-size:contain;width:16px;height:13px;background-repeat:no-repeat;top:2px;position:relative;z-index:-1;display:inline-block;margin:0 8px;}
.shape{background-image:url(/images/design/trillo-shape.png);background-size:contain;position:absolute;width:745px;height:780px;background-repeat:no-repeat;right:0;top:-4px;transition:opacity 0.5s ease-in-out;z-index:-1;}
.shape-hover{background-image:url(/images/design/trillo-shape-hover.png);background-size:contain;position:absolute;width:745px;height:780px;background-repeat:no-repeat;right:0;top:-4px;transform:translate(-100%,100%);opacity:0;transition:transform 0.5s ease-in-out,opacity 0.5s ease-in-out;z-index:-1;}
.shape-hover-active{transform:translateY(0);opacity:1;}
.gcp-btn{all:unset;background-color:#61C8D41A;width:262px;height:37px;color:#61C8D4;font-size:14px;font-weight:700;line-height:150%;border:1px solid #61C8D41A;margin-bottom:32px;border-radius:4px;cursor:unset!important;}
.gcp-btn-hover{background-color:#FFFFFF80;color:#353B54;border:1px solid #fff;}
.main-heading-text{font-size:48px;font-weight:700;line-height:120%;margin-bottom:32px;color:#282D41;}
.gradient-text{background:linear-gradient(to right,#5FC7D2,#E63C72);-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-weight:bold;opacity:0;transition:opacity 0.5s ease-in-out;}

#rotating-text-container{width:100%;height:50px;overflow:hidden;position:relative;}
.tagline{font-weight:500;line-height:140%;font-size:20px;color:#282D41;margin-bottom:68px;}
.services{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;}
.services .service-item{background-color:#EAEDF5;color:#282D41;width:292px;transform-origin:right center;border-radius:24px 4px 24px 4px;padding:18px 24px;transition:0.5s ease-in-out;position:relative;}
.arrow-btn{color:#E83D71;border:none;border-radius:50%;width:40px;height:40px;font-size:18px;cursor:pointer;display:none;position:absolute;right:10px;top:50%;transform:translateY(-50%);background-color:#fff;}
.service-item:hover .arrow-btn{display:none;}
.right{background-color:#fff;}
.services .service-item:hover{background-color:#E83D71;color:#fff;cursor:pointer;}
.services .service-item span{font-size:20px;font-weight:500;line-height:150%;display:flex;justify-content:center;align-items:center;gap:10px;white-space:nowrap;}
.services .service-item span .logo-sm{background-image:url(/images/design/logo-sm.png);background-repeat:no-repeat;width:20px;height:20px;display:block;background-size:contain;}
.services .service-item:hover span .logo-sm{background-image:url(/images/design/logo-sm-white.png);}

.hero-img img {transition: opacity 0.5s ease-in-out;opacity: 1;width: 100%;object-fit: contain;max-width: 1200px;position: relative;z-index: 1;top: 10px;}
.hero-img img.fade-out {opacity: 0;}
.partner{text-align: center;position: relative;}
.partner .curve{width: 100%;position: absolute;top: -740px;left: 0;z-index: -1;height: 1760px;}

@media (max-width:475px) {.partner .curve{top: -790px;height: 2200px;}}
.partner .curved-shape {width: 100%;background-color: #282D41;position: relative;border-radius: 0 0 60% 60%;}
.partner .primier-partner{padding: 100px 40px 0;text-align: center;}
.partner .primier-partner h2{font-weight: 700;font-size: 32px;line-height: 130%;color: #FFFFFF;margin-bottom: 24px;}
.partner .primier-partner h2 img{margin: 0 16px 8px 16px;}
.partner .primier-partner p{font-weight: 400;font-size: 18px;line-height: 150%;color: #fff;margin-bottom: 48px;}

.partner .google-build{display:flex;justify-content:center;flex-wrap:wrap;align-items:center;gap:32px;margin-bottom:60px;}
.partner .google-build img{width:133px;height:133px;}
.trillo-offers{text-align:center;padding:0 20px;}
.trillo-offers .text h2{font-weight:700;font-size:48px;line-height:120%;margin-bottom:24px;margin-top:224px;color:#282D41;}
.trillo-offers .text p{color:#282D41;font-weight:400;font-size:18px;line-height:150%;margin-bottom:64px;}
.cards-container{display:flex;justify-content:center;padding:20px;gap:20px;flex-wrap:wrap;margin-bottom:120px;}
.trillo-offers .card{background-color:#fff;border-radius:8px;width:392px;padding:16px;transition:transform 0.3s ease;border:0;position:relative;text-align:center;margin-bottom:10px;}
.trillo-offers .card:first-child{position:relative;z-index:0;}
.trillo-offers .card:hover::before{content:"";position:absolute;inset:0;padding:2px;background:linear-gradient(45deg,#E63C72,#5FC7D2);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:-1;border-radius:16px;}
.trillo-offers .card:hover{transform:translateY(-10px);}
.trillo-offers .card:hover .card-header{color:#fff;background-color:#282D41;border:0;}
.trillo-offers .card-header{text-align:center;font-size:14px;font-weight:600;color:#353B54;line-height:150%;background-color:#EFF9FA;display:inline-block;width:250px;height:34px;position:absolute;top:-18px;left:70px;border:0;border-radius:4px;}
.card-body .cube{margin-bottom:32px;}
.card-body .logo{height:20px;margin-bottom:12px;}
.trillo-offers .card-body h3{font-size:40px;font-weight:700;line-height:120%;margin-bottom:12px;color:#333;}

.trillo-offers .card:hover .card-body .gradient-text-fixed{background:linear-gradient(to right,#5FC7D2,#E63C72);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.trillo-offers .card-body p{font-size:16px;font-weight:400;line-height:150%;margin-bottom:32px;color:#282D41;}
.trillo-offers .card-body ul{list-style-type:none;margin-bottom:50px;padding:0;text-align:start;}
.trillo-offers .card-body ul .list-view{display:flex;align-items:start;gap:16px;}
.trillo-offers .card-body ul li{font-size:16px;margin-bottom:10px;color:#282D41;}
.trillo-offers .card-body a{display:inline-block;font-size:16px;text-decoration:none;color:#007bff;font-weight:600;}
.trillo-offers .card-body a:hover{text-decoration:underline;}
.card-footer{border:0;padding:0;background-color:transparent;margin-bottom:30px;}
.testimonial-section{text-align:center;padding:40px 0;position:relative;overflow:hidden;width:100%;}
.testimonial-section h2{font-size:48px;font-weight:700;line-height:120%;color:#282D41;}
.testimonial{transition:opacity 1s ease;}
.fade-in{opacity:1;}
.fade-out{opacity:0;}
.testimonial-row{display:flex;align-items:center;justify-content:center;gap:100px;flex-wrap:wrap;}
.testimonial blockquote{font-size:16px;font-weight:400;line-height:150%;margin:0;padding:0 20px;color:#282D41;max-width:588px;margin:0 auto;text-align:start;}
.testimonial footer{font-size:16px;font-weight:700;line-height:150%;margin-top:10px;color:#282D41;}
.marquee{margin-bottom:120px;}
.benefits{background-color:#D1416C;padding:112px 40px;position:relative;}
.max-width{max-width:1200px;margin:0 auto;}
.benefits h2{font-weight:700;font-size:48px;line-height:120%;color:#fff;margin-bottom:80px;}
.benefits .counter{display:flex;flex-wrap:wrap;}
.benefits .counter .counter-item{border-left:2px solid #fff;padding-left:32px;margin-bottom:20px;}
.benefits .counter .counter-item .counter-number{font-size:80px;line-height:120%;font-weight:700;color:#fff;}
.benefits .counter .counter-item p{font-size:24px;line-height:140%;font-weight:700;color:#fff;}
.benefits .trillo-shape-2x{background-image:url(/images/design/grey-logo2x.png);background-size:contain;position:absolute;width:330px;height:330px;background-repeat:no-repeat;right:354px;top:-100px;z-index:0;background-size:cover;opacity:1;}
@media (max-width:980px){.benefits .trillo-shape-2x{right:254px;}}
@media (max-width:840px){.benefits .trillo-shape-2x{right:154px;}}
@media (max-width:735px){.benefits .trillo-shape-2x{right:100px;}}
@media (max-width:700px){.benefits .trillo-shape-2x{right:5000px;}}
.use-cases{padding:120px 40px;background-color:#282D41;}
.use-cases .shape-outline{background-image:url(/images/design/shape-outline.png);background-size:contain;position:absolute;width:365px;height:365px;background-repeat:no-repeat;right:20px;top:-50px;z-index:0;background-size:cover;opacity:1;}

.use-cases h2{font-weight:700;font-size:48px;line-height:120%;color:#fff;margin-bottom:80px;}
.use-cases .usecases-header{display:flex;justify-content:space-between;flex-wrap:wrap;align-items:center;position:relative;}
.use-cases .grid-view{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.use-cases .card{background-color:#fff;padding:0;border-radius:14px;box-shadow:0 4px 8px rgba(0,0,0,0.1);text-align:center;height:300px;transition:transform 0.3s ease;border:0;}
.use-cases .card img{width:100%;height:80%;object-fit:cover;border-radius:12px 12px 0 100px;margin-bottom:15px;}
.use-cases .card h3{font-size:24px;font-weight:700;line-height:140%;color:#353B54;text-align:start;padding:0 30px;}
@media (max-width:990px){.use-cases .grid-view{grid-template-columns:repeat(2,1fr);}}
@media (max-width:768px){.use-cases .grid-view{grid-template-columns:1fr;}}
.use-cases .flip-content{background-color:#353B54;color:#fff;padding:30px;border-radius:12px;margin-bottom:40px;transition:all 0.3s ease;opacity:0;transition:opacity 0.3s ease-in-out;position:absolute;width:100%;height:100%;top:0;left:0;text-align:start;}
.flip-content.visible{opacity:1;cursor:pointer;}
.use-cases .flip-content h3{font-size:24px;font-weight:700;line-height:140%;margin-bottom:10px;margin-top:50px;color:#61C8D4;padding:0;}
@media(max-width:450px){.trillo-offers .card-header{left:60px!important;}}

@media(max-width:575px){.use-cases .flip-content h3{margin-top:10px!important;}}
@media(min-width:990px) and (max-width:1130px){.use-cases .flip-content h3{margin-top:10px!important;}}
.use-cases .flip-content p{font-size:16px;font-weight:400;color:#fff;line-height:150%;margin-bottom:20px;}
.use-cases .flip-content a{color:#61C8D4;text-decoration:none;font-weight:700;font-size:16px;line-height:150%;}
.unleash{background:linear-gradient(90deg,#E83D71 0%,#5FC7D2 100%);padding:115px 40px;}
.unleash h2{font-weight:700;font-size:40px;line-height:120%;color:#fff;}
.customer-logos{overflow:hidden;white-space:nowrap;width:100%;padding:20px 0;position:relative;}
.logo-track{display:flex;align-items:center;gap:40px;width:max-content;animation:scrollLeft 25s linear infinite;}
.customer-logos img{height:180px;object-fit:contain;flex:0 0 auto;padding:10px;}
@keyframes scrollLeft{from{transform:translateX(10);}to{transform:translateX(-25%);}}
@media(max-width:475px){.testimonial-section{padding:20px 20px;}.testimonial-row{display:block!important;}.testimonial-row h2{font-size:42px!important;}.cards-container{margin-bottom:0!important;}}
@media(max-width:450px){.trillo-offers .card-header{left: 60px !important;}}