/* Case Study Hero Section */
.case-study-hero {
    position: relative;
    padding: 140px 0;
    background-color: #000;
    overflow: hidden;
    min-height: 620px;
    display: flex;
    align-items: center;
}

.hero-bg-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    /* filter: grayscale(100%) brightness(30%); */
    /* opacity: 0.6; */
    z-index: 0;
}


.case-hero-grid {
    display: flex;
    gap: 60px;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 2;
}


.logo-display {
    max-width: 380px;
    height: auto;
    position: relative;
    z-index: 2;
}


/* Typography Hierarchy */
.case-main-title {
    font-family: 'Prata', serif;
    font-size: 84px;
    color: #fff;
    line-height: 1.1;
}

.case-main-title .text-signature {
    font-size: 84px;
}

.project-name {
    font-family: 'Garet', sans-serif;
    font-weight: 300;
    font-size: 64px;
    display: block;
    margin-top: 10px;
}


/* Mobile Responsiveness */
@media (max-width: 1024px) {
    .case-hero-grid {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .case-visual-box {
        max-width: 450px;
        margin: 0 auto;
    }

    .case-main-title {
        font-size: 48px;
    }
}





/* Case Study Narrative Styles */
.case-study-details {
    padding: 100px 24px;
    background-color: var(--body-bg);
}

.project-meta-grid {
    display: grid;
    justify-items: end;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 100px;
    margin-bottom: 100px;
}

.case-description {
    font-family: 'Garet', sans-serif;
    font-size: 20px;
    line-height: 1.5;
    margin-top: 30px;
    opacity: 0.9;
}

.eyebrow-red {
    color: rgba(246, 0, 67, 1) !important;
    font-family: Garet;
font-weight: 300;
    font-size: 24px;
    line-height: 48px;
    letter-spacing: 2%;
    text-transform: capitalize;

}

/* Metadata Box */

.meta-info-box{
    max-width: 428px;
}
.meta-info-box .meta-label {
    font-family: 'Garet', sans-serif;
    font-weight: 850;
    font-size: 16px;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 10px;
}

.meta-info-box .meta-label::before {
    content: '';
    width: 8px;
    height: 8px;
    background: #A30933;
    border-radius: 50%;
}

.meta-role-card {
    background: rgba(28, 28, 28, 1);
    padding: 30px;
    border-radius: 27px;
}

.completion-date{
    font-family: Garet;
font-weight: 300;
font-size: 16px;
line-height: 48px;
letter-spacing: 66%;
text-transform: capitalize;
color: rgba(246, 0, 67, 1);
text-align: center;

}

/* Stats Section within Case Study */
.case-stats-wrapper .stats-title {
    font-size: 110px;
    margin-bottom: 40px;
}

.case-stats-wrapper .stats-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.case-stats-wrapper .stat-card {
    background: #111;
    padding: 40px 20px;
    border-radius: 12px;
}

.case-stats-wrapper .stat-number {
    font-family: 'Prata', serif;
    font-size: 64px;
}

.case-stats-wrapper .stat-label {
    font-family: 'Garet', sans-serif;
    color: #D63763;
    font-size: 20px;
    margin-top: 10px;
}

.case-stats-wrapper .stat-sub {
    font-family: 'Garet', sans-serif;
    opacity: 0.6;
    font-size: 14px;
}

/* Strategic Decision Styling */
.strategic-decision-content {
    margin: 100px 0 0;
}

.strategic-decision-content p{
    font-family: Garet;
font-weight: 300;
font-size: 20px;
letter-spacing: 2%;
text-transform: capitalize;
color: rgba(255, 255, 255, 1);

}

.emotional-truth-quote {
    font-weight: 850;
}

.strategy-pillars-list {
    list-style: none;
    padding: 0;
    margin-top: 30px;
}

.strategy-pillars-list li {
    font-family: 'Garet', sans-serif;
    font-size: 20px;
    margin-bottom: 20px;
    padding-left: 30px;
    position: relative;
    opacity: 0.9;
}

.strategy-pillars-list li::before {
    content: "◉";
    color: #A30933;
    position: absolute;
    left: 0;
}

/* Responsive */
@media (max-width: 1024px) {

    .project-meta-grid,
    .case-stats-wrapper .stats-grid {
        grid-template-columns: 1fr;
    }

    .case-stats-wrapper .stats-title {
        font-size: 80px;
    }
}






/* Case Study Execution Section */
.case-execution-section {
    padding: 100px 24px;
    background-color: var(--body-bg);
    position: relative;
    overflow: hidden;
}

/* Red atmospheric glow on the right */
.case-execution-section::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -10%;
    transform: translateY(-50%);
    width: 600px;
    height: 600px;
    background-color: rgba(86, 23, 40, 1);
    border-radius: 50%;
    filter: blur(80px);
    z-index: 0;
}

