/* ============================================================
   Ram Naam Jap - Dedicated Page Styles
   Extends style.css — only page-specific additions
   ============================================================ */

/* --- Hero Adjustments --- */
.rnj-hero { min-height: auto; padding: 120px 0 80px; }
.rnj-hindi-title {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1.4rem, 3vw, 2rem);
    font-weight: 600;
    display: block;
    margin-top: 8px;
    opacity: 0.85;
    -webkit-text-fill-color: #EDE7F6;
}
.rnj-hindi-sub {
    font-family: 'Inter', sans-serif;
    font-size: clamp(0.95rem, 2vw, 1.2rem);
    font-weight: 500;
    display: block;
    margin-top: 6px;
    color: rgba(255,255,255,0.6);
}

/* --- Article Content Sections --- */
.rnj-content {
    padding: 80px 0;
    background: linear-gradient(180deg, #7E57C2, #6A3CB5);
}
.rnj-article {
    max-width: 800px;
    margin: 0 auto;
}
.rnj-article-content p {
    font-size: 1rem;
    line-height: 1.8;
    color: rgba(255,255,255,0.85);
    margin-bottom: 20px;
}
.rnj-article-content strong {
    color: #fff;
}

/* --- Mantra List inside article --- */
.rnj-mantras-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 24px 0;
}
.rnj-mantra-item {
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 16px;
    padding: 20px 24px;
    transition: transform 0.25s, background 0.25s;
}
.rnj-mantra-item:hover {
    transform: translateY(-2px);
    background: rgba(255,255,255,0.15);
}
.rnj-mantra-sanskrit {
    display: block;
    font-size: 1.3rem;
    color: #EDE7F6;
    font-weight: 500;
    margin-bottom: 4px;
}
.rnj-mantra-english {
    display: block;
    font-size: 1rem;
    font-weight: 600;
    color: #fff;
    margin-bottom: 4px;
}
.rnj-mantra-label {
    display: block;
    font-size: 0.82rem;
    color: rgba(255,255,255,0.5);
}

/* --- Benefits Section --- */
.rnj-benefits {
    padding: 100px 0;
    background: #7248B8;
}

/* --- Two Column Layout (Rules & Significance) --- */
.rnj-rules { background: #7E57C2; }
.rnj-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    max-width: 960px;
    margin: 0 auto;
}
.rnj-col h3 {
    font-family: 'Playfair Display', serif;
    font-size: 1.2rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 20px;
}
.rnj-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.rnj-list li {
    font-size: 0.92rem;
    line-height: 1.65;
    color: rgba(255,255,255,0.8);
    padding-left: 20px;
    position: relative;
}
.rnj-list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 8px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #FFD54F;
}
.rnj-list li strong {
    color: #fff;
}

/* --- Targets / Goals Section --- */
.rnj-targets {
    padding: 100px 0;
    background: #7248B8;
}
.rnj-targets-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    max-width: 960px;
    margin: 0 auto;
}
.rnj-target-card {
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 20px;
    padding: 32px 24px;
    text-align: center;
    transition: transform 0.3s, box-shadow 0.3s, background 0.3s;
}
.rnj-target-card:hover {
    transform: translateY(-4px);
    background: rgba(255,255,255,0.15);
    box-shadow: 0 12px 40px rgba(49,27,146,0.3);
}
.rnj-target-highlight {
    grid-column: span 1;
    background: rgba(255,213,79,0.12);
    border-color: rgba(255,213,79,0.25);
}
.rnj-target-highlight:hover {
    background: rgba(255,213,79,0.18);
}
.rnj-target-count {
    font-family: 'Playfair Display', serif;
    font-size: 2rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 4px;
}
.rnj-target-highlight .rnj-target-count {
    color: #FFD54F;
}
.rnj-target-name {
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #EDE7F6;
    margin-bottom: 12px;
}
.rnj-target-card p {
    font-size: 0.88rem;
    color: rgba(255,255,255,0.65);
    line-height: 1.5;
}

/* --- Community Section --- */
.rnj-community {
    padding: 100px 0;
    background: linear-gradient(180deg, #6A3CB5, #7E57C2);
}
.rnj-community-features {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

/* --- Occasions Section --- */
.rnj-occasions { background: #7248B8; }
.rnj-occasions-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 16px 0 20px;
    padding: 0;
}
.rnj-occasions-list li {
    font-size: 0.95rem;
    line-height: 1.6;
    color: rgba(255,255,255,0.8);
    padding-left: 20px;
    position: relative;
}
.rnj-occasions-list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 10px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #FFD54F;
}
.rnj-occasions-list li strong {
    color: #fff;
}

/* --- Download Keywords (micro text) --- */
.rnj-download-keywords {
    margin-top: 24px !important;
    font-size: 0.75rem !important;
    color: rgba(255,255,255,0.3) !important;
    letter-spacing: 0.5px;
}

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width: 968px) {
    .rnj-two-col { grid-template-columns: 1fr; gap: 32px; }
    .rnj-targets-grid { grid-template-columns: 1fr 1fr; }
    .rnj-community-features { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
    .rnj-hero { padding: 100px 0 60px; }
    .rnj-targets-grid { grid-template-columns: 1fr; }
    .rnj-target-highlight { grid-column: span 1; }
    .rnj-community-features { grid-template-columns: 1fr; }
    .rnj-mantra-item { padding: 16px 20px; }
    .rnj-mantra-sanskrit { font-size: 1.1rem; }
}