/* Pages des sociétés (EMC74, bâtiments collectifs, La Petite Pieuvriste) : éléments communs.
   Chargé après style.css ; chaque page ajoute sa propre feuille (emc74.css, collectif.css, lpp.css). */
:root {
  --cable: #182326;
  --coffret: #EEF1F2;
  --rail: #DDE3E5;
  --trait: #C8D1D4;
  --lumiere: #F7E2A0;
  --ambre: #D9A21B;
  --balcon: #C9683D;
  --kraft: #EEE5D6;
  --ease: cubic-bezier(.22, .8, .24, 1);
}

/* ---------- objets dessinés des métiers (ampoule, bouton KNX, robinet, pompe à chaleur, VMC, immeuble) ---------- */
.soc-ico { width: 48px; height: 48px; overflow: visible; flex: none; }
.soc-ico__t { fill: none; stroke: var(--cable); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.soc-ico__verre { fill: var(--surface); transition: fill .3s; }
.soc-ico__rayons { fill: none; stroke: var(--ambre); stroke-width: 2; stroke-linecap: round; opacity: 0; transition: opacity .3s; }
.soc-ico__led { fill: var(--trait); transition: fill .25s; }
.soc-ico__tuyau { stroke-width: 3.2; }
.soc-ico__goutte { fill: var(--accent); opacity: 0; }
.soc-ico__fin { stroke-width: 1.6; }
.soc-ico__helice { fill: var(--cable); transform-box: view-box; transform-origin: 18px 25.5px; }
.soc-ico__pales { transform-box: view-box; transform-origin: 24px 24px; }
.soc-ico__chaleur { fill: none; stroke: var(--balcon); stroke-width: 2; stroke-linecap: round; opacity: 0; transition: opacity .4s; }
.soc-ico__air { fill: none; stroke: var(--accent); stroke-width: 2; stroke-linecap: round; stroke-dasharray: 3 4; opacity: .35; transition: opacity .3s; }
.soc-ico__fen { fill: var(--surface); stroke: var(--cable); stroke-width: 1.4; transition: fill .3s; }
.soc-ico__fen:nth-of-type(3), .soc-ico__fen:nth-of-type(4) { transition-delay: .15s; } .soc-ico__fen:nth-of-type(1), .soc-ico__fen:nth-of-type(2) { transition-delay: .3s; }
/* état « en service » : onglet choisi, case cochée ou voyant du récapitulatif */
:is(.soc-allume, [aria-selected="true"], label:has(input:checked)) .soc-ico--ampoule { filter: drop-shadow(0 0 6px rgba(247, 226, 160, .95)); }
:is(.soc-allume, [aria-selected="true"], label:has(input:checked)) .soc-ico__verre { fill: var(--lumiere); }
:is(.soc-allume, [aria-selected="true"], label:has(input:checked)) :is(.soc-ico__rayons, .soc-ico__chaleur) { opacity: 1; }
:is(.soc-allume, [aria-selected="true"], label:has(input:checked)) .soc-ico__led { fill: var(--accent); }
:is(.soc-allume, [aria-selected="true"], label:has(input:checked)) .soc-ico__air { opacity: 1; }
:is(.soc-allume, [aria-selected="true"], label:has(input:checked)) .soc-ico__pales .soc-ico__t { stroke: var(--accent); }
:is(.soc-allume, [aria-selected="true"], label:has(input:checked)) .soc-ico__fen { fill: var(--lumiere); }
:is(.soc-allume, [aria-selected="true"], label:has(input:checked)) .soc-ico--immeuble { filter: drop-shadow(0 0 5px rgba(247, 226, 160, .9)); }
@media (prefers-reduced-motion: no-preference) {
  :is(.soc-allume, [aria-selected="true"], label:has(input:checked)) .soc-ico__goutte { animation: soc-goutte 1.4s ease-in infinite; }
  :is(.soc-allume, [aria-selected="true"], label:has(input:checked)) .soc-ico__helice { animation: soc-tourne 1s linear infinite; }
  :is(.soc-allume, [aria-selected="true"], label:has(input:checked)) .soc-ico__air { animation: soc-air .9s linear infinite; }
  :is(.soc-allume, [aria-selected="true"], label:has(input:checked)) .soc-ico__pales { animation: soc-tourne 1.6s linear infinite; }
}
@keyframes soc-goutte { 0% { opacity: 0; transform: translateY(-3px); } 20% { opacity: 1; } 75% { opacity: 1; transform: translateY(6px); } 100% { opacity: 0; transform: translateY(8px); } }
@keyframes soc-tourne { to { transform: rotate(360deg); } }
@keyframes soc-air { to { stroke-dashoffset: 14; } }

/* coordonnées à la place du formulaire de devis (devis masqué, voir DEVIS dans _gen/build.py) */
.soc-coord { align-self: start; padding: clamp(26px, 3.5vw, 40px); background: var(--surface); border: 1.5px solid var(--border); border-top: 3px solid var(--accent); }
.soc-coord__titre { margin: 0 0 10px; font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.soc-coord__tel { display: inline-block; margin-bottom: 18px; font-family: var(--font-title); font-size: clamp(2rem, 4vw, 2.8rem); line-height: 1.1; color: var(--primary); text-decoration: none; }
.soc-coord__tel:hover { color: var(--accent); }
.soc-coord__ligne { margin: 0; padding: 12px 0; border-top: 1px solid var(--border); overflow-wrap: anywhere; }
.soc-coord__ligne span { display: block; margin-bottom: 2px; font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }

/* ---------- formulaires intégrés ---------- */
.soc-form { gap: 20px; scroll-margin-top: calc(var(--header-h) + 20px); }
.soc-form fieldset { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: 16px; }
.soc-form legend { padding: 0; margin-bottom: 4px; font-family: var(--font-title); font-size: clamp(1.4rem, 2.4vw, 1.8rem); line-height: 1.2; color: var(--primary); }
.soc-aide { margin: -6px 0 0; font-size: .92rem; color: var(--muted); }
.soc-groupe { margin: 4px 0 -6px; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.soc-erreur { margin: 0; font-size: .9rem; color: var(--error); }
.soc-nav { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 6px; }
.soc-form .soc-nav .btn { width: auto; }
.soc-form .sas-choices--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.soc-form .sas-choice { min-height: 64px; justify-content: center; }
.soc-progression { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px; counter-reset: etape; }
.soc-progression li { flex: 1; padding-top: 10px; border-top: 3px solid var(--border); font-size: .8rem; color: var(--muted); counter-increment: etape; }
.soc-progression li::before { content: counter(etape) ". "; }
.soc-progression li.is-current { border-color: var(--accent); color: var(--primary); }
.soc-progression li.is-done { border-color: var(--primary); }
.js .soc-etape:not(.is-active) { display: none; }
.soc-form .form__status:empty { display: none; }

/* ---------- les autres sociétés du groupe ---------- */
.soc-groupe-band { background: var(--bg); }
.soc-groupe-band__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 3vw, 32px); }
.soc-groupe-band__grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.soc-lien { display: grid; grid-template-columns: 64px 1fr; gap: 18px; align-items: center; padding: 20px 0; border-top: 1px solid var(--border); text-decoration: none; color: var(--text); }
.soc-lien img { width: 64px; height: 52px; object-fit: contain; }
.soc-lien strong { display: block; font-family: var(--font-title); font-weight: 400; font-size: 1.2rem; color: var(--primary); }
.soc-lien span { font-size: .92rem; color: var(--muted); }
.soc-lien:hover strong { text-decoration: underline; text-underline-offset: 4px; }

@media (max-width: 900px) {
  .soc-groupe-band__grid { grid-template-columns: 1fr; gap: 0; }
  .soc-form .sas-choices, .soc-form .sas-choices--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 480px) {
  .soc-form .sas-choices--2 { grid-template-columns: 1fr; }
  .soc-progression li { font-size: .72rem; }
}