/* The Home's blocks taken from the other pages (Iulian, 2026-11-01): the trade cards and the works gallery lead to
   their pages; the intervention zone (the flat map, the 14 towns) and the frequent questions, before the form.
   The Home's own scale (--k), fonts and colours; phone first, the computer from 1100px as in styles.css. */

/* The footer opens on the colour of what is above it: on the Home, the white of the contact cards (on the other
   pages, their closing navy band). */
body:has(#accueil){--subsol-sus:#fff}

/* ---- The trade cards and the works gallery: the whole card is the link ---- */
.ac-lien{color:inherit;text-decoration:none}
.ac-lien::after{content:"";position:absolute;inset:0;z-index:2}
.metiers .card:hover .ac-lien,.ac-lien:focus-visible{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}
.ac-lien:focus-visible{outline:none}
.metiers .card:has(.ac-lien:focus-visible){outline:2px solid var(--blue);outline-offset:3px}
.ac-tuile{position:absolute;inset:0;z-index:3}
.ac-tuile:focus-visible{outline:3px solid #fff;outline-offset:-6px}
.s04-foot .ac-voir{display:inline-flex;margin:calc(14 * var(--k)) 0 calc(6 * var(--k));color:var(--blue)}

/* ---- The intervention zone: navy, the Zone page's words, the towns to their pages, the map ---- */
#apropos .s06-val{fill:#183567}
.ac-zone{background:#183567;color:#fff}
.ac-zone__in{display:grid;gap:calc(34 * var(--k));padding:calc(54 * var(--k)) calc(20 * var(--k)) calc(78 * var(--k))}
.ac-zone .display{margin:0;color:#fff}
.ac-zone .display span{display:block;color:#adc8f6}
.ac-zone__txt p{max-width:34em;margin:calc(18 * var(--k)) 0 0;font-size:max(15px, calc(15 * var(--k)));line-height:1.6;color:rgba(255,255,255,.86)}
.ac-villes{display:flex;flex-wrap:wrap;gap:calc(8 * var(--k));margin:calc(24 * var(--k)) 0 calc(28 * var(--k));padding:0;list-style:none}
.ac-villes a{display:inline-flex;align-items:center;min-height:38px;padding:0 calc(15 * var(--k));border-radius:999px;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(173,200,246,.45);color:#fff;font-size:max(13px, calc(13 * var(--k)));font-weight:700;text-decoration:none;transition:background-color .2s ease,color .2s ease}
.ac-villes a:hover,.ac-villes a:focus-visible{background:#fff;color:#183567}
.ac-zone .linkline{color:#fff}
.ac-carte{position:relative;padding:calc(14 * var(--k));border-radius:calc(22 * var(--k));background:#fff;box-shadow:0 calc(26 * var(--k)) calc(50 * var(--k)) calc(-26 * var(--k)) rgba(0,0,0,.55)}
.ac-carte__m{position:relative}
.ac-carte img{display:block;width:100%;height:auto}
.ac-v{position:absolute;padding:3px 8px;border-radius:999px;background:#fff;box-shadow:0 1px 4px rgba(4,17,33,.25);transform:translate(calc(12 * var(--k)),-50%);font:700 max(10px, calc(11 * var(--k)))/1 var(--f-texte);color:#183567;white-space:nowrap;pointer-events:none}
.ac-v--sa{transform:translate(calc(-100% - 14 * var(--k)),-50%)}
.ac-v--metz{padding:4px 9px;background:#183567;color:#fff;box-shadow:0 0 0 2px #fff;transform:translate(calc(20 * var(--k)),-50%)}
/* the landmarks at their pins (% of the drawing) */
.ac-v--metz{left:61.2%;top:39%}
.ac-v--th{left:61.5%;top:25.7%}.ac-v--lo{left:34.5%;top:22.1%}.ac-v--ve{left:17.2%;top:51.6%}.ac-v--na{left:41.9%;top:67.4%}.ac-v--sa{left:92.4%;top:53.2%}

/* ---- The frequent questions: pale, five of the FAQ page's, the others on it ---- */
.ac-faq{position:relative;background:var(--pale, #eef2f8)}
.ac-val-sus{position:absolute;z-index:3;left:0;top:-1px;width:100%;height:calc(30 * var(--k));fill:#183567;pointer-events:none}
.ac-val-jos{position:absolute;z-index:3;left:0;bottom:-2px;width:100%;height:calc(30 * var(--k));fill:#2c52a0;pointer-events:none}
.ac-faq__in{display:grid;gap:calc(28 * var(--k));padding:calc(84 * var(--k)) calc(20 * var(--k)) calc(92 * var(--k))}
.ac-faq .display{margin:0;color:var(--ink)}
.ac-faq .display span{display:block;color:var(--blue)}
.ac-faq .linkline{margin-top:calc(22 * var(--k));color:var(--blue)}
.ac-faq__liste{display:grid;gap:calc(10 * var(--k))}
.ac-q{border-radius:calc(16 * var(--k));background:#fff;box-shadow:0 calc(10 * var(--k)) calc(26 * var(--k)) rgba(19,34,59,.08)}
.ac-q summary{display:flex;align-items:center;justify-content:space-between;gap:calc(16 * var(--k));padding:calc(18 * var(--k)) calc(20 * var(--k));font:600 max(16px, calc(17 * var(--k)))/1.3 var(--f-titre);color:var(--ink);cursor:pointer;list-style:none}
.ac-q summary::-webkit-details-marker{display:none}
.ac-q summary b{flex:none;position:relative;width:calc(28 * var(--k));height:calc(28 * var(--k));min-width:24px;min-height:24px;border-radius:50%;background:var(--pale, #eef2f8)}
.ac-q summary b::before,.ac-q summary b::after{content:"";position:absolute;left:50%;top:50%;width:40%;height:2px;margin:-1px 0 0 -20%;border-radius:1px;background:var(--blue);transition:transform .2s ease}
.ac-q summary b::after{transform:rotate(90deg)}
.ac-q[open] summary b::after{transform:rotate(0)}
.ac-q p{margin:0;padding:0 calc(20 * var(--k)) calc(20 * var(--k));font-size:max(15px, calc(15 * var(--k)));line-height:1.6;color:var(--muted)}

@media (min-width:1100px){
  .s04-foot .ac-voir{margin:0 calc(36 * var(--k)) 0 auto}
  .ac-zone__in{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:center;gap:calc(70 * var(--k));padding:calc(96 * var(--k)) calc(74 * var(--k)) calc(110 * var(--k))}
  .ac-zone__txt p{font-size:calc(17 * var(--k))}
  .ac-villes{gap:calc(10 * var(--k))}
  .ac-villes a{min-height:calc(40 * var(--k));padding:0 calc(17 * var(--k));font-size:calc(14 * var(--k))}
  .ac-carte{padding:calc(20 * var(--k));border-radius:calc(28 * var(--k))}
  .ac-v{font-size:calc(13 * var(--k))}
  .ac-val-sus,.ac-val-jos{height:calc(60 * var(--k))}
  .ac-faq__in{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:start;gap:calc(80 * var(--k));padding:calc(140 * var(--k)) calc(74 * var(--k)) calc(150 * var(--k))}
  .ac-q summary{padding:calc(22 * var(--k)) calc(26 * var(--k));font-size:calc(19 * var(--k))}
  .ac-q p{padding:0 calc(26 * var(--k)) calc(24 * var(--k));font-size:calc(16 * var(--k))}
}
@media (prefers-reduced-motion:reduce){.ac-villes a,.ac-q summary b::before,.ac-q summary b::after{transition:none}}