/* gardien_monde v2 (04/11/2026) — identité Gardien de site (bleu nuit, orange, crème, écusson orange), reprise du .fr et élevée.
   Une seule feuille, polices du système (rien de téléchargé, rien de bloqué en Chine), aucune animation, icônes en SVG locaux.
   Contrastes calculés : blanc/nuit 13,7 · orange clair/nuit 6,2 · blanc/orange foncé 4,5 · texte/crème 11,9 · gris/blanc 6,0. */
:root {
  --nuit: #1f2a5a; --nuit-2: #2b3878; --nuit-3: #17204a; --orange: #e8772e; --orange-clair: #f39a5b; --orange-fonce: #c2560f;
  --creme: #faf6ef; --blanc: #ffffff; --texte: #2c3148; --gris: #5d6378; --bord: #e6e1d6; --vert: #1b7a4a; --sur-nuit: #cdd3ea; --erreur: #a3271c;
  --latin: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", "Helvetica Neue", Arial;
  --cjk: "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Noto Sans CJK SC", "Microsoft YaHei";
  --thai: "Noto Sans Thai", "Leelawadee UI", "Thonburi", "Tahoma";
  --largeur: 76rem; --marge: clamp(1.1rem, 5vw, 3rem); --arrondi: .75rem;
  color-scheme: light;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; overflow-x: hidden; }
