@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Devanagari:wght@400;700&family=Poppins:wght@400;600&display=swap');

* { margin:0; padding:0; box-sizing:border-box; }
html { font-size:16px; }
body { font-family:'Poppins',sans-serif; background:#fff8e1; color:#333; line-height:1.6; }
img { max-width:100%; height:auto; display:block; }
a { text-decoration:none; color:inherit; }
ul { list-style:none; }

h1, h2, h3, h4 { font-family:'Noto Sans Devanagari',sans-serif; color:#ff9933; }
.container { max-width:1200px; margin:auto; padding:0 1rem; }

/* Header */
.sticky-header { position:sticky; top:0; background:#ff9933; z-index:1000; }
.navbar { display:flex; justify-content:space-between; align-items:center; padding:1rem 0; }
.logo a { font-size:1.5rem; color:#fff8e1; font-weight:700; }
.nav-links { display:flex; gap:1.2rem; flex-wrap:wrap; }
.nav-links a { color:#fff8e1; font-weight:500; font-size:0.95rem; transition:.3s; }
.nav-links a:hover { color:#fff; }

/* Hero - 100% Mobile Responsive */
.hero {
  background: linear-gradient(135deg, #ff9933, #ffb84d);
  color: #fff8e1;
  text-align: center;
  padding: 4rem 1rem 3rem;
  position: relative;
  overflow: hidden;
}

.hero::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0, 0, 0, 0.15);
  z-index: 1;
}

.hero-content { position: relative; z-index: 2; }

.hero-text-overlay {
  background: rgba(0, 0, 0, 0.6);
  padding: 1.5rem 2rem;
  border-radius: 20px;
  display: inline-block;
  backdrop-filter: blur(10px);
  box-shadow: 0 12px 32px rgba(0,0,0,0.35);
  margin-bottom: 1.8rem;
  max-width: 95%;
}

.hero-title {
  color: #FFD700 !important;
  font-size: 2.8rem;
  font-weight: 900;
  margin: 0;
  text-shadow: 2px 2px 8px #000;
  letter-spacing: 1px;
  line-height: 1.2;
}

.subtitle {
  color: #FFFFFF;
  font-size: 1.15rem;
  margin: 0.8rem 0 0;
  font-weight: 500;
  text-shadow: 1px 1px 6px #000;
}

/* Hero Buttons - Wrap on Mobile */
.hero-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  justify-content: center;
  margin-top: 1.2rem;
}

.btn-primary {
  background: #fff;
  color: #ff9933;
  padding: 0.7rem 1.3rem;
  border-radius: 50px;
  font-weight: 600;
  font-size: 0.95rem;
  transition: all .3s ease;
  box-shadow: 0 3px 10px rgba(0,0,0,0.15);
  white-space: nowrap;
  min-width: 140px;
}

.btn-primary:hover {
  background: #FFD700;
  color: #D84315;
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(255, 215, 0, 0.4);
}

/* Grid - 2 Columns on Mobile */
.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 1rem;
  margin-top: 1.5rem;
}

.card {
  background: #ff9933;
  color: #fff8e1;
  padding: 1.2rem;
  text-align: center;
  border-radius: 12px;
  font-weight: 600;
  font-size: 0.95rem;
  transition: all .3s ease;
  box-shadow: 0 3px 10px rgba(255, 153, 51, 0.3);
}

.card:hover {
  background: #e68a00;
  transform: translateY(-4px);
}

/* Daily Mantra */
.daily-mantra {
  background: #fff;
  border-radius: 12px;
  padding: 2rem 1.5rem;
  margin: 2.5rem auto;
  max-width: 900px;
  box-shadow: 0 4px 16px rgba(0,0,0,.1);
  text-align: center;
}

.mantra-box {
  background: #ff9933;
  color: #fff8e1;
  padding: 1.5rem;
  border-radius: 12px;
  margin-top: 1rem;
}

.mantra-text {
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: .5rem;
}

.mantra-meaning {
  font-size: 1rem;
  opacity: 0.9;
}

/* Blog */
.blog-preview { margin:3rem 0; }
.blog-grid { display:grid; grid-template-columns:1fr; gap:1.5rem; }
.blog-card { background:#fff; border-radius:8px; padding:1.5rem; box-shadow:0 2px 8px rgba(0,0,0,.1); }
.blog-card h3 { margin-bottom:.5rem; color:#ff9933; font-size:1.2rem; }
.read-more { color:#ff9933; font-weight:600; }

/* AdSense */
.adsense-container { margin:2rem 0; text-align:center; }
.adsense-slot { min-height:100px; background:#f0f0f0; display:flex; align-items:center; justify-content:center; border-radius:8px; }

/* Footer */
.site-footer {
  background:#ff9933;
  color:#fff8e1;
  padding:2.5rem 0;
  margin-top:4rem;
  text-align:center;
}

.footer-grid {
  display:grid;
  grid-template-columns:1fr;
  gap:1.5rem;
  max-width:1000px;
  margin:0 auto 1.5rem;
}

.site-footer a { color:#fff; font-weight:500; }
.site-footer a:hover { text-decoration:underline; }

.footer-bottom {
  font-size:.9rem;
  opacity:0.9;
}

/* ===================================
   100% MOBILE RESPONSIVE
   =================================== */
@media (max-width: 768px) {
  .navbar { flex-direction:column; gap:0.8rem; padding:0.8rem 0; }
  .nav-links { gap:0.8rem; justify-content:center; }
  .nav-links a { font-size:0.9rem; }

  .hero { padding:3rem 1rem 2.5rem; }
  .hero-title { font-size:2.1rem !important; letter-spacing:1px; }
  .subtitle { font-size:1.05rem; }
  .hero-text-overlay { padding:1.2rem 1.5rem; border-radius:16px; }
  .hero-buttons { gap:0.6rem; }
  .btn-primary { padding:0.6rem 1.1rem; font-size:0.9rem; min-width:120px; }

  .grid { grid-template-columns:repeat(2,1fr); gap:0.8rem; }
  .card { padding:1rem; font-size:0.9rem; }

  .daily-mantra { margin:2rem 1rem; padding:1.8rem 1.2rem; }
  .mantra-text { font-size:1.3rem; }

  .blog-grid { gap:1.2rem; }
  .blog-card h3 { font-size:1.1rem; }
}
/* Pure Hindi Chalisa - Clean & Devotional */
.chalisa-page { padding: 2rem 1rem; max-width: 800px; margin: 0 auto; }
.page-title { font-size: 2.4rem; color: #D84315; text-align: center; margin-bottom: 0.5rem; }
.page-subtitle { text-align: center; color: #8B4513; font-size: 1.1rem; margin-bottom: 2rem; font-weight: 500; }

.verse-block {
  background: #FFF8E1;
  padding: 1.4rem;
  margin: 1.2rem 0;
  border-radius: 16px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.07);
  border-left: 5px solid #FF6D00;
  transition: all 0.3s ease;
}

.verse-block:hover {
  box-shadow: 0 6px 16px rgba(255, 109, 0, 0.2);
  transform: translateY(-2px);
}

.verse {
  font-size: 1.45rem;
  line-height: 2;
  color: #333;
  font-weight: 600;
  text-align: center;
  font-family: 'Noto Sans Devanagari', sans-serif;
}

.bottom-nav { margin: 3rem 0 2rem; }
/* ऊपर सिर्फ 2 लाइनें */
.page-title { font-size: 2rem; margin: 1rem 0 0.3rem; color: #D84315; }
.page-subtitle { font-size: 1.1rem; margin: 0 0 1.5rem; color: #8B4513; }

/* Adsense */
.adsense-slot { margin: 1.2rem 0; text-align: center; }
.adsense-slot ins { max-height: 100px; }

/* लाइन-दर-लाइन छोटे ब्लॉक */
.verse-block {
  background: #FFF8E1;
  padding: 0.9rem;
  margin: 0.6rem 0;
  border-radius: 12px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
  border-left: 4px solid #FF6D00;
  transition: 0.3s ease;
}

.verse-block:hover {
  box-shadow: 0 4px 12px rgba(255, 109, 0, 0.2);
  transform: translateY(-1px);
}

.verse {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #333;
  font-weight: 600;
  text-align: center;
  margin: 0;
  font-family: 'Noto Sans Devanagari', sans-serif;
}

/* मोबाइल */
@media (max-width: 480px) {
  .verse { font-size: 1.2rem; line-height: 1.6; }
  .verse-block { padding: 0.8rem; margin: 0.5rem 0; }
  .page-title { font-size: 1.8rem; }
  .page-subtitle { font-size: 1rem; }
  .adsense-slot ins { max-height: 90px; }
}
/* नया टाइटल रो: बायीं-दायीं */
.title-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  margin: 1.5rem 0 1rem;
  padding: 0 0.5rem;
}

.title-left {
  flex: 1;
  min-width: 200px;
}

.title-right {
  flex: 1;
  text-align: right;
  min-width: 180px;
}

.page-title {
  font-size: 2.1rem;
  color: #D84315;
  margin: 0;
  font-weight: 700;
  line-height: 1.2;
}

.page-subtitle {
  font-size: 1.1rem;
  color: #8B4513;
  margin: 0;
  font-weight: 500;
}

/* Adsense */
.adsense-slot {
  margin: 1.5rem 0;
  text-align: center;
}
.adsense-slot ins {
  max-height: 100px;
}

/* लाइन-दर-लाइन ब्लॉक */
.verse-block {
  background: #FFF8E1;
  padding: 1rem;
  margin: 0.7rem 0;
  border-radius: 14px;
  box-shadow: 0 3px 8px rgba(0,0,0,0.06);
  border-left: 5px solid #FF6D00;
  transition: all 0.3s ease;
}

.verse-block:hover {
  box-shadow: 0 6px 16px rgba(255, 109, 0, 0.22);
  transform: translateY(-2px);
}

.verse {
  font-size: 1.4rem;
  line-height: 1.8;
  color: #333;
  font-weight: 600;
  text-align: center;
  margin: 0;
  font-family: 'Noto Sans Devanagari', sans-serif;
}

/* मोबाइल ऑप्टिमाइज़ */
@media (max-width: 600px) {
  .title-row {
    flex-direction: column;
    text-align: center;
    gap: 0.5rem;
  }
  .title-left, .title-right { text-align: center; }
  .page-title { font-size: 1.9rem; }
  .page-subtitle { font-size: 1rem; }
  .verse { font-size: 1.25rem; line-height: 1.7; }
  .verse-block { padding: 0.9rem; margin: 0.6rem 0; }
  .adsense-slot ins { max-height: 90px; }
}
/* नया टाइटल रो */
.title-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  margin: 1.5rem 0 1rem;
  padding: 0 0.5rem;
}

.title-left { flex: 1; min-width: 200px; }
.title-right { flex: 1; text-align: right; min-width: 180px; }

.page-title {
  font-size: 2.1rem;
  color: #D84315;
  margin: 0;
  font-weight: 700;
  line-height: 1.2;
}

.page-subtitle {
  font-size: 1.1rem;
  color: #8B4513;
  margin: 0;
  font-weight: 500;
}

/* Adsense */
.adsense-slot { margin: 1.5rem 0; text-align: center; }
.adsense-slot ins { max-height: 100px; }

/* लाइन-दर-लाइन + <br> के साथ */
.verse-block {
  background: #FFF8E1;
  padding: 1.1rem;
  margin: 0.8rem 0;
  border-radius: 16px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.07);
  border-left: 5px solid #FF6D00;
  transition: all 0.3s ease;
}

.verse-block:hover {
  box-shadow: 0 6px 18px rgba(255, 109, 0, 0.25);
  transform: translateY(-2px);
}

.verse {
  font-size: 1.45rem;
  line-height: 2.1;
  color: #333;
  font-weight: 600;
  text-align: center;
  margin: 0;
  font-family: 'Noto Sans Devanagari', sans-serif;
}

/* मोबाइल */
@media (max-width: 600px) {
  .title-row { flex-direction: column; text-align: center; gap: 0.5rem; }
  .title-left, .title-right { text-align: center; }
  .page-title { font-size: 1.9rem; }
  .page-subtitle { font-size: 1rem; }
  .verse { font-size: 1.3rem; line-height: 2; }
  .verse-block { padding: 1rem; margin: 0.7rem 0; }
  .adsense-slot ins { max-height: 90px; }
}
.bhajan-title {
  font-size: 1.45rem;
  color: #1976d2;
  margin: 1.2rem 0 0.8rem;
  text-align: center;
  font-weight: 700;
  padding-bottom: 0.5rem;
  border-bottom: 2px dashed #90caf9;
}

.verse {
  font-size: 1.5rem;
  line-height: 2.3;
  color: #1a237e;
  font-weight: 600;
  text-align: center;
  margin: 0;
  font-family: 'Noto Sans Devanagari', sans-serif;
}

@media (max-width: 600px) {
  .bhajan-title { font-size: 1.35rem; }
  .verse { font-size: 1.35rem; line-height: 2.1; }
}
.bhajan-title {
  font-size: 1.45rem;
  color: #c2185b;
  margin: 1.2rem 0 0.8rem;
  text-align: center;
  font-weight: 700;
  padding-bottom: 0.5rem;
  border-bottom: 2px dashed #f8bbd0;
}

.verse {
  font-size: 1.5rem;
  line-height: 2.3;
  color: #880e4f;
  font-weight: 600;
  text-align: center;
  margin: 0;
  font-family: 'Noto Sans Devanagari', sans-serif;
}

@media (max-width: 600px) {
  .bhajan-title { font-size: 1.35rem; }
  .verse { font-size: 1.35rem; line-height: 2.1; }
}
.bhajan-title {
  font-size: 1.45rem;
  color: #e65100;
  margin: 1.2rem 0 0.8rem;
  text-align: center;
  font-weight: 700;
  padding-bottom: 0.5rem;
  border-bottom: 2px dashed #ffcc80;
}

.verse {
  font-size: 1.5rem;
  line-height: 2.3;
  color: #e65100;
  font-weight: 600;
  text-align: center;
  margin: 0;
  font-family: 'Noto Sans Devanagari', sans-serif;
}

@media (max-width: 600px) {
  .bhajan-title { font-size: 1.35rem; }
  .verse { font-size: 1.35rem; line-height: 2.1; }
}
.bhajan-title {
  font-size: 1.35rem;
  color: #1b5e20;
  margin: 1.2rem 0 0.8rem;
  text-align: center;
  font-weight: 700;
  padding-bottom: 0.5rem;
  border-bottom: 2px dashed #a5d6a7;
}

.verse {
  font-size: 1.45rem;
  line-height: 2.3;
  color: #1b5e20;
  font-weight: 600;
  text-align: center;
  margin: 0;
  font-family: 'Sanskrit Text', 'Noto Sans Devanagari', serif;
}

@media (max-width: 600px) {
  .bhajan-title { font-size: 1.25rem; }
  .verse { font-size: 1.3rem; line-height: 2.1; }
}
/* लक्ष्मी चालीसा - गोल्डन थीम */
.bhajan-title {
  font-size: 1.45rem;
  color: #f9a825;
  margin: 1.2rem 0 0.8rem;
  text-align: center;
  font-weight: 700;
  padding-bottom: 0.5rem;
  border-bottom: 2px dashed #fff59d;
  text-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

.verse {
  font-size: 1.5rem;
  line-height: 2.3;
  color: #e65100;
  font-weight: 600;
  text-align: center;
  margin: 0;
  font-family: 'Noto Sans Devanagari', sans-serif;
  background: linear-gradient(to bottom, #fffde7, #fff8e1);
  padding: 1rem;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(249, 168, 37, 0.1);
}

.dohe {
  background: linear-gradient(to right, #fff8e1, #fff3e0);
  border-left: 4px solid #f9a825;
}

@media (max-width: 600px) {
  .bhajan-title { font-size: 1.35rem; }
  .verse { font-size: 1.35rem; line-height: 2.1; padding: 0.8rem; }
}
/* शनि चालीसा - डार्क थीम */
.bhajan-title {
  font-size: 1.45rem;
  color: #0d47a1;
  margin: 1.2rem 0 0.8rem;
  text-align: center;
  font-weight: 700;
  padding-bottom: 0.5rem;
  border-bottom: 2px dashed #90a4ae;
  text-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

.verse {
  font-size: 1.5rem;
  line-height: 2.3;
  color: #1a237e;
  font-weight: 600;
  text-align: center;
  margin: 0;
  font-family: 'Noto Sans Devanagari', sans-serif;
  background: linear-gradient(to bottom, #e8eaf6, #c5cae9);
  padding: 1rem;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(13, 71, 161, 0.1);
}

.dohe {
  background: linear-gradient(to right, #c5cae9, #b3e5fc);
  border-left: 4px solid #0d47a1;
}

@media (max-width: 600px) {
  .bhajan-title { font-size: 1.35rem; }
  .verse { font-size: 1.35rem; line-height: 2.1; padding: 0.8rem; }
}
/* सरस्वती वंदना - श्वेत थीम */
.bhajan-title {
  font-size: 1.45rem;
  color: #1565c0;
  margin: 1.2rem 0 0.8rem;
  text-align: center;
  font-weight: 700;
  padding-bottom: 0.5rem;
  border-bottom: 2px dashed #bbdefb;
  text-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

.verse {
  font-size: 1.5rem;
  line-height: 2.3;
  color: #0d47a1;
  font-weight: 600;
  text-align: center;
  margin: 0;
  font-family: 'Noto Sans Devanagari', sans-serif;
  background: linear-gradient(to bottom, #ffffff, #f5f9ff);
  padding: 1rem;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(21, 101, 192, 0.1);
}

.dohe {
  background: linear-gradient(to right, #e3f2fd, #bbdefb);
  border-left: 4px solid #1565c0;
}

@media (max-width: 600px) {
  .bhajan-title { font-size: 1.35rem; }
  .verse { font-size: 1.35rem; line-height: 2.1; padding: 0.8rem; }
}
.logo-container { display: flex; align-items: center; gap: 10px; }
.main-logo { border-radius: 50%; box-shadow: 0 2px 8px rgba(0,0,0,0.15); transition: 0.3s; }
.main-logo:hover { transform: scale(1.1); }
.logo-text { font-weight: 700; font-size: 1.4rem; color: #d4a574; }
.hero-logo { text-align: center; margin-bottom: 1rem; }
.hero-logo img { filter: drop-shadow(0 8px 20px rgba(255,152,0,0.25)); }
.footer-logo img { border-radius: 50%; }