/* Welcomeju: recent photos carousel (scroll-snap + assets/js/carousel.js) */
.wj-carousel{ --gap:18px; --per:3; position:relative; margin-top:.5rem; }
.wj-carousel__viewport{ overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; scroll-behavior:smooth; overscroll-behavior-x:contain;
  scrollbar-width:none; -webkit-overflow-scrolling:touch; border-radius:18px; outline:none; padding:4px 2px 10px; }
.wj-carousel__viewport::-webkit-scrollbar{ display:none; }
.wj-carousel__viewport:focus-visible{ box-shadow:0 0 0 3px rgba(91,141,184,.45); }
.wj-carousel__track{ display:flex; gap:var(--gap); list-style:none; margin:0; padding:0; }
.wj-carousel__slide{ flex:0 0 calc((100% - (var(--per) - 1) * var(--gap)) / var(--per)); scroll-snap-align:start; margin:0; min-width:0; }
.wj-carousel__link{ display:block; position:relative; border-radius:16px; overflow:hidden; background:#E6F0F8; text-decoration:none!important;
  border:1px solid #D5E2ED; box-shadow:0 1px 2px rgba(43,58,74,.04),0 6px 20px rgba(63,110,152,.08);
  transition:transform 260ms cubic-bezier(.22,.61,.36,1), box-shadow 260ms cubic-bezier(.22,.61,.36,1); }
.wj-carousel__media{ display:block; aspect-ratio:16/10; overflow:hidden; background:linear-gradient(135deg,#E6F0F8,#D8E7F3); }
.wj-carousel__media img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform 500ms cubic-bezier(.22,.61,.36,1), filter 260ms; }
.wj-carousel__caption{ position:absolute; left:0; right:0; bottom:0; padding:2.4rem 1rem .85rem; display:flex; flex-direction:column; gap:.2rem;
  background:linear-gradient(180deg,rgba(43,58,74,0) 0%,rgba(43,58,74,.38) 45%,rgba(35,55,78,.72) 100%); color:#fff; }
.wj-carousel__board{ font-size:.74rem; letter-spacing:.03em; color:#DCEAF6; font-weight:600; }
.wj-carousel__title{ font-size:.98rem; font-weight:700; line-height:1.4; color:#fff; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  text-shadow:0 1px 2px rgba(0,0,0,.25); }
.wj-carousel__link:focus-visible{ outline:3px solid #5B8DB8; outline-offset:2px; }

/* prev / next */
.wj-carousel__btn{ position:absolute; top:calc(50% - 26px); transform:translateY(-50%); width:44px; height:44px; border-radius:50%; border:1px solid #D5E2ED;
  background:rgba(255,255,255,.92); color:#3F6E98; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:2;
  box-shadow:0 6px 18px rgba(63,110,152,.18); transition:background 200ms, color 200ms, transform 200ms; padding:0; }
.wj-carousel__btn[hidden]{ display:none; }
.wj-carousel__btn svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.wj-carousel__btn--prev{ left:-18px; } .wj-carousel__btn--next{ right:-18px; }
.wj-carousel__btn:focus-visible{ outline:3px solid #5B8DB8; outline-offset:2px; }

/* dots */
.wj-carousel__dots{ display:flex; justify-content:center; gap:8px; margin-top:.9rem; min-height:10px; }
.wj-carousel__dot{ width:8px; height:8px; border-radius:999px; border:0; padding:0; background:#C9DBEA; cursor:pointer; transition:width 260ms, background 260ms; }
.wj-carousel__dot[aria-current="true"]{ width:24px; background:#5B8DB8; }
.wj-carousel__dot:focus-visible{ outline:2px solid #3F6E98; outline-offset:3px; }

@media (hover:hover) and (pointer:fine){
  .wj-carousel__link:hover{ transform:translateY(-4px); box-shadow:0 14px 34px rgba(63,110,152,.18); }
  .wj-carousel__link:hover .wj-carousel__media img{ transform:scale(1.05); filter:brightness(1.04) saturate(1.05); }
  .wj-carousel__btn:hover{ background:#5B8DB8; color:#fff; border-color:#5B8DB8; }
  .wj-carousel__dot:hover{ background:#8FB2D1; }
}
@media (max-width:960px){ .wj-carousel{ --per:2; } }
@media (max-width:640px){
  .wj-carousel{ --per:1; --gap:12px; }
  .wj-carousel__slide{ flex-basis:86%; }
  .wj-carousel__btn{ width:38px; height:38px; }
  .wj-carousel__btn--prev{ left:6px; } .wj-carousel__btn--next{ right:6px; }
}
@media (prefers-reduced-motion:reduce){
  .wj-carousel__viewport{ scroll-behavior:auto; }
  .wj-carousel__link,.wj-carousel__media img,.wj-carousel__dot,.wj-carousel__btn{ transition:none!important; }
  .wj-carousel__link:hover,.wj-carousel__link:hover .wj-carousel__media img{ transform:none!important; }
}
