:root {
    --header-gradient: linear-gradient(to right, #eee2c2b6, #a45a1abe, #5a2a00);

    --navbar-gradient: linear-gradient(135deg, #2e0b03, #6b1414, #d97706);
    --footer-gradient: linear-gradient(135deg, #1a0702, #3b1a05, #8b5a20);
    --bg-gradient: linear-gradient(to bottom, #f2d6a0, #d4aa6a, #b07c3a);
    --card-bg: linear-gradient(145deg, #f3e0c3, #d4b07a);

    --text-dark: #1a0b05;
    --text-light: #fdf3e7;
    --saffron: #d97706;
    --gold: #b8860b;
}
/* ===============================
   PRAKASHAN SECTION – FIXED
=============================== */

.prakashanmain-wrapper {
    display: flex;
    gap: 15px;
    background: var(--bg-gradient);
}

/* ---------- LEFT PUBLICATION ---------- */
.prakashanpublication-section {
    width: 70%;
    padding: 15px;
    border-radius: 8px;
    background: var(--card-bg);
}

/* heading */
.prakashanpublication-section h2 {
    border-left: 5px solid var(--saffron);
    padding-left: 10px;
    margin-bottom: 10px;
}

/* slider wrapper */
.publication-wrapper {
    overflow: hidden;
    width: 100%;
}

/* ===== TRACK (IMPORTANT FIX) ===== */
.publication-track {
    display: flex;
    gap: 15px;
    transition: transform 0.6s ease;
    will-change: transform;
}

/* ===== CARD ===== */
.prakashanpub-card {
    flex: 0 0 calc((100% - 45px) / 4); /* 4 cards desktop */
    background: var(--card-bg);
    padding: 10px;
    border-radius: 8px;
    box-shadow: 0 3px 8px rgba(0,0,0,0.15);
    text-align: center;
}

/* image safe zoom */
.book-link {
    display: block;
    overflow: hidden;
    border-radius: 6px;
}

.prakashanpub-card img {
    height: 350px;
    object-fit: contain;   /* image stretch nahi hogi */
    background: #fff;      /* empty space clean lage */
}

.prakashanpub-card:hover img {
    transform: scale(1.08);
}

.prakashanpub-card h5 {
    margin: 6px 0 4px;
    font-size: 14px;
}

.price {
    color: var(--saffron);
    font-weight: bold;
}

/* ---------- RIGHT GALLERY ---------- */
.prakashan-gallery-section {
    width: 30%;
    padding: 15px;
    border-radius: 8px;
    background: var(--card-bg);
}

.prakashan-gallery-section h2 {
    border-left: 5px solid var(--saffron);
    padding-left: 10px;
    margin-bottom: 10px;
}

.prakashan-gallery-card {
    position: relative;
    height: 350px;
    border-radius: 8px;
    overflow: hidden;
}

.prakashan-gallery-card img {
    width: 100%;
    height: 100%;
    /* object-fit: cover; */
}

/* ---------- SLIDER CONTROLS ---------- */
.pub-slider-controls {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-bottom: 10px;
}

.pub-btn {
    background: var(--saffron);
    color: #fff;
    border: none;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 18px;
}

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

/* -------- TABLET -------- */
@media (max-width: 1199px) {

    .prakashanmain-wrapper {
        flex-direction: column;
    }

    .prakashanpublication-section,
    .prakashan-gallery-section {
        width: 100%;
    }

    .prakashanpub-card {
        flex: 0 0 calc((100% - 15px) / 2); /* 2 cards */
    }
}

/* -------- MOBILE -------- */
@media (max-width: 767px) {

    .pub-slider-controls {
        justify-content: center;
    }

    .prakashanpub-card {
        flex: 0 0 100%; /* 1 card */
    }

    .prakashanpub-card img {
        height: 350px;
    }

    .prakashan-gallery-card {
        height: 280px;
    }
}

/* ===== VIEW ALL BOOKS BUTTON ===== */
.view-all-container {
    margin-top: 15px;
    text-align: center;
}

.view-all-btn {
    display: inline-block;
    padding: 10px 18px;
    background: linear-gradient(135deg, #d97706, #b45309);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    border-radius: 25px;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 10px rgba(0,0,0,0.25);
}

.view-all-btn:hover {
    background: linear-gradient(135deg, #b45309, #92400e);
    transform: translateY(-2px);
}

/* ===== VIEW MORE GALLERY BUTTON ===== */
.view-more-btn {
    margin-top: 15px;
    text-align: center;
}

.view-more-btn a {
    display: inline-block;
    padding: 10px 22px;
    background: linear-gradient(135deg, #6b1414, #d97706);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    border-radius: 25px;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 10px rgba(0,0,0,0.25);
}

.view-more-btn a:hover {
    background: linear-gradient(135deg, #5a2a00, #b45309);
    transform: translateY(-2px);
}

@media (max-width: 767px) {

    .view-all-container {
        text-align: center;
    }

    .view-all-btn,
    .view-more-btn a {
        width: 100%;
        max-width: 260px;
        font-size: 15px;
    }
}