:root{
--ink:#1A2519;
--ink-2:#0F1410;
--accent:#ABC8A3;
--accent-light:#C5DEC2;
--accent-pale:#E8F3E5;
--paper:#FFFFFF;
--muted:#6B7A6F;
--divider:#D4E0D0;
}
html{scroll-behavior:smooth;}
body{background:var(--ink); font-family:'IBM Plex Sans Arabic', sans-serif; color:var(--paper); overflow-x: hidden;}
.font-display{font-family:'Markazi Text', serif;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;}
.sr-only.focus\:not-sr-only:focus{position:static;width:auto;height:auto;padding:inherit;margin:inherit;overflow:visible;clip:auto;white-space:normal;background:var(--accent);color:var(--ink);padding:0.5rem 1rem;z-index:50;}
.fade-in{opacity:0;transform:translateY(22px);transition:opacity .9s cubic-bezier(.19,1,.22,1), transform .9s cubic-bezier(.19,1,.22,1);}
.fade-in.is-visible{opacity:1;transform:translateY(0);}
.stagger-1{transition-delay:.05s;} .stagger-2{transition-delay:.15s;} .stagger-3{transition-delay:.25s;} .stagger-4{transition-delay:.35s;}
.hairline{border-color:var(--divider);}
.lift{transition:transform .45s cubic-bezier(.19,1,.22,1), border-color .45s ease, box-shadow .45s ease;}
.lift:hover{transform:translateY(-6px);border-color:var(--accent-light);box-shadow:0 20px 40px -20px rgba(0,0,0,.6);}
.btn{border-radius:0.5rem; display:inline-flex; align-items:center; justify-content:center; gap:0.5rem; transition:transform .35s cubic-bezier(.19,1,.22,1), background-color .35s ease, box-shadow .35s ease;}
.btn:hover{transform:translateY(-3px);box-shadow:0 14px 30px -12px rgba(171,200,163,.45);}
.btn:focus-visible{outline:2px solid var(--accent-light);outline-offset:2px;}
.frame{position:relative;border:1px solid var(--divider);}
.frame::before{content:"";position:absolute;inset:8px;border:1px solid var(--divider);pointer-events:none; z-index:10; border-radius:inherit;}
.hide-scrollbar::-webkit-scrollbar{display:none;}
.hide-scrollbar{-ms-overflow-style:none; scrollbar-width:none;}
@media (prefers-reduced-motion: reduce){
.fade-in{opacity:1;transform:none;transition:none;}
.lift:hover, .btn:hover{transform:none;}
html{scroll-behavior:auto;}
}