.sa-body {
    margin: 0;
    width: 100%;
    overflow-x: hidden;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 16px;
    line-height: 1.45;
    color: #000;
    background-color: #ACDCFC;
    background-image: url(/images/fond.gif);
    background-repeat: repeat;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}
.sa-body a:visited,
.sa-body a:active,
.sa-body a:link { color: #069; }
.sa-body a:hover { color: #F66; }
.sa-body img {
    max-width: 100%;
    height: auto;
}
.sa-main {
    width: 100%;
    max-width: 60em;
    margin: 0 auto 2em;
    padding: 1em 1.25em 2em;
    background: #fff;
    box-sizing: border-box;
}
.sa-main h1 {
    padding-left: 0;
    height: auto;
    background: none;
    font-family: alex_brushregular, Verdana, Arial, Helvetica, sans-serif;
    font-size: 2rem;
    line-height: 1.2;
    color: #069;
    font-weight: bold;
}
.sa-lead { max-width: 40em; font-size: 1.05rem; }
.sa-home-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25em;
    margin: 1.5em 0;
}
.sa-home-grid article {
    border: 2px solid #069;
    padding: 0.75em 1em;
    background: #fff;
}
.sa-home-grid h2 { margin-top: 0; font-size: 1.2rem; }
.sa-home-services { margin-top: 1.5em; }
.sa-affil { margin-top: 2em; padding-top: 1em; border-top: 1px solid #069; text-align: center; }
.sa-affil-note { font-size: 0.85rem; color: #333; }
.sa-kwanko { width: 100px; height: 100px; overflow: hidden; margin: 8px auto; }
#saKwankoInner { width: 250px; height: 250px; transform: scale(0.4); transform-origin: top left; }
.saAmazon { width: 140px; margin: 8px auto; text-align: center; font-size: 11px; line-height: 1.3; }
.saAmazon a { color: #036; text-decoration: none; display: block; margin: 0 0 12px 0; }
.saAmazon img { display: block; width: 120px; height: auto; border: 0; margin: 0 auto 4px; }
@media (min-width: 700px) {
    .sa-home-grid { grid-template-columns: 1fr 1fr 1fr; }
}
.sa-cours { max-width: 42em; }
/* Même filet décoratif que les cours V0 (ex. ligne d’horizon) */
.sa-main .sa-cours h1 {
    padding-left: 80px;
    min-height: 60px;
    box-sizing: border-box;
    background-image: url(/images/filet02.gif);
    background-repeat: no-repeat;
    background-position: left top;
    background-color: transparent;
    font-size: 2.45rem;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.01em;
    text-shadow: 0 3px 8px rgba(0, 40, 80, 0.55), 0 1px 2px rgba(0, 40, 80, 0.4);
}
.sa-cours-hero {
    margin: 0.35em 0 1em;
}
.sa-cours-hero img {
    display: block;
    max-width: 100%;
    height: auto;
}
@media (max-width: 699px) {
    .sa-main {
        padding: 0.75em 0.85em 1.5em;
    }
    .sa-main .sa-cours h1 {
        /* filet02 : taille native, comme sur PC */
        padding-left: 80px;
        min-height: 60px;
        background-size: auto;
        font-size: 2rem;
        font-weight: 800;
        line-height: 1.2;
        text-shadow: 0 3px 8px rgba(0, 40, 80, 0.55), 0 1px 2px rgba(0, 40, 80, 0.4);
    }
    .sa-cours-heading {
        background-size: min(300px, 100%) 20px;
    }
}
.sa-cours h2 {
    font-size: 1.25rem;
    font-weight: 700;
    margin-top: 1.4em;
}
.sa-cours h2:not(.sa-cours-heading) {
    text-shadow: 0 2px 4px rgba(0, 51, 102, 0.22);
}
.sa-cours h3 {
    font-size: 1.2rem;
    font-weight: 700;
    margin-top: 1.2em;
}
.sa-cours h3:not(.sa-cours-heading) {
    text-shadow: 0 2px 4px rgba(0, 51, 102, 0.2);
}
.sa-cours ul, .sa-cours ol { padding-left: 1.25em; }
.sa-cours img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}
.sa-cours figure { margin: 1em 0; }
.sa-cours figcaption {
    font-size: 0.9rem;
    color: #333;
    margin-top: 0.35em;
}
.sa-cours h2.sa-cours-heading,
.sa-cours h3.sa-cours-heading,
.sa-cours-heading {
    display: inline-block;
    max-width: 100%;
    box-sizing: border-box;
    margin-top: 1.4em;
    margin-bottom: 0.35em;
    padding: 0.15em 0.5em 0.25em 0;
    font-size: 1.25rem;
    font-weight: 700;
    background-image: url(/articles/cours/fiches/degbleu.JPG);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 300px 20px;
    /* Liseré blanc 1px + ombre portée légère floue dessous */
    text-shadow:
        -1px -1px 0 #fff,
         0   -1px 0 #fff,
         1px -1px 0 #fff,
        -1px  0   0 #fff,
         1px  0   0 #fff,
        -1px  1px 0 #fff,
         0    1px 0 #fff,
         1px  1px 0 #fff,
         0 3px 6px rgba(0, 51, 102, 0.28);
}
.sa-cours h3.sa-cours-heading {
    margin-top: 1.2em;
    font-size: 1.15rem;
}
.sa-cours-heading img {
    vertical-align: middle;
}
.sa-cours-icon { float: left; margin: 0 0.75em 0.5em 0; }
.sa-cours-float { margin: 0 0 1em; }
.sa-cours-media {
    display: flex;
    flex-wrap: wrap;
    gap: 1em;
    align-items: flex-start;
    margin: 1em 0;
}
.sa-cours-media figure { margin: 0; flex: 0 1 auto; }
.sa-cours-media--thumbs { align-items: center; }
.sa-cours-embed {
    position: relative;
    width: 100%;
    max-width: 560px;
    margin: 1em 0;
    aspect-ratio: 16 / 9;
}
.sa-cours-embed iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
.sa-c-magenta { color: #FF00FF; }
.sa-c-cyan { color: #00CCFF; }
.sa-c-jaune { color: #FFCC00; }
.sa-c-orange { color: #FF6600; }
.sa-c-vert { color: #006600; }
.sa-c-violet { color: #330099; }
@media (min-width: 700px) {
    .sa-cours-float {
        float: right;
        max-width: 45%;
        margin: 0 0 1em 1em;
    }
}
.sa-cours-nav {
    margin: 1.5em 0 0;
    padding: 0.75em 1em;
    background: #eef6fc;
    border: 1px solid #069;
    clear: both;
}
.sa-cours-nav h2 { margin: 0 0 0.5em; font-size: 1rem; }
.sa-cours-nav ol { margin: 0; }
.sa-cours-nav .is-current { font-weight: bold; }
.sa-next { margin-top: 1.5em; clear: both; }

@font-face {
    font-family: 'alex_brushregular';
    src: url('/css/alexbrush-regular-webfont.eot');
    src: url('/css/alexbrush-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/css/alexbrush-regular-webfont.woff') format('woff'),
         url('/css/alexbrush-regular-webfont.ttf') format('truetype'),
         url('/css/alexbrush-regular-webfont.svg#alex_brushregular') format('svg');
    font-weight: normal;
    font-style: normal;
}