/* Photos slider */
.photos-slider {
  overflow: visible !important;
}
.photos-slider .slick-list {
  overflow: visible;
}
.photos-slider .slick-track {
  display: flex !important;
}
.photos-slider .slick-slide {
  height: inherit !important;
  padding: 0 8px;
}
.photos-slider .slick-slide > div {
  height: 100%;
}

/* Photos slider wrapper - hide default cursor on desktop */
.photos-slider-wrapper {
  cursor: none;
}
.photos-slider-wrapper * {
  cursor: none !important;
}
@media (max-width: 768px) {
  .photos-slider-wrapper {
    cursor: auto;
  }
  .photos-slider-wrapper * {
    cursor: auto !important;
  }
}

/* Photos custom cursor - matches services cursor style */
.photos-cursor {
  position: fixed;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: #333333;
  color: #fff;
  font-weight: 600;
  font-size: 0.875rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 50;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0);
  transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1),
    opacity 0.3s ease,
    background-color 0.3s ease;
  will-change: transform, opacity;
}
.photos-cursor.active {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

/* Cursor arrows */
.photos-cursor-arrows {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  transition: opacity 0.2s ease, transform 0.2s ease, gap 0.2s ease;
}

/* Zoom icon - hidden by default */
.photos-cursor-zoom {
  position: absolute;
  opacity: 0;
  transform: scale(0.8);
  transition: opacity 0.2s ease, transform 0.2s ease;
}

/* Hover mode - show zoom with primary color */
.photos-cursor.hover-mode {
  background: #c8102e;
}
.photos-cursor.hover-mode .photos-cursor-arrows {
  opacity: 0;
  transform: scale(0.8);
}
.photos-cursor.hover-mode .photos-cursor-zoom {
  opacity: 1;
  transform: scale(1);
}

/* Drag mode - shrink slightly and tighten arrow gap */
.photos-cursor.drag-mode {
  transform: translate(-50%, -50%) scale(0.85);
}
.photos-cursor.drag-mode .photos-cursor-arrows {
  gap: 0.25rem;
}

@media (max-width: 768px) {
  .photos-cursor {
    display: none;
  }
}

/* Projects slider */
.projects-slider {
  overflow: visible !important;
}
.projects-slider .slick-list {
  overflow: visible;
}
.projects-slider .slick-track {
  display: flex !important;
}
.projects-slider .slick-slide {
  height: inherit !important;
  padding: 0 12px;
}
.projects-slider .slick-slide > div {
  height: 100%;
}

/* Projects slider wrapper - hide default cursor on desktop */
.projects-slider-wrapper {
  cursor: none;
}
.projects-slider-wrapper * {
  cursor: none !important;
}
@media (max-width: 768px) {
  .projects-slider-wrapper {
    cursor: auto;
  }
  .projects-slider-wrapper * {
    cursor: auto !important;
  }
}

/* Projects custom cursor */
.projects-cursor {
  position: fixed;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: #333333;
  color: #fff;
  font-weight: 600;
  font-size: 0.875rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 50;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0);
  transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1),
    opacity 0.3s ease,
    background-color 0.3s ease;
  will-change: transform, opacity;
}
.projects-cursor.active {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

/* Cursor arrows */
.projects-cursor-arrows {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  transition: opacity 0.2s ease, transform 0.2s ease, gap 0.2s ease;
}

/* View text - hidden by default */
.projects-cursor-view {
  position: absolute;
  opacity: 0;
  transform: scale(0.8);
  transition: opacity 0.2s ease, transform 0.2s ease;
}

/* Hover mode - show View with primary color */
.projects-cursor.hover-mode {
  background: #c8102e;
}
.projects-cursor.hover-mode .projects-cursor-arrows {
  opacity: 0;
  transform: scale(0.8);
}
.projects-cursor.hover-mode .projects-cursor-view {
  opacity: 1;
  transform: scale(1);
}

/* Drag mode - shrink slightly and tighten arrow gap */
.projects-cursor.drag-mode {
  transform: translate(-50%, -50%) scale(0.85);
}
.projects-cursor.drag-mode .projects-cursor-arrows {
  gap: 0.25rem;
}

@media (max-width: 768px) {
  .projects-cursor {
    display: none;
  }
}

/* Direction-aware hover effect with circle grow */
.direction-aware-bg {
  border-radius: 50%;
  transform: scale(0);
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
}

.direction-aware.is-hovered {
  border-color: #333;
}

.direction-aware.is-hovered .direction-aware-label {
  color: rgba(255, 255, 255, 0.7);
}

.direction-aware.is-hovered .direction-aware-text {
  color: #fff;
}

/* ================================= */
/* Fancybox Custom Styles            */
/* Modern, minimal design for Aimstyle */
/* ================================= */

/* Container and backdrop */
.fancybox__container {
  /* Clean dark backdrop */
  --fancybox-backdrop-bg: rgba(0, 0, 0, 0.95);

  /* Toolbar styling - minimal */
  --f-toolbar-padding: 0;
  --f-toolbar-color: #fff;
  --f-toolbar-bg: transparent;
  --f-toolbar-text-shadow: none;
  --f-toolbar-font-weight: 400;
  --f-toolbar-font-size: 13px;
  --f-toolbar-line-height: 1;

  /* Button styling - minimal, clean */
  --f-button-width: 48px;
  --f-button-height: 48px;
  --f-button-border-radius: 50%;
  --f-button-bg: transparent;
  --f-button-color: rgba(255, 255, 255, 0.7);
  --f-button-hover-bg: rgba(255, 255, 255, 0.1);
  --f-button-hover-color: #fff;
  --f-button-svg-width: 20px;
  --f-button-svg-height: 20px;
  --f-button-svg-stroke-width: 1.5;
  --f-button-svg-filter: none;
  --f-button-transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);

  /* Arrow buttons - larger, more prominent */
  --f-arrow-width: 56px;
  --f-arrow-height: 56px;
  --f-arrow-border-radius: 50%;
  --f-arrow-bg: rgba(255, 255, 255, 0.08);
  --f-arrow-color: rgba(255, 255, 255, 0.9);
  --f-arrow-hover-bg: rgba(255, 255, 255, 0.15);
  --f-arrow-hover-color: #fff;
  --f-arrow-svg-width: 22px;
  --f-arrow-svg-height: 22px;
  --f-arrow-svg-stroke-width: 2;
  --f-arrow-pos: 20px;

  /* Close button - top right, minimal */
  --f-close-button-width: 48px;
  --f-close-button-height: 48px;
  --f-close-button-svg-width: 20px;
  --f-close-button-svg-height: 20px;
  --f-close-button-svg-stroke-width: 1.5;
  --f-close-border-radius: 50%;
  --f-close-button-bg: transparent;
  --f-close-button-hover-bg: rgba(255, 255, 255, 0.1);
  --f-close-button-color: rgba(255, 255, 255, 0.7);
  --f-close-button-hover-color: #fff;

  /* Caption styling */
  --f-caption-padding: 16px 20px;
  --f-caption-color: rgba(255, 255, 255, 0.85);
  --f-caption-bg: transparent;
  --f-caption-line-height: 1.5;

  /* Thumbnails - modern pill style */
  --f-thumb-width: 64px;
  --f-thumb-height: 48px;
  --f-thumb-border-radius: 6px;
  --f-thumb-opacity: 0.5;
  --f-thumb-selected-opacity: 1;
  --f-thumb-hover-opacity: 0.8;
  --f-thumb-selected-shadow: 0 0 0 2px #fff;
  --f-thumb-focus-shadow: 0 0 0 2px rgba(255, 255, 255, 0.5);
  --f-thumbs-gap: 8px;
  --f-thumbs-padding-x: 20px;
  --f-thumbs-padding-y: 16px;
  --f-thumbs-bg: transparent;

  /* Spinner */
  --f-spinner-color-1: rgba(255, 255, 255, 0.1);
  --f-spinner-color-2: rgba(255, 255, 255, 0.8);
  --f-spinner-width: 40px;
  --f-spinner-height: 40px;
  --f-spinner-border-width: 2px;

  /* Counter - minimal */
  --f-counter-padding: 0;
  --f-counter-gap: 4px;
  --f-counter-line-height: 48px;

  /* Progress bar - subtle */
  --f-progressbar-height: 2px;
  --f-progressbar-color: rgba(255, 255, 255, 0.6);

  /* Slide gap */
  --f-carousel-gap: 0;
}

