/* =========================================================
   Azur Theme — support.css
   Combined stylesheet for Phase 6 pages :
     - Tutoriels  ([azur_tutos])
     - Contact    ([azur_contact])
     - Légal      ([azur_legal])
     - Charte 18+ ([azur_charte])
   ========================================================= */

/* ---------- Shared text helpers ---------- */
.t-accent     { color: var(--majorelle); }
.t-success    { color: var(--success); }
.t-majorelle  { color: var(--majorelle); }
.t-gold       { color: var(--gold); }

/* Shared buttons (Phase 6 only — extends base.css if needed) */
.azur-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: var(--r-md);
    padding: 14px 22px;
    font-family: var(--font-sans);
    font-weight: 800;
    font-size: 14px;
    text-decoration: none;
    cursor: pointer;
    border: none;
    transition: transform .15s ease, box-shadow .15s ease, background .2s ease;
    white-space: nowrap;
}
.azur-btn--gold-block {
    background: var(--gold);
    color: var(--ink);
    box-shadow: 0 14px 30px rgba(255, 213, 74, .35);
}
.azur-btn--gold-block:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(255, 213, 74, .45);
}
.azur-btn--ghost {
    background: rgba(255, 255, 255, .12);
    color: var(--white);
    border: 1px solid rgba(255, 255, 255, .25);
    font-weight: 700;
    font-size: 13px;
    padding: 12px 20px;
}
.azur-btn--ghost:hover { background: rgba(255, 255, 255, .2); }

/* =========================================================
   1. TUTORIELS — [azur_tutos]
   ========================================================= */
.azur-tutos { background: var(--bg); color: var(--ink); }

/* Hero */
.azur-tutos__hero {
    position: relative;
    overflow: hidden;
    padding: 70px 32px 60px;
    background: linear-gradient(180deg, var(--bg) 0%, var(--bg-soft) 100%);
}
.azur-tutos__hero-bloom {
    position: absolute;
    width: 460px;
    height: 460px;
    border-radius: 50%;
    filter: blur(40px);
    pointer-events: none;
}
.azur-tutos__hero-bloom--right {
    top: -120px;
    right: -120px;
    background: radial-gradient(circle, rgba(42, 102, 196, .2), transparent 60%);
}
.azur-tutos__hero-bloom--left {
    top: 30px;
    left: -100px;
    width: 440px;
    height: 440px;
    background: radial-gradient(circle, rgba(255, 213, 74, .16), transparent 60%);
}
.azur-tutos__hero-inner {
    position: relative;
    max-width: 1320px;
    margin: 0 auto;
    text-align: center;
}
.azur-tutos__breadcrumb {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    font-family: var(--font-sans);
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 14px;
}
.azur-tutos__breadcrumb a {
    color: var(--muted);
    text-decoration: none;
}
.azur-tutos__breadcrumb a:hover { color: var(--ink); }
.azur-tutos__breadcrumb .is-current {
    color: var(--ink);
    font-weight: 700;
}
.azur-tutos__breadcrumb [aria-hidden="true"] { opacity: .4; }

.azur-tutos__eyebrow {
    font-family: var(--font-sans);
    font-size: var(--fs-meta);
    color: var(--majorelle);
    letter-spacing: 0.24em;
    text-transform: uppercase;
    font-weight: 800;
    margin-bottom: 14px;
}
.azur-tutos__eyebrow--inline { margin-bottom: 10px; }

.azur-tutos__title {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: var(--fs-h1-hero);
    color: var(--ink);
    margin: 0;
    line-height: 0.95;
    letter-spacing: -0.04em;
}
.azur-tutos__title-accent {
    position: relative;
    display: inline-block;
}
.azur-tutos__title-accent span { color: var(--majorelle); }
.azur-tutos__title-stroke {
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 100%;
}

.azur-tutos__lead {
    font-family: var(--font-sans);
    font-size: var(--fs-body-lg);
    line-height: 1.55;
    color: var(--ink-muted);
    max-width: 680px;
    margin: 26px auto 0;
}

.azur-tutos__trust {
    display: flex;
    justify-content: center;
    gap: 22px;
    margin-top: 28px;
    font-family: var(--font-sans);
    font-size: 13px;
    color: var(--ink-muted);
    flex-wrap: wrap;
}
.azur-tutos__trust span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.azur-tutos__trust svg:nth-child(1) { color: var(--gold); }

/* Index grid */
.azur-tutos__index {
    background: var(--white);
    padding: 80px 32px 60px;
}
.azur-tutos__index-inner {
    max-width: 1320px;
    margin: 0 auto;
}
.azur-tutos__group { margin-bottom: 56px; }
.azur-tutos__group:last-child { margin-bottom: 0; }
.azur-tutos__group-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 24px;
}
.azur-tutos__group-head h2 {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 28px;
    color: var(--ink);
    margin: 0;
    letter-spacing: -0.025em;
}
.azur-tutos__group-icon { color: var(--gold); }
.azur-tutos__group-icon--majorelle { color: var(--majorelle); }

.azur-tutos__grid { display: grid; gap: 16px; }
.azur-tutos__grid--populars { grid-template-columns: repeat(4, 1fr); }
.azur-tutos__grid--others   { grid-template-columns: repeat(3, 1fr); }

