.title{
display:flex;
justify-content:center;
margin:10rem 0 4rem 0;
text-align:center;
}

.title h1{
display:flex;
flex-direction:column;
align-items:center;
font-family: "Gajraj One", sans-serif;  font-style: normal;
color:var(--orange);

font-size:6em;
line-height:0.9;
letter-spacing:-0.02em;
}


.title h1 span:last-child{
margin-top:1rem;
}




/* SECTION */

.students{
padding:8rem 2rem;
display:flex;
justify-content:center;
}


/* GRID */

.students-grid{

display:grid;
grid-template-columns:repeat(3,1fr);


max-width:70rem;
width:100%;

}


/* CARD */

.student-card{

display:flex;
flex-direction:column;

align-items:center;

text-align:center;

gap:1.2rem;
transform: scale(85%);

}



.student-title{
  font-family:'Source Sans 3', sans-serif;
  font-size:1rem;
  letter-spacing:0.05em;
  text-transform:uppercase;
  color:var(--white);
  opacity:0.7;
  text-transform: uppercase;
}


/* TITLE */

.student-creator{

font-family:"Anton", sans-serif;
text-transform: uppercase;
font-size:3em;

color:var(--orange);

}


/* DESCRIPTION */

.student-desc{

font-family:'Source Sans 3',sans-serif;
font-weight: 400;
font-size:0.9rem;

line-height:1.6;

color:var(--white);

max-width:20rem;

}

.student-text{

max-width:22rem;
height:5.5em;

display:flex;
align-items:flex-start;

}


/* IMAGE */

.student-img{

width:100%;
aspect-ratio:1/1;
filter: grayscale(1);
object-fit:cover;

}


/* BUTTON */

.student-btn{

width:100%;

padding:0.7rem 0;

border:1px solid var(--orange);

color:var(--orange);

text-decoration:none;

font-family:'Source Sans 3', sans-serif;

transition:0.25s ease;

}

.student-btn:hover{

background:var(--orange);
font-weight: 700;
color:var(--black);

}

@media (min-width:1147px){
.student-title{
  max-width: 40ch;
}
.students {
  padding: 4rem 2rem;
}

}

@media (max-width:1146px){
.student-text {
height:6.5em;
}
}



@media (max-width:1100px){

.title h1{
font-size:5em;
}
}

@media (max-width:976px){
.student-text {
height:7.5em;
}

.students {
  padding: 1rem 2rem;
}
}


@media (max-width:900px){

.students-grid{
grid-template-columns:1fr 1fr;


}

.title h1{
font-size:4em;
}
}


@media (max-width:615px){

.students-grid{
grid-template-columns:1fr;
}
.title h1{
font-size:3em;
}

  .student-text{
    width:100%;
    max-width:none;   
  }

  .student-desc{
    width:100%;
    max-width:none;  
  }

}