/* ============================
* /assets/css/hml-map.css
* ============================ */
:root{ --hml-accent:#E02B20; --hml-accent-2:#AEDEE7; --hml-card:#f0dfcb; --hml-radius:18px; }
body{ font-family:'Comfortaa',system-ui,-apple-system,Segoe UI,Roboto,sans-serif; }
.hml-wrap{ max-width: 1500px; margin: 0 auto; padding: 0 16px; }
.hml-grid-list{ display:grid; gap:22px; grid-template-columns: repeat(1, minmax(0, 1fr)); }
@media (min-width: 600px){ .hml-grid-list{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 992px){ .hml-grid-list{ grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1280px){ .hml-grid-list{ grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.hml-card{ background:#f6efe6; border:1px solid #e8d9c5; border-radius:var(--hml-radius); overflow:hidden; box-shadow:0 6px 18px rgba(0,0,0,.06); }
.hml-card-media{ background:#fff; }
.hml-slider{ position:relative; overflow:hidden; }
.hml-slides{ display:flex; transition:transform .35s ease; }
.hml-slide{ min-width:100%; }
.hml-slide img{ width:100%; height:280px; object-fit:cover; display:block; }
.hml-embed-map{ width:100%; height:280px; }
.hml-nav{ position:absolute; top:50%; transform:translateY(-50%); background:#fff; border:1px solid #ddd; width:36px; height:36px; border-radius:50%; cursor:pointer; }
.hml-nav.prev{ left:10px; } .hml-nav.next{ right:10px; }
.hml-card-body{ padding:18px; }
.hml-title{ font-size:22px; margin:0 0 8px; }
.hml-desc{ color:#333; margin:0 0 10px; line-height:1.55; }
.hml-desc.clamp{ display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
.hml-readmore{ background:transparent; border:none; color:var(--hml-accent); font-weight:700; cursor:pointer; padding:0; margin-bottom:12px; }
.hml-actions{ display:flex; gap:10px; }
.hml-btn{ display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:10px; background:var(--hml-accent); color:#fff; text-decoration:none; font-weight:700; }
.hml-btn:hover{ background:var(--hml-accent-2); color:#000; }
.hml-ico{ width:18px; height:18px; display:inline-block; background-size:contain; background-repeat:no-repeat; }
.hml-ico.rrss{ background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M22 12c0-5.52-4.48-10-10-10S2 6.48 2 12c0 4.99 3.66 9.12 8.44 9.88v-6.99H7.9V12h2.54V9.8c0-2.5 1.49-3.89 3.77-3.89 1.09 0 2.23.2 2.23.2v2.46h-1.26c-1.24 0-1.63.77-1.63 1.56V12h2.78l-.44 2.89h-2.34v6.99C18.34 21.12 22 16.99 22 12z"/></svg>'); }
.hml-ico.web{ background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M12 2a10 10 0 100 20 10 10 0 000-20zm-1 17.93A8.001 8.001 0 014.07 13H11v6.93zM13 13h6.93A8.001 8.001 0 0113 19.93V13zm6.93-2H13V4.07A8.001 8.001 0 0119.93 11zM11 4.07V11H4.07A8.001 8.001 0 0111 4.07z"/></svg>'); }
.hml-ico.contact{ background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="white" d="M6.62 10.79a15.05 15.05 0 006.59 6.59l2.2-2.2a1 1 0 011.01-.24c1.12.37 2.33.57 3.58.57a1 1 0 011 1V21a1 1 0 01-1 1C10.4 22 2 13.6 2 3a1 1 0 011-1h3.5a1 1 0 011 1c0 1.25.2 2.46.57 3.58a1 1 0 01-.25 1.01l-2.2 2.2z"/></svg>'); }
.see-all{ margin:10px auto 0; display:block; width:fit-content; padding:10px 20px; background-color:var(--hml-accent); color:#fff; text-align:center; border-radius:10px; text-decoration:none; font-weight:700; }
.see-all:hover{ background:var(--hml-accent-2); color:#000; }

.hml-wrap{ max-width: 1500px; margin: 0 auto; padding: 0 16px; }

.hml-grid-list{
  display:grid;
  gap:22px;
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
@media (min-width: 600px){  .hml-grid-list{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 992px){  .hml-grid-list{ grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1280px){ .hml-grid-list{ grid-template-columns: repeat(4, minmax(0, 1fr)); } }


/* efecto lift en hover */
.hml-grid-list{ perspective: 1000px; } /* da sensación de profundidad suave */

.hml-card{
  position: relative;
  transform: translateZ(0);            /* evita blureo de fuentes */
  transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
  will-change: transform;
}

.hml-card:hover,
.hml-card:focus-within{                /* también con tab/foco */
  transform: translateY(-8px) rotateX(.8deg); /* leve elevación y tilt */
  box-shadow: 0 18px 34px rgba(0,0,0,.12), 0 6px 12px rgba(0,0,0,.06);
  filter: saturate(1.02);
}

/* botones un pelín “clicables” */
.hml-btn{
  transition: transform .2s ease, background-color .2s ease,color .2s ease;
}
.hml-btn:hover{ transform: translateY(-1px); }

/* respeta accesibilidad si el usuario prefiere menos animación */
@media (prefers-reduced-motion: reduce){
  .hml-card, .hml-btn{ transition: none !important; }
}

/* Franja superior (decorativa) y glow en hover */
.hml-card{
  position: relative;
  overflow: hidden;
}
.hml-card::before{
  content:"";
  position:absolute; inset:0 0 auto 0; height:6px;
  background: linear-gradient(90deg, #f2c9a8, #e9d7c6);
  transition: background .25s ease, height .25s ease;
}
.hml-card:hover::before,
.hml-card:focus-within::before{
  height:8px;
  background: linear-gradient(90deg, #E02B20, #AEDEE7);
}
.hml-card:hover{
  box-shadow: 0 18px 34px rgba(224,43,32,.18), 0 6px 12px rgba(0,0,0,.06);
}