/* गॅलरी CSS - style.css चे व्हेरिएबल्स वापरते (--bg-surface, --royal-gold, --border-subtle ...) */
.gx-crumb{font-size:.9rem;color:var(--text-muted);margin-bottom:28px}
.gx-crumb a{color:var(--text-gold);text-decoration:none}
.gx-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:26px}
.gx-card{display:block;text-decoration:none;color:var(--text-white);background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:16px;padding:10px 10px 18px;text-align:center;box-shadow:var(--shadow-royal);transition:transform .4s cubic-bezier(.175,.885,.32,1.275),border-color .4s}
.gx-card:hover{transform:translateY(-6px);border-color:var(--royal-gold)}
.gx-cover{aspect-ratio:4/5;border-radius:10px;overflow:hidden;background:radial-gradient(circle at 50% 35%,#3a220c,var(--bg-deep));display:grid;place-items:center;font-size:2.6rem;margin-bottom:14px}
.gx-cover img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.gx-card:hover img{transform:scale(1.07)}
.gx-card h3{font-family:'Rozha One',serif;font-weight:400;font-size:1.15rem;line-height:1.6}
.gx-card small{color:var(--saffron)}
.gx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;align-items:start}
.gx-item{display:block;position:relative;border-radius:12px;overflow:hidden;background:var(--bg-surface);border:1px solid var(--border-subtle);text-decoration:none}
.gx-item img{display:block;width:100%;height:auto;transition:transform .5s}
.gx-item:hover img{transform:scale(1.05)}
.gx-item span{position:absolute;left:0;right:0;bottom:0;padding:26px 12px 10px;font-size:.85rem;color:var(--text-white);background:linear-gradient(transparent,rgba(15,10,5,.92));opacity:0;transition:.3s}
.gx-item:hover span{opacity:1}
.gx-text{max-width:760px;margin:0 auto 40px;text-align:center;color:var(--text-muted)}
.gx-photo{max-width:980px;margin:0 auto;text-align:center}
.gx-photo img{max-width:100%;max-height:72vh;width:auto;height:auto;border-radius:14px;border:1px solid var(--border-subtle);box-shadow:var(--shadow-royal)}
.gx-photo h1{font-family:'Rozha One',serif;font-weight:400;font-size:2rem;margin:26px 0 8px;color:var(--text-gold)}
.gx-photo p{color:var(--text-muted)}
.gx-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:26px 0}
.gx-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;background:var(--bg-surface);border:1px solid var(--border-subtle);color:var(--text-white);border-radius:8px;font:500 .9rem 'Poppins',sans-serif;cursor:pointer;text-decoration:none;transition:.3s}
.gx-btn:hover{border-color:var(--royal-gold);color:var(--royal-gold)}
.gx-btn.main{background:var(--gold-gradient);color:var(--bg-deep);border:0;font-weight:600}
.gx-pn{display:flex;justify-content:space-between;gap:12px;margin-top:10px}
.gx-more{margin-top:50px}
.gx-toast{position:fixed;left:50%;bottom:30px;transform:translateX(-50%);background:var(--royal-gold);color:var(--bg-deep);padding:10px 22px;border-radius:30px;font-weight:600;opacity:0;pointer-events:none;transition:.3s;z-index:2000}
.gx-toast.on{opacity:1}
@media(max-width:640px){.gx-grid{grid-template-columns:repeat(2,1fr);gap:10px}.gx-cards{grid-template-columns:repeat(2,1fr);gap:14px}.gx-photo h1{font-size:1.5rem}}

/* मध्यम स्क्रीनवर (टॅबलेट / लहान लॅपटॉप) मेनूचे शब्द तुटू नयेत म्हणून.
   हेच नियम तुमच्या style.css च्या शेवटी टाकल्यास सर्व पेजेसवर लागू होतील. */
@media (min-width: 769px) and (max-width: 1180px) {
    .nav-container { gap: 12px; }
    .nav-links { gap: 14px; }
    .nav-links a { font-size: 0.86rem; white-space: nowrap; }
    .btn-nav { padding: 8px 14px; font-size: 0.85rem; white-space: nowrap; }
}
@media (min-width: 769px) and (max-width: 960px) {
    .nav-cta { display: none; }
    .nav-links { gap: 10px; }
    .nav-links a { font-size: 0.8rem; }
}
@media (min-width: 769px) and (max-width: 810px) {
    .nav-links { gap: 7px; }
    .nav-links a { font-size: 0.75rem; }
}
