/* =========================
    HERO
========================= */

.page-hero{
    background: linear-gradient(
        rgba(68,86,61,.82),
        rgba(68,86,61,.82)
    ),
.page-hero{
    background-image: url("companion.herbs.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 600px;
};

    background-size: cover;
    background-position: center;

    color:white;

    text-align:center;

    padding:120px 20px;
}

.page-hero h1{
    font-family:'Great Vibes',cursive;
    font-size:5rem;
    color:#FAF8F2;
    margin-bottom:20px;
}

.page-hero p{
    max-width:750px;
    margin:auto;
    font-size:1.2rem;
    line-height:1.9;
}



/* =========================
   SECTION
========================= */

section{
    padding:90px 7%;
}

section h2{
    text-align:center;
    color:#44563D;
    font-size:2.8rem;
    margin-bottom:50px;
}



/* =========================
    WORKSHOP GRID
========================= */

.workshop-grid{

    display:grid;

    grid-template-columns:
    repeat(auto-fit,minmax(280px,1fr));

    gap:35px;

}


.workshop-card{

    background:white;

    padding:35px;

    border-radius:20px;

    box-shadow:
    0 10px 25px rgba(0,0,0,.08);

    transition:.3s;
}


.workshop-card:hover{

    transform:translateY(-8px);

}


.workshop-card h3{

    color:#B08A3C;

    margin-bottom:20px;

}


.workshop-card p{

    line-height:1.9;

}



/* =========================
    INSTRUCTORS
========================= */

.instructor-section{

    background:#FAF8F2;

}



/* =========================
    VOLUNTEER
========================= */

.volunteer-section{

    background:#DCE4D3;

}


.volunteer-box{

    max-width:800px;

    margin:auto;

    background:white;

    padding:50px;

    border-radius:20px;

    box-shadow:
    0 10px 25px rgba(0,0,0,.08);

}


.volunteer-box h3{

    color:#44563D;

    margin-bottom:20px;

}


.volunteer-box p{

    margin-bottom:20px;

    line-height:1.9;

}


.volunteer-box ul{

    margin-left:25px;

    line-height:2.1;

}



/* =========================
    BUTTON
========================= */

.btn{

    display:inline-block;

    margin-top:30px;

    background:#B08A3C;

    color:white;

    padding:15px 30px;

    border-radius:10px;

    text-decoration:none;

    font-weight:600;

}


.btn:hover{

    background:#44563D;

}



/* =========================
    CALENDAR
========================= */

.calendar-section{

    background:white;

}


.calendar-grid{

    display:grid;

    grid-template-columns:
    repeat(auto-fit,minmax(260px,1fr));

    gap:30px;

}


.month{

    background:#FAF8F2;

    padding:35px;

    border-radius:18px;

    box-shadow:
    0 10px 20px rgba(0,0,0,.06);

}


.month h3{

    color:#B08A3C;

    margin-bottom:20px;

}


.month ul{

    line-height:2;

}



/* =========================
    COMMUNITY PARTNERS
========================= */

.partners-section{

    background:#F8F5EF;

}



/* =========================
    FOOTER
========================= */

.site-footer{

    background:#44563D;

    color:white;

}


.footer-top{

    width:90%;

    max-width:1200px;

    margin:auto;

    padding:70px 0;

    display:grid;

    grid-template-columns:
    repeat(auto-fit,minmax(220px,1fr));

    gap:50px;

}


.footer-column h3{

    color:#B08A3C;

    margin-bottom:20px;

}


.footer-column p{

    line-height:1.9;

}


.footer-column ul{

    list-style:none;

}


.footer-column li{

    margin-bottom:12px;

}


.footer-column a{

    color:white;

    text-decoration:none;

}


.footer-column a:hover{

    color:#B08A3C;

}


.footer-bottom{

    background:#354430;

    text-align:center;

    padding:25px;

}



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

@media(max-width:768px){

.page-hero h1{

    font-size:3.2rem;

}

section h2{

    font-size:2.2rem;

}

.volunteer-box{

    padding:30px;

}

}
```