/* ══════════════════════════════════════════════════════════════════════════
   KORA · TARJETAS NAVIDEÑAS Y PRINTS — 18 oct 2026 (js/kora-tarjetas.js)
   La repisa como la de AU: cada tarjeta parada sobre el gris de la casa, el
   nombre y su línea debajo. Las tarjetas son 5 × 7 y van en papel hueso.
   ══════════════════════════════════════════════════════════════════════════ */
.tj-scope .nhv-wrap{ text-align:left }
.tj-head{ max-width:720px; margin:34px 0 8px }
.tj-kick{ margin:0 0 6px; font-family:'Jost',sans-serif; font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:#79746D }
.tj-h1{ margin:0 0 10px; font-family:var(--font-display); font-weight:400; font-size:clamp(34px,4vw,48px); line-height:1.05; color:#1F1D1B }
.tj-lede{ margin:0 0 18px; font-family:var(--font-display); font-size:18px; line-height:1.5; color:#46423D }
.tj-cta{ display:inline-block; background:#1F1D1B; color:#FBFAF7; text-decoration:none; font-family:'Jost',sans-serif; font-weight:600; font-size:14px; letter-spacing:.04em; padding:10px 22px; border-radius:4px }
.tj-cta:hover{ background:#000 }
.tj-cta-claro{ background:none; color:#1F1D1B; padding:0 0 3px; border-radius:0; border-bottom:1px solid currentColor; font-size:12px; letter-spacing:.16em; text-transform:uppercase }
.tj-cta-claro:hover{ background:none; color:#4C6657 }
.tj-scope .au-sec{ margin-top:46px }

/* Los diseños */
.tj-row{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px 18px }
.tj-item{ text-align:center }
.tj-box{ display:flex; align-items:center; justify-content:center; aspect-ratio:1/1.05; background:#EFEDE9; transition:filter .22s ease }
.tj-item:hover .tj-box{ filter:brightness(.95) }
.tj-n{ margin:14px 0 2px; font-family:'Jost',sans-serif; font-size:15px; color:#1F1D1B }
.tj-d{ margin:0 auto; max-width:30ch; font-family:var(--font-display); font-size:15px; line-height:1.4; color:#46423D }
.tj-pr{ margin:6px 0 0; font-family:'Jost',sans-serif; font-size:12.5px; letter-spacing:.04em; color:#79746D }

/* La tarjeta. `container-type:size` + cqmin: las medidas salen del lado
   corto, así el mismo diseño sirve parado (17:22) y acostado (22:17).
   20 oct, noche · Vivi: «yo las estoy haciendo en 12 × 16 cm… vamos a dejar
   sólo este tamaño»: 3:4 (antes 5:7). 21 oct · «mejor 8.5 × 11 cm»: 17:22. */
.tj-card{
  /* 21 oct, noche · Vivi: las de fondo «blanco» en realidad van en hueso, todas el mismo */
  position:relative; width:62%; aspect-ratio:17/22; background:#F6F1E7; container-type:size;
  box-shadow:0 1px 0 rgba(0,0,0,.04), 0 18px 26px -18px rgba(44,37,32,.55);
}
.tj-card.tj-h{ width:86%; aspect-ratio:22/17 }
.tj-in{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; box-sizing:border-box }
/* 20 oct, después · Vivi: «hay que quitarles el fondo a las ilustraciones
   (igual que lo hacemos en los libros) para que se fundan bien a cualquier
   diseño». La pintura ya llega sin papel (acuarela-status.js le quita el
   blanco, como en los libros); aquí el hueco ya no pone su beige detrás, la
   pintura va COMPLETA (contain: con la pintura cuadrada en huecos de varias
   formas, `cover` cortaba a quien estuviera en la orilla) y se funde con el
   papel de cada diseño (multiply: lo blanco de una muestra se vuelve papel).
   La foto sin pintar (.tj-cruda) sí llena su hueco, como antes. */
.tj-foto{ display:block; position:relative; overflow:hidden; background:transparent; flex:1 1 auto; min-height:0; width:100% }
.tj-foto img{ width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; display:block }
.tj-cruda .tj-foto{ background:#EDE8DF }
.tj-cruda .tj-foto img{ object-fit:cover; mix-blend-mode:normal }

/* Feliz Navidad, a mano — el «Penciled In» */
/* 21 oct · Vivi: la imprenta dice que un marco recto en la orilla delata
   cualquier corte movido: «diseños menos chismosos que luzcan al máximo las
   ilustraciones». Sin marco; el texto sube y se compacta, la ilustración crece. */
.tj-mano{ padding:7cqmin 5cqmin 7cqmin }
/* 20 oct, después · Vivi: «el "Feliz Navidad" recto, no en diagonal». Centrado
   arriba de la ilustración, sin encimarse. */
.tj-mano-t{ position:relative; z-index:1; font-family:'Caveat',cursive; font-weight:600; font-size:14cqmin; line-height:.9; color:#B3261E; margin:0 0 1cqmin; align-self:center; text-align:center; white-space:nowrap }
.tj-mano .tj-foto{ width:100% }   /* 20 oct · Vivi: la imagen más grande */
.tj-h .tj-mano-t{ font-size:14cqmin; white-space:nowrap }   /* 20 oct · Vivi: «más chico» (era 24 y 20) */
.tj-firma{ margin-top:2cqmin; font-family:'Jost',sans-serif; font-size:6cqmin; letter-spacing:.24em; color:#B3261E; text-transform:uppercase }
/* Y el apellido largo («Los Zambrano Ortiz») cabe: con más de 16 letras baja un
   paso y aprieta el espacio; con más de 24, otro, y puede ir en dos renglones.
   La clase la pone tarjeta() (kora-tarjetas.js) según el largo de la firma; vale
   para las firmas en mayúsculas espaciadas de todos los diseños. */
.tj-l1 .tj-firma{ font-size:5cqmin; letter-spacing:.16em }
.tj-l2 .tj-firma{ font-size:4.2cqmin; letter-spacing:.12em; text-align:center; line-height:1.3 }
.tj-l1 .tj-abajo{ letter-spacing:.12em }
.tj-l2 .tj-abajo{ letter-spacing:.08em; font-size:3.6cqmin }
.tj-l2 .tj-pie i{ white-space:normal }

/* Saludo sencillo — el «Minimal Greeting» */
/* 20 oct · Vivi: «en esta tarjeta deben ir los nombres un renglón abajo del título». */
.tj-pie{ display:flex; flex-direction:column; align-items:flex-start; gap:1.6cqmin; width:100%; box-sizing:border-box; padding:5.5cqmin 8cqmin 6.5cqmin }
.tj-pie i{ font-family:var(--font-display); font-style:normal; white-space:nowrap; font-size:9.5cqmin; line-height:1; color:#1F1D1B }
.tj-pie b{ font-family:'Jost',sans-serif; font-weight:400; text-align:left; max-width:100%; line-height:1.3; font-size:4.4cqmin; letter-spacing:.06em; color:#79746D; text-transform:uppercase }

/* Marco antiguo — el «Vintage Frame» */
/* 21 oct · Vivi: «mejor que sea un marco hasta la orilla, todo en color vino»
   (la referencia «'Tis the Season»): el vino llega al corte —si se recorre, no
   se nota— y la ilustración va en su marco blanco; las letras, chicas y claras. */
.tj-antigua{ padding:8cqmin 9cqmin 8cqmin; justify-content:space-between; background:#5B1E28 }
.tj-ant-fondo{ position:absolute; inset:0; z-index:0 }   /* el color elegido (COLORES_MARCO) */
.tj-antigua > *:not(.tj-ant-fondo){ position:relative; z-index:1 }
/* 21 oct, noche · como la referencia vino de Vivi: letras gruesas y blancas, y la
   ilustración en un paspartú crema con su marco interior (beige; vino si el fondo es arena) */
.tj-antigua .tj-arriba, .tj-antigua .tj-abajo{ color:#FFFFFF; font-weight:600; letter-spacing:.14em }
.tj-antigua .tj-arriba{ font-size:5.6cqmin; line-height:1.3; padding:0 14cqmin }
.tj-antigua .tj-abajo{ font-size:3.6cqmin }
.tj-ant-marco{ display:flex; flex:none; width:80cqmin; aspect-ratio:1; margin:5cqmin 0; box-sizing:border-box; border:2cqmin solid #9A8A78; background:#F6F1E7; padding:7.5cqmin }   /* cuadrado, como la foto */
.tj-ant-marco .tj-foto{ height:100% }
.tj-arriba, .tj-abajo{ text-transform:uppercase; font-family:'Jost',sans-serif; font-size:4.8cqmin; line-height:1.4; letter-spacing:.24em; color:#C0392B; text-align:center }

/* Línea ondulada — el «Wavy Line». 20 oct: la onda es el marco de toda la
   tarjeta, pegada a la orilla, y envuelve la foto y el saludo. */
/* 20 oct, noche · como la referencia de Vivi */


.tj-ray-f{ margin-top:5cqmin }

/* Rayas de colores — los estampados de papelería */
.tj-colores{ padding:8cqmin 8cqmin 22cqmin; background:repeating-linear-gradient(90deg, #8E2B25 0 4cqmin, #F4ECDD 4cqmin 6cqmin, #7E8B5B 6cqmin 10cqmin, #F4ECDD 10cqmin 12cqmin, #9DB2C9 12cqmin 16cqmin, #F4ECDD 16cqmin 18cqmin, #C98B92 18cqmin 22cqmin, #F4ECDD 22cqmin 24cqmin) }
/* (Rayas de colores se fue el 21 oct: la reemplazó Doble saludo.) */
.tj-colores .tj-foto img{ mix-blend-mode:normal }   /* 21 oct · Vivi: sin el fondo crema; la ilustración, directo sobre las rayas */
/* 21 oct · «abajo hacer el cuadro más horizontal y menos alto, para que quepa
   todo en 2 renglones: arriba MERRY CHRISTMAS y abajo de parte de quién» */
.tj-eti{ position:absolute; left:50%; bottom:6cqmin; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:.6cqmin;
  width:80%; box-sizing:border-box; padding:2.4cqmin 4cqmin; background:#F4ECDD; border-radius:2cqmin; box-shadow:inset 0 0 0 .8cqmin #F4ECDD, inset 0 0 0 1.1cqmin #8E2B25; white-space:nowrap; text-align:center }
.tj-eti i{ font-family:var(--font-display); font-style:normal; font-size:5.6cqmin; line-height:1.05; letter-spacing:.14em; text-transform:uppercase; color:#8E2B25 }
.tj-eti b{ font-family:var(--font-display); font-weight:400; font-size:4.8cqmin; line-height:1.1; color:#3A2A26; overflow:hidden; text-overflow:ellipsis; max-width:100% }


/* ══ 20 oct, después · Cuatro diseños más ══════════════════════════════════ */
/* Moño rojo — como la referencia: título chiquito, el moño sobre la foto, «con cariño» a mano */
.tj-mono{ padding:14cqmin 10cqmin 8cqmin; justify-content:center; background:#F6F1E7 }
.tj-mono-t{ font-family:var(--font-display); font-size:4.6cqmin; letter-spacing:.06em; color:#1F1D1B; margin-top:6cqmin }
.tj-mono-ar{ position:relative; flex:none; width:82%; aspect-ratio:1; display:flex }   /* cuadrado, como la foto */
.tj-mono-lazo{ position:absolute; left:50%; top:-8cqmin; width:78%; transform:translateX(-50%); z-index:2; pointer-events:none }
.tj-mono .tj-foto img{ object-position:center top }   /* la ilustración arriba de su hueco: el moño se apoya en su orilla */
.tj-mono-c{ margin-top:3cqmin; font-family:'Caveat',cursive; font-weight:600; font-size:8cqmin; line-height:1; color:#B3261E }
.tj-mono-f{ margin-top:1cqmin; font-family:var(--font-display); font-size:4.4cqmin; letter-spacing:.04em; color:#1F1D1B; text-align:center }
/* Guirnalda de luces — la guirnalda ya pintada, cruzando arriba */
.tj-luces{ padding:31cqmin 10cqmin 9cqmin }
.tj-luces-g{ position:absolute; left:3cqmin; right:3cqmin; top:3cqmin; width:calc(100% - 6cqmin); z-index:2; pointer-events:none }
.tj-luces .tj-foto{ width:86% }
.tj-luces-t{ margin-top:5cqmin; font-family:var(--font-display); font-size:6cqmin; letter-spacing:.18em; text-transform:uppercase; color:#2E3A2C; text-align:center }
.tj-luces-f{ margin-top:1.6cqmin; font-family:'Jost',sans-serif; font-size:3.8cqmin; letter-spacing:.2em; text-transform:uppercase; color:#79746D; text-align:center }
.tj-l1 .tj-mono-f, .tj-l1 .tj-luces-f{ letter-spacing:.1em }
.tj-l2 .tj-luces-f{ letter-spacing:.06em; font-size:3.4cqmin }

/* El reverso */
.tj-rev{ justify-content:center; padding:14cqmin 13cqmin 10cqmin; text-align:center }
.tj-rev-m{ font-family:var(--font-display); font-size:6.4cqmin; line-height:1.45; color:#2E2A26; max-width:100%; overflow-wrap:anywhere }
.tj-rev-m em{ color:#A39D94 }
.tj-rev-f{ margin-top:5cqmin; font-family:'Caveat',cursive; font-size:9cqmin; color:#A3262A }
.tj-rev-a{ margin-top:5cqmin; font-family:'Jost',sans-serif; font-size:3.6cqmin; letter-spacing:.22em; text-transform:uppercase; color:#79746D }
.tj-rev-k{ position:absolute; bottom:6cqmin; left:0; right:0; font-family:var(--font-libro, 'EB Garamond'),serif; font-size:3.8cqmin; letter-spacing:.4em; color:#A39D94 }

/* Los tres estilos */
.tj-est{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; text-align:center }
.tj-est-art{ display:flex; align-items:center; justify-content:center; aspect-ratio:4/3; background:#EFEDE9; overflow:hidden }
.tj-est-art img{ max-width:72%; max-height:84%; display:block }

/* Hazla navideña — la banda, como las de la casa */
.tj-banda{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); margin:64px calc(50% - 50vw) 0; min-height:clamp(380px,48vh,500px) }
.tj-banda-foto{ position:relative; background:#E9E4DA }
.tj-banda-foto img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover }
.tj-banda-txt{ background:#3E4634; color:#F3EEE3; padding:clamp(28px,4vw,64px); display:flex; flex-direction:column; justify-content:center }
.tj-banda-txt .tj-kick{ color:#D9C9A3 }
.tj-banda-h{ margin:0 0 12px; font-family:var(--font-display); font-weight:400; font-size:clamp(26px,2.8vw,36px); line-height:1.1; color:#FBF7EF }
.tj-banda-p{ margin:0 0 14px; font-family:var(--font-display); font-size:17px; line-height:1.5; max-width:46ch }
.tj-banda-txt .tj-banda-p{ color:#E9E1CF }
.tj-banda-l{ margin:0; padding:0; list-style:none; font-family:'Jost',sans-serif; font-size:14.5px; line-height:1.7; color:#E9E1CF }
.tj-banda-l li::before{ content:'✦'; margin-right:8px; color:#D9C9A3 }
.tj-banda-l b{ color:#FBF7EF; font-weight:500 }

/* Prints */
.tj-print{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:40px; align-items:center }
.tj-print-art{ display:flex; aspect-ratio:4/3 }

/* El print enmarcado: pared, marco de madera oscura, paspartú con su
   biselado y la ilustración en papel. Todo en % para servir en cualquier
   tamaño (la página de tarjetas, la guía de regalos de Navidad). */
.kp-pared{ position:relative; display:flex; align-items:center; justify-content:center; width:100%; height:100%;
  background:radial-gradient(120% 90% at 50% 18%, #F1ECE3 0%, #E6DFD3 58%, #DCD4C6 100%) }
.kp-marco{ position:relative; display:block; width:52%; aspect-ratio:4/5; padding:1.3%;   /* 18 oct · Vivi: «mucho más delgadito» */ box-sizing:border-box;
  background:linear-gradient(140deg, #4A3F37 0%, #2E2621 45%, #241D19 100%);
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.14), inset -1px -1px 0 rgba(0,0,0,.5),
             0 1px 2px rgba(30,24,20,.25), 0 16px 26px -10px rgba(30,24,20,.5), 0 34px 50px -26px rgba(30,24,20,.45) }
.kp-paspartu{ display:block; width:100%; height:100%; box-sizing:border-box; padding:14%; background:#FBF9F4;
  box-shadow:inset 2px 2px 4px rgba(0,0,0,.28), inset -1px -1px 1px rgba(255,255,255,.6) }
.kp-arte{ display:block; width:100%; height:100%; background:#fff;
  box-shadow:0 0 0 1.5px #EEE8DC, 0 0 0 2.5px #D9D1C2, -1px -1px 2px 2px rgba(0,0,0,.08) }
.kp-arte img{ width:100%; height:100%; object-fit:cover; display:block }
.tj-print-txt .tj-banda-p{ color:#46423D }

@media (max-width:1080px){ .tj-row{ grid-template-columns:repeat(2,minmax(0,1fr)) } }
@media (max-width:820px){
  .tj-row, .tj-est{ grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:78%; overflow-x:auto; scroll-snap-type:x proximity; scrollbar-width:none }
  .tj-row::-webkit-scrollbar, .tj-est::-webkit-scrollbar{ display:none }
  .tj-item, .tj-est-t{ scroll-snap-align:start }
  .tj-banda{ grid-template-columns:1fr; min-height:0 }
  .tj-banda-foto{ height:68vw }
  .tj-print{ grid-template-columns:1fr; gap:18px }
}

/* 20 oct, después · Los diseños por estilo: cada grupo con su nombre y una línea */
.tj-grupo h2{ margin-bottom:4px }
.tj-grupo-d{ margin:0 0 18px; font-family:var(--font-display); font-size:16px; color:#5F5A53 }
.tj-g{ margin:2px 0 0; font-family:'Jost',sans-serif; font-size:12px; letter-spacing:.06em; color:#A3262A }
.tj-row .tj-item{ align-self:start }   /* la línea «Con gorros de Santa» no sube la tarjeta de su vecina */

/* 20 oct, después · Esfera (trazo) — la ilustración dentro de una esfera colgada */
.tj-esfera{ padding:calc(100cqmin * 1460 / 1500) 8cqmin 4cqmin; background:#F6F1E7 url('../img/tarjetas/esfera-fondo.webp') 0 0 / 100% auto no-repeat; background-blend-mode:multiply }   /* a lo ancho: la esfera sigue redonda */   /* 20 oct · la plantilla de Vivi, tal cual */
/* el círculo de la plantilla: centro (754, 899) y radio 541 en su lienzo de 1500 × 2000 */
.tj-esf-bola{ position:absolute; left:calc(100cqmin * 213 / 1500); top:calc(100cqmin * 358 / 1500); width:calc(100cqmin * 1082 / 1500); aspect-ratio:1/1; border-radius:50%; overflow:hidden; background:#F6F1E7; z-index:1 }
.tj-esf-bola .tj-foto{ position:absolute; inset:0; height:100%; border-radius:50% }
.tj-esf-bola .tj-foto img{ object-fit:cover }   /* la esfera se llena: sólo se van las esquinas */
.tj-esf-lazo{ position:absolute; left:0; top:0; width:100%; height:auto; z-index:2; pointer-events:none }   /* el moño, encima */
.tj-esf-t{ margin-top:2.5cqmin; font-family:'Caveat',cursive; font-weight:500; font-size:12cqmin; line-height:1; color:#2E2B28; white-space:nowrap }
.tj-esf-s{ margin-top:1.6cqmin; font-family:'Jost',sans-serif; font-size:3.6cqmin; letter-spacing:.2em; text-transform:uppercase; color:#2E2B28 }
.tj-esf-f{ margin-top:2.5cqmin; font-family:'Jost',sans-serif; font-size:5cqmin; letter-spacing:.14em; color:#2E2B28; text-align:center }
.tj-l1 .tj-esf-f{ font-size:4.4cqmin; letter-spacing:.08em }
.tj-l2 .tj-esf-f{ font-size:3.8cqmin; letter-spacing:.04em }


/* Marco con moño (acuarela) — marco trazado a mano en terracota, moño de línea, nombres al pie */
.tj-manomono{ padding:12cqmin 11cqmin 10cqmin; background:#F6F1E7 }
.tj-mm-t{ font-family:'Caveat',cursive; font-weight:500; font-size:11cqmin; line-height:1; color:#2E2B28; margin-bottom:4.5cqmin; white-space:nowrap }
.tj-mm-ar{ position:relative; flex:1 1 auto; min-height:0; width:100%; display:flex; box-sizing:border-box; padding:4.5cqmin }
.tj-mm-ar .tj-foto{ border-radius:1.5cqmin }
.tj-mm-m{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none }
.tj-mm-m path, .tj-mm-lazo path{ fill:none; stroke:#B5603F; stroke-width:.9cqmin; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke }
.tj-mm-lazo{ position:absolute; left:50%; bottom:-5.6cqmin; width:18cqmin; transform:translateX(-50%); overflow:visible }
.tj-mm-f{ align-self:flex-end; margin-top:5cqmin; font-family:'Jost',sans-serif; font-size:4.4cqmin; letter-spacing:.2em; text-transform:uppercase; color:#2E2B28; text-align:right; max-width:60% }
.tj-l1 .tj-mm-f{ letter-spacing:.12em; font-size:4cqmin } .tj-l2 .tj-mm-f{ letter-spacing:.06em; font-size:3.6cqmin }

/* 20 oct · El texto que se acomoda a mano (kora-tarjetas.js, texto()): su escala
   y su alineación. Alinear estira su renglón a todo lo ancho. */
.tj-tx{ font-size:calc(var(--tx-e, 1) * 1em); white-space:normal; text-wrap:balance }
.tj-tx[data-al]{ display:block }
.tj-tx[data-al="i"]{ text-align:left } .tj-tx[data-al="c"]{ text-align:center } .tj-tx[data-al="d"]{ text-align:right }
.tj-in :has(> .tj-tx[data-al]){ align-self:stretch; justify-self:stretch; width:auto; max-width:none; display:block }
.tj-tx[data-f="g"]{ font-family:var(--font-libro, 'EB Garamond'),serif; font-weight:500 }
.tj-tx[data-f="j"]{ font-family:'Jost',sans-serif; font-weight:400 }
.tj-tx[data-f="c"]{ font-family:'Caveat',cursive; font-weight:600; text-transform:none; letter-spacing:.01em }
.tj-tx[data-f="l"]{ font-family:'Londrina Solid',sans-serif; font-weight:400 }

/* Doble saludo (painterly) — 21 oct, la referencia «Double the Merry» */
.tj-doble{ padding:0; background:#F6F1E7 }
.tj-doble .tj-foto{ position:absolute; left:8cqmin; top:15cqmin; width:68cqmin; height:66cqmin; flex:none }
/* 21 oct, noche · Vivi: «el rojo más quemado y otro font menos delgadito, si no no se va a ver en la impresión»:
   rojo quemado, la Bodoni más gruesa y sin el óptico de display (que adelgaza los filetes) */
.tj-db-1, .tj-db-t{ position:absolute; z-index:2; font-family:'Bodoni Moda','Didot',var(--font-display),serif; font-weight:700; font-optical-sizing:none; font-variation-settings:'opsz' 11; color:#9E2A22; line-height:.9; letter-spacing:-.01em }
.tj-db-1{ right:7cqmin; top:5cqmin; font-size:15cqmin; pointer-events:none; white-space:nowrap }
.tj-db-t{ left:7cqmin; top:72cqmin; width:84cqmin; font-size:14cqmin; text-align:left }
.tj-db-f{ position:absolute; right:7cqmin; bottom:8cqmin; z-index:2; max-width:40cqmin; font-family:'Caveat',cursive; font-size:7cqmin; line-height:1; color:#2E2B28; text-align:right; transform:rotate(-4deg) }

/* 21 oct, noche · Saludo sencillo: la ilustración un poco más chica, con poquito
   blanco alrededor, para que el corte no se la coma */
.tj-sencilla{ padding:6cqmin 6cqmin 0 }
.tj-sencilla .tj-pie{ padding-left:2cqmin; padding-right:2cqmin }

/* Onda vino y Destellos (21 oct, plantillas de Vivi) */
.tj-onda{ padding:0; background:#F6F1E7 }
.tj-on-m{ position:absolute; inset:0; width:100%; height:100%; z-index:2; pointer-events:none }
.tj-onda .tj-foto{ position:absolute; left:15cqmin; top:29cqmin; width:70cqmin; height:70cqmin; flex:none }
/* 21 oct, noche · Vivi: «Feliz Navidad» arriba, en negro y en Jost gruesa */
.tj-on-t{ position:absolute; left:14cqmin; right:14cqmin; top:16cqmin; z-index:3; font-family:'Jost',sans-serif; font-weight:600; font-size:6cqmin; line-height:1.2; letter-spacing:.14em; text-transform:uppercase; color:#1F1D1B; text-align:center }
.tj-on-f{ position:absolute; left:14cqmin; right:14cqmin; top:107cqmin; z-index:3; font-family:'Jost',sans-serif; font-size:3.6cqmin; letter-spacing:.06em; text-transform:uppercase; color:#1F1D1B; text-align:center }
.tj-destellos{ padding:0; background:#F6F1E7 }
.tj-destellos .tj-foto{ position:absolute; left:12.7cqmin; top:16cqmin; width:75cqmin; height:74cqmin; flex:none }
.tj-de-m{ position:absolute; left:0; top:5cqmin; width:100%; height:100%; z-index:2; pointer-events:none }
.tj-de-t{ position:absolute; left:6cqmin; right:6cqmin; top:91cqmin; z-index:3; font-family:'Mrs Saint Delafield','Caveat',cursive; font-size:17cqmin; line-height:.82; color:#92192C; text-align:center }
.tj-de-f{ position:absolute; left:12cqmin; right:12cqmin; top:121.5cqmin; z-index:3; font-family:'Jost',sans-serif; font-size:3.6cqmin; letter-spacing:.06em; text-transform:uppercase; color:#1F1D1B; text-align:center }

/* 21 oct, noche · Salvia (en lugar de Ondas verdes): fondo salvia a sangre, la
   tarjeta crema con su filo oscuro, el saludo a mano y la firma en mayúsculas. */
.tj-salvia{ padding:12cqmin 12.5cqmin; background:#6B6E5E }
.tj-sa-in{ display:flex; flex-direction:column; align-items:center; flex:1 1 auto; width:100%; min-height:0; box-sizing:border-box; background:#F6F1E7; border:.9cqmin solid #2F2F2C; padding:6cqmin 8cqmin 4.5cqmin }
.tj-sa-t{ font-family:'Homemade Apple',cursive; font-size:8.6cqmin; line-height:1.45; color:#2F2F2C; text-align:center; padding:0 2cqmin; margin-bottom:3cqmin }
.tj-sa-f{ margin-top:4cqmin; font-family:'Jost',sans-serif; font-size:3.6cqmin; letter-spacing:.12em; text-transform:uppercase; color:#2F2F2C; text-align:center }
.tj-l1 .tj-sa-f{ letter-spacing:.08em } .tj-l2 .tj-sa-f{ letter-spacing:.04em; font-size:3.2cqmin }

/* 21 oct, noche · Vivi: «la textura tipo lino / papel texturizado por encima de
   todo para ver más real cómo se vería impresa». Sólo en la pantalla: el pliego
   para imprimir (kora-pliego-tarjetas.css) la apaga. */
.tj-card::after{ content:''; position:absolute; inset:0; z-index:20; pointer-events:none;
  /* 21 oct, noche · «por encima de todo, incluido texto, ilustraciones»: gris medio en
     «overlay», que se ve igual sobre el hueso, la ilustración, las letras y los fondos oscuros */
  background:url('../img/tarjetas/papel-lino.webp') 0 0 / 34cqmin auto repeat; mix-blend-mode:overlay; opacity:.45 }

/* 21 oct, noche · Vivi: la marca de agua «KORA · muestra» sobre la ilustración, sólo
   en los editores (en el pliego para imprimir no va: el pliego no está en #s19/#s20) */
#s19 .te-card .tj-foto::after, #s20 .te-card .ms-ret:not(.ms-vacio)::after{ content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='150' viewBox='0 0 220 150'%3E%3Cg transform='rotate(-24 110 75)' font-family='Jost,Helvetica,Arial,sans-serif' font-size='15' letter-spacing='4' text-anchor='middle'%3E%3Ctext x='110' y='80' fill='rgba(255,255,255,.42)' stroke='rgba(31,29,27,.16)' stroke-width='.6'%3EKORA %C2%B7 MUESTRA%3C/text%3E%3C/g%3E%3C/svg%3E") 0 0 / 46cqmin auto repeat }

/* 21 oct, noche · Rayas y onda (en lugar de Cuadros): ver rayasOnda() */
.tj-rayasonda{ padding:0 }
.tj-ro-m{ position:absolute; inset:0; width:100%; height:100%; z-index:0 }
.tj-rayasonda .tj-foto{ position:absolute; left:15cqmin; top:16.5cqmin; width:70cqmin; height:70cqmin; flex:none }   /* sin z-index: que su «multiply» llegue al hueso de abajo */
/* 22 oct · Vivi: la ilustración más grande, el título más chico y el subtítulo un poco más arriba */
.tj-ro-t{ position:absolute; left:16cqmin; right:16cqmin; top:88cqmin; z-index:2; font-family:'Gilda Display',var(--font-display),serif; font-size:10cqmin; line-height:1; text-align:center }
.tj-ro-f{ position:absolute; left:16cqmin; right:16cqmin; top:110cqmin; z-index:2; font-family:'Jost',sans-serif; font-size:3.4cqmin; letter-spacing:.06em; text-transform:uppercase; color:#1F1D1B; text-align:center }
.tj-l2 .tj-ro-f{ font-size:3cqmin; letter-spacing:.03em }
/* 22 oct · Vivi, en su celular: el Marco de color salía con el paspartú alargado y la
   firma fuera de la tarjeta. Safari no respeta `aspect-ratio` en un hijo flex cuando lo
   de adentro (la ilustración) lo empuja; con el alto dicho en cqmin ya no crece. */
.tj-ant-marco{ height:80cqmin; aspect-ratio:auto; min-height:0; overflow:hidden }
.tj-ant-marco .tj-foto{ min-height:0; height:100% }
.tj-mono-ar{ height:calc(80cqmin * .82); aspect-ratio:auto; min-height:0 }
.tj-esf-bola{ height:calc(100cqmin * 1082 / 1500) }

/* 22 oct · Vivi: «el watermark se pierde mucho.. vamos a hacerlo un poco más grande
   y más visible para proteger el trabajo». Letra más grande y gruesa, blanco más
   lleno y un contorno más marcado, para que se lea sobre la piel clara y sobre lo oscuro. */
#s19 .te-card .tj-foto::after, #s20 .te-card .ms-ret:not(.ms-vacio)::after{
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='170' viewBox='0 0 260 170'%3E%3Cg transform='rotate(-24 130 85)' font-family='Jost,Helvetica,Arial,sans-serif' font-size='21' font-weight='500' letter-spacing='5' text-anchor='middle'%3E%3Ctext x='130' y='92' fill='rgba(255,255,255,.62)' stroke='rgba(31,29,27,.30)' stroke-width='.9'%3EKORA %C2%B7 MUESTRA%3C/text%3E%3C/g%3E%3C/svg%3E") 0 0 / 58cqmin auto repeat }
/* 27 oct · Halloween: los acomodos de Navidad, con colores de octubre */
.tj-hw-mano .tj-mano-t{ color:#C25A22 }
.tj-hw-doble .tj-db-1{ color:#C25A22 }
.tj-hw-doble .tj-db-t{ color:#1F1A1C }
.tj-hw-sencilla .tj-pie i{ color:#C25A22 }
.tj-cta.tj-cta-hw{ background:#C25A22; color:#fff }
.tj-hw-mano .tj-firma{ color:#1F1A1C }
