/* ==========================================================================
   AMARANTHA · ESPECIAL NAVIDAD 2026  ·  amarantha-navidad.css
   Decoración TEMPORAL. Vigencia: hasta el 31/12/2026 23:59 (hora de Venezuela).
   Se apaga sola el 1/1/2027 (ver amarantha-navidad.js → FIN).
   NO toca precios, stock, textos ni catálogo: sólo pinta piezas visuales.
   Paleta: rojo #B3122B · vino #6E0A1A · verde #14532D · oro #D4A62A
   ========================================================================== */

:root{
  --nv-rojo:#B3122B; --nv-vino:#6E0A1A; --nv-rojo-2:#C8102E;
  --nv-oro:#D4A62A;  --nv-oro-claro:#F0D07A;
  --nv-verde:#14532D; --nv-verde-2:#2E7D4F; --nv-verde-3:#0B2B18;
  --nv-crema:#FFF8EF;
}

/* ── 1. FRANJA DE AVISO (arriba de todo, encima de la barra de la tasa) ──── */
.amx-nv-bar{
  position:relative; z-index:60;
  display:flex; align-items:center; justify-content:center;
  gap:.5rem; flex-wrap:wrap;
  background:linear-gradient(92deg,#6E0A1A 0%,#B3122B 22%,#C8102E 50%,#B3122B 78%,#6E0A1A 100%);
  color:#FFF3D6; text-align:center;
  font-family:Jost,Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:.79rem; line-height:1.45; letter-spacing:.08em; text-transform:uppercase;
  padding:.55rem 1rem;
  border-bottom:1.5px solid rgba(212,166,42,.85);
  box-shadow:0 2px 8px rgba(0,0,0,.18), inset 0 -1px 0 rgba(255,255,255,.14);
}
.amx-nv-bar strong{color:#F0D07A; font-weight:700}
.amx-nv-bar .nv-estrella{color:#F0D07A; font-size:.95rem; line-height:1}
.amx-nv-mob{display:none}
@media (max-width:767px){
  .amx-nv-bar{font-size:.7rem; letter-spacing:.04em; padding:.45rem .7rem; gap:.35rem}
  .amx-nv-desk{display:none}
  .amx-nv-mob{display:inline}
}

/* ── 2. CAPA DE DECORACIÓN DENTRO DEL BANNER (recortada por él) ──────────── */
.amx-nv-deco{
  position:absolute; inset:0; z-index:1;
  pointer-events:none; overflow:hidden; border-radius:inherit;
}

/* marco doble dorado */
.amx-nv-marco{
  position:absolute; inset:0; border:2px solid var(--nv-oro);
  border-radius:inherit; box-shadow:inset 0 0 0 1px rgba(240,208,122,.55), inset 0 0 0 8px rgba(255,255,255,.05);
}

/* guirnalda de pino pegada al borde de arriba */
.amx-nv-pino{position:absolute; left:0; top:-2px; width:100%; height:auto; display:block}

/* racimos de bolas grandes en las esquinas */
.amx-nv-racimo{position:absolute; top:0; width:0; height:0}
.amx-nv-racimo.izq{left:12px}
.amx-nv-racimo.der{right:26px}
.amx-nv-bola{
  position:absolute; border-radius:50%;
  background:radial-gradient(circle at 34% 26%, rgba(255,255,255,.85), var(--nv-rojo) 56%, rgba(0,0,0,.28) 100%);
  box-shadow:0 5px 12px rgba(0,0,0,.28);
}
.amx-nv-bola.oro{background:radial-gradient(circle at 34% 26%, #fff6d8, var(--nv-oro) 56%, rgba(0,0,0,.28) 100%)}
/* racimo izquierdo (arriba del rótulo, que empieza más abajo) */
.amx-nv-racimo.izq .b1{left:-20px; top:6px;  width:40px; height:40px}
.amx-nv-racimo.izq .b2{left:10px;  top:24px; width:28px; height:28px}
.amx-nv-racimo.izq .b3{left:-16px; top:38px; width:22px; height:22px}
/* racimo derecho */
.amx-nv-racimo.der .b1{right:-20px; top:6px;  width:46px; height:46px}
.amx-nv-racimo.der .b2{right:12px;  top:30px; width:34px; height:34px}
.amx-nv-racimo.der .b3{right:-12px; top:50px; width:26px; height:26px}

/* bolas colgando del lado derecho (no caen sobre el texto del banner) */
.amx-nv-colgada{position:absolute; top:0; width:0}
.amx-nv-hilo{position:absolute; top:0; width:1.5px;
  background:linear-gradient(rgba(255,255,255,.75), rgba(255,255,255,.2))}
.amx-nv-colgada .amx-nv-bola{box-shadow:0 4px 10px rgba(0,0,0,.32)}

/* lazo rojo con moño dorado */
.amx-nv-lazo{position:absolute; top:-12px; right:18px; width:92px; height:auto}
@media (max-width:767px){ .amx-nv-lazo{width:62px; top:-6px; right:10px} }

/* ramo en L de la esquina inferior izquierda (pino + piñas + bolas) */
.amx-nv-ramo{position:absolute; left:-2px; bottom:-2px; width:100px; height:auto; display:block;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.22))}
@media (max-width:767px){ .amx-nv-ramo{width:66px} }

/* sello dorado */
.amx-nv-sello{
  position:absolute; right:22px; bottom:16px; width:74px; height:74px; border-radius:50%;
  background:radial-gradient(circle at 34% 28%, #f6e0a6, #c9a227 62%, #9a7a15 100%);
  color:#5b4310; display:flex; flex-direction:column; align-items:center; justify-content:center;
  box-shadow:0 6px 16px rgba(0,0,0,.28), inset 0 0 0 2px rgba(255,246,216,.7);
  transform:rotate(-8deg); text-align:center; line-height:1
}
.amx-nv-sello b{font-family:"Playfair Display",Georgia,serif; font-size:13px; letter-spacing:.02em}
.amx-nv-sello span{font-family:Jost,sans-serif; font-size:6.5px; letter-spacing:.22em; margin-top:3px}
@media (max-width:767px){
  .amx-nv-sello{display:none}
  /* en el teléfono el racimo izquierdo tapaba el rótulo NUEVA COLECCIÓN */
  .amx-nv-racimo.izq{display:none}
  .amx-nv-racimo.der{right:18px; transform:scale(.86); transform-origin:top right}
}

/* nieve cayendo de verdad (CSS, sin JavaScript pesado) */
.amx-nv-copo{
  position:absolute; top:-14px; background:#fff; opacity:.85;
  clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.16));
  animation-name:nv-caer; animation-timing-function:linear; animation-iteration-count:infinite;
  will-change:transform;
}
@keyframes nv-caer{
  0%  {transform:translate3d(0,0,0) rotate(0deg)}
  50% {transform:translate3d(var(--nv-x,8px), calc(var(--nv-dist,520px) * .52), 0) rotate(140deg)}
  100%{transform:translate3d(calc(var(--nv-x,8px) * -0.6), var(--nv-dist,520px), 0) rotate(300deg)}
}
.amx-nv-destello{
  position:absolute; background:linear-gradient(#fff6d8,#e8c766);
  clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%);
  filter:drop-shadow(0 0 6px rgba(255,233,174,.75));
}
@media (max-width:767px){ .amx-nv-destello{display:none} }

/* ── 3. CINTA "PARA REGALAR" EN LAS TARJETAS ────────────────────────────── */
.amx-nv-cinta{
  position:absolute; left:0; top:0; width:100%; z-index:3;
  background:linear-gradient(180deg,#C8102E,#9B1026);
  color:#FFEFC9; text-align:center;
  font-family:Jost,Inter,system-ui,sans-serif; font-size:10px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase;
  padding:7px 4px 6px;
  border-bottom:1.5px solid var(--nv-oro);
  box-shadow:0 3px 10px rgba(0,0,0,.22);
  pointer-events:none;
}
@media (max-width:767px){ .amx-nv-cinta{font-size:8.5px; letter-spacing:.1em; padding:5px 2px 4px} }

/* accesibilidad: si la clienta pide menos movimiento, la nieve no cae */
@media (prefers-reduced-motion:reduce){
  .amx-nv-copo{animation:none; opacity:.7}
}