:root{
  /* ============================
     RS2 BRAND COLORS (CORE)
  ============================ */
  --rs2-dark:#0B2F4A;
  --rs2-core:#0F4C81;
  --rs2-glow:#4FB3FF;
  --rs2-orange:#FF7A18;

  /* ============================
     RS2 NEUTRALS (ELITE SCALE)
  ============================ */
  --rs2-white:#FFFFFF;
  --rs2-soft:#EAF2F8;
  --rs2-steel:#8FA3B5;
  --rs2-muted: rgba(234,242,248,.75);
  --rs2-faint: rgba(234,242,248,.55);

  /* ============================
     RADII SYSTEM
  ============================ */
  --radius-xs:8px;
  --radius-sm:12px;
  --radius-lg:16px;
  --radius-xl:24px;
  --radius-pill:999px;

  /* ============================
     SHADOW SYSTEM (DEPTH)
  ============================ */
  --shadow-soft: 0 18px 45px rgba(0,0,0,.28);
  --shadow-hard: 0 26px 70px rgba(0,0,0,.35);
  --shadow-glow: 0 0 0 1px rgba(79,179,255,.18),
                 0 12px 36px rgba(79,179,255,.22);

  /* ============================
     LAYOUT
  ============================ */
  --container: 1200px;

  /* ============================
     MOTION (ELITE FEEL)
  ============================ */
  --ease-out: cubic-bezier(.22,1,.36,1);
  --ease-soft: cubic-bezier(.25,.8,.25,1);
  --speed-fast: .15s;
  --speed-base: .25s;
  --speed-slow: .4s;

  /* ============================
     Z-INDEX SCALE (ORDER)
  ============================ */
  --z-base:1;
  --z-header:100;
  --z-overlay:900;
  --z-drawer:1000;
  --z-modal:1100;
}


/* Base reset suave */
*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  color:var(--rs2-white);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, sans-serif;
  background:
    radial-gradient(900px 500px at 50% -10%, rgba(79,179,255,.25), transparent 60%),
    radial-gradient(700px 450px at 20% 10%, rgba(15,76,129,.35), transparent 55%),
    radial-gradient(900px 600px at 80% 30%, rgba(11,47,74,.55), transparent 60%),
    linear-gradient(180deg, #061f33 0%, var(--rs2-dark) 55%, #051a2b 100%);
  overflow-x:hidden;
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; }

/* Helpers */
.container{
  width:min(var(--container), calc(100% - 48px)) !important;
  margin-inline:auto !important;
}

.section{
  padding: 80px 0;
}

.kicker{
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:700;
  font-size:.8rem;
  color: rgba(234,242,248,.78);
}

.h2{
  font-size: clamp(1.7rem, 2.5vw, 2.4rem);
  font-weight: 900;
  margin: 14px 0 0;
}

.p-muted{
  color: rgba(234,242,248,.75);
  line-height: 1.7;
}

.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.hr-soft{
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(79,179,255,.35), transparent);
  border:0;
  margin: 24px 0;
}

/* Fondo tipo "noise" sin imagen (IIS-safe) */
.noise{
  position: relative;
}
.noise::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 22px 22px;
  opacity:.05;
  mix-blend-mode: overlay;
}