/* Popular card */
.azur-tutos__card-popular {
    background: var(--bg);
    color: var(--ink);
    border-radius: 18px;
    padding: 28px 26px;
    border: 1px solid var(--line);
    font-family: var(--font-sans);
    display: flex;
    flex-direction: column;
    gap: 16px;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.azur-tutos__card-popular:hover {
    transform: translateY(-3px);
    border-color: var(--majorelle);
    box-shadow: 0 18px 40px -20px rgba(0, 63, 163, .25);
}
.azur-tutos__card-popular.is-featured {
    background: linear-gradient(160deg, var(--ink), var(--majorelle-deep));
    color: var(--white);
    border: none;
}
.azur-tutos__card-popular.is-featured:hover {
    box-shadow: 0 22px 50px -20px rgba(13, 18, 48, .55);
}
.azur-tutos__card-icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: var(--majorelle);
    color: var(--gold);
    display: flex;
    align-items: center;
    justify-content: center;
}
.azur-tutos__card-popular.is-featured .azur-tutos__card-icon {
    background: var(--gold);
    color: var(--ink);
}
.azur-tutos__card-brand {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 22px;
    letter-spacing: -0.025em;
    line-height: 1.1;
}
.azur-tutos__card-name {
    font-size: 12px;
    opacity: .75;
    margin-top: 4px;
}
.azur-tutos__card-meta {
    margin-top: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
}
.azur-tutos__chip {
    display: inline-flex;
    align-items: center;
    padding: 3px 9px;
    border-radius: 999px;
    font-weight: 700;
    background: var(--white);
    color: var(--ink);
    margin-right: 6px;
}
.azur-tutos__chip--diff {
    background: rgba(31, 157, 85, .15);
    color: var(--success);
    font-weight: 800;
    letter-spacing: 0.04em;
}
.azur-tutos__card-popular.is-featured .azur-tutos__chip {
    background: rgba(255, 255, 255, .12);
    color: var(--white);
}
.azur-tutos__card-popular.is-featured .azur-tutos__chip--diff {
    background: rgba(255, 213, 74, .2);
    color: var(--gold);
}
.azur-tutos__card-arrow { color: var(--majorelle); }
.azur-tutos__card-popular.is-featured .azur-tutos__card-arrow { color: var(--gold); }

/* Other card */
.azur-tutos__card-other {
    background: var(--bg);
    color: var(--ink);
    border-radius: 18px;
    padding: 24px 26px;
    border: 1px solid var(--line);
    font-family: var(--font-sans);
    display: flex;
    align-items: center;
    gap: 18px;
    text-decoration: none;
    transition: transform .2s ease, border-color .2s ease;
}
.azur-tutos__card-other:hover {
    transform: translateY(-2px);
    border-color: var(--majorelle);
}
.azur-tutos__card-other-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--majorelle), var(--majorelle-deep));
    color: var(--gold);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.azur-tutos__card-other-body { flex: 1; min-width: 0; }
.azur-tutos__card-other-brand {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 18px;
    color: var(--ink);
    letter-spacing: -0.02em;
}
.azur-tutos__card-other-desc {
    font-size: 12px;
    color: var(--muted);
    margin-top: 2px;
}
.azur-tutos__card-other-arrow { color: var(--muted); flex-shrink: 0; }

/* Help banner */
.azur-tutos__help-wrap {
    background: var(--white);
    padding: 0 32px 80px;
}
.azur-tutos__help {
    max-width: 1320px;
    margin: 0 auto;
    padding: 30px 36px;
    background: linear-gradient(135deg, var(--ink), var(--majorelle-deep));
    border-radius: 22px;
    color: var(--white);
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 36px;
    align-items: center;
    font-family: var(--font-sans);
    position: relative;
    overflow: hidden;
}
.azur-tutos__help-bloom {
    position: absolute;
    top: -80px;
    right: -80px;
    width: 280px;
    height: 280px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 213, 74, .2), transparent 60%);
    filter: blur(30px);
    pointer-events: none;
}
.azur-tutos__help-text { position: relative; }
.azur-tutos__help-eyebrow {
    font-size: var(--fs-eyebrow);
    color: var(--gold);
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 800;
    margin-bottom: 8px;
}
.azur-tutos__help-text h3 {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 32px;
    margin: 0;
    line-height: 1;
    letter-spacing: -0.025em;
    color: var(--white);
}
.azur-tutos__help-text h3 span { color: var(--gold); }
.azur-tutos__help-text p {
    font-size: 14px;
    color: rgba(255, 255, 255, .75);
    margin-top: 10px;
    max-width: 520px;
    line-height: 1.55;
}
.azur-tutos__help-actions {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Detail accordion sections */
.azur-tutos__details {
    background: var(--bg);
    padding: 80px 32px 80px;
}
.azur-tutos__details-inner {
    max-width: 1100px;
    margin: 0 auto;
}
.azur-tutos__details-head {
    text-align: center;
    margin-bottom: 48px;
}
.azur-tutos__details-title {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 48px;
    color: var(--ink);
    margin: 0;
    line-height: 1;
    letter-spacing: -0.035em;
}
.azur-tutos__details-title span { color: var(--majorelle); }
.azur-tutos__details-lead {
    margin: 14px 0 0;
    color: var(--ink-muted);
    font-family: var(--font-sans);
}

.azur-tutos__detail {
    background: var(--white);
    border-radius: 16px;
    border: 1px solid var(--line);
    overflow: hidden;
    transition: border-color .2s, box-shadow .2s;
    scroll-margin-top: 100px;
    margin-bottom: 14px;
}
.azur-tutos__detail[open] {
    border-color: rgba(0, 63, 163, .3);
    box-shadow: 0 14px 30px -18px rgba(0, 63, 163, .25);
}
.azur-tutos__detail-summary {
    display: grid;
    grid-template-columns: 48px 1fr auto auto;
    gap: 18px;
    align-items: center;
    padding: 22px 26px;
    cursor: pointer;
    list-style: none;
    font-family: var(--font-sans);
}
.azur-tutos__detail-summary::-webkit-details-marker { display: none; }
.azur-tutos__detail-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--majorelle), var(--majorelle-deep));
    color: var(--gold);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.azur-tutos__detail-titles { min-width: 0; }
