/* =========================
ABOUT PAGE
========================= */

/* HERO */

.about-hero{
display:grid;
grid-template-columns:300px 1fr;
gap:60px;
align-items:center;
margin-bottom:40px;
}

.about-photo img{
width:100%;
border-radius:12px;
}

.about-intro h2{
font-size:2.5rem;
margin-bottom:20px;

  text-decoration: underline red;
  text-decoration-thickness: 4px;
  text-underline-offset: 6px;
}

.about-intro p{
font-size:1.1rem;
}

h2{
  text-decoration: underline red;
  text-decoration-thickness: 4px;
  text-underline-offset: 6px;
  margin-bottom: 10px;
}

/* =========================
ABOUT TEXT
========================= */
.about-text{
max-width:800px;
margin-bottom:50px;
}

.about-text p{
margin-bottom:20px;
}

/* =========================
EDUCATION
========================= */
.education{
margin-bottom:50px;
}
.education-card{
background:#1a1a1a;
padding:30px;
border-radius:10px;
max-width:500px;
}

/* =========================
EXPERIENCE
========================= */

.experience{
margin-bottom:50px;
}

.experience-list{

display:grid;
gap:35px;

}

.experience-item{

background:#1a1a1a;
padding:30px;
border-radius:10px;

}

.experience-item h3{

margin-bottom:8px;

}

.experience-place{

opacity:.8;
font-size:.95rem;

}

.experience-date{

opacity:.6;
font-size:.9rem;
margin-bottom:12px;

}


/* =========================
RESUME
========================= */

.resume{
max-width:1200px;
}

.resume-button{
display:inline-block;
margin-top:20px;
padding:14px 30px;
background:white;
color:black;
border-radius:6px;
font-weight:bold;
transition:.2s;
}

.resume-button:hover{
transform:translateY(-2px);
}

/* =========================
SKILLS SECTION
========================= */
.skills{
display:flex;
flex-direction:column;
}

/* grid */
.skills-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:40px;
width:100%;
}

/* cards */
.software-card{
display:flex;

flex-direction:column;

background:#1a1a1a;

padding:35px;

border-radius:10px;

transition:.2s;

}

/* hover effect */

.software-card:hover{

transform:translateY(-4px);

}

/* headers */

.software-card h3{

margin-bottom:18px;

font-size:1.2rem;

}

#blender-header{
    color: #EA7A08;
}

#ae-header{
    color: #D3A5FF;
}

#prempro-header{
    color: #9595FB;
}

#maya-header{
    color: #3FA7CD;
}

#illustrator-header{
    color: #FF9808;
}

/* list */

.software-card ul{

list-style:none;

padding:0;

}

.software-card li{

margin-bottom:8px;

opacity:.9;

font-size:.95rem;

}

/* ================================
MOBILE
================================ */

@media (max-width:900px){

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

.about-hero{
grid-template-columns:1fr;   
text-align:center;           
}

.about-photo{
max-width:250px;             
margin:auto;                 
}

}

@media (max-width:600px){

.skills-grid{
grid-template-columns:1fr;
}

}