/* =============================================================================
   STAGING CSS
   =============================================================================
   
   This file is for quick CSS additions during development.
   
   CODE HERE IS TEMPORARY - it should be regularly processed and moved to:
   - components.css (component styles)
   - style.css (new CSS variables)
   
   See ai/staging-css.md for processing instructions.
   
   ============================================================================= */

.section__column--floating-card > *:not(.section__column-bg-wrapper) {
    transform: translate(calc(var(--spacing-12) * -1), calc(var(--spacing-8) * -1));
    max-width: 300px;
}

@media (max-width: 768px) {
    .section__column--floating-card > *:not(.section__column-bg-wrapper) {
      display: none;
    }
}

html[lang] {
  margin: 0 !important;
}

#wpadminbar {
  top: -27px;
  opacity: 0;
  transition: 0.3s all;
}

#wpadminbar:hover {
  opacity: 1;
  top: 0;
}

/* Post gradient placeholder — fallback when {{post_thumbnail_id}} resolves
   to no featured image. valt_get_post_visual() generates the gradient. */
.post--gradient-placeholder {
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: var(--radius-xl);
    overflow: hidden;
}

/* When used as a section background */
.post--gradient-placeholder.section__bg-gradient {
    position: absolute;
    inset: 0;
    aspect-ratio: auto;
    border-radius: 0;
    z-index: 0;
}

/* When used as a column background */
.post--gradient-placeholder.section__column-bg-gradient {
    position: absolute;
    inset: 0;
    aspect-ratio: auto;
    border-radius: 0;
    z-index: 0;
}