

:where(#primary > section) { padding: var(--section-gap) 0; }

.city-hero {
    background:
        linear-gradient(rgba(27, 37, 48, .68), rgba(27, 37, 48, .68)),
        url("../../img/home/hero-warehouse.jpg") center / cover no-repeat;
    padding: var(--sp-8) 0;
}
.city-hero__inner { text-align: center; }
.city-hero h1 { margin: 0; color: var(--color-on-dark); }

.city-content { padding-bottom: var(--sp-6); }
.city-content .container > * + * { margin-top: var(--sp-6); }
.city-content__intro { max-width: 860px; margin-left: auto; margin-right: auto; }

.city-sections__item {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-4);
    padding: var(--sp-5);
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}
.city-sections__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 40px;
    height: 40px;
    padding: var(--sp-2);
    border-radius: var(--radius-pill);
    background: var(--color-accent-soft);
    color: var(--color-primary);
    box-sizing: border-box;
}
.city-sections__content { min-width: 0; }
.city-sections__item h3 { margin-bottom: var(--sp-2); font-size: var(--fs-lead); }
.city-sections__body { color: var(--color-text-light); font-size: var(--fs-base); }
.city-sections__body > * + * { margin-top: var(--sp-2); }
.city-sections__body ul { padding-left: 18px; list-style: disc; }
.city-sections__body li + li { margin-top: var(--sp-1); }
.city-sections__body strong { color: var(--color-text); }

.city-map { padding-top: var(--sp-6); }
.city-map__frame {
    aspect-ratio: 21 / 9;
    max-width: var(--container-width);
    margin: 0 auto;
}
.city-map__frame iframe { display: block; width: 100%; height: 100%; border: 0; }

.city-contact { background: var(--color-bg-alt); }
.city-contact__grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: var(--sp-8); align-items: start; }

.city-contact__info {
    padding: var(--sp-6);
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}
.city-contact__info p { margin-bottom: var(--sp-3); color: var(--color-text-light); }
.city-contact__info p:last-of-type { margin-bottom: var(--sp-5); }
.city-contact__info a { color: inherit; }
.city-contact__info a:hover { color: var(--color-primary); }
.city-contact__photo { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow); }
.city-contact__photo img { display: block; width: 100%; height: auto; }

@media (max-width: 1023px) {
    .city-contact__grid { grid-template-columns: 1fr; }
    .city-contact__info { order: -1; }
}

@media (max-width: 767px) {
    .city-sections__item { flex-direction: column; }
    .city-sections__icon { margin-bottom: var(--sp-3); }
}
