/* Home page: the RaidCodex Overlay section above the champion finder (scripts/home_overlay.py). Same navy and gold as the header. */
.home-overlay{background:linear-gradient(180deg,#0c182b 0%,#13233c 100%);border-bottom:1px solid #354259;color:#e9edf4}
.ho-inner{max-width:1280px;margin:0 auto;padding:40px clamp(16px,3vw,40px) 44px;box-sizing:border-box}
.ho-hero{display:grid;gap:40px;align-items:center}
.ho-hero.ho-has-shot{grid-template-columns:minmax(0,1fr) minmax(0,560px)}
.ho-hero:not(.ho-has-shot) .ho-text{max-width:760px}
.home-overlay .eyebrow{color:#efc780;margin:0 0 10px}
.ho-title{font-family:Georgia,serif;font-weight:400;font-size:46px;line-height:1.1;letter-spacing:-1px;color:#fff;margin:0 0 14px}
.ho-lead{font-size:18px;line-height:1.55;color:#d6dde8;margin:0 0 16px;max-width:62ch}
.ho-points{list-style:none;margin:0 0 24px;padding:0;display:grid;gap:8px}
.ho-points li{position:relative;padding-left:26px;color:#c9d3e0;line-height:1.45}
.ho-points li::before{content:'';position:absolute;left:4px;top:.5em;width:9px;height:9px;border-radius:2px;background:#efc780;transform:rotate(45deg)}
.ho-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:0 0 16px}
.ho-button,.ho-more{display:inline-flex;align-items:center;min-height:48px;padding:0 22px;border-radius:7px;font-weight:650;text-decoration:none;box-sizing:border-box}
.ho-button{background:#efc780;color:#1b1406;border:1px solid #efc780}
.ho-button:hover{background:#f6d99c;border-color:#f6d99c}
.ho-more{color:#efc780;border:1px solid #6b5a3a;background:transparent}
.ho-more:hover{border-color:#efc780;background:#1d304c}
.ho-links{margin:0;color:#8f9db2;font-size:15px}
.ho-links a,.ho-channel a{color:#efc780;text-underline-offset:3px}
.home-overlay a:focus-visible{outline:2px solid #efc780;outline-offset:3px}
.ho-shot{margin:0}
.ho-zoom{display:block;cursor:zoom-in;border-radius:8px}
.ho-zoom:hover img{border-color:#d5ad6d}
.ho-shot img{display:block;width:100%;height:auto;border-radius:8px;border:1px solid #354259;box-shadow:0 10px 30px #0006;background:#0c182b}
.ho-video img{aspect-ratio:16/9;object-fit:cover;object-position:50% 0}
.ho-shot figcaption{margin-top:8px;font-size:14px;line-height:1.4;color:#a9b6c8}
.ho-gallery{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px}
.ho-gallery figcaption{font-size:15px;margin-top:10px}
.ho-video-list{list-style:none;margin:32px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.ho-sub{font:400 26px/1.2 Georgia,serif;color:#fff;margin:36px 0 0}
.ho-video-list{margin-top:16px}
.ho-video{display:flex;flex-direction:column;gap:6px;height:100%;padding:10px;border:1px solid #354259;border-radius:8px;background:#0f1d33;color:#e9edf4;text-decoration:none}
.ho-video:hover{border-color:#d5ad6d;background:#152842}
.ho-video-thumb{position:relative;display:block}
.ho-video img{display:block;width:100%;height:auto;border-radius:5px}
.ho-video-thumb::before{content:'';position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:#0c182bcc;border:2px solid #efc780;box-sizing:border-box}
.ho-video-thumb::after{content:'';position:absolute;left:50%;top:50%;margin:-12px 0 0 -7px;border-style:solid;border-width:12px 0 12px 20px;border-color:transparent transparent transparent #efc780}
.ho-video:hover .ho-video-thumb::before{background:#1d304ce6}
.ho-video-title{font-weight:600;line-height:1.35}
.ho-video-site{font-size:13px;color:#efc780}
.ho-channel{margin:18px 0 0;font-weight:600}
.ho-lightbox{max-width:none;max-height:none;width:100vw;height:100vh;margin:0;padding:0;border:0;background:transparent;color:#e9edf4}
.ho-lightbox::backdrop{background:#050b16eb}
.ho-lightbox figure{box-sizing:border-box;width:100%;height:100%;margin:0;padding:56px 68px 16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
.ho-lightbox img{display:block;max-width:100%;max-height:calc(100vh - 120px);width:auto;height:auto;border-radius:6px;box-shadow:0 12px 40px #000a}
.ho-lightbox figcaption{max-width:1100px;text-align:center;color:#c9d3e0;font-size:15px}
.ho-lightbox-close{position:fixed;top:10px;right:12px;width:44px;height:44px;padding:0;border-radius:50%;border:1px solid #6b5a3a;background:#12233b;color:#efc780;font-size:28px;line-height:1;cursor:pointer}
.ho-lightbox-nav{position:fixed;top:50%;width:48px;height:64px;margin-top:-32px;padding:0;border-radius:8px;border:1px solid #6b5a3a;background:#12233bd9;color:#efc780;font-size:38px;line-height:1;cursor:pointer}
.ho-lightbox-prev{left:10px}
.ho-lightbox-next{right:10px}
.ho-lightbox-nav:hover{background:#1d304c;border-color:#efc780}
.ho-lightbox-close:hover{background:#1d304c;border-color:#efc780}
/* The finder heading keeps its earlier look now that it is an <h2> (it was the page's <h1>). */
.home-title{font-family:Georgia,serif;font-weight:400;letter-spacing:-1px}
.home-title{scroll-margin-top:12px}
@media (max-width:979px){
  .ho-hero.ho-has-shot{grid-template-columns:minmax(0,1fr)}
  .ho-hero{gap:28px}
  .ho-title{font-size:36px}
  .ho-video-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .ho-lightbox figure{padding:56px 8px 84px}
  .ho-lightbox-nav{top:auto;bottom:14px;margin-top:0;height:52px}

  .ho-inner{padding:28px 16px 32px}
  .ho-title{font-size:31px}
  .ho-lead{font-size:16.5px}
  .ho-actions{flex-direction:column;align-items:stretch}
  .ho-button,.ho-more{justify-content:center}
  .ho-video-list{grid-template-columns:minmax(0,1fr);gap:20px}
  .ho-gallery{grid-template-columns:minmax(0,1fr);gap:28px}
  .ho-gallery figcaption{font-size:14.5px}
}