/* =========================================================
   COMPONENT LIBRARY V1
   DIVYA FOOD PROCESSING PRIVATE LIMITED
   ========================================================= */

/* =========================================================
   KPI SECTION
   ========================================================= */

.kpi-section {

    position: relative;

    margin-top: -100px;

    z-index: 20;
}

.kpi-grid {

    display: grid;

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

    gap: 25px;
}

.kpi-card {

    background: white;

    border-radius: var(--radius-lg);

    padding: 40px 30px;

    text-align: center;

    box-shadow: var(--shadow-lg);

    transition: var(--transition-normal);
}

.kpi-card:hover {

    transform: translateY(-10px);
}

.kpi-value {

    font-size: 3rem;

    font-weight: 800;

    font-family: 'Manrope', sans-serif;

    color: var(--forest-green);

    margin-bottom: 10px;
}

.kpi-title {

    color: var(--text-secondary);

    font-weight: 600;
}

/* =========================================================
   CORPORATE CTA
   ========================================================= */

.corporate-cta {

    position: relative;

    overflow: hidden;

    border-radius: var(--radius-lg);

    padding: 100px 80px;

    text-align: center;

    background:
        linear-gradient(
        135deg,
        var(--forest-green),
        var(--corporate-navy)
        );
}

.corporate-cta::before {

    content: '';

    position: absolute;

    width: 500px;
    height: 500px;

    border-radius: 50%;

    background:
        rgba(212,175,55,.08);

    top: -250px;
    right: -250px;
}

.corporate-cta h2 {

    color: white;

    margin-bottom: 20px;
}

.corporate-cta p {

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

    max-width: 800px;

    margin: 0 auto 35px;
}

/* =========================================================
   EXECUTIVE QUOTE
   ========================================================= */

.executive-quote {

    max-width: 950px;

    margin: 0 auto;

    text-align: center;
}

.executive-quote blockquote {

    font-size: 2rem;

    font-family: 'Manrope', sans-serif;

    line-height: 1.5;

    color: var(--corporate-navy);

    margin-bottom: 40px;
}

.executive-quote cite {

    font-style: normal;

    font-weight: 600;

    color: var(--forest-green);
}

/* =========================================================
   MARKET OPPORTUNITY
   ========================================================= */

.market-panel {

    background: white;

    border-radius: var(--radius-lg);

    padding: 50px;

    box-shadow: var(--shadow-md);
}

.market-grid {

    display: grid;

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

    gap: 30px;
}

.market-card {

    padding: 35px;

    border-radius: var(--radius-md);

    background: var(--background-soft);

    transition: var(--transition-normal);
}

.market-card:hover {

    transform: translateY(-6px);
}

.market-card h3 {

    color: var(--forest-green);
}

/* =========================================================
   STRATEGIC PILLARS
   ========================================================= */

.pillars-grid {

    display: grid;

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

    gap: 40px;
}

.pillar {

    background: white;

    border-radius: var(--radius-lg);

    padding: 50px;

    box-shadow: var(--shadow-sm);

    text-align: center;

    transition: var(--transition-normal);
}

.pillar:hover {

    transform: translateY(-10px);

    box-shadow: var(--shadow-lg);
}

.pillar-number {

    font-size: 4rem;

    font-weight: 800;

    color: rgba(212,175,55,.2);

    margin-bottom: 15px;
}

/* =========================================================
   IMAGE FEATURE SECTION
   ========================================================= */

.image-feature {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 70px;

    align-items: center;
}

.image-feature-image {

    position: relative;
}

.image-feature-image img {

    border-radius: var(--radius-lg);

    box-shadow: var(--shadow-lg);
}

.image-feature-content ul {

    margin-top: 25px;
}

.image-feature-content li {

    margin-bottom: 14px;

    color: var(--text-secondary);
}
/* =========================================================
   ROADMAP SYSTEM
   ========================================================= */

.roadmap {

    display: grid;

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

    gap: 25px;
}

.roadmap-step {

    position: relative;

    background: white;

    border-radius: var(--radius-lg);

    padding: 35px;

    text-align: center;

    box-shadow: var(--shadow-sm);

    transition: var(--transition-normal);
}

.roadmap-step:hover {

    transform: translateY(-10px);

    box-shadow: var(--shadow-lg);
}

.roadmap-phase {

    color: var(--premium-gold-dark);

    font-weight: 700;

    margin-bottom: 15px;
}

/* =========================================================
   INVESTOR PANEL
   ========================================================= */

.investor-card {

    background: white;

    border-radius: var(--radius-lg);

    padding: 40px;

    box-shadow: var(--shadow-sm);
}

.investor-card h3 {

    color: var(--forest-green);
}

.investor-grid {

    display: grid;

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

    gap: 30px;
}

/* =========================================================
   OPPORTUNITY GRID
   ========================================================= */

.opportunity-grid {

    display: grid;

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

    gap: 30px;
}

.opportunity-card {

    background: white;

    border-radius: var(--radius-md);

    padding: 35px;

    text-align: center;

    box-shadow: var(--shadow-sm);
}

/* =========================================================
   SANT GOLD SHOWCASE
   ========================================================= */

.brand-showcase {

    position: relative;

    overflow: hidden;

    border-radius: var(--radius-lg);

    background:
        linear-gradient(
        135deg,
        var(--forest-green),
        var(--corporate-navy)
        );

    padding: 80px;
}

.brand-showcase-grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 60px;

    align-items: center;
}

.brand-showcase h2 {

    color: white;
}

.brand-showcase p {

    color: rgba(255,255,255,.85);
}

.brand-tag {

    display: inline-block;

    padding: 10px 18px;

    border-radius: 999px;

    background:
        rgba(212,175,55,.15);

    color: var(--premium-gold);

    font-size: .85rem;

    font-weight: 600;

    margin-bottom: 20px;
}

/* =========================================================
   LEGAL DISCLAIMER BLOCK
   ========================================================= */

.disclosure-box {

    padding: 40px;

    border-radius: var(--radius-lg);

    background:
        rgba(11,31,58,.04);

    border-left: 6px solid var(--premium-gold);
}

.disclosure-box h3 {

    margin-bottom: 15px;
}

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

@media (max-width:1100px) {

    .kpi-grid,
    .market-grid,
    .pillars-grid,
    .investor-grid {

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

    .roadmap {

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

    .opportunity-grid {

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

    .image-feature,
    .brand-showcase-grid {

        grid-template-columns: 1fr;
    }
}

@media (max-width:768px) {

    .kpi-grid,
    .market-grid,
    .pillars-grid,
    .investor-grid,
    .roadmap,
    .opportunity-grid {

        grid-template-columns: 1fr;
    }

    .corporate-cta {

        padding: 60px 30px;
    }

    .brand-showcase {

        padding: 50px 30px;
    }

    .executive-quote blockquote {

        font-size: 1.4rem;
    }
}
    .corporate-cta .hero-buttons {

    justify-content: center;

    margin-top: 30px;
}