/* Produkt-Highlights: la tarjeta de producto del demo aprobado.
   Medidas tomadas del demo: tarjeta de 18 px de radio, imagen 4:3,
   cuerpo con 24 px, título en Fraunces 1.32rem. */

.dm-hl{display:grid;gap:25px;grid-template-columns:repeat(4,minmax(0,1fr))}
.dm-hl--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.dm-hl--2{grid-template-columns:repeat(2,minmax(0,1fr))}

.dm-hl__card{display:flex;flex-direction:column;background:var(--surface,#fff);
	border:1px solid var(--line-soft,rgba(26,32,44,.07));border-radius:18px;overflow:hidden;
	transition:border-color .25s var(--ease-brand,cubic-bezier(.22,.61,.36,1)),transform .25s var(--ease-brand,cubic-bezier(.22,.61,.36,1))}
.dm-hl__card:hover{border-color:var(--line-strong,rgba(26,32,44,.22));transform:translateY(-3px)}

.dm-hl__img{position:relative;display:block;aspect-ratio:257/218;background:var(--surface-media,#EEF1F5);overflow:hidden}
.dm-hl__img img{width:100%;height:100%;object-fit:cover;display:block;
	transition:transform .5s var(--ease-brand,cubic-bezier(.22,.61,.36,1))}
.dm-hl__card:hover .dm-hl__img img{transform:scale(1.04)}
.dm-hl__ph{display:block;width:100%;height:100%;background:var(--surface-media,#EEF1F5)}

.dm-hl__tag,.dm-hl__sale{position:absolute;top:14px;z-index:2;border-radius:100px;
	font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;line-height:1.65;padding:.45em .9em}
.dm-hl__tag{left:14px;background:rgba(255,255,255,.92);color:var(--brand-deep,#8A2A1A)}
.dm-hl__sale{right:14px;background:var(--sale,#D9342B);color:#fff;letter-spacing:.08em}

.dm-hl__body{display:flex;flex-direction:column;flex:1;padding:24px 24px 26px}
.dm-hl__title{margin:0 0 .25em;font-family:Fraunces,Georgia,serif;font-size:1.32rem;font-weight:500;
	line-height:1.08;letter-spacing:-.012em}
.dm-hl__title a{color:var(--ink,#1A202C);text-decoration:none}
.dm-hl__title a:hover{color:var(--brand,#B82105)}
.dm-hl__sub{margin:0 0 1.4em;color:var(--ink-soft,#4A5568);font-size:.86rem;line-height:1.65}
.dm-hl__foot{margin-top:auto;padding-top:16px;border-top:1px solid var(--line-soft,rgba(26,32,44,.07));display:flex;align-items:center;justify-content:space-between;gap:12px}
.dm-hl__go{flex:0 0 auto;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid var(--line,rgba(26,32,44,.13));color:var(--ink,#1A202C);
	transition:background .25s var(--ease-brand,cubic-bezier(.22,.61,.36,1)),color .25s var(--ease-brand,cubic-bezier(.22,.61,.36,1)),border-color .25s var(--ease-brand,cubic-bezier(.22,.61,.36,1))}
.dm-hl__go:hover{background:var(--ink,#1A202C);border-color:var(--ink,#1A202C);color:#fff}
.dm-hl__price{margin:0;display:flex;align-items:baseline;gap:9px}
.dm-hl__price b{font-family:Fraunces,Georgia,serif;font-size:1.6rem;font-weight:500;line-height:1.65;color:var(--ink,#1A202C)}
.dm-hl__price s{color:#5F6B7A;font-size:.95rem}
.dm-hl__note{margin:0;color:var(--ink-soft,#4A5568);font-size:.7rem;font-weight:500;letter-spacing:.02em;line-height:1.65}
.dm-hl__note a{color:inherit}

@media (max-width:900px){.dm-hl,.dm-hl--3,.dm-hl--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.dm-hl,.dm-hl--2,.dm-hl--3,.dm-hl--4{grid-template-columns:1fr}}
@media (max-width:1024px){.dm-hl{gap:16px}}
@media (max-width:767px){.dm-hl,.dm-hl--2,.dm-hl--3,.dm-hl--4{grid-template-columns:1fr}}

/* Importes largos: el precio no se parte ni se sale de la tarjeta; el precio tachado
   pasa debajo y la cifra se reduce con el ancho de la tarjeta. */
.dm-hl__body{container-type:inline-size}
.dm-hl__foot>div{min-width:0;flex:1 1 auto}
.dm-hl__price{flex-wrap:wrap;row-gap:0}
.dm-hl__price b,.dm-hl__price s{white-space:nowrap}
.dm-hl__price b{font-size:min(1.6rem,9cqi)}