/* ==========================================================
   LITTLE POUCH CREW TASMANIA
   FOUND WILDLIFE PAGE
   Version 1.0
========================================================== */


/* ==========================================================
   PAGE HEADER
========================================================== */

.help-header{

    text-align:center;

    padding:80px 0 65px;

}

.help-header h1{

    font-size:4rem;

    max-width:900px;

    margin:0 auto 20px;

}

.help-intro{

    max-width:780px;

    margin:0 auto;

    font-size:1.2rem;

    color:#666;

}


/* ==========================================================
   IMPORTANT INFORMATION
========================================================== */

.help-important{

    background:#ffffff;

}

.important-box{

    max-width:850px;

    margin:0 auto;

    padding:50px 60px;

    background:var(--cream);

    border-left:5px solid var(--green);

    border-radius:0 14px 14px 0;

}

.important-box h2{

    font-size:3rem;

}

.important-box p{

    color:#555;

}


/* ==========================================================
   WHAT TO DO
========================================================== */

.help-steps{

    background:var(--cream);

}

.section-heading{

    max-width:750px;

    margin:0 auto 55px;

    text-align:center;

}

.section-heading h2{

    font-size:3.3rem;

}

.help-step-grid{

    display:grid;

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

    gap:25px;

}

.help-step{

    background:#ffffff;

    padding:40px 28px;

    border-radius:14px;

    text-align:center;

}

.help-step span{

    display:block;

    font-family:'Cormorant Garamond',serif;

    font-size:1.5rem;

    color:var(--brown);

    margin-bottom:10px;

}

.help-step h3{

    font-size:1.9rem;

}

.help-step p{

    color:#666;

    font-size:.95rem;

}


/* ==========================================================
   DON'T FEED
========================================================== */

.help-dont{

    background:#ffffff;

}

.dont-content{

    max-width:800px;

    margin:0 auto;

    text-align:center;

}

.dont-content h2{

    font-size:3.3rem;

}

.dont-content p{

    color:#555;

}


/* ==========================================================
   BABY WILDLIFE
========================================================== */

.help-baby{

    background:var(--cream);

}

.help-baby .two-column{

    display:grid;

    grid-template-columns:1.2fr .8fr;

    gap:70px;

    align-items:center;

}

.help-baby-content h2{

    font-size:3.3rem;

}

.help-baby-content p{

    color:#555;

}

.help-baby-note{

    padding:40px;

    background:#ffffff;

    border-radius:14px;

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

}

.help-baby-note h3{

    font-size:2rem;

}

.help-baby-note p{

    color:#666;

}


/* ==========================================================
   EMERGENCY CONTACTS
========================================================== */

.help-contacts{

    background:#ffffff;

}

.contact-resource{

    max-width:850px;

    margin:0 auto 25px;

    padding:30px 35px;

    background:var(--cream);

    border-radius:12px;

}

.contact-resource:last-child{

    margin-bottom:0;

}

.contact-resource h3{

    font-size:2rem;

    margin-bottom:10px;

}

.contact-resource p{

    color:#666;

}


/* ==========================================================
   LITTLE POUCH CREW
========================================================== */

.help-lpc{

    background:var(--green);

    color:#ffffff;

    text-align:center;

}

.help-lpc-content{

    max-width:760px;

    margin:0 auto;

}

.help-lpc .section-label{

    color:#d7e3d2;

}

.help-lpc h2{

    color:#ffffff;

    font-size:3.3rem;

}

.help-lpc p{

    color:rgba(255,255,255,.9);

}

.help-lpc .text-link{

    color:#ffffff;

    border-color:#ffffff;

}

.help-lpc .text-link:hover{

    color:#d7e3d2;

    border-color:#d7e3d2;

}


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

@media(max-width:1000px){

    .help-step-grid{

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

    }

}

@media(max-width:800px){

    .help-baby .two-column{

        grid-template-columns:1fr;

        gap:40px;

    }

}

@media(max-width:600px){

    .help-header{

        padding:60px 0 45px;

    }

    .help-header h1{

        font-size:2.8rem;

    }

    .help-intro{

        font-size:1.05rem;

    }

    .important-box{

        padding:35px 25px;

    }

    .important-box h2{

        font-size:2.5rem;

    }

    .section-heading h2,
    .dont-content h2,
    .help-baby-content h2,
    .help-lpc h2{

        font-size:2.6rem;

    }

    .help-step-grid{

        grid-template-columns:1fr;

    }

    .help-step{

        padding:35px 25px;

    }

}