/* ==========================================================
   EMPAQUETOTAL — Bootstrap 5 Theme
   ========================================================== */

/* ── Variables ─────────────────────────────────────────── */
:root {
    --et-blue:       #1565c0;
    --et-navy:       #1a2b4a;
    --et-green:      #2e7d32;
    --et-green-cta:  #388e3c;
    --et-teal:       #00838f;
    --et-light-bg:   #f5f7fa;
    --et-border:     #dee2e6;
    --et-text:       #1a1a1a;
    --et-muted:      #6c757d;
    --et-font-main:  'Inter', sans-serif;
    --et-font-brand: 'Montserrat', sans-serif;
}

/* ── Reset / Base ───────────────────────────────────────── */
body {
    font-family: var(--et-font-main);
    color: var(--et-text);
    background: #fff;
    font-size: 15px;
}

/* ── HEADER ─────────────────────────────────────────────── */
.et-header {
    z-index: 1020;
    box-shadow: 0 2px 8px rgba(0,0,0,.12);
}

/* Barra superior blanca */
.et-header-top {
    background: #fff;
    border-bottom: 1px solid var(--et-border);
}

.et-logo-img {
    height: 50px;
    width: auto;
    object-fit: contain;
}

.et-header-cta {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 13px;
    font-weight: 700;
    border-radius: 5px;
    padding: 7px 14px;
    text-decoration: none;
    transition: opacity .2s, transform .15s;
    white-space: nowrap;
}
.et-header-cta:hover { opacity: .87; transform: translateY(-1px); }

/* Variante azul — Planes publicitarios */
.et-cta-blue {
    background: var(--et-blue);
    color: #fff;
    border: 2px solid var(--et-blue);
}
.et-cta-blue:hover { color: #fff; }

/* Variante verde — Publica tu empresa */
.et-cta-green {
    background: var(--et-green);
    color: #fff;
    border: 2px solid var(--et-green);
}
.et-cta-green:hover { color: #fff; }

.et-cta-icon { font-size: 14px; }
.et-cta-text { display: inline; }

/* Navbar azul oscuro */
.et-navbar {
    background: var(--et-navy);
    padding: 0;
}

.et-nav-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.et-nav-menu li {
    display: flex;
    align-items: center;
    list-style: none;
}

.et-nav-menu li a,
.et-nav-menu .nav-link {
    color: rgba(255,255,255,0.9) !important;
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 14px 14px !important;
    transition: color .2s;
    text-decoration: none;
}
.et-nav-menu li a:hover,
.et-nav-menu .nav-link:hover {
    color: #fff !important;
}

.et-nav-sep {
    color: rgba(255,255,255,0.3);
    font-size: 12px;
    pointer-events: none;
}

/* Separador | entre ítems de navegación */
.et-nav-menu li + li::before {
    content: '|';
    color: rgba(255,255,255,0.3);
    font-size: 12px;
    align-self: center;
}

.et-cart-icon { color: #fff; text-decoration: none; }

.navbar-toggler-icon {
    filter: invert(1);
}

/* ==========================================================================
   Hero Section Base
   ========================================================================== */
.et-hero {
    position: relative;
}

.et-hero-slide {
    height: 400px;
    background: linear-gradient(135deg, #1a2b4a 0%, #2c3e6b 50%, #1565c0 100%);
    display: flex;
    align-items: center;
    position: relative;
}

.et-hero-overlay {
    position: absolute;
    inset: 0;
    background: rgba(10, 20, 40, 0.55);
}

.et-hero-title {
    font-family: var(--et-font-brand);
    font-size: clamp(1.4rem, 3vw, 3.2rem);
    font-weight: 700;
    color: #fff;
    line-height: 1.3;
    position: relative;
    z-index: 1;
}

.et-hero-subtitle {
    color: rgba(255,255,255,0.8);
    font-size: 1rem;
    margin-top: 8px;
    position: relative;
    z-index: 1;
}

.et-search-form {
    position: relative;
    z-index: 1;
}

.et-search-input,
.et-search-select {
    height: 44px;
    border-radius: 4px;
    border: 0;
    font-size: 14px;
    min-width: 160px;
    flex: 1 1 160px;
}

.et-btn-search {
    background: var(--et-green);
    color: #fff;
    font-weight: 600;
    border: 0;
    padding: 0 24px;
    height: 44px;
    border-radius: 4px;
    font-size: 14px;
    white-space: nowrap;
}
.et-btn-search:hover {
    background: var(--et-green-cta);
    color: #fff;
}
/* Carousel arrows */
.carousel-control-prev,
.carousel-control-next {
    width: 5%;
}

/* ── SECTION TITLES ─────────────────────────────────────── */
.et-section-title {
    font-family: var(--et-font-brand);
    font-size: 30px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--et-navy);
    border-bottom: 2px solid var(--et-blue);
    padding-bottom: 6px;
    margin-bottom: 14px;
}

/* ── TABS ───────────────────────────────────────────────── */
.et-tabs-section {
    background: var(--et-light-bg);
    border-bottom: 1px solid var(--et-border);
}

.et-tabs-nav {
    gap: 4px;
    border-bottom: none;
    margin-bottom: 0;
}

.et-tab-btn {
    background: #e8edf5;
    border: 1px solid var(--et-border);
    border-bottom: none;
    border-radius: 4px 4px 0 0;
    color: var(--et-navy);
    font-size: 13px;
    font-weight: 600;
    padding: 8px 18px;
    cursor: pointer;
    transition: background .2s;
}
.et-tab-btn.active,
.et-tab-btn:hover {
    background: #fff;
    color: var(--et-blue);
}

.et-tabs-content {
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 0 4px 4px 4px;
    padding: 14px;
    min-height: 80px;
}

.et-tab-logo {
    width: 64px;
    height: 64px;
    object-fit: contain;
    border: 1px solid var(--et-border);
    border-radius: 4px;
    padding: 4px;
}

/* ── DIRECTORIO items ───────────────────────────────────── */
.et-dir-logo {
    width: 54px;
    flex-shrink: 0;
}

.et-dir-logo img {
    width: 54px;
    height: 54px;
    object-fit: contain;
    border: 1px solid var(--et-border);
    border-radius: 4px;
    padding: 3px;
}

.et-logo-placeholder-sm {
    width: 54px;
    height: 54px;
    background: var(--et-navy);
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    font-size: 14px;
}

.et-badge-cat {
    background: #e3eaf5;
    color: var(--et-navy);
    font-weight: 500;
    font-size: 11px;
}

/* ── CONTENT items ──────────────────────────────────────── */
.et-content-thumb img {
    width: 64px;
    height: 50px;
    object-fit: cover;
    border-radius: 4px;
}

.et-content-link {
    color: var(--et-navy);
    text-decoration: none;
}
.et-content-link:hover { color: var(--et-blue); text-decoration: underline; }

/* ── CATEGORÍAS ─────────────────────────────────────────── */
.et-cat-item {
    color: var(--et-text);
    padding: 3px 0;
    font-size: 14px;
}
.et-cat-item:hover { color: var(--et-blue); }

.et-cat-icon {
    font-size: 14px;
    min-width: 20px;
}

/* ── CTA BANNERS ────────────────────────────────────────── */
.et-cta-card {
    min-height: 100px;
    transition: filter .2s, transform .15s;
}
.et-cta-card:hover {
    filter: brightness(1.08);
    transform: translateY(-2px);
}

.et-cta-green { background: var(--et-green); }
.et-cta-blue  { background: var(--et-teal); }

.et-cta-icon-lg {
    font-size: 2.5rem;
    flex-shrink: 0;
}

/* ── NOTICIAS ───────────────────────────────────────────── */
.et-news-section {
    background: var(--et-light-bg);
}

.et-news-card {
    background: #fff;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,.07);
    transition: box-shadow .2s, transform .15s;
}
.et-news-card:hover {
    box-shadow: 0 4px 14px rgba(0,0,0,.12);
    transform: translateY(-2px);
}

.et-news-thumb img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    display: block;
}

.et-news-thumb-placeholder {
    width: 100%;
    height: 180px;
    background: #dce3ea;
}

.et-news-link {
    color: var(--et-navy);
    text-decoration: none;
    font-weight: 600;
    font-size: 0.95rem;
    line-height: 1.4;
}
.et-news-link:hover { color: var(--et-blue); }

/* ── BUTTONS ────────────────────────────────────────────── */
.et-btn-primary {
    background: var(--et-green);
    color: #fff;
    border: none;
}
.et-btn-primary:hover {
    background: var(--et-green-cta);
    color: #fff;
}

.et-dir-arrows .btn {
    line-height: 1;
    padding: 4px 10px;
}

/* ── FOOTER ─────────────────────────────────────────────── */
.et-footer {
    margin-top:25px;
    background: var(--et-green);
}

.et-footer-logo {
    height: 44px;
    width: auto;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.et-footer-link {
    color: rgba(255,255,255,0.75);
    text-decoration: none;
    transition: color .2s;
}
.et-footer-link:hover { color: #fff; }

.et-social-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: rgba(255,255,255,0.15);
    border-radius: 50%;
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    transition: background .2s;
}
.et-social-btn:hover {
    background: rgba(255,255,255,0.35);
    color: #fff;
}

.et-footer-bottom {
    background: rgba(0,0,0,0.15);
}

/* ── HOME GRID ──────────────────────────────────────────── */
.et-home-grid {
    background: var(--et-light-bg);
    border-top: 1px solid var(--et-border);
    border-bottom: 1px solid var(--et-border);
}

/* Cabecera de sección directorio en home */
.et-home-dir-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--et-blue);
}
.et-home-dir-header .et-section-title {
    font-size: 20px;
    letter-spacing: 2.5px;
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

/* ── WooCommerce overrides ──────────────────────────────── */
.woocommerce .button,
.woocommerce button.button {
    background: var(--et-green) !important;
    color: #fff !important;
    border-radius: 4px !important;
}

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 991.98px) {
    .et-hero-slide { height: 300px; }
    .et-logo-img { height: 38px; }
    .et-navbar .navbar-nav { padding: 8px 0; }
    .et-nav-sep { display: none; }
}

@media (max-width: 575.98px) {
    .et-hero-slide { height: 260px; }
    .et-hero-title { font-size: 1.25rem; }
    .et-cta-text { display: none; }
}

/* ══════════════════════════════════════════════════════════
   DIRECTORIO — archive-empresa.php
   ══════════════════════════════════════════════════════════ */

/* Hero azul del directorio */
.et-dir-hero {
    background: linear-gradient(135deg, var(--et-navy) 0%, var(--et-blue) 100%);
    color: #fff;
    padding: 48px 0 40px;
    text-align: center;
}
.et-dir-hero-title {
    font-family: var(--et-font-brand);
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: .5rem;
}
.et-dir-hero-sub {
    font-size: 1rem;
    opacity: .85;
    max-width: 600px;
    margin: 0 auto;
}

/* Barra de filtros */
.et-filter-bar { border-radius: 10px !important; }
.et-filter-bar .form-select,
.et-filter-bar .form-control { border-radius: 6px; }

/* Cards de empresa */
.et-empresa-card {
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 10px;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    transition: box-shadow .2s, transform .2s;
    position: relative;
}
.et-empresa-card:hover {
    box-shadow: 0 8px 24px rgba(0,0,0,.12);
    transform: translateY(-3px);
}
.et-empresa-card.et-card-premium { border-color: var(--et-blue); }
.et-empresa-card.et-card-platino { border-color: #f59f00; }

/* Badge de plan */
.et-card-plan-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: .5px;
}
.et-badge-premium { background: var(--et-blue); color: #fff; }
.et-badge-platino { background: #f59f00; color: #fff; }

/* Logo de empresa */
.et-empresa-card-logo {
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--et-light-bg);
    border-bottom: 1px solid var(--et-border);
    padding: 16px;
}
.et-empresa-card-logo img {
    max-height: 78px;
    max-width: 100%;
    object-fit: contain;
}
.et-logo-initials {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: var(--et-navy);
    color: #fff;
    font-size: 1.4rem;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
}

/* Cuerpo de la card */
.et-empresa-card-body {
    padding: 16px;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.et-empresa-card-title {
    font-size: .95rem;
    font-weight: 700;
    margin-bottom: 6px;
    line-height: 1.3;
    color: var(--et-navy);
}
.et-empresa-card-title a { color: inherit; text-decoration: none; }
.et-empresa-card-title a:hover { color: var(--et-blue); }

.et-verified { color: var(--et-green); font-size: .75rem; margin-left: 4px; }

.et-empresa-cat-badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .5px;
    background: var(--et-light-bg);
    color: var(--et-muted);
    border-radius: 3px;
    padding: 2px 7px;
}
.et-empresa-loc { font-size: .8rem; }

/* Sidebar del directorio */
.et-dir-sidebar { position: sticky; top: 90px; }
.et-sidebar-title {
    font-size: .85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .7px;
    color: var(--et-muted);
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--et-border);
}
.et-sidebar-cat-link {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .875rem;
    color: var(--et-text);
    text-decoration: none;
    padding: 5px 0;
    border-bottom: 1px solid var(--et-border);
    transition: color .15s;
}
.et-sidebar-cat-link:hover { color: var(--et-blue); }

/* Botón primario genérico */
.et-btn-primary {
    background: var(--et-blue);
    color: #fff !important;
    border: none;
    font-weight: 600;
    border-radius: 5px;
    text-decoration: none;
    transition: background .2s;
}
.et-btn-primary:hover { background: var(--et-navy); }

/* Paginación */
.et-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    border: 1px solid var(--et-border);
    border-radius: 5px;
    font-size: .875rem;
    font-weight: 600;
    color: var(--et-text);
    text-decoration: none;
    margin: 2px;
    padding: 0 8px;
    transition: background .15s;
}
.et-pagination .page-numbers.current,
.et-pagination .page-numbers:hover { background: var(--et-blue); color: #fff; border-color: var(--et-blue); }

/* Ad inline (listado) */
.et-ad-inline { text-align: center; }

/* ══════════════════════════════════════════════════════════
   SINGLE POST — single.php
   ══════════════════════════════════════════════════════════ */

/* Hero del post */
.et-post-hero {
    position: relative;
    overflow: hidden;
}
.et-post-hero--img {
    min-height: 460px;
    display: flex;
    align-items: flex-end;
}
.et-post-hero--plain {
    background: linear-gradient(135deg, var(--et-navy), var(--et-blue));
    min-height: 280px;
    display: flex;
    align-items: center;
}

/* Imagen de fondo */
.et-post-hero-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transition: transform 6s ease;
}
.et-post-hero:hover .et-post-hero-bg { transform: scale(1.04); }

