/** * Estilo visual «C&A LABS / Corporaciones Armando» — reproduce la web original de cyatrujillo.com (Joomla, * plantilla ju_joomla92 «blue», migrada a Netkipu el 14-oct-2026). Solo la usa ese cliente: fondo celeste, * menú en pestañas con el activo en azul y línea azul debajo, portada con tarjetas blancas y la etiqueta azul * con letras naranjas ARRIBA sobre una franja naranja, «Nuestra ubicación» con cinta naranja y pie gris oscuro * con barra naranja. * Colores: azul #0066cc / #336699 · naranja #ff9900 / #ffa500 / #ed5c28 · fondo #eef9ff. */ html.skin-cyatrujillo body { background: #eef9ff; } /* ===== Cabecera: menú en pestañas, el activo en azul (#369) con la línea azul debajo ===== */ :host(site-header) ul.menu { border-bottom: 3px solid #336699; } :host(site-header) ul.menu > .item > a { font-weight: 400; padding: .75rem 1rem; border-radius: 0; } :host(site-header) ul.menu > .item > a:hover, :host(site-header) ul.menu > .item > a.active, :host(site-header) ul.menu > .item > a[aria-current="page"] { background: #336699; color: #fff; } :host(site-header) ul.menu > .item:last-child > a { background: none; color: inherit; padding: .75rem 1rem; border-radius: 0; } :host(site-header) ul.menu > .item:last-child > a:hover, :host(site-header) ul.menu > .item:last-child > a.active, :host(site-header) ul.menu > .item:last-child > a[aria-current="page"] { background: #336699; color: #fff; } /* La web original no muestra «Iniciar sesión» (el panel sigue en /admin). */ :host(site-header) .utility, :host(site-header) [data-login-actions] { display: none !important; } /* ===== Tarjetas (común): blancas, sin caja oscura ===== */ :host(site-iconos) .scard { background: #fff; padding: .5rem .5rem .8rem; border-radius: 0; border: 1px solid #e3edf5; } :host(site-iconos) a.scard:hover { transform: none; box-shadow: 0 6px 18px rgba(0, 51, 102, .12); } :host(site-iconos) .scard .ph { border-radius: 0; background: #fff; } :host(site-iconos) .scard .ph img { object-fit: contain; transition: transform .25s ease; } :host(site-iconos) a.scard:hover .ph img { transform: scale(1.05); } /* ===== Portada: franja naranja detrás de la primera fila y la etiqueta azul con letras naranjas ARRIBA, centrada; 3 tarjetas por fila (pedido del usuario, 15-oct-2026) ===== */ html.skin-cyatrujillo .site-section[data-anchor="nuestros-productos"], html.skin-cyatrujillo #nuestros-productos { background: linear-gradient(to bottom, #eef9ff 0 4.2rem, #ffa500 4.2rem 9.6rem, #eef9ff 9.6rem) !important; } :host(site-iconos[data-anchor="nuestros-productos"]), :host(site-iconos[data-anchor="nuestros-productos"]) .stage { background: transparent !important; } :host(site-iconos[data-anchor="nuestros-productos"]) .grid.cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.8rem 1.6rem; } :host(site-iconos[data-anchor="nuestros-productos"]) .scard { flex-direction: column-reverse; justify-content: flex-end; align-items: center; } :host(site-iconos[data-anchor="nuestros-productos"]) .scard .ph { height: 250px; width: 100%; margin-top: .6rem; } :host(site-iconos[data-anchor="nuestros-productos"]) .scard .cn { background: #0066cc; color: #ff9900; text-transform: uppercase; font-family: Arial, Helvetica, sans-serif; font-weight: 700; font-size: 1.05rem; letter-spacing: .02em; padding: .5rem 1rem; border-radius: 5px; text-align: center; line-height: 1.2; align-self: center; width: auto; max-width: 100%; } /* ===== Portadilla «Otros productos»: nombre en banda gris redondeada debajo (como el original) ===== */ :host(site-iconos[data-anchor^="port-"]) .stage { min-height: 0; } :host(site-iconos[data-anchor^="port-"]) .title { font-size: 1.2rem; font-weight: 700; color: #336699; margin-bottom: 1rem; } :host(site-iconos[data-anchor^="port-"]) .grid.cards { gap: 1.6rem 1.6rem; } :host(site-iconos[data-anchor^="port-"]) .scard { background: #f0efef; border: 1px solid #ddd; } :host(site-iconos[data-anchor^="port-"]) .scard .ph { height: 200px; background: #f0efef; } :host(site-iconos[data-anchor^="port-"]) .scard .cn { background: #777; color: #fff; border-radius: 20px; font-weight: 700; text-transform: none; font-size: .85rem; padding: .55rem .6rem; margin-top: .6rem; text-align: center; } /* ===== «Nuestra ubicación»: cinta naranja con el título blanco centrado ===== */ :host(site-mapa) h2 { background: #ed5c28; color: #fff; text-align: center; font-size: 1.15rem; font-weight: 700; padding: .55rem 1rem; margin: 0 0 .8rem; letter-spacing: .02em; } /* ===== Páginas de texto ===== */ :host(site-freeform) .pb-text { font-size: .98rem; line-height: 1.65; color: #555; } :host(site-freeform) .pb-text p { margin: 0 0 .8rem; text-align: justify; } :host(site-freeform) .pb-text h2 { font-size: 1.7rem; font-weight: 400; margin: 0 0 1rem; color: #336699; } :host(site-freeform) .pb-img img { border-radius: 0; } /* ===== Pie: gris oscuro, títulos blancos con raya azul, barra naranja ===== */ :host(site-footer) h3 { position: relative; padding-bottom: .5rem; } :host(site-footer) h3::after { content: ""; position: absolute; left: 0; bottom: 0; width: 40px; height: 3px; background: #336699; } :host(site-footer) a { color: #fff; } /* «Síguenos en»: Facebook, WhatsApp y teléfono en UNA fila, a 50 px (como el original). Son los bloques de imagen que siguen al texto de Contacto; el logo de la 1.ª columna no se toca. */ :host(site-footer) .pb-text + .pb-img, :host(site-footer) .pb-img + .pb-img { display: inline-block !important; margin: 0 .9rem .4rem 0; vertical-align: middle; } :host(site-footer) .pb-img img[data-w="16"] { width: 50px !important; height: 50px; object-fit: contain; } :host(site-footer) .pb-img a:has(img[data-w="16"]) { display: inline-block; width: auto; } /* Barra naranja del copyright: baja y con el texto centrado (como el original). */ :host(site-footer) .subfooter { min-height: 0 !important; padding: .9rem 1.25rem 1rem !important; } :host(site-footer) .subfooter .inner { min-height: 0 !important; padding: 0 !important; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .3rem; text-align: center; } :host(site-footer) .subfooter p { margin: 0; font-size: .92rem; } /* ===== Celular ===== */ @media (max-width: 900px) { :host(site-iconos[data-anchor="nuestros-productos"]) .grid.cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem .7rem; } :host(site-iconos[data-anchor="nuestros-productos"]) .scard .ph { height: 130px; } :host(site-iconos[data-anchor="nuestros-productos"]) .scard .cn { font-size: .75rem; } :host(site-iconos[data-anchor^="port-"]) .grid.cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem .7rem; } :host(site-iconos[data-anchor^="port-"]) .scard .ph { height: 130px; } } /* ===== Certificados de calibración: TABLA como la lista Fabrik del original (15-oct-2026) ===== La tabla viene repartida en varios bloques de texto (límite del editor): columnas de ancho fijo y sin la cabecera repetida, para que se lea como UNA sola tabla. En celular se desplaza en horizontal. */ :host(site-freeform[data-anchor="certificados"]) .pb-row { margin-top: 0; margin-bottom: 0; } :host(site-freeform[data-anchor="certificados"]) .pb-text > div { overflow-x: auto; } :host(site-freeform[data-anchor="certificados"]) .pb-text table { width: 100%; min-width: 920px; table-layout: fixed; border-collapse: collapse; background: #fff; font-size: .86rem; line-height: 1.35; margin: 0; } :host(site-freeform[data-anchor="certificados"]) .pb-text th { background: #336699; color: #fff; text-align: left; font-weight: 700; padding: .6rem .55rem; border: 1px solid #2b5785; } :host(site-freeform[data-anchor="certificados"]) .pb-text td { padding: .5rem .55rem; border: 1px solid #dde6ee; vertical-align: top; text-align: left; } :host(site-freeform[data-anchor="certificados"]) .pb-text tbody tr:nth-child(even) { background: #f4f9fd; } :host(site-freeform[data-anchor="certificados"]) .pb-text tbody tr:hover { background: #fff4df; } :host(site-freeform[data-anchor="certificados"]) .pb-text th:nth-child(1) { width: 8%; } :host(site-freeform[data-anchor="certificados"]) .pb-text th:nth-child(2) { width: 9%; } :host(site-freeform[data-anchor="certificados"]) .pb-text th:nth-child(3) { width: 22%; } :host(site-freeform[data-anchor="certificados"]) .pb-text th:nth-child(4) { width: 10%; } :host(site-freeform[data-anchor="certificados"]) .pb-text th:nth-child(5) { width: 22%; } :host(site-freeform[data-anchor="certificados"]) .pb-text th:nth-child(6) { width: 12%; } :host(site-freeform[data-anchor="certificados"]) .pb-text th:nth-child(7) { width: 9%; } :host(site-freeform[data-anchor="certificados"]) .pb-text th:nth-child(8) { width: 8%; } :host(site-freeform[data-anchor="certificados"]) .pb-text td a { color: #0066cc; font-weight: 700; white-space: nowrap; } /* Del 2.º bloque de tabla en adelante: sin cabecera ni borde superior duplicado (una sola tabla a la vista). */ :host(site-freeform[data-anchor="certificados"]) .pb-row:nth-child(n+3) thead { display: none; } :host(site-freeform[data-anchor="certificados"]) .pb-row:nth-child(n+3) table { border-top: 0; }