.execution-lead {
    font-family: 'Garet', sans-serif;
    font-size: 20px;
    line-height: 1.5;
    max-width: 800px;
    margin-top: 25px;
    opacity: 0.9;
}

.execution-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
    position: relative;
    z-index: 1;
}

/* Deliverables Dark Box */
.deliverables-box {
    background: #111; /* Deeper dark for high contrast */
    padding: 60px;
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.deliverables-box .box-label {
    font-family: 'Garet', sans-serif;
    font-size: 18px;
    margin-bottom: 35px;
    opacity: 0.8;
}

/* Red Dot List Styling consistent with branding pages */
.deliverables-box .red-dot-list {
    list-style: none;
    padding: 0;
}

.deliverables-box .red-dot-list li {
    font-family: 'Garet', sans-serif;
    font-weight: 300;
    font-size: 18px;
    line-height: 1.4;
    margin-bottom: 20px;
    padding-left: 25px;
    position: relative;
}

.deliverables-box .red-dot-list li::before {
    content: "◉";
    color: #A30933; /* Primary Brand Red */
    position: absolute;
    left: 0;
    font-size: 14px;
}

/* Right Summary Content */
.summary-highlight {
    font-family: 'Garet', sans-serif;
    font-size: 20px;
    font-weight: 300;
    opacity: 0.9;
}

.summary-body p {
    font-family: 'Garet', sans-serif;
    font-size: 20px;
    line-height: 1.6;
    opacity: 0.8;
}

/* Responsive Scaling */
@media (max-width: 1024px) {
    .execution-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }
    
    .deliverables-box {
        padding: 40px;
    }
    
    .execution-lead {
        font-size: 18px;
    }
}









/* Testimonial & Results Section */
.case-testimonial-results {
    padding: 100px 24px;
    background-color: var(--body-bg);
}

/* Testimonial Card */
.testimonial-cardd {
    background: rgba(26, 26, 26, 1);
    max-width: 800px;
    margin: 0 auto 100px;
    padding: 80px 60px;
    border-radius: 40px;
    position: relative;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.quote-mark {
    color: #D63763;
    font-size: 100px;
    font-family: 'Prata', serif;
    position: absolute;
    top: 20px;
    left: 40px;
    line-height: 1;
}

.testimonial-text {
    margin-top: 30px;
    font-family: 'Garet', sans-serif;
    font-size: 20px;
    line-height: 1.6;
    color: #fff;
    opacity: 0.9;
    position: relative;
    z-index: 1;
}

/* Difference Headline */
.promotion-positioning-break {
    margin-bottom: 100px;
}

.difference-title {
    font-family: 'Prata', serif;
    font-size: 92px;
    line-height: 1.1;
    color: #fff;
}

.difference-title .text-signature {
    font-size: 110px;
    color: #D63763;
}

/* Results Content */

.results-lead {
    font-family: 'Garet', sans-serif;
    font-size: 24px;
    margin-bottom: 30px;
}

.results-body {
    font-family: 'Garet', sans-serif;
    font-weight: 300;
    font-size: 18px;
    line-height: 1.6;
    margin-bottom: 25px;
    opacity: 0.85;
}

.results-metrics-list {
    list-style: none;
    padding: 0;
}

.results-metrics-list li {
    font-family: 'Garet', sans-serif;
    font-size: 18px;
    margin-bottom: 15px;
    padding-left: 25px;
    position: relative;
}

.results-metrics-list li::before {
    content: "◉";
    color: #A30933;
    position: absolute;
    left: 0;
}

.it-was-landing {
    font-family: 'Garet', sans-serif;
    font-weight: 850;
    font-size: 20px;
    margin-top: 40px;
    color: #fff;
}

/* Responsive Scaling */
@media (max-width: 1024px) {
    .difference-title { font-size: 56px; }
    .difference-title .text-signature { font-size: 68px; }
    .testimonial-cardd { padding: 60px 30px; }
}










/* Case Study Experiential Section */
.case-experiential-moment {
    padding: 100px 24px;
    background-color: var(--body-bg);
    position: relative;
    overflow: hidden;
}

/* Red atmospheric glow on the right edge */
.case-experiential-moment::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -10%;
    transform: translateY(-50%);
    width: 600px;
    height: 600px;
    background-color: rgba(86, 23, 40, 1);
    border-radius: 50%;
    filter: blur(80px);
    z-index: 0;
}

