/* Habana Global — catálogo primero (v1.1). Se carga al final: sustituye la portada publicitaria por un encabezado compacto
   y presenta los productos con foto grande, precio, disponibilidad y WhatsApp. Misma paleta aprobada: azul noche y dorado. */

/* ---------- Encabezado compacto ---------- */
.intro{background:radial-gradient(ellipse at 70% -40%,#1c3a52,#07131e 70%);border-bottom:1px solid var(--line);padding:30px 0 26px}
.intro-layout{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 40px;align-items:center}
.intro .eyebrow{margin:0 0 8px}
.intro h1{font-family:Georgia,"Times New Roman",serif;font-weight:normal;letter-spacing:-.03em;line-height:1.05;font-size:clamp(30px,4vw,52px);margin:0 0 10px;text-transform:uppercase}
.intro h1>span{background:linear-gradient(180deg,#fbe3a0,#d9a441);-webkit-background-clip:text;background-clip:text;color:transparent}
.intro-lead{margin:0;max-width:620px;color:#d3dbe2;font-size:15px;line-height:1.5}
.intro-side{display:grid;gap:12px;justify-items:stretch;min-width:300px}
.intro-address{margin:0;padding:11px 14px;background:#050d15;border:1px solid #e2b255;border-radius:8px;display:grid;gap:2px}
.intro-address small{color:var(--gold);font-size:10px;letter-spacing:.22em;font-weight:800}
.intro-address strong{font:900 15px Arial,sans-serif;letter-spacing:.02em}
.intro-address span{color:#cfd6dc;font-size:12px}
.intro-wa{justify-content:center;text-align:center}

/* ---------- Catálogo ---------- */
.catalog-section{background:radial-gradient(ellipse at 50% -20%,#16324a,#061521 62%);color:#fff;padding:28px 0 64px}
.catalog-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:16px}
.catalog-head h2{margin:0;font:normal clamp(24px,2.6vw,34px) Georgia,"Times New Roman",serif;letter-spacing:-.02em;color:#f6ecd2}
.catalog-section .catalog-count{margin:0;color:#b9c6d1;font-size:13px;letter-spacing:.04em;text-transform:none}
.catalog-section .catalog-tools{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 20px;flex-wrap:nowrap}
.catalog-section .filter-list{display:flex;gap:8px;flex-wrap:wrap}
.catalog-section .filter{border:1px solid #836c4e;background:#0d2435;color:#e9e2d0;border-radius:999px;padding:9px 16px;font:700 13px Arial,sans-serif;min-height:40px}
.catalog-section .filter[hidden]{display:none}
.catalog-section .filter.active,.catalog-section .filter:hover{background:#e9bb59;border-color:#e9bb59;color:#091724}
.catalog-section .search-field{flex:0 1 300px;min-width:0;background:#0f2436;border:1px solid #b99a62;border-radius:999px;padding:0 16px;min-height:42px;color:#d5bd8c;display:flex;align-items:center;gap:10px}
.catalog-section .search-field input{font-size:14px;color:#fff;min-width:0;width:100%}
.catalog-section .search-field input::placeholder{color:#a9b8c4}

.catalog-section .product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;min-height:120px}

.hg-card{min-width:0;display:flex;flex-direction:column;overflow:hidden;border-radius:12px;background:linear-gradient(180deg,#12293c,#0b1a28);border:1px solid rgba(219,189,128,.28);color:#fff;transition:transform .2s,border-color .2s,box-shadow .2s}
.hg-card:hover{transform:translateY(-3px);border-color:#e2b255;box-shadow:0 14px 30px #0009}
.hg-media{position:relative;aspect-ratio:1/1;overflow:hidden;background:#0a1824;display:grid;place-items:center}
.hg-media::before{content:"";position:absolute;inset:-12%;background:var(--photo) center/cover no-repeat;filter:blur(20px) saturate(1.15);opacity:.55}
.hg-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:6px}
.hg-nophoto{position:relative;font:bold 56px Georgia,serif;color:transparent;-webkit-text-stroke:2px #e9bf6780}
.hg-badge{position:absolute;top:10px;left:10px;z-index:2;padding:6px 10px;border-radius:999px;background:#9b2c2c;color:#fff;font:800 11px Arial,sans-serif;letter-spacing:.1em}
.hg-card.is-sold .hg-photo{opacity:.6;filter:grayscale(.45)}
.hg-body{display:flex;flex-direction:column;gap:6px;flex:1;padding:14px 14px 16px}
.hg-category{color:var(--gold);font:800 10px Arial,sans-serif;letter-spacing:.18em;text-transform:uppercase}
.hg-body h3{margin:0;font:800 17px/1.22 Arial,sans-serif;color:#fff;min-height:2.44em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.hg-detail{margin:0;font-size:12px;line-height:1.4;color:#b9c6d1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hg-price{margin-top:auto;padding-top:6px;display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.hg-price strong{font:800 26px/1.1 Arial,sans-serif;color:#f6d98f;letter-spacing:-.01em}
.hg-price span{font:800 13px Arial,sans-serif;color:#e0b45b;letter-spacing:.06em}
.hg-price.is-consult strong{font-size:17px;font-weight:700;color:#cfd8df}
.hg-card.is-sold .hg-price strong{color:#a9b3bc}
.hg-stock{font:700 12px Arial,sans-serif;display:flex;align-items:center;gap:7px}
.hg-stock::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.hg-stock.is-in{color:#6fd99a}
.hg-stock.is-out{color:#ff9a9a}
.hg-wa{margin-top:8px;display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 12px;border:0;border-radius:8px;background:linear-gradient(180deg,#f3d488,#dfb154);color:#0a1724;font:800 14px Arial,sans-serif;text-align:center;text-decoration:none}
.hg-wa::before{content:"";flex:0 0 18px;height:18px;background:currentColor;-webkit-mask:var(--wa-glyph) center/contain no-repeat;mask:var(--wa-glyph) center/contain no-repeat}
.hg-wa:hover{background:#f1c66d}
.hg-card.is-sold .hg-wa{background:transparent;border:1px solid #c9a45c;color:#f1d28b}
.hg-card.is-sold .hg-wa:hover{background:#1c3347}
.hg-wa:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
:root{--wa-glyph:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27%3E%3Cpath d=%27M4 3h16a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H10l-5 4v-4H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2Z%27/%3E%3C/svg%3E")}

.catalog-section .empty-results{grid-column:1/-1;text-align:center;padding:40px 16px;border:1px dashed #836c4e;border-radius:12px;color:#d3dbe2}
.catalog-section .empty-results strong{display:block;font:normal 22px Georgia,serif;color:#f6ecd2;margin-bottom:8px}
.catalog-section .catalog-note{margin-top:26px;color:#b9c6d1;font-size:13px}

/* ---------- Pantallas ---------- */
@media(max-width:1100px){
  .catalog-section .product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:860px){
  .intro-layout{grid-template-columns:1fr}
  .intro-side{grid-template-columns:1fr 1fr;min-width:0;align-items:stretch}
  .intro-wa{align-self:stretch}
  .catalog-section .catalog-tools{flex-direction:column-reverse;align-items:stretch}
  .catalog-section .search-field{flex:0 0 auto;width:100%}
  .catalog-section .filter-list{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none;margin:0 -2px}
  .catalog-section .filter-list::-webkit-scrollbar{display:none}
  .catalog-section .filter{flex:0 0 auto}
}
@media(max-width:700px){
  .intro{padding:14px 0 14px}
  .intro .eyebrow{font-size:9px;margin-bottom:6px}
  .intro h1{font-size:clamp(24px,7.4vw,30px);margin-bottom:12px}
  .intro-lead,.intro-address{display:none}
  .intro-side{grid-template-columns:1fr}
  .intro-wa{min-height:44px;padding:10px 14px;font-size:14px}
  .catalog-section{padding-top:20px}
  .catalog-head{gap:10px;margin-bottom:12px}
  .catalog-head h2{font-size:22px}
  .catalog-section .catalog-count{font-size:12px;white-space:nowrap}
  .catalog-section .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .hg-body{padding:10px 10px 12px;gap:5px}
  .hg-body h3{font-size:14px}
  .hg-detail{font-size:11px}
  .hg-price strong{font-size:20px}
  .hg-price.is-consult strong{font-size:14px}
  .hg-price span{font-size:11px}
  .hg-wa{font-size:12px;min-height:42px;padding:8px 6px;gap:6px}
  .hg-wa::before{flex-basis:15px;height:15px}
  .hg-badge{top:7px;left:7px;font-size:10px;padding:5px 8px}
}
@media(max-width:340px){
  .catalog-section .product-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.hg-card{transition:none}.hg-card:hover{transform:none}}
