*{box-sizing:border-box;margin:0;padding:0}body,html{width:100%;height:100%;font-family:Poppins,sans-serif}.background{background:url(/sources/Portada.png) 50%/100% 100% no-repeat;justify-content:flex-start;align-items:stretch;width:100%;min-height:100vh;display:flex;overflow:hidden}.nav-bar{background:linear-gradient(90deg,#0009,#d4af371a);flex-direction:column;justify-content:flex-start;align-items:center;width:100%;max-width:400px;height:100%;padding:5px 30px 90px 5px;display:flex;overflow-y:hidden}.nav-link{color:#e0e0e0;text-align:center;text-align:center;white-space:nowrap;text-overflow:ellipsis;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#49320499;border:1px solid #d4af374d;border-radius:15px;justify-content:center;align-items:center;width:90%;height:auto;min-height:50px;margin:5px 0;padding:15px;text-decoration:none;transition:all .3s;display:flex;overflow:hidden;box-shadow:0 10px 30px #00000080}.title{color:#faa303;margin-bottom:.01px;font-size:2.2rem}.logo img{width:100px;margin-bottom:1px}.stage{color:#fff;background:#000;flex-direction:column;justify-content:flex-start;align-items:center;width:100vw;height:100vh;padding:40px 20px;display:flex;overflow-y:auto}.stage p{max-width:700px;margin:10px 0;line-height:1.6}.introduccion{background:url(/sources/Introduccion.png) 50%/cover no-repeat}.puerta{background:url(/sources/Puerta.png) 50%/cover no-repeat}.atrio{background:url(/sources/Atrio.png) 50%/cover no-repeat}.lugar-santo{background:url(/sources/Lugar-Santo.png) 50%/cover no-repeat}.lugar-santisimo{background:url(/sources/Lugar-Santisimo.png) 50%/cover no-repeat}.final{background:url(/sources/Final.png) 50%/cover no-repeat}ul{margin-left:20px}.reading{color:#ff9e01;min-height:100vh;padding:80px 20px}.reading-container{max-width:800px;margin:0 auto;font-size:18px;line-height:1.7}.reading h1{margin-bottom:20px;font-size:2.5rem}.reading h2{color:#ff9e01;margin-top:40px;margin-bottom:15px}.lesson-nav{z-index:100;color:#f70303;flex-direction:row;gap:10px;display:flex;position:fixed;top:40px;right:80px}.lesson-nav a{color:#fbfafa;background:#d4af378b;border-radius:6px;padding:8px 12px;text-decoration:none}.lesson:before{content:"";z-index:-1;background:#f3f3f399;position:fixed;inset:0}.content{max-width:700px;line-height:1.7}h1{color:#d4af37;margin-bottom:20px;font-size:2.5rem}h2,h3{color:#d4af37;margin-top:40px;margin-bottom:10px}.lead{margin-bottom:20px;font-size:1.2rem}.reading ul{margin:20px 0;padding-left:20px}.reading li{margin:10px 0}.reading blockquote{background:#341c026e;border-left:4px solid #d4af37;margin:.2px 0;padding:5px;font-style:italic}.reading p{margin:15px 0}.progress-container{z-index:100;background:#fff3;width:100%;height:5px;position:fixed;top:0;left:0}.progress-bar{background:#d4af37;height:5px;transition:width .4s}.grid{grid-template-columns:1fr;display:grid}.threeColumns{grid-template-columns:1.2fr 2fr 1.2fr;align-items:start;gap:30px;height:auto;padding:40px;display:grid}.col{-webkit-backdrop-filter:blur(10px);color:#e0e0e0;background:#140f0599;border:1px solid #d4af374d;border-radius:15px;padding:25px;line-height:1.8;box-shadow:0 10px 30px #00000080}.reading-container{width:100%;max-width:1200px}.final-screen{color:#d4af37;text-align:center;z-index:2000;background:#000;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.final-screen h1{margin-bottom:20px;font-size:3rem}.final-screen p{max-width:500px;margin-bottom:30px}.final-screen button{color:#000;cursor:pointer;background:#d4af37;border:none;padding:12px 24px}.btn{z-index:1;-webkit-backdrop-filter:blur(10px);color:#fdfffe;cursor:pointer;text-shadow:0 2px 4px #00000080;background:#fcb9031a;border:1px solid #fff3;border-radius:10px;justify-content:center;align-items:center;padding:12px 20px;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;box-shadow:0 4px 15px #0003}.btn:hover{background:#fcb90333;border-color:#fff6;transform:translateY(-2px);box-shadow:0 8px 25px #0000004d}.btn:active{transform:translateY(0)}.btn-full{width:90%;height:50px}.btn-block{width:100%}.btn-fixed{height:50px}.btn-success{z-index:30;background:#2ecc7166;border-color:#2ecc71}.btn-error{z-index:30;background:#e74c3c66;border-color:#e74c3c}.btn:disabled{opacity:1;cursor:default}.final{background:url(/sources/Final.png) top/cover no-repeat;flex-direction:column;justify-content:flex-start;align-items:center;width:100%;min-height:100vh;padding:100px 20px;display:flex}.final h1{color:#d4af37;text-shadow:2px 2px 4px #000000b3;font-size:3rem}.final p{color:#fff;text-shadow:2px 2px 4px #000000b3;max-width:600px;font-size:1.2rem;line-height:1.6}.final .btn{margin-top:20px}.nav-link.locked{-webkit-backdrop-filter:blur(12px);pointer-events:none;border-radius:10px;align-items:center;min-width:120px;padding:10px 15px;text-decoration:none;display:inline-flex;position:relative;-webkit-backdrop-filter:blur(12px)!important;backdrop-filter:blur(12px)!important;color:#ffffffd6!important;background:#ff9d0002!important;border:1px solid #ffbc022e!important;overflow:visible!important}.nav-link.locked:after{content:"🔒";vertical-align:middle;margin-left:10px;font-size:1rem;display:inline-block;opacity:1!important;visibility:visible!important}.resaltado{color:#d4af37;font-weight:700}.transicion{letter-spacing:1px;color:#d4af37;font-weight:700}.p-glass{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0003;border:1px solid #d4af371a;border-radius:10px;margin:15px 0;padding:15px 20px}.p-p-glass{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#fcb10321;border:1px solid #d4af371a;border-radius:10px;margin:15px 0;padding:15px 20px}.ul-p-p-glass{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#fcb10300;border:1px solid #d4af37b3;border-radius:10px;margin:15px 0;padding:15px 20px}.lead-p-glass{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0003;border:1px solid #d4af371a;border-radius:10px;margin:15px 0;padding:15px 20px;display:inline-block}.word-card{-webkit-backdrop-filter:blur(3px);color:#fab803;vertical-align:middle;background:#d4af3726;border:1px solid #d4af374d;border-radius:4px;margin:0 1px;padding:1px 6px;font-weight:600;display:inline-block}.word{color:#fab803;font-weight:600}.div .p-p-glass{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#fcb10321;border:1px solid #d4af371a;border-radius:10px;margin:15px 0;padding:15px 20px}@media (max-width:768px){.nav-bar{z-index:10;will-change:auto;-webkit-backdrop-filter:none;backdrop-filter:none;position:relative;top:0;left:0;transform:none}.progress-container{z-index:999;width:100%;position:absolute;top:60px}.content,.reading-container{box-sizing:border-box;margin-top:110px;padding:0 20px}.back-button{z-index:1001;margin-bottom:20px;display:inline-block;position:relative}.portada,.introduccion,.puerta,.atrio,.lugar-santo,.lugar-santisimo,.final{background-position:50%;background-repeat:no-repeat;background-size:cover;min-height:300px}.background{flex-direction:column;min-height:100vh;display:flex;background:url(/sources/Portada-movil.png) 50%/cover no-repeat!important}.introduccion{background-image:url(/sources/Introduccion-movil.png)}.puerta{background-image:url(/sources/Puerta-movil.png)}.atrio{background-image:url(/sources/Atrio-movil.png)}.lugar-santo{background-image:url(/sources/Lugar-Santo-movil.png)}.lugar-santisimo{background-image:url(/sources/Lugar-Santisimo-movil.png)}.final{background-image:url(/sources/Final-movil.png);background-position:top}.glass-modal{width:85%;padding:20px}}.modal-overlay{z-index:99999;isolation:isolate;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;inset:0}.glass-modal{-webkit-backdrop-filter:blur(15px);text-align:center;color:#fff;background:#ffffff1a;border:1px solid #fff3;border-radius:20px;max-width:320px;padding:30px;box-shadow:0 8px 32px #000c}.glass-modal h2{color:#fa9c05;text-shadow:0 0 10px #fa9c054d;letter-spacing:1px;text-transform:uppercase;margin-top:0;font-size:1.6rem}.glass-modal p{text-align:left;margin:15px 0;font-size:.9rem;line-height:1.5}.btn-entrar{color:#fff;cursor:pointer;text-transform:uppercase;background:linear-gradient(135deg,#fa9c0533,#fa9c0566);border:1px solid #fa9c05;border-radius:12px;margin-top:20px;padding:12px 25px;font-size:1rem;font-weight:600;transition:all .3s;box-shadow:0 4px 15px #fa9c0533}.btn-entrar:hover{color:#000;background:#fa9c05;transform:translateY(-2px);box-shadow:0 0 20px #fa9c0599}.glass-modal p strong{color:#fa9c05}
