/* Screens carousel + lightbox — full-width, 3 large cards */
.screens-full{margin-top:40px;grid-column:1 / -1}
.screens-full > h2{margin-top:0;margin-bottom:18px}

.screen-carousel{position:relative;user-select:none;padding:0 52px}
.carousel-viewport{overflow:hidden;border-radius:0;border:0;background:transparent}
.carousel-track{display:flex;gap:18px;transition:transform .35s ease;will-change:transform}
.carousel-slide{
  flex:0 0 calc((100% - 36px) / 3);
  margin:0;padding:0;border:0;background:#fff;cursor:zoom-in;display:block;
  border-radius:14px;overflow:hidden;border:1px solid var(--line);
  box-shadow:0 8px 24px rgba(29,39,70,.08);transition:transform .2s,box-shadow .2s;
}
.carousel-slide:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(29,39,70,.14)}
.carousel-slide img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}

.carousel-nav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:44px;height:44px;border-radius:50%;border:0;
  background:rgba(29,39,70,.92);color:#fff;font-size:24px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm);
}
.carousel-nav:hover{background:var(--brand)}
.carousel-nav:disabled{opacity:.35;cursor:default;background:rgba(29,39,70,.55)}
.carousel-nav.prev{left:0}
.carousel-nav.next{right:0}

.carousel-dots{display:flex;gap:8px;justify-content:center;margin-top:18px}
.carousel-dots button{width:9px;height:9px;border-radius:50%;border:0;background:#c5d0db;cursor:pointer;padding:0}
.carousel-dots button.on{background:var(--brand);width:22px;border-radius:999px}

.screen-lightbox{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:24px}
.screen-lightbox.open{display:flex}
.lightbox-backdrop{position:absolute;inset:0;background:rgba(20,27,51,.72);backdrop-filter:blur(4px)}
.lightbox-dialog{position:relative;z-index:1;width:min(1100px,96vw);max-height:90vh;background:#fff;border-radius:16px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;overflow:hidden}
.lightbox-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);background:#f8fbf9}
.lightbox-toolbar span{font-size:14px;font-weight:600;color:var(--ink-2)}
.lightbox-close{width:36px;height:36px;border-radius:50%;border:0;background:var(--chip);color:var(--ink);font-size:22px;cursor:pointer;line-height:1}
.lightbox-close:hover{background:var(--brand-soft);color:var(--brand-ink)}
.lightbox-scroll{overflow:auto;max-height:calc(90vh - 60px);-webkit-overflow-scrolling:touch;overscroll-behavior:contain;background:#eef2f5}
.lightbox-scroll img{display:block;width:100%;height:auto}
.lightbox-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:0;background:rgba(29,39,70,.9);color:#fff;font-size:24px;cursor:pointer;z-index:2;display:flex;align-items:center;justify-content:center}
.lightbox-nav.prev{left:12px}
.lightbox-nav.next{right:12px}
.lightbox-nav:hover{background:var(--brand)}
body.lightbox-open{overflow:hidden}

@media (max-width:900px){
  .screen-carousel{padding:0 44px}
  .carousel-slide{flex:0 0 calc((100% - 18px) / 2)}
}
@media (max-width:560px){
  .screen-carousel{padding:0 40px}
  .carousel-slide{flex:0 0 100%}
  .carousel-nav{width:36px;height:36px;font-size:18px}
  .lightbox-nav{width:36px;height:36px}
}
