/* ------------------------------------------------------------- */
/* ROOT */
/* ------------------------------------------------------------- */

:root {
--team_list_gap_x: 6rem;
--team_list_gap_x: clamp(6rem, 3.2308rem + 3.6058vw, 9rem);
--team_list_gap_y: 6rem;
--team_list_gap_y: clamp(6rem, 3.2308rem + 3.6058vw, 9rem);
--team_list_items: 2;
--team_clip_path: 0.5rem;
--team_clip_path: clamp(0.5rem, 0.3548rem + 0.4032vw, 1rem);
--team_clip_path_dx: 98%;
--team_clip_path_dx: calc(100% - var(--team_clip_path));
--team_line_height: 1rem;
--team_line_height: calc(var(--team_clip_path) * 2);
}

/* ------------------------------------------------------------- */
/* CONTENT */
/* ------------------------------------------------------------- */

#content { overflow: hidden; }
#content:only-child {
padding-bottom: 10rem;
padding-bottom: clamp(10rem, 5.6452rem + 12.0968vw, 25rem);
}
#content .boxed {
padding-top: 2rem;
padding-top: clamp(2rem, -0.3226rem + 6.4516vw, 10rem);
}
#content .cols {
padding: 0 7rem;
padding: 0 clamp(7rem, 1.6667rem + 5.2083vw, 10rem);
}
#content .title {
position: relative;
z-index: 0;
}
#content .title::after {
content: "";
position: absolute;
top: 0;
left: calc(50% + clamp(3rem, 1.6154rem + 1.8029vw, 4.5rem));
display:  block;
width: calc(50vw - clamp(3rem, 1.6154rem + 1.8029vw, 4.5rem));
height: 100%;
background-color: var(--color_orange);
clip-path: polygon(6rem 0, 100% 0, 100% 100%, 0 100%);
z-index: 1;
}
#content.animation .title::after { transition: transform 1s; transform: translateX(100%); }
#content.animation.on .title::after { transform: translateX(0); }
#content h1 {
display: block;
width: 50%;
font-family: "Rajdhani", sans-serif;
font-size: 3.6rem;
font-size: clamp(3.6rem, 2.9032rem + 1.9355vw, 6rem);
font-weight: 600;
font-style: normal;
text-align: left;
line-height: 1;
text-transform: uppercase;
text-wrap: balance;
color: var(--color_grey);
}
#content.animation h1 { transition: opacity 0.5s 0.5s, transform 0.5s 0.5s; opacity: 0; transform: translateY(50px); }
#content.animation.on h1 { opacity: 1; transform: translateY(0); }
#content .text {
column-count: 2;
column-gap: 6rem;
column-gap: clamp(6rem, 3.2308rem + 3.6058vw, 9rem);
margin-top: 4rem;
margin-top: clamp(4rem, 2.2581rem + 4.8387vw, 10rem);
}
#content.animation .text { transition: opacity 0.5s 1s, transform 0.5s 1s; opacity: 0; transform: translateY(50px); }
#content.animation.on .text { opacity: 1; transform: translateY(0); }
#content p {
display: block;
font-size: 1.8rem;
font-size: clamp(1.8rem, 1.6839rem + 0.3226vw, 2.2rem);
font-weight: 400;
text-align: justify;
line-height: 1.5;
color: var(--color_grey);
}

/* ------------------------------------------------------------- */
/* TEAM */
/* ------------------------------------------------------------- */

