/* Mariposas del Alma — estilos. Paleta y estructura heredadas de la dirección "Combinada" de Mente Abierta.
   Cuidado: los SVG de las figuras llevan clases propias (.bg .ink .mut .grid .bar .bar2 .card .cell .line): no usarlas aquí. */
:root{--bg:#fcfbf5;--ink:#18264c;--muted:#67708a;--line:#d9deeb;--azul:#254be8;--azul-osc:#182b91;--amar:#f3ed75;--tarjeta:#eeeddf;--chip:#eef1fb;--enlace:#254be8}
@media (prefers-color-scheme:dark){:root{--bg:#10162b;--ink:#eef0f7;--muted:#a7aec6;--line:#2b3556;--azul:#7a93ff;--tarjeta:#1b2340;--chip:#1d2647;--enlace:#8ea3ff}}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:20px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.6 'Manrope',system-ui,sans-serif}
button,input{font:inherit;color:inherit}button{cursor:pointer;border:0;background:none}a{color:inherit;text-decoration:none}
h1,h2,h3,p{margin:0}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--azul);outline-offset:3px}
img,svg{max-width:100%}
.container{max-width:1280px;width:calc(100% - 80px);margin:auto}
.estrecho{max-width:720px}
.skip{position:fixed;top:-100px;z-index:20;padding:15px;background:#fff;color:#18264c}.skip:focus{top:0}

/* Cabecera */
.masthead{display:flex;align-items:center;gap:28px;padding:24px 0}
.logo{display:inline-flex;align-items:center;gap:10px;white-space:nowrap}
.logo-txt{font:800 30px/1 'Manrope';letter-spacing:-1.4px;color:var(--azul)}
.logo-txt i{font-style:normal;font-weight:500;color:var(--ink);margin-left:.28em;letter-spacing:-1px}
.logo-mark{flex:none}
@media (prefers-color-scheme:dark){.logo-trazo{stroke:#eef0f7}.logo-cuerpo{fill:#eef0f7}}
.lema{font-size:12px;color:var(--muted);line-height:1.7}
.pill{border:1px solid var(--azul);border-radius:30px;padding:11px 18px;font-size:13px;margin-left:auto;min-height:44px;white-space:nowrap;color:var(--azul)}
.pill span{margin-left:10px;font-weight:800}
.pill[aria-pressed=true]{background:var(--azul);color:var(--bg)}
.site-head{position:relative}
.site-head nav{display:flex;gap:28px;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:6px 0;font-size:14px}
.site-head nav>a,.temas-menu>summary{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap;cursor:pointer}
.temas-menu{display:flex;align-items:center}
.temas-menu>summary{list-style:none;gap:8px}
.temas-menu>summary::-webkit-details-marker{display:none}
.temas-menu>summary::after{content:'';width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.temas-menu[open]>summary::after{transform:rotate(225deg)}
.temas-menu[open]>summary{color:var(--azul);font-weight:800}
.temas-panel{position:absolute;left:0;top:100%;z-index:15;width:min(760px,100%);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px 24px;padding:14px 18px;background:var(--bg);border:1px solid var(--line);border-top:0;box-shadow:0 18px 30px -18px #18264c55}
.temas-panel a{display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:44px;font-size:14px;border-bottom:1px solid var(--line)}
.temas-panel a:hover b{color:var(--azul)}
.temas-panel a span{font-size:12px;color:var(--muted)}
.site-head nav a[aria-current]{color:var(--azul);font-weight:800}
.nav-metodo{margin-left:auto}

/* Portada */
.eyebrow{font-size:12px;letter-spacing:1.3px;font-weight:800;text-transform:uppercase;color:var(--azul)}
.eyebrow a:hover{text-decoration:underline}
.feature{display:grid;grid-template-columns:1.05fr 1fr;margin-top:30px;background:#254be8;color:#fff;border-radius:6px;overflow:hidden}
.feature-copy{padding:40px 44px}
.feature .eyebrow{color:#dee5ff}
.feature h1{font:800 clamp(30px,3.5vw,50px)/1.1 'Manrope';letter-spacing:-1.8px;margin:22px 0}
.feature h1 em{font-style:normal;color:#f3ed75}
.feature-copy>p:not(.eyebrow){font-size:15px;line-height:1.75;max-width:460px;color:#e1e7ff}
.yellow-button{display:inline-flex;align-items:center;gap:26px;min-height:48px;border-radius:26px;background:#f3ed75;color:#18264c;font-weight:800;font-size:13px;padding:12px 24px;margin-top:24px}
.yellow-button span{font-size:22px}
.feature small{display:block;font-size:12px;letter-spacing:1px;color:#d9e1ff;margin-top:18px}
.feature-image{position:relative;min-height:380px;display:block;background:#ebe3cb}
.feature-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.questions{padding-top:52px}
.section-title{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:24px}
.section-title h2{font-size:32px;letter-spacing:-1.2px;line-height:1.2;margin-top:8px}
.section-title>span,.section-title>p{font-size:12px;color:var(--muted)}
.topics{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}
.topics>a{display:flex;flex-direction:column;align-items:start;min-height:250px;padding:22px;border-top:4px solid var(--azul);background:var(--tarjeta);transition:transform .2s}
.topics>a:nth-child(even){background:#f3ed75;color:#18264c}
.topics>a:hover{transform:translateY(-4px)}
.topics>a>span{font-size:12px;letter-spacing:1px;font-weight:700;display:flex;justify-content:space-between;width:100%}
.topics b{font-size:18px}
.ico-wrap{display:block;margin:14px 0 10px}
.ico-wrap .ico{width:76px;height:76px}
.ico{--acc:#f3ed75;stroke:var(--azul);stroke-width:2.8;fill:none;stroke-linecap:round;stroke-linejoin:round;display:block}
.ico .acc{fill:var(--acc)}
.ico .pt{fill:var(--azul);stroke:none}
.topics>a:nth-child(even) .ico{--acc:#fff;stroke:#254be8}
.topics>a:nth-child(even) .ico .pt{fill:#254be8}
.temas-panel .ico{--acc:#f3ed75;stroke-width:3.4}
.temas-panel a .pn{display:flex;align-items:center;gap:10px}
.topics h3{font-size:21px;letter-spacing:-.4px;line-height:1.25}
.topics p{font-size:13px;line-height:1.6;margin-top:10px}
.library{padding-top:56px;padding-bottom:50px}
.filters{display:grid;gap:14px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chips button{border-radius:25px;min-height:44px;padding:8px 16px;font-size:13px;border:1px solid var(--line)}
.chips button[aria-pressed=true]{background:var(--azul);color:var(--bg);border-color:var(--azul)}
.search{display:flex;align-items:center;gap:10px;width:100%;max-width:560px}
.search>span{font-size:24px}
.search input{flex:1;width:100%;min-width:0;min-height:48px;border:1px solid var(--line);border-radius:26px;background:var(--bg);padding:0 18px;font-size:15px}
.search input::placeholder{color:var(--muted);opacity:1}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 24px;margin-top:26px}
.content-card{display:flex;flex-direction:column;min-width:0;border-bottom:1px solid var(--line);padding-bottom:14px}
.card-link{display:block}
.card-art{position:relative;aspect-ratio:1200/630;border-radius:12px;overflow:hidden;background:#ebe3cb}
.card-art img{width:100%;height:100%;object-fit:cover;display:block}
.format-label{position:absolute;top:12px;left:12px;background:#fffc;color:#18264c;padding:5px 8px;border-radius:4px;font-size:12px;letter-spacing:1px;font-weight:700}
.content-card .eyebrow{margin:16px 0 8px}
.content-card h3{font-size:23px;line-height:1.2;letter-spacing:-.5px}
.card-link:hover h3{color:var(--azul)}
.card-desc{font-size:14px;color:var(--muted);line-height:1.65;margin-top:10px}
.bookmark{align-self:start;min-height:44px;padding:8px 0;margin-top:auto;font-size:13px;color:var(--muted)}
.bookmark[aria-pressed=true]{color:var(--azul);font-weight:800}
.local-note{font-size:12px;color:var(--muted);padding-top:24px}
#empty{padding:40px 0}#empty h3{font-size:24px}#empty p{font-size:14px;color:var(--muted);margin-top:10px}
.about{background:#182b91;color:#fff;padding:52px 0}
.about>.container{display:grid;grid-template-columns:1fr 2fr;gap:60px;align-items:center}
.about-star{text-align:center}.about-mark{width:150px;height:auto}
.about h2{font-size:36px;letter-spacing:-1.2px;margin:10px 0 20px}
.about .eyebrow{color:#bfcaff}
.about p{font-size:16px;line-height:1.85;max-width:700px}
.about p+p{margin-top:14px}
.about .small{font-size:13px;color:#c3cdf8;margin-top:22px}
.enlace-claro{color:#f3ed75;font-weight:800;text-decoration:underline;text-underline-offset:4px}
footer.container{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:30px 0}
.logo-pie .logo-txt{font-size:22px}
footer p,footer>a:last-child{font-size:12px;color:var(--muted)}
footer p a{text-decoration:underline}
#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);padding:14px 22px;border-radius:30px;background:#18264c;color:#fff;font-size:13px;opacity:0;pointer-events:none;z-index:30;transition:opacity .2s}
#toast.show{opacity:1}

/* Lectura */
#progress{position:fixed;top:0;left:0;height:4px;width:0;background:var(--azul);z-index:25}
.art-head{padding:40px 0 10px}
.art-head h1{font:400 clamp(30px,5vw,46px)/1.15 'DM Serif Display',Georgia,serif;margin:16px 0 12px;letter-spacing:-.3px}
.art-head .sub{font:400 18px/1.55 'DM Sans',sans-serif;color:var(--muted);font-style:italic}
.art-tools{display:flex;align-items:center;gap:8px;margin-top:22px;flex-wrap:wrap}
.art-tools button{min-height:44px;min-width:44px;padding:8px 14px;border:1px solid var(--line);border-radius:24px;font-size:13px;font-weight:700}
.fs-group{display:inline-flex;align-items:center;gap:6px;padding:0 6px 0 14px;border:1px solid var(--line);border-radius:24px}
.fs-label{font-size:13px;font-weight:700;color:var(--muted);margin-right:2px}
.art-tools .fs-btn{min-width:44px;padding:0;border:0;border-radius:50%;font-family:'DM Serif Display',Georgia,serif;font-weight:400;color:var(--ink);display:inline-flex;align-items:center;justify-content:center;line-height:1}
.art-tools .fs-btn:hover{background:var(--chip);color:var(--azul)}
.art-tools .fs-btn:disabled{opacity:.3;cursor:default;background:none;color:var(--ink)}
.fs-menos span{font-size:15px}.fs-mas span{font-size:26px}
.art-tools .bookmark{margin:0;color:var(--azul);border-color:var(--azul)}
.art-tools .bookmark[aria-pressed=true]{background:var(--azul);color:var(--bg)}
.art-cover{margin-top:26px;margin-bottom:10px;max-width:960px}
.art-cover img{display:block;width:100%;height:auto;border-radius:12px;aspect-ratio:1200/630;border:1px solid var(--line)}
.art-cover figcaption,.prose figcaption{font-size:13px;line-height:1.5;color:var(--muted);margin-top:8px}
.art-layout{display:grid;grid-template-columns:230px minmax(0,680px);gap:56px;justify-content:center;margin-top:30px}
.toc{position:sticky;top:20px;align-self:start;font-size:13px}
.toc summary{cursor:pointer;font-weight:800;font-size:12px;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted);min-height:32px}
.toc ol{list-style:none;padding:0;margin:8px 0 0;border-left:2px solid var(--line)}
.toc li a{display:block;padding:6px 0 6px 14px;margin-left:-2px;border-left:2px solid transparent;color:var(--muted);line-height:1.4}
.toc li a:hover,.toc li a.activo{color:var(--azul);border-left-color:var(--azul)}
.prose{font:var(--fs,17px)/1.7 'DM Sans',system-ui,sans-serif}
.prose p{margin:0 0 1.1em}
.prose h2{font:800 1.3em/1.3 'Manrope',sans-serif;margin:2em 0 .6em;letter-spacing:-.3px}
.prose ul,.prose ol{padding-left:1.3em;margin:0 0 1.1em}.prose li{margin:.45em 0}
.prose a{color:var(--enlace)}
.prose a.cita{text-decoration:none;font-size:.82em;font-weight:700;padding:0 .1em}
.prose a.cita:hover{text-decoration:underline}
.prose figure{margin:1.8em 0}
.prose figure svg{display:block;width:100%;height:auto;border-radius:10px;border:1px solid var(--line)}
.prose figure.dato{max-width:460px;margin-left:auto;margin-right:auto}
.metodo .prose{grid-column:1/-1;max-width:720px;margin:0 auto}
.metodo{display:block}
.fuentes{margin-top:50px;padding-top:30px;border-top:1px solid var(--line)}
.fuentes h2{font:800 22px/1.3 'Manrope';margin-bottom:10px}
.fuentes-nota,.ref{font-size:14px;line-height:1.55;color:var(--muted)}
.fuentes-nota a{text-decoration:underline}
.ref{margin:0 0 12px;word-break:break-word}
.ref a{text-decoration:underline}
.ref-n{font-weight:800;color:var(--ink)}
.ref:target{background:#f3ed7566;outline:6px solid #f3ed7566}
.nota-ia{margin-top:28px}
.nota-ia p{font-size:13px;color:var(--muted);background:var(--chip);border-radius:8px;padding:14px 18px;line-height:1.6}
.relacionados{padding:56px 0 20px}
.relacionados h2{font-size:26px;letter-spacing:-.8px}
.cards-rel .content-card:nth-child(n+4){display:none}

/* Móvil */
@media (max-width:1050px){.lema{display:none}.feature-copy{padding:30px}.cards{grid-template-columns:1fr 1fr}.about>.container{grid-template-columns:.5fr 2fr}.art-layout{grid-template-columns:minmax(0,680px);gap:10px}.toc{position:static}.toc ol{margin-bottom:10px}}
@media (max-width:760px){
  .container{width:calc(100% - 36px)}
  .masthead{padding:18px 0;gap:10px}.logo-txt{font-size:21px;letter-spacing:-1px}.logo-mark{width:30px;height:auto}
  .pill{font-size:12px;padding:8px 12px}.pill span{margin-left:6px}
  .site-head nav{gap:18px;font-size:13px}
  .temas-panel{grid-template-columns:1fr;width:100%;max-height:70vh;overflow:auto}
  .feature{display:flex;flex-direction:column;margin-top:18px}.feature-copy{padding:26px 22px}.feature h1{letter-spacing:-1.2px;margin:16px 0}
  .feature-image{min-height:0;aspect-ratio:1200/630}
  .questions{padding-top:36px}.section-title{align-items:start}.section-title h2{font-size:26px}.section-title>span{display:none}.section-title>p{font-size:12px}
  .topics>a{min-height:0;padding:18px}.ico-wrap{margin:10px 0 8px}.ico-wrap .ico{width:60px;height:60px}
  .library{padding-top:36px}.chips{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}.chips button{flex:none}.search{max-width:none}.search input{font-size:16px}
  .cards{grid-template-columns:1fr;gap:26px}.content-card h3{font-size:24px}
  .about{padding:36px 0}.about>.container{display:block}.about-star{display:block;text-align:left;margin-bottom:18px}.about-mark{width:64px}.about h2{font-size:28px}.about p{font-size:15px}
  footer.container{flex-wrap:wrap;gap:16px}footer p{order:3;width:100%}
  .art-head{padding-top:26px}.art-head .sub{font-size:16px}
  #toast{max-width:90%;width:max-content;text-align:center;bottom:15px}
}
@media print{.site-head,footer,.toc,.art-tools,#progress,.relacionados,#toast{display:none}.prose{font-size:12pt}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Insignias de nivel de lectura, sello de fuentes, caja de conclusiones, anterior/siguiente, tarjetas */
.nivel{display:inline-block;font:700 11px/1 Manrope,sans-serif;letter-spacing:.4px;text-transform:uppercase;padding:4px 8px;border-radius:12px;margin:0 4px 0 2px;vertical-align:1px;white-space:nowrap;border:1px solid var(--line);color:var(--muted)}
.nivel-completo{background:var(--azul);color:var(--bg);border-color:var(--azul)}
.nivel-parcial{background:#f3ed75;color:#18264c;border-color:#e0d84a}
.nivel-resumen{background:transparent;color:var(--azul);border-color:var(--azul)}
.nivel-resena,.nivel-noleida{background:var(--chip);color:var(--muted)}
.sello-fuentes{margin:14px 0 0;font-size:14px}
.sello-fuentes a{display:inline-block;padding:8px 14px;border:1px solid var(--line);border-radius:22px;color:var(--muted);background:var(--chip)}
.sello-fuentes a:hover{border-color:var(--azul);color:var(--azul)}
.sello-fuentes strong{color:var(--ink)}
.prose .llevamos{margin:2.2em 0 1em;padding:6px 26px 8px;background:var(--chip);border-left:5px solid var(--azul);border-radius:0 12px 12px 0}
.prose .llevamos h2{margin-top:.9em}
.nav-art{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:44px}
.nav-art a{display:flex;flex-direction:column;gap:4px;padding:16px 18px;border:1px solid var(--line);border-radius:12px}
.nav-art a:hover{border-color:var(--azul)}
.nav-art small{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);font-weight:700}
.nav-art span{font:700 16px/1.3 Manrope,sans-serif}
.na-sig{text-align:right;align-items:flex-end}
.eb-tema{display:flex;align-items:center;gap:8px}
.eb-tema .ico{width:20px;height:20px;stroke-width:3.4;flex:none}
@media (max-width:760px){.nav-art{grid-template-columns:1fr}.na-sig{text-align:left;align-items:flex-start}.prose .llevamos{padding:4px 18px 6px}}

/* Palabras de Cajal */
.about .cajal{margin:22px 0 4px;padding:4px 0 4px 20px;border-left:4px solid #f3ed75;max-width:700px}
.about .cajal p:first-child{font:italic 400 20px/1.5 'DM Serif Display',Georgia,serif;color:#fff}
.cajal-fuente{font-size:13px!important;line-height:1.5!important;color:var(--muted);margin-top:8px}
.about .cajal-fuente{color:#c3cdf8}
.cajal-grande{margin:26px 0;padding:14px 26px 16px;border-left:5px solid var(--azul);background:var(--chip);border-radius:0 12px 12px 0}
.cajal-grande p:first-child{font:400 24px/1.45 'DM Serif Display',Georgia,serif}
.cajal-grande strong{background:linear-gradient(transparent 62%,#f3ed75 62%);font-weight:400}
footer.container{flex-wrap:wrap}
footer .cita-pie{flex-basis:100%;margin:0;padding-top:12px;border-top:1px solid var(--line);font-style:italic}
@media (max-width:760px){.cajal-grande p:first-child{font-size:20px}.cajal-grande{padding:12px 18px}}

/* Pasar el ratón: respuesta clara en tarjetas, enlaces y botones */
.card-art img{transition:transform .4s ease}
.card-art{transition:box-shadow .25s ease}
.card-link:hover .card-art img,.card-link:focus-visible .card-art img{transform:scale(1.045)}
.card-link:hover .card-art,.card-link:focus-visible .card-art{box-shadow:0 10px 26px -12px rgba(24,38,76,.55)}
.card-link:hover h3,.card-link:focus-visible h3{color:var(--azul);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
.content-card{transition:border-color .2s ease}
.content-card:hover{border-bottom-color:var(--azul)}
.prose a:not(.cita){text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.prose a:not(.cita):hover{text-decoration-thickness:2px;background:var(--chip)}
.chips button{transition:background .15s,border-color .15s,color .15s}
.chips button:hover:not([aria-pressed=true]){border-color:var(--azul);color:var(--azul);background:var(--chip)}
.pill{transition:background .15s}
.pill:hover:not([aria-pressed=true]){background:var(--chip)}
.pill[aria-pressed=true]:hover{background:var(--azul-osc)}
.bookmark:hover{color:var(--azul);text-decoration:underline;text-underline-offset:4px}
.art-tools .bookmark:hover:not([aria-pressed=true]){background:var(--chip)}
.site-head nav>a:hover,.temas-menu>summary:hover{color:var(--azul);box-shadow:inset 0 -3px 0 var(--azul)}
.temas-panel a:hover{background:var(--chip)}
.nav-art a:hover span{color:var(--azul)}
.sello-fuentes a:hover{background:var(--bg)}
.yellow-button{transition:transform .15s ease,box-shadow .15s ease}
.yellow-button:hover{transform:translateY(-2px);box-shadow:0 8px 18px -8px rgba(0,0,0,.45)}
.feature-image img{transition:transform .4s ease}
.feature-image:hover img{transform:scale(1.03)}
.feature-image{overflow:hidden}