.intro-stack p {
    font-family: 'Garet', sans-serif;
    font-size: 20px;
    line-height: 1.6;
    margin-bottom: 25px;
    opacity: 0.9;
    max-width: 900px;
}

.experiential-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
    position: relative;
    z-index: 1;
}

/* Event Details Box Styling */
.event-details-box {
    background: #111;
    padding: 60px;
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.event-details-box .red-dot-list {
    list-style: none;
    padding: 0;
}

.event-details-box .red-dot-list li {
    font-family: 'Garet', sans-serif;
    font-weight: 300;
    font-size: 18px;
    line-height: 1.5;
    margin-bottom: 25px;
    padding-left: 30px;
    position: relative;
    color: rgba(255, 255, 255, 0.85);
}

.event-details-box .red-dot-list li:last-child { margin-bottom: 0; }

.event-details-box .red-dot-list li::before {
    content: "◉";
    color: #A30933;
    position: absolute;
    left: 0;
    font-size: 14px;
}

/* Narrative Styling */
.community-summary p {
    font-family: 'Garet', sans-serif;
    font-size: 20px;
    line-height: 1.6;
    opacity: 0.85;
}

.community-impact-statement {
    font-family: 'Garet', sans-serif;
    font-weight: 850;
    font-size: 24px;
    color: #fff;
    margin-top: 15px;
}

.experiential-footer p {
    font-family: 'Garet', sans-serif;
    font-size: 20px;
    line-height: 1.4;
    opacity: 0.8;
}

/* Responsive Scaling */
@media (max-width: 1024px) {
    .experiential-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }
    
    .event-details-box { padding: 40px; }
}






/* Case Results Section Styles */
.case-results-summary {
    padding: 100px 24px;
    background-color: var(--body-bg);
}

.results-main-title {
    font-family: 'Prata', serif;
    font-size: 82px;
    margin-bottom: 60px;
}

/* 4-Column Stats Grid */
.results-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.result-stat-card {
    background: #111;
    padding: 50px 20px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.result-stat-card .stat-number {
    font-family: 'Prata', serif;
    font-size: 56px;
    color: #fff;
}

.result-stat-card .stat-label {
    font-family: 'Garet', sans-serif;
    font-size: 18px;
    color: #D63763;
    margin: 10px 0 5px;
}

.result-stat-card .stat-sub {
    font-family: 'Garet', sans-serif;
    font-size: 13px;
    opacity: 0.6;
}

/* Narrative Text */
.deeper-title {
    font-family: 'Garet', sans-serif;
    font-weight: 850;
    font-size: 20px;
    margin-top: 80px;
}

.deeper-content p {
    font-family: 'Garet', sans-serif;
    font-size: 20px;
    line-height: 1.6;
    max-width: 900px;
    margin: 0 auto 25px;
    opacity: 0.85;
}

/* Why This Worked Grid */
.why-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 100px;
}

.why-item-title {
    font-family: 'Garet', sans-serif;
    font-weight: 850;
    font-size: 19px;
    line-height: 1.4;
    padding-left: 25px;
    position: relative;
    margin-bottom: 20px;
}

.why-item-title::before {
    content: "◉";
    color: #A30933;
    position: absolute;
    left: 0;
    font-size: 14px;
}

