:root{
--primary: #ae7ee8;
--secondary: #161616;
--yellow: #f6fa5e;
--black: #000000;
--white: #ffffff;
--font_dm:'DM Sans 36pt';
--font_amertha:'Amertha PERSONAL USE ONLY';
}

body{ padding:0; margin:0; font-size:16px; color:var(--secondary); font-family: var(--font_dm);}
a, button{outline:none !important; text-decoration:none; box-shadow:none; transition:all .4s ease-in-out;}
a:hover, a:focus, select:focus, button:focus,.btn:focus,btn.focus { outline:none; text-decoration:none; box-shadow:none;}
* { margin:0; padding:0;}
img { border:none; vertical-align:middle; max-width:100%; height:auto;}
li{ list-style:none;}
h1, h2, h3, h4, h5, h6{ outline:none !important;}
input, select, textarea, button{ outline:none !important; box-shadow:none;}
input, textarea, select{ /*-moz-appearance: none; -webkit-appearance: none;*/ box-shadow:none !important;}
::selection { background-color: var(--primary); color: var(--white);}

.container{ width:96%; max-width:1650px; margin:0 auto; padding:0;}
.container.sm{ max-width: 1370px;}

p{ font-size: 22px; line-height: 30px; color: var(--secondary); font-weight: 400;}

.btns{ margin: 0; padding: 11px 21px; font-size: 19px; font-weight: 600; color: var(--white); background: var(--secondary); border-radius: 8px; display: inline-flex; align-items: center; gap: 7px; border: none; box-shadow: none;}
.btns img{ width: 22px; min-width: 22px; transition:all .4s ease-in-out;}
.btns:hover{ background: var(--yellow); color: var(--black); box-shadow: 0 4px 10px rgba(128, 122, 158, 0.27);}
.btns:hover img{ filter: brightness(0) invert(0);}
.btns.yellow{ background: var(--yellow); color: var(--black); border: 3px solid var(--white);}
.btns.yellow img{ filter: brightness(0) invert(0);}
.btns.yellow:hover{ background: var(--primary); color: var(--white); box-shadow: 0 4px 10px rgba(128, 122, 158, 0.27);}
.btns.yellow:hover img{ filter: brightness(0) invert(1);}

.lbl_tag{ padding: 5px 20px 5px 34px; margin: 0 0 26px; font-size: 16px; color: var(--primary); border-radius: 50px; font-weight: 700; background: #efecfe; position: relative; display: inline-flex;}
.lbl_tag::before{ content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--primary); position: absolute; top: 50%; left: 16px; transform: translateY(-50%);}
.lbl_tag.purple{ background: var(--primary); color: var(--white);}
.lbl_tag.purple:before{ background: var(--white);}
.lbl_tag.darkpurple{ background: rgba(38, 34, 44, 0.2); color: var(--white);}
.lbl_tag.darkpurple:before{ background: var(--white);}

.sec-title{ margin: 0 0 45px; padding: 0; font-size: 82px; line-height: 90%; font-weight: 300; color: var(--secondary);}
.sec-sub-info{ margin: 0 0 35px; line-height: 35px; font-weight: 500;}

