/* QUI SOMMES-NOUS — blocs propres à la page (24/10/2026). Trois grands portraits, chacun relié aux pôles qu'il porte :
   au survol, le portrait prend la lumière de ses pôles. Préfixe q-. */
.q-equipe{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,32px)}
.q-membre{display:flex;flex-direction:column;gap:6px}
.q-membre__photo{position:relative;margin:0 0 18px;aspect-ratio:412/436;border-radius:24px;overflow:hidden;background:#0C0D11;border:1px solid var(--w-filet)}
.q-membre__photo::after{content:"";position:absolute;inset:0;background:radial-gradient(80% 60% at 30% 100%,color-mix(in srgb,var(--c1) 55%,transparent),transparent 70%),radial-gradient(60% 50% at 90% 10%,color-mix(in srgb,var(--c2) 30%,transparent),transparent 70%);opacity:0;transition:opacity .7s var(--w-ease);mix-blend-mode:screen}
.q-membre__photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);transition:filter .8s var(--w-ease),transform 1.2s var(--w-ease)}
.q-membre:hover .q-membre__photo img{filter:grayscale(.2);transform:scale(1.03)}
.q-membre:hover .q-membre__photo::after{opacity:1}
.q-membre h3{margin:0;font-size:clamp(24px,2vw,32px);font-weight:600;letter-spacing:-.02em}
.q-membre__role{margin:0 0 8px;font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--c1)}
.q-membre > p:not(.q-membre__role){margin:0;max-width:40ch;font-size:16px;line-height:1.6;color:var(--w-gris)}
.q-membre__poles{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:16px 0 0;padding:0}
.q-membre__poles a{display:block;padding:7px 12px;border-radius:999px;border:1px solid var(--w-filet-fort);font-size:13px;color:var(--w-blanc);text-decoration:none;transition:border-color .3s,background .3s}
.q-membre__poles a:hover{border-color:var(--c1);background:color-mix(in srgb,var(--c1) 16%,transparent)}
@media (max-width:1000px){.q-equipe{grid-template-columns:1fr}.q-membre__photo{max-width:420px}}
/* 24/10 (Raphaël : « horrible ») : portraits beaucoup plus petits, sans cadre carré autour du rond ;
   chaque membre devient une colonne sobre, séparée par un filet, la couleur de ses pôles en liseré au survol. */
.q-equipe{border-top:1px solid var(--w-filet);gap:0}
.q-membre{padding:32px clamp(20px,2.4vw,40px) 8px 0}
.q-membre + .q-membre{padding-left:clamp(20px,2.4vw,40px);border-left:1px solid var(--w-filet)}
.q-membre__photo{width:112px;height:112px;aspect-ratio:auto;margin:0 0 22px;border:0;border-radius:50%;background:none;box-shadow:0 0 0 1px var(--w-filet-fort);transition:box-shadow .5s}
.q-membre__photo::after{border-radius:50%}
.q-membre:hover .q-membre__photo{box-shadow:0 0 0 2px var(--c1),0 0 40px -8px var(--c1)}
.q-membre:hover .q-membre__photo img{transform:none}
.q-membre h3{font-size:clamp(22px,1.7vw,28px)}
@media (max-width:1000px){.q-membre + .q-membre{padding-left:0;border-left:0;border-top:1px solid var(--w-filet)}}

