/**
 * Estilo visual «Industria · Rojo y grafito» — variante de topo-azul (Venta de equipos) para empresas de
 * instrumentación y automatización industrial (p. ej. Tech Control). Mismo diseño, colores del logo:
 * rojo #c62a1f y grafito #1d2128, fondo gris muy claro.
 * Colores base del tema: --site-primary #c62a1f · --site-accent #e08a1e.
 */
html.skin-industria-rojo body { background: #f7f7f8; }

:host { --rc-1: #c62a1f; --rc-2: #e2483b; --rc-green: #e08a1e; --rc-cream: #f7f7f8; --rc-sand: #f3efee; --rc-ink: #1d2128; --rc-soft: #5c626c;
    --rc-line: #e7e3e2; --rc-shadow: 0 26px 50px -32px rgba(110, 22, 15, .45); }
:host .btn { border-radius: 14px; font-weight: 600; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
:host .btn-primary { background: linear-gradient(135deg, var(--rc-1), var(--rc-2)); color: #fff; border: 0; box-shadow: 0 14px 26px -14px rgba(198, 42, 31, .9); }
:host .btn-primary:hover { transform: translateY(-2px); }
:host .btn-ghost { border: 1.5px solid #e4e2e2; color: var(--rc-ink); background: #fff; }
:host .btn-ghost:hover { border-color: var(--rc-1); color: var(--rc-1); }
:host h1, :host h2 { font-weight: 800; letter-spacing: -.02em; }
:host .hl { color: var(--rc-1); }

@keyframes rc-float { 0%, 100% { translate: 0 0; rotate: 0deg; } 50% { translate: 0 -14px; rotate: -1.5deg; } }
@keyframes rc-hero { 0%, 100% { translate: 0 0; scale: 1; } 50% { translate: 0 -10px; scale: 1.03; } }
@keyframes rc-bob { 0%, 100% { translate: 0 0; rotate: 0deg; } 50% { translate: 0 -5px; rotate: -6deg; } }
@keyframes rc-card { 0%, 100% { translate: 0 0; } 50% { translate: 0 -8px; } }
@keyframes rc-spin { to { rotate: 360deg; } }
@keyframes rc-zoom { 0%, 100% { scale: 1; } 50% { scale: 1.045; } }

/* ── Cabecera: el último ítem del menú es el botón «Reservar mesa» ──────────── */
:host(site-header) ul.menu > .item:last-child > a { padding: .55rem 1.2rem; border-radius: 12px; color: #fff !important;
    background: linear-gradient(135deg, var(--rc-1), var(--rc-2)); border-bottom: 0 !important; }
:host(site-header) ul.menu > .item > a { font-weight: 500; }

/* ── Portada: el topógrafo sobre una tarjeta azul redondeada ──────────────── */
:host(site-hero) { position: relative; overflow: hidden;
    background: radial-gradient(36rem 28rem at 85% 40%, rgba(226, 72, 59, .18), transparent 62%), var(--rc-cream); }
:host(site-hero) .hero { padding-top: clamp(2.5rem, 6vw, 4rem); padding-bottom: clamp(2rem, 5vw, 3.5rem); }
:host(site-hero) .eyebrow { display: inline-flex; align-items: center; gap: .5rem; padding: .35rem .9rem; border-radius: 999px; background: var(--rc-sand);
    color: var(--rc-1); font-weight: 600; letter-spacing: .06em; }
:host(site-hero) h1 { font-size: calc(clamp(2.5rem, 5.2vw, 4.3rem) * var(--sec-title-scale, 1)); line-height: 1.08; color: var(--rc-ink); }
:host(site-hero) .hl { position: relative; display: inline-block; z-index: 0; }
/* Subrayado a mano bajo la palabra resaltada. */
:host(site-hero) h1 .hl::after { content: ""; position: absolute; left: 0; right: 0; bottom: -.08em; height: .22em; border-radius: 999px;
    background: color-mix(in srgb, var(--rc-2) 45%, transparent); z-index: -1; }
:host(site-hero) .sub { color: var(--rc-soft); line-height: 1.75; max-width: 33rem; }
:host(site-hero) .actions .btn { padding: .9rem 1.5rem; }
:host(site-hero) .hstats { grid-template-columns: repeat(2, max-content); gap: 1.6rem; }
:host(site-hero) .hstats .hs-ico { background: var(--rc-sand); color: var(--rc-1); animation: rc-bob 5s ease-in-out infinite; }
:host(site-hero) .hstats li:nth-child(2) .hs-ico { animation-delay: -2.5s; }
:host(site-hero) .hstats b { color: var(--rc-ink); font-size: 1.15rem; }
:host(site-hero) .hero-fig.shape-cutout { display: flex; justify-content: center; align-items: flex-end; padding: 0; min-height: clamp(440px, 46vw, 600px); }
:host(site-hero) .hero-fig.shape-cutout::before { content: ""; position: absolute; z-index: 0; left: 10%; right: 6%; bottom: 0; height: 80%; border-radius: 48px;
    background: radial-gradient(80% 60% at 30% 10%, rgba(255, 255, 255, .35), transparent 60%), linear-gradient(160deg, #e2483b 0%, #c62a1f 60%, #8f1a12 100%);
    box-shadow: 0 50px 80px -44px rgba(110, 22, 15, .75); }
:host(site-hero) .hero-fig.shape-cutout::after { content: ""; position: absolute; z-index: 0; width: 120px; aspect-ratio: 1; left: 0; top: 14%;
    border-radius: 50%; border: 2px dashed rgba(224, 138, 30, .45); animation: rc-spin 30s linear infinite; }
:host(site-hero) .hero-fig.shape-cutout img { position: relative; z-index: 1; width: auto; max-width: 92%; height: clamp(440px, 46vw, 600px);
    object-fit: contain; object-position: bottom; filter: drop-shadow(0 24px 26px rgba(20, 22, 26, .3));
    animation: rc-hero 8s ease-in-out infinite; transform-origin: bottom center; }
/* Tarjetas a la altura del pecho y hacia los bordes: el rostro queda libre. */
:host(site-hero) .hfloat { z-index: 3; background: #fff; border: 1px solid var(--rc-line); border-radius: 16px; box-shadow: var(--rc-shadow);
    animation: rc-card 5s ease-in-out infinite; max-width: 13rem; }
:host(site-hero) .hfloat .hf-ico { background: var(--rc-green); border-radius: 12px; }
:host(site-hero) .hfloat.f0 { left: -4%; top: auto; bottom: 30%; }
:host(site-hero) .hfloat.f1 { right: -4%; left: auto; bottom: 7%; top: auto; animation-delay: -2.5s; }
:host(site-hero) .hfloat.f1 .hf-ico { background: var(--rc-1); }

/* ── Franja de beneficios ──────────────────────────────────────────────────── */
:host(site-iconos) .ico { animation: rc-bob 5s ease-in-out infinite; }
:host(site-iconos) .item:nth-child(2) .ico { animation-delay: -1.2s; }
:host(site-iconos) .item:nth-child(3) .ico { animation-delay: -2.4s; }
:host(site-iconos) .item:nth-child(4) .ico { animation-delay: -3.6s; }
:host(site-iconos) .it-title { font-weight: 700; color: var(--ic-it-title-color, var(--rc-ink)); }
:host(site-iconos) .it-text { color: var(--ic-it-text-color, var(--rc-soft)); }

/* ── Carta: categorías en círculos con foto + tarjetas cálidas ─────────────── */
:host(site-carta) h2, :host(site-testimonials) h2, :host(site-hours) h2, :host(site-about) h2, :host(site-contact) h2 {
    font-size: calc(clamp(2rem, 4vw, 2.9rem) * var(--sec-title-scale, 1)); color: var(--sec-title-color, var(--rc-ink)); }
:host(site-carta) .cat .ci { width: 6.2rem; height: 6.2rem; background: #fff; box-shadow: 0 14px 26px -18px rgba(110, 22, 15, .6); border: 4px solid #fff; }
:host(site-carta) .cat .ci img { width: 100%; height: 100%; object-fit: cover; }
:host(site-carta) .cat[aria-pressed="true"] .ci, :host(site-carta) .cat:hover .ci { box-shadow: 0 0 0 3px var(--rc-1), 0 18px 30px -18px rgba(198, 42, 31, .8); }
:host(site-carta) .cat[aria-pressed="true"] { color: var(--rc-1); }
:host(site-carta) .cat .ci svg { width: 2rem; height: 2rem; color: var(--rc-1); }
:host(site-carta) .dish { border-color: var(--rc-line); border-radius: 24px; }
:host(site-carta) .dish:hover { box-shadow: var(--rc-shadow); }
:host(site-carta) .dish .ph { margin: .7rem .7rem 0; border-radius: 18px; }
:host(site-carta) .dish h3 { font-family: var(--site-font-title, "Montserrat", sans-serif); font-weight: 700; }
:host(site-carta) .dish .pr { color: var(--rc-1); font-size: 1.2rem; }
:host(site-carta) .dish .badge { background: var(--rc-green); border-radius: 999px; }
:host(site-carta) .dish .go { border-radius: 12px; background: linear-gradient(135deg, var(--rc-1), var(--rc-2)); }

/* ── Nosotros: foto orgánica que respira + checks ámbar ───────────────────── */
:host(site-about) { overflow-x: clip; }
:host(site-about) .media-fig img { animation: rc-zoom 12s ease-in-out infinite; box-shadow: var(--rc-shadow); }
:host(site-about) .body p { color: var(--sec-text, var(--rc-soft)); }
:host(site-about) .checks svg { background: var(--rc-green); }

/* ── Opiniones ─────────────────────────────────────────────────────────────── */
:host(site-testimonials) .card { border-radius: 22px; border-color: var(--rc-line); box-shadow: var(--rc-shadow); }
:host(site-testimonials) .stars { color: #f0a33f; }
:host(site-testimonials) .avatar { background: var(--rc-green); }

/* ── Banda «Pide por WhatsApp»: azul con el equipo flotando ───────────────── */
:host(site-cta) { overflow-x: clip; }
:host(site-cta) .box { position: relative; border-radius: 32px; overflow: hidden; color: #fff;
    background: radial-gradient(24rem 18rem at 80% 40%, rgba(255, 255, 255, .22), transparent 60%), linear-gradient(120deg, #8f1a12 0%, #c62a1f 50%, #e2483b 100%); }
:host(site-cta) .box::before { content: ""; position: absolute; width: 18rem; aspect-ratio: 1; right: -4rem; top: -6rem; border-radius: 50%;
    border: 2px dashed rgba(255, 255, 255, .3); animation: rc-spin 40s linear infinite; }
:host(site-cta) h2 { color: #fff; font-size: calc(clamp(2rem, 4vw, 3rem) * var(--sec-title-scale, 1)); }
:host(site-cta) .hl { color: #ffc98a; }
:host(site-cta) p { color: rgba(255, 255, 255, .88); }
:host(site-cta) .box .btn-primary { background: #fff; color: var(--rc-1); box-shadow: none; }
:host(site-cta) .box.with-img .cta-img { align-self: center; max-height: 300px; margin-block: 1.5rem; filter: drop-shadow(0 30px 26px rgba(20, 22, 26, .45));
    animation: rc-float 6s ease-in-out infinite; }

/* ── Horario y reservas ────────────────────────────────────────────────────── */
:host(site-hours) .box { background: #fff; border-color: var(--rc-line); border-radius: 22px; box-shadow: var(--rc-shadow); }
:host(site-hours) .hrs { color: var(--rc-1); font-weight: 700; }
:host(site-hours) .media-fig img { border-radius: 32px; animation: rc-zoom 12s ease-in-out infinite; }
:host(site-contact) form { border-radius: 22px; box-shadow: var(--rc-shadow); }
:host(site-contact) .info a { color: var(--rc-1); }

/* Catálogo completo (muchas categorías): círculos más chicos para que quepan en dos filas. */
:host(site-carta) .cats.many .cat .ci { width: 4.6rem; height: 4.6rem; border-width: 3px; }
@media (max-width: 760px) {
    :host(site-hero) .hero-fig.shape-cutout, :host(site-hero) .hero-fig.shape-cutout img { min-height: 0; height: 380px; }
    :host(site-hero) .hstats { grid-template-columns: 1fr; gap: .7rem; }
    :host(site-carta) .cat .ci { width: 4.8rem; height: 4.8rem; }
}
@media (prefers-reduced-motion: reduce) {
    :host(site-hero) .hero-fig.shape-cutout img, :host(site-hero) .hero-fig.shape-cutout::after, :host(site-hero) .hfloat, :host(site-hero) .hstats .hs-ico,
    :host(site-iconos) .ico, :host(site-about) .media-fig img, :host(site-cta) .box::before, :host(site-cta) .box.with-img .cta-img,
    :host(site-hours) .media-fig img { animation: none; }
}

/* ══ Tech Control: portada como su web original (techcontrol.pe/web, 11-oct-2026) ══════════════════ */
/* Menú: el último ítem («Contáctenos») sin botón; activo en rojo, como el original. */
:host(site-header) ul.menu > .item:last-child > a { padding: inherit; border-radius: 0; color: inherit !important; background: none !important; box-shadow: none; }
/* Franjas planas (sin bordes redondeados ni círculo decorativo). */
:host(site-cta[data-anchor="sectores"]) .box, :host(site-cta[data-anchor="comience"]) .box { border-radius: 0; box-shadow: none; }
:host(site-cta[data-anchor="sectores"]) .box::before, :host(site-cta[data-anchor="comience"]) .box::before { display: none; }
/* Sectores: franja naranja, texto a la izquierda y botón blanco a la derecha. */
html.skin-industria-rojo .site-section#sectores { padding-top: 0; }
:host(site-cta[data-anchor="sectores"]) .box { background: #fd4f31; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .2rem 2rem;
    align-items: center; text-align: left; padding: clamp(1.4rem, 3vw, 2.2rem) clamp(1.4rem, 5vw, 3.6rem); }
:host(site-cta[data-anchor="sectores"]) h2 { grid-column: 1; margin: 0; font-weight: 500; font-size: clamp(1.15rem, 2.1vw, 1.55rem); line-height: 1.25; }
:host(site-cta[data-anchor="sectores"]) p { grid-column: 1; margin: 0; color: #fff; opacity: 1; font-size: clamp(1.05rem, 1.9vw, 1.4rem); line-height: 1.3; }
:host(site-cta[data-anchor="sectores"]) .btn { grid-column: 2; grid-row: 1 / span 2; background: #f2f2f2 !important; color: #1d2128 !important; border-radius: 4px; }
@media (max-width: 700px) { :host(site-cta[data-anchor="sectores"]) .box { grid-template-columns: 1fr; }
    :host(site-cta[data-anchor="sectores"]) .btn { grid-column: 1; grid-row: auto; justify-self: start; margin-top: .8rem; } }
/* «¡Comience su proyecto ahora!»: franja gris con texto centrado. */
:host(site-cta[data-anchor="comience"]) .box { background: #7f7f7f; padding-block: clamp(2.6rem, 6vw, 4.4rem); }
:host(site-cta[data-anchor="comience"]) h2 { font-size: clamp(1.5rem, 3vw, 2.1rem); }
:host(site-cta[data-anchor="comience"]) p { font-weight: 700; font-size: clamp(1.05rem, 2vw, 1.35rem); opacity: 1; margin: 1.6rem 0 1.4rem; }
:host(site-cta[data-anchor="comience"]) .box .btn-primary { background: #f2f2f2; color: #1d2128; border-radius: 4px; }
/* Servicios y productos: tarjetas con foto, título en caja blanca y botón negro «Leer más». */
:host(site-equipo[data-anchor^="servicios"]) .head h2 { font-weight: 400; font-size: clamp(2rem, 4vw, 2.6rem); color: #4b5563; }
:host(site-equipo[data-anchor^="servicios"]) .head h2 .hl { color: #1fb5e9; font-style: normal; border-right: 2px solid #4b5563; padding-right: .25em; margin-right: .1em; }
:host(site-equipo[data-anchor^="servicios"]) .card, :host(site-equipo[data-anchor="productos"]) .card { background: transparent; border: 0; padding: 0; align-items: stretch; text-align: left; }
:host(site-equipo[data-anchor^="servicios"]) .ph, :host(site-equipo[data-anchor="productos"]) .ph { aspect-ratio: 3 / 2; border-radius: 0; margin: 0; }
:host(site-equipo[data-anchor^="servicios"]) .ph img, :host(site-equipo[data-anchor="productos"]) .ph img { object-position: center; transition: transform .5s ease; }
:host(site-equipo[data-anchor^="servicios"]) .card:hover .ph img, :host(site-equipo[data-anchor="productos"]) .card:hover .ph img { transform: scale(1.05); }
:host(site-equipo[data-anchor^="servicios"]) .card h3 { background: #fff; margin: 0; padding: .85rem 1rem; font-weight: 400; font-size: .98rem; color: #4b5563;
    box-shadow: 0 6px 14px -8px rgba(0, 0, 0, .35); }
:host(site-equipo[data-anchor^="servicios"]) .card .btn { align-self: flex-start; margin-top: 1.6rem; background: #141414; color: #fff; border-radius: 0; box-shadow: none; padding: .55rem 1.3rem; }
/* Productos: título con subrayado rojo de pincel; 4 fotos de marca; botón gris. */
:host(site-equipo[data-anchor="productos"]) .head { text-align: left; }
:host(site-equipo[data-anchor="productos"]) .head h2 { display: inline-block; font-weight: 700; }
:host(site-equipo[data-anchor="productos"]) .head h2::after { content: ""; display: block; height: 7px; margin-top: .2rem; border-radius: 50% 40% 60% 45%;
    background: #e6290b; transform: rotate(-1.5deg); }
:host(site-equipo[data-anchor="productos"]) .head .intro { margin-inline: 0; }
:host(site-equipo[data-anchor="productos"]) .card h3 { font-size: .92rem; margin: .6rem 0 0; color: #4b5563; font-weight: 500; }
:host(site-equipo[data-anchor="productos"]) .card .btn { display: none; }
:host(site-equipo[data-anchor="productos"]) .more { justify-content: flex-start; }
:host(site-equipo[data-anchor="productos"]) .more .btn { background: #ececec; border: 0; color: #1d2128; border-radius: 4px; }
/* ¿Quiénes Somos?: foto rectangular con sombra y botón negro. */
:host(site-about[data-anchor="nosotros"]) .media-fig img { animation: none; }
:host(site-about[data-anchor="nosotros"]) h2 .hl, :host(site-about[data-anchor="qs-empresa"]) h2 .hl { color: #1d3a8a; border: 3px solid #1d3a8a; border-radius: 50%; padding: 0 .3em; }
:host(site-about[data-anchor="nosotros"]) .btn, :host(site-about[data-anchor^="serv-"]) .btn { background: #141414; color: #fff; border-radius: 0; box-shadow: none; }
:host(site-marcas[data-anchor="marcas"]) .head h2 { font-weight: 600; color: #4b5563; }
/* Carrusel como el original: título fino en blanco con «Industrial» en negrita; botón negro. */
:host(site-slideshow) .t { font-family: "Poppins", sans-serif; font-weight: 300; color: #fff; letter-spacing: .01em; }
:host(site-slideshow) .t .hl { color: #fff !important; font-weight: 600; font-style: normal; }
:host(site-slideshow) .slide-cta { background: #141414 !important; color: #fff !important; border-radius: 2px !important; box-shadow: none !important; }
/* Productos: título y botón a la izquierda; 4 fotos grandes en 2×2 a la derecha (como el original). */
@media (min-width: 761px) {
    :host(site-equipo[data-anchor="productos"]) .wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); column-gap: 3rem; align-items: start; }
    :host(site-equipo[data-anchor="productos"]) .head { grid-column: 1; grid-row: 1; margin: 0; }
    :host(site-equipo[data-anchor="productos"]) .more { grid-column: 1; grid-row: 2; margin-top: 1.2rem; }
    :host(site-equipo[data-anchor="productos"]) .grid { grid-column: 2; grid-row: 1 / span 3; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 1rem; }
}
:host(site-equipo[data-anchor="productos"]) .ph { aspect-ratio: auto; background: transparent; }
:host(site-equipo[data-anchor="productos"]) .ph img { height: auto; object-fit: contain; }
:host(site-equipo[data-anchor="productos"]) .card h3 { display: none; }
:host(site-footer) h3, :host(site-footer) .ftitle { text-transform: uppercase; }
/* ── Tech Control: páginas internas como el original (11-oct, 2.ª ronda) ── */
/* Logo del pie en tarjeta blanca (sobre el rojo no se leía «TECH»). */
:host(site-footer) .flogo { background: #fff; padding: .7rem .9rem; border-radius: 4px; box-shadow: 0 10px 24px -10px rgba(0, 0, 0, .45); height: 80px; max-width: 240px; }
/* Cabecera de página (¿Quiénes Somos?) y franja «Comience»: foto oscura de torres con texto centrado. */
:host(site-textofondo[data-anchor$="-cabecera"]) .title { font-weight: 600; font-size: clamp(1.4rem, 2.6vw, 2rem); margin: 0; }
:host(site-textofondo[data-anchor="comience"]) .title { font-weight: 700; }
:host(site-textofondo[data-anchor="comience"]) .intro { font-weight: 700; font-size: clamp(1.05rem, 2vw, 1.3rem); color: #fff; }
:host(site-textofondo[data-anchor="comience"]) .btn { background: #f2f2f2 !important; color: #1d2128 !important; border-radius: 4px; box-shadow: none; }
/* Texto en 2 columnas sin íconos (Empresa de ingeniería, Visión/Misión): alineado a la izquierda. */
:host(site-iconos[data-anchor^="qs-"]) .title { text-align: left; text-transform: uppercase; font-weight: 400; }
:host(site-iconos[data-anchor^="qs-"]) .item { text-align: left; align-items: flex-start; }
:host(site-iconos[data-anchor^="qs-"]) .ico { display: none; }
:host(site-iconos[data-anchor^="qs-"]) .it-title { text-transform: uppercase; font-weight: 400; letter-spacing: .02em; }
:host(site-iconos[data-anchor^="qs-"]) .it-text { line-height: 1.8; }
:host(site-iconos[data-anchor="qs-mision"]) .it-text { text-align: justify; }
:host(site-iconos[data-anchor^="qs-"]) .it-text strong { color: #3b3f46; }
/* Servicios (página) y catálogo de productos: 3 por fila, título arriba de la foto, texto y «LEER MÁS…». */
:host(site-equipo[data-anchor="serv-lista"]) .head { text-align: left; }
:host(site-equipo[data-anchor="serv-lista"]) .card { background: transparent; border: 0; padding: 0; align-items: flex-start; text-align: left; }
:host(site-equipo[data-anchor="serv-lista"]) .card h3 { order: -1; text-transform: uppercase; font-weight: 600; font-size: 1.05rem; margin: 0 0 .6rem; color: #1d2128; }
:host(site-equipo[data-anchor="serv-lista"]) .ph { aspect-ratio: 4 / 3; border: 6px solid #ececec; border-radius: 0; margin: 0 0 .9rem; }
:host(site-equipo[data-anchor="serv-lista"]) .txt { margin: 0; }
:host(site-equipo[data-anchor="serv-lista"]) .card .btn, :host(site-catalogo) .card::after { background: #f96a5a; color: #fff; border-radius: 0; text-transform: uppercase;
    font-weight: 600; font-size: .82rem; letter-spacing: .04em; padding: .75rem 1.4rem; box-shadow: 0 8px 18px -10px rgba(249, 106, 90, .9); }
:host(site-catalogo) .grid { gap: 2.4rem 2rem; }
:host(site-catalogo) .card { border: 0; background: transparent; box-shadow: none !important; transform: none !important; }
:host(site-catalogo) .card .cat, :host(site-catalogo) .card .brand, :host(site-catalogo) .card .price { display: none; }
:host(site-catalogo) .card .body { display: contents; }
:host(site-catalogo) .card .name { order: -1; text-transform: uppercase; font-size: 1.25rem; font-weight: 600; color: #1d2128; margin-bottom: .8rem; }
:host(site-catalogo) .card .thumb { height: auto; aspect-ratio: 10 / 3; padding: 0; background: #fff; border: 6px solid #e2e2e2; overflow: hidden; }
:host(site-catalogo) .card .thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
:host(site-catalogo) .card:hover .thumb img { transform: scale(1.04); }
:host(site-catalogo) .card .sum { display: block; margin: 1rem 0 1.4rem; font-size: .92rem; line-height: 1.6; color: #4b5563; }
:host(site-catalogo) .card::after { content: "Leer más… ›"; align-self: flex-start; margin-top: auto; }
/* Clientes: cuadrícula fija de logos en un recuadro, como el original. */
:host(site-equipo[data-anchor="clientes-grid"]) .head { text-align: left; }
:host(site-equipo[data-anchor="clientes-grid"]) .grid { max-width: 1180px; margin: 0 auto; border: 6px solid #e2e2e2; padding: 1.6rem 2.4rem; gap: 1.2rem 3rem; background: #fff; }
:host(site-equipo[data-anchor="clientes-grid"]) .card { border: 0; padding: 0; background: transparent; }
:host(site-equipo[data-anchor="clientes-grid"]) .ph { aspect-ratio: 2 / 1; background: transparent; margin: 0; border-radius: 0; }
:host(site-equipo[data-anchor="clientes-grid"]) .ph img { object-fit: contain; object-position: center; }
:host(site-equipo[data-anchor="clientes-grid"]) .card h3, :host(site-equipo[data-anchor="clientes-grid"]) .card .btn { display: none; }