/* Rotating 4K video footers (Corey, 2026-09-27).
   Each page carries a fixed data-ffx variant (codefall | circuit-horizon | digital-weave), baked in by
   tools/apply-footer-fx.js. The footer's words, links and logos stay real HTML above the art:
   links sit on a dark reading zone, the art lives in a stage underneath them, and the legal line
   sits on its own dark strip. */
footer[data-ffx]{--ffx-stage:300px;--ffx-fade:240px;position:relative;overflow:hidden;isolation:isolate;
  background:#100719!important;border-top:1px solid rgba(150,90,255,.22)}
footer[data-ffx]>*:not(.ffx){position:relative;z-index:1}
footer[data-ffx] .ffx{position:absolute;left:0;right:0;bottom:0;height:calc(var(--ffx-stage) + var(--ffx-fade) + 70px);z-index:0;pointer-events:none;
  background:#100719 var(--ffx-poster) 50% 100%/cover no-repeat;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 var(--ffx-fade));mask-image:linear-gradient(180deg,transparent 0,#000 var(--ffx-fade))}
footer[data-ffx] .ffx video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 100%;opacity:0;transition:opacity .9s ease}
footer[data-ffx] .ffx video.on{opacity:1}
/* keep the upper edge of the art calm under the last row of links */
footer[data-ffx] .ffx::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#100719 0,rgba(16,7,25,.72) calc(var(--ffx-fade) * .75),rgba(16,7,25,0) calc(var(--ffx-fade) + 40px))}
footer[data-ffx="codefall"]{--ffx-poster:url(/img/footer-fx/codefall-poster.webp)}
footer[data-ffx="circuit-horizon"]{--ffx-poster:url(/img/footer-fx/circuit-horizon-poster.webp)}
footer[data-ffx="digital-weave"]{--ffx-poster:url(/img/footer-fx/digital-weave-poster.webp)}

/* the stage: open space under the links; the legal line floats over the art (no strip) */
footer[data-ffx] .fbottom,footer[data-ffx] .foot-bottom{margin-top:calc(34px + var(--ffx-stage))!important;border-top:0!important;position:relative}
footer[data-ffx] .fbottom *,footer[data-ffx] .foot-bottom *{text-shadow:0 1px 3px rgba(8,2,16,.95),0 0 14px rgba(8,2,16,.85)}
footer[data-ffx] .fbottom small,footer[data-ffx] .fbottom a,footer[data-ffx] .foot-bottom,footer[data-ffx] .foot-bottom a{color:#EDE6FA!important}
/* footers without a legal row (home, link page): the stage simply sits below their content */
footer[data-ffx]:not(:has(.fbottom)):not(:has(.foot-bottom)){padding-bottom:calc(var(--ffx-stage) + 24px)!important}

@media (max-width:760px){
  footer[data-ffx]{--ffx-stage:230px;--ffx-fade:160px}
  footer[data-ffx] .ffx{background-position:50% 100%}
}

/* Corey 2026-09-27: footer logo 23% smaller, social icons 25% larger (zoom keeps each footer's own proportions) */
footer.unifoot[data-ffx] .flogo-link,footer[data-ffx] .footlogo{zoom:.77}
html body footer.la-footer[data-ffx] .fbrand img.flogo,html body footer.la-footer[data-ffx] img.flogo{width:77%!important;max-width:77%!important}
footer[data-ffx] .fsocial a,footer[data-ffx] .foot-social a{zoom:1.25}
/* Corey 2026-09-27 (products handoff): footer logo bigger and aligned with the copy under it, every page.
   Desktop only: ~255px of visible artwork whatever the logo file, its visible left edge on the paragraph's
   left edge (each file carries different transparent padding). Phones keep the flogo-fix sizes. */
@media (min-width:861px){
  html body footer[data-ffx] .fbrand a.flogo-link:not(#_){zoom:1!important;width:auto!important;display:block!important}
  html body footer[data-ffx] .fbrand img.flogo:not(#_){max-width:none!important}
  html body footer[data-ffx] .fbrand img.flogo:not(#_)[src*="launch-logo"]{width:339px!important}
  html body footer[data-ffx] .fbrand a.flogo-link:not(#_):has(img[src*="launch-logo"]){margin-left:-65px!important}
  html body footer[data-ffx] .fbrand img.flogo:not(#_)[src*="logo-ins-light"]{width:260px!important}
  html body footer[data-ffx] .fbrand a.flogo-link:not(#_):has(img[src*="logo-ins-light"]){margin-left:-2px!important;margin-top:-15px!important}
  html body footer[data-ffx] .fbrand img.flogo:not(#_)[src*="logo-footer."]{width:291px!important}
  html body footer[data-ffx] .fbrand a.flogo-link:not(#_):has(img[src*="logo-footer."]){margin-left:-26px!important}
}
/* One footer grid on every page (desktop): some pages carried this in page CSS, others didn't, so the brand
   column started 22px further right on /products, /ai, /free and /ai-command-center. */
@media (min-width:861px){html body footer.unifoot .fgrid:not(#_){grid-template-columns:2.25fr 1fr 1fr 1fr!important;max-width:none!important;padding-left:0!important;padding-right:0!important}}

/* 2026-11-09: the approved logo fills its canvas, unlike the retired artwork that
   carried large transparent side margins. Keep it aligned with the brand copy and
   close to half the oversized rendered width that the old padding rules produced. */
@media (min-width:861px){
  html body footer[data-ffx] .fbrand a.flogo-link:not(#_):has(img[src*="home-logo"]){width:270px!important;max-width:100%!important;margin:0 0 24px!important}
  html body footer[data-ffx] .fbrand img.flogo:not(#_)[src*="home-logo"]{width:270px!important;max-width:100%!important;height:auto!important;aspect-ratio:auto!important;object-fit:contain!important}
}
@media (max-width:860px){
  html body footer[data-ffx] .fbrand a.flogo-link:not(#_):has(img[src*="home-logo"]){width:190px!important;max-width:100%!important;margin:0 0 18px!important;zoom:1!important}
  html body footer[data-ffx] .fbrand img.flogo:not(#_)[src*="home-logo"]{width:190px!important;max-width:100%!important;height:auto!important;aspect-ratio:auto!important;object-fit:contain!important}
}

/* Command center: preserve the full sleeping-Einstein composition at every width. */
footer[data-ffx="einstein-dream"]{--ffx-stage:clamp(220px,30vw,576px);--ffx-poster:url(/img/footer-fx/einstein-dream-poster.jpg);background:#000!important}
footer[data-ffx="einstein-dream"] .ffx{height:clamp(220px,56.37vw,1080px);background-color:#000;background-size:contain;-webkit-mask-image:none;mask-image:none}
footer[data-ffx="einstein-dream"] .ffx video{object-fit:contain}
footer[data-ffx="einstein-dream"] .ffx::after{display:none}
@media(max-width:760px){
  footer[data-ffx="einstein-dream"]{--ffx-stage:292px}
  footer[data-ffx="einstein-dream"] .ffx{bottom:72px}
}