/* Backdrop - pure black for focus on image */
.fancybox__backdrop {
  background: rgba(0, 0, 0, 0.97) !important;
}

/* Main image - clean, no rounded corners in lightbox */
.fancybox__slide img.f-panzoom__content {
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Toolbar - fixed at top, clean layout */
.fancybox__container .f-carousel__toolbar {
  background: transparent !important;
  padding: 16px 20px !important;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 30;
}

/* Toolbar buttons - clean hover states */
.fancybox__container .f-button {
  opacity: 0.7;
  transition: all 0.2s ease;
}

.fancybox__container .f-button:hover {
  opacity: 1;
  background: rgba(255, 255, 255, 0.1);
  transform: none;
}

.fancybox__container .f-button:active {
  transform: scale(0.95);
}

/* Arrow buttons - subtle glass effect */
.fancybox__container .f-button.is-arrow {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  opacity: 1;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.fancybox__container .f-button.is-arrow:hover {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.2);
  transform: translateY(-50%) scale(1.05);
}

.fancybox__container .f-button.is-arrow svg {
  opacity: 0.9;
}

/* Counter - minimal style */
.fancybox__container .f-counter {
  background: transparent !important;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.05em;
  color: rgba(255, 255, 255, 0.6);
}

.fancybox__container .f-counter span {
  padding: 0 3px;
}

/* Caption - clean, bottom center */
.fancybox__container .f-caption {
  font-size: 14px;
  font-weight: 400;
  text-align: center;
  max-width: 600px;
  margin: 0 auto;
  color: rgba(255, 255, 255, 0.7);
  letter-spacing: 0.01em;
}

/* Thumbnail strip - clean, bottom aligned */
.fancybox__container .f-thumbs {
  background: rgba(0, 0, 0, 0.5) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

/* Individual thumbnails */
.fancybox__container .f-thumbs__slide button {
  border-radius: 6px;
  overflow: hidden;
  transition: all 0.2s ease;
  border: 2px solid transparent;
}

.fancybox__container .f-thumbs__slide button:hover {
  transform: none;
  opacity: 0.9;
}

.fancybox__container .f-thumbs__slide.is-selected button {
  transform: none;
  border-color: #fff;
  opacity: 1;
}

/* Hide toolbar on idle */
.fancybox__container.is-idle .f-carousel__toolbar {
  opacity: 0;
  transition: opacity 0.3s ease;
}

.fancybox__container.is-idle .f-button.is-arrow {
  opacity: 0;
  transition: opacity 0.3s ease;
}

/* Show controls on hover */
.fancybox__container:hover .f-carousel__toolbar,
.fancybox__container:hover .f-button.is-arrow {
  opacity: 1;
}

/* Slide entrance - smooth fade */
.fancybox__slide {
  --f-zoomInUp-scale: 1;
  --f-zoomInUp-y: 0;
  --f-zoomInUp-opacity: 0;
}

/* Infobar styling */
.fancybox__container .fancybox__infobar {
  font-size: 13px;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.6);
}

/* Close button positioning */
.fancybox__container .f-button.is-close-button {
  position: fixed !important;
  top: 16px !important;
  right: 16px !important;
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
  .fancybox__container {
    --f-button-width: 44px;
    --f-button-height: 44px;
    --f-arrow-width: 44px;
    --f-arrow-height: 44px;
    --f-arrow-pos: 8px;
    --f-close-button-width: 44px;
    --f-close-button-height: 44px;
    --f-thumb-width: 50px;
    --f-thumb-height: 38px;
    --f-thumbs-padding-x: 12px;
    --f-thumbs-padding-y: 12px;
  }

  .fancybox__container .f-carousel__toolbar {
    padding: 12px !important;
  }

  .fancybox__container .f-caption {
    font-size: 13px;
    padding: 12px 16px;
  }

  .fancybox__container .f-button.is-close-button {
    top: 12px !important;
    right: 12px !important;
  }
}