/* Accueil d'entreprise — mise en page B (choix de JF, 2026-10-06) : tout tient dans le premier
   écran, le titre à gauche, les deux divisions à droite en blocs cliquables, Télécom devant.
   Aplats seulement : aucun dégradé, aucune animation au défilement, aucune grille de cartes à icônes.
   L'accent de division (cuivre Télécom, marine Cadence) ne sert qu'aux filets et aux soulignés. */
.b{padding:72px 0 64px;border-top:6px solid #12314e}
.b-grid{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:start}
.b-k{font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.b h1{font-size:clamp(32px,4.2vw,50px);line-height:1.08;color:#12314e;font-weight:800;margin-top:14px}
.b-lead{margin-top:18px;font-size:19px;color:var(--muted)}
.b-divs{display:grid;gap:20px}
.b-div{display:block;background:#fff;border:1px solid var(--line);border-left:5px solid var(--acc);border-radius:4px;padding:26px 28px}
.b-div:hover{border-color:var(--acc)}
.b-div:focus-visible{outline-offset:3px}
.b-tel{--acc:#b5633f;padding:32px 30px}
.b-cad{--acc:#12314e}
.b-dev{--acc:#1f9e8d}   /* sarcelle : l'accent de la division DEV */
.b-name{display:flex;align-items:center;gap:10px;font-size:24px;font-weight:800;color:#12314e;letter-spacing:-.01em}
.b-name small{font-size:13px;font-weight:600;color:var(--muted);letter-spacing:0;align-self:flex-end;margin-bottom:4px}
.b-tel .b-name{font-size:28px}
.b-ico{width:30px;height:30px;flex:none}
.b-tel .b-ico{width:34px;height:34px}
.b-div p{margin:12px 0 16px;color:var(--ink)}
.b-cad p,.b-dev p{color:var(--muted);font-size:15px}
.b-go{font-weight:700;color:#12314e;text-decoration:underline;text-decoration-color:var(--acc);text-decoration-thickness:3px;text-underline-offset:7px}
.b-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:0 32px;margin-top:56px}
.b-strip div{border-top:1px solid #cfdce7;padding-top:14px}
.b-strip dt{color:#12314e;font-weight:700;font-size:15px}
.b-strip dd{color:var(--muted);font-size:14px}
.b-contact{border-top:1px solid var(--line);padding:48px 0}
.b-contact-in{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px 56px}
.b-contact h2{font-size:24px;color:#12314e;font-weight:800;margin-right:24px}
.b-contact span{display:block;font-size:13px;color:var(--muted);font-weight:600}
.b-contact a{display:inline-flex;min-height:44px;align-items:center;font-size:19px;font-weight:700;color:#12314e;
  text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
.b-contact a.t{text-decoration-color:#b5633f}
.b-contact a.d{text-decoration-color:#1f9e8d}
@media(max-width:860px){
  .b{padding:44px 0 40px}
  .b-grid{grid-template-columns:1fr;gap:32px}
  .b-div,.b-tel{padding:22px 20px}
  .b-strip{grid-template-columns:1fr 1fr;gap:18px 24px;margin-top:40px}
}

/* « Qui sommes-nous » (2026-10-21) : un nom, un visage, un numéro d'entreprise. Le cadre
   garde sa place et son fond si la photo manque. */
.q{border-top:1px solid var(--line);padding:56px 0;background:#fff;scroll-margin-top:64px}
.q-in{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:start}
.q h2{font-size:clamp(26px,3vw,34px);line-height:1.1;color:#12314e;font-weight:800}
.q-photo{position:relative;width:144px;height:144px;margin:22px 0 0;background:#D5E8F0;border-radius:12px;overflow:hidden}
.q-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;color:transparent;font-size:0}
.q-photo img::after{content:'JF';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#D5E8F0;font-size:46px;font-weight:800;letter-spacing:-.02em;color:rgba(18,49,78,.55)}
.q-nom{margin-top:14px;font-size:19px;font-weight:800;color:#12314e}
.q-nom small{display:block;font-size:14px;font-weight:600;color:var(--muted)}
.q p{color:var(--ink);max-width:36em}
.q p+p{margin-top:14px}
.q-coord{margin-top:26px;border-top:2px solid #12314e;padding-top:18px;display:grid;grid-template-columns:max-content 1fr;gap:10px 24px;max-width:36em}
.q-coord dt{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding-top:3px}
.q-coord dd{color:var(--ink)}
.q-coord a{font-weight:700;color:#12314e;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
@media(max-width:860px){
  .q{padding:40px 0}
  .q-in{grid-template-columns:1fr;gap:26px}
  .q-coord{grid-template-columns:1fr;gap:2px}
  .q-coord dd{margin-bottom:12px}
}