/* ---------- Manifeste : quatre principes, le mot se remplit de métal quand il passe au milieu de l'écran ---------- */
.q-principes{list-style:none;margin:0;padding:0;border-top:1px solid var(--w-filet)}
.q-principes li{display:grid;grid-template-columns:60px minmax(0,7fr) minmax(0,4fr);gap:clamp(16px,2vw,40px);align-items:center;padding:clamp(20px,2.6vw,36px) 0;border-bottom:1px solid var(--w-filet)}
.q-principes__num{font-size:13px;font-weight:600;letter-spacing:.1em;color:var(--w-gris-doux)}
.q-principes__mot{font-size:clamp(48px,7vw,128px);font-weight:600;letter-spacing:-.05em;line-height:.95;color:transparent;-webkit-text-stroke:1px rgba(220,229,242,.32);
  background:linear-gradient(172deg,#FFFFFF 0%,#E9EEF6 30%,#8C97AA 46%,#3B4252 50%,#B9C4D6 56%,#F7FAFF 72%,#9AA6BA 100%) 0 0/0% 100% no-repeat;-webkit-background-clip:text;background-clip:text;
  transition:background-size 1.4s cubic-bezier(.22,1,.36,1),-webkit-text-stroke-color .8s}
.q-principes li.est-plein .q-principes__mot{background-size:100% 100%;-webkit-text-stroke-color:transparent}
.q-principes p{margin:0;max-width:36ch;font-size:clamp(16px,1.25vw,19px);line-height:1.55;color:var(--w-gris);opacity:.35;transition:opacity .8s}
.q-principes li.est-plein p{opacity:1}
/* ---------- Notre atelier à Poitiers ---------- */
.q-atelier__grille{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,120px);align-items:center}
.q-atelier__texte{margin:0 0 32px;max-width:40ch;font-size:clamp(18px,1.4vw,22px);line-height:1.6;color:var(--w-gris)}
.q-atelier__actions{display:flex;flex-wrap:wrap;gap:12px}
.q-adresse{position:relative;padding:clamp(32px,4vw,64px);border-radius:28px;border:1px solid var(--w-filet-fort);overflow:hidden;
  background:radial-gradient(70% 80% at 80% 20%,rgba(220,229,242,.12),transparent 60%),repeating-linear-gradient(0deg,transparent 0 47px,rgba(220,229,242,.05) 47px 48px),repeating-linear-gradient(90deg,transparent 0 47px,rgba(220,229,242,.05) 47px 48px),#0B0C10}
.q-adresse__bille{position:absolute;right:16%;top:22%;width:64px;height:64px;border-radius:50%;background:radial-gradient(circle at 34% 28%,#fff,#DCE5F2 30%,#6E7A8F 65%,#1B1F28);box-shadow:0 18px 40px -10px rgba(0,0,0,.9),0 0 60px -10px rgba(220,229,242,.5);animation:q-pose 3.6s ease-in-out infinite}
.q-adresse__bille::after{content:"";position:absolute;left:50%;top:115%;width:90px;height:14px;border-radius:50%;translate:-50% 0;background:radial-gradient(rgba(0,0,0,.6),transparent 70%)}
@keyframes q-pose{50%{transform:translateY(-10px)}}
.q-adresse__rue{margin:0;font-size:clamp(32px,3.2vw,56px);font-weight:600;letter-spacing:-.035em;line-height:1.05;color:#F7FAFF}
.q-adresse__ville{margin:14px 0 28px;font-size:14px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--w-gris)}
.q-adresse__contact{display:flex;flex-wrap:wrap;gap:8px 28px;margin:0}
.q-adresse__contact a{font-size:17px;color:#F7FAFF;text-decoration:none}
.q-adresse__contact a:hover{text-decoration:underline;text-underline-offset:4px}
@media (max-width:1000px){.q-atelier__grille{grid-template-columns:1fr}.q-principes li{grid-template-columns:40px 1fr}.q-principes p{grid-column:2}}
@media (prefers-reduced-motion:reduce){.q-adresse__bille{animation:none}}

/* ---------- 25/10 : « Basés à Poitiers » — un plan sombre à la place de la carte d'adresse.
   Les rues argent se tracent au défilement ; l'avenue de la Libération en chrome ; une goutte de mercure se pose
   sur l'agence et envoie des ondes ; l'adresse se lit en bas du plan. ---------- */
.q-plan{position:relative;margin:0;aspect-ratio:16/11;max-width:100%;border-radius:28px;overflow:hidden;border:1px solid var(--w-filet-fort);
  background:radial-gradient(60% 60% at 58% 52%,rgba(220,229,242,.09),transparent 70%),#0A0B0E;box-shadow:0 50px 100px -50px rgba(0,0,0,.95)}
.q-plan__rues{position:absolute;inset:0;width:100%;height:100%}
.q-plan__rues path{fill:none;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.2s var(--w-ease)}
.q-plan__petites path{stroke:rgba(220,229,242,.16);stroke-width:1.4}
.q-plan__riviere{stroke:rgba(169,196,255,.22);stroke-width:14}
.q-plan__avenue{stroke:#DCE5F2;stroke-width:3;filter:drop-shadow(0 0 8px rgba(220,229,242,.45))}
.q-plan__nom{font:600 12px/1 "Plus Jakarta Sans",system-ui,sans-serif;letter-spacing:.32em;fill:rgba(220,229,242,.6);opacity:0;transition:opacity 1s 1.6s}
.q-plan.est-vu .q-plan__rues path{stroke-dashoffset:0}
.q-plan.est-vu .q-plan__petites path:nth-child(2n){transition-delay:.25s}
.q-plan.est-vu .q-plan__avenue{transition-delay:.5s}
.q-plan.est-vu .q-plan__nom{opacity:1}
/* La goutte : posée sur l'avenue (52 % / 58 % du plan), elle tombe puis ondule */
.q-plan__goutte{position:absolute;left:52.5%;top:57.5%;width:0;height:0}
.q-plan__goutte::before{content:"";position:absolute;left:-17px;top:-17px;width:34px;height:34px;border-radius:50%;
  background:radial-gradient(circle at 34% 28%,#fff,#DCE5F2 30%,#6E7A8F 65%,#1B1F28);box-shadow:0 12px 26px -8px rgba(0,0,0,.95),0 0 40px -6px rgba(220,229,242,.6);
  opacity:0;transform:translateY(-120px) scale(.7);transition:opacity .3s 1.4s,transform .9s cubic-bezier(.3,1.5,.5,1) 1.4s}
.q-plan.est-vu .q-plan__goutte::before{opacity:1;transform:none}
.q-plan__goutte i{position:absolute;left:-17px;top:-17px;width:34px;height:34px;border-radius:50%;border:1px solid rgba(220,229,242,.55);opacity:0}
.q-plan.est-vu .q-plan__goutte i{animation:q-onde 3.6s cubic-bezier(.2,.6,.3,1) 2.2s infinite}
.q-plan.est-vu .q-plan__goutte i:nth-child(2){animation-delay:3.4s}.q-plan.est-vu .q-plan__goutte i:nth-child(3){animation-delay:4.6s}
@keyframes q-onde{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(6)}}
.q-plan__adresse{position:absolute;left:0;right:0;bottom:0;padding:clamp(22px,2.6vw,40px);background:linear-gradient(0deg,rgba(10,11,14,.96) 30%,rgba(10,11,14,0))}
.q-plan .q-adresse__rue{font-size:clamp(24px,2.2vw,38px)}
.q-plan .q-adresse__ville{margin:8px 0 16px}
@media (prefers-reduced-motion:reduce){.q-plan__rues path{transition:none;stroke-dashoffset:0}.q-plan__nom{opacity:1}.q-plan__goutte::before{opacity:1;transform:none;transition:none}.q-plan__goutte i{display:none}}
