:root{--v-ease:cubic-bezier(.22,.7,.2,1);--v-terra:var(--p-terra,#754437)}


.v-js [data-v]{opacity:0;transform:translateY(28px);transition:opacity .9s var(--v-ease),transform .9s var(--v-ease);transition-delay:calc(var(--vi,0) * 80ms)}
.v-js [data-v="izq"]{transform:translateX(-36px)}
.v-js [data-v="der"]{transform:translateX(36px)}
.v-js [data-v="zoom"]{transform:scale(.94)}
.v-js [data-v].v-in{opacity:1;transform:none}


.v-js [data-v="tinta"]{opacity:1;transform:none;clip-path:inset(100% 0 0 0);transition:clip-path 1.3s var(--v-ease)}
.v-js [data-v="tinta"].v-in{clip-path:inset(0 0 0 0)}


h1 i{background:linear-gradient(var(--v-terra),var(--v-terra)) 0 94%/0% .09em no-repeat;transition:background-size 1.1s .5s var(--v-ease)}
.v-js h1.v-in i,.v-js h1 i.v-in,.v-listo h1 i{background-size:100% .09em}


#vBarra{position:fixed;left:0;top:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:var(--v-terra);z-index:9999;pointer-events:none}


html body .site-head{transition:transform .45s var(--v-ease),box-shadow .3s}
html body .site-head.v-oculta{transform:translateY(-105%)}


.v-para{will-change:transform}


.v-tilt{transition:transform .5s var(--v-ease);transform-style:preserve-3d;will-change:transform}
.v-tilt.v-move{transition:transform .08s linear}


:is(.btn-primary,.lh-btn,.compra,.h-big){position:relative;overflow:hidden;isolation:isolate}
:is(.btn-primary,.lh-btn,.compra,.h-big)::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.28) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s var(--v-ease)}
:is(.btn-primary,.lh-btn,.compra,.h-big):hover::after{transform:translateX(120%)}
:is(.btn,.lh-btn,.compra,.h-pills a,.todos summary):active{transform:scale(.96)!important;transition:transform .1s}

.v-flecha{display:inline-block;transition:transform .35s var(--v-ease)}
a:hover .v-flecha{transform:translateX(5px)}


@keyframes vFlota{0%,100%{translate:0 0}50%{translate:0 -6px}}
.reader .meta .price,.bigprice .now{animation:vFlota 4s ease-in-out infinite}
.reader:nth-child(2) .meta .price{animation-delay:-1s}.reader:nth-child(3) .meta .price{animation-delay:-2s}.reader:nth-child(4) .meta .price{animation-delay:-3s}


.h-tiles a:hover .h-dot{transform:translateY(-6px) rotate(-12deg) scale(1.12)!important}


@keyframes vLate{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--v-terra) 45%,transparent)}100%{box-shadow:0 0 0 18px transparent}}
.h-listen:not(.v-usado){animation:vLate 2.2s ease-out infinite}


@keyframes vEntra{from{opacity:0;translate:0 24px;filter:blur(6px)}}
@keyframes vDescubre{from{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0)}}
@keyframes vAsienta{from{scale:1.18}}
.h-js .h-hero h1{animation:vEntra .9s var(--v-ease) both}
.h-js .h-hero .h-lede{animation:vEntra .9s .15s var(--v-ease) both}
.h-js .h-hero .h-big,.h-js .h-hero .resume{animation:vEntra .9s .3s var(--v-ease) both}
.h-js .h-hero .h-arch{animation:vDescubre 1.4s .1s var(--v-ease) both}
.h-js .h-hero .h-arch img{animation:vAsienta 2.6s .1s var(--v-ease) both}


@supports (animation-timeline:view()){
  @keyframes vLosa{from{scale:.93;border-radius:calc(var(--h-r,28px) * 2.2)}}
  .h-js .h .h-slab{animation:vLosa linear both;animation-timeline:view();animation-range:entry 0% entry 85%}
}


@keyframes vPop{0%{scale:0}70%{scale:1.18}100%{scale:1}}
.h-js .h-tiles a[data-r] .h-dot{scale:0}
.h-js .h-tiles a.is-in .h-dot{animation:vPop .6s calc(var(--i,0) * 90ms + .45s) cubic-bezier(.3,1.6,.5,1) both}


.v-js .h-a1 .b3d{transition:transform .6s var(--v-ease),opacity .9s var(--v-ease),translate 1.2s var(--v-ease)}
.v-js .h-a1 .b3d.dos{transition-delay:0s,.15s,.15s}
.v-js .h-a1:not(.v-in) .b3d{opacity:0;translate:-80px 40px}
.v-js .h-a1:not(.v-in) .b3d.dos{translate:80px 40px}
@keyframes vSello{0%{opacity:0;scale:1.9}60%{opacity:1;scale:.92}100%{scale:1}}
.v-js .h-a1:not(.v-in) .h-a1-sello{opacity:0}
.v-js .h-a1.v-in .h-a1-sello{animation:vSello .55s .75s cubic-bezier(.3,1.4,.5,1) both}
.h-a1-sello s{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 55%/100% 1.5px no-repeat}
.v-js .h-a1-sello s{transition:background-size .45s 1.3s var(--v-ease)}
.v-js .h-a1:not(.v-in) .h-a1-sello s{background-size:0 1.5px}


@keyframes vAbre{from{transform:translateY(6%)}}
.h-js .h-books .bk-art.is-in .fan5 .cover{animation:vAbre 1.1s .25s var(--v-ease) backwards}
.h-js .h-books .bk-art.is-in .fan5 .cover:is(:nth-child(2),:nth-child(4)){animation-delay:.33s}
.h-js .h-books .bk-art.is-in .fan5 .cover:is(:nth-child(1),:nth-child(5)){animation-delay:.41s}


.h-try .sent .v-pal{transition:color .3s}
.h-try .sent .v-pal.v-dicha{color:var(--v-terra)}

@media (prefers-reduced-motion:reduce){
  .h-hero h1,.h-hero .h-lede,.h-hero .h-big,.h-hero .resume,.h-arch,.h-arch img,.h-slab,.h-dot,.h-a1-sello,.fan5 .cover{animation:none!important}
  .h-dot,.h-a1 .b3d,.h-a1-sello{scale:1!important;opacity:1!important;translate:none!important}
  .h-a1-sello s{background-size:100% 1.5px!important}
}
@media (prefers-reduced-motion:reduce){
  .v-js [data-v]{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}
  .reader .meta .price,.bigprice .now,.h-listen{animation:none!important}
  #vBarra{display:none}
  h1 i{background-size:100% .09em;transition:none}
}
@media print{.v-js [data-v]{opacity:1!important;transform:none!important;clip-path:none!important}#vBarra{display:none}}