/* =========================
   RioCatch Mobile League
   Global styles (shared)
   ========================= */

:root{
  --rc-bg0:#07080b;
  --rc-bg1:#0b1020;
  --rc-ink:#edf1ff;
  --rc-dim:#b7bfdc;

  --rc-forest:#14331f;
  --rc-acai:#4a1f4d;
  --rc-sand:#f1e6cf;
  --rc-lime:#b9ff3e;

  --rc-line: rgba(237,241,255,.14);
  --rc-line2: rgba(241,230,207,.18);

  --rc-radius-xl: 28px;
  --rc-radius-lg: 18px;
  --rc-radius-md: 14px;

  --rc-shadow: 0 16px 50px rgba(0,0,0,.35);
  --rc-shadow2: 0 10px 24px rgba(0,0,0,.28);

  --rc-header-h: 74px;

  --rc-font-ui: "RC Space Grotesk", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --rc-font-mono: "RC IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}

@font-face{
  font-family:"RC Space Grotesk";
  src:url("../fonts/SpaceGrotesk-Regular.ttf") format("truetype");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"RC Space Grotesk";
  src:url("../fonts/SpaceGrotesk-SemiBold.ttf") format("truetype");
  font-weight:600;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"RC IBM Plex Mono";
  src:url("../fonts/IBMPlexMono-Regular.ttf") format("truetype");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family:var(--rc-font-ui);
  color:var(--rc-ink);
  background:
    radial-gradient(1200px 700px at 18% 5%, rgba(74,31,77,.55), transparent 60%),
    radial-gradient(900px 600px at 82% 18%, rgba(20,51,31,.55), transparent 58%),
    radial-gradient(700px 460px at 65% 85%, rgba(185,255,62,.10), transparent 60%),
    linear-gradient(180deg, var(--rc-bg0), var(--rc-bg1));
  overflow-x:hidden;
}

img{
  display:block;
  max-width:100%;
  height:auto;
}

a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; }

.rc-skip{
  position:absolute;
  left:-9999px;
  top:auto;
  width:1px;height:1px;
  overflow:hidden;
}
.rc-skip:focus{
  left:12px;
  top:12px;
  width:auto;height:auto;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(241,230,207,.14);
  border:1px solid var(--rc-line2);
  z-index:9999;
}

.rc-shell{
  width:min(1180px, calc(100% - 40px));
  margin:0 auto;
}

.rc-main{
  padding-top: var(--rc-header-h);
}

/* Header */
.rc-header{
  position:fixed;
  top:0; left:0; right:0;
  height: var(--rc-header-h);
  z-index:2000;
  border-bottom:1px solid rgba(237,241,255,.10);
  background: linear-gradient(180deg, rgba(7,8,11,.88), rgba(7,8,11,.55));
  backdrop-filter: blur(10px);
}

.rc-header__inner{
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.rc-header__glow{
  position:absolute;
  inset:auto 0 0 0;
  height:2px;
  background:
    linear-gradient(90deg, transparent, rgba(185,255,62,.55), rgba(241,230,207,.35), rgba(74,31,77,.55), transparent);
  opacity:.85;
}

.rc-brand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width: 220px;
}
.rc-brand__mark{
  width:38px;height:38px;
  border-radius:14px;
  position:relative;
  background: linear-gradient(135deg, rgba(185,255,62,.18), rgba(74,31,77,.22));
  border:1px solid rgba(237,241,255,.14);
  box-shadow: var(--rc-shadow2);
  overflow:hidden;
}
.rc-mark__ring{
  position:absolute;
  inset:8px;
  border-radius:999px;
  border:1px solid rgba(241,230,207,.28);
}
.rc-mark__dot{
  position:absolute;
  width:8px;height:8px;
  border-radius:99px;
  background: rgba(185,255,62,.95);
  top:10px; left:10px;
  box-shadow: 0 0 0 6px rgba(185,255,62,.10);
}
.rc-mark__wave{
  position:absolute;
  left:-30%;
  right:-30%;
  bottom:6px;
  height:10px;
  background: linear-gradient(90deg, rgba(185,255,62,.0), rgba(185,255,62,.45), rgba(241,230,207,.18), rgba(185,255,62,.0));
  transform: rotate(-8deg);
  animation: rcWave 2.8s ease-in-out infinite;
}
@keyframes rcWave{
  0%{ transform: translateX(-6%) rotate(-8deg); opacity:.55; }
  50%{ transform: translateX(6%) rotate(-8deg); opacity:.95; }
  100%{ transform: translateX(-6%) rotate(-8deg); opacity:.55; }
}

.rc-brand__text{ display:flex; flex-direction:column; line-height:1.05; }
.rc-brand__name{ font-weight:600; letter-spacing:.2px; }
.rc-brand__sub{
  font-family:var(--rc-font-mono);
  color:var(--rc-dim);
  font-size:12px;
  letter-spacing:.6px;
  text-transform:uppercase;
}

/* Nav */
.rc-nav{ display:flex; align-items:center; }
.rc-nav__toggle{
  display:none;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(237,241,255,.12);
  background: rgba(7,8,11,.35);
  color:var(--rc-ink);
  cursor:pointer;
}
.rc-nav__toggleText{
  font-family:var(--rc-font-mono);
  font-size:12px;
  letter-spacing:.7px;
  text-transform:uppercase;
  color:var(--rc-dim);
}
.rc-nav__glyph{
  display:grid;
  gap:4px;
}
.rc-nav__g{
  width:18px;height:2px;
  background: linear-gradient(90deg, rgba(185,255,62,.9), rgba(241,230,207,.35));
  border-radius:99px;
}

