/*
 * /kontakt/ page skin - CSS-only, same approach as cennik.css before its
 * rebuild: this page's content lives in Elementor's own post data, not a
 * theme template, and (unlike cennik's price list) has no repeatable
 * structure worth turning into its own PHP template - it's a handful of
 * text blocks, a button, some icons, and logo images. Reuses the "lp-*"
 * design-system tokens (colors, fonts, radii) from design-system-lab.css
 * so a token change there keeps this page in sync automatically.
 *
 * Scoped to body.page-id-3255 (the actual /kontakt/ page) rather than a
 * generic ".elementor-page" selector, which would also match every other
 * Elementor-built page on the site.
 *
 * @package Anima_Child
 */

body.page-id-3255 {
    background: var(--lp-color-background);
}

/* The page's own top-of-content photo is now redundant - the reusable
   "O mnie" card (inc/kontakt.php prepends it via the_content) shows the
   same photo, plus a stats ribbon this plain image never had. Hide the
   photo's column and let its sibling (the "Skontaktuj się ze mną"
   contact details) take the full row width instead of leaving an empty
   50% gap where the photo used to be. */
body.page-id-3255 .elementor-element-12eafd9 {
    display: none !important;
}

body.page-id-3255 .elementor-element-ecb55e5 {
    width: 100% !important;
}

/* Headings: the site's serif heading font at one consistent size,
   instead of the theme default (thin-weight Raleway) at whatever size
   Elementor's per-widget "heading" typography setting happened to use -
   the actual bug reported: the real heading ("Skontaktuj się ze mną"),
   the gabinet's name, and its address/NIP/bank details were ALL marked
   up as headings (h2/h4), each with its own explicit font-size, so the
   page read as a stack of competing headings with no hierarchy at all. */
body.page-id-3255 .elementor-widget-heading .elementor-heading-title,
body.page-id-3255 .elementor-widget-text-editor h1,
body.page-id-3255 .elementor-widget-text-editor h2,
body.page-id-3255 .elementor-widget-text-editor h3 {
    font-family: var(--lp-font-heading);
    font-size: var(--lp-text-xl) !important;
    font-weight: 700;
    color: var(--lp-color-ink);
}

/* The gabinet's name/address/NIP/bank details are marked up as h4s for
   their bold weight, not because they're actually headings - demote
   them to look like normal (bold) body copy: same font, size and case
   as everything else in this block, so they read as one address, not
   four separate headings. */
body.page-id-3255 .elementor-widget-text-editor h4,
body.page-id-3255 .elementor-widget-heading .elementor-heading-title h4 {
    font-family: var(--lp-font-body) !important;
    font-size: var(--lp-text-base) !important;
    font-weight: 700 !important;
    color: var(--lp-color-ink);
}

/* Body copy: the site's body font, one consistent size, and ink/muted
   colors instead of whatever each widget's own typography setting
   happened to be (including a stray pure #000000 on one block, and two
   bold paragraphs - the phone number and email - set to 30px, roughly
   double the rest of the page's text). */
body.page-id-3255 .elementor-widget-text-editor,
body.page-id-3255 .elementor-widget-text-editor p,
body.page-id-3255 .elementor-widget-text-editor li {
    font-family: var(--lp-font-body);
    font-size: var(--lp-text-base) !important;
    color: var(--lp-color-muted);
    line-height: var(--lp-line-body);
}

/* Phone number and email: still emphasised (bold, ink colour, and a
   touch larger than body copy) as the page's key contact info, but no
   longer at heading size. */
body.page-id-3255 .elementor-element-7deb1ff p,
body.page-id-3255 .elementor-element-1a97a14 p {
    font-size: var(--lp-text-lg) !important;
    color: var(--lp-color-ink);
}

/* "Skontaktuj się ze mną" is functionally this section's heading even
   though it's just a bold centred paragraph (with a stray hardcoded
   #000000) - style it like one instead of letting the blanket body-copy
   rule above shrink it to the same size as everything else. */
body.page-id-3255 .elementor-element-098f403 p {
    font-family: var(--lp-font-heading) !important;
    font-size: var(--lp-text-xl) !important;
    color: var(--lp-color-ink) !important;
}

body.page-id-3255 .elementor-widget-text-editor strong,
body.page-id-3255 .elementor-widget-text-editor b {
    color: var(--lp-color-ink);
}

body.page-id-3255 .elementor-widget-text-editor a {
    color: var(--lp-color-primary-700);
}

body.page-id-3255 .elementor-widget-text-editor a:hover {
    color: var(--lp-color-primary-900);
}

/* Section rhythm: give the stacked content blocks the same breathing
   room used elsewhere on the site instead of Elementor's cramped
   default section padding. */
body.page-id-3255 .elementor-top-section {
    padding-top: 32px;
    padding-bottom: 32px;
}

/* "Umów się na wizytę" button - had its own hardcoded pink
   (background-color:#C4529E) from the page's own Elementor settings,
   bypassing the sitewide green override (which only covers Elementor's
   *global* primary color, not a color picked explicitly per-widget). */
body.page-id-3255 .elementor-widget-button .elementor-button {
    background-color: var(--lp-color-primary-700) !important;
    border-radius: var(--lp-radius-sm);
    font-family: var(--lp-font-body);
    font-weight: 700;
}

body.page-id-3255 .elementor-widget-button .elementor-button:hover {
    background-color: var(--lp-color-primary-900) !important;
}

/* Contact icons (phone/email/laptop) in the brand green instead of
   Elementor's neutral default grey, so they read as the page's accent
   rather than blending into the body text. */
body.page-id-3255 .elementor-widget-icon .elementor-icon i {
    color: var(--lp-color-primary-700);
}

/* Partner-logo strip ("Dotychczasowa współpraca") - a little breathing
   room between logos instead of them sitting edge to edge. */
body.page-id-3255 .elementor-widget-image img {
    margin: 0 auto;
}
