.indice-casos{background-color:var(--color-neutro-fondo);color:var(--color-neutro-tinta);isolation:isolate;position:relative;&:before{background-image:var(--aurora-clara);content:"";pointer-events:none;z-index:-1;position:absolute;inset:0}& .rotulo{color:var(--color-casa-petroleo);margin-block-end:18px}& h1,& .metodo h2{letter-spacing:var(--text-h1--letter-spacing);font-weight:300;line-height:var(--text-h1--line-height);text-wrap:balance}& h1{font-size:var(--text-h1)}& :is(h1,h2) em{font-style:normal;font-weight:600}& .cabeza{gap:40px;padding-block:56px 48px;display:grid}& .bajada{color:var(--color-neutro-texto);font-size:var(--text-lead);line-height:var(--text-lead--line-height);max-inline-size:40rem;margin-block-start:22px}& .panel{background:var(--color-neutro-superficie);border:1px solid var(--color-neutro-filete);border-radius:var(--radius-editorial);align-self:end;padding:8px 28px;display:grid;&>div{padding-block:18px}&>div+div{border-block-start:1px solid var(--color-neutro-filete)}& dt{color:var(--color-neutro-apoyo)}& dd{font-size:var(--text-cifra);letter-spacing:-.04em;margin-block-start:6px;font-weight:200;line-height:1.1}& small{color:var(--color-neutro-apoyo);font-size:var(--text-small);letter-spacing:0;margin-block-start:4px;font-weight:400;display:block}}& .lista{padding-block:16px 96px}& .barra{border-block:1px solid var(--color-neutro-filete);flex-wrap:wrap;align-items:center;gap:12px 24px;padding-block:14px;display:flex;& h2{color:var(--color-neutro-apoyo)}}& .filtros,& .estado{display:none}& .con-filtro .filtros{flex-wrap:wrap;gap:8px;display:flex}& .con-filtro .estado{color:var(--color-neutro-apoyo);font-size:var(--text-small);margin-inline-start:auto;display:block}& .filtros button{border:1px solid var(--color-neutro-filete);border-radius:var(--radius-boton);color:var(--color-neutro-tinta);font-size:var(--text-small);min-block-size:44px;transition:background var(--duration-rapido) var(--ease-entrada), border-color var(--duration-rapido) var(--ease-entrada);align-items:center;gap:8px;padding:8px 18px;font-weight:600;display:inline-flex;& span{color:var(--color-neutro-apoyo);font-variant-numeric:tabular-nums;font-weight:400}&:hover{border-color:var(--color-neutro-tinta)}&[aria-pressed=true]{background:var(--color-neutro-tinta);border-color:var(--color-neutro-tinta);color:var(--color-neutro-superficie);& span{color:inherit}}}& .filas{gap:72px;padding-block-start:56px;display:grid}& .caso-fila{--acento:var(--color-casa-indigo-oscuro);--acento-texto:color-mix(in oklab, var(--acento) 78%, var(--color-neutro-tinta));gap:32px;scroll-margin-block-start:120px;display:grid;&.mallgo{--acento:var(--color-casa-magenta-cierre-oscuro)}&[hidden]{display:none}}& .foto{border-radius:var(--radius-editorial);margin:0;position:relative;overflow:hidden;& img{aspect-ratio:4/3;object-fit:cover;block-size:100%;inline-size:100%;display:block}& .sello{background:var(--color-neutro-superficie);border-radius:var(--radius-boton);padding:8px 16px;position:absolute;inset:18px auto auto 18px;& img{aspect-ratio:auto;block-size:26px;inline-size:auto}}& figcaption{background:color-mix(in oklab, var(--color-oscuro-fondo) 82%, transparent);border-radius:var(--radius-boton);color:var(--color-oscuro-tinta);font-size:var(--text-small);padding:8px 16px;position:absolute;inset:auto auto 18px 18px}}& .relato{align-self:center;& .meta{color:var(--acento-texto)}& h2{font-size:var(--text-h2);letter-spacing:var(--text-h2--letter-spacing);font-weight:600;line-height:var(--text-h2--line-height);text-wrap:balance;margin-block-start:14px}}& .resumen{color:var(--color-neutro-texto);line-height:var(--text-body--line-height);max-inline-size:36rem;margin-block-start:16px}& .tiempos{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 24px;margin-block-start:24px;display:grid;&>div{border-inline-start:2px solid var(--color-neutro-filete);padding-inline-start:16px}&>.con{border-color:var(--acento)}& dt{font-size:var(--text-small);font-weight:600}& dd{color:var(--color-neutro-texto);font-size:var(--text-small);margin-block-start:4px;line-height:1.5}}& .medidas{border-block-start:1px solid var(--color-neutro-filete);grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:16px;margin-block-start:28px;padding-block-start:20px;display:grid;& strong{letter-spacing:-.03em;font-size:clamp(26px,2.4vw,32px);font-weight:200;line-height:1.1;display:block}& span{color:var(--color-neutro-apoyo);font-size:var(--text-small);margin-block-start:4px;line-height:1.4;display:block}}& .acciones{flex-wrap:wrap;align-items:center;gap:12px 24px;margin-block-start:28px;display:flex;& a{align-items:center;gap:8px;min-block-size:48px;font-weight:600;display:inline-flex}& .leer{background:var(--color-neutro-tinta);border-radius:var(--radius-boton);color:var(--color-neutro-superficie);transition:background var(--duration-rapido) var(--ease-entrada);padding:12px 24px;&:hover{background:var(--acento-texto)}}& .idioma{font-weight:400}& .plataforma{color:var(--acento-texto);text-decoration:underline;text-decoration-color:var(--color-neutro-filete);text-underline-offset:6px}}& .metodo{background:var(--color-neutro-superficie);border-block-start:1px solid var(--color-neutro-filete);padding-block:88px;& h2{font-size:var(--text-h2)}& ol{grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:32px;margin-block-start:48px;display:grid}& li{border-block-start:1px solid var(--color-neutro-filete);padding-block-start:20px}& li .etiqueta{color:var(--color-casa-petroleo)}& h3{margin-block-start:12px;font-size:1.125rem;font-weight:600}& p{color:var(--color-neutro-texto);margin-block-start:8px;line-height:1.6}}@media (width>=64rem){& .cabeza{grid-template-columns:minmax(0,1fr) 20rem;align-items:end;padding-block:72px 56px}& .caso-fila{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;gap:64px}& .caso-fila.invertida .foto{order:2}}@media (width<36rem){& .tiempos{grid-template-columns:1fr}}}