/* premium.css — capa de terminación sobre style.css */
:root{--grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .45  0 0 0 0 .36  0 0 0 0 .22  0 0 0 .5 0'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='.55'/></svg>")}
body{background:var(--paper) var(--grain);font-size:17.5px;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
h1,h2,h3{text-wrap:balance;font-variation-settings:'opsz' 48;letter-spacing:0}
::selection{background:var(--fire);color:#fff}
:focus-visible{outline:3px solid var(--fire);outline-offset:3px;border-radius:6px}
/* barra de progreso de lectura */
#prog{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,#F2B8C6,var(--fire));z-index:120;box-shadow:0 0 10px rgba(194,69,61,.7)}
/* etiquetas con regla */
.kick{display:inline-flex;align-items:center;gap:10px}
.kick:before{content:"";width:22px;height:2px;background:currentColor;opacity:.7}
.center .kick:after{content:"";width:22px;height:2px;background:currentColor;opacity:.7}
.pill:before{display:none}
/* bordes de papel rasgado entre secciones */
.dark,.hero+section{position:relative}
.dark:before{content:"";position:absolute;left:0;right:0;top:-1px;height:16px;background:var(--edge,#F7F0E0);-webkit-mask:url(img/torn.svg) repeat-x 0 0/120px 16px;mask:url(img/torn.svg) repeat-x 0 0/120px 16px;z-index:3}
#diagnose{--edge:#EFE4C8}#inside{--edge:#F7F0E0}#bonus{--edge:#EADBBB}#why{--edge:#F7F0E0}#final{--edge:#F7F0E0}
.offer:before,.cost:before{content:none}
.dark{background:radial-gradient(120% 100% at 50% 0%,#1A2F22,var(--forest2) 62%) ,var(--grain)}
.dark:after{content:"";position:absolute;inset:0;background:var(--grain);opacity:.25;pointer-events:none;mix-blend-mode:overlay}
.dark>*{position:relative;z-index:2}
/* hero cinematográfico */
.hero{padding:26px 0 36px}
.hero-bg{opacity:.34;animation:kb 40s ease-in-out infinite alternate;transform-origin:60% 40%}
@keyframes kb{from{transform:scale(1.02)}to{transform:scale(1.14) translate(-1.5%,-1%)}}
.hero h1{letter-spacing:-.012em;line-height:1.04}
.hero h1 em{background:linear-gradient(180deg,#FFD3DE,#F2A0B6);-webkit-background-clip:text;background-clip:text;color:transparent}
.book .b{transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.book .b:after{content:"";position:absolute;inset:0;border-radius:3px 7px 7px 3px;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.18) 46%,transparent 62%);background-size:220% 100%;animation:glint 6s ease-in-out infinite;pointer-events:none}
@keyframes glint{0%,55%{background-position:120% 0}100%{background-position:-60% 0}}
.book .b:before{content:"";position:absolute;left:-9px;top:2px;bottom:2px;width:12px;background:linear-gradient(90deg,#08110b,#26402F);transform:rotateY(-70deg);transform-origin:right;border-radius:2px}
.seal-m{position:absolute;left:-26px;bottom:26px;width:92px;height:92px;z-index:4;animation:spin 30s linear infinite;filter:drop-shadow(0 6px 14px rgba(0,0,0,.5))}
@keyframes spin{to{transform:rotate(360deg)}}
.seal-m text{font:600 10.5px 'Oswald',sans-serif;letter-spacing:.2em;fill:#FFE3EA}
.seal-m .core{fill:var(--fire2)}.seal-m .ring{fill:none;stroke:#FBE3B0;stroke-width:1.5}
.seal-c{position:absolute;left:-26px;bottom:26px;width:92px;height:92px;z-index:5;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#fff;font:800 20px/1 'Fraunces',serif;text-align:center;pointer-events:none}
.seal-c small{font:600 8px 'Oswald',sans-serif;letter-spacing:.16em;margin-top:2px}
.pricebox .price{text-shadow:0 2px 18px rgba(194,69,61,.35)}
/* botón: lo único que brilla */
.btn{position:relative;overflow:hidden;min-height:56px;transition:transform .15s,box-shadow .2s;background:linear-gradient(180deg,#F7A245,#D8661A);box-shadow:0 12px 30px rgba(194,69,61,.5),0 2px 0 #9E2F2A,inset 0 1px 0 rgba(255,255,255,.4)}
.btn:after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:sweep 4.5s ease-in-out infinite}
@keyframes sweep{0%,60%{left:-40%}100%{left:140%}}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(194,69,61,.6),0 2px 0 #9E2F2A,inset 0 1px 0 rgba(255,255,255,.4)}
.btn:active{transform:translateY(1px);box-shadow:0 6px 16px rgba(194,69,61,.5),0 0 0 #9E2F2A}
.btn.alt:after,.sticky .btn:after{display:none}
.qopt{position:relative;transition:transform .12s,border-color .15s,background .15s}.qopt:active{transform:scale(.985)}
/* tarjetas con presencia */
.cc{border-left:0;border-top:4px solid var(--plaid);border-radius:12px;box-shadow:0 10px 26px rgba(70,40,20,.12);position:relative;background:#FFFBEF var(--grain)}
.cc b{font-size:20px}
.cost{background:#EFE4C8 var(--grain)}
.cost-grid{gap:16px}
/* ficha de receta con cinta */
.recipe{position:relative;background:#FFFBEF var(--grain);border:1px solid #E6D9B6;border-top:4px double var(--plaid);border-radius:6px;transform:rotate(-.35deg);box-shadow:0 24px 50px rgba(50,35,15,.22),0 2px 0 #e8dbb8}
.recipe:before,.recipe:after{content:"";position:absolute;top:-14px;width:96px;height:28px;background:rgba(232,210,160,.75);border:1px solid rgba(190,160,100,.35);box-shadow:0 2px 6px rgba(0,0,0,.12);z-index:3}
.recipe:before{left:-16px;transform:rotate(-38deg)}.recipe:after{right:-16px;transform:rotate(36deg)}
.note-hand{font:600 24px 'Caveat',cursive;color:var(--plaid);transform:rotate(-3deg);display:inline-block;margin-left:8px}
.rec-top h3{font-size:34px}
.rec-trick{transform:rotate(-.6deg);box-shadow:0 6px 14px rgba(0,0,0,.08)}
/* visor: páginas como hojas apoyadas */
.rail figure{border-radius:3px;transition:transform .25s,box-shadow .25s;box-shadow:0 14px 34px rgba(0,0,0,.5)}
.rail figure:hover{transform:translateY(-6px) rotate(-.6deg);box-shadow:0 22px 44px rgba(0,0,0,.6)}
.rail figcaption{font:600 11px 'Oswald',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--forest)}
@media(min-width:900px){.rail{overflow:visible;justify-content:center;flex-wrap:nowrap;padding:24px 0 30px;margin:24px 0 0;gap:0}.rail figure{flex:0 0 19%;margin:0 -1.2%;scroll-snap-align:none}.rail figure:nth-child(1){transform:rotate(-7deg) translateY(14px)}.rail figure:nth-child(2){transform:rotate(-4deg) translateY(4px)}.rail figure:nth-child(3){transform:rotate(-1.5deg)}.rail figure:nth-child(4){transform:rotate(1.5deg) translateY(2px)}.rail figure:nth-child(5){transform:rotate(4deg) translateY(6px)}.rail figure:nth-child(6){display:none}.rail figure:nth-child(7){display:none}.rail figure:hover{transform:translateY(-12px) rotate(0) scale(1.06);z-index:5}}
/* stats en relieve */
.stats div{background:linear-gradient(180deg,#5A2D55,var(--forest));box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 8px 18px rgba(0,0,0,.18);border-radius:14px}
/* lista */
.list div{transition:padding .2s,background .2s}.list div:hover{background:rgba(201,166,107,.14);padding-left:12px}
/* pila de valor */
.stack li:before{content:"✓";width:22px;height:22px;border-radius:50%;background:var(--fire2);color:#fff;font-size:13px;line-height:22px;text-align:center;top:9px}
.stack li{padding-left:36px}
.box{border-radius:20px;border:0;box-shadow:0 30px 70px rgba(74,37,69,.35),0 0 0 2px var(--forest);position:relative}
.box .hd{background:linear-gradient(180deg,#5A2D55,var(--forest))}
.offer{background:#EADBBB var(--grain)}
/* comparativa */
.tbl{border-radius:18px;box-shadow:0 20px 50px rgba(0,0,0,.14)}
.compare{background:#EFE4C8 var(--grain)}
/* Loretta: capitular editorial */
.ole p:first-of-type:first-letter{font:800 64px/.8 'Fraunces',serif;float:left;margin:6px 10px 0 0;color:var(--fire2)}
.ole img{filter:saturate(1.05) contrast(1.03);border-radius:16px;box-shadow:0 24px 54px rgba(0,0,0,.4)}
/* garantía: sello con cinta */
.gar{border:0;border-radius:20px;background:#fff var(--grain);box-shadow:0 20px 50px rgba(50,35,15,.16);position:relative}
.seal{width:96px;height:96px;background:radial-gradient(circle at 35% 30%,#2b4a36,var(--forest2));box-shadow:0 8px 20px rgba(0,0,0,.35),inset 0 0 0 4px rgba(242,184,198,.35);animation:none}
/* faq */
details{border-radius:14px;box-shadow:0 4px 12px rgba(70,50,20,.06);transition:box-shadow .2s}details[open]{box-shadow:0 12px 26px rgba(70,50,20,.14);border-color:var(--kraft)}
/* cierre */
.final{background:radial-gradient(100% 90% at 50% 100%,#2b1c10,var(--forest2) 70%)}
.final h2{font-size:34px}
@media(min-width:900px){.hero h1{font-size:60px}.hero h1 span{font-size:.42em}h2{font-size:44px}.final h2{font-size:52px}.seal-m,.seal-c{left:-34px;bottom:34px;width:112px;height:112px}.seal-c{font-size:24px}}
@media (prefers-reduced-motion:reduce){.hero-bg,.book .b:after,.btn:after,.seal-m{animation:none}}