body[data-page="casos-de-exito"] .cx{ display:block; min-height:0; padding-top:clamp(10px,2vh,30px); padding-bottom:clamp(90px,12vh,150px); }
.cx-rejilla{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(20px,2.6vw,40px); margin:0; padding:0; list-style:none; }
.cx-rejilla__item{ margin:0; padding:0; }
.cx-rejilla__item[hidden]{ display:none; }
.cx-rejilla__item.is-nuevo{ animation:cx-entra .7s var(--ease-out) both; }
.cx-rejilla__item.is-nuevo:nth-child(even){ animation-delay:.08s; }
@keyframes cx-entra{ from{ opacity:0; transform:translateY(30px); } to{ opacity:1; transform:none; } }

.cx-caso{ position:relative; isolation:isolate; overflow:hidden; display:flex; flex-direction:column; justify-content:flex-end; aspect-ratio:6 / 5;
  padding:clamp(26px,2.8vw,44px); border-radius:clamp(16px,1.4vw,24px); background:var(--color); color:var(--tinta); text-decoration:none;
  transition:transform .6s var(--ease-out), box-shadow .6s var(--ease-out); }
a.cx-caso:hover{ transform:translateY(-6px); box-shadow:0 40px 70px -40px rgba(26,20,16,.45); }
a.cx-caso:focus-visible{ outline:3px solid var(--ink); outline-offset:4px; }

.cx-caso__visual{ position:absolute; inset:0; z-index:0; }
.cx-caso--objeto .cx-caso__visual::after, .cx-caso--captura .cx-caso__visual::after, .cx-caso--botella .cx-caso__visual::after{ content:''; position:absolute; inset:auto 0 0 0; height:52%;
  background:linear-gradient(180deg, transparent, var(--color) 72%); }
.cx-caso__objeto{ position:absolute; inset:10% 20% 46% 20%; display:grid; place-items:center; }
.cx-caso__objeto img{ max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; filter:drop-shadow(0 28px 32px rgba(0,0,0,.3));
  transition:transform 1s cubic-bezier(.34,1.3,.64,1); }
.cx-caso--plano .cx-caso__objeto img{ filter:none; }
a.cx-caso:hover .cx-caso__objeto img{ transform:translateY(-10px) rotate(-4deg) scale(1.04); }
.cx-caso--botella .cx-caso__objeto{ inset:5% 4% -16% 60%; }
.cx-caso--botella .cx-caso__objeto img{ height:100%; }
.cx-caso--botella .cx-caso__visual::after{ display:none; }
.cx-caso--botella .cx-caso__texto{ max-width:54%; }

.cx-caso__forma{ position:absolute; left:8%; top:-12%; width:52%; aspect-ratio:1; border-radius:50%; background:var(--forma, #FFCB1F); opacity:.95;
  transition:transform 1.2s cubic-bezier(.2,.7,.2,1); }
a.cx-caso:hover .cx-caso__forma{ transform:translate(14px, 10px) scale(1.05); }
.cx-caso__captura{ position:absolute; right:-9%; top:12%; width:74%; aspect-ratio:3 / 2; border-radius:12px; overflow:hidden;
  box-shadow:0 40px 60px -30px rgba(0,0,0,.55); transform:rotate(-5deg); transition:transform 1s cubic-bezier(.2,.7,.2,1); }
.cx-caso__captura img{ width:100%; height:100%; object-fit:cover; object-position:50% 0; }
a.cx-caso:hover .cx-caso__captura{ transform:rotate(-2deg) translateY(-10px) scale(1.03); }

.cx-caso__foto{ position:absolute; inset:0; }
.cx-caso__foto img{ width:100%; height:100%; object-fit:cover; transition:transform 1.4s cubic-bezier(.2,.7,.2,1); }
a.cx-caso:hover .cx-caso__foto img{ transform:scale(1.05); }
.cx-caso--foto .cx-caso__visual::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(0,0,0,.8) 100%); }

.cx-caso__texto{ position:relative; z-index:2; display:flex; flex-direction:column; gap:clamp(8px,.8vw,12px); }
body[data-page="casos-de-exito"] main#smooth-wrapper #smooth-content .cx-caso__nombre{ margin:0; color:inherit; font-size:clamp(2rem,3.6vw,3.5rem) !important; font-weight:800;
  line-height:.98 !important; letter-spacing:-.045em; text-wrap:balance; }
body[data-page="casos-de-exito"] main#smooth-wrapper #smooth-content .cx-caso__frase{ max-width:36ch; font-size:clamp(.95rem,1.1vw,1.1rem) !important; font-weight:400;
  line-height:1.45 !important; opacity:.86; }

body[data-page="casos-de-exito"] main#smooth-wrapper #smooth-content .cx-caso__dato{ position:absolute; z-index:2; left:clamp(26px,2.8vw,44px); top:clamp(26px,2.8vw,44px);
  display:inline-flex; align-items:baseline; gap:6px; padding:8px 14px; border-radius:999px; background:var(--tinta); color:var(--color);
  font-size:.8rem !important; font-weight:600; line-height:1.2 !important; white-space:nowrap; }
.cx-caso__dato strong{ font-size:1.05rem; font-weight:800; letter-spacing:-.02em; }

.cx-caso__flecha{ position:absolute; z-index:2; right:clamp(22px,2.4vw,36px); top:clamp(22px,2.4vw,36px); display:grid; place-items:center; width:48px; height:48px;
  border-radius:50%; background:var(--tinta); color:var(--color); font-size:1.15rem; font-weight:700; line-height:1;
  transition:transform .5s var(--ease-out); }
a.cx-caso:hover .cx-caso__flecha{ transform:rotate(45deg) scale(1.08); }

.cx-mas{ display:flex; justify-content:center; margin-top:clamp(36px,4vw,56px); }
.cx-mas[hidden]{ display:none; }
.cx-mas__cuenta{ opacity:.6; font-weight:600; }

@media (max-width:760px){
  .cx-rejilla{ grid-template-columns:minmax(0,1fr); gap:16px; }
  .cx-caso{ aspect-ratio:4 / 5; padding:24px; }
  body[data-page="casos-de-exito"] main#smooth-wrapper #smooth-content .cx-caso__nombre{ font-size:2.2rem !important; }
  body[data-page="casos-de-exito"] main#smooth-wrapper #smooth-content .cx-caso__dato{ left:24px; top:24px; }
  .cx-caso__flecha{ right:20px; top:20px; width:42px; height:42px; }
  .cx-caso__objeto{ inset:16% 16% 46% 16%; }
  .cx-caso__captura{ top:16%; width:86%; }
  .cx-caso--botella .cx-caso__objeto{ inset:8% 4% 20% 50%; }
}
@media (prefers-reduced-motion: reduce){
  .cx-caso, .cx-caso__objeto img, .cx-caso__forma, .cx-caso__captura, .cx-caso__foto img, .cx-caso__flecha{ transition:none; }
  .cx-rejilla__item.is-nuevo{ animation:none; }
}