body { margin: 0; background: var(--blanc); color: var(--texte); font-family: var(--latin), var(--cjk), var(--thai), sans-serif; font-size: 1.0625rem; line-height: 1.6; overflow-x: hidden; }
:lang(zh-CN) { font-family: var(--cjk), var(--latin), sans-serif; line-height: 1.8; }
:lang(th-TH) { font-family: var(--thai), var(--latin), sans-serif; line-height: 1.85; }
:lang(vi-VN) { line-height: 1.7; }
:lang(zh-CN) em, :lang(th-TH) em { font-style: normal; font-weight: 600; }
h1, h2, h3 { color: var(--nuit); line-height: 1.2; margin: 0 0 .8rem; font-weight: 800; letter-spacing: -.01em; }
:lang(zh-CN) h1, :lang(zh-CN) h2, :lang(th-TH) h1, :lang(th-TH) h2 { line-height: 1.45; letter-spacing: 0; }
h1 { font-size: clamp(2.1rem, 4.6vw, 3.4rem); }
h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); margin-top: 3rem; }
h3 { font-size: 1.15rem; margin-top: 1.5rem; }
p, ul, ol, dl, table { margin: 0 0 1rem; }
a { color: var(--orange-fonce); text-underline-offset: .18em; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
img { max-width: 100%; height: auto; }
.visually-hidden, .element-invisible { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.gm-saut { position: absolute; left: -999px; }
.gm-saut:focus { left: 1rem; top: 1rem; z-index: 10; padding: .6rem 1rem; background: var(--blanc); color: var(--nuit); border-radius: .4rem; }

/* ===== En-tête bleu nuit ===== */
.gm-entete { background: var(--nuit); color: var(--blanc); display: grid; grid-template-columns: auto 1fr; grid-template-areas: "logo langues" "nav nav";
  gap: .6rem 2rem; align-items: center; padding: 1.1rem max(var(--marge), calc((100% - var(--largeur)) / 2)) .3rem; }
.gm-logo { grid-area: logo; display: grid; grid-template-columns: auto 1fr; column-gap: .75rem; align-items: center; text-decoration: none; color: var(--blanc); }
.gm-logo-marque { grid-row: span 2; width: 2.6rem; height: 3rem; }
.gm-logo-marque path:first-child { fill: var(--orange); stroke: var(--orange); }
.gm-coche { stroke: var(--blanc); }
.gm-nom { font-weight: 800; font-size: 1.55rem; letter-spacing: -.01em; line-height: 1.1; }
.gm-slogan { font-size: .92rem; color: var(--sur-nuit); }
.gm-nav { grid-area: nav; }
.gm-nav ul, .gm-pied ul, .gm-langues ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.gm-nav ul { gap: .2rem 1.8rem; }
.gm-nav ul ul { display: none; }
.gm-nav a { display: inline-block; padding: .7rem 0 .8rem; color: var(--blanc); text-decoration: none; font-weight: 600; border-bottom: 3px solid transparent; }
.gm-nav a:hover, .gm-nav [aria-current="page"], .gm-nav .active > a { border-bottom-color: var(--orange); }
.gm-langues { grid-area: langues; justify-self: end; display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; font-size: .9rem; }
.gm-langues ul { gap: .4rem; }
.gm-langues a { display: inline-block; padding: .3rem .75rem; border: 1px solid rgba(255,255,255,.35); border-radius: 2rem; color: var(--blanc); text-decoration: none; min-height: 32px; }
.gm-langues a:hover { border-color: var(--blanc); }
.gm-langues .lang-active a, .gm-langues a[aria-current] { background: var(--blanc); color: var(--nuit); font-weight: 700; border-color: var(--blanc); }
.gm-langues .lang-active, .gm-langues li { background: none !important; }

/* ===== Contenu ===== */
.gm-contenu { max-width: calc(var(--largeur) + 2 * var(--marge)); margin: 0 auto; padding: 3rem var(--marge) 4.5rem; }
.gm-contenu > *:first-child, .gm-contenu .com-content-article__body > *:first-child { margin-top: 0; }
.gi-chapeau { font-size: 1.2rem; max-width: 44rem; margin-bottom: 2rem; }
.gi-note { font-size: .92rem; color: var(--gris); }
.gi-section { margin-top: 4.5rem; }
.gi-actions { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; margin-top: 1.8rem; }
.gi-bouton, .btn, button[type="submit"] { display: inline-block; background: var(--orange-fonce); color: var(--blanc); border: 0; border-radius: .6rem;
  padding: .95rem 1.6rem; font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; min-height: 48px; box-shadow: 0 3px 0 #8f3f0b; }
.gi-bouton:hover, .btn:hover { background: #a94a0c; }
.gi-bouton-second { display: inline-block; padding: .85rem 1.5rem; border-radius: .6rem; background: var(--blanc); color: var(--nuit); font-weight: 700; text-decoration: none; min-height: 48px;
  border: 2px solid var(--nuit); }
.gi-bouton-second:hover { background: var(--creme); }
.gi-badge { display: inline-block; font-size: .78rem; font-weight: 700; color: var(--blanc); background: var(--vert); border-radius: 2rem; padding: .1rem .6rem; vertical-align: middle; }

/* Bandes pleine largeur (sortent de la colonne de contenu) */
.gi-tete, .gi-garanties, .gi-monde, .gi-appel { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw);
  padding-left: max(var(--marge), calc((100vw - var(--largeur)) / 2)); padding-right: max(var(--marge), calc((100vw - var(--largeur)) / 2)); }

/* Accueil : bandeau bleu nuit + Rapport du gardien */
.gm-contenu:has(.gi-tete) { padding-top: 0; }
.gi-tete { background: radial-gradient(ellipse at 85% 20%, var(--nuit-2), var(--nuit) 60%); color: var(--blanc); display: grid; grid-template-columns: 1.25fr 1fr; gap: 3rem;
  align-items: center; padding-top: 4rem; padding-bottom: 4.5rem; }
.gi-tete h1 { color: var(--blanc); }
.gi-tete h1 .gi-accent { color: var(--orange-clair); display: block; }
.gi-tete .gi-chapeau { color: var(--sur-nuit); }
.gi-tete .gi-bouton-second { background: transparent; color: var(--blanc); border-color: rgba(255,255,255,.7); }
.gi-tete .gi-bouton-second:hover { background: rgba(255,255,255,.1); }
.gi-rapport { background: var(--blanc); color: var(--texte); border-radius: var(--arrondi); box-shadow: 0 18px 40px rgba(10, 16, 40, .35); padding: 1.4rem 1.6rem 1.2rem; margin: 0 0 1.5rem; border: 1px solid var(--bord); }
.gi-tete .gi-rapport { margin: 0; border: 0; }
.gi-rapport h2, .gi-rapport h3 { font-size: 1.05rem; margin: 0 0 .6rem; padding-left: 2rem; position: relative; color: var(--nuit); }
.gi-rapport h2::before, .gi-rapport h3::before { content: ""; position: absolute; left: 0; top: .05rem; width: 1.4rem; height: 1.6rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 28'%3E%3Cpath d='M12 1.5 2 5v8.5c0 6.2 4.3 10.9 10 13 5.7-2.1 10-6.8 10-13V5L12 1.5Z' fill='%23e8772e'/%3E%3Cpath d='m7.5 14 3 3 6-6.5' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain; }
.gi-rapport dl { margin: 0; }
.gi-rapport dl div { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem 0; border-bottom: 1px dashed var(--bord); }
.gi-rapport dd { margin: 0; font-weight: 700; color: var(--vert); text-align: right; }
.gi-rapport dd::before { content: "✓ "; }
.gi-rapport small { font-weight: 400; color: var(--gris); }
.gi-rapport-note { margin: .8rem 0 0; font-size: .88rem; color: var(--gris); }

/* Bande crème des garanties (4 points) */
.gi-garanties { background: var(--creme); border-bottom: 1px solid var(--bord); padding-top: 1.8rem; padding-bottom: 1.8rem; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; list-style: none; margin-top: 0; margin-bottom: 0; }
.gi-garanties li { display: grid; grid-template-columns: 2.6rem 1fr; gap: .8rem; align-items: start; }
.gi-garanties li::before { content: ""; width: 2.6rem; height: 2.6rem; border-radius: .6rem; background-color: var(--nuit); background-repeat: no-repeat; background-position: center; background-size: 1.4rem; }
.gi-garanties li:nth-child(1)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M18 6.5A7 7 0 1 0 18 17.5M4 10h9M4 14h9'/%3E%3C/svg%3E"); }
.gi-garanties li:nth-child(2)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 3-6.7L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3C/svg%3E"); }
.gi-garanties li:nth-child(3)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H6a1 1 0 0 0-1 1v16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V8z'/%3E%3Cpath d='M14 3v5h5M9 13l2 2 4-4'/%3E%3C/svg%3E"); }
.gi-garanties li:nth-child(4)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m14.5 6.5 3 3M4 20l7.5-7.5M13 4l7 7-3 3-7-7z'/%3E%3C/svg%3E"); }
.gi-garanties strong { display: block; color: var(--nuit); }
.gi-garanties span { color: var(--gris); font-size: .95rem; }

/* Cartes de services */
.gi-grille-prix { list-style: none; margin: 1.5rem 0 1rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(15.5rem, 1fr)); gap: 1.3rem; }
.gi-grille-prix li { position: relative; background: var(--blanc); border: 1px solid var(--bord); border-radius: var(--arrondi); padding: 1.6rem 1.4rem 1.4rem; display: flex; flex-direction: column; box-shadow: 0 2px 0 var(--bord); }
.gi-grille-prix li::before { content: ""; width: 3rem; height: 3rem; border-radius: .7rem; background: var(--creme) no-repeat center / 1.6rem; margin-bottom: 1rem; }
.gi-grille-prix li:nth-child(1)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c2560f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4 4 0 0 0-5.4 5.4L3 18l3 3 6.3-6.3a4 4 0 0 0 5.4-5.4l-2.5 2.5-2.4-.6-.6-2.4z'/%3E%3C/svg%3E"); }
.gi-grille-prix li:nth-child(2)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 28' fill='none' stroke='%23c2560f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 1.5 2 5v8.5c0 6.2 4.3 10.9 10 13 5.7-2.1 10-6.8 10-13V5z'/%3E%3Cpath d='m7.5 14 3 3 6-6.5'/%3E%3C/svg%3E"); }
.gi-grille-prix li:nth-child(3)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c2560f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s7-6.2 7-12a7 7 0 0 0-14 0c0 5.8 7 12 7 12z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E"); }
.gi-grille-prix li:nth-child(4)::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c2560f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='14' rx='2'/%3E%3Cpath d='M3 8h18M8 21h8M12 18v3'/%3E%3C/svg%3E"); }
.gi-grille-prix li:has(.gi-badge) { border: 2px solid var(--orange); box-shadow: 0 10px 28px rgba(194, 86, 15, .14); }
.gi-grille-prix li:has(.gi-badge) .gi-badge { position: absolute; top: -.8rem; left: 1.4rem; background: var(--orange-fonce); }
.gi-grille-prix h2, .gi-grille-prix h3 { font-size: 1.2rem; margin: 0 0 .5rem; }
.gi-grille-prix h2 a, .gi-grille-prix h3 a { color: var(--nuit); text-decoration: none; }
.gi-grille-prix h2 a::after, .gi-grille-prix h3 a::after { content: ""; position: absolute; inset: 0; border-radius: var(--arrondi); }
.gi-grille-prix li:hover { border-color: var(--nuit); }
.gi-grille-prix li:has(.gi-badge):hover { border-color: var(--orange-fonce); }
.gi-grille-prix p { margin: 0 0 .8rem; }
.gi-prix { margin-top: auto !important; font-weight: 800; font-size: 1.25rem; color: var(--nuit); }
.gi-prix span { font-weight: 400; color: var(--gris); font-size: .9rem; }
.gi-prix-bloc { border: 2px solid var(--nuit); border-radius: var(--arrondi); padding: 1.6rem 1.8rem; margin: 2.2rem 0; background: var(--creme); }
.gi-prix-bloc h2 { margin-top: 0; font-size: 1.35rem; }
.gi-prix-bloc .gi-prix { font-size: 1.5rem; margin: .5rem 0 1rem !important; }

/* Deux parcours : Europe / Asie */
.gi-parcours { display: grid; grid-template-columns: 1fr 1fr; gap: 1.3rem; margin-top: 3rem; }
.gi-carte-parcours { display: block; position: relative; padding: 1.6rem 3.6rem 1.6rem 1.6rem; border-radius: var(--arrondi); text-decoration: none; color: var(--texte);
  background: var(--blanc); border: 2px solid var(--nuit); }
.gi-carte-parcours + .gi-carte-parcours { background: var(--nuit); color: var(--sur-nuit); }
.gi-carte-parcours::after { content: ""; position: absolute; right: 1.4rem; top: 50%; width: 1.4rem; height: 1.4rem; margin-top: -.7rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c2560f' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center / contain; }
.gi-carte-parcours + .gi-carte-parcours::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f39a5b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E"); }
.gi-carte-parcours:hover { box-shadow: 0 10px 26px rgba(31, 42, 90, .18); }
.gi-carte-titre { display: block; font-size: 1.3rem; font-weight: 800; color: var(--nuit); margin-bottom: .35rem; }
.gi-carte-parcours + .gi-carte-parcours .gi-carte-titre { color: var(--blanc); }
.gi-carte-texte { display: block; }

/* Listes, étapes, étiquettes, tableaux */
.gi-liste { list-style: none; padding: 0; }
.gi-liste li { position: relative; padding: .4rem 0 .4rem 2rem; }
.gi-liste li::before { content: "✓"; position: absolute; left: 0; top: .5rem; width: 1.35rem; height: 1.35rem; border-radius: 50%; background: var(--vert); color: var(--blanc);
  font-size: .8rem; font-weight: 700; display: grid; place-items: center; line-height: 1; }
.gi-etapes { list-style: none; padding: 0; counter-reset: etape; display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1.2rem; }
.gi-etapes li { counter-increment: etape; position: relative; background: var(--creme); border-radius: var(--arrondi); padding: 3.4rem 1.3rem 1.3rem; }
.gi-etapes li::before { content: counter(etape); position: absolute; top: 1rem; left: 1.3rem; width: 1.9rem; height: 1.9rem; border-radius: 50%; background: var(--nuit); color: var(--blanc);
  font-weight: 800; display: grid; place-items: center; }
.gi-etapes strong { display: block; color: var(--nuit); }
.gi-etiquettes { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.gi-etiquettes li { background: var(--creme); border: 1px solid var(--bord); border-radius: 2rem; padding: .3rem .9rem; font-size: .95rem; color: var(--nuit); font-weight: 600; }
.gi-tableau { width: 100%; border-collapse: separate; border-spacing: 0; background: var(--blanc); border-radius: var(--arrondi); overflow: hidden; border: 1px solid var(--bord); }
.gi-tableau th, .gi-tableau td { text-align: left; padding: .85rem 1rem; border-bottom: 1px solid var(--bord); vertical-align: top; }
.gi-tableau th { background: var(--nuit); color: var(--blanc); }
.gi-tableau tr:nth-child(even) td { background: var(--creme); }
.gi-tableau td:last-child, .gi-tableau th:last-child { text-align: right; white-space: nowrap; font-weight: 700; color: var(--nuit); }
.gi-tableau th:last-child { color: var(--blanc); }

/* Accueil : « Qui suis-je » avec photo + Europe ↔ Asie */
.gi-moi { display: grid; grid-template-columns: 11rem 1fr; gap: 2rem; align-items: start; }
.gi-moi img { width: 11rem; height: 11rem; object-fit: cover; border-radius: 50%; border: 5px solid var(--creme); box-shadow: 0 0 0 2px var(--orange); }
.gi-moi h2 { margin-top: 0; }
.gi-monde { background: var(--nuit); color: var(--sur-nuit); padding-top: 3.5rem; padding-bottom: 3.5rem; margin-top: 4.5rem; display: grid; grid-template-columns: 1fr 1.1fr; gap: 3rem; align-items: center; }
.gi-monde h2 { color: var(--blanc); margin-top: 0; }
.gi-monde a { color: var(--orange-clair); }
.gi-monde svg { width: 100%; height: auto; display: block; }
.gi-monde .gi-ville { fill: var(--blanc); font: 700 16px var(--latin), sans-serif; }
.gi-monde .gi-heure { fill: var(--sur-nuit); font: 13px var(--latin), sans-serif; }
.gi-monde .gi-arc { fill: none; stroke: var(--orange); stroke-width: 2.5; stroke-dasharray: 6 7; }
.gi-monde .gi-point { fill: var(--orange); }
.gi-monde .gi-point-paris { fill: var(--blanc); }
.gi-deux-colonnes { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; }
.gi-deux-colonnes h2 { margin-top: 0; }
.gi-appel { margin-top: 0; margin-bottom: -4.5rem; padding-top: 3.5rem; padding-bottom: 3.5rem; background: var(--creme); border-top: 1px solid var(--bord); text-align: center; }
.gi-appel h2 { margin-top: 0; }
.gi-appel p { max-width: 40rem; margin-left: auto; margin-right: auto; }
.gm-contenu section.gi-appel:not(:last-child) { margin: 3rem 0 0; padding: 2.2rem; border: 1px solid var(--bord); border-radius: var(--arrondi); }

/* Contact (com_contact) et formulaires */
.com-contact h1 .contact-name { font-weight: inherit; }
.contact-miscinfo, .com-contact__miscinfo { max-width: 46rem; margin-bottom: 2rem; background: var(--creme); border-radius: var(--arrondi); padding: 1.4rem 1.6rem; }
.com-contact form, .contact-form { max-width: 42rem; }
.com-contact fieldset { border: 1px solid var(--bord); border-radius: var(--arrondi); padding: 1.3rem 1.5rem; margin: 0 0 1.5rem; background: var(--blanc); }
.com-contact legend { font-weight: 800; color: var(--nuit); padding: 0 .4rem; }
.control-group { margin-bottom: 1.1rem; }
.control-label label, label { display: block; font-weight: 700; color: var(--nuit); margin-bottom: .3rem; }
.form-control, input[type="text"], input[type="email"], input[type="tel"], textarea, select {
  width: 100%; font: inherit; color: var(--texte); background: var(--blanc); border: 2px solid #c9c3b6; border-radius: .5rem; padding: .7rem .8rem; min-height: 48px; }
.form-control:focus, textarea:focus { border-color: var(--nuit); outline: 3px solid var(--orange); outline-offset: 1px; }
textarea { min-height: 9rem; }
.form-check { display: flex; gap: .6rem; align-items: flex-start; }
.form-check-input, input[type="checkbox"], input[type="radio"] { width: 1.5rem; height: 1.5rem; min-width: 24px; min-height: 24px; margin-top: .15rem; accent-color: var(--orange-fonce); }
.invalid, .form-control-danger, [aria-invalid="true"] { border-color: var(--erreur) !important; }
.form-control-feedback, .invalid-feedback, label.invalid { color: var(--erreur); }
.star { color: var(--erreur); }
p > a:only-child:not(.gi-bouton):not(.gi-bouton-second) { display: inline-block; padding: .35rem 0; }

/* Messages de Joomla */
#system-message-container joomla-alert, .alert { display: block; border-radius: var(--arrondi); padding: 1rem 1.2rem; margin: 0 0 1.5rem; background: var(--creme); color: var(--nuit); border-left: 6px solid var(--vert); }
joomla-alert[type="danger"], joomla-alert[type="warning"], .alert-danger, .alert-warning { border-left-color: var(--erreur); }
joomla-alert button { background: none; border: 0; color: var(--nuit); font-size: 1.4rem; float: right; cursor: pointer; }

/* Pied bleu nuit */
.gm-pied { background: var(--nuit-3); color: var(--sur-nuit); padding: 2.5rem max(var(--marge), calc((100% - var(--largeur)) / 2)); }
.gm-pied ul { gap: .3rem 1.6rem; margin-bottom: 1.2rem; }
.gm-pied a { color: var(--blanc); display: inline-block; padding: .35rem 0; }
.gm-pied p { margin: .3rem 0; }
.gm-pied strong { color: var(--blanc); }
.gm-erreur { padding-top: 5rem; }

/* Tablette et téléphone */
@media (max-width: 960px) {
  .gi-parcours { grid-template-columns: 1fr; }
  .gi-tete, .gi-deux-colonnes, .gi-monde { grid-template-columns: 1fr; gap: 2.2rem; }
  .gi-garanties { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  body { font-size: 1rem; }
  .gm-entete { grid-template-columns: 1fr; grid-template-areas: "logo" "langues" "nav"; }
  .gm-langues { justify-self: start; }
  .gm-nav ul { gap: 0 1.2rem; }
  .gm-nom { font-size: 1.3rem; }
  .gi-tete { padding-top: 2.6rem; padding-bottom: 3rem; }
  .gi-garanties { grid-template-columns: 1fr; gap: 1rem; }
  .gi-moi { grid-template-columns: 1fr; }
  .gi-moi img { width: 8rem; height: 8rem; }
  .gm-contenu { padding-top: 2rem; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }
@media print { .gm-entete nav, .gm-langues, .gm-saut { display: none; } body { color: #000; background: #fff; } }

/* ===================== v3 (04/11/2026) — accueil complet + effets sobres ===================== */
/* En-tête qui reste visible (ordinateur) */
@media (min-width: 961px) { .gm-entete { position: sticky; top: 0; z-index: 50; box-shadow: 0 1px 0 rgba(255,255,255,.08), 0 6px 18px rgba(10,16,40,.25); } }

/* Introductions de section */
.gi-intro-section { max-width: 46rem; margin-bottom: 1.6rem; }
.gi-intro-section h2 { margin-top: 0; }
.gi-intro-section p { font-size: 1.1rem; color: var(--gris); }

/* Bandeau : 3 réassurances sous les boutons */
.gi-rassurances { list-style: none; padding: 0; margin: 1.6rem 0 0; display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; color: var(--sur-nuit); font-size: .95rem; }
.gi-rassurances li { padding-left: 1.5rem; position: relative; }
.gi-rassurances li::before { content: "✓"; position: absolute; left: 0; color: var(--orange-clair); font-weight: 800; }

/* Rapport « vivant » : les contrôles se cochent un à un (seul effet de chargement) */
.gi-rapport-pied { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .4rem 1rem; margin: .9rem 0 0; font-size: .88rem; }
.gi-rapport-etat { font-weight: 800; color: var(--vert); }
.gi-rapport-etat::before { content: ""; display: inline-block; width: .6rem; height: .6rem; border-radius: 50%; background: var(--vert); margin-right: .45rem; box-shadow: 0 0 0 3px rgba(27,122,74,.18); }
.gi-rapport-date { color: var(--gris); }
@media (prefers-reduced-motion: no-preference) {
  .gi-rapport-vivant dl div { animation: gi-ligne .45s ease-out both; }
  .gi-rapport-vivant dl div:nth-child(1) { animation-delay: .35s; } .gi-rapport-vivant dl div:nth-child(2) { animation-delay: .75s; }
  .gi-rapport-vivant dl div:nth-child(3) { animation-delay: 1.15s; } .gi-rapport-vivant dl div:nth-child(4) { animation-delay: 1.55s; }
  .gi-rapport-vivant dd { animation: gi-coche .4s ease-out both; }
  .gi-rapport-vivant dl div:nth-child(1) dd { animation-delay: .6s; } .gi-rapport-vivant dl div:nth-child(2) dd { animation-delay: 1s; }
  .gi-rapport-vivant dl div:nth-child(3) dd { animation-delay: 1.4s; } .gi-rapport-vivant dl div:nth-child(4) dd { animation-delay: 1.8s; }
  .gi-rapport-vivant .gi-rapport-etat { animation: gi-apparait .5s ease-out 2.2s both; }
}
@keyframes gi-ligne { from { opacity: .25; } to { opacity: 1; } }
@keyframes gi-coche { from { opacity: 0; transform: scale(.85); } to { opacity: 1; transform: none; } }
@keyframes gi-apparait { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* Pourquoi les sites se font pirater : 3 cartes */
.gi-cartes-risques { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.3rem; }
.gi-cartes-risques li { background: var(--creme); border-radius: var(--arrondi); padding: 1.6rem 1.5rem 1.2rem; border-top: 4px solid var(--orange); display: flex; flex-direction: column; }
.gi-cartes-risques h3 { margin-top: 0; font-size: 1.2rem; }
.gi-cartes-risques p:last-child { margin: auto 0 0; padding-top: .4rem; }

/* Liens d'action : petite flèche qui avance au survol */
.gi-cartes-risques p:last-child a, .gi-faq-courte > p a, .gi-engagements > p a, .gi-moi p:last-child a { font-weight: 700; text-decoration: none; border-bottom: 2px solid currentColor; padding-bottom: 1px; }
.gi-cartes-risques p:last-child a::after, .gi-faq-courte > p a::after, .gi-engagements > p a::after, .gi-moi p:last-child a::after { content: " →"; display: inline-block; }
@media (prefers-reduced-motion: no-preference) {
  .gi-cartes-risques p:last-child a::after, .gi-faq-courte > p a::after, .gi-engagements > p a::after, .gi-moi p:last-child a::after { transition: transform .2s; }
  .gi-cartes-risques p:last-child a:hover::after, .gi-faq-courte > p a:hover::after, .gi-engagements > p a:hover::after, .gi-moi p:last-child a:hover::after { transform: translateX(4px); }
  .gi-grille-prix li, .gi-carte-parcours, .gi-cartes-risques li { transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
  .gi-grille-prix li:hover, .gi-grille-prix li:focus-within, .gi-carte-parcours:hover, .gi-carte-parcours:focus-visible { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(31, 42, 90, .16); }
  .gi-carte-parcours::after { transition: transform .2s; } .gi-carte-parcours:hover::after { transform: translateX(5px); }
  .gi-bouton, .gi-bouton-second { transition: background-color .15s, transform .15s; } .gi-bouton:active { transform: translateY(2px); box-shadow: 0 1px 0 #8f3f0b; }
}

/* Exemple de rapport mensuel */
.gi-exemple-rapport { display: grid; grid-template-columns: 1.15fr 1fr; gap: 3rem; align-items: center; background: var(--creme); border-radius: 1.2rem; padding: 2.6rem; }
.gi-exemple-rapport h2 { margin-top: 0; }
.gi-exemple-rapport .gi-rapport { margin: 0; }

/* Citation de Patrick */
.gi-citation { margin: 0 0 1rem; padding: .2rem 0 .2rem 1.2rem; border-left: 4px solid var(--orange); font-size: 1.2rem; color: var(--nuit); font-weight: 600; }
.gi-citation p { margin: 0; }
:lang(zh-CN) .gi-citation, :lang(th-TH) .gi-citation { font-weight: 500; }

/* Carte Paris → Asie : les trajets se dessinent quand la section arrive à l'écran (navigateurs récents) */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .gi-monde .gi-arc { stroke-dasharray: 520; stroke-dashoffset: 520; animation: gi-trace linear both; animation-timeline: view(); animation-range: entry 10% cover 45%; }
  }
}
@keyframes gi-trace { to { stroke-dashoffset: 0; } }

/* Questions dépliables (sans script) */
.gi-faq-courte details { border: 1px solid var(--bord); border-radius: var(--arrondi); margin: 0 0 .7rem; background: var(--blanc); }
.gi-faq-courte summary { cursor: pointer; list-style: none; padding: 1.05rem 3.2rem 1.05rem 1.3rem; font-weight: 700; color: var(--nuit); position: relative; min-height: 48px; }
.gi-faq-courte summary::-webkit-details-marker { display: none; }
.gi-faq-courte summary::after { content: "+"; position: absolute; right: 1.2rem; top: 50%; transform: translateY(-50%); width: 1.7rem; height: 1.7rem; border-radius: 50%;
  background: var(--creme); color: var(--orange-fonce); display: grid; place-items: center; font-size: 1.3rem; font-weight: 700; line-height: 1; }
.gi-faq-courte details[open] summary::after { content: "−"; background: var(--orange-fonce); color: var(--blanc); }
.gi-faq-courte details[open] { border-color: var(--nuit); }
.gi-faq-courte details p { margin: 0; padding: 0 1.3rem 1.2rem; }
.gi-faq-courte summary:hover { background: var(--creme); border-radius: var(--arrondi); }

/* Ce que ce site ne fait pas */
.gi-engagements { text-align: center; }
.gi-engagements ul { list-style: none; padding: 0; margin: 1.4rem 0 1rem; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.gi-engagements li { border: 1px solid var(--bord); border-radius: var(--arrondi); padding: 1.3rem 1rem; background: var(--blanc); }
.gi-engagements strong { display: block; color: var(--nuit); font-size: 1.05rem; }
.gi-engagements strong::before { content: "✓"; display: block; margin: 0 auto .5rem; width: 2.2rem; height: 2.2rem; border-radius: 50%; background: var(--vert); color: var(--blanc); line-height: 2.2rem; font-weight: 800; }
.gi-engagements span { color: var(--gris); font-size: .93rem; }

/* Appel final : deux boutons centrés */
.gi-actions-centre { justify-content: center; }

/* Pied de page en colonnes */
.gm-pied-colonnes { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 2rem; padding-bottom: 1.8rem; border-bottom: 1px solid rgba(255,255,255,.12); }
.gm-pied-colonnes ul { display: block; margin: 0; }
.gm-pied-colonnes li { margin: 0 0 .15rem; }
.gm-pied-colonnes a { text-decoration: none; }
.gm-pied-colonnes a:hover { text-decoration: underline; }
.gm-pied-nom { font-size: 1.3rem; font-weight: 800; color: var(--blanc); margin: 0 0 .5rem !important; }
.gm-pied-titre { color: var(--orange-clair); font-weight: 700; margin: 0 0 .6rem !important; }
.gm-pied-marque p { max-width: 24rem; }
.gm-pied-fr { color: var(--orange-clair) !important; }
.gm-pied-bas { padding-top: 1.2rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: .4rem 2rem; font-size: .92rem; }

@media (max-width: 960px) {
  .gi-cartes-risques, .gi-exemple-rapport { grid-template-columns: 1fr; }
  .gi-exemple-rapport { padding: 1.8rem; }
  .gi-engagements ul { grid-template-columns: 1fr 1fr; }
  .gm-pied-colonnes { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .gi-engagements ul, .gm-pied-colonnes { grid-template-columns: 1fr; }
  .gi-exemple-rapport { padding: 1.4rem; margin-left: calc(-1 * var(--marge) + .5rem); margin-right: calc(-1 * var(--marge) + .5rem); }
}

/* ===== v3 : pages intérieures — bandeau de titre bleu nuit + largeur de lecture ===== */
.gm-contenu:has(.com-content-article__body > h1:first-child), .gm-contenu:has(.com-contact > h1:first-child) { padding-top: 0; }
.com-content-article__body > h1:first-child, .com-contact > h1:first-child {
  margin: 0 calc(50% - 50vw) 0; padding: 3.2rem max(var(--marge), calc((100vw - var(--largeur)) / 2)) 0;
  background: radial-gradient(ellipse at 85% 0%, var(--nuit-2), var(--nuit) 65%); color: var(--blanc); }
.com-content-article__body > h1:first-child + .gi-chapeau {
  margin: 0 calc(50% - 50vw) 2.8rem; padding: .9rem max(var(--marge), calc((100vw - var(--largeur)) / 2)) 3rem;
  background: radial-gradient(ellipse at 85% -40%, var(--nuit-2), var(--nuit) 65%); color: var(--sur-nuit); max-width: none; }
.com-content-article__body > h1:first-child:not(:has(+ .gi-chapeau)), .com-contact > h1:first-child { padding-bottom: 2.6rem; margin-bottom: 2.6rem; }
/* texte courant : lignes de lecture confortables, les grilles et tableaux gardent toute la largeur */
.com-content-article__body > p, .com-content-article__body > h2, .com-content-article__body > h3,
.com-content-article__body > .gi-liste, .com-content-article__body > .gi-etiquettes, .com-content-article__body > .gi-note { max-width: 52rem; }
.com-content-article__body > .gi-prix-bloc, .com-content-article__body > .gi-rapport { max-width: 52rem; }
.com-content-article__body > .gi-tableau { max-width: 60rem; }

/* ===== v3 : canaux de contact (LINE, Zalo, WhatsApp) — QR sur ordinateur, gros boutons sur téléphone ===== */
.gi-canaux { list-style: none; padding: 0; margin: 1.2rem 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 9.5rem)); gap: 1rem; }
.gi-canaux a { display: flex; flex-direction: column; align-items: center; gap: .3rem; padding: .9rem .7rem 1rem; border-radius: var(--arrondi); background: var(--blanc); color: var(--nuit); text-decoration: none; text-align: center; border: 2px solid transparent; }
.gi-canaux img { width: 7rem; height: 7rem; image-rendering: pixelated; }
.gi-canal-nom { font-weight: 800; font-size: 1.05rem; }
.gi-canal-aide { font-size: .82rem; color: var(--gris); }
.gi-canaux a:hover, .gi-canaux a:focus-visible { border-color: var(--orange); }
.gi-monde .gi-canaux a { color: var(--nuit); }
.contact-miscinfo .gi-canaux a, .com-contact__miscinfo .gi-canaux a { border-color: var(--bord); }
.gi-canaux-titre { font-size: 1.25rem; margin-top: 1.6rem; }
@media (max-width: 640px) {
  .gi-canaux { grid-template-columns: 1fr; }
  .gi-canaux img { display: none; }
  .gi-canaux a { flex-direction: row; justify-content: space-between; padding: .9rem 1.1rem; min-height: 52px; }
}

/* ===== v3 : exemples de sites + 4e canal + bulle de contact ===== */
.gi-grille-exemples { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem; }
.gi-grille-exemples a { display: block; text-decoration: none; color: var(--nuit); font-weight: 700; }
.gi-grille-exemples img { width: 100%; height: auto; border-radius: var(--arrondi); border: 1px solid var(--bord); box-shadow: 0 6px 18px rgba(31,42,90,.10); display: block; margin-bottom: .6rem; }
.gi-grille-exemples a:hover span, .gi-grille-exemples a:focus-visible span { text-decoration: underline; }
@media (prefers-reduced-motion: no-preference) {
  .gi-grille-exemples img { transition: transform .25s ease, box-shadow .25s ease; }
  .gi-grille-exemples a:hover img, .gi-grille-exemples a:focus-visible img { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(31,42,90,.18); }
}
.gi-canaux { grid-template-columns: repeat(4, minmax(0, 9.5rem)); }
.gm-bulle { position: fixed; right: 1.1rem; bottom: 1.1rem; z-index: 60; background: var(--orange-fonce); color: var(--blanc); font-weight: 800; text-decoration: none;
  padding: .85rem 1.25rem .85rem 1.05rem; border-radius: 999px; box-shadow: 0 10px 26px rgba(10,16,40,.30); display: inline-flex; align-items: center; gap: .5rem; min-height: 48px; }
.gm-bulle::before { content: ""; width: 1.25rem; height: 1.25rem; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v11H9l-5 4z'/%3E%3C/svg%3E"); }
.gm-bulle:hover, .gm-bulle:focus-visible { background: var(--nuit); color: var(--blanc); }
.gm-pied { padding-bottom: 5rem; }
@media (max-width: 960px) { .gi-grille-exemples { grid-template-columns: 1fr 1fr; } .gi-canaux { grid-template-columns: repeat(2, minmax(0, 9.5rem)); } }
@media (max-width: 640px) { .gi-canaux { grid-template-columns: 1fr; } .gm-bulle { right: .8rem; bottom: .8rem; } }
@media print { .gm-bulle { display: none; } }

/* ===== Écouter + Affichage (aide.js) ===== */
.gm-entete { grid-template-areas: "logo langues" "nav outils"; }
.gm-outils { grid-area: outils; justify-self: end; align-self: center; position: relative; display: flex; gap: .5rem; }
.gm-outils[hidden], .gm-btn-outil[hidden] { display: none; }
.gm-btn-outil { display: inline-flex; align-items: center; gap: .4rem; min-height: 40px; padding: .35rem .9rem; border-radius: 2rem; cursor: pointer;
  background: transparent; color: var(--blanc); border: 1px solid rgba(255,255,255,.45); font: inherit; font-size: .92rem; font-weight: 600; }
.gm-btn-outil:hover, .gm-btn-outil[aria-expanded="true"], .gm-btn-outil[aria-pressed="true"] { background: var(--blanc); color: var(--nuit); border-color: var(--blanc); }
.gm-panneau { position: absolute; right: 0; top: calc(100% + .5rem); z-index: 70; width: min(20rem, calc(100vw - 2rem)); background: var(--blanc); color: var(--texte);
  border-radius: var(--arrondi); box-shadow: 0 18px 40px rgba(10,16,40,.35); padding: 1rem; display: grid; gap: .5rem; }
.gm-panneau[hidden] { display: none; }
.gm-panneau-titre { margin: 0 0 .2rem; font-weight: 800; color: var(--nuit); }
.gm-panneau button { text-align: left; min-height: 44px; padding: .5rem .8rem .5rem 2.6rem; border: 1px solid var(--bord); border-radius: .6rem; background: var(--blanc);
  color: var(--texte); font: inherit; cursor: pointer; position: relative; }
.gm-panneau button[data-option]::before { content: ""; position: absolute; left: .8rem; top: 50%; width: 1.1rem; height: 1.1rem; transform: translateY(-50%);
  border: 2px solid var(--gris); border-radius: .3rem; }
.gm-panneau button[aria-pressed="true"] { border-color: var(--nuit); background: var(--creme); font-weight: 700; }
.gm-panneau button[aria-pressed="true"]::before { background: var(--nuit) no-repeat center / 80% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3 8 3 3 7-7' fill='none' stroke='white' stroke-width='2.5'/%3E%3C/svg%3E"); border-color: var(--nuit); }
.gm-panneau .gm-raz { padding-left: .8rem; color: var(--orange-fonce); font-weight: 700; }
.gm-vitesse { display: flex; justify-content: space-between; align-items: center; gap: .5rem; font-size: .95rem; }
.gm-vitesse select { min-height: 40px; font: inherit; padding: .2rem .4rem; border-radius: .4rem; border: 1px solid var(--bord); }
.gm-panneau-note { margin: 0; font-size: .82rem; color: var(--gris); }
.gm-annonce { position: absolute; right: 0; top: calc(100% + .5rem); margin: 0; max-width: 20rem; background: var(--blanc); color: var(--texte); border-radius: .6rem; font-size: .9rem; z-index: 70; }
.gm-annonce:not(:empty) { padding: .7rem .9rem; box-shadow: 0 10px 26px rgba(10,16,40,.3); }
.gm-lu { outline: 3px solid var(--orange); outline-offset: 4px; border-radius: .2rem; background: rgba(232,119,46,.08); }
/* réglages choisis */
html.gm-grand { font-size: 118%; }
html.gm-espace body { line-height: 1.85; letter-spacing: .03em; word-spacing: .12em; }
html.gm-espace p, html.gm-espace li { max-width: 62ch; }
html.gm-calme *, html.gm-calme *::before, html.gm-calme *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
html.gm-contraste { --gris: #2c3148; --texte: #000; --bord: #000; --creme: #fff; --orange-fonce: #8a3a06; --sur-nuit: #fff; }
html.gm-contraste body { background: #fff; color: #000; }
html.gm-contraste a:not(.gi-bouton):not(.gm-bulle) { text-decoration: underline !important; text-underline-offset: 3px; }
html.gm-contraste .gm-entete, html.gm-contraste .gm-pied, html.gm-contraste .gi-tete, html.gm-contraste .gi-monde { background: #000 !important; }
html.gm-contraste .gi-grille-prix li, html.gm-contraste .gi-cartes-risques li, html.gm-contraste .gi-etapes li, html.gm-contraste .gi-faq-courte details { border: 2px solid #000; }
html.gm-contraste :focus-visible { outline: 4px solid #000 !important; outline-offset: 3px; box-shadow: 0 0 0 7px #ffd400; }
@media (max-width: 960px) {
  .gm-entete { grid-template-areas: "logo" "langues" "nav" "outils"; }
  .gm-outils { justify-self: start; padding-bottom: .7rem; }
  .gm-panneau, .gm-annonce { left: 0; right: auto; }
}
@media print { .gm-outils { display: none !important; } }

/* Listes de dates (guides) : puces neutres, pas de coche verte (une date de fin n'est pas une bonne nouvelle) */
.gi-dates { padding-left: 1.3rem; margin: 0 0 1rem; }
.gi-dates li { margin: 0 0 .5rem; padding-left: .3rem; }
.gi-dates li::marker { color: var(--orange-fonce); }

/* 04/11/2026 — page Examples : les 4 sites modèles (capture qui s'agrandit au clic, bouton vers le modèle dans la même langue) */
.gm-ex-fictif { border-left: 4px solid #f39a5b; padding: .6rem 1rem; background: #fff7f0; border-radius: .4rem; }
.gm-ex-grille { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; margin: 1.5rem 0 2.5rem; }
@media (max-width: 760px) { .gm-ex-grille { grid-template-columns: 1fr; } }
.gm-ex-carte { border: 1px solid #dfe5ec; border-top: 6px solid var(--nuit, #12355b); border-radius: .8rem; overflow: hidden; background: #fff; display: flex; flex-direction: column; }
.gm-ex-modele { border-top-color: #6b4423; } .gm-ex-batiment { border-top-color: #34495e; } .gm-ex-restaurant { border-top-color: #6d2232; } .gm-ex-bien-etre { border-top-color: #2f4a3e; }
.gm-ex-corps { padding: 1rem 1.1rem 1.2rem; display: flex; flex-direction: column; gap: .4rem; flex: 1; }
.gm-ex-corps h2 { margin: .2rem 0 0; font-size: 1.3rem; }
.gm-ex-metier { font-weight: 600; margin: 0; }
.gm-ex-agrandir { display: block; position: relative; cursor: zoom-in; }
.gm-ex-agrandir img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: top; }
.gm-ex-agrandir::after { content: "🔍"; position: absolute; right: .6rem; bottom: .6rem; background: rgba(255,255,255,.92); border-radius: 50%; width: 2.6rem; height: 2.6rem; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; }
.gm-ex-agrandir:focus-visible, .gm-ex-bouton:focus-visible { outline: 3px solid #f39a5b; outline-offset: 3px; }
.gm-ex-bouton { display: inline-block; align-self: flex-start; margin-top: auto; min-height: 44px; line-height: 44px; padding: 0 1.2rem; border-radius: .5rem; background: var(--nuit, #12355b); color: #fff; font-weight: 700; text-decoration: none; }
.gm-ex-appel { margin: 2.5rem 0; padding: 1.5rem; border-radius: .8rem; background: #f3f6fa; }
.gm-loupe { width: min(96vw, 1400px); max-height: 94vh; padding: 0; border: 0; border-radius: .8rem; background: #0f2236; color: #fff; }
.gm-loupe::backdrop { background: rgba(5, 15, 30, .8); }
.gm-loupe-barre { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .6rem 1rem; }
.gm-loupe-titre { margin: 0; font-weight: 700; }
.gm-loupe-fermer { min-height: 44px; padding: 0 1rem; border-radius: .5rem; border: 2px solid #fff; background: transparent; color: #fff; font-weight: 700; cursor: pointer; }
.gm-loupe-vues { display: flex; gap: 1rem; align-items: flex-start; padding: 0 1rem 1rem; }
.gm-loupe-vues figure { margin: 0; }
.gm-loupe-ordi { flex: 3; } .gm-loupe-tel { flex: 1; max-width: 300px; }
.gm-loupe-vues img { display: block; width: 100%; height: auto; border-radius: .4rem; background: #fff; }
.gm-loupe-vues figcaption { font-size: .9rem; margin-top: .3rem; text-align: center; }
@media (max-width: 760px) { .gm-loupe-vues { flex-direction: column; align-items: center; } .gm-loupe-tel { max-width: 70%; } }