/* Ficha de guía / informe (ver src/whitepapers/render.mjs). La pieza con carácter es el propio PDF: su
   portada real, inclinada como un cuadernillo con las páginas asomando debajo y la pegatina dorada con el
   número de páginas. El resto, sobrio: índice del PDF como índice de libro, cifras grandes, artículo en
   columna de lectura y, al lado, la descarga siempre a mano. */
.wp-hero{align-items:center}
.wp-hero h1{font-size:clamp(32px,3.6vw,52px);line-height:1.03;font-stretch:116%}
.wp-back{display:flex;width:max-content;align-items:center;gap:8px;margin-bottom:18px;color:var(--fog);font:650 14px/1 var(--font-body);text-decoration:none}
.wp-back:hover{color:#fff}
.wp-back svg{width:16px;height:16px}
.wp-kind{display:inline-flex;align-items:center;gap:8px;margin:0 0 18px;padding:7px 14px 7px 10px;border-radius:999px;background:var(--gold);color:var(--ink);font:760 14px/1 var(--font-body);transform:rotate(-1.5deg)}
.wp-kind svg{width:18px;height:18px}
.wp-facts{list-style:none;display:flex;flex-wrap:wrap;gap:10px 22px;margin:24px 0 0;padding:0;color:var(--fog);font-size:15px;font-weight:600}
.wp-facts li{display:flex;align-items:center;gap:8px}
.wp-facts svg{width:18px;height:18px;color:var(--gold)}
.wp-hero .lp-btns .btn svg{width:20px;height:20px}

/* el cuadernillo: portada + dos hojas desplazadas detrás; al pasar el ratón se endereza y se abre un poco */
.wp-media{display:grid;place-items:center;padding:12px 28px 28px 0}
.wp-book{position:relative;width:min(100%,340px);margin:0;transform:rotate(-4deg);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.wp-book img{position:relative;z-index:3;display:block;width:100%;height:auto;border-radius:3px 10px 10px 3px;background:#fff;box-shadow:inset 0 0 0 1px rgba(11,27,48,.06),0 36px 60px -26px rgba(0,0,0,.85)}
.wp-book::before{content:"";position:absolute;z-index:4;inset:0 auto 0 0;width:16px;border-radius:3px 0 0 3px;background:linear-gradient(90deg,rgba(11,27,48,.28),rgba(11,27,48,0));pointer-events:none}
.wp-book-page{position:absolute;inset:0;border-radius:3px 10px 10px 3px;background:#E9EEF5;box-shadow:0 20px 40px -24px rgba(0,0,0,.7);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.wp-book-page:nth-child(1){z-index:2;transform:translate(9px,7px) rotate(2.5deg)}
.wp-book-page:nth-child(2){z-index:1;transform:translate(18px,14px) rotate(5deg);background:#C8D4E3}
.wp-book-tag{position:absolute;z-index:5;right:-22px;top:-18px;display:grid;place-items:center;align-content:center;width:86px;height:86px;border-radius:50%;background:var(--gold);color:var(--ink);font:720 12.5px/1.05 var(--font-body);text-align:center;transform:rotate(10deg);box-shadow:0 6px 0 #C9831D,0 18px 30px -12px rgba(0,0,0,.6)}
.wp-book-tag b{display:block;font:840 30px/1 var(--font-head);font-stretch:118%;letter-spacing:-.02em}
.wp-media:hover .wp-book{transform:rotate(-1deg) translateY(-6px)}
.wp-media:hover .wp-book-page:nth-child(1){transform:translate(14px,9px) rotate(4deg)}
.wp-media:hover .wp-book-page:nth-child(2){transform:translate(28px,18px) rotate(8deg)}
.wp-shot{margin:0;justify-self:center;width:100%;max-width:520px;padding:8px;border-radius:22px;background:#fff;transform:rotate(2.5deg);box-shadow:0 40px 70px -30px rgba(0,0,0,.85)}
.wp-shot img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:15px}

/* artículo + columna lateral */
.wp{background:#fff}
.wp-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:clamp(40px,5vw,72px);align-items:start;padding-top:clamp(48px,6vw,80px);padding-bottom:clamp(56px,6vw,88px)}
.wp-art{max-width:740px;min-width:0}
.wp-art > h2,.wp-art section > h2{margin:1.8em 0 .6em}
.wp-art > :first-child > h2:first-child,.wp-art > h2:first-child{margin-top:0}
.wp-art p{font-size:17.5px;line-height:1.72}

/* índice del PDF: número grande, título y una línea; se lee como el índice de un libro */
.wp-inside{margin:0 0 8px}
.wp-toc{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.wp-toc li{display:grid;grid-template-columns:64px minmax(0,1fr);gap:4px 16px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--rule)}
.wp-toc li::marker{content:none}
.wp-toc-n{font:840 30px/1 var(--font-head);font-stretch:120%;letter-spacing:-.02em;color:var(--action);font-variant-numeric:tabular-nums}
.wp-toc strong{display:block;color:var(--ink);font:760 18.5px/1.3 var(--font-head);font-stretch:108%}
.wp-toc p{margin:6px 0 0;color:var(--muted);font-size:16px!important;line-height:1.55!important}
.wp-toc-plain li{grid-template-columns:28px minmax(0,1fr)}
.wp-toc-dot{width:14px;height:14px;margin-top:3px;border-radius:4px;background:var(--gold);transform:rotate(-8deg)}

/* cifras */
.wp-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin:36px 0 8px}
.wp-stats-2,.wp-stats-4{grid-template-columns:repeat(2,minmax(0,1fr))}
.wp-stats-1{grid-template-columns:minmax(0,1fr)}
.wp-stat{display:flex;flex-direction:column;gap:8px;padding:24px 22px 20px;border-radius:18px;background:var(--ink);color:var(--fog)}
.wp-stat b{font:840 clamp(40px,4vw,52px)/.95 var(--font-head);font-stretch:122%;letter-spacing:-.035em;color:var(--gold);font-variant-numeric:tabular-nums lining-nums}
.wp-stat span{color:#fff;font-size:16px;line-height:1.45}
.wp-stat small{margin-top:auto;padding-top:6px;color:var(--fog);font-size:12.5px;opacity:.8}

.wp-quote{position:relative;margin:34px 0;padding:6px 0 6px 28px;border-left:5px solid var(--gold)}
.wp-quote blockquote{margin:0}
.wp-quote p{margin:0;color:var(--ink);font:620 clamp(20px,1.7vw,24px)/1.45 var(--font-head)!important;font-stretch:104%;letter-spacing:-.005em}
.wp-quote p::before{content:"“"}
.wp-quote p::after{content:"”"}
.wp-quote figcaption{margin-top:12px;color:var(--muted);font-size:15px;font-weight:650}
.wp-quote figcaption::before{content:"— "}

/* cierre del artículo: la descarga otra vez, con la portada en pequeño */
.wp-end{display:grid;grid-template-columns:120px minmax(0,1fr);gap:28px;align-items:center;margin:48px 0 8px;padding:28px 30px;border-radius:22px;background:var(--paper)}
.wp-end img{display:block;width:100%;height:auto;border-radius:2px 7px 7px 2px;transform:rotate(-4deg);box-shadow:0 18px 30px -16px rgba(11,27,48,.55)}
.wp-end h2{margin:0 0 8px!important;font-size:24px!important}
.wp-end h2::before{display:none!important}
.wp-end p{margin:0 0 18px;font-size:16px!important;color:var(--muted)}
.wp-end .btn svg{width:20px;height:20px}
.wp-end-demo{grid-template-columns:minmax(0,1fr)}
.wp-faq{margin-top:48px}

/* columna lateral: pegada al hacer scroll */
.wp-side{position:sticky;top:24px;display:grid;gap:18px}
.wp-box{display:block;padding:24px;border-radius:20px;background:var(--paper)}
.wp-box h2{margin:0 0 14px;font:800 19px/1.2 var(--font-head);font-stretch:112%;color:var(--ink)}
.wp-dl{background:var(--ink);color:#fff}
.wp-dl-k{display:flex;align-items:center;gap:8px;margin:0 0 16px;font:700 15px/1.3 var(--font-body)}
.wp-dl-k svg{width:20px;height:20px;color:var(--gold)}
.wp-dl-lang{margin:-8px 0 16px;color:var(--fog);font-size:14px}
.wp-dl .btn{width:100%;justify-content:center}
.wp-dl .btn svg{width:19px;height:19px}
.wp-aud ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.wp-aud li{position:relative;padding-left:28px;color:#2A3A4E;font-size:15.5px;line-height:1.5}
.wp-aud li::before{content:"";position:absolute;left:0;top:4px;width:15px;height:15px;border-radius:5px;background:var(--gold);transform:rotate(-6deg)}
.wp-sol{background:#fff;box-shadow:0 0 0 1px var(--rule);color:var(--ink);text-decoration:none;transition:box-shadow .2s,transform .2s}
.wp-sol:hover{box-shadow:0 0 0 2px var(--action);transform:translateY(-3px)}
.wp-sol img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;margin:0 0 16px;border-radius:12px}
.wp-sol-k{display:inline-block;margin-bottom:8px;padding:4px 10px;border-radius:999px;background:var(--gold);font:720 12.5px/1.2 var(--font-body)}
.wp-sol strong{display:block;font:780 18px/1.2 var(--font-head);font-stretch:110%}
.wp-sol span:last-child{display:block;margin-top:6px;color:var(--muted);font-size:14.5px;line-height:1.45}

/* formulario de descarga (Zoho Forms) */
.wp-form{padding:clamp(56px,6vw,88px) 0;background:var(--paper)}
.wp-form-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,5vw,72px);align-items:start}
.wp-form-copy{position:sticky;top:24px}
.wp-form-copy h2{margin:0 0 14px;font:840 clamp(30px,3.4vw,44px)/1.02 var(--font-head);font-stretch:118%;letter-spacing:-.025em;color:var(--ink)}
.wp-form-copy p{margin:0;color:var(--muted);font-size:17px;line-height:1.6}
.wp-form-copy .wp-kind{transform:none}
.wp-form-frame{padding:10px;border-radius:22px;background:#fff;box-shadow:0 0 0 1px var(--rule)}
.wp-form-frame iframe{display:block;width:100%;height:720px;border:0;border-radius:14px}

.wp-more{padding:clamp(56px,6vw,80px) 0;background:var(--paper)}
.wp-form + .wp-more{background:#fff}
.wp-more h2{margin:0 0 28px;font:820 clamp(26px,3vw,36px)/1.08 var(--font-head);font-stretch:116%;letter-spacing:-.02em;color:var(--ink)}
.wp-more .res-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.wp-more .res-card{background:#fff}

@media (max-width:1060px){
  .wp-grid{grid-template-columns:minmax(0,1fr)}
  .wp-side{position:static;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
}
@media (max-width:900px){
  .wp-media{padding:8px 24px 24px 0}
  .wp-book{width:min(64vw,280px)}
  .wp-form-grid{grid-template-columns:minmax(0,1fr)}
  .wp-form-copy{position:static}
}
@media (max-width:760px){.wp-more .res-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){
  .wp-stats-4,.wp-stats-2{grid-template-columns:minmax(0,1fr)}
  .wp-hero h1{font-size:30px}
  .wp-toc li{grid-template-columns:44px minmax(0,1fr);gap:4px 12px}
  .wp-toc-n{font-size:24px}
  .wp-end{grid-template-columns:minmax(0,1fr);padding:24px 22px}
  .wp-end img{width:96px}
  .wp-book-tag{right:-10px;width:72px;height:72px}
  .wp-book-tag b{font-size:25px}
}
@media (prefers-reduced-motion:reduce){.wp-book,.wp-book-page{transition:none}}