/* Elementor integration.
 *
 * Top-level containers get their vertical rhythm from the setting
 * Layout → "ARGUS Sektion" (added by ARGUS Core):
 *   default   → .argus-section--default    normal spacing, white
 *   alt       → .argus-section--alt        normal spacing, light grey
 *   tight     → .argus-section--tight      reduced spacing
 *   tight-alt → .argus-section--tight-alt  reduced spacing, light grey
 *   none      → no spacing (heroes)
 * Settings made in the Elementor panel (padding, background …) still win – they are more specific.
 */

.e-con.argus-section--default,
.e-con.argus-section--alt,
.e-con.argus-section--tight,
.e-con.argus-section--tight-alt {
  --padding-top: var(--section-space);
  --padding-bottom: var(--section-space);
  --padding-left: var(--gutter);
  --padding-right: var(--gutter);
}

.e-con.argus-section--tight,
.e-con.argus-section--tight-alt {
  --padding-top: calc(var(--section-space) * .6);
  --padding-bottom: calc(var(--section-space) * .6);
}

.e-con.argus-section--alt,
.e-con.argus-section--tight-alt { background-color: var(--color-surface-alt); }

/* two white sections in a row: avoid double spacing */
.e-con:is(.argus-section--default, .argus-section--tight) + .e-con:is(.argus-section--default, .argus-section--tight),
.e-con.argus-flush-top-yes { --padding-top: 0px; }

/* sections keep content readable: plain text max. 760px, centred variant for headings */
.e-con[class*='argus-section--'] .elementor-widget-text-editor > * { max-width: 760px; }

/* grids inside sections */
.e-con.e-grid {
  --e-con-grid-template-rows: auto;
  --row-gap: clamp(20px, 3vw, 32px);
  --column-gap: clamp(20px, 3vw, 32px);
}

/* equal-height cards in grids */
.e-con.e-grid > .elementor-widget,
.e-con.e-grid > .e-con-inner > .elementor-widget { height: 100%; }

/* our widgets render their own markup – no inner spacing from Elementor */
[class*='elementor-widget-argus-'] { width: 100%; }

/* ---- native widgets in the ARGUS look (Elementor panel settings override this) ---- */
:where(.elementor-widget-heading) .elementor-heading-title { line-height: 1.15; }

:where(.elementor-widget-button) .elementor-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 13px 24px;
  border-radius: var(--radius-pill);
  background-color: var(--color-primary);
  color: #fff;
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.2;
  box-shadow: var(--shadow-primary);
  transition: transform .2s var(--ease), background-color .2s;
}

:where(.elementor-widget-button) .elementor-button:hover {
  background-color: var(--color-primary-600);
  color: #fff;
  transform: translateY(-2px);
}

:where(.elementor-widget-image) img { border-radius: var(--radius-lg); }

:where(.elementor-widget-divider) { --divider-color: var(--color-line); }

/* placeholder shown in the editor when a widget has nothing to render */
.argus-widget-empty {
  padding: 24px;
  border: 2px dashed var(--color-line);
  border-radius: var(--radius);
  color: var(--color-muted);
  font-size: .9rem;
  text-align: center;
}