*,*::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:#fff;
  color:var(--c-text-navy);
  overflow-x:hidden;
}
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;}

/* ---- Scaled-stage system ----
   Each section has a desktop stage (base 1920) and a mobile stage (base 375).
   The outer .stage-* sets the responsive height; the inner .inner-* holds
   the exact Figma px layout and is uniformly scaled to fit the viewport width. */
.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;
}

/* Generic absolute helper */
.abs{position:absolute;}