.azur-tutos__detail-brand {
    display: block;
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 20px;
    color: var(--ink);
    letter-spacing: -0.025em;
}
.azur-tutos__detail-desc {
    display: block;
    font-size: 13px;
    color: var(--muted);
    margin-top: 2px;
}
.azur-tutos__detail-chips {
    display: flex;
    gap: 6px;
    flex-shrink: 0;
}
.azur-tutos__detail-toggle {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--bg);
    border: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--ink);
    transition: background .2s, color .2s, border-color .2s;
}
.azur-tutos__detail-toggle-close { display: none; }
.azur-tutos__detail[open] .azur-tutos__detail-toggle {
    background: var(--majorelle);
    color: var(--gold);
    border-color: var(--majorelle);
}
.azur-tutos__detail[open] .azur-tutos__detail-toggle-open  { display: none; }
.azur-tutos__detail[open] .azur-tutos__detail-toggle-close { display: inline-flex; }

.azur-tutos__detail-body {
    padding: 4px 36px 36px;
    border-top: 1px solid var(--line);
}
.azur-tutos__steps-head {
    margin: 28px 0 20px;
}
.azur-tutos__steps-head h3 {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 32px;
    color: var(--ink);
    margin: 0;
    line-height: 1.05;
    letter-spacing: -0.03em;
}

/* Timeline */
.azur-tutos__timeline {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
}
.azur-tutos__timeline::before {
    content: "";
    position: absolute;
    left: 26px;
    top: 12px;
    bottom: 12px;
    width: 2px;
    background: repeating-linear-gradient(180deg, var(--line) 0 6px, transparent 6px 12px);
}
.azur-tutos__timeline-item {
    display: grid;
    grid-template-columns: 56px 1fr;
    gap: 22px;
    align-items: start;
    margin-bottom: 16px;
    position: relative;
}
.azur-tutos__timeline-num {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--majorelle), var(--majorelle-deep));
    color: var(--gold);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 22px;
    letter-spacing: -0.03em;
    box-shadow: 0 12px 24px -10px rgba(0, 63, 163, .35);
    z-index: 2;
    flex-shrink: 0;
}
.azur-tutos__timeline-card {
    background: var(--bg);
    border-radius: 14px;
    padding: 18px 22px;
    border: 1px solid var(--line);
    font-family: var(--font-sans);
}
.azur-tutos__timeline-card h4 {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 18px;
    color: var(--ink);
    margin: 0;
    line-height: 1.25;
    letter-spacing: -0.02em;
}
.azur-tutos__timeline-card p {
    font-size: 14px;
    line-height: 1.6;
    color: var(--ink-muted);
    margin: 8px 0 0;
}

.azur-tutos__done {
    margin-top: 24px;
    margin-left: 78px;
    padding: 18px 24px;
    background: linear-gradient(135deg, rgba(31, 157, 85, .08), rgba(31, 157, 85, .03));
    border: 1px solid rgba(31, 157, 85, .25);
    border-radius: 14px;
    display: flex;
    align-items: center;
    gap: 16px;
    font-family: var(--font-sans);
}
.azur-tutos__done-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--success);
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.azur-tutos__done strong {
    display: block;
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 18px;
    color: var(--ink);
    letter-spacing: -0.02em;
}
.azur-tutos__done small {
    display: block;
    font-size: 13px;
    color: var(--ink-muted);
    margin-top: 2px;
}

