/* medgh Base — reset, body, scrollbar, screen-reader utility */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: 80px;
  font-size: 16px;
}

::selection        { background: rgba(107,71,255,0.35); color: #fff; }
::-moz-selection   { background: rgba(107,71,255,0.35); color: #fff; }

body {
  background:              var(--bg);
  color:                   var(--text);
  font-family:             var(--f-body);
  line-height:             1.6;
  overflow-x:              hidden;
  -webkit-font-smoothing:  antialiased;
}

body::-webkit-scrollbar       { width: 8px; }
body::-webkit-scrollbar-track { background: var(--bg); }
body::-webkit-scrollbar-thumb { background: var(--bg-3); border-radius: 4px; }
body::-webkit-scrollbar-thumb:hover { background: var(--surface-2); }

img, svg { display: block; }
a        { color: inherit; }
button, input { font-family: inherit; caret-color: var(--primary); }

.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;
}

/* Dot grid texture on body */
body::before {
  content: '';
  position: fixed; inset: 0; z-index: 0;
  background-image: radial-gradient(circle, rgba(255,255,255,0.035) 1px, transparent 1px);
  background-size: 36px 36px;
  pointer-events: none;
}

/* Scroll reveal */
[data-r] {
  opacity: 0; transform: translateY(28px);
  transition: opacity 0.72s var(--ease), transform 0.72s var(--ease);
}
[data-r].in              { opacity: 1; transform: none; }
[data-r][data-d="1"]     { transition-delay: 0.08s; }
[data-r][data-d="2"]     { transition-delay: 0.16s; }
[data-r][data-d="3"]     { transition-delay: 0.24s; }
[data-r][data-d="4"]     { transition-delay: 0.32s; }
[data-r][data-d="5"]     { transition-delay: 0.40s; }