/* ============================================================
   WEBPIXIE — Base dark-mode layout, animations & responsive
   Shared across every page. Loaded after colors_and_type.css.
   ============================================================ */
*{box-sizing:border-box;}
html,body{margin:0;padding:0;max-width:100%;overflow-x:clip;}
html{scroll-behavior:smooth;}
body{
  background:var(--night);
  color:var(--fg-on-dark);
  font-family:var(--font-sans);
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}
/* sticky-header logo: gentle entrance pop + subtle float once docked */
@keyframes wpLogoDock{0%{transform:scale(.92);}60%{transform:scale(1.04);}100%{transform:scale(1);}}
@keyframes wpLogoFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-2.5px);}}
.wp-logo-sticky{animation:wpLogoDock .5s var(--ease-spring) , wpLogoFloat 3.4s ease-in-out 0.5s infinite;}
@media (prefers-reduced-motion: reduce){.wp-logo-sticky{animation:none;}}
a{color:inherit;text-decoration:none;}
::selection{background:rgba(173,190,26,.32);color:#fff;}

/* scrollbar */
::-webkit-scrollbar{width:11px;height:11px;}
::-webkit-scrollbar-track{background:var(--night);}
::-webkit-scrollbar-thumb{background:#403d4f;border-radius:99px;border:3px solid var(--night);}
::-webkit-scrollbar-thumb:hover{background:#52506a;}

/* ---- keyframes ---- */
@keyframes wpFade{from{opacity:0;}to{opacity:1;}}
@keyframes wpPop{from{opacity:0;transform:translateY(14px) scale(.97);}to{opacity:1;transform:none;}}
@keyframes wpMarquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@keyframes wpRailScroll{from{transform:translateX(0);}to{transform:translateX(calc(-50% - 8px));}}
@keyframes wpScrollTopBob{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}
.wp-scrolltop:hover{border-color:var(--lime-500) !important;animation:wpScrollTopBob 1s ease-in-out infinite;box-shadow:0 12px 30px rgba(173,190,26,.4) !important;}
@media (prefers-reduced-motion: reduce){.wp-scrolltop:hover{animation:none;}}
@keyframes wpRocketBob{0%,100%{transform:translateY(0) rotate(-3deg);}50%{transform:translateY(-5px) rotate(3deg);}}
.wp-rocket-bob{animation:wpRocketBob 1.6s ease-in-out infinite;}
@keyframes wpRocketOrbit{from{transform:rotate(0deg) translateX(42px) rotate(0deg);}to{transform:rotate(360deg) translateX(42px) rotate(-360deg);}}
.wp-rocket-orbit{animation:wpRocketOrbit 3.5s linear infinite;}
@media (prefers-reduced-motion: reduce){.wp-rocket-bob,.wp-rocket-orbit{animation:none !important;}}
/* FAQ orbit rocket — richer exhaust + aura */
@keyframes wpRkBody{0%,100%{transform:scale(1);}50%{transform:scale(1.06);}}
.wp-rk-body{animation:wpRkBody 1.3s ease-in-out infinite;}
@keyframes wpRkAura{0%,100%{opacity:.5;transform:scale(1);}50%{opacity:.9;transform:scale(1.18);}}
.wp-rk-aura{animation:wpRkAura 1.3s ease-in-out infinite;}
@keyframes wpRkFlame{0%,100%{transform:scaleY(1) scaleX(1);opacity:.92;}50%{transform:scaleY(1.5) scaleX(.78);opacity:.55;}}
.wp-rk-flame{transform-origin:top center;animation:wpRkFlame .28s ease-in-out infinite;}
.wp-rk-flame-out{animation-duration:.4s;}
.wp-rk-flame-core{animation-duration:.2s;}
@keyframes wpRkSpark{0%{opacity:1;transform:translate(-50%,0) scale(1);}100%{opacity:0;transform:translate(var(--sx,-50%),34px) scale(.3);}}
.wp-rk-spark{transform:translateX(-50%);animation:wpRkSpark .7s linear infinite;}
.wp-rk-spark-1{--sx:-180%;animation-delay:0s;}
.wp-rk-spark-2{--sx:60%;animation-delay:.23s;}
.wp-rk-spark-3{--sx:-90%;animation-delay:.46s;}
@media (prefers-reduced-motion: reduce){.wp-rk-body,.wp-rk-aura,.wp-rk-flame,.wp-rk-spark{animation:none !important;}}
/* Team avatars — float + spinning ring + pulsing glow + hover pop */
@keyframes wpAvatarFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
@keyframes wpAvatarSpin{to{transform:rotate(360deg);}}
@keyframes wpAvatarGlow{0%,100%{opacity:.4;transform:scale(1);}50%{opacity:.85;transform:scale(1.12);}}
@keyframes wpAvatarSpark{0%,100%{opacity:.3;transform:scale(.8) rotate(0deg);}50%{opacity:1;transform:scale(1.15) rotate(15deg);}}
.wp-avatar{animation:wpAvatarFloat 5s ease-in-out infinite;}
.wp-avatar:nth-of-type(1){animation-delay:0s;}
.wp-avatar-ring{position:absolute;inset:-7px;border-radius:999px;border:2px dashed rgba(173,190,26,.5);animation:wpAvatarSpin 14s linear infinite;}
.wp-avatar-glow{position:absolute;inset:-16px;border-radius:999px;background:radial-gradient(circle,rgba(173,190,26,.4),rgba(173,190,26,0) 70%);animation:wpAvatarGlow 4s ease-in-out infinite;pointer-events:none;}
.wp-avatar-spark{animation:wpAvatarSpark 3s ease-in-out infinite;}
.wp-avatar:hover{animation-play-state:paused;}
.wp-avatar:hover .wp-avatar-ring{border-color:var(--lime-400);}
@media (prefers-reduced-motion: reduce){.wp-avatar,.wp-avatar-ring,.wp-avatar-glow,.wp-avatar-spark{animation:none !important;}}
@keyframes wpSheen{0%,68%{transform:translateX(-130%);}82%,100%{transform:translateX(130%);}}
@keyframes wpTwinkle{0%,100%{opacity:.25;transform:scale(.8);}50%{opacity:1;transform:scale(1.15);}}
@keyframes wpDriftA{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(60px,-40px) scale(1.12);}}
@keyframes wpDriftB{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(-50px,40px) scale(1.08);}}
@keyframes wpDriftC{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(40px,50px) scale(1.1);}}
@keyframes wpPulse{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(173,190,26,.5);}50%{opacity:.7;box-shadow:0 0 0 6px rgba(173,190,26,0);}}
@keyframes wpDraw{to{stroke-dashoffset:0;}}
@keyframes wpReveal{from{opacity:0;transform:translateY(var(--wp-ry,16px));}to{opacity:1;transform:none;}}
@keyframes wpSpinSlow{to{transform:rotate(360deg);}}
@keyframes wpFloatY{0%,100%{transform:translateY(0);}50%{transform:translateY(-12px);}}
@keyframes wpBounceIn{0%{opacity:0;transform:translateY(20px) scale(.9);}60%{opacity:1;transform:translateY(-4px) scale(1.02);}100%{transform:none;}}
@keyframes wpTyping{0%,60%,100%{transform:translateY(0);opacity:.4;}30%{transform:translateY(-5px);opacity:1;}}
@keyframes wpGridPan{from{background-position:0 0;}to{background-position:54px 54px;}}
/* patchwork tile gentle float */
.wp-patch-float{animation:wpPatchFloat 7s ease-in-out infinite;}
@keyframes wpPatchFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-7px);}}
.wp-contact-arrow{animation:wpArrowNudge 1.8s ease-in-out infinite;}
@keyframes wpArrowNudge{0%,100%{transform:translateY(-50%) translateX(0);}50%{transform:translateY(-50%) translateX(5px);}}
@media(max-width:920px){.wp-contact-arrow{display:none !important;}}
/* sequential spotlight that travels through the ordered tiles (CSS-driven, no JS timer) */
.wp-patch-tile{position:relative;aspect-ratio:1 / 1;border-radius:var(--radius-lg);overflow:hidden;background:var(--night-2);box-shadow:0 10px 26px rgba(0,0,0,.3), 0 0 0 1px rgba(255,255,255,.1);filter:brightness(.9);transform:scale(1);will-change:transform,filter;}
.wp-patch-tile.anim{animation:wpPatchSeq 12s ease-in-out infinite;}
.wp-patch-tile:hover{outline:2px solid rgba(173,190,26,.65);outline-offset:2px;filter:brightness(1.12);transform:scale(1.03);z-index:2;}
@keyframes wpPatchSeq{
  0%{transform:scale(1.06);box-shadow:0 22px 48px rgba(0,0,0,.5), 0 0 0 4px rgba(173,190,26,.55);filter:brightness(1.15);}
  9%{transform:scale(1);box-shadow:0 10px 26px rgba(0,0,0,.3), 0 0 0 1px rgba(255,255,255,.1);filter:brightness(.9);}
  91%{transform:scale(1);box-shadow:0 10px 26px rgba(0,0,0,.3), 0 0 0 1px rgba(255,255,255,.1);filter:brightness(.9);}
  100%{transform:scale(1.06);box-shadow:0 22px 48px rgba(0,0,0,.5), 0 0 0 4px rgba(173,190,26,.55);filter:brightness(1.15);}
}
@media (prefers-reduced-motion: reduce){.wp-patch-float,.wp-patch-tile.anim{animation:none !important;}.wp-patch-tile{filter:none;}}
@keyframes wpSpin{to{transform:rotate(360deg);}}
@keyframes wpSpinRev{to{transform:rotate(-360deg);}}
@keyframes wpGeoFloat1{0%,100%{transform:translate(0,0) rotate(0deg);}50%{transform:translate(24px,-34px) rotate(22deg);}}
@keyframes wpGeoFloat2{0%,100%{transform:translate(0,0) rotate(0deg);}50%{transform:translate(-30px,26px) rotate(-26deg);}}
@keyframes wpGeoFloat3{0%,100%{transform:translate(0,0) rotate(0deg);}50%{transform:translate(20px,30px) rotate(16deg);}}
@keyframes wpDash{to{stroke-dashoffset:-1000;}}
@keyframes wpScrollUp{from{transform:translateY(0);}to{transform:translateY(-50%);}}
@keyframes wpScrollDown{from{transform:translateY(-50%);}to{transform:translateY(0);}}
@keyframes wpWordIn{0%{transform:translateY(13px);}100%{transform:none;}}
@keyframes wpKenBurns{0%{transform:scale(1.02) translate(0,0);}100%{transform:scale(1.12) translate(-1.5%,-1.5%);}}

