/* WebWakanda : feuille de style du thème. Design identique au site validé. */

/* Concept : la page se lève comme un soleil. Un logo qui lève les bras ouvre le site, le slogan se tape en braise, les soleils levants relient presque toutes les sections (48 px, toujours la même taille), l'Afrique brille sur des globes qui tournent au défilement. Offres en fin de page. Univers fixe nuit profonde, conforme à la charte 1.0. */
:root {
  --nuit: #0B0F1A;
  --nuit-douce: #151B2B;
  --creme: #FFF4E0;
  --or: #F5A524;
  --braise: #E4572E;
  --brume: #9AA0AE;
  --trait: rgba(255, 244, 224, 0.14);
  --trait-nuit: rgba(11, 15, 26, 0.22);
  --f-titre: 'Unbounded', 'Arial Black', system-ui, sans-serif;
  --f-texte: 'Space Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --gut-l: max(16px, env(safe-area-inset-left, 0px));
  --gut-r: max(16px, env(safe-area-inset-right, 0px));
  --rayon: 20px;
  color-scheme: dark;
}

/* ===== Couche de neutralisation d'Elementor : le design reste celui du site validé ===== */
.ww {
  --container-default-padding-top: 0px;
  --container-default-padding-right: 0px;
  --container-default-padding-bottom: 0px;
  --container-default-padding-left: 0px;
  --widgets-spacing: 0px;
  --widgets-spacing-row: 0px;
  --widgets-spacing-column: 0px;
  --kit-widget-spacing: 0px;
}
.ww .e-con {
  --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px;
  --gap: 0px; --row-gap: 0px; --column-gap: 0px;
  --width: auto; --container-widget-width: auto; --container-widget-flex-grow: 0;
  padding-top: var(--padding-top); padding-right: var(--padding-right);
  padding-bottom: var(--padding-bottom); padding-left: var(--padding-left);
  gap: var(--row-gap) var(--column-gap);
  width: var(--width);
  max-width: none;
  min-width: 0;
}
.ww .elementor-widget:not(:last-child) { margin-block-end: 0; margin-bottom: 0; }
.ww .e-con > .elementor-widget { width: auto; }
.ww .elementor-widget-heading .elementor-heading-title,
.ww .elementor-widget-heading .elementor-heading-title a {
  font: inherit; color: inherit; letter-spacing: inherit; text-transform: inherit;
  text-decoration: inherit; text-wrap: inherit; margin: 0; padding: 0; line-height: inherit;
}
.ww .elementor-widget-text-editor {
  color: inherit; font-family: inherit; font-size: inherit; font-weight: inherit;
  line-height: inherit; letter-spacing: inherit; text-align: inherit;
}
.ww .elementor-widget-text-editor p { margin: 0; }
.ww .elementor-widget-text-editor p + p { margin-top: 0.75em; }
.ww .elementor-widget-text-editor ul, .ww .elementor-widget-text-editor ol { margin: 0.5em 0 0; padding-left: 1.25em; }
.ww .elementor-widget-text-editor ul { list-style: disc; }
.ww .elementor-widget-text-editor ol { list-style: decimal; }
.ww .elementor-widget-text-editor a { color: inherit; text-decoration: underline; }
.ww .elementor-widget-button .elementor-button-wrapper { display: block; }
.ww .elementor-widget-button .elementor-button-content-wrapper { gap: 0; }
.ww .elementor-widget-button .elementor-button-text { color: inherit; }
.ww .elementor-widget-html .elementor-widget-container { margin: 0; line-height: 0; }
.ww a { color: inherit; }
/* Quand Elementor est en édition : rien ne bouge, tout est visible */
.ww.elementor-editor-active .faq-a { display: block; }
.ww.elementor-editor-active .loader { display: none; }

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.ww {
  margin: 0;
  background: var(--nuit);
  color: var(--creme);
  font-family: var(--f-texte);
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
body.ww::before {
  content: "";
  position: fixed;
  inset: 0 0 auto;
  height: env(safe-area-inset-top, 0px);
  z-index: 30;
  background: var(--nuit);
}
.ww h1, .ww h2, .ww h3, .ww p, .ww figure { margin: 0; }
.ww a { color: inherit; }
.ww :focus-visible { outline: 3px solid var(--or); outline-offset: 3px; }
.ww .creme :focus-visible { outline-color: var(--nuit); }
.ww section[id] { scroll-margin-top: 72px; }

/* Structure */
.ww .band-fond { background: var(--nuit); color: var(--creme); }
.ww .band-fond.douce { background: var(--nuit-douce); }
.ww .band-fond.creme { background: var(--creme); color: var(--nuit); }
.ww .wrap {
  width: 100%;
  max-width: 1200px;
  margin-inline: auto;
  padding-left: var(--gut-l);
  padding-right: var(--gut-r);
  padding-block: clamp(56px, 9vw, 120px);
}
.ww .wrap > * { min-width: 0; }

/* Typographie (échelle de la charte : H2 32/24, H3 24/20, texte 16, légende 12) */
.ww .h2 {
  font-family: var(--f-titre);
  font-weight: 700;
  font-size: clamp(1.5rem, 3.2vw, 2rem);
  line-height: 1.25;
  text-wrap: balance;
  max-width: 24em;
}
.ww .h3 {
  font-family: var(--f-texte);
  font-weight: 700;
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  line-height: 1.3;
}
.ww .sub { max-width: 38em; color: var(--brume); }
.ww .creme .sub { color: var(--nuit-douce); }
.ww .label {
  font-family: var(--f-texte);
  font-weight: 700;
  font-size: 0.8125rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--or);
}
.ww .creme .label { color: var(--nuit); }
.ww .head { display: flex; flex-direction: column; gap: 16px; }

