/* lobia.fr v6, direction Link : socle commun. Jetons de l'app client (app-client/jetons/lobia.json). Les règles de survol (.h1, .h2…) sont ajoutées à la fin
   par scripts/build-site.mjs depuis les style-hover / style-active / style-focus du design. Les pages sortent du générateur (inline), ce fichier ne
   porte que ce que le style en ligne ne sait pas dire : base, deux arbres (1440 et 390), focus, accordéons, et les classes des pages récit (/cas). */
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:#FFFFFF;font-family:'Schibsted Grotesk',system-ui,-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;color:#1A1A1A;font-size:17px;line-height:1.55}
img{display:block;max-width:100%}
a{color:#127A84}
a:hover{color:#0F6A73}
a:active{color:#0C5A62}
button,input,select,textarea{font:inherit}
.skip{position:absolute;left:12px;top:-60px;background:#1A1A1A;color:#fff;padding:10px 16px;border-radius:8px;z-index:50;font:500 14px/1 'Schibsted Grotesk',system-ui,sans-serif;text-decoration:none}
.skip:focus{top:12px}
:focus-visible{outline:2px solid #127A84;outline-offset:2px}
[hidden]{display:none!important}
summary{list-style:none}
summary::-webkit-details-marker{display:none}
[data-scroll]::-webkit-scrollbar{display:none}
/* deux arbres : le bureau à partir de 1100 px, la colonne unique en dessous */
.v{overflow-x:clip}
.vm{display:block}.vd{display:none}
@media (min-width:1100px){.vm{display:none}.vd{display:block}}
.vm main>section>*,.vm header>div,.vm footer>div{max-width:720px;margin-left:auto;margin-right:auto}
.vm [data-constructeur]{max-width:100%}
.vm header [data-menu]{max-width:688px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
/* l'en-tête reste sous la bulle de Léon (script de l'aimant) : pas de position collante */
[data-ts-box]:empty{display:none}
/* page courante du menu : au survol (fond #D5EAEA) le sarcelle de base tombe à 4,05:1, le texte passe au sarcelle de survol */
a[aria-current=page]:hover{color:#0F6A73!important}
/* constructeur : états de survol et d'appui des éléments que constructeur.js écrit en JavaScript (pas de style-hover possible) */
.cx-sbtn:hover{background:#F6F6F6!important}.cx-sbtn:active{background:#EFEFEF!important}
.cx-input:hover{border-color:#BDBDBD!important}.cx-input:focus{border-color:#127A84!important;box-shadow:0 0 0 3px #EAF5F5!important}
.cx-go:hover{background:#0F6A73!important}.cx-go:active{background:#0C5A62!important}
.cx-plus:hover{background:#EAF5F5!important}.cx-plus:active{background:#D5EAEA!important}
/* pages récit /cas/<slug> (build-cas.mjs) : mêmes jetons, composants de la page d'offre ; leur <main> n'a pas de style en ligne */
main:not([style]){padding-bottom:80px}
.sx{padding:40px 0 0}.sx0{padding-top:24px}
.cn{max-width:1120px;margin:0 auto;padding:0 48px}
.casw{max-width:820px;margin-left:auto;margin-right:auto}
.mono{font:500 13px/1.4 'Schibsted Grotesk',system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#6B6B6B}
.h1s{margin:0 0 20px;font:600 clamp(32px,4vw,44px)/1.15 'Schibsted Grotesk',system-ui,sans-serif;color:#1A1A1A;text-wrap:balance;max-width:24ch}
.h2s{margin:0;font:600 clamp(26px,3vw,30px)/1.2 'Schibsted Grotesk',system-ui,sans-serif;color:#1A1A1A}
.lede{margin:0;font-size:18px;line-height:1.55;color:#6B6B6B;max-width:62ch;text-wrap:pretty}
.stack{display:flex;flex-direction:column;gap:14px}
.cardx{background:#fff;border:1px solid #ECECEC;border-radius:12px;padding:28px;display:flex;flex-direction:column;gap:16px}
.cardx p,.small{margin:0;font-size:16px;line-height:1.55;color:#1A1A1A}
.small{font-size:14px;color:#6B6B6B}
.bt{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;height:44px;padding:0 18px;border-radius:8px;background:#127A84;color:#fff;border:0;font:500 15px/1 'Schibsted Grotesk',system-ui,sans-serif;text-decoration:none;cursor:pointer;transition:background .15s}
.bt:hover{background:#0F6A73;color:#fff}.bt:active{background:#0C5A62;color:#fff}
.cas-fig{margin:28px 0 0;border-radius:12px;overflow:hidden;background:#F6F6F6;border:1px solid #ECECEC}
.cas-fig img{width:100%;height:auto}
.scene{margin-top:28px}
.scene p,.cresult blockquote{font-size:18px;line-height:1.6;color:#1A1A1A}
.cresult{margin-top:20px;background:#F6F6F6;border-radius:12px;padding:24px 28px;display:flex;flex-direction:column;gap:12px}
.cresult blockquote{margin:0;font-weight:600;font-size:20px;line-height:1.4;text-wrap:pretty}
.cresult .try{font-size:15px;color:#6B6B6B;margin:0}.cresult .try a{color:#127A84;overflow-wrap:anywhere}
/* quatre onglets : lisibles sans JavaScript (les quatre blocs empilés), onglets seulement avec JS */
.tablist{display:none;gap:8px;flex-wrap:wrap;margin:24px 0 0}
.js .tablist{display:flex}
.tab{display:inline-flex;align-items:center;height:40px;font:500 15px/1 'Schibsted Grotesk',system-ui,sans-serif;color:#1A1A1A;background:#fff;border:1px solid #DADADA;border-radius:999px;padding:0 18px;cursor:pointer;transition:background .15s,color .15s}
.tab:hover{background:#F6F6F6}.tab:active{background:#EFEFEF}
.tab[aria-selected=true]{background:#EAF5F5;color:#127A84;border-color:#EAF5F5}
.tab[aria-selected=true]:hover{background:#D5EAEA}
.tabpanel{margin-top:20px;background:#fff;border:1px solid #ECECEC;border-radius:12px;padding:26px 28px;display:flex;flex-direction:column;gap:12px;scroll-margin-top:24px}
.tabpanel h3{margin:0;font:600 20px/1.3 'Schibsted Grotesk',system-ui,sans-serif;color:#1A1A1A}
.js [data-tabs][data-ready] .tabpanel h3{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.js [data-tabs]:not([data-ready]) .tabpanel~.tabpanel{display:none}
.tabpanel p{margin:0;font-size:17px;line-height:1.6;color:#1A1A1A}
.tabpanel .verif{font:500 13px/1.5 'Schibsted Grotesk',system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#6B6B6B}
.tabpanel code{font:14px ui-monospace,Menlo,monospace;background:#F6F6F6;border-radius:6px;padding:1px 6px}
.ctafin{align-items:flex-start}
.ctafin .small a{color:#127A84}
@media (max-width:700px){.cn{padding:0 16px}.sx{padding-top:32px}.cardx,.tabpanel,.cresult{padding:20px}.cresult blockquote{font-size:19px}}

/* survol, appui et focus : générés depuis les style-hover / style-active / style-focus du design */
.h1:hover{background:#F6F6F6 !important}
.h1:active{background:#EFEFEF !important}
.h2:hover{background:#0F6A73 !important}
.h2:active{background:#0C5A62 !important}
.h3:hover{color:#127A84 !important}
.h3:active{color:#0C5A62 !important}
.h4:hover{background:#EAF5F5 !important}
.h4:active{background:#D5EAEA !important}
.h5:hover{color:#0F6A73 !important;text-decoration:underline !important}
.h5:active{color:#0C5A62 !important}
.h6:hover{background:#D5EAEA !important}
.h6:active{background:#EFEFEF !important}
.h7:hover{border-color:#BDBDBD !important}
.h7:focus{border-color:#127A84 !important;box-shadow:0 0 0 3px #EAF5F5 !important}
.h8:hover{background:#EAF5F5 !important;border-color:#127A84 !important}
.h8:focus{border-color:#127A84 !important;box-shadow:0 0 0 3px #EAF5F5 !important}
.h8:active{background:#D5EAEA !important}
