/* Socle commun des vitrines OPREO - maj 09/11/2026
   Même fichier dans IDAVIA, ODEXPO et OTRETO : couleurs, polices et blocs viennent de la feuille de marque. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--v-papier);color:var(--v-encre);font:400 17px/1.65 var(--v-texte);-webkit-font-smoothing:antialiased}
img,video{max-width:100%;height:auto;display:block}
a{color:var(--v-accent)}
:focus-visible{outline:3px solid var(--v-accent);outline-offset:3px}
h1,h2,h3{font-family:var(--v-titre);font-weight:500;letter-spacing:-.012em;line-height:1.1;margin:0}
p{margin:0 0 1em; }
.v-cadre{max-width:var(--v-large);margin:0 auto;padding:0 clamp(20px,5vw,48px)}

/* Lignes ContentBuilder (page publique : main.site-main ; CMS : .container.site-main) */
.site-main>.row{max-width:var(--v-large);margin:0 auto;padding:0 clamp(20px,5vw,48px)}
.site-main>.row>.column{padding:12px 16px}
.site-main>.row.v-plein{max-width:none;padding:0}
.site-main>.row.v-plein>.column{padding:0;width:100%;max-width:none;flex:1 1 100%}
.page-h1{max-width:var(--v-large);margin:0 auto;padding:48px clamp(20px,5vw,48px) 0}
.v-espace{height:clamp(48px,8vw,96px)}
.bandeau-apercu{background:#1f3340;color:#fff;text-align:center;font:600 14px/1 system-ui,Arial,sans-serif;padding:10px}

/* Marqueurs dynamiques : cadre visible dans le CMS seulement */
.cms-edition .v-dyn{outline:1px dashed var(--v-ardoise);outline-offset:4px;min-height:40px}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.v-entete *,.site-main *,.v-pied *{transition:none!important;animation:none!important}}

/* Sur petit ecran, les colonnes s'empilent toujours (meme avec une largeur posee par l'editeur) */
@media (max-width: 760px) {
	.site-main > .row { flex-wrap: wrap; }
	.site-main > .row > .column { width: 100% !important; max-width: 100% !important; flex: 1 1 100% !important; }
}
/* Les images flottantes (alignement gauche/droite de l'editeur) restent dans leur colonne et leur ligne */
.site-main > .row { clear: both; }
.site-main > .row::after,
.site-main > .row > .column::after { content: ""; display: block; clear: both; }