#team {}
#team .boxed {
padding: 5rem 0 10rem;
padding: clamp(5rem, 2.0968rem + 8.0645vw, 15rem) 0 clamp(10rem, 5.6452rem + 12.0968vw, 25rem);
}
#team .cols {
padding: 0 7rem;
padding: 0 clamp(7rem, 1.6667rem + 5.2083vw, 10rem);
}
#team h2 {
display: block;
font-family: "Rajdhani", sans-serif;
font-size: 3.6rem;
font-size: clamp(3.6rem, 2.9032rem + 1.9355vw, 6rem);
font-weight: 600;
font-style: normal;
text-align: left;
line-height: 1;
color: var(--color_grey);
}
#team .cols.animation h2 { transition: opacity 0.5s 0.5s, transform 0.5s 0.5s; opacity: 0; transform: translateY(50px); }
#team .cols.animation.on h2 { opacity: 1; transform: translateY(0); }
#team .list {
padding-top: 10rem;
gap: var(--team_list_gap_y) var(--team_list_gap_x);
}
#team .list .item {
display: block;
width: calc((100% / var(--team_list_items)) - (((var(--team_list_items) - 1) / var(--team_list_items)) * var(--team_list_gap_x)));
text-align: center;
}
#team .img {
padding: 0 2.5rem;
padding: 0 clamp(2.5rem, 0.1923rem + 3.0048vw, 5rem);
}
#team .img figure { overflow: hidden; }
#team .img figure img {
display: block;
width: 100%;
max-width: 350px;
height: auto;
margin: 0 auto;
}
#team .item.animation .img figure img { transition: transform 1s 0.2s; transform: translateY(100%); }
#team .item.animation.on .img figure img { transform: translateY(0); }
#team .text {
position: relative;
padding-top: var(--team_line_height);
z-index: 0;
}
#team .text::before {
content: "";
position: absolute;
left: 0;
top:  0;
display: block;
width:  100%;
height: var(--team_line_height);
background-color: var(--color_orange);
clip-path: polygon(0 0, var(--team_clip_path_dx) 0, 100% 100%, var(--team_clip_path) 100%);
z-index: 1;
}
#team .item.animation .text::before { transition: transform 1s; transform: scaleX(0); }
#team .item.animation.on .text::before { transform: scaleX(1); }
#team h3 {
display: block;
font-family: "Rajdhani", sans-serif;
font-size: 2.4rem;
font-size: clamp(2.4rem, 2.0516rem + 0.9677vw, 3.6rem);
font-weight: 600;
font-style: normal;
margin-top: 2rem;
margin-top: clamp(1.5rem, 1.3548rem + 0.4032vw, 2rem);
line-height: 1;
text-transform: uppercase;
color: var(--color_grey);
}
#team .item.animation h3 { transition: opacity 1s 0.5s, transform 1s 0.5s; opacity: 0; transform: translateY(-100%); }
#team .item.animation.on h3 { opacity: 1; transform: translateY(0); }
#team p {
display: block;
font-size: 2rem;
font-size: clamp(1.6rem, 1.4839rem + 0.3226vw, 2rem);
font-weight: 400;
margin-top: 0.5rem;
line-height: 1;
color: var(--color_grey);
}
#team .item.animation p { transition: opacity 1s 1s, transform 1s 1s; opacity: 0; transform: translateY(-100%); }
#team .item.animation.on p { opacity: 1; transform: translateY(0); }

/* ------------------------------------------------------------- */
/* PIXEL RATIO */
/* ------------------------------------------------------------- */

@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { 


			
}

/* ------------------------------------------------------------- */
/* RESPONSIVE */
/* ------------------------------------------------------------- */

@media (hover: none) and (pointer: coarse) {
	
}

@media screen and (orientation: landscape) {
    
}

@media screen and (orientation: portrait) {
  
}

@media only screen and (max-width: 1699px) {
	
	
}

@media only screen and (max-width: 1599px) {
    
}

@media only screen and (max-width: 1439px) {
	
}

@media only screen and (max-width: 1365px) {
	
}

@media only screen and (max-width: 1279px) {
	
	
}

@media only screen and (max-width: 1199px) {
	
}

@media only screen and (max-width: 1111px) {
		
	
}

@media only screen and (max-width: 1023px) {
    
    /* CONTENT */
    #content .cols {
    padding: 0 0rem;
    padding: 0 clamp(0rem, -6.1765rem + 12.8676vw, 7rem);
    }
    
    /* TEAM */
    #team .cols {
    padding: 0 0rem;
    padding: 0 clamp(0rem, -6.1765rem + 12.8676vw, 7rem);
    }
    #team .list {
    padding-top: 5rem;
    padding-top: clamp(6rem, 3.8313rem + 6.0241vw, 10rem);
    }
	
}

@media only screen and (max-width: 833px) {
	
}

@media only screen and (max-width: 767px) {
    
    /* ROOT */
    :root {
    --team_list_gap_y: 5rem;
    --team_list_items: 1;
    }
    
    /* CONTENT */
    #content .title::after {
    left: calc(50% + 3rem);
    width: calc(50vw - 3rem);
    }
    #content .text { column-count: 1; }
	
}

@media only screen and (max-width: 735px) {
	
}

@media only screen and (max-width: 666px) {
	
    
}
	

@media only screen and (max-width: 599px) {
	
	
}

@media only screen and (max-width: 567px) {
	
	
}

@media only screen and (max-width: 479px) {
    
    /* TEAM */
    #team .img {
    padding: 0 2.5rem;
    padding: 0 clamp(2.5rem, -5.0000rem + 20.8333vw, 5rem);
    }    
	
}

@media only screen and (max-width: 413px) {
	
}

@media only screen and (max-width: 374px) {
	
	
}

@media only screen and (max-width: 359px) {
	
}