.azur-tutos__tips {
    margin-top: 36px;
}
.azur-tutos__tips-head h4 {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 24px;
    color: var(--ink);
    margin: 0 0 16px;
    line-height: 1;
    letter-spacing: -0.025em;
}
.azur-tutos__tips-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}
.azur-tutos__tip {
    background: var(--bg);
    border-radius: 14px;
    padding: 18px 20px;
    border: 1px solid var(--line);
    font-family: var(--font-sans);
    display: flex;
    gap: 12px;
    align-items: start;
}
.azur-tutos__tip-icon {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: var(--gold);
    color: var(--ink);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.azur-tutos__tip p {
    font-size: 13px;
    line-height: 1.5;
    color: var(--ink);
    margin: 0;
}

/* FAQ install */
.azur-tutos__faq {
    background: var(--white);
    padding: 80px 32px 100px;
}
.azur-tutos__faq-inner {
    max-width: 1080px;
    margin: 0 auto;
}
.azur-tutos__faq-head {
    text-align: center;
    margin-bottom: 36px;
}
.azur-tutos__faq-head h2 {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 48px;
    color: var(--ink);
    margin: 0;
    line-height: 1;
    letter-spacing: -0.035em;
}
.azur-tutos__faq-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.azur-tutos__faq-item {
    background: transparent;
    border: 1px solid var(--line);
    border-radius: 14px;
    overflow: hidden;
    transition: background .2s, border-color .2s, box-shadow .2s;
}
.azur-tutos__faq-item[open] {
    background: var(--bg);
    border-color: rgba(0, 63, 163, .35);
    box-shadow: 0 10px 24px -16px rgba(0, 63, 163, .35);
}
.azur-tutos__faq-item summary {
    list-style: none;
    cursor: pointer;
    width: 100%;
    padding: 18px 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: left;
    font-family: var(--font-display);
    font-size: 17px;
    font-weight: 700;
    color: var(--ink);
    letter-spacing: -0.02em;
    gap: 16px;
}
.azur-tutos__faq-item summary::-webkit-details-marker { display: none; }
.azur-tutos__faq-toggle {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--white);
    color: var(--ink);
    border: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background .2s, color .2s, border-color .2s;
}
.azur-tutos__faq-toggle-close { display: none; }
.azur-tutos__faq-item[open] .azur-tutos__faq-toggle {
    background: var(--majorelle);
    color: var(--gold);
    border-color: var(--majorelle);
}
.azur-tutos__faq-item[open] .azur-tutos__faq-toggle-open  { display: none; }
.azur-tutos__faq-item[open] .azur-tutos__faq-toggle-close { display: inline-flex; }
.azur-tutos__faq-answer {
    padding: 0 24px 20px;
    font-family: var(--font-sans);
    font-size: 14px;
    line-height: 1.65;
    color: var(--ink-muted);
    max-width: 780px;
}
.azur-tutos__faq-support {
    margin-top: 24px;
    padding: 22px 26px;
    background: var(--bg);
    border-radius: 14px;
    border: 1px solid var(--line);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 14px;
    font-family: var(--font-sans);
    font-size: 14px;
    color: var(--ink-soft);
    flex-wrap: wrap;
}
.azur-tutos__faq-support a {
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 4px;
}

/* =========================================================
   2. CONTACT — [azur_contact]
   ========================================================= */
.azur-contact { background: var(--bg); color: var(--ink); }

/* Hero */
.azur-contact__hero {
    position: relative;
    overflow: hidden;
    padding: 70px 32px 60px;
    background: linear-gradient(180deg, var(--bg) 0%, var(--bg-soft) 100%);
}
.azur-contact__hero-bloom {
    position: absolute;
    top: -120px;
    right: -120px;
    width: 460px;
    height: 460px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(42, 102, 196, .2), transparent 60%);
    filter: blur(40px);
    pointer-events: none;
}
.azur-contact__hero-inner {
    position: relative;
    max-width: 1320px;
    margin: 0 auto;
    text-align: center;
}
.azur-contact__breadcrumb {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    font-family: var(--font-sans);
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 14px;
}
.azur-contact__breadcrumb a {
    color: var(--muted);
    text-decoration: none;
}
.azur-contact__breadcrumb a:hover { color: var(--ink); }
.azur-contact__breadcrumb .is-current { color: var(--ink); font-weight: 700; }
.azur-contact__breadcrumb [aria-hidden="true"] { opacity: .4; }
.azur-contact__eyebrow {
    font-family: var(--font-sans);
    font-size: var(--fs-meta);
    color: var(--majorelle);
    letter-spacing: 0.24em;
    text-transform: uppercase;
    font-weight: 800;
    margin-bottom: 14px;
}
.azur-contact__title {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: var(--fs-h1-hero);
    color: var(--ink);
    margin: 0;
    line-height: 0.95;
    letter-spacing: -0.04em;
}
.azur-contact__lead {
    font-family: var(--font-sans);
    font-size: var(--fs-body-lg);
    line-height: 1.55;
    color: var(--ink-muted);
    max-width: 600px;
    margin: 26px auto 0;
}

