/* ReconRelay videos hub and product-page video embeds (scripts/videos.mjs). Brand colour comes from
   --rr-brand in the restore CSS on every page. */
.rr-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.rr-videos-page .container,.rr-video-section .container{max-width:1200px;}
.rr-videos-hero{text-align:center;max-width:820px;margin:10px auto 36px;}
.rr-videos-hero h1{font-size:2.2em;line-height:1.25;margin:0 0 16px;letter-spacing:normal;text-transform:none;}
.rr-videos-intro{font-size:1.1em;line-height:1.7;margin:0 0 18px;}
.rr-videos-group{margin:0 0 48px;}
.rr-videos-group h2,.rr-video-section-title{font-size:1.75em;line-height:1.3;margin:0 0 14px;letter-spacing:normal;text-transform:none;}
.rr-video-section-title{text-align:center;}
.rr-video-section-intro{text-align:center;max-width:760px;margin:0 auto 20px;}
.rr-videos-sub{font-size:1.2em;margin:26px 0 14px;letter-spacing:normal;text-transform:none;}
.rr-video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px;margin:0;padding:0;}
.rr-video-section .rr-video-grid{grid-template-columns:repeat(auto-fit,minmax(260px,420px));justify-content:center;}
.rr-video-card{display:flex;flex-direction:column;background:#fff;color:#333;border:1px solid rgba(0,0,0,.1);border-radius:10px;overflow:hidden;box-shadow:0 4px 18px rgba(0,0,0,.06);min-width:0;}
.rr-yt{position:relative;aspect-ratio:16/9;background:#000;overflow:hidden;}
.rr-yt img{display:block;width:100%;height:100%;object-fit:cover;margin:0;border-radius:0;}
.rr-yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.rr-yt-play{position:absolute;inset:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:transparent;border:0;padding:0;margin:0;cursor:pointer;}
.rr-yt-play svg{width:68px;height:48px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35));transition:transform .15s ease;}
.rr-yt-play .rr-yt-bg{fill:#212121;fill-opacity:.85;transition:fill .15s ease;}
.rr-yt-play:hover .rr-yt-bg,.rr-yt-play:focus-visible .rr-yt-bg{fill:#f00;fill-opacity:1;}
.rr-yt-play:hover svg{transform:scale(1.06);}
.rr-yt-play:focus-visible{outline:3px solid var(--rr-brand,#5259a7);outline-offset:-3px;}
.rr-video-body{padding:14px 16px 16px;display:flex;flex-direction:column;flex:1;}
.rr-video-title{font-size:1.05em;line-height:1.35;margin:0 0 6px;letter-spacing:normal;text-transform:none;overflow-wrap:anywhere;}
.rr-video-meta{font-size:.85em;opacity:.75;margin:0 0 8px;}
.rr-video-desc{font-size:.95em;line-height:1.5;margin:0 0 12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.rr-video-link{margin-top:auto;font-weight:600;color:var(--rr-brand,#5259a7)!important;}
.rr-video-more{text-align:center;margin:20px 0 0;}
.rr-video-more a{font-weight:600;color:var(--rr-brand,#5259a7);}
.rr-video-empty{font-style:italic;opacity:.85;}
.rr-follow{list-style:none!important;margin:8px 0 0!important;padding:0!important;display:flex;flex-wrap:wrap;gap:8px;}
.rr-follow li{list-style:none;margin:0;padding:0;}
.rr-reel-grid{list-style:none!important;margin:16px 0 20px!important;padding:0!important;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;}
.rr-reel-grid li{list-style:none;margin:0;padding:0;}
.rr-reel-card{display:flex;flex-direction:column;height:100%;box-sizing:border-box;padding:16px;border-radius:10px;border:1px solid rgba(0,0,0,.1);background:linear-gradient(135deg,rgba(82,89,167,.08),rgba(214,41,118,.07));color:#333!important;text-decoration:none!important;}
.rr-reel-card:hover,.rr-reel-card:focus-visible{border-color:var(--rr-brand,#5259a7);}
.rr-reel-kicker{font-size:.8em;text-transform:uppercase;letter-spacing:.04em;opacity:.75;margin-bottom:8px;}
.rr-reel-caption{line-height:1.5;margin-bottom:12px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;}
.rr-reel-cta{margin-top:auto;font-weight:600;color:var(--rr-brand,#5259a7);}
.rr-videos-cta{margin-top:18px;}
.rr-videos-cta a{color:var(--rr-brand,#5259a7);font-weight:600;}
@media (max-width:767px){
  /* The restored theme keeps a fixed ~160px header on phones without offsetting #main, which hides
     the first heading on every page (pre-existing, site-wide). Offset the hub only. */
  .rr-videos-page{padding-top:150px;}
  #top .rr-videos-hero h1{font-size:28px;}
  .rr-videos-group h2,.rr-video-section-title{font-size:1.4em;}
  .rr-video-grid,.rr-video-section .rr-video-grid{grid-template-columns:1fr;gap:18px;}
  .rr-reel-grid{grid-template-columns:1fr;}
}