/* Overlay degradado */
.et-post-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(10,15,30,.88) 0%, rgba(10,15,30,.45) 50%, rgba(10,15,30,.15) 100%);
}

/* Contenido sobre el hero */
.et-post-hero-content {
    position: relative;
    z-index: 1;
    padding: 48px 0 40px;
    color: #fff;
}
.et-post-cat-badge {
    display: inline-block;
    background: var(--et-blue);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    border-radius: 4px;
    padding: 3px 10px;
    margin-bottom: 14px;
    text-decoration: none;
}
.et-post-cat-badge:hover { background: var(--et-green); color: #fff; }

.et-post-hero-title {
    font-family: var(--et-font-brand);
    font-size: 2.4rem;
    font-weight: 800;
    line-height: 1.2;
    color: #fff;
    margin-bottom: 14px;
    text-shadow: 0 2px 8px rgba(0,0,0,.4);
}
.et-post-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    font-size: .875rem;
    opacity: .85;
    color: #fff;
}

/* Cuerpo del artículo */
.et-post-content {
    font-size: 1.05rem;
    line-height: 1.8;
    color: #333;
}
.et-post-content h2,
.et-post-content h3 {
    font-family: var(--et-font-brand);
    color: var(--et-navy);
    margin-top: 2rem;
    margin-bottom: .75rem;
}
.et-post-content p { margin-bottom: 1.25rem; }
.et-post-content a { color: var(--et-blue); }
.et-post-content img { max-width: 100%; border-radius: 8px; margin: 1rem 0; }
.et-post-content blockquote {
    border-left: 4px solid var(--et-blue);
    padding: 12px 20px;
    background: var(--et-light-bg);
    border-radius: 0 6px 6px 0;
    margin: 1.5rem 0;
    font-style: italic;
    color: var(--et-muted);
}