/* Channels */
.azur-contact__channels {
    background: var(--white);
    padding: 60px 32px 40px;
}
.azur-contact__channels-inner {
    max-width: 1320px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.azur-contact__channel {
    background: var(--white);
    border-radius: 18px;
    padding: 28px 26px;
    border: 1px solid var(--line);
    font-family: var(--font-sans);
    display: flex;
    flex-direction: column;
    gap: 16px;
    text-decoration: none;
    color: inherit;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
/* Hover effects uniquement sur les cartes cliquables (<a>) */
a.azur-contact__channel:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 36px -20px rgba(13, 18, 48, .2);
    border-color: var(--majorelle);
}
.azur-contact__channel-icon {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.azur-contact__channel--majorelle .azur-contact__channel-icon { background: var(--majorelle); color: var(--gold); }
.azur-contact__channel--whatsapp .azur-contact__channel-icon  { background: #25d366;       color: var(--white); }
.azur-contact__channel--soft .azur-contact__channel-icon      { background: var(--majorelle-soft); color: var(--white); }
.azur-contact__channel--ink .azur-contact__channel-icon       { background: var(--ink);   color: var(--gold); }
.azur-contact__channel-body { flex: 1; }
.azur-contact__channel-name {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 22px;
    color: var(--ink);
    letter-spacing: -0.025em;
}
.azur-contact__channel-desc {
    font-size: 13px;
    color: var(--ink-muted);
    line-height: 1.5;
    margin: 6px 0 0;
}
.azur-contact__channel-action {
    font-size: 14px;
    font-weight: 700;
    color: var(--majorelle);
    margin-bottom: 6px;
}
.azur-contact__channel-time {
    font-size: 11px;
    color: var(--success);
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.azur-contact__channel-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--success);
}

/* Form layout */
.azur-contact__form-wrap {
    background: var(--bg);
    padding: 80px 32px 120px;
}
.azur-contact__form-grid {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 56px;
    align-items: start;
}

.azur-contact__info {
    font-family: var(--font-sans);
}
.azur-contact__form-title {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 38px;
    color: var(--ink);
    margin: 0;
    line-height: 1.05;
    letter-spacing: -0.035em;
}
.azur-contact__form-lead {
    font-size: 16px;
    color: var(--ink-muted);
    line-height: 1.6;
    margin-top: 20px;
    max-width: 380px;
}

.azur-contact__hours {
    margin-top: 32px;
    padding: 24px 26px;
    background: var(--white);
    border-radius: 14px;
    border: 1px solid var(--line);
}
.azur-contact__hours-head {
    font-size: var(--fs-eyebrow);
    color: var(--gold-deep);
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 800;
    margin-bottom: 14px;
}
.azur-contact__hours-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.azur-contact__hours-list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13px;
    padding: 8px 0;
    border-bottom: 1px solid var(--line-soft);
}
.azur-contact__hours-list li:last-child { border-bottom: none; }
.azur-contact__hours-day { color: var(--ink-soft); font-weight: 600; }
.azur-contact__hours-hour {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--ink);
    font-weight: 700;
}
.azur-contact__hours-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--muted);
}
.azur-contact__hours-dot.is-live { background: var(--success); }
.azur-contact__hours-note {
    margin-top: 14px;
    padding: 10px 14px;
    background: var(--bg);
    border-radius: 8px;
    font-size: 12px;
    color: var(--ink-muted);
    display: flex;
    align-items: center;
    gap: 8px;
}
.azur-contact__hours-note svg { color: var(--gold); }

.azur-contact__address {
    margin-top: 18px;
    padding: 20px 24px;
    background: linear-gradient(135deg, var(--ink), var(--majorelle-deep));
    color: var(--white);
    border-radius: 14px;
}
.azur-contact__address-eyebrow {
    font-size: var(--fs-eyebrow);
    color: var(--gold);
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 800;
}
.azur-contact__address-name {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 18px;
    margin-top: 8px;
    letter-spacing: -0.02em;
}
.azur-contact__address-body {
    font-size: 13px;
    color: rgba(255, 255, 255, .75);
    margin-top: 6px;
    line-height: 1.5;
}

/* Form */
.azur-contact__form {
    background: var(--white);
    border-radius: 22px;
    padding: 32px 36px;
    border: 1px solid var(--line);
    font-family: var(--font-sans);
    box-shadow: 0 20px 50px -25px rgba(13, 18, 48, .13);
    position: relative;
}
.azur-contact__honeypot {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
}
.azur-contact__form-head { margin-bottom: 24px; }
.azur-contact__form-head h3 {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 26px;
    color: var(--ink);
    margin: 0;
    letter-spacing: -0.025em;
    line-height: 1;
}
.azur-contact__form-head p {
    font-size: 13px;
    color: var(--muted);
    margin: 6px 0 0;
}
.azur-contact__form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 14px;
}
.azur-contact__field { display: block; margin-bottom: 14px; }
.azur-contact__field-label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: var(--ink-soft);
    margin-bottom: 8px;
}
.azur-contact__field input[type="text"],
.azur-contact__field input[type="email"],
.azur-contact__field textarea {
    width: 100%;
    padding: 14px 16px;
    border-radius: 10px;
    border: 1px solid var(--line);
    background: var(--bg);
    font-family: var(--font-sans);
    font-size: 14px;
    color: var(--ink);
    outline: none;
    transition: border-color .15s, box-shadow .15s;
    box-sizing: border-box;
}
.azur-contact__field input:focus,
.azur-contact__field textarea:focus {
    border-color: var(--majorelle);
    box-shadow: 0 0 0 3px rgba(0, 63, 163, .15);
}
.azur-contact__field textarea {
    resize: vertical;
    line-height: 1.5;
    min-height: 140px;
}
.azur-contact__topics {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.azur-contact__topic {
    padding: 9px 16px;
    border-radius: 999px;
    background: var(--bg);
    color: var(--ink);
    border: 1px solid var(--line);
    font-weight: 700;
    font-size: 12px;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
    font-family: var(--font-sans);
}
.azur-contact__topic:hover { border-color: var(--majorelle); }
.azur-contact__topic.is-active {
    background: var(--ink);
    color: var(--gold);
    border-color: var(--ink);
}

.azur-contact__submit {
    width: 100%;
    padding: 16px 0;
    border-radius: 12px;
    background: var(--ink);
    color: var(--gold);
    border: none;
    font-family: var(--font-sans);
    font-weight: 800;
    font-size: 15px;
    cursor: pointer;
    box-shadow: 0 12px 28px rgba(13, 18, 48, .2);
    transition: transform .15s, box-shadow .15s;
    margin-top: 8px;
}
.azur-contact__submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(13, 18, 48, .28);
}
.azur-contact__submit[disabled] {
    opacity: .7;
    cursor: not-allowed;
    transform: none;
}
.azur-contact__submit-label,
.azur-contact__submit-loading {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
.azur-contact__submit-loading { display: none; }
.azur-contact__submit.is-loading .azur-contact__submit-label   { display: none; }
.azur-contact__submit.is-loading .azur-contact__submit-loading { display: inline-flex; }
.azur-contact__spinner {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 213, 74, .3);
    border-top-color: var(--gold);
    border-radius: 50%;
    animation: azurSpin 0.6s linear infinite;
}
@keyframes azurSpin { to { transform: rotate(360deg); } }