.why-item-text {
    font-family: 'Garet', sans-serif;
    font-size: 17px;
    line-height: 1.6;
    opacity: 0.8;
}

/* Responsive Scaling */
@media (max-width: 1100px) {
    .results-stats-grid { grid-template-columns: repeat(2, 1fr); }
    .why-grid { grid-template-columns: 1fr; gap: 50px; }
}

@media (max-width: 600px) {
    .results-stats-grid { grid-template-columns: 1fr; }
    .results-main-title { font-size: 52px; }
}




/* What This Proves Section */
.case-study-proves {
    padding: 100px 24px;
    background-color: rgba(13, 13, 13, 1);
}

.proves-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
}

.proves-text {
    font-family: 'Garet', sans-serif;
    font-weight: 300;
    font-size: 20px;
    line-height: 1.6;
    margin-bottom: 25px;
    opacity: 0.85;
}

.proves-text-highlight {
    font-family: 'Garet', sans-serif;
    font-size: 20px;
    opacity: 0.9;
}

/* Strategic Takeaway Footer with Gradient */
.strategic-takeaway-footer {
    padding: 140px 24px;
    position: relative;
    overflow: hidden;
}
.strategic-takeaway-footer::before {
    content: '';
    position: absolute;
    top: -100px;
    right: 0;
    width: 400px;
    height: 400px;
    background-color: rgba(86, 23, 40, 1);
    border-radius: 50%;
    filter: blur(100px);
    z-index: 0;
}

.takeaway-lead, .takeaway-body {
    font-family: 'Garet', sans-serif;
    font-weight: 300;
    font-size: 20px;
    line-height: 1.6;
    margin-bottom: 35px;
    opacity: 0.85;
}

.takeaway-statement {
    font-family: 'Garet', sans-serif;
    font-size: 22px;
    line-height: 1.4;
    color: #fff;
    margin-top: 50px;
}

.takeaway-statement strong {
    font-weight: 850;
    display: block;
    font-size: 26px;
    margin-top: 10px;
}

/* Responsive Scaling */
@media (max-width: 1024px) {
    .proves-grid {
        grid-template-columns: 1fr;
        gap: 0;
    }
    .takeaway-statement strong {
        font-size: 22px;
    }
}







.gallery-section{
    padding: 100px 0;
    background-color: var(--body-bg);
}

.gallery-main-title{
    font-family: 'Prata', serif;
    font-size: 92px;
    line-height: 1.1;
    color: #fff;
    text-align: center;
}



.gallery-main-img{
    width: 100%;
    height: 100%;
    margin-top: 100px;
}

.gallery-main-img img{
    width: 100%;
    height: 100%;
}
.gallery-grid{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin-top: 35px;
}

.grid-5{
    grid-template-columns: repeat(5, 1fr);
}

.gallery-grid img{
    width: 100%;
    height: 100%;
}

/* ==========================================================================
   Responsive Styles for Tablets and Mobile
   ========================================================================== */

@media (max-width: 1200px) {
    .case-main-title {
        font-size: 64px;
    }
    .case-main-title .text-signature {
        font-size: 64px;
    }
    .project-name {
        font-size: 48px;
    }
    .difference-title {
        font-size: 72px;
    }
    .difference-title .text-signature {
        font-size: 86px;
    }
}

@media (max-width: 1024px) {
    /* Layout Adjustments */
    .case-hero-grid,
    .project-meta-grid,
    .execution-grid,
    .experiential-grid,
    .proves-grid {
        grid-template-columns: 1fr !important;
        gap: 50px;
        text-align: left;
    }

    .case-hero-grid {
        flex-direction: column-reverse;
        text-align: center;
    }
    
    .project-meta-grid {
        justify-items: start;
    }

    .meta-info-box {
        max-width: 100%;
        width: 100%;
    }

    .case-stats-wrapper .stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .results-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .why-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    /* Padding Adjustments */
    .case-study-hero { min-height: 500px; padding: 100px 0; }
    .case-study-details,
    .case-execution-section,
    .case-testimonial-results,
    .case-experiential-moment,
    .case-results-summary,
    .case-study-proves {
        padding: 80px 24px;
    }
    
    .strategic-takeaway-footer {
        padding: 80px 24px;
    }

    /* Typography Scaling */
    .case-main-title { font-size: 56px; }
    .case-main-title .text-signature { font-size: 56px; }
    .project-name { font-size: 42px; }
    .case-stats-wrapper .stats-title { font-size: 80px; }
    .difference-title { font-size: 56px; }
    .difference-title .text-signature { font-size: 68px; }
    .results-main-title { font-size: 64px; }
    .gallery-main-title { font-size: 64px; }

    /* Gallery Details */
    .gallery-grid {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px;
    }
    .gallery-main-img {
        margin-top: 60px;
    }
}

