:root {
    --christhood-royal-purple: #4B248C;
    --christhood-gold-color: #D4AF37;
    --christhood-light-gray: #f9f9f9;
    --christhood-dark-gray: #333;
    --christhood-white: #ffffff;
}


.christhood-counselling-intro {
    background: linear-gradient(rgba(75, 36, 140, 0.8), rgba(75, 36, 140, 0.8)),
        url('https://source.unsplash.com/random/1200x800/?counseling');
    background-size: cover;
    background-position: center;
    height: 60vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: var(--christhood-white);
    padding: 0 20px;
}

.christhood-counselling-intro h1 {
    font-size: 2.8rem;
    margin-bottom: 15px;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}

.christhood-counselling-intro h4 {
    font-size: 1.5rem;
    font-weight: 300;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}

/* Main Content */
.christhood-counselling-page {
    padding: 60px 0;
}

.christhood-counselling-main-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.christhood-counselling-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 40px;
}

.christhood-counselling-main-content-col {
    flex: 1;
    min-width: 300px;
}

.christhood-counselling-main-content-col img {
    width: 100%;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.christhood-counselling-main-content-col p {
    margin-bottom: 20px;
    line-height: 1.8;
    color: var(--christhood-dark-gray);
}

.christhood-counselling-main-content-col h4 {
    color: var(--christhood-royal-purple);
    margin: 25px 0 15px;
    font-size: 1.5rem;
}

.christhood-counselling-button-btn {
    margin-top: 30px;
}

.christhood-counselling-button-btn a {
    display: inline-block;
    background-color: var(--christhood-royal-purple);
    color: var(--christhood-white);
    padding: 12px 30px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.3s ease;
}

.christhood-counselling-button-btn a:hover {
    background-color: #3a1c6d;
    transform: translateY(-2px);
}

/* Desktop Core Values */
.christhood-counselling-core-values {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px;
    display: block;
}

.christhood-counselling-main-banner {
    background-color: var(--christhood-royal-purple);
    color: var(--christhood-white);
    padding: 15px 25px;
    font-size: 1.3rem;
    margin-bottom: 30px;
    display: inline-block;
    border-radius: 5px;
}

.christhood-counselling-core-values h3 {
    color: var(--christhood-royal-purple);
    margin: 25px 0 10px;
    font-size: 1.4rem;
}

.christhood-counselling-core-values p {
    color: var(--christhood-dark-gray);
    line-height: 1.8;
    margin-bottom: 15px;
}

/* Mobile Accordion */
.christhood-accord {
    display: none;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

.christhood-accord-item {
    margin-bottom: 15px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.christhood-accord-header {
    background-color: var(--christhood-royal-purple);
    color: var(--christhood-white);
    padding: 15px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.christhood-accord-header h3 {
    font-size: 1.2rem;
    margin: 0;
}

.christhood-accord-icon {
    font-size: 1.3rem;
    font-weight: bold;
    transition: transform 0.3s ease;
}

.christhood-accord-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
    background-color: var(--christhood-light-gray);
}

.christhood-accord-content p {
    padding: 20px;
    margin: 0;
    color: var(--christhood-dark-gray);
    line-height: 1.8;
}

.christhood-accord-item.active .christhood-accord-content {
    max-height: 300px;
}

.christhood-accord-item.active .christhood-accord-icon {
    transform: rotate(45deg);
}

/* Responsive Design */
@media (max-width: 768px) {
    .christhood-counselling-intro h1 {
        font-size: 2.2rem;
    }

    .christhood-counselling-intro h4 {
        font-size: 1.2rem;
    }

    .christhood-counselling-core-values {
        display: none;
    }

    .christhood-accord {
        display: block;
    }

    .christhood-counselling-row {
        flex-direction: column;
        gap: 30px;
    }

    .christhood-counselling-main-content-col {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .christhood-counselling-intro h1 {
        font-size: 1.8rem;
    }

    .christhood-counselling-intro h4 {
        font-size: 1rem;
    }
}

/* Intro Section */
.christhood-cont-page-intro {
    background: linear-gradient(rgba(75, 36, 140, 0.8), rgba(75, 36, 140, 0.8)),
        url('https://source.unsplash.com/random/1200x800/?counseling');
    background-size: cover;
    background-position: center;
    height: 50vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: var(--christhood-white);
    padding: 0 20px;
}

.christhood-cont-page-intro h1 {
    font-size: 2.8rem;
    margin-bottom: 15px;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}

.christhood-cont-page-intro h4 {
    font-size: 1.5rem;
    font-weight: 300;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}

/* Main Content Grid */
.christhood-cont-grid-container {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 40px;
    max-width: 1200px;
    margin: 40px auto;
    padding: 0 20px;
}

/* Left Column - Main Content */
.christhood-cont-main-content {
    background-color: var(--christhood-white);
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
}

.christhood-cont-main-content p {
    margin-bottom: 20px;
    line-height: 1.8;
    color: var(--christhood-dark-gray);
}

/* Banner */
.christhood-cont-main-banner {
    background-color: var(--christhood-royal-purple);
    color: var(--christhood-white);
    padding: 15px 25px;
    font-size: 1.3rem;
    margin: 40px 0 30px;
    display: inline-block;
    border-radius: 5px;
}

/* Right Column - Social Media */
.christhood-cont-social-sidebar {
    background-color: var(--christhood-light-gray);
    padding: 30px;
    border-radius: 8px;
    height: fit-content;
    position: sticky;
    top: 20px;
}

.christhood-cont-social-title {
    color: var(--christhood-royal-purple);
    margin-bottom: 20px;
    font-size: 1.5rem;
    text-align: center;
    border-bottom: 2px solid var(--christhood-gold-color);
    padding-bottom: 10px;
}

.christhood-cont-social-icons {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 30px;
}

.christhood-cont-social-icons a {
    color: var(--christhood-royal-purple);
    font-size: 1.8rem;
    transition: all 0.3s ease;
}

.christhood-cont-social-icons a:hover {
    color: var(--christhood-gold-color);
    transform: translateY(-3px);
}

/* Program Structure Grid */
.christhood-cont-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    margin-bottom: 40px;
}

.christhood-cont-col {
    background-color: var(--christhood-light-gray);
    padding: 25px;
    border-radius: 8px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
    border-top: 4px solid var(--christhood-royal-purple);
}

.christhood-cont-col h3 {
    color: var(--christhood-royal-purple);
    margin-bottom: 15px;
    font-size: 1.4rem;
}

.christhood-cont-col p {
    margin-bottom: 15px;
}

.christhood-cont-col b {
    color: var(--christhood-royal-purple);
}

/* Read More Functionality */
.christhood-cont-more-content {
    display: none;
}

.christhood-cont-read-more {
    background-color: var(--christhood-royal-purple);
    color: var(--christhood-white);
    border: none;
    padding: 8px 15px;
    border-radius: 5px;
    cursor: pointer;
    margin-top: 10px;
    display: inline-block;
    transition: all 0.3s ease;
}

.christhood-cont-read-more:hover {
    background-color: #3a1c6d;
}

/* Responsive Design */
@media (max-width: 992px) {
    .christhood-cont-grid-container {
        grid-template-columns: 1fr;
    }

    .christhood-cont-social-sidebar {
        position: static;
        margin-top: 40px;
    }
}

@media (max-width: 768px) {
    .christhood-cont-page-intro h1 {
        font-size: 2.2rem;
    }

    .christhood-cont-page-intro h4 {
        font-size: 1.2rem;
    }
}
   @media (max-width: 480px) {
       .christhood-cont-page-intro h1 {
           font-size: 1.8rem;
       }

       .christhood-cont-page-intro h4 {
           font-size: 1rem;
       }
   }

   /*CREATIVE CONT*/
   /* Creative Arts Ministry Styles */
   :root {
       --creative-royal-purple: #4B248C;
       --creative-gold-color: #D4AF37;
       --creative-light-gray: #f9f9f9;
       --creative-dark-gray: #333;
       --creative-white: #ffffff;
   }

   /* Creative Arts Ministry Specific Styles */
   :root {
       --creative-royal-purple: #6a0dad;
       --creative-gold-color: #ffd700;
       --creative-light-gray: #f9f5ff;
       --creative-dark-gray: #4a2c40;
       --creative-white: #ffffff;
   }

   /* Intro Section */
   .creative-ministry-intro {
       background: linear-gradient(rgba(106, 13, 173, 0.8), rgba(106, 13, 173, 0.8)),
           url('https://source.unsplash.com/random/1200x800/?worship,art');
       background-size: cover;
       background-position: center;
       height: 60vh;
       display: flex;
       flex-direction: column;
       justify-content: center;
       align-items: center;
       text-align: center;
       color: var(--creative-white);
       padding: 0 20px;
   }

   .creative-ministry-intro h1 {
       font-size: 2.8rem;
       margin-bottom: 15px;
       text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
   }

   .creative-ministry-intro h4 {
       font-size: 1.5rem;
       font-weight: 300;
       text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
   }

   /* Main Content */
   .creative-ministry-page {
       padding: 60px 0;
       background-color: var(--creative-white);
   }

   .creative-ministry-main-content {
       max-width: 1200px;
       margin: 0 auto;
       padding: 0 20px;
   }

   .creative-ministry-row {
       display: flex;
       flex-wrap: wrap;
       align-items: center;
       gap: 40px;
   }

   .creative-ministry-main-content-col {
       flex: 1;
       min-width: 300px;
   }

   .creative-ministry-main-content-col img {
       width: 100%;
       border-radius: 8px;
       box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
       border: 2px solid var(--creative-gold-color);
   }

   .creative-ministry-main-content-col p {
       margin-bottom: 20px;
       line-height: 1.8;
       color: var(--creative-dark-gray);
   }

   .creative-ministry-main-content-col h4 {
       color: var(--creative-royal-purple);
       margin: 25px 0 15px;
       font-size: 1.5rem;
   }

   .creative-ministry-button-btn {
       margin-top: 30px;
   }

   .creative-ministry-button-btn a {
       display: inline-block;
       background-color: var(--creative-royal-purple);
       color: var(--creative-white);
       padding: 12px 30px;
       border-radius: 5px;
       text-decoration: none;
       font-weight: 500;
       transition: all 0.3s ease;
       border: 1px solid var(--creative-gold-color);
   }

   .creative-ministry-button-btn a:hover {
       background-color: #5a0b9d;
       transform: translateY(-2px);
   }

   /* Desktop Core Values */
   .creative-ministry-core-values {
       max-width: 1200px;
       margin: 0 auto;
       padding: 40px 20px;
       display: block;
   }

   .creative-ministry-main-banner {
       background-color: var(--creative-royal-purple);
       color: var(--creative-white);
       padding: 15px 25px;
       font-size: 1.3rem;
       margin-bottom: 30px;
       display: inline-block;
       border-radius: 5px;
       border: 1px solid var(--creative-gold-color);
   }

   .creative-ministry-core-values h3 {
       color: var(--creative-royal-purple);
       margin: 25px 0 10px;
       font-size: 1.4rem;
       border-bottom: 2px solid var(--creative-gold-color);
       padding-bottom: 5px;
   }

   .creative-ministry-core-values p {
       color: var(--creative-dark-gray);
       line-height: 1.8;
       margin-bottom: 15px;
       padding-left: 20px;
   }

   /* Mobile Accordion */
   .creative-accord {
       display: none;
       max-width: 1200px;
       margin: 0 auto;
       padding: 20px;
   }

   .creative-accord-item {
       margin-bottom: 15px;
       border-radius: 8px;
       overflow: hidden;
       box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
       border: 1px solid var(--creative-gold-color);
   }

   .creative-accord-header {
       background-color: var(--creative-royal-purple);
       color: var(--creative-white);
       padding: 15px 20px;
       display: flex;
       justify-content: space-between;
       align-items: center;
       cursor: pointer;
       transition: background-color 0.3s ease;
   }

   .creative-accord-header:hover {
       background-color: #5a0b9d;
   }

   .creative-accord-header h3 {
       font-size: 1.2rem;
       margin: 0;
   }

   .creative-accord-icon {
       font-size: 1.3rem;
       font-weight: bold;
       transition: transform 0.3s ease;
   }

   .creative-accord-content {
       max-height: 0;
       overflow: hidden;
       transition: max-height 0.3s ease;
       background-color: var(--creative-light-gray);
   }

   .creative-accord-content p {
       padding: 20px;
       margin: 0;
       color: var(--creative-dark-gray);
       line-height: 1.8;
   }

   .creative-accord-item.active .creative-accord-content {
       max-height: 300px;
   }

   .creative-accord-item.active .creative-accord-icon {
       transform: rotate(45deg);
   }

   /* Responsive Design */
   @media (max-width: 768px) {
       .creative-ministry-intro h1 {
           font-size: 2.2rem;
       }

       .creative-ministry-intro h4 {
           font-size: 1.2rem;
       }

       .creative-ministry-core-values {
           display: none;
       }

       .creative-accord {
           display: block;
       }

       .creative-ministry-row {
           flex-direction: column;
           gap: 30px;
       }

       .creative-ministry-main-content-col {
           width: 100%;
       }
   }

   @media (max-width: 480px) {
       .creative-ministry-intro h1 {
           font-size: 1.8rem;
       }

       .creative-ministry-intro h4 {
           font-size: 1rem;
       }
   }
   /* Continue Page Styles */
   .creative-cont-page-intro {
       background: linear-gradient(rgba(106, 13, 173, 0.8), rgba(106, 13, 173, 0.8)),
           url('https://source.unsplash.com/random/1200x800/?art,worship');
       background-size: cover;
       background-position: center;
       height: 50vh;
       display: flex;
       flex-direction: column;
       justify-content: center;
       align-items: center;
       text-align: center;
       color: var(--creative-white);
       padding: 0 20px;
   }

   .creative-cont-page-intro h1 {
       font-size: 2.8rem;
       margin-bottom: 15px;
       text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
   }

   .creative-cont-page-intro h4 {
       font-size: 1.5rem;
       font-weight: 300;
       text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
   }

   .creative-cont-grid-container {
       display: grid;
       grid-template-columns: 2fr 1fr;
       gap: 40px;
       max-width: 1200px;
       margin: 40px auto;
       padding: 0 20px;
   }

   .creative-cont-main-content {
       background-color: var(--creative-white);
       padding: 30px;
       border-radius: 8px;
       box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
   }

   .creative-cont-main-content p {
       margin-bottom: 20px;
       line-height: 1.8;
       color: var(--creative-dark-gray);
   }

   .creative-cont-main-banner {
       background-color: var(--creative-royal-purple);
       color: var(--creative-white);
       padding: 15px 25px;
       font-size: 1.3rem;
       margin: 40px 0 30px;
       display: inline-block;
       border-radius: 5px;
       border: 1px solid var(--creative-gold-color);
   }

   .creative-cont-row {
       display: grid;
       grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
       gap: 30px;
       margin-bottom: 40px;
   }

   .creative-cont-col {
       background-color: var(--creative-light-gray);
       padding: 25px;
       border-radius: 8px;
       box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
       border-top: 4px solid var(--creative-royal-purple);
       transition: transform 0.3s ease;
   }

   .creative-cont-col:hover {
       transform: translateY(-5px);
   }

   .creative-cont-col h3 {
       color: var(--creative-royal-purple);
       margin-bottom: 15px;
       font-size: 1.4rem;
   }

   .creative-cont-col p {
       margin-bottom: 15px;
   }

   .creative-cont-col b {
       color: var(--creative-royal-purple);
   }

   .creative-cont-social-sidebar {
       background-color: var(--creative-light-gray);
       padding: 30px;
       border-radius: 8px;
       height: fit-content;
       position: sticky;
       top: 20px;
       box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
   }

   .creative-cont-social-title {
       color: var(--creative-royal-purple);
       margin-bottom: 20px;
       font-size: 1.5rem;
       text-align: center;
       border-bottom: 2px solid var(--creative-gold-color);
       padding-bottom: 10px;
   }

   .creative-cont-social-icons {
       display: flex;
       justify-content: center;
       gap: 20px;
       margin-top: 30px;
   }

   .creative-cont-social-icons a {
       color: var(--creative-royal-purple);
       font-size: 1.8rem;
       transition: all 0.3s ease;
   }

   .creative-cont-social-icons a:hover {
       color: var(--creative-gold-color);
       transform: translateY(-3px);
   }

   /* Responsive Design */
   @media (max-width: 992px) {
       .creative-cont-grid-container {
           grid-template-columns: 1fr;
       }

       .creative-cont-social-sidebar {
           position: static;
           margin-top: 40px;
       }
   }

   @media (max-width: 768px) {
       .creative-cont-page-intro h1 {
           font-size: 2.2rem;
       }

       .creative-cont-page-intro h4 {
           font-size: 1.2rem;
       }
   }

   @media (max-width: 480px) {
       .creative-cont-page-intro h1 {
           font-size: 1.8rem;
       }

       .creative-cont-page-intro h4 {
           font-size: 1rem;
       }
   }