/* === RESET === */
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Inter',sans-serif;background:#FFC727;color:#FF4B00;line-height:1.6;}

/* HERO */
.hero{display:flex;flex-direction:column;align-items:center;text-align:center;padding:80px 20px;position:relative;}
/* removed hero overlay */
.hero-icon{width:120px;height:120px;margin-bottom:25px;animation:spin 20s linear infinite;}@keyframes spin{from{transform:rotate(0);}to{transform:rotate(360deg);}}
.hero-title{font-size:3rem;font-weight:800;letter-spacing:4px;margin-bottom:10px;animation:pulse 2s ease-in-out infinite;text-shadow:2px 2px #FFC727;}@keyframes pulse{0%,100%{opacity:1;}50%{opacity:0.6;}}
.hero-tag{font-size:1.2rem;font-weight:600;max-width:600px;}
.hero-contract{margin-top:15px;font-size:0.9rem;background:#fff3;border-radius:4px;padding:6px 10px;display:inline-flex;gap:8px;align-items:center;color:#FF4B00;}
#copy-btn{background:#FF4B00;color:#FFC727;border:none;border-radius:3px;padding:4px 8px;font-size:0.8rem;cursor:pointer;}
#copy-btn:hover{background:#b93500;}

/* CONTAINER & BLOCKS */
.container{max-width:800px;margin:0 auto;padding:40px 20px;}
.block{margin-bottom:60px;background:rgba(255,255,255,0.65);padding:25px;border-radius:8px;color:#FF4B00;}
.block h2{font-size:1.5rem;font-weight:800;margin-bottom:15px;position:relative;display:inline-block;color:#FF4B00;}
.block h2::after{content:'';position:absolute;bottom:-5px;left:0;width:100%;height:3px;background:#FF4B00;opacity:0.6;}
.evidence-list{list-style:disc;padding-left:20px;}
.accent{font-weight:800;}
.small-note{font-size:0.85rem;opacity:0.9;margin-top:8px;}

/* FOOTER */
.footer{display:flex;flex-direction:column;align-items:center;text-align:center;padding:40px 20px;border-top:2px solid rgba(255,75,0,0.3);}
.footer-icon{width:50px;height:50px;margin-bottom:10px;}
.footer-text{font-size:0.9rem;font-weight:600;}

/***** ADDITION *****/
/* matrix canvas */
#matrix{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:0.3;mix-blend-mode:normal;}

/* raise content above canvas */
.hero,.container,.footer{position:relative;z-index:1;}

.warn{background:#FF4B00;color:#FFC727;padding:20px;border-radius:6px;margin-bottom:40px;text-align:center;box-shadow:0 4px 10px rgba(255,75,0,0.3);}
.warn-pre{font-family:'Courier New',monospace;font-size:1rem;white-space:pre-wrap;line-height:1.3;}

.sep{text-align:center;margin:40px 0;}
.sep img{width:40px;height:40px;opacity:0.8;animation:spin 15s linear infinite reverse;}
.toast{position:fixed;bottom:40px;left:50%;transform:translateX(-50%) scale(0.8);background:#FF4B00;color:#FFC727;padding:8px 16px;border-radius:6px;font-weight:600;opacity:0;transition:opacity 0.3s,transform 0.3s;z-index:5;}
.toast.show{opacity:1;transform:translateX(-50%) scale(1);}
/***** END ADDITION *****/ 

/* === GLITCH EFFECT === */
/* enhance glitch */
.glitch{position:relative;color:#FF4B00;font-weight:800;}
.glitch::before,.glitch::after{content:attr(data-text);position:absolute;left:0;top:0;width:100%;overflow:hidden;}
.glitch::before{left:2px;text-shadow:-2px 0 #FFC727;clip-path:inset(0 0 60% 0);animation:glitchTop 2s infinite linear alternate-reverse;}
.glitch::after{left:-2px;text-shadow:2px 0 #FFC727;clip-path:inset(60% 0 0 0);animation:glitchBottom 2s infinite linear alternate-reverse;}
@keyframes glitchTop{0%{transform:translateY(0);}20%{transform:translateY(-2px);}40%{transform:translateY(2px);}60%{transform:translateY(-2px);}80%{transform:translateY(2px);}100%{transform:translateY(0);}}
@keyframes glitchBottom{0%{transform:translateY(0);}20%{transform:translateY(2px);}40%{transform:translateY(-2px);}60%{transform:translateY(2px);}80%{transform:translateY(-2px);}100%{transform:translateY(0);}}

/* scanlines */
body::before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;background:repeating-linear-gradient( to bottom, rgba(0,0,0,0) 0px, rgba(0,0,0,0) 2px, rgba(0,0,0,0.05) 3px, rgba(0,0,0,0.05) 4px );z-index:2;mix-blend-mode:multiply;animation:scanmove 5s linear infinite;}
@keyframes scanmove{from{background-position:0 0;}to{background-position:0 100px;}}

/* flicker */
@keyframes flicker{0%,18%,22%,25%,53%,57%,100%{opacity:1;}20%,24%,55%{opacity:0.4;}}
.warn{animation:flicker 3s infinite;} 

/* === SOCIAL ICON === */
.social-link{display:inline-block;margin-top:12px;color:#FF4B00;transition:transform 0.3s;}
.social-link svg{display:block;width:28px;height:28px;fill:currentColor;}
.social-link:hover{transform:scale(1.1) rotate(3deg);} 

/* top twitter icon */
.social-top{position:absolute;top:20px;right:20px;color:#FF4B00;transition:transform 0.25s ease;z-index:3;}
.social-top:hover{transform:scale(1.15);color:#b93500;} 

/* --- CLEANER GLITCH EFFECT --- */
.mega-glitch{position:relative;display:inline-block;color:#FF4B00;font-weight:800;letter-spacing:4px;}
.mega-glitch::before,.mega-glitch::after{content:attr(data-text);position:absolute;left:0;top:0;width:100%;}
.mega-glitch::before{animation:glitchClip1 2.4s infinite linear alternate;text-shadow:-2px 0 #1DA1F2;}
.mega-glitch::after{animation:glitchClip2 3s infinite linear alternate;text-shadow:2px 0 #ff006e;} 
@keyframes glitchClip1{0%{clip-path:inset(0 0 80% 0);transform:translate(-2px,-2px);}25%{clip-path:inset(15% 0 60% 0);transform:translate(2px,2px);}50%{clip-path:inset(40% 0 35% 0);transform:translate(-2px,2px);}75%{clip-path:inset(65% 0 10% 0);transform:translate(2px,-2px);}100%{clip-path:inset(0 0 80% 0);transform:translate(-2px,-2px);}}
@keyframes glitchClip2{0%{clip-path:inset(80% 0 0 0);transform:translate(2px,2px);}25%{clip-path:inset(60% 0 15% 0);transform:translate(-2px,-2px);}50%{clip-path:inset(35% 0 40% 0);transform:translate(2px,-2px);}75%{clip-path:inset(10% 0 65% 0);transform:translate(-2px,2px);}100%{clip-path:inset(80% 0 0 0);transform:translate(2px,2px);}}

/* stronger visibility for matrix */
.hero,.container,.footer{position:relative;z-index:2;} 

/* matrix canvas tweak override */
#matrix{mix-blend-mode:normal;opacity:0.15;}

/* CTA */
.cta{text-align:center;}
.cta-btn{display:inline-block;margin-top:15px;background:#FF4B00;color:#FFC727;padding:10px 22px;border-radius:6px;font-weight:800;font-size:1rem;text-decoration:none;transition:background 0.3s,transform 0.3s;}
.cta-btn:hover{background:#b93500;transform:translateY(-2px);} 

/* === RESPONSIVE BREAKPOINTS === */
@media(max-width:600px){
  .hero{padding:60px 15px;}
  .hero-icon{width:80px;height:80px;margin-bottom:18px;}
  .hero-title{font-size:2.2rem;letter-spacing:2px;}
  .hero-tag{font-size:1rem;}
  .hero-contract{font-size:0.8rem;}
  .container{padding:30px 15px;}
  .block{padding:20px;margin-bottom:40px;}
  .block h2{font-size:1.25rem;}
  .footer{padding:30px 15px;}
  .footer-icon{width:40px;height:40px;}
  .footer-text{font-size:0.8rem;}
  .social-top{top:12px;right:12px;}
}

@media(min-width:1024px){
  .hero{padding:120px 20px;}
  .hero-icon{width:160px;height:160px;}
  .hero-title{font-size:4rem;}
  .hero-tag{font-size:1.4rem;}
  .container{max-width:1000px;}
  .block h2{font-size:1.75rem;}
} 