/* ============================================================
   SaluVista — Results gallery (before/after photos + video results)
   Loads AFTER saluvista-theme.css + site.css on the results pages only.
   Same design language: brand blues, .5px borders, 16px radii,
   cubic-bezier(.2,.7,.2,1) motion, reduced-motion safe, RTL safe.
   ============================================================ */

/* ---------- Trust note ---------- */
.rg-trust{display:flex;align-items:flex-start;gap:10px;}
.rg-trust svg{flex:0 0 auto;width:20px;height:20px;margin-top:2px;}

/* ---------- Filter chips (mirrors the surgeons department filter) ---------- */
.rg-filter{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 4px;}
.rg-chip{font-family:var(--salu-font);font-size:14px;font-weight:500;color:var(--salu-ink);background:#fff;border:1px solid var(--salu-border);padding:9px 18px;border-radius:999px;cursor:pointer;transition:background .22s ease,color .22s ease,border-color .22s ease,box-shadow .22s ease,transform .22s ease;}
.rg-chip:hover{border-color:var(--salu-blue-lilac);color:var(--salu-blue);transform:translateY(-1px);}
.rg-chip:focus-visible{outline:2px solid var(--salu-blue);outline-offset:2px;}
.rg-chip.is-active{background:var(--salu-blue);border-color:var(--salu-blue);color:#fff;box-shadow:0 8px 20px rgba(39,62,212,.26);}

/* ---------- Photo grid (masonry via columns — cards keep intrinsic ratio) ---------- */
.rg-grid{columns:3 300px;column-gap:18px;margin-top:26px;}
.rg-card{break-inside:avoid;-webkit-column-break-inside:avoid;margin:0 0 18px;border:.5px solid var(--salu-border);border-radius:16px;overflow:hidden;background:#fff;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;}
.rg-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(39,62,212,.12);border-color:var(--salu-blue-lilac);}
.rg-card.is-hidden{display:none;}
.rg-card.is-filtering{animation:rg-in .46s cubic-bezier(.2,.7,.2,1) both;}
@keyframes rg-in{from{opacity:0;transform:translateY(16px) scale(.97);}to{opacity:1;transform:none;}}

.rg-zoom{display:block;width:100%;padding:0;border:0;background:#F3F4FD;cursor:zoom-in;position:relative;line-height:0;}
.rg-zoom img{width:100%;height:auto;display:block;}
.rg-zoom::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 72%,rgba(16,24,74,.16));opacity:0;transition:opacity .22s ease;}
.rg-zoom:hover::after,.rg-zoom:focus-visible::after{opacity:1;}
.rg-zoom .rg-expand{position:absolute;inset-inline-end:10px;bottom:10px;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.94);box-shadow:0 4px 14px rgba(16,24,74,.18);display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(6px);transition:opacity .22s ease,transform .22s cubic-bezier(.2,.7,.2,1);}
.rg-zoom:hover .rg-expand,.rg-zoom:focus-visible .rg-expand{opacity:1;transform:none;}
.rg-expand svg{width:15px;height:15px;}

.rg-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 16px 13px;}
.rg-label{font-size:14px;font-weight:600;color:var(--salu-ink);line-height:1.35;}
.rg-link{font-size:12.5px;font-weight:500;color:var(--salu-blue);white-space:nowrap;transition:transform .2s cubic-bezier(.2,.7,.2,1);}
.rg-card:hover .rg-link{transform:translateX(3px);}
[dir="rtl"] .rg-card:hover .rg-link{transform:translateX(-3px);}

/* ---------- Video results ---------- */
.rg-videos-h{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:600;color:var(--salu-ink);margin:44px 0 6px;font-family:var(--salu-font-head);}
.rg-videos-h svg{flex:0 0 auto;width:22px;height:22px;}
.rg-videos-h.is-hidden{display:none;}
.rg-vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:18px;margin-top:20px;}
.rg-vcard{border:.5px solid var(--salu-border);border-radius:16px;overflow:hidden;background:#fff;margin:0;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;}
.rg-vcard:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(39,62,212,.12);border-color:var(--salu-blue-lilac);}
.rg-vcard.is-hidden{display:none;}
.rg-vcard.is-filtering{animation:rg-in .46s cubic-bezier(.2,.7,.2,1) both;}
.rg-vcard .rg-meta{padding:11px 14px 12px;}
.rg-vcard .rg-label{font-size:13px;}
.rg-vbadge{font-size:11px;font-weight:600;color:var(--salu-blue);background:var(--salu-tint-1);padding:3px 10px;border-radius:20px;white-space:nowrap;}

