@import url('https://fonts.googleapis.com/css2?family=DM+Mono:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&display=swap');

@font-face {
    font-family: TTLight;
    /* set name */
    src: url('../fonts/TypeType-Light.otf');
    /* url of the font */
}

/* .page-wrapper {
    opacity: 0;
    animation: pageFadeIn 0.8s ease-in-out forwards;
}

@keyframes pageFadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
} */

.page-wrapper {
    position: relative;
}

.page-wrapper::after {
    content: "";
    position: fixed;
    inset: 0;
    background: #000;
    animation: fadeOut 0.8s ease forwards;
    z-index: 9999;
    pointer-events: none;
}

@keyframes fadeOut {
    to {
        opacity: 0;
        visibility: hidden;
    }
}



*,
*::after,
*::before {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

:root {
    --fonts-TTHoves: TTLight;
    --fonts-Mono: "DM Mono", monospace;

    --bg-body: #000025;
    --text-white: #FFFFFF;
    --Colors-White---Muted-Text: #FFFFFF80;
    --text-accent: #2BF7F6;
    --colors-white-15: #FFFFFF26;
    --Colors-Theme: #295AF2;
    --bg-white: #FFFFFF;
    --Colors-White---Paragraph: #FFFFFFD9;
    --colors-dark-15: #00000026;


    /* Font Weight */
    --fw-400: 400;
    --fw-500: 500;

    /* Line Height */

    --lh-130: 130%;
    --lh-110: 110%;
    --lh-140: 140%;

    /* Font size */

    --fz-h1: 60px;
    --fz-h2: 48px;
    --fz-h3: 38px;
    --fz-h4: 30px;
    --fz-h5: 24px;
    --fz-h6: 19px;
    --fz-19: 19px;
    --fz-15: 15px;
    --fz-24: 24px;
    --fz-14: 14px;
    --fz-13: 13px;

    /* Border Radius */
    --br-button: 4px;

}



html,
body {
    overscroll-behavior: none;
}

body {
    font-family: var(--fonts-TTHoves);
    background-color: var(--bg-body);
}

p {
    padding: 0;
    margin: 0;
    color: var(--Colors-White---Muted-Text);
    font-size: var(--fz-19);
    line-height: var(--lh-130);
    font-weight: var(--fw-400);
}

.container {
    padding: 0;
}

img {
    image-rendering: auto;
}


h1,
h2,
h3,
h4,
h5,
h6 {
    padding: 0;
    margin: 0;
    color: var(--text-white);
    line-height: var(--lh-130);
    font-weight: var(--fw-400);
}

h1 {
    font-size: var(--fz-h1);
}

h2 {
    font-size: var(--fz-h2);
}

h3 {
    font-size: var(--fz-h3);
    line-height: var(--lh-110);
}

h4 {
    font-size: var(--fz-h4);
}

h5 {
    font-size: var(--fz-h5);
}

h6 {
    font-size: var(--fz-h6);
}

a {
    text-decoration: none;
    color: var(--text-white);
    font-weight: var(--fw-400);
    line-height: var(--lh-130);
    font-size: var(--fz-15);
}

.cls-1 {
  fill: #fff !important;
}

header svg path {
  fill: #000; /* or any visible color */
}

header svg {
  width: 150px;
  height: auto;
}

.mt-100 {
    margin-top: 100px;
}

.section-title {
    display: flex;
    flex-direction: column;
    gap: 21px;
}

.section-title .gsap-reveal-inner {
    display: flex;
    flex-direction: column;
    gap: 21px;
}

.small-title span {
    font-size: var(--fz-14);
    font-weight: var(--fw-500);
    line-height: var(--lh-140);
    color: var(--text-accent);
    text-transform: uppercase;
    font-family: var(--fonts-Mono);
    display: flex;
    align-items: center;
    gap: 5px;
    transition: all .3s ease;
}

.small-title span svg{
    display: none;
}

.small-title span:hover svg {
    transform: translate(2px, -2px);
    transition: all .3s ease;
}

.small-title span img {
    width: 10px;
    height: 10px;
}

.sub-content {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sub-content h6 {
    line-height: var(--lh-130);
}

.sub-content p span {
    color: var(--text-white);
}

/* Button */

.py-btn {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.btn-blur {
    max-width: 240px;
    width: 240px;
    height: 96px;
    backdrop-filter: blur(36px);
    background: var(--colors-white-15);
    border-radius: var(--br-button);
    padding: 12px;
    position: relative;
    overflow: hidden;
    transition: all 0.5s ease;
}

.btn-blur:hover::after {
    background: #ffffff1e;
    filter: blur(10px);
    transition: all 0.5s ease;
}

.btn-blur::after {
    position: absolute;
    content: '';
    inset: 0;
    transition: all 0.5s ease;
    z-index: -1;
}


.btn-blur a {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    transition: all .3s ease;
}

.btn-blur a .arrow {
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
    transition: all .3s ease;
}

.btn-blur a .arrow span:nth-child(1) {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    transition: all .3s ease;
    left: 0;
}

.btn-blur a .arrow span:nth-child(2) {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: -100%;
    transition: all .3s ease;
}

.btn-blur:hover .arrow span:nth-child(1) {
    left: 100%;
    transition: all .3s ease;
}

.btn-blur:hover .arrow span:nth-child(2) {
    left: 0;
    transition: all .3s ease;
}


.btn-blue {
    max-width: 240px;
    width: 240px;
    height: 96px;
    backdrop-filter: blur(36px);
    background: var(--Colors-Theme);
    border-radius: var(--br-button);
    padding: 12px;
}

.btn-blue:hover::after {
    background: #ffffff1e;
    filter: blur(10px);
    transition: all 0.3s ease;
}

.btn-blue::after {
    position: absolute;
    content: '';
    inset: 0;
    transition: all 0.3s ease;
    z-index: -1;
}

.btn-blue a {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    transition: all .3s ease;
}

.btn-blue a .arrow {
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
    transition: all .3s ease;
}

.btn-blue a .arrow span:nth-child(1) {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    transition: all .3s ease;
    left: 0;
}

.btn-blue a .arrow span:nth-child(2) {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: -100%;
    transition: all .3s ease;
}


.btn-blue:hover .arrow span:nth-child(1) {
    left: 100%;
    transition: all .3s ease;
}

.btn-blue:hover .arrow span:nth-child(2) {
    left: 0;
    transition: all .3s ease;
}

.py-custom-tag {
    position: relative;
}

.img-sm-text {
    position: absolute;
    bottom: 0;
}

.img-sm-text span {
    color: #000025;
    font-size: var(--fz-13);
    background-color: var(--bg-white);
    padding: 5px;
    font-weight: var(--fw-500);
    line-height: var(--lh-130);
    text-transform: uppercase;
}

.section-padding {
    padding: 96px 0;
}


/* .fade-in-up {
  opacity: 0;
} */


/* Navbar Start */

.py-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    /* transform: translateY(-100%); */
    transition: transform 0.4s ease;
    backdrop-filter: blur(120px);
    background: var(--colors-dark-15);
}



/* when active */


.py-header.is-sticky .nav-wrapper {
    padding-top: 18px;
    height: auto;
    transition: all .3s ease;
}

.nav-wrapper {
    padding-top: 51px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 18px;
    transition: all .3s ease;
}

.nav-wrapper .py-logo {
    width: 130px;
    height: auto;
    display: flex;
}

.nav-wrapper .py-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.nav-wrapper .py-nav-link .py-nav-main ul {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
    display: flex;
    gap: 103px;
}


.nav-wrapper .py-nav-link .py-nav-main ul li a {
    opacity: 1;
    transition: all .2s ease;
}

.nav-wrapper .py-nav-link .py-nav-main ul li a:hover {
    opacity: 0.5;
    transition: all .2s ease;
}


/* Navbar End */



/* Hero Section Start */

.py-hero-section {
    position: relative;
}

.custom-inner-layer {
    position: relative;
}

.custom-inner-layer::after {
    content: '';
    width: 100%;
    height: 438px;
    position: absolute;
    bottom: 0;
    left: 0;
    background: linear-gradient(180deg, rgba(0, 0, 37, 0) 0%, #000025 100%);
    background-blend-mode: multiply;
}

.py-hero-section .container {
    position: relative;
    z-index: 2;
}

.custom-op-home .py-hero-banner img {
    opacity: 0.75;
}

.custom-op-about .py-hero-banner img {
    opacity: 0.50;
}

.custom-op-tech .py-hero-banner img {
    opacity: 0.50;
}

.py-hero-banner {
    position: absolute;
    inset: 0;
    /* opacity: 0.5; */
    z-index: -1;
    overflow: hidden;
}

.py-hero-banner::before {
    position: absolute;
    content: '';
    inset: 0;
    background: rgba(0, 0, 37, 0.4);
}

.py-every-stage-single-card-img {
    width: 49px;
    height: 49px;
}

.py-micro-led-card-img {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

#img-hidden {
    display: none;
}

.py-hero-banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    will-change: transform;
    /* object-position: bottom; */
}

.hero-wrapper {
    height: 95.5dvh;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: flex-end;
    padding-bottom: 81px;
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.hero-wrapper.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.hero-wrapper .hero-left {
    max-width: 617px;
    width: 100%;
}

.hero-wrapper .hero-left .hero-title {
    display: flex;
    flex-direction: column;
    gap: 10px;
}



.hero-wrapper .hero-left .hero-title h1 {
    line-height: var(--lh-110);
}

/* Hero Section End */

/* Footer Start */

.py-footer-top {
    padding-top: 48px;
    padding-bottom: 93px;
    background-color: var(--Colors-Theme);
    position: relative;
}

.py-footer-top::after {
    position: absolute;
    content: '';
    top: 0;
    bottom: 0;
    right: 0;
    max-width: 906px;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, rgba(95, 43, 247, 0) 30.4%, #5F2BF7 96.48%);
    z-index: 1;
}

.py-footer-wrapper {
    display: flex;
    gap: 24px;
    position: relative;
    z-index: 2;
}

.py-footer-wrapper .py-f-logo {
    max-width: 440px;
    width: 100%;
}

.py-footer-wrapper .py-f-logo .py-footer-logo {
    width: 130px;
    height: auto;
    display: flex;
}

.py-footer-wrapper .py-f-logo .py-footer-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.py-f-links {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: auto;
    column-gap: 24px;
    row-gap: 24px;
    width: 100%;
}

.py-f-links .py-footer-manu {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.py-f-links .py-footer-manu p {
    font-size: var(--fz-15);
    line-height: var(--lh-130);
}

.py-f-links .py-footer-manu ul {
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.py-f-links .py-footer-manu ul li a {
    display: flex;
    gap: 3px;
    opacity: 1;
}

.py-f-links .py-footer-manu ul li {
    opacity: 1;
    transition: all .2s ease;
}


.py-f-links .py-footer-manu ul li:hover:not(:has(span)):not(:has(.py-addr)) {
    opacity: 0.5;
    transition: all .2s ease;
}

.py-f-links .py-footer-manu ul li a span {
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s ease;
}

.py-f-links .py-footer-manu ul li a:hover span {
    transform: translate(2px, -2px);
    transition: all .3s ease;
}

.py-f-links .py-footer-manu ul li .py-addr {
    color: var(--Colors-White---Muted-Text);
}

.py-footer-bottom {
    background-color: var(--Colors-Theme);
    padding-top: 36px;
    padding-bottom: 42px;
    position: relative;
}

.py-footer-bottom::after {
    position: absolute;
    content: '';
    max-width: 737px;
    width: 100%;
    height: 100%;
    z-index: 1;
    top: 0;
    left: 0;
    bottom: 0;
    background: linear-gradient(265.79deg, rgba(95, 43, 247, 0) 30.4%, #5F2BF7 96.48%);
}

.py-footer-b-wrapper {
    position: relative;
    z-index: 2;
}

.py-footer-b-wrapper .py-f-b-copy {
    display: flex;
    gap: 80px;
    flex-wrap: wrap;
}

.py-footer-b-wrapper .py-f-b-copy span {
    font-size: 12px;
    color: var(--Colors-White---Muted-Text);
}

.py-footer-b-wrapper .py-f-b-copy span a {
    font-size: 12px;
    color: var(--Colors-White---Muted-Text);
}

/* Footer End */


/* Technology Section Start */

.py-tech-section {
    padding: 145px 0 96px 0;
    display: flex;
    flex-direction: column;
    gap: 62px;
    position: relative;
}

.py-tech-section::after {
    position: absolute;
    content: '';
    bottom: 0;
    right: 0;
    max-width: 1151px;
    width: 100%;
    height: 683px;
    background: linear-gradient(140deg, rgba(95, 43, 247, 0) 51.4%, #5F2BF7 179.28%);
}

.py-tech-top h3 {
    color: var(--Colors-White---Muted-Text);
    max-width: 672px;
    width: 100%;
}

.py-tech-top h3 span {
    color: var(--text-white);
}

.py-tech-bottom {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto;
    column-gap: 24px;
    row-gap: 24px;
    position: relative;
    z-index: 2;
    margin-top: 40px;
}

.py-tech-bottom .py-tech-right {
    display: flex;
    align-items: center;
    justify-content: center;
}

.py-tech-bottom .py-tech-right .section-title {
    max-width: 440px;
    width: 100%;
}

.py-tech-bottom .py-tech-left .py-tech-img-top {
    max-width: 200px;
    width: 100%;
    display: flex;
    justify-content: end;
    height: 310px;
    margin-left: auto;
    background-color: #000;
}

.py-tech-bottom .py-tech-left .py-tech-img-top img {
    margin-left: auto;
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.py-tech-bottom .py-tech-left .py-tech-img-bottom {
    max-width: 472px;
    width: 100%;
    height: 587px;
    background: #000;
}

.py-tech-bottom .py-tech-left .py-tech-img-bottom img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.py-tech-img-top,
.py-tech-img-bottom {
    overflow: hidden;
}

@media screen and (max-width: 1199px) {
    .py-tech-bottom {
        grid-template-columns: 1fr;
    }
}

/* Technology Section End */


/* Optical Computer Section Start */

.py-opt-section {
    padding: 96px 0 192px 0;
}

.py-optical-com-right-image {
    width: 50%;
    height: 100%;
}

.py-optical-com-right-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.py-optical-com-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    height: 669px;
}

.py-optical-com-left {
    width: 50%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 45px;
}

.py-optical-com-left .section-title {
    max-width: 440px;
    width: 100%;
}

.py-optical-com-left .sub-content p {
    font-size: var(--fz-19);
}

.py-optical-com-left .py-optical-com-btn {
    max-width: 440px;
    width: 100%;
    display: flex;
    align-items: flex-start;
}




/* Optical Computer Section End */

/* Total Process Section Start */
.py-total-p-wrapper {
    position: relative;
}

.py-total-process-sec .container-fluid {
    padding: 0;
}

.py-total-p-wrapper {
    height: 813px;
    overflow: hidden;
    padding: 36px;
    position: relative;
}

.py-total-p-image {
    position: absolute;
    inset: 0;
    z-index: 1;
    opacity: 0.8;
}

.py-total-p-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top 20%;
}

.py-total-process-image-content {
    max-width: 556px;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.15);
    padding: 42px 80px 29px 36px;
    backdrop-filter: blur(120px);
    display: flex;
    flex-direction: column;
    gap: 88px;
    position: relative;
    z-index: 2;
}

.py-total-process-image-content h2 {
    line-height: 100%;
}

.animate-expand-card {
    transform-origin: top left;
}

.animate-expand-img {
    transform-origin: bottom right;
}

.py-total-process-image-content p {
    font-size: var(--fz-19);
    color: var(--text-white);
    font-weight: var(--fw-400);
    line-height: var(--lh-130);
}

/* Total Process Section End */

/* Total Process Card Content Section Start */
.py-total-p-card-sec {
    background-color: var(--Colors-Theme);
}

.bg-color {
    padding-top: 45px;
    padding-bottom: 35px;
    background: linear-gradient(100deg, rgba(0, 0, 0, 0) 67%, rgba(43, 247, 246, 0.55) 100%);
    width: 100%;
    height: 100%;
}

.py-total-p-card-wrapper {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: auto;
    gap: 24px;
}

.py-totpa-p-card .gsap-reveal-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    max-width: 324px;
    width: 100%;
}

.py-totpa-p-card p {
    font-size: var(--fz-19);
}

.py-total-p-btn-sec {
    background-color: var(--Colors-Theme);
}

.bg-dark-purple {
    padding: 42px 0 45px 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(279deg, rgba(0, 0, 0, 0) 65%, rgba(95, 43, 247, 0.55) 100%);
}

/* Total Process Card Content Section End */


/* News page styling starts */

/* News & Insight section styling starts */

.py-news-insight-section {
    margin-top: 100px;
    padding: 186px 0 192px 0;
}

.py-news-load-more {
    margin-top: 90px;
}

.insight-small-card a h6 {
    line-height: var(--lh-130);
}

.py-news-card-main-wrapper {
    display: flex;
    flex-direction: column;
    gap: 176px;
    position: relative;
}

/* .py-news-gradient-div {
  position: absolute;
  width: 1151px;
  height: 683px;
  transform: rotateY(-180deg);
  top: 420px;
  right: 0px;
  background: linear-gradient(
    228.75deg,
    rgba(41, 90, 242, 0) 51.4%,
    #295af2 179.28%
  );
  z-index: -1;
} */

.py-top-article-wrapper {
    position: relative;
}

.py-top-article-wrapper .container {
    position: relative;
    z-index: 2;
}

.py-top-article-wrapper::before {
    position: absolute;
    content: '';
    bottom: -92px;
    right: 0;
    max-width: 1151px;
    width: 100%;
    height: 683px;
    background: linear-gradient(150deg, rgba(41, 90, 242, 0) 51.4%, #295AF2 179.28%);
    z-index: 1;
}


.py-news-insight-img-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto;
    column-gap: 24px;
    row-gap: 24px;
}

.py-news-insight-left {
    display: flex;
    flex-direction: column;
    gap: 18px;
    transition: all .5s ease;
}

.py-news-insight-left img {
    width: 100%;
    height: auto;
    transition: all .5s ease;
}

.py-news-insight-left:hover img {
    transform: scale(1.1);
    transition: all .5s ease;
}

.insight-content {
    display: flex;
    gap: 24px;
}

.insight-content .small-title {
    display: flex;
    gap: 24px;
}

.insight-content p {
    font-size: var(--fz-14);
    font-weight: var(--fw-500);
    line-height: var(--lh-140);
    color: var(--Colors-White---Muted-Text);
    text-transform: uppercase;
    font-family: var(--fonts-Mono);
}

.author-card p {
    font-size: var(--fz-15);
    font-weight: var(--fw-400);
    line-height: var(--lh-130);
    color: var(--Colors-White---Muted-Text);
    font-family: var(--fonts-TTHoves) !important;
    text-transform: none;
}

.py-news-insight-right {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto;
    column-gap: 24px;
    row-gap: 24px;
}

.insight-small-card {
    display: flex;
    flex-direction: column;
    gap: 17px;
}

.insight-small-card:hover img {
    transform: scale(1.1);
    transition: all .5s ease;
}

.py-news-img {
    overflow: hidden;
    width: 100%;
    height: 324px;
}

.py-news-insight-left .py-news-img {
    height: auto;
}

.insight-small-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: all .5s ease;
}

/* News & Insight section styling ends */

/* News & Insight Cards section styling starts */

.py-cards-row-wrapper {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: auto;
    column-gap: 24px;
    row-gap: 192px;
}

/* News & Insight Cards section styling ends */

/* News page styling ends */

/* Privacy & security page styling starts */

.py-privacy-security-page-section {
    position: relative;
    margin-top: 100px;
}

.py-privacy-title-wrapper {
    padding: 192px 0 96px 0;
    position: relative;
}

.py-privacy-title-wrapper::after {
    position: absolute;
    content: '';
    right: 0;
    bottom: 0;
    top: 0;
    max-width: 1151px;
    width: 100%;
    height: 100%;
    background: linear-gradient(150deg, rgba(95, 43, 247, 0) 51.4%, #5F2BF7 179.28%);
}

.py-privacy-security-page-content {
    max-width: 50%;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 96px;
    padding: 48px 0 192px 0;
}

.py-privacy-heading {
    display: flex;
    flex-direction: column;
    gap: 96px;
}

.py-privacy-details {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.py-privacy-details p,
.py-privacy-details p>a {
    font-size: var(--fz-15);
    line-height: var(--lh-130);
    font-weight: var(--fw-400);
}

.py-privacy-details h5 {
    color: var(--text-white);
    opacity: 0.8;
    margin-top: 15px;
}

.py-privacy-heading p {
    text-transform: uppercase;
    font-family: var(--fonts-Mono);
    font-size: var(--fz-14);
    line-height: var(--lh-140);
}

.py-privacy-details p>a {
    opacity: 0.8;
}

/* Privacy & security page styling starts */

/* Latest From Plessey Section Start */
.py-latest-from-sec {
    background-color: var(--Colors-Theme);
    padding-bottom: 262px;
    padding-top: 96px;
    position: relative;
}

.py-latest-from-sec::after {
    position: absolute;
    content: '';
    max-width: 557px;
    width: 100%;
    height: 960px;
    left: 0;
    bottom: 0;
    background: linear-gradient(-180deg, rgba(43, 247, 246, 0) 52.03%, rgba(43, 247, 246, 0.75) 162.25%);
}

.py-latest-from-wrapper {
    position: relative;
    z-index: 2;
}

.py-latest-from-title .gsap-reveal-inner {
    display: flex;
    flex-direction: column;
    gap: 45px;
    margin-bottom: 94px;
}

.py-latest-from-card-tag {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 24px;
}

.py-latest-from-card-date span {
    color: #FFFFFF80;
}

.py-latest-from-card-link a {
    color: var(--text-white);
    font-size: var(--fz-19);
    font-weight: var(--fw-400);
}

.py-latest-from-single-card {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.py-latest-from-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: auto;
    gap: 24px;
}

/* Latest From Plessey Section End */

/* Ready To Discuss Section Start */
.py-ready-to-diss-sec {
    background-color: var(--bg-body);
    padding-top: 183px;
    padding-bottom: 48px;
}

.py-ready-to-diss-wrapper {
    max-width: 556px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 44px;
}

.py-ready-to-diss-wrapper h2 {
    line-height: 100%;
}


.py-latest-from-card-inner-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* Ready To Discuss Section End */

/* New article top section styling starts */
.py-news-article-top-section {
    margin-top: calc(100px + 192px);
    padding: 0 0 192px 0;
    display: flex;
    flex-direction: column;
    gap: 192px;
    position: relative;
}

.py-news-article-top-section::after {
    position: absolute;
    content: '';
    max-width: 1151px;
    width: 100%;
    height: 683px;
    bottom: 0px;
    left: 0px;
    background: linear-gradient(210deg,
            rgba(41, 90, 242, 0) 51.4%,
            #5F2BF7 179.28%);
    z-index: -1;
}

.py-news-article-content-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto;
    column-gap: 24px;
    row-gap: 24px;
    gap: 24px;
}

.py-news-article-left img {
    width: 100%;
}

.py-news-article-right {
    display: flex;
    flex-direction: column;
    gap: 96px;
}

.news-article-top-right {
    display: flex;
    flex-direction: column;
    gap: 81px;
}

.news-article-top-right h1 {
    line-height: var(--lh-110);
}

.author-card {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.author-card img {
    width: 94px;
    height: 140px;
    object-fit: cover;
}

.author-card img {
    width: 94px;
    height: 140px;
}

.news-article-bottom-right h6 {
    padding-top: 24px;
    padding-bottom: 24px;
    font-size: var(--fz-15);
}

.news-article-bottom-right p {
    padding-bottom: 24px;
    color: var(--Colors-White---Paragraph);
    font-size: var(--fz-15);
}

.news-article-bottom-right ul {
    padding: 12px;
}

.news-article-bottom-right li {
    list-style-type: disc;
    color: var(--Colors-White---Paragraph);
    padding-top: 12px;
    font-size: var(--fz-15);
    font-weight: var(--fw-400);
}

.quote {
    padding: 24px;
    border-left: 1px solid var(--colors-white-15);
}

.quote p {
    padding: 0px;
}


/* New article top section styling ends */

/* News article section styling starts */
.py-news-article-reading-section {
    display: flex;
    flex-direction: column;
    gap: 192px;
    position: relative;
    padding: 48px 0 192px 0;
}

/* News article section styling ends */

/* News article page styling ends */

/* Spirit Section Start */

.py-spirit-section {
    position: relative;
}

.py-spirit-section .py-tech-bottom {
    position: relative;
    padding: 96px 0 192px 0;
    z-index: 2;
}

.py-spirit-section::after {
    position: absolute;
    content: '';
    right: 0;
    bottom: 0;
    top: 0;
    max-width: 476px;
    width: 100%;
    height: 100%;
    background: linear-gradient(230.35deg, rgba(95, 43, 247, 0) 48.13%, rgba(95, 43, 247, 0.75) 124.57%);
    z-index: -1;
    display: none;
}


.py-spirit-section .py-tech-bottom::after {
    position: absolute;
    content: '';
    right: 0;
    bottom: 0;
    top: 0;
    max-width: 476px;
    width: 100%;
    height: 100%;
    background: linear-gradient(230.35deg, rgba(95, 43, 247, 0) 48.13%, rgba(95, 43, 247, 0.75) 124.57%);
    z-index: -1;
}

/* Spirit Section End */

.py-who-we-are-section {
    position: relative;
    padding: 96px 0 192px 0;
}

.py-who-we-are-section::after {
    position: absolute;
    content: '';
    max-width: 1196px;
    width: 100%;
    height: 513px;
    top: 0;
    right: 0;
    background: linear-gradient(25deg, rgba(95, 43, 247, 0) 51.4%, #5F2BF7 179.28%);
}

.py-who-we-are-section .sub-content p {
    font-size: var(--fz-15);
}

/* Text Content Section Start */

.py-t-content-section {
    padding: 48px 0 179px 0;
    background-color: var(--Colors-Theme);
}

.py-t-title {
    max-width: 851px;
    width: 100%;
}

.py-t-title h3 {
    color: var(--Colors-White---Muted-Text);
}

.py-t-title h3 span {
    color: var(--text-white);
}

/* Text Content Section End */

/* Approch Slider Start */

.py-ap-slider {
    padding: 48px 0 192px 0;
    display: flex;
    flex-direction: column;
    gap: 96px;
    overflow: hidden;
    background-color: var(--Colors-Theme);
    position: relative;
}

.py-ap-slider-wrapper {
    display: block;
    gap: 24px;
    cursor: grab;
    touch-action: pan-y;
    will-change: transform;
}

.py-ap-slider .splide__track {
    overflow: visible;
}

.py-ap-slider .splide__list {
    overflow: visible;
}

.py-ap-slider .splide__slide {
    overflow: visible;
    max-width: 1136px;
    width: 100%;
}

.py-ap-slider-wrapper:active {
    cursor: grabbing;
}

.splide__slide .py-ap-card {
    flex-shrink: 0;
    height: 639px;
    padding: 18px;
    position: relative;
    display: flex;
    align-items: end;
}

.splide__slide .py-ap-card .py-ap-card-bg {
    position: absolute;
    inset: 0;
}

.splide__slide .py-ap-card .py-ap-card-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.splide__slide .py-ap-card .py-ap-card-content {
    position: relative;
    z-index: 1;
    max-width: 440px;
    width: 100%;
    background: var(--colors-dark-15);
    backdrop-filter: blur(120px);
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 72px;
}

.splide__slide .py-ap-card .py-ap-card-content .sub-content p {
    font-size: var(--fz-15);
}

.py-slider-control {
    margin-top: 24px;
    display: flex;
    align-items: center;
    gap: 24px;
}

.py-slider-control .py-slide-prev button,
.py-slider-control .py-slide-next button {
    background-color: transparent;
    outline: none;
    border: none;
    box-shadow: none;
    width: 14px;
    height: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.py-slider-control .pagination {
    display: flex;
    gap: 18px;
    align-items: center;
    padding-left: 0;
    list-style: none;
    margin-bottom: 0;
}

.py-slider-control .pagination .pagination-dot {
    width: 8px;
    height: 8px;
    background-color: var(--bg-white);
    opacity: 0.5;
    border-radius: 50%;
}

.py-slider-control .pagination .pagination-dot.active {
    opacity: 1;
}

/* Approch Slider End */

/* Contact us page styling starts */

/* Get in touch section styling section starts */

.py-cont-main-wrapper {
    margin-top: 100px;
    padding: 162px 0 96px 0;
    position: relative;
}

.py-cont-main-wrapper .container {
    position: relative;
    z-index: 2;
}

.py-cont-main-wrapper::after {
    position: absolute;
    content: '';
    max-width: 1151px;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: linear-gradient(214.75deg, rgba(95, 43, 247, 0) 51.4%, #5F2BF7 179.28%);
}


.py-contact-details-contact {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto;
    column-gap: 24px;
    row-gap: 24px;
}

.get-in-touch-details {
    display: flex;
    flex-direction: column;
    gap: 72px;
}

.get-in-touch-details h5 {
    line-height: var(--lh-130);
}

.get-in-touch-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto;
    column-gap: 24px;
    gap: 24px;
}

.get-in-touch-with {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-width: 208px;
    border-top: 1px solid var(--colors-white-15);
}

.get-in-touch-with p {
    font-size: var(--fz-14);
    font-weight: 500;
    line-height: 140%;
    text-transform: uppercase;
    padding-top: 13px;
    font-family: var(--fonts-Mono);
}

.get-in-touch-with strong {
    color: var(--text-white);
    font-size: var(--fz-15);
    font-weight: var(--fw-400);
    line-height: var(--lh-140);
}

/* Get in touch section styling section ends */

/* Contact form img wrapper styling starts */

.py-contact-image-wrapper {
    padding: 66px 0px;
}

.py-contact-image-wrapper .container {
    padding: 0;
}

.py-img-wrapper {
    position: relative;
    height: 712px;
    display: flex;
    align-items: end;
    padding: 24px;
}

.py-img-cover {
    position: absolute;
    inset: 0;
    z-index: 1;
    opacity: 0.9;
}

.py-img-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.above-img-card {
    max-width: 324px;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(120px);
    display: flex;
    padding: 60px 12px 12px 12px;
    flex-direction: column;
    gap: 96px;
    position: relative;
    z-index: 2;
}

.above-img-card P {
    text-transform: uppercase;
    font-weight: var(--fw-500);
    color: var(--text-white);
    font-family: var(--fonts-Mono);
    font-size: var(--fz-15);
}

/* Contact form img wrapper styling ends */

/* Contact form section styling section starts */
.py-contact-form-section {
    position: relative;
    background: var(--Colors-Theme);
}

.py-con-form-main {
    padding: 24px 0 96px 0;
}

.py-contact-form-title-wrap-main {
    padding: 96px 0 96px 0;
    position: relative;
}

.py-contact-form-title-wrap-main .container {
    position: relative;
    z-index: 2;
}

.py-contact-form-title-wrap-main::after {
    position: absolute;
    content: '';
    max-width: 1448px;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, rgba(95, 43, 247, 0) 30.4%, #5F2BF7 96.48%);
    top: 0;
    right: 0;
}


.py-c-form-title-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto;
    column-gap: 24px;
    row-gap: 24px;
}


.py-contact-form-details {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto;
    column-gap: 24px;
    row-gap: 24px;
}

.py-contact-left-part {
    width: 50%;
}

.py-contact-left-part p {
    font-size: 11px;
    font-weight: var(--fw-500);
    color: var(--text-accent);
    text-transform: uppercase;
}

.py-contact-right-part {
    grid-column: 2/3;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 35px;
    margin-left: auto;
}

.contact-form {
    display: flex;
    flex-direction: column;
    gap: 46px;
}

.contact-form input {
    width: 100%;
    padding: 14.5px 0px;
    background: none;
    border: none;
    border-bottom: 1px solid var(--text-white);
    opacity: 0.5;
}

.contact-form input[type="text"],
.contact-form textarea[name="message"] {
    color: var(--text-white);
    font-size: var(--fz-15);
    font-weight: var(--fw-400);
    line-height: var(--lh-130);

    /* iOS Safari fix */
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
    outline: none;
}

.contact-form input:focus,
.contact-form textarea:focus {
    color: var(--text-white);
    font-size: var(--fz-19);
    font-weight: var(--fw-400);
    line-height: var(--lh-130);
    outline: none;
    border-bottom: 1px solid var(--text-white);
    opacity: 1;

    /* iOS Safari fix */
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
    outline: none;
}

.contact-form input::placeholder,
.contact-form textarea::placeholder {
    font-size: var(--fz-15);
    font-weight: var(--fw-400);
    line-height: var(--lh-130);
    color: var(--text-white);
}

.contact-form input:focus::placeholder,
.contact-form textarea:focus::placeholder {
    color: var(--text-white);
}

.contact-form textarea {
    width: 100%;
    height: 200px;
    padding-top: 12px;
    background: none;
    border: none;
    border-bottom: 1px solid var(--text-white);
    color: var(--text-white);
    resize: none;
    opacity: 0.5;
}

/* Contact form section styling section ends */

/* Contact us page styling ends */


.main-margin-top {
    margin-top: 100px;
}

/* Every Stage Section Start */
.every-stage-sec {
    padding-top: 96px;
    padding-bottom: 192px;
    position: relative;
    z-index: 1;
}

.every-stage-sec::after {
    content: '';
    max-width: 1151px;
    width: 100%;
    height: 517px;
    position: absolute;
    bottom: 0;
    z-index: -1;
    background: linear-gradient(206.75deg, rgba(95, 43, 247, 0) 50.4%, #5F2BF7 179.28%);
}

.every-stage-sec .section-title {
    max-width: 634px;
}

.every-stage-sec .section-title .gsap-reveal-inner {
    display: flex;
    flex-direction: column;
    gap: 21px;
}

.every-stage-sec .section-title .sub-content p {
    font-size: var(--fz-24);
}

.py-every-stage-single-card {
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding-left: 18px;
    border-left: 1px solid #FFFFFF40;
}

.py-every-stage-single-card .gsap-reveal-inner {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.py-every-stage-single-card-detail {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.py-every-stage-single-card-text {
    display: flex;
    flex-direction: column;
    gap: 19px;
}

.py-every-stage-single-card-text p {
    font-size: var(--fz-19);
    color: #FFFFFFD9;
}

.py-every-stage-inner-card {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto;
    column-gap: 24px;
    row-gap: 131px;
    max-width: 1019px;
    margin-left: auto;
}

.every-stage-wrapper {
    display: flex;
    flex-direction: column;
    gap: 96px;
}


/* Every Stage Section End */

/* Leadership Team Section Start */
.py-leadership-team-sec {
    padding-top: 96px;
    padding-bottom: 192px;
    position: relative;
    z-index: 0;
}

.py-leadership-team-sec::after {
    content: '';
    width: 488px;
    height: 960px;
    position: absolute;
    bottom: 0;
    left: 30%;
    z-index: -1;
    background: linear-gradient(117deg, rgba(95, 43, 247, 0) 48.13%, rgba(95, 43, 247, 0.75) 124.57%);

}

.py-leadership-team-left .section-title .sub-content p {
    font-size: var(--fz-24);
}

.py-leadership-team-left .section-title {
    max-width: 616px;
}

.py-leadership-team-left {
    width: 100%;
}

.py-leadership-team-profile p {
    font-size: var(--fz-19);
}

.py-leadership-team-btn a {
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 10px;
}

.py-leadership-team-info {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.py-leadership-team-image {
    height: 312px;
    overflow: hidden;
    transition: all .5s ease;
}

.py-leadership-team-info:hover .py-leadership-team-image img {
    transform: scale(1.1);
    transition: all .5s ease;
}

.py-leadership-team-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: all .5s ease;
}

.py-leadership-team-right {
    width: 50%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto;
    column-gap: 24px;
    row-gap: 92px;
}

.py-leadership-team-wrapper {
    display: flex;
    align-items: start;
    gap: 24px;
}



.py-leadership-team-btn a {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    transition: all .3s ease;
    line-height: 0;
}



.py-leadership-team-btn a:hover .card-arrow {
    transform: translate(2px, -2px);
    transition: all .3s ease;
}





/* Leadership Team Section End */


/* Micro LED Section Start */
.py-micro-led-wrapper {
    display: flex;
    align-items: stretch;
    gap: 24px;
}

.py-micro-led-left {
    width: 50%;
    /* height: -webkit-fill-available; */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.py-micro-led-right {
    width: 50%;
    display: flex;
    flex-direction: column;
    gap: 84px;
}

.py-micro-led-image {
    max-width: 500px;
    height: 500px;
}

/* .py-micro-led-image{
    max-width: 683px !important;
    height: 762px !important;
    width: 100% !important; 
}

.py-micro-led-image img{
    transform: translate(40%);
} */

.py-micro-led-image img {
    width: 100%;
    height: 100%;
}

.py-micro-led-crads .gsap-reveal-inner {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto;
    column-gap: 24px;
    row-gap: 72px;
}

.py-micro-led-single-card {
    border-top: 1px solid #FFFFFF40;
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding-top: 11px;

    position: relative;
    overflow: hidden;
}

.py-micro-card-v2 {
    gap: 45px;
}

.py-micro-led-single-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: auto;
    height: 1px;
    width: 0;
    background: linear-gradient(90deg, #000025 0%, #295AF2 100%);
    transition: all 0.4s ease;
}

.py-micro-led-card-text p {
    font-size: var(--fz-15);
}

.py-micro-led-card-text {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.py-micro-card-v2 .py-micro-led-card-text {
    gap: 29px;
}

.py-micro-led-single-card:hover::before {
    width: 100%;
    left: 0;
    right: auto;
}

.py-micro-led-single-card:not(:hover)::before {
    width: 0;
    left: auto;
    right: 0;
}

.py-optical-photon-sec {
    position: relative;
    z-index: 0;
}

.py-micro-bg {
    position: absolute;
    max-width: 683px;
    width: 100%;
    height: 762px;
    bottom: 96px;
    right: 0;
}

.py-micro-bg img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.py-optical-photon-sec::after {
    content: '';
    max-width: 1151px;
    width: 100%;
    height: 983px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background: linear-gradient(-30.75deg, rgba(95, 43, 247, 0) 60.4%, #5F2BF7 179.28%);
}

.py-optical-photon-sec .py-micro-led-wrapper {
    flex-direction: row-reverse;
}

.py-optical-photon-sec .py-micro-led-left {
    align-items: flex-end;
}


/* Micro LED Section End */


/* timeline section start */
/* ===============================
   TIMELINE SECTION
================================ */

.py-timeline-section {
    position: relative;
    background-color: var(--Colors-Theme);
    overflow: hidden;
}

.py-timeline-section::after {
    position: absolute;
    content: '';
    top: 0;
    right: 0;
    max-width: 100%;
    width: 100%;
    height: 350px;
    background: linear-gradient(90deg, rgba(95, 43, 247, 0) 30.4%, rgba(95, 43, 247, 0.7) 96.48%);
    z-index: 1;
}

.py-timeline-section::before {
    position: absolute;
    content: '';
    bottom: 0;
    left: 0;
    max-width: 663px;
    width: 100%;
    height: 238px;
    background: linear-gradient(265.79deg, rgba(95, 43, 247, 0) 30.4%, rgba(95, 43, 247, 0.7) 96.48%);
    z-index: 2;
}

/* container must not clip animation */
.py-timeline-section>.container {
    overflow: visible;
    position: relative;
    z-index: 3;
}

.py-timeline-spacer {
    height: 0;
}

/* ===============================
   GSAP ANIMATION TRACK
================================ */

.py-timeline-track {
    display: flex;
    flex-direction: column;
    width: max-content;
    /* transform: translateX(0); */
    /* will-change: transform; */
}

/* ===============================
   TIMELINE YEAR AREA
================================ */

.py-timeline-year {
    position: relative;
    padding-top: 48px;
    width: max-content;
}

.py-timeline-title {
    margin-bottom: 48px;
}

.py-main-timeline-wrapper {
    margin-top: 192px;
    overflow: visible;
}

.timeline-top {
    display: flex;
    align-items: flex-end;
    gap: 24px;
    padding-bottom: 16px;
    min-width: max-content;
}

.timeline-line {
    width: 1px;
    height: 12px;
    background-color: var(--bg-white);
    flex-shrink: 0;
}

.timeline-line.tall {
    height: 48px;
    background-image: linear-gradient(180deg,
            var(--Colors-Theme),
            #ffffff40);
    position: relative;
}

.badge-text {
    font-family: var(--fonts-Mono);
    font-size: var(--fz-14);
    line-height: 1.5em;
    text-transform: uppercase;
    font-weight: 500;
    color: var(--text-white);
}

.badge-text.timeline-marker-text {
    position: absolute;
    top: -8px;
    left: 50%;
    transform: translate(-50%, -100%);
    white-space: nowrap;
    pointer-events: none;
}

.py-timeline-cards-wrapper {
    position: relative;
    padding-top: 48px;
    padding-bottom: 96px;
    width: max-content;
    overflow: visible;
}

.text-grid-quarters {
    display: flex;
    gap: 24px;
    min-width: max-content;
    margin-left: 74px;
}

.text-grid-item {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    max-width: 300px;
    width: 100%;
}

.text-grid-item span {
    color: var(--text-white);
    font-size: var(--fz-15);
    font-weight: var(--fw-400);
    line-height: var(--lh-130);
}

.text-grid-item p {
    color: var(--Colors-White---Muted-Text);
    font-size: var(--fz-15);
    font-weight: var(--fw-400);
    line-height: var(--lh-130);
}

.timeline-top,
.text-grid-quarters {
    will-change: transform;
}

/* timeline section end */

/* Career single page styling starts */

/* Career single location section styling starts */

.py-career-single-location-section {
    position: relative;
    margin-top: 100px;
}

.py-career-single-location-section .container {
    position: relative;
    z-index: 2;
}

.py-single-location-title-wrapper {
    padding: 192px 0 96px 0;
    position: relative;
}

.py-single-location-title-wrapper::after {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    top: 0;
    max-width: 1151px;
    width: 100%;
    height: 100%;
    background: linear-gradient(228.75deg,
            rgba(95, 43, 247, 0) 51.4%,
            #5f2bf7 179.28%);
}

.py-privacy-security-page-content {
    max-width: 50%;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 96px;
    padding: 48px 0 192px 0;
}

.py-single-location-heading {
    display: flex;
    max-width: 50%;
    flex-direction: column;
    gap: 80px;
}

.py-career-single-sub-head {
    display: flex;
    gap: 24px;
}

.py-career-single-sub-head span {
    font-size: var(--fz-14);
    font-weight: var(--fw-500);
    line-height: var(--lh-140);
    color: var(--Colors-White---Muted-Text);
    text-transform: uppercase;
    font-family: var(--fonts-Mono);
}

.py-single-sub-head-left {
    display: flex;
    align-items: center;
    gap: 6px;
    transition: all .3s ease;
}

.py-single-sub-head-left .ar-left-icon {
    width: 14px;
    height: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.py-single-location-heading h1 {
    line-height: var(--lh-110);
}

.py-single-sub-head-left img {
    width: 10px;
    height: 10px;
}

.py-single-sub-head-left:hover svg {
    transform: translate(-2px, -2px);
    transition: all .3s ease;
}

.py-single-sub-head-left p {
    font-size: var(--fz-14);
    font-weight: var(--fw-500);
    line-height: var(--lh-140);
    color: var(--text-white);
    text-transform: uppercase;
    font-family: var(--fonts-Mono);
}

.py-single-sub-head-left a {
    font-size: var(--fz-14);
    font-weight: var(--fw-500);
    line-height: var(--lh-140);
    color: var(--text-white);
    text-transform: uppercase !important;
    font-family: var(--fonts-Mono);
}

.py-single-faclities {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    position: relative;
    z-index: 99;
}

.py-single-faclities .location,
.py-single-faclities .basis {
    border-top: 1px solid var(--colors-white-15);
}

.py-single-faclities .location p,
.py-single-faclities .basis p {
    margin-top: 12px;
    color: var(--Colors-White---Muted-Text);
    font-size: var(--fz-14);
    font-weight: var(--fw-500);
    line-height: var(--lh-140);
    text-transform: uppercase;
    font-family: var(--fonts-Mono);
}

.py-single-faclities .location strong,
.py-single-faclities .basis strong {
    margin-top: 12px;
    color: var(--text-white);
    font-size: var(--fz-14);
    font-weight: var(--fw-500);
    line-height: var(--lh-140);
}

/* description details */

.py-description-details-content {
    max-width: 50%;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 114px;
    padding: 23px 0 48px 0;
}

.py-top-description-content h5 {
    line-height: var(--lh-130);
}

.py-bottom-description-content {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.py-bottom-description-content h6,
.py-bottom-description-content h2 {
    margin-top: 24px;
    line-height: var(--lh-130);
    color: var(--text-white);
    font-size: var(--fz-15);
}

.py-bottom-description-content p {
    color: var(--text-white);
    opacity: 0.8;
    font-size: var(--fz-15);
}

.py-bottom-description-content ul {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.py-bottom-description-content li {
    list-style-type: disc;
    color: var(--text-white);
    opacity: 0.8;
    font-size: var(--fz-15);
    font-weight: var(--fw-400);
}

.quote {
    padding: 24px;
    border-left: 1px solid var(--colors-white-15);
}

.quote p {
    padding: 0px;
    font-size: var(--fz-19);
    color: rgba(255, 255, 255, 1);
    opacity: 1;
    line-height: var(--lh-130);
}

/* Career single location section styling ends */

/* Career left form section starts */

.py-career-single-form-section {
    position: relative;
}

.py-career-single-form-wrapper {
    padding: 48px 0 192px 0;
    position: relative;
}

.py-career-single-form-wrapper::after {
    position: absolute;
    content: "";
    right: 0;
    bottom: 0;
    top: 0;
    max-width: 1151px;
    width: 100%;
    height: 634px;
    background: linear-gradient(392.75deg,
            rgba(95, 43, 247, 0) 51.4%,
            #5f2bf7 179.28%);
    z-index: 1;
}

.py-career-single-form-wrapper .container {
    position: relative;
    z-index: 2;
}

.py-career-single-form-details {
    max-width: 50%;
}

.py-contact-right-part h4 {
    line-height: var(--lh-130);
}

/* Career left form section ends */

/* Career single page styling ends */


/* Build The Feature Srection Start */
.py-build-feature-wrapper {
    padding: 188px 0 96px 0;
    display: flex;
    flex-direction: column;
    gap: 144px;
}

.py-build-feature-wrapper .py-contact-image-wrapper {
    padding: 0;
}

.py-build-feature-section .get-in-touch-details {
    row-gap: 39px;
    max-width: 556px;
}

.py-build-feature-section .get-in-touch-details h5 span {
    color: var(--Colors-White---Muted-Text);
}

/* Build The Feature Srection End */

/* Current Table Section Start */
.py-current-op-wrapper {
    background-color: var(--Colors-Theme);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.py-career-table-section {
    display: flex;
    flex-direction: column;
    gap: 96px;
}

.py-career-table-bottom-text p {
    font-size: var(--fz-15);
}

.py-career-table-bottom-text p span {
    color: var(--text-white);
}

.py-current-op-title {
    padding-bottom: 77px;
    position: relative;
    z-index: 0;
}

.py-current-op-title::after {
    content: '';
    width: 100%;
    height: 960px;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: -1;
    background: linear-gradient(90.79deg, rgba(95, 43, 247, 0) 40.4%, #5F2BF7 96.48%);
}

.py-current-op-title .section-title {
    gap: 24px;
    max-width: 531px;
}

.py-current-op-title .section-title .sub-content p {
    font-size: var(--fz-24);
}

.py-current-table table {
    width: 100%;
    border-collapse: collapse;
}

.py-current-table tr {
    border-top: 1px solid #FFFFFF40;
}

.py-current-table th {
    color: var(--text-white);
    font-weight: var(--fw-400);
    width: 400px;
}

.py-current-table th a {
    transition: all 0.3s ease;
    font-size: var(--fz-19);
}

.py-current-table th a:hover {
    color: var(--Colors-White---Muted-Text);
}

.py-current-table td {
    color: var(--Colors-White---Muted-Text);
    width: 235px;
}

.py-current-table td:last-child {
    width: auto;
}

.py-current-table th,
.py-current-table td {
    padding: 14px 0;
    text-align: left;
}

.py-current-table th {
    padding-right: 14px;
}

.py-current-table th:first-child,
.py-current-table td:first-child {
    text-align: left;
    width: 700px;
}


/* Mobile View */


/* Current Table Section End */

/* Benefit Section Start */
.py-benefit-wrapper .py-micro-led-right {
    width: 100%;
}

.py-benefit-wrapper .section-title {
    max-width: 499px;
}

.py-benefit-wrapper .section-title .sub-content p {
    font-size: var(--fz-24);
}

.py-benefit-wrapper .py-micro-led-crads {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto;
    column-gap: 24px;
    row-gap: 24px;
}

.py-benefit-wrapper .py-micro-led-card-text ul li {
    color: var(--Colors-White---Muted-Text);
    font-size: var(--fz-15);
}

.py-micro-card-v2 .gsap-reveal-inner {
    display: flex !important;
    flex-direction: column !important;
    gap: 48px !important;
}

.py-career-why-sec {
    position: relative;
    z-index: 0;
    padding-bottom: 192px;
    padding-top: 96px;
}

.py-career-why-sec::after {
    position: absolute;
    content: '';
    right: 0;
    bottom: 0;
    top: 0;
    max-width: 676px;
    width: 100%;
    height: 100%;
    background: linear-gradient(228.75deg, rgba(41, 90, 242, 0) 51.4%, #295AF2 179.28%);
    z-index: -1;
}

/* Benefit Section End */

/* Early Careers Section Start */
.py-early-career-section-2,
.py-early-career-section-1 {
    position: relative;
}

.py-early-career-section-2 .container,
.py-early-career-section-1 .container {
    position: relative;
    z-index: 0;
}

.py-early-career-section-2::after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: -1;
    background: linear-gradient(145.75deg, rgba(41, 90, 242, 0) 70.4%, #295AF2 179.28%);
}

.py-early-career-section-1::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background: linear-gradient(-394deg, rgba(41, 90, 242, 0) 64.4%, #295AF2 179.28%);
}

.w-bg-gred {
    position: relative;
}

.w-bg-gred::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background: var(--bg-body);
}


/* .py-leadership-team-btn .card-arrow{
    width: 14px;
    height: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.py-leadership-team-btn .card-arrow span{
    display: flex;
    align-items: center;
    justify-content: center;   
    width: 100%;
    height: 100%;
} */

.py-early-career-section-2 .py-optical-com-wrapper {
    height: auto;
}

.py-early-career-section-2 .py-optical-com-wrapper {
    flex-direction: row-reverse;
}

/* .py-early-career-section-2 .py-optical-com-wrapper .py-optical-com-left {
    align-items: flex-start;
} */

.py-early-career-section-1 .sub-content p,
.py-early-career-section-2 .sub-content p {
    font-size: var(--fz-15);
}

.sub-detail-content {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.sub-detail-content span {
    color: var(--text-white);
}

/* Early Careers Section End */

/* Graduate Section Start */
.py-gratuate-section .py-optical-com-wrapper {
    height: auto;
}

.py-gratuate-section .sub-content p {
    font-size: var(--fz-15);
}

.py-gratuate-section .py-optical-com-btn {
    gap: 24px;
}

/* .py-gratuate-section .py-optical-com-right-image {
    height: -webkit-fill-available;
} */

.py-total-process-image-content-text {
    display: flex;
    flex-direction: column;
    gap: 19px;
}

.py-total-process-image-content-text p {
    font-size: var(--fz-15);
    color: var(--Colors-White---Muted-Text);
}

/* Graduate Section End */

.py-leadership-team-overview p {
    font-size: var(--fz-15);
}

.py-leadership-team-btn a {
    font-family: var(--fonts-Mono);
    font-size: var(--fz-14);
}

.py-toggle-btn {
    display: none;
}

.toggle-header {
    display: none;
}


.py-timeline-section-small {
    display: none;
}



.timeline-wrap {
    grid-column-gap: calc(24px * 2);
    grid-row-gap: calc(24px * 2);
    flex-flow: column;
    display: flex;
}

.timeline-top {
    flex-flow: row;
    justify-content: space-between;
    align-items: flex-end;
    display: flex;
}

.text-grid-quarters1 {
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
}

.text-grid-item {
    flex-flow: column;
    display: flex;
}

.timeline-line {
    background-color: var(--bg-white);
    width: 1px;
    height: 12px;
}

.timeline-line.tall {
    background-image: linear-gradient(180deg, var(--Colors-Theme), var(--bg-white));
    height: 48px;
    position: relative;
}

.badge-text.timeline-marker-text {
    white-space: nowrap;
    width: auto;
    position: absolute;
    top: -6px;
    transform: translate(-50%, -100%);
}

.py-error-page .py-er-wrapper {
    height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 46px;
    position: relative;
}

.py-error-page .py-er-wrapper::after {
    position: absolute;
    content: '';
    height: 100%;
    max-width: 369px;
    width: 100%;
    right: 0;
    top: 0;
    bottom: 0;
    background: linear-gradient(245.75deg, rgba(41, 90, 242, 0) 51.4%, #295AF2 179.28%);
}

.py-error-page .py-er-wrapper .er-content h2 {
    color: var(--Colors-White---Muted-Text);
    line-height: var(--lh-110);
}










.contact-form input[type="submit"]:focus {

    font-size: inherit !important;

}





.input-btn {

    position: relative;

    display: flex !important;

    min-height: 97px;

    margin-bottom: 0px !important;

}



.input-btn .py-btn {

    position: absolute;

    bottom: 0;

    left: 0;

    top: 0;



}

.wpcf7 form .wpcf7-response-output {

    margin: 2em 0.5em 1em;

    padding: 0.2em 1em;

    border: 2px solid #00a0d2;

    color: white;

    font-size: 14px;

}



.input-inner .py-btn .wpcf7-submit {

    display: flex;

    align-items: flex-end;

    text-align: left;

    /* padding-left: 20px; */

    padding-right: 30px;

    padding-top: 57px;

}





.contact-form .input-inner {

    margin-bottom: 46px;

}



.contact-form input[type="submit"] {

    padding: 0;

    border: 0px;

    color: white;

    height: 100%;

    display: flex;

    opacity: 1;

}



.btn-blur span {

    display: flex;

}

.wpcf7-spinner {

    position: absolute;

}


.contact-form input {
    color: white !important;
}




.py-t-title .gsap-reveal-inner {
    display: flex;
    flex-direction: column;
    row-gap: 48px;
}

.py-t-content-bottom-text {
    max-width: 516px;
    font-size: var(--fz-19);
    font-weight: var(--fw-400);
    line-height: var(--lh-130);
    display: flex;
    flex-direction: column;
    row-gap: 19px;
}

.py-micro-led-cards-bottom-text .gsap-reveal-inner {
    max-width: 553px;
    display: flex;
    flex-direction: column;
    row-gap: 36px;
}

.py-micro-led-right {
    row-gap: 72px;
}

.py-micro-led-right .section-title {
    max-width: 556px;
    row-gap: 30px;
}

.py-micro-led-right .section-title .sub-content {
    row-gap: 19px;
}

.py-micro-led-right .py-micro-led-cards-bottom-text .gsap-reveal-inner {
    row-gap: 30px;
}

.py-micro-led-cards-bottom-inner-text p {
    font-size: var(--fz-19);
    font-weight: var(--fw-400);
    line-height: var(--lh-130);
}

.py-micro-led-cards-bottom-inner-text {
    display: flex;
    flex-direction: column;
    row-gap: 19px;
}

.py-micro-bg {
    max-width: 573px;
    height: 639px;
}

/* .py-new-intercon .section-title h3{
    color: var(--Colors-White---Muted-Text);
} */

.py-new-intercon {
    position: relative;
    z-index: 0;
}

.py-new-intercon::after {
    position: absolute;
    content: '';
    right: 0;
    bottom: 0;
    top: 0;
    max-width: 100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(30deg, rgba(41, 90, 242, 0) 63%, #295AF2 179.28%);
    z-index: -1;
}

.py-t-content-bottom-text-sec {
    padding-bottom: 96px;
}



.py-micro-led-crads-wrapper h5 {
    margin-bottom: 36px;
}




.py-micro-led-sec .section-title {
    max-width: 100%;
}

.py-micro-led-sec .section-title .sub-content {
    max-width: 558px;
}

.py-new-intercon .section-title {
    max-width: 556px;
}


.wpcf7-not-valid-tip {
    color: var(--text-white) !important;
}

.banner-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* makes video behave like background cover */
    object-position: center;
}




.input-inner select option {
    color: black;
    padding: 10px !important;
}

.input-inner select {
    padding: 14px 0px !important;
    color: var(--text-white);
    font-size: var(--fz-15);
    font-weight: var(--fw-400);
    line-height: var(--lh-130);
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 0;
    outline: none;
    width: 100%;
    padding: 14.5px 30px 14.5px 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8'%3E%3Cpath d='M1 1L7 7L13 1' stroke='white' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right center;
    border: none;
    border-bottom: 1px solid var(--text-white);
    opacity: 0.5;
}
 

.input-inner .wpcf7-select option {
    padding: 12px;
    text-indent: 20px;
}


/* Dropdown options list */
.input-inner .wpcf7-select option {
    font-size: 15px;
    color: #333;
    background: #f4f6ff;
     text-indent: 20px;
    line-height: 2.4; 
    
}

/* Selected option */
.input-inner .wpcf7-select option:checked {
    background: #8da1f6;
    color: #000000;
    padding: 20px;
}

/* Disabled / placeholder */






























.wpcf7-acceptance span label {
    display: flex;
    gap: 10px;
    align-items: baseline;
}

.wpcf7-acceptance span.wpcf7-list-item {
    margin: 0px;
}

.wpcf7-acceptance span.wpcf7-list-item {
    color: #93a6f6 !important;

}

.wpcf7-acceptance span.wpcf7-list-item a {
    opacity: 1;
    color: white;
}

.wpcf7-acceptance span label input {
    display: flex;
    width: fit-content;
    width: 16px;
    height: 14px;
    color: white !important;
    opacity: 0.5;
}

.wpcf7-acceptance input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    width: 15px;
    height: 15px;
    border: 2px solid #fff;
    border-radius: 3px;
    background: transparent;
    cursor: pointer;
    position: relative;
}

/* Checked state */
.wpcf7-acceptance input[type="checkbox"]:checked {
    background-color: #4c6ef5;
    /* blue background */
    border-color: #d7d7d8;
}

/* Checkmark */



.wpcf7-acceptance input[type="checkbox"] {
    appearance: auto;
    -webkit-appearance: checkbox;
    /* opacity: 1; */
}
.single-team-section.py-news-article-reading-section .py-top-article-wrapper::before {
    content: '';
   bottom: -192px;

}

.single-team-section.py-news-article-reading-section {
    display: flex;
    flex-direction: column;
    gap: 96px;

}

.single-artical-team-section .py-news-article-left img {
    width: auto;
}

.single-artical-team-section .py-news-article-right {
    display: flex;
    flex-direction: column;
    gap: 72px;

}

.single-artical-team-section h6{
    font-size: 48px;
}

.py-sub-content p{
        font-size: 48px;
}
.py-sub-content {
      margin-top: -12px;
}

.single-artical-team-section .py-single-faclities .location p,  .single-artical-team-section .py-single-faclities .basis p {
    margin-top: 13px;
    margin-bottom: 12px;
}

.single-artical-team-section .py-single-faclities .basis  strong a {
    display: flex;
     gap: 7px;
    align-items: center;
    transition: all .3s ease;

}
.single-artical-team-section .py-single-faclities .basis  strong a svg{
 transition: all .3s ease;
}

.single-artical-team-section .news-article-bottom-right p:last-child{
    padding-bottom: 0px;
}

.single-artical-team-section .py-single-faclities .basis  strong a:hover svg {
    transform: translate(2px, -2px);
    transition: all .3s ease;
}

.single-artical-team-section .news-article-bottom-right{
    max-width: 556px;
    width: 100%;
}

.py-current-table thead tr{
    border-top: 0;
}

.py-current-table thead tr th span{
    cursor: pointer;
}

.py-current-table thead tr th {
    font-weight: 500;
     font-size: 16px;

}

.py-privacy-details ol {

  
  color: #ffffff;

}

.py-privacy-details ol  li , .py-privacy-details ul  li{
     padding-left: 7px;

}

 .py-privacy-details ul{
       color: #ffffff;
 }

#career-table span img{
  margin-bottom: 10px;
    width: 23px;
}