/* Self-contained styles for the DetailReel component so it works on any page
   (photography details section AND the Real Weddings universal-moments strip). */
.detailreel{position:relative;margin-top:6px;overflow:hidden;cursor:grab;perspective:1400px;touch-action:pan-y;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.detailreel.dragging{cursor:grabbing}
.detailreel-track{display:flex;gap:22px;width:-moz-max-content;width:max-content;padding:36px 0;transform-style:preserve-3d;will-change:transform}
.detailreel .dr-card{position:relative;flex:0 0 auto;width:clamp(210px,23vw,272px);aspect-ratio:4/5;border-radius:10px;overflow:hidden;border:1px solid var(--hair,rgba(246,241,230,.12));background:#0c1c15;box-shadow:0 34px 66px -32px rgba(0,0,0,.72);transform-style:preserve-3d;will-change:transform,opacity;-moz-user-select:none;user-select:none;-webkit-user-select:none}
.detailreel .dr-card .ph{position:absolute;inset:0;background-size:cover;background-position:center 30%;background-color:#0c1c15;pointer-events:none}
.detailreel .dr-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent 50%,rgba(8,12,9,.86))}
.detailreel .dr-cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:16px;font-size:var(--fs-label);letter-spacing:.16em;text-transform:uppercase;color:var(--cream,#F6F1E6);font-family:'Lato',-apple-system,sans-serif}
.detailreel .dr-hint{position:relative;display:block;margin-top:14px;text-align:center;z-index:3;font-size:var(--fs-label);letter-spacing:.3em;text-transform:uppercase;color:var(--faint,rgba(246,241,230,.34));pointer-events:none;font-family:'Lato',-apple-system,sans-serif}
@media(max-width:640px){.detailreel .dr-card{width:clamp(168px,58vw,220px)}}
@media(prefers-reduced-motion:reduce){.detailreel{perspective:none;cursor:default;overflow-x:auto}.detailreel-track{padding:14px 0}.detailreel .dr-card{transform:none!important;opacity:1!important}}