/* oracle-gratuit.fr — grammaire du gabarit 03-annuaire, troisieme instanciation.
 *
 * Les deux premieres (ultimavoyance.fr, voyance-clelia.fr) reposent sur une colonne
 * laterale, a droite pour l'une, a gauche pour l'autre, et presentent leurs fiches en
 * cartes ou en liste numerotee. Celle-ci n'a aucune colonne : une bande d'onglets sous
 * la barre, un corps sur une seule colonne large, un TABLEAU comparatif par rubrique,
 * des rangees detaillees, une frise de constats horizontale sur la notice, la capture
 * flottante a droite. Nommage en snake_case prefixe og_ : aucune classe ne peut
 * coincider avec celles des huit autres annuaires du parc. */

:root{
  --og_ardoise:#2b2d42;
  --og_safran:#c9860a;
  --og_creme:#faf7f0;
  --og_papier:#ffffff;
  --og_trait:#e2dccd;
  --og_gris:#5c5a66;
  --og_sable:#f1ebdd;
}

*{box-sizing:border-box}
body{margin:0;background:var(--og_creme);color:#26262e;
  font-family:'Source Sans 3',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:17.5px;line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:'Fraunces',Georgia,serif;font-weight:600;color:var(--og_ardoise);margin:0 0 .5em}
