/* ===========================
   CONTENT SECTIONS
   BUMBY
=========================== */



.content-section {

    padding:

    100px 8%;


    position:relative;


}






/* TITRES DE SECTION */


.section-title {


    display:flex;


    align-items:center;


    gap:20px;


    margin-bottom:

    60px;


}



.section-title span {


    font-size:

    2.5rem;


}



.section-title h2 {


    font-size:

    clamp(2.5rem,5vw,4rem);


    color:

    var(--purple);


}









/* ===========================
   FLASH
=========================== */



.flash-section {


    background:

    linear-gradient(

        180deg,

        transparent,

        var(--pink-soft)

    );


}




.flash-grid {


    display:grid;


    grid-template-columns:

    repeat(3,1fr);


    gap:

    35px;


}





.placeholder-card {


    height:

    420px;


    border-radius:

    var(--radius-medium);


    background:

    rgba(255,255,255,.7);


    display:flex;


    align-items:center;


    justify-content:center;


    color:

    var(--brown);


    font-size:

    1.2rem;


    box-shadow:

    var(--shadow-soft);


    transition:

    var(--transition-medium);


}





.placeholder-card:hover {


    transform:

    translateY(-10px);


    box-shadow:

    var(--shadow-hover);


}









/* ===========================
   PORTFOLIO
=========================== */



.portfolio-section {


    background:

    var(--cream);


}



.portfolio-grid {


    display:grid;


    grid-template-columns:

    repeat(3,1fr);


    gap:

    35px;


}



.portfolio-grid .placeholder-card {


    height:

    500px;


}









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



.about-section {


    background:

    linear-gradient(

        135deg,

        var(--sage),

        var(--cream)

    );


    border-radius:

    80px 80px 0 0;


}





.about-section p {


    max-width:

    800px;


    font-size:

    1.2rem;


    line-height:

    2;


    color:

    var(--brown);


}









/* ===========================
   FAQ
=========================== */



.faq-section {


    background:

    var(--lavender);


}





.faq-container {


    max-width:

    900px;


}





.faq-item {


    background:

    rgba(255,255,255,.7);


    border-radius:

    var(--radius-medium);


    margin-bottom:

    20px;


    overflow:hidden;


}











.faq-answer {


    padding:

    0 25px 25px;


    color:

    var(--brown);


}









/* ===========================
   CONTACT
=========================== */



.contact-section {


    text-align:center;


    background:

    var(--pink-soft);


}





.project-button {


    display:inline-block;


    margin-top:

    30px;


    padding:

    18px 45px;


    border-radius:

    50px;


    background:

    var(--purple);


    color:white;


    transition:

    var(--transition-fast);


}





.project-button:hover {


    transform:

    translateY(-5px);


    box-shadow:

    var(--shadow-card);


}


/* ===========================
   GALLERY CARDS
=========================== */


.gallery-card {


    background:white;


    border-radius:

    var(--radius-medium);


    overflow:hidden;


    box-shadow:

    var(--shadow-soft);


    transition:

    transform var(--transition-medium),

    box-shadow var(--transition-medium);


}



.gallery-card img {


    width:100%;


    height:100%;


    min-height:420px;


    object-fit:cover;


}



.gallery-card:hover {


    transform:

    translateY(-12px);


    box-shadow:

    var(--shadow-hover);


}



.gallery-info {


    padding:20px;


    background:white;


}



.gallery-info h3 {


    color:

    var(--purple);


    font-size:1.8rem;


}



.gallery-info p {


    color:

    var(--brown);


}