/*
 * Layout bounds – zuletzt nach den seitenbezogenen Styles laden.
 *
 * Vertrag des echten Header-Innencontainers (.header-shell in styles.css):
 *   > 680 px: min(100% - 48px, 1180px)  = 24 px Gutter je Seite
 *   <= 680 px: min(100% - 36px, 1180px) = 18 px Gutter je Seite
 *
 * Ausschliesslich Main-Inhalte; Header, Footer und vollflächige Section-Flächen
 * bleiben absichtlich ausserhalb dieser Regeln.
 */

:root {
  --layout-bounds-max: 1180px;
  --layout-bounds-gutter: 24px;
  --layout-bounds-inset: 48px;
}

@media (max-width: 680px) {
  :root {
    --layout-bounds-gutter: 18px;
    --layout-bounds-inset: 36px;
  }
}

/* Use the same formula as .header-shell without relying on viewport units. */
.home-page main .home-shell,
.skb-content-page main.page-main :is(.page-shell, .home-shell),
.skb-content-page main.directory-page .directory-shell,
.skb-content-page main.pricing-page .pricing-shell,
.skb-content-page main.seal-page .seal-shell,
.skb-content-page main.city-guides-page .city-guide-shell,
.skb-content-page main.partner-page .partner-shell,
.skb-content-page main.helpline-page .help-shell,
.skb-content-page main.skb-blog-main :is(.skb-blog-shell, .skb-blog-article-shell),
.skb-content-page main :is(.company-profile-page, .expert-profile-page) .page-shell,
.about-page .container,
.skb-content-page main.media-page {
  box-sizing: border-box;
  width: min(calc(100% - var(--layout-bounds-inset)), var(--layout-bounds-max)) !important;
  min-width: 0;
  margin-inline: auto !important;
}

/* The media page itself is its established outer container: no second gutter. */
.skb-content-page main.media-page .press-shell {
  box-sizing: border-box;
  width: 100% !important;
  min-width: 0;
  margin-inline: 0 !important;
}

/*
 * This section carries its own full-bleed background in the source markup.
 * Its list, not the coloured section itself, follows the shared content edge.
 */
.skb-content-page main.city-guides-page .city-guide-benefits.city-guide-shell {
  width: 100% !important;
  margin-inline: 0 !important;
}

.skb-content-page main.city-guides-page .city-guide-benefit-list {
  box-sizing: border-box;
  width: min(calc(100% - var(--layout-bounds-inset)), var(--layout-bounds-max)) !important;
  min-width: 0;
  margin-inline: auto !important;
}

/* This source shell only carries the full-bleed regional panorama; its own content remains bounded. */
.home-page main .home-directory-region-wrap > .home-shell {
  width: 100% !important;
  margin-inline: 0 !important;
}

/* Keep actual content and media shrinkable inside their existing responsive grids. */
.home-page main :is(
  .home-hero-grid,
  .home-section-intro,
  .home-purpose-layout,
  .home-offer-overview,
  .home-expert-content,
  .home-seal-layout,
  .home-news-grid,
  .home-network-stories-grid,
  .home-organisation-overview,
  .home-knowledge-governance,
  .home-contact-channels-grid
) > *,
.skb-content-page main :is(
  .page-hero-grid,
  .page-modules,
  .page-plans,
  .directory-entry-grid,
  .directory-results-layout,
  .experts-hero-layout,
  .pricing-grid,
  .pricing-details-grid,
  .seal-hero-layout,
  .seal-diagram,
  .seal-path-grid,
  .seal-faq-layout,
  .city-guide-hero-layout,
  .city-guide-edition-layout,
  .city-guide-contact-panel,
  .partner-followups .partner-shell,
  .help-hero-grid,
  .help-own-details,
  .help-org-grid,
  .skb-blog-lead-grid,
  .skb-blog-grid,
  .company-profile-hero-grid,
  .company-profile-layout,
  .expert-profile-hero-grid,
  .expert-profile-layout,
  .press-main-grid,
  .press-latest-grid,
  .press-publications-grid,
  .press-formats-grid,
  .press-bottom-grid
) > * {
  min-width: 0;
}

/* Images and embedded widgets may fill their source box, never exceed it. */
.home-page main :is(img, svg, video, canvas, iframe),
.skb-content-page main :is(img, svg, video, canvas, iframe),
.about-page :is(.about-hero, .about-section) :is(img, svg, video, canvas, iframe) {
  box-sizing: border-box;
  max-width: 100%;
}

/* Preserve source-managed full-bleed art; only the content shells above are bounded. */
.home-page main :is(.home-partner-marquee, .home-network-actions),
.skb-content-page main .city-guide-edition-background {
  max-width: none;
}

/* Rendered overflow findings: retain complete artwork within the header edges. */
.home-page main .home-swiss-map { transform: none !important; }
.home-page main .home-partner-marquee { width: 100% !important; margin-inline: 0 !important; }
.home-page main .home-experts-banner-shell {
  width: min(calc(100% - var(--layout-bounds-inset)), 960px) !important;
  margin-inline: auto !important;
}
.home-page main .home-experts-banner { width: 100% !important; }
@media (max-width: 680px) {
  .home-page main .home-seal-backdrop {
    left: 0 !important;
    right: auto !important;
    width: 100% !important;
    transform: translateY(-2px) !important;
  }
}

/* About document cards: remove source's negative figure bleed, keep each image whole. */
.about-page main .about-document-grid article > figure {
  box-sizing: border-box;
  width: 100% !important;
  max-width: 100% !important;
  margin-inline: 0 !important;
}