/* DIRECPRO v0.11.0 — Premium Grid & Media System
   Objetivo: tarjetas uniformes, fotos sin distorsión, 3 columnas en desktop,
   sidebar estable y hero compacto. */

:root{
  --dp11-card-ratio: 4 / 5;
  --dp11-gap: 22px;
  --dp11-card-radius: 24px;
  --dp11-card-border: #dfe5ef;
  --dp11-card-shadow: 0 14px 38px rgba(13,29,58,.08);
  --dp11-card-shadow-hover: 0 24px 54px rgba(13,29,58,.13);
  --dp11-media-bg: #eef2f7;
}

/* ---------- HERO: más claro, compacto y controlado ---------- */
.dp-market-hero.dp-market-hero-visual{
  min-height: 0;
  padding: 54px 0 48px;
}
.dp-market-hero-inner-visual{
  min-height: 420px;
  display:flex;
  align-items:center;
}
.dp-market-hero-copy{
  max-width: 760px;
}
.dp-market-hero-copy h1{
  max-width: 720px;
  font-size: clamp(42px, 5.4vw, 72px);
  line-height: .98;
  letter-spacing: -.048em;
}
.dp-market-hero-copy > p:not(.dp-kicker){
  max-width: 700px;
  font-size: 15px;
  line-height: 1.72;
}
.dp-market-search{
  max-width: 690px;
  margin-top: 22px;
}
.dp-market-hero-meta-inline{
  max-width: 690px;
  margin-top: 18px;
  gap: 10px;
}
.dp-market-hero-picture img{
  object-fit: cover;
  object-position: 68% center;
}

/* ---------- LAYOUT GENERAL ---------- */
.dp-market-shell{
  padding-top: 34px;
  padding-bottom: 72px;
}
.dp-market-layout{
  display:grid;
  grid-template-columns: 270px minmax(0,1fr);
  gap: 28px;
  align-items:start;
}
.dp-market-results{
  min-width:0;
}
.dp-market-results-head{
  margin-bottom: 20px;
}
.dp-market-results-head-featured{
  align-items:flex-end;
}
.dp-section-support{
  margin: 8px 0 0;
  max-width: 660px;
  color:#68758c;
  font-size:12px;
  line-height:1.7;
}

