/* Title */
.title {
    padding: 5rem 0 8rem 0;
}

.title h1 {
    font-family: 'Playfair Display', serif;
    font-size: clamp(4rem, 8vw, 6.5rem);
    line-height: 1;
    margin: 20px 0 60px 0;
    font-style: italic;
}

.meta-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-top: 1px solid var(--border);
    padding-top: 40px;
}

.meta-item h4 {
    text-transform: uppercase;
    color: var(--text-secondary); /* Fixed from undefined --text-s */
    margin-bottom: 10px;
    font-size: 1rem;
    font-family: 'Inter', sans-serif;
}



/* Split/Reverse Layouts */
.split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10rem;
}

.split.reverse {
    direction: rtl;
}

.split.reverse .text-block {
    direction: ltr;
}

.sub-split {
    display: grid;
    grid-template-columns: 1.5fr 3fr;
    grid-auto-flow: column;
    gap: 5rem;
}

/* General Sections */
section {
    padding: var(--spacing, 8rem) 0; 
}

.no-border-top { 
    border-top: none !important; 
}

.text-block h2 {
    font-family: 'Playfair Display', serif;
    margin-bottom: 25px;
    line-height: 1.2;
}

.text-block p {
    color: var(--text-primary);
    margin-bottom: 20px;
}

.text-block ul {
    padding-left: 2rem;
}

/* Pillars Grid */
.pillar-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4rem;
    margin-top: 4rem;
    cursor: default;
}

.pillar-card {
    text-align: center;
}

.pillar-card h3 {
    font-family: 'Playfair Display', serif;
    font-style: italic;
    margin-bottom: 10px;
    background-image: linear-gradient(to right, #ffdb0d, #ffe13500);
    background-repeat: no-repeat;
    background-size: 0% 100%;
    transition: background-size 0.9s ease-in-out;
}

.pillar-card h3:hover {
    background-size: 100% 100%;
}

.pillar-card p {
    color: var(--text-secondary);
}

.logo-card img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
}

/* Gallery */
.dynamic-gallery {
    display: grid;
    grid-auto-rows: auto;
    grid-auto-flow: dense;
    gap: 0;
    margin: 0 0;
}

.gallery-item {
    overflow: hidden;
}

.gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gallery-gap { gap: 1rem; }
.tall { grid-row: span 2; }
.wide { grid-column: span 2; }
.large { grid-column: span 2; grid-row: span 2; }
.full { grid-column: span 6; }

.three-col { grid-template-columns: repeat(auto-fill, minmax(25rem, 1fr)); }
.two-col { grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); }
.sub-two-col { grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); }

/* Website Section */
.website-view {
    aspect-ratio: 16/9;
    overflow-y: hidden;
    object-fit: cover;
}

.website-view img{
    width: 100%;
    height: auto;
    display: block;
}

/* Videos */
.video-embed-container {
    width: 100%;
    aspect-ratio: 16/9;
}

.video-embed-container iframe {
    width: 100%;
    height: 100%;
    display: block;
}

/* --- REQUIRED ADDITIONS (Responsiveness Only) --- */

/* Non-Destructive Mobile & Tablet Overrides */
@media (max-width: 1024px) {
    .split, .sub-split { 
        grid-template-columns: 1fr; 
        grid-auto-flow: row; 
        gap: 2rem; 
    }
    .meta-grid { 
        grid-template-columns: repeat(2, 1fr); 
        gap: 1.5rem; 
    }

    .meta-item h4 { font-size: 1.2rem;}

    .pillar-grid { 
        grid-template-columns: repeat(2, 1fr); 
        gap: 4rem; 
        margin-top: 6rem;
    }
    .wide, .large, .tall, .full { 
        grid-column: auto; 
        grid-row: auto; 
    }
    .three-col { grid-template-columns: 1fr}
    .gallery-gap { gap: 2rem;}
}

@media (max-width: 768px) {
    .pillar-grid { 
        grid-template-columns: 1fr; 
    }

    .meta-grid { grid-template-columns: 1fr}
}