/**
 * Estilos para Micrositios de Empresa / Mini-Webs Quieroloma
 * URL: /empresa/{slug}/
 */

.ql-microsite-wrapper {
  max-width: 1200px;
  margin: 0 auto;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
  color: #1e293b;
}

/* Banner de Cabecera */
.ql-microsite-hero {
  position: relative;
  height: 280px;
  background-size: cover;
  background-position: center;
  background-color: #1a4d2e;
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 24px;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

.ql-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.6) 100%);
}

.ql-microsite-profile {
  position: absolute;
  bottom: 24px;
  left: 30px;
  display: flex;
  align-items: flex-end;
  gap: 20px;
}

.ql-catalog-pagination {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin: 32px 0 8px;
}

.ql-catalog-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #fff;
  color: var(--company-primary, #0f766e);
  font-weight: 700;
  text-decoration: none;
}

.ql-catalog-pagination .page-numbers.current,
.ql-catalog-pagination .page-numbers:hover {
  border-color: var(--company-primary, #0f766e);
  background: var(--company-primary, #0f766e);
  color: #fff;
}

@media (max-width: 640px) {
  .ql-microsite-hero { height: 230px; }
  .ql-microsite-profile { right: 20px; left: 20px; bottom: 20px; }
  .ql-microsite-logo { width: 82px; height: 82px; }
  .ql-microsite-title-box h1 { font-size: 23px; }
}

.ql-microsite-logo {
  width: 110px;
  height: 110px;
  border-radius: 50%;
  border: 4px solid #ffffff;
  background: #ffffff;
  object-fit: cover;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

.ql-microsite-title-box {
  color: #ffffff;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

.ql-microsite-title-box h1 {
  font-size: 28px;
  font-weight: 800;
  margin: 0;
  color: #ffffff;
}

/* Barra de Contacto Directo */
.ql-microsite-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
  background: #ffffff;
  padding: 20px 30px;
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
  margin-bottom: 35px;
}

.ql-company-info-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.ql-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #f1f5f9;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 13px;
  color: #475569;
  font-weight: 500;
}

.ql-pill-verified {
  background: #dcfce7;
  color: #166534;
  font-weight: 600;
}

/* Catálogo de Propiedades */
.ql-company-catalog h2 {
  font-size: 22px;
  font-weight: 700;
  color: #1a4d2e;
  margin-bottom: 20px;
}

.ql-properties-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 24px;
}

.ql-property-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  display: flex;
  flex-direction: column;
}

.ql-property-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1);
}

.ql-property-image {
  height: 180px;
  background-size: cover;
  background-position: center;
  position: relative;
}

.ql-property-price {
  position: absolute;
  bottom: 12px;
  right: 12px;
  background: rgba(26, 77, 46, 0.9);
  color: #ffffff;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 700;
}

.ql-property-body {
  padding: 16px;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.ql-property-body h3 {
  font-size: 17px;
  font-weight: 700;
  margin: 0 0 8px 0;
}

.ql-property-body h3 a {
  color: #1e293b;
  text-decoration: none;
}

.ql-property-body h3 a:hover {
  color: #1a4d2e;
}

.ql-listing-company-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  padding: 6px 12px;
  border-radius: 8px;
  font-size: 13px;
  margin-bottom: 15px;
}

.ql-company-thumb {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  object-fit: cover;
}