.azur-contact__rgpd {
    margin-top: 14px;
    font-size: 11px;
    color: var(--muted);
    display: flex;
    align-items: center;
    gap: 6px;
}
.azur-contact__rgpd svg { color: var(--success); }

.azur-contact__alert {
    margin-top: 16px;
    padding: 14px 18px;
    border-radius: 12px;
    font-size: 14px;
    font-family: var(--font-sans);
    display: flex;
    align-items: center;
    gap: 10px;
}
.azur-contact__alert--success {
    background: rgba(31, 157, 85, .08);
    border: 1px solid rgba(31, 157, 85, .25);
    color: var(--success);
}
.azur-contact__alert--error {
    background: rgba(198, 72, 58, .08);
    border: 1px solid rgba(198, 72, 58, .25);
    color: var(--danger);
}

/* =========================================================
   3. LÉGAL — [azur_legal]
   ========================================================= */
.azur-legal { background: var(--white); color: var(--ink); }

/* Hero */
.azur-legal__hero {
    position: relative;
    overflow: hidden;
    padding: 70px 32px 0;
    background: linear-gradient(180deg, var(--bg) 0%, var(--bg-soft) 100%);
}
.azur-legal__hero-bloom {
    position: absolute;
    top: -120px;
    right: -120px;
    width: 460px;
    height: 460px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(42, 102, 196, .2), transparent 60%);
    filter: blur(40px);
    pointer-events: none;
}
.azur-legal__hero-inner {
    position: relative;
    max-width: 880px;
    margin: 0 auto;
    text-align: center;
}
.azur-legal__breadcrumb {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    font-family: var(--font-sans);
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 14px;
}
.azur-legal__breadcrumb a {
    color: var(--muted);
    text-decoration: none;
}
.azur-legal__breadcrumb a:hover { color: var(--ink); }
.azur-legal__breadcrumb .is-current {
    color: var(--ink);
    font-weight: 700;
    white-space: nowrap;
}
.azur-legal__breadcrumb [aria-hidden="true"] { opacity: .4; }
.azur-legal__title {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: var(--fs-h1-page);
    color: var(--ink);
    margin: 0;
    line-height: 1;
    letter-spacing: -0.04em;
}
.azur-legal__sub {
    font-family: var(--font-sans);
    font-size: 17px;
    color: var(--ink-muted);
    margin-top: 18px;
}

.azur-legal__tabs {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    padding: 5px;
    background: var(--white);
    border-radius: 999px;
    border: 1px solid var(--line);
    width: fit-content;
    margin: 36px auto 0;
}
.azur-legal__tab {
    padding: 10px 22px;
    border-radius: 999px;
    background: transparent;
    color: var(--ink-soft);
    border: none;
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: 13px;
    cursor: pointer;
    white-space: nowrap;
    transition: background .15s, color .15s;
}
.azur-legal__tab:hover { color: var(--ink); }
.azur-legal__tab.is-active {
    background: var(--ink);
    color: var(--gold);
}

/* Main panels */
.azur-legal__main {
    background: var(--white);
    padding: 0 32px;
}
.azur-legal__panel { padding: 0; }

.azur-legal__eyebrow {
    font-family: var(--font-sans);
    font-size: var(--fs-meta);
    color: var(--majorelle);
    letter-spacing: 0.24em;
    text-transform: uppercase;
    font-weight: 800;
    margin-bottom: 14px;
}
.azur-legal__article {
    max-width: 880px;
    margin: 0 auto;
    padding: 60px 0 40px;
    font-family: var(--font-sans);
}
.azur-legal__h2 {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 48px;
    color: var(--ink);
    margin: 0;
    line-height: 1.05;
    letter-spacing: -0.035em;
}
.azur-legal__lead {
    font-family: var(--font-display);
    font-weight: 500;
    font-size: 22px;
    line-height: 1.5;
    color: var(--ink);
    margin-top: 30px;
    letter-spacing: -0.015em;
}
.azur-legal__article p {
    font-size: 17px;
    line-height: 1.7;
    color: var(--ink-soft);
    margin-top: 18px;
}
.azur-legal__article p strong { color: var(--ink); }

.azur-legal__values {
    background: var(--bg);
    margin: 20px -32px 60px;
    padding: 60px 32px;
}
.azur-legal__values {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    max-width: 1320px;
    margin-left: auto;
    margin-right: auto;
}
.azur-legal__value {
    background: var(--white);
    border-radius: 18px;
    padding: 30px 28px;
    border: 1px solid var(--line);
}
.azur-legal__value-icon {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: var(--majorelle);
    color: var(--gold);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}
