/* ════════════════════════════════════════════════════════════════
   UNIVERSO GRAVITAS · EL POZO
   Sala de control: letra condensada industrial, lecturas en
   monoespaciada, ámbar de señal. A la derecha, la caña del pozo:
   la masa baja mientras lees y la lectura cambia como en el simulador.
   ════════════════════════════════════════════════════════════════ */
.u-gravitas {
  --g-fondo: #08090b;
  --g-panel: #0f1114;
  --g-panel-2: #14171b;
  --g-linea: #23262c;
  --g-linea-2: #343840;
  --g-ambar: #ffc21a;
  --g-ambar-2: #ffd968;
  --g-cian: #3fd0d0;
  --g-texto: #ebe9e4;
  --g-texto-2: #c3c6cb;
  --g-mudo: #8b9199;
  --g-display: 'Barlow Condensed', 'Noto Sans', sans-serif;
  --g-mono: 'JetBrains Mono', 'Noto Sans Mono', monospace;
  --acento: #ffd968;
  /* El marco común toma el fondo y las líneas del universo */
  --fondo: var(--g-fondo); --cabecera: var(--g-fondo); --borde: var(--g-linea); --borde-fuerte: var(--g-linea-2); --hueco: #181b20; --mudo: var(--g-mudo);
  background: var(--g-fondo);
}
.u-gravitas main { color: var(--g-texto); }
.u-gravitas ::selection { background: var(--g-ambar); color: #000; }

.g-hero { position: relative; border-bottom: 1px solid var(--g-linea); overflow: hidden; }
.g-hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(90deg, transparent 0 119px, rgba(255, 255, 255, .025) 119px 120px),
              linear-gradient(180deg, transparent 60%, rgba(255, 194, 26, .05));
}
.g-hero-in { position: relative; max-width: 1180px; margin: 0 auto; padding: clamp(48px, 7vw, 96px) var(--margen) 40px; }
.g-kicker { display: flex; align-items: center; gap: 10px; font: 500 12px/1.4 var(--g-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--g-ambar); }
.g-kicker::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--g-ambar); box-shadow: 0 0 10px var(--g-ambar); }
.g-titulo { margin-top: 18px; font: 700 clamp(64px, 11vw, 148px)/.86 var(--g-display); letter-spacing: -.01em; text-transform: uppercase; color: #fff; }
.g-titulo span { display: block; }
.g-titulo span:last-child { color: var(--g-ambar); }
.g-dek { margin-top: 26px; max-width: 36ch; font: 400 clamp(20px, 2.2vw, 26px)/1.3 var(--g-display); color: var(--g-texto-2); }
.g-lecturas { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin-top: 44px; border-top: 1px solid var(--g-linea-2); border-bottom: 1px solid var(--g-linea-2); }
.g-lecturas > div { padding: 16px 16px 16px 0; }
.g-lecturas > div + div { padding-left: 16px; border-left: 1px solid var(--g-linea); }
.g-lecturas dt { font: 500 10.5px/1.4 var(--g-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--g-mudo); }
.g-lecturas dd { margin: 6px 0 0; font: 600 clamp(20px, 2.4vw, 30px)/1.1 var(--g-mono); color: var(--g-ambar); white-space: nowrap; }

.g-cuerpo { max-width: 1180px; margin: 0 auto; padding: 0 var(--margen) 96px; display: grid; grid-template-columns: minmax(0, 1fr) 240px; gap: 72px; }
.g-texto { max-width: 720px; padding-top: 24px; }
.g-sec { padding-top: 56px; scroll-margin-top: 16px; }
.g-sec h2 { display: flex; align-items: baseline; gap: 14px; margin-bottom: 22px; font: 700 clamp(30px, 3.6vw, 42px)/1 var(--g-display); letter-spacing: .005em; text-transform: uppercase; color: #fff; }
.g-sec h2 small { font: 500 13px/1 var(--g-mono); letter-spacing: .1em; color: var(--g-ambar); }
.g-texto p { margin-bottom: 18px; font-size: 17px; line-height: 1.75; color: var(--g-texto-2); }
.g-texto strong { color: #fff; font-weight: 600; }
.g-texto em { color: var(--g-texto); }
.g-texto p a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; text-decoration-color: color-mix(in oklab, currentColor 50%, transparent); }
.g-entradilla { font-size: 19px !important; color: var(--g-texto) !important; }
.g-formula { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 18px 28px; align-items: center; margin: 26px 0; padding: 22px 24px; border: 1px solid var(--g-linea-2); border-radius: 4px; background: var(--g-panel); }
.g-formula code { font: 600 clamp(22px, 2.4vw, 28px)/1.1 var(--g-mono); color: var(--g-ambar); white-space: nowrap; }
.g-formula p { margin: 0 !important; font-size: 15.5px !important; line-height: 1.65 !important; }
.g-pantalla { margin: 28px 0 22px; border: 1px solid var(--g-linea-2); border-radius: 4px; background: #000; }
.g-pantalla-cab { display: flex; justify-content: space-between; gap: 12px; padding: 10px 14px; border-bottom: 1px solid var(--g-linea); font: 500 11px/1.4 var(--g-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--g-mudo); }
.g-pantalla-cab b { display: inline-flex; align-items: center; gap: 8px; color: var(--g-ambar); font-weight: 500; }
.g-pantalla-cab b::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #ff4a3d; animation: g-latido 1.6s ease-in-out infinite; }
@keyframes g-latido { 50% { opacity: .2; } }
.g-pantalla video { width: 100%; aspect-ratio: 16 / 9; background: #000; }
.g-pantalla figcaption { padding: 12px 14px; border-top: 1px solid var(--g-linea); font-size: 13.5px; line-height: 1.6; color: var(--g-mudo); }
.g-alerta { margin: 28px 0; padding: 20px 22px; border: 1px solid rgba(255, 194, 26, .4); border-left: 4px solid var(--g-ambar); border-radius: 4px; background: rgba(255, 194, 26, .05); }
.g-texto .g-alerta-tit { margin-bottom: 10px; font: 600 12px/1.4 var(--g-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--g-ambar); }
.g-alerta p { font-size: 16px !important; margin-bottom: 12px !important; }
.g-alerta p:last-child { margin-bottom: 0 !important; }
.g-texto .g-cifra { margin: 34px 0; padding: 26px 0; border-top: 1px solid var(--g-linea-2); border-bottom: 1px solid var(--g-linea-2); }
.g-cifra b { display: block; font: 700 clamp(72px, 13vw, 160px)/.9 var(--g-mono); letter-spacing: -.04em; color: var(--g-ambar); text-shadow: 0 0 40px rgba(255, 194, 26, .25); }
.g-cifra span { display: block; margin-top: 12px; font: 500 13px/1.5 var(--g-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--g-mudo); }
.g-texto .g-cierre { margin-top: 56px; padding-top: 32px; border-top: 1px solid var(--g-linea-2); font: 700 clamp(36px, 5vw, 58px)/.98 var(--g-display); text-transform: uppercase; color: #fff; }
.g-cierre span { color: var(--g-ambar); }
.g-nota { margin-top: 28px !important; font-size: 13.5px !important; color: var(--g-mudo) !important; }

/* La caña del pozo */
.g-pozo { position: sticky; top: 20px; align-self: start; height: calc(100vh - 40px); max-height: 860px; padding-top: 24px; display: flex; flex-direction: column; gap: 14px; }
.g-pozo-tit { font: 500 10.5px/1.4 var(--g-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--g-mudo); }
.g-pozo-caja { position: relative; flex: 1 1 auto; display: grid; grid-template-columns: 54px 44px; gap: 10px; min-height: 280px; }
.g-escala { position: relative; }
.g-escala span { position: absolute; right: 0; transform: translateY(-50%); font: 500 10.5px/1 var(--g-mono); color: var(--g-mudo); }
.g-escala span::after { content: ""; display: inline-block; width: 6px; height: 1px; margin-left: 5px; vertical-align: middle; background: var(--g-linea-2); }
.g-cana {
  position: relative; overflow: hidden; border-left: 2px solid var(--g-linea-2); border-right: 2px solid var(--g-linea-2);
  background: repeating-linear-gradient(180deg, rgba(255, 255, 255, .02) 0 2px, transparent 2px 22px), #050607;
}
.g-cable { position: absolute; left: 50%; top: 0; width: 1px; height: calc(var(--p, 0) * (100% - 44px) + 4px); background: var(--g-mudo); transform: translateX(-.5px); }
.g-masa {
  position: absolute; left: 7px; right: 7px; height: 40px; top: calc(var(--p, 0) * (100% - 44px) + 4px);
  border-radius: 2px; background: linear-gradient(180deg, var(--g-ambar-2), var(--g-ambar) 60%, #c28c00);
  box-shadow: 0 0 18px rgba(255, 194, 26, .35);
}
.g-lectura { display: grid; grid-template-columns: auto 1fr; gap: 4px 10px; padding: 12px; border: 1px solid var(--g-linea-2); border-radius: 4px; background: var(--g-panel); font: 500 11px/1.5 var(--g-mono); }
.g-lectura dt { color: var(--g-cian); letter-spacing: .06em; }
.g-lectura dd { margin: 0; color: var(--g-texto); text-align: right; white-space: nowrap; }
.g-lectura .ambar { color: var(--g-ambar); }

@media (max-width: 960px) {
  .g-cuerpo { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .g-pozo { display: none; }
  .g-lecturas { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .g-lecturas > div:nth-child(4) { border-left: 0; padding-left: 0; }
  .g-lecturas > div:nth-child(n+4) { border-top: 1px solid var(--g-linea); }
}
@media (max-width: 640px) {
  .g-formula { grid-template-columns: minmax(0, 1fr); }
  .g-lecturas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .g-lecturas > div:nth-child(n) { padding-left: 0; border-left: 0; }
  .g-lecturas > div:nth-child(even) { padding-left: 16px; border-left: 1px solid var(--g-linea); }
  .g-lecturas > div:nth-child(n+3) { border-top: 1px solid var(--g-linea); }
}
@media (prefers-reduced-motion: reduce) { .g-pantalla-cab b::before { animation: none; } }