:root{
    --text:#1f2937;
    --muted:#6b7280;
    --border:#d1d5db;
    --background:#ffffff;
    --section:#f9fafb;
    --primary:#1d4f91;
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:Arial, Helvetica, sans-serif;
    background:var(--background);
    color:var(--text);
    line-height:1.75;
    padding:40px 20px;
}

.document{
    max-width:980px;
    margin:auto;
    border:1px solid var(--border);
    padding:60px;
    background:#fff;
}

header{
    border-bottom:2px solid var(--border);
    padding-bottom:24px;
    margin-bottom:44px;
}

h1{
    font-size:2rem;
    color:var(--primary);
    margin-bottom:14px;
    line-height:1.3;
}

.subtitle{
    color:var(--muted);
    font-size:1rem;
}

.notice{
    margin-top:24px;
    padding:18px 22px;
    border:1px solid var(--border);
    background:var(--section);
}

section{
    margin-bottom:46px;
}

h2{
    font-size:1.3rem;
    color:var(--primary);
    border-bottom:1px solid var(--border);
    padding-bottom:8px;
    margin-bottom:20px;
}

h3{
    font-size:1.08rem;
    color:var(--primary);
    margin-top:26px;
    margin-bottom:12px;
}

p{
    margin-bottom:16px;
    text-align:justify;
}

ul{
    margin:14px 0 18px 24px;
}

li{
    margin-bottom:10px;
}

table{
    width:100%;
    border-collapse:collapse;
    margin:20px 0;
}

table th,
table td{
    border:1px solid var(--border);
    padding:12px;
    text-align:left;
}

table th{
    background:var(--section);
    color:var(--primary);
}

.important{
    margin-top:20px;
    padding:18px 20px;
    border-left:4px solid var(--primary);
    background:var(--section);
}

.formula{
    padding:16px;
    margin:18px 0;
    border:1px solid var(--border);
    background:var(--section);
    text-align:center;
    font-weight:600;
}

.session .content-row {
    display: flex;
    align-items: flex-start;
    gap: 32px;
    margin: 0 0 20px 0;
}

.session .text-content {
    flex: 1;
}

.session .screenshot-block {
    width: 450px; /* ajuste ici la largeur globale */
}

.session .screenshot-block img {
    width: 100%;
    height: auto;
}

.session .caption {
    margin-top: 10px;
    font-size: 0.9rem;
    color: #555;
    font-style: italic;
}




footer{
    margin-top:60px;
    padding-top:24px;
    border-top:1px solid var(--border);
    text-align:center;
    color:var(--muted);
    font-size:0.9rem;
}

#footerLogo{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:12px;
    margin-top:24px;
}

#footerLogo img{
    width:52px;
    height:52px;
}

.credit{
    line-height:1.4;
}

@media(max-width:768px){

    .document{
        padding:34px 24px;
    }

    h1{
        font-size:1.6rem;
    }

    h2{
        font-size:1.15rem;
    }
}