/**
 * प्रकाशन (Prakashan) - Homepage Theme & Visual Contrast
 * Margin, padding, display, flex, and grid layout are handled via Bootstrap 6 utility classes in views/home.php.
 * This stylesheet controls editorial color palettes, dark/tinted surfaces, typography, aspect-ratios, and transitions.
 */

body:has(.hp) {
    background-color: #e8eef5;
}

.hp {
    --hp-navy: #1d3557;
    --hp-navy-dark: #0f172a;
    --hp-navy-card: #1e293b;
    --hp-crimson: #c41e24;
    --hp-crimson-dark: #9b151a;
    --hp-gold: #fbbf24;
    --hp-amber-bg: #fff8eb;
    --hp-rose-bg: #fff5f5;
    --hp-slate-tint: #eef3f9;
    --hp-card-tint: #f4f7fb;
    --hp-ink: #0f172a;
    --hp-ink-soft: #334155;
    --hp-muted: #475569;
    --hp-border: #cbd5e1;
}

.hp a {
    color: inherit;
    text-decoration: none;
    transition: color 0.18s ease, background-color 0.18s ease;
}

.hp a:hover {
    color: var(--hp-crimson);
}

.hp-empty {
    background: var(--hp-slate-tint);
    border: 2px solid var(--hp-border);
    color: var(--hp-muted);
    font-weight: 600;
}

.hp-muted {
    color: var(--hp-muted);
    font-size: 0.86rem;
}

/* ---------- Shared Editorial Badges & Meta ---------- */
.hp-badge-featured {
    background: var(--hp-crimson);
    color: #ffffff;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.hp-kicker {
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    color: var(--hp-crimson) !important;
}

.hp-kicker--gold {
    color: var(--hp-gold) !important;
}

.hp-kicker--gold:hover {
    color: #fde68a !important;
}

.hp-meta {
    font-size: 0.82rem;
    color: var(--hp-muted);
}

.hp-meta--light {
    color: #cbd5e1;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.hp-meta--sm {
    font-size: 0.75rem;
}

.hp-meta__dot {
    width: 4px;
    height: 4px;
    background: currentColor;
    opacity: 0.65;
}

.hp-time {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--hp-muted);
}

/* ---------- Media & Aspect Ratios ---------- */
.hp-media {
    background: #1e293b;
    aspect-ratio: 16 / 9;
}

.hp-media img {
    object-fit: cover;
    transition: transform 0.35s ease;
}

.hp-media:hover img {
    transform: scale(1.04);
}

.hp-media--empty {
    background: linear-gradient(135deg, var(--hp-navy-dark) 0%, var(--hp-navy) 60%, var(--hp-crimson-dark) 100%);
}

.hp-media--empty span {
    color: #f8fafc;
    font-family: var(--font-heading);
    font-weight: 800;
    font-size: 0.95rem;
    letter-spacing: 0.03em;
}

/* Line clamps for tidy multi-line headlines */
.hp-secondary__title a,
.hp-card__title a,
.hp-cat__title a,
.hp-rank__link,
.hp-feed__link {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ---------- 1. HERO: Lead Story (Rich Dark Navy Theme) ---------- */
.hp-lead {
    background: linear-gradient(165deg, var(--hp-navy-dark) 0%, var(--hp-navy) 100%);
    border: 1px solid #1e3a5f;
    border-top: 4px solid var(--hp-crimson);
    color: #f8fafc;
}

.hp-lead__media {
    aspect-ratio: 16 / 9;
    border-bottom: 2px solid rgba(251, 191, 36, 0.35);
}

.hp-lead__title {
    font-size: 1.55rem;
    line-height: 1.38;
    font-weight: 800;
    color: #ffffff;
}

.hp-lead__title a {
    color: #ffffff !important;
}

.hp-lead__title a:hover {
    color: var(--hp-gold) !important;
}

.hp-lead__summary {
    font-size: 0.98rem;
    line-height: 1.65;
    color: #dbeafe;
}

/* ---------- 1B. HERO: Secondary Stack (Tinted Slate Cards with Accent Border) ---------- */
.hp-secondary__item {
    background: var(--hp-card-tint);
    border: 1px solid var(--hp-border);
    border-left: 4px solid var(--hp-navy);
    transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}

.hp-secondary__item:hover {
    background: var(--hp-rose-bg);
    border-left-color: var(--hp-crimson);
    transform: translateX(2px);
}

.hp-secondary__media {
    width: 112px;
    aspect-ratio: 4 / 3;
}

.hp-secondary__title {
    font-size: 0.95rem;
    line-height: 1.45;
    font-weight: 700;
    color: var(--hp-ink);
}

.hp-secondary__title a {
    -webkit-line-clamp: 3;
}

/* ---------- 1C. HERO: Live Feed ("ताज़ा अपडेट") ---------- */
.hp-feed {
    background: var(--hp-rose-bg);
    border: 1px solid #fecdd3;
}

.hp-feed__head {
    background: linear-gradient(90deg, var(--hp-crimson) 0%, var(--hp-crimson-dark) 100%);
    color: #ffffff;
}

.hp-feed__title {
    font-size: 1.05rem;
    font-weight: 800;
    color: #ffffff;
}

.hp-live-dot {
    width: 10px;
    height: 10px;
    background: #ffffff;
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.75);
    animation: hp-pulse 1.8s infinite;
}

