/* Cupón de afiliado (parcial _parciales/cupon.html). Usa los tokens de marca: --gp-night, --gp-brass, --gp-paper, --gp-surface. */
.cupon{--c-fondo:var(--gp-paper);--c-muesca:26px;position:relative;display:grid;grid-template-columns:minmax(150px,30%) 1fr;margin:2.4rem 0;color:var(--gp-ink);text-decoration:none;background:var(--gp-surface);border-radius:var(--gp-radius-m);box-shadow:var(--gp-shadow);transition:transform .18s ease,box-shadow .18s ease;-webkit-tap-highlight-color:transparent}
.cupon:hover{transform:translateY(-2px);box-shadow:0 1px 0 rgba(31,38,34,.05),0 22px 40px -20px rgba(31,61,53,.55)}
.cupon:focus-visible{outline:3px solid var(--gp-brass);outline-offset:4px}
.cupon p{margin:0}
.cupon__talon{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:26px 18px 26px 26px;background:var(--gp-night);color:var(--gp-brass);border-radius:var(--gp-radius-m) 0 0 var(--gp-radius-m);text-align:center;overflow:hidden}
/* borde troquelado del talón */
.cupon__talon::before{content:"";position:absolute;left:0;top:0;bottom:0;width:8px;background:radial-gradient(circle at 0 50%,var(--c-fondo) 5px,transparent 5.5px) 0 0/8px 16px repeat-y}
.cupon__icono{width:46px;height:46px;margin-bottom:4px}
.cupon__importe{font:800 clamp(2.6rem,2rem + 2.6vw,3.6rem)/1 var(--gp-font-display);letter-spacing:-.02em;color:var(--gp-brass)}
.cupon__sub{font:600 var(--gp-fs-label)/1.3 var(--gp-font-text);color:var(--gp-paper);text-transform:uppercase;letter-spacing:.08em}
.cupon__cuerpo{position:relative;display:grid;gap:10px;padding:24px 26px 22px 30px;border-left:2px dashed var(--gp-brass)}
/* muescas redondas donde se corta el cupón */
.cupon__cuerpo::before,.cupon__cuerpo::after{content:"";position:absolute;left:calc(var(--c-muesca) / -2 - 1px);width:var(--c-muesca);height:var(--c-muesca);border-radius:50%;background:var(--c-fondo)}
.cupon__cuerpo::before{top:calc(var(--c-muesca) / -2)}
.cupon__cuerpo::after{bottom:calc(var(--c-muesca) / -2)}
.cupon__intro{font:700 var(--gp-fs-h3)/1.25 var(--gp-font-display);color:var(--gp-night)}
.cupon__texto{color:var(--gp-ink-2)}
.cupon__texto strong{color:var(--gp-ink)}
.cupon__fila{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:4px}
.cupon__codigo{display:inline-flex;align-items:center;gap:.5em;padding:.55em .9em;min-height:48px;box-sizing:border-box;background:var(--gp-paper);border:2px dashed var(--gp-brass-ink);border-radius:var(--gp-radius-s);font:800 1.15rem/1 var(--gp-font-display);letter-spacing:.08em;color:var(--gp-night)}
.cupon__btn{font-weight:700}
.cupon:hover .cupon__btn{background:#DDA94D}
.cupon__nota{font-size:var(--gp-fs-small);color:var(--gp-ink-2)}
@media (max-width:620px){
  .cupon{grid-template-columns:1fr}
  .cupon__talon{flex-direction:row;flex-wrap:wrap;gap:4px 12px;padding:24px 20px 20px;border-radius:var(--gp-radius-m) var(--gp-radius-m) 0 0}
  .cupon__talon::before{left:0;right:0;top:0;bottom:auto;width:auto;height:8px;background:radial-gradient(circle at 50% 0,var(--c-fondo) 5px,transparent 5.5px) 0 0/16px 8px repeat-x}
  .cupon__icono{width:40px;height:40px;margin:0}
  .cupon__sub{flex-basis:100%}
  .cupon__cuerpo{padding:24px 20px 20px;border-left:0;border-top:2px dashed var(--gp-brass)}
  .cupon__cuerpo::before,.cupon__cuerpo::after{top:calc(var(--c-muesca) / -2 - 1px);bottom:auto}
  .cupon__cuerpo::before{left:calc(var(--c-muesca) / -2)}
  .cupon__cuerpo::after{left:auto;right:calc(var(--c-muesca) / -2)}
  .cupon__codigo,.cupon__btn{width:100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){.cupon{transition:none}.cupon:hover{transform:none}}
/* aviso «copiado» */
.cupon-aviso{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));z-index:200;display:flex;align-items:center;gap:.6em;width:max-content;max-width:calc(100vw - 32px);box-sizing:border-box;padding:.85em 1.2em;background:var(--gp-night);color:var(--gp-paper);border-radius:var(--gp-radius-pill);box-shadow:0 18px 40px -16px rgba(0,0,0,.5);font:600 1rem/1.3 var(--gp-font-text);opacity:0;transform:translate(-50%,16px);transition:opacity .2s ease,transform .2s ease;pointer-events:none}
.cupon-aviso.is-on{opacity:1;transform:translate(-50%,0)}
.cupon-aviso::before{content:"✓";display:inline-grid;place-items:center;width:1.5em;height:1.5em;flex:none;border-radius:50%;background:var(--gp-brass);color:var(--gp-ink);font-weight:800}
