/* ==========================================================================
   Dijon Actualités — Pages statiques (page.php)
   ========================================================================== */

.da-page {
    --page-max: 800px;
    --page-wide: 1228px;
    --accent: #ba1d41;
    --text-primary: #1a1a1a;
    --text-secondary: #555;
    --text-muted: #888;
    --border: #e0e0e0;
    --bg-light: #f7f7f7;
    --bg-card: #fff;

    font-family: Arial, Helvetica, sans-serif;
    color: var(--text-primary);
    line-height: 1.65;
}

/* ---------- Breadcrumb ---------- */
.da-page__breadcrumb {
    background: var(--bg-light);
    border-bottom: 1px solid var(--border);
}

.da-page__breadcrumb-inner {
    max-width: var(--page-wide);
    margin: 0 auto;
    padding: 10px 24px;
}

.da-page__breadcrumb-list {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 13px;
    color: var(--text-muted);
}

.da-page__breadcrumb-list li + li::before {
    content: '›';
    margin: 0 8px;
    color: #bbb;
}

.da-page__breadcrumb-list a {
    color: var(--text-secondary);
    text-decoration: none;
}

.da-page__breadcrumb-list a:hover {
    color: var(--accent);
    text-decoration: underline;
}

/* ---------- Hero ---------- */
.da-page__hero {
    background: var(--bg-light);
    border-bottom: 3px solid var(--accent);
}

.da-page__hero-inner {
    max-width: var(--page-wide);
    margin: 0 auto;
    padding: 48px 24px 40px;
}

.da-page__title {
    font-size: 36px;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
    color: var(--text-primary);
}

.da-page__subtitle {
    font-size: 18px;
    color: var(--text-secondary);
    margin: 12px 0 0;
    max-width: 640px;
}

/* ---------- Body / Content ---------- */
.da-page__body {
    background: #fff;
}

.da-page__body-inner {
    max-width: var(--page-wide);
    margin: 0 auto;
    padding: 48px 24px 64px;
}

.da-page__content {
    max-width: var(--page-max);
}

/* Typography inside content */
.da-page__content h2 {
    font-size: 24px;
    font-weight: 700;
    margin: 40px 0 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--border);
    color: var(--text-primary);
}

.da-page__content h2:first-child {
    margin-top: 0;
}

.da-page__content h3 {
    font-size: 18px;
    font-weight: 700;
    margin: 28px 0 12px;
    color: var(--text-primary);
}

.da-page__content p {
    font-size: 15px;
    line-height: 1.75;
    margin: 0 0 16px;
    color: var(--text-secondary);
}

.da-page__content a {
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.da-page__content a:hover {
    color: #8b1530;
}

.da-page__content ul,
.da-page__content ol {
    margin: 0 0 16px;
    padding-left: 24px;
}

.da-page__content li {
    font-size: 15px;
    line-height: 1.75;
    color: var(--text-secondary);
    margin-bottom: 6px;
}

.da-page__content strong {
    color: var(--text-primary);
    font-weight: 700;
}

/* Info cards (used in contact, mentions légales etc.) */
.da-page__content .info-card {
    background: var(--bg-light);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 24px 28px;
    margin: 20px 0;
}

.da-page__content .info-card p {
    margin: 0;
}

.da-page__content .info-card + .info-card {
    margin-top: 12px;
}

/* Highlight box */
.da-page__content .highlight-box {
    background: linear-gradient(135deg, #fef3f5, #fff);
    border-left: 4px solid var(--accent);
    border-radius: 0 12px 12px 0;
    padding: 20px 24px;
    margin: 24px 0;
}

.da-page__content .highlight-box p {
    margin: 0;
    color: var(--text-primary);
    font-weight: 500;
}

/* Values grid (used in manifeste, collectif) */
.da-page__content .values-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 16px;
    margin: 24px 0;
    list-style: none;
    padding: 0;
}

.da-page__content .values-grid li {
    background: var(--bg-light);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 20px 24px;
    margin: 0;
}

.da-page__content .values-grid li strong {
    display: block;
    font-size: 16px;
    margin-bottom: 6px;
    color: var(--accent);
}

/* Contact grid */
.da-page__content .contact-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
    margin: 24px 0;
    list-style: none;
    padding: 0;
}

.da-page__content .contact-grid li {
    background: var(--bg-light);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 24px;
    margin: 0;
    text-align: center;
}

.da-page__content .contact-grid li strong {
    display: block;
    font-size: 16px;
    margin-bottom: 8px;
    color: var(--text-primary);
}

/* Cookie table */
.da-page__content table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    font-size: 14px;
}

.da-page__content table th,
.da-page__content table td {
    text-align: left;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border);
    color: var(--text-secondary);
}

.da-page__content table th {
    background: var(--bg-light);
    font-weight: 700;
    color: var(--text-primary);
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.da-page__content table tr:hover td {
    background: #fafafa;
}

/* Last updated date */
.da-page__content .last-updated {
    font-size: 13px;
    color: var(--text-muted);
    font-style: italic;
    margin-top: 40px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}

/* ---------- Responsive ---------- */
@media (max-width: 768px) {
    .da-page__hero-inner { padding: 32px 16px 28px; }
    .da-page__title { font-size: 28px; }
    .da-page__body-inner { padding: 32px 16px 48px; }
    .da-page__content h2 { font-size: 20px; }
    .da-page__content .values-grid,
    .da-page__content .contact-grid { grid-template-columns: 1fr; }
}