@keyframes hp-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.75); }
    70%  { box-shadow: 0 0 0 8px rgba(255, 255, 255, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}

@media (prefers-reduced-motion: reduce) {
    .hp-live-dot { animation: none; }
}

.hp-feed__list {
    border-left: 2px solid #fda4af;
    max-height: 460px;
    overflow-y: auto;
}

.hp-feed__item {
    border-bottom: 1px dashed #fecdd3;
}

.hp-feed__item:last-child {
    border-bottom: 0;
}

.hp-feed__item::before {
    content: "";
    position: absolute;
    left: -21px;
    top: 5px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--hp-crimson);
    border: 2px solid #fff5f5;
}

.hp-feed__time {
    font-size: 0.73rem;
    font-weight: 800;
    color: var(--hp-crimson);
}

.hp-feed__link {
    font-size: 0.9rem;
    line-height: 1.45;
    font-weight: 700;
    color: var(--hp-ink);
    -webkit-line-clamp: 2;
}

/* ---------- 2. SPECIAL REPORTS DARK SHOWCASE BAND ---------- */
.hp-showcase {
    background: linear-gradient(135deg, var(--hp-navy-dark) 0%, var(--hp-navy) 100%);
    border: 1px solid #1e3a5f;
    border-top: 4px solid var(--hp-gold);
    color: #f8fafc;
}

