/* ═══════════════════════════════════════════════════════════════════════
   SATEC v3 «Claro» · tienda, ficha de producto y novedades
   Se carga después de satec.css y v3.css. Guía: DISENO_V3.md
   GUBOS Developer Costa Rica · BCom A.i Xpert
   ═══════════════════════════════════════════════════════════════════════ */

/* ═══ Encabezado de página (común a las tres) ═════════════════════════ */
.v3-pg .v3-ph { position: relative; padding: 30px 0 26px; overflow: hidden;
  background:
    radial-gradient(700px 260px at 96% -40%, rgba(10,99,230,.08), transparent 65%),
    radial-gradient(520px 240px at -4% 130%, rgba(0,168,107,.09), transparent 65%),
    linear-gradient(180deg, var(--s4-surface, #fff) 0%, var(--v3-bg) 100%);
  border-bottom: 1px solid var(--v3-line); }
.v3-pg .v3-ph::before { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: radial-gradient(rgba(11,27,46,.07) 1px, transparent 1px); background-size: 22px 22px;
  mask-image: linear-gradient(180deg, #000, transparent 90%); -webkit-mask-image: linear-gradient(180deg, #000, transparent 90%); }
.v3-pg .v3-ph .wrap { position: relative; }
.v3-pg .v3-ph-title { font-size: clamp(28px, 3.4vw, 42px); font-weight: 700; line-height: 1.1;
  letter-spacing: -.03em; margin: 8px 0 6px; overflow-wrap: anywhere; }
.v3-pg .v3-ph-sub { margin: 0; color: var(--v3-muted); font-size: 15.5px; max-width: 680px; }
.v3-pg .v3-ph-sub:empty { display: none; }
.v3-pg .v3-ph-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; flex-wrap: wrap; }

/* Migas de pan */
.v3-pg .v3-crumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; margin-bottom: 14px;
  font-size: 13px; color: var(--v3-muted); min-width: 0; }
.v3-pg .v3-crumbs a { color: var(--v3-ink-2); text-decoration: none; font-weight: 600; border-radius: 6px; padding: 2px 4px; margin: 0 -4px; }
.v3-pg .v3-crumbs a:hover { color: var(--v3-green-d); }
.v3-pg .v3-crumbs i, .v3-pg .v3-crumbs svg { width: 14px; height: 14px; color: #9AA7B8; flex-shrink: 0; margin: 0 4px; }
.v3-pg .v3-crumbs span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 46ch; }

/* Filtros activos (chips bajo el título), en la paleta nueva */
.v3-pg .filtros-activos { margin-top: 14px; gap: 8px; }
.v3-pg .fa-chip { height: 34px; padding: 0 12px 0 11px; border-radius: 999px; font: 700 13px var(--v3-f-body);
  color: var(--v3-green-d); background: var(--v3-green-50); border: 1px solid #BFE6D4; }
.v3-pg .fa-chip:hover { background: color-mix(in srgb, #D8F1E6 var(--s4-mixp, 100%), var(--s4-surface, #fff)); border-color: var(--v3-green); color: color-mix(in srgb, #00603E, #fff var(--s4-lift, 0%)); }
.v3-pg .fa-chip span { max-width: 32ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v3-pg .fa-chip.fa-todo { color: var(--v3-ink-2); background: var(--s4-surface, #fff); border-color: var(--v3-line-2); }
.v3-pg .fa-chip.fa-todo:hover { color: color-mix(in srgb, #B42318, #fff var(--s4-lift, 0%)); border-color: #F3B8AE; background: var(--v3-coral-50); }

/* ═══ Tienda ══════════════════════════════════════════════════════════ */
.v3-pg .v3-tienda { padding: 26px 0 64px; }
.v3-pg .v3-t-layout { display: grid; grid-template-columns: 272px minmax(0, 1fr); gap: 28px; align-items: start; }
.v3-pg .v3-t-res { min-width: 0; }

/* Panel de filtros CLARO (antes era un bloque azul oscuro) */
.v3-pg .filtros-panel { position: sticky; top: 172px; display: flex; flex-direction: column;
  max-height: calc(100vh - 190px); padding: 0; overflow: hidden;
  background: var(--s4-surface, #fff); border: 1px solid var(--v3-line); border-radius: var(--v3-r-lg); box-shadow: none; }
.v3-pg .v3-fp-head { display: none; }
.v3-pg .v3-fp-body { flex: 1; min-height: 0; overflow-y: auto; padding: 18px 16px 6px; scrollbar-width: thin; scrollbar-color: var(--v3-line-2) transparent; }
.v3-pg .filtros-panel .fp-bloque { margin-bottom: 20px; }
.v3-pg .filtros-panel .fp-bloque + .fp-bloque { padding-top: 18px; border-top: 1px solid var(--v3-line); }
.v3-pg .filtros-panel h5 { font: 800 11.5px var(--v3-f-body); letter-spacing: .12em; text-transform: uppercase;
  color: var(--v3-muted); margin: 0 0 10px; padding: 0 4px; }

.v3-pg .fp-scroll { max-height: 300px; padding-right: 4px; scrollbar-color: var(--v3-line-2) transparent; }
.v3-pg .fp-scroll::-webkit-scrollbar-thumb { background: var(--v3-line-2); }
.v3-pg .v3-fp-cats { max-height: 360px; }

.v3-pg .filt { min-height: 38px; padding: 7px 10px; border-radius: var(--v3-r-sm); font-size: 14px; font-weight: 600;
  color: var(--v3-ink-2); border: 1px solid transparent; transition: background .15s, color .15s, border-color .15s; }
.v3-pg .filt .fc { font-size: 11.5px; font-weight: 700; color: var(--v3-muted); background: var(--v3-bg-2); padding: 2px 8px; }
.v3-pg .filt:hover { background: var(--v3-bg); color: var(--v3-ink); transform: none; }
.v3-pg .filt:hover .fc { background: color-mix(in srgb, #E3EAF2 var(--s4-mixp, 100%), var(--s4-surface, #fff)); color: var(--v3-ink-2); }
.v3-pg .filt:focus-visible { outline: 2px solid rgba(0,168,107,.55); outline-offset: 0; }

/* Seleccionado: fondo verde suave + borde + punto + peso; no depende solo del color. */
.v3-pg .filt.on { background: var(--v3-green-50); color: color-mix(in srgb, #00603E, #fff var(--s4-lift, 0%)); font-weight: 700; border-color: #A9DEC6;
  padding-left: 26px; box-shadow: none; }
.v3-pg .filt.on::before { left: 11px; width: 7px; height: 7px; background: var(--v3-green); box-shadow: 0 0 0 3px rgba(0,168,107,.18); }
.v3-pg .filt.on .fc { background: var(--s4-surface, #fff); color: var(--v3-green-d); }
.v3-pg .filt.on:hover { background: color-mix(in srgb, #DDF3E9 var(--s4-mixp, 100%), var(--s4-surface, #fff)); }
.v3-pg .filt.on:hover .fc { background: var(--s4-surface, #fff); }

/* Interruptor «Solo ofertas» */
.v3-pg .v3-fp-toggle { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px; cursor: pointer; text-align: left;
  border-radius: var(--v3-r); border: 1px solid var(--v3-line); background: var(--v3-bg); font-family: var(--v3-f-body);
  color: var(--v3-ink); transition: border-color .15s, background .15s; }
.v3-pg .v3-fp-toggle:hover { border-color: #F3B8AE; background: var(--s4-surface, #fff); }
.v3-pg .v3-fp-toggle b { display: block; font-size: 14px; }
.v3-pg .v3-fp-toggle small { display: block; font-size: 12.5px; color: var(--v3-muted); }
.v3-pg .v3-fp-toggle > span:nth-child(2) { flex: 1; min-width: 0; }
.v3-pg .v3-fp-ti { width: 36px; height: 36px; border-radius: 10px; background: var(--v3-coral-50); color: color-mix(in srgb, #C2361F, #fff var(--s4-lift, 0%));
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.v3-pg .v3-fp-ti i, .v3-pg .v3-fp-ti svg { width: 18px; height: 18px; }
.v3-pg .v3-sw { position: relative; width: 38px; height: 22px; border-radius: 999px; background: #CBD5E1; flex-shrink: 0; transition: background .2s; }
.v3-pg .v3-sw::after { content: ''; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: var(--s4-surface, #fff);
  box-shadow: 0 1px 3px rgba(11,27,46,.25); transition: transform .2s var(--v3-ease); }
.v3-pg .v3-fp-toggle.on { border-color: #F3B8AE; background: var(--v3-coral-50); }
.v3-pg .v3-fp-toggle.on .v3-sw { background: var(--v3-coral); }
.v3-pg .v3-fp-toggle.on .v3-sw::after { transform: translateX(16px); }

/* Buscador de marcas */
.v3-pg .v3-fp-find { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px; margin: 0 0 8px;
  border-radius: var(--v3-r-sm); border: 1px solid var(--v3-line-2); background: var(--s4-surface, #fff); cursor: text; }
.v3-pg .v3-fp-find:focus-within { border-color: #93B8F5; box-shadow: 0 0 0 3px rgba(10,99,230,.12); }
.v3-pg .v3-fp-find i, .v3-pg .v3-fp-find svg { width: 16px; height: 16px; color: var(--v3-muted); flex-shrink: 0; }
.v3-pg .v3-fp-find input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent;
  font: 500 14px var(--v3-f-body); color: var(--v3-ink); }
.v3-pg .v3-fp-find input:focus-visible { box-shadow: none; }
.v3-pg .v3-fp-nada { margin: 6px 4px 0; font-size: 13px; color: var(--v3-muted); }

.v3-pg .v3-fp-foot { padding: 12px 16px 14px; border-top: 1px solid var(--v3-line); background: var(--s4-surface, #fff); }
.v3-pg .fp-limpiar { margin: 0; height: 42px; padding: 0 14px; border-radius: 12px; font: 700 13.5px var(--v3-f-body);
  color: var(--v3-ink-2); background: var(--s4-surface, #fff); border: 1.5px solid var(--v3-line-2); transition: border-color .15s, color .15s; }
.v3-pg .fp-limpiar:hover { background: var(--s4-surface, #fff); color: color-mix(in srgb, #B42318, #fff var(--s4-lift, 0%)); border-color: #F3B8AE; }
.v3-pg .v3-fp-ver { display: none; }
.v3-pg .v3-fp-velo { display: none; }

/* Barra de resultados: filtros (teléfono), nota y orden */
.v3-pg .v3-t-bar { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; padding: 10px 12px 10px 16px;
  background: var(--s4-surface, #fff); border: 1px solid var(--v3-line); border-radius: var(--v3-r); }
.v3-pg .v3-t-hint { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--v3-muted); min-width: 0; }
.v3-pg .v3-t-hint i, .v3-pg .v3-t-hint svg { width: 17px; height: 17px; color: var(--v3-green-d); flex-shrink: 0; }
.v3-pg .v3-t-sort { margin-left: auto; display: inline-flex; align-items: center; gap: 10px; font-size: 13.5px; color: var(--v3-muted); white-space: nowrap; }
.v3-pg .v3-t-sort select, .v3-pg .v3-sort select { height: 40px; padding: 0 34px 0 12px; border-radius: var(--v3-r-sm); cursor: pointer;
  border: 1px solid var(--v3-line-2); color: var(--v3-ink); font: 600 14px var(--v3-f-body);
  -webkit-appearance: none; appearance: none;
  background: var(--s4-surface, #fff) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235D6B7E' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center; }
.v3-pg .v3-t-sort select:hover, .v3-pg .v3-sort select:hover { border-color: #B6C3D3; }
.v3-pg .v3-t-fbtn { display: none; align-items: center; gap: 8px; height: 40px; padding: 0 14px; border-radius: var(--v3-r-sm); cursor: pointer;
  border: 1px solid var(--v3-line-2); background: var(--s4-surface, #fff); color: var(--v3-ink); font: 700 14px var(--v3-f-body); }
.v3-pg .v3-t-fbtn i, .v3-pg .v3-t-fbtn svg { width: 17px; height: 17px; }
.v3-pg .v3-t-fn { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--v3-green); color: #fff;
  font-size: 11.5px; line-height: 20px; text-align: center; }

.v3-pg .v3-more { text-align: center; margin-top: 30px; }
.v3-pg .v3-more .btn { min-width: 240px; }

/* Estado vacío (tienda y novedades) */
.v3-pg .v3-empty { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: 48px 22px; border-radius: var(--v3-r-lg); background: var(--s4-surface, #fff); border: 1px dashed var(--v3-line-2); }
.v3-pg .v3-empty-ic { width: 60px; height: 60px; border-radius: 18px; background: var(--v3-blue-50); color: var(--v3-blue-d);
  display: inline-flex; align-items: center; justify-content: center; margin-bottom: 14px; }
.v3-pg .v3-empty-ic i, .v3-pg .v3-empty-ic svg { width: 28px; height: 28px; }
.v3-pg .v3-empty h3 { font-size: 20px; margin: 0 0 6px; }
.v3-pg .v3-empty p { margin: 0 0 20px; color: var(--v3-muted); max-width: 460px; }
.v3-pg .v3-empty-acts { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }

/* Cuatro columnas solo cuando hay lugar al lado del panel */
@media (max-width: 1240px) and (min-width: 821px) { .v3-pg .v3-tienda .prod-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1000px) { .v3-pg .filtros-panel { top: 124px; max-height: calc(100vh - 140px); } }

/* Teléfono y tableta chica: el panel pasa a ser una hoja lateral */
@media (max-width: 820px) {
  .v3-pg .v3-t-layout { grid-template-columns: minmax(0, 1fr) !important; gap: 0; }
  .v3-pg .filtros-panel, .v3-pg .tienda-layout aside.filtros-panel { position: fixed !important; z-index: 260; top: 0; bottom: 0; left: 0;
    width: min(360px, 88vw); max-height: none; border-radius: 0 var(--v3-r-lg) var(--v3-r-lg) 0; border: 0;
    box-shadow: var(--v3-sh-3); transform: translateX(-104%); visibility: hidden;
    transition: transform .28s var(--v3-ease), visibility 0s linear .28s; }
  .v3-pg .tienda-layout aside.filtros-panel.v3-open { transform: none; visibility: visible; transition: transform .28s var(--v3-ease), visibility 0s; }
  .v3-pg .v3-fp-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 12px 12px 18px; border-bottom: 1px solid var(--v3-line); }
  .v3-pg .v3-fp-head > span { display: inline-flex; align-items: center; gap: 8px; font: 700 17px var(--v3-f-head); color: var(--v3-ink); }
  .v3-pg .v3-fp-head > span i, .v3-pg .v3-fp-head > span svg { width: 18px; height: 18px; color: var(--v3-green-d); }
  .v3-pg .v3-fp-x { width: 44px; height: 44px; border-radius: 12px; border: 0; background: var(--v3-bg-2); color: var(--v3-ink); cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center; }
  .v3-pg .v3-fp-x i, .v3-pg .v3-fp-x svg { width: 20px; height: 20px; }
  .v3-pg .fp-scroll, .v3-pg .v3-fp-cats { max-height: none; overflow: visible; }
  .v3-pg .v3-fp-foot { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
  .v3-pg .fp-limpiar { white-space: nowrap; padding: 0 10px; }
  .v3-pg .v3-fp-ver { display: inline-flex; justify-content: center; height: 42px; padding: 0 14px; }
  .v3-pg .v3-fp-velo { display: block; position: fixed; inset: 0; z-index: 255; background: rgba(11,27,46,.38);
    opacity: 0; pointer-events: none; transition: opacity .25s; }
  .v3-pg .filtros-panel.v3-open + .v3-fp-velo { opacity: 1; pointer-events: auto; }
  html.v3-fp-lock, html.v3-fp-lock body { overflow: hidden; }
  .v3-pg .v3-t-fbtn { display: inline-flex; }
  .v3-pg .v3-t-hint { display: none; }
  .v3-pg .v3-t-bar { padding: 8px; gap: 8px; }
}
@media (max-width: 520px) {
  .v3-pg .v3-ph { padding: 20px 0 18px; }
  .v3-pg .v3-crumbs { margin-bottom: 10px; }
  .v3-pg .v3-tienda { padding-top: 16px; }
  .v3-pg .v3-t-sort > span { display: none; }
  .v3-pg .v3-t-sort select { max-width: 190px; }
  .v3-pg .v3-more .btn { min-width: 0; width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .v3-pg .filtros-panel, .v3-pg .v3-fp-velo { transition: none !important; } }

/* ═══ Ficha de producto ═══════════════════════════════════════════════ */
.v3-pg .v3-pd-sec { padding: 22px 0 40px; }
.v3-pg .v3-pd-grid { display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr); gap: 40px; align-items: start; }

/* Galería */
.v3-pg .v3-pd-gal { position: sticky; top: 172px; min-width: 0; }
.v3-pg .pd-foto { border-radius: var(--v3-r-xl); background: var(--s4-surface, #fff); border: 1px solid var(--v3-line); box-shadow: none;
  transition: border-color .2s, box-shadow .2s; }

/* Fondo blanco liso: las fotos del catálogo vienen sobre blanco y un degradado
   dejaba ver el rectángulo de la imagen. */
.v3-pg .pd-foto::before { content: none; }
.v3-pg .pd-foto:hover { border-color: var(--v3-line-2); box-shadow: var(--v3-sh-2); }
.v3-pg .pd-foto:focus-visible { outline: 2px solid rgba(0,168,107,.6); outline-offset: 3px; }
.v3-pg .pd-foto img { position: relative; padding: 36px; background: var(--s4-surface, #fff); }
.v3-pg .pd-lupa { right: 16px; bottom: 16px; font-family: var(--v3-f-body); color: var(--v3-ink-2); background: var(--s4-surface, #fff);
  border: 1px solid var(--v3-line); box-shadow: var(--v3-sh-1); }
.v3-pg .pd-foto:hover .pd-lupa { color: var(--v3-green-d); border-color: #BFE6D4; }
.v3-pg .v3-pd-badge { position: absolute; z-index: 2; top: 16px; left: 16px; padding: 5px 11px; border-radius: 8px;
  background: var(--v3-coral); color: #fff; font: 800 13px var(--v3-f-body); }
.v3-pg .v3-pd-galnota { display: flex; align-items: center; gap: 8px; margin: 12px 4px 0; font-size: 12.5px; color: var(--v3-muted); }
.v3-pg .v3-pd-galnota i, .v3-pg .v3-pd-galnota svg { width: 15px; height: 15px; flex-shrink: 0; }

/* Columna de información */
.v3-pg .v3-pd-info { min-width: 0; }
.v3-pg .v3-pd-marca { display: inline-flex; align-items: center; gap: 5px; padding: 5px 11px; border-radius: 999px;
  background: var(--v3-green-50); color: var(--v3-green-d); font: 800 12px var(--v3-f-body); letter-spacing: .08em;
  text-transform: uppercase; text-decoration: none; }
.v3-pg a.v3-pd-marca:hover { background: color-mix(in srgb, #D8F1E6 var(--s4-mixp, 100%), var(--s4-surface, #fff)); color: color-mix(in srgb, #00603E, #fff var(--s4-lift, 0%)); }
.v3-pg .v3-pd-marca i, .v3-pg .v3-pd-marca svg { width: 14px; height: 14px; }
.v3-pg .v3-pd-title { font-size: clamp(24px, 2.6vw, 34px); font-weight: 700; line-height: 1.15; letter-spacing: -.025em;
  margin: 14px 0 8px; overflow-wrap: anywhere; }
.v3-pg .v3-pd-sku { font-size: 13.5px; color: var(--v3-muted); margin-bottom: 18px; }
.v3-pg .v3-pd-sku b { color: var(--v3-ink-2); font-variant-numeric: tabular-nums; }

/* Bloque de compra */
.v3-pg .v3-pd-buy { padding: 22px; border-radius: var(--v3-r-lg); background: var(--s4-surface, #fff); border: 1px solid var(--v3-line); }
.v3-pg .v3-pd-tag { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 6px; font-size: 12.5px; font-weight: 800;
  color: color-mix(in srgb, #C2361F, #fff var(--s4-lift, 0%)); letter-spacing: .02em; }
.v3-pg .v3-pd-tag i, .v3-pg .v3-pd-tag svg { width: 15px; height: 15px; }
.v3-pg .v3-pd-line { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; }
.v3-pg .v3-pd-now { font: 700 clamp(32px, 3.4vw, 42px)/1.05 var(--v3-f-head); color: var(--v3-ink); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.v3-pg .v3-pd-now.v3-pd-cons { font-size: clamp(24px, 2.4vw, 30px); }
.v3-pg .v3-pd-was { font-size: 16px; color: var(--v3-muted); text-decoration: line-through; }
.v3-pg .v3-pd-off { padding: 3px 9px; border-radius: 8px; background: var(--v3-coral-50); color: color-mix(in srgb, #B42318, #fff var(--s4-lift, 0%)); font-weight: 800; font-size: 13px; }
.v3-pg .v3-pd-tax { margin-top: 6px; font-size: 13px; color: var(--v3-muted); }

.v3-pg .v3-pd-stock { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; margin: 16px 0 0; padding: 10px 12px;
  border-radius: var(--v3-r-sm); font-size: 14px; font-weight: 700; }
.v3-pg .v3-pd-stock b { font-weight: 500; }
.v3-pg .v3-pd-stock.ok { background: var(--v3-green-50); color: color-mix(in srgb, #00603E, #fff var(--s4-lift, 0%)); }
.v3-pg .v3-pd-stock.ok .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--v3-green); box-shadow: 0 0 0 3px rgba(0,168,107,.2); }
.v3-pg .v3-pd-stock.no { background: color-mix(in srgb, #FFF6E6 var(--s4-mixp, 100%), var(--s4-surface, #fff)); color: color-mix(in srgb, #8A4B00, #fff var(--s4-lift, 0%)); }
.v3-pg .v3-pd-stock.no i, .v3-pg .v3-pd-stock.no svg { width: 16px; height: 16px; }

.v3-pg .v3-pd-qty { display: flex; align-items: center; gap: 12px; margin-top: 18px; flex-wrap: wrap; }
.v3-pg .v3-pd-qlbl { font-size: 14px; font-weight: 700; color: var(--v3-ink-2); }
.v3-pg .v3-pd-qmax { font-size: 12.5px; color: var(--v3-muted); }
.v3-pg .v3-stepper { display: inline-flex; align-items: center; height: 46px; border-radius: 12px; border: 1.5px solid var(--v3-line-2); background: var(--s4-surface, #fff); }
.v3-pg .v3-stepper button { width: 44px; height: 100%; border: 0; background: transparent; color: var(--v3-ink); cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; transition: background .15s, color .15s; }
.v3-pg .v3-stepper button:hover { background: var(--v3-bg-2); color: var(--v3-green-d); }
.v3-pg .v3-stepper button i, .v3-pg .v3-stepper button svg { width: 17px; height: 17px; }
.v3-pg .v3-stepper #qty { min-width: 40px; text-align: center; font: 700 16px var(--v3-f-body); font-variant-numeric: tabular-nums; }

.v3-pg .v3-pd-acts { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; margin-top: 18px; }
.v3-pg .v3-pd-acts .btn { justify-content: center; height: 52px; padding: 0 16px; font-size: 15.5px; }
.v3-pg .v3-pd-comprar { grid-column: 1 / -1; }
.v3-pg .v3-pd-agregar { border-width: 1.5px; }
.v3-pg .btn-asesor.v3-pd-asesor { justify-content: center; height: 52px; padding: 0 16px; border-radius: 12px; font: 700 14.5px var(--v3-f-body);
  color: var(--v3-blue-d); background: var(--v3-blue-50); border: 1.5px solid #C9DCFB; cursor: pointer; }
.v3-pg .btn-asesor.v3-pd-asesor:hover { background: color-mix(in srgb, #DCEAFD var(--s4-mixp, 100%), var(--s4-surface, #fff)); border-color: #93B8F5; transform: none; }
.v3-pg .btn-asesor.v3-pd-asesor.v3-solo { grid-column: 1 / -1; color: #fff; background: var(--v3-green); border-color: var(--v3-green); }
.v3-pg .btn-asesor.v3-pd-asesor.v3-solo:hover { background: #00744D; }

/* Bloques de confianza */
.v3-pg .v3-pd-trust { list-style: none; margin: 16px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.v3-pg .v3-pd-trust li { display: flex; align-items: center; gap: 12px; padding: 12px 14px; min-width: 0;
  border-radius: var(--v3-r); background: var(--s4-surface, #fff); border: 1px solid var(--v3-line); }
.v3-pg .v3-pd-trust .ti { width: 38px; height: 38px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.v3-pg .v3-pd-trust .ti i, .v3-pg .v3-pd-trust .ti svg { width: 19px; height: 19px; }
.v3-pg .v3-pd-trust .t-g { background: var(--v3-green-50); color: var(--v3-green-d); }
.v3-pg .v3-pd-trust .t-b { background: var(--v3-blue-50); color: var(--v3-blue-d); }
.v3-pg .v3-pd-trust b { display: block; font-size: 13.5px; color: var(--v3-ink); line-height: 1.3; }
.v3-pg .v3-pd-trust small { display: block; font-size: 12.5px; color: var(--v3-muted); line-height: 1.35; }
.v3-pg .v3-pd-trust li > span:last-child { min-width: 0; }

/* Descripción y detalles */
.v3-pg .v3-pd-box { margin-top: 16px; padding: 18px 20px; border-radius: var(--v3-r-lg); background: var(--s4-surface, #fff); border: 1px solid var(--v3-line); }
.v3-pg .v3-pd-box h2 { font-size: 16px; margin: 0 0 10px; letter-spacing: -.01em; }
.v3-pg .v3-pd-desc { margin: 0; color: var(--v3-ink-2); line-height: 1.65; white-space: pre-line; }
.v3-pg .v3-pd-dl { margin: 0; display: grid; }
.v3-pg .v3-pd-dl > div { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 12px; padding: 9px 0; border-top: 1px solid var(--v3-line); }
.v3-pg .v3-pd-dl > div:first-child { border-top: 0; padding-top: 0; }
.v3-pg .v3-pd-dl dt { font-size: 13.5px; color: var(--v3-muted); }
.v3-pg .v3-pd-dl dd { margin: 0; font-size: 14px; font-weight: 600; color: var(--v3-ink); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }

/* Puente B2B */
.v3-pg .v3-pd-b2b { display: flex; align-items: center; gap: 14px; margin-top: 16px; padding: 16px 18px; border-radius: var(--v3-r-lg);
  background: var(--s4-band, #0B1B2E); color: #fff; text-decoration: none; transition: background .2s; }
.v3-pg .v3-pd-b2b:hover { background: #18304F; color: #fff; }
.v3-pg .v3-pd-b2b-ic { width: 42px; height: 42px; border-radius: 12px; background: rgba(110,231,183,.14); color: #6EE7B7;
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.v3-pg .v3-pd-b2b-ic i, .v3-pg .v3-pd-b2b-ic svg { width: 20px; height: 20px; }
.v3-pg .v3-pd-b2b > span:nth-child(2) { flex: 1; min-width: 0; }
.v3-pg .v3-pd-b2b b { display: block; font-size: 14.5px; color: #fff; }
.v3-pg .v3-pd-b2b small { display: block; font-size: 13px; color: #C9D6E6; }
.v3-pg .v3-pd-b2b > i, .v3-pg .v3-pd-b2b > svg { width: 18px; height: 18px; color: #6EE7B7; flex-shrink: 0; transition: transform .2s; }
.v3-pg .v3-pd-b2b:hover > svg { transform: translateX(3px); }

/* Relacionados */
.v3-pg .v3-rel { padding: 26px 0 64px; margin-bottom: -40px; border-top: 1px solid var(--v3-line); background: var(--s4-surface, #fff); }
.v3-pg .v3-rel .v3-sec-head p:empty { display: none; }

@media (max-width: 1000px) { .v3-pg .v3-pd-gal { top: 124px; } .v3-pg .v3-pd-grid{ gap: 28px; } }
@media (max-width: 820px) {
  .v3-pg .v3-pd-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .v3-pg .v3-pd-gal { position: static; max-width: 560px; width: 100%; margin: 0 auto; }
}
@media (max-width: 520px) {
  .v3-pg .v3-pd-sec { padding-top: 14px; }
  .v3-pg .v3-crumbs span { max-width: 22ch; }
  .v3-pg .pd-foto img { padding: 20px; }
  .v3-pg .v3-pd-buy { padding: 16px; }
  .v3-pg .v3-pd-acts { grid-template-columns: minmax(0, 1fr); }
  .v3-pg .v3-pd-trust { grid-template-columns: minmax(0, 1fr); }
  .v3-pg .v3-pd-dl > div { grid-template-columns: 96px minmax(0, 1fr); }
  .v3-pg .v3-pd-b2b { align-items: flex-start; }
}

/* ═══ Novedades ═══════════════════════════════════════════════════════ */
.v3-pg .v3-ph.section-head { text-align: left; max-width: none; margin: 0; }
.v3-pg .v3-nv { padding: 24px 0 64px; }
.v3-pg .v3-nv-bar { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap;
  padding: 10px 12px 10px 16px; background: var(--s4-surface, #fff); border: 1px solid var(--v3-line); border-radius: var(--v3-r); }
.v3-pg .v3-nv-per { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; min-width: 0; }
.v3-pg .v3-nv-lbl { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; color: var(--v3-muted); white-space: nowrap; }
.v3-pg .v3-nv-lbl i, .v3-pg .v3-nv-lbl svg { width: 17px; height: 17px; color: var(--v3-green-d); }

/* Pestañas de período: control segmentado claro */
.v3-pg .nv-ventanas { margin: 0; gap: 2px; padding: 4px; border-radius: 12px; background: var(--v3-bg-2); flex-wrap: nowrap; }
.v3-pg .nv-v { height: 34px; padding: 0 14px; border-radius: 9px; border: 0; background: transparent; color: var(--v3-ink-2);
  font: 600 13.5px var(--v3-f-body); white-space: nowrap; transition: background .15s, color .15s, box-shadow .15s; }
.v3-pg .nv-v:hover { background: rgba(255,255,255,.7); color: var(--v3-ink); border-color: transparent; }
.v3-pg .nv-v.on { background: var(--s4-surface, #fff); color: var(--v3-green-d); font-weight: 800; box-shadow: 0 1px 3px rgba(11,27,46,.12), 0 0 0 1px var(--v3-line); }
.v3-pg .nv-v:focus-visible { outline: 2px solid rgba(0,168,107,.55); outline-offset: 1px; }
.v3-pg .v3-sort { display: inline-flex; align-items: center; gap: 10px; font-size: 13.5px; color: var(--v3-muted); white-space: nowrap; }
.v3-pg .v3-nv-count { margin: 16px 2px 14px; font-size: 14px; color: var(--v3-muted); }
.v3-pg .v3-nv-count:empty { display: none; }
@media (max-width: 680px) {
  .v3-pg .v3-nv-bar { padding: 10px; }
  .v3-pg .v3-nv-per { width: 100%; }
  .v3-pg .v3-nv-lbl { display: none; }
  .v3-pg .nv-ventanas { width: 100%; }
  .v3-pg .nv-v { flex: 1; padding: 0 6px; }
  .v3-pg .v3-sort { width: 100%; justify-content: space-between; }
  .v3-pg .v3-sort select { flex: 1; max-width: 240px; }
}