:root{
      --ink:#111827;      /* slate-900 */
      --paper:#fff7ed;    /* orange-50-ish */
      --paper2:#ffffff;
      --teal:#34D399;     /* teal-300 */
      --pink:#67E8F9;     /* cyan-300 */
      --yellow:#FDE047;   /* yellow-300 */
      --blue:#2563EB;     /* blue-400 */
      --lime:#A3E635;     /* lime-400 */
      --violet:#93C5FD;   /* violet-300 */
    }

    body{
      color: var(--ink);
      font-family: Inter, ui-sans-serif, system-ui;
      background:
        radial-gradient(circle at 18% 18%, rgba(94,234,212,.42), transparent 42%),
        radial-gradient(circle at 85% 10%, rgba(244,114,182,.28), transparent 48%),
        radial-gradient(circle at 50% 92%, rgba(253,224,71,.22), transparent 52%),
        linear-gradient(180deg, #ffffff, var(--paper));
    }

    /* “Outlined / sticker” feel */
    .outline-3{ border-radius: 1.125rem;
  box-shadow: 0 0 0 3px var(--ink); }
    .outline-2{ border-radius: 1.125rem;
  box-shadow: 0 0 0 2px var(--ink); }
    .sticker{ border-radius: 1.125rem;
  box-shadow: 0 0 0 3px var(--ink), 7px 7px 0 0 var(--ink); }
    .sticker-sm{ border-radius: 1.125rem;
  box-shadow: 0 0 0 2px var(--ink), 5px 5px 0 0 var(--ink); }

    /* Grain overlay */
    .grain::before{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      background-image:url("./assets/noise.svg");
      background-size:240px 240px;
      mix-blend-mode:multiply;
      opacity:.32;
      z-index:-1;
    }

    /* Marquee */
    .marquee{ overflow:hidden; white-space:nowrap; }
    .marquee > div{
      display:inline-block;
      padding-left:100%;
      animation: scroll 18s linear infinite;
    }
    @keyframes scroll{
      0%{ transform: translateX(0); }
      100%{ transform: translateX(-100%); }
    }

    /* Fun underline */
    .squig{
      text-decoration: underline;
      text-decoration-thickness: .22em;
      text-underline-offset: .18em;
      text-decoration-color: rgba(17,24,39,.18);
    }


/* Sticky header only when scrolling (avoids "efecto raro" en reposo) */
.rw-header--fixed{
  position: sticky; /* mantiene layout estable */
  top: 0;
  z-index: 50;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  background: rgba(255, 255, 255, 0.55);
  border-radius: 1.125rem;
  box-shadow: 0 10px 30px rgba(0,0,0,0.10);
}


/* Announcement bar should be square (no rounded corners) */
.announcement-bar.outline-3{ border-radius: 0 !important; }