/* Boutons (Unbounded, comme le veut la charte) : le style vit sur le lien du widget Bouton */
.ww .btn .elementor-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 26px;
  border-radius: 999px;
  border: 2px solid transparent;
  background: transparent;
  color: inherit;
  fill: currentColor;
  font-family: var(--f-titre);
  font-weight: 700;
  font-size: 0.8125rem;
  line-height: 1.2;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  transition: transform 180ms cubic-bezier(0.2, 0, 0, 1), background-color 180ms, color 180ms, border-color 180ms;
}
.ww .btn .elementor-button:hover, .ww .btn .elementor-button:focus { transform: translateY(-2px); }
.ww .btn .elementor-button:active { transform: translateY(0); }
.ww .btn-or .elementor-button { background: var(--or); color: var(--nuit); }
.ww .btn-or .elementor-button:hover, .ww .btn-or .elementor-button:focus { background: var(--creme); color: var(--nuit); }
.ww .btn-ghost .elementor-button { border-color: var(--trait); color: var(--creme); background: transparent; }
.ww .btn-ghost .elementor-button:hover, .ww .btn-ghost .elementor-button:focus { border-color: var(--creme); color: var(--creme); background: transparent; }
.ww .btn-nuit .elementor-button { background: var(--nuit); color: var(--creme); }
.ww .btn-nuit .elementor-button:hover, .ww .btn-nuit .elementor-button:focus { background: var(--nuit-douce); color: var(--creme); }
.ww .btn-ligne .elementor-button { border-color: var(--nuit); color: var(--nuit); background: transparent; }
.ww .btn-ligne .elementor-button:hover, .ww .btn-ligne .elementor-button:focus { background: var(--nuit); color: var(--creme); border-color: var(--nuit); }
.ww .btn-petit .elementor-button { min-height: 40px; padding: 0 18px; }

/* Chargement : le logo lève les bras, le soleil se lève */
.ww .loader {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  background: var(--nuit);
}
.ww .loader-logo { width: min(36vw, 176px); height: auto; overflow: visible; }

/* En-tête */
.ww .top {
  position: sticky;
  top: env(safe-area-inset-top, 0px);
  z-index: 20;
  background: var(--nuit);
  border-bottom: 1px solid var(--trait);
}
.ww .top .wrap {
  flex-direction: row; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 12px; }
.ww .logo { display: flex; align-items: center; color: var(--creme); text-decoration: none; }
.ww .logo .lh { height: 36px; width: auto; aspect-ratio: 497.997 / 78.968; display: none; }
.ww .logo .ls { height: 36px; width: auto; aspect-ratio: 102.957 / 78.968; display: block; }
@media (min-width: 560px) {
  .ww .logo .lh { display: block; height: 40px; }
  .ww .logo .ls { display: none; }
}
.ww .nav {
  flex-direction: row; display: none; gap: 24px; font-weight: 500; }
