/* JOSHTML v2 — estilos base. Todo cuelga de variables --jos-*, que applyBrand() sobrescribe con la marca del documento. Móvil primero: los sitios de restaurante se ven en el teléfono. Sin @import, sin fuentes remotas: la CSP del hosting manda. */ :root { --jos-bg: #0a0a0b; /* Segunda superficie. Ocho pantallas del mismo plano se leen como una sola cosa barata; alternar el fondo le da al ojo dónde apoyarse y marca dónde acaba una sección. Se deriva de la marca (no es un gris fijo) para que applyBrand() la arrastre sola: quien cambie --jos-bg no tiene que acordarse de esta. */ --jos-bg-2: color-mix(in srgb, var(--jos-bg) 96%, var(--jos-ink)); --jos-ink: #f4f1ea; --jos-accent: #c8102e; --jos-accent2: #d4a437; /* La tinta que va ENCIMA del acento (botones). No se puede fijar en #fff: un acento claro —un dorado, un ámbar, un lima— deja el rótulo del botón en 2:1 y el botón principal del sitio se vuelve el elemento menos legible de la página. Se declara en la marca (`brand.onAccent`) porque sólo quien eligió el acento sabe qué tinta lo contrasta; el valor por omisión conserva el blanco de los acentos oscuros. */ --jos-btn-ink: #fff; --jos-panel: rgba(255, 255, 255, .05); --jos-line: rgba(255, 255, 255, .12); --jos-radius: 14px; /* Tres papeles, no dos. Separarlos es lo que permite que --jos-display sea una blackletter sin volver ilegible la interfaz. */ --jos-display: ui-sans-serif, system-ui, "Helvetica Neue", sans-serif; /* titulares grandes */ --jos-ui: ui-sans-serif, system-ui, "Helvetica Neue", sans-serif; /* nav, botones, etiquetas */ --jos-body: ui-sans-serif, system-ui, "Helvetica Neue", sans-serif; /* texto corrido */ --jos-tenue: color-mix(in srgb, var(--jos-ink) 58%, transparent); --jos-ancho: 1080px; --jos-aire: 22px; /* aire lateral */ /* MEDIA ración de aire vertical: el bloque pone la mitad arriba y la mitad abajo, así el hueco entre dos secciones contiguas es UNA ración, no la suma de dos. Antes eran 82px + 82px = 164px de negro muerto entre la carta y lo siguiente. Y va en clamp() porque 82px fijos son un lujo para un bloque de tres líneas: el aire debe crecer con el viewport, no con la terquedad del CSS. */ --jos-aire-b: clamp(34px, 4.6vw, 52px); } .jos-root *, .jos-root *::before, .jos-root *::after { box-sizing: border-box; } .jos-root { color: var(--jos-ink); font: 400 16.5px/1.65 var(--jos-body); } /* Aquí vivía `-webkit-font-smoothing: antialiased`. Se quitó el 5 sep 2026 y no es cosmética de gusto: en FONDO OSCURO esa regla apaga el subpixel y adelgaza cada trazo, y una tipografía de display pesada —Alfa Slab One en shrimp, Anton en california— se ve lavada y borrosa. Medido en /carta de shrimp-lighthouse: mismo ancho de caja, bordes visiblemente más definidos con el subpixel de vuelta. La regla nació del tópico «texto más limpio en Mac», que es cierto sobre fondo CLARO. De los 8 documentos publicados, 6 son oscuros: josfox, kii-bucerias, old-manchester, shrimp-lighthouse, tao-franquicias y aceptacion-v1. Sólo california-krispy-chicken (#fffdf6) y tao-comida-oriental (#faf4e6) son claros, y ahí quitarla sólo devuelve el render por omisión del navegador. */ .jos-root img { max-width: 100%; display: block; } /* El :where() es lo que hace que estos reset SEAN reset. Escritos como `.jos-root p` pesaban (0,1,1) y le ganaban a cualquier `.jos-clase` (0,1,0): el `margin: 12px auto 22px` de .jos-band__desc computaba 0px y la caja se iba contra el borde izquierdo. Con :where() pesan (0,1,0) y las clases de abajo, por ir después, mandan. Lo mismo destapa .jos-b__title, .jos-hero__sub, .jos-menu__catname y .jos-plan__feats, que llevaban tiempo con el margen muerto. El ancla es el caso que más caro salió, y por eso va aquí y no suelta. Los 14 bloques no emiten un solo