/*==================================================
    ABOUT.CSS
    My Lolita Wardrobe
==================================================*/


/*==============================
    PROFILE CARD
==============================*/

.profileCard{

    display:flex;

    gap:30px;

    align-items:center;

}

.profilePhoto{

    width:220px;

    flex-shrink:0;

    border:1px solid var(--gold-line);

    outline:6px solid var(--ivory);

    box-shadow:0 0 0 1px var(--gold), 0 10px 20px rgba(194,24,91,.18);

    border-radius:50%;

}

.profileText h2{

    margin-bottom:12px;

}

.profileText p{

    color:var(--ink-soft);

    margin-bottom:10px;

}



/*==============================
    ABOUT SECTIONS
==============================*/

.aboutSection h3{

    font-family:'Cormorant Garamond',serif;

    font-size:1.6rem;

    color:var(--wine);

    margin-bottom:12px;

}

.aboutSection p{

    color:var(--ink-soft);

    margin-bottom:10px;

}



/*==============================
    FAVOURITES GRID
==============================*/

.favGrid{

    display:grid;

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

    gap:16px;

    margin-top:15px;

}

.favCard{

    background:var(--ivory);

    border:1px dashed var(--gold);

    border-radius:16px;

    text-align:center;

    padding:16px;

}

.favCard h4{

    color:var(--wine);

    margin-bottom:6px;

}

.favCard p{

    font-size:.85rem;

    color:var(--ink-soft);

    margin:0;

}



/*==============================
    LINKS LIST
==============================*/

.linksList{

    display:flex;

    flex-wrap:wrap;

    gap:12px;

    margin-top:10px;

}

.linksList a{

    background:var(--ivory);

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

    border-radius:16px;

    padding:10px 20px;

    font-weight:bold;

    font-family:'Cormorant Garamond',serif;

}

.linksList a:hover{

    background:var(--ivory-deep);

    border-color:var(--gold);

}



/*==============================
    RESPONSIVE
==============================*/

@media (max-width:700px){

.profileCard{

    flex-direction:column;

    text-align:center;

}

.favGrid{

    grid-template-columns:1fr;

}

}