/**
 * Core page – graphic wrappers using Animated Screenshots/Core mockups.
 * Fit images edge-to-edge inside blue boxes, full visibility.
 */

/* Splash #56: core-workflows (560×340) – no blue box, graphic fills wrap size */
.page-core .core-splash-56-wrap {
  position: relative;
  display: block;
  width: 100%;
  min-height: 340px;
  aspect-ratio: 560 / 340;
  overflow: hidden;
  border-radius: 1rem;
  animation: float-graphic 4s ease-in-out infinite;
}
@media (min-width: 768px) {
  .page-core .core-splash-56-wrap { min-height: 420px; }
}
.page-core .core-splash-56-wrap .core-graphic-iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: none;
  pointer-events: none;
}

/* Tribble Brain: 3 columns, core-57 / core-60 / core-63 (400×280 each) */
.page-core .core-brain-row .core-brain-graphic-wrap {
  display: block;
  width: 100%;
  max-width: 405px;
  aspect-ratio: 400 / 280;
  overflow: hidden;
  border-radius: 1rem;
  line-height: 0;
  flex: none;
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 50%, #bfdbfe 100%);
  box-shadow: 0 0 20px 2px rgba(59,130,246,0.18), 0 0 45px 8px rgba(99,102,241,0.12);
  animation: float-graphic 4s ease-in-out infinite;
}
.page-core .core-brain-row .core-brain-graphic-wrap .core-graphic-iframe {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  border: none;
  pointer-events: none;
  vertical-align: top;
}

/* Orchestrator & Surfaces: feature-z visual wraps */
.page-core .feature-z-section .feature-z-visual .core-z-graphic-wrap {
  display: block;
  width: 100%;
  max-width: 100%;
  aspect-ratio: 560 / 340;
  overflow: hidden;
  border-radius: 1rem;
  line-height: 0;
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 50%, #bfdbfe 100%);
  box-shadow: 0 0 20px 2px rgba(59,130,246,0.18), 0 0 45px 8px rgba(99,102,241,0.12);
  animation: float-graphic 4s ease-in-out infinite;
}
.page-core .feature-z-section .feature-z-visual .core-z-graphic-wrap.core-surfaces-wrap {
  aspect-ratio: 520 / 320;
}
.page-core .feature-z-section .feature-z-visual .core-z-graphic-wrap .core-graphic-iframe {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  border: none;
  pointer-events: none;
  vertical-align: top;
}

/* Integrations: core-integration (560×340) */
.page-core .integrations-splash-wrap.core-integration-wrap {
  display: block;
  width: 100%;
  overflow: hidden;
  border-radius: 1rem;
  line-height: 0;
  aspect-ratio: 560 / 340;
  min-height: 280px;
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 50%, #bfdbfe 100%);
  box-shadow: 0 0 20px 2px rgba(59,130,246,0.18), 0 0 45px 8px rgba(99,102,241,0.12);
  animation: float-graphic 4s ease-in-out infinite;
}
.page-core .integrations-splash-wrap.core-integration-wrap .core-graphic-iframe {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  border: none;
  pointer-events: none;
  vertical-align: top;
}