.wp-reveal{animation:wpReveal .62s var(--ease-out) both;}
/* Safety net: if entrance animations are throttled (e.g. background/preview
   iframe), force the visible resting state so content never stays hidden. */
html.wp-reveal-show .wp-reveal{opacity:1 !important;transform:none !important;animation:none !important;}
.wp-sheen{position:absolute;inset:0;background:linear-gradient(105deg,transparent 32%,rgba(255,255,255,.6) 48%,transparent 62%);transform:translateX(-130%);animation:wpSheen 3.6s var(--ease-out) infinite;pointer-events:none;}
.wp-twinkle{animation:wpTwinkle 3.2s ease-in-out infinite;}
.wp-float{animation:wpFloatY 6s ease-in-out infinite;}
.wp-blob{position:absolute;border-radius:50%;filter:blur(75px);pointer-events:none;}
.wp-blob-a{width:480px;height:480px;background:var(--lime-500);opacity:.20;animation:wpDriftA 16s ease-in-out infinite;}
.wp-blob-b{width:400px;height:400px;background:#6E7A0E;opacity:.18;animation:wpDriftB 19s ease-in-out infinite;}
.wp-blob-c{width:320px;height:320px;background:var(--lime-400);opacity:.12;animation:wpDriftC 22s ease-in-out infinite;}
.wp-dot-pulse{animation:wpPulse 2s ease-in-out infinite;}

.wp-link{transition:color var(--dur-fast) var(--ease-out);}
.wp-link:hover{color:var(--lime-400);}

/* focus ring */
:focus-visible{outline:3px solid rgba(173,190,26,.45);outline-offset:2px;border-radius:4px;}

.wp-rail{scrollbar-width:thin;scrollbar-color:#52506a transparent;}
.wp-rail::-webkit-scrollbar{height:8px;}
.wp-rail::-webkit-scrollbar-track{background:rgba(255,255,255,.05);border-radius:99px;}
.wp-rail::-webkit-scrollbar-thumb{background:#52506a;border-radius:99px;}
.wp-rail::-webkit-scrollbar-thumb:hover{background:var(--lime-600);}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .wp-sheen,.wp-twinkle,.wp-blob,.wp-dot-pulse,.wp-reveal,.wp-float,.wp-kenburns{animation:none !important;}
}

/* ===== Animated footer geometric backdrop ===== */
@keyframes wpFootPan{from{background-position:0 0;}to{background-position:54px 54px;}}
@keyframes wpLineShim{from{background-position:200% 0;}to{background-position:-200% 0;}}
.wp-foot-pan{position:absolute;inset:0;background-image:linear-gradient(rgba(173,190,26,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(173,190,26,.07) 1px,transparent 1px);background-size:54px 54px;animation:wpFootPan 11s linear infinite;-webkit-mask-image:radial-gradient(ellipse 75% 90% at 50% 0%,#000,transparent 78%);mask-image:radial-gradient(ellipse 75% 90% at 50% 0%,#000,transparent 78%);pointer-events:none;}
.wp-foot-line{position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--lime-600),var(--lime-300),var(--lime-500),transparent);background-size:200% 100%;animation:wpLineShim 6s linear infinite;pointer-events:none;}
@media (prefers-reduced-motion: reduce){.wp-foot-pan,.wp-foot-line{animation:none !important;}}

/* ===== Tweak: Ambiance (background motion & glow intensity) ===== */
html.amb-epure .wp-blob{opacity:.05 !important;}
html.amb-epure .wp-geo{filter:brightness(.45) saturate(.7);}
html.amb-epure .wp-twinkle{display:none;}
html.amb-cosmique .wp-blob{opacity:.32 !important;filter:blur(64px);}
html.amb-cosmique .wp-geo{filter:brightness(1.7) saturate(1.3) drop-shadow(0 0 6px rgba(173,190,26,.5));}
html.amb-cosmique .wp-twinkle{filter:drop-shadow(0 0 7px var(--lime-400));}
/* smooth retint/reshape transitions when tweaking */
html.wp-tweaking, html.wp-tweaking *{transition:background-color .5s var(--ease-out), border-radius .4s var(--ease-out) !important;}

/* ---- responsive helpers ---- */
.wp-burger{display:none;}
@media(max-width:920px){
  .wp-desktop-nav{display:none !important;}
  .wp-burger{display:inline-flex !important;}
  .wp-hero-grid{grid-template-columns:1fr !important;gap:40px !important;}
  .wp-2col{grid-template-columns:1fr !important;}
  .wp-svc-grid{grid-template-columns:1fr 1fr !important;}
  .wp-article-feat{flex-direction:column !important;}
  .wp-article-feat-img{width:100% !important;min-height:0 !important;height:220px !important;}
  .wp-article-feat-img img{position:static !important;}
  .wp-port-grid{grid-template-columns:1fr !important;}
  .wp-stats{grid-template-columns:1fr 1fr !important;row-gap:36px !important;}
  .wp-footer-grid{grid-template-columns:1fr 1fr !important;row-gap:36px !important;}
  .wp-devis-grid{grid-template-columns:1fr !important;}
  .wp-devis-summary{position:relative !important;top:auto !important;}
  .wp-choice-grid-3{grid-template-columns:1fr 1fr !important;}
}
@media(max-width:560px){
  .wp-svc-grid{grid-template-columns:1fr !important;}
  .wp-stats{grid-template-columns:1fr 1fr !important;}
  .wp-footer-grid{grid-template-columns:1fr !important;}
  .wp-choice-grid,.wp-choice-grid-3{grid-template-columns:1fr !important;}
}