/*
=====================================================
TEMPLE OF HORUS EDFU
Temple-Specific Styling
File: assets/css/temple.css
=====================================================
*/

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

.section-header {
    text-align: center;
    max-width: 900px;
    margin: 0 auto 4rem;
}

.section-header h2 {
    margin: 1rem 0;
}

.temple-label {
    display: inline-block;
    text-transform: uppercase;
    letter-spacing: 3px;
    color: var(--horus-gold);
    font-weight: 600;
    font-size: .85rem;
}

/* =====================================================
   TEMPLE MAP
===================================================== */

.temple-map {
    background: var(--limestone);
}

.temple-map-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(280px,1fr));
    gap: 2rem;
}

.temple-space {
    background: white;
    border-top: 6px solid var(--horus-gold);
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 5px 25px rgba(0,0,0,.08);
    transition: var(--transition);
}

.temple-space:hover {
    transform: translateY(-6px);
}

.temple-space-inner {
    padding: 2rem;
}

.temple-space h3 {
    color: var(--lapis-blue);
    margin-bottom: 1rem;
}

/* =====================================================
   DAILY SERVICE
===================================================== */

.daily-service {
    background: #ffffff;
}

.service-card {
    border-top: 5px solid var(--lapis-blue);
}

.service-image img,
.service-thumbnail {
    width: 100%;
    height: 250px;
    object-fit: cover;
}

.temple-location-badge {
    display: inline-block;
    padding: 5px 12px;
    font-size: .8rem;
    background: var(--horus-gold);
    color: white;
    border-radius: 4px;
    margin-bottom: 1rem;
}

.service-actions {
    text-align: center;
    margin-top: 3rem;
}

/* =====================================================
   OFFERINGS
===================================================== */

.offerings-section {
    background: var(--limestone);
}

.offerings-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(320px,1fr));
    gap: 2rem;
}

.offering-card {
    background: white;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 5px 25px rgba(0,0,0,.08);
}

.offering-image img,
.offering-thumbnail {
    width: 100%;
    height: 260px;
    object-fit: cover;
}

.offering-content {
    padding: 1.75rem;
}

.offering-badge {
    display: inline-block;
    background: var(--horus-gold);
    color: white;
    padding: 5px 12px;
    border-radius: 4px;
    margin-bottom: 1rem;
    font-size: .8rem;
}

.offerings-actions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 3rem;
}

/* =====================================================
   FESTIVALS
===================================================== */

.festival-section {
    background: white;
}

/* =====================================================
   TEMPLE TREASURY
===================================================== */

.marketplace-section {
    background: #ffffff;
}

.category-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(240px,1fr));
    gap: 1.5rem;
}

.category-card {
    background: var(--limestone);
    padding: 2rem;
    text-align: center;
    border-top: 5px solid var(--horus-gold);
    transition: var(--transition);
}

.category-card:hover {
    transform: translateY(-5px);
}

.category-card h3 {
    color: var(--lapis-blue);
}

.marketplace-actions {
    display: flex;
    justify-content: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: 3rem;
}

/* =====================================================
   FEATURED ARTIFACTS
===================================================== */

.featured-artifacts {
    background: var(--limestone);
}

/* =====================================================
   SPONSORSHIPS
===================================================== */

.sponsorships-section {
    background: white;
}

.sponsorship-card {
    border-top: 5px solid var(--lapis-blue);
}

.sponsorship-actions {
    display: flex;
    justify-content: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: 3rem;
}

/* =====================================================
   MEDIA
===================================================== */

.media-section {
    background: var(--limestone);
}

/* =====================================================
   HOUSE OF LIFE
===================================================== */

.house-of-life {
    background:
        linear-gradient(
            rgba(31,93,140,.92),
            rgba(31,93,140,.92)
        ),
        url('../images/backgrounds/papyrus-texture.jpg');

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

    color: white;
    text-align: center;
}

.house-of-life h2,
.house-of-life h3 {
    color: white;
}

.house-of-life-content {
    max-width: 1000px;
    margin: 0 auto;
}

.house-intro {
    max-width: 850px;
    margin: 0 auto 2rem;
    font-size: 1.1rem;
}

.house-quote {
    max-width: 700px;
    margin: 2rem auto;
    padding: 1.5rem;
    background: rgba(255,255,255,.08);
    border-left: 4px solid var(--horus-gold);
    font-style: italic;
}