/* ---------- SIDEBAR: no invade contenido ---------- */
.dp-market-sidebar{
  position: sticky;
  top: 98px;
  align-self:start;
  width:100%;
  max-height: calc(100vh - 118px);
  overflow:auto;
  overscroll-behavior:contain;
  z-index:4;
  margin:0 !important;
  transform:none !important;
}
.dp-market-sidebar::-webkit-scrollbar{width:6px}
.dp-market-sidebar::-webkit-scrollbar-thumb{background:#d6dce8;border-radius:999px}

/* ---------- SISTEMA UNIFORME DE TARJETAS ---------- */
.dp-market-featured-grid,
.dp-market-featured-grid-uniform,
.dp-market-card-grid,
.dp-promo-zone-grid{
  display:grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: var(--dp11-gap) !important;
  align-items:stretch;
}
.dp-market-featured-grid-uniform{
  margin-bottom: 34px;
}

.dp-card{
  display:flex !important;
  flex-direction:column !important;
  min-width:0;
  height:100%;
  background:#fff;
  border:1px solid var(--dp11-card-border);
  border-radius:var(--dp11-card-radius);
  overflow:hidden;
  box-shadow:var(--dp11-card-shadow);
  transform:none;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.dp-card:hover{
  transform:translateY(-3px);
  border-color:#ced7e6;
  box-shadow:var(--dp11-card-shadow-hover);
}

/* Marco de imagen consistente: nunca estira la foto */
.dp-card-media{
  position:relative;
  display:flex !important;
  align-items:center;
  justify-content:center;
  width:100%;
  height:auto !important;
  min-height:0 !important;
  aspect-ratio:var(--dp11-card-ratio);
  overflow:hidden;
  background:linear-gradient(145deg,#e9eef5,#f6f8fb);
  border-radius:0;
}
.dp-card-media img{
  display:block;
  width:100% !important;
  height:100% !important;
  max-width:none;
  object-fit:cover !important;
  object-position:50% 24%;
  transform:none !important;
}
/* Organizaciones suelen usar logos o piezas gráficas: no forzar recorte */
.dp-card.entity-company .dp-card-media img{
  object-fit:contain !important;
  object-position:center;
  padding:22px;
  background:#fff;
}

.dp-card-body{
  display:flex !important;
  flex:1 1 auto;
  flex-direction:column;
  padding:18px 18px 17px !important;
  min-width:0;
}
.dp-card-meta{
  min-height:16px;
  margin-bottom:6px;
}
.dp-card h3{
  margin:5px 0 4px !important;
  font-size:22px !important;
  line-height:1.1 !important;
  letter-spacing:-.025em;
}
.dp-card-title{
  margin:0 0 9px !important;
  min-height:0 !important;
  color:#526078;
  font-size:12px !important;
  line-height:1.45 !important;
}
.dp-summary{
  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
  overflow:hidden;
  min-height:0 !important;
  margin:0 0 10px !important;
  color:#66738b;
  font-size:11px !important;
  line-height:1.62 !important;
}
.dp-card .dp-tags{
  margin-top:4px !important;
  gap:6px !important;
}
.dp-card .dp-tags span{
  max-width:100%;
  padding:6px 8px !important;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:8.5px !important;
}
.dp-card-footer{
  margin-top:auto !important;
  padding-top:13px !important;
  border-top:1px solid #edf1f6;
}

/* insignias y overlays siempre dentro de la foto */
.dp-card .dp-type,
.dp-card .dp-badge-verified,
.dp-card .dp-badge-promotion{
  z-index:3;
  max-width:calc(100% - 28px);
}
.dp-card-official-stack{
  z-index:4;
  right:12px !important;
  bottom:12px !important;
  max-width:80px;
}
.dp-card-official-stack img{
  width:30px !important;
  height:30px !important;
  object-fit:contain !important;
  padding:0 !important;
  background:transparent !important;
}

/* destacados: premium por jerarquía, no por tamaño irregular */
.dp-card-featured-uniform{
  border-color:#e0d5ae;
  box-shadow:0 16px 42px rgba(117,85,10,.10);
}
.dp-card-featured-uniform:before{
  content:"DESTACADO";
  position:absolute;
  z-index:6;
  top:14px;
  left:14px;
  padding:7px 9px;
  border-radius:999px;
  background:rgba(8,24,57,.92);
  color:#f5d875;
  font-size:8px;
  font-weight:800;
  letter-spacing:.09em;
}
.dp-card-featured-uniform{position:relative}

/* El viejo spotlight horizontal queda neutralizado por compatibilidad */
.dp-market-spotlight{display:none !important}

/* ---------- CATEGORÍAS Y PROMOCIONES ---------- */
.dp-market-category-strip{
  margin: 32px 0 34px;
  padding: 24px 0 0;
  border-top:1px solid #e8edf4;
}
.dp-market-category-chips{
  gap:8px !important;
}
.dp-promo-zone{
  border-radius:24px !important;
}
.dp-promo-zone-grid .dp-card-media{
  aspect-ratio:var(--dp11-card-ratio);
}

/* ---------- DIRECTORIO ---------- */
.dp-market-directory{
  margin-top:32px;
}
.dp-market-card-grid{
  margin-top:18px;
}
.dp-state.dp-state-compact{
  margin-top:18px;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 1240px){
  .dp-market-layout{grid-template-columns:250px minmax(0,1fr);gap:22px}
  .dp-market-featured-grid,
  .dp-market-featured-grid-uniform,
  .dp-market-card-grid,
  .dp-promo-zone-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:18px !important;
  }
  .dp-card h3{font-size:20px !important}
}

@media (max-width: 1080px){
  .dp-market-layout{grid-template-columns:230px minmax(0,1fr);gap:20px}
  .dp-market-featured-grid,
  .dp-market-featured-grid-uniform,
  .dp-market-card-grid,
  .dp-promo-zone-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .dp-market-hero-copy h1{font-size:clamp(40px,6vw,62px)}
}

@media (max-width: 860px){
  .dp-market-hero.dp-market-hero-visual{padding:46px 0 42px}
  .dp-market-hero-inner-visual{min-height:360px}
  .dp-market-layout{display:block}
  .dp-market-sidebar{
    position:fixed;
    top:0;
    left:0;
    bottom:0;
    width:min(88vw,360px);
    max-height:none;
    transform:translateX(-105%) !important;
    transition:transform .24s ease;
    z-index:120;
    border-radius:0 24px 24px 0;
  }
  .dp-market-sidebar.is-open{transform:translateX(0) !important}
  .dp-market-featured-grid,
  .dp-market-featured-grid-uniform,
  .dp-market-card-grid,
  .dp-promo-zone-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width: 620px){
  .dp-market-hero.dp-market-hero-visual{padding:38px 0 34px}
  .dp-market-hero-inner-visual{min-height:0}
  .dp-market-hero-copy h1{font-size:clamp(34px,11vw,48px)}
  .dp-market-hero-copy > p:not(.dp-kicker){font-size:13px;line-height:1.65}
  .dp-market-search{margin-top:18px}
  .dp-market-featured-grid,
  .dp-market-featured-grid-uniform,
  .dp-market-card-grid,
  .dp-promo-zone-grid{
    grid-template-columns:1fr !important;
    gap:16px !important;
  }
  .dp-card-media{aspect-ratio:4 / 5}
  .dp-card h3{font-size:22px !important}
  .dp-card-body{padding:18px !important}
  .dp-section-support{font-size:11px}
}