.ww .nav a { text-decoration: none; padding-block: 8px; transition: color 150ms; }
.ww .nav a:hover { color: var(--or); }
@media (min-width: 1000px) { .ww .nav { display: flex; flex-direction: row; } }

/* Bandeau des soleils levants : toujours 48 px, la taille de référence */
.ww .motif { display: block; width: 100%; height: 48px; }
.ww .motif-zone { overflow: hidden; line-height: 0; }

/* Hero */
.ww .hero .wrap {
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
  align-items: center;
  padding-block: clamp(40px, 7vw, 96px) clamp(40px, 6vw, 80px);
}
@media (min-width: 900px) { .ww .hero .wrap { grid-template-columns: 1.15fr 0.85fr; gap: 56px; } }
.ww .hero-texte { display: flex; flex-direction: column; gap: 24px; }
.ww .rotateur {
  font-family: var(--f-titre);
  font-weight: 700;
  font-size: clamp(2rem, 5.4vw, 4rem);
  line-height: 1.1;
  letter-spacing: -0.015em;
  text-wrap: balance;
}
.ww .rotateur .elementor-heading-title { display: grid; }
.ww .phrase { grid-area: 1 / 1; visibility: hidden; }
.ww .phrase:first-child { visibility: visible; }
.ww .accent { font-style: normal; color: var(--braise); }
.ww .mot { display: inline-block; white-space: nowrap; }
.ww .caret { position: relative; display: inline-block; width: 0; height: 1em; }
.ww .caret::after {
  content: "";
  position: absolute;
  left: 0.06em;
  bottom: -0.08em;
  width: 0.07em;
  height: 0.95em;
  background: var(--braise);
  animation: clignote 1s steps(1) infinite;
}
@keyframes clignote { 50% { opacity: 0; } }
.ww .lead { font-size: 1.125rem; max-width: 30em; }
.ww .mission { color: var(--or); font-weight: 700; max-width: 28em; }
.ww .cta-row {
  flex-direction: row; display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.ww .reponse { font-size: 0.875rem; color: var(--brume); }
.ww .hero-art { width: min(100%, 440px); justify-self: center; }

/* Manifeste */
.ww .manifeste .wrap { display: flex; flex-direction: column; gap: clamp(40px, 6vw, 72px); }
.ww .enonce {
  font-family: var(--f-titre);
  font-weight: 700;
  font-size: clamp(1.375rem, 3.3vw, 2.375rem);
  line-height: 1.3;
  max-width: 28em;
  text-wrap: pretty;
}
.ww .convictions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: 40px;
}
.ww .conviction { display: flex; flex-direction: column; gap: 12px; padding-top: 20px; position: relative; border-top: 1px solid var(--trait); }
.ww .conviction .txt { color: var(--brume); max-width: 28em; }
.ww .titre-ico {
  flex-direction: row; display: flex; align-items: center; gap: 12px; }
.ww .af { flex: none; height: 32px; width: auto; aspect-ratio: 54 / 57; fill: var(--braise); }
.ww .e-con > .fill {
  position: absolute;
  top: -2px;
  left: 0;
  width: 100%;
  height: 3px;
  background: var(--or);
  transform-origin: left center;
}

/* Globes : l'Afrique brille, le reste du monde en gris */
.ww .e-con > .globe-w {
  position: absolute;
  top: -48px;
  left: -20px;
  z-index: 2;
  width: 104px;
  height: 104px;
  pointer-events: none;
}
.ww .globe-w .elementor-widget-container { width: 100%; height: 100%; }
.ww .globe { display: block; width: 100%; height: 100%; }

