/* ===== Ảnh đầu trang: Đức Phật dưới cội Bồ-đề (dùng chung cho trang Pāḷi và Vi Diệu Pháp) =====
   Logo + tên trang ở khoảng sáng giữa ảnh; các trang học ở góc trên bên phải, tài khoản ở góc dưới bên phải;
   Đức Phật lấp lánh và bấm vào để chiêm ngưỡng ảnh lớn. */
.buddhaWrap{max-width:1180px;margin:0 auto;padding:12px 20px 0}
.buddhaTop{position:relative;border-radius:18px;overflow:hidden;border:1px solid #ead7b0;box-shadow:0 10px 28px rgba(150,105,30,.16);background:#fdf8ec;color:#2d241d}
.buddhaTop .btPic{position:relative}
.buddhaTop .btBg{display:block;width:100%;height:auto;aspect-ratio:1600/438}
.buddhaTop .btName{position:absolute;top:12%;bottom:14%;left:36%;right:12%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:4px;padding:0 8px;pointer-events:none}
.buddhaTop .btHom{font-family:"Noto Serif",Georgia,serif;font-size:clamp(9px,1vw,12.5px);letter-spacing:.12em;color:#a8792c;font-weight:700}
.buddhaTop .btHomT{font-family:"Noto Serif",Georgia,serif;font-size:clamp(9px,1vw,13px);color:#8a6a35;font-style:italic;margin-bottom:4px}
.buddhaTop .btBrand{display:flex;align-items:center;justify-content:center;gap:clamp(8px,1.4vw,16px)}
.buddhaTop .btLogo{display:block;flex:none;width:auto;height:clamp(34px,6.4vw,86px);filter:url(#logoPaper) drop-shadow(0 2px 4px rgba(120,80,20,.22))}
/* Chữ "Thừa Tự Pháp" ngay dưới logo */
.buddhaTop .btLogoBox{display:flex;flex-direction:column;align-items:center;gap:2px;flex:none}
.buddhaTop .btLogoCap{font-family:"Noto Serif",Georgia,serif;font-weight:700;font-size:clamp(8px,1.05vw,13px);letter-spacing:.04em;color:#8b2b22;white-space:nowrap;text-shadow:0 1px 0 rgba(255,255,255,.7)}
@media(max-width:380px){.buddhaTop .btBrand{gap:6px}.buddhaTop .btLogo{height:30px}.buddhaTop .btLogoCap{font-size:7px;letter-spacing:0}.buddhaTop .btBrand .btTitle{font-size:17px}}
.buddhaTop .btTxt{display:flex;flex-direction:column;align-items:center}
.buddhaTop .btTitle{margin:0;padding:0;text-align:center;font-family:"Noto Serif",Georgia,serif;font-weight:800;font-size:clamp(19px,3.8vw,46px);line-height:1.05;letter-spacing:.05em;color:#8b2b22;text-shadow:0 2px 0 rgba(255,255,255,.75),0 0 18px rgba(255,236,190,.9)}
.buddhaTop .btSub{margin-top:6px;padding-top:6px;font-family:"Noto Serif",Georgia,serif;font-size:clamp(11px,1.4vw,16px);color:#6b4a1f;font-style:italic;background:linear-gradient(90deg,transparent,#d4a017,transparent) top center/80% 2px no-repeat}
/* Đức Phật lấp lánh */
.buddhaTop .btGlow,.buddhaTop .btRays,.buddhaTop .btSpark{position:absolute;pointer-events:none}
.buddhaTop .btGlow{left:15.2%;top:44%;width:14%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,246,200,.9) 0,rgba(255,222,120,.55) 38%,rgba(255,210,90,0) 70%);mix-blend-mode:screen;animation:btPulse 3.4s ease-in-out infinite}
@keyframes btPulse{0%,100%{opacity:.35;transform:translate(-50%,-50%) scale(.9)}50%{opacity:.95;transform:translate(-50%,-50%) scale(1.12)}}
.buddhaTop .btRays{left:15.2%;top:44%;width:30%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:repeating-conic-gradient(rgba(255,228,150,.55) 0 5deg,rgba(255,228,150,0) 5deg 16deg);-webkit-mask-image:radial-gradient(circle,transparent 22%,#000 30%,transparent 68%);mask-image:radial-gradient(circle,transparent 22%,#000 30%,transparent 68%);mix-blend-mode:screen;opacity:.55;animation:btSpin 22s linear infinite}
@keyframes btSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.buddhaTop .btSpark{color:#ffd45c;line-height:1;text-shadow:0 0 6px rgba(255,214,90,.95),0 0 14px rgba(255,190,40,.7);opacity:0;animation:btTwinkle 2.6s ease-in-out infinite;font-size:clamp(9px,1.3vw,18px)}
.buddhaTop .btSpark.s1{left:14.6%;top:13%}
.buddhaTop .btSpark.s2{left:21.5%;top:27%;animation-delay:.6s;font-size:clamp(7px,.9vw,13px)}
.buddhaTop .btSpark.s3{left:8.2%;top:33%;animation-delay:1.2s}
.buddhaTop .btSpark.s4{left:23.5%;top:52%;animation-delay:1.8s;font-size:clamp(7px,.9vw,12px)}
.buddhaTop .btSpark.s5{left:6.5%;top:58%;animation-delay:.9s;font-size:clamp(7px,1vw,14px)}
@keyframes btTwinkle{0%,100%{opacity:0;transform:scale(.3) rotate(0)}35%{opacity:1;transform:scale(1.2) rotate(25deg)}60%{opacity:.8;transform:scale(.95) rotate(45deg)}}
.buddhaTop .btPic::after{content:'';position:absolute;top:0;bottom:0;left:-20%;width:16%;background:linear-gradient(105deg,transparent,rgba(255,252,235,.55) 50%,transparent);transform:skewX(-18deg);animation:btSweep 7s ease-in-out infinite;pointer-events:none}
@keyframes btSweep{0%,60%{left:-20%}100%{left:40%}}
/* Vùng bấm vào Đức Phật */
.buddhaTop .btHot{position:absolute;left:6%;top:24%;width:19%;height:76%;border:0;padding:0;background:none;cursor:zoom-in;border-radius:40% 40% 12px 12px}
.buddhaTop .btHot:focus-visible{outline:2px dashed #d4a017;outline-offset:2px}
.buddhaTop .btHot::after{content:attr(data-hint);position:absolute;left:50%;bottom:4%;transform:translateX(-50%);white-space:nowrap;background:rgba(60,35,10,.72);color:#fff6df;border-radius:999px;padding:3px 10px;font:600 12px/1.3 Inter,system-ui,sans-serif;opacity:0;transition:opacity .2s}
.buddhaTop .btHot:hover::after,.buddhaTop .btHot:focus-visible::after{opacity:1}
/* Các trang học (trên phải) + tài khoản (dưới phải) — không đè lên Đức Phật */
.buddhaTop .btTop{position:absolute;z-index:2;top:9px;right:10px;display:flex;align-items:center;justify-content:flex-end}
.buddhaTop .btTop .siteSwitch{margin:0;padding:0;max-width:none;gap:4px;justify-content:flex-end;flex-wrap:nowrap;font-size:12px}
.buddhaTop .btTop .ssLabel{display:none}
.buddhaTop .btTop .ssLink{padding:3px 9px 3px 3px;font-size:12px;white-space:nowrap}
.buddhaTop .btTop .ssLink i{min-width:22px;height:22px;font-size:11px}
.buddhaTop .btAcc{position:absolute;z-index:2;right:10px;bottom:9px;display:flex;justify-content:flex-end}
.buddhaTop .btAcc>*{margin:0;display:flex;align-items:center;gap:6px;flex-wrap:nowrap;max-width:min(560px,60vw);padding:3px 4px 3px 10px;border:1px solid #ecd9b0;border-radius:999px;background:rgba(255,250,236,.9);box-shadow:0 2px 8px rgba(120,80,20,.12);color:#5a4630;font-size:12px;text-align:left;white-space:nowrap}
.buddhaTop .btAcc>*:empty{display:none}
.buddhaTop .btAcc>* span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.buddhaTop .btAcc b{color:#2d241d}
.buddhaTop .btAcc button,.buddhaTop .btAcc a{padding:3px 10px;font-size:12px;line-height:1.3;border-radius:999px;white-space:nowrap}
@media(max-width:1000px){.buddhaTop .btTop,.buddhaTop .btAcc{position:static;justify-content:center;background:#fdf8ec;padding:7px 10px 0}.buddhaTop .btAcc{padding:6px 10px 8px;border-bottom:1px solid #f0e2c2}.buddhaTop .btTop .siteSwitch{flex-wrap:wrap;justify-content:center}.buddhaTop .btAcc>*{flex-wrap:wrap;justify-content:center;white-space:normal;max-width:none;background:none;border:0;box-shadow:none;padding:0;text-align:center}.buddhaTop .btName{top:0;bottom:0}}
/* Điện thoại: trên ảnh giữ logo, tên trang và dòng phụ; dòng kính lễ chuyển xuống dải ngay dưới ảnh cho dễ đọc */
.buddhaTop .btMob{display:none}
@media(max-width:600px){.buddhaWrap{padding:10px 12px 0}.buddhaTop .btName{left:33%;right:3%;gap:2px}.buddhaTop .btName .btHom,.buddhaTop .btName .btHomT{display:none}.buddhaTop .btSub{margin-top:3px;padding-top:3px;font-size:10.5px}.buddhaTop .btHot::after{display:none}.buddhaTop .btMob{display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;padding:8px 12px 10px;background:linear-gradient(#fbf3df,#f6e9cc);border-top:1px solid #ecd9b0}.buddhaTop .btMob .btHom{font-size:10.5px;letter-spacing:.08em;line-height:1.35}.buddhaTop .btMob .btHomT{font-size:11.5px;margin:0;line-height:1.35}}
/* Trang Vi Diệu Pháp: nút ◐ đổi nền ghim ở góc trên bên phải → lùi các nút trang học vào */
.buddhaWrap.vdp{max-width:1120px;padding:12px 12px 0}
@media(min-width:1001px){.buddhaWrap.vdp .buddhaTop .btTop{right:62px}}
@media(max-width:1000px){.buddhaWrap.vdp .buddhaTop .btTop{padding-right:56px}}
/* Cửa sổ chiêm ngưỡng ảnh lớn */
.btLight{border:0;padding:0;background:transparent;max-width:none;max-height:none;width:100%;height:100%;overflow:auto}
.btLight::backdrop{background:rgba(22,13,4,.86)}
.btLight[open]{display:flex;align-items:center;justify-content:center}
.btLightIn{position:relative;margin:auto;padding:16px;display:flex;flex-direction:column;align-items:center;gap:14px;max-width:min(96vw,1120px)}
.btLightIn img{display:block;width:100%;height:auto;max-height:76vh;object-fit:contain;border-radius:14px;animation:btBreath 8s ease-in-out infinite}
@keyframes btBreath{0%,100%{box-shadow:0 0 18px rgba(255,200,80,.25)}50%{box-shadow:0 0 46px rgba(255,210,100,.7)}}
.btLightCap{margin:0;max-width:820px;text-align:center;color:#fff3d6;font-family:"Noto Serif",Georgia,serif;font-size:clamp(15px,2.1vw,21px);line-height:1.55;font-style:italic;text-shadow:0 1px 6px rgba(0,0,0,.5)}
.btLightX{position:absolute;top:2px;right:2px;width:38px;height:38px;border-radius:999px;border:1px solid rgba(255,255,255,.5);background:rgba(0,0,0,.45);color:#fff;font-size:18px;cursor:pointer}
@media(prefers-reduced-motion:reduce){.buddhaTop .btGlow,.buddhaTop .btRays,.buddhaTop .btSpark,.buddhaTop .btPic::after,.btLightIn img{animation:none}.buddhaTop .btSpark,.buddhaTop .btPic::after{display:none}}