.rg-vfacade{position:relative;display:block;width:100%;aspect-ratio:9/16;padding:0;border:0;background:var(--salu-navy-deep);cursor:pointer;overflow:hidden;line-height:0;}
.rg-vfacade img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.2,.7,.2,1);}
.rg-vfacade:hover img{transform:scale(1.045);}
.rg-vfacade::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(16,24,74,.06) 0%,transparent 34%,transparent 62%,rgba(16,24,74,.38) 100%);}
.rg-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:1;}
.rg-play span{width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.94);box-shadow:0 10px 26px rgba(16,24,74,.32);display:flex;align-items:center;justify-content:center;transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s ease;}
.rg-vfacade:hover .rg-play span,.rg-vfacade:focus-visible .rg-play span{transform:scale(1.1);box-shadow:0 14px 32px rgba(16,24,74,.4);}
.rg-play svg{width:20px;height:20px;margin-inline-start:3px;}
.rg-viframe{display:block;width:100%;aspect-ratio:9/16;border:0;background:#000;}

/* ---------- Lightbox ---------- */
.rg-lightbox{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100%;height:100%;overflow:visible;}
.rg-lightbox::backdrop{background:rgba(16,24,74,.82);backdrop-filter:blur(7px);}
.rg-lightbox[open]{display:flex;align-items:center;justify-content:center;}
.rg-lb-fig{margin:0;display:flex;flex-direction:column;align-items:center;gap:14px;max-width:min(92vw,1200px);}
.rg-lb-fig img{max-width:100%;max-height:82vh;width:auto;height:auto;border-radius:14px;box-shadow:0 30px 90px rgba(0,0,0,.45);background:#fff;}
.rg-lb-fig figcaption{color:#EAF0FF;font-size:14.5px;font-weight:500;text-align:center;}
.rg-lightbox[open] .rg-lb-fig{animation:rg-lb-in .32s cubic-bezier(.2,.7,.2,1) both;}
@keyframes rg-lb-in{from{opacity:0;transform:scale(.955);}to{opacity:1;transform:none;}}
.rg-lb-btn{position:fixed;z-index:2;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:var(--salu-navy);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 26px rgba(0,0,0,.3);transition:background .18s ease,transform .18s ease;}
.rg-lb-btn:hover{background:#fff;transform:scale(1.07);}
.rg-lb-btn:focus-visible{outline:2px solid #fff;outline-offset:3px;}
.rg-lb-btn svg{width:19px;height:19px;}
.rg-lb-close{top:18px;right:18px;}
.rg-lb-prev{left:16px;top:50%;margin-top:-22px;}
.rg-lb-next{right:16px;top:50%;margin-top:-22px;}

/* ---------- Responsive ---------- */
@media(max-width:640px){
  .rg-grid{columns:2 160px;column-gap:12px;}
  .rg-card{margin-bottom:12px;}
  .rg-meta{flex-direction:column;align-items:flex-start;gap:3px;padding:10px 12px 12px;}
  .rg-label{font-size:13px;}
  .rg-vgrid{grid-template-columns:repeat(2,1fr);gap:12px;}
  .rg-lb-prev{left:8px;}
  .rg-lb-next{right:8px;}
  .rg-lb-close{top:10px;right:10px;}
  .rg-lb-fig img{max-height:74vh;}
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .rg-chip:hover,.rg-card:hover,.rg-vcard:hover,.rg-card:hover .rg-link,[dir="rtl"] .rg-card:hover .rg-link,.rg-vfacade:hover img,.rg-vfacade:hover .rg-play span,.rg-lb-btn:hover{transform:none;}
  .rg-card.is-filtering,.rg-vcard.is-filtering,.rg-lightbox[open] .rg-lb-fig{animation:none;}
  .rg-zoom .rg-expand{transition:opacity .2s ease;transform:none;}
}