/* Mission, vision, signature */
.ww .trio {
  margin-top: clamp(64px, 8vw, 88px);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: 48px 20px;
}
.ww .carte {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 68px clamp(24px, 3vw, 32px) clamp(24px, 3vw, 32px);
  border-radius: var(--rayon);
  background: var(--nuit);
}
.ww .carte .t {
  color: var(--brume);
  font-family: var(--f-titre);
  font-weight: 700;
  font-size: clamp(1.25rem, 2.2vw, 1.625rem);
  line-height: 1.3;
  text-wrap: balance;
}
.ww .carte .txt { color: var(--brume); }
.ww .carte .label { color: var(--or); }
.ww .carte .mini { margin-top: auto; padding-top: 8px; flex-shrink: 0; }
.ww .carte.signature { background: var(--or); color: var(--nuit); }
.ww .carte.signature .label, .ww .carte.signature .txt, .ww .carte.signature .t { color: var(--nuit); }
.ww .sw { display: inline; }
.ww .nom { margin-top: 28px; color: var(--brume); font-size: 0.875rem; }

.ww .chemin {
  margin-top: clamp(40px, 6vw, 64px);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: 32px;
}
.ww .etape-chemin { position: relative; padding-top: 20px; border-top: 1px solid var(--trait); display: flex; flex-direction: column; gap: 10px; }
.ww .etape-chemin .quand {
  flex-direction: row; display: flex; align-items: center; gap: 14px; font-family: var(--f-titre); font-weight: 700; font-size: 1rem; color: var(--or); }
.ww .etape-chemin .quand svg { width: 56px; height: 28px; flex: none; overflow: visible; }
.ww .etape-chemin .txt { color: var(--creme); max-width: 30em; }

/* Emplacements d’images : pour mettre une photo, ajouter une image de fond au cadre (ou y déposer un widget Image) puis supprimer l’étiquette pointillée */
.ww .ph {
  position: relative;
  width: 100%;
  max-width: 100%;
  aspect-ratio: 4 / 3;
  flex-shrink: 0;
  border-radius: var(--rayon);
  background: var(--nuit-douce);
  background-size: cover;
  background-position: center;
  overflow: hidden;
}
.ww .ph .elementor-widget-image, .ww .ph .elementor-widget-image .elementor-widget-container, .ww .ph .elementor-widget-image img { width: 100%; height: 100%; }
.ww .ph .elementor-widget-image img { object-fit: cover; display: block; }
.ww .ph-in {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 20px;
  border: 1.5px dashed rgba(255, 244, 224, 0.4);
  border-radius: var(--rayon);
  color: var(--brume);
  font-size: 0.9375rem;
  text-align: center;
}
.ww .ph-ico svg { width: 48px; height: 24px; display: block; flex: none; }
.ww .ph-txt { color: inherit; }
.ww .ph.portrait { aspect-ratio: 4 / 5; }
.ww .ph.large { aspect-ratio: 16 / 9; }
.ww .ph.mini { aspect-ratio: 16 / 9; max-height: 150px; }
/* Filet de sécurité mobile uniquement : si un navigateur écrase un cadre, il garde au moins une hauteur proche de son format */
@media (max-width: 767px) {
  .ww .ph { min-height: calc((100vw - 96px) * 0.75); }
  .ww .ph.portrait { min-height: calc((100vw - 96px) * 1.25); }
  .ww .ph.large { min-height: calc((100vw - 96px) * 0.5625); }
  .ww .ph.mini { min-height: 110px; }
}
.ww .ph.mini .ph-in { padding: 12px; font-size: 0.875rem; gap: 8px; }
.ww .ph.mini .ph-ico svg { width: 32px; height: 16px; }
.ww .douce .ph { background-color: var(--nuit); }
.ww .creme .ph { background-color: var(--creme); }
.ww .creme .ph .ph-in { color: var(--nuit-douce); border-color: rgba(11, 15, 26, 0.45); }
.ww .signature .ph { background-color: transparent; }
.ww .signature .ph .ph-in { color: var(--nuit); border-color: rgba(11, 15, 26, 0.5); }

/* Métiers */
.ww .metiers {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  gap: clamp(32px, 5vw, 56px);
  margin-top: clamp(32px, 5vw, 56px);
}
.ww .metier { display: flex; flex-direction: column; gap: 16px; }
.ww .metier .txt { max-width: 32em; color: var(--nuit-douce); }

