/* Páginas interiores y secciones comunes */
.sec { position: relative; padding-block: clamp(64px, 10vw, 128px); }
.sec__cab { max-width: 760px; margin-bottom: 2.5rem; }
.sec__intro { color: var(--tx2); font-size: clamp(1.02rem, 1.4vw, 1.2rem); max-width: 62ch; }
.eyebrow { margin: 0 0 .8rem; color: var(--lava); font-family: var(--f-mono); font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; }
.grupo-t { margin: 2.2rem 0 1rem; font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; color: var(--tx2); font-weight: 700; }

/* Encabezado de páginas interiores */
.prod-hero { position: relative; padding-block: clamp(40px, 7vw, 88px) clamp(28px, 4vw, 48px); border-bottom: 1px solid var(--line); background:
  radial-gradient(900px 300px at 85% -10%, rgba(255, 106, 26, .16), transparent 70%); }
.prod-hero--lista h1 { font-size: clamp(2rem, 5vw, 3.4rem); }
.prod-hero__in { display: flex; gap: 1.5rem; align-items: flex-start; }
.prod-hero__ico { flex: none; width: 84px; height: 84px; padding: 12px; border-radius: 20px; border: 1px solid rgba(255, 106, 26, .4); background: var(--s1); color: var(--lava); box-shadow: 0 0 50px -14px rgba(255, 106, 26, .5); }
.prod-hero__ico svg { width: 100%; height: 100%; }
.prod-hero__sello { color: var(--tx2); font-family: var(--f-mono); font-size: .9rem; margin: 0 0 .6rem; }
.prod-hero__tag { font-size: clamp(1.1rem, 2vw, 1.4rem); color: var(--tx); max-width: 50ch; }
.prod-hero__badges { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.2rem; }
.migas { font-size: .85rem; color: var(--tx2); margin-bottom: 1.5rem; display: flex; gap: .5rem; }
.migas a { color: var(--tx2); }
@media (max-width: 560px) { .prod-hero__in { flex-direction: column; } .prod-hero__ico { width: 64px; height: 64px; padding: 14px; } }

.prod-cuerpo { padding-block: clamp(32px, 5vw, 64px); display: grid; gap: clamp(32px, 4vw, 56px); }
.prod-cuerpo h2 { font-size: clamp(1.4rem, 2.4vw, 1.9rem); }
.prod-cuerpo > section > p, .texto-largo p { max-width: 70ch; }
.texto-largo section { max-width: 76ch; }
.texto-largo .dos-col { max-width: none; }
.borrador { margin-top: 1rem; padding: .8rem 1rem; border: 1px dashed var(--lava); border-radius: var(--r-s); color: var(--lava-b); background: var(--lava-fondo); max-width: 70ch; }

/* Lista de avance (inicio, hoja de ruta y producto) */
.estado-lista { list-style: none; display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.estado-item { padding: 1rem 1.1rem; border: 1px solid var(--line); border-radius: var(--r); background: var(--s1); display: grid; gap: .7rem; align-content: start; }
.estado-item__cab { display: flex; justify-content: space-between; align-items: center; gap: .6rem; }
.estado-item__cab a { color: var(--blanco); font-weight: 700; text-decoration: none; }
.estado-item__cab a:hover { color: var(--lava-b); }
.estado-item__num { margin: 0; font-family: var(--f-mono); font-size: 1.1rem; color: var(--blanco); }
.estado-item__num .tenue { font-size: .82rem; }
.recientes { list-style: none; display: grid; gap: .5rem; margin: 0; }
.recientes li { position: relative; padding-left: 1.1rem; font-size: .92rem; }
.recientes li::before { content: ""; position: absolute; left: 0; top: .55em; width: 6px; height: 6px; border-radius: 50%; background: var(--lava); }
.recientes--mini li { font-size: .82rem; color: var(--tx2); }

/* Línea de tiempo de la hoja de ruta */
.linea-tiempo { list-style: none; display: grid; gap: 0; border-left: 2px solid var(--line); margin-left: 8px; }
.lt { position: relative; padding: 0 0 2rem 1.6rem; }
.lt::before { content: ""; position: absolute; left: -9px; top: .2rem; width: 16px; height: 16px; border-radius: 50%; background: var(--bg); border: 2px solid var(--line); }
.lt--ahora::before { border-color: var(--lava); background: var(--lava); box-shadow: 0 0 14px var(--lava); }
.lt h3 { margin: .5rem 0 .3rem; }
.lt p { color: var(--tx2); max-width: 60ch; }

/* Valores */
.valores { list-style: none; display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); margin-top: 2.5rem; }
.valores li { padding: 1.2rem; border: 1px solid var(--line); border-radius: var(--r); background: rgba(22, 24, 29, .75); }
.valores h3 { color: var(--lava-b); margin-bottom: .4rem; }
.valores p { margin: 0; color: var(--tx2); }

/* Beta */
.beta-pagina { display: grid; gap: 32px; grid-template-columns: 1.2fr 1fr; padding-block: clamp(32px, 5vw, 64px); align-items: start; }
.beta-guia { display: grid; gap: 1.2rem; }
.beta-guia section { padding: 1rem 1.2rem; border-left: 3px solid var(--lava); background: var(--s1); border-radius: 0 var(--r-s) var(--r-s) 0; }
.beta-guia h2 { font-size: 1.1rem; }
.beta-guia p { margin: 0; color: var(--tx2); }
@media (max-width: 860px) { .beta-pagina { grid-template-columns: 1fr; } }

/* Documentación */
.doc-grid { grid-template-columns: 220px 1fr; align-items: start; }
.doc-indice { position: sticky; top: calc(var(--cab-h) + 16px); }
.doc-indice ul { list-style: none; display: grid; gap: .3rem; border-left: 1px solid var(--line); }
.doc-indice a { display: block; padding: .3rem .9rem; color: var(--tx2); text-decoration: none; }
.doc-indice a:hover { color: var(--lava-b); }
.doc-sec { margin-bottom: 3rem; }
.faq details { border-bottom: 1px solid var(--line); padding: .8rem 0; }
.faq summary { cursor: pointer; font-weight: 700; color: var(--blanco); }
.faq p { margin: .6rem 0 0; color: var(--tx2); }
@media (max-width: 860px) { .doc-grid { grid-template-columns: 1fr; } .doc-indice { position: static; } }