/* Micrositio 2026: portada editorial y catálogo visual. */
.ql-microsite-wrapper{width:min(1320px,calc(100% - 32px));max-width:none;padding:32px 0 56px}.ql-microsite-hero{height:360px;margin-bottom:20px;border-radius:28px;background-color:#064e3b;background-image:linear-gradient(120deg,#052e2b 0%,var(--company-primary,#0f766e) 58%,#10b981 130%);box-shadow:0 24px 60px rgba(15,23,42,.18)}.ql-microsite-hero:after{position:absolute;inset:0;background:radial-gradient(circle at 82% 18%,rgba(255,255,255,.18),transparent 28%),radial-gradient(circle at 15% 90%,rgba(245,158,11,.2),transparent 30%);content:""}.ql-microsite-hero[style*="background-image: url"]:after{background:linear-gradient(90deg,rgba(2,44,40,.9),rgba(2,44,40,.25))}.ql-hero-overlay{z-index:1;background:linear-gradient(90deg,rgba(2,44,40,.82),rgba(2,44,40,.12))}.ql-microsite-profile{right:48px;bottom:44px;left:48px;z-index:2;align-items:center;gap:24px}.ql-microsite-logo{width:118px;height:118px;border:5px solid rgba(255,255,255,.96);box-shadow:0 16px 36px rgba(2,6,23,.3)}.ql-microsite-title-box{max-width:760px;text-shadow:none}.ql-microsite-title-box h1{margin:4px 0 8px;color:#fff!important;font-size:clamp(2rem,4vw,3.7rem);line-height:1;letter-spacing:-.04em}.ql-microsite-title-box p{max-width:680px;margin:0 0 16px;color:rgba(255,255,255,.86);font-size:1.02rem;line-height:1.55}.ql-microsite-eyebrow{color:#fef3c7;font-size:.75rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.ql-microsite-count{display:inline-flex;align-items:baseline;gap:6px;padding:7px 12px;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(15,23,42,.28);color:#fff;font-size:.82rem;backdrop-filter:blur(8px)}.ql-microsite-count strong{font-size:1rem}.ql-microsite-bar{margin-bottom:26px;padding:16px 20px;border-radius:16px;box-shadow:0 8px 28px rgba(15,23,42,.06)}.ql-partner-card{border-radius:18px!important;border:1px solid #e2e8f0;box-shadow:none!important}.ql-catalog-heading{display:flex;justify-content:space-between;align-items:end;gap:24px;margin:38px 0 22px}.ql-catalog-heading span{color:var(--company-primary,#0f766e);font-size:.75rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase}.ql-company-catalog .ql-catalog-heading h2{margin:5px 0 6px;color:#0f172a;font-size:clamp(1.65rem,3vw,2.25rem);letter-spacing:-.025em}.ql-catalog-heading p{margin:0;color:#64748b}.ql-catalog-heading>strong{flex:0 0 auto;padding:9px 13px;border-radius:999px;background:#ecfdf5;color:#047857;font-size:.82rem}.ql-properties-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.ql-property-card{border:1px solid #e5e7eb;border-radius:20px;box-shadow:0 8px 28px rgba(15,23,42,.07)}.ql-property-card:hover{transform:translateY(-6px);box-shadow:0 20px 44px rgba(15,23,42,.13)}.ql-property-image{height:225px;background-color:#e2e8f0}.ql-property-image:after{position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(2,6,23,.35));content:""}.ql-property-category{position:absolute;top:14px;left:14px;z-index:1;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.92);color:#0f172a;font-size:.72rem;font-weight:800;box-shadow:0 4px 16px rgba(15,23,42,.12);backdrop-filter:blur(8px)}.ql-property-price{z-index:1;border-radius:999px;background:rgba(15,23,42,.82)}.ql-property-body{padding:20px}.ql-property-location{display:flex;align-items:center;gap:6px;color:#64748b;font-size:.78rem;font-weight:700}.ql-property-location i{color:var(--company-primary,#0f766e)}.ql-property-body h3{margin:9px 0 14px;font-size:1.15rem;line-height:1.35}.ql-property-action{width:100%;justify-content:space-between!important;border-radius:12px!important;padding:11px 14px!important}
@media(max-width:980px){.ql-properties-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:640px){.ql-microsite-wrapper{width:min(100% - 20px,1320px);padding-top:16px}.ql-microsite-hero{height:390px;border-radius:20px}.ql-microsite-profile{right:24px;bottom:26px;left:24px;align-items:flex-start;flex-direction:column;gap:14px}.ql-microsite-logo{width:76px;height:76px}.ql-microsite-title-box h1{font-size:2.25rem}.ql-microsite-title-box p{font-size:.92rem}.ql-catalog-heading{align-items:flex-start;flex-direction:column}.ql-properties-grid{grid-template-columns:1fr}.ql-property-image{height:235px}}
.ql-catalog-topnav{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:-6px 0 22px;padding:12px 16px;border:1px solid #e2e8f0;border-radius:14px;background:#f8fafc;color:#64748b;font-size:.86rem}.ql-catalog-topnav>div{display:flex;gap:8px}.ql-catalog-topnav a{padding:8px 12px;border-radius:9px;background:#fff;color:var(--company-primary,#0f766e);font-weight:800;text-decoration:none;box-shadow:0 1px 4px rgba(15,23,42,.08)}@media(max-width:640px){.ql-catalog-topnav{align-items:flex-start;flex-direction:column}.ql-catalog-topnav>div{width:100%}.ql-catalog-topnav a{flex:1;text-align:center}}
/* Identidad visual aislada por micrositio mediante variables seguras. */
.ql-platform-bar{display:flex;justify-content:space-between;gap:1rem;padding:8px max(16px,env(safe-area-inset-left));background:#0f172a;color:#fff;font:600 13px/1.4 system-ui;position:relative;z-index:999}.ql-platform-bar a{color:#fff;text-decoration:none}.ql-microsite-wrapper .ql-btn-primary{background:var(--company-primary,#0f766e)!important}.ql-microsite-wrapper .ql-company-catalog>h2,.ql-microsite-wrapper h1,.ql-microsite-wrapper h2{color:var(--company-primary,#0f766e)}.ql-microsite-wrapper .ql-pill-verified{background:color-mix(in srgb,var(--company-primary,#0f766e) 14%,white);color:var(--company-primary,#0f766e)}.ql-template-adventure .ql-microsite-hero{border-radius:4px}.ql-template-hospitality .ql-microsite-hero{border-radius:24px}.ql-template-gastronomy .ql-property-card{border-color:var(--company-secondary,#f59e0b)}