.hp-showcase__head {
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.hp-showcase__pill {
    background: var(--hp-gold);
    color: var(--hp-navy-dark);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.03em;
}

.hp-showcase__title {
    font-size: 1.3rem;
    font-weight: 800;
    color: #ffffff;
}

.hp-card--dark {
    background: var(--hp-navy-card);
    border: 1px solid #334155;
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.hp-card--dark:hover {
    transform: translateY(-3px);
    border-color: var(--hp-gold);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.3);
}

.hp-card__title {
    font-size: 1.02rem;
    line-height: 1.45;
    font-weight: 700;
    color: #ffffff;
}

.hp-card--dark .hp-card__title a {
    color: #f8fafc !important;
    -webkit-line-clamp: 3;
}

.hp-card--dark .hp-card__title a:hover {
    color: var(--hp-gold) !important;
}

.hp-card__summary {
    font-size: 0.85rem;
    line-height: 1.55;
    color: #cbd5e1;
}

/* ---------- Ad Bands ---------- */
.hp-ad-band {
    background: #dfe7f2;
    border: 1px dashed #94a3b8;
}

/* ---------- 3. CATEGORY SECTIONS ---------- */
.hp-cat {
    background: var(--hp-slate-tint);
    border: 1px solid var(--hp-border);
}

.hp-cat__head {
    background: linear-gradient(90deg, var(--hp-navy) 0%, #274675 100%);
    border-bottom: 3px solid var(--hp-crimson);
    color: #ffffff;
}

.hp-cat__heading {
    font-size: 1.12rem;
    font-weight: 800;
    color: #ffffff;
}

.hp-cat__heading a {
    color: #ffffff !important;
}

.hp-cat__heading a:hover {
    color: var(--hp-gold) !important;
}

.hp-cat__more {
    background: rgba(255, 255, 255, 0.14);
    color: #ffffff !important;
    font-size: 0.78rem;
    font-weight: 700;
}

.hp-cat__more:hover {
    background: var(--hp-crimson);
    color: #ffffff !important;
}

.hp-cat__top {
    background: var(--hp-amber-bg);
    border: 1px solid #fde68a;
}

.hp-cat__title {
    font-size: 1.06rem;
    line-height: 1.45;
    font-weight: 800;
    color: var(--hp-ink);
}

.hp-cat__title a {
    -webkit-line-clamp: 3;
}

.hp-cat__summary {
    font-size: 0.86rem;
    line-height: 1.55;
    color: var(--hp-ink-soft);
}

.hp-cat__item {
    background: #e2e8f0;
    border-left: 3px solid var(--hp-navy);
    transition: background-color 0.18s ease, border-color 0.18s ease;
}

.hp-cat__item:hover {
    background: var(--hp-rose-bg);
    border-left-color: var(--hp-crimson);
}

.hp-cat__item a {
    font-size: 0.92rem;
    line-height: 1.45;
    font-weight: 700;
    color: var(--hp-ink);
}

/* ---------- 4. SIDEBAR WIDGETS ---------- */
.hp-widget {
    border: 1px solid var(--hp-border);
}

.hp-widget--mostread {
    background: var(--hp-rose-bg);
    border-color: #fecdd3;
}

.hp-widget--factcheck {
    background: var(--hp-amber-bg);
    border-color: #fde68a;
}

.hp-widget--team {
    background: var(--hp-slate-tint);
    border-color: #cbd5e1;
}

.hp-widget__head {
    color: #ffffff;
}

.hp-widget__head--crimson {
    background: linear-gradient(90deg, var(--hp-crimson) 0%, var(--hp-crimson-dark) 100%);
}

.hp-widget__head--amber {
    background: linear-gradient(90deg, #b45309 0%, #92400e 100%);
}

.hp-widget__head--navy {
    background: linear-gradient(90deg, var(--hp-navy-dark) 0%, var(--hp-navy) 100%);
}

.hp-widget__title {
    font-size: 1.05rem;
    font-weight: 800;
    color: #ffffff;
}

.hp-widget__tag {
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
    font-size: 0.72rem;
    font-weight: 700;
}

/* Most Read Rank List */
.hp-rank__item {
    border-bottom: 1px solid #fecdd3;
}

.hp-rank__item:last-child {
    border-bottom: 0;
}

.hp-rank__num {
    width: 32px;
    height: 32px;
    background: var(--hp-navy);
    color: #ffffff;
    font-family: var(--font-heading);
    font-size: 0.95rem;
    font-weight: 800;
}

.hp-rank__item:nth-child(-n+3) .hp-rank__num {
    background: var(--hp-crimson);
}

.hp-rank__link {
    font-size: 0.92rem;
    line-height: 1.45;
    font-weight: 700;
    color: var(--hp-ink);
    -webkit-line-clamp: 2;
}

/* Fact Check Cards */
.hp-fact {
    background: #fef3c7;
    border: 1px solid #fcd34d;
    border-left: 4px solid #d97706;
}

.hp-fact .fact-badge {
    font-size: 0.72rem;
}

.hp-fact__claim {
    font-weight: 800;
    font-size: 0.92rem;
    color: var(--hp-ink);
    line-height: 1.45;
}

.hp-fact__summary {
    font-size: 0.82rem;
    color: var(--hp-ink-soft);
    line-height: 1.5;
}

/* Editorial Team */
.hp-team__item {
    background: #e2e8f0;
    border: 1px solid #cbd5e1;
}

.hp-team__avatar {
    width: 38px;
    height: 38px;
    background: linear-gradient(135deg, var(--hp-navy) 0%, var(--hp-crimson) 100%);
    color: #ffffff;
    font-weight: 800;
}

.hp-team__name {
    font-weight: 800;
    font-size: 0.9rem;
    color: var(--hp-ink);
}

.hp-team__role {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--hp-muted);
}

.hp-team__more {
    background: var(--hp-navy);
    color: #ffffff !important;
    font-size: 0.82rem;
    font-weight: 700;
}

.hp-team__more:hover {
    background: var(--hp-crimson);
    color: #ffffff !important;
}

/* Trust & Ethics Box */
.hp-trust {
    background: linear-gradient(145deg, var(--hp-navy-dark) 0%, var(--hp-navy) 100%);
    border: 1px solid #1e3a5f;
    border-top: 4px solid var(--hp-gold);
    color: #f8fafc;
}

.hp-trust__badge {
    background: rgba(251, 191, 36, 0.2);
    color: var(--hp-gold);
    font-size: 0.72rem;
    font-weight: 800;
}

.hp-trust__title {
    font-size: 1.08rem;
    font-weight: 800;
    color: #ffffff;
}

.hp-trust p {
    font-size: 0.86rem;
    color: #dbeafe;
    line-height: 1.6;
}

.hp-trust__link {
    background: var(--hp-gold);
    color: var(--hp-navy-dark) !important;
    font-size: 0.83rem;
    font-weight: 800;
}

.hp-trust__link:hover {
    background: #fde68a;
    color: var(--hp-navy-dark) !important;
}

/* ---------- Responsive Typography Refinements ---------- */
@media (min-width: 768px) {
    .hp-lead__title {
        font-size: 1.8rem;
    }
}

@media (min-width: 1280px) {
    .hp-lead__title {
        font-size: 1.95rem;
    }
}

@media (max-width: 420px) {
    .hp-lead__title {
        font-size: 1.32rem;
    }
    .hp-secondary__media {
        width: 92px;
    }
}
