/* Holy Cross Learn: learning hub, class pages, live classes. Uses the theme colour variables. */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.learn-home{padding:clamp(40px,6vw,76px) 0;background:linear-gradient(180deg,color-mix(in srgb,var(--c-primary) 6%,#fff),#fff)}
.learn-home .lh-head{text-align:center;max-width:720px;margin:0 auto 28px}
.learn-home .sub{margin:0 0 6px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.8rem;color:var(--c-primary)}
.lh-classes{display:grid;grid-template-columns:repeat(auto-fit,minmax(86px,1fr));gap:12px;margin:26px 0}
.lh-classes a{display:flex;flex-direction:column;align-items:center;padding:14px 8px;border-radius:var(--r-md,16px);background:#fff;border:1px solid var(--line,#dde);text-decoration:none;color:var(--c-dark);transition:transform .2s,box-shadow .2s}
.lh-classes a:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(11,29,54,.12)}
.lh-classes strong{font:700 1.7rem/1 var(--f-head);color:var(--c-primary)}
.lh-classes span{font-size:.78rem;opacity:.75}
.lh-feat{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:26px}
.lh-feat div{padding:16px;border-radius:var(--r-md,16px);background:color-mix(in srgb,var(--c-accent) 14%,#fff)}
.lh-feat strong{display:block;color:var(--c-dark)}.lh-feat span{font-size:.92rem;opacity:.85}
.center{text-align:center}
/* live */
.live-strip{margin:0 0 34px}
.live-strip-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.live-strip-head h2{margin:0;font-size:clamp(1.3rem,3vw,1.7rem)}
.live-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:16px}
.live-card{padding:18px;border-radius:var(--r-lg,24px);background:#fff;border:1px solid var(--line,#dde);box-shadow:0 10px 28px rgba(11,29,54,.06)}
.live-card h3{margin:.5em 0 .3em;font-size:1.15rem}.live-card h3 a{color:var(--c-dark);text-decoration:none}
.live-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.live-class{font-weight:600;font-size:.85rem;color:var(--c-primary)}
.live-badge{display:inline-flex;align-items:center;gap:.45em;padding:.25em .75em;border-radius:99px;font-size:.78rem;font-weight:700;background:#eef1f6;color:#44506a}
.live-badge i{width:8px;height:8px;border-radius:50%;background:currentColor}
.st-live{border-color:#e5484d;box-shadow:0 0 0 3px rgba(229,72,77,.15),0 10px 28px rgba(11,29,54,.08)}
.st-live .live-badge{background:#e5484d;color:#fff}.st-live .live-badge i{background:#fff;animation:lv 1.2s infinite}
.st-soon .live-badge{background:#fff3d6;color:#8a5a00}
.st-ended{opacity:.85}
@keyframes lv{50%{opacity:.25}}
.live-meta{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0 0 12px;font-size:.9rem;color:color-mix(in srgb,var(--c-text) 80%,white)}
.live-act{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.live-count{font-weight:600;font-size:.9rem;color:var(--c-primary);margin-right:auto}
.live-act [hidden]{display:none!important}
.live-id{padding:12px 16px;border-radius:12px;background:#f3f6fb;margin:16px 0}
.live-single .learn-video{margin:18px 0}
/* hub */
.learn-search{display:flex;gap:10px;max-width:640px;margin:0 auto 26px}
.learn-search input,.lf-q{flex:1;min-width:0;padding:.8em 1.1em;border:2px solid var(--line,#dde);border-radius:12px;font:inherit;font-size:16px;background:#fff}
.learn-search input:focus,.lf-q:focus{border-color:var(--c-primary);outline:0}
.learn-level{margin:34px 0 14px;font-size:1.3rem;display:flex;align-items:center;gap:10px}
.learn-level:after{content:"";flex:1;height:1px;background:var(--line,#dde)}
.class-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.class-card{display:flex;flex-direction:column;gap:2px;padding:18px;border-radius:var(--r-lg,24px);text-decoration:none;color:#fff;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s;background:var(--c-primary)}
.class-card:hover{transform:translateY(-4px);box-shadow:0 16px 32px rgba(11,29,54,.22)}
.class-card.lv-0{background:linear-gradient(135deg,#e8a33d,#d9762b)}
.class-card.lv-1{background:linear-gradient(135deg,var(--c-primary),color-mix(in srgb,var(--c-primary) 60%,#000))}
.class-card.lv-2{background:linear-gradient(135deg,#2f7d9a,#1d4f6e)}
.class-card.lv-3{background:linear-gradient(135deg,#5b4bb3,#33276e)}
.cc-num{font:700 2.6rem/1 var(--f-head);opacity:.95}.class-card strong{color:#fff;font-size:1.05rem}.class-card em{font-style:normal;font-size:.82rem;opacity:.85}
.learn-latest{margin-top:44px}
/* cards */
.learn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px}
.learn-card{display:flex;flex-direction:column;border-radius:var(--r-md,16px);overflow:hidden;background:#fff;border:1px solid var(--line,#dde);text-decoration:none;color:var(--c-text);transition:transform .2s,box-shadow .2s}
.learn-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(11,29,54,.12)}
.lc-cover{position:relative;aspect-ratio:3/2;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#dfe8f5,#c9d7ee);overflow:hidden}
.lc-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lc-cover b{font:700 3.4rem/1 var(--f-head);color:rgba(11,29,54,.35)}
.lc-cover em{position:absolute;left:10px;top:10px;font-style:normal;font-size:.72rem;font-weight:700;padding:.25em .7em;border-radius:99px;background:#fff;color:var(--c-dark)}
.t-textbook{background:linear-gradient(135deg,#f6e3bd,#ecc77f)}.t-video-lesson{background:linear-gradient(135deg,#f9d4d4,#eea0a0)}
.t-activity,.t-worksheet{background:linear-gradient(135deg,#d6f0df,#a5dcb8)}.t-syllabus{background:linear-gradient(135deg,#dcd6f5,#b9aeea)}
.lc-tick{position:absolute;right:10px;top:10px;width:26px;height:26px;border-radius:50%;background:#1a9d5c;color:#fff;display:none;align-items:center;justify-content:center;font-weight:700}
.is-done .lc-tick{display:flex}
.lc-body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:3px}
.lc-body strong{color:var(--c-dark);line-height:1.3}.lc-sub{font-size:.85rem;opacity:.75}
/* filters */
.lf-bar{display:flex;flex-direction:column;gap:12px;margin:0 0 20px}
.lf-chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.lf-chips button{flex:none;padding:.5em 1em;border-radius:99px;border:1px solid var(--line,#cdd5e3);background:#fff;font:600 .9rem var(--f-body);cursor:pointer;color:var(--c-dark)}
.lf-chips button.on{background:var(--c-primary);border-color:var(--c-primary);color:#fff}
.progress-card{display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:16px 20px;border-radius:var(--r-md,16px);background:color-mix(in srgb,var(--c-primary) 7%,#fff);margin-bottom:18px}
.progress-card span{display:block;font-size:.85rem;opacity:.75}
.pbar{flex:1;min-width:160px;height:10px;border-radius:99px;background:#dbe3ef;overflow:hidden}.pbar i{display:block;height:100%;width:0;background:#1a9d5c;transition:width .4s}
.class-jump{display:flex;flex-wrap:wrap;gap:8px;margin-top:40px;padding-top:22px;border-top:1px solid var(--line,#dde)}
.class-jump a{padding:.4em .9em;border-radius:99px;background:#eef2f9;text-decoration:none;font-weight:600;font-size:.9rem}.class-jump a.on{background:var(--c-primary);color:#fff}
/* single */
.learn-single{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:30px;align-items:start}
.learn-video{position:relative;aspect-ratio:16/9;border-radius:var(--r-md,16px);overflow:hidden;background:#000;margin-bottom:20px}
.learn-video iframe,.learn-video video{position:absolute;inset:0;width:100%;height:100%;border:0}
.pdf-read{margin:20px 0}.pdf-read summary{cursor:pointer;font-weight:700;padding:12px 0}.pdf-read iframe{width:100%;height:75vh;border:1px solid var(--line,#dde);border-radius:12px}
.side-card{position:sticky;top:90px;display:flex;flex-direction:column;gap:10px;padding:20px;border-radius:var(--r-lg,24px);background:#fff;border:1px solid var(--line,#dde)}
.side-card h2{font-size:1.1rem;margin:0}.side-card dl{margin:8px 0 0;display:grid;grid-template-columns:auto 1fr;gap:6px 12px;font-size:.92rem}.side-card dt{font-weight:700}.side-card dd{margin:0}
.btn-done.is-on{background:#1a9d5c;color:#fff}
.quiz{margin-top:28px;padding:22px;border-radius:var(--r-lg,24px);background:#f4f7fc}
.quiz h2{margin-top:0}.quiz ol{padding-left:1.2em}.quiz li{margin-bottom:18px}.quiz li p{font-weight:600;margin:0 0 6px}
.quiz label{display:flex;gap:8px;align-items:center;padding:.45em .7em;border-radius:10px;cursor:pointer}.quiz label:hover{background:#e6edf8}
.quiz li.ok label.picked{background:#d6f0df}.quiz li.bad label.picked{background:#f9d4d4}.quiz li.bad label.right{background:#d6f0df}
.quiz-score{font-weight:700;margin-left:10px}
@media(max-width:860px){.learn-single{grid-template-columns:1fr}.side-card{position:static}.lh-feat{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.learn-grid{grid-template-columns:1fr 1fr;gap:12px}.lc-cover b{font-size:2.4rem}.lh-feat{grid-template-columns:1fr}.learn-search{flex-direction:column}.live-grid{grid-template-columns:1fr}}
/* smart reader */
.reader{margin:20px 0;border:1px solid var(--line,#dde);border-radius:var(--r-md,16px);background:#eef1f6;overflow:hidden}
.reader:fullscreen{background:#1b2230;display:flex;flex-direction:column;border-radius:0}
.rd-bar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:center;padding:10px;background:#fff;border-bottom:1px solid var(--line,#dde)}
.rd-bar button{min-width:40px;padding:.45em .8em;border:1px solid var(--line,#cdd5e3);border-radius:10px;background:#fff;font:600 .95rem var(--f-body);cursor:pointer;color:var(--c-dark)}
.rd-bar button:hover{background:var(--c-primary);color:#fff}
.rd-pg{display:inline-flex;align-items:center;gap:6px;font-weight:600;margin:0 6px}.rd-pg input{width:62px;padding:.4em;border:1px solid var(--line,#cdd5e3);border-radius:8px;font-size:16px;text-align:center}
.rd-stage{position:relative;overflow:auto;max-height:78vh;min-height:300px;padding:10px;text-align:center;-webkit-overflow-scrolling:touch}
.reader:fullscreen .rd-stage{flex:1;max-height:none}
.rd-stage canvas{max-width:none;background:#fff;box-shadow:0 6px 24px rgba(11,29,54,.18)}
.rd-msg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;margin:0;font-weight:600}.rd-msg[hidden]{display:none}
.rd-foot{margin:0;padding:10px 14px;font-size:.88rem;text-align:center;background:#fff}

/* 3.6: short real text on Learn pages (helps Google understand them) */
.hcm-note{background:#f6f8fc;border-bottom:1px solid #e3e8f2;padding:16px 0}
.hcm-note p{margin:0;max-width:820px;line-height:1.7;color:#33415c}
.hcm-note--item{margin-top:26px;border:1px solid #e3e8f2;border-radius:14px;padding:18px 20px}
.hcm-note--item h2{margin:0 0 8px;font-size:1.15rem}
.hcm-note-links{margin-top:10px!important;font-weight:600}
.hcm-note-links a{color:inherit;text-decoration:underline}