/* Tags */
.et-tag-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    border: 1px solid var(--et-border);
    border-radius: 20px;
    padding: 3px 10px;
    color: var(--et-muted);
    text-decoration: none;
    margin: 2px;
}
.et-tag-badge:hover { background: var(--et-blue); color: #fff; border-color: var(--et-blue); }

/* Caja de autor */
.et-post-author-box {
    background: var(--et-light-bg);
    border-left: 4px solid var(--et-blue);
}
.et-post-author-box img { width: 72px; height: 72px; }

/* Navegación entre posts */
.et-post-nav-link {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 16px 20px;
    background: var(--et-light-bg);
    border-radius: 8px;
    text-decoration: none;
    border: 1px solid var(--et-border);
    transition: background .2s;
}
.et-post-nav-link:hover { background: var(--et-blue); color: #fff; }
.et-post-nav-dir { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--et-muted); }
.et-post-nav-title { font-size: .875rem; font-weight: 600; color: var(--et-text); }
.et-post-nav-link:hover .et-post-nav-dir,
.et-post-nav-link:hover .et-post-nav-title { color: #fff; }

/* Posts relacionados en sidebar */
.et-related-title {
    font-size: .85rem;
    font-weight: 600;
    color: var(--et-text);
    text-decoration: none;
    line-height: 1.3;
    display: block;
}
.et-related-title:hover { color: var(--et-blue); }
.et-post-sidebar .et-sidebar-widget {
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 10px;
    padding: 20px;
}

/* ── Responsive single post ─────────────────────────────── */
@media (max-width: 767.98px) {
    .et-post-hero-title { font-size: 1.6rem; }
    .et-post-hero--img { min-height: 320px; }
}

/* ══════════════════════════════════════════════════════════
   HOMEPAGE — Mini-cards Directorio + Categorías
   ══════════════════════════════════════════════════════════ */

/* Mini-card de empresa en homepage */
.et-home-dir-card {
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 10px;
    overflow: hidden;
    transition: box-shadow .2s, transform .18s;
    height: 100%;
}
.et-home-dir-card:hover {
    box-shadow: 0 6px 18px rgba(0,0,0,.11);
    transform: translateY(-2px);
}

/* Zona del logo */
.et-home-dir-logo {
    height: 90px;
    background: var(--et-light-bg);
    border-bottom: 1px solid var(--et-border);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
}
.et-home-dir-logo img {
    max-height: 68px;
    max-width: 100%;
    object-fit: contain;
}
.et-home-dir-initials {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: var(--et-navy);
    color: #fff;
    font-size: 1.1rem;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Info debajo del logo */
.et-home-dir-info {
    padding: 8px 10px;
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.et-home-dir-name {
    font-size: .78rem;
    font-weight: 700;
    color: var(--et-navy);
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.et-home-dir-cat {
    font-size: .68rem;
    color: var(--et-muted);
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Categorías con íconos grandes */
.et-cat-item {
    padding: 9px 12px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid var(--et-border);
    transition: border-color .15s, box-shadow .15s, background .15s;
}
.et-cat-item:hover {
    border-color: var(--et-blue);
    box-shadow: 0 2px 8px rgba(21,101,192,.1);
    background: #fff;
}

.et-cat-icon {
    font-size: 1.35rem;
    line-height: 1;
    flex-shrink: 0;
    width: 30px;
    text-align: center;
}
.et-cat-label {
    font-size: .88rem;
    font-weight: 600;
    color: var(--et-text);
    line-height: 1.3;
}
.et-cat-item:hover .et-cat-label { color: var(--et-blue); }

/* ══════════════════════════════════════════════════════════
   HOMEPAGE — Tarjetas Empresa Destacada / Tips / Historia
   ══════════════════════════════════════════════════════════ */

/* Sección contenedora */
.et-highlight-cards {
    background: var(--et-light-bg);
    border-top: 1px solid var(--et-border);
    border-bottom: 1px solid var(--et-border);
}

/* Card base */
.et-highlight-card {
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
    transition: box-shadow .2s;
}
.et-highlight-card:hover { box-shadow: 0 6px 20px rgba(0,0,0,.1); }

/* Cabecera navy de cada card */
.et-highlight-card-header {
    background: var(--et-navy);
    padding: 10px 18px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.et-highlight-label {
    font-size: 16px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #fff;
}

/* Cuerpo de la card */
.et-highlight-card-body {
    padding: 20px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* ── Empresa Destacada ─────────────────────────────────── */
.et-empresa-dest-logo {
    width: 100%;
    height: 120px;
    background: var(--et-light-bg);
    border-bottom: 1px solid var(--et-border);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.et-empresa-dest-logo img {
    max-height: 90px;
    max-width: 100%;
    object-fit: contain;
}
.et-logo-placeholder-lg {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: var(--et-navy);
    color: #fff;
    font-size: 1.75rem;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
}
.et-empresa-dest-name {
    font-family: var(--et-font-brand);
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--et-navy);
    line-height: 1.3;
}
.et-empresa-dest-name a {
    color: inherit;
    text-decoration: none;
}
.et-empresa-dest-name a:hover { color: var(--et-blue); }

/* ── Tips ──────────────────────────────────────────────── */
.et-tip-item {
    padding: 8px 0;
}
.et-tip-num {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--et-blue);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2px;
}
.et-tip-title {
    font-size: .875rem;
    font-weight: 600;
    color: var(--et-text);
    text-decoration: none;
    line-height: 1.4;
    transition: color .15s;
}
.et-tip-title:hover { color: var(--et-blue); }

/* ── Historia ──────────────────────────────────────────── */
.et-historia-thumb {
    overflow: hidden;
    max-height: 190px;
}
.et-historia-thumb img {
    width: 100%;
    height: 190px;
    object-fit: cover;
    display: block;
    transition: transform .4s ease;
}
.et-highlight-card:hover .et-historia-thumb img {
    transform: scale(1.05);
}
.et-historia-title {
    font-family: var(--et-font-brand);
    font-size: 1rem;
    font-weight: 700;
    color: var(--et-navy);
    line-height: 1.4;
    margin-bottom: 6px;
}
.et-historia-title a {
    color: inherit;
    text-decoration: none;
}
.et-historia-title a:hover { color: var(--et-blue); }
.et-historia-placeholder {
    height: 140px;
    background: linear-gradient(135deg, var(--et-light-bg), #e9ecef);
    border-radius: 6px;
}

/* ── Botón outline compartido ─────────────────────────── */
.et-btn-outline {
    border: 2px solid var(--et-blue);
    color: var(--et-blue);
    background: transparent;
    font-weight: 700;
    border-radius: 5px;
    transition: background .2s, color .2s;
    text-decoration: none;
}
.et-btn-outline:hover {
    background: var(--et-blue);
    color: #fff;
}

/* ══════════════════════════════════════════════════════════
   SINGLE EMPRESA — Detalle de empresa
   ══════════════════════════════════════════════════════════ */

.et-empresa-single-main { background: var(--et-light-bg); }

/* ── Hero de empresa ─────────────────────────────────────── */
.et-emp-hero {
    position: relative;
    overflow: hidden;
    min-height: 380px;
    display: flex;
    align-items: flex-end;
}
.et-emp-hero--img {
    min-height: 420px;
}
.et-emp-hero--plain {
    background: linear-gradient(135deg, var(--et-navy) 0%, #1a3a5c 60%, var(--et-blue) 100%);
    min-height: 300px;
}
.et-emp-hero-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transition: transform 7s ease;
}
.et-emp-hero:hover .et-emp-hero-bg { transform: scale(1.04); }
.et-emp-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(8, 14, 32, .92) 0%,
        rgba(8, 14, 32, .60) 45%,
        rgba(8, 14, 32, .20) 100%
    );
}
.et-emp-hero-content {
    position: relative;
    z-index: 1;
    padding-top: 56px;
    padding-bottom: 36px;
    color: #fff;
}
.et-emp-hero-inner { max-width: 860px; }
.et-emp-hero-cats { display: flex; gap: 6px; flex-wrap: wrap; }

/* Logo + nombre dentro del hero */
.et-emp-hero-brand {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 10px;
}
.et-emp-hero-logo {
    width: 100px;
    height: 100px;
    border-radius: 14px;
    border: 3px solid rgba(255,255,255,.3);
    background: rgba(255,255,255,.12);
    backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
    box-shadow: 0 4px 20px rgba(0,0,0,.35);
}
.et-emp-hero-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 6px;
}
.et-emp-hero-initials {
    font-size: 2.2rem;
    font-weight: 900;
    color: #fff;
    font-family: var(--et-font-brand);
}
.et-emp-hero-text { flex: 1; min-width: 0; }
.et-emp-hero-title {
    font-family: var(--et-font-brand);
    font-size: 2.2rem;
    font-weight: 900;
    color: #fff;
    line-height: 1.15;
    margin: 0 0 8px;
    text-shadow: 0 2px 10px rgba(0,0,0,.45);
}
.et-hero-badge-verified {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    background: var(--et-green);
    color: #fff;
    border-radius: 50%;
    font-size: 13px;
    font-weight: 900;
    vertical-align: middle;
    margin-left: 6px;
}
.et-emp-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    font-size: .85rem;
    color: rgba(255,255,255,.85);
}
.et-emp-hero-meta svg { vertical-align: -2px; opacity: .8; }
.et-emp-hero-badges { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.et-emp-hero-tag {
    display: inline-block;
    background: rgba(255,255,255,.15);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    border-radius: 20px;
    padding: 3px 12px;
    border: 1px solid rgba(255,255,255,.3);
    backdrop-filter: blur(4px);
}

/* Plan badge variants */
.et-plan-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 700;
    border-radius: 20px;
    padding: 3px 12px;
    letter-spacing: .3px;
}
.et-plan-basico   { background: rgba(108,117,125,.2); color: #d4dae1; border: 1px solid rgba(108,117,125,.4); }
.et-plan-estandar { background: rgba(0,150,199,.25); color: #7dd6f4; border: 1px solid rgba(0,150,199,.4); }
.et-plan-premium  { background: rgba(245,159,0,.25); color: #fde68a; border: 1px solid rgba(245,159,0,.5); }
.et-plan-platino  { background: linear-gradient(135deg, rgba(99,102,241,.3), rgba(168,85,247,.3)); color: #d9d6fe; border: 1px solid rgba(168,85,247,.5); }
.et-plan-destacado { background: rgba(245,159,0,.35); color: #fef3c7; border: 1px solid rgba(245,159,0,.6); }

/* ── Barra de CTA ────────────────────────────────────────── */
.et-emp-cta-bar {
    background: #fff;
    border-bottom: 1px solid var(--et-border);
    box-shadow: 0 2px 12px rgba(0,0,0,.07);
    position: sticky;
    top: 0;
    z-index: 100;
}
.et-emp-cta-inner {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 0;
    flex-wrap: wrap;
}
.et-cta-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .82rem;
    font-weight: 700;
    border-radius: 6px;
    padding: 8px 16px;
    text-decoration: none;
    border: 2px solid transparent;
    transition: opacity .15s, transform .1s;
    white-space: nowrap;
}
.et-cta-chip:hover { opacity: .88; transform: translateY(-1px); }
.et-cta-chip-tel   { border-color: #adb5bd; color: var(--et-text); background: var(--et-light-bg); }
.et-cta-chip-wa    { background: #25d366; color: #fff; border-color: #25d366; }
.et-cta-chip-email { background: var(--et-blue); color: #fff; border-color: var(--et-blue); }
.et-cta-chip-web   { border-color: var(--et-border); color: var(--et-muted); background: #fff; }
.et-cta-social-sep { width: 1px; height: 28px; background: var(--et-border); margin: 0 4px; flex-shrink: 0; }
.et-cta-soc {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    color: #fff;
    text-decoration: none;
    transition: opacity .15s, transform .1s;
    flex-shrink: 0;
}
.et-cta-soc:hover { opacity: .85; transform: translateY(-1px); }
.et-cta-soc-fb { background: #1877f2; }
.et-cta-soc-ig { background: linear-gradient(135deg, #f09433, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888); }
.et-cta-soc-li { background: #0a66c2; }
.et-cta-soc-yt { background: #ff0000; }
.et-cta-soc-tw { background: #000; }

/* Keep old .et-cta-btn for backward compatibility */
.et-cta-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .8rem;
    font-weight: 700;
    border-radius: 6px;
    padding: 7px 14px;
    text-decoration: none;
    border: 2px solid transparent;
    transition: opacity .15s;
    white-space: nowrap;
}
.et-cta-btn:hover { opacity: .85; }
.et-cta-btn-icon { font-size: 15px; }
.et-cta-tel   { border-color: #adb5bd; color: var(--et-text); background: #fff; }
.et-cta-wa    { background: #25d366; color: #fff; border-color: #25d366; }
.et-cta-email { border-color: var(--et-blue); color: var(--et-blue); background: #fff; }
.et-cta-web   { border-color: var(--et-muted); color: var(--et-muted); background: #fff; font-size: .75rem; }

/* ── Stats rápidas sidebar ───────────────────────────────── */
.et-emp-quick-stats {
    display: flex;
    gap: 10px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--et-border);
}
.et-stat-box {
    flex: 1;
    text-align: center;
    background: var(--et-light-bg);
    border-radius: 8px;
    padding: 10px 6px;
}
.et-stat-num {
    display: block;
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--et-navy);
    font-family: var(--et-font-brand);
    line-height: 1;
}
.et-stat-lbl {
    display: block;
    font-size: .67rem;
    color: var(--et-muted);
    margin-top: 3px;
    text-transform: uppercase;
    letter-spacing: .5px;
}

/* ── Categorías/certs al pie ─────────────────────────────── */
.et-emp-terms-row { display: flex; flex-direction: column; gap: 14px; }
.et-emp-terms-group {}
.et-emp-terms-label {
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .8px;
    color: var(--et-muted);
    margin-bottom: 8px;
    display: block;
}
.et-emp-terms-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.et-term-chip {
    display: inline-block;
    font-size: .78rem;
    font-weight: 600;
    background: var(--et-light-bg);
    border: 1px solid var(--et-border);
    border-radius: 20px;
    padding: 4px 12px;
    color: var(--et-text);
    text-decoration: none;
    transition: background .15s, border-color .15s;
}
a.et-term-chip:hover { background: var(--et-blue); color: #fff; border-color: var(--et-blue); }
.et-term-chip-cert { background: #f0fdf4; border-color: #86efac; color: #166534; }

/* ── Galería mejorada ────────────────────────────────────── */
.et-galeria-masonry {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 10px;
}

/* ── Secciones ───────────────────────────────────────────── */
.et-emp-section {
    background: #fff;
    border-radius: 10px;
    border: 1px solid var(--et-border);
    padding: 24px;
    margin-bottom: 16px;
}
.et-emp-section-title {
    font-family: var(--et-font-brand);
    font-size: 1rem;
    font-weight: 800;
    color: var(--et-navy);
    text-transform: uppercase;
    letter-spacing: .5px;
    padding-bottom: 10px;
    margin-bottom: 18px;
    border-bottom: 3px solid var(--et-blue);
    display: inline-block;
}

/* Sobre la empresa */
.et-emp-description {
    font-size: .95rem;
    line-height: 1.75;
    color: #444;
}
.et-emp-description p { margin-bottom: .9rem; }
.et-emp-description p:last-child { margin-bottom: 0; }

/* ── Soluciones y Productos ─────────────────────────────── */
.et-producto-card {
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 8px;
    padding: 16px 10px;
    height: 100%;
    transition: box-shadow .18s, transform .18s;
}
.et-producto-card:hover {
    box-shadow: 0 4px 14px rgba(0,0,0,.1);
    transform: translateY(-2px);
}
.et-producto-icon {
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
    font-size: 2.2rem;
}
.et-producto-icon img {
    max-height: 60px;
    max-width: 90%;
    object-fit: contain;
}
.et-producto-nombre {
    font-size: .82rem;
    font-weight: 700;
    color: var(--et-navy);
    margin-bottom: 4px;
    line-height: 1.3;
}
.et-producto-desc {
    font-size: .75rem;
    color: var(--et-muted);
    margin: 0;
    line-height: 1.4;
}

/* ── Tipos de empaque ───────────────────────────────────── */
.et-tipo-item { text-align: center; }
.et-tipo-thumb {
    border-radius: 8px;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    background: var(--et-light-bg);
    margin-bottom: 6px;
}
.et-tipo-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .3s ease;
}
.et-tipo-item:hover .et-tipo-thumb img { transform: scale(1.06); }
.et-tipo-placeholder {
    aspect-ratio: 1 / 1;
    background: var(--et-light-bg);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    margin-bottom: 6px;
}
.et-tipo-label {
    font-size: .72rem;
    font-weight: 600;
    color: var(--et-text);
    margin: 0;
    line-height: 1.3;
}

/* ── Galería ────────────────────────────────────────────── */
.et-galeria-link { display: block; }
.et-galeria-thumb {
    border-radius: 8px;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background: var(--et-light-bg);
}
.et-galeria-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .3s ease;
}
.et-galeria-link:hover .et-galeria-thumb img { transform: scale(1.06); }

/* ── Servicios ──────────────────────────────────────────── */
.et-servicios-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 12px;
}
.et-servicio-item {
    background: var(--et-light-bg);
    border: 1px solid var(--et-border);
    border-left: 3px solid var(--et-primary);
    border-radius: 8px;
    padding: 14px 16px;
    transition: box-shadow .2s ease, border-color .2s ease;
}
.et-servicio-item:hover {
    box-shadow: 0 4px 14px rgba(0,0,0,.07);
    background: #fff;
}
.et-serv-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.et-serv-nombre {
    font-size: .9rem;
    font-weight: 700;
    color: var(--et-dark);
    line-height: 1.3;
}
.et-serv-desc {
    font-size: .78rem;
    color: var(--et-muted);
    line-height: 1.4;
}
/* ── Sidebar ────────────────────────────────────────────── */
.et-emp-sidebar { position: sticky; top: 90px; }

.et-emp-sidebar-widget {
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 10px;
    overflow: hidden;
}

.et-emp-info-card { padding: 18px; }

.et-emp-sidebar-title {
    font-size: .82rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .7px;
    color: var(--et-muted);
    border-bottom: 2px solid var(--et-border);
    padding-bottom: 8px;
    margin-bottom: 14px;
}

.et-emp-info-list { margin: 0; }
.et-emp-info-list li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: .83rem;
    padding: 5px 0;
    border-bottom: 1px solid var(--et-border);
    color: var(--et-text);
}
.et-emp-info-list li:last-child { border-bottom: none; }
.et-info-icon { flex-shrink: 0; font-size: 14px; margin-top: 1px; }
.et-emp-info-list a {
    color: var(--et-blue);
    text-decoration: none;
    word-break: break-all;
}
.et-emp-info-list a:hover { text-decoration: underline; }

/* Redes sociales en sidebar */
.et-soc-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    color: #fff;
    text-transform: uppercase;
}
.et-soc-fb { background: #1877f2; }
.et-soc-ig { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.et-soc-li { background: #0a66c2; }

/* Certificaciones */
.et-certs-grid { display: flex; flex-direction: column; gap: 8px; }
.et-cert-chip {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--et-light-bg);
    border-radius: 6px;
    padding: 7px 10px;
    font-size: .8rem;
}
.et-cert-chip-icon { font-size: 1.2rem; flex-shrink: 0; }
.et-cert-chip-label { font-weight: 600; color: var(--et-text); }

/* ── Responsive hero empresa ─────────────────────────────── */
@media (max-width: 991.98px) {
    .et-emp-hero { min-height: 320px; }
    .et-emp-hero--img { min-height: 350px; }
    .et-emp-hero-title { font-size: 1.7rem; }
    .et-emp-hero-logo { width: 80px; height: 80px; }
}
@media (max-width: 575.98px) {
    .et-emp-hero { min-height: 280px; }
    .et-emp-hero--img { min-height: 300px; }
    .et-emp-hero-title { font-size: 1.4rem; }
    .et-emp-hero-brand { gap: 14px; }
    .et-emp-hero-logo { width: 68px; height: 68px; border-radius: 10px; }
    .et-emp-cta-inner { gap: 6px; }
    .et-cta-chip { padding: 7px 12px; font-size: .78rem; }
}

/* ══════════════════════════════════════════════════════════
   TARJETA HORIZONTAL DE EMPRESA — et-lcard (directorio & home)
   ══════════════════════════════════════════════════════════ */

.et-lcard {
    display: flex;
    gap: 11px;
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 8px;
    padding: 13px;
    height: 100%;
    transition: box-shadow .18s, transform .15s;
}
.et-lcard:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,.1);
    transform: translateY(-2px);
}
.et-lcard.et-lcard-premium { border-left: 3px solid var(--et-blue); }
.et-lcard.et-lcard-platino  { border-left: 3px solid #f59f00; }

/* Logo */
.et-lcard-logo {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    border: 1px solid var(--et-border);
    border-radius: 7px;
    background: var(--et-light-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 4px;
}
.et-lcard-logo img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
.et-lcard-initials {
    font-size: .9rem;
    font-weight: 800;
    color: var(--et-navy);
    font-family: var(--et-font-brand);
    line-height: 1;
    text-align: center;
}

/* Cuerpo */
.et-lcard-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }

.et-lcard-name {
    font-size: 18px;
    font-weight: 700;
    color: var(--et-blue);
    text-decoration: none;
    line-height: 1.3;
    display: block;
}
.et-lcard-name:hover { color: var(--et-navy); text-decoration: underline; }

.et-lcard-verified {
    flex-shrink: 0;
    font-size: 11px;
    font-weight: 700;
    color: var(--et-green);
    background: #e8f5e9;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2px;
}

.et-lcard-cat {
    font-size: 14px;
    color: var(--et-muted);
    margin: 2px 0 5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.et-lcard-excerpt {
    font-size: 14px;
    color: #555;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 6px;
    flex: 1;
}

/* Badges de certificación */
.et-lcard-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
    margin-bottom: 4px;
}
.et-lbadge {
    font-size: 10px;
    font-weight: 700;
    border-radius: 3px;
    padding: 1px 6px;
    letter-spacing: .2px;
}
.et-lbadge-green { background: var(--et-green); color: #fff; }
.et-lbadge-blue  { color: var(--et-blue); border: 1px solid var(--et-blue); background: transparent; }

/* Ubicación */
.et-lcard-loc {
    font-size: 14px;
    color: var(--et-muted);
    margin: 3px 0 6px;
}

/* Botones de acción */
.et-lcard-actions { display: flex; gap: 5px; flex-wrap: wrap; margin-top: auto; }

.et-lcard-btn {
    font-size: 11px;
    font-weight: 700;
    border-radius: 4px;
    padding: 4px 11px;
    text-decoration: none;
    transition: background .15s, color .15s;
    white-space: nowrap;
}
.et-lcard-btn-primary {
    background: var(--et-blue);
    color: #fff;
    border: 1px solid var(--et-blue);
}
.et-lcard-btn-primary:hover { background: var(--et-navy); border-color: var(--et-navy); color: #fff; }
.et-lcard-btn-outline {
    background: transparent;
    color: var(--et-muted);
    border: 1px solid var(--et-border);
}
.et-lcard-btn-outline:hover { background: var(--et-light-bg); color: var(--et-text); }
.et-lcard-btn-wa {
    background: #25d366;
    color: #fff;
    border: 1px solid #25d366;
}
.et-lcard-btn-wa:hover { background: #1ebe5d; color: #fff; }

/* ══════════════════════════════════════════════════════════
   FILTROS TIPO PILL — Directorio
   ══════════════════════════════════════════════════════════ */

.et-pill-filter-bar {
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 10px;
    padding: 12px 16px;
}

.et-pill-select {
    appearance: none;
    -webkit-appearance: none;
    background: var(--et-light-bg);
    border: 1.5px solid var(--et-border);
    border-radius: 8px;
    font-size: .88rem;
    font-weight: 600;
    color: var(--et-text);
    padding: 10px 16px;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    white-space: nowrap;
    height: 46px;
}
.et-pill-select:hover,
.et-pill-select:focus {
    border-color: var(--et-blue);
    background: #fff;
    outline: none;
    box-shadow: 0 0 0 3px rgba(21,101,192,.12);
}

/* Ubicación — ancho fijo compacto */
#filter-ubicacion {
    flex: 0 0 auto;
    min-width: 160px;
    max-width: 200px;
}

/* Título de sección en directorio */
.et-dir-section-title {
    font-family: var(--et-font-brand);
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--et-navy);
    margin: 0;
}

/* Banner inline entre filas */
.et-dir-ad-break { text-align: center; }

/* ══════════════════════════════════════════════════════════
   ARCHIVE DE POSTS — Noticias, Tips, Historias
   ══════════════════════════════════════════════════════════ */

/* Hero del archive */
.et-archive-hero {
    background: linear-gradient(135deg, var(--et-navy) 0%, var(--et-blue) 100%);
    color: #fff;
    padding: 42px 0 36px;
}
.et-dir-breadcrumb .breadcrumb-item,
.et-dir-breadcrumb .breadcrumb-item a { color: rgba(255,255,255,.7); font-size: .8rem; }
.et-dir-breadcrumb .breadcrumb-item.active { color: rgba(255,255,255,.95); }
.et-dir-breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: rgba(255,255,255,.4); }
.et-archive-icon { font-size: 2.4rem; line-height: 1; }
.et-archive-title {
    font-family: var(--et-font-brand);
    font-size: 1.8rem;
    font-weight: 800;
    margin: 0;
    color: #fff;
}
.et-archive-count { font-size: .85rem; opacity: .75; margin: 2px 0 0; }
.et-archive-desc  { font-size: .9rem; opacity: .8; max-width: 600px; }

/* Card de post en archive */
.et-arc-card {
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 10px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: box-shadow .2s, transform .18s;
}
.et-arc-card:hover {
    box-shadow: 0 8px 24px rgba(0,0,0,.12);
    transform: translateY(-3px);
}

/* Imagen del card */
.et-arc-thumb-link { display: block; overflow: hidden; }
.et-arc-thumb { overflow: hidden; height: 170px; }
.et-arc-img {
    width: 100%;
    height: 170px;
    object-fit: cover;
    display: block;
    transition: transform .4s ease;
}
.et-arc-card:hover .et-arc-img { transform: scale(1.05); }
.et-arc-thumb-placeholder {
    height: 170px;
    background: linear-gradient(135deg, var(--et-navy), var(--et-blue));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
}

/* Cuerpo del card */
.et-arc-body { padding: 16px 16px 8px; flex: 1; }
.et-arc-cat-badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .7px;
    background: var(--et-blue);
    color: #fff;
    border-radius: 3px;
    padding: 2px 8px;
    margin-bottom: 8px;
    text-decoration: none;
}
.et-arc-cat-badge:hover { background: var(--et-navy); color: #fff; }
.et-arc-title {
    font-family: var(--et-font-brand);
    font-size: .95rem;
    font-weight: 700;
    line-height: 1.35;
    color: var(--et-navy);
    margin-bottom: 8px;
}
.et-arc-title a { color: inherit; text-decoration: none; }
.et-arc-title a:hover { color: var(--et-blue); }
.et-arc-excerpt { font-size: .8rem; color: #666; line-height: 1.5; margin-bottom: 10px; }
.et-arc-meta { display: flex; flex-wrap: wrap; gap: 10px; font-size: .72rem; color: var(--et-muted); }

/* Footer del card */
.et-arc-footer { padding: 0 16px 14px; }
.et-arc-btn {
    font-size: .78rem;
    font-weight: 700;
    color: var(--et-blue);
    text-decoration: none;
    border: 1.5px solid var(--et-blue);
    border-radius: 4px;
    padding: 4px 12px;
    transition: background .15s, color .15s;
    display: inline-block;
}
.et-arc-btn:hover { background: var(--et-blue); color: #fff; }

/* Sidebar de archive */
.et-arc-sidebar-cat {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .875rem;
    font-weight: 600;
    color: var(--et-text);
    text-decoration: none;
    padding: 8px 10px;
    border-radius: 7px;
    transition: background .15s;
    margin-bottom: 4px;
}
.et-arc-sidebar-cat:hover { background: var(--et-light-bg); color: var(--et-blue); }
.et-arc-sidebar-cat--active { background: var(--et-blue); color: #fff !important; }
.et-arc-sidebar-cat--active:hover { background: var(--et-navy); }
.et-arc-sidebar-count {
    margin-left: auto;
    font-size: .72rem;
    font-weight: 700;
    background: var(--et-border);
    color: var(--et-muted);
    border-radius: 10px;
    padding: 1px 7px;
}
.et-arc-sidebar-cat--active .et-arc-sidebar-count { background: rgba(255,255,255,.25); color: #fff; }

/* Pill-search input */
.et-pill-search { flex: 1; min-width: 160px; }
.et-pill-input {
    width: 100%;
    border: 1px solid var(--et-border);
    border-radius: 20px;
    font-size: .8rem;
    padding: 5px 14px;
    background: var(--et-light-bg);
    transition: border-color .15s;
}
.et-pill-input:focus { outline: none; border-color: var(--et-blue); background: #fff; box-shadow: 0 0 0 2px rgba(21,101,192,.15); }

.et-arc-banner-row { padding: 0; }

/* ══════════════════════════════════════════════════════════
   PAGE CONTACTO — Estilos completos
   ══════════════════════════════════════════════════════════ */

/* Hero */
.et-contacto-hero {
    background: linear-gradient(135deg, var(--et-navy) 0%, #1a6ab0 100%);
    color: #fff;
    padding: 52px 0 40px;
}
.et-contacto-title {
    font-family: var(--et-font-brand);
    font-size: 2.2rem;
    font-weight: 800;
    color: #fff;
    margin-bottom: 10px;
}
.et-contacto-sub { font-size: .95rem; opacity: .82; max-width: 560px; line-height: 1.6; }

/* Canales rápidos */
.et-contacto-channels {
    background: var(--et-light-bg);
    border-bottom: 1px solid var(--et-border);
    padding: 24px 0;
}
.et-ch-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 5px;
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 10px;
    padding: 18px 12px;
    text-decoration: none;
    color: var(--et-text);
    transition: box-shadow .18s, transform .15s, border-color .15s;
    height: 100%;
}
.et-ch-card:hover { box-shadow: 0 4px 14px rgba(0,0,0,.1); transform: translateY(-2px); border-color: var(--et-blue); color: var(--et-blue); }
.et-ch-card--wa:hover { border-color: #25d366; color: #25d366; }
.et-ch-card--hours { cursor: default; }
.et-ch-card--hours:hover { transform: none; box-shadow: none; border-color: var(--et-border); color: var(--et-text); }
.et-ch-icon { font-size: 1.6rem; }
.et-ch-label { font-size: .7rem; text-transform: uppercase; letter-spacing: .6px; font-weight: 700; color: var(--et-muted); }
.et-ch-value { font-size: .8rem; font-weight: 600; }

/* Body del contacto */
.et-contacto-body { padding: 56px 0 72px; }

/* Formulario */
.et-contacto-form-wrap {
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 12px;
    padding: 36px 36px 32px;
    box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
@media (max-width: 575px) { .et-contacto-form-wrap { padding: 22px 18px; } }

.et-contacto-form-title {
    font-family: var(--et-font-brand);
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--et-navy);
    margin-bottom: 4px;
}

/* Inputs */
.et-form-label { font-size: .82rem; font-weight: 700; color: var(--et-navy); margin-bottom: 5px; display: block; }
.et-form-input {
    border: 1.5px solid var(--et-border);
    border-radius: 7px;
    font-size: .875rem;
    padding: 10px 14px;
    transition: border-color .15s, box-shadow .15s;
}
.et-form-input:focus {
    border-color: var(--et-blue);
    box-shadow: 0 0 0 3px rgba(21,101,192,.12);
    outline: none;
}

/* Pills de asunto */
.et-asunto-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.et-asunto-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .78rem;
    font-weight: 600;
    padding: 6px 14px;
    border: 1.5px solid var(--et-border);
    border-radius: 20px;
    cursor: pointer;
    transition: border-color .15s, background .15s, color .15s;
    background: var(--et-light-bg);
    color: var(--et-text);
    user-select: none;
}
.et-asunto-pill:hover { border-color: var(--et-blue); background: #fff; color: var(--et-blue); }
.et-asunto-pill--active,
.et-asunto-pill input[type="radio"]:checked ~ .et-asunto-pill {
    background: var(--et-blue);
    border-color: var(--et-blue);
    color: #fff;
}
.et-asunto-pill:has(input[type="radio"]:checked) {
    background: var(--et-blue);
    border-color: var(--et-blue);
    color: #fff;
}

/* Sidebar de contacto */
.et-contacto-side-card {
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 10px;
    padding: 22px 22px 18px;
    box-shadow: 0 2px 8px rgba(0,0,0,.05);
}
.et-contacto-side-title {
    font-family: var(--et-font-brand);
    font-size: 1rem;
    font-weight: 800;
    color: var(--et-navy);
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--et-light-bg);
}

/* Lista de info */
.et-contacto-info-list { margin: 0; }
.et-contacto-info-list li {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 10px 0;
    border-bottom: 1px solid var(--et-light-bg);
}
.et-contacto-info-list li:last-child { border-bottom: none; }
.et-ci-icon { font-size: 1.2rem; flex-shrink: 0; margin-top: 2px; }
.et-contacto-info-list strong { display: block; font-size: .78rem; font-weight: 700; color: var(--et-navy); margin-bottom: 2px; }
.et-contacto-info-list span,
.et-contacto-info-list a { font-size: .8rem; color: var(--et-muted); text-decoration: none; line-height: 1.5; }
.et-contacto-info-list a:hover { color: var(--et-blue); }

/* Botones sociales */
.et-social-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .82rem;
    font-weight: 600;
    padding: 9px 14px;
    border-radius: 7px;
    text-decoration: none;
    color: var(--et-text);
    background: var(--et-light-bg);
    border: 1px solid var(--et-border);
    transition: background .15s, color .15s, border-color .15s;
}
.et-social-btn:hover { background: #fff; border-color: var(--et-blue); color: var(--et-blue); }
.et-social-btn--wa:hover  { border-color: #25d366; color: #25d366; }

/* CTA card contacto */
.et-contacto-cta-card {
    background: linear-gradient(135deg, var(--et-navy) 0%, var(--et-blue) 100%);
    color: #fff;
    border-radius: 10px;
    padding: 24px 22px;
    text-align: center;
}
.et-cta-card-icon { font-size: 2rem; display: block; margin-bottom: 10px; }
.et-contacto-cta-card h6,
.et-contacto-cta-card p { color: #fff; }
.et-contacto-cta-card p { opacity: .85; }

/* Éxito */
.et-contacto-success { background: var(--et-light-bg); border-radius: 10px; }

/* ══════════════════════════════════════════════════════════
   AUTOCOMPLETE DE CATEGORÍA — barra de filtros
   ══════════════════════════════════════════════════════════ */

.et-cat-autocomplete {
    position: relative;
    flex: 1;          /* crece para ocupar todo el espacio disponible */
    min-width: 200px;
}

/* Input wrap con ícono y botón limpiar */
.et-cat-ac-wrap {
    display: flex;
    align-items: center;
    background: var(--et-light-bg);
    border: 1.5px solid var(--et-border);
    border-radius: 8px;
    padding: 0 12px 0 14px;
    gap: 8px;
    height: 46px;
    transition: border-color .15s, background .15s, box-shadow .15s;
}
.et-cat-ac-wrap:focus-within {
    border-color: var(--et-blue);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(21,101,192,.12);
}

.et-cat-ac-icon { font-size: 1rem; flex-shrink: 0; }

.et-cat-ac-input {
    flex: 1;
    border: none;
    background: transparent;
    font-size: .93rem;
    font-weight: 600;
    color: var(--et-text);
    padding: 0;
    outline: none;
    min-width: 0;
    font-family: inherit;
    height: 100%;
}
.et-cat-ac-input::placeholder { color: var(--et-muted); font-weight: 500; }

/* Botón limpiar (×) */
.et-cat-ac-clear {
    flex-shrink: 0;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--et-muted);
    font-size: 1rem;
    line-height: 1;
    padding: 0 2px;
    border-radius: 50%;
    transition: color .15s, background .15s;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
}
.et-cat-ac-clear:hover { color: var(--et-navy); background: var(--et-border); }
.et-cat-ac-clear--hidden { visibility: hidden; pointer-events: none; }

/* Lista de sugerencias */
.et-cat-ac-list {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: 100%;
    width: max-content;
    max-width: 340px;
    max-height: 320px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 10px;
    box-shadow: 0 8px 28px rgba(0,0,0,.14);
    list-style: none;
    padding: 6px 0;
    margin: 0;
    z-index: 999;
    scroll-behavior: smooth;
}

/* Ítem de sugerencia */
.et-cat-ac-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 14px;
    cursor: pointer;
    transition: background .12s;
    flex-wrap: wrap;
}
.et-cat-ac-item:hover,
.et-cat-ac-item--active {
    background: var(--et-light-bg);
}
.et-cat-ac-item--active { outline: 2px solid var(--et-blue) inset; border-radius: 0; }

.et-cat-ac-name {
    font-size: .82rem;
    font-weight: 700;
    color: var(--et-navy);
    flex: 1;
}
.et-cat-ac-name mark {
    background: #fff3cd;
    color: var(--et-navy);
    border-radius: 2px;
    padding: 0 1px;
}

.et-cat-ac-parent {
    font-size: .7rem;
    color: var(--et-muted);
    background: var(--et-light-bg);
    border-radius: 3px;
    padding: 1px 6px;
    font-weight: 600;
}

.et-cat-ac-count {
    font-size: .7rem;
    font-weight: 700;
    color: var(--et-blue);
    background: rgba(21,101,192,.08);
    border-radius: 10px;
    padding: 1px 7px;
    margin-left: auto;
}

/* Sin resultados */
.et-cat-ac-empty {
    padding: 12px 14px;
    font-size: .8rem;
    color: var(--et-muted);
    text-align: center;
    list-style: none;
}

/* ══════════════════════════════════════════════════════════
   BUSCADOR INTELIGENTE DEL HERO
   ══════════════════════════════════════════════════════════ */

.et-hero-search {
    width: 100%;
    max-width: 760px;
    margin: 0 auto;
    position: relative;
    z-index: 100;
}

/* Fila de campos */
.et-hs-row {
    display: flex;
    gap: 0;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 6px 32px rgba(0,0,0,.25);
    overflow: visible;
    align-items: stretch;
}

/* Campo individual */
.et-hs-field {
    position: relative;
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 0;
    border-right: 1px solid #e0e0e0;
}
.et-hs-field--main { border-radius: 12px 0 0 12px; }
.et-hs-field--loc  { border-radius: 0; min-width: 170px; max-width: 210px; flex: 0 0 auto; }

.et-hs-field-icon {
    flex-shrink: 0;
    font-size: 1rem;
    padding: 0 8px 0 14px;
    pointer-events: none;
}

.et-hs-input {
    flex: 1;
    border: none;
    outline: none;
    font-size: .9rem;
    font-weight: 500;
    color: #222;
    padding: 14px 4px;
    background: transparent;
    font-family: inherit;
    min-width: 0;
}
.et-hs-input::placeholder { color: #999; font-weight: 400; }

.et-hs-clear {
    background: none;
    border: none;
    cursor: pointer;
    color: #aaa;
    font-size: 1.1rem;
    padding: 0 8px;
    line-height: 1;
    transition: color .15s;
}
.et-hs-clear:hover { color: #555; }

/* Botón buscar */
.et-hs-btn {
    flex-shrink: 0;
    background: var(--et-green);
    color: #fff;
    border: none;
    border-radius: 0 12px 12px 0;
    font-size: .9rem;
    font-weight: 800;
    padding: 14px 22px;
    cursor: pointer;
    white-space: nowrap;
    transition: background .15s;
    font-family: inherit;
}
.et-hs-btn:hover { background: #1a9e50; }

/* Dropdown de sugerencias */
.et-hs-dropdown {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    min-width: 320px;
    max-height: 380px;
    overflow-y: auto;
    background: #fff;
    border-radius: 10px;
    border: 1px solid #e0e0e0;
    box-shadow: 0 10px 36px rgba(0,0,0,.16);
    list-style: none;
    padding: 6px 0;
    margin: 0;
    z-index: 9999;
    scroll-behavior: smooth;
}

/* Etiqueta de grupo */
.et-hs-group-label {
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .8px;
    color: #999;
    padding: 10px 14px 4px;
    pointer-events: none;
}

/* Ítem de sugerencia */
.et-hs-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 14px;
    cursor: pointer;
    transition: background .1s;
}
.et-hs-item:hover,
.et-hs-item--active { background: #f0f4ff; }

.et-hs-item-icon { flex-shrink: 0; font-size: .9rem; }

.et-hs-item-name {
    font-size: .84rem;
    font-weight: 700;
    color: #1a1a2e;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.et-hs-item-name mark {
    background: #fff3cd;
    color: inherit;
    border-radius: 2px;
    padding: 0 1px;
}

.et-hs-item-sub {
    font-size: .7rem;
    background: #f0f0f0;
    color: #777;
    border-radius: 3px;
    padding: 1px 6px;
    white-space: nowrap;
    flex-shrink: 0;
}

.et-hs-item-count {
    font-size: .68rem;
    font-weight: 700;
    color: var(--et-blue);
    background: rgba(21,101,192,.08);
    border-radius: 10px;
    padding: 1px 7px;
    flex-shrink: 0;
}

.et-hs-item-loc {
    font-size: .68rem;
    color: #999;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Ver todos los resultados */
.et-hs-see-all {
    border-top: 1px solid #f0f0f0;
    padding: 9px 14px;
    font-size: .8rem;
}
.et-hs-see-all a {
    color: var(--et-blue);
    text-decoration: none;
    font-weight: 600;
}
.et-hs-see-all a:hover { text-decoration: underline; }

/* Sin resultados */
.et-hs-empty {
    padding: 14px;
    font-size: .82rem;
    color: #888;
    text-align: center;
}
.et-hs-empty a { color: var(--et-blue); }

/* Pills de categorías rápidas debajo del buscador */
.et-hs-quick-cats {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
    margin-top: 14px;
}
.et-hs-quick-pill {
    font-size: .75rem;
    font-weight: 700;
    color: rgba(255,255,255,.9);
    border: 1.5px solid rgba(255,255,255,.45);
    border-radius: 20px;
    padding: 4px 13px;
    text-decoration: none;
    transition: background .15s, color .15s;
    backdrop-filter: blur(4px);
    background: rgba(255,255,255,.08);
}
.et-hs-quick-pill:hover {
    background: rgba(255,255,255,.2);
    color: #fff;
    border-color: rgba(255,255,255,.7);
}

/* Responsive */
@media (max-width: 600px) {
    .et-hs-row { flex-wrap: wrap; border-radius: 10px; }
    .et-hs-field--main { border-radius: 10px 10px 0 0; border-right: none; border-bottom: 1px solid #e0e0e0; }
    .et-hs-field--loc  { border-radius: 0; border-right: none; max-width: 100%; width: 100%; border-bottom: 1px solid #e0e0e0; }
    .et-hs-btn { border-radius: 0 0 10px 10px; width: 100%; text-align: center; }
    .et-hs-dropdown { min-width: 0; }
}

/* ══════════════════════════════════════════════════════════
   CORRECCIONES MOBILE — Revisión completa
   Breakpoints: xs < 480, sm 480-767, md 768-991, lg 992+
   ══════════════════════════════════════════════════════════ */

/* ── Utilidades generales ───────────────────────────────── */
img { max-width: 100%; }
*, *::before, *::after { box-sizing: border-box; }

/* Evitar scroll horizontal global */
body { overflow-x: hidden; }

/* ══════════════════════════════════════════════════════════
   MOBILE HEADER BAR  (< 992px)
══════════════════════════════════════════════════════════ */

/* Barra blanca mobile */
.et-mobile-bar {
    background: #fff;
    border-bottom: 1px solid var(--et-border);
    box-shadow: 0 2px 8px rgba(0,0,0,.08);
}

/* Fila 1: logo izq + hamburguesa der */
.et-mobile-bar-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0 6px;
}

.et-mobile-logo img {
    height: 38px;
    width: auto;
    object-fit: contain;
    display: block;
}

/* Botón hamburguesa */
.et-mobile-hamburger {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: none;
    border-radius: 8px;
    background: var(--et-navy);
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    transition: background .2s;
    flex-shrink: 0;
}
.et-mobile-hamburger:hover { background: var(--et-blue); }

/* Fila 2: dos CTAs full-width */
.et-mobile-ctas {
    display: flex;
    gap: 8px;
    padding: 8px 0 10px;
}

.et-mobile-ctas .et-header-cta {
    flex: 1;
    justify-content: center;
    font-size: 12px;
    padding: 8px 10px;
    gap: 6px;
    border-radius: 6px;
}

/* ══════════════════════════════════════════════════════════
   OFFCANVAS — Barra lateral mobile
══════════════════════════════════════════════════════════ */

.et-offcanvas {
    width: 300px !important;
    background: var(--et-navy) !important;
    color: #fff;
    border-right: none !important;
}

/* Cabecera offcanvas */
.et-offcanvas-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px 16px;
    border-bottom: 1px solid rgba(255,255,255,.12);
    background: rgba(0,0,0,.15);
}

.et-offcanvas-logo img {
    height: 34px;
    width: auto;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.et-offcanvas-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 7px;
    background: transparent;
    color: rgba(255,255,255,.8);
    font-size: 16px;
    cursor: pointer;
    transition: background .2s, color .2s;
}
.et-offcanvas-close:hover { background: rgba(255,255,255,.15); color: #fff; }

/* Cuerpo offcanvas */
.et-offcanvas-body {
    padding: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

/* Menú de navegación */
.et-offcanvas-menu {
    list-style: none;
    margin: 0;
    padding: 8px 0;
}

.et-offcanvas-menu li a,
.et-offcanvas-menu .menu-item a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 22px;
    color: rgba(255,255,255,.88) !important;
    text-decoration: none;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: .3px;
    transition: background .18s, color .18s, padding-left .18s;
    border-left: 3px solid transparent;
}

.et-offcanvas-menu li a:hover,
.et-offcanvas-menu .menu-item a:hover {
    background: rgba(255,255,255,.08);
    color: #fff !important;
    padding-left: 28px;
    border-left-color: var(--et-green);
}

.et-offcanvas-menu li a i {
    width: 18px;
    text-align: center;
    color: var(--et-green);
    font-size: 14px;
    flex-shrink: 0;
}

/* Divisor */
.et-offcanvas-divider {
    height: 1px;
    background: rgba(255,255,255,.1);
    margin: 4px 20px;
}

/* Carrito */
.et-offcanvas-cart {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 22px;
    color: rgba(255,255,255,.88) !important;
    text-decoration: none;
    font-size: 15px;
    font-weight: 500;
    transition: background .18s;
}
.et-offcanvas-cart:hover { background: rgba(255,255,255,.08); color: #fff !important; }

.et-offcanvas-cart-icon {
    position: relative;
    display: inline-flex;
    font-size: 18px;
    color: var(--et-green);
}

.et-offcanvas-cart-badge {
    position: absolute;
    top: -7px;
    right: -8px;
    background: var(--et-green);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    min-width: 17px;
    height: 17px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 3px;
    line-height: 1;
}

.et-offcanvas-cart-total {
    font-size: 13px;
    color: var(--et-green);
    font-weight: 700;
}

/* Cuenta / Login */
.et-offcanvas-account {
    padding: 16px 22px 24px;
    margin-top: auto;
}

.et-offcanvas-user {
    display: flex;
    align-items: center;
    gap: 12px;
}

.et-offcanvas-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--et-green);
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.et-offcanvas-username {
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    line-height: 1.2;
}

.et-offcanvas-logout {
    font-size: 12px;
    color: rgba(255,255,255,.55);
    text-decoration: none;
}
.et-offcanvas-logout:hover { color: rgba(255,255,255,.85); }

.et-offcanvas-login-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: 100%;
    padding: 12px;
    background: var(--et-green);
    color: #fff !important;
    border-radius: 8px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
    transition: opacity .2s;
}
.et-offcanvas-login-btn:hover { opacity: .9; }

/* Fondo oscuro del offcanvas */
.offcanvas-backdrop { background: rgba(0,0,0,.55) !important; }

/* ── HEADER — muy pequeño (< 480px) ────────────────────── */
@media (max-width: 479px) {
    .et-mobile-logo img { height: 32px; }
    .et-mobile-ctas .et-header-cta { font-size: 11px; padding: 7px 8px; }
}


/* ── HERO + BUSCADOR — mobile ───────────────────────────── */
@media (max-width: 991.98px) {
    /* Permitir altura dinámica en tablet */
    .et-hero-slide {
        height: auto !important;
        min-height: 340px;
        padding: 32px 0 28px;
    }
    .et-hero-slide .container,
    .et-hero-slide .row { height: auto !important; }
}

@media (max-width: 575.98px) {
    .et-hero-slide {
        min-height: 0;
        padding: 28px 0 24px;
    }
    .et-hero-title { font-size: 1.2rem; line-height: 1.35; }
    .et-hero-subtitle { font-size: .85rem; }

    /* Buscador hero — stack completo en mobile */
    .et-hero-search { max-width: 100%; padding: 0 4px; }
    .et-hs-row {
        flex-direction: column;
        border-radius: 10px;
        gap: 0;
    }
    .et-hs-field--main {
        border-radius: 10px 10px 0 0;
        border-right: none;
        border-bottom: 1px solid #e0e0e0;
    }
    .et-hs-field--loc {
        border-radius: 0;
        max-width: 100%;
        width: 100%;
        border-right: none;
        border-bottom: 1px solid #e0e0e0;
    }
    .et-hs-btn {
        border-radius: 0 0 10px 10px;
        width: 100%;
        text-align: center;
        padding: 13px;
    }
    .et-hs-dropdown { min-width: 0; width: 100%; left: 0; right: 0; }
    .et-hs-quick-cats { gap: 5px; }
    .et-hs-quick-pill { font-size: .7rem; padding: 3px 10px; }
}

/* ── FILTROS DIRECTORIO — barra mobile trigger ───────────── */

/* Barra mobile: botón + ordenar inline */
.et-filter-mobile-bar {
    align-items: center;
    gap: 10px;
    margin-bottom: 0;
}
.et-filter-mobile-trigger {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: var(--et-navy);
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 10px 18px;
    font-size: .9rem;
    font-weight: 700;
    font-family: inherit;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
    transition: background .18s;
}
.et-filter-mobile-trigger:hover { background: #1a2c50; }
.et-filter-active-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    background: var(--et-green);
    color: #fff;
    border-radius: 20px;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
}
.et-filter-sort-inline {
    flex: 1;
    min-width: 0;
    appearance: auto;
    font-size: .85rem;
    border-radius: 8px;
    padding: 9px 10px;
    border: 1.5px solid var(--et-border);
    background: #fff;
    color: var(--et-text);
    font-family: inherit;
}

/* ── OVERLAY FULL-SCREEN mobile ─────────────────────────── */
.et-filter-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    z-index: 1060;
    display: flex;
    align-items: flex-end;
    animation: et-overlay-in .2s ease;
}
@keyframes et-overlay-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.et-filter-panel {
    background: #fff;
    width: 100%;
    border-radius: 18px 18px 0 0;
    display: flex;
    flex-direction: column;
    max-height: 90vh;
    overflow: hidden;
    animation: et-panel-in .25s cubic-bezier(.32,0,.67,0) reverse, et-panel-slide .25s ease;
}
@keyframes et-panel-slide {
    from { transform: translateY(100%); }
    to   { transform: translateY(0); }
}
.et-filter-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px 14px;
    border-bottom: 1px solid var(--et-border);
    flex-shrink: 0;
}
.et-filter-panel-title {
    font-family: var(--et-font-brand);
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--et-navy);
    margin: 0;
}
.et-filter-panel-close {
    background: var(--et-light-bg);
    border: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    font-size: 1.2rem;
    color: var(--et-text);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    flex-shrink: 0;
    transition: background .15s;
}
.et-filter-panel-close:hover { background: #e0e0e0; }
.et-filter-panel-body {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.et-filter-field-group { display: flex; flex-direction: column; gap: 6px; }
.et-filter-field-label {
    font-size: .82rem;
    font-weight: 700;
    color: var(--et-navy);
    text-transform: uppercase;
    letter-spacing: .04em;
}
.et-filter-select-full {
    width: 100%;
    padding: 13px 14px;
    border: 1.5px solid var(--et-border);
    border-radius: 8px;
    font-size: .97rem;
    color: var(--et-text);
    background: #fff;
    font-family: inherit;
    outline: none;
    appearance: auto;
}
.et-filter-select-full:focus {
    border-color: var(--et-blue);
    box-shadow: 0 0 0 3px rgba(30,94,203,.12);
}
/* Autocomplete inside panel */
.et-cat-autocomplete--panel .et-cat-ac-wrap {
    min-height: 50px;
    border-radius: 8px;
    border: 1.5px solid var(--et-border);
}
.et-cat-autocomplete--panel .et-cat-ac-input {
    font-size: .97rem;
    padding: 13px 10px;
}
.et-cat-autocomplete--panel .et-cat-ac-list {
    border-radius: 0 0 8px 8px;
}
.et-filter-panel-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-top: 1px solid var(--et-border);
    gap: 12px;
    flex-shrink: 0;
}
.et-filter-reset {
    background: none;
    border: none;
    color: var(--et-muted);
    font-size: .9rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: underline;
    font-family: inherit;
    padding: 0;
}
.et-filter-apply-btn {
    flex: 1;
    background: var(--et-green);
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 14px 20px;
    font-size: 1rem;
    font-weight: 700;
    font-family: var(--et-font-brand);
    cursor: pointer;
    transition: background .18s;
    text-align: center;
}
.et-filter-apply-btn:hover { background: #1a9e50; }

/* ── DIRECTORIO — grid y sidebar ────────────────────────── */
@media (max-width: 991.98px) {
    /* Sidebar debajo del grid en tablet */
    .et-dir-sidebar { position: static; margin-top: 24px; }
    .et-post-sidebar { position: static; }
    .et-emp-sidebar { position: static; }

    /* Hero del directorio más compacto */
    .et-dir-hero { padding: 32px 0 28px; }
    .et-dir-hero-title { font-size: 1.5rem; }
}

@media (max-width: 575.98px) {
    .et-dir-hero { padding: 24px 0 20px; }
    .et-dir-hero-title { font-size: 1.2rem; }
    .et-dir-hero-sub { font-size: .85rem; }
}

/* ── TARJETAS HORIZONTALES (et-lcard) — mobile ──────────── */
@media (max-width: 479px) {
    /* En pantallas muy pequeñas, logo arriba + info abajo */
    .et-lcard {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    .et-lcard-logo {
        width: 44px;
        height: 44px;
    }
    .et-lcard-excerpt { -webkit-line-clamp: 3; }
}

/* ── SINGLE EMPRESA — mobile ────────────────────────────── */
@media (max-width: 767.98px) {
    /* Secciones con padding reducido */
    .et-emp-section { padding: 18px 16px; }
    /* Breadcrumb */
    .et-dir-breadcrumb { font-size: .72rem; flex-wrap: wrap; }
    /* CTA bar: scroll horizontal en móvil */
    .et-emp-cta-inner { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px; }
    .et-cta-chip { flex-shrink: 0; }
    .et-galeria-masonry { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
}

/* ── ARCHIVE (noticias/tips) — mobile ───────────────────── */
@media (max-width: 575.98px) {
    /* 1 card por fila en móvil muy pequeño */
    .et-arc-card .col-sm-6 { flex: 0 0 100%; max-width: 100%; }
    .et-archive-hero { padding: 28px 0 22px; }
    .et-archive-title { font-size: 1.4rem; }
    .et-archive-icon { font-size: 1.8rem; }

}

/* ── CONTACTO — mobile ──────────────────────────────────── */
@media (max-width: 767.98px) {
    .et-contacto-hero { padding: 32px 0 28px; }
    .et-contacto-title { font-size: 1.6rem; }

    /* Canales: 2 por fila */
    .et-contacto-channels .col-6 { flex: 0 0 50%; max-width: 50%; }
    .et-ch-card { padding: 14px 8px; }
    .et-ch-icon { font-size: 1.3rem; }
    .et-ch-value { font-size: .75rem; }

    /* Formulario sin padding lateral excesivo */
    .et-contacto-form-wrap { padding: 20px 16px; }

    /* Pills de asunto: 2 por fila máximo */
    .et-asunto-grid { gap: 6px; }
    .et-asunto-pill { font-size: .75rem; padding: 5px 11px; }
}

@media (max-width: 479px) {
    .et-asunto-pill { flex: 1 1 calc(50% - 3px); justify-content: center; }
    .et-contacto-side-card { padding: 16px 14px; }
}

/* ── HOMEPAGE — grid y categorías ───────────────────────── */
@media (max-width: 767.98px) {
    /* Highlight cards: 1 por fila */
    .et-highlight-cards .col-md-4 { flex: 0 0 100%; max-width: 100%; }

    /* CTA section */
    .et-cta-card { padding: 20px 16px !important; }
    .et-cta-icon-lg { font-size: 2rem; }
}

@media (max-width: 575.98px) {
    /* Categorías en home: 1 por fila */
    .et-cat-item { padding: 6px 8px; }
    .et-cat-icon { font-size: 1.3rem; width: 28px; }
    .et-cat-label { font-size: .85rem; }
}

/* ── CATEGORÍA EMPRESA (taxonomy) — mobile ──────────────── */
@media (max-width: 991.98px) {
    .et-sidebar-cats { margin-top: 16px; }
}

/* ── SINGLE POST — mobile ───────────────────────────────── */
@media (max-width: 575.98px) {
    .et-post-hero-title { font-size: 1.4rem; }
    .et-post-hero--img { min-height: 260px; }
    .et-post-hero--plain { min-height: 200px; }
    .et-post-content { font-size: .95rem; }

    /* Navegación prev/next apilada */
    .et-post-nav-link { padding: 12px 14px; }
    .et-post-nav-title { font-size: .82rem; }
}

/* ── FOOTER — mobile ────────────────────────────────────── */
@media (max-width: 767.98px) {
    .et-footer .col-md-3,
    .et-footer .col-md-4 { margin-bottom: 24px; }
    .et-footer-logo { height: 36px; }
}

/* ── PAGINACIÓN — mobile ────────────────────────────────── */
@media (max-width: 575.98px) {
    .et-pagination { overflow-x: auto; white-space: nowrap; padding-bottom: 4px; }
    .et-pagination .page-numbers { min-width: 32px; height: 32px; font-size: .8rem; }
}

/* ── HERO — archive de directorio/categoría ─────────────── */
@media (max-width: 575.98px) {
    .et-archive-hero .et-dir-breadcrumb { font-size: .7rem; }
    .et-archive-hero h1 { font-size: 1.3rem; }
}

/* ── PLANES — mobile ─────────────────────────────────────── */
@media (max-width: 767.98px) {
    .et-planes-card { padding: 24px 18px !important; }
}

/* ── TOUCH: deshabilitar hover con transform en mobile ───── */
@media (hover: none) {
    .et-lcard:hover,
    .et-news-card:hover,
    .et-arc-card:hover,
    .et-empresa-card:hover,
    .et-producto-card:hover,
    .et-highlight-card:hover { transform: none; }
}

/* ── SAFE-AREA para notch / barra home ──────────────────── */
@supports (padding: max(0px)) {
    .et-header { padding-left: max(0px, env(safe-area-inset-left)); padding-right: max(0px, env(safe-area-inset-right)); }
    .container { padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); }
}

/* ══════════════════════════════════════════════════════════
   DIRECTORIO — Sección Empresas Destacadas
   ══════════════════════════════════════════════════════════ */

.et-dir-featured {}

.et-dir-featured-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 1.5px solid #f0e8c0;
}

.et-dir-featured-label {
    font-family: var(--et-font-brand);
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #8a6c00;
    background: linear-gradient(90deg, #fff8e0, #fef5cc);
    border: 1px solid #e8d06a;
    border-radius: 20px;
    padding: 3px 12px;
}

.et-dir-featured-sub {
    font-size: 12px;
    color: var(--et-muted);
    font-weight: 500;
}

/* Badge sobre la tarjeta destacada */
.et-lcard {
    position: relative;
}
.et-lcard-dest-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .5px;
    padding: 2px 8px;
    border-radius: 20px;
    background: linear-gradient(90deg, #c9a227, #f0d060);
    color: #5a3e00;
    z-index: 1;
    white-space: nowrap;
}
.et-lcard-premium .et-lcard-dest-badge {
    background: linear-gradient(90deg, var(--et-navy), var(--et-blue));
    color: #fff;
}

/* ══════════════════════════════════════════════════════════
   HERO BUSCADOR MOBILE — campos táctiles más grandes
   ══════════════════════════════════════════════════════════ */

@media (max-width: 600px) {
    .et-hs-field {
        min-height: 54px;
    }
    .et-hs-input {
        font-size: 1rem !important;
        padding: 16px 12px 16px 0 !important;
    }
    .et-hs-field-icon {
        font-size: 1.15rem;
        padding: 0 8px 0 14px;
    }
    .et-hs-btn {
        min-height: 54px !important;
        font-size: 1rem !important;
        padding: 16px !important;
        font-weight: 700;
        letter-spacing: .01em;
    }
    .et-hs-quick-cats {
        gap: 8px !important;
        margin-top: 14px;
    }
    .et-hs-quick-pill {
        font-size: .82rem !important;
        padding: 7px 16px !important;
        border-radius: 20px;
        min-height: 36px;
        display: inline-flex;
        align-items: center;
    }
}


/* ══════════════════════════════════════════════════════════════
   MI CUENTA — Página de perfil del usuario
══════════════════════════════════════════════════════════════ */

.et-mi-cuenta-page { background: var(--et-light-bg); min-height: 70vh; }

/* ── Tarjetas genéricas ───────────────────────────────────── */
.et-mc-card {
    background: #fff;
    border-radius: 12px;
    padding: 20px;
    border: 1px solid var(--et-border);
}

/* ── Tarjeta de usuario ───────────────────────────────────── */
.et-mc-user-card { text-align: center; }

.et-mc-avatar {
    width: 64px; height: 64px;
    border-radius: 50%;
    background: var(--et-navy);
    color: #fff;
    font-size: 26px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 10px;
}

.et-mc-username  { font-size: 15px; font-weight: 700; color: var(--et-text); }
.et-mc-useremail { font-size: 12px; color: var(--et-muted); margin-bottom: 12px; }

.et-mc-plan-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 14px;
    border-radius: 20px;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .4px;
}

/* ── Progreso ─────────────────────────────────────────────── */
.et-mc-card-label { font-size: 13px; font-weight: 600; color: var(--et-text); margin-bottom: 10px; }
.et-mc-progress-wrap { display: flex; align-items: center; gap: 10px; }
.et-mc-progress-wrap .progress { flex: 1; }
.et-mc-progress-pct { font-size: 13px; font-weight: 700; color: var(--et-green); min-width: 38px; text-align: right; }

/* ── Sidebar nav ──────────────────────────────────────────── */
.et-mc-sidenav nav { display: flex; flex-direction: column; gap: 2px; }

.et-mc-nav-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border-radius: 8px;
    color: var(--et-text);
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    transition: background .18s, color .18s;
    border-left: 3px solid transparent;
}
.et-mc-nav-item i { width: 16px; text-align: center; color: var(--et-muted); font-size: 13px; }
.et-mc-nav-item:hover { background: var(--et-light-bg); color: var(--et-navy); }
.et-mc-nav-item.active { background: #e8f0fe; color: var(--et-blue); border-left-color: var(--et-blue); font-weight: 600; }
.et-mc-nav-item.active i { color: var(--et-blue); }

/* ── Tarjeta upgrade ──────────────────────────────────────── */
.et-mc-upgrade-card {
    background: #fff;
    border-radius: 12px;
    border: 1px solid var(--et-border);
    border-left: 4px solid;
    padding: 18px;
}
.et-mc-upgrade-label { font-size: 11px; text-transform: uppercase; letter-spacing: .6px; color: var(--et-muted); margin-bottom: 4px; }
.et-mc-upgrade-name  { font-size: 15px; font-weight: 700; margin-bottom: 12px; display: flex; align-items: center; gap: 6px; }
.et-mc-upgrade-btn {
    display: block;
    text-align: center;
    padding: 10px;
    border-radius: 8px;
    color: #fff !important;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    transition: opacity .2s;
}
.et-mc-upgrade-btn:hover { opacity: .88; }

/* ── Secciones del formulario ─────────────────────────────── */
.et-mc-section {
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 14px;
    margin-bottom: 24px;
    overflow: hidden;
    scroll-margin-top: 100px;
}

.et-mc-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 24px;
    border-bottom: 1px solid var(--et-border);
    background: linear-gradient(to right, #f8faff, #fff);
}
.et-mc-section-header h2 {
    font-size: 16px;
    font-weight: 700;
    color: var(--et-navy);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}
.et-mc-section-header h2 i { color: var(--et-blue); font-size: 15px; }

.et-mc-plan-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    border-radius: 20px;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .4px;
}

.et-mc-limit-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    border-radius: 20px;
    background: var(--et-light-bg);
    color: var(--et-muted);
    font-size: 11px;
    font-weight: 600;
    border: 1px solid var(--et-border);
}

.et-mc-section-body { padding: 24px; }

/* ── Inputs ───────────────────────────────────────────────── */
.et-mc-label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--et-text);
    margin-bottom: 6px;
}
.et-mc-label i { margin-right: 4px; font-size: 12px; }
.et-mc-label .required { color: #dc3545; margin-left: 2px; }

.et-mc-input {
    border-color: var(--et-border);
    border-radius: 8px;
    font-size: 14px;
    transition: border-color .2s, box-shadow .2s;
}
.et-mc-input:focus {
    border-color: var(--et-blue);
    box-shadow: 0 0 0 3px rgba(21,101,192,.12);
}

.et-mc-hint { font-size: 11px; color: var(--et-muted); margin-top: 4px; }

/* ── Checkboxes categorías ────────────────────────────────── */
.et-mc-checkboxes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.et-mc-checkbox-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid var(--et-border);
    border-radius: 20px;
    font-size: 13px;
    cursor: pointer;
    transition: background .15s, border-color .15s;
}
.et-mc-checkbox-item:hover { background: var(--et-light-bg); }
.et-mc-checkbox-item input[type="checkbox"] { accent-color: var(--et-blue); }

/* ── Zona de upload ───────────────────────────────────────── */
.et-mc-upload-zone {
    position: relative;
    border: 2px dashed var(--et-border);
    border-radius: 10px;
    background: var(--et-light-bg);
    transition: border-color .2s, background .2s;
    overflow: hidden;
}
.et-mc-upload-zone:hover { border-color: var(--et-blue); background: #f0f4ff; }

.et-mc-file-input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
    z-index: 2;
}

.et-mc-upload-label {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 28px 20px;
    gap: 4px;
    text-align: center;
    cursor: pointer;
    pointer-events: none;
}
.et-mc-upload-label span { font-size: 14px; font-weight: 600; color: var(--et-text); }
.et-mc-upload-label small { font-size: 12px; color: var(--et-muted); }

/* ── Logo preview ─────────────────────────────────────────── */
.et-mc-logo-preview {
    position: relative;
    width: 120px;
    height: 120px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid var(--et-border);
}
.et-mc-logo-img { width: 100%; height: 100%; object-fit: contain; }
.et-mc-logo-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.5);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity .2s;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
}
.et-mc-logo-preview:hover .et-mc-logo-overlay { opacity: 1; }

/* ── Hero preview ─────────────────────────────────────────── */
.et-mc-hero-preview {
    position: relative;
    width: 100%;
    height: 140px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid var(--et-border);
}
.et-mc-hero-preview img { width: 100%; height: 100%; object-fit: cover; }
.et-mc-hero-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.4);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity .2s;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
}
.et-mc-hero-preview:hover .et-mc-hero-overlay { opacity: 1; }

/* ── Galería grid ─────────────────────────────────────────── */
.et-mc-galeria-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 16px;
}

.et-mc-galeria-item {
    position: relative;
    width: 100px;
    height: 100px;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--et-border);
    transition: opacity .3s;
}
.et-mc-galeria-item img { width: 100%; height: 100%; object-fit: cover; }

.et-mc-galeria-remove {
    position: absolute;
    top: 4px; right: 4px;
    width: 22px; height: 22px;
    border-radius: 50%;
    background: rgba(220,53,69,.9);
    border: none;
    color: #fff;
    font-size: 11px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity .2s;
}
.et-mc-galeria-item:hover .et-mc-galeria-remove { opacity: 1; }

.et-mc-galeria-upload { margin-top: 8px; }
.et-mc-galeria-upload .et-mc-upload-label { padding: 18px; }

.et-mc-limit-notice {
    padding: 12px 16px;
    background: #fff8e1;
    border: 1px solid #ffe082;
    border-radius: 8px;
    font-size: 13px;
    color: #5d4037;
    margin-top: 10px;
}
.et-mc-limit-notice a { color: var(--et-blue); font-weight: 600; }

/* ── Repeater ─────────────────────────────────────────────── */
.et-mc-repeater-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: 600;
    color: var(--et-text);
}

.et-mc-repeater-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }

.et-mc-repeater-item {
    display: flex;
    align-items: center;
    gap: 10px;
    transition: opacity .25s;
}

.et-mc-drag-handle { cursor: grab; font-size: 14px; flex-shrink: 0; }

.et-mc-repeater-remove {
    width: 32px; height: 32px;
    border-radius: 7px;
    border: 1px solid #dee2e6;
    background: #fff;
    color: #dc3545;
    font-size: 12px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background .15s;
}
.et-mc-repeater-remove:hover { background: #fff0f0; }

.et-mc-repeater-add {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border: 1px dashed var(--et-blue);
    border-radius: 8px;
    background: transparent;
    color: var(--et-blue);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background .15s;
}
.et-mc-repeater-add:hover { background: #f0f4ff; }

/* ── Botón guardar sticky ─────────────────────────────────── */
.et-mc-save-bar {
    position: sticky;
    bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
    background: rgba(255,255,255,.95);
    backdrop-filter: blur(8px);
    border: 1px solid var(--et-border);
    border-radius: 12px;
    padding: 16px 20px;
    box-shadow: 0 4px 20px rgba(0,0,0,.12);
    z-index: 100;
}

.et-mc-save-btn {
    background: var(--et-green);
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 12px 28px;
    font-size: 15px;
    font-weight: 700;
    transition: opacity .2s, transform .15s;
}
.et-mc-save-btn:hover { opacity: .9; transform: translateY(-1px); color: #fff; }

/* ── Banner de plan bloqueado ─────────────────────────────── */
.et-mc-locked-banner {
    background: linear-gradient(135deg, var(--et-navy) 0%, #1565c0 100%);
    border-radius: 16px;
    padding: 32px;
}
.et-mc-locked-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}
.et-mc-locked-title { font-size: 18px; font-weight: 700; color: #fff; margin-bottom: 8px; }
.et-mc-locked-sub   { font-size: 14px; color: rgba(255,255,255,.75); max-width: 560px; }
.et-mc-locked-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 24px;
    background: var(--et-green);
    color: #fff !important;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    transition: opacity .2s;
    flex-shrink: 0;
}
.et-mc-locked-btn:hover { opacity: .9; }

/* ── Mi Cuenta — mobile ───────────────────────────────────── */
@media (max-width: 991.98px) {
    .et-mc-sidenav { display: none; }
    .et-mc-section-header { padding: 14px 18px; }
    .et-mc-section-body   { padding: 18px; }
    .et-mc-save-bar { bottom: 0; border-radius: 0; border-left: none; border-right: none; }
}


/* ══════════════════════════════════════════════════════════════
   PÁGINA DE INICIO DE SESIÓN
══════════════════════════════════════════════════════════════ */

/* Ocultar header/footer en la página de login */
.page-template-page-login .et-header,
.page-template-page-login footer,
.page-template-page-login .et-banner-zone { display: none !important; }

body.page-template-page-login { background: var(--et-light-bg); margin: 0; padding: 0; }

.et-login-page {
    min-height: 100vh;
    display: flex;
    align-items: stretch;
}

/* ── Split layout ─────────────────────────────────────────── */
.et-login-wrap {
    display: flex;
    width: 100%;
    min-height: 100vh;
}

/* ── Panel izquierdo (branding) ───────────────────────────── */
.et-login-brand {
    flex: 0 0 42%;
    background: linear-gradient(155deg, var(--et-navy) 0%, #1a3a6b 60%, #0d2247 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 60px 48px;
    position: relative;
    overflow: hidden;
}

.et-login-brand::before {
    content: '';
    position: absolute;
    top: -80px; right: -80px;
    width: 320px; height: 320px;
    border-radius: 50%;
    background: rgba(255,255,255,.04);
}
.et-login-brand::after {
    content: '';
    position: absolute;
    bottom: -60px; left: -60px;
    width: 260px; height: 260px;
    border-radius: 50%;
    background: rgba(255,255,255,.04);
}

.et-login-brand-inner { position: relative; z-index: 1; max-width: 360px; }

.et-login-logo { height: 52px; width: auto; object-fit: contain; margin-bottom: 40px; display: block; }
.et-login-logo-link { display: inline-block; }

.et-login-brand-title {
    font-size: 26px;
    font-weight: 800;
    color: #fff;
    line-height: 1.25;
    margin-bottom: 16px;
    font-family: 'Montserrat', sans-serif;
}

.et-login-brand-sub {
    font-size: 14px;
    color: rgba(255,255,255,.68);
    line-height: 1.6;
    margin-bottom: 32px;
}

.et-login-features {
    list-style: none;
    padding: 0; margin: 0 0 36px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.et-login-features li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: rgba(255,255,255,.85);
}

.et-login-features li i {
    color: var(--et-green);
    font-size: 15px;
    flex-shrink: 0;
}

.et-login-brand-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 12px 22px;
    background: var(--et-green);
    color: #fff !important;
    border-radius: 9px;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: opacity .2s, transform .15s;
}
.et-login-brand-cta:hover { opacity: .9; transform: translateY(-1px); }

/* ── Panel derecho (formulario) ───────────────────────────── */
.et-login-form-panel {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px 32px;
    background: #fff;
}

.et-login-form-inner {
    width: 100%;
    max-width: 420px;
}

/* Logo móvil (oculto en desktop) */
.et-login-logo-mobile { display: none; text-align: center; margin-bottom: 28px; }
.et-login-logo-mobile img { height: 40px; width: auto; }

.et-login-header { margin-bottom: 30px; }

.et-login-title {
    font-size: 26px;
    font-weight: 800;
    color: var(--et-navy);
    margin-bottom: 6px;
    font-family: 'Montserrat', sans-serif;
}

.et-login-subtitle {
    font-size: 14px;
    color: var(--et-muted);
    margin: 0;
}

/* ── Alertas ──────────────────────────────────────────────── */
.et-login-alert {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 9px;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 22px;
}
.et-login-alert-error {
    background: #fff2f2;
    border: 1px solid #ffa0a0;
    color: #c62828;
}
.et-login-alert i { font-size: 15px; flex-shrink: 0; }

/* ── Campos del formulario ────────────────────────────────── */
.et-login-form { display: flex; flex-direction: column; gap: 20px; }

.et-login-field { display: flex; flex-direction: column; gap: 0; }

.et-login-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--et-text);
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.et-login-label i { color: var(--et-blue); font-size: 12px; }

.et-login-input-wrap { position: relative; }

.et-login-input {
    width: 100%;
    padding: 13px 16px;
    border: 1.5px solid var(--et-border);
    border-radius: 10px;
    font-size: 15px;
    color: var(--et-text);
    background: #fafafa;
    outline: none;
    transition: border-color .2s, box-shadow .2s, background .2s;
    font-family: inherit;
}
.et-login-input::placeholder { color: #b0bec5; }
.et-login-input:focus {
    border-color: var(--et-blue);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(21,101,192,.12);
}
.et-login-input.et-input-error {
    border-color: #e53935;
    background: #fff8f8;
}
.et-login-input.et-input-error:focus {
    box-shadow: 0 0 0 3px rgba(229,57,53,.12);
}

/* Campo contraseña tiene botón para ver */
#password { padding-right: 48px; }

.et-login-show-pw {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    color: var(--et-muted);
    cursor: pointer;
    padding: 4px;
    font-size: 15px;
    transition: color .15s;
    line-height: 1;
}
.et-login-show-pw:hover { color: var(--et-navy); }

/* ── Olvidé contraseña ────────────────────────────────────── */
.et-login-forgot {
    font-size: 12px;
    color: var(--et-blue);
    text-decoration: none;
    font-weight: 500;
    transition: opacity .15s;
}
.et-login-forgot:hover { opacity: .75; text-decoration: underline; }

/* ── Recordarme ───────────────────────────────────────────── */
.et-login-remember {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}

.et-login-check {
    width: 18px; height: 18px;
    accent-color: var(--et-blue);
    cursor: pointer;
    flex-shrink: 0;
    margin: 0;
}

.et-login-remember-label {
    font-size: 13px;
    color: var(--et-text);
    user-select: none;
}

/* ── Botón principal ──────────────────────────────────────── */
.et-login-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    width: 100%;
    padding: 15px;
    background: var(--et-navy);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: background .2s, transform .15s;
    font-family: inherit;
    margin-top: 4px;
}
.et-login-btn:hover { background: var(--et-blue); transform: translateY(-1px); }
.et-login-btn:active { transform: translateY(0); }
.et-login-btn:disabled { opacity: .65; cursor: not-allowed; transform: none; }

/* ── Divisor ──────────────────────────────────────────────── */
.et-login-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 24px 0;
    color: var(--et-muted);
    font-size: 13px;
}
.et-login-divider::before,
.et-login-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--et-border);
}

/* ── Botón registrarse ────────────────────────────────────── */
.et-login-register-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 13px;
    background: transparent;
    border: 2px solid var(--et-green);
    color: var(--et-green) !important;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    transition: background .2s, color .2s;
}
.et-login-register-btn:hover {
    background: var(--et-green);
    color: #fff !important;
}

/* ── Volver al sitio ──────────────────────────────────────── */
.et-login-back {
    text-align: center;
    margin-top: 22px;
}
.et-login-back a {
    font-size: 13px;
    color: var(--et-muted);
    text-decoration: none;
    transition: color .15s;
}
.et-login-back a:hover { color: var(--et-navy); }

/* ══ RESPONSIVE ══════════════════════════════════════════════ */
@media (max-width: 900px) {
    .et-login-brand { flex: 0 0 38%; padding: 40px 32px; }
    .et-login-brand-title { font-size: 21px; }
}

@media (max-width: 767px) {
    .et-login-wrap { flex-direction: column; }
    .et-login-brand { display: none; }
    .et-login-form-panel { padding: 32px 20px; align-items: flex-start; padding-top: 40px; }
    .et-login-logo-mobile { display: block; }
    .et-login-form-inner { max-width: 100%; }
    .et-login-title { font-size: 22px; }
}


/* ══════════════════════════════════════════════════════════════
   EMPRESA DESTACADA EN HOME — diseño dedicado vertical
══════════════════════════════════════════════════════════════ */

/* Header: label izquierda + link directorio derecha */
.et-highlight-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.et-hc-dir-link {
    font-size: 11px;
    font-weight: 600;
    color: rgba(255,255,255,.7);
    text-decoration: none;
    white-space: nowrap;
    transition: color .15s;
    flex-shrink: 0;
}
.et-hc-dir-link:hover { color: #fff; }

/* Card empresa: flex column full height */
.et-hc-empresa {
    display: flex;
    flex-direction: column;
}

/* ── Logo zone ─────────────────────────────────────────────── */
.et-hc-emp-logo-zone {
    background: var(--et-light-bg);
    border-bottom: 1px solid var(--et-border);
    min-height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px 24px;
    position: relative;
    flex-shrink: 0;
}
.et-hc-emp-logo-img {
    max-height: 90px;
    max-width: 100%;
    object-fit: contain;
}
.et-hc-emp-initials {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: var(--et-navy);
    color: #fff;
    font-size: 28px;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    font-family: var(--et-font-brand);
}

/* Plan badge (Platino / Premium) flotando sobre el logo zone */
.et-hc-emp-plan-badge {
    position: absolute;
    top: 10px;
    right: 12px;
    font-size: 10px;
    font-weight: 700;
    padding: 3px 9px;
    border-radius: 20px;
    letter-spacing: .4px;
    text-transform: uppercase;
}
.et-hc-emp-plan-platino {
    background: #f59f00;
    color: #fff;
}
.et-hc-emp-plan-premium {
    background: var(--et-blue);
    color: #fff;
}
.et-hc-emp-plan-estandar {
    background: var(--et-green);
    color: #fff;
}

/* ── Info body ─────────────────────────────────────────────── */
.et-hc-emp-body {
    padding: 18px 20px 8px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* Nombre + verificada en la misma línea */
.et-hc-emp-name-row {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    line-height: 1.25;
}
.et-hc-emp-name {
    font-size: 17px;
    font-weight: 800;
    color: var(--et-navy);
    text-decoration: none;
    font-family: var(--et-font-brand);
    line-height: 1.25;
    transition: color .15s;
}
.et-hc-emp-name:hover { color: var(--et-blue); }

.et-hc-emp-verif {
    color: var(--et-blue);
    font-size: 14px;
    flex-shrink: 0;
    margin-top: 2px;
}

/* Categoría */
.et-hc-emp-cat {
    font-size: 12px;
    color: var(--et-muted);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 5px;
}
.et-hc-emp-cat i { color: var(--et-blue); font-size: 10px; }

/* Excerpt */
.et-hc-emp-excerpt {
    font-size: 13px;
    color: var(--et-text);
    line-height: 1.55;
    margin: 2px 0 0;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    flex: 1;
}

/* Badges de certificaciones */
.et-hc-emp-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 2px;
}
.et-hc-emp-badge {
    font-size: 10px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 12px;
    letter-spacing: .3px;
}
.et-hc-badge-blue { background: rgba(21,101,192,.1); color: var(--et-blue); }
.et-hc-badge-green { background: rgba(25,135,84,.1); color: #19875d; }

/* Ubicación */
.et-hc-emp-loc {
    font-size: 12px;
    color: var(--et-muted);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 5px;
}
.et-hc-emp-loc i { color: #e53935; font-size: 11px; }

/* ── Botones de contacto ──────────────────────────────────── */
.et-hc-emp-actions {
    padding: 12px 20px 16px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    border-top: 1px solid var(--et-border);
    background: #f8fafc;
    border-radius: 0 0 12px 12px;
    flex-shrink: 0;
}
.et-hc-emp-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    flex: 1 1 auto;
    min-width: 0;
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    border: 1.5px solid transparent;
    transition: background .18s, color .18s, border-color .18s;
    white-space: nowrap;
}
/* WhatsApp */
.et-hc-btn-wa {
    background: #25d366;
    color: #fff;
    border-color: #25d366;
}
.et-hc-btn-wa:hover { background: #1ebe5d; border-color: #1ebe5d; color: #fff; }

/* Outline (email, tel, web) */
.et-hc-btn-outline {
    background: #fff;
    color: var(--et-navy);
    border-color: var(--et-border);
}
.et-hc-btn-outline:hover { background: var(--et-light-bg); border-color: var(--et-navy); color: var(--et-navy); }

/* Ver perfil completo — siempre visible, ocupa ancho completo */
.et-hc-btn-primary {
    background: var(--et-navy);
    color: #fff;
    border-color: var(--et-navy);
    flex-basis: 100%;
    font-size: 13px;
    padding: 10px 16px;
}
.et-hc-btn-primary:hover { background: var(--et-blue); border-color: var(--et-blue); color: #fff; }


/* ══════════════════════════════════════════════════════════════
   NOTICIAS DEL SECTOR — sección superior del home
══════════════════════════════════════════════════════════════ */

.et-news-top {
    background: #fff;
    border-bottom: 1px solid var(--et-border);
}

/* Título de sección + link "Ver todas" */
.et-section-link {
    font-size: 13px;
    font-weight: 700;
    color: var(--et-blue);
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
    transition: opacity .15s;
}
.et-section-link:hover { opacity: .75; text-decoration: underline; }

/* Card de noticia */
.et-news-card {
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: box-shadow .2s, transform .18s;
}
.et-news-card:hover {
    box-shadow: 0 8px 28px rgba(0,0,0,.1);
    transform: translateY(-2px);
}

/* Thumbnail de noticia */
.et-news-thumb {
    position: relative;
    aspect-ratio: 16/9;
    overflow: hidden;
    background: var(--et-light-bg);
    flex-shrink: 0;
}
.et-news-thumb-link {
    display: block;
    width: 100%; height: 100%;
}
.et-news-img {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .35s ease;
}
.et-news-card:hover .et-news-img { transform: scale(1.04); }

/* Placeholder sin imagen */
.et-news-thumb-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%; height: 100%;
    background: linear-gradient(135deg, var(--et-navy) 0%, #1a3a6b 100%);
    color: rgba(255,255,255,.3);
    font-size: 2.5rem;
    text-decoration: none;
}

/* Badge de categoría sobre la imagen */
.et-news-cat-badge {
    position: absolute;
    bottom: 10px;
    left: 12px;
    background: var(--et-blue);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .6px;
    padding: 3px 10px;
    border-radius: 20px;
}

/* Cuerpo de la noticia */
.et-news-body {
    padding: 16px 18px 18px;
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 6px;
}
.et-news-date {
    font-size: 11px;
    color: var(--et-muted);
    font-weight: 500;
    letter-spacing: .3px;
}
.et-news-title {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
    font-family: var(--et-font-brand);
}
.et-news-title a {
    color: var(--et-navy);
    text-decoration: none;
    transition: color .15s;
}
.et-news-title a:hover { color: var(--et-blue); }
.et-news-excerpt {
    font-size: 13px;
    color: var(--et-muted);
    line-height: 1.55;
    margin: 0;
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.et-news-read-more {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 700;
    color: var(--et-blue);
    text-decoration: none;
    margin-top: auto;
    transition: gap .15s;
}
.et-news-read-more:hover { gap: 8px; color: var(--et-navy); }

/* ══════════════════════════════════════════════════════════════
   TIPS COMO CARDS DE NOTICIA — sección inferior del home
══════════════════════════════════════════════════════════════ */

/* Header de la sección tips (label + link) */
.et-tips-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.et-highlight-label-inline {
    font-size: 14px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--et-navy);
    display: flex;
    align-items: center;
    gap: 7px;
}
.et-highlight-label-inline i { color: #f59f00; }

/* La section highlight-cards necesita alinear el label de Empresa Destacada igual */
.et-highlight-cards .et-highlight-card-header {
    height: 46px;
}

/* Card de tip (estilo noticia) */
.et-tip-card {
    background: #fff;
    border: 1px solid var(--et-border);
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
    transition: box-shadow .2s, transform .18s;
}
.et-tip-card:hover {
    box-shadow: 0 6px 22px rgba(0,0,0,.09);
    transform: translateY(-2px);
}

/* Thumbnail del tip */
.et-tip-card-thumb {
    position: relative;
    aspect-ratio: 16/9;
    overflow: hidden;
    background: var(--et-light-bg);
    flex-shrink: 0;
}
.et-tip-card-thumb-link {
    display: block;
    width: 100%; height: 100%;
}
.et-tip-card-img {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .35s ease;
}
.et-tip-card:hover .et-tip-card-img { transform: scale(1.04); }

/* Placeholder de tip sin imagen */
.et-tip-card-no-img {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #1a3a6b 0%, #0d2247 100%);
    color: rgba(255,255,255,.25);
    font-size: 2rem;
    text-decoration: none;
}

/* Badge "Tip" sobre la imagen */
.et-tip-card-badge {
    position: absolute;
    bottom: 10px;
    left: 12px;
    background: #f59f00;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .6px;
    padding: 3px 10px;
    border-radius: 20px;
}

/* Cuerpo del tip card */
.et-tip-card-body {
    padding: 14px 16px 16px;
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 5px;
}
.et-tip-card-date {
    font-size: 11px;
    color: var(--et-muted);
    font-weight: 500;
}
.et-tip-card-title {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
    font-family: var(--et-font-brand);
}
.et-tip-card-title a {
    color: var(--et-navy);
    text-decoration: none;
    transition: color .15s;
}
.et-tip-card-title a:hover { color: var(--et-blue); }
.et-tip-card-excerpt {
    font-size: 12px;
    color: var(--et-muted);
    line-height: 1.5;
    margin: 0;
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.et-tip-card-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 700;
    color: #f59f00;
    text-decoration: none;
    margin-top: auto;
    transition: gap .15s;
}
.et-tip-card-link:hover { gap: 8px; color: var(--et-navy); }

/* Responsive */
@media (max-width: 575px) {
    .et-news-title { font-size: 14px; }
    .et-tip-card-title { font-size: 13px; }
    .et-tips-header { flex-direction: column; align-items: flex-start; gap: 6px; }
}