@media (max-width: 768px) {
    /* Section Margins */
    .project-meta-grid { margin-bottom: 60px; }
    .strategic-decision-content { margin: 60px 0 0; }
    .promotion-positioning-break { margin-bottom: 60px; }
    .testimonial-cardd { margin: 0 auto 60px; padding: 50px 30px; }

    /* Stats Grid */
    .case-stats-wrapper .stats-grid,
    .results-stats-grid {
        grid-template-columns: 1fr !important;
    }

    /* Typography Scaling */
    .case-main-title { font-size: 48px; }
    .case-main-title .text-signature { font-size: 48px; }
    .project-name { font-size: 36px; }
    .case-stats-wrapper .stats-title { font-size: 60px; }
    .case-stats-wrapper .stat-number { font-size: 48px; }
    .difference-title { font-size: 42px; }
    .difference-title .text-signature { font-size: 52px; }
    .results-main-title { font-size: 48px; }
    .result-stat-card .stat-number { font-size: 48px; }
    .gallery-main-title { font-size: 48px; }
    .eyebrow-red { font-size: 20px; line-height: 1.4; }

    /* General Body Typography */
    .case-description,
    .strategic-decision-content p,
    .execution-lead,
    .summary-body p,
    .testimonial-text,
    .results-lead,
    .results-body,
    .intro-stack p,
    .community-summary p,
    .experiential-footer p,
    .proves-text,
    .proves-text-highlight,
    .takeaway-lead,
    .takeaway-body {
        font-size: 18px;
    }

    .strategy-pillars-list li,
    .deliverables-box .red-dot-list li,
    .results-metrics-list li,
    .event-details-box .red-dot-list li {
        font-size: 16px;
    }

    .deliverables-box,
    .event-details-box {
        padding: 40px 20px;
    }

    .quote-mark { font-size: 60px; }
}

@media (max-width: 576px) {
    /* Padding Adjustments */
    .case-study-hero { padding: 80px 0; min-height: auto; }
    .case-study-details,
    .case-execution-section,
    .case-testimonial-results,
    .case-experiential-moment,
    .case-results-summary,
    .case-study-proves,
    .strategic-takeaway-footer {
        padding: 60px 16px;
    }

    /* Typography Scaling for Mobile */
    .case-main-title { font-size: 36px; }
    .case-main-title .text-signature { font-size: 36px; }
    .project-name { font-size: 28px; }
    .case-stats-wrapper .stats-title { font-size: 48px; }
    .case-stats-wrapper .stat-number { font-size: 40px; }
    .difference-title { font-size: 32px; }
    .difference-title .text-signature { font-size: 40px; }
    .results-main-title { font-size: 38px; }
    .result-stat-card .stat-number { font-size: 40px; }
    .gallery-main-title { font-size: 38px; }
    
    .takeaway-statement { font-size: 18px; }
    .takeaway-statement strong { font-size: 20px; }
    .it-was-landing { font-size: 18px; }
    .community-impact-statement { font-size: 20px; }
    .deeper-title { margin-top: 50px; }

    /* Meta Info Grid Fix */
    .meta-top.row {
        flex-direction: column;
        gap: 20px;
    }
    .meta-top.row .col-6 {
        width: 100%;
    }

    /* Gallery */
    .gallery-grid {
        gap: 15px;
    }
    
    .gallery-grid img {
        height: 250px;
        object-fit: cover;
    }
    
    .meta-role-card { padding: 20px; }

    /* Scale Down Logo */
    .logo-display {
        max-width: 250px;
    }
}