/* =========================================================
   ALMARA Legal Pages — v2 (depth-tolerant)
   Scope:  #almara-legal-impressum
           #almara-legal-datenschutz
           #almara-legal-agb
           #almara-legal-cookies
   Inner:  #almara-legal-{slug}-content (text-editor widget)

   v2 changes vs v1:
   - Removes direct-child dependency on body.elementor-page
   - Adds .elementor-widget-template resets so any wrapping
     Elementor template/container above us cannot constrain width
   - Hard centring + width math works regardless of DOM depth
   - Adds .elementor-widget-container neutralisation to kill
     residual top padding that Elementor injects on widgets
   ========================================================= */

:root {
  --alm-legal-max-width: 820px;
  --alm-legal-gutter: 32px;
}

/* ---------------------------------------------------------
   Container — centred reading column.
   Selectors no longer require body.elementor-page as ancestor
   trigger, so the rule fires even when the page is loaded via
   an Elementor Template widget (template.default).
   --------------------------------------------------------- */

#almara-legal-impressum,
#almara-legal-datenschutz,
#almara-legal-agb,
#almara-legal-cookies {
  box-sizing: border-box !important;
  width: min(var(--alm-legal-max-width), calc(100% - (2 * var(--alm-legal-gutter)))) !important;
  max-width: var(--alm-legal-max-width) !important;
  min-width: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-top: clamp(72px, 8vw, 120px) !important;
  padding-bottom: clamp(80px, 8vw, 140px) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#almara-legal-impressum > .e-con-inner,
#almara-legal-datenschutz > .e-con-inner,
#almara-legal-agb > .e-con-inner,
#almara-legal-cookies > .e-con-inner {
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* ---------------------------------------------------------
   Defensive: if our container is nested inside an Elementor
   Template widget (Cookie page case), reset any width/padding
   the wrapping containers might inject so we get a clean
   100% width hand-off down to #almara-legal-{slug}.
   --------------------------------------------------------- */

.elementor-widget-template:has(#almara-legal-impressum),
.elementor-widget-template:has(#almara-legal-datenschutz),
.elementor-widget-template:has(#almara-legal-agb),
.elementor-widget-template:has(#almara-legal-cookies) {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.elementor-widget-template:has(#almara-legal-impressum) .elementor-widget-container,
.elementor-widget-template:has(#almara-legal-datenschutz) .elementor-widget-container,
.elementor-widget-template:has(#almara-legal-agb) .elementor-widget-container,
.elementor-widget-template:has(#almara-legal-cookies) .elementor-widget-container,
.elementor-widget-template:has(#almara-legal-impressum) .elementor-template,
.elementor-widget-template:has(#almara-legal-datenschutz) .elementor-template,
.elementor-widget-template:has(#almara-legal-agb) .elementor-template,
.elementor-widget-template:has(#almara-legal-cookies) .elementor-template {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ---------------------------------------------------------
   Content wrapper — base typography (Inter, body)
   --------------------------------------------------------- */

#almara-legal-impressum-content,
#almara-legal-datenschutz-content,
#almara-legal-agb-content,
#almara-legal-cookies-content {
  font-family: var(--almara-font-ui) !important;
  font-size: 1rem !important;
  line-height: 1.65 !important;
  color: var(--almara-ink) !important;
}

#almara-legal-impressum-content.elementor-widget-text-editor,
#almara-legal-datenschutz-content.elementor-widget-text-editor,
#almara-legal-agb-content.elementor-widget-text-editor,
#almara-legal-cookies-content.elementor-widget-text-editor {
  margin: 0 !important;
  padding: 0 !important;
}

/* Kill the residual top padding Elementor injects on widget
   containers — this was causing the H1↔H2 overlap on Cookie. */
#almara-legal-impressum-content > .elementor-widget-container,
#almara-legal-datenschutz-content > .elementor-widget-container,
#almara-legal-agb-content > .elementor-widget-container,
#almara-legal-cookies-content > .elementor-widget-container {
  padding: 0 !important;
  margin: 0 !important;
}

/* ---------------------------------------------------------
   H1 — page title (Cormorant Garamond display)
   --------------------------------------------------------- */

#almara-legal-impressum-content h1,
#almara-legal-datenschutz-content h1,
#almara-legal-agb-content h1,
#almara-legal-cookies-content h1 {
  font-family: var(--almara-font-display) !important;
  font-size: clamp(2.6rem, 5vw, 4.2rem) !important;
  font-weight: 500 !important;
  font-style: normal !important;
  line-height: 1.05 !important;
  letter-spacing: -0.02em !important;
  color: var(--almara-ink) !important;
  margin: 0 0 clamp(36px, 4vw, 56px) !important;
  padding: 0 !important;
  text-wrap: balance;
}

/* ---------------------------------------------------------
   H2 — section headings (Inter, weighted)
   --------------------------------------------------------- */

#almara-legal-impressum-content h2,
#almara-legal-datenschutz-content h2,
#almara-legal-agb-content h2,
#almara-legal-cookies-content h2 {
  font-family: var(--almara-font-ui) !important;
  font-size: 1.125rem !important;
  font-weight: 600 !important;
  font-style: normal !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
  color: var(--almara-ink) !important;
  margin: clamp(32px, 3.5vw, 44px) 0 clamp(10px, 1vw, 14px) !important;
  padding: 0 !important;
}

/* ---------------------------------------------------------
   H3 — sub-headings
   --------------------------------------------------------- */

#almara-legal-impressum-content h3,
#almara-legal-datenschutz-content h3,
#almara-legal-agb-content h3,
#almara-legal-cookies-content h3 {
  font-family: var(--almara-font-ui) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  color: var(--almara-ink) !important;
  margin: clamp(20px, 2vw, 28px) 0 clamp(8px, 0.8vw, 10px) !important;
  padding: 0 !important;
}

/* ---------------------------------------------------------
   Paragraphs + lists
   --------------------------------------------------------- */

#almara-legal-impressum-content p,
#almara-legal-datenschutz-content p,
#almara-legal-agb-content p,
#almara-legal-cookies-content p {
  font-family: var(--almara-font-ui) !important;
  font-size: 1rem !important;
  line-height: 1.65 !important;
  color: var(--almara-ink) !important;
  margin: 0 0 clamp(12px, 1.2vw, 16px) !important;
  padding: 0 !important;
}

#almara-legal-impressum-content p:last-child,
#almara-legal-datenschutz-content p:last-child,
#almara-legal-agb-content p:last-child,
#almara-legal-cookies-content p:last-child {
  margin-bottom: 0 !important;
}

#almara-legal-impressum-content ul,
#almara-legal-impressum-content ol,
#almara-legal-datenschutz-content ul,
#almara-legal-datenschutz-content ol,
#almara-legal-agb-content ul,
#almara-legal-agb-content ol,
#almara-legal-cookies-content ul,
#almara-legal-cookies-content ol {
  font-family: var(--almara-font-ui) !important;
  font-size: 1rem !important;
  line-height: 1.65 !important;
  color: var(--almara-ink) !important;
  margin: 0 0 clamp(12px, 1.2vw, 16px) !important;
  padding-left: 1.4em !important;
}

#almara-legal-impressum-content li,
#almara-legal-datenschutz-content li,
#almara-legal-agb-content li,
#almara-legal-cookies-content li {
  margin-bottom: 6px !important;
}

/* ---------------------------------------------------------
   Links — brand colour, accessible underline
   --------------------------------------------------------- */

#almara-legal-impressum-content a,
#almara-legal-datenschutz-content a,
#almara-legal-agb-content a,
#almara-legal-cookies-content a {
  color: var(--almara-blue) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  text-decoration-thickness: 1px !important;
  transition: color 160ms ease !important;
  word-break: break-word !important;
}