.rc-nav__panel{
  display:flex;
  align-items:stretch;
  gap:10px;
}
.rc-nav__link{
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:10px 12px;
  border-radius:16px;
  border:1px solid rgba(237,241,255,.10);
  background: rgba(7,8,11,.18);
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
.rc-nav__link:hover{
  transform: translateY(-2px);
  border-color: rgba(185,255,62,.35);
  background: rgba(185,255,62,.06);
}
.rc-nav__cap{ font-weight:600; font-size:13px; letter-spacing:.2px; }
.rc-nav__desc{
  font-family:var(--rc-font-mono);
  font-size:11px;
  color:var(--rc-dim);
  letter-spacing:.6px;
  text-transform:uppercase;
}
.rc-nav__link.is-active{
  border-color: rgba(185,255,62,.55);
  background: linear-gradient(135deg, rgba(185,255,62,.10), rgba(74,31,77,.08));
  box-shadow: 0 10px 24px rgba(0,0,0,.22);
}

.rc-nav__status{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:8px 10px;
  border-radius:16px;
  border:1px dashed rgba(241,230,207,.22);
  background: rgba(241,230,207,.05);
  min-width: 190px;
}
.rc-nav__meter{
  height:10px;
  border-radius:99px;
  border:1px solid rgba(237,241,255,.10);
  background: rgba(7,8,11,.28);
  overflow:hidden;
}
.rc-nav__meterFill{
  display:block;
  height:100%;
  width:0%;
  background: linear-gradient(90deg, rgba(185,255,62,.95), rgba(241,230,207,.60), rgba(74,31,77,.55));
  border-radius:99px;
}
.rc-nav__micro{
  margin:8px 0 0;
  font-size:12px;
  color:var(--rc-dim);
  line-height:1.25;
}

/* Footer */
.rc-footer{
  margin-top: 70px;
  border-top:1px solid rgba(237,241,255,.10);
  background: linear-gradient(180deg, rgba(7,8,11,.25), rgba(7,8,11,.55));
}
.rc-footer__inner{
  padding:28px 0 24px;
}
.rc-footer__cols{
  display:grid;
  grid-template-columns: 1.2fr .6fr 1fr;
  gap:18px;
}
.rc-footer__logo{
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.rc-footer__mark{
  width:12px;height:12px;
  border-radius:99px;
  background: rgba(185,255,62,.95);
  box-shadow: 0 0 0 8px rgba(185,255,62,.10);
}
.rc-footer__name{ font-weight:600; letter-spacing:.2px; }
.rc-footer__note{
  margin:10px 0 12px;
  color:var(--rc-dim);
  line-height:1.55;
  max-width: 46ch;
}
.rc-footer__top{
  display:inline-flex;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(241,230,207,.22);
  background: rgba(241,230,207,.06);
  transition: transform .2s ease, border-color .2s ease;
}
.rc-footer__top:hover{ transform: translateY(-2px); border-color: rgba(185,255,62,.35); }

.rc-footer__title{
  font-family:var(--rc-font-mono);
  font-size:12px;
  letter-spacing:.8px;
  text-transform:uppercase;
  color:rgba(241,230,207,.85);
  margin:0 0 10px;
}
.rc-footer__link{
  display:block;
  padding:8px 0;
  color:var(--rc-dim);
  border-bottom:1px solid rgba(237,241,255,.08);
}
.rc-footer__link:hover{ color: var(--rc-ink); }

.rc-footer__list{
  margin:0;
  padding-left:18px;
  color:var(--rc-dim);
  line-height:1.6;
}
.rc-footer__bar{
  margin-top:18px;
  padding-top:14px;
  border-top:1px solid rgba(237,241,255,.08);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.rc-footer__copy{
  margin:0;
  color:var(--rc-dim);
  font-size:12px;
}
.rc-footer__pulse{
  display:flex;
  gap:8px;
}
.rc-footer__p{
  width:10px;height:10px;
  border-radius:99px;
  border:1px solid rgba(241,230,207,.25);
  background: rgba(185,255,62,.10);
  animation: rcPulse 1.8s ease-in-out infinite;
}
.rc-footer__p:nth-child(2){ animation-delay:.18s; }
.rc-footer__p:nth-child(3){ animation-delay:.36s; }
@keyframes rcPulse{
  0%{ transform: translateY(0); opacity:.45; }
  50%{ transform: translateY(-4px); opacity:.95; }
  100%{ transform: translateY(0); opacity:.45; }
}

/* Reveal */
[data-rc-reveal]{
  opacity:0;
  transform: translateY(10px);
  transition: opacity .6s ease, transform .6s ease;
}
.is-inview[data-rc-reveal]{
  opacity:1;
  transform: translateY(0);
}

/* Responsive */
@media (max-width: 980px){
  .rc-footer__cols{ grid-template-columns: 1fr 1fr; }
  .rc-nav__status{ display:none; }
}
@media (max-width: 780px){
  .rc-shell{ width:min(1180px, calc(100% - 28px)); }
  .rc-nav__toggle{ display:flex; }
  .rc-nav__panel{
    position:absolute;
    right:14px;
    top: calc(var(--rc-header-h) - 6px);
    width: min(340px, calc(100vw - 28px));
    display:none;
    flex-direction:column;
    padding:12px;
    border-radius:18px;
    border:1px solid rgba(237,241,255,.14);
    background: rgba(7,8,11,.92);
    box-shadow: var(--rc-shadow);
  }
  .rc-nav__panel.is-open{ display:flex; }
}
@media (max-width: 520px){
  :root{ --rc-header-h: 70px; }
  .rc-brand{ min-width: auto; }
  .rc-brand__sub{ display:none; }
  .rc-footer__cols{ grid-template-columns: 1fr; }
}
