.breakdance .lumina-portfolio .section-container {
  padding-block: clamp(40px, 6vw, 80px);
  gap: 28px;
}
.lumina-portfolio-heading { margin: 0; font-size: clamp(28px, 4vw, 48px); line-height: 1.15; }
.lumina-portfolio-intro { margin: 0; max-width: 660px; font-size: 18px; line-height: 1.6; }
.lumina-portfolio-grid { width: 100%; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 40px 25px; }
.lumina-portfolio-card { min-width: 0; margin: 0; }
.lumina-portfolio-card h3 { margin: 0 0 16px; font-size: 24px; line-height: 1.3; }
.lumina-portfolio-preview {
  position: relative; display: block; aspect-ratio: 1 / 1.15; max-height: 650px; overflow: hidden;
  border-radius: 30px; background: #f6f3ff; isolation: isolate;
}
.lumina-portfolio-preview img {
  display: block; width: 100%; height: 100%; object-fit: cover; object-position: top;
  transition: object-position 4.5s ease-in-out;
}
.lumina-portfolio-preview:hover img,
.lumina-portfolio-preview:focus-visible img { object-position: bottom; }
.lumina-portfolio-preview:focus-visible { outline: 3px solid #ffb900; outline-offset: 5px; }
.lumina-portfolio-caption {
  position: absolute; inset: auto 15px 20px; padding: 12px 16px; border-radius: 4px;
  background: #768f5c; color: #fff; text-align: center; font-size: 18px; font-weight: 600;
  box-shadow: 0 2px 12px #0002;
}
.lumina-touch-label { display: none; }
@media (max-width: 767px) {
  .lumina-portfolio-grid { grid-template-columns: minmax(0,1fr); gap: 32px; }
  .lumina-portfolio-preview { max-height: 560px; border-radius: 24px; }
}
@media (hover: none) {
  .lumina-hover-label { display: none; }
  .lumina-touch-label { display: inline; }
}
@media (prefers-reduced-motion: reduce) {
  .lumina-portfolio-preview img { transition: none; }
}