#almara-legal-impressum-content a:hover,
#almara-legal-impressum-content a:focus-visible,
#almara-legal-datenschutz-content a:hover,
#almara-legal-datenschutz-content a:focus-visible,
#almara-legal-agb-content a:hover,
#almara-legal-agb-content a:focus-visible,
#almara-legal-cookies-content a:hover,
#almara-legal-cookies-content a:focus-visible {
  color: var(--almara-aqua) !important;
}

/* =========================================================
   Tablet — ≤1024px
   ========================================================= */

@media (max-width: 1024px) {
  #almara-legal-impressum,
  #almara-legal-datenschutz,
  #almara-legal-agb,
  #almara-legal-cookies {
    padding-top: clamp(60px, 7vw, 90px) !important;
    padding-bottom: clamp(64px, 7vw, 100px) !important;
  }

  #almara-legal-impressum-content h1,
  #almara-legal-datenschutz-content h1,
  #almara-legal-agb-content h1,
  #almara-legal-cookies-content h1 {
    font-size: clamp(2.4rem, 5.4vw, 3.4rem) !important;
    margin-bottom: clamp(28px, 3.5vw, 40px) !important;
  }
}

/* =========================================================
   Mobile — ≤640px
   ========================================================= */

@media (max-width: 640px) {
  :root {
    --alm-legal-gutter: 20px;
  }

  #almara-legal-impressum,
  #almara-legal-datenschutz,
  #almara-legal-agb,
  #almara-legal-cookies {
    padding-top: 56px !important;
    padding-bottom: 72px !important;
  }

  #almara-legal-impressum-content h1,
  #almara-legal-datenschutz-content h1,
  #almara-legal-agb-content h1,
  #almara-legal-cookies-content h1 {
    font-size: 2.2rem !important;
    margin-bottom: 24px !important;
  }

  #almara-legal-impressum-content h2,
  #almara-legal-datenschutz-content h2,
  #almara-legal-agb-content h2,
  #almara-legal-cookies-content h2 {
    font-size: 1.0625rem !important;
    margin-top: 26px !important;
    margin-bottom: 8px !important;
  }
}