.house-benefits {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(280px,1fr));
    gap: 2rem;
    margin-top: 3rem;
}

.benefit-card {
    background: rgba(255,255,255,.08);
    padding: 2rem;
    border-top: 4px solid var(--horus-gold);
}

.house-actions {
    display: flex;
    justify-content: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: 3rem;
}

/* =====================================================
   TEMPLE SPACES NAV
===================================================== */

.temple-spaces {
    text-align: center;
    margin: 2rem 0;
    color: var(--papyrus);
    line-height: 2;
}

.temple-spaces span {
    margin: 0 .3rem;
}

/* =====================================================
   ARCHIVE / SEARCH / INDEX
===================================================== */

.archive-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(350px,1fr));
    gap: 2rem;
}

.archive-card {
    background: white;
    overflow: hidden;
    border-radius: 6px;
    box-shadow: 0 5px 25px rgba(0,0,0,.08);
}

.archive-image img {
    width: 100%;
    height: 280px;
    object-fit: cover;
}

.archive-content {
    padding: 1.5rem;
}

.result-type {
    color: var(--horus-gold);
    text-transform: uppercase;
    font-size: .75rem;
    font-weight: bold;
    margin-bottom: .75rem;
}

/* =====================================================
   SINGLE TEMPLATES
===================================================== */

.temple-location {
    background: var(--limestone);
    padding: 1rem;
    margin-bottom: 2rem;
    border-left: 5px solid var(--horus-gold);
}

.details-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(250px,1fr));
    gap: 2rem;
}

.detail-card {
    background: white;
    padding: 1.5rem;
    border-top: 4px solid var(--horus-gold);
}

.term-badge {
    display: inline-block;
    background: var(--lapis-blue);
    color: white;
    padding: 4px 10px;
    margin: .25rem;
    border-radius: 4px;
    font-size: .8rem;
}

/* =====================================================
   TEMPLE 404
===================================================== */

.error-hero {
    text-align: center;
    padding: 8rem 0;
}

.error-code {
    font-size: 8rem;
    color: var(--horus-gold);
    line-height: 1;
}

.error-description {
    max-width: 700px;
    margin: 0 auto;
}

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

@media (max-width: 991px) {

    .temple-map-grid,
    .offerings-grid,
    .archive-grid,
    .category-grid,
    .house-benefits {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 768px) {

    .offerings-actions,
    .marketplace-actions,
    .sponsorship-actions,
    .house-actions {
        flex-direction: column;
        align-items: center;
    }

    .offerings-actions .button,
    .marketplace-actions .button,
    .sponsorship-actions .button,
    .house-actions .button {
        width: 100%;
        max-width: 350px;
    }

}
/* =====================================================
   MOBILE MENU
===================================================== */

.temple-menu-toggle {
    display: none;
    background: var(--horus-gold);
    color: white;
    border: 0;
    padding: 10px 15px;
    cursor: pointer;
}

/* =====================================================
   CURRENT PAGE
===================================================== */

.current-temple-page {
    color: var(--horus-gold) !important;
}

/* =====================================================
   REVEAL ANIMATION
===================================================== */

.temple-space,
.offering-card,
.archive-card {
    opacity: 0;
    transform: translateY(30px);
    transition: all .6s ease;
}

.temple-space.revealed,
.offering-card.revealed,
.archive-card.revealed {
    opacity: 1;
    transform: translateY(0);
}

/* =====================================================
   HEADER SCROLLED
===================================================== */

.site-header.header-scrolled {
    box-shadow: 0 5px 20px rgba(0,0,0,.15);
}

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

@media (max-width:768px) {

    .temple-menu-toggle {
        display: inline-block;
        margin-bottom: 1rem;
    }

    #primary-menu {
        display: none;
    }

    #primary-menu.menu-open {
        display: flex;
        flex-direction: column;
    }

}
/* =====================================================
   OFFERINGS INTERACTIONS
===================================================== */

.offering-card {
    transition: all .3s ease;
}

.offering-active {
    transform: translateY(-6px);
    box-shadow: 0 10px 30px rgba(0,0,0,.15);
}

.active-filter {
    background: var(--horus-gold);
    color: #fff;
}

.selected-donation {
    background: var(--lapis-blue);
    color: #fff;
}

.offering-card,
.sponsorship-card {
    opacity: 0;
    transform: translateY(20px);
}

.offering-card.revealed,
.sponsorship-card.revealed {
    opacity: 1;
    transform: translateY(0);
}