:root{color-scheme:light;--ink:#192f27;--forest:#14352c;--paper:#f9f5eb;--sand:#eee8da;--orange:#f2a46d;--line:#a9a99a;--muted:#48564e}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-padding-top:1rem}
body{margin:0;color:var(--ink);background:var(--paper);font:1.05rem/1.65 system-ui,sans-serif}
a{color:inherit;text-underline-offset:.23em}
a:hover{text-decoration-thickness:.14em}
:focus-visible{outline:3px solid currentColor;outline-offset:4px}
.skip{position:absolute;left:1rem;top:1rem;z-index:2;padding:.5rem 1rem;background:var(--paper);transform:translateY(-200%)}
.skip:focus{transform:none}
.shell{width:min(74rem,calc(100% - 3rem));margin-inline:auto}
.mast{background:var(--paper);border-bottom:1px solid var(--line)}
.bar,.bar nav,.actions{display:flex;align-items:center;flex-wrap:wrap;gap:.6rem 1.2rem}
.bar{justify-content:space-between;padding-block:.9rem}
.bar a{padding:.2rem 0;font-size:.94rem}
.brand{font-weight:800;text-decoration:none}
.mark{display:inline-block;margin-right:.3rem;color:#9b4a20}
.hero,.programs,.site-footer{background:var(--forest);color:var(--paper)}
.hero-grid{display:grid;grid-template-columns:1fr .9fr;align-items:center;gap:clamp(1.5rem,5vw,5rem);padding-block:clamp(3rem,8vw,7rem)}
h1,h2,h3,p,figure{margin:0}
h1,h2,h3{font-family:Georgia,serif;font-weight:500;line-height:1.09}
h1{font-size:clamp(3rem,7.2vw,6.4rem);letter-spacing:-.055em;max-width:10ch}
h2{font-size:clamp(2rem,4.5vw,4.15rem);letter-spacing:-.04em}
h3{font-size:1.48rem}
p+ p,h3+ p,h2+ p,p+ol{margin-top:.75rem}
.eyebrow,.tag{font-size:.77rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin-bottom:.65rem}
.hero .eyebrow,.programs .eyebrow,.site-footer .eyebrow{color:var(--orange)}
.intro,.lede{font-size:clamp(1.07rem,2vw,1.28rem);max-width:52ch;margin-top:1rem}
.actions{margin-top:1.5rem}
.button{display:inline-flex;gap:.7rem;padding:.65rem 1.15rem;border-radius:2rem;background:var(--orange);color:var(--ink);font-weight:750}
.dark{background:var(--forest);color:var(--paper)}
.hero-art svg{display:block;width:100%;height:auto}
figcaption,.metadata{font-size:.86rem;color:var(--muted);margin-top:.65rem}
.hero figcaption{color:#dfdacb}
.section{padding-block:clamp(2.5rem,7vw,5.5rem)}
.three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1.5rem}
.three>article{padding:1.25rem;border:1px solid var(--line);border-radius:.6rem}
.collection{background:var(--sand)}
.editorial article{background:var(--paper)}
.tag{color:#80421e}
.filters{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.4rem;align-items:end}
.filters label{display:grid;gap:.15rem;font-size:.88rem;font-weight:650;min-width:0}
.filters input,.filters select,.filters button{max-width:100%;min-height:2.65rem;font:inherit;color:var(--ink);background:var(--paper);border:1px solid #64736a;border-radius:.3rem;padding:.35rem .55rem}
.filters button{cursor:pointer}
.query{flex:1 1 12rem}
#result-count{margin-top:.8rem;font-size:.88rem}
.routes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2.25rem 3.5rem}
.routes section{border-top:1px solid var(--line);padding-top:1.1rem}
.routes h2,.site-footer h2{font-size:clamp(1.65rem,3vw,2.55rem)}
.routes p:last-of-type{margin-bottom:.6rem}
.program-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 3rem;padding-left:1.75rem;margin:1.6rem 0 0}
.program-list li{padding:.8rem .2rem;border-top:1px solid #819a8d}
.program-list li::marker{color:var(--orange)}
.program-list a{font-weight:750}
.program-list p{margin-top:.15rem;color:#ebe9dd}
.site-footer .section{padding-block:2rem}
.site-footer .three{gap:1.5rem}
.site-footer h2{font-size:1.45rem}
.site-footer p{font-size:.94rem}
@media(max-width:52rem){.hero-grid{grid-template-columns:1fr}.hero-art{max-width:32rem}}
@media(max-width:41rem){.shell{width:calc(100% - 2rem)}.three,.routes,.program-list{grid-template-columns:1fr}.bar nav{gap:.2rem .9rem}}
.product{max-width:48rem}
.product h1{max-width:16ch;font-size:clamp(2.6rem,7vw,5rem)}
.product h2{font-size:clamp(1.5rem,3vw,2rem)}
.exercise{padding-left:1.55rem}
.exercise li,.prompts{border-top:1px solid var(--line);margin-top:1.5rem;padding-top:1rem}
.exercise blockquote{margin: .7rem 0;font:1.25rem/1.5 Georgia,serif}
.exercise details{padding:.65rem .9rem;background:var(--sand);border-radius:.4rem}
.exercise summary{cursor:pointer;font-weight:650}
.exercise details p{margin-top:.5rem}
#note-form{margin-top:1rem}
#note{display:block;width:100%;margin-top:.3rem;padding:.7rem;font:inherit;color:inherit;background:#fffdf7;border:1px solid #64736a;border-radius:.4rem}
#note-form button{font:inherit;font-weight:700;cursor:pointer;border:1px solid var(--forest)}
#note-status{margin-top:.6rem}

.product audio{display:block;width:min(100%,32rem)}

.participate-actions{flex-wrap:nowrap;gap:.55rem}
.participate-actions>.button{align-items:center;justify-content:center;min-height:44px;padding:.45rem .75rem;text-align:center;line-height:1.2}
.social-links{display:flex;gap:.35rem;flex:none}
.social-links a{display:grid;place-items:center;width:44px;height:44px;border:1px solid #64736a;border-radius:50%}
.social-links a:hover{background:var(--sand)}
.social-links svg{width:23px;height:23px}

.activity-link{margin-top:1rem}

#ficha-piloto{display:grid;gap:.8rem;margin-top:1rem;max-width:34rem}
#ficha-piloto label{display:grid;gap:.25rem;font-weight:650}
#ficha-piloto input,#ficha-piloto textarea{width:100%;padding:.45rem .6rem;font:inherit;color:inherit;background:#fffdf7;border:1px solid #64736a;border-radius:.35rem}
#ficha-piloto button{font:inherit;font-weight:700;cursor:pointer;border:1px solid var(--forest)}
#reporte-piloto{margin:1rem 0;padding:1rem;background:var(--sand);border-radius:.4rem}
#texto-piloto{font:inherit;white-space:pre-wrap;overflow-wrap:anywhere}
