/* Variante «cuaderno» de la landing de Prepa (a prueba): hoja rayada con margen, manchas de pintura,
   resaltador y cinta. Se apoya en prepa-landing-familias.css; sólo cambia la piel. */
html{overflow-x:clip}
body{background-color:#fdfcf6;background-image:linear-gradient(90deg,transparent calc(4vw + 22px),#f1a9a9 calc(4vw + 22px),#f1a9a9 calc(4vw + 24px),transparent calc(4vw + 24px)),repeating-linear-gradient(#fdfcf6 0 31px,#d3e0f2 31px 32px)}
.pl-cuaderno{--hand-red:#e4572e;--marker:#ffd23f;--bleed:min(0px,calc((1100px - 100vw) / 2 + 36px))}
.pl-cuaderno .pl-hero,.pl-cuaderno .price-zone{background:transparent;box-shadow:none}
.pl-cuaderno .pl-wrap{position:relative}
.pl-cuaderno .pl-wrap>*:not(.pl-splash):not(.pl-doodle):not(.pl-note){position:relative;z-index:1}
.pl-cuaderno .pl-hero .pl-wrap{display:grid}
/* manchas y garabatos */
.pl-cuaderno .pl-splash{position:absolute;z-index:0;pointer-events:none;opacity:.88}
.pl-cuaderno .sp-hero-a{right:var(--bleed);top:20px;width:min(560px,60vw);transform:rotate(-8deg)}
.pl-cuaderno .sp-hero-b{left:var(--bleed);top:-10px;width:150px;transform:rotate(18deg)}
.pl-cuaderno .sp-hero-c{left:34%;bottom:6px;width:120px;transform:rotate(-20deg)}
.pl-cuaderno .sp-clase{right:2%;top:30px;width:210px;transform:rotate(12deg)}
.pl-cuaderno .sp-leer{left:var(--bleed);top:20px;width:190px;transform:rotate(-12deg)}
.pl-cuaderno .sp-precio{left:var(--bleed);top:40px;width:360px;transform:rotate(-14deg)}
.pl-cuaderno .sp-precio2{right:var(--bleed);bottom:10px;width:230px;transform:rotate(22deg)}
.pl-cuaderno .sp-final{right:4%;top:-50px;width:170px;transform:rotate(-10deg)}
.pl-cuaderno .pl-doodle,.pl-cuaderno .pl-note{position:absolute;pointer-events:none;z-index:2}
.pl-cuaderno .dd-star{width:46px;left:-6px;top:12%;transform:rotate(-12deg)}
.pl-cuaderno .dd-arrow{width:150px;left:40%;bottom:28%;transform:rotate(-6deg)}
.pl-cuaderno .pl-note{font:700 26px/1 var(--font-hand);color:var(--hand-red);transform:rotate(-5deg)}
.pl-cuaderno .dd-note{left:41%;bottom:41%}
/* letra de carpeta y resaltador */
.pl-cuaderno .kicker{font:700 24px/1.1 var(--font-hand);letter-spacing:0;text-transform:none;color:var(--hand-red)}
.pl-cuaderno .pl-hero h1 em{color:var(--ink);background:linear-gradient(transparent 56%,var(--marker) 56%,var(--marker) 92%,transparent 92%);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:0 4px}
.pl-cuaderno .section-head h2{text-decoration:underline;text-decoration-color:#4cc3ff;text-decoration-thickness:5px;text-underline-offset:8px;text-decoration-skip-ink:none}
/* botones y tarjetas tipo figurita */
.pl-cuaderno .pl-btn{border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
.pl-cuaderno .pl-btn:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ink)}
.pl-cuaderno .plan{border:2px solid var(--ink);box-shadow:8px 8px 0 #4cc3ff}
.pl-cuaderno .launch{background:#ff8fc7}
.pl-cuaderno .final-box{background:#ff7a59;border:2px solid var(--ink);box-shadow:8px 8px 0 var(--ink)}
.pl-cuaderno .final-box p{color:#fff3ee}
.pl-cuaderno .final-box .pl-btn{background:#ffd23f}
/* capturas pegadas con cinta */
.pl-cuaderno .fig{position:relative}
.pl-cuaderno .fig::before{content:"";position:absolute;top:-12px;left:50%;width:92px;height:26px;margin-left:-46px;background:rgba(255,210,63,.78);transform:rotate(-4deg);z-index:3;box-shadow:0 2px 4px rgba(0,0,0,.08)}
.pl-cuaderno .fig:nth-child(2)::before{background:rgba(76,195,255,.7);transform:rotate(5deg)}
.pl-cuaderno .fig:nth-child(3)::before{background:rgba(255,143,199,.72);transform:rotate(-2deg)}
.pl-cuaderno .fig:nth-child(4)::before{background:rgba(198,230,79,.8);transform:rotate(3deg)}
.pl-cuaderno .shot{transform:rotate(-1.4deg);border:2px solid var(--ink)}
.pl-cuaderno .fig:nth-child(even) .shot{transform:rotate(1.6deg)}
.pl-cuaderno .chip{border:2px solid var(--ink)}
.pl-cuaderno .faq details{border-bottom:2px dashed #b9c9e6}
@media (max-width:860px){
  .pl-cuaderno .sp-hero-a{right:6px;top:auto;bottom:140px;width:300px}
  .pl-cuaderno .dd-star{display:none}
  .pl-cuaderno .sp-precio{width:220px;left:8px}
  .pl-cuaderno .sp-precio2{width:170px;right:12px}
}
@media (prefers-reduced-motion:reduce){.pl-cuaderno .pl-btn:hover{transform:none}}