{"id":236,"date":"2026-03-22T20:11:12","date_gmt":"2026-03-22T19:11:12","guid":{"rendered":"https:\/\/showroom.emiliaruszczyk.pl\/?page_id=236"},"modified":"2026-03-23T16:25:35","modified_gmt":"2026-03-23T15:25:35","slug":"salon-kosmetyczny","status":"publish","type":"page","link":"https:\/\/showroom.emiliaruszczyk.pl\/?page_id=236","title":{"rendered":"Bran\u017ca Beauty"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"236\" class=\"elementor elementor-236\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6e32b0e e-flex e-con-boxed e-con e-parent\" data-id=\"6e32b0e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1adf51d elementor-widget elementor-widget-html\" data-id=\"1adf51d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@400;500;600;700&amp;display=swap\" rel=\"stylesheet\">\r\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/lucide@0.263.0\/dist\/umd\/lucide.min.js\"><\/script>\r\n\r\n<div id=\"premium-glass-header\">\r\n    <style>\r\n        \/* RESET I PODSTAWA *\/\r\n        body, html { margin: 0 !important; padding: 0 !important; }\r\n\r\n        #premium-glass-header {\r\n            position: fixed;\r\n            top: 0;\r\n            left: 0;\r\n            width: 100%;\r\n            z-index: 99999; \r\n            padding: 25px 0;\r\n            transition: all 0.4s ease;\r\n            font-family: 'Poppins', sans-serif !important;\r\n            pointer-events: none; \r\n        }\r\n\r\n        #premium-glass-header.scrolled {\r\n            padding: 12px 0;\r\n            background: rgba(10, 10, 12, 0.8);\r\n            backdrop-filter: blur(15px);\r\n            -webkit-backdrop-filter: blur(15px);\r\n            border-bottom: 1px solid rgba(255, 255, 255, 0.1);\r\n        }\r\n\r\n        .header-inner {\r\n            max-width: 1200px;\r\n            margin: 0 auto;\r\n            display: flex;\r\n            justify-content: space-between;\r\n            align-items: center;\r\n            padding: 0 30px;\r\n            pointer-events: auto; \r\n        }\r\n\r\n        .header-logo {\r\n            font-size: 24px;\r\n            font-weight: 700;\r\n            color: #ffffff !important;\r\n            text-decoration: none;\r\n            z-index: 100001; \/* Logo zawsze na wierzchu *\/\r\n        }\r\n\r\n        .header-logo span {\r\n            background: linear-gradient(135deg, #ec4899 0%, #8b5cf6 100%);\r\n            -webkit-background-clip: text;\r\n            -webkit-text-fill-color: transparent;\r\n        }\r\n\r\n        .header-nav { display: flex; gap: 35px; align-items: center; }\r\n\r\n        .header-nav a {\r\n            color: rgba(255, 255, 255, 0.8);\r\n            text-decoration: none;\r\n            font-size: 14px;\r\n            font-weight: 500;\r\n            transition: 0.3s;\r\n        }\r\n\r\n        .cta-header-btn {\r\n            background: linear-gradient(135deg, #ec4899 0%, #8b5cf6 100%);\r\n            color: #fff !important;\r\n            padding: 12px 24px;\r\n            border-radius: 14px;\r\n            font-weight: 600;\r\n        }\r\n\r\n        \/* PRZYCISK MENU \/ X *\/\r\n        .mobile-menu-toggle {\r\n            display: none;\r\n            background: none;\r\n            border: none;\r\n            color: white;\r\n            cursor: pointer;\r\n            z-index: 100001; \/* Przycisk zawsze nad menu *\/\r\n            padding: 10px;\r\n            transition: transform 0.3s ease;\r\n        }\r\n\r\n        .mobile-menu-toggle:active { transform: scale(0.9); }\r\n\r\n        \/* RESPONSYWNO\u015a\u0106 SMARTFON *\/\r\n        @media (max-width: 767px) {\r\n            .mobile-menu-toggle { display: block; }\r\n\r\n            .header-nav {\r\n                position: fixed;\r\n                top: 0;\r\n                right: -100%;\r\n                width: 100%;\r\n                height: 100vh;\r\n                background: rgba(10, 10, 12, 0.98);\r\n                backdrop-filter: blur(20px);\r\n                flex-direction: column;\r\n                justify-content: center;\r\n                transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1);\r\n            }\r\n\r\n            .header-nav.active { right: 0; }\r\n\r\n            .header-nav a {\r\n                font-size: 24px;\r\n                margin: 15px 0;\r\n                color: #fff;\r\n            }\r\n        }\r\n    <\/style>\r\n\r\n    <div class=\"header-inner\">\r\n        <a href=\"https:\/\/emiliaruszczyk.pl\/\" class=\"header-logo\">\r\n            Emilia<span>Ruszczyk<\/span>\r\n        <\/a>\r\n\r\n        <button class=\"mobile-menu-toggle\" id=\"menuToggle\" aria-label=\"Menu\">\r\n            <i data-lucide=\"menu\" id=\"menuIcon\"><\/i>\r\n        <\/button>\r\n\r\n        <nav class=\"header-nav\" id=\"navMenu\">\r\n            \r\n            <a href=\"https:\/\/showroom.emiliaruszczyk.pl\/\" target=\"_blank\" rel=\"noopener\" translate=\"no\">SHOWROOM&nbsp;<\/a>\r\n            \r\n            <a href=\"#kontakt\" class=\"cta-header-btn\">Bezp\u0142atna wycena<\/a>\r\n        <\/nav>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\n    (function() {\r\n        const header = document.getElementById('premium-glass-header');\r\n        const menuToggle = document.getElementById('menuToggle');\r\n        const navMenu = document.getElementById('navMenu');\r\n        const menuIcon = document.getElementById('menuIcon');\r\n\r\n        \/\/ Scroll effect\r\n        window.addEventListener('scroll', () => {\r\n            if (window.scrollY > 30) header.classList.add('scrolled');\r\n            else header.classList.remove('scrolled');\r\n        });\r\n\r\n        \/\/ Funkcja prze\u0142\u0105czania menu\r\n        function toggleMenu() {\r\n            const isOpen = navMenu.classList.toggle('active');\r\n            \r\n            \/\/ Zmiana ikony: je\u015bli otwarte -> 'x', je\u015bli zamkni\u0119te -> 'menu'\r\n            if (window.lucide) {\r\n                menuIcon.setAttribute('data-lucide', isOpen ? 'x' : 'menu');\r\n                lucide.createIcons(); \/\/ Od\u015bwie\u017cenie ikon Lucide\r\n            }\r\n            \r\n            \/\/ Blokada scrollowania strony w tle\r\n            document.body.style.overflow = isOpen ? 'hidden' : '';\r\n        }\r\n\r\n        menuToggle.addEventListener('click', (e) => {\r\n            e.preventDefault();\r\n            toggleMenu();\r\n        });\r\n\r\n        \/\/ Zamkni\u0119cie menu po klikni\u0119ciu w dowolny link\r\n        document.querySelectorAll('.header-nav a').forEach(link => {\r\n            link.addEventListener('click', () => {\r\n                if(navMenu.classList.contains('active')) toggleMenu();\r\n            });\r\n        });\r\n\r\n        \/\/ Inicjalizacja ikon na starcie\r\n        if (window.lucide) lucide.createIcons();\r\n    })();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-221c0d1 e-flex e-con-boxed e-con e-parent\" data-id=\"221c0d1\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-3d83fcc e-con-full e-flex e-con e-child\" data-id=\"3d83fcc\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e415ca3 elementor-widget elementor-widget-html\" data-id=\"e415ca3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap');\r\n\r\n.spa-widget {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  max-width: 450px;\r\n  margin: 20px auto;\r\n  background: #ffffff;\r\n  border-radius: 24px;\r\n  box-shadow: 0 10px 30px rgba(231, 188, 188, 0.15); \/* R\u00f3\u017cowa po\u015bwiata *\/\r\n  overflow: hidden;\r\n  border: 1px solid #fdf2f2;\r\n}\r\n\r\n.spa-header {\r\n  background: linear-gradient(135deg, #fbcfe8 0%, #f472b6 100%); \/* Pastelowy r\u00f3\u017c *\/\r\n  color: #ffffff;\r\n  padding: 25px 20px;\r\n  text-align: center;\r\n}\r\n\r\n.spa-header h3 {\r\n  margin: 0 0 8px 0;\r\n  font-size: 1.25rem;\r\n  font-weight: 800;\r\n  color: #ffffff;\r\n}\r\n\r\n.spa-header p {\r\n  margin: 0;\r\n  font-size: 0.9rem;\r\n  opacity: 0.9;\r\n  color: #ffffff;\r\n}\r\n\r\n.spa-body {\r\n  padding: 25px 20px;\r\n  min-height: 350px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: space-between;\r\n}\r\n\r\n.spa-step-info {\r\n  font-size: 0.8rem;\r\n  font-weight: 800;\r\n  color: #94a3b8;\r\n  text-transform: uppercase;\r\n  margin-bottom: 5px;\r\n  text-align: left;\r\n}\r\n\r\n.spa-question {\r\n  font-size: 1.15rem;\r\n  font-weight: 800;\r\n  color: #1e293b;\r\n  margin-bottom: 20px;\r\n  text-align: left;\r\n}\r\n\r\n.spa-options {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 12px;\r\n}\r\n\r\n.spa-option {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 15px;\r\n  background: #fff1f2;\r\n  padding: 15px;\r\n  border-radius: 12px;\r\n  border: 1px solid #ffe4e6;\r\n  cursor: pointer;\r\n  transition: all 0.2s ease;\r\n}\r\n\r\n.spa-option:hover {\r\n  background: #ffe4e6;\r\n  border-color: #f472b6;\r\n  transform: translateX(5px);\r\n}\r\n\r\n.spa-opt-icon {\r\n  width: 42px;\r\n  height: 42px;\r\n  background: #ffffff;\r\n  border-radius: 10px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 1.4rem;\r\n  border: 1px solid #ffe4e6;\r\n}\r\n\r\n.spa-opt-text {\r\n  font-weight: 600;\r\n  color: #4c1d95;\r\n  font-size: 0.95rem;\r\n  text-align: left;\r\n}\r\n\r\n\/* Widok wynik\u00f3w *\/\r\n.spa-result-box {\r\n  text-align: center;\r\n  padding: 10px 0;\r\n}\r\n\r\n.spa-result-icon {\r\n  font-size: 3.5rem;\r\n  margin-bottom: 15px;\r\n}\r\n\r\n.spa-result-title {\r\n  font-size: 1.3rem;\r\n  font-weight: 800;\r\n  color: #1e293b;\r\n  margin-bottom: 10px;\r\n}\r\n\r\n.spa-result-desc {\r\n  font-size: 0.9rem;\r\n  color: #64748b;\r\n  line-height: 1.5;\r\n  margin-bottom: 20px;\r\n  background: #fff1f2;\r\n  padding: 15px;\r\n  border-radius: 12px;\r\n}\r\n\r\n.spa-recom-title {\r\n  font-size: 0.85rem;\r\n  font-weight: 800;\r\n  color: #f472b6;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.05em;\r\n  margin-bottom: 10px;\r\n  text-align: left;\r\n}\r\n\r\n.spa-recom-item {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  background: #ffffff;\r\n  padding: 12px;\r\n  border-radius: 10px;\r\n  border: 1px solid #ffe4e6;\r\n  margin-bottom: 10px;\r\n  font-size: 0.9rem;\r\n  color: #1e293b;\r\n  font-weight: 600;\r\n}\r\n\r\n.spa-recom-item span {\r\n  color: #f472b6;\r\n  font-weight: 800;\r\n}\r\n\r\n.spa-btn-action {\r\n  width: 100%;\r\n  background: #f472b6;\r\n  color: white;\r\n  border: none;\r\n  padding: 15px;\r\n  border-radius: 12px;\r\n  font-size: 1rem;\r\n  font-weight: 800;\r\n  cursor: pointer;\r\n  transition: all 0.2s;\r\n  box-shadow: 0 4px 12px rgba(244, 114, 182, 0.3);\r\n  margin-top: 10px;\r\n}\r\n\r\n.spa-btn-action:hover {\r\n  background: #db2777;\r\n  transform: translateY(-2px);\r\n}\r\n\r\n.spa-reset-btn {\r\n  background: none;\r\n  border: none;\r\n  color: #94a3b8;\r\n  font-size: 0.85rem;\r\n  cursor: pointer;\r\n  text-decoration: underline;\r\n  margin-top: 15px;\r\n  width: 100%;\r\n  text-align: center;\r\n}\r\n<\/style>\r\n\r\n\r\n<div class=\"spa-widget\">\r\n  <div class=\"spa-header\">\r\n    <h3>\u2728 Diagnoza Sk\u00f3ry Online<\/h3>\r\n    <p>Odpowiedz na 2 pytania i dobierz rytua\u0142 pi\u0119kna<\/p>\r\n  <\/div>\r\n\r\n  <div class=\"spa-body\" id=\"spa-content\">\r\n    <\/div>\r\n<\/div>\r\n\r\n\r\n<script>\r\n(function() {\r\n  const questions = [\r\n    {\r\n      title: \"Jak Twoja cera zachowuje si\u0119 w ci\u0105gu dnia?\",\r\n      options: [\r\n        { text: \"\u015awieci si\u0119, zw\u0142aszcza w strefie T\", icon: \"\ud83e\ude9e\", points: \"tlusta\" },\r\n        { text: \"Jest napi\u0119ta, \u0142uszczy si\u0119 lub piecze\", icon: \"\ud83c\udf35\", points: \"sucha\" },\r\n        { text: \"Jest zaczerwieniona i bardzo wra\u017cliwa\", icon: \"\ud83c\udf38\", points: \"wrazliwa\" }\r\n      ]\r\n    },\r\n    {\r\n      title: \"Jaki jest Tw\u00f3j g\u0142\u00f3wny cel piel\u0119gnacyjny?\",\r\n      options: [\r\n        { text: \"Zmniejszenie niedoskona\u0142o\u015bci i por\u00f3w\", icon: \"\ud83e\uddf9\", points: \"oczyszczanie\" },\r\n        { text: \"G\u0142\u0119bokie nawil\u017cenie i blask (Glow)\", icon: \"\ud83d\udca7\", points: \"nawilzenie\" },\r\n        { text: \"Wyg\u0142adzenie zmarszczek i uj\u0119drnienie\", icon: \"\u23f3\", points: \"antiaging\" }\r\n      ]\r\n    }\r\n  ];\r\n\r\n  const results = {\r\n    tlusta: {\r\n      title: \"Cera Mieszana \/ T\u0142usta\",\r\n      icon: \"\ud83e\uddea\",\r\n      desc: \"Twoja sk\u00f3ra potrzebuje zbalansowania produkcji sebum bez agresywnego wysuszania.\",\r\n      treatments: [\r\n        { name: \"Peeling Kawitacyjny + Maska\", price: \"180 z\u0142\" },\r\n        { name: \"Zabieg z kwasem salicylowym\", price: \"220 z\u0142\" }\r\n      ]\r\n    },\r\n    sucha: {\r\n      title: \"Cera Sucha \/ Odwodniona\",\r\n      icon: \"\ud83d\udca7\",\r\n      desc: \"Twoja sk\u00f3ra wo\u0142a o picie! Potrzebuje odbudowy bariery hydrolipidowej i ceramid\u00f3w.\",\r\n      treatments: [\r\n        { name: \"Infuzja Tlenowa (Nawil\u017cenie)\", price: \"250 z\u0142\" },\r\n        { name: \"Zabieg z kwasem hialuronowym\", price: \"210 z\u0142\" }\r\n      ]\r\n    },\r\n    wrazliwa: {\r\n      title: \"Cera Wra\u017cliwa \/ Naczynkowa\",\r\n      icon: \"\ud83e\uddf8\",\r\n      desc: \"Potrzebujesz ultra-delikatnego traktowania, wyciszenia rumienia i ukojenia.\",\r\n      treatments: [\r\n        { name: \"Zabieg Koj\u0105cy z witamin\u0105 C i K\", price: \"190 z\u0142\" },\r\n        { name: \"Mezoterapia Bezig\u0142owa \u0142agodna\", price: \"240 z\u0142\" }\r\n      ]\r\n    }\r\n  };\r\n\r\n  let currentStep = 0;\r\n  let skinType = \"\";\r\n\r\n  function renderStep() {\r\n    const container = document.getElementById('spa-content');\r\n    if (!container) return;\r\n\r\n    if (currentStep >= questions.length) {\r\n      showResults(container);\r\n      return;\r\n    }\r\n\r\n    const currentQuestion = questions[currentStep];\r\n\r\n    container.innerHTML = `\r\n      <div>\r\n        <div class=\"spa-step-info\">Pytanie ${currentStep + 1} z ${questions.length}<\/div>\r\n        <div class=\"spa-question\">${currentQuestion.title}<\/div>\r\n        \r\n        <div class=\"spa-options\">\r\n          ${currentQuestion.options.map((opt) => `\r\n            <div class=\"spa-option\" onclick=\"handleSelect('${opt.points}')\">\r\n              <div class=\"spa-opt-icon\">${opt.icon}<\/div>\r\n              <div class=\"spa-opt-text\">${opt.text}<\/div>\r\n            <\/div>\r\n          `).join('')}\r\n        <\/div>\r\n      <\/div>\r\n    `;\r\n  }\r\n\r\n  window.handleSelect = function(val) {\r\n    if (currentStep === 0) skinType = val;\r\n    currentStep++;\r\n    renderStep();\r\n  };\r\n\r\n  function showResults(container) {\r\n    \/\/ Prosty fallback na wypadek dziwnych klikni\u0119\u0107\r\n    const finalType = skinType === \"oczyszczanie\" ? \"tlusta\" : (skinType === \"antiaging\" ? \"sucha\" : skinType);\r\n    const data = results[finalType] || results[\"sucha\"];\r\n\r\n    container.innerHTML = `\r\n      <div class=\"spa-result-box\">\r\n        <div class=\"spa-result-icon\">${data.icon}<\/div>\r\n        <div class=\"spa-result-title\">Twoja diagnoza: ${data.title}<\/div>\r\n        <div class=\"spa-result-desc\">${data.desc}<\/div>\r\n\r\n        <div class=\"spa-recom-title\">Rekomendowane zabiegi SPA:<\/div>\r\n        \r\n        ${data.treatments.map(t => `\r\n          <div class=\"spa-recom-item\">\r\n            <div>${t.name}<\/div>\r\n            <span>${t.price}<\/span>\r\n          <\/div>\r\n        `).join('')}\r\n\r\n        <button type=\"button\" class=\"spa-btn-action\">Zarezerwuj wizyt\u0119 online<\/button>\r\n        <button type=\"button\" class=\"spa-reset-btn\" onclick=\"resetSpa()\">Rozwi\u0105\u017c ponownie<\/button>\r\n      <\/div>\r\n    `;\r\n  }\r\n\r\n  window.resetSpa = function() {\r\n    currentStep = 0;\r\n    skinType = \"\";\r\n    renderStep();\r\n  };\r\n\r\n  if (document.readyState === \"loading\") {\r\n    document.addEventListener(\"DOMContentLoaded\", renderStep);\r\n  } else {\r\n    renderStep();\r\n  }\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-656e8c6 e-con-full e-flex e-con e-child\" data-id=\"656e8c6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7617bc7 elementor-widget elementor-widget-html\" data-id=\"7617bc7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap');\r\n\r\n.card-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));\r\n  gap: 20px;\r\n  max-width: 1200px;\r\n  margin: 20px auto;\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n}\r\n\r\n.p-card {\r\n  background: #18181b; \/* Ciemne t\u0142o zgodne z Twoim cennikiem *\/\r\n  border: 1px solid #27272a;\r\n  border-radius: 20px;\r\n  padding: 30px;\r\n  text-align: left;\r\n  color: #ffffff;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: space-between;\r\n  transition: transform 0.3s ease;\r\n}\r\n\r\n.p-card:hover { \r\n  transform: translateY(-5px); \r\n  border-color: #a855f7; \/* Tw\u00f3j fioletowy akcent ze screena *\/\r\n}\r\n\r\n.p-icon {\r\n  width: 48px;\r\n  height: 48px;\r\n  background: rgba(168, 85, 247, 0.1);\r\n  border-radius: 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 1.5rem;\r\n  margin-bottom: 20px;\r\n  border: 1px solid rgba(168, 85, 247, 0.3);\r\n}\r\n\r\n.p-title { font-size: 1.5rem; font-weight: 800; margin-bottom: 10px; color: #ffffff; }\r\n.p-desc { font-size: 0.95rem; color: #a1a1aa; margin-bottom: 25px; line-height: 1.5; }\r\n\r\n.p-features { list-style: none; padding: 0; margin: 0 0 30px 0; }\r\n.p-features li {\r\n  font-size: 0.9rem;\r\n  color: #e4e4e7;\r\n  margin-bottom: 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n}\r\n\r\n.p-features li::before {\r\n  content: '\u2713';\r\n  color: #a855f7;\r\n  font-weight: 800;\r\n}\r\n\r\n.p-price { font-size: 1.8rem; font-weight: 800; color: #ffffff; margin-bottom: 20px; }\r\n\r\n.p-btn {\r\n  width: 100%;\r\n  background: #a855f7;\r\n  color: white;\r\n  border: none;\r\n  padding: 14px;\r\n  border-radius: 12px;\r\n  font-weight: 800;\r\n  cursor: pointer;\r\n  text-align: center;\r\n  text-decoration: none;\r\n  font-size: 0.95rem;\r\n  transition: background 0.2s;\r\n  display: block;\r\n}\r\n.p-btn:hover { background: #9333ea; }\r\n<\/style>\r\n\r\n<div class=\"card-grid\">\r\n\r\n  <div class=\"p-card\">\r\n    <div>\r\n      <div class=\"p-icon\">\u2728<\/div>\r\n      <div class=\"p-title\">Diagnoza Sk\u00f3ry Online<\/div>\r\n      <div class=\"p-desc\">Inteligentny quiz diagnostyczny cery dla salon\u00f3w kosmetologicznych i gabinet\u00f3w SPA.<\/div>\r\n      <ul class=\"p-features\">\r\n        <li>Automatyczny dob\u00f3r zabieg\u00f3w i piel\u0119gnacji<\/li>\r\n        <li>Wygodna edukacja klienta przed wizyt\u0105<\/li>\r\n        <li>Generuje gotowe zapytania ofertowe (Leady)<\/li>\r\n        <li>W 100% responsywny mobile-first<\/li>\r\n      <\/ul>\r\n    <\/div>\r\n    <div>\r\n      <div class=\"p-price\">od 450 z\u0142<\/div>\r\n      <a href=\"#kontakt\" class=\"p-btn\">Wdr\u00f3\u017c u Klienta<\/a>\r\n    <\/div>\r\n  <\/div>\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-e6e7a83 e-flex e-con-boxed e-con e-parent\" data-id=\"e6e7a83\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-eb5abd2 e-con-full e-flex e-con e-child\" data-id=\"eb5abd2\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-353f966 elementor-widget elementor-widget-html\" data-id=\"353f966\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap');\r\n\r\n.card-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));\r\n  gap: 20px;\r\n  max-width: 1200px;\r\n  margin: 20px auto;\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n}\r\n\r\n.p-card {\r\n  background: #18181b; \/* Ciemne t\u0142o Twojej oferty *\/\r\n  border: 1px solid #27272a;\r\n  border-radius: 20px;\r\n  padding: 30px;\r\n  text-align: left;\r\n  color: #ffffff;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: space-between;\r\n  transition: transform 0.3s ease;\r\n}\r\n\r\n.p-card:hover { \r\n  transform: translateY(-5px); \r\n  border-color: #a855f7; \/* Fioletowy akcent ze screena *\/\r\n}\r\n\r\n.p-icon {\r\n  width: 48px;\r\n  height: 48px;\r\n  background: rgba(168, 85, 247, 0.1);\r\n  border-radius: 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 1.5rem;\r\n  margin-bottom: 20px;\r\n  border: 1px solid rgba(168, 85, 247, 0.3);\r\n}\r\n\r\n.p-title { font-size: 1.5rem; font-weight: 800; margin-bottom: 10px; color: #ffffff; }\r\n.p-desc { font-size: 0.95rem; color: #a1a1aa; margin-bottom: 25px; line-height: 1.5; }\r\n\r\n.p-features { list-style: none; padding: 0; margin: 0 0 30px 0; }\r\n.p-features li {\r\n  font-size: 0.9rem;\r\n  color: #e4e4e7;\r\n  margin-bottom: 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n}\r\n\r\n.p-features li::before {\r\n  content: '\u2713';\r\n  color: #a855f7;\r\n  font-weight: 800;\r\n}\r\n\r\n.p-price { font-size: 1.8rem; font-weight: 800; color: #ffffff; margin-bottom: 20px; }\r\n\r\n.p-btn {\r\n  width: 100%;\r\n  background: #a855f7;\r\n  color: white;\r\n  border: none;\r\n  padding: 14px;\r\n  border-radius: 12px;\r\n  font-weight: 800;\r\n  cursor: pointer;\r\n  text-align: center;\r\n  text-decoration: none;\r\n  font-size: 0.95rem;\r\n  transition: background 0.2s;\r\n  display: block;\r\n}\r\n.p-btn:hover { background: #9333ea; }\r\n<\/style>\r\n\r\n<div class=\"card-grid\">\r\n\r\n  <div class=\"p-card\">\r\n    <div>\r\n      <div class=\"p-icon\">\ud83d\udc8d<\/div>\r\n      <div class=\"p-title\">Kreator Pakietu \u015alubnego<\/div>\r\n      <div class=\"p-desc\">Inteligentny koszyk us\u0142ug \u015blubnych z automatycznym przeliczaniem ceny i czasu trwania przygotowa\u0144.<\/div>\r\n      <ul class=\"p-features\">\r\n        <li>Zlicza sumaryczny czas w godzinach i minutach<\/li>\r\n        <li>Generuje gotowe rezerwacje pakiet\u00f3w \u0142\u0105czonych<\/li>\r\n        <li>Zwi\u0119ksza warto\u015b\u0107 koszyka u panny m\u0142odej i druhen<\/li>\r\n        <li>Zdejmuje ci\u0119\u017car wyceny z recepcji salonu<\/li>\r\n      <\/ul>\r\n    <\/div>\r\n    <div>\r\n      <div class=\"p-price\">od 500 z\u0142<\/div>\r\n      <a href=\"#kontakt\" class=\"p-btn\">Wdr\u00f3\u017c u Klienta<\/a>\r\n    <\/div>\r\n  <\/div>\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cc78735 e-con-full e-flex e-con e-child\" data-id=\"cc78735\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5e039e6 elementor-widget elementor-widget-html\" data-id=\"5e039e6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap');\r\n\r\n.bride-widget {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  max-width: 460px;\r\n  margin: 20px auto;\r\n  background: #ffffff;\r\n  border-radius: 24px;\r\n  box-shadow: 0 10px 40px rgba(214, 188, 172, 0.2); \/* Ciep\u0142y, be\u017cowy cie\u0144 *\/\r\n  overflow: hidden;\r\n  border: 1px solid #f5ebe0;\r\n}\r\n\r\n.bride-header {\r\n  background: linear-gradient(135deg, #fdf8f5 0%, #e6ccba 100%); \/* Szampa\u0144skie z\u0142oto i be\u017c *\/\r\n  color: #4a3728;\r\n  padding: 30px 20px;\r\n  text-align: center;\r\n}\r\n\r\n.bride-header h3 {\r\n  margin: 0 0 8px 0;\r\n  font-size: 1.25rem;\r\n  font-weight: 800;\r\n  color: #4a3728;\r\n}\r\n\r\n.bride-header p {\r\n  margin: 0;\r\n  font-size: 0.85rem;\r\n  opacity: 0.9;\r\n  color: #6b4e3a;\r\n  letter-spacing: 0.03em;\r\n}\r\n\r\n.bride-body {\r\n  padding: 25px 20px;\r\n}\r\n\r\n.bride-section-title {\r\n  font-size: 0.8rem;\r\n  font-weight: 800;\r\n  color: #a0785a;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.05em;\r\n  margin-bottom: 12px;\r\n  text-align: left;\r\n}\r\n\r\n.bride-options {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 12px;\r\n  margin-bottom: 25px;\r\n}\r\n\r\n.bride-option-item {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  background: #faf7f5;\r\n  padding: 16px;\r\n  border-radius: 14px;\r\n  border: 1px solid #f0e4d8;\r\n  cursor: pointer;\r\n  transition: all 0.2s ease;\r\n}\r\n\r\n.bride-option-item:hover {\r\n  background: #fdfaf7;\r\n  border-color: #d4bda7;\r\n  transform: translateY(-2px);\r\n}\r\n\r\n.bride-option-item.active {\r\n  border-color: #c49a7a;\r\n  background: #fffcf9;\r\n  box-shadow: 0 4px 15px rgba(196, 154, 122, 0.15);\r\n}\r\n\r\n.bride-opt-left {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n}\r\n\r\n.bride-opt-icon {\r\n  font-size: 1.5rem;\r\n  width: 44px;\r\n  height: 44px;\r\n  background: #ffffff;\r\n  border-radius: 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  border: 1px solid #f0e4d8;\r\n}\r\n\r\n.bride-opt-info {\r\n  display: flex;\r\n  flex-direction: column;\r\n  text-align: left;\r\n}\r\n\r\n.bride-opt-title {\r\n  font-weight: 600;\r\n  color: #38291e;\r\n  font-size: 0.95rem;\r\n}\r\n\r\n.bride-opt-time {\r\n  font-size: 0.8rem;\r\n  color: #8c7361;\r\n  margin-top: 3px;\r\n}\r\n\r\n.bride-opt-price {\r\n  font-weight: 800;\r\n  color: #38291e;\r\n  font-size: 1rem;\r\n}\r\n\r\n\/* Podsumowanie u do\u0142u *\/\r\n.bride-summary {\r\n  background: #faf7f5;\r\n  border-radius: 16px;\r\n  padding: 20px;\r\n  border: 1px solid #f0e4d8;\r\n  margin-bottom: 20px;\r\n}\r\n\r\n.bride-sum-row {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  margin-bottom: 10px;\r\n  font-size: 0.9rem;\r\n  color: #6b4e3a;\r\n}\r\n\r\n.bride-sum-row:last-child {\r\n  margin-bottom: 0;\r\n  padding-top: 10px;\r\n  border-top: 1px solid #e8dbce;\r\n  font-size: 1.15rem;\r\n  font-weight: 800;\r\n  color: #38291e;\r\n}\r\n\r\n.bride-btn-order {\r\n  width: 100%;\r\n  background: #c49a7a;\r\n  color: white;\r\n  border: none;\r\n  padding: 16px;\r\n  border-radius: 14px;\r\n  font-size: 1rem;\r\n  font-weight: 800;\r\n  cursor: pointer;\r\n  transition: all 0.2s;\r\n  box-shadow: 0 4px 15px rgba(196, 154, 122, 0.3);\r\n}\r\n\r\n.bride-btn-order:hover {\r\n  background: #b38867;\r\n  transform: translateY(-2px);\r\n}\r\n<\/style>\r\n\r\n\r\n<div class=\"bride-widget\">\r\n  <div class=\"bride-header\">\r\n    <h3>\ud83d\udc8d Kreator Pakietu \u015alubnego<\/h3>\r\n    <p>Skomponuj pakiet us\u0142ug i oszacuj czas trwania<\/p>\r\n  <\/div>\r\n\r\n  <div class=\"bride-body\">\r\n    \r\n    <div class=\"bride-section-title\">Wybierz us\u0142ugi \u015blubne:<\/div>\r\n\r\n    <div class=\"bride-options\">\r\n      \r\n      <div class=\"bride-option-item active\" onclick=\"toggleWedding(this, 'Makija\u017c \u015alubny z Pr\u00f3bnym', 350, 150)\">\r\n        <div class=\"bride-opt-left\">\r\n          <div class=\"bride-opt-icon\">\ud83d\udc84<\/div>\r\n          <div class=\"bride-opt-info\">\r\n            <span class=\"bride-opt-title\">Makija\u017c \u015alubny + Pr\u00f3bny<\/span>\r\n            <span class=\"bride-opt-time\">\u231b ok. 2.5 godziny<\/span>\r\n          <\/div>\r\n        <\/div>\r\n        <span class=\"bride-opt-price\">350 z\u0142<\/span>\r\n      <\/div>\r\n\r\n      <div class=\"bride-option-item\" onclick=\"toggleWedding(this, 'Stylizacja rz\u0119s \u015blubnych', 200, 90)\">\r\n        <div class=\"bride-opt-left\">\r\n          <div class=\"bride-opt-icon\">\ud83d\udc41\ufe0f<\/div>\r\n          <div class=\"bride-opt-info\">\r\n            <span class=\"bride-opt-title\">Stylizacja Rz\u0119s (Obj\u0119to\u015b\u0107)<\/span>\r\n            <span class=\"bride-opt-time\">\u231b ok. 1.5 godziny<\/span>\r\n          <\/div>\r\n        <\/div>\r\n        <span class=\"bride-opt-price\">200 z\u0142<\/span>\r\n      <\/div>\r\n\r\n      <div class=\"bride-option-item\" onclick=\"toggleWedding(this, 'Manicure \u015alubny Premium', 150, 60)\">\r\n        <div class=\"bride-opt-left\">\r\n          <div class=\"bride-opt-icon\">\ud83d\udc85<\/div>\r\n          <div class=\"bride-opt-info\">\r\n            <span class=\"bride-opt-title\">Manicure \u015alubny Hybrydowy<\/span>\r\n            <span class=\"bride-opt-time\">\u231b ok. 1 godzina<\/span>\r\n          <\/div>\r\n        <\/div>\r\n        <span class=\"bride-opt-price\">150 z\u0142<\/span>\r\n      <\/div>\r\n\r\n      <div class=\"bride-option-item\" onclick=\"toggleWedding(this, 'Makija\u017c dla Druhny\/Mamy', 150, 60)\">\r\n        <div class=\"bride-opt-left\">\r\n          <div class=\"bride-opt-icon\">\ud83d\udc6d<\/div>\r\n          <div class=\"bride-opt-info\">\r\n            <span class=\"bride-opt-title\">Makija\u017c dla Druhny \/ Mamy<\/span>\r\n            <span class=\"bride-opt-time\">\u231b ok. 1 godzina<\/span>\r\n          <\/div>\r\n        <\/div>\r\n        <span class=\"bride-opt-price\">+150 z\u0142<\/span>\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n    <div class=\"bride-summary\">\r\n      <div class=\"bride-sum-row\">\r\n        <span>Wybrane us\u0142ugi:<\/span>\r\n        <span id=\"bride-count\">1 us\u0142ugi<\/span>\r\n      <\/div>\r\n      <div class=\"bride-sum-row\">\r\n        <span>Szacowany czas:<\/span>\r\n        <span id=\"bride-time\">2.5 godz.<\/span>\r\n      <\/div>\r\n      <div class=\"bride-sum-row\">\r\n        <span>Suma pakietu:<\/span>\r\n        <span id=\"bride-total\">350 z\u0142<\/span>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <button type=\"button\" class=\"bride-btn-order\">Zarezerwuj termin \u015blubny<\/button>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n\r\n<script>\r\n(function() {\r\n  \/\/ Startujemy z domy\u015blnie zaznaczonym makija\u017cem \u015blubnym\r\n  let selectedServices = 1;\r\n  let totalPrice = 350;\r\n  let totalTimeMinutes = 150;\r\n\r\n  window.toggleWedding = function(element, name, price, timeMinutes) {\r\n    const totalCountEl = document.getElementById('bride-count');\r\n    const totalTimeEl = document.getElementById('bride-time');\r\n    const totalPriceEl = document.getElementById('bride-total');\r\n\r\n    if (!totalCountEl || !totalTimeEl || !totalPriceEl) return;\r\n\r\n    if (element.classList.contains('active')) {\r\n      \/\/ Us\u0142uga by\u0142a zaznaczona - odznaczamy j\u0105\r\n      if (selectedServices === 1) {\r\n        \/\/ Nie pozwalamy odznaczy\u0107 wszystkiego (musi by\u0107 chocia\u017c 1 us\u0142uga)\r\n        return;\r\n      }\r\n      element.classList.remove('active');\r\n      selectedServices--;\r\n      totalPrice -= price;\r\n      totalTimeMinutes -= timeMinutes;\r\n    } else {\r\n      \/\/ Us\u0142uga nie by\u0142a zaznaczona - zaznaczamy j\u0105\r\n      element.classList.add('active');\r\n      selectedServices++;\r\n      totalPrice += price;\r\n      totalTimeMinutes += timeMinutes;\r\n    }\r\n\r\n    \/\/ Formatowanie czasu (minuty na godziny i minuty)\r\n    const hours = Math.floor(totalTimeMinutes \/ 60);\r\n    const mins = totalTimeMinutes % 60;\r\n    let timeText = hours + \" godz.\";\r\n    if (mins > 0) {\r\n      timeText += \" \" + mins + \" min.\";\r\n    }\r\n\r\n    \/\/ Podmiana danych w HTML\r\n    totalCountEl.innerText = selectedServices + \" us\u0142ugi\";\r\n    totalTimeEl.innerText = timeText;\r\n    totalPriceEl.innerText = totalPrice + \" z\u0142\";\r\n  };\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-9154204 e-flex e-con-boxed e-con e-parent\" data-id=\"9154204\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-c305b29 e-con-full e-flex e-con e-child\" data-id=\"c305b29\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0d53e1b elementor-widget elementor-widget-html\" data-id=\"0d53e1b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap');\r\n\r\n.hair-widget {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  max-width: 460px;\r\n  margin: 20px auto;\r\n  background: #ffffff;\r\n  border-radius: 24px;\r\n  box-shadow: 0 10px 40px rgba(139, 92, 246, 0.15); \/* Fioletowa po\u015bwiata *\/\r\n  overflow: hidden;\r\n  border: 1px solid #f5f3ff;\r\n}\r\n\r\n.hair-header {\r\n  background: linear-gradient(135deg, #2e1065 0%, #6d28d9 100%); \/* Luksusowy fiolet *\/\r\n  color: #ffffff;\r\n  padding: 25px 20px;\r\n  text-align: center;\r\n}\r\n\r\n.hair-header h3 {\r\n  margin: 0 0 8px 0;\r\n  font-size: 1.25rem;\r\n  font-weight: 800;\r\n  color: #ffffff;\r\n}\r\n\r\n.hair-header p {\r\n  margin: 0;\r\n  font-size: 0.9rem;\r\n  opacity: 0.9;\r\n  color: #ede9fe;\r\n}\r\n\r\n.hair-body {\r\n  padding: 25px 20px;\r\n  min-height: 360px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: space-between;\r\n}\r\n\r\n.hair-step-info {\r\n  font-size: 0.8rem;\r\n  font-weight: 800;\r\n  color: #6b7280;\r\n  text-transform: uppercase;\r\n  margin-bottom: 5px;\r\n  text-align: left;\r\n}\r\n\r\n.hair-question {\r\n  font-size: 1.15rem;\r\n  font-weight: 800;\r\n  color: #1f2937;\r\n  margin-bottom: 20px;\r\n  text-align: left;\r\n}\r\n\r\n.hair-options {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 12px;\r\n}\r\n\r\n.hair-option {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 15px;\r\n  background: #f5f3ff;\r\n  padding: 15px;\r\n  border-radius: 12px;\r\n  border: 1px solid #ddd6fe;\r\n  cursor: pointer;\r\n  transition: all 0.2s ease;\r\n}\r\n\r\n.hair-option:hover {\r\n  background: #ede9fe;\r\n  border-color: #8b5cf6;\r\n  transform: translateX(5px);\r\n}\r\n\r\n.hair-opt-icon {\r\n  width: 42px;\r\n  height: 42px;\r\n  background: #ffffff;\r\n  border-radius: 10px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 1.4rem;\r\n  border: 1px solid #ddd6fe;\r\n}\r\n\r\n.hair-opt-text {\r\n  font-weight: 600;\r\n  color: #2e1065;\r\n  font-size: 0.95rem;\r\n  text-align: left;\r\n}\r\n\r\n\/* Widok wynik\u00f3w *\/\r\n.hair-result-box {\r\n  text-align: center;\r\n  padding: 10px 0;\r\n}\r\n\r\n.hair-result-icon {\r\n  font-size: 3.5rem;\r\n  margin-bottom: 15px;\r\n}\r\n\r\n.hair-result-title {\r\n  font-size: 1.3rem;\r\n  font-weight: 800;\r\n  color: #1f2937;\r\n  margin-bottom: 10px;\r\n}\r\n\r\n.hair-result-desc {\r\n  font-size: 0.9rem;\r\n  color: #4b5563;\r\n  line-height: 1.5;\r\n  margin-bottom: 20px;\r\n  background: #f5f3ff;\r\n  padding: 15px;\r\n  border-radius: 12px;\r\n}\r\n\r\n.hair-recom-title {\r\n  font-size: 0.85rem;\r\n  font-weight: 800;\r\n  color: #7c3aed;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.05em;\r\n  margin-bottom: 10px;\r\n  text-align: left;\r\n}\r\n\r\n.hair-recom-item {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  background: #ffffff;\r\n  padding: 12px;\r\n  border-radius: 10px;\r\n  border: 1px solid #ddd6fe;\r\n  margin-bottom: 10px;\r\n  font-size: 0.9rem;\r\n  color: #111827;\r\n  font-weight: 600;\r\n}\r\n\r\n.hair-recom-item span {\r\n  color: #7c3aed;\r\n  font-weight: 800;\r\n}\r\n\r\n.hair-btn-action {\r\n  width: 100%;\r\n  background: #7c3aed;\r\n  color: white;\r\n  border: none;\r\n  padding: 15px;\r\n  border-radius: 12px;\r\n  font-size: 1rem;\r\n  font-weight: 800;\r\n  cursor: pointer;\r\n  transition: all 0.2s;\r\n  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.3);\r\n  margin-top: 10px;\r\n}\r\n\r\n.hair-btn-action:hover {\r\n  background: #6d28d9;\r\n  transform: translateY(-2px);\r\n}\r\n\r\n.hair-reset-btn {\r\n  background: none;\r\n  border: none;\r\n  color: #6b7280;\r\n  font-size: 0.85rem;\r\n  cursor: pointer;\r\n  text-decoration: underline;\r\n  margin-top: 15px;\r\n  width: 100%;\r\n  text-align: center;\r\n}\r\n<\/style>\r\n\r\n\r\n<div class=\"hair-widget\">\r\n  <div class=\"hair-header\">\r\n    <h3>\u2702\ufe0f Wirtualny Stylista Fryzur<\/h3>\r\n    <p>Okre\u015bl swoje cechy i znajd\u017a idealne ci\u0119cie<\/p>\r\n  <\/div>\r\n\r\n  <div class=\"hair-body\" id=\"hair-content\">\r\n    <\/div>\r\n<\/div>\r\n\r\n\r\n<script>\r\n(function() {\r\n  const questions = [\r\n    {\r\n      title: \"Jaki jest kszta\u0142t Twojej twarzy?\",\r\n      options: [\r\n        { text: \"Owalna lub poci\u0105g\u0142a\", icon: \"\ud83e\udd5a\", points: \"owal\" },\r\n        { text: \"Okr\u0105g\u0142a\", icon: \"\ud83d\udfe1\", points: \"okrag\" },\r\n        { text: \"Kwadratowa \/ tr\u00f3jk\u0105tna\", icon: \"\ud83d\udcd0\", points: \"ostra\" }\r\n      ]\r\n    },\r\n    {\r\n      title: \"Jaka jest struktura Twoich w\u0142os\u00f3w?\",\r\n      options: [\r\n        { text: \"Cienkie i proste\", icon: \"\ud83d\udccf\", points: \"proste\" },\r\n        { text: \"G\u0119ste lub falowane\", icon: \"\ud83c\udf0a\", points: \"geste\" }\r\n      ]\r\n    }\r\n  ];\r\n\r\n  const results = {\r\n    owal: {\r\n      title: \"Klasyczny Lob \/ D\u0142ugie Warstwy\",\r\n      icon: \"\ud83d\udc69\",\r\n      desc: \"Do Twojej twarzy pasuje niemal wszystko! Idealny b\u0119dzie Lob (d\u0142u\u017cszy bob) lub d\u0142ugie, cieniowane warstwy dodaj\u0105ce obj\u0119to\u015bci.\",\r\n      treatments: [\r\n        { name: \"Strzy\u017cenie Premium z modelowaniem\", price: \"120 z\u0142\" },\r\n        { name: \"Piel\u0119gnacja Keratynowa \/ Olaplex\", price: \"150 z\u0142\" }\r\n      ]\r\n    },\r\n    okrag: {\r\n      title: \"Asymetryczny Bob \/ Grzywka na bok\",\r\n      icon: \"\ud83d\udc87\u200d\u2640\ufe0f\",\r\n      desc: \"Wybierz fryzur\u0119, kt\u00f3ra optycznie wysmukli twarz. Idealnie sprawdzi si\u0119 ci\u0119cie z pazurkami lub sko\u015bna grzywka.\",\r\n      treatments: [\r\n        { name: \"Strzy\u017cenie wysmuklaj\u0105ce + Stylizacja\", price: \"140 z\u0142\" },\r\n        { name: \"Koloryzacja refleksy (konturowanie)\", price: \"250 z\u0142\" }\r\n      ]\r\n    },\r\n    ostra: {\r\n      title: \"Mi\u0119kkie Fale \/ Shaggy Hair\",\r\n      icon: \"\ud83e\udd81\",\r\n      desc: \"Twoim celem jest z\u0142agodzenie rys\u00f3w twarzy. Postaw na mi\u0119kkie fale, obj\u0119to\u015b\u0107 po bokach lub stylizacje 'czesane wiatrem'.\",\r\n      treatments: [\r\n        { name: \"Strzy\u017cenie i stylizacja lok\u00f3w\", price: \"130 z\u0142\" },\r\n        { name: \"Sauna na w\u0142osy (Nawil\u017cenie)\", price: \"100 z\u0142\" }\r\n      ]\r\n    }\r\n  };\r\n\r\n  let currentStep = 0;\r\n  let faceType = \"\";\r\n\r\n  function renderStep() {\r\n    const container = document.getElementById('hair-content');\r\n    if (!container) return;\r\n\r\n    if (currentStep >= questions.length) {\r\n      showResults(container);\r\n      return;\r\n    }\r\n\r\n    const currentQuestion = questions[currentStep];\r\n\r\n    container.innerHTML = `\r\n      <div>\r\n        <div class=\"hair-step-info\">Krok ${currentStep + 1} z ${questions.length}<\/div>\r\n        <div class=\"hair-question\">${currentQuestion.title}<\/div>\r\n        \r\n        <div class=\"hair-options\">\r\n          ${currentQuestion.options.map((opt) => `\r\n            <div class=\"hair-option\" onclick=\"handleHairSelect('${opt.points}')\">\r\n              <div class=\"hair-opt-icon\">${opt.icon}<\/div>\r\n              <div class=\"hair-opt-text\">${opt.text}<\/div>\r\n            <\/div>\r\n          `).join('')}\r\n        <\/div>\r\n      <\/div>\r\n    `;\r\n  }\r\n\r\n  window.handleHairSelect = function(val) {\r\n    if (currentStep === 0) faceType = val;\r\n    currentStep++;\r\n    renderStep();\r\n  };\r\n\r\n  function showResults(container) {\r\n    const data = results[faceType] || results[\"owal\"];\r\n\r\n    container.innerHTML = `\r\n      <div class=\"hair-result-box\">\r\n        <div class=\"hair-result-icon\">${data.icon}<\/div>\r\n        <div class=\"hair-result-title\">Twoje ci\u0119cie: ${data.title}<\/div>\r\n        <div class=\"hair-result-desc\">${data.desc}<\/div>\r\n\r\n        <div class=\"hair-recom-title\">Rekomendowane us\u0142ugi w salonie:<\/div>\r\n        \r\n        ${data.treatments.map(t => `\r\n          <div class=\"hair-recom-item\">\r\n            <div>${t.name}<\/div>\r\n            <span>${t.price}<\/span>\r\n          <\/div>\r\n        `).join('')}\r\n\r\n        <button type=\"button\" class=\"hair-btn-action\">Zarezerwuj wizyt\u0119 u fryzjera<\/button>\r\n        <button type=\"button\" class=\"hair-reset-btn\" onclick=\"resetHair()\">Zmie\u0144 parametry<\/button>\r\n      <\/div>\r\n    `;\r\n  }\r\n\r\n  window.resetHair = function() {\r\n    currentStep = 0;\r\n    faceType = \"\";\r\n    renderStep();\r\n  };\r\n\r\n  if (document.readyState === \"loading\") {\r\n    document.addEventListener(\"DOMContentLoaded\", renderStep);\r\n  } else {\r\n    renderStep();\r\n  }\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-57249ea e-con-full e-flex e-con e-child\" data-id=\"57249ea\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-af4eb34 elementor-widget elementor-widget-html\" data-id=\"af4eb34\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap');\r\n\r\n.card-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));\r\n  gap: 20px;\r\n  max-width: 1200px;\r\n  margin: 20px auto;\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n}\r\n\r\n.p-card {\r\n  background: #18181b; \/* Twoje luksusowe, ciemne t\u0142o *\/\r\n  border: 1px solid #27272a;\r\n  border-radius: 20px;\r\n  padding: 30px;\r\n  text-align: left;\r\n  color: #ffffff;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: space-between;\r\n  transition: transform 0.3s ease;\r\n}\r\n\r\n.p-card:hover { \r\n  transform: translateY(-5px); \r\n  border-color: #a855f7; \/* Tw\u00f3j fioletowy akcent ze screena *\/\r\n}\r\n\r\n.p-icon {\r\n  width: 48px;\r\n  height: 48px;\r\n  background: rgba(168, 85, 247, 0.1);\r\n  border-radius: 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 1.5rem;\r\n  margin-bottom: 20px;\r\n  border: 1px solid rgba(168, 85, 247, 0.3);\r\n}\r\n\r\n.p-title { font-size: 1.5rem; font-weight: 800; margin-bottom: 10px; color: #ffffff; }\r\n.p-desc { font-size: 0.95rem; color: #a1a1aa; margin-bottom: 25px; line-height: 1.5; }\r\n\r\n.p-features { list-style: none; padding: 0; margin: 0 0 30px 0; }\r\n.p-features li {\r\n  font-size: 0.9rem;\r\n  color: #e4e4e7;\r\n  margin-bottom: 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n}\r\n\r\n.p-features li::before {\r\n  content: '\u2713';\r\n  color: #a855f7;\r\n  font-weight: 800;\r\n}\r\n\r\n.p-price { font-size: 1.8rem; font-weight: 800; color: #ffffff; margin-bottom: 20px; }\r\n\r\n.p-btn {\r\n  width: 100%;\r\n  background: #a855f7;\r\n  color: white;\r\n  border: none;\r\n  padding: 14px;\r\n  border-radius: 12px;\r\n  font-weight: 800;\r\n  cursor: pointer;\r\n  text-align: center;\r\n  text-decoration: none;\r\n  font-size: 0.95rem;\r\n  transition: background 0.2s;\r\n  display: block;\r\n}\r\n.p-btn:hover { background: #9333ea; }\r\n<\/style>\r\n\r\n<div class=\"card-grid\">\r\n\r\n  <div class=\"p-card\">\r\n    <div>\r\n      <div class=\"p-icon\">\ud83d\udc87\u200d\u2640\ufe0f<\/div>\r\n      <div class=\"p-title\">Wirtualny Stylista Fryzur<\/div>\r\n      <div class=\"p-desc\">Inteligentny dob\u00f3r ci\u0119cia i koloryzacji dopasowany pod kszta\u0142t twarzy oraz struktur\u0119 w\u0142os\u00f3w klienta.<\/div>\r\n      <ul class=\"p-features\">\r\n        <li>Personalizowane rekomendacje strzy\u017ce\u0144 i piel\u0119gnacji<\/li>\r\n        <li>Rozwi\u0105zuje problem z niezdecydowaniem klienta<\/li>\r\n        <li>Automatycznie poleca pasuj\u0105ce zabiegi salonowe<\/li>\r\n        <li>Estetyczny interfejs w stylu nowojorskiego loftu<\/li>\r\n      <\/ul>\r\n    <\/div>\r\n    <div>\r\n      <div class=\"p-price\">od 500 z\u0142<\/div>\r\n      <a href=\"#kontakt\" class=\"p-btn\">Wdr\u00f3\u017c u Klienta<\/a>\r\n    <\/div>\r\n  <\/div>\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a9b691a e-flex e-con-boxed e-con e-parent\" data-id=\"a9b691a\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-a76e6fe e-con-full e-flex e-con e-child\" data-id=\"a76e6fe\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-db9f9d1 elementor-widget elementor-widget-html\" data-id=\"db9f9d1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap');\r\n\r\n.card-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));\r\n  gap: 20px;\r\n  max-width: 1200px;\r\n  margin: 20px auto;\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n}\r\n\r\n.p-card {\r\n  background: #18181b; \/* Luksusowe, ciemne t\u0142o Twojej oferty *\/\r\n  border: 1px solid #27272a;\r\n  border-radius: 20px;\r\n  padding: 30px;\r\n  text-align: left;\r\n  color: #ffffff;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: space-between;\r\n  transition: transform 0.3s ease;\r\n}\r\n\r\n.p-card:hover { \r\n  transform: translateY(-5px); \r\n  border-color: #a855f7; \/* Tw\u00f3j fioletowy akcent ze screena *\/\r\n}\r\n\r\n.p-icon {\r\n  width: 48px;\r\n  height: 48px;\r\n  background: rgba(168, 85, 247, 0.1);\r\n  border-radius: 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 1.5rem;\r\n  margin-bottom: 20px;\r\n  border: 1px solid rgba(168, 85, 247, 0.3);\r\n}\r\n\r\n.p-title { font-size: 1.5rem; font-weight: 800; margin-bottom: 10px; color: #ffffff; }\r\n.p-desc { font-size: 0.95rem; color: #a1a1aa; margin-bottom: 25px; line-height: 1.5; }\r\n\r\n.p-features { list-style: none; padding: 0; margin: 0 0 30px 0; }\r\n.p-features li {\r\n  font-size: 0.9rem;\r\n  color: #e4e4e7;\r\n  margin-bottom: 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n}\r\n\r\n.p-features li::before {\r\n  content: '\u2713';\r\n  color: #a855f7;\r\n  font-weight: 800;\r\n}\r\n\r\n.p-price { font-size: 1.8rem; font-weight: 800; color: #ffffff; margin-bottom: 20px; }\r\n\r\n.p-btn {\r\n  width: 100%;\r\n  background: #a855f7;\r\n  color: white;\r\n  border: none;\r\n  padding: 14px;\r\n  border-radius: 12px;\r\n  font-weight: 800;\r\n  cursor: pointer;\r\n  text-align: center;\r\n  text-decoration: none;\r\n  font-size: 0.95rem;\r\n  transition: background 0.2s;\r\n  display: block;\r\n}\r\n.p-btn:hover { background: #9333ea; }\r\n<\/style>\r\n\r\n<div class=\"card-grid\">\r\n\r\n  <div class=\"p-card\">\r\n    <div>\r\n      <div class=\"p-icon\">\ud83d\udc85<\/div>\r\n      <div class=\"p-title\">Dobierz Kszta\u0142t Paznokci<\/div>\r\n      <div class=\"p-desc\">Wizualny przewodnik i doradca kszta\u0142tu paznokci dla salon\u00f3w manicure. Edukuje i przyspiesza wizyt\u0119.<\/div>\r\n      <ul class=\"p-features\">\r\n        <li>Wyszczeg\u00f3lnia zalety ka\u017cdego z kszta\u0142t\u00f3w p\u0142ytki<\/li>\r\n        <li>Rekomenduje stylizacje pod budow\u0119 d\u0142oni<\/li>\r\n        <li>Brak prze\u0142adowania strony (Szybki JS)<\/li>\r\n        <li>Zwi\u0119ksza zaanga\u017cowanie klienta na stronie<\/li>\r\n      <\/ul>\r\n    <\/div>\r\n    <div>\r\n      <div class=\"p-price\">od 350 z\u0142<\/div>\r\n      <a href=\"#kontakt\" class=\"p-btn\">Wdr\u00f3\u017c u Klienta<\/a>\r\n    <\/div>\r\n  <\/div>\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-deedccb e-con-full e-flex e-con e-child\" data-id=\"deedccb\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0a5244e elementor-widget elementor-widget-html\" data-id=\"0a5244e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap');\r\n\r\n.nail-widget {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  max-width: 450px;\r\n  margin: 20px auto;\r\n  background: #ffffff;\r\n  border-radius: 24px;\r\n  box-shadow: 0 10px 40px rgba(244, 114, 182, 0.1);\r\n  overflow: hidden;\r\n  border: 1px solid #fff1f2;\r\n}\r\n\r\n.nail-header {\r\n  background: linear-gradient(135deg, #fbcfe8 0%, #ec4899 100%);\r\n  color: #ffffff;\r\n  padding: 25px 20px;\r\n  text-align: center;\r\n}\r\n\r\n.nail-header h3 { margin: 0 0 8px 0; font-size: 1.25rem; font-weight: 800; color: #ffffff; }\r\n.nail-header p { margin: 0; font-size: 0.9rem; opacity: 0.9; color: #ffffff; }\r\n\r\n.nail-body { padding: 25px 20px; }\r\n\r\n.nail-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(3, 1fr);\r\n  gap: 12px;\r\n  margin-bottom: 25px;\r\n}\r\n\r\n.nail-item {\r\n  background: #fff1f2;\r\n  border: 1px solid #ffe4e6;\r\n  border-radius: 12px;\r\n  padding: 15px 10px;\r\n  cursor: pointer;\r\n  text-align: center;\r\n  transition: all 0.2s ease;\r\n}\r\n\r\n.nail-item:hover { transform: translateY(-3px); background: #ffe4e6; }\r\n.nail-item.active { border-color: #ec4899; background: #fdf2f8; box-shadow: 0 0 0 2px #ec4899; }\r\n\r\n.nail-icon { font-size: 1.8rem; margin-bottom: 8px; }\r\n.nail-name { font-size: 0.85rem; font-weight: 800; color: #4c1d95; }\r\n\r\n.nail-result {\r\n  background: #fdf2f8;\r\n  border: 1px solid #fbcfe8;\r\n  border-radius: 16px;\r\n  padding: 20px;\r\n  min-height: 120px;\r\n  text-align: left;\r\n}\r\n\r\n.nail-res-title { font-weight: 800; color: #ec4899; font-size: 1rem; margin-bottom: 8px; }\r\n.nail-res-desc { font-size: 0.9rem; color: #4b5563; line-height: 1.5; }\r\n\r\n.nail-btn {\r\n  width: 100%;\r\n  background: #ec4899;\r\n  color: white;\r\n  border: none;\r\n  padding: 15px;\r\n  border-radius: 12px;\r\n  font-size: 1rem;\r\n  font-weight: 800;\r\n  cursor: pointer;\r\n  margin-top: 20px;\r\n  box-shadow: 0 4px 12px rgba(236, 72, 153, 0.3);\r\n  transition: 0.2s;\r\n}\r\n.nail-btn:hover { background: #be185d; transform: translateY(-2px); }\r\n<\/style>\r\n\r\n<div class=\"nail-widget\">\r\n  <div class=\"nail-header\">\r\n    <h3>\ud83d\udc85 Dobierz Kszta\u0142t Paznokci<\/h3>\r\n    <p>Kliknij kszta\u0142t, aby zobaczy\u0107 rekomendacj\u0119 stylistki<\/p>\r\n  <\/div>\r\n  <div class=\"nail-body\">\r\n    <div class=\"nail-grid\">\r\n      <div class=\"nail-item active\" onclick=\"selectNail(this, 'Migda\u0142', 'Wysmukla d\u0142onie i optycznie wyd\u0142u\u017ca palce. Idealny dla ka\u017cdego typu d\u0142oni. Najtrwalszy kszta\u0142t!')\">\r\n        <div class=\"nail-icon\">\ud83c\udf30<\/div>\r\n        <div class=\"nail-name\">Migda\u0142<\/div>\r\n      <\/div>\r\n      <div class=\"nail-item\" onclick=\"selectNail(this, 'Kwadrat', 'Nowoczesny i elegancki. Najlepiej wygl\u0105da na szczup\u0142ych palcach i d\u0142ugiej p\u0142ytce.')\">\r\n        <div class=\"nail-icon\">\u23f9\ufe0f<\/div>\r\n        <div class=\"nail-name\">Kwadrat<\/div>\r\n      <\/div>\r\n      <div class=\"nail-item\" onclick=\"selectNail(this, 'Balerina', 'Efektowny i odwa\u017cny. Wymaga nieco d\u0142u\u017cszej p\u0142ytki lub przed\u0142u\u017cania \u017celowego.')\">\r\n        <div class=\"nail-icon\">\ud83e\ude70<\/div>\r\n        <div class=\"nail-name\">Balerina<\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"nail-result\">\r\n      <div id=\"nail-title\" class=\"nail-res-title\">Migda\u0142<\/div>\r\n      <div id=\"nail-desc\" class=\"nail-res-desc\">Wysmukla d\u0142onie i optycznie wyd\u0142u\u017ca palce. Idealny dla ka\u017cdego typu d\u0142oni. Najtrwalszy kszta\u0142t!<\/div>\r\n    <\/div>\r\n\r\n    <button type=\"button\" class=\"nail-btn\">Zarezerwuj manicure<\/button>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\nfunction selectNail(element, title, desc) {\r\n  document.querySelectorAll('.nail-item').forEach(item => item.classList.remove('active'));\r\n  element.classList.add('active');\r\n  document.getElementById('nail-title').innerText = title;\r\n  document.getElementById('nail-desc').innerText = desc;\r\n}\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-044ef73 e-flex e-con-boxed e-con e-parent\" data-id=\"044ef73\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-36da4b8 e-con-full e-flex e-con e-child\" data-id=\"36da4b8\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4fc5822 elementor-widget elementor-widget-html\" data-id=\"4fc5822\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap');\r\n\r\n.lash-widget {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  max-width: 450px;\r\n  margin: 20px auto;\r\n  background: #ffffff;\r\n  border-radius: 24px;\r\n  box-shadow: 0 10px 40px rgba(0,0,0,0.05);\r\n  overflow: hidden;\r\n  border: 1px solid #f3f4f6;\r\n}\r\n\r\n.lash-header {\r\n  background: #111827;\r\n  color: #ffffff;\r\n  padding: 25px 20px;\r\n  text-align: center;\r\n}\r\n\r\n.lash-header h3 { margin: 0 0 8px 0; font-size: 1.25rem; font-weight: 800; color: #ffffff; }\r\n.lash-header p { margin: 0; font-size: 0.9rem; opacity: 0.8; color: #ffffff; }\r\n\r\n.lash-body { padding: 25px 20px; }\r\n\r\n.lash-display {\r\n  width: 100%;\r\n  height: 200px;\r\n  background: linear-gradient(135deg, #374151 0%, #111827 100%);\r\n  border-radius: 16px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: center;\r\n  align-items: center;\r\n  position: relative;\r\n  overflow: hidden;\r\n  margin-bottom: 25px;\r\n}\r\n\r\n.lash-eye-icon { font-size: 4rem; margin-bottom: 10px; transition: all 0.3s ease; }\r\n\r\n.lash-btn-group {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 10px;\r\n}\r\n\r\n.lash-btn-item {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  background: #f9fafb;\r\n  padding: 15px;\r\n  border-radius: 12px;\r\n  border: 1px solid #e5e7eb;\r\n  cursor: pointer;\r\n  transition: all 0.2s;\r\n}\r\n\r\n.lash-btn-item:hover { background: #f3f4f6; }\r\n.lash-btn-item.active { border-color: #111827; background: #f3f4f6; box-shadow: 0 0 0 2px #111827; }\r\n\r\n.lash-btn-title { font-weight: 800; color: #111827; font-size: 0.95rem; }\r\n.lash-btn-sub { font-size: 0.8rem; color: #6b7280; }\r\n<\/style>\r\n\r\n<div class=\"lash-widget\">\r\n  <div class=\"lash-header\">\r\n    <h3>\ud83d\udc41\ufe0f Stylizacja Oczu i Rz\u0119s<\/h3>\r\n    <p>Wybierz efekt i zobacz stylizacj\u0119<\/p>\r\n  <\/div>\r\n  <div class=\"lash-body\">\r\n    <div class=\"lash-display\">\r\n      <div id=\"lash-visual\" class=\"lash-eye-icon\">\ud83d\ude0c<\/div>\r\n      <div id=\"lash-status\" style=\"font-weight: 800; color: #9ca3af; font-size: 0.9rem;\">Naturalne (Bez rz\u0119s)<\/div>\r\n    <\/div>\r\n\r\n    <div class=\"lash-btn-group\">\r\n      <div class=\"lash-btn-item active\" onclick=\"changeLash(this, '\ud83d\ude0c', 'Naturalne rz\u0119sy', 'Delikatne podkre\u015blenie oka.')\">\r\n        <div><div class=\"lash-btn-title\">Natural Look<\/div><div class=\"lash-btn-sub\">Metoda 1:1<\/div><\/div>\r\n      <\/div>\r\n      <div class=\"lash-btn-item\" onclick=\"changeLash(this, '\ud83e\udd29', 'Rz\u0119sy 2D\/3D (Lekka Obj\u0119to\u015b\u0107)', 'Zag\u0119szczone rz\u0119sy do noszenia na co dzie\u0144.')\">\r\n        <div><div class=\"lash-btn-title\">Russian Volume<\/div><div class=\"lash-btn-sub\">Efekt puszystych rz\u0119s<\/div><\/div>\r\n      <\/div>\r\n      <div class=\"lash-btn-item\" onclick=\"changeLash(this, '\ud83d\udc51', 'Hollywood Effect (Mega Obj\u0119to\u015b\u0107)', 'Maksymalne zag\u0119szczenie na wielkie wyj\u015bcia.')\">\r\n        <div><div class=\"lash-btn-title\">Hollywood Effect<\/div><div class=\"lash-btn-sub\">Mocne zag\u0119szczenie i czer\u0144<\/div><\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\nfunction changeLash(element, emoji, statusText, info) {\r\n  document.querySelectorAll('.lash-btn-item').forEach(item => item.classList.remove('active'));\r\n  element.classList.add('active');\r\n  document.getElementById('lash-visual').innerText = emoji;\r\n  document.getElementById('lash-status').innerText = statusText;\r\n}\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-c233fb2 e-con-full e-flex e-con e-child\" data-id=\"c233fb2\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-791cf7a elementor-widget elementor-widget-html\" data-id=\"791cf7a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap');\r\n\r\n.card-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));\r\n  gap: 20px;\r\n  max-width: 1200px;\r\n  margin: 20px auto;\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n}\r\n\r\n.p-card {\r\n  background: #18181b; \/* Ciemne t\u0142o zgodne z Twoim cennikiem *\/\r\n  border: 1px solid #27272a;\r\n  border-radius: 20px;\r\n  padding: 30px;\r\n  text-align: left;\r\n  color: #ffffff;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: space-between;\r\n  transition: transform 0.3s ease;\r\n}\r\n\r\n.p-card:hover { \r\n  transform: translateY(-5px); \r\n  border-color: #a855f7; \/* Fioletowy akcent z Twojego screena *\/\r\n}\r\n\r\n.p-icon {\r\n  width: 48px;\r\n  height: 48px;\r\n  background: rgba(168, 85, 247, 0.1);\r\n  border-radius: 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 1.5rem;\r\n  margin-bottom: 20px;\r\n  border: 1px solid rgba(168, 85, 247, 0.3);\r\n}\r\n\r\n.p-title { font-size: 1.5rem; font-weight: 800; margin-bottom: 10px; color: #ffffff; }\r\n.p-desc { font-size: 0.95rem; color: #a1a1aa; margin-bottom: 25px; line-height: 1.5; }\r\n\r\n.p-features { list-style: none; padding: 0; margin: 0 0 30px 0; }\r\n.p-features li {\r\n  font-size: 0.9rem;\r\n  color: #e4e4e7;\r\n  margin-bottom: 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n}\r\n\r\n.p-features li::before {\r\n  content: '\u2713';\r\n  color: #a855f7;\r\n  font-weight: 800;\r\n}\r\n\r\n.p-price { font-size: 1.8rem; font-weight: 800; color: #ffffff; margin-bottom: 20px; }\r\n\r\n.p-btn {\r\n  width: 100%;\r\n  background: #a855f7;\r\n  color: white;\r\n  border: none;\r\n  padding: 14px;\r\n  border-radius: 12px;\r\n  font-weight: 800;\r\n  cursor: pointer;\r\n  text-align: center;\r\n  text-decoration: none;\r\n  font-size: 0.95rem;\r\n  transition: background 0.2s;\r\n  display: block;\r\n}\r\n.p-btn:hover { background: #9333ea; }\r\n<\/style>\r\n\r\n<div class=\"card-grid\">\r\n\r\n  <div class=\"p-card\">\r\n    <div>\r\n      <div class=\"p-icon\">\ud83d\udc41\ufe0f<\/div>\r\n      <div class=\"p-title\">Stylizacja Oczu i Rz\u0119s<\/div>\r\n      <div class=\"p-desc\">Wizualny i interaktywny dob\u00f3r efektu i obj\u0119to\u015bci rz\u0119s (1:1, Russian Volume, Hollywood).<\/div>\r\n      <ul class=\"p-features\">\r\n        <li>Zwalcza problem niepewno\u015bci u klientek<\/li>\r\n        <li>Przedstawia efekty i r\u00f3\u017cnice bez nudnych galerii<\/li>\r\n        <li>Responsywny design dzia\u0142aj\u0105cy p\u0142ynnie na mobile<\/li>\r\n        <li>Mo\u017cliwo\u015b\u0107 szybkiego pod\u0142\u0105czenia pod rezerwacj\u0119<\/li>\r\n      <\/ul>\r\n    <\/div>\r\n    <div>\r\n      <div class=\"p-price\">od 400 z\u0142<\/div>\r\n      <a href=\"#kontakt\" class=\"p-btn\">Wdr\u00f3\u017c u Klienta<\/a>\r\n    <\/div>\r\n  <\/div>\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-79141b4 e-flex e-con-boxed e-con e-parent\" data-id=\"79141b4\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-1e12b23 e-con-full e-flex e-con e-child\" data-id=\"1e12b23\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5c83b39 elementor-widget elementor-widget-html\" data-id=\"5c83b39\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap');\r\n\r\n.card-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));\r\n  gap: 20px;\r\n  max-width: 1200px;\r\n  margin: 20px auto;\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n}\r\n\r\n.p-card {\r\n  background: #18181b; \/* Ciemne t\u0142o Twojego cennika *\/\r\n  border: 1px solid #27272a;\r\n  border-radius: 20px;\r\n  padding: 30px;\r\n  text-align: left;\r\n  color: #ffffff;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: space-between;\r\n  transition: transform 0.3s ease;\r\n}\r\n\r\n.p-card:hover { \r\n  transform: translateY(-5px); \r\n  border-color: #a855f7; \/* Tw\u00f3j fioletowy akcent ze screena *\/\r\n}\r\n\r\n.p-icon {\r\n  width: 48px;\r\n  height: 48px;\r\n  background: rgba(168, 85, 247, 0.1);\r\n  border-radius: 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 1.5rem;\r\n  margin-bottom: 20px;\r\n  border: 1px solid rgba(168, 85, 247, 0.3);\r\n}\r\n\r\n.p-title { font-size: 1.5rem; font-weight: 800; margin-bottom: 10px; color: #ffffff; }\r\n.p-desc { font-size: 0.95rem; color: #a1a1aa; margin-bottom: 25px; line-height: 1.5; }\r\n\r\n.p-features { list-style: none; padding: 0; margin: 0 0 30px 0; }\r\n.p-features li {\r\n  font-size: 0.9rem;\r\n  color: #e4e4e7;\r\n  margin-bottom: 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n}\r\n\r\n.p-features li::before {\r\n  content: '\u2713';\r\n  color: #a855f7;\r\n  font-weight: 800;\r\n}\r\n\r\n.p-price { font-size: 1.8rem; font-weight: 800; color: #ffffff; margin-bottom: 20px; }\r\n\r\n.p-btn {\r\n  width: 100%;\r\n  background: #a855f7;\r\n  color: white;\r\n  border: none;\r\n  padding: 14px;\r\n  border-radius: 12px;\r\n  font-weight: 800;\r\n  cursor: pointer;\r\n  text-align: center;\r\n  text-decoration: none;\r\n  font-size: 0.95rem;\r\n  transition: background 0.2s;\r\n  display: block;\r\n}\r\n.p-btn:hover { background: #9333ea; }\r\n<\/style>\r\n\r\n<div class=\"card-grid\">\r\n\r\n  <div class=\"p-card\">\r\n    <div>\r\n      <div class=\"p-icon\">\u26a1<\/div>\r\n      <div class=\"p-title\">Pakiet Depilacji Laserowej<\/div>\r\n      <div class=\"p-desc\">Przelicznik serii zabiegowych obrazuj\u0105cy natychmiastowe oszcz\u0119dno\u015bci przy zakupie karnetu.<\/div>\r\n      <ul class=\"p-features\">\r\n        <li>Pokazuje warto\u015b\u0107 gratis\u00f3w i oszcz\u0119dno\u015bci finansowych<\/li>\r\n        <li>Generuje zakupy serii zamiast pojedynczych wizyt<\/li>\r\n        <li>Idealne dla laseroterapii i endermologii<\/li>\r\n        <li>Brak prze\u0142adowania (Lekki i b\u0142yskawiczny kod JS)<\/li>\r\n      <\/ul>\r\n    <\/div>\r\n    <div>\r\n      <div class=\"p-price\">od 400 z\u0142<\/div>\r\n      <a href=\"#kontakt\" class=\"p-btn\">Wdr\u00f3\u017c u Klienta<\/a>\r\n    <\/div>\r\n  <\/div>\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-dff1e79 e-con-full e-flex e-con e-child\" data-id=\"dff1e79\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6a9b7eb elementor-widget elementor-widget-html\" data-id=\"6a9b7eb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@400;600;800&display=swap');\r\n\r\n.laser-widget {\r\n  font-family: 'Plus Jakarta Sans', sans-serif;\r\n  max-width: 450px;\r\n  margin: 20px auto;\r\n  background: #ffffff;\r\n  border-radius: 24px;\r\n  box-shadow: 0 10px 40px rgba(59, 130, 246, 0.1);\r\n  overflow: hidden;\r\n  border: 1px solid #f1f5f9;\r\n}\r\n\r\n.laser-header {\r\n  background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);\r\n  color: #ffffff;\r\n  padding: 25px 20px;\r\n  text-align: center;\r\n}\r\n\r\n.laser-header h3 { margin: 0 0 8px 0; font-size: 1.25rem; font-weight: 800; color: #ffffff; }\r\n.laser-header p { margin: 0; font-size: 0.9rem; opacity: 0.9; color: #ffffff; }\r\n\r\n.laser-body { padding: 25px 20px; }\r\n\r\n.laser-label { font-size: 0.85rem; font-weight: 800; color: #475569; text-transform: uppercase; margin-bottom: 10px; display: block; text-align: left; }\r\n\r\n.laser-select {\r\n  width: 100%;\r\n  background: #f8fafc;\r\n  border: 1px solid #e2e8f0;\r\n  padding: px;\r\n  border-radius: 12px;\r\n  font-size: 1rem;\r\n  font-family: inherit;\r\n  margin-bottom: 20px;\r\n  outline: none;\r\n  cursor: pointer;\r\n}\r\n\r\n.laser-sum-box {\r\n  background: #f8fafc;\r\n  border: 1px solid #e2e8f0;\r\n  border-radius: 16px;\r\n  padding: 20px;\r\n  margin-bottom: 20px;\r\n}\r\n\r\n.laser-row { display: flex; justify-content: space-between; margin-bottom: 12px; font-size: 0.9rem; color: #475569; }\r\n.laser-row span:last-child { font-weight: 800; color: #1e293b; }\r\n\r\n.laser-savings {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  padding-top: 12px;\r\n  border-top: 1px solid #e2e8f0;\r\n  font-weight: 800;\r\n  color: #10b981;\r\n}\r\n\r\n.laser-btn {\r\n  width: 100%;\r\n  background: #3b82f6;\r\n  color: white;\r\n  border: none;\r\n  padding: 15px;\r\n  border-radius: 12px;\r\n  font-size: 1rem;\r\n  font-weight: 800;\r\n  cursor: pointer;\r\n  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);\r\n  transition: 0.2s;\r\n}\r\n.laser-btn:hover { background: #1d4ed8; transform: translateY(-2px); }\r\n<\/style>\r\n\r\n<div class=\"laser-widget\">\r\n  <div class=\"laser-header\">\r\n    <h3>\u26a1 Pakiet Depilacji Laserowej<\/h3>\r\n    <p>Wybierz parti\u0119 cia\u0142a i sprawd\u017a, ile oszcz\u0119dzasz w serii<\/p>\r\n  <\/div>\r\n  <div class=\"laser-body\">\r\n    <label class=\"laser-label\">Wybierz parti\u0119 cia\u0142a:<\/label>\r\n    <select id=\"laser-part\" class=\"laser-select\" onchange=\"calcLaser()\">\r\n      <option value=\"200\" selected>Pachy (200 z\u0142\/zabieg)<\/option>\r\n      <option value=\"400\">Ca\u0142e Nogi (400 z\u0142\/zabieg)<\/option>\r\n      <option value=\"300\">Bikini g\u0142\u0119bokie (300 z\u0142\/zabieg)<\/option>\r\n      <option value=\"150\">W\u0105sik (150 z\u0142\/zabieg)<\/option>\r\n    <\/select>\r\n\r\n    <div class=\"laser-sum-box\">\r\n      <div class=\"laser-row\"><span>Cena 1 zabiegu:<\/span> <span id=\"l-single\">200 z\u0142<\/span><\/div>\r\n      <div class=\"laser-row\"><span>Cena pakietu (6 zabieg\u00f3w):<\/span> <span id=\"l-package\">1000 z\u0142<\/span><\/div>\r\n      <div class=\"laser-savings\"><span>\ud83d\udd25 Twoja oszcz\u0119dno\u015b\u0107:<\/span> <span id=\"l-save\">200 z\u0142 (1 zabieg GRATIS)<\/span><\/div>\r\n    <\/div>\r\n\r\n    <button type=\"button\" class=\"laser-btn\">Kup pakiet laserowy<\/button>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\nfunction calcLaser() {\r\n  const basePrice = parseInt(document.getElementById('laser-part').value);\r\n  const singleCost = basePrice;\r\n  const packageCost = (basePrice * 5); \/\/ 6 zabieg\u00f3w w cenie 5\r\n  const savings = basePrice;\r\n\r\n  document.getElementById('l-single').innerText = singleCost + \" z\u0142\";\r\n  document.getElementById('l-package').innerText = packageCost + \" z\u0142\";\r\n  document.getElementById('l-save').innerText = savings + \" z\u0142 (1 zabieg GRATIS)\";\r\n}\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-80f9baf e-flex e-con-boxed e-con e-parent\" data-id=\"80f9baf\" data-element_type=\"container\" data-e-type=\"container\" id=\"kontakt\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2b3ab5a elementor-widget elementor-widget-html\" data-id=\"2b3ab5a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@300;400;500;600;700&amp;display=swap\" rel=\"stylesheet\">\r\n<script src=\"https:\/\/cdn.jsdelivr.net\/npm\/lucide@0.263.0\/dist\/umd\/lucide.min.js\"><\/script>\r\n\r\n<div id=\"wrapper-kontakt-premium\">\r\n    <style>\r\n        #wrapper-kontakt-premium, #wrapper-kontakt-premium * {\r\n            font-family: 'Poppins', sans-serif !important;\r\n            box-sizing: border-box !important;\r\n        }\r\n\r\n        #wrapper-kontakt-premium {\r\n            background: #0a0a0c !important;\r\n            padding: 80px 20px;\r\n            color: #ffffff;\r\n            width: 100%;\r\n            display: flex;\r\n            justify-content: center;\r\n        }\r\n\r\n        .contact-container {\r\n            width: 100%;\r\n            max-width: 1100px;\r\n            display: grid;\r\n            grid-template-columns: 1fr 1.2fr;\r\n            gap: 60px;\r\n            align-items: center;\r\n        }\r\n\r\n        \/* LEWA STRONA *\/\r\n        .contact-info h2 {\r\n            font-size: clamp(30px, 4vw, 42px) !important;\r\n            font-weight: 700;\r\n            margin-bottom: 20px;\r\n            background: linear-gradient(135deg, #fff 0%, #94a3b8 100%);\r\n            -webkit-background-clip: text;\r\n            -webkit-text-fill-color: transparent;\r\n        }\r\n\r\n        .contact-info p { color: #94a3b8; font-size: 16px; margin-bottom: 30px; font-weight: 300; }\r\n\r\n        .benefit-card {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 12px;\r\n            padding: 12px;\r\n            background: rgba(255, 255, 255, 0.03);\r\n            border-radius: 12px;\r\n            margin-bottom: 12px;\r\n            border: 1px solid rgba(255, 255, 255, 0.05);\r\n        }\r\n        .benefit-card i { color: #ec4899; }\r\n\r\n        \/* PRAWA STRONA - FORMULARZ *\/\r\n        .form-glass {\r\n            background: rgba(255, 255, 255, 0.02);\r\n            backdrop-filter: blur(20px);\r\n            border: 1px solid rgba(255, 255, 255, 0.1);\r\n            border-radius: 24px;\r\n            padding: 35px;\r\n        }\r\n\r\n        .form-group { margin-bottom: 18px; position: relative; }\r\n\r\n        .form-group label {\r\n            display: block;\r\n            font-size: 12px;\r\n            color: #94a3b8;\r\n            margin-bottom: 6px;\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.5px;\r\n        }\r\n\r\n        \/* NAPRAWIONE INPUTY I SELECT *\/\r\n        .input-control {\r\n            width: 100%;\r\n            height: 54px; \/* Sztywna wysoko\u015b\u0107 dla wszystkich p\u00f3l *\/\r\n            background: rgba(255, 255, 255, 0.05);\r\n            border: 1px solid rgba(255, 255, 255, 0.1);\r\n            border-radius: 12px;\r\n            padding: 0 15px 0 45px; \/* Wy\u015brodkowanie tekstu w pionie przez padding 0 *\/\r\n            color: #fff;\r\n            font-size: 15px;\r\n            transition: all 0.3s ease;\r\n            display: flex;\r\n            align-items: center;\r\n        }\r\n\r\n        \/* SPECJALNA NAPRAWA DLA SELECTA *\/\r\n        select.input-control {\r\n            cursor: pointer;\r\n            appearance: none !important;\r\n            -webkit-appearance: none !important;\r\n            background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'\/%3E%3C\/svg%3E\") !important;\r\n            background-repeat: no-repeat !important;\r\n            background-position: right 15px center !important;\r\n            background-size: 16px !important;\r\n            line-height: 54px !important; \/* Wymuszenie centrowania w niekt\u00f3rych przegl\u0105darkach *\/\r\n        }\r\n\r\n        \/* Textarea musi mie\u0107 auto wysoko\u015b\u0107 *\/\r\n        textarea.input-control {\r\n            height: auto !important;\r\n            min-height: 100px;\r\n            padding-top: 15px !important;\r\n            line-height: 1.5;\r\n        }\r\n\r\n        .form-group i.field-icon {\r\n            position: absolute;\r\n            left: 15px;\r\n            top: 36px; \/* Idealne wyr\u00f3wnanie przy labelu *\/\r\n            color: #64748b;\r\n            pointer-events: none;\r\n        }\r\n\r\n        .submit-btn {\r\n            width: 100%;\r\n            background: linear-gradient(135deg, #ec4899 0%, #8b5cf6 100%);\r\n            color: #fff;\r\n            border: none;\r\n            height: 56px;\r\n            border-radius: 12px;\r\n            font-weight: 600;\r\n            font-size: 16px;\r\n            cursor: pointer;\r\n            transition: all 0.3s ease;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            gap: 10px;\r\n            margin-top: 10px;\r\n        }\r\n\r\n        .submit-btn:hover {\r\n            transform: translateY(-2px);\r\n            box-shadow: 0 10px 20px rgba(236, 72, 153, 0.3);\r\n        }\r\n\r\n        .success-overlay { display: none; text-align: center; color: #4ade80; margin-top: 15px; font-size: 14px; }\r\n\r\n        @media (max-width: 900px) {\r\n            .contact-container { grid-template-columns: 1fr; gap: 40px; }\r\n            .form-glass { padding: 25px; }\r\n        }\r\n    <\/style>\r\n\r\n    <div class=\"contact-container\">\r\n        <div class=\"contact-info\">\r\n            <h2>Porozmawiajmy o Twoim projekcie<\/h2>\r\n            <p>Napisz kilka s\u0142\u00f3w o swoim biznesie, a zaproponuj\u0119 najlepsze rozwi\u0105zanie.<\/p>\r\n            \r\n            <div class=\"benefit-card\"><i data-lucide=\"zap\" size=\"18\"><\/i><span>Szybka odpowied\u017a w 24h<\/span><\/div>\r\n            <div class=\"benefit-card\"><i data-lucide=\"shield-check\" size=\"18\"><\/i><span>Pe\u0142ne bezpiecze\u0144stwo danych<\/span><\/div>\r\n            <div class=\"benefit-card\"><i data-lucide=\"cpu\" size=\"18\"><\/i><span>Wsparcie AI i automatyzacji<\/span><\/div>\r\n        <\/div>\r\n\r\n        <div class=\"form-wrapper\">\r\n            <form id=\"premium-contact-form\" class=\"form-glass\">\r\n                <div class=\"form-group\">\r\n                    <label>Imi\u0119 i nazwisko<\/label>\r\n                    <i data-lucide=\"user\" size=\"18\" class=\"field-icon\"><\/i>\r\n                    <input type=\"text\" class=\"input-control\" placeholder=\"Twoje imi\u0119...\" required>\r\n                <\/div>\r\n\r\n                <div class=\"form-group\">\r\n                    <label>Adres e-mail<\/label>\r\n                    <i data-lucide=\"mail\" size=\"18\" class=\"field-icon\"><\/i>\r\n                    <input type=\"email\" class=\"input-control\" placeholder=\"twoj@email.pl\" required>\r\n                <\/div>\r\n\r\n                <div class=\"form-group\">\r\n                    <label>Opis projektu<\/label>\r\n                    <i data-lucide=\"message-square\" size=\"18\" class=\"field-icon\"><\/i>\r\n                    <textarea class=\"input-control\" placeholder=\"W czym mog\u0119 Ci pom\u00f3c?\"><\/textarea>\r\n                <\/div>\r\n\r\n                <div class=\"form-group\">\r\n                    <label>Przybli\u017cony bud\u017cet<\/label>\r\n                    <i data-lucide=\"banknote\" size=\"18\" class=\"field-icon\"><\/i>\r\n                    <select class=\"input-control\">\r\n                        <option value=\"\" disabled selected>Wybierz zakres (opcjonalnie)<\/option>\r\n                        <option value=\"1\">Poni\u017cej 5 000 PLN<\/option>\r\n                        <option value=\"2\">5 000 - 15 000 PLN<\/option>\r\n                        <option value=\"3\">Powy\u017cej 15 000 PLN<\/option>\r\n                    <\/select>\r\n                <\/div>\r\n\r\n                <button type=\"submit\" class=\"submit-btn\">\r\n                    <span>Wy\u015blij zapytanie<\/span>\r\n                    <i data-lucide=\"send\" size=\"18\"><\/i>\r\n                <\/button>\r\n\r\n                <div id=\"form-success\" class=\"success-overlay\">\r\n                    <i data-lucide=\"check-circle\" size=\"18\" style=\"vertical-align: middle; margin-right: 5px;\"><\/i> \r\n                    Wiadomo\u015b\u0107 wys\u0142ana! Odpowiem niebawem.\r\n                <\/div>\r\n            <\/form>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\n    (function() {\r\n        if (window.lucide) lucide.createIcons();\r\n        const form = document.getElementById('premium-contact-form');\r\n        const successMsg = document.getElementById('form-success');\r\n\r\n        form.addEventListener('submit', function(e) {\r\n            e.preventDefault();\r\n            const btn = form.querySelector('.submit-btn');\r\n            btn.innerHTML = 'Wysy\u0142anie...';\r\n            btn.style.opacity = '0.7';\r\n\r\n            setTimeout(() => {\r\n                form.reset();\r\n                btn.innerHTML = 'Wy\u015blij zapytanie <i data-lucide=\"send\" size=\"18\"><\/i>';\r\n                btn.style.opacity = '1';\r\n                successMsg.style.display = 'block';\r\n                if (window.lucide) lucide.createIcons();\r\n                setTimeout(() => { successMsg.style.display = 'none'; }, 5000);\r\n            }, 1200);\r\n        });\r\n    })();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-67d4d7a e-flex e-con-boxed e-con e-parent\" data-id=\"67d4d7a\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-30aa122 elementor-widget elementor-widget-html\" data-id=\"30aa122\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<footer id=\"premium-footer\">\r\n    <style>\r\n        \/* Wymuszenie czcionki dla WSZYSTKICH element\u00f3w wewn\u0105trz stopki *\/\r\n        #premium-footer, \r\n        #premium-footer * {\r\n            font-family: 'Poppins', sans-serif !important;\r\n        }\r\n\r\n        #premium-footer {\r\n            background: #0a0a0c;\r\n            color: #ffffff;\r\n            padding: 80px 0 30px 0;\r\n            border-top: 1px solid rgba(255, 255, 255, 0.05);\r\n            position: relative;\r\n            overflow: hidden;\r\n        }\r\n\r\n        \/* Po\u015bwiata w tle *\/\r\n        #premium-footer::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: -150px;\r\n            right: -150px;\r\n            width: 300px;\r\n            height: 300px;\r\n            background: radial-gradient(circle, rgba(139, 92, 246, 0.12) 0%, transparent 70%);\r\n            pointer-events: none;\r\n        }\r\n\r\n        .footer-container {\r\n            max-width: 1200px;\r\n            margin: 0 auto;\r\n            padding: 0 30px;\r\n            display: grid;\r\n            grid-template-columns: 1.5fr 1fr 1fr 1.2fr;\r\n            gap: 40px;\r\n        }\r\n\r\n        \/* LOGO *\/\r\n        .footer-logo {\r\n            font-size: 24px;\r\n            font-weight: 700;\r\n            margin-bottom: 20px;\r\n            display: block;\r\n            text-decoration: none;\r\n            color: #fff !important;\r\n        }\r\n\r\n        .footer-logo span {\r\n            background: linear-gradient(135deg, #ec4899 0%, #8b5cf6 100%);\r\n            -webkit-background-clip: text;\r\n            -webkit-text-fill-color: transparent;\r\n        }\r\n\r\n        .footer-bio {\r\n            color: rgba(255, 255, 255, 0.6);\r\n            font-size: 14px;\r\n            line-height: 1.6;\r\n            margin-bottom: 25px;\r\n        }\r\n\r\n        \/* TYTU\u0141Y SEKCJI - Teraz na 100% Poppins *\/\r\n        .footer-heading {\r\n            font-size: 16px;\r\n            font-weight: 600;\r\n            margin-bottom: 25px;\r\n            color: #ffffff;\r\n            text-transform: none; \/* Zapobiega wymuszaniu wielkich liter przez niekt\u00f3re motywy *\/\r\n            letter-spacing: 0.5px;\r\n        }\r\n\r\n        \/* LINKI *\/\r\n        .footer-links {\r\n            list-style: none;\r\n            padding: 0;\r\n            margin: 0;\r\n        }\r\n\r\n        .footer-links li {\r\n            margin-bottom: 12px;\r\n        }\r\n\r\n        .footer-links a {\r\n            color: rgba(255, 255, 255, 0.6);\r\n            text-decoration: none;\r\n            font-size: 14px;\r\n            transition: all 0.3s ease;\r\n            display: inline-block;\r\n        }\r\n\r\n        .footer-links a:hover {\r\n            color: #ec4899;\r\n            padding-left: 5px;\r\n        }\r\n\r\n        \/* KONTAKT I SOCIALE *\/\r\n        .footer-contact-item {\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 12px;\r\n            color: rgba(255, 255, 255, 0.6);\r\n            font-size: 14px;\r\n            margin-bottom: 15px;\r\n        }\r\n\r\n        .social-icons {\r\n            display: flex;\r\n            gap: 15px;\r\n            margin-top: 25px;\r\n        }\r\n\r\n        .social-icons a {\r\n            width: 40px;\r\n            height: 40px;\r\n            background: rgba(255, 255, 255, 0.03);\r\n            border: 1px solid rgba(255, 255, 255, 0.08);\r\n            border-radius: 12px;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            color: white;\r\n            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\r\n            text-decoration: none;\r\n        }\r\n\r\n        .social-icons a:hover {\r\n            background: linear-gradient(135deg, #ec4899 0%, #8b5cf6 100%);\r\n            border-color: transparent;\r\n            transform: translateY(-5px);\r\n            box-shadow: 0 10px 20px rgba(236, 72, 153, 0.2);\r\n        }\r\n\r\n        \/* DOLNY PASEK *\/\r\n        .footer-bottom {\r\n            max-width: 1200px;\r\n            margin: 60px auto 0 auto;\r\n            padding: 30px 30px 0 30px;\r\n            border-top: 1px solid rgba(255, 255, 255, 0.05);\r\n            display: flex;\r\n            justify-content: space-between;\r\n            align-items: center;\r\n            font-size: 13px;\r\n            color: rgba(255, 255, 255, 0.4);\r\n        }\r\n\r\n        \/* RESPONSYWNO\u015a\u0106 *\/\r\n        @media (max-width: 991px) {\r\n            .footer-container { grid-template-columns: 1fr 1fr; }\r\n        }\r\n\r\n        @media (max-width: 600px) {\r\n            #premium-footer { padding: 60px 0 30px 0; }\r\n            .footer-container { grid-template-columns: 1fr; text-align: center; }\r\n            .footer-contact-item, .social-icons { justify-content: center; }\r\n            .footer-bottom { flex-direction: column; gap: 15px; text-align: center; }\r\n        }\r\n    <\/style>\r\n\r\n    <div class=\"footer-container\">\r\n        <div class=\"footer-col\">\r\n            <a href=\"\/\" class=\"footer-logo\">\r\n                Emilia<span>Ruszczyk<\/span>\r\n            <\/a>\r\n            <p class=\"footer-bio\">\r\n                Projektuj\u0119 nowoczesne do\u015bwiadczenia cyfrowe. Tworz\u0119 strony, kt\u00f3re \u0142\u0105cz\u0105 estetyk\u0119 z wysok\u0105 konwersj\u0105 i automatyzacj\u0105.\r\n            <\/p>\r\n        <\/div>\r\n\r\n\r\n        <div class=\"footer-col\">\r\n            <h4 class=\"footer-heading\">Eksploruj<\/h4>\r\n            <ul class=\"footer-links\">\r\n                <li><a href=\"https:\/\/showroom.emiliaruszczyk.pl\/\" target=\"_blank\" rel=\"noopener\">Showroom<\/a><\/li>\r\n                <li><a href=\"#polityka\">Polityka prywatno\u015bci<\/a><\/li>\r\n                <li><a href=\"#cookies\">Cookies<\/a><\/li>\r\n            <\/ul>\r\n        <\/div>\r\n\r\n        <div class=\"footer-col\">\r\n            <h4 class=\"footer-heading\">Kontakt<\/h4>\r\n            <div class=\"footer-contact-item\">\r\n                <i data-lucide=\"mail\" size=\"18\"><\/i>\r\n                ignisdigital@emiliaruszczyk.pl\r\n            <\/div>\r\n            <div class=\"social-icons\">\r\n                <a href=\"https:\/\/www.linkedin.com\/in\/emilia-ruszczyk-78055719a\/\" target=\"_blank\" rel=\"noopener\" aria-label=\"LinkedIn\">\r\n        <i data-lucide=\"linkedin\" size=\"20\"><\/i>\r\n    <\/a>\r\n                <a href=\"https:\/\/www.instagram.com\/nowoczesny_wymiar_stron\/\" target=\"_blank\" rel=\"noopener\" aria-label=\"Instagram\">\r\n        <i data-lucide=\"instagram\" size=\"20\"><\/i>\r\n    <\/a>\r\n                \r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"footer-bottom\">\r\n        <p>\u00a9 2026 Emilia Ruszczyk. Wszystkie prawa zastrze\u017cone.<\/p>\r\n        <p>Design & Code: Emilia Ruszczyk<\/p>\r\n    <\/div>\r\n<\/footer>\r\n\r\n<script>\r\n    if (window.lucide) lucide.createIcons();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>EmiliaRuszczyk SHOWROOM&nbsp; Bezp\u0142atna wycena \u2728 Diagnoza Sk\u00f3ry Online Odpowiedz na 2 pytania i dobierz rytua\u0142 pi\u0119kna \u2728 Diagnoza Sk\u00f3ry Online [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-236","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/showroom.emiliaruszczyk.pl\/index.php?rest_route=\/wp\/v2\/pages\/236","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/showroom.emiliaruszczyk.pl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/showroom.emiliaruszczyk.pl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/showroom.emiliaruszczyk.pl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/showroom.emiliaruszczyk.pl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=236"}],"version-history":[{"count":14,"href":"https:\/\/showroom.emiliaruszczyk.pl\/index.php?rest_route=\/wp\/v2\/pages\/236\/revisions"}],"predecessor-version":[{"id":267,"href":"https:\/\/showroom.emiliaruszczyk.pl\/index.php?rest_route=\/wp\/v2\/pages\/236\/revisions\/267"}],"wp:attachment":[{"href":"https:\/\/showroom.emiliaruszczyk.pl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=236"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}