/* ===== Tema ===== */
:root{
  --bg:#ffffff;
  --text:#111;
  --muted:#555;
  --gold:rgba(212,175,55,.32); /* glow dorado más intenso */
}
body.dark{
  --bg:#0f1116;
  --text:#fff;
  --muted:#cfd1d6;
  --gold:rgba(212,175,55,.22);
}

/* ===== Base: una sola pantalla, sin scroll ===== */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;
  color:var(--text);
  /* Glow centrado + leve luz inferior */
  background:
    radial-gradient(56rem 18rem at 50% 45%, var(--gold) 0%, rgba(212,175,55,.12) 46%, transparent 72%),
    radial-gradient(70rem 26rem at 50% 88%, rgba(0,0,0,.06) 0%, transparent 70%),
    var(--bg);
  min-height:100svh;
  overflow:hidden; /* sin scroll */
  display:flex;align-items:center;justify-content:center;
}

/* ===== Layout absoluto dentro de la vista ===== */
.uc-wrap{ position:relative; width:min(980px,92vw); height:100svh; }

/* Logo fijo arriba, 20% menor (360 -> 288) */
.brand-logo{
  position:absolute; top:clamp(12px,3.6vh,28px); left:50%; transform:translateX(-50%);
  width:min(288px,45vw); height:auto;
  filter:drop-shadow(0 8px 22px rgba(0,0,0,.18));
}

/* Centro exacto: pantera + textos */
.center{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center;
}
.panther-toggle{ border:0; background:transparent; cursor:pointer; display:grid; place-items:center; }
.panther-toggle img{
  width:min(210px,42vw); height:auto;
  transition:transform .2s ease, filter .2s ease;
  filter:drop-shadow(0 10px 28px rgba(0,0,0,.18));
}
.panther-toggle:hover img{ transform:translateY(-2px) }

.uc-title{ font-weight:700; font-size:clamp(1.6rem,3.4vw,2.2rem); margin-top:8px; }
.subtitle{ color:var(--muted); font-size:clamp(1rem,2.2vw,1.12rem); }

/* Footer con margen visible dentro de la vista */
.site-footer{
  position:absolute; left:50%; bottom:clamp(20px,4.5vh,40px); transform:translateX(-50%);
  width:100%; display:flex; justify-content:center;
}
.footer-social{ display:flex; gap:18px; align-items:center; }
.social-icon{
  width:clamp(28px,4.8vw,42px); height:clamp(28px,4.8vw,42px);
  object-fit:contain; display:block;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.15));
  transition:transform .18s ease, filter .18s ease;
}
.social-icon:hover{ transform:translateY(-2px) scale(1.05) }

/* Ajustes móviles */
@media (max-width:520px){
  .brand-logo{ width:min(260px,60vw); }
}