.azur-legal__value h3 {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 22px;
    color: var(--ink);
    margin: 0;
    letter-spacing: -0.025em;
}
.azur-legal__value p {
    font-size: 14px;
    line-height: 1.6;
    color: var(--ink-muted);
    margin: 10px 0 0;
}

.azur-legal__team {
    margin-top: 32px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.azur-legal__person {
    background: var(--white);
    border-radius: 16px;
    padding: 24px 22px;
    border: 1px solid var(--line);
    text-align: center;
}
.azur-legal__person-avatar {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 14px;
    font-family: var(--font-display);
    font-size: 26px;
    font-weight: 800;
}
.azur-legal__person-avatar--majorelle { background: var(--majorelle);      color: var(--gold); }
.azur-legal__person-avatar--gold       { background: var(--gold);           color: var(--ink); }
.azur-legal__person-avatar--soft       { background: var(--majorelle-soft); color: var(--gold); }
.azur-legal__person-avatar--success    { background: var(--success);        color: var(--white); }
.azur-legal__person-name {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 16px;
    color: var(--ink);
    letter-spacing: -0.02em;
}
.azur-legal__person-role {
    font-size: 12px;
    color: var(--muted);
    margin-top: 4px;
}

.azur-legal__doc {
    max-width: 880px;
    margin: 0 auto;
    padding: 60px 0 100px;
    font-family: var(--font-sans);
    font-size: 16px;
    line-height: 1.7;
    color: var(--ink-soft);
}
.azur-legal__notice {
    padding: 20px 24px;
    background: var(--bg);
    border-left: 4px solid var(--majorelle);
    border-radius: 8px;
    margin-bottom: 32px;
    font-size: 14px;
}
.azur-legal__notice strong { color: var(--ink); }
.azur-legal__section { margin-bottom: 32px; }
.azur-legal__section h3 {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 22px;
    color: var(--ink);
    margin: 0 0 12px;
    letter-spacing: -0.02em;
}
.azur-legal__section p {
    margin: 0 0 12px;
}
.azur-legal__section p strong { color: var(--ink); }
.azur-legal__ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.azur-legal__ul li {
    padding-left: 28px;
    position: relative;
    margin-bottom: 8px;
}
.azur-legal__ul li::before {
    content: "";
    position: absolute;
    left: 4px;
    top: 11px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--majorelle);
}
.azur-legal__inline-link {
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    color: var(--majorelle);
    font: inherit;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* =========================================================
   4. CHARTE 18+ — [azur_charte]
   ========================================================= */
.azur-charte { background: var(--bg); color: var(--ink); }

.azur-charte__hero {
    position: relative;
    overflow: hidden;
    padding: 70px 32px 80px;
    background: linear-gradient(135deg, var(--ink) 0%, var(--majorelle-deep) 100%);
    color: var(--white);
}
.azur-charte__hero-bloom {
    position: absolute;
    top: -120px;
    right: -120px;
    width: 500px;
    height: 500px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 213, 74, .2), transparent 60%);
    filter: blur(50px);
    pointer-events: none;
}
.azur-charte__hero-inner {
    position: relative;
    max-width: 1080px;
    margin: 0 auto;
}
.azur-charte__breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: var(--font-sans);
    font-size: 12px;
    color: rgba(255, 255, 255, .6);
    margin-bottom: 20px;
}
.azur-charte__breadcrumb a {
    color: inherit;
    text-decoration: none;
}
.azur-charte__breadcrumb a:hover { color: var(--white); }
.azur-charte__breadcrumb .is-current {
    color: var(--gold);
    font-weight: 700;
    white-space: nowrap;
}
.azur-charte__breadcrumb [aria-hidden="true"] { opacity: .4; }
.azur-charte__badge {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 10px 20px;
    border-radius: 999px;
    background: var(--gold);
    color: var(--ink);
    font-family: var(--font-sans);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 26px;
    white-space: nowrap;
}
.azur-charte__badge-pip {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--ink);
    color: var(--gold);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 11px;
    letter-spacing: 0;
}
.azur-charte__title {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: var(--fs-h1-hero);
    color: var(--white);
    margin: 0;
    line-height: 0.95;
    letter-spacing: -0.04em;
}
.azur-charte__lead {
    font-family: var(--font-sans);
    font-size: var(--fs-body-lg);
    line-height: 1.55;
    color: rgba(255, 255, 255, .8);
    max-width: 680px;
    margin-top: 24px;
}

.azur-charte__body {
    background: var(--white);
    padding: 70px 32px 100px;
}
.azur-charte__body-inner {
    max-width: 880px;
    margin: 0 auto;
    font-family: var(--font-sans);
}

