/*
 * Hero side ads — position: absolute внутри .header-hero.
 *
 * Баннеры центрируются в свободной зоне, с отступом от краёв viewport.
 * --iam-hero-edge-pad: минимальный отступ от края (по умолч. 50px).
 *
 * 1920px: зона = 358px, отступ 50px → центр 204px → баннер 300px = 54px от края. ✓
 * 2560px (4K): зона = 678px → баннеры масштабируются ×1.12 (~336px). ✓
 */

.header-hero {
    overflow: visible !important;
}

.iam-hero-side {
    position: absolute;
    top: calc(50% - 30px);
    z-index: 30;
    pointer-events: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--iam-hero-vgap, 8px);
}

/* Центр в свободной зоне с отступом от края viewport:
 * center = edge_pad + (free_zone - edge_pad) / 2
 * free_zone = 50% - container_half (в терминах CSS от hero-секции)
 */
.iam-hero-side--left {
    left: calc(
        var(--iam-hero-edge-pad, 50px)
        + (50% - var(--iam-container-half, 602px) - var(--iam-hero-edge-pad, 50px)) / 2
    );
    transform: translateY(-50%) translateX(-50%);
}

.iam-hero-side--right {
    right: calc(
        var(--iam-hero-edge-pad, 50px)
        + (50% - var(--iam-container-half, 602px) - var(--iam-hero-edge-pad, 50px)) / 2
    );
    transform: translateY(-50%) translateX(50%);
}

.iam-hero-side .widget,
.iam-hero-side .widget > * {
    max-width: 100%;
}

.iam-hero-side .iam-ad-slot-placeholder {
    margin: 0;
}

/* По умолчанию скрыты — показываем только на нужных страницах */
.iam-hero-side {
    display: none !important;
}

body.home .iam-hero-side,
body.single-post .iam-hero-side,
body.archive .iam-hero-side {
    display: flex !important;
}

/* Режим single — 1 баннер на сторону */
.iam-hero-side--single .widget ~ .widget {
    display: none !important;
}

/* Скрываем боковые баннеры, когда свободная зона слишком мала */
@media (max-width: 1440px) {
    body.home .iam-hero-side,
    body.single-post .iam-hero-side,
    body.archive .iam-hero-side {
        display: none !important;
    }
}