/* ============================================================
   alter-cms.css — CMS pages (priority 65)
   ------------------------------------------------------------
   Migrated from custom.css l.79-99 by Lot 8e (2026-04-30).
   Scope: contact form layout + CMS link colors + GDPR module
   (psgdprinfo17). Cascade order: alter-tokens (50) → alter-header
   (55) → alter-checkout (60) → alter-cms (65) → alter-account
   (70) → ... → custom.css (1000 fallback).
   ============================================================ */

/* ------------------------------------------------------------
   Contact page (#contact)
   ------------------------------------------------------------ */
#contact .contact-form{border-radius: 8px}
#contact .contact-form h3{text-transform: capitalize;font-size: 31px}
#contact #content > section > form > footer{text-align: center!important;}
#contact #content > section > form > section > div:nth-child(1) > div{width: 100% !important;text-align: center}
#contact .input-group .input-group-btn>.btn{background: var(--as-grey-900);border-bottom-right-radius: 5px;border-top-right-radius: 5px}
#contact .btn-primary{background: var(--as-grey-900);margin-bottom: 32px}
#contact #content{width: 950px;max-width: 100%;margin:32px auto 64px auto;border-radius: 8px}

/* ------------------------------------------------------------
   CMS link colors (#cms)
   ------------------------------------------------------------ */
#cms p a {
    color: var(--as-black);
    text-decoration: underline
}

#cms p a:hover {
    color: var(--as-black);
    text-decoration: none
}

/* ------------------------------------------------------------
   GDPR module (psgdprinfo17)
   ------------------------------------------------------------ */
.psgdprinfo17 h2{color:var(--as-grey-900)}
.psgdprinfo17 .btn-primary{background: var(--as-grey-900);color:var(--as-white);text-decoration: none}
.psgdprinfo17 a{color:var(--as-grey-900);text-decoration: underline}

/* ------------------------------------------------------------
   CMS page override (Lot K.4 — design system Lot B)
   ------------------------------------------------------------ */
.alter-cms-page {
    max-width: 880px;
    margin: 0 auto;
    padding: var(--as-spacing-md) var(--as-spacing-md) var(--as-spacing-xl);
}

.alter-cms-page__breadcrumb {
    margin: var(--as-spacing-md) 0 var(--as-spacing-lg);
}

.alter-cms-page__hero {
    margin-bottom: var(--as-spacing-lg);
    padding-bottom: var(--as-spacing-md);
    border-bottom: 1px solid var(--as-grey-200);
}

.alter-cms-page__title {
    font-family: var(--as-font-family);
    font-size: clamp(28px, 4.5vw, 44px);
    line-height: 1.15;
    letter-spacing: -0.02em;
    font-weight: var(--as-fw-bold, 700);
    color: var(--as-grey-900);
    margin: 0 0 var(--as-spacing-sm);
}

.alter-cms-page__lead {
    margin: 0;
    color: var(--as-grey-700);
    font-size: 17px;
    line-height: 1.55;
}

/* Prose : applique la typo Lot B au HTML rich text venant de la BDD. */
.alter-cms-page__content {
    font-size: 16px;
    line-height: 1.65;
    color: var(--as-grey-900);
}

.alter-cms-page__content h2 {
    font-family: var(--as-font-family);
    font-size: clamp(22px, 3vw, 28px);
    line-height: 1.25;
    letter-spacing: -0.01em;
    font-weight: var(--as-fw-bold, 700);
    margin: var(--as-spacing-lg) 0 var(--as-spacing-sm);
    color: var(--as-grey-900);
}

.alter-cms-page__content h3 {
    font-family: var(--as-font-family);
    font-size: 20px;
    line-height: 1.3;
    font-weight: var(--as-fw-semibold, 600);
    margin: var(--as-spacing-md) 0 var(--as-spacing-xs);
    color: var(--as-grey-900);
}

.alter-cms-page__content p {
    margin: 0 0 var(--as-spacing-md);
}

.alter-cms-page__content ul,
.alter-cms-page__content ol {
    margin: 0 0 var(--as-spacing-md);
    padding-left: var(--as-spacing-lg);
}

.alter-cms-page__content li {
    margin-bottom: 6px;
}

.alter-cms-page__content a {
    color: var(--as-amaranth);
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-thickness: 1px;
}

.alter-cms-page__content a:hover {
    text-decoration-thickness: 2px;
}

.alter-cms-page__content img {
    max-width: 100%;
    height: auto;
    border-radius: var(--as-radius-medium, 8px);
    margin: var(--as-spacing-md) 0;
}

.alter-cms-page__content blockquote {
    margin: var(--as-spacing-md) 0;
    padding: var(--as-spacing-md) var(--as-spacing-lg);
    border-left: 3px solid var(--as-amaranth);
    background: var(--as-grey-100);
    color: var(--as-grey-700);
    font-style: italic;
}

.alter-cms-page__dispute {
    margin: var(--as-spacing-lg) 0;
}

/* Internal links footer */
.alter-cms-page__related {
    margin-top: var(--as-spacing-xl);
    padding-top: var(--as-spacing-lg);
    border-top: 1px solid var(--as-grey-200);
}

.alter-cms-page__related-title {
    font-family: var(--as-font-family);
    font-size: 20px;
    line-height: 1.25;
    font-weight: var(--as-fw-bold, 700);
    color: var(--as-grey-900);
    margin: 0 0 var(--as-spacing-md);
}

.alter-cms-page__related-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--as-spacing-md);
}

.alter-cms-page__related-card {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: var(--as-spacing-md);
    background: var(--as-white);
    border: 1px solid var(--as-grey-200);
    border-radius: var(--as-radius-medium, 8px);
    text-decoration: none;
    color: inherit;
    transition: border-color 120ms ease, transform 120ms ease, box-shadow 120ms ease;
}

.alter-cms-page__related-card:hover {
    border-color: var(--as-amaranth);
    transform: translateY(-2px);
    box-shadow: var(--as-shadow-soft, 0 4px 16px rgba(0, 0, 0, 0.05));
    text-decoration: none;
    color: inherit;
}

.alter-cms-page__related-eyebrow {
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--as-amaranth);
    font-weight: var(--as-fw-bold, 700);
}

.alter-cms-page__related-link {
    font-size: 15px;
    line-height: 1.4;
    color: var(--as-grey-900);
    font-weight: var(--as-fw-semibold, 600);
}