.azur-charte__section {
    margin-bottom: 36px;
}
.azur-charte__section-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
}
.azur-charte__section-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: var(--majorelle);
    color: var(--gold);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.azur-charte__section-head h3 {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 24px;
    color: var(--ink);
    margin: 0;
    letter-spacing: -0.025em;
    line-height: 1.1;
}
.azur-charte__section-body {
    padding-left: 58px;
    font-size: 16px;
    line-height: 1.7;
    color: var(--ink-soft);
}
.azur-charte__section-body p { margin: 0 0 12px; }
.azur-charte__section-body p strong { color: var(--ink); }
.azur-charte__bullets {
    list-style: none;
    padding: 0;
    margin: 0;
}
.azur-charte__bullets li {
    display: flex;
    gap: 12px;
    align-items: start;
    font-size: 15px;
    line-height: 1.65;
    color: var(--ink-soft);
    margin-bottom: 10px;
}
.azur-charte__bullets li strong { color: var(--ink); }
.azur-charte__bullet-check {
    color: var(--success);
    margin-top: 3px;
    flex-shrink: 0;
}

.azur-charte__accept {
    margin-top: 56px;
    padding: 32px 36px;
    background: linear-gradient(135deg, var(--ink), var(--majorelle-deep));
    color: var(--white);
    border-radius: 22px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    gap: 22px;
    flex-wrap: wrap;
}
.azur-charte__accept-bloom {
    position: absolute;
    top: -80px;
    right: -80px;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 213, 74, .2), transparent 60%);
    filter: blur(30px);
    pointer-events: none;
}
.azur-charte__accept-pip {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: var(--gold);
    color: var(--ink);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 18px;
    position: relative;
}
.azur-charte__accept-body { flex: 1; min-width: 280px; position: relative; }
.azur-charte__accept-title {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 22px;
    color: var(--white);
    letter-spacing: -0.025em;
}
.azur-charte__accept-meta {
    font-size: 13px;
    color: rgba(255, 255, 255, .75);
    margin-top: 6px;
}
.azur-charte__accept-link {
    color: var(--gold);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
    margin-left: 6px;
}
.azur-charte__accept-cta {
    padding: 14px 22px;
    border-radius: 12px;
    background: var(--gold);
    color: var(--ink);
    font-weight: 800;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    text-decoration: none;
    box-shadow: 0 12px 28px rgba(255, 213, 74, .35);
    position: relative;
    transition: transform .15s, box-shadow .15s;
}
.azur-charte__accept-cta:hover {
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(255, 213, 74, .45);
}

/* =========================================================
   RESPONSIVE BREAKPOINTS
   ========================================================= */
@media (max-width: 1024px) {
    .azur-tutos__grid--populars { grid-template-columns: repeat(2, 1fr); }
    .azur-tutos__grid--others   { grid-template-columns: repeat(2, 1fr); }
    .azur-tutos__help { grid-template-columns: 1fr; }
    .azur-tutos__tips-grid { grid-template-columns: 1fr 1fr; }
    .azur-contact__channels-inner { grid-template-columns: repeat(2, 1fr); }
    .azur-contact__form-grid { grid-template-columns: 1fr; gap: 36px; }
    .azur-legal__values { grid-template-columns: 1fr 1fr; }
    .azur-legal__team   { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
    .azur-tutos__hero,
    .azur-contact__hero,
    .azur-legal__hero,
    .azur-charte__hero {
        padding: 50px 20px 40px;
    }
    .azur-tutos__index,
    .azur-tutos__details,
    .azur-tutos__faq,
    .azur-contact__channels,
    .azur-contact__form-wrap,
    .azur-charte__body {
        padding-left: 20px;
        padding-right: 20px;
    }
    .azur-tutos__help-wrap { padding-left: 20px; padding-right: 20px; }
    .azur-tutos__help { padding: 26px 22px; }
    .azur-tutos__help-text h3 { font-size: 24px; }
    .azur-tutos__title,
    .azur-contact__title,
    .azur-charte__title {
        font-size: 44px;
        line-height: 1;
    }
    .azur-legal__title { font-size: 36px; }
    .azur-tutos__details-title,
    .azur-tutos__faq-head h2 { font-size: 32px; }
    .azur-tutos__steps-head h3 { font-size: 24px; }
    .azur-tutos__grid--populars,
    .azur-tutos__grid--others { grid-template-columns: 1fr; }
    .azur-tutos__tips-grid { grid-template-columns: 1fr; }
    .azur-tutos__detail-summary {
        grid-template-columns: 40px 1fr auto;
        gap: 12px;
        padding: 18px 18px;
    }
    .azur-tutos__detail-chips { display: none; }
    .azur-tutos__detail-body { padding: 4px 20px 24px; }
    .azur-tutos__timeline-item { grid-template-columns: 44px 1fr; gap: 14px; }
    .azur-tutos__timeline-num { width: 44px; height: 44px; font-size: 16px; }
    .azur-tutos__done { margin-left: 0; }
    .azur-contact__channels-inner { grid-template-columns: 1fr; }
    .azur-contact__form { padding: 24px 22px; }
    .azur-contact__form-row { grid-template-columns: 1fr; }
    .azur-contact__form-title { font-size: 30px; }
    .azur-legal__h2 { font-size: 32px; }
    .azur-legal__values { grid-template-columns: 1fr; margin-left: -20px; margin-right: -20px; padding: 40px 20px; }
    .azur-legal__team   { grid-template-columns: 1fr 1fr; }
    .azur-legal__doc { font-size: 15px; }
    .azur-charte__section-body { padding-left: 0; }
    .azur-charte__section-head { gap: 12px; }
    .azur-charte__accept { padding: 24px 22px; gap: 16px; }
    .azur-charte__accept-cta { width: 100%; justify-content: center; }
}