*,*::before,*::after{box-sizing:border-box;}
html,body{margin:0;padding:0;}
h1,h2,h3,h4,h5,h6,p{margin:0;padding:0;}
html{direction:rtl;}
body{
  font-family:var(--font-body);
  background:var(--c-dark-blue);
  color:var(--c-text-navy);
  overflow-x:hidden;
  min-height:100vh;
}
img{display:block;max-width:none;border:0;}
a{text-decoration:none;color:inherit;}
button,input{font-family:inherit;}
button{cursor:pointer;border:none;background:none;padding:0;color:inherit;}

/* Scaled-stage system (lesson VV from claude-html.md) */
.stage-d,.stage-m{position:relative;width:100%;overflow:hidden;}
.stage-m{display:none;}
@media (max-width:1024px){
  .stage-d{display:none;}
  .stage-m{display:block;}
}
.inner-d{
  position:absolute;top:0;left:0;
  width:1920px;
  transform:scale(calc(100vw / 1920px));
  transform-origin:top left;
}
.inner-m{
  position:absolute;top:0;left:0;
  width:375px;
  transform:scale(calc(100vw / 375px));
  transform-origin:top left;
}

/* Shared marquee animation (used by lp + thanks pages).
   Track contains 2 duplicate spans → shifting by -50% of track width swaps copy1 for copy2 seamlessly. */
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}