/* ========== Daily Horoscope Clone — 全站样式 ========== */
:root {
    --primary: #6c4ab6;
    --primary-dark: #4b2e83;
    --secondary: #e91e63;
    --gold: #f0c74e;
    --bg-deep: #0e0a25;
    --bg-card: #ffffff;
    --text-dark: #1f1b3d;
    --text-muted: #6c757d;
    --gradient-cosmic: linear-gradient(135deg, #6c4ab6 0%, #4b2e83 50%, #1a1244 100%);
    --gradient-warm: linear-gradient(135deg, #ff8a65 0%, #e91e63 100%);
    --gradient-gold: linear-gradient(135deg, #f0c74e 0%, #e07a3c 100%);
}

/* Default to cosmic navy so Next.js navigations never flash a light #faf7ff frame before .page-daily-dh applies. */
body {
    font-family: 'Helvetica Neue', 'PingFang SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: #d6d2e8;
    background: #0f172b;
    min-height: 100vh;
}

a { text-decoration: none; }

/* ========== 顶部导航（daily-horoscope.us 系：深炭灰/海军 + 金 + 白字链接） ========== */
.navbar-cosmic {
    background: linear-gradient(90deg, #15151f 0%, #101522 45%, #0f141c 100%);
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.45);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.navbar-cosmic .navbar-brand-dh {
    font-size: 1rem;
    letter-spacing: 0.02em;
    line-height: 1.15;
    text-decoration: none !important;
}
@media (min-width: 576px) {
    .navbar-cosmic .navbar-brand-dh {
        font-size: 1.05rem;
    }
}
.navbar-brand-planet {
    font-size: 1.35rem;
    line-height: 1;
    margin-right: 0.35rem;
    filter: drop-shadow(0 0 6px rgba(233, 183, 63, 0.35));
}
.navbar-brand-lockup {
    white-space: nowrap;
}
.navbar-brand-strong {
    color: #e9b73f !important;
    font-weight: 800;
}
.navbar-brand-soft {
    color: rgba(245, 230, 200, 0.88) !important;
    font-weight: 500;
}
.navbar-brand-tld {
    color: #e9b73f !important;
    font-weight: 700;
}
.navbar-cosmic .nav-link {
    color: #ffffff !important;
    font-weight: 600;
    transition: color .2s;
    padding: 0.6rem 1rem !important;
}
.navbar-cosmic .nav-link:hover,
.navbar-cosmic .nav-link.active {
    color: #e9b73f !important;
}

/* —— Full-width mega menu: fullscreen drawer below nav (--nav-mega-offset set in JS) —— */
.site-header-cosmic {
    z-index: 1030;
    --nav-mega-offset: 4.25rem;
}
.nav-mega-backdrop {
    position: fixed;
    inset: 0;
    z-index: 0;
    background: rgba(6, 5, 18, 0.55);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease, visibility 0.2s ease;
    pointer-events: none;
}
.site-header-cosmic.nav-mega-is-open .nav-mega-backdrop {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
.navbar-cosmic--mega {
    position: relative;
    z-index: 2;
}
.navbar-cosmic--mega .nav-mega-toggle {
    color: var(--gold);
    line-height: 1;
    opacity: 0.95;
}
.navbar-cosmic--mega .nav-mega-toggle:hover {
    opacity: 1;
    color: #ffd666;
}
.navbar-cosmic--mega .nav-mega-toggle:focus {
    box-shadow: none;
}
.nav-mega-panel {
    position: fixed;
    left: 0;
    right: 0;
    top: var(--nav-mega-offset, 4.25rem);
    bottom: 0;
    z-index: 1;
    display: none;
    margin: 0;
    background: #0f0f1e;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 -8px 40px rgba(0, 0, 0, 0.35);
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: env(safe-area-inset-bottom, 0px);
}
.nav-mega-panel.is-open {
    display: block;
}
.nav-mega-panel .container {
    max-width: 1320px;
}
.nav-mega-title {
    font-size: 0.95rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 0.85rem;
    letter-spacing: 0.02em;
}
.nav-mega-list li {
    margin-bottom: 0.45rem;
}
.nav-mega-link {
    font-size: 0.875rem;
    color: #9494b8 !important;
    text-decoration: none !important;
    transition: color 0.15s ease;
}
.nav-mega-link:hover {
    color: #c8c8e4 !important;
}
.site-header-cosmic.nav-mega-is-open .navbar-cosmic {
    box-shadow: none;
}

.btn-premium {
    background: var(--gradient-gold);
    color: #1f1b3d !important;
    font-weight: 600;
    border: none;
    border-radius: 999px;
    padding: 0.45rem 1.3rem;
    transition: transform .2s, box-shadow .2s;
}
.btn-premium:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(240, 199, 78, 0.4);
    color: #1f1b3d !important;
}

/* ========== Hero 横幅（与顶栏同色系，非紫色大横幅） ========== */
.hero-banner {
    background: linear-gradient(90deg, #15151f 0%, #101522 45%, #0f141c 100%);
    color: #fff;
    padding: 4rem 0 3rem;
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.hero-banner::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -10%;
    width: 60%;
    height: 200%;
    background: radial-gradient(ellipse at center, rgba(233, 183, 63, 0.08), transparent 70%);
    pointer-events: none;
}
.hero-banner h1 {
    font-size: 2.6rem;
    font-weight: 700;
    margin-bottom: 1rem;
}
.hero-banner .lead {
    font-size: 1.15rem;
    opacity: 0.9;
}

/* ========== 12 星座网格卡片 ========== */
.zodiac-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.15rem;
}
@media (min-width: 768px) {
    .zodiac-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1.35rem;
    }
}
.zodiac-card {
    background: #fff;
    border-radius: 16px;
    padding: 1.55rem 0.85rem;
    text-align: center;
    transition: all .25s ease;
    cursor: pointer;
    border: 2px solid transparent;
    box-shadow: 0 2px 12px rgba(76, 46, 131, 0.06);
    color: var(--text-dark);
    display: block;
}
.zodiac-card:hover {
    transform: translateY(-4px);
    border-color: var(--primary);
    box-shadow: 0 8px 24px rgba(76, 46, 131, 0.18);
    color: var(--primary);
}
.zodiac-card .zodiac-symbol {
    font-size: 2.6rem;
    line-height: 1;
    color: var(--primary);
}
.zodiac-card .zodiac-symbol-wrap {
    margin-bottom: 0.55rem;
}
.zodiac-card .zodiac-avatar {
    width: 54px;
    height: 54px;
    margin: 0 auto 0.5rem;
    border-radius: 999px;
    background: var(--avatar-bg, #f4e6ff);
    border: 2px solid rgba(0,0,0,0.07);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: inset 0 -3px 10px rgba(0,0,0,0.05);
}
.zodiac-card .zodiac-animal {
    font-size: 1.45rem;
    line-height: 1;
    filter: saturate(0.75) contrast(1.05);
}

/* Zodiac icon style switcher */
.zodiac-style-switch {
    display: inline-flex;
    gap: 0.35rem;
    padding: 0.25rem;
    border-radius: 999px;
    background: #f3ecff;
}
.zodiac-style-switch .btn {
    border-radius: 999px;
    border: 1px solid #d9c9f7;
    background: #fff;
    color: #5f4f86;
    font-weight: 600;
    padding: 0.2rem 0.8rem;
}
.zodiac-style-switch .btn.active {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}

/* Classic: filled badge */
.zodiac-grid[data-style="classic"] .zodiac-symbol {
    width: 42px;
    height: 42px;
    margin: 0 auto;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    color: #fff;
    background: linear-gradient(180deg, #8e6ad8, #6d4bbb);
    box-shadow: 0 4px 10px rgba(111, 66, 193, 0.25);
}
.zodiac-grid[data-style="classic"] .zodiac-avatar {
    display: none;
}

/* Modern: minimal outlined style */
.zodiac-grid[data-style="modern"] .zodiac-symbol {
    width: 44px;
    height: 44px;
    margin: 0 auto;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    color: #6a4fc7;
    border: 2px solid #c9b8ef;
    background: #fff;
}
.zodiac-grid[data-style="modern"] .zodiac-avatar {
    display: none;
}

/* Outline Bold: thicker outlined badge with strong glyph */
.zodiac-grid[data-style="outline-bold"] .zodiac-symbol {
    width: 46px;
    height: 46px;
    margin: 0 auto;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.65rem;
    font-weight: 700;
    color: #4e32a0;
    border: 3px solid #6f55cc;
    background: linear-gradient(180deg, #f9f6ff, #efe9ff);
    box-shadow: 0 3px 10px rgba(94, 67, 170, 0.2);
}
.zodiac-grid[data-style="outline-bold"] .zodiac-symbol-wrap {
    margin-bottom: 0.35rem;
}
.zodiac-grid[data-style="outline-bold"] .zodiac-symbol {
    width: auto;
    height: auto;
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    padding: 0;
    font-size: 1.18rem;
    line-height: 1;
    color: #5e43b8;
}
.zodiac-card .zodiac-name {
    font-weight: 600;
    margin-bottom: 0.25rem;
    font-size: 1.08rem;
}
.zodiac-card .zodiac-date {
    font-size: 0.86rem;
    color: var(--text-muted);
}

/* ========== 通用卡片 ========== */
.card-soft {
    background: #fff;
    border-radius: 14px;
    border: none;
    box-shadow: 0 2px 12px rgba(76, 46, 131, 0.07);
    transition: transform .2s, box-shadow .2s;
}
.card-soft:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 22px rgba(76, 46, 131, 0.13);
}

/* ========== 内容页面包屑 ========== */
.breadcrumb-cosmic {
    background: transparent;
    padding: 1rem 0;
    margin: 0;
    font-size: 0.92rem;
}
.breadcrumb-cosmic a {
    color: var(--primary);
}

/* ========== 运势内容主体 ========== */
.horoscope-card {
    background: #fff;
    border-radius: 18px;
    padding: 2rem;
    box-shadow: 0 4px 22px rgba(76, 46, 131, 0.08);
}
.horoscope-card .author {
    color: var(--text-muted);
    font-size: 0.92rem;
    margin-bottom: 0.5rem;
}
.horoscope-card h1 {
    font-size: 1.9rem;
    font-weight: 700;
    color: var(--primary-dark);
    margin-bottom: 1.5rem;
}
.keyword-pill {
    display: inline-block;
    background: linear-gradient(135deg, rgba(108, 74, 182, 0.1), rgba(233, 30, 99, 0.1));
    color: var(--primary-dark);
    border: 1px solid rgba(108, 74, 182, 0.2);
    border-radius: 999px;
    padding: 0.3rem 0.95rem;
    margin: 0.2rem 0.3rem 0.2rem 0;
    font-size: 0.86rem;
    font-weight: 500;
}
.score-block {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: var(--gradient-cosmic);
    color: #fff;
    border-radius: 12px;
    padding: 1rem 1.4rem;
    margin: 1.2rem 0;
}
.score-block .score-num {
    font-size: 2.4rem;
    font-weight: 700;
    color: var(--gold);
    line-height: 1;
}
.do-list, .avoid-list {
    list-style: none;
    padding-left: 0;
    margin-bottom: 1.5rem;
}
.do-list li, .avoid-list li {
    padding: 0.45rem 0 0.45rem 1.8rem;
    position: relative;
    line-height: 1.5;
}
.do-list li::before {
    content: '\2713';
    position: absolute;
    left: 0;
    color: #28a745;
    font-weight: 700;
    font-size: 1.1rem;
}
.avoid-list li::before {
    content: '\2717';
    position: absolute;
    left: 0;
    color: #dc3545;
    font-weight: 700;
    font-size: 1.1rem;
}
.tip-of-day {
    background: linear-gradient(135deg, #fff8e1, #fff3cf);
    border-left: 4px solid var(--gold);
    padding: 1rem 1.2rem;
    border-radius: 6px;
    margin: 1.2rem 0;
    font-style: italic;
    color: #5a4500;
}

/* ========== 心情评分 ========== */
.mood-rating {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin: 1.5rem 0;
    flex-wrap: wrap;
}
.mood-emojis {
    display: flex;
    gap: 0.4rem;
}
.mood-emojis .mood-btn {
    font-size: 1.8rem;
    background: transparent;
    border: 2px solid transparent;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    line-height: 1;
    cursor: pointer;
    transition: all .2s;
    padding: 0;
}
.mood-emojis .mood-btn:hover { transform: scale(1.15); }
.mood-emojis .mood-btn.selected {
    border-color: var(--primary);
    background: rgba(108, 74, 182, 0.1);
}

/* ========== 评论区 ========== */
.comment-list { list-style: none; padding-left: 0; }
.comment-item {
    display: flex;
    gap: 1rem;
    padding: 1rem 0;
    border-bottom: 1px solid #f1ecfb;
}
.comment-avatar {
    width: 40px; height: 40px;
    border-radius: 50%;
    background: var(--gradient-cosmic);
    color: #fff;
    display: inline-flex;
    align-items: center; justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}
.comment-meta {
    color: var(--text-muted);
    font-size: 0.85rem;
}
.vote-btn {
    background: transparent;
    border: 1px solid #e0d6f5;
    border-radius: 6px;
    padding: 0.15rem 0.5rem;
    margin-right: 0.3rem;
    color: var(--text-muted);
    cursor: pointer;
    font-size: 0.85rem;
}
.vote-btn:hover { background: #f5eefd; color: var(--primary); }

/* ========== 塔罗页:暗黑主题 ========== */
body.tarot-dark {
    background: #0a0717;
    color: #e8e3f5;
}
body.tarot-dark .breadcrumb-cosmic a,
body.tarot-dark .text-muted { color: #a098c7 !important; }

.tarot-hero {
    background: #0a0717;
    background-image:
        radial-gradient(circle at 20% 30%, rgba(108, 74, 182, 0.25), transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(240, 199, 78, 0.12), transparent 55%);
    color: #fff;
    padding: 3rem 0 2rem;
    text-align: center;
}
.tarot-hero h1 {
    font-size: 2.4rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 0.6rem;
}
.tarot-hero .lead { color: #c8c0e0; }

.tarot-section {
    background: #0a0717;
    color: #e8e3f5;
    padding: 3rem 0;
}
.tarot-section h2,
.tarot-section h3,
.tarot-section h4,
.tarot-section h5 { color: #fff; }
.tarot-section p { color: #c8c0e0; }

.tarot-step-card {
    background: #15102e;
    border: 1px solid rgba(240, 199, 78, 0.15);
    border-radius: 16px;
    padding: 2.4rem 2rem;
    text-align: center;
    color: #e8e3f5;
}
.tarot-step-card h3 { color: #fff; }
.tarot-step-card p { color: #c8c0e0; }
.tarot-step-card .form-control {
    background: rgba(255,255,255,0.06);
    color: #fff;
    border: 1px solid rgba(255,255,255,0.15);
}
.tarot-step-card .form-control::placeholder { color: rgba(255,255,255,0.4); }
.tarot-step-card .form-control:focus {
    background: rgba(255,255,255,0.1);
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(240, 199, 78, 0.2);
    color: #fff;
}

.tarot-meanings-major-card {
    background: #15102e;
    border: 1px solid rgba(240, 199, 78, 0.15);
    border-radius: 16px;
    padding: 1.5rem 1.35rem;
    text-align: left;
    height: 100%;
    color: #e8e3f5;
}
.tarot-meanings-major-card p { color: #c8c0e0; }
.tarot-suit-block { margin-bottom: 3.5rem; }
/* Section blurbs under h2: narrow column, centered on page */
.tarot-section .suit-intro {
    max-width: 52rem;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1.5rem;
    text-align: center;
}
.tarot-minor-card {
    background: #15102e;
    border: 1px solid rgba(167, 139, 250, 0.12);
    border-radius: 12px;
    padding: 1rem 1rem;
    height: 100%;
}
.tarot-minor-card .tarot-minor-thumb {
    width: 52px;
    height: auto;
    border-radius: 6px;
    opacity: 0.88;
    flex-shrink: 0;
}
.tarot-minor-card h6 {
    color: #fff;
    font-size: 0.92rem;
    font-weight: 600;
    margin-bottom: 0.35rem;
}
.tarot-minor-card p { font-size: 0.8rem; margin: 0; color: #b8aed4; }

.btn-tarot-gold {
    background: linear-gradient(135deg, #f6d365 0%, #f0c74e 60%, #e0a82e 100%);
    color: #1a1244;
    font-weight: 700;
    border: none;
    border-radius: 999px;
    padding: 0.85rem 2.4rem;
    font-size: 1.05rem;
    box-shadow: 0 6px 22px rgba(240, 199, 78, 0.3);
    transition: all .25s;
}
.btn-tarot-gold:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(240, 199, 78, 0.5);
    color: #000;
}

/* ========== 真实塔罗牌面(用 daily-horoscope 抓取的图片) ========== */
.tarot-real-img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.55);
    display: block;
    user-select: none;
    background: #f3e7c6;
}
.tarot-back-img {
    width: 100%;
    aspect-ratio: 240/360;
    object-fit: cover;
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.55);
    display: block;
    user-select: none;
}

/* ========== 扇形牌阵(选牌区) ========== */
.tarot-fan {
    position: relative;
    height: 360px;
    margin: 1rem auto 2rem;
    max-width: 900px;
}
.tarot-fan-card {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 96px;
    transform-origin: 50% 130%;
    transition: transform .35s ease, filter .35s;
    cursor: pointer;
    will-change: transform;
}
.tarot-fan-card:hover { filter: brightness(1.18); z-index: 50; }
.tarot-fan-card.picked {
    transform: var(--tf-base) translateY(-30px) !important;
    filter: brightness(1.25) drop-shadow(0 0 14px rgba(240, 199, 78, 0.85));
    pointer-events: none;
}
.tarot-fan-card.picked .tarot-back-img {
    box-shadow: 0 6px 22px rgba(240, 199, 78, 0.55), inset 0 0 0 2px var(--gold);
}
.tarot-progress {
    text-align: center;
    margin: 1rem auto;
    color: #fff;
    font-size: 1.05rem;
}

/* ========== 结果页:中心标题 / 左牌 / 右长文 ========== */
.tarot-result-block {
    margin-bottom: 2.5rem;
}
.tarot-result-title {
    text-align: center;
    color: #fff;
    font-weight: 700;
    font-size: 1.25rem;
    margin-bottom: 1.4rem;
    letter-spacing: 0.3px;
}
.tarot-result-row {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 2rem;
    align-items: start;
}
.tarot-result-row .tarot-real-img {
    width: 200px;
    margin: 0 auto;
}
.tarot-result-text h4 {
    font-size: 1.5rem;
    color: #fff;
    font-weight: 700;
    margin-bottom: 0.6rem;
}
.tarot-result-text p {
    color: #d3ccea;
    line-height: 1.75;
    font-size: 1rem;
    margin: 0;
}

@media (max-width: 767px) {
    .tarot-result-row { grid-template-columns: 1fr; gap: 1rem; text-align: center; }
    .tarot-result-row .tarot-real-img { width: 160px; }
    .tarot-fan-card { width: 70px; }
    .tarot-fan { height: 280px; }
}

/* Tarot card of the day — fan pick (aligned with Celtic Cross fan UX) */
.tarot-cotd-page .tarot-cotd-hero {
    text-align: center;
}
.tarot-cotd-page .tarot-cotd-title {
    font-size: clamp(1.85rem, 4vw, 2.45rem);
    font-weight: 800;
    color: var(--gold);
    letter-spacing: 0.02em;
}
.tarot-cotd-page .tarot-cotd-pick-line {
    color: var(--gold);
    font-weight: 600;
    letter-spacing: 0.06em;
    font-size: 1.05rem;
}
.tarot-cotd-page .tarot-cotd-gold {
    color: var(--gold);
}
.tarot-fan.tarot-fan--cotd {
    height: 400px;
    margin-top: 0.5rem;
}
.tarot-fan--has-pick .tarot-fan-card--muted {
    opacity: 0.36;
    filter: grayscale(0.2);
    pointer-events: none;
    transition: opacity 0.35s ease, filter 0.35s ease;
}
.tarot-cotd-panel .tarot-fan-card.picked .tarot-real-img {
    max-width: 96px;
    width: 100%;
    height: auto;
}
@media (max-width: 767px) {
    .tarot-fan.tarot-fan--cotd { height: 300px; }
}

.tarot-cotd-result .tarot-cotd-result-img {
    max-width: min(240px, 88vw);
    width: 100%;
    height: auto;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.55), 0 0 0 2px rgba(240, 199, 78, 0.35);
}

/* ========== 商店产品卡 ========== */
.product-card {
    height: 100%;
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(76, 46, 131, 0.07);
    transition: transform .2s, box-shadow .2s;
    border: none;
    display: flex;
    flex-direction: column;
}
.product-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(76, 46, 131, 0.16);
}
.product-thumb {
    height: 170px;
    background: var(--gradient-cosmic);
    color: var(--gold);
    font-size: 4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.product-tag {
    position: absolute;
    top: 10px; left: 10px;
    background: var(--secondary);
    color: #fff;
    padding: 0.18rem 0.6rem;
    border-radius: 6px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}
.product-card .card-body { display: flex; flex-direction: column; flex: 1; }
.product-card .price {
    color: var(--secondary);
    font-weight: 700;
    font-size: 1.2rem;
}

/* ========== Horoscope 2026 dedicated page ========== */
.h2026-hero {
    background:
        radial-gradient(800px 380px at 20% 10%, rgba(111, 66, 193, 0.35), transparent 60%),
        radial-gradient(700px 320px at 85% 15%, rgba(240, 199, 78, 0.18), transparent 60%),
        #05030f;
    color: #fff;
    position: relative;
    overflow: hidden;
}
.h2026-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(255,255,255,0.13) 1px, transparent 1px);
    background-size: 32px 32px;
    opacity: 0.4;
    pointer-events: none;
}
.h2026-inner {
    position: relative;
    z-index: 1;
    padding: 3.5rem 0;
}
.h2026-hero h1 {
    font-size: clamp(2rem, 4vw, 3.4rem);
    font-weight: 800;
    margin-bottom: 1rem;
}
.h2026-hero p {
    font-size: 1.1rem;
    color: #dcd4ee;
    max-width: 680px;
}
.h2026-price-btn {
    border: none;
    margin-top: 1rem;
    padding: 0.9rem 1.8rem;
    border-radius: 14px;
    font-size: 1.2rem;
    font-weight: 800;
    color: #fff;
    background: linear-gradient(90deg, #7cc4ff 0%, #6f42c1 42%, #f0c74e 100%);
    box-shadow: 0 0 24px rgba(124, 196, 255, 0.5), 0 0 30px rgba(240, 199, 78, 0.3);
}
.h2026-phone {
    border: 1px solid rgba(255,255,255,0.28);
    border-radius: 20px;
    padding: 1rem 1rem 1.2rem;
    background: linear-gradient(180deg, rgba(15, 14, 24, 0.95), rgba(7, 7, 14, 0.95));
    box-shadow: 0 18px 36px rgba(0,0,0,0.45);
}
.h2026-phone-title {
    font-weight: 700;
    color: #fff;
    margin-bottom: 0.35rem;
}
.h2026-phone p {
    color: #bfb8d3;
    font-size: 0.95rem;
    margin: 0;
}

.h2026-reasons {
    background:
        radial-gradient(900px 500px at 50% -100px, rgba(111, 66, 193, 0.28), transparent 65%),
        #04030d;
    color: #fff;
    text-align: center;
    padding: 3.8rem 0 4.4rem;
}
.h2026-reasons h2 {
    font-size: clamp(1.9rem, 4vw, 3.3rem);
    font-weight: 800;
    max-width: 900px;
    margin: 0 auto;
}
.h2026-sub {
    font-size: 1.65rem;
    color: #ddd5ef;
    margin: 1.1rem 0;
}
.h2026-divider {
    width: 120px;
    height: 2px;
    background: rgba(255,255,255,0.82);
    margin: 0.8rem auto 1.8rem;
}
.h2026-caption {
    color: #d8d0ec;
    font-size: 1.2rem;
    margin-bottom: 2rem;
}
.horo-swiper {
    height: 260px;
    padding: 20px 0 !important;
}
.horo-swiper::before,
.horo-swiper::after {
    content: '';
    position: absolute;
    top: 0;
    width: 100px;
    height: 100%;
    z-index: 10;
    pointer-events: none;
}
.horo-swiper::before { left: 0; background: linear-gradient(90deg, #000, rgba(255,255,255,0)); }
.horo-swiper::after { right: 0; background: linear-gradient(270deg, #000, rgba(255,255,255,0)); }
.horo-swiper .swiper-slide {
    width: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.horo-swiper__card {
    position: absolute;
    width: 60px;
    height: 100%;
    border: 1px solid;
    border-radius: 15px;
    background: transparent;
    transition: .3s cubic-bezier(.37,0,.63,1);
}
.horo-swiper__card--azure { border-color: #91d1ff; }
.horo-swiper__card--violet { border-color: #6f55cc; }
.horo-swiper__card--pink { border-color: #ca57a3; }
.horo-swiper__card--yellow { border-color: #f2cc07; }
.horo-swiper__card-content {
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
    padding: 15px;
}
.horo-swiper__heading,
.horo-swiper__text {
    opacity: 0;
    transition: .3s cubic-bezier(.37,0,.63,1) .3s;
}
.horo-swiper__heading {
    font-size: 16px;
    font-style: italic;
    font-weight: 600;
}
.horo-swiper__text {
    font-size: 13px;
    line-height: 19px;
}
.horo-swiper__icon {
    position: absolute;
    bottom: 0;
    margin-bottom: 6px;
    font-size: 40px;
    transition: .3s ease-out;
}
.horo-swiper .swiper-slide-prev .horo-swiper__card { transform: translateX(-50%); }
.horo-swiper .swiper-slide-next .horo-swiper__card { transform: translateX(50%); }
.horo-swiper .swiper-slide-active .horo-swiper__card {
    width: 220px;
    box-shadow: 0 0 15px -2px #a4a4a4;
}
.horo-swiper .swiper-slide-active .horo-swiper__card--azure { background-color: #91d1ff; color: #000; }
.horo-swiper .swiper-slide-active .horo-swiper__card--violet { background-color: #6f55cc; color: #fff; }
.horo-swiper .swiper-slide-active .horo-swiper__card--pink { background-color: #ca57a3; color: #fff; }
.horo-swiper .swiper-slide-active .horo-swiper__card--yellow { background-color: #f2cc07; color: #000; }
.horo-swiper .swiper-slide-active .horo-swiper__heading,
.horo-swiper .swiper-slide-active .horo-swiper__text { opacity: 1; }
.horo-swiper .swiper-slide-active .horo-swiper__text { transition-delay: .7s; }

.horo-swiper-pagination {
    height: 10px;
    padding: 20px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.horo-swiper-pagination .swiper-pagination-bullet {
    width: 4px;
    height: 4px;
    background-color: #a4a4a4;
    opacity: 1;
    border-radius: 100%;
    transition: .3s ease-out;
}
.horo-swiper-pagination .swiper-pagination-bullet-active {
    width: 10px;
    height: 10px;
    background-color: #fff;
}
.h2026-section {
    padding: 2rem 0 2.8rem;
    background: #000;
}
.h2026-narrow {
    max-width: 980px;
}
.h2026-title {
    text-align: center;
    color: #fff;
    font-size: clamp(1.8rem, 4vw, 3.2rem);
    font-weight: 800;
    margin-bottom: 1.4rem;
}
.h2026-sub2 {
    text-align: center;
    color: #d4d4d4;
    margin-bottom: 1.3rem;
    font-size: 1.15rem;
}
.h2026-plan-wrap {
    border: 2px dashed rgba(255,255,255,0.85);
    border-radius: 16px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    overflow: hidden;
}
.h2026-plan-cell {
    padding: 1.25rem 1.5rem;
    display: grid;
    grid-template-columns: 26px 1fr;
    grid-template-rows: auto auto;
    column-gap: 0.8rem;
    row-gap: 0.1rem;
    cursor: pointer;
    position: relative;
}
.h2026-plan-cell + .h2026-plan-cell {
    border-left: 2px dashed rgba(255,255,255,0.75);
}
.h2026-plan-cell input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.h2026-radio-dot {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 2px solid #fff;
    margin-top: 0.2rem;
    background: transparent;
}
.h2026-plan-cell.selected .h2026-radio-dot {
    background: #f0c74e;
    box-shadow: 0 0 10px rgba(240,199,78,0.7);
    border-color: #fff;
}
.h2026-plan-price {
    color: #fff;
    font-size: 2rem;
    font-weight: 800;
    line-height: 1.1;
}
.h2026-plan-text {
    color: #d8d8d8;
    font-size: 1rem;
    grid-column: 2;
}
.h2026-buy-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 280px;
    height: 54px;
    border-radius: 8px;
    border: none;
    background: #dfbe5b;
    color: #151515;
    font-weight: 800;
    font-size: 1.2rem;
    text-decoration: none;
}
.h2026-buy-btn-link { text-decoration: none; }

.h2026-reviews {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}
.h2026-review-card {
    border: 1px solid rgba(255,255,255,0.8);
    border-radius: 18px;
    padding: 1.2rem 1.1rem;
    color: #fff;
    background: rgba(0,0,0,0.2);
}
.h2026-review-head {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    margin-bottom: 0.8rem;
}
.h2026-review-head img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: cover;
}
.h2026-review-head strong {
    font-size: 2rem;
    font-weight: 800;
}
.h2026-review-card p {
    margin: 0;
    font-size: 1rem;
    line-height: 1.45;
    color: #f0f0f0;
}

.h2026-faq-list {
    display: grid;
    gap: 0.9rem;
}
.h2026-faq-item {
    border: 1px solid rgba(255,255,255,0.85);
    border-radius: 16px;
    overflow: hidden;
    background: rgba(0,0,0,0.2);
}
.h2026-faq-q {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: none;
    background: transparent;
    color: #fff;
    font-size: 1.8rem;
    font-weight: 700;
    text-align: left;
    padding: 1rem 1.2rem;
}
.h2026-faq-q span {
    width: 34px;
    height: 34px;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #dfbe5b;
    color: #111;
    font-size: 1.8rem;
    line-height: 1;
}
.h2026-faq-a {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.25s ease;
}
.h2026-faq-item.open .h2026-faq-a {
    max-height: 260px;
}
.h2026-faq-a p {
    margin: 0;
    padding: 0 1.2rem 1.2rem;
    color: #e8e8e8;
    font-size: 1rem;
    line-height: 1.5;
}

@font-face {
    font-display: auto;
    font-family: current-year-horoscope;
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/current-year-horoscope.woff2") format("woff2"),
         url("../fonts/current-year-horoscope.woff") format("woff");
}
[class*=" icon-"], [class^="icon-"] {
    display: inline-block;
    font-family: current-year-horoscope !important;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.icon-travel:before { content: "\e000"; }
.icon-tarot:before { content: "\e001"; }
.icon-suggestions:before { content: "\e002"; }
.icon-money:before { content: "\e003"; }
.icon-love:before { content: "\e004"; }
.icon-health:before { content: "\e005"; }
.icon-general:before { content: "\e006"; }
.icon-family:before { content: "\e007"; }
.icon-education:before { content: "\e008"; }
.icon-china:before { content: "\e009"; }
.icon-career:before { content: "\e00a"; }
.icon-dates:before { content: "\e00b"; }

/* ========== Premium 套餐 ========== */
.plan-card {
    background: #fff;
    border: 2px solid #ece2f8;
    border-radius: 18px;
    padding: 2rem 1.5rem;
    text-align: center;
    height: 100%;
    transition: all .25s;
    position: relative;
}
.plan-card.featured {
    border-color: var(--gold);
    transform: scale(1.04);
    box-shadow: 0 12px 30px rgba(240, 199, 78, 0.25);
}
.plan-card.featured::before {
    content: 'MOST POPULAR';
    position: absolute;
    top: -14px; left: 50%;
    transform: translateX(-50%);
    background: var(--gradient-gold);
    color: #1f1b3d;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.3rem 0.9rem;
    border-radius: 999px;
    letter-spacing: 0.5px;
}
.plan-card .plan-price {
    font-size: 2.4rem;
    font-weight: 700;
    color: var(--primary-dark);
    margin: 0.5rem 0;
}
.plan-card .plan-price small {
    font-size: 0.95rem;
    color: var(--text-muted);
    font-weight: 400;
}
.plan-card ul {
    list-style: none;
    padding: 0;
    text-align: left;
    margin: 1.4rem 0;
}
.plan-card ul li {
    padding: 0.4rem 0 0.4rem 1.6rem;
    position: relative;
    color: #4a4564;
}
.plan-card ul li::before {
    content: '\2713';
    position: absolute;
    left: 0;
    color: #28a745;
    font-weight: 700;
}

/* ========== 文章 / 梦境 列表 ========== */
.list-card {
    background: #fff;
    border-radius: 14px;
    padding: 1.2rem 1.4rem;
    box-shadow: 0 2px 12px rgba(76, 46, 131, 0.06);
    transition: transform .2s, box-shadow .2s;
    height: 100%;
    display: block;
    color: inherit;
}
.list-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(76, 46, 131, 0.13);
    color: var(--primary-dark);
}
.list-card h5 {
    color: var(--primary-dark);
    font-weight: 700;
    margin-bottom: 0.4rem;
    font-size: 1.05rem;
}
.list-card .meta {
    color: var(--text-muted);
    font-size: 0.82rem;
    margin-bottom: 0.5rem;
}
.list-card p {
    color: #4a4564;
    font-size: 0.92rem;
    margin: 0;
}

/* ========== 页脚 ========== */
.footer-cosmic {
    background: var(--bg-deep);
    color: rgba(255,255,255,0.7);
    padding: 3rem 0 1.5rem;
    /* margin-top: 4rem; */
}
.footer-cosmic h6 {
    color: #fff;
    font-weight: 600;
    margin-bottom: 1rem;
}
.footer-cosmic a {
    color: rgba(255,255,255,0.7);
    text-decoration: none;
    display: block;
    padding: 0.25rem 0;
    transition: color .15s;
}
.footer-cosmic a:hover { color: var(--gold); }
.footer-cosmic .social-icons a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px; height: 36px;
    background: rgba(255,255,255,0.08);
    border-radius: 50%;
    margin-right: 0.4rem;
}
.footer-cosmic .social-icons a:hover {
    background: var(--gold);
    color: #1f1b3d;
}
.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.1);
    padding-top: 1.2rem;
    margin-top: 2rem;
    text-align: center;
    font-size: 0.85rem;
    color: rgba(255,255,255,0.5);
}

/* ========== 订阅条 ========== */
.subscribe-box {
    background: var(--gradient-cosmic);
    color: #fff;
    border-radius: 18px;
    padding: 2rem;
    text-align: center;
}
.subscribe-box .form-control {
    border: none;
    border-radius: 999px 0 0 999px;
    padding: 0.8rem 1.2rem;
}
.subscribe-box .btn {
    border-radius: 0 999px 999px 0;
    background: var(--gradient-gold);
    color: #1f1b3d;
    font-weight: 600;
    border: none;
    padding: 0.8rem 1.5rem;
}

/* ========== 标签页/分类 ========== */
.cat-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
}
.cat-tabs a {
    background: #fff;
    border: 1px solid #e0d6f5;
    color: var(--primary-dark);
    border-radius: 999px;
    padding: 0.4rem 1rem;
    font-size: 0.9rem;
    transition: all .2s;
}
.cat-tabs a.active,
.cat-tabs a:hover {
    background: var(--primary);
    color: #fff !important;
    border-color: var(--primary);
}

/* ========== 梦境关键词云(老样式,保留兼容) ========== */
.dream-tag {
    display: inline-block;
    background: #fff;
    border: 1px solid #e0d6f5;
    border-radius: 8px;
    padding: 0.5rem 0.9rem;
    margin: 0.25rem;
    color: var(--primary-dark);
    font-size: 0.9rem;
    transition: all .2s;
}
.dream-tag:hover {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

/* ========== 梦境符号网格(对照原站) ========== */
.dream-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 0.9rem;
}
.dream-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px solid #ece2f8;
    border-radius: 14px;
    padding: 1.2rem 0.6rem;
    text-align: center;
    color: var(--primary-dark);
    text-decoration: none;
    transition: all .25s ease;
    min-height: 110px;
}
.dream-card:hover {
    border-color: var(--primary);
    transform: translateY(-3px);
    box-shadow: 0 8px 22px rgba(108, 74, 182, 0.18);
    color: var(--primary);
}
.dream-card-icon {
    font-size: 2.2rem;
    line-height: 1;
    color: var(--primary);
    margin-bottom: 0.5rem;
    transition: transform .25s;
}
.dream-card:hover .dream-card-icon { transform: scale(1.1); }
.dream-card-name {
    font-weight: 600;
    font-size: 0.92rem;
    line-height: 1.2;
}
.dream-emoji {
    display: inline-block;
    font-size: 2rem;
    line-height: 1;
    font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', sans-serif;
}
.dream-detail-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px; height: 56px;
    background: linear-gradient(135deg, rgba(108, 74, 182, 0.1), rgba(233, 30, 99, 0.1));
    border-radius: 14px;
    margin-right: 0.8rem;
    font-size: 1.8rem;
    color: var(--primary);
    vertical-align: middle;
}
.dream-detail-icon .dream-emoji { font-size: 1.8rem; }

/* ========== 工具类 ========== */
.section-title {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--primary-dark);
    margin-bottom: 1.2rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.section-title::before {
    content: '';
    width: 4px;
    height: 24px;
    background: var(--gradient-gold);
    border-radius: 2px;
}

.text-cosmic { color: var(--primary-dark); }
.bg-cosmic { background: var(--gradient-cosmic); color: #fff; }

/* Homepage dark sections (hero excluded): same background + readable text */
.cosmic-dark-band {
    background: #0e0a25;
    background-image:
        radial-gradient(circle at 20% 20%, rgba(108, 74, 182, 0.18), transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(233, 30, 99, 0.12), transparent 55%);
    color: #fff;
}
.top-articles-section {
    padding: 2.5rem 0 2.5rem;
}
.cosmic-band-lead {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.95rem;
    margin-bottom: 0;
}
.section-title.section-title--on-dark {
    color: #f4f0ff;
}
.section-title.section-title--on-dark::before {
    background: linear-gradient(180deg, #f0c74e, #e8a317);
}
/* Same horizontal rail as zodiac + quick picks (Top Articles aligns with cards above) */
.jfu-panels.jfu-panels--align-wide {
    max-width: 48rem;
}
@media (min-width: 768px) {
    .jfu-panels.jfu-panels--align-wide {
        max-width: 52rem;
    }
}
@media (min-width: 1200px) {
    .jfu-panels.jfu-panels--align-wide {
        max-width: 58rem;
    }
}
.top-articles-all {
    color: #f0c74e;
}
.top-articles-all:hover {
    color: #ffe08a;
}
.top-articles-section .list-card h5 {
    font-size: 1.12rem;
}
.top-articles-section .list-card .meta {
    font-size: 0.88rem;
}
.top-articles-section .list-card p {
    font-size: 0.98rem;
}

/* ========== "Just For You" 暗黑特色板块 ========== */
.jfu-section {
    padding: 1.25rem 0 3.25rem;
}

/* Narrower feature grids (match reference proportions) */
.jfu-panels {
    max-width: 38rem;
    margin-left: auto;
    margin-right: auto;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
@media (min-width: 576px) {
    .jfu-panels {
        max-width: 40rem;
    }
}

/* 标题在首页位于 .jfu-section 内；文章页嵌入时仅有 .jfu-panels，须同套样式 */
.jfu-section .jfu-title,
.jfu-panels .jfu-title {
    text-align: center;
    color: #f0c74e;
    font-weight: 700;
    font-size: 1.45rem;
    letter-spacing: 0.35px;
    margin-bottom: 1.35rem;
}

/* 金色胶囊推荐按钮 */
.jfu-pill {
    display: flex;
    align-items: center;
    gap: 0.72rem;
    padding: 0.72rem 1rem 0.72rem 0.72rem;
    background: linear-gradient(180deg, #fbb90c, #ffe8ac 50%, #ffb900 100%, #ffe9ae);
    border-radius: 999px;
    color: #111 !important;
    text-decoration: none;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.32px;
    font-size: 0.78rem;
    line-height: 1.25;
    transition: all .25s ease;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.22);
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.35);
}
.jfu-pill::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255,255,255,0.35) 0%, rgba(255,255,255,0.08) 35%, transparent 58%);
    pointer-events: none;
}
.jfu-pill:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(251, 185, 12, 0.35);
    color: #000 !important;
}
.jfu-pill .jfu-icon {
    flex-shrink: 0;
    width: 40px; height: 40px;
    border-radius: 50%;
    border: 1.25px solid rgba(17, 17, 17, 0.35);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.05rem;
    background: linear-gradient(180deg, #fbb90c, #ffe8ac 48%, #ffb900 100%, #ffe9ae);
    color: #111;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}
.jfu-pill .jfu-icon .jfu-icon-svg {
    display: block;
    flex-shrink: 0;
}
.jfu-pill .jfu-text {
    line-height: 1.2;
    flex: 1;
    min-width: 0;
    font-weight: 800;
    letter-spacing: 0.03em;
}

/* "MOST POPULAR" 红粉渐变特色卡 */
.jfu-pill.featured {
    background: linear-gradient(135deg, #4f80ff 0%, #f70a65 60%, #c80b71 100%);
    color: #fff !important;
    border-color: rgba(255,255,255,0.3);
    box-shadow: 0 6px 22px rgba(233, 30, 99, 0.4);
}
.jfu-pill.featured::before {
    background: linear-gradient(180deg, rgba(255,255,255,0.22) 0%, transparent 45%);
}
.jfu-pill.featured .jfu-icon {
    background: rgba(255, 255, 255, 0.22);
    border-color: rgba(255, 255, 255, 0.85);
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}
.jfu-pill.featured:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(233, 30, 99, 0.6);
    color: #fff !important;
}
.jfu-pill .jfu-badge {
    position: absolute;
    top: 5px; right: 10px;
    background: #fff;
    color: #d81b60;
    font-size: 0.56rem;
    font-weight: 700;
    padding: 0.08rem 0.42rem;
    border-radius: 999px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

/* 头部 "USERS LIKE YOU ALSO LOVED" 粉紫胶囊标题 */
.also-loved-label {
    display: inline-block;
    background: linear-gradient(135deg, #e26bff 0%, #b53fff 100%);
    color: #fff;
    padding: 0.38rem 1.05rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    box-shadow: 0 3px 12px rgba(177, 60, 242, 0.35);
    margin-bottom: 1.35rem;
}

/* 暗色金描边推荐卡 */
.also-loved-card {
    display: flex;
    align-items: center;
    gap: 0.82rem;
    padding: 0.82rem 1.2rem;
    background: rgba(20, 14, 53, 0.5);
    border: 1px solid rgba(211, 171, 74, 0.62);
    border-radius: 999px;
    color: #d8b34d !important;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.88rem;
    transition: all .25s ease;
}
.also-loved-card:hover {
    background: rgba(240, 199, 78, 0.08);
    border-color: var(--gold);
    transform: translateX(4px);
    color: #fff !important;
}
.also-loved-card .also-icon {
    width: 34px; height: 34px;
    border-radius: 50%;
    border: 1px solid rgba(211, 171, 74, 0.56);
    display: flex; align-items: center; justify-content: center;
    font-size: 0.92rem;
    flex-shrink: 0;
}
.also-loved-card.highlight {
    border-color: #9f4bff;
    color: #c879ff !important;
    box-shadow: 0 0 0 1px rgba(200, 121, 255, 0.26), 0 0 22px rgba(146, 66, 255, 0.35);
}
.also-loved-card.highlight .also-icon {
    border-color: #9f4bff;
    color: #c879ff;
}
.also-loved-card.highlight:hover {
    background: rgba(177, 60, 242, 0.1);
    color: #fff !important;
}

@media (max-width: 767px) {
    .hero-banner { padding: 2.5rem 0 2rem; }
    .hero-banner h1 { font-size: 1.9rem; }
    .horoscope-card { padding: 1.4rem; }
    .horoscope-card h1 { font-size: 1.4rem; }
    .jfu-panels { max-width: 100%; }
    .jfu-panels.jfu-panels--align-wide { max-width: 100%; }
    .jfu-section .jfu-title,
    .jfu-panels .jfu-title { font-size: 1.28rem; margin-bottom: 1.15rem; }
    .jfu-pill { font-size: 0.68rem; padding: 0.62rem 0.78rem 0.62rem 0.58rem; letter-spacing: 0.22px; }
    .jfu-pill .jfu-icon { width: 34px; height: 34px; font-size: 0.95rem; }
    .jfu-pill .jfu-badge { font-size: 0.5rem; }
    .also-loved-label { font-size: 0.65rem; padding: 0.34rem 0.88rem; }
    .also-loved-card { font-size: 0.78rem; padding: 0.68rem 0.95rem; }
    .also-loved-card .also-icon { width: 30px; height: 30px; font-size: 0.82rem; }
}
@media (max-width: 991px) {
    .horo-swiper::before,
    .horo-swiper::after {
        width: 64px;
    }
}
@media (max-width: 767px) {
    .h2026-inner {
        padding: 2.2rem 0;
    }
    .h2026-sub {
        font-size: 1.05rem;
    }
    .h2026-caption {
        font-size: 1.02rem;
    }
    .horo-swiper {
        height: 230px;
    }
    .horo-swiper .swiper-slide-active .horo-swiper__card {
        width: 208px;
    }
    .h2026-plan-wrap {
        grid-template-columns: 1fr;
    }
    .h2026-plan-cell + .h2026-plan-cell {
        border-left: none;
        border-top: 2px dashed rgba(255,255,255,0.75);
    }
    .h2026-reviews {
        grid-template-columns: 1fr;
    }
    .h2026-review-head strong,
    .h2026-faq-q,
    .h2026-buy-btn {
        font-size: 1.0rem;
    }
}

/* ========== Daily article: daily-horoscope.us palette (navy + gold + blue links) ========== */
body.page-daily-dh {
    --dh-bg: #0f172b;
    --dh-surface: #15151f;
    --dh-border: #282838;
    --dh-gold: #e9b73f;
    --dh-gold-deep: #9b7928;
    --dh-text: #ffffff;
    --dh-muted: #a098c7;
    --dh-link: #2b7fff;
    --dh-body: #d6d2e8;
}

body.page-daily-dh {
    font-family: 'Open Sans', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    background: var(--dh-bg);
    color: var(--dh-body);
}

body.page-daily-dh .navbar-cosmic,
body.page-weekly-dh .navbar-cosmic,
body.page-tomorrow .navbar-cosmic {
    background: linear-gradient(90deg, #15151f 0%, #101522 45%, #0f141c 100%);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.4);
}

body.page-daily-dh .nav-mega-panel,
body.page-weekly-dh .nav-mega-panel,
body.page-tomorrow .nav-mega-panel {
    background: #15151f;
    border-top-color: rgba(233, 183, 63, 0.12);
}

body.page-daily-dh .breadcrumb-cosmic a {
    color: var(--dh-link);
}
body.page-daily-dh .breadcrumb-cosmic .active {
    color: var(--dh-muted);
}

body.page-daily-dh .text-muted {
    color: #8a849e !important;
}

body.page-daily-dh .text-cosmic {
    color: var(--dh-gold) !important;
}

body.page-daily-dh .cat-tabs a {
    background: var(--dh-surface);
    border: 1px solid var(--dh-border);
    color: var(--dh-text);
}
body.page-daily-dh .cat-tabs a:hover {
    border-color: var(--dh-gold);
    color: var(--dh-gold);
    background: rgba(233, 183, 63, 0.08);
}
body.page-daily-dh .cat-tabs a.active {
    background: var(--dh-gold);
    color: #15151f !important;
    border-color: var(--dh-gold);
    font-weight: 600;
}

/* Daily: centered column + vertical tabs + sidebar blocks below (no split layout) */
body.page-daily-dh nav[aria-label="breadcrumb"] .breadcrumb {
    justify-content: center;
    flex-wrap: wrap;
}
body.page-daily-dh .daily-dh-column {
    width: 100%;
}
body.page-daily-dh .cat-tabs.cat-tabs--stack {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 0.5rem;
    max-width: 100%;
    margin-bottom: 1.25rem;
}
body.page-daily-dh .cat-tabs.cat-tabs--stack a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    width: 100%;
    max-width: 100%;
    text-align: center;
    white-space: normal;
    box-sizing: border-box;
}
body.page-daily-dh .daily-dh-below {
    width: 100%;
}

body.page-daily-dh .dh-stack-type-title {
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--dh-gold);
    margin: 0 0 1rem;
    padding-bottom: 0.65rem;
    border-bottom: 1px solid var(--dh-border);
}
body.page-daily-dh .dh-stack-type-title .bi {
    color: var(--dh-gold);
}

body.page-daily-dh .horoscope-card {
    background: var(--dh-surface);
    border: 1px solid var(--dh-border);
    border-radius: 20px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
    color: var(--dh-body);
}
body.page-daily-dh .horoscope-card .author {
    color: var(--dh-muted);
}
body.page-daily-dh .horoscope-card .author a {
    color: var(--dh-gold);
    text-decoration: underline;
    text-underline-offset: 2px;
}
body.page-daily-dh .horoscope-card .author a:hover {
    color: #f5d78a;
}

body.page-daily-dh .dh-article-h1 {
    font-size: clamp(1.45rem, 4vw, 2rem);
    font-weight: 700;
    color: var(--dh-text);
    letter-spacing: -0.02em;
}

body.page-daily-dh .dh-sign-symbol {
    font-size: clamp(2.5rem, 6vw, 3.25rem);
    line-height: 1;
}
body.page-daily-dh .dh-sign-symbol.dh-type-general { color: var(--dh-gold); }
body.page-daily-dh .dh-sign-symbol.dh-type-love { color: #ff85a8; }
body.page-daily-dh .dh-sign-symbol.dh-type-money { color: #5eead4; }
body.page-daily-dh .dh-sign-symbol.dh-type-career { color: #7cb3ff; }

body.page-daily-dh .dh-keywords-line {
    font-size: 0.95rem;
    line-height: 1.65;
    color: var(--dh-body);
    margin-bottom: 1rem;
}
body.page-daily-dh .dh-kw-label {
    color: var(--dh-gold);
    font-weight: 600;
    margin-right: 0.35rem;
}

body.page-daily-dh .dh-reading-body {
    font-size: 1rem;
    line-height: 1.75;
    color: var(--dh-body);
    margin-bottom: 1.25rem;
}

body.page-daily-dh .dh-score-block {
    background: linear-gradient(135deg, rgba(233, 183, 63, 0.14) 0%, rgba(15, 23, 43, 0.98) 55%);
    border: 1px solid rgba(233, 183, 63, 0.35);
    border-radius: 14px;
    color: var(--dh-text);
}
body.page-daily-dh .dh-score-block .score-num {
    color: var(--dh-gold);
}
body.page-daily-dh .dh-score-den {
    font-size: 1.35rem;
    font-weight: 600;
    opacity: 0.88;
    margin-left: 0.06rem;
}
body.page-daily-dh .dh-score-rating {
    font-weight: 600;
    font-size: 1.05rem;
}
body.page-daily-dh .dh-score-sub {
    color: var(--dh-muted);
}

body.page-daily-dh .dh-section-title {
    color: var(--dh-gold);
    font-size: 1.05rem;
    font-weight: 600;
}
body.page-daily-dh .dh-section-title .bi-check-circle-fill { color: #4ade80 !important; }
body.page-daily-dh .dh-section-title .bi-x-circle-fill { color: #f87171 !important; }

body.page-daily-dh .do-list li,
body.page-daily-dh .avoid-list li {
    color: var(--dh-body);
    border-bottom: 1px solid rgba(40, 40, 56, 0.85);
}
body.page-daily-dh .do-list li:last-child,
body.page-daily-dh .avoid-list li:last-child {
    border-bottom: none;
}
body.page-daily-dh .do-list li::before { color: var(--dh-gold); }
body.page-daily-dh .avoid-list li::before { color: #f87171; }

body.page-daily-dh .dh-tip-of-day {
    background: rgba(233, 183, 63, 0.08);
    border-left: 4px solid var(--dh-gold);
    color: var(--dh-body);
    font-style: normal;
}
body.page-daily-dh .dh-tip-of-day strong {
    color: var(--dh-gold);
}

body.page-daily-dh .dh-article-actions .btn-outline-primary {
    color: var(--dh-link);
    border-color: var(--dh-link);
}
body.page-daily-dh .dh-article-actions .btn-outline-primary:hover {
    background: var(--dh-link);
    color: #fff;
}

body.page-daily-dh .card-soft {
    background: var(--dh-surface);
    border: 1px solid var(--dh-border);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28);
    color: var(--dh-body);
}
body.page-daily-dh .card-soft h5,
body.page-daily-dh .card-soft h6 {
    color: var(--dh-text);
}

body.page-daily-dh .form-control {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid var(--dh-border);
    color: var(--dh-text);
}
body.page-daily-dh .form-control::placeholder {
    color: #6b6578;
}
body.page-daily-dh .form-control:focus {
    background: rgba(255, 255, 255, 0.1);
    border-color: var(--dh-gold);
    color: var(--dh-text);
    box-shadow: 0 0 0 0.2rem rgba(233, 183, 63, 0.2);
}

body.page-daily-dh .form-select {
    background-color: rgba(255, 255, 255, 0.06);
    border-color: var(--dh-border);
    color: var(--dh-text);
}
body.page-daily-dh .form-select:focus {
    border-color: var(--dh-gold);
    box-shadow: 0 0 0 0.2rem rgba(233, 183, 63, 0.2);
}

body.page-daily-dh .mood-emojis .mood-btn {
    border-color: var(--dh-border);
}
body.page-daily-dh .mood-emojis .mood-btn:hover,
body.page-daily-dh .mood-emojis .mood-btn.selected {
    border-color: var(--dh-gold);
    background: rgba(233, 183, 63, 0.12);
}

body.page-daily-dh .badge.bg-light {
    background: rgba(255, 255, 255, 0.08) !important;
    color: var(--dh-gold) !important;
    border: 1px solid var(--dh-border);
}

body.page-daily-dh .comment-item {
    border-bottom-color: var(--dh-border);
}
body.page-daily-dh .comment-item strong {
    color: var(--dh-text);
}
body.page-daily-dh .comment-item p {
    color: var(--dh-body);
}
body.page-daily-dh .comment-meta {
    color: #8a849e !important;
}
body.page-daily-dh .comment-avatar {
    background: linear-gradient(135deg, var(--dh-gold-deep), var(--dh-gold));
    color: #15151f;
}
body.page-daily-dh .vote-btn {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid var(--dh-border);
    color: var(--dh-body);
}
body.page-daily-dh .vote-btn:hover {
    background: rgba(233, 183, 63, 0.15);
    color: var(--dh-gold);
}

body.page-daily-dh .card-soft a.text-decoration-none:hover .small.text-cosmic {
    color: var(--dh-link) !important;
}

body.page-daily-dh .dh-sidebar-promo {
    background: linear-gradient(145deg, #1a2340 0%, #15151f 55%, #101827 100%) !important;
    border: 1px solid rgba(233, 183, 63, 0.25);
    color: var(--dh-text) !important;
}
body.page-daily-dh .dh-sidebar-promo-icon {
    font-size: 2.4rem;
    color: var(--dh-gold);
}

body.page-daily-dh .footer-cosmic,
body.page-weekly-dh .footer-cosmic {
    background: #0b0f1c;
    border-top: 1px solid #282838;
}
body.page-daily-dh .footer-cosmic h6,
body.page-daily-dh .footer-cosmic .small,
body.page-weekly-dh .footer-cosmic h6,
body.page-weekly-dh .footer-cosmic .small {
    color: var(--dh-muted);
}
body.page-daily-dh .footer-cosmic a,
body.page-weekly-dh .footer-cosmic a {
    color: var(--dh-link);
}
body.page-daily-dh .footer-cosmic a:hover,
body.page-weekly-dh .footer-cosmic a:hover {
    color: var(--dh-gold);
}
body.page-daily-dh .footer-cosmic .social-icons a,
body.page-weekly-dh .footer-cosmic .social-icons a {
    color: var(--dh-gold);
}
body.page-daily-dh .footer-cosmic .footer-bottom,
body.page-weekly-dh .footer-cosmic .footer-bottom {
    color: #6b7280;
}

/* ========== Weekly page: same dark palette, four stacked type blocks ========== */
body.page-weekly-dh {
    --wh-bg: #0f172b;
    --wh-surface: #15151f;
    --wh-border: #282838;
    --wh-gold: #e9b73f;
    --wh-text: #ffffff;
    --wh-muted: #a098c7;
    --wh-link: #2b7fff;
    --wh-body: #d6d2e8;
    /* footer rules share --dh-* with daily */
    --dh-muted: #a098c7;
    --dh-link: #2b7fff;
    --dh-gold: #e9b73f;
}
body.page-weekly-dh {
    font-family: 'Open Sans', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    background: var(--wh-bg);
    color: var(--wh-body);
}
body.page-weekly-dh .weekly-dh-hero {
    background: linear-gradient(135deg, #15151f 0%, #0f172b 55%, #121a2e 100%);
    color: var(--wh-text);
    border-bottom: 1px solid var(--wh-border);
}
body.page-weekly-dh .weekly-dh-hero-title {
    font-weight: 700;
    font-size: clamp(1.6rem, 4vw, 2.1rem);
    color: var(--wh-text);
}
body.page-weekly-dh .weekly-dh-hero-lead {
    color: var(--wh-body);
    opacity: 0.95;
}
body.page-weekly-dh .weekly-dh-hero-sub {
    color: var(--wh-muted);
    max-width: 40rem;
    margin-left: auto;
    margin-right: auto;
}
@media (min-width: 768px) {
    body.page-weekly-dh .weekly-dh-hero-sub {
        margin-left: 0;
        margin-right: 0;
    }
}
body.page-weekly-dh .weekly-stack-heading {
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--wh-gold);
    margin: 0 0 0.5rem;
    padding-bottom: 0.65rem;
    border-bottom: 1px solid var(--wh-border);
}
body.page-weekly-dh .weekly-stack-heading .bi {
    color: var(--wh-gold);
}
body.page-weekly-dh .weekly-stack-lead {
    color: var(--wh-muted);
}
body.page-weekly-dh .weekly-dh-card {
    background: var(--wh-surface);
    border: 1px solid var(--wh-border);
    border-radius: 14px;
    box-shadow: 0 6px 22px rgba(0, 0, 0, 0.22);
    transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
    color: var(--wh-body);
}
body.page-weekly-dh .weekly-dh-card:hover {
    transform: translateY(-3px);
    border-color: rgba(233, 183, 63, 0.45);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
}
body.page-weekly-dh .weekly-dh-card-name {
    color: var(--wh-text);
}
body.page-weekly-dh .weekly-dh-card-date {
    color: var(--wh-muted);
}
body.page-weekly-dh .weekly-dh-card-symbol {
    color: var(--wh-gold);
    line-height: 1;
}
body.page-weekly-dh .weekly-dh-kw {
    display: inline-block;
    font-size: 0.72rem;
    padding: 0.2rem 0.55rem;
    margin: 0.15rem 0.2rem 0.15rem 0;
    border-radius: 999px;
    border: 1px solid rgba(233, 183, 63, 0.25);
    background: rgba(233, 183, 63, 0.08);
    color: var(--wh-body);
}
body.page-weekly-dh .weekly-dh-card-tip {
    color: var(--wh-body);
    opacity: 0.92;
}
body.page-weekly-dh .weekly-dh-card-cta {
    color: var(--wh-link);
}

@media (max-width: 575px) {
    body.page-daily-dh .dh-article-head {
        flex-direction: column;
        align-items: flex-start !important;
    }
}

/* Articles hub — single column: feed then side blocks; centered with horizontal inset */
.page-articles-dh .articles-page-shell {
    width: 100%;
    padding-left: clamp(1rem, 4vw, 2.75rem);
    padding-right: clamp(1rem, 4vw, 2.75rem);
    box-sizing: border-box;
}
.page-articles-dh .articles-page-constrain {
    max-width: 1080px;
    margin-left: auto;
    margin-right: auto;
}
.page-articles-dh .articles-dh-sidebar--below {
    margin-top: 2.5rem;
    padding-top: 2.25rem;
    border-top: 1px solid var(--dh-border);
}
.page-articles-dh .articles-dh-title {
    font-size: clamp(1.75rem, 4vw, 2.25rem);
    font-weight: 700;
    color: var(--dh-text);
    letter-spacing: -0.02em;
    margin-bottom: 1rem;
}
.page-articles-dh .articles-dh-main .cat-tabs {
    justify-content: flex-start;
}
.page-articles-dh .articles-feed-list {
    margin-top: 0.25rem;
}
.page-articles-dh .articles-feed-item {
    padding: 1.35rem 0;
    border-bottom: 1px solid var(--dh-border);
}
.page-articles-dh .articles-feed-item:last-child {
    border-bottom: none;
}
.page-articles-dh .articles-feed-linkwrap:hover .articles-feed-title {
    color: var(--dh-gold);
}
.page-articles-dh .articles-feed-meta {
    font-size: 0.8rem;
    color: var(--dh-muted);
    margin-bottom: 0.45rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.5rem;
}
.page-articles-dh .articles-feed-title {
    font-size: 1.2rem;
    font-weight: 650;
    color: var(--dh-text);
    margin: 0 0 0.5rem;
    line-height: 1.35;
    transition: color 0.15s;
}
.page-articles-dh .articles-feed-excerpt {
    font-size: 0.92rem;
    line-height: 1.55;
    color: var(--dh-body);
    margin: 0 0 0.35rem;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.page-articles-dh .articles-feed-by {
    font-size: 0.78rem;
    color: var(--dh-muted);
}
.page-articles-dh .articles-load-more-wrap {
    margin-top: 1.75rem;
}
.page-articles-dh .articles-load-more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 200px;
    padding: 0.65rem 1.75rem;
    font-weight: 600;
    border-radius: 999px;
    border: 1px solid var(--dh-gold);
    background: transparent;
    color: var(--dh-gold);
    text-decoration: none;
    transition: background 0.15s, color 0.15s;
}
.page-articles-dh .articles-load-more:hover {
    background: var(--dh-gold);
    color: #15151f;
}
.page-articles-dh .articles-dh-sidebar-inner {
    position: static;
}
.page-articles-dh .articles-side-block {
    background: var(--dh-surface);
    border: 1px solid var(--dh-border);
    border-radius: 16px;
    padding: 1.15rem 1rem 1.25rem;
    margin-bottom: 1.25rem;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28);
}
.page-articles-dh .articles-side-title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--dh-text);
    margin: 0 0 0.85rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--dh-border);
}
/* JFY + Also Loved on articles page: shared component — same sizing as homepage (no overrides). */
.page-articles-dh .articles-engagement-embed {
    width: 100%;
}
.page-articles-dh .articles-engagement-embed + .articles-side-block {
    margin-top: 1.5rem;
}
.page-articles-dh .articles-top-card {
    display: block;
    text-decoration: none;
    color: inherit;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(233, 183, 63, 0.2);
    background: rgba(0, 0, 0, 0.15);
    padding: 1rem;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.page-articles-dh .articles-top-card:hover {
    border-color: var(--dh-gold);
    box-shadow: 0 6px 20px rgba(233, 183, 63, 0.12);
}
.page-articles-dh .articles-top-card h3 {
    font-size: 1.05rem;
    font-weight: 650;
    color: var(--dh-text);
    margin: 0 0 0.5rem;
    line-height: 1.35;
}
.page-articles-dh .articles-top-meta {
    font-size: 0.75rem;
    color: var(--dh-muted);
    margin-bottom: 0.65rem;
}
.page-articles-dh .articles-top-excerpt {
    font-size: 0.82rem;
    line-height: 1.55;
    color: var(--dh-body);
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ========== Daily Love hub (/daily/love) — dark cards + line-art icons ========== */
.daily-love-hero .daily-love-hero-title {
    font-size: clamp(1.35rem, 4vw, 1.85rem);
}
.daily-love-hub-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}
@media (min-width: 768px) {
    .daily-love-hub-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1.25rem;
    }
}
.daily-love-card {
    display: block;
    text-align: center;
    text-decoration: none;
    color: var(--dh-text);
    background: var(--dh-surface);
    border: 1px solid rgba(233, 183, 63, 0.38);
    border-radius: 16px;
    padding: 1.15rem 0.75rem 1.25rem;
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28);
}
.daily-love-card:hover {
    transform: translateY(-3px);
    border-color: var(--dh-gold);
    box-shadow: 0 12px 36px rgba(233, 183, 63, 0.12);
    color: var(--dh-text);
}
.daily-love-card-icon-wrap {
    width: 56px;
    height: 56px;
    margin: 0 auto 0.65rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.06);
}
.daily-love-card-icon-wrap .daily-love-hub-icon {
    width: 44px;
    height: 44px;
}
.daily-love-card-name {
    font-weight: 650;
    font-size: 1.02rem;
    margin-bottom: 0.2rem;
}
.daily-love-card-date {
    font-size: 0.8rem;
    color: var(--dh-muted);
}

/* Daily Love detail — richer article layout */
.dh-love-byline {
    letter-spacing: 0.02em;
}
.dh-love-rich .dh-love-subhead {
    font-size: 1.05rem;
    font-weight: 650;
    color: var(--dh-text);
    margin-bottom: 0.75rem;
}
.dh-love-rich-prose .dh-reading-body {
    line-height: 1.7;
}
.dh-love-callout {
    background: rgba(0, 0, 0, 0.18);
    border: 1px solid rgba(255, 133, 168, 0.22);
    border-radius: 14px;
    padding: 1rem 1.1rem;
}
.dh-love-callout .dh-love-subhead {
    color: #ff9ebd;
    margin-bottom: 0.5rem;
}
.dh-love-lucky {
    color: var(--dh-body);
}
.dh-love-lead-snippet {
    border-left: 3px solid rgba(255, 133, 168, 0.55);
    padding-left: 1rem;
}

/* Daily / tomorrow / weekly money hub + article (mirrors love chrome, teal accent) */
.cosmic-dark-band.daily-money-hub {
    background: radial-gradient(ellipse 120% 80% at 50% 0%, rgba(0, 212, 170, 0.12), transparent 55%),
        linear-gradient(180deg, #05060a 0%, #0a0c12 100%);
}
.daily-money-hub-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 1.25rem 1rem;
    margin-top: 2rem;
}
@media (min-width: 768px) {
    .daily-money-hub-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}
.daily-money-hub-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    text-decoration: none;
    color: inherit;
    padding: 1rem 0.5rem 1.25rem;
    border-radius: 14px;
    border: 1px solid rgba(245, 215, 142, 0.22);
    background: rgba(10, 12, 18, 0.85);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}
.daily-money-hub-card:hover {
    transform: translateY(-3px);
    border-color: rgba(245, 215, 142, 0.45);
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.45);
}
.daily-money-hub-icon-wrap {
    width: 72px;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.65rem;
}
.daily-money-hub-icon-wrap svg {
    width: 100%;
    height: 100%;
    display: block;
}
.daily-money-hub-sign {
    display: inline-block;
    padding: 0.35rem 0.85rem;
    border-radius: 999px;
    border: 1px solid rgba(245, 215, 142, 0.55);
    font-weight: 700;
    font-size: 0.95rem;
    color: #fff;
    margin-bottom: 0.35rem;
}
.daily-money-hub-dates {
    font-size: 0.72rem;
    color: rgba(255, 255, 255, 0.55);
    line-height: 1.35;
}

body.page-daily-dh .horoscope-card.dh-type-money {
    border-color: rgba(0, 212, 170, 0.22);
    box-shadow: 0 0 0 1px rgba(0, 212, 170, 0.06), 0 16px 44px rgba(0, 0, 0, 0.38);
}
body.page-daily-dh .horoscope-card.dh-type-money .dh-article-h1 {
    color: #f5d78e;
}
body.page-daily-dh .horoscope-card.dh-type-money .dh-kw-label {
    color: #7ee8d4;
}
body.page-daily-dh .horoscope-card.dh-type-money .dh-money-byline {
    color: rgba(0, 212, 170, 0.88) !important;
}
body.page-daily-dh .horoscope-card.dh-type-money .dh-score-block {
    background: linear-gradient(135deg, rgba(0, 212, 170, 0.12) 0%, rgba(15, 23, 43, 0.98) 55%);
    border-color: rgba(0, 212, 170, 0.38);
}
body.page-daily-dh .horoscope-card.dh-type-money .dh-score-block .score-num {
    color: #00d4aa;
}
body.page-daily-dh .horoscope-card.dh-type-money .dh-money-callout {
    border-radius: 12px;
    padding: 1rem 1.15rem;
    margin: 1rem 0;
    border: 1px solid rgba(0, 212, 170, 0.28);
    background: rgba(0, 212, 170, 0.06);
}
body.page-daily-dh .horoscope-card.dh-type-money .dh-money-callout .dh-money-subhead {
    color: #7ee8d4;
    margin-bottom: 0.5rem;
}
body.page-daily-dh .horoscope-card.dh-type-money .dh-money-lucky {
    color: rgba(255, 255, 255, 0.82);
}
body.page-daily-dh .horoscope-card.dh-type-money .dh-money-lead-snippet {
    border-left: 3px solid rgba(0, 212, 170, 0.55);
    padding-left: 1rem;
}

/* Career hub band + career article (sky-blue accent, matches dh-type-career symbol) */
.cosmic-dark-band.daily-career-hub {
    background: radial-gradient(ellipse 120% 80% at 50% 0%, rgba(124, 179, 255, 0.14), transparent 55%),
        linear-gradient(180deg, #05060a 0%, #0a0c12 100%);
}

body.page-daily-dh .horoscope-card.dh-type-career {
    border-color: rgba(124, 179, 255, 0.28);
    box-shadow: 0 0 0 1px rgba(124, 179, 255, 0.08), 0 16px 44px rgba(0, 0, 0, 0.38);
}
body.page-daily-dh .horoscope-card.dh-type-career .dh-article-h1 {
    color: #f5d78e;
}
body.page-daily-dh .horoscope-card.dh-type-career .dh-kw-label {
    color: #9ec5ff;
}
body.page-daily-dh .horoscope-card.dh-type-career .dh-career-byline {
    color: rgba(124, 179, 255, 0.95) !important;
}
body.page-daily-dh .horoscope-card.dh-type-career .dh-score-block {
    background: linear-gradient(135deg, rgba(124, 179, 255, 0.14) 0%, rgba(15, 23, 43, 0.98) 55%);
    border-color: rgba(124, 179, 255, 0.42);
}
body.page-daily-dh .horoscope-card.dh-type-career .dh-score-block .score-num {
    color: #7cb3ff;
}
body.page-daily-dh .horoscope-card.dh-type-career .dh-career-callout {
    border-radius: 12px;
    padding: 1rem 1.15rem;
    margin: 1rem 0;
    border: 1px solid rgba(124, 179, 255, 0.3);
    background: rgba(124, 179, 255, 0.07);
}
body.page-daily-dh .horoscope-card.dh-type-career .dh-career-callout .dh-career-subhead {
    color: #b8d4ff;
    margin-bottom: 0.5rem;
}
body.page-daily-dh .horoscope-card.dh-type-career .dh-career-lucky {
    color: rgba(255, 255, 255, 0.82);
}
body.page-daily-dh .horoscope-card.dh-type-career .dh-career-lead-snippet {
    border-left: 3px solid rgba(124, 179, 255, 0.6);
    padding-left: 1rem;
}
body.page-daily-dh .horoscope-card.dh-type-career .dh-career-subhead {
    color: #e8f1ff;
}

/* ========== About Us — daily-horoscope.us /about-us layout ========== */
.about-dh-page {
    background: #11121d !important;
    color: #fff;
    min-height: 72vh;
    padding-bottom: 3rem;
}
.about-dh-wrap {
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
    padding: 2.25rem 1rem 2rem;
}
.about-dh-bc {
    font-size: 0.95rem;
    margin-bottom: 1.75rem;
    text-align: center;
    letter-spacing: 0.02em;
}
.about-dh-bc a {
    color: #7a8099;
    text-decoration: none;
}
.about-dh-bc a:hover {
    color: #9aa3c0;
    text-decoration: underline;
}
.about-dh-bc .about-dh-bc-sep {
    color: #7a8099;
    margin: 0 0.35rem;
}
.about-dh-bc .about-dh-bc-active {
    color: #eeb237;
    font-weight: 600;
}
.about-dh-h1 {
    text-align: center;
    color: #eeb237;
    font-weight: 700;
    font-size: clamp(1.85rem, 4.5vw, 2.35rem);
    margin-bottom: 1.5rem;
    letter-spacing: 0.02em;
}
.about-dh-intro {
    color: #fff;
    text-align: left;
    margin: 0 auto 2.75rem;
    line-height: 1.65;
    font-size: 1rem;
}
.about-dh-h2 {
    text-align: center;
    color: #eeb237;
    font-weight: 700;
    font-size: 1.4rem;
    margin-bottom: 2rem;
    letter-spacing: 0.02em;
}
.about-dh-member {
    display: flex;
    gap: 1.35rem;
    align-items: flex-start;
    margin-bottom: 2.25rem;
}
.about-dh-avatar {
    flex-shrink: 0;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 4px solid #3dbce1;
    overflow: hidden;
    background: #1a1d2e;
    box-shadow: 0 0 0 1px rgba(61, 188, 225, 0.25);
}
.about-dh-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.about-dh-member-head {
    font-weight: 700;
    margin-bottom: 0.5rem;
    line-height: 1.45;
    font-size: 1rem;
}
.about-dh-member-head .about-dh-name {
    color: #eeb237;
}
.about-dh-member-head .about-dash {
    color: #fff;
    font-weight: 700;
}
.about-dh-member-head .about-dh-role {
    color: #fff;
    font-weight: 700;
}
.about-dh-member-bio {
    color: #fff;
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.62;
}
.about-dh-cta {
    margin-top: 2.75rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(122, 128, 153, 0.25);
}
.about-dh-cta p {
    color: #fff;
    text-align: left;
    line-height: 1.65;
    margin-bottom: 1rem;
    font-size: 0.98rem;
}
.about-dh-cta a {
    color: #eeb237;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.about-dh-cta a:hover {
    color: #f5c45a;
}
.about-dh-tagline {
    color: #eeb237;
    font-weight: 600;
    font-style: italic;
    text-align: center;
    margin-top: 1.5rem;
    margin-bottom: 0;
    font-size: 1.05rem;
}
@media (max-width: 575.98px) {
    .about-dh-wrap {
        padding-left: 0.85rem;
        padding-right: 0.85rem;
    }
    .about-dh-avatar {
        width: 84px;
        height: 84px;
        border-width: 3px;
    }
    .about-dh-member {
        gap: 1rem;
    }
}

/* ========== FAQ (daily-horoscope.us /faq) ========== */
.faq-dh-listing {
    text-align: left;
}
.faq-dh-block {
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid rgba(122, 128, 153, 0.28);
}
.faq-dh-block:last-of-type {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}
.faq-dh-q {
    color: #eeb237;
    font-weight: 700;
    font-size: 0.95rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 0.85rem;
    line-height: 1.35;
}
.faq-dh-a {
    color: #fff;
    line-height: 1.65;
    font-size: 0.98rem;
}
.faq-dh-a a {
    color: #eeb237;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.faq-dh-a a:hover {
    color: #f5c45a;
}
.faq-dh-list {
    margin: 0.5rem 0 0;
    padding-left: 1.2rem;
    color: #fff;
    line-height: 1.65;
    font-size: 0.98rem;
}
.faq-dh-list li {
    margin-bottom: 0.45rem;
}
.faq-dh-foot a {
    color: #eeb237;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.faq-dh-foot a:hover {
    color: #f5c45a;
}