h1{font-size:2.5rem;line-height:1.12;letter-spacing:-.01em}
h2{font-size:1.55rem;line-height:1.25;margin-top:2.2rem;padding-top:.4rem;border-top:3px solid var(--og_sable)}
h3{font-size:1.15rem;line-height:1.3;margin-top:1.4rem;font-weight:500}
p{margin:0 0 1.05em}
a{color:var(--og_safran);text-underline-offset:2px}
a:hover{color:#8f5f05}
img{max-width:100%;height:auto;display:block}
ol,ul{padding-left:1.3em}

/* ---- barre d'enseigne ---- */
.og_barre{background:var(--og_ardoise);color:#fff}
.og_barre_interne{display:flex;align-items:baseline;gap:22px;padding:16px 0;flex-wrap:wrap}
.og_enseigne{font-family:'Fraunces',serif;font-size:1.5rem;color:#fff;text-decoration:none;font-weight:600}
.og_enseigne em{font-style:italic;color:var(--og_safran);font-weight:500}
.og_devise{font-size:.86rem;color:#c7c6d3}

/* ---- bande d'onglets ---- */
.og_bande{background:var(--og_papier);border-bottom:1px solid var(--og_trait);position:sticky;top:0;z-index:30}
.og_bande_interne{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none}
.og_bande_interne a{flex:none;padding:12px 15px 10px;text-decoration:none;color:var(--og_ardoise);
  font-weight:600;font-size:.9rem;border-bottom:3px solid transparent;white-space:nowrap}
.og_bande_interne a:hover{color:var(--og_safran)}
.og_bande_interne a.og_onglet_actif{border-bottom-color:var(--og_safran);color:var(--og_safran)}

/* ---- ouverture ---- */
.og_ouverture{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;padding:40px 0 14px;flex-wrap:wrap}
.og_surtitre{font-size:.78rem;text-transform:uppercase;letter-spacing:.16em;color:var(--og_safran);font-weight:700;margin:0 0 .6rem}
.og_chapeau{font-size:1.12rem;color:#3d3c48;max-width:66ch;margin:0}
.og_repere{border:1px solid var(--og_trait);background:var(--og_papier);padding:14px 20px;min-width:170px;text-align:center}
.og_repere_valeur{display:block;font-family:'Fraunces',serif;font-size:2.1rem;color:var(--og_ardoise);line-height:1}
.og_repere_libelle{display:block;font-size:.76rem;text-transform:uppercase;letter-spacing:.08em;color:var(--og_gris);margin-top:6px}

/* ---- sommaire ---- */
.og_sommaire{background:var(--og_sable);padding:14px 22px;margin:18px auto 6px;max-width:1140px}
.og_sommaire p{margin:0 0 .3rem;font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--og_gris);font-weight:700}
.og_sommaire ol{margin:0;padding-left:1.2em;columns:2;column-gap:30px;font-size:.93rem}
.og_sommaire a{color:var(--og_ardoise);text-decoration:none}
.og_sommaire a:hover{color:var(--og_safran);text-decoration:underline}

/* ---- corps ---- */
.og_corps{padding:14px 0 44px;max-width:1140px}
.og_corps > h2,.og_corps > h3,.og_corps > p,.og_corps > ul,.og_corps > ol{max-width:76ch}
.og_fil{font-size:.85rem;color:var(--og_gris);margin:0 0 1.2rem}
.og_fil a{color:var(--og_gris)}

/* ---- tableau comparatif ---- */
.og_tableau{width:100%;border-collapse:collapse;margin:1.6rem 0 1rem;font-size:.95rem;background:var(--og_papier)}
.og_tableau th{background:var(--og_ardoise);color:#fff;text-align:left;padding:10px 12px;font-size:.8rem;text-transform:uppercase;letter-spacing:.06em}
.og_tableau td{border-bottom:1px solid var(--og_trait);padding:10px 12px;vertical-align:top}
.og_tableau td a{color:var(--og_ardoise);font-weight:600;text-decoration:none}
.og_tableau td a:hover{color:var(--og_safran)}
.og_tableau small{color:var(--og_gris);font-size:.8rem}
.og_tableau .og_num{font-variant-numeric:tabular-nums;color:var(--og_gris);white-space:nowrap}
.og_tableau td.og_oui{color:#2a6f3f;font-weight:700;text-align:center}
.og_tableau td.og_non{color:#b3ada3;text-align:center}

/* ---- rangees detaillees ---- */
.og_rangees{margin:1.6rem 0 0;border-top:2px solid var(--og_ardoise)}
.og_rangee{display:grid;grid-template-columns:200px 1fr;gap:22px;padding:20px 0;border-bottom:1px solid var(--og_trait)}
.og_rangee_vue img{border:1px solid var(--og_trait)}
.og_rangee h3{margin:0 0 .2rem;font-family:'Source Sans 3',sans-serif;font-weight:700;font-size:1.1rem}
.og_rangee h3 a{color:var(--og_ardoise);text-decoration:none}
.og_rangee h3 a:hover{color:var(--og_safran)}
.og_rangee_typo{font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:var(--og_gris);margin:0 0 .5rem}
.og_rangee_actions{display:flex;gap:10px;flex-wrap:wrap;margin:0}
.og_bouton,.og_bouton_creux{display:inline-block;text-decoration:none;font-weight:700;font-size:.86rem;padding:8px 16px}
.og_bouton{background:var(--og_safran);color:#fff}
.og_bouton:hover{background:#8f5f05;color:#fff}
.og_bouton_creux{border:1px solid var(--og_ardoise);color:var(--og_ardoise)}
.og_bouton_creux:hover{background:var(--og_ardoise);color:#fff}

/* ---- notice : capture flottante, frise, sortie ---- */
.og_capture{float:right;width:300px;margin:0 0 16px 28px}
.og_capture img{border:1px solid var(--og_trait);box-shadow:0 2px 0 var(--og_sable)}
.og_frise{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:.4rem 0 1.6rem;clear:none}
.og_case{background:var(--og_papier);border:1px solid var(--og_trait);padding:10px 12px;font-size:.84rem;line-height:1.35}
.og_case b{display:block;color:var(--og_ardoise)}
.og_case span{color:var(--og_gris)}
.og_case_glyphe{font-weight:700;margin-right:6px}
.og_case.og_oui{border-top:3px solid #2a6f3f}
.og_case.og_non{border-top:3px solid #d5cfc2}
.og_case.og_oui .og_case_glyphe{color:#2a6f3f}
.og_sortie{clear:both;border:1px solid var(--og_trait);border-top:4px solid var(--og_safran);background:var(--og_papier);padding:18px 22px;margin:30px 0 0;max-width:76ch}
.og_sortie p{margin:0 0 .8rem;font-size:.97rem}
.og_sortie small{display:block;margin-top:8px;color:var(--og_gris);font-size:.8rem}

/* ---- rubriques voisines ---- */
.og_voisines{margin:34px 0 0;padding:18px 0 0;border-top:1px solid var(--og_trait)}
.og_voisines p{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--og_gris);font-weight:700;margin:0 0 .5rem}
.og_voisines ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
.og_voisines a{display:block;padding:7px 13px;border:1px solid var(--og_trait);background:var(--og_papier);text-decoration:none;color:var(--og_ardoise);font-size:.88rem}
.og_voisines a:hover{border-color:var(--og_safran);color:var(--og_safran)}

/* ---- pied ---- */
.og_pied{background:var(--og_ardoise);color:#c7c6d3;margin-top:40px;padding:26px 0}
.og_pied a{color:#fff}
.og_pied span{font-size:.85rem;line-height:1.6;display:block;max-width:80ch}

@media (max-width:820px){
  h1{font-size:1.9rem}
  .og_sommaire ol{columns:1}
  .og_rangee{grid-template-columns:1fr}
  .og_capture{float:none;width:100%;margin:0 0 16px}
  .og_frise{grid-template-columns:repeat(2,1fr)}
  .og_tableau th:nth-child(n+3):nth-child(-n+6),.og_tableau td:nth-child(n+3):nth-child(-n+6){display:none}
}

/* ---- bandeau d'ouverture (ajoute le 12/09/2026) ---- */
.og_bandeau{margin:6px auto 26px;line-height:0;border:1px solid var(--og_trait);
  border-radius:3px;overflow:hidden;background:var(--og_sable)}
.og_bandeau img{width:100%;height:auto;display:block}
@media(max-width:700px){.og_bandeau{margin-bottom:18px}}