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

/* Hard stop for accidental horizontal scrolling on mobile (iOS/Android) */
html{
  width: 100%;
  overflow-x: hidden;
  background: #06080c;
  overscroll-behavior-x: none;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:0.22;
  background-image:
    radial-gradient(rgba(255,255,255,0.16) 1px, transparent 1px);
  background-size: 24px 24px;
  mix-blend-mode: overlay;
  z-index:-1;
}

/* diagonal line pattern overlay */
body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:0.10;
  background-image:
    linear-gradient(135deg, rgba(255,255,255,0.20) 1px, transparent 1px);
  background-size: 46px 46px;
  mix-blend-mode: overlay;
  z-index:-1;
}


body {
  font-family: var(--font-regular);
  background-image:
    var(--page-bg-image, none),
    radial-gradient(1200px 700px at 18% -10%, rgba(193,18,31,0.22), transparent 58%),
    radial-gradient(900px 600px at 88% 0%, rgba(255,255,255,0.12), transparent 60%),
    linear-gradient(180deg, var(--bg-top), var(--bg));
  background-size: cover, auto, auto, auto;
  background-position: center, center, center, center;
  background-attachment: fixed, scroll, scroll, scroll;
  color: var(--text);
  line-height: 1.6;
  min-height: 100vh;
  overflow-x: hidden;
  /* prevents iOS rubber-band from revealing dark gutter */
  overscroll-behavior-x: none;
  position: relative;
  padding-top: 114px; /* fixed header offset */
}

/* Mobile browsers (especially iOS) can glitch with fixed backgrounds and show dark gutters on swipe */
@media (max-width: 768px){
  body{ background-attachment: scroll, scroll, scroll, scroll; }
}

body.has-hero{ padding-top: 0; }

/* no light theme */

a {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

img {
  width: 100%;
  display: block;
}

.container {
  width: min(1440px, calc(100% - 32px));
  margin: 0 auto;
}

/* Reduce motion accessibility */
@media (prefers-reduced-motion: reduce){
  *{ scroll-behavior: auto !important; }
  .pulse, .floaty{ animation: none !important; }
}
