/* Front styles + Slider + Mobile Optimizations */
.ihn-layout { width:100%; }
.ihn-layout--with-slider {
  display:grid;
  grid-template-columns: 1fr 360px;
  gap: 24px;
  align-items: start;
}
.ihn-slider-left .ihn-main { order: 2; }
.ihn-slider-left .ihn-aside { order: 1; }
@media (max-width: 900px) {
  .ihn-layout--with-slider { grid-template-columns: 1fr; }
  .ihn-aside { width:100%; }
}

/* Image + hotspots */
.ihn-wrap-front { max-width: 100%; }
.ihn-img-box { position: relative; display: block; width: 100%; }
.ihn-img { display:block; width:100%; height:auto; } /* base: dimensiona pela largura do container */
.ihn-has-ratio .ihn-img { height:100%; object-fit:contain; } /* quando wrapper tiver aspect-ratio, imagem preenche a altura */
.ihn-layer { position:absolute; inset:0; }

/* Fallback antigo para navegadores sem aspect-ratio é feito via JS adicionando classe .ihn-ratio-fallback */
.ihn-img-box.ihn-ratio-fallback { height:0; }
.ihn-img-box.ihn-ratio-fallback .ihn-img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }

/* Hotspots */
.ihn-spot {
  position:absolute; transform:translate(-50%, -50%);
  width:40px; height:40px; border-radius:50%;
  border:none; cursor:pointer;
  background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.15);
  display:flex; align-items:center; justify-content:center;
  font-weight:700; line-height:1;
}
.ihn-plus { font-size:24px; }
@media (min-width: 601px) {
  .ihn-spot { width:36px; height:36px; }
  .ihn-plus { font-size:22px; }
}

/* Popover */
.ihn-popover {
  position:absolute; transform:translate(-50%, 8px);
  min-width:240px; max-width:min(320px, 92vw); z-index:5;
}
.ihn-pop-content { background:#fff; border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.18); overflow:hidden; }
.ihn-pop-head { display:flex; align-items:center; justify-content:space-between; padding:10px 12px; border-bottom:1px solid #eee; }
.ihn-pop-title { font-size:14px; }
.ihn-close { border:none; background:transparent; font-size:20px; line-height:1; cursor:pointer; }
.ihn-pop-body { padding:12px; font-size:14px; }
.ihn-desc { margin:0 0 8px; color:#555; }
.ihn-product-slot { font-size:14px; }
.ihn-pop-foot { padding:12px; border-top:1px solid #eee; display:flex; gap:8px; }
.ihn-btn { display:inline-block; padding:10px 14px; border-radius:10px; text-decoration:none; }
.ihn-btn-primary { background:#111; color:#fff; }
.ihn-price { font-weight:700; margin-bottom:6px; }

/* Slider */
.ihn-aside h3 { margin: 0 0 8px; font-size:18px; }
.ihn-slider { position: relative; }
.ihn-slides { display:flex; gap: 12px; overflow:auto; scroll-snap-type: x mandatory; padding-bottom: 8px; }
.ihn-slide { min-width: 280px; max-width: 320px; scroll-snap-align: start; }
.ihn-card { background:#fff; border:1px solid #eee; border-radius:12px; overflow:hidden; box-shadow:0 6px 18px rgba(0,0,0,.06); display:flex; flex-direction:column; height:100%; }
.ihn-card-img img { display:block; width:100%; height:auto; }
.ihn-card-body { padding:12px; }
.ihn-card-title { font-weight:600; font-size:14px; margin-bottom:6px; }
.ihn-card-price { font-weight:700; }
.ihn-card-foot { padding:12px; border-top:1px solid #eee; }
.ihn-nav { position:absolute; top:50%; transform:translateY(-50%); border:none; background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.15); width:32px; height:32px; border-radius:50%; cursor:pointer; }
.ihn-prev { left:-10px; } .ihn-next { right:-10px; }
@media (max-width: 900px) { .ihn-prev, .ihn-next { display:none; } }