/* ============================================================
   GETAX — hero "TERRITOIRE · DONNÉES · DÉCISION" (accueil)
   ------------------------------------------------------------
   The hero art is the client's exact reference banner (navy +
   aerial territory + gold geolocation target + contour lines +
   data-dot clusters), with the baked wordmark painted out so the
   "GETAX" title is real, responsive HTML text on the left.
   An SVG overlay (viewBox = the image's own 1728×910 pixel grid,
   right-anchored slice — matching the <img> object-fit) adds the
   LIVE animation registered pixel-exactly onto the baked motifs:
   sonar rings pulsing from the target, a halo, twinkling clusters
   and a slow data sweep. Pure SVG + CSS, responsive.
   ============================================================ */
.getax-hero-art{ pointer-events:none; }
.getax-hero-fx{ display:block; }

/* the geolocation target sits at image px (1296,451); rings expand from it */
.geo-ring{ transform-box:fill-box; transform-origin:center; opacity:0; }
.geo-core,.geo-halo,.geo-tw{ transform-box:fill-box; transform-origin:center; }

@media (prefers-reduced-motion: no-preference){
  .geo-ring{ animation:getax-geo-pulse 4.4s cubic-bezier(.16,1,.3,1) infinite; }
  .geo-ring.r2{ animation-delay:1.47s; }
  .geo-ring.r3{ animation-delay:2.93s; }
  .geo-halo{ animation:getax-geo-halo 3.2s ease-in-out infinite; }
  .geo-core{ animation:getax-geo-core 3.2s ease-in-out infinite; }
  .geo-tw{ animation:getax-geo-tw 3.6s ease-in-out infinite; }
  .geo-tw.d2{ animation-delay:1.2s; }
  .geo-tw.d3{ animation-delay:2.4s; }
  .geo-sweep{ animation:getax-geo-sweep 9s ease-in-out infinite; }
}
@keyframes getax-geo-pulse{ 0%{transform:scale(.12);opacity:0} 10%{opacity:.75} 100%{transform:scale(1.12);opacity:0} }
@keyframes getax-geo-halo{ 0%,100%{transform:scale(1);opacity:.5} 50%{transform:scale(1.5);opacity:.14} }
@keyframes getax-geo-core{ 0%,100%{transform:scale(1);opacity:1} 50%{transform:scale(1.25);opacity:.8} }
@keyframes getax-geo-tw{ 0%,100%{opacity:.18} 50%{opacity:.9} }
@keyframes getax-geo-sweep{ 0%{transform:translateX(0);opacity:0} 12%{opacity:1} 88%{opacity:1} 100%{transform:translateX(740px);opacity:0} }

/* wordmark — geometric, matches the reference GETAX lockup */
.getax-hero-word{ text-shadow:0 2px 40px rgba(0,8,22,.45); }

/* ---------------- responsive ---------------- */
/* Tablet keeps the default right-anchored cover: the target is already in
   view and the SVG overlay (xMaxYMid) stays pixel-aligned with the image. */
@media (max-width:600px){
  /* Narrow phones: the right-anchored slice would show only the far-right dot
     clusters, cropping the target out. Shift the image so the target (image
     x ~73%) is centred. object-position can't drive the SVG's slice (it uses
     preserveAspectRatio, which has no 73% keyword), so the animated overlay
     would fall off the target here — hide it and let the target baked into the
     image carry the hero on phones. */
  .getax-hero-img{ object-position:73% center !important; opacity:.68; }
  .getax-hero-fx{ display:none; }
}