@font-face {
    font-family: 'DM Sans 36pt';
    src: url('../fonts/DMSans36pt-Light.eot');
    src: url('../fonts/DMSans36pt-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans36pt-Light.woff2') format('woff2'),
        url('../fonts/DMSans36pt-Light.woff') format('woff'),
        url('../fonts/DMSans36pt-Light.ttf') format('truetype'),
        url('../fonts/DMSans36pt-Light.svg#DMSans36pt-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans 36pt';
    src: url('../fonts/DMSans36pt-Regular.eot');
    src: url('../fonts/DMSans36pt-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans36pt-Regular.woff2') format('woff2'),
        url('../fonts/DMSans36pt-Regular.woff') format('woff'),
        url('../fonts/DMSans36pt-Regular.ttf') format('truetype'),
        url('../fonts/DMSans36pt-Regular.svg#DMSans36pt-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans 36pt';
    src: url('../fonts/DMSans36pt-Medium.eot');
    src: url('../fonts/DMSans36pt-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans36pt-Medium.woff2') format('woff2'),
        url('../fonts/DMSans36pt-Medium.woff') format('woff'),
        url('../fonts/DMSans36pt-Medium.ttf') format('truetype'),
        url('../fonts/DMSans36pt-Medium.svg#DMSans36pt-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans 36pt';
    src: url('../fonts/DMSans36pt-SemiBold.eot');
    src: url('../fonts/DMSans36pt-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans36pt-SemiBold.woff2') format('woff2'),
        url('../fonts/DMSans36pt-SemiBold.woff') format('woff'),
        url('../fonts/DMSans36pt-SemiBold.ttf') format('truetype'),
        url('../fonts/DMSans36pt-SemiBold.svg#DMSans36pt-SemiBold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans 36pt';
    src: url('../fonts/DMSans36pt-Bold.eot');
    src: url('../fonts/DMSans36pt-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans36pt-Bold.woff2') format('woff2'),
        url('../fonts/DMSans36pt-Bold.woff') format('woff'),
        url('../fonts/DMSans36pt-Bold.ttf') format('truetype'),
        url('../fonts/DMSans36pt-Bold.svg#DMSans36pt-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans 36pt';
    src: url('../fonts/DMSans36pt-Black.eot');
    src: url('../fonts/DMSans36pt-Black.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans36pt-Black.woff2') format('woff2'),
        url('../fonts/DMSans36pt-Black.woff') format('woff'),
        url('../fonts/DMSans36pt-Black.ttf') format('truetype'),
        url('../fonts/DMSans36pt-Black.svg#DMSans36pt-Black') format('svg');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Amertha PERSONAL USE ONLY';
    src: url('../fonts/AmerthaPERSONALUSEONLY.eot');
    src: url('../fonts/AmerthaPERSONALUSEONLY.eot?#iefix') format('embedded-opentype'),
        url('../fonts/AmerthaPERSONALUSEONLY.woff2') format('woff2'),
        url('../fonts/AmerthaPERSONALUSEONLY.woff') format('woff'),
        url('../fonts/AmerthaPERSONALUSEONLY.ttf') format('truetype'),
        url('../fonts/AmerthaPERSONALUSEONLY.svg#AmerthaPERSONALUSEONLY') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/*===================
 		HEADER 
===================*/
.header_sec{ width:100%; padding:20px 0; margin:0; position:fixed; left: 0; top:0; z-index:1024; transition:all .4s ease-in-out;}
.header_sec .container{ transition:all 0.4s ease-in-out;}
.header_sec .navbar{ margin:0; padding:0; transition:all 0.4s ease-in-out, padding 1s cubic-bezier(0.6, 0.6, 0, 1);}
.header_sec .navbar-brand{ margin:0 60px 0 0; padding:0; display: inline-flex;}
.header_sec .navbar-brand img{ width: 104px; height: 76px; transition:all 1s cubic-bezier(0.6, 0.6, 0, 1); object-fit: cover; object-position: right center;}
.header_sec .navbar-light .navbar-nav .nav-item{ margin:0 14px 0 0; transition:all 1s cubic-bezier(0.6, 0.6, 0, 1); opacity: 0; visibility: hidden; pointer-events: none;}
.header_sec .navbar-light .navbar-nav .nav-link{ margin:0; padding:0px 0; font-weight: 700; font-size: 17px; color: var(--white);}
.header_sec .navbar-light .navbar-nav .nav-link:focus, .header_sec .navbar-light .navbar-nav .nav-link:hover{ color: var(--primary);}
.header_sec .navbar-light .navbar-nav .nav-link.active, .header_sec .navbar-light .navbar-nav .show > .nav-link{ color: var(--primary);}
.header_sec .dropdown-toggle::after{ border: none; width: 9px; height: 6px; background: url(../images/drop_arrow.png) center center no-repeat; background-size: 100% 100%; vertical-align: middle; transition:all .1s ease-in-out;}

.nav-rights{ width: 133px; display: flex; align-items: center; justify-content: flex-end; gap: 11px; transition:all .2s ease-in-out; overflow: hidden; white-space: nowrap;}
.profile_btn{ margin: 0; padding: 0; width: 40px; min-width: 40px; height: 40px; background: var(--white); border-radius: 7px; display: inline-flex; justify-content: center; align-items: center;}
.profile_btn:hover{ background: var(--yellow);}
.joc_btn{ margin: 0; padding: 9px 18px; font-size: 17px; font-weight: 700; line-height: normal; color: var(--white); background: var(--primary); border-radius: 7px; display: inline-flex;}
.joc_btn:hover{ background: var(--yellow); color: var(--black);}
.sff_btn{ margin: 0; padding: 9px 18px 10px 18px; font-size: 16px; font-weight: 700; line-height: normal; color: var(--white); background: var(--secondary); border-radius: 7px; display: inline-flex; min-width: 132px; text-align: center; justify-content: center;}
.sff_btn:hover{ background: var(--yellow); color: var(--black);}

@media (min-width:992px){
.header_sec.sticky .container{ max-width: 1070px;}
.header_sec.sticky .navbar{ padding: 14px 14px 14px 25px; background: rgba(22,22,22,0.9) url(../images/navbar-text-curve.png) no-repeat center right 270px; border-radius: 9px; box-shadow: 0 7px 10px rgba(128, 122, 158, 0.47);}
.header_sec.sticky .navbar-brand img{ width: 31px; height: 34px; filter: brightness(0) invert(1);}
.header_sec.sticky .nav-rights{ width: 245px; justify-content: flex-start;}
.header_sec.sticky .navbar-light .navbar-nav .nav-item{ margin:0 34px 0 0; opacity: 1; visibility: visible; pointer-events: all;}
}

/*=================================
 		SECTION START HERE 
=================================*/
section{ padding:0; margin:0;}

/* New Hero Section with Banner */
.hero_sec_new{
	margin: 0;
	padding: 0;
	min-height: 100vh;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	background: url(../images/baner.front) no-repeat center center;
	background-size: cover;
}
.hero_overlay{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, rgba(120, 60, 180, 0.85) 0%, rgba(200, 80, 140, 0.8) 100%);
	z-index: 1;
}
.hero_content{
	position: relative;
	z-index: 2;
	text-align: center;
	max-width: 900px;
	padding: 40px 5%;
	background: rgba(0, 0, 0, 0.15);
	border-radius: 20px;
}
.hero_sec_new h1{
	margin: 0 0 25px 0;
	padding: 0;
	font-size: 62px;
	font-weight: 700;
	color: var(--white);
	line-height: 1.15;
	text-shadow: 0 3px 15px rgba(0,0,0,0.4), 0 1px 3px rgba(0,0,0,0.3);
}
.hero_subtitle{
	margin: 0 0 45px 0;
	font-size: 26px;
	font-weight: 500;
	color: var(--white);
	text-shadow: 0 2px 10px rgba(0,0,0,0.3);
}
.hero_buttons{
	display: flex;
	gap: 20px;
	justify-content: center;
	flex-wrap: wrap;
}
.hero_btn_secondary{
	background: transparent !important;
	border: 2px solid var(--white) !important;
	color: var(--white) !important;
}
.hero_btn_secondary:hover{
	background: var(--white) !important;
	color: var(--secondary) !important;
}
.hero_btn_primary{
	background: var(--yellow) !important;
	color: var(--black) !important;
	border: 2px solid var(--yellow) !important;
}
.hero_btn_primary:hover{
	background: var(--white) !important;
	border-color: var(--white) !important;
	color: var(--secondary) !important;
}

/* Old Hero Section (kept for reference) */
.hero_sec{ margin: 0; padding: 0; background: #efecfe; height: 1200px; position: relative;}
.hero_sec .dot_curve1{ position: absolute; top: 0; right: 139px; transition: position 0.3s ease;}
.hero_sec .dot_curve2{ position: absolute; top: 43%; left: 0; transform: translateY(-50%); transition: position 0.3s ease;}
.hero_sec .dot_curve1.fixed, .hero_sec .dot_curve2.fixed { position: fixed;}
.hero_sec .hero_inn{ display: contents; width: 100%;}
.hero_sec .title_info{ width: 100%; max-width: 96%; margin: 0 auto; padding: 0; text-align: center; position: sticky; top: 50%; transform: translateY(-50%);}
.hero_sec h1{ margin: 0; padding: 0; font-size: 88px; font-weight: 300; position: relative; z-index: 1;}
.hero_sec h1 span{ color: var(--primary); font-family: var(--font_amertha); font-size: 142px; vertical-align: sub;}
.hero_sec .title_info img{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}

.crunchy_assets{ 
    position: relative; 
    z-index: 2;
    pointer-events: none; /* Prevent interaction issues */
}

.crunchy_asset{ 
    position: absolute; 
    display: inline-flex;
    overflow: hidden; /* Prevent overflow */
}



/* ADD these new rules for image sizing */
.crunchy_asset img {
    width: 140px !important;
    height: 140px !important;
    object-fit: cover;
    border-radius: 12px;
    display: block;
}

/* REPLACE your existing .ca1, .ca2, .ca3, .ca4, .ca5 rules with these: */
.ca1 { 
    top: 147px; 
    left: 309px;
    width: 120px;
    height: 120px;
}
.ca1 img {
    width: 120px !important;
    height: 120px !important;
}

.ca2 { 
    top: 116px; 
    right: 246px;
    width: 140px;
    height: 140px;
}
.ca2 img {
    width: 140px !important;
    height: 140px !important;
}

.ca3 { 
    top: 594px; 
    left: 141px;
    width: 160px;
    height: 160px;
}
.ca3 img {
    width: 160px !important;
    height: 160px !important;
}

.ca4 { 
    top: 594px; 
    right: 59px;
    width: 130px;
    height: 130px;
}
.ca4 img {
    width: 130px !important;
    height: 130px !important;
}

.ca5 { 
    top: 792px; 
    left: 50%; 
    transform: translateX(-50%);
    width: 150px;
    height: 150px;
}
.ca5 img {
    width: 150px !important;
    height: 150px !important;
}

/* ADD this responsive rule at the end */
@media (max-width: 768px) {
    .crunchy_asset {
        width: 80px !important;
        height: 80px !important;
    }
    
    .crunchy_asset img {
        width: 80px !important;
        height: 80px !important;
    }
}

/* CTA Counter ---------*/
.counter_cta{ padding: 0 0 130px; background: #efecfe;}
.counter_cta .container{ max-width: 1070px; position: relative;}
.counter_cta .ctr_info{ position: relative;}
.counter_cta .signature_txt{ font-size: 44px; line-height: 38px; color: #d3c0f3; width: 260px; font-family: var(--font_amertha); position: absolute; bottom: 100%; left: 0; transform: translateX(-50%) rotate(-20deg);}
.counter_cta .signature_txt::first-letter{ margin-left: 15px;}
.counter_cta .counter_txt{ margin: 0; display: block; font-size: 135px; font-weight: 300; color: var(--secondary); line-height: 90%;}
.counter_cta p{ margin: 0 0 24px; font-size: 28px; line-height: 34px; font-weight: 500; color: var(--secondary);}
.counter_cta p:last-child{ margin-bottom: 0;}
.counter_cta .memb_info{ max-width: 415px;}
.counter_cta .memb_info p{ font-size: 26px;}
.counter_cta .memb_img{ display: flex; gap: 8px; margin-bottom: 28px;}
.counter_cta .memb_img img{ width: 49px; height: 49px; border-radius: 50%; object-fit: cover;}

/* Centered Counter CTA */
.counter_cta_centered{ padding: 80px 0 100px;}
.counter_cta_centered .ctr_info{ margin: 0; padding-top: 30px;}
.counter_cta_centered .signature_txt{ position: relative; bottom: auto; left: auto; transform: rotate(-10deg); margin-bottom: 10px; display: inline-block;}
.counter_cta_centered .counter_txt{ font-size: 100px;}
.counter_cta_centered .memb_info{ max-width: 100%; margin: 0 auto;}
.counter_cta_centered .row{ gap: 30px 0;}

/* Benefits ----------*/
.benefits_sec{ padding: 164px 0 60px;}
.benefits_sec .detail{ position: sticky; top: 120px; max-width: 680px;}
.benefit_item{ margin: 0 auto 30px; padding: 50px 90px 60px 46px; background: url(../images/benefit_item-bg.jpg) no-repeat center center; background-size: cover; border-radius: 40px; max-width: 645px;}
.benefit_item figure{ margin: 0 0 23px; display: flex;}
.benefit_item h3{ margin: 0 0 40px; font-size: 36px; font-weight: 600; color: var(--secondary);}
.benefit_item p{ margin: 0; color: var(--white);}

/* Benefits New (Simplified) ----------*/
.benefits_sec_new{
	padding: 100px 0 120px;
	background: var(--white);
}
.benefits_header{
	text-align: center;
	margin-bottom: 60px;
}
.benefits_header .sec-title{
	margin-bottom: 0;
	font-size: 52px;
}
.benefits_grid{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 30px;
	max-width: 1200px;
	margin: 0 auto 50px;
}
.benefit_card{
	padding: 40px 30px;
	background: #efecfe;
	border-radius: 24px;
	text-align: center;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.benefit_card:hover{
	transform: translateY(-5px);
	box-shadow: 0 15px 40px rgba(174, 126, 232, 0.2);
}
.benefit_card figure{
	margin: 0 0 20px;
	display: flex;
	justify-content: center;
}
.benefit_card figure img{
	width: 50px;
	height: 50px;
}
.benefit_card h3{
	margin: 0 0 12px;
	font-size: 22px;
	font-weight: 700;
	color: var(--secondary);
}
.benefit_card p{
	margin: 0;
	font-size: 16px;
	line-height: 24px;
	color: var(--secondary);
	font-weight: 400;
}
.benefits_cta{
	text-align: center;
}

/* Feature ----------*/
.feature_sec{ margin: 0; padding: 250px 0; background: #efecfe; position: relative;}
.feature_sec:before{ content: ""; width: 184px; height: 258px; background: url(../images/feature_dots.png) center center no-repeat; background-size: 100% 100%; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.feature_sec h3{ margin: 0 0 20px 0; padding: 0; font-size: 69px; color: var(--secondary); font-weight: 600;}
.feature_sec .detail h3 {
    font-size: 49px !important;
    line-height: 1.2;
    margin: 0 0 15px 0;
    min-height: 50px;
}
.feature_sec .image_swap{ margin: 0; padding: 0; width: 515px; height: 515px; overflow: hidden; position: relative; left: 50%; transform: translateX(-50%);}
.feature_sec figure{ width: 100%; border-radius: 30px; position: absolute; top: 0; left: 0; z-index: -1; transform: translateY(100%); transition: transform 0.5s ease, z-index 0.5s ease;}
.feature_sec figure img{ width: 100%; border-radius: 30px;}
.feature_sec .left .sec-sub-info{ max-width: 280px;}
.feature_sec .right{ max-width: 340px; height: 100%; min-height: 245px; margin-left: auto; position: relative; overflow: hidden;}
.feature_sec figure.active{ z-index: 1; transform: translateY(0);}
.feature_sec .detail{ position: absolute; top: 0; left: 0; z-index: -1; transform: translateY(100%); transition: transform 0.5s ease, z-index 0.5s ease;}
.feature_sec .detail.active{ z-index: 1; transform: translateY(0);}
.feature_sec .pagination_info{ position: absolute; bottom: 10%; left: 0; width: 100%; font-size: 22px; font-weight: 600; display: flex; gap: 5px; justify-content: center;}

.feature_sec.pinned { position: fixed; top: 0; width: 100%; z-index: 10;}
.feature_sec.finished { position: relative;}

/* Community Section (New Layout) ----------*/
.community_sec{
	margin: 0;
	padding: 100px 0 120px;
	background: #efecfe;
	position: relative;
}
.community_sec:before{
	content: "";
	width: 184px;
	height: 258px;
	background: url(../images/feature_dots.png) center center no-repeat;
	background-size: 100% 100%;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
.community_header{
	text-align: center;
	margin-bottom: 60px;
}
.community_grid{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
	max-width: 1200px;
	margin: 0 auto 80px;
}
.community_member{
	text-align: center;
}
.community_member figure{
	margin: 0 0 25px;
	border-radius: 30px;
	overflow: hidden;
}
.community_member figure img{
	width: 100%;
	height: auto;
	border-radius: 30px;
	transition: transform 0.4s ease;
}
.community_member:hover figure img{
	transform: scale(1.03);
}
.community_member h3{
	margin: 0 0 12px;
	font-size: 28px;
	font-weight: 700;
	color: var(--secondary);
}
.community_member p{
	margin: 0;
	font-size: 18px;
	line-height: 26px;
	color: var(--secondary);
	font-weight: 400;
}
.community_slogan{
	text-align: center;
	max-width: 700px;
	margin: 0 auto;
}
.community_slogan h1{
	margin: 0 0 25px;
	font-size: 69px;
	font-weight: 600;
	color: var(--secondary);
}
.community_slogan .sec-sub-info{
	margin: 0;
	font-size: 22px;
	line-height: 32px;
}

/* People ----------*/
.people_sec{ margin: 0; padding: 180px 0 140px 0; position: relative;}
.people_sec .container{ padding-left: 40px;}
.people_sec .main{ position: absolute; top: 0; right: 0;}
.people_sec .detail{ margin: 0; padding: 0; max-width: 550px;}
.people_sec h2{ margin: 0 0 30px 0; padding: 0; font-size: 81px; font-weight: 300;}
.people_sec h2 span{ color: var(--primary); font-size: 132px; font-family: var(--font_amertha); vertical-align: sub;}
.people_sec p{ margin: 0 0 60px 0; padding: 0; font-size: 36px; line-height: 40px; font-weight: 300;}
ul.people_logo{ margin: 0; padding: 0; display: flex; justify-content: space-between; max-width: 1200px; align-items: center; gap: 50px;}
ul.people_logo li{ margin: 0; padding: 0; display: flex;}

/* Place ----------*/
.place_sec{ margin: 0; padding: 0 0 150px 0;}
.place_sec .inner{ margin: 0; padding: 100px 0 0 160px; background: #efecfe; position: relative; display: grid; grid-template-columns: 315px auto; grid-column-gap: 140px; align-items: center; overflow: hidden;}
.place_sec .inner:before{ content: ""; width: 257px; height: 93px; background: url(../images/place_dots.png) center center no-repeat; background-size: 100% 100%; position: absolute; top: 3px; left: 160px;}
.place_sec .inner:after{ content: ""; width: 939px; height: 441px; background: url(../images/place_shadow.png) center center no-repeat; background-size: 100% 100%; position: absolute; bottom: 0; left: 10%;}
.place_sec .inner .block img{ width: 100%; position: relative; z-index: 1;}

/* What / AI Innovation (New) ----------*/
.what_sec_new{
	margin: 0;
	padding: 120px 0 140px;
	background: linear-gradient(180deg, #efecfe 0%, #f8f7ff 100%);
	position: relative;
	overflow: hidden;
}
.what_sec_new:before{
	content: "";
	width: 400px;
	height: 400px;
	background: radial-gradient(circle, rgba(174, 126, 232, 0.15) 0%, transparent 70%);
	position: absolute;
	top: -100px;
	right: -100px;
	border-radius: 50%;
}
.what_sec_new .container{
	max-width: 1200px;
	position: relative;
	z-index: 1;
}
.what_header{
	text-align: center;
	margin-bottom: 70px;
}
.what_header .sec-title{
	margin-bottom: 25px;
	font-size: 56px;
	font-weight: 600;
	background: linear-gradient(135deg, var(--secondary) 0%, var(--primary) 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}
.what_intro{
	max-width: 700px;
	margin: 0 auto;
	font-size: 22px;
	line-height: 34px;
	color: var(--secondary);
	font-weight: 400;
}
.what_features{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
	margin-bottom: 80px;
}
.what_feature{
	padding: 40px 35px;
	background: var(--white);
	border-radius: 24px;
	text-align: center;
	box-shadow: 0 10px 40px rgba(174, 126, 232, 0.1);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	border: 1px solid rgba(174, 126, 232, 0.1);
}
.what_feature:hover{
	transform: translateY(-8px);
	box-shadow: 0 20px 50px rgba(174, 126, 232, 0.2);
}
.what_feature_icon{
	width: 80px;
	height: 80px;
	margin: 0 auto 25px;
	background: linear-gradient(135deg, var(--primary) 0%, #c6a4ef 100%);
	border-radius: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--white);
}
.what_feature h3{
	margin: 0 0 15px;
	font-size: 24px;
	font-weight: 700;
	color: var(--secondary);
}
.what_feature p{
	margin: 0;
	font-size: 17px;
	line-height: 26px;
	color: #666;
	font-weight: 400;
}
.what_cta_box{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 40px;
	padding: 50px 60px;
	background: linear-gradient(135deg, var(--primary) 0%, #9066d9 100%);
	border-radius: 30px;
	flex-wrap: wrap;
}
.what_cta_content h3{
	margin: 0 0 10px;
	font-size: 32px;
	font-weight: 700;
	color: var(--white);
}
.what_cta_content p{
	margin: 0;
	font-size: 18px;
	color: rgba(255, 255, 255, 0.9);
	font-weight: 400;
}
.what_cta_box .btns{
	background: var(--yellow);
	color: var(--black);
	padding: 16px 32px;
	font-size: 18px;
	white-space: nowrap;
}
.what_cta_box .btns:hover{
	background: var(--white);
	color: var(--secondary);
}
.what_cta_box .btns img{
	filter: brightness(0);
}

/* What (Old) ----------*/
.what_sec{ margin: 0; padding: 140px 0 120px 0; background: #efecfe url(../images/what_curve.png) top left no-repeat;}
.what_sec .container{ max-width: 1470px;}
.what_sec h2{ font-size: 102px; line-height: 108px; margin: 0;}

/* Banner ----------*/
.bannner_sec{ padding: 35px 0; grid-column-gap: 135px; background-color: var(--yellow); flex: none; justify-content: flex-start; align-items: center; width: 100%; display: flex; overflow: hidden;}
.bannner_sec .scroll { grid-column-gap: 135px; flex: none; align-items: center; display: flex; animation: scroll 12s linear infinite;}
.bannner_sec .medium { font-size: 46px; font-weight: 500;}

@keyframes scroll {
    from {
      transform: translateX(0);
    }
    to {
      transform: translateX(calc(-100% - 5em));
    }
}

/* Combine ----------*/
.combine_sec{ margin: 0; padding: 90px 0;}
.combine_sec .container{ max-width: 1430px;}
.combine_sec .sec-sub-info{ max-width: 400px;}
.combine_sec h5{ max-width: 570px; margin: 0 0 0 auto; padding: 0 0 0 45px; font-size: 46px; line-height: 46px; font-weight: 300; position: relative;}
.combine_sec h5::before{ content: "*"; font-size: 72px; color: var(--secondary); font-family: var(--font_dm); position: absolute; top: 5px; left: 0;}


/* CTA */
.cta_sec{ background: var(--secondary); position: relative; text-align: center;}
.cta_sec::before{ content: ""; width: 100%; height: 290px; background: var(--white); position: absolute; top: 0; left: 0; border-radius: 0 0 30px 30px;}
.cta_sec .inner{ padding: 130px 5% 125px; position: relative; z-index: 2; border-radius: 30px; background: url(../images/cta_bg.jpg) no-repeat center center; background-size: 100% 100%;}
.cta_sec h2{ font-size: 73px;}
.cta_sec h2 span{ color: var(--white); font-family: var(--font_amertha); font-size: 118px; vertical-align: sub;}

/*=================================
 		Footer START HERE 
=================================*/
.footer_sec{ margin: 0; padding: 0; background: var(--secondary); display: contents;}
.footer_sec .footer_inn{ margin: 0; padding: 80px 0 50px; background: var(--secondary);}
.footer_sec figure{ margin: 0;}
.footer_sec h6{ margin: 23px 0 30px; padding: 0; font-size: 14px; color: var(--white); text-transform: uppercase; font-weight: 900;}

.social_links{ margin: 23px 0 0; display: flex; gap: 9px; justify-content: flex-end;}
.social_links a img{ transition:all .2s ease-in-out;}
.social_links a:hover img{ filter: brightness(0) invert(1);}

.footer_links{ margin: 0; padding: 0;}
.footer_links li{ margin: 0 0 7px; padding: 0; font-size: 16px; font-weight: 300; color: var(--white); letter-spacing: 0.15px;}
.footer_links li a{ color: var(--white); position: relative; display: inline-block; padding-bottom: 1px;}
.footer_links li a::before { content: ''; position: absolute; width: 100%; height: 1px; border-radius: 4px; background-color: var(--yellow); bottom: 0; left: 0; transform-origin: right; transform: scaleX(0); transition: transform .3s ease-in-out;}
.footer_links li a:hover{ color: var(--yellow);}
.footer_links li a:hover::before { transform-origin: left; transform: scaleX(1);}

.country{ padding:0; margin:40px 0 15px; min-height: 42px;}
.country .btn{ padding:8px 35px 8px 37px; font-size:16px; font-weight: 300; color: var(--white); border:1px solid #2a2a2a; background:var(--secondary) url(../images/country_ic.svg) no-repeat center left 14px; background-size: 16px; display: flex; align-items: center; gap: 10px; border-radius: 5px; border-color: #2a2a2a !important; min-width: 121px;}
.country .btn.show{ border-radius: 5px 5px 0 0; border-bottom: transparent !important;}
.country :not(.btn-check) + .btn:active{ border-color: #2a2a2a !important; background: var(--secondary); color: var(--white);}
.country .btn.dropdown-toggle::after{ content: ""; width: 9px; height: 6px; background:url(../images/drop_arrow.png) no-repeat center center; position: absolute; right: 15px; top: 50%; transform: translateY(-50%); border: none;}
.country .btn-secondary:not(:disabled):not(.disabled):active:focus, .country .btn-secondary:not(:disabled):not(.disabled).active:focus, .country .show > .btn-secondary.dropdown-toggle:focus{ background:none; box-shadow:none;}
.country .btn-secondary:not(:disabled):not(.disabled):active, .country .btn-secondary:not(:disabled):not(.disabled).active, .country .show > .btn-secondary.dropdown-toggle{ background:none; box-shadow:none;}
.country .dropdown-menu{ margin:0 !important; padding:0; min-width:121px; width: auto; text-align:center; left:auto; right:0; border-radius: 0 0 5px 5px; background:var(--black); border: 1px solid #2a2a2a; border-top: none; margin: 0; overflow: hidden;}
.country .dropdown-item{ padding:7px 20px; font-size:16px; font-weight: 600; color: var(--white); display: flex; align-items: center; gap: 10px; background: #111111;}
.country img{ width: 16px; height: 16px; min-width: 16px; border-radius: 50%;}
.country .dropdown-item:hover, .country .dropdown-item.active{ background:var(--yellow); color:var(--secondary);}
.country .dropdown-menu[data-popper-placement="top-start"]{ border-radius: 5px 5px 0 0; border-top: 1px solid #2a2a2a; border-bottom: none; margin-bottom: -1px !important;}
.country .dropdown-menu[data-popper-placement="top-start"] ~ .btn.show{ border-radius: 0 0 5px 5px; border-bottom: 1px solid #2a2a2a !important; border-top: var(--secondary) !important;}

.copyright{ margin: 0; padding: 0; font-size: 14px; font-weight: 300; color: var(--primary);}
.copyright a{ display: inline-block; color: var(--primary); text-decoration: underline; margin-left: 21px;}
.copyright a:hover{ color: var(--yellow);}

.footer_bottom{ margin: 0; padding:17px 0; position: relative; bottom: 0; z-index: 888; width: 100%; background:var(--secondary); backdrop-filter: blur(9px); border-top: 1px solid #25212b;}
.footer_bottom p{ margin: 0; padding: 0; font-size: 14px; color: var(--white); font-weight: 300;}
.footer_bottom p a{ text-decoration: underline; color: var(--white);}
.footer_bottom p a:hover{ color: var(--yellow);}
.option_btns{ display: inline-flex; gap: 13px; flex-wrap: wrap;}
.option_btns a{ margin: 0; padding: 3px 15px; font-size: 15px; border: 1px solid rgba(255, 255, 255, 0.8); border-radius: 5px; background: var(--secondary); font-weight: 300; color: var(--white);}
.option_btns a.fill{ background: var(--primary); color: var(--white); border-color: var(--primary); font-weight: 600;}
.option_btns a:hover{ background: var(--white); color: var(--secondary); border-color: var(--white);}
.option_btns a.fill:hover{ background: var(--yellow); color: var(--secondary); border-color: var(--yellow);}

canvas{ z-index: 99999; background-image: url(../images/hero_logo.png); background-position: center center; background-repeat: no-repeat;}
.loding_screen{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #efecff; background-image: url(../images/hero_logo.png); background-position: center center; background-repeat: no-repeat; z-index: 9999;}
.loding_screen.hidden{ display: none;}

/*=================================
 		Benefit Page 
=================================*/
.brand-title{ margin: 0; padding: 0; font-size: 36px; font-weight: 300; position: absolute; left: 50%; transform: translateX(-50%); z-index: 1; display: none;}
.brand-title span{ color: var(--primary); font-family: var(--font_amertha); font-size: 57px; vertical-align: sub;}
@media(min-width:992px){
.header_sec:not(.sticky) .brand-title{ display: inline-block;}
}

.benefit_banner{ margin: 0; padding: 300px 0 140px 0; background: #efecfe; position: relative;}
.benefit_banner .dot_curve1{ position: absolute; top: 0; right: 139px; transition: position 0.3s ease;}
.benefit_banner .dot_curve2{ position: absolute; top: 43%; left: 0; transform: translateY(-50%); transition: position 0.3s ease;}
.benefit_banner .detail{ padding: 15px 10% 0 0;}
.benefit_banner h2{ margin: 0 0 35px 0; padding: 0; font-size: 60px; font-weight: 500; line-height: 55px;}
.benefit_banner p{ max-width: 530px; margin: 0; padding: 0; font-size: 32px; line-height: 40px; font-weight: 300;}
.benefit_banner figure{ margin: 0 -8% 0 0; padding: 0; position: relative;}
.benefit_banner figure:before{ content: ""; width: 496px; height: 496px; background: url(../images/benefit_banner_curve.png) center center no-repeat; background-size: 100% 100%; position: absolute; top: -65px; left: -65px;}
.benefit_banner figure img{ position: relative;}

/* Benefit Banner New (Full Background) ----------*/
.benefit_banner_new{
	margin: 0;
	padding: 0;
	min-height: 100vh;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	background: url(../images/people_img1.png) no-repeat center center;
	background-size: cover;
}
.benefit_banner_overlay{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, rgba(120, 60, 180, 0.85) 0%, rgba(200, 80, 140, 0.8) 100%);
	z-index: 1;
}
.benefit_banner_content{
	position: relative;
	z-index: 2;
	text-align: center;
	max-width: 900px;
	padding: 40px 5%;
	background: rgba(0, 0, 0, 0.15);
	border-radius: 20px;
}
.benefit_banner_new h2{
	margin: 0 0 25px;
	font-size: 62px;
	font-weight: 700;
	color: var(--white);
	line-height: 1.15;
	text-shadow: 0 3px 15px rgba(0,0,0,0.4), 0 1px 3px rgba(0,0,0,0.3);
}
.benefit_banner_new p{
	margin: 0;
	font-size: 26px;
	font-weight: 500;
	color: var(--white);
	text-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

/* Pay */
.pay_sec{ margin: 0; padding: 90px 0;}
.pay_sec .sec-title{ margin-bottom: 60px;}
.pay_sec .lbl_tag{ background: #c6a4ef;}
.pay_sec .container{ max-width: 1300px;}
.pay_sec .row{ margin-left:-15px; margin-right:-15px;}
.pay_sec [class^="col-"], .pay_sec > [class*=" col-"]{ padding-left: 15px; padding-right: 15px;}
.pay_block{ margin: 0 0 30px 0; padding: 0; height: calc(100% - 30px); display: flex; flex-direction: column; justify-content: space-between; background: #c6a4ef url(../images/pay_curve_1.png) center left no-repeat; border-radius: 40px; overflow: hidden;}
.pay_block .detail{ margin: 0; padding: 50px 50px 20px 50px;}
.pay_block h3{ margin: 0 0 25px 0; padding: 0; font-size: 36px; line-height: 34px; font-weight: 600;}
.pay_block p{ margin: 0; padding: 0; font-size: 22px; line-height: 28px;}
.pay_block figure{ margin: 0 0 30px 0; padding: 0; text-align: right;}
.pay_block figure img{ width: 95%;}
.pay_block.pink{ background: #fd88bc url(../images/pay_curve_2.png) center left no-repeat; margin-top: -40px;}
.pay_block.yellow{ background: #f9fb8e url(../images/pay_curve_3.png) center left no-repeat;}
.pay_block.yellow figure{ margin: 0;}

/* Product */
.product_sec{ padding: 0 0 48px;}
.product_sec .inner{ padding: 74px 5% 150px; background-color:#efecfe; background-image: url(../images/beneprod_curve1.png), url(../images/beneprod_curve2.png); background-repeat: no-repeat, no-repeat; background-position: top left 50px, top right 200px;}
.product_sec .left_info{ margin: 0 -8%; padding: 0; text-align: center;}
.product_sec .left_info svg{ overflow: inherit;}
.product_sec .campus{ visibility: hidden; opacity: 0;}
.product_sec .campus_txt:hover + .campus{ opacity: 1; visibility: visible;}
.product_sec .shop{ visibility: hidden; opacity: 0;}
.product_sec .shop_txt:hover + .shop{ opacity: 1; visibility: visible;}
.product_sec .appo{ visibility: hidden; opacity: 0;}
.product_sec .appo_txt:hover + .appo{ opacity: 1; visibility: visible;}
.product_sec .work{ visibility: hidden; opacity: 0;}
.product_sec .work_txt:hover + .work{ opacity: 1; visibility: visible;}
.product_sec .marketing{ visibility: hidden; opacity: 0;}
.product_sec .marketing_txt:hover + .marketing{ opacity: 1; visibility: visible;}
.product_sec .lawyer{ visibility: hidden; opacity: 0;}
.product_sec .lawyer_txt:hover + .lawyer{ opacity: 1; visibility: visible;}
.product_sec .accounting{ visibility: hidden; opacity: 0;}
.product_sec .accounting_txt:hover + .accounting{ opacity: 1; visibility: visible;}
.product_sec .ecom{ visibility: hidden; opacity: 0;}
.product_sec .ecom_txt:hover + .ecom{ opacity: 1; visibility: visible;}
.product_sec .succ{ visibility: hidden; opacity: 0;}
.product_sec .succ_txt:hover + .succ{ opacity: 1; visibility: visible;}
.product_sec .group{ visibility: hidden; opacity: 0;}
.product_sec .group_txt:hover + .group{ opacity: 1; visibility: visible;}
.product_sec .finance{ visibility: hidden; opacity: 0;}
.product_sec .finance_txt:hover + .finance{ opacity: 1; visibility: visible;}
.product_sec .right_info{ max-width: 300px; margin: 0 auto; padding-top: 115px;}

/* Membership */
.membership_sec{ padding: 0 0 80px;}
.membership_sec .inner{ padding: 0; position: relative;}
.membership_sec .inner .bg{ width: 100%;}
.membership_sec .caption{ padding: 106px 5% 142px; position: absolute; top: 0; left: 0; width: 100%;}
.membership_sec .detail{ max-width: 305px; margin: 0 auto;}

/* Software */
.software_sec { height: calc(100vh + 1600px);}
.software_sec .row{ margin-left:-20px; margin-right:-20px;}
.software_sec [class^="col-"], .software_sec > [class*=" col-"]{ padding-left: 20px; padding-right: 20px;}
.software_sec .container { position: sticky; top: 150px;}
.mt151{ margin-top:151px;}
.software_blocks { padding: 28px; border-radius: 20px; margin: 0 0 26px; transform: translateY(100vh); opacity: 0;}
.software_blocks_1 { background: #c6a4ee;}
.software_blocks_2 { background: #fd87bb;}
.software_blocks_3 { background: #f8fb8d;}
.software_block_head { display: flex; align-items: center; justify-content: space-between;}
.software_block_head span.software_title { font-size: 23px; font-family: var(--font_dm); line-height: 1.2; color: #161616; font-weight: 400; background: rgba(255, 255, 255, 0.4); padding: 4px 16px; border-radius: 20px;}
.software_block_head span.software_icon { display: flex; width: 38px; height: 38px; align-items: center; justify-content: center;}
.software_block_head span.software_icon img { display: flex; max-width: 100%; width: 100%; height: 100%; object-fit: contain;}
.software_block_content { overflow: hidden;}
.software_block_content { margin: 44px 0 0;}
.software_block_con { font-family: var(--font_dm); line-height: 1.2; color: #161616; font-weight: 400; font-size: 21px;}
.software_block_con p { font-size: 21px;}
.software_block_btn a { font-family: var(--font_dm); line-height: 1.2; color: #161616; font-weight: 600; font-size: 19px; display: flex;}
.software_block_btn a:after { content: ""; width: 20px; height: 20px; display: block; background-color: #161616; background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" fill="%23FFFFFF"><path d="M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z"/></svg>'); background-size: 11px; background-repeat: no-repeat; background-position: 49% 42%; border-radius: 20px; margin: 0 0 0 8px;}
.software_images { position: relative; border: 2px solid transparent; border-radius: 20px; overflow: hidden;}
.software_image { display: flex; max-width: 100%; width: 100%; filter: blur(0px);}
.software_image.software_image_2, .software_image.software_image_3 { position: absolute; top: 100%;}
.software_image img { max-width: 100%; width: 100%; height: auto;}
.software_sec .col-xl-4:last-child { display: flex; align-items: center;}

/* Map */
.map_sec{ padding: 0; position: relative; display: flex; background: var(--secondary);}
.map_sec .map_img{ width: 100%; min-height: 397px; object-fit: cover;}
.map_sec iframe{ width: 100%; line-height: inherit; position: relative; z-index: 1; opacity: 0.6;}
@media (min-width:768px){
.located_block{ position: absolute; z-index: 55;}
.located_block1{ top: 20%; left: 25%; transform: translateX(-25%);}
.located_block2{ bottom: 20%; left: 35%; transform: translateX(-35%);}
.located_block3{ top: 50%; right: 25%; transform: translateY(-50%) translateX(25%);}
}
@media (max-width:767px){
.located_block .located_pin{ position: absolute; z-index: 55;}
.located_block1 .located_pin{ top: 20%; left: 25%; transform: translateX(-25%);}
.located_block2 .located_pin{ bottom: 20%; left: 35%; transform: translateX(-35%);}
.located_block3 .located_pin{ top: 50%; right: 25%; transform: translateY(-50%) translateX(25%);}
}
.located_pin{ width: 25px; height: 25px; background-color: rgba(246,250,94,0.6); border-radius: 50%; position: relative; display: block;}
.located_pin:before, .located_pin:after{ content: ""; width: inherit; height: inherit; background-color: rgba(246,250,94,0.6); border-radius: 50%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -10; opacity: 0; animation: 2s expand cubic-bezier(0.29, 0, 0, 1) infinite; animation-delay: 1s;}
.located_pin:after { background-color: rgba(246,250,94,0.5); animation-delay: 1.5s;}
.located_tooltip{ position: absolute; bottom: 0; left: 0; padding: 0 0 20px 50px; opacity: 0; visibility: hidden; z-index: 5;}
.located_block:hover .located_tooltip{ opacity: 1; visibility: visible;}
.lctd_tltp_inn{ min-width: 192px; padding: 14px 14px 10px; background: #f6fa5e; border-radius: 4px;}
.lctd_tltp_inn h6{ margin: 0 0 5px; font-size: 18px; font-weight: 700; color: var(--secondary); display: flex; align-items: center; gap: 5px; justify-content: space-between;}
.lctd_tltp_inn h6 strong{ display: flex; align-items: center; font-size: 16px; gap: 2px;}
.lctd_tltp_inn h6 strong img{ width: 16px;}
.lctd_tltp_inn p{ margin: 0 0 7px; font-size: 15px; line-height: 18px; font-weight: 500; color: var(--secondary);}
.chckbtn{ margin: 0; padding: 2px 10px; font-size: 10px; font-weight: 600; color: #d5d854; text-transform: uppercase; gap: 5px; width: 100%; display: flex; justify-content: center; align-items: center; background: var(--secondary); border-radius: 50px; min-height: 21px;}
.chckbtn img{ width: 52px;}
.chckbtn:hover{ color: var(--white); background: var(--primary);}

@keyframes expand {
    1% {
      width: 0;
      height: 0;
      opacity: 1;
    }
    100% {
      width: 53px;
      height: 53px;
      opacity: 0;
    }
  }

/* Process */
.product_sec.process_sec{ padding: 50px 0;}
.product_sec.process_sec .inner{ padding-top: 60px; padding-bottom: 0;}
.product_sec.process_sec .right_info{ padding-top: 144px;}

.product_sec .the{ visibility: hidden; opacity: 0;}
.product_sec .the_txt:hover + .the{ opacity: 1; visibility: visible;}
.product_sec .aca{ visibility: hidden; opacity: 0;}
.product_sec .aca_txt:hover + .aca{ opacity: 1; visibility: visible;}
.product_sec .tech{ visibility: hidden; opacity: 0;}
.product_sec .tech_txt:hover + .tech{ opacity: 1; visibility: visible;}
.product_sec .ai{ visibility: hidden; opacity: 0;}
.product_sec .ai_txt:hover + .ai{ opacity: 1; visibility: visible;}
.product_sec .mark{ visibility: hidden; opacity: 0;}
.product_sec .mark_txt:hover + .mark{ opacity: 1; visibility: visible;}
.product_sec .succ{ visibility: hidden; opacity: 0;}
.product_sec .succ_txt:hover + .succ{ opacity: 1; visibility: visible;}

.product_sec.section_top .arrow1 path { stroke-dasharray: 1500; stroke-dashoffset: 1500; animation: drawArrow1 5s ease forwards;}
.product_sec.section_top .arrow1 .angel{ animation: drawAngel1 1s ease forwards; fill: transparent;}
.product_sec.section_top .arrow2 path { stroke-dasharray: 1500; stroke-dashoffset: 1500; animation: drawArrow1 4s ease forwards; animation-delay: 1s;}
.product_sec.section_top .arrow2 .angel{ animation: drawAngel1 1s ease forwards; fill: transparent; animation-delay: 1s;}
.product_sec.section_top .arrow3 path { stroke-dasharray: 1500; stroke-dashoffset: 1500; animation: drawArrow1 4s ease forwards; animation-delay: 2s;}
.product_sec.section_top .arrow3 .angel{ animation: drawAngel1 1s ease forwards; fill: transparent; animation-delay: 2s;}
.product_sec.section_top .arrow4 path { stroke-dasharray: 1500; stroke-dashoffset: 1500; animation: drawArrow1 4s ease forwards; animation-delay: 3s;}
.product_sec.section_top .arrow4 .angel{ animation: drawAngel1 1s ease forwards; fill: transparent; animation-delay: 3s;}
.product_sec.section_top .arrow5 path { stroke-dasharray: 1500; stroke-dashoffset: 1500; animation: drawArrow1 4s ease forwards; animation-delay: 4s;}
.product_sec.section_top .arrow5 .angel{ animation: drawAngel1 1s ease forwards; fill: transparent; animation-delay: 4s;}
.product_sec.section_top .arrow6 path { stroke-dasharray: 1500; stroke-dashoffset: 1500; animation: drawArrow1 4s ease forwards; animation-delay: 5s;}
.product_sec.section_top .arrow6 .angel{ animation: drawAngel1 1s ease forwards; fill: transparent; animation-delay: 5s;}
  
@keyframes drawArrow1 {
to {
    stroke-dashoffset: 0;
}
}

@keyframes drawAngel1 {
    65% {
        fill: transparent;
    }
    100% {
        fill: #161616;
    }
}

/*=================================
 		Member Page 
=================================*/
.member_banner{ margin: 0; padding: 300px 0 140px 0; background: #efecfe; position: relative;}
.member_banner .dot_curve1{ position: absolute; top: 0; right: 139px; transition: position 0.3s ease;}
.member_banner .dot_curve2{ position: absolute; top: 43%; left: 0; transform: translateY(-50%); transition: position 0.3s ease;}
.member_banner .detail{ margin: 0; padding: 0 0 0 45px; position: relative;}
.member_banner .detail:before{ content: ""; width: 41px; height: 32px; background: url(../images/quote_ic.png) center center no-repeat; background-size: 100% 100%; position: absolute; top: -70px; left: 0;}
.member_banner .detail p{ margin: 0 0 30px 0; padding: 0; font-size: 30px; color: #161616; line-height: 40px; font-weight: 300;}
.member_banner .right{ display: flex; align-items: center;}
.member_banner figure{ margin: 0; padding: 0;}
.member_banner h3{ margin: 0 0 22% -60px; padding: 0; font-size: 20px; color: #161616; font-weight: 700; line-height: 27px; min-width: 155px; max-width: 155px;}
.member_banner h3 small{ margin: 0; padding: 0; display: flex; align-items: center; font-size: 18px; text-transform: uppercase; color: var(--primary); gap: 4px;}
.member_banner h3 small img{ margin-bottom: 4px;}

/* Team */
.team_sec{ margin: 0; padding: 140px 0 0 0; background: var(--primary);}
.team_sec .inner{ margin: 0; padding: 100px 85px; background: #efecfe; border-radius: 40px 40px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 130px;}
.team_block{ margin: 0; padding: 0; position: relative;}
.team_block.block1::before{ content: ""; width: 206px; height: 206px; background: url(../images/team_dot.png) center center no-repeat; position: absolute; right: 10px; top: 31%;}
.team_block.block2::before{ content: ""; width: 206px; height: 206px; background: url(../images/team_dot.png) center center no-repeat; position: absolute; right: -40px; top: -30px;}
.team_block h3{ margin: 0 0 15px 0; font-size: 23px; font-weight: 700; line-height: 24px;}
.team_block figure{ margin: 0 0 20px 0; padding: 0; position: relative;}
.team_block p{ margin: 0 0 20px 0; font-size: 26px; line-height: 30px; font-weight: 300;}
.team_block small{ margin: 0; padding: 0; display: block; font-size: 12px; font-weight: 700; color: var(--primary); line-height: 16px; text-transform: uppercase;}
.team_block:nth-child(3n + 2){ margin-top: 90px;}

/* Coop */
.coop_sec{ margin: 0; padding: 120px 0 150px 0; background: var(--black);}
.coop_sec .lbl_tag{ margin-bottom: 40px;}
.coop_sec p{ margin: 0 0 50px 0; padding: 0; font-size: 36px; color: var(--white); font-weight: 300; line-height: 48px;}
@media (min-width:1280px){
.coop_sec .row{ margin-left:-45px; margin-right:-45px;}
.coop_sec [class^="col-"], .coop_sec > [class*=" col-"]{ padding-left: 45px; padding-right: 45px;}
}

.coop_sec .coop_contents_wrap{ margin: 0 0 130px 0; padding: 0; overflow: hidden;}
.coop_sec .count_contents{ width: max-content; margin: 0; padding: 0; display: flex; animation: ft-scrolling-left 27s linear infinite;}
.coop_sec .count_contents .count_contents_inner{ width: max-content; margin: 0; padding: 0; display: flex;}
.coop_sec .count_contents .marquee { margin: 0 25px; padding: 0; white-space: nowrap; display: block; font-size: 102px; color: var(--white); font-weight: 300; line-height: 108px;}

@keyframes ft-scrolling-left{
    0% {transform: translateX(0%);}
    100% {transform: translateX(-50%);}
}

/* Information */
.information_sec{ padding: 60px 0;}
.info__box{ margin: 0 0 40px;}
.info__box span{ margin-bottom: 4px; display: block; font-size: 21px; font-weight: 700; text-transform: uppercase; color: var(--secondary);}
.info__box strong{ display: block; font-size: 36px; font-weight: 300; color: var(--secondary); line-height: 46px;}
.info__box strong a{ color: var(--primary); line-height: normal;}
.info__box strong a:hover{ color: var(--primary); opacity: 0.6;}

/* Pricing */
.pricing_sec{ padding: 0 0 96px;}
.pricing_sec .inner{ padding: 90px 5% 0; background-color:#efecfe; background-image: url(../images/place_shadow.png), url(../images/pricing_white_shadow.png), url(../images/beneprod_curve2.png); background-repeat: no-repeat, no-repeat, no-repeat; background-position:bottom left 140px, bottom right, top left 169px; position: relative;}
.b_blink{ position: absolute; top: 50%; left: 70%; transform: translateY(-50%) translateX(-50%); animation: fadeinout-b 5s linear infinite;}
.pricing_sec .row{ position: relative; z-index: 5;}
.pricing_sec .btns{ padding: 7px 31px;}
.pricing_sec .title__group{ max-width: 305px; margin: 0 auto; padding: 107px 0 80px;}
.pricing_sec .detail{ max-width: 360px; margin: 0 auto; text-align: right; padding: 95px 0;}
.pricing_sec p{ margin: 0 0 10px; font-size: 25px; font-weight: 300;}
.pricing_sec p sup{ font-size: 48px; top: 0; margin-right: 3px;}
.pricing_sec p strong{ font-weight: 500;}
.pricing__box{ margin: 0 auto; padding: 80px 75px 80px; background: rgba(198,164,239,0.6); border-radius: 40px 40px 0 0; max-width: 414px;}
.pricing__box h3{ margin: 0; color: var(--primary);}
.pricing__box h3 span{ display: block; font-size: 60px; letter-spacing: -0.02em; font-family: var(--font_amertha); margin-top: -25px;}
.pricing__box h3 small{ display: block; font-size: 17px; font-weight: 900; color: var(--primary); text-transform: uppercase;}
.pricing__box .price{ margin: 0; display: block; font-size: 60px; font-weight: 900; color: var(--white);}
.pricing__box ul{ margin: 50px -30px 0 -5px; padding: 0; text-align: left; max-width: 305px;}
.pricing__box ul li{ margin: 0; padding: 0 0 0 22px; font-size: 19px; line-height: 35px; font-weight: 500; color: var(--secondary); background: url(../images/check-ic15x.png) no-repeat left top 12px;}

@keyframes fadeinout-b{
    0%,100% { opacity: 0 }
    50% { opacity: 1 }
}

/* Video Widget ----------*/
.video_widget{
	position: fixed;
	bottom: 30px;
	right: 30px;
	z-index: 9999;
	cursor: pointer;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.video_widget:hover{
	transform: scale(1.05);
}
.video_widget_inner{
	width: 120px;
	height: 120px;
	border-radius: 50%;
	overflow: hidden;
	box-shadow: 0 8px 30px rgba(174, 126, 232, 0.4);
	border: 4px solid var(--primary);
	position: relative;
	background: var(--primary);
}
.video_widget_inner video{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.video_widget_pulse{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	border-radius: 50%;
	border: 3px solid var(--primary);
	animation: widget-pulse 2s ease-out infinite;
	pointer-events: none;
}
@keyframes widget-pulse{
	0%{
		transform: translate(-50%, -50%) scale(1);
		opacity: 1;
	}
	100%{
		transform: translate(-50%, -50%) scale(1.5);
		opacity: 0;
	}
}