:root{
        --primary:#0f172a;
        --secondary:#5f399c;
        --green:#22c55e;
        --text:#475569;
        --light:#f8fafc;
        --white:#ffffff;
        --border:#e2e8f0;
    }

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

    html{
        scroll-behavior:smooth;
    }

    body{
        font-family:'Inter',sans-serif;
        color:var(--primary);
        background:#fff;
        overflow-x:hidden;
    }

    .csr-page{
        width:100%;
        overflow:hidden;
    }

    /* SECTION */

    .csr-section{
        padding:100px 20px;
    }

    .csr-container{
        max-width:1280px;
        margin:auto;
    }

    /* HERO */

    .csr-hero{
        position:relative;
        min-height:100vh;
        display:flex;
        align-items:center;
        background:
        radial-gradient(circle at top left,#dbeafe 0%,transparent 35%),
        radial-gradient(circle at bottom right,#dcfce7 0%,transparent 30%),
        #ffffff;
    }

    .csr-hero-grid{
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:70px;
        align-items:center;
    }

    .csr-tag{
        display:inline-flex;
        align-items:center;
        gap:10px;
        padding:12px 22px;
        background:#eff6ff;
        border:1px solid #bfdbfe;
        border-radius:100px;
        font-size:14px;
        font-weight:600;
        color:#5f399c;
        margin-bottom:30px;
    }

    .csr-title{
        font-family:'Poppins',sans-serif;
        font-size:60px;
        line-height:1.1;
        margin-bottom:30px;
        margin-top: 100px;
        color: #5f399c;
    }

    .csr-title span{
        color: #5f399c;
    }

    .csr-desc{
        font-size:18px;
        line-height:1.9;
        color:#313131;
        margin-bottom:40px;
    }

    .csr-buttons{
        display:flex;
        gap:18px;
        flex-wrap:wrap;
    }

    .csr-btn{
        padding:16px 34px;
        border-radius:100px;
        text-decoration:none;
        font-weight:400;
        transition:.4s;
        display:inline-flex;
        align-items:center;
        gap:10px;
    }

    .csr-btn-primary{
        background:#313168;
        color:#fff;
        box-shadow:0 15px 35px rgba(37,99,235,.2);
    }

    .csr-btn-primary:hover{
        transform:translateY(-4px);
    }

    .csr-btn-outline{
        border:1px solid var(--border);
        color:var(--primary);
        background:#fff;
    }

    .csr-btn-outline:hover{
        background:#f8fafc;
    }

    .csr-hero-image{
        position:relative;
        
    }
    
 	/* Only desktop screens */
    @media (min-width: 1025px) {
	    .csr-hero-image{
		margin-top: 215px;
	    }
	}

    .csr-hero-image img{
        width:100%;
        border-radius:32px;
        object-fit:cover;
        box-shadow:0 25px 70px rgba(15,23,42,.15);
    }

    /* STATS */

    .csr-stats{
        margin-top:0px;
        position:relative;
        z-index:2;
    }

    .csr-stats-grid{
        display:grid;
        grid-template-columns:repeat(4,1fr);
        gap:25px;
    }

    .csr-stat-card{
        background:#313168;
        padding:40px 30px;
        border-radius:28px;
        text-align:center;
        border:1px solid #e2e8f0;
        box-shadow:0 15px 50px rgba(15,23,42,.05);
        transition:.4s;
    }

    .csr-stat-card:hover{
        transform:translateY(-10px);
    }

    .csr-stat-number{
        font-size:52px;
        font-weight:800;
        color:#ffffff;
        margin-bottom:10px;
        font-family:'Poppins',sans-serif;
    }

    .csr-stat-text{
        color:#ffffff;
        font-size:16px;
    }

    /* HEADING */

    .csr-heading{
        text-align:center;
        margin-bottom:70px;
    }

    .csr-heading h2{
        font-size:36px;
        font-family:'Poppins',sans-serif;
        margin-bottom:20px;
        color: #5f399c;
    }

    .csr-heading p{
        max-width:850px;
        margin:auto;
        color:#313131;
        line-height:1.9;
        font-size:18px;
    }

    /* CARDS */

    .csr-card-grid{
        display:grid;
        grid-template-columns:repeat(3,1fr);
        gap:30px;
    }

    .csr-card{
        background:#fff;
        border-radius:30px;
        padding:40px;
        border:1px solid var(--border);
        transition:.4s;
        position:relative;
        overflow:hidden;
    }

    .csr-card::before{
        content:'';
        position:absolute;
        top:0;
        left:0;
        width:100%;
        height:5px;
        background:linear-gradient(90deg,#5f399c,#22c55e);
    }

    .csr-card:hover{
        transform:translateY(-12px);
        box-shadow:0 25px 60px rgba(15,23,42,.08);
    }

    .csr-icon{
        width:75px;
        height:75px;
        border-radius:22px;
        background:#eff6ff;
        display:flex;
        align-items:center;
        justify-content:center;
        font-size:34px;
        margin-bottom:30px;
    }

    .csr-card h3{
        font-size:28px;
        margin-bottom:18px;
        font-family:'Poppins',sans-serif;
         color: #5f399c;
    }

    .csr-card p{
        color:#313131;
        line-height:1.9;
    }

    /* STORY */

    .csr-story{
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:80px;
        align-items:center;
        margin-bottom:70px;
    }

    .csr-story.reverse{
        direction:rtl;
    }

    .csr-story.reverse .csr-story-content{
        direction:ltr;
    }

    .csr-story img{
        width:100%;
        border-radius:32px;
        box-shadow:0 25px 60px rgba(15,23,42,.12);
    }

    .csr-story-content h2{
        font-size:48px;
        margin-bottom:25px;
        font-family:'Poppins',sans-serif;
        color: #5f399c;
    }

    .csr-story-content p{
        color:#313131;
        line-height:2;
        font-size:18px;
    }

    /* QUOTE */

    .csr-quote{
        position:relative;
        border-radius:40px;
        overflow:hidden;
        padding:60px 60px;s
        text-align:center;
        background: radial-gradient(57.03% 57.03% at 53.73% 0%, #3C3C7F 0%, #1B1B3A 100%);
        background-size:cover;
        background-position:center;
    }

    .csr-quote h2{
        color:#fff;
        font-size:36px;
        line-height:1.3;
        font-family:'Poppins',sans-serif;
        max-width:1000px;
        margin:auto;
    	text-align: center;
    }
    
    
    .csr-quote p {
    	color: #fff;
    	font-size: 18px;
    	line-height: 1.3;
 	font-family:'Inter',sans-serif;
    	margin: auto;
    	padding-top: 28px;
    	align-items: left;
    	justify-content: left;
    	text-align: left;
     }

    /* FINAL */
	.csr-container-final {
	    width: 100%;
	    max-width: 1280px;
	    margin-left: auto;
	    margin-right: auto;
	    box-sizing: border-box;
	    padding-left: 20px;
	    padding-right: 20px; 
	}

	@media (min-width: 1024px) {
	    .csr-container-final {
		padding-left: 60px;
		padding-right: 20px;
	    }
	}


    .csr-final{
        text-align:center;
       margin-bottom: 30px;
       margin-top: 30px;
  
    }

    .csr-final h2{
        font-size:36px;
        margin-bottom:25px;
        font-family:'Poppins',sans-serif;
        color: #5f399c;
        margin-top: 6%;
    }

	.csr-content p {
	    color: #313131;
	    font-size: 18px;
	    margin-bottom: 20px;
	    text-align: left;
	}

	.csr-highlight {
	    font-size: 18px;
	    color: #1e1e2f;
	    font-weight: 600;
	    margin: 35px 0;
	    padding: 15px 25px;
	    border-left: 4px solid #4A148C; /* Purple accent line */
	    background-color: #f3e5f5; /* Light purple tint */
	    border-radius: 0 8px 8px 0;
	    font-style: italic;
	    text-align: left;
	}

	.csr-action.csr-action-contact {
	    margin-top: 30px;
	}

	.csr-btn-primary.csr-btm-final {
	    display: inline-block;
	    padding: 19px 50px;
            background: linear-gradient(193.06deg, #F5F1FF -59.37%, #4F39E0 106.12%);
	    font-size: calc(16px + (18 - 16) * ((100vw - 320px) / (1920 - 320)));
	    color: #fff !important;
	    text-decoration: none;
	    border-top-left-radius: 12px;
	    border-top-right-radius: 12px;
	    border-bottom-right-radius: 12px;
	    border-bottom-left-radius: 12px;
	    transition: all 0.3s ease;
	    font-weight: 500;

	}

	.csr-btn-primary.csr-btm-final:hover {
	    transform: translateY(-2px);
	   background: linear-gradient(132.75deg, #4F39E0 0%, #A889FF 96.99%);
	}

	section.csr-section-main {
	    padding: 0px;
	}

    /* RESPONSIVE */

    @media(max-width:1100px){

        .csr-hero-grid,
        .csr-story{
            grid-template-columns:1fr;
        }

        .csr-card-grid{
            grid-template-columns:repeat(2,1fr);
        }

        .csr-stats-grid{
            grid-template-columns:repeat(2,1fr);
        }

        .csr-title{
            font-size:58px;
        }

    }

    @media(max-width:768px){

        .csr-section{
            padding:70px 20px;
        }

        .csr-title{
            font-size:42px;
        }

        .csr-heading h2,
        .csr-story-content h2,
        .csr-final h2{
            font-size:36px;
        }

        .csr-quote h2{
            font-size:34px;
        }

        .csr-card-grid,
        .csr-stats-grid{
            grid-template-columns:1fr;
        }

        .csr-story{
            gap:40px;
            margin-bottom:50px;
        }

        .csr-quote{
            padding:80px 25px;
        }

    }
    
    



