.page{max-width:48rem;margin:0 auto;padding:2.5rem 1.25rem 4.5rem}
.crumbs{font-size:.8rem;color:var(--muted-foreground);margin-bottom:1.75rem}
.crumbs a:hover{color:var(--primary)}
.crumbs span{margin:0 .4rem;opacity:.6}
.page h1{font-family:'Playfair Display',Georgia,serif;font-weight:500;font-size:clamp(1.9rem,5vw,2.7rem);line-height:1.15;color:var(--primary)}
.page .lead{margin-top:1.25rem;font-size:1.1rem;line-height:1.7;color:var(--muted-foreground)}
.page h2{font-family:'Playfair Display',Georgia,serif;font-weight:500;font-size:1.6rem;line-height:1.25;color:var(--primary);margin-top:2.75rem}
.page p{margin-top:1rem;line-height:1.75;color:var(--muted-foreground)}
.page a.inline{color:var(--primary);text-decoration:underline;text-underline-offset:3px}
.page figure{margin:2rem 0 0}
.page figure img{width:100%;max-height:26rem;object-fit:cover;border-radius:1.5rem;box-shadow:var(--shadow-soft)}
.page ul.checks{margin:1rem 0 0;padding:0;list-style:none;display:grid;gap:.65rem}
.page ul.checks li{position:relative;padding-left:1.5rem;line-height:1.6;color:var(--muted-foreground)}
.page ul.checks li::before{content:"";position:absolute;left:0;top:.62em;width:.55rem;height:.55rem;border-radius:999px;background:var(--primary);opacity:.55}
.page .cta-row{margin-top:2.25rem;display:flex;flex-wrap:wrap;gap:.75rem}
.page .btn{display:inline-block;border-radius:999px;background:var(--primary);color:var(--primary-foreground);padding:.85rem 1.75rem;font-size:.9rem;font-weight:500;box-shadow:var(--shadow-soft);transition:opacity .2s}
.page .btn:hover{opacity:.9}
.page .btn-ghost{display:inline-block;border-radius:999px;border:1px solid var(--border);color:var(--primary);padding:.85rem 1.75rem;font-size:.9rem;font-weight:500}
.page .btn-ghost:hover{background:var(--sand)}
.page .note{margin-top:2.75rem;padding:1.1rem 1.25rem;border-radius:1rem;background:var(--sand);font-size:.875rem;line-height:1.65;color:var(--muted-foreground)}
.page .info{margin-top:1.25rem;padding:1.25rem 1.5rem;border-radius:1rem;border:1px solid var(--border);background:var(--card);display:grid;gap:.5rem;font-size:.95rem;color:var(--muted-foreground)}
.page .info strong{color:var(--primary);font-weight:500}
.page .related{margin-top:1.25rem;display:grid;gap:.75rem}
@media(min-width:640px){.page .related{grid-template-columns:repeat(3,1fr)}}
.page .related a{display:block;padding:1.1rem 1.25rem;border-radius:1rem;border:1px solid var(--border);background:var(--card);color:var(--primary);font-size:.95rem;line-height:1.4;transition:background .2s}
.page .related a:hover{background:var(--sand)}
.page .related small{display:block;margin-top:.35rem;font-size:.8rem;color:var(--muted-foreground)}

/* Sección "Sobre mí" de la portada */
.about{max-width:44rem;margin:0 auto}
.about-head{display:flex;align-items:center;gap:1.25rem}
.about-photo img{display:block;width:6.5rem;height:6.5rem;flex:none;object-fit:cover;border-radius:999px;box-shadow:var(--shadow-soft)}
@media(min-width:768px){.about-photo img{width:8rem;height:8rem}}
.about-text p{margin-top:1.25rem;line-height:1.75;color:var(--muted-foreground)}
.about-list{margin:1.5rem 0 0;padding:0;list-style:none;display:grid;gap:.7rem}
.about-list li{position:relative;padding-left:1.5rem;line-height:1.6;font-size:.95rem;color:var(--muted-foreground)}
.about-list li::before{content:"";position:absolute;left:0;top:.62em;width:.55rem;height:.55rem;border-radius:999px;background:var(--primary);opacity:.55}