/* Démo motion */
.ww .demo { margin-top: clamp(40px, 6vw, 72px); display: flex; flex-direction: column; gap: 16px; }
.ww .scene {
  position: relative;
  container-type: inline-size;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: var(--rayon);
  background: var(--nuit);
  color: var(--creme);
  overflow: hidden;
  flex-shrink: 0;
}
@media (max-width: 767px) { .ww .scene { min-height: calc((100vw - 96px) * 0.5625); } }
.ww .plan {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 2cqw;
  padding: 8cqw;
}
.ww .plan .ligne {
  font-family: var(--f-titre);
  font-weight: 700;
  font-size: clamp(1.125rem, 5.6cqw, 3.25rem);
  line-height: 1.12;
  display: block;
}
.ww .plan .ligne .elementor-heading-title { display: block; overflow: hidden; padding-block: 0.08em; }
.ww .plan .ligne .elementor-heading-title > span { display: block; }
.ww .plan:not(.final) { visibility: hidden; }
.ww .plan.final { align-items: center; text-align: center; }
.ww .plan.final svg.sym { width: 20cqw; height: auto; overflow: visible; }
.ww .plan.final .slogan { font-family: var(--f-titre); font-weight: 700; font-size: clamp(0.875rem, 3.2cqw, 1.75rem); color: var(--braise); }
.ww .scene .motif-zone { position: absolute; left: 0; right: 0; bottom: 0; }
.ww .demo-ctrl {
  flex-direction: row; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.ww .demo-ctrl .txt { color: var(--nuit-douce); font-size: 0.9375rem; max-width: 36em; }

/* Méthode : un parcours, un soleil qui avance */
.ww .parcours { position: relative; margin-top: clamp(40px, 6vw, 64px); }
.ww .piste { display: none; }
@media (min-width: 900px) {
  .ww .parcours { margin-top: 72px; }
  .ww .piste { display: block; position: absolute; left: 0; right: 0; top: -28px; height: 3px; border-radius: 3px; background: var(--trait); }
  .ww .e-con > .piste-fill { position: absolute; inset: 0; border-radius: 3px; background: var(--or); transform-origin: left center; }
  .ww .e-con > .voyageur { position: absolute; left: 0; top: -16px; width: 32px; height: 16px; border-radius: 32px 32px 0 0; background: var(--or); }
}
.ww .etapes {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: 20px;
}
.ww .etape {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: clamp(24px, 3vw, 32px);
  border-radius: var(--rayon);
  background: var(--nuit-douce);
  transition: transform 220ms cubic-bezier(0.2, 0, 0, 1);
}
.ww .etape:hover { transform: translateY(-4px); }
.ww .etape-tete {
  flex-direction: row; display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 8px; }
.ww .e-con > .icone {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--or);
  color: var(--nuit);
}
.ww .icone svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ww .gros-n {
  font-family: var(--f-titre);
  font-weight: 700;
  font-size: clamp(3.5rem, 6vw, 5rem);
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 2px var(--or);
}
.ww .etape .txt { color: var(--brume); max-width: 28em; }
.ww .etape .delai { color: var(--creme); font-weight: 500; margin-top: auto; padding-top: 8px; }

/* Réalisations */
.ww .projets {
  margin-top: clamp(32px, 5vw, 56px);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 24px;
}
.ww .projets .fig { display: flex; flex-direction: column; gap: 12px; flex-shrink: 0; }
.ww .fig-cap { color: var(--brume); }
.ww .fig-cap strong { display: block; color: var(--creme); }
.ww .projets-cta { margin-top: 40px; }

/* À propos */
.ww .apropos-grille {
  display: grid;
  grid-template-columns: 1fr;
  gap: 72px;
  align-items: start;
}
@media (min-width: 960px) { .ww .apropos-grille { grid-template-columns: 1.1fr 0.9fr; gap: 64px; } }
.ww .apropos-texte { display: flex; flex-direction: column; gap: 28px; }
.ww .valeurs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 28px 32px;
}
.ww .valeur { display: flex; flex-direction: column; gap: 8px; padding-top: 18px; border-top: 1px solid var(--trait); }
.ww .valeur .h3 { font-size: 1.25rem; }
.ww .valeur .txt { color: var(--brume); }
.ww .carte.photo { background: var(--nuit-douce); padding-top: 68px; }
.ww .carte.photo .fig-cap { color: var(--brume); font-size: 0.9375rem; }
.ww .carte.photo .fig-cap strong { color: var(--creme); display: block; }

/* FAQ : chaque question est un widget Titre, chaque réponse un widget Éditeur de texte */
.ww .faq-liste { margin-top: clamp(32px, 5vw, 56px); max-width: 52rem; }
.ww .faq-item { border-top: 1px solid var(--trait); }
.ww .faq-item:last-child { border-bottom: 1px solid var(--trait); }
.ww .faq-q {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 0;
  cursor: pointer;
  font-weight: 700;
  font-size: 1.125rem;
  line-height: 1.35;
}
.ww .faq-q::after {
  content: "";
  flex: none;
  width: 12px;
  height: 12px;
  margin-right: 6px;
  border-right: 2px solid var(--or);
  border-bottom: 2px solid var(--or);
  transform: rotate(45deg);
  transition: transform 200ms cubic-bezier(0.2, 0, 0, 1);
}
.ww .faq-item.is-open .faq-q::after { transform: rotate(-135deg); }
.ww .faq-a { padding: 0 0 22px; color: var(--brume); max-width: 40em; }

/* Offres */
.ww .offres {
  margin-top: clamp(32px, 5vw, 56px);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr));
  gap: 20px;
  align-items: stretch;
}
.ww .offre {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: clamp(24px, 3vw, 32px);
  border-radius: var(--rayon);
  background: var(--nuit);
  color: var(--creme);
  transition: transform 220ms cubic-bezier(0.2, 0, 0, 1);
}
.ww .offre:hover { transform: translateY(-4px); }
.ww .offre .quoi { color: var(--brume); }
.ww .offre .liste ul { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ww .offre li { position: relative; padding-left: 24px; }
.ww .offre li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.62em;
  width: 12px;
  height: 6px;
  border-radius: 12px 12px 0 0;
  background: var(--or);
}
.ww .offre .pied-offre { margin-top: auto; display: flex; flex-direction: column; gap: 16px; padding-top: 12px; }
.ww .offre .delai { font-size: 0.9375rem; color: var(--brume); }
.ww .prix {
  flex-direction: row; display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; }
.ww .prix .des { font-size: 0.9375rem; }
.ww .prix .montant { font-family: var(--f-titre); font-weight: 700; font-size: 1.625rem; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; color: var(--or); }
.ww .prix .unite { font-size: 0.9375rem; }
.ww .offre.star { background: var(--or); color: var(--nuit); }
.ww .offre.star .quoi, .ww .offre.star .delai { color: var(--nuit); }
.ww .offre.star li::before { background: var(--nuit); }
.ww .offre.star .montant { color: var(--nuit); }
.ww .tag { align-self: flex-start; }
.ww .tag .elementor-heading-title {
  display: inline-block;
  padding: 5px 14px;
  border-radius: 999px;
  background: var(--nuit);
  color: var(--creme);
  font-weight: 700;
  font-size: 0.8125rem;
}
.ww .suite {
  flex-direction: row;
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px 32px;
  padding: clamp(20px, 3vw, 28px) clamp(24px, 3vw, 32px);
  border-radius: var(--rayon);
  border: 1.5px solid var(--nuit);
}
.ww .suite .suite-txt { max-width: 44em; display: flex; flex-direction: column; gap: 6px; }
.ww .suite .txt { color: var(--nuit-douce); }

/* Contact et pied de page */
.ww .contact .wrap { display: flex; flex-direction: column; gap: 24px; align-items: flex-start; }
.ww .coord { display: flex; flex-direction: column; gap: 12px; margin-top: 8px; }
.ww .coord-ligne {
  flex-direction: row; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.ww .coord-ligne .lib { min-width: 6em; color: var(--brume); }
.ww .coord-ligne .val { font-weight: 700; overflow-wrap: anywhere; user-select: all; }
.ww .btn-copie .elementor-button { min-height: 36px; padding: 0 14px; border-color: var(--trait); color: var(--creme); background: transparent; font-size: 0.75rem; }
.ww .btn-copie .elementor-button:hover, .ww .btn-copie .elementor-button:focus { border-color: var(--creme); background: transparent; color: var(--creme); }
.ww .pied .wrap { padding-block: clamp(36px, 5vw, 56px); }
.ww .pied-ligne {
  flex-direction: row; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 32px; }
.ww .pied-ligne .copy { color: var(--brume); font-size: 0.875rem; }
.ww .pied-ligne .slogan { font-family: var(--f-titre); font-weight: 700; color: var(--braise); font-size: 0.9375rem; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .ww .btn .elementor-button, .ww .offre, .ww .etape, .ww .nav a { transition: none; }
  .ww .btn .elementor-button:hover, .ww .offre:hover, .ww .etape:hover { transform: none; }
}

/* ===== Compléments WordPress ===== */
.ww.admin-bar .top { top: 32px; }
@media (max-width: 782px) { .ww.admin-bar .top { top: 46px; } }
.ww .ww-simple { padding-block: clamp(56px, 9vw, 120px); display: flex; flex-direction: column; gap: 24px; }
.ww .ww-texte { display: flex; flex-direction: column; gap: 16px; max-width: 42em; color: var(--creme); }
.ww .ww-texte a { color: var(--or); }
.ww .loader { animation: ww-secours 0.01s linear 8s forwards; }
@keyframes ww-secours { to { opacity: 0; visibility: hidden; pointer-events: none; } }
@media (prefers-reduced-motion: reduce) { .ww .loader { display: none; } }
.ww.faq-js .faq-a { display: none; }
.ww.faq-js .faq-item.is-open .faq-a { display: block; }
.ww .pied-offre .btn .elementor-button { display: flex; width: 100%; }

/* Mobile uniquement, cartes Mission / Vision / Signature : hauteur fixe du cadre d'image (même hauteur que sur le site validé) */
@media (max-width: 767px) {
  .ww .carte .mini { height: auto; min-height: 0; max-height: none; }
  .ww .carte .mini .ph.mini { aspect-ratio: auto; height: 150px; min-height: 150px; max-height: 150px; }
}

/* Téléphones (colonne unique) uniquement, section Réalisations : hauteur fixe des cadres (16/9 de la largeur de la colonne), pour que le bouton reste sous la dernière carte */
@media (max-width: 575px) {
  .ww .projets .fig .ph.large { aspect-ratio: auto; min-height: 0; height: calc((100vw - 32px) * 0.5625); }
}

/* Une vraie image ou vidéo dans un cadre : plus aucun format ni hauteur imposés, le média garde sa taille naturelle */
.ww .ph.ph:has(.elementor-widget-image, .elementor-widget-video, img, video, iframe) { aspect-ratio: auto; min-height: 0; max-height: none; padding: 0; margin-top: 0; }
.ww .ph .elementor-widget-image, .ww .ph .elementor-widget-image .elementor-widget-container { width: 100%; height: auto; }
.ww .ph .elementor-widget-image img { width: 100%; height: auto; object-fit: initial; display: block; }
.ww .scene.scene:has(> .elementor-widget-video, > .elementor-widget-image) { aspect-ratio: auto; min-height: 0; }

/* Barre de liens rapides : téléphones et tablettes (le menu complet apparaît dès 1000 px) */
.ww .ww-mini-nav { display: none; }
.ww.elementor-editor-active .ww-mini-nav { display: none !important; }
@media (max-width: 999px) {
  .ww .ww-mini-nav.is-ready {
    display: block;
    position: sticky;
    top: var(--ww-top-h, 72px);
    z-index: 19;
    background: var(--nuit);
    border-bottom: 1px solid var(--trait);
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .ww .ww-mini-nav::-webkit-scrollbar { display: none; }
  .ww .ww-mini-nav ul { display: flex; gap: 6px; width: max-content; margin: 0; padding: 8px max(16px, env(safe-area-inset-left, 0px)); list-style: none; }
  .ww .ww-mini-nav a {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid var(--trait);
    color: var(--creme);
    text-decoration: none;
    font-family: var(--f-texte);
    font-weight: 500;
    font-size: 0.8125rem;
    line-height: 1.2;
    white-space: nowrap;
    transition: color 150ms, border-color 150ms;
  }
  .ww .ww-mini-nav a:hover, .ww .ww-mini-nav a:focus-visible { color: var(--or); border-color: var(--or); }
  .ww section[id], .ww main[id] { scroll-margin-top: calc(var(--ww-top-h, 72px) + 56px); }
}
