/**
 * detail.css — 城市 / 省份油价详情页
 * 用途：页头标题、价牌区、同省城市网格
 * 与首页 LED 价牌风格统一
 */

/* 内页标题区 */
.detail-hero {
    margin-bottom: 1.25rem;
    text-align: center;
    padding: 0.5rem 0;
}

.detail-hero h1 {
    font-family: var(--font-display);
    font-size: clamp(1.35rem, 4vw, 1.85rem);
    font-weight: 700;
    letter-spacing: 0.03em;
    margin: 0 0 0.4rem;
    color: var(--ink);
    /* 避免中文标题末字单独成行 */
    word-break: keep-all;
    overflow-wrap: break-word;
}

.detail-hero p {
    margin: 0;
    color: var(--muted);
    font-size: 0.9375rem;
}

.detail-hero a {
    color: var(--grade-95);
    font-weight: 600;
}

.detail-hero a:hover {
    color: var(--led-gold-dim);
}

/* 详情面板：圆角 + 轻阴影 */
.detail-page .panel {
    border-radius: var(--radius-lg);
    box-shadow: 0 2px 12px rgba(14, 20, 25, 0.06);
}

.detail-page .panel__head {
    text-align: center;
    background: linear-gradient(180deg, #fafbfc 0%, #f3f6f9 100%);
    color: var(--ink);
    border-bottom: 1px solid var(--line);
}

/* 详情页价牌：加大数字，去掉辉光 */
.detail-pumps .pump-cell__price {
    font-size: clamp(1.6rem, 4.5vw, 2.1rem);
}

/* 内页价格表：不出现横向滚动 */
.detail-page .table-scroll {
    overflow-x: visible;
}

@media (max-width: 767px) {
    .detail-hero {
        margin-bottom: 1rem;
    }

    .detail-hero h1 {
        font-size: 1.25rem;
    }

    .detail-hero p {
        font-size: 0.875rem;
    }

    .detail-page .data-table--compact th,
    .detail-page .data-table--compact td {
        padding: 0.55rem 0.4rem;
        font-size: 0.85rem;
    }
}