/* main app — composes all sections, framer-motion is global */
const { useEffect, useState } = React;
const { motion, AnimatePresence, useScroll, useTransform, useSpring, useMotionValue, useMotionValueEvent } = window.FramerMotion || window.Motion || window.framerMotion || {};

// Resolve framer-motion namespace (UMD exposes as `Motion`)
const FM = window.Motion || window.FramerMotion || {};
window.motion = FM.motion;
window.AnimatePresence = FM.AnimatePresence;
window.useScroll = FM.useScroll;
window.useTransform = FM.useTransform;
window.useSpring = FM.useSpring;
window.useMotionValue = FM.useMotionValue;
window.useMotionValueEvent = FM.useMotionValueEvent;
window.useInView = FM.useInView;

function App(){
  const [booted, setBooted] = useState(false);
  useEffect(()=>{
    const t = setTimeout(()=>{
      setBooted(true);
      const el = document.getElementById('boot');
      if(el) el.classList.add('gone');
      setTimeout(()=>el && el.remove(), 800);
    }, 600);
    return ()=>clearTimeout(t);
  },[]);

  return (
    <>
      <Nav />
      <Hero />
      <Services />
      <Ledger />
      <Cases />
      <Contact />
      <Footer />
    </>
  );
}

function Footer(){
  return (
    <footer style={{padding:'80px 32px 40px',borderTop:'1px solid rgba(245,235,211,.1)',marginTop:120}}>
      <div className="container" style={{display:'flex',justifyContent:'space-between',alignItems:'flex-end',gap:32,flexWrap:'wrap'}}>
        <div>
          <div className="bebas" style={{fontSize:64,lineHeight:.9,color:'#F5EBD3'}}>DIGITAL<br/>YK·FB</div>
          <div className="mono" style={{fontSize:11,opacity:.6,marginTop:12,letterSpacing:'.2em',textTransform:'uppercase'}}>cyber br · parceria jurídica</div>
        </div>
        <div className="mono" style={{fontSize:11,opacity:.5,letterSpacing:'.15em',textTransform:'uppercase',textAlign:'right'}}>
          <div>© 2026 YK·FB</div>
          <div>br / canal cifrado 24·7</div>
        </div>
      </div>
    </footer>
  );
}

ReactDOM.createRoot(